@gooddata/sdk-ui-dashboard 10.15.0-alpha.8 → 10.15.0-alpha.9

package/esm/sdk-ui-dashboard.d.ts

@@ -174,6 +174,7 @@ import { IDashboardInsightProps as IDashboardInsightProps_2 } from './types.js';
 import { IDashboardKpiProps as IDashboardKpiProps_2 } from './types.js';
 import { IDashboardLayout } from '@gooddata/sdk-model';
 import { IDashboardLayoutItem } from '@gooddata/sdk-model';
+import { IDashboardLayoutProps as IDashboardLayoutProps_2 } from './types.js';
 import { IDashboardLayoutSection } from '@gooddata/sdk-model';
 import { IDashboardLayoutSectionHeader } from '@gooddata/sdk-model';
 import { IDashboardLayoutSizeByScreenSize } from '@gooddata/sdk-model';
@@ -2298,6 +2299,11 @@ export declare type CustomDashboardKpiComponent = ComponentType<IDashboardKpiPro
  */
 export declare type CustomDashboardLayoutComponent = ComponentType<IDashboardLayoutProps>;
 
+/**
+ * @alpha
+ */
+export declare type CustomDashboardNestedLayoutComponent = ComponentType<IDashboardNestedLayoutProps>;
+
 /**
  * @public
  */
@@ -4758,6 +4764,38 @@ export declare interface DashboardLayoutChangedPayload {
  */
 export declare type DashboardLayoutCommands = AddLayoutSection | MoveLayoutSection | RemoveLayoutSection | ChangeLayoutSectionHeader | AddSectionItems | MoveSectionItem | RemoveSectionItem | RemoveSectionItemByWidgetRef | ResizeHeight;
 
+/**
+ * @alpha
+ */
+export declare type DashboardLayoutComponentProvider = (widget: IDashboardLayout) => CustomDashboardNestedLayoutComponent;
+
+/**
+ * @internal
+ */
+export declare type DashboardLayoutDraggableComponent = {
+    DraggingComponent?: DashboardLayoutDraggingComponent;
+    type: "dashboardLayout";
+};
+
+/**
+ * @internal
+ */
+export declare type DashboardLayoutDraggableItem = BaseDraggableMovingItem & {
+    type: "dashboardLayout";
+};
+
+/**
+ * @internal
+ */
+export declare type DashboardLayoutDraggableListItem = BaseDraggableLayoutItem & {
+    type: "dashboardLayoutListItem";
+};
+
+/**
+ * @internal
+ */
+export declare type DashboardLayoutDraggingComponent = ComponentType<IDashboardLayoutDraggingComponentProps>;
+
 /**
  * This event is emitted when a new dashboard layout section is added.
  *
@@ -5028,6 +5066,12 @@ export declare interface DashboardLayoutSectionRemovedPayload {
     readonly stashIdentifier?: StashedDashboardItemsId;
 }
 
+/**
+ * Definition of Dashboard layout widget
+ * @internal
+ */
+export declare type DashboardLayoutWidgetComponentSet = CustomComponentBase<IDashboardNestedLayoutProps, Parameters<DashboardLayoutComponentProvider>> & DraggableComponent & Partial<CreatableByDragComponent> & Partial<CreatablePlaceholderComponent<IDashboardNestedLayoutProps>> & ConfigurableWidget<IDashboardLayout>;
+
 /**
  * @beta
  */
@@ -6135,11 +6179,23 @@ export declare const DefaultDashboardKpiPlaceholderWidget: CustomDashboardWidget
  */
 export declare const DefaultDashboardLayout: (props: IDashboardLayoutProps) => JSX.Element;
 
+/**
+ * @internal
+ */
+export declare function DefaultDashboardLayoutComponentSetFactory(dashboardLayoutComponentProvider: DashboardLayoutComponentProvider): DashboardLayoutWidgetComponentSet;
+
 /**
  * @internal
  */
 export declare const DefaultDashboardMainContent: (_: IDashboardProps) => React_2.JSX.Element;
 
+/**
+ * Default implementation of the dashboard layout widget.
+ *
+ * @public
+ */
+export declare const DefaultDashboardNestedLayout: ComponentType<IDashboardLayoutProps_2>;
+
 /**
  * Default implementation of the dashboard rich text widget.
  *
@@ -6409,18 +6465,18 @@ export declare function dispatchAndWaitFor<TCommand extends DashboardCommands, T
  * @internal
  */
 export declare type DraggableComponent = {
-    dragging: AttributeFilterDraggableComponent | DateFilterDraggableComponent | KpiDraggableComponent | InsightDraggableComponent | RichTextDraggableComponent | VisualizationSwitcherDraggableComponent | CustomDraggableComponent;
+    dragging: AttributeFilterDraggableComponent | DateFilterDraggableComponent | KpiDraggableComponent | InsightDraggableComponent | RichTextDraggableComponent | VisualizationSwitcherDraggableComponent | DashboardLayoutDraggableComponent | CustomDraggableComponent;
 };
 
 /**
  * @internal
  */
-export declare type DraggableContentItem = AttributeFilterDraggableItem | AttributeFilterPlaceholderDraggableItem | DateFilterDraggableItem | InsightDraggableItem | InsightDraggableListItem | InsightPlaceholderDraggableItem | KpiDraggableItem | KpiPlaceholderDraggableItem | RichTextDraggableItem | RichTextDraggableListItem | VisualizationSwitcherDraggableItem | VisualizationSwitcherDraggableListItem | CustomWidgetDraggableItem | CustomDraggableItem;
+export declare type DraggableContentItem = AttributeFilterDraggableItem | AttributeFilterPlaceholderDraggableItem | DateFilterDraggableItem | InsightDraggableItem | InsightDraggableListItem | InsightPlaceholderDraggableItem | KpiDraggableItem | KpiPlaceholderDraggableItem | RichTextDraggableItem | RichTextDraggableListItem | VisualizationSwitcherDraggableItem | VisualizationSwitcherDraggableListItem | DashboardLayoutDraggableItem | DashboardLayoutDraggableListItem | CustomWidgetDraggableItem | CustomDraggableItem;
 
 /**
  * @internal
  */
-export declare type DraggableContentItemType = "attributeFilter" | "dateFilter" | "attributeFilter-placeholder" | "insightListItem" | "insight" | "insight-placeholder" | "kpi" | "kpi-placeholder" | "richText" | "richTextListItem" | "visualizationSwitcher" | "visualizationSwitcherListItem" | "custom";
+export declare type DraggableContentItemType = "attributeFilter" | "dateFilter" | "attributeFilter-placeholder" | "insightListItem" | "insight" | "insight-placeholder" | "kpi" | "kpi-placeholder" | "richText" | "richTextListItem" | "visualizationSwitcher" | "visualizationSwitcherListItem" | "dashboardLayout" | "dashboardLayoutListItem" | "custom";
 
 /**
  * @internal
@@ -6458,6 +6514,8 @@ export declare type DraggableItemComponentTypeMapping = {
     richTextListItem: RichTextDraggableListItem;
     visualizationSwitcher: VisualizationSwitcherDraggableItem;
     visualizationSwitcherListItem: VisualizationSwitcherDraggableListItem;
+    dashboardLayout: DashboardLayoutDraggableItem;
+    dashboardLayoutListItem: DashboardLayoutDraggableListItem;
     custom: CustomDraggableItem;
 };
 
@@ -6482,7 +6540,7 @@ export declare type DraggableItemTypeMapping = DraggableItemComponentTypeMapping
 /**
  * @internal
  */
-export declare type DraggableLayoutItem = InsightDraggableItem | KpiDraggableItem | RichTextDraggableItem | VisualizationSwitcherDraggableItem | CustomWidgetDraggableItem;
+export declare type DraggableLayoutItem = InsightDraggableItem | KpiDraggableItem | RichTextDraggableItem | VisualizationSwitcherDraggableItem | DashboardLayoutDraggableItem | CustomWidgetDraggableItem;
 
 /**
  * @internal
@@ -8295,6 +8353,18 @@ export declare interface IDashboardCustomComponentProps {
      * @public
      */
     VisualizationSwitcherComponentProvider?: OptionalVisualizationSwitcherComponentProvider;
+    /**
+     * Specify function to obtain custom component to use for rendering a dashboard layout (nested).
+     *
+     * @remarks
+     * -  If not provided, the default implementation {@link DefaultDashboardLayout} will be used.
+     * -  If factory function is provided and it returns undefined, then the default implementation {@link DefaultDashboardLayout}.
+     *    This is useful if you want to customize just one particular nested layout and keep default rendering for
+     *    the other nested layouts.
+     *
+     * @public
+     */
+    DashboardLayoutComponentProvider?: OptionalDashboardLayoutComponentProvider;
     /**
      * Specify function to obtain custom component to use for rendering a visualization switcher toolbar.
      *
@@ -9279,6 +9349,14 @@ export declare interface IDashboardLayoutCustomizer {
     customizeFluidLayout(fun: FluidLayoutCustomizationFn): IDashboardLayoutCustomizer;
 }
 
+/**
+ * @internal
+ */
+export declare type IDashboardLayoutDraggingComponentProps = {
+    itemType: "dashboardLayout";
+    item: DashboardLayoutDraggableItem;
+};
+
 /**
  * @alpha
  */
@@ -9289,6 +9367,51 @@ export declare interface IDashboardLayoutProps {
     onError?: OnError;
 }
 
+/**
+ * @alpha
+ */
+export declare interface IDashboardNestedLayoutProps {
+    ErrorComponent?: React.ComponentType<IErrorProps>;
+    onFiltersChange?: (filters: (IDashboardFilter | FilterContextItem)[], resetOthers?: boolean) => void;
+    onDrill?: OnFiredDashboardDrillEvent;
+    onError?: OnError;
+    layout?: IDashboardLayout<ExtendedDashboardWidget>;
+    screen?: ScreenSize;
+    parentLayoutItemSize?: IDashboardLayoutSizeByScreenSize;
+    /**
+     * Backend to work with.
+     *
+     * @remarks
+     * Note: the backend must come either from this property or from BackendContext. If you do not specify
+     * backend here, then the component MUST be rendered within an existing BackendContext.
+     *
+     * @alpha
+     */
+    backend?: IAnalyticalBackend;
+    /**
+     * Workspace where the Insight widget exists.
+     *
+     * @remarks
+     * Note: the workspace must come either from this property or from WorkspaceContext. If you do not specify
+     * workspace here, then the component MUST be rendered within an existing WorkspaceContext.
+     *
+     * @alpha
+     */
+    workspace?: string;
+    /**
+     * Height of the visualization switcher widget container.
+     *
+     * @alpha
+     */
+    clientHeight?: number;
+    /**
+     * Width of the visualization switcher widget container.
+     *
+     * @alpha
+     */
+    clientWidth?: number;
+}
+
 /**
  * Raw, low-level interface that the dashboard plugins need to implement.
  *
@@ -11778,6 +11901,16 @@ export declare const isDashboardKpiWidgetMeasureChanged: (obj: unknown) => obj i
  */
 export declare const isDashboardLayoutChanged: (obj: unknown) => obj is DashboardLayoutChanged;
 
+/**
+ * @internal
+ */
+export declare function isDashboardLayoutDraggableItem(item: any): item is DashboardLayoutDraggableItem;
+
+/**
+ * @internal
+ */
+export declare function isDashboardLayoutDraggableListItem(item: any): item is DashboardLayoutDraggableListItem;
+
 /**
  * Tests whether the provided object is an instance of {@link DashboardLayoutSectionAdded}.
  *
@@ -12223,6 +12356,13 @@ export declare interface ISidebarProps {
      * @internal
      */
     VisualizationSwitcherWidgetComponentSet?: VisualizationSwitcherWidgetComponentSet;
+    /**
+     * Layout (nested) widget component set.
+     * Do not set or override this property, it's injected by the Dashboard.
+     *
+     * @internal
+     */
+    DashboardLayoutWidgetComponentSet?: DashboardLayoutWidgetComponentSet;
     /**
      * Component, that renders delete drop zone.
      * Do not set or override this property, it's injected by the Dashboard.
@@ -13440,6 +13580,11 @@ export declare type OptionalAttributeFilterComponentProvider = OptionalProvider<
  */
 export declare type OptionalDashboardContentComponentProvider = OptionalProvider<DashboardContentComponentProvider>;
 
+/**
+ * @alpha
+ */
+export declare type OptionalDashboardLayoutComponentProvider = OptionalProvider<DashboardLayoutComponentProvider>;
+
 /**
  * @public
  */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gooddata/sdk-ui-dashboard",
-  "version": "10.15.0-alpha.8",
+  "version": "10.15.0-alpha.9",
   "description": "GoodData SDK - Dashboard Component",
   "repository": {
     "type": "git",
@@ -57,17 +57,17 @@
     "ts-invariant": "^0.7.5",
     "tslib": "^2.5.0",
     "uuid": "^8.3.2",
-    "@gooddata/sdk-backend-base": "10.15.0-alpha.8",
-    "@gooddata/sdk-backend-spi": "10.15.0-alpha.8",
-    "@gooddata/sdk-ui": "10.15.0-alpha.8",
-    "@gooddata/sdk-model": "10.15.0-alpha.8",
-    "@gooddata/sdk-ui-ext": "10.15.0-alpha.8",
-    "@gooddata/sdk-ui-filters": "10.15.0-alpha.8",
-    "@gooddata/sdk-ui-geo": "10.15.0-alpha.8",
-    "@gooddata/sdk-ui-kit": "10.15.0-alpha.8",
-    "@gooddata/sdk-ui-theme-provider": "10.15.0-alpha.8",
-    "@gooddata/util": "10.15.0-alpha.8",
-    "@gooddata/sdk-ui-vis-commons": "10.15.0-alpha.8"
+    "@gooddata/sdk-backend-base": "10.15.0-alpha.9",
+    "@gooddata/sdk-backend-spi": "10.15.0-alpha.9",
+    "@gooddata/sdk-model": "10.15.0-alpha.9",
+    "@gooddata/sdk-ui": "10.15.0-alpha.9",
+    "@gooddata/sdk-ui-filters": "10.15.0-alpha.9",
+    "@gooddata/sdk-ui-ext": "10.15.0-alpha.9",
+    "@gooddata/sdk-ui-kit": "10.15.0-alpha.9",
+    "@gooddata/sdk-ui-geo": "10.15.0-alpha.9",
+    "@gooddata/sdk-ui-vis-commons": "10.15.0-alpha.9",
+    "@gooddata/util": "10.15.0-alpha.9",
+    "@gooddata/sdk-ui-theme-provider": "10.15.0-alpha.9"
   },
   "peerDependencies": {
     "react": "^16.10.0 || ^17.0.0 || ^18.0.0",
@@ -120,9 +120,9 @@
     "typescript": "5.3.3",
     "vitest": "1.0.4",
     "vitest-dom": "0.1.1",
-    "@gooddata/i18n-toolkit": "10.15.0-alpha.8",
-    "@gooddata/reference-workspace": "10.15.0-alpha.8",
-    "@gooddata/sdk-backend-mockingbird": "10.15.0-alpha.8"
+    "@gooddata/reference-workspace": "10.15.0-alpha.9",
+    "@gooddata/i18n-toolkit": "10.15.0-alpha.9",
+    "@gooddata/sdk-backend-mockingbird": "10.15.0-alpha.9"
   },
   "scripts": {
     "clean": "rm -rf ci dist esm coverage *.log styles/css tsconfig.tsbuildinfo",

package/styles/css/main.css

@@ -22916,33 +22916,28 @@ div.gd-empty-item-bubble {
   background-repeat: no-repeat;
   background-position: center;
 }
-.add-item-placeholder-rich-text {
+.add-item-placeholder.add-panel-item {
   padding: 0 10px 0 0;
 }
-.add-item-placeholder-rich-text svg {
+.add-item-placeholder.add-panel-item svg {
   margin: 0 14px;
 }
-.add-item-placeholder-rich-text::before {
+.add-item-placeholder.add-panel-item::before {
   content: none;
 }
-.add-item-placeholder-visualization-switcher {
-  padding: 0 10px 0 0;
-}
-.add-item-placeholder-visualization-switcher svg {
-  margin: 0 14px;
-}
-.add-item-placeholder-visualization-switcher:hover .gd-add-visualization-switcher {
+.add-item-placeholder.add-panel-item:hover .gd-add-item-placeholder-help-trigger {
   display: block;
   cursor: help;
 }
-.add-item-placeholder-visualization-switcher .gd-add-visualization-switcher {
+.add-item-placeholder.add-panel-item .gd-add-item-placeholder-help-trigger {
   display: none;
   flex: 0 0 auto;
-  margin-left: 20px;
+  margin-left: auto;
+  margin-right: 5px;
   font-weight: normal;
 }
-.add-item-placeholder-visualization-switcher::before {
-  content: none;
+.add-item-placeholder.add-panel-item span {
+  flex: 0 0 auto;
 }
 .add-item-placeholder span {
   flex: 1 1 auto;