diff --git a/packages/app-shell/src/auth-menu-button.js b/packages/app-shell/src/auth-menu-button.js
index 051e92c79c1f0ef1a80330d87e0e9eccf654f747..cbe2039fd30dca9a63a46925cca7592a4bb601a5 100644
--- a/packages/app-shell/src/auth-menu-button.js
+++ b/packages/app-shell/src/auth-menu-button.js
@@ -29,7 +29,7 @@ export class AuthMenuButton extends ScopedElementsMixin(AdapterLitElement) {
         return {
             ...super.properties,
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
             auth: {type: Object},
         };
     }
diff --git a/packages/app-shell/src/dbp-activity-example.js b/packages/app-shell/src/dbp-activity-example.js
index da3862ab0fdbad25dc4a0737490d0b7877cf36e0..42f00aec922aac318eb09f0403fdfcb053527fd2 100644
--- a/packages/app-shell/src/dbp-activity-example.js
+++ b/packages/app-shell/src/dbp-activity-example.js
@@ -13,7 +13,7 @@ class ActivityExample extends LitElement {
     static get properties() {
         return {
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
         };
     }
 
diff --git a/packages/app-shell/src/dbp-app-shell-welcome.js b/packages/app-shell/src/dbp-app-shell-welcome.js
index fcbb238a1c55e3f1e97f1f67dd03fd2924eea937..b2d376c4977392fe656b3f885eb0cd6353c4c55c 100644
--- a/packages/app-shell/src/dbp-app-shell-welcome.js
+++ b/packages/app-shell/src/dbp-app-shell-welcome.js
@@ -17,7 +17,7 @@ class AppShellWelcome extends ScopedElementsMixin(LitElement) {
     static get properties() {
         return {
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
         };
     }
 
diff --git a/packages/app-shell/src/tugraz-logo.js b/packages/app-shell/src/tugraz-logo.js
index 8f1d1bf88e642ce7380094fee3090b5290d5f9a2..c44bf465783de821e472ee185987cb9a7870811e 100644
--- a/packages/app-shell/src/tugraz-logo.js
+++ b/packages/app-shell/src/tugraz-logo.js
@@ -16,7 +16,7 @@ export class TUGrazLogo extends AdapterLitElement {
         return {
             ...super.properties,
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
         };
     }
 
diff --git a/packages/auth/src/auth-keycloak.js b/packages/auth/src/auth-keycloak.js
index f190cfaa40820eaeed6b5cc2644a7cd615454488..7208a9de74120a6ffd5ea0dac7657796c5c4e45a 100644
--- a/packages/auth/src/auth-keycloak.js
+++ b/packages/auth/src/auth-keycloak.js
@@ -186,7 +186,7 @@ export class AuthKeycloak extends AdapterLitElement {
         return {
             ...super.properties,
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
             forceLogin: {type: Boolean, attribute: 'force-login'},
             tryLogin: {type: Boolean, attribute: 'try-login'},
             entryPointUrl: {type: String, attribute: 'entry-point-url'},
diff --git a/packages/auth/src/dbp-auth-demo.js b/packages/auth/src/dbp-auth-demo.js
index 4116fbd862fc717e85c4405dc5cb8622cfa1d5f9..be5d7bd35b2f72a64f112f78395a7d2b20323972 100644
--- a/packages/auth/src/dbp-auth-demo.js
+++ b/packages/auth/src/dbp-auth-demo.js
@@ -29,7 +29,7 @@ export class DbpAuthDemo extends ScopedElementsMixin(DBPLitElement) {
         return {
             ...super.properties,
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
             entryPointUrl: {type: String, attribute: 'entry-point-url'},
             auth: {type: Object},
             noAuth: {type: Boolean, attribute: 'no-auth'},
diff --git a/packages/auth/src/login-button.js b/packages/auth/src/login-button.js
index db3580aba44d81ffb4bcdab1d64bc5698b2982a6..59f2776bf5df7cf2267903f2d183f538dd50abba 100644
--- a/packages/auth/src/login-button.js
+++ b/packages/auth/src/login-button.js
@@ -69,7 +69,7 @@ export class LoginButton extends ScopedElementsMixin(AdapterLitElement) {
     static get properties() {
         return {
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
             auth: {type: Object},
         };
     }
diff --git a/packages/common/src/translation.js b/packages/common/src/translation.js
index e79afe4c76cae581c49310be52e21ea86b1df092..ef9f67c22fb3611141f3b95e256cd79a47ea8db0 100644
--- a/packages/common/src/translation.js
+++ b/packages/common/src/translation.js
@@ -23,7 +23,7 @@ export class Translation extends DBPLitElement {
             ...super.properties,
             key: {type: String},
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
             interpolation: {type: Object, attribute: 'var'},
             unsafe: {type: Boolean, attribute: 'unsafe'},
         };
diff --git a/packages/data-table-view/src/data-table-view.js b/packages/data-table-view/src/data-table-view.js
index 7c477ae1800435d2a12653f888981b35aaaf003c..226ca976b98376bb262cec5a83efcc9c631b565d 100644
--- a/packages/data-table-view/src/data-table-view.js
+++ b/packages/data-table-view/src/data-table-view.js
@@ -54,7 +54,7 @@ export class DataTableView extends AdapterLitElement {
         return {
             ...super.properties,
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
             table: {type: Object, attribute: false},
             paging: {type: Boolean},
             searching: {type: Boolean},
diff --git a/packages/data-table-view/src/dbp-data-table-view-demo.js b/packages/data-table-view/src/dbp-data-table-view-demo.js
index f8589ac2df78fccf5ffdb38572daab1ce8dc2772..07b3ebb212f538e5475053692e67eb32dcaf390e 100644
--- a/packages/data-table-view/src/dbp-data-table-view-demo.js
+++ b/packages/data-table-view/src/dbp-data-table-view-demo.js
@@ -28,7 +28,7 @@ export class DataTableViewDemo extends ScopedElementsMixin(DBPLitElement) {
         return {
             ...super.properties,
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
             entryPointUrl: {type: String, attribute: 'entry-point-url'},
             noAuth: {type: Boolean, attribute: 'no-auth'},
         };
diff --git a/packages/file-handling/src/clipboard.js b/packages/file-handling/src/clipboard.js
index 2f9de3067137e10af574d9f4e7fa7d7dc444ec03..37faa22d12a4cd7fe00b04447bbab66984460c7d 100644
--- a/packages/file-handling/src/clipboard.js
+++ b/packages/file-handling/src/clipboard.js
@@ -66,7 +66,7 @@ export class Clipboard extends ScopedElementsMixin(AdapterLitElement) {
         return {
             ...super.properties,
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
             allowedMimeTypes: {type: String, attribute: 'allowed-mime-types'},
             clipboardSelectBtnDisabled: {type: Boolean},
             clipboardFiles: {type: Object, attribute: 'clipboard-files'},
diff --git a/packages/file-handling/src/demo.js b/packages/file-handling/src/demo.js
index 35304eef276340ade1de1bdb37b059bbe8eef893..c847d371c09f5034dc4cf702b9ac049a67b76125 100644
--- a/packages/file-handling/src/demo.js
+++ b/packages/file-handling/src/demo.js
@@ -26,7 +26,7 @@ export class FileSourceDemo extends ScopedElementsMixin(LitElement) {
     static get properties() {
         return {
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
             url: {type: String},
             selectedFiles: {type: Array, attribute: false},
             selectedFilesCount: {type: Number, attribute: false},
diff --git a/packages/file-handling/src/file-sink.js b/packages/file-handling/src/file-sink.js
index dfa8a1d6bf0d2933e66247d04f070ceddcf869df..fc1db0b7db17430a2738089a3f3e278d201223cc 100644
--- a/packages/file-handling/src/file-sink.js
+++ b/packages/file-handling/src/file-sink.js
@@ -59,7 +59,7 @@ export class FileSink extends ScopedElementsMixin(DbpFileHandlingLitElement) {
             ...super.properties,
             context: {type: String, attribute: 'context'},
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
             filename: {type: String},
             files: {type: Array, attribute: false},
             enabledTargets: {type: String, attribute: 'enabled-targets'},
diff --git a/packages/file-handling/src/file-source.js b/packages/file-handling/src/file-source.js
index 74c90a2b21f83abdbdea3248754f9e7b87303d8e..f77d2a8d63daa93c9a0f96e66e0b52ebabfe1107 100644
--- a/packages/file-handling/src/file-source.js
+++ b/packages/file-handling/src/file-source.js
@@ -80,7 +80,7 @@ export class FileSource extends ScopedElementsMixin(DbpFileHandlingLitElement) {
             ...super.properties,
             context: {type: String, attribute: 'context'},
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
             allowedMimeTypes: {type: String, attribute: 'allowed-mime-types'},
             enabledTargets: {type: String, attribute: 'enabled-targets'},
             nextcloudAuthUrl: {type: String, attribute: 'nextcloud-auth-url'},
diff --git a/packages/file-handling/src/nextcloud-file-picker.js b/packages/file-handling/src/nextcloud-file-picker.js
index 9027911dc978023df4198e5f7e2e64839bdb8988..50a9e14b004f67060422118a3881b524b35c6fcf 100644
--- a/packages/file-handling/src/nextcloud-file-picker.js
+++ b/packages/file-handling/src/nextcloud-file-picker.js
@@ -94,7 +94,7 @@ export class NextcloudFilePicker extends ScopedElementsMixin(DBPLitElement) {
         return {
             ...super.properties,
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
             auth: {type: Object},
             authUrl: {type: String, attribute: 'auth-url'},
             webDavUrl: {type: String, attribute: 'web-dav-url'},
diff --git a/packages/knowledge-base-web-page-element-view/src/dbp-knowledge-base-web-page-element-view-demo.js b/packages/knowledge-base-web-page-element-view/src/dbp-knowledge-base-web-page-element-view-demo.js
index 57a175f51f1c07bc5f5bf40722c7d35e4842e77f..8b8f5a05a526a9790cf7f47501178aad2be9e740 100644
--- a/packages/knowledge-base-web-page-element-view/src/dbp-knowledge-base-web-page-element-view-demo.js
+++ b/packages/knowledge-base-web-page-element-view/src/dbp-knowledge-base-web-page-element-view-demo.js
@@ -29,7 +29,7 @@ export class KnowledgeBaseWebPageElementViewDemo extends ScopedElementsMixin(DBP
         return {
             ...super.properties,
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
             entryPointUrl: {type: String, attribute: 'entry-point-url'},
             noAuth: {type: Boolean, attribute: 'no-auth'},
         };
diff --git a/packages/knowledge-base-web-page-element-view/src/knowledge-base-web-page-element-view.js b/packages/knowledge-base-web-page-element-view/src/knowledge-base-web-page-element-view.js
index 7cf248253347ef451165eedf1d627625d2ade6d8..3d063bbddcc55c9b0b2c4ee5dc199164a36492a9 100644
--- a/packages/knowledge-base-web-page-element-view/src/knowledge-base-web-page-element-view.js
+++ b/packages/knowledge-base-web-page-element-view/src/knowledge-base-web-page-element-view.js
@@ -47,7 +47,7 @@ export class KnowledgeBaseWebPageElementView extends ScopedElementsMixin(Adapter
     static get properties() {
         return {
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
             value: {type: String},
             html: {type: String, attribute: false},
             entryPointUrl: {type: String, attribute: 'entry-point-url'},
diff --git a/packages/language-select/src/language-select.js b/packages/language-select/src/language-select.js
index a13247789ca71c647509f780ed82554d2f5eada5..9d9acfba8038ab4b4449e5f9bf274b2814753f42 100644
--- a/packages/language-select/src/language-select.js
+++ b/packages/language-select/src/language-select.js
@@ -42,7 +42,7 @@ export class LanguageSelect extends AdapterLitElement {
     static get properties() {
         return {
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
             next: {type: String},
             languages: {type: Array},
         };
diff --git a/packages/matomo/src/dbp-matomo-demo.js b/packages/matomo/src/dbp-matomo-demo.js
index 735f69cd2e4fa33e90ecfd0002a475a3af73c117..8952d60e040b711d5620b53379fc12d914fece49 100644
--- a/packages/matomo/src/dbp-matomo-demo.js
+++ b/packages/matomo/src/dbp-matomo-demo.js
@@ -32,7 +32,7 @@ export class MatomoDemo extends ScopedElementsMixin(DBPLitElement) {
         return {
             ...super.properties,
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
             entryPointUrl: {type: String, attribute: 'entry-point-url'},
             matomoUrl: {type: String, attribute: 'matomo-url'},
             matomoSiteId: {type: Number, attribute: 'matomo-site-id'},
diff --git a/packages/notification/src/dbp-notification-demo.js b/packages/notification/src/dbp-notification-demo.js
index f60d038385000d77c94822b175b6cb842ecc3014..4978f69f5a5427ae887ddbd59ffdcb09f2d1f249 100644
--- a/packages/notification/src/dbp-notification-demo.js
+++ b/packages/notification/src/dbp-notification-demo.js
@@ -23,7 +23,7 @@ export class NotificationDemo extends ScopedElementsMixin(LitElement) {
     static get properties() {
         return {
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
         };
     }
 
diff --git a/packages/notification/src/notification.js b/packages/notification/src/notification.js
index 62bb22f77215d24c898ac6304c22174087f0726b..d29f74af0df146f625bff2f0239105ba0234abdb 100644
--- a/packages/notification/src/notification.js
+++ b/packages/notification/src/notification.js
@@ -22,7 +22,7 @@ export class Notification extends DBPLitElement {
         return {
             ...super.properties,
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
         };
     }
 
diff --git a/packages/person-profile/src/dbp-person-profile-demo.js b/packages/person-profile/src/dbp-person-profile-demo.js
index 06103df6afed363e7ff4adb194aa1043637e4912..2f68752228b5a82f290c99b8a9ca55f26b057faf 100644
--- a/packages/person-profile/src/dbp-person-profile-demo.js
+++ b/packages/person-profile/src/dbp-person-profile-demo.js
@@ -35,7 +35,7 @@ export class PersonProfileDemo extends ScopedElementsMixin(DBPLitElement) {
         return {
             ...super.properties,
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
             entryPointUrl: {type: String, attribute: 'entry-point-url'},
             person: {type: String, attribute: false},
             selectedPerson: {type: String, attribute: false},
diff --git a/packages/person-profile/src/person-profile.js b/packages/person-profile/src/person-profile.js
index 33349c576fa15e5ec949df8f6db5f8b1456bc5bc..b693ac80ec9334d4780f16839a9b0cff0e6b8de6 100644
--- a/packages/person-profile/src/person-profile.js
+++ b/packages/person-profile/src/person-profile.js
@@ -20,7 +20,7 @@ export class PersonProfile extends DBPLitElement {
     static get properties() {
         return {
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
             active: {type: Boolean, attribute: false},
             entryPointUrl: {type: String, attribute: 'entry-point-url'},
             value: {type: String},
diff --git a/packages/person-select/src/dbp-person-select-demo.js b/packages/person-select/src/dbp-person-select-demo.js
index ec93df7602bf64c022ba87b3b3ac6b8f15ca9dc5..26bec6759e7bbdffcc30dec8ef68a762602179bf 100644
--- a/packages/person-select/src/dbp-person-select-demo.js
+++ b/packages/person-select/src/dbp-person-select-demo.js
@@ -29,7 +29,7 @@ export class PersonSelectDemo extends ScopedElementsMixin(DBPLitElement) {
         return {
             ...super.properties,
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
             entryPointUrl: {type: String, attribute: 'entry-point-url'},
             noAuth: {type: Boolean, attribute: 'no-auth'},
         };
diff --git a/packages/person-select/src/person-select.js b/packages/person-select/src/person-select.js
index 6b4094544319744991191c8b12884c29c056e66d..ae481d3474e2e79f95fc6a9ab9735ca69868c350 100644
--- a/packages/person-select/src/person-select.js
+++ b/packages/person-select/src/person-select.js
@@ -63,7 +63,7 @@ export class PersonSelect extends ScopedElementsMixin(AdapterLitElement) {
         return {
             ...super.properties,
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
             active: {type: Boolean, attribute: false},
             entryPointUrl: {type: String, attribute: 'entry-point-url'},
             value: {type: String},
diff --git a/packages/provider/src/dbp-provider-demo.js b/packages/provider/src/dbp-provider-demo.js
index 21e482eaf0524e837e6c25ad1fefe8473c6676da..83824a198ec830d5dd3e65f59c5e609951ca01f7 100644
--- a/packages/provider/src/dbp-provider-demo.js
+++ b/packages/provider/src/dbp-provider-demo.js
@@ -32,7 +32,7 @@ class ProviderDemo extends ScopedElementsMixin(DBPLitElement) {
         return {
             ...super.properties,
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
         };
     }
 
diff --git a/packages/qr-code-scanner/src/dbp-qr-code-scanner-demo.js b/packages/qr-code-scanner/src/dbp-qr-code-scanner-demo.js
index a46517a935cb1d42dca4e5e64f375ed70ad2c286..43f6fdd70471dae4b180470f13761235c8b2ecf0 100644
--- a/packages/qr-code-scanner/src/dbp-qr-code-scanner-demo.js
+++ b/packages/qr-code-scanner/src/dbp-qr-code-scanner-demo.js
@@ -22,7 +22,7 @@ export class QrCodeScannerDemo extends ScopedElementsMixin(LitElement) {
     static get properties() {
         return {
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
         };
     }
 
diff --git a/packages/qr-code-scanner/src/qr-code-scanner.js b/packages/qr-code-scanner/src/qr-code-scanner.js
index 1ba8e2abf182fac01cfdb74d16259b3090c5c6a2..95e9e714489ff18ad62456885e7ba5d16ff0d228 100644
--- a/packages/qr-code-scanner/src/qr-code-scanner.js
+++ b/packages/qr-code-scanner/src/qr-code-scanner.js
@@ -153,7 +153,7 @@ export class QrCodeScanner extends ScopedElementsMixin(DBPLitElement) {
     static get properties() {
         return {
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
             showOutput: {type: Boolean, attribute: 'show-output'},
             stopScan: {type: Boolean, attribute: 'stop-scan'},
             matchRegex: {type: String, attribute: 'match-regex'},
diff --git a/packages/resource-select/src/dbp-resource-select-demo.js b/packages/resource-select/src/dbp-resource-select-demo.js
index bde2203dee96b009a04f3a556b242b3f525591d9..724085edd5d63d6a97653c2c9e2c83b99f94387b 100644
--- a/packages/resource-select/src/dbp-resource-select-demo.js
+++ b/packages/resource-select/src/dbp-resource-select-demo.js
@@ -29,7 +29,7 @@ export class ResourceSelectDemo extends ScopedElementsMixin(DBPLitElement) {
         return {
             ...super.properties,
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
             entryPointUrl: {type: String, attribute: 'entry-point-url'},
             noAuth: {type: Boolean, attribute: 'no-auth'},
         };
diff --git a/packages/resource-select/src/resource-select.js b/packages/resource-select/src/resource-select.js
index c5ee3c0c7448c2164acd4bf6f8887e3f190728cb..6bec253d6db9fa5ed4adbc6473f7a845e6882b64 100644
--- a/packages/resource-select/src/resource-select.js
+++ b/packages/resource-select/src/resource-select.js
@@ -35,7 +35,7 @@ export class ResourceSelect extends AdapterLitElement {
         return {
             ...super.properties,
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
             auth: {type: Object},
             entryPointUrl: {type: String, attribute: 'entry-point-url'},
             resourcePath: {type: String, attribute: 'resource-path'},
diff --git a/packages/theme-switcher/src/theme-switcher.js b/packages/theme-switcher/src/theme-switcher.js
index a162d8ba901dc3095e895e3bb1ea003b39d338c3..e699794774b3555c5de3c518ddf669178b5bda79 100644
--- a/packages/theme-switcher/src/theme-switcher.js
+++ b/packages/theme-switcher/src/theme-switcher.js
@@ -24,7 +24,7 @@ export class ThemeSwitcher extends ScopedElementsMixin(AdapterLitElement) {
         return {
             ...super.properties,
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
             themes: {type: Array, attribute: 'themes'},
             darkModeThemeOverride: {type: String, attribute: 'dark-mode-theme-override'},
             dropdownRight: {type: Boolean, attribute: 'dropdown-right'},
@@ -64,6 +64,8 @@ export class ThemeSwitcher extends ScopedElementsMixin(AdapterLitElement) {
         if(this.langDir != '') {
           setOverridesByGlobalCache(this._i18n, this);
         }
+
+        console.log(this.langDir);
     }
 
     detectInitialMode() {
diff --git a/packages/tooltip/src/dbp-tooltip-demo.js b/packages/tooltip/src/dbp-tooltip-demo.js
index d62fc27fc81b8c478b5af151fb8ef6468ede9b78..ee37edc2a96b7e558c71bd539d3502762a7f26c5 100644
--- a/packages/tooltip/src/dbp-tooltip-demo.js
+++ b/packages/tooltip/src/dbp-tooltip-demo.js
@@ -28,7 +28,7 @@ export class TooltipDemo extends ScopedElementsMixin(DBPLitElement) {
         return {
             ...super.properties,
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
         };
     }
 
diff --git a/packages/typescript-example/src/typescript-example.ts b/packages/typescript-example/src/typescript-example.ts
index a80bb0de4d1d56623039a319cf569a071059c219..bb4485a687b79a1c445c538256aa69f66e3393dd 100644
--- a/packages/typescript-example/src/typescript-example.ts
+++ b/packages/typescript-example/src/typescript-example.ts
@@ -16,7 +16,7 @@ export class TypeScriptExample extends LitElement {
     static get properties() {
         return {
             lang: {type: String},
-            langDir: {type: String},
+            langDir: {type: String, attribute: 'lang-dir'},
         };
     }