@esri/calcite-components 1.0.0-next.399 → 1.0.0-next.401

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (111) hide show
  1. package/dist/calcite/assets/date-picker/nls/bs.json +1 -1
  2. package/dist/calcite/assets/date-picker/nls/ca.json +1 -1
  3. package/dist/calcite/assets/date-picker/nls/cs.json +1 -1
  4. package/dist/calcite/assets/date-picker/nls/da.json +1 -1
  5. package/dist/calcite/assets/date-picker/nls/de.json +1 -1
  6. package/dist/calcite/assets/date-picker/nls/el.json +1 -1
  7. package/dist/calcite/assets/date-picker/nls/en-AU.json +1 -1
  8. package/dist/calcite/assets/date-picker/nls/es.json +1 -1
  9. package/dist/calcite/assets/date-picker/nls/et.json +1 -1
  10. package/dist/calcite/assets/date-picker/nls/fi.json +1 -1
  11. package/dist/calcite/assets/date-picker/nls/fr.json +1 -1
  12. package/dist/calcite/assets/date-picker/nls/hr.json +1 -1
  13. package/dist/calcite/assets/date-picker/nls/hu.json +1 -1
  14. package/dist/calcite/assets/date-picker/nls/it.json +1 -1
  15. package/dist/calcite/assets/date-picker/nls/lt.json +1 -1
  16. package/dist/calcite/assets/date-picker/nls/lv.json +1 -1
  17. package/dist/calcite/assets/date-picker/nls/mk.json +1 -1
  18. package/dist/calcite/assets/date-picker/nls/nb.json +1 -1
  19. package/dist/calcite/assets/date-picker/nls/nl.json +1 -1
  20. package/dist/calcite/assets/date-picker/nls/pl.json +1 -1
  21. package/dist/calcite/assets/date-picker/nls/ro.json +1 -1
  22. package/dist/calcite/assets/date-picker/nls/ru.json +1 -1
  23. package/dist/calcite/assets/date-picker/nls/sl.json +1 -1
  24. package/dist/calcite/assets/date-picker/nls/sr.json +1 -1
  25. package/dist/calcite/assets/date-picker/nls/sv.json +1 -1
  26. package/dist/calcite/assets/date-picker/nls/tr.json +1 -1
  27. package/dist/calcite/assets/date-picker/nls/uk.json +1 -1
  28. package/dist/calcite/assets/date-picker/nls/vi.json +1 -1
  29. package/dist/calcite/calcite.esm.js +1 -1
  30. package/dist/calcite/p-02219f56.system.entry.js +5 -0
  31. package/dist/calcite/p-233fae89.entry.js +5 -0
  32. package/dist/calcite/p-26aea1cb.system.js +1 -1
  33. package/dist/calcite/p-496d3b56.system.entry.js +5 -0
  34. package/dist/calcite/p-674bdae8.system.entry.js +5 -0
  35. package/dist/calcite/p-677592a9.system.entry.js +5 -0
  36. package/dist/calcite/p-779c6e3b.system.entry.js +5 -0
  37. package/dist/calcite/{p-a1a38c68.entry.js → p-95368cd1.entry.js} +1 -1
  38. package/dist/calcite/p-a5f8f3a1.entry.js +5 -0
  39. package/dist/calcite/p-ac33eb33.entry.js +5 -0
  40. package/dist/calcite/p-b9bfd3f8.entry.js +5 -0
  41. package/dist/cjs/calcite-accordion_2.cjs.entry.js +13 -4
  42. package/dist/cjs/calcite-block_2.cjs.entry.js +15 -7
  43. package/dist/cjs/calcite-popover_2.cjs.entry.js +1 -1
  44. package/dist/cjs/calcite-tooltip_2.cjs.entry.js +1 -1
  45. package/dist/cjs/calcite-tree_2.cjs.entry.js +4 -2
  46. package/dist/collection/components/accordion-item/accordion-item.js +13 -3
  47. package/dist/collection/components/block/block.js +7 -2
  48. package/dist/collection/components/block-section/block-section.js +12 -7
  49. package/dist/collection/components/date-picker/assets/date-picker/nls/bs.json +1 -1
  50. package/dist/collection/components/date-picker/assets/date-picker/nls/ca.json +1 -1
  51. package/dist/collection/components/date-picker/assets/date-picker/nls/cs.json +1 -1
  52. package/dist/collection/components/date-picker/assets/date-picker/nls/da.json +1 -1
  53. package/dist/collection/components/date-picker/assets/date-picker/nls/de.json +1 -1
  54. package/dist/collection/components/date-picker/assets/date-picker/nls/el.json +1 -1
  55. package/dist/collection/components/date-picker/assets/date-picker/nls/en-AU.json +1 -1
  56. package/dist/collection/components/date-picker/assets/date-picker/nls/es.json +1 -1
  57. package/dist/collection/components/date-picker/assets/date-picker/nls/et.json +1 -1
  58. package/dist/collection/components/date-picker/assets/date-picker/nls/fi.json +1 -1
  59. package/dist/collection/components/date-picker/assets/date-picker/nls/fr.json +1 -1
  60. package/dist/collection/components/date-picker/assets/date-picker/nls/hr.json +1 -1
  61. package/dist/collection/components/date-picker/assets/date-picker/nls/hu.json +1 -1
  62. package/dist/collection/components/date-picker/assets/date-picker/nls/it.json +1 -1
  63. package/dist/collection/components/date-picker/assets/date-picker/nls/lt.json +1 -1
  64. package/dist/collection/components/date-picker/assets/date-picker/nls/lv.json +1 -1
  65. package/dist/collection/components/date-picker/assets/date-picker/nls/mk.json +1 -1
  66. package/dist/collection/components/date-picker/assets/date-picker/nls/nb.json +1 -1
  67. package/dist/collection/components/date-picker/assets/date-picker/nls/nl.json +1 -1
  68. package/dist/collection/components/date-picker/assets/date-picker/nls/pl.json +1 -1
  69. package/dist/collection/components/date-picker/assets/date-picker/nls/ro.json +1 -1
  70. package/dist/collection/components/date-picker/assets/date-picker/nls/ru.json +1 -1
  71. package/dist/collection/components/date-picker/assets/date-picker/nls/sl.json +1 -1
  72. package/dist/collection/components/date-picker/assets/date-picker/nls/sr.json +1 -1
  73. package/dist/collection/components/date-picker/assets/date-picker/nls/sv.json +1 -1
  74. package/dist/collection/components/date-picker/assets/date-picker/nls/tr.json +1 -1
  75. package/dist/collection/components/date-picker/assets/date-picker/nls/uk.json +1 -1
  76. package/dist/collection/components/date-picker/assets/date-picker/nls/vi.json +1 -1
  77. package/dist/collection/components/popover/popover.css +5 -0
  78. package/dist/collection/components/tooltip/tooltip.css +5 -0
  79. package/dist/collection/components/tree/tree.js +4 -2
  80. package/dist/components/calcite-accordion-item.js +13 -3
  81. package/dist/components/calcite-block-section.js +10 -5
  82. package/dist/components/calcite-block.js +7 -2
  83. package/dist/components/calcite-tooltip.js +1 -1
  84. package/dist/components/calcite-tree.js +4 -2
  85. package/dist/components/popover.js +1 -1
  86. package/dist/custom-elements/index.js +32 -13
  87. package/dist/esm/calcite-accordion_2.entry.js +13 -4
  88. package/dist/esm/calcite-block_2.entry.js +15 -7
  89. package/dist/esm/calcite-popover_2.entry.js +1 -1
  90. package/dist/esm/calcite-tooltip_2.entry.js +1 -1
  91. package/dist/esm/calcite-tree_2.entry.js +4 -2
  92. package/dist/esm-es5/calcite-accordion_2.entry.js +1 -1
  93. package/dist/esm-es5/calcite-block_2.entry.js +1 -1
  94. package/dist/esm-es5/calcite-popover_2.entry.js +1 -1
  95. package/dist/esm-es5/calcite-tooltip_2.entry.js +1 -1
  96. package/dist/esm-es5/calcite-tree_2.entry.js +1 -1
  97. package/dist/extras/docs-json.json +1 -1
  98. package/dist/types/components/accordion-item/accordion-item.d.ts +1 -0
  99. package/dist/types/components/block/block.d.ts +1 -0
  100. package/dist/types/components/block-section/block-section.d.ts +1 -0
  101. package/hydrate/index.js +32 -13
  102. package/package.json +2 -2
  103. package/dist/calcite/p-0db51b2f.entry.js +0 -5
  104. package/dist/calcite/p-13cbacc6.system.entry.js +0 -5
  105. package/dist/calcite/p-240099ff.entry.js +0 -5
  106. package/dist/calcite/p-6eb1302b.entry.js +0 -5
  107. package/dist/calcite/p-7415264e.system.entry.js +0 -5
  108. package/dist/calcite/p-9aaeb1df.entry.js +0 -5
  109. package/dist/calcite/p-c3f5a7c2.system.entry.js +0 -5
  110. package/dist/calcite/p-d75351e1.system.entry.js +0 -5
  111. package/dist/calcite/p-e5e29b32.system.entry.js +0 -5
@@ -0,0 +1,5 @@
1
+ /*!
2
+ * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
3
+ * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
4
+ */
5
+ import{r as t,c as e,h as i,H as a,g as n}from"./p-2e29554c.js";import{f as o,n as r,g as c,a as s,C as l,k as m}from"./p-8f3a3e4e.js";import{c as h,d}from"./p-ea510477.js";import"./p-8a63221d.js";import"./p-0a5d059d.js";var f;!function(t){t.Single="single",t.Multi="multi",t.Children="children",t.MultiChildren="multi-children",t.Ancestors="ancestors"}(f||(f={}));let p=class{constructor(i){t(this,i),this.calciteTreeSelect=e(this,"calciteTreeSelect",7),this.lines=!1,this.inputEnabled=!1,this.scale="m",this.selectionMode=f.Single}componentWillRender(){const t=this.el.parentElement.closest("calcite-tree");this.lines=t?t.lines:this.lines,this.scale=t?t.scale:this.scale,this.selectionMode=t?t.selectionMode:this.selectionMode,this.child=!!t}render(){return i(a,{"aria-multiselectable":this.child?void 0:(this.selectionMode===f.Multi||this.selectionMode===f.MultiChildren).toString(),role:this.child?void 0:"tree",tabIndex:this.getRootTabIndex()},i("slot",null))}onFocus(){if(!this.child){const t=this.el.querySelector("calcite-tree-item[selected]")||this.el.querySelector("calcite-tree-item");o(t)}}onFocusIn(t){(t.relatedTarget===this.el||!this.el.contains(t.relatedTarget))&&this.el.removeAttribute("tabindex")}onFocusOut(t){!this.el.contains(t.relatedTarget)&&(this.el.tabIndex=this.getRootTabIndex())}onClick(t){const e=t.target,i=r(e.querySelectorAll("calcite-tree-item"));if(this.child)return;if(this.child||(t.preventDefault(),t.stopPropagation()),this.selectionMode===f.Ancestors&&!this.child)return void this.updateAncestorTree(t);const a=t.detail.modifyCurrentSelection&&(this.selectionMode===f.Multi||this.selectionMode===f.MultiChildren),n=this.selectionMode===f.MultiChildren||this.selectionMode===f.Children,o=!a&&((this.selectionMode===f.Single||this.selectionMode===f.Multi)&&i.length<=0||this.selectionMode===f.Children||this.selectionMode===f.MultiChildren),c=this.selectionMode===f.Children||this.selectionMode===f.MultiChildren;if(!this.child){const s=[];null!==this.selectionMode&&(!e.hasChildren||e.hasChildren&&(this.selectionMode===f.Children||this.selectionMode===f.MultiChildren))&&s.push(e),n&&i.forEach((t=>{s.push(t)})),o&&r(this.el.querySelectorAll("calcite-tree-item[selected]")).forEach((t=>{s.includes(t)||(t.selected=!1)})),c&&!t.detail.forceToggle&&(e.expanded=!0),a&&window.getSelection().removeAllRanges(),s.forEach(a&&e.selected||n&&t.detail.forceToggle?t=>{t.selected=!1}:t=>{t.selected=!0})}this.calciteTreeSelect.emit({selected:r(this.el.querySelectorAll("calcite-tree-item")).filter((t=>t.selected))})}updateAncestorTree(t){const e=t.target,i=e.querySelectorAll("calcite-tree-item"),a=[];let n=e.parentElement.closest("calcite-tree-item");for(;n;)a.push(n),n=n.parentElement.closest("calcite-tree-item");e.selected=!e.selected,e.indeterminate=!1,(null==i?void 0:i.length)&&i.forEach((t=>{t.selected=e.selected,t.indeterminate=!1})),a&&a.forEach((t=>{const e=r(t.querySelectorAll("calcite-tree-item")),i=e.filter((t=>t.selected));if(0===i.length)return t.selected=!1,void(t.indeterminate=!1);const a=i.length<e.length;t.indeterminate=a,t.selected=!a})),this.calciteTreeSelect.emit({selected:r(this.el.querySelectorAll("calcite-tree-item")).filter((t=>t.selected))})}getRootTabIndex(){return this.child?-1:0}get el(){return n(this)}};p.style="@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}.calcite-animate{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}.calcite-animate__in{-webkit-animation-name:in;animation-name:in}.calcite-animate__in-down{-webkit-animation-name:in-down;animation-name:in-down}.calcite-animate__in-up{-webkit-animation-name:in-up;animation-name:in-up}.calcite-animate__in-scale{-webkit-animation-name:in-scale;animation-name:in-scale}:root{--calcite-popper-transition:var(--calcite-animation-timing)}:host([hidden]){display:none}:host{display:block;outline:2px solid transparent;outline-offset:2px}";let k=class{constructor(i){t(this,i),this.calciteTreeItemSelect=e(this,"calciteTreeItemSelect",7),this.selected=!1,this.expanded=!1,this.parentExpanded=!1,this.depth=-1,this.hasChildren=null,this.iconClickHandler=t=>{t.stopPropagation(),this.expanded=!this.expanded,this.selectionMode!==f.Ancestors&&this.calciteTreeItemSelect.emit({modifyCurrentSelection:this.isSelectionMultiLike,forceToggle:!0})},this.childrenClickHandler=t=>t.stopPropagation(),this.updateParentIsExpanded=(t,e)=>{c(t,"children",{all:!0,selector:"calcite-tree-item"}).forEach((t=>t.parentExpanded=e))},this.updateAncestorTree=()=>{if(this.selected&&this.selectionMode===f.Ancestors){const t=[];let e=this.parentTreeItem;for(;e;)t.push(e),e=e.parentElement.closest("calcite-tree-item");t.forEach((t=>t.indeterminate=!0))}}}expandedHandler(t){this.updateParentIsExpanded(this.el,t)}getselectionMode(){this.isSelectionMultiLike=this.selectionMode===f.Multi||this.selectionMode===f.MultiChildren}connectedCallback(){if(this.parentTreeItem=this.el.parentElement.closest("calcite-tree-item"),this.parentTreeItem){const{expanded:t}=this.parentTreeItem;this.updateParentIsExpanded(this.parentTreeItem,t)}h(this)}disconnectedCallback(){d(this)}componentWillRender(){this.hasChildren=!!this.el.querySelector("calcite-tree"),this.depth=0;let t,e=this.el.closest("calcite-tree");if(e)for(this.selectionMode=e.selectionMode,this.scale=e.scale||"m",this.lines=e.lines;e&&(t=e.parentElement.closest("calcite-tree"),t!==e);)e=t,this.depth=this.depth+1}componentDidLoad(){this.updateAncestorTree()}render(){const t="rtl"===s(this.el),e=this.selectionMode===f.Single||this.selectionMode===f.Children,n=this.selectionMode===f.Multi||this.selectionMode===f.MultiChildren,o=this.hasChildren?i("calcite-icon",{class:{chevron:!0,[l.rtl]:t},"data-test-id":"icon",icon:"chevron-right",onClick:this.iconClickHandler,scale:"s"}):null,r=i("slot",{key:"default-slot"}),c=this.selectionMode===f.Ancestors?i("label",{class:"checkbox-label",key:"checkbox-label"},i("calcite-checkbox",{checked:this.selected,class:"checkbox","data-test-id":"checkbox",indeterminate:this.hasChildren&&this.indeterminate,scale:this.scale,tabIndex:-1}),r):null,m=e?"bullet-point":n?"check":null,h=m?i("calcite-icon",{class:{"bullet-point":"bullet-point"===m,checkmark:"check"===m,[l.rtl]:t},icon:m,scale:"s"}):null,d=!(this.parentExpanded||1===this.depth);return i(a,{"aria-expanded":this.hasChildren?this.expanded.toString():void 0,"aria-hidden":d.toString(),"aria-selected":this.selected?"true":n?"false":void 0,"calcite-hydrated-hidden":d,role:"treeitem",tabindex:this.parentExpanded||1===this.depth?"0":"-1"},i("div",{class:{"node-container":!0,[l.rtl]:t},"data-selection-mode":this.selectionMode,ref:t=>this.defaultSlotWrapper=t},o,h,c||r),i("div",{class:{"children-container":!0,[l.rtl]:t},"data-test-id":"calcite-tree-children",onClick:this.childrenClickHandler,ref:t=>this.childrenSlotWrapper=t,role:this.hasChildren?"group":void 0},i("slot",{name:"children"})))}onClick(t){const[e]=m(this.el,"a");e&&"a"!==t.composedPath()[0].tagName.toLowerCase()&&window.open(e.href,""===e.target?"_self":e.target),this.calciteTreeItemSelect.emit({modifyCurrentSelection:this.selectionMode===f.Ancestors||this.isSelectionMultiLike,forceToggle:!1})}keyDownHandler(t){let e;switch(t.key){case" ":this.calciteTreeItemSelect.emit({modifyCurrentSelection:this.isSelectionMultiLike,forceToggle:!1}),t.preventDefault(),t.stopPropagation();break;case"Enter":const i=r(this.el.children).find((t=>t.matches("a")));i?(i.click(),this.selected=!0):this.calciteTreeItemSelect.emit({modifyCurrentSelection:this.isSelectionMultiLike,forceToggle:!1}),t.preventDefault(),t.stopPropagation();break;case"ArrowLeft":if(this.hasChildren&&this.expanded){this.expanded=!1,t.preventDefault(),t.stopPropagation();break}const a=this.parentTreeItem;if(a&&(!this.hasChildren||!1===this.expanded)){a.focus(),t.preventDefault(),t.stopPropagation();break}break;case"ArrowRight":if(this.hasChildren&&!1===this.expanded){this.expanded=!0,t.preventDefault(),t.stopPropagation();break}if(this.hasChildren&&this.expanded){this.el.querySelector("calcite-tree-item").focus();break}break;case"ArrowUp":const n=this.el.previousElementSibling;n&&n.matches("calcite-tree-item")&&n.focus();break;case"ArrowDown":const o=this.el.nextElementSibling;o&&o.matches("calcite-tree-item")&&o.focus();break;case"Home":e=this.el.closest("calcite-tree:not([child])"),e.querySelector("calcite-tree-item").focus();break;case"End":e=this.el.closest("calcite-tree:not([child])");let c=e.children[e.children.length-1],s=r(c.children).find((t=>t.matches("calcite-tree")));for(;s;)c=s.children[e.children.length-1],s=r(c.children).find((t=>t.matches("calcite-tree")));c.focus()}}get el(){return n(this)}static get watchers(){return{expanded:["expandedHandler"],selectionMode:["getselectionMode"]}}};k.style='@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}.calcite-animate{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}.calcite-animate__in{-webkit-animation-name:in;animation-name:in}.calcite-animate__in-down{-webkit-animation-name:in-down;animation-name:in-down}.calcite-animate__in-up{-webkit-animation-name:in-up;animation-name:in-up}.calcite-animate__in-scale{-webkit-animation-name:in-scale;animation-name:in-scale}:root{--calcite-popper-transition:var(--calcite-animation-timing)}:host([hidden]){display:none}:host{display:block;max-width:100%;cursor:pointer;color:var(--calcite-ui-text-3);outline:2px solid transparent;outline-offset:2px}:host([scale=s]){font-size:var(--calcite-font-size--2);line-height:1rem}:host([scale=s]) .node-container{--calcite-tree-padding-y:0.25rem}:host([scale=s]) .node-container .checkbox,:host([scale=s]) .node-container .chevron,:host([scale=s]) .node-container .checkmark,:host([scale=s]) .node-container .bullet-point{margin-inline:0.25rem}:host([scale=m]){font-size:var(--calcite-font-size--1);line-height:1rem}:host([scale=m]) .node-container{--calcite-tree-padding-y:0.5rem}:host([scale=m]) .node-container .checkbox,:host([scale=m]) .node-container .chevron,:host([scale=m]) .node-container .checkmark,:host([scale=m]) .node-container .bullet-point{margin-inline:0.5rem}:host([scale=l]){font-size:var(--calcite-font-size-0);line-height:1.25rem}:host([scale=l]) .node-container{--calcite-tree-padding-y:0.75rem}:host([scale=l]) .node-container .checkbox,:host([scale=l]) .node-container .chevron,:host([scale=l]) .node-container .checkmark,:host([scale=l]) .node-container .bullet-point{margin-inline:0.75rem}:host([lines]) .children-container:after{position:absolute;top:0px;width:1px;transition-property:color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;-webkit-transition-property:color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-duration:150ms;transition-duration:150ms;-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s;height:96%;content:"";background-color:var(--calcite-ui-border-2);z-index:-1}:host(:not([lines])) .node-container:after{display:none}::slotted(*){min-width:0px;max-width:100%;overflow-wrap:break-word;color:inherit;text-decoration:none !important}::slotted(*):hover{text-decoration:none !important}::slotted(a){width:100%;-webkit-text-decoration-line:none;text-decoration-line:none}:host{outline-offset:0;outline-color:transparent;-webkit-transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out;transition:outline-offset 100ms ease-in-out, outline-color 100ms ease-in-out}:host(:focus){outline:2px solid var(--calcite-ui-brand);outline-offset:-2px}.checkbox{outline:2px solid transparent;outline-offset:2px;line-height:0}.checkbox-label{pointer-events:none;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}.children-container{position:relative;height:0px;overflow:hidden;-webkit-margin-start:1.25rem;margin-inline-start:1.25rem;-webkit-transform:scaleY(0);transform:scaleY(0);opacity:0;-webkit-transition:var(--calcite-animation-timing) cubic-bezier(0.215, 0.44, 0.42, 0.88), opacity var(--calcite-animation-timing) cubic-bezier(0.215, 0.44, 0.42, 0.88), all var(--calcite-animation-timing) ease-in-out;transition:var(--calcite-animation-timing) cubic-bezier(0.215, 0.44, 0.42, 0.88), opacity var(--calcite-animation-timing) cubic-bezier(0.215, 0.44, 0.42, 0.88), all var(--calcite-animation-timing) ease-in-out;-webkit-transform-origin:top;transform-origin:top}:host([expanded])>.children-container{-webkit-transform:scaleY(1);transform:scaleY(1);opacity:1;height:auto}.node-container{position:relative;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;padding:var(--calcite-tree-padding-y) 0}.node-container .checkmark,.node-container .bullet-point{opacity:0;-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s;color:var(--calcite-ui-border-1)}.node-container:hover .checkmark,.node-container:hover .bullet-point,:host([selected]) .node-container:hover .checkmark,:host([selected]) .node-container:hover .bullet-point,:host(:focus) .node-container .checkmark,:host(:focus) .node-container .bullet-point{opacity:1}:host([selected])>.node-container,:host([selected])>.node-container:hover{font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1)}:host([selected])>.node-container .bullet-point,:host([selected])>.node-container .checkmark,:host([selected])>.node-container:hover .bullet-point,:host([selected])>.node-container:hover .checkmark{opacity:1;color:var(--calcite-ui-brand)}:host(:not([has-children])):host([scale=s])>.node-container[data-selection-mode=ancestors] .checkbox{-webkit-padding-start:1.25rem;padding-inline-start:1.25rem}:host(:not([has-children])):host([scale=m])>.node-container[data-selection-mode=ancestors] .checkbox{-webkit-padding-start:1.5rem;padding-inline-start:1.5rem}:host(:not([has-children])):host([scale=l])>.node-container[data-selection-mode=ancestors] .checkbox{-webkit-padding-start:1.75rem;padding-inline-start:1.75rem}:host([has-children])>.node-container[data-selection-mode=ancestors] .checkbox{-webkit-margin-start:0;margin-inline-start:0}:host([has-children])>.node-container .bullet-point,:host([has-children])>.node-container .checkmark{display:none}:host([has-children][expanded]:not([selected]))>.node-container ::slotted(*){font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1)}:host([has-children][selected])>.node-container[data-selection-mode=children],:host([has-children][selected])>.node-container[data-selection-mode=multi-children]{color:var(--calcite-ui-brand)}.chevron{position:relative;-ms-flex-item-align:center;align-self:center;color:var(--calcite-ui-text-3);-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:var(--calcite-animation-timing);transition-duration:var(--calcite-animation-timing);-webkit-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out;-webkit-transition-delay:0s;transition-delay:0s;-ms-flex:0 0 auto;flex:0 0 auto;-webkit-transform:rotate(0deg);transform:rotate(0deg)}.calcite--rtl .chevron{-webkit-transform:rotate(180deg);transform:rotate(180deg)}:host([expanded])>.node-container>.chevron{-webkit-transform:rotate(90deg);transform:rotate(90deg)}:host([selected]) .checkmark,:host([selected]) .bullet-point{color:var(--calcite-ui-brand)}';export{p as calcite_tree,k as calcite_tree_item}
@@ -8,7 +8,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
8
8
 
9
9
  const index = require('./index-6b5d2de5.js');
10
10
  const dom = require('./dom-f3df220d.js');
11
- require('./guid-b270f0db.js');
11
+ const guid = require('./guid-b270f0db.js');
12
12
 
13
13
  const accordionCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}.calcite-animate{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}.calcite-animate__in{-webkit-animation-name:in;animation-name:in}.calcite-animate__in-down{-webkit-animation-name:in-down;animation-name:in-down}.calcite-animate__in-up{-webkit-animation-name:in-up;animation-name:in-up}.calcite-animate__in-scale{-webkit-animation-name:in-scale;animation-name:in-scale}:root{--calcite-popper-transition:var(--calcite-animation-timing)}:host([hidden]){display:none}:host([scale=s]){--calcite-accordion-item-spacing-unit:0.25rem;--calcite-accordion-icon-margin:0.5rem;--calcite-accordion-item-padding:var(--calcite-accordion-item-spacing-unit) 0.5rem;font-size:var(--calcite-font-size--2);line-height:1rem}:host([scale=m]){--calcite-accordion-item-spacing-unit:0.5rem;--calcite-accordion-icon-margin:0.75rem;--calcite-accordion-item-padding:var(--calcite-accordion-item-spacing-unit) 0.75rem;font-size:var(--calcite-font-size--1);line-height:1rem}:host([scale=l]){--calcite-accordion-item-spacing-unit:0.75rem;--calcite-accordion-icon-margin:1rem;--calcite-accordion-item-padding:var(--calcite-accordion-item-spacing-unit) 1rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}:host{position:relative;display:block;max-width:100%;border-width:1px;border-bottom-width:0px;border-style:solid;border-color:var(--calcite-ui-border-2);line-height:1.5rem;--calcite-accordion-item-border:var(--calcite-ui-border-2);--calcite-accordion-item-background:var(--calcite-ui-foreground-1)}.accordion--transparent{border-color:transparent;--calcite-accordion-item-border:transparent;--calcite-accordion-item-background:transparent}.accordion--minimal{--calcite-accordion-item-padding:var(--calcite-accordion-item-spacing-unit) 0;border-color:transparent}";
14
14
 
@@ -165,6 +165,12 @@ let AccordionItem = class {
165
165
  //--------------------------------------------------------------------------
166
166
  /** Indicates whether the item is active. */
167
167
  this.active = false;
168
+ //--------------------------------------------------------------------------
169
+ //
170
+ // Private State/Props
171
+ //
172
+ //--------------------------------------------------------------------------
173
+ this.guid = guid.guid();
168
174
  /** what icon position does the parent accordion specify */
169
175
  this.iconPosition = "end";
170
176
  /** handle clicks on item header */
@@ -191,16 +197,19 @@ let AccordionItem = class {
191
197
  render() {
192
198
  const dir = dom.getElementDir(this.el);
193
199
  const iconEl = index.h("calcite-icon", { class: "accordion-item-icon", icon: this.icon, scale: "s" });
194
- return (index.h(index.Host, { "aria-expanded": this.active.toString(), tabindex: "0" }, index.h("div", { class: {
200
+ const { guid } = this;
201
+ const regionId = `${guid}-region`;
202
+ const buttonId = `${guid}-button`;
203
+ return (index.h(index.Host, { tabindex: "0" }, index.h("div", { class: {
195
204
  [`icon-position--${this.iconPosition}`]: true,
196
205
  [`icon-type--${this.iconType}`]: true
197
- } }, index.h("div", { class: { "accordion-item-header": true, [dom.CSS_UTILITY.rtl]: dir === "rtl" }, onClick: this.itemHeaderClickHandler }, this.icon ? iconEl : null, index.h("div", { class: "accordion-item-header-text" }, index.h("span", { class: "accordion-item-title" }, this.itemTitle), this.itemSubtitle ? (index.h("span", { class: "accordion-item-subtitle" }, this.itemSubtitle)) : null), index.h("calcite-icon", { class: "accordion-item-expand-icon", icon: this.iconType === "chevron"
206
+ } }, index.h("div", { "aria-controls": regionId, class: { "accordion-item-header": true, [dom.CSS_UTILITY.rtl]: dir === "rtl" }, id: buttonId, onClick: this.itemHeaderClickHandler, role: "button" }, this.icon ? iconEl : null, index.h("div", { class: "accordion-item-header-text" }, index.h("span", { class: "accordion-item-title" }, this.itemTitle), this.itemSubtitle ? (index.h("span", { class: "accordion-item-subtitle" }, this.itemSubtitle)) : null), index.h("calcite-icon", { class: "accordion-item-expand-icon", icon: this.iconType === "chevron"
198
207
  ? "chevronDown"
199
208
  : this.iconType === "caret"
200
209
  ? "caretDown"
201
210
  : this.active
202
211
  ? "minus"
203
- : "plus", scale: "s" })), index.h("div", { class: "accordion-item-content" }, index.h("slot", null)))));
212
+ : "plus", scale: "s" })), index.h("div", { "aria-expanded": this.active.toString(), "aria-labelledby": buttonId, class: "accordion-item-content", id: regionId, role: "region" }, index.h("slot", null)))));
204
213
  }
205
214
  //--------------------------------------------------------------------------
206
215
  //
@@ -10,7 +10,7 @@ const index = require('./index-6b5d2de5.js');
10
10
  const dom = require('./dom-f3df220d.js');
11
11
  const Heading = require('./Heading-ef16f5df.js');
12
12
  const conditionalSlot = require('./conditionalSlot-92505fba.js');
13
- require('./guid-b270f0db.js');
13
+ const guid = require('./guid-b270f0db.js');
14
14
  require('./observers-79bfb8bc.js');
15
15
 
16
16
  const CSS$1 = {
@@ -90,6 +90,7 @@ let Block = class {
90
90
  * When true, the block's content will be displayed.
91
91
  */
92
92
  this.open = false;
93
+ this.guid = guid.guid();
93
94
  // --------------------------------------------------------------------------
94
95
  //
95
96
  // Private Methods
@@ -145,10 +146,13 @@ let Block = class {
145
146
  const hasControl = !!dom.getSlotted(el, SLOTS.control);
146
147
  const hasMenuActions = !!dom.getSlotted(el, SLOTS.headerMenuActions);
147
148
  const collapseIcon = open ? ICONS$1.opened : ICONS$1.closed;
148
- const headerNode = (index.h("div", { class: CSS$1.headerContainer }, this.dragHandle ? index.h("calcite-handle", null) : null, collapsible ? (index.h("button", { "aria-expanded": collapsible ? open.toString() : null, "aria-label": toggleLabel, class: CSS$1.toggle, onClick: this.onHeaderClick, title: toggleLabel }, headerContent, !hasControl && !hasMenuActions ? (index.h("calcite-icon", { "aria-hidden": "true", class: CSS$1.toggleIcon, icon: collapseIcon, scale: "s" })) : null)) : (headerContent), loading ? (index.h("calcite-loader", { inline: true, "is-active": true, label: intlLoading })) : hasControl ? (index.h("div", { class: CSS$1.controlContainer }, index.h("slot", { name: SLOTS.control }))) : null, hasMenuActions ? (index.h("calcite-action-menu", { label: this.intlOptions || TEXT$1.options }, index.h("slot", { name: SLOTS.headerMenuActions }))) : null));
149
+ const { guid } = this;
150
+ const regionId = `${guid}-region`;
151
+ const buttonId = `${guid}-button`;
152
+ const headerNode = (index.h("div", { class: CSS$1.headerContainer }, this.dragHandle ? index.h("calcite-handle", null) : null, collapsible ? (index.h("button", { "aria-controls": regionId, "aria-expanded": collapsible ? open.toString() : null, "aria-label": toggleLabel, class: CSS$1.toggle, id: buttonId, onClick: this.onHeaderClick, title: toggleLabel }, headerContent, !hasControl && !hasMenuActions ? (index.h("calcite-icon", { "aria-hidden": "true", class: CSS$1.toggleIcon, icon: collapseIcon, scale: "s" })) : null)) : (headerContent), loading ? (index.h("calcite-loader", { inline: true, "is-active": true, label: intlLoading })) : hasControl ? (index.h("div", { class: CSS$1.controlContainer }, index.h("slot", { name: SLOTS.control }))) : null, hasMenuActions ? (index.h("calcite-action-menu", { label: this.intlOptions || TEXT$1.options }, index.h("slot", { name: SLOTS.headerMenuActions }))) : null));
149
153
  return (index.h(index.Host, { tabIndex: disabled ? -1 : null }, index.h("article", { "aria-busy": loading.toString(), class: {
150
154
  [CSS$1.article]: true
151
- } }, headerNode, index.h("div", { class: CSS$1.content, hidden: !open }, this.renderScrim()))));
155
+ } }, headerNode, index.h("section", { "aria-expanded": this.open.toString(), "aria-labelledby": buttonId, class: CSS$1.content, hidden: !open, id: regionId }, this.renderScrim()))));
152
156
  }
153
157
  get el() { return index.getElement(this); }
154
158
  };
@@ -194,6 +198,7 @@ let BlockSection = class {
194
198
  * If the value is "button", a clickable header is displayed.
195
199
  */
196
200
  this.toggleDisplay = "button";
201
+ this.guid = guid.guid();
197
202
  // --------------------------------------------------------------------------
198
203
  //
199
204
  // Private Methods
@@ -236,14 +241,17 @@ let BlockSection = class {
236
241
  ? ICONS.menuClosedLeft
237
242
  : ICONS.menuClosedRight;
238
243
  const toggleLabel = open ? intlCollapse || TEXT.collapse : intlExpand || TEXT.expand;
239
- const headerNode = toggleDisplay === "switch" ? (index.h("div", { "aria-label": toggleLabel, class: {
244
+ const { guid } = this;
245
+ const regionId = `${guid}-region`;
246
+ const buttonId = `${guid}-button`;
247
+ const headerNode = toggleDisplay === "switch" ? (index.h("div", { "aria-controls": regionId, "aria-label": toggleLabel, class: {
240
248
  [CSS.toggle]: true,
241
249
  [CSS.toggleSwitch]: true
242
- }, onClick: this.toggleSection, onKeyDown: this.handleHeaderKeyDown, tabIndex: 0, title: toggleLabel }, index.h("div", { class: CSS.toggleSwitchContent }, index.h("span", { class: CSS.toggleSwitchText }, text)), index.h("calcite-switch", { checked: open, label: toggleLabel, scale: "s", tabIndex: -1 }), this.renderStatusIcon())) : (index.h("button", { "aria-label": toggleLabel, class: {
250
+ }, id: buttonId, onClick: this.toggleSection, onKeyDown: this.handleHeaderKeyDown, tabIndex: 0, title: toggleLabel }, index.h("div", { class: CSS.toggleSwitchContent }, index.h("span", { class: CSS.toggleSwitchText }, text)), index.h("calcite-switch", { checked: open, label: toggleLabel, scale: "s", tabIndex: -1 }), this.renderStatusIcon())) : (index.h("button", { "aria-controls": regionId, "aria-label": toggleLabel, class: {
243
251
  [CSS.sectionHeader]: true,
244
252
  [CSS.toggle]: true
245
- }, name: toggleLabel, onClick: this.toggleSection }, index.h("calcite-icon", { icon: arrowIcon, scale: "s" }), index.h("span", { class: CSS.sectionHeaderText }, text), this.renderStatusIcon()));
246
- return (index.h("section", { "aria-expanded": open.toString() }, headerNode, index.h("div", { class: CSS.content, hidden: !open }, index.h("slot", null))));
253
+ }, id: buttonId, name: toggleLabel, onClick: this.toggleSection }, index.h("calcite-icon", { icon: arrowIcon, scale: "s" }), index.h("span", { class: CSS.sectionHeaderText }, text), this.renderStatusIcon()));
254
+ return (index.h(index.Host, null, headerNode, index.h("section", { "aria-expanded": open.toString(), "aria-labelledby": buttonId, class: CSS.content, hidden: !open, id: regionId }, index.h("slot", null))));
247
255
  }
248
256
  get el() { return index.getElement(this); }
249
257
  };
@@ -32,7 +32,7 @@ const ARIA_CONTROLS = "aria-controls";
32
32
  const ARIA_EXPANDED = "aria-expanded";
33
33
  const HEADING_LEVEL = 2;
34
34
 
35
- const popoverCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}.calcite-animate{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}.calcite-animate__in{-webkit-animation-name:in;animation-name:in}.calcite-animate__in-down{-webkit-animation-name:in-down;animation-name:in-down}.calcite-animate__in-up{-webkit-animation-name:in-up;animation-name:in-up}.calcite-animate__in-scale{-webkit-animation-name:in-scale;animation-name:in-scale}:root{--calcite-popper-transition:var(--calcite-animation-timing)}:host([hidden]){display:none}:host{display:block;position:absolute;z-index:900;-webkit-transform:scale(0);transform:scale(0)}.calcite-popper-anim{position:relative;z-index:1;-webkit-transition:var(--calcite-popper-transition);transition:var(--calcite-popper-transition);visibility:hidden;-webkit-transition-property:visibility, opacity, -webkit-transform;transition-property:visibility, opacity, -webkit-transform;transition-property:transform, visibility, opacity;transition-property:transform, visibility, opacity, -webkit-transform;opacity:0;-webkit-box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);border-radius:0.25rem}:host([data-popper-placement^=bottom]) .calcite-popper-anim{-webkit-transform:translateY(-5px);transform:translateY(-5px)}:host([data-popper-placement^=top]) .calcite-popper-anim{-webkit-transform:translateY(5px);transform:translateY(5px)}:host([data-popper-placement^=left]) .calcite-popper-anim{-webkit-transform:translateX(5px);transform:translateX(5px)}:host([data-popper-placement^=right]) .calcite-popper-anim{-webkit-transform:translateX(-5px);transform:translateX(-5px)}:host([data-popper-placement]) .calcite-popper-anim--active{opacity:1;visibility:visible;-webkit-transform:translate(0);transform:translate(0)}.arrow,.arrow::before{position:absolute;width:8px;height:8px;z-index:-1}.arrow::before{content:\"\";--tw-shadow:0 4px 8px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.04);--tw-shadow-colored:0 4px 8px -1px var(--tw-shadow-color), 0 2px 4px -1px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);-webkit-transform:rotate(45deg);transform:rotate(45deg);background:var(--calcite-ui-foreground-1)}:host([data-popper-placement^=top]) .arrow{bottom:-4px}:host([data-popper-placement^=bottom]) .arrow{top:-4px}:host([data-popper-placement^=left]) .arrow{right:-4px}:host([data-popper-placement^=right]) .arrow{left:-4px}:host{pointer-events:none}:host([open]){pointer-events:initial}.calcite-popper-anim{border-radius:0.25rem;border-width:1px;border-style:solid;border-color:var(--calcite-ui-border-3);background-color:var(--calcite-ui-foreground-1)}.arrow::before{outline:1px solid var(--calcite-ui-border-3)}.header{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-align:stretch;align-items:stretch;-ms-flex-pack:start;justify-content:flex-start;border-width:0px;border-bottom-width:1px;border-style:solid;background-color:var(--calcite-ui-foreground-1);border-bottom-color:var(--calcite-ui-border-3)}.heading{margin:0px;display:block;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-item-align:center;align-self:center;white-space:normal;padding-left:1rem;padding-right:1rem;padding-top:0.75rem;padding-bottom:0.75rem;font-size:var(--calcite-font-size-0);line-height:1.375;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1);word-wrap:break-word;word-break:break-word}.container{position:relative;display:-ms-flexbox;display:flex;height:100%;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:nowrap;flex-wrap:nowrap;border-radius:0.25rem;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-1)}.container.has-header{-ms-flex-direction:column;flex-direction:column}.content{display:-ms-flexbox;display:flex;height:100%;width:100%;-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-ms-flex-item-align:center;align-self:center;word-wrap:break-word;word-break:break-word}.close-button-container{display:-ms-flexbox;display:flex;overflow:hidden;-ms-flex:0 0 auto;flex:0 0 auto;border-start-end-radius:0.25rem;border-end-end-radius:0.25rem}::slotted(calcite-panel),::slotted(calcite-flow){height:100%}";
35
+ const popoverCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}.calcite-animate{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}.calcite-animate__in{-webkit-animation-name:in;animation-name:in}.calcite-animate__in-down{-webkit-animation-name:in-down;animation-name:in-down}.calcite-animate__in-up{-webkit-animation-name:in-up;animation-name:in-up}.calcite-animate__in-scale{-webkit-animation-name:in-scale;animation-name:in-scale}:root{--calcite-popper-transition:var(--calcite-animation-timing)}:host([hidden]){display:none}:host{display:block;position:absolute;z-index:900;-webkit-transform:scale(0);transform:scale(0)}.calcite-popper-anim{position:relative;z-index:1;-webkit-transition:var(--calcite-popper-transition);transition:var(--calcite-popper-transition);visibility:hidden;-webkit-transition-property:visibility, opacity, -webkit-transform;transition-property:visibility, opacity, -webkit-transform;transition-property:transform, visibility, opacity;transition-property:transform, visibility, opacity, -webkit-transform;opacity:0;-webkit-box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);border-radius:0.25rem}:host([data-popper-placement^=bottom]) .calcite-popper-anim{-webkit-transform:translateY(-5px);transform:translateY(-5px)}:host([data-popper-placement^=top]) .calcite-popper-anim{-webkit-transform:translateY(5px);transform:translateY(5px)}:host([data-popper-placement^=left]) .calcite-popper-anim{-webkit-transform:translateX(5px);transform:translateX(5px)}:host([data-popper-placement^=right]) .calcite-popper-anim{-webkit-transform:translateX(-5px);transform:translateX(-5px)}:host([data-popper-placement]) .calcite-popper-anim--active{opacity:1;visibility:visible;-webkit-transform:translate(0);transform:translate(0)}:host([data-popper-placement][data-popper-escaped]),:host([data-popper-placement][data-popper-reference-hidden]){pointer-events:none;opacity:0}.arrow,.arrow::before{position:absolute;width:8px;height:8px;z-index:-1}.arrow::before{content:\"\";--tw-shadow:0 4px 8px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.04);--tw-shadow-colored:0 4px 8px -1px var(--tw-shadow-color), 0 2px 4px -1px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);-webkit-transform:rotate(45deg);transform:rotate(45deg);background:var(--calcite-ui-foreground-1)}:host([data-popper-placement^=top]) .arrow{bottom:-4px}:host([data-popper-placement^=bottom]) .arrow{top:-4px}:host([data-popper-placement^=left]) .arrow{right:-4px}:host([data-popper-placement^=right]) .arrow{left:-4px}:host{pointer-events:none}:host([open]){pointer-events:initial}.calcite-popper-anim{border-radius:0.25rem;border-width:1px;border-style:solid;border-color:var(--calcite-ui-border-3);background-color:var(--calcite-ui-foreground-1)}.arrow::before{outline:1px solid var(--calcite-ui-border-3)}.header{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-align:stretch;align-items:stretch;-ms-flex-pack:start;justify-content:flex-start;border-width:0px;border-bottom-width:1px;border-style:solid;background-color:var(--calcite-ui-foreground-1);border-bottom-color:var(--calcite-ui-border-3)}.heading{margin:0px;display:block;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-item-align:center;align-self:center;white-space:normal;padding-left:1rem;padding-right:1rem;padding-top:0.75rem;padding-bottom:0.75rem;font-size:var(--calcite-font-size-0);line-height:1.375;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1);word-wrap:break-word;word-break:break-word}.container{position:relative;display:-ms-flexbox;display:flex;height:100%;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:nowrap;flex-wrap:nowrap;border-radius:0.25rem;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-1)}.container.has-header{-ms-flex-direction:column;flex-direction:column}.content{display:-ms-flexbox;display:flex;height:100%;width:100%;-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-ms-flex-item-align:center;align-self:center;word-wrap:break-word;word-break:break-word}.close-button-container{display:-ms-flexbox;display:flex;overflow:hidden;-ms-flex:0 0 auto;flex:0 0 auto;border-start-end-radius:0.25rem;border-end-end-radius:0.25rem}::slotted(calcite-panel),::slotted(calcite-flow){height:100%}";
36
36
 
37
37
  let Popover = class {
38
38
  constructor(hostRef) {
@@ -19,7 +19,7 @@ const TOOLTIP_DELAY_MS = 500;
19
19
  const TOOLTIP_REFERENCE = "data-calcite-tooltip-reference";
20
20
  const ARIA_DESCRIBED_BY = "aria-describedby";
21
21
 
22
- const tooltipCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}.calcite-animate{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}.calcite-animate__in{-webkit-animation-name:in;animation-name:in}.calcite-animate__in-down{-webkit-animation-name:in-down;animation-name:in-down}.calcite-animate__in-up{-webkit-animation-name:in-up;animation-name:in-up}.calcite-animate__in-scale{-webkit-animation-name:in-scale;animation-name:in-scale}:root{--calcite-popper-transition:var(--calcite-animation-timing)}:host([hidden]){display:none}:host{display:block;position:absolute;z-index:999;-webkit-transform:scale(0);transform:scale(0)}.calcite-popper-anim{position:relative;z-index:1;-webkit-transition:var(--calcite-popper-transition);transition:var(--calcite-popper-transition);visibility:hidden;-webkit-transition-property:visibility, opacity, -webkit-transform;transition-property:visibility, opacity, -webkit-transform;transition-property:transform, visibility, opacity;transition-property:transform, visibility, opacity, -webkit-transform;opacity:0;-webkit-box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);border-radius:0.25rem}:host([data-popper-placement^=bottom]) .calcite-popper-anim{-webkit-transform:translateY(-5px);transform:translateY(-5px)}:host([data-popper-placement^=top]) .calcite-popper-anim{-webkit-transform:translateY(5px);transform:translateY(5px)}:host([data-popper-placement^=left]) .calcite-popper-anim{-webkit-transform:translateX(5px);transform:translateX(5px)}:host([data-popper-placement^=right]) .calcite-popper-anim{-webkit-transform:translateX(-5px);transform:translateX(-5px)}:host([data-popper-placement]) .calcite-popper-anim--active{opacity:1;visibility:visible;-webkit-transform:translate(0);transform:translate(0)}.arrow,.arrow::before{position:absolute;width:8px;height:8px;z-index:-1}.arrow::before{content:\"\";--tw-shadow:0 4px 8px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.04);--tw-shadow-colored:0 4px 8px -1px var(--tw-shadow-color), 0 2px 4px -1px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);-webkit-transform:rotate(45deg);transform:rotate(45deg);background:var(--calcite-ui-foreground-1)}:host([data-popper-placement^=top]) .arrow{bottom:-4px}:host([data-popper-placement^=bottom]) .arrow{top:-4px}:host([data-popper-placement^=left]) .arrow{right:-4px}:host([data-popper-placement^=right]) .arrow{left:-4px}.container{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:start;justify-content:flex-start;border-radius:0.25rem;background-color:var(--calcite-ui-foreground-1);padding-top:0.75rem;padding-bottom:0.75rem;padding-left:1rem;padding-right:1rem;font-size:var(--calcite-font-size--2);line-height:1.375;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1);overflow:hidden;max-width:20rem;max-height:20rem}.calcite-popper-anim{border-radius:0.25rem;border-width:1px;border-style:solid;border-color:var(--calcite-ui-border-3);background-color:var(--calcite-ui-foreground-1)}.arrow::before{outline:1px solid var(--calcite-ui-border-3)}";
22
+ const tooltipCss = "@-webkit-keyframes in{0%{opacity:0}100%{opacity:1}}@keyframes in{0%{opacity:0}100%{opacity:1}}@-webkit-keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-down{0%{opacity:0;-webkit-transform:translate3D(0, -5px, 0);transform:translate3D(0, -5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@keyframes in-up{0%{opacity:0;-webkit-transform:translate3D(0, 5px, 0);transform:translate3D(0, 5px, 0)}100%{opacity:1;-webkit-transform:translate3D(0, 0, 0);transform:translate3D(0, 0, 0)}}@-webkit-keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}@keyframes in-scale{0%{opacity:0;-webkit-transform:scale3D(0.95, 0.95, 1);transform:scale3D(0.95, 0.95, 1)}100%{opacity:1;-webkit-transform:scale3D(1, 1, 1);transform:scale3D(1, 1, 1)}}:root{--calcite-animation-timing:calc(150ms * var(--calcite-internal-duration-factor));--calcite-internal-duration-factor:var(--calcite-duration-factor, 1);--calcite-internal-animation-timing-fast:calc(100ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-medium:calc(200ms * var(--calcite-internal-duration-factor));--calcite-internal-animation-timing-slow:calc(300ms * var(--calcite-internal-duration-factor))}.calcite-animate{opacity:0;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:var(--calcite-animation-timing);animation-duration:var(--calcite-animation-timing)}.calcite-animate__in{-webkit-animation-name:in;animation-name:in}.calcite-animate__in-down{-webkit-animation-name:in-down;animation-name:in-down}.calcite-animate__in-up{-webkit-animation-name:in-up;animation-name:in-up}.calcite-animate__in-scale{-webkit-animation-name:in-scale;animation-name:in-scale}:root{--calcite-popper-transition:var(--calcite-animation-timing)}:host([hidden]){display:none}:host{display:block;position:absolute;z-index:999;-webkit-transform:scale(0);transform:scale(0)}.calcite-popper-anim{position:relative;z-index:1;-webkit-transition:var(--calcite-popper-transition);transition:var(--calcite-popper-transition);visibility:hidden;-webkit-transition-property:visibility, opacity, -webkit-transform;transition-property:visibility, opacity, -webkit-transform;transition-property:transform, visibility, opacity;transition-property:transform, visibility, opacity, -webkit-transform;opacity:0;-webkit-box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);box-shadow:0 0 16px 0 rgba(0, 0, 0, 0.16);border-radius:0.25rem}:host([data-popper-placement^=bottom]) .calcite-popper-anim{-webkit-transform:translateY(-5px);transform:translateY(-5px)}:host([data-popper-placement^=top]) .calcite-popper-anim{-webkit-transform:translateY(5px);transform:translateY(5px)}:host([data-popper-placement^=left]) .calcite-popper-anim{-webkit-transform:translateX(5px);transform:translateX(5px)}:host([data-popper-placement^=right]) .calcite-popper-anim{-webkit-transform:translateX(-5px);transform:translateX(-5px)}:host([data-popper-placement]) .calcite-popper-anim--active{opacity:1;visibility:visible;-webkit-transform:translate(0);transform:translate(0)}:host([data-popper-placement][data-popper-escaped]),:host([data-popper-placement][data-popper-reference-hidden]){pointer-events:none;opacity:0}.arrow,.arrow::before{position:absolute;width:8px;height:8px;z-index:-1}.arrow::before{content:\"\";--tw-shadow:0 4px 8px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.04);--tw-shadow-colored:0 4px 8px -1px var(--tw-shadow-color), 0 2px 4px -1px var(--tw-shadow-color);-webkit-box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);-webkit-transform:rotate(45deg);transform:rotate(45deg);background:var(--calcite-ui-foreground-1)}:host([data-popper-placement^=top]) .arrow{bottom:-4px}:host([data-popper-placement^=bottom]) .arrow{top:-4px}:host([data-popper-placement^=left]) .arrow{right:-4px}:host([data-popper-placement^=right]) .arrow{left:-4px}.container{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:start;justify-content:flex-start;border-radius:0.25rem;background-color:var(--calcite-ui-foreground-1);padding-top:0.75rem;padding-bottom:0.75rem;padding-left:1rem;padding-right:1rem;font-size:var(--calcite-font-size--2);line-height:1.375;font-weight:var(--calcite-font-weight-medium);color:var(--calcite-ui-text-1);overflow:hidden;max-width:20rem;max-height:20rem}.calcite-popper-anim{border-radius:0.25rem;border-width:1px;border-style:solid;border-color:var(--calcite-ui-border-3);background-color:var(--calcite-ui-foreground-1)}.arrow::before{outline:1px solid var(--calcite-ui-border-3)}";
23
23
 
24
24
  let Tooltip = class {
25
25
  constructor(hostRef) {
@@ -59,8 +59,10 @@ let Tree = class {
59
59
  this.child = !!parent;
60
60
  }
61
61
  render() {
62
- return (index.h(index.Host, { "aria-multiselectable": (this.selectionMode === TreeSelectionMode.Multi ||
63
- this.selectionMode === TreeSelectionMode.MultiChildren).toString(), role: !this.child ? "tree" : undefined, tabIndex: this.getRootTabIndex() }, index.h("slot", null)));
62
+ return (index.h(index.Host, { "aria-multiselectable": this.child
63
+ ? undefined
64
+ : (this.selectionMode === TreeSelectionMode.Multi ||
65
+ this.selectionMode === TreeSelectionMode.MultiChildren).toString(), role: !this.child ? "tree" : undefined, tabIndex: this.getRootTabIndex() }, index.h("slot", null)));
64
66
  }
65
67
  //--------------------------------------------------------------------------
66
68
  //
@@ -5,6 +5,7 @@
5
5
  import { Component, Element, Event, h, Host, Listen, Prop } from "@stencil/core";
6
6
  import { getElementDir, getElementProp } from "../../utils/dom";
7
7
  import { CSS_UTILITY } from "../../utils/resources";
8
+ import { guid } from "../../utils/guid";
8
9
  /**
9
10
  * @slot - A slot for adding custom content, including nested `calcite-accordion-item`s.
10
11
  */
@@ -17,6 +18,12 @@ export class AccordionItem {
17
18
  //--------------------------------------------------------------------------
18
19
  /** Indicates whether the item is active. */
19
20
  this.active = false;
21
+ //--------------------------------------------------------------------------
22
+ //
23
+ // Private State/Props
24
+ //
25
+ //--------------------------------------------------------------------------
26
+ this.guid = guid();
20
27
  /** what icon position does the parent accordion specify */
21
28
  this.iconPosition = "end";
22
29
  /** handle clicks on item header */
@@ -43,12 +50,15 @@ export class AccordionItem {
43
50
  render() {
44
51
  const dir = getElementDir(this.el);
45
52
  const iconEl = h("calcite-icon", { class: "accordion-item-icon", icon: this.icon, scale: "s" });
46
- return (h(Host, { "aria-expanded": this.active.toString(), tabindex: "0" },
53
+ const { guid } = this;
54
+ const regionId = `${guid}-region`;
55
+ const buttonId = `${guid}-button`;
56
+ return (h(Host, { tabindex: "0" },
47
57
  h("div", { class: {
48
58
  [`icon-position--${this.iconPosition}`]: true,
49
59
  [`icon-type--${this.iconType}`]: true
50
60
  } },
51
- h("div", { class: { "accordion-item-header": true, [CSS_UTILITY.rtl]: dir === "rtl" }, onClick: this.itemHeaderClickHandler },
61
+ h("div", { "aria-controls": regionId, class: { "accordion-item-header": true, [CSS_UTILITY.rtl]: dir === "rtl" }, id: buttonId, onClick: this.itemHeaderClickHandler, role: "button" },
52
62
  this.icon ? iconEl : null,
53
63
  h("div", { class: "accordion-item-header-text" },
54
64
  h("span", { class: "accordion-item-title" }, this.itemTitle),
@@ -60,7 +70,7 @@ export class AccordionItem {
60
70
  : this.active
61
71
  ? "minus"
62
72
  : "plus", scale: "s" })),
63
- h("div", { class: "accordion-item-content" },
73
+ h("div", { "aria-expanded": this.active.toString(), "aria-labelledby": buttonId, class: "accordion-item-content", id: regionId, role: "region" },
64
74
  h("slot", null)))));
65
75
  }
66
76
  //--------------------------------------------------------------------------
@@ -7,6 +7,7 @@ import { CSS, HEADING_LEVEL, ICONS, SLOTS, TEXT } from "./resources";
7
7
  import { getSlotted } from "../../utils/dom";
8
8
  import { Heading } from "../functional/Heading";
9
9
  import { connectConditionalSlotComponent, disconnectConditionalSlotComponent } from "../../utils/conditionalSlot";
10
+ import { guid } from "../../utils/guid";
10
11
  /**
11
12
  * @slot - A slot for adding content to the block.
12
13
  * @slot icon - A slot for adding a leading header icon.
@@ -48,6 +49,7 @@ export class Block {
48
49
  * When true, the block's content will be displayed.
49
50
  */
50
51
  this.open = false;
52
+ this.guid = guid();
51
53
  // --------------------------------------------------------------------------
52
54
  //
53
55
  // Private Methods
@@ -107,9 +109,12 @@ export class Block {
107
109
  const hasControl = !!getSlotted(el, SLOTS.control);
108
110
  const hasMenuActions = !!getSlotted(el, SLOTS.headerMenuActions);
109
111
  const collapseIcon = open ? ICONS.opened : ICONS.closed;
112
+ const { guid } = this;
113
+ const regionId = `${guid}-region`;
114
+ const buttonId = `${guid}-button`;
110
115
  const headerNode = (h("div", { class: CSS.headerContainer },
111
116
  this.dragHandle ? h("calcite-handle", null) : null,
112
- collapsible ? (h("button", { "aria-expanded": collapsible ? open.toString() : null, "aria-label": toggleLabel, class: CSS.toggle, onClick: this.onHeaderClick, title: toggleLabel },
117
+ collapsible ? (h("button", { "aria-controls": regionId, "aria-expanded": collapsible ? open.toString() : null, "aria-label": toggleLabel, class: CSS.toggle, id: buttonId, onClick: this.onHeaderClick, title: toggleLabel },
113
118
  headerContent,
114
119
  !hasControl && !hasMenuActions ? (h("calcite-icon", { "aria-hidden": "true", class: CSS.toggleIcon, icon: collapseIcon, scale: "s" })) : null)) : (headerContent),
115
120
  loading ? (h("calcite-loader", { inline: true, "is-active": true, label: intlLoading })) : hasControl ? (h("div", { class: CSS.controlContainer },
@@ -121,7 +126,7 @@ export class Block {
121
126
  [CSS.article]: true
122
127
  } },
123
128
  headerNode,
124
- h("div", { class: CSS.content, hidden: !open }, this.renderScrim()))));
129
+ h("section", { "aria-expanded": this.open.toString(), "aria-labelledby": buttonId, class: CSS.content, hidden: !open, id: regionId }, this.renderScrim()))));
125
130
  }
126
131
  static get is() { return "calcite-block"; }
127
132
  static get encapsulation() { return "shadow"; }
@@ -2,9 +2,10 @@
2
2
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
3
3
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
4
4
  */
5
- import { Component, Element, Event, Prop, h } from "@stencil/core";
5
+ import { Component, Element, Event, Prop, h, Host } from "@stencil/core";
6
6
  import { getElementDir } from "../../utils/dom";
7
7
  import { CSS, ICONS, TEXT } from "./resources";
8
+ import { guid } from "../../utils/guid";
8
9
  /**
9
10
  * @slot - A slot for adding content to the block section.
10
11
  */
@@ -20,6 +21,7 @@ export class BlockSection {
20
21
  * If the value is "button", a clickable header is displayed.
21
22
  */
22
23
  this.toggleDisplay = "button";
24
+ this.guid = guid();
23
25
  // --------------------------------------------------------------------------
24
26
  //
25
27
  // Private Methods
@@ -62,23 +64,26 @@ export class BlockSection {
62
64
  ? ICONS.menuClosedLeft
63
65
  : ICONS.menuClosedRight;
64
66
  const toggleLabel = open ? intlCollapse || TEXT.collapse : intlExpand || TEXT.expand;
65
- const headerNode = toggleDisplay === "switch" ? (h("div", { "aria-label": toggleLabel, class: {
67
+ const { guid } = this;
68
+ const regionId = `${guid}-region`;
69
+ const buttonId = `${guid}-button`;
70
+ const headerNode = toggleDisplay === "switch" ? (h("div", { "aria-controls": regionId, "aria-label": toggleLabel, class: {
66
71
  [CSS.toggle]: true,
67
72
  [CSS.toggleSwitch]: true
68
- }, onClick: this.toggleSection, onKeyDown: this.handleHeaderKeyDown, tabIndex: 0, title: toggleLabel },
73
+ }, id: buttonId, onClick: this.toggleSection, onKeyDown: this.handleHeaderKeyDown, tabIndex: 0, title: toggleLabel },
69
74
  h("div", { class: CSS.toggleSwitchContent },
70
75
  h("span", { class: CSS.toggleSwitchText }, text)),
71
76
  h("calcite-switch", { checked: open, label: toggleLabel, scale: "s", tabIndex: -1 }),
72
- this.renderStatusIcon())) : (h("button", { "aria-label": toggleLabel, class: {
77
+ this.renderStatusIcon())) : (h("button", { "aria-controls": regionId, "aria-label": toggleLabel, class: {
73
78
  [CSS.sectionHeader]: true,
74
79
  [CSS.toggle]: true
75
- }, name: toggleLabel, onClick: this.toggleSection },
80
+ }, id: buttonId, name: toggleLabel, onClick: this.toggleSection },
76
81
  h("calcite-icon", { icon: arrowIcon, scale: "s" }),
77
82
  h("span", { class: CSS.sectionHeaderText }, text),
78
83
  this.renderStatusIcon()));
79
- return (h("section", { "aria-expanded": open.toString() },
84
+ return (h(Host, null,
80
85
  headerNode,
81
- h("div", { class: CSS.content, hidden: !open },
86
+ h("section", { "aria-expanded": open.toString(), "aria-labelledby": buttonId, class: CSS.content, hidden: !open, id: regionId },
82
87
  h("slot", null))));
83
88
  }
84
89
  static get is() { return "calcite-block-section"; }
@@ -2,7 +2,7 @@
2
2
  "default-calendar": "gregorian",
3
3
  "separator": ".",
4
4
  "unitOrder": "DD. MM. YYYY.",
5
- "weekStart": 7,
5
+ "weekStart": 1,
6
6
  "placeholder": "DD. MM. YYYY.",
7
7
  "days": {
8
8
  "abbreviated": ["ned", "pon", "uto", "sri", "čet", "pet", "sub"],
@@ -2,7 +2,7 @@
2
2
  "default-calendar": "gregorian",
3
3
  "separator": "/",
4
4
  "unitOrder": "DD/MM/YYYY",
5
- "weekStart": 7,
5
+ "weekStart": 1,
6
6
  "placeholder": "DD/MM/YYYY",
7
7
  "days": {
8
8
  "abbreviated": ["dg.", "dl.", "dt.", "dc.", "dj.", "dv.", "ds."],
@@ -2,7 +2,7 @@
2
2
  "default-calendar": "gregorian",
3
3
  "separator": ".",
4
4
  "unitOrder": "DD.MM.YYYY",
5
- "weekStart": 7,
5
+ "weekStart": 1,
6
6
  "placeholder": "DD.MM.YYYY",
7
7
  "days": {
8
8
  "abbreviated": ["ne", "po", "út", "st", "čt", "pá", "so"],
@@ -2,7 +2,7 @@
2
2
  "default-calendar": "gregorian",
3
3
  "separator": ".",
4
4
  "unitOrder": "DD.MM.YYYY",
5
- "weekStart": 7,
5
+ "weekStart": 1,
6
6
  "placeholder": "DD.MM.YYYY",
7
7
  "days": {
8
8
  "abbreviated": ["søn.", "man.", "tir.", "ons.", "tor.", "fre.", "lør."],
@@ -2,7 +2,7 @@
2
2
  "default-calendar": "gregorian",
3
3
  "separator": ".",
4
4
  "unitOrder": "DD.MM.YYYY",
5
- "weekStart": 7,
5
+ "weekStart": 1,
6
6
  "placeholder": "DD.MM.YYYY",
7
7
  "days": {
8
8
  "abbreviated": ["So.", "Mo.", "Di.", "Mi.", "Do.", "Fr.", "Sa."],
@@ -2,7 +2,7 @@
2
2
  "default-calendar": "gregorian",
3
3
  "separator": "/",
4
4
  "unitOrder": "DD/MM/YYYY",
5
- "weekStart": 7,
5
+ "weekStart": 1,
6
6
  "placeholder": "DD/MM/YYYY",
7
7
  "days": {
8
8
  "abbreviated": ["Κυρ", "Δευ", "Τρί", "Τετ", "Πέμ", "Παρ", "Σάβ"],
@@ -2,7 +2,7 @@
2
2
  "default-calendar": "gregorian",
3
3
  "separator": "/",
4
4
  "unitOrder": "DD/MM/YYYY",
5
- "weekStart": 7,
5
+ "weekStart": 1,
6
6
  "placeholder": "DD/MM/YYYY",
7
7
  "days": {
8
8
  "narrow": ["Su.", "M.", "Tu.", "W.", "Th.", "F.", "Sa."],
@@ -2,7 +2,7 @@
2
2
  "default-calendar": "gregorian",
3
3
  "separator": "/",
4
4
  "unitOrder": "DD/MM/YYYY",
5
- "weekStart": 7,
5
+ "weekStart": 1,
6
6
  "placeholder": "DD/MM/YYYY",
7
7
  "days": {
8
8
  "abbreviated": ["dom.", "lun.", "mar.", "mié.", "jue.", "vie.", "sáb."],
@@ -2,7 +2,7 @@
2
2
  "default-calendar": "gregorian",
3
3
  "separator": ".",
4
4
  "unitOrder": "DD.MM.YYYY",
5
- "weekStart": 7,
5
+ "weekStart": 1,
6
6
  "placeholder": "DD.MM.YYYY",
7
7
  "days": {
8
8
  "abbreviated": ["P", "E", "T", "K", "N", "R", "L"],
@@ -2,7 +2,7 @@
2
2
  "default-calendar": "gregorian",
3
3
  "separator": ".",
4
4
  "unitOrder": "DD.MM.YYYY",
5
- "weekStart": 7,
5
+ "weekStart": 1,
6
6
  "placeholder": "DD.MM.YYYY",
7
7
  "days": {
8
8
  "abbreviated": ["su", "ma", "ti", "ke", "to", "pe", "la"],
@@ -2,7 +2,7 @@
2
2
  "default-calendar": "gregorian",
3
3
  "separator": "/",
4
4
  "unitOrder": "DD/MM/YYYY",
5
- "weekStart": 7,
5
+ "weekStart": 1,
6
6
  "placeholder": "DD/MM/YYYY",
7
7
  "days": {
8
8
  "abbreviated": ["dim.", "lun.", "mar.", "mer.", "jeu.", "ven.", "sam."],
@@ -2,7 +2,7 @@
2
2
  "default-calendar": "gregorian",
3
3
  "separator": ".",
4
4
  "unitOrder": "DD. MM. YYYY.",
5
- "weekStart": 7,
5
+ "weekStart": 1,
6
6
  "placeholder": "DD. MM. YYYY.",
7
7
  "days": {
8
8
  "abbreviated": ["ned", "pon", "uto", "sri", "čet", "pet", "sub"],
@@ -2,7 +2,7 @@
2
2
  "default-calendar": "gregorian",
3
3
  "separator": ".",
4
4
  "unitOrder": "YYYY. MM. DD.",
5
- "weekStart": 7,
5
+ "weekStart": 1,
6
6
  "placeholder": "YYYY. MM. DD.",
7
7
  "days": {
8
8
  "abbreviated": ["V", "H", "K", "Sze", "Cs", "P", "Szo"],
@@ -2,7 +2,7 @@
2
2
  "default-calendar": "gregorian",
3
3
  "separator": "/",
4
4
  "unitOrder": "DD/MM/YYYY",
5
- "weekStart": 7,
5
+ "weekStart": 1,
6
6
  "placeholder": "DD/MM/YYYY",
7
7
  "days": {
8
8
  "abbreviated": ["dom", "lun", "mar", "mer", "gio", "ven", "sab"],
@@ -2,7 +2,7 @@
2
2
  "default-calendar": "gregorian",
3
3
  "separator": "-",
4
4
  "unitOrder": "YYYY-MM-DD",
5
- "weekStart": 7,
5
+ "weekStart": 1,
6
6
  "placeholder": "YYYY-MM-DD",
7
7
  "days": {
8
8
  "abbreviated": ["sk", "pr", "an", "tr", "kt", "pn", "št"],
@@ -2,7 +2,7 @@
2
2
  "default-calendar": "gregorian",
3
3
  "separator": ".",
4
4
  "unitOrder": "DD.MM.YYYY",
5
- "weekStart": 7,
5
+ "weekStart": 1,
6
6
  "placeholder": "DD.MM.YYYY",
7
7
  "days": {
8
8
  "abbreviated": ["svētd.", "pirmd.", "otrd.", "trešd.", "ceturtd.", "piektd.", "sestd."],
@@ -2,7 +2,7 @@
2
2
  "default-calendar": "gregorian",
3
3
  "separator": ".",
4
4
  "unitOrder": "DD.MM.YYYY",
5
- "weekStart": 7,
5
+ "weekStart": 1,
6
6
  "placeholder": "DD.MM.YYYY",
7
7
  "days": {
8
8
  "abbreviated": ["нед.", "пон.", "вт.", "сре.", "чет.", "пет.", "саб."],
@@ -2,7 +2,7 @@
2
2
  "default-calendar": "gregorian",
3
3
  "separator": ".",
4
4
  "unitOrder": "DD.MM.YYYY",
5
- "weekStart": 7,
5
+ "weekStart": 1,
6
6
  "placeholder": "DD.MM.YYYY",
7
7
  "days": {
8
8
  "abbreviated": ["søn.", "man.", "tir.", "ons.", "tor.", "fre.", "lør."],
@@ -2,7 +2,7 @@
2
2
  "default-calendar": "gregorian",
3
3
  "separator": "-",
4
4
  "unitOrder": "DD-MM-YYYY",
5
- "weekStart": 7,
5
+ "weekStart": 1,
6
6
  "placeholder": "DD-MM-YYYY",
7
7
  "days": {
8
8
  "abbreviated": ["zo", "ma", "di", "wo", "do", "vr", "za"],
@@ -2,7 +2,7 @@
2
2
  "default-calendar": "gregorian",
3
3
  "separator": ".",
4
4
  "unitOrder": "DD.MM.YYYY",
5
- "weekStart": 7,
5
+ "weekStart": 1,
6
6
  "placeholder": "DD.MM.YYYY",
7
7
  "days": {
8
8
  "abbreviated": ["niedz.", "pon.", "wt.", "śr.", "czw.", "pt.", "sob."],
@@ -2,7 +2,7 @@
2
2
  "default-calendar": "gregorian",
3
3
  "separator": ".",
4
4
  "unitOrder": "DD.MM.YYYY",
5
- "weekStart": 7,
5
+ "weekStart": 1,
6
6
  "placeholder": "DD.MM.YYYY",
7
7
  "days": {
8
8
  "abbreviated": ["dum.", "lun.", "mar.", "mie.", "joi", "vin.", "sâm."],