@nysds/nys-skipnav 1.13.0 → 1.13.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/nys-skipnav.js.map +1 -1
- package/package.json +1 -1
package/dist/nys-skipnav.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nys-skipnav.js","sources":["../src/nys-skipnav.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from \"lit\";\nimport { property } from \"lit/decorators.js\";\n// @ts-ignore: SCSS module imported via bundler as inline\nimport styles from \"./nys-skipnav.scss?inline\";\n\n/**\n *
|
|
1
|
+
{"version":3,"file":"nys-skipnav.js","sources":["../src/nys-skipnav.ts"],"sourcesContent":["import { LitElement, html, unsafeCSS } from \"lit\";\nimport { property } from \"lit/decorators.js\";\n// @ts-ignore: SCSS module imported via bundler as inline\nimport styles from \"./nys-skipnav.scss?inline\";\n\n/**\n * An accessible \"Skip to main content\" link for keyboard and screen reader users. Visually hidden until focused.\n *\n * Place as the first focusable element in the document. Links to `#main-content` by default, or specify `href`\n * for a custom target. The target element receives focus when activated for proper screen reader announcement.\n *\n * @summary Skip navigation link for keyboard accessibility. Hidden until focused.\n * @element nys-skipnav\n *\n * @example Default skip link\n * ```html\n * <nys-skipnav></nys-skipnav>\n * <main id=\"main-content\">...</main>\n * ```\n *\n * @example Custom target\n * ```html\n * <nys-skipnav href=\"#content-area\"></nys-skipnav>\n * ```\n */\n\nexport class NysSkipnav extends LitElement {\n static styles = unsafeCSS(styles);\n\n /** Unique identifier. Auto-generated if not provided. */\n @property({ type: String, reflect: true }) id = \"\";\n\n /** Target element ID (with `#`). Defaults to `#main-content`. */\n @property({ type: String }) href = \"\";\n\n constructor() {\n super();\n }\n\n // Generate a unique ID if one is not provided\n connectedCallback() {\n super.connectedCallback();\n if (!this.id) {\n this.id = `nys-skipnav-${Date.now()}`;\n }\n }\n\n /**\n * Event Handlers\n * --------------------------------------------------------------------------\n */\n\n private _handleFocus() {\n const linkElement = this.shadowRoot?.querySelector(\".nys-skipnav__link\");\n\n linkElement?.classList.add(\"show\");\n }\n\n private _handleBlur() {\n const linkElement = this.shadowRoot?.querySelector(\".nys-skipnav__link\");\n\n linkElement?.classList.remove(\"show\"); // Link is hidden whenever not focused\n }\n\n private _handleClick() {\n // Use href or default to #main-content\n const targetId = (this.href || \"#main-content\").replace(\"#\", \"\");\n const targetEl = document.getElementById(targetId);\n\n if (targetEl) {\n // Make sure it's focusable for screen readers rather than just scrolling to it\n targetEl.setAttribute(\"tabindex\", \"-1\");\n targetEl.focus();\n // Remove the blue outline that is applied to focused elements since we don't want the blue outline on the main container\n targetEl.style.outline = \"none\";\n }\n }\n\n render() {\n return html`\n <div class=\"nys-skipnav\">\n <a\n href=${this.href ? this.href : \"#main-content\"}\n tabindex=\"0\"\n class=\"nys-skipnav__link\"\n @focus=\"${this._handleFocus}\"\n @blur=\"${this._handleBlur}\"\n @click=\"${this._handleClick}\"\n >\n Skip to main content\n </a>\n </div>\n `;\n }\n}\n\nif (!customElements.get(\"nys-skipnav\")) {\n customElements.define(\"nys-skipnav\", NysSkipnav);\n}\n"],"names":["_NysSkipnav","LitElement","targetId","targetEl","html","unsafeCSS","styles","NysSkipnav","__decorateClass","property"],"mappings":";;;;;;;;AA0BO,MAAMA,IAAN,MAAMA,UAAmBC,EAAW;AAAA,EASzC,cAAc;AACZ,UAAA,GANyC,KAAA,KAAK,IAGpB,KAAA,OAAO;AAAA,EAInC;AAAA;AAAA,EAGA,oBAAoB;AAClB,UAAM,kBAAA,GACD,KAAK,OACR,KAAK,KAAK,eAAe,KAAK,IAAA,CAAK;AAAA,EAEvC;AAAA;AAAA;AAAA;AAAA;AAAA,EAOQ,eAAe;AAGrB,IAFoB,KAAK,YAAY,cAAc,oBAAoB,GAE1D,UAAU,IAAI,MAAM;AAAA,EACnC;AAAA,EAEQ,cAAc;AAGpB,IAFoB,KAAK,YAAY,cAAc,oBAAoB,GAE1D,UAAU,OAAO,MAAM;AAAA,EACtC;AAAA,EAEQ,eAAe;AAErB,UAAMC,KAAY,KAAK,QAAQ,iBAAiB,QAAQ,KAAK,EAAE,GACzDC,IAAW,SAAS,eAAeD,CAAQ;AAEjD,IAAIC,MAEFA,EAAS,aAAa,YAAY,IAAI,GACtCA,EAAS,MAAA,GAETA,EAAS,MAAM,UAAU;AAAA,EAE7B;AAAA,EAEA,SAAS;AACP,WAAOC;AAAA;AAAA;AAAA,iBAGM,KAAK,OAAO,KAAK,OAAO,eAAe;AAAA;AAAA;AAAA,oBAGpC,KAAK,YAAY;AAAA,mBAClB,KAAK,WAAW;AAAA,oBACf,KAAK,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAMnC;AACF;AAnEEJ,EAAO,SAASK,EAAUC,CAAM;AAD3B,IAAMC,IAANP;AAIsCQ,EAAA;AAAA,EAA1CC,EAAS,EAAE,MAAM,QAAQ,SAAS,IAAM;AAAA,GAJ9BF,EAIgC,WAAA,IAAA;AAGfC,EAAA;AAAA,EAA3BC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GAPfF,EAOiB,WAAA,MAAA;AA+DzB,eAAe,IAAI,aAAa,KACnC,eAAe,OAAO,eAAeA,CAAU;"}
|