[
  {
    "path": ".changeset/README.md",
    "content": "# Changesets\n\nHello and welcome! This folder has been automatically generated by `@changesets/cli`, a build tool that works\nwith multi-package repos, or single-package repos to help you version and publish your code. You can\nfind the full documentation for it [in our repository](https://github.com/changesets/changesets)\n\nWe have a quick list of common questions to get you started engaging with this project in\n[our documentation](https://github.com/changesets/changesets/blob/main/docs/common-questions.md)\n"
  },
  {
    "path": ".changeset/config.json",
    "content": "{\n\t\"$schema\": \"https://unpkg.com/@changesets/config@3.0.0/schema.json\",\n\t\"changelog\": \"@changesets/cli/changelog\",\n\t\"commit\": false,\n\t\"fixed\": [],\n\t\"linked\": [[\"svelte-maplibre-gl\", \"@svelte-maplibre-gl/*\"]],\n\t\"access\": \"public\",\n\t\"baseBranch\": \"main\",\n\t\"updateInternalDependencies\": \"patch\",\n\t\"ignore\": [\"@svelte-maplibre-gl/docs\"],\n\t\"privatePackages\": {\n\t\t\"version\": false,\n\t\t\"tag\": false\n\t}\n}\n"
  },
  {
    "path": ".github/dependabot.yml",
    "content": "version: 2\nupdates:\n  - package-ecosystem: 'github-actions'\n    directory: '/'\n    schedule:\n      interval: 'weekly'\n"
  },
  {
    "path": ".github/pull_request_template.md",
    "content": "<!-- Close or Related Issues -->\n\nClose #0\n\n### What I did\n<!-- Please describe the motivation behind this PR and the changes it introduces. -->\n\n-\n\n### Notes\n<!-- If manual testing is required, please describe the procedure. -->\n\nNone\n"
  },
  {
    "path": ".github/workflows/lint.yml",
    "content": "name: Lint\n\non:\n  push:\n    branches:\n      - main\n  pull_request:\n\njobs:\n  lint:\n    runs-on: ubuntu-latest\n    permissions:\n      contents: read\n    steps:\n      - uses: actions/checkout@v6\n\n      - run: npm i -g --force corepack && corepack enable\n\n      - uses: actions/setup-node@v6\n        with:\n          node-version: 22\n          cache: 'pnpm'\n\n      - name: Install dependencies\n        run: pnpm install\n\n      - name: Svelte check\n        run: pnpm run check:all\n\n      - name: Lint\n        run: pnpm run lint\n"
  },
  {
    "path": ".github/workflows/preview.yml",
    "content": "name: Preview Release\n\non:\n  pull_request:\n\njobs:\n  preview-release:\n    runs-on: ubuntu-latest\n    permissions:\n      contents: read\n    steps:\n      - uses: actions/checkout@v6\n      - run: npm i -g --force corepack && corepack enable\n\n      - uses: actions/setup-node@v6\n        with:\n          node-version: 22\n          cache: 'pnpm'\n\n      - name: Install dependencies\n        run: pnpm install\n\n      - name: Build packages\n        run: pnpm build:packages\n\n      - name: Publish packages preview with pkg-pr-new CLI\n        run: |\n          pnpx pkg-pr-new publish \\\n            ./svelte-maplibre-gl \\\n            ./extensions/contour \\\n            ./extensions/deckgl \\\n            ./extensions/pmtiles \\\n            ./extensions/terradraw\n"
  },
  {
    "path": ".github/workflows/release.yml",
    "content": "name: Release\n\non:\n  push:\n    branches:\n      - main\n\nconcurrency: ${{ github.workflow }}-${{ github.ref }}\n\njobs:\n  release:\n    name: Release\n    runs-on: ubuntu-latest\n    permissions:\n      contents: write\n      pull-requests: write\n      id-token: write\n    steps:\n      - name: Checkout Repo\n        uses: actions/checkout@v6\n\n      - name: Setup pnpm\n        run: npm i -g --force corepack@latest && corepack enable\n\n      - name: Setup Node.js\n        uses: actions/setup-node@v6\n        with:\n          node-version: 22\n          cache: 'pnpm'\n\n      - name: Install Dependencies\n        run: pnpm install\n\n      - name: Create Release Pull Request or Publish to npm\n        id: changesets\n        uses: changesets/action@c48e67d110a68bc90ccf1098e9646092baacaa87 # v1.6.0\n        with:\n          publish: pnpm run release\n          version: pnpm run version\n        env:\n          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}\n          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}\n\n      # Generate preview releases for PRs\n      - name: Publish Preview Packages\n        if: steps.changesets.outputs.published != 'true'\n        run: |\n          pnpm build:packages\n          pnpx pkg-pr-new publish \\\n            ./svelte-maplibre-gl \\\n            ./extensions/contour \\\n            ./extensions/deckgl \\\n            ./extensions/pmtiles \\\n            ./extensions/terradraw\n"
  },
  {
    "path": ".gitignore",
    "content": "test-results\nnode_modules\n\n# Output\n.output\n.vercel\n**/.svelte-kit/\n**/dist/\n/build\n.turbo\n\n# OS\n.DS_Store\nThumbs.db\n\n# Env\n.env\n.env.*\n!.env.example\n!.env.test\n\n# Vite\nvite.config.js.timestamp-*\nvite.config.ts.timestamp-*\n\n# ignore npm lockfile\npackage-lock.json\n\n.wrangler"
  },
  {
    "path": ".node-version",
    "content": "22.17"
  },
  {
    "path": ".npmrc",
    "content": "engine-strict=true"
  },
  {
    "path": ".prettierignore",
    "content": "# Package Managers\npackage-lock.json\npnpm-lock.yaml\nyarn.lock\n\n**/dist/\n**/.svelte-kit/\n\n# shadcn-svelte\nsrc/lib/components/ui/**\n\n.github/*.md\n/README.md"
  },
  {
    "path": ".prettierrc",
    "content": "{\n\t\"useTabs\": true,\n\t\"singleQuote\": true,\n\t\"trailingComma\": \"none\",\n\t\"printWidth\": 120,\n\t\"plugins\": [\"prettier-plugin-tailwindcss\", \"prettier-plugin-svelte\"],\n\t\"overrides\": [\n\t\t{\n\t\t\t\"files\": \"*.svelte\",\n\t\t\t\"options\": {\n\t\t\t\t\"parser\": \"svelte\"\n\t\t\t}\n\t\t},\n\t\t{\n\t\t\t\"files\": [\"*.svx\", \"*.svelte.md\", \"*.md\"],\n\t\t\t\"options\": {\n\t\t\t\t\"parser\": \"markdown\"\n\t\t\t}\n\t\t}\n\t],\n\t\"tailwindStylesheet\": \"./src/app.css\"\n}\n"
  },
  {
    "path": "LICENSE-APACHE.txt",
    "content": "\n                                 Apache License\n                           Version 2.0, January 2004\n                        http://www.apache.org/licenses/\n\n   TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION\n\n   1. Definitions.\n\n      \"License\" shall mean the terms and conditions for use, reproduction,\n      and distribution as defined by Sections 1 through 9 of this document.\n\n      \"Licensor\" shall mean the copyright owner or entity authorized by\n      the copyright owner that is granting the License.\n\n      \"Legal Entity\" shall mean the union of the acting entity and all\n      other entities that control, are controlled by, or are under common\n      control with that entity. For the purposes of this definition,\n      \"control\" means (i) the power, direct or indirect, to cause the\n      direction or management of such entity, whether by contract or\n      otherwise, or (ii) ownership of fifty percent (50%) or more of the\n      outstanding shares, or (iii) beneficial ownership of such entity.\n\n      \"You\" (or \"Your\") shall mean an individual or Legal Entity\n      exercising permissions granted by this License.\n\n      \"Source\" form shall mean the preferred form for making modifications,\n      including but not limited to software source code, documentation\n      source, and configuration files.\n\n      \"Object\" form shall mean any form resulting from mechanical\n      transformation or translation of a Source form, including but\n      not limited to compiled object code, generated documentation,\n      and conversions to other media types.\n\n      \"Work\" shall mean the work of authorship, whether in Source or\n      Object form, made available under the License, as indicated by a\n      copyright notice that is included in or attached to the work\n      (an example is provided in the Appendix below).\n\n      \"Derivative Works\" shall mean any work, whether in Source or Object\n      form, that is based on (or derived from) the Work and for which the\n      editorial revisions, annotations, elaborations, or other modifications\n      represent, as a whole, an original work of authorship. For the purposes\n      of this License, Derivative Works shall not include works that remain\n      separable from, or merely link (or bind by name) to the interfaces of,\n      the Work and Derivative Works thereof.\n\n      \"Contribution\" shall mean any work of authorship, including\n      the original version of the Work and any modifications or additions\n      to that Work or Derivative Works thereof, that is intentionally\n      submitted to Licensor for inclusion in the Work by the copyright owner\n      or by an individual or Legal Entity authorized to submit on behalf of\n      the copyright owner. For the purposes of this definition, \"submitted\"\n      means any form of electronic, verbal, or written communication sent\n      to the Licensor or its representatives, including but not limited to\n      communication on electronic mailing lists, source code control systems,\n      and issue tracking systems that are managed by, or on behalf of, the\n      Licensor for the purpose of discussing and improving the Work, but\n      excluding communication that is conspicuously marked or otherwise\n      designated in writing by the copyright owner as \"Not a Contribution.\"\n\n      \"Contributor\" shall mean Licensor and any individual or Legal Entity\n      on behalf of whom a Contribution has been received by Licensor and\n      subsequently incorporated within the Work.\n\n   2. Grant of Copyright License. Subject to the terms and conditions of\n      this License, each Contributor hereby grants to You a perpetual,\n      worldwide, non-exclusive, no-charge, royalty-free, irrevocable\n      copyright license to reproduce, prepare Derivative Works of,\n      publicly display, publicly perform, sublicense, and distribute the\n      Work and such Derivative Works in Source or Object form.\n\n   3. Grant of Patent License. Subject to the terms and conditions of\n      this License, each Contributor hereby grants to You a perpetual,\n      worldwide, non-exclusive, no-charge, royalty-free, irrevocable\n      (except as stated in this section) patent license to make, have made,\n      use, offer to sell, sell, import, and otherwise transfer the Work,\n      where such license applies only to those patent claims licensable\n      by such Contributor that are necessarily infringed by their\n      Contribution(s) alone or by combination of their Contribution(s)\n      with the Work to which such Contribution(s) was submitted. If You\n      institute patent litigation against any entity (including a\n      cross-claim or counterclaim in a lawsuit) alleging that the Work\n      or a Contribution incorporated within the Work constitutes direct\n      or contributory patent infringement, then any patent licenses\n      granted to You under this License for that Work shall terminate\n      as of the date such litigation is filed.\n\n   4. Redistribution. You may reproduce and distribute copies of the\n      Work or Derivative Works thereof in any medium, with or without\n      modifications, and in Source or Object form, provided that You\n      meet the following conditions:\n\n      (a) You must give any other recipients of the Work or\n          Derivative Works a copy of this License; and\n\n      (b) You must cause any modified files to carry prominent notices\n          stating that You changed the files; and\n\n      (c) You must retain, in the Source form of any Derivative Works\n          that You distribute, all copyright, patent, trademark, and\n          attribution notices from the Source form of the Work,\n          excluding those notices that do not pertain to any part of\n          the Derivative Works; and\n\n      (d) If the Work includes a \"NOTICE\" text file as part of its\n          distribution, then any Derivative Works that You distribute must\n          include a readable copy of the attribution notices contained\n          within such NOTICE file, excluding those notices that do not\n          pertain to any part of the Derivative Works, in at least one\n          of the following places: within a NOTICE text file distributed\n          as part of the Derivative Works; within the Source form or\n          documentation, if provided along with the Derivative Works; or,\n          within a display generated by the Derivative Works, if and\n          wherever such third-party notices normally appear. The contents\n          of the NOTICE file are for informational purposes only and\n          do not modify the License. You may add Your own attribution\n          notices within Derivative Works that You distribute, alongside\n          or as an addendum to the NOTICE text from the Work, provided\n          that such additional attribution notices cannot be construed\n          as modifying the License.\n\n      You may add Your own copyright statement to Your modifications and\n      may provide additional or different license terms and conditions\n      for use, reproduction, or distribution of Your modifications, or\n      for any such Derivative Works as a whole, provided Your use,\n      reproduction, and distribution of the Work otherwise complies with\n      the conditions stated in this License.\n\n   5. Submission of Contributions. Unless You explicitly state otherwise,\n      any Contribution intentionally submitted for inclusion in the Work\n      by You to the Licensor shall be under the terms and conditions of\n      this License, without any additional terms or conditions.\n      Notwithstanding the above, nothing herein shall supersede or modify\n      the terms of any separate license agreement you may have executed\n      with Licensor regarding such Contributions.\n\n   6. Trademarks. This License does not grant permission to use the trade\n      names, trademarks, service marks, or product names of the Licensor,\n      except as required for reasonable and customary use in describing the\n      origin of the Work and reproducing the content of the NOTICE file.\n\n   7. Disclaimer of Warranty. Unless required by applicable law or\n      agreed to in writing, Licensor provides the Work (and each\n      Contributor provides its Contributions) on an \"AS IS\" BASIS,\n      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or\n      implied, including, without limitation, any warranties or conditions\n      of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A\n      PARTICULAR PURPOSE. You are solely responsible for determining the\n      appropriateness of using or redistributing the Work and assume any\n      risks associated with Your exercise of permissions under this License.\n\n   8. Limitation of Liability. In no event and under no legal theory,\n      whether in tort (including negligence), contract, or otherwise,\n      unless required by applicable law (such as deliberate and grossly\n      negligent acts) or agreed to in writing, shall any Contributor be\n      liable to You for damages, including any direct, indirect, special,\n      incidental, or consequential damages of any character arising as a\n      result of this License or out of the use or inability to use the\n      Work (including but not limited to damages for loss of goodwill,\n      work stoppage, computer failure or malfunction, or any and all\n      other commercial damages or losses), even if such Contributor\n      has been advised of the possibility of such damages.\n\n   9. Accepting Warranty or Additional Liability. While redistributing\n      the Work or Derivative Works thereof, You may choose to offer,\n      and charge a fee for, acceptance of support, warranty, indemnity,\n      or other liability obligations and/or rights consistent with this\n      License. However, in accepting such obligations, You may act only\n      on Your own behalf and on Your sole responsibility, not on behalf\n      of any other Contributor, and only if You agree to indemnify,\n      defend, and hold each Contributor harmless for any liability\n      incurred by, or claims asserted against, such Contributor by reason\n      of your accepting any such warranty or additional liability.\n\n   END OF TERMS AND CONDITIONS\n\n   APPENDIX: How to apply the Apache License to your work.\n\n      To apply the Apache License to your work, attach the following\n      boilerplate notice, with the fields enclosed by brackets \"[]\"\n      replaced with your own identifying information. (Don't include\n      the brackets!)  The text should be enclosed in the appropriate\n      comment syntax for the file format. We also recommend that a\n      file or class name and description of purpose be included on the\n      same \"printed page\" as the copyright notice for easier\n      identification within third-party archives.\n\n   Copyright [yyyy] [name of copyright owner]\n\n   Licensed under the Apache License, Version 2.0 (the \"License\");\n   you may not use this file except in compliance with the License.\n   You may obtain a copy of the License at\n\n       http://www.apache.org/licenses/LICENSE-2.0\n\n   Unless required by applicable law or agreed to in writing, software\n   distributed under the License is distributed on an \"AS IS\" BASIS,\n   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n   See the License for the specific language governing permissions and\n   limitations under the License."
  },
  {
    "path": "LICENSE-MIT.txt",
    "content": "MIT License\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."
  },
  {
    "path": "README.md",
    "content": "# Svelte MapLibre GL\n\n![NPM Version](https://img.shields.io/npm/v/svelte-maplibre-gl)\n![NPM License](https://img.shields.io/npm/l/svelte-maplibre-gl?color=96C902)\n\n:world_map: Build interactive web maps effortlessly with [MapLibre GL JS](https://maplibre.org/maplibre-gl-js/docs/) and [Svelte](https://svelte.dev/).\n\n:point_right: **Documentaion and Live Demos:** https://svelte-maplibre-gl.mierune.dev/examples/\n\n**Features:**\n\n- The most declarative and reactive MapLibre GL JS experience, powered by Svelte 5\n- A flexible, minimally opinionated API design that is suitable for both beginners and experienced MapLibre users\n- Freedom preserved — Traditional imperative MapLibre GL JS usage remains fully supported\n\nLicense: MIT or Apache 2.0\n\n<img alt=\"hero image\" src=\"./src/lib/assets/hero.svg\" width=\"100%\">\n\n## Installation\n\n```bash\nnpm install --save-dev svelte-maplibre-gl\n```\n\n`svelte-maplibre-gl` only works with **Svelte 5** and above.\n\n## License\n\nLicensed under the [MIT License](./LICENSE-MIT.txt) or the [Apache License 2.0](./LICENSE-APACHE.txt), at your option.\n\n## Acknowledgements\n\nThis project `svelte-maplibre-gl` is built from scratch, while drawing strong inspiration from the work of the following libraries:\n\n- [`dimfeld/svelte-maplibre`](https://github.com/dimfeld/svelte-maplibre) &mdash; A library offering idiomatic Svelte support for the MapLibre GL mapping software\n- [`visgl/react-map-gl`](https://visgl.github.io/react-map-gl/) and [`visgl/react-maplibre`](https://visgl.github.io/react-maplibre/) &mdash; React friendly API wrapper around Mapbox/MapLibre GL JS\n\n## Contributing\n\nEveryone is welcome to contribute to this project! There are many ways to support it, such as:\n\n- Trying it out and reporting any issues or missing features\n- Expanding, improving, or suggesting new examples\n- Any other ideas you might have!\n\nYour contributions are greatly appreciated.\n\n### Authors\n\n[All contributors](https://github.com/MIERUNE/svelte-maplibre-gl/graphs/contributors)!\n"
  },
  {
    "path": "components.json",
    "content": "{\n\t\"$schema\": \"https://shadcn-svelte.com/schema.json\",\n\t\"tailwind\": {\n\t\t\"css\": \"src/app.css\",\n\t\t\"baseColor\": \"slate\"\n\t},\n\t\"aliases\": {\n\t\t\"components\": \"$lib/components\",\n\t\t\"utils\": \"$lib/utils\",\n\t\t\"ui\": \"$lib/components/ui\",\n\t\t\"hooks\": \"$lib/hooks\",\n\t\t\"lib\": \"$lib\"\n\t},\n\t\"typescript\": true,\n\t\"registry\": \"https://shadcn-svelte.com/registry\"\n}\n"
  },
  {
    "path": "e2e/demo.test.ts",
    "content": "import { expect, test } from '@playwright/test';\n\ntest('home page has expected h1', async ({ page }) => {\n\tawait page.goto('/');\n\tawait expect(page.locator('h1')).toBeVisible();\n});\n"
  },
  {
    "path": "eslint.config.js",
    "content": "import prettier from 'eslint-config-prettier';\nimport js from '@eslint/js';\nimport svelte from 'eslint-plugin-svelte';\nimport globals from 'globals';\nimport ts from 'typescript-eslint';\n\nexport default ts.config(\n\tjs.configs.recommended,\n\t...ts.configs.recommended,\n\t...svelte.configs['flat/recommended'],\n\tprettier,\n\t...svelte.configs['flat/prettier'],\n\t{\n\t\tlanguageOptions: {\n\t\t\tglobals: {\n\t\t\t\t...globals.browser,\n\t\t\t\t...globals.node\n\t\t\t}\n\t\t}\n\t},\n\t{\n\t\tfiles: ['**/*.svelte', '**/*.svelte.ts'],\n\t\trules: {\n\t\t\t// surpress \"Expected an assignment or function call and instead saw an expression\"\n\t\t\t'@typescript-eslint/no-unused-expressions': 'off'\n\t\t\t// 'svelte/require-each-key': 'off'\n\t\t},\n\t\tlanguageOptions: {\n\t\t\tparserOptions: {\n\t\t\t\tparser: ts.parser\n\t\t\t}\n\t\t}\n\t},\n\t{\n\t\tignores: ['**/build/', '**/.svelte-kit/', '**/dist/']\n\t}\n);\n"
  },
  {
    "path": "extensions/contour/CHANGELOG.md",
    "content": "# @svelte-maplibre-gl/contour\n\n## 1.0.3\n\n### Patch Changes\n\n- Updated dependencies [6b3cd54]\n  - svelte-maplibre-gl@1.0.3\n\n## 1.0.2\n\n### Patch Changes\n\n- Updated dependencies [608c2b5]\n  - svelte-maplibre-gl@1.0.2\n\n## 1.0.1\n\n### Patch Changes\n\n- Updated dependencies [a5cc3ef]\n  - svelte-maplibre-gl@1.0.1\n"
  },
  {
    "path": "extensions/contour/package.json",
    "content": "{\n\t\"name\": \"@svelte-maplibre-gl/contour\",\n\t\"version\": \"1.0.3\",\n\t\"license\": \"(MIT OR Apache-2.0)\",\n\t\"description\": \"maplibre-contour extension for svelte-maplibre-gl\",\n\t\"repository\": {\n\t\t\"url\": \"https://github.com/MIERUNE/svelte-maplibre-gl\"\n\t},\n\t\"homepage\": \"https://svelte-maplibre-gl.mierune.dev/\",\n\t\"keywords\": [\n\t\t\"map\",\n\t\t\"svelte\",\n\t\t\"maplibre\",\n\t\t\"maplibre-gl\",\n\t\t\"contour\"\n\t],\n\t\"scripts\": {\n\t\t\"build\": \"vite build && npm run prepack\",\n\t\t\"preview\": \"vite preview\",\n\t\t\"prepare\": \"svelte-kit sync || echo ''\",\n\t\t\"prepack\": \"svelte-kit sync && svelte-package && publint\",\n\t\t\"check\": \"svelte-kit sync && svelte-check --tsconfig ./tsconfig.json\",\n\t\t\"check:watch\": \"svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch\",\n\t\t\"lint\": \"prettier --check .\"\n\t},\n\t\"files\": [\n\t\t\"dist\",\n\t\t\"!dist/**/*.test.*\",\n\t\t\"!dist/**/*.spec.*\"\n\t],\n\t\"sideEffects\": false,\n\t\"svelte\": \"./dist/index.js\",\n\t\"types\": \"./dist/index.d.ts\",\n\t\"type\": \"module\",\n\t\"exports\": {\n\t\t\".\": {\n\t\t\t\"types\": \"./dist/index.d.ts\",\n\t\t\t\"svelte\": \"./dist/index.js\"\n\t\t}\n\t},\n\t\"peerDependencies\": {\n\t\t\"maplibre-contour\": \">=0.1.0\",\n\t\t\"maplibre-gl\": \"^5.0.0 || ^4.0.0\",\n\t\t\"svelte\": \">=5.0.0\",\n\t\t\"svelte-maplibre-gl\": \"workspace:*\"\n\t},\n\t\"devDependencies\": {\n\t\t\"@sveltejs/kit\": \"catalog:\",\n\t\t\"@sveltejs/package\": \"catalog:\",\n\t\t\"@sveltejs/vite-plugin-svelte\": \"catalog:\",\n\t\t\"maplibre-contour\": \"catalog:\",\n\t\t\"maplibre-gl\": \"catalog:\",\n\t\t\"publint\": \"catalog:\",\n\t\t\"svelte\": \"catalog:\",\n\t\t\"svelte-check\": \"catalog:\",\n\t\t\"svelte-maplibre-gl\": \"workspace:*\",\n\t\t\"typescript\": \"catalog:\",\n\t\t\"vite\": \"catalog:\"\n\t}\n}\n"
  },
  {
    "path": "extensions/contour/src/app.d.ts",
    "content": "// See https://svelte.dev/docs/kit/types#app.d.ts\n// for information about these interfaces\ndeclare global {\n\tnamespace App {\n\t\t// interface Error {}\n\t\t// interface Locals {}\n\t\t// interface PageData {}\n\t\t// interface PageState {}\n\t\t// interface Platform {}\n\t}\n}\n\nexport {};\n"
  },
  {
    "path": "extensions/contour/src/app.html",
    "content": "<!doctype html>\n<html lang=\"en\">\n\t<head>\n\t\t<meta charset=\"utf-8\" />\n\t\t<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\" />\n\t\t%sveltekit.head%\n\t</head>\n\t<body data-sveltekit-preload-data=\"hover\">\n\t\t<div style=\"display: contents\">%sveltekit.body%</div>\n\t</body>\n</html>\n"
  },
  {
    "path": "extensions/contour/src/lib/MapLibreContourSource.svelte",
    "content": "<script lang=\"ts\">\n\t// https://github.com/onthegomap/maplibre-contour\n\n\timport type { Snippet } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport { default as mlcontour } from 'maplibre-contour';\n\timport { VectorTileSource } from 'svelte-maplibre-gl';\n\n\ttype LocalDemManager = typeof mlcontour.LocalDemManager.prototype;\n\ttype DemSource = typeof mlcontour.DemSource.prototype;\n\ttype DemSourceConstructorParams = ConstructorParameters<typeof mlcontour.DemSource>[0];\n\ttype GlobalContourTileOptions = Parameters<DemSource['contourProtocolUrl']>[0];\n\n\tinterface Props extends DemSourceConstructorParams {\n\t\tchildren?: Snippet<[demSource: DemSource]>;\n\t\tdemSource?: DemSource;\n\t\ttileOptions: GlobalContourTileOptions;\n\t\tattribution?: string;\n\t\tgetTile?: LocalDemManager['getTile'];\n\t}\n\n\tlet {\n\t\tchildren,\n\t\tdemSource = $bindable(),\n\t\turl,\n\t\tid,\n\t\tcacheSize,\n\t\tencoding = 'mapbox',\n\t\tmaxzoom,\n\t\ttimeoutMs,\n\t\tworker = true,\n\t\tactor,\n\t\ttileOptions,\n\t\tattribution,\n\t\t/** Custom getTile function for LocalDemManager (experimental) */\n\t\tgetTile\n\t}: Props = $props();\n\n\t$effect(() => {\n\t\tif (getTile) {\n\t\t\tworker = false;\n\t\t}\n\t\t(async () => {\n\t\t\tdemSource = new mlcontour.DemSource({\n\t\t\t\turl,\n\t\t\t\tid,\n\t\t\t\tcacheSize, // number of most-recent tiles to cache\n\t\t\t\tencoding,\n\t\t\t\tmaxzoom,\n\t\t\t\ttimeoutMs, // timeout on fetch requests\n\t\t\t\tworker, // offload isoline computation to a web worker to reduce jank\n\t\t\t\tactor\n\t\t\t});\n\t\t\tif (getTile && 'getTile' in demSource.manager) {\n\t\t\t\tdemSource.manager.getTile = getTile;\n\t\t\t}\n\t\t\tdemSource.setupMaplibre(maplibregl);\n\t\t})();\n\n\t\treturn () => {\n\t\t\tif (demSource) {\n\t\t\t\tmaplibregl.removeProtocol(demSource.sharedDemProtocolId);\n\t\t\t\tmaplibregl.removeProtocol(demSource.contourProtocolId);\n\t\t\t}\n\t\t};\n\t});\n</script>\n\n{#if demSource}\n\t<VectorTileSource tiles={[demSource.contourProtocolUrl(tileOptions)]} maxzoom={15} {attribution}>\n\t\t{@render children?.(demSource)}\n\t</VectorTileSource>\n{/if}\n"
  },
  {
    "path": "extensions/contour/src/lib/index.ts",
    "content": "export { default as MapLibreContourSource } from './MapLibreContourSource.svelte';\n"
  },
  {
    "path": "extensions/contour/svelte.config.js",
    "content": "import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';\n\n/** @type {import('@sveltejs/kit').Config} */\nconst config = {\n\t// Consult https://svelte.dev/docs/kit/integrations\n\t// for more information about preprocessors\n\tpreprocess: vitePreprocess(),\n\n\tkit: {\n\t\t// Since this is a library package, we don't need an adapter\n\t\tadapter: undefined\n\t}\n};\n\nexport default config;\n"
  },
  {
    "path": "extensions/contour/tsconfig.json",
    "content": "{\n\t\"extends\": \"./.svelte-kit/tsconfig.json\",\n\t\"compilerOptions\": {\n\t\t\"allowJs\": true,\n\t\t\"checkJs\": true,\n\t\t\"esModuleInterop\": true,\n\t\t\"forceConsistentCasingInFileNames\": true,\n\t\t\"resolveJsonModule\": true,\n\t\t\"skipLibCheck\": true,\n\t\t\"sourceMap\": true,\n\t\t\"strict\": true,\n\t\t\"moduleResolution\": \"bundler\",\n\t\t\"module\": \"ESNext\",\n\t\t\"target\": \"ES2020\",\n\t\t\"lib\": [\"ES2020\", \"DOM\", \"DOM.Iterable\"],\n\t\t\"types\": [\"svelte\"]\n\t},\n\t\"include\": [\"src/**/*.ts\", \"src/**/*.js\", \"src/**/*.svelte\"],\n\t\"exclude\": [\"node_modules\", \"dist\"]\n}\n"
  },
  {
    "path": "extensions/contour/vite.config.ts",
    "content": "import { defineConfig } from 'vite';\nimport { svelte } from '@sveltejs/vite-plugin-svelte';\n\nexport default defineConfig({\n\tplugins: [svelte()],\n\n\tbuild: {\n\t\tlib: {\n\t\t\tentry: './src/lib/index.ts',\n\t\t\tname: 'SvelteMaplibreContour',\n\t\t\tfileName: 'index'\n\t\t},\n\t\trollupOptions: {\n\t\t\texternal: ['svelte', 'maplibre-gl', '@watergis/maplibre-gl-terradraw'],\n\t\t\toutput: {\n\t\t\t\tglobals: {\n\t\t\t\t\tsvelte: 'Svelte',\n\t\t\t\t\t'maplibre-gl': 'maplibregl',\n\t\t\t\t\t'@watergis/maplibre-gl-terradraw': 'MaplibreContour'\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n});\n"
  },
  {
    "path": "extensions/deckgl/CHANGELOG.md",
    "content": "# @svelte-maplibre-gl/deckgl\n\n## 1.0.3\n\n### Patch Changes\n\n- Updated dependencies [6b3cd54]\n  - svelte-maplibre-gl@1.0.3\n\n## 1.0.2\n\n### Patch Changes\n\n- Updated dependencies [608c2b5]\n  - svelte-maplibre-gl@1.0.2\n\n## 1.0.1\n\n### Patch Changes\n\n- Updated dependencies [a5cc3ef]\n  - svelte-maplibre-gl@1.0.1\n"
  },
  {
    "path": "extensions/deckgl/package.json",
    "content": "{\n\t\"name\": \"@svelte-maplibre-gl/deckgl\",\n\t\"version\": \"1.0.3\",\n\t\"license\": \"(MIT OR Apache-2.0)\",\n\t\"description\": \"DeckGL extension for svelte-maplibre-gl\",\n\t\"repository\": {\n\t\t\"url\": \"https://github.com/MIERUNE/svelte-maplibre-gl\"\n\t},\n\t\"homepage\": \"https://svelte-maplibre-gl.mierune.dev/\",\n\t\"keywords\": [\n\t\t\"map\",\n\t\t\"svelte\",\n\t\t\"maplibre\",\n\t\t\"maplibre-gl\",\n\t\t\"deckgl\"\n\t],\n\t\"scripts\": {\n\t\t\"build\": \"vite build && npm run prepack\",\n\t\t\"preview\": \"vite preview\",\n\t\t\"prepare\": \"svelte-kit sync || echo ''\",\n\t\t\"prepack\": \"svelte-kit sync && svelte-package && publint\",\n\t\t\"check\": \"svelte-kit sync && svelte-check --tsconfig ./tsconfig.json\",\n\t\t\"check:watch\": \"svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch\",\n\t\t\"lint\": \"prettier --check .\"\n\t},\n\t\"files\": [\n\t\t\"dist\",\n\t\t\"!dist/**/*.test.*\",\n\t\t\"!dist/**/*.spec.*\"\n\t],\n\t\"sideEffects\": false,\n\t\"svelte\": \"./dist/index.js\",\n\t\"types\": \"./dist/index.d.ts\",\n\t\"type\": \"module\",\n\t\"exports\": {\n\t\t\".\": {\n\t\t\t\"types\": \"./dist/index.d.ts\",\n\t\t\t\"svelte\": \"./dist/index.js\"\n\t\t}\n\t},\n\t\"peerDependencies\": {\n\t\t\"@deck.gl/core\": \"^9.1.0\",\n\t\t\"@deck.gl/layers\": \"^9.1.0\",\n\t\t\"@deck.gl/mapbox\": \"^9.1.0\",\n\t\t\"maplibre-gl\": \"^5.0.0 || ^4.0.0\",\n\t\t\"svelte\": \">=5.0.0\",\n\t\t\"svelte-maplibre-gl\": \"workspace:*\"\n\t},\n\t\"devDependencies\": {\n\t\t\"@deck.gl/core\": \"catalog:\",\n\t\t\"@deck.gl/layers\": \"catalog:\",\n\t\t\"@deck.gl/mapbox\": \"catalog:\",\n\t\t\"@sveltejs/kit\": \"catalog:\",\n\t\t\"@sveltejs/package\": \"catalog:\",\n\t\t\"@sveltejs/vite-plugin-svelte\": \"catalog:\",\n\t\t\"maplibre-gl\": \"catalog:\",\n\t\t\"publint\": \"catalog:\",\n\t\t\"svelte\": \"catalog:\",\n\t\t\"svelte-check\": \"catalog:\",\n\t\t\"svelte-maplibre-gl\": \"workspace:*\",\n\t\t\"typescript\": \"catalog:\",\n\t\t\"vite\": \"catalog:\"\n\t}\n}\n"
  },
  {
    "path": "extensions/deckgl/src/app.d.ts",
    "content": "// See https://svelte.dev/docs/kit/types#app.d.ts\n// for information about these interfaces\ndeclare global {\n\tnamespace App {\n\t\t// interface Error {}\n\t\t// interface Locals {}\n\t\t// interface PageData {}\n\t\t// interface PageState {}\n\t\t// interface Platform {}\n\t}\n}\n\nexport {};\n"
  },
  {
    "path": "extensions/deckgl/src/app.html",
    "content": "<!doctype html>\n<html lang=\"en\">\n\t<head>\n\t\t<meta charset=\"utf-8\" />\n\t\t<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\" />\n\t\t%sveltekit.head%\n\t</head>\n\t<body data-sveltekit-preload-data=\"hover\">\n\t\t<div style=\"display: contents\">%sveltekit.body%</div>\n\t</body>\n</html>\n"
  },
  {
    "path": "extensions/deckgl/src/lib/DeckGLOverlay.svelte",
    "content": "<script lang=\"ts\">\n\timport { onDestroy, onMount, untrack } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport { MapboxOverlay, type MapboxOverlayProps } from '@deck.gl/mapbox';\n\timport { getMapContext } from 'svelte-maplibre-gl';\n\n\ttype Props = MapboxOverlayProps;\n\n\tlet {\n\t\t// not reactive\n\t\tinterleaved = false,\n\t\tid,\n\t\tdebug,\n\t\t_typedArrayManagerProps,\n\t\t// reactive (?)\n\t\tstyle,\n\t\tuseDevicePixels,\n\t\tparameters,\n\t\tlayers,\n\t\tlayerFilter,\n\t\teffects = [],\n\t\t_framebuffer,\n\t\t_animate,\n\t\tgetCursor,\n\t\tgetTooltip,\n\t\tpickingRadius,\n\t\ttouchAction,\n\t\teventRecognizerOptions,\n\t\t_pickable,\n\t\tonDeviceInitialized,\n\t\tonViewStateChange,\n\t\tonInteractionStateChange,\n\t\tonHover,\n\t\tonClick,\n\t\tonDragStart,\n\t\tonDrag,\n\t\tonDragEnd,\n\t\tonLoad,\n\t\tonResize,\n\t\tonBeforeRender,\n\t\tonAfterRender,\n\t\tonError,\n\t\t_onMetrics\n\t}: Props = $props();\n\n\tconst mapCtx = getMapContext();\n\tif (!mapCtx.map) throw new Error('Map instance is not initialized.');\n\n\tlet deckOverlay: MapboxOverlay;\n\tonMount(() => {\n\t\tconst options: MapboxOverlayProps = Object.fromEntries(\n\t\t\tObject.entries({\n\t\t\t\tinterleaved,\n\t\t\t\tid,\n\t\t\t\tdebug,\n\t\t\t\t_typedArrayManagerProps,\n\t\t\t\tstyle,\n\t\t\t\tuseDevicePixels,\n\t\t\t\tparameters,\n\t\t\t\tlayers,\n\t\t\t\tlayerFilter,\n\t\t\t\teffects,\n\t\t\t\t_framebuffer,\n\t\t\t\t_animate,\n\t\t\t\tgetCursor,\n\t\t\t\tgetTooltip,\n\t\t\t\tpickingRadius,\n\t\t\t\ttouchAction,\n\t\t\t\teventRecognizerOptions,\n\t\t\t\t_pickable,\n\t\t\t\tonDeviceInitialized,\n\t\t\t\tonViewStateChange,\n\t\t\t\tonInteractionStateChange,\n\t\t\t\tonHover,\n\t\t\t\tonClick,\n\t\t\t\tonDragStart,\n\t\t\t\tonDrag,\n\t\t\t\tonDragEnd,\n\t\t\t\tonLoad,\n\t\t\t\tonResize,\n\t\t\t\tonBeforeRender,\n\t\t\t\tonAfterRender,\n\t\t\t\tonError,\n\t\t\t\t_onMetrics\n\n\t\t\t\t// filter out undefined values\n\t\t\t}).filter(([, v]) => v !== undefined)\n\t\t);\n\n\t\tdeckOverlay = new MapboxOverlay(options);\n\n\t\tmapCtx.map?.addControl(deckOverlay as maplibregl.IControl);\n\t});\n\n\tlet firstRun = true;\n\n\t// collect all reactive prop changes and apply them in a single update\n\tlet pendingChanges: MapboxOverlayProps = {};\n\tlet changeTrigger = $state(0);\n\n\tfunction reactiveProp<K extends keyof MapboxOverlayProps>(name: K, value: MapboxOverlayProps[K]) {\n\t\tif (!firstRun) {\n\t\t\tpendingChanges[name] = value;\n\t\t\tuntrack(() => (changeTrigger += 1));\n\t\t}\n\t}\n\n\t$effect(() => reactiveProp('style', style));\n\t$effect(() => reactiveProp('useDevicePixels', useDevicePixels));\n\t$effect(() => reactiveProp('parameters', parameters));\n\t$effect(() => reactiveProp('layers', layers));\n\t$effect(() => reactiveProp('layerFilter', layerFilter));\n\t$effect(() => reactiveProp('effects', effects));\n\t$effect(() => reactiveProp('_framebuffer', _framebuffer));\n\t$effect(() => reactiveProp('_animate', _animate));\n\t$effect(() => reactiveProp('getCursor', getCursor));\n\t$effect(() => reactiveProp('getTooltip', getTooltip));\n\t$effect(() => reactiveProp('pickingRadius', pickingRadius));\n\t$effect(() => reactiveProp('touchAction', touchAction));\n\t$effect(() => reactiveProp('eventRecognizerOptions', eventRecognizerOptions));\n\t$effect(() => reactiveProp('_pickable', _pickable));\n\t$effect(() => reactiveProp('onDeviceInitialized', onDeviceInitialized));\n\t$effect(() => reactiveProp('onViewStateChange', onViewStateChange));\n\t$effect(() => reactiveProp('onInteractionStateChange', onInteractionStateChange));\n\t$effect(() => reactiveProp('onHover', onHover));\n\t$effect(() => reactiveProp('onClick', onClick));\n\t$effect(() => reactiveProp('onDragStart', onDragStart));\n\t$effect(() => reactiveProp('onDrag', onDrag));\n\t$effect(() => reactiveProp('onDragEnd', onDragEnd));\n\t$effect(() => reactiveProp('onLoad', onLoad));\n\t$effect(() => reactiveProp('onResize', onResize));\n\t$effect(() => reactiveProp('onBeforeRender', onBeforeRender));\n\t$effect(() => reactiveProp('onAfterRender', onAfterRender));\n\t$effect(() => reactiveProp('onError', onError));\n\t$effect(() => reactiveProp('_onMetrics', _onMetrics));\n\n\t$effect(() => {\n\t\tfirstRun = false;\n\t});\n\n\t$effect(() => {\n\t\tchangeTrigger;\n\t\tif (!firstRun) {\n\t\t\tdeckOverlay.setProps(pendingChanges);\n\t\t\tpendingChanges = {};\n\t\t}\n\t});\n\n\tonDestroy(() => {\n\t\tmapCtx.map?.removeControl(deckOverlay as maplibregl.IControl);\n\t});\n</script>\n"
  },
  {
    "path": "extensions/deckgl/src/lib/index.ts",
    "content": "export { default as DeckGLOverlay } from './DeckGLOverlay.svelte';\n"
  },
  {
    "path": "extensions/deckgl/svelte.config.js",
    "content": "import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';\n\n/** @type {import('@sveltejs/kit').Config} */\nconst config = {\n\t// Consult https://svelte.dev/docs/kit/integrations\n\t// for more information about preprocessors\n\tpreprocess: vitePreprocess(),\n\n\tkit: {\n\t\t// Since this is a library package, we don't need an adapter\n\t\tadapter: undefined\n\t}\n};\n\nexport default config;\n"
  },
  {
    "path": "extensions/deckgl/tsconfig.json",
    "content": "{\n\t\"extends\": \"./.svelte-kit/tsconfig.json\",\n\t\"compilerOptions\": {\n\t\t\"allowJs\": true,\n\t\t\"checkJs\": true,\n\t\t\"esModuleInterop\": true,\n\t\t\"forceConsistentCasingInFileNames\": true,\n\t\t\"resolveJsonModule\": true,\n\t\t\"skipLibCheck\": true,\n\t\t\"sourceMap\": true,\n\t\t\"strict\": true,\n\t\t\"moduleResolution\": \"bundler\",\n\t\t\"module\": \"ESNext\",\n\t\t\"target\": \"ES2020\",\n\t\t\"lib\": [\"ES2020\", \"DOM\", \"DOM.Iterable\"],\n\t\t\"types\": [\"svelte\"]\n\t},\n\t\"include\": [\"src/**/*.ts\", \"src/**/*.js\", \"src/**/*.svelte\"],\n\t\"exclude\": [\"node_modules\", \"dist\"]\n}\n"
  },
  {
    "path": "extensions/deckgl/vite.config.ts",
    "content": "import { defineConfig } from 'vite';\nimport { svelte } from '@sveltejs/vite-plugin-svelte';\n\nexport default defineConfig({\n\tplugins: [svelte()],\n\n\tbuild: {\n\t\tlib: {\n\t\t\tentry: './src/lib/index.ts',\n\t\t\tname: 'SvelteMaplibreDeckGL',\n\t\t\tfileName: 'index'\n\t\t},\n\t\trollupOptions: {\n\t\t\texternal: ['svelte', 'maplibre-gl', '@deck.gl/mapbox'],\n\t\t\toutput: {\n\t\t\t\tglobals: {\n\t\t\t\t\tsvelte: 'Svelte',\n\t\t\t\t\t'maplibre-gl': 'maplibregl',\n\t\t\t\t\t'@deck.gl/mapbox': 'DeckGLMapbox'\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n});\n"
  },
  {
    "path": "extensions/pmtiles/CHANGELOG.md",
    "content": "# @svelte-maplibre-gl/pmtiles\n\n## 1.0.3\n\n### Patch Changes\n\n- Updated dependencies [6b3cd54]\n  - svelte-maplibre-gl@1.0.3\n\n## 1.0.2\n\n### Patch Changes\n\n- Updated dependencies [608c2b5]\n  - svelte-maplibre-gl@1.0.2\n\n## 1.0.1\n\n### Patch Changes\n\n- Updated dependencies [a5cc3ef]\n  - svelte-maplibre-gl@1.0.1\n"
  },
  {
    "path": "extensions/pmtiles/package.json",
    "content": "{\n\t\"name\": \"@svelte-maplibre-gl/pmtiles\",\n\t\"version\": \"1.0.3\",\n\t\"license\": \"(MIT OR Apache-2.0)\",\n\t\"description\": \"PMTiles extension for svelte-maplibre-gl\",\n\t\"repository\": {\n\t\t\"url\": \"https://github.com/MIERUNE/svelte-maplibre-gl\"\n\t},\n\t\"homepage\": \"https://svelte-maplibre-gl.mierune.dev/\",\n\t\"keywords\": [\n\t\t\"map\",\n\t\t\"svelte\",\n\t\t\"maplibre\",\n\t\t\"maplibre-gl\",\n\t\t\"pmtiles\"\n\t],\n\t\"scripts\": {\n\t\t\"build\": \"vite build && npm run prepack\",\n\t\t\"preview\": \"vite preview\",\n\t\t\"prepare\": \"svelte-kit sync || echo ''\",\n\t\t\"prepack\": \"svelte-kit sync && svelte-package && publint\",\n\t\t\"check\": \"svelte-kit sync && svelte-check --tsconfig ./tsconfig.json\",\n\t\t\"check:watch\": \"svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch\",\n\t\t\"lint\": \"prettier --check .\"\n\t},\n\t\"files\": [\n\t\t\"dist\",\n\t\t\"!dist/**/*.test.*\",\n\t\t\"!dist/**/*.spec.*\"\n\t],\n\t\"sideEffects\": false,\n\t\"svelte\": \"./dist/index.js\",\n\t\"types\": \"./dist/index.d.ts\",\n\t\"type\": \"module\",\n\t\"exports\": {\n\t\t\".\": {\n\t\t\t\"types\": \"./dist/index.d.ts\",\n\t\t\t\"svelte\": \"./dist/index.js\"\n\t\t}\n\t},\n\t\"peerDependencies\": {\n\t\t\"pmtiles\": \"^4.0.0\",\n\t\t\"maplibre-gl\": \"^5.0.0 || ^4.0.0\",\n\t\t\"svelte\": \">=5.0.0\",\n\t\t\"svelte-maplibre-gl\": \"workspace:*\"\n\t},\n\t\"devDependencies\": {\n\t\t\"@sveltejs/kit\": \"catalog:\",\n\t\t\"@sveltejs/package\": \"catalog:\",\n\t\t\"@sveltejs/vite-plugin-svelte\": \"catalog:\",\n\t\t\"maplibre-gl\": \"catalog:\",\n\t\t\"pmtiles\": \"catalog:\",\n\t\t\"publint\": \"catalog:\",\n\t\t\"svelte\": \"catalog:\",\n\t\t\"svelte-check\": \"catalog:\",\n\t\t\"svelte-maplibre-gl\": \"workspace:*\",\n\t\t\"typescript\": \"catalog:\",\n\t\t\"vite\": \"catalog:\"\n\t}\n}\n"
  },
  {
    "path": "extensions/pmtiles/src/app.d.ts",
    "content": "// See https://svelte.dev/docs/kit/types#app.d.ts\n// for information about these interfaces\ndeclare global {\n\tnamespace App {\n\t\t// interface Error {}\n\t\t// interface Locals {}\n\t\t// interface PageData {}\n\t\t// interface PageState {}\n\t\t// interface Platform {}\n\t}\n}\n\nexport {};\n"
  },
  {
    "path": "extensions/pmtiles/src/app.html",
    "content": "<!doctype html>\n<html lang=\"en\">\n\t<head>\n\t\t<meta charset=\"utf-8\" />\n\t\t<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\" />\n\t\t%sveltekit.head%\n\t</head>\n\t<body data-sveltekit-preload-data=\"hover\">\n\t\t<div style=\"display: contents\">%sveltekit.body%</div>\n\t</body>\n</html>\n"
  },
  {
    "path": "extensions/pmtiles/src/lib/PMTilesProtocol.svelte",
    "content": "<script lang=\"ts\">\n\timport { Protocol as MapLibreProtocol } from 'svelte-maplibre-gl';\n\timport { Protocol, type PMTiles } from 'pmtiles';\n\n\tlet {\n\t\tscheme = 'pmtiles',\n\t\tmetadata = false,\n\t\terrorOnMissingTile = false,\n\t\tpmtiles\n\t}: {\n\t\t/** URL scheme for the PMTilesProtocol */\n\t\tscheme?: string;\n\t\t/** Also load the metadata section of the PMTiles. required for some \"inspect\" functionality\n\t\t * and to automatically populate the map attribution. Requires an extra HTTP request.\n\t\t */\n\t\tmetadata?: boolean;\n\t\t/** When a vector MVT tile is missing from the archive, raise an error instead of\n\t\t * returning the empty array. Not recommended. This is only to reproduce the behavior of ZXY tile APIs\n\t\t * which some applications depend on when overzooming. */\n\t\terrorOnMissingTile?: boolean;\n\t\t/** Array of PMTiles instances */\n\t\tpmtiles?: PMTiles[];\n\t} = $props();\n\n\tconst protocol = new Protocol({ metadata, errorOnMissingTile });\n\n\t$effect(() => {\n\t\tprotocol.metadata = metadata;\n\t});\n\n\t$effect(() => {\n\t\tprotocol.errorOnMissingTile = errorOnMissingTile;\n\t});\n\n\t$effect(() => {\n\t\tif (pmtiles) {\n\t\t\tfor (const p of pmtiles) {\n\t\t\t\tprotocol.add(p);\n\t\t\t}\n\t\t}\n\t});\n</script>\n\n<MapLibreProtocol {scheme} loadFn={protocol.tile} />\n"
  },
  {
    "path": "extensions/pmtiles/src/lib/index.ts",
    "content": "export { default as PMTilesProtocol } from './PMTilesProtocol.svelte';\n"
  },
  {
    "path": "extensions/pmtiles/svelte.config.js",
    "content": "import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';\n\n/** @type {import('@sveltejs/kit').Config} */\nconst config = {\n\t// Consult https://svelte.dev/docs/kit/integrations\n\t// for more information about preprocessors\n\tpreprocess: vitePreprocess(),\n\n\tkit: {\n\t\t// Since this is a library package, we don't need an adapter\n\t\tadapter: undefined\n\t}\n};\n\nexport default config;\n"
  },
  {
    "path": "extensions/pmtiles/tsconfig.json",
    "content": "{\n\t\"extends\": \"./.svelte-kit/tsconfig.json\",\n\t\"compilerOptions\": {\n\t\t\"allowJs\": true,\n\t\t\"checkJs\": true,\n\t\t\"esModuleInterop\": true,\n\t\t\"forceConsistentCasingInFileNames\": true,\n\t\t\"resolveJsonModule\": true,\n\t\t\"skipLibCheck\": true,\n\t\t\"sourceMap\": true,\n\t\t\"strict\": true,\n\t\t\"moduleResolution\": \"bundler\",\n\t\t\"module\": \"ESNext\",\n\t\t\"target\": \"ES2020\",\n\t\t\"lib\": [\"ES2020\", \"DOM\", \"DOM.Iterable\"],\n\t\t\"types\": [\"svelte\"]\n\t},\n\t\"include\": [\"src/**/*.ts\", \"src/**/*.js\", \"src/**/*.svelte\"],\n\t\"exclude\": [\"node_modules\", \"dist\"]\n}\n"
  },
  {
    "path": "extensions/pmtiles/vite.config.ts",
    "content": "import { defineConfig } from 'vite';\nimport { svelte } from '@sveltejs/vite-plugin-svelte';\n\nexport default defineConfig({\n\tplugins: [svelte()],\n\n\tbuild: {\n\t\tlib: {\n\t\t\tentry: './src/lib/index.ts',\n\t\t\tname: 'SvelteMaplibrePMTiles',\n\t\t\tfileName: 'index'\n\t\t},\n\t\trollupOptions: {\n\t\t\texternal: ['svelte', 'maplibre-gl', 'pmtiles', 'svelte-maplibre-gl'],\n\t\t\toutput: {\n\t\t\t\tglobals: {\n\t\t\t\t\tsvelte: 'Svelte',\n\t\t\t\t\t'maplibre-gl': 'maplibregl',\n\t\t\t\t\tpmtiles: 'pmtiles',\n\t\t\t\t\t'svelte-maplibre-gl': 'SvelteMaplibreGL'\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n});\n"
  },
  {
    "path": "extensions/terradraw/CHANGELOG.md",
    "content": "# @svelte-maplibre-gl/terradraw\n\n## 1.0.3\n\n### Patch Changes\n\n- Updated dependencies [6b3cd54]\n  - svelte-maplibre-gl@1.0.3\n\n## 1.0.2\n\n### Patch Changes\n\n- Updated dependencies [608c2b5]\n  - svelte-maplibre-gl@1.0.2\n\n## 1.0.1\n\n### Patch Changes\n\n- Updated dependencies [a5cc3ef]\n  - svelte-maplibre-gl@1.0.1\n"
  },
  {
    "path": "extensions/terradraw/package.json",
    "content": "{\n\t\"name\": \"@svelte-maplibre-gl/terradraw\",\n\t\"version\": \"1.0.3\",\n\t\"license\": \"(MIT OR Apache-2.0)\",\n\t\"description\": \"TerraDraw extension for svelte-maplibre-gl\",\n\t\"repository\": {\n\t\t\"url\": \"https://github.com/MIERUNE/svelte-maplibre-gl\"\n\t},\n\t\"homepage\": \"https://svelte-maplibre-gl.mierune.dev/\",\n\t\"keywords\": [\n\t\t\"map\",\n\t\t\"svelte\",\n\t\t\"maplibre\",\n\t\t\"maplibre-gl\",\n\t\t\"terradraw\"\n\t],\n\t\"scripts\": {\n\t\t\"build\": \"vite build && npm run prepack\",\n\t\t\"preview\": \"vite preview\",\n\t\t\"prepare\": \"svelte-kit sync || echo ''\",\n\t\t\"prepack\": \"svelte-kit sync && svelte-package && publint\",\n\t\t\"check\": \"svelte-kit sync && svelte-check --tsconfig ./tsconfig.json\",\n\t\t\"check:watch\": \"svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch\",\n\t\t\"lint\": \"prettier --check .\"\n\t},\n\t\"files\": [\n\t\t\"dist\",\n\t\t\"!dist/**/*.test.*\",\n\t\t\"!dist/**/*.spec.*\"\n\t],\n\t\"sideEffects\": false,\n\t\"svelte\": \"./dist/index.js\",\n\t\"types\": \"./dist/index.d.ts\",\n\t\"type\": \"module\",\n\t\"exports\": {\n\t\t\".\": {\n\t\t\t\"types\": \"./dist/index.d.ts\",\n\t\t\t\"svelte\": \"./dist/index.js\"\n\t\t}\n\t},\n\t\"peerDependencies\": {\n\t\t\"terra-draw\": \"^1.0.0\",\n\t\t\"terra-draw-maplibre-gl-adapter\": \"^1.0.3\",\n\t\t\"maplibre-gl\": \"^5.0.0 || ^4.0.0\",\n\t\t\"svelte\": \">=5.0.0\",\n\t\t\"svelte-maplibre-gl\": \"workspace:*\"\n\t},\n\t\"devDependencies\": {\n\t\t\"@sveltejs/kit\": \"catalog:\",\n\t\t\"@sveltejs/package\": \"catalog:\",\n\t\t\"@sveltejs/vite-plugin-svelte\": \"catalog:\",\n\t\t\"maplibre-gl\": \"catalog:\",\n\t\t\"publint\": \"catalog:\",\n\t\t\"svelte\": \"catalog:\",\n\t\t\"svelte-check\": \"catalog:\",\n\t\t\"svelte-maplibre-gl\": \"workspace:*\",\n\t\t\"terra-draw\": \"catalog:\",\n\t\t\"terra-draw-maplibre-gl-adapter\": \"catalog:\",\n\t\t\"typescript\": \"catalog:\",\n\t\t\"vite\": \"catalog:\"\n\t}\n}\n"
  },
  {
    "path": "extensions/terradraw/src/app.d.ts",
    "content": "// See https://svelte.dev/docs/kit/types#app.d.ts\n// for information about these interfaces\ndeclare global {\n\tnamespace App {\n\t\t// interface Error {}\n\t\t// interface Locals {}\n\t\t// interface PageData {}\n\t\t// interface PageState {}\n\t\t// interface Platform {}\n\t}\n}\n\nexport {};\n"
  },
  {
    "path": "extensions/terradraw/src/app.html",
    "content": "<!doctype html>\n<html lang=\"en\">\n\t<head>\n\t\t<meta charset=\"utf-8\" />\n\t\t<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\" />\n\t\t%sveltekit.head%\n\t</head>\n\t<body data-sveltekit-preload-data=\"hover\">\n\t\t<div style=\"display: contents\">%sveltekit.body%</div>\n\t</body>\n</html>\n"
  },
  {
    "path": "extensions/terradraw/src/lib/TerraDraw.svelte",
    "content": "<script lang=\"ts\">\n\timport { TerraDraw as Draw } from 'terra-draw';\n\timport type { IdStrategy, TerraDrawEventListeners } from 'terra-draw';\n\timport { TerraDrawMapLibreGLAdapter } from 'terra-draw-maplibre-gl-adapter';\n\timport { getMapContext } from 'svelte-maplibre-gl';\n\n\ttype FeatureId = string | number;\n\n\tconst mapCtx = getMapContext();\n\n\tlet {\n\t\tmode,\n\t\tmodes,\n\t\ttracked,\n\t\tidStrategy,\n\t\tdraw = $bindable(),\n\t\tonfinish,\n\t\tonchange,\n\t\tonready,\n\t\tonselect,\n\t\tondeselect\n\t}: {\n\t\tmode: string;\n\t\tmodes: ConstructorParameters<typeof Draw>[0]['modes'];\n\t\tidStrategy?: IdStrategy<FeatureId>;\n\t\ttracked?: boolean;\n\t\t/** Terra Draw instance */\n\t\tdraw?: Draw;\n\t\tonchange?: TerraDrawEventListeners['change'];\n\t\tonfinish?: TerraDrawEventListeners['finish'];\n\t\tonready?: TerraDrawEventListeners['ready'];\n\t\tonselect?: TerraDrawEventListeners['select'];\n\t\tondeselect?: TerraDrawEventListeners['deselect'];\n\t} = $props();\n\n\tmapCtx.waitForStyleLoaded((map) => {\n\t\tdraw = new Draw({\n\t\t\tadapter: new TerraDrawMapLibreGLAdapter({ map }),\n\t\t\tmodes,\n\t\t\tidStrategy,\n\t\t\ttracked\n\t\t});\n\t});\n\n\t$effect(() => {\n\t\tdraw?.start();\n\t\treturn () => draw?.stop();\n\t});\n\t$effect(() => {\n\t\tdraw?.setMode(mode);\n\t});\n\n\t// Event listeners\n\t$effect(() => {\n\t\tif (!onready) return;\n\t\tdraw?.on('ready', onready);\n\t\treturn () => draw?.off('ready', onready);\n\t});\n\t$effect(() => {\n\t\tif (!onfinish) return;\n\t\tdraw?.on('finish', onfinish);\n\t\treturn () => draw?.off('finish', onfinish);\n\t});\n\t$effect(() => {\n\t\tif (!onchange) return;\n\t\tdraw?.on('change', onchange);\n\t\treturn () => draw?.off('change', onchange);\n\t});\n\t$effect(() => {\n\t\tif (!onselect) return;\n\t\tdraw?.on('select', onselect);\n\t\treturn () => draw?.off('select', onselect);\n\t});\n\t$effect(() => {\n\t\tif (!ondeselect) return;\n\t\tdraw?.on('deselect', ondeselect);\n\t\treturn () => draw?.off('deselect', ondeselect);\n\t});\n</script>\n"
  },
  {
    "path": "extensions/terradraw/src/lib/index.ts",
    "content": "export { default as TerraDraw } from './TerraDraw.svelte';\n"
  },
  {
    "path": "extensions/terradraw/svelte.config.js",
    "content": "import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';\n\n/** @type {import('@sveltejs/kit').Config} */\nconst config = {\n\t// Consult https://svelte.dev/docs/kit/integrations\n\t// for more information about preprocessors\n\tpreprocess: vitePreprocess(),\n\n\tkit: {\n\t\t// Since this is a library package, we don't need an adapter\n\t\tadapter: undefined\n\t}\n};\n\nexport default config;\n"
  },
  {
    "path": "extensions/terradraw/tsconfig.json",
    "content": "{\n\t\"extends\": \"./.svelte-kit/tsconfig.json\",\n\t\"compilerOptions\": {\n\t\t\"allowJs\": true,\n\t\t\"checkJs\": true,\n\t\t\"esModuleInterop\": true,\n\t\t\"forceConsistentCasingInFileNames\": true,\n\t\t\"resolveJsonModule\": true,\n\t\t\"skipLibCheck\": true,\n\t\t\"sourceMap\": true,\n\t\t\"strict\": true,\n\t\t\"moduleResolution\": \"bundler\",\n\t\t\"module\": \"ESNext\",\n\t\t\"target\": \"ES2020\",\n\t\t\"lib\": [\"ES2020\", \"DOM\", \"DOM.Iterable\"],\n\t\t\"types\": [\"svelte\"]\n\t},\n\t\"include\": [\"src/**/*.ts\", \"src/**/*.js\", \"src/**/*.svelte\"],\n\t\"exclude\": [\"node_modules\", \"dist\"]\n}\n"
  },
  {
    "path": "extensions/terradraw/vite.config.ts",
    "content": "import { defineConfig } from 'vite';\nimport { svelte } from '@sveltejs/vite-plugin-svelte';\n\nexport default defineConfig({\n\tplugins: [svelte()],\n\n\tbuild: {\n\t\tlib: {\n\t\t\tentry: './src/lib/index.ts',\n\t\t\tname: 'SvelteMaplibreTerraDraw',\n\t\t\tfileName: 'index'\n\t\t},\n\t\trollupOptions: {\n\t\t\texternal: ['svelte', 'maplibre-gl', 'terra-draw', 'terra-draw-maplibre-gl-adapter', 'svelte-maplibre-gl'],\n\t\t\toutput: {\n\t\t\t\tglobals: {\n\t\t\t\t\tsvelte: 'Svelte',\n\t\t\t\t\t'maplibre-gl': 'maplibregl',\n\t\t\t\t\t'terra-draw': 'TerraDraw',\n\t\t\t\t\t'terra-draw-maplibre-gl-adapter': 'TerraDrawMapLibreGLAdapter',\n\t\t\t\t\t'svelte-maplibre-gl': 'SvelteMaplibreGL'\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n});\n"
  },
  {
    "path": "package.json",
    "content": "{\n\t\"name\": \"@svelte-maplibre-gl/docs\",\n\t\"version\": \"1.0.0\",\n\t\"private\": true,\n\t\"type\": \"module\",\n\t\"license\": \"(MIT OR Apache-2.0)\",\n\t\"description\": \"Documentation site for svelte-maplibre-gl\",\n\t\"repository\": {\n\t\t\"url\": \"https://github.com/MIERUNE/svelte-maplibre-gl\"\n\t},\n\t\"homepage\": \"https://svelte-maplibre-gl.mierune.dev/\",\n\t\"scripts\": {\n\t\t\"dev\": \"vite dev\",\n\t\t\"build\": \"vite build\",\n\t\t\"build:all\": \"turbo run build\",\n\t\t\"build:packages\": \"turbo run build --filter='./svelte-maplibre-gl' --filter='./extensions/*'\",\n\t\t\"preview\": \"turbo run preview\",\n\t\t\"check\": \"svelte-kit sync && svelte-check --tsconfig ./tsconfig.json\",\n\t\t\"check:all\": \"turbo run check\",\n\t\t\"check:watch\": \"turbo run check:watch --filter='./svelte-maplibre-gl' --filter='./extensions/*'\",\n\t\t\"format\": \"prettier --write .\",\n\t\t\"lint\": \"prettier --check . && eslint .\",\n\t\t\"test:unit\": \"vitest\",\n\t\t\"test\": \"npm run test:unit -- --run && npm run test:e2e\",\n\t\t\"test:e2e\": \"playwright test\",\n\t\t\"changeset\": \"changeset\",\n\t\t\"version\": \"changeset version\",\n\t\t\"release\": \"pnpm build:packages && changeset publish\"\n\t},\n\t\"dependencies\": {\n\t\t\"@changesets/changelog-github\": \"^0.5.2\",\n\t\t\"@svelte-maplibre-gl/contour\": \"workspace:*\",\n\t\t\"@svelte-maplibre-gl/deckgl\": \"workspace:*\",\n\t\t\"@svelte-maplibre-gl/pmtiles\": \"workspace:*\",\n\t\t\"@svelte-maplibre-gl/terradraw\": \"workspace:*\",\n\t\t\"svelte-maplibre-gl\": \"workspace:*\"\n\t},\n\t\"devDependencies\": {\n\t\t\"@changesets/cli\": \"^2.29.8\",\n\t\t\"@deck.gl/core\": \"catalog:\",\n\t\t\"@deck.gl/layers\": \"catalog:\",\n\t\t\"@deck.gl/mapbox\": \"catalog:\",\n\t\t\"@docsearch/css\": \"^3.9.0\",\n\t\t\"@docsearch/js\": \"^3.9.0\",\n\t\t\"@eslint/js\": \"^9.39.2\",\n\t\t\"@internationalized/date\": \"^3.10.1\",\n\t\t\"@lucide/svelte\": \"^0.541.0\",\n\t\t\"@playwright/test\": \"^1.58.0\",\n\t\t\"@sveltejs/adapter-cloudflare\": \"^7.2.6\",\n\t\t\"@sveltejs/kit\": \"catalog:\",\n\t\t\"@sveltejs/package\": \"catalog:\",\n\t\t\"@sveltejs/vite-plugin-svelte\": \"catalog:\",\n\t\t\"@tailwindcss/typography\": \"^0.5.19\",\n\t\t\"@tailwindcss/vite\": \"^4.1.18\",\n\t\t\"@types/eslint\": \"^9.6.1\",\n\t\t\"@types/geojson\": \"catalog:\",\n\t\t\"@types/three\": \"^0.179.0\",\n\t\t\"bits-ui\": \"^2.15.4\",\n\t\t\"clsx\": \"^2.1.1\",\n\t\t\"eslint\": \"^9.39.2\",\n\t\t\"eslint-config-prettier\": \"^10.1.8\",\n\t\t\"eslint-plugin-svelte\": \"^3.14.0\",\n\t\t\"fast-png\": \"^7.0.1\",\n\t\t\"globals\": \"^17.2.0\",\n\t\t\"install\": \"^0.13.0\",\n\t\t\"maplibre-contour\": \"catalog:\",\n\t\t\"maplibre-gl\": \"catalog:\",\n\t\t\"mdsvex\": \"^0.12.6\",\n\t\t\"mode-watcher\": \"^1.1.0\",\n\t\t\"pathe\": \"^2.0.3\",\n\t\t\"pkg-pr-new\": \"^0.0.57\",\n\t\t\"pmtiles\": \"catalog:\",\n\t\t\"prettier\": \"^3.8.1\",\n\t\t\"prettier-plugin-svelte\": \"^3.4.1\",\n\t\t\"prettier-plugin-tailwindcss\": \"^0.6.14\",\n\t\t\"publint\": \"catalog:\",\n\t\t\"shiki\": \"^3.21.0\",\n\t\t\"superjson\": \"^2.2.6\",\n\t\t\"svelte\": \"catalog:\",\n\t\t\"svelte-check\": \"catalog:\",\n\t\t\"svelte2tsx\": \"0.7.34\",\n\t\t\"tailwind-merge\": \"^3.4.0\",\n\t\t\"tailwind-variants\": \"^3.2.2\",\n\t\t\"tailwindcss\": \"^4.1.18\",\n\t\t\"tailwindcss-animate\": \"^1.0.7\",\n\t\t\"terra-draw\": \"catalog:\",\n\t\t\"terra-draw-maplibre-gl-adapter\": \"catalog:\",\n\t\t\"three\": \"^0.179.1\",\n\t\t\"turbo\": \"^2.7.6\",\n\t\t\"typescript\": \"catalog:\",\n\t\t\"typescript-eslint\": \"^8.54.0\",\n\t\t\"vite\": \"catalog:\",\n\t\t\"vitest\": \"^3.2.4\"\n\t},\n\t\"packageManager\": \"pnpm@10.15.0\"\n}\n"
  },
  {
    "path": "playwright.config.ts",
    "content": "import { defineConfig } from '@playwright/test';\n\nexport default defineConfig({\n\twebServer: {\n\t\tcommand: 'npm run build && npm run preview',\n\t\tport: 4173\n\t},\n\n\ttestDir: 'e2e'\n});\n"
  },
  {
    "path": "pnpm-workspace.yaml",
    "content": "packages:\n  - svelte-maplibre-gl\n  - extensions/*\n  - .\n\ncatalog:\n  '@deck.gl/core': ^9.2.6\n  '@deck.gl/layers': ^9.2.6\n  '@deck.gl/mapbox': ^9.2.6\n  '@sveltejs/kit': ^2.50.1\n  '@sveltejs/package': ^2.5.7\n  '@sveltejs/vite-plugin-svelte': ^6.2.4\n  '@types/geojson': ^7946.0.16\n  maplibre-contour: ^0.1.0\n  maplibre-gl: 5.17.0\n  pmtiles: ^4.3.2\n  publint: ^0.3.17\n  svelte: ^5.48.5\n  svelte-check: ^4.3.5\n  terra-draw: ^1.23.1\n  terra-draw-maplibre-gl-adapter: ^1.2.3\n  typescript: ^5.9.3\n  vite: ^7.3.1\n\nonlyBuiltDependencies:\n  - esbuild\n  - sharp\n  - workerd\n"
  },
  {
    "path": "src/app.css",
    "content": "@import 'tailwindcss';\n\n@custom-variant dark (&:where(.dark, .dark *));\n\n@config '../tailwind.config.ts';\n\n/*\n  The default border color has changed to `currentColor` in Tailwind CSS v4,\n  so we've added these compatibility styles to make sure everything still\n  looks the same as it did with Tailwind CSS v3.\n\n  If we ever want to remove these styles, we need to add an explicit border\n  color utility to any element that depends on these defaults.\n*/\n@layer base {\n\t*,\n\t::after,\n\t::before,\n\t::backdrop,\n\t::file-selector-button {\n\t\tborder-color: var(--color-gray-200, currentColor);\n\t}\n}\n\n@layer base {\n\t:root {\n\t\t--background: 0 0% 100%;\n\t\t--foreground: 222.2 84% 4.9%;\n\t\t--card: 0 0% 100%;\n\t\t--card-foreground: 222.2 84% 4.9%;\n\t\t--popover: 0 0% 100%;\n\t\t--popover-foreground: 222.2 84% 4.9%;\n\t\t--primary: 222.2 47.4% 11.2%;\n\t\t--primary-foreground: 210 40% 98%;\n\t\t--secondary: 210 40% 96.1%;\n\t\t--secondary-foreground: 222.2 47.4% 11.2%;\n\t\t--muted: 210 40% 96.1%;\n\t\t--muted-foreground: 215.4 16.3% 46.9%;\n\t\t--accent: 210 40% 96.1%;\n\t\t--accent-foreground: 222.2 47.4% 11.2%;\n\t\t--destructive: 0 72.22% 50.59%;\n\t\t--destructive-foreground: 210 40% 98%;\n\t\t--border: 214.3 31.8% 91.4%;\n\t\t--input: 214.3 31.8% 91.4%;\n\t\t--ring: 222.2 84% 4.9%;\n\t\t--radius: 0.5rem;\n\t}\n\t.dark {\n\t\t--background: 222.2 84% 4.9%;\n\t\t--foreground: 210 40% 98%;\n\t\t--card: 222.2 84% 4.9%;\n\t\t--card-foreground: 210 40% 98%;\n\t\t--popover: 222.2 84% 4.9%;\n\t\t--popover-foreground: 210 40% 98%;\n\t\t--primary: 210 40% 98%;\n\t\t--primary-foreground: 222.2 47.4% 11.2%;\n\t\t--secondary: 217.2 32.6% 17.5%;\n\t\t--secondary-foreground: 210 40% 98%;\n\t\t--muted: 217.2 32.6% 17.5%;\n\t\t--muted-foreground: 215 20.2% 65.1%;\n\t\t--accent: 217.2 32.6% 17.5%;\n\t\t--accent-foreground: 210 40% 98%;\n\t\t--destructive: 0 62.8% 30.6%;\n\t\t--destructive-foreground: 210 40% 98%;\n\t\t--border: 217.2 32.6% 17.5%;\n\t\t--input: 217.2 32.6% 17.5%;\n\t\t--ring: 212.7 26.8% 83.9%;\n\t}\n\n\t:root {\n\t\t--docsearch-primary-color: #0e58c0;\n\t\t--docsearch-text-color: rgb(28, 30, 33);\n\t\t--docsearch-spacing: 12px;\n\t\t--docsearch-icon-stroke-width: 1.4;\n\t\t--docsearch-highlight-color: var(--docsearch-primary-color);\n\t\t--docsearch-muted-color: #666;\n\t\t--docsearch-container-background: rgba(101, 108, 133, 0.8);\n\t\t--docsearch-logo-color: rgba(84, 104, 255);\n\n\t\t/* modal */\n\t\t--docsearch-modal-width: 560px;\n\t\t--docsearch-modal-height: 600px;\n\t\t--docsearch-modal-background: rgb(245, 246, 247);\n\t\t--docsearch-modal-shadow: inset 1px 1px 0 0 rgba(255, 255, 255, 0.5), 0 3px 8px 0 rgba(85, 90, 100, 1);\n\n\t\t/* searchbox */\n\t\t--docsearch-searchbox-height: 56px;\n\t\t--docsearch-searchbox-background: transparent;\n\t\t--docsearch-searchbox-focus-background: #fff;\n\t\t--docsearch-searchbox-shadow: inset 0 0 0 2px var(--docsearch-primary-color);\n\n\t\t/* hit */\n\t\t--docsearch-hit-height: 56px;\n\t\t--docsearch-hit-color: rgb(68, 73, 80);\n\t\t--docsearch-hit-active-color: #fff;\n\t\t--docsearch-hit-background: #fff;\n\t\t--docsearch-hit-shadow: 0 1px 3px 0 rgb(212, 217, 225);\n\n\t\t/* key */\n\t\t--docsearch-key-gradient: linear-gradient(-225deg, rgb(213, 219, 228) 0%, rgb(248, 248, 248) 100%);\n\t\t--docsearch-key-shadow:\n\t\t\tinset 0 -2px 0 0 rgb(205, 205, 230), inset 0 0 1px 1px #fff, 0 1px 2px 1px rgba(30, 35, 90, 0.4);\n\t\t--docsearch-key-pressed-shadow: inset 0 -2px 0 0 #cdcde6, inset 0 0 1px 1px #fff, 0 1px 1px 0 rgba(30, 35, 90, 0.4);\n\n\t\t/* footer */\n\t\t--docsearch-footer-height: 44px;\n\t\t--docsearch-footer-background: #fff;\n\t\t--docsearch-footer-shadow: 0 -1px 0 0 rgb(224, 227, 232), 0 -3px 6px 0 rgba(69, 98, 155, 0.12);\n\t}\n\n\t/* Darkmode */\n\thtml.dark {\n\t\t--docsearch-text-color: rgb(245, 246, 247);\n\t\t--docsearch-container-background: rgba(9, 10, 17, 0.8);\n\t\t--docsearch-modal-background: #151e2a;\n\t\t--docsearch-modal-shadow: inset 1px 1px 0 0 rgb(44, 46, 64), 0 3px 8px 0 rgb(0, 3, 9);\n\t\t--docsearch-searchbox-background: #000;\n\t\t--docsearch-searchbox-focus-background: #000;\n\t\t--docsearch-hit-color: rgb(190, 195, 201);\n\t\t--docsearch-hit-shadow: none;\n\t\t--docsearch-hit-background: rgb(9, 10, 17);\n\t\t--docsearch-key-gradient: linear-gradient(-26.5deg, #566272 0%, #31425b 100%);\n\t\t--docsearch-key-shadow:\n\t\t\tinset 0 -2px 0 0 rgb(40, 56, 85), inset 0 0 1px 1px rgb(81, 93, 125), 0 2px 2px 0 rgba(3, 5, 9, 0.3);\n\t\t--docsearch-key-pressed-shadow: inset 0 -2px 0 0 #283b55, inset 0 0 1px 1px #51617d, 0 1px 1px 0 #0305094d;\n\t\t--docsearch-footer-background: #1f2936;\n\t\t--docsearch-footer-shadow: inset 0 1px 0 0 rgba(73, 86, 106, 0.5), 0 -4px 8px 0 rgba(0, 0, 0, 0.2);\n\t\t--docsearch-logo-color: rgb(255, 255, 255);\n\t\t--docsearch-muted-color: #aaa;\n\t}\n}\n\n@layer base {\n\t* {\n\t\t@apply border-border;\n\t}\n\tbody {\n\t\t@apply bg-background text-foreground;\n\t}\n}\n"
  },
  {
    "path": "src/app.d.ts",
    "content": "// See https://svelte.dev/docs/kit/types#app.d.ts\n// for information about these interfaces\ndeclare global {\n\tnamespace App {\n\t\t// interface Error {}\n\t\t// interface Locals {}\n\t\t// interface PageData {}\n\t\t// interface PageState {}\n\t\t// interface Platform {}\n\t}\n}\n\nexport {};\n"
  },
  {
    "path": "src/app.html",
    "content": "<!doctype html>\n<html lang=\"en\">\n\t<head>\n\t\t<meta charset=\"utf-8\" />\n\t\t<link rel=\"icon\" type=\"image/png\" href=\"%sveltekit.assets%/favicon.png\" />\n\t\t<meta name=\"viewport\" content=\"width=device-width, initial-scale=1, viewport-fit=cover\" />\n\t\t%sveltekit.head%\n\t\t<!-- Google tag (gtag.js) -->\n\t\t<script async src=\"https://www.googletagmanager.com/gtag/js?id=G-X35TWD4JKW\"></script>\n\t\t<script>\n\t\t\twindow.dataLayer = window.dataLayer || [];\n\t\t\tfunction gtag() {\n\t\t\t\tdataLayer.push(arguments);\n\t\t\t}\n\t\t\tgtag('js', new Date());\n\t\t\tgtag('config', 'G-X35TWD4JKW');\n\t\t</script>\n\t</head>\n\t<body data-sveltekit-preload-data=\"hover\" class=\"antialiased\">\n\t\t<div class=\"contents\">%sveltekit.body%</div>\n\t</body>\n</html>\n"
  },
  {
    "path": "src/content/CodeBlock.svelte",
    "content": "<script lang=\"ts\">\n\t// import { browser } from '$app/environment';\n\timport type { HighlighterCore } from 'shiki';\n\t// import svelte from 'shiki/langs/svelte.mjs';\n\t// import dark from 'shiki/themes/github-dark-default.mjs';\n\n\tlet {\n\t\tcontent,\n\t\tshiki\n\t}: {\n\t\tcontent: string;\n\t\tshiki: HighlighterCore;\n\t} = $props();\n\n\tconst _content = $derived.by(() => {\n\t\treturn content.replaceAll('\\t', '  ').trim();\n\t});\n</script>\n\n<div class=\"my-6\">\n\t<div class=\"line-numbers subpixel-antialiased\">\n\t\t<!-- eslint-disable-next-line svelte/no-at-html-tags -->\n\t\t{@html shiki.codeToHtml(_content, { lang: 'svelte', theme: 'github-dark-default' })}\n\t</div>\n\t<div class=\"-mt-3 text-right text-sm\">\n\t\tOur examples use <a href=\"https://tailwindcss.com/\">Tailwind CSS</a> and\n\t\t<a href=\"https://next.shadcn-svelte.com/\">shadcn-svelte</a>.\n\t</div>\n</div>\n\n<style>\n\t:global(.line-numbers .shiki code) {\n\t\tfont-size: 13px;\n\t\ttab-size: 2;\n\t\tcounter-reset: step;\n\t\tcounter-increment: step 0;\n\t}\n\n\t:global(.line-numbers .shiki code .line::before) {\n\t\tcontent: counter(step);\n\t\tcounter-increment: step;\n\t\twidth: 1em;\n\t\tmargin-right: 2em;\n\t\tdisplay: inline-block;\n\t\ttext-align: right;\n\t\tcolor: rgba(115, 131, 148, 0.5);\n\t}\n</style>\n"
  },
  {
    "path": "src/content/components/toc.ts",
    "content": "import type { Toc } from '$lib/components/types';\n\nexport const toc: Toc = [\n\t{\n\t\ttitle: 'Map',\n\t\titems: {\n\t\t\t'/docs/components/MapLibre': 'MapLibre',\n\t\t\t'/docs/components/Image': 'Image',\n\t\t\t'/docs/components/Light': 'Light',\n\t\t\t'/docs/components/Projection': 'Projection',\n\t\t\t'/docs/components/Sky': 'Sky',\n\t\t\t'/docs/components/Sprite': 'Sprite',\n\t\t\t'/docs/components/Terrain': 'Terrain'\n\t\t}\n\t},\n\t{\n\t\ttitle: 'Sources',\n\t\titems: {\n\t\t\t'/docs/components/CanvasSource': 'CanvasSource',\n\t\t\t'/docs/components/FeatureState': 'FeatureState',\n\t\t\t'/docs/components/GeoJSONSource': 'GeoJSONSource',\n\t\t\t'/docs/components/ImageSource': 'ImageSource',\n\t\t\t'/docs/components/RasterDEMTileSource': 'RasterDEMTileSource',\n\t\t\t'/docs/components/RasterTileSource': 'RasterTileSource',\n\t\t\t'/docs/components/RawSource': 'RawSource',\n\t\t\t'/docs/components/VectorTileSource': 'VectorTileSource',\n\t\t\t'/docs/components/VideoSource': 'VideoSource',\n\t\t\t'/docs/components/MapLibreContourSource': 'MapLibreContourSource (ext)'\n\t\t}\n\t},\n\t{\n\t\ttitle: 'Layers',\n\t\titems: {\n\t\t\t'/docs/components/BackgroundLayer': 'BackgroundLayer',\n\t\t\t'/docs/components/CircleLayer': 'CircleLayer',\n\t\t\t'/docs/components/ColorReliefLayer': 'ColorReliefLayer',\n\t\t\t'/docs/components/CustomLayer': 'CustomLayer',\n\t\t\t'/docs/components/FillExtrusionLayer': 'FillExtrusionLayer',\n\t\t\t'/docs/components/HeatmapLayer': 'HeatmapLayer',\n\t\t\t'/docs/components/HillshadeLayer': 'HillshadeLayer',\n\t\t\t'/docs/components/LineLayer': 'LineLayer',\n\t\t\t'/docs/components/RasterLayer': 'RasterLayer',\n\t\t\t'/docs/components/RawLayer': 'RawLayer',\n\t\t\t'/docs/components/SymbolLayer': 'SymbolLayer'\n\t\t}\n\t},\n\t{\n\t\ttitle: 'Global',\n\t\titems: {\n\t\t\t'/docs/components/Protocol': 'Protocol',\n\t\t\t'/docs/components/PMTilesProtocol': 'PMTilesProtocol (ext)'\n\t\t}\n\t},\n\t{\n\t\ttitle: 'Marker',\n\t\titems: {\n\t\t\t'/docs/components/Marker': 'Marker',\n\t\t\t'/docs/components/Popup': 'Popup'\n\t\t}\n\t},\n\t{\n\t\ttitle: 'Controls',\n\t\titems: {\n\t\t\t'/docs/components/AttributionControl': 'AttributionControl',\n\t\t\t'/docs/components/CustomControl': 'CustomControl',\n\t\t\t'/docs/components/FullScreenControl': 'FullScreenControl',\n\t\t\t'/docs/components/GeolocateControl': 'GeolocateControl',\n\t\t\t'/docs/components/GlobeControl': 'GlobeControl',\n\t\t\t'/docs/components/Hash': 'Hash',\n\t\t\t'/docs/components/LogoControl': 'LogoControl',\n\t\t\t'/docs/components/NavigationControl': 'NavigationControl',\n\t\t\t'/docs/components/ScaleControl': 'ScaleControl',\n\t\t\t'/docs/components/TerrainControl': 'TerrainControl',\n\t\t\t'/docs/components/DeckGLOverlay': 'DeckGLOverlay (ext)',\n\t\t\t'/docs/components/TerraDraw': 'TerraDraw (ext)'\n\t\t}\n\t},\n\t{\n\t\ttitle: 'Utilities',\n\t\titems: {\n\t\t\t'/docs/components/ImageLoader': 'ImageLoader',\n\t\t\t'/docs/components/QueryRenderedFeatures': 'QueryRenderedFeatures',\n\t\t\t'/docs/components/QuerySourceFeatures': 'QuerySourceFeatures'\n\t\t}\n\t}\n];\n"
  },
  {
    "path": "src/content/docs/quickstart/Marker.svelte",
    "content": "<script lang=\"ts\">\n\timport { MapLibre, Marker } from 'svelte-maplibre-gl';\n</script>\n\n<MapLibre\n\tzoom={5}\n\tcenter={[142, 43]}\n\tclass=\"h-[400px]\"\n\tstyle=\"https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json\"\n>\n\t<Marker lnglat={[141.692222, 42.775]} />\n</MapLibre>\n"
  },
  {
    "path": "src/content/docs/quickstart/Simplest.svelte",
    "content": "<script lang=\"ts\">\n\timport { MapLibre } from 'svelte-maplibre-gl';\n</script>\n\n<!-- Height must be set, otherwise the map size will be zero! -->\n<!-- Our examples use Tailwind CSS classes for styling. -->\n<MapLibre class=\"h-[400px]\" style=\"https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json\" />\n"
  },
  {
    "path": "src/content/docs/quickstart/content.svelte.md",
    "content": "---\ntitle: Quickstart\ndescription: Get started with svelte-maplibre-gl in just a few minutes.\n---\n\n<script lang=\"ts\">\n  import Simplest from \"./Simplest.svelte\";\n  import simplestRaw from \"./Simplest.svelte?raw\";\n  import Marker from \"./Marker.svelte\";\n  import markerRaw from \"./Marker.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n## 1. Launch a SvelteKit Project\n\nCreate a new SvelteKit project using the official [Svelte CLI](https://svelte.dev/docs/kit/creating-a-project).\n\n```bash\nnpx sv create myapp\n# Make sure to enable the Tailwind CSS add-on,\n# as our examples use it for styling.\n\ncd myapp\nnpm install\n```\n\n## 2. Install `svelte-maplibre-gl`\n\n```bash\nnpm install -D svelte-maplibre-gl\n```\n\n## 3. Add the Simplest Map\n\nNow you can add the simplest MapLibre GL JS map to your `+page.svelte` file with just one line of code.\n\n<CodeBlock content={simplestRaw} {shiki} />\n<Simplest />\n\n## 4. Put a Marker on the Map\n\nLet’s set an initial zoom and put a marker pin on the map.\n\n<CodeBlock content={markerRaw} {shiki} />\n<Marker />\n"
  },
  {
    "path": "src/content/docs/toc.ts",
    "content": "import type { Toc } from '$lib/components/types';\n\nexport const toc: Toc = [\n\t{\n\t\ttitle: 'Overview',\n\t\titems: {\n\t\t\t'/docs/quickstart': 'Quickstart'\n\t\t\t// '/docs/Concept': 'Concept',\n\t\t}\n\t}\n];\n"
  },
  {
    "path": "src/content/examples/3d-buildings/Buildings3D.svelte",
    "content": "<script lang=\"ts\">\n\timport { MapLibre, FillExtrusionLayer } from 'svelte-maplibre-gl';\n</script>\n\n<MapLibre\n\tclass=\"h-[55vh] min-h-[300px]\"\n\tstyle=\"https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json\"\n\tzoom={14.5}\n\tpitch={70}\n\tminZoom={14}\n\tbearing={0}\n\tcenter={[-74.01, 40.7075]}\n>\n\t<FillExtrusionLayer\n\t\tsource=\"carto\"\n\t\tsourceLayer=\"building\"\n\t\tminzoom={14}\n\t\tfilter={['!=', ['get', 'hide_3d'], true]}\n\t\tpaint={{\n\t\t\t'fill-extrusion-color': [\n\t\t\t\t'interpolate',\n\t\t\t\t['linear'],\n\t\t\t\t['get', 'render_height'],\n\t\t\t\t0,\n\t\t\t\t'#aaccbb',\n\t\t\t\t200,\n\t\t\t\t'royalblue',\n\t\t\t\t400,\n\t\t\t\t'purple'\n\t\t\t],\n\t\t\t'fill-extrusion-height': ['interpolate', ['linear'], ['zoom'], 14, 0, 15, ['get', 'render_height']],\n\t\t\t'fill-extrusion-base': ['case', ['>=', ['get', 'zoom'], 14], ['get', 'render_min_height'], 0]\n\t\t}}\n\t/>\n</MapLibre>\n"
  },
  {
    "path": "src/content/examples/3d-buildings/content.svelte.md",
    "content": "---\ntitle: 3D Buildings\ndescription: Use extrusions to display buildings' height in 3D.\noriginal: https://maplibre.org/maplibre-gl-js/docs/examples/3d-buildings/\n---\n\n<script lang=\"ts\">\n  import Demo from \"./Buildings3D.svelte\";\n  import demoRaw from \"./Buildings3D.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/3d-extrusion-floorplan/Floorplan.svelte",
    "content": "<script lang=\"ts\">\n\timport {\n\t\tMapLibre,\n\t\tRasterTileSource,\n\t\tBackgroundLayer,\n\t\tRasterLayer,\n\t\tGeoJSONSource,\n\t\tFillExtrusionLayer\n\t} from 'svelte-maplibre-gl';\n</script>\n\n<MapLibre class=\"h-[50vh] min-h-[300px]\" zoom={16.5} center={[-87.61694, 41.86625]} pitch={40} bearing={30}>\n\t<BackgroundLayer paint={{ 'background-color': '#e0dfdf' }} />\n\t<RasterTileSource tiles={['https://tile.openstreetmap.org/{z}/{x}/{y}.png']} tileSize={256} minzoom={0} maxzoom={19}>\n\t\t<RasterLayer />\n\t</RasterTileSource>\n\t<GeoJSONSource data=\"https://maplibre.org/maplibre-gl-js/docs/assets/indoor-3d-map.geojson\">\n\t\t<FillExtrusionLayer\n\t\t\tpaint={{\n\t\t\t\t// Get the fill-extrusion parameters from the source GeoJSON properties.\n\t\t\t\t//\n\t\t\t\t// See the MapLibre Style Specification for details on data expressions.\n\t\t\t\t// https://maplibre.org/maplibre-style-spec/expressions/\n\t\t\t\t'fill-extrusion-color': ['get', 'color'],\n\t\t\t\t'fill-extrusion-height': ['get', 'height'],\n\t\t\t\t'fill-extrusion-base': ['get', 'base_height'],\n\t\t\t\t'fill-extrusion-opacity': 0.5\n\t\t\t}}\n\t\t/>\n\t</GeoJSONSource>\n</MapLibre>\n"
  },
  {
    "path": "src/content/examples/3d-extrusion-floorplan/content.svelte.md",
    "content": "---\ntitle: 3D Floor Plan\ndescription: Create a 3D indoor map with the fill-extrude-height paint property.\noriginal: https://maplibre.org/maplibre-gl-js/docs/examples/3d-extrusion-floorplan/\n---\n\n<script lang=\"ts\">\n  import Demo from \"./Floorplan.svelte\";\n  import demoRaw from \"./Floorplan.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/animate-images/AnimateImages.svelte",
    "content": "<script lang=\"ts\">\n\timport { MapLibre, ImageSource, GlobeControl, RasterLayer } from 'svelte-maplibre-gl';\n\n\tconst FRAME_COUNT = 5;\n\tlet frame = $state(0);\n\n\t$effect(() => {\n\t\tfunction update() {\n\t\t\tframe = Math.round((performance.now() / 1000) * 5) % FRAME_COUNT;\n\t\t\trequestAnimationFrame(update);\n\t\t}\n\t\trequestAnimationFrame(update);\n\t});\n</script>\n\n<MapLibre\n\tclass=\"h-[55vh] min-h-[300px]\"\n\tstyle=\"https://basemaps.cartocdn.com/gl/dark-matter-gl-style/style.json\"\n\tzoom={5}\n\tcenter={[-76, 43]}\n>\n\t<GlobeControl />\n\t<ImageSource\n\t\turl={`https://maplibre.org/maplibre-gl-js/docs/assets/radar${frame}.gif`}\n\t\tcoordinates={[\n\t\t\t[-80.425, 46.437],\n\t\t\t[-71.516, 46.437],\n\t\t\t[-71.516, 37.936],\n\t\t\t[-80.425, 37.936]\n\t\t]}\n\t>\n\t\t<RasterLayer paint={{ 'raster-fade-duration': 0 }} />\n\t</ImageSource>\n</MapLibre>\n"
  },
  {
    "path": "src/content/examples/animate-images/content.svelte.md",
    "content": "---\ntitle: Animate a series of images\ndescription: Use a series of image sources to create an animation.\norignal: https://maplibre.org/maplibre-gl-js/docs/examples/animate-images/\n---\n\n<script lang=\"ts\">\n  import Demo from \"./AnimateImages.svelte\";\n  import demoRaw from \"./AnimateImages.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/basestyle/BaseStyle.svelte",
    "content": "<script lang=\"ts\">\n\timport {\n\t\tHillshadeLayer,\n\t\tLight,\n\t\tLineLayer,\n\t\tMapLibre,\n\t\tProjection,\n\t\tImageLoader,\n\t\tRasterDEMTileSource,\n\t\tSky,\n\t\tTerrain,\n\t\tGeoJSONSource,\n\t\tSymbolLayer,\n\t\tVectorTileSource\n\t} from 'svelte-maplibre-gl';\n\n\timport maplibregl from 'maplibre-gl';\n\timport { Label } from '$lib/components/ui/label/index.js';\n\timport * as RadioGroup from '$lib/components/ui/radio-group/index.js';\n\timport { Switch } from '$lib/components/ui/switch/index.js';\n\timport type { FeatureCollection } from 'geojson';\n\n\t// Base styles\n\tconst STYLES = new Map<string, string | maplibregl.StyleSpecification>([\n\t\t['Voyager', 'https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json'],\n\t\t['Positron', 'https://basemaps.cartocdn.com/gl/positron-gl-style/style.json'],\n\t\t['Dark Matter', 'https://basemaps.cartocdn.com/gl/dark-matter-gl-style/style.json'],\n\t\t['Demo Tiles', 'https://demotiles.maplibre.org/style.json']\n\t]);\n\tlet name = $state('Voyager');\n\tlet style = $derived(STYLES.get(name)!);\n\tlet globe = $state(true);\n\n\tlet data: FeatureCollection = {\n\t\ttype: 'FeatureCollection',\n\t\tfeatures: [\n\t\t\t{\n\t\t\t\ttype: 'Feature',\n\t\t\t\tgeometry: { type: 'Point', coordinates: [140, 30] },\n\t\t\t\tproperties: { imageName: 'osgeo', year: 2024 }\n\t\t\t}\n\t\t]\n\t};\n</script>\n\n<div class=\"mb-3 flex items-center justify-between\">\n\t<RadioGroup.Root bind:value={name} class=\"flex flex-row gap-x-3\">\n\t\t{#each STYLES as [name] (name)}\n\t\t\t<div class=\"flex items-center space-x-1\">\n\t\t\t\t<RadioGroup.Item value={name} id={name} />\n\t\t\t\t<Label class=\"cursor-pointer\" for={name}>{name}</Label>\n\t\t\t</div>\n\t\t{/each}\n\t</RadioGroup.Root>\n\n\t<div class=\"flex items-center space-x-2\">\n\t\t<Switch id=\"globe\" bind:checked={globe} />\n\t\t<Label for=\"globe\">Globe</Label>\n\t</div>\n</div>\n\n<MapLibre class=\"h-[55vh] min-h-75\" {style} zoom={4} maxPitch={80} center={{ lng: 137, lat: 36 }}>\n\t<!-- User-defined dynamic styles -->\n\t<Projection type={globe ? 'globe' : undefined} />\n\t<Light anchor=\"map\" />\n\t<Sky\n\t\tsky-color=\"#001560\"\n\t\thorizon-color=\"#0090c0\"\n\t\tfog-color=\"#ffffff\"\n\t\tsky-horizon-blend={0.9}\n\t\thorizon-fog-blend={0.7}\n\t\tfog-ground-blend={0.6}\n\t\tatmosphere-blend={['interpolate', ['linear'], ['zoom'], 1, 0.6, 3, 0.3, 5, 0]}\n\t/>\n\t<VectorTileSource\n\t\ttiles={['https://jma-assets.mierune.dev/tiles/mete/{z}/{x}/{y}.pbf']}\n\t\tminzoom={0}\n\t\tmaxzoom={13}\n\t\tattribution=\"<a href='https://www.data.jma.go.jp/developer/gis.html'>JMA</a>\"\n\t>\n\t\t<LineLayer\n\t\t\tsourceLayer=\"city\"\n\t\t\tlayout={{ 'line-join': 'round', 'line-cap': 'round' }}\n\t\t\tpaint={{ 'line-color': '#ff00ff', 'line-width': 1 }}\n\t\t/>\n\t</VectorTileSource>\n\t<RasterDEMTileSource url=\"https://tiles.mapterhorn.com/tilejson.json\">\n\t\t<HillshadeLayer paint={{ 'hillshade-exaggeration': 0.2 }} />\n\t</RasterDEMTileSource>\n\t{#if !globe}\n\t\t<RasterDEMTileSource url=\"https://tiles.mapterhorn.com/tilejson.json\">\n\t\t\t<Terrain />\n\t\t</RasterDEMTileSource>\n\t{/if}\n\t<ImageLoader\n\t\timages={{\n\t\t\tosgeo: 'https://maplibre.org/maplibre-gl-js/docs/assets/osgeo-logo.png'\n\t\t}}\n\t>\n\t\t<GeoJSONSource {data}>\n\t\t\t<!-- Children components will be added after all images have been loaded -->\n\t\t\t<SymbolLayer\n\t\t\t\tlayout={{\n\t\t\t\t\t'text-field': ['get', 'name'],\n\t\t\t\t\t'icon-image': ['get', 'imageName'],\n\t\t\t\t\t'icon-size': ['number', ['get', 'scale'], 1],\n\t\t\t\t\t'icon-text-fit': 'both',\n\t\t\t\t\t'icon-overlap': 'always',\n\t\t\t\t\t'text-overlap': 'always'\n\t\t\t\t}}\n\t\t\t/>\n\t\t</GeoJSONSource>\n\t</ImageLoader>\n</MapLibre>\n"
  },
  {
    "path": "src/content/examples/basestyle/content.svelte.md",
    "content": "---\ntitle: Change Base Style\ndescription: This library efficiently preserves dynamic user contents even when the base style changes.\n---\n\n<script lang=\"ts\">\n  import Demo from \"./BaseStyle.svelte\";\n  import demoRaw from \"./BaseStyle.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/canvas-source/Canvas.svelte",
    "content": "<script lang=\"ts\">\n\timport { MapLibre, CanvasSource, GlobeControl, RasterLayer } from 'svelte-maplibre-gl';\n\timport { Circle } from './Circle.js';\n\n\tlet canvas: HTMLCanvasElement | undefined = $state();\n\tlet ctx = $derived(canvas && canvas.getContext('2d')!);\n\tlet animate = $state(true);\n\n\tconst SIZE = 500;\n\tconst RADIUS = 15;\n\tconst circles: Circle[] = [];\n\tfor (let i = 0; i < 20; i++) {\n\t\tconst x = Math.random() * (SIZE - RADIUS * 2) + RADIUS;\n\t\tconst y = Math.random() * (SIZE - RADIUS * 2) + RADIUS;\n\t\tconst dx = (Math.random() - 0.5) * 2;\n\t\tconst dy = (Math.random() - 0.5) * 2;\n\t\tconst color = `#${(0x1000000 + Math.random() * 0xffffff).toString(16).substring(1, 7)}`;\n\t\tcircles.push(new Circle(x, y, dx, dy, RADIUS, color));\n\t}\n\n\tfunction frame() {\n\t\tif (ctx && animate) {\n\t\t\tctx.clearRect(0, 0, SIZE, SIZE);\n\t\t\tfor (const circle of circles) {\n\t\t\t\tcircle.update(ctx);\n\t\t\t}\n\t\t}\n\t\trequestAnimationFrame(frame);\n\t}\n\n\t$effect(() => {\n\t\trequestAnimationFrame(frame);\n\t});\n</script>\n\n<canvas bind:this={canvas} class=\"hidden\" width={SIZE} height={SIZE}>Canvas not supported</canvas>\n\n<MapLibre\n\tclass=\"h-[55vh] min-h-[300px]\"\n\tstyle=\"https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json\"\n\tzoom={2}\n\tcenter={{ lng: 135, lat: 35 }}\n\tonclick={() => (animate = !animate)}\n>\n\t<GlobeControl />\n\t<CanvasSource\n\t\t{canvas}\n\t\t{animate}\n\t\tcoordinates={[\n\t\t\t[110, 60],\n\t\t\t[160, 60],\n\t\t\t[160, 10],\n\t\t\t[110, 10]\n\t\t]}\n\t>\n\t\t<RasterLayer paint={{ 'raster-fade-duration': 0 }} />\n\t</CanvasSource>\n</MapLibre>\n"
  },
  {
    "path": "src/content/examples/canvas-source/Circle.ts",
    "content": "export class Circle {\n\tconstructor(\n\t\tpublic x: number,\n\t\tpublic y: number,\n\t\tpublic dx: number,\n\t\tpublic dy: number,\n\t\tpublic radius: number,\n\t\tpublic color: string\n\t) {}\n\n\tdraw(ctx: CanvasRenderingContext2D) {\n\t\tctx.beginPath();\n\t\tctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2, false);\n\t\tctx.strokeStyle = this.color;\n\t\tctx.stroke();\n\t}\n\n\tupdate(ctx: CanvasRenderingContext2D) {\n\t\tif (this.x + this.radius > ctx.canvas.width || this.x - this.radius < 0) {\n\t\t\tthis.dx = -this.dx;\n\t\t}\n\t\tif (this.y + this.radius > ctx.canvas.height || this.y - this.radius < 0) {\n\t\t\tthis.dy = -this.dy;\n\t\t}\n\t\tthis.x += this.dx;\n\t\tthis.y += this.dy;\n\n\t\tthis.draw(ctx);\n\t}\n}\n"
  },
  {
    "path": "src/content/examples/canvas-source/content.svelte.md",
    "content": "---\ntitle: Canvas Source\ndescription: Add a canvas source to the map.\noriginal: https://maplibre.org/maplibre-gl-js/docs/examples/canvas-source/\n---\n\n<script lang=\"ts\">\n  import Demo from \"./Canvas.svelte\";\n  import demoRaw from \"./Canvas.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/clusters/Clusters.svelte",
    "content": "<script lang=\"ts\">\n\timport { CircleLayer, MapLibre, GeoJSONSource, SymbolLayer, GlobeControl } from 'svelte-maplibre-gl';\n\timport { Slider } from '$lib/components/ui/slider/index.js';\n\timport { Checkbox } from '$lib/components/ui/checkbox/index.js';\n\timport { Label } from '$lib/components/ui/label/index.js';\n\n\tlet cluster = $state(true);\n\tlet clusterMaxZoom = $state(11);\n\tlet clusterRadius = $state(50);\n</script>\n\n<div class=\"mb-4 flex items-center justify-between gap-x-10\">\n\t<div class=\"flex items-center space-x-2\">\n\t\t<Checkbox id=\"cluster\" bind:checked={cluster} />\n\t\t<Label\n\t\t\tfor=\"cluster\"\n\t\t\tclass=\"text-sm leading-none font-medium peer-disabled:cursor-not-allowed peer-disabled:opacity-70\">Cluster</Label\n\t\t>\n\t</div>\n\t<div class=\"flex flex-1 grow flex-col gap-y-4\">\n\t\t<Label for=\"clusterMaxZoom\">clusterMaxZoom: {clusterMaxZoom.toFixed(2)}</Label>\n\t\t<Slider type=\"single\" id=\"clusterMaxZoom\" bind:value={clusterMaxZoom} min={0} max={22} step={1} />\n\t</div>\n\t<div class=\"flex flex-1 grow flex-col gap-y-4\">\n\t\t<Label for=\"clusterRadius\">clusterRadius: {clusterRadius.toFixed(2)}</Label>\n\t\t<Slider type=\"single\" id=\"clusterRadius\" bind:value={clusterRadius} min={0} max={100} step={1} />\n\t</div>\n</div>\n\n<MapLibre\n\tclass=\"h-[55vh] min-h-75\"\n\tstyle=\"https://basemaps.cartocdn.com/gl/dark-matter-gl-style/style.json\"\n\tzoom={2}\n\tcenter={{ lng: 180, lat: 35 }}\n>\n\t<GlobeControl />\n\t<GeoJSONSource\n\t\tdata=\"https://maplibre.org/maplibre-gl-js/docs/assets/earthquakes.geojson\"\n\t\t{cluster}\n\t\tclusterMaxZoom={cluster ? clusterMaxZoom : undefined}\n\t\tclusterRadius={cluster ? clusterRadius : undefined}\n\t>\n\t\t<CircleLayer\n\t\t\tfilter={['has', 'point_count']}\n\t\t\tpaint={{\n\t\t\t\t'circle-color': ['step', ['get', 'point_count'], '#51bbd6', 50, '#f1f075', 150, '#f28cb1'],\n\t\t\t\t'circle-radius': ['+', 10, ['sqrt', ['get', 'point_count']]],\n\t\t\t\t'circle-opacity': 0.8\n\t\t\t}}\n\t\t/>\n\t\t<SymbolLayer\n\t\t\tfilter={['has', 'point_count']}\n\t\t\tlayout={{\n\t\t\t\t'text-field': '{point_count_abbreviated}',\n\t\t\t\t'text-size': 12\n\t\t\t}}\n\t\t/>\n\t\t<CircleLayer\n\t\t\tfilter={['!', ['has', 'point_count']]}\n\t\t\tpaint={{\n\t\t\t\t'circle-color': '#ffff00',\n\t\t\t\t'circle-radius': 2\n\t\t\t}}\n\t\t/>\n\t</GeoJSONSource>\n</MapLibre>\n"
  },
  {
    "path": "src/content/examples/clusters/content.svelte.md",
    "content": "---\ntitle: Clusters\ndescription: Use MapLibre's built-in functions to visualize points as clusters.\noriginal: https://maplibre.org/maplibre-gl-js/docs/examples/cluster/\n---\n\n<script lang=\"ts\">\n  import Demo from \"./Clusters.svelte\";\n  import demoRaw from \"./Clusters.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/color-relief/ColorRelief.svelte",
    "content": "<script lang=\"ts\">\n\timport {\n\t\tHillshadeLayer,\n\t\tMapLibre,\n\t\tRasterDEMTileSource,\n\t\tTerrainControl,\n\t\tGlobeControl,\n\t\tLight,\n\t\tColorReliefLayer\n\t} from 'svelte-maplibre-gl';\n\timport type { ExpressionSpecification } from 'maplibre-gl';\n\timport { Label } from '$lib/components/ui/label/index.js';\n\timport { Slider } from '$lib/components/ui/slider/index.js';\n\n\t// https://nathanmolson.github.io/color_relief\n\tconst COLOR_RAMPS: Record<string, ExpressionSpecification> = {\n\t\tLINZ: [\n\t\t\t'interpolate',\n\t\t\t['linear'],\n\t\t\t['elevation'],\n\t\t\t0,\n\t\t\t'#c0e0ffff',\n\t\t\t0.1,\n\t\t\t'#d8d8d8ff',\n\t\t\t3,\n\t\t\t'#548359ff',\n\t\t\t255,\n\t\t\t'#32482dff',\n\t\t\t1000,\n\t\t\t'#32482dff',\n\t\t\t1200,\n\t\t\t'#adb7a3ff',\n\t\t\t1700,\n\t\t\t'#bfbfb8ff',\n\t\t\t1750,\n\t\t\t'#e6f4fdff',\n\t\t\t3000,\n\t\t\t'#ffffffff'\n\t\t],\n\t\tisoluminant: [\n\t\t\t'interpolate',\n\t\t\t['linear'],\n\t\t\t['elevation'],\n\t\t\t0,\n\t\t\t'rgb(112, 209, 255)',\n\t\t\t12.88581315,\n\t\t\t'rgb(113, 211, 247)',\n\t\t\t51.5432526,\n\t\t\t'rgb(114, 212, 234)',\n\t\t\t115.9723183,\n\t\t\t'rgb(117, 213, 222)',\n\t\t\t206.1730104,\n\t\t\t'rgb(120, 214, 209)',\n\t\t\t322.1453287,\n\t\t\t'rgb(124, 215, 196)',\n\t\t\t463.8892734,\n\t\t\t'rgb(130, 215, 183)',\n\t\t\t631.4048443,\n\t\t\t'rgb(138, 215, 169)',\n\t\t\t824.6920415,\n\t\t\t'rgb(149, 214, 155)',\n\t\t\t1043.750865,\n\t\t\t'rgb(163, 212, 143)',\n\t\t\t1288.581315,\n\t\t\t'rgb(178, 209, 134)',\n\t\t\t1559.183391,\n\t\t\t'rgb(193, 205, 127)',\n\t\t\t1855.557093,\n\t\t\t'rgb(207, 202, 121)',\n\t\t\t2177.702422,\n\t\t\t'rgb(220, 197, 118)',\n\t\t\t2525.619377,\n\t\t\t'rgb(233, 193, 118)',\n\t\t\t2899.307958,\n\t\t\t'rgb(244, 188, 120)',\n\t\t\t3298.768166,\n\t\t\t'rgb(255, 183, 124)',\n\t\t\t3724,\n\t\t\t'rgb(255, 178, 129)'\n\t\t],\n\t\trainbow: [\n\t\t\t'interpolate',\n\t\t\t['linear'],\n\t\t\t['elevation'],\n\t\t\t0,\n\t\t\t'rgb(4, 0, 108)',\n\t\t\t12.88581315,\n\t\t\t'rgb(5, 1, 154)',\n\t\t\t51.5432526,\n\t\t\t'rgb(10, 21, 189)',\n\t\t\t115.9723183,\n\t\t\t'rgb(16, 44, 218)',\n\t\t\t206.1730104,\n\t\t\t'rgb(24, 69, 240)',\n\t\t\t322.1453287,\n\t\t\t'rgb(20, 112, 193)',\n\t\t\t463.8892734,\n\t\t\t'rgb(39, 144, 116)',\n\t\t\t631.4048443,\n\t\t\t'rgb(57, 169, 29)',\n\t\t\t824.6920415,\n\t\t\t'rgb(111, 186, 5)',\n\t\t\t1043.750865,\n\t\t\t'rgb(160, 201, 4)',\n\t\t\t1288.581315,\n\t\t\t'rgb(205, 216, 2)',\n\t\t\t1559.183391,\n\t\t\t'rgb(244, 221, 4)',\n\t\t\t1855.557093,\n\t\t\t'rgb(251, 194, 14)',\n\t\t\t2177.702422,\n\t\t\t'rgb(252, 163, 21)',\n\t\t\t2525.619377,\n\t\t\t'rgb(253, 128, 20)',\n\t\t\t2899.307958,\n\t\t\t'rgb(254, 85, 14)',\n\t\t\t3298.768166,\n\t\t\t'rgb(243, 36, 13)',\n\t\t\t3724,\n\t\t\t'rgb(215, 5, 13)'\n\t\t],\n\t\tgeographical: [\n\t\t\t'interpolate',\n\t\t\t['linear'],\n\t\t\t['elevation'],\n\t\t\t0,\n\t\t\t'rgb(112, 209, 255)',\n\t\t\t1,\n\t\t\t'rgb(112, 209, 255)',\n\t\t\t2,\n\t\t\t'rgb(112, 173, 92)',\n\t\t\t176.4705882,\n\t\t\t'rgb(131, 174, 94)',\n\t\t\t352.9411765,\n\t\t\t'rgb(149, 175, 95)',\n\t\t\t529.4117647,\n\t\t\t'rgb(166, 176, 97)',\n\t\t\t705.8823529,\n\t\t\t'rgb(181, 177, 99)',\n\t\t\t882.3529412,\n\t\t\t'rgb(195, 177, 101)',\n\t\t\t1058.823529,\n\t\t\t'rgb(208, 178, 103)',\n\t\t\t1235.294118,\n\t\t\t'rgb(220, 180, 105)',\n\t\t\t1411.764706,\n\t\t\t'rgb(228, 182, 108)',\n\t\t\t1588.235294,\n\t\t\t'rgb(231, 187, 111)',\n\t\t\t1764.705882,\n\t\t\t'rgb(231, 192, 118)',\n\t\t\t1941.176471,\n\t\t\t'rgb(231, 197, 129)',\n\t\t\t2117.647059,\n\t\t\t'rgb(231, 203, 144)',\n\t\t\t2294.117647,\n\t\t\t'rgb(230, 208, 161)',\n\t\t\t2470.588235,\n\t\t\t'rgb(229, 212, 177)',\n\t\t\t2647.058824,\n\t\t\t'rgb(229, 217, 194)',\n\t\t\t2823.529412,\n\t\t\t'rgb(228, 222, 210)',\n\t\t\t3000,\n\t\t\t'rgb(226, 226, 226)'\n\t\t],\n\t\tcategorical: [\n\t\t\t'interpolate',\n\t\t\t['linear'],\n\t\t\t['elevation'],\n\t\t\t0,\n\t\t\t'rgb(4, 0, 108)',\n\t\t\t1,\n\t\t\t'rgb(5, 1, 159)',\n\t\t\t232.75,\n\t\t\t'rgb(5, 1, 159)',\n\t\t\t233.75,\n\t\t\t'rgb(12, 28, 197)',\n\t\t\t465.5,\n\t\t\t'rgb(12, 28, 197)',\n\t\t\t466.5,\n\t\t\t'rgb(17, 53, 230)',\n\t\t\t698.25,\n\t\t\t'rgb(17, 53, 230)',\n\t\t\t699.25,\n\t\t\t'rgb(32, 92, 222)',\n\t\t\t931,\n\t\t\t'rgb(32, 92, 222)',\n\t\t\t932,\n\t\t\t'rgb(21, 135, 144)',\n\t\t\t1163.75,\n\t\t\t'rgb(21, 135, 144)',\n\t\t\t1164.75,\n\t\t\t'rgb(51, 164, 44)',\n\t\t\t1396.5,\n\t\t\t'rgb(51, 164, 44)',\n\t\t\t1397.5,\n\t\t\t'rgb(108, 184, 6)',\n\t\t\t1629.25,\n\t\t\t'rgb(108, 184, 6)',\n\t\t\t1630.25,\n\t\t\t'rgb(163, 202, 4)',\n\t\t\t1862,\n\t\t\t'rgb(163, 202, 4)',\n\t\t\t1863,\n\t\t\t'rgb(214, 218, 2)',\n\t\t\t2094.75,\n\t\t\t'rgb(214, 218, 2)',\n\t\t\t2095.75,\n\t\t\t'rgb(249, 214, 7)',\n\t\t\t2327.5,\n\t\t\t'rgb(249, 214, 7)',\n\t\t\t2328.5,\n\t\t\t'rgb(252, 180, 18)',\n\t\t\t2560.25,\n\t\t\t'rgb(252, 180, 18)',\n\t\t\t2561.25,\n\t\t\t'rgb(252, 143, 21)',\n\t\t\t2793,\n\t\t\t'rgb(252, 143, 21)',\n\t\t\t2794,\n\t\t\t'rgb(254, 98, 16)',\n\t\t\t3025.75,\n\t\t\t'rgb(254, 98, 16)',\n\t\t\t3026.75,\n\t\t\t'rgb(246, 41, 13)',\n\t\t\t3258.5,\n\t\t\t'rgb(246, 41, 13)',\n\t\t\t3259.5,\n\t\t\t'rgb(215, 5, 13)',\n\t\t\t3491.25,\n\t\t\t'rgb(215, 5, 13)'\n\t\t],\n\t\tmonochrome: ['interpolate', ['linear'], ['elevation'], 0.1, '#111', 0.2, 'black', 3724, 'white'],\n\t\trgbk: ['interpolate', ['linear'], ['elevation'], 0, '#f00', 800, '#0f0', 1600, '#00f', 2400, '#fff', 3724, 'black']\n\t};\n\ttype ColorRamp = keyof typeof COLOR_RAMPS;\n\n\tlet colorRamp: ColorRamp = $state('LINZ');\n\tlet hillshade = $state(0.4);\n</script>\n\n<MapLibre class=\"h-[55vh] min-h-75\" zoom={9.5} center={{ lng: 11.5, lat: 47.3 }}>\n\t<GlobeControl />\n\t<Light anchor=\"map\" />\n\t<!-- Terrain -->\n\t<RasterDEMTileSource url=\"https://tiles.mapterhorn.com/tilejson.json\">\n\t\t<TerrainControl position=\"top-right\" />\n\t</RasterDEMTileSource>\n\t<!-- Color Relief and Hillshade -->\n\t<RasterDEMTileSource url=\"https://tiles.mapterhorn.com/tilejson.json\">\n\t\t<ColorReliefLayer\n\t\t\tpaint={{\n\t\t\t\t'color-relief-opacity': 1,\n\t\t\t\t'color-relief-color': COLOR_RAMPS[colorRamp]\n\t\t\t}}\n\t\t/>\n\t\t<HillshadeLayer\n\t\t\tpaint={{\n\t\t\t\t'hillshade-method': 'igor',\n\t\t\t\t'hillshade-exaggeration': hillshade,\n\t\t\t\t'hillshade-highlight-color': '#ffffff'\n\t\t\t}}\n\t\t/>\n\t</RasterDEMTileSource>\n\n\t<!-- Controls -->\n\t<div\n\t\tclass=\"absolute top-3 left-3 z-10 flex min-w-50 flex-col items-stretch gap-1 rounded bg-background/60 p-3 text-sm backdrop-blur-sm\"\n\t>\n\t\t<div class=\"mb-2 flex items-center justify-between space-x-2\">\n\t\t\t<Label for=\"shadow-method\" class=\"leading-none\">Color Ramp</Label>\n\t\t\t<select bind:value={colorRamp} id=\"hillshade-method\" class=\"text-center\">\n\t\t\t\t{#each Object.keys(COLOR_RAMPS) as ramp (ramp)}\n\t\t\t\t\t<option value={ramp}>{ramp}</option>\n\t\t\t\t{/each}\n\t\t\t</select>\n\t\t</div>\n\t\t<div class=\"flex items-center justify-between space-x-3\">\n\t\t\t<Label for=\"hillshade\" class=\"leading-none\">Hillshade</Label>\n\t\t\t<Slider type=\"single\" id=\"hillshade\" bind:value={hillshade} min={0} max={1} step={0.01} />\n\t\t</div>\n\t</div>\n</MapLibre>\n"
  },
  {
    "path": "src/content/examples/color-relief/content.svelte.md",
    "content": "---\ntitle: Color Relief\ndescription: Render hypsometric tints using DEM sources\noriginal: https://nathanmolson.github.io/color_relief/\n---\n\n<script lang=\"ts\">\n  import Demo from \"./ColorRelief.svelte\";\n  import demoRaw from \"./ColorRelief.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/complex/Complex.svelte",
    "content": "<script lang=\"ts\">\n\timport maplibregl from 'maplibre-gl';\n\timport {\n\t\tMapLibre,\n\t\tRasterTileSource,\n\t\tRasterDEMTileSource,\n\t\tVectorTileSource,\n\t\tGeoJSONSource,\n\t\tBackgroundLayer,\n\t\tRasterLayer,\n\t\tFillLayer,\n\t\tLineLayer,\n\t\tCircleLayer,\n\t\tFillExtrusionLayer,\n\t\tNavigationControl,\n\t\tFullScreenControl,\n\t\tScaleControl,\n\t\tLogoControl,\n\t\tGeolocateControl,\n\t\tAttributionControl,\n\t\tHeatmapLayer,\n\t\tTerrainControl,\n\t\tHash,\n\t\tHillshadeLayer,\n\t\tTerrain,\n\t\tSky,\n\t\tProjection,\n\t\tLight,\n\t\tMarker,\n\t\tPopup,\n\t\tGlobeControl\n\t} from 'svelte-maplibre-gl';\n\timport { PMTilesProtocol } from '@svelte-maplibre-gl/pmtiles';\n\n\tlet map: maplibregl.Map | undefined = $state.raw();\n\tlet hash = $state(true);\n\tlet sky = $state(true);\n\tlet globe = $state(true);\n\tlet showCities = $state(true);\n\tlet hillshade = $state(true);\n\tlet extrude = $state(false);\n\tlet heatmap = $state(false);\n\tlet pointColor = $state('#ffff00');\n\tlet lineColor = $state('#ff00dd');\n\tlet lineWidth = $state(1.5);\n\tlet circleRadius = $state(3);\n\tlet center: [number, number] = $state([137.3543, 37.062]);\n\tlet zoom = $state(6.0);\n\tlet pitch = $state(0);\n\tlet bearing = $state(0);\n\tlet controlPosition: maplibregl.ControlPosition | undefined = $state('bottom-right');\n\tlet markerLnglat = $state({ lng: 139.767052, lat: 35.681167 });\n\tlet popupOpen = $state(false);\n</script>\n\n<PMTilesProtocol />\n\n<div class=\"flex items-center gap-x-2 p-1 text-sm\">\n\t<label>\n\t\t<input class=\"rounded border p-1 leading-none\" type=\"checkbox\" bind:checked={showCities} />\n\t\tCities\n\t</label>\n\t<label>\n\t\t<input class=\"rounded border p-1 leading-none\" type=\"checkbox\" bind:checked={hillshade} />\n\t\tHillshade\n\t</label>\n\t<label>\n\t\t<input class=\"rounded border p-1 leading-none\" type=\"checkbox\" bind:checked={sky} />\n\t\tSky\n\t</label>\n\t<label>\n\t\t<input class=\"rounded border p-1 leading-none\" type=\"checkbox\" bind:checked={extrude} />\n\t\tExtrude\n\t</label>\n\t<label>\n\t\t<input class=\"rounded border p-1 leading-none\" type=\"checkbox\" bind:checked={heatmap} />\n\t\tHeatmap\n\t</label>\n\t<label>\n\t\t<input class=\"rounded border p-1 leading-none\" type=\"checkbox\" bind:checked={globe} />\n\t\tGlobe\n\t</label>\n\t<label>\n\t\tpC:\n\t\t<input type=\"color\" bind:value={pointColor} class=\"inline-block w-7 rounded border leading-none\" />\n\t</label>\n\t<label>\n\t\tpR:\n\t\t<input\n\t\t\ttype=\"number\"\n\t\t\tmin=\"0\"\n\t\t\tmax=\"10\"\n\t\t\tstep=\"0.5\"\n\t\t\tbind:value={circleRadius}\n\t\t\tclass=\"w-12 rounded border p-1 leading-none\"\n\t\t/>\n\t</label>\n\t<label>\n\t\tlC:\n\t\t<input type=\"color\" bind:value={lineColor} class=\"w-7 rounded border leading-none\" />\n\t</label>\n\t<label>\n\t\tlW:\n\t\t<input\n\t\t\ttype=\"number\"\n\t\t\tmin=\"0\"\n\t\t\tmax=\"10\"\n\t\t\tstep=\"0.5\"\n\t\t\tbind:value={lineWidth}\n\t\t\tclass=\"w-12 rounded border p-1 leading-none\"\n\t\t/>\n\t</label>\n\t<select bind:value={controlPosition}>\n\t\t<option value=\"top-left\">top-left</option>\n\t\t<option value=\"top-right\">top-right</option>\n\t\t<option value=\"bottom-left\">botom-left</option>\n\t\t<option value=\"bottom-right\">bottom-right</option>\n\t\t<option value={undefined}>auto</option>\n\t</select>\n\t<button\n\t\tclass=\"rounded border p-1 leading-none\"\n\t\tonclick={() => {\n\t\t\tmap?.flyTo({ center: markerLnglat, zoom: 15 });\n\t\t}}>Fly to</button\n\t>\n</div>\n<div class=\"flex items-center gap-x-4 text-sm\">\n\t<pre\n\t\tclass=\"my-1 grow\">{`lat: ${center[1].toFixed(3)}, lng: ${center[0].toFixed(3)}, z: ${zoom.toFixed(1)}, pitch: ${pitch.toFixed(1)}, bearing: ${bearing.toFixed(1)}`}</pre>\n\t<pre class=\"my-1 grow\">marker: {`${markerLnglat.lat.toFixed(3)}, ${markerLnglat.lng.toFixed(3)}`}</pre>\n\t<label>\n\t\tz:\n\t\t<input type=\"number\" min=\"0\" max=\"24\" step=\"0.5\" bind:value={zoom} class=\"w-12 rounded border p-1 leading-none\" />\n\t</label>\n\t<label>\n\t\t<input type=\"checkbox\" bind:checked={popupOpen} /> Popup Open\n\t</label>\n\t<label>\n\t\t<input type=\"checkbox\" bind:checked={hash} /> Hash\n\t</label>\n</div>\n\n<MapLibre\n\tclass=\"h-[55vh] min-h-75\"\n\tbind:map\n\tbind:zoom\n\tbind:center\n\tbind:pitch\n\tbind:bearing\n\tmaxPitch={85}\n\tattributionControl={false}\n>\n\t{#if hash}\n\t\t<Hash />\n\t{/if}\n\t{#if sky}\n\t\t<Sky\n\t\t\tsky-color=\"#001560\"\n\t\t\thorizon-color=\"#0090c0\"\n\t\t\tfog-color=\"#ffffff\"\n\t\t\tsky-horizon-blend={0.9}\n\t\t\thorizon-fog-blend={0.8}\n\t\t\tfog-ground-blend={0.7}\n\t\t\tatmosphere-blend={['interpolate', ['linear'], ['zoom'], 2, 0.8, 4, 0.3, 7, 0]}\n\t\t/>\n\t{/if}\n\t<Light anchor=\"map\" />\n\t<Projection type={globe ? 'globe' : undefined} />\n\t<AttributionControl position={controlPosition} compact />\n\t<LogoControl position={controlPosition} />\n\t<ScaleControl position={controlPosition} />\n\t<FullScreenControl position={controlPosition} />\n\t<GeolocateControl position={controlPosition} />\n\t<NavigationControl position={controlPosition} visualizePitch />\n\t<TerrainControl position={controlPosition} source=\"terrain\" />\n\t<GlobeControl position={controlPosition} />\n\t<RasterDEMTileSource id=\"terrain\" url=\"https://tiles.mapterhorn.com/tilejson.json\">\n\t\t{#if !globe}\n\t\t\t<Terrain />\n\t\t{/if}\n\t</RasterDEMTileSource>\n\t<RasterTileSource\n\t\ttiles={['https://cyberjapandata.gsi.go.jp/xyz/seamlessphoto/{z}/{x}/{y}.jpg']}\n\t\tminzoom={2}\n\t\tmaxzoom={18}\n\t\tattribution=\"国土地理院, TSIC, GEO Grid/AIST, USGS, GEBCO, NASA\"\n\t>\n\t\t<RasterLayer />\n\t</RasterTileSource>\n\t<BackgroundLayer id=\"dummy1\" layout={{ visibility: 'none' }} />\n\t{#if hillshade}\n\t\t<RasterDEMTileSource url=\"https://tiles.mapterhorn.com/tilejson.json\">\n\t\t\t<HillshadeLayer beforeId=\"dummy1\" />\n\t\t</RasterDEMTileSource>\n\t{/if}\n\t<BackgroundLayer id=\"dummy2\" layout={{ visibility: 'none' }} />\n\t<BackgroundLayer id=\"dummy3\" layout={{ visibility: 'none' }} />\n\t<VectorTileSource\n\t\turl=\"pmtiles://https://jma-assets.mierune.dev/pmtiles/mete.pmtiles\"\n\t\tminzoom={0}\n\t\tmaxzoom={13}\n\t\tattribution=\"<a href='https://www.data.jma.go.jp/developer/gis.html'>気象庁</a>\"\n\t>\n\t\t{#if showCities}\n\t\t\t<LineLayer\n\t\t\t\tsourceLayer=\"city\"\n\t\t\t\tbeforeId=\"dummy3\"\n\t\t\t\tlayout={{ 'line-join': 'round', 'line-cap': 'round' }}\n\t\t\t\tpaint={{ 'line-color': lineColor, 'line-width': lineWidth }}\n\t\t\t/>\n\t\t\t{#if extrude}\n\t\t\t\t<FillExtrusionLayer\n\t\t\t\t\tsourceLayer=\"city\"\n\t\t\t\t\tbeforeId=\"dummy2\"\n\t\t\t\t\tpaint={{\n\t\t\t\t\t\t'fill-extrusion-color': '#555533',\n\t\t\t\t\t\t'fill-extrusion-height': ['/', ['to-number', ['get', 'code']], 100],\n\t\t\t\t\t\t'fill-extrusion-opacity': 0.7\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t{:else}\n\t\t\t\t<FillLayer\n\t\t\t\t\tid=\"cityfill\"\n\t\t\t\t\tsourceLayer=\"city\"\n\t\t\t\t\tbeforeId=\"dummy2\"\n\t\t\t\t\tpaint={{ 'fill-color': '#aaaa33', 'fill-opacity': 0.3 }}\n\t\t\t\t/>\n\t\t\t{/if}\n\t\t{/if}\n\t</VectorTileSource>\n\t<GeoJSONSource data=\"https://jma-assets.mierune.dev/codes/amedas_ame.geojson\">\n\t\t{#if heatmap}\n\t\t\t<HeatmapLayer\n\t\t\t\tpaint={{\n\t\t\t\t\t'heatmap-weight': 1,\n\t\t\t\t\t'heatmap-intensity': ['interpolate', ['exponential', 2], ['zoom'], 0, 0.9, 18, 10],\n\t\t\t\t\t'heatmap-color': [\n\t\t\t\t\t\t'interpolate',\n\t\t\t\t\t\t['linear'],\n\t\t\t\t\t\t['heatmap-density'],\n\t\t\t\t\t\t0,\n\t\t\t\t\t\t'rgba(33,102,172,0)',\n\t\t\t\t\t\t0.2,\n\t\t\t\t\t\t'rgb(103,169,207)',\n\t\t\t\t\t\t0.4,\n\t\t\t\t\t\t'rgb(209,229,240)',\n\t\t\t\t\t\t0.6,\n\t\t\t\t\t\t'rgb(253,219,199)',\n\t\t\t\t\t\t0.7,\n\t\t\t\t\t\t'rgb(239,138,98)',\n\t\t\t\t\t\t0.9,\n\t\t\t\t\t\t'rgb(178,24,43)',\n\t\t\t\t\t\t1,\n\t\t\t\t\t\t'rgb(100,0,200)'\n\t\t\t\t\t],\n\t\t\t\t\t'heatmap-radius': ['interpolate', ['linear'], ['zoom'], 0, 8, 18, 20],\n\t\t\t\t\t'heatmap-opacity': ['interpolate', ['linear'], ['zoom'], 2, 1, 18, 0]\n\t\t\t\t}}\n\t\t\t/>\n\t\t{:else}\n\t\t\t<CircleLayer beforeId=\"dummy3\" paint={{ 'circle-radius': circleRadius, 'circle-color': pointColor }} />\n\t\t{/if}\n\t</GeoJSONSource>\n\t<Marker bind:lnglat={markerLnglat} draggable color=\"#99dd55\">\n\t\t{#snippet content()}\n\t\t\t<span class=\"text-3xl\">🐸</span>\n\t\t{/snippet}\n\t\t<Popup class=\"text-black\" bind:open={popupOpen}>\n\t\t\t<span class=\"text-lg\">\n\t\t\t\t{`${markerLnglat.lat.toFixed(3)}, ${markerLnglat.lng.toFixed(3)}`}\n\t\t\t</span>\n\t\t</Popup>\n\t</Marker>\n</MapLibre>\n"
  },
  {
    "path": "src/content/examples/complex/content.svelte.md",
    "content": "---\ntitle: Complex\ndescription: A showcase of various reactive features.\n---\n\n<script lang=\"ts\">\n  import Demo from \"./Complex.svelte\";\n  import demoRaw from \"./Complex.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/contour/Contour.svelte",
    "content": "<script lang=\"ts\">\n\timport {\n\t\tHillshadeLayer,\n\t\tMapLibre,\n\t\tRasterDEMTileSource,\n\t\tLineLayer,\n\t\tSymbolLayer,\n\t\tTerrainControl\n\t} from 'svelte-maplibre-gl';\n\timport { MapLibreContourSource } from '@svelte-maplibre-gl/contour';\n</script>\n\n<MapLibre\n\tclass=\"h-[55vh] min-h-75\"\n\tstyle=\"https://demotiles.maplibre.org/styles/osm-bright-gl-style/style.json\"\n\tzoom={12}\n\tminZoom={5}\n\tcenter={{ lng: 11.35, lat: 47.3 }}\n>\n\t<MapLibreContourSource\n\t\turl={'https://tiles.mapterhorn.com/{z}/{x}/{y}.webp'}\n\t\tencoding=\"terrarium\"\n\t\tmaxzoom={14}\n\t\ttileOptions={{\n\t\t\t// multiplier: 1,\n\t\t\tthresholds: {\n\t\t\t\t// zoom: [minor, major]\n\t\t\t\t5: [500, 2000],\n\t\t\t\t8: [250, 1000],\n\t\t\t\t11: [100, 500],\n\t\t\t\t12: [50, 200],\n\t\t\t\t13: [20, 100],\n\t\t\t\t14: [10, 50]\n\t\t\t},\n\t\t\t// optional, override vector tile parameters:\n\t\t\tcontourLayer: 'contours',\n\t\t\televationKey: 'ele',\n\t\t\tlevelKey: 'level'\n\t\t}}\n\t\tattribution=\"<a href='https://mapterhorn.com/attribution/'>Mapterhorn</a>\"\n\t>\n\t\t{#snippet children(demSource)}\n\t\t\t<RasterDEMTileSource tiles={[demSource.sharedDemProtocolUrl]} maxzoom={14} tileSize={256}>\n\t\t\t\t<TerrainControl />\n\t\t\t</RasterDEMTileSource>\n\t\t\t<RasterDEMTileSource tiles={[demSource.sharedDemProtocolUrl]} maxzoom={14} tileSize={256}>\n\t\t\t\t<HillshadeLayer\n\t\t\t\t\tpaint={{\n\t\t\t\t\t\t'hillshade-exaggeration': 0.5,\n\t\t\t\t\t\t'hillshade-illumination-anchor': 'map',\n\t\t\t\t\t\t'hillshade-shadow-color': '#3080b0'\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t</RasterDEMTileSource>\n\t\t\t<LineLayer\n\t\t\t\tsourceLayer=\"contours\"\n\t\t\t\tpaint={{\n\t\t\t\t\t'line-color': 'rgba(90, 20, 0, 1)',\n\t\t\t\t\t'line-width': ['match', ['get', 'level'], 1, 1.5, 0.5]\n\t\t\t\t}}\n\t\t\t/>\n\t\t\t<SymbolLayer\n\t\t\t\tsourceLayer=\"contours\"\n\t\t\t\tfilter={['>', ['get', 'level'], 0]}\n\t\t\t\tlayout={{\n\t\t\t\t\t'symbol-placement': 'line',\n\t\t\t\t\t'text-size': 12,\n\t\t\t\t\t'text-field': ['number-format', ['get', 'ele'], {}]\n\t\t\t\t}}\n\t\t\t\tpaint={{\n\t\t\t\t\t'text-halo-color': 'white',\n\t\t\t\t\t'text-halo-width': 1\n\t\t\t\t}}\n\t\t\t/>\n\t\t{/snippet}\n\t</MapLibreContourSource>\n</MapLibre>\n"
  },
  {
    "path": "src/content/examples/contour/content.svelte.md",
    "content": "---\ntitle: Contour Lines\ndescription: Render contour lines from a raster DEM source using maplibre-contour\noriginal: https://maplibre.org/maplibre-gl-js/docs/examples/add-contour-lines/\n---\n\n<script lang=\"ts\">\n  import Demo from \"./Contour.svelte\";\n  import demoRaw from \"./Contour.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/cursor/Cursor.svelte",
    "content": "<script lang=\"ts\">\n\timport { MapLibre, GeoJSONSource, CircleLayer } from 'svelte-maplibre-gl';\n\timport type GeoJSON from 'geojson';\n\n\tconst CURSORS = [\n\t\t'cell',\n\t\t'col-resize',\n\t\t'context-menu',\n\t\t'copy',\n\t\t'crosshair',\n\t\t'default',\n\t\t'grab',\n\t\t'help',\n\t\t'move',\n\t\t'not-allowed',\n\t\t'pointer',\n\t\t'progress',\n\t\t'row-resize',\n\t\t'text',\n\t\t'vertical-text',\n\t\t'wait',\n\t\t'zoom-in',\n\t\t'zoom-out'\n\t];\n\tconst center = [0, 0];\n\tconst data: GeoJSON.FeatureCollection = {\n\t\ttype: 'FeatureCollection',\n\t\tfeatures: CURSORS.map((cursor, i) => ({\n\t\t\ttype: 'Feature',\n\t\t\tgeometry: {\n\t\t\t\ttype: 'Point',\n\t\t\t\tcoordinates: [\n\t\t\t\t\tcenter[0] + Math.cos((i / CURSORS.length) * Math.PI * 2) * 15,\n\t\t\t\t\tcenter[1] + Math.sin((i / CURSORS.length) * Math.PI * 2) * 15\n\t\t\t\t]\n\t\t\t},\n\t\t\tproperties: { cursor }\n\t\t}))\n\t};\n\n\tlet cursor: string | undefined = $state();\n</script>\n\n<MapLibre\n\tclass=\"h-[55vh] min-h-[300px]\"\n\tstyle=\"https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json\"\n\tzoom={2}\n\tcenter={{ lng: 0, lat: 0 }}\n\t{cursor}\n>\n\t<GeoJSONSource {data}>\n\t\t<CircleLayer\n\t\t\tonmousemove={(e) => (cursor = e.features![0].properties.cursor)}\n\t\t\tonmouseleave={() => (cursor = undefined)}\n\t\t\tpaint={{\n\t\t\t\t'circle-radius': 12,\n\t\t\t\t'circle-color': '#007cbf',\n\t\t\t\t'circle-stroke-color': '#fff',\n\t\t\t\t'circle-stroke-width': 3\n\t\t\t}}\n\t\t/>\n\t</GeoJSONSource>\n</MapLibre>\n"
  },
  {
    "path": "src/content/examples/cursor/content.svelte.md",
    "content": "---\ntitle: Change Cursor\ndescription: Change the cursor style on hover\n---\n\n<script lang=\"ts\">\n  import Demo from \"./Cursor.svelte\";\n  import demoRaw from \"./Cursor.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/custom-control/CustomControl.svelte",
    "content": "<script lang=\"ts\">\n\timport { HillshadeLayer, MapLibre, RasterDEMTileSource, Terrain, CustomControl } from 'svelte-maplibre-gl';\n\timport maplibregl from 'maplibre-gl';\n\timport Sun from '@lucide/svelte/icons/sun';\n\timport Moon from '@lucide/svelte/icons/moon';\n\timport ArrowUpLeft from '@lucide/svelte/icons/arrow-up-left';\n\timport ArrowUpRight from '@lucide/svelte/icons/arrow-up-right';\n\timport ArrowDownLeft from '@lucide/svelte/icons/arrow-down-left';\n\timport ArrowDownRight from '@lucide/svelte/icons/arrow-down-right';\n\timport { MyControl } from './MyControl.js';\n\n\tlet isHillshadeVisible = $state(true);\n\tlet isTerrainVisible = $state(true);\n\tlet isDarkMode = $state(false);\n\tconst mapStyle = $derived(\n\t\tisDarkMode\n\t\t\t? 'https://basemaps.cartocdn.com/gl/dark-matter-gl-style/style.json'\n\t\t\t: 'https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json'\n\t);\n\tlet center = $state({ lng: 11.09085, lat: 47.3 });\n\tlet controlPosition: maplibregl.ControlPosition = $state('top-left');\n\n\tconst myControl = new MyControl({\n\t\ttoggleHillshade: () => (isHillshadeVisible = !isHillshadeVisible),\n\t\ttoggleTerrain: () => (isTerrainVisible = !isTerrainVisible)\n\t});\n</script>\n\n<MapLibre class=\"h-[55vh] min-h-50\" style={mapStyle} zoom={12} pitch={40} maxPitch={85} bind:center>\n\t<!-- inject IControl (useful for plugin) -->\n\t<CustomControl position=\"top-left\" control={myControl} />\n\n\t<!-- Control / Group / Icon -->\n\t<CustomControl position=\"bottom-left\">\n\t\t<button onclick={() => (isDarkMode = !isDarkMode)} class=\"flex! items-center justify-center text-gray-900\">\n\t\t\t{#if isDarkMode}\n\t\t\t\t<Moon class=\"w-5\" />\n\t\t\t{:else}\n\t\t\t\t<Sun class=\"w-5\" />\n\t\t\t{/if}\n\t\t</button>\n\t</CustomControl>\n\n\t<!-- Group -->\n\t<CustomControl position={controlPosition} class=\"text-gray-900\">\n\t\t<button class=\"flex! items-center justify-center\" onclick={() => (controlPosition = 'top-left')}\n\t\t\t><ArrowUpLeft class=\"w-5\" /></button\n\t\t>\n\t\t<button class=\"flex! items-center justify-center\" onclick={() => (controlPosition = 'top-right')}\n\t\t\t><ArrowUpRight class=\"w-5\" /></button\n\t\t>\n\t\t<button class=\"flex! items-center justify-center\" onclick={() => (controlPosition = 'bottom-right')}\n\t\t\t><ArrowDownRight class=\"w-5\" /></button\n\t\t>\n\t\t<button class=\"flex! items-center justify-center\" onclick={() => (controlPosition = 'bottom-left')}\n\t\t\t><ArrowDownLeft class=\"w-5\" /></button\n\t\t>\n\t</CustomControl>\n\n\t<!-- Control / Group / any svelte elements -->\n\t<CustomControl position=\"top-right\">\n\t\t<div class=\"p-2 text-yellow-700\">Arbitrary HTML</div>\n\t\t<div class=\"border-t border-t-[#ddd] p-2 text-center text-yellow-700\">\n\t\t\t({center.lat.toFixed(4)}, {center.lng.toFixed(4)})\n\t\t</div>\n\t</CustomControl>\n\n\t<RasterDEMTileSource url=\"https://tiles.mapterhorn.com/tilejson.json\">\n\t\t{#if isTerrainVisible}\n\t\t\t<Terrain />\n\t\t{/if}\n\t</RasterDEMTileSource>\n\t<RasterDEMTileSource url=\"https://tiles.mapterhorn.com/tilejson.json\">\n\t\t{#if isHillshadeVisible}\n\t\t\t<HillshadeLayer />\n\t\t{/if}\n\t</RasterDEMTileSource>\n</MapLibre>\n"
  },
  {
    "path": "src/content/examples/custom-control/MyControl.ts",
    "content": "interface MyControlConstructorOptions {\n\ttoggleTerrain: () => boolean;\n\ttoggleHillshade: () => boolean;\n}\n\nclass MyControl implements maplibregl.IControl {\n\tprivate _container: HTMLElement | undefined;\n\tprivate _toggleTerrain: () => boolean;\n\tprivate _toggleHillshade: () => boolean;\n\n\tconstructor(options: MyControlConstructorOptions) {\n\t\tthis._toggleTerrain = options.toggleTerrain;\n\t\tthis._toggleHillshade = options.toggleHillshade;\n\t}\n\n\tonAdd() {\n\t\tthis._container = document.createElement('div');\n\t\tthis._container.className = 'maplibregl-ctrl maplibregl-ctrl-group p-2 rounded flex w-[240px] gap-x-2';\n\n\t\tconst toggleTerrain = document.createElement('button');\n\t\ttoggleTerrain.textContent = 'Disable Terrain';\n\t\ttoggleTerrain.type = 'button';\n\t\ttoggleTerrain.style.backgroundColor = 'red';\n\t\ttoggleTerrain.style.color = 'white';\n\t\ttoggleTerrain.style.width = '50%';\n\t\ttoggleTerrain.style.height = '100%';\n\t\ttoggleTerrain.style.borderRadius = '0.25rem';\n\t\ttoggleTerrain.addEventListener('click', () => {\n\t\t\tconst newState = this._toggleTerrain();\n\t\t\ttoggleTerrain.textContent = newState ? 'Disable Terrain' : 'Enable Terrain';\n\t\t});\n\n\t\tconst toggleHillshade = document.createElement('button');\n\t\ttoggleHillshade.textContent = 'Disable Hillshade';\n\t\ttoggleHillshade.type = 'button';\n\t\ttoggleHillshade.style.backgroundColor = 'blue';\n\t\ttoggleHillshade.style.color = 'white';\n\t\ttoggleHillshade.style.height = '100%';\n\t\ttoggleHillshade.style.width = '50%';\n\t\ttoggleHillshade.style.borderRadius = '0.25rem';\n\t\ttoggleHillshade.addEventListener('click', () => {\n\t\t\tconst newState = this._toggleHillshade();\n\t\t\ttoggleHillshade.textContent = newState ? 'Disable Hillshade' : 'Enable Hillshade';\n\t\t});\n\n\t\tthis._container.appendChild(toggleTerrain);\n\t\tthis._container.appendChild(toggleHillshade);\n\t\treturn this._container!;\n\t}\n\n\tonRemove() {\n\t\tif (this._container && this._container.parentNode) {\n\t\t\tthis._container.parentNode.removeChild(this._container);\n\t\t}\n\t}\n}\n\nexport { MyControl };\n"
  },
  {
    "path": "src/content/examples/custom-control/content.svelte.md",
    "content": "---\ntitle: Custom Control\ndescription: Easily create user-defined controls with a native look and feel.\n---\n\n<script lang=\"ts\">\n  import Demo from \"./CustomControl.svelte\";\n  import demoRaw from \"./CustomControl.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/custom-layer/CustomLayer.svelte",
    "content": "<script lang=\"ts\">\n\timport { MapLibre, CustomLayer, GlobeControl, Projection } from 'svelte-maplibre-gl';\n\timport maplibregl from 'maplibre-gl';\n\n\t// define vertices of the triangle to be rendered in the custom style layer\n\tconst helsinki = maplibregl.MercatorCoordinate.fromLngLat({ lng: 25.004, lat: 60.239 });\n\tconst berlin = maplibregl.MercatorCoordinate.fromLngLat({ lng: 13.403, lat: 52.562 });\n\tconst kyiv = maplibregl.MercatorCoordinate.fromLngLat({ lng: 30.498, lat: 50.541 });\n\n\tclass CustomLayerImpl implements Omit<maplibregl.CustomLayerInterface, 'id' | 'type'> {\n\t\tprivate shaderMap: Map<string, WebGLProgram> = new Map();\n\t\tprivate aPos: number = 0;\n\t\tprivate buffer: WebGLBuffer | null = null;\n\n\t\tprivate getShader(\n\t\t\tgl: WebGL2RenderingContext | WebGLRenderingContext,\n\t\t\tshaderDescription: maplibregl.CustomRenderMethodInput['shaderData']\n\t\t) {\n\t\t\t// Pick a shader based on the current projection, defined by `variantName`.\n\t\t\tif (this.shaderMap.has(shaderDescription.variantName)) {\n\t\t\t\treturn this.shaderMap.get(shaderDescription.variantName)!;\n\t\t\t}\n\n\t\t\t// Create vertex shader\n\t\t\t//\n\t\t\t// Note that we need to use a complex function to project from the source mercator\n\t\t\t// coordinates to the globe. Internal shaders in MapLibre need to do this too.\n\t\t\t// This is done using the `projectTile` function.\n\t\t\t// In MapLibre, this function accepts vertex coordinates local to the current tile,\n\t\t\t// in range 0..EXTENT (8192), but for custom layers MapLibre supplies uniforms such that\n\t\t\t// the function accepts mercator coordinates of the whole world in range 0..1.\n\t\t\t// This is controlled by the `u_projection_tile_mercator_coords` uniform.\n\t\t\t//\n\t\t\t// The `projectTile` function can also handle mercator to globe transitions and can\n\t\t\t// handle the mercator projection - different code is supplied based on what projection is used,\n\t\t\t// and for this reason we use different shaders based on what shader projection variant is currently used.\n\t\t\t// See `variantName` usage earlier in this file.\n\t\t\t//\n\t\t\t// The code for the projection function and uniforms is also supplied by MapLibre\n\t\t\t// and must be injected into custom layer shaders in order to draw on a globe.\n\t\t\t// We simply use string interpolation for that here.\n\t\t\t//\n\t\t\t// See MapLibre source code for more details, especially src/shaders/_projection_globe.vertex.glsl\n\t\t\t//\n\t\t\tconst vertexShader = gl.createShader(gl.VERTEX_SHADER)!;\n\t\t\tconst vertexSource = `#version 300 es\n\t\t\t\t// Inject MapLibre projection code\n\t\t\t\t${shaderDescription.vertexShaderPrelude}\n\t\t\t\t${shaderDescription.define}\n\n\t\t\t\tin vec2 a_pos;\n\t\t\t\tvoid main() {\n\t\t\t\t\t\tgl_Position = projectTile(a_pos);\n\t\t\t\t}`;\n\t\t\tgl.shaderSource(vertexShader, vertexSource);\n\t\t\tgl.compileShader(vertexShader);\n\n\t\t\t// Create fragment shader\n\t\t\tconst fragmentShader = gl.createShader(gl.FRAGMENT_SHADER)!;\n\t\t\tconst fragmentSource = `#version 300 es\n\t\t\t\tout highp vec4 fragColor;\n\t\t\t\tvoid main() {\n\t\t\t\t\t\tfragColor = vec4(1.0, 0.0, 1.0, 0.75);\n\t\t\t\t}`;\n\t\t\tgl.shaderSource(fragmentShader, fragmentSource);\n\t\t\tgl.compileShader(fragmentShader);\n\n\t\t\t// Link the two shaders into a WebGL program\n\t\t\tconst program = gl.createProgram();\n\t\t\tgl.attachShader(program, vertexShader);\n\t\t\tgl.attachShader(program, fragmentShader);\n\t\t\tgl.linkProgram(program);\n\n\t\t\tthis.aPos = gl.getAttribLocation(program, 'a_pos');\n\t\t\tthis.shaderMap.set(shaderDescription.variantName, program);\n\t\t\treturn program;\n\t\t}\n\n\t\t// Method called when the layer is added to the map\n\t\tonAdd(_map: maplibregl.Map, gl: WebGL2RenderingContext) {\n\t\t\t// create and initialize a WebGLBuffer to store vertex and color data\n\t\t\tthis.buffer = gl.createBuffer();\n\t\t\tgl.bindBuffer(gl.ARRAY_BUFFER, this.buffer);\n\t\t\tgl.bufferData(\n\t\t\t\tgl.ARRAY_BUFFER,\n\t\t\t\tnew Float32Array([helsinki.x, helsinki.y, kyiv.x, kyiv.y, berlin.x, berlin.y]),\n\t\t\t\tgl.STATIC_DRAW\n\t\t\t);\n\t\t\t// Explanation of horizon clipping in MapLibre globe projection:\n\t\t\t//\n\t\t\t// When zooming in, the triangle will eventually start doing what at first glance\n\t\t\t// appears to be clipping the underlying map.\n\t\t\t//\n\t\t\t// Instead it is being clipped by the \"horizon\" plane, which the globe uses to\n\t\t\t// clip any geometry behind horizon (regular face culling isn't enough).\n\t\t\t// The horizon plane is not necessarily aligned with the near/far planes.\n\t\t\t// The clipping is done by assigning a custom value to `gl_Position.z` in the `projectTile`\n\t\t\t// MapLibre uses a constant z value per layer, so `gl_Position.z` can be anything,\n\t\t\t// since it later gets overwritten by `glDepthRange`.\n\t\t\t//\n\t\t\t// At high zooms, the triangle's three vertices can end up beyond the horizon plane,\n\t\t\t// resulting in the triangle getting clipped.\n\t\t\t//\n\t\t\t// This can be fixed by subdividing the triangle's geometry.\n\t\t\t// This is in general advisable to do, since without subdivision\n\t\t\t// geometry would not project to a curved shape under globe projection.\n\t\t\t// MapLibre also internally subdivides all geometry when globe projection is used.\n\t\t}\n\n\t\t// Method fired on each animation frame\n\t\trender(gl: WebGL2RenderingContext | WebGLRenderingContext, args: maplibregl.CustomRenderMethodInput) {\n\t\t\tconst program = this.getShader(gl, args.shaderData);\n\t\t\tgl.useProgram(program);\n\t\t\tgl.uniformMatrix4fv(\n\t\t\t\tgl.getUniformLocation(program, 'u_projection_matrix'),\n\t\t\t\tfalse,\n\t\t\t\targs.defaultProjectionData.mainMatrix\n\t\t\t);\n\t\t\tgl.uniformMatrix4fv(\n\t\t\t\tgl.getUniformLocation(program, 'u_projection_fallback_matrix'),\n\t\t\t\tfalse,\n\t\t\t\targs.defaultProjectionData.fallbackMatrix\n\t\t\t);\n\t\t\tgl.uniform1f(\n\t\t\t\tgl.getUniformLocation(program, 'u_projection_transition'),\n\t\t\t\targs.defaultProjectionData.projectionTransition\n\t\t\t);\n\t\t\tgl.uniform4f(\n\t\t\t\tgl.getUniformLocation(program, 'u_projection_tile_mercator_coords'),\n\t\t\t\t...args.defaultProjectionData.tileMercatorCoords\n\t\t\t);\n\t\t\tgl.uniform4f(\n\t\t\t\tgl.getUniformLocation(program, 'u_projection_clipping_plane'),\n\t\t\t\t...args.defaultProjectionData.clippingPlane\n\t\t\t);\n\n\t\t\tgl.bindBuffer(gl.ARRAY_BUFFER, this.buffer);\n\t\t\tgl.enableVertexAttribArray(this.aPos);\n\t\t\tgl.vertexAttribPointer(this.aPos, 2, gl.FLOAT, false, 0, 0);\n\t\t\tgl.enable(gl.BLEND);\n\t\t\tgl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);\n\t\t\tgl.drawArrays(gl.TRIANGLE_STRIP, 0, 3);\n\t\t}\n\t}\n</script>\n\n<MapLibre\n\tclass=\"h-[55vh] min-h-[300px]\"\n\tstyle=\"https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json\"\n\tzoom={3}\n\tcenter={[20, 58]}\n>\n\t<CustomLayer implementation={new CustomLayerImpl()} />\n\t<Projection type=\"globe\" />\n\t<GlobeControl />\n</MapLibre>\n"
  },
  {
    "path": "src/content/examples/custom-layer/content.svelte.md",
    "content": "---\ntitle: Custom Layer\ndescription: Use a custom layer to draw simple WebGL content on a globe.\noriginal: https://maplibre.org/maplibre-gl-js/docs/examples/globe-custom-simple/\n---\n\n<script lang=\"ts\">\n  import Demo from \"./CustomLayer.svelte\";\n  import demoRaw from \"./CustomLayer.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/custom-protocol/CustomProtocol.svelte",
    "content": "<script lang=\"ts\">\n\timport {\n\t\tMapLibre,\n\t\tRasterTileSource,\n\t\tVectorTileSource,\n\t\tRasterLayer,\n\t\tLineLayer,\n\t\tFillLayer,\n\t\tProtocol\n\t} from 'svelte-maplibre-gl';\n\timport { PMTilesProtocol } from '@svelte-maplibre-gl/pmtiles';\n\timport maplibregl from 'maplibre-gl';\n\n\tconst myProtocolLoadFn: maplibregl.AddProtocolAction = async (params) => {\n\t\tconst zxy = params.url.replace('myprotocol://', '');\n\t\tconst [z, x, y] = zxy.split('/').map((v) => parseInt(v, 10));\n\n\t\tconst png = await new Promise((resolve) => {\n\t\t\tconst canvas = document.createElement('canvas');\n\t\t\tcanvas.width = 512;\n\t\t\tcanvas.height = 512;\n\t\t\tconst context = canvas.getContext('2d')!;\n\n\t\t\t// checkered pattern\n\t\t\tcontext.fillStyle = (z + x - y) % 2 === 0 ? 'rgba(255, 255, 255, 0.4)' : 'rgba(0, 0, 0, 0.4)';\n\t\t\tcontext.fillRect(0, 0, canvas.width, canvas.height);\n\t\t\tcontext.fillStyle = 'white';\n\t\t\tcontext.font = '32px sans-serif';\n\t\t\tcontext.fillText(`${z}/${x}/${y}`, 32, 64);\n\n\t\t\t// canvas -> Blob (png) -> ArrayBuffer\n\t\t\tcanvas.toBlob(async (blob) => {\n\t\t\t\tresolve(await blob!.arrayBuffer());\n\t\t\t});\n\t\t});\n\n\t\treturn { data: png };\n\t};\n</script>\n\n<!-- Adds a custom resource loading function to handle URLs that start with a custom URL scheme. -->\n<PMTilesProtocol />\n<Protocol scheme=\"myprotocol\" loadFn={myProtocolLoadFn} />\n\n<!-- Use custom protocols -->\n<MapLibre class=\"h-[55vh] min-h-[200px]\" zoom={6} center={{ lng: 140.0, lat: 37.5 }}>\n\t<VectorTileSource url=\"pmtiles://https://tile.openstreetmap.jp/static/planet.pmtiles\">\n\t\t<LineLayer sourceLayer=\"transportation\" paint={{ 'line-color': 'orange' }} />\n\t\t<FillLayer sourceLayer=\"water\" paint={{ 'fill-color': 'dodgerblue' }} />\n\t\t<LineLayer sourceLayer=\"building\" paint={{ 'line-color': 'lime' }} />\n\t</VectorTileSource>\n\t<RasterTileSource tiles={['myprotocol://{z}/{x}/{y}']} tileSize={256}>\n\t\t<RasterLayer />\n\t</RasterTileSource>\n</MapLibre>\n"
  },
  {
    "path": "src/content/examples/custom-protocol/content.svelte.md",
    "content": "---\ntitle: Custom Protocols\ndescription: Add a custom resource loading function to handle a custom URL scheme.\n---\n\n<script lang=\"ts\">\n  import Demo from \"./CustomProtocol.svelte\";\n  import demoRaw from \"./CustomProtocol.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/deckgl-overlay/DeckGL.svelte",
    "content": "<script lang=\"ts\">\n\timport { onMount } from 'svelte';\n\timport { MapLibre, FillExtrusionLayer } from 'svelte-maplibre-gl';\n\timport { DeckGLOverlay } from '@svelte-maplibre-gl/deckgl';\n\timport { ArcLayer } from '@deck.gl/layers';\n\n\tconst NUM = 30;\n\tlet data: { source: [number, number]; target: [number, number] }[] = $state([]);\n\n\tonMount(() => {\n\t\tlet handle = requestAnimationFrame(function updateFrame(t) {\n\t\t\tdata = Array.from({ length: NUM }, (_, i) => {\n\t\t\t\tconst O = (2 * Math.PI) / NUM;\n\t\t\t\tconst r = (1.3 + Math.sin(t / 510 + i * O)) * 0.002;\n\t\t\t\treturn {\n\t\t\t\t\tsource: [139.7672, 35.6812],\n\t\t\t\t\ttarget: [139.7672 + Math.cos(t / 730 + i * O) * r, 35.6812 + Math.sin(t / 730 + i * O) * r]\n\t\t\t\t};\n\t\t\t});\n\t\t\thandle = requestAnimationFrame(updateFrame);\n\t\t});\n\t\treturn () => cancelAnimationFrame(handle);\n\t});\n</script>\n\n<MapLibre\n\tclass=\"h-[55vh] min-h-[300px]\"\n\tstyle=\"https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json\"\n\tzoom={15}\n\tpitch={60}\n\tminZoom={4}\n\tbearing={-45}\n\tcenter={[139.7672, 35.6812]}\n>\n\t<DeckGLOverlay\n\t\tinterleaved\n\t\tlayers={[\n\t\t\tnew ArcLayer({\n\t\t\t\tid: 'deckgl-arc',\n\t\t\t\tdata,\n\t\t\t\tgetSourcePosition: (d) => d.source,\n\t\t\t\tgetTargetPosition: (d) => d.target,\n\t\t\t\tgetSourceColor: [0, 255, 100],\n\t\t\t\tgetTargetColor: [0, 190, 255],\n\t\t\t\tgetWidth: 5\n\t\t\t})\n\t\t]}\n\t/>\n\t<FillExtrusionLayer\n\t\tsource=\"carto\"\n\t\tsourceLayer=\"building\"\n\t\tminzoom={14}\n\t\tpaint={{\n\t\t\t'fill-extrusion-color': '#aaa',\n\t\t\t'fill-extrusion-height': ['interpolate', ['linear'], ['zoom'], 14, 0, 14.05, ['get', 'render_height']],\n\t\t\t'fill-extrusion-base': ['interpolate', ['linear'], ['zoom'], 14, 0, 14.05, ['get', 'render_min_height']],\n\t\t\t'fill-extrusion-opacity': 0.8\n\t\t}}\n\t/>\n</MapLibre>\n"
  },
  {
    "path": "src/content/examples/deckgl-overlay/content.svelte.md",
    "content": "---\ntitle: deck.gl Overlay\ndescription: Interleaving deck.gl with MapLibre layers\noriginal: https://deck.gl/gallery/maplibre-overlay\n---\n\n<script lang=\"ts\">\n  import Demo from \"./DeckGL.svelte\";\n  import demoRaw from \"./DeckGL.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/dynamic-image/DynamicImage.svelte",
    "content": "<script lang=\"ts\">\n\timport { MapLibre, Image, GeoJSONSource, SymbolLayer } from 'svelte-maplibre-gl';\n\n\tconst size = 64;\n\tconst data = new Uint8Array(size * size * 4);\n\n\tlet p = 0;\n\tfor (let x = 0; x < size; x++) {\n\t\tfor (let y = 0; y < size; y++) {\n\t\t\tdata[p + 0] = (y / size) * 255;\n\t\t\tdata[p + 1] = (x / size) * 255;\n\t\t\tdata[p + 2] = 128;\n\t\t\tdata[p + 3] = 255;\n\t\t\tp += 4;\n\t\t}\n\t}\n</script>\n\n<MapLibre\n\tclass=\"h-[55vh] min-h-[300px]\"\n\tstyle=\"https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json\"\n\tzoom={4}\n\tcenter={{ lng: 137, lat: 36 }}\n>\n\t<Image id=\"gradient\" image={{ width: size, height: size, data }} />\n\t<GeoJSONSource\n\t\tdata={{\n\t\t\ttype: 'FeatureCollection',\n\t\t\tfeatures: [\n\t\t\t\t{\n\t\t\t\t\ttype: 'Feature',\n\t\t\t\t\tgeometry: {\n\t\t\t\t\t\ttype: 'Point',\n\t\t\t\t\t\tcoordinates: [137, 36]\n\t\t\t\t\t},\n\t\t\t\t\tproperties: {}\n\t\t\t\t}\n\t\t\t]\n\t\t}}\n\t>\n\t\t<SymbolLayer layout={{ 'icon-image': 'gradient' }} />\n\t</GeoJSONSource>\n</MapLibre>\n"
  },
  {
    "path": "src/content/examples/dynamic-image/content.svelte.md",
    "content": "---\ntitle: Dynamic Image\ndescription: Add an icon to the map that was generated at runtime.\noriginal: https://maplibre.org/maplibre-gl-js/docs/examples/add-image-generated/\n---\n\n<script lang=\"ts\">\n  import Demo from \"./DynamicImage.svelte\";\n  import demoRaw from \"./DynamicImage.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/fullscreen/Fullscreen.svelte",
    "content": "<script lang=\"ts\">\n\timport { MapLibre, FullScreenControl } from 'svelte-maplibre-gl';\n</script>\n\n<MapLibre\n\tclass=\"h-[55vh] min-h-[300px] border-8 border-slate-500\"\n\tstyle=\"https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json\"\n>\n\t<FullScreenControl position=\"top-left\" />\n</MapLibre>\n"
  },
  {
    "path": "src/content/examples/fullscreen/content.svelte.md",
    "content": "---\ntitle: Fullscreen\ndescription: View a fullscreen map\noriginal: https://maplibre.org/maplibre-gl-js/docs/examples/fullscreen/\n---\n\n<script lang=\"ts\">\n  import Demo from \"./Fullscreen.svelte\";\n  import demoRaw from \"./Fullscreen.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/geolocate/Geolocate.svelte",
    "content": "<script lang=\"ts\">\n\timport { MapLibre, GeolocateControl } from 'svelte-maplibre-gl';\n\n\tlet logString = $state('Press the GeolocateControl button.\\n');\n\tfunction log(s: string) {\n\t\tlogString += '» ' + s + '\\n';\n\t}\n</script>\n\n<div class=\"flex h-[55vh] min-h-[300px] overflow-hidden rounded-md\">\n\t<pre class=\"m-0! h-full flex-1 rounded-none\">{logString}</pre>\n\t<MapLibre class=\"h-full flex-1\" style=\"https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json\">\n\t\t<GeolocateControl\n\t\t\tposition=\"top-left\"\n\t\t\tpositionOptions={{ enableHighAccuracy: true }}\n\t\t\ttrackUserLocation={true}\n\t\t\tshowAccuracyCircle={true}\n\t\t\tontrackuserlocationstart={() => log('trackuserlocationstart')}\n\t\t\tontrackuserlocationend={() => log('trackuserlocationend')}\n\t\t\tongeolocate={(ev) => log(`geolocate ${JSON.stringify(ev.coords, null, 2)}`)}\n\t\t/>\n\t</MapLibre>\n</div>\n"
  },
  {
    "path": "src/content/examples/geolocate/content.svelte.md",
    "content": "---\ntitle: Locate the User\ndescription: Locate the User\noriginal: https://maplibre.org/maplibre-gl-js/docs/examples/locate-user/\n---\n\n<script lang=\"ts\">\n  import Demo from \"./Geolocate.svelte\";\n  import demoRaw from \"./Geolocate.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/global-state/Plain.svelte",
    "content": "<script lang=\"ts\">\n\timport { Label } from '$lib/components/ui/label';\n\timport { MapLibre, GeoJSONSource, CircleLayer, SymbolLayer } from 'svelte-maplibre-gl';\n\n\tlet type = $state('');\n</script>\n\n<MapLibre\n\tclass=\"h-[55vh] min-h-75\"\n\tstyle=\"https://demotiles.maplibre.org/style.json\"\n\tzoom={9}\n\tcenter={[9.0679, 45.9]}\n\tglobalState={{\n\t\ttype: type\n\t}}\n>\n\t<GeoJSONSource data=\"https://maplibre.org/maplibre-gl-js/docs/assets/funicolares-and-funivias-como.json\">\n\t\t<SymbolLayer\n\t\t\tlayout={{\n\t\t\t\t'text-field': '{name}',\n\t\t\t\t'text-font': ['Open Sans Semibold'],\n\t\t\t\t'text-offset': [0, 1],\n\t\t\t\t'text-anchor': 'top'\n\t\t\t}}\n\t\t\tpaint={{\n\t\t\t\t'text-color': '#000000',\n\t\t\t\t'text-halo-color': '#ffffff',\n\t\t\t\t'text-halo-width': 2\n\t\t\t}}\n\t\t\tfilter={[\n\t\t\t\t'case',\n\t\t\t\t['==', ['to-string', ['global-state', 'type']], ''],\n\t\t\t\ttrue,\n\t\t\t\t['==', ['get', 'type'], ['global-state', 'type']]\n\t\t\t]}\n\t\t/>\n\t\t<CircleLayer\n\t\t\tpaint={{\n\t\t\t\t'circle-radius': 5,\n\t\t\t\t'circle-color': '#000000'\n\t\t\t}}\n\t\t\tfilter={[\n\t\t\t\t'case',\n\t\t\t\t['==', ['to-string', ['global-state', 'type']], ''],\n\t\t\t\ttrue,\n\t\t\t\t['==', ['get', 'type'], ['global-state', 'type']]\n\t\t\t]}\n\t\t/>\n\t</GeoJSONSource>\n\n\t<!-- Controls -->\n\t<div\n\t\tclass=\"absolute top-3 left-3 z-10 flex min-w-50 flex-col items-stretch gap-1 rounded bg-background/60 p-3 text-sm backdrop-blur-sm\"\n\t>\n\t\t<div class=\"flex items-center justify-between space-x-2\">\n\t\t\t<Label for=\"global-state-type\" class=\"leading-none\">global-state: type =</Label>\n\t\t\t<select bind:value={type} id=\"global-state-type\" class=\"text-center\">\n\t\t\t\t<option value=\"\">\"\" (All)</option>\n\t\t\t\t<option value=\"lift\">\"lift\"</option>\n\t\t\t\t<option value=\"railway\">\"railway\"</option>\n\t\t\t</select>\n\t\t</div>\n\t</div>\n</MapLibre>\n"
  },
  {
    "path": "src/content/examples/global-state/content.svelte.md",
    "content": "---\ntitle: Global State\ndescription: Filter a layer symbols based on user input using setGlobalStateProperty().\noriginal: https://maplibre.org/maplibre-gl-js/docs/examples/filter-layer-symbols-using-global-state/\n---\n\n<script lang=\"ts\">\n  import Demo from \"./Plain.svelte\";\n  import demoRaw from \"./Plain.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/globe-atmosphere/Globe.svelte",
    "content": "<script lang=\"ts\">\n\timport { MapLibre, Projection, Sky, Light } from 'svelte-maplibre-gl';\n\n\tlet thetaDeg = $state(135);\n\tlet phiDeg = $state(0);\n\tlet p = $derived(\n\t\t(Math.acos(Math.cos((thetaDeg / 180 + 1) * Math.PI) * Math.cos((phiDeg / 180) * Math.PI)) / Math.PI) * 180\n\t);\n\tlet a = $derived(\n\t\t90 +\n\t\t\t(Math.atan2(\n\t\t\t\tMath.sin((phiDeg / 180) * Math.PI),\n\t\t\t\tMath.sin((thetaDeg / 180 + 1) * Math.PI) * Math.cos((phiDeg / 180) * Math.PI)\n\t\t\t) /\n\t\t\t\tMath.PI) *\n\t\t\t\t180\n\t);\n</script>\n\n<MapLibre\n\tclass=\"h-[55vh] min-h-[300px]\"\n\tstyle=\"https://basemaps.cartocdn.com/gl/dark-matter-gl-style/style.json\"\n\tzoom={1.5}\n\tcenter={{ lng: 155, lat: 45 }}\n>\n\t<Projection type=\"globe\" />\n\t<Light anchor=\"map\" position={[100, a, p]} />\n\t<Sky atmosphere-blend={['interpolate', ['linear'], ['zoom'], 0, 1, 5, 1, 7, 0]} />\n\n\t<!-- Control -->\n\t<div\n\t\tclass=\"absolute top-3 left-3 z-10 flex min-w-[200px] flex-col items-stretch gap-1 rounded bg-background/60 p-3 text-sm backdrop-blur-sm\"\n\t>\n\t\t<div class=\"mb-4 flex flex-col items-center space-y-2 px-2\">\n\t\t\t<label for=\"theta\" class=\"leading-none\">Theta ({thetaDeg})</label>\n\t\t\t<input type=\"range\" id=\"theta\" bind:value={thetaDeg} min={-180} max={180} />\n\t\t</div>\n\t\t<div class=\"mb-4 flex flex-col items-center space-y-2 px-2\">\n\t\t\t<label for=\"phi\" class=\"leading-none\">Phi ({phiDeg.toFixed(1)})</label>\n\t\t\t<input type=\"range\" id=\"phi\" bind:value={phiDeg} min={-90} max={90} step={0.1} />\n\t\t</div>\n\t</div>\n</MapLibre>\n"
  },
  {
    "path": "src/content/examples/globe-atmosphere/content.svelte.md",
    "content": "---\ntitle: Globe with an atmosphere\ndescription: Display a globe with an atmosphere.\noriginal: https://maplibre.org/maplibre-gl-js/docs/examples/globe-atmosphere/\n---\n\n<script lang=\"ts\">\n  import Demo from \"./Globe.svelte\";\n  import demoRaw from \"./Globe.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/hover-styles/HoverStyles.svelte",
    "content": "<script lang=\"ts\">\n\timport { FillLayer, LineLayer, MapLibre, GeoJSONSource, FeatureState, Popup } from 'svelte-maplibre-gl';\n\timport maplibregl from 'maplibre-gl';\n\tlet hoveredFeature: maplibregl.MapGeoJSONFeature | undefined = $state.raw();\n\tlet lnglat = $state.raw(new maplibregl.LngLat(0, 0));\n</script>\n\n<MapLibre\n\tclass=\"h-[55vh] min-h-[300px]\"\n\tstyle=\"https://basemaps.cartocdn.com/gl/dark-matter-gl-style/style.json\"\n\tzoom={2}\n\tcenter={{ lng: -100.486052, lat: 37.830348 }}\n>\n\t<GeoJSONSource data=\"https://maplibre.org/maplibre-gl-js/docs/assets/us_states.geojson\">\n\t\t<FillLayer\n\t\t\tpaint={{\n\t\t\t\t'fill-color': '#00ff55',\n\t\t\t\t// Change the opacity for the hovered feature\n\t\t\t\t'fill-opacity': ['case', ['boolean', ['feature-state', 'hover'], false], 0.4, 0.1]\n\t\t\t}}\n\t\t\tonmousemove={(ev) => {\n\t\t\t\t// Listen to mousemove events to track the hovered feature\n\t\t\t\thoveredFeature = ev.features?.[0];\n\t\t\t\tlnglat = ev.lngLat; // cursor location\n\t\t\t}}\n\t\t\tonmouseleave={() => (hoveredFeature = undefined)}\n\t\t/>\n\t\t<LineLayer\n\t\t\tpaint={{\n\t\t\t\t'line-color': '#00ff55',\n\t\t\t\t// Change the opacity for the hovered feature\n\t\t\t\t'line-opacity': ['case', ['boolean', ['feature-state', 'hover'], false], 1, 0.3],\n\t\t\t\t'line-width': 1\n\t\t\t}}\n\t\t/>\n\t\t{#if hoveredFeature}\n\t\t\t<!-- Set the hover state on the source for the hovered feature -->\n\t\t\t<FeatureState id={hoveredFeature.id} state={{ hover: true }} />\n\t\t\t<Popup {lnglat} closeButton={false}>{hoveredFeature.properties.STATE_NAME}</Popup>\n\t\t{/if}\n\t</GeoJSONSource>\n</MapLibre>\n"
  },
  {
    "path": "src/content/examples/hover-styles/content.svelte.md",
    "content": "---\ntitle: Hover Styles\ndescription: Use events and feature states to create a per feature hover effect.\noriginal: https://maplibre.org/maplibre-gl-js/docs/examples/hover-styles/\n---\n\n<script lang=\"ts\">\n  import Demo from \"./HoverStyles.svelte\";\n  import demoRaw from \"./HoverStyles.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/image-loader/Images.svelte",
    "content": "<script lang=\"ts\">\n\timport { MapLibre, ImageLoader, GeoJSONSource, SymbolLayer } from 'svelte-maplibre-gl';\n\timport type { FeatureCollection } from 'geojson';\n\n\tlet data: FeatureCollection = {\n\t\ttype: 'FeatureCollection',\n\t\tfeatures: [\n\t\t\t{\n\t\t\t\ttype: 'Feature',\n\t\t\t\tgeometry: { type: 'Point', coordinates: [-48.47279, -1.44585] },\n\t\t\t\tproperties: { imageName: 'osgeo', year: 2024 }\n\t\t\t},\n\t\t\t{\n\t\t\t\ttype: 'Feature',\n\t\t\t\tgeometry: { type: 'Point', coordinates: [0, 0] },\n\t\t\t\tproperties: { imageName: 'cat', scale: 0.2 }\n\t\t\t},\n\t\t\t{\n\t\t\t\ttype: 'Feature',\n\t\t\t\tgeometry: { type: 'Point', coordinates: [40, -30] },\n\t\t\t\tproperties: { imageName: 'popup-debug', name: 'Line 1\\nLine 2\\nLine 3' }\n\t\t\t},\n\t\t\t{\n\t\t\t\ttype: 'Feature',\n\t\t\t\tgeometry: { type: 'Point', coordinates: [-40, -30] },\n\t\t\t\tproperties: { imageName: 'popup-debug', name: 'One longer line' }\n\t\t\t}\n\t\t]\n\t};\n</script>\n\n<MapLibre\n\tclass=\"h-[55vh] min-h-[300px]\"\n\tstyle=\"https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json\"\n\tzoom={1.5}\n\tcenter={{ lng: -10.0, lat: -20 }}\n>\n\t<GeoJSONSource {data}>\n\t\t<ImageLoader\n\t\t\timages={{\n\t\t\t\tosgeo: 'https://maplibre.org/maplibre-gl-js/docs/assets/osgeo-logo.png',\n\t\t\t\tcat: 'https://upload.wikimedia.org/wikipedia/commons/7/7c/201408_cat.png',\n\t\t\t\t'popup-debug': [\n\t\t\t\t\t'https://maplibre.org/maplibre-gl-js/docs/assets/popup_debug.png',\n\t\t\t\t\t{\n\t\t\t\t\t\t// stretchable image\n\t\t\t\t\t\tstretchX: [\n\t\t\t\t\t\t\t[25, 55],\n\t\t\t\t\t\t\t[85, 115]\n\t\t\t\t\t\t],\n\t\t\t\t\t\tstretchY: [[25, 100]],\n\t\t\t\t\t\tcontent: [25, 25, 115, 100],\n\t\t\t\t\t\tpixelRatio: 2\n\t\t\t\t\t}\n\t\t\t\t]\n\t\t\t}}\n\t\t>\n\t\t\t<!-- Children components will be added after all images have been loaded -->\n\t\t\t<SymbolLayer\n\t\t\t\tlayout={{\n\t\t\t\t\t'text-field': ['get', 'name'],\n\t\t\t\t\t'icon-image': ['get', 'imageName'],\n\t\t\t\t\t'icon-size': ['number', ['get', 'scale'], 1],\n\t\t\t\t\t'icon-text-fit': 'both',\n\t\t\t\t\t'icon-overlap': 'always',\n\t\t\t\t\t'text-overlap': 'always'\n\t\t\t\t}}\n\t\t\t/>\n\t\t</ImageLoader>\n\t</GeoJSONSource>\n</MapLibre>\n"
  },
  {
    "path": "src/content/examples/image-loader/content.svelte.md",
    "content": "---\ntitle: Load Images from URLs\ndescription: Utility for loading images from URLs\noriginal: https://maplibre.org/maplibre-gl-js/docs/examples/add-image-stretchable/\n---\n\n<script lang=\"ts\">\n  import Demo from \"./Images.svelte\";\n  import demoRaw from \"./Images.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/limit-interaction/LimitInteraction.svelte",
    "content": "<script lang=\"ts\">\n\timport { MapLibre } from 'svelte-maplibre-gl';\n\n\timport { Checkbox } from '$lib/components/ui/checkbox/index.js';\n\timport { Label } from '$lib/components/ui/label/index.js';\n\timport { Slider } from '$lib/components/ui/slider/index.js';\n\n\tlet zoomRange = $state([5, 11]);\n\tlet pitchRange = $state([0, 60]);\n\tlet boxZoom = $state(true);\n\tlet doubleClickZoom = $state(true);\n\tlet dragRotate = $state(true);\n\tlet dragPan = $state(true);\n\tlet keyboard = $state(true);\n\tlet scrollZoom = $state(true);\n\tlet touchZoomRotate = $state(true);\n\tlet touchPitch = $state(true);\n</script>\n\n<MapLibre\n\tclass=\"relative h-[55vh] min-h-[300px]\"\n\tstyle=\"https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json\"\n\tzoom={5}\n\tcenter={{ lng: 137, lat: 36 }}\n\t{doubleClickZoom}\n\t{boxZoom}\n\t{keyboard}\n\t{dragRotate}\n\t{dragPan}\n\t{scrollZoom}\n\t{touchZoomRotate}\n\t{touchPitch}\n\tminZoom={zoomRange[0]}\n\tmaxZoom={zoomRange[1]}\n\tminPitch={pitchRange[0]}\n\tmaxPitch={pitchRange[1]}\n>\n\t<div class=\"absolute top-3 right-3 z-10 flex flex-col gap-1 rounded bg-background/60 p-3 text-sm backdrop-blur-sm\">\n\t\t<div class=\"mb-3 flex flex-col items-center space-y-2.5 px-2\">\n\t\t\t<Label for=\"zoom\" class=\"leading-none\">Zoom Range ({zoomRange})</Label>\n\t\t\t<Slider type=\"multiple\" id=\"zoom\" bind:value={zoomRange} min={0} max={22} />\n\t\t</div>\n\t\t<div class=\"mb-3 flex flex-col items-center space-y-2.5 px-2\">\n\t\t\t<Label for=\"pitch\" class=\"leading-none\">Pitch Range ({pitchRange})</Label>\n\t\t\t<Slider type=\"multiple\" id=\"pitch\" bind:value={pitchRange} min={0} max={90} />\n\t\t</div>\n\t\t<div class=\"flex items-center space-x-2\">\n\t\t\t<Checkbox id=\"scrollZoom\" bind:checked={scrollZoom} />\n\t\t\t<Label for=\"scrollZoom\" class=\"leading-none\">Scroll Zoom</Label>\n\t\t</div>\n\t\t<div class=\"flex items-center space-x-2\">\n\t\t\t<Checkbox id=\"boxZoom\" bind:checked={boxZoom} />\n\t\t\t<Label for=\"boxZoom\" class=\"leading-none\">Box Zoom</Label>\n\t\t</div>\n\t\t<div class=\"flex items-center space-x-2\">\n\t\t\t<Checkbox id=\"dragPan\" bind:checked={dragPan} />\n\t\t\t<Label for=\"dragPan\" class=\"leading-none\">Drag Pan</Label>\n\t\t</div>\n\t\t<div class=\"flex items-center space-x-2\">\n\t\t\t<Checkbox id=\"dragRotate\" bind:checked={dragRotate} />\n\t\t\t<Label for=\"dragRotate\" class=\"leading-none\">Drag Rotate</Label>\n\t\t</div>\n\t\t<div class=\"flex items-center space-x-2\">\n\t\t\t<Checkbox id=\"doubleClickZoom\" bind:checked={doubleClickZoom} />\n\t\t\t<Label for=\"doubleClickZoom\" class=\"leading-none\">Double Click Zoom</Label>\n\t\t</div>\n\t\t<div class=\"flex items-center space-x-2\">\n\t\t\t<Checkbox id=\"keyboard\" bind:checked={keyboard} />\n\t\t\t<Label for=\"keyboard\" class=\"leading-none\">Keyboard</Label>\n\t\t</div>\n\t\t<div class=\"flex items-center space-x-2\">\n\t\t\t<Checkbox id=\"touchZoomRotate\" bind:checked={touchZoomRotate} />\n\t\t\t<Label for=\"touchZoomRotate\" class=\"leading-none\">Touch Zoom Rotate</Label>\n\t\t</div>\n\t\t<div class=\"flex items-center space-x-2\">\n\t\t\t<Checkbox id=\"touchPitch\" bind:checked={touchPitch} />\n\t\t\t<Label for=\"touchPitch\" class=\"leading-none\">Touch Pitch</Label>\n\t\t</div>\n\t</div>\n</MapLibre>\n"
  },
  {
    "path": "src/content/examples/limit-interaction/content.svelte.md",
    "content": "---\ntitle: Limit Map Interactions\ndescription: Set the zoom/pitch range and toggle UI handlers on the map.\noriginal: https://maplibre.org/maplibre-gl-js/docs/examples/toggle-interaction-handlers/\n---\n\n<script lang=\"ts\">\n  import Demo from \"./LimitInteraction.svelte\";\n  import demoRaw from \"./LimitInteraction.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/marker-popup/MarkerAndPopup.svelte",
    "content": "<script lang=\"ts\">\n\timport maplibregl from 'maplibre-gl';\n\timport { MapLibre, Marker, Popup } from 'svelte-maplibre-gl';\n\n\tlet lnglat = $state({ lng: 139.767052, lat: 35.681167 });\n\tlet lngLatText = $derived(`(${lnglat.lat.toFixed(3)}, ${lnglat.lng.toFixed(3)})`);\n\tlet popupOpen = $state(true);\n\tlet offset = $state(24);\n\n\tlet offsets: maplibregl.Offset = $derived({\n\t\ttop: [0, offset],\n\t\tbottom: [0, -offset],\n\t\tleft: [offset + 12, 0],\n\t\tright: [-offset - 12, 0],\n\t\tcenter: [0, 0],\n\t\t'top-left': [offset, offset],\n\t\t'top-right': [-offset, offset],\n\t\t'bottom-left': [offset, -offset],\n\t\t'bottom-right': [-offset, -offset]\n\t});\n</script>\n\n<div class=\"flex items-center gap-x-4 text-sm\">\n\t<label><input type=\"checkbox\" bind:checked={popupOpen} /> Popup Open</label>\n\t<label>Offset ({offset}): <input type=\"range\" min=\"0\" max=\"30\" bind:value={offset} /></label>\n\t<pre class=\"my-1 grow\">marker: {lngLatText}</pre>\n</div>\n\n<MapLibre\n\tstyle=\"https://basemaps.cartocdn.com/gl/dark-matter-gl-style/style.json\"\n\tclass=\"h-[55vh] min-h-[300px]\"\n\tzoom={10}\n\tcenter={[139.7, 35.7]}\n\tmaxPitch={85}\n\tattributionControl={false}\n>\n\t<Marker bind:lnglat draggable>\n\t\t{#snippet content()}\n\t\t\t<div class=\"text-center leading-none\">\n\t\t\t\t<div class=\"text-3xl\">🐶</div>\n\t\t\t\t<div class=\"font-bold text-white drop-shadow-xs\">{lngLatText}</div>\n\t\t\t</div>\n\t\t{/snippet}\n\t\t<Popup class=\"text-black\" bind:open={popupOpen} offset={offsets}>\n\t\t\t<span class=\"text-lg\">{lngLatText}</span>\n\t\t</Popup>\n\t</Marker>\n</MapLibre>\n"
  },
  {
    "path": "src/content/examples/marker-popup/content.svelte.md",
    "content": "---\ntitle: Marker and Popup\ndescription: Control marker and popup states using Svelte’s reactivity.\n---\n\n<script lang=\"ts\">\n  import Demo from \"./MarkerAndPopup.svelte\";\n  import demoRaw from \"./MarkerAndPopup.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/plain/Plain.svelte",
    "content": "<script lang=\"ts\">\n\timport { MapLibre, NavigationControl, ScaleControl, GlobeControl } from 'svelte-maplibre-gl';\n</script>\n\n<MapLibre\n\tclass=\"h-[55vh] min-h-[300px]\"\n\tstyle=\"https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json\"\n\tzoom={3.5}\n\tcenter={{ lng: 137, lat: 36 }}\n>\n\t<NavigationControl />\n\t<ScaleControl />\n\t<GlobeControl />\n</MapLibre>\n"
  },
  {
    "path": "src/content/examples/plain/content.svelte.md",
    "content": "---\ntitle: Plain Map\ndescription: A minimal example showing only the base map.\n---\n\n<script lang=\"ts\">\n  import Demo from \"./Plain.svelte\";\n  import demoRaw from \"./Plain.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/pmtiles/PMTiles.svelte",
    "content": "<script lang=\"ts\">\n\timport { MapLibre } from 'svelte-maplibre-gl';\n\timport { PMTilesProtocol } from '@svelte-maplibre-gl/pmtiles';\n\timport type { LayerSpecification } from 'maplibre-gl';\n\n\t// Extract the layers spec from the OSM style\n\tlet layers: LayerSpecification[] = $state.raw([]);\n\t$effect(() => {\n\t\tfetch('https://tile.openstreetmap.jp/styles/openmaptiles/style.json')\n\t\t\t.then((response) => response.json())\n\t\t\t.then((data) => {\n\t\t\t\tlayers = data['layers'].filter(\n\t\t\t\t\t(layer: LayerSpecification) => !('source' in layer) || layer.source === 'openmaptiles'\n\t\t\t\t);\n\t\t\t});\n\t});\n</script>\n\n<!-- Add pmtiles:// Protocol globally -->\n<PMTilesProtocol />\n\n<!-- Use the pmtiles:// protocol -->\n<MapLibre\n\tclass=\"h-[55vh] min-h-[200px]\"\n\tzoom={10}\n\tcenter={[12.484151635086198, 41.8960910478323]}\n\tstyle={{\n\t\tversion: 8,\n\t\tglyphs: 'https://tile.openstreetmap.jp/fonts/{fontstack}/{range}.pbf',\n\t\tsprite: 'https://tile.openstreetmap.jp/styles/openmaptiles/sprite',\n\t\tsources: {\n\t\t\topenmaptiles: {\n\t\t\t\ttype: 'vector',\n\t\t\t\turl: 'pmtiles://https://tile.openstreetmap.jp/static/planet.pmtiles',\n\t\t\t\tattribution: 'OSM Japan © OpenMapTiles © OpenStreetMap contributors'\n\t\t\t}\n\t\t},\n\t\tlayers\n\t}}\n></MapLibre>\n"
  },
  {
    "path": "src/content/examples/pmtiles/content.svelte.md",
    "content": "---\ntitle: PMTiles Protocol\ndescription: Uses the PMTiles plugin and the custom protocol to present a map.\noriginal: https://maplibre.org/maplibre-gl-js/docs/examples/pmtiles/\n---\n\n<script lang=\"ts\">\n  import Demo from \"./PMTiles.svelte\";\n  import demoRaw from \"./PMTiles.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/query-features/Query.svelte",
    "content": "<script lang=\"ts\">\n\timport {\n\t\tMapLibre,\n\t\tGeoJSONSource,\n\t\tCircleLayer,\n\t\tMarker,\n\t\tGlobeControl,\n\t\tQuerySourceFeatures,\n\t\tQueryRenderedFeatures\n\t} from 'svelte-maplibre-gl';\n\timport maplibregl from 'maplibre-gl';\n\timport * as Tabs from '$lib/components/ui/tabs/index.js';\n\n\tlet features: maplibregl.MapGeoJSONFeature[] = $state.raw([]);\n\tlet mode: 'source' | 'rendered' = $state('source');\n</script>\n\n<div class=\"flex h-[55vh] min-h-[300px] gap-x-3\">\n\t<MapLibre\n\t\tclass=\"h-[55vh] min-h-[300px] grow\"\n\t\tstyle=\"https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json\"\n\t\tzoom={3}\n\t\tcenter={{ lng: 120, lat: 20 }}\n\t>\n\t\t<GlobeControl />\n\t\t<GeoJSONSource\n\t\t\tid=\"earthquakes\"\n\t\t\tdata=\"https://maplibre.org/maplibre-gl-js/docs/assets/significant-earthquakes-2015.geojson\"\n\t\t\tpromoteId=\"ids\"\n\t\t>\n\t\t\t{#if mode == 'source'}\n\t\t\t\t<!-- map.querySourceFeatures() -->\n\t\t\t\t<QuerySourceFeatures bind:features>\n\t\t\t\t\t{#snippet children(feature: maplibregl.MapGeoJSONFeature)}\n\t\t\t\t\t\t{#if feature.geometry.type === 'Point'}\n\t\t\t\t\t\t\t<Marker lnglat={feature.geometry.coordinates as [number, number]} />\n\t\t\t\t\t\t{/if}\n\t\t\t\t\t{/snippet}\n\t\t\t\t</QuerySourceFeatures>\n\t\t\t{/if}\n\t\t\t<CircleLayer paint={{ 'circle-color': 'red', 'circle-radius': 4 }}>\n\t\t\t\t{#if mode == 'rendered'}\n\t\t\t\t\t<!-- map.queryRenderedFeatures() -->\n\t\t\t\t\t<QueryRenderedFeatures bind:features>\n\t\t\t\t\t\t{#snippet children(feature: maplibregl.MapGeoJSONFeature)}\n\t\t\t\t\t\t\t{#if feature.geometry.type === 'Point'}\n\t\t\t\t\t\t\t\t<Marker lnglat={feature.geometry.coordinates as [number, number]} />\n\t\t\t\t\t\t\t{/if}\n\t\t\t\t\t\t{/snippet}\n\t\t\t\t\t</QueryRenderedFeatures>\n\t\t\t\t{/if}\n\t\t\t</CircleLayer>\n\t\t</GeoJSONSource>\n\t</MapLibre>\n\n\t<!-- List of earthquakes -->\n\t<div class=\"relative basis-[10em]\">\n\t\t<Tabs.Root bind:value={mode} class=\"flex h-full flex-col\">\n\t\t\t<Tabs.List class=\"grid w-full grid-cols-2\">\n\t\t\t\t<Tabs.Trigger value=\"source\">Source</Tabs.Trigger>\n\t\t\t\t<Tabs.Trigger value=\"rendered\">Rendered</Tabs.Trigger>\n\t\t\t</Tabs.List>\n\t\t\t<Tabs.Content value=\"source\" class=\"min-h-0 shrink overflow-scroll\">\n\t\t\t\t<ul class=\"m-0 ml-2 overflow-scroll px-3 text-xs\">\n\t\t\t\t\t{#each features as feature (feature.id)}\n\t\t\t\t\t\t<li>{feature.properties.title}</li>\n\t\t\t\t\t{/each}\n\t\t\t\t</ul>\n\t\t\t</Tabs.Content>\n\t\t\t<Tabs.Content value=\"rendered\" class=\"min-h-0 shrink overflow-scroll\">\n\t\t\t\t<ul class=\"m-0 ml-4 overflow-scroll px-3 text-xs\">\n\t\t\t\t\t{#each features as feature (feature.id)}\n\t\t\t\t\t\t<li>{feature.properties.title}</li>\n\t\t\t\t\t{/each}\n\t\t\t\t</ul>\n\t\t\t</Tabs.Content>\n\t\t</Tabs.Root>\n\t</div>\n</div>\n"
  },
  {
    "path": "src/content/examples/query-features/content.svelte.md",
    "content": "---\ntitle: Query Features\ndescription: Query source and rendered features to place markers and display a list.\n---\n\n<script lang=\"ts\">\n  import Demo from \"./Query.svelte\";\n  import demoRaw from \"./Query.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/side-by-side/SideBySide.svelte",
    "content": "<script lang=\"ts\">\n\timport { MapLibre, Projection } from 'svelte-maplibre-gl';\n\n\timport { Label } from '$lib/components/ui/label/index.js';\n\timport { Switch } from '$lib/components/ui/switch/index.js';\n\timport * as RadioGroup from '$lib/components/ui/radio-group/index.js';\n\n\tlet center = $state({ lng: 137, lat: 36.5 });\n\tlet zoom = $state(4);\n\tlet bearing = $state(0);\n\tlet pitch = $state(0);\n\tlet roll: number | undefined = $state(undefined);\n\tlet elevation: number | undefined = $state(undefined);\n\n\tconst MODES = ['Side by Side', 'Split', 'Scope'] as const;\n\ttype Modes = (typeof MODES)[number];\n\n\tlet splitMode: Modes = $state('Side by Side');\n\tlet width = $state(0);\n\tlet globe = $state(false);\n\tlet point = $state({ x: 100, y: 100 });\n\n\texport const ro = (node: Element) => {\n\t\tconst ro = new ResizeObserver(([entry]) => (width = entry.contentRect.width));\n\t\tro.observe(node);\n\t\treturn { destroy: () => ro.disconnect() };\n\t};\n</script>\n\n<div class=\"mb-3 flex items-center justify-between\">\n\t<RadioGroup.Root bind:value={splitMode} class=\"flex flex-row gap-x-3\">\n\t\t{#each MODES as mode (mode)}\n\t\t\t<div class=\"flex items-center space-x-1\">\n\t\t\t\t<RadioGroup.Item value={mode} id={mode} />\n\t\t\t\t<Label for={mode}>{mode}</Label>\n\t\t\t</div>\n\t\t{/each}\n\t</RadioGroup.Root>\n\t<div class=\"flex items-center space-x-2\">\n\t\t<Switch id=\"globe\" bind:checked={globe} />\n\t\t<Label for=\"globe\">Globe</Label>\n\t</div>\n</div>\n\n<div\n\tclass=\"relative flex h-[55vh] min-h-[300px] flex-row-reverse\"\n\tuse:ro\n\trole=\"application\"\n\tonmousemove={(ev) => (point = { x: ev.offsetX, y: ev.offsetY })}\n>\n\t<MapLibre\n\t\tclass=\"flex-1\"\n\t\tstyle=\"https://basemaps.cartocdn.com/gl/dark-matter-gl-style/style.json\"\n\t\tbind:center\n\t\tbind:zoom\n\t\tbind:bearing\n\t\tbind:pitch\n\t\tbind:roll\n\t\tbind:elevation\n\t\tpadding={splitMode === 'Split' ? { left: 0, right: width / 2, top: 0, bottom: 0 } : undefined}\n\t>\n\t\t<Projection type={globe ? 'globe' : undefined} />\n\t</MapLibre>\n\t<MapLibre\n\t\tclass={splitMode === 'Scope' ? 'absolute! inset-0' : 'flex-1'}\n\t\tstyle=\"https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json\"\n\t\tinlineStyle={splitMode === 'Scope' ? `clip-path: circle(15% at ${point.x}px ${point.y}px);` : undefined}\n\t\tbind:center\n\t\tbind:zoom\n\t\tbind:bearing\n\t\tbind:pitch\n\t\tbind:roll\n\t\tbind:elevation\n\t\tattributionControl={false}\n\t\tpadding={splitMode === 'Split' ? { left: width / 2, right: 0, top: 0, bottom: 0 } : undefined}\n\t>\n\t\t<Projection type={globe ? 'globe' : undefined} />\n\t</MapLibre>\n</div>\n"
  },
  {
    "path": "src/content/examples/side-by-side/content.svelte.md",
    "content": "---\ntitle: Side by Side\ndescription: Synchronize two maps.\noriginal: https://visgl.github.io/react-maplibre/examples/side-by-side\n---\n\n<script lang=\"ts\">\n  import Demo from \"./SideBySide.svelte\";\n  import demoRaw from \"./SideBySide.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n    let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/terradraw/TerraDraw.svelte",
    "content": "<script lang=\"ts\">\n\timport { MapLibre, GlobeControl } from 'svelte-maplibre-gl';\n\timport { TerraDraw } from '@svelte-maplibre-gl/terradraw';\n\timport type { TerraDraw as Draw } from 'terra-draw';\n\timport {\n\t\tTerraDrawCircleMode,\n\t\tTerraDrawRectangleMode,\n\t\tTerraDrawFreehandMode,\n\t\tTerraDrawAngledRectangleMode,\n\t\tTerraDrawLineStringMode,\n\t\tTerraDrawPolygonMode,\n\t\tTerraDrawPointMode,\n\t\tTerraDrawSectorMode,\n\t\tTerraDrawSelectMode,\n\t\tTerraDrawSensorMode\n\t} from 'terra-draw';\n\n\tconst defaultSelectFlags = {\n\t\tfeature: {\n\t\t\tdraggable: true,\n\t\t\tcoordinates: {\n\t\t\t\tdeletable: true,\n\t\t\t\tmidpoints: true,\n\t\t\t\tdraggable: true\n\t\t\t}\n\t\t}\n\t};\n\tconst modes = [\n\t\tnew TerraDrawSelectMode({\n\t\t\tflags: {\n\t\t\t\tpoint: defaultSelectFlags,\n\t\t\t\tlinestring: defaultSelectFlags,\n\t\t\t\tpolygon: defaultSelectFlags,\n\t\t\t\tfreehand: defaultSelectFlags,\n\t\t\t\tcircle: defaultSelectFlags,\n\t\t\t\trectangle: defaultSelectFlags,\n\t\t\t\tsector: defaultSelectFlags,\n\t\t\t\tsensor: defaultSelectFlags,\n\t\t\t\t'angled-rectangle': defaultSelectFlags\n\t\t\t}\n\t\t}),\n\t\tnew TerraDrawPointMode(),\n\t\tnew TerraDrawLineStringMode(),\n\t\tnew TerraDrawPolygonMode(),\n\t\tnew TerraDrawCircleMode(),\n\t\tnew TerraDrawSectorMode(),\n\t\tnew TerraDrawSensorMode(),\n\t\tnew TerraDrawRectangleMode(),\n\t\tnew TerraDrawFreehandMode(),\n\t\tnew TerraDrawAngledRectangleMode()\n\t];\n\tconst modeNames = modes.map((mode) => mode.mode);\n\tlet mode = $state('select');\n\tlet selected: string | number | null = $state(null);\n\tlet draw: Draw | undefined = $state.raw();\n</script>\n\n<MapLibre\n\tclass=\"h-[55vh] min-h-[300px]\"\n\tstyle=\"https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json\"\n\tzoom={2}\n\tcenter={{ lng: 60, lat: 20 }}\n>\n\t<!-- Terra Draw -->\n\t<TerraDraw\n\t\t{mode}\n\t\t{modes}\n\t\tbind:draw\n\t\tonselect={(featureId) => (selected = featureId)}\n\t\tondeselect={() => (selected = null)}\n\t\tonfinish={() => (mode = 'select')}\n\t/>\n\n\t<!-- Draw controls -->\n\t<div\n\t\tclass=\"absolute top-3 left-3 z-10 flex flex-col items-stretch gap-1 rounded bg-background/60 p-3 text-sm backdrop-blur-sm\"\n\t>\n\t\t{#each modeNames as modeName (modeName)}\n\t\t\t<label><input type=\"radio\" bind:group={mode} value={modeName} class=\"mr-1\" /> {modeName}</label>\n\t\t{/each}\n\t\t{#if selected}\n\t\t\t<button\n\t\t\t\tclass=\"mt-1 rounded border px-1\"\n\t\t\t\tonclick={() => {\n\t\t\t\t\tif (!selected) return;\n\t\t\t\t\tdraw?.removeFeatures([selected]);\n\t\t\t\t\tdraw?.deselectFeature(selected);\n\t\t\t\t}}>Remove</button\n\t\t\t>\n\t\t{/if}\n\t</div>\n\t<GlobeControl />\n</MapLibre>\n"
  },
  {
    "path": "src/content/examples/terradraw/content.svelte.md",
    "content": "---\ntitle: Terra Draw\ndescription: Use Terra Draw to draw a geometry in various forms such as point, line or polygon on your map.\n---\n\n<script lang=\"ts\">\n  import Demo from \"./TerraDraw.svelte\";\n  import demoRaw from \"./TerraDraw.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/terrain/Terrain.svelte",
    "content": "<script lang=\"ts\">\n\timport {\n\t\tHillshadeLayer,\n\t\tMapLibre,\n\t\tRasterDEMTileSource,\n\t\tSky,\n\t\tTerrain,\n\t\tTerrainControl,\n\t\tGlobeControl,\n\t\tLight\n\t} from 'svelte-maplibre-gl';\n\timport { Checkbox } from '$lib/components/ui/checkbox/index.js';\n\timport { Label } from '$lib/components/ui/label/index.js';\n\timport { Slider } from '$lib/components/ui/slider/index.js';\n\timport * as Tabs from '$lib/components/ui/tabs/index.js';\n\n\t// 'hillshade-method' option is available since Maplibre GL JS v5.5.0\n\t// Note that 'multidirectional' method doesn't work as intended in this\n\t// example because it requires multiple directions and colors. For the\n\t// details, please refer to the spec: https://maplibre.org/maplibre-style-spec/layers/#hillshade-method\n\tconst HILLSHADE_METHODS = ['standard', 'basic', 'combined', 'igor', 'multidirectional'] as const;\n\ttype HillshadeMethod = (typeof HILLSHADE_METHODS)[number];\n\n\tlet mode: 'terrain' | 'sky' = $state('terrain');\n\t// Terrain\n\tlet exaggeration = $state(1.0);\n\tlet hillshade = $state(0.7);\n\tlet hillshadeMethod: HillshadeMethod = $state(HILLSHADE_METHODS[0]);\n\tlet shadowColor = $state('#004050');\n\tlet accentColor = $state('#aaff00');\n\tlet highlightColor = $state('#ffffff');\n\tlet direction = $state(0.0);\n\tlet altitude = $state(45.0);\n\t// Sky\n\tlet skyEnabled = $state(true);\n\tlet skyColor = $state('#001560');\n\tlet horizonColor = $state('#0090c0');\n\tlet fogColor = $state('#ffffff');\n\tlet skyHorizonBlend = $state(0.5);\n\tlet horizonFogBlend = $state(0.7);\n\tlet fogGroundBlend = $state(0.5);\n</script>\n\n<MapLibre\n\tclass=\"h-[55vh] min-h-[300px]\"\n\tstyle=\"https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json\"\n\tzoom={12}\n\tpitch={72}\n\tmaxPitch={85}\n\tcenter={{ lng: 11.39085, lat: 47.3 }}\n>\n\t<GlobeControl />\n\t<Light anchor=\"map\" />\n\t{#if skyEnabled}\n\t\t<Sky\n\t\t\tsky-color={skyColor}\n\t\t\thorizon-color={horizonColor}\n\t\t\tfog-color={fogColor}\n\t\t\tsky-horizon-blend={skyHorizonBlend}\n\t\t\thorizon-fog-blend={horizonFogBlend}\n\t\t\tfog-ground-blend={fogGroundBlend}\n\t\t\tatmosphere-blend={0.5}\n\t\t/>\n\t{/if}\n\t<!-- Terrain -->\n\t<RasterDEMTileSource id=\"terrain\" url=\"https://tiles.mapterhorn.com/tilejson.json\">\n\t\t<TerrainControl position=\"top-right\" />\n\t\t<Terrain {exaggeration} />\n\t</RasterDEMTileSource>\n\t<!-- Hillshade -->\n\t<RasterDEMTileSource url=\"https://tiles.mapterhorn.com/tilejson.json\">\n\t\t<HillshadeLayer\n\t\t\tpaint={{\n\t\t\t\t'hillshade-method': hillshadeMethod,\n\t\t\t\t'hillshade-exaggeration': hillshade,\n\t\t\t\t'hillshade-shadow-color': shadowColor,\n\t\t\t\t'hillshade-accent-color': accentColor,\n\t\t\t\t'hillshade-highlight-color': highlightColor,\n\t\t\t\t'hillshade-illumination-anchor': 'map',\n\t\t\t\t'hillshade-illumination-altitude': altitude,\n\t\t\t\t'hillshade-illumination-direction': direction\n\t\t\t}}\n\t\t/>\n\t</RasterDEMTileSource>\n\n\t<div\n\t\tclass=\"absolute top-3 left-3 z-10 flex min-w-50 flex-col items-stretch gap-1 rounded bg-background/60 p-3 text-sm backdrop-blur-sm\"\n\t>\n\t\t<Tabs.Root bind:value={mode} class=\"flex h-full flex-col\">\n\t\t\t<Tabs.List class=\"grid w-full grid-cols-2\">\n\t\t\t\t<Tabs.Trigger value=\"terrain\">Terrain</Tabs.Trigger>\n\t\t\t\t<Tabs.Trigger value=\"sky\">Sky</Tabs.Trigger>\n\t\t\t</Tabs.List>\n\t\t\t<Tabs.Content value=\"terrain\" class=\"min-h-0 shrink overflow-scroll pt-1\">\n\t\t\t\t<div class=\"mb-4 flex flex-col items-center space-y-2 px-2\">\n\t\t\t\t\t<Label for=\"pitch\" class=\"leading-none\">Exaggeration ({exaggeration.toFixed(2)})</Label>\n\t\t\t\t\t<Slider type=\"single\" id=\"pitch\" bind:value={exaggeration} min={0} max={2} step={0.01} />\n\t\t\t\t</div>\n\t\t\t\t<div class=\"mb-3 flex flex-col items-center space-y-2 px-2\">\n\t\t\t\t\t<Label for=\"hillshade\" class=\"leading-none\">Hillshade ({hillshade.toFixed(2)})</Label>\n\t\t\t\t\t<Slider type=\"single\" id=\"hillshade\" bind:value={hillshade} min={0} max={1} step={0.01} />\n\t\t\t\t</div>\n\t\t\t\t<div class=\"mb-2 flex items-center justify-between space-x-2\">\n\t\t\t\t\t<Label for=\"shadow-method\" class=\"leading-none\">Method</Label>\n\t\t\t\t\t<select bind:value={hillshadeMethod} id=\"hillshade-method\" class=\"text-center\">\n\t\t\t\t\t\t{#each HILLSHADE_METHODS as method (method)}\n\t\t\t\t\t\t\t<option value={method}>{method}</option>\n\t\t\t\t\t\t{/each}\n\t\t\t\t\t</select>\n\t\t\t\t</div>\n\t\t\t\t<div class=\"mb-1 flex items-center justify-between space-x-2\">\n\t\t\t\t\t<Label for=\"shadow-sm\" class=\"leading-none\">Shadow</Label>\n\t\t\t\t\t<input type=\"color\" id=\"shadow-sm\" bind:value={shadowColor} />\n\t\t\t\t</div>\n\t\t\t\t{#if hillshadeMethod === 'standard'}\n\t\t\t\t\t<div class=\"mb-1 flex items-center justify-between space-x-2\">\n\t\t\t\t\t\t<Label for=\"accent\" class=\"leading-none\">Accent</Label>\n\t\t\t\t\t\t<input type=\"color\" id=\"accent\" bind:value={accentColor} />\n\t\t\t\t\t</div>\n\t\t\t\t{/if}\n\t\t\t\t<div class=\"mb-2 flex items-center justify-between space-x-2\">\n\t\t\t\t\t<Label for=\"highlight\" class=\"leading-none\">Highlight</Label>\n\t\t\t\t\t<input type=\"color\" id=\"highlight\" bind:value={highlightColor} />\n\t\t\t\t</div>\n\t\t\t\t<div class=\"mb-3 flex flex-col items-center space-y-2 px-2\">\n\t\t\t\t\t<Label for=\"direction\" class=\"leading-none\">Direction ({direction})</Label>\n\t\t\t\t\t<Slider type=\"single\" id=\"direction\" bind:value={direction} min={0} max={360} />\n\t\t\t\t</div>\n\t\t\t\t{#if !['standard', 'igor'].includes(hillshadeMethod)}\n\t\t\t\t\t<div class=\"mb-3 flex flex-col items-center space-y-2 px-2\">\n\t\t\t\t\t\t<Label for=\"altitude\" class=\"leading-none\">Altitude ({altitude.toFixed(2)})</Label>\n\t\t\t\t\t\t<Slider type=\"single\" id=\"altitude\" bind:value={altitude} min={0} max={90} step={0.01} />\n\t\t\t\t\t</div>\n\t\t\t\t{/if}\n\t\t\t</Tabs.Content>\n\t\t\t<Tabs.Content value=\"sky\" class=\"min-h-0 shrink overflow-scroll pt-1\">\n\t\t\t\t<div class=\"mb-2 flex items-center space-x-2 self-center justify-self-center\">\n\t\t\t\t\t<Checkbox id=\"skyEnabled\" bind:checked={skyEnabled} />\n\t\t\t\t\t<Label for=\"skyEnabled\" class=\"leading-none\">Enable Sky</Label>\n\t\t\t\t</div>\n\t\t\t\t<div class=\"mb-1 flex items-center justify-between space-x-2\">\n\t\t\t\t\t<Label for=\"skyColor\" class=\"leading-none\">Sky color</Label>\n\t\t\t\t\t<input type=\"color\" id=\"skyColor\" bind:value={skyColor} />\n\t\t\t\t</div>\n\t\t\t\t<div class=\"mb-3 flex flex-col items-center space-y-2 px-2\">\n\t\t\t\t\t<Label for=\"skyHorizonBlend\" class=\"leading-none\">sky-horizon-blend ({skyHorizonBlend})</Label>\n\t\t\t\t\t<Slider type=\"single\" id=\"skyHorizonBlend\" bind:value={skyHorizonBlend} min={0} max={1} step={0.01} />\n\t\t\t\t</div>\n\t\t\t\t<div class=\"mb-1 flex items-center justify-between space-x-2\">\n\t\t\t\t\t<Label for=\"horizonColor\" class=\"leading-none\">Horizon color</Label>\n\t\t\t\t\t<input type=\"color\" id=\"horizonColor\" bind:value={horizonColor} />\n\t\t\t\t</div>\n\t\t\t\t<div class=\"mb-3 flex flex-col items-center space-y-2 px-2\">\n\t\t\t\t\t<Label for=\"horizonFogBlend\" class=\"leading-none\">horizon-fog-blend ({horizonFogBlend})</Label>\n\t\t\t\t\t<Slider type=\"single\" id=\"horizonFogBlend\" bind:value={horizonFogBlend} min={0} max={1} step={0.01} />\n\t\t\t\t</div>\n\t\t\t\t<div class=\"mb-1 flex items-center justify-between space-x-2\">\n\t\t\t\t\t<Label for=\"fogColor\" class=\"leading-none\">Fog color</Label>\n\t\t\t\t\t<input type=\"color\" id=\"fogColor\" bind:value={fogColor} />\n\t\t\t\t</div>\n\t\t\t\t<div class=\"mb-3 flex flex-col items-center space-y-2 px-2\">\n\t\t\t\t\t<Label for=\"fogGroundBlend\" class=\"leading-none\">fog-ground-blend ({fogGroundBlend})</Label>\n\t\t\t\t\t<Slider type=\"single\" id=\"fogGroundBlend\" bind:value={fogGroundBlend} min={0} max={1} step={0.01} />\n\t\t\t\t</div>\n\t\t\t</Tabs.Content>\n\t\t</Tabs.Root>\n\t</div>\n</MapLibre>\n"
  },
  {
    "path": "src/content/examples/terrain/content.svelte.md",
    "content": "---\ntitle: 3D Terrain and Sky\ndescription: Show elevation in actual 3D with the sky.\noriginal: https://maplibre.org/maplibre-gl-js/docs/examples/sky-with-fog-and-terrain/\n---\n\n<script lang=\"ts\">\n  import Demo from \"./Terrain.svelte\";\n  import demoRaw from \"./Terrain.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/threejs-model/CustomLayer.svelte",
    "content": "<script lang=\"ts\">\n\timport { MapLibre, CustomLayer, GlobeControl, Projection } from 'svelte-maplibre-gl';\n\timport maplibregl from 'maplibre-gl';\n\timport * as THREE from 'three';\n\timport { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js';\n\n\tclass CustomLayerImpl implements Omit<maplibregl.CustomLayerInterface, 'id' | 'type'> {\n\t\trenderingMode = '3d' as const;\n\t\tprivate camera = new THREE.Camera();\n\t\tprivate scene = new THREE.Scene();\n\t\tprivate renderer: THREE.WebGLRenderer | null = null;\n\t\tprivate map: maplibregl.Map | null = null;\n\n\t\tonAdd(map: maplibregl.Map, gl: WebGL2RenderingContext) {\n\t\t\tthis.map = map;\n\n\t\t\t// Create two three.js lights to illuminate the model\n\t\t\tconst directionalLight1 = new THREE.DirectionalLight(0xffffff);\n\t\t\tdirectionalLight1.position.set(0, -70, 100).normalize();\n\t\t\tthis.scene.add(directionalLight1);\n\n\t\t\tconst directionalLight2 = new THREE.DirectionalLight(0xffffff);\n\t\t\tdirectionalLight2.position.set(0, 70, 100).normalize();\n\t\t\tthis.scene.add(directionalLight2);\n\n\t\t\t// Use the three.js GLTF loader to add the 3D model to the three.js scene\n\t\t\tconst loader = new GLTFLoader();\n\t\t\tloader.load('https://maplibre.org/maplibre-gl-js/docs/assets/34M_17/34M_17.gltf', (gltf) => {\n\t\t\t\tthis.scene.add(gltf.scene);\n\t\t\t});\n\n\t\t\t// Use the MapLibre GL JS map canvas for three.js\n\t\t\tthis.renderer = new THREE.WebGLRenderer({\n\t\t\t\tcanvas: map.getCanvas(),\n\t\t\t\tcontext: gl,\n\t\t\t\tantialias: true\n\t\t\t});\n\t\t\tthis.renderer.autoClear = false;\n\t\t}\n\n\t\trender(_gl: WebGL2RenderingContext | WebGLRenderingContext, args: maplibregl.CustomRenderMethodInput) {\n\t\t\tconst modelOrigin: [number, number] = [148.9819, -35.39847];\n\t\t\tconst modelAltitude = 0;\n\t\t\tconst scaling = 10_000.0;\n\t\t\t// We can use this API to get the correct model matrix.\n\t\t\t// It will work regardless of current projection.\n\t\t\t// See MapLibre source code, file \"mercator_transform.ts\" or \"vertical_perspective_transform.ts\".\n\t\t\tconst modelMatrix = this.map!.transform.getMatrixForModel(modelOrigin, modelAltitude);\n\t\t\tconst m = new THREE.Matrix4().fromArray(args.defaultProjectionData.mainMatrix);\n\t\t\tconst l = new THREE.Matrix4().fromArray(modelMatrix).scale(new THREE.Vector3(scaling, scaling, scaling));\n\n\t\t\tthis.camera.projectionMatrix = m.multiply(l);\n\t\t\tthis.renderer!.resetState();\n\t\t\tthis.renderer!.render(this.scene, this.camera);\n\t\t\tthis.map!.triggerRepaint();\n\t\t}\n\t}\n\n\tconst customLayerImpl = new CustomLayerImpl();\n</script>\n\n<MapLibre\n\tclass=\"h-[55vh] min-h-[300px]\"\n\tstyle=\"https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json\"\n\tzoom={5}\n\tpitch={50}\n\tmaxPitch={80}\n\tcenter={[150.16546137527212, -35.017179237129994]}\n>\n\t<CustomLayer implementation={customLayerImpl} />\n\t<GlobeControl />\n\t<Projection type=\"globe\" />\n</MapLibre>\n"
  },
  {
    "path": "src/content/examples/threejs-model/content.svelte.md",
    "content": "---\ntitle: 3D model with three.js\ndescription: Use a custom style layer with three.js to add a 3D model to the map.\noriginal: https://maplibre.org/maplibre-gl-js/docs/examples/globe-3d-model/\n---\n\n<script lang=\"ts\">\n  import Demo from \"./CustomLayer.svelte\";\n  import demoRaw from \"./CustomLayer.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/content/examples/toc.ts",
    "content": "import type { Toc } from '$lib/components/types';\n\nexport const toc: Toc = [\n\t{\n\t\ttitle: 'Basic',\n\t\titems: {\n\t\t\t'/examples/plain': 'Plain Map',\n\t\t\t'/examples/complex': 'Complex',\n\t\t\t'/examples/marker-popup': 'Marker and Popup',\n\t\t\t'/examples/basestyle': 'Change Base Style',\n\t\t\t'/examples/hover-styles': 'Hover Styles',\n\t\t\t'/examples/clusters': 'Clusters',\n\t\t\t'/examples/limit-interaction': 'Limit Map Interactions',\n\t\t\t'/examples/animate-images': 'Animate a Series of Images',\n\t\t\t'/examples/video-on-a-map': 'Video on a Map',\n\t\t\t'/examples/fullscreen': 'Fullscreen',\n\t\t\t'/examples/geolocate': 'Locate the User',\n\t\t\t'/examples/cursor': 'Change Cursor'\n\t\t}\n\t},\n\t{\n\t\ttitle: 'Styles',\n\t\titems: {\n\t\t\t'/examples/terrain': '3D Terrain and Sky',\n\t\t\t'/examples/color-relief': 'Color Relief',\n\t\t\t'/examples/globe-atmosphere': 'Globe with an Atmosphere',\n\t\t\t'/examples/3d-buildings': '3D Buildings',\n\t\t\t'/examples/global-state': 'Global State'\n\t\t}\n\t},\n\t{\n\t\ttitle: 'Utilities',\n\t\titems: {\n\t\t\t'/examples/image-loader': 'Load Images from URLs',\n\t\t\t'/examples/query-features': 'Query Features'\n\t\t}\n\t},\n\t{\n\t\ttitle: 'Techniques',\n\t\titems: {\n\t\t\t'/examples/side-by-side': 'Side by Side',\n\t\t\t'/examples/3d-extrusion-floorplan': '3D Floor Plan'\n\t\t}\n\t},\n\t{\n\t\ttitle: 'Advanced',\n\t\titems: {\n\t\t\t'/examples/custom-control': 'Custom Control',\n\t\t\t'/examples/custom-protocol': 'Custom Protocols',\n\t\t\t'/examples/canvas-source': 'Canvas Source',\n\t\t\t'/examples/custom-layer': 'Custom Layer',\n\t\t\t'/examples/dynamic-image': 'Dynamic Image',\n\t\t\t'/examples/threejs-model': '3D model with three.js'\n\t\t}\n\t},\n\t{\n\t\ttitle: 'Extensions',\n\t\titems: {\n\t\t\t'/examples/pmtiles': 'PMTiles Protocol',\n\t\t\t'/examples/deckgl-overlay': 'deck.gl Overlay',\n\t\t\t'/examples/contour': 'Contour Lines',\n\t\t\t'/examples/terradraw': 'Terra Draw'\n\t\t}\n\t}\n];\n"
  },
  {
    "path": "src/content/examples/video-on-a-map/Video.svelte",
    "content": "<script lang=\"ts\">\n\timport { MapLibre, VideoSource, GlobeControl, RasterLayer } from 'svelte-maplibre-gl';\n\timport maplibregl from 'maplibre-gl';\n\n\tlet source: maplibregl.VideoSource | undefined = $state(undefined);\n\tlet playing = $state(true);\n\n\tfunction toggle() {\n\t\tif (source) {\n\t\t\tplaying = !playing;\n\t\t\tplaying ? source.play() : source.pause();\n\t\t}\n\t}\n</script>\n\n<MapLibre\n\tclass=\"h-[55vh] min-h-[300px]\"\n\tstyle=\"https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json\"\n\tminZoom={14}\n\tzoom={17}\n\tcenter={{ lng: -122.514426, lat: 37.562984 }}\n\tbearing={-96}\n\tonclick={toggle}\n>\n\t<GlobeControl />\n\t<VideoSource\n\t\tbind:source\n\t\turls={[\n\t\t\t'https://static-assets.mapbox.com/mapbox-gl-js/drone.mp4',\n\t\t\t'https://static-assets.mapbox.com/mapbox-gl-js/drone.webm'\n\t\t]}\n\t\tcoordinates={[\n\t\t\t[-122.51596391201019, 37.56238816766053],\n\t\t\t[-122.51467645168304, 37.56410183312965],\n\t\t\t[-122.51309394836426, 37.563391708549425],\n\t\t\t[-122.51423120498657, 37.56161849366671]\n\t\t]}\n\t>\n\t\t<RasterLayer paint={{ 'raster-opacity': 0.7 }} />\n\t</VideoSource>\n</MapLibre>\n"
  },
  {
    "path": "src/content/examples/video-on-a-map/content.svelte.md",
    "content": "---\ntitle: Video on a map\ndescription: Display a video.\noriginal: https://maplibre.org/maplibre-gl-js/docs/examples/video-on-a-map/\n---\n\n<script lang=\"ts\">\n  import Demo from \"./Video.svelte\";\n  import demoRaw from \"./Video.svelte?raw\";\n  import CodeBlock from \"../../CodeBlock.svelte\";\n  let { shiki } = $props();\n</script>\n\n<Demo />\n\n<CodeBlock content={demoRaw} {shiki} />\n"
  },
  {
    "path": "src/demo.spec.ts",
    "content": "import { describe, it, expect } from 'vitest';\n\ndescribe('sum test', () => {\n\tit('adds 1 + 2 to equal 3', () => {\n\t\texpect(1 + 2).toBe(3);\n\t});\n});\n"
  },
  {
    "path": "src/lib/assets/fonts/LICENSE.txt",
    "content": "Copyright (c) 2023 Vercel, in collaboration with basement.studio\n\nThis Font Software is licensed under the SIL Open Font License, Version 1.1.\nThis license is copied below, and is also available with a FAQ at:\nhttp://scripts.sil.org/OFL\n\n-----------------------------------------------------------\nSIL OPEN FONT LICENSE Version 1.1 - 26 February 2007\n-----------------------------------------------------------\n\nPREAMBLE\nThe goals of the Open Font License (OFL) are to stimulate worldwide\ndevelopment of collaborative font projects, to support the font creation\nefforts of academic and linguistic communities, and to provide a free and\nopen framework in which fonts may be shared and improved in partnership\nwith others.\n\nThe OFL allows the licensed fonts to be used, studied, modified and\nredistributed freely as long as they are not sold by themselves. The\nfonts, including any derivative works, can be bundled, embedded,\nredistributed and/or sold with any software provided that any reserved\nnames are not used by derivative works. The fonts and derivatives,\nhowever, cannot be released under any other type of license. The\nrequirement for fonts to remain under this license does not apply\nto any document created using the fonts or their derivatives.\n\nDEFINITIONS\n\"Font Software\" refers to the set of files released by the Copyright\nHolder(s) under this license and clearly marked as such. This may\ninclude source files, build scripts and documentation.\n\n\"Reserved Font Name\" refers to any names specified as such after the\ncopyright statement(s).\n\n\"Original Version\" refers to the collection of Font Software components as\ndistributed by the Copyright Holder(s).\n\n\"Modified Version\" refers to any derivative made by adding to, deleting,\nor substituting -- in part or in whole -- any of the components of the\nOriginal Version, by changing formats or by porting the Font Software to a\nnew environment.\n\n\"Author\" refers to any designer, engineer, programmer, technical\nwriter or other person who contributed to the Font Software.\n\nPERMISSION AND CONDITIONS\nPermission is hereby granted, free of charge, to any person obtaining\na copy of the Font Software, to use, study, copy, merge, embed, modify,\nredistribute, and sell modified and unmodified copies of the Font\nSoftware, subject to the following conditions:\n\n1) Neither the Font Software nor any of its individual components,\nin Original or Modified Versions, may be sold by itself.\n\n2) Original or Modified Versions of the Font Software may be bundled,\nredistributed and/or sold with any software, provided that each copy\ncontains the above copyright notice and this license. These can be\nincluded either as stand-alone text files, human-readable headers or\nin the appropriate machine-readable metadata fields within text or\nbinary files as long as those fields can be easily viewed by the user.\n\n3) No Modified Version of the Font Software may use the Reserved Font\nName(s) unless explicit written permission is granted by the corresponding\nCopyright Holder. This restriction only applies to the primary font name as\npresented to the users.\n\n4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font\nSoftware shall not be used to promote, endorse or advertise any\nModified Version, except to acknowledge the contribution(s) of the\nCopyright Holder(s) and the Author(s) or with their explicit written\npermission.\n\n5) The Font Software, modified or unmodified, in part or in whole,\nmust be distributed entirely under this license, and must not be\ndistributed under any other license. The requirement for fonts to\nremain under this license does not apply to any document created\nusing the Font Software.\n\nTERMINATION\nThis license becomes null and void if any of the above conditions are\nnot met.\n\nDISCLAIMER\nTHE FONT SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND,\nEXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF\nMERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT\nOF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE\nCOPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,\nINCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL\nDAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING\nFROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM\nOTHER DEALINGS IN THE FONT SOFTWARE.\n"
  },
  {
    "path": "src/lib/assets/fonts/geist.css",
    "content": "@font-face {\n\tfont-family: 'Geist';\n\tsrc: url('./geist.woff2') format('woff2');\n\tfont-display: swap;\n}\n@font-face {\n\tfont-family: 'Geist Mono';\n\tsrc: url('./geist-mono.woff2') format('woff2');\n\tfont-display: swap;\n}\n"
  },
  {
    "path": "src/lib/assets/icons/GitHub.svelte",
    "content": "<script lang=\"ts\">\n\timport type { SVGAttributes } from 'svelte/elements';\n\n\tlet { ...props }: SVGAttributes<SVGElement> = $props();\n</script>\n\n<svg viewBox=\"0 0 438.549 438.549\" {...props}>\n\t<path\n\t\tfill=\"currentColor\"\n\t\td=\"M409.132 114.573c-19.608-33.596-46.205-60.194-79.798-79.8-33.598-19.607-70.277-29.408-110.063-29.408-39.781 0-76.472 9.804-110.063 29.408-33.596 19.605-60.192 46.204-79.8 79.8C9.803 148.168 0 184.854 0 224.63c0 47.78 13.94 90.745 41.827 128.906 27.884 38.164 63.906 64.572 108.063 79.227 5.14.954 8.945.283 11.419-1.996 2.475-2.282 3.711-5.14 3.711-8.562 0-.571-.049-5.708-.144-15.417a2549.81 2549.81 0 01-.144-25.406l-6.567 1.136c-4.187.767-9.469 1.092-15.846 1-6.374-.089-12.991-.757-19.842-1.999-6.854-1.231-13.229-4.086-19.13-8.559-5.898-4.473-10.085-10.328-12.56-17.556l-2.855-6.57c-1.903-4.374-4.899-9.233-8.992-14.559-4.093-5.331-8.232-8.945-12.419-10.848l-1.999-1.431c-1.332-.951-2.568-2.098-3.711-3.429-1.142-1.331-1.997-2.663-2.568-3.997-.572-1.335-.098-2.43 1.427-3.289 1.525-.859 4.281-1.276 8.28-1.276l5.708.853c3.807.763 8.516 3.042 14.133 6.851 5.614 3.806 10.229 8.754 13.846 14.842 4.38 7.806 9.657 13.754 15.846 17.847 6.184 4.093 12.419 6.136 18.699 6.136 6.28 0 11.704-.476 16.274-1.423 4.565-.952 8.848-2.383 12.847-4.285 1.713-12.758 6.377-22.559 13.988-29.41-10.848-1.14-20.601-2.857-29.264-5.14-8.658-2.286-17.605-5.996-26.835-11.14-9.235-5.137-16.896-11.516-22.985-19.126-6.09-7.614-11.088-17.61-14.987-29.979-3.901-12.374-5.852-26.648-5.852-42.826 0-23.035 7.52-42.637 22.557-58.817-7.044-17.318-6.379-36.732 1.997-58.24 5.52-1.715 13.706-.428 24.554 3.853 10.85 4.283 18.794 7.952 23.84 10.994 5.046 3.041 9.089 5.618 12.135 7.708 17.705-4.947 35.976-7.421 54.818-7.421s37.117 2.474 54.823 7.421l10.849-6.849c7.419-4.57 16.18-8.758 26.262-12.565 10.088-3.805 17.802-4.853 23.134-3.138 8.562 21.509 9.325 40.922 2.279 58.24 15.036 16.18 22.559 35.787 22.559 58.817 0 16.178-1.958 30.497-5.853 42.966-3.9 12.471-8.941 22.457-15.125 29.979-6.191 7.521-13.901 13.85-23.131 18.986-9.232 5.14-18.182 8.85-26.84 11.136-8.662 2.286-18.415 4.004-29.263 5.146 9.894 8.562 14.842 22.077 14.842 40.539v60.237c0 3.422 1.19 6.279 3.572 8.562 2.379 2.279 6.136 2.95 11.276 1.995 44.163-14.653 80.185-41.062 108.068-79.226 27.88-38.161 41.825-81.126 41.825-128.906-.01-39.771-9.818-76.454-29.414-110.049z\"\n\t/>\n</svg>\n"
  },
  {
    "path": "src/lib/components/Index.svelte",
    "content": "<script lang=\"ts\">\n\timport { page } from '$app/state';\n\timport type { Toc } from './types';\n\tlet { name, toc }: { name: string; toc: Toc } = $props();\n</script>\n\n<nav>\n\t<h2 class=\"mb-4 text-lg leading-none font-bold\">{name}</h2>\n\t{#each toc as subtoc (subtoc.title)}\n\t\t<h3 class=\"my-3\">{subtoc.title}</h3>\n\t\t<ul class=\"flex flex-col text-sm\">\n\t\t\t{#each Object.entries(subtoc.items) as [path, title] (path)}\n\t\t\t\t<li\n\t\t\t\t\tclass=\"border-l border-foreground/10 py-1 pl-4 data-[active=true]:border-foreground\"\n\t\t\t\t\tdata-active={page.url.pathname === path}\n\t\t\t\t>\n\t\t\t\t\t<!-- eslint-disable-next-line svelte/no-navigation-without-resolve -->\n\t\t\t\t\t<a class=\"data-[active=true]:font-medium\" data-active={page.url.pathname === path} href={path}>{title}</a>\n\t\t\t\t</li>\n\t\t\t{/each}\n\t\t</ul>\n\t{/each}\n</nav>\n"
  },
  {
    "path": "src/lib/components/types.ts",
    "content": "export type Toc = {\n\ttitle: string;\n\titems: Record<string, string>;\n}[];\n"
  },
  {
    "path": "src/lib/components/ui/badge/badge.svelte",
    "content": "<script lang=\"ts\" module>\n\timport { type VariantProps, tv } from \"tailwind-variants\";\n\n\texport const badgeVariants = tv({\n\t\tbase: \"focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive inline-flex w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-full border px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:ring-[3px] [&>svg]:pointer-events-none [&>svg]:size-3\",\n\t\tvariants: {\n\t\t\tvariant: {\n\t\t\t\tdefault:\n\t\t\t\t\t\"bg-primary text-primary-foreground [a&]:hover:bg-primary/90 border-transparent\",\n\t\t\t\tsecondary:\n\t\t\t\t\t\"bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90 border-transparent\",\n\t\t\t\tdestructive:\n\t\t\t\t\t\"bg-destructive [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/70 border-transparent text-white\",\n\t\t\t\toutline: \"text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground\",\n\t\t\t},\n\t\t},\n\t\tdefaultVariants: {\n\t\t\tvariant: \"default\",\n\t\t},\n\t});\n\n\texport type BadgeVariant = VariantProps<typeof badgeVariants>[\"variant\"];\n</script>\n\n<script lang=\"ts\">\n\timport type { HTMLAnchorAttributes } from \"svelte/elements\";\n\timport { cn, type WithElementRef } from \"$lib/utils.js\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\thref,\n\t\tclass: className,\n\t\tvariant = \"default\",\n\t\tchildren,\n\t\t...restProps\n\t}: WithElementRef<HTMLAnchorAttributes> & {\n\t\tvariant?: BadgeVariant;\n\t} = $props();\n</script>\n\n<svelte:element\n\tthis={href ? \"a\" : \"span\"}\n\tbind:this={ref}\n\tdata-slot=\"badge\"\n\t{href}\n\tclass={cn(badgeVariants({ variant }), className)}\n\t{...restProps}\n>\n\t{@render children?.()}\n</svelte:element>\n"
  },
  {
    "path": "src/lib/components/ui/badge/index.ts",
    "content": "export { default as Badge } from \"./badge.svelte\";\nexport { badgeVariants, type BadgeVariant } from \"./badge.svelte\";\n"
  },
  {
    "path": "src/lib/components/ui/breadcrumb/breadcrumb-ellipsis.svelte",
    "content": "<script lang=\"ts\">\n\timport EllipsisIcon from \"@lucide/svelte/icons/ellipsis\";\n\timport type { HTMLAttributes } from \"svelte/elements\";\n\timport { cn, type WithElementRef, type WithoutChildren } from \"$lib/utils.js\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\t...restProps\n\t}: WithoutChildren<WithElementRef<HTMLAttributes<HTMLSpanElement>>> = $props();\n</script>\n\n<span\n\tbind:this={ref}\n\tdata-slot=\"breadcrumb-ellipsis\"\n\trole=\"presentation\"\n\taria-hidden=\"true\"\n\tclass={cn(\"flex size-9 items-center justify-center\", className)}\n\t{...restProps}\n>\n\t<EllipsisIcon class=\"size-4\" />\n\t<span class=\"sr-only\">More</span>\n</span>\n"
  },
  {
    "path": "src/lib/components/ui/breadcrumb/breadcrumb-item.svelte",
    "content": "<script lang=\"ts\">\n\timport type { HTMLLiAttributes } from \"svelte/elements\";\n\timport { cn, type WithElementRef } from \"$lib/utils.js\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\tchildren,\n\t\t...restProps\n\t}: WithElementRef<HTMLLiAttributes> = $props();\n</script>\n\n<li\n\tbind:this={ref}\n\tdata-slot=\"breadcrumb-item\"\n\tclass={cn(\"inline-flex items-center gap-1.5\", className)}\n\t{...restProps}\n>\n\t{@render children?.()}\n</li>\n"
  },
  {
    "path": "src/lib/components/ui/breadcrumb/breadcrumb-link.svelte",
    "content": "<script lang=\"ts\">\n\timport type { HTMLAnchorAttributes } from \"svelte/elements\";\n\timport type { Snippet } from \"svelte\";\n\timport { cn, type WithElementRef } from \"$lib/utils.js\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\thref = undefined,\n\t\tchild,\n\t\tchildren,\n\t\t...restProps\n\t}: WithElementRef<HTMLAnchorAttributes> & {\n\t\tchild?: Snippet<[{ props: HTMLAnchorAttributes }]>;\n\t} = $props();\n\n\tconst attrs = $derived({\n\t\t\"data-slot\": \"breadcrumb-link\",\n\t\tclass: cn(\"hover:text-foreground transition-colors\", className),\n\t\thref,\n\t\t...restProps,\n\t});\n</script>\n\n{#if child}\n\t{@render child({ props: attrs })}\n{:else}\n\t<a bind:this={ref} {...attrs}>\n\t\t{@render children?.()}\n\t</a>\n{/if}\n"
  },
  {
    "path": "src/lib/components/ui/breadcrumb/breadcrumb-list.svelte",
    "content": "<script lang=\"ts\">\n\timport type { HTMLOlAttributes } from \"svelte/elements\";\n\timport { cn, type WithElementRef } from \"$lib/utils.js\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\tchildren,\n\t\t...restProps\n\t}: WithElementRef<HTMLOlAttributes> = $props();\n</script>\n\n<ol\n\tbind:this={ref}\n\tdata-slot=\"breadcrumb-list\"\n\tclass={cn(\n\t\t\"text-muted-foreground flex flex-wrap items-center gap-1.5 text-sm break-words sm:gap-2.5\",\n\t\tclassName\n\t)}\n\t{...restProps}\n>\n\t{@render children?.()}\n</ol>\n"
  },
  {
    "path": "src/lib/components/ui/breadcrumb/breadcrumb-page.svelte",
    "content": "<script lang=\"ts\">\n\timport type { HTMLAttributes } from \"svelte/elements\";\n\timport { cn, type WithElementRef } from \"$lib/utils.js\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\tchildren,\n\t\t...restProps\n\t}: WithElementRef<HTMLAttributes<HTMLSpanElement>> = $props();\n</script>\n\n<span\n\tbind:this={ref}\n\tdata-slot=\"breadcrumb-page\"\n\trole=\"link\"\n\taria-disabled=\"true\"\n\taria-current=\"page\"\n\tclass={cn(\"text-foreground font-normal\", className)}\n\t{...restProps}\n>\n\t{@render children?.()}\n</span>\n"
  },
  {
    "path": "src/lib/components/ui/breadcrumb/breadcrumb-separator.svelte",
    "content": "<script lang=\"ts\">\n\timport ChevronRightIcon from \"@lucide/svelte/icons/chevron-right\";\n\timport { cn, type WithElementRef } from \"$lib/utils.js\";\n\timport type { HTMLLiAttributes } from \"svelte/elements\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\tchildren,\n\t\t...restProps\n\t}: WithElementRef<HTMLLiAttributes> = $props();\n</script>\n\n<li\n\tbind:this={ref}\n\tdata-slot=\"breadcrumb-separator\"\n\trole=\"presentation\"\n\taria-hidden=\"true\"\n\tclass={cn(\"[&>svg]:size-3.5\", className)}\n\t{...restProps}\n>\n\t{#if children}\n\t\t{@render children?.()}\n\t{:else}\n\t\t<ChevronRightIcon />\n\t{/if}\n</li>\n"
  },
  {
    "path": "src/lib/components/ui/breadcrumb/breadcrumb.svelte",
    "content": "<script lang=\"ts\">\n\timport type { WithElementRef } from \"$lib/utils.js\";\n\timport type { HTMLAttributes } from \"svelte/elements\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\tchildren,\n\t\t...restProps\n\t}: WithElementRef<HTMLAttributes<HTMLElement>> = $props();\n</script>\n\n<nav\n\tbind:this={ref}\n\tdata-slot=\"breadcrumb\"\n\tclass={className}\n\taria-label=\"breadcrumb\"\n\t{...restProps}\n>\n\t{@render children?.()}\n</nav>\n"
  },
  {
    "path": "src/lib/components/ui/breadcrumb/index.ts",
    "content": "import Root from \"./breadcrumb.svelte\";\nimport Ellipsis from \"./breadcrumb-ellipsis.svelte\";\nimport Item from \"./breadcrumb-item.svelte\";\nimport Separator from \"./breadcrumb-separator.svelte\";\nimport Link from \"./breadcrumb-link.svelte\";\nimport List from \"./breadcrumb-list.svelte\";\nimport Page from \"./breadcrumb-page.svelte\";\n\nexport {\n\tRoot,\n\tEllipsis,\n\tItem,\n\tSeparator,\n\tLink,\n\tList,\n\tPage,\n\t//\n\tRoot as Breadcrumb,\n\tEllipsis as BreadcrumbEllipsis,\n\tItem as BreadcrumbItem,\n\tSeparator as BreadcrumbSeparator,\n\tLink as BreadcrumbLink,\n\tList as BreadcrumbList,\n\tPage as BreadcrumbPage,\n};\n"
  },
  {
    "path": "src/lib/components/ui/button/button.svelte",
    "content": "<script lang=\"ts\" module>\n\timport { cn, type WithElementRef } from \"$lib/utils.js\";\n\timport type { HTMLAnchorAttributes, HTMLButtonAttributes } from \"svelte/elements\";\n\timport { type VariantProps, tv } from \"tailwind-variants\";\n\n\texport const buttonVariants = tv({\n\t\tbase: \"focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive inline-flex shrink-0 items-center justify-center gap-2 rounded-md text-sm font-medium whitespace-nowrap transition-all outline-none focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n\t\tvariants: {\n\t\t\tvariant: {\n\t\t\t\tdefault: \"bg-primary text-primary-foreground hover:bg-primary/90 shadow-xs\",\n\t\t\t\tdestructive:\n\t\t\t\t\t\"bg-destructive hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60 text-white shadow-xs\",\n\t\t\t\toutline:\n\t\t\t\t\t\"bg-background hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 border shadow-xs\",\n\t\t\t\tsecondary: \"bg-secondary text-secondary-foreground hover:bg-secondary/80 shadow-xs\",\n\t\t\t\tghost: \"hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50\",\n\t\t\t\tlink: \"text-primary underline-offset-4 hover:underline\",\n\t\t\t},\n\t\t\tsize: {\n\t\t\t\tdefault: \"h-9 px-4 py-2 has-[>svg]:px-3\",\n\t\t\t\tsm: \"h-8 gap-1.5 rounded-md px-3 has-[>svg]:px-2.5\",\n\t\t\t\tlg: \"h-10 rounded-md px-6 has-[>svg]:px-4\",\n\t\t\t\ticon: \"size-9\",\n\t\t\t\t\"icon-sm\": \"size-8\",\n\t\t\t\t\"icon-lg\": \"size-10\",\n\t\t\t},\n\t\t},\n\t\tdefaultVariants: {\n\t\t\tvariant: \"default\",\n\t\t\tsize: \"default\",\n\t\t},\n\t});\n\n\texport type ButtonVariant = VariantProps<typeof buttonVariants>[\"variant\"];\n\texport type ButtonSize = VariantProps<typeof buttonVariants>[\"size\"];\n\n\texport type ButtonProps = WithElementRef<HTMLButtonAttributes> &\n\t\tWithElementRef<HTMLAnchorAttributes> & {\n\t\t\tvariant?: ButtonVariant;\n\t\t\tsize?: ButtonSize;\n\t\t};\n</script>\n\n<script lang=\"ts\">\n\tlet {\n\t\tclass: className,\n\t\tvariant = \"default\",\n\t\tsize = \"default\",\n\t\tref = $bindable(null),\n\t\thref = undefined,\n\t\ttype = \"button\",\n\t\tdisabled,\n\t\tchildren,\n\t\t...restProps\n\t}: ButtonProps = $props();\n</script>\n\n{#if href}\n    <!-- eslint-disable svelte/no-navigation-without-resolve -->\n\t<a\n\t\tbind:this={ref}\n\t\tdata-slot=\"button\"\n\t\tclass={cn(buttonVariants({ variant, size }), className)}\n\t\thref={disabled ? undefined : href}\n\t\taria-disabled={disabled}\n\t\trole={disabled ? \"link\" : undefined}\n\t\ttabindex={disabled ? -1 : undefined}\n\t\t{...restProps}\n\t>\n\t\t{@render children?.()}\n\t</a>\n{:else}\n\t<button\n\t\tbind:this={ref}\n\t\tdata-slot=\"button\"\n\t\tclass={cn(buttonVariants({ variant, size }), className)}\n\t\t{type}\n\t\t{disabled}\n\t\t{...restProps}\n\t>\n\t\t{@render children?.()}\n\t</button>\n{/if}\n"
  },
  {
    "path": "src/lib/components/ui/button/index.ts",
    "content": "import Root, {\n\ttype ButtonProps,\n\ttype ButtonSize,\n\ttype ButtonVariant,\n\tbuttonVariants,\n} from \"./button.svelte\";\n\nexport {\n\tRoot,\n\ttype ButtonProps as Props,\n\t//\n\tRoot as Button,\n\tbuttonVariants,\n\ttype ButtonProps,\n\ttype ButtonSize,\n\ttype ButtonVariant,\n};\n"
  },
  {
    "path": "src/lib/components/ui/checkbox/checkbox.svelte",
    "content": "<script lang=\"ts\">\n\timport { Checkbox as CheckboxPrimitive } from \"bits-ui\";\n\timport CheckIcon from \"@lucide/svelte/icons/check\";\n\timport MinusIcon from \"@lucide/svelte/icons/minus\";\n\timport { cn, type WithoutChildrenOrChild } from \"$lib/utils.js\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tchecked = $bindable(false),\n\t\tindeterminate = $bindable(false),\n\t\tclass: className,\n\t\t...restProps\n\t}: WithoutChildrenOrChild<CheckboxPrimitive.RootProps> = $props();\n</script>\n\n<CheckboxPrimitive.Root\n\tbind:ref\n\tdata-slot=\"checkbox\"\n\tclass={cn(\n\t\t\"border-input dark:bg-input/30 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground dark:data-[state=checked]:bg-primary data-[state=checked]:border-primary focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive peer flex size-4 shrink-0 items-center justify-center rounded-[4px] border shadow-xs transition-shadow outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50\",\n\t\tclassName\n\t)}\n\tbind:checked\n\tbind:indeterminate\n\t{...restProps}\n>\n\t{#snippet children({ checked, indeterminate })}\n\t\t<div data-slot=\"checkbox-indicator\" class=\"text-current transition-none\">\n\t\t\t{#if checked}\n\t\t\t\t<CheckIcon class=\"size-3.5\" />\n\t\t\t{:else if indeterminate}\n\t\t\t\t<MinusIcon class=\"size-3.5\" />\n\t\t\t{/if}\n\t\t</div>\n\t{/snippet}\n</CheckboxPrimitive.Root>\n"
  },
  {
    "path": "src/lib/components/ui/checkbox/index.ts",
    "content": "import Root from \"./checkbox.svelte\";\nexport {\n\tRoot,\n\t//\n\tRoot as Checkbox,\n};\n"
  },
  {
    "path": "src/lib/components/ui/dropdown-menu/dropdown-menu-checkbox-group.svelte",
    "content": "<script lang=\"ts\">\n\timport { DropdownMenu as DropdownMenuPrimitive } from \"bits-ui\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tvalue = $bindable([]),\n\t\t...restProps\n\t}: DropdownMenuPrimitive.CheckboxGroupProps = $props();\n</script>\n\n<DropdownMenuPrimitive.CheckboxGroup\n\tbind:ref\n\tbind:value\n\tdata-slot=\"dropdown-menu-checkbox-group\"\n\t{...restProps}\n/>\n"
  },
  {
    "path": "src/lib/components/ui/dropdown-menu/dropdown-menu-checkbox-item.svelte",
    "content": "<script lang=\"ts\">\n\timport { DropdownMenu as DropdownMenuPrimitive } from \"bits-ui\";\n\timport CheckIcon from \"@lucide/svelte/icons/check\";\n\timport MinusIcon from \"@lucide/svelte/icons/minus\";\n\timport { cn, type WithoutChildrenOrChild } from \"$lib/utils.js\";\n\timport type { Snippet } from \"svelte\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tchecked = $bindable(false),\n\t\tindeterminate = $bindable(false),\n\t\tclass: className,\n\t\tchildren: childrenProp,\n\t\t...restProps\n\t}: WithoutChildrenOrChild<DropdownMenuPrimitive.CheckboxItemProps> & {\n\t\tchildren?: Snippet;\n\t} = $props();\n</script>\n\n<DropdownMenuPrimitive.CheckboxItem\n\tbind:ref\n\tbind:checked\n\tbind:indeterminate\n\tdata-slot=\"dropdown-menu-checkbox-item\"\n\tclass={cn(\n\t\t\"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 ps-8 pe-2 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n\t\tclassName\n\t)}\n\t{...restProps}\n>\n\t{#snippet children({ checked, indeterminate })}\n\t\t<span\n\t\t\tclass=\"pointer-events-none absolute start-2 flex size-3.5 items-center justify-center\"\n\t\t>\n\t\t\t{#if indeterminate}\n\t\t\t\t<MinusIcon class=\"size-4\" />\n\t\t\t{:else}\n\t\t\t\t<CheckIcon class={cn(\"size-4\", !checked && \"text-transparent\")} />\n\t\t\t{/if}\n\t\t</span>\n\t\t{@render childrenProp?.()}\n\t{/snippet}\n</DropdownMenuPrimitive.CheckboxItem>\n"
  },
  {
    "path": "src/lib/components/ui/dropdown-menu/dropdown-menu-content.svelte",
    "content": "<script lang=\"ts\">\n\timport { cn, type WithoutChildrenOrChild } from \"$lib/utils.js\";\n\timport DropdownMenuPortal from \"./dropdown-menu-portal.svelte\";\n\timport { DropdownMenu as DropdownMenuPrimitive } from \"bits-ui\";\n\timport type { ComponentProps } from \"svelte\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tsideOffset = 4,\n\t\tportalProps,\n\t\tclass: className,\n\t\t...restProps\n\t}: DropdownMenuPrimitive.ContentProps & {\n\t\tportalProps?: WithoutChildrenOrChild<ComponentProps<typeof DropdownMenuPortal>>;\n\t} = $props();\n</script>\n\n<DropdownMenuPortal {...portalProps}>\n\t<DropdownMenuPrimitive.Content\n\t\tbind:ref\n\t\tdata-slot=\"dropdown-menu-content\"\n\t\t{sideOffset}\n\t\tclass={cn(\n\t\t\t\"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-end-2 data-[side=right]:slide-in-from-start-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-h-(--bits-dropdown-menu-content-available-height) min-w-[8rem] origin-(--bits-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border p-1 shadow-md outline-none\",\n\t\t\tclassName\n\t\t)}\n\t\t{...restProps}\n\t/>\n</DropdownMenuPortal>\n"
  },
  {
    "path": "src/lib/components/ui/dropdown-menu/dropdown-menu-group-heading.svelte",
    "content": "<script lang=\"ts\">\n\timport { DropdownMenu as DropdownMenuPrimitive } from \"bits-ui\";\n\timport { cn } from \"$lib/utils.js\";\n\timport type { ComponentProps } from \"svelte\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\tinset,\n\t\t...restProps\n\t}: ComponentProps<typeof DropdownMenuPrimitive.GroupHeading> & {\n\t\tinset?: boolean;\n\t} = $props();\n</script>\n\n<DropdownMenuPrimitive.GroupHeading\n\tbind:ref\n\tdata-slot=\"dropdown-menu-group-heading\"\n\tdata-inset={inset}\n\tclass={cn(\"px-2 py-1.5 text-sm font-semibold data-[inset]:ps-8\", className)}\n\t{...restProps}\n/>\n"
  },
  {
    "path": "src/lib/components/ui/dropdown-menu/dropdown-menu-group.svelte",
    "content": "<script lang=\"ts\">\n\timport { DropdownMenu as DropdownMenuPrimitive } from \"bits-ui\";\n\n\tlet { ref = $bindable(null), ...restProps }: DropdownMenuPrimitive.GroupProps = $props();\n</script>\n\n<DropdownMenuPrimitive.Group bind:ref data-slot=\"dropdown-menu-group\" {...restProps} />\n"
  },
  {
    "path": "src/lib/components/ui/dropdown-menu/dropdown-menu-item.svelte",
    "content": "<script lang=\"ts\">\n\timport { cn } from \"$lib/utils.js\";\n\timport { DropdownMenu as DropdownMenuPrimitive } from \"bits-ui\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\tinset,\n\t\tvariant = \"default\",\n\t\t...restProps\n\t}: DropdownMenuPrimitive.ItemProps & {\n\t\tinset?: boolean;\n\t\tvariant?: \"default\" | \"destructive\";\n\t} = $props();\n</script>\n\n<DropdownMenuPrimitive.Item\n\tbind:ref\n\tdata-slot=\"dropdown-menu-item\"\n\tdata-inset={inset}\n\tdata-variant={variant}\n\tclass={cn(\n\t\t\"data-highlighted:bg-accent data-highlighted:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:data-highlighted:bg-destructive/10 dark:data-[variant=destructive]:data-highlighted:bg-destructive/20 data-[variant=destructive]:data-highlighted:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:ps-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n\t\tclassName\n\t)}\n\t{...restProps}\n/>\n"
  },
  {
    "path": "src/lib/components/ui/dropdown-menu/dropdown-menu-label.svelte",
    "content": "<script lang=\"ts\">\n\timport { cn, type WithElementRef } from \"$lib/utils.js\";\n\timport type { HTMLAttributes } from \"svelte/elements\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\tinset,\n\t\tchildren,\n\t\t...restProps\n\t}: WithElementRef<HTMLAttributes<HTMLDivElement>> & {\n\t\tinset?: boolean;\n\t} = $props();\n</script>\n\n<div\n\tbind:this={ref}\n\tdata-slot=\"dropdown-menu-label\"\n\tdata-inset={inset}\n\tclass={cn(\"px-2 py-1.5 text-sm font-semibold data-[inset]:ps-8\", className)}\n\t{...restProps}\n>\n\t{@render children?.()}\n</div>\n"
  },
  {
    "path": "src/lib/components/ui/dropdown-menu/dropdown-menu-portal.svelte",
    "content": "<script lang=\"ts\">\n\timport { DropdownMenu as DropdownMenuPrimitive } from \"bits-ui\";\n\n\tlet { ...restProps }: DropdownMenuPrimitive.PortalProps = $props();\n</script>\n\n<DropdownMenuPrimitive.Portal {...restProps} />\n"
  },
  {
    "path": "src/lib/components/ui/dropdown-menu/dropdown-menu-radio-group.svelte",
    "content": "<script lang=\"ts\">\n\timport { DropdownMenu as DropdownMenuPrimitive } from \"bits-ui\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tvalue = $bindable(),\n\t\t...restProps\n\t}: DropdownMenuPrimitive.RadioGroupProps = $props();\n</script>\n\n<DropdownMenuPrimitive.RadioGroup\n\tbind:ref\n\tbind:value\n\tdata-slot=\"dropdown-menu-radio-group\"\n\t{...restProps}\n/>\n"
  },
  {
    "path": "src/lib/components/ui/dropdown-menu/dropdown-menu-radio-item.svelte",
    "content": "<script lang=\"ts\">\n\timport { DropdownMenu as DropdownMenuPrimitive } from \"bits-ui\";\n\timport CircleIcon from \"@lucide/svelte/icons/circle\";\n\timport { cn, type WithoutChild } from \"$lib/utils.js\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\tchildren: childrenProp,\n\t\t...restProps\n\t}: WithoutChild<DropdownMenuPrimitive.RadioItemProps> = $props();\n</script>\n\n<DropdownMenuPrimitive.RadioItem\n\tbind:ref\n\tdata-slot=\"dropdown-menu-radio-item\"\n\tclass={cn(\n\t\t\"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 ps-8 pe-2 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n\t\tclassName\n\t)}\n\t{...restProps}\n>\n\t{#snippet children({ checked })}\n\t\t<span\n\t\t\tclass=\"pointer-events-none absolute start-2 flex size-3.5 items-center justify-center\"\n\t\t>\n\t\t\t{#if checked}\n\t\t\t\t<CircleIcon class=\"size-2 fill-current\" />\n\t\t\t{/if}\n\t\t</span>\n\t\t{@render childrenProp?.({ checked })}\n\t{/snippet}\n</DropdownMenuPrimitive.RadioItem>\n"
  },
  {
    "path": "src/lib/components/ui/dropdown-menu/dropdown-menu-separator.svelte",
    "content": "<script lang=\"ts\">\n\timport { DropdownMenu as DropdownMenuPrimitive } from \"bits-ui\";\n\timport { cn } from \"$lib/utils.js\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\t...restProps\n\t}: DropdownMenuPrimitive.SeparatorProps = $props();\n</script>\n\n<DropdownMenuPrimitive.Separator\n\tbind:ref\n\tdata-slot=\"dropdown-menu-separator\"\n\tclass={cn(\"bg-border -mx-1 my-1 h-px\", className)}\n\t{...restProps}\n/>\n"
  },
  {
    "path": "src/lib/components/ui/dropdown-menu/dropdown-menu-shortcut.svelte",
    "content": "<script lang=\"ts\">\n\timport type { HTMLAttributes } from \"svelte/elements\";\n\timport { cn, type WithElementRef } from \"$lib/utils.js\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\tchildren,\n\t\t...restProps\n\t}: WithElementRef<HTMLAttributes<HTMLSpanElement>> = $props();\n</script>\n\n<span\n\tbind:this={ref}\n\tdata-slot=\"dropdown-menu-shortcut\"\n\tclass={cn(\"text-muted-foreground ms-auto text-xs tracking-widest\", className)}\n\t{...restProps}\n>\n\t{@render children?.()}\n</span>\n"
  },
  {
    "path": "src/lib/components/ui/dropdown-menu/dropdown-menu-sub-content.svelte",
    "content": "<script lang=\"ts\">\n\timport { DropdownMenu as DropdownMenuPrimitive } from \"bits-ui\";\n\timport { cn } from \"$lib/utils.js\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\t...restProps\n\t}: DropdownMenuPrimitive.SubContentProps = $props();\n</script>\n\n<DropdownMenuPrimitive.SubContent\n\tbind:ref\n\tdata-slot=\"dropdown-menu-sub-content\"\n\tclass={cn(\n\t\t\"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-end-2 data-[side=right]:slide-in-from-start-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] origin-(--bits-dropdown-menu-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg\",\n\t\tclassName\n\t)}\n\t{...restProps}\n/>\n"
  },
  {
    "path": "src/lib/components/ui/dropdown-menu/dropdown-menu-sub-trigger.svelte",
    "content": "<script lang=\"ts\">\n\timport { DropdownMenu as DropdownMenuPrimitive } from \"bits-ui\";\n\timport ChevronRightIcon from \"@lucide/svelte/icons/chevron-right\";\n\timport { cn } from \"$lib/utils.js\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\tinset,\n\t\tchildren,\n\t\t...restProps\n\t}: DropdownMenuPrimitive.SubTriggerProps & {\n\t\tinset?: boolean;\n\t} = $props();\n</script>\n\n<DropdownMenuPrimitive.SubTrigger\n\tbind:ref\n\tdata-slot=\"dropdown-menu-sub-trigger\"\n\tdata-inset={inset}\n\tclass={cn(\n\t\t\"data-highlighted:bg-accent data-highlighted:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:ps-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n\t\tclassName\n\t)}\n\t{...restProps}\n>\n\t{@render children?.()}\n\t<ChevronRightIcon class=\"ms-auto size-4\" />\n</DropdownMenuPrimitive.SubTrigger>\n"
  },
  {
    "path": "src/lib/components/ui/dropdown-menu/dropdown-menu-sub.svelte",
    "content": "<script lang=\"ts\">\n\timport { DropdownMenu as DropdownMenuPrimitive } from \"bits-ui\";\n\n\tlet { open = $bindable(false), ...restProps }: DropdownMenuPrimitive.SubProps = $props();\n</script>\n\n<DropdownMenuPrimitive.Sub bind:open {...restProps} />\n"
  },
  {
    "path": "src/lib/components/ui/dropdown-menu/dropdown-menu-trigger.svelte",
    "content": "<script lang=\"ts\">\n\timport { DropdownMenu as DropdownMenuPrimitive } from \"bits-ui\";\n\n\tlet { ref = $bindable(null), ...restProps }: DropdownMenuPrimitive.TriggerProps = $props();\n</script>\n\n<DropdownMenuPrimitive.Trigger bind:ref data-slot=\"dropdown-menu-trigger\" {...restProps} />\n"
  },
  {
    "path": "src/lib/components/ui/dropdown-menu/dropdown-menu.svelte",
    "content": "<script lang=\"ts\">\n\timport { DropdownMenu as DropdownMenuPrimitive } from \"bits-ui\";\n\n\tlet { open = $bindable(false), ...restProps }: DropdownMenuPrimitive.RootProps = $props();\n</script>\n\n<DropdownMenuPrimitive.Root bind:open {...restProps} />\n"
  },
  {
    "path": "src/lib/components/ui/dropdown-menu/index.ts",
    "content": "import Root from \"./dropdown-menu.svelte\";\nimport Sub from \"./dropdown-menu-sub.svelte\";\nimport CheckboxGroup from \"./dropdown-menu-checkbox-group.svelte\";\nimport CheckboxItem from \"./dropdown-menu-checkbox-item.svelte\";\nimport Content from \"./dropdown-menu-content.svelte\";\nimport Group from \"./dropdown-menu-group.svelte\";\nimport Item from \"./dropdown-menu-item.svelte\";\nimport Label from \"./dropdown-menu-label.svelte\";\nimport RadioGroup from \"./dropdown-menu-radio-group.svelte\";\nimport RadioItem from \"./dropdown-menu-radio-item.svelte\";\nimport Separator from \"./dropdown-menu-separator.svelte\";\nimport Shortcut from \"./dropdown-menu-shortcut.svelte\";\nimport Trigger from \"./dropdown-menu-trigger.svelte\";\nimport SubContent from \"./dropdown-menu-sub-content.svelte\";\nimport SubTrigger from \"./dropdown-menu-sub-trigger.svelte\";\nimport GroupHeading from \"./dropdown-menu-group-heading.svelte\";\nimport Portal from \"./dropdown-menu-portal.svelte\";\n\nexport {\n\tCheckboxGroup,\n\tCheckboxItem,\n\tContent,\n\tPortal,\n\tRoot as DropdownMenu,\n\tCheckboxGroup as DropdownMenuCheckboxGroup,\n\tCheckboxItem as DropdownMenuCheckboxItem,\n\tContent as DropdownMenuContent,\n\tPortal as DropdownMenuPortal,\n\tGroup as DropdownMenuGroup,\n\tItem as DropdownMenuItem,\n\tLabel as DropdownMenuLabel,\n\tRadioGroup as DropdownMenuRadioGroup,\n\tRadioItem as DropdownMenuRadioItem,\n\tSeparator as DropdownMenuSeparator,\n\tShortcut as DropdownMenuShortcut,\n\tSub as DropdownMenuSub,\n\tSubContent as DropdownMenuSubContent,\n\tSubTrigger as DropdownMenuSubTrigger,\n\tTrigger as DropdownMenuTrigger,\n\tGroupHeading as DropdownMenuGroupHeading,\n\tGroup,\n\tGroupHeading,\n\tItem,\n\tLabel,\n\tRadioGroup,\n\tRadioItem,\n\tRoot,\n\tSeparator,\n\tShortcut,\n\tSub,\n\tSubContent,\n\tSubTrigger,\n\tTrigger,\n};\n"
  },
  {
    "path": "src/lib/components/ui/label/index.ts",
    "content": "import Root from \"./label.svelte\";\n\nexport {\n\tRoot,\n\t//\n\tRoot as Label,\n};\n"
  },
  {
    "path": "src/lib/components/ui/label/label.svelte",
    "content": "<script lang=\"ts\">\n\timport { Label as LabelPrimitive } from \"bits-ui\";\n\timport { cn } from \"$lib/utils.js\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\t...restProps\n\t}: LabelPrimitive.RootProps = $props();\n</script>\n\n<LabelPrimitive.Root\n\tbind:ref\n\tdata-slot=\"label\"\n\tclass={cn(\n\t\t\"flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50\",\n\t\tclassName\n\t)}\n\t{...restProps}\n/>\n"
  },
  {
    "path": "src/lib/components/ui/radio-group/index.ts",
    "content": "import Root from \"./radio-group.svelte\";\nimport Item from \"./radio-group-item.svelte\";\n\nexport {\n\tRoot,\n\tItem,\n\t//\n\tRoot as RadioGroup,\n\tItem as RadioGroupItem,\n};\n"
  },
  {
    "path": "src/lib/components/ui/radio-group/radio-group-item.svelte",
    "content": "<script lang=\"ts\">\n\timport { RadioGroup as RadioGroupPrimitive } from \"bits-ui\";\n\timport CircleIcon from \"@lucide/svelte/icons/circle\";\n\timport { cn, type WithoutChildrenOrChild } from \"$lib/utils.js\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\t...restProps\n\t}: WithoutChildrenOrChild<RadioGroupPrimitive.ItemProps> = $props();\n</script>\n\n<RadioGroupPrimitive.Item\n\tbind:ref\n\tdata-slot=\"radio-group-item\"\n\tclass={cn(\n\t\t\"border-input text-primary focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 aspect-square size-4 shrink-0 rounded-full border shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50\",\n\t\tclassName\n\t)}\n\t{...restProps}\n>\n\t{#snippet children({ checked })}\n\t\t<div data-slot=\"radio-group-indicator\" class=\"relative flex items-center justify-center\">\n\t\t\t{#if checked}\n\t\t\t\t<CircleIcon\n\t\t\t\t\tclass=\"fill-primary absolute start-1/2 top-1/2 size-2 -translate-x-1/2 -translate-y-1/2\"\n\t\t\t\t/>\n\t\t\t{/if}\n\t\t</div>\n\t{/snippet}\n</RadioGroupPrimitive.Item>\n"
  },
  {
    "path": "src/lib/components/ui/radio-group/radio-group.svelte",
    "content": "<script lang=\"ts\">\n\timport { RadioGroup as RadioGroupPrimitive } from \"bits-ui\";\n\timport { cn } from \"$lib/utils.js\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\tvalue = $bindable(\"\"),\n\t\t...restProps\n\t}: RadioGroupPrimitive.RootProps = $props();\n</script>\n\n<RadioGroupPrimitive.Root\n\tbind:ref\n\tbind:value\n\tdata-slot=\"radio-group\"\n\tclass={cn(\"grid gap-3\", className)}\n\t{...restProps}\n/>\n"
  },
  {
    "path": "src/lib/components/ui/select/index.ts",
    "content": "import Root from \"./select.svelte\";\nimport Group from \"./select-group.svelte\";\nimport Label from \"./select-label.svelte\";\nimport Item from \"./select-item.svelte\";\nimport Content from \"./select-content.svelte\";\nimport Trigger from \"./select-trigger.svelte\";\nimport Separator from \"./select-separator.svelte\";\nimport ScrollDownButton from \"./select-scroll-down-button.svelte\";\nimport ScrollUpButton from \"./select-scroll-up-button.svelte\";\nimport GroupHeading from \"./select-group-heading.svelte\";\nimport Portal from \"./select-portal.svelte\";\n\nexport {\n\tRoot,\n\tGroup,\n\tLabel,\n\tItem,\n\tContent,\n\tTrigger,\n\tSeparator,\n\tScrollDownButton,\n\tScrollUpButton,\n\tGroupHeading,\n\tPortal,\n\t//\n\tRoot as Select,\n\tGroup as SelectGroup,\n\tLabel as SelectLabel,\n\tItem as SelectItem,\n\tContent as SelectContent,\n\tTrigger as SelectTrigger,\n\tSeparator as SelectSeparator,\n\tScrollDownButton as SelectScrollDownButton,\n\tScrollUpButton as SelectScrollUpButton,\n\tGroupHeading as SelectGroupHeading,\n\tPortal as SelectPortal,\n};\n"
  },
  {
    "path": "src/lib/components/ui/select/select-content.svelte",
    "content": "<script lang=\"ts\">\n\timport { Select as SelectPrimitive } from \"bits-ui\";\n\timport SelectPortal from \"./select-portal.svelte\";\n\timport SelectScrollUpButton from \"./select-scroll-up-button.svelte\";\n\timport SelectScrollDownButton from \"./select-scroll-down-button.svelte\";\n\timport { cn, type WithoutChild } from \"$lib/utils.js\";\n\timport type { ComponentProps } from \"svelte\";\n\timport type { WithoutChildrenOrChild } from \"$lib/utils.js\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\tsideOffset = 4,\n\t\tportalProps,\n\t\tchildren,\n\t\tpreventScroll = true,\n\t\t...restProps\n\t}: WithoutChild<SelectPrimitive.ContentProps> & {\n\t\tportalProps?: WithoutChildrenOrChild<ComponentProps<typeof SelectPortal>>;\n\t} = $props();\n</script>\n\n<SelectPortal {...portalProps}>\n\t<SelectPrimitive.Content\n\t\tbind:ref\n\t\t{sideOffset}\n\t\t{preventScroll}\n\t\tdata-slot=\"select-content\"\n\t\tclass={cn(\n\t\t\t\"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-end-2 data-[side=right]:slide-in-from-start-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-(--bits-select-content-available-height) min-w-[8rem] origin-(--bits-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border shadow-md data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1\",\n\t\t\tclassName\n\t\t)}\n\t\t{...restProps}\n\t>\n\t\t<SelectScrollUpButton />\n\t\t<SelectPrimitive.Viewport\n\t\t\tclass={cn(\n\t\t\t\t\"h-(--bits-select-anchor-height) w-full min-w-(--bits-select-anchor-width) scroll-my-1 p-1\"\n\t\t\t)}\n\t\t>\n\t\t\t{@render children?.()}\n\t\t</SelectPrimitive.Viewport>\n\t\t<SelectScrollDownButton />\n\t</SelectPrimitive.Content>\n</SelectPortal>\n"
  },
  {
    "path": "src/lib/components/ui/select/select-group-heading.svelte",
    "content": "<script lang=\"ts\">\n\timport { Select as SelectPrimitive } from \"bits-ui\";\n\timport { cn } from \"$lib/utils.js\";\n\timport type { ComponentProps } from \"svelte\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\tchildren,\n\t\t...restProps\n\t}: ComponentProps<typeof SelectPrimitive.GroupHeading> = $props();\n</script>\n\n<SelectPrimitive.GroupHeading\n\tbind:ref\n\tdata-slot=\"select-group-heading\"\n\tclass={cn(\"text-muted-foreground px-2 py-1.5 text-xs\", className)}\n\t{...restProps}\n>\n\t{@render children?.()}\n</SelectPrimitive.GroupHeading>\n"
  },
  {
    "path": "src/lib/components/ui/select/select-group.svelte",
    "content": "<script lang=\"ts\">\n\timport { Select as SelectPrimitive } from \"bits-ui\";\n\n\tlet { ref = $bindable(null), ...restProps }: SelectPrimitive.GroupProps = $props();\n</script>\n\n<SelectPrimitive.Group bind:ref data-slot=\"select-group\" {...restProps} />\n"
  },
  {
    "path": "src/lib/components/ui/select/select-item.svelte",
    "content": "<script lang=\"ts\">\n\timport CheckIcon from \"@lucide/svelte/icons/check\";\n\timport { Select as SelectPrimitive } from \"bits-ui\";\n\timport { cn, type WithoutChild } from \"$lib/utils.js\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\tvalue,\n\t\tlabel,\n\t\tchildren: childrenProp,\n\t\t...restProps\n\t}: WithoutChild<SelectPrimitive.ItemProps> = $props();\n</script>\n\n<SelectPrimitive.Item\n\tbind:ref\n\t{value}\n\tdata-slot=\"select-item\"\n\tclass={cn(\n\t\t\"data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 ps-2 pe-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2\",\n\t\tclassName\n\t)}\n\t{...restProps}\n>\n\t{#snippet children({ selected, highlighted })}\n\t\t<span class=\"absolute end-2 flex size-3.5 items-center justify-center\">\n\t\t\t{#if selected}\n\t\t\t\t<CheckIcon class=\"size-4\" />\n\t\t\t{/if}\n\t\t</span>\n\t\t{#if childrenProp}\n\t\t\t{@render childrenProp({ selected, highlighted })}\n\t\t{:else}\n\t\t\t{label || value}\n\t\t{/if}\n\t{/snippet}\n</SelectPrimitive.Item>\n"
  },
  {
    "path": "src/lib/components/ui/select/select-label.svelte",
    "content": "<script lang=\"ts\">\n\timport { cn, type WithElementRef } from \"$lib/utils.js\";\n\timport type { HTMLAttributes } from \"svelte/elements\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\tchildren,\n\t\t...restProps\n\t}: WithElementRef<HTMLAttributes<HTMLDivElement>> & {} = $props();\n</script>\n\n<div\n\tbind:this={ref}\n\tdata-slot=\"select-label\"\n\tclass={cn(\"text-muted-foreground px-2 py-1.5 text-xs\", className)}\n\t{...restProps}\n>\n\t{@render children?.()}\n</div>\n"
  },
  {
    "path": "src/lib/components/ui/select/select-portal.svelte",
    "content": "<script lang=\"ts\">\n\timport { Select as SelectPrimitive } from \"bits-ui\";\n\n\tlet { ...restProps }: SelectPrimitive.PortalProps = $props();\n</script>\n\n<SelectPrimitive.Portal {...restProps} />\n"
  },
  {
    "path": "src/lib/components/ui/select/select-scroll-down-button.svelte",
    "content": "<script lang=\"ts\">\n\timport ChevronDownIcon from \"@lucide/svelte/icons/chevron-down\";\n\timport { Select as SelectPrimitive } from \"bits-ui\";\n\timport { cn, type WithoutChildrenOrChild } from \"$lib/utils.js\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\t...restProps\n\t}: WithoutChildrenOrChild<SelectPrimitive.ScrollDownButtonProps> = $props();\n</script>\n\n<SelectPrimitive.ScrollDownButton\n\tbind:ref\n\tdata-slot=\"select-scroll-down-button\"\n\tclass={cn(\"flex cursor-default items-center justify-center py-1\", className)}\n\t{...restProps}\n>\n\t<ChevronDownIcon class=\"size-4\" />\n</SelectPrimitive.ScrollDownButton>\n"
  },
  {
    "path": "src/lib/components/ui/select/select-scroll-up-button.svelte",
    "content": "<script lang=\"ts\">\n\timport ChevronUpIcon from \"@lucide/svelte/icons/chevron-up\";\n\timport { Select as SelectPrimitive } from \"bits-ui\";\n\timport { cn, type WithoutChildrenOrChild } from \"$lib/utils.js\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\t...restProps\n\t}: WithoutChildrenOrChild<SelectPrimitive.ScrollUpButtonProps> = $props();\n</script>\n\n<SelectPrimitive.ScrollUpButton\n\tbind:ref\n\tdata-slot=\"select-scroll-up-button\"\n\tclass={cn(\"flex cursor-default items-center justify-center py-1\", className)}\n\t{...restProps}\n>\n\t<ChevronUpIcon class=\"size-4\" />\n</SelectPrimitive.ScrollUpButton>\n"
  },
  {
    "path": "src/lib/components/ui/select/select-separator.svelte",
    "content": "<script lang=\"ts\">\n\timport type { Separator as SeparatorPrimitive } from \"bits-ui\";\n\timport { Separator } from \"$lib/components/ui/separator/index.js\";\n\timport { cn } from \"$lib/utils.js\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\t...restProps\n\t}: SeparatorPrimitive.RootProps = $props();\n</script>\n\n<Separator\n\tbind:ref\n\tdata-slot=\"select-separator\"\n\tclass={cn(\"bg-border pointer-events-none -mx-1 my-1 h-px\", className)}\n\t{...restProps}\n/>\n"
  },
  {
    "path": "src/lib/components/ui/select/select-trigger.svelte",
    "content": "<script lang=\"ts\">\n\timport { Select as SelectPrimitive } from \"bits-ui\";\n\timport ChevronDownIcon from \"@lucide/svelte/icons/chevron-down\";\n\timport { cn, type WithoutChild } from \"$lib/utils.js\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\tchildren,\n\t\tsize = \"default\",\n\t\t...restProps\n\t}: WithoutChild<SelectPrimitive.TriggerProps> & {\n\t\tsize?: \"sm\" | \"default\";\n\t} = $props();\n</script>\n\n<SelectPrimitive.Trigger\n\tbind:ref\n\tdata-slot=\"select-trigger\"\n\tdata-size={size}\n\tclass={cn(\n\t\t\"border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 dark:hover:bg-input/50 flex w-fit items-center justify-between gap-2 rounded-md border bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none select-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n\t\tclassName\n\t)}\n\t{...restProps}\n>\n\t{@render children?.()}\n\t<ChevronDownIcon class=\"size-4 opacity-50\" />\n</SelectPrimitive.Trigger>\n"
  },
  {
    "path": "src/lib/components/ui/select/select.svelte",
    "content": "<script lang=\"ts\">\n\timport { Select as SelectPrimitive } from \"bits-ui\";\n\n\tlet {\n\t\topen = $bindable(false),\n\t\tvalue = $bindable(),\n\t\t...restProps\n\t}: SelectPrimitive.RootProps = $props();\n</script>\n\n<SelectPrimitive.Root bind:open bind:value={value as never} {...restProps} />\n"
  },
  {
    "path": "src/lib/components/ui/separator/index.ts",
    "content": "import Root from \"./separator.svelte\";\n\nexport {\n\tRoot,\n\t//\n\tRoot as Separator,\n};\n"
  },
  {
    "path": "src/lib/components/ui/separator/separator.svelte",
    "content": "<script lang=\"ts\">\n\timport { Separator as SeparatorPrimitive } from \"bits-ui\";\n\timport { cn } from \"$lib/utils.js\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\t\"data-slot\": dataSlot = \"separator\",\n\t\t...restProps\n\t}: SeparatorPrimitive.RootProps = $props();\n</script>\n\n<SeparatorPrimitive.Root\n\tbind:ref\n\tdata-slot={dataSlot}\n\tclass={cn(\n\t\t\"bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px\",\n\t\tclassName\n\t)}\n\t{...restProps}\n/>\n"
  },
  {
    "path": "src/lib/components/ui/slider/index.ts",
    "content": "import Root from \"./slider.svelte\";\n\nexport {\n\tRoot,\n\t//\n\tRoot as Slider,\n};\n"
  },
  {
    "path": "src/lib/components/ui/slider/slider.svelte",
    "content": "<script lang=\"ts\">\n\timport { Slider as SliderPrimitive } from \"bits-ui\";\n\timport { cn, type WithoutChildrenOrChild } from \"$lib/utils.js\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tvalue = $bindable(),\n\t\torientation = \"horizontal\",\n\t\tclass: className,\n\t\t...restProps\n\t}: WithoutChildrenOrChild<SliderPrimitive.RootProps> = $props();\n</script>\n\n<!--\nDiscriminated Unions + Destructing (required for bindable) do not\nget along, so we shut typescript up by casting `value` to `never`.\n-->\n<SliderPrimitive.Root\n\tbind:ref\n\tbind:value={value as never}\n\tdata-slot=\"slider\"\n\t{orientation}\n\tclass={cn(\n\t\t\"relative flex w-full touch-none items-center select-none data-[disabled]:opacity-50 data-[orientation=vertical]:h-full data-[orientation=vertical]:min-h-44 data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col\",\n\t\tclassName\n\t)}\n\t{...restProps}\n>\n\t{#snippet children({ thumbs })}\n\t\t<span\n\t\t\tdata-orientation={orientation}\n\t\t\tdata-slot=\"slider-track\"\n\t\t\tclass={cn(\n\t\t\t\t\"bg-muted relative grow overflow-hidden rounded-full data-[orientation=horizontal]:h-1.5 data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-1.5\"\n\t\t\t)}\n\t\t>\n\t\t\t<SliderPrimitive.Range\n\t\t\t\tdata-slot=\"slider-range\"\n\t\t\t\tclass={cn(\n\t\t\t\t\t\"bg-primary absolute data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full\"\n\t\t\t\t)}\n\t\t\t/>\n\t\t</span>\n\t\t{#each thumbs as thumb (thumb)}\n\t\t\t<SliderPrimitive.Thumb\n\t\t\t\tdata-slot=\"slider-thumb\"\n\t\t\t\tindex={thumb}\n\t\t\t\tclass=\"border-primary ring-ring/50 block size-4 shrink-0 rounded-full border bg-white shadow-sm transition-[color,box-shadow] hover:ring-4 focus-visible:ring-4 focus-visible:outline-hidden disabled:pointer-events-none disabled:opacity-50\"\n\t\t\t/>\n\t\t{/each}\n\t{/snippet}\n</SliderPrimitive.Root>\n"
  },
  {
    "path": "src/lib/components/ui/switch/index.ts",
    "content": "import Root from \"./switch.svelte\";\n\nexport {\n\tRoot,\n\t//\n\tRoot as Switch,\n};\n"
  },
  {
    "path": "src/lib/components/ui/switch/switch.svelte",
    "content": "<script lang=\"ts\">\n\timport { Switch as SwitchPrimitive } from \"bits-ui\";\n\timport { cn, type WithoutChildrenOrChild } from \"$lib/utils.js\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\tchecked = $bindable(false),\n\t\t...restProps\n\t}: WithoutChildrenOrChild<SwitchPrimitive.RootProps> = $props();\n</script>\n\n<SwitchPrimitive.Root\n\tbind:ref\n\tbind:checked\n\tdata-slot=\"switch\"\n\tclass={cn(\n\t\t\"data-[state=checked]:bg-primary data-[state=unchecked]:bg-input focus-visible:border-ring focus-visible:ring-ring/50 dark:data-[state=unchecked]:bg-input/80 peer inline-flex h-[1.15rem] w-8 shrink-0 items-center rounded-full border border-transparent shadow-xs transition-all outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50\",\n\t\tclassName\n\t)}\n\t{...restProps}\n>\n\t<SwitchPrimitive.Thumb\n\t\tdata-slot=\"switch-thumb\"\n\t\tclass={cn(\n\t\t\t\"bg-background dark:data-[state=unchecked]:bg-foreground dark:data-[state=checked]:bg-primary-foreground pointer-events-none block size-4 rounded-full ring-0 transition-transform data-[state=checked]:translate-x-[calc(100%-2px)] data-[state=unchecked]:translate-x-0\"\n\t\t)}\n\t/>\n</SwitchPrimitive.Root>\n"
  },
  {
    "path": "src/lib/components/ui/table/index.ts",
    "content": "import Root from \"./table.svelte\";\nimport Body from \"./table-body.svelte\";\nimport Caption from \"./table-caption.svelte\";\nimport Cell from \"./table-cell.svelte\";\nimport Footer from \"./table-footer.svelte\";\nimport Head from \"./table-head.svelte\";\nimport Header from \"./table-header.svelte\";\nimport Row from \"./table-row.svelte\";\n\nexport {\n\tRoot,\n\tBody,\n\tCaption,\n\tCell,\n\tFooter,\n\tHead,\n\tHeader,\n\tRow,\n\t//\n\tRoot as Table,\n\tBody as TableBody,\n\tCaption as TableCaption,\n\tCell as TableCell,\n\tFooter as TableFooter,\n\tHead as TableHead,\n\tHeader as TableHeader,\n\tRow as TableRow,\n};\n"
  },
  {
    "path": "src/lib/components/ui/table/table-body.svelte",
    "content": "<script lang=\"ts\">\n\timport { cn, type WithElementRef } from \"$lib/utils.js\";\n\timport type { HTMLAttributes } from \"svelte/elements\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\tchildren,\n\t\t...restProps\n\t}: WithElementRef<HTMLAttributes<HTMLTableSectionElement>> = $props();\n</script>\n\n<tbody\n\tbind:this={ref}\n\tdata-slot=\"table-body\"\n\tclass={cn(\"[&_tr:last-child]:border-0\", className)}\n\t{...restProps}\n>\n\t{@render children?.()}\n</tbody>\n"
  },
  {
    "path": "src/lib/components/ui/table/table-caption.svelte",
    "content": "<script lang=\"ts\">\n\timport { cn, type WithElementRef } from \"$lib/utils.js\";\n\timport type { HTMLAttributes } from \"svelte/elements\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\tchildren,\n\t\t...restProps\n\t}: WithElementRef<HTMLAttributes<HTMLElement>> = $props();\n</script>\n\n<caption\n\tbind:this={ref}\n\tdata-slot=\"table-caption\"\n\tclass={cn(\"text-muted-foreground mt-4 text-sm\", className)}\n\t{...restProps}\n>\n\t{@render children?.()}\n</caption>\n"
  },
  {
    "path": "src/lib/components/ui/table/table-cell.svelte",
    "content": "<script lang=\"ts\">\n\timport { cn, type WithElementRef } from \"$lib/utils.js\";\n\timport type { HTMLTdAttributes } from \"svelte/elements\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\tchildren,\n\t\t...restProps\n\t}: WithElementRef<HTMLTdAttributes> = $props();\n</script>\n\n<td\n\tbind:this={ref}\n\tdata-slot=\"table-cell\"\n\tclass={cn(\n\t\t\"bg-clip-padding p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pe-0\",\n\t\tclassName\n\t)}\n\t{...restProps}\n>\n\t{@render children?.()}\n</td>\n"
  },
  {
    "path": "src/lib/components/ui/table/table-footer.svelte",
    "content": "<script lang=\"ts\">\n\timport { cn, type WithElementRef } from \"$lib/utils.js\";\n\timport type { HTMLAttributes } from \"svelte/elements\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\tchildren,\n\t\t...restProps\n\t}: WithElementRef<HTMLAttributes<HTMLTableSectionElement>> = $props();\n</script>\n\n<tfoot\n\tbind:this={ref}\n\tdata-slot=\"table-footer\"\n\tclass={cn(\"bg-muted/50 border-t font-medium [&>tr]:last:border-b-0\", className)}\n\t{...restProps}\n>\n\t{@render children?.()}\n</tfoot>\n"
  },
  {
    "path": "src/lib/components/ui/table/table-head.svelte",
    "content": "<script lang=\"ts\">\n\timport { cn, type WithElementRef } from \"$lib/utils.js\";\n\timport type { HTMLThAttributes } from \"svelte/elements\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\tchildren,\n\t\t...restProps\n\t}: WithElementRef<HTMLThAttributes> = $props();\n</script>\n\n<th\n\tbind:this={ref}\n\tdata-slot=\"table-head\"\n\tclass={cn(\n\t\t\"text-foreground h-10 bg-clip-padding px-2 text-start align-middle font-medium whitespace-nowrap [&:has([role=checkbox])]:pe-0\",\n\t\tclassName\n\t)}\n\t{...restProps}\n>\n\t{@render children?.()}\n</th>\n"
  },
  {
    "path": "src/lib/components/ui/table/table-header.svelte",
    "content": "<script lang=\"ts\">\n\timport { cn, type WithElementRef } from \"$lib/utils.js\";\n\timport type { HTMLAttributes } from \"svelte/elements\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\tchildren,\n\t\t...restProps\n\t}: WithElementRef<HTMLAttributes<HTMLTableSectionElement>> = $props();\n</script>\n\n<thead\n\tbind:this={ref}\n\tdata-slot=\"table-header\"\n\tclass={cn(\"[&_tr]:border-b\", className)}\n\t{...restProps}\n>\n\t{@render children?.()}\n</thead>\n"
  },
  {
    "path": "src/lib/components/ui/table/table-row.svelte",
    "content": "<script lang=\"ts\">\n\timport { cn, type WithElementRef } from \"$lib/utils.js\";\n\timport type { HTMLAttributes } from \"svelte/elements\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\tchildren,\n\t\t...restProps\n\t}: WithElementRef<HTMLAttributes<HTMLTableRowElement>> = $props();\n</script>\n\n<tr\n\tbind:this={ref}\n\tdata-slot=\"table-row\"\n\tclass={cn(\n\t\t\"hover:[&,&>svelte-css-wrapper]:[&>th,td]:bg-muted/50 data-[state=selected]:bg-muted border-b transition-colors\",\n\t\tclassName\n\t)}\n\t{...restProps}\n>\n\t{@render children?.()}\n</tr>\n"
  },
  {
    "path": "src/lib/components/ui/table/table.svelte",
    "content": "<script lang=\"ts\">\n\timport type { HTMLTableAttributes } from \"svelte/elements\";\n\timport { cn, type WithElementRef } from \"$lib/utils.js\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\tchildren,\n\t\t...restProps\n\t}: WithElementRef<HTMLTableAttributes> = $props();\n</script>\n\n<div data-slot=\"table-container\" class=\"relative w-full overflow-x-auto\">\n\t<table\n\t\tbind:this={ref}\n\t\tdata-slot=\"table\"\n\t\tclass={cn(\"w-full caption-bottom text-sm\", className)}\n\t\t{...restProps}\n\t>\n\t\t{@render children?.()}\n\t</table>\n</div>\n"
  },
  {
    "path": "src/lib/components/ui/tabs/index.ts",
    "content": "import Root from \"./tabs.svelte\";\nimport Content from \"./tabs-content.svelte\";\nimport List from \"./tabs-list.svelte\";\nimport Trigger from \"./tabs-trigger.svelte\";\n\nexport {\n\tRoot,\n\tContent,\n\tList,\n\tTrigger,\n\t//\n\tRoot as Tabs,\n\tContent as TabsContent,\n\tList as TabsList,\n\tTrigger as TabsTrigger,\n};\n"
  },
  {
    "path": "src/lib/components/ui/tabs/tabs-content.svelte",
    "content": "<script lang=\"ts\">\n\timport { Tabs as TabsPrimitive } from \"bits-ui\";\n\timport { cn } from \"$lib/utils.js\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\t...restProps\n\t}: TabsPrimitive.ContentProps = $props();\n</script>\n\n<TabsPrimitive.Content\n\tbind:ref\n\tdata-slot=\"tabs-content\"\n\tclass={cn(\"flex-1 outline-none\", className)}\n\t{...restProps}\n/>\n"
  },
  {
    "path": "src/lib/components/ui/tabs/tabs-list.svelte",
    "content": "<script lang=\"ts\">\n\timport { Tabs as TabsPrimitive } from \"bits-ui\";\n\timport { cn } from \"$lib/utils.js\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\t...restProps\n\t}: TabsPrimitive.ListProps = $props();\n</script>\n\n<TabsPrimitive.List\n\tbind:ref\n\tdata-slot=\"tabs-list\"\n\tclass={cn(\n\t\t\"bg-muted text-muted-foreground inline-flex h-9 w-fit items-center justify-center rounded-lg p-[3px]\",\n\t\tclassName\n\t)}\n\t{...restProps}\n/>\n"
  },
  {
    "path": "src/lib/components/ui/tabs/tabs-trigger.svelte",
    "content": "<script lang=\"ts\">\n\timport { Tabs as TabsPrimitive } from \"bits-ui\";\n\timport { cn } from \"$lib/utils.js\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tclass: className,\n\t\t...restProps\n\t}: TabsPrimitive.TriggerProps = $props();\n</script>\n\n<TabsPrimitive.Trigger\n\tbind:ref\n\tdata-slot=\"tabs-trigger\"\n\tclass={cn(\n\t\t\"data-[state=active]:bg-background dark:data-[state=active]:text-foreground focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring dark:data-[state=active]:border-input dark:data-[state=active]:bg-input/30 text-foreground dark:text-muted-foreground inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-2 py-1 text-sm font-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:ring-[3px] focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:shadow-sm [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n\t\tclassName\n\t)}\n\t{...restProps}\n/>\n"
  },
  {
    "path": "src/lib/components/ui/tabs/tabs.svelte",
    "content": "<script lang=\"ts\">\n\timport { Tabs as TabsPrimitive } from \"bits-ui\";\n\timport { cn } from \"$lib/utils.js\";\n\n\tlet {\n\t\tref = $bindable(null),\n\t\tvalue = $bindable(\"\"),\n\t\tclass: className,\n\t\t...restProps\n\t}: TabsPrimitive.RootProps = $props();\n</script>\n\n<TabsPrimitive.Root\n\tbind:ref\n\tbind:value\n\tdata-slot=\"tabs\"\n\tclass={cn(\"flex flex-col gap-2\", className)}\n\t{...restProps}\n/>\n"
  },
  {
    "path": "src/lib/utils.ts",
    "content": "import { clsx, type ClassValue } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]) {\n\treturn twMerge(clsx(inputs));\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport type WithoutChild<T> = T extends { child?: any } ? Omit<T, 'child'> : T;\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport type WithoutChildren<T> = T extends { children?: any } ? Omit<T, 'children'> : T;\nexport type WithoutChildrenOrChild<T> = WithoutChildren<WithoutChild<T>>;\nexport type WithElementRef<T, U extends HTMLElement = HTMLElement> = T & { ref?: U | null };\n"
  },
  {
    "path": "src/routes/+layout.server.ts",
    "content": "// export async function load({ setHeaders }) {\n// \tsetHeaders({ 'Cache-Control': 'max-age=300, stale-while-revalidate=300' });\n// }\n"
  },
  {
    "path": "src/routes/+layout.svelte",
    "content": "<script lang=\"ts\">\n\timport '../app.css';\n\timport { ModeWatcher } from 'mode-watcher';\n\timport '$lib/assets/fonts/geist.css';\n\timport Header from './Header.svelte';\n\timport GlobalToc from './GlobalToc.svelte';\n\timport ViewTransition from './ViewTransition.svelte';\n\timport { page } from '$app/state';\n\n\tlet { children } = $props();\n\n\tlet globalTocOpen = $state(false);\n\n\tlet canonicalUrl = $derived.by(() => {\n\t\tconst url = page.url;\n\t\turl.protocol = 'https:';\n\t\turl.hostname = 'svelte-maplibre-gl.mierune.dev';\n\t\turl.port = '';\n\t\treturn url.toString();\n\t});\n\n\tlet currentYear = new Date().getFullYear();\n</script>\n\n<ModeWatcher />\n<ViewTransition />\n\n<header class=\"bg-opacity-85 sticky top-0 z-40 border-b bg-background backdrop-blur-sm\">\n\t<div class=\"mx-auto px-4 md:px-8 xl:container\">\n\t\t<Header bind:globalTocOpen />\n\t</div>\n</header>\n<div id=\"content\">\n\t{@render children()}\n</div>\n\n<footer class=\"font-zinc-500 border-t p-6 px-4 text-sm\">\n\t<div class=\"xl:container\">\n\t\t<p>&copy; {currentYear} Svelte Maplibre GL contributors</p>\n\t</div>\n</footer>\n\n<GlobalToc bind:open={globalTocOpen} />\n\n<svelte:head>\n\t<title>Svelte MapLibre GL</title>\n\t<link rel=\"canonical\" href={canonicalUrl} />\n</svelte:head>\n"
  },
  {
    "path": "src/routes/+page.svelte",
    "content": "<script lang=\"ts\">\n\timport { resolve } from '$app/paths';\n\timport heroImage from '$lib/assets/hero.svg';\n</script>\n\n<div class=\"container mx-auto w-full px-4 py-10 md:py-12\">\n\t<main class=\"mx-auto prose dark:prose-invert\">\n\t\t<h1 class=\"mb-0\">Svelte MapLibre GL</h1>\n\t\t<p>\n\t\t\tSvelte 5 wrapper for 🗺\n\t\t\t<a href=\"https://maplibre.org/maplibre-gl-js/docs/\">MapLibre GL JS</a> &mdash; Build interactive web maps\n\t\t\teffortlessly with <a href=\"https://svelte.dev/\">Svelte</a>’s reactive and declarative power 🚀\n\t\t</p>\n\t\t<p class=\"my-10!\">\n\t\t\t<a\n\t\t\t\thref={resolve('/examples/')}\n\t\t\t\tclass=\"rounded-full bg-[#2A5DAA] px-8 py-4 font-bold text-white no-underline transition-colors duration-300 hover:bg-[#FE3000]\"\n\t\t\t\t>Explore Examples</a\n\t\t\t>\n\t\t</p>\n\t\t<p>\n\t\t\t<img alt=\"hero\" width=\"300\" height=\"150\" class=\"w-full\" src={heroImage} />\n\t\t</p>\n\n\t\t<h2 class=\"font-bold\">Installation</h2>\n\t\t<pre><code>npm install --save-dev svelte-maplibre-gl</code></pre>\n\n\t\t<h2 class=\"font-bold\">Contents</h2>\n\t\t<ul>\n\t\t\t<li><a href={resolve('/docs/quickstart')}>Quickstart</a></li>\n\t\t\t<li><a href={resolve('/examples')}>Examples</a></li>\n\t\t\t<li><a href={resolve('/docs/components')}>API Reference</a></li>\n\t\t</ul>\n\n\t\t<h2 class=\"font-bold\">Features</h2>\n\t\t<ul>\n\t\t\t<li>The most declarative and reactive MapLibre GL JS experience, powered by Svelte 5</li>\n\t\t\t<li>\n\t\t\t\tA flexible, minimally opinionated API design that is suitable for both beginners and experienced MapLibre users\n\t\t\t</li>\n\t\t\t<li>Traditional imperative MapLibre GL JS usage remains fully supported</li>\n\t\t</ul>\n\t</main>\n</div>\n\n<svelte:head>\n\t<title>Svelte MapLibre GL - Build interactive web maps effortlessly with MapLibre GL JS and Svelte</title>\n\t<meta name=\"description\" content=\"Build interactive web maps effortlessly with MapLibre GL JS and Svelte\" />\n</svelte:head>\n"
  },
  {
    "path": "src/routes/DarkModeSelector.svelte",
    "content": "<script lang=\"ts\">\n\timport Sun from '@lucide/svelte/icons/sun';\n\timport Moon from '@lucide/svelte/icons/moon';\n\n\timport { resetMode, setMode } from 'mode-watcher';\n\timport * as DropdownMenu from '$lib/components/ui/dropdown-menu/index.js';\n\timport { buttonVariants } from '$lib/components/ui/button/index.js';\n</script>\n\n<DropdownMenu.Root>\n\t<DropdownMenu.Trigger class={buttonVariants({ variant: 'ghost', size: 'icon' })}>\n\t\t<Sun class=\"size-5! scale-100 rotate-0 transition-all md:size-6! dark:scale-0 dark:-rotate-90\" />\n\t\t<Moon class=\"absolute size-5! scale-0 rotate-90 transition-all md:size-6! dark:scale-100 dark:rotate-0\" />\n\t\t<span class=\"sr-only\">Toggle theme</span>\n\t</DropdownMenu.Trigger>\n\t<DropdownMenu.Content align=\"end\">\n\t\t<DropdownMenu.Item onclick={() => setMode('light')}>Light</DropdownMenu.Item>\n\t\t<DropdownMenu.Item onclick={() => setMode('dark')}>Dark</DropdownMenu.Item>\n\t\t<DropdownMenu.Item onclick={() => resetMode()}>System</DropdownMenu.Item>\n\t</DropdownMenu.Content>\n</DropdownMenu.Root>\n"
  },
  {
    "path": "src/routes/GlobalToc.svelte",
    "content": "<script lang=\"ts\">\n\timport Index from '$lib/components/Index.svelte';\n\timport CloseIcon from '@lucide/svelte/icons/x';\n\timport { cn } from '$lib/utils';\n\n\timport { toc as docsToc } from '$content/docs/toc';\n\t// import { toc as componentsToc } from '$content/components/toc';\n\timport { toc as examplesToc } from '$content/examples/toc';\n\timport { beforeNavigate } from '$app/navigation';\n\timport { Button } from '$lib/components/ui/button';\n\n\tlet { open = $bindable() }: { open: boolean } = $props();\n\n\tbeforeNavigate(() => {\n\t\topen = false;\n\t});\n\n\t$effect(() => {\n\t\tdocument.body.style.overflow = open ? 'hidden' : '';\n\t\treturn () => {\n\t\t\tdocument.body.style.overflow = '';\n\t\t};\n\t});\n</script>\n\n<div\n\tid=\"global-toc\"\n\tclass={cn(\n\t\t`ease fixed inset-0 z-50 bg-background/40 transition-all duration-400 md:hidden`,\n\t\topen ? 'opacity-100 backdrop-blur-xs' : 'backdrop-blur-0 pointer-events-none opacity-0'\n\t)}\n>\n\t<div class=\"absolute inset-0\" aria-hidden=\"true\" onmousedown={() => (open = false)}></div>\n\t<div\n\t\tclass={cn(\n\t\t\t`ease absolute inset-0 z-50 w-72 overflow-scroll bg-muted/90 transition-all duration-400 md:hidden`,\n\t\t\topen ? 'translate-x-0 shadow-lg' : '-translate-x-full shadow-none'\n\t\t)}\n\t>\n\t\t<div class=\"sticky top-0 z-50 flex h-[72px] items-center justify-between bg-background px-4 leading-none\">\n\t\t\t<h1 class=\"ml-3 text-lg font-bold\">\n\t\t\t\t<span>Svelte MapLibre GL</span>\n\t\t\t</h1>\n\t\t\t<Button variant=\"outline\" size=\"icon\" title=\"Menu\" onclick={() => (open = false)}>\n\t\t\t\t<CloseIcon class=\"size-6!\"></CloseIcon>\n\t\t\t</Button>\n\t\t</div>\n\t\t<div class=\"p-8 pb-0\">\n\t\t\t<Index name=\"Docs\" toc={docsToc}></Index>\n\t\t</div>\n\t\t<div class=\"p-8 pb-0\">\n\t\t\t<Index name=\"Examples\" toc={examplesToc}></Index>\n\t\t</div>\n\t\t<!--\n\t\t<div class=\"p-8 pb-0\">\n\t\t\t<Index name=\"API Reference\" toc={componentsToc}></Index>\n\t\t</div>\n\t\t-->\n\t</div>\n</div>\n"
  },
  {
    "path": "src/routes/Header.svelte",
    "content": "<script lang=\"ts\">\n\timport { resolve } from '$app/paths';\n\timport { browser } from '$app/environment';\n\timport { goto } from '$app/navigation';\n\timport { page } from '$app/state';\n\n\timport MapPinned from '@lucide/svelte/icons/map-pinned';\n\timport Menu from '@lucide/svelte/icons/menu';\n\timport GitHub from '$lib/assets/icons/GitHub.svelte';\n\timport { Button } from '$lib/components/ui/button/index.js';\n\timport DarkModeSelector from './DarkModeSelector.svelte';\n\n\timport { default as docsearch } from '@docsearch/js';\n\timport '@docsearch/css/dist/button.css';\n\timport '@docsearch/css/dist/modal.css';\n\n\tlet { globalTocOpen = $bindable() } = $props();\n\n\tif (browser) {\n\t\ttry {\n\t\t\tdocsearch({\n\t\t\t\tcontainer: '#docsearch',\n\t\t\t\tappId: '78TOQ3W600',\n\t\t\t\tindexName: 'svelte-maplibre-gl',\n\t\t\t\tapiKey: '096ebe16a7ae7b573fc996e9a08edbc0',\n\t\t\t\tnavigator: {\n\t\t\t\t\tnavigate({ itemUrl }) {\n\t\t\t\t\t\tconst url = new URL(itemUrl);\n\n\t\t\t\t\t\t// eslint-disable-next-line svelte/no-navigation-without-resolve\n\t\t\t\t\t\tgoto(url.pathname + url.search + url.hash);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t});\n\t\t} catch (e) {\n\t\t\tconsole.error(e);\n\t\t}\n\t}\n</script>\n\n<div class=\"flex h-[72px] w-full shrink-0 items-center justify-between leading-none\">\n\t<div class=\"flex h-full w-full items-center\">\n\t\t<div class=\"mr-3 md:hidden\">\n\t\t\t<Button\n\t\t\t\tvariant=\"outline\"\n\t\t\t\tsize=\"icon\"\n\t\t\t\ttitle=\"Toggle Menu\"\n\t\t\t\taria-haspopup=\"dialog\"\n\t\t\t\taria-expanded={globalTocOpen}\n\t\t\t\taria-label=\"Toggle Menu\"\n\t\t\t\tonclick={() => (globalTocOpen = !globalTocOpen)}\n\t\t\t>\n\t\t\t\t<Menu class=\"size-6!\" />\n\t\t\t</Button>\n\t\t</div>\n\t\t<h1 class=\"text-lg font-bold md:text-xl\">\n\t\t\t<a href={resolve('/')} class=\"\">\n\t\t\t\t<MapPinned class=\"mr-1.5 hidden size-6! pb-1 md:inline-block\" /><span>Svelte MapLibre GL</span>\n\t\t\t</a>\n\t\t</h1>\n\t\t<nav class=\"ml-12 hidden gap-x-6 font-medium min-[640px]:flex\">\n\t\t\t<a\n\t\t\t\thref={resolve('/docs/quickstart')}\n\t\t\t\tdata-active={page.url.pathname.startsWith('/docs') && !page.url.pathname.startsWith('/docs/components')}\n\t\t\t\tclass=\"text-sm text-foreground/70 transition-colors hover:text-foreground data-[active=true]:font-semibold\"\n\t\t\t\t>Docs\n\t\t\t</a>\n\t\t\t<a\n\t\t\t\thref={resolve('/examples/plain')}\n\t\t\t\tdata-active={page.url.pathname.startsWith('/examples')}\n\t\t\t\tclass=\"text-sm text-foreground/70 transition-colors hover:text-foreground data-[active=true]:font-semibold\"\n\t\t\t\t>Examples</a\n\t\t\t>\n\t\t\t<!--\n\t\t\t<a\n\t\t\t\thref=\"/docs/components/MapLibre\"\n\t\t\t\tdata-active={page.url.pathname.startsWith('/docs/components')}\n\t\t\t\tclass=\"text-sm text-foreground/70 transition-colors hover:text-foreground data-[active=true]:font-semibold\"\n\t\t\t\t>API Reference</a\n\t\t\t>\n\t\t\t-->\n\t\t</nav>\n\t</div>\n\t<div class=\"flex items-center text-xs leading-none\">\n\t\t<div class=\"md:mr-2\">\n\t\t\t<div id=\"docsearch\"></div>\n\t\t</div>\n\t\t<Button\n\t\t\tclass=\"-ml-0.5\"\n\t\t\tvariant=\"ghost\"\n\t\t\tsize=\"icon\"\n\t\t\thref=\"https://github.com/MIERUNE/svelte-maplibre-gl\"\n\t\t\ttarget=\"_blank\"\n\t\t\ttitle=\"GitHub repository\"\n\t\t>\n\t\t\t<GitHub class=\"size-5! md:size-6!\" />\n\t\t</Button>\n\t\t<div class=\"-mr-1 -ml-1 md:ml-1\">\n\t\t\t<DarkModeSelector />\n\t\t</div>\n\t</div>\n</div>\n\n<style lang=\"postcss\">\n\t:global(.DocSearch-Button) {\n\t\tmargin-left: 0;\n\t}\n\t:global(.DocSearch-Form) {\n\t\tborder-radius: 20px;\n\t}\n</style>\n"
  },
  {
    "path": "src/routes/ViewTransition.svelte",
    "content": "<script lang=\"ts\">\n\t// import { onNavigate } from '$app/navigation';\n\n\t// onNavigate((navigation) => {\n\t// \tif (!document.startViewTransition) return;\n\n\t// \treturn new Promise((resolve) => {\n\t// \t\tdocument.startViewTransition(async () => {\n\t// \t\t\tresolve();\n\t// \t\t\tawait navigation.complete;\n\t// \t\t});\n\t// \t});\n\t// });\n</script>\n"
  },
  {
    "path": "src/routes/docs/+layout.ts",
    "content": "// export const prerender = true;\n"
  },
  {
    "path": "src/routes/docs/+page.svelte",
    "content": "<script lang=\"ts\">\n\timport Index from '$lib/components/Index.svelte';\n\n\timport { toc } from '$content/docs/toc.js';\n</script>\n\n<div id=\"toc\" class=\"m-auto p-8 py-10 xl:container\">\n\t<Index name=\"Docs\" {toc} />\n</div>\n"
  },
  {
    "path": "src/routes/docs/[slug]/+layout.svelte",
    "content": "<script lang=\"ts\">\n\timport Index from '$lib/components/Index.svelte';\n\timport { toc } from '$content/docs/toc';\n\n\tlet { children } = $props();\n</script>\n\n<div class=\"mx-auto grid gap-4 px-4 md:grid-cols-[210px_minmax(0,1fr)] md:px-8 xl:container\">\n\t<aside class=\"sticky top-18 bottom-0 hidden h-[calc(100vh-4rem)] overflow-scroll py-10 md:block\">\n\t\t<Index name=\"Docs\" {toc} />\n\t</aside>\n\t<main class=\"grid-cols-[1fr_210px]\">\n\t\t{@render children()}\n\t</main>\n</div>\n"
  },
  {
    "path": "src/routes/docs/[slug]/+page.svelte",
    "content": "<script lang=\"ts\">\n\timport * as Breadcrumb from '$lib/components/ui/breadcrumb/index.js';\n\tconst { data } = $props();\n</script>\n\n<div class=\"grid gap-x-8 lg:grid-cols-[1fr_160px]\">\n\t<div class=\"min-h-[calc(100vh-4rem)] w-full min-w-0 py-10\">\n\t\t<Breadcrumb.Root class=\"mb-3\">\n\t\t\t<Breadcrumb.List>\n\t\t\t\t<Breadcrumb.Item>\n\t\t\t\t\t<Breadcrumb.Link href=\"/docs/\">Docs</Breadcrumb.Link>\n\t\t\t\t</Breadcrumb.Item>\n\t\t\t\t<Breadcrumb.Separator />\n\t\t\t\t<Breadcrumb.Item>\n\t\t\t\t\t<Breadcrumb.Page>{data.meta.title}</Breadcrumb.Page>\n\t\t\t\t</Breadcrumb.Item>\n\t\t\t</Breadcrumb.List>\n\t\t</Breadcrumb.Root>\n\n\t\t<h1 class=\"mb-2 text-4xl font-bold\">{data.meta.title}</h1>\n\t\t<p class=\"mb-6 text-muted-foreground\">\n\t\t\t{data.meta.description}\n\t\t</p>\n\n\t\t<div class=\"prose max-w-none dark:prose-invert\">\n\t\t\t<data.Content shiki={data.shiki} />\n\t\t</div>\n\t</div>\n\t<aside class=\"sticky top-28 hidden h-[calc(100vh-7rem)] lg:block\">\n\t\t<div class=\"font-medium\">On This Page</div>\n\t</aside>\n</div>\n\n<svelte:head>\n\t<title>{data.meta.title} - Svelte MapLibre GL</title>\n\t<meta name=\"description\" content={data.meta.description} />\n</svelte:head>\n"
  },
  {
    "path": "src/routes/docs/[slug]/+page.ts",
    "content": "import { error } from '@sveltejs/kit';\nimport type { Component } from 'svelte';\nimport { browser } from '$app/environment';\n\nimport { createHighlighter, createJavaScriptRegexEngine, createOnigurumaEngine } from 'shiki';\nimport svelte from 'shiki/langs/svelte.mjs';\nimport dark from 'shiki/themes/github-dark-default.mjs';\n\nconst shiki = createHighlighter({\n\tthemes: [dark],\n\tlangs: [svelte],\n\tengine: browser ? createOnigurumaEngine(import('shiki/wasm')) : createJavaScriptRegexEngine()\n});\n\nexport const load = async ({ params }) => {\n\tconst { slug } = params;\n\n\ttry {\n\t\tconst post = (await import(`$content/docs/${slug}/content.svelte.md`)) as {\n\t\t\tdefault: Component;\n\t\t\tmetadata: {\n\t\t\t\ttitle: string;\n\t\t\t\tdescription: string;\n\t\t\t};\n\t\t};\n\t\treturn {\n\t\t\tContent: post.default,\n\t\t\tmeta: { ...post.metadata, slug },\n\t\t\tshiki: await shiki\n\t\t};\n\t} catch {\n\t\terror(404, `Docs '${slug}' not found`);\n\t}\n};\n"
  },
  {
    "path": "src/routes/docs/components/+page.svelte",
    "content": "<script lang=\"ts\">\n\t// import Index from '$lib/components/Index.svelte';\n\n\t// import { toc } from '$content/components/toc.js';\n</script>\n\n<!--\n<div id=\"toc\" class=\"m-auto p-8 py-10 xl:container\">\n\t<Index name=\"API Reference\" {toc} />\n</div>\n-->\n"
  },
  {
    "path": "src/routes/docs/components/[slug]/_+layout.svelte_",
    "content": "<script lang=\"ts\">\n\t// import Index from '$lib/components/Index.svelte';\n\t// import { toc } from '$content/components/toc';\n\n\tlet { children } = $props();\n</script>\n\n<div class=\"mx-auto grid gap-4 px-4 md:grid-cols-[210px_minmax(0,1fr)] md:px-8 xl:container\">\n\t<!--\n\t<aside class=\"sticky top-18 bottom-0 hidden h-[calc(100vh-4rem)] overflow-scroll py-10 md:block\">\n\t\t<Index name=\"API Reference\" {toc} />\n\t</aside>\n\t-->\n\t<main class=\"grid-cols-[1fr_210px]\">\n\t\t{@render children()}\n\t</main>\n</div>\n"
  },
  {
    "path": "src/routes/docs/components/[slug]/_+page.svelte_",
    "content": "<script lang=\"ts\">\n\timport * as Breadcrumb from '$lib/components/ui/breadcrumb/index.js';\n\timport Prop from './Prop.svelte';\n\timport * as Table from '$lib/components/ui/table/index.js';\n\tconst { data } = $props();\n\n\tconst requiredProps = $derived(new Map(data.doc.props.entries().filter(([, prop]) => !prop.isOptional)));\n\tconst optionalProps = $derived(new Map(data.doc.props.entries().filter(([, prop]) => prop.isOptional)));\n</script>\n\n<div class=\"grid gap-x-8 lg:grid-cols-[1fr_160px]\">\n\t<div class=\"min-h-[calc(100vh-4rem)] w-full min-w-0 py-10\">\n\t\t<Breadcrumb.Root class=\"mb-3\">\n\t\t\t<Breadcrumb.List>\n\t\t\t\t<Breadcrumb.Item>\n\t\t\t\t\t<Breadcrumb.Link href=\"/docs/components/\">API Reference</Breadcrumb.Link>\n\t\t\t\t</Breadcrumb.Item>\n\t\t\t\t<Breadcrumb.Separator />\n\t\t\t\t<Breadcrumb.Item>\n\t\t\t\t\t<Breadcrumb.Page>{data.title}</Breadcrumb.Page>\n\t\t\t\t</Breadcrumb.Item>\n\t\t\t</Breadcrumb.List>\n\t\t</Breadcrumb.Root>\n\t\t<h1 class=\"mb-2 text-4xl font-bold\">{data.title}</h1>\n\n\t\t<p class=\"mb-6 text-muted-foreground\">API Reference (beta) for <code>{`<${data.targetComponent} />`}</code></p>\n\n\t\t<Table.Root>\n\t\t\t<Table.Header>\n\t\t\t\t<Table.Row>\n\t\t\t\t\t<Table.Head class=\"max-w-[25%] min-w-[120px]\">Property</Table.Head>\n\t\t\t\t\t<Table.Head>Type</Table.Head>\n\t\t\t\t\t<Table.Head>Description</Table.Head>\n\t\t\t\t</Table.Row>\n\t\t\t</Table.Header>\n\t\t\t<Table.Body>\n\t\t\t\t{#each requiredProps as [name, prop] (name)}\n\t\t\t\t\t{#if !prop.isOptional}\n\t\t\t\t\t\t<Prop {name} {prop} types={data.doc.types} />\n\t\t\t\t\t{/if}\n\t\t\t\t{/each}\n\n\t\t\t\t{#each optionalProps as [name, prop] (name)}\n\t\t\t\t\t{#if prop.isOptional}\n\t\t\t\t\t\t<Prop {name} {prop} types={data.doc.types} />\n\t\t\t\t\t{/if}\n\t\t\t\t{/each}\n\t\t\t</Table.Body>\n\t\t</Table.Root>\n\t</div>\n\t<aside class=\"sticky top-28 hidden h-[calc(100vh-7rem)] lg:block\">\n\t\t<div class=\"font-medium\">On This Page</div>\n\t</aside>\n</div>\n\n<svelte:head>\n\t<title>{data.title} - Svelte MapLibre GL</title>\n\t<meta name=\"description\" content={`API Reference (beta) for ${data.targetComponent} component`} />\n</svelte:head>\n"
  },
  {
    "path": "src/routes/docs/components/[slug]/_+page.ts_",
    "content": "import { error } from '@sveltejs/kit';\n// import { parse } from 'svelte-docgen';\n\ntype ParsedComponent = ReturnType<typeof parse>;\n\nconst loaders: Record<string, () => Promise<{ default: ParsedComponent }>> = Object.fromEntries([\n\t...Object.entries(import.meta.glob('$svmlgl/**/*.svelte', { query: '?docgen' })).map(([key, value]) => {\n\t\tconst name = key.match(/\\/([^/]+)\\.svelte$/)?.[1];\n\t\treturn [name, value] as const;\n\t}),\n\t...Object.entries(import.meta.glob('$svmlglext/**/*.svelte', { query: '?docgen' })).map(([key, value]) => {\n\t\tconst name = key.match(/\\/([^/]+)\\.svelte$/)?.[1];\n\t\treturn [name, value] as const;\n\t})\n]);\n\nexport const load = async ({ params }) => {\n\tconst { slug } = params;\n\tconst loader = loaders[slug]();\n\tif (!loader) {\n\t\terror(404, `Component '${slug}' not found`);\n\t}\n\tconst doc = (await loader).default;\n\treturn {\n\t\ttitle: slug,\n\t\ttargetComponent: slug,\n\t\tdoc\n\t};\n};\n"
  },
  {
    "path": "src/routes/docs/components/[slug]/_Prop.svelte_",
    "content": "<script lang=\"ts\">\n\timport type { Prop, Types } from 'svelte-docgen/doc';\n\timport * as Table from '$lib/components/ui/table/index.js';\n\timport { formatType, formatDescription } from './utils.js';\n\n\tconst { name, prop, types }: { name: string; prop: Prop; types: Types } = $props();\n</script>\n\n<Table.Row>\n\t<Table.Cell class=\"\">\n\t\t<code class=\"font-bold break-all\">{name}</code>\n\t\t<div class=\"text-xs font-semibold\">\n\t\t\t{#if prop.isOptional}\n\t\t\t\t<span class=\"text-muted-foreground\">optional</span>\n\t\t\t{:else}\n\t\t\t\t<span class=\"text-red-400\">required</span>\n\t\t\t{/if}\n\t\t\t{#if prop.isBindable}\n\t\t\t\t<span class=\"text-[#246bd5]\">bindable</span>\n\t\t\t{/if}\n\t\t</div>\n\t</Table.Cell>\n\t<Table.Cell class=\"text-sm\">\n\t\t<!-- eslint-disable-next-line svelte/no-at-html-tags -->\n\t\t<pre class=\"whitespace-pre-wrap\">{@html formatType(prop.type, types)}</pre>\n\t</Table.Cell>\n\t<Table.Cell>\n\t\t<div class=\"text-sm text-muted-foreground\">\n\t\t\t{#if prop.description}\n\t\t\t\t{formatDescription(prop.description)}\n\t\t\t{:else}\n\t\t\t\t-\n\t\t\t{/if}\n\t\t</div>\n\t\t{#if !prop.isBindable && prop.default && typeof prop.default !== 'string' && prop.default.kind !== 'undefined'}\n\t\t\t<div class=\"mt-1 text-xs\">\n\t\t\t\t<span class=\"font-semibold\">default:</span>\n\t\t\t\t<!-- eslint-disable-next-line svelte/no-at-html-tags -->\n\t\t\t\t{@html formatType(prop.default, types)}\n\t\t\t</div>\n\t\t{/if}\n\t</Table.Cell>\n</Table.Row>\n\n<style>\n\tpre :global(a) {\n\t\ttext-decoration: underline !important;\n\t}\n</style>\n"
  },
  {
    "path": "src/routes/docs/components/[slug]/_utils.ts_",
    "content": "import type { DisplayPart, TypeOrRef, Types } from 'svelte-docgen/doc';\n\nexport function formatType(type: TypeOrRef, types: Types): string {\n\tconst visited = new Set<TypeOrRef>();\n\tconst [res] = _format(type, types, visited, true);\n\treturn res;\n}\n\nfunction _formatWrapper(\n\ttype: TypeOrRef,\n\ttypes: Types,\n\tvisited: Set<TypeOrRef>,\n\tignoreUndefined = false\n): [string, boolean] {\n\tif (visited.has(type)) {\n\t\treturn ['...', false];\n\t}\n\tvisited.add(type);\n\tconst [formatted, needParens] = _format(type, types, visited, ignoreUndefined);\n\tvisited.delete(type);\n\treturn [formatted, needParens];\n}\n\nfunction _format(type: TypeOrRef, types: Types, visited: Set<TypeOrRef>, ignoreUndefined = false): [string, boolean] {\n\tif (typeof type === 'string') {\n\t\treturn _formatWrapper(types.get(type)!, types, visited, ignoreUndefined);\n\t}\n\tif ('alias' in type && type.alias) {\n\t\tlet name = formatQualifiedName(type.alias);\n\t\tif (\n\t\t\t!type.alias.endsWith('Like') &&\n\t\t\t(type.kind !== 'union' || type.types.some((t) => typeof t === 'string' || t.kind !== 'literal'))\n\t\t) {\n\t\t\tif (type.aliasTypeArgs?.length) {\n\t\t\t\tname += formatTypeArgs(type.aliasTypeArgs, types, visited);\n\t\t\t}\n\t\t\tif (type.kind === 'function') {\n\t\t\t\tname += '()';\n\t\t\t}\n\t\t\treturn [name, false];\n\t\t}\n\t}\n\tif (type.kind === 'array') {\n\t\tconst [res, needParens] = _formatWrapper(type.element, types, visited);\n\t\treturn needParens ? [`(${res})[]`, false] : [`${res}[]`, false];\n\t} else if (type.kind === 'tuple') {\n\t\tconst elements = type.elements.map((t) => _formatWrapper(t, types, visited)[0]).join(', ');\n\t\treturn [`[${elements}]`, false];\n\t} else if (type.kind === 'literal') {\n\t\tswitch (type.subkind) {\n\t\t\tcase 'string':\n\t\t\t\treturn [`\"${type.value}\"`, false];\n\t\t\tcase 'number':\n\t\t\t\treturn [`${type.value}`, false];\n\t\t\tcase 'boolean':\n\t\t\t\treturn [`${type.value}`, false];\n\t\t\tdefault:\n\t\t\t\treturn [type.subkind, false];\n\t\t}\n\t} else if (type.kind === 'constructible') {\n\t\tlet name = formatQualifiedName(type.name, 'classes');\n\t\tif (type.typeArgs?.length) {\n\t\t\tname += formatTypeArgs(type.typeArgs, types, visited);\n\t\t}\n\t\treturn [name, false];\n\t} else if (type.kind === 'function') {\n\t\tif (type.name === '\"svelte\".Snippet') {\n\t\t\tlet name = '<a target=\"_blank\" href=\"https://svelte.dev/docs/svelte/snippet\">Snippet</a>';\n\t\t\tif (type.typeArgs?.length) {\n\t\t\t\tname += formatTypeArgs(type.typeArgs, types, visited);\n\t\t\t}\n\t\t\treturn [name, false];\n\t\t}\n\t\tif (type.calls.length !== 1) {\n\t\t\treturn ['function', false];\n\t\t}\n\t\tconst call = type.calls[0];\n\t\tconst params = call.parameters\n\t\t\t.map((p) => {\n\t\t\t\tconst optional = p.isOptional ? '?' : '';\n\t\t\t\treturn `${p.name}${optional}: ${_formatWrapper(p.type, types, visited)[0]}`;\n\t\t\t})\n\t\t\t.join(', ');\n\t\treturn [`(${params}) => ${_formatWrapper(call.returns, types, visited)[0]}`, true];\n\t} else if (type.kind === 'union') {\n\t\tconst res = type.types\n\t\t\t.filter((t) => !ignoreUndefined || typeof t === 'string' || t.kind !== 'undefined')\n\t\t\t.map((t) => _formatWrapper(t, types, visited)[0])\n\t\t\t.join(' | ');\n\t\treturn [res, false];\n\t} else if (type.kind === 'intersection') {\n\t\tconst res = type.types.map((t) => _formatWrapper(t, types, visited)[0]).join(' | ');\n\t\treturn [res, true];\n\t} else if (type.kind === 'interface') {\n\t\tif (type.members.size === 0) {\n\t\t\treturn ['{}', false];\n\t\t}\n\t\tconst members = type.members\n\t\t\t.entries()\n\t\t\t.map(([name, m]) => {\n\t\t\t\tconst type = _formatWrapper(m.type, types, visited, m.isOptional)[0];\n\t\t\t\tconst optional = m.isOptional ? '?' : '';\n\t\t\t\treturn `  ${name}${optional}: ${type}`;\n\t\t\t})\n\t\t\t.toArray()\n\t\t\t.join(',\\n');\n\t\treturn [`{\\n${members}\\n}`, false];\n\t} else if (type.kind === 'type-parameter') {\n\t\treturn [formatQualifiedName(type.name), false];\n\t}\n\treturn [type.kind, false];\n}\n\nfunction formatTypeArgs(typeArgs: TypeOrRef[], types: Types, visited: Set<TypeOrRef>): string {\n\tconst args = typeArgs.map((t) => _formatWrapper(t, types, visited)[0]).join(', ');\n\treturn `&lt;${args}&gt;`;\n}\n\nconst MDN_API = new Set([\n\t'CSSStyleDeclaration',\n\t'GeolocateEvent',\n\t'GeolocationPosition',\n\t'GeolocationPositionError',\n\t'HTMLCanvasElement',\n\t'HTMLDivElement',\n\t'HTMLElement',\n\t'HTMLImageElement',\n\t'ImageBitmap',\n\t'ImageData',\n\t'MouseEvent',\n\t'TouchEvent',\n\t'WebGLRenderingContext',\n\t'WebGL2RenderingContext',\n\t'WheelEvent'\n]);\n\nconst MDN_OBJECTS = new Set(['SharedArrayBuffer', 'ArrayBuffer', 'Uint8Array', 'Uint8ClampedArray']);\n\nfunction formatQualifiedName(name: string, link: string = 'type-aliases'): string {\n\tlet alias = name;\n\tconst lastDotIndex = name.lastIndexOf('.');\n\tlet prefix = '';\n\tif (lastDotIndex !== -1) {\n\t\tprefix = name.slice(0, lastDotIndex);\n\t\talias = name.slice(lastDotIndex + 1);\n\t}\n\tif (MDN_API.has(alias)) {\n\t\treturn `<a target=\"_blank\" href=\"https://developer.mozilla.org/docs/Web/API/${alias}\">${alias}</a>`;\n\t}\n\tif (MDN_OBJECTS.has(alias)) {\n\t\treturn `<a target=\"_blank\" href=\"https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/${alias}\">${alias}</a>`;\n\t}\n\tif (alias === 'Map$1') {\n\t\treturn `<a target=\"_blank\" href=\"https://maplibre.org/maplibre-gl-js/docs/API/classes/Map/\">Map</a>`;\n\t}\n\tif (prefix.includes('/maplibre-gl\"')) {\n\t\treturn `<a target=\"_blank\" href=\"https://maplibre.org/maplibre-gl-js/docs/API/${link}/${alias}/\">${alias}</a>`;\n\t}\n\treturn alias;\n}\n\nexport function formatDescription(description: DisplayPart[]): string {\n\treturn description\n\t\t.filter((p) => p.kind === 'text')\n\t\t.map((part) => part.text)\n\t\t.join('');\n}\n"
  },
  {
    "path": "src/routes/docs/components/components.json",
    "content": "{\n\t\"components\": [\n\t\t\"AttributionControl\",\n\t\t\"BackgroundLayer\",\n\t\t\"CanvasSource\",\n\t\t\"CircleLayer\",\n\t\t\"ColorReliefLayer\",\n\t\t\"CustomControl\",\n\t\t\"CustomLayer\",\n\t\t\"FeatureState\",\n\t\t\"FillExtrusionLayer\",\n\t\t\"FillLayer\",\n\t\t\"FullScreenControl\",\n\t\t\"GeoJSONSource\",\n\t\t\"GeolocateControl\",\n\t\t\"GlobeControl\",\n\t\t\"Hash\",\n\t\t\"HeatmapLayer\",\n\t\t\"HillshadeLayer\",\n\t\t\"Image\",\n\t\t\"ImageLoader\",\n\t\t\"ImageSource\",\n\t\t\"Light\",\n\t\t\"LineLayer\",\n\t\t\"LogoControl\",\n\t\t\"MapLibre\",\n\t\t\"Marker\",\n\t\t\"NavigationControl\",\n\t\t\"Popup\",\n\t\t\"Projection\",\n\t\t\"Protocol\",\n\t\t\"QueryRenderedFeatures\",\n\t\t\"QuerySourceFeatures\",\n\t\t\"RasterDEMTileSource\",\n\t\t\"RasterLayer\",\n\t\t\"RasterTileSource\",\n\t\t\"RawLayer\",\n\t\t\"RawSource\",\n\t\t\"ScaleControl\",\n\t\t\"Sky\",\n\t\t\"Sprite\",\n\t\t\"SymbolLayer\",\n\t\t\"Terrain\",\n\t\t\"TerrainControl\",\n\t\t\"VectorTileSource\",\n\t\t\"VideoSource\"\n\t],\n\t\"extensions\": {\n\t\t\"@svelte-maplibre-gl/contour\": [\"MapLibreContourSource\"],\n\t\t\"@svelte-maplibre-gl/deckgl\": [\"DeckGLOverlay\"],\n\t\t\"@svelte-maplibre-gl/pmtiles\": [\"PMTilesProtocol\"],\n\t\t\"@svelte-maplibre-gl/terradraw\": [\"TerraDraw\"]\n\t}\n}\n"
  },
  {
    "path": "src/routes/examples/+layout.ts",
    "content": "export const prerender = true;\n"
  },
  {
    "path": "src/routes/examples/+page.svelte",
    "content": "<script lang=\"ts\">\n\timport Index from '$lib/components/Index.svelte';\n\n\timport { toc } from '$content/examples/toc.js';\n</script>\n\n<div id=\"toc\" class=\"m-auto p-8 py-10 xl:container\">\n\t<Index name=\"Examples\" {toc} />\n</div>\n"
  },
  {
    "path": "src/routes/examples/[slug]/+layout.svelte",
    "content": "<script lang=\"ts\">\n\timport Index from '$lib/components/Index.svelte';\n\timport { toc } from '$content/examples/toc';\n\n\tlet { children } = $props();\n</script>\n\n<div class=\"mx-auto grid gap-4 px-4 md:grid-cols-[210px_minmax(0,1fr)] md:px-8 xl:container\">\n\t<aside class=\"sticky top-18 bottom-0 hidden h-[calc(100vh-4rem)] overflow-scroll py-10 md:block\">\n\t\t<Index name=\"Examples\" {toc} />\n\t</aside>\n\t<main class=\"grid-cols-[1fr_210px]\">\n\t\t{@render children()}\n\t</main>\n</div>\n"
  },
  {
    "path": "src/routes/examples/[slug]/+page.svelte",
    "content": "<script lang=\"ts\">\n\timport * as Breadcrumb from '$lib/components/ui/breadcrumb/index.js';\n\tconst { data } = $props();\n</script>\n\n<div class=\"grid gap-x-8 lg:grid-cols-[1fr_160px]\">\n\t<div class=\"min-h-[calc(100vh-4rem)] w-full min-w-0 py-10\">\n\t\t<Breadcrumb.Root class=\"mb-3\">\n\t\t\t<Breadcrumb.List>\n\t\t\t\t<Breadcrumb.Item>\n\t\t\t\t\t<Breadcrumb.Link href=\"/examples/\">Examples</Breadcrumb.Link>\n\t\t\t\t</Breadcrumb.Item>\n\t\t\t\t<Breadcrumb.Separator />\n\t\t\t\t<Breadcrumb.Item>\n\t\t\t\t\t<Breadcrumb.Page>{data.meta.title}</Breadcrumb.Page>\n\t\t\t\t</Breadcrumb.Item>\n\t\t\t</Breadcrumb.List>\n\t\t</Breadcrumb.Root>\n\n\t\t<h1 class=\"mb-1 text-4xl font-bold\">{data.meta.title}</h1>\n\t\t<div class=\"mb-6\">\n\t\t\t<p class=\"text-lg text-muted-foreground\">\n\t\t\t\t{data.meta.description}\n\t\t\t</p>\n\t\t\t{#if data.meta.original}\n\t\t\t\t<p class=\"mt-1.5 text-xs text-muted-foreground\">\n\t\t\t\t\t<!-- eslint-disable-next-line svelte/no-navigation-without-resolve -->\n\t\t\t\t\tBased on: <a class=\"underline\" target=\"_blank\" href={data.meta.original}>{data.meta.original}</a>\n\t\t\t\t</p>\n\t\t\t{/if}\n\t\t</div>\n\n\t\t<div class=\"prose max-w-none dark:prose-invert\">\n\t\t\t<data.Content shiki={data.shiki} />\n\t\t</div>\n\t</div>\n\t<aside class=\"sticky top-28 hidden h-[calc(100vh-7rem)] lg:block\">\n\t\t<div class=\"font-medium\">On This Page</div>\n\t</aside>\n</div>\n\n<svelte:head>\n\t<title>{data.meta.title} - Svelte MapLibre GL</title>\n\t<meta name=\"description\" content={data.meta.description} />\n</svelte:head>\n"
  },
  {
    "path": "src/routes/examples/[slug]/+page.ts",
    "content": "import { error } from '@sveltejs/kit';\nimport type { Component } from 'svelte';\nimport { browser } from '$app/environment';\n\nimport { createHighlighter, createJavaScriptRegexEngine, createOnigurumaEngine } from 'shiki';\nimport svelte from 'shiki/langs/svelte.mjs';\nimport dark from 'shiki/themes/github-dark-default.mjs';\n\nconst shiki = createHighlighter({\n\tthemes: [dark],\n\tlangs: [svelte],\n\tengine: browser ? createOnigurumaEngine(import('shiki/wasm')) : createJavaScriptRegexEngine()\n});\n\nexport const load = async ({ params }) => {\n\tconst { slug } = params;\n\n\ttry {\n\t\tconst post = (await import(`$content/examples/${slug}/content.svelte.md`)) as {\n\t\t\tdefault: Component;\n\t\t\tmetadata: {\n\t\t\t\ttitle: string;\n\t\t\t\tdescription?: string;\n\t\t\t\toriginal?: string;\n\t\t\t};\n\t\t};\n\t\treturn {\n\t\t\tContent: post.default,\n\t\t\tmeta: { ...post.metadata, slug },\n\t\t\tshiki: await shiki\n\t\t};\n\t} catch {\n\t\terror(404, `Example '${slug}' not found`);\n\t}\n};\n"
  },
  {
    "path": "src/routes/sitemap.xml/+server.ts",
    "content": "import { toc as docsToc } from '$content/docs/toc.js';\nimport { toc as exampleToc } from '$content/examples/toc.js';\n// import { toc as componentToc } from '$content/components/toc.js';\nimport type { RequestHandler } from '@sveltejs/kit';\n\nexport const GET: RequestHandler = async ({ request }) => {\n\tconst urls: string[] = [];\n\tconst origin = new URL(request.url).origin;\n\n\turls.push(origin + '/');\n\n\turls.push(origin + '/examples/');\n\tfor (const section of exampleToc) {\n\t\tfor (const [path] of Object.entries(section.items)) {\n\t\t\turls.push(origin + path);\n\t\t}\n\t}\n\n\t// urls.push(origin + '/docs/components/');\n\t// for (const section of componentToc) {\n\t// \tfor (const [path] of Object.entries(section.items)) {\n\t// \t\turls.push(origin + path);\n\t// \t}\n\t// }\n\tfor (const section of docsToc) {\n\t\tfor (const [path] of Object.entries(section.items)) {\n\t\t\turls.push(origin + path);\n\t\t}\n\t}\n\n\treturn new Response(\n\t\t`\n<?xml version=\"1.0\" encoding=\"UTF-8\" ?>\n<urlset\n  xmlns=\"https://www.sitemaps.org/schemas/sitemap/0.9\"\n  xmlns:xhtml=\"https://www.w3.org/1999/xhtml\"\n  xmlns:mobile=\"https://www.google.com/schemas/sitemap-mobile/1.0\"\n  xmlns:news=\"https://www.google.com/schemas/sitemap-news/0.9\"\n  xmlns:image=\"https://www.google.com/schemas/sitemap-image/1.1\"\n  xmlns:video=\"https://www.google.com/schemas/sitemap-video/1.1\"\n>\n  ${urls.map((url) => `<url><loc>${url}</loc></url>`).join('\\n')}\n</urlset>`.trim(),\n\t\t{\n\t\t\theaders: {\n\t\t\t\t'Content-Type': 'application/xml'\n\t\t\t}\n\t\t}\n\t);\n};\n"
  },
  {
    "path": "svelte-maplibre-gl/CHANGELOG.md",
    "content": "# svelte-maplibre-gl\n\n## 1.0.3\n\n### Patch Changes\n\n- 6b3cd54: Handle feature.id being undefined in QueryRenderedFeatures.svelte\n\n## 1.0.2\n\n### Patch Changes\n\n- 608c2b5: Fix: add missing source prop to CircleLayer\n\n## 1.0.1\n\n### Patch Changes\n\n- a5cc3ef: Fix: GeolocationControl causes infinite $effect loop with latest Svelte\n"
  },
  {
    "path": "svelte-maplibre-gl/package.json",
    "content": "{\n\t\"name\": \"svelte-maplibre-gl\",\n\t\"version\": \"1.0.3\",\n\t\"license\": \"(MIT OR Apache-2.0)\",\n\t\"description\": \"Build interactive web maps effortlessly with MapLibre GL JS and Svelte\",\n\t\"repository\": {\n\t\t\"url\": \"https://github.com/MIERUNE/svelte-maplibre-gl\"\n\t},\n\t\"homepage\": \"https://svelte-maplibre-gl.mierune.dev/\",\n\t\"keywords\": [\n\t\t\"map\",\n\t\t\"svelte\",\n\t\t\"maplibre\",\n\t\t\"maplibre-gl\",\n\t\t\"maplibre-gl-js\",\n\t\t\"geospatial\",\n\t\t\"mapping\",\n\t\t\"gis\"\n\t],\n\t\"scripts\": {\n\t\t\"dev\": \"vite dev\",\n\t\t\"build\": \"vite build && npm run prepack\",\n\t\t\"preview\": \"vite preview\",\n\t\t\"prepare\": \"svelte-kit sync || echo ''\",\n\t\t\"prepack\": \"svelte-kit sync && svelte-package && publint\",\n\t\t\"check\": \"svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --compiler-warnings 'state_referenced_locally:ignore'\",\n\t\t\"check:watch\": \"svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch\",\n\t\t\"lint\": \"prettier --check .\"\n\t},\n\t\"files\": [\n\t\t\"dist\",\n\t\t\"!dist/**/*.test.*\",\n\t\t\"!dist/**/*.spec.*\"\n\t],\n\t\"sideEffects\": [\n\t\t\"**/*.css\"\n\t],\n\t\"svelte\": \"./dist/index.js\",\n\t\"types\": \"./dist/index.d.ts\",\n\t\"type\": \"module\",\n\t\"exports\": {\n\t\t\".\": {\n\t\t\t\"types\": \"./dist/index.d.ts\",\n\t\t\t\"svelte\": \"./dist/index.js\"\n\t\t}\n\t},\n\t\"peerDependencies\": {\n\t\t\"maplibre-gl\": \"^5.0.0 || ^4.0.0\",\n\t\t\"svelte\": \">=5.0.0\"\n\t},\n\t\"devDependencies\": {\n\t\t\"@sveltejs/kit\": \"catalog:\",\n\t\t\"@sveltejs/package\": \"catalog:\",\n\t\t\"@sveltejs/vite-plugin-svelte\": \"catalog:\",\n\t\t\"@types/geojson\": \"catalog:\",\n\t\t\"maplibre-gl\": \"catalog:\",\n\t\t\"publint\": \"catalog:\",\n\t\t\"svelte\": \"catalog:\",\n\t\t\"svelte-check\": \"catalog:\",\n\t\t\"typescript\": \"catalog:\",\n\t\t\"vite\": \"catalog:\"\n\t}\n}\n"
  },
  {
    "path": "svelte-maplibre-gl/src/app.d.ts",
    "content": "// See https://svelte.dev/docs/kit/types#app.d.ts\n// for information about these interfaces\ndeclare global {\n\tnamespace App {\n\t\t// interface Error {}\n\t\t// interface Locals {}\n\t\t// interface PageData {}\n\t\t// interface PageState {}\n\t\t// interface Platform {}\n\t}\n}\n\nexport {};\n"
  },
  {
    "path": "svelte-maplibre-gl/src/app.html",
    "content": "<!doctype html>\n<html lang=\"en\">\n\t<head>\n\t\t<meta charset=\"utf-8\" />\n\t\t<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\" />\n\t\t%sveltekit.head%\n\t</head>\n\t<body data-sveltekit-preload-data=\"hover\">\n\t\t<div style=\"display: contents\">%sveltekit.body%</div>\n\t</body>\n</html>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/contexts.svelte.ts",
    "content": "import type {\n\tMap as MapLibre,\n\tMarker,\n\tAddLayerObject,\n\tSourceSpecification,\n\tCanvasSourceSpecification,\n\tStyleSpecification,\n\tSkySpecification,\n\tTerrainSpecification,\n\tProjectionSpecification,\n\tLightSpecification\n} from 'maplibre-gl';\nimport { setContext, getContext } from 'svelte';\n\nconst MAP_CONTEXT_KEY = Symbol('MapLibre map context');\nconst SOURCE_CONTEXT_KEY = Symbol('MapLibre source context');\nconst LAYER_CONTEXT_KEY = Symbol('MapLibre layer context');\nconst MARKER_CONTEXT_KEY = Symbol('MapLibre marker context');\n\n// https://svelte.dev/docs/svelte/$state#Classes\nclass MapContext {\n\t/** Map instance */\n\t_map: MapLibre | null = $state.raw(null);\n\t/** Callbacks to be called when the map style is loaded */\n\tprivate _listener?: maplibregl.Listener = undefined;\n\tprivate _pending: ((map: maplibregl.Map) => void)[] = [];\n\t/** Names of layers dynamically added */\n\tuserLayers: Set<string> = new Set();\n\t/** Names of sources dynamically added */\n\tuserSources: Set<string> = new Set();\n\t/** Terrain specification of the current base style */\n\tbaseTerrain?: TerrainSpecification | undefined;\n\t/** Sky specification set by user */\n\tuserTerrain?: TerrainSpecification | undefined;\n\t/** Sky specification of the current base style */\n\tbaseSky?: SkySpecification | undefined;\n\t/** Sky specification set by user */\n\tuserSky?: SkySpecification | undefined;\n\t/** Light specification of the current base style */\n\tbaseLight?: LightSpecification | undefined;\n\t/** Light specification set by user */\n\tuserLight?: LightSpecification | undefined;\n\t/** Projection specification of the current base style */\n\tbaseProjection?: ProjectionSpecification | undefined;\n\t/** Projection specification set by user */\n\tuserProjection?: ProjectionSpecification | undefined;\n\n\tget map() {\n\t\treturn this._map;\n\t}\n\n\tset map(value: maplibregl.Map | null) {\n\t\tif (this._listener) {\n\t\t\tthis._map?.off('styledata', this._listener);\n\t\t\tthis._listener = undefined;\n\t\t}\n\t\tthis._map = value;\n\t\tif (this._map) {\n\t\t\tthis._listener = this._onstyledata.bind(this);\n\t\t\tthis._map.on('styledata', this._listener);\n\t\t}\n\t}\n\n\taddLayer(addLayerObject: AddLayerObject, beforeId?: string) {\n\t\tif (!this.map) throw new Error('Map is not initialized');\n\t\tthis.userLayers.add(addLayerObject.id);\n\t\tthis.waitForStyleLoaded((map) => {\n\t\t\tmap.addLayer(addLayerObject, beforeId);\n\t\t});\n\t}\n\tremoveLayer(id: string) {\n\t\tif (!this.map) throw new Error('Map is not initialized');\n\t\tthis.userLayers.delete(id);\n\t\tthis.waitForStyleLoaded((map) => {\n\t\t\tmap.removeLayer(id);\n\t\t});\n\t}\n\n\taddSource(id: string, source: SourceSpecification | CanvasSourceSpecification) {\n\t\tthis.userSources.add(id);\n\t\tthis.waitForStyleLoaded((map) => {\n\t\t\tmap.addSource(id, source);\n\t\t});\n\t}\n\tremoveSource(id: string) {\n\t\tthis.userSources.delete(id);\n\t\tthis.waitForStyleLoaded((map) => {\n\t\t\tmap.removeSource(id);\n\t\t});\n\t}\n\n\t/** Wait for the style to be loaded before calling the function */\n\twaitForStyleLoaded(func: (map: maplibregl.Map) => void) {\n\t\tif (!this.map) {\n\t\t\treturn;\n\t\t}\n\t\tif (this.map.style._loaded) {\n\t\t\t// style is already loaded\n\t\t\tfunc(this.map);\n\t\t} else {\n\t\t\t// we need to wait the style to be loaded\n\t\t\tthis._pending.push(func);\n\t\t}\n\t}\n\n\tprivate _onstyledata(ev: maplibregl.MapStyleDataEvent) {\n\t\tconst map = ev.target;\n\t\tif (map?.style._loaded) {\n\t\t\tfor (const func of this._pending) {\n\t\t\t\t// call pending tasks\n\t\t\t\tfunc(map);\n\t\t\t}\n\t\t\tthis._pending = [];\n\t\t}\n\t}\n\n\tsetStyle(style: string | StyleSpecification | null) {\n\t\tconst { userSources: addedSources, userLayers: addedLayers } = this;\n\t\tif (!style) {\n\t\t\tthis.map?.setStyle(null);\n\t\t\treturn;\n\t\t}\n\n\t\tthis.map?.setStyle($state.snapshot(style) as string | StyleSpecification, {\n\t\t\t// Preserves user styles when the base style changes\n\t\t\ttransformStyle: (previous, next) => {\n\t\t\t\tthis.baseLight = next.light;\n\t\t\t\tthis.baseProjection = next.projection;\n\t\t\t\tthis.baseSky = next.sky;\n\t\t\t\tthis.baseTerrain = next.terrain;\n\n\t\t\t\tif (!previous) {\n\t\t\t\t\treturn next;\n\t\t\t\t}\n\n\t\t\t\tconst sources = next.sources;\n\t\t\t\tfor (const [key, value] of Object.entries(previous.sources!)) {\n\t\t\t\t\tif (addedSources.has(key)) {\n\t\t\t\t\t\tsources[key] = value;\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tconst userLayers = previous.layers!.filter((layer) => addedLayers.has(layer.id));\n\t\t\t\tconst layers = [...next.layers!, ...userLayers];\n\n\t\t\t\treturn {\n\t\t\t\t\t...next,\n\t\t\t\t\tlight: this.userLight || this.baseLight,\n\t\t\t\t\tprojection: this.userProjection || this.baseProjection,\n\t\t\t\t\tsky: this.userSky || this.baseSky,\n\t\t\t\t\tterrain: this.userTerrain || this.baseTerrain,\n\t\t\t\t\tsources,\n\t\t\t\t\tlayers\n\t\t\t\t};\n\t\t\t}\n\t\t});\n\t}\n}\n\nexport function prepareMapContext(): MapContext {\n\tconst mapCtx = new MapContext();\n\tsetContext(MAP_CONTEXT_KEY, mapCtx);\n\treturn mapCtx;\n}\n\nexport function getMapContext(): MapContext {\n\tconst mapCtx = getContext<MapContext>(MAP_CONTEXT_KEY);\n\tif (!mapCtx) throw new Error('Map context not found');\n\treturn mapCtx;\n}\n\n// https://svelte.dev/docs/svelte/$state#Classes\nclass SourceContext {\n\t/** sourceId */\n\tid: string = $state('');\n}\n\nexport function prepareSourceContext(): SourceContext {\n\tconst sourceCtx = new SourceContext();\n\tsetContext(SOURCE_CONTEXT_KEY, sourceCtx);\n\treturn sourceCtx;\n}\n\nexport function getSourceContext(): SourceContext {\n\tconst sourceCtx = getContext<SourceContext>(SOURCE_CONTEXT_KEY);\n\tif (!sourceCtx || !sourceCtx.id) throw new Error('Source context not found');\n\treturn sourceCtx;\n}\n\nclass LayerContext {\n\tid: string = $state('');\n}\n\nexport function prepareLayerContext(): LayerContext {\n\tconst layerCtx = new LayerContext();\n\tsetContext(LAYER_CONTEXT_KEY, layerCtx);\n\treturn layerCtx;\n}\n\nexport function getLayerContext(): LayerContext | null {\n\tconst layerCtx = getContext<LayerContext>(LAYER_CONTEXT_KEY);\n\tif (!layerCtx || !layerCtx.id) throw new Error('Layer context not found');\n\treturn layerCtx;\n}\n\nclass MarkerContext {\n\tmarker: Marker | null = $state.raw(null);\n}\n\nexport function prepareMarkerContext(): MarkerContext {\n\tconst markerCtx = new MarkerContext();\n\tsetContext(MARKER_CONTEXT_KEY, markerCtx);\n\treturn markerCtx;\n}\n\nexport function getMarkerContext(): MarkerContext | null {\n\tconst markerCtx = getContext<MarkerContext>(MARKER_CONTEXT_KEY);\n\tif (!markerCtx) {\n\t\treturn null;\n\t}\n\treturn markerCtx;\n}\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/controls/AttributionControl.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-gl-js/docs/API/classes/AttributionControl/\n\n\timport { onDestroy } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport { getMapContext } from '../contexts.svelte.js';\n\n\tinterface Props extends maplibregl.AttributionControlOptions {\n\t\tposition?: maplibregl.ControlPosition;\n\t}\n\tlet { position, ...options }: Props = $props();\n\n\tconst mapCtx = getMapContext();\n\tif (!mapCtx.map) throw new Error('Map instance is not initialized.');\n\n\tlet control: maplibregl.AttributionControl | null = null;\n\t$effect(() => {\n\t\tcontrol && mapCtx.map?.removeControl(control);\n\t\tcontrol = new maplibregl.AttributionControl($state.snapshot(options));\n\t\tmapCtx.map?.addControl(control, position);\n\t});\n\n\tonDestroy(() => {\n\t\tif (control) {\n\t\t\tmapCtx.map?.removeControl(control);\n\t\t}\n\t});\n</script>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/controls/CustomControl.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-gl-js/docs/API/interfaces/IControl/\n\n\timport type { Snippet } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport { getMapContext } from '../contexts.svelte.js';\n\n\tinterface Props {\n\t\tposition?: maplibregl.ControlPosition;\n\t\tcontrol?: maplibregl.IControl;\n\t\tgroup?: boolean;\n\t\tclass?: string;\n\t\tchildren?: Snippet;\n\t}\n\tlet { position, control: givenControl, class: className, group = true, children }: Props = $props();\n\tif (!givenControl && !children) throw new Error('You must provide either control or children.');\n\n\tconst mapCtx = getMapContext();\n\tif (!mapCtx.map) throw new Error('Map instance is not initialized.');\n\n\tlet el: HTMLDivElement | undefined = $state();\n\n\tlet control = $derived.by(() => {\n\t\tif (givenControl) {\n\t\t\treturn givenControl;\n\t\t}\n\n\t\treturn {\n\t\t\tonAdd: () => {\n\t\t\t\treturn el!;\n\t\t\t},\n\t\t\tonRemove: () => {\n\t\t\t\tel?.parentNode?.removeChild(el);\n\t\t\t}\n\t\t};\n\t});\n\n\t$effect(() => {\n\t\tif (control) {\n\t\t\tmapCtx.map?.addControl(control, position);\n\t\t}\n\t\treturn () => {\n\t\t\tcontrol && mapCtx.map?.removeControl(control);\n\t\t};\n\t});\n</script>\n\n{#if !givenControl}\n\t<div bind:this={el} class={`maplibregl-ctrl ${className}`} class:maplibregl-ctrl-group={group}>\n\t\t{@render children?.()}\n\t</div>\n{/if}\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/controls/FullScreenControl.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-gl-js/docs/API/classes/FullscreenControl/\n\n\timport { onDestroy } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport { getMapContext } from '../contexts.svelte.js';\n\timport { resetEventListener } from '../utils.js';\n\timport type { Listener, Event } from '../types.js';\n\n\tinterface Props extends maplibregl.FullscreenControlOptions {\n\t\tposition?: maplibregl.ControlPosition;\n\t\t// Events\n\t\t// https://maplibre.org/maplibre-gl-js/docs/API/classes/FullscreenControl/#events\n\t\tonfullscreenstart?: Listener<Event<maplibregl.FullscreenControl>>;\n\t\tonfullscreenend?: Listener<Event<maplibregl.FullscreenControl>>;\n\t}\n\tlet { position, onfullscreenstart, onfullscreenend, ...options }: Props = $props();\n\n\tconst mapCtx = getMapContext();\n\tif (!mapCtx.map) throw new Error('Map instance is not initialized.');\n\n\tlet control: maplibregl.FullscreenControl | null = null;\n\t$effect(() => {\n\t\tcontrol && mapCtx.map?.removeControl(control);\n\t\tcontrol = new maplibregl.FullscreenControl(options);\n\t\tmapCtx.map?.addControl(control, position);\n\t});\n\n\t$effect(() => resetEventListener(control, 'fullscreenstart', onfullscreenstart));\n\t$effect(() => resetEventListener(control, 'fullscreenend', onfullscreenend));\n\n\tonDestroy(() => {\n\t\tif (control) {\n\t\t\tmapCtx.map?.removeControl(control);\n\t\t}\n\t});\n</script>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/controls/GeolocateControl.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-gl-js/docs/API/classes/GeolocateControl/\n\n\timport { onDestroy, untrack } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport { getMapContext } from '../contexts.svelte.js';\n\timport { resetEventListener } from '../utils.js';\n\timport type { Listener, Event } from '../types.js';\n\n\ttype GeolocateEvent = Event<maplibregl.GeolocateControl> & object;\n\n\tinterface Props extends maplibregl.GeolocateControlOptions {\n\t\t// Position on the map where the control placed\n\t\tposition?: maplibregl.ControlPosition;\n\t\t// Automatically call trigger() to start locating the user\n\t\tautoTrigger?: boolean;\n\t\tcontrol?: maplibregl.GeolocateControl;\n\t\t// Events\n\t\t// https://maplibre.org/maplibre-gl-js/docs/API/classes/GeolocateControl/#events\n\t\tontrackuserlocationend?: Listener<GeolocateEvent>;\n\t\tontrackuserlocationstart?: Listener<GeolocateEvent>;\n\t\tonuserlocationlostfocus?: Listener<GeolocateEvent>;\n\t\tonuserlocationfocus?: Listener<GeolocateEvent>;\n\t\tongeolocate?: Listener<GeolocateEvent & GeolocationPosition>;\n\t\tonerror?: Listener<GeolocateEvent & GeolocationPositionError>;\n\t\tonoutofmaxbounds?: Listener<GeolocateEvent & GeolocationPosition>;\n\t}\n\tlet {\n\t\tposition,\n\t\tcontrol = $bindable(),\n\t\tautoTrigger = false,\n\t\tontrackuserlocationend,\n\t\tontrackuserlocationstart,\n\t\tonuserlocationlostfocus,\n\t\tonuserlocationfocus,\n\t\tongeolocate,\n\t\tonerror,\n\t\tonoutofmaxbounds,\n\t\t...options\n\t}: Props = $props();\n\n\tconst mapCtx = getMapContext();\n\tif (!mapCtx.map) throw new Error('Map instance is not initialized.');\n\n\t$effect(() => {\n\t\tuntrack(() => control && mapCtx.map?.removeControl(control));\n\t\tcontrol = new maplibregl.GeolocateControl(options);\n\t\tmapCtx.map?.addControl(\n\t\t\tuntrack(() => control!),\n\t\t\tposition\n\t\t);\n\t});\n\n\t$effect(() => {\n\t\tif (autoTrigger) {\n\t\t\tif (mapCtx.map?.loaded()) {\n\t\t\t\tcontrol?.trigger();\n\t\t\t} else {\n\t\t\t\tmapCtx.map?.once('load', () => {\n\t\t\t\t\tcontrol?.trigger();\n\t\t\t\t});\n\t\t\t}\n\t\t}\n\t});\n\n\t$effect(() => resetEventListener(control, 'trackuserlocationstart', ontrackuserlocationstart));\n\t$effect(() => resetEventListener(control, 'trackuserlocationend', ontrackuserlocationend));\n\t$effect(() => resetEventListener(control, 'userlocationlostfocus', onuserlocationlostfocus));\n\t$effect(() => resetEventListener(control, 'userlocationfocus', onuserlocationfocus));\n\t$effect(() => resetEventListener(control, 'geolocate', ongeolocate));\n\t$effect(() => resetEventListener(control, 'error', onerror));\n\t$effect(() => resetEventListener(control, 'outofmaxbounds', onoutofmaxbounds));\n\n\tonDestroy(() => {\n\t\tif (control) {\n\t\t\tmapCtx.map?.removeControl(control);\n\t\t}\n\t});\n</script>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/controls/GlobeControl.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-gl-js/docs/API/classes/GlobeControl/\n\n\timport { onDestroy } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport { getMapContext } from '../contexts.svelte.js';\n\n\tinterface Props {\n\t\tposition?: maplibregl.ControlPosition;\n\t}\n\tlet { position }: Props = $props();\n\n\tconst mapCtx = getMapContext();\n\tif (!mapCtx.map) throw new Error('Map instance is not initialized.');\n\n\tlet control: maplibregl.GlobeControl | null = null;\n\t$effect(() => {\n\t\tcontrol && mapCtx.map?.removeControl(control);\n\t\tcontrol = new maplibregl.GlobeControl();\n\t\tmapCtx.map?.addControl(control, position);\n\t});\n\n\tonDestroy(() => {\n\t\tif (control) {\n\t\t\tmapCtx.map?.removeControl(control);\n\t\t}\n\t});\n</script>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/controls/Hash.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-gl-js/docs/API/classes/Hash/\n\n\t// FIXME: SvelteKit interoperability\n\n\timport { onDestroy } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport { getMapContext } from '../contexts.svelte.js';\n\n\t// let {}: {} = $props();\n\n\tconst mapCtx = getMapContext();\n\tif (!mapCtx.map) throw new Error('Map instance is not initialized.');\n\n\tlet hash = new maplibregl.Hash().addTo(mapCtx.map);\n\tif (!hash._onHashChange()) {\n\t\thash._updateHash();\n\t}\n\n\tonDestroy(() => {\n\t\thash.remove();\n\t});\n</script>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/controls/LogoControl.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-gl-js/docs/API/classes/LogoControl/\n\n\timport { onDestroy } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport { getMapContext } from '../contexts.svelte.js';\n\n\tinterface Props extends maplibregl.LogoControlOptions {\n\t\tposition?: maplibregl.ControlPosition;\n\t}\n\tlet { position, ...options }: Props = $props();\n\n\tconst mapCtx = getMapContext();\n\tif (!mapCtx.map) throw new Error('Map instance is not initialized.');\n\n\tlet control: maplibregl.LogoControl | null = null;\n\t$effect(() => {\n\t\tcontrol && mapCtx.map?.removeControl(control);\n\t\tcontrol = new maplibregl.LogoControl($state.snapshot(options));\n\t\tmapCtx.map?.addControl(control, position);\n\t});\n\n\tonDestroy(() => {\n\t\tif (control) {\n\t\t\tmapCtx.map?.removeControl(control);\n\t\t}\n\t});\n</script>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/controls/NavigationControl.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-gl-js/docs/API/classes/NavigationControl/\n\n\timport { onDestroy } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport { getMapContext } from '../contexts.svelte.js';\n\n\tinterface Props extends maplibregl.NavigationControlOptions {\n\t\tposition?: maplibregl.ControlPosition;\n\t}\n\tlet { position, ...options }: Props = $props();\n\n\tconst mapCtx = getMapContext();\n\tif (!mapCtx.map) throw new Error('Map instance is not initialized.');\n\n\tlet control: maplibregl.NavigationControl | null = null;\n\t$effect(() => {\n\t\tcontrol && mapCtx.map?.removeControl(control);\n\t\tcontrol = new maplibregl.NavigationControl($state.snapshot(options));\n\t\tmapCtx.map?.addControl(control, position);\n\t});\n\n\tonDestroy(() => {\n\t\tif (control) {\n\t\t\tmapCtx.map?.removeControl(control);\n\t\t}\n\t});\n</script>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/controls/ScaleControl.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-gl-js/docs/API/classes/ScaleControl/\n\n\timport { onDestroy } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport { getMapContext } from '../contexts.svelte.js';\n\n\tinterface Props extends maplibregl.ScaleControlOptions {\n\t\tposition?: maplibregl.ControlPosition;\n\t}\n\tlet { position, ...options }: Props = $props();\n\n\tconst mapCtx = getMapContext();\n\tif (!mapCtx.map) throw new Error('Map instance is not initialized.');\n\n\tlet control: maplibregl.ScaleControl | null = null;\n\t$effect(() => {\n\t\tcontrol && mapCtx.map?.removeControl(control);\n\t\tcontrol = new maplibregl.ScaleControl($state.snapshot(options));\n\t\tmapCtx.map?.addControl(control, position);\n\t});\n\n\tonDestroy(() => {\n\t\tif (control) {\n\t\t\tmapCtx.map?.removeControl(control);\n\t\t}\n\t});\n</script>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/controls/TerrainControl.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-gl-js/docs/API/classes/TerrainControl/\n\n\timport { onDestroy } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport { getMapContext, getSourceContext } from '../contexts.svelte.js';\n\n\tinterface Props extends Omit<maplibregl.TerrainSpecification, 'source'> {\n\t\tsource?: string;\n\t\tposition?: maplibregl.ControlPosition;\n\t}\n\tlet { position, source, ...restOptions }: Props = $props();\n\n\tconst mapCtx = getMapContext();\n\tif (!mapCtx.map) throw new Error('Map instance is not initialized.');\n\n\tconst options = $derived({\n\t\tsource: source ?? getSourceContext().id,\n\t\t...restOptions\n\t});\n\n\tlet control: maplibregl.TerrainControl | null = null;\n\t$effect(() => {\n\t\tif (control) {\n\t\t\tmapCtx.map?.removeControl(control);\n\t\t}\n\t\tcontrol = new maplibregl.TerrainControl($state.snapshot(options));\n\t\tmapCtx.map?.addControl(control, position);\n\t});\n\n\tonDestroy(() => {\n\t\tif (control) {\n\t\t\tmapCtx.map?.removeControl(control);\n\t\t}\n\t});\n</script>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/global/Protocol.svelte",
    "content": "<script lang=\"ts\">\n\timport maplibregl from 'maplibre-gl';\n\n\tconst { scheme, loadFn }: { scheme: string; loadFn: maplibregl.AddProtocolAction } = $props();\n\n\t$effect(() => {\n\t\tmaplibregl.addProtocol(scheme, loadFn);\n\t\tconst prevName = scheme;\n\t\treturn () => {\n\t\t\tmaplibregl.removeProtocol(prevName);\n\t\t};\n\t});\n</script>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/index.ts",
    "content": "// Reexport your entry components here\n\n// global\nexport { default as Protocol } from './global/Protocol.svelte';\n\n// map\nexport { default as MapLibre } from './map/MapLibre.svelte';\nexport { default as Map } from './map/MapLibre.svelte'; // alias\nexport { default as Sky } from './map/Sky.svelte';\nexport { default as Light } from './map/Light.svelte';\nexport { default as Projection } from './map/Projection.svelte';\nexport { default as Terrain } from './map/Terrain.svelte';\nexport { default as Image } from './map/Image.svelte';\nexport { default as Sprite } from './map/Sprite.svelte';\n\n// sources\nexport { default as VectorTileSource } from './sources/VectorTileSource.svelte';\nexport { default as RasterTileSource } from './sources/RasterTileSource.svelte';\nexport { default as RasterDEMTileSource } from './sources/RasterDEMTileSource.svelte';\nexport { default as GeoJSONSource } from './sources/GeoJSONSource.svelte';\nexport { default as ImageSource } from './sources/ImageSource.svelte';\nexport { default as VideoSource } from './sources/VideoSource.svelte';\nexport { default as CanvasSource } from './sources/CanvasSource.svelte';\nexport { default as RawSource } from './sources/RawSource.svelte';\nexport { default as FeatureState } from './sources/FeatureState.svelte';\n\n// layers\nexport { default as FillLayer } from './layers/FillLayer.svelte';\nexport { default as LineLayer } from './layers/LineLayer.svelte';\nexport { default as CircleLayer } from './layers/CircleLayer.svelte';\nexport { default as FillExtrusionLayer } from './layers/FillExtrusionLayer.svelte';\nexport { default as SymbolLayer } from './layers/SymbolLayer.svelte';\nexport { default as HeatmapLayer } from './layers/HeatmapLayer.svelte';\nexport { default as RasterLayer } from './layers/RasterLayer.svelte';\nexport { default as HillshadeLayer } from './layers/HillshadeLayer.svelte';\nexport { default as ColorReliefLayer } from './layers/ColorReliefLayer.svelte';\nexport { default as BackgroundLayer } from './layers/BackgroundLayer.svelte';\nexport { default as RawLayer } from './layers/RawLayer.svelte';\nexport { default as CustomLayer } from './layers/CustomLayer.svelte';\n\n// markers\nexport { default as Marker } from './markers/Marker.svelte';\nexport { default as Popup } from './markers/Popup.svelte';\n\n// controls\nexport { default as AttributionControl } from './controls/AttributionControl.svelte';\nexport { default as GeolocateControl } from './controls/GeolocateControl.svelte';\nexport { default as GlobeControl } from './controls/GlobeControl.svelte';\nexport { default as NavigationControl } from './controls/NavigationControl.svelte';\nexport { default as FullScreenControl } from './controls/FullScreenControl.svelte';\nexport { default as TerrainControl } from './controls/TerrainControl.svelte';\nexport { default as ScaleControl } from './controls/ScaleControl.svelte';\nexport { default as LogoControl } from './controls/LogoControl.svelte';\nexport { default as CustomControl } from './controls/CustomControl.svelte';\nexport { default as Hash } from './controls/Hash.svelte';\n\n// utilities\nexport { default as ImageLoader } from './utilities/ImageLoader.svelte';\nexport { default as QuerySourceFeatures } from './utilities/QuerySourceFeatures.svelte';\nexport { default as QueryRenderedFeatures } from './utilities/QueryRenderedFeatures.svelte';\n\n// contexts\nexport { getMapContext, getSourceContext, getMarkerContext } from './contexts.svelte.js';\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/layers/BackgroundLayer.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-style-spec/layers/#background\n\n\timport type { Snippet } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport RawLayer from './RawLayer.svelte';\n\timport type { MapLayerEventProps } from './common.js';\n\n\tinterface Props extends Omit<maplibregl.BackgroundLayerSpecification, 'id' | 'source' | 'type'>, MapLayerEventProps {\n\t\tid?: string;\n\t\tbeforeId?: string;\n\t\tchildren?: Snippet;\n\t}\n\n\tlet { children, ...props }: Props = $props();\n</script>\n\n<RawLayer type=\"background\" {...props}>\n\t{@render children?.()}\n</RawLayer>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/layers/CircleLayer.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-style-spec/layers/#circle\n\n\timport type { Snippet } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport RawLayer from './RawLayer.svelte';\n\timport type { MapLayerEventProps } from './common.js';\n\n\tinterface Props\n\t\textends Omit<maplibregl.CircleLayerSpecification, 'id' | 'source' | 'type' | 'source-layer'>, MapLayerEventProps {\n\t\tid?: string;\n\t\tsource?: string;\n\t\tsourceLayer?: maplibregl.CircleLayerSpecification['source-layer'];\n\t\tbeforeId?: string;\n\t\tchildren?: Snippet;\n\t}\n\n\tlet { children, sourceLayer, ...props }: Props = $props();\n</script>\n\n<RawLayer type=\"circle\" source-layer={sourceLayer} {...props}>\n\t{@render children?.()}\n</RawLayer>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/layers/ColorReliefLayer.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-style-spec/layers/#color-relief\n\n\timport type { Snippet } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport RawLayer from './RawLayer.svelte';\n\timport type { MapLayerEventProps } from './common.js';\n\n\tinterface Props\n\t\textends\n\t\t\tOmit<maplibregl.ColorReliefLayerSpecification, 'id' | 'source' | 'type' | 'source-layer'>,\n\t\t\tMapLayerEventProps {\n\t\tid?: string;\n\t\tsource?: string;\n\t\tsourceLayer?: maplibregl.ColorReliefLayerSpecification['source-layer'];\n\t\tbeforeId?: string;\n\t\tchildren?: Snippet;\n\t}\n\n\tlet { children, sourceLayer, ...props }: Props = $props();\n</script>\n\n<RawLayer type=\"color-relief\" source-layer={sourceLayer} {...props}>\n\t{@render children?.()}\n</RawLayer>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/layers/CustomLayer.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-gl-js/docs/API/interfaces/CustomLayerInterface/\n\n\timport { onDestroy, type Snippet } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport { getMapContext } from '../contexts.svelte.js';\n\timport { generateLayerID, resetLayerEventListener } from '../utils.js';\n\timport type { MapLayerEventProps } from './common.js';\n\n\tinterface Props extends MapLayerEventProps {\n\t\tid?: string;\n\t\tbeforeId?: string;\n\t\timplementation: Omit<maplibregl.CustomLayerInterface, 'id' | 'type'>;\n\t\tchildren?: Snippet;\n\t}\n\n\tlet {\n\t\tid: _id,\n\t\tbeforeId,\n\t\timplementation,\n\t\tchildren,\n\n\t\t// Events\n\t\t// https://maplibre.org/maplibre-gl-js/docs/API/type-aliases/MapLayerEventType/\n\t\tonclick,\n\t\tondblclick,\n\t\tonmousedown,\n\t\tonmouseup,\n\t\tonmousemove,\n\t\tonmouseenter,\n\t\tonmouseleave,\n\t\tonmouseover,\n\t\tonmouseout,\n\t\toncontextmenu,\n\t\tontouchstart,\n\t\tontouchend,\n\t\tontouchcancel\n\t}: Props = $props();\n\n\tconst mapCtx = getMapContext();\n\tif (!mapCtx.map) throw new Error('Map instance is not initialized.');\n\n\tconst id = _id ?? generateLayerID();\n\t(implementation as maplibregl.CustomLayerInterface).id ??= id;\n\t(implementation as maplibregl.CustomLayerInterface).type = 'custom';\n\n\tlet firstRun = true;\n\tmapCtx.waitForStyleLoaded(() => {\n\t\tmapCtx.addLayer(implementation as maplibregl.CustomLayerInterface, beforeId);\n\t});\n\n\t$effect(() => resetLayerEventListener(mapCtx.map, 'click', id, onclick));\n\t$effect(() => resetLayerEventListener(mapCtx.map, 'dblclick', id, ondblclick));\n\t$effect(() => resetLayerEventListener(mapCtx.map, 'mousedown', id, onmousedown));\n\t$effect(() => resetLayerEventListener(mapCtx.map, 'mouseup', id, onmouseup));\n\t$effect(() => resetLayerEventListener(mapCtx.map, 'mousemove', id, onmousemove));\n\t$effect(() => resetLayerEventListener(mapCtx.map, 'mouseenter', id, onmouseenter));\n\t$effect(() => resetLayerEventListener(mapCtx.map, 'mouseleave', id, onmouseleave));\n\t$effect(() => resetLayerEventListener(mapCtx.map, 'mouseover', id, onmouseover));\n\t$effect(() => resetLayerEventListener(mapCtx.map, 'mouseout', id, onmouseout));\n\t$effect(() => resetLayerEventListener(mapCtx.map, 'contextmenu', id, oncontextmenu));\n\t$effect(() => resetLayerEventListener(mapCtx.map, 'touchstart', id, ontouchstart));\n\t$effect(() => resetLayerEventListener(mapCtx.map, 'touchend', id, ontouchend));\n\t$effect(() => resetLayerEventListener(mapCtx.map, 'touchcancel', id, ontouchcancel));\n\n\t$effect(() => {\n\t\tif (beforeId && !firstRun) {\n\t\t\tmapCtx.waitForStyleLoaded((map) => {\n\t\t\t\tmap.moveLayer(id, beforeId);\n\t\t\t});\n\t\t}\n\t});\n\n\t$effect(() => {\n\t\tfirstRun = false;\n\t});\n\n\tonDestroy(() => {\n\t\tmapCtx.removeLayer(id);\n\t});\n</script>\n\n{@render children?.()}\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/layers/FillExtrusionLayer.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-style-spec/layers/#fill-extrusion\n\n\timport type { Snippet } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport RawLayer from './RawLayer.svelte';\n\timport type { MapLayerEventProps } from './common.js';\n\n\tinterface Props\n\t\textends\n\t\t\tOmit<maplibregl.FillExtrusionLayerSpecification, 'id' | 'source' | 'type' | 'source-layer'>,\n\t\t\tMapLayerEventProps {\n\t\tid?: string;\n\t\tsource?: string;\n\t\tsourceLayer?: maplibregl.FillExtrusionLayerSpecification['source-layer'];\n\t\tbeforeId?: string;\n\t\tchildren?: Snippet;\n\t}\n\n\tlet { children, sourceLayer, ...props }: Props = $props();\n</script>\n\n<RawLayer type=\"fill-extrusion\" source-layer={sourceLayer} {...props}>\n\t{@render children?.()}\n</RawLayer>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/layers/FillLayer.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-style-spec/layers/#fill\n\n\timport type { Snippet } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport RawLayer from './RawLayer.svelte';\n\timport type { MapLayerEventProps } from './common.js';\n\n\tinterface Props\n\t\textends Omit<maplibregl.FillLayerSpecification, 'id' | 'source' | 'type' | 'source-layer'>, MapLayerEventProps {\n\t\tid?: string;\n\t\tsource?: string;\n\t\tsourceLayer?: maplibregl.FillLayerSpecification['source-layer'];\n\t\tbeforeId?: string;\n\t\tchildren?: Snippet;\n\t}\n\n\tlet { children, sourceLayer, ...props }: Props = $props();\n</script>\n\n<RawLayer type=\"fill\" source-layer={sourceLayer} {...props}>\n\t{@render children?.()}\n</RawLayer>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/layers/HeatmapLayer.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-style-spec/layers/#heatmap\n\n\timport type { Snippet } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport RawLayer from './RawLayer.svelte';\n\timport type { MapLayerEventProps } from './common.js';\n\n\tinterface Props\n\t\textends Omit<maplibregl.HeatmapLayerSpecification, 'id' | 'source' | 'type' | 'source-layer'>, MapLayerEventProps {\n\t\tid?: string;\n\t\tsource?: string;\n\t\tsourceLayer?: maplibregl.HeatmapLayerSpecification['source-layer'];\n\t\tbeforeId?: string;\n\t\tchildren?: Snippet;\n\t}\n\n\tlet { children, sourceLayer, ...props }: Props = $props();\n</script>\n\n<RawLayer type=\"heatmap\" source-layer={sourceLayer} {...props}>\n\t{@render children?.()}\n</RawLayer>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/layers/HillshadeLayer.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-style-spec/layers/#hillshade\n\n\timport type { Snippet } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport RawLayer from './RawLayer.svelte';\n\timport type { MapLayerEventProps } from './common.js';\n\n\tinterface Props\n\t\textends\n\t\t\tOmit<maplibregl.HillshadeLayerSpecification, 'id' | 'source' | 'type' | 'source-layer'>,\n\t\t\tMapLayerEventProps {\n\t\tid?: string;\n\t\tsource?: string;\n\t\tsourceLayer?: maplibregl.HillshadeLayerSpecification['source-layer'];\n\t\tbeforeId?: string;\n\t\tchildren?: Snippet;\n\t}\n\n\tlet { children, sourceLayer, ...props }: Props = $props();\n</script>\n\n<RawLayer type=\"hillshade\" source-layer={sourceLayer} {...props}>\n\t{@render children?.()}\n</RawLayer>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/layers/LineLayer.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-style-spec/layers/#line\n\n\timport type { Snippet } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport RawLayer from './RawLayer.svelte';\n\timport type { MapLayerEventProps } from './common.js';\n\n\tinterface Props\n\t\textends Omit<maplibregl.LineLayerSpecification, 'id' | 'source' | 'type' | 'source-layer'>, MapLayerEventProps {\n\t\tid?: string;\n\t\tsource?: string;\n\t\tsourceLayer?: maplibregl.LineLayerSpecification['source-layer'];\n\t\tbeforeId?: string;\n\t\tchildren?: Snippet;\n\t}\n\n\tlet { children, sourceLayer, ...props }: Props = $props();\n</script>\n\n<RawLayer type=\"line\" source-layer={sourceLayer} {...props}>\n\t{@render children?.()}\n</RawLayer>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/layers/RasterLayer.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-style-spec/layers/#raster\n\n\timport type { Snippet } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport RawLayer from './RawLayer.svelte';\n\timport type { MapLayerEventProps } from './common.js';\n\n\tinterface Props\n\t\textends Omit<maplibregl.RasterLayerSpecification, 'id' | 'source' | 'type' | 'source-layer'>, MapLayerEventProps {\n\t\tid?: string;\n\t\tsource?: string;\n\t\tsourceLayer?: maplibregl.RasterLayerSpecification['source-layer'];\n\t\tbeforeId?: string;\n\t\tchildren?: Snippet;\n\t}\n\n\tlet { children, sourceLayer, ...props }: Props = $props();\n</script>\n\n<RawLayer type=\"raster\" source-layer={sourceLayer} {...props}>\n\t{@render children?.()}\n</RawLayer>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/layers/RawLayer.svelte",
    "content": "<script lang=\"ts\">\n\timport { onDestroy, type Snippet } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport { getMapContext, getSourceContext, prepareLayerContext } from '../contexts.svelte.js';\n\timport { generateLayerID, resetLayerEventListener } from '../utils.js';\n\timport type { MapLayerEventProps } from './common.js';\n\n\tinterface Props\n\t\textends Omit<maplibregl.LayerSpecification, 'id' | 'source' | 'source-layer' | 'filter'>, MapLayerEventProps {\n\t\tid?: string;\n\t\tsource?: string;\n\t\tbeforeId?: string;\n\t\tfilter?: maplibregl.FilterSpecification;\n\t\t'source-layer'?: string;\n\t\tchildren?: Snippet;\n\t}\n\n\tlet {\n\t\tid: _id,\n\t\tsource: sourceId,\n\t\tbeforeId,\n\t\ttype,\n\t\tpaint,\n\t\tlayout,\n\t\tfilter,\n\t\t'source-layer': sourceLayer,\n\t\tmaxzoom,\n\t\tminzoom,\n\t\tmetadata,\n\t\tchildren,\n\n\t\t// Events\n\t\t// https://maplibre.org/maplibre-gl-js/docs/API/type-aliases/MapLayerEventType/\n\t\tonclick,\n\t\tondblclick,\n\t\tonmousedown,\n\t\tonmouseup,\n\t\tonmousemove,\n\t\tonmouseenter,\n\t\tonmouseleave,\n\t\tonmouseover,\n\t\tonmouseout,\n\t\toncontextmenu,\n\t\tontouchstart,\n\t\tontouchend,\n\t\tontouchcancel\n\t}: Props = $props();\n\n\tconst mapCtx = getMapContext();\n\tif (!mapCtx.map) throw new Error('Map instance is not initialized.');\n\n\tconst id = _id ?? generateLayerID();\n\tconst layerCtx = prepareLayerContext();\n\tlayerCtx.id = id;\n\n\tconst addLayerObj = {\n\t\tid,\n\t\ttype,\n\t\tlayout: $state.snapshot(layout) ?? {},\n\t\tpaint: $state.snapshot(paint) ?? {}\n\t} as maplibregl.LayerSpecification;\n\n\tif (addLayerObj.type !== 'background') {\n\t\taddLayerObj.source = sourceId ?? getSourceContext().id;\n\t}\n\n\tif (maxzoom !== undefined) {\n\t\taddLayerObj.maxzoom = maxzoom;\n\t}\n\tif (minzoom !== undefined) {\n\t\taddLayerObj.minzoom = minzoom;\n\t}\n\tif (metadata !== undefined) {\n\t\taddLayerObj.metadata = metadata;\n\t}\n\tif (addLayerObj.type !== 'background') {\n\t\tif (sourceLayer) {\n\t\t\taddLayerObj['source-layer'] = sourceLayer;\n\t\t}\n\t\tif (filter) {\n\t\t\t// @ts-expect-error: ignore\n\t\t\taddLayerObj.filter = $state.snapshot(filter) as maplibregl.FilterSpecification;\n\t\t}\n\t}\n\n\tlet firstRun = true;\n\tmapCtx.waitForStyleLoaded(() => {\n\t\tmapCtx.addLayer(addLayerObj, beforeId);\n\t});\n\n\t$effect(() => resetLayerEventListener(mapCtx.map, 'click', id, onclick));\n\t$effect(() => resetLayerEventListener(mapCtx.map, 'dblclick', id, ondblclick));\n\t$effect(() => resetLayerEventListener(mapCtx.map, 'mousedown', id, onmousedown));\n\t$effect(() => resetLayerEventListener(mapCtx.map, 'mouseup', id, onmouseup));\n\t$effect(() => resetLayerEventListener(mapCtx.map, 'mousemove', id, onmousemove));\n\t$effect(() => resetLayerEventListener(mapCtx.map, 'mouseenter', id, onmouseenter));\n\t$effect(() => resetLayerEventListener(mapCtx.map, 'mouseleave', id, onmouseleave));\n\t$effect(() => resetLayerEventListener(mapCtx.map, 'mouseover', id, onmouseover));\n\t$effect(() => resetLayerEventListener(mapCtx.map, 'mouseout', id, onmouseout));\n\t$effect(() => resetLayerEventListener(mapCtx.map, 'contextmenu', id, oncontextmenu));\n\t$effect(() => resetLayerEventListener(mapCtx.map, 'touchstart', id, ontouchstart));\n\t$effect(() => resetLayerEventListener(mapCtx.map, 'touchend', id, ontouchend));\n\t$effect(() => resetLayerEventListener(mapCtx.map, 'touchcancel', id, ontouchcancel));\n\n\tlet prevPaint: Record<string, unknown> = $state.snapshot(paint) ?? {};\n\t$effect(() => {\n\t\tpaint;\n\t\tif (!firstRun) {\n\t\t\tmapCtx.waitForStyleLoaded((map) => {\n\t\t\t\t// eslint-disable-next-line svelte/prefer-svelte-reactivity\n\t\t\t\tconst keysRemoved = new Set(Object.keys(prevPaint));\n\t\t\t\tconst _paint = $state.snapshot(paint) ?? {};\n\t\t\t\tfor (const [key, value] of Object.entries(_paint)) {\n\t\t\t\t\tkeysRemoved.delete(key);\n\t\t\t\t\tif (prevPaint[key] !== value) {\n\t\t\t\t\t\tmap.setPaintProperty(id, key, value);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tfor (const key of keysRemoved) {\n\t\t\t\t\tmap.setPaintProperty(id, key, undefined);\n\t\t\t\t}\n\t\t\t\tprevPaint = _paint;\n\t\t\t});\n\t\t}\n\t});\n\n\tlet prevLayout: Record<string, unknown> = $state.snapshot(layout) ?? {};\n\t$effect(() => {\n\t\tlayout;\n\t\tif (!firstRun) {\n\t\t\tmapCtx.waitForStyleLoaded((map) => {\n\t\t\t\t// eslint-disable-next-line svelte/prefer-svelte-reactivity\n\t\t\t\tconst keysRemoved = new Set(Object.keys(prevLayout));\n\t\t\t\tconst _layout = $state.snapshot(layout) ?? {};\n\t\t\t\tfor (const [key, value] of Object.entries(_layout)) {\n\t\t\t\t\tkeysRemoved.delete(key);\n\t\t\t\t\tif (prevLayout[key] !== value) {\n\t\t\t\t\t\tmap.setLayoutProperty(id, key, value);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tfor (const key of keysRemoved) {\n\t\t\t\t\tmap.setLayoutProperty(id, key, undefined);\n\t\t\t\t}\n\t\t\t\tprevLayout = _layout;\n\t\t\t});\n\t\t}\n\t});\n\n\t$effect(() => {\n\t\tif ((minzoom !== undefined || maxzoom !== undefined) && !firstRun) {\n\t\t\tmapCtx.waitForStyleLoaded((map) => {\n\t\t\t\tmap.setLayerZoomRange(id, minzoom ?? 0, maxzoom ?? 22);\n\t\t\t});\n\t\t}\n\t});\n\n\t$effect(() => {\n\t\tfilter;\n\t\tif (!firstRun) {\n\t\t\tmapCtx.waitForStyleLoaded((map) => {\n\t\t\t\tmap.setFilter(id, $state.snapshot(filter) as maplibregl.FilterSpecification);\n\t\t\t});\n\t\t}\n\t});\n\n\t$effect(() => {\n\t\tif (beforeId && !firstRun) {\n\t\t\tmapCtx.waitForStyleLoaded((map) => {\n\t\t\t\tmap.moveLayer(id, beforeId);\n\t\t\t});\n\t\t}\n\t});\n\n\t$effect(() => {\n\t\tfirstRun = false;\n\t});\n\n\tonDestroy(() => {\n\t\tmapCtx.removeLayer(id);\n\t});\n</script>\n\n{@render children?.()}\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/layers/SymbolLayer.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-style-spec/layers/#symbol\n\n\timport type { Snippet } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport RawLayer from './RawLayer.svelte';\n\timport type { MapLayerEventProps } from './common.js';\n\n\tinterface Props\n\t\textends Omit<maplibregl.SymbolLayerSpecification, 'id' | 'source' | 'type' | 'source-layer'>, MapLayerEventProps {\n\t\tid?: string;\n\t\tsource?: string;\n\t\tsourceLayer?: maplibregl.SymbolLayerSpecification['source-layer'];\n\t\tbeforeId?: string;\n\t\tchildren?: Snippet;\n\t}\n\n\tlet { children, sourceLayer, ...props }: Props = $props();\n</script>\n\n<RawLayer type=\"symbol\" source-layer={sourceLayer} {...props}>\n\t{@render children?.()}\n</RawLayer>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/layers/common.ts",
    "content": "import maplibregl from 'maplibre-gl';\n\nexport type MapLayerEventProps = {\n\t[K in keyof maplibregl.MapLayerEventType as `on${K}`]?: (ev: maplibregl.MapLayerEventType[K]) => void;\n};\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/map/Image.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-gl-js/docs/API/classes/Map/#addimage\n\n\timport { onDestroy, untrack } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport { getMapContext } from '../contexts.svelte.js';\n\n\tinterface Props {\n\t\tid: string;\n\t\timage:\n\t\t\t| HTMLImageElement\n\t\t\t| ImageBitmap\n\t\t\t| ImageData\n\t\t\t| { width: number; height: number; data: Uint8Array | Uint8ClampedArray }\n\t\t\t| maplibregl.StyleImageInterface;\n\t\toptions?: Partial<maplibregl.StyleImageMetadata>;\n\t}\n\n\tlet { id, image: srcImage, options }: Props = $props();\n\n\tconst mapCtx = getMapContext();\n\tlet prevId = id;\n\tlet firstRun = true;\n\n\t$effect(() => {\n\t\tif (!mapCtx.map) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Remove previous image if id or dimensions have changed\n\t\tlet prevImage: maplibregl.StyleImage | undefined = mapCtx.map.getImage(prevId);\n\t\tif (\n\t\t\tprevImage &&\n\t\t\t(id !== prevId || srcImage.width !== prevImage.data.width || srcImage.height !== prevImage.data.height)\n\t\t) {\n\t\t\tmapCtx.map?.removeImage(prevId);\n\t\t\tprevId = id;\n\t\t}\n\n\t\tif (!prevImage) {\n\t\t\tmapCtx.map.addImage(\n\t\t\t\tid,\n\t\t\t\tsrcImage,\n\t\t\t\tuntrack(() => options)\n\t\t\t);\n\t\t\tfirstRun = true;\n\t\t} else {\n\t\t\tmapCtx.map.updateImage(id, srcImage);\n\t\t}\n\t});\n\n\t$effect(() => {\n\t\toptions;\n\t\tif (!firstRun) {\n\t\t\tconst image = mapCtx.map?.getImage(id);\n\t\t\tif (!image) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\timage.pixelRatio = options?.pixelRatio ?? 1;\n\t\t\timage.sdf = options?.sdf ?? false;\n\t\t\timage.stretchX = options?.stretchX;\n\t\t\timage.stretchY = options?.stretchY;\n\t\t\timage.content = options?.content;\n\t\t\timage.textFitWidth = options?.textFitWidth;\n\t\t\timage.textFitHeight = options?.textFitHeight;\n\t\t\tmapCtx.map?.style.updateImage(id, image);\n\t\t}\n\t});\n\n\t$effect(() => {\n\t\tfirstRun = false;\n\t});\n\n\tonDestroy(() => {\n\t\tmapCtx.map?.removeImage(id);\n\t});\n</script>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/map/Light.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-style-spec/light/\n\n\timport { onDestroy } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport { getMapContext } from '../contexts.svelte.js';\n\n\tlet { ...spec }: maplibregl.LightSpecification = $props();\n\n\tconst mapCtx = getMapContext();\n\tif (!mapCtx.map) throw new Error('Map instance is not initialized.');\n\n\t$effect(() => {\n\t\tmapCtx.userLight = $state.snapshot(spec) as maplibregl.LightSpecification;\n\t\tmapCtx.waitForStyleLoaded((map) => {\n\t\t\tmap.setLight(mapCtx.userLight as maplibregl.LightSpecification);\n\t\t});\n\t});\n\n\tonDestroy(() => {\n\t\tmapCtx.userLight = undefined;\n\t\tmapCtx.waitForStyleLoaded((map) => {\n\t\t\tmap.setLight(mapCtx.baseLight ?? {});\n\t\t});\n\t});\n</script>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/map/MapLibre.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-gl-js/docs/API/classes/Map/\n\n\timport { onDestroy, type Snippet } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport { prepareMapContext } from '../contexts.svelte.js';\n\timport { formatLngLat, resetEventListener } from '../utils.js';\n\n\ttype MapEventProps = {\n\t\t[K in keyof maplibregl.MapEventType as `on${K}`]?: (ev: maplibregl.MapEventType[K]) => void;\n\t};\n\n\tinterface Props extends Omit<maplibregl.MapOptions, 'container'>, MapEventProps {\n\t\t/**\n\t\t * You can access the internal MapLibre GL `Map` instance by binding a variable to this prop.\n\t\t *\n\t\t * This allows you to directly interact with the underlying Map instance, enabling imperative API calls.\n\t\t */\n\t\tmap?: maplibregl.Map;\n\t\tclass?: string;\n\t\t/** Inline CSS `style` for the map container HTML element. Not to be confused with the map's style settings. */\n\t\tinlineStyle?: string;\n\t\t/** The padding in pixels around the viewport */\n\t\tpadding?: maplibregl.PaddingOptions;\n\t\t/** Vertical field of view in degrees */\n\t\tfov?: number;\n\t\t/** Cursor style for the map canvas */\n\t\tcursor?: string;\n\t\t/** Loads and applies maplibre-gl.css from a CDN. Set to false if you want to include it manually. */\n\t\tautoloadGlobalCss?: boolean;\n\n\t\t// Accessors\n\t\t// https://maplibre.org/maplibre-gl-js/docs/API/classes/Map/#accessors\n\t\t/** Whether the map will render an outline around each tile and the tile ID. These tile boundaries are useful for debugging. */\n\t\tshowTileBoundaries?: boolean;\n\t\t/** Whether the map will visualize the padding offsets. */\n\t\tshowPadding?: boolean;\n\t\t/** Whether the map will visualize the padding offsets. */\n\t\tshowCollisionBoxes?: boolean;\n\t\t/** Whether the map will render boxes around all symbols in the data source */\n\t\tshowOverdrawInspector?: boolean;\n\t\t/** Whether the map will continuously repaint. This information is useful for analyzing performance. */\n\t\trepaint?: boolean;\n\t\tvertices?: boolean;\n\n\t\t// Global state\n\t\tglobalState?: Record<string, unknown>;\n\n\t\t// Snippets\n\t\tchildren?: Snippet<[maplibregl.Map]>;\n\t}\n\n\tlet {\n\t\tmap = $bindable(undefined),\n\t\tclass: className = '',\n\t\tinlineStyle = '',\n\t\tchildren,\n\t\tautoloadGlobalCss: autoloadGlobalCss = true,\n\n\t\t// Events\n\t\t// https://maplibre.org/maplibre-gl-js/docs/API/type-aliases/MapEventType/\n\t\tonerror,\n\t\tonload,\n\t\tonidle,\n\t\tonremove,\n\t\tonrender,\n\t\tonresize,\n\t\tonwebglcontextlost,\n\t\tonwebglcontextrestored,\n\t\tondataloading,\n\t\tondata,\n\t\tontiledataloading,\n\t\tonsourcedataloading,\n\t\tonstyledataloading,\n\t\tonsourcedata,\n\t\tonstyledata,\n\t\tonstyleimagemissing,\n\t\tondataabort,\n\t\tonsourcedataabort,\n\t\tonboxzoomcancel,\n\t\tonboxzoomstart,\n\t\tonboxzoomend,\n\t\tontouchcancel,\n\t\tontouchmove,\n\t\tontouchend,\n\t\tontouchstart,\n\t\tonclick,\n\t\toncontextmenu,\n\t\tondblclick,\n\t\tonmousemove,\n\t\tonmouseup,\n\t\tonmousedown,\n\t\tonmouseout,\n\t\tonmouseover,\n\t\tonmovestart,\n\t\tonmove,\n\t\tonmoveend,\n\t\tonzoomstart,\n\t\tonzoom,\n\t\tonzoomend,\n\t\tonrotatestart,\n\t\tonrotate,\n\t\tonrotateend,\n\t\tondragstart,\n\t\tondrag,\n\t\tondragend,\n\t\tonpitchstart,\n\t\tonpitch,\n\t\tonpitchend,\n\t\tonwheel,\n\t\tonterrain,\n\t\toncooperativegestureprevented,\n\t\tonprojectiontransition,\n\n\t\t// Others\n\t\tpadding = { top: 0, bottom: 0, left: 0, right: 0 },\n\t\tfov,\n\t\tcursor,\n\n\t\t// Accessors\n\t\tshowTileBoundaries,\n\t\tshowPadding,\n\t\tshowCollisionBoxes,\n\t\tshowOverdrawInspector,\n\t\trepaint,\n\t\tvertices,\n\n\t\t// Map Options (reactive)\n\t\tbearing = $bindable(undefined),\n\t\tbearingSnap,\n\t\tcenter = $bindable(undefined),\n\t\tcenterClampedToGround,\n\t\televation = $bindable(undefined),\n\t\tinteractive = undefined,\n\t\tmaxBounds,\n\t\tmaxPitch,\n\t\tmaxZoom,\n\t\tminPitch,\n\t\tminZoom,\n\t\tpitch = $bindable(undefined),\n\t\tpixelRatio,\n\t\trenderWorldCopies,\n\t\troll = $bindable(undefined),\n\t\tstyle = { version: 8, sources: {}, layers: [] },\n\t\ttransformRequest,\n\t\tzoom = $bindable(undefined),\n\n\t\t// Map Options (properties)\n\t\tboxZoom,\n\t\tcancelPendingTileRequestsWhileZooming,\n\t\tcooperativeGestures,\n\t\tdoubleClickZoom,\n\t\tdragPan,\n\t\tdragRotate,\n\t\tkeyboard,\n\t\tscrollZoom,\n\t\ttouchPitch,\n\t\ttouchZoomRotate,\n\t\ttransformCameraUpdate,\n\n\t\t// Global state\n\t\tglobalState = {},\n\n\t\t// Map Options (others)\n\t\t...restOptions\n\t}: Props = $props();\n\n\tif (autoloadGlobalCss && globalThis.window && !document.querySelector('link[href$=\"/maplibre-gl.css\"]')) {\n\t\tconst link = document.createElement('link');\n\t\tlink.rel = 'stylesheet';\n\t\tlink.href = `https://unpkg.com/maplibre-gl@${maplibregl.getVersion()}/dist/maplibre-gl.css`;\n\t\tdocument.head.appendChild(link);\n\t}\n\n\tlet container: HTMLElement | undefined = $state();\n\n\tconst mapCtx = prepareMapContext();\n\n\t$effect(() => {\n\t\tif (map || !container) {\n\t\t\treturn;\n\t\t}\n\t\tconst options: maplibregl.MapOptions = {\n\t\t\tcontainer,\n\t\t\t...Object.fromEntries(\n\t\t\t\tObject.entries({\n\t\t\t\t\t// Map Options (reactive)\n\t\t\t\t\tbearing,\n\t\t\t\t\tbearingSnap,\n\t\t\t\t\tcenter,\n\t\t\t\t\tcenterClampedToGround,\n\t\t\t\t\televation,\n\t\t\t\t\tinteractive,\n\t\t\t\t\tmaxBounds,\n\t\t\t\t\tmaxPitch,\n\t\t\t\t\tmaxZoom,\n\t\t\t\t\tminPitch,\n\t\t\t\t\tminZoom,\n\t\t\t\t\tpitch,\n\t\t\t\t\tpixelRatio,\n\t\t\t\t\trenderWorldCopies,\n\t\t\t\t\troll,\n\t\t\t\t\tstyle,\n\t\t\t\t\ttransformRequest,\n\t\t\t\t\tzoom,\n\t\t\t\t\t// Map Options (Map properties)\n\t\t\t\t\tboxZoom,\n\t\t\t\t\tcancelPendingTileRequestsWhileZooming,\n\t\t\t\t\tcooperativeGestures,\n\t\t\t\t\tdoubleClickZoom,\n\t\t\t\t\tdragPan,\n\t\t\t\t\tdragRotate,\n\t\t\t\t\tkeyboard,\n\t\t\t\t\tscrollZoom,\n\t\t\t\t\ttouchPitch,\n\t\t\t\t\ttouchZoomRotate,\n\t\t\t\t\ttransformCameraUpdate,\n\t\t\t\t\t// Map Options (others)\n\t\t\t\t\t...restOptions\n\n\t\t\t\t\t// filter out undefined values\n\t\t\t\t}).filter(([, v]) => v !== undefined)\n\t\t\t)\n\t\t};\n\n\t\tmap = new maplibregl.Map(options);\n\t\tmapCtx.map = map ?? null;\n\n\t\tif (padding !== undefined) {\n\t\t\tmap.setPadding(padding);\n\t\t}\n\t\tif (cursor) {\n\t\t\tmap.getCanvas().style.cursor = cursor ?? '';\n\t\t}\n\n\t\tmap.on('move', () => {\n\t\t\tif (!map) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tconst tr = map.transform;\n\t\t\tif (center) {\n\t\t\t\tconst _center = maplibregl.LngLat.convert(center);\n\t\t\t\tif (_center.lat !== tr.center.lat || _center.lng !== tr.center.lng) {\n\t\t\t\t\tcenter = formatLngLat(center, tr.center);\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tcenter = tr.center;\n\t\t\t}\n\t\t\tif (tr.zoom !== zoom) {\n\t\t\t\tzoom = tr.zoom;\n\t\t\t}\n\t\t\tif (tr.bearing !== bearing) {\n\t\t\t\tbearing = tr.bearing;\n\t\t\t}\n\t\t\tif (tr.pitch !== pitch) {\n\t\t\t\tpitch = tr.pitch;\n\t\t\t}\n\t\t\tif (tr.roll !== roll) {\n\t\t\t\troll = tr.roll;\n\t\t\t}\n\t\t\tif (tr.elevation !== elevation) {\n\t\t\t\televation = tr.elevation;\n\t\t\t}\n\t\t});\n\t});\n\n\tlet prevGlobalStateKeys: string[] = [];\n\t$effect(() => {\n\t\tif (!mapCtx.map) {\n\t\t\treturn;\n\t\t}\n\t\tconst newKeys = new Set(Object.keys(globalState));\n\t\tmapCtx.waitForStyleLoaded((map) => {\n\t\t\tfor (const key of prevGlobalStateKeys) {\n\t\t\t\tif (!newKeys.has(key)) {\n\t\t\t\t\tmap.setGlobalStateProperty(key, null);\n\t\t\t\t}\n\t\t\t}\n\t\t\tfor (const key of newKeys) {\n\t\t\t\tmap.setGlobalStateProperty(key, globalState![key]);\n\t\t\t}\n\t\t});\n\t\tprevGlobalStateKeys = Array.from(newKeys);\n\t});\n\n\t// Events\n\t$effect(() => resetEventListener(map, 'boxzoomcancel', onboxzoomcancel));\n\t$effect(() => resetEventListener(map, 'boxzoomend', onboxzoomend));\n\t$effect(() => resetEventListener(map, 'boxzoomstart', onboxzoomstart));\n\t$effect(() => resetEventListener(map, 'click', onclick));\n\t$effect(() => resetEventListener(map, 'contextmenu', oncontextmenu));\n\t$effect(() => resetEventListener(map, 'cooperativegestureprevented', oncooperativegestureprevented));\n\t$effect(() => resetEventListener(map, 'data', ondata));\n\t$effect(() => resetEventListener(map, 'dataabort', ondataabort));\n\t$effect(() => resetEventListener(map, 'dataloading', ondataloading));\n\t$effect(() => resetEventListener(map, 'dblclick', ondblclick));\n\t$effect(() => resetEventListener(map, 'drag', ondrag));\n\t$effect(() => resetEventListener(map, 'dragend', ondragend));\n\t$effect(() => resetEventListener(map, 'dragstart', ondragstart));\n\t$effect(() => resetEventListener(map, 'error', onerror));\n\t$effect(() => resetEventListener(map, 'idle', onidle));\n\t$effect(() => resetEventListener(map, 'load', onload));\n\t$effect(() => resetEventListener(map, 'mousedown', onmousedown));\n\t$effect(() => resetEventListener(map, 'mousemove', onmousemove));\n\t$effect(() => resetEventListener(map, 'mouseout', onmouseout));\n\t$effect(() => resetEventListener(map, 'mouseover', onmouseover));\n\t$effect(() => resetEventListener(map, 'mouseup', onmouseup));\n\t$effect(() => resetEventListener(map, 'move', onmove));\n\t$effect(() => resetEventListener(map, 'moveend', onmoveend));\n\t$effect(() => resetEventListener(map, 'movestart', onmovestart));\n\t$effect(() => resetEventListener(map, 'pitch', onpitch));\n\t$effect(() => resetEventListener(map, 'pitchend', onpitchend));\n\t$effect(() => resetEventListener(map, 'pitchstart', onpitchstart));\n\t$effect(() => resetEventListener(map, 'projectiontransition', onprojectiontransition));\n\t$effect(() => resetEventListener(map, 'remove', onremove));\n\t$effect(() => resetEventListener(map, 'render', onrender));\n\t$effect(() => resetEventListener(map, 'resize', onresize));\n\t$effect(() => resetEventListener(map, 'rotate', onrotate));\n\t$effect(() => resetEventListener(map, 'rotateend', onrotateend));\n\t$effect(() => resetEventListener(map, 'rotatestart', onrotatestart));\n\t$effect(() => resetEventListener(map, 'sourcedata', onsourcedata));\n\t$effect(() => resetEventListener(map, 'sourcedataabort', onsourcedataabort));\n\t$effect(() => resetEventListener(map, 'sourcedataloading', onsourcedataloading));\n\t$effect(() => resetEventListener(map, 'styledata', onstyledata));\n\t$effect(() => resetEventListener(map, 'styledataloading', onstyledataloading));\n\t$effect(() => resetEventListener(map, 'styleimagemissing', onstyleimagemissing));\n\t$effect(() => resetEventListener(map, 'terrain', onterrain));\n\t$effect(() => resetEventListener(map, 'tiledataloading', ontiledataloading));\n\t$effect(() => resetEventListener(map, 'touchcancel', ontouchcancel));\n\t$effect(() => resetEventListener(map, 'touchend', ontouchend));\n\t$effect(() => resetEventListener(map, 'touchmove', ontouchmove));\n\t$effect(() => resetEventListener(map, 'touchstart', ontouchstart));\n\t$effect(() => resetEventListener(map, 'webglcontextlost', onwebglcontextlost));\n\t$effect(() => resetEventListener(map, 'webglcontextrestored', onwebglcontextrestored));\n\t$effect(() => resetEventListener(map, 'wheel', onwheel));\n\t$effect(() => resetEventListener(map, 'zoom', onzoom));\n\t$effect(() => resetEventListener(map, 'zoomend', onzoomend));\n\t$effect(() => resetEventListener(map, 'zoomstart', onzoomstart));\n\n\tlet firstRun = true;\n\n\t$effect(() => {\n\t\t// TODO: differential update ?\n\t\tclassName;\n\t\tconst classNames = (className ?? '')?.split(/\\s/).filter(Boolean);\n\t\tif (container && !firstRun) {\n\t\t\tfor (const className of classNames) {\n\t\t\t\tcontainer.classList.add(className);\n\t\t\t}\n\t\t}\n\t\treturn () => {\n\t\t\tif (container) {\n\t\t\t\tfor (const className of classNames) {\n\t\t\t\t\tcontainer.classList.remove(className);\n\t\t\t\t}\n\t\t\t}\n\t\t};\n\t});\n\n\t// Others\n\t$effect(() => {\n\t\tif (fov !== undefined) {\n\t\t\tmap?.setVerticalFieldOfView(fov);\n\t\t}\n\t});\n\t$effect(() => {\n\t\tcursor;\n\t\tif (map && !firstRun) {\n\t\t\tmap.getCanvas().style.cursor = cursor ?? '';\n\t\t}\n\t});\n\n\t// Accessors\n\t$effect(() => {\n\t\tif (map && showTileBoundaries !== undefined && !firstRun) {\n\t\t\tmap.showTileBoundaries = showTileBoundaries;\n\t\t}\n\t});\n\t$effect(() => {\n\t\tif (map && showPadding !== undefined && !firstRun) {\n\t\t\tmap.showPadding = showPadding;\n\t\t}\n\t});\n\t$effect(() => {\n\t\tif (map && showCollisionBoxes !== undefined && !firstRun) {\n\t\t\tmap.showCollisionBoxes = showCollisionBoxes;\n\t\t}\n\t});\n\t$effect(() => {\n\t\tif (map && showOverdrawInspector !== undefined && !firstRun) {\n\t\t\tmap.showOverdrawInspector = showOverdrawInspector;\n\t\t}\n\t});\n\t$effect(() => {\n\t\tif (map && repaint !== undefined && !firstRun) {\n\t\t\tmap.repaint = repaint;\n\t\t}\n\t});\n\t$effect(() => {\n\t\tif (map && vertices !== undefined && !firstRun) {\n\t\t\tmap.vertices = vertices;\n\t\t}\n\t});\n\n\t// Map Options (reactive)\n\t$effect(() => {\n\t\tcenter;\n\t\tzoom;\n\t\tbearing;\n\t\tpitch;\n\t\troll;\n\t\televation;\n\t\tpadding;\n\t\tif (!firstRun && map) {\n\t\t\tconst tr = map._getTransformForUpdate();\n\t\t\tlet jumpTo: maplibregl.JumpToOptions = {};\n\t\t\tlet changed = false;\n\n\t\t\tfunction notAlmostEqual(a: number, b: number) {\n\t\t\t\t// The globe projection causes rounding errors, so we need to allow for a small difference\n\t\t\t\treturn Math.abs(a - b) > 1e-14;\n\t\t\t}\n\n\t\t\tif (center) {\n\t\t\t\tconst _center = maplibregl.LngLat.convert(center);\n\t\t\t\tif (notAlmostEqual(tr.center.lat, _center.lat) || notAlmostEqual(tr.center.lng, _center.lng)) {\n\t\t\t\t\tjumpTo.center = center;\n\t\t\t\t\tchanged = true;\n\t\t\t\t}\n\t\t\t}\n\t\t\tif (zoom !== undefined && notAlmostEqual(tr.zoom, zoom)) {\n\t\t\t\tjumpTo.zoom = zoom;\n\t\t\t\tchanged = true;\n\t\t\t}\n\t\t\tif (bearing !== undefined && notAlmostEqual(tr.bearing, bearing)) {\n\t\t\t\tjumpTo.bearing = bearing;\n\t\t\t\tchanged = true;\n\t\t\t}\n\t\t\tif (pitch !== undefined && tr.pitch !== pitch) {\n\t\t\t\tjumpTo.pitch = pitch;\n\t\t\t\tchanged = true;\n\t\t\t}\n\t\t\tif (roll !== undefined && tr.roll !== roll) {\n\t\t\t\tjumpTo.roll = roll;\n\t\t\t\tchanged = true;\n\t\t\t}\n\t\t\tif (elevation !== undefined && tr.elevation !== elevation) {\n\t\t\t\tjumpTo.elevation = elevation;\n\t\t\t\tchanged = true;\n\t\t\t}\n\t\t\tif (padding && !tr.isPaddingEqual(padding)) {\n\t\t\t\tjumpTo.padding = padding;\n\t\t\t\tchanged = true;\n\t\t\t}\n\n\t\t\tif (changed) {\n\t\t\t\t// Temporarily replace `stop` with `_stop(allowGestures: true)` to allow ongoing gestures during `jumpTo`,\n\t\t\t\tconst originalStop = map.stop;\n\t\t\t\tmap.stop = () => map!._stop(true);\n\t\t\t\tmap?.jumpTo(jumpTo, { reactivity: true });\n\t\t\t\tmap.stop = originalStop;\n\t\t\t}\n\t\t}\n\t});\n\t$effect(() => {\n\t\tbearingSnap;\n\t\tif (map && bearingSnap && !firstRun) {\n\t\t\tmap._bearingSnap = bearingSnap;\n\t\t}\n\t});\n\t$effect(() => {\n\t\tcenterClampedToGround;\n\t\tif (!firstRun) {\n\t\t\tmap?.setCenterClampedToGround(centerClampedToGround ?? false);\n\t\t}\n\t});\n\t$effect(() => {\n\t\tmaxBounds;\n\t\tif (!firstRun) {\n\t\t\tmap?.setMaxBounds(maxBounds);\n\t\t}\n\t});\n\t$effect(() => {\n\t\tmaxPitch;\n\t\tif (!firstRun) {\n\t\t\tmap?.setMaxPitch(maxPitch);\n\t\t}\n\t});\n\t$effect(() => {\n\t\tmaxZoom;\n\t\tif (!firstRun) {\n\t\t\tmap?.setMaxZoom(maxZoom);\n\t\t}\n\t});\n\t$effect(() => {\n\t\tminPitch;\n\t\tif (!firstRun) {\n\t\t\tmap?.setMinPitch(minPitch);\n\t\t}\n\t});\n\t$effect(() => {\n\t\tminZoom;\n\t\tif (!firstRun) {\n\t\t\tmap?.setMinZoom(minZoom);\n\t\t}\n\t});\n\t$effect(() => {\n\t\tpixelRatio;\n\t\tif (!firstRun) {\n\t\t\tmap?.setPixelRatio(pixelRatio ?? (null as unknown as number));\n\t\t}\n\t});\n\t$effect(() => {\n\t\trenderWorldCopies;\n\t\tif (!firstRun) {\n\t\t\tmap?.setRenderWorldCopies(renderWorldCopies ?? null);\n\t\t}\n\t});\n\t$effect(() => {\n\t\tstyle;\n\t\tif (!firstRun) {\n\t\t\tmapCtx.setStyle(style);\n\t\t}\n\t});\n\t$effect(() => {\n\t\ttransformRequest;\n\t\tif (!firstRun) {\n\t\t\tmap?.setTransformRequest(transformRequest as maplibregl.RequestTransformFunction);\n\t\t}\n\t});\n\n\t// Map Options (Map properties)\n\t$effect(() => {\n\t\tif (boxZoom !== undefined && !firstRun) {\n\t\t\tboxZoom ? map?.boxZoom.enable() : map?.boxZoom.disable();\n\t\t}\n\t});\n\t$effect(() => {\n\t\tif (map && cancelPendingTileRequestsWhileZooming !== undefined && !firstRun) {\n\t\t\tmap.cancelPendingTileRequestsWhileZooming = cancelPendingTileRequestsWhileZooming;\n\t\t}\n\t});\n\t$effect(() => {\n\t\tif (cooperativeGestures !== undefined && !firstRun) {\n\t\t\tcooperativeGestures ? map?.cooperativeGestures.enable() : map?.cooperativeGestures.disable();\n\t\t}\n\t});\n\t$effect(() => {\n\t\tif (doubleClickZoom !== undefined && !firstRun) {\n\t\t\tdoubleClickZoom ? map?.doubleClickZoom.enable() : map?.doubleClickZoom.disable();\n\t\t}\n\t});\n\t$effect(() => {\n\t\tif (dragPan !== undefined && !firstRun) {\n\t\t\tdragPan ? map?.dragPan.enable(dragPan) : map?.dragPan.disable();\n\t\t}\n\t});\n\t$effect(() => {\n\t\tif (dragRotate !== undefined && !firstRun) {\n\t\t\tdragRotate ? map?.dragRotate.enable() : map?.dragRotate.disable();\n\t\t}\n\t});\n\t$effect(() => {\n\t\tif (keyboard !== undefined && !firstRun) {\n\t\t\tkeyboard ? map?.keyboard.enable() : map?.keyboard.disable();\n\t\t}\n\t});\n\t$effect(() => {\n\t\tif (scrollZoom !== undefined && !firstRun) {\n\t\t\tscrollZoom ? map?.scrollZoom.enable(scrollZoom) : map?.scrollZoom.disable();\n\t\t}\n\t});\n\t$effect(() => {\n\t\tif (touchPitch !== undefined && !firstRun) {\n\t\t\ttouchPitch ? map?.touchPitch.enable(touchPitch) : map?.touchPitch.disable();\n\t\t}\n\t});\n\t$effect(() => {\n\t\tif (touchZoomRotate !== undefined && !firstRun) {\n\t\t\ttouchZoomRotate ? map?.touchZoomRotate.enable(touchZoomRotate) : map?.touchZoomRotate.disable();\n\t\t}\n\t});\n\t$effect(() => {\n\t\ttransformCameraUpdate;\n\t\tif (map && !firstRun) {\n\t\t\tmap.transformCameraUpdate = transformCameraUpdate ?? null;\n\t\t}\n\t});\n\n\t$effect(() => {\n\t\tfirstRun = false;\n\t});\n\n\tonDestroy(() => {\n\t\tmapCtx.map = null;\n\t\tmap?.remove();\n\t\tmap = undefined;\n\t});\n</script>\n\n<div class={className} style={inlineStyle} bind:this={container}>\n\t{#if map}\n\t\t{@render children?.(map)}\n\t{/if}\n</div>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/map/Projection.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-style-spec/projection/\n\n\timport { onDestroy } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport { getMapContext } from '../contexts.svelte.js';\n\n\ttype Props = maplibregl.ProjectionSpecification;\n\tlet { ...spec }: Props = $props();\n\n\tconst mapCtx = getMapContext();\n\tif (!mapCtx.map) throw new Error('Map instance is not initialized.');\n\n\t$effect(() => {\n\t\tmapCtx.userProjection = $state.snapshot(spec) as maplibregl.ProjectionSpecification;\n\t\tif (!mapCtx.userProjection.type) {\n\t\t\tmapCtx.userProjection.type = 'mercator';\n\t\t}\n\t\tmapCtx.waitForStyleLoaded((map) => {\n\t\t\tmap.setProjection(mapCtx.userProjection as maplibregl.ProjectionSpecification);\n\t\t});\n\t});\n\n\tonDestroy(() => {\n\t\tmapCtx.userProjection = undefined;\n\t\tmapCtx.waitForStyleLoaded((map) => {\n\t\t\tmap.setProjection(mapCtx.baseProjection ?? { type: 'mercator' });\n\t\t});\n\t});\n</script>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/map/Sky.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-style-spec/sky/\n\n\timport { onDestroy } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport { getMapContext } from '../contexts.svelte.js';\n\n\tlet { ...spec }: maplibregl.SkySpecification = $props();\n\n\tconst mapCtx = getMapContext();\n\tif (!mapCtx.map) throw new Error('Map instance is not initialized.');\n\n\t$effect(() => {\n\t\t// @ts-expect-error: ignore\n\t\tmapCtx.userSky = $state.snapshot(spec) as maplibregl.SkySpecification;\n\t\tmapCtx.waitForStyleLoaded((map) => {\n\t\t\tmap.setSky(mapCtx.userSky as maplibregl.SkySpecification);\n\t\t});\n\t});\n\n\tonDestroy(() => {\n\t\tmapCtx.userSky = undefined;\n\t\tmapCtx.waitForStyleLoaded((map) => {\n\t\t\tmap.setSky(mapCtx.baseSky as maplibregl.SkySpecification);\n\t\t});\n\t});\n</script>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/map/Sprite.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-style-spec/sprite/\n\n\timport { getMapContext } from '../contexts.svelte.js';\n\n\tinterface Props {\n\t\tid: string;\n\t\turl: string;\n\t}\n\tlet { id, url }: Props = $props();\n\n\tconst mapCtx = getMapContext();\n\n\t$effect(() => {\n\t\tif (!mapCtx.map) {\n\t\t\treturn;\n\t\t}\n\t\tmapCtx.waitForStyleLoaded((map) => {\n\t\t\tmap.addSprite(id, url);\n\t\t});\n\n\t\treturn () => {\n\t\t\tmapCtx.waitForStyleLoaded((map) => {\n\t\t\t\tmap.removeSprite(id);\n\t\t\t});\n\t\t};\n\t});\n</script>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/map/Terrain.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-style-spec/terrain/\n\n\timport { onDestroy } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport { getMapContext, getSourceContext } from '../contexts.svelte.js';\n\n\tinterface Props extends Omit<maplibregl.TerrainSpecification, 'source'> {\n\t\tsource?: string;\n\t}\n\tlet { source, ...spec }: Props = $props();\n\n\tconst mapCtx = getMapContext();\n\tif (!mapCtx.map) throw new Error('Map instance is not initialized.');\n\n\t// Get source id from source context or props\n\tconst sourceId = $derived(source ?? getSourceContext().id);\n\n\t$effect(() => {\n\t\tmapCtx.userTerrain = $state.snapshot({ ...spec, source: sourceId });\n\t\tmapCtx.waitForStyleLoaded((map) => {\n\t\t\tmap.setTerrain((mapCtx.userTerrain as maplibregl.TerrainSpecification) || null);\n\t\t});\n\t});\n\n\tonDestroy(() => {\n\t\tmapCtx.userTerrain = undefined;\n\t\tmapCtx.waitForStyleLoaded((map) => {\n\t\t\tmap.setTerrain(mapCtx.baseTerrain ?? null);\n\t\t});\n\t});\n</script>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/markers/Marker.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-gl-js/docs/API/classes/Marker/\n\n\timport { onDestroy, type Snippet } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport { getMapContext, prepareMarkerContext } from '../contexts.svelte.js';\n\timport { formatLngLat, resetEventListener } from '../utils.js';\n\n\tinterface Props extends Omit<maplibregl.MarkerOptions, 'className'> {\n\t\tlnglat: maplibregl.LngLatLike;\n\t\tclass?: string;\n\t\t/** HTML content of the marker */\n\t\tcontent?: Snippet;\n\t\tchildren?: Snippet;\n\t\t// Events\n\t\t// https://maplibre.org/maplibre-gl-js/docs/API/classes/Marker/#events\n\t\tondrag?: maplibregl.Listener;\n\t\tondragstart?: maplibregl.Listener;\n\t\tondragend?: maplibregl.Listener;\n\t}\n\n\tlet container = $state<HTMLElement | null>(null);\n\n\tlet {\n\t\tlnglat = $bindable(),\n\t\tclass: className = undefined,\n\t\tdraggable,\n\t\trotation,\n\t\trotationAlignment,\n\t\tpitchAlignment,\n\t\topacity,\n\t\tcolor,\n\t\topacityWhenCovered,\n\t\toffset,\n\t\tsubpixelPositioning,\n\t\tcontent,\n\t\tchildren,\n\t\tondrag,\n\t\tondragstart,\n\t\tondragend,\n\t\t...restOptions\n\t}: Props = $props();\n\n\tconst mapCtx = getMapContext();\n\tif (!mapCtx.map) throw new Error('Map instance is not initialized.');\n\n\tlet marker: maplibregl.Marker | null = $state.raw(null);\n\n\tconst markerCtx = prepareMarkerContext();\n\n\t$effect(() => {\n\t\tif (marker) {\n\t\t\treturn;\n\t\t}\n\t\tif (!mapCtx.map) throw new Error('MapLibre is not initialized');\n\n\t\tconst options: maplibregl.MarkerOptions = {\n\t\t\tdraggable,\n\t\t\toffset,\n\t\t\topacity,\n\t\t\tclassName,\n\t\t\topacityWhenCovered,\n\t\t\trotation,\n\t\t\tcolor,\n\t\t\trotationAlignment,\n\t\t\tpitchAlignment,\n\t\t\tsubpixelPositioning,\n\t\t\t...restOptions\n\t\t};\n\n\t\tif (content) {\n\t\t\tif (!container) throw new Error('Marker container is not initialized');\n\t\t\toptions.element = container;\n\t\t}\n\n\t\tmarker = new maplibregl.Marker(options);\n\t\tmarkerCtx.marker = marker;\n\n\t\tmarker.setLngLat($state.snapshot(lnglat) as maplibregl.LngLatLike).addTo(mapCtx.map);\n\n\t\tmarker.on('drag', (e) => {\n\t\t\tif (marker) {\n\t\t\t\tlnglat = formatLngLat(lnglat, marker.getLngLat());\n\t\t\t}\n\t\t\tondrag?.(e);\n\t\t});\n\t});\n\n\tlet firstRun = true;\n\n\t$effect(() => resetEventListener(marker, 'dragstart', ondragstart));\n\t$effect(() => resetEventListener(marker, 'dragend', ondragend));\n\n\t$effect(() => {\n\t\tdraggable;\n\t\tif (!firstRun) {\n\t\t\tmarker?.setDraggable(draggable);\n\t\t}\n\t});\n\n\t$effect(() => {\n\t\tif (lnglat && !firstRun) {\n\t\t\tmarker?.setLngLat(lnglat);\n\t\t}\n\t});\n\n\t$effect(() => {\n\t\trotation;\n\t\tif (!firstRun) {\n\t\t\tmarker?.setRotation(rotation);\n\t\t}\n\t});\n\n\t$effect(() => {\n\t\tif (offset && !firstRun) {\n\t\t\tmarker?.setOffset(offset);\n\t\t}\n\t});\n\t$effect(() => {\n\t\topacity;\n\t\topacityWhenCovered;\n\t\tif (!firstRun) {\n\t\t\tmarker?.setOpacity(opacity, opacityWhenCovered);\n\t\t}\n\t});\n\t$effect(() => {\n\t\tif (rotationAlignment && !firstRun) {\n\t\t\tmarker?.setRotationAlignment(rotationAlignment);\n\t\t}\n\t});\n\t$effect(() => {\n\t\tif (pitchAlignment && !firstRun) {\n\t\t\tmarker?.setPitchAlignment(pitchAlignment);\n\t\t}\n\t});\n\t$effect(() => {\n\t\tif (subpixelPositioning !== undefined && !firstRun) {\n\t\t\tmarker?.setSubpixelPositioning(subpixelPositioning);\n\t\t}\n\t});\n\n\t$effect(() => {\n\t\t// TODO: differential update ?\n\t\tconst classNames = (className ?? '')?.split(/\\s/).filter(Boolean);\n\t\tif (marker && !firstRun) {\n\t\t\tfor (const className of classNames) {\n\t\t\t\tmarker.addClassName(className);\n\t\t\t}\n\t\t}\n\t\treturn () => {\n\t\t\tif (marker) {\n\t\t\t\tfor (const className of classNames) {\n\t\t\t\t\tmarker.removeClassName(className);\n\t\t\t\t}\n\t\t\t}\n\t\t};\n\t});\n\n\t$effect(() => {\n\t\tfirstRun = false;\n\t});\n\n\tonDestroy(() => {\n\t\tmarker?.remove();\n\t});\n</script>\n\n{#if content}\n\t<div bind:this={container}>\n\t\t{@render content()}\n\t</div>\n{/if}\n\n{@render children?.()}\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/markers/Popup.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-gl-js/docs/API/classes/Popup/\n\n\timport { onDestroy, type Snippet } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport { getMapContext, getMarkerContext } from '../contexts.svelte.js';\n\n\tinterface Props extends Omit<maplibregl.PopupOptions, 'className'> {\n\t\tlnglat?: maplibregl.LngLatLike;\n\t\tclass?: string;\n\t\topen?: boolean;\n\t\t/** HTML content of the popup */\n\t\tchildren?: Snippet;\n\t\t// Events\n\t\t// https://maplibre.org/maplibre-gl-js/docs/API/classes/Popup/#events\n\t\tonopen?: maplibregl.Listener;\n\t\tonclose?: maplibregl.Listener;\n\t}\n\tlet {\n\t\t// reactive\n\t\tlnglat,\n\t\tclass: className = undefined,\n\t\topen = $bindable(),\n\t\toffset,\n\t\tmaxWidth,\n\t\tsubpixelPositioning,\n\t\t//\n\t\tcloseButton,\n\t\tcloseOnClick,\n\t\tcloseOnMove,\n\t\tfocusAfterOpen,\n\t\t// Events\n\t\tonopen,\n\t\tonclose,\n\t\t// Children\n\t\tchildren,\n\t\t...restOptions\n\t}: Props = $props();\n\n\tlet container = $state<HTMLElement | null>(null);\n\n\tconst mapCtx = getMapContext();\n\tif (!mapCtx.map) throw new Error('Map instance is not initialized.');\n\n\tlet popup: maplibregl.Popup | null = $state.raw(null);\n\n\tconst markerContext = getMarkerContext();\n\n\t$effect(() => {\n\t\tif (popup) {\n\t\t\treturn;\n\t\t}\n\t\tif (!mapCtx.map) throw new Error('MapLibre is not initialized');\n\n\t\tconst options: maplibregl.PopupOptions = {\n\t\t\tclassName,\n\t\t\toffset,\n\t\t\tsubpixelPositioning,\n\t\t\t...restOptions\n\t\t};\n\n\t\tmaxWidth !== undefined && (options.maxWidth = maxWidth);\n\t\tcloseButton !== undefined && (options.closeButton = closeButton);\n\t\tcloseOnClick !== undefined && (options.closeOnClick = closeOnClick);\n\t\tcloseOnMove !== undefined && (options.closeOnMove = closeOnMove);\n\t\tfocusAfterOpen !== undefined && (options.focusAfterOpen = focusAfterOpen);\n\n\t\tif (!container) throw new Error('Popup content container is not initialized');\n\n\t\tpopup = new maplibregl.Popup(options);\n\t\tpopup.setDOMContent(container);\n\n\t\tif (lnglat) {\n\t\t\tpopup.setLngLat(lnglat);\n\t\t\tif (open === undefined) {\n\t\t\t\topen = true;\n\t\t\t}\n\t\t}\n\t});\n\n\t$effect(() => {\n\t\tif (markerContext?.marker) {\n\t\t\tmarkerContext.marker.setPopup(popup);\n\t\t}\n\t});\n\n\tlet firstRun = true;\n\tlet internalOpen = false;\n\n\t$effect(() => {\n\t\tif (open === true) {\n\t\t\tif (mapCtx.map && !internalOpen) {\n\t\t\t\tif (!popup?.getLngLat()) {\n\t\t\t\t\tconst lnglat = markerContext?.marker?.getLngLat();\n\t\t\t\t\tif (!lnglat) return;\n\t\t\t\t\tpopup?.setLngLat(lnglat);\n\t\t\t\t}\n\t\t\t\tpopup?.addTo(mapCtx.map);\n\t\t\t\tinternalOpen = true;\n\t\t\t}\n\t\t} else if (open === false && internalOpen) {\n\t\t\tpopup?.remove();\n\t\t\tinternalOpen = false;\n\t\t}\n\t});\n\n\t$effect(() => {\n\t\tfunction _onopen(ev: unknown) {\n\t\t\topen = true;\n\t\t\tinternalOpen = true;\n\t\t\tonopen?.(ev);\n\t\t}\n\t\tpopup?.on('open', _onopen);\n\t\treturn () => {\n\t\t\tpopup?.off('open', _onopen);\n\t\t};\n\t});\n\n\t$effect(() => {\n\t\tfunction _onclose(ev: unknown) {\n\t\t\topen = false;\n\t\t\tinternalOpen = false;\n\t\t\tonclose?.(ev);\n\t\t}\n\t\tpopup?.on('close', _onclose);\n\t\treturn () => {\n\t\t\tpopup?.off('close', _onclose);\n\t\t};\n\t});\n\n\t$effect(() => {\n\t\tif (lnglat && !firstRun) {\n\t\t\tpopup?.setLngLat(lnglat);\n\t\t}\n\t});\n\n\t$effect(() => {\n\t\tmaxWidth;\n\t\tif (!firstRun) {\n\t\t\tpopup?.setMaxWidth(maxWidth ?? 'none');\n\t\t}\n\t});\n\n\t$effect(() => {\n\t\tif (offset && !firstRun) {\n\t\t\tpopup?.setOffset(offset);\n\t\t}\n\t});\n\n\t$effect(() => {\n\t\tif (subpixelPositioning !== undefined && !firstRun) {\n\t\t\tpopup?.setSubpixelPositioning(subpixelPositioning);\n\t\t}\n\t});\n\n\t$effect(() => {\n\t\t// TODO: differential update ?\n\t\tconst classNames = (className ?? '')?.split(/\\s/).filter(Boolean);\n\t\tif (popup && !firstRun) {\n\t\t\tfor (const className of classNames) {\n\t\t\t\tpopup.addClassName(className);\n\t\t\t}\n\t\t}\n\t\treturn () => {\n\t\t\tif (popup) {\n\t\t\t\tfor (const className of classNames) {\n\t\t\t\t\tpopup.removeClassName(className);\n\t\t\t\t}\n\t\t\t}\n\t\t};\n\t});\n\n\t$effect(() => {\n\t\tfirstRun = false;\n\t});\n\n\tonDestroy(() => {\n\t\tpopup?.remove();\n\t\tmarkerContext?.marker?.setPopup(null);\n\t});\n</script>\n\n<div bind:this={container}>\n\t{@render children?.()}\n</div>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/sources/CanvasSource.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-gl-js/docs/API/classes/CanvasSource/\n\n\timport type { Snippet } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport RawSource from './RawSource.svelte';\n\n\tinterface Props extends Omit<maplibregl.CanvasSourceSpecification, 'type'> {\n\t\tid?: string;\n\t\tsource?: maplibregl.CanvasSource;\n\t\tchildren?: Snippet;\n\t}\n\tlet { source = $bindable(undefined), id, children, ...spec }: Props = $props();\n</script>\n\n<RawSource {id} bind:source type=\"canvas\" {...spec}>\n\t{@render children?.()}\n</RawSource>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/sources/FeatureState.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-gl-js/docs/API/classes/Map/#setfeaturestate\n\n\timport { onDestroy, type Snippet } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport { getMapContext, getSourceContext } from '../contexts.svelte.js';\n\n\tinterface Props extends Omit<maplibregl.FeatureIdentifier, 'source'> {\n\t\tsource?: string;\n\t\tstate: Record<string, unknown>;\n\t\tchildren?: Snippet;\n\t}\n\n\tlet { id, source: _sourceId, sourceLayer, state: featureState, children }: Props = $props();\n\n\tconst mapCtx = getMapContext();\n\tif (!mapCtx.map) throw new Error('Map instance is not initialized.');\n\n\tconst source = _sourceId || getSourceContext().id;\n\n\tlet prevKeys: string[] = [];\n\tlet prevIdentifier = $state.snapshot({ source, sourceLayer, id });\n\n\t$effect(() => {\n\t\tif (!mapCtx.map) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst newKeys = new Set(Object.keys(featureState));\n\n\t\tif (prevIdentifier.id !== undefined) {\n\t\t\tconst targetIdChanged =\n\t\t\t\tprevIdentifier.id !== id || prevIdentifier.source !== source || prevIdentifier.sourceLayer !== sourceLayer;\n\t\t\tfor (const key of prevKeys) {\n\t\t\t\t// Remove previous key-values from the previous feature\n\t\t\t\tif (targetIdChanged || !newKeys.has(key)) {\n\t\t\t\t\tmapCtx.map.removeFeatureState(prevIdentifier, key);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\t// Set new key-values\n\t\tconst identifier = $state.snapshot({ source, sourceLayer, id });\n\t\tif (identifier.id !== undefined) {\n\t\t\tmapCtx.map.setFeatureState(identifier, $state.snapshot(featureState));\n\t\t}\n\n\t\tprevKeys = Array.from(newKeys);\n\t\tprevIdentifier = identifier;\n\t});\n\n\tonDestroy(() => {\n\t\tif (mapCtx.map) {\n\t\t\tfor (const key of prevKeys) {\n\t\t\t\tmapCtx.map.removeFeatureState(prevIdentifier, key);\n\t\t\t}\n\t\t}\n\t});\n</script>\n\n{@render children?.()}\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/sources/GeoJSONSource.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-gl-js/docs/API/classes/GeoJSONSource/\n\t// https://maplibre.org/maplibre-style-spec/sources/#geojson\n\n\timport type { Snippet } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport RawSource from './RawSource.svelte';\n\n\tinterface Props extends Omit<maplibregl.GeoJSONSourceSpecification, 'type'> {\n\t\tid?: string;\n\t\tsource?: maplibregl.GeoJSONSource;\n\t\tchildren?: Snippet;\n\t}\n\tlet { source = $bindable(undefined), id, children, ...spec }: Props = $props();\n</script>\n\n<RawSource {id} bind:source type=\"geojson\" {...spec}>\n\t{@render children?.()}\n</RawSource>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/sources/ImageSource.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-gl-js/docs/API/classes/ImageSource/\n\t// https://maplibre.org/maplibre-style-spec/sources/#image\n\n\timport type { Snippet } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport RawSource from './RawSource.svelte';\n\n\tinterface Props extends Omit<maplibregl.ImageSourceSpecification, 'type'> {\n\t\tid?: string;\n\t\tsource?: maplibregl.ImageSource;\n\t\tchildren?: Snippet;\n\t}\n\tlet { source = $bindable(undefined), id, children, ...spec }: Props = $props();\n</script>\n\n<RawSource {id} bind:source type=\"image\" {...spec}>\n\t{@render children?.()}\n</RawSource>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/sources/RasterDEMTileSource.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-gl-js/docs/API/classes/RasterDEMTileSource/\n\t// https://maplibre.org/maplibre-style-spec/sources/#raster-dem\n\n\timport type { Snippet } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport RawSource from './RawSource.svelte';\n\n\tinterface Props extends Omit<maplibregl.RasterDEMSourceSpecification, 'type'> {\n\t\tid?: string;\n\t\tsource?: maplibregl.RasterDEMTileSource;\n\t\tchildren?: Snippet;\n\t}\n\tlet { source = $bindable(undefined), id, children, ...spec }: Props = $props();\n</script>\n\n<RawSource {id} bind:source type=\"raster-dem\" {...spec}>\n\t{@render children?.()}\n</RawSource>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/sources/RasterTileSource.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-gl-js/docs/API/classes/RasterTileSource/\n\t// https://maplibre.org/maplibre-style-spec/sources/#raster\n\n\timport type { Snippet } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport RawSource from './RawSource.svelte';\n\n\tinterface Props extends Omit<maplibregl.RasterSourceSpecification, 'type'> {\n\t\tid?: string;\n\t\tsource?: maplibregl.RasterTileSource;\n\t\tchildren?: Snippet;\n\t}\n\tlet { source = $bindable(undefined), id, children, ...spec }: Props = $props();\n</script>\n\n<RawSource {id} bind:source type=\"raster\" {...spec}>\n\t{@render children?.()}\n</RawSource>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/sources/RawSource.svelte",
    "content": "<script lang=\"ts\">\n\timport { onDestroy, type Snippet } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport { getMapContext, prepareSourceContext } from '../contexts.svelte.js';\n\timport { generateSourceID } from '../utils.js';\n\n\ttype Source =\n\t\t| maplibregl.GeoJSONSource\n\t\t| maplibregl.CanvasSource\n\t\t| maplibregl.VectorTileSource\n\t\t| maplibregl.RasterTileSource\n\t\t| maplibregl.RasterDEMTileSource\n\t\t| maplibregl.CanvasSource\n\t\t| maplibregl.ImageSource\n\t\t| maplibregl.VideoSource;\n\n\ttype Specs = maplibregl.SourceSpecification | maplibregl.CanvasSourceSpecification;\n\n\ttype Props = {\n\t\tid?: string;\n\t\tsource?: Source;\n\t\tchildren?: Snippet;\n\t} & Specs;\n\tlet { source = $bindable(undefined), id: _id, children, ...spec }: Props = $props();\n\tspec = spec as Specs;\n\n\tconst mapCtx = getMapContext();\n\tif (!mapCtx.map) throw new Error('Map instance is not initialized.');\n\n\tlet firstRun = true;\n\n\tconst id = _id ?? generateSourceID();\n\tconst sourceCtx = prepareSourceContext();\n\tsourceCtx.id = id;\n\tmapCtx.waitForStyleLoaded((map) => {\n\t\tmapCtx.addSource(id, $state.snapshot(spec) as Specs);\n\t\tsource = map.getSource(id);\n\t\tfirstRun = true;\n\t});\n\n\t$effect(() => {\n\t\tif (source && spec.type !== 'canvas' && spec.type !== 'video' && spec.type !== 'image') {\n\t\t\tsource.maxzoom = spec.maxzoom ?? 22;\n\t\t\tif (spec.type !== 'geojson') {\n\t\t\t\tsource.minzoom = spec.minzoom ?? 0;\n\t\t\t}\n\t\t}\n\t});\n\t$effect(() => {\n\t\tif (source && (spec.type === 'vector' || spec.type === 'raster' || spec.type === 'raster-dem')) {\n\t\t\tspec.tiles;\n\t\t\tif (!firstRun && 'setTiles' in source) {\n\t\t\t\tsource.setTiles(spec.tiles ?? []);\n\t\t\t}\n\t\t}\n\t});\n\t$effect(() => {\n\t\tif (source && (spec.type === 'vector' || spec.type === 'raster' || spec.type === 'raster-dem')) {\n\t\t\tspec.url;\n\t\t\tif (!firstRun && 'setUrl' in source) {\n\t\t\t\tsource.setUrl(spec.url as string);\n\t\t\t}\n\t\t}\n\t});\n\t$effect(() => {\n\t\tif (source && spec.type === 'image') {\n\t\t\tspec.url;\n\t\t\tif (!firstRun) {\n\t\t\t\t(source as maplibregl.ImageSource).updateImage({ url: spec.url });\n\t\t\t}\n\t\t}\n\t});\n\t$effect(() => {\n\t\tif (source && (spec.type === 'image' || spec.type === 'video' || spec.type === 'canvas')) {\n\t\t\tspec.coordinates;\n\t\t\tif (!firstRun) {\n\t\t\t\tif (!('setCoordinates' in source)) throw new Error('setCoordinates method is not supported');\n\t\t\t\tsource.setCoordinates(spec.coordinates);\n\t\t\t}\n\t\t}\n\t});\n\t$effect(() => {\n\t\tif (spec.type === 'canvas') {\n\t\t\tspec.animate;\n\t\t\tif (source && spec.animate !== undefined && !firstRun) {\n\t\t\t\tconst cs = source as maplibregl.CanvasSource;\n\t\t\t\tspec.animate ? cs.play() : cs.pause();\n\t\t\t}\n\t\t}\n\t});\n\t$effect(() => {\n\t\tif (source && spec.type === 'geojson') {\n\t\t\tspec.data;\n\t\t\tif (!firstRun) {\n\t\t\t\t// TODO: support diffrential update ? (updateData)\n\t\t\t\t(source as maplibregl.GeoJSONSource).setData(spec.data);\n\t\t\t}\n\t\t}\n\t});\n\t$effect(() => {\n\t\tif (source && spec.type === 'geojson') {\n\t\t\tspec.cluster;\n\t\t\tspec.clusterMaxZoom;\n\t\t\tspec.clusterRadius;\n\t\t\tif (!firstRun) {\n\t\t\t\tif (spec.clusterRadius !== undefined) {\n\t\t\t\t\t(source as maplibregl.GeoJSONSource).workerOptions.superclusterOptions!.radius =\n\t\t\t\t\t\tspec.clusterRadius * (8192 / source.tileSize);\n\t\t\t\t}\n\t\t\t\t(source as maplibregl.GeoJSONSource).setClusterOptions({\n\t\t\t\t\tcluster: spec.cluster,\n\t\t\t\t\tclusterMaxZoom: spec.clusterMaxZoom\n\t\t\t\t\t// clusterRadius: spec.clusterRadius, // TODO: Requires a fix in maplibre-gl-js\n\t\t\t\t});\n\t\t\t}\n\t\t}\n\t});\n\n\t$effect(() => {\n\t\tsource;\n\t\tfirstRun = false;\n\t});\n\n\tonDestroy(() => {\n\t\tmapCtx.removeSource(id);\n\t\tsource = undefined;\n\t});\n</script>\n\n{@render children?.()}\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/sources/VectorTileSource.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-gl-js/docs/API/classes/VectorTileSource/\n\t// https://maplibre.org/maplibre-style-spec/sources/#vector\n\n\timport type { Snippet } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport RawSource from './RawSource.svelte';\n\n\tinterface Props extends Omit<maplibregl.VectorSourceSpecification, 'type'> {\n\t\tid?: string;\n\t\tsource?: maplibregl.VectorTileSource;\n\t\tchildren?: Snippet;\n\t}\n\tlet { source = $bindable(undefined), id, children, ...spec }: Props = $props();\n</script>\n\n<RawSource {id} bind:source type=\"vector\" {...spec}>\n\t{@render children?.()}\n</RawSource>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/sources/VideoSource.svelte",
    "content": "<script lang=\"ts\">\n\t// https://maplibre.org/maplibre-gl-js/docs/API/classes/VideoSource/\n\t// https://maplibre.org/maplibre-style-spec/sources/#video\n\n\timport type { Snippet } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport RawSource from './RawSource.svelte';\n\n\tinterface Props extends Omit<maplibregl.VideoSourceSpecification, 'type'> {\n\t\tid?: string;\n\t\tsource?: maplibregl.VideoSource;\n\t\tchildren?: Snippet;\n\t}\n\tlet { source = $bindable(undefined), id, children, ...spec }: Props = $props();\n</script>\n\n<RawSource {id} bind:source type=\"video\" {...spec}>\n\t{@render children?.()}\n</RawSource>\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/types.ts",
    "content": "export type Listener<T> = (event: T) => void;\n\nexport type Event<T, N = string> = {\n\ttype: N;\n\ttarget: T;\n};\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/utilities/ImageLoader.svelte",
    "content": "<script lang=\"ts\">\n\timport { onDestroy, type Snippet } from 'svelte';\n\timport { getMapContext } from '../contexts.svelte.js';\n\timport maplibregl from 'maplibre-gl';\n\n\tconst mapCtx = getMapContext();\n\tif (!mapCtx.map) throw new Error('Map instance is not initialized.');\n\n\tlet {\n\t\timages,\n\t\tloading = $bindable(),\n\t\tchildren\n\t}: {\n\t\timages: Record<string, string | [string, Partial<maplibregl.StyleImageMetadata>]>;\n\t\tloading?: boolean;\n\t\tchildren?: Snippet;\n\t} = $props();\n\n\tlet initialLoaded = $state(false);\n\n\t// map from loaded image id to url\n\t// eslint-disable-next-line svelte/prefer-svelte-reactivity\n\tconst loadedImages: Map<string, string> = new Map();\n\n\t$effect(() => {\n\t\t// Remove images that are not in the new list or have a different url\n\t\tfor (const [id, url] of loadedImages) {\n\t\t\tconst src = images[id];\n\t\t\tif (src) {\n\t\t\t\tconst newUrl = Array.isArray(src) ? src[0] : src;\n\t\t\t\tif (url === newUrl) {\n\t\t\t\t\tcontinue;\n\t\t\t\t} else {\n\t\t\t\t\tloadedImages.delete(id);\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\tloadedImages.delete(id);\n\t\t\t\tmapCtx.map?.removeImage(id);\n\t\t\t}\n\t\t}\n\n\t\t// Load and add images that are not already loaded\n\t\tconst tasks = [];\n\t\tfor (const [id, src] of Object.entries(images)) {\n\t\t\t// if already loaded\n\t\t\tif (loadedImages.has(id)) {\n\t\t\t\t// Update image options if necessary\n\t\t\t\tconst image = mapCtx.map?.getImage(id);\n\t\t\t\tif (image) {\n\t\t\t\t\tconst _src = $state.snapshot(src) as string | [string, Partial<maplibregl.StyleImageMetadata>];\n\t\t\t\t\tconst options = Array.isArray(_src) ? _src[1] : {};\n\t\t\t\t\tlet changed = false;\n\t\t\t\t\tif (image.pixelRatio !== (options.pixelRatio ?? 1)) {\n\t\t\t\t\t\timage.pixelRatio = options.pixelRatio ?? 1;\n\t\t\t\t\t\tchanged = true;\n\t\t\t\t\t}\n\t\t\t\t\tif (image.sdf !== (options.sdf ?? false)) {\n\t\t\t\t\t\timage.sdf = options.sdf ?? false;\n\t\t\t\t\t\tchanged = true;\n\t\t\t\t\t}\n\t\t\t\t\tif (image.stretchX !== options.stretchX) {\n\t\t\t\t\t\timage.stretchX = options.stretchX;\n\t\t\t\t\t\tchanged = true;\n\t\t\t\t\t}\n\t\t\t\t\tif (image.stretchY !== options.stretchY) {\n\t\t\t\t\t\timage.stretchY = options.stretchY;\n\t\t\t\t\t\tchanged = true;\n\t\t\t\t\t}\n\t\t\t\t\tif (image.content !== options.content) {\n\t\t\t\t\t\timage.content = options.content;\n\t\t\t\t\t\tchanged = true;\n\t\t\t\t\t}\n\t\t\t\t\tif (image.textFitHeight !== options.textFitHeight) {\n\t\t\t\t\t\timage.textFitHeight = options.textFitHeight;\n\t\t\t\t\t\tchanged = true;\n\t\t\t\t\t}\n\t\t\t\t\tif (image.textFitWidth !== options.textFitWidth) {\n\t\t\t\t\t\timage.textFitWidth = options.textFitWidth;\n\t\t\t\t\t\tchanged = true;\n\t\t\t\t\t}\n\n\t\t\t\t\tif (changed) {\n\t\t\t\t\t\tmapCtx.map?.style.updateImage(id, image);\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tcontinue;\n\t\t\t}\n\n\t\t\tconst [url, options] = Array.isArray(src) ? src : [src, undefined];\n\t\t\tloadedImages.set(id, url);\n\t\t\ttasks.push(\n\t\t\t\t(async () => {\n\t\t\t\t\tconst image = await mapCtx.map?.loadImage(url);\n\t\t\t\t\tif (mapCtx.map?.getImage(id)) {\n\t\t\t\t\t\tmapCtx.map?.removeImage(id);\n\t\t\t\t\t}\n\t\t\t\t\tif (image && loadedImages.has(id)) {\n\t\t\t\t\t\tmapCtx.map?.addImage(id, image?.data, options);\n\t\t\t\t\t}\n\t\t\t\t})()\n\t\t\t);\n\t\t}\n\n\t\tif (tasks.length > 0) {\n\t\t\tloading = true;\n\t\t\tPromise.allSettled([tasks]).then((results) => {\n\t\t\t\tconst failures = results.filter((r) => r.status === 'rejected');\n\t\t\t\tif (failures.length > 0) {\n\t\t\t\t\tconsole.error(`${failures.length} images failed to load:`, failures);\n\t\t\t\t}\n\t\t\t\tinitialLoaded = true;\n\t\t\t\tloading = false;\n\t\t\t});\n\t\t} else {\n\t\t\tinitialLoaded = true;\n\t\t}\n\t});\n\n\tonDestroy(() => {\n\t\tfor (const id of loadedImages.keys()) {\n\t\t\tmapCtx.map?.removeImage(id);\n\t\t}\n\t});\n</script>\n\n{#if initialLoaded}\n\t{@render children?.()}\n{/if}\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/utilities/QueryRenderedFeatures.svelte",
    "content": "<script lang=\"ts\">\n\timport { onDestroy, type Snippet } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport { getLayerContext, getMapContext } from '../contexts.svelte.js';\n\n\tinterface Props extends maplibregl.QueryRenderedFeaturesOptions {\n\t\tmap?: maplibregl.Map;\n\t\tgeometry?: maplibregl.PointLike | [maplibregl.PointLike, maplibregl.PointLike];\n\t\tfeatures?: maplibregl.MapGeoJSONFeature[];\n\t\tchildren?: Snippet<[maplibregl.MapGeoJSONFeature]>;\n\t}\n\n\tlet { map: givenMap, geometry, features = $bindable([]), children, layers, ...options }: Props = $props();\n\n\tfeatures = [];\n\tlet trigger = $state(0);\n\tlet map = $derived(givenMap || getMapContext().map);\n\n\t$effect(() => {\n\t\tmap?.on('render', update);\n\t\treturn () => {\n\t\t\tmap?.off('render', update);\n\t\t};\n\t});\n\n\tfunction update() {\n\t\ttrigger++;\n\t}\n\n\t$effect(() => {\n\t\ttrigger;\n\t\tif (!map) {\n\t\t\tfeatures = [];\n\t\t\treturn;\n\t\t}\n\n\t\tlet _options = {\n\t\t\tlayers: layers || [getLayerContext()?.id || ''],\n\t\t\t...options\n\t\t};\n\t\tlet _geometry = geometry;\n\t\tlet queriedFeatures = (\n\t\t\t_geometry ? map.queryRenderedFeatures(_geometry, _options) : map.queryRenderedFeatures(_options)\n\t\t)\n\t\t\t// id may be undefined - fallback to properties.id or generate one\n\t\t\t.map((feature, index) => {\n\t\t\t\tfeature.id = feature.id ?? feature.properties?.id ?? `svmlgl-feature-${index}`;\n\t\t\t\treturn feature;\n\t\t\t});\n\n\t\t// sort\n\t\tqueriedFeatures.sort((a, b) => {\n\t\t\treturn String(a.id).localeCompare(String(b.id));\n\t\t});\n\n\t\tfeatures = queriedFeatures;\n\t});\n\n\tonDestroy(() => {\n\t\tfeatures = [];\n\t});\n</script>\n\n{#if children}{#each features as feature (feature.id)}{@render children(feature)}{/each}{/if}\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/utilities/QuerySourceFeatures.svelte",
    "content": "<script lang=\"ts\">\n\timport { onDestroy, type Snippet } from 'svelte';\n\timport maplibregl from 'maplibre-gl';\n\timport { getMapContext, getSourceContext } from '../contexts.svelte.js';\n\n\tinterface Props extends maplibregl.QuerySourceFeatureOptions {\n\t\tmap?: maplibregl.Map;\n\t\tsource?: string;\n\t\tfeatures?: maplibregl.MapGeoJSONFeature[];\n\t\tchildren?: Snippet<[maplibregl.MapGeoJSONFeature]>;\n\t}\n\n\tlet { map: givenMap, source: givenSource, features = $bindable([]), children, ...options }: Props = $props();\n\n\tfeatures = [];\n\tlet trigger = $state(0);\n\tlet map = $derived(givenMap || getMapContext().map);\n\tlet source = $derived(givenSource || getSourceContext().id);\n\n\t$effect(() => {\n\t\tmap?.on('render', update);\n\t\treturn () => {\n\t\t\tmap?.off('render', update);\n\t\t};\n\t});\n\n\tfunction update() {\n\t\ttrigger++;\n\t}\n\n\t$effect(() => {\n\t\ttrigger;\n\t\tif (!map || !source) {\n\t\t\tfeatures = [];\n\t\t\treturn;\n\t\t}\n\n\t\tlet queriedFeature = map.querySourceFeatures(\n\t\t\tsource,\n\t\t\t$state.snapshot(options) as maplibregl.QuerySourceFeatureOptions\n\t\t) as maplibregl.MapGeoJSONFeature[];\n\n\t\t// deduplicate\n\t\t// eslint-disable-next-line svelte/prefer-svelte-reactivity\n\t\tlet closed = new Set();\n\t\tqueriedFeature = queriedFeature.filter((feature) => {\n\t\t\tif (feature.id !== undefined) {\n\t\t\t\tif (closed.has(feature.id)) {\n\t\t\t\t\treturn false;\n\t\t\t\t}\n\t\t\t}\n\t\t\tclosed.add(feature.id);\n\t\t\treturn true;\n\t\t});\n\n\t\t// sort\n\t\tqueriedFeature.sort((a, b) => {\n\t\t\treturn String(a.id).localeCompare(String(b.id));\n\t\t});\n\n\t\tfeatures = queriedFeature;\n\t});\n\n\tonDestroy(() => {\n\t\tfeatures = [];\n\t});\n</script>\n\n{#if children}{#each features as feature (feature.id)}{@render children(feature)}{/each}{/if}\n"
  },
  {
    "path": "svelte-maplibre-gl/src/lib/utils.ts",
    "content": "import maplibregl from 'maplibre-gl';\n\nlet layerIdCounter = 0;\nlet sourceIdCounter = 0;\n\nexport function generateLayerID() {\n\treturn `svmlgl-layer-${layerIdCounter++}`;\n}\n\nexport function generateSourceID() {\n\treturn `svmlgl-source-${sourceIdCounter++}`;\n}\n\n/**\n * Set an event listener on an Evented object, and return a function that will remove the listener.\n *\n * Intended to be used within the $effect rune.\n */\nexport function resetEventListener(\n\tevented: maplibregl.Evented | null | undefined,\n\ttype: string,\n\tlistener: maplibregl.Listener | undefined\n) {\n\tif (listener) {\n\t\tevented?.on(type, listener);\n\t}\n\tconst prevListener = listener;\n\treturn () => {\n\t\tif (prevListener) {\n\t\t\tevented?.off(type, prevListener);\n\t\t}\n\t};\n}\n\n/**\n * Set a Layer event listener on the Map object, and return a function that will remove the listener.\n *\n * Intended to be used within the $effect rune.\n */\nexport function resetLayerEventListener(\n\tmap: maplibregl.Map | null,\n\ttype: keyof maplibregl.MapLayerEventType,\n\tlayer: string,\n\tlistener: maplibregl.Listener | undefined\n) {\n\tif (listener) {\n\t\tmap?.on(type, layer, listener);\n\t}\n\tconst prevListener = listener;\n\treturn () => {\n\t\tif (prevListener) {\n\t\t\tmap?.off(type, layer, prevListener);\n\t\t}\n\t};\n}\n\nexport function formatLngLat(target: maplibregl.LngLatLike, lnglat: maplibregl.LngLat): maplibregl.LngLatLike {\n\tif (Array.isArray(target)) {\n\t\treturn [lnglat.lng, lnglat.lat];\n\t} else if ('lon' in target) {\n\t\treturn { lon: lnglat.lng, lat: lnglat.lat };\n\t} else {\n\t\treturn { lng: lnglat.lng, lat: lnglat.lat };\n\t}\n}\n"
  },
  {
    "path": "svelte-maplibre-gl/svelte.config.js",
    "content": "import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';\n\n/** @type {import('@sveltejs/kit').Config} */\nconst config = {\n\tpreprocess: vitePreprocess(),\n\tkit: {\n\t\t// No adapter needed for library packages\n\t}\n};\n\nexport default config;\n"
  },
  {
    "path": "svelte-maplibre-gl/tsconfig.json",
    "content": "{\n\t\"extends\": \"./.svelte-kit/tsconfig.json\",\n\t\"compilerOptions\": {\n\t\t\"allowJs\": true,\n\t\t\"checkJs\": true,\n\t\t\"esModuleInterop\": true,\n\t\t\"forceConsistentCasingInFileNames\": true,\n\t\t\"resolveJsonModule\": true,\n\t\t\"skipLibCheck\": true,\n\t\t\"sourceMap\": true,\n\t\t\"strict\": true,\n\t\t\"moduleResolution\": \"bundler\"\n\t}\n}\n"
  },
  {
    "path": "svelte-maplibre-gl/vite.config.ts",
    "content": "import { sveltekit } from '@sveltejs/kit/vite';\nimport { defineConfig } from 'vite';\n\nexport default defineConfig({\n\tplugins: [sveltekit()]\n});\n"
  },
  {
    "path": "svelte.config.js",
    "content": "// mdsvex\nimport { mdsvex, escapeSvelte } from 'mdsvex';\nimport { createHighlighter } from 'shiki';\n\nconst theme = 'github-dark-default';\nconst highlighter = await createHighlighter({\n\tthemes: [theme],\n\tlangs: ['javascript', 'typescript', 'svelte', 'bash']\n});\n\n/** @type {import('mdsvex').MdsvexOptions} */\nconst mdsvexOptions = {\n\thighlight: {\n\t\thighlighter: async (code, lang = 'text') => {\n\t\t\tconst html = escapeSvelte(highlighter.codeToHtml(code, { lang, theme }));\n\t\t\treturn `{@html \\`${html}\\` }`;\n\t\t}\n\t},\n\textensions: ['.svelte.md', '.svx']\n};\n\n// SvelteKit\nimport adapter from '@sveltejs/adapter-cloudflare';\nimport { vitePreprocess } from '@sveltejs/vite-plugin-svelte';\n\n/** @type {import('@sveltejs/kit').Config} */\nconst config = {\n\t// Consult https://svelte.dev/docs/kit/integrations\n\t// for more information about preprocessors\n\tpreprocess: [vitePreprocess(), mdsvex(mdsvexOptions)],\n\n\tkit: {\n\t\t// adapter-auto only supports some environments, see https://svelte.dev/docs/kit/adapter-auto for a list.\n\t\t// If your environment is not supported, or you settled on a specific environment, switch out the adapter.\n\t\t// See https://svelte.dev/docs/kit/adapters for more information about adapters.\n\t\tadapter: adapter(),\n\t\talias: {\n\t\t\t$content: 'src/content',\n\t\t\t$svmlgl: 'svelte-maplibre-gl/src/lib',\n\t\t\t$svmlglext: 'extensions/'\n\t\t}\n\t},\n\n\textensions: ['.svelte', '.svx', '.svelte.md']\n};\n\nexport default config;\n"
  },
  {
    "path": "tailwind.config.ts",
    "content": "import defaultTheme from 'tailwindcss/defaultTheme';\nimport type { Config } from 'tailwindcss';\nimport tailwindcssAnimate from 'tailwindcss-animate';\nimport tailwindcssTypography from '@tailwindcss/typography';\n\nconst config: Config = {\n\tcontent: ['./src/**/*.{html,js,svelte,ts}'],\n\ttheme: {\n\t\tcontainer: {\n\t\t\tcenter: true,\n\t\t\tpadding: '2rem',\n\t\t\tscreens: {\n\t\t\t\t'2xl': '1400px'\n\t\t\t}\n\t\t},\n\t\textend: {\n\t\t\tcolors: {\n\t\t\t\tborder: 'hsl(var(--border) / <alpha-value>)',\n\t\t\t\tinput: 'hsl(var(--input) / <alpha-value>)',\n\t\t\t\tring: 'hsl(var(--ring) / <alpha-value>)',\n\t\t\t\tbackground: 'hsl(var(--background) / <alpha-value>)',\n\t\t\t\tforeground: 'hsl(var(--foreground) / <alpha-value>)',\n\t\t\t\tprimary: {\n\t\t\t\t\tDEFAULT: 'hsl(var(--primary) / <alpha-value>)',\n\t\t\t\t\tforeground: 'hsl(var(--primary-foreground) / <alpha-value>)'\n\t\t\t\t},\n\t\t\t\tsecondary: {\n\t\t\t\t\tDEFAULT: 'hsl(var(--secondary) / <alpha-value>)',\n\t\t\t\t\tforeground: 'hsl(var(--secondary-foreground) / <alpha-value>)'\n\t\t\t\t},\n\t\t\t\tdestructive: {\n\t\t\t\t\tDEFAULT: 'hsl(var(--destructive) / <alpha-value>)',\n\t\t\t\t\tforeground: 'hsl(var(--destructive-foreground) / <alpha-value>)'\n\t\t\t\t},\n\t\t\t\tmuted: {\n\t\t\t\t\tDEFAULT: 'hsl(var(--muted) / <alpha-value>)',\n\t\t\t\t\tforeground: 'hsl(var(--muted-foreground) / <alpha-value>)'\n\t\t\t\t},\n\t\t\t\taccent: {\n\t\t\t\t\tDEFAULT: 'hsl(var(--accent) / <alpha-value>)',\n\t\t\t\t\tforeground: 'hsl(var(--accent-foreground) / <alpha-value>)'\n\t\t\t\t},\n\t\t\t\tpopover: {\n\t\t\t\t\tDEFAULT: 'hsl(var(--popover) / <alpha-value>)',\n\t\t\t\t\tforeground: 'hsl(var(--popover-foreground) / <alpha-value>)'\n\t\t\t\t},\n\t\t\t\tcard: {\n\t\t\t\t\tDEFAULT: 'hsl(var(--card) / <alpha-value>)',\n\t\t\t\t\tforeground: 'hsl(var(--card-foreground) / <alpha-value>)'\n\t\t\t\t},\n\t\t\t\tsidebar: {\n\t\t\t\t\tDEFAULT: 'hsl(var(--sidebar-background))',\n\t\t\t\t\tforeground: 'hsl(var(--sidebar-foreground))',\n\t\t\t\t\tprimary: 'hsl(var(--sidebar-primary))',\n\t\t\t\t\t'primary-foreground': 'hsl(var(--sidebar-primary-foreground))',\n\t\t\t\t\taccent: 'hsl(var(--sidebar-accent))',\n\t\t\t\t\t'accent-foreground': 'hsl(var(--sidebar-accent-foreground))',\n\t\t\t\t\tborder: 'hsl(var(--sidebar-border))',\n\t\t\t\t\tring: 'hsl(var(--sidebar-ring))'\n\t\t\t\t}\n\t\t\t},\n\t\t\tborderRadius: {\n\t\t\t\txl: 'calc(var(--radius) + 4px)',\n\t\t\t\tlg: 'var(--radius)',\n\t\t\t\tmd: 'calc(var(--radius) - 2px)',\n\t\t\t\tsm: 'calc(var(--radius) - 4px)'\n\t\t\t},\n\t\t\tfontFamily: {\n\t\t\t\tsans: ['Geist', ...defaultTheme.fontFamily.sans],\n\t\t\t\tmono: ['Geist Mono', ...defaultTheme.fontFamily.mono]\n\t\t\t},\n\t\t\tkeyframes: {\n\t\t\t\t'accordion-down': {\n\t\t\t\t\tfrom: { height: '0' },\n\t\t\t\t\tto: { height: 'var(--radix-accordion-content-height)' }\n\t\t\t\t},\n\t\t\t\t'accordion-up': {\n\t\t\t\t\tfrom: { height: 'var(--radix-accordion-content-height)' },\n\t\t\t\t\tto: { height: '0' }\n\t\t\t\t},\n\t\t\t\t'caret-blink': {\n\t\t\t\t\t'0%,70%,100%': { opacity: '1' },\n\t\t\t\t\t'20%,50%': { opacity: '0' }\n\t\t\t\t}\n\t\t\t},\n\t\t\tanimation: {\n\t\t\t\t'accordion-down': 'accordion-down 0.2s ease-out',\n\t\t\t\t'accordion-up': 'accordion-up 0.2s ease-out',\n\t\t\t\t'caret-blink': 'caret-blink 1.25s ease-out infinite'\n\t\t\t}\n\t\t}\n\t},\n\tplugins: [tailwindcssTypography, tailwindcssAnimate]\n};\n\nexport default config;\n"
  },
  {
    "path": "tsconfig.json",
    "content": "{\n\t\"extends\": \"./.svelte-kit/tsconfig.json\",\n\t\"compilerOptions\": {\n\t\t\"allowJs\": true,\n\t\t\"checkJs\": true,\n\t\t\"esModuleInterop\": true,\n\t\t\"forceConsistentCasingInFileNames\": true,\n\t\t\"resolveJsonModule\": true,\n\t\t\"skipLibCheck\": true,\n\t\t\"sourceMap\": true,\n\t\t\"strict\": true,\n\t\t// \"module\": \"NodeNext\",\n\t\t\"moduleResolution\": \"bundler\"\n\t\t// \"types\": [\"vite-plugin-svelte-docgen\"]\n\t},\n\t\"exclude\": [\"node_modules\", \"dist\", \"**/dist\", \"extensions/*/dist\", \"svelte-maplibre-gl/dist\"]\n}\n"
  },
  {
    "path": "turbo.json",
    "content": "{\n\t\"$schema\": \"https://turbo.build/schema.json\",\n\t\"ui\": \"tui\",\n\t\"tasks\": {\n\t\t\"build\": {\n\t\t\t\"dependsOn\": [\"^build\"],\n\t\t\t\"outputs\": [\"dist/**\", \".svelte-kit/**\"],\n\t\t\t\"cache\": true\n\t\t},\n\t\t\"prepack\": {\n\t\t\t\"dependsOn\": [\"^prepack\"],\n\t\t\t\"outputs\": [\"dist/**\"],\n\t\t\t\"cache\": true\n\t\t},\n\t\t\"check\": {\n\t\t\t\"dependsOn\": [\"^build\", \"^check\"]\n\t\t},\n\t\t\"check:watch\": {},\n\t\t\"lint\": {},\n\t\t\"test\": {},\n\t\t\"test:e2e\": {},\n\t\t\"preview\": {}\n\t}\n}\n"
  },
  {
    "path": "vite.config.ts",
    "content": "import { sveltekit } from '@sveltejs/kit/vite';\nimport tailwindcss from '@tailwindcss/vite';\nimport { searchForWorkspaceRoot } from 'vite';\n// import svelteDocgenPlugin from 'vite-plugin-svelte-docgen';\nimport { defineConfig } from 'vitest/config';\n\nexport default defineConfig({\n\tplugins: [\n\t\t//svelteDocgenPlugin(),\n\t\ttailwindcss(),\n\t\tsveltekit()\n\t],\n\n\tserver: {\n\t\tfs: {\n\t\t\tallow: [searchForWorkspaceRoot(process.cwd())]\n\t\t}\n\t},\n\n\tresolve: {\n\t\talias: {\n\t\t\tpath: 'pathe'\n\t\t}\n\t},\n\n\ttest: {\n\t\tinclude: ['src/**/*.{test,spec}.{js,ts}']\n\t}\n});\n"
  },
  {
    "path": "wrangler.jsonc",
    "content": "{\n\t\"name\": \"svelte-maplibre-gl\",\n\t\"main\": \".svelte-kit/cloudflare/_worker.js\",\n\t\"compatibility_date\": \"2025-05-30\",\n\t\"assets\": {\n\t\t\"binding\": \"ASSETS\",\n\t\t\"directory\": \".svelte-kit/cloudflare\"\n\t}\n}\n"
  }
]