[ { "path": ".gitignore", "content": ".DS_Store\nnode_modules\n/build\n/.svelte-kit\n/.vscode\n/package\n/build\n.env\n.env.*\n/dist\n!.env.example\nvite.config.js.timestamp-*\nvite.config.ts.timestamp-*\n" }, { "path": ".npmrc", "content": "engine-strict=true\n" }, { "path": "CHANGELOG.md", "content": "# 2.8.0 - 2025-12-17\n### Added\n[client] Disable filter recursion [#187](https://github.com/vincjo/datatables/issues/187)\n\n```ts\nconst filter = table.createFilter(field).isNotRecursive()\nconst advancedFilter = table.createAdvancedFilter(field).isNotRecursive()\n```\n\n# 2.7.0 - 2025-11-25\n### Fixed\n[server] optimize (reduce) the number of reloads by removing irrelevant triggering events\n\n### Changed\nAdd an optional debounce parameter to the TableHandler. Default = 0\nThis adds delays before an invalidation is triggered.\n\n# 2.6.6 - 2025-10-08\n### Fixed\nfix: `RecordFilter` search capabilities.\n\n\n# 2.6.5 - 2025-10-08\n### Fixed\nfix: Server-Side pagination - Changing filters resets to page 1 [#179](https://github.com/vincjo/datatables/issues/179)\n\n\n# 2.6.4 - 2025-09-17\n### Fixed\nfix: remove console.log in `Calculation.round()`\n\n# 2.6.3 - 2025-09-07\n### Fixed\nfix: multiple criteria filter (AdvancedFilter) handles nullish values\n\n# 2.6.2 - 2025-07-16\n### Fixed \nfix: Broken package with $lib import\nhttps://github.com/vincjo/datatables/issues/169\n\n# 2.6.1 - 2025-07-14\n### Fixed\nfix: make sure `init()` arg can be undefined in any case.\n### Changed\n- upgrade Svelte to the latest 5.36.0\n\n# 2.6.0 - 2025-07-14\n### Added\nfeat: add `init()` method to initialize a value in \"search\", \"filter\" and \"sort\".\n\n\n# 2.5.0 - 2025-02-06\n### Added\nfeat: add the median calculation.\n```ts\nconst median = table.createCalculation('field').median()\n```\n\n# 2.4.0 - 2025-01-25\n### Added\nfeat: (experimental) add `queries` to handle filtering inside nested array of objects. \n```ts\ntable.createQuery('login_count')\n .from(['groups', 'users'])\n .where(check.isGreaterThan)\n .set(1000)\n\n// will check if \"user.login_count\" is greater than 1000 in users in groups\n```\n### Fixed\n- `selectAll`: remove duplicate keys [#157](https://github.com/vincjo/datatables/issues/157)\n\n\n\n# 2.3.1 - 2025-01-21\n### Changed\n- refactor: core functions has been organized into modules `/client/core/{value, entry, rows, check, field}`\n### Fixed\n- fix: add \"index.js\" to make type exports compatible with ES Module\n\n# 2.3.0 - 2025-01-15\n### Added\nfeat: add `search.recursive()` to handle search in tree data structures ([DOC](https://vincjo.fr/datatables/docs/client/search/recursive)).\n### Changed\n- breaking: search is not recursive by default anymore [#152](https://github.com/vincjo/datatables/issues/152)\n- upgrade Svelte to the latest 5.18.0\n\n\n# 2.2.0 - 2024-12-05\n### Added\nfeat: add `table.clearSort()` method [#150](https://github.com/vincjo/datatables/issues/150)\n\n\n# 2.1.0 - 2024-11-26\n### Fixed\n- export type AdvancedFilterBuilder [#145](https://github.com/vincjo/datatables/issues/145)\n- use random string instead of `crypto.randomUUID()` [PR #147](https://github.com/vincjo/datatables/pull/147)\n\n# 2.0.5 - 2024-10-24\n### Fixed\n- fix: `state_unsafe_mutation` error. currentPage is mutated in setters instead: filter.set() / search.set(). [#128](https://github.com/vincjo/datatables/issues/128) [#138](https://github.com/vincjo/datatables/issues/138)\n\n\n\n# 2.0.4 - 2024-10-22\n### Fixed\n- fix: (legacy) remove self closing tags\n\n\n# 2.0.3 - 2024-10-22\n### Changed\n- docs: stay on the same page after switch between client-side and server-side navigation\n### Fixed\n- fix: improve perf in the data filtering function\n- fix: prefer unknown type instead of enumerating primitives\n\n# 2.0.2 - 2024-10-21\n### Fixed\n- fix: remove runes tag from npm publication\n\n# 2.0.1 - 2024-10-21\n### Fixed\n- fix: `table.select(value: unknown)` select arg type is *unknown* instead of `T[keyof T]`\n\n\n# 2.0.0 - 2024-10-21\n- published major release\n\n# 2.0.0-runes.46 - 2024-10-21\n### Fixed\n- fix: `EventDispatcher`\n\n# 2.0.0-runes.45 - 2024-10-16\n### Fixed\n- fix: `clearSearch` maximum call stack exceeded\n\n# 2.0.0-runes.44 - 2024-10-14\n### Added\n- export type SearchBuilder, CSVBuilder, FilterBuilder, CalculationBuilder...\n- added RecordFilter class\n### Changed\n- feat: handle scrollTop status in setRows method\n- fix: replace structureCloned with $state.snapshot()\n\n# 2.0.0-runes.{40,41,42,43} - 2024-10-06\n### Fixed\n- back to `:global()` style: css import is not working as expected after packaging.\n\n# 2.0.0-runes.39 - 2024-10-06\n### Added\n- added `TableHandlerInterface` to improve shared components type.\n### Changed\n- update dependencies: svelte-next.262\n- breaking: `table.createCalcultaion().distinct()` parameter is now: `distinct({ sort: [field, direction] })` \n\n### Fixed\n- remove dupplicate builder: `ColumnViewBuilders`\n- remove dupplicate type definition: `Row`, `ColumnView`, `Internationalization`, `Field`\n- use generic `T` type in `AbstractTableHandler` instead of `Row` (server-side pagination).\n- distinct values has a default order in addition to sort param\n- fix `$$Generic` type for server-side pagination\n- fix `isAllSelected` when `selectScope` = 'all'\n\n\n# 2.0.0-runes.38 - 2024-10-04\n### Fixed\n- CSS import in `` component.\n\n# 2.0.0-runes.37 - 2024-09-29\n### Added\n- feat: make selectBy parameter type of `Field` so it can combine multiple fields or use a nested property as identifier\n- docs: added a [migration guide](https://github.com/vincjo/datatables/blob/runes/MIGRATION.md)\n### Changed\n- update dependencies: svelte-next.260\n### Fixed\n- added type=\"button\" in `` and `` components, including the legacy part.\n\n# 2.0.0-runes.{33,34,35,36} - 2024-09-16\n\n### Added\n- feat: add headless option for Datatable component\n- feat: use @import instead of :global() in Datatable component\n### Changed\n- update dependencies: svelte-next.257\n\n# 2.0.0-runes.32 - 2024-09-16\n\n### Changed\n- update dependencies: svelte-next.246\n\n\n# 2.0.0-runes.31 - 2024-07-25\n\n### Changed\n- rename type `ViewColumn` to `ColumnView`\n### Fixed\n- improve types\n- fix criterion value type\n\n# 2.0.0-runes.30 - 2024-07-01\n\n### Fixed\n- client-side: refactor / improve types\n\n# 2.0.0-runes.29 - 2024-06-30\n\n### Fixed\n- client-side: untrack sort and event dispatcher when rows are updated.\n\n\n# 2.0.0-runes.28 - 2024-06-30\n\n### Changed\n- client-side *(breaking)*: sort params for distinct values is now an object `{ field: 'value' | 'count', direction: 'asc' | 'desc' }` instead of an array\n- client-side: use crypto UUID instead of js random string\n- client-side: improve types\n\n# 2.0.0-runes.27 - 2024-06-29\n\n### Added\n- client-side: regular expression search takes scope parameter into account\n\n# 2.0.0-runes.26 - 2024-06-27\n\n### Added\n- server-side: added a `table.isLoading` state which is true while `invalidate()` method runs\n\n# 2.0.0-runes.25 - 2024-06-26\n\n### Fixed\n- server-side: column filtering\n" }, { "path": "CONTRIBUTING.md", "content": "# Contributing\nContributions are welcome.\n\n1. Fork the project\n2. ⚠️ Create your feature branch `git checkout -b myfeature`\n3. Commit your changes `git commit -m 'feat: my feature'`\n4. Push to the branch `git push origin myfeature`\n5. Open a Pull Request\n" }, { "path": "LICENSE", "content": "MIT License\n\nCopyright (c) 2020 vincjo\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n" }, { "path": "README.md", "content": "
\n \"logo\"\n

\n

svelte simple datatables

\n

A powerful toolkit for building datatable components.

\n \"any\n \"last\n

\n
\n\n\n\n# Docs\nStreamline your data workflow with a robust API providing advanced features while reducing code complexity.\n\n:globe_with_meridians: **[vincjo.fr/datatables](https://vincjo.fr/datatables)**\n\n\n\n# Install\n\n```apache\nnpm i -D @vincjo/datatables\n```\n\n\n# Smooth transition from v1 to v2\n\nIn order to make the migration process a little easier, v1 is embed in “legacy” namespace so you will have the opportunity to upgrade your components progressively by simply modifying imports.\n\n```diff\n- @vincjo/datatables\n+ @vincjo/datatables/legacy\n\n- @vincjo/datatables/remote\n+ @vincjo/datatables/legacy/remote\n```\n
\n\n\n# Sample code\n\n```svelte\n\n\n\n \n \n \n \n \n \n \n {#each table.rows as row}\n \n \n \n \n {/each}\n \n
First nameLast name
{row.first_name}{row.last_name}
\n```\n\n\n\n" }, { "path": "datatables.code-workspace", "content": "{\n\t\"folders\": [\n\t\t{ \"path\": \"./\" },\n\t\t{ \"path\": \"../autodoc\"}\n\t],\n\t\"settings\": {\n\t\t\"restoreTerminals.terminals\": [\n\t\t\t {\n\t\t\t\t\"profile\": \"Git Bash\",\n\t\t\t\t\"splitTerminals\": [{\n\t\t\t\t\t\"name\": \"API\",\n\t\t\t\t\t\"commands\": [\"cd ../autodoc && npm run dev\"],\n\t\t\t\t}],\n\t\t\t}, {\n\t\t\t\t\"profile\": \"Git Bash\",\n\t\t\t\t\"splitTerminals\": [{\n\t\t\t\t\t\"name\": \"DEV\",\n\t\t\t\t\t\"commands\": [\"npm run dev\"],\n\t\t\t\t}],\n\t\t\t}, {\n\t\t\t\t\"profile\": \"Git Bash\",\n\t\t\t\t\"splitTerminals\": [{\n\t\t\t\t\t\"name\": \"Git bash\",\n\t\t\t\t\t\"commands\": [\"cd ./\"],\n\t\t\t\t}],\n\t\t\t}\n\t\t],\n\t\t\"terminal.integrated.persistentSessionReviveProcess\": \"never\"\n\t}\n}" }, { "path": "ecosystem.config.cjs", "content": "module.exports = {\n apps: [\n {\n name: 'datatables',\n script: './build/index.js',\n watch: false,\n max_restarts: 10,\n env: {\n NODE_ENV: 'production',\n PORT: 3010\n }\n }\n ],\n deploy: {\n production: {\n user: 'vincjo',\n host: ['vincjo.fr -p 625'],\n ref: 'origin/main',\n repo: 'git@github.com:vincjo/datatables.git',\n path: '/home/vincjo/www/datatables',\n 'post-deploy':\n 'npm install --force && npm run build && pm2 startOrRestart ecosystem.config.cjs --env production'\n }\n }\n}\n" }, { "path": "mdsvex.config.js", "content": "import { defineMDSveXConfig as defineConfig } from 'mdsvex'\n\nconst config = defineConfig({\n extensions: ['.svelte.md', '.md', '.svx'],\n\n smartypants: {\n dashes: 'oldschool'\n },\n\n remarkPlugins: [],\n rehypePlugins: []\n})\n\nexport default config\n" }, { "path": "package.json", "content": "{\n \"name\": \"@vincjo/datatables\",\n \"version\": \"2.8.0\",\n \"keywords\": [\n \"svelte sveltejs table tables datatable datatables filter headless sort selection lazy-loading\"\n ],\n \"description\": \"A powerful toolkit for building datatable components\",\n \"repository\": {\n \"type\": \"git\",\n \"url\": \"git+https://github.com/vincjo/datatables.git\"\n },\n \"author\": \"vincjo\",\n \"contributors\": [\n \"bn-l\",\n \"jst-r\"\n ],\n \"license\": \"MIT\",\n \"bugs\": {\n \"url\": \"https://github.com/vincjo/datatables/issues\"\n },\n \"homepage\": \"https://vincjo.fr/datatables\",\n \"scripts\": {\n \"dev\": \"vite dev\",\n \"build\": \"vite build\",\n \"preview\": \"vite preview\",\n \"package\": \"svelte-kit sync && svelte-package\",\n \"publish:runes\": \"svelte-kit sync && svelte-package && npm publish\",\n \"check\": \"svelte-kit sync && svelte-check --tsconfig ./tsconfig.json\",\n \"check:watch\": \"svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch\",\n \"format\": \"prettier --plugin-search-dir . --write .\",\n \"deploy\": \"pm2 deploy ecosystem.config.cjs production\",\n \"deploy:setup\": \"pm2 deploy ecosystem.config.cjs production setup\"\n },\n \"devDependencies\": {\n \"@rollup/plugin-replace\": \"^6.0.2\",\n \"@sveltejs/adapter-node\": \"^5.2.13\",\n \"@sveltejs/kit\": \"^2.23.0\",\n \"@sveltejs/package\": \"=2.3.7\",\n \"@sveltejs/vite-plugin-svelte\": \"^6.0.0\",\n \"@types/node\": \"^24.0.13\",\n \"dotenv\": \"^17.2.0\",\n \"gros\": \"^1.1.3\",\n \"mdsvex\": \"^0.12.6\",\n \"prism-svelte\": \"^0.5.0\",\n \"prismjs\": \"^1.30.0\",\n \"svelte\": \"5.36.0\",\n \"svelte-check\": \"^4.2.2\",\n \"svelte-dnd-action\": \"^0.9.63\",\n \"svelte-preprocess\": \"^6.0.3\",\n \"tslib\": \"^2.8.1\",\n \"typescript\": \"^5.8.3\",\n \"vite\": \"^7.0.4\"\n },\n \"peerDependencies\": {\n \"svelte\": \"^5.16.0\"\n },\n \"type\": \"module\",\n \"files\": [\n \"dist\"\n ],\n \"svelte\": \"./dist/index.js\",\n \"types\": \"./dist/index.d.ts\",\n \"exports\": {\n \".\": {\n \"types\": \"./dist/index.d.ts\",\n \"css\": \"./dist/*.css\",\n \"svelte\": \"./dist/index.js\",\n \"default\": \"./dist/index.js\"\n },\n \"./server\": {\n \"types\": \"./dist/server/index.d.ts\",\n \"svelte\": \"./dist/server/index.js\",\n \"default\": \"./dist/server/index.js\"\n },\n \"./legacy\": {\n \"types\": \"./dist/legacy/index.d.ts\",\n \"svelte\": \"./dist/legacy/index.js\",\n \"default\": \"./dist/legacy/index.js\"\n },\n \"./legacy/remote\": {\n \"types\": \"./dist/legacy/remote/index.d.ts\",\n \"svelte\": \"./dist/legacy/remote/index.js\",\n \"default\": \"./dist/legacy/remote/index.js\"\n }\n }\n}\n" }, { "path": "src/app.d.ts", "content": "/// \n\n// See https://kit.svelte.dev/docs/types#app\n// for information about these interfaces\n// and what to do when importing types\ndeclare namespace App {\n // interface Locals {}\n // interface PageData {}\n // interface Error {}\n // interface Platform {}\n}\n" }, { "path": "src/app.html", "content": "\n\n \n \n \n \n \n \n \n \n \n svelte simple datatables\n\t\t\n %sveltekit.head%\n \n \n
%sveltekit.body%
\n \n\n" }, { "path": "src/hooks.server.ts", "content": "import type { RequestEvent } from '@sveltejs/kit'\n\n\nexport const handle = async ({ event, resolve }) => {\n const theme = event.cookies.get('siteTheme') ?? 'light'\n const mode = getMode(event)\n return resolve(event, {\n transformPageChunk: ({ html }) => { \n return html.replace(`data-theme=\"\"`, `data-theme=\"${theme}\"`)\n .replace(`data-mode=\"\"`, `data-mode=\"${mode}\"`)\n }\n })\n}\n\nconst getMode = (event: RequestEvent) => {\n if (event.url.pathname.includes('/server')) {\n return 'server'\n }\n else if (event.url.pathname.includes('/client')) {\n return 'client'\n }\n return event.cookies.get('siteMode') ?? 'client'\n}" }, { "path": "src/lib/index.ts", "content": "\nexport {\n // class:\n TableHandler,\n RecordFilter,\n // components:\n Datatable,\n Search,\n RowsPerPage,\n Th,\n ThSort,\n ThFilter,\n Pagination,\n RowCount,\n // utils:\n check,\n // types:\n type Field,\n type Check,\n type Internationalization,\n type Row,\n type TableParams,\n type SortParams,\n type TableHandlerInterface,\n\n type AdvancedFilterBuilder,\n type CalculationBuilder,\n type CSVBuilder,\n type FilterBuilder,\n type RecordFilterBuilder,\n type SearchBuilder,\n type SortBuilder,\n\n} from '$lib/src/client/index.js'\n" }, { "path": "src/lib/legacy/index.ts", "content": "// Reexport your entry components here\nimport DataHandler from './local/DataHandler'\nimport Datatable from './local/Datatable.svelte'\nimport Th from './local/Th.svelte'\nimport ThFilter from './local/ThFilter.svelte'\nimport Pagination from './local/Pagination.svelte'\nimport RowCount from './local/RowCount.svelte'\nimport RowsPerPage from './local/RowsPerPage.svelte'\nimport Search from './local/Search.svelte'\nimport { check } from './local/Comparator'\nimport type { Internationalization, Row, Field, Comparator, Filter, Sort, Selectable, Order, FilterBy, OrderBy } from './local'\n\nexport { DataHandler, check, Datatable, Th, ThFilter, Pagination, RowCount, RowsPerPage, Search }\n\nexport type {\n Internationalization,\n Row,\n Field,\n Comparator,\n Filter,\n Sort,\n\n // deprecated\n Selectable,\n Order,\n OrderBy,\n FilterBy,\n}" }, { "path": "src/lib/legacy/local/Comparator.ts", "content": "import type { Criterion } from '$lib/legacy/local'\n\nexport const check = {\n\n isLike: (entry: any, value: any) => {\n return stringify(entry).indexOf(stringify(value)) > -1\n },\n\n isNotLike: (entry: any, value: any) => {\n return stringify(entry).indexOf(stringify(value)) === -1\n },\n\n startsWith: (entry: any, value: any) => {\n return stringify(entry).startsWith(stringify(value))\n },\n\n endsWith: (entry: any, value: any) => {\n return stringify(entry).endsWith(stringify(value))\n },\n\n isEqualTo: (entry: any, value: any) => {\n return stringify(entry) === stringify(value)\n },\n\n isNotEqualTo: (entry: any, value: any) => {\n return stringify(entry) !== stringify(value)\n },\n\n isGreaterThan: (entry: number, value: number) => {\n if (isNull(entry)) return false\n return entry > value\n },\n\n isGreaterThanOrEqualTo: (entry: number, value: number) => {\n if (isNull(entry)) return false\n return entry >= value\n },\n\n isLessThan: (entry: number, value: number) => {\n if (isNull(entry)) return false\n return entry < value\n },\n\n isLessThanOrEqualTo: (entry: number, value: number) => {\n if (isNull(entry)) return false\n return entry <= value\n },\n\n isBetween: (entry: number, value: [min: number, max: number]) => {\n if (isNull(entry)) return false\n const [min, max] = value\n return entry >= min && entry <= max\n },\n\n isStrictlyBetween: (entry: number, value: [min: number, max: number]) => {\n if (isNull(entry)) return false\n const [min, max] = value\n return entry > min && entry < max\n },\n\n isTrue: (entry: boolean, _: any) => {\n return entry === true\n },\n\n isFalse: (entry: boolean, _: any) => {\n return entry === false\n },\n\n isNull: (entry: null, _: any) => {\n return entry === null || entry === undefined\n },\n\n isNotNull: (entry: any, _: any) => {\n return entry === null || entry === undefined ? false : true\n },\n\n whereIn: (entry: any, values: Criterion[] = []) => {\n if (isNull(entry)) return false\n if (values.length === 0) return false\n for(const { value, comparator } of values) {\n if (comparator(entry, value)) {\n return true\n }\n }\n return false\n },\n\n /**\n * @deprecated use \"isLike\" instead \n * @since 1.12.7 2023-09-27\n */\n contains: (entry: any, value: any) => {\n return check.isLike(entry, value)\n },\n}\n\n\n/* utils */\n\nfunction stringify(value: string | number | boolean = null) {\n return String(value)\n .toLowerCase()\n .normalize('NFD')\n .replace(/[\\u0300-\\u036f]/g, '')\n}\n\nfunction isNull(entry: any) {\n if (entry === null || entry === undefined) return true\n}" }, { "path": "src/lib/legacy/local/Context.ts", "content": "import { writable, derived, type Writable, type Readable } from 'svelte/store'\nimport type { Filter, Sort, Comparator, Criterion, Field } from '$lib/legacy/local'\nimport type { Params } from '$lib/legacy/local/DataHandler'\nimport { isNull, parseField } from './utils'\nimport { check } from './Comparator'\nimport EventHandler from './handlers/EventHandler'\n\n\nexport default class Context \n{\n public event : EventHandler\n public rowsPerPage : Writable\n public pageNumber : Writable\n public search : Writable<{ value?: string, scope?: (keyof Row)[] }>\n public filters : Writable[]>\n public filterCount : Readable\n public rawRows : Writable\n public filteredRows : Readable\n public pagedRows : Readable\n public rowCount : Readable<{ total: number, start: number, end: number }>\n public pages : Readable\n public pagesWithEllipsis : Readable\n public pageCount : Readable\n public sort : Writable<(Sort)>\n public selected : Writable<(Row | Row[keyof Row])[]>\n public selectScope : Writable<'all' | 'currentPage'>\n public isAllSelected : Readable\n\n constructor(data: Row[], params: Params) \n {\n this.event = new EventHandler()\n this.rowsPerPage = writable(params.rowsPerPage)\n this.pageNumber = writable(1)\n this.search = writable({})\n this.filters = writable([])\n this.filterCount = this.createFilterCount()\n this.rawRows = writable(data)\n this.filteredRows = this.createFilteredRows()\n this.pagedRows = this.createPagedRows()\n this.rowCount = this.createRowCount()\n this.pages = this.createPages()\n this.pagesWithEllipsis = this.createPagesWithEllipsis()\n this.pageCount = this.createPageCount()\n this.sort = writable({})\n this.selected = writable([])\n this.selectScope = writable('all')\n this.isAllSelected = this.createIsAllSelected()\n }\n\n private createFilterCount()\n {\n return derived(this.filters, ($filters) => $filters.length)\n }\n\n private createFilteredRows() \n {\n return derived(\n [this.rawRows, this.search, this.filters],\n ([$rawRows, $search, $filters]) => {\n if ($search.value) {\n $rawRows = $rawRows.filter((row) => {\n const fields = $search.scope ?? Object.keys(row) as Field[]\n const scope = fields.map((field: Field) => {\n const { callback } = parseField(field)\n return callback\n })\n return scope.some((callback) => {\n return this.match(callback(row), $search.value)\n })\n })\n this.pageNumber.set(1)\n this.selected.set([])\n this.event.trigger('change')\n }\n\n if ($filters.length > 0) {\n $filters.forEach((filter) => {\n return ($rawRows = $rawRows.filter((row) => {\n const entry = filter.callback(row)\n return this.match(entry, filter.value, filter.comparator)\n }))\n })\n this.pageNumber.set(1)\n this.selected.set([])\n this.event.trigger('change')\n }\n return $rawRows\n }\n )\n }\n\n private match(entry: Row[keyof Row], value: string|number|boolean|symbol|number[]|Criterion[], compare: Comparator = null) \n {\n if (isNull(value)) {\n return true\n }\n if (!entry && compare) {\n return compare(entry, value)\n }\n if (!entry) return check.isLike(entry, value)\n else if (typeof entry === 'object') {\n return Object.keys(entry).some((k) => {\n return this.match(entry[k], value, compare)\n })\n }\n if (!compare) return check.isLike(entry, value)\n return compare(entry, value)\n }\n\n private createPagedRows()\n {\n return derived(\n [this.filteredRows, this.rowsPerPage, this.pageNumber],\n ([$filteredRows, $rowsPerPage, $pageNumber]) => {\n if (!$rowsPerPage) {\n return $filteredRows\n }\n return $filteredRows.slice(\n ($pageNumber - 1) * $rowsPerPage,\n $pageNumber * $rowsPerPage\n )\n }\n )\n }\n\n private createRowCount()\n {\n return derived(\n [this.filteredRows, this.pageNumber, this.rowsPerPage],\n ([$filteredRows, $pageNumber, $rowsPerPage]) => {\n const total = $filteredRows.length\n if (!$rowsPerPage) {\n return { total: total, start: 1, end: total }\n }\n return {\n total: total,\n start: $pageNumber * $rowsPerPage - $rowsPerPage + 1,\n end: Math.min($pageNumber * $rowsPerPage, $filteredRows.length)\n }\n }\n )\n }\n\n private createPages()\n {\n return derived([this.rowsPerPage, this.filteredRows], ([$rowsPerPage, $filteredRows]) => {\n if (!$rowsPerPage) {\n return [1]\n }\n const pages = Array.from(Array(Math.ceil($filteredRows.length / $rowsPerPage)))\n return pages.map((_, i) => i + 1 )\n })\n }\n\n private createPagesWithEllipsis()\n {\n return derived([this.pages, this.pageNumber], ([$pages, $pageNumber]) => {\n if ($pages.length <= 7) {\n return $pages\n }\n const ellipse = null\n const firstPage = 1\n const lastPage = $pages.length\n if ($pageNumber <= 4) {\n return [\n ...$pages.slice(0, 5),\n ellipse,\n lastPage\n ]\n } else if ($pageNumber < $pages.length - 3) {\n return [\n firstPage,\n ellipse,\n ...$pages.slice($pageNumber - 2, $pageNumber + 1),\n ellipse,\n lastPage\n ]\n } else {\n return [\n firstPage,\n ellipse,\n ...$pages.slice($pages.length - 5,\n $pages.length)\n ]\n }\n })\n }\n\n private createPageCount()\n {\n return derived(this.pages, ($pages) => {\n return $pages.length\n })\n }\n\n private createIsAllSelected()\n {\n return derived(\n [this.selected, this.pagedRows, this.filteredRows, this.selectScope],\n ([$selected, $pagedRows, $filteredRows, $selectScope]) => {\n const rowCount = $selectScope === 'currentPage' ? $pagedRows.length : $filteredRows.length\n if (rowCount === $selected.length && rowCount !== 0) {\n return true\n }\n return false\n }\n )\n }\n}\n" }, { "path": "src/lib/legacy/local/DataHandler.ts", "content": "import Context from './Context'\nimport SortHandler from './handlers/SortHandler'\nimport SelectHandler from './handlers/SelectHandler'\nimport PageHandler from './handlers/PageHandler'\nimport SearchHandler from './handlers/SearchHandler'\nimport FilterHandler from './handlers/FilterHandler'\n\nimport FilterHelper from './helpers/FilterHelper'\nimport AdvancedFilterHelper from './helpers/AdvancedFilterHelper'\nimport CalculationHelper from './helpers/CalculationHelper'\n\nimport type { Readable, Writable } from 'svelte/store'\nimport type { Internationalization, Row, Field, Comparator } from '$lib/legacy/local'\n\nexport type Params = { rowsPerPage?: number, i18n?: Internationalization }\n\nexport default class DataHandler\n{\n private context : Context\n private sortHandler : SortHandler\n private selectHandler : SelectHandler\n private pageHandler : PageHandler\n private searchHandler : SearchHandler\n private filterHandler : FilterHandler\n public i18n : Internationalization\n\n constructor(data: T[] = [], params: Params = { rowsPerPage: null })\n {\n this.i18n = this.translate(params.i18n)\n this.context = new Context(data, params)\n this.sortHandler = new SortHandler(this.context)\n this.selectHandler = new SelectHandler(this.context)\n this.pageHandler = new PageHandler(this.context)\n this.searchHandler = new SearchHandler(this.context)\n this.filterHandler = new FilterHandler(this.context)\n }\n\n public setRows(data: T[])\n {\n this.context.rawRows.set(data)\n this.context.event.trigger('change')\n this.applySort()\n }\n\n public getRows(): Readable\n {\n return this.context.pagedRows\n }\n\n public getAllRows(): Readable\n {\n return this.context.filteredRows\n }\n\n public getRowCount(): Readable<{ total: number, start: number, end: number }>\n {\n return this.context.rowCount\n }\n\n public getRowsPerPage(): Writable\n {\n return this.context.rowsPerPage\n }\n\n public getPages(param = { ellipsis: false }): Readable\n {\n if (param.ellipsis) {\n return this.context.pagesWithEllipsis\n }\n return this.context.pages\n }\n\n public getPageCount(): Readable\n {\n return this.context.pageCount\n }\n\n public getPageNumber(): Readable\n {\n return this.context.pageNumber\n }\n\n public setPage(value: number | 'previous' | 'next'): void\n {\n switch (value) {\n case 'previous' : return this.pageHandler.previous()\n case 'next' : return this.pageHandler.next()\n default : return this.pageHandler.goto(value as number)\n }\n }\n\n public search(value: string, scope: Field[] = null)\n {\n this.searchHandler.set(value, scope)\n }\n\n public clearSearch()\n {\n this.searchHandler.clear()\n }\n\n public sort(orderBy: Field, identifier?: string)\n {\n this.setPage(1)\n this.sortHandler.set(orderBy, identifier)\n }\n\n public sortAsc(orderBy: Field, identifier?: string)\n {\n this.setPage(1)\n this.sortHandler.asc(orderBy, identifier)\n }\n\n public sortDesc(orderBy: Field, identifier?: string)\n {\n this.setPage(1)\n this.sortHandler.desc(orderBy, identifier)\n }\n\n public getSort(): Writable<{ identifier?: string, direction?: 'asc' | 'desc' }>\n {\n return this.context.sort\n }\n\n public applySort( params: { orderBy: Field, direction?: 'asc' | 'desc' } = null )\n {\n this.sortHandler.apply(params)\n }\n\n public defineSort(orderBy: Field, direction?: 'asc' | 'desc')\n {\n this.sortHandler.define(orderBy, direction)\n }\n\n public clearSort()\n {\n this.sortHandler.clear()\n }\n\n public filter( value: string | number | null | undefined | boolean | number[], filterBy: Field, comparator: Comparator = null )\n {\n this.filterHandler.set(value, filterBy, comparator)\n }\n\n public getFilters()\n {\n return this.filterHandler.get()\n }\n\n public createFilter( filterBy: Field, comparator?: Comparator )\n {\n return new FilterHelper( this.filterHandler, filterBy, comparator )\n }\n\n public createAdvancedFilter(filterBy: Field)\n {\n return new AdvancedFilterHelper(this.filterHandler, filterBy)\n }\n\n public getFilterCount(): Readable\n {\n return this.context.filterCount\n }\n\n public clearFilters(): void\n {\n this.filterHandler.clear()\n }\n\n public select(value: T | T[keyof T])\n {\n this.selectHandler.set(value)\n }\n\n public getSelected()\n {\n return this.context.selected\n }\n\n public selectAll(params: { selectBy?: keyof T; scope?: 'all' | 'currentPage' } = {}): void\n {\n this.context.selectScope.set(params.scope === 'currentPage' ? 'currentPage' : 'all')\n this.selectHandler.all(params.selectBy ?? null)\n }\n\n public isAllSelected(): Readable\n {\n return this.context.isAllSelected\n }\n\n public on(event: 'change' | 'clearFilters' | 'clearSearch', callback: () => void)\n {\n this.context.event.add(event, callback)\n }\n\n public createCalculation(field: Field, param: { precision: number } = null)\n {\n return new CalculationHelper(this.context, field, { precision: param?.precision ?? 2 })\n }\n\n public translate(i18n: Internationalization): Internationalization\n {\n return {\n ...{\n search: 'Search...',\n show: 'Show',\n entries: 'entries',\n filter: 'Filter',\n rowCount: 'Showing {start} to {end} of {total} entries',\n noRows: 'No entries found',\n previous: 'Previous',\n next: 'Next'\n },\n ...i18n\n }\n }\n\n\n\n\n /**\n * @deprecated use setRows() instead\n * @since v0.9.99 2023-01-16\n */\n public update(data: any[]): void\n {\n console.log(\n '%c%s',\n 'color:#e65100;background:#fff3e0;font-size:12px;border-radius:4px;padding:4px;text-align:center;',\n `DataHandler.update(data) method is deprecated. Please use DataHandler.setRows(data) instead`\n )\n this.context.rawRows.set(data)\n }\n\n /**\n * @deprecated use applySort() instead\n * @since v1.11.0 2023-07-11\n */\n public applySorting( params: { orderBy: Field, direction?: 'asc' | 'desc' } = null )\n {\n this.applySort(params)\n }\n\n /**\n * @deprecated use getSort() instead\n * @since v1.11.0 2023-07-11\n */\n public getSorted()\n {\n return this.getSort()\n }\n\n\n public getTriggerChange(): Writable\n {\n return this.context.event.triggerChange\n }\n}\n" }, { "path": "src/lib/legacy/local/Datatable.svelte", "content": "\n\n
\n
\n {#if search}\n \n {/if}\n {#if rowsPerPage}\n \n {/if}\n
\n\n
\n \n
\n\n
\n {#if rowCount}\n \n {/if}\n {#if pagination}\n \n {/if}\n
\n
\n\n\n" }, { "path": "src/lib/legacy/local/Pagination.svelte", "content": "\n\n
\n {#if small}\n \n \n \n \n {:else}\n \n {#each $pages as page}\n \n {/each}\n \n {/if}\n
\n\n\n" }, { "path": "src/lib/legacy/local/RowCount.svelte", "content": "\n\n\n\n\n" }, { "path": "src/lib/legacy/local/RowsPerPage.svelte", "content": "\n\n\n\n\n" }, { "path": "src/lib/legacy/local/Search.svelte", "content": "\n\n handler.search(value)}\n/>\n\n\n" }, { "path": "src/lib/legacy/local/Th.svelte", "content": "\n\n handler.sort(orderBy, identifier)}\n class:sortable={orderBy}\n class:active={$sort.identifier === identifier}\n class={$$props.class ?? ''}\n rowspan={rowSpan}\n>\n \n \n \n \n \n \n\n\n\n" }, { "path": "src/lib/legacy/local/ThFilter.svelte", "content": "\n\n\n handler.filter(value, filterBy, comparator)}\n />\n\n\n\n" }, { "path": "src/lib/legacy/local/handlers/EventHandler.ts", "content": "import { writable } from 'svelte/store'\n\n\nexport default class EventHandler\n{\n private events = {\n change : [] as (() => void)[],\n clearFilters: [] as (() => void)[],\n clearSearch : [] as (() => void)[]\n }\n public triggerChange = writable(0) // legacy\n\n\n public add(event: keyof EventHandler['events'], callback: () => void)\n {\n this.events[event].push(callback)\n }\n\n public trigger(event: keyof EventHandler['events'])\n {\n for (const callback of this.events[event]) {\n callback()\n }\n /* legacy: support for triggerChange store */\n if (event === 'change') {\n this.triggerChange.update((store) => { return store + 1 })\n }\n }\n}" }, { "path": "src/lib/legacy/local/handlers/FilterHandler.ts", "content": "import type { Filter, Field, Comparator, EventHandler, Criterion } from '$lib/legacy/local'\nimport { isNotNull } from '../utils'\nimport type Context from '$lib/legacy/local/Context'\nimport { type Writable, type Readable, derived } from 'svelte/store'\nimport { parseField } from '$lib/legacy/local/utils'\n// import { check } from '$lib/legacy/local/Comparator'\n\ntype Value = string | number | null | undefined | boolean | number[] | Criterion[]\n// type Collection = {\n// value: unknown\n// filterBy: Field\n// set: (value: unknown, comparator: Comparator) => void,\n// clear: () => void\n// }\n\n\nexport default class FilterHandler\n{\n protected filters: Writable[]>\n protected event: EventHandler\n private collection: Readable<{ value: unknown, filterBy: Field, check: string }[]>\n\n constructor(context: Context)\n {\n this.filters = context.filters\n this.event = context.event\n }\n\n public set(value: Value, filterBy: Field, comparator: Comparator = null, name?: string )\n {\n const { callback, identifier, key } = parseField(filterBy, name)\n const filter = { value, identifier, callback, comparator, key }\n this.filters.update((store) => {\n store = store.filter((item) => item.identifier !== identifier)\n if (isNotNull(value)) {\n store.push(filter)\n }\n return store\n })\n }\n\n public clear()\n {\n this.filters.set([])\n this.event.trigger('change')\n this.event.trigger('clearFilters')\n }\n\n public get()\n {\n if (this.collection) {\n return this.collection\n }\n this.collection = this.createCollection()\n return this.collection\n }\n\n private createCollection()\n {\n return derived(this.filters, ($filters) => {\n return $filters.map( ({ value, callback, key, comparator }) => {\n const filterBy = key as Field ?? callback\n return { \n value, \n filterBy,\n check: comparator ? comparator.name : 'isLike'\n // set: (value: Value, comparator: Comparator = check.isLike) => {\n // this.set(value, filterBy, comparator)\n // },\n // clear: () => {\n // this.set(undefined, filterBy)\n // }\n }\n })\n })\n }\n\n}\n" }, { "path": "src/lib/legacy/local/handlers/PageHandler.ts", "content": "import type Context from '$lib/legacy/local/Context'\nimport { type Writable, type Readable, get } from 'svelte/store'\nimport type { EventHandler } from '$lib/legacy/local'\n\nexport default class PageHandler \n{\n private pageNumber : Writable\n private rowCount : Readable<{ total: number, start: number, end: number }>\n private rowsPerPage : Writable\n private event : EventHandler\n\n constructor(context: Context) \n {\n this.pageNumber = context.pageNumber\n this.rowCount = context.rowCount\n this.rowsPerPage = context.rowsPerPage\n this.event = context.event\n }\n\n public goto(number: number)\n {\n this.pageNumber.update((store) => {\n const rowsPerPage = get(this.rowsPerPage)\n if (rowsPerPage) {\n const total = get(this.rowCount).total\n if (number >= 1 && number <= Math.ceil(total / rowsPerPage)) {\n store = number\n this.event.trigger('change')\n }\n }\n return store\n })\n }\n\n public previous()\n {\n const number = get(this.pageNumber) - 1\n this.goto(number)\n }\n\n public next()\n {\n const number = get(this.pageNumber) + 1\n this.goto(number)\n }\n}\n" }, { "path": "src/lib/legacy/local/handlers/SearchHandler.ts", "content": "import type Context from '$lib/legacy/local/Context'\nimport type { Writable } from 'svelte/store'\nimport type { EventHandler, Field } from '$lib/legacy/local'\n\nexport default class SearchHandler \n{\n private search : Writable<{ value?: string, scope?: Field[] }>\n private event : EventHandler\n\n constructor(context: Context) \n {\n this.search = context.search\n this.event = context.event\n }\n\n public set(value: string, scope: Field[] = null)\n {\n\n this.search.update((store) => {\n store = {\n value: value ?? '',\n scope: scope ?? null,\n }\n return store\n })\n }\n\n public clear()\n {\n this.search.set({ value: null, scope: null })\n this.event.trigger('change')\n this.event.trigger('clearSearch')\n }\n}\n" }, { "path": "src/lib/legacy/local/handlers/SelectHandler.ts", "content": "import type Context from '$lib/legacy/local/Context'\nimport { type Writable, type Readable, get } from 'svelte/store'\nimport type EventHandler from './EventHandler'\n\n\n\nexport default class SelectHandler \n{\n private filteredRows : Readable\n private pagedRows : Readable\n private selected : Writable<(Row | Row[keyof Row])[]>\n private scope : Writable<'currentPage' | 'all'>\n private isAllSelected : Readable\n private event : EventHandler\n\n constructor(context: Context) \n {\n this.filteredRows = context.filteredRows\n this.pagedRows = context.pagedRows\n this.selected = context.selected\n this.scope = context.selectScope\n this.isAllSelected = context.isAllSelected\n this.event = context.event\n }\n\n public set(value: Row[keyof Row] | Row) \n {\n const selected = get(this.selected)\n if (selected.includes(value)) {\n this.selected.set(selected.filter((item) => item !== value))\n } else {\n this.selected.set([value, ...selected])\n }\n }\n\n public all(selectBy: keyof Row = null) \n {\n const isAllSelected = get(this.isAllSelected)\n if (isAllSelected) {\n return this.clear()\n }\n const scope = get(this.scope)\n const rows = scope === 'currentPage' ? get(this.pagedRows) : get(this.filteredRows)\n\n if (scope === 'currentPage') {\n this.event.add('change', () => this.clear())\n }\n\n if (selectBy) {\n this.selected.set( rows.map((row) => row[selectBy]) )\n } else {\n this.selected.set(rows)\n }\n }\n\n public clear() \n {\n this.selected.set([])\n }\n}\n" }, { "path": "src/lib/legacy/local/handlers/SortHandler.ts", "content": "import type Context from '$lib/legacy/local/Context'\nimport type { Sort, Field, EventHandler } from '$lib/legacy/local'\nimport { type Writable, get } from 'svelte/store'\nimport { parseField } from '$lib/legacy/local/utils'\n\nexport default class SortHandler \n{\n private rawRows : Writable\n private event : EventHandler\n private sort : Writable<(Sort)>\n private backup : Sort[]\n\n constructor(context: Context) \n {\n this.rawRows = context.rawRows\n this.event = context.event\n this.sort = context.sort\n this.backup = []\n }\n\n public set(orderBy: Field = null, uid?: string)\n {\n if (!orderBy) return\n const sort = get(this.sort)\n const { identifier } = parseField(orderBy, uid)\n if (sort.identifier !== identifier) {\n this.sort.update((store) => (store.direction = null))\n }\n if (sort.direction === null || sort.direction === 'desc') {\n this.asc(orderBy, uid)\n } \n else if (sort.direction === 'asc') {\n this.desc(orderBy, uid)\n }\n }\n\n public asc(orderBy: Field, uid?: string)\n {\n if (!orderBy) return\n const { identifier, callback, key } = parseField(orderBy, uid)\n this.sort.set({ identifier, callback, direction: 'asc', key })\n this.rawRows.update((store) => {\n store.sort((x, y) => {\n const [a, b] = [callback(x), callback(y)]\n if (a === b) return 0\n if (a === null) return 1\n if (b === null) return -1\n if (typeof a === 'boolean') return a === false ? 1 : -1\n if (typeof a === 'string') return a.localeCompare(b as string)\n if (typeof a === 'number') return a - (b as number)\n if (typeof a === 'object') return JSON.stringify(a).localeCompare(JSON.stringify(b))\n else return String(a).localeCompare(String(b))\n })\n return store\n })\n this.log({ identifier, callback, direction: 'asc' })\n this.event.trigger('change')\n }\n\n public desc(orderBy: Field, uid?: string)\n {\n if (!orderBy) return\n const { identifier, callback, key } = parseField(orderBy, uid)\n this.sort.set({ identifier, callback, direction: 'desc', key })\n this.rawRows.update((store) => {\n store.sort((x, y) => {\n const [a, b] = [callback(x), callback(y)]\n if (a === b) return 0\n if (a === null) return 1\n if (b === null) return -1\n if (typeof b === 'boolean') return b === false ? 1 : -1\n if (typeof b === 'string') return b.localeCompare(a as string)\n if (typeof b === 'number') return b - (a as number)\n if (typeof b === 'object') return JSON.stringify(b).localeCompare(JSON.stringify(a))\n else return String(b).localeCompare(String(a))\n })\n return store\n })\n this.log({ identifier, callback, direction: 'desc' })\n this.event.trigger('change')\n }\n\n public apply(params: { orderBy: Field, direction?: 'asc' | 'desc' } = null) \n {\n if (params) {\n switch (params.direction) {\n case 'asc' : return this.asc(params.orderBy)\n case 'desc': return this.desc(params.orderBy)\n default : return this.set(params.orderBy)\n }\n }\n else {\n this.restore()\n }\n }\n\n public clear()\n {\n this.backup = []\n this.sort.set({})\n }\n\n public define(orderBy: Field, direction: 'asc' | 'desc' = 'asc')\n {\n if (!orderBy) return\n const { identifier, callback, key } = parseField(orderBy)\n this.sort.set({ identifier, callback, direction, key })\n }\n\n private restore()\n {\n for (const sort of this.backup) {\n const { key, callback, direction } = sort\n const param = key as Field ?? callback\n this[direction](param)\n }\n }\n\n private log(sort: Sort)\n {\n this.backup = this.backup.filter(item => item.identifier !== sort.identifier )\n if (this.backup.length >= 3) {\n const [_, slot2, slot3] = this.backup\n this.backup = [slot2, slot3, sort]\n }\n else {\n this.backup = [...this.backup, sort]\n }\n }\n}\n" }, { "path": "src/lib/legacy/local/helpers/AdvancedFilterHelper.ts", "content": "import type { Field, Comparator, Criterion } from '$lib/legacy/local'\nimport type FilterHandler from '$lib/legacy/local/handlers/FilterHandler'\nimport { type Writable, writable } from 'svelte/store'\nimport { check } from '$lib/legacy/local/Comparator'\n\ntype Value = string | number | [min: number, max: number]\n\nexport default class AdvancedFilterHandler\n{\n private filterHandler : FilterHandler\n private criteria : Criterion[]\n private filterBy : Field\n private selected : Writable\n\n constructor(filterHandler: FilterHandler, filterBy: Field)\n {\n this.filterHandler = filterHandler\n this.filterBy = filterBy\n this.criteria = []\n this.selected = writable([])\n }\n\n public set(value: Value, comparator: Comparator = check.isLike)\n {\n if (this.criteria.find(criterion => criterion.value === value)) {\n this.criteria = this.criteria.filter(criterion => criterion.value !== value)\n }\n else {\n this.criteria = [ { value, comparator }, ...this.criteria ]\n }\n if (this.criteria.length === 0) {\n return this.clear()\n }\n this.filterHandler.set(this.criteria, this.filterBy, check.whereIn)\n this.selected.set(this.criteria.map(criterion => criterion.value))\n }\n\n public getSelected()\n {\n return this.selected\n }\n\n public clear()\n {\n this.criteria = []\n this.selected.set([])\n this.filterHandler.set(undefined, this.filterBy, check.whereIn)\n }\n}\n" }, { "path": "src/lib/legacy/local/helpers/CalculationHelper.ts", "content": "import type { Field } from '$lib/legacy/local'\nimport type Context from '$lib/legacy/local/Context'\nimport { type Writable, type Readable, get, derived } from 'svelte/store'\nimport { parseField } from '$lib/legacy/local/utils' \n\nexport default class CalcultationHandler\n{\n private rawRows: Writable\n private filteredRows: Readable\n private callback: (row: Row) => Row[keyof Row]\n private precision: number\n\n constructor(context: Context, field: Field, param: { precision: number })\n {\n this.rawRows = context.rawRows\n this.filteredRows = context.filteredRows\n this.callback = parseField(field).callback\n this.precision = param.precision\n }\n\n public distinct(callback: (values: any[]) => any[] = null)\n {\n const rawRows = get(this.rawRows)\n const values = rawRows.map(row => this.callback(row))\n \n const array = callback ? callback(values) : values\n\n const result = array.reduce((acc, curr) => {\n acc[curr] = (acc[curr] ?? 0) + 1\n return acc\n }, {})\n return Object.entries(result).map(([value, count]) => ({ value, count }))\n }\n\n public avg(callback: (values: number[]) => any[] = null)\n {\n return derived(this.filteredRows, $filteredRows => {\n if ($filteredRows.length === 0) return 0\n const values = $filteredRows.map(row => this.callback(row)).filter(Boolean) as number[]\n const array = callback ? callback(values) : values\n return this.round(array.reduce((acc, curr) => acc + curr, 0) / array.length)\n })\n }\n\n public sum(callback: (values: number[]) => any[] = null)\n {\n return derived(this.filteredRows, $filteredRows => {\n const values = $filteredRows.map(row => this.callback(row)) as number[]\n const array = callback ? callback(values) : values\n return this.round(array.reduce((acc, curr) => acc + curr, 0))\n })\n }\n\n public bounds(callback: (values: number[]) => any[] = null): [min: number, max: number]\n {\n const rawRows = get(this.rawRows)\n const values = rawRows.map(row => this.callback(row))\n \n const numbers = callback ? callback(values as number[]) : values\n\n return [\n Math.min(...numbers.filter(Boolean)),\n Math.max(...numbers.filter(Boolean))\n ]\n }\n\n public setPrecision(value: number)\n {\n this.precision = value\n }\n\n private round(value: number)\n {\n if (this.precision === 0) {\n return Math.round(value)\n }\n const denominator = Math.pow(10, this.precision)\n return Math.round( (value + Number.EPSILON) * denominator ) / denominator\n }\n}" }, { "path": "src/lib/legacy/local/helpers/FilterHelper.ts", "content": "import type { Field, Comparator } from '$lib/legacy/local'\nimport { check } from '$lib/legacy/local/Comparator'\nimport type FilterHandler from '../handlers/FilterHandler'\n\ntype Value = string | number | boolean\n\nexport default class FilterHelper\n{\n private filterHandler : FilterHandler\n private filterBy : Field\n private uid : string\n private comparator : Comparator\n private callback : () => void\n\n constructor(filterHandler: FilterHandler, filterBy: Field, comparator?: Comparator)\n {\n this.filterHandler = filterHandler\n this.filterBy = filterBy\n this.uid = 'f_' + (Math.random()).toString(28).substring(2)\n this.comparator = comparator ?? check.isLike\n this.callback = () => null\n }\n\n public set(value: Value, comparator?: Comparator)\n {\n if (comparator) {\n this.comparator = comparator\n }\n this.filterHandler.set(value, this.filterBy, this.comparator, this.uid)\n }\n\n public clear()\n {\n this.callback()\n this.filterHandler.set(undefined, this.filterBy)\n }\n\n public on(event: 'clear', callback: () => void)\n {\n this.callback = callback\n }\n}\n" }, { "path": "src/lib/legacy/local/index.ts", "content": "// Reexport your entry components here\nimport DataHandler from './DataHandler'\nimport Datatable from './Datatable.svelte'\nimport Th from './Th.svelte'\nimport ThFilter from './ThFilter.svelte'\nimport Pagination from './Pagination.svelte'\nimport RowCount from './RowCount.svelte'\nimport RowsPerPage from './RowsPerPage.svelte'\nimport Search from './Search.svelte'\nimport { check } from './Comparator'\n\nexport { DataHandler, check, Datatable, Th, ThFilter, Pagination, RowCount, RowsPerPage, Search }\n\nexport type { default as EventHandler } from './handlers/EventHandler'\n\nexport type Internationalization = {\n search?: string\n show?: string\n entries?: string\n filter?: string\n rowCount?: string\n noRows?: string\n previous?: string\n next?: string\n}\n\nexport type Row = { [key: string]: any }\nexport type Field = keyof Row | ((row: Row) => Row[keyof Row])\n\n\nexport type Comparator = (entry: Row[keyof Row], value: any) => boolean\n\nexport type Criterion = { value: string | number | [min: number, max: number], comparator: Comparator }\n\nexport type Filter = {\n callback: (row: Row) => Row[keyof Row]\n identifier: string\n value?: string | number | boolean | symbol | Criterion[] | number[]\n comparator?: Comparator\n key?: string\n}\n\nexport type Sort = {\n callback?: (row: Row) => Row[keyof Row]\n identifier?: string\n direction?: 'asc' | 'desc'\n key?: string\n}\n\n\n\n\n/**\n * @deprecated use (Row[keyof Row] | Row) instead\n * \n * import type { Row } from '@vincjo/datatables'\n */\nexport type Selectable = Row[keyof Row] | Row\n\n/**\n * @deprecated use type Field instead\n * \n * import type { Field } from '@vincjo/datatables'\n */\nexport type FilterBy = Field\n\n/**\n * @deprecated use type Field instead\n * \n * import type { Field } from '@vincjo/datatables'\n */\nexport type OrderBy = Field\n\n/**\n * @deprecated use type Sort instead\n * \n * import type { Sort } from '@vincjo/datatables'\n */\nexport type Order = Sort" }, { "path": "src/lib/legacy/local/utils.ts", "content": "import type { Row, Field } from '$lib/legacy/local'\n\nexport const isNull = (value: any) => {\n if (value === null || value === undefined || value === '') return true\n return false\n}\nexport const isNotNull = (value: any) => { return !isNull(value) }\n\nexport const parseField = (field: Field, uid?: string) => {\n const identifier = uid ?? field.toString()\n if (typeof field === 'string') {\n return {\n callback: (row: Row) => row[field],\n identifier,\n key: field as string\n }\n } else if (typeof field === 'function') {\n return {\n callback: field,\n identifier,\n key: undefined\n }\n }\n throw new Error(`Invalid field argument: ${String(field)}`)\n}\n\n" }, { "path": "src/lib/legacy/remote/Context.ts", "content": "import { type Writable, writable, get, derived, type Readable } from 'svelte/store'\nimport type { State, Sort, Filter } from '$lib/legacy/remote'\nimport type { Params } from './DataHandler'\nimport EventHandler from './handlers/EventHandler'\n\nexport default class Context\n{\n public totalRows : Writable\n public rowsPerPage : Writable\n public pageNumber : Writable\n public event : EventHandler\n public search : Writable\n public filters : Writable[]>\n public rows : Writable\n public rowCount : Readable<{ total: number, start: number, end: number }>\n public pages : Readable\n public pagesWithEllipsis : Readable\n public pageCount : Readable\n public sort : Writable>\n public selected : Writable<(Row | Row[keyof Row])[]>\n public isAllSelected : Readable\n public selectedCount : Readable<{ count: number, total: number }>\n public selectBy : keyof Row | undefined\n\n\n constructor(data: Row[], params: Params)\n {\n this.totalRows = writable(params.totalRows)\n this.rowsPerPage = writable(params.rowsPerPage)\n this.pageNumber = writable(1)\n this.event = new EventHandler()\n this.search = writable('')\n this.filters = writable([])\n this.rows = writable(data)\n this.rowCount = this.createRowCount()\n this.pages = this.createPages()\n this.pagesWithEllipsis = this.createPagesWithEllipsis()\n this.pageCount = this.createPageCount()\n this.sort = writable(undefined)\n this.selected = writable([])\n this.isAllSelected = this.createIsAllSelected()\n this.selectedCount = this.createSelectedCount()\n this.selectBy = params.selectBy as keyof Row ?? undefined\n }\n\n public getState(): State\n {\n const pageNumber = get(this.pageNumber)\n const rowsPerPage = get(this.rowsPerPage)\n const sort = get(this.sort)\n const filters = get(this.filters)\n return {\n pageNumber,\n rowsPerPage,\n offset: rowsPerPage * (pageNumber - 1),\n search: get(this.search),\n sorted: sort ?? undefined as any, // deprecated\n sort: sort ?? undefined as any,\n filters: filters.length > 0 ? filters : undefined as any,\n setTotalRows: (value: number) => this.totalRows.set(value)\n }\n }\n\n private createPages()\n {\n return derived([this.rowsPerPage, this.totalRows], ([$rowsPerPage, $totalRows]) => {\n if (!$rowsPerPage || !$totalRows) {\n return undefined\n }\n const pages = Array.from(Array(Math.ceil($totalRows / $rowsPerPage)))\n return pages.map((_, i) => {\n return i + 1\n })\n })\n }\n\n private createPagesWithEllipsis()\n {\n return derived([this.pages, this.pageNumber], ([$pages, $pageNumber]) => {\n if (!$pages) {\n return undefined\n }\n if ($pages.length <= 7) {\n return $pages\n }\n const ellipse = null\n const firstPage = 1\n const lastPage = $pages.length\n if ($pageNumber <= 4) {\n return [\n ...$pages.slice(0, 5),\n ellipse,\n lastPage\n ]\n } else if ($pageNumber < $pages.length - 3) {\n return [\n firstPage,\n ellipse,\n ...$pages.slice($pageNumber - 2, $pageNumber + 1),\n ellipse,\n lastPage\n ]\n } else {\n return [\n firstPage,\n ellipse,\n ...$pages.slice($pages.length - 5,\n $pages.length)\n ]\n }\n })\n }\n\n private createPageCount()\n {\n return derived(this.pages, ($pages) => {\n if (!$pages) return undefined\n return $pages.length\n })\n }\n\n private createRowCount()\n {\n return derived(\n [this.totalRows, this.pageNumber, this.rowsPerPage],\n ([$totalRows, $pageNumber, $rowsPerPage]) => {\n\n if (!$rowsPerPage || !$totalRows) {\n return undefined\n }\n return {\n total: $totalRows,\n start: $pageNumber * $rowsPerPage - $rowsPerPage + 1,\n end: Math.min($pageNumber * $rowsPerPage, $totalRows)\n }\n }\n )\n }\n\n private createIsAllSelected()\n {\n return derived([this.selected, this.rows], ([$selected, $rows]) => {\n if ($rows.length === 0) {\n return false\n }\n if (this.selectBy) {\n const ids = $rows.map(row => row[this.selectBy])\n return ids.every(id => $selected.includes(id))\n }\n return $rows.every(row => $selected.includes(row as Row))\n })\n }\n\n private createSelectedCount()\n {\n return derived(\n [this.selected, this.totalRows],\n ([$selected, $totalRows]) => {\n return {\n count: $selected.length,\n total: $totalRows\n }\n }\n )\n }\n}" }, { "path": "src/lib/legacy/remote/DataHandler.ts", "content": "import Context from './Context'\nimport TriggerHandler from './handlers/TriggerHandler'\nimport SortHandler from './handlers/SortHandler'\nimport SelectHandler from './handlers/SelectHandler'\nimport PageHandler from './handlers/PageHandler'\nimport SearchHandler from './handlers/SearchHandler'\nimport FilterHandler from './handlers/FilterHandler'\n\nimport type { Writable, Readable } from 'svelte/store'\nimport type { Internationalization, Row, State, Sort } from '$lib/legacy/remote'\n\nexport type Params = {\n rowsPerPage ?: number,\n totalRows ?: number,\n selectBy ?: keyof Row,\n i18n ?: Internationalization\n}\n\nexport default class DataHandler\n{\n private context : Context\n private triggerHandler : TriggerHandler\n private sortHandler : SortHandler\n private selectHandler : SelectHandler\n private pageHandler : PageHandler\n private searchHandler : SearchHandler\n private filterHandler : FilterHandler\n public i18n : Internationalization\n\n constructor(data: T[] = [], params: Params = { rowsPerPage: 5 })\n {\n this.i18n = this.translate(params.i18n)\n this.context = new Context(data, params)\n this.triggerHandler = new TriggerHandler(this.context)\n this.sortHandler = new SortHandler(this.context)\n this.selectHandler = new SelectHandler(this.context)\n this.pageHandler = new PageHandler(this.context)\n this.searchHandler = new SearchHandler(this.context)\n this.filterHandler = new FilterHandler(this.context)\n }\n\n public onChange(callback: (state: State) => Promise)\n {\n this.triggerHandler.set(callback)\n }\n\n public invalidate()\n {\n this.triggerHandler.invalidate()\n }\n\n public setRows(data: T[])\n {\n this.context.rows.set(data)\n }\n\n public setTotalRows(value: number)\n {\n this.context.totalRows.set(value)\n }\n\n public getRows(): Writable\n {\n return this.context.rows\n }\n\n public select(value: T[keyof T] | T)\n {\n this.selectHandler.set(value)\n }\n\n public getSelected()\n {\n return this.context.selected\n }\n\n public selectAll(): void\n {\n this.selectHandler.all()\n }\n\n public isAllSelected(): Readable\n {\n return this.context.isAllSelected\n }\n\n public getSelectedCount(): Readable<{ count: number, total: number }>\n {\n return this.context.selectedCount\n }\n\n public clearSelection()\n {\n this.selectHandler.clear()\n }\n\n public getRowsPerPage(): Writable\n {\n return this.context.rowsPerPage\n }\n\n public sort(orderBy: keyof T)\n {\n this.setPage(1)\n this.sortHandler.set(orderBy)\n }\n\n public applySort( params: { orderBy: keyof T, direction?: 'asc' | 'desc' } = null )\n {\n this.sortHandler.apply(params)\n }\n\n public sortAsc(orderBy: keyof T)\n {\n this.setPage(1)\n this.sortHandler.asc(orderBy)\n }\n\n public sortDesc(orderBy: keyof T)\n {\n this.setPage(1)\n this.sortHandler.desc(orderBy)\n }\n\n public getSort(): Writable>\n {\n return this.context.sort\n }\n\n public search(value: string): void\n {\n this.setPage(1)\n this.context.search.set(value)\n }\n\n public clearSearch()\n {\n this.searchHandler.remove()\n }\n\n public filter(value: string | number, filterBy: keyof T)\n {\n this.setPage(1)\n return this.filterHandler.set(value, filterBy)\n }\n\n public clearFilters(): void\n {\n this.filterHandler.remove()\n }\n\n public getPages(params = { ellipsis: false }): Readable\n {\n if (params.ellipsis) {\n return this.context.pagesWithEllipsis\n }\n return this.context.pages\n }\n\n public getPageCount(): Readable\n {\n return this.context.pageCount\n }\n\n public getPageNumber(): Writable\n {\n return this.context.pageNumber\n }\n\n public setPage(value: number | 'previous' | 'next'): void\n {\n switch (value) {\n case 'previous' : return this.pageHandler.previous()\n case 'next' : return this.pageHandler.next()\n default : return this.pageHandler.goto(value as number)\n }\n }\n\n public getRowCount(): Readable<{ total: number, start: number, end: number }>\n {\n return this.context.rowCount\n }\n\n public on(event: 'change', callback: () => void)\n {\n this.context.event.add(event, callback)\n }\n\n public translate(i18n: Internationalization): Internationalization\n {\n return {\n ...{\n search: 'Search...',\n show: 'Show',\n entries: 'entries',\n filter: 'Filter',\n rowCount: 'Showing {start} to {end} of {total} entries',\n noRows: 'No entries found',\n previous: 'Previous',\n next: 'Next',\n selectedCount: '{count} of {total} row(s).'\n },\n ...i18n\n }\n }\n\n\n\n /**\n *\n * @depracted use on('change', callback) instead\n */\n public getTriggerChange(): Writable\n {\n return this.context.event.triggerChange\n }\n\n /**\n *\n * @deprecated use applySort() instead\n */\n public applySorting( params: { orderBy: keyof T, direction?: 'asc' | 'desc' } = null )\n {\n this.applySort(params)\n }\n\n\n /**\n *\n * @deprecated use getSort() instead\n */\n public getSorted()\n {\n return this.getSort()\n }\n}" }, { "path": "src/lib/legacy/remote/Datatable.svelte", "content": "\n\n
\n
\n {#if search}\n \n {:else}\n
\n {/if}\n {#if rowsPerPage}\n \n {/if}\n
\n\n
\n \n
\n\n
\n {#if selectedCount}\n \n {:else if rowCount}\n \n {/if}\n {#if pagination}\n \n {/if}\n
\n
\n\n\n" }, { "path": "src/lib/legacy/remote/Pagination.svelte", "content": "\n\n
\n {#if $pages === undefined}\n \n \n \n {:else}\n {#if small}\n \n \n \n \n {:else}\n \n {#each $pages as page}\n \n {/each}\n \n {/if}\n {/if}\n
\n\n\n" }, { "path": "src/lib/legacy/remote/README.md", "content": "
\n \"logo\"\n

\n

svelte simple datatables

\n

For server-side pagination

\n \"npm\n \"last\n

\n
\n\n\n**→ [Home](https://vincjo.fr/datatables/remote/home)**\n\n**→ [Examples](https://vincjo.fr/datatables/remote/examples)**" }, { "path": "src/lib/legacy/remote/RowCount.svelte", "content": "\n\n{#if $rowCount === undefined}\n
\n{:else}\n \n{/if}\n\n\n\n" }, { "path": "src/lib/legacy/remote/RowsPerPage.svelte", "content": "\n\n\n\n\n" }, { "path": "src/lib/legacy/remote/Search.svelte", "content": "\n\n\n\n\n" }, { "path": "src/lib/legacy/remote/SelectedCount.svelte", "content": "\n\n\n\n\n\n\n" }, { "path": "src/lib/legacy/remote/Th.svelte", "content": "\n\n\n \n \n \n \n \n \n\n\n\n" }, { "path": "src/lib/legacy/remote/ThFilter.svelte", "content": "\n\n\n \n\n\n\n" }, { "path": "src/lib/legacy/remote/handlers/EventHandler.ts", "content": "import { writable } from 'svelte/store'\n\n\nexport default class EventHandler\n{\n private events = {\n change : [] as (() => void)[],\n clearFilters: [] as (() => void)[],\n clearSearch : [] as (() => void)[]\n }\n public triggerChange = writable(0) // legacy\n\n\n public add(event: keyof EventHandler['events'], callback: () => void)\n {\n this.events[event].push(callback)\n }\n\n public trigger(event: keyof EventHandler['events'])\n {\n for (const callback of this.events[event]) {\n callback()\n }\n /* legacy: support for triggerChange store */\n if (event === 'change') {\n this.triggerChange.update((store) => { return store + 1 })\n }\n }\n}" }, { "path": "src/lib/legacy/remote/handlers/FilterHandler.ts", "content": "import type { Filter } from '$lib/legacy/remote'\nimport type Context from '$lib/legacy/remote/Context'\nimport type { Writable } from 'svelte/store'\n\nexport default class FilterHandler\n{\n public filters: Writable[]>\n\n constructor(context: Context) \n {\n this.filters = context.filters\n }\n\n public set(value: string | number, filterBy: keyof Row )\n {\n const filter = { filterBy, value }\n this.filters.update((store) => {\n store = store.filter((item) => {\n return (item.filterBy !== filterBy) && item.value\n })\n if (value) {\n store.push(filter)\n }\n return store\n })\n }\n\n public remove()\n {\n this.filters.set([])\n }\n}\n" }, { "path": "src/lib/legacy/remote/handlers/PageHandler.ts", "content": "import type Context from '$lib/legacy/remote/Context'\nimport { type Writable, type Readable, get } from 'svelte/store'\nimport type EventHandler from './EventHandler'\n\nexport default class PageHandler\n{\n public totalRows : Writable\n public pageNumber : Writable\n public rowCount : Readable<{ total: number, start: number, end: number }>\n public rowsPerPage : Writable\n public event : EventHandler\n public pages : Readable\n public selected : Writable<(Row | Row[keyof Row])[]>\n\n constructor(context: Context)\n {\n this.totalRows = context.totalRows\n this.pageNumber = context.pageNumber\n this.rowCount = context.rowCount\n this.rowsPerPage = context.rowsPerPage\n this.event = context.event\n this.pages = context.pages\n this.selected = context.selected\n }\n\n public get()\n {\n return this.pages\n }\n\n public goto(number: number)\n {\n const rowsPerPage = get(this.rowsPerPage)\n const totalRows = get(this.totalRows)\n\n this.pageNumber.update((store) => {\n if (rowsPerPage && totalRows) {\n if (number >= 1 && number <= Math.ceil(totalRows / rowsPerPage)) {\n store = number\n this.event.trigger('change')\n }\n return store\n }\n else {\n if (number >= 1) {\n store = number\n this.event.trigger('change')\n }\n return store\n }\n })\n }\n\n public previous()\n {\n const number = get(this.pageNumber) - 1\n this.goto(number)\n }\n\n public next()\n {\n const number = get(this.pageNumber) + 1\n this.goto(number)\n }\n}\n" }, { "path": "src/lib/legacy/remote/handlers/SearchHandler.ts", "content": "import type Context from '$lib/legacy/remote/Context'\nimport type { Writable } from 'svelte/store'\n\nexport default class SearchHandler \n{\n private search: Writable\n\n constructor(context: Context) {\n this.search = context.search\n }\n\n public set(value: string)\n {\n this.search.set(value ?? null)\n }\n\n public remove()\n {\n this.search.set(null)\n }\n}\n" }, { "path": "src/lib/legacy/remote/handlers/SelectHandler.ts", "content": "import type Context from '$lib/legacy/remote/Context'\nimport { type Writable, type Readable, get } from 'svelte/store'\n\n\n\nexport default class SelectHandler\n{\n private rows : Readable\n private selected : Writable<(Row | Row[keyof Row])[]>\n private isAllSelected : Readable\n private selectBy : keyof Row | undefined\n\n constructor(context: Context)\n {\n this.rows = context.rows\n this.selected = context.selected\n this.isAllSelected = context.isAllSelected\n this.selectBy = context.selectBy\n }\n\n public set(value: Row | Row[keyof Row])\n {\n const selected = get(this.selected)\n if (selected.includes(value)) {\n this.selected.set(selected.filter((item) => item !== value))\n }\n else {\n this.selected.set([value, ...selected])\n }\n }\n\n public all()\n {\n const rows = get(this.rows)\n const isAllSelected = get(this.isAllSelected)\n this.selected.update( store => {\n if (this.selectBy) {\n return store = store.filter(item => !rows.map((row) => row[this.selectBy]).includes(item as Row[keyof Row]))\n }\n return store = store.filter(item => !rows.includes(item as Row))\n })\n if (!isAllSelected) {\n this.selected.update( store => {\n if (this.selectBy) {\n store = [...rows.map((row) => row[this.selectBy]), ...store]\n }\n else {\n store = [...rows, ...store]\n }\n return store\n })\n }\n }\n\n public clear()\n {\n this.selected.set([])\n }\n}" }, { "path": "src/lib/legacy/remote/handlers/SortHandler.ts", "content": "import type Context from '$lib/legacy/remote/Context'\nimport type { Order } from '$lib/legacy/remote'\nimport { type Writable, get } from 'svelte/store'\nimport type EventHandler from './EventHandler'\n\nexport default class SortHandler\n{\n private event : EventHandler\n private hasMultipleSort : boolean\n private sort : Writable>\n\n constructor(context: Context)\n {\n this.event = context.event\n this.hasMultipleSort = false\n this.sort = context.sort\n }\n\n public set(orderBy: keyof Row = null)\n {\n if (!orderBy) return\n const sort = get(this.sort)\n\n if(!sort || sort.orderBy !== orderBy) {\n this.asc(orderBy)\n }\n else if (sort.direction === 'asc') {\n this.desc(sort.orderBy)\n }\n else if (sort.direction === 'desc') {\n this.asc(orderBy)\n } \n }\n\n public asc(orderBy: keyof Row)\n {\n if (!orderBy) return\n this.sort.set({ orderBy, direction: 'asc' })\n this.event.trigger('change')\n }\n\n public desc(orderBy: keyof Row)\n {\n if (!orderBy) return\n this.sort.set({ orderBy, direction: 'desc' })\n this.event.trigger('change')\n }\n\n public apply(params: { orderBy: keyof Row, direction?: 'asc' | 'desc' } = null)\n {\n if (params) {\n switch (params.direction) {\n case 'asc' : return this.asc(params.orderBy)\n case 'desc': return this.desc(params.orderBy)\n default : return this.set(params.orderBy)\n }\n }\n const sort = get(this.sort)\n if (sort) {\n return this.apply({ orderBy: sort.orderBy, direction: sort.direction })\n }\n return\n }\n\n\n // public set(orderBy: keyof Row, direction: 'asc' | 'desc')\n // {\n // const sort = { orderBy, direction }\n // if (this.hasMultipleSort === false) {\n // this.sort.set([ sort ])\n // return\n // }\n // this.sort.update((store) => {\n // store = store.filter((item) => {\n // return (item.orderBy !== orderBy) && item.direction\n // })\n // if (orderBy) {\n // store.push(sort)\n // }\n // return store\n // })\n // }\n\n // public sort(orderBy: keyof Row = null)\n // {\n // if (!orderBy) return\n // const sort = get(this.sort)\n // const exists = sort.find(sort => sort.orderBy === orderBy)\n\n // if(!exists) {\n // this.sortAsc(orderBy)\n // }\n // else if (exists.direction === 'asc') {\n // this.sortDesc(exists.orderBy)\n // }\n // else if (exists.direction === 'desc') {\n // this.sortAsc(orderBy)\n // } \n // }\n\n // public sortAsc(orderBy: keyof Row)\n // {\n // if (!orderBy) return\n // this.set( orderBy, 'asc' )\n // this.triggerChange.update((store) => { return store + 1 })\n // }\n\n // public sortDesc(orderBy: keyof Row)\n // {\n // if (!orderBy) return\n // this.set( orderBy, 'desc' )\n // this.triggerChange.update((store) => { return store + 1 })\n // }\n\n // public applySorting(params: { orderBy: keyof Row, direction?: 'asc' | 'desc' } = null)\n // {\n // if (params) {\n // switch (params.direction) {\n // case 'asc' : return this.sortAsc(params.orderBy)\n // case 'desc': return this.sortDesc(params.orderBy)\n // default : return this.sort(params.orderBy)\n // }\n // }\n // const sort = get(this.sort)\n // if (sort.length > 0) {\n // for (const order of sort) {\n // return this.applySorting({ orderBy: order.orderBy, direction: order.direction })\n // }\n // }\n // return\n // }\n}\n" }, { "path": "src/lib/legacy/remote/handlers/TriggerHandler.ts", "content": "import type { State } from '$lib/legacy/remote'\nimport type Context from '$lib/legacy/remote/Context'\n\n\nexport default class TriggerHandler\n{\n private context: Context\n private reload: (state: State) => Promise\n\n constructor(context: Context)\n {\n this.context = context\n }\n\n public set(callback: (state: State) => Promise)\n {\n this.reload = callback\n }\n\n public async invalidate()\n {\n if (!this.reload) return\n const state = this.context.getState()\n const data = await this.reload(state)\n if (data) {\n this.context.rows.set(data)\n }\n }\n}\n\n" }, { "path": "src/lib/legacy/remote/index.ts", "content": "// Reexport your entry components here\nimport DataHandler from './DataHandler'\nimport Datatable from './Datatable.svelte'\nimport Search from './Search.svelte'\nimport RowsPerPage from './RowsPerPage.svelte'\nimport Th from './Th.svelte'\nimport ThFilter from './ThFilter.svelte'\nimport RowCount from './RowCount.svelte'\nimport SelectedCount from './SelectedCount.svelte'\nimport Pagination from './Pagination.svelte'\n\nexport { DataHandler, Datatable, Search, RowsPerPage, Th, ThFilter, RowCount, SelectedCount, Pagination }\n\nexport type Internationalization = {\n search ?: string\n show ?: string\n entries ?: string\n filter ?: string\n rowCount ?: string\n noRows ?: string\n previous ?: string\n next ?: string\n selectedCount ?: string\n}\n\nexport type Row = { [key: string]: unknown }\n\nexport type Filter = {\n filterBy: keyof Row\n value?: string | number | boolean\n}\n\nexport type Sort = {\n orderBy?: keyof Row\n direction?: 'asc' | 'desc'\n}\n\n\nexport type State = {\n pageNumber: number,\n rowsPerPage: number,\n offset: number,\n search: string | undefined,\n sort: Sort | undefined\n filters: Filter[] | undefined\n setTotalRows: (value: number) => void\n /**\n * @deprecated use 'sort' instead\n */\n sorted: Sort | undefined\n}\n\n\n/**\n * @deprecated use (Row[keyof Row] | Row) instead\n * @since v1.13.0 2023-11-14\n *\n * import type { Row } from '@vincjo/datatables'\n */\nexport type Selectable = Row[keyof Row] | Row\n\n\n/**\n * @deprecated use type Sort instead\n * @since v1.13.0 2023-11-14\n *\n * import type { Sort } from '@vincjo/datatables'\n */\nexport type Order = Sort" }, { "path": "src/lib/server/index.ts", "content": "export {\n // class:\n TableHandler,\n // components:\n Datatable,\n Search,\n RowsPerPage,\n Th,\n ThSort,\n ThFilter,\n Pagination,\n RowCount,\n // types:\n type Row,\n type State,\n type Filter,\n type Sort,\n type Internationalization,\n type TableHandlerInterface\n} from '$lib/src/server/index.js'\n\n\n" }, { "path": "src/lib/src/client/AbstractTableHandler.svelte.ts", "content": "import type { Field, TableParams } from '$lib/src/client'\nimport { EventDispatcher } from '$lib/src/shared'\nimport { type Search, type Filter, type Query, type Sort, data, parse } from './core'\n\n\nexport default abstract class AbstractTableHandler\n{\n protected selectBy ?: Field\n protected selectScope = $state<'all' | 'currentPage'>('currentPage')\n protected highlight : boolean\n protected event = new EventDispatcher()\n protected rawRows = $state.raw([])\n protected search = $state<(Search)>({ value: null })\n protected sort = $state<(Sort)>({})\n\n public filters = $state<(Filter)[]>([])\n public queries = $state<(Query)[]>([])\n public rowsPerPage = $state(10)\n public currentPage = $state(1)\n public element = $state(undefined)\n public clientWidth = $state(1000)\n public filterCount = $derived(this.filters.length)\n public allRows = $derived[]>(this.createAllRows())\n public rows = $derived[]>(this.createRows())\n public rowCount = $derived<{total: number, start: number, end: number, selected: number}>(this.createRowCount())\n public pages = $derived(this.createPages())\n public pageCount = $derived(this.pages.length)\n public pagesWithEllipsis = $derived(this.createPagesWithEllipsis())\n public selected = $state([])\n public isAllSelected = $derived(this.createIsAllSelected())\n\n constructor(data: Row[], params: TableParams)\n {\n this.rawRows = data\n this.rowsPerPage = params.rowsPerPage ?? null\n this.highlight = params.highlight ?? false\n this.selectBy = params.selectBy\n }\n\n private createAllRows()\n {\n let allRows = $state.snapshot(this.rawRows)\n if (this.search.value) {\n allRows = data.search(allRows, this.search, this.highlight)\n this.event.dispatch('change')\n }\n else if (this.filters.length > 0) {\n for (const filter of this.filters) {\n allRows = data.filter(allRows, filter, this.highlight)\n }\n this.event.dispatch('change')\n }\n else if (this.queries.length > 0) {\n for (const query of this.queries) {\n allRows = data.query(allRows, query)\n }\n this.event.dispatch('change')\n }\n return allRows\n }\n\n private createRows()\n {\n if (!this.rowsPerPage) return this.allRows\n return this.allRows.slice(\n (this.currentPage - 1) * this.rowsPerPage,\n this.currentPage * this.rowsPerPage\n )\n }\n\n private createRowCount()\n {\n const total = this.allRows.length\n if (!this.rowsPerPage) {\n return { total: total, start: 1, end: total, selected: this.selected.length }\n }\n return {\n total: total,\n start: this.currentPage * this.rowsPerPage - this.rowsPerPage + 1,\n end: Math.min(this.currentPage * this.rowsPerPage, total),\n selected: this.selected.length\n }\n }\n\n private createPages()\n {\n if (!this.rowsPerPage) {\n return [1]\n }\n const pages = Array.from(Array(Math.ceil(this.allRows.length / this.rowsPerPage)))\n return pages.map((_, i) => i + 1 )\n }\n\n private createPagesWithEllipsis()\n {\n if (this.pageCount <= 7) {\n return this.pages\n }\n const ellipse = null\n const firstPage = 1\n const lastPage = this.pageCount\n if (this.currentPage <= 4) {\n return [\n ...this.pages.slice(0, 5),\n ellipse,\n lastPage\n ]\n } else if (this.currentPage < lastPage - 3) {\n return [\n firstPage,\n ellipse,\n ...this.pages.slice(this.currentPage - 2, this.currentPage + 1),\n ellipse,\n lastPage\n ]\n } else {\n return [\n firstPage,\n ellipse,\n ...this.pages.slice(lastPage - 5, lastPage)\n ]\n }\n }\n\n private createIsAllSelected()\n {\n if (this.rowCount.total === 0 || !this.selectBy) {\n return false\n }\n const { callback } = parse(this.selectBy)\n if (this.selectScope === 'all') {\n const identifiers = this.allRows.map(callback)\n return identifiers.every(id => this.selected.includes(id))\n }\n const identifiers = this.rows.map(callback)\n return identifiers.every(id => this.selected.includes(id))\n }\n}\n" }, { "path": "src/lib/src/client/TableHandler.svelte.ts", "content": "import { untrack } from 'svelte'\nimport AbstractTableHandler from './AbstractTableHandler.svelte'\n\nimport SortHandler from './handlers/SortHandler.svelte'\nimport FilterHandler from './handlers/FilterHandler.svelte'\nimport QueryHandler from './handlers/QueryHandler.svelte'\nimport SelectHandler from './handlers/SelectHandler.svelte'\nimport PageHandler from './handlers/PageHandler.svelte'\nimport SearchHandler from './handlers/SearchHandler.svelte'\n\nimport type { Internationalization, Row, Field, Check, TableParams, ColumnView, TableHandlerInterface } from '$lib/src/client'\n\nimport ViewBuilder from '../shared/builders/ViewBuilder.svelte'\nimport SearchBuilder from './builders/SearchBuilder.svelte'\nimport FilterBuilder from './builders/FilterBuilder.svelte'\nimport QueryBuilder from './builders/QueryBuilder.svelte'\nimport AdvancedFilterBuilder from './builders/AdvancedFilterBuilder.svelte'\nimport CalculationBuilder from './builders/CalculationBuilder.svelte'\nimport SortBuilder from './builders/SortBuilder.svelte'\nimport CSVBuilder from './builders/CSVBuilder.svelte'\nimport RecordFilterBuilder from './builders/RecordFilterBuilder.svelte'\n\n\nexport default class TableHandler extends AbstractTableHandler implements TableHandlerInterface\n{\n public i18n : Internationalization\n private view : ViewBuilder\n private sortHandler : SortHandler\n private filterHandler : FilterHandler\n private queryHandler : QueryHandler\n private selectHandler : SelectHandler\n private pageHandler : PageHandler\n private searchHandler : SearchHandler\n\n constructor(data: T[] = [], params: TableParams = { rowsPerPage: null })\n {\n super(data, params)\n this.translate(params.i18n)\n this.sortHandler = new SortHandler(this)\n this.filterHandler = new FilterHandler(this)\n this.queryHandler = new QueryHandler(this)\n this.selectHandler = new SelectHandler(this)\n this.pageHandler = new PageHandler(this)\n this.searchHandler = new SearchHandler(this)\n }\n\n public setRows(data: T[]): void\n {\n const scrollTop = this.element?.scrollTop ?? 0\n this.rawRows = data\n untrack(() => {\n this.event.dispatch('change')\n this.sortHandler.restore()\n if (this.element) {\n setTimeout(() => this.element.scrollTop = scrollTop, 2)\n }\n })\n }\n\n public setRowsPerPage(value: number): void\n {\n this.rowsPerPage = value\n this.setPage(1)\n }\n\n public setPage(value: number | 'previous' | 'next' | 'last'): void\n {\n switch (value) {\n case 'previous' : return this.pageHandler.previous()\n case 'next' : return this.pageHandler.next()\n case 'last' : return this.pageHandler.last()\n default : return this.pageHandler.goto(value as number)\n }\n }\n\n public createSearch(scope?: Field[]): SearchBuilder\n {\n return new SearchBuilder(this.searchHandler, scope)\n }\n\n public clearSearch(): void\n {\n this.searchHandler.clear()\n this.event.dispatch('clearSearch')\n this.setPage(1)\n }\n\n public createRecordFilter(records?: Row[]): RecordFilterBuilder\n {\n return new RecordFilterBuilder(records)\n }\n\n public createSort(field: Field, params?: { locales: Intl.LocalesArgument, options: Intl.CollatorOptions}): SortBuilder\n {\n return new SortBuilder(this.sortHandler, field, params)\n }\n\n public clearSort()\n {\n this.sortHandler.clear()\n }\n\n public clearFilters(): void\n {\n this.filters = []\n this.event.dispatch('clearFilters')\n this.setPage(1)\n }\n\n public createAdvancedFilter(field: Field, check?: Check): AdvancedFilterBuilder\n {\n return new AdvancedFilterBuilder(this.filterHandler, field, check)\n }\n\n public createFilter(field: Field, check?: Check): FilterBuilder\n {\n return new FilterBuilder(this.filterHandler, field, check)\n }\n\n public createQuery(): QueryBuilder\n {\n return new QueryBuilder(this.queryHandler)\n }\n\n public select(value: unknown): void\n {\n this.selectHandler.set(value)\n }\n\n public selectAll(params: { scope?: 'all' | 'currentPage' } = {}): void\n {\n this.selectScope = (params.scope === 'all') ? 'all' : 'currentPage'\n this.selectHandler.all(this.selectScope)\n }\n\n public getSelectedRows(): T[]\n {\n return this.selectHandler.getRows()\n }\n\n public clearSelection(): void\n {\n this.selectHandler.clear()\n }\n\n public on(event: 'change' | 'clearFilters' | 'clearSearch', callback: () => void)\n {\n this.event.add(event, callback)\n }\n\n public createCalculation(field: Field): CalculationBuilder\n {\n return new CalculationBuilder(this, field)\n }\n\n public createCSV(): CSVBuilder\n {\n return new CSVBuilder(this)\n }\n\n public createView(columns: ColumnView[]): ViewBuilder\n {\n this.view = new ViewBuilder(this, columns)\n return this.view\n }\n\n public getView(): ViewBuilder\n {\n return this.view\n }\n\n private translate(i18n: Internationalization): void\n {\n this.i18n = {\n ...{\n search: 'Search...',\n show: 'Show',\n entries: 'entries',\n filter: 'Filter',\n rowCount: 'Showing {start} to {end} of {total} entries',\n noRows: 'No entries found',\n previous: 'Previous',\n next: 'Next'\n },\n ...i18n\n }\n }\n}\n" }, { "path": "src/lib/src/client/builders/AdvancedFilterBuilder.svelte.ts", "content": "import type { Field, Check, Criterion } from '$lib/src/client'\nimport type FilterHandler from '$lib/src/client/handlers/FilterHandler.svelte'\nimport { check as comparator } from '$lib/src/client/core'\n\nexport default class AdvancedFilterBuilder\n{\n public criteria = $state([])\n private id = Math.random().toString(36).substring(2, 15)\n private filterHandler : FilterHandler\n private collection : Criterion[]\n private field : Field\n private check : Check\n private isRecursive = true\n\n constructor(filterHandler: FilterHandler, field: Field, check?: Check)\n {\n this.filterHandler = filterHandler\n this.field = field\n this.collection = []\n this.check = check ?? comparator.isEqualTo\n this.cleanup()\n }\n\n public set(value: unknown, check?: Check): void\n {\n if (this.collection.find(criterion => criterion.value === value)) {\n this.collection = this.collection.filter(criterion => criterion.value !== value)\n }\n else {\n this.collection = [ { value, check: check ?? this.check }, ...this.collection ]\n }\n if (this.collection.length === 0) {\n return this.clear()\n }\n this.filterHandler.set(this.collection, this.field, comparator.whereIn, this.id, this.isRecursive)\n this.criteria = this.collection.map(criterion => criterion.value)\n }\n\n public isNotRecursive()\n {\n this.isRecursive = false\n return this\n }\n\n public clear(): void\n {\n this.collection = []\n this.criteria = []\n this.filterHandler.unset(this.id)\n }\n\n private cleanup()\n {\n this.filterHandler['table'].on('clearFilters', () => this.clear())\n }\n}\n" }, { "path": "src/lib/src/client/builders/CSVBuilder.svelte.ts", "content": "import type { TableHandler } from '$lib/src/client'\n\nexport default class CSVBuilder\n{\n private table: TableHandler\n\n constructor(table: TableHandler)\n {\n this.table = table\n }\n\n public download(filename: string)\n {\n const csv = this.get()\n const element = document.createElement('a')\n element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(csv))\n element.setAttribute('download', filename)\n\n element.style.display = 'none'\n document.body.appendChild(element)\n\n element.click()\n document.body.removeChild(element)\n }\n\n public get(): string\n {\n const rows = this.getRows()\n rows.unshift(this.getHeader().join(','))\n return rows.join('\\r\\n')\n }\n\n private getRows()\n {\n return this.table.allRows.map(row => {\n const entries = Object.entries(row).map(([_, value]) => {\n if (value === null) return ''\n if (typeof value === 'number') {\n return value\n }\n return `\"${value}\"`\n })\n return entries.join(',')\n })\n }\n\n private getHeader()\n {\n const [row] = this.table.allRows\n return Object.entries(row).map(([key, _]) => {\n return `\"${key}\"`\n })\n }\n}\n" }, { "path": "src/lib/src/client/builders/CalculationBuilder.svelte.ts", "content": "import type { Field, TableHandler } from '$lib/src/client'\nimport { sort, parse } from '$lib/src/client/core'\n\ntype Sort = [key: 'value' | 'count', direction: 'asc' | 'desc']\n\nexport default class CalcultationBuilder\n{\n private callback : (row: $state.Snapshot) => string | number\n private precision : number\n private table : TableHandler\n\n constructor(table: TableHandler, field: Field)\n {\n this.table = table\n this.callback = parse(field).callback as (row: $state.Snapshot) => string | number\n }\n\n public distinct(param?: { sort: Sort }): { value: string, count: number }[]\n {\n const values = this.table.allRows.map(row => this.callback(row))\n\n const aggregate: { [key: string ]: number } = values.reduce((acc, curr) => {\n if (Array.isArray(curr)) {\n for (const item of curr) {\n acc[item] = (acc[item] ?? 0) + 1\n }\n return acc\n }\n acc[curr] = (acc[curr] ?? 0) + 1\n return acc\n }, {})\n const result = Object.entries(aggregate).map(([value, count]) => ({ value, count }))\n if (param?.sort) {\n const [field, direction] = param.sort\n if (field === 'count') {\n result.sort((x, y) => sort.asc(x.value, y.value))\n }\n result.sort((a, b) => sort[direction](a[field], b[field]))\n }\n return result\n }\n\n public avg(param?: { precision: number }): number\n {\n this.precision = param?.precision ?? 2\n if (this.table.allRows.length === 0) return 0\n const values = this.table.allRows.map(row => this.callback(row)).filter(Boolean) as number[]\n return this.round(values.reduce((acc, curr) => acc + curr, 0) / values.length)\n }\n\n public sum(param?: { precision: number }): number\n {\n this.precision = param?.precision ?? 2\n const values = this.table.allRows.map(row => this.callback(row)) as number[]\n return this.round(values.reduce((acc, curr) => acc + curr, 0))\n }\n\n public median(param?: { precision: number }): number\n {\n this.precision = param?.precision ?? 2\n const values = [...this.table.allRows.map(row => this.callback(row))]\n .sort((a: number, b: number) => a - b)\n .filter(Boolean) as number[]\n if (values.length === 0) return null\n const half = Math.floor(values.length / 2)\n return (values.length % 2\n ? values[half]\n : this.round((values[half - 1] + values[half]) / 2)\n )\n }\n\n public bounds(): number[]\n {\n const values = this.table.allRows.map(row => this.callback(row))\n\n const numbers = values.filter(Boolean) as number[]\n if (numbers.length === 0) return [null, null]\n return [\n Math.min(...numbers),\n Math.max(...numbers)\n ]\n }\n\n private round(value: number)\n {\n return Number(value.toFixed(this.precision))\n }\n}" }, { "path": "src/lib/src/client/builders/FilterBuilder.svelte.ts", "content": "import type { Field, Check } from '$lib/src/client'\nimport type FilterHandler from '../handlers/FilterHandler.svelte'\nimport { check as comparator } from '$lib/src/client/core'\nimport type { FilterInterface } from '$lib/src/shared'\n\nexport default class FilterBuilder implements FilterInterface\n{\n public value = $state('')\n private id = Math.random().toString(36).substring(2, 15)\n private filterHandler : FilterHandler\n private field : Field\n private check : Check\n private isRecursive = true\n\n constructor(filterHandler: FilterHandler, field: Field, check?: Check)\n {\n this.filterHandler = filterHandler\n this.field = field\n this.check = check ?? comparator.isLike\n this.cleanup()\n }\n\n public set(check?: Check)\n {\n this.filterHandler.set(this.value, this.field, check ?? this.check, this.id, this.isRecursive)\n }\n\n public init(value?: unknown)\n {\n this.value = value\n this.set()\n return this\n }\n\n public isNotRecursive()\n {\n this.isRecursive = false\n return this\n }\n\n public clear()\n {\n this.value = ''\n this.filterHandler.unset(this.id)\n }\n\n private cleanup()\n {\n this.filterHandler['table'].on('clearFilters', () => this.clear())\n }\n}\n" }, { "path": "src/lib/src/client/builders/QueryBuilder.svelte.ts", "content": "import type { Check } from '$lib/src/client'\nimport type QueryHandler from '../handlers/QueryHandler.svelte'\n\nexport default class QueryBuilder\n{\n public value = $state('')\n private id = Math.random().toString(36).substring(2, 15)\n private queryHandler : QueryHandler\n private path : string[] = []\n private check : Check\n\n constructor(queryHandler: QueryHandler)\n {\n this.queryHandler = queryHandler\n this.cleanup()\n }\n\n public from(path: string[])\n {\n this.path = path\n return this\n }\n\n public where(filter: (row: any, value?: unknown) => boolean)\n {\n this.check = filter\n return this\n }\n\n \n\n public set(value?: unknown)\n {\n if (value) this.value = value\n this.queryHandler.set(this.path, this.value, this.check, this.id)\n }\n\n public clear()\n {\n this.value = ''\n this.queryHandler.unset(this.id)\n }\n\n private cleanup()\n {\n this.queryHandler['table'].on('clearFilters', () => this.clear())\n }\n}\n" }, { "path": "src/lib/src/client/builders/RecordFilterBuilder.svelte.ts", "content": "import { match, check, isNotNull } from '$lib/src/client/core'\nimport type { Row } from '$lib/src/client'\n\nexport default class RecordFilterBuilder\n{\n public value = $state('')\n public records = $derived(this.createRecords())\n private rawRecords = $state.raw([])\n private filter = $state('')\n\n constructor(records: Row[])\n {\n this.rawRecords = records\n }\n\n public set()\n {\n this.filter = this.value\n }\n\n private createRecords(): readonly Row[]\n {\n if (isNotNull(this.filter)) {\n return this.rawRecords.filter(record => match(record, this.filter, { check: check.isLike }))\n }\n return this.rawRecords\n }\n}" }, { "path": "src/lib/src/client/builders/SearchBuilder.svelte.ts", "content": "import { type Field } from '$lib/src/client'\nimport type SearchHandler from '../handlers/SearchHandler.svelte'\nimport type { SearchInterface } from '$lib/src/shared'\n\nexport default class SearchBuilder implements SearchInterface\n{\n public value = $state('')\n private scope : Field[]\n private searchHandler : SearchHandler\n\n constructor(searchHandler: SearchHandler, scope?: Field[])\n {\n this.searchHandler = searchHandler\n this.scope = scope\n this.cleanup()\n }\n\n public set()\n {\n this.searchHandler.set(this.value, this.scope)\n }\n\n public init(value?: string)\n {\n this.value = value\n this.set()\n return this\n }\n\n public recursive()\n {\n this.searchHandler.recursive(this.value, this.scope)\n }\n\n public regex()\n {\n this.searchHandler.regex(this.value, this.scope)\n }\n\n public clear()\n {\n this.value = ''\n this.searchHandler.clear()\n }\n\n private cleanup()\n {\n this.searchHandler['table'].on('clearSearch', () => this.clear())\n }\n}\n" }, { "path": "src/lib/src/client/builders/SortBuilder.svelte.ts", "content": "import type { Field, SortParams } from '$lib/src/client'\nimport type SortHandler from '../handlers/SortHandler.svelte'\nimport type { SortInterface } from '$lib/src/shared'\n\n\nexport default class SortBuilder implements SortInterface\n{\n public direction = $derived<'asc' | 'desc'>(this.createDirection())\n public isActive = $derived(this.createIsActive())\n private id = Math.random().toString(36).substring(2, 15)\n private sortHandler : SortHandler\n private field : Field\n private params : SortParams\n\n constructor(sortHandler: SortHandler, field: Field, params: SortParams)\n {\n this.sortHandler = sortHandler\n this.field = field\n this.params = params ?? {}\n }\n\n public set()\n {\n this.sortHandler.set(this.field, this.id, this.params)\n }\n\n public init(direction?: 'asc' | 'desc')\n {\n if (!direction) return this\n this[direction]()\n return this\n }\n\n public asc()\n {\n this.sortHandler.asc(this.field, this.id, this.params)\n }\n\n public desc()\n {\n this.sortHandler.desc(this.field, this.id, this.params)\n }\n\n public clear()\n {\n this.sortHandler.clear()\n }\n\n private createIsActive()\n {\n if (this.id === this.sortHandler['table']['sort']?.id) {\n return true\n }\n return false\n }\n\n private createDirection()\n {\n if (this.isActive === false) return null\n return this.sortHandler['table']['sort']?.direction\n }\n}\n" }, { "path": "src/lib/src/client/core/check.ts", "content": "import { isNull, stringify, isNotNull } from './value'\nimport type { Criterion, Check } from '$lib/src/client'\n\n\nexport const check: { [name: string]: Check } = {\n isLike: (entry: unknown, value: unknown) => stringify(entry).includes(stringify(value)),\n isNotLike: (entry: unknown, value: unknown) => stringify(entry).includes(stringify(value)) === false,\n startsWith: (entry: unknown, value: unknown) => stringify(entry).startsWith(stringify(value)),\n endsWith: (entry: unknown, value: unknown) => stringify(entry).endsWith(stringify(value)),\n isEqualTo: (entry: unknown, value: unknown) => stringify(entry) === stringify(value),\n isNotEqualTo: (entry: unknown, value: unknown) => stringify(entry) !== stringify(value),\n isGreaterThan: (entry: number, value: number) => isNull(entry) ? false : (entry > value),\n isGreaterThanOrEqualTo: (entry: number, value: number) => isNull(entry) ? false : (entry >= value),\n isLessThan: (entry: number, value: number) => isNull(entry) ? false : (entry < value),\n isLessThanOrEqualTo: (entry: number, value: number) => isNull(entry) ? false : (entry <= value),\n isBetween: (entry: number, [min, max]: number[]) => isNull(entry) ? false : (entry >= min && entry <= max),\n isStrictlyBetween: (entry: number, [min, max]: number[]) => isNull(entry) ? false : (entry > min && entry < max),\n isTrue: (entry: unknown, _: unknown) => entry === true,\n isFalse: (entry: unknown, _: unknown) => entry === false,\n isNull: (entry: unknown, _: unknown) => isNull(entry),\n isNotNull: (entry: unknown, _: unknown) => isNotNull(entry),\n\n // multiple criteria\n whereIn: (entry: unknown, criteria: Criterion[] = []) => {\n if (criteria.length === 0) return false\n for(const { value, check } of criteria) {\n if (value?.['key']) {\n return checkByKey(entry, value as any, check)\n }\n else if (check(entry, value)) {\n return true\n }\n }\n return false\n },\n\n\n // regexp\n match: (entry: unknown, pattern: string) => {\n const match = pattern.match(/^([\\/~@;%#'])(.*?)\\1([gimsuy]*)$/)\n const regex = match ? new RegExp(match[2], match[3]\n .split('')\n .filter((char, pos, flagArr) => flagArr.indexOf(char) === pos)\n .join('')\n ) \n : new RegExp(pattern)\n return stringify(entry).match(regex) ? true : false\n },\n}\n\nconst checkByKey = (entry: unknown, param: { key: string, value: unknown }, check: Check) => {\n if (!param?.key) return false\n const { key, value } = param\n if (Array.isArray(entry) === false && typeof entry === 'object') {\n const keys = Object.keys(entry)\n if (keys.includes(key) && check(entry[key], value)) {\n\t\t\treturn true\n\t\t}\n }\n return false\n}" }, { "path": "src/lib/src/client/core/entry.ts", "content": "import { isNull, isObject, isObjectArray } from './value'\nimport { check } from './check'\nimport type { Criterion, Check } from '$lib/src/client'\n\ntype Params = {\n isRecursive?: boolean,\n check?: Check,\n highlight?: boolean,\n}\n\n\nexport const match = (entry: unknown, value: unknown | Criterion[], params: Params): boolean => {\n params.check = params.check ?? check.isLike\n if (isNull(value)) {\n return true\n }\n else if (isObjectArray(entry)) {\n // if (isObject(entry) && entry.is_map === true) return true\n return Object.keys(entry).some(k => match(entry[k], value, params))\n }\n return params.check(entry, value)\n}\n\nexport const sift = (entry: unknown, value: unknown, params: Params) => {\n if (Array.isArray(entry)) {\n entry = entry.filter((item: unknown) => {\n // to disable deletion while filtering, check is worth true anyway\n const check = params.isRecursive === true ? match(item, value, params) : true\n if (typeof item === 'object' && check === true) {\n for (const k of Object.keys(item)) {\n item[k] = sift(item[k], value, params)\n }\n }\n return check\n })\n }\n if (params.highlight && (typeof entry === 'string' || typeof entry === 'number') && typeof value === 'string' && match(entry, value, params)) {\n return emphasize(entry, value)\n }\n return entry\n}\n\nconst emphasize = (entry: string | number, value: string) => {\n const search = value\n .replace(/a/g, '[aàâáä]')\n .replace(/e/g, '[eèêéë]')\n .replace(/i/g, '[iìîíï]')\n .replace(/o/g, '[oòôо́ö]')\n .replace(/u/g, '[uùûúü]')\n .replace(/y/g, '[yỳŷýÿ]')\n const exp = new RegExp(`${search}`, 'gi')\n return String(entry).replace(exp, `$&`)\n}\n\nexport const deepEmphasize = (entry: Row, value: string, callback: (entry: Row) => unknown) => {\n const path = callback.toString()\n .split('=>')[1]\n .replace(/\\(\\)/g, '')\n .replace(/\\?/g, '')\n .split('.').splice(1).join('.')\n .trim()\n if (path.indexOf(' ') > -1) return entry\n return deepSet(entry, path, value)\n}\n\nconst deepSet = (entry: Row, path: string, value: string) => {\n const initial = entry\n const keys = path.replace(/\\[/g, '.[').split(\".\")\n try {\n for (let i = 0; i < keys.length; i++) {\n let current = keys[i]\n let next = keys[i + 1]\n if (current.includes('[')) {\n current = String(parseInt(current.substring(1, current.length - 1)))\n }\n if (next && next.includes('[')) {\n next = String(parseInt(next.substring(1, next.length - 1)))\n }\n if (next !== undefined) {\n entry[current] = entry[current] ? entry[current] : (isNaN(Number(next)) ? {} : [])\n } else {\n entry[current] = emphasize(entry[current] as string | number, value)\n }\n entry = entry[current] as Row\n }\n return initial\n } catch(_) {\n return initial\n }\n}" }, { "path": "src/lib/src/client/core/field.ts", "content": "import type { Field } from '$lib/src/client'\n\nexport const parse = (field: Field, id?: string) => {\n if (typeof field === 'string') {\n return {\n callback: (row: $state.Snapshot) => row[(field as keyof $state.Snapshot)],\n id: id,\n key: field,\n }\n } else if (typeof field === 'function') {\n return {\n callback: field as (row: $state.Snapshot) => unknown,\n id: id,\n key: undefined,\n }\n }\n throw new Error(`Invalid field argument: ${String(field)}`)\n}" }, { "path": "src/lib/src/client/core/index.ts", "content": "import type { Field, Check } from '$lib/src/client'\n\n\nexport { isNull, isNotNull, stringify } from './value'\nexport { match, sift, deepEmphasize } from './entry'\nexport { check } from './check'\nexport { data, sort } from './rows'\nexport { parse } from './field'\n\nexport type Search = {\n value: string\n scope?: Field[]\n isRecursive?: boolean\n check?: Check\n}\n\nexport type Filter = {\n callback: (row: $state.Snapshot) => unknown\n id: string\n value?: unknown\n isRecursive?: boolean\n check?: Check\n key?: string\n}\n\nexport type Query = {\n path: string[]\n id: string\n value?: unknown\n check?: Check\n}\n\nexport type Sort = {\n callback?: (row: $state.Snapshot) => unknown\n id?: string\n direction?: 'asc' | 'desc'\n key?: string,\n}\n\n\n" }, { "path": "src/lib/src/client/core/rows.ts", "content": "import type { Field } from '$lib/src/client'\nimport { type Search, type Filter, type Query } from '$lib/src/client/core'\n\nimport { match, sift, deepEmphasize } from './entry'\nimport { isNull } from './value'\nimport { parse } from './field'\n\n\nexport const data = {\n search: (allRows: $state.Snapshot, { scope, isRecursive, value, check }: Search, highlight: boolean = false) => {\n return allRows.filter(row => {\n const keys = scope ?? Object.keys(row) as Field[]\n const fields = keys.map(field => parse(field))\n for(const { key, callback } of fields) {\n if (key) {\n row[key] = sift(row[key], value, {\n highlight: highlight,\n isRecursive: isRecursive === true\n })\n }\n else if (highlight) {\n row = deepEmphasize(row, value, callback)\n }\n }\n return fields.some(({ callback }) => {\n return match(callback(row), value, { check })\n })\n })\n },\n filter: (allRows: $state.Snapshot, { callback, isRecursive, value, check, key }: Filter, highlight: boolean = false) => {\n return allRows.filter((row) => {\n const checked = match(callback(row), value, { check })\n if (key) {\n row[key] = sift(row[key], value, {\n highlight: highlight, \n check: check,\n isRecursive: isRecursive === false ? false : true\n })\n }\n else if (highlight && checked && value && typeof value === 'string') {\n row = deepEmphasize(row, value, callback)\n }\n return checked\n })\n },\n query: (allRows: $state.Snapshot, { path, value, check }: Query) => {\n return allRows.filter(row => {\n if (path.length === 0) {\n return check(row, value)\n }\n let obj = row\n let i = 1\n let verify = false\n function recursive(i) {\n\n }\n // ['groups', 'users']\n // row[groups].map(group => group.users.map(user) => {\n\n // })\n\n // row.groups.filter(group => group.users.filter(user => ))\n for (const prop of path) {\n if (i === 1 && i < path.length) {\n obj = obj[prop]\n for (const subobj of obj[prop]) {\n\n }\n }\n if (i === path.length) {\n console.log(prop, obj)\n obj[prop] = data.query(obj[prop], { path: [], value, check } as Query)\n if (obj[prop].length > 0) {\n verify = true\n }\n }\n obj = obj[prop]\n i++\n }\n return verify\n })\n // return allRows.map(row => {\n // let obj = row\n // const [root, ...props] = path\n // let i = 1\n // for (const prop of path) {\n // if (obj[prop]) {\n // if (obj[root]) {\n // obj[root] = data.query(obj[root], { path, value, check } as Query) \n // }\n // if (i < props.length) {\n // obj[prop] = data.query(obj[prop], { path, value, check } as Query)\n // }\n // else {\n // obj[prop] = obj[prop].filter((item: any) => check(item))\n // }\n // }\n // i++\n // }\n // return row\n // }).filter(Boolean)\n }\n}\n\nexport const sort = {\n asc: (a: unknown, b: unknown, locales?: Intl.LocalesArgument, options?: Intl.CollatorOptions) => {\n if (a === b) return 0\n else if (isNull(a)) return 1\n else if (isNull(b)) return -1\n else if (typeof a === 'boolean') return a === false ? 1 : -1\n else if (typeof a === 'string') return a.localeCompare(b as string, locales, options)\n else if (typeof a === 'number') return a - (b as number)\n else if (typeof a === 'object') return JSON.stringify(a).localeCompare(JSON.stringify(b), locales, options)\n return String(a).localeCompare(String(b), locales, options)\n },\n desc: (a: unknown, b: unknown, locales?: Intl.LocalesArgument, options?: Intl.CollatorOptions) => {\n if (a === b) return 0\n else if (isNull(a)) return 1\n else if (isNull(b)) return -1\n else if (typeof b === 'boolean') return b === false ? 1 : -1\n else if (typeof b === 'string') return b.localeCompare(a as string, locales, options)\n else if (typeof b === 'number') return b - (a as number)\n else if (typeof b === 'object') return JSON.stringify(b).localeCompare(JSON.stringify(a), locales, options)\n else return String(b).localeCompare(String(a), locales, options)\n }\n}" }, { "path": "src/lib/src/client/core/value.ts", "content": "\n\nexport const isNull = (value: unknown) => {\n if (value === null || value === undefined || value === '') return true\n return false\n}\nexport const isNotNull = (value: unknown) => { return !isNull(value) }\n\nexport const stringify = (value: unknown = null) => {\n return String(value)\n .toLowerCase()\n .normalize('NFD')\n .replace(/[\\u0300-\\u036f]/g, '')\n}\n\nexport const isObject = (value: unknown) => {\n if (typeof value !== 'object') return false\n else if (value === null) return false\n else if (Array.isArray(value)) return false\n return true\n}\n\nexport const isObjectArray = (value: unknown) => {\n if (typeof value !== 'object') return false\n else if (value === null) return false\n // test\n else if (Array.isArray(value)) {\n if (isNotNull(value[0]) && typeof value[0] !== 'object') return false\n }\n return true\n}" }, { "path": "src/lib/src/client/handlers/FilterHandler.svelte.ts", "content": "import type { Field, Check, TableHandler } from '$lib/src/client'\nimport { isNotNull, parse } from '$lib/src/client/core'\n\n\nexport default class FilterHandler\n{\n private table: TableHandler\n\n constructor(table: TableHandler)\n {\n this.table = table\n }\n\n public set(value: unknown, field: Field, check: Check = null, id: string, isRecursive = true)\n {\n this.table.setPage(1)\n\n const { callback, key } = parse(field, id)\n const filter = { value, id, callback, check, key, isRecursive }\n\n this.table.filters = this.table.filters.filter(filter => filter.id !== id)\n if (isNotNull(value)) {\n this.table.filters.push(filter)\n }\n }\n\n public unset(id: string)\n {\n this.table.setPage(1)\n this.table.filters = this.table.filters.filter(filter => filter.id !== id)\n }\n}\n" }, { "path": "src/lib/src/client/handlers/PageHandler.svelte.ts", "content": "import type { TableHandler } from '$lib/src/client'\n\nexport default class PageHandler\n{\n private table: TableHandler\n\n constructor(table: TableHandler)\n {\n this.table = table\n }\n\n public goto(page: number)\n {\n if (this.table.rowsPerPage) {\n if (page >= 1 && page <= this.table.pageCount) {\n this.table.currentPage = page\n this.table['event'].dispatch('change')\n }\n }\n }\n\n public previous()\n {\n this.goto(this.table.currentPage - 1)\n }\n\n public next()\n {\n this.goto(this.table.currentPage + 1)\n }\n\n public last()\n {\n this.goto(this.table.pageCount)\n }\n}\n" }, { "path": "src/lib/src/client/handlers/QueryHandler.svelte.ts", "content": "import type { Field, Check, TableHandler } from '$lib/src/client'\nimport { isNotNull } from '$lib/src/client/core'\n\n\nexport default class QueryHandler\n{\n private table: TableHandler\n\n constructor(table: TableHandler)\n {\n this.table = table\n }\n\n public set(path: string[], value: unknown, check: Check, id: string)\n {\n this.table.setPage(1)\n this.table.queries = this.table.queries.filter(query => query.id !== id)\n this.table.queries.push({ path, value, check, id })\n }\n\n public unset(id: string)\n {\n this.table.setPage(1)\n this.table.queries = this.table.queries.filter(query => query.id !== id)\n }\n}\n" }, { "path": "src/lib/src/client/handlers/SearchHandler.svelte.ts", "content": "import { type TableHandler, type Field, type Criterion, check } from '$lib/src/client'\n\nexport default class SearchHandler\n{\n private table: TableHandler\n\n constructor(table: TableHandler)\n {\n this.table = table\n }\n\n public set(value: string, scope?: Field[])\n {\n this.table.setPage(1)\n this.table['search'] = { value: value, scope: scope }\n }\n\n public recursive(value: string, scope?: Field[])\n {\n this.table.setPage(1)\n this.table['search'] = { value: value, scope: scope, isRecursive: true }\n }\n\n public regex(pattern: string, scope?: Field[])\n {\n this.table.setPage(1)\n this.table['search'] = { value: pattern, scope: scope, check: check.match }\n }\n\n public clear()\n {\n this.table.setPage(1)\n this.table['search'] = { value: '' }\n }\n}\n" }, { "path": "src/lib/src/client/handlers/SelectHandler.svelte.ts", "content": "import type { TableHandler } from '$lib/src/client'\nimport { parse } from '$lib/src/client/core'\n\nexport default class SelectHandler\n{\n private table: TableHandler\n\n constructor(table: TableHandler)\n {\n this.table = table\n }\n\n public set(value: unknown)\n {\n if (this.table.selected.includes(value)) {\n this.table.selected = this.table.selected.filter((item) => item !== value)\n } else {\n this.table.selected = [value, ...this.table.selected]\n }\n }\n\n public all(scope: 'all' | 'currentPage')\n {\n const rows = (scope === 'currentPage') ? this.table.rows : this.table.allRows\n const { callback } = parse(this.table['selectBy'])\n const selection = rows.map(callback)\n if (scope === 'currentPage') {\n if (this.table.isAllSelected) {\n this.table.selected = this.table.selected.filter(item => selection.includes(item) === false)\n }\n else {\n this.table.selected = [...new Set([...selection, ...this.table.selected])]\n }\n }\n else {\n this.table.isAllSelected ? this.clear() : this.table.selected = selection\n }\n }\n\n public clear()\n {\n this.table.selected = []\n }\n\n public getRows()\n {\n const { callback } = parse(this.table['selectBy'])\n return this.table['rawRows'].filter(row => {\n return this.table.selected.includes(callback(row as $state.Snapshot))\n })\n }\n}" }, { "path": "src/lib/src/client/handlers/SortHandler.svelte.ts", "content": "import type { Field, TableHandler, SortParams } from '$lib/src/client'\nimport { type Sort, parse, sort } from '$lib/src/client/core'\n\nexport default class SortHandler \n{\n private backup : Sort[]\n private table : TableHandler\n\n constructor(table: TableHandler) \n {\n this.table = table\n this.backup = []\n }\n\n public set(field: Field, id: string, params: SortParams = {})\n {\n if (this.table['sort'].id !== id) {\n this.table['sort'].direction = null\n }\n if (this.table['sort'].direction === null || this.table['sort'].direction === 'desc') {\n this.asc(field, id, params)\n }\n else if (this.table['sort'].direction === 'asc') {\n this.desc(field, id, params)\n }\n }\n\n public asc(field: Field, id: string, { locales, options }: SortParams = {})\n {\n if (!field) return\n const { callback, key } = parse(field, id)\n this.table['sort'] = { id, callback, direction: 'asc', key }\n this.table['rawRows'] = [...this.table['rawRows']].sort((x, y) => {\n const [a, b] = [callback(x as $state.Snapshot), callback(y as $state.Snapshot)]\n return sort.asc(a, b, locales, options)\n })\n this.save({ id, callback, direction: 'asc' })\n this.table.setPage(1)\n }\n\n public desc(field: Field, id: string, { locales, options }: SortParams = {})\n {\n if (!field) return\n const { callback, key } = parse(field, id)\n this.table['sort'] = { id, callback, direction: 'desc', key }\n this.table['rawRows'] = [...this.table['rawRows']].sort((x, y) => {\n const [a, b] = [callback(x as $state.Snapshot), callback(y as $state.Snapshot)]\n return sort.desc(a, b, locales, options)\n })\n this.save({ id, callback, direction: 'desc' })\n this.table.setPage(1)\n }\n\n public clear()\n {\n this.backup = []\n this.table['sort'] = {}\n }\n\n public restore()\n {\n for (const { key, callback, direction, id } of this.backup) {\n const field = (key ?? callback) as Field\n this[direction](field, id)\n }\n }\n\n private save(sort: Sort)\n {\n this.backup = this.backup.filter(item => item.id !== sort.id )\n if (this.backup.length >= 3) {\n const [_, slot2, slot3] = this.backup\n this.backup = [slot2, slot3, sort]\n }\n else {\n this.backup = [...this.backup, sort]\n }\n }\n}\n" }, { "path": "src/lib/src/client/index.ts", "content": "export { default as TableHandler } from './TableHandler.svelte'\nexport { check } from './core'\n\nimport type { Internationalization, Field } from '$lib/src/shared'\nexport type { default as AdvancedFilterBuilder } from './builders/AdvancedFilterBuilder.svelte'\nexport type { default as CalculationBuilder } from './builders/CalculationBuilder.svelte'\nexport type { default as CSVBuilder } from './builders/CSVBuilder.svelte'\nexport type { default as FilterBuilder } from './builders/FilterBuilder.svelte'\nexport type { default as RecordFilterBuilder } from './builders/RecordFilterBuilder.svelte'\nexport type { default as SearchBuilder } from './builders/SearchBuilder.svelte'\nexport type { default as SortBuilder } from './builders/SortBuilder.svelte'\nexport { default as RecordFilter } from './builders/RecordFilterBuilder.svelte'\n\nexport {\n Datatable,\n Search,\n RowsPerPage,\n Th,\n ThSort,\n ThFilter,\n Pagination,\n RowCount,\n type Row,\n type Field,\n type Internationalization,\n type ColumnView,\n type TableHandlerInterface,\n} from '$lib/src/shared'\n\nexport type SortParams = {\n locales?: Intl.LocalesArgument,\n options?: Intl.CollatorOptions\n}\n\nexport type Check = (entry: unknown, value: unknown) => boolean\n\nexport type TableParams = {\n rowsPerPage?: number,\n selectBy?: Field,\n highlight?: boolean,\n i18n?: Internationalization,\n}\n\nexport type Criterion = {\n value: unknown,\n check: Check\n}" }, { "path": "src/lib/src/server/AbstractTableHandler.svelte.ts", "content": "import type { State, Sort, Filter, TableParams } from '$lib/src/server'\nimport { EventDispatcher } from '$lib/src/shared'\n\nexport default class AbstractTableHandler\n{\n protected selectBy ?: keyof Row\n protected event = new EventDispatcher()\n protected search = $state('')\n protected sort = $state<(Sort)>({})\n \n public debounce : number\n public totalRows = $state(undefined)\n public isLoading = $state(false)\n public rowsPerPage = $state(10)\n public currentPage = $state(1)\n public filters = $state<(Filter)[]>([])\n public filterCount = $derived(this.filters.length)\n public rows = $state([])\n public rowCount = $derived<{total: number, start: number, end: number, selected: number}>(this.createRowCount())\n public pages = $derived(this.createPages())\n public pageCount = $derived(this.createPageCount())\n public pagesWithEllipsis = $derived(this.createPagesWithEllipsis())\n public selected = $state<(Row[keyof Row])[]>([])\n public isAllSelected = $derived(this.createIsAllSelected())\n public element = $state(undefined)\n public clientWidth = $state(1000)\n\n constructor(data: Row[], params: TableParams)\n {\n this.rows = data\n this.selectBy = params.selectBy as keyof Row ?? undefined\n this.totalRows = params.totalRows\n this.rowsPerPage = params.rowsPerPage ?? 10\n this.debounce = params.debounce ?? 0\n }\n\n public getState(): State\n {\n return {\n currentPage: this.currentPage,\n rowsPerPage: this.rowsPerPage,\n offset: this.rowsPerPage * (this.currentPage - 1),\n search: this.search,\n sort: this.sort.field ? this.sort : undefined,\n filters: this.filters.length > 0 ? this.filters : undefined,\n setTotalRows: (value: number) => this.totalRows = value\n }\n }\n\n private createPages()\n {\n if (!this.rowsPerPage || !this.totalRows) {\n return undefined\n }\n const pages = Array.from(Array(Math.ceil(this.totalRows / this.rowsPerPage)))\n return pages.map((_, i) => i + 1)\n }\n\n private createPageCount()\n {\n if (!this.pages) return undefined\n return this.pages.length\n }\n\n private createPagesWithEllipsis()\n {\n if (!this.pages) {\n return undefined\n }\n if (this.pageCount <= 7) {\n return this.pages\n }\n const ellipse = null\n const firstPage = 1\n const lastPage = this.pageCount\n if (this.currentPage <= 4) {\n return [\n ...this.pages.slice(0, 5),\n ellipse,\n lastPage\n ]\n } else if (this.currentPage < this.pageCount - 3) {\n return [\n firstPage,\n ellipse,\n ...this.pages.slice(this.currentPage - 2, this.currentPage + 1),\n ellipse,\n lastPage\n ]\n } else {\n return [\n firstPage,\n ellipse,\n ...this.pages.slice(this.pageCount - 5, this.pageCount)\n ]\n }\n }\n\n private createRowCount()\n {\n if (!this.rowsPerPage || !this.totalRows) {\n return {\n total: undefined,\n start: undefined,\n end: undefined,\n selected: this.selected.length\n }\n }\n return {\n total: this.totalRows,\n start: this.currentPage * this.rowsPerPage - this.rowsPerPage + 1,\n end: Math.min(this.currentPage * this.rowsPerPage, this.totalRows),\n selected: this.selected.length\n }\n }\n\n private createIsAllSelected()\n {\n if (this.rows.length === 0) {\n return false\n }\n const ids = this.rows.map(row => row[this.selectBy])\n return ids.every(id => this.selected.includes(id))\n }\n}" }, { "path": "src/lib/src/server/TableHandler.svelte.ts", "content": "import AbstractTableHandler from './AbstractTableHandler.svelte'\n\nimport FetchHandler from './handlers/FetchHandler.svelte'\nimport SortHandler from './handlers/SortHandler.svelte'\nimport SelectHandler from './handlers/SelectHandler.svelte'\nimport PageHandler from './handlers/PageHandler.svelte'\nimport SearchHandler from './handlers/SearchHandler.svelte'\nimport FilterHandler from './handlers/FilterHandler.svelte'\n\nimport ViewBuilder from '../shared/builders/ViewBuilder.svelte'\nimport SearchBuilder from './builders/SearchBuilder.svelte'\nimport SortBuilder from './builders/SortBuilder.svelte'\nimport FilterBuilder from './builders/FilterBuilder.svelte'\n\nimport type { Internationalization, Row, Field, State, ColumnView, TableParams } from '$lib/src/server'\nimport type { TableHandlerInterface } from '$lib/src/shared'\n\n\n\nexport default class TableHandler extends AbstractTableHandler implements TableHandlerInterface\n{\n private fetchHandler : FetchHandler\n private sortHandler : SortHandler\n private selectHandler : SelectHandler\n private pageHandler : PageHandler\n private searchHandler : SearchHandler\n private filterHandler : FilterHandler\n private view : ViewBuilder\n public i18n : Internationalization\n\n constructor(data: T[] = [], params: TableParams = { rowsPerPage: 5 })\n {\n super(data, params)\n this.i18n = this.translate(params.i18n)\n this.fetchHandler = new FetchHandler(this)\n this.sortHandler = new SortHandler(this)\n this.selectHandler = new SelectHandler(this)\n this.pageHandler = new PageHandler(this)\n this.searchHandler = new SearchHandler(this)\n this.filterHandler = new FilterHandler(this)\n }\n\n public load(callback: (state: State) => Promise): void\n {\n this.fetchHandler.set(callback)\n }\n\n public invalidate(): void\n {\n this.fetchHandler.invalidate()\n }\n\n public setRowsPerPage(value: number)\n {\n this.rowsPerPage = value\n this.setPage(1)\n }\n\n public setPage(value: number | 'previous' | 'next' | 'last'): void\n {\n switch (value) {\n case 'previous' : return this.pageHandler.previous()\n case 'next' : return this.pageHandler.next()\n case 'last' : return this.pageHandler.goto(this.pageCount)\n default : return this.pageHandler.goto(value as number)\n }\n }\n\n public clearSearch(): void\n {\n this.searchHandler.clear()\n }\n\n public createSearch(): SearchBuilder\n {\n return new SearchBuilder(this)\n }\n\n public createSort(field: Field): SortBuilder\n {\n if (typeof field === 'function') {\n throw new Error(`Invalid field argument: ${String(field)}. Function type arguments are not allowed in server-side mode`)\n }\n return new SortBuilder(this.sortHandler, field)\n }\n\n public clearFilters(): void\n {\n this.filterHandler.clear()\n this.invalidate()\n }\n\n public createFilter(field: Field): FilterBuilder\n {\n if (typeof field === 'function') {\n throw new Error(`Invalid field argument: ${String(field)}. Function type arguments are not allowed in server-side mode`)\n }\n return new FilterBuilder(this.filterHandler, field)\n }\n\n public select(value: T[keyof T])\n {\n this.selectHandler.set(value)\n }\n\n public selectAll(): void\n {\n this.selectHandler.all()\n }\n\n public clearSelection(): void\n {\n this.selectHandler.clear()\n }\n\n public on(event: 'change' | 'clearFilters' | 'clearSearch', callback: () => void): void\n {\n this.event.add(event, callback)\n }\n\n public createView(columns: ColumnView[]): ViewBuilder\n {\n this.view = new ViewBuilder(this, columns)\n return this.view\n }\n\n public getView(): ViewBuilder\n {\n return this.view\n }\n\n private translate(i18n: Internationalization): Internationalization\n {\n return {\n ...{\n search: 'Search...',\n show: 'Show',\n entries: 'entries',\n filter: 'Filter',\n rowCount: 'Showing {start} to {end} of {total} entries',\n noRows: 'No entries found',\n previous: 'Previous',\n next: 'Next',\n selectedCount: '{count} of {total} row(s).'\n },\n ...i18n\n }\n }\n\n}" }, { "path": "src/lib/src/server/builders/FilterBuilder.svelte.ts", "content": "import type FilterHandler from '../handlers/FilterHandler.svelte'\n\nexport default class FilterBuilder\n{\n public value = $state('')\n private timeout = undefined\n private filterHandler : FilterHandler\n private field : keyof Row\n\n constructor(filterHandler: FilterHandler, field: keyof Row)\n {\n this.filterHandler = filterHandler\n this.field = field\n this.cleanup()\n }\n\n public set()\n {\n this.filterHandler.set(this.value, this.field)\n\t\tclearTimeout(this.timeout)\n\t\tthis.timeout = setTimeout( () => {\n this.filterHandler['table'].setPage(1)\n\t\t}, 400)\n }\n\n public init(value?: string)\n {\n if (!value) return this\n this.value = value\n this.filterHandler.set(this.value, this.field)\n return this\n }\n\n public clear()\n {\n this.value = ''\n this.filterHandler.unset(this.field)\n }\n\n private cleanup()\n {\n this.filterHandler['table'].on('clearFilters', () => this.clear())\n }\n}\n" }, { "path": "src/lib/src/server/builders/SearchBuilder.svelte.ts", "content": "import type TableHandler from '../TableHandler.svelte'\nimport type { SearchInterface } from '$lib/src/shared'\n\nexport default class SearchBuilder implements SearchInterface\n{\n public value = $state('')\n private timeout = undefined\n private table : TableHandler\n\n constructor(table: TableHandler)\n {\n this.table = table\n this.cleanup()\n }\n\n public set()\n {\n this.table['search'] = this.value\n clearTimeout(this.timeout)\n this.timeout = setTimeout( () => {\n this.table.setPage(1)\n }, 400)\n }\n\n public init(value?: string)\n {\n if (!value) return this\n this.value = value\n this.table['search'] = value\n return this\n }\n\n public clear()\n {\n this.value = ''\n this.table['search'] = ''\n // this.table.invalidate()\n this.table.setPage(1)\n }\n\n private cleanup()\n {\n this.table.on('clearSearch', () => this.clear())\n }\n}\n" }, { "path": "src/lib/src/server/builders/SortBuilder.svelte.ts", "content": "import type SortHandler from '../handlers/SortHandler.svelte'\nimport type { SortInterface } from '$lib/src/shared'\n\nexport default class SortBuilder implements SortInterface\n{\n private sortHandler : SortHandler\n private field : keyof Row\n public isActive = $derived(this.createIsActive())\n public direction = $derived<'asc' | 'desc'>(this.createDirection())\n\n constructor(sortHandler: SortHandler, field: keyof Row)\n {\n this.sortHandler = sortHandler\n this.field = field\n }\n\n public set()\n {\n this.sortHandler.set(this.field)\n }\n\n public init(direction?: 'asc' | 'desc')\n {\n if (!direction) return this\n this[direction]()\n return this\n }\n\n public asc()\n {\n this.sortHandler.asc(this.field)\n }\n\n public desc()\n {\n this.sortHandler.desc(this.field)\n }\n\n private createIsActive()\n {\n if (this.field === this.sortHandler['table']['sort']?.field) {\n return true\n }\n return false\n }\n\n private createDirection()\n {\n if (this.isActive === false) return null\n return this.sortHandler['table']['sort']?.direction\n }\n}\n" }, { "path": "src/lib/src/server/handlers/FetchHandler.svelte.ts", "content": "import type { State, TableHandler } from '$lib/src/server'\n\n\nexport default class FetchHandler\n{\n private table: TableHandler\n private reload: (state: State) => Promise\n private timeout: NodeJS.Timeout\n\n constructor(table: TableHandler)\n {\n this.table = table\n }\n\n public set(callback: (state: State) => Promise)\n {\n this.reload = callback\n }\n\n public async invalidate()\n {\n if (!this.reload) return\n clearTimeout(this.timeout)\n this.timeout = setTimeout(() => this.trigger(), this.table.debounce)\n }\n\n private async trigger()\n {\n this.table.isLoading = true\n const state = this.table.getState()\n const data = await this.reload(state)\n this.table.isLoading = false\n if (data) {\n this.table.rows = data\n }\n }\n}\n\n" }, { "path": "src/lib/src/server/handlers/FilterHandler.svelte.ts", "content": "import type { TableHandler } from '$lib/src/server'\n\nexport default class FilterHandler\n{\n private table: TableHandler\n\n constructor(table: TableHandler) \n {\n this.table = table\n }\n\n public set(value: string | number, field: keyof Row)\n {\n this.table.filters = this.table.filters.filter(filter => filter.field !== field && filter.value)\n if (value) {\n this.table.filters.push({ value, field })\n }\n }\n\n public unset(field: keyof Row)\n {\n this.table.filters = this.table.filters.filter(filter => filter.field !== field)\n }\n\n public clear()\n {\n this.table.filters = []\n this.table['event'].dispatch('clearFilters')\n }\n}\n" }, { "path": "src/lib/src/server/handlers/PageHandler.svelte.ts", "content": "import type { TableHandler } from '$lib/src/server'\n\nexport default class PageHandler\n{\n private table: TableHandler\n\n constructor(table: TableHandler)\n {\n this.table = table\n }\n\n public goto(number: number)\n {\n if (this.table.rowsPerPage && this.table.totalRows) {\n if (number >= 1 && number <= this.table.pageCount) {\n this.table.currentPage = number\n this.table['event'].dispatch('change')\n this.table.invalidate()\n }\n }\n else {\n if (number >= 1) {\n this.table.currentPage = number\n this.table['event'].dispatch('change')\n this.table.invalidate()\n }\n }\n }\n\n public previous()\n {\n this.goto(this.table.currentPage - 1)\n }\n\n public next()\n {\n this.goto(this.table.currentPage + 1)\n }\n}\n" }, { "path": "src/lib/src/server/handlers/SearchHandler.svelte.ts", "content": "import type { TableHandler } from '$lib/src/server'\n\nexport default class SearchHandler \n{\n private table: TableHandler\n\n constructor(table: TableHandler) {\n this.table = table\n }\n\n public clear()\n {\n this.table['event'].dispatch('clearSearch')\n }\n}\n" }, { "path": "src/lib/src/server/handlers/SelectHandler.svelte.ts", "content": "import type { TableHandler } from '$lib/src/server'\n\nexport default class SelectHandler\n{\n private table: TableHandler\n\n constructor(table: TableHandler)\n {\n this.table = table\n }\n\n public set(value: Row[keyof Row])\n {\n if (this.table.selected.includes(value)) {\n this.table.selected = this.table.selected.filter((item) => item !== value)\n }\n else {\n this.table.selected = [value, ...this.table.selected]\n }\n }\n\n public all()\n {\n const selection = this.table.rows.map((row) => row[this.table['selectBy']])\n if (this.table.isAllSelected) {\n this.table.selected = this.table.selected.filter(item => selection.includes(item) === false)\n }\n else {\n this.table.selected = [...new Set([...selection, ...this.table.selected])]\n }\n }\n\n public clear()\n {\n this.table.selected = []\n }\n}" }, { "path": "src/lib/src/server/handlers/SortHandler.svelte.ts", "content": "import type { TableHandler } from '$lib/src/server'\n\nexport default class SortHandler\n{\n private table: TableHandler\n\n constructor(table: TableHandler)\n {\n this.table = table\n }\n\n public set(field: keyof Row)\n {\n const sort = this.table['sort']\n\n if(!sort || sort.field !== field) {\n this.asc(field)\n }\n else if (sort.direction === 'asc') {\n this.desc(field)\n }\n else if (sort.direction === 'desc') {\n this.asc(field)\n }\n }\n\n public asc(field: keyof Row)\n {\n this.table['sort'] = { field, direction: 'asc' }\n this.table.setPage(1)\n }\n\n public desc(field: keyof Row)\n {\n this.table['sort'] = { field, direction: 'desc' }\n this.table.setPage(1)\n }\n}\n" }, { "path": "src/lib/src/server/index.ts", "content": "export { default as TableHandler } from './TableHandler.svelte'\nimport type { Row, Internationalization } from '$lib/src/shared/index.js'\nexport {\n Datatable,\n Search,\n RowsPerPage,\n Th,\n ThSort,\n ThFilter,\n Pagination,\n RowCount,\n type Row,\n type Field,\n type ColumnView,\n type Internationalization,\n type TableHandlerInterface\n} from '$lib/src/shared'\n\nexport type State = {\n currentPage : number,\n rowsPerPage : number,\n offset : number,\n search ?: string,\n sort ?: Sort\n filters ?: Filter[]\n setTotalRows: (value: number) => void\n}\n\nexport type TableParams = {\n rowsPerPage ?: number,\n totalRows ?: number,\n selectBy ?: keyof Row,\n debounce ?: number\n i18n ?: Internationalization\n}\n\nexport type Filter = {\n field: keyof Row\n value?: unknown\n}\n\nexport type Sort = {\n field?: keyof Row\n direction?: 'asc' | 'desc'\n}" }, { "path": "src/lib/src/shared/Datatable.svelte", "content": "\n\n
\n\n
\n {#if header}\n {@render header()}\n {:else if basic === true}\n \n \n {/if}\n
\n\n
\n {@render children()}\n
\n\n
\n {#if footer}\n {@render footer()}\n {:else if basic === true}\n \n \n {/if}\n
\n\n
\n\n\n" }, { "path": "src/lib/src/shared/EventDispatcher.ts", "content": "\nexport default class EventDispatcher\n{\n private listeners = {\n change : [] as (() => void)[],\n clearFilters: [] as (() => void)[],\n clearSearch : [] as (() => void)[]\n }\n private queue: Set = new Set()\n\n public add(event: keyof EventDispatcher['listeners'], callback: () => void)\n {\n this.listeners[event].push(callback)\n }\n\n public async dispatch(event: keyof EventDispatcher['listeners'])\n {\n this.queue.add(event)\n await new Promise((resolve) => setTimeout(resolve, 40))\n if (this.queue.size > 0) {\n this.run()\n }\n this.queue.clear()\n }\n\n private run()\n {\n for (const event of this.queue) {\n for (const callback of this.listeners[event]) {\n callback()\n }\n }\n // console.log(this.queue)\n }\n}" }, { "path": "src/lib/src/shared/Pagination.svelte", "content": "\n\n
\n {#if table.pages === undefined}\n {@render nopage()}\n {:else if table.clientWidth < 600}\n {@render small()}\n {:else}\n {@render ellipsis()}\n {/if}\n
\n\n\n\n{#snippet nopage()}\n \n \n \n{/snippet}\n\n\n\n{#snippet small()}\n \n \n \n \n{/snippet}\n\n\n\n{#snippet ellipsis()}\n \n {#each table.pagesWithEllipsis as page}\n \n {/each}\n \n{/snippet}\n\n\n\n" }, { "path": "src/lib/src/shared/RowCount.svelte", "content": "\n\n\n\n\n\n{#snippet selectedRows()}\n {selected}\n {#if total}\n of {total}\n {/if}\n row(s) selected.\n {#if selected > 0}\n \n {/if}\n{/snippet}\n\n\n\n{#snippet small()}\n {#if total > 0}\n {start}-\n {end}/\n {total}\n {:else}\n {table.i18n.noRows}\n {/if}\n{/snippet}\n\n\n\n{#snippet rowCount()}\n {#if total > 0}\n {@html table.i18n.rowCount\n .replace('{start}', `${start}`)\n .replace('{end}', `${end}`)\n .replace('{total}', `${total}`)}\n {:else}\n {table.i18n.noRows}\n {/if}\n{/snippet}\n\n\n\n\n" }, { "path": "src/lib/src/shared/RowsPerPage.svelte", "content": "\n\n\n\n\n" }, { "path": "src/lib/src/shared/Search.svelte", "content": "\n\n search.set()}\n placeholder={table.i18n.search}\n spellcheck=\"false\"\n/>\n\n\n" }, { "path": "src/lib/src/shared/Th.svelte", "content": "\n\n\n \n {@render children?.()}\n \n\n\n\n" }, { "path": "src/lib/src/shared/ThFilter.svelte", "content": "\n\n\n filter.set()}\n />\n\n\n\n" }, { "path": "src/lib/src/shared/ThSort.svelte", "content": "\n\n sort.set()} class:active={sort.isActive}>\n
\n \n {@render children()}\n \n \n \n
\n\n\n\n" }, { "path": "src/lib/src/shared/builders/HighlightBuilder.svelte.ts", "content": "import type { TableHandlerInterface } from '$lib/src/shared'\nimport { stringify } from '$lib/src/client/core'\n\n\nexport default class HighlightBuilder\n{\n public selector : string\n private table : TableHandlerInterface\n private interval : NodeJS.Timeout\n private keywords = $derived(this.createKeywords())\n\n constructor(table: TableHandlerInterface, selector: string = 'tbody')\n {\n this.table = table\n this.selector = selector\n this.interval = setInterval(() => this.createHighlight(), 200)\n }\n\n private createHighlight()\n {\n if (!this.table?.element) {\n return\n }\n clearInterval(this.interval)\n const node = this.table.element.querySelector(this.selector)\n this.table.on('change', () => { \n // this.reset(node)\n this.emphasize(node)\n })\n }\n\n private createKeywords(): string[]\n {\n return [\n this.table['search'].value ?? null,\n // ...this.table.filters.map(filter => filter.value)\n ].filter(Boolean)\n }\n\n private emphasize(node: Node)\n {\n if (this.keywords.length === 0) return\n if (node.nodeType === Node.ELEMENT_NODE) {\n for (const child of node.childNodes) {\n if (child.nodeName !== 'EM') {\n this.emphasize(child)\n }\n }\n }\n else if (node.nodeType === Node.TEXT_NODE) {\n for (const keyword of this.keywords) {\n const index = stringify(node.nodeValue).indexOf(keyword)\n if (index > -1) {\n const em = document.createElement('em')\n em.classList.add('highlight')\n const mid = (node as Text).splitText(index)\n mid.splitText(keyword.length)\n mid.parentNode.insertBefore(em, mid)\n mid.parentNode.removeChild(mid)\n em.appendChild(mid)\n }\n }\n }\n }\n}" }, { "path": "src/lib/src/shared/builders/ViewBuilder.svelte.ts", "content": "import type { TableHandlerInterface, ColumnView } from '$lib/src/shared'\n\nexport default class ViewBuilder\n{\n public columns = $state([])\n private table : TableHandlerInterface\n private interval : NodeJS.Timeout\n private mutation : MutationObserver\n\n constructor(table: TableHandlerInterface, columns: ColumnView[])\n {\n this.table = table\n this.columns = []\n this.interval = setInterval(() => this.createColumns(columns), 200)\n }\n\n public toggle(name: string)\n {\n if (!this.table.element) return\n\n const column = this.columns.find(column => column.name === name)\n if (!column) return\n column.toggle()\n }\n\n private createColumns(columns: ColumnView[])\n {\n if (!this.table?.element) {\n return\n }\n clearInterval(this.interval)\n\n this.columns = columns.map(({ name, index, isVisible, isFrozen }) => {\n return {\n name,\n index,\n isVisible: isVisible === false ? false : true,\n isFrozen: isFrozen === true ? true : false,\n element: this.table.element,\n toggle: function() {\n this.isVisible = !this.isVisible\n this.element.querySelectorAll(`tr > *:nth-child(${this.index + 1})`).forEach((element: HTMLElement) => {\n element.classList.toggle('hidden')\n })\n }\n }\n })\n this.preset()\n this.mutation = new MutationObserver(() => {\n setTimeout(() => {\n this.preset()\n }, 2)\n })\n this.mutation.observe(this.table.element, { childList: true, subtree: true })\n }\n\n private preset()\n {\n let left = 0\n for (const { isVisible, isFrozen, index } of this.columns) {\n if (isFrozen === true) {\n left += this.freeze(index, left)\n }\n if (isVisible === false) {\n this.table.element.querySelectorAll(`tr > *:nth-child(${index + 1})`).forEach((element: HTMLElement) => {\n element.classList.add('hidden')\n })\n }\n }\n }\n\n private freeze(index: number, left = 0)\n {\n const column = this.table.element.querySelector(`thead th:nth-child(${index + 1})`) as HTMLElement\n const { width } = column.getBoundingClientRect()\n\n this.table.element.querySelectorAll(`tr > *:nth-child(${index + 1})`).forEach((element: HTMLElement) => {\n element.style.position = 'sticky'\n element.style.left = left + 'px'\n element.style.width = width + 'px'\n })\n return width\n }\n\n public setPosition(current: number, destination: number)\n {\n this.table.element.querySelectorAll('tr').forEach(row => {\n const cells = [].slice.call(row.querySelectorAll('th, td'))\n if (current > destination) {\n cells[destination].parentNode.insertBefore(\n cells[current],\n cells[destination]\n )\n }\n else {\n cells[destination].parentNode.insertBefore(\n cells[current],\n cells[destination].nextSibling\n )\n }\n })\n }\n}" }, { "path": "src/lib/src/shared/clsx/Datatable.svelte", "content": "\n\n
\n\n
\n {#if header}\n {@render header()}\n {:else if basic === true}\n \n \n {/if}\n
\n\n
\n {@render children()}\n
\n\n
\n {#if footer}\n {@render footer()}\n {:else if basic === true}\n \n \n {/if}\n
\n\n
\n\n\n" }, { "path": "src/lib/src/shared/clsx/Pagination.svelte", "content": "\n\n
\n {#if table.pages === undefined}\n {@render nopage()}\n {:else if table.clientWidth < 600}\n {@render small()}\n {:else}\n {@render ellipsis()}\n {/if}\n
\n\n\n\n{#snippet nopage()}\n \n \n \n{/snippet}\n\n\n\n{#snippet small()}\n \n \n \n \n{/snippet}\n\n\n\n{#snippet ellipsis()}\n \n {#each table.pagesWithEllipsis as page}\n \n {/each}\n \n{/snippet}\n\n\n\n" }, { "path": "src/lib/src/shared/clsx/ThSort.svelte", "content": "\n\n sort.set()} class={{ active: sort.isActive }}>\n
\n {@render children()}\n \n \n
\n\n\n\n" }, { "path": "src/lib/src/shared/index.ts", "content": "export { default as Datatable } from './Datatable.svelte'\nexport { default as Pagination } from './Pagination.svelte'\nexport { default as RowCount } from './RowCount.svelte'\nexport { default as Search } from './Search.svelte'\nexport { default as Th } from './Th.svelte'\nexport { default as ThSort } from './ThSort.svelte'\nexport { default as ThFilter } from './ThFilter.svelte'\nexport { default as RowsPerPage } from './RowsPerPage.svelte'\nexport { default as EventDispatcher } from './EventDispatcher'\nimport type { Check } from '$lib/src/client'\n\nexport type Row = { [key: string | number | symbol]: any }\n\nexport type Field = keyof Row | ((row: Row) => unknown)\n\nexport interface TableHandlerInterface {\n clientWidth : number,\n element : HTMLElement,\n pages : readonly number[],\n pagesWithEllipsis : readonly number[],\n currentPage : number,\n pageCount : number,\n i18n : Internationalization,\n rowCount : { selected: number, start: number, end: number, total: number }\n rowsPerPage : number,\n clearSelection() : void,\n createSearch(): SearchInterface,\n createFilter(field: Field, check?: Check): FilterInterface,\n createSort(field: Field): SortInterface,\n setPage(value?: number | 'previous' | 'next' | 'last'): void,\n on(event: string, callback: () => void): void \n}\n\nexport type Internationalization = {\n search ?: string,\n show ?: string,\n entries ?: string,\n filter ?: string,\n rowCount ?: string,\n noRows ?: string,\n previous ?: string,\n next ?: string\n}\n\nexport type ColumnView = {\n index : number,\n name ?: string,\n isVisible ?: boolean,\n isFrozen ?: boolean,\n toggle ?: () => void\n}\n\nexport interface SearchInterface {\n value: string,\n set: () => void,\n init: (value: string) => SearchInterface\n}\n\nexport interface FilterInterface {\n value: unknown,\n set: () => void,\n init: (value: unknown) => FilterInterface\n}\n\nexport interface SortInterface {\n isActive: boolean,\n direction: 'asc' | 'desc',\n set: () => void,\n init: (direction?: 'asc' | 'desc') => SortInterface\n}" }, { "path": "src/lib/style.css", "content": ".svelte-simple-datatable table {\n border-collapse: separate;\n border-spacing: 0;\n width: 100%;\n background: inherit;\n}\n.svelte-simple-datatable table thead {\n position: sticky;\n inset-block-start: 0;\n background: inherit;\n z-index: 1;\n}\n.svelte-simple-datatable thead tr {\n background: inherit;\n}\n.svelte-simple-datatable thead tr th {\n background: inherit;\n}\n.svelte-simple-datatable thead tr:first-child th {\n padding: 8px 20px;\n background: inherit;\n}\n.svelte-simple-datatable tbody {\n background: inherit;\n}\n.svelte-simple-datatable tbody tr {\n transition: background, 0.2s;\n background: inherit;\n}\n.svelte-simple-datatable tbody tr:hover {\n background: var(--grey-lighten-3, #fafafa);\n}\n.svelte-simple-datatable tbody td {\n padding: 4px 20px;\n border-right: 1px solid var(--grey-lighten, #eee);\n border-bottom: 1px solid var(--grey-lighten, #eee);\n background: inherit;\n}\n.svelte-simple-datatable tbody td:last-child {\n border-right: none;\n}\n.svelte-simple-datatable u.highlight {\n text-decoration: none;\n background: rgba(251, 192, 45, 0.6);\n border-radius: 2px;\n}\n.svelte-simple-datatable footer.divider {\n border-top: 1px solid var(--grey, #e0e0e0);\n}" }, { "path": "src/routes/+layout.svelte", "content": "\n\n\n\n\n\n
\n
\n
\n {@render children()}\n
\n
\n\n\n" }, { "path": "src/routes/+page.svelte", "content": "\n\n\n\n svelte simple datatables\n \n\n\n
\n
\n
\n

svelte simple datatables

\n

A powerful toolkit for building datatable components.

\n

Streamline your data workflow with a robust API providing advanced features while reducing code complexity.

\n
\n \n \n
\n
\n \n
\n
\n\n\n" }, { "path": "src/routes/Description.svelte", "content": "\n\n
\n
    \n
  • \n {@html checked}\n Headless solution\n
    • \n
  • \n {@html checked}\n SSR friendly\n
    • \n
  • \n {@html checked}\n Typescript support\n
    • \n
  • \n {@html checked}\n No dependency\n
    • \n \n
\n
\n\n" }, { "path": "src/routes/Header.svelte", "content": "\n\n
\n show = false}>\n \n svelte simple datatables\n SSD\n \n \n \n
\n\n\n" }, { "path": "src/routes/Header_Github.svelte", "content": "\n\n{#if isMobile}\n \n \n Github↗\n \n{:else}\n \n \n \n{/if}\n\n\n" }, { "path": "src/routes/Header_MobileNav.svelte", "content": "\n\n{#if show}\n \n{/if}\n\n" }, { "path": "src/routes/Header_Mode.svelte", "content": "\n\n{#if isMobile}\n \n{:else}\n \n{/if}\n\n" }, { "path": "src/routes/Header_Theme.svelte", "content": "\n\n{#if isMobile}\n \n{:else}\n \n{/if}\n\n" }, { "path": "src/routes/Header_Version.svelte", "content": "\n\n\n\n \n {#snippet content()}\n \n {/snippet}\n\n\n" }, { "path": "src/routes/about/+layout.svelte", "content": "\n\n\n