@atlaskit/ds-explorations 2.0.10 → 2.0.12

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/ds-explorations
 
+## 2.0.12
+
+### Patch Changes
+
+- [`2e01c9c74b5`](https://bitbucket.org/atlassian/atlassian-frontend/commits/2e01c9c74b5) - DUMMY remove before merging to master; dupe adf-schema via adf-utils
+
+## 2.0.11
+
+### Patch Changes
+
+- [`a02eed2974e`](https://bitbucket.org/atlassian/atlassian-frontend/commits/a02eed2974e) - Move codegen into @atlassian scope to publish it to private registry
+
 ## 2.0.10
 
 ### Patch Changes

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

@@ -12,6 +12,15 @@ var _react2 = require("@emotion/react");
 var _constants = require("../constants");
 var _surfaceProvider = require("./surface-provider");
 var _excluded = ["children", "as", "className", "display", "flexDirection", "alignItems", "justifyContent", "backgroundColor", "borderColor", "borderStyle", "borderWidth", "borderRadius", "shadow", "layer", "padding", "paddingBlock", "paddingInline", "position", "height", "overflow", "width", "UNSAFE_style", "testId"];
+/** @jsx jsx */
+/**
+ * @private
+ * @deprecated DSP-8009: This type is scheduled for deletion.
+ * Please use `Box` from `@atlaskit/primitives` instead.
+ */
+
+// Without this type annotation on Box we don't get autocomplete for props due to forwardRef types
+
 /**
  * __Box__
  *
@@ -273,7 +282,6 @@ var heightMap = {
 /**
  * @codegenEnd
  */
-
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
  * @codegen <<SignedSource::0ba10ee53636df14b0db65fa1adbc94c>>
@@ -417,7 +425,6 @@ var paddingInlineMap = {
 /**
  * @codegenEnd
  */
-
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
  * @codegen <<SignedSource::514663609a5a48a284de40c5c4ad200b>>
@@ -567,7 +574,6 @@ var shadowMap = {
 /**
  * @codegenEnd
  */
-
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
  * @codegen <<SignedSource::bacbea271b30ec7d2f61306c9a8a9e63>>

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

@@ -8,6 +8,12 @@ var _react = require("react");
 var _react2 = require("@emotion/react");
 /** @jsx jsx */
 
+/**
+ * @private
+ * @deprecated DSP-8009: This type is scheduled for deletion.
+ * Please use `Inline` from `@atlaskit/primitives` instead.
+ */
+
 var flexAlignItemsMap = {
   center: (0, _react2.css)({
     alignItems: 'center'

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

@@ -8,6 +8,12 @@ var _react = require("react");
 var _react2 = require("@emotion/react");
 /** @jsx jsx */
 
+/**
+ * @private
+ * @deprecated DSP-8009: This type is scheduled for deletion.
+ * Please use `Stack` from `@atlaskit/primitives` instead.
+ */
+
 var flexAlignItemsMap = {
   center: (0, _react2.css)({
     alignItems: 'center'

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

@@ -12,6 +12,7 @@ var _tinyInvariant = _interopRequireDefault(require("tiny-invariant"));
 var _colorMap = _interopRequireDefault(require("../internal/color-map"));
 var _surfaceProvider = require("./surface-provider");
 var _excluded = ["children"];
+/** @jsx jsx */
 var asAllowlist = ['span', 'div', 'p', 'strong'];
 var textAlignMap = {
   center: (0, _react2.css)({
@@ -206,7 +207,6 @@ var lineHeightMap = {
 /**
  * @codegenEnd
  */
-
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
  * @codegen <<SignedSource::3780858df77f5fe0c6e0f39a4c989741>>

package/dist/cjs/version.json

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

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

@@ -4,6 +4,15 @@ import { forwardRef } from 'react';
 import { css, jsx } from '@emotion/react';
 import { LAYERS } from '../constants';
 import { SurfaceContext } from './surface-provider';
+
+/**
+ * @private
+ * @deprecated DSP-8009: This type is scheduled for deletion.
+ * Please use `Box` from `@atlaskit/primitives` instead.
+ */
+
+// Without this type annotation on Box we don't get autocomplete for props due to forwardRef types
+
 /**
  * __Box__
  *
@@ -265,7 +274,6 @@ const heightMap = {
 /**
  * @codegenEnd
  */
-
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
  * @codegen <<SignedSource::0ba10ee53636df14b0db65fa1adbc94c>>
@@ -409,7 +417,6 @@ const paddingInlineMap = {
 /**
  * @codegenEnd
  */
-
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
  * @codegen <<SignedSource::514663609a5a48a284de40c5c4ad200b>>
@@ -559,7 +566,6 @@ const shadowMap = {
 /**
  * @codegenEnd
  */
-
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
  * @codegen <<SignedSource::bacbea271b30ec7d2f61306c9a8a9e63>>

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

@@ -1,6 +1,13 @@
 /** @jsx jsx */
 import { Children, forwardRef, Fragment, memo } from 'react';
 import { css, jsx } from '@emotion/react';
+
+/**
+ * @private
+ * @deprecated DSP-8009: This type is scheduled for deletion.
+ * Please use `Inline` from `@atlaskit/primitives` instead.
+ */
+
 const flexAlignItemsMap = {
   center: css({
     alignItems: 'center'

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

@@ -1,6 +1,13 @@
 /** @jsx jsx */
 import { forwardRef, memo } from 'react';
 import { css, jsx } from '@emotion/react';
+
+/**
+ * @private
+ * @deprecated DSP-8009: This type is scheduled for deletion.
+ * Please use `Stack` from `@atlaskit/primitives` instead.
+ */
+
 const flexAlignItemsMap = {
   center: css({
     alignItems: 'center'

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

@@ -197,7 +197,6 @@ const lineHeightMap = {
 /**
  * @codegenEnd
  */
-
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
  * @codegen <<SignedSource::3780858df77f5fe0c6e0f39a4c989741>>

package/dist/es2019/version.json

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

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

@@ -6,6 +6,15 @@ import { forwardRef } from 'react';
 import { css, jsx } from '@emotion/react';
 import { LAYERS } from '../constants';
 import { SurfaceContext } from './surface-provider';
+
+/**
+ * @private
+ * @deprecated DSP-8009: This type is scheduled for deletion.
+ * Please use `Box` from `@atlaskit/primitives` instead.
+ */
+
+// Without this type annotation on Box we don't get autocomplete for props due to forwardRef types
+
 /**
  * __Box__
  *
@@ -268,7 +277,6 @@ var heightMap = {
 /**
  * @codegenEnd
  */
-
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
  * @codegen <<SignedSource::0ba10ee53636df14b0db65fa1adbc94c>>
@@ -412,7 +420,6 @@ var paddingInlineMap = {
 /**
  * @codegenEnd
  */
-
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
  * @codegen <<SignedSource::514663609a5a48a284de40c5c4ad200b>>
@@ -562,7 +569,6 @@ var shadowMap = {
 /**
  * @codegenEnd
  */
-
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
  * @codegen <<SignedSource::bacbea271b30ec7d2f61306c9a8a9e63>>

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

@@ -1,6 +1,13 @@
 /** @jsx jsx */
 import { Children, forwardRef, Fragment, memo } from 'react';
 import { css, jsx } from '@emotion/react';
+
+/**
+ * @private
+ * @deprecated DSP-8009: This type is scheduled for deletion.
+ * Please use `Inline` from `@atlaskit/primitives` instead.
+ */
+
 var flexAlignItemsMap = {
   center: css({
     alignItems: 'center'

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

@@ -1,6 +1,13 @@
 /** @jsx jsx */
 import { forwardRef, memo } from 'react';
 import { css, jsx } from '@emotion/react';
+
+/**
+ * @private
+ * @deprecated DSP-8009: This type is scheduled for deletion.
+ * Please use `Stack` from `@atlaskit/primitives` instead.
+ */
+
 var flexAlignItemsMap = {
   center: css({
     alignItems: 'center'

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

@@ -200,7 +200,6 @@ var lineHeightMap = {
 /**
  * @codegenEnd
  */
-
 /**
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
  * @codegen <<SignedSource::3780858df77f5fe0c6e0f39a4c989741>>

package/dist/esm/version.json

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

package/examples/01-box.tsx

@@ -12,10 +12,10 @@ import { spacingScale } from '../src/internal/spacing-scale';
  */
 export default () => {
   return (
-    <Stack space="400" alignInline="start">
-      <Stack space="200" testId="box-with-background-and-paddingBlock">
+    <Stack space="space.400" alignInline="start">
+      <Stack space="space.200" testId="box-with-background-and-paddingBlock">
         <Heading level="h600">paddingBlock</Heading>
-        <Inline space="200" alignBlock="center">
+        <Inline space="space.200" alignBlock="center">
           {spacingScale.map((space) => (
             <Box
               key={space}
@@ -30,9 +30,9 @@ export default () => {
         </Inline>
       </Stack>
 
-      <Stack space="200" testId="box-with-background-and-paddingInline">
+      <Stack space="space.200" testId="box-with-background-and-paddingInline">
         <Heading level="h600">paddingInline</Heading>
-        <Stack space="200" alignInline="center">
+        <Stack space="space.200" alignInline="center">
           {spacingScale.map((space) => (
             <Box
               key={space}
@@ -47,9 +47,9 @@ export default () => {
         </Stack>
       </Stack>
 
-      <Stack space="200" testId="box-with-background-and-padding">
+      <Stack space="space.200" testId="box-with-background-and-padding">
         <Heading level="h600">padding</Heading>
-        <Inline space="200" alignBlock="center">
+        <Inline space="space.200" alignBlock="center">
           {spacingScale.map((space) => (
             <Box key={space} backgroundColor="discovery.bold" padding={space}>
               <Box backgroundColor="elevation.surface" justifyContent="center">
@@ -60,9 +60,9 @@ export default () => {
         </Inline>
       </Stack>
 
-      <Stack space="200" testId="box-with-backgroundColor">
+      <Stack space="space.200" testId="box-with-backgroundColor">
         <Heading level="h600">backgroundColor</Heading>
-        <Inline space="200" alignBlock="center">
+        <Inline space="space.200" alignBlock="center">
           {(
             [
               'discovery.bold',
@@ -82,9 +82,9 @@ export default () => {
         </Inline>
       </Stack>
 
-      <Stack space="200" testId="box-with-borderColor">
+      <Stack space="space.200" testId="box-with-borderColor">
         <Heading level="h600">borderColor</Heading>
-        <Inline space="200" alignBlock="center">
+        <Inline space="space.200" alignBlock="center">
           {(
             [
               'discovery',
@@ -111,9 +111,9 @@ export default () => {
         </Inline>
       </Stack>
 
-      <Stack space="200" testId="box-with-shadow">
+      <Stack space="space.200" testId="box-with-shadow">
         <Heading level="h600">shadow</Heading>
-        <Inline space="200" alignBlock="center">
+        <Inline space="space.200" alignBlock="center">
           {(['raised', 'overflow', 'overlay'] as const).map((shadow) => (
             <Box
               key={shadow}
@@ -129,7 +129,7 @@ export default () => {
         </Inline>
       </Stack>
 
-      <Stack space="200" testId="box-with-layer">
+      <Stack space="space.200" testId="box-with-layer">
         <Heading level="h600">layer</Heading>
         <Box alignItems="center" UNSAFE_style={{ width: 800, height: 650 }}>
           {(

package/examples/02-text-advanced.tsx

@@ -7,7 +7,7 @@ import Text from '../src/components/text.partial';
 
 export default () => {
   return (
-    <Inline space="100">
+    <Inline space="space.100">
       <Box
         paddingBlock="space.400"
         paddingInline="space.400"

package/examples/02-text.tsx

@@ -8,14 +8,14 @@ import { UNSAFE_Box as Box, UNSAFE_Text as Text } from '../src';
 
 export default () => {
   return (
-    <Stack space="300">
+    <Stack space="space.300">
       <Heading level="h400" as="h3">
         Text examples
       </Heading>
-      <Stack space="200">
+      <Stack space="space.200">
         <Box display="block">
           <Heading level="h300">Font size</Heading>
-          <Inline space="200" testId="font-sizes">
+          <Inline space="space.200" testId="font-sizes">
             {(
               [
                 'size.050',
@@ -38,7 +38,7 @@ export default () => {
           <Heading level="h300" as="h4">
             Font weight
           </Heading>
-          <Inline space="200" testId="font-weights">
+          <Inline space="space.200" testId="font-weights">
             {(['regular', 'medium', 'semibold', 'bold'] as const).map(
               (fontWeight) => (
                 <Text key={fontWeight} fontWeight={fontWeight}>
@@ -52,7 +52,7 @@ export default () => {
           <Heading level="h300" as="h4">
             Line height
           </Heading>
-          <Inline space="200" testId="line-heights" alignBlock="center">
+          <Inline space="space.200" testId="line-heights" alignBlock="center">
             {(
               [
                 'lineHeight.100',
@@ -77,7 +77,7 @@ export default () => {
           <Heading level="h300" as="h4">
             Testing
           </Heading>
-          <Stack space="050" testId="testing">
+          <Stack space="space.050" testId="testing">
             <Text as="p">Paragraph</Text>
             <Text as="div">A div</Text>
             <Text>

package/examples/06-section-message.tsx

@@ -18,18 +18,18 @@ import Text from '../src/components/text.partial';
 
 export default () => {
   return (
-    <Stack space="100">
+    <Stack space="space.100">
       <Box
         paddingBlock="space.200"
         paddingInline="space.200"
         backgroundColor="information"
       >
-        <Inline space="200">
+        <Inline space="space.200">
           <InfoIcon
             primaryColor={token('color.icon.information')}
             label="info"
           />
-          <Stack space="100">
+          <Stack space="space.100">
             <Heading as="h1" level="h500">
               The Modern Prometheus
             </Heading>
@@ -40,7 +40,7 @@ export default () => {
               to assure my dear sister of my welfare and increasing confidence
               in the success of my undertaking.
             </Text>
-            <Inline separator="·" space="075">
+            <Inline separator="·" space="space.075">
               <Button
                 appearance="link"
                 spacing="none"

package/examples/07-comment.tsx

@@ -27,8 +27,8 @@ const CommentAction = ({ children }: any) => {
 export default () => {
   return (
     <Box>
-      <Stack space="050">
-        <Inline space="100" alignBlock="center">
+      <Stack space="space.050">
+        <Inline space="space.100" alignBlock="center">
           <Author>Jane Citizen</Author>
           <Lozenge>Author</Lozenge>
           <Date>Jun 15, 2022</Date>
@@ -41,7 +41,7 @@ export default () => {
           aliquip ex ea commodo consequat.
         </Text>
         <Box color="subtle">
-          <Inline space="100" separator="·">
+          <Inline space="space.100" separator="·">
             <CommentAction>Reply</CommentAction>
             <CommentAction>Edit</CommentAction>
             <CommentAction>Like</CommentAction>

package/examples/08-lozenge.tsx

@@ -8,7 +8,7 @@ import { UNSAFE_Box as Box, UNSAFE_Text as Text } from '../src';
 
 export default () => {
   return (
-    <Inline space="200">
+    <Inline space="space.200">
       <Lozenge>Default</Lozenge>
       <Box
         backgroundColor="neutral"

package/examples/99-interactions.tsx

@@ -36,9 +36,9 @@ const fieldsetStyles = css({
 export default () => {
   return (
     <Box width="size.500" padding="space.100" testId="all">
-      <Stack space="200">
+      <Stack space="space.200">
         <Heading level="h400">Current ADS Buttons</Heading>
-        <Inline space="200">
+        <Inline space="space.200">
           <Button appearance="primary">brand.bold</Button>
           <Button appearance="default">neutral</Button>
           <Button appearance="warning">warning.bold</Button>
@@ -46,7 +46,7 @@ export default () => {
         <Heading level="h400">
           Buttons with <Code>InteractionSurface</Code>
         </Heading>
-        <Inline space="200" testId="buttons">
+        <Inline space="space.200" testId="buttons">
           {(['brand.bold', 'neutral', 'warning.bold'] as const).map((app) => (
             <FocusRing key={app}>
               <Box
@@ -74,7 +74,7 @@ export default () => {
         <Heading level="h400">
           Icon Buttons with <Code>InteractionSurface</Code>
         </Heading>
-        <Inline space="200" testId="icon-buttons">
+        <Inline space="space.200" testId="icon-buttons">
           <FocusRing>
             <Box
               as="button"
@@ -129,7 +129,7 @@ export default () => {
         <Heading level="h400">
           Progress Indicator with <Code>InteractionSurface</Code>
         </Heading>
-        <Inline space="200" testId="progress-indicators">
+        <Inline space="space.200" testId="progress-indicators">
           {(['brand.bold', 'neutral', 'warning.bold'] as const).map((app) => (
             <FocusRing>
               <Box
@@ -149,7 +149,7 @@ export default () => {
           ))}
         </Inline>
         <Heading level="h400">Textfield / input spikes</Heading>
-        <Inline space="200">
+        <Inline space="space.200">
           <Textfield />
           <Box
             as="fieldset"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/ds-explorations",
-  "version": "2.0.10",
+  "version": "2.0.12",
   "description": "An experimental package for exploration and validation of spacing / typography foundations.",
   "license": "Apache-2.0",
   "atlassian": {
@@ -13,7 +13,7 @@
   },
   "repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
   "scripts": {
-    "ak-postbuild": "cd ../../../ && yarn build @af/codegen && yarn build @atlaskit/tokens && cd packages/design-system/ds-explorations && yarn codegen-styles",
+    "ak-postbuild": "cd ../../../ && yarn build @atlassian/codegen -d cjs,esm,es2019 && yarn build @atlaskit/tokens && cd packages/design-system/ds-explorations && yarn codegen-styles",
     "codegen-styles": "ts-node --project ../../../tsconfig.node.json ./scripts/codegen-styles",
     "prepare": "yarn ak-postbuild"
   },
@@ -47,7 +47,6 @@
     "react": "^16.8.0"
   },
   "devDependencies": {
-    "@af/codegen": "*",
     "@atlaskit/badge": "*",
     "@atlaskit/button": "*",
     "@atlaskit/code": "*",
@@ -57,13 +56,14 @@
     "@atlaskit/heading": "*",
     "@atlaskit/icon": "*",
     "@atlaskit/lozenge": "*",
-    "@atlaskit/primitives": "^0.4.0",
+    "@atlaskit/primitives": "^0.8.0",
     "@atlaskit/section-message": "*",
     "@atlaskit/ssr": "*",
     "@atlaskit/textfield": "*",
     "@atlaskit/visual-regression": "*",
     "@atlaskit/webdriver-runner": "*",
     "@atlassian/atlassian-frontend-prettier-config-1.0.1": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.1",
+    "@atlassian/codegen": "^0.0.1",
     "@testing-library/react": "^12.1.5",
     "fs-extra": "^4.0.2",
     "prettier": "^2.7.0",

package/scripts/codegen-styles.tsx

@@ -2,7 +2,10 @@
 import { writeFile } from 'fs/promises';
 import { join } from 'path';
 
-import { createPartialSignedArtifact, createSignedArtifact } from '@af/codegen';
+import {
+  createPartialSignedArtifact,
+  createSignedArtifact,
+} from '@atlassian/codegen';
 
 import { createColorStylesFromTemplate } from './color-codegen-template';
 import { createColorMapTemplate } from './color-map-template';