@gooddata/sdk-ui-dashboard 10.33.0-alpha.5 → 10.33.0-alpha.51

package/styles/css/main.css

@@ -886,8 +886,8 @@
 /* allow vendor prefixes and disable max length */
 @font-face {
   font-family: "Indigo";
-  src: url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot");
-  src: url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot?#iefix") format("embedded-opentype"), url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.woff") format("woff"), url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.ttf") format("truetype"), url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.svg#Indigo-v2") format("svg");
+  src: url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot");
+  src: url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot?#iefix") format("embedded-opentype"), url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.woff") format("woff"), url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.ttf") format("truetype"), url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.svg#Indigo-v2") format("svg");
   font-weight: normal;
   font-style: normal;
 }
@@ -3072,8 +3072,8 @@ button.gd-list-item {
 }
 @font-face {
   font-family: "Indigo";
-  src: url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot");
-  src: url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot?#iefix") format("embedded-opentype"), url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.woff") format("woff"), url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.ttf") format("truetype"), url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.svg#Indigo-v2") format("svg");
+  src: url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot");
+  src: url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot?#iefix") format("embedded-opentype"), url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.woff") format("woff"), url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.ttf") format("truetype"), url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.svg#Indigo-v2") format("svg");
   font-weight: normal;
   font-style: normal;
 }
@@ -5666,7 +5666,7 @@ a.gd-button-link:hover .gd-button-text, a.gd-button-link-dimmed:hover .gd-button
 
 .gd-spinner {
   display: inline-block;
-  background-image: url("~@gooddata/sdk-ui-kit/esm/assets/loading.svg");
+  background-image: url("@gooddata/sdk-ui-kit/esm/assets/loading.svg");
   background-repeat: no-repeat;
   background-position: top left;
   background-size: contain;
@@ -7147,8 +7147,8 @@ div.gd-empty-item-bubble {
 
 @font-face {
   font-family: "Indigo";
-  src: url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot");
-  src: url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot?#iefix") format("embedded-opentype"), url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.woff") format("woff"), url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.ttf") format("truetype"), url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.svg#Indigo-v2") format("svg");
+  src: url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot");
+  src: url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot?#iefix") format("embedded-opentype"), url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.woff") format("woff"), url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.ttf") format("truetype"), url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.svg#Indigo-v2") format("svg");
   font-weight: normal;
   font-style: normal;
 }
@@ -14076,8 +14076,8 @@ input[type=search]::-webkit-search-cancel-button {
 }
 @font-face {
   font-family: "Indigo";
-  src: url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot");
-  src: url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot?#iefix") format("embedded-opentype"), url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.woff") format("woff"), url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.ttf") format("truetype"), url("~@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.svg#Indigo-v2") format("svg");
+  src: url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot");
+  src: url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.eot?#iefix") format("embedded-opentype"), url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.woff") format("woff"), url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.ttf") format("truetype"), url("@gooddata/sdk-ui-kit/styles/fonts/Indigo-v2.svg#Indigo-v2") format("svg");
   font-weight: normal;
   font-style: normal;
 }
@@ -16670,7 +16670,7 @@ a.gd-button-link:hover .gd-button-text, a.gd-button-link-dimmed:hover .gd-button
 
 .gd-spinner {
   display: inline-block;
-  background-image: url("~@gooddata/sdk-ui-kit/esm/assets/loading.svg");
+  background-image: url("@gooddata/sdk-ui-kit/esm/assets/loading.svg");
   background-repeat: no-repeat;
   background-position: top left;
   background-size: contain;
@@ -17612,7 +17612,7 @@ div.gd-empty-item-bubble {
   content: "";
   width: 18px;
   height: 20px;
-  background-image: url("~@gooddata/sdk-ui-kit/styles/icons/attribute.svg");
+  background-image: url("@gooddata/sdk-ui-kit/styles/icons/attribute.svg");
   background-repeat: no-repeat;
   background-position: left center;
   background-size: contain;
@@ -17622,7 +17622,7 @@ div.gd-empty-item-bubble {
   content: "";
   width: 18px;
   height: 20px;
-  background-image: url("~@gooddata/sdk-ui-kit/styles/icons/date.svg");
+  background-image: url("@gooddata/sdk-ui-kit/styles/icons/date.svg");
   background-repeat: no-repeat;
   background-position: left center;
   background-size: contain;
@@ -17653,7 +17653,7 @@ div.gd-empty-item-bubble {
   content: "";
   width: 16px;
   height: 16px;
-  background-image: url("~@gooddata/sdk-ui-ext/esm/internal/assets/icons/attribute-hierarchy.svg");
+  background-image: url("@gooddata/sdk-ui-ext/esm/internal/assets/icons/attribute-hierarchy.svg");
   background-size: 16px 16px;
   background-repeat: no-repeat;
 }
@@ -19162,17 +19162,33 @@ figure {
 .gd-notifications-channels-attachments .gd-attachment-list {
   display: flex;
   flex-direction: row;
-  align-items: end;
+  align-items: center;
   flex: 1;
   overflow: hidden;
   margin: -2px 0;
   flex-wrap: wrap;
+  gap: 5px;
+  scroll-margin-bottom: 40px;
 }
 @media only screen and (max-width: 640px) {
   .gd-notifications-channels-attachments .gd-attachment-list {
     max-width: none;
   }
 }
+.gd-notifications-channels-attachments .gd-attachment-list-old {
+  display: flex;
+  flex-direction: row;
+  align-items: end;
+  flex: 1;
+  overflow: hidden;
+  margin: -2px 0;
+  flex-wrap: wrap;
+}
+@media only screen and (max-width: 640px) {
+  .gd-notifications-channels-attachments .gd-attachment-list-old {
+    max-width: none;
+  }
+}
 .gd-notifications-channels-attachments .gd-attachment-list-message {
   display: flex;
   flex-basis: 100%;
@@ -19315,6 +19331,7 @@ figure {
   display: flex;
   flex-direction: column;
   padding: 15px 10px;
+  gap: var(--gd-spacing-10px);
 }
 .gd-attachment-settings-dropdown .gd-attachment-settings-dropdown-footer {
   display: flex;
@@ -19424,7 +19441,7 @@ figure {
   height: 50px;
   border: none;
   cursor: pointer;
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/ellipsis.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/ellipsis.svg");
   background-color: transparent;
   background-position: center center;
 }
@@ -19815,6 +19832,75 @@ figure {
   min-width: unset;
 }
 
+.gd-attachment-type-label {
+  display: inline-flex;
+  gap: var(--gd-spacing-10px);
+  align-items: center;
+  margin-inline-start: 5px;
+}
+
+.gd-attachment-types-content {
+  padding: var(--gd-spacing-10px);
+}
+
+.gd-attachment-type-item {
+  padding: 3px 0;
+  font-size: 12px;
+}
+
+.gd-attachment-chip {
+  height: 27px;
+  max-width: 245px;
+  display: inline-flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
+  box-sizing: border-box;
+  position: relative;
+  border-radius: 20px;
+  padding-left: var(--gd-spacing-10px);
+  font-size: 12px;
+  border: 1px solid var(--gd-palette-complementary-4);
+  background-color: var(--gd-palette-complementary-0);
+  color: var(--gd-palette-complementary-7);
+}
+.gd-attachment-chip:has(.gd-attachment-chip-delete:hover) {
+  background-color: var(--gd-palette-error-dimmed);
+  color: var(--gd-palette-error-base);
+  border: 1px solid var(--gd-palette-error-base-t85);
+}
+
+.gd-attachment-chip-label {
+  display: inline-flex;
+  gap: var(--gd-spacing-5px);
+  align-items: center;
+}
+
+.gd-attachment-chip-button {
+  background: none;
+  border: none;
+  padding: 0;
+  font: inherit;
+  cursor: pointer;
+  color: var(--gd-palette-complementary-6);
+  display: grid;
+  place-items: center;
+  width: 27px;
+  height: 100%;
+}
+.gd-attachment-chip-button:hover {
+  color: var(--gd-palette-complementary-8);
+}
+
+.gd-attachment-chip-delete:hover {
+  color: var(--gd-palette-error-base);
+}
+
+.gd-attachment-list-error {
+  color: var(--gd-palette-error-base);
+  font-size: 12px;
+}
+
 .gd-recipients-container.gd-input-component--invalid .gd-recipients__control {
   border-color: var(--gd-palette-error-base, #e54d42);
 }
@@ -20662,7 +20748,7 @@ figure {
 }
 
 .dash-item-action.dash-item-action-alert.disabled {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/alert-bell-na.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/alert-bell-na.svg");
   background-repeat: no-repeat;
   background-position: center;
   background-size: 16px;
@@ -20765,7 +20851,7 @@ figure {
   background-color: var(--gd-palette-primary-base, #14b2e2);
 }
 .dash-item-action-delete.gd-icon-trash::before {
-  content: url("~@gooddata/sdk-ui-dashboard/esm/assets/trash.svg");
+  content: url("@gooddata/sdk-ui-dashboard/esm/assets/trash.svg");
   display: inline-block;
   width: 20px;
   height: 20px;
@@ -20916,6 +21002,9 @@ figure {
   bottom: 0;
   right: 0;
 }
+.insight-view-loader.is-invisible {
+  visibility: hidden;
+}
 
 .bubble.options-menu-bubble {
   background-color: #fff;
@@ -20956,6 +21045,9 @@ figure {
 .gd-grid-layout .dash-item .is-dragging-widget.dash-item-content {
   border-color: var(--gd-palette-complementary-2, #ebeff4);
 }
+.gd-grid-layout .dash-item.gd-dashboard-nested-layout-widget .gd-dashboard-nested-layout-widget {
+  padding: 10px 0 0 0;
+}
 .gd-grid-layout .dash-item:not(.gd-dashboard-nested-layout-widget):not(.gd-first-container-row-widget):not(.drag-info-placeholder) {
   padding: 10px 0;
 }
@@ -21122,49 +21214,50 @@ figure {
 
 .add-kpi-placeholder::before,
 .move-kpi-placeholder::before {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/add-kpi-placeholder.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/add-kpi-placeholder.svg");
 }
 
-.add-attribute-filter-placeholder::before {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/add-attribute-filter-placeholder.svg");
+.add-attribute-filter-placeholder.disabled::before {
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/add-attribute-filter-placeholder-disabled.svg");
 }
-.add-attribute-filter-placeholder::before:disabled {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/add-attribute-filter-placeholder-disabled.svg");
+
+.add-attribute-filter-placeholder::before {
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/add-attribute-filter-placeholder.svg");
 }
 
-.dropzone {
+.gd-fluid-layout .dropzone {
   z-index: 99;
 }
-.dropzone.next, .dropzone.prev {
+.gd-fluid-layout .dropzone.next, .gd-fluid-layout .dropzone.prev {
   position: absolute;
   top: 0;
   bottom: 0;
   width: 50%;
 }
-.dropzone.next {
+.gd-fluid-layout .dropzone.next {
   right: 0;
 }
-.dropzone.next .drop-hint {
+.gd-fluid-layout .dropzone.next .drop-hint {
   float: right;
   margin-left: 3px;
 }
-.dropzone.next.full {
+.gd-fluid-layout .dropzone.next.full {
   width: 100%;
 }
-.dropzone.prev {
+.gd-fluid-layout .dropzone.prev {
   left: 0;
 }
-.dropzone.prev .drop-hint {
+.gd-fluid-layout .dropzone.prev .drop-hint {
   float: left;
   margin-left: -3px;
 }
-.dropzone.prev.full {
+.gd-fluid-layout .dropzone.prev.full {
   width: 100%;
 }
-.dropzone.hidden {
+.gd-fluid-layout .dropzone.hidden {
   display: none;
 }
-.dropzone.extended {
+.gd-fluid-layout .dropzone.extended {
   width: 100%;
 }
 
@@ -21331,7 +21424,7 @@ figure {
   color: var(--gd-palette-complementary-6, #94a1ad);
 }
 .drag-info-placeholder-box .gd-icon-insight::before {
-  content: url("~@gooddata/sdk-ui-dashboard/esm/assets/add-insight-placeholder.svg");
+  content: url("@gooddata/sdk-ui-dashboard/esm/assets/add-insight-placeholder.svg");
   display: inline-block;
   margin-right: 10px;
 }
@@ -21433,7 +21526,7 @@ figure {
   cursor: pointer;
 }
 .kpi-placeholder.select-measure {
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/dummy-kpi-simple.svg") no-repeat center center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/dummy-kpi-simple.svg") no-repeat center center;
   background-size: 130px;
 }
 
@@ -21553,9 +21646,6 @@ figure {
   left: 10px;
   align-content: center;
 }
-.gd-grid-layout .dropzone.next .drop-hint {
-  float: unset;
-}
 .gd-grid-layout .row-hotspot-container .row-hotspot {
   top: -20px;
   right: unset;
@@ -23144,13 +23234,13 @@ figure {
 .gd-powered-by-logo-img-large {
   width: 165px;
   height: 30px;
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/powered-by-gd-large.svg?v=2022");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/powered-by-gd-large.svg?v=2022");
   background-size: 165px 30px;
 }
 .gd-powered-by-logo-img-small {
   width: 146px;
   height: 16px;
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/powered-by-gd-small.svg?v=2022");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/powered-by-gd-small.svg?v=2022");
   background-size: 146px 16px;
 }
 
@@ -24131,12 +24221,14 @@ figure {
   flex-direction: column;
   align-items: stretch;
   gap: 10px;
-  max-width: 240px;
+  max-width: 260px;
 }
 .gd-container-tooltip__image {
-  width: 100%;
-  aspect-ratio: 3/2;
-  background: fuchsia;
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/flexible-layouts-tooltip.gif");
+  background-repeat: no-repeat;
+  background-position: left top;
+  background-size: contain;
+  aspect-ratio: 44/27;
 }
 .gd-container-tooltip__actions {
   padding-top: 10px;
@@ -24177,7 +24269,7 @@ figure {
 .button-dropdown.gd-button-small.type-growIsGood::before,
 .dropdown-body .gd-list-item.type-growIsGood::before,
 .configuration-category label.type-growIsGood::before {
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/trend-positive.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/trend-positive.svg") no-repeat center;
 }
 .button-dropdown.gd-button-small.type-growIsGood.is-selected,
 .dropdown-body .gd-list-item.type-growIsGood.is-selected,
@@ -24197,7 +24289,7 @@ figure {
 .button-dropdown.gd-button-small.type-growIsBad::before,
 .dropdown-body .gd-list-item.type-growIsBad::before,
 .configuration-category label.type-growIsBad::before {
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/trend-negative.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/trend-negative.svg") no-repeat center;
 }
 .button-dropdown.gd-button-small.type-growIsBad.is-selected,
 .dropdown-body .gd-list-item.type-growIsBad.is-selected,
@@ -24212,23 +24304,23 @@ figure {
 .button-dropdown.gd-button-small.type-measure::before,
 .dropdown-body .gd-list-item.type-measure::before,
 .configuration-category label.type-measure::before {
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/measure.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/measure.svg") no-repeat center;
 }
 .button-dropdown.gd-button-small.type-metric::before,
 .dropdown-body .gd-list-item.type-metric::before,
 .configuration-category label.type-metric::before {
   margin-top: 0;
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/metric.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/metric.svg") no-repeat center;
 }
 .button-dropdown.gd-button-small.type-attribute::before,
 .dropdown-body .gd-list-item.type-attribute::before,
 .configuration-category label.type-attribute::before {
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/attribute.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/attribute.svg") no-repeat center;
 }
 .button-dropdown.gd-button-small.type-date::before,
 .dropdown-body .gd-list-item.type-date::before,
 .configuration-category label.type-date::before {
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/date-dropdown.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/date-dropdown.svg") no-repeat center;
 }
 .button-dropdown.gd-button-small.type-comparison::before,
 .dropdown-body .gd-list-item.type-comparison::before,
@@ -24244,65 +24336,73 @@ figure {
   left: 11px;
 }
 
-.gd-list-item .gd-icon-list::before {
+.gd-icon-list::before {
   content: "";
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/list.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/list.svg") no-repeat center;
   width: 16px;
   height: 16px;
   display: inline-block;
 }
-.gd-list-item .gd-icon-save-as-new::before {
+
+.gd-icon-save-as-new::before {
   content: "";
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/save-as-new.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/save-as-new.svg") no-repeat center;
   width: 16px;
   height: 16px;
   display: inline-block;
 }
-.gd-list-item .gd-icon-filter::before {
+
+.gd-icon-filter::before {
   content: "";
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/filter.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/filter.svg") no-repeat center;
   width: 16px;
   height: 16px;
   display: inline-block;
 }
-.gd-list-item .gd-icon-type-pdf::before {
+
+.gd-icon-type-pdf::before {
   content: "";
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/type-pdf.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/type-pdf.svg") no-repeat center;
   width: 16px;
   height: 16px;
   display: inline-block;
 }
-.gd-list-item .gd-icon-type-sheet::before {
+
+.gd-icon-type-sheet::before {
   content: "";
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/type-sheet.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/type-sheet.svg") no-repeat center;
   width: 16px;
   height: 16px;
   display: inline-block;
 }
-.gd-list-item .gd-icon-type-slides::before {
+
+.gd-icon-type-slides::before {
   content: "";
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/type-slides.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/type-slides.svg") no-repeat center;
   width: 16px;
   height: 16px;
   display: inline-block;
 }
-.gd-list-item .gd-icon-type-image::before {
+
+.gd-icon-type-image::before {
   content: "";
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/type-image.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/type-image.svg") no-repeat center;
   width: 16px;
   height: 16px;
   display: inline-block;
 }
-.gd-list-item .gd-icon-type-csv-raw::before {
+
+.gd-icon-type-csv-raw::before {
   content: "";
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/type-csv-raw.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/type-csv-raw.svg") no-repeat center;
   width: 16px;
   height: 16px;
   display: inline-block;
 }
-.gd-list-item .gd-icon-type-csv-formatted::before {
+
+.gd-icon-type-csv-formatted::before {
   content: "";
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/type-csv-formatted.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/type-csv-formatted.svg") no-repeat center;
   width: 16px;
   height: 16px;
   display: inline-block;
@@ -24716,7 +24816,7 @@ figure {
   display: block;
   width: 18px;
   height: 24px;
-  background: url("~@gooddata/sdk-ui-dashboard/esm/assets/date-dropdown.svg") no-repeat center;
+  background: url("@gooddata/sdk-ui-dashboard/esm/assets/date-dropdown.svg") no-repeat center;
 }
 
 .dash-width-resizer-container {
@@ -25142,7 +25242,7 @@ figure {
   display: block;
   width: 18px;
   height: 24px;
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/measure.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/measure.svg");
   background-repeat: no-repeat;
   background-position: left top;
   background-size: contain;
@@ -25154,20 +25254,20 @@ figure {
   background: var(--gd-palette-primary-dimmed, #e8f7fc);
 }
 .gd-drill-item-selector-dropdown .gd-drill-measure-selector-list-item::before {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/measure.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/measure.svg");
 }
 .gd-drill-item-selector-dropdown .gd-drill-metric-selector-list-item::before {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/metric.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/metric.svg");
   top: 8px;
   height: 18px;
 }
 .gd-drill-item-selector-dropdown .gd-drill-attribute-selector-list-item::before {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/attribute.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/attribute.svg");
 }
 .gd-drill-item-selector-dropdown .gd-drill-attribute-date-selector-list-item::before {
   top: 9px;
   height: 16px;
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/date-dropdown.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/date-dropdown.svg");
 }
 
 .drill-config-empty-hierarchy-target {
@@ -25240,7 +25340,7 @@ figure {
   display: block;
   width: 18px;
   height: 24px;
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/attribute-hierarchy.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/attribute-hierarchy.svg");
   background-repeat: no-repeat;
   background-position: left top;
   background-size: contain;
@@ -25272,16 +25372,16 @@ figure {
   background-repeat: no-repeat;
 }
 .gd-drill-config-measure-item .dm-button-icon-metric {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/metric.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/metric.svg");
 }
 .gd-drill-config-measure-item .dm-button-icon-measure {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/measure.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/measure.svg");
 }
 .gd-drill-config-measure-item .dm-button-icon-attribute {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/attribute.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/attribute.svg");
 }
 .gd-drill-config-measure-item .dm-button-icon-date {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/date-dropdown.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/date-dropdown.svg");
 }
 .gd-drill-config-measure-item .dm-button-title {
   overflow: hidden;
@@ -25421,21 +25521,21 @@ figure {
 }
 .gd-drill-config-panel-target .gd-icon-drill-to-dashboard::before,
 .drill-config-target .gd-icon-drill-to-dashboard::before {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/drill-to-dashboard.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/drill-to-dashboard.svg");
 }
 .gd-drill-config-panel-target .gd-icon-drill-to-insight::before,
 .drill-config-target .gd-icon-drill-to-insight::before {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/drill-to-insight.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/drill-to-insight.svg");
 }
 .gd-drill-config-panel-target .gd-icon-drill-down::before,
 .drill-config-target .gd-icon-drill-down::before {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/drill-down.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/drill-down.svg");
   background-repeat: no-repeat;
   top: 1px;
 }
 .gd-drill-config-panel-target .gd-icon-attribute-hierarchy::before,
 .drill-config-target .gd-icon-attribute-hierarchy::before {
-  background-image: url("~@gooddata/sdk-ui-dashboard/esm/assets/attribute-hierarchy.svg");
+  background-image: url("@gooddata/sdk-ui-dashboard/esm/assets/attribute-hierarchy.svg");
   background-repeat: no-repeat;
   top: 1px;
 }
@@ -26770,10 +26870,6 @@ figure {
   font-size: 18px;
 }
 
-.gd-nested-layout-widget-renderer .gd-nested-layout-hotspot.dropzone {
-  width: 50px;
-}
-
 .gd-dashboard-nested-layout-tab {
   display: none;
   width: auto;
@@ -26829,81 +26925,115 @@ figure {
 .gd-grid-layout .gd-empty-dashboard-dropzone .drag-info-placeholder {
   min-height: 300px;
 }
-.gd-grid-layout .gd-hotspot-border__container {
-  display: none;
+
+.gd-grid-layout-dropzone {
+  z-index: 99;
+}
+.gd-grid-layout-dropzone--type-prev, .gd-grid-layout-dropzone--type-next {
   position: absolute;
-  padding: 10px 0;
-  width: 10px;
-  height: 100%;
 }
-.gd-grid-layout .gd-first-container-row-dropzone .gd-hotspot-border__container {
-  padding-top: 0;
+.gd-grid-layout-dropzone--type-prev .drop-hint {
+  float: left;
+  margin-left: -3px;
+}
+.gd-grid-layout-dropzone--type-next .drop-hint {
+  float: right;
+  margin-left: 3px;
+}
+.gd-grid-layout-dropzone--hidden {
+  display: none;
 }
-.gd-grid-layout .gd-hotspot-border__drop-target {
+.gd-grid-layout-dropzone--direction-row.gd-grid-layout-dropzone--type-prev, .gd-grid-layout-dropzone--direction-row.gd-grid-layout-dropzone--type-next {
+  top: 0;
+  bottom: 0;
+  width: 50%;
+}
+.gd-grid-layout-dropzone--direction-row.gd-grid-layout-dropzone--type-prev.gd-grid-layout-dropzone--full, .gd-grid-layout-dropzone--direction-row.gd-grid-layout-dropzone--type-next.gd-grid-layout-dropzone--full {
   width: 100%;
-  height: 100%;
-  padding: 2px;
-  border: 1px dashed var(--gd-palette-primary-base, #14b2e2);
-  border-radius: 15px;
-  background-color: var(--gd-palette-primary-dimmed, #e8f7fc);
 }
-.gd-grid-layout .gd-hotspot-border__drop-target .drop-target-inner {
-  width: 4px;
-  height: 100%;
-  padding: 0;
-  border-radius: 2px;
-  background-color: var(--gd-palette-primary-base, #14b2e2);
+.gd-grid-layout-dropzone--direction-row.gd-grid-layout-dropzone--type-prev {
+  left: 0;
 }
-.gd-grid-layout .dropzone.prev.active .gd-hotspot-border__container {
+.gd-grid-layout-dropzone--direction-row.gd-grid-layout-dropzone--type-prev.gd-grid-layout-dropzone--active .gd-grid-layout-dropzone__drop-target--direction-row {
   left: -15px;
-  display: block;
 }
-.gd-grid-layout .dropzone.next.active .gd-hotspot-border__container {
+.gd-grid-layout-dropzone--direction-row.gd-grid-layout-dropzone--type-next {
+  right: 0;
+}
+.gd-grid-layout-dropzone--direction-row.gd-grid-layout-dropzone--type-next.gd-grid-layout-dropzone--active .gd-grid-layout-dropzone__drop-target--direction-row {
   right: -15px;
-  display: block;
 }
-
-.gd-dashboard-nested-layout-widget--column .dropzone.prev, .gd-dashboard-nested-layout-widget--column .dropzone.next {
-  top: unset;
+.gd-grid-layout-dropzone--direction-row.gd-grid-layout-dropzone--extended {
+  width: 100%;
+}
+.gd-grid-layout-dropzone--direction-row.gd-grid-layout-dropzone--isOverNestedLayout.gd-grid-layout-dropzone--type-prev, .gd-grid-layout-dropzone--direction-row.gd-grid-layout-dropzone--isOverNestedLayout.gd-grid-layout-dropzone--type-next {
+  width: 50px;
+}
+.gd-grid-layout-dropzone--direction-column.gd-grid-layout-dropzone--type-prev, .gd-grid-layout-dropzone--direction-column.gd-grid-layout-dropzone--type-next {
   right: 0;
-  bottom: unset;
   left: 0;
-  width: 100%;
   height: 50%;
 }
-.gd-dashboard-nested-layout-widget--column .dropzone.prev {
-  top: 0;
-}
-.gd-dashboard-nested-layout-widget--column .dropzone.prev.full {
+.gd-grid-layout-dropzone--direction-column.gd-grid-layout-dropzone--type-prev.gd-grid-layout-dropzone--full, .gd-grid-layout-dropzone--direction-column.gd-grid-layout-dropzone--type-next.gd-grid-layout-dropzone--full {
   width: 50%;
 }
-.gd-dashboard-nested-layout-widget--column .dropzone.prev.active .gd-hotspot-border__container {
-  left: unset;
+.gd-grid-layout-dropzone--direction-column.gd-grid-layout-dropzone--type-prev {
+  top: 0;
+}
+.gd-grid-layout-dropzone--direction-column.gd-grid-layout-dropzone--type-prev.gd-grid-layout-dropzone--active .gd-grid-layout-dropzone__drop-target--direction-column {
   top: -5px;
 }
-.gd-dashboard-nested-layout-widget--column .dropzone.next {
+.gd-grid-layout-dropzone--direction-column.gd-grid-layout-dropzone--type-next {
   bottom: 0;
 }
-.gd-dashboard-nested-layout-widget--column .dropzone.next.full {
-  width: 50%;
-}
-.gd-dashboard-nested-layout-widget--column .dropzone.next.active .gd-hotspot-border__container {
-  right: unset;
+.gd-grid-layout-dropzone--direction-column.gd-grid-layout-dropzone--type-next.gd-grid-layout-dropzone--active .gd-grid-layout-dropzone__drop-target--direction-column {
   bottom: -5px;
 }
-.gd-dashboard-nested-layout-widget--column .dropzone.gd-nested-layout-hotspot.prev, .gd-dashboard-nested-layout-widget--column .dropzone.gd-nested-layout-hotspot.next {
+.gd-grid-layout-dropzone--direction-column.gd-grid-layout-dropzone--isOverNestedLayout.gd-grid-layout-dropzone--type-prev, .gd-grid-layout-dropzone--direction-column.gd-grid-layout-dropzone--isOverNestedLayout.gd-grid-layout-dropzone--type-next {
   height: 50px;
 }
-.gd-dashboard-nested-layout-widget--column .dropzone.gd-first-container-row-dropzone.prev.active .gd-hotspot-border__container {
+.gd-grid-layout-dropzone--direction-column.gd-grid-layout-dropzone--isInFirstRow.gd-grid-layout-dropzone--type-prev.gd-grid-layout-dropzone--active .gd-grid-layout-dropzone__drop-target--direction-column {
   top: -15px;
 }
-.gd-dashboard-nested-layout-widget--column .gd-hotspot-border__container {
+.gd-grid-layout-dropzone__drop-target {
+  display: none;
+  position: absolute;
+}
+.gd-grid-layout-dropzone__drop-target--direction-row {
+  padding: 10px 0;
+  width: 10px;
+  height: 100%;
+}
+.gd-grid-layout-dropzone__drop-target--direction-row .gd-grid-layout-dropzone__drop-target-inner {
+  width: 4px;
+}
+.gd-grid-layout-dropzone__drop-target--direction-column {
   padding: 0;
   width: 100%;
   height: 10px;
 }
-.gd-dashboard-nested-layout-widget--column .gd-hotspot-border__drop-target .drop-target-inner {
+.gd-grid-layout-dropzone__drop-target--direction-column .gd-grid-layout-dropzone__drop-target-inner {
+  width: 100%;
+}
+.gd-grid-layout-dropzone__drop-target.gd-grid-layout-dropzone--isInFirstRow {
+  padding-top: 0;
+}
+.gd-grid-layout-dropzone--active .gd-grid-layout-dropzone__drop-target {
+  display: block;
+}
+.gd-grid-layout-dropzone__drop-target-border {
   width: 100%;
+  height: 100%;
+  padding: 2px;
+  border: 1px dashed var(--gd-palette-primary-base, #14b2e2);
+  border-radius: 15px;
+  background-color: var(--gd-palette-primary-dimmed, #e8f7fc);
+}
+.gd-grid-layout-dropzone__drop-target-inner {
+  height: 100%;
+  padding: 0;
+  border-radius: 2px;
+  background-color: var(--gd-palette-primary-base, #14b2e2);
 }
 
 .gd-dashboard-settings-dialog {