@esri/calcite-components 1.0.0-next.413 → 1.0.0-next.416

package/dist/esm-es5/{resources-431fa051.js → resources-73dac782.js}

@@ -1,5 +1,5 @@
-var __awaiter=this&&this.__awaiter||function(e,t,n,r){function a(e){return e instanceof n?e:new n((function(t){t(e)}))}return new(n||(n=Promise))((function(n,o){function i(e){try{s(r.next(e))}catch(e){o(e)}}function u(e){try{s(r["throw"](e))}catch(e){o(e)}}function s(e){e.done?n(e.value):a(e.value).then(i,u)}s((r=r.apply(e,t||[])).next())}))};var __generator=this&&this.__generator||function(e,t){var n={label:0,sent:function(){if(o[0]&1)throw o[1];return o[1]},trys:[],ops:[]},r,a,o,i;return i={next:u(0),throw:u(1),return:u(2)},typeof Symbol==="function"&&(i[Symbol.iterator]=function(){return this}),i;function u(e){return function(t){return s([e,t])}}function s(i){if(r)throw new TypeError("Generator is already executing.");while(n)try{if(r=1,a&&(o=i[0]&2?a["return"]:i[0]?a["throw"]||((o=a["return"])&&o.call(a),0):a.next)&&!(o=o.call(a,i[1])).done)return o;if(a=0,o)i=[i[0]&2,o.value];switch(i[0]){case 0:case 1:o=i;break;case 4:n.label++;return{value:i[1],done:false};case 5:n.label++;a=i[1];i=[0];continue;case 7:i=n.ops.pop();n.trys.pop();continue;default:if(!(o=n.trys,o=o.length>0&&o[o.length-1])&&(i[0]===6||i[0]===2)){n=0;continue}if(i[0]===3&&(!o||i[1]>o[0]&&i[1]<o[3])){n.label=i[1];break}if(i[0]===6&&n.label<o[1]){n.label=o[1];o=i;break}if(o&&n.label<o[2]){n.label=o[2];n.ops.push(i);break}if(o[2])n.ops.pop();n.trys.pop();continue}i=t.call(e,n)}catch(e){i=[6,e];a=0}finally{r=o=0}if(i[0]&5)throw i[1];return{value:i[0]?i[1]:void 0,done:true}}};
+var __awaiter=this&&this.__awaiter||function(e,t,n,r){function a(e){return e instanceof n?e:new n((function(t){t(e)}))}return new(n||(n=Promise))((function(n,o){function i(e){try{c(r.next(e))}catch(e){o(e)}}function u(e){try{c(r["throw"](e))}catch(e){o(e)}}function c(e){e.done?n(e.value):a(e.value).then(i,u)}c((r=r.apply(e,t||[])).next())}))};var __generator=this&&this.__generator||function(e,t){var n={label:0,sent:function(){if(o[0]&1)throw o[1];return o[1]},trys:[],ops:[]},r,a,o,i;return i={next:u(0),throw:u(1),return:u(2)},typeof Symbol==="function"&&(i[Symbol.iterator]=function(){return this}),i;function u(e){return function(t){return c([e,t])}}function c(i){if(r)throw new TypeError("Generator is already executing.");while(n)try{if(r=1,a&&(o=i[0]&2?a["return"]:i[0]?a["throw"]||((o=a["return"])&&o.call(a),0):a.next)&&!(o=o.call(a,i[1])).done)return o;if(a=0,o)i=[i[0]&2,o.value];switch(i[0]){case 0:case 1:o=i;break;case 4:n.label++;return{value:i[1],done:false};case 5:n.label++;a=i[1];i=[0];continue;case 7:i=n.ops.pop();n.trys.pop();continue;default:if(!(o=n.trys,o=o.length>0&&o[o.length-1])&&(i[0]===6||i[0]===2)){n=0;continue}if(i[0]===3&&(!o||i[1]>o[0]&&i[1]<o[3])){n.label=i[1];break}if(i[0]===6&&n.label<o[1]){n.label=o[1];o=i;break}if(o&&n.label<o[2]){n.label=o[2];n.ops.push(i);break}if(o[2])n.ops.pop();n.trys.pop();continue}i=t.call(e,n)}catch(e){i=[6,e];a=0}finally{r=o=0}if(i[0]&5)throw i[1];return{value:i[0]?i[1]:void 0,done:true}}};
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- */import{a as getAssetPath}from"./index-0fefddd1.js";import{a as locales}from"./locale-fc850b7c.js";function getSupportedLocale(e){if(e===void 0){e=""}if(locales.indexOf(e)>-1){return e}e=e.toLowerCase();if(e.includes("-")){e=e.replace(/(\w+)-(\w+)/,(function(e,t,n){return"".concat(t,"-").concat(n.toUpperCase())}));if(!locales.includes(e)){e=e.split("-")[0]}}return locales.includes(e)?e:"en"}var translationCache={};var requestCache={};function getLocaleData(e){return __awaiter(this,void 0,void 0,(function(){var t,n;return __generator(this,(function(r){switch(r.label){case 0:t=getSupportedLocale(e);if(translationCache[t]){return[2,translationCache[t]]}if(!requestCache[t]){requestCache[t]=fetch(getAssetPath("./assets/date-picker/nls/".concat(t,".json"))).then((function(e){return e.json()})).catch((function(){console.error('Translations for "'.concat(t,'" not found or invalid, falling back to english'));return getLocaleData("en")}))}return[4,requestCache[t]];case 1:n=r.sent();translationCache[t]=n;return[2,n]}}))}))}function inRange(e,t,n){var r=e.getTime();var a=!(t instanceof Date)||r>=t.getTime();var o=!(n instanceof Date)||r<=n.getTime();return a&&o}function dateFromRange(e,t,n){if(!(e instanceof Date)){return null}var r=e.getTime();var a=t instanceof Date&&r<t.getTime();var o=n instanceof Date&&r>n.getTime();if(a){return t}if(o){return n}return e}function dateFromISO(e){if(e instanceof Date){return e}if(!e||typeof e!=="string"){return null}var t=e.split(/[: T-]/).map(parseFloat);var n=new Date(t[0],(t[1]||1)-1,t[2]||1);n.setFullYear(t[0]);if(isNaN(n.getTime())){throw new Error('Invalid ISO 8601 date: "'.concat(e,'"'))}return n}function dateToISO(e){if(typeof e==="string"){return e}if(e instanceof Date){return new Date(e.getTime()-e.getTimezoneOffset()*6e4).toISOString().split("T")[0]}return""}function sameDate(e,t){return e instanceof Date&&t instanceof Date&&e.getDate()===t.getDate()&&e.getMonth()===t.getMonth()&&e.getFullYear()===t.getFullYear()}function prevMonth(e){var t=e.getMonth();var n=new Date(e);n.setMonth(t-1);if(t===n.getMonth()){return new Date(e.getFullYear(),t,0)}return n}function nextMonth(e){var t=e.getMonth();var n=new Date(e);n.setMonth(t+1);if((t+2)%7===n.getMonth()%7){return new Date(e.getFullYear(),t+2,0)}return n}function localizeNumber(e,t){return String(e).split("").map((function(e){return t.numerals[e]})).join("")}function parseNumber(e,t){var n="0123456789";return parseInt(e.split("").map((function(e){return n[t.numerals.indexOf(e)]})).filter((function(e){return e})).join(""))}function parseDateString(e,t){var n=t.separator,r=t.unitOrder;var a=getOrder(r);var o=replaceArabicNumerals(e).split(n);return{day:parseInt(o[a.indexOf("d")]),month:parseInt(o[a.indexOf("m")])-1,year:parseInt(o[a.indexOf("y")])}}function replaceArabicNumerals(e){if(e===void 0){e=""}return e.replace(/[\u0660-\u0669]/g,(function(e){return e.charCodeAt(0)-1632})).replace(/[\u06f0-\u06f9]/g,(function(e){return e.charCodeAt(0)-1776}))}function getOrder(e){var t=["d","m","y"];var n=e.toLowerCase();return t.sort((function(e,t){return n.indexOf(e)-n.indexOf(t)}))}function getDaysDiff(e,t){var n=e.getTime();var r=t.getTime();return(n-r)/(1e3*3600*24)}var HEADING_LEVEL=2;var TEXT={nextMonth:"Next month",prevMonth:"Previous month",year:"Year"};export{HEADING_LEVEL as H,TEXT as T,dateFromISO as a,dateFromRange as b,getDaysDiff as c,dateToISO as d,getOrder as e,prevMonth as f,getLocaleData as g,parseNumber as h,inRange as i,localizeNumber as l,nextMonth as n,parseDateString as p,sameDate as s};
+ */import{a as getAssetPath}from"./index-bd94948c.js";import{a as locales}from"./locale-fc850b7c.js";function getSupportedLocale(e){if(e===void 0){e=""}if(locales.indexOf(e)>-1){return e}e=e.toLowerCase();if(e.includes("-")){e=e.replace(/(\w+)-(\w+)/,(function(e,t,n){return"".concat(t,"-").concat(n.toUpperCase())}));if(!locales.includes(e)){e=e.split("-")[0]}}return locales.includes(e)?e:"en"}var translationCache={};var requestCache={};function getLocaleData(e){return __awaiter(this,void 0,void 0,(function(){var t,n;return __generator(this,(function(r){switch(r.label){case 0:t=getSupportedLocale(e);if(translationCache[t]){return[2,translationCache[t]]}if(!requestCache[t]){requestCache[t]=fetch(getAssetPath("./assets/date-picker/nls/".concat(t,".json"))).then((function(e){return e.json()})).catch((function(){console.error('Translations for "'.concat(t,'" not found or invalid, falling back to english'));return getLocaleData("en")}))}return[4,requestCache[t]];case 1:n=r.sent();translationCache[t]=n;return[2,n]}}))}))}function inRange(e,t,n){var r=e.getTime();var a=!(t instanceof Date)||r>=t.getTime();var o=!(n instanceof Date)||r<=n.getTime();return a&&o}function dateFromRange(e,t,n){if(!(e instanceof Date)){return null}var r=e.getTime();var a=t instanceof Date&&r<t.getTime();var o=n instanceof Date&&r>n.getTime();if(a){return t}if(o){return n}return e}function dateFromISO(e){if(e instanceof Date){return e}if(!e||typeof e!=="string"){return null}var t=e.split(/[: T-]/).map(parseFloat);var n=new Date(t[0],(t[1]||1)-1,t[2]||1);n.setFullYear(t[0]);if(isNaN(n.getTime())){throw new Error('Invalid ISO 8601 date: "'.concat(e,'"'))}return n}function dateToISO(e){if(typeof e==="string"){return e}if(e instanceof Date){return new Date(e.getTime()-e.getTimezoneOffset()*6e4).toISOString().split("T")[0]}return""}function sameDate(e,t){return e instanceof Date&&t instanceof Date&&e.getDate()===t.getDate()&&e.getMonth()===t.getMonth()&&e.getFullYear()===t.getFullYear()}function prevMonth(e){var t=e.getMonth();var n=new Date(e);n.setMonth(t-1);if(t===n.getMonth()){return new Date(e.getFullYear(),t,0)}return n}function nextMonth(e){var t=e.getMonth();var n=new Date(e);n.setMonth(t+1);if((t+2)%7===n.getMonth()%7){return new Date(e.getFullYear(),t+2,0)}return n}function localizeNumber(e,t){return String(e).split("").map((function(e){return t.numerals[e]})).join("")}function parseNumber(e,t){var n="0123456789";return parseInt(e.split("").map((function(e){return n[t.numerals.indexOf(e)]})).filter((function(e){return e})).join(""))}function parseDateString(e,t){var n=t.separator,r=t.unitOrder;var a=getOrder(r);var o=replaceArabicNumerals(e).split(n);return{day:parseInt(o[a.indexOf("d")]),month:parseInt(o[a.indexOf("m")])-1,year:parseInt(o[a.indexOf("y")])}}function replaceArabicNumerals(e){if(e===void 0){e=""}return e.replace(/[\u0660-\u0669]/g,(function(e){return e.charCodeAt(0)-1632})).replace(/[\u06f0-\u06f9]/g,(function(e){return e.charCodeAt(0)-1776}))}function getOrder(e){var t=["d","m","y"];var n=e.toLowerCase();return t.sort((function(e,t){return n.indexOf(e)-n.indexOf(t)}))}function getDaysDiff(e,t){var n=e.getTime();var r=t.getTime();return(n-r)/(1e3*3600*24)}var HEADING_LEVEL=2;var TEXT={nextMonth:"Next month",prevMonth:"Previous month",year:"Year"};export{HEADING_LEVEL as H,TEXT as T,dateFromISO as a,dateFromRange as b,getDaysDiff as c,dateToISO as d,getOrder as e,prevMonth as f,getLocaleData as g,parseNumber as h,inRange as i,localizeNumber as l,nextMonth as n,parseDateString as p,sameDate as s};

package/dist/esm-es5/resources-cbfcf4a3.js

@@ -0,0 +1,5 @@
+var __awaiter=this&&this.__awaiter||function(e,t,i,n){function a(e){return e instanceof i?e:new i((function(t){t(e)}))}return new(i||(i=Promise))((function(i,r){function l(e){try{o(n.next(e))}catch(e){r(e)}}function s(e){try{o(n["throw"](e))}catch(e){r(e)}}function o(e){e.done?i(e.value):a(e.value).then(l,s)}o((n=n.apply(e,t||[])).next())}))};var __generator=this&&this.__generator||function(e,t){var i={label:0,sent:function(){if(r[0]&1)throw r[1];return r[1]},trys:[],ops:[]},n,a,r,l;return l={next:s(0),throw:s(1),return:s(2)},typeof Symbol==="function"&&(l[Symbol.iterator]=function(){return this}),l;function s(e){return function(t){return o([e,t])}}function o(l){if(n)throw new TypeError("Generator is already executing.");while(i)try{if(n=1,a&&(r=l[0]&2?a["return"]:l[0]?a["throw"]||((r=a["return"])&&r.call(a),0):a.next)&&!(r=r.call(a,l[1])).done)return r;if(a=0,r)l=[l[0]&2,r.value];switch(l[0]){case 0:case 1:r=l;break;case 4:i.label++;return{value:l[1],done:false};case 5:i.label++;a=l[1];l=[0];continue;case 7:l=i.ops.pop();i.trys.pop();continue;default:if(!(r=i.trys,r=r.length>0&&r[r.length-1])&&(l[0]===6||l[0]===2)){i=0;continue}if(l[0]===3&&(!r||l[1]>r[0]&&l[1]<r[3])){i.label=l[1];break}if(l[0]===6&&i.label<r[1]){i.label=r[1];r=l;break}if(r&&i.label<r[2]){i.label=r[2];i.ops.push(l);break}if(r[2])i.ops.pop();i.trys.pop();continue}l=t.call(e,i)}catch(e){l=[6,e];a=0}finally{n=r=0}if(l[0]&5)throw l[1];return{value:l[0]?l[1]:void 0,done:true}}};
+/*!
+ * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+ * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
+ */import{f as focusElement,g as getSlotted}from"./dom-e7fa77b9.js";import{g as getRoundRobinIndex}from"./array-91a648e2.js";import{d as debounce}from"./debounce-79648d42.js";import{h,H as Host}from"./index-bd94948c.js";function mutationObserverCallback(){this.setUpItems();this.setUpFilter();this.deselectRemovedItems()}var SUPPORTED_ARROW_KEYS=["ArrowUp","ArrowDown"];function initialize(){this.setUpItems();this.setUpFilter();this.emitCalciteListChange=debounce(internalCalciteListChangeEvent.bind(this),0)}function initializeObserver(){var e;(e=this.mutationObserver)===null||e===void 0?void 0:e.observe(this.el,{childList:true,subtree:true})}function cleanUpObserver(){var e;(e=this.mutationObserver)===null||e===void 0?void 0:e.disconnect()}function calciteListItemChangeHandler(e){var t=this.selectedValues;var i=e.detail,n=i.item,a=i.value,r=i.selected,l=i.shiftPressed;if(r){if(this.multiple&&l){this.selectSiblings(n)}if(!this.multiple){this.deselectSiblingItems(n)}t.set(a,n)}else{t.delete(a);if(this.multiple&&l){this.selectSiblings(n,true)}}if(!this.multiple){toggleSingleSelectItemTabbing(n,r);if(r){focusElement(n)}}this.lastSelectedItem=n;this.emitCalciteListChange()}function calciteListItemValueChangeHandler(e){e.stopPropagation();var t=e.detail.oldValue;var i=this.selectedValues;if(i.has(t)){var n=i.get(t);i.delete(t);i.set(e.detail.newValue,n)}}function isValidNavigationKey(e){return!!SUPPORTED_ARROW_KEYS.find((function(t){return t===e}))}function calciteListFocusOutHandler(e){var t=this,i=t.el,n=t.items,a=t.multiple,r=t.selectedValues;if(a){return}var l=i.contains(e.relatedTarget);if(l){return}filterOutDisabled(n).forEach((function(t){toggleSingleSelectItemTabbing(t,r.size===0?t.contains(e.target)||e.target===t:t.selected)}))}function keyDownHandler(e){var t=e.key,i=e.target;if(!isValidNavigationKey(t)){return}var n=this,a=n.items,r=n.multiple,l=n.selectionFollowsFocus;var s=a.length;var o=a.indexOf(i);if(!s||o===-1){return}e.preventDefault();var c=moveItemIndex(this,i,t==="ArrowUp"?"up":"down");var u=a[c];a.forEach((function(e){return toggleSingleSelectItemTabbing(e,e===u)}));if(!r&&l){u.selected=true}focusElement(u)}function moveItemIndex(e,t,i){var n=e.items;var a=n.length;var r=n.indexOf(t);var l=i==="up"?-1:1;var s=1;var o=getRoundRobinIndex(r+l*s++,a);var c=o;while(n[o].disabled){o=getRoundRobinIndex(r+l*s++,a);if(o===c){break}}return o}function filterOutDisabled(e){return e.filter((function(e){return!e.disabled}))}function internalCalciteListChangeEvent(){this.calciteListChange.emit(this.selectedValues)}function removeItem(e){if(e.defaultPrevented){return}var t=e.target;var i=this.selectedValues;if(t.parentElement.tagName==="CALCITE-PICK-LIST-GROUP"){t.parentElement.remove();Array.from(t.parentElement.children).forEach((function(e){return i.delete(e.value)}))}else{t.remove();i.delete(t.value)}this.emitCalciteListChange()}function toggleSingleSelectItemTabbing(e,t){if(e.disabled){return}if(t){e.removeAttribute("tabindex")}else{e.setAttribute("tabindex","-1")}}function setFocus(e){return __awaiter(this,void 0,void 0,(function(){var t,i,n,a,r,l,s;return __generator(this,(function(o){switch(o.label){case 0:if(!(this.filterEnabled&&e==="filter"))return[3,2];return[4,focusElement(this.filterEl)];case 1:o.sent();return[2];case 2:i=this,n=i.items,a=i.multiple,r=i.selectionFollowsFocus;if(n.length===0){return[2]}if(a){return[2,(t=filterOutDisabled(n)[0])===null||t===void 0?void 0:t.setFocus()]}l=filterOutDisabled(n);s=l.find((function(e){return e.selected}))||l[0];if(r&&s){s.selected=true}return[2,s.setFocus()]}}))}))}function setUpItems(e){var t=this;this.items=Array.from(this.el.querySelectorAll(e));var i=false;var n=this.items;n.forEach((function(e){e.icon=t.getIconType();if(!t.multiple){e.disableDeselect=true;toggleSingleSelectItemTabbing(e,false)}if(e.selected){i=true;toggleSingleSelectItemTabbing(e,true);t.selectedValues.set(e.value,e)}}));var a=n[0];if(!i&&a&&!a.disabled){toggleSingleSelectItemTabbing(a,true)}}function deselectRemovedItems(){var e=this;var t=this.selectedValues;var i=this.items.map((function(e){var t=e.value;return t}));t.forEach((function(t){if(!i.includes(t.value)){e.selectedValues.delete(t.value)}}))}function deselectSiblingItems(e){var t=this;this.items.forEach((function(i){if(i.value!==e.value){i.toggleSelected(false);if(t.selectedValues.has(i.value)){t.selectedValues.delete(i.value)}}}))}function selectSiblings(e,t){var i=this;if(t===void 0){t=false}if(!this.lastSelectedItem){return}var n=this.items;var a=n.findIndex((function(e){return e.value===i.lastSelectedItem.value}));var r=n.findIndex((function(t){return t.value===e.value}));n.slice(Math.min(a,r),Math.max(a,r)).forEach((function(e){e.toggleSelected(!t);if(!t){i.selectedValues.set(e.value,e)}else{i.selectedValues.delete(e.value)}}))}var groups;function handleFilter(e){var t=e.currentTarget.filteredItems;var i=t.map((function(e){return e.value}));var n=false;if(!groups){groups=new Set}var a=this.items.filter((function(e){var t=e.parentElement;var a=t.matches("calcite-pick-list-group");if(a){groups.add(t)}var r=i.includes(e.value);e.hidden=!r;if(!n){n=r&&e.selected}return r}));groups.forEach((function(e){var t=a.some((function(t){return e.contains(t)}));e.hidden=!t;if(!t){return}var i=getSlotted(e,"parent-item");if(i){i.hidden=false;if(a.includes(i)){Array.from(e.children).forEach((function(e){return e.hidden=false}))}}}));groups.clear();if(a.length>0&&!n&&!this.multiple){toggleSingleSelectItemTabbing(a[0],true)}}function getItemData(){return this.items.map((function(e){return{label:e.label,description:e.description,metadata:e.metadata,value:e.value}}))}var CSS$1={sticky:"sticky-pos"};var ICON_TYPES;(function(e){e["circle"]="circle";e["square"]="square";e["grip"]="grip"})(ICON_TYPES||(ICON_TYPES={}));var SLOTS$1={menuActions:"menu-actions"};var __rest=undefined&&undefined.__rest||function(e,t){var i={};for(var n in e)if(Object.prototype.hasOwnProperty.call(e,n)&&t.indexOf(n)<0)i[n]=e[n];if(e!=null&&typeof Object.getOwnPropertySymbols==="function")for(var a=0,n=Object.getOwnPropertySymbols(e);a<n.length;a++){if(t.indexOf(n[a])<0&&Object.prototype.propertyIsEnumerable.call(e,n[a]))i[n[a]]=e[n[a]]}return i};var List=function(e){var t;var i=e.props,n=i.disabled,a=i.loading,r=i.filterEnabled,l=i.dataForFilter,s=i.handleFilter,o=i.filterPlaceholder,c=i.setFilterEl,u=__rest(e,["props"]);var d=h("slot",null);return h(Host,Object.assign({"aria-busy":a.toString(),role:"menu"},u),h("section",null,h("header",{class:(t={},t[CSS$1.sticky]=true,t)},r?h("calcite-filter",{"aria-label":o,disabled:a||n,items:l,onCalciteFilterChange:s,placeholder:o,ref:c}):null,h("slot",{name:SLOTS$1.menuActions})),a?h("calcite-scrim",{loading:a}):null,d))};var CSS={actions:"actions",actionsEnd:"actions--end",actionsStart:"actions--start",description:"description",handle:"handle",handleActivated:"handle--activated",highlight:"highlight",icon:"icon",iconDot:"icon-dot",label:"label",remove:"remove",title:"title",textContainer:"text-container"};var ICONS={checked:"check",remove:"x"};var SLOTS={actionsEnd:"actions-end",actionsStart:"actions-start"};var TEXT={remove:"Remove"};export{CSS as C,ICON_TYPES as I,List as L,SLOTS as S,TEXT as T,deselectSiblingItems as a,moveItemIndex as b,initializeObserver as c,deselectRemovedItems as d,cleanUpObserver as e,calciteListFocusOutHandler as f,getItemData as g,handleFilter as h,initialize as i,calciteListItemChangeHandler as j,keyDownHandler as k,calciteListItemValueChangeHandler as l,mutationObserverCallback as m,setUpItems as n,setFocus as o,ICONS as p,removeItem as r,selectSiblings as s};

package/dist/extras/docs-json.json

@@ -1,8 +1,8 @@
 {
-  "timestamp": "2022-03-07T23:14:53",
+  "timestamp": "2022-03-14T20:02:04",
   "compiler": {
     "name": "@stencil/core",
-    "version": "2.14.0",
+    "version": "2.14.1",
     "typescriptVersion": "4.5.4"
   },
   "components": [
@@ -3721,6 +3721,23 @@
           "optional": false,
           "required": false
         },
+        {
+          "name": "disabled",
+          "type": "boolean",
+          "mutable": false,
+          "attr": "disabled",
+          "reflectToAttr": true,
+          "docs": "When true, disabled prevents user interaction.",
+          "docsTags": [],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
         {
           "name": "format",
           "type": "\"auto\" | \"hex\" | \"hexa\" | \"hsl\" | \"hsl-css\" | \"hsla\" | \"hsla-css\" | \"hsv\" | \"hsva\" | \"rgb\" | \"rgb-css\" | \"rgba\" | \"rgba-css\"",
@@ -7568,19 +7585,14 @@
         "calcite-value-list"
       ],
       "dependencies": [
-        "calcite-scrim",
         "calcite-input",
         "calcite-icon"
       ],
       "dependencyGraph": {
         "calcite-filter": [
-          "calcite-scrim",
           "calcite-input",
           "calcite-icon"
         ],
-        "calcite-scrim": [
-          "calcite-loader"
-        ],
         "calcite-input": [
           "calcite-progress",
           "calcite-icon"
@@ -10217,8 +10229,14 @@
           "attr": "disabled",
           "reflectToAttr": true,
           "docs": "is the label disabled",
-          "docsTags": [],
+          "docsTags": [
+            {
+              "name": "deprecated",
+              "text": "use the `disabled` property on the interactive components instead"
+            }
+          ],
           "default": "false",
+          "deprecation": "use the `disabled` property on the interactive components instead",
           "values": [
             {
               "type": "boolean"
@@ -10566,6 +10584,23 @@
         "Nested": "```html\n<calcite-list>\n  <calcite-list-item\n    label=\"Cras iaculis ultricies nulla.\"\n    description=\"Lorem ipsum dolor sit amet, consectetuer adipiscing elit.\"\n  >\n    <calcite-list-item label=\"Ut aliquam sollicitudin leo.\" description=\"Aliquam tincidunt mauris eu risus.\">\n      <calcite-list-item\n        label=\"Vestibulum commodo felis quis tortor.\"\n        description=\"Vestibulum auctor dapibus neque.\"\n      ></calcite-list-item></calcite-list-item\n  ></calcite-list-item>\n</calcite-list>\n```\n"
       },
       "props": [
+        {
+          "name": "disabled",
+          "type": "boolean",
+          "mutable": false,
+          "attr": "disabled",
+          "reflectToAttr": true,
+          "docs": "When true, disabled prevents user interaction.",
+          "docsTags": [],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
         {
           "name": "headingLevel",
           "type": "1 | 2 | 3 | 4 | 5 | 6",
@@ -12823,16 +12858,15 @@
           "calcite-scrim"
         ],
         "calcite-filter": [
-          "calcite-scrim",
           "calcite-input",
           "calcite-icon"
         ],
-        "calcite-scrim": [
-          "calcite-loader"
-        ],
         "calcite-input": [
           "calcite-progress",
           "calcite-icon"
+        ],
+        "calcite-scrim": [
+          "calcite-loader"
         ]
       }
     },
@@ -12984,7 +13018,7 @@
               "type": "boolean"
             }
           ],
-          "optional": true,
+          "optional": false,
           "required": false
         },
         {
@@ -14829,7 +14863,6 @@
       "parts": [],
       "dependents": [
         "calcite-block",
-        "calcite-filter",
         "calcite-modal",
         "calcite-panel",
         "calcite-pick-list",
@@ -14845,9 +14878,6 @@
         "calcite-block": [
           "calcite-scrim"
         ],
-        "calcite-filter": [
-          "calcite-scrim"
-        ],
         "calcite-modal": [
           "calcite-scrim"
         ],
@@ -16719,7 +16749,7 @@
           "type": "boolean",
           "mutable": false,
           "attr": "disabled",
-          "reflectToAttr": false,
+          "reflectToAttr": true,
           "docs": "is the step disabled and not navigable to by a user",
           "docsTags": [],
           "default": "false",
@@ -18086,6 +18116,23 @@
       ],
       "usage": {},
       "props": [
+        {
+          "name": "disabled",
+          "type": "boolean",
+          "mutable": false,
+          "attr": "disabled",
+          "reflectToAttr": true,
+          "docs": "The disabled state of the tile select.",
+          "docsTags": [],
+          "default": "false",
+          "values": [
+            {
+              "type": "boolean"
+            }
+          ],
+          "optional": false,
+          "required": false
+        },
         {
           "name": "layout",
           "type": "\"horizontal\" | \"vertical\"",
@@ -19757,16 +19804,15 @@
           "calcite-scrim"
         ],
         "calcite-filter": [
-          "calcite-scrim",
           "calcite-input",
           "calcite-icon"
         ],
-        "calcite-scrim": [
-          "calcite-loader"
-        ],
         "calcite-input": [
           "calcite-progress",
           "calcite-icon"
+        ],
+        "calcite-scrim": [
+          "calcite-loader"
         ]
       }
     },
@@ -19818,7 +19864,7 @@
               "type": "boolean"
             }
           ],
-          "optional": true,
+          "optional": false,
           "required": false
         },
         {

package/dist/types/components/action/action.d.ts

@@ -1,9 +1,10 @@
 import { EventEmitter, VNode } from "../../stencil-public-runtime";
 import { Alignment, Appearance, Scale } from "../interfaces";
+import { InteractiveComponent } from "../../utils/interactive";
 /**
  * @slot - A slot for adding a `calcite-icon`.
  */
-export declare class Action {
+export declare class Action implements InteractiveComponent {
   /**
    * Indicates whether the action is highlighted.
    */
@@ -64,6 +65,7 @@ export declare class Action {
   mutationObserver: MutationObserver;
   connectedCallback(): void;
   disconnectedCallback(): void;
+  componentDidRender(): void;
   /** Sets focus on the component. */
   setFocus(): Promise<void>;
   renderTextContainer(): VNode;

package/dist/types/components/block/block.d.ts

@@ -2,13 +2,14 @@ import { EventEmitter, VNode } from "../../stencil-public-runtime";
 import { HeadingLevel } from "../functional/Heading";
 import { Status } from "../interfaces";
 import { ConditionalSlotComponent } from "../../utils/conditionalSlot";
+import { InteractiveComponent } from "../../utils/interactive";
 /**
  * @slot - A slot for adding content to the block.
  * @slot icon - A slot for adding a leading header icon.
  * @slot control - A slot for adding a single HTML input element in a header.
  * @slot header-menu-actions - a slot for adding an overflow menu with actions inside a dropdown.
  */
-export declare class Block implements ConditionalSlotComponent {
+export declare class Block implements ConditionalSlotComponent, InteractiveComponent {
   /**
    * When true, this block will be collapsible.
    */
@@ -61,6 +62,7 @@ export declare class Block implements ConditionalSlotComponent {
    * Block summary.
    */
   summary: string;
+  componentDidRender(): void;
   el: HTMLCalciteBlockElement;
   private guid;
   connectedCallback(): void;

package/dist/types/components/button/button.d.ts

@@ -3,10 +3,11 @@ import { VNode } from "../../stencil-public-runtime";
 import { ButtonAlignment, ButtonAppearance, ButtonColor } from "./interfaces";
 import { FlipContext, Scale, Width } from "../interfaces";
 import { LabelableComponent } from "../../utils/label";
+import { InteractiveComponent } from "../../utils/interactive";
 /** Passing a 'href' will render an anchor link, instead of a button. Role will be set to link, or button, depending on this. */
 /** It is the consumers responsibility to add aria information, rel, target, for links, and any button attributes for form submission */
 /** @slot - A slot for adding text. */
-export declare class Button implements LabelableComponent {
+export declare class Button implements LabelableComponent, InteractiveComponent {
   el: HTMLCalciteButtonElement;
   /** optionally specify alignment of button elements. */
   alignment?: ButtonAlignment;
@@ -58,6 +59,7 @@ export declare class Button implements LabelableComponent {
   connectedCallback(): void;
   disconnectedCallback(): void;
   componentWillLoad(): void;
+  componentDidRender(): void;
   render(): VNode;
   /** Sets focus on the component. */
   setFocus(): Promise<void>;

package/dist/types/components/checkbox/checkbox.d.ts

@@ -2,7 +2,8 @@ import { EventEmitter, VNode } from "../../stencil-public-runtime";
 import { Scale } from "../interfaces";
 import { CheckableFormCompoment } from "../../utils/form";
 import { LabelableComponent } from "../../utils/label";
-export declare class Checkbox implements LabelableComponent, CheckableFormCompoment {
+import { InteractiveComponent } from "../../utils/interactive";
+export declare class Checkbox implements LabelableComponent, CheckableFormCompoment, InteractiveComponent {
   el: HTMLCalciteCheckboxElement;
   /** The checked state of the checkbox. */
   checked: boolean;
@@ -69,5 +70,6 @@ export declare class Checkbox implements LabelableComponent, CheckableFormCompom
   onLabelClick: () => void;
   connectedCallback(): void;
   disconnectedCallback(): void;
+  componentDidRender(): void;
   render(): VNode;
 }

package/dist/types/components/color-picker/color-picker.d.ts

@@ -3,7 +3,8 @@ import Color from "color";
 import { ColorAppearance, ColorMode, ColorValue, InternalColor } from "./interfaces";
 import { Scale } from "../interfaces";
 import { Format } from "./utils";
-export declare class ColorPicker {
+import { InteractiveComponent } from "../../utils/interactive";
+export declare class ColorPicker implements InteractiveComponent {
   el: HTMLCalciteColorPickerElement;
   /**
    * When false, empty color (null) will be allowed as a value. Otherwise, a color value is always enforced by the component.
@@ -20,6 +21,10 @@ export declare class ColorPicker {
    */
   color: InternalColor | null;
   handleColorChange(color: Color | null, oldColor: Color | null): void;
+  /**
+   * When true, disabled prevents user interaction.
+   */
+  disabled: boolean;
   /**
    * The format of the value property.
    *
@@ -138,6 +143,7 @@ export declare class ColorPicker {
   private fieldAndSliderRenderingContext;
   private colorFieldScopeNode;
   private hueThumbState;
+  private hueScopeNode;
   private internalColorUpdateContext;
   private previousColor;
   private mode;
@@ -193,8 +199,10 @@ export declare class ColorPicker {
   setFocus(): Promise<void>;
   componentWillLoad(): void;
   disconnectedCallback(): void;
+  componentDidRender(): void;
   render(): VNode;
   private storeColorFieldScope;
+  private storeHueScope;
   private renderChannelsTabTitle;
   private renderChannelsTab;
   private renderChannel;

package/dist/types/components/combobox/combobox.d.ts

@@ -6,6 +6,7 @@ import { Scale } from "../interfaces";
 import { ComboboxSelectionMode, ComboboxChildElement } from "./interfaces";
 import { LabelableComponent } from "../../utils/label";
 import { FormComponent } from "../../utils/form";
+import { InteractiveComponent } from "../../utils/interactive";
 interface ItemData {
   label: string;
   value: string;
@@ -13,13 +14,14 @@ interface ItemData {
 /**
  * @slot - A slot for adding `calcite-combobox-item`s.
  */
-export declare class Combobox implements LabelableComponent, FormComponent {
+export declare class Combobox implements LabelableComponent, FormComponent, InteractiveComponent {
   el: HTMLCalciteComboboxElement;
   /** Opens or closes the combobox */
   active: boolean;
-  activeHandler(newValue: boolean, oldValue: boolean): void;
+  activeHandler(): void;
   /** Disable combobox input */
   disabled: boolean;
+  handleDisabledChange(value: boolean): void;
   /** Aria label for combobox (required) */
   label: string;
   /** Placeholder text for input */
@@ -103,12 +105,10 @@ export declare class Combobox implements LabelableComponent, FormComponent {
   selectedItemsHandler(): void;
   visibleItems: HTMLCalciteComboboxItemElement[];
   needsIcon: boolean;
-  hideList: boolean;
   activeItemIndex: number;
   activeChipIndex: number;
   activeDescendant: string;
   text: string;
-  open: boolean;
   /** when search text is cleared, reset active to  */
   textHandler(): void;
   textInput: HTMLInputElement;

package/dist/types/components/combobox-item/combobox-item.d.ts

@@ -2,10 +2,11 @@ import { EventEmitter, VNode } from "../../stencil-public-runtime";
 import { ComboboxChildElement } from "../combobox/interfaces";
 import { Scale } from "../interfaces";
 import { ConditionalSlotComponent } from "../../utils/conditionalSlot";
+import { InteractiveComponent } from "../../utils/interactive";
 /**
  * @slot - A slot for adding nested `calcite-combobox-item`s.
  */
-export declare class ComboboxItem implements ConditionalSlotComponent {
+export declare class ComboboxItem implements ConditionalSlotComponent, InteractiveComponent {
   /** When true, the item cannot be clicked and is visually muted. */
   disabled: boolean;
   /** Set this to true to pre-select an item. Toggles when an item is checked/unchecked. */
@@ -30,6 +31,7 @@ export declare class ComboboxItem implements ConditionalSlotComponent {
   scale: Scale;
   connectedCallback(): void;
   disconnectedCallback(): void;
+  componentDidRender(): void;
   /**
    * Emitted whenever the item is selected or unselected.
    */

package/dist/types/components/date-picker-day/date-picker-day.d.ts

@@ -1,7 +1,8 @@
 import { EventEmitter, VNode } from "../../stencil-public-runtime";
 import { DateLocaleData } from "../date-picker/utils";
 import { Scale } from "../interfaces";
-export declare class DatePickerDay {
+import { InteractiveComponent } from "../../utils/interactive";
+export declare class DatePickerDay implements InteractiveComponent {
   el: HTMLCalciteDatePickerDayElement;
   /** Day of the month to be shown. */
   day: number;
@@ -42,4 +43,6 @@ export declare class DatePickerDay {
    */
   calciteDayHover: EventEmitter;
   render(): VNode;
+  componentDidRender(): void;
+  isTabbable(): boolean;
 }

package/dist/types/components/dropdown/dropdown.d.ts

@@ -3,11 +3,12 @@ import { DropdownPlacement, ItemKeyboardEvent } from "./interfaces";
 import { OverlayPositioning } from "../../utils/popper";
 import { StrictModifiers } from "@popperjs/core";
 import { Scale } from "../interfaces";
+import { InteractiveComponent } from "../../utils/interactive";
 /**
  * @slot - A slot for adding `calcite-dropdown-group`s or `calcite-dropdown-item`s.
  * @slot dropdown-trigger - A slot for the element that triggers the dropdown.
  */
-export declare class Dropdown {
+export declare class Dropdown implements InteractiveComponent {
   el: HTMLCalciteDropdownElement;
   /** Opens or closes the dropdown */
   active: boolean;
@@ -19,6 +20,7 @@ export declare class Dropdown {
   disableCloseOnSelect: boolean;
   /** is the dropdown disabled  */
   disabled: boolean;
+  handleDisabledChange(value: boolean): void;
   /**
    specify the maximum number of calcite-dropdown-items to display before showing the scroller, must be greater than 0 -
    this value does not include groupTitles passed to calcite-dropdown-group
@@ -47,6 +49,7 @@ export declare class Dropdown {
   width: Scale;
   connectedCallback(): void;
   componentDidLoad(): void;
+  componentDidRender(): void;
   disconnectedCallback(): void;
   render(): VNode;
   /** Updates the position of the component. */

package/dist/types/components/fab/fab.d.ts

@@ -1,7 +1,8 @@
 import { VNode } from "../../stencil-public-runtime";
 import { Appearance, Scale } from "../interfaces";
 import { ButtonColor } from "../button/interfaces";
-export declare class Fab {
+import { InteractiveComponent } from "../../utils/interactive";
+export declare class Fab implements InteractiveComponent {
   /**
    * Used to set the button's appearance. Default is outline.
    */
@@ -41,6 +42,7 @@ export declare class Fab {
   textEnabled: boolean;
   el: HTMLCalciteFabElement;
   private buttonEl;
+  componentDidRender(): void;
   /** Sets focus on the component. */
   setFocus(): Promise<void>;
   render(): VNode;

package/dist/types/components/filter/filter.d.ts

@@ -1,7 +1,8 @@
 /// <reference types="lodash" />
 import { EventEmitter, VNode } from "../../stencil-public-runtime";
 import { Scale } from "../interfaces";
-export declare class Filter {
+import { InteractiveComponent } from "../../utils/interactive";
+export declare class Filter implements InteractiveComponent {
   /**
    * The items to filter through. The filter uses this as the starting point, and returns items
    * that contain the string entered in the input, using a partial match and recursive search.
@@ -41,6 +42,7 @@ export declare class Filter {
   valueHandler(value: string): void;
   el: HTMLCalciteFilterElement;
   textInput: HTMLCalciteInputElement;
+  componentDidRender(): void;
   /**
    * This event fires when the filter text changes.
    */

package/dist/types/components/inline-editable/inline-editable.d.ts

@@ -1,10 +1,11 @@
 import { EventEmitter, VNode } from "../../stencil-public-runtime";
 import { Scale } from "../interfaces";
 import { LabelableComponent } from "../../utils/label";
+import { InteractiveComponent } from "../../utils/interactive";
 /**
  * @slot - A slot for adding a `calcite-input`.
  */
-export declare class InlineEditable implements LabelableComponent {
+export declare class InlineEditable implements InteractiveComponent, LabelableComponent {
   el: HTMLCalciteInlineEditableElement;
   /** specify whether editing can be enabled */
   disabled: boolean;
@@ -34,6 +35,7 @@ export declare class InlineEditable implements LabelableComponent {
   afterConfirm?: () => Promise<void>;
   connectedCallback(): void;
   disconnectedCallback(): void;
+  componentDidRender(): void;
   render(): VNode;
   /**
    * Emitted when the cancel button gets clicked.
@@ -53,6 +55,7 @@ export declare class InlineEditable implements LabelableComponent {
   private shouldEmitCancel;
   private enableEditingButton;
   private cancelEditingButton;
+  private confirmEditingButton;
   labelEl: HTMLCalciteLabelElement;
   mutationObserver: MutationObserver;
   setFocus(): Promise<void>;

package/dist/types/components/input/input.d.ts

@@ -4,11 +4,12 @@ import { InputPlacement } from "./interfaces";
 import { Position } from "../interfaces";
 import { LabelableComponent } from "../../utils/label";
 import { FormComponent } from "../../utils/form";
+import { InteractiveComponent } from "../../utils/interactive";
 declare type NumberNudgeDirection = "up" | "down";
 /**
  * @slot action - A slot for positioning a button next to an input
  */
-export declare class Input implements LabelableComponent, FormComponent {
+export declare class Input implements LabelableComponent, FormComponent, InteractiveComponent {
   el: HTMLCalciteInputElement;
   /** specify the alignment of the value of the input */
   alignment: Position;
@@ -123,6 +124,7 @@ export declare class Input implements LabelableComponent, FormComponent {
   disconnectedCallback(): void;
   componentWillLoad(): void;
   componentShouldUpdate(newValue: string, oldValue: string, property: string): boolean;
+  componentDidRender(): void;
   /**
    * @internal
    */

package/dist/types/components/input-date-picker/input-date-picker.d.ts

@@ -5,12 +5,14 @@ import { FormComponent } from "../../utils/form";
 import { OverlayPositioning } from "../../utils/popper";
 import { StrictModifiers } from "@popperjs/core";
 import { DateRangeChange } from "../date-picker/interfaces";
-export declare class InputDatePicker implements LabelableComponent, FormComponent {
+import { InteractiveComponent } from "../../utils/interactive";
+export declare class InputDatePicker implements LabelableComponent, FormComponent, InteractiveComponent {
   el: HTMLCalciteInputDatePickerElement;
   /**
    * When false, the component won't be interactive.
    */
   disabled: boolean;
+  handleDisabledChange(value: boolean): void;
   /** Selected date */
   value: string | string[];
   valueHandler(value: string | string[]): void;
@@ -121,6 +123,7 @@ export declare class InputDatePicker implements LabelableComponent, FormComponen
   connectedCallback(): void;
   componentWillLoad(): Promise<void>;
   disconnectedCallback(): void;
+  componentDidRender(): void;
   render(): VNode;
   labelEl: HTMLCalciteLabelElement;
   formEl: HTMLFormElement;

package/dist/types/components/input-time-picker/input-time-picker.d.ts

@@ -2,12 +2,15 @@ import { VNode, EventEmitter } from "../../stencil-public-runtime";
 import { Scale } from "../interfaces";
 import { LabelableComponent } from "../../utils/label";
 import { FormComponent } from "../../utils/form";
-export declare class InputTimePicker implements LabelableComponent, FormComponent {
+import { InteractiveComponent } from "../../utils/interactive";
+export declare class InputTimePicker implements LabelableComponent, FormComponent, InteractiveComponent {
   el: HTMLCalciteInputTimePickerElement;
   /** The active state of the time input */
   active: boolean;
+  activeHandler(): void;
   /** The disabled state of the time input */
   disabled: boolean;
+  handleDisabledChange(value: boolean): void;
   /** aria-label for the hour input */
   intlHour?: string;
   /** aria-label for the hour down button */
@@ -86,5 +89,6 @@ export declare class InputTimePicker implements LabelableComponent, FormComponen
   connectedCallback(): void;
   componentDidLoad(): void;
   disconnectedCallback(): void;
+  componentDidRender(): void;
   render(): VNode;
 }

package/dist/types/components/label/label.d.ts

@@ -20,7 +20,11 @@ export declare class Label {
   layout: "inline" | "inline-space-between" | "default";
   /** eliminates any space around the label */
   disableSpacing: boolean;
-  /** is the label disabled  */
+  /**
+   * is the label disabled
+   *
+   * @deprecated use the `disabled` property on the interactive components instead
+   */
   disabled: boolean;
   /**
    * @internal
@@ -29,5 +33,7 @@ export declare class Label {
     sourceEvent: MouseEvent;
   }>;
   labelClickHandler: (event: MouseEvent) => void;
+  connectedCallback(): void;
+  disconnectedCallback(): void;
   render(): VNode;
 }