@esri/calcite-components 1.0.0-beta.86 → 1.0.0-beta.87

package/dist/collection/components/tab-title/tab-title.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-beta.86
+ * v1.0.0-beta.87
  */
 import { Build, Component, Element, Event, h, Host, Listen, Method, Prop, State, Watch } from "@stencil/core";
 import { guid } from "../../utils/guid";
@@ -125,12 +125,12 @@ export class TabTitle {
   onClick() {
     this.emitActiveTab();
   }
-  keyDownHandler(e) {
-    switch (e.key) {
+  keyDownHandler(event) {
+    switch (event.key) {
       case " ":
       case "Enter":
         this.emitActiveTab();
-        e.preventDefault();
+        event.preventDefault();
         break;
       case "ArrowRight":
         if (getElementDir(this.el) === "ltr") {
@@ -474,8 +474,8 @@ export class TabTitle {
         "text": ""
       },
       "complexType": {
-        "original": "any",
-        "resolved": "any",
+        "original": "void",
+        "resolved": "void",
         "references": {}
       }
     }, {
@@ -492,8 +492,8 @@ export class TabTitle {
         "text": ""
       },
       "complexType": {
-        "original": "any",
-        "resolved": "any",
+        "original": "void",
+        "resolved": "void",
         "references": {}
       }
     }, {

package/dist/collection/components/tabs/interfaces.js

@@ -1,6 +1,6 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-beta.86
+ * v1.0.0-beta.87
  */
 export {};

package/dist/collection/components/tabs/resources.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-beta.86
+ * v1.0.0-beta.87
  */
 export const SLOTS = {
   tabNav: "tab-nav"

package/dist/collection/components/tabs/tabs.css

@@ -71,7 +71,7 @@
 * Currently only used in Checkbox.
 */
 :root {
-  --calcite-popper-transition: var(--calcite-animation-timing);
+  --calcite-floating-ui-transition: var(--calcite-animation-timing);
 }
 
 :host([hidden]) {
@@ -89,15 +89,15 @@
 }
 
 :host([bordered]:not([position=below])) ::slotted(calcite-tab-nav) {
-  margin-bottom: -1px;
+  margin-block-end: -1px;
 }
 
 :host([bordered]:not([position=bottom])) ::slotted(calcite-tab-nav) {
-  margin-bottom: -1px;
+  margin-block-end: -1px;
 }
 
 :host([bordered][position=below]) ::slotted(calcite-tab-nav) {
-  margin-top: -1px;
+  margin-block-start: -1px;
 }
 
 :host([bordered][position=below]) {
@@ -138,46 +138,46 @@ section {
   display: flex;
   flex-grow: 1;
   overflow: hidden;
-  border-top-width: 1px;
-  border-top-color: var(--calcite-ui-border-1);
-  border-top-style: solid;
+  border-block-start-width: 1px;
+  border-block-start-color: var(--calcite-ui-border-1);
+  border-block-start-style: solid;
 }
 
 :host([position=below]) section {
   flex-direction: column-reverse;
-  border-top-width: 0px;
-  border-bottom-width: 1px;
-  border-bottom-color: var(--calcite-ui-border-1);
+  border-block-start-width: 0px;
+  border-block-end-width: 1px;
+  border-block-end-color: var(--calcite-ui-border-1);
 }
 
 :host([position=bottom]) section {
   flex-direction: column-reverse;
-  border-top-width: 0px;
-  border-bottom-width: 1px;
-  border-bottom-color: var(--calcite-ui-border-1);
+  border-block-start-width: 0px;
+  border-block-end-width: 1px;
+  border-block-end-color: var(--calcite-ui-border-1);
 }
 
 :host([position=below]:not([bordered])) section {
-  border-bottom-style: solid;
+  border-block-end-style: solid;
 }
 
 :host([position=bottom]:not([bordered])) section {
-  border-bottom-style: solid;
+  border-block-end-style: solid;
 }
 
 @media (forced-colors: active) {
   :host([bordered]) section {
-    border-top-width: 0px;
-    border-bottom-width: 1px;
+    border-block-start-width: 0px;
+    border-block-end-width: 1px;
   }
 
   :host([position=below][bordered]) section {
-    border-top-width: 1px;
-    border-bottom-width: 0px;
+    border-block-start-width: 1px;
+    border-block-end-width: 0px;
   }
 
   :host([position=bottom][bordered]) section {
-    border-top-width: 1px;
-    border-bottom-width: 0px;
+    border-block-start-width: 1px;
+    border-block-end-width: 0px;
   }
 }

package/dist/collection/components/tabs/tabs.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-beta.86
+ * v1.0.0-beta.87
  */
 import { Component, Prop, h, Element, Listen, State, Fragment } from "@stencil/core";
 import { SLOTS } from "./resources";
@@ -77,40 +77,40 @@ export class Tabs {
   //
   //--------------------------------------------------------------------------
   /**
-   * @param e
+   * @param event
    * @internal
    */
-  calciteInternalTabTitleRegister(e) {
-    this.titles = [...this.titles, e.target];
+  calciteInternalTabTitleRegister(event) {
+    this.titles = [...this.titles, event.target];
     this.registryHandler();
-    e.stopPropagation();
+    event.stopPropagation();
   }
   /**
-   * @param e
+   * @param event
    * @internal
    */
-  calciteTabTitleUnregister(e) {
-    this.titles = this.titles.filter((el) => el !== e.detail);
+  calciteTabTitleUnregister(event) {
+    this.titles = this.titles.filter((el) => el !== event.detail);
     this.registryHandler();
-    e.stopPropagation();
+    event.stopPropagation();
   }
   /**
-   * @param e
+   * @param event
    * @internal
    */
-  calciteInternalTabRegister(e) {
-    this.tabs = [...this.tabs, e.target];
+  calciteInternalTabRegister(event) {
+    this.tabs = [...this.tabs, event.target];
     this.registryHandler();
-    e.stopPropagation();
+    event.stopPropagation();
   }
   /**
-   * @param e
+   * @param event
    * @internal
    */
-  calciteTabUnregister(e) {
-    this.tabs = this.tabs.filter((el) => el !== e.detail);
+  calciteTabUnregister(event) {
+    this.tabs = this.tabs.filter((el) => el !== event.detail);
     this.registryHandler();
-    e.stopPropagation();
+    event.stopPropagation();
   }
   //--------------------------------------------------------------------------
   //
@@ -127,11 +127,11 @@ export class Tabs {
     let tabIds;
     let titleIds;
     // determine if we are using `tab` based or `index` based tab identifiers.
-    if (this.tabs.some((e) => e.tab) || this.titles.some((e) => e.tab)) {
+    if (this.tabs.some((el) => el.tab) || this.titles.some((el) => el.tab)) {
       // if we are using `tab` based identifiers sort by `tab` to account for
       // possible out of order tabs and get the id of each tab
-      tabIds = this.tabs.sort((a, b) => a.tab.localeCompare(b.tab)).map((e) => e.id);
-      titleIds = this.titles.sort((a, b) => a.tab.localeCompare(b.tab)).map((e) => e.id);
+      tabIds = this.tabs.sort((a, b) => a.tab.localeCompare(b.tab)).map((el) => el.id);
+      titleIds = this.titles.sort((a, b) => a.tab.localeCompare(b.tab)).map((el) => el.id);
     }
     else {
       // if we are using index based tabs then the `<calcite-tab>` and

package/dist/collection/components/tile/resources.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-beta.86
+ * v1.0.0-beta.87
  */
 export const SLOTS = {
   contentStart: "content-start",

package/dist/collection/components/tile/tile.css

@@ -71,13 +71,21 @@
 * Currently only used in Checkbox.
 */
 :root {
-  --calcite-popper-transition: var(--calcite-animation-timing);
+  --calcite-floating-ui-transition: var(--calcite-animation-timing);
 }
 
 :host([hidden]) {
   display: none;
 }
 
+:host([disabled]) {
+  pointer-events: none;
+  cursor: default;
+  -webkit-user-select: none;
+          user-select: none;
+  opacity: var(--calcite-ui-opacity-disabled);
+}
+
 :host {
   box-sizing: border-box;
   display: inline-block;
@@ -100,11 +108,11 @@
   flex-direction: column;
   justify-content: center;
   gap: 0.5rem;
-  width: 10%;
+  inline-size: 10%;
 }
 :host .content-container {
   display: flex;
-  width: 100%;
+  inline-size: 100%;
   flex: 1 1 auto;
   align-items: stretch;
   padding: 0px;
@@ -135,7 +143,7 @@
 :host .large-visual {
   align-items: center;
   text-align: center;
-  min-height: 12rem;
+  min-block-size: 12rem;
 }
 :host .large-visual .icon {
   display: flex;
@@ -181,13 +189,6 @@
   text-align: center;
 }
 
-:host([disabled]) {
-  pointer-events: none;
-  cursor: default;
-  -webkit-user-select: none;
-          user-select: none;
-  opacity: var(--calcite-ui-opacity-disabled);
-}
 :host([disabled]) ::slotted([calcite-hydrated][disabled]),
 :host([disabled]) [calcite-hydrated][disabled] {
   /* prevent opacity stacking */

package/dist/collection/components/tile/tile.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-beta.86
+ * v1.0.0-beta.87
  */
 import { Component, Element, Fragment, h, Prop } from "@stencil/core";
 import { SLOTS } from "./resources";

package/dist/collection/components/tile-select/interfaces.js

@@ -1,6 +1,6 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-beta.86
+ * v1.0.0-beta.87
  */
 export {};

package/dist/collection/components/tile-select/resources.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-beta.86
+ * v1.0.0-beta.87
  */
 export const CSS = {
   checked: "checked",

package/dist/collection/components/tile-select/tile-select.css

@@ -71,13 +71,21 @@
 * Currently only used in Checkbox.
 */
 :root {
-  --calcite-popper-transition: var(--calcite-animation-timing);
+  --calcite-floating-ui-transition: var(--calcite-animation-timing);
 }
 
 :host([hidden]) {
   display: none;
 }
 
+:host([disabled]) {
+  pointer-events: none;
+  cursor: default;
+  -webkit-user-select: none;
+          user-select: none;
+  opacity: var(--calcite-ui-opacity-disabled);
+}
+
 :host {
   display: block;
 }
@@ -87,8 +95,8 @@
   box-sizing: border-box;
   cursor: pointer;
   display: inline-block;
-  height: 100%;
-  max-width: 300px;
+  block-size: 100%;
+  max-inline-size: 300px;
   padding: 0.75rem;
   position: relative;
   vertical-align: top;
@@ -105,8 +113,8 @@
 :host .container:not(.input-enabled) ::slotted(calcite-checkbox), 
 :host .container:not(.input-enabled) ::slotted(calcite-radio-button) {
   position: absolute;
-  width: 1px;
-  height: 1px;
+  inline-size: 1px;
+  block-size: 1px;
   padding: 0;
   margin: -1px;
   overflow: hidden;
@@ -166,7 +174,7 @@
 }
 :host .container.width-full {
   display: flex;
-  max-width: none;
+  max-inline-size: none;
 }
 :host .container.width-full calcite-tile {
   flex: 1 1 auto;
@@ -179,13 +187,6 @@
   box-shadow: 0 0 0 1px var(--calcite-ui-brand);
 }
 
-:host([disabled]) {
-  pointer-events: none;
-  cursor: default;
-  -webkit-user-select: none;
-          user-select: none;
-  opacity: var(--calcite-ui-opacity-disabled);
-}
 :host([disabled]) ::slotted([calcite-hydrated][disabled]),
 :host([disabled]) [calcite-hydrated][disabled] {
   /* prevent opacity stacking */

package/dist/collection/components/tile-select/tile-select.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-beta.86
+ * v1.0.0-beta.87
  */
 import { Component, Element, Event, h, Prop, Listen, Watch, State, Method } from "@stencil/core";
 import { guid } from "../../utils/guid";
@@ -434,8 +434,8 @@ export class TileSelect {
         "text": "Emits a custom change event.  For checkboxes, it emits when the checkbox is checked or unchecked.  For radios it only emits when it is checked."
       },
       "complexType": {
-        "original": "any",
-        "resolved": "any",
+        "original": "void",
+        "resolved": "void",
         "references": {}
       }
     }]; }

package/dist/collection/components/tile-select-group/interfaces.js

@@ -1,6 +1,6 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-beta.86
+ * v1.0.0-beta.87
  */
 export {};

package/dist/collection/components/tile-select-group/tile-select-group.css

@@ -71,19 +71,27 @@
 * Currently only used in Checkbox.
 */
 :root {
-  --calcite-popper-transition: var(--calcite-animation-timing);
+  --calcite-floating-ui-transition: var(--calcite-animation-timing);
 }
 
 :host([hidden]) {
   display: none;
 }
 
+:host([disabled]) {
+  pointer-events: none;
+  cursor: default;
+  -webkit-user-select: none;
+          user-select: none;
+  opacity: var(--calcite-ui-opacity-disabled);
+}
+
 :host {
   display: flex;
   flex-wrap: wrap;
 }
 :host ::slotted(calcite-tile-select) {
-  margin-bottom: 1px;
+  margin-block-end: 1px;
   margin-inline-end: 1px;
 }
 
@@ -91,13 +99,6 @@
   flex-direction: column;
 }
 
-:host([disabled]) {
-  pointer-events: none;
-  cursor: default;
-  -webkit-user-select: none;
-          user-select: none;
-  opacity: var(--calcite-ui-opacity-disabled);
-}
 :host([disabled]) ::slotted([calcite-hydrated][disabled]),
 :host([disabled]) [calcite-hydrated][disabled] {
   /* prevent opacity stacking */

package/dist/collection/components/tile-select-group/tile-select-group.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-beta.86
+ * v1.0.0-beta.87
  */
 import { Component, h, Prop, Element } from "@stencil/core";
 import { updateHostInteraction } from "../../utils/interactive";

package/dist/collection/components/time-picker/resources.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-beta.86
+ * v1.0.0-beta.87
  */
 export const CSS = {
   button: "button",

package/dist/collection/components/time-picker/time-picker.css

@@ -71,7 +71,7 @@
 * Currently only used in Checkbox.
 */
 :root {
-  --calcite-popper-transition: var(--calcite-animation-timing);
+  --calcite-floating-ui-transition: var(--calcite-animation-timing);
 }
 
 :host([hidden]) {
@@ -118,16 +118,16 @@
   background-color: var(--calcite-ui-foreground-3);
 }
 .time-picker .button.top-left {
-  border-top-left-radius: var(--calcite-border-radius);
+  border-start-start-radius: var(--calcite-border-radius);
 }
 .time-picker .button.bottom-left {
-  border-bottom-left-radius: var(--calcite-border-radius);
+  border-end-start-radius: var(--calcite-border-radius);
 }
 .time-picker .button.top-right {
-  border-top-right-radius: var(--calcite-border-radius);
+  border-start-end-radius: var(--calcite-border-radius);
 }
 .time-picker .button.bottom-right {
-  border-bottom-right-radius: var(--calcite-border-radius);
+  border-end-end-radius: var(--calcite-border-radius);
 }
 .time-picker .button calcite-icon {
   color: var(--calcite-ui-text-3);
@@ -153,10 +153,8 @@
 }
 .time-picker.scale-s .button, 
 .time-picker.scale-s .input {
-  padding-left: 0.75rem;
-  padding-right: 0.75rem;
-  padding-top: 0.25rem;
-  padding-bottom: 0.25rem;
+  padding-inline: 0.75rem;
+  padding-block: 0.25rem;
 }
 .time-picker.scale-s:not(.show-meridiem) .delimiter:last-child {
   padding-inline-end: 0.75rem;
@@ -166,10 +164,8 @@
 }
 .time-picker.scale-m .button, 
 .time-picker.scale-m .input {
-  padding-left: 1rem;
-  padding-right: 1rem;
-  padding-top: 0.5rem;
-  padding-bottom: 0.5rem;
+  padding-inline: 1rem;
+  padding-block: 0.5rem;
 }
 .time-picker.scale-m:not(.show-meridiem) .delimiter:last-child {
   padding-inline-end: 1rem;
@@ -179,10 +175,8 @@
 }
 .time-picker.scale-l .button, 
 .time-picker.scale-l .input {
-  padding-left: 1.25rem;
-  padding-right: 1.25rem;
-  padding-top: 0.75rem;
-  padding-bottom: 0.75rem;
+  padding-inline: 1.25rem;
+  padding-block: 0.75rem;
 }
 .time-picker.scale-l:not(.show-meridiem) .delimiter:last-child {
   padding-inline-end: 1.25rem;

package/dist/collection/components/time-picker/time-picker.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-beta.86
+ * v1.0.0-beta.87
  */
 import { Component, Element, h, Prop, Event, Watch, State, Listen, Method } from "@stencil/core";
 import { isActivationKey, numberKeys } from "../../utils/key";

package/dist/collection/components/tip/resources.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-beta.86
+ * v1.0.0-beta.87
  */
 import { HEADING_LEVEL as PARENT_HEADING_LEVEL } from "../tip-manager/resources";
 export const CSS = {

package/dist/collection/components/tip/tip.css

@@ -71,7 +71,7 @@
 * Currently only used in Checkbox.
 */
 :root {
-  --calcite-popper-transition: var(--calcite-animation-timing);
+  --calcite-floating-ui-transition: var(--calcite-animation-timing);
 }
 
 :host([hidden]) {
@@ -97,7 +97,7 @@
 }
 
 .container {
-  width: 100%;
+  inline-size: 100%;
   padding: 1rem;
 }
 
@@ -155,7 +155,7 @@ h5.heading {
 }
 
 .header {
-  margin-bottom: 0.5rem;
+  margin-block-end: 0.5rem;
 }
 
 .header .heading {
@@ -172,20 +172,17 @@ h5.heading {
 }
 
 .info {
-  padding-top: 0px;
-  padding-bottom: 0px;
-  padding-left: 1rem;
-  padding-right: 1rem;
-  width: 70%;
+  padding-block: 0px;
+  padding-inline: 1rem;
+  inline-size: 70%;
 }
 .info:only-child {
-  width: 100%;
-  padding-left: 0px;
-  padding-right: 0px;
+  inline-size: 100%;
+  padding-inline: 0px;
 }
 
 ::slotted(p) {
-  margin-top: 0px;
+  margin-block-start: 0px;
 }
 
 ::slotted(a) {
@@ -199,12 +196,12 @@ h5.heading {
 }
 
 .image-frame {
-  width: 25%;
+  inline-size: 25%;
 }
 .image-frame img {
-  max-width: 100%;
+  max-inline-size: 100%;
 }
 
 ::slotted(img) {
-  max-width: 100%;
+  max-inline-size: 100%;
 }

package/dist/collection/components/tip/tip.js

@@ -1,7 +1,7 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.0.0-beta.86
+ * v1.0.0-beta.87
  */
 import { Component, Element, Event, Prop, h, Fragment } from "@stencil/core";
 import { CSS, ICONS, SLOTS, TEXT, HEADING_LEVEL } from "./resources";
@@ -223,8 +223,8 @@ export class Tip {
         "text": "Emitted when the component has been dismissed."
       },
       "complexType": {
-        "original": "any",
-        "resolved": "any",
+        "original": "void",
+        "resolved": "void",
         "references": {}
       }
     }]; }