@arcgis/core 4.28.0-next.20230621 → 4.28.0-next.20230623

package/assets/esri/themes/base/_core.scss

@@ -37,8 +37,8 @@ $include_Expand: $include_widgets !default;
 $include_Feature: $include_widgets !default;
 $include_FeatureContent: $include_widgets !default;
 $include_FeatureForm: $include_widgets !default;
-$include_Features: $include_widgets !default;
 $include_FeatureMedia: $include_widgets !default;
+$include_Features: $include_widgets !default;
 $include_FeatureTable: $include_widgets !default;
 $include_FeatureTemplates: $include_widgets !default;
 $include_FloorFilter: $include_widgets !default;
@@ -53,6 +53,7 @@ $include_LayerList: $include_widgets !default;
 $include_Legend: $include_widgets !default;
 $include_LineOfSight: $include_widgets !default;
 $include_Measurement: $include_widgets !default;
+$include_MeasurementWidgetContent: $include_widgets !default;
 $include_NavigationToggle: $include_widgets !default;
 $include_OpacitySlider: $include_widgets !default;
 $include_OrientedImageryViewer: $include_widgets !default;
@@ -77,6 +78,7 @@ $include_TimePicker: $include_widgets !default;
 $include_TimeSlider: $include_widgets !default;
 $include_TimezonePicker: $include_widgets !default;
 $include_Tooltip: $include_widgets !default;
+$include_UnitSelect: $include_widgets !default;
 $include_UtilityNetworkAssociations: $include_widgets !default;
 $include_UtilityNetworkTrace: $include_widgets !default;
 $include_UtilityNetworkValidateTopology: $include_widgets !default;
@@ -134,8 +136,8 @@ $calcite-fonts-path: "../base/fonts/fonts/" !default;
 @import "widgets/Feature";
 @import "widgets/FeatureContent";
 @import "widgets/FeatureForm";
-@import "widgets/Features";
 @import "widgets/FeatureMedia";
+@import "widgets/Features";
 @import "widgets/FeatureTable";
 @import "widgets/FeatureTemplates";
 @import "widgets/FloorFilter";
@@ -150,6 +152,7 @@ $calcite-fonts-path: "../base/fonts/fonts/" !default;
 @import "widgets/Legend";
 @import "widgets/LineOfSight";
 @import "widgets/Measurement";
+@import "widgets/MeasurementWidgetContent";
 @import "widgets/NavigationToggle";
 @import "widgets/OpacitySlider";
 @import "widgets/OrientedImageryViewer";
@@ -175,6 +178,7 @@ $calcite-fonts-path: "../base/fonts/fonts/" !default;
 @import "widgets/TimeSlider";
 @import "widgets/TimezonePicker";
 @import "widgets/Tooltip";
+@import "widgets/UnitSelect";
 @import "widgets/UtilityNetworkAssociations";
 @import "widgets/UtilityNetworkTrace";
 @import "widgets/UtilityNetworkValidateTopology";

package/assets/esri/themes/base/_mixins.scss

@@ -31,30 +31,6 @@
   z-index: 1;
 }
 
-@function sqrt($r) {
-  $x0: 1;
-  $x1: $x0;
-  @for $i from 1 through 10 {
-    $x1: $x0 - math.div($x0 * $x0 - abs($r), 2 * $x0);
-    $x0: $x1;
-  }
-  @return $x1;
-}
-
-@mixin contentMaxHeightDockedSide($contentHeight) {
-  $pageMenuHeight: $contentHeight - 60;
-  .esri-popup--is-docked {
-    &-top-left,
-    &-top-right,
-    &-bottom-left,
-    &-bottom-right {
-      .esri-popup__content {
-        max-height: #{$contentHeight}px;
-      }
-    }
-  }
-}
-
 @mixin popupHeight_BasedOnViewSize($height) {
   $pageMenuHeight: $height - 50;
   .esri-popup__main-container {
@@ -79,129 +55,6 @@
   word-break: break-word;
 }
 
-@mixin measurementWidgetStyles($selector) {
-  .#{$selector} {
-    &__container {
-      position: relative;
-      padding: $cap-spacing 0;
-      overflow-y: auto;
-      a {
-        text-decoration: none;
-      }
-    }
-
-    &__header {
-      position: relative;
-      font-size: $font-size__body;
-      align-items: flex-start;
-      justify-content: space-between;
-      display: flex;
-      flex: 0 0 auto;
-    }
-
-    &__header-title,
-    h1 &__header-title {
-      font: {
-        size: $font-size__header-text;
-        weight: $font-weight--bold;
-      }
-      padding: 8px 0;
-      margin: 0;
-      display: block;
-      flex: 1;
-      word-break: break-word;
-      text-align: left;
-    }
-
-    &__panel--error {
-      color: $font-color--error;
-      padding: 0 $side-spacing;
-      animation: esri-fade-in 250ms ease-in-out;
-    }
-
-    &__hint {
-      padding: 0 $side-spacing;
-      animation: esri-fade-in 250ms ease-in-out;
-
-      &-text {
-        margin: $cap-spacing 0;
-        padding: 0;
-      }
-    }
-
-    &__measurement {
-      padding: $cap-spacing $side-spacing;
-      margin: $cap-spacing 0;
-      background-color: $background-color--offset;
-      animation: esri-fade-in 250ms ease-in-out;
-
-      &-item {
-        display: flex;
-        padding-bottom: $cap-spacing;
-        flex-flow: column;
-
-        &--disabled {
-          display: flex;
-          color: rgba($font-color, $opacity--disabled);
-        }
-
-        &-title {
-          padding-bottom: $cap-spacing--quarter;
-        }
-
-        &-value {
-          font-weight: $font-weight--bold;
-        }
-      }
-    }
-
-    &__settings {
-      display: flex;
-      justify-content: space-between;
-      padding: $cap-spacing--half $side-spacing;
-    }
-
-    &__units {
-      display: flex;
-      flex: 0 1 48%;
-      flex-flow: column;
-      padding: 0;
-      animation: esri-fade-in 250ms ease-in-out;
-      &:only-child {
-        flex: 1 0 100%;
-      }
-    }
-
-    &__units-select {
-      width: 100%;
-      padding: {
-        left: 0.5em;
-        right: 2.7em;
-      }
-
-      &-wrapper {
-        width: 100%;
-      }
-    }
-
-    &__actions {
-      display: flex;
-      flex-flow: column;
-      justify-content: center;
-      padding: 0 $side-spacing;
-    }
-  }
-
-  [dir="rtl"] {
-    .#{$selector}__units-select {
-      padding: {
-        left: 2.7em;
-        right: 0.5em;
-      }
-    }
-  }
-}
-
 // Smart Mapping Sliders
 @mixin smartMappingSlider($class) {
   .#{$class} {

package/assets/esri/themes/base/widgets/_AreaMeasurement2D.scss

@@ -1,12 +1,4 @@
 @mixin areaMeasurement2D() {
-  .esri-area-measurement-2d__measurement {
-    padding: $cap-spacing $side-spacing;
-    margin: $cap-spacing 0;
-    background-color: $background-color--offset;
-    animation: esri-fade-in 250ms ease-in-out;
-  }
-
-  @include measurementWidgetStyles("esri-area-measurement-2d");
 }
 
 @if $include_AreaMeasurement2D == true {

package/assets/esri/themes/base/widgets/_AreaMeasurement3D.scss

@@ -1,12 +1,4 @@
 @mixin areaMeasurement3D() {
-  .esri-area-measurement-3d__measurement {
-    padding: $cap-spacing $side-spacing;
-    margin: $cap-spacing 0;
-    background-color: $background-color--offset;
-    animation: esri-fade-in 250ms ease-in-out;
-  }
-
-  @include measurementWidgetStyles("esri-area-measurement-3d");
 }
 
 @if $include_AreaMeasurement3D == true {

package/assets/esri/themes/base/widgets/_DirectLineMeasurement3D.scss

@@ -1,5 +1,4 @@
 @mixin directLineMeasurement3D() {
-  @include measurementWidgetStyles("esri-direct-line-measurement-3d");
 }
 
 @if $include_DirectLineMeasurement3D == true {

package/assets/esri/themes/base/widgets/_DistanceMeasurement2D.scss

@@ -1,5 +1,4 @@
 @mixin distanceMeasurement2D() {
-  @include measurementWidgetStyles("esri-distance-measurement-2d");
 }
 
 @if $include_DistanceMeasurement2D == true {

package/assets/esri/themes/base/widgets/_MeasurementWidgetContent.scss

@@ -0,0 +1,67 @@
+@mixin measurementWidgetContent() {
+  $animation: esri-fade-in 250ms ease-in-out;
+
+  .esri-measurement-widget-content {
+    display: flex;
+    position: relative;
+    flex-direction: column;
+    gap: $cap-spacing;
+    padding: var(--esri-widget-padding-y) var(--esri-widget-padding-x);
+    overflow-y: auto;
+
+    &__error {
+      color: $font-color--error;
+    }
+
+    &__hint {
+      display: flex;
+      flex-direction: column;
+      gap: $cap-spacing;
+    }
+
+    &__error,
+    &__hint {
+      animation: $animation;
+      overflow: hidden;
+
+      p {
+        margin: 0;
+        padding: 0;
+      }
+    }
+
+    &__measurement {
+      display: flex;
+      flex-direction: column;
+      gap: $cap-spacing;
+      padding: $cap-spacing $side-spacing;
+      margin: 0 calc(var(--esri-widget-padding-x) * -1);
+      background-color: var(--calcite-ui-foreground-3);
+      animation: $animation;
+
+      &-item {
+        display: flex;
+        flex-flow: column;
+        gap: $cap-spacing--quarter;
+
+        &--disabled {
+          color: rgba($font-color, $opacity--disabled);
+        }
+
+        &__value {
+          font-weight: $font-weight--bold;
+        }
+      }
+    }
+
+    &__actions {
+      display: flex;
+      flex-flow: column;
+      justify-content: center;
+    }
+  }
+}
+
+@if $include_MeasurementWidgetContent == true {
+  @include measurementWidgetContent();
+}

package/assets/esri/themes/base/widgets/_Slice.scss

@@ -1,76 +1,39 @@
 @mixin slice() {
   .esri-slice {
-    flex-shrink: 0;
-
     &__container {
+      display: flex;
       position: relative;
-      padding: $cap-spacing 0;
+      flex-direction: column;
+      gap: $cap-spacing;
+      padding: var(--esri-widget-padding-y) var(--esri-widget-padding-x);
       overflow-y: auto;
-      a {
-        text-decoration: none;
-      }
-    }
-
-    &__hint {
-      padding: 0 $side-spacing;
-      animation: esri-fade-in 250ms ease-in-out;
     }
 
-    &__hint-text {
-      margin: $cap-spacing 0;
-      padding: 0;
-    }
-
-    &__exclude-button {
-      margin-bottom: $cap-spacing;
-    }
-
-    &__settings {
-      ul {
-        display: flex;
-        flex-direction: column;
-        padding: 0;
-        margin: 0;
-      }
-
-      li {
-        list-style: none;
-      }
-
-      padding: $cap-spacing--half $side-spacing $cap-spacing $side-spacing;
-      animation: esri-fade-in 250ms ease-in-out;
+    &__error {
+      color: $font-color--error;
     }
 
-    &__layer-item {
+    &__hint {
       display: flex;
-      align-items: center;
-      white-space: nowrap;
-      gap: $side-spacing--half;
-
-      &__title {
-        flex-grow: 1;
-        overflow: hidden;
-        text-overflow: ellipsis;
-        white-space: nowrap;
-      }
+      flex-direction: column;
+      gap: $cap-spacing;
     }
 
-    &__cross {
-      color: inherit;
-      position: relative;
-    }
-
-    &__panel--error {
-      color: $font-color--error;
-      padding: 0 $side-spacing;
+    &__error,
+    &__hint {
       animation: esri-fade-in 250ms ease-in-out;
+      overflow: hidden;
+      p {
+        margin: 0;
+        padding: 0;
+      }
     }
 
     &__actions {
       display: flex;
       flex-flow: column;
+      gap: $cap-spacing--half;
       justify-content: center;
-      padding: 0 $side-spacing;
     }
   }
 }

package/assets/esri/themes/base/widgets/_UnitSelect.scss

@@ -0,0 +1,14 @@
+@mixin unitSelect() {
+  .esri-unit-select {
+    width: 100%;
+
+    &__label {
+      --calcite-label-margin-bottom: 0;
+      width: 100%;
+    }
+  }
+}
+
+@if $include_UnitSelect == true {
+  @include unitSelect();
+}