@atlaskit/ds-explorations 2.0.3 → 2.0.5

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/ds-explorations
 
+## 2.0.5
+
+### Patch Changes
+
+- [`a70970a5aab`](https://bitbucket.org/atlassian/atlassian-frontend/commits/a70970a5aab) - Mark Box, Inline, and Stack as deprecated, planned for future removal.
+
+## 2.0.4
+
+### Patch Changes
+
+- [`7f5f23dcb68`](https://bitbucket.org/atlassian/atlassian-frontend/commits/7f5f23dcb68) - Introduce shape tokens to some packages.
+
 ## 2.0.3
 
 ### Patch Changes

package/dist/cjs/components/box.partial.js

@@ -18,7 +18,9 @@ var _excluded = ["children", "as", "className", "display", "flexDirection", "ali
  * Box is a primitive component that has the design decisions of the Atlassian Design System baked in.
  * Renders a `div` by default.
  *
- * @internal
+ * @private
+ * @deprecated DSP-8009: This primitive is scheduled for deletion.
+ * Please use `Box` from `@atlaskit/primitives` instead.
  */
 var Box = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   var children = _ref.children,
@@ -95,7 +97,7 @@ var borderWidthMap = {
 };
 var borderRadiusMap = {
   normal: (0, _react2.css)({
-    borderRadius: '3px'
+    borderRadius: "var(--ds-radius-100, 3px)"
   }),
   rounded: (0, _react2.css)({
     borderRadius: '50%'

package/dist/cjs/components/inline.partial.js

@@ -80,6 +80,10 @@ var Divider = function Divider(_ref) {
  * Inline is a primitive component based on flexbox that manages the horizontal layout of direct children.
  * Renders a `div` by default.
  *
+ * @private
+ * @deprecated DSP-8009: This primitive is scheduled for deletion.
+ * Please use `Inline` from `@atlaskit/primitives` instead.
+ *
  * @example
  * ```tsx
  * const App = () => (

package/dist/cjs/components/stack.partial.js

@@ -62,6 +62,10 @@ var baseStyles = (0, _react2.css)({
  * Stack is a primitive component based on flexbox that manages the vertical layout of direct children.
  * Renders a `div` by default.
  *
+ * @private
+ * @deprecated DSP-8009: This primitive is scheduled for deletion.
+ * Please use `Stack` from `@atlaskit/primitives` instead.
+ *
  */
 var Stack = /*#__PURE__*/(0, _react.memo)( /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   var gap = _ref.gap,

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/ds-explorations",
-	"version": "2.0.3",
+	"version": "2.0.5",
 	"sideEffects": false
 }

package/dist/es2019/components/box.partial.js

@@ -10,7 +10,9 @@ import { SurfaceContext } from './surface-provider';
  * Box is a primitive component that has the design decisions of the Atlassian Design System baked in.
  * Renders a `div` by default.
  *
- * @internal
+ * @private
+ * @deprecated DSP-8009: This primitive is scheduled for deletion.
+ * Please use `Box` from `@atlaskit/primitives` instead.
  */
 export const Box = /*#__PURE__*/forwardRef(({
   children,
@@ -87,7 +89,7 @@ const borderWidthMap = {
 };
 const borderRadiusMap = {
   normal: css({
-    borderRadius: '3px'
+    borderRadius: "var(--ds-radius-100, 3px)"
   }),
   rounded: css({
     borderRadius: '50%'

package/dist/es2019/components/inline.partial.js

@@ -72,6 +72,10 @@ const Divider = ({
  * Inline is a primitive component based on flexbox that manages the horizontal layout of direct children.
  * Renders a `div` by default.
  *
+ * @private
+ * @deprecated DSP-8009: This primitive is scheduled for deletion.
+ * Please use `Inline` from `@atlaskit/primitives` instead.
+ *
  * @example
  * ```tsx
  * const App = () => (

package/dist/es2019/components/stack.partial.js

@@ -55,6 +55,10 @@ const baseStyles = css({
  * Stack is a primitive component based on flexbox that manages the vertical layout of direct children.
  * Renders a `div` by default.
  *
+ * @private
+ * @deprecated DSP-8009: This primitive is scheduled for deletion.
+ * Please use `Stack` from `@atlaskit/primitives` instead.
+ *
  */
 const Stack = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
   gap,

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/ds-explorations",
-	"version": "2.0.3",
+	"version": "2.0.5",
 	"sideEffects": false
 }

package/dist/esm/components/box.partial.js

@@ -12,7 +12,9 @@ import { SurfaceContext } from './surface-provider';
  * Box is a primitive component that has the design decisions of the Atlassian Design System baked in.
  * Renders a `div` by default.
  *
- * @internal
+ * @private
+ * @deprecated DSP-8009: This primitive is scheduled for deletion.
+ * Please use `Box` from `@atlaskit/primitives` instead.
  */
 export var Box = /*#__PURE__*/forwardRef(function (_ref, ref) {
   var children = _ref.children,
@@ -90,7 +92,7 @@ var borderWidthMap = {
 };
 var borderRadiusMap = {
   normal: css({
-    borderRadius: '3px'
+    borderRadius: "var(--ds-radius-100, 3px)"
   }),
   rounded: css({
     borderRadius: '50%'

package/dist/esm/components/inline.partial.js

@@ -73,6 +73,10 @@ var Divider = function Divider(_ref) {
  * Inline is a primitive component based on flexbox that manages the horizontal layout of direct children.
  * Renders a `div` by default.
  *
+ * @private
+ * @deprecated DSP-8009: This primitive is scheduled for deletion.
+ * Please use `Inline` from `@atlaskit/primitives` instead.
+ *
  * @example
  * ```tsx
  * const App = () => (

package/dist/esm/components/stack.partial.js

@@ -55,6 +55,10 @@ var baseStyles = css({
  * Stack is a primitive component based on flexbox that manages the vertical layout of direct children.
  * Renders a `div` by default.
  *
+ * @private
+ * @deprecated DSP-8009: This primitive is scheduled for deletion.
+ * Please use `Stack` from `@atlaskit/primitives` instead.
+ *
  */
 var Stack = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (_ref, ref) {
   var gap = _ref.gap,

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/ds-explorations",
-	"version": "2.0.3",
+	"version": "2.0.5",
 	"sideEffects": false
 }

package/dist/types/components/box.partial.d.ts

@@ -2,6 +2,11 @@
 import { ComponentPropsWithoutRef, ComponentPropsWithRef, ElementType, FC, ReactElement, ReactNode } from 'react';
 import { Layer } from '../constants';
 import type { BasePrimitiveProps } from './types';
+/**
+ * @private
+ * @deprecated DSP-8009: This type is scheduled for deletion.
+ * Please use `Box` from `@atlaskit/primitives` instead.
+ */
 export declare type BoxProps<T extends ElementType = 'div'> = Omit<ComponentPropsWithoutRef<T>, 'as' | 'className' | 'style'> & BasePrimitiveProps & BoxPropsBase<T>;
 declare type BoxPropsBase<T extends ElementType> = {
     /**
@@ -113,7 +118,9 @@ declare type BoxComponent<T extends ElementType = 'div'> = (<T extends ElementTy
  * Box is a primitive component that has the design decisions of the Atlassian Design System baked in.
  * Renders a `div` by default.
  *
- * @internal
+ * @private
+ * @deprecated DSP-8009: This primitive is scheduled for deletion.
+ * Please use `Box` from `@atlaskit/primitives` instead.
  */
 export declare const Box: BoxComponent;
 export default Box;

package/dist/types/components/inline.partial.d.ts

@@ -1,6 +1,11 @@
 /** @jsx jsx */
 import { ReactNode } from 'react';
 import type { BasePrimitiveProps } from './types';
+/**
+ * @private
+ * @deprecated DSP-8009: This type is scheduled for deletion.
+ * Please use `Inline` from `@atlaskit/primitives` instead.
+ */
 export interface InlineProps extends BasePrimitiveProps {
     /**
      * Used to align children along the cross axis.
@@ -57,6 +62,10 @@ declare const flexWrapMap: {
  * Inline is a primitive component based on flexbox that manages the horizontal layout of direct children.
  * Renders a `div` by default.
  *
+ * @private
+ * @deprecated DSP-8009: This primitive is scheduled for deletion.
+ * Please use `Inline` from `@atlaskit/primitives` instead.
+ *
  * @example
  * ```tsx
  * const App = () => (

package/dist/types/components/stack.partial.d.ts

@@ -1,6 +1,11 @@
 /** @jsx jsx */
 import { ReactNode } from 'react';
 import { BasePrimitiveProps } from './types';
+/**
+ * @private
+ * @deprecated DSP-8009: This type is scheduled for deletion.
+ * Please use `Stack` from `@atlaskit/primitives` instead.
+ */
 export interface StackProps extends BasePrimitiveProps {
     /**
      * Used to align children along the cross axis.
@@ -50,6 +55,10 @@ declare const flexWrapMap: {
  * Stack is a primitive component based on flexbox that manages the vertical layout of direct children.
  * Renders a `div` by default.
  *
+ * @private
+ * @deprecated DSP-8009: This primitive is scheduled for deletion.
+ * Please use `Stack` from `@atlaskit/primitives` instead.
+ *
  */
 declare const Stack: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<StackProps & import("react").RefAttributes<HTMLDivElement>>>;
 export default Stack;

package/package.json

@@ -1,10 +1,9 @@
 {
   "name": "@atlaskit/ds-explorations",
-  "version": "2.0.3",
+  "version": "2.0.5",
   "description": "An experimental package for exploration and validation of spacing / typography foundations.",
   "license": "Apache-2.0",
   "atlassian": {
-    "disableProductCI": true,
     "team": "Design System Team",
     "inPublicMirror": false,
     "releaseModel": "continuous"
@@ -39,7 +38,7 @@
     "./inline": "./src/components/inline.partial.tsx"
   },
   "dependencies": {
-    "@atlaskit/tokens": "^1.1.0",
+    "@atlaskit/tokens": "^1.2.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/react": "^11.7.1",
     "tiny-invariant": "^1.2.0"

package/report.api.md

@@ -556,10 +556,10 @@ const textTransformMap: {
   uppercase: SerializedStyles;
 };
 
-// @internal
+// @public @deprecated
 export const UNSAFE_Box: BoxComponent;
 
-// @public (undocumented)
+// @public @deprecated (undocumented)
 export type UNSAFE_BoxProps<T extends ElementType = 'div'> = Omit<
   ComponentPropsWithoutRef<T>,
   'as' | 'className' | 'style'
@@ -567,12 +567,12 @@ export type UNSAFE_BoxProps<T extends ElementType = 'div'> = Omit<
   BasePrimitiveProps &
   BoxPropsBase<T>;
 
-// @public
+// @public @deprecated
 export const UNSAFE_Inline: MemoExoticComponent<
   ForwardRefExoticComponent<UNSAFE_InlineProps & RefAttributes<HTMLDivElement>>
 >;
 
-// @public (undocumented)
+// @public @deprecated (undocumented)
 export interface UNSAFE_InlineProps extends BasePrimitiveProps {
   alignItems?: FlexAlignItems_2;
   children: ReactNode;
@@ -589,12 +589,12 @@ export const UNSAFE_InteractionSurface: ({
   testId,
 }: InteractionSurfaceProps) => jsx.JSX.Element;
 
-// @public
+// @public @deprecated
 export const UNSAFE_Stack: MemoExoticComponent<
   ForwardRefExoticComponent<UNSAFE_StackProps & RefAttributes<HTMLDivElement>>
 >;
 
-// @public (undocumented)
+// @public @deprecated (undocumented)
 export interface UNSAFE_StackProps extends BasePrimitiveProps {
   alignItems?: FlexAlignItems_3;
   children: ReactNode;

package/src/components/box.partial.tsx

@@ -18,6 +18,11 @@ import { Layer, LAYERS } from '../constants';
 import { SurfaceContext } from './surface-provider';
 import type { BasePrimitiveProps } from './types';
 
+/**
+ * @private
+ * @deprecated DSP-8009: This type is scheduled for deletion.
+ * Please use `Box` from `@atlaskit/primitives` instead.
+ */
 export type BoxProps<T extends ElementType = 'div'> = Omit<
   ComponentPropsWithoutRef<T>,
   'as' | 'className' | 'style'
@@ -143,7 +148,9 @@ type BoxComponent<T extends ElementType = 'div'> = (<
  * Box is a primitive component that has the design decisions of the Atlassian Design System baked in.
  * Renders a `div` by default.
  *
- * @internal
+ * @private
+ * @deprecated DSP-8009: This primitive is scheduled for deletion.
+ * Please use `Box` from `@atlaskit/primitives` instead.
  */
 export const Box: BoxComponent = forwardRef(
   <T extends ElementType = 'div'>(
@@ -243,7 +250,7 @@ const borderWidthMap = {
 
 type BorderRadius = keyof typeof borderRadiusMap;
 const borderRadiusMap = {
-  normal: css({ borderRadius: '3px' }),
+  normal: css({ borderRadius: token('border.radius.100', '3px') }),
   rounded: css({ borderRadius: '50%' }),
   badge: css({ borderRadius: '8px' }),
 };

package/src/components/inline.partial.tsx

@@ -7,6 +7,11 @@ import { token } from '@atlaskit/tokens';
 
 import type { BasePrimitiveProps } from './types';
 
+/**
+ * @private
+ * @deprecated DSP-8009: This type is scheduled for deletion.
+ * Please use `Inline` from `@atlaskit/primitives` instead.
+ */
 export interface InlineProps extends BasePrimitiveProps {
   /**
    * Used to align children along the cross axis.
@@ -84,6 +89,10 @@ const Divider: FC = ({ children }) => (
  * Inline is a primitive component based on flexbox that manages the horizontal layout of direct children.
  * Renders a `div` by default.
  *
+ * @private
+ * @deprecated DSP-8009: This primitive is scheduled for deletion.
+ * Please use `Inline` from `@atlaskit/primitives` instead.
+ *
  * @example
  * ```tsx
  * const App = () => (

package/src/components/stack.partial.tsx

@@ -7,6 +7,11 @@ import { token } from '@atlaskit/tokens';
 
 import { BasePrimitiveProps } from './types';
 
+/**
+ * @private
+ * @deprecated DSP-8009: This type is scheduled for deletion.
+ * Please use `Stack` from `@atlaskit/primitives` instead.
+ */
 export interface StackProps extends BasePrimitiveProps {
   /**
    * Used to align children along the cross axis.
@@ -66,6 +71,10 @@ const baseStyles = css({
  * Stack is a primitive component based on flexbox that manages the vertical layout of direct children.
  * Renders a `div` by default.
  *
+ * @private
+ * @deprecated DSP-8009: This primitive is scheduled for deletion.
+ * Please use `Stack` from `@atlaskit/primitives` instead.
+ *
  */
 const Stack = memo(
   forwardRef<HTMLDivElement, StackProps>(

package/tmp/api-report-tmp.d.ts

@@ -540,16 +540,16 @@ const textTransformMap: {
     uppercase: SerializedStyles;
 };
 
-// @internal
+// @public @deprecated
 export const UNSAFE_Box: BoxComponent;
 
-// @public (undocumented)
+// @public @deprecated (undocumented)
 export type UNSAFE_BoxProps<T extends ElementType = 'div'> = Omit<ComponentPropsWithoutRef<T>, 'as' | 'className' | 'style'> & BasePrimitiveProps & BoxPropsBase<T>;
 
-// @public
+// @public @deprecated
 export const UNSAFE_Inline: MemoExoticComponent<ForwardRefExoticComponent<UNSAFE_InlineProps & RefAttributes<HTMLDivElement>>>;
 
-// @public (undocumented)
+// @public @deprecated (undocumented)
 export interface UNSAFE_InlineProps extends BasePrimitiveProps {
     alignItems?: FlexAlignItems_2;
     children: ReactNode;
@@ -562,10 +562,10 @@ export interface UNSAFE_InlineProps extends BasePrimitiveProps {
 // @public (undocumented)
 export const UNSAFE_InteractionSurface: ({ appearance, children, testId, }: InteractionSurfaceProps) => jsx.JSX.Element;
 
-// @public
+// @public @deprecated
 export const UNSAFE_Stack: MemoExoticComponent<ForwardRefExoticComponent<UNSAFE_StackProps & RefAttributes<HTMLDivElement>>>;
 
-// @public (undocumented)
+// @public @deprecated (undocumented)
 export interface UNSAFE_StackProps extends BasePrimitiveProps {
     alignItems?: FlexAlignItems_3;
     children: ReactNode;