Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Appearance settings
Open more actions menu

Repository files navigation

dgkit

A growing collection of open-source frontend agnostic and Angular libraries, developer tools, and frontend utilities. Built with strict TypeScript, comprehensive testing, automated releases, and a focus on simplicity, performance, and reliability.

Published under the @dgkit npm scope.

CI License: MIT


Each package is independently buildable, testable, versioned and publishable, built with modern Angular standalone + signals APIs, configured for tree-shaking, and validated in CI with Vitest and enforced coverage thresholds.

Packages

Package npm Description
@dgkit/route-state npm Type-safe, bidirectional sync between signals and route/query params.
@dgkit/signal-storage npm Type-safe, bidirectional sync between signals and localStorage/sessionStorage, with cross-tab updates.
@dgkit/resize-observer npm SSR-safe ResizeObserver — signal API + directive.
@dgkit/intersection-observer npm SSR-safe IntersectionObserver — signal API + directive.
@dgkit/mutation-observer npm SSR-safe MutationObserver — signal API + directive.
@dgkit/signal-history npm Undo/redo for signals, with grouped transactions.
@dgkit/clipboard npm Clipboard helper with signal-based operation state.
@dgkit/format npm Framework-free, grapheme-safe string/number formatting.
@dgkit/blob-download npm Framework-free helper for triggering a Blob download, with no memory leaks.

Every package is standalone, tree-shakeable, SSR-safe and zoneless-friendly — native callbacks write signals directly, with no NgZone and no assumption that zone.js is loaded.

Tech stack

  • Nx — task running, caching and affected graph
  • Yarn workspaces
  • Angular 21 (standalone + signals), TypeScript 5.9, RxJS 7
  • ng-packagr — Angular Package Format builds
  • Vitest (+ Analog) — every package tested with enforced coverage thresholds
  • ESLint (type-aware) + Prettier
  • Changesets — independent versioning & changelogs
  • GitHub Actions — CI + release with npm provenance

Requirements

  • Node.js ^20.19 || ^22.12 || ^24 (see .nvmrc24.13.0)
  • Yarn >=4 (Berry, pinned via packageManager + Corepack)
nvm use            # picks up .nvmrc
corepack enable    # provisions Yarn 4 from packageManager
yarn install

Common commands

yarn build                 # build every package (nx run-many -t build)
yarn test                  # Vitest + coverage across all packages
yarn lint                  # ESLint (type-aware)
yarn typecheck             # tsc --noEmit
yarn format                # Prettier write
yarn playground            # serve the demo app (nx serve playground)
yarn verify                # format:check + lint + typecheck + test + build

Target a single project with Nx:

yarn nx build resize-observer
yarn nx test resize-observer

Adding a new package

yarn new:package media-query "Angular media-query utilities."
yarn new:package slugify "String slug helpers." --pure   # no Angular peers

This scaffolds packages/<name>/ from the resize-observer template with its own package.json, project.json, ng-package.json, tsconfigs, a Vitest config, README and CHANGELOG, wired into the workspace. See tools/create-package.mjs.

Repository layout

dgkit/
├── packages/            # publishable @dgkit/* libraries
│   ├── route-state/
│   ├── signal-storage/
│   ├── resize-observer/
│   ├── intersection-observer/
│   ├── mutation-observer/
│   ├── signal-history/
│   ├── clipboard/
│   ├── format/
│   └── blob-download/
├── apps/
│   └── playground/      # manual verification app (not published)
├── tools/               # workspace tooling (package scaffolder)
├── .changeset/          # changesets config + pending changes
├── .github/workflows/   # CI + release
├── nx.json
├── .yarnrc.yml
├── tsconfig.base.json
├── eslint.config.mjs
└── prettier.config.mjs

Releasing

Releases are driven by Changesets:

yarn changeset             # describe your change (choose bump per package)
yarn version-packages      # apply versions + update changelogs
yarn release               # build + changeset publish (CI does this on main)

See CONTRIBUTING.md for the full workflow.

Contributing

Issues and PRs welcome. Please read CONTRIBUTING.md and the Code of Conduct.

License

MIT © Danylo Grynyk

About

Collection of open-source agnostic and angular libraries, developer tools, and utilities. Built with strict TypeScript, comprehensive testing, automated releases, and a focus on simplicity, performance, and reliability.

Topics

Resources

Code of conduct

Contributing

Security policy

Stars

Watchers

Forks

Releases

Packages

Contributors

Languages

Morty Proxy This is a proxified and sanitized view of the page, visit original site.