@esri/calcite-components 2.13.0 → 2.14.0-next.1

package/dist/cjs/calcite-menu_2.cjs.entry.js

@@ -1,22 +1,22 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
+ * v2.14.0-next.1
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-03561b9a.js');
-const dom = require('./dom-401c47fa.js');
-const loadable = require('./loadable-1e343f4a.js');
-const locale = require('./locale-783be19a.js');
-const t9n = require('./t9n-5f0809e3.js');
-const resources = require('./resources-8d0a3a55.js');
-require('./guid-7487a6a8.js');
-require('./browser-b9024aa0.js');
-require('./key-8032a9dc.js');
-require('./observers-dc37fb24.js');
+const index = require('./index-fa8af6d4.js');
+const dom = require('./dom-c64d16b4.js');
+const loadable = require('./loadable-3b4436ea.js');
+const locale = require('./locale-c8a9eaf0.js');
+const t9n = require('./t9n-386452e2.js');
+const resources = require('./resources-d4d76af1.js');
+require('./guid-fd15b830.js');
+require('./browser-39ff1e63.js');
+require('./key-cae77b35.js');
+require('./observers-d4deb7de.js');
 
 const menuCss = ":host{display:flex}ul{margin:0px;display:inline-flex;block-size:100%;align-items:center;padding:0px}:host([layout=vertical]) ul{display:flex;inline-size:100%;flex-direction:column}:host([hidden]){display:none}[hidden]{display:none}";
 const CalciteMenuStyle0 = menuCss;
@@ -169,7 +169,7 @@ const CalciteMenu = class {
     //
     // --------------------------------------------------------------------------
     render() {
-        return (index.h(index.Host, { key: '75308ac4419f7116f73975ad9ff88d25817d0522' }, index.h("ul", { key: 'ed22f7ab681c6e583b0b5aa720823898759687cb', "aria-label": this.label, role: this.getEffectiveRole() }, index.h("slot", { key: '4296d48a1a8921802458776d02e119feeaf12b3e', onSlotchange: this.handleMenuSlotChange }))));
+        return (index.h(index.Host, { key: '4cb363f6a463f0f22b71a3df0f2639feff2157f6' }, index.h("ul", { key: '53b2a5f563a8515af4e19e4e39eea8480db2c4b0', "aria-label": this.label, role: this.getEffectiveRole() }, index.h("slot", { key: '16390029e4d2c851405e5e19f34c5b9bc898f4d6', onSlotchange: this.handleMenuSlotChange }))));
     }
     static get delegatesFocus() { return true; }
     static get assetsDirs() { return ["assets"]; }
@@ -429,10 +429,10 @@ const CalciteMenuItem = class {
     }
     render() {
         const dir = dom.getElementDir(this.el);
-        return (index.h(index.Host, { key: 'e57c6579d3287593d663a8586cfd25c90246b1a4', onBlur: this.blurHandler, onFocus: this.focusHandler }, index.h("li", { key: '954549390e447ec43ccf681949095d1393d9068a', class: {
+        return (index.h(index.Host, { key: '71efd980a4ebf98a463878c3b202fcffb8454803', onBlur: this.blurHandler, onFocus: this.focusHandler }, index.h("li", { key: '1c928ac009ce1517a5cda11b1f25b6404ce1a400', class: {
                 [CSS.container]: true,
                 [CSS.isParentVertical]: this.topLevelMenuLayout === "vertical",
-            }, role: "none" }, index.h("div", { key: '6130156128f303bb225007e337fae78385614cf5', class: CSS.itemContent }, index.h("a", { key: '9103ba8f3683feb1eb2301f05412b434c39ec3d3', "aria-current": this.isFocused ? "page" : false, "aria-expanded": dom.toAriaBoolean(this.open), "aria-haspopup": dom.toAriaBoolean(this.hasSubmenu), "aria-label": this.label, class: { [CSS.layoutVertical]: this.layout === "vertical", [CSS.content]: true }, href: this.href, onClick: this.clickHandler, onKeyDown: this.keyDownHandler, ref: (el) => (this.anchorEl = el), rel: this.rel, role: "menuitem", tabIndex: this.isTopLevelItem ? 0 : -1, target: this.target }, this.renderItemContent(dir)), this.href && this.hasSubmenu ? this.renderDropdownAction(dir) : null), this.renderSubmenuItems(dir))));
+            }, role: "none" }, index.h("div", { key: '9d52d802c76cdfad6429f2e139466d08f6beb8dd', class: CSS.itemContent }, index.h("a", { key: 'bc96d8d25ebbc80abac136d4321d5e032615f4e8', "aria-current": this.isFocused ? "page" : false, "aria-expanded": dom.toAriaBoolean(this.open), "aria-haspopup": dom.toAriaBoolean(this.hasSubmenu), "aria-label": this.label, class: { [CSS.layoutVertical]: this.layout === "vertical", [CSS.content]: true }, href: this.href, onClick: this.clickHandler, onKeyDown: this.keyDownHandler, ref: (el) => (this.anchorEl = el), rel: this.rel, role: "menuitem", tabIndex: this.isTopLevelItem ? 0 : -1, target: this.target }, this.renderItemContent(dir)), this.href && this.hasSubmenu ? this.renderDropdownAction(dir) : null), this.renderSubmenuItems(dir))));
     }
     static get assetsDirs() { return ["assets"]; }
     get el() { return index.getElement(this); }

package/dist/cjs/calcite-meter.cjs.entry.js

@@ -1,22 +1,22 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
+ * v2.14.0-next.1
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-03561b9a.js');
-const loadable = require('./loadable-1e343f4a.js');
-const form = require('./form-26bde25c.js');
-const locale = require('./locale-783be19a.js');
-const dom = require('./dom-401c47fa.js');
-const observers = require('./observers-dc37fb24.js');
-require('./browser-b9024aa0.js');
-require('./key-8032a9dc.js');
-require('./guid-7487a6a8.js');
-require('./resources-8d0a3a55.js');
+const index = require('./index-fa8af6d4.js');
+const loadable = require('./loadable-3b4436ea.js');
+const form = require('./form-9fffc18b.js');
+const locale = require('./locale-c8a9eaf0.js');
+const dom = require('./dom-c64d16b4.js');
+const observers = require('./observers-d4deb7de.js');
+require('./browser-39ff1e63.js');
+require('./key-cae77b35.js');
+require('./guid-fd15b830.js');
+require('./resources-d4d76af1.js');
 
 const CSS = {
     container: "container",
@@ -293,7 +293,7 @@ const Meter = class {
             : unitLabel
                 ? textUnitLabel
                 : undefined;
-        return (index.h(index.Host, { key: '66acf0e583d412615e49ef652baf9bfbb97dab39' }, index.h("div", { key: 'eea0363c803ea0f4a1e2650aa543a4a0f2fe095c', "aria-label": label, "aria-valuemax": rangeLabelType === "percent" ? maxPercent : max, "aria-valuemin": rangeLabelType === "percent" ? minPercent : min, "aria-valuenow": valueLabelType === "percent" ? currentPercent : value, "aria-valuetext": valueText, class: {
+        return (index.h(index.Host, { key: 'da588e28c14dc4f36cda75745867703534402221' }, index.h("div", { key: '86a7b23757bdf12dd47c0f2838d2e4869b340d24', "aria-label": label, "aria-valuemax": rangeLabelType === "percent" ? maxPercent : max, "aria-valuemin": rangeLabelType === "percent" ? minPercent : min, "aria-valuenow": valueLabelType === "percent" ? currentPercent : value, "aria-valuetext": valueText, class: {
                 [CSS.container]: true,
                 [CSS.stepsVisible]: rangeLabels,
                 [CSS.valueVisible]: valueLabel,

package/dist/cjs/calcite-modal.cjs.entry.js

@@ -1,28 +1,28 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
+ * v2.14.0-next.1
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-03561b9a.js');
-const conditionalSlot = require('./conditionalSlot-961cb966.js');
-const dom = require('./dom-401c47fa.js');
-const focusTrapComponent = require('./focusTrapComponent-f0b8db52.js');
-const loadable = require('./loadable-1e343f4a.js');
-const observers = require('./observers-dc37fb24.js');
-const openCloseComponent = require('./openCloseComponent-56b018ff.js');
-const locale = require('./locale-783be19a.js');
-const t9n = require('./t9n-5f0809e3.js');
-const component = require('./component-25eaec79.js');
-const logger = require('./logger-d24af796.js');
-require('./guid-7487a6a8.js');
-require('./resources-8d0a3a55.js');
-require('./config-86d6376a.js');
-require('./browser-b9024aa0.js');
-require('./key-8032a9dc.js');
+const index = require('./index-fa8af6d4.js');
+const conditionalSlot = require('./conditionalSlot-99aaa74c.js');
+const dom = require('./dom-c64d16b4.js');
+const focusTrapComponent = require('./focusTrapComponent-a7465f5d.js');
+const loadable = require('./loadable-3b4436ea.js');
+const observers = require('./observers-d4deb7de.js');
+const openCloseComponent = require('./openCloseComponent-ad632ba8.js');
+const locale = require('./locale-c8a9eaf0.js');
+const t9n = require('./t9n-386452e2.js');
+const component = require('./component-7ca6ac5e.js');
+const logger = require('./logger-35d559ae.js');
+require('./guid-fd15b830.js');
+require('./resources-d4d76af1.js');
+require('./config-17be57de.js');
+require('./browser-39ff1e63.js');
+require('./key-cae77b35.js');
 
 const CSS = {
     modal: "modal",
@@ -215,16 +215,16 @@ const Modal = class {
         this.embedded = false;
     }
     render() {
-        return (index.h(index.Host, { key: 'f92cd77f4a5ad4a245ca50fe2b2bfcf9966d4ca8', "aria-describedby": this.contentId, "aria-labelledby": this.titleId, "aria-modal": "true", role: "dialog" }, index.h("div", { key: 'a9d348a67842162f1bc17ec8422c07963aed412d', class: {
+        return (index.h(index.Host, { key: '8c409722714684eb0f665e549523f34aac1be69c', "aria-describedby": this.contentId, "aria-labelledby": this.titleId, "aria-modal": "true", role: "dialog" }, index.h("div", { key: 'ad54181348aaef69a2e22346be1cdd11be87dd99', class: {
                 [CSS.container]: true,
                 [CSS.containerOpen]: this.opened,
                 [CSS.containerEmbedded]: this.embedded,
-            } }, index.h("calcite-scrim", { key: '7dc3bc9220fc375522a6d390b633f9573bfa6c67', class: CSS.scrim, onClick: this.handleOutsideClose }), this.renderStyle(), index.h("div", { key: '40782ba2b6d3f086c884ace3529110e873009504', class: {
+            } }, index.h("calcite-scrim", { key: '7319909520fa2ea225e696452439f8da826d39a9', class: CSS.scrim, onClick: this.handleOutsideClose }), this.renderStyle(), index.h("div", { key: 'f0e92999d4fbfbf0b5231cf988417fb3fcd821da', class: {
                 [CSS.modal]: true,
-            }, ref: this.setTransitionEl }, index.h("div", { key: 'ea3a72ab0a0e5abae6e766d0b7b2cfce54667e86', class: CSS.header }, this.renderCloseButton(), index.h("header", { key: 'abe5c28d11fc6241cd6ac40adef4d94529eb9d5c', class: CSS.title }, index.h("slot", { key: '3d1d6ed6c0249472a00fba4128a861e6a6eae4dd', name: CSS.header }))), this.renderContentTop(), index.h("div", { key: '0e65dfbd175e490586518d1a4c34b9eb1dde1f01', class: {
+            }, ref: this.setTransitionEl }, index.h("div", { key: '4e1a9b4839dcb0a47127321ec26e79169ca048b1', class: CSS.header }, this.renderCloseButton(), index.h("header", { key: '5c3e98da4c5bfd0d46219058732de4bd4d8f9232', class: CSS.title }, index.h("slot", { key: '7438bdfe95a3329be353642ef103196162e9db6f', name: CSS.header }))), this.renderContentTop(), index.h("div", { key: 'fa4b0a4cf7df54678fa9f007a4ac858f048bab01', class: {
                 [CSS.content]: true,
                 [CSS.contentNoFooter]: !this.hasFooter,
-            }, ref: (el) => (this.modalContent = el) }, index.h("slot", { key: 'd5f3b08e61e8e47f64fd13bc6eb7f7ed6a07b7c8', name: SLOTS.content })), this.renderContentBottom(), this.renderFooter()))));
+            }, ref: (el) => (this.modalContent = el) }, index.h("slot", { key: 'e5d9c13755dcc697c418b8a45da13d13d516bdcb', name: SLOTS.content })), this.renderContentBottom(), this.renderFooter()))));
     }
     renderFooter() {
         return this.hasFooter ? (index.h("div", { class: CSS.footer, key: "footer" }, index.h("span", { class: CSS.back }, index.h("slot", { name: SLOTS.back })), index.h("span", { class: CSS.secondary }, index.h("slot", { name: SLOTS.secondary })), index.h("span", { class: CSS.primary }, index.h("slot", { name: SLOTS.primary })))) : null;

package/dist/cjs/calcite-navigation_3.cjs.entry.js

@@ -1,19 +1,19 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
+ * v2.14.0-next.1
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-03561b9a.js');
-const dom = require('./dom-401c47fa.js');
-const loadable = require('./loadable-1e343f4a.js');
-const Heading = require('./Heading-5fb8f15a.js');
-require('./guid-7487a6a8.js');
-require('./resources-8d0a3a55.js');
-require('./browser-b9024aa0.js');
+const index = require('./index-fa8af6d4.js');
+const dom = require('./dom-c64d16b4.js');
+const loadable = require('./loadable-3b4436ea.js');
+const Heading = require('./Heading-75644f3d.js');
+require('./guid-fd15b830.js');
+require('./resources-d4d76af1.js');
+require('./browser-39ff1e63.js');
 
 const CSS$2 = {
     container: "container",
@@ -151,12 +151,12 @@ const CalciteNavigation = class {
             this.primaryContentStartSlotHasElements ||
             this.navigationAction;
         const slotName = this.el.slot;
-        return (index.h(index.Host, { key: 'bf64aa6c6c41bfad6413b58f7897527bb62e1d96' }, index.h("div", { key: '8c30501a94d5c41e60291c1f0d1cb2856afa5d62', class: {
+        return (index.h(index.Host, { key: 'f35668548bf8f89a75fe855482289e057137518f' }, index.h("div", { key: 'bd2904509a2a205e5f1cf2fe9f56377751b528d8', class: {
                 [CSS$2.container]: true,
                 [CSS$2.secondary]: slotName === SLOTS.navSecondary,
                 [CSS$2.tertiary]: slotName === SLOTS.navTertiary,
                 [CSS$2.primary]: primaryLevelHasElements,
-            } }, index.h("div", { key: 'ef4c088fc24566ca24da9abe6a30903fedcad4d9', class: { [CSS$2.hide]: !this.progressSlotHasElement, [SLOTS.progress]: true } }, index.h("slot", { key: '0abc91e366b542e11ee76f13f099ee8b64a55ee0', name: SLOTS.progress, onSlotchange: this.handleProgressSlotChange })), index.h("div", { key: '689dc16c2ab71944a78f3bfc16c1c16c9159f073', class: { [CSS$2.containerContent]: true, [CSS$2.hasProgress]: this.progressSlotHasElement } }, this.renderMenuAction(), index.h("div", { key: '122f9d2d278a0a87dc1774f4933a4bb120410e48', class: { [CSS$2.hide]: !this.logoSlotHasElements, [SLOTS.logo]: true } }, index.h("slot", { key: '38f2a0106cb2b3a844b60406c629c0cff4c1b64e', name: SLOTS.logo, onSlotchange: this.handleLogoSlotChange })), index.h("slot", { key: 'af8aa2c6ed65c95c51ebe31314cd1e684beef657', name: SLOTS.contentStart, onSlotchange: this.handleContentStartSlotChange }), index.h("slot", { key: '989ba0f344ce973ea32b07ee02b04d62068cefb8', name: SLOTS.contentCenter, onSlotchange: this.handleContentCenterSlotChange }), index.h("slot", { key: 'e0fd2d40efb52e8735ca426c1374a3da4882a77d', name: SLOTS.contentEnd, onSlotchange: this.handleContentEndSlotChange }), index.h("div", { key: '56e905fef7a76fd14be7085f367d6abf8b44a80b', class: { [CSS$2.hide]: !this.userSlotHasElements, [SLOTS.user]: true } }, index.h("slot", { key: 'e038f1510da60abbb05c1fd8541563334f86f6d5', name: SLOTS.user, onSlotchange: this.handleUserSlotChange })))), index.h(index.Fragment, { key: '3a65439c3774cfb42fa6bc5f12c234a66f8bb314' }, index.h("slot", { key: '52e0b810e42911da6dc1ea448026f5756df0206f', name: SLOTS.navSecondary, onSlotchange: this.handleSecondarySlotChange }), index.h("slot", { key: '97c2666bcd896fa763cb84d6b53285e2e26b51d1', name: SLOTS.navTertiary, onSlotchange: this.handleTertiarySlotChange }))));
+            } }, index.h("div", { key: '5d251d7edb60d7da43304fc44feb3659ff91ef61', class: { [CSS$2.hide]: !this.progressSlotHasElement, [SLOTS.progress]: true } }, index.h("slot", { key: 'cc51b3414dd67262a8de34c49ecb21eeb5bdef7d', name: SLOTS.progress, onSlotchange: this.handleProgressSlotChange })), index.h("div", { key: 'a320da41a71cdaab2e355e313e5820c3c2574291', class: { [CSS$2.containerContent]: true, [CSS$2.hasProgress]: this.progressSlotHasElement } }, this.renderMenuAction(), index.h("div", { key: '0e975cea94125c15d04aee92a84c049b28b96ea5', class: { [CSS$2.hide]: !this.logoSlotHasElements, [SLOTS.logo]: true } }, index.h("slot", { key: 'eff5f08dc0c68857e3c2baf76a92ff6aa1373de6', name: SLOTS.logo, onSlotchange: this.handleLogoSlotChange })), index.h("slot", { key: 'ce4efe6059d3c41f409b871cd5558d2bc0a3063c', name: SLOTS.contentStart, onSlotchange: this.handleContentStartSlotChange }), index.h("slot", { key: '6408a6b03300f178654259ca00f9bf7a8fcfe6ed', name: SLOTS.contentCenter, onSlotchange: this.handleContentCenterSlotChange }), index.h("slot", { key: '99540ee5ef662d38c6b9aecf9c9615174c508e14', name: SLOTS.contentEnd, onSlotchange: this.handleContentEndSlotChange }), index.h("div", { key: 'd3644b53dc26bd70b035fbc6504b378ba5f04fe8', class: { [CSS$2.hide]: !this.userSlotHasElements, [SLOTS.user]: true } }, index.h("slot", { key: 'b79d456b5aaa41406ca44b456fa66155a9b5e066', name: SLOTS.user, onSlotchange: this.handleUserSlotChange })))), index.h(index.Fragment, { key: 'c3fd6568a36b52254279ccb5d4311d23dee23d16' }, index.h("slot", { key: '8c25c4ebcb48928ab43474064ec9f8ecb27eeb10', name: SLOTS.navSecondary, onSlotchange: this.handleSecondarySlotChange }), index.h("slot", { key: 'b0ba9214c5731c14f93443bc11c84bf6067a6997', name: SLOTS.navTertiary, onSlotchange: this.handleTertiarySlotChange }))));
     }
     get el() { return index.getElement(this); }
 };
@@ -233,7 +233,7 @@ const CalciteNavigationLogo = class {
     }
     render() {
         const { thumbnail } = this;
-        return (index.h(index.Host, { key: '40dcb76c1c7919fd1a8b6929616d1d507c1e3301' }, index.h("a", { key: '7b457d99add3c3d4edbd4478711f9b9c9fb12caf', class: CSS$1.anchor, href: this.href, rel: this.rel, target: this.target }, thumbnail && index.h("img", { key: '592aa3cfc2dfa47f9aa603f7edce4521dbaa27ae', alt: this.label || "", class: CSS$1.image, src: thumbnail }), this.icon && this.renderIcon(), this.renderHeaderContent())));
+        return (index.h(index.Host, { key: '90fc739226622733d0552b84954ccd194ffd1c9e' }, index.h("a", { key: '8f0d940f66c1061a9946a0aa652c7a08748dc5e2', class: CSS$1.anchor, href: this.href, rel: this.rel, target: this.target }, thumbnail && index.h("img", { key: '27ecb4c67f336a7c930d078b17cb0eee618f02b8', alt: this.label || "", class: CSS$1.image, src: thumbnail }), this.icon && this.renderIcon(), this.renderHeaderContent())));
     }
     static get delegatesFocus() { return true; }
     get el() { return index.getElement(this); }
@@ -288,7 +288,7 @@ const CalciteNavigationUser = class {
     //
     // --------------------------------------------------------------------------
     render() {
-        return (index.h(index.Host, { key: 'd848f4b0ee430fdbf74ce63be874afc055b1a48a' }, index.h("button", { key: 'd8187d1795407a9d12e4f2c6c3d75dba47cdf028', "aria-label": this.label, class: CSS.button }, index.h("calcite-avatar", { key: '3a8526feb870ed33d7eae888c71f9489d90df26f', "full-name": this.fullName, label: this.label, thumbnail: this.thumbnail, "user-id": this.userId, username: this.username }), (this.fullName || this.username) && !this.textDisabled && (index.h("div", { key: '111bc54b8e187a95849ed325aca22880c00d1191', class: CSS.textContainer }, this.fullName && (index.h("span", { class: CSS.fullName, key: CSS.fullName }, this.fullName)), this.username && (index.h("span", { class: CSS.username, key: CSS.username }, this.username)))))));
+        return (index.h(index.Host, { key: '28c64eccedff51bdb929286f930ff05fbc0fd63b' }, index.h("button", { key: '86076e642459dcdb129e523c4ccd76ff8f198910', "aria-label": this.label, class: CSS.button }, index.h("calcite-avatar", { key: '52529e5574e09222db87a861bfae3ac6b204b7fe', "full-name": this.fullName, label: this.label, thumbnail: this.thumbnail, "user-id": this.userId, username: this.username }), (this.fullName || this.username) && !this.textDisabled && (index.h("div", { key: '9b57d3ff6c926045c3cfd0f3400ce39ffbea5336', class: CSS.textContainer }, this.fullName && (index.h("span", { class: CSS.fullName, key: CSS.fullName }, this.fullName)), this.username && (index.h("span", { class: CSS.username, key: CSS.username }, this.username)))))));
     }
     static get delegatesFocus() { return true; }
     get el() { return index.getElement(this); }

package/dist/cjs/calcite-notice.cjs.entry.js

@@ -1,26 +1,25 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
+ * v2.14.0-next.1
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-03561b9a.js');
-const conditionalSlot = require('./conditionalSlot-961cb966.js');
-const dom = require('./dom-401c47fa.js');
-const loadable = require('./loadable-1e343f4a.js');
-const locale = require('./locale-783be19a.js');
-const t9n = require('./t9n-5f0809e3.js');
-const resources = require('./resources-54927b58.js');
-const openCloseComponent = require('./openCloseComponent-56b018ff.js');
-const component = require('./component-25eaec79.js');
-require('./observers-dc37fb24.js');
-require('./browser-b9024aa0.js');
-require('./guid-7487a6a8.js');
-require('./resources-8d0a3a55.js');
-require('./key-8032a9dc.js');
+const index = require('./index-fa8af6d4.js');
+const dom = require('./dom-c64d16b4.js');
+const loadable = require('./loadable-3b4436ea.js');
+const locale = require('./locale-c8a9eaf0.js');
+const t9n = require('./t9n-386452e2.js');
+const resources = require('./resources-3f60eee1.js');
+const openCloseComponent = require('./openCloseComponent-ad632ba8.js');
+const component = require('./component-7ca6ac5e.js');
+require('./guid-fd15b830.js');
+require('./resources-d4d76af1.js');
+require('./browser-39ff1e63.js');
+require('./key-cae77b35.js');
+require('./observers-d4deb7de.js');
 
 const SLOTS = {
     title: "title",
@@ -57,6 +56,9 @@ const Notice = class {
         this.close = () => {
             this.open = false;
         };
+        this.handleActionsEndSlotChange = (event) => {
+            this.hasActionEnd = dom.slotChangeHasAssignedElement(event);
+        };
         this.openTransitionProp = "opacity";
         this.open = false;
         this.kind = "brand";
@@ -69,6 +71,7 @@ const Notice = class {
         this.messageOverrides = undefined;
         this.effectiveLocale = undefined;
         this.defaultMessages = undefined;
+        this.hasActionEnd = false;
     }
     openHandler() {
         openCloseComponent.onToggleOpenCloseComponent(this);
@@ -85,12 +88,10 @@ const Notice = class {
     //
     //--------------------------------------------------------------------------
     connectedCallback() {
-        conditionalSlot.connectConditionalSlotComponent(this);
         locale.connectLocalized(this);
         t9n.connectMessages(this);
     }
     disconnectedCallback() {
-        conditionalSlot.disconnectConditionalSlotComponent(this);
         locale.disconnectLocalized(this);
         t9n.disconnectMessages(this);
     }
@@ -106,10 +107,8 @@ const Notice = class {
         loadable.setComponentLoaded(this);
     }
     render() {
-        const { el } = this;
-        const closeButton = (index.h("button", { key: '52f9306ebe945398929f68fe66615359836ba2d8', "aria-label": this.messages.close, class: CSS.close, onClick: this.close, ref: (el) => (this.closeButton = el) }, index.h("calcite-icon", { key: 'f3601ac9547c73219661eebc7e7470db5dee7b52', icon: "x", scale: component.getIconScale(this.scale) })));
-        const hasActionEnd = dom.getSlotted(el, SLOTS.actionsEnd);
-        return (index.h("div", { key: '3f8117ff7cdd08c92ce804ef4ac8af83003156a4', class: CSS.container, ref: this.setTransitionEl }, this.requestedIcon ? (index.h("div", { class: CSS.icon }, index.h("calcite-icon", { flipRtl: this.iconFlipRtl, icon: this.requestedIcon, scale: component.getIconScale(this.scale) }))) : null, index.h("div", { key: '1b614ee86618bd5ce6e8834b466baf7d2564b5a1', class: CSS.content }, index.h("slot", { key: '19467ed9718a78c7530c2a08c727028d565dee7b', name: SLOTS.title }), index.h("slot", { key: '191e71caf2f2147c62fd6b73602e41d95dc27558', name: SLOTS.message }), index.h("slot", { key: 'd4fbf2b8aaa980cd24c5be89c6c8a36d091658f3', name: SLOTS.link })), hasActionEnd ? (index.h("div", { class: CSS.actionsEnd }, index.h("slot", { name: SLOTS.actionsEnd }))) : null, this.closable ? closeButton : null));
+        const closeButton = (index.h("button", { key: 'd26bac0229d3e9eed604a6cb1a484e7af5b8cc4e', "aria-label": this.messages.close, class: CSS.close, onClick: this.close, ref: (el) => (this.closeButton = el) }, index.h("calcite-icon", { key: '74d860bb7a4164ee60287f22181c798089fcb776', icon: "x", scale: component.getIconScale(this.scale) })));
+        return (index.h("div", { key: '8c4cf7ca81cda673e244462b9286879c7dde76de', class: CSS.container, ref: this.setTransitionEl }, this.requestedIcon ? (index.h("div", { class: CSS.icon }, index.h("calcite-icon", { flipRtl: this.iconFlipRtl, icon: this.requestedIcon, scale: component.getIconScale(this.scale) }))) : null, index.h("div", { key: '24b3a9bf52acbdd9989183a8588dac16c31576aa', class: CSS.content }, index.h("slot", { key: 'f56a9aa39be69da800e02a75d5be33c7e1c2fd6d', name: SLOTS.title }), index.h("slot", { key: '006514f8e5c03ccbbd5aad4034b1ca2d7d11287f', name: SLOTS.message }), index.h("slot", { key: '5d99ec170bbe3bc82809fc91a68cfe77ebdb0463', name: SLOTS.link })), index.h("div", { key: '71be42bbaa50035245b4e0ba5b1c8ae7354d36bb', class: CSS.actionsEnd, hidden: !this.hasActionEnd }, index.h("slot", { key: '31897bb7973288f272db530b0d61f4e4c5b7a7be', name: SLOTS.actionsEnd, onSlotchange: this.handleActionsEndSlotChange })), this.closable ? closeButton : null));
     }
     //--------------------------------------------------------------------------
     //

package/dist/cjs/calcite-notice.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"calcite-notice.entry.cjs.js","mappings":"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","names":["onToggleOpenCloseComponent","setRequestedIcon","KindIcons","connectConditionalSlotComponent","connectLocalized","connectMessages","disconnectConditionalSlotComponent","disconnectLocalized","disconnectMessages","setUpLoadableComponent","setUpMessages","setComponentLoaded","h","getIconScale","getSlotted","componentFocusable","updateMessages"],"sources":["src/components/notice/resources.ts","src/components/notice/notice.scss?tag=calcite-notice&encapsulation=shadow","src/components/notice/notice.tsx"],"sourcesContent":["export const SLOTS = {\n  title: \"title\",\n  message: \"message\",\n  link: \"link\",\n  actionsEnd: \"actions-end\",\n};\n\nexport const CSS = {\n  actionsEnd: \"actions-end\",\n  close: \"notice-close\",\n  container: \"container\",\n  content: \"notice-content\",\n  icon: \"notice-icon\",\n};\n","/**\n * CSS Custom Properties\n *\n * These properties can be overridden using the component's tag as selector.\n *\n * @prop --calcite-notice-width: The width of the component.\n */\n\n// scale variables\n:host([scale=\"s\"]) {\n  --calcite-notice-spacing-token-small: theme(\"spacing.2\");\n  --calcite-notice-spacing-token-large: theme(\"spacing.3\");\n  @include slotted(\"title\", \"*\", \".container\") {\n    @apply text-n1-wrap my-0.5;\n  }\n  @include slotted(\"message\", \"*\", \".container\") {\n    @apply text-n2-wrap my-0.5;\n  }\n  ::slotted(calcite-link) {\n    @apply text-n2-wrap my-0.5;\n  }\n  .notice-close {\n    // specific padding for close button to align with calcite-action small-scale spacing\n    @apply p-2;\n  }\n}\n\n:host([scale=\"m\"]) {\n  --calcite-notice-spacing-token-small: theme(\"spacing.3\");\n  --calcite-notice-spacing-token-large: theme(\"spacing.4\");\n  @include slotted(\"title\", \"*\", \".container\") {\n    @apply text-0-wrap my-0.5;\n  }\n  @include slotted(\"message\", \"*\", \".container\") {\n    @apply text-n1-wrap my-0.5;\n  }\n  ::slotted(calcite-link) {\n    @apply text-n1-wrap my-0.5;\n  }\n}\n\n:host([scale=\"l\"]) {\n  --calcite-notice-spacing-token-small: theme(\"spacing.4\");\n  --calcite-notice-spacing-token-large: theme(\"spacing.5\");\n  @include slotted(\"title\", \"*\", \".container\") {\n    @apply text-1-wrap my-0.5;\n  }\n  @include slotted(\"message\", \"*\", \".container\") {\n    @apply text-0-wrap my-0.5;\n  }\n  ::slotted(calcite-link) {\n    @apply text-0-wrap my-0.5;\n  }\n}\n\n:host([width=\"auto\"]) {\n  --calcite-notice-width: theme(\"width.auto\");\n}\n\n:host([width=\"half\"]) {\n  --calcite-notice-width: theme(\"width[1/2]\");\n}\n\n:host([width=\"full\"]) {\n  --calcite-notice-width: theme(\"width.full\");\n}\n\n:host {\n  @apply mx-auto hidden max-w-full items-center;\n  inline-size: var(--calcite-notice-width);\n}\n\n.container {\n  @apply bg-foreground-1\n    pointer-events-none\n    my-0\n    box-border\n    flex\n    w-full\n    opacity-0;\n  max-block-size: 0;\n  transition-property: opacity, max-block-size;\n  transition-duration: var(--calcite-animation-timing);\n  text-align: start;\n  border-inline-start: var(--calcite-border-width-md) solid;\n  box-shadow: 0 0 0 0 transparent;\n}\n\n// focus styles\n.notice-close {\n  @apply focus-base;\n  &:focus {\n    @apply focus-inset;\n  }\n}\n\n:host {\n  @apply flex;\n}\n\n:host([open]) .container {\n  @apply shadow-1\n    pointer-events-auto\n    max-h-full\n    items-center\n    opacity-100;\n}\n\n@include slotted(\"title\", \"*\", \".container\") {\n  @apply text-color-1 m-0 font-medium;\n}\n\n@include slotted(\"message\", \"*\", \".container\") {\n  @apply text-color-2 m-0 inline font-normal;\n  margin-inline-end: var(--calcite-notice-spacing-token-small);\n}\n\n@mixin notice-element-base() {\n  @apply transition-default box-border;\n  padding-block: var(--calcite-notice-spacing-token-small);\n  padding-inline: var(--calcite-notice-spacing-token-large);\n  flex: 0 0 auto;\n}\n\n.notice-content {\n  @include notice-element-base;\n  @apply flex min-w-0 flex-col break-words;\n  flex: 1 1 0;\n  padding-block: var(--calcite-notice-spacing-token-small);\n  padding-inline: 0 var(--calcite-notice-spacing-token-small);\n\n  &:first-of-type:not(:only-child) {\n    padding-inline-start: var(--calcite-notice-spacing-token-large);\n  }\n  &:only-of-type {\n    padding-block: var(--calcite-notice-spacing-token-small);\n    padding-inline: var(--calcite-notice-spacing-token-large);\n  }\n}\n\n.notice-icon {\n  @apply flex items-center;\n  @include notice-element-base;\n}\n\n.notice-close {\n  @apply text-color-3 flex cursor-pointer items-center self-stretch border-none bg-transparent outline-none;\n  @include notice-element-base;\n  -webkit-appearance: none;\n\n  &:hover,\n  &:focus {\n    @apply bg-foreground-2 text-color-1;\n  }\n\n  &:active {\n    @apply bg-foreground-3;\n  }\n}\n\n.actions-end {\n  @apply flex self-stretch;\n}\n\n$notice-kinds:\n  \"brand\" var(--calcite-color-brand),\n  \"info\" var(--calcite-color-status-info),\n  \"danger\" var(--calcite-color-status-danger),\n  \"success\" var(--calcite-color-status-success),\n  \"warning\" var(--calcite-color-status-warning);\n\n@each $notice-kind in $notice-kinds {\n  $name: nth($notice-kind, 1);\n  $kind: nth($notice-kind, 2);\n\n  :host([kind=\"#{$name}\"]) .container {\n    border-color: $kind;\n    & .notice-icon {\n      color: $kind;\n    }\n  }\n}\n\n@include base-component();\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Method,\n  Prop,\n  State,\n  VNode,\n  Watch,\n} from \"@stencil/core\";\nimport {\n  ConditionalSlotComponent,\n  connectConditionalSlotComponent,\n  disconnectConditionalSlotComponent,\n} from \"../../utils/conditionalSlot\";\nimport { getSlotted, setRequestedIcon } from \"../../utils/dom\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport { connectLocalized, disconnectLocalized, LocalizedComponent } from \"../../utils/locale\";\nimport {\n  connectMessages,\n  disconnectMessages,\n  setUpMessages,\n  T9nComponent,\n  updateMessages,\n} from \"../../utils/t9n\";\nimport { Kind, Scale, Width } from \"../interfaces\";\nimport { KindIcons } from \"../resources\";\nimport { onToggleOpenCloseComponent, OpenCloseComponent } from \"../../utils/openCloseComponent\";\nimport { getIconScale } from \"../../utils/component\";\nimport { IconNameOrString } from \"../icon/interfaces\";\nimport { NoticeMessages } from \"./assets/notice/t9n\";\nimport { CSS, SLOTS } from \"./resources\";\n\n/**\n * Notices are intended to be used to present users with important-but-not-crucial contextual tips or copy. Because\n * notices are displayed inline, a common use case is displaying them on page-load to present users with short hints or contextual copy.\n * They are optionally closable - useful for keeping track of whether or not a user has closed the notice. You can also choose not\n * to display a notice on page load and set the \"active\" attribute as needed to contextually provide inline messaging to users.\n */\n\n/**\n * @slot title - A slot for adding the title.\n * @slot message - A slot for adding the message.\n * @slot link - A slot for adding a `calcite-action` to take, such as: \"undo\", \"try again\", \"link to page\", etc.\n * @slot actions-end - A slot for adding `calcite-action`s to the end of the component. It is recommended to use two or less actions.\n */\n\n@Component({\n  tag: \"calcite-notice\",\n  styleUrl: \"notice.scss\",\n  shadow: true,\n  assetsDirs: [\"assets\"],\n})\nexport class Notice\n  implements\n    ConditionalSlotComponent,\n    LoadableComponent,\n    T9nComponent,\n    LocalizedComponent,\n    OpenCloseComponent\n{\n  //--------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  //---------------------------------------------------------------------------\n\n  /** When `true`, the component is visible. */\n  @Prop({ reflect: true, mutable: true }) open = false;\n\n  @Watch(\"open\")\n  openHandler(): void {\n    onToggleOpenCloseComponent(this);\n  }\n\n  /** Specifies the kind of the component, which will apply to top border and icon. */\n  @Prop({ reflect: true }) kind: Extract<\n    \"brand\" | \"danger\" | \"info\" | \"success\" | \"warning\",\n    Kind\n  > = \"brand\";\n\n  /** When `true`, a close button is added to the component. */\n  @Prop({ reflect: true }) closable = false;\n\n  /**\n   * When `true`, shows a default recommended icon. Alternatively, pass a Calcite UI Icon name to display a specific icon.\n   */\n  @Prop({ reflect: true }) icon: IconNameOrString | boolean;\n\n  /** When `true`, the icon will be flipped when the element direction is right-to-left (`\"rtl\"`). */\n  @Prop({ reflect: true }) iconFlipRtl = false;\n\n  /** Specifies the size of the component. */\n  @Prop({ reflect: true }) scale: Scale = \"m\";\n\n  /** Specifies the width of the component. */\n  @Prop({ reflect: true }) width: Width = \"auto\";\n\n  /**\n   * Made into a prop for testing purposes only\n   *\n   * @internal\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messages: NoticeMessages;\n\n  /**\n   * Use this property to override individual strings used by the component.\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messageOverrides: Partial<NoticeMessages>;\n\n  @Watch(\"messageOverrides\")\n  onMessagesChange(): void {\n    /* wired up by t9n util */\n  }\n\n  @Watch(\"icon\")\n  @Watch(\"kind\")\n  updateRequestedIcon(): void {\n    this.requestedIcon = setRequestedIcon(KindIcons, this.icon, this.kind);\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    connectConditionalSlotComponent(this);\n    connectLocalized(this);\n    connectMessages(this);\n  }\n\n  disconnectedCallback(): void {\n    disconnectConditionalSlotComponent(this);\n    disconnectLocalized(this);\n    disconnectMessages(this);\n  }\n\n  async componentWillLoad(): Promise<void> {\n    setUpLoadableComponent(this);\n    this.requestedIcon = setRequestedIcon(KindIcons, this.icon, this.kind);\n    await setUpMessages(this);\n    if (this.open) {\n      onToggleOpenCloseComponent(this);\n    }\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  render(): VNode {\n    const { el } = this;\n    const closeButton = (\n      <button\n        aria-label={this.messages.close}\n        class={CSS.close}\n        onClick={this.close}\n        ref={(el) => (this.closeButton = el)}\n      >\n        <calcite-icon icon=\"x\" scale={getIconScale(this.scale)} />\n      </button>\n    );\n\n    const hasActionEnd = getSlotted(el, SLOTS.actionsEnd);\n\n    return (\n      <div class={CSS.container} ref={this.setTransitionEl}>\n        {this.requestedIcon ? (\n          <div class={CSS.icon}>\n            <calcite-icon\n              flipRtl={this.iconFlipRtl}\n              icon={this.requestedIcon}\n              scale={getIconScale(this.scale)}\n            />\n          </div>\n        ) : null}\n        <div class={CSS.content}>\n          <slot name={SLOTS.title} />\n          <slot name={SLOTS.message} />\n          <slot name={SLOTS.link} />\n        </div>\n        {hasActionEnd ? (\n          <div class={CSS.actionsEnd}>\n            <slot name={SLOTS.actionsEnd} />\n          </div>\n        ) : null}\n        {this.closable ? closeButton : null}\n      </div>\n    );\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n\n  /** Fires when the component is requested to be closed and before the closing transition begins. */\n  @Event({ cancelable: false }) calciteNoticeBeforeClose: EventEmitter<void>;\n\n  /** Fires when the component is added to the DOM but not rendered, and before the opening transition begins. */\n  @Event({ cancelable: false }) calciteNoticeBeforeOpen: EventEmitter<void>;\n\n  /** Fires when the component is closed and animation is complete. */\n  @Event({ cancelable: false }) calciteNoticeClose: EventEmitter<void>;\n\n  /** Fires when the component is open and animation is complete. */\n  @Event({ cancelable: false }) calciteNoticeOpen: EventEmitter<void>;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /** Sets focus on the component's first focusable element. */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n\n    const noticeLinkEl = this.el.querySelector(\"calcite-link\");\n\n    if (!this.closeButton && !noticeLinkEl) {\n      return;\n    }\n    if (noticeLinkEl) {\n      return noticeLinkEl.setFocus();\n    } else if (this.closeButton) {\n      this.closeButton.focus();\n    }\n  }\n\n  onBeforeClose(): void {\n    this.calciteNoticeBeforeClose.emit();\n  }\n\n  onBeforeOpen(): void {\n    this.calciteNoticeBeforeOpen.emit();\n  }\n\n  onClose(): void {\n    this.calciteNoticeClose.emit();\n  }\n\n  onOpen(): void {\n    this.calciteNoticeOpen.emit();\n  }\n\n  private setTransitionEl = (el: HTMLElement): void => {\n    this.transitionEl = el;\n  };\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n  private close = (): void => {\n    this.open = false;\n  };\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private State/Props\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteNoticeElement;\n\n  /** The close button element. */\n  private closeButton?: HTMLButtonElement;\n\n  /** The computed icon to render. */\n  private requestedIcon?: IconNameOrString;\n\n  @State() effectiveLocale: string;\n\n  @Watch(\"effectiveLocale\")\n  effectiveLocaleChange(): void {\n    updateMessages(this, this.effectiveLocale);\n  }\n\n  @State() defaultMessages: NoticeMessages;\n\n  openTransitionProp = \"opacity\";\n\n  transitionEl: HTMLElement;\n}\n"],"version":3}
+{"file":"calcite-notice.entry.cjs.js","mappings":"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","names":["slotChangeHasAssignedElement","onToggleOpenCloseComponent","setRequestedIcon","KindIcons","connectLocalized","connectMessages","disconnectLocalized","disconnectMessages","setUpLoadableComponent","setUpMessages","setComponentLoaded","h","getIconScale","componentFocusable","updateMessages"],"sources":["src/components/notice/resources.ts","src/components/notice/notice.scss?tag=calcite-notice&encapsulation=shadow","src/components/notice/notice.tsx"],"sourcesContent":["export const SLOTS = {\n  title: \"title\",\n  message: \"message\",\n  link: \"link\",\n  actionsEnd: \"actions-end\",\n};\n\nexport const CSS = {\n  actionsEnd: \"actions-end\",\n  close: \"notice-close\",\n  container: \"container\",\n  content: \"notice-content\",\n  icon: \"notice-icon\",\n};\n","/**\n * CSS Custom Properties\n *\n * These properties can be overridden using the component's tag as selector.\n *\n * @prop --calcite-notice-width: The width of the component.\n */\n\n// scale variables\n:host([scale=\"s\"]) {\n  --calcite-notice-spacing-token-small: theme(\"spacing.2\");\n  --calcite-notice-spacing-token-large: theme(\"spacing.3\");\n  @include slotted(\"title\", \"*\", \".container\") {\n    @apply text-n1-wrap my-0.5;\n  }\n  @include slotted(\"message\", \"*\", \".container\") {\n    @apply text-n2-wrap my-0.5;\n  }\n  ::slotted(calcite-link) {\n    @apply text-n2-wrap my-0.5;\n  }\n  .notice-close {\n    // specific padding for close button to align with calcite-action small-scale spacing\n    @apply p-2;\n  }\n}\n\n:host([scale=\"m\"]) {\n  --calcite-notice-spacing-token-small: theme(\"spacing.3\");\n  --calcite-notice-spacing-token-large: theme(\"spacing.4\");\n  @include slotted(\"title\", \"*\", \".container\") {\n    @apply text-0-wrap my-0.5;\n  }\n  @include slotted(\"message\", \"*\", \".container\") {\n    @apply text-n1-wrap my-0.5;\n  }\n  ::slotted(calcite-link) {\n    @apply text-n1-wrap my-0.5;\n  }\n}\n\n:host([scale=\"l\"]) {\n  --calcite-notice-spacing-token-small: theme(\"spacing.4\");\n  --calcite-notice-spacing-token-large: theme(\"spacing.5\");\n  @include slotted(\"title\", \"*\", \".container\") {\n    @apply text-1-wrap my-0.5;\n  }\n  @include slotted(\"message\", \"*\", \".container\") {\n    @apply text-0-wrap my-0.5;\n  }\n  ::slotted(calcite-link) {\n    @apply text-0-wrap my-0.5;\n  }\n}\n\n:host([width=\"auto\"]) {\n  --calcite-notice-width: theme(\"width.auto\");\n}\n\n:host([width=\"half\"]) {\n  --calcite-notice-width: theme(\"width[1/2]\");\n}\n\n:host([width=\"full\"]) {\n  --calcite-notice-width: theme(\"width.full\");\n}\n\n:host {\n  @apply mx-auto hidden max-w-full items-center;\n  inline-size: var(--calcite-notice-width);\n}\n\n.container {\n  @apply bg-foreground-1\n    pointer-events-none\n    my-0\n    box-border\n    flex\n    w-full\n    opacity-0;\n  max-block-size: 0;\n  transition-property: opacity, max-block-size;\n  transition-duration: var(--calcite-animation-timing);\n  text-align: start;\n  border-inline-start: var(--calcite-border-width-md) solid;\n  box-shadow: 0 0 0 0 transparent;\n}\n\n// focus styles\n.notice-close {\n  @apply focus-base;\n  &:focus {\n    @apply focus-inset;\n  }\n}\n\n:host {\n  @apply flex;\n}\n\n:host([open]) .container {\n  @apply shadow-1\n    pointer-events-auto\n    max-h-full\n    items-center\n    opacity-100;\n}\n\n@include slotted(\"title\", \"*\", \".container\") {\n  @apply text-color-1 m-0 font-medium;\n}\n\n@include slotted(\"message\", \"*\", \".container\") {\n  @apply text-color-2 m-0 inline font-normal;\n  margin-inline-end: var(--calcite-notice-spacing-token-small);\n}\n\n@mixin notice-element-base() {\n  @apply transition-default box-border;\n  padding-block: var(--calcite-notice-spacing-token-small);\n  padding-inline: var(--calcite-notice-spacing-token-large);\n  flex: 0 0 auto;\n}\n\n.notice-content {\n  @include notice-element-base;\n  @apply flex min-w-0 flex-col break-words;\n  flex: 1 1 0;\n  padding-block: var(--calcite-notice-spacing-token-small);\n  padding-inline: 0 var(--calcite-notice-spacing-token-small);\n\n  &:first-of-type:not(:only-child) {\n    padding-inline-start: var(--calcite-notice-spacing-token-large);\n  }\n  &:only-of-type {\n    padding-block: var(--calcite-notice-spacing-token-small);\n    padding-inline: var(--calcite-notice-spacing-token-large);\n  }\n}\n\n.notice-icon {\n  @apply flex items-center;\n  @include notice-element-base;\n}\n\n.notice-close {\n  @apply text-color-3 flex cursor-pointer items-center self-stretch border-none bg-transparent outline-none;\n  @include notice-element-base;\n  -webkit-appearance: none;\n\n  &:hover,\n  &:focus {\n    @apply bg-foreground-2 text-color-1;\n  }\n\n  &:active {\n    @apply bg-foreground-3;\n  }\n}\n\n.actions-end {\n  @apply flex self-stretch;\n}\n\n$notice-kinds:\n  \"brand\" var(--calcite-color-brand),\n  \"info\" var(--calcite-color-status-info),\n  \"danger\" var(--calcite-color-status-danger),\n  \"success\" var(--calcite-color-status-success),\n  \"warning\" var(--calcite-color-status-warning);\n\n@each $notice-kind in $notice-kinds {\n  $name: nth($notice-kind, 1);\n  $kind: nth($notice-kind, 2);\n\n  :host([kind=\"#{$name}\"]) .container {\n    border-color: $kind;\n    & .notice-icon {\n      color: $kind;\n    }\n  }\n}\n\n@include base-component();\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Method,\n  Prop,\n  State,\n  VNode,\n  Watch,\n} from \"@stencil/core\";\nimport { setRequestedIcon, slotChangeHasAssignedElement } from \"../../utils/dom\";\nimport {\n  componentFocusable,\n  LoadableComponent,\n  setComponentLoaded,\n  setUpLoadableComponent,\n} from \"../../utils/loadable\";\nimport { connectLocalized, disconnectLocalized, LocalizedComponent } from \"../../utils/locale\";\nimport {\n  connectMessages,\n  disconnectMessages,\n  setUpMessages,\n  T9nComponent,\n  updateMessages,\n} from \"../../utils/t9n\";\nimport { Kind, Scale, Width } from \"../interfaces\";\nimport { KindIcons } from \"../resources\";\nimport { onToggleOpenCloseComponent, OpenCloseComponent } from \"../../utils/openCloseComponent\";\nimport { getIconScale } from \"../../utils/component\";\nimport { IconNameOrString } from \"../icon/interfaces\";\nimport { NoticeMessages } from \"./assets/notice/t9n\";\nimport { CSS, SLOTS } from \"./resources\";\n\n/**\n * Notices are intended to be used to present users with important-but-not-crucial contextual tips or copy. Because\n * notices are displayed inline, a common use case is displaying them on page-load to present users with short hints or contextual copy.\n * They are optionally closable - useful for keeping track of whether or not a user has closed the notice. You can also choose not\n * to display a notice on page load and set the \"active\" attribute as needed to contextually provide inline messaging to users.\n */\n\n/**\n * @slot title - A slot for adding the title.\n * @slot message - A slot for adding the message.\n * @slot link - A slot for adding a `calcite-action` to take, such as: \"undo\", \"try again\", \"link to page\", etc.\n * @slot actions-end - A slot for adding `calcite-action`s to the end of the component. It is recommended to use two or less actions.\n */\n\n@Component({\n  tag: \"calcite-notice\",\n  styleUrl: \"notice.scss\",\n  shadow: true,\n  assetsDirs: [\"assets\"],\n})\nexport class Notice\n  implements LoadableComponent, T9nComponent, LocalizedComponent, OpenCloseComponent\n{\n  //--------------------------------------------------------------------------\n  //\n  //  Properties\n  //\n  //---------------------------------------------------------------------------\n\n  /** When `true`, the component is visible. */\n  @Prop({ reflect: true, mutable: true }) open = false;\n\n  @Watch(\"open\")\n  openHandler(): void {\n    onToggleOpenCloseComponent(this);\n  }\n\n  /** Specifies the kind of the component, which will apply to top border and icon. */\n  @Prop({ reflect: true }) kind: Extract<\n    \"brand\" | \"danger\" | \"info\" | \"success\" | \"warning\",\n    Kind\n  > = \"brand\";\n\n  /** When `true`, a close button is added to the component. */\n  @Prop({ reflect: true }) closable = false;\n\n  /**\n   * When `true`, shows a default recommended icon. Alternatively, pass a Calcite UI Icon name to display a specific icon.\n   */\n  @Prop({ reflect: true }) icon: IconNameOrString | boolean;\n\n  /** When `true`, the icon will be flipped when the element direction is right-to-left (`\"rtl\"`). */\n  @Prop({ reflect: true }) iconFlipRtl = false;\n\n  /** Specifies the size of the component. */\n  @Prop({ reflect: true }) scale: Scale = \"m\";\n\n  /** Specifies the width of the component. */\n  @Prop({ reflect: true }) width: Width = \"auto\";\n\n  /**\n   * Made into a prop for testing purposes only\n   *\n   * @internal\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messages: NoticeMessages;\n\n  /**\n   * Use this property to override individual strings used by the component.\n   */\n  // eslint-disable-next-line @stencil-community/strict-mutable -- updated by t9n module\n  @Prop({ mutable: true }) messageOverrides: Partial<NoticeMessages>;\n\n  @Watch(\"messageOverrides\")\n  onMessagesChange(): void {\n    /* wired up by t9n util */\n  }\n\n  @Watch(\"icon\")\n  @Watch(\"kind\")\n  updateRequestedIcon(): void {\n    this.requestedIcon = setRequestedIcon(KindIcons, this.icon, this.kind);\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Lifecycle\n  //\n  //--------------------------------------------------------------------------\n\n  connectedCallback(): void {\n    connectLocalized(this);\n    connectMessages(this);\n  }\n\n  disconnectedCallback(): void {\n    disconnectLocalized(this);\n    disconnectMessages(this);\n  }\n\n  async componentWillLoad(): Promise<void> {\n    setUpLoadableComponent(this);\n    this.requestedIcon = setRequestedIcon(KindIcons, this.icon, this.kind);\n    await setUpMessages(this);\n    if (this.open) {\n      onToggleOpenCloseComponent(this);\n    }\n  }\n\n  componentDidLoad(): void {\n    setComponentLoaded(this);\n  }\n\n  render(): VNode {\n    const closeButton = (\n      <button\n        aria-label={this.messages.close}\n        class={CSS.close}\n        onClick={this.close}\n        ref={(el) => (this.closeButton = el)}\n      >\n        <calcite-icon icon=\"x\" scale={getIconScale(this.scale)} />\n      </button>\n    );\n\n    return (\n      <div class={CSS.container} ref={this.setTransitionEl}>\n        {this.requestedIcon ? (\n          <div class={CSS.icon}>\n            <calcite-icon\n              flipRtl={this.iconFlipRtl}\n              icon={this.requestedIcon}\n              scale={getIconScale(this.scale)}\n            />\n          </div>\n        ) : null}\n        <div class={CSS.content}>\n          <slot name={SLOTS.title} />\n          <slot name={SLOTS.message} />\n          <slot name={SLOTS.link} />\n        </div>\n        <div class={CSS.actionsEnd} hidden={!this.hasActionEnd}>\n          <slot name={SLOTS.actionsEnd} onSlotchange={this.handleActionsEndSlotChange} />\n        </div>\n        {this.closable ? closeButton : null}\n      </div>\n    );\n  }\n\n  //--------------------------------------------------------------------------\n  //\n  //  Events\n  //\n  //--------------------------------------------------------------------------\n\n  /** Fires when the component is requested to be closed and before the closing transition begins. */\n  @Event({ cancelable: false }) calciteNoticeBeforeClose: EventEmitter<void>;\n\n  /** Fires when the component is added to the DOM but not rendered, and before the opening transition begins. */\n  @Event({ cancelable: false }) calciteNoticeBeforeOpen: EventEmitter<void>;\n\n  /** Fires when the component is closed and animation is complete. */\n  @Event({ cancelable: false }) calciteNoticeClose: EventEmitter<void>;\n\n  /** Fires when the component is open and animation is complete. */\n  @Event({ cancelable: false }) calciteNoticeOpen: EventEmitter<void>;\n\n  //--------------------------------------------------------------------------\n  //\n  //  Public Methods\n  //\n  //--------------------------------------------------------------------------\n\n  /** Sets focus on the component's first focusable element. */\n  @Method()\n  async setFocus(): Promise<void> {\n    await componentFocusable(this);\n\n    const noticeLinkEl = this.el.querySelector(\"calcite-link\");\n\n    if (!this.closeButton && !noticeLinkEl) {\n      return;\n    }\n    if (noticeLinkEl) {\n      return noticeLinkEl.setFocus();\n    } else if (this.closeButton) {\n      this.closeButton.focus();\n    }\n  }\n\n  onBeforeClose(): void {\n    this.calciteNoticeBeforeClose.emit();\n  }\n\n  onBeforeOpen(): void {\n    this.calciteNoticeBeforeOpen.emit();\n  }\n\n  onClose(): void {\n    this.calciteNoticeClose.emit();\n  }\n\n  onOpen(): void {\n    this.calciteNoticeOpen.emit();\n  }\n\n  private setTransitionEl = (el: HTMLElement): void => {\n    this.transitionEl = el;\n  };\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private Methods\n  //\n  //--------------------------------------------------------------------------\n\n  private close = (): void => {\n    this.open = false;\n  };\n\n  private handleActionsEndSlotChange = (event: Event): void => {\n    this.hasActionEnd = slotChangeHasAssignedElement(event);\n  };\n\n  //--------------------------------------------------------------------------\n  //\n  //  Private State/Props\n  //\n  //--------------------------------------------------------------------------\n\n  @Element() el: HTMLCalciteNoticeElement;\n\n  /** The close button element. */\n  private closeButton?: HTMLButtonElement;\n\n  /** The computed icon to render. */\n  private requestedIcon?: IconNameOrString;\n\n  @State() effectiveLocale: string;\n\n  @Watch(\"effectiveLocale\")\n  effectiveLocaleChange(): void {\n    updateMessages(this, this.effectiveLocale);\n  }\n\n  @State() defaultMessages: NoticeMessages;\n\n  openTransitionProp = \"opacity\";\n\n  transitionEl: HTMLElement;\n\n  @State() hasActionEnd = false;\n}\n"],"version":3}

package/dist/cjs/calcite-option_3.cjs.entry.js

@@ -1,24 +1,24 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
+ * v2.14.0-next.1
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-03561b9a.js');
-const observers = require('./observers-dc37fb24.js');
-const dom = require('./dom-401c47fa.js');
-const form = require('./form-26bde25c.js');
-const interactive = require('./interactive-e27cd6e3.js');
-const label = require('./label-4cec1587.js');
-const loadable = require('./loadable-1e343f4a.js');
-const component = require('./component-25eaec79.js');
-const Validation = require('./Validation-64dfab90.js');
-require('./browser-b9024aa0.js');
-require('./guid-7487a6a8.js');
-require('./resources-8d0a3a55.js');
+const index = require('./index-fa8af6d4.js');
+const observers = require('./observers-d4deb7de.js');
+const dom = require('./dom-c64d16b4.js');
+const form = require('./form-9fffc18b.js');
+const interactive = require('./interactive-cad47537.js');
+const label = require('./label-818df254.js');
+const loadable = require('./loadable-3b4436ea.js');
+const component = require('./component-7ca6ac5e.js');
+const Validation = require('./Validation-9804753d.js');
+require('./browser-39ff1e63.js');
+require('./guid-fd15b830.js');
+require('./resources-d4d76af1.js');
 
 const optionCss = ":host{display:block}:host([hidden]){display:none}[hidden]{display:none}";
 const CalciteOptionStyle0 = optionCss;
@@ -82,7 +82,7 @@ const Option = class {
     //
     //--------------------------------------------------------------------------
     render() {
-        return index.h("slot", { key: 'e5df72ac4455ee2e14c0e48a40739a9a271c9c57' }, this.label);
+        return index.h("slot", { key: '875ccb9f48c54e7ca199dba81bcd2fe4a61b9ece' }, this.label);
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {
@@ -113,7 +113,7 @@ const OptionGroup = class {
     //
     //--------------------------------------------------------------------------
     render() {
-        return (index.h(index.Fragment, { key: '174fcf908d37aba0972b1f408938a6ce909e45ff' }, index.h("div", { key: '49ac7e0b58d14a8d07322c7c68670d9c5863c291' }, this.label), index.h("slot", { key: '07d24a3a1edf192733bcb3fcdf279f121df482ed' })));
+        return (index.h(index.Fragment, { key: '994df86e56d4f59d00cce614582038faddbbaf54' }, index.h("div", { key: 'a464e5d53bfc873bad48e3f5d311bd228868fade' }, this.label), index.h("slot", { key: 'cee43729b7dec69a328ede9e87b556b2171e765c' })));
     }
     static get watchers() { return {
         "disabled": ["handlePropChange"],
@@ -336,7 +336,7 @@ const Select = class {
     }
     render() {
         const { disabled } = this;
-        return (index.h(index.Host, { key: 'd2e0ad4197079513f4e9e0070fb397c4f8331597' }, index.h(interactive.InteractiveContainer, { key: '5eee0d42742248209469fb7a5e3541cdbe373d30', disabled: disabled }, index.h("div", { key: 'e12c66d415dfe7c24e63731f2a83a081687fba8a', class: CSS.wrapper }, index.h("select", { key: '22685962db75d2527740d288f016665ec5e6053e', "aria-errormessage": IDS.validationMessage, "aria-invalid": dom.toAriaBoolean(this.status === "invalid"), "aria-label": label.getLabelText(this), class: CSS.select, disabled: disabled, onChange: this.handleInternalSelectChange, ref: this.storeSelectRef }, index.h("slot", { key: '1b105206faa1f0765add18140b0f99f3d273c11f' })), this.renderChevron(), index.h(form.HiddenFormInputSlot, { key: '5767128465128a9fb5f69c9241bef0da56b9432e', component: this })), this.validationMessage && this.status === "invalid" ? (index.h(Validation.Validation, { icon: this.validationIcon, id: IDS.validationMessage, message: this.validationMessage, scale: this.scale, status: this.status })) : null)));
+        return (index.h(index.Host, { key: '0f82af5b58cac16b198a9e4c1a85c10fa56efb7b' }, index.h(interactive.InteractiveContainer, { key: 'd5c56f8c91ca45e979ab09cbc74050e7b5bb1416', disabled: disabled }, index.h("div", { key: '52d6f6c3748cd1ab37979d65132f49d4a882410d', class: CSS.wrapper }, index.h("select", { key: 'fee68c65c671e134dab99a4f604fd338cb80eea3', "aria-errormessage": IDS.validationMessage, "aria-invalid": dom.toAriaBoolean(this.status === "invalid"), "aria-label": label.getLabelText(this), class: CSS.select, disabled: disabled, onChange: this.handleInternalSelectChange, ref: this.storeSelectRef }, index.h("slot", { key: '8e5af2fee1a381baa1bd7accbf042aaf767cf4b6' })), this.renderChevron(), index.h(form.HiddenFormInputSlot, { key: 'dfc3652995e4eba38203634730e78d41d9123a06', component: this })), this.validationMessage && this.status === "invalid" ? (index.h(Validation.Validation, { icon: this.validationIcon, id: IDS.validationMessage, message: this.validationMessage, scale: this.scale, status: this.status })) : null)));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/calcite-pagination.cjs.entry.js

@@ -1,24 +1,24 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/dev/LICENSE.md for details.
- * v2.13.0
+ * v2.14.0-next.1
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-03561b9a.js');
-const loadable = require('./loadable-1e343f4a.js');
-const locale = require('./locale-783be19a.js');
-const t9n = require('./t9n-5f0809e3.js');
-const observers = require('./observers-dc37fb24.js');
-const responsive = require('./responsive-29c39256.js');
-const component = require('./component-25eaec79.js');
-require('./browser-b9024aa0.js');
-require('./dom-401c47fa.js');
-require('./guid-7487a6a8.js');
-require('./resources-8d0a3a55.js');
-require('./key-8032a9dc.js');
+const index = require('./index-fa8af6d4.js');
+const loadable = require('./loadable-3b4436ea.js');
+const locale = require('./locale-c8a9eaf0.js');
+const t9n = require('./t9n-386452e2.js');
+const observers = require('./observers-d4deb7de.js');
+const responsive = require('./responsive-f50a34ac.js');
+const component = require('./component-7ca6ac5e.js');
+require('./browser-39ff1e63.js');
+require('./dom-c64d16b4.js');
+require('./guid-fd15b830.js');
+require('./resources-d4d76af1.js');
+require('./key-cae77b35.js');
 
 const CSS = {
     list: "list",
@@ -337,7 +337,7 @@ const Pagination = class {
             }, disabled: disabled, key: "last-button", onClick: this.lastClicked }, index.h("calcite-icon", { flipRtl: true, icon: ICONS.last, scale: component.getIconScale(this.scale) }))) : null;
     }
     render() {
-        return (index.h("ul", { key: 'bdbae7054c4304e91f36809a1131a72551a49679', class: CSS.list }, index.h("li", { key: '14844fcc6ece08896432cfa31c85f84a9de8d992', class: CSS.listItem }, this.renderFirstChevron()), index.h("li", { key: '3146daaad99dd8e05637788ea6bfe0cc89b32ac7', class: CSS.listItem }, this.renderPreviousChevron()), this.renderItems(), index.h("li", { key: '6adbec5c7e7e11aec1937a4d188066f1c999d20c', class: CSS.listItem }, this.renderNextChevron()), index.h("li", { key: '3574dbf73b6cbbc9048c18a93d2990a649040a41', class: CSS.listItem }, this.renderLastChevron())));
+        return (index.h("ul", { key: '7c033bf85c1ee282ed25342fdb19795d33b998c7', class: CSS.list }, index.h("li", { key: 'ca8332ed6f5b9b69fef3dd843e173cd0cd28fcb2', class: CSS.listItem }, this.renderFirstChevron()), index.h("li", { key: '4305a6ded6bb23cf1df55d75bdd20341999b42ee', class: CSS.listItem }, this.renderPreviousChevron()), this.renderItems(), index.h("li", { key: '5e3d401352336a757a7aa03ece137ca0c2526cf6', class: CSS.listItem }, this.renderNextChevron()), index.h("li", { key: '54ada810aff02357dcfdf7debb3a0c46738f5c36', class: CSS.listItem }, this.renderLastChevron())));
     }
     static get delegatesFocus() { return true; }
     static get assetsDirs() { return ["assets"]; }