@esri/calcite-components 1.4.0-next.15 → 1.4.0-next.17

package/dist/collection/components/modal/modal.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.4.0-next.15
+ * v1.4.0-next.17
  */
 import { h, Host } from "@stencil/core";
 import { connectConditionalSlotComponent, disconnectConditionalSlotComponent } from "../../utils/conditionalSlot";

package/dist/collection/components/modal/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.4.0-next.15
+ * v1.4.0-next.17
  */
 export const CSS = {
   modal: "modal",

package/dist/collection/components/notice/notice.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.4.0-next.15
+ * v1.4.0-next.17
  */
 import { h } from "@stencil/core";
 import { connectConditionalSlotComponent, disconnectConditionalSlotComponent } from "../../utils/conditionalSlot";

package/dist/collection/components/notice/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.4.0-next.15
+ * v1.4.0-next.17
  */
 export const SLOTS = {
   title: "title",

package/dist/collection/components/option/option.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.4.0-next.15
+ * v1.4.0-next.17
  */
 import { h } from "@stencil/core";
 import { createObserver } from "../../utils/observers";

package/dist/collection/components/option-group/option-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.4.0-next.15
+ * v1.4.0-next.17
  */
 import { Fragment, h } from "@stencil/core";
 /**

package/dist/collection/components/pagination/pagination.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.4.0-next.15
+ * v1.4.0-next.17
  */
 import { Fragment, h } from "@stencil/core";
 import { componentLoaded, setComponentLoaded, setUpLoadableComponent } from "../../utils/loadable";

package/dist/collection/components/pagination/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.4.0-next.15
+ * v1.4.0-next.17
  */
 export const CSS = {
   page: "page",

package/dist/collection/components/panel/panel.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.4.0-next.15
+ * v1.4.0-next.17
  */
 import { Fragment, h } from "@stencil/core";
 import { focusFirstTabbable, slotChangeGetAssignedElements, toAriaBoolean } from "../../utils/dom";

package/dist/collection/components/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.4.0-next.15
+ * v1.4.0-next.17
  */
 export const CSS = {
   actionBarContainer: "action-bar-container",

package/dist/collection/components/pick-list/pick-list.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.4.0-next.15
+ * v1.4.0-next.17
  */
 import { h } from "@stencil/core";
 import { updateHostInteraction } from "../../utils/interactive";

package/dist/collection/components/pick-list/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.4.0-next.15
+ * v1.4.0-next.17
  */
 export const CSS = {
   sticky: "sticky-pos"

package/dist/collection/components/pick-list/shared-list-logic.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.4.0-next.15
+ * v1.4.0-next.17
  */
 import { debounce } from "lodash-es";
 import { getRoundRobinIndex } from "../../utils/array";

package/dist/collection/components/pick-list/shared-list-render.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.4.0-next.15
+ * v1.4.0-next.17
  */
 import { h, Host } from "@stencil/core";
 import { toAriaBoolean } from "../../utils/dom";

package/dist/collection/components/pick-list-group/pick-list-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.4.0-next.15
+ * v1.4.0-next.17
  */
 import { Fragment, h } from "@stencil/core";
 import { connectConditionalSlotComponent, disconnectConditionalSlotComponent } from "../../utils/conditionalSlot";

package/dist/collection/components/pick-list-group/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.4.0-next.15
+ * v1.4.0-next.17
  */
 export const CSS = {
   heading: "heading",

package/dist/collection/components/pick-list-item/pick-list-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.4.0-next.15
+ * v1.4.0-next.17
  */
 import { Fragment, h } from "@stencil/core";
 import { connectConditionalSlotComponent, disconnectConditionalSlotComponent } from "../../utils/conditionalSlot";

package/dist/collection/components/pick-list-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.4.0-next.15
+ * v1.4.0-next.17
  */
 export const CSS = {
   actions: "actions",

package/dist/collection/components/popover/PopoverManager.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.4.0-next.15
+ * v1.4.0-next.17
  */
 import { isPrimaryPointerButton } from "../../utils/dom";
 import { isActivationKey } from "../../utils/key";

package/dist/collection/components/popover/popover.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.4.0-next.15
+ * v1.4.0-next.17
  */
 import { forceUpdate, h, Host } from "@stencil/core";
 import { connectFloatingUI, defaultOffsetDistance, disconnectFloatingUI, filterComputedPlacements, FloatingCSS, reposition } from "../../utils/floating-ui";

package/dist/collection/components/popover/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.4.0-next.15
+ * v1.4.0-next.17
  */
 export const CSS = {
   container: "container",

package/dist/collection/components/progress/progress.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.4.0-next.15
+ * v1.4.0-next.17
  */
 import { h } from "@stencil/core";
 export class Progress {

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.4.0-next.15
+ * v1.4.0-next.17
  */
 import { h, Host } from "@stencil/core";
 import { getRoundRobinIndex } from "../../utils/array";

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.4.0-next.15
+ * v1.4.0-next.17
  */
 export const CSS = {
   container: "container"

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.4.0-next.15
+ * v1.4.0-next.17
  */
 import { h, Host } from "@stencil/core";
 import { createObserver } from "../../utils/observers";

package/dist/collection/components/rating/function/star.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.4.0-next.15
+ * v1.4.0-next.17
  */
 import { h } from "@stencil/core";
 export const StarIcon = ({ full, scale, partial }) => (h("calcite-icon", { ...{

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.4.0-next.15
+ * v1.4.0-next.17
  */
 import { h, Host } from "@stencil/core";
 import { connectForm, disconnectForm, HiddenFormInputSlot } from "../../utils/form";

package/dist/collection/components/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.4.0-next.15
+ * v1.4.0-next.17
  */
 export var KindIcons;
 (function (KindIcons) {

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.4.0-next.15
+ * v1.4.0-next.17
  */
 export const CSS = {
   scrim: "scrim",

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.4.0-next.15
+ * v1.4.0-next.17
  */
 import { h } from "@stencil/core";
 import { connectLocalized, disconnectLocalized } from "../../utils/locale";

package/dist/collection/components/segmented-control/segmented-control.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.4.0-next.15
+ * v1.4.0-next.17
  */
 import { Build, h, Host } from "@stencil/core";
 import { getElementDir } from "../../utils/dom";

package/dist/collection/components/segmented-control-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.4.0-next.15
+ * v1.4.0-next.17
  */
 export const SLOTS = {
   input: "input"

package/dist/collection/components/segmented-control-item/segmented-control-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.4.0-next.15
+ * v1.4.0-next.17
  */
 import { h, Host } from "@stencil/core";
 import { getElementProp, toAriaBoolean } from "../../utils/dom";

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.4.0-next.15
+ * v1.4.0-next.17
  */
 export const CSS = {
   icon: "icon",

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.4.0-next.15
+ * v1.4.0-next.17
  */
 import { Fragment, h } 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.4.0-next.15
+ * v1.4.0-next.17
  */
 export const CSS = {
   main: "main",

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.4.0-next.15
+ * v1.4.0-next.17
  */
 import { Fragment, h } from "@stencil/core";
 import { connectConditionalSlotComponent, disconnectConditionalSlotComponent } from "../../utils/conditionalSlot";

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.4.0-next.15
+ * v1.4.0-next.17
  */
 export const CSS = {
   actionBarContainer: "action-bar-container",

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.4.0-next.15
+ * v1.4.0-next.17
  */
 import { Fragment, h } from "@stencil/core";
 import { connectConditionalSlotComponent, disconnectConditionalSlotComponent } from "../../utils/conditionalSlot";

package/dist/collection/components/shell-panel/resources.js

@@ -1,14 +1,15 @@
 /*!
  * All material copyright ESRI, All Rights Reserved, unless otherwise specified.
  * See https://github.com/Esri/calcite-components/blob/master/LICENSE.md for details.
- * v1.4.0-next.15
+ * v1.4.0-next.17
  */
 export const CSS = {
   container: "container",
   content: "content",
   contentHeader: "content__header",
   contentBody: "content__body",
-  contentDetached: "content--detached",
+  contentFloat: "content--float",
+  contentOverlay: "content--overlay",
   separator: "separator"
 };
 export const SLOTS = {

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

@@ -121,10 +121,10 @@
 * @prop --calcite-shell-panel-width: Specifies the width of the component.
 * @prop --calcite-shell-panel-max-width: Specifies the maximum width of the component.
 * @prop --calcite-shell-panel-min-width: Specifies the minimum width of the component.
-* @prop --calcite-shell-panel-height: When `layout` is `"horizontal"`, specifies the height of the component.
-* @prop --calcite-shell-panel-max-height: When `layout` is `"horizontal"`, specifies the maximum height of the component.
-* @prop --calcite-shell-panel-min-height: When `layout` is `"horizontal"`, specifies the minimum height of the component.
-* @prop --calcite-shell-panel-detached-max-height: When `detached` is `true`, specifies the maximum height of the component.
+* @prop --calcite-shell-panel-height: When `layout` is `horizontal`, or `layout` is `vertical` and `displayMode` is `float`, specifies the height of the component.
+* @prop --calcite-shell-panel-max-height: When `layout` is `horizontal`, or `layout` is `vertical` and `displayMode` is `float`, specifies the maximum height of the component.
+* @prop --calcite-shell-panel-min-height: When `layout` is `horizontal`, or `layout` is `vertical` and `displayMode` is `float`, specifies the minimum height of the component.
+* @prop [Deprecated] --calcite-shell-panel-detached-max-height: When `displayMode` is `float`, specifies the maximum height of the component.
 * @prop --calcite-shell-panel-z-index: Specifies the z-index value for the component.
 *
 */
@@ -134,18 +134,32 @@
   display: flex;
   flex: 0 1 auto;
   align-items: stretch;
-  --calcite-shell-panel-detached-max-height: unset;
   z-index: var(--calcite-shell-panel-z-index, var(--calcite-app-z-index));
+  --calcite-shell-panel-detached-max-height: unset;
+  --calcite-shell-panel-max-height: unset;
+  --calcite-shell-panel-shadow-block-start-internal: 0 4px 8px -1px rgba(0, 0, 0, 0.08),
+    0 2px 4px -1px rgba(0, 0, 0, 0.04);
+  --calcite-shell-panel-shadow-block-end-internal: 0 -4px 8px -1px rgba(0, 0, 0, 0.08),
+    0 -2px 4px -1px rgba(0, 0, 0, 0.04);
+  --calcite-shell-panel-shadow-inline-start-internal: 4px 0 8px -1px rgba(0, 0, 0, 0.08),
+    2px 0 4px -1px rgba(0, 0, 0, 0.04);
+  --calcite-shell-panel-shadow-inline-end-internal: -4px 0 8px -1px rgba(0, 0, 0, 0.08),
+    -2px 0 4px -1px rgba(0, 0, 0, 0.04);
+}
+
+.calcite--rtl.content--overlay {
+  --calcite-shell-panel-shadow-inline-start-internal: -4px 0 8px -1px rgba(0, 0, 0, 0.08),
+    -2px 0 4px -1px rgba(0, 0, 0, 0.04);
+  --calcite-shell-panel-shadow-inline-end-internal: 4px 0 8px -1px rgba(0, 0, 0, 0.08),
+    2px 0 4px -1px rgba(0, 0, 0, 0.04);
 }
 
 :host([layout=vertical]) {
   z-index: var(--calcite-shell-panel-z-index, calc(var(--calcite-app-z-index) + 1));
 }
 
-:host([layout=horizontal]) .content {
-  --calcite-shell-panel-height-internal: var(--calcite-shell-panel-height, 20vh);
-  --calcite-shell-panel-max-height-internal: var(--calcite-shell-panel-max-height, 420px);
-  --calcite-shell-panel-min-height-internal: var(--calcite-shell-panel-min-height, 240px);
+:host([layout=vertical][display-mode=overlay]) {
+  z-index: var(--calcite-shell-panel-z-index, calc(var(--calcite-app-z-index-header) + 1));
 }
 
 :host([layout=vertical][width-scale=s]) .content {
@@ -166,16 +180,26 @@
   --calcite-shell-panel-min-width-internal: var(--calcite-shell-panel-min-width, 340px);
 }
 
-:host([detached-height-scale=s]) .content--detached {
-  --calcite-shell-panel-detached-max-height-internal: var(--calcite-shell-panel-detached-max-height, 40vh);
+:host([layout=horizontal][height-scale=s]) .content {
+  --calcite-shell-panel-max-height-internal: var(
+    --calcite-shell-panel-max-height,
+    var(--calcite-shell-panel-detached-max-height, 20vh)
+  );
 }
 
-:host([detached-height-scale=m]) .content--detached {
-  --calcite-shell-panel-detached-max-height-internal: var(--calcite-shell-panel-detached-max-height, 60vh);
+:host([layout=horizontal]) .content {
+  --calcite-shell-panel-min-height-internal: var(--calcite-shell-panel-min-height, 5vh);
+  --calcite-shell-panel-max-height-internal: var(
+    --calcite-shell-panel-max-height,
+    var(--calcite-shell-panel-detached-max-height, 30vh)
+  );
 }
 
-:host([detached-height-scale=l]) .content--detached {
-  --calcite-shell-panel-detached-max-height-internal: var(--calcite-shell-panel-detached-max-height, 80vh);
+:host([layout=horizontal][height-scale=l]) .content {
+  --calcite-shell-panel-max-height-internal: var(
+    --calcite-shell-panel-max-height,
+    var(--calcite-shell-panel-detached-max-height, 40vh)
+  );
 }
 
 .container {
@@ -313,7 +337,44 @@
   overflow: hidden;
 }
 
-.content--detached {
+.content--overlay {
+  position: absolute;
+  --tw-shadow: 0 4px 8px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.04);
+  --tw-shadow-colored: 0 4px 8px -1px var(--tw-shadow-color), 0 2px 4px -1px var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+
+:host([layout=vertical]) .content--overlay {
+  inset-block-start: 0px;
+  block-size: 100%;
+}
+
+:host([layout=horizontal]) .content--overlay {
+  inset-inline-start: 0px;
+  inline-size: 100%;
+}
+
+:host([layout=vertical][position=start]) .content--overlay {
+  inset-inline-start: 100%;
+  box-shadow: var(--calcite-shell-panel-shadow-inline-start-internal);
+}
+
+:host([layout=vertical][position=end]) .content--overlay {
+  inset-inline-end: 100%;
+  box-shadow: var(--calcite-shell-panel-shadow-inline-end-internal);
+}
+
+:host([layout=horizontal][position=start]) .content--overlay {
+  inset-block-start: 100%;
+  box-shadow: var(--calcite-shell-panel-shadow-block-start-internal);
+}
+
+:host([layout=horizontal][position=end]) .content--overlay {
+  inset-block-end: 100%;
+  box-shadow: var(--calcite-shell-panel-shadow-block-end-internal);
+}
+
+.content--float {
   margin-inline: 0.5rem;
   margin-block: 0.5rem auto;
   block-size: auto;
@@ -322,17 +383,21 @@
   --tw-shadow: 0 4px 8px -1px rgba(0, 0, 0, 0.08), 0 2px 4px -1px rgba(0, 0, 0, 0.04);
   --tw-shadow-colored: 0 4px 8px -1px var(--tw-shadow-color), 0 2px 4px -1px var(--tw-shadow-color);
   box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
-  max-block-size: var(--calcite-shell-panel-detached-max-height-internal);
+  max-block-size: var(--calcite-shell-panel-max-height-internal, calc(100% - 1rem));
 }
-.content--detached ::slotted(calcite-panel),
-.content--detached ::slotted(calcite-flow) {
+.content--float ::slotted(calcite-panel),
+.content--float ::slotted(calcite-flow) {
   max-block-size: unset;
 }
 
-:host([position=start]) .content--detached ::slotted(calcite-panel),
-:host([position=start]) .content--detached ::slotted(calcite-flow),
-:host([position=end]) .content--detached ::slotted(calcite-panel),
-:host([position=end]) .content--detached ::slotted(calcite-flow) {
+:host([layout=horizontal]) .content--float {
+  margin-block: 0.5rem;
+}
+
+:host([position=start]) .content--float ::slotted(calcite-panel),
+:host([position=start]) .content--float ::slotted(calcite-flow),
+:host([position=end]) .content--float ::slotted(calcite-panel),
+:host([position=end]) .content--float ::slotted(calcite-flow) {
   border-style: none;
 }