{"id":16791949,"url":"https://github.com/metonym/svelte-link","last_synced_at":"2025-03-17T03:30:39.001Z","repository":{"id":42045896,"uuid":"256215830","full_name":"metonym/svelte-link","owner":"metonym","description":"Link component for Svelte","archived":false,"fork":false,"pushed_at":"2024-08-14T03:52:27.000Z","size":377,"stargazers_count":10,"open_issues_count":0,"forks_count":1,"subscribers_count":3,"default_branch":"master","last_synced_at":"2024-10-20T12:18:55.748Z","etag":null,"topics":["link","noopener","noreferrer","svelte","svelte-component","typescript-definitions"],"latest_commit_sha":null,"homepage":"https://metonym.github.io/svelte-link/","language":"Svelte","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/metonym.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2020-04-16T12:59:33.000Z","updated_at":"2024-08-14T03:52:30.000Z","dependencies_parsed_at":"2024-08-13T21:17:45.189Z","dependency_job_id":null,"html_url":"https://github.com/metonym/svelte-link","commit_stats":{"total_commits":54,"total_committers":3,"mean_commits":18.0,"dds":"0.12962962962962965","last_synced_commit":"96621a04e9a26d3a8eeaec27897d3bb1c387700f"},"previous_names":[],"tags_count":11,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/metonym%2Fsvelte-link","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/metonym%2Fsvelte-link/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/metonym%2Fsvelte-link/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/metonym%2Fsvelte-link/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/metonym","download_url":"https://codeload.github.com/metonym/svelte-link/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":221671277,"owners_count":16861228,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["link","noopener","noreferrer","svelte","svelte-component","typescript-definitions"],"created_at":"2024-10-13T08:43:37.034Z","updated_at":"2024-10-27T11:50:55.490Z","avatar_url":"https://github.com/metonym.png","language":"Svelte","funding_links":[],"categories":[],"sub_categories":[],"readme":"# svelte-link\n\n[![NPM][npm]][npm-url]\n\n\u003c!-- REPO_URL --\u003e\n\n\u003e Anchor link component for Svelte.\n\n\u003c!-- TOC --\u003e\n\n## Installation\n\n```bash\n# npm\nnpm i -D svelte-link\n\n# pnpm\npnpm i -D svelte-link\n\n# Bun\nbun i -D svelte-link\n\n# Yarn\nyarn add -D svelte-link\n```\n\n## Usage\n\n### Basic\n\n```svelte\n\u003cscript\u003e\n  import Link from \"svelte-link\";\n\u003c/script\u003e\n\n\u003cLink href=\"https://github.com/\"\u003eGitHub\u003c/Link\u003e\n```\n\n### Preventing the default behavior\n\nBecause event modifiers cannot be used on Svelte components, use the mouse event in the forwarded `on:click` event to prevent the default behavior.\n\n```svelte\n\u003cLink\n  href=\"https://github.com/\"\n  on:click={(e) =\u003e {\n    e.preventDefault();\n  }}\n\u003e\n  GitHub\n\u003c/Link\u003e\n```\n\n### Outbound links\n\n`outbound` is an alias for setting `target=\"_blank\"`. If `rel` is not specified for outbound links, [`rel=\"noopener noreferrer\"` is set](https://developers.google.com/web/tools/lighthouse/audits/noopener).\n\n`outbound` defaults to `true` if `href` points to an external URL. You can override this behaviour by explicitly setting `outbound` to `false`.\n\n```svelte\n\u003cLink href=\"https://github.com/\" outbound\u003eGitHub\u003c/Link\u003e\n\n\u003c!-- same as --\u003e\n\n\u003cLink href=\"https://github.com/\" target=\"_blank\" rel=\"noopener noreferrer\"\u003e\n  GitHub\n\u003c/Link\u003e\n```\n\n### Prefetch\n\nInspired by [Sapper](https://sapper.svelte.dev/docs#prefetch_href), if the non-standard `rel=\"prefetch\"` is present, this component will make a GET request to the `href` value when the user hovers over the link.\n\n```svelte\n\u003cLink href=\"/about\" rel=\"prefetch\"\u003eAbout\u003c/Link\u003e\n```\n\n### Disabled state\n\nSetting `disabled` to `true` will render a `span` element instead of an anchor tag.\n\n```svelte\n\u003cLink disabled href=\"https://github.com/\"\u003eGitHub\u003c/Link\u003e\n\n\u003c!-- \u003cspan\u003eGitHub\u003c/span\u003e --\u003e\n```\n\n### Active state\n\nSet `active` to `true` to signal an active state.\n\nIf `true`, the anchor link is given an \"active\" class with the `aria-current` attribute set to \"page.\"\n\n```svelte no-eval\n\u003cscript\u003e\n  import { page } from \"$app/stores\";\n\u003c/script\u003e\n\n\u003cLink href=\"/\" active={$page.url.pathname === \"/\"}\u003eGitHub\u003c/Link\u003e\n\n\u003c!-- \u003ca href=\"/\" class=\"active\" aria-current=\"page\"\u003eGitHub\u003c/a\u003e --\u003e\n```\n\n## API\n\n### Props\n\n| Prop     | Type      | Default value           |\n| :------- | :-------- | :---------------------- |\n| href     | `string`  | `\"javascript:void(0);\"` |\n| disabled | `boolean` | `false`                 |\n| outbound | `boolean` | `undefined`             |\n| target   | `string`  | `undefined`             |\n| rel      | `string`  | `undefined`             |\n| active   | `boolean` | `false`                 |\n\n### Forwarded events\n\n- on:click\n- on:mouseover\n- on:mouseenter\n- on:mouseout\n- on:focus\n- on:blur\n- on:keydown\n\n## Changelog\n\n[Changelog](CHANGELOG.md)\n\n## License\n\n[MIT](LICENSE)\n\n[npm]: https://img.shields.io/npm/v/svelte-link?style=for-the-badge\u0026color=%23ff3e00\n[npm-url]: https://npmjs.com/package/svelte-link\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmetonym%2Fsvelte-link","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmetonym%2Fsvelte-link","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmetonym%2Fsvelte-link/lists"}