@esri/solutions-components 0.7.0 → 0.7.2

package/dist/components/segmented-control-item.js

@@ -10,7 +10,7 @@ import { d as defineCustomElement$1 } from './icon.js';
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v1.9.0
+ * v1.11.0
  */
 const SLOTS = {
   input: "input",
@@ -19,7 +19,7 @@ const CSS = {
   segmentedControlItemIcon: "segmented-control-item-icon",
 };
 
-const segmentedControlItemCss = ":host{display:flex;cursor:pointer;align-self:stretch;font-weight:var(--calcite-font-weight-normal);transition:background-color var(--calcite-internal-animation-timing-fast) ease-in-out, border-color var(--calcite-animation-timing) ease-in-out}:host label{pointer-events:none;margin:0.125rem;box-sizing:border-box;display:flex;flex:1 1 0%;align-items:center;color:var(--calcite-ui-text-3);transition:background-color var(--calcite-internal-animation-timing-fast) ease-in-out, border-color var(--calcite-internal-animation-timing-fast) ease-in-out, color var(--calcite-internal-animation-timing-fast) ease-in-out}.label--horizontal{justify-content:center}:host{outline-color:transparent}:host(:focus){outline:2px solid var(--calcite-ui-focus-color, var(--calcite-ui-brand));outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-ui-focus-offset-invert),\n                1\n              )\n            )\n          );outline-offset:-1px}.label--scale-s{padding-inline:0.5rem;font-size:var(--calcite-font-size--2);line-height:1rem;padding-block:0.125rem}.label--scale-m{padding-inline:0.75rem;font-size:var(--calcite-font-size--1);line-height:1rem;padding-block:0.375rem}.label--scale-l{padding-inline:1rem;padding-block:0.625rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}:host(:hover) label{background-color:var(--calcite-ui-foreground-2);color:var(--calcite-ui-text-1)}:host(:active) label{background-color:var(--calcite-ui-foreground-3)}:host([checked]) label{cursor:default;border-color:var(--calcite-ui-brand);background-color:var(--calcite-ui-brand);color:var(--calcite-ui-background)}:host([checked]) .label--outline,:host([checked]) .label--outline-fill{border-color:var(--calcite-ui-brand);background-color:var(--calcite-ui-foreground-1);box-shadow:inset 0 0 0 1px var(--calcite-ui-brand);color:var(--calcite-ui-brand)}:host([checked]) .label--outline{background-color:transparent}::slotted(input){display:none}@media (forced-colors: active){:host([checked]) label{background-color:highlight}:host([checked]) .label--outline,:host([checked]) .label--outline-fill{outline:2px solid transparent;outline-offset:2px}:host([checked]) label:not([class~=label--outline]) .segmented-control-item-icon{color:highlightText}}.segmented-control-item-icon{position:relative;margin:0px;display:inline-flex;line-height:inherit}:host([icon-start]) .label--scale-s .segmented-control-item-icon{margin-inline-end:0.5rem}:host([icon-end]) .label--scale-s .segmented-control-item-icon{margin-inline-start:0.5rem}:host([icon-start]) .label--scale-m .segmented-control-item-icon{margin-inline-end:0.75rem}:host([icon-end]) .label--scale-m .segmented-control-item-icon{margin-inline-start:0.75rem}:host([icon-start]) .label--scale-l .segmented-control-item-icon{margin-inline-end:1rem}:host([icon-end]) .label--scale-l .segmented-control-item-icon{margin-inline-start:1rem}:host([hidden]){display:none}[hidden]{display:none}";
+const segmentedControlItemCss = ":host{display:flex;cursor:pointer;align-self:stretch;font-weight:var(--calcite-font-weight-normal);transition:background-color var(--calcite-internal-animation-timing-fast) ease-in-out, border-color var(--calcite-animation-timing) ease-in-out}:host label{pointer-events:none;margin:0.125rem;box-sizing:border-box;display:flex;flex:1 1 0%;align-items:center;color:var(--calcite-ui-text-3);transition:background-color var(--calcite-internal-animation-timing-fast) ease-in-out, border-color var(--calcite-internal-animation-timing-fast) ease-in-out, color var(--calcite-internal-animation-timing-fast) ease-in-out}.label--horizontal{justify-content:center}:host{outline-color:transparent}:host(:focus){outline:2px solid var(--calcite-ui-focus-color, var(--calcite-ui-brand));outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-ui-focus-offset-invert),\n                1\n              )\n            )\n          );outline-offset:-1px}.label--scale-s{padding-inline:0.5rem;font-size:var(--calcite-font-size--2);line-height:1rem;padding-block:0.125rem}.label--scale-m{padding-inline:0.75rem;font-size:var(--calcite-font-size--1);line-height:1rem;padding-block:0.375rem}.label--scale-l{padding-inline:1rem;padding-block:0.625rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}:host(:hover) label{background-color:var(--calcite-ui-foreground-2);color:var(--calcite-ui-text-1)}:host(:active) label{background-color:var(--calcite-ui-foreground-3)}:host([checked]) label{cursor:default;border-color:var(--calcite-ui-brand);background-color:var(--calcite-ui-brand);color:var(--calcite-ui-text-inverse)}:host([checked]) .label--outline,:host([checked]) .label--outline-fill{border-color:var(--calcite-ui-brand);background-color:var(--calcite-ui-foreground-1);box-shadow:inset 0 0 0 1px var(--calcite-ui-brand);color:var(--calcite-ui-brand)}:host([checked]) .label--outline{background-color:transparent}::slotted(input){display:none}@media (forced-colors: active){:host([checked]) label{background-color:highlight}:host([checked]) .label--outline,:host([checked]) .label--outline-fill{outline:2px solid transparent;outline-offset:2px}:host([checked]) label:not([class~=label--outline]) .segmented-control-item-icon{color:highlightText}}.segmented-control-item-icon{position:relative;margin:0px;display:inline-flex;line-height:inherit}:host([icon-start]) .label--scale-s .segmented-control-item-icon{margin-inline-end:0.5rem}:host([icon-end]) .label--scale-s .segmented-control-item-icon{margin-inline-start:0.5rem}:host([icon-start]) .label--scale-m .segmented-control-item-icon{margin-inline-end:0.75rem}:host([icon-end]) .label--scale-m .segmented-control-item-icon{margin-inline-start:0.75rem}:host([icon-start]) .label--scale-l .segmented-control-item-icon{margin-inline-end:1rem}:host([icon-end]) .label--scale-l .segmented-control-item-icon{margin-inline-start:1rem}:host([hidden]){display:none}[hidden]{display:none}";
 
 const SegmentedControlItem = /*@__PURE__*/ proxyCustomElement(class SegmentedControlItem extends HTMLElement {
   constructor() {

package/dist/components/select.js

@@ -10,12 +10,13 @@ import { c as connectInteractive, d as disconnectInteractive, u as updateHostInt
 import { c as connectLabel, d as disconnectLabel, g as getLabelText } from './label.js';
 import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentFocusable } from './loadable.js';
 import { c as createObserver } from './observers.js';
+import { g as getIconScale } from './component.js';
 import { d as defineCustomElement$1 } from './icon.js';
 
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v1.9.0
+ * v1.11.0
  */
 const CSS = {
   icon: "icon",
@@ -206,7 +207,7 @@ const Select = /*@__PURE__*/ proxyCustomElement(class Select extends HTMLElement
   //
   //--------------------------------------------------------------------------
   renderChevron() {
-    return (h("div", { class: CSS.iconContainer }, h("calcite-icon", { class: CSS.icon, icon: "chevron-down", scale: this.scale === "l" ? "m" : "s" })));
+    return (h("div", { class: CSS.iconContainer }, h("calcite-icon", { class: CSS.icon, icon: "chevron-down", scale: getIconScale(this.scale) })));
   }
   render() {
     return (h(Fragment, null, h("select", { "aria-label": getLabelText(this), class: CSS.select, disabled: this.disabled, onChange: this.handleInternalSelectChange,

package/dist/components/share-item.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface ShareItem extends Components.ShareItem, HTMLElement {}
+export const ShareItem: {
+  prototype: ShareItem;
+  new (): ShareItem;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/share-item.js

@@ -0,0 +1,75 @@
+/*!
+ * Copyright 2022 Esri
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+
+const shareItemCss = ":host{display:block}";
+
+const ShareItem$1 = /*@__PURE__*/ proxyCustomElement(class ShareItem extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+  }
+  //--------------------------------------------------------------------------
+  //
+  //  Properties (public)
+  //
+  //--------------------------------------------------------------------------
+  //--------------------------------------------------------------------------
+  //
+  //  State (internal)
+  //
+  //--------------------------------------------------------------------------
+  //--------------------------------------------------------------------------
+  //
+  //  Properties (protected)
+  //
+  //--------------------------------------------------------------------------
+  //--------------------------------------------------------------------------
+  //
+  //  Watch handlers
+  //
+  //--------------------------------------------------------------------------
+  //--------------------------------------------------------------------------
+  //
+  //  Methods (public)
+  //
+  //--------------------------------------------------------------------------
+  //--------------------------------------------------------------------------
+  //
+  //  Events (public)
+  //
+  //--------------------------------------------------------------------------
+  //--------------------------------------------------------------------------
+  //
+  //  Functions (lifecycle)
+  //
+  //--------------------------------------------------------------------------
+  render() {
+    return (h(Host, null, h("slot", null)));
+  }
+  get el() { return this; }
+  static get style() { return shareItemCss; }
+}, [1, "share-item"]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["share-item"];
+  components.forEach(tagName => { switch (tagName) {
+    case "share-item":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, ShareItem$1);
+      }
+      break;
+  } });
+}
+defineCustomElement$1();
+
+const ShareItem = ShareItem$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { ShareItem, defineCustomElement };

package/dist/components/shared-list-render.js

@@ -13,7 +13,7 @@ import { C as CSS, S as SLOTS$1 } from './resources4.js';
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v1.9.0
+ * v1.11.0
  */
 function mutationObserverCallback() {
   this.setUpItems();
@@ -328,7 +328,7 @@ function getItemData() {
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v1.9.0
+ * v1.11.0
  */
 const List = ({ props: { disabled, loading, filterEnabled, dataForFilter, handleFilterEvent, filterPlaceholder, filterText, setFilterEl, dragEnabled, storeAssistiveEl, }, ...rest }) => {
   const defaultSlot = h("slot", null);

package/dist/components/shell-panel.js

@@ -14,7 +14,7 @@ import { C as CSS_UTILITY } from './resources.js';
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v1.9.0
+ * v1.11.0
  */
 const CSS = {
   container: "container",

package/dist/components/shell.js

@@ -10,7 +10,7 @@ import { j as slotChangeHasAssignedElement, h as slotChangeGetAssignedElements }
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v1.9.0
+ * v1.11.0
  */
 const CSS = {
   main: "main",

package/dist/components/slider.js

@@ -18,7 +18,7 @@ import { d as defineCustomElement$1 } from './graph.js';
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v1.9.0
+ * v1.11.0
  */
 const CSS = {
   handleLabel: "handle__label",

package/dist/components/sortableComponent.js

@@ -3026,7 +3026,7 @@ Sortable.mount(Remove, Revert);
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v1.9.0
+ * v1.11.0
  */
 const sortableComponentSet = new Set();
 const CSS = {

package/dist/components/stack.js

@@ -9,7 +9,7 @@ import { j as slotChangeHasAssignedElement } from './dom.js';
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v1.9.0
+ * v1.11.0
  */
 const CSS = {
   container: "container",
@@ -26,7 +26,7 @@ const SLOTS = {
   actionsEnd: "actions-end",
 };
 
-const stackCss = ":host([disabled]) .content{cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}:host([disabled]) .content *,:host([disabled]) .content ::slotted(*){pointer-events:none}:host{display:flex;flex:1 1 0%;flex-direction:column}.container{display:flex;flex:1 1 auto;align-items:stretch;font-family:var(--calcite-sans-family);font-weight:var(--calcite-font-weight-normal);color:var(--calcite-ui-text-2)}.content{display:flex;flex:1 1 auto;flex-direction:column;justify-content:center;font-size:var(--calcite-font-size--2);line-height:1.375;padding-inline:var(--calcite-stack-padding-inline, 0.75rem);padding-block:var(--calcite-stack-padding-block, 0.5rem)}.content-start{justify-content:flex-start}.content-end{justify-content:flex-end}.content-start,.content-end{flex:0 1 auto}.actions-start,.actions-end,.content-start,.content-end{display:flex;align-items:center}.content-start ::slotted(calcite-icon),.content-end ::slotted(calcite-icon){margin-inline:0.75rem;align-self:center}.actions-start ::slotted(calcite-action),.actions-end ::slotted(calcite-action){align-self:stretch;color:inherit}:host([hidden]){display:none}[hidden]{display:none}";
+const stackCss = ":host([disabled]) .content{cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}:host([disabled]) .content *,:host([disabled]) .content ::slotted(*){pointer-events:none}:host{display:flex;flex:1 1 0%;flex-direction:column}.container{display:flex;flex:1 1 auto;align-items:stretch;font-family:var(--calcite-sans-family);font-weight:var(--calcite-font-weight-normal);color:var(--calcite-ui-text-2)}.content{display:flex;flex:1 1 auto;flex-direction:column;justify-content:center;font-size:var(--calcite-font-size--2);line-height:1.375;padding-inline:var(--calcite-stack-padding-inline, 0.75rem);padding-block:var(--calcite-stack-padding-block, 0.5rem)}.content-start{justify-content:flex-start}.content-end{justify-content:flex-end}.content-start,.content-end{flex:0 1 auto}.actions-start,.actions-end,.content-start,.content-end{display:flex;align-items:center}.content-start ::slotted(calcite-icon),.content-end ::slotted(calcite-icon){margin-inline:0.75rem;align-self:center}.actions-start ::slotted(calcite-action),.actions-start ::slotted(calcite-action-menu),.actions-start ::slotted(calcite-handle),.actions-start ::slotted(calcite-dropdown),.actions-end ::slotted(calcite-action),.actions-end ::slotted(calcite-action-menu),.actions-end ::slotted(calcite-handle),.actions-end ::slotted(calcite-dropdown){align-self:stretch;color:inherit}:host([hidden]){display:none}[hidden]{display:none}";
 
 const Stack = /*@__PURE__*/ proxyCustomElement(class Stack extends HTMLElement {
   constructor() {

package/dist/components/t9n.js

@@ -9,7 +9,7 @@ import { g as getSupportedLocale } from './locale2.js';
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v1.9.0
+ * v1.11.0
  */
 const componentLangToMessageBundleCache = {};
 async function getMessageBundle(lang, component) {

package/dist/components/tab-nav.js

@@ -7,7 +7,16 @@ import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/
 import { w as focusElementInGroup, g as getElementDir, y as filterDirectChildren } from './dom.js';
 import { c as createObserver } from './observers.js';
 
-const tabNavCss = ":host{position:relative;display:flex}:host([scale=s]){min-block-size:1.5rem}:host([scale=m]){min-block-size:2rem}:host([scale=l]){min-block-size:2.75rem}.tab-nav{display:flex;inline-size:100%;justify-content:flex-start;overflow:auto}.tab-nav-active-indicator-container{position:absolute;inset-inline:0px;inset-block-end:0px;block-size:0.125rem;inline-size:100%;overflow:hidden}.tab-nav-active-indicator{position:absolute;inset-block-end:0px;display:block;block-size:0.125rem;background-color:var(--calcite-ui-brand);transition-property:all;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;transition-timing-function:cubic-bezier(0, 0, 0.2, 1)}:host([layout=center]) .tab-nav{justify-content:space-evenly}:host([position=bottom]) .tab-nav-active-indicator{inset-block-end:unset;inset-block-start:0px}:host([position=bottom]) .tab-nav-active-indicator-container{inset-block-end:unset;inset-block-start:0px}:host([bordered]) .tab-nav-active-indicator-container{inset-block-end:unset}:host([bordered][position=bottom]) .tab-nav-active-indicator-container{inset-block-end:0;inset-block-start:unset}@media (forced-colors: active){.tab-nav-active-indicator{background-color:highlight}}:host([hidden]){display:none}[hidden]{display:none}";
+/*!
+ * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v1.11.0
+ */
+const CSS = {
+  container: "tab-nav",
+};
+
+const tabNavCss = ":host{position:relative;display:flex}.scale-s{min-block-size:1.5rem}.scale-m{min-block-size:2rem}.scale-l{min-block-size:2.75rem}:host([layout=center]:not([bordered])){padding-inline:1.25rem}:host([layout=center]:not([bordered])) .tab-nav ::slotted(calcite-tab-title:last-child){margin-inline-end:0px}:host(:not([bordered])) .scale-l ::slotted(calcite-tab-title){margin-inline-end:1.5rem}:host(:not([bordered])) .scale-m ::slotted(calcite-tab-title){margin-inline-end:1.25rem}:host(:not([bordered])) .scale-s ::slotted(calcite-tab-title){margin-inline-end:1rem}.tab-nav{display:flex;inline-size:100%;justify-content:flex-start;overflow:auto}.tab-nav-active-indicator-container{position:absolute;inset-inline:0px;inset-block-end:0px;block-size:0.125rem;inline-size:100%;overflow:hidden}.tab-nav-active-indicator{position:absolute;inset-block-end:0px;display:block;block-size:0.125rem;background-color:var(--calcite-ui-brand);transition-property:all;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;transition-timing-function:cubic-bezier(0, 0, 0.2, 1)}:host([layout=center]) .tab-nav{justify-content:space-evenly}:host .position-bottom .tab-nav-active-indicator{inset-block-end:unset;inset-block-start:0px}:host .position-bottom .tab-nav-active-indicator-container{inset-block-end:unset;inset-block-start:0px}:host([bordered]) .tab-nav-active-indicator-container{inset-block-end:unset}:host([bordered]) .position-bottom .tab-nav-active-indicator-container{inset-block-end:0;inset-block-start:unset}@media (forced-colors: active){.tab-nav-active-indicator{background-color:highlight}}:host([hidden]){display:none}[hidden]{display:none}";
 
 const TabNav = /*@__PURE__*/ proxyCustomElement(class TabNav extends HTMLElement {
   constructor() {
@@ -79,10 +88,6 @@ const TabNav = /*@__PURE__*/ proxyCustomElement(class TabNav extends HTMLElement
     this.parentTabsEl = this.el.closest("calcite-tabs");
     (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.observe(this.el);
   }
-  disconnectedCallback() {
-    var _a;
-    (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
-  }
   componentWillLoad() {
     const storageKey = `calcite-tab-nav-${this.storageId}`;
     if (localStorage && this.storageId && localStorage.getItem(storageKey)) {
@@ -93,8 +98,6 @@ const TabNav = /*@__PURE__*/ proxyCustomElement(class TabNav extends HTMLElement
   componentWillRender() {
     const { parentTabsEl } = this;
     this.layout = parentTabsEl === null || parentTabsEl === void 0 ? void 0 : parentTabsEl.layout;
-    this.position = parentTabsEl === null || parentTabsEl === void 0 ? void 0 : parentTabsEl.position;
-    this.scale = parentTabsEl === null || parentTabsEl === void 0 ? void 0 : parentTabsEl.scale;
     this.bordered = parentTabsEl === null || parentTabsEl === void 0 ? void 0 : parentTabsEl.bordered;
     // fix issue with active tab-title not lining up with blue indicator
     if (this.selectedTitle) {
@@ -113,12 +116,20 @@ const TabNav = /*@__PURE__*/ proxyCustomElement(class TabNav extends HTMLElement
       });
     }
   }
+  disconnectedCallback() {
+    var _a;
+    (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
+  }
   render() {
     const dir = getElementDir(this.el);
     const width = `${this.indicatorWidth}px`;
     const offset = `${this.indicatorOffset}px`;
     const indicatorStyle = dir !== "rtl" ? { width, left: offset } : { width, right: offset };
-    return (h(Host, { role: "tablist" }, h("div", { class: "tab-nav", onScroll: this.handleContainerScroll,
+    return (h(Host, { role: "tablist" }, h("div", { class: {
+        [CSS.container]: true,
+        [`scale-${this.scale}`]: true,
+        [`position-${this.position}`]: true,
+      }, onScroll: this.handleContainerScroll,
       // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
       ref: (el) => (this.tabNavEl = el) }, h("slot", null), h("div", { class: "tab-nav-active-indicator-container",
       // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
@@ -242,9 +253,9 @@ const TabNav = /*@__PURE__*/ proxyCustomElement(class TabNav extends HTMLElement
     "storageId": [513, "storage-id"],
     "syncId": [513, "sync-id"],
     "selectedTitle": [1040],
-    "scale": [1537],
+    "scale": [1],
     "layout": [1537],
-    "position": [1537],
+    "position": [1],
     "bordered": [1540],
     "indicatorOffset": [1026, "indicator-offset"],
     "indicatorWidth": [1026, "indicator-width"],

package/dist/components/tab-title.js

@@ -4,18 +4,19 @@
  * http://www.apache.org/licenses/LICENSE-2.0
  */
 import { proxyCustomElement, HTMLElement, createEvent, Build, h, Host } from '@stencil/core/internal/client';
-import { z as getElementProp, t as toAriaBoolean, g as getElementDir, x as nodeListToArray } from './dom.js';
+import { t as toAriaBoolean, g as getElementDir, x as nodeListToArray } from './dom.js';
 import { g as guid } from './guid.js';
 import { c as connectInteractive, d as disconnectInteractive, u as updateHostInteraction } from './interactive.js';
 import { c as createObserver } from './observers.js';
 import { c as connectLocalized, d as disconnectLocalized } from './locale2.js';
 import { c as connectMessages, d as disconnectMessages, s as setUpMessages, u as updateMessages } from './t9n.js';
+import { g as getIconScale } from './component.js';
 import { d as defineCustomElement$1 } from './icon.js';
 
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v1.9.0
+ * v1.11.0
  */
 const CSS = {
   closeButton: "close-button",
@@ -23,15 +24,15 @@ const CSS = {
   content: "content",
   contentHasText: "content--has-text",
   iconEnd: "icon-end",
-  iconStart: "icon-start",
   iconPresent: "icon-present",
+  iconStart: "icon-start",
   titleIcon: "calcite-tab-title--icon",
 };
 const ICONS = {
   close: "x",
 };
 
-const tabTitleCss = ":host([disabled]){cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:block;flex:0 1 auto;outline:2px solid transparent;outline-offset:2px;margin-inline-start:0px;margin-inline-end:1.25rem}:host([layout=center][scale=s]),:host([layout=center][scale=m]),:host([layout=center][scale=l]){margin-block:0px;text-align:center;margin-inline-end:0px;flex-basis:12rem}:host([layout=center][scale=s]) .content,:host([layout=center][scale=m]) .content,:host([layout=center][scale=l]) .content{margin:auto}:host([layout=center][closable]) .content{padding-inline-start:32px}:host([layout=center][bordered][closable][scale=s]) .content{padding-inline-start:36px}:host([layout=center][bordered][closable][scale=m]) .content{padding-inline-start:40px}:host([layout=center][closable][scale=l]) .content{padding-inline-start:40px}:host([layout=center][closable][bordered][scale=l]) .content{padding-inline-start:52px}:host([position=bottom]) .container{border-block-end-width:0px;border-block-start-width:2px;border-block-start-color:transparent;border-block-start-style:solid}:host([closed]){display:none}.container{outline-color:transparent}:host(:focus) .container{outline:2px solid var(--calcite-ui-focus-color, var(--calcite-ui-brand));outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-ui-focus-offset-invert),\n                1\n              )\n            )\n          )}:host(:focus) .container:focus-within{outline-color:transparent}:host(:active) a,:host(:focus) a,:host(:hover) a{border-color:var(--calcite-ui-border-2);color:var(--calcite-ui-text-1);-webkit-text-decoration-line:none;text-decoration-line:none}:host([selected]) .container{border-color:transparent;color:var(--calcite-ui-text-1)}:host([disabled]) .container{pointer-events:none;opacity:0.5}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}:host([scale=s]){margin-inline-end:1rem}:host([scale=s]) .content{padding-block:0.25rem;font-size:var(--calcite-font-size--2);line-height:1rem}:host([scale=m]) .content{padding-block:0.5rem;font-size:var(--calcite-font-size--1);line-height:1rem}:host([scale=l]){margin-inline-end:1.5rem}:host([scale=l]) .content{padding-block:0.625rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}.container{box-sizing:border-box;display:flex;block-size:100%;inline-size:100%;cursor:pointer;align-content:center;justify-content:space-between;border-block-end-width:2px;padding-inline:0px;font-size:var(--calcite-font-size--1);line-height:1rem;color:var(--calcite-ui-text-3);transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;border-block-end-color:transparent;border-block-end-style:solid}.content{display:flex;align-items:center;justify-content:center}.calcite-tab-title--icon{position:relative;margin:0px;display:inline-flex;align-self:center}.calcite-tab-title--icon svg{transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}.content--has-text{padding:0.25rem}.content--has-text .calcite-tab-title--icon.icon-start{margin-inline-end:0.5rem}.content--has-text .calcite-tab-title--icon.icon-end{margin-inline-start:0.5rem}.close-button{display:flex;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;align-content:center;align-items:center;justify-content:center;align-self:center;border-style:none;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-3);outline-color:transparent;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;block-size:calc(100% - 2px);background-color:var(--calcite-button-transparent-1);margin-inline-start:auto}.close-button:focus{outline:2px solid var(--calcite-ui-focus-color, var(--calcite-ui-brand));outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-ui-focus-offset-invert),\n                1\n              )\n            )\n          );outline-offset:-1px}.close-button:focus,.close-button:hover{color:var(--calcite-ui-text-1);background-color:var(--calcite-ui-foreground-2)}.close-button:active{color:var(--calcite-ui-text-1);background-color:var(--calcite-ui-foreground-3)}.close-button calcite-icon{color:inherit}:host([icon-start][icon-end]) .calcite-tab-title--icon:first-child{margin-inline-end:0.5rem}:host([bordered]){margin-inline-end:0}:host([bordered][selected]){box-shadow:inset 0px -2px var(--calcite-ui-foreground-1)}:host([bordered][selected][position=bottom]){box-shadow:inset 0 2px 0 var(--calcite-ui-foreground-1)}:host([bordered]:hover) .container,:host([bordered]:focus) .container,:host([bordered]:active) .container{position:relative}:host([bordered]:hover) .container{background-color:var(--calcite-button-transparent-hover)}:host([closable]) .container,:host([bordered]) .container{border-inline-start:1px solid transparent;border-inline-end:1px solid transparent}:host([closable]) .container .close-button,:host([bordered]) .container .close-button{margin-inline:0}:host([closable]) .content{box-sizing:border-box;block-size:100%;border-block-end-color:transparent}:host([closable][position=bottom]) .container,:host([bordered][position=bottom]) .container{border-block-start-style:unset}:host([selected][bordered]) .container{border-inline-start-color:var(--calcite-ui-border-1);border-inline-end-color:var(--calcite-ui-border-1)}:host([bordered]) .content{padding-inline:0.75rem}:host([bordered][scale=s]) .content{padding-inline:0.5rem}:host([bordered][scale=l]) .content{padding-inline:1rem}@media (forced-colors: active){:host{outline-width:0;outline-offset:0}:host(:focus) .container{outline-color:highlight}:host([bordered]) .container{border-block-end-style:solid}:host([bordered][position=bottom]) .container{border-block-start-style:solid}:host([bordered][selected]) .container{border-block-end-style:none}:host([bordered][position=bottom][selected]) .container{border-block-start-style:none}.close-button{z-index:var(--calcite-app-z-index)}}:host([hidden]){display:none}[hidden]{display:none}";
+const tabTitleCss = ":host([disabled]){cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none;opacity:var(--calcite-ui-opacity-disabled)}:host([disabled]) *,:host([disabled]) ::slotted(*){pointer-events:none}:host{display:block;outline:2px solid transparent;outline-offset:2px;margin-inline-start:0px}:host([layout=inline]){flex:0 1 auto}:host([layout=center]){flex:1 1 auto}:host([layout=center]) .scale-s,:host([layout=center]) .scale-m,:host([layout=center]) .scale-l{margin-block:0px;text-align:center;flex-basis:12rem}:host([layout=center]) .scale-s .content,:host([layout=center]) .scale-m .content,:host([layout=center]) .scale-l .content{margin:auto}:host([layout=center][closable]) .content{padding-inline-start:32px}:host([layout=center][bordered][closable]) .scale-s .content{padding-inline-start:36px}:host([layout=center][bordered][closable]) .scale-m .content{padding-inline-start:40px}:host([layout=center][closable]) .scale-l .content{padding-inline-start:40px}:host([layout=center][closable][bordered]) .scale-s .content{padding-inline-start:52px}:host([position=bottom]) .container{border-block-end-width:0px;border-block-start-width:2px;border-block-start-color:transparent;border-block-start-style:solid}:host([closed]){display:none}.container{outline-color:transparent}:host(:focus) .container{outline:2px solid var(--calcite-ui-focus-color, var(--calcite-ui-brand));outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-ui-focus-offset-invert),\n                1\n              )\n            )\n          )}:host(:focus) .container:focus-within{outline-color:transparent}:host(:active) a,:host(:focus) a,:host(:hover) a{border-color:var(--calcite-ui-border-2);color:var(--calcite-ui-text-1);-webkit-text-decoration-line:none;text-decoration-line:none}:host([selected]) .container{border-color:transparent;color:var(--calcite-ui-text-1)}:host([disabled]) .container{pointer-events:none;opacity:0.5}:host([disabled]) ::slotted([calcite-hydrated][disabled]),:host([disabled]) [calcite-hydrated][disabled]{opacity:1}.scale-s .content{padding-block:0.25rem;font-size:var(--calcite-font-size--2);line-height:1rem}.scale-m .content{padding-block:0.5rem;font-size:var(--calcite-font-size--1);line-height:1rem}.scale-l .content{padding-block:0.625rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}.container{box-sizing:border-box;display:flex;block-size:100%;inline-size:100%;cursor:pointer;align-content:center;justify-content:space-between;border-block-end-width:2px;padding-inline:0px;font-size:var(--calcite-font-size--1);line-height:1rem;color:var(--calcite-ui-text-3);transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;border-block-end-color:transparent;border-block-end-style:solid}.content{display:flex;align-items:center;justify-content:center}.calcite-tab-title--icon{position:relative;margin:0px;display:inline-flex;align-self:center}.calcite-tab-title--icon svg{transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s}.content--has-text{padding:0.25rem}.content--has-text .calcite-tab-title--icon.icon-start{margin-inline-end:0.5rem}.content--has-text .calcite-tab-title--icon.icon-end{margin-inline-start:0.5rem}.close-button{display:flex;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;align-content:center;align-items:center;justify-content:center;align-self:center;border-style:none;background-color:var(--calcite-ui-foreground-1);color:var(--calcite-ui-text-3);outline-color:transparent;transition:all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;block-size:calc(100% - 2px);background-color:var(--calcite-button-transparent-1);margin-inline-start:auto}.close-button:focus{outline:2px solid var(--calcite-ui-focus-color, var(--calcite-ui-brand));outline-offset:calc(\n            -2px *\n            calc(\n              1 -\n              2 * clamp(\n                0,\n                var(--calcite-ui-focus-offset-invert),\n                1\n              )\n            )\n          );outline-offset:-1px}.close-button:focus,.close-button:hover{color:var(--calcite-ui-text-1);background-color:var(--calcite-ui-foreground-2)}.close-button:active{color:var(--calcite-ui-text-1);background-color:var(--calcite-ui-foreground-3)}.close-button calcite-icon{color:inherit}:host([icon-start][icon-end]) .calcite-tab-title--icon:first-child{margin-inline-end:0.5rem}:host([bordered]){margin-inline-end:0}:host([bordered][selected]){box-shadow:inset 0px -2px var(--calcite-ui-foreground-1)}:host([bordered][selected][position=bottom]){box-shadow:inset 0 2px 0 var(--calcite-ui-foreground-1)}:host([bordered]:hover) .container,:host([bordered]:focus) .container,:host([bordered]:active) .container{position:relative}:host([bordered]:hover) .container{background-color:var(--calcite-button-transparent-hover)}:host([closable]) .container,:host([bordered]) .container{border-inline-start:1px solid transparent;border-inline-end:1px solid transparent}:host([closable]) .container .close-button,:host([bordered]) .container .close-button{margin-inline:0}:host([closable]) .content{box-sizing:border-box;block-size:100%;border-block-end-color:transparent}:host([closable][position=bottom]) .container,:host([bordered][position=bottom]) .container{border-block-start-style:unset}:host([selected][bordered]) .container{border-inline-start-color:var(--calcite-ui-border-1);border-inline-end-color:var(--calcite-ui-border-1)}:host([bordered]) .content{padding-inline:0.75rem}:host([bordered]) .scale-s .content{padding-inline:0.5rem}:host([bordered]) .scale-l .content{padding-inline:1rem}@media (forced-colors: active){:host{outline-width:0;outline-offset:0}:host(:focus) .container{outline-color:highlight}:host([bordered]) .container{border-block-end-style:solid}:host([bordered][position=bottom]) .container{border-block-start-style:solid}:host([bordered][selected]) .container{border-block-end-style:none}:host([bordered][position=bottom][selected]) .container{border-block-start-style:none}.close-button{z-index:var(--calcite-app-z-index)}}:host([hidden]){display:none}[hidden]{display:none}";
 
 const TabTitle = /*@__PURE__*/ proxyCustomElement(class TabTitle extends HTMLElement {
   constructor() {
@@ -70,8 +71,8 @@ const TabTitle = /*@__PURE__*/ proxyCustomElement(class TabTitle extends HTMLEle
     this.iconFlipRtl = undefined;
     this.iconStart = undefined;
     this.layout = undefined;
-    this.position = undefined;
-    this.scale = undefined;
+    this.position = "top";
+    this.scale = "m";
     this.bordered = false;
     this.tab = undefined;
     this.messages = undefined;
@@ -126,24 +127,18 @@ const TabTitle = /*@__PURE__*/ proxyCustomElement(class TabTitle extends HTMLEle
   componentWillRender() {
     if (this.parentTabsEl) {
       this.layout = this.parentTabsEl.layout;
-      this.position = this.parentTabsEl.position;
-      this.scale = this.parentTabsEl.scale;
       this.bordered = this.parentTabsEl.bordered;
     }
-    // handle case when tab-nav is only parent
-    if (!this.parentTabsEl && this.parentTabNavEl) {
-      this.position = getElementProp(this.parentTabNavEl, "position", this.position);
-      this.scale = getElementProp(this.parentTabNavEl, "scale", this.scale);
-    }
   }
   render() {
     const { el, closed } = this;
     const id = el.id || this.guid;
-    const iconStartEl = (h("calcite-icon", { class: { [CSS.titleIcon]: true, [CSS.iconStart]: true }, flipRtl: this.iconFlipRtl === "start" || this.iconFlipRtl === "both", icon: this.iconStart, scale: this.scale === "l" ? "m" : "s" }));
-    const iconEndEl = (h("calcite-icon", { class: { [CSS.titleIcon]: true, [CSS.iconEnd]: true }, flipRtl: this.iconFlipRtl === "end" || this.iconFlipRtl === "both", icon: this.iconEnd, scale: this.scale === "l" ? "m" : "s" }));
+    const iconStartEl = (h("calcite-icon", { class: { [CSS.titleIcon]: true, [CSS.iconStart]: true }, flipRtl: this.iconFlipRtl === "start" || this.iconFlipRtl === "both", icon: this.iconStart, scale: getIconScale(this.scale) }));
+    const iconEndEl = (h("calcite-icon", { class: { [CSS.titleIcon]: true, [CSS.iconEnd]: true }, flipRtl: this.iconFlipRtl === "end" || this.iconFlipRtl === "both", icon: this.iconEnd, scale: getIconScale(this.scale) }));
     return (h(Host, { "aria-controls": this.controls, "aria-selected": toAriaBoolean(this.selected), id: id, role: "tab", tabIndex: this.selected ? 0 : -1 }, h("div", { class: {
         container: true,
         [CSS.iconPresent]: !!this.iconStart || !!this.iconEnd,
+        [`scale-${this.scale}`]: true,
       }, hidden: closed,
       // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
       ref: (el) => { var _a; return (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.observe(el); } }, h("div", { class: { [CSS.content]: true, [CSS.contentHasText]: this.hasText } }, this.iconStart ? iconStartEl : null, h("slot", null), this.iconEnd ? iconEndEl : null), this.renderCloseButton())));
@@ -152,7 +147,7 @@ const TabTitle = /*@__PURE__*/ proxyCustomElement(class TabTitle extends HTMLEle
     const { closable, messages } = this;
     return closable ? (h("button", { "aria-label": messages.close, class: CSS.closeButton, disabled: false, key: CSS.closeButton, onClick: this.closeClickHandler, title: messages.close, type: "button",
       // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
-      ref: (el) => (this.closeButtonEl = el) }, h("calcite-icon", { icon: ICONS.close, scale: this.scale === "l" ? "m" : "s" }))) : null;
+      ref: (el) => (this.closeButtonEl = el) }, h("calcite-icon", { icon: ICONS.close, scale: getIconScale(this.scale) }))) : null;
   }
   async componentDidLoad() {
     this.calciteInternalTabTitleRegister.emit(await this.getTabIdentifier());
@@ -295,8 +290,8 @@ const TabTitle = /*@__PURE__*/ proxyCustomElement(class TabTitle extends HTMLEle
     "iconFlipRtl": [513, "icon-flip-rtl"],
     "iconStart": [513, "icon-start"],
     "layout": [1537],
-    "position": [1537],
-    "scale": [1537],
+    "position": [1],
+    "scale": [1],
     "bordered": [1540],
     "tab": [513],
     "messages": [1040],

package/dist/components/tab.js

@@ -7,7 +7,17 @@ import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/
 import { x as nodeListToArray } from './dom.js';
 import { g as guid } from './guid.js';
 
-const tabCss = ":host([selected]) section,:host([selected]) .container{display:block}:host{display:none;block-size:100%;inline-size:100%}:host([selected]){display:block;block-size:100%;inline-size:100%;overflow:auto}section,.container{display:none;block-size:100%;inline-size:100%}:host([scale=s]){padding-block:0.25rem;font-size:var(--calcite-font-size--2);line-height:1rem}:host([scale=m]){padding-block:0.5rem;font-size:var(--calcite-font-size--1);line-height:1rem}:host([scale=l]){font-size:var(--calcite-font-size-0);line-height:1.25rem;padding-block:13px}:host([hidden]){display:none}[hidden]{display:none}";
+/*!
+ * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
+ * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
+ * v1.11.0
+ */
+const CSS = {
+  container: "container",
+  content: "content",
+};
+
+const tabCss = ":host([selected]) section,:host([selected]) .container{display:block}:host{display:none;block-size:100%;inline-size:100%}:host([selected]){display:block;block-size:100%;inline-size:100%;overflow:auto}.scale-s .content{padding-block:0.25rem;font-size:var(--calcite-font-size--2);line-height:1rem}.scale-m .content{padding-block:0.5rem;font-size:var(--calcite-font-size--1);line-height:1rem}.scale-l .content{padding-block:0.625rem;font-size:var(--calcite-font-size-0);line-height:1.25rem}section,.container{display:none;block-size:100%;inline-size:100%}:host([hidden]){display:none}[hidden]{display:none}";
 
 const Tab = /*@__PURE__*/ proxyCustomElement(class Tab extends HTMLElement {
   constructor() {
@@ -28,7 +38,7 @@ const Tab = /*@__PURE__*/ proxyCustomElement(class Tab extends HTMLElement {
   //--------------------------------------------------------------------------
   render() {
     const id = this.el.id || this.guid;
-    return (h(Host, { "aria-labelledby": this.labeledBy, id: id }, h("div", { class: "container", role: "tabpanel", tabIndex: this.selected ? 0 : -1 }, h("section", null, h("slot", null)))));
+    return (h(Host, { "aria-labelledby": this.labeledBy, id: id }, h("div", { class: { [CSS.container]: true, [`scale-${this.scale}`]: true }, role: "tabpanel", tabIndex: this.selected ? 0 : -1 }, h("section", { class: CSS.content }, h("slot", null)))));
   }
   connectedCallback() {
     this.parentTabsEl = this.el.closest("calcite-tabs");
@@ -36,10 +46,6 @@ const Tab = /*@__PURE__*/ proxyCustomElement(class Tab extends HTMLElement {
   componentDidLoad() {
     this.calciteInternalTabRegister.emit();
   }
-  componentWillRender() {
-    var _a;
-    this.scale = (_a = this.parentTabsEl) === null || _a === void 0 ? void 0 : _a.scale;
-  }
   disconnectedCallback() {
     var _a;
     // Dispatching to body in order to be listened by other elements that are still connected to the DOM.
@@ -101,7 +107,7 @@ const Tab = /*@__PURE__*/ proxyCustomElement(class Tab extends HTMLElement {
 }, [1, "calcite-tab", {
     "tab": [513],
     "selected": [1540],
-    "scale": [1537],
+    "scale": [1],
     "labeledBy": [32],
     "getTabIndex": [64],
     "updateAriaInfo": [64]

package/dist/components/table-cell.js

@@ -14,7 +14,7 @@ import { C as CSS_UTILITY } from './resources.js';
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v1.9.0
+ * v1.11.0
  */
 const CSS = {
   numberCell: "number-cell",

package/dist/components/table-header.js

@@ -7,12 +7,13 @@ import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal
 import { s as setUpLoadableComponent, a as setComponentLoaded, c as componentFocusable } from './loadable.js';
 import { s as setUpMessages, c as connectMessages, d as disconnectMessages, u as updateMessages } from './t9n.js';
 import { c as connectLocalized, d as disconnectLocalized } from './locale2.js';
+import { g as getIconScale } from './component.js';
 import { d as defineCustomElement$1 } from './icon.js';
 
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v1.9.0
+ * v1.11.0
  */
 const CSS = {
   numberCell: "number-cell",
@@ -140,7 +141,7 @@ const TableHeader = /*@__PURE__*/ proxyCustomElement(class TableHeader extends H
         [CSS.multipleSelectionCell]: this.selectionMode === "multiple",
       }, colSpan: this.colSpan, role: "columnheader", rowSpan: this.rowSpan, scope: scope, tabIndex: 0,
       // eslint-disable-next-line react/jsx-sort-props -- ref should be last so node attrs/props are in sync (see https://github.com/Esri/calcite-design-system/pull/6530)
-      ref: (el) => (this.containerEl = el) }, this.heading && h("div", { class: CSS.heading }, this.heading), this.description && h("div", { class: CSS.description }, this.description), this.selectionCell && this.selectionMode === "multiple" && (h("calcite-icon", { class: { [CSS.active]: allSelected }, icon: selectionIcon, scale: this.scale === "l" ? "m" : "s" })), (this.selectionCell || this.numberCell) && (h("span", { "aria-hidden": true, "aria-live": "polite", class: CSS.assistiveText }, this.screenReaderText)))));
+      ref: (el) => (this.containerEl = el) }, this.heading && h("div", { class: CSS.heading }, this.heading), this.description && h("div", { class: CSS.description }, this.description), this.selectionCell && this.selectionMode === "multiple" && (h("calcite-icon", { class: { [CSS.active]: allSelected }, icon: selectionIcon, scale: getIconScale(this.scale) })), (this.selectionCell || this.numberCell) && (h("span", { "aria-hidden": true, "aria-live": "polite", class: CSS.assistiveText }, this.screenReaderText)))));
   }
   static get assetsDirs() { return ["assets"]; }
   get el() { return this; }

package/dist/components/tabs.js

@@ -4,11 +4,12 @@
  * http://www.apache.org/licenses/LICENSE-2.0
  */
 import { proxyCustomElement, HTMLElement, h, Fragment } from '@stencil/core/internal/client';
+import { c as createObserver } from './observers.js';
 
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v1.9.0
+ * v1.11.0
  */
 const SLOTS = {
   titleGroup: "title-group",
@@ -21,6 +22,16 @@ const Tabs = /*@__PURE__*/ proxyCustomElement(class Tabs extends HTMLElement {
     super();
     this.__registerHost();
     this.__attachShadow();
+    this.mutationObserver = createObserver("mutation", (mutationsList) => {
+      for (const mutation of mutationsList) {
+        const target = mutation.target;
+        if (target.nodeName === "CALCITE-TAB-NAV" ||
+          target.nodeName === "CALCITE-TAB-TITLE" ||
+          target.nodeName === "CALCITE-TAB") {
+          this.updateItems();
+        }
+      }
+    });
     this.layout = "inline";
     this.position = "top";
     this.scale = "m";
@@ -28,11 +39,25 @@ const Tabs = /*@__PURE__*/ proxyCustomElement(class Tabs extends HTMLElement {
     this.titles = [];
     this.tabs = [];
   }
+  handleInheritableProps() {
+    this.updateItems();
+  }
   //--------------------------------------------------------------------------
   //
   //  Lifecycle
   //
   //--------------------------------------------------------------------------
+  connectedCallback() {
+    this.mutationObserver.observe(this.el, { childList: true });
+    this.updateItems();
+  }
+  async componentWillLoad() {
+    this.updateItems();
+  }
+  disconnectedCallback() {
+    var _a;
+    (_a = this.mutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
+  }
   render() {
     return (h(Fragment, null, h("slot", { name: SLOTS.titleGroup }), h("section", null, h("slot", null))));
   }
@@ -77,6 +102,23 @@ const Tabs = /*@__PURE__*/ proxyCustomElement(class Tabs extends HTMLElement {
     this.registryHandler();
     event.stopPropagation();
   }
+  updateItems() {
+    const { position, scale } = this;
+    const nav = this.el.querySelector("calcite-tab-nav");
+    if (nav) {
+      nav.position = position;
+      nav.scale = scale;
+    }
+    Array.from(this.el.querySelectorAll("calcite-tab")).forEach((tab) => {
+      if (tab.parentElement === this.el) {
+        tab.scale = scale;
+      }
+    });
+    Array.from(this.el.querySelectorAll("calcite-tab-nav > calcite-tab-title")).forEach((title) => {
+      title.position = position;
+      title.scale = scale;
+    });
+  }
   //--------------------------------------------------------------------------
   //
   //  Private Methods
@@ -124,6 +166,10 @@ const Tabs = /*@__PURE__*/ proxyCustomElement(class Tabs extends HTMLElement {
     this.titles.forEach((el) => el.updateAriaInfo(tabIds, titleIds));
   }
   get el() { return this; }
+  static get watchers() { return {
+    "position": ["handleInheritableProps"],
+    "scale": ["handleInheritableProps"]
+  }; }
   static get style() { return tabsCss; }
 }, [1, "calcite-tabs", {
     "layout": [513],
@@ -132,7 +178,10 @@ const Tabs = /*@__PURE__*/ proxyCustomElement(class Tabs extends HTMLElement {
     "bordered": [4],
     "titles": [32],
     "tabs": [32]
-  }, [[0, "calciteInternalTabTitleRegister", "calciteInternalTabTitleRegister"], [16, "calciteTabTitleUnregister", "calciteTabTitleUnregister"], [0, "calciteInternalTabRegister", "calciteInternalTabRegister"], [16, "calciteTabUnregister", "calciteTabUnregister"]]]);
+  }, [[0, "calciteInternalTabTitleRegister", "calciteInternalTabTitleRegister"], [16, "calciteTabTitleUnregister", "calciteTabTitleUnregister"], [0, "calciteInternalTabRegister", "calciteInternalTabRegister"], [16, "calciteTabUnregister", "calciteTabUnregister"]], {
+    "position": ["handleInheritableProps"],
+    "scale": ["handleInheritableProps"]
+  }]);
 function defineCustomElement() {
   if (typeof customElements === "undefined") {
     return;

package/dist/components/tile.js

@@ -13,7 +13,7 @@ import { d as defineCustomElement$1 } from './link.js';
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-design-system/blob/main/LICENSE.md for details.
- * v1.9.0
+ * v1.11.0
  */
 const SLOTS = {
   contentStart: "content-start",