FS Packages

FS PackagesShared frontend services

A collection of framework-agnostic and Vue-powered service packages built by Script Development.

Get Started
View on GitHub
Browse on npm

  • Factory Pattern

    Every package exports a createXxxService() factory that returns a plain object. No classes, no singletons, no hidden state. You control when and where services are created.

  • Loose Coupling

    Packages communicate through structural typing (duck types), not direct imports. Swap implementations without changing consumers. fs-theme doesn't import fs-storage — it accepts anything with get() and put().

  • Middleware Architecture

    HTTP, loading, dialog, and router all support composable middleware pipelines. Register a handler, get an unregister function back. Stack behaviors without modifying source code.

  • 100% Test Coverage

    Every package is held to 100% code coverage, and every package with a Stryker config to a 90% mutation score. Every pull request runs the full CI gate set — audit, format, lint, build, tarball and docs validation, typecheck, package lint, coverage, mutation testing and a real-browser lane.

  • Component Agnostic

    Toast and dialog services manage lifecycle and state — you bring your own Vue components. No opinionated UI. Your design system, our plumbing.

  • Type Safe

    Built with TypeScript 6.0+ in strict mode. Router navigation is type-checked against your route definitions. Translation keys are validated at compile time. No stringly-typed APIs.

The Packages ​

All packages are published under the @script-development scope on npm.

Foundation ​

These packages have zero Vue dependency — they work in any TypeScript project.

PackageDescription
fs-httpHTTP service factory with middleware architecture
fs-storagelocalStorage service factory with prefix namespacing
fs-helpersTree-shakeable utilities: deep copy, type guards, case conversion

Services ​

Vue-powered reactive services for common application concerns.

PackageDescription
fs-themeReactive dark/light mode with system preference detection
fs-authSanctum SPA-cookie session store, safe-redirect guard and auth registrars
fs-loadingLoading state service with HTTP middleware integration
fs-toastComponent-agnostic toast notification queue
fs-dialogComponent-agnostic dialog stack with error middleware
fs-formDouble-submit guard plus 422 validation-error binding for fs-http
fs-translationType-safe reactive i18n with multi-locale support

Domain ​

Higher-level packages for domain-driven application architecture.

PackageDescription
fs-adapter-storeReactive state management with CRUD resource adapters
fs-cached-adapter-storefs-adapter-store that refetches only when the server's hash for the collection changes
fs-routerType-safe router with CRUD navigation and middleware pipeline

UI Components ​

Headless, themeable Vue components (the ui-* family) — behaviour and accessibility in the package, all styling through a CSS custom-property contract you map your design tokens onto.

PackageDescription
ui-inputsHeadless UI components — field/label/error, text/number/date/textarea, checkbox/switch/radio, select/combobox/multi-select, plus the valueless controls Pressable / Disclosure — themed via --ui-* variables

Integrations ​

Packages integrating a third-party platform. Runtime differs per package — fs-cloudflare runs in your server process (Express SSR/API), not the browser.

PackageDescription
fs-cloudflareExpress middleware gating inbound traffic to Cloudflare's egress ranges

Quality Guarantees ​

Every pull request runs the full CI gate set. Contributing lists each gate with its command.

  • Security audit — npm audit for known vulnerabilities
  • Formatting — oxfmt enforces consistent code style
  • Linting — oxlint catches bugs and anti-patterns
  • Build — tsdown compiles to dual ESM + CJS output
  • Tarball validation — every file a manifest promises ships in the tarball, non-empty
  • Release-pipeline validation — the publish workflow's invariants hold
  • Docs validation — every publishable package has a page, a sidebar entry, a row on this page and an install line, and none of those names a package that does not exist
  • Type checking — TypeScript strict mode, no implicit any
  • Package lint — publint and attw verify package exports are correct
  • Coverage — 100% code coverage via vitest, for every package
  • Mutation testing — a 90% mutation score via Stryker, for every package with a Stryker config
  • Browser tests — behaviour a simulated DOM cannot show, plus axe-core audits, in real Chromium

Built by Script Development & Back to Code