{"_id":"@aboviq/powersync-solid","_rev":"3-e0feb8597b7cada1989d046ce6482d03","name":"@aboviq/powersync-solid","dist-tags":{"latest":"0.2.1"},"versions":{"0.1.1":{"name":"@aboviq/powersync-solid","version":"0.1.1","keywords":["solid","powersync"],"author":{"url":"https://www.aboviq.com","name":"Aboviq AB","email":"dev@aboviq.com"},"license":"MIT","_id":"@aboviq/powersync-solid@0.1.1","maintainers":[{"name":"joakimbeng","email":"joakim@beng.se"},{"name":"magnuslang","email":"magnuslang@gmail.com"}],"contributors":[{"name":"Joakim Carlstein","email":"joakim@aboviq.com"}],"homepage":"https://github.com/aboviq/powersync-solid#readme","bugs":{"url":"https://github.com/aboviq/powersync-solid/issues"},"dist":{"shasum":"9f92c6abc013c3a47a5d7091bc39bca2830ea79a","tarball":"https://registry.npmjs.org/@aboviq/powersync-solid/-/powersync-solid-0.1.1.tgz","fileCount":8,"integrity":"sha512-r1R2z7vNAaDV7VmlFWYVCBz33KjuuMnVaMAQ/GTDsenJHtvYu8OHSLkzheOsS68Bfb3Zlp1PJ2ZP1allhULpag==","signatures":[{"sig":"MEQCIFic3aC3ZttGHAlrezxNYR/JRT9TPDzT3n4hxESEeZzRAiA5npdyTPW1tBa6o9Um5QNL9ZAIcCHZfQWNXgNPr/Dq9g==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":24764},"main":"./dist/index.js","type":"module","types":"./dist/index.d.ts","volta":{"node":"20.18.0","pnpm":"9.4.0"},"module":"./dist/index.js","browser":{},"engines":{"node":">=18","pnpm":">=9.0.0"},"exports":{"solid":{"import":"./dist/index.jsx","development":"./dist/dev.jsx"},"import":{"types":"./dist/index.d.ts","default":"./dist/index.js"},"development":{"import":{"types":"./dist/index.d.ts","default":"./dist/dev.js"}}},"gitHead":"fb4d92437b1bd2f7f823cffca0bb30c644812247","private":false,"scripts":{"dev":"vite serve dev","lint":"concurrently pnpm:lint:*","test":"vitest","build":"tsup","format":"prettier --ignore-path .gitignore -w \"src/**/*.{js,ts,json,css,tsx,jsx}\" \"dev/**/*.{js,ts,json,css,tsx,jsx}\"","lint:code":"eslint --ignore-path .gitignore --max-warnings 0 \"src/**/*.{js,ts,tsx,jsx}\"","lint:types":"tsc --noEmit","update-deps":"pnpm up -Li","prepublishOnly":"pnpm build"},"_npmUser":{"name":"joakimbeng","email":"joakim@beng.se"},"repository":{"url":"git+https://github.com/aboviq/powersync-solid.git","type":"git"},"_npmVersion":"10.8.2","description":"SolidJS helpers, components and hooks for PowerSync","directories":{},"sideEffects":false,"_nodeVersion":"20.18.1","publishConfig":{"access":"public"},"typesVersions":{},"_hasShrinkwrap":false,"packageManager":"pnpm@9.4.0","devDependencies":{"tsup":"^8.0.2","vite":"^5.2.11","jsdom":"^24.0.0","eslint":"^8.56.0","vitest":"^1.6.0","esbuild":"^0.21.3","prettier":"3.0.0","solid-js":"^1.8.17","typescript":"^5.4.5","@types/node":"^20.12.12","concurrently":"^8.2.2","tsup-preset-solid":"^2.2.0","vite-plugin-solid":"^2.10.2","esbuild-plugin-solid":"^0.6.0","@typescript-eslint/parser":"^7.9.0","eslint-plugin-no-only-tests":"^3.1.0","eslint-plugin-eslint-comments":"^3.2.0","@typescript-eslint/eslint-plugin":"^7.9.0"},"peerDependencies":{"solid-js":"^1.6.0","@powersync/common":"^1.21.0"},"_npmOperationalInternal":{"tmp":"tmp/powersync-solid_0.1.1_1732890928475_0.21557670003765783","host":"s3://npm-registry-packages"}},"0.1.2":{"name":"@aboviq/powersync-solid","version":"0.1.2","keywords":["solid","powersync"],"author":{"url":"https://www.aboviq.com","name":"Aboviq AB","email":"dev@aboviq.com"},"license":"MIT","_id":"@aboviq/powersync-solid@0.1.2","maintainers":[{"name":"joakimbeng","email":"joakim@beng.se"},{"name":"magnuslang","email":"magnuslang@gmail.com"}],"contributors":[{"name":"Joakim Carlstein","email":"joakim@aboviq.com"}],"homepage":"https://github.com/aboviq/powersync-solid#readme","bugs":{"url":"https://github.com/aboviq/powersync-solid/issues"},"dist":{"shasum":"0b3496ac41ebe934fe836fb156d88140c9797d3f","tarball":"https://registry.npmjs.org/@aboviq/powersync-solid/-/powersync-solid-0.1.2.tgz","fileCount":8,"integrity":"sha512-nG/xnBr+M7b6xNN9ffE0Qe35DUpzzndTegLcrYkhlzNgCLul9RmDQa3D78UBOgo1xRiqUs7cc7sgGYJ6UK7Q+Q==","signatures":[{"sig":"MEUCIQDd6ozEAP6wTb7ANj7toeecnN/AD9xRJVr5CzfxLu/mTgIgIVai3e5V9uzhV+1hle6DaetIsAAR57WILLckeksxaa4=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":26190},"main":"./dist/index.js","type":"module","types":"./dist/index.d.ts","volta":{"node":"20.18.0","pnpm":"9.4.0"},"module":"./dist/index.js","browser":{},"engines":{"node":">=18","pnpm":">=9.0.0"},"exports":{"solid":{"import":"./dist/index.jsx","development":"./dist/dev.jsx"},"import":{"types":"./dist/index.d.ts","default":"./dist/index.js"},"development":{"import":{"types":"./dist/index.d.ts","default":"./dist/dev.js"}}},"gitHead":"483302893090635803ffa386b1f5f399f0626b5d","private":false,"scripts":{"dev":"vite serve dev","lint":"concurrently pnpm:lint:*","test":"vitest","build":"tsup","format":"prettier --ignore-path .gitignore -w \"src/**/*.{js,ts,json,css,tsx,jsx}\" \"dev/**/*.{js,ts,json,css,tsx,jsx}\"","lint:code":"eslint --ignore-path .gitignore --max-warnings 0 \"src/**/*.{js,ts,tsx,jsx}\"","lint:types":"tsc --noEmit","update-deps":"pnpm up -Li","prepublishOnly":"pnpm build"},"_npmUser":{"name":"joakimbeng","email":"joakim@beng.se"},"repository":{"url":"git+https://github.com/aboviq/powersync-solid.git","type":"git"},"_npmVersion":"10.8.2","description":"SolidJS helpers, components and hooks for PowerSync","directories":{},"sideEffects":false,"_nodeVersion":"20.18.1","publishConfig":{"access":"public"},"typesVersions":{},"_hasShrinkwrap":false,"packageManager":"pnpm@9.4.0","devDependencies":{"tsup":"^8.0.2","vite":"^5.2.11","jsdom":"^24.0.0","eslint":"^8.56.0","vitest":"^1.6.0","esbuild":"^0.21.3","prettier":"3.0.0","solid-js":"^1.8.17","typescript":"^5.4.5","@types/node":"^20.12.12","concurrently":"^8.2.2","tsup-preset-solid":"^2.2.0","vite-plugin-solid":"^2.10.2","esbuild-plugin-solid":"^0.6.0","@typescript-eslint/parser":"^7.9.0","eslint-plugin-no-only-tests":"^3.1.0","eslint-plugin-eslint-comments":"^3.2.0","@typescript-eslint/eslint-plugin":"^7.9.0"},"peerDependencies":{"solid-js":"^1.6.0","@powersync/common":"^1.21.0"},"_npmOperationalInternal":{"tmp":"tmp/powersync-solid_0.1.2_1732892725014_0.480124379191722","host":"s3://npm-registry-packages"}},"0.2.0":{"name":"@aboviq/powersync-solid","version":"0.2.0","keywords":["solid","powersync"],"author":{"url":"https://www.aboviq.com","name":"Aboviq AB","email":"dev@aboviq.com"},"license":"MIT","_id":"@aboviq/powersync-solid@0.2.0","maintainers":[{"name":"joakimbeng","email":"joakim@beng.se"},{"name":"magnuslang","email":"magnuslang@gmail.com"}],"contributors":[{"name":"Joakim Carlstein","email":"joakim@aboviq.com"}],"homepage":"https://github.com/aboviq/powersync-solid#readme","bugs":{"url":"https://github.com/aboviq/powersync-solid/issues"},"dist":{"shasum":"65905fe3b50ffd9e43871f8d2deb466e95e3b04b","tarball":"https://registry.npmjs.org/@aboviq/powersync-solid/-/powersync-solid-0.2.0.tgz","fileCount":8,"integrity":"sha512-FD0TP+iPjqyc6joRgny3TyIhPVCsIE3eLLNJplEDvkYGhJbHwiwEPDvqJTLK0mbEfTBdkMghrjPv/hGFDfXxcA==","signatures":[{"sig":"MEUCIDoUiuljJK4aKPMV8x7CbyVFZJKGvqlryJChah6QKPzZAiEAglA8tsbaT/vXYn2gJ20piuJJ33KzbhE4hkVwUBQwUl0=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":29348},"main":"./dist/index.js","type":"module","types":"./dist/index.d.ts","volta":{"node":"20.18.0","pnpm":"9.4.0"},"module":"./dist/index.js","browser":{},"engines":{"node":">=18","pnpm":">=9.0.0"},"exports":{"solid":{"import":"./dist/index.jsx","development":"./dist/dev.jsx"},"import":{"types":"./dist/index.d.ts","default":"./dist/index.js"},"development":{"import":{"types":"./dist/index.d.ts","default":"./dist/dev.js"}}},"gitHead":"f9f38746676e1de2f0b8b125897e746a95cf27a7","private":false,"scripts":{"dev":"vite serve dev","lint":"concurrently pnpm:lint:*","test":"vitest","build":"tsup","format":"prettier --ignore-path .gitignore -w \"src/**/*.{js,ts,json,css,tsx,jsx}\" \"dev/**/*.{js,ts,json,css,tsx,jsx}\"","lint:code":"eslint --ignore-path .gitignore --max-warnings 0 \"src/**/*.{js,ts,tsx,jsx}\"","lint:types":"tsc --noEmit","update-deps":"pnpm up -Li","prepublishOnly":"pnpm build"},"_npmUser":{"name":"joakimbeng","email":"joakim@beng.se"},"repository":{"url":"git+https://github.com/aboviq/powersync-solid.git","type":"git"},"_npmVersion":"10.8.2","description":"SolidJS helpers, components and hooks for PowerSync","directories":{},"sideEffects":false,"_nodeVersion":"20.18.1","publishConfig":{"access":"public"},"typesVersions":{},"_hasShrinkwrap":false,"packageManager":"pnpm@9.4.0","devDependencies":{"tsup":"^8.0.2","vite":"^5.2.11","jsdom":"^24.0.0","eslint":"^8.56.0","vitest":"^1.6.0","esbuild":"^0.21.3","prettier":"3.0.0","solid-js":"^1.8.17","typescript":"^5.4.5","@types/node":"^20.12.12","concurrently":"^8.2.2","tsup-preset-solid":"^2.2.0","vite-plugin-solid":"^2.10.2","esbuild-plugin-solid":"^0.6.0","@solidjs/testing-library":"^0.8.10","@testing-library/jest-dom":"^6.6.3","@typescript-eslint/parser":"^7.9.0","@testing-library/user-event":"^14.5.2","eslint-plugin-no-only-tests":"^3.1.0","eslint-plugin-eslint-comments":"^3.2.0","@typescript-eslint/eslint-plugin":"^7.9.0"},"peerDependencies":{"solid-js":"^1.6.0","@powersync/common":"^1.21.0"},"_npmOperationalInternal":{"tmp":"tmp/powersync-solid_0.2.0_1733333236189_0.20867193208971901","host":"s3://npm-registry-packages"}},"0.2.1":{"name":"@aboviq/powersync-solid","version":"0.2.1","publishConfig":{"access":"public"},"description":"SolidJS helpers, components and hooks for PowerSync","license":"MIT","author":{"name":"Aboviq AB","email":"dev@aboviq.com","url":"https://www.aboviq.com"},"contributors":[{"name":"Joakim Carlstein","email":"joakim@aboviq.com"}],"repository":{"type":"git","url":"git+https://github.com/aboviq/powersync-solid.git"},"homepage":"https://github.com/aboviq/powersync-solid#readme","bugs":{"url":"https://github.com/aboviq/powersync-solid/issues"},"private":false,"sideEffects":false,"type":"module","main":"./dist/index.js","module":"./dist/index.js","types":"./dist/index.d.ts","browser":{},"exports":{"solid":{"development":"./dist/dev.jsx","import":"./dist/index.jsx"},"development":{"import":{"types":"./dist/index.d.ts","default":"./dist/dev.js"}},"import":{"types":"./dist/index.d.ts","default":"./dist/index.js"}},"typesVersions":{},"scripts":{"dev":"vite serve dev","build":"tsup","test":"vitest","prepublishOnly":"pnpm build","format":"prettier --ignore-path .gitignore -w \"src/**/*.{js,ts,json,css,tsx,jsx}\" \"dev/**/*.{js,ts,json,css,tsx,jsx}\"","lint":"concurrently pnpm:lint:*","lint:code":"eslint --ignore-path .gitignore --max-warnings 0 \"src/**/*.{js,ts,tsx,jsx}\"","lint:types":"tsc --noEmit","update-deps":"pnpm up -Li"},"peerDependencies":{"@powersync/common":"^1.21.0","solid-js":"^1.6.0"},"devDependencies":{"@solidjs/testing-library":"^0.8.10","@testing-library/jest-dom":"^6.6.3","@testing-library/user-event":"^14.5.2","@types/node":"^20.12.12","@typescript-eslint/eslint-plugin":"^7.9.0","@typescript-eslint/parser":"^7.9.0","concurrently":"^8.2.2","esbuild":"^0.21.3","esbuild-plugin-solid":"^0.6.0","eslint":"^8.56.0","eslint-plugin-eslint-comments":"^3.2.0","eslint-plugin-no-only-tests":"^3.1.0","jsdom":"^24.0.0","prettier":"3.0.0","solid-js":"^1.8.17","tsup":"^8.0.2","tsup-preset-solid":"^2.2.0","typescript":"^5.4.5","vite":"^5.2.11","vite-plugin-solid":"^2.10.2","vitest":"^1.6.0"},"keywords":["solid","powersync"],"packageManager":"pnpm@9.4.0","engines":{"node":">=18","pnpm":">=9.0.0"},"volta":{"node":"20.18.0","pnpm":"9.4.0"},"_id":"@aboviq/powersync-solid@0.2.1","gitHead":"bd19aaa823e894f5e67edebf9e7cec4e8daec3c5","_nodeVersion":"20.18.1","_npmVersion":"10.8.2","dist":{"integrity":"sha512-VtvekV1tlyjHOJ/B2XoSACvzjtg8o86CccWhqX4q063S4Zq8n11ao6fyqz/I3LW7i65qeHbbzccjirYKTrCssw==","shasum":"ff397b257c3a2c8119d7f8b0731991f55201f947","tarball":"https://registry.npmjs.org/@aboviq/powersync-solid/-/powersync-solid-0.2.1.tgz","fileCount":8,"unpackedSize":29357,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDK3xkufvlFW/Jy/fCet11yqWGUzunolrddKepAqEr3uAIhAJBgfWkInao4zu30l+k0AXLvnztGiD3wv/n67PONeje+"}]},"_npmUser":{"name":"joakimbeng","email":"joakim@beng.se"},"directories":{},"maintainers":[{"name":"joakimbeng","email":"joakim@beng.se"},{"name":"magnuslang","email":"magnuslang@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/powersync-solid_0.2.1_1733341348995_0.20022391859927624"},"_hasShrinkwrap":false}},"time":{"created":"2024-11-29T14:35:28.374Z","modified":"2024-12-04T19:42:29.451Z","0.1.1":"2024-11-29T14:35:28.635Z","0.1.2":"2024-11-29T15:05:25.162Z","0.2.0":"2024-12-04T17:27:16.373Z","0.2.1":"2024-12-04T19:42:29.232Z"},"bugs":{"url":"https://github.com/aboviq/powersync-solid/issues"},"author":{"name":"Aboviq AB","email":"dev@aboviq.com","url":"https://www.aboviq.com"},"license":"MIT","homepage":"https://github.com/aboviq/powersync-solid#readme","keywords":["solid","powersync"],"repository":{"type":"git","url":"git+https://github.com/aboviq/powersync-solid.git"},"description":"SolidJS helpers, components and hooks for PowerSync","contributors":[{"name":"Joakim Carlstein","email":"joakim@aboviq.com"}],"maintainers":[{"name":"joakimbeng","email":"joakim@beng.se"},{"name":"magnuslang","email":"magnuslang@gmail.com"}],"readme":"<p>\n  <img width=\"100%\" src=\"https://assets.solidjs.com/banner?type=powersync-solid&background=tiles&project=@Aboviq\" alt=\"@aboviq/powersync-solid\">\n</p>\n\n# @aboviq/powersync-solid\n\n[![pnpm](https://img.shields.io/badge/maintained%20with-pnpm-cc00ff.svg?style=for-the-badge&logo=pnpm)](https://pnpm.io/)\n\nThe `@aboviq/powersync-solid` package provides [SolidJS](https://www.solidjs.com) hooks and helpers for use with the [JavaScript Web SDK](https://github.com/powersync-ja/powersync-js/tree/main/packages/web). These hooks are designed to support reactivity, and can be used to automatically re-render SolidJS components when query results update or to access [PowerSync](https://www.powersync.com) connectivity status changes.\n\n## Quick start\n\nInstall it:\n\n```bash\nnpm i @aboviq/powersync-solid\n# or\nyarn add @aboviq/powersync-solid\n# or\npnpm add @aboviq/powersync-solid\n```\n\n### Usage\n\nFollow the instructions in the [JavaScript Web SDK docs](https://docs.powersync.com/client-sdk-references/javascript-web#2-instantiate-the-powersync-database), then setup the `PowerSyncContext` provider:\n\n```tsx\nimport { PowerSyncContext } from '@aboviq/powersync-solid';\nimport { db } from './db'; // <- the PowerSync database instance\nimport ListsView from './ListsView';\n\nexport default function App() {\n  return (\n    <PowerSyncContext.Provider value={db}>\n      <ListsView />\n    </PowerSyncContext.Provider>\n  );\n}\n```\n\nThen use the hooks and helpers in your components:\n\n```tsx\n// ListsView.tsx\nimport { useQuery } from '@aboviq/powersync-solid';\n\nexport default function ListsView() {\n  const [lists] = useQuery('SELECT * FROM lists');\n\n  return (\n    <div>\n      <Show when={lists.loading}>\n        <p>Loading...</p>\n      </Show>\n      <Switch>\n        <Match when={lists.error}>\n          <span>Error: {lists.error}</span>\n        </Match>\n        <Match when={lists()}>\n          <div>{JSON.stringify(lists())}</div>\n        </Match>\n      </Switch>\n    </div>\n  );\n}\n```\n\n```tsx\n// Status.tsx\nimport { useStatus } from '@aboviq/powersync-solid';\n\nexport default function Status() {\n  const status = useStatus();\n\n  return (\n    <p>\n      <Show when={status().connected} fallback=\"Offline\">\n        Online\n      </Show>{' '}\n      (last sync: {status().lastSyncedAt?.toLocaleDateString() ?? 'n/a'})\n    </p>\n  );\n}\n```\n\n**Note:** the `useQuery` has the same return type as SolidJS's [`createResource`](https://docs.solidjs.com/guides/fetching-data#using-createresource) hook.\n\n## Watched Queries\n\nThe `useQuery` hook is designed to automatically re-render the component when any of the following change:\n\n- PowerSync's connection status (can be easily accessed via the `useStatus` hook)\n- The query result changes (e.g. when a new record is inserted, updated, or deleted)\n- The query itself changes (e.g. when a query signal is used that is updated with new state)\n- The query's parameters change (e.g. when any parameter is a signal and it's updated with new state)\n\n### Example - a reactive query\n\n```tsx\nimport { useQuery } from '@aboviq/powersync-solid';\n\nexport default function ListsView() {\n  const [sortOrder, setSortOrder] = createSignal('ASC');\n  const [lists] = useQuery(() => `SELECT * FROM lists ORDER BY name ${sortOrder()}`);\n\n  const toggleSortOrder = () => {\n    setSortOrder((sortOrder) => (sortOrder === 'ASC' ? 'DESC' : 'ASC'));\n  };\n\n  return (\n    <div>\n      <Show when={lists.loading}>\n        <p>Loading...</p>\n      </Show>\n      <Switch>\n        <Match when={lists.error}>\n          <span>Error: {lists.error}</span>\n        </Match>\n        <Match when={lists()}>\n          <button onClick={toggleSortOrder}>Toggle sort order</button>\n          <div>{JSON.stringify(lists())}</div>\n        </Match>\n      </Switch>\n    </div>\n  );\n}\n```\n\n### Example - reactive parameters\n\n```tsx\nimport { useQuery } from '@aboviq/powersync-solid';\n\nexport default function ListsView() {\n  const [page, setPage] = createSignal(1);\n  const offet = () => (page() - 1) * 10;\n  const [lists] = useQuery('SELECT * FROM lists LIMIT 10 OFFSET ?', [offset]);\n\n  const previousPage = () => {\n    setPage((page) => page - 1);\n  };\n\n  const nextPage = () => {\n    setPage((page) => page + 1);\n  };\n\n  return (\n    <div>\n      <Show when={lists.loading}>\n        <p>Loading...</p>\n      </Show>\n      <Switch>\n        <Match when={lists.error}>\n          <span>Error: {lists.error}</span>\n        </Match>\n        <Match when={lists()}>\n          <button disabled={page() > 1} onClick={previousPage}>\n            Previous page\n          </button>\n          <button disabled={lists()?.length !== 10} onClick={nextPage}>\n            Next page\n          </button>\n          <div>{JSON.stringify(lists())}</div>\n        </Match>\n      </Switch>\n    </div>\n  );\n}\n```\n\n## Using with an ORM\n\n### Example - using [Kysely](https://kysely.dev/)\n\nSet up the Kysely database instance according to the [PowerSync Kysely ORM docs](https://docs.powersync.com/client-sdk-references/javascript-web/javascript-orm/kysely).\n\nThis will also give you automatic TypeScript type inference for your queries.\n\n```tsx\nimport { useQuery } from '@aboviq/powersync-solid';\nimport { db } from './db'; // <- the file where you have configured your Kysely instance\n\nexport default function ListsView() {\n  const [lists] = useQuery(db.selectFrom('lists').selectAll('lists'));\n\n  return (\n    <div>\n      <Show when={lists.loading}>\n        <p>Loading...</p>\n      </Show>\n      <Switch>\n        <Match when={lists.error}>\n          <span>Error: {lists.error}</span>\n        </Match>\n        <Match when={lists()}>\n          <div>{JSON.stringify(lists())}</div>\n        </Match>\n      </Switch>\n    </div>\n  );\n}\n```\n\n### Example - using [Kysely](https://kysely.dev/) with reactive parameters\n\nTo use reactive parameters with Kysely, you can pass a function that returns the query to `useQuery`.\n\n```tsx\nimport { useQuery } from '@aboviq/powersync-solid';\nimport { db } from './db'; // <- the file where you have configured your Kysely instance\n\nexport default function ListsView() {\n  const [page, setPage] = createSignal(1);\n  const [lists] = useQuery(() =>\n    db\n      .selectFrom('lists')\n      .selectAll('lists')\n      .limit(10)\n      .offset((page() - 1) * 10),\n  );\n\n  const previousPage = () => {\n    setPage((page) => page - 1);\n  };\n\n  const nextPage = () => {\n    setPage((page) => page + 1);\n  };\n\n  return (\n    <div>\n      <Show when={lists.loading}>\n        <p>Loading...</p>\n      </Show>\n      <Switch>\n        <Match when={lists.error}>\n          <span>Error: {lists.error}</span>\n        </Match>\n        <Match when={lists()}>\n          <button disabled={page() > 1} onClick={previousPage}>\n            Previous page\n          </button>\n          <button disabled={lists()?.length !== 10} onClick={nextPage}>\n            Next page\n          </button>\n          <div>{JSON.stringify(lists())}</div>\n        </Match>\n      </Switch>\n    </div>\n  );\n}\n```\n\n## TypeScript types without an ORM\n\nIf you're not using an ORM, you can still get TypeScript types for your queries by using the `useQuery` hook with a type parameter.\n\n```tsx\nimport { useQuery } from '@aboviq/powersync-solid';\nimport type { ListRecord } from './schema'; // <- the file where you have defined your PowerSync database schema\n\nexport default function ListsView() {\n  const [lists] = useQuery<ListRecord>('SELECT * FROM lists');\n\n  return (\n    <div>\n      <Show when={lists.loading}>\n        <p>Loading...</p>\n      </Show>\n      <Switch>\n        <Match when={lists.error}>\n          <span>Error: {lists.error}</span>\n        </Match>\n        <Match when={lists()}>\n          <div>{JSON.stringify(lists())}</div>\n        </Match>\n      </Switch>\n    </div>\n  );\n}\n```\n\n## License\n\n`powersync-solid` is licensed under the MIT license. See [LICENSE](LICENSE) for the full license text.\n","readmeFilename":"README.md"}