@lrnwebcomponents/a11y-details - npm Package Compare versions

Comparing version 4.0.4 to 4.0.5

a11y-details.umd.js

@@ -1,1 +0,1 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("lit")):"function"==typeof define&&define.amd?define(["exports","lit"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).A11yDetails={},e.lit)}(this,(function(e,t){"use strict";function n(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function r(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?n(Object(r),!0).forEach((function(t){i(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):n(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}function o(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function i(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function a(e){return(a=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}function s(e,t){return(s=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function l(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)}function d(e){var t=function(){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}}();return function(){var n,r=a(e);if(t){var o=a(this).constructor;n=Reflect.construct(r,arguments,o)}else n=r.apply(this,arguments);return l(this,n)}}function u(e,t,n){return(u="undefined"!=typeof Reflect&&Reflect.get?Reflect.get:function(e,t,n){var r=function(e,t){for(;!Object.prototype.hasOwnProperty.call(e,t)&&null!==(e=a(e)););return e}(e,t);if(r){var o=Object.getOwnPropertyDescriptor(r,t);return o.get?o.get.call(n):o.value}})(e,t,n||e)}function c(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}))}var p,y,f=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}}),t&&s(e,t)}(h,e);var n,i,l,f=d(h);function h(){var e;return function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,h),(e=f.call(this)).closeText="",e.openText="",e.tag=h.tag,e}return n=h,l=[{key:"styles",get:function(){return[t.css(y||(y=c(['\n    :host,\ndetails {\n  display: inline-flex;\n  overflow: visible;\n}\n\n:host([hidden]) {\n  display: none !important;\n}\n\nsummary {\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  font-size: var(--a11y-details-summary-fontSize, 0.8em);\n  color: var(--a11y-details-summary-color, #000);\n  background-color: var(--a11y-details-summary-backgroundColor, #fff);\n  border-color: var(--a11y-details-summary-borderColor, #ddd);\n  border-width: var(--a11y-details-summary-borderWidth, 1px);\n  border-style: var(--a11y-details-summary-borderStyle, solid);\n  border-radius: var(--a11y-details-summary-borderRadius, 3px);\n  padding: var(--a11y-details-summary-padding, 0.5em);\n}\n\nsummary:focus {\n  outline: var(--a11y-details-summary-focus-outline,1px solid #006688);\n  color: var(--a11y-details-summary-focus-color, var(--a11y-details-summary-color,#000));\n  background-color: var(--a11y-details-summary-focus-backgroundColor, var(--a11y-details-summary-backgroundColor,#fff));\n  border-color: var(--a11y-details-summary-focus-borderColor, var(--a11y-details-borderColor,#999));\n  border-width: var(--a11y-details-summary-focus-borderWidth, var(--a11y-details-summary-borderWidth,1px));\n  border-style: var(--a11y-details-summary-focus-borderStyle, var(--a11y-details-summary-borderStyle, dotted));\n  border-radius: var(--a11y-details-summary-focus-borderRadius, var(--a11y-details-summary-borderRadius, 3px));\n}\n\n#details-inner {\n  position: absolute;\n  display: none;\n  max-height: 0px;\n  transition: all 0.7s ease-in-out 0.2s;\n  overflow-y: auto;\n  padding: 0;\n  font-size: var(--a11y-details-fontSize, 0.8em);\n  color: var(--a11y-details-color,#000);\n  background-color: var(--a11y-details-backgroundColor, rgba(255,255,255,0.8));\n  border-color: var(--a11y-details-borderColor,#999);\n  border-width: var(--a11y-details-borderWidth,1px);\n  border-style: var(--a11y-details-borderStyle, solid);\n  border-radius: var(--a11y-details-borderRadius, 3px);\n}\n\n::slotted(*:not[slot=summary]) {\n  display: none;\n}\n\n.close-text,\ndetails[open] .open-text,\ndetails:not([open]) .has-open-text,\ndetails[open] .has-close-text {\n  display: none;\n}\n\ndetails[open] .close-text {\n  display: inline;\n}\n\n::slotted([slot="details"]) {\n  display: block;\n  height: auto;\n  max-height: 0;\n  overflow: hidden;\n  transition: all 0.7s ease-in-out 0.2s;\n}\n\ndetails[open] ::slotted([slot="details"]) {\n  max-height: var(--a11y-details-maxHeight,400px);\n  transition: all 0.7s ease-in-out 0.2s;\n}\n\ndetails[open] #details-inner {\n  z-index: 9999999999;\n  display: block;\n  left: var(--a11y-details-left, unset);\n  right: var(--a11y-details-right, unset);\n  padding: var(--a11y-details-padding, 0.5em);\n  max-height: var(--a11y-details-maxHeight,400px);\n  padding: var(--a11y-details-padding, 0.5em);\n  width: calc(auto - 2 * var(--a11y-details-padding, 0.5em));\n  transition: all 0.7s ease-in-out 0.2s;\n}\n          '])))]}},{key:"haxProperties",get:function(){return{canScale:!0,canPosition:!0,canEditSource:!0,gizmo:{title:"Accessible Details Button",description:"Accessible progressive disclosure with detail and summary",icon:"icons:arrow-drop-down",color:"grey",groups:["11"],handles:[{type:""}],meta:{author:"nikkimk",owner:"The Pennsylvania State University"}},settings:{configure:[{slot:"summary",title:"Button",description:'Summary of the content that if concealed, eg. "info", "medatadata", etc. ',inputMethod:"code-editor"},{slot:"details",title:"Decription",description:"Detailed description that can be hidden or shown",inputMethod:"code-editor"},{slot:"",title:"Decription Button",description:'Default for button that shows/hides description text, eg. "info", "medatadata", etc. ',inputMethod:"code-editor"}],advanced:[{property:"openText",title:"Optional summary text when details are open",inputMethod:"textfield",required:!1},{property:"closeText",title:"Optional summary text when details are closed",inputMethod:"textfield",required:!1}]},demoSchema:[{tag:"a11y-details",properties:{openText:"Show Aenean",closeText:"Hide Aenean"},content:'<div slot="summary">Show Aenean</div>\n<div slot="details">Aenean eget nisl volutpat, molestie purus eget, bibendum metus. Pellentesque magna velit, tincidunt quis pharetra id, gravida placerat erat. Maecenas id dui pretium risus pulvinar feugiat vel nec leo. Praesent non congue tellus. Suspendisse ac tincidunt purus. Donec eu dui a metus vehicula bibendum sed nec tortor. Nunc convallis justo sed nibh consectetur, at pharetra nulla accumsan.\n</div>'}]}}},{key:"properties",get:function(){return r(r({},u(a(h),"properties",this)),{},{closeText:{type:String,attribute:"close-text",reflect:!0},openText:{type:String,attribute:"open-text",reflect:!0}})}}],(i=[{key:"render",value:function(){return t.html(p||(p=c(['\n    \n    <details id="details">\n  <summary \n    @click="','"  \n    @keyup="','" \n    tabindex="0"\n    role="button">\n    <span class="open-text">','</span>\n    <span class="close-text">','</span>\n    <slot name="summary" class="','"></slot>\n  </summary>\n  <div id="details-inner"><slot name="details"></slot></div>\n</details>\n<slot hidden></slot>'])),this._handleClick,this._handleKeyup,this.openText,this.closeText,this.summaryClasses)}},{key:"tag",value:function(){return"a11y-details"}},{key:"disconnectedCallback",value:function(){this.observer&&this.observer.disconnect&&this.observer.disconnect(),u(a(h.prototype),"disconnectedCallback",this).call(this)}},{key:"firstUpdated",value:function(){u(a(h.prototype),"firstUpdated",this)&&u(a(h.prototype),"firstUpdated",this).call(this),this._updateElement(),this.observer.observe(this,{childList:!0,subtree:!0})}},{key:"details",get:function(){return this&&this.shadowRoot&&this.shadowRoot.querySelector("details")?this.shadowRoot.querySelector("details"):void 0}},{key:"summaryClasses",get:function(){return[this.openText&&this.openText.trim&&""!==this.openText.trim()?"has-open-text":"",this.closeText&&this.closeText.trim&&""!==this.closeText.trim()?"has-close-text":""].join(" ")}},{key:"observer",get:function(){var e=this;return new MutationObserver((function(t){return e._watchChildren(t)}))}},{key:"detailsObserver",get:function(){var e=this;return new MutationObserver((function(){return e._updateElement()}))}},{key:"_handleClick",value:function(e){this.details&&void 0===this.details.open&&(this.toggleOpen(),e.preventDefault(),e.stopPropagation())}},{key:"_handleKeyup",value:function(e){(this.details&&void 0===this.details.open&&13==e.keyCode||32==e.keyCode)&&(this.toggleOpen(),e.preventDefault(),e.stopPropagation())}},{key:"toggleOpen",value:function(){this.details.hasAttribute("open")?(this.details.removeAttribute("open"),this.details.open&&(this.details.open=!1)):(this.details.setAttribute("open",""),this.details.open&&(this.details.open=!0))}},{key:"_updateElement",value:function(){var e=this.querySelector("* > details"),t=e?e.querySelector("* > summary"):void 0;if(t&&this._copyToSlot("summary",t.cloneNode(!0)),e){var n=e.cloneNode(!0),r=n.querySelectorAll("* > summary");Object.keys(r||{}).forEach((function(e){return r[e].remove()})),this._copyToSlot("details",n,"div")}}},{key:"_watchChildren",value:function(e){this._hasMutations(e)?(this._updateElement(),this.detailsObserver.observe(this.querySelector("* > details"),{childList:!0,subtree:!0,characterData:!0})):this._hasMutations(e,"removedNodes")&&!this.querySelector("* > details")&&this.detailsObserver.disconnect&&this.detailsObserver.disconnect()}},{key:"_hasMutations",value:function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"addedNodes";return Object.keys(e||{}).filter((function(n){var r=e[n][t];return Object.keys(r||{}).filter((function(e){return"DETAILS"===r[e].tagName})).length>0})).length>0}},{key:"_copyToSlot",value:function(e,t){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"span",r=Object.keys(t.childNodes||{}).filter((function(e){var n=t.childNodes[e];return!!n.tagName||n.textContent.trim().length>0})).map((function(e){return t.childNodes[parseInt(e)]}));1===r.length&&r[0].tagName&&(n=(t=r[0]).tagName);var o=this._getSlot(e,n);o.innerHTML=t.innerHTML,t.remove()}},{key:"_getSlot",value:function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"span",n=this.querySelector("[slot=".concat(e,"]"));return n&&n.tagName!==t&&n.remove(),n||((n=document.createElement(t)).slot=e,this.append(n)),n}}])&&o(n.prototype,i),l&&o(n,l),h}(t.LitElement);customElements.define("a11y-details",f),e.A11yDetails=f,Object.defineProperty(e,"__esModule",{value:!0})}));
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("lit")):"function"==typeof define&&define.amd?define(["exports","lit"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).A11yDetails={},e.lit)}(this,(function(e,t){"use strict";function n(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function r(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?n(Object(r),!0).forEach((function(t){i(e,t,r[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):n(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}function o(e,t){for(var n=0;n<t.length;n++){var r=t[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function i(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function a(e){return a=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)},a(e)}function s(e,t){return s=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e},s(e,t)}function l(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)}function d(e){var t=function(){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}}();return function(){var n,r=a(e);if(t){var o=a(this).constructor;n=Reflect.construct(r,arguments,o)}else n=r.apply(this,arguments);return l(this,n)}}function u(e,t){for(;!Object.prototype.hasOwnProperty.call(e,t)&&null!==(e=a(e)););return e}function c(){return c="undefined"!=typeof Reflect&&Reflect.get?Reflect.get:function(e,t,n){var r=u(e,t);if(r){var o=Object.getOwnPropertyDescriptor(r,t);return o.get?o.get.call(arguments.length<3?e:n):o.value}},c.apply(this,arguments)}function p(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}))}var y,f,h=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}}),t&&s(e,t)}(h,e);var n,i,l,u=d(h);function h(){var e;return function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,h),(e=u.call(this)).closeText="",e.openText="",e.tag=h.tag,e}return n=h,i=[{key:"render",value:function(){return t.html(y||(y=p(['\n    \n    <details id="details">\n  <summary \n    @click="','"  \n    @keyup="','" \n    tabindex="0"\n    role="button">\n    <span class="open-text">','</span>\n    <span class="close-text">','</span>\n    <slot name="summary" class="','"></slot>\n  </summary>\n  <div id="details-inner"><slot name="details"></slot></div>\n</details>\n<slot hidden></slot>'])),this._handleClick,this._handleKeyup,this.openText,this.closeText,this.summaryClasses)}},{key:"tag",value:function(){return"a11y-details"}},{key:"disconnectedCallback",value:function(){this.observer&&this.observer.disconnect&&this.observer.disconnect(),c(a(h.prototype),"disconnectedCallback",this).call(this)}},{key:"firstUpdated",value:function(){c(a(h.prototype),"firstUpdated",this)&&c(a(h.prototype),"firstUpdated",this).call(this),this._updateElement(),this.observer.observe(this,{childList:!0,subtree:!0})}},{key:"details",get:function(){return this&&this.shadowRoot&&this.shadowRoot.querySelector("details")?this.shadowRoot.querySelector("details"):void 0}},{key:"summaryClasses",get:function(){return[this.openText&&this.openText.trim&&""!==this.openText.trim()?"has-open-text":"",this.closeText&&this.closeText.trim&&""!==this.closeText.trim()?"has-close-text":""].join(" ")}},{key:"observer",get:function(){var e=this;return new MutationObserver((function(t){return e._watchChildren(t)}))}},{key:"detailsObserver",get:function(){var e=this;return new MutationObserver((function(){return e._updateElement()}))}},{key:"_handleClick",value:function(e){this.details&&void 0===this.details.open&&(this.toggleOpen(),e.preventDefault(),e.stopPropagation())}},{key:"_handleKeyup",value:function(e){(this.details&&void 0===this.details.open&&13==e.keyCode||32==e.keyCode)&&(this.toggleOpen(),e.preventDefault(),e.stopPropagation())}},{key:"toggleOpen",value:function(){this.details.hasAttribute("open")?(this.details.removeAttribute("open"),this.details.open&&(this.details.open=!1)):(this.details.setAttribute("open",""),this.details.open&&(this.details.open=!0))}},{key:"_updateElement",value:function(){var e=this.querySelector("* > details"),t=e?e.querySelector("* > summary"):void 0;if(t&&this._copyToSlot("summary",t.cloneNode(!0)),e){var n=e.cloneNode(!0),r=n.querySelectorAll("* > summary");Object.keys(r||{}).forEach((function(e){return r[e].remove()})),this._copyToSlot("details",n,"div")}}},{key:"_watchChildren",value:function(e){this._hasMutations(e)?(this._updateElement(),this.detailsObserver.observe(this.querySelector("* > details"),{childList:!0,subtree:!0,characterData:!0})):this._hasMutations(e,"removedNodes")&&!this.querySelector("* > details")&&this.detailsObserver.disconnect&&this.detailsObserver.disconnect()}},{key:"_hasMutations",value:function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"addedNodes";return Object.keys(e||{}).filter((function(n){var r=e[n][t];return Object.keys(r||{}).filter((function(e){return"DETAILS"===r[e].tagName})).length>0})).length>0}},{key:"_copyToSlot",value:function(e,t){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"span",r=Object.keys(t.childNodes||{}).filter((function(e){var n=t.childNodes[e];return!!n.tagName||n.textContent.trim().length>0})).map((function(e){return t.childNodes[parseInt(e)]}));1===r.length&&r[0].tagName&&(n=(t=r[0]).tagName);var o=this._getSlot(e,n);o.innerHTML=t.innerHTML,t.remove()}},{key:"_getSlot",value:function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"span",n=this.querySelector("[slot=".concat(e,"]"));return n&&n.tagName!==t&&n.remove(),n||((n=document.createElement(t)).slot=e,this.append(n)),n}}],l=[{key:"styles",get:function(){return[t.css(f||(f=p(['\n    :host,\ndetails {\n  display: inline-flex;\n  overflow: visible;\n}\n\n:host([hidden]) {\n  display: none !important;\n}\n\nsummary {\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  font-size: var(--a11y-details-summary-fontSize, 0.8em);\n  color: var(--a11y-details-summary-color, #000);\n  background-color: var(--a11y-details-summary-backgroundColor, #fff);\n  border-color: var(--a11y-details-summary-borderColor, #ddd);\n  border-width: var(--a11y-details-summary-borderWidth, 1px);\n  border-style: var(--a11y-details-summary-borderStyle, solid);\n  border-radius: var(--a11y-details-summary-borderRadius, 3px);\n  padding: var(--a11y-details-summary-padding, 0.5em);\n}\n\nsummary:focus {\n  outline: var(--a11y-details-summary-focus-outline,1px solid #006688);\n  color: var(--a11y-details-summary-focus-color, var(--a11y-details-summary-color,#000));\n  background-color: var(--a11y-details-summary-focus-backgroundColor, var(--a11y-details-summary-backgroundColor,#fff));\n  border-color: var(--a11y-details-summary-focus-borderColor, var(--a11y-details-borderColor,#999));\n  border-width: var(--a11y-details-summary-focus-borderWidth, var(--a11y-details-summary-borderWidth,1px));\n  border-style: var(--a11y-details-summary-focus-borderStyle, var(--a11y-details-summary-borderStyle, dotted));\n  border-radius: var(--a11y-details-summary-focus-borderRadius, var(--a11y-details-summary-borderRadius, 3px));\n}\n\n#details-inner {\n  position: absolute;\n  display: none;\n  max-height: 0px;\n  transition: all 0.7s ease-in-out 0.2s;\n  overflow-y: auto;\n  padding: 0;\n  font-size: var(--a11y-details-fontSize, 0.8em);\n  color: var(--a11y-details-color,#000);\n  background-color: var(--a11y-details-backgroundColor, rgba(255,255,255,0.8));\n  border-color: var(--a11y-details-borderColor,#999);\n  border-width: var(--a11y-details-borderWidth,1px);\n  border-style: var(--a11y-details-borderStyle, solid);\n  border-radius: var(--a11y-details-borderRadius, 3px);\n}\n\n::slotted(*:not[slot=summary]) {\n  display: none;\n}\n\n.close-text,\ndetails[open] .open-text,\ndetails:not([open]) .has-open-text,\ndetails[open] .has-close-text {\n  display: none;\n}\n\ndetails[open] .close-text {\n  display: inline;\n}\n\n::slotted([slot="details"]) {\n  display: block;\n  height: auto;\n  max-height: 0;\n  overflow: hidden;\n  transition: all 0.7s ease-in-out 0.2s;\n}\n\ndetails[open] ::slotted([slot="details"]) {\n  max-height: var(--a11y-details-maxHeight,400px);\n  transition: all 0.7s ease-in-out 0.2s;\n}\n\ndetails[open] #details-inner {\n  z-index: 9999999999;\n  display: block;\n  left: var(--a11y-details-left, unset);\n  right: var(--a11y-details-right, unset);\n  padding: var(--a11y-details-padding, 0.5em);\n  max-height: var(--a11y-details-maxHeight,400px);\n  padding: var(--a11y-details-padding, 0.5em);\n  width: calc(auto - 2 * var(--a11y-details-padding, 0.5em));\n  transition: all 0.7s ease-in-out 0.2s;\n}\n          '])))]}},{key:"haxProperties",get:function(){return{canScale:!0,canPosition:!0,canEditSource:!0,gizmo:{title:"Accessible Details Button",description:"Accessible progressive disclosure with detail and summary",icon:"icons:arrow-drop-down",color:"grey",groups:["11"],handles:[{type:""}],meta:{author:"nikkimk",owner:"The Pennsylvania State University"}},settings:{configure:[{slot:"summary",title:"Button",description:'Summary of the content that if concealed, eg. "info", "medatadata", etc. ',inputMethod:"code-editor"},{slot:"details",title:"Decription",description:"Detailed description that can be hidden or shown",inputMethod:"code-editor"},{slot:"",title:"Decription Button",description:'Default for button that shows/hides description text, eg. "info", "medatadata", etc. ',inputMethod:"code-editor"}],advanced:[{property:"openText",title:"Optional summary text when details are open",inputMethod:"textfield",required:!1},{property:"closeText",title:"Optional summary text when details are closed",inputMethod:"textfield",required:!1}]},demoSchema:[{tag:"a11y-details",properties:{openText:"Show Aenean",closeText:"Hide Aenean"},content:'<div slot="summary">Show Aenean</div>\n<div slot="details">Aenean eget nisl volutpat, molestie purus eget, bibendum metus. Pellentesque magna velit, tincidunt quis pharetra id, gravida placerat erat. Maecenas id dui pretium risus pulvinar feugiat vel nec leo. Praesent non congue tellus. Suspendisse ac tincidunt purus. Donec eu dui a metus vehicula bibendum sed nec tortor. Nunc convallis justo sed nibh consectetur, at pharetra nulla accumsan.\n</div>'}]}}},{key:"properties",get:function(){return r(r({},c(a(h),"properties",this)),{},{closeText:{type:String,attribute:"close-text",reflect:!0},openText:{type:String,attribute:"open-text",reflect:!0}})}}],i&&o(n.prototype,i),l&&o(n,l),h}(t.LitElement);customElements.define("a11y-details",h),e.A11yDetails=h,Object.defineProperty(e,"__esModule",{value:!0})}));

package.json

@@ -19,3 +19,3 @@ {
   },
-  "version": "4.0.4",
+  "version": "4.0.5",
   "description": "accessible progressive disclosure with detail and summary",
@@ -34,7 +34,6 @@ "repository": {
     "watch": "gulp dev --gulpfile=gulpfile.cjs",
-    "serve": "es-dev-server -c ../../es-dev-server.config.js",
+    "serve": "web-dev-server -c ../../web-dev-server.config.js",
     "lighthouse": "gulp lighthouse --gulpfile=gulpfile.cjs",
-    "test": "web-test-runner \"test/**/*.test.js\" --node-resolve --config=../../web-test-runner.config.mjs",
-    "test:watch": "web-test-runner \"test/**/*.test.js\" --node-resolve --config=../../web-test-runner.config.mjs --watch",
-    "test:browsers": "web-test-runner \"test/**/*.test.js\" --node-resolve --config=../../web-test-runner.config.mjs --playwright --browsers chromium firefox webkit"
+    "test:watch": "web-test-runner \"test/**/*.test.js\" --node-resolve --config=../../web-test-runner.config.mjs --playwright --browsers chromium firefox --watch",
+    "test": "web-test-runner \"test/**/*.test.js\" --node-resolve --config=../../web-test-runner.config.mjs --playwright --browsers chromium firefox"
   },
@@ -46,14 +45,11 @@ "author": {
   "dependencies": {
-    "@lrnwebcomponents/absolute-position-behavior": "^4.0.4",
-    "lit": "2.0.0"
+    "@lrnwebcomponents/absolute-position-behavior": "^4.0.5",
+    "lit": "^2.0.2"
   },
   "devDependencies": {
     "@lrnwebcomponents/deduping-fix": "^4.0.0",
-    "@open-wc/testing": "2.5.33",
+    "@open-wc/testing": "3.0.3",
     "@polymer/iron-component-page": "github:PolymerElements/iron-component-page",
     "@polymer/iron-demo-helpers": "3.1.0",
-    "@web/test-runner": "0.13.5",
-    "@web/test-runner-commands": "0.4.5",
-    "@web/test-runner-playwright": "0.8.6",
-    "@web/test-runner-puppeteer": "0.10.0",
+    "@web/dev-server": "0.1.28",
     "@webcomponents/webcomponentsjs": "2.6.0",
@@ -63,4 +59,2 @@ "concurrently": "5.3.0",
     "lodash": "^4.17.21",
-    "polymer-build": "3.1.4",
-    "polymer-cli": "1.9.11",
     "wct-browser-legacy": "1.0.2",
@@ -78,3 +72,3 @@ "web-animations-js": "2.3.2"
   ],
-  "gitHead": "d4cd14c5c57b408201bf4fa8f41d714de8b88f11"
+  "gitHead": "ca4a1abb2fc0e1822268b994850d371d92e0df54"
 }

test/a11y-details.test.js

@@ -1,28 +0,19 @@
-import {
-  expect,
-  fixture,
-  html,
-  assert,
-  elementUpdated,
-  fixtureCleanup,
-} from "@open-wc/testing";
-import { setViewport } from "@web/test-runner-commands";
+import { fixture, expect, html } from "@open-wc/testing";
+
 import "../a11y-details.js";
 
-/*
- * Instantiation test
- * create element and see if an attribute binds to the element
- */
-describe("Instantiation Test", () => {
-  it("a11y-details instantiates", async () => {
-    const el = await fixture(
+describe("a11y-details test", () => {
+  let element;
+  beforeEach(async () => {
+    element = await fixture(
       html` <a11y-details title="test-title"></a11y-details> `
     );
-    await expect(el.getAttribute("title")).to.equal("test-title");
   });
+
+  it("passes the a11y audit", async () => {
+    await expect(element).shadowDom.to.be.accessible();
+  });
 });
 
 /*
- * A11y Accessibility tests
- */
 describe("A11y/chai axe tests", () => {
@@ -81,6 +72,1 @@ it("a11y-details passes accessibility test", async () => {
 }) */
-
-// clean up fixtures after all tests are complete
-afterEach(() => {
-  fixtureCleanup();
-});

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

87760

increased by17.63%

Dev dependency count

11

decreased by-31.25%

Number of package files

21

increased by5%

Lines of code

1781

increased by36.27%

Dependency changes

• - Removedlit@2.0.0(transitive)

• Updated@lrnwebcomponents/absolute-position-behavior@^4.0.5

• Updatedlit@^2.0.2