@atlaskit/primitives 1.10.0 → 1.10.1

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @atlaskit/primitives
 
+## 1.10.1
+
+### Patch Changes
+
+- [#43018](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/43018) [`3cb6a290654`](https://bitbucket.org/atlassian/atlassian-frontend/commits/3cb6a290654) - Text component now has `margin: 0` to ensure no margins are inherited (for example from the CSS reset).
+
 ## 1.10.0
 
 ### Minor Changes

package/dist/cjs/components/text.js

@@ -16,6 +16,12 @@ var _excluded = ["children"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } /** @jsx jsx */
 var asAllowlist = ['span', 'p', 'strong', 'em'];
+// We're doing this because our CSS reset can add top margins to elements such as `p` which is totally insane.
+// Long term we should remove those instances from the reset - it should be a reset to 0.
+// For now, at least we know <Text> will be unaffected by this.
+var resetStyles = (0, _react2.css)({
+  margin: 0
+});
 var variantStyles = _objectSpread(_objectSpread({}, _styleMaps.bodyTextStylesMap), _styleMaps.uiTextStylesMap);
 var strongStyles = (0, _react2.css)({
   fontWeight: "var(--ds-font-weight-bold, bold)"
@@ -101,7 +107,7 @@ var Text = function Text(_ref) {
     return (0, _react2.jsx)(_react.Fragment, null, children);
   }
   var component = (0, _react2.jsx)(Component, {
-    css: [variant && variantStyles[variant], color && _styleMaps.textColorStylesMap[color], shouldTruncate && truncateStyles, textAlign && textAlignMap[textAlign], asElement === 'em' && emStyles, asElement === 'strong' && strongStyles],
+    css: [resetStyles, variant && variantStyles[variant], color && _styleMaps.textColorStylesMap[color], shouldTruncate && truncateStyles, textAlign && textAlignMap[textAlign], asElement === 'em' && emStyles, asElement === 'strong' && strongStyles],
     "data-testid": testId,
     id: id
   }, children);

package/dist/cjs/xcss/xcss.js

@@ -13,6 +13,8 @@ var _react = require("@emotion/react");
 var _styleMaps = require("./style-maps.partial");
 /* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
 
+// eslint-disable-next-line import/no-extraneous-dependencies
+
 var tokensMap = {
   backgroundColor: _styleMaps.backgroundColorMap,
   blockSize: _styleMaps.dimensionMap,

package/dist/es2019/components/text.js

@@ -5,6 +5,12 @@ import invariant from 'tiny-invariant';
 import { bodyTextStylesMap, inverseColorMap, textColorStylesMap, uiTextStylesMap } from '../xcss/style-maps.partial';
 import { useSurface } from './internal/surface-provider';
 const asAllowlist = ['span', 'p', 'strong', 'em'];
+// We're doing this because our CSS reset can add top margins to elements such as `p` which is totally insane.
+// Long term we should remove those instances from the reset - it should be a reset to 0.
+// For now, at least we know <Text> will be unaffected by this.
+const resetStyles = css({
+  margin: 0
+});
 const variantStyles = {
   ...bodyTextStylesMap,
   ...uiTextStylesMap
@@ -92,7 +98,7 @@ const Text = ({
     return jsx(Fragment, null, children);
   }
   const component = jsx(Component, {
-    css: [variant && variantStyles[variant], color && textColorStylesMap[color], shouldTruncate && truncateStyles, textAlign && textAlignMap[textAlign], asElement === 'em' && emStyles, asElement === 'strong' && strongStyles],
+    css: [resetStyles, variant && variantStyles[variant], color && textColorStylesMap[color], shouldTruncate && truncateStyles, textAlign && textAlignMap[textAlign], asElement === 'em' && emStyles, asElement === 'strong' && strongStyles],
     "data-testid": testId,
     id: id
   }, children);

package/dist/es2019/xcss/xcss.js

@@ -1,5 +1,8 @@
 /* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
 import { css as cssEmotion } from '@emotion/react';
+
+// eslint-disable-next-line import/no-extraneous-dependencies
+
 import { backgroundColorMap, borderColorMap, borderRadiusMap, borderWidthMap, dimensionMap, layerMap, shadowMap, spaceMap, textColorMap } from './style-maps.partial';
 const tokensMap = {
   backgroundColor: backgroundColorMap,

package/dist/esm/components/text.js

@@ -10,6 +10,12 @@ import invariant from 'tiny-invariant';
 import { bodyTextStylesMap, inverseColorMap, textColorStylesMap, uiTextStylesMap } from '../xcss/style-maps.partial';
 import { useSurface } from './internal/surface-provider';
 var asAllowlist = ['span', 'p', 'strong', 'em'];
+// We're doing this because our CSS reset can add top margins to elements such as `p` which is totally insane.
+// Long term we should remove those instances from the reset - it should be a reset to 0.
+// For now, at least we know <Text> will be unaffected by this.
+var resetStyles = css({
+  margin: 0
+});
 var variantStyles = _objectSpread(_objectSpread({}, bodyTextStylesMap), uiTextStylesMap);
 var strongStyles = css({
   fontWeight: "var(--ds-font-weight-bold, bold)"
@@ -95,7 +101,7 @@ var Text = function Text(_ref) {
     return jsx(Fragment, null, children);
   }
   var component = jsx(Component, {
-    css: [variant && variantStyles[variant], color && textColorStylesMap[color], shouldTruncate && truncateStyles, textAlign && textAlignMap[textAlign], asElement === 'em' && emStyles, asElement === 'strong' && strongStyles],
+    css: [resetStyles, variant && variantStyles[variant], color && textColorStylesMap[color], shouldTruncate && truncateStyles, textAlign && textAlignMap[textAlign], asElement === 'em' && emStyles, asElement === 'strong' && strongStyles],
     "data-testid": testId,
     id: id
   }, children);

package/dist/esm/xcss/xcss.js

@@ -3,6 +3,9 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _typeof from "@babel/runtime/helpers/typeof";
 /* eslint-disable @atlaskit/design-system/ensure-design-token-usage */
 import { css as cssEmotion } from '@emotion/react';
+
+// eslint-disable-next-line import/no-extraneous-dependencies
+
 import { backgroundColorMap, borderColorMap, borderRadiusMap, borderWidthMap, dimensionMap, layerMap, shadowMap, spaceMap, textColorMap } from './style-maps.partial';
 var tokensMap = {
   backgroundColor: backgroundColorMap,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/primitives",
-  "version": "1.10.0",
+  "version": "1.10.1",
   "description": "Primitives are token-backed low-level building blocks.",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"