@myuw-web-components/myuw-help - npm Package Compare versions

Comparing version 1.5.6 to 1.5.7

dist/myuw-help.js

@@ -157,3 +157,3 @@ (function () {
 
-  var tpl = "<style> :host {\n    display: flex;\n    font-style: inherit;\n    font-variant: inherit;\n    font-family: inherit;\n  }\n\n  :host([hidden]) {\n    display: none;\n  }\n\n  :host([show-default-content]) #myuw-help__default-content {\n    display: block;\n  }\n\n  :host([show-button]) #help-button {\n    display: flex;\n  }\n\n  :host([open]) #myuw-help__dialog {\n    opacity: 1;\n    display: block;\n    position: absolute;\n  }\n\n  :host([open]) #myuw-help__shadow {\n    opacity: 1;\n    height: 100%;\n  }\n\n  /* Duplicate styles to appease firefox */\n  myuw-help {\n    display: flex;\n    font-style: inherit;\n    font-variant: inherit;\n    font-family: inherit;\n  }\n\n  myuw-help[hidden] {\n    display: none;\n  }\n\n  myuw-help[show-default-content] #myuw-help__default-content {\n    display: block;\n  }\n\n  myuw-help[show-button] #help-button {\n    display: flex;\n  }\n\n  myuw-help[open] #myuw-help__dialog {\n    opacity: 1;\n    display: block;\n    position: absolute;\n  }\n\n  myuw-help[open] #myuw-help__shadow {\n    opacity: 1;\n    height: 100%;\n  }\n\n  #myuw-help__dialog {\n    display: none;\n  }\n\n  .myuw-help__dialog-window {\n    max-width: 80%;\n    min-width: 300px;\n    height: auto;\n    -webkit-box-shadow: 0 -2px 25px 0 rgba(0, 0, 0, 0.15), 0 13px 25px 0 rgba(0, 0, 0, 0.3);\n    box-shadow: 0 -2px 25px 0 rgba(0, 0, 0, 0.15), 0 13px 25px 0 rgba(0, 0, 0, 0.3);\n    background-color: #FFFFFF;\n    padding: 22px 24px 12px;\n    margin-top: 0;\n    margin-bottom: 0;\n    margin-left: auto;\n    margin-right: auto;\n    border-radius: 5px;\n    font-family: var(--myuw-font, 'Red Hat Display', sans-serif);\n    position: relative;\n    -webkit-transition: all .4s cubic-bezier(.25, .8, .25, 1);\n    transition: all .4s cubic-bezier(.25, .8, .25, 1);\n    z-index: 110;\n  }\n\n  #myuw-help__heading {\n    display: flex;\n    align-content: center;\n    justify-content: space-between;\n  }\n\n  #myuw-help__title {\n    color: rgba(0, 0, 0, 0.8);\n    font-size: 20px;\n    font-weight: 500;\n    line-height: 24px;\n    letter-spacing: 0.03px;\n  }\n\n  #myuw-help__content {\n    font-weight: 400;\n    font-size: 16px;\n    color: rgba(0, 0, 0, .8);\n    line-height: 24px;\n    text-align: left;\n    letter-spacing: 0.03px;\n    padding: 8px 0 16px;\n  }\n\n  #myuw-help__default-content ul {\n    margin: 0;\n    padding: 0;\n    list-style-type: none;\n  }\n\n  #myuw-help__default-content ul li {\n    transition: background 0.4s cubic-bezier(.25, .8, .25, 1);\n    display: flex;\n    justify-content: flex-start;\n    align-items: center;\n    min-height: 38px;\n    height: auto;\n    padding: 0 16px 0 6px;\n  }\n\n  #myuw-help__default-content ul li:hover {\n    background: rgba(158, 158, 158, 0.2);\n  }\n\n  #myuw-help__default-content a {\n    text-decoration: none;\n    color: #0479a8;\n    /* TODO: use styles variables */\n    min-height: 38px;\n    line-height: 38px;\n    flex: auto;\n    display: flex;\n    align-items: center;\n  }\n\n  #myuw-help__default-content .material-icons {\n    width: 24px;\n    min-height: 24px;\n    min-width: 24px;\n    margin-right: 12px;\n    color: #434343;\n  }\n\n  #myuw-help__shadow {\n    position: fixed;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 0;\n    opacity: 0;\n    background: rgba(0, 0, 0, 0.3);\n    transition: opacity 0.3s cubic-bezier(.25, .8, .25, 1);\n    z-index: 100;\n  }\n\n  #myuw-help__close-button {\n    min-width: 48px;\n    max-width: 48px;\n    min-height: 48px;\n    max-height: 48px;\n    margin: 0;\n    display: flex;\n    -webkit-box-pack: center;\n    -ms-flex-pack: center;\n    -webkit-box-align: center;\n    -ms-flex-line-pack: center;\n    -ms-flex-align: center;\n    justify-content: center;\n    align-content: center;\n    align-items: center;\n    position: relative;\n    cursor: pointer;\n    border-radius: 3px;\n    box-sizing: border-box;\n    -webkit-user-select: none;\n    -moz-user-select: none;\n    -ms-user-select: none;\n    user-select: none;\n    border: 0;\n    padding: 0 6px;\n    background: transparent;\n    white-space: nowrap;\n    text-transform: uppercase;\n    font-weight: 500;\n    font-size: 14px;\n    text-decoration: none;\n    overflow: hidden;\n    -webkit-transition: box-shadow .4s cubic-bezier(.25, .8, .25, 1), background-color .4s cubic-bezier(.25, .8, .25, 1);\n    transition: box-shadow .4s cubic-bezier(.25, .8, .25, 1), background-color .4s cubic-bezier(.25, .8, .25, 1);\n    border-radius: 50%;\n  }\n\n  #myuw-help__close-button:hover {\n    background-color: rgba(158, 158, 158, 0.2);\n  }\n\n  #help-button {\n    display: none;\n    justify-content: center;\n    align-content: center;\n    align-items: center;\n    position: relative;\n    cursor: pointer;\n    min-height: 42px;\n    min-width: 42px;\n    height: 42px;\n    width: 42px;\n    user-select: none;\n    outline: none;\n    padding: 0;\n    border: 0;\n    border-radius: 50%;\n    margin: 0 6px;\n    background-color: transparent;\n    -webkit-transition: background-color .3s cubic-bezier(.35, 0, .25, 1);\n    transition: background-color .3s cubic-bezier(.35, 0, .25, 1);\n  }\n\n  #help-icon {\n    color: var(--myuw-primary-color, #fff);\n    fill: var(--myuw-primary-color, #fff);\n    height: 30px;\n    width: 30px;\n  }\n\n  #help-button:hover {\n    background-color: rgba(0, 0, 0, 0.2);\n  }\n\n  #help-button:focus,\n  #help-button:active {\n    outline: 2px solid #5e9ed6;\n    outline: -webkit-focus-ring-color auto 5px;\n  }\n\n  @media all and (min-width: 481px) and (max-width: 840px) {\n    #myuw-help__dialog {\n      width: 400px;\n    }\n  }\n\n  @media all and (min-width: 841px) {\n    #myuw-help__dialog {\n      width: 600px;\n    }\n  } </style> <button id=\"help-button\" aria-label=\"Open help dialog\"> <svg id=\"help-icon\" xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"> <path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 17h-2v-2h2v2zm2.07-7.75l-.9.92C13.45 12.9 13 13.5 13 15h-2v-.5c0-1.1.45-2.1 1.17-2.83l1.24-1.26c.37-.36.59-.86.59-1.41 0-1.1-.9-2-2-2s-2 .9-2 2H8c0-2.21 1.79-4 4-4s4 1.79 4 4c0 .88-.36 1.68-.93 2.25z\"/> <path d=\"M0 0h24v24H0z\" fill=\"none\"/> </svg> </button> <div id=\"myuw-help__dialog\" role=\"dialog\" aria-labelledby=\"myuw-help__title\" aria-modal=\"true\"> <div class=\"myuw-help__dialog-window\"> <div id=\"myuw-help__heading\"> <h1 id=\"myuw-help__title\"></h1> <button id=\"myuw-help__close-button\" aria-label=\"Close help dialog\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"> <path d=\"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\"/> <path d=\"M0 0h24v24H0z\" fill=\"none\"/> </svg> </button> </div> <div id=\"myuw-help__content\"> <slot name=\"myuw-help-content\"> <div id=\"myuw-help__default-content\"> <ul> <li> <a href=\"tel:[phone]\">Call the help desk</a> </li> <li> <a href=\"mailto:[e-mail]\">Email the help desk</a> </li> <li> <a href=\"https://it.wisc.edu\">Get help another way</a> </li> <li> <a href=\"https://outages.doit.wisc.edu/\">Check the Outages page</a> </li> <li> <a href=\"https://kb.wisc.edu/\">Search the KnowledgeBase</a> </li> </ul> </div> </slot> </div> </div> <div id=\"myuw-help__shadow\"></div> </div> ";
+  var tpl = "<style> :host {\n    display: flex;\n    font-style: inherit;\n    font-variant: inherit;\n    font-family: inherit;\n  }\n\n  :host([hidden]) {\n    display: none;\n  }\n\n  :host([show-default-content]) #myuw-help__default-content {\n    display: block;\n  }\n\n  :host([show-button]) #help-button {\n    display: flex;\n  }\n\n  :host([open]) #myuw-help__dialog {\n    opacity: 1;\n    display: block;\n    position: absolute;\n  }\n\n  :host([open]) #myuw-help__shadow {\n    opacity: 1;\n    height: 100%;\n  }\n\n  /* Duplicate styles to appease firefox */\n  myuw-help {\n    display: flex;\n    font-style: inherit;\n    font-variant: inherit;\n    font-family: inherit;\n  }\n\n  myuw-help[hidden] {\n    display: none;\n  }\n\n  myuw-help[show-default-content] #myuw-help__default-content {\n    display: block;\n  }\n\n  myuw-help[show-button] #help-button {\n    display: flex;\n  }\n\n  myuw-help[open] #myuw-help__dialog {\n    opacity: 1;\n    display: block;\n    position: absolute;\n  }\n\n  myuw-help[open] #myuw-help__shadow {\n    opacity: 1;\n    height: 100%;\n  }\n\n  #myuw-help__dialog {\n    display: none;\n  }\n\n  .myuw-help__dialog-window {\n    max-width: 80%;\n    min-width: 300px;\n    height: auto;\n    -webkit-box-shadow: 0 -2px 25px 0 rgba(0, 0, 0, 0.15), 0 13px 25px 0 rgba(0, 0, 0, 0.3);\n    box-shadow: 0 -2px 25px 0 rgba(0, 0, 0, 0.15), 0 13px 25px 0 rgba(0, 0, 0, 0.3);\n    background-color: #FFFFFF;\n    padding: 22px 24px 12px;\n    margin-top: 0;\n    margin-bottom: 0;\n    margin-left: auto;\n    margin-right: auto;\n    border-radius: 5px;\n    font-family: var(--myuw-font, 'Red Hat Text', sans-serif);\n    position: relative;\n    -webkit-transition: all .4s cubic-bezier(.25, .8, .25, 1);\n    transition: all .4s cubic-bezier(.25, .8, .25, 1);\n    z-index: 110;\n  }\n\n  #myuw-help__heading {\n    display: flex;\n    align-content: center;\n    justify-content: space-between;\n  }\n\n  #myuw-help__title {\n    font-family: var(--myuw-font, 'Red Hat Display', sans-serif);\n    color: rgba(0, 0, 0, 0.8);\n    font-size: 20px;\n    font-weight: 630;\n    line-height: 24px;\n    letter-spacing: 0.03px;\n  }\n\n  #myuw-help__content {\n    font-weight: 400;\n    font-size: 16px;\n    color: rgba(0, 0, 0, .8);\n    line-height: 24px;\n    text-align: left;\n    letter-spacing: 0.03px;\n    padding: 8px 0 16px;\n  }\n\n  #myuw-help__default-content ul {\n    margin: 0;\n    padding: 0;\n    list-style-type: none;\n  }\n\n  #myuw-help__default-content ul li {\n    transition: background 0.4s cubic-bezier(.25, .8, .25, 1);\n    display: flex;\n    justify-content: flex-start;\n    align-items: center;\n    min-height: 38px;\n    height: auto;\n    padding: 0 16px 0 6px;\n  }\n\n  #myuw-help__default-content ul li:hover {\n    background: rgba(158, 158, 158, 0.2);\n  }\n\n  #myuw-help__default-content a {\n    text-decoration: none;\n    color: #0479a8;\n    /* TODO: use styles variables */\n    min-height: 38px;\n    line-height: 38px;\n    flex: auto;\n    display: flex;\n    align-items: center;\n  }\n\n  #myuw-help__default-content .material-icons {\n    width: 24px;\n    min-height: 24px;\n    min-width: 24px;\n    margin-right: 12px;\n    color: #434343;\n  }\n\n  #myuw-help__shadow {\n    position: fixed;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 0;\n    opacity: 0;\n    background: rgba(0, 0, 0, 0.3);\n    transition: opacity 0.3s cubic-bezier(.25, .8, .25, 1);\n    z-index: 100;\n  }\n\n  #myuw-help__close-button {\n    min-width: 48px;\n    max-width: 48px;\n    min-height: 48px;\n    max-height: 48px;\n    margin: 0;\n    display: flex;\n    -webkit-box-pack: center;\n    -ms-flex-pack: center;\n    -webkit-box-align: center;\n    -ms-flex-line-pack: center;\n    -ms-flex-align: center;\n    justify-content: center;\n    align-content: center;\n    align-items: center;\n    position: relative;\n    cursor: pointer;\n    border-radius: 3px;\n    box-sizing: border-box;\n    -webkit-user-select: none;\n    -moz-user-select: none;\n    -ms-user-select: none;\n    user-select: none;\n    border: 0;\n    padding: 0 6px;\n    background: transparent;\n    white-space: nowrap;\n    text-transform: uppercase;\n    font-weight: 500;\n    font-size: 14px;\n    text-decoration: none;\n    overflow: hidden;\n    -webkit-transition: box-shadow .4s cubic-bezier(.25, .8, .25, 1), background-color .4s cubic-bezier(.25, .8, .25, 1);\n    transition: box-shadow .4s cubic-bezier(.25, .8, .25, 1), background-color .4s cubic-bezier(.25, .8, .25, 1);\n    border-radius: 50%;\n  }\n\n  #myuw-help__close-button:hover {\n    background-color: rgba(158, 158, 158, 0.2);\n  }\n\n  #help-button {\n    display: none;\n    justify-content: center;\n    align-content: center;\n    align-items: center;\n    position: relative;\n    cursor: pointer;\n    min-height: 42px;\n    min-width: 42px;\n    height: 42px;\n    width: 42px;\n    user-select: none;\n    outline: none;\n    padding: 0;\n    border: 0;\n    border-radius: 50%;\n    margin: 0 6px;\n    background-color: transparent;\n    -webkit-transition: background-color .3s cubic-bezier(.35, 0, .25, 1);\n    transition: background-color .3s cubic-bezier(.35, 0, .25, 1);\n  }\n\n  #help-icon {\n    color: var(--myuw-primary-color, #fff);\n    fill: var(--myuw-primary-color, #fff);\n    height: 30px;\n    width: 30px;\n  }\n\n  #help-button:hover {\n    background-color: rgba(0, 0, 0, 0.2);\n  }\n\n  #help-button:focus,\n  #help-button:active {\n    outline: 2px solid #5e9ed6;\n    outline: -webkit-focus-ring-color auto 5px;\n  }\n\n  @media all and (min-width: 481px) and (max-width: 840px) {\n    #myuw-help__dialog {\n      width: 400px;\n    }\n  }\n\n  @media all and (min-width: 841px) {\n    #myuw-help__dialog {\n      width: 600px;\n    }\n  } </style> <button id=\"help-button\" aria-label=\"Open help dialog\"> <svg id=\"help-icon\" xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"> <path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 17h-2v-2h2v2zm2.07-7.75l-.9.92C13.45 12.9 13 13.5 13 15h-2v-.5c0-1.1.45-2.1 1.17-2.83l1.24-1.26c.37-.36.59-.86.59-1.41 0-1.1-.9-2-2-2s-2 .9-2 2H8c0-2.21 1.79-4 4-4s4 1.79 4 4c0 .88-.36 1.68-.93 2.25z\"/> <path d=\"M0 0h24v24H0z\" fill=\"none\"/> </svg> </button> <div id=\"myuw-help__dialog\" role=\"dialog\" aria-labelledby=\"myuw-help__title\" aria-modal=\"true\"> <div class=\"myuw-help__dialog-window\"> <div id=\"myuw-help__heading\"> <h1 id=\"myuw-help__title\"></h1> <button id=\"myuw-help__close-button\" aria-label=\"Close help dialog\"> <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\"> <path d=\"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\"/> <path d=\"M0 0h24v24H0z\" fill=\"none\"/> </svg> </button> </div> <div id=\"myuw-help__content\"> <slot name=\"myuw-help-content\"> <div id=\"myuw-help__default-content\"> <ul> <li> <a href=\"tel:[phone]\">Call the help desk</a> </li> <li> <a href=\"mailto:[e-mail]\">Email the help desk</a> </li> <li> <a href=\"https://it.wisc.edu\">Get help another way</a> </li> <li> <a href=\"https://outages.doit.wisc.edu/\">Check the Outages page</a> </li> <li> <a href=\"https://kb.wisc.edu/\">Search the KnowledgeBase</a> </li> </ul> </div> </slot> </div> </div> <div id=\"myuw-help__shadow\"></div> </div> ";
 
@@ -160,0 +160,0 @@ var MyUWHelp = /*#__PURE__*/function (_HTMLElement) {

dist/myuw-help.min.js

@@ -1,1 +0,1 @@
-!(function(){"use strict";function e(e){var t=(function(e,t){if("object"!=typeof e||!e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var o=n.call(e,t||"default");if("object"!=typeof o)return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)})(e,"string");return"symbol"==typeof t?t:String(t)}function t(t,n){for(var o=0;o<n.length;o++){var i=n[o];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,e(i.key),i)}}function n(e){return(n=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}function o(e,t){return(o=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e})(e,t)}function i(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){})),!0}catch(e){return!1}}function l(e,t,n){return(l=i()?Reflect.construct.bind():function(e,t,n){var i=[null];i.push.apply(i,t);var l=new(Function.bind.apply(e,i));return n&&o(l,n.prototype),l}).apply(null,arguments)}function r(e){var t="function"==typeof Map?new Map:void 0;return(r=function(e){if(null===e||!(function(e){try{return-1!==Function.toString.call(e).indexOf("[native code]")}catch(t){return"function"==typeof e}})(e))return e;if("function"!=typeof e)throw new TypeError("Super expression must either be null or a function");if(void 0!==t){if(t.has(e))return t.get(e);t.set(e,i)}function i(){return l(e,arguments,n(this).constructor)}return i.prototype=Object.create(e.prototype,{constructor:{value:i,enumerable:!1,writable:!0,configurable:!0}}),o(i,e)})(e)}function a(e,t){if(t&&("object"==typeof t||"function"==typeof t))return t;if(void 0!==t)throw new TypeError("Derived constructors may only return object or undefined");return(function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e})(e)}var u=(function(e){!(function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&o(e,t)})(p,r(HTMLElement));var l,u,s,c,h,d=(l=p,u=i(),function(){var e,t=n(l);if(u){var o=n(this).constructor;e=Reflect.construct(t,arguments,o)}else e=t.apply(this,arguments);return a(this,e)});function p(){var e;return(function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")})(this,p),(e=d.call(this)).attachShadow({mode:"open"}),e.shadowRoot.appendChild(e.constructor.template.content.cloneNode(!0)),e.$customPosition={},e.titleHeadingElement=e.shadowRoot.getElementById("myuw-help__title"),e.$button=e.shadowRoot.getElementById("help-button"),e.$dialog=e.shadowRoot.getElementById("myuw-help__dialog"),e.contentSlotElement=e.shadowRoot.querySelector("slot[name=myuw-help-content]"),e.$backdrop=e.shadowRoot.getElementById("myuw-help__shadow"),e.$dialogCloseButton=e.shadowRoot.getElementById("myuw-help__close-button"),e.eventListeners=[{target:document,type:"set-myuw-help-position",handler:function(t){return e.handleDocumentSetHelpPosition(t)}},{target:document,type:"show-myuw-help",handler:function(t){return e.handleDocumentShowHelp(t)}},{target:e.$backdrop,type:"click",handler:function(t){return e.handleBackdropClick(t)}},{target:e.$button,type:"click",handler:function(t){return e.handleButtonClick(t)}},{target:e.$dialog,type:"keydown",handler:function(t){return e.handleDialogKeydown(t)}},{target:e.$dialogCloseButton,type:"click",handler:function(t){return e.handleDialogCloseButtonClick(t)}}],e}return s=p,h=[{key:"elementName",get:function(){return"myuw-help"}},{key:"observedAttributes",get:function(){return["myuw-help-title","open","show-button","show-default-content"]}},{key:"template",get:function(){return void 0===this._template&&(this._template=document.createElement("template"),this._template.innerHTML='<style> :host {\n    display: flex;\n    font-style: inherit;\n    font-variant: inherit;\n    font-family: inherit;\n  }\n\n  :host([hidden]) {\n    display: none;\n  }\n\n  :host([show-default-content]) #myuw-help__default-content {\n    display: block;\n  }\n\n  :host([show-button]) #help-button {\n    display: flex;\n  }\n\n  :host([open]) #myuw-help__dialog {\n    opacity: 1;\n    display: block;\n    position: absolute;\n  }\n\n  :host([open]) #myuw-help__shadow {\n    opacity: 1;\n    height: 100%;\n  }\n\n  /* Duplicate styles to appease firefox */\n  myuw-help {\n    display: flex;\n    font-style: inherit;\n    font-variant: inherit;\n    font-family: inherit;\n  }\n\n  myuw-help[hidden] {\n    display: none;\n  }\n\n  myuw-help[show-default-content] #myuw-help__default-content {\n    display: block;\n  }\n\n  myuw-help[show-button] #help-button {\n    display: flex;\n  }\n\n  myuw-help[open] #myuw-help__dialog {\n    opacity: 1;\n    display: block;\n    position: absolute;\n  }\n\n  myuw-help[open] #myuw-help__shadow {\n    opacity: 1;\n    height: 100%;\n  }\n\n  #myuw-help__dialog {\n    display: none;\n  }\n\n  .myuw-help__dialog-window {\n    max-width: 80%;\n    min-width: 300px;\n    height: auto;\n    -webkit-box-shadow: 0 -2px 25px 0 rgba(0, 0, 0, 0.15), 0 13px 25px 0 rgba(0, 0, 0, 0.3);\n    box-shadow: 0 -2px 25px 0 rgba(0, 0, 0, 0.15), 0 13px 25px 0 rgba(0, 0, 0, 0.3);\n    background-color: #FFFFFF;\n    padding: 22px 24px 12px;\n    margin-top: 0;\n    margin-bottom: 0;\n    margin-left: auto;\n    margin-right: auto;\n    border-radius: 5px;\n    font-family: var(--myuw-font, \'Red Hat Display\', sans-serif);\n    position: relative;\n    -webkit-transition: all .4s cubic-bezier(.25, .8, .25, 1);\n    transition: all .4s cubic-bezier(.25, .8, .25, 1);\n    z-index: 110;\n  }\n\n  #myuw-help__heading {\n    display: flex;\n    align-content: center;\n    justify-content: space-between;\n  }\n\n  #myuw-help__title {\n    color: rgba(0, 0, 0, 0.8);\n    font-size: 20px;\n    font-weight: 500;\n    line-height: 24px;\n    letter-spacing: 0.03px;\n  }\n\n  #myuw-help__content {\n    font-weight: 400;\n    font-size: 16px;\n    color: rgba(0, 0, 0, .8);\n    line-height: 24px;\n    text-align: left;\n    letter-spacing: 0.03px;\n    padding: 8px 0 16px;\n  }\n\n  #myuw-help__default-content ul {\n    margin: 0;\n    padding: 0;\n    list-style-type: none;\n  }\n\n  #myuw-help__default-content ul li {\n    transition: background 0.4s cubic-bezier(.25, .8, .25, 1);\n    display: flex;\n    justify-content: flex-start;\n    align-items: center;\n    min-height: 38px;\n    height: auto;\n    padding: 0 16px 0 6px;\n  }\n\n  #myuw-help__default-content ul li:hover {\n    background: rgba(158, 158, 158, 0.2);\n  }\n\n  #myuw-help__default-content a {\n    text-decoration: none;\n    color: #0479a8;\n    /* TODO: use styles variables */\n    min-height: 38px;\n    line-height: 38px;\n    flex: auto;\n    display: flex;\n    align-items: center;\n  }\n\n  #myuw-help__default-content .material-icons {\n    width: 24px;\n    min-height: 24px;\n    min-width: 24px;\n    margin-right: 12px;\n    color: #434343;\n  }\n\n  #myuw-help__shadow {\n    position: fixed;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 0;\n    opacity: 0;\n    background: rgba(0, 0, 0, 0.3);\n    transition: opacity 0.3s cubic-bezier(.25, .8, .25, 1);\n    z-index: 100;\n  }\n\n  #myuw-help__close-button {\n    min-width: 48px;\n    max-width: 48px;\n    min-height: 48px;\n    max-height: 48px;\n    margin: 0;\n    display: flex;\n    -webkit-box-pack: center;\n    -ms-flex-pack: center;\n    -webkit-box-align: center;\n    -ms-flex-line-pack: center;\n    -ms-flex-align: center;\n    justify-content: center;\n    align-content: center;\n    align-items: center;\n    position: relative;\n    cursor: pointer;\n    border-radius: 3px;\n    box-sizing: border-box;\n    -webkit-user-select: none;\n    -moz-user-select: none;\n    -ms-user-select: none;\n    user-select: none;\n    border: 0;\n    padding: 0 6px;\n    background: transparent;\n    white-space: nowrap;\n    text-transform: uppercase;\n    font-weight: 500;\n    font-size: 14px;\n    text-decoration: none;\n    overflow: hidden;\n    -webkit-transition: box-shadow .4s cubic-bezier(.25, .8, .25, 1), background-color .4s cubic-bezier(.25, .8, .25, 1);\n    transition: box-shadow .4s cubic-bezier(.25, .8, .25, 1), background-color .4s cubic-bezier(.25, .8, .25, 1);\n    border-radius: 50%;\n  }\n\n  #myuw-help__close-button:hover {\n    background-color: rgba(158, 158, 158, 0.2);\n  }\n\n  #help-button {\n    display: none;\n    justify-content: center;\n    align-content: center;\n    align-items: center;\n    position: relative;\n    cursor: pointer;\n    min-height: 42px;\n    min-width: 42px;\n    height: 42px;\n    width: 42px;\n    user-select: none;\n    outline: none;\n    padding: 0;\n    border: 0;\n    border-radius: 50%;\n    margin: 0 6px;\n    background-color: transparent;\n    -webkit-transition: background-color .3s cubic-bezier(.35, 0, .25, 1);\n    transition: background-color .3s cubic-bezier(.35, 0, .25, 1);\n  }\n\n  #help-icon {\n    color: var(--myuw-primary-color, #fff);\n    fill: var(--myuw-primary-color, #fff);\n    height: 30px;\n    width: 30px;\n  }\n\n  #help-button:hover {\n    background-color: rgba(0, 0, 0, 0.2);\n  }\n\n  #help-button:focus,\n  #help-button:active {\n    outline: 2px solid #5e9ed6;\n    outline: -webkit-focus-ring-color auto 5px;\n  }\n\n  @media all and (min-width: 481px) and (max-width: 840px) {\n    #myuw-help__dialog {\n      width: 400px;\n    }\n  }\n\n  @media all and (min-width: 841px) {\n    #myuw-help__dialog {\n      width: 600px;\n    }\n  } </style> <button id="help-button" aria-label="Open help dialog"> <svg id="help-icon" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"> <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 17h-2v-2h2v2zm2.07-7.75l-.9.92C13.45 12.9 13 13.5 13 15h-2v-.5c0-1.1.45-2.1 1.17-2.83l1.24-1.26c.37-.36.59-.86.59-1.41 0-1.1-.9-2-2-2s-2 .9-2 2H8c0-2.21 1.79-4 4-4s4 1.79 4 4c0 .88-.36 1.68-.93 2.25z"/> <path d="M0 0h24v24H0z" fill="none"/> </svg> </button> <div id="myuw-help__dialog" role="dialog" aria-labelledby="myuw-help__title" aria-modal="true"> <div class="myuw-help__dialog-window"> <div id="myuw-help__heading"> <h1 id="myuw-help__title"></h1> <button id="myuw-help__close-button" aria-label="Close help dialog"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"> <path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/> <path d="M0 0h24v24H0z" fill="none"/> </svg> </button> </div> <div id="myuw-help__content"> <slot name="myuw-help-content"> <div id="myuw-help__default-content"> <ul> <li> <a href="tel:[phone]">Call the help desk</a> </li> <li> <a href="mailto:[e-mail]">Email the help desk</a> </li> <li> <a href="https://it.wisc.edu">Get help another way</a> </li> <li> <a href="https://outages.doit.wisc.edu/">Check the Outages page</a> </li> <li> <a href="https://kb.wisc.edu/">Search the KnowledgeBase</a> </li> </ul> </div> </slot> </div> </div> <div id="myuw-help__shadow"></div> </div> '),this._template}}],(c=[{key:"focusableElements",get:function(){var e="a[href], input:not([disabled]), button:not([disabled]), button, select, textarea",t=this.contentSlotElement.assignedElements({flatten:!0}).reduce(function(t,n){return n.matches(e)?t.push(n):n.querySelectorAll(e).forEach(function(e){return t.push(e)}),t},[]);return t.push(this.$dialogCloseButton),t}},{key:"attributeChangedCallback",value:function(e,t,n){switch(e){case"myuw-help-title":this.titleHeadingElement.innerHTML=n;break;case"open":if(null===t&&null!==n)return this.setDialogPosition(),void this.focusableElements[0].focus();null!==t&&null===n&&this.resetDialogPosition()}}},{key:"connectedCallback",value:function(){this.eventListeners.forEach(function(e){var t=e.target,n=e.type,o=e.handler;return t.addEventListener(n,o)})}},{key:"disconnectedCallback",value:function(){this.eventListeners.forEach(function(e){var t=e.target,n=e.type,o=e.handler;return t.removeEventListener(n,o)})}},{key:"handleButtonClick",value:function(e){this.toggle(),e.preventDefault()}},{key:"handleDocumentShowHelp",value:function(e){this.toggle(),e.preventDefault()}},{key:"handleDocumentSetHelpPosition",value:function(e){e.detail&&e.detail.position&&(this.$customPosition=e.detail.position),e.preventDefault()}},{key:"handleDialogKeydown",value:function(e){switch(e.key){default:return;case"Escape":this.close();break;case"Tab":e.shiftKey?this.focusPrevious():this.focusNext();break;case"ArrowDown":this.focusNext();break;case"ArrowUp":this.focusPrevious()}e.preventDefault()}},{key:"handleBackdropClick",value:function(e){this.close(),e.preventDefault()}},{key:"handleDialogCloseButtonClick",value:function(e){this.close(),e.preventDefault()}},{key:"toggle",value:function(){this.hasAttribute("open")?this.close():this.open()}},{key:"open",value:function(){this.setAttribute("open","")}},{key:"close",value:function(){this.removeAttribute("open")}},{key:"focusNext",value:function(){var e=this.focusableElements,t=this.isSameNode(document.activeElement)?this.shadowRoot.activeElement:document.activeElement,n=e.indexOf(t);n===e.length-1||-1===n?e[0].focus():e[n+1].focus()}},{key:"focusPrevious",value:function(){var e=this.focusableElements,t=this.isSameNode(document.activeElement)?this.shadowRoot.activeElement:document.activeElement,n=e.indexOf(t);0===n||-1===n?e[e.length-1].focus():e[n-1].focus()}},{key:"resetDialogPosition",value:function(){this.$dialog.style.top=0,this.$dialog.style.left="auto",this.$dialog.style.right="-1000px"}},{key:"setDialogPosition",value:function(){if(this.$customPosition.left&&this.$customPosition.top)return this.$dialog.style.left=this.$customPosition.left,this.$dialog.style.top=this.$customPosition.top,void(this.$dialog.style.right="auto");var e=this.$dialog.offsetWidth,t=this.$dialog.offsetHeight,n=window.innerWidth&&document.documentElement.clientWidth?Math.min(window.innerWidth,document.documentElement.clientWidth):window.innerWidth||document.documentElement.clientWidth||document.getElementsByTagName("body")[0].clientWidth,o=((window.innerHeight&&document.documentElement.clientHeight?Math.min(window.innerHeight,document.documentElement.clientHeight):window.innerHeight||document.documentElement.clientHeight||document.getElementsByTagName("body")[0].clientHeight)-t)/3,i=(n-e)/2;this.$dialog.style.left=i+"px",this.$dialog.style.top=o+"px",this.$dialog.style.right="auto"}}])&&t(s.prototype,c),h&&t(s,h),Object.defineProperty(s,"prototype",{writable:!1}),p})();void 0===customElements.get(u.elementName)&&customElements.define(u.elementName,u)})();
+!(function(){"use strict";function e(e){var t=(function(e,t){if("object"!=typeof e||!e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var o=n.call(e,t||"default");if("object"!=typeof o)return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)})(e,"string");return"symbol"==typeof t?t:String(t)}function t(t,n){for(var o=0;o<n.length;o++){var i=n[o];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,e(i.key),i)}}function n(e){return(n=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}function o(e,t){return(o=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e})(e,t)}function i(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){})),!0}catch(e){return!1}}function l(e,t,n){return(l=i()?Reflect.construct.bind():function(e,t,n){var i=[null];i.push.apply(i,t);var l=new(Function.bind.apply(e,i));return n&&o(l,n.prototype),l}).apply(null,arguments)}function a(e){var t="function"==typeof Map?new Map:void 0;return(a=function(e){if(null===e||!(function(e){try{return-1!==Function.toString.call(e).indexOf("[native code]")}catch(t){return"function"==typeof e}})(e))return e;if("function"!=typeof e)throw new TypeError("Super expression must either be null or a function");if(void 0!==t){if(t.has(e))return t.get(e);t.set(e,i)}function i(){return l(e,arguments,n(this).constructor)}return i.prototype=Object.create(e.prototype,{constructor:{value:i,enumerable:!1,writable:!0,configurable:!0}}),o(i,e)})(e)}function r(e,t){if(t&&("object"==typeof t||"function"==typeof t))return t;if(void 0!==t)throw new TypeError("Derived constructors may only return object or undefined");return(function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e})(e)}var u=(function(e){!(function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&o(e,t)})(p,a(HTMLElement));var l,u,s,c,h,d=(l=p,u=i(),function(){var e,t=n(l);if(u){var o=n(this).constructor;e=Reflect.construct(t,arguments,o)}else e=t.apply(this,arguments);return r(this,e)});function p(){var e;return(function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")})(this,p),(e=d.call(this)).attachShadow({mode:"open"}),e.shadowRoot.appendChild(e.constructor.template.content.cloneNode(!0)),e.$customPosition={},e.titleHeadingElement=e.shadowRoot.getElementById("myuw-help__title"),e.$button=e.shadowRoot.getElementById("help-button"),e.$dialog=e.shadowRoot.getElementById("myuw-help__dialog"),e.contentSlotElement=e.shadowRoot.querySelector("slot[name=myuw-help-content]"),e.$backdrop=e.shadowRoot.getElementById("myuw-help__shadow"),e.$dialogCloseButton=e.shadowRoot.getElementById("myuw-help__close-button"),e.eventListeners=[{target:document,type:"set-myuw-help-position",handler:function(t){return e.handleDocumentSetHelpPosition(t)}},{target:document,type:"show-myuw-help",handler:function(t){return e.handleDocumentShowHelp(t)}},{target:e.$backdrop,type:"click",handler:function(t){return e.handleBackdropClick(t)}},{target:e.$button,type:"click",handler:function(t){return e.handleButtonClick(t)}},{target:e.$dialog,type:"keydown",handler:function(t){return e.handleDialogKeydown(t)}},{target:e.$dialogCloseButton,type:"click",handler:function(t){return e.handleDialogCloseButtonClick(t)}}],e}return s=p,h=[{key:"elementName",get:function(){return"myuw-help"}},{key:"observedAttributes",get:function(){return["myuw-help-title","open","show-button","show-default-content"]}},{key:"template",get:function(){return void 0===this._template&&(this._template=document.createElement("template"),this._template.innerHTML='<style> :host {\n    display: flex;\n    font-style: inherit;\n    font-variant: inherit;\n    font-family: inherit;\n  }\n\n  :host([hidden]) {\n    display: none;\n  }\n\n  :host([show-default-content]) #myuw-help__default-content {\n    display: block;\n  }\n\n  :host([show-button]) #help-button {\n    display: flex;\n  }\n\n  :host([open]) #myuw-help__dialog {\n    opacity: 1;\n    display: block;\n    position: absolute;\n  }\n\n  :host([open]) #myuw-help__shadow {\n    opacity: 1;\n    height: 100%;\n  }\n\n  /* Duplicate styles to appease firefox */\n  myuw-help {\n    display: flex;\n    font-style: inherit;\n    font-variant: inherit;\n    font-family: inherit;\n  }\n\n  myuw-help[hidden] {\n    display: none;\n  }\n\n  myuw-help[show-default-content] #myuw-help__default-content {\n    display: block;\n  }\n\n  myuw-help[show-button] #help-button {\n    display: flex;\n  }\n\n  myuw-help[open] #myuw-help__dialog {\n    opacity: 1;\n    display: block;\n    position: absolute;\n  }\n\n  myuw-help[open] #myuw-help__shadow {\n    opacity: 1;\n    height: 100%;\n  }\n\n  #myuw-help__dialog {\n    display: none;\n  }\n\n  .myuw-help__dialog-window {\n    max-width: 80%;\n    min-width: 300px;\n    height: auto;\n    -webkit-box-shadow: 0 -2px 25px 0 rgba(0, 0, 0, 0.15), 0 13px 25px 0 rgba(0, 0, 0, 0.3);\n    box-shadow: 0 -2px 25px 0 rgba(0, 0, 0, 0.15), 0 13px 25px 0 rgba(0, 0, 0, 0.3);\n    background-color: #FFFFFF;\n    padding: 22px 24px 12px;\n    margin-top: 0;\n    margin-bottom: 0;\n    margin-left: auto;\n    margin-right: auto;\n    border-radius: 5px;\n    font-family: var(--myuw-font, \'Red Hat Text\', sans-serif);\n    position: relative;\n    -webkit-transition: all .4s cubic-bezier(.25, .8, .25, 1);\n    transition: all .4s cubic-bezier(.25, .8, .25, 1);\n    z-index: 110;\n  }\n\n  #myuw-help__heading {\n    display: flex;\n    align-content: center;\n    justify-content: space-between;\n  }\n\n  #myuw-help__title {\n    font-family: var(--myuw-font, \'Red Hat Display\', sans-serif);\n    color: rgba(0, 0, 0, 0.8);\n    font-size: 20px;\n    font-weight: 630;\n    line-height: 24px;\n    letter-spacing: 0.03px;\n  }\n\n  #myuw-help__content {\n    font-weight: 400;\n    font-size: 16px;\n    color: rgba(0, 0, 0, .8);\n    line-height: 24px;\n    text-align: left;\n    letter-spacing: 0.03px;\n    padding: 8px 0 16px;\n  }\n\n  #myuw-help__default-content ul {\n    margin: 0;\n    padding: 0;\n    list-style-type: none;\n  }\n\n  #myuw-help__default-content ul li {\n    transition: background 0.4s cubic-bezier(.25, .8, .25, 1);\n    display: flex;\n    justify-content: flex-start;\n    align-items: center;\n    min-height: 38px;\n    height: auto;\n    padding: 0 16px 0 6px;\n  }\n\n  #myuw-help__default-content ul li:hover {\n    background: rgba(158, 158, 158, 0.2);\n  }\n\n  #myuw-help__default-content a {\n    text-decoration: none;\n    color: #0479a8;\n    /* TODO: use styles variables */\n    min-height: 38px;\n    line-height: 38px;\n    flex: auto;\n    display: flex;\n    align-items: center;\n  }\n\n  #myuw-help__default-content .material-icons {\n    width: 24px;\n    min-height: 24px;\n    min-width: 24px;\n    margin-right: 12px;\n    color: #434343;\n  }\n\n  #myuw-help__shadow {\n    position: fixed;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 0;\n    opacity: 0;\n    background: rgba(0, 0, 0, 0.3);\n    transition: opacity 0.3s cubic-bezier(.25, .8, .25, 1);\n    z-index: 100;\n  }\n\n  #myuw-help__close-button {\n    min-width: 48px;\n    max-width: 48px;\n    min-height: 48px;\n    max-height: 48px;\n    margin: 0;\n    display: flex;\n    -webkit-box-pack: center;\n    -ms-flex-pack: center;\n    -webkit-box-align: center;\n    -ms-flex-line-pack: center;\n    -ms-flex-align: center;\n    justify-content: center;\n    align-content: center;\n    align-items: center;\n    position: relative;\n    cursor: pointer;\n    border-radius: 3px;\n    box-sizing: border-box;\n    -webkit-user-select: none;\n    -moz-user-select: none;\n    -ms-user-select: none;\n    user-select: none;\n    border: 0;\n    padding: 0 6px;\n    background: transparent;\n    white-space: nowrap;\n    text-transform: uppercase;\n    font-weight: 500;\n    font-size: 14px;\n    text-decoration: none;\n    overflow: hidden;\n    -webkit-transition: box-shadow .4s cubic-bezier(.25, .8, .25, 1), background-color .4s cubic-bezier(.25, .8, .25, 1);\n    transition: box-shadow .4s cubic-bezier(.25, .8, .25, 1), background-color .4s cubic-bezier(.25, .8, .25, 1);\n    border-radius: 50%;\n  }\n\n  #myuw-help__close-button:hover {\n    background-color: rgba(158, 158, 158, 0.2);\n  }\n\n  #help-button {\n    display: none;\n    justify-content: center;\n    align-content: center;\n    align-items: center;\n    position: relative;\n    cursor: pointer;\n    min-height: 42px;\n    min-width: 42px;\n    height: 42px;\n    width: 42px;\n    user-select: none;\n    outline: none;\n    padding: 0;\n    border: 0;\n    border-radius: 50%;\n    margin: 0 6px;\n    background-color: transparent;\n    -webkit-transition: background-color .3s cubic-bezier(.35, 0, .25, 1);\n    transition: background-color .3s cubic-bezier(.35, 0, .25, 1);\n  }\n\n  #help-icon {\n    color: var(--myuw-primary-color, #fff);\n    fill: var(--myuw-primary-color, #fff);\n    height: 30px;\n    width: 30px;\n  }\n\n  #help-button:hover {\n    background-color: rgba(0, 0, 0, 0.2);\n  }\n\n  #help-button:focus,\n  #help-button:active {\n    outline: 2px solid #5e9ed6;\n    outline: -webkit-focus-ring-color auto 5px;\n  }\n\n  @media all and (min-width: 481px) and (max-width: 840px) {\n    #myuw-help__dialog {\n      width: 400px;\n    }\n  }\n\n  @media all and (min-width: 841px) {\n    #myuw-help__dialog {\n      width: 600px;\n    }\n  } </style> <button id="help-button" aria-label="Open help dialog"> <svg id="help-icon" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"> <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 17h-2v-2h2v2zm2.07-7.75l-.9.92C13.45 12.9 13 13.5 13 15h-2v-.5c0-1.1.45-2.1 1.17-2.83l1.24-1.26c.37-.36.59-.86.59-1.41 0-1.1-.9-2-2-2s-2 .9-2 2H8c0-2.21 1.79-4 4-4s4 1.79 4 4c0 .88-.36 1.68-.93 2.25z"/> <path d="M0 0h24v24H0z" fill="none"/> </svg> </button> <div id="myuw-help__dialog" role="dialog" aria-labelledby="myuw-help__title" aria-modal="true"> <div class="myuw-help__dialog-window"> <div id="myuw-help__heading"> <h1 id="myuw-help__title"></h1> <button id="myuw-help__close-button" aria-label="Close help dialog"> <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"> <path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/> <path d="M0 0h24v24H0z" fill="none"/> </svg> </button> </div> <div id="myuw-help__content"> <slot name="myuw-help-content"> <div id="myuw-help__default-content"> <ul> <li> <a href="tel:[phone]">Call the help desk</a> </li> <li> <a href="mailto:[e-mail]">Email the help desk</a> </li> <li> <a href="https://it.wisc.edu">Get help another way</a> </li> <li> <a href="https://outages.doit.wisc.edu/">Check the Outages page</a> </li> <li> <a href="https://kb.wisc.edu/">Search the KnowledgeBase</a> </li> </ul> </div> </slot> </div> </div> <div id="myuw-help__shadow"></div> </div> '),this._template}}],(c=[{key:"focusableElements",get:function(){var e="a[href], input:not([disabled]), button:not([disabled]), button, select, textarea",t=this.contentSlotElement.assignedElements({flatten:!0}).reduce(function(t,n){return n.matches(e)?t.push(n):n.querySelectorAll(e).forEach(function(e){return t.push(e)}),t},[]);return t.push(this.$dialogCloseButton),t}},{key:"attributeChangedCallback",value:function(e,t,n){switch(e){case"myuw-help-title":this.titleHeadingElement.innerHTML=n;break;case"open":if(null===t&&null!==n)return this.setDialogPosition(),void this.focusableElements[0].focus();null!==t&&null===n&&this.resetDialogPosition()}}},{key:"connectedCallback",value:function(){this.eventListeners.forEach(function(e){var t=e.target,n=e.type,o=e.handler;return t.addEventListener(n,o)})}},{key:"disconnectedCallback",value:function(){this.eventListeners.forEach(function(e){var t=e.target,n=e.type,o=e.handler;return t.removeEventListener(n,o)})}},{key:"handleButtonClick",value:function(e){this.toggle(),e.preventDefault()}},{key:"handleDocumentShowHelp",value:function(e){this.toggle(),e.preventDefault()}},{key:"handleDocumentSetHelpPosition",value:function(e){e.detail&&e.detail.position&&(this.$customPosition=e.detail.position),e.preventDefault()}},{key:"handleDialogKeydown",value:function(e){switch(e.key){default:return;case"Escape":this.close();break;case"Tab":e.shiftKey?this.focusPrevious():this.focusNext();break;case"ArrowDown":this.focusNext();break;case"ArrowUp":this.focusPrevious()}e.preventDefault()}},{key:"handleBackdropClick",value:function(e){this.close(),e.preventDefault()}},{key:"handleDialogCloseButtonClick",value:function(e){this.close(),e.preventDefault()}},{key:"toggle",value:function(){this.hasAttribute("open")?this.close():this.open()}},{key:"open",value:function(){this.setAttribute("open","")}},{key:"close",value:function(){this.removeAttribute("open")}},{key:"focusNext",value:function(){var e=this.focusableElements,t=this.isSameNode(document.activeElement)?this.shadowRoot.activeElement:document.activeElement,n=e.indexOf(t);n===e.length-1||-1===n?e[0].focus():e[n+1].focus()}},{key:"focusPrevious",value:function(){var e=this.focusableElements,t=this.isSameNode(document.activeElement)?this.shadowRoot.activeElement:document.activeElement,n=e.indexOf(t);0===n||-1===n?e[e.length-1].focus():e[n-1].focus()}},{key:"resetDialogPosition",value:function(){this.$dialog.style.top=0,this.$dialog.style.left="auto",this.$dialog.style.right="-1000px"}},{key:"setDialogPosition",value:function(){if(this.$customPosition.left&&this.$customPosition.top)return this.$dialog.style.left=this.$customPosition.left,this.$dialog.style.top=this.$customPosition.top,void(this.$dialog.style.right="auto");var e=this.$dialog.offsetWidth,t=this.$dialog.offsetHeight,n=window.innerWidth&&document.documentElement.clientWidth?Math.min(window.innerWidth,document.documentElement.clientWidth):window.innerWidth||document.documentElement.clientWidth||document.getElementsByTagName("body")[0].clientWidth,o=((window.innerHeight&&document.documentElement.clientHeight?Math.min(window.innerHeight,document.documentElement.clientHeight):window.innerHeight||document.documentElement.clientHeight||document.getElementsByTagName("body")[0].clientHeight)-t)/3,i=(n-e)/2;this.$dialog.style.left=i+"px",this.$dialog.style.top=o+"px",this.$dialog.style.right="auto"}}])&&t(s.prototype,c),h&&t(s,h),Object.defineProperty(s,"prototype",{writable:!1}),p})();void 0===customElements.get(u.elementName)&&customElements.define(u.elementName,u)})();

package.json

 {
   "name": "@myuw-web-components/myuw-help",
-  "version": "1.5.6",
+  "version": "1.5.7",
   "description": "",
@@ -5,0 +5,0 @@ "module": "dist/myuw-help.min.mjs",

No alert changes

Improved metrics

Total package byte prevSize

80463

increased by0.32%

Lines of code

813

increased by0.37%

No dependency changes