v2.3.4

.gitlab-ci.yml

@@ -1,128 +0,0 @@
-# gitzone ci_default
-image: registry.gitlab.com/hosttoday/ht-docker-node:npmci
-
-cache:
-  paths:
-    - .npmci_cache/
-  key: '$CI_BUILD_STAGE'
-
-stages:
-  - security
-  - test
-  - release
-  - metadata
-
-before_script:
-  - pnpm install -g pnpm
-  - pnpm install -g @shipzone/npmci
-  - npmci npm prepare
-
-# ====================
-# security stage
-# ====================
-# ====================
-# security stage
-# ====================
-auditProductionDependencies:
-  image: registry.gitlab.com/hosttoday/ht-docker-node:npmci
-  stage: security
-  script:
-     - npmci command npm config set registry https://registry.npmjs.org
-     - npmci command pnpm audit --audit-level=high --prod
-  tags:
-    - lossless
-    - docker
-  allow_failure: true
-
-auditDevDependencies:
-  image: registry.gitlab.com/hosttoday/ht-docker-node:npmci
-  stage: security
-  script:
-    - npmci command npm config set registry https://registry.npmjs.org
-    - npmci command pnpm audit --audit-level=high --dev
-  tags:
-    - lossless
-    - docker
-  allow_failure: true
-
-# ====================
-# test stage
-# ====================
-
-testStable:
-  stage: test
-  script:
-    - npmci node install stable
-    - npmci npm install
-    - npmci npm test
-  coverage: /\d+.?\d+?\%\s*coverage/
-  tags:
-    - docker
-
-testBuild:
-  stage: test
-  script:
-    - npmci node install stable
-    - npmci npm install
-    - npmci npm build
-  coverage: /\d+.?\d+?\%\s*coverage/
-  tags:
-    - docker
-
-release:
-  stage: release
-  script:
-    - npmci node install stable
-    - npmci npm publish
-  only:
-    - tags
-  tags:
-    - lossless
-    - docker
-    - notpriv
-
-# ====================
-# metadata stage
-# ====================
-codequality:
-  stage: metadata
-  allow_failure: true
-  only:
-    - tags
-  script:
-    - npmci command npm install -g typescript
-    - npmci npm prepare
-    - npmci npm install
-  tags:
-    - lossless
-    - docker
-    - priv
-
-trigger:
-  stage: metadata
-  script:
-    - npmci trigger
-  only:
-    - tags
-  tags:
-    - lossless
-    - docker
-    - notpriv
-
-pages:
-  stage: metadata
-  script:
-    - npmci node install stable
-    - npmci npm install
-    - npmci command npm run buildDocs
-  tags:
-    - lossless
-    - docker
-    - notpriv
-  only:
-    - tags
-  artifacts:
-    expire_in: 1 week
-    paths:
-      - public
-  allow_failure: true

changelog.md

@@ -0,0 +1,381 @@
+# Changelog
+
+## 2025-11-16 - 2.3.4 - fix(domtools)
+Prevent race conditions during DomTools initialization and improve runOnce error handling
+
+- Add a static initializationPromise to serialize and await concurrent DomTools.setupDomTools() calls to avoid race conditions when multiple initializations are requested.
+- Initialize Keyboard only after the document is ready (check document.readyState and use readystatechange listener) so document.body/head are available before creating the Keyboard instance; resolve domReady and domToolsReady appropriately.
+- Support ignoreGlobal path to create isolated DomTools instances while keeping global initialization guarded by initializationPromise.
+- Enhance runOnce: store errors from the first execution and re-throw them to all waiting callers; always clear the running flag in a finally block to prevent permanent stuck state.
+
+## 2025-06-20 - 2.3.3 - fix(package.json)
+Update dependency versions and add pnpm package manager field
+
+- Update @git.zone/tsbuild from ^2.2.1 to ^2.6.4
+- Update @git.zone/tsbundle from ^2.2.5 to ^2.4.0
+- Update @git.zone/tstest from ^1.0.96 to ^2.3.1
+- Update @push.rocks/tapbundle from ^5.5.6 to ^6.0.3
+- Update @push.rocks/lik from ^6.1.0 to ^6.2.2
+- Update @push.rocks/smartpromise from ^4.2.2 to ^4.2.3
+- Update @push.rocks/smartrx from ^3.0.7 to ^3.0.10
+- Update @push.rocks/smartstate from ^2.0.19 to ^2.0.20
+- Update lenis from ^1.1.20 to ^1.3.4
+- Update lit from ^3.2.1 to ^3.3.0
+- Add packageManager field for pnpm
+
+## 2025-02-01 - 2.3.2 - fix(scroller)
+Rename method from scrollToElement to toElement for consistency
+
+- Updated method name in Scroller class for better coherence with existing naming conventions.
+
+## 2025-01-31 - 2.3.1 - fix(scroller)
+Removed passive option from scroll event listener
+
+- The 'passive: true' option was removed from the native scroll event listener attachment.
+
+## 2025-01-31 - 2.3.0 - feat(scroller)
+Enhance Scroller class with callback execution and adaptive scroll listener
+
+- Added support for executing scroll callbacks in the Scroller class.
+- Integrated adaptive scrolling mechanism using Lenis, with native smooth scrolling detection.
+- Ensured seamless switching between native scroll listener and Lenis scroll listener.
+
+## 2025-01-31 - 2.2.0 - feat(core)
+Enhance scrolling capabilities by integrating Scroller class and adding lenis support
+
+- Replaced SweetScroll setup in domtools.classes.domtools.ts with Scroller class.
+- Moved SweetScroll initialization and methods to new Scroller class.
+- Added lenis support in the Scroller class for enhanced scrolling capabilities.
+- Updated dev and dependencies versions in package.json.
+
+## 2025-01-09 - 2.1.1 - fix(themamanager)
+Fixed automatic global theme change subscription for background updates.
+
+- Corrected the logic for updating the document's background color upon theme changes using themeObservable subscription.
+
+## 2025-01-09 - 2.1.0 - feat(themeManager)
+Exposed method to enable automatic global theme change.
+
+- Enable easier application of dark and bright themes by exposing a method.
+- Updated devDependencies and dependencies in package.json to latest versions.
+
+## 2024-10-21 - 2.0.65 - fix(ThemeManager)
+Refactor ThemeManager class to separate global style setting logic
+
+- Moved logic to set global styles into a dedicated function setGlobalStylesOnPurpose in ThemeManager.
+
+## 2024-10-06 - 2.0.64 - fix(pluginexports)
+Add missing import for smartrouter in pluginexports.
+
+- Fixed a missing import for smartrouter in ts/domtools.pluginexports.ts.
+
+## 2024-10-06 - 2.0.63 - fix(dependencies)
+Update @push.rocks/smartrouter to version ^1.3.2 for better compatibility
+
+- Updated @push.rocks/smartrouter from version ^1.2.1 to ^1.3.2 in package.json.
+
+## 2024-10-06 - 2.0.62 - fix(dependencies)
+Update dependencies to resolve potential issues and improve stability
+
+
+## 2024-10-04 - 2.0.61 - fix(core)
+Correct import statement for SweetScroll.
+
+- Fix import syntax for SweetScroll in domtools.pluginexports.ts
+
+## 2024-10-02 - 2.0.60 - fix(dependencies)
+Update dependencies to latest versions
+
+- Bump @git.zone/tsbuild version from 2.1.82 to 2.1.84
+- Bump @push.rocks/tapbundle version from 5.0.23 to 5.3.0
+- Bump @types/node version from 20.14.9 to 22.7.4
+- Bump @api.global/typedrequest version from 3.0.30 to 3.0.32
+- Bump @push.rocks/smartstate version from 2.0.17 to 2.0.18
+- Bump lit version from 3.1.4 to 3.2.0
+
+## 2024-10-02 - 2.0.59 - fix(core)
+Refactor plugin exports to improve modularity
+
+- Refactored the plugin exports to be more modular and organized.
+- Replaced redundant plugin object definition in ts/index.ts with a simpler import and export pattern.
+
+## 2024-07-01 - 2.0.58 - fix(dependencies)
+Update dependencies and correct font family in styles
+
+- Updated @git.zone/tsbuild to ^2.1.82
+- Updated @git.zone/tstest to ^1.0.90
+- Updated @push.rocks/tapbundle to ^5.0.23
+- Updated @types/node to ^20.14.9
+- Updated @api.global/typedrequest to ^3.0.30
+- Updated @design.estate/dees-comms to ^1.0.27
+- Updated @push.rocks/lik to ^6.0.15
+- Updated @push.rocks/smartjson to ^5.0.20
+- Updated @push.rocks/smartpromise to ^4.0.4
+- Updated @push.rocks/webrequest to ^3.0.37
+- Updated @push.rocks/webstore to ^2.0.20
+- Updated lit to ^3.1.4
+- Updated default font family to 'Geist Sans', 'Inter', sans-serif
+
+## 2024-04-20 - 2.0.57 - Documentation
+Update to project documentation
+
+- Updated existing documentation to reflect recent changes
+
+## 2023-10-23 - 2.0.42...2.0.55 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+- Fix(core): update
+- ...
+
+## 2023-10-07 - 2.0.41...2.0.51 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+- Fix(core): update
+- ...
+
+## 2023-09-17 - 2.0.40 - Core
+Fixes in core functionality
+
+- Fix(core): update
+
+## 2023-08-07 - 2.0.36...2.0.38 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+- Fix(core): update
+- ...
+
+## 2023-04-05 - 2.0.28...2.0.30 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+- Fix(core): update
+- ...
+
+## 2023-01-07 - 2.0.26...2.0.27 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+
+## 2022-12-31 - 2.0.24...2.0.25 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+
+## 2022-08-01 - 2.0.22...2.0.23 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+
+## 2022-05-01 - 2.0.19...2.0.21 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+- Fix(core): update
+- ...
+
+## 2022-04-22 - 2.0.18...2.0.19 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+
+## 2022-04-21 - 2.0.10...2.0.17 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+- Fix(core): update
+- ...
+
+## 2022-03-18 - 2.0.0 - Core
+Major release
+
+- Fix(core): update
+
+## 2021-11-21 - 1.0.98...1.0.99 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+
+## 2021-09-16 - 1.0.94...1.0.95 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+
+## 2021-09-08 - 1.0.91...1.0.93 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+- Fix(core): update
+- ...
+
+## 2021-09-01 - 1.0.89...1.0.90 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+
+## 2021-08-19 - 1.0.87 - Core
+Fixes in core functionality
+
+- Fix(core): update
+
+## 2021-03-10 - 1.0.84...1.0.86 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+- Fix(core): update
+- ...
+
+## 2020-12-07 - 1.0.79...1.0.83 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+- Fix(core): update
+- ...
+
+## 2020-11-30 - 1.0.74...1.0.77 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+- Fix(core): update
+- ...
+
+## 2020-11-24 - 1.0.66...1.0.70 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+- Fix(core): update
+- ...
+
+## 2020-11-23 - 1.0.64...1.0.65 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+
+## 2020-11-06 - 1.0.61...1.0.63 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+- Fix(core): update
+- ...
+
+## 2020-10-07 - 1.0.53...1.0.55 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+- Fix(core): update
+- ...
+
+## 2020-09-16 - 1.0.49...1.0.52 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+- Fix(core): update
+- ...
+
+## 2020-09-13 - 1.0.45...1.0.47 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+- Fix(core): update
+- ...
+
+## 2020-09-12 - 1.0.41...1.0.44 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+- Fix(core): update
+- ...
+
+## 2020-07-27 - 1.0.38...1.0.40 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+- Fix(core): update
+- ...
+
+## 2020-06-28 - 1.0.29...1.0.36 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+- Fix(core): update
+- ...
+
+## 2020-06-03 - 1.0.26...1.0.28 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+- Fix(core): update
+- ...
+
+## 2020-05-28 - 1.0.21...1.0.25 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+- Fix(core): update
+- ...
+
+## 2020-05-27 - 1.0.18...1.0.20 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+- Fix(core): update
+- ...
+
+## 2020-05-26 - 1.0.16...1.0.17 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+
+## 2020-05-25 - 1.0.14...1.0.15 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+
+## 2020-05-24 - 1.0.11...1.0.13 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+- Fix(core): update
+- ...
+
+## 2020-05-23 - 1.0.3...1.0.10 - Core
+Multiple updates and fixes
+
+- Fix(core): update
+- Fix(core): update
+- Fix(core): update
+- ...

npmextra.json

@@ -2,17 +2,36 @@
   "gitzone": {
     "projectType": "npm",
     "module": {
-      "githost": "gitlab.com",
+      "githost": "code.foss.global",
       "gitscope": "design.estate",
       "gitrepo": "dees-domtools",
-      "description": "tools to simplify complex css structures",
+      "description": "A package providing tools to simplify complex CSS structures and web development tasks, featuring TypeScript support and integration with various web technologies.",
       "npmPackagename": "@design.estate/dees-domtools",
       "license": "MIT",
-      "projectDomain": "design.estate"
+      "projectDomain": "design.estate",
+      "keywords": [
+        "CSS tools",
+        "web development",
+        "TypeScript support",
+        "CSS structure simplification",
+        "web components",
+        "theme management",
+        "DOM manipulation",
+        "responsive design",
+        "design system",
+        "lit element",
+        "keyboard event handling",
+        "state management",
+        "routing",
+        "performance optimization"
+      ]
     }
   },
   "npmci": {
     "npmGlobalTools": [],
     "npmAccessLevel": "public"
+  },
+  "tsdoc": {
+    "legal": "\n## License and Legal Information\n\nThis repository contains open-source code that is licensed under the MIT License. A copy of the MIT License can be found in the [license](license) file within this repository. \n\n**Please note:** The MIT License does not grant permission to use the trade names, trademarks, service marks, or product names of the project, except as required for reasonable and customary use in describing the origin of the work and reproducing the content of the NOTICE file.\n\n### Trademarks\n\nThis project is owned and maintained by Task Venture Capital GmbH. The names and logos associated with Task Venture Capital GmbH and any related products or services are trademarks of Task Venture Capital GmbH and are not included within the scope of the MIT license granted herein. Use of these trademarks must comply with Task Venture Capital GmbH's Trademark Guidelines, and any usage must be approved in writing by Task Venture Capital GmbH.\n\n### Company Information\n\nTask Venture Capital GmbH  \nRegistered at District court Bremen HRB 35230 HB, Germany\n\nFor any legal inquiries or if you require further information, please contact us via email at hello@task.vc.\n\nBy using this repository, you acknowledge that you have read this section, agree to comply with its terms, and understand that the licensing of the code does not imply endorsement by Task Venture Capital GmbH of any derivative works.\n"
   }
 }

package.json

@@ -1,8 +1,8 @@
 {
   "name": "@design.estate/dees-domtools",
-  "version": "2.0.41",
+  "version": "2.3.4",
   "private": false,
-  "description": "tools to simplify complex css structures",
+  "description": "A package providing tools to simplify complex CSS structures and web development tasks, featuring TypeScript support and integration with various web technologies.",
   "main": "dist_ts/index.js",
   "typings": "dist_ts/index.d.ts",
   "type": "module",
@@ -15,27 +15,30 @@
     "buildDocs": "tsdoc"
   },
   "devDependencies": {
-    "@git.zone/tsbuild": "^2.1.70",
+    "@git.zone/tsbuild": "^2.6.4",
-    "@git.zone/tsbundle": "^2.0.8",
+    "@git.zone/tsbundle": "^2.4.0",
-    "@git.zone/tstest": "^1.0.81",
+    "@git.zone/tstest": "^2.3.1",
-    "@push.rocks/tapbundle": "^5.0.15",
+    "@push.rocks/tapbundle": "^6.0.3",
-    "@types/node": "^20.6.0"
+    "@types/node": "^22.12.0"
   },
   "dependencies": {
-    "@api.global/typedrequest": "^3.0.1",
+    "@api.global/typedrequest": "^3.1.10",
-    "@design.estate/dees-comms": "^1.0.22",
+    "@design.estate/dees-comms": "^1.0.27",
-    "@push.rocks/lik": "^6.0.5",
+    "@push.rocks/lik": "^6.2.2",
     "@push.rocks/smartdelay": "^3.0.5",
-    "@push.rocks/smartjson": "^5.0.10",
+    "@push.rocks/smartjson": "^5.0.20",
-    "@push.rocks/smartpromise": "^4.0.2",
+    "@push.rocks/smartmarkdown": "^3.0.3",
-    "@push.rocks/smartrouter": "^1.0.16",
+    "@push.rocks/smartpromise": "^4.2.3",
-    "@push.rocks/smartrx": "^3.0.6",
+    "@push.rocks/smartrouter": "^1.3.2",
-    "@push.rocks/smartstate": "^2.0.8",
+    "@push.rocks/smartrx": "^3.0.10",
-    "@push.rocks/smarturl": "^3.0.6",
+    "@push.rocks/smartstate": "^2.0.20",
-    "@push.rocks/webrequest": "^3.0.33",
+    "@push.rocks/smartstring": "^4.0.15",
+    "@push.rocks/smarturl": "^3.1.0",
+    "@push.rocks/webrequest": "^3.0.37",
     "@push.rocks/websetup": "^3.0.19",
-    "@push.rocks/webstore": "^2.0.9",
+    "@push.rocks/webstore": "^2.0.20",
-    "lit": "^2.8.0",
+    "lenis": "^1.3.4",
+    "lit": "^3.3.0",
     "sweet-scroll": "^4.0.0"
   },
   "files": [
@@ -52,5 +55,22 @@
   ],
   "browserslist": [
     "last 1 chrome versions"
-  ]
+  ],
+  "keywords": [
+    "CSS tools",
+    "web development",
+    "TypeScript support",
+    "CSS structure simplification",
+    "web components",
+    "theme management",
+    "DOM manipulation",
+    "responsive design",
+    "design system",
+    "lit element",
+    "keyboard event handling",
+    "state management",
+    "routing",
+    "performance optimization"
+  ],
+  "packageManager": "pnpm@10.11.0+sha512.6540583f41cc5f628eb3d9773ecee802f4f9ef9923cc45b69890fb47991d4b092964694ec3a4f738a420c918a333062c8b925d312f42e4f0c263eb603551f977"
 }

readme.hints.md

@@ -0,0 +1 @@
+ 

readme.md

@@ -1,37 +1,491 @@
-# @designestate/dees-domtools
+# @design.estate/dees-domtools
-tools to simplify complex css structures
 
-## Availabililty and Links
+> 🎨 A comprehensive TypeScript toolkit for simplifying DOM manipulation, CSS management, and web component development
-* [npmjs.org (npm package)](https://www.npmjs.com/package/@designestate/dees-domtools)
-* [gitlab.com (source)](https://gitlab.com/designestate/dees-domtools)
-* [github.com (source mirror)](https://github.com/designestate/dees-domtools)
-* [docs (typedoc)](https://designestate.gitlab.io/dees-domtools/)
 
-## Status for master
+Modern web development made elegant. `@design.estate/dees-domtools` provides a powerful suite of utilities for managing complex CSS structures, handling browser events, implementing smooth scrolling, and building responsive web applications with ease.
 
-Status Category | Status Badge
+## Features
--- | --
-GitLab Pipelines | [![pipeline status](https://gitlab.com/designestate/dees-domtools/badges/master/pipeline.svg)](https://lossless.cloud)
-GitLab Pipline Test Coverage | [![coverage report](https://gitlab.com/designestate/dees-domtools/badges/master/coverage.svg)](https://lossless.cloud)
-npm | [![npm downloads per month](https://badgen.net/npm/dy/@designestate/dees-domtools)](https://lossless.cloud)
-Snyk | [![Known Vulnerabilities](https://badgen.net/snyk/designestate/dees-domtools)](https://lossless.cloud)
-TypeScript Support | [![TypeScript](https://badgen.net/badge/TypeScript/>=%203.x/blue?icon=typescript)](https://lossless.cloud)
-node Support | [![node](https://img.shields.io/badge/node->=%2010.x.x-blue.svg)](https://nodejs.org/dist/latest-v10.x/docs/api/)
-Code Style | [![Code Style](https://badgen.net/badge/style/prettier/purple)](https://lossless.cloud)
-PackagePhobia (total standalone install weight) | [![PackagePhobia](https://badgen.net/packagephobia/install/@designestate/dees-domtools)](https://lossless.cloud)
-PackagePhobia (package size on registry) | [![PackagePhobia](https://badgen.net/packagephobia/publish/@designestate/dees-domtools)](https://lossless.cloud)
-BundlePhobia (total size when bundled) | [![BundlePhobia](https://badgen.net/bundlephobia/minzip/@designestate/dees-domtools)](https://lossless.cloud)
 
-## Usage
+🚀 **Smart DOM Management** - Singleton-based DomTools instance with race-condition-free initialization
+📱 **Responsive Breakpoints** - Built-in support for desktop, tablet, phablet, and phone viewports with container queries
+🎭 **Theme Management** - Automatic dark/light mode detection and switching with RxJS observables
+⌨️ **Keyboard Shortcuts** - Elegant keyboard event handling with combo support
+📜 **Smooth Scrolling** - Native and Lenis-powered smooth scrolling with automatic detection
+🎯 **State Management** - Integrated state management with smartstate
+🧭 **Routing** - Client-side routing with smartrouter
+🌐 **WebSetup** - Easy management of website metadata, favicons, and SEO tags
+💅 **CSS Utilities** - Grid helpers, breakpoint utilities, and base styles for web components
 
-Use TypeScript for best in class intellisense
+## Installation
 
-## Contribution
+```bash
+npm install @design.estate/dees-domtools
+```
 
-We are always happy for code contributions. If you are not the code contributing type that is ok. Still, maintaining Open Source repositories takes considerable time and thought. If you like the quality of what we do and our modules are useful to you we would appreciate a little monthly contribution: You can [contribute one time](https://lossless.link/contribute-onetime) or [contribute monthly](https://lossless.link/contribute). :)
+Or with pnpm:
 
-For further information read the linked docs at the top of this readme.
+```bash
+pnpm add @design.estate/dees-domtools
+```
 
-## Legal
+## Quick Start
-> MIT licensed | **©** [Task Venture Capital GmbH](https://task.vc)
+
-| By using this npm module you agree to our [privacy policy](https://lossless.gmbH/privacy)
+```typescript
+import { DomTools } from '@design.estate/dees-domtools';
+
+// Initialize DomTools (singleton pattern - safe to call multiple times)
+const domtools = await DomTools.setupDomTools();
+
+// Wait for DOM to be ready
+await domtools.domReady.promise;
+
+// Now you're ready to rock! 🎸
+console.log('DOM is ready, head and body elements are available');
+```
+
+## Core API
+
+### DomTools Instance
+
+The `DomTools` class is the heart of the library. It provides a singleton instance that manages all the utilities.
+
+```typescript
+import { DomTools } from '@design.estate/dees-domtools';
+
+// Setup with options
+const domtools = await DomTools.setupDomTools({
+  ignoreGlobal: false // Set to true to create isolated instance
+});
+
+// Access DOM elements (available after domReady)
+await domtools.domReady.promise;
+const head = domtools.elements.headElement;
+const body = domtools.elements.bodyElement;
+```
+
+**Key Properties:**
+
+- `domtools.router` - SmartRouter instance for client-side routing
+- `domtools.themeManager` - Theme management (dark/light mode)
+- `domtools.scroller` - Smooth scrolling utilities
+- `domtools.keyboard` - Keyboard event handling
+- `domtools.websetup` - Website metadata management
+- `domtools.smartstate` - State management
+- `domtools.deesComms` - Communication utilities
+
+**Lifecycle Promises:**
+
+- `domtools.domToolsReady.promise` - Resolves when DomTools is initialized
+- `domtools.domReady.promise` - Resolves when DOM is interactive/complete
+- `domtools.globalStylesReady.promise` - Resolves when global styles are set
+
+### Responsive Breakpoints
+
+Built-in breakpoint system with both media queries and container queries:
+
+```typescript
+import { breakpoints, css } from '@design.estate/dees-domtools';
+import { css as litCss } from 'lit';
+
+// Breakpoint values (in pixels)
+breakpoints.desktop   // 1600px
+breakpoints.notebook  // 1240px
+breakpoints.tablet    // 1024px
+breakpoints.phablet   // 600px
+breakpoints.phone     // 400px
+
+// Use with Lit components
+const myStyles = litCss`
+  .container {
+    padding: 20px;
+  }
+
+  ${breakpoints.cssForTablet(litCss`
+    .container {
+      padding: 10px;
+    }
+  `)}
+
+  ${breakpoints.cssForPhone(litCss`
+    .container {
+      padding: 5px;
+    }
+  `)}
+`;
+```
+
+Available breakpoint helpers:
+- `cssForDesktop(css)` - Styles for 1600px and above
+- `cssForNotebook(css)` - Styles for 1240px and below
+- `cssForTablet(css)` - Styles for 1024px and below
+- `cssForPhablet(css)` - Styles for 600px and below
+- `cssForPhone(css)` - Styles for 400px and below
+
+### Theme Management
+
+Automatic theme detection with system preference support:
+
+```typescript
+const domtools = await DomTools.setupDomTools();
+const { themeManager } = domtools;
+
+// Toggle between dark and light
+themeManager.toggleDarkBright();
+
+// Set specific theme
+themeManager.goDark();
+themeManager.goBright();
+
+// Enable automatic global background changes
+await themeManager.enableAutomaticGlobalThemeChange();
+
+// Subscribe to theme changes
+themeManager.themeObservable.subscribe((isBright) => {
+  console.log(`Theme is now: ${isBright ? 'light' : 'dark'}`);
+});
+
+// Check current theme
+if (themeManager.goBrightBoolean) {
+  console.log('Light mode active');
+}
+```
+
+### Keyboard Shortcuts
+
+Handle keyboard events with ease, including complex combinations:
+
+```typescript
+import { Keyboard, Key } from '@design.estate/dees-domtools';
+
+const domtools = await DomTools.setupDomTools();
+await domtools.domReady.promise;
+
+// Access the keyboard instance
+const { keyboard } = domtools;
+
+// Listen for Ctrl+S
+keyboard.on([Key.Ctrl, Key.S]).subscribe((event) => {
+  event.preventDefault();
+  console.log('Save triggered!');
+});
+
+// Listen for Ctrl+Shift+P
+keyboard.on([Key.Ctrl, Key.Shift, Key.P]).subscribe(() => {
+  console.log('Command palette opened!');
+});
+
+// Programmatically trigger key presses
+keyboard.triggerKeyPress([Key.Ctrl, Key.S]);
+
+// Clean up when done
+keyboard.stopListening();
+```
+
+**Available Keys:**
+
+All standard keyboard keys are available in the `Key` enum, including:
+- Modifiers: `Ctrl`, `Shift`, `Alt`
+- Letters: `A` through `Z`
+- Numbers: `Zero` through `Nine`
+- Function keys: `F1` through `F12`
+- Navigation: `Home`, `End`, `PageUp`, `PageDown`, arrows
+- And many more...
+
+### Smooth Scrolling
+
+Powerful scrolling utilities with Lenis integration:
+
+```typescript
+const domtools = await DomTools.setupDomTools();
+const { scroller } = domtools;
+
+// Scroll to an element smoothly
+const targetElement = document.querySelector('#section-2');
+await scroller.toElement(targetElement, {
+  duration: 1000,
+  easing: 'easeInOutQuad'
+});
+
+// Enable Lenis smooth scrolling
+await scroller.enableLenisScroll({
+  disableOnNativeSmoothScroll: true // Auto-disable if browser has native smooth scroll
+});
+
+// Register scroll callbacks
+scroller.onScroll(() => {
+  console.log('Page scrolled!');
+});
+
+// Detect if native smooth scrolling is enabled
+const hasNativeSmooth = await scroller.detectNativeSmoothScroll();
+```
+
+### CSS Utilities
+
+Helper functions for common CSS patterns:
+
+```typescript
+import { css } from '@design.estate/dees-domtools';
+
+// Create responsive grid columns
+const gridTemplate = css.cssGridColumns(4, 16);
+// Returns: calc((100%/4) - (48px/4)) calc((100%/4) - (48px/4)) ...
+
+// Use in your styles
+const styles = `
+  .grid {
+    display: grid;
+    grid-template-columns: ${gridTemplate};
+    gap: 16px;
+  }
+`;
+```
+
+### Global Styles & External Resources
+
+```typescript
+const domtools = await DomTools.setupDomTools();
+
+// Add global CSS
+await domtools.setGlobalStyles(`
+  body {
+    margin: 0;
+    font-family: 'Inter', sans-serif;
+  }
+`);
+
+// Load external CSS
+await domtools.setExternalCss('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap');
+
+// Load external JavaScript
+await domtools.setExternalScript('https://cdn.example.com/analytics.js');
+```
+
+### Website Metadata
+
+Manage your website's metadata easily:
+
+```typescript
+const domtools = await DomTools.setupDomTools();
+
+await domtools.setWebsiteInfo({
+  metaObject: {
+    title: 'My Awesome App',
+    description: 'The best app ever created',
+    keywords: ['awesome', 'app', 'web'],
+    author: 'Your Name'
+  },
+  faviconUrl: '/favicon.ico',
+  appleTouchIconUrl: '/apple-touch-icon.png'
+});
+```
+
+### Web Component Base Styles
+
+Kickstart your Lit elements with pre-configured styles:
+
+```typescript
+import { LitElement } from 'lit';
+import { elementBasic } from '@design.estate/dees-domtools';
+
+class MyElement extends LitElement {
+  static styles = [elementBasic.staticStyles];
+
+  async connectedCallback() {
+    super.connectedCallback();
+    await elementBasic.setup(this);
+  }
+}
+```
+
+The `elementBasic.staticStyles` includes:
+- Box-sizing reset
+- Smooth transitions for background and color
+- Custom scrollbar styles
+- Default font family (Geist Sans, Inter fallback)
+
+### State Management
+
+Integrated state management with smartstate:
+
+```typescript
+const domtools = await DomTools.setupDomTools();
+
+// Access the state part
+const state = domtools.domToolsStatePart;
+
+// Get current state
+const currentState = state.getState();
+console.log(currentState.virtualViewport); // 'native'
+console.log(currentState.jwt); // null
+
+// Update state
+state.setState({
+  virtualViewport: 'tablet',
+  jwt: 'your-token-here'
+});
+
+// Subscribe to state changes
+state.subscribe((newState) => {
+  console.log('State updated:', newState);
+});
+```
+
+### Run Once Pattern
+
+Execute expensive operations only once, even if called multiple times:
+
+```typescript
+const domtools = await DomTools.setupDomTools();
+
+// This will only execute once, even if called multiple times
+const result = await domtools.runOnce('myExpensiveOperation', async () => {
+  console.log('Running expensive operation...');
+  await someExpensiveAsyncOperation();
+  return 'result';
+});
+
+// Subsequent calls return the same result without re-executing
+const sameResult = await domtools.runOnce('myExpensiveOperation', async () => {
+  console.log('This will never run!');
+  return 'different result';
+});
+
+console.log(result === sameResult); // true
+```
+
+Error handling is built-in - if the function throws, all waiting callers receive the same error.
+
+## Advanced Usage
+
+### Combining Features
+
+Here's a real-world example combining multiple features:
+
+```typescript
+import { DomTools, breakpoints, elementBasic, Key } from '@design.estate/dees-domtools';
+import { LitElement, html, css as litCss } from 'lit';
+import { customElement } from 'lit/decorators.js';
+
+@customElement('my-app')
+class MyApp extends LitElement {
+  static styles = [
+    elementBasic.staticStyles,
+    litCss`
+      :host {
+        display: block;
+        padding: 2rem;
+      }
+
+      ${breakpoints.cssForTablet(litCss`
+        :host {
+          padding: 1rem;
+        }
+      `)}
+    `
+  ];
+
+  private domtools?: DomTools;
+
+  async connectedCallback() {
+    super.connectedCallback();
+
+    // Setup DomTools
+    this.domtools = await elementBasic.setup(this);
+    await this.domtools.domReady.promise;
+
+    // Setup keyboard shortcuts
+    this.domtools.keyboard.on([Key.Ctrl, Key.K]).subscribe(() => {
+      this.openCommandPalette();
+    });
+
+    // Subscribe to theme changes
+    this.domtools.themeManager.themeObservable.subscribe((isBright) => {
+      this.requestUpdate();
+    });
+
+    // Enable smooth scrolling
+    await this.domtools.scroller.enableLenisScroll({
+      disableOnNativeSmoothScroll: true
+    });
+  }
+
+  private openCommandPalette() {
+    console.log('Command palette opened!');
+  }
+
+  render() {
+    const isDark = !this.domtools?.themeManager.goBrightBoolean;
+
+    return html`
+      <div class="app" style="background: ${isDark ? '#1a1a1a' : '#ffffff'}">
+        <h1>My Awesome App</h1>
+        <button @click=${() => this.domtools?.themeManager.toggleDarkBright()}>
+          Toggle Theme
+        </button>
+      </div>
+    `;
+  }
+}
+```
+
+## TypeScript Support
+
+This package is written in TypeScript and provides full type definitions:
+
+```typescript
+import type {
+  IDomToolsState,
+  IDomToolsContructorOptions,
+  TViewport
+} from '@design.estate/dees-domtools';
+
+// Custom state interface
+interface MyState extends IDomToolsState {
+  customProperty: string;
+}
+
+// Type-safe viewport handling
+const viewport: TViewport = 'tablet';
+```
+
+## Browser Support
+
+Targets the latest version of Chrome. For other browsers, you may need to include polyfills.
+
+## Why @design.estate/dees-domtools?
+
+✅ **Race-condition free** - Carefully designed initialization prevents common timing issues
+✅ **TypeScript first** - Full type safety and IntelliSense support
+✅ **Modern APIs** - Built on Lit, RxJS, and other modern web standards
+✅ **Batteries included** - Everything you need for sophisticated web apps
+✅ **Production ready** - Used in real-world applications at design.estate
+✅ **Well maintained** - Active development and support
+
+## Related Packages
+
+This library integrates with the design.estate ecosystem:
+
+- `@design.estate/dees-comms` - Communication utilities
+- `@push.rocks/websetup` - Website setup and meta management
+- `@push.rocks/smartrouter` - Client-side routing
+- `@push.rocks/smartstate` - State management
+
+## License and Legal Information
+
+This repository contains open-source code that is licensed under the MIT License. A copy of the MIT License can be found in the [license](license) file within this repository.
+
+**Please note:** The MIT License does not grant permission to use the trade names, trademarks, service marks, or product names of the project, except as required for reasonable and customary use in describing the origin of the work and reproducing the content of the NOTICE file.
+
+### Trademarks
+
+This project is owned and maintained by Task Venture Capital GmbH. The names and logos associated with Task Venture Capital GmbH and any related products or services are trademarks of Task Venture Capital GmbH and are not included within the scope of the MIT license granted herein. Use of these trademarks must comply with Task Venture Capital GmbH's Trademark Guidelines, and any usage must be approved in writing by Task Venture Capital GmbH.
+
+### Company Information
+
+Task Venture Capital GmbH
+Registered at District court Bremen HRB 35230 HB, Germany
+
+For any legal inquiries or if you require further information, please contact us via email at hello@task.vc.
+
+By using this repository, you acknowledge that you have read this section, agree to comply with its terms, and understand that the licensing of the code does not imply endorsement by Task Venture Capital GmbH of any derivative works.

ts/00_commitinfo_data.ts

@@ -1,8 +1,8 @@
 /**
- * autocreated commitinfo by @pushrocks/commitinfo
+ * autocreated commitinfo by @push.rocks/commitinfo
  */
 export const commitinfo = {
   name: '@design.estate/dees-domtools',
-  version: '2.0.41',
+  version: '2.3.4',
-  description: 'tools to simplify complex css structures'
+  description: 'A package providing tools to simplify complex CSS structures and web development tasks, featuring TypeScript support and integration with various web technologies.'
 }

ts/domtools.classes.domtools.ts

@@ -18,32 +18,54 @@ export class DomTools {
   // ======
   // STATIC
   // ======
+  private static initializationPromise: Promise<DomTools> | null = null;
+
   /**
    * setups domtools
    */
-  public static async setupDomTools(optionsArg: IDomToolsContructorOptions = {}) {
+  public static async setupDomTools(optionsArg: IDomToolsContructorOptions = {}): Promise<DomTools> {
-    let domToolsInstance: DomTools;
+    // If initialization is already in progress and we're not ignoring global, wait for it
-    if (!globalThis.deesDomTools && !optionsArg.ignoreGlobal) {
+    if (!optionsArg.ignoreGlobal && DomTools.initializationPromise) {
-      globalThis.deesDomTools = new DomTools(optionsArg);
+      return await DomTools.initializationPromise;
-      domToolsInstance = globalThis.deesDomTools;
+    }
-
+
-      // lets make sure the dom is ready
+    // Create initialization promise to prevent race conditions
-      const readyStateChangedFunc = () => {
+    if (!optionsArg.ignoreGlobal) {
-        if (document.readyState === 'interactive' || document.readyState === 'complete') {
+      DomTools.initializationPromise = (async () => {
-          domToolsInstance.elements.headElement = document.querySelector('head');
+        let domToolsInstance: DomTools;
-          domToolsInstance.elements.bodyElement = document.querySelector('body');
+        if (!globalThis.deesDomTools) {
-          domToolsInstance.domReady.resolve();
+          globalThis.deesDomTools = new DomTools(optionsArg);
-        }
+          domToolsInstance = globalThis.deesDomTools;
-      };
+
-      document.addEventListener('readystatechange', readyStateChangedFunc);
+          // lets make sure the dom is ready
-      domToolsInstance.domToolsReady.resolve();
+          const readyStateChangedFunc = () => {
-    } else if (optionsArg.ignoreGlobal) {
+            if (document.readyState === 'interactive' || document.readyState === 'complete') {
-      domToolsInstance = new DomTools(optionsArg);
+              domToolsInstance.elements.headElement = document.querySelector('head');
-    } else {
+              domToolsInstance.elements.bodyElement = document.querySelector('body');
-      domToolsInstance = globalThis.deesDomTools;
+              // Initialize keyboard now that document.body exists
+              domToolsInstance.keyboard = new Keyboard(document.body);
+              domToolsInstance.domReady.resolve();
+            }
+          };
+          // Check current state immediately to avoid race condition
+          if (document.readyState === 'interactive' || document.readyState === 'complete') {
+            readyStateChangedFunc();
+          } else {
+            document.addEventListener('readystatechange', readyStateChangedFunc);
+          }
+          domToolsInstance.domToolsReady.resolve();
+        } else {
+          domToolsInstance = globalThis.deesDomTools;
+        }
+        await domToolsInstance.domToolsReady.promise;
+        return domToolsInstance;
+      })();
+      return await DomTools.initializationPromise;
+    } else {
+      // ignoreGlobal case - create isolated instance
+      const domToolsInstance = new DomTools(optionsArg);
+      return domToolsInstance;
     }
-    await domToolsInstance.domToolsReady.promise;
-    return domToolsInstance;
   }
 
   /**
@@ -93,11 +115,9 @@ export class DomTools {
   };
 
   public deesComms = new plugins.deesComms.DeesComms();
-  public scroller = new plugins.SweetScroll({
+  public scroller = new Scroller(this);
-    /* some options */
-  }); // TODO: switch to scroller class
   public themeManager = new ThemeManager(this);
-  public keyboard = new Keyboard(document.body);
+  public keyboard: Keyboard = null; // Initialized after DOM ready to avoid accessing document.body before it exists
 
   public domToolsReady = plugins.smartpromise.defer();
   public domReady = plugins.smartpromise.defer();
@@ -107,6 +127,7 @@ export class DomTools {
 
   private runOnceTrackerStringMap = new plugins.lik.Stringmap();
   private runOnceResultMap = new plugins.lik.FastMap();
+  private runOnceErrorMap = new plugins.lik.FastMap();
 
   /**
    * run a function once and always get the Promise of the first execution
@@ -118,15 +139,27 @@ export class DomTools {
     if (!this.runOnceTrackerStringMap.checkString(identifierArg)) {
       this.runOnceTrackerStringMap.addString(identifierArg);
       this.runOnceTrackerStringMap.addString(runningId);
-      const result = await funcArg();
+      try {
-      this.runOnceResultMap.addToMap(identifierArg, result);
+        const result = await funcArg();
-      this.runOnceTrackerStringMap.removeString(runningId);
+        this.runOnceResultMap.addToMap(identifierArg, result);
+      } catch (error) {
+        // Store error so waiting callers can receive it
+        this.runOnceErrorMap.addToMap(identifierArg, error);
+      } finally {
+        // Always remove running flag to prevent permanent stuck state
+        this.runOnceTrackerStringMap.removeString(runningId);
+      }
     }
     return await this.runOnceTrackerStringMap.registerUntilTrue(
       (stringMap) => {
         return !stringMap.includes(runningId);
       },
       () => {
+        // Check if there was an error and re-throw it
+        const error = this.runOnceErrorMap.getByKey(identifierArg);
+        if (error) {
+          throw error;
+        }
         return this.runOnceResultMap.getByKey(identifierArg);
       }
     );

ts/domtools.classes.scroller.ts

@@ -1,5 +1,175 @@
+import type { DomTools } from './domtools.classes.domtools.js';
 import * as plugins from './domtools.plugins.js';
 
 export class Scroller {
-  // TODO: move sweet scroll over to here;
+  public domtoolsInstance: DomTools;
+
+  // Array to store scroll callback functions.
+  private scrollCallbacks: Array<() => void> = [];
+
+  // Lenis instance (if activated) or null.
+  private lenisInstance: plugins.Lenis | null = null;
+
+  // Bound handlers to allow removal from event listeners.
+  private handleNativeScroll = (event: Event): void => {
+    this.executeScrollCallbacks();
+  };
+
+  private handleLenisScroll = (info: any): void => {
+    this.executeScrollCallbacks();
+  };
+
+  constructor(domtoolsInstanceArg: DomTools) {
+    this.domtoolsInstance = domtoolsInstanceArg;
+    // Attach the native scroll listener by default.
+    this.attachNativeScrollListener();
+  }
+
+  private sweetScroller = new plugins.SweetScroll({});
+
+  /**
+   * Scrolls to a given element with options.
+   */
+  public async toElement(
+    elementArg: HTMLElement,
+    optionsArg: Parameters<typeof this.sweetScroller.toElement>[1]
+  ) {
+    this.sweetScroller.toElement(elementArg, optionsArg);
+    await plugins.smartdelay.delayFor(optionsArg.duration);
+  }
+
+  /**
+   * Detects whether native smooth scrolling is enabled.
+   */
+  public async detectNativeSmoothScroll() {
+    const done = plugins.smartpromise.defer<boolean>();
+    const sampleSize = 100;
+    const acceptableDeltaDifference = 3;
+    const minimumSmoothRatio = 0.75;
+
+    const eventDeltas: number[] = [];
+
+    function onWheel(event: WheelEvent) {
+      eventDeltas.push(event.deltaY);
+
+      if (eventDeltas.length >= sampleSize) {
+        window.removeEventListener('wheel', onWheel);
+        analyzeEvents();
+      }
+    }
+
+    function analyzeEvents() {
+      const totalDiffs = eventDeltas.length - 1;
+      let smallDiffCount = 0;
+
+      for (let i = 0; i < totalDiffs; i++) {
+        const diff = Math.abs(eventDeltas[i + 1] - eventDeltas[i]);
+        if (diff <= acceptableDeltaDifference) {
+          smallDiffCount++;
+        }
+      }
+
+      const smoothRatio = smallDiffCount / totalDiffs;
+      if (smoothRatio >= minimumSmoothRatio) {
+        console.log('Smooth scrolling detected.');
+        done.resolve(true);
+      } else {
+        console.log('Smooth scrolling NOT detected.');
+        done.resolve(false);
+      }
+    }
+
+    window.addEventListener('wheel', onWheel);
+    return done.promise;
+  }
+
+  /**
+   * Enables Lenis scrolling.
+   * If optionsArg.disableOnNativeSmoothScroll is true and native smooth scrolling is detected,
+   * Lenis will be destroyed immediately.
+   */
+  public async enableLenisScroll(optionsArg?: { disableOnNativeSmoothScroll?: boolean }) {
+    const lenis = new plugins.Lenis({
+      autoRaf: true,
+    });
+
+    if (optionsArg?.disableOnNativeSmoothScroll) {
+      if (await this.detectNativeSmoothScroll()) {
+        lenis.destroy();
+        return;
+      }
+    }
+
+    // Activate Lenis scrolling.
+    this.lenisInstance = lenis;
+    // Switch from native scroll listener to Lenis scroll listener.
+    this.detachNativeScrollListener();
+    this.attachLenisScrollListener();
+
+    // Monkey-patch the destroy method so that when Lenis is destroyed,
+    // the native scroll listener is reattached.
+    const originalDestroy = lenis.destroy.bind(lenis);
+    lenis.destroy = () => {
+      originalDestroy();
+      this.detachLenisScrollListener();
+      this.attachNativeScrollListener();
+      this.lenisInstance = null;
+    };
+  }
+
+  /**
+   * Registers a callback to be executed on scroll.
+   * @param callback A function to execute on each scroll event.
+   */
+  public onScroll(callback: () => void): void {
+    this.scrollCallbacks.push(callback);
+  }
+
+  /**
+   * Executes all registered scroll callbacks concurrently.
+   */
+  private executeScrollCallbacks(): void {
+    // Execute all callbacks in parallel.
+    this.scrollCallbacks.forEach((callback) => {
+      try {
+        callback();
+      } catch (error) {
+        console.error('Error in scroll callback:', error);
+      }
+    });
+  }
+
+  /**
+   * Attaches the native scroll event listener.
+   */
+  private attachNativeScrollListener(): void {
+    window.addEventListener('scroll', this.handleNativeScroll);
+  }
+
+  /**
+   * Detaches the native scroll event listener.
+   */
+  private detachNativeScrollListener(): void {
+    window.removeEventListener('scroll', this.handleNativeScroll);
+  }
+
+  /**
+   * Attaches the Lenis scroll event listener.
+   */
+  private attachLenisScrollListener(): void {
+    if (this.lenisInstance) {
+      // Assuming that Lenis exposes an `on` method to listen to scroll events.
+      this.lenisInstance.on('scroll', this.handleLenisScroll);
+    }
+  }
+
+  /**
+   * Detaches the Lenis scroll event listener.
+   */
+  private detachLenisScrollListener(): void {
+    if (this.lenisInstance) {
+      // Assuming that Lenis exposes an `off` method to remove scroll event listeners.
+      this.lenisInstance.off('scroll', this.handleLenisScroll);
+    }
+  }
 }

ts/domtools.classes.thememanager.ts

@@ -21,10 +21,17 @@ export class ThemeManager {
     this.updateAllConnectedElements();
   }
 
-  private async updateAllConnectedElements() {
+  public async enableAutomaticGlobalThemeChange() {
     if (document.body && document.body.style) {
-      document.body.style.background = this.goBrightBoolean ? '#fff' : '#000';
+      this.themeObservable.subscribe({
+        next: (goBright) => {
+          document.body.style.background = goBright ? '#fff' : '#000';
+        }
+      });
     }
+  }
+
+  private async updateAllConnectedElements() {
     this.themeObservable.next(this.goBrightBoolean);
   }
 

ts/domtools.css.basestyles.ts

@@ -32,7 +32,7 @@ export const globalBaseStyles: string = css`
   /* global body styles */
   body {
     margin: 0px;
-    font-family: 'Mona Sans', 'Inter', sans-serif;
+    font-family: 'Geist Sans', 'Inter', sans-serif;
     box-sizing: border-box;
   }
 

ts/domtools.elementbasic.ts

@@ -12,7 +12,7 @@ export const staticStyles = css`
 
   :host {
     box-sizing: border-box;
-    font-family: 'Mona Sans', 'Inter', sans-serif;
+    font-family: 'Geist Sans', 'Inter', sans-serif;
   }
 
   ${unsafeCSS(scrollBarStyles)}
@@ -29,7 +29,7 @@ export const styles = html`
     }
 
     :host {
-      font-family: 'Mona Sans', 'Inter', sans-serif;
+      font-family: 'Geist Sans', 'Inter', sans-serif;
     }
 
     ${scrollBarStyles}

ts/domtools.pluginexports.ts

@@ -0,0 +1,23 @@
+import * as smartdelay from '@push.rocks/smartdelay';
+import * as smartmarkdown from '@push.rocks/smartmarkdown';
+import * as smartpromise from '@push.rocks/smartpromise';
+import SweetScroll from 'sweet-scroll';
+import * as smartstate from '@push.rocks/smartstate';
+import * as smartrouter from '@push.rocks/smartrouter';
+import * as smartrx from '@push.rocks/smartrx';
+import * as smartstring from '@push.rocks/smartstring';
+import * as smarturl from '@push.rocks/smarturl';
+import * as typedrequest from '@api.global/typedrequest';
+
+export { 
+  smartdelay, 
+  smartmarkdown, 
+  smartpromise, 
+  SweetScroll, 
+  smartstate, 
+  smartrouter,
+  smartrx, 
+  smartstring, 
+  smarturl, 
+  typedrequest 
+};

ts/domtools.plugins.ts

@@ -11,10 +11,12 @@ export { typedrequest };
 // pushrocks scope
 import * as smartdelay from '@push.rocks/smartdelay';
 import * as smartjson from '@push.rocks/smartjson';
+import * as smartmarkdown from '@push.rocks/smartmarkdown';
 import * as smartpromise from '@push.rocks/smartpromise';
 import * as smartrouter from '@push.rocks/smartrouter';
 import * as smartrx from '@push.rocks/smartrx';
 import * as smartstate from '@push.rocks/smartstate';
+import * as smartstring from '@push.rocks/smartstring';
 import * as smarturl from '@push.rocks/smarturl';
 import * as webrequest from '@push.rocks/webrequest';
 import * as websetup from '@push.rocks/websetup';
@@ -34,17 +36,20 @@ export {
   lik,
   smartdelay,
   smartjson,
+  smartmarkdown,
   smartpromise,
   smartrouter,
   smartrx,
   smarturl,
   smartstate,
+  smartstring,
   webrequest,
   websetup,
   webstore,
 };
 
 // third party scope
+import Lenis from 'lenis'
 import SweetScroll from 'sweet-scroll';
 
-export { SweetScroll };
+export { Lenis, SweetScroll };

ts/index.ts

@@ -8,15 +8,13 @@ export { css, breakpoints, elementBasic };
 export { DomTools, type IDomToolsContructorOptions } from './domtools.classes.domtools.js';
 export { TypedRequest } from '@api.global/typedrequest';
 export { type IWebSetupConstructorOptions } from '@push.rocks/websetup';
-export { rxjs } from '@push.rocks/smartrx';
 
-import * as allPlugins from './domtools.plugins.js';
+import * as plugins from './domtools.pluginexports.js';
+export { plugins };
 
-export const plugins = {
+// type exports
-  smartdelay: allPlugins.smartdelay,
+import type { rxjs } from '@push.rocks/smartrx';
-  smartpromise: allPlugins.smartpromise,
+
-  SweetScroll: allPlugins.SweetScroll,
+export type {
-  smartstate: allPlugins.smartstate,
+  rxjs,
-  smartrx: allPlugins.smartrx,
+}
-  smarturl: allPlugins.smarturl,
-};

tsconfig.json

@@ -6,6 +6,9 @@
     "module": "NodeNext",
     "moduleResolution": "NodeNext",
     "esModuleInterop": true,
-    "verbatimModuleSyntax": true,
+    "verbatimModuleSyntax": true
-  }
+  },
+  "exclude": [
+    "dist_*/**/*.d.ts"
+  ]
 }