@esri/calcite-components 1.0.0-next.529 → 1.0.0-next.531

package/dist/collection/components/tab/tab.css

@@ -84,40 +84,37 @@
 
 :host {
   display: none;
-  height: 100%;
-  width: 100%;
+  block-size: 100%;
+  inline-size: 100%;
 }
 
 :host([active]) {
   display: block;
-  height: 100%;
-  width: 100%;
+  block-size: 100%;
+  inline-size: 100%;
   overflow: auto;
 }
 
 section {
   display: none;
-  height: 100%;
-  width: 100%;
+  block-size: 100%;
+  inline-size: 100%;
 }
 
 :host([scale=s]) {
-  padding-top: 0.25rem;
-  padding-bottom: 0.25rem;
+  padding-block: 0.25rem;
   font-size: var(--calcite-font-size--2);
   line-height: 1rem;
 }
 
 :host([scale=m]) {
-  padding-top: 0.5rem;
-  padding-bottom: 0.5rem;
+  padding-block: 0.5rem;
   font-size: var(--calcite-font-size--1);
   line-height: 1rem;
 }
 
 :host([scale=l]) {
-  padding-top: 0.75rem;
-  padding-bottom: 0.75rem;
+  padding-block: 0.75rem;
   font-size: var(--calcite-font-size-0);
   line-height: 1.25rem;
 }

package/dist/collection/components/tab/tab.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-next.529
+ * v1.0.0-next.531
  */
 import { Component, Prop, Element, Listen, Method, Event, h, State, Host } from "@stencil/core";
 import { guid } from "../../utils/guid";

package/dist/collection/components/tab-nav/tab-nav.css

@@ -84,39 +84,38 @@
 }
 
 :host([scale=s]) {
-  min-height: 1.5rem;
+  min-block-size: 1.5rem;
 }
 
 :host([scale=m]) {
-  min-height: 2rem;
+  min-block-size: 2rem;
 }
 
 :host([scale=l]) {
-  min-height: 2.75rem;
+  min-block-size: 2.75rem;
 }
 
 .tab-nav {
   display: flex;
-  width: 100%;
+  inline-size: 100%;
   justify-content: flex-start;
   overflow: auto;
 }
 
 .tab-nav-active-indicator-container {
   position: absolute;
-  left: 0px;
-  right: 0px;
-  bottom: 0px;
-  height: 0.125rem;
-  width: 100%;
+  inset-inline: 0px;
+  inset-block-end: 0px;
+  block-size: 0.125rem;
+  inline-size: 100%;
   overflow: hidden;
 }
 
 .tab-nav-active-indicator {
   position: absolute;
-  bottom: 0px;
+  inset-block-end: 0px;
   display: block;
-  height: 0.125rem;
+  block-size: 0.125rem;
   background-color: var(--calcite-ui-brand);
   transition-property: all;
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
@@ -125,37 +124,37 @@
 }
 
 :host([position=below]) .tab-nav-active-indicator {
-  bottom: unset;
-  top: 0px;
+  inset-block-end: unset;
+  inset-block-start: 0px;
 }
 
 :host([position=bottom]) .tab-nav-active-indicator {
-  bottom: unset;
-  top: 0px;
+  inset-block-end: unset;
+  inset-block-start: 0px;
 }
 
 :host([position=below]) .tab-nav-active-indicator-container {
-  bottom: unset;
-  top: 0px;
+  inset-block-start: 0px;
+  inset-block-end: unset;
 }
 
 :host([position=bottom]) .tab-nav-active-indicator-container {
-  bottom: unset;
-  top: 0px;
+  inset-block-end: unset;
+  inset-block-start: 0px;
 }
 
 :host([bordered]) .tab-nav-active-indicator-container {
-  bottom: unset;
+  inset-block-end: unset;
 }
 
 :host([bordered][position=below]) .tab-nav-active-indicator-container {
-  bottom: 0;
-  top: unset;
+  inset-block-end: 0;
+  inset-block-start: unset;
 }
 
 :host([bordered][position=bottom]) .tab-nav-active-indicator-container {
-  bottom: 0;
-  top: unset;
+  inset-block-end: 0;
+  inset-block-start: unset;
 }
 
 @media (forced-colors: active) {

package/dist/collection/components/tab-nav/tab-nav.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-next.529
+ * v1.0.0-next.531
  */
 import { Component, Element, Event, h, Host, Listen, Prop, State, Watch } from "@stencil/core";
 import { getElementDir, filterDirectChildren } from "../../utils/dom";

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

@@ -88,26 +88,24 @@
 }
 
 :host([layout=center]) {
-  margin-top: 0px;
-  margin-bottom: 0px;
-  margin-left: 1.25rem;
-  margin-right: 1.25rem;
+  margin-block: 0px;
+  margin-inline: 1.25rem;
   text-align: center;
   flex-basis: 12rem;
 }
 
 :host([position=below]) a {
-  border-bottom-width: 0px;
-  border-top-width: 2px;
-  border-top-color: transparent;
-  border-top-style: solid;
+  border-block-end-width: 0px;
+  border-block-start-width: 2px;
+  border-block-start-color: transparent;
+  border-block-start-style: solid;
 }
 
 :host([position=bottom]) a {
-  border-bottom-width: 0px;
-  border-top-width: 2px;
-  border-top-color: transparent;
-  border-top-style: solid;
+  border-block-end-width: 0px;
+  border-block-start-width: 2px;
+  border-block-start-color: transparent;
+  border-block-start-style: solid;
 }
 
 :host a {
@@ -156,16 +154,14 @@
 }
 :host([scale=s]) a, 
 :host([scale=s]) span {
-  padding-top: 0.25rem;
-  padding-bottom: 0.25rem;
+  padding-block: 0.25rem;
   font-size: var(--calcite-font-size--2);
   line-height: 1rem;
 }
 
 :host([scale=m]) a, 
 :host([scale=m]) span {
-  padding-top: 0.5rem;
-  padding-bottom: 0.5rem;
+  padding-block: 0.5rem;
   font-size: var(--calcite-font-size--1);
   line-height: 1rem;
 }
@@ -175,8 +171,7 @@
 }
 :host([scale=l]) a, 
 :host([scale=l]) span {
-  padding-top: 0.75rem;
-  padding-bottom: 0.75rem;
+  padding-block: 0.75rem;
   font-size: var(--calcite-font-size-0);
   line-height: 1.25rem;
 }
@@ -185,8 +180,8 @@ a,
 span {
   box-sizing: border-box;
   display: flex;
-  height: 100%;
-  width: 100%;
+  block-size: 100%;
+  inline-size: 100%;
   cursor: pointer;
   -webkit-appearance: none;
           appearance: none;
@@ -194,17 +189,15 @@ span {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
-  border-bottom-width: 2px;
-  padding-left: 0px;
-  padding-right: 0px;
-  padding-top: 0.5rem;
-  padding-bottom: 0.5rem;
+  border-block-end-width: 2px;
+  padding-inline: 0px;
+  padding-block: 0.5rem;
   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-bottom-color: transparent;
-  border-bottom-style: solid;
+  border-block-end-color: transparent;
+  border-block-end-style: solid;
 }
 
 span {
@@ -264,17 +257,17 @@ span {
 }
 
 :host([bordered]) a {
-  border-bottom-style: unset;
+  border-block-end-style: unset;
   border-inline-start: 1px solid transparent;
   border-inline-end: 1px solid transparent;
 }
 
 :host([bordered][position=below]) a {
-  border-top-style: unset;
+  border-block-start-style: unset;
 }
 
 :host([bordered][position=bottom]) a {
-  border-top-style: unset;
+  border-block-start-style: unset;
 }
 
 :host([active][bordered]) a {
@@ -284,20 +277,17 @@ span {
 
 :host([bordered]) a, 
 :host([bordered]) span {
-  padding-left: 0.75rem;
-  padding-right: 0.75rem;
+  padding-inline: 0.75rem;
 }
 
 :host([bordered][scale=s]) a, 
 :host([bordered][scale=s]) span {
-  padding-left: 0.5rem;
-  padding-right: 0.5rem;
+  padding-inline: 0.5rem;
 }
 
 :host([bordered][scale=l]) a, 
 :host([bordered][scale=l]) span {
-  padding-left: 1rem;
-  padding-right: 1rem;
+  padding-inline: 1rem;
 }
 
 @media (forced-colors: active) {
@@ -311,26 +301,26 @@ span {
   }
 
   :host([bordered]) a {
-    border-bottom-style: solid;
+    border-block-end-style: solid;
   }
 
   :host([bordered][position=below]) a {
-    border-top-style: solid;
+    border-block-start-style: solid;
   }
 
   :host([bordered][position=bottom]) a {
-    border-top-style: solid;
+    border-block-start-style: solid;
   }
 
   :host([bordered][active]) a {
-    border-bottom-style: none;
+    border-block-end-style: none;
   }
 
   :host([bordered][position=below][active]) a {
-    border-top-style: none;
+    border-block-start-style: none;
   }
 
   :host([bordered][position=bottom][active]) a {
-    border-top-style: none;
+    border-block-start-style: none;
   }
 }

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-next.529
+ * v1.0.0-next.531
  */
 import { Build, Component, Element, Event, h, Host, Listen, Method, Prop, State, Watch } from "@stencil/core";
 import { guid } from "../../utils/guid";

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-next.529
+ * v1.0.0-next.531
  */
 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-next.529
+ * v1.0.0-next.531
  */
 export const SLOTS = {
   tabNav: "tab-nav"

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

@@ -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-next.529
+ * v1.0.0-next.531
  */
 import { Component, Prop, h, Element, Listen, State, Fragment } from "@stencil/core";
 import { SLOTS } from "./resources";

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-next.529
+ * v1.0.0-next.531
  */
 export const SLOTS = {
   contentStart: "content-start",

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

@@ -100,11 +100,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 +135,7 @@
 :host .large-visual {
   align-items: center;
   text-align: center;
-  min-height: 12rem;
+  min-block-size: 12rem;
 }
 :host .large-visual .icon {
   display: flex;

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-next.529
+ * v1.0.0-next.531
  */
 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-next.529
+ * v1.0.0-next.531
  */
 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-next.529
+ * v1.0.0-next.531
  */
 export const CSS = {
   checked: "checked",

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

@@ -87,8 +87,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 +105,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 +166,7 @@
 }
 :host .container.width-full {
   display: flex;
-  max-width: none;
+  max-inline-size: none;
 }
 :host .container.width-full calcite-tile {
   flex: 1 1 auto;

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-next.529
+ * v1.0.0-next.531
  */
 import { Component, Element, Event, h, Prop, Listen, Watch, State, Method } from "@stencil/core";
 import { guid } from "../../utils/guid";

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-next.529
+ * v1.0.0-next.531
  */
 export {};

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

@@ -83,7 +83,7 @@
   flex-wrap: wrap;
 }
 :host ::slotted(calcite-tile-select) {
-  margin-bottom: 1px;
+  margin-block-end: 1px;
   margin-inline-end: 1px;
 }
 

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-next.529
+ * v1.0.0-next.531
  */
 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-next.529
+ * v1.0.0-next.531
  */
 export const CSS = {
   button: "button",

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

@@ -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;