@nrk/core-dialog
Advanced tools
Comparing version 1.0.16 to 1.1.0
'use strict'; | ||
var name = "@nrk/core-dialog"; | ||
var version = "1.0.15"; | ||
var version = "1.0.16"; | ||
@@ -92,10 +92,12 @@ var IS_BROWSER = typeof window !== 'undefined'; | ||
var hasBackdrop = (dialog.nextElementSibling || {}).nodeName === 'BACKDROP'; | ||
var isStrict = typeof options.strict === 'boolean' ? options.strict : dialog.getAttribute(UUID) === 'true'; | ||
var strict = typeof options.strict === 'boolean' ? options.strict : dialog.getAttribute(UUID) === 'true'; | ||
var modal = typeof options.modal === 'boolean' ? options.modal : dialog.getAttribute('aria-modal') !== 'false'; | ||
var label = options.label || dialog.getAttribute('aria-label'); | ||
dialog.setAttribute(UUID, isStrict); | ||
dialog.setAttribute(UUID, strict); | ||
dialog.setAttribute('role', 'dialog'); | ||
dialog.setAttribute('aria-modal', true); | ||
dialog.setAttribute('aria-label', options.label || dialog.getAttribute('aria-label')); | ||
dialog.setAttribute('aria-modal', modal); | ||
if (label) { dialog.setAttribute('aria-label', label); } | ||
if (!hasBackdrop) { dialog.insertAdjacentElement('afterend', document.createElement('backdrop')); } | ||
if (!hasFocusable) { console.warn('@nrk/core-dialog initialized without focusable elements. Please add [tabindex="-1"] the main element of', dialog); } | ||
if (!hasFocusable) { console.warn(dialog, 'is initialized without focusable elements. Please add [tabindex="-1"] the main element (for instance a <h1>)'); } | ||
@@ -163,2 +165,3 @@ setOpen(dialog, options.open, options.opener); | ||
var nextOpen = isUpdate ? willOpen : dialog.hasAttribute('open'); // dispatchEvent can change attributes, so check open again | ||
var nextBack = nextOpen && dialog.getAttribute('aria-modal') !== 'false'; | ||
var backdrop = dialog.nextElementSibling; | ||
@@ -175,3 +178,3 @@ var lastFocus = isUpdate && getLastFocusedElement(); // Store before open, as native dialog moves focus to [autofocus] | ||
} | ||
backdrop[nextOpen ? 'removeAttribute' : 'setAttribute']('hidden', ''); | ||
backdrop[nextBack ? 'removeAttribute' : 'setAttribute']('hidden', ''); | ||
@@ -178,0 +181,0 @@ if (isUpdate) { |
@@ -23,10 +23,12 @@ import { name, version } from './package.json' | ||
const hasBackdrop = (dialog.nextElementSibling || {}).nodeName === 'BACKDROP' | ||
const isStrict = typeof options.strict === 'boolean' ? options.strict : dialog.getAttribute(UUID) === 'true' | ||
const strict = typeof options.strict === 'boolean' ? options.strict : dialog.getAttribute(UUID) === 'true' | ||
const modal = typeof options.modal === 'boolean' ? options.modal : dialog.getAttribute('aria-modal') !== 'false' | ||
const label = options.label || dialog.getAttribute('aria-label') | ||
dialog.setAttribute(UUID, isStrict) | ||
dialog.setAttribute(UUID, strict) | ||
dialog.setAttribute('role', 'dialog') | ||
dialog.setAttribute('aria-modal', true) | ||
dialog.setAttribute('aria-label', options.label || dialog.getAttribute('aria-label')) | ||
dialog.setAttribute('aria-modal', modal) | ||
if (label) dialog.setAttribute('aria-label', label) | ||
if (!hasBackdrop) dialog.insertAdjacentElement('afterend', document.createElement('backdrop')) | ||
if (!hasFocusable) console.warn('@nrk/core-dialog initialized without focusable elements. Please add [tabindex="-1"] the main element of', dialog) | ||
if (!hasFocusable) console.warn(dialog, 'is initialized without focusable elements. Please add [tabindex="-1"] the main element (for instance a <h1>)') | ||
@@ -94,2 +96,3 @@ setOpen(dialog, options.open, options.opener) | ||
const nextOpen = isUpdate ? willOpen : dialog.hasAttribute('open') // dispatchEvent can change attributes, so check open again | ||
const nextBack = nextOpen && dialog.getAttribute('aria-modal') !== 'false' | ||
const backdrop = dialog.nextElementSibling | ||
@@ -106,3 +109,3 @@ const lastFocus = isUpdate && getLastFocusedElement() // Store before open, as native dialog moves focus to [autofocus] | ||
} | ||
backdrop[nextOpen ? 'removeAttribute' : 'setAttribute']('hidden', '') | ||
backdrop[nextBack ? 'removeAttribute' : 'setAttribute']('hidden', '') | ||
@@ -109,0 +112,0 @@ if (isUpdate) { |
@@ -1,3 +0,3 @@ | ||
/*! @nrk/core-dialog v1.0.15 - Copyright (c) 2017-2019 NRK */ | ||
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e(require("react"),require("prop-types")):"function"==typeof define&&define.amd?define(["react","prop-types"],e):(t=t||self).CoreDialog=e(t.React,t.PropTypes)}(this,function(a,t){"use strict";a=a&&a.hasOwnProperty("default")?a.default:a,t=t&&t.hasOwnProperty("default")?t.default:t;var e="undefined"!=typeof window,i=(e&&/(android)/i.test(navigator.userAgent),e&&/iPad|iPhone|iPod/.test(String(navigator.platform)),function(t){void 0===t&&(t=!1);try{window.addEventListener("test",null,{get passive(){t=!0}})}catch(t){}return t}());function n(t,e,n,o){(void 0===o&&(o=!1),"undefined"==typeof window||window[t=t+"-"+e])||(i||"object"!=typeof o||(o=Boolean(o.capture)),("resize"===e||"load"===e?window:document).addEventListener(window[t]=e,n,o))}var p,f="prevent_recursive_dispatch_maximum_callstack";function g(t,e){if(void 0===e&&(e=document),t){if(t.nodeType)return[t];if("string"==typeof t)return[].slice.call(e.querySelectorAll(t));if(t.length)return[].slice.call(t)}return[]}var u="data-@nrk/core-dialog-1.0.15".replace(/\W+/g,"-"),l=27,s=9,b=u+"-opener",d="\n [tabindex]:not([disabled]),\n a:not([disabled]),\n button:not([disabled]),\n input:not([disabled]),\n select:not([disabled]),\n textarea:not([disabled])";function c(t,e){var i="object"==typeof e?e:{open:e};return g(t).map(function(t){var e=g(d,t).length,n="BACKDROP"===(t.nextElementSibling||{}).nodeName,o="boolean"==typeof i.strict?i.strict:"true"===t.getAttribute(u);return t.setAttribute(u,o),t.setAttribute("role","dialog"),t.setAttribute("aria-modal",!0),t.setAttribute("aria-label",i.label||t.getAttribute("aria-label")),n||t.insertAdjacentElement("afterend",document.createElement("backdrop")),e||console.warn('@nrk/core-dialog initialized without focusable elements. Please add [tabindex="-1"] the main element of',t),y(t,i.open,i.opener),t})}n(u,"click",function(t){for(var e=t.target,n=void 0;e;e=e.parentElement){var o=e.getAttribute("data-core-dialog"),i=e.previousElementSibling,r=i&&"false"===i.getAttribute(u)&&(e=i);(n=n||r||"close"===o)?e.hasAttribute(u)&&y(e,!1):o&&c(document.getElementById(o),{open:!0,opener:e})}}),n(u,"transitionend",function(t){var e=t.target;e.hasAttribute&&e.hasAttribute(u)&&e.hasAttribute("open")?A(e):p&&setTimeout(function(){return p=p&&p.focus()},16)}),n(u,"keydown",function(t){var e,n,o,i,r=t.keyCode,a=(r===l||r===s)&&h();a&&r===s&&(n=t,o=g(d,e=a).filter(w),i=o[n.shiftKey?0:o.length-1],n.target!==i&&e.contains(n.target)||(n.preventDefault(),o[n.shiftKey?o.length-1:0].focus())),a&&r===l&&"false"===a.getAttribute(u)&&(t.defaultPrevented||y(a,!1),t.preventDefault())});var m=function(t){for(var e=t,n=1;e;e=e.offsetParent)n+=Number(window.getComputedStyle(e).getPropertyValue("z-index"))||0;return n},v=function(){return g("["+b+"]").sort(function(t,e){return t.getAttribute(b)>e.getAttribute(b)}).pop()},h=function(){return g("["+u+"][open]").sort(function(t,e){return m(t)>m(e)}).pop()};function y(t,e,n){void 0===n&&(n=document.activeElement);var o=t.hasAttribute("open"),i="boolean"==typeof e?e:"toggle"===e?!o:o,r=void 0!==window.HTMLDialogElement&&"function"==typeof t.show,a=o===i||function(t,e,n){void 0===n&&(n={});var o,i=""+f+e;if(t[i])return!0;t[i]=!0,"function"==typeof window.CustomEvent?o=new window.CustomEvent(e,{bubbles:!0,cancelable:!0,detail:n}):(o=document.createEvent("CustomEvent")).initCustomEvent(e,!0,!0,n);var r=t.dispatchEvent(o);return t[i]=null,r}(t,"dialog.toggle",{isOpen:o,willOpen:i}),u=a?i:t.hasAttribute("open"),l=t.nextElementSibling,s=a&&v();if(r?(t.open=!u,t[u?"show":"close"]()):(t[u?"setAttribute":"removeAttribute"]("open",""),t.className=t.className),l[u?"removeAttribute":"setAttribute"]("hidden",""),a){var d=Number(s&&s.getAttribute(b))||0,c=Math.min(Math.max.apply(Math,g("*").map(m)),2e9);u?(t.style.zIndex=c+2,t.nextElementSibling.style.zIndex=c+1,n&&n.setAttribute&&n.setAttribute(b,d+1),A(t)):s&&(p=s).removeAttribute(b)}}function w(t){return t.clientWidth&&t.clientHeight&&"hidden"!==window.getComputedStyle(t).getPropertyValue("visibility")}function A(t){t.contains(document.activeElement)||g("[autofocus]",t).concat(g(d,t)).concat(t).filter(w).every(function(t){return t.focus()})}var o=function(e){function r(t){e.call(this,t),this.onToggle=this.onToggle.bind(this)}e&&(r.__proto__=e),(r.prototype=Object.create(e&&e.prototype)).constructor=r;var t={defaultProps:{configurable:!0}};return t.defaultProps.get=function(){return{strict:null,onToggle:null}},r.prototype.componentDidMount=function(){c(this.el,this.props),this.el.addEventListener("dialog.toggle",this.onToggle)},r.prototype.componentDidUpdate=function(){c(this.el,this.props)},r.prototype.componentWillUnmount=function(){this.el.removeEventListener("dialog.toggle",this.onToggle)},r.prototype.onToggle=function(t){this.props.onToggle&&this.props.onToggle(t)},r.prototype.render=function(){var n,o,t,e=this,i=(n=this.props,o=r.defaultProps,void 0===(t={ref:function(t){return e.el=t}})&&(t={}),Object.keys(n).reduce(function(t,e){return o.hasOwnProperty(e)||(t[e]=n[e]),t},t));return a.createElement("dialog",i,this.props.children)},Object.defineProperties(r,t),r}(a.Component);return o.propTypes={onToggle:t.func,strict:t.bool,open:t.bool},o}); | ||
/*! @nrk/core-dialog v1.0.16 - Copyright (c) 2017-2019 NRK */ | ||
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e(require("react"),require("prop-types")):"function"==typeof define&&define.amd?define(["react","prop-types"],e):(t=t||self).CoreDialog=e(t.React,t.PropTypes)}(this,function(a,t){"use strict";a=a&&a.hasOwnProperty("default")?a.default:a,t=t&&t.hasOwnProperty("default")?t.default:t;var e="undefined"!=typeof window,i=(e&&/(android)/i.test(navigator.userAgent),e&&/iPad|iPhone|iPod/.test(String(navigator.platform)),function(t){void 0===t&&(t=!1);try{window.addEventListener("test",null,{get passive(){t=!0}})}catch(t){}return t}());function n(t,e,n,o){(void 0===o&&(o=!1),"undefined"==typeof window||window[t=t+"-"+e])||(i||"object"!=typeof o||(o=Boolean(o.capture)),("resize"===e||"load"===e?window:document).addEventListener(window[t]=e,n,o))}var f,g="prevent_recursive_dispatch_maximum_callstack";function b(t,e){if(void 0===e&&(e=document),t){if(t.nodeType)return[t];if("string"==typeof t)return[].slice.call(e.querySelectorAll(t));if(t.length)return[].slice.call(t)}return[]}var u="data-@nrk/core-dialog-1.0.16".replace(/\W+/g,"-"),l=27,s=9,m=u+"-opener",d="\n [tabindex]:not([disabled]),\n a:not([disabled]),\n button:not([disabled]),\n input:not([disabled]),\n select:not([disabled]),\n textarea:not([disabled])";function c(t,e){var a="object"==typeof e?e:{open:e};return b(t).map(function(t){var e=b(d,t).length,n="BACKDROP"===(t.nextElementSibling||{}).nodeName,o="boolean"==typeof a.strict?a.strict:"true"===t.getAttribute(u),i="boolean"==typeof a.modal?a.modal:"false"!==t.getAttribute("aria-modal"),r=a.label||t.getAttribute("aria-label");return t.setAttribute(u,o),t.setAttribute("role","dialog"),t.setAttribute("aria-modal",i),r&&t.setAttribute("aria-label",r),n||t.insertAdjacentElement("afterend",document.createElement("backdrop")),e||console.warn(t,'is initialized without focusable elements. Please add [tabindex="-1"] the main element (for instance a <h1>)'),y(t,a.open,a.opener),t})}n(u,"click",function(t){for(var e=t.target,n=void 0;e;e=e.parentElement){var o=e.getAttribute("data-core-dialog"),i=e.previousElementSibling,r=i&&"false"===i.getAttribute(u)&&(e=i);(n=n||r||"close"===o)?e.hasAttribute(u)&&y(e,!1):o&&c(document.getElementById(o),{open:!0,opener:e})}}),n(u,"transitionend",function(t){var e=t.target;e.hasAttribute&&e.hasAttribute(u)&&e.hasAttribute("open")?A(e):f&&setTimeout(function(){return f=f&&f.focus()},16)}),n(u,"keydown",function(t){var e,n,o,i,r=t.keyCode,a=(r===l||r===s)&&p();a&&r===s&&(n=t,o=b(d,e=a).filter(w),i=o[n.shiftKey?0:o.length-1],n.target!==i&&e.contains(n.target)||(n.preventDefault(),o[n.shiftKey?o.length-1:0].focus())),a&&r===l&&"false"===a.getAttribute(u)&&(t.defaultPrevented||y(a,!1),t.preventDefault())});var v=function(t){for(var e=t,n=1;e;e=e.offsetParent)n+=Number(window.getComputedStyle(e).getPropertyValue("z-index"))||0;return n},h=function(){return b("["+m+"]").sort(function(t,e){return t.getAttribute(m)>e.getAttribute(m)}).pop()},p=function(){return b("["+u+"][open]").sort(function(t,e){return v(t)>v(e)}).pop()};function y(t,e,n){void 0===n&&(n=document.activeElement);var o=t.hasAttribute("open"),i="boolean"==typeof e?e:"toggle"===e?!o:o,r=void 0!==window.HTMLDialogElement&&"function"==typeof t.show,a=o===i||function(t,e,n){void 0===n&&(n={});var o,i=""+g+e;if(t[i])return!0;t[i]=!0,"function"==typeof window.CustomEvent?o=new window.CustomEvent(e,{bubbles:!0,cancelable:!0,detail:n}):(o=document.createEvent("CustomEvent")).initCustomEvent(e,!0,!0,n);var r=t.dispatchEvent(o);return t[i]=null,r}(t,"dialog.toggle",{isOpen:o,willOpen:i}),u=a?i:t.hasAttribute("open"),l=u&&"false"!==t.getAttribute("aria-modal"),s=t.nextElementSibling,d=a&&h();if(r?(t.open=!u,t[u?"show":"close"]()):(t[u?"setAttribute":"removeAttribute"]("open",""),t.className=t.className),s[l?"removeAttribute":"setAttribute"]("hidden",""),a){var c=Number(d&&d.getAttribute(m))||0,p=Math.min(Math.max.apply(Math,b("*").map(v)),2e9);u?(t.style.zIndex=p+2,t.nextElementSibling.style.zIndex=p+1,n&&n.setAttribute&&n.setAttribute(m,c+1),A(t)):d&&(f=d).removeAttribute(m)}}function w(t){return t.clientWidth&&t.clientHeight&&"hidden"!==window.getComputedStyle(t).getPropertyValue("visibility")}function A(t){t.contains(document.activeElement)||b("[autofocus]",t).concat(b(d,t)).concat(t).filter(w).every(function(t){return t.focus()})}var o=function(e){function r(t){e.call(this,t),this.onToggle=this.onToggle.bind(this)}e&&(r.__proto__=e),(r.prototype=Object.create(e&&e.prototype)).constructor=r;var t={defaultProps:{configurable:!0}};return t.defaultProps.get=function(){return{strict:null,onToggle:null}},r.prototype.componentDidMount=function(){c(this.el,this.props),this.el.addEventListener("dialog.toggle",this.onToggle)},r.prototype.componentDidUpdate=function(){c(this.el,this.props)},r.prototype.componentWillUnmount=function(){this.el.removeEventListener("dialog.toggle",this.onToggle)},r.prototype.onToggle=function(t){this.props.onToggle&&this.props.onToggle(t)},r.prototype.render=function(){var n,o,t,e=this,i=(n=this.props,o=r.defaultProps,void 0===(t={ref:function(t){return e.el=t}})&&(t={}),Object.keys(n).reduce(function(t,e){return o.hasOwnProperty(e)||(t[e]=n[e]),t},t));return a.createElement("dialog",i,this.props.children)},Object.defineProperties(r,t),r}(a.Component);return o.propTypes={onToggle:t.func,strict:t.bool,open:t.bool},o}); | ||
//# sourceMappingURL=core-dialog.jsx.js.map |
@@ -1,3 +0,3 @@ | ||
/*! @nrk/core-dialog v1.0.15 - Copyright (c) 2017-2019 NRK */ | ||
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e=e||self).coreDialog=t()}(this,function(){"use strict";var e="undefined"!=typeof window,o=(e&&/(android)/i.test(navigator.userAgent),e&&/iPad|iPhone|iPod/.test(String(navigator.platform)),function(e){void 0===e&&(e=!1);try{window.addEventListener("test",null,{get passive(){e=!0}})}catch(e){}return e}());function t(e,t,n,i){(void 0===i&&(i=!1),"undefined"==typeof window||window[e=e+"-"+t])||(o||"object"!=typeof i||(i=Boolean(i.capture)),("resize"===t||"load"===t?window:document).addEventListener(window[e]=t,n,i))}var f,b="prevent_recursive_dispatch_maximum_callstack";function p(e,t){if(void 0===t&&(t=document),e){if(e.nodeType)return[e];if("string"==typeof e)return[].slice.call(t.querySelectorAll(e));if(e.length)return[].slice.call(e)}return[]}var u="data-@nrk/core-dialog-1.0.15".replace(/\W+/g,"-"),l=27,d=9,m=u+"-opener",c="\n [tabindex]:not([disabled]),\n a:not([disabled]),\n button:not([disabled]),\n input:not([disabled]),\n select:not([disabled]),\n textarea:not([disabled])";function a(e,t){var o="object"==typeof t?t:{open:t};return p(e).map(function(e){var t=p(c,e).length,n="BACKDROP"===(e.nextElementSibling||{}).nodeName,i="boolean"==typeof o.strict?o.strict:"true"===e.getAttribute(u);return e.setAttribute(u,i),e.setAttribute("role","dialog"),e.setAttribute("aria-modal",!0),e.setAttribute("aria-label",o.label||e.getAttribute("aria-label")),n||e.insertAdjacentElement("afterend",document.createElement("backdrop")),t||console.warn('@nrk/core-dialog initialized without focusable elements. Please add [tabindex="-1"] the main element of',e),w(e,o.open,o.opener),e})}t(u,"click",function(e){for(var t=e.target,n=void 0;t;t=t.parentElement){var i=t.getAttribute("data-core-dialog"),o=t.previousElementSibling,r=o&&"false"===o.getAttribute(u)&&(t=o);(n=n||r||"close"===i)?t.hasAttribute(u)&&w(t,!1):i&&a(document.getElementById(i),{open:!0,opener:t})}}),t(u,"transitionend",function(e){var t=e.target;t.hasAttribute&&t.hasAttribute(u)&&t.hasAttribute("open")?A(t):f&&setTimeout(function(){return f=f&&f.focus()},16)}),t(u,"keydown",function(e){var t,n,i,o,r=e.keyCode,a=(r===l||r===d)&&s();a&&r===d&&(n=e,i=p(c,t=a).filter(y),o=i[n.shiftKey?0:i.length-1],n.target!==o&&t.contains(n.target)||(n.preventDefault(),i[n.shiftKey?i.length-1:0].focus())),a&&r===l&&"false"===a.getAttribute(u)&&(e.defaultPrevented||w(a,!1),e.preventDefault())});var v=function(e){for(var t=e,n=1;t;t=t.offsetParent)n+=Number(window.getComputedStyle(t).getPropertyValue("z-index"))||0;return n},g=function(){return p("["+m+"]").sort(function(e,t){return e.getAttribute(m)>t.getAttribute(m)}).pop()},s=function(){return p("["+u+"][open]").sort(function(e,t){return v(e)>v(t)}).pop()};function w(e,t,n){void 0===n&&(n=document.activeElement);var i=e.hasAttribute("open"),o="boolean"==typeof t?t:"toggle"===t?!i:i,r=void 0!==window.HTMLDialogElement&&"function"==typeof e.show,a=i===o||function(e,t,n){void 0===n&&(n={});var i,o=""+b+t;if(e[o])return!0;e[o]=!0,"function"==typeof window.CustomEvent?i=new window.CustomEvent(t,{bubbles:!0,cancelable:!0,detail:n}):(i=document.createEvent("CustomEvent")).initCustomEvent(t,!0,!0,n);var r=e.dispatchEvent(i);return e[o]=null,r}(e,"dialog.toggle",{isOpen:i,willOpen:o}),u=a?o:e.hasAttribute("open"),l=e.nextElementSibling,d=a&&g();if(r?(e.open=!u,e[u?"show":"close"]()):(e[u?"setAttribute":"removeAttribute"]("open",""),e.className=e.className),l[u?"removeAttribute":"setAttribute"]("hidden",""),a){var c=Number(d&&d.getAttribute(m))||0,s=Math.min(Math.max.apply(Math,p("*").map(v)),2e9);u?(e.style.zIndex=s+2,e.nextElementSibling.style.zIndex=s+1,n&&n.setAttribute&&n.setAttribute(m,c+1),A(e)):d&&(f=d).removeAttribute(m)}}function y(e){return e.clientWidth&&e.clientHeight&&"hidden"!==window.getComputedStyle(e).getPropertyValue("visibility")}function A(e){e.contains(document.activeElement)||p("[autofocus]",e).concat(p(c,e)).concat(e).filter(y).every(function(e){return e.focus()})}return a}); | ||
/*! @nrk/core-dialog v1.0.16 - Copyright (c) 2017-2019 NRK */ | ||
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t=t||self).coreDialog=e()}(this,function(){"use strict";var t="undefined"!=typeof window,o=(t&&/(android)/i.test(navigator.userAgent),t&&/iPad|iPhone|iPod/.test(String(navigator.platform)),function(t){void 0===t&&(t=!1);try{window.addEventListener("test",null,{get passive(){t=!0}})}catch(t){}return t}());function e(t,e,n,i){(void 0===i&&(i=!1),"undefined"==typeof window||window[t=t+"-"+e])||(o||"object"!=typeof i||(i=Boolean(i.capture)),("resize"===e||"load"===e?window:document).addEventListener(window[t]=e,n,i))}var b,p="prevent_recursive_dispatch_maximum_callstack";function m(t,e){if(void 0===e&&(e=document),t){if(t.nodeType)return[t];if("string"==typeof t)return[].slice.call(e.querySelectorAll(t));if(t.length)return[].slice.call(t)}return[]}var u="data-@nrk/core-dialog-1.0.16".replace(/\W+/g,"-"),l=27,d=9,v=u+"-opener",s="\n [tabindex]:not([disabled]),\n a:not([disabled]),\n button:not([disabled]),\n input:not([disabled]),\n select:not([disabled]),\n textarea:not([disabled])";function a(t,e){var a="object"==typeof e?e:{open:e};return m(t).map(function(t){var e=m(s,t).length,n="BACKDROP"===(t.nextElementSibling||{}).nodeName,i="boolean"==typeof a.strict?a.strict:"true"===t.getAttribute(u),o="boolean"==typeof a.modal?a.modal:"false"!==t.getAttribute("aria-modal"),r=a.label||t.getAttribute("aria-label");return t.setAttribute(u,i),t.setAttribute("role","dialog"),t.setAttribute("aria-modal",o),r&&t.setAttribute("aria-label",r),n||t.insertAdjacentElement("afterend",document.createElement("backdrop")),e||console.warn(t,'is initialized without focusable elements. Please add [tabindex="-1"] the main element (for instance a <h1>)'),f(t,a.open,a.opener),t})}e(u,"click",function(t){for(var e=t.target,n=void 0;e;e=e.parentElement){var i=e.getAttribute("data-core-dialog"),o=e.previousElementSibling,r=o&&"false"===o.getAttribute(u)&&(e=o);(n=n||r||"close"===i)?e.hasAttribute(u)&&f(e,!1):i&&a(document.getElementById(i),{open:!0,opener:e})}}),e(u,"transitionend",function(t){var e=t.target;e.hasAttribute&&e.hasAttribute(u)&&e.hasAttribute("open")?h(e):b&&setTimeout(function(){return b=b&&b.focus()},16)}),e(u,"keydown",function(t){var e,n,i,o,r=t.keyCode,a=(r===l||r===d)&&c();a&&r===d&&(n=t,i=m(s,e=a).filter(y),o=i[n.shiftKey?0:i.length-1],n.target!==o&&e.contains(n.target)||(n.preventDefault(),i[n.shiftKey?i.length-1:0].focus())),a&&r===l&&"false"===a.getAttribute(u)&&(t.defaultPrevented||f(a,!1),t.preventDefault())});var g=function(t){for(var e=t,n=1;e;e=e.offsetParent)n+=Number(window.getComputedStyle(e).getPropertyValue("z-index"))||0;return n},A=function(){return m("["+v+"]").sort(function(t,e){return t.getAttribute(v)>e.getAttribute(v)}).pop()},c=function(){return m("["+u+"][open]").sort(function(t,e){return g(t)>g(e)}).pop()};function f(t,e,n){void 0===n&&(n=document.activeElement);var i=t.hasAttribute("open"),o="boolean"==typeof e?e:"toggle"===e?!i:i,r=void 0!==window.HTMLDialogElement&&"function"==typeof t.show,a=i===o||function(t,e,n){void 0===n&&(n={});var i,o=""+p+e;if(t[o])return!0;t[o]=!0,"function"==typeof window.CustomEvent?i=new window.CustomEvent(e,{bubbles:!0,cancelable:!0,detail:n}):(i=document.createEvent("CustomEvent")).initCustomEvent(e,!0,!0,n);var r=t.dispatchEvent(i);return t[o]=null,r}(t,"dialog.toggle",{isOpen:i,willOpen:o}),u=a?o:t.hasAttribute("open"),l=u&&"false"!==t.getAttribute("aria-modal"),d=t.nextElementSibling,s=a&&A();if(r?(t.open=!u,t[u?"show":"close"]()):(t[u?"setAttribute":"removeAttribute"]("open",""),t.className=t.className),d[l?"removeAttribute":"setAttribute"]("hidden",""),a){var c=Number(s&&s.getAttribute(v))||0,f=Math.min(Math.max.apply(Math,m("*").map(g)),2e9);u?(t.style.zIndex=f+2,t.nextElementSibling.style.zIndex=f+1,n&&n.setAttribute&&n.setAttribute(v,c+1),h(t)):s&&(b=s).removeAttribute(v)}}function y(t){return t.clientWidth&&t.clientHeight&&"hidden"!==window.getComputedStyle(t).getPropertyValue("visibility")}function h(t){t.contains(document.activeElement)||m("[autofocus]",t).concat(m(s,t)).concat(t).filter(y).every(function(t){return t.focus()})}return a}); | ||
//# sourceMappingURL=core-dialog.min.js.map |
@@ -11,3 +11,3 @@ const coreDialog = require('./core-dialog.min') | ||
<button data-core-dialog="dialog-0">Open dialog 1</button> | ||
<dialog id="dialog-0"> | ||
<dialog id="dialog-0" aria-label="Dialog label 1"> | ||
<button data-core-dialog="close"></button> | ||
@@ -20,3 +20,3 @@ <button data-core-dialog="dialog-1">Open nested dialog 2</button> | ||
</dialog> | ||
<dialog id="dialog-2"> | ||
<dialog id="dialog-2" aria-label="Dialog label 2"> | ||
<button data-core-dialog="dialog-0">Open dialog 1</button> | ||
@@ -23,0 +23,0 @@ <button data-core-dialog="close"></button> |
17
jsx.js
@@ -9,3 +9,3 @@ 'use strict'; | ||
var name = "@nrk/core-dialog"; | ||
var version = "1.0.15"; | ||
var version = "1.0.16"; | ||
@@ -113,10 +113,12 @@ var IS_BROWSER = typeof window !== 'undefined'; | ||
var hasBackdrop = (dialog.nextElementSibling || {}).nodeName === 'BACKDROP'; | ||
var isStrict = typeof options.strict === 'boolean' ? options.strict : dialog.getAttribute(UUID) === 'true'; | ||
var strict = typeof options.strict === 'boolean' ? options.strict : dialog.getAttribute(UUID) === 'true'; | ||
var modal = typeof options.modal === 'boolean' ? options.modal : dialog.getAttribute('aria-modal') !== 'false'; | ||
var label = options.label || dialog.getAttribute('aria-label'); | ||
dialog.setAttribute(UUID, isStrict); | ||
dialog.setAttribute(UUID, strict); | ||
dialog.setAttribute('role', 'dialog'); | ||
dialog.setAttribute('aria-modal', true); | ||
dialog.setAttribute('aria-label', options.label || dialog.getAttribute('aria-label')); | ||
dialog.setAttribute('aria-modal', modal); | ||
if (label) { dialog.setAttribute('aria-label', label); } | ||
if (!hasBackdrop) { dialog.insertAdjacentElement('afterend', document.createElement('backdrop')); } | ||
if (!hasFocusable) { console.warn('@nrk/core-dialog initialized without focusable elements. Please add [tabindex="-1"] the main element of', dialog); } | ||
if (!hasFocusable) { console.warn(dialog, 'is initialized without focusable elements. Please add [tabindex="-1"] the main element (for instance a <h1>)'); } | ||
@@ -184,2 +186,3 @@ setOpen(dialog, options.open, options.opener); | ||
var nextOpen = isUpdate ? willOpen : dialog.hasAttribute('open'); // dispatchEvent can change attributes, so check open again | ||
var nextBack = nextOpen && dialog.getAttribute('aria-modal') !== 'false'; | ||
var backdrop = dialog.nextElementSibling; | ||
@@ -196,3 +199,3 @@ var lastFocus = isUpdate && getLastFocusedElement(); // Store before open, as native dialog moves focus to [autofocus] | ||
} | ||
backdrop[nextOpen ? 'removeAttribute' : 'setAttribute']('hidden', ''); | ||
backdrop[nextBack ? 'removeAttribute' : 'setAttribute']('hidden', ''); | ||
@@ -199,0 +202,0 @@ if (isUpdate) { |
@@ -5,3 +5,3 @@ { | ||
"author": "NRK <opensource@nrk.no> (https://www.nrk.no/)", | ||
"version": "1.0.16", | ||
"version": "1.1.0", | ||
"license": "MIT", | ||
@@ -8,0 +8,0 @@ "main": "core-dialog.cjs.js", |
@@ -84,5 +84,5 @@ # Core Dialog | ||
<script> | ||
coreDialog('#my-dialog', {open: false}); | ||
coreDialog('#my-dialog-nested', {open: false}); | ||
coreDialog('#strict-dialog', {open: false, strict: true}); | ||
coreDialog('#my-dialog'); | ||
coreDialog('#my-dialog-nested'); | ||
coreDialog('#strict-dialog', { strict: true }); | ||
</script> | ||
@@ -202,3 +202,4 @@ ``` | ||
strict: Boolean, // Optional. Defaults to false. If true the dialog will not close on ESC-key nor on click on backdrop | ||
label: String // Optional. Defaults to aria-label if set or ''. Should be implemented in order for the dialog to have a label readable by screen readers | ||
label: String, // Optional. Defaults to aria-label if set or ''. Should be implemented in order for the dialog to have a label readable by screen readers | ||
modal: Boolean, // Optional. Defaults to true or aria-modal. Setting false hides backdrop | ||
opener: Element // Optional. Defaults to document.activeElement. Sets the element that should receive focus after closing | ||
@@ -218,3 +219,3 @@ }) | ||
<CoreDialog open={true|false} strict={true|false} onToggle={function(){}} aria-label="Title of dialog"> | ||
<CoreDialog open={true|false} strict={true|false} modal={true|false} onToggle={function(){}} aria-label="Title of dialog"> | ||
<h1>My React/Preact dialog</h1> | ||
@@ -221,0 +222,0 @@ <p>Some content</p> |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
89237
710
281