{"_id":"@alshdavid/mvvm","name":"@alshdavid/mvvm","dist-tags":{"latest":"0.0.1"},"versions":{"0.0.1":{"name":"@alshdavid/mvvm","publishConfig":{"access":"public"},"version":"0.0.1","description":"Supports React and Preact","keywords":[],"author":"","license":"ISC","type":"module","exports":{".":{"import":"./dist/index.js","types":"./types/index.d.ts"},"./*":{"import":"./dist/*","types":"./types/*"},"./react":{"import":"./dist/react/index.js","types":"./types/react/index.d.ts"},"./preact":{"import":"./dist/preact/index.js","types":"./types/preact/index.d.ts"},"./package.json":"./package.json"},"devDependencies":{"@types/react":"^19.2.14","preact":"^10.28.3","react":"^19.2.4","rxjs":"^7.8.2","typescript":"^5.9.3"},"gitHead":"4adb2e80c626e085c7b9b20ccc0a707da3d5c4da","_id":"@alshdavid/mvvm@0.0.1","_nodeVersion":"24.13.1","_npmVersion":"11.8.0","dist":{"integrity":"sha512-tSrmnh+ANUuZOdN51BRJvr1OVQZvnSomePB6SJR9UCgixppIyPuWeXPRdDtiZ0IuQYzNWbgfeLRMwU4zFq+4Sw==","shasum":"cab133bbef7bed59e421b0d9e316d87f1c58c3aa","tarball":"https://registry.npmjs.org/@alshdavid/mvvm/-/mvvm-0.0.1.tgz","fileCount":42,"unpackedSize":19061,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIGHyTWLwexwOGx+W7BgG/hY9JvL16F+hYfXAm0cWRGj+AiBwkZ0iYOY4CelVoHmJ0zJrzA339F0zeYGeY1ntETAs6w=="}]},"_npmUser":{"name":"alshdavid","email":"alshdavid@gmail.com"},"directories":{},"maintainers":[{"name":"alshdavid","email":"alshdavid@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/mvvm_0.0.1_1771122635352_0.46993555268169307"},"_hasShrinkwrap":false}},"time":{"created":"2026-02-15T02:30:35.281Z","0.0.1":"2026-02-15T02:30:35.496Z","modified":"2026-02-15T02:30:35.666Z"},"maintainers":[{"name":"alshdavid","email":"alshdavid@gmail.com"}],"description":"Supports React and Preact","keywords":[],"license":"ISC","readme":"# MVVM / MVC Library\n\nSupports React and Preact\n\n# Usage\n\n```bash\nnpm install https://github.com/alshdavid/mvvm.git\nnpm install react\n\n# To use observables\nnpm install rxjs\n```\n\n_Note: Requires rspack/webpack configuration using the latest decorator spec_\n\n```tsx\nimport { rx } from 'mvvm'\nimport { useViewModel } from 'mvvm/react'\n\nexport class AppViewModel {\n  // The component will automatically \n  // render when this property is mutated\n  @rx accessor message = ''\n}\n\nexport function App({}) {\n  const vm = useViewModel(AppViewModel)\n\n  return (\n    <div>\n      <p>{vm.message}</p>\n      <input \n          onChange={e => vm.message = e.target.value}\n          value={vm.message} />    \n    </div>\n  )\n}\n```\n\n# Dependency Injection\n\n```tsx\n// index.tsx\nimport { Provider } from 'mvvm/react'\nimport { FooService } from './foo-service.ts'\nimport { App } from './app.tsx'\n\nconst provider = new Provider();\n\nprovider.set(FooService, new FooService());\n\nrender(\n  <Provider.Provider value={provider}>\n    <App />\n  </Provider.Provider>\n)\n```\n\n```tsx\n// foo-service.ts\nimport { rx } from 'mvvm'\n\nexport class FooService {\n  @rx accessor message = ''\n}\n```\n\n```tsx\n// app.tsx\nimport { rx } from 'mvvm'\nimport { useViewModel, useInject } from 'mvvm/react'\nimport { FooService } from './foo-service.ts'\n\nexport class AppViewModel {\n  fooService: FooService\n\n  constructor(\n    fooService: FooService\n  ) {\n    this.fooService = fooService\n  }\n}\n\nexport function App({}) {\n  const fooService = useInject(FooService)\n  const vm = useViewModel(AppViewModel, [fooService])\n\n  return (\n    <div>\n      <p>{vm.message}</p>\n      <input \n          onChange={e => vm.fooService.message = e.target.value}\n          value={vm.fooService.message} />    \n    </div>\n  )\n}\n```\n\n# Observables\n\nUse `useAsync` to subscribe to an observable\n","readmeFilename":"README.md","_rev":"1-15eaeb86b1919d4a5641ebd2c51ab211"}