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

package/dist/collection/components/radio-button/radio-button.css

@@ -140,9 +140,9 @@
 }
 
 .radio {
-  height: var(--calcite-radio-size);
-  max-width: var(--calcite-radio-size);
-  min-width: var(--calcite-radio-size);
+  block-size: var(--calcite-radio-size);
+  max-inline-size: var(--calcite-radio-size);
+  min-inline-size: var(--calcite-radio-size);
 }
 
 :host([scale=s][checked]) .radio,
@@ -176,22 +176,19 @@
   :host([checked]) .radio::after,
 :host([checked][disabled]) .radio::after {
     content: "";
-    width: var(--calcite-radio-size);
-    height: var(--calcite-radio-size);
+    inline-size: var(--calcite-radio-size);
+    block-size: var(--calcite-radio-size);
     background-color: windowText;
     display: block;
   }
 }
 ::slotted(input[slot=hidden-form-input]) {
-  bottom: 0 !important;
-  left: 0 !important;
   margin: 0 !important;
   opacity: 0 !important;
   outline: none !important;
   padding: 0 !important;
   position: absolute !important;
-  right: 0 !important;
-  top: 0 !important;
+  inset: 0 !important;
   transform: none !important;
   -webkit-appearance: none !important;
   z-index: -1 !important;

package/dist/collection/components/radio-button/radio-button.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, Method, Prop, Watch } from "@stencil/core";
 import { guid } from "../../utils/guid";

package/dist/collection/components/radio-button/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 = {
   container: "container"

package/dist/collection/components/radio-button-group/radio-button-group.css

@@ -80,7 +80,7 @@
 
 :host {
   display: flex;
-  max-width: 100vw;
+  max-inline-size: 100vw;
 }
 
 :host([layout=horizontal]) {

package/dist/collection/components/radio-button-group/radio-button-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, Host, h, Element, Prop, Watch, Event, Listen } from "@stencil/core";
 import { createObserver } from "../../utils/observers";

package/dist/collection/components/radio-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/radio-group/radio-group.css

@@ -81,8 +81,8 @@
 :host {
   display: flex;
   background-color: var(--calcite-ui-foreground-1);
-  width: -moz-fit-content;
-  width: fit-content;
+  inline-size: -moz-fit-content;
+  inline-size: fit-content;
   outline: 1px solid var(--calcite-ui-border-input);
   outline-offset: -1px;
 }
@@ -107,9 +107,9 @@
 }
 
 :host([width=full]) {
-  width: 100%;
-  min-width: -moz-fit-content;
-  min-width: fit-content;
+  inline-size: 100%;
+  min-inline-size: -moz-fit-content;
+  min-inline-size: fit-content;
 }
 :host([width=full]) ::slotted(calcite-radio-group-item) {
   flex: 1 1 auto;
@@ -125,15 +125,12 @@
 }
 
 ::slotted(input[slot=hidden-form-input]) {
-  bottom: 0 !important;
-  left: 0 !important;
   margin: 0 !important;
   opacity: 0 !important;
   outline: none !important;
   padding: 0 !important;
   position: absolute !important;
-  right: 0 !important;
-  top: 0 !important;
+  inset: 0 !important;
   transform: none !important;
   -webkit-appearance: none !important;
   z-index: -1 !important;

package/dist/collection/components/radio-group/radio-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 { Build, Component, Element, Event, h, Host, Listen, Method, Prop, Watch } from "@stencil/core";
 import { getElementDir } from "../../utils/dom";

package/dist/collection/components/radio-group-item/radio-group-item.css

@@ -111,28 +111,22 @@
 }
 
 .label--scale-s {
-  padding-left: 0.5rem;
-  padding-right: 0.5rem;
+  padding-inline: 0.5rem;
   font-size: var(--calcite-font-size--2);
   line-height: 1rem;
-  padding-top: 0.125rem;
-  padding-bottom: 0.125rem;
+  padding-block: 0.125rem;
 }
 
 .label--scale-m {
-  padding-left: 0.75rem;
-  padding-right: 0.75rem;
+  padding-inline: 0.75rem;
   font-size: var(--calcite-font-size--1);
   line-height: 1rem;
-  padding-top: 0.375rem;
-  padding-bottom: 0.375rem;
+  padding-block: 0.375rem;
 }
 
 .label--scale-l {
-  padding-left: 1rem;
-  padding-right: 1rem;
-  padding-top: 0.625rem;
-  padding-bottom: 0.625rem;
+  padding-inline: 1rem;
+  padding-block: 0.625rem;
   font-size: var(--calcite-font-size-0);
   line-height: 1.25rem;
 }

package/dist/collection/components/radio-group-item/radio-group-item.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, Event, Host, Watch } from "@stencil/core";
 import { getElementProp, toAriaBoolean } from "../../utils/dom";

package/dist/collection/components/radio-group-item/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 = {
   input: "input"

package/dist/collection/components/rating/rating.css

@@ -89,8 +89,8 @@
   position: relative;
   display: flex;
   align-items: center;
-  width: -moz-fit-content;
-  width: fit-content;
+  inline-size: -moz-fit-content;
+  inline-size: fit-content;
 }
 
 :host([disabled]) {
@@ -107,17 +107,17 @@
 }
 
 :host([scale=s]) {
-  height: 1.5rem;
+  block-size: 1.5rem;
   --calcite-rating-spacing-unit: 0.25rem;
 }
 
 :host([scale=m]) {
-  height: 2rem;
+  block-size: 2rem;
   --calcite-rating-spacing-unit: 0.5rem;
 }
 
 :host([scale=l]) {
-  height: 2.75rem;
+  block-size: 2.75rem;
   --calcite-rating-spacing-unit: 0.75rem;
 }
 
@@ -166,7 +166,7 @@
 :host .fraction {
   pointer-events: none;
   position: absolute;
-  top: 0px;
+  inset-block-start: 0px;
   overflow: hidden;
   transition: all var(--calcite-animation-timing) ease-in-out 0s, outline 0s, outline-offset 0s;
   inset-inline-start: 0;
@@ -191,8 +191,8 @@ calcite-chip {
 
 .visually-hidden {
   position: absolute;
-  width: 1px;
-  height: 1px;
+  inline-size: 1px;
+  block-size: 1px;
   padding: 0;
   margin: -1px;
   overflow: hidden;
@@ -202,15 +202,12 @@ calcite-chip {
 }
 
 ::slotted(input[slot=hidden-form-input]) {
-  bottom: 0 !important;
-  left: 0 !important;
   margin: 0 !important;
   opacity: 0 !important;
   outline: none !important;
   padding: 0 !important;
   position: absolute !important;
-  right: 0 !important;
-  top: 0 !important;
+  inset: 0 !important;
   transform: none !important;
   -webkit-appearance: none !important;
   z-index: -1 !important;

package/dist/collection/components/rating/rating.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, Fragment, h, Listen, Method, Prop, State } from "@stencil/core";
 import { guid } from "../../utils/guid";

package/dist/collection/components/rating/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 TEXT = {
   rating: "Rating",

package/dist/collection/components/scrim/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 = {
   scrim: "scrim",

package/dist/collection/components/scrim/scrim.css

@@ -80,14 +80,11 @@
 
 :host {
   position: absolute;
-  top: 0px;
-  right: 0px;
-  bottom: 0px;
-  left: 0px;
+  inset: 0px;
   z-index: 50;
   display: flex;
-  height: 100%;
-  width: 100%;
+  block-size: 100%;
+  inline-size: 100%;
   flex-direction: column;
   align-items: stretch;
 }
@@ -102,10 +99,7 @@
 }
 .scrim {
   position: absolute;
-  top: 0px;
-  right: 0px;
-  bottom: 0px;
-  left: 0px;
+  inset: 0px;
   display: flex;
   flex-direction: column;
   align-content: center;

package/dist/collection/components/scrim/scrim.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, Prop, h } from "@stencil/core";
 import { CSS, TEXT } from "./resources";

package/dist/collection/components/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 = {
   icon: "icon",

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

@@ -106,7 +106,7 @@
   position: relative;
   display: flex;
   align-items: stretch;
-  width: var(--select-width);
+  inline-size: var(--select-width);
 }
 
 :host([disabled]) {
@@ -123,51 +123,48 @@
 }
 
 :host([scale=s]) {
-  height: 1.5rem;
+  block-size: 1.5rem;
   --calcite-select-font-size: var(--calcite-font-size--2);
   --calcite-select-spacing-inline: 0.5rem 2rem;
 }
 :host([scale=s]) .icon-container {
-  padding-left: 0.5rem;
-  padding-right: 0.5rem;
+  padding-inline: 0.5rem;
 }
 
 :host([scale=m]) {
-  height: 2rem;
+  block-size: 2rem;
   --calcite-select-font-size: var(--calcite-font-size--1);
   --calcite-select-spacing-inline: 0.75rem 2.5rem;
 }
 :host([scale=m]) .icon-container {
-  padding-left: 0.75rem;
-  padding-right: 0.75rem;
+  padding-inline: 0.75rem;
 }
 
 :host([scale=l]) {
-  height: 44px;
+  block-size: 44px;
   --calcite-select-font-size: var(--calcite-font-size-0);
   --calcite-select-spacing-inline: 1rem 3rem;
 }
 :host([scale=l]) .icon-container {
-  padding-left: 1rem;
-  padding-right: 1rem;
+  padding-inline: 1rem;
 }
 
 :host([width=auto]) {
-  width: auto;
+  inline-size: auto;
 }
 
 :host([width=half]) {
-  width: 50%;
+  inline-size: 50%;
 }
 
 :host([width=full]) {
-  width: 100%;
+  inline-size: 100%;
 }
 
 .select {
   margin: 0px;
   box-sizing: border-box;
-  width: 100%;
+  inline-size: 100%;
   cursor: pointer;
   -webkit-appearance: none;
           appearance: none;
@@ -202,8 +199,7 @@ select:disabled {
 .icon-container {
   pointer-events: none;
   position: absolute;
-  top: 0px;
-  bottom: 0px;
+  inset-block: 0px;
   display: flex;
   align-items: center;
   border-width: 0px;
@@ -220,15 +216,12 @@ select:disabled {
 }
 
 ::slotted(input[slot=hidden-form-input]) {
-  bottom: 0 !important;
-  left: 0 !important;
   margin: 0 !important;
   opacity: 0 !important;
   outline: none !important;
   padding: 0 !important;
   position: absolute !important;
-  right: 0 !important;
-  top: 0 !important;
+  inset: 0 !important;
   transform: none !important;
   -webkit-appearance: none !important;
   z-index: -1 !important;

package/dist/collection/components/select/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, Fragment, h, Listen, Method, Prop, Watch } from "@stencil/core";
 import { focusElement } from "../../utils/dom";

package/dist/collection/components/shell/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 = {
   main: "main",

package/dist/collection/components/shell/shell.css

@@ -98,13 +98,10 @@
 */
 :host {
   position: absolute;
-  top: 0px;
-  right: 0px;
-  bottom: 0px;
-  left: 0px;
+  inset: 0px;
   display: flex;
-  height: 100%;
-  width: 100%;
+  block-size: 100%;
+  inline-size: 100%;
   flex-direction: column;
   overflow: hidden;
   --calcite-shell-tip-spacing: 26vw;
@@ -113,8 +110,8 @@
 .main {
   position: relative;
   display: flex;
-  height: 100%;
-  width: 100%;
+  block-size: 100%;
+  inline-size: 100%;
   flex: 1 1 auto;
   flex-direction: row;
   justify-content: space-between;
@@ -127,8 +124,8 @@
 
 .content {
   display: flex;
-  height: 100%;
-  width: 100%;
+  block-size: 100%;
+  inline-size: 100%;
   flex-direction: column;
   flex-wrap: nowrap;
   overflow: auto;
@@ -139,22 +136,19 @@
 .content ::slotted(calcite-flow) {
   flex: 1 1 auto;
   align-self: stretch;
-  max-height: unset;
+  max-block-size: unset;
 }
 
 .content--behind {
   position: absolute;
-  top: 0px;
-  right: 0px;
-  bottom: 0px;
-  left: 0px;
+  inset: 0px;
   z-index: 0;
   border-width: 0px;
   display: initial;
 }
 
 ::slotted(calcite-shell-center-row) {
-  width: unset;
+  inline-size: unset;
 }
 
 ::slotted(.header .heading) {
@@ -172,15 +166,15 @@
 ::slotted(calcite-panel), 
 ::slotted(calcite-flow) {
   border-width: 1px;
-  border-left-width: 0px;
-  border-right-width: 0px;
+  border-inline-start-width: 0px;
+  border-inline-end-width: 0px;
   border-style: solid;
   border-color: var(--calcite-ui-border-3);
 }
 
 slot[name=center-row]::slotted(calcite-shell-center-row:not([detached])) {
-  border-left-width: 1px;
-  border-right-width: 1px;
+  border-inline-start-width: 1px;
+  border-inline-end-width: 1px;
   border-color: var(--calcite-ui-border-3);
 }
 
@@ -206,8 +200,7 @@ slot[name=center-row]::slotted(calcite-shell-center-row:not([detached])) {
   --tw-shadow: 0 6px 20px -4px rgba(0, 0, 0, 0.1), 0 4px 12px -2px rgba(0, 0, 0, 0.08);
   --tw-shadow-colored: 0 6px 20px -4px var(--tw-shadow-color), 0 4px 12px -2px var(--tw-shadow-color);
   box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
-  bottom: 0.5rem;
-  left: var(--calcite-shell-tip-spacing);
-  right: var(--calcite-shell-tip-spacing);
+  inset-block-end: 0.5rem;
+  inset-inline: var(--calcite-shell-tip-spacing);
   z-index: 2;
 }

package/dist/collection/components/shell/shell.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, Prop, h, Fragment } from "@stencil/core";
 import { CSS, SLOTS } from "./resources";

package/dist/collection/components/shell-center-row/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 = {
   actionBarContainer: "action-bar-container",

package/dist/collection/components/shell-center-row/shell-center-row.css

@@ -99,8 +99,8 @@
 .content {
   margin: 0px;
   display: flex;
-  height: 100%;
-  width: 100%;
+  block-size: 100%;
+  inline-size: 100%;
   overflow: hidden;
   flex: 1 0 0;
 }
@@ -110,10 +110,8 @@
 }
 
 :host([detached]) {
-  margin-left: 0.5rem;
-  margin-right: 0.5rem;
-  margin-top: 0.5rem;
-  margin-bottom: 1.5rem;
+  margin-inline: 0.5rem;
+  margin-block: 0.5rem 1.5rem;
 }
 
 @keyframes in-up {
@@ -145,24 +143,24 @@
 }
 
 :host([height-scale=s]) {
-  height: 33.333333%;
+  block-size: 33.333333%;
 }
 
 :host([height-scale=m]) {
-  height: 70%;
+  block-size: 70%;
 }
 
 :host([height-scale=l]) {
-  height: 100%;
+  block-size: 100%;
 }
 
 :host([height-scale=l][detached]) {
-  height: calc(100% - 2rem);
+  block-size: calc(100% - 2rem);
 }
 
 ::slotted(calcite-panel) {
-  height: 100%;
-  width: 100%;
+  block-size: 100%;
+  inline-size: 100%;
 }
 
 ::slotted(calcite-action-bar),

package/dist/collection/components/shell-center-row/shell-center-row.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, Prop, h, Fragment } from "@stencil/core";
 import { CSS, SLOTS } from "./resources";

package/dist/collection/components/shell-panel/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 = {
   container: "container",