Skip to content

bug(cdk/drag-drop): Type DragConstrainPosition does not match @Input('cdkDragConstrainPosition') in CdkDrag #30509

Closed
@Veribelll

Description

@Veribelll

Is this a regression?

  • Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

No response

Description

Type mismatch in @Input('cdkDragConstrainPosition') of CdkDrag constrainPosition: (userPointerPosition: Point, dragRef: DragRef, dimensions: DOMRect, pickupPositionInElement: Point) => Point and type DragConstrainPosition (point: Point, dragRef: DragRef) => Point;

Reproduction

StackBlitz link: https://stackblitz.com/edit/hn9tjrdg?file=src%2Fexample%2Fcdk-drag-drop-overview-example.ts

Expected Behavior

Below code compiles successfully

@Component({
  selector: 'cdk-drag-drop-overview-example',
  templateUrl: 'cdk-drag-drop-overview-example.html',
  styleUrl: 'cdk-drag-drop-overview-example.css',
  imports: [CdkDrag],
  providers: [
    {
      provide: CDK_DRAG_CONFIG,
      useFactory: () => {
        const config: DragDropConfig = {
          constrainPosition: (
            userPointerPosition: Point, 
            dragRef: DragRef, 
            dimensions: DOMRect, 
            pickupPositionInElement: Point) => {
            return userPointerPosition;
          },
        }

        return config;
      },
    },
  ],
})
export class CdkDragDropOverviewExample {}

Actual Behavior

Type '(userPointerPosition: Point, dragRef: DragRef, dimensions: DOMRect, pickupPositionInElement: Point) => Point' is not assignable to type 'DragConstrainPosition'.
@Component({
  selector: 'cdk-drag-drop-overview-example',
  templateUrl: 'cdk-drag-drop-overview-example.html',
  styleUrl: 'cdk-drag-drop-overview-example.css',
  imports: [CdkDrag],
  providers: [
    {
      provide: CDK_DRAG_CONFIG,
      useFactory: () => {
        const config: DragDropConfig = {
          constrainPosition: (
            userPointerPosition: Point, 
            dragRef: DragRef, 
            dimensions: DOMRect, 
            pickupPositionInElement: Point) => {
            return userPointerPosition;
          },
        }

        return config;
      },
    },
  ],
})
export class CdkDragDropOverviewExample {}

Image

Environment

  • Angular:
  • CDK/Material:
  • Browser(s):
  • Operating System (e.g. Windows, macOS, Ubuntu):

Metadata

Metadata

Assignees

No one assigned

    Labels

    P3An issue that is relevant to core functions, but does not impede progress. Important, but not urgentarea: cdk/drag-drop

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions