{"_id":"@cagov/ds-link-icon","_rev":"13-bd32f3c76682e76453c372496362af26","name":"@cagov/ds-link-icon","dist-tags":{"beta":"1.1.0-beta","latest":"2.0.1"},"versions":{"1.0.0":{"name":"@cagov/ds-link-icon","version":"1.0.0","keywords":[],"author":"","license":"ISC","_id":"@cagov/ds-link-icon@1.0.0","maintainers":[{"name":"zakiyak","email":"zakiya.khabir@digital.ca.gov"},{"name":"timothyshambra","email":"timothy.shambra@gmail.com"},{"name":"xjensen","email":"github@id.xjensen.com"},{"name":"carter.medlin","email":"carter.medlin@gmail.com"},{"name":"aaronhans","email":"aaronhans@gmail.com"},{"name":"chacha-california","email":"chach.sikes@digital.ca.gov"},{"name":"kkoryaka","email":"konstantin.koryaka@state.ca.gov"}],"dist":{"shasum":"fa19e6a99f79afd9c6883ec3932353c1c7023082","tarball":"https://registry.npmjs.org/@cagov/ds-link-icon/-/ds-link-icon-1.0.0.tgz","fileCount":10,"integrity":"sha512-FSYbQ7uj93ZHDTK3/ufGDouJigGmIkyj62GAFvnPm+BKnfGy4oePjXG6r1/m+cqK/147ps/8r+Y278poBSuWTA==","signatures":[{"sig":"MEUCIBzuhPtLaW4PM21MkPrHx635IKKuFGu3JSsXGfk/UEGsAiEAtrzwKzWoNIULIjFbAmu8RVR6cm4ZvTT1nAtC9q+LdHY=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":56835,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhrkg/CRA9TVsSAnZWagAA2UsP/31NWWjZJ59jZtgJwC0F\n/ROaJqJl3hRo47/KKeTCxAjvX+Q4xO54lo1fcfuTaOYYc5IXHz69ZehQMrb8\n9H29KQbw+PvJjSiXI/egR5Grd3Ntn9O4/ZFVUnQtaIIREu9LlmvHIisZbeEo\nUe3N8iz1TuNzSOvslvhFC0+xq5J+RMW48INsRKyRuGMwGeECfzwDJI5w9Bha\nJZ4Q+tpBFiqkkArvicxvCHNQAVKEKwF+s28vyP8OdnY23fff92WPTP5mTyhp\nta9UG3mIz6RDeAWISt9z7/zvEq2hLLWUyknI5ZiztfL3SWEqFvpL4SV9osZg\nIRNWkYLvC8Ei4q8MYH3uq52SreRjBNef9+HbnH+MVVUagrmwuKBHq3Awufiv\nb+fUD/kp1vcsH+NU2d4aOJD35BqLkS4QQhgsYsDK4KpcQVy/Gg6aK3Iqbcpz\noIQMkdh9jKc/mUseqfhQPjvvI84pYJxwWGYCGGKZN08X1Ohi3E5X7Fhm2lx5\nTlSLXBygDTX2oxj/zxgzChsWObFZpg9++9e1DWpC6SG4ZYfMocCMINQtJKHJ\nzx1f5Izr10IPQJeoB4BgtZyZMDQk9MqLicc5efQbIhd3028Q6p0+uqKf7SMn\n199m1ybfMdwacb+UkFfViiHDdC9DrmhYUSq/YDupi7agmISudDZmOHOvCYKK\nz+Vz\r\n=rtjd\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.css","scripts":{"test":"web-test-runner \"test/**/*.js\" --node-resolve","build":"sass src/index.scss index.css","test:visual":"web-test-runner \"test/**/*.js\" --node-resolve --config test-config.js"},"_npmUser":{"name":"kkoryaka","email":"konstantin.koryaka@state.ca.gov"},"repository":{"url":"https://github.com/cagov/design-system/components/link-icon/","type":"git"},"_npmVersion":"7.21.0","description":"- PDF icon: The pdf icon is the letters PDF surrounded by a box outline. It indicates that the link opens a PDF. PDF link should not appear in combination with any other link icon. - External link: this component can also add an external-link icon next to","directories":{},"_nodeVersion":"14.16.1","_hasShrinkwrap":false,"devDependencies":{"sass":"^1.38.1","@open-wc/testing":"^3.0.0-next.2","@web/test-runner-puppeteer":"^0.10.1"},"_npmOperationalInternal":{"tmp":"tmp/ds-link-icon_1.0.0_1638811710997_0.11452474459482054","host":"s3://npm-registry-packages"}},"1.1.0-beta":{"name":"@cagov/ds-link-icon","version":"1.1.0-beta","keywords":[],"author":"","license":"ISC","_id":"@cagov/ds-link-icon@1.1.0-beta","maintainers":[{"name":"zakiyak","email":"zakiya.khabir@digital.ca.gov"},{"name":"timothyshambra","email":"timothy.shambra@gmail.com"},{"name":"xjensen","email":"github@id.xjensen.com"},{"name":"carter.medlin","email":"carter.medlin@gmail.com"},{"name":"aaronhans","email":"aaronhans@gmail.com"},{"name":"chacha-california","email":"chach.sikes@digital.ca.gov"},{"name":"kkoryaka","email":"konstantin.koryaka@state.ca.gov"}],"dist":{"shasum":"f93c294bff2e2737a096942652bfd79dcfc77f93","tarball":"https://registry.npmjs.org/@cagov/ds-link-icon/-/ds-link-icon-1.1.0-beta.tgz","fileCount":12,"integrity":"sha512-fqWZUzELeed7Fkt+N0ysRkFUun+xALy0qUf3IOTiLEE16/3+xIcjxVReyE0W6I/bbn2lhCgXGFAL16XAa8tEhQ==","signatures":[{"sig":"MEUCIEtFVR4WdGEXGdt+xIW5ga9s4oWgHod+jZqM9QsmnqJyAiEA0a7exuGA3ACM7X/3sKntEz9E179dlxGRzmAtRnOZ/WM=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":61076,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh+wm3CRA9TVsSAnZWagAA5zkP/1DoyiIfoXjfwy6qXAVS\nGvDOZBc19OGwTqqvS3k2CeXKQnC3mJzAtHCf2HsYRz6Icv0M6uNVRJn09wfv\nwu6YBXz21cptYuVo4s+Le1LHJLgdsAWHe5pO1Lu4SRNBBrABH8x233e75zZJ\neuDZVMHtnhTNPR0dgJnMfoN8XKMyhFfJecfhE7BbkOS0XTe7ppw+igazPbWW\nNdKuyvq9aPND1eVvkigagMsdnM2C08q7tcUZto0m//7mU3BQ97iTMAgOzA/X\nDt0F374S8x/U0uk/ULcS4bzUgqajI413pdAK2AcsCG5kW+oKCWWmipLnKsid\nNecxRKsw2yytQx6WAKI4l3sbgeQ3SGf7sDn1mrAf9VyelLaTePdN/0+xn8QY\n5NWrfZudhqzvMlyc+fgl21lLF2Tb58qmpVIcY9ErA4MfKZfvaVMkKidRzy0v\nYZxLCW226WcvG2AIvf9z71Mpovzi1p3TcQrq5vYoNLqU4ehQsZJvZ6l7QboF\nRUx4Q+RZNO+UvHu+L3aLamYfnZLIdXl2DcGppqwjR+Q04fW73fbCjjpEd5XF\n5o6nU7Me4aoMNxARXGDaNjqG+j8MGDydsOw87QYy/dXSfcTU98NsYrMQ1LeY\n0bWGNFlyah9KtM9dXYT8M8pj1bG+NSBxhF2belZl2H3ewhFBRkjL95ZGNGCv\n9e6f\r\n=dL8e\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.css","readme":"# Link icon\n\nThe link icon adds an icon next to links that go:\n\n- Outside your website (an external link)\n- To a PDF\n\nThe external link icon is a box with an arrow pointing to the upper-right corner.\n\nThe PDF icon is the letters _PDF_ surrounded by a box outline.\n\nThese icons tell people they are leaving the current website in some way.\n\nIn the case of PDF links, this can be important for people on mobile devices. They may not want to open a PDF for various reasons (use up their data, do not want to download a file, etc.). It’s also important for those who use screen readers, as it will announce, “This is a PDF file.”\n\nIf a link is both external and a PDF, only the PDF icon will appear. It’s more important to tell people they’re going to a PDF than it is to tell them that it’s not hosted on the same site.\n\n## When and how to use it\n\nThis is a required component when using the Design System. Use it whenever you implement the Design System as it addresses some accessibility issues.\n\nOnce an engineer has installed this feature, content creators do not need to take separate action to apply either link icon.\n\n### How not to use it\n\nDo not modify the link icon when you install it.\n\n## Demo and sample markup\n\n<html-preview>\n\n```html preview\n<a href=\"http://www.parks.ca.gov/pages/23071/files/calargemap2012.pdf\">PDF link to California State Parks map</a>\n<a href=\"https://google.com\">External link to Google</a>\n```\n\n</html-preview>\n\n## Specs\n\n| Property     | Value            |\n| ------------ | ---------------- |\n| Machine name | ds-link-icon     |\n| JavaScript   | yes              |\n| SCSS         | ./src/index.scss |\n\n## Project installation\n\nThe instructions assume familiarity with [npm](https://npmjs.com) package management tool, modern JavaScript techniques, and [Sass](https://sass-lang.com/).\n\n1. `npm i @cagov/ds-link-icon`\n2. Use `import`[¹](/footnotes/#footnote1) or `require` to include the component’s **JavaScript** in your page or compiler.\n3. Include **SCSS** in your Sass compiler.\n4. Add the **sample markup** to your HTML.\n5. Refer to the [Content model section](#content-model) for notes on mapping your data to the **sample markup**.\n6. Note that the `<a>` tags must be inside the `<main>` tag and external link to icons are required.\n\n### Other dependencies\n\nThis component uses icons from the [CAGov font library](https://template.webstandards.ca.gov/sample/icon-fonts.html). Include the font library in your project to ensure the icons appear.\n\n## CSS variables\n\nThe following [CSS variables](https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_custom_properties) are used in this component:\n\n- `--primary-color`\n- `--primary-dark-color`\n\nAll CSS variables define their own fallback value so you do not have to use additional CSS unless you want to change them. You may define your own value for the variable by adding your own style rules. Here is an example defining the global hex value for a CSS variable named “--primary-color”:\n\n```css\n:root {\n  --primary-color: #064e66;\n}\n```\n\n## CSS exceptions\n\nThere are cases when external link icon is not needed or messing the existing design. Here are the cases when external link icon is disabled:\n\n```scss\n.cagov-card, // card-grid component links\n.wp-block-button__link, // buttons inside of design system hero banner\n.footer-social-links a, // social icons links\nimg ~, // links that are using images\nsvg ~, // links that are using SVG icons\n.pdf-link-icon ~ // links to PDF files\n```\n\n## Accessibility\n\n### Component-specific accessibility review\n\n- Make sure that link icon span has `aria-hidden=\"true”` attribute.\n\n### Standard accessibility review\n\nAs a component in Alpha status, this component must pass the following accessibility reviews every time a new version is published:\n\n- Tested with the `[axe](https://www.deque.com/axe/)` accessibility tool and passes all automated [WCAG](https://www.w3.org/TR/WCAG21/) Level AA checks\n- Reviewed with the [VoiceOver](https://www.apple.com/voiceover/info/guide/_1121.html) screen reader on desktop\n- Verified keyboard navigation and that all actionable elements of the component are reachable via keyboard commands only\n- Reviewed component layout on a variety of screen sizes\n\n## Progressive enhancement\n\nThis component uses a [custom element](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_custom_elements) defined in JavaScript in addition to HTML and CSS. Edge, Firefox, Safari, and Chrome support custom elements. If the JavaScript for this component is not delivered or supported, the component will not display. This is the desired behavior because this component is not critical for site interaction. It uses [CSS variables](<https://developer.mozilla.org/en-US/docs/Web/CSS/var()#syntax>) to inherit design token values. Token definitions are not required because these style rules provide fallback values.\n\n<a name=\"content-model\"></a>\n\n## Content model\n\nRequires a `main` tag and activates on `a` tags. Automatically detects links and appends necessary icons to them.\n","gitHead":"5e6356f06ab923f129a5b650d5d19a8594954069","scripts":{"test":"web-test-runner \"test/**/*.js\" --node-resolve","build":"sass src/index.scss index.css","cdn:publish":"node ../../docs/src/publish/cdn-deploy.js","html:preview":"node ../../docs/src/publish/dynamic-html.js","prepublishOnly":"npm run html:preview && npm run build && npm test && npm run cdn:publish"},"_npmUser":{"name":"xjensen","email":"github@id.xjensen.com"},"repository":{"url":"https://github.com/cagov/design-system/components/link-icon/","type":"git"},"_npmVersion":"7.22.0","description":"The link icon adds an icon next to links that go:","directories":{},"_nodeVersion":"14.17.6","_hasShrinkwrap":false,"readmeFilename":"readme.md","devDependencies":{"sass":"^1.38.1","@open-wc/testing":"^3.0.0-next.2","@web/test-runner-puppeteer":"^0.10.1"},"_npmOperationalInternal":{"tmp":"tmp/ds-link-icon_1.1.0-beta_1643841974798_0.9775554961042894","host":"s3://npm-registry-packages"}},"1.1.0":{"name":"@cagov/ds-link-icon","version":"1.1.0","keywords":[],"author":"","license":"ISC","_id":"@cagov/ds-link-icon@1.1.0","maintainers":[{"name":"zakiyak","email":"zakiya.khabir@digital.ca.gov"},{"name":"timothyshambra","email":"timothy.shambra@gmail.com"},{"name":"xjensen","email":"github@id.xjensen.com"},{"name":"carter.medlin","email":"carter.medlin@gmail.com"},{"name":"aaronhans","email":"aaronhans@gmail.com"},{"name":"chacha-california","email":"chach.sikes@digital.ca.gov"},{"name":"kkoryaka","email":"konstantin.koryaka@state.ca.gov"}],"dist":{"shasum":"6ef9c9c9feca2364664803a2215551823f2c2423","tarball":"https://registry.npmjs.org/@cagov/ds-link-icon/-/ds-link-icon-1.1.0.tgz","fileCount":12,"integrity":"sha512-YXgFebP5ZckjcwPo9YJzpwiF4YGxsolj4Of9ek1yolwKna4C7GvoBnV8UABa/ktOEW5NKHuVDCK/vDDhOBYyvQ==","signatures":[{"sig":"MEUCICaC5AmNaoUFe92DPKZWuY7f73on3H6aEsLL2nDNcMZYAiEAi4+vbdO0nWBK4jhmuqZzxAEYEHxVoDyQw0OQidnaz7w=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":61071,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh/EGACRA9TVsSAnZWagAA+v4P/AqkWyDfmahAZxRX0tN+\nGdi+84Y7tbEv6FdCAAg/ZDvhp9w7G7ARMdd+RgRd/1r/fR7tOSJVFxgdF+gf\ndnTsHaoU3EmUBQlrkDJXmxqro3yEIHQqfxB3KBasw22JPqiRojJ5O/peogC3\nlqMvWR1EeBPl59DYIltdmz+nJ4jHfeKo+g+/jjs0ARc+ppKEqfLIIw7xQqIG\nr5qtN30YMlLiHQrw74zRWIL9un0OY6fWwi5T3GQ2AHY8EK5g64HQVtBTfUjZ\nGQ/LinRZscstW3v1vLyAsAPrz9gd/TQQhsEKjdO7GMwkx6DFSjl3+2ZMroGM\n5CPqzbZbl0jeJYAXxe9BvdYg/oR3liFVTui67ZPY1D0cpBVLgF7aCp67/Rbm\nXFz+vZJ/a/a2ojRWiyweQ7s8faPZRc6O1lMWWBbEJEZB77LO4ns3iMXPRll5\npDoStpG8YUrKwj/ukf/cxyjPXxhGGPiQ7F8cM8erkp2RZms7GKFpnjBTMD1j\n7xjME2CxE1MhgDgRGZ0pLDgdpfsFoyKKIaZoQcw4fXY7wYJiC1R/q8+5gI1H\nV6TtCMcfHL8NX07YHeRh547vK6lAhznzJpTnrXavWbgd/5qT/KuxHnp51s3B\nOrzL22dfQ9a0mo/M+umV4g+BS6Q6Jdb5WOJSJ+6FiYBiaUzLhCr6+RUp/xNY\nMChl\r\n=AnUG\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.css","gitHead":"443bbddb455d0cb362a140369ef463b7cd753725","scripts":{"test":"web-test-runner \"test/**/*.js\" --node-resolve","build":"sass src/index.scss index.css","cdn:publish":"node ../../docs/src/publish/cdn-deploy.js","html:preview":"node ../../docs/src/publish/dynamic-html.js","prepublishOnly":"npm run html:preview && npm run build && npm test && npm run cdn:publish"},"_npmUser":{"name":"xjensen","email":"github@id.xjensen.com"},"repository":{"url":"https://github.com/cagov/design-system/components/link-icon/","type":"git"},"_npmVersion":"7.22.0","description":"The link icon adds an icon next to links that go:","directories":{},"_nodeVersion":"14.17.6","_hasShrinkwrap":false,"devDependencies":{"sass":"^1.38.1","@open-wc/testing":"^3.0.0-next.2","@web/test-runner-puppeteer":"^0.10.1"},"_npmOperationalInternal":{"tmp":"tmp/ds-link-icon_1.1.0_1643921791883_0.8636682171070602","host":"s3://npm-registry-packages"}},"1.1.1":{"name":"@cagov/ds-link-icon","version":"1.1.1","keywords":[],"author":"","license":"ISC","_id":"@cagov/ds-link-icon@1.1.1","maintainers":[{"name":"zakiyak","email":"zakiya.khabir@digital.ca.gov"},{"name":"timothyshambra","email":"timothy.shambra@gmail.com"},{"name":"xjensen","email":"github@id.xjensen.com"},{"name":"carter.medlin","email":"carter.medlin@gmail.com"},{"name":"aaronhans","email":"aaronhans@gmail.com"},{"name":"chacha-california","email":"chach.sikes@digital.ca.gov"},{"name":"kkoryaka","email":"konstantin.koryaka@state.ca.gov"}],"dist":{"shasum":"69d9497c856a35816aab38ac7b401c4749b28fe8","tarball":"https://registry.npmjs.org/@cagov/ds-link-icon/-/ds-link-icon-1.1.1.tgz","fileCount":12,"integrity":"sha512-pvos/iwGqUJBLQZPFn5rO8w0GZt5Im+NsBrbF74RyUGnSexFx4Oq3iZFznepOhDlVGOFaWUTPdF9kHLrOpSH2w==","signatures":[{"sig":"MEYCIQCVl2/LcgTxvICEInKLejW+t8tOcFV7vZoqritI1pgMnQIhAIMopAQW7g2p78saq6mbrZJ9QUfG4dX6lg6lXgEcFnvG","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":61187,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJiBCWuCRA9TVsSAnZWagAAYtEP/RlC+BHbVENSxuSDp32w\nn0fIOnATpoyrotQJ6vQJkvOugCFj1f04eKPHRGPl/YAJ0Y5KV6CsUiEy1gj3\nYIo94R06RD0pgJ4+qUa7d+Hnb0Vd1SZQn/e6dWMEyq6uLGvZ/4tdyZ1hH/qv\nSaDytIBEf5L04Ikdp1hHkxjMW+75tOuWaqtS705tPAILOHzLAx1NPdH8Bq19\n0IbW/v4U8wJky8sI9hWK31Wb76yI1NzW6v82FwngA20KoeYST28VcJU2VQYS\nk63AZcBo6iq4yqLZYbCFXMw6h4vKB7KakR/BPAf1BXgdHzxRYJX+pPX+r8IH\ncOXgbSdJe2lkVbYdO3L6k+IZ9kKMpBn3w3Iozl2z9fhMFQdAyr4oduVnzbBc\njmoZCJbFySsXJ+VnOChprP/h1lGjeFA+35Mbwf2vXdCceCastH24/qPviO8t\nyOaMYDiW9dGCggLqw04j8R8PfKh5a2FKGMth4aLr8d5GVJ8BnyH+gSwivJQr\nN0zvDJiLJj3tcgQd+CwsBPFSWlb9ukyqXn6+CxtcIcpwjmzrWJF+mRWaEaE+\nv0tKgadphpjiQ9EpTOp1ekh71FfOhJKwSba9VEthL1jCrKBpsygOI6Wz1+RK\n2nFFJQ0HACxb/kJzZGkqvfSZO/91mXfuMOWZ+Yoh7fWMrVl7ZmqNl3lrBvHW\nvLur\r\n=cgU5\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.css","gitHead":"3a2307cc2c58a9c7d453de348b44cb23a6ce77f0","scripts":{"test":"web-test-runner \"test/**/*.js\" --node-resolve","build":"sass src/index.scss index.css","cdn:publish":"node ../../docs/src/publish/cdn-deploy.js","html:preview":"node ../../docs/src/publish/dynamic-html.js","prepublishOnly":"npm run html:preview && npm run build && npm test && npm run cdn:publish"},"_npmUser":{"name":"aaronhans","email":"aaronhans@gmail.com"},"repository":{"url":"https://github.com/cagov/design-system/components/link-icon/","type":"git"},"_npmVersion":"8.1.2","description":"The link icon adds an icon next to links that go:","directories":{},"_nodeVersion":"16.13.1","_hasShrinkwrap":false,"devDependencies":{"sass":"^1.38.1","@open-wc/testing":"^3.0.0-next.2","@web/test-runner-puppeteer":"^0.10.1"},"_npmOperationalInternal":{"tmp":"tmp/ds-link-icon_1.1.1_1644438958152_0.018117950906480385","host":"s3://npm-registry-packages"}},"1.1.2":{"name":"@cagov/ds-link-icon","version":"1.1.2","keywords":[],"author":"","license":"ISC","_id":"@cagov/ds-link-icon@1.1.2","maintainers":[{"name":"zakiyak","email":"zakiya.khabir@digital.ca.gov"},{"name":"timothyshambra","email":"timothy.shambra@gmail.com"},{"name":"xjensen","email":"github@id.xjensen.com"},{"name":"carter.medlin","email":"carter.medlin@gmail.com"},{"name":"aaronhans","email":"aaronhans@gmail.com"},{"name":"chacha-california","email":"chach.sikes@digital.ca.gov"},{"name":"kkoryaka","email":"konstantin.koryaka@state.ca.gov"}],"dist":{"shasum":"7a560e00c62ddea02efb30a49d6e3d7459fa30bd","tarball":"https://registry.npmjs.org/@cagov/ds-link-icon/-/ds-link-icon-1.1.2.tgz","fileCount":10,"integrity":"sha512-7EdibWYhcgPEbmRgH4qVvnM1KMVdwPDy03ecyTcxJTmXqCRKQ1WYQ+Y0hO06/DRoUkuJv0x82rM6GaenQ65Wig==","signatures":[{"sig":"MEUCIQDKgVhK6QxW9apueGNV1vucltLVjeJt1vHpRIlVJgX84AIgb+QEa5idacUCPloB4SyyvkUf5FnNKHk6qnG1JOfWtow=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":59917,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJidY8aACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmpv+BAAodUP0L/RJjuTce5piFl9N+8oO2jSLdE5+cCym0nSTiquTZc+\r\n9XuJiM8iHIGEYEqz42Pc1BiDLGJ7YC02Nes2AHa8tdMfUoQJAuOXIUI41BFG\r\nivcLS8Z3kCeosn5Oh+/OnA0GsypuAxX8u9ISPiNi9ND0YL0ZZgYOjkasg1ZH\r\nC71gICIFTqARSvo7i6XtauY6Ga3iiRLOq9vFg6lTXYzc83ZaDuHYiA163Fpm\r\nOeTwgLKCKumWAqepMb8Bho8nwBBbXwMsYbZiYjsnciNwHGcXhxT/hrH6VBew\r\naqJQp2WzMS97qLhdmR07Hgzt9F4lMXu3a1KoelXsRDaFEOten7uLFWY3AEPB\r\nap/diaBUKofPC9l4lhGgQHUzDokm67sWiKz+r5Hi7b98sUTN01ZyDsdrk0ug\r\n3aMmcgGseTRH3IRoV2SDOR5ymxAoDxWzOOGMnkoJZt3BR9+FKhTkBGoSnBzH\r\n36cSGRGkUv3WxiqFkTYrm+Z/NwaiJFE7i0yLJC3Qk6/XXNIfRwTrMCk41sVa\r\ngatwvRVcl9M8yz2ZZGuxE9fBVgZaAxh6s/hylxUFudw+VjhvmLyS99G1FSds\r\nWeh4jpi7vYS9eHdP4PMVfTdHi4iWMKJcpk8YM+7Rc8M6DHczh94kU59B14d8\r\nmkYc2kHz9TP9rgYBC7aINxgtiUOLG3c3OrY=\r\n=x+vy\r\n-----END PGP SIGNATURE-----\r\n"},"main":"index.css","gitHead":"752dd8ff70eafb2f15ff41d565859d5e1969ca6e","scripts":{"test":"web-test-runner \"test/**/*.js\" --node-resolve","build":"sass src/index.scss index.css","cdn:publish":"node ../../docs/src/publish/cdn-deploy.js","html:preview":"node ../../docs/src/publish/dynamic-html.js","prepublishOnly":"npm run html:preview && npm run build && npm test && npm run cdn:publish"},"_npmUser":{"name":"xjensen","email":"github@id.xjensen.com"},"repository":{"url":"https://github.com/cagov/design-system/components/link-icon/","type":"git"},"_npmVersion":"7.22.0","description":"The link icon adds an icon next to links that go:","directories":{},"_nodeVersion":"14.17.6","_hasShrinkwrap":false,"devDependencies":{"sass":"^1.38.1","@open-wc/testing":"^3.0.0-next.2","@web/test-runner-puppeteer":"^0.10.1"},"_npmOperationalInternal":{"tmp":"tmp/ds-link-icon_1.1.2_1651871513821_0.9886419769767854","host":"s3://npm-registry-packages"}},"2.0.0":{"name":"@cagov/ds-link-icon","version":"2.0.0","keywords":[],"author":"","license":"ISC","_id":"@cagov/ds-link-icon@2.0.0","maintainers":[{"name":"zakiyak","email":"zakiya.khabir@digital.ca.gov"},{"name":"timothyshambra","email":"timothy.shambra@gmail.com"},{"name":"xjensen","email":"github@id.xjensen.com"},{"name":"carter.medlin","email":"carter.medlin@gmail.com"},{"name":"aaronhans","email":"aaronhans@gmail.com"},{"name":"chacha-california","email":"chach.sikes@digital.ca.gov"},{"name":"kkoryaka","email":"konstantin.koryaka@state.ca.gov"}],"dist":{"shasum":"9a83e26fbc11ddb19a3e8206559c4f51090d3bd8","tarball":"https://registry.npmjs.org/@cagov/ds-link-icon/-/ds-link-icon-2.0.0.tgz","fileCount":12,"integrity":"sha512-ntxHlVgVBwsyfcaJ5d9LU7ZyO4WYT4HJvdCBJY1LrAG+z3vS/zItLiJzv+SBHalAGlv8HK2904+hwAnHffcY0Q==","signatures":[{"sig":"MEQCIEbb7d0/wTd7a3ZpClNXUmNINQgNClYhU6FkfpCfv5/cAiBUYv3wvbmQ3rIct5FncLY+KqTyOAYrdBysWFaQ+Md/Ow==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":66251,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJi8VtrACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqYXQ//SdlWn7EghX4Z+w9m17i0yWbgqKI9Q9w9fsFK8jTc+fUMY7q+\r\nFEyqkFvtOPZfNUSPitVtqMfQETr34LKU5DLPNyzEPH5zKvgGw4PoXM4FJ2I4\r\n3vhAKJt4oXtUEuB7lsg4QChK7hbUffq+wO+U0z4PeAOUHxjytifEBo8jgqGq\r\nZMKW+l3J9YUx9GoLlnM605oNtsOW8wRyKwd9/rpJfBZif0481qAp6QQEbgwj\r\nt47TBQHRMwchoqXJPsA8Idw3yr1wSIWSfQbwxkwePEn9vsjIDH45qyR9J/3T\r\nnjNdpd7uzxs0KDo6tT6ushufbu/jXBN8AKjXdD9x35SXm8LABXvaL/CHj5mv\r\nVo4yLSbRSr/GzteoaDI7UFCRHxI+ZFOtl0mn1P/SdIM5JcR51705G+IDmfPW\r\nwBsxtfqpAw6Lvij5bTdReDuzRUItWEEN0ccbfOZXwcWW+xR9SbpvC5GsblCm\r\nW65WWlZmM6gvPubp6XHiX5elToBpbtMweBa+MJBUwPUITsOgUJvuIriMg3ro\r\nOqx+jObhJRvNlyvubt0ZM+QqxHaXTB0Wg+cBSs0iHpAnJ61La/MviB9ByU+c\r\n2YnXIdrirFIaox00G5oJR6kRj2ZtyEXtg4jr+wIuYiVwf0WrBkh2odMt6bWd\r\n3NVjlDDT/7TXvMpcyiM+3Rwmg80V6k/J7Hs=\r\n=7IfF\r\n-----END PGP SIGNATURE-----\r\n"},"main":"dist/index.js","gitHead":"b320f54017ebc331c69128312c6c8cb3a4ad7a51","scripts":{"test":"web-test-runner \"test/**/*.js\" --node-resolve","build":"sass src/index.scss src/css/index.css && npm run build:js","build:js":"rollup --config rollup.config.js","cdn:publish":"node ../../docs/src/publish/cdn-deploy.js","html:preview":"node ../../docs/src/publish/dynamic-html.js","prepublishOnly":"npm run html:preview && npm run build && npm test && npm run cdn:publish"},"_npmUser":{"name":"xjensen","email":"github@id.xjensen.com"},"repository":{"url":"https://github.com/cagov/design-system/components/link-icon/","type":"git"},"_npmVersion":"8.11.0","description":"The link icon adds an icon next to links that go:","directories":{},"_nodeVersion":"16.16.0","_hasShrinkwrap":false,"devDependencies":{"sass":"^1.38.1","rollup":"^2.77.2","@open-wc/testing":"^3.0.0-next.2","rollup-plugin-import-css":"^3.0.3","@web/test-runner-puppeteer":"^0.10.1"},"_npmOperationalInternal":{"tmp":"tmp/ds-link-icon_2.0.0_1659984747100_0.5701288361925896","host":"s3://npm-registry-packages"}},"2.0.1":{"name":"@cagov/ds-link-icon","version":"2.0.1","keywords":[],"author":"","license":"ISC","_id":"@cagov/ds-link-icon@2.0.1","maintainers":[{"name":"jbum","email":"jbum@jbum.com"},{"name":"zakiyak","email":"zakiya@innovation.ca.gov"},{"name":"timothyshambra","email":"timothy.shambra@gmail.com"},{"name":"xjensen","email":"github@id.xjensen.com"},{"name":"aaronhans","email":"aaronhans@gmail.com"},{"name":"chacha-california","email":"chach.sikes@innovation.ca.gov"},{"name":"kkoryaka","email":"konstantin.koryaka@state.ca.gov"}],"dist":{"shasum":"d8ee05efeda3da5437f7fe0bd81ddb6abe27684f","tarball":"https://registry.npmjs.org/@cagov/ds-link-icon/-/ds-link-icon-2.0.1.tgz","fileCount":12,"integrity":"sha512-u7WLc9WQouxJ4j8NVChyUO9YREPrNJZOH1HiK2xPYoXxCRTUfKt3Ck+gmsDB34TVnhbyANxAnBCc5IUyZUoGMA==","signatures":[{"sig":"MEUCIA8toG+RXPeg/K72XLFWRPsuor7yzJ4N+5Ig6n7MZ/zFAiEAgPmi3Yib9rzU95fOcwsZJcIWdoHSIARvbB6bMEwfGjg=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":66254},"main":"dist/index.js","gitHead":"479f1353fed9d262e3d33cd8fbaad72a8c7f3da3","scripts":{"test":"web-test-runner \"test/**/*.js\" --node-resolve","build":"sass src/index.scss src/css/index.css && npm run build:js","build:js":"rollup --config rollup.config.js","cdn:publish":"node ../../docs/src/publish/cdn-deploy.js","html:preview":"node ../../docs/src/publish/dynamic-html.js","prepublishOnly":"npm run html:preview && npm run build && npm test && npm run cdn:publish"},"_npmUser":{"name":"xjensen","email":"github@id.xjensen.com"},"repository":{"url":"https://github.com/cagov/design-system/components/link-icon/","type":"git"},"_npmVersion":"10.2.4","description":"The link icon adds an icon next to links that go:","directories":{},"_nodeVersion":"21.6.2","_hasShrinkwrap":false,"devDependencies":{"sass":"^1.38.1","rollup":"^2.77.2","@open-wc/testing":"^3.0.0-next.2","rollup-plugin-import-css":"^3.0.3","@web/test-runner-puppeteer":"^0.10.1"},"_npmOperationalInternal":{"tmp":"tmp/ds-link-icon_2.0.1_1709242337842_0.6423751810518252","host":"s3://npm-registry-packages"}}},"time":{"created":"2021-12-06T17:28:30.958Z","modified":"2026-04-01T19:49:57.825Z","1.0.0":"2021-12-06T17:28:31.172Z","1.1.0-beta":"2022-02-02T22:46:15.026Z","1.1.0":"2022-02-03T20:56:32.192Z","1.1.1":"2022-02-09T20:35:58.348Z","1.1.2":"2022-05-06T21:11:54.004Z","2.0.0":"2022-08-08T18:52:27.316Z","2.0.1":"2024-02-29T21:32:18.001Z"},"license":"ISC","keywords":[],"repository":{"url":"https://github.com/cagov/design-system/components/link-icon/","type":"git"},"description":"The link icon adds an icon next to links that go:","maintainers":[{"email":"github@id.xjensen.com","name":"xjensen"},{"email":"jbum@jbum.com","name":"jbum"},{"email":"chach.sikes@innovation.ca.gov","name":"chacha-california"},{"email":"zakiya@innovation.ca.gov","name":"zakiyak"}],"readme":"# Link icon\n\nThe link icon adds an icon next to links that go:\n\n- Outside your website (an external link)\n- To a PDF\n\nThe external link icon is a box with an arrow pointing to the upper-right corner. For people using a screen reader, it will announce the full URL.\n\nThe PDF icon is the letters _PDF_ surrounded by a box outline. For people using a screen reader, it will announce that the link is a PDF file. \n\nThese icons tell people they are leaving the current website in some way.\n\nKnowing that a link goes a PDF lets people decide if they want to open it. This may be helpful to people using mobile devices with limited data plans.\n\nIf a link is both external and a PDF, only the PDF icon will appear. It’s more important to tell people they’re going to a PDF than it is to tell them that it’s not hosted on the same site.\n\n## When and how to use it\n\nThis is a required component when using the Design System. Use it whenever you implement the Design System as it addresses some accessibility issues.\n\nOnce an engineer has installed this feature, content creators do not need to take separate action to apply either link icon.\n\n### How not to use it\n\nDo not modify the link icon when you install it.\n\n## Demo and sample markup\n\n<html-preview>\n\n```html preview\n<a href=\"http://www.parks.ca.gov/pages/23071/files/calargemap2012.pdf\">PDF link to California State Parks map</a>\n<a href=\"https://google.com\">External link to Google</a>\n```\n\n</html-preview>\n\n## Specs\n\n| Property     | Value            |\n| ------------ | ---------------- |\n| Machine name | ds-link-icon     |\n| JavaScript   | yes              |\n| SCSS         | ./src/index.scss |\n\n## Project installation\n\nThe instructions assume familiarity with [npm](https://npmjs.com) package management tool, modern JavaScript techniques, and [Sass](https://sass-lang.com/).\n\n1. `npm i @cagov/ds-link-icon`\n2. Use `import`[¹](/footnotes/#footnote1) or `require` to include the component’s **JavaScript** in your page or compiler.\n4. Add the **sample markup** to your HTML.\n5. Refer to the [Content model section](#content-model) for notes on mapping your data to the **sample markup**.\n6. Note that the `<a>` tags must be inside the `<main>` tag and external link to icons are required.\n\n### CDN installation\n\nWe recommend using a build system and bundling your JavaScript for faster performance. If you do not use a build system, you can include the code from our CDN with a script tag.\n\n```html\n<script type=\"module\" src=\"https://cdn.designsystem.webstandards.ca.gov/components/ds-link-icon/v2.0.1/dist/index.js\"></script>\n```\n\n### Other dependencies\n\nThis component uses icons from the [CAGov font library](https://template.webstandards.ca.gov/sample/icon-fonts.html). Include the font library in your project to ensure the icons appear.\n\n## CSS variables\n\nThe following [CSS variables](https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_custom_properties) are used in this component:\n\n- `--primary-700`\n- `--primary-900`\n\nAll CSS variables define their own fallback value so you do not have to use additional CSS unless you want to change them. You may define your own value for the variable by adding your own style rules. Here is an example defining the global hex value for a CSS variable named “--primary-700”:\n\n```css\n:root {\n  --primary-700: #165ac2;\n}\n```\n\n## CSS exceptions\n\nThere are cases when external link icon is not needed or messing the existing design. Here are the cases when external link icon is disabled:\n\n```scss\n.cagov-card, // card-grid component links\n.wp-block-button__link, // buttons inside of design system hero banner\n.footer-social-links a, // social icons links\nimg ~, // links that are using images\nsvg ~, // links that are using SVG icons\n.pdf-link-icon ~ // links to PDF files\n```\n\n## Accessibility\n\n### Component-specific accessibility review\n\n- Make sure that link icon span has `aria-hidden=\"true”` attribute.\n\n### Standard accessibility review\n\nAs a component in Alpha status, this component must pass the following accessibility reviews every time a new version is published:\n\n- Tested with the `[axe](https://www.deque.com/axe/)` accessibility tool and passes all automated [WCAG](https://www.w3.org/TR/WCAG21/) Level AA checks\n- Reviewed with the [VoiceOver](https://www.apple.com/voiceover/info/guide/_1121.html) screen reader on desktop\n- Verified keyboard navigation and that all actionable elements of the component are reachable via keyboard commands only\n- Reviewed component layout on a variety of screen sizes\n\n## Progressive enhancement\n\nThis component uses a [custom element](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_custom_elements) defined in JavaScript in addition to HTML and CSS. Edge, Firefox, Safari, and Chrome support custom elements. If the JavaScript for this component is not delivered or supported, the component will not display. This is the desired behavior because this component is not critical for site interaction. It uses [CSS variables](<https://developer.mozilla.org/en-US/docs/Web/CSS/var()#syntax>) to inherit design token values. Token definitions are not required because these style rules provide fallback values.\n\n<a name=\"content-model\"></a>\n\n## Content model\n\nRequires a `main` tag and activates on `a` tags. Automatically detects links and appends necessary icons to them.\n\n## Contributor/developer documentation\n\n- [Component information](https://github.com/cagov/design-system/blob/main/components/README.md)\n\n- [Unit tests](https://github.com/cagov/design-system/blob/main/components/UNIT-TESTS.md)\n","readmeFilename":"README.md"}