Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

@atlaskit/pragmatic-drag-and-drop-react-indicator

atlassian6.9k0.18.0TypeScript support: included

A react addon for @atlaskit/pragmatic-drag-and-drop which will draw drop indicators (eg lines)

readme

@atlaskit/pragmatic-drag-and-drop-react-indicator

A react addon for @atlaskit/pragmatic-drag-and-drop which will draw drop indicators (eg lines) for drag and drop interactions. Styling is powered by @emotion. There is no requirement to use this package for drawing indicators. This package exposes helpers for common use cases.

Installation

yarn add @atlaskit/pragmatic-drag-and-drop-react-indicator

Usage

Detailed docs and example usage can be found on atlassian.design.

changelog

@atlaskit/pragmatic-drag-and-drop-react-indicator

0.18.0

Minor Changes

  • #62704 842b8e893c33 - [ux] Making small change so that the line and terminal have the same color ("color.border.selected"). Previously, the line (unintentionally) had a slightly different shade of blue.

0.17.1

Patch Changes

  • Updated dependencies

0.17.0

Minor Changes

  • #42620 0e076ee05b0 - Moving our tree exports that are used in Confluence from experimental to stable.

    - @atlaskit/pragmatic-drag-and-drop-react-indicator/experimental/tree-item
    + @atlaskit/pragmatic-drag-and-drop-react-indicator/tree-item

Patch Changes

  • Updated dependencies

0.16.6

Patch Changes

  • Updated dependencies

0.16.5

Patch Changes

0.16.4

Patch Changes

  • Updated dependencies

0.16.3

Patch Changes

  • Updated dependencies

0.16.2

Patch Changes

  • Updated dependencies

0.16.1

Patch Changes

  • Updated dependencies

0.16.0

Minor Changes

  • #37722 3ccb90e7480 - Changed folder structure of package. There should be no visible changes.

0.15.0

Minor Changes

  • #37280 975218de587 - Adds a terminal to the DropIndicator in the /box entrypoint. We now recommend most consumers use lines with terminals.

    A new entrypoint /box-without-terminal has been added, which contains the old appearance.

0.14.4

Patch Changes

  • Updated dependencies

0.14.3

Patch Changes

0.14.2

Patch Changes

0.14.1

Patch Changes

0.14.0

Minor Changes

Patch Changes

  • Updated dependencies

0.13.0

Minor Changes

  • #33262 34ed7b2ec63 - We have changed the name of our drag and drop packages to align on the single name of "Pragmatic drag and drop"

    - @atlaskit/drag-and-drop
    + @atlaskit/pragmatic-drag-and-drop
    
    - @atlaskit/drag-and-drop-autoscroll
    + @atlaskit/pragmatic-drag-and-drop-autoscroll
    
    - @atlaskit/drag-and-drop-hitbox
    + @atlaskit/pragmatic-drag-and-drop-hitbox
    
    - @atlaskit/drag-and-drop-indicator
    + @atlaskit/pragmatic-drag-and-drop-react-indicator
    # Note: `react` was added to this package name as our indicator package is designed for usage with `react`.
    
    - @atlaskit/drag-and-drop-live-region
    + @atlaskit/pragmatic-drag-and-drop-live-region
    
    - @atlaskit/drag-and-drop-react-beautiful-dnd-migration
    + @atlaskit/pragmatic-drag-and-drop-react-beautiful-dnd-migration
    
    - @atlaskit/drag-and-drop-docs
    + @atlaskit/pragmatic-drag-and-drop-docs

    The new @atlaskit/pragmatic-drag-and-drop* packages will start their initial versions from where the @atlaskit/drag-and-drop*` packages left off. Doing this will make it easier to look back on changelogs and see how the packages have progressed.

Patch Changes

  • Updated dependencies

0.12.0

Minor Changes

Patch Changes

  • Updated dependencies

0.11.1

Patch Changes

  • #32424 2e01c9c74b5 - DUMMY remove before merging to master; dupe adf-schema via adf-utils

0.11.0

Minor Changes

  • #32212 e2a4f1aeab0 - Changing experimental tree item border radius (2px) to match border radius of Confluence tree items (3px)

0.10.6

Patch Changes

  • Updated dependencies

0.10.5

Patch Changes

  • Updated dependencies

0.10.4

Patch Changes

  • Updated dependencies

0.10.3

Patch Changes

  • Updated dependencies

0.10.2

Patch Changes

  • Updated dependencies

0.10.1

Patch Changes

  • Updated dependencies

0.10.0

Minor Changes

  • #30953 90901f5bbe0 - Replace default entry point of undefined with {}.

    NOTE: Importing from the default entry point isn't supported. Please use individual entry points in order to always obtain minimum kbs.

Patch Changes

  • Updated dependencies

0.9.1

Patch Changes

  • Updated dependencies

0.9.0

Minor Changes

  • #29945 fe6772a3719 - Dramatic update to experimental tree-item outputs. These outputs should only be used right now by Confluence Page Tree. Changes are being communicated face to face with Confluence team members

Patch Changes

  • Updated dependencies

0.8.2

Patch Changes

  • Updated dependencies

0.8.1

Patch Changes

  • Updated dependencies

0.8.0

Minor Changes

  • #29562 2112070b91a - We have changed the API for our experimental tree drop indicator. Consumers should not be using the experimental tree drop indicator in production before speaking with the Design System team.

    This change makes the tree item drop indicator API and usage consistent with our stable box drop indicator

    + // The import path to the tree item drop indicator has changed
    - import { DropIndicator } from '@atlaskit/drag-and-drop-indicator/tree';
    + import { DropIndicator } from '@atlaskit/drag-and-drop-indicator/tree-item';
    
    - // Render prop API with className as public API
    - <DropIndicator edge={edge}>({className}) => <div className={className} />
    + // Conditional rendering of an element
    + <div style={{position: 'relative'}}>{edge ? <DropIndicator edge={edge} /></div>}

    The hasTerminal prop has also been removed from the tree drop indicator as for trees the current design is that all lines have a terminal on them.

0.7.4

Patch Changes

  • Updated dependencies

0.7.3

Patch Changes

  • #28324 6455cf006b3 - Builds for this package now pass through a tokens babel plugin, removing runtime invocations of the tokens() function and improving performance.

0.7.2

Patch Changes

  • Updated dependencies

0.7.1

Patch Changes

  • Updated dependencies

0.7.0

Minor Changes

  • #27976 ace261c5753 - For the experimental tree drop indicator, we have changed the gap and inset from number to string to align with our Box line indicator.

    Note: consumers should not be using the experimental tree drop indicator in production. We are exposing this work in progress component for internal experimentation purposes.

0.6.2

Patch Changes

  • Updated dependencies

0.6.1

Patch Changes

  • Updated dependencies

0.6.0

Minor Changes

  • #26749 9066b866ed1 - The edge prop on the box drop indicator @atlaskit/drag-and-drop-indicator/box was previously optional and is now required.

    For the fastest possible applications, it is important that <DropIndicator> is only doing work when it needs to. Making edge required forces consumers to only render the <DropIndicator> when it is actually doing something. We are using the type system to ensure the fastest possible usage

    - <DropIndicator edge={closestEdge} />
    + { closestEdge && <DropIndicator edge={closestEdge} /> }

0.5.2

Patch Changes

  • Updated dependencies

0.5.1

Patch Changes

0.5.0

Minor Changes

  • #25485 5b37b07dc94 - Moving from @emotion/core@10 to @emotion/react@11 to line up @emotion usage with the rest of the Design System

0.4.2

Patch Changes

  • Updated dependencies

0.4.1

Patch Changes

  • Updated dependencies

0.4.0

Minor Changes

0.3.0

Minor Changes

  • #25007 17950433a70 - Touching package to release re-release previous version. The previous (now deprecated) version did not have it's entry points built correctly

Patch Changes

  • Updated dependencies

0.2.2

Patch Changes

  • Updated dependencies

0.2.1

Patch Changes

  • Updated dependencies

0.2.0

Minor Changes

  • #24613 e26c936c610 - We have improved our naming consistency across our drag and drop packages.

    • The exports from @atlaskit/drag-and-drop-indicator have now been shifted over to @atlaskit/drag-and-drop-indicator/box. @atlaskit/drag-and-drop-indicator will no longer be useable from the root entry point
    - import { DropIndicator } from '@atlaskit/drag-and-drop-indicator';
    + import { DropIndicator } from '@atlaskit/drag-and-drop-indicator/box';

Patch Changes

  • Updated dependencies

0.1.0

Minor Changes

Patch Changes

  • Updated dependencies

0.0.1

Patch Changes