CardView rename Toolbar / ToolbarItem to resolve ambiguous export name conflicts (#30218)

Author: mpreyskurantov

packages/devextreme-angular/src/ui/card-view/index.ts

@@ -24,7 +24,7 @@ import {
 export { ExplicitTypes } from 'devextreme/ui/card_view';
 
 import DataSource from 'devextreme/data/data_source';
-import { CardCover, CardHeader, ColumnProperties, dxCardViewEditing, HeaderPanel, CardClickEvent, CardDblClickEvent, CardHoverChangedEvent, CardInsertedEvent, CardInsertingEvent, CardPreparedEvent, CardRemovedEvent, CardRemovingEvent, CardSavedEvent, CardSavingEvent, CardUpdatedEvent, CardUpdatingEvent, ContextMenuPreparingEvent, EditCanceledEvent, EditCancelingEvent, EditingStartEvent, FieldCaptionClickEvent, FieldCaptionDblClickEvent, FieldCaptionPreparedEvent, FieldValueClickEvent, FieldValueDblClickEvent, FieldValuePreparedEvent, FocusedCardChanged, InitNewCardEvent, SelectionChangedEvent, Paging, RemoteOperations, SelectionConfiguration, Toolbar } from 'devextreme/ui/card_view';
+import { CardCover, CardHeader, ColumnProperties, dxCardViewEditing, HeaderPanel, CardClickEvent, CardDblClickEvent, CardHoverChangedEvent, CardInsertedEvent, CardInsertingEvent, CardPreparedEvent, CardRemovedEvent, CardRemovingEvent, CardSavedEvent, CardSavingEvent, CardUpdatedEvent, CardUpdatingEvent, ContextMenuPreparingEvent, EditCanceledEvent, EditCancelingEvent, EditingStartEvent, FieldCaptionClickEvent, FieldCaptionDblClickEvent, FieldCaptionPreparedEvent, FieldValueClickEvent, FieldValueDblClickEvent, FieldValuePreparedEvent, FocusedCardChanged, InitNewCardEvent, SelectionChangedEvent, Paging, RemoteOperations, SelectionConfiguration, dxCardViewToolbar } from 'devextreme/ui/card_view';
 import { Mode, ScrollbarMode } from 'devextreme/common';
 import { ColumnChooser, FilterPanel, HeaderFilter, Pager, SearchPanel, Sorting } from 'devextreme/common/grids';
 import { DataSourceOptions } from 'devextreme/data/data_source';
@@ -576,10 +576,10 @@ export class DxCardViewComponent<TCardData = any, TKey = any> extends DxComponen
 
 
     @Input()
-    get toolbar(): Toolbar {
+    get toolbar(): dxCardViewToolbar {
         return this._getOption('toolbar');
     }
-    set toolbar(value: Toolbar) {
+    set toolbar(value: dxCardViewToolbar) {
         this._setOption('toolbar', value);
     }
 
@@ -1159,7 +1159,7 @@ export class DxCardViewComponent<TCardData = any, TKey = any> extends DxComponen
      * This member supports the internal infrastructure and is not intended to be used directly from your code.
     
      */
-    @Output() toolbarChange: EventEmitter<Toolbar>;
+    @Output() toolbarChange: EventEmitter<dxCardViewToolbar>;
 
     /**
     

packages/devextreme-angular/src/ui/card-view/nested/toolbar.ts

@@ -18,7 +18,7 @@ import {
 
 
 
-import { PredefinedToolbarItem, ToolbarItem } from 'devextreme/ui/card_view';
+import { dxCardViewToolbarItem, PredefinedToolbarItem } from 'devextreme/ui/card_view';
 
 import {
     DxIntegrationModule,
@@ -47,10 +47,10 @@ export class DxoCardViewToolbarComponent extends NestedOption implements OnDestr
     }
 
     @Input()
-    get items(): Array<PredefinedToolbarItem | ToolbarItem> {
+    get items(): Array<dxCardViewToolbarItem | PredefinedToolbarItem> {
         return this._getOption('items');
     }
-    set items(value: Array<PredefinedToolbarItem | ToolbarItem>) {
+    set items(value: Array<dxCardViewToolbarItem | PredefinedToolbarItem>) {
         this._setOption('items', value);
     }
 

packages/devextreme-react/src/card-view.ts

@@ -9,7 +9,7 @@ import dxCardView, {
 import { Component as BaseComponent, IHtmlOptions, ComponentRef, NestedComponentMeta } from "./core/component";
 import NestedOption from "./core/nested-option";
 
-import type { CardClickEvent, CardDblClickEvent, CardInsertedEvent, CardInsertingEvent, CardPreparedEvent, CardRemovedEvent, CardRemovingEvent, CardSavedEvent, CardSavingEvent, CardUpdatedEvent, CardUpdatingEvent, ContextMenuPreparingEvent, EditCanceledEvent, EditCancelingEvent, EditingStartEvent, FieldCaptionClickEvent, FieldCaptionDblClickEvent, FieldCaptionPreparedEvent, FieldValueClickEvent, FieldValueDblClickEvent, FieldValuePreparedEvent, InitNewCardEvent, CardTemplateData, CardHeaderItem as CardViewCardHeaderItem, CardHeaderPredefinedItem, FieldTemplateData, ColumnTemplateData, EditingTexts as CardViewEditingTexts, PredefinedToolbarItem, ToolbarItem as CardViewToolbarItem } from "devextreme/ui/card_view";
+import type { CardClickEvent, CardDblClickEvent, CardInsertedEvent, CardInsertingEvent, CardPreparedEvent, CardRemovedEvent, CardRemovingEvent, CardSavedEvent, CardSavingEvent, CardUpdatedEvent, CardUpdatingEvent, ContextMenuPreparingEvent, EditCanceledEvent, EditCancelingEvent, EditingStartEvent, FieldCaptionClickEvent, FieldCaptionDblClickEvent, FieldCaptionPreparedEvent, FieldValueClickEvent, FieldValueDblClickEvent, FieldValuePreparedEvent, InitNewCardEvent, CardTemplateData, CardHeaderItem as CardViewCardHeaderItem, CardHeaderPredefinedItem, FieldTemplateData, ColumnTemplateData, EditingTexts as CardViewEditingTexts, PredefinedToolbarItem, dxCardViewToolbarItem } from "devextreme/ui/card_view";
 import type { AnimationConfig, CollisionResolution, PositionConfig, AnimationState, AnimationType, CollisionResolutionCombination } from "devextreme/common/core/animation";
 import type { ValidationRuleType, HorizontalAlignment, VerticalAlignment, ButtonStyle, template, ButtonType, ToolbarItemLocation, ToolbarItemComponent, SearchMode, SingleMultipleOrNone, SelectAllMode, DataType, Format as CommonFormat, SortOrder, ComparisonOperator, DragHighlight, Mode, Direction, PositionAlignment, DisplayMode, ScrollbarMode, TabsIconPosition, TabsStyle, Position as CommonPosition } from "devextreme/common";
 import type { dxButtonOptions, ClickEvent, ContentReadyEvent, DisposingEvent, InitializedEvent, OptionChangedEvent } from "devextreme/ui/button";
@@ -2682,7 +2682,7 @@ const To = Object.assign<typeof _componentTo, NestedComponentMeta>(_componentTo,
 // CardView
 type IToolbarProps = React.PropsWithChildren<{
   disabled?: boolean;
-  items?: Array<PredefinedToolbarItem | CardViewToolbarItem>;
+  items?: Array<dxCardViewToolbarItem | PredefinedToolbarItem>;
   multiline?: boolean;
   visible?: boolean | undefined;
 }>

packages/devextreme-vue/src/card-view.ts

@@ -39,12 +39,12 @@ import {
  Paging,
  RemoteOperations,
  SelectionConfiguration,
- Toolbar,
+ dxCardViewToolbar,
  CardHeaderItem,
  CardHeaderPredefinedItem,
  EditingTexts,
  PredefinedToolbarItem,
- ToolbarItem,
+ dxCardViewToolbarItem,
 } from "devextreme/ui/card_view";
 import {
  Mode,
@@ -357,7 +357,7 @@ const componentConfig = {
     selection: Object as PropType<SelectionConfiguration | Record<string, any>>,
     sorting: Object as PropType<Sorting | Record<string, any>>,
     tabIndex: Number,
-    toolbar: Object as PropType<Toolbar | Record<string, any>>,
+    toolbar: Object as PropType<dxCardViewToolbar | Record<string, any>>,
     visible: Boolean,
     width: [Number, String],
     wordWrapEnabled: Boolean
@@ -3112,7 +3112,7 @@ const DxToolbarConfig = {
   },
   props: {
     disabled: Boolean,
-    items: Array as PropType<Array<PredefinedToolbarItem | ToolbarItem>>,
+    items: Array as PropType<Array<dxCardViewToolbarItem | PredefinedToolbarItem>>,
     multiline: Boolean,
     visible: Boolean
   }

packages/devextreme/js/ui/card_view.d.ts

@@ -86,50 +86,63 @@ export type RemoteOperations = {
 export type PredefinedToolbarItem = 'columnChooserButton' | 'searchPanel' | 'addCardButton' | 'selectAllButton' | 'clearSelectionButton';
 
 /**
- * @docid
+ * @namespace DevExpress.ui
+ * @deprecated Use ToolbarItem instead
+ */
+export type dxCardViewToolbarItem = ToolbarItem;
+
+/**
+ * @docid dxCardViewToolbarItem
  * @inherits dxToolbarItem
  * @public
  * @namespace DevExpress.ui.dxCardView
  */
 export type ToolbarItem = dxToolbarItem & {
     /**
-     * @docid
+     * @docid dxCardViewToolbarItem.name
      * @public
      */
     name?: PredefinedToolbarItem | string;
     /**
-     * @docid
+     * @docid dxCardViewToolbarItem.location
      * @default 'after'
      * @public
      */
     location?: ToolbarItemLocation;
 };
 
 /**
- * @docid
+ * @namespace DevExpress.ui
+ * @deprecated Use Toolbar instead
+ */
+export type dxCardViewToolbar = Toolbar;
+
+/**
+ * @docid dxCardViewToolbar
  * @public
  * @namespace DevExpress.ui.dxCardView
  */
 export type Toolbar = {
     /**
-     * @docid
+     * @docid dxCardViewToolbar.items
+     * @type Array<Enums.PredefinedToolbarItem,dxCardViewToolbarItem>
      * @public
      */
     items?: Array<PredefinedToolbarItem | ToolbarItem>;
     /**
-     * @docid
+     * @docid dxCardViewToolbar.visible
      * @default undefined
      * @public
      */
     visible?: boolean | undefined;
     /**
-     * @docid
+     * @docid dxCardViewToolbar.disabled
      * @default false
      * @public
      */
     disabled?: boolean;
     /**
-     * @docid
+     * @docid dxCardViewToolbar.multiline
      * @default false
      * @public
      */
@@ -1537,6 +1550,7 @@ export interface dxCardViewOptions<TCardData = unknown, TKey = unknown> extends
 
     /**
      * @docid
+     * @type dxCardViewToolbar
      * @public
      */
     toolbar?: Toolbar;

packages/devextreme/ts/dx.all.d.ts

@@ -10905,6 +10905,16 @@ declare module DevExpress.ui {
       e: DevExpress.ui.dxCardView.ContextMenuPreparingEvent<TCardData>
     ) => void;
   }
+  /**
+   * @deprecated Use DevExpress.ui.dxCardView.Toolbar instead
+   * @deprecated Attention! This type is for internal purposes only. If you used it previously, please submit a ticket to our {@link https://supportcenter.devexpress.com/ticket/create Support Center}. We will check if there is an alternative solution.
+   */
+  export type dxCardViewToolbar = DevExpress.ui.dxCardView.Toolbar;
+  /**
+   * @deprecated Use DevExpress.ui.dxCardView.ToolbarItem instead
+   * @deprecated Attention! This type is for internal purposes only. If you used it previously, please submit a ticket to our {@link https://supportcenter.devexpress.com/ticket/create Support Center}. We will check if there is an alternative solution.
+   */
+  export type dxCardViewToolbarItem = DevExpress.ui.dxCardView.ToolbarItem;
   /**
    * [descr:dxChat]
    */
@@ -33263,36 +33273,36 @@ declare module DevExpress.ui.dxCardView {
     grouping?: boolean;
   };
   /**
-   * [descr:Toolbar]
+   * [descr:dxCardViewToolbar]
    */
   export type Toolbar = {
     /**
-     * [descr:Toolbar.items]
+     * [descr:dxCardViewToolbar.items]
      */
     items?: Array<PredefinedToolbarItem | ToolbarItem>;
     /**
-     * [descr:Toolbar.visible]
+     * [descr:dxCardViewToolbar.visible]
      */
     visible?: boolean | undefined;
     /**
-     * [descr:Toolbar.disabled]
+     * [descr:dxCardViewToolbar.disabled]
      */
     disabled?: boolean;
     /**
-     * [descr:Toolbar.multiline]
+     * [descr:dxCardViewToolbar.multiline]
      */
     multiline?: boolean;
   };
   /**
-   * [descr:ToolbarItem]
+   * [descr:dxCardViewToolbarItem]
    */
   export type ToolbarItem = dxToolbarItem & {
     /**
-     * [descr:ToolbarItem.name]
+     * [descr:dxCardViewToolbarItem.name]
      */
     name?: PredefinedToolbarItem | string;
     /**
-     * [descr:ToolbarItem.location]
+     * [descr:dxCardViewToolbarItem.location]
      */
     location?: DevExpress.common.ToolbarItemLocation;
   };

tools/smd-cfg.json

@@ -7,10 +7,6 @@
             "kind": "remove",
             "uid": "/ai-integration:AIIntegration"
         },
-        {
-            "kind": "remove",
-            "uid": "/card_view:Toolbar"
-        },
         {
             "kind": "remove",
             "uid": "/html_editor:AICommand"
@@ -94,7 +90,6 @@
             "ui/accordion:dxAccordionItem",
             "ui/action_sheet:dxActionSheetItem",
             "ui/box:dxBoxItem",
-            "ui/card_view:ToolbarItem",
             "ui/collection/ui.collection_widget.base:CollectionWidgetItem",
             "ui/drop_down_button:dxDropDownButtonItem",
             "ui/gallery:dxGalleryItem",