govuk-frontend
Version:
GOV.UK Frontend contains the code you need to start building a user interface for government platforms and services.
1 lines • 3.39 kB
Source Map (JSON)
{"version":3,"file":"notification-banner.mjs","sources":["../../../../src/govuk/components/notification-banner/notification-banner.mjs"],"sourcesContent":["import { ConfigurableComponent } from '../../common/configuration.mjs'\nimport { setFocus } from '../../common/index.mjs'\n\n/**\n * Notification Banner component\n *\n * @preserve\n * @augments ConfigurableComponent<NotificationBannerConfig>\n */\nexport class NotificationBanner extends ConfigurableComponent {\n /**\n * @param {Element | null} $root - HTML element to use for notification banner\n * @param {NotificationBannerConfig} [config] - Notification banner config\n */\n constructor($root, config = {}) {\n super($root, config)\n\n /**\n * Focus the notification banner\n *\n * If `role=\"alert\"` is set, focus the element to help some assistive\n * technologies prioritise announcing it.\n *\n * You can turn off the auto-focus functionality by setting\n * `data-disable-auto-focus=\"true\"` in the component HTML. You might wish to\n * do this based on user research findings, or to avoid a clash with another\n * element which should be focused when the page loads.\n */\n if (\n this.$root.getAttribute('role') === 'alert' &&\n !this.config.disableAutoFocus\n ) {\n setFocus(this.$root)\n }\n }\n\n /**\n * Name for the component used when initialising using data-module attributes.\n */\n static moduleName = 'govuk-notification-banner'\n\n /**\n * Notification banner default config\n *\n * @see {@link NotificationBannerConfig}\n * @constant\n * @type {NotificationBannerConfig}\n */\n static defaults = Object.freeze({\n disableAutoFocus: false\n })\n\n /**\n * Notification banner config schema\n *\n * @constant\n * @satisfies {Schema<NotificationBannerConfig>}\n */\n static schema = Object.freeze({\n properties: {\n disableAutoFocus: { type: 'boolean' }\n }\n })\n}\n\n/**\n * Notification banner config\n *\n * @typedef {object} NotificationBannerConfig\n * @property {boolean} [disableAutoFocus=false] - If set to `true` the\n * notification banner will not be focussed when the page loads. This only\n * applies if the component has a `role` of `alert` – in other cases the\n * component will not be focused on page load, regardless of this option.\n */\n\n/**\n * @import { Schema } from '../../common/configuration.mjs'\n */\n"],"names":["NotificationBanner","ConfigurableComponent","constructor","$root","config","getAttribute","disableAutoFocus","setFocus","moduleName","defaults","Object","freeze","schema","properties","type"],"mappings":";;;AAGA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMA,kBAAkB,SAASC,qBAAqB,CAAC;AAC5D;AACF;AACA;AACA;AACEC,EAAAA,WAAWA,CAACC,KAAK,EAAEC,MAAM,GAAG,EAAE,EAAE;AAC9B,IAAA,KAAK,CAACD,KAAK,EAAEC,MAAM,CAAC;AAapB,IAAA,IACE,IAAI,CAACD,KAAK,CAACE,YAAY,CAAC,MAAM,CAAC,KAAK,OAAO,IAC3C,CAAC,IAAI,CAACD,MAAM,CAACE,gBAAgB,EAC7B;AACAC,MAAAA,QAAQ,CAAC,IAAI,CAACJ,KAAK,CAAC;AACtB,IAAA;AACF,EAAA;AA6BF;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AApEaH,kBAAkB,CA8BtBQ,UAAU,GAAG,2BAA2B;AA9BpCR,kBAAkB,CAuCtBS,QAAQ,GAAGC,MAAM,CAACC,MAAM,CAAC;AAC9BL,EAAAA,gBAAgB,EAAE;AACpB,CAAC,CAAC;AAzCSN,kBAAkB,CAiDtBY,MAAM,GAAGF,MAAM,CAACC,MAAM,CAAC;AAC5BE,EAAAA,UAAU,EAAE;AACVP,IAAAA,gBAAgB,EAAE;AAAEQ,MAAAA,IAAI,EAAE;AAAU;AACtC;AACF,CAAC,CAAC;;;;"}