@atlaskit/primitives - npm Package Compare versions

Comparing version 0.7.1 to 0.8.0

CHANGELOG.md

 # @atlaskit/primitives
 
+## 0.8.0
+
+### Minor Changes
+
+- [`ac4c8695d3f`](https://bitbucket.org/atlassian/atlassian-frontend/commits/ac4c8695d3f) - Constrain CSS values of flex-direction to account for accessibility considerations.
+- [`4d19bdd2218`](https://bitbucket.org/atlassian/atlassian-frontend/commits/4d19bdd2218) - **Inline**:
+
+  - `space` prop now accepts values in the form `space.XXX`. For example: `space="space.100"`.
+  - `rowSpace` prop now accepts values in the form `space.XXX`. For example: `rowSpace="space.100"`.
+
+  **Stack**:
+
+  - `space` prop now accepts values in the form `space.XXX`. For example: `space="space.100"`.
+
 ## 0.7.1
@@ -4,0 +18,0 @@

dist/cjs/index.js

@@ -32,4 +32,4 @@ "use strict";
 var _box = _interopRequireDefault(require("./components/box"));
-var _inline = _interopRequireDefault(require("./components/inline.partial"));
+var _inline = _interopRequireDefault(require("./components/inline"));
 var _xcss = require("./internal/xcss");
-var _stack = _interopRequireDefault(require("./components/stack.partial"));
+var _stack = _interopRequireDefault(require("./components/stack"));

dist/cjs/internal/style-maps.partial.js

@@ -7,3 +7,3 @@ "use strict";
 });
-exports.textColorMap = exports.shadowMap = exports.positionMap = exports.paddingStylesMap = exports.paddingMap = exports.overflowMap = exports.overflowInlineMap = exports.overflowBlockMap = exports.layerMap = exports.flexShrinkMap = exports.flexMap = exports.flexGrowMap = exports.dimensionMap = exports.borderWidthMap = exports.borderStyleMap = exports.borderRadiusMap = exports.borderColorMap = exports.backgroundColorStylesMap = exports.backgroundColorMap = exports.alignSelfMap = void 0;
+exports.textColorMap = exports.spaceStylesMap = exports.spaceMap = exports.shadowMap = exports.positionMap = exports.paddingStylesMap = exports.paddingMap = exports.overflowMap = exports.overflowInlineMap = exports.overflowBlockMap = exports.layerMap = exports.flexShrinkMap = exports.flexMap = exports.flexGrowMap = exports.flexDirectionMap = exports.dimensionMap = exports.borderWidthMap = exports.borderStyleMap = exports.borderRadiusMap = exports.borderColorMap = exports.backgroundColorStylesMap = exports.backgroundColorMap = exports.alignSelfMap = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
@@ -36,6 +36,6 @@ var _react = require("@emotion/react");
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::c9769f86fc43a4afcc45953fc5f06926>>
+ * @codegen <<SignedSource::b8ac4fd29ba83e2ab1c2713c35915067>>
  * @codegenId spacing
  * @codegenCommand yarn codegen-styles
- * @codegenParams ["padding"]
+ * @codegenParams ["padding", "space"]
  * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::167d3b69b159ae33e74d4ea5ab7eade6>>
@@ -60,2 +60,19 @@ */
 exports.paddingMap = paddingMap;
+var spaceMap = {
+  'space.0': "var(--ds-space-0, 0px)",
+  'space.025': "var(--ds-space-025, 2px)",
+  'space.050': "var(--ds-space-050, 4px)",
+  'space.075': "var(--ds-space-075, 6px)",
+  'space.100': "var(--ds-space-100, 8px)",
+  'space.150': "var(--ds-space-150, 12px)",
+  'space.200': "var(--ds-space-200, 16px)",
+  'space.250': "var(--ds-space-250, 20px)",
+  'space.300': "var(--ds-space-300, 24px)",
+  'space.400': "var(--ds-space-400, 32px)",
+  'space.500': "var(--ds-space-500, 40px)",
+  'space.600': "var(--ds-space-600, 48px)",
+  'space.800': "var(--ds-space-800, 64px)",
+  'space.1000': "var(--ds-space-1000, 80px)"
+};
+exports.spaceMap = spaceMap;
 /**
@@ -253,6 +270,6 @@ * @codegenEnd
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::dd62140c127dcca8e478ad22341d4626>>
+ * @codegen <<SignedSource::8ab54fc337c6a02f403dad852dd626a0>>
  * @codegenId misc
  * @codegenCommand yarn codegen-styles
- * @codegenParams ["align-self", "border-style", "display", "flex-grow", "flex-shrink", "flex", "layer", "overflow", "position"]
+ * @codegenParams ["align-self", "border-style", "display", "flex-direction", "flex-grow", "flex-shrink", "flex", "layer", "overflow", "position"]
  * @codegenDependency ../../scripts/codegen-file-templates/align-self.tsx <<SignedSource::074079802534462de54bf882bb2073e5>>
@@ -262,2 +279,3 @@ * @codegenDependency ../../scripts/codegen-file-templates/border-style.tsx <<SignedSource::87e7e289ffeaac901997c4af98084a5f>>
  * @codegenDependency ../../scripts/codegen-file-templates/display.tsx <<SignedSource::e6e390f80609060bfd12a55a489d5f54>>
+ * @codegenDependency ../../scripts/codegen-file-templates/flex-direction.tsx <<SignedSource::19809ba11675679c188b0d98fb651dc1>>
  * @codegenDependency ../../scripts/codegen-file-templates/flex-grow.tsx <<SignedSource::b8a06b122cb609170f1f42778a6c270e>>
@@ -283,2 +301,7 @@ * @codegenDependency ../../scripts/codegen-file-templates/flex-shrink.tsx <<SignedSource::bf6626972898bf22d2eeee2130693d47>>
 exports.borderStyleMap = borderStyleMap;
+var flexDirectionMap = {
+  row: 'row',
+  column: 'column'
+};
+exports.flexDirectionMap = flexDirectionMap;
 var flexGrowMap = {
@@ -363,3 +386,3 @@ '0': 0,
 exports.borderRadiusMap = borderRadiusMap;
-var spacingProperties = ['padding', 'paddingBlock', 'paddingBlockStart', 'paddingBlockEnd', 'paddingInline', 'paddingInlineStart', 'paddingInlineEnd'];
+var spacingProperties = ['padding', 'paddingBlock', 'paddingBlockStart', 'paddingBlockEnd', 'paddingInline', 'paddingInlineStart', 'paddingInlineEnd', 'gap', 'rowGap'];
 var getSerializedStylesMap = function getSerializedStylesMap(cssProperty, tokenMap) {
@@ -376,3 +399,8 @@ return Object.keys(tokenMap).reduce(function (emotionSpacingMap, token) {
 exports.paddingStylesMap = paddingStylesMap;
+var spaceStylesMap = spacingProperties.reduce(function (styleMap, spacingProperty) {
+  styleMap[spacingProperty] = getSerializedStylesMap(spacingProperty, spaceMap);
+  return styleMap;
+}, {});
+exports.spaceStylesMap = spaceStylesMap;
 var backgroundColorStylesMap = getSerializedStylesMap('backgroundColor', backgroundColorMap);
 exports.backgroundColorStylesMap = backgroundColorStylesMap;

dist/cjs/internal/xcss.js

@@ -7,3 +7,3 @@ "use strict";
 });
-exports.transformStyles = exports.parseXcss = void 0;
+exports.parseXcss = void 0;
 exports.xcss = xcss;
@@ -42,7 +42,4 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 };
-
-/**
- * Only exposed for testing.
- * @internal
- */
+var reNestedSelectors = /(\.|\s|&+|\*\>|#|\[.*\])/;
+var rePseudos = /^::?.*$/;
 var transformStyles = function transformStyles(styleObj) {
@@ -65,3 +62,3 @@ if (!styleObj || (0, _typeof2.default)(styleObj) !== 'object') {
       // We don't support `.class`, `[data-testid]`, `> *`, `#some-id`
-      if (/(\.|\s|&+|\*\>|#|\[.*\])/.test(key)) {
+      if (reNestedSelectors.test(key)) {
         throw new Error("Styles not supported for key '".concat(key, "'."));
@@ -73,3 +70,3 @@ }
     // So, call transformStyles on the value
-    if (/^::?.*$/.test(key)) {
+    if (rePseudos.test(key)) {
       styleObj[key] = transformStyles(value);
@@ -99,3 +96,2 @@ return;
 };
-exports.transformStyles = transformStyles;
 var baseXcss = function baseXcss(style) {
@@ -102,0 +98,0 @@ var transformedStyles = transformStyles(style);

dist/cjs/version.json

 {
 	"name": "@atlaskit/primitives",
-	"version": "0.7.1",
+	"version": "0.8.0",
 	"sideEffects": false
 }

dist/es2019/index.js

 export { default as Box } from './components/box';
-export { default as Inline } from './components/inline.partial';
+export { default as Inline } from './components/inline';
 export { xcss } from './internal/xcss';
-export { default as Stack } from './components/stack.partial';
+export { default as Stack } from './components/stack';

dist/es2019/internal/style-maps.partial.js

@@ -25,6 +25,6 @@ import { css } from '@emotion/react';
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::c9769f86fc43a4afcc45953fc5f06926>>
+ * @codegen <<SignedSource::b8ac4fd29ba83e2ab1c2713c35915067>>
  * @codegenId spacing
  * @codegenCommand yarn codegen-styles
- * @codegenParams ["padding"]
+ * @codegenParams ["padding", "space"]
  * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::167d3b69b159ae33e74d4ea5ab7eade6>>
@@ -48,2 +48,18 @@ */
 };
+export const spaceMap = {
+  'space.0': "var(--ds-space-0, 0px)",
+  'space.025': "var(--ds-space-025, 2px)",
+  'space.050': "var(--ds-space-050, 4px)",
+  'space.075': "var(--ds-space-075, 6px)",
+  'space.100': "var(--ds-space-100, 8px)",
+  'space.150': "var(--ds-space-150, 12px)",
+  'space.200': "var(--ds-space-200, 16px)",
+  'space.250': "var(--ds-space-250, 20px)",
+  'space.300': "var(--ds-space-300, 24px)",
+  'space.400': "var(--ds-space-400, 32px)",
+  'space.500': "var(--ds-space-500, 40px)",
+  'space.600': "var(--ds-space-600, 48px)",
+  'space.800': "var(--ds-space-800, 64px)",
+  'space.1000': "var(--ds-space-1000, 80px)"
+};
 /**
@@ -235,6 +251,6 @@ * @codegenEnd
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::dd62140c127dcca8e478ad22341d4626>>
+ * @codegen <<SignedSource::8ab54fc337c6a02f403dad852dd626a0>>
  * @codegenId misc
  * @codegenCommand yarn codegen-styles
- * @codegenParams ["align-self", "border-style", "display", "flex-grow", "flex-shrink", "flex", "layer", "overflow", "position"]
+ * @codegenParams ["align-self", "border-style", "display", "flex-direction", "flex-grow", "flex-shrink", "flex", "layer", "overflow", "position"]
  * @codegenDependency ../../scripts/codegen-file-templates/align-self.tsx <<SignedSource::074079802534462de54bf882bb2073e5>>
@@ -244,2 +260,3 @@ * @codegenDependency ../../scripts/codegen-file-templates/border-style.tsx <<SignedSource::87e7e289ffeaac901997c4af98084a5f>>
  * @codegenDependency ../../scripts/codegen-file-templates/display.tsx <<SignedSource::e6e390f80609060bfd12a55a489d5f54>>
+ * @codegenDependency ../../scripts/codegen-file-templates/flex-direction.tsx <<SignedSource::19809ba11675679c188b0d98fb651dc1>>
  * @codegenDependency ../../scripts/codegen-file-templates/flex-grow.tsx <<SignedSource::b8a06b122cb609170f1f42778a6c270e>>
@@ -263,2 +280,6 @@ * @codegenDependency ../../scripts/codegen-file-templates/flex-shrink.tsx <<SignedSource::bf6626972898bf22d2eeee2130693d47>>
 };
+export const flexDirectionMap = {
+  row: 'row',
+  column: 'column'
+};
 export const flexGrowMap = {
@@ -333,3 +354,3 @@ '0': 0,
 
-const spacingProperties = ['padding', 'paddingBlock', 'paddingBlockStart', 'paddingBlockEnd', 'paddingInline', 'paddingInlineStart', 'paddingInlineEnd'];
+const spacingProperties = ['padding', 'paddingBlock', 'paddingBlockStart', 'paddingBlockEnd', 'paddingInline', 'paddingInlineStart', 'paddingInlineEnd', 'gap', 'rowGap'];
 const getSerializedStylesMap = (cssProperty, tokenMap) => {
@@ -347,2 +368,6 @@ return Object.keys(tokenMap).reduce((emotionSpacingMap, token) => {
 }, {});
+export const spaceStylesMap = spacingProperties.reduce((styleMap, spacingProperty) => {
+  styleMap[spacingProperty] = getSerializedStylesMap(spacingProperty, spaceMap);
+  return styleMap;
+}, {});
 export const backgroundColorStylesMap = getSerializedStylesMap('backgroundColor', backgroundColorMap);

dist/es2019/internal/xcss.js

@@ -28,8 +28,5 @@ /* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
 const isSafeEnvToThrow = () => typeof process === 'object' && typeof process.env === 'object' && process.env.NODE_ENV !== 'production';
-
-/**
- * Only exposed for testing.
- * @internal
- */
-export const transformStyles = styleObj => {
+const reNestedSelectors = /(\.|\s|&+|\*\>|#|\[.*\])/;
+const rePseudos = /^::?.*$/;
+const transformStyles = styleObj => {
   if (!styleObj || typeof styleObj !== 'object') {
@@ -48,3 +45,3 @@ return styleObj;
       // We don't support `.class`, `[data-testid]`, `> *`, `#some-id`
-      if (/(\.|\s|&+|\*\>|#|\[.*\])/.test(key)) {
+      if (reNestedSelectors.test(key)) {
         throw new Error(`Styles not supported for key '${key}'.`);
@@ -56,3 +53,3 @@ }
     // So, call transformStyles on the value
-    if (/^::?.*$/.test(key)) {
+    if (rePseudos.test(key)) {
       styleObj[key] = transformStyles(value);
@@ -59,0 +56,0 @@ return;

dist/es2019/version.json

 {
 	"name": "@atlaskit/primitives",
-	"version": "0.7.1",
+	"version": "0.8.0",
 	"sideEffects": false
 }

dist/esm/index.js

 export { default as Box } from './components/box';
-export { default as Inline } from './components/inline.partial';
+export { default as Inline } from './components/inline';
 export { xcss } from './internal/xcss';
-export { default as Stack } from './components/stack.partial';
+export { default as Stack } from './components/stack';

dist/esm/internal/style-maps.partial.js

@@ -26,6 +26,6 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::c9769f86fc43a4afcc45953fc5f06926>>
+ * @codegen <<SignedSource::b8ac4fd29ba83e2ab1c2713c35915067>>
  * @codegenId spacing
  * @codegenCommand yarn codegen-styles
- * @codegenParams ["padding"]
+ * @codegenParams ["padding", "space"]
  * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::167d3b69b159ae33e74d4ea5ab7eade6>>
@@ -49,2 +49,18 @@ */
 };
+export var spaceMap = {
+  'space.0': "var(--ds-space-0, 0px)",
+  'space.025': "var(--ds-space-025, 2px)",
+  'space.050': "var(--ds-space-050, 4px)",
+  'space.075': "var(--ds-space-075, 6px)",
+  'space.100': "var(--ds-space-100, 8px)",
+  'space.150': "var(--ds-space-150, 12px)",
+  'space.200': "var(--ds-space-200, 16px)",
+  'space.250': "var(--ds-space-250, 20px)",
+  'space.300': "var(--ds-space-300, 24px)",
+  'space.400': "var(--ds-space-400, 32px)",
+  'space.500': "var(--ds-space-500, 40px)",
+  'space.600': "var(--ds-space-600, 48px)",
+  'space.800': "var(--ds-space-800, 64px)",
+  'space.1000': "var(--ds-space-1000, 80px)"
+};
 /**
@@ -236,6 +252,6 @@ * @codegenEnd
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::dd62140c127dcca8e478ad22341d4626>>
+ * @codegen <<SignedSource::8ab54fc337c6a02f403dad852dd626a0>>
  * @codegenId misc
  * @codegenCommand yarn codegen-styles
- * @codegenParams ["align-self", "border-style", "display", "flex-grow", "flex-shrink", "flex", "layer", "overflow", "position"]
+ * @codegenParams ["align-self", "border-style", "display", "flex-direction", "flex-grow", "flex-shrink", "flex", "layer", "overflow", "position"]
  * @codegenDependency ../../scripts/codegen-file-templates/align-self.tsx <<SignedSource::074079802534462de54bf882bb2073e5>>
@@ -245,2 +261,3 @@ * @codegenDependency ../../scripts/codegen-file-templates/border-style.tsx <<SignedSource::87e7e289ffeaac901997c4af98084a5f>>
  * @codegenDependency ../../scripts/codegen-file-templates/display.tsx <<SignedSource::e6e390f80609060bfd12a55a489d5f54>>
+ * @codegenDependency ../../scripts/codegen-file-templates/flex-direction.tsx <<SignedSource::19809ba11675679c188b0d98fb651dc1>>
  * @codegenDependency ../../scripts/codegen-file-templates/flex-grow.tsx <<SignedSource::b8a06b122cb609170f1f42778a6c270e>>
@@ -264,2 +281,6 @@ * @codegenDependency ../../scripts/codegen-file-templates/flex-shrink.tsx <<SignedSource::bf6626972898bf22d2eeee2130693d47>>
 };
+export var flexDirectionMap = {
+  row: 'row',
+  column: 'column'
+};
 export var flexGrowMap = {
@@ -334,3 +355,3 @@ '0': 0,
 
-var spacingProperties = ['padding', 'paddingBlock', 'paddingBlockStart', 'paddingBlockEnd', 'paddingInline', 'paddingInlineStart', 'paddingInlineEnd'];
+var spacingProperties = ['padding', 'paddingBlock', 'paddingBlockStart', 'paddingBlockEnd', 'paddingInline', 'paddingInlineStart', 'paddingInlineEnd', 'gap', 'rowGap'];
 var getSerializedStylesMap = function getSerializedStylesMap(cssProperty, tokenMap) {
@@ -346,2 +367,6 @@ return Object.keys(tokenMap).reduce(function (emotionSpacingMap, token) {
 }, {});
+export var spaceStylesMap = spacingProperties.reduce(function (styleMap, spacingProperty) {
+  styleMap[spacingProperty] = getSerializedStylesMap(spacingProperty, spaceMap);
+  return styleMap;
+}, {});
 export var backgroundColorStylesMap = getSerializedStylesMap('backgroundColor', backgroundColorMap);

dist/esm/internal/xcss.js

@@ -32,8 +32,5 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 };
-
-/**
- * Only exposed for testing.
- * @internal
- */
-export var transformStyles = function transformStyles(styleObj) {
+var reNestedSelectors = /(\.|\s|&+|\*\>|#|\[.*\])/;
+var rePseudos = /^::?.*$/;
+var transformStyles = function transformStyles(styleObj) {
   if (!styleObj || _typeof(styleObj) !== 'object') {
@@ -55,3 +52,3 @@ return styleObj;
       // We don't support `.class`, `[data-testid]`, `> *`, `#some-id`
-      if (/(\.|\s|&+|\*\>|#|\[.*\])/.test(key)) {
+      if (reNestedSelectors.test(key)) {
         throw new Error("Styles not supported for key '".concat(key, "'."));
@@ -63,3 +60,3 @@ }
     // So, call transformStyles on the value
-    if (/^::?.*$/.test(key)) {
+    if (rePseudos.test(key)) {
       styleObj[key] = transformStyles(value);
@@ -66,0 +63,0 @@ return;

dist/esm/version.json

 {
 	"name": "@atlaskit/primitives",
-	"version": "0.7.1",
+	"version": "0.8.0",
 	"sideEffects": false
 }

dist/types/index.d.ts

 export { default as Box, type BoxProps } from './components/box';
-export { default as Inline, type InlineProps, } from './components/inline.partial';
+export { default as Inline, type InlineProps } from './components/inline';
 export { xcss } from './internal/xcss';
-export { default as Stack, type StackProps } from './components/stack.partial';
+export { default as Stack, type StackProps } from './components/stack';

dist/types/internal/style-maps.partial.d.ts

@@ -31,6 +31,6 @@ import { SerializedStyles } from '@emotion/react';
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::c9769f86fc43a4afcc45953fc5f06926>>
+ * @codegen <<SignedSource::b8ac4fd29ba83e2ab1c2713c35915067>>
  * @codegenId spacing
  * @codegenCommand yarn codegen-styles
- * @codegenParams ["padding"]
+ * @codegenParams ["padding", "space"]
  * @codegenDependency ../../../tokens/src/artifacts/tokens-raw/atlassian-spacing.tsx <<SignedSource::167d3b69b159ae33e74d4ea5ab7eade6>>
@@ -61,2 +61,20 @@ */
 export declare type PaddingInlineEnd = keyof typeof paddingMap;
+export declare const spaceMap: {
+    readonly 'space.0': "var(--ds-space-0)";
+    readonly 'space.025': "var(--ds-space-025)";
+    readonly 'space.050': "var(--ds-space-050)";
+    readonly 'space.075': "var(--ds-space-075)";
+    readonly 'space.100': "var(--ds-space-100)";
+    readonly 'space.150': "var(--ds-space-150)";
+    readonly 'space.200': "var(--ds-space-200)";
+    readonly 'space.250': "var(--ds-space-250)";
+    readonly 'space.300': "var(--ds-space-300)";
+    readonly 'space.400': "var(--ds-space-400)";
+    readonly 'space.500': "var(--ds-space-500)";
+    readonly 'space.600': "var(--ds-space-600)";
+    readonly 'space.800': "var(--ds-space-800)";
+    readonly 'space.1000': "var(--ds-space-1000)";
+};
+export declare type Gap = keyof typeof spaceMap;
+export declare type RowGap = keyof typeof spaceMap;
 /**
@@ -252,6 +270,6 @@ * @codegenEnd
  * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
- * @codegen <<SignedSource::dd62140c127dcca8e478ad22341d4626>>
+ * @codegen <<SignedSource::8ab54fc337c6a02f403dad852dd626a0>>
  * @codegenId misc
  * @codegenCommand yarn codegen-styles
- * @codegenParams ["align-self", "border-style", "display", "flex-grow", "flex-shrink", "flex", "layer", "overflow", "position"]
+ * @codegenParams ["align-self", "border-style", "display", "flex-direction", "flex-grow", "flex-shrink", "flex", "layer", "overflow", "position"]
  * @codegenDependency ../../scripts/codegen-file-templates/align-self.tsx <<SignedSource::074079802534462de54bf882bb2073e5>>
@@ -261,2 +279,3 @@ * @codegenDependency ../../scripts/codegen-file-templates/border-style.tsx <<SignedSource::87e7e289ffeaac901997c4af98084a5f>>
  * @codegenDependency ../../scripts/codegen-file-templates/display.tsx <<SignedSource::e6e390f80609060bfd12a55a489d5f54>>
+ * @codegenDependency ../../scripts/codegen-file-templates/flex-direction.tsx <<SignedSource::19809ba11675679c188b0d98fb651dc1>>
  * @codegenDependency ../../scripts/codegen-file-templates/flex-grow.tsx <<SignedSource::b8a06b122cb609170f1f42778a6c270e>>
@@ -283,2 +302,7 @@ * @codegenDependency ../../scripts/codegen-file-templates/flex-shrink.tsx <<SignedSource::bf6626972898bf22d2eeee2130693d47>>
 export declare type Display = 'flex' | 'block' | 'inline' | 'inline-block' | 'inline-flex';
+export declare const flexDirectionMap: {
+    readonly row: "row";
+    readonly column: "column";
+};
+export declare type FlexDirection = keyof typeof flexDirectionMap;
 export declare const flexGrowMap: {
@@ -370,2 +394,3 @@ readonly '0': 0;
     flex?: Flex;
+    flexDirection?: FlexDirection;
     flexGrow?: FlexGrow;
@@ -394,3 +419,3 @@ flexShrink?: FlexShrink;
 };
-declare const spacingProperties: readonly ["padding", "paddingBlock", "paddingBlockStart", "paddingBlockEnd", "paddingInline", "paddingInlineStart", "paddingInlineEnd"];
+declare const spacingProperties: readonly ["padding", "paddingBlock", "paddingBlockStart", "paddingBlockEnd", "paddingInline", "paddingInlineStart", "paddingInlineEnd", "gap", "rowGap"];
 declare type SpacingProperty = typeof spacingProperties[number];
@@ -402,3 +427,4 @@ declare type SpacingToken = keyof typeof paddingMap;
 export declare const paddingStylesMap: SpacingStyleMap;
+export declare const spaceStylesMap: SpacingStyleMap;
 export declare const backgroundColorStylesMap: BackgroundColorStyleMap;
 export {};

dist/types/internal/xcss.d.ts

 /// <reference types="react" />
 import { css as cssEmotion } from '@emotion/react';
-import { CSSObject, CSSPropertiesWithMultiValues, CSSPseudos, SerializedStyles } from '@emotion/serialize';
+import { CSSPropertiesWithMultiValues, CSSPseudos, SerializedStyles } from '@emotion/serialize';
 import { Box, Inline } from '../index';
@@ -8,7 +8,2 @@ import { TokenisedProps } from './style-maps.partial';
 /**
- * Only exposed for testing.
- * @internal
- */
-export declare const transformStyles: (styleObj?: CSSObject | CSSObject[] | undefined) => CSSObject | CSSObject[] | undefined;
-/**
  * @internal used in primitives
@@ -15,0 +10,0 @@ * @returns a collection of styles that can be applied to the respective primitive

inline/package.json

 {
   "name": "@atlaskit/primitives/inline",
-  "main": "../dist/cjs/components/inline.partial.js",
-  "module": "../dist/esm/components/inline.partial.js",
-  "module:es2019": "../dist/es2019/components/inline.partial.js",
+  "main": "../dist/cjs/components/inline.js",
+  "module": "../dist/esm/components/inline.js",
+  "module:es2019": "../dist/es2019/components/inline.js",
   "sideEffects": false,
-  "types": "../dist/types/components/inline.partial.d.ts",
+  "types": "../dist/types/components/inline.d.ts",
   "typesVersions": {
     ">=4.0 <4.5": {
       "*": [
-        "../dist/types-ts4.0/components/inline.partial.d.ts"
+        "../dist/types-ts4.0/components/inline.d.ts"
       ]
@@ -13,0 +13,0 @@ }

package.json

 {
   "name": "@atlaskit/primitives",
-  "version": "0.7.1",
+  "version": "0.8.0",
   "description": "Primitives are token-backed low-level building blocks.",
@@ -17,7 +17,33 @@ "author": "Atlassian Pty Ltd",
     "website": {
-      "category": "Components",
+      "category": "Primitives",
       "name": "Primitives",
-      "status": {
-        "type": "alpha"
-      }
+      "pages": [
+        {
+          "title": "Overview",
+          "id": "@atlaskit/primitives",
+          "folder": "overview",
+          "slug": "primitives/overview",
+          "status": {
+            "type": "alpha"
+          }
+        },
+        {
+          "title": "Accessibility",
+          "id": "@atlaskit/primitives",
+          "folder": "accessibility",
+          "slug": "primitives/accessibility",
+          "status": {
+            "type": "alpha"
+          }
+        },
+        {
+          "title": "Box",
+          "folder": "box",
+          "slug": "primitives/box",
+          "id": "@atlaskit/primitives/box",
+          "status": {
+            "type": "alpha"
+          }
+        }
+      ]
     }
@@ -37,4 +63,4 @@ },
     "./box": "./src/components/box.tsx",
-    "./stack": "./src/components/stack.partial.tsx",
-    "./inline": "./src/components/inline.partial.tsx",
+    "./stack": "./src/components/stack.tsx",
+    "./inline": "./src/components/inline.tsx",
     "./responsive": "./src/helpers/responsive/index.tsx"
@@ -41,0 +67,0 @@ },

report.api.md

@@ -34,3 +34,2 @@ <!-- API Report Version: 2.3 -->
 import { SerializedStyles } from '@emotion/serialize';
-import { SerializedStyles as SerializedStyles_2 } from '@emotion/react';
 
@@ -320,2 +319,11 @@ // @public (undocumented)
 // @public (undocumented)
+type FlexDirection = keyof typeof flexDirectionMap;
+
+// @public (undocumented)
+const flexDirectionMap: {
+  readonly row: 'row';
+  readonly column: 'column';
+};
+
+// @public (undocumented)
 type FlexGrow = keyof typeof flexGrowMap;
@@ -344,8 +352,5 @@
 // @public (undocumented)
-type Gap = keyof typeof inlineSpaceMap.gap;
+type Gap = keyof typeof spaceMap;
 
 // @public (undocumented)
-type Gap_2 = keyof typeof stackSpaceMap.gap;
-
-// @public (undocumented)
 type Grow = 'fill' | 'hug';
@@ -396,22 +401,2 @@
 
-// @public
-const inlineSpaceMap: {
-  [k: string]: {
-    readonly '0': SerializedStyles_2;
-    readonly '025': SerializedStyles_2;
-    readonly '050': SerializedStyles_2;
-    readonly '075': SerializedStyles_2;
-    readonly '100': SerializedStyles_2;
-    readonly '150': SerializedStyles_2;
-    readonly '200': SerializedStyles_2;
-    readonly '250': SerializedStyles_2;
-    readonly '300': SerializedStyles_2;
-    readonly '400': SerializedStyles_2;
-    readonly '500': SerializedStyles_2;
-    readonly '600': SerializedStyles_2;
-    readonly '800': SerializedStyles_2;
-    readonly '1000': SerializedStyles_2;
-  };
-};
-
 // @public (undocumented)
@@ -536,3 +521,3 @@ type InlineStyles = SerializedStyles & {
 // @public (undocumented)
-type RowGap = keyof typeof inlineSpaceMap.rowGap;
+type RowGap = keyof typeof spaceMap;
 
@@ -563,2 +548,20 @@ // @public (undocumented)
 // @public (undocumented)
+const spaceMap: {
+  readonly 'space.0': 'var(--ds-space-0)';
+  readonly 'space.025': 'var(--ds-space-025)';
+  readonly 'space.050': 'var(--ds-space-050)';
+  readonly 'space.075': 'var(--ds-space-075)';
+  readonly 'space.100': 'var(--ds-space-100)';
+  readonly 'space.150': 'var(--ds-space-150)';
+  readonly 'space.200': 'var(--ds-space-200)';
+  readonly 'space.250': 'var(--ds-space-250)';
+  readonly 'space.300': 'var(--ds-space-300)';
+  readonly 'space.400': 'var(--ds-space-400)';
+  readonly 'space.500': 'var(--ds-space-500)';
+  readonly 'space.600': 'var(--ds-space-600)';
+  readonly 'space.800': 'var(--ds-space-800)';
+  readonly 'space.1000': 'var(--ds-space-1000)';
+};
+
+// @public (undocumented)
 type Spread = 'space-between';
@@ -595,3 +598,3 @@
   ref?: ComponentPropsWithRef<T>['ref'];
-  space?: Gap_2;
+  space?: Gap;
   spread?: Spread_2;
@@ -601,22 +604,2 @@ testId?: string;
 
-// @public
-const stackSpaceMap: {
-  [k: string]: {
-    readonly '0': SerializedStyles_2;
-    readonly '025': SerializedStyles_2;
-    readonly '050': SerializedStyles_2;
-    readonly '075': SerializedStyles_2;
-    readonly '100': SerializedStyles_2;
-    readonly '150': SerializedStyles_2;
-    readonly '200': SerializedStyles_2;
-    readonly '250': SerializedStyles_2;
-    readonly '300': SerializedStyles_2;
-    readonly '400': SerializedStyles_2;
-    readonly '500': SerializedStyles_2;
-    readonly '600': SerializedStyles_2;
-    readonly '800': SerializedStyles_2;
-    readonly '1000': SerializedStyles_2;
-  };
-};
-
 // @public (undocumented)
@@ -670,2 +653,3 @@ type TextColor = keyof typeof textColorMap;
   flex?: Flex;
+  flexDirection?: FlexDirection;
   flexGrow?: FlexGrow;
@@ -672,0 +656,0 @@ flexShrink?: FlexShrink;

stack/package.json

 {
   "name": "@atlaskit/primitives/stack",
-  "main": "../dist/cjs/components/stack.partial.js",
-  "module": "../dist/esm/components/stack.partial.js",
-  "module:es2019": "../dist/es2019/components/stack.partial.js",
+  "main": "../dist/cjs/components/stack.js",
+  "module": "../dist/esm/components/stack.js",
+  "module:es2019": "../dist/es2019/components/stack.js",
   "sideEffects": false,
-  "types": "../dist/types/components/stack.partial.d.ts",
+  "types": "../dist/types/components/stack.d.ts",
   "typesVersions": {
     ">=4.0 <4.5": {
       "*": [
-        "../dist/types-ts4.0/components/stack.partial.d.ts"
+        "../dist/types-ts4.0/components/stack.d.ts"
       ]
@@ -13,0 +13,0 @@ }

tmp/api-report-tmp.d.ts

@@ -23,3 +23,2 @@ ## API Report File for "@atlaskit/primitives"
 import { SerializedStyles } from '@emotion/serialize';
-import { SerializedStyles as SerializedStyles_2 } from '@emotion/react';
 
@@ -295,2 +294,11 @@ // @public (undocumented)
 // @public (undocumented)
+type FlexDirection = keyof typeof flexDirectionMap;
+
+// @public (undocumented)
+const flexDirectionMap: {
+    readonly row: "row";
+    readonly column: "column";
+};
+
+// @public (undocumented)
 type FlexGrow = keyof typeof flexGrowMap;
@@ -319,8 +327,5 @@
 // @public (undocumented)
-type Gap = keyof typeof inlineSpaceMap.gap;
+type Gap = keyof typeof spaceMap;
 
 // @public (undocumented)
-type Gap_2 = keyof typeof stackSpaceMap.gap;
-
-// @public (undocumented)
 type Grow = 'fill' | 'hug';
@@ -353,22 +358,2 @@
 
-// @public
-const inlineSpaceMap: {
-    [k: string]: {
-        readonly '0': SerializedStyles_2;
-        readonly '025': SerializedStyles_2;
-        readonly '050': SerializedStyles_2;
-        readonly '075': SerializedStyles_2;
-        readonly '100': SerializedStyles_2;
-        readonly '150': SerializedStyles_2;
-        readonly '200': SerializedStyles_2;
-        readonly '250': SerializedStyles_2;
-        readonly '300': SerializedStyles_2;
-        readonly '400': SerializedStyles_2;
-        readonly '500': SerializedStyles_2;
-        readonly '600': SerializedStyles_2;
-        readonly '800': SerializedStyles_2;
-        readonly '1000': SerializedStyles_2;
-    };
-};
-
 // @public (undocumented)
@@ -493,3 +478,3 @@ type InlineStyles = SerializedStyles & {
 // @public (undocumented)
-type RowGap = keyof typeof inlineSpaceMap.rowGap;
+type RowGap = keyof typeof spaceMap;
 
@@ -515,2 +500,20 @@ // @public (undocumented)
 // @public (undocumented)
+const spaceMap: {
+    readonly 'space.0': "var(--ds-space-0)";
+    readonly 'space.025': "var(--ds-space-025)";
+    readonly 'space.050': "var(--ds-space-050)";
+    readonly 'space.075': "var(--ds-space-075)";
+    readonly 'space.100': "var(--ds-space-100)";
+    readonly 'space.150': "var(--ds-space-150)";
+    readonly 'space.200': "var(--ds-space-200)";
+    readonly 'space.250': "var(--ds-space-250)";
+    readonly 'space.300': "var(--ds-space-300)";
+    readonly 'space.400': "var(--ds-space-400)";
+    readonly 'space.500': "var(--ds-space-500)";
+    readonly 'space.600': "var(--ds-space-600)";
+    readonly 'space.800': "var(--ds-space-800)";
+    readonly 'space.1000': "var(--ds-space-1000)";
+};
+
+// @public (undocumented)
 type Spread = 'space-between';
@@ -532,3 +535,3 @@
     ref?: ComponentPropsWithRef<T>['ref'];
-    space?: Gap_2;
+    space?: Gap;
     spread?: Spread_2;
@@ -538,22 +541,2 @@ testId?: string;
 
-// @public
-const stackSpaceMap: {
-    [k: string]: {
-        readonly '0': SerializedStyles_2;
-        readonly '025': SerializedStyles_2;
-        readonly '050': SerializedStyles_2;
-        readonly '075': SerializedStyles_2;
-        readonly '100': SerializedStyles_2;
-        readonly '150': SerializedStyles_2;
-        readonly '200': SerializedStyles_2;
-        readonly '250': SerializedStyles_2;
-        readonly '300': SerializedStyles_2;
-        readonly '400': SerializedStyles_2;
-        readonly '500': SerializedStyles_2;
-        readonly '600': SerializedStyles_2;
-        readonly '800': SerializedStyles_2;
-        readonly '1000': SerializedStyles_2;
-    };
-};
-
 // @public (undocumented)
@@ -607,2 +590,3 @@ type TextColor = keyof typeof textColorMap;
     flex?: Flex;
+    flexDirection?: FlexDirection;
     flexGrow?: FlexGrow;
@@ -609,0 +593,0 @@ flexShrink?: FlexShrink;

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Number of package files

93

increased by5.68%

Worsened metrics

Total package byte prevSize

263183

decreased by-2.95%

Lines of code

5153

decreased by-3.79%

No dependency changes