@atlaskit/primitives 14.14.0 → 14.14.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,20 @@
1
1
  # @atlaskit/primitives
2
2
 
3
+ ## 14.14.2
4
+
5
+ ### Patch Changes
6
+
7
+ - [`f0662cd7a143e`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/f0662cd7a143e) -
8
+ Internal changes to how borders are applied.
9
+ - Updated dependencies
10
+
11
+ ## 14.14.1
12
+
13
+ ### Patch Changes
14
+
15
+ - [`e5f0ae472aa1f`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/e5f0ae472aa1f) -
16
+ Fix issue with positioning in the anchor primitive.
17
+
3
18
  ## 14.14.0
4
19
 
5
20
  ### Minor Changes
@@ -21,7 +21,6 @@ var _appProvider = require("@atlaskit/app-provider");
21
21
  var _noop = _interopRequireDefault(require("@atlaskit/ds-lib/noop"));
22
22
  var _useId = require("@atlaskit/ds-lib/use-id");
23
23
  var _interactionContext = _interopRequireDefault(require("@atlaskit/interaction-context"));
24
- var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
25
24
  var _visuallyHidden = _interopRequireDefault(require("@atlaskit/visually-hidden"));
26
25
  var _focusable = _interopRequireDefault(require("./focusable"));
27
26
  var _excluded = ["href", "children", "onClick", "interactionName", "componentName", "analyticsContext", "aria-label", "aria-labelledby", "style", "target", "testId", "xcss", "newWindowLabel"],
@@ -111,7 +110,7 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
111
110
  onClick: onClick,
112
111
  "aria-label": ariaLabel && target === '_blank' && !ariaLabelledBy ? "".concat(ariaLabel, " , ").concat(newWindowLabel) : ariaLabel,
113
112
  "aria-labelledby": ariaLabelledBy && target === '_blank' ? "".concat(ariaLabelledBy, " ").concat(opensNewWindowLabelId) : ariaLabelledBy,
114
- xcss: (0, _react2.cx)(styles.root, (0, _platformFeatureFlags.fg)('platform_design-system-team_anchor-positioning') ? styles.position : undefined, xcss),
113
+ xcss: (0, _react2.cx)(styles.root, styles.position, xcss),
115
114
  testId: testId,
116
115
  "data-is-router-link": testId ? isRouterLink ? 'true' : 'false' : undefined
117
116
  }), children, target === '_blank' && (children && !ariaLabel && !ariaLabelledBy || ariaLabelledBy) && /*#__PURE__*/React.createElement(_visuallyHidden.default, {
@@ -1,6 +1,6 @@
1
- ._128m1bk5:focus-visible{outline-width:var(--ds-border-width-outline,2px)}
2
- ._1ah3115h:focus-visible{outline-offset:var(--_1203r2w)}
3
- ._1ah31bk5:focus-visible{outline-offset:var(--ds-border-width-outline,2px)}
1
+ ._128mdkaa:focus-visible{outline-width:var(--ds-border-width-focused,2px)}
2
+ ._1ah31gt5:focus-visible{outline-offset:var(--_12dc40g)}
3
+ ._1ah3dkaa:focus-visible{outline-offset:var(--ds-border-width-focused,2px)}
4
4
  ._mizu194a:focus-visible{outline-color:var(--ds-border-focused,#2684ff)}
5
5
  ._ra3xnqa1:focus-visible{outline-style:solid}
6
- @media screen and (-ms-high-contrast:active),screen and (forced-colors:active){._1cvmnqa1:focus-visible{outline-style:solid}._4davt94y:focus-visible{outline-width:1px}._2mwq115h:focus-visible{outline-offset:var(--_1203r2w)}}
6
+ @media screen and (-ms-high-contrast:active),screen and (forced-colors:active){._1cvmnqa1:focus-visible{outline-style:solid}._4davt94y:focus-visible{outline-width:1px}._2mwq1gt5:focus-visible{outline-offset:var(--_12dc40g)}}
@@ -43,13 +43,13 @@ var Focusable = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
43
43
  return /*#__PURE__*/React.createElement(Component, (0, _extends2.default)({}, safeHtmlAttributes, {
44
44
  // @ts-ignore Expression produces a union type that is too complex to represent. We may be able to narrow the type here but unsure.
45
45
  ref: ref,
46
- className: (0, _runtime.ax)(["_mizu194a _1ah31bk5 _ra3xnqa1 _128m1bk5 _1cvmnqa1 _4davt94y", isInset && "_1ah3115h _2mwq115h", xcss])
46
+ className: (0, _runtime.ax)(["_mizu194a _1ah3dkaa _ra3xnqa1 _128mdkaa _1cvmnqa1 _4davt94y", isInset && "_1ah31gt5 _2mwq1gt5", xcss])
47
47
  // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
48
48
  ,
49
49
 
50
50
  "data-testid": testId,
51
51
  style: _objectSpread(_objectSpread({}, style), {}, {
52
- "--_1203r2w": (0, _runtime.ix)("calc(0px - ".concat("var(--ds-border-width-outline, 2px)", ")"))
52
+ "--_12dc40g": (0, _runtime.ix)("calc(0px - ".concat("var(--ds-border-width-focused, 2px)", ")"))
53
53
  })
54
54
  }), children);
55
55
  });
@@ -17,7 +17,6 @@ var _appProvider = require("@atlaskit/app-provider");
17
17
  var _noop = _interopRequireDefault(require("@atlaskit/ds-lib/noop"));
18
18
  var _useId = require("@atlaskit/ds-lib/use-id");
19
19
  var _interactionContext = _interopRequireDefault(require("@atlaskit/interaction-context"));
20
- var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
21
20
  var _visuallyHidden = _interopRequireDefault(require("@atlaskit/visually-hidden"));
22
21
  var _styleMaps = require("../xcss/style-maps.partial");
23
22
  var _xcss = require("../xcss/xcss");
@@ -37,7 +36,7 @@ var focusRingStyles = (0, _react2.css)({
37
36
  outlineOffset: _styleMaps.positiveSpaceMap['space.025'],
38
37
  outlineStyle: 'solid',
39
38
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
40
- outlineWidth: _styleMaps.borderWidthMap['border.width.outline']
39
+ outlineWidth: _styleMaps.borderWidthMap['border.width.focused']
41
40
  },
42
41
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
43
42
  '&:focus:not(:focus-visible)': {
@@ -147,7 +146,7 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
147
146
  "aria-label": ariaLabel && target === '_blank' && !ariaLabelledBy ? //`${ariaLabel} ${OPENS_NEW_WINDOW_LABEL}`
148
147
  "".concat(ariaLabel, " , ").concat(newWindowLabel ? newWindowLabel : OPENS_NEW_WINDOW_LABEL) : ariaLabel,
149
148
  "aria-labelledby": ariaLabelledBy && target === '_blank' ? "".concat(ariaLabelledBy, " ").concat(opensNewWindowLabelId) : ariaLabelledBy,
150
- css: [baseStyles, (0, _platformFeatureFlags.fg)('platform_design-system-team_anchor-positioning') ? positionStyles : undefined, focusRingStyles,
149
+ css: [baseStyles, positionStyles, focusRingStyles,
151
150
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
152
151
  backgroundColor && _styleMaps.backgroundColorStylesMap[backgroundColor],
153
152
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
@@ -31,7 +31,7 @@ var focusRingStyles = (0, _react2.css)({
31
31
  outlineOffset: _styleMaps.positiveSpaceMap['space.025'],
32
32
  outlineStyle: 'solid',
33
33
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
34
- outlineWidth: _styleMaps.borderWidthMap['border.width.outline']
34
+ outlineWidth: _styleMaps.borderWidthMap['border.width.focused']
35
35
  },
36
36
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
37
37
  '&:focus:not(:focus-visible)': {
@@ -11,7 +11,6 @@ import { useRouterLink } from '@atlaskit/app-provider';
11
11
  import noop from '@atlaskit/ds-lib/noop';
12
12
  import { useId } from '@atlaskit/ds-lib/use-id';
13
13
  import InteractionContext from '@atlaskit/interaction-context';
14
- import { fg } from '@atlaskit/platform-feature-flags';
15
14
  import VisuallyHidden from '@atlaskit/visually-hidden';
16
15
  import Focusable from './focusable';
17
16
  const styles = {
@@ -99,7 +98,7 @@ const AnchorNoRef = ({
99
98
  onClick: onClick,
100
99
  "aria-label": ariaLabel && target === '_blank' && !ariaLabelledBy ? `${ariaLabel} , ${newWindowLabel}` : ariaLabel,
101
100
  "aria-labelledby": ariaLabelledBy && target === '_blank' ? `${ariaLabelledBy} ${opensNewWindowLabelId}` : ariaLabelledBy,
102
- xcss: cx(styles.root, fg('platform_design-system-team_anchor-positioning') ? styles.position : undefined, xcss),
101
+ xcss: cx(styles.root, styles.position, xcss),
103
102
  testId: testId,
104
103
  "data-is-router-link": testId ? isRouterLink ? 'true' : 'false' : undefined
105
104
  }), children, target === '_blank' && (children && !ariaLabel && !ariaLabelledBy || ariaLabelledBy) && /*#__PURE__*/React.createElement(VisuallyHidden, {
@@ -1,6 +1,6 @@
1
- ._128m1bk5:focus-visible{outline-width:var(--ds-border-width-outline,2px)}
2
- ._1ah311pw:focus-visible{outline-offset:calc(0px - var(--ds-border-width-outline, 2px))}
3
- ._1ah31bk5:focus-visible{outline-offset:var(--ds-border-width-outline,2px)}
1
+ ._128mdkaa:focus-visible{outline-width:var(--ds-border-width-focused,2px)}
2
+ ._1ah31gjf:focus-visible{outline-offset:calc(0px - var(--ds-border-width-focused, 2px))}
3
+ ._1ah3dkaa:focus-visible{outline-offset:var(--ds-border-width-focused,2px)}
4
4
  ._mizu194a:focus-visible{outline-color:var(--ds-border-focused,#2684ff)}
5
5
  ._ra3xnqa1:focus-visible{outline-style:solid}
6
- @media screen and (-ms-high-contrast:active),screen and (forced-colors:active){._1cvmnqa1:focus-visible{outline-style:solid}._4davt94y:focus-visible{outline-width:1px}._2mwq11pw:focus-visible{outline-offset:calc(0px - var(--ds-border-width-outline, 2px))}}
6
+ @media screen and (-ms-high-contrast:active),screen and (forced-colors:active){._1cvmnqa1:focus-visible{outline-style:solid}._4davt94y:focus-visible{outline-width:1px}._2mwq1gjf:focus-visible{outline-offset:calc(0px - var(--ds-border-width-focused, 2px))}}
@@ -30,7 +30,7 @@ const Focusable = /*#__PURE__*/forwardRef(({
30
30
  return /*#__PURE__*/React.createElement(Component, _extends({}, safeHtmlAttributes, {
31
31
  // @ts-ignore Expression produces a union type that is too complex to represent. We may be able to narrow the type here but unsure.
32
32
  ref: ref,
33
- className: ax(["_mizu194a _1ah31bk5 _ra3xnqa1 _128m1bk5 _1cvmnqa1 _4davt94y", isInset && "_1ah311pw _2mwq11pw", xcss])
33
+ className: ax(["_mizu194a _1ah3dkaa _ra3xnqa1 _128mdkaa _1cvmnqa1 _4davt94y", isInset && "_1ah31gjf _2mwq1gjf", xcss])
34
34
  // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
35
35
  ,
36
36
  style: style,
@@ -13,7 +13,6 @@ import { useRouterLink } from '@atlaskit/app-provider';
13
13
  import noop from '@atlaskit/ds-lib/noop';
14
14
  import { useId } from '@atlaskit/ds-lib/use-id';
15
15
  import InteractionContext from '@atlaskit/interaction-context';
16
- import { fg } from '@atlaskit/platform-feature-flags';
17
16
  import VisuallyHidden from '@atlaskit/visually-hidden';
18
17
  import { backgroundColorStylesMap, borderColorMap, borderWidthMap, paddingStylesMap, positiveSpaceMap } from '../xcss/style-maps.partial';
19
18
  import { parseXcss } from '../xcss/xcss';
@@ -26,7 +25,7 @@ const focusRingStyles = css({
26
25
  outlineOffset: positiveSpaceMap['space.025'],
27
26
  outlineStyle: 'solid',
28
27
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
29
- outlineWidth: borderWidthMap['border.width.outline']
28
+ outlineWidth: borderWidthMap['border.width.focused']
30
29
  },
31
30
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
32
31
  '&:focus:not(:focus-visible)': {
@@ -139,7 +138,7 @@ const AnchorNoRef = ({
139
138
  //`${ariaLabel} ${OPENS_NEW_WINDOW_LABEL}`
140
139
  `${ariaLabel} , ${newWindowLabel ? newWindowLabel : OPENS_NEW_WINDOW_LABEL}` : ariaLabel,
141
140
  "aria-labelledby": ariaLabelledBy && target === '_blank' ? `${ariaLabelledBy} ${opensNewWindowLabelId}` : ariaLabelledBy,
142
- css: [baseStyles, fg('platform_design-system-team_anchor-positioning') ? positionStyles : undefined, focusRingStyles,
141
+ css: [baseStyles, positionStyles, focusRingStyles,
143
142
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
144
143
  backgroundColor && backgroundColorStylesMap[backgroundColor],
145
144
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
@@ -21,7 +21,7 @@ const focusRingStyles = css({
21
21
  outlineOffset: positiveSpaceMap['space.025'],
22
22
  outlineStyle: 'solid',
23
23
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
24
- outlineWidth: borderWidthMap['border.width.outline']
24
+ outlineWidth: borderWidthMap['border.width.focused']
25
25
  },
26
26
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
27
27
  '&:focus:not(:focus-visible)': {
@@ -15,7 +15,6 @@ import { useRouterLink } from '@atlaskit/app-provider';
15
15
  import noop from '@atlaskit/ds-lib/noop';
16
16
  import { useId } from '@atlaskit/ds-lib/use-id';
17
17
  import InteractionContext from '@atlaskit/interaction-context';
18
- import { fg } from '@atlaskit/platform-feature-flags';
19
18
  import VisuallyHidden from '@atlaskit/visually-hidden';
20
19
  import Focusable from './focusable';
21
20
  var styles = {
@@ -102,7 +101,7 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
102
101
  onClick: onClick,
103
102
  "aria-label": ariaLabel && target === '_blank' && !ariaLabelledBy ? "".concat(ariaLabel, " , ").concat(newWindowLabel) : ariaLabel,
104
103
  "aria-labelledby": ariaLabelledBy && target === '_blank' ? "".concat(ariaLabelledBy, " ").concat(opensNewWindowLabelId) : ariaLabelledBy,
105
- xcss: cx(styles.root, fg('platform_design-system-team_anchor-positioning') ? styles.position : undefined, xcss),
104
+ xcss: cx(styles.root, styles.position, xcss),
106
105
  testId: testId,
107
106
  "data-is-router-link": testId ? isRouterLink ? 'true' : 'false' : undefined
108
107
  }), children, target === '_blank' && (children && !ariaLabel && !ariaLabelledBy || ariaLabelledBy) && /*#__PURE__*/React.createElement(VisuallyHidden, {
@@ -1,6 +1,6 @@
1
- ._128m1bk5:focus-visible{outline-width:var(--ds-border-width-outline,2px)}
2
- ._1ah3115h:focus-visible{outline-offset:var(--_1203r2w)}
3
- ._1ah31bk5:focus-visible{outline-offset:var(--ds-border-width-outline,2px)}
1
+ ._128mdkaa:focus-visible{outline-width:var(--ds-border-width-focused,2px)}
2
+ ._1ah31gt5:focus-visible{outline-offset:var(--_12dc40g)}
3
+ ._1ah3dkaa:focus-visible{outline-offset:var(--ds-border-width-focused,2px)}
4
4
  ._mizu194a:focus-visible{outline-color:var(--ds-border-focused,#2684ff)}
5
5
  ._ra3xnqa1:focus-visible{outline-style:solid}
6
- @media screen and (-ms-high-contrast:active),screen and (forced-colors:active){._1cvmnqa1:focus-visible{outline-style:solid}._4davt94y:focus-visible{outline-width:1px}._2mwq115h:focus-visible{outline-offset:var(--_1203r2w)}}
6
+ @media screen and (-ms-high-contrast:active),screen and (forced-colors:active){._1cvmnqa1:focus-visible{outline-style:solid}._4davt94y:focus-visible{outline-width:1px}._2mwq1gt5:focus-visible{outline-offset:var(--_12dc40g)}}
@@ -34,13 +34,13 @@ var Focusable = /*#__PURE__*/forwardRef(function (_ref, ref) {
34
34
  return /*#__PURE__*/React.createElement(Component, _extends({}, safeHtmlAttributes, {
35
35
  // @ts-ignore Expression produces a union type that is too complex to represent. We may be able to narrow the type here but unsure.
36
36
  ref: ref,
37
- className: ax(["_mizu194a _1ah31bk5 _ra3xnqa1 _128m1bk5 _1cvmnqa1 _4davt94y", isInset && "_1ah3115h _2mwq115h", xcss])
37
+ className: ax(["_mizu194a _1ah3dkaa _ra3xnqa1 _128mdkaa _1cvmnqa1 _4davt94y", isInset && "_1ah31gt5 _2mwq1gt5", xcss])
38
38
  // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
39
39
  ,
40
40
 
41
41
  "data-testid": testId,
42
42
  style: _objectSpread(_objectSpread({}, style), {}, {
43
- "--_1203r2w": ix("calc(0px - ".concat("var(--ds-border-width-outline, 2px)", ")"))
43
+ "--_12dc40g": ix("calc(0px - ".concat("var(--ds-border-width-focused, 2px)", ")"))
44
44
  })
45
45
  }), children);
46
46
  });
@@ -18,7 +18,6 @@ import { useRouterLink } from '@atlaskit/app-provider';
18
18
  import noop from '@atlaskit/ds-lib/noop';
19
19
  import { useId } from '@atlaskit/ds-lib/use-id';
20
20
  import InteractionContext from '@atlaskit/interaction-context';
21
- import { fg } from '@atlaskit/platform-feature-flags';
22
21
  import VisuallyHidden from '@atlaskit/visually-hidden';
23
22
  import { backgroundColorStylesMap, borderColorMap, borderWidthMap, paddingStylesMap, positiveSpaceMap } from '../xcss/style-maps.partial';
24
23
  import { parseXcss } from '../xcss/xcss';
@@ -31,7 +30,7 @@ var focusRingStyles = css({
31
30
  outlineOffset: positiveSpaceMap['space.025'],
32
31
  outlineStyle: 'solid',
33
32
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
34
- outlineWidth: borderWidthMap['border.width.outline']
33
+ outlineWidth: borderWidthMap['border.width.focused']
35
34
  },
36
35
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
37
36
  '&:focus:not(:focus-visible)': {
@@ -141,7 +140,7 @@ var AnchorNoRef = function AnchorNoRef(_ref, ref) {
141
140
  "aria-label": ariaLabel && target === '_blank' && !ariaLabelledBy ? //`${ariaLabel} ${OPENS_NEW_WINDOW_LABEL}`
142
141
  "".concat(ariaLabel, " , ").concat(newWindowLabel ? newWindowLabel : OPENS_NEW_WINDOW_LABEL) : ariaLabel,
143
142
  "aria-labelledby": ariaLabelledBy && target === '_blank' ? "".concat(ariaLabelledBy, " ").concat(opensNewWindowLabelId) : ariaLabelledBy,
144
- css: [baseStyles, fg('platform_design-system-team_anchor-positioning') ? positionStyles : undefined, focusRingStyles,
143
+ css: [baseStyles, positionStyles, focusRingStyles,
145
144
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
146
145
  backgroundColor && backgroundColorStylesMap[backgroundColor],
147
146
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
@@ -25,7 +25,7 @@ var focusRingStyles = css({
25
25
  outlineOffset: positiveSpaceMap['space.025'],
26
26
  outlineStyle: 'solid',
27
27
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
28
- outlineWidth: borderWidthMap['border.width.outline']
28
+ outlineWidth: borderWidthMap['border.width.focused']
29
29
  },
30
30
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors
31
31
  '&:focus:not(:focus-visible)': {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/primitives",
3
- "version": "14.14.0",
3
+ "version": "14.14.2",
4
4
  "description": "Primitives are token-backed low-level building blocks.",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -137,7 +137,6 @@
137
137
  "@atlaskit/css": "^0.14.0",
138
138
  "@atlaskit/ds-lib": "^5.0.0",
139
139
  "@atlaskit/interaction-context": "^3.0.0",
140
- "@atlaskit/platform-feature-flags": "^1.1.0",
141
140
  "@atlaskit/tokens": "^6.3.0",
142
141
  "@atlaskit/visually-hidden": "^3.0.0",
143
142
  "@babel/runtime": "^7.0.0",
@@ -221,10 +220,5 @@
221
220
  "dist/types-ts4.5/index.d.ts"
222
221
  ]
223
222
  }
224
- },
225
- "platform-feature-flags": {
226
- "platform_design-system-team_anchor-positioning": {
227
- "type": "boolean"
228
- }
229
223
  }
230
224
  }