@atlaskit/reactions 22.7.3 → 22.7.5

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/reactions
2
2
 
3
+ ## 22.7.5
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependencies
8
+
9
+ ## 22.7.4
10
+
11
+ ### Patch Changes
12
+
13
+ - [#113286](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/113286)
14
+ [`3099017035f37`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/3099017035f37) -
15
+ Migrate native HTML buttons to Pressable primitive.
16
+ - Updated dependencies
17
+
3
18
  ## 22.7.3
4
19
 
5
20
  ### Patch Changes
@@ -0,0 +1,75 @@
1
+ {
2
+ "extends": "../../../../tsconfig.entry-points.jira.json",
3
+ "compilerOptions": {
4
+ "declaration": true,
5
+ "target": "es5",
6
+ "outDir": "../../../../../tsDist/@atlaskit__reactions/app",
7
+ "composite": true,
8
+ "rootDir": "../"
9
+ },
10
+ "include": [
11
+ "../src/**/*.ts",
12
+ "../src/**/*.tsx"
13
+ ],
14
+ "exclude": [
15
+ "../src/**/__tests__/*",
16
+ "../src/**/*.test.*",
17
+ "../src/**/test.*"
18
+ ],
19
+ "references": [
20
+ {
21
+ "path": "../../../analytics/analytics-gas-types/afm-jira/tsconfig.json"
22
+ },
23
+ {
24
+ "path": "../../../analytics/analytics-namespaced-context/afm-jira/tsconfig.json"
25
+ },
26
+ {
27
+ "path": "../../../analytics/analytics-next/afm-jira/tsconfig.json"
28
+ },
29
+ {
30
+ "path": "../../../design-system/avatar/afm-jira/tsconfig.json"
31
+ },
32
+ {
33
+ "path": "../../../design-system/button/afm-jira/tsconfig.json"
34
+ },
35
+ {
36
+ "path": "../../emoji/afm-jira/tsconfig.json"
37
+ },
38
+ {
39
+ "path": "../../../design-system/icon/afm-jira/tsconfig.json"
40
+ },
41
+ {
42
+ "path": "../../../design-system/modal-dialog/afm-jira/tsconfig.json"
43
+ },
44
+ {
45
+ "path": "../../../design-system/motion/afm-jira/tsconfig.json"
46
+ },
47
+ {
48
+ "path": "../../../design-system/popper/afm-jira/tsconfig.json"
49
+ },
50
+ {
51
+ "path": "../../../design-system/primitives/afm-jira/tsconfig.json"
52
+ },
53
+ {
54
+ "path": "../../../design-system/spinner/afm-jira/tsconfig.json"
55
+ },
56
+ {
57
+ "path": "../../../design-system/tabs/afm-jira/tsconfig.json"
58
+ },
59
+ {
60
+ "path": "../../../design-system/theme/afm-jira/tsconfig.json"
61
+ },
62
+ {
63
+ "path": "../../../design-system/tokens/afm-jira/tsconfig.json"
64
+ },
65
+ {
66
+ "path": "../../../design-system/tooltip/afm-jira/tsconfig.json"
67
+ },
68
+ {
69
+ "path": "../../../data/ufo-external/afm-jira/tsconfig.json"
70
+ },
71
+ {
72
+ "path": "../../util-service-support/afm-jira/tsconfig.json"
73
+ }
74
+ ]
75
+ }
@@ -11,7 +11,7 @@ var _analyticsGasTypes = require("@atlaskit/analytics-gas-types");
11
11
  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; }
12
12
  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; }
13
13
  var packageName = "@atlaskit/reactions";
14
- var packageVersion = "22.7.3";
14
+ var packageVersion = "22.7.5";
15
15
  /**
16
16
  * TODO: move to utility package?
17
17
  * A random sampling function
@@ -8,10 +8,9 @@ exports.Trigger = exports.RENDER_TRIGGER_BUTTON_TESTID = exports.RENDER_TOOLTIP_
8
8
  var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
9
  var _react = _interopRequireDefault(require("react"));
10
10
  var _react2 = require("@emotion/react");
11
- var _standardButton = _interopRequireDefault(require("@atlaskit/button/standard-button"));
11
+ var _primitives = require("@atlaskit/primitives");
12
12
  var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
13
13
  var _emojiAdd = _interopRequireDefault(require("@atlaskit/icon/glyph/emoji-add"));
14
- var _styles = require("./styles");
15
14
  /** @jsx jsx */
16
15
 
17
16
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
@@ -21,6 +20,39 @@ var _styles = require("./styles");
21
20
  */
22
21
  var RENDER_TOOLTIP_TRIGGER_TESTID = exports.RENDER_TOOLTIP_TRIGGER_TESTID = 'render-tooltip-trigger';
23
22
  var RENDER_TRIGGER_BUTTON_TESTID = exports.RENDER_TRIGGER_BUTTON_TESTID = 'render-trigger-button';
23
+ var triggerStyles = (0, _primitives.xcss)({
24
+ minWidth: '32px',
25
+ height: '24px',
26
+ padding: 'space.0',
27
+ borderWidth: 'border.width',
28
+ borderStyle: 'solid',
29
+ borderRadius: 'border.radius.circle',
30
+ display: 'flex',
31
+ justifyContent: 'center',
32
+ alignItems: 'center',
33
+ lineHeight: '16px'
34
+ });
35
+ var enabledTriggerStyles = (0, _primitives.xcss)({
36
+ borderColor: 'color.border',
37
+ backgroundColor: 'color.background.neutral.subtle',
38
+ ':hover': {
39
+ backgroundColor: 'color.background.neutral.subtle.hovered'
40
+ },
41
+ ':active': {
42
+ backgroundColor: 'color.background.neutral.subtle.pressed'
43
+ }
44
+ });
45
+ var disabledTriggerStyles = (0, _primitives.xcss)({
46
+ borderColor: 'color.border.disabled',
47
+ backgroundColor: 'color.background.disabled'
48
+ });
49
+ var miniModeStyles = (0, _primitives.xcss)({
50
+ minWidth: '24px',
51
+ padding: 'space.050',
52
+ border: 'none',
53
+ borderRadius: 'border.radius'
54
+ });
55
+
24
56
  /**
25
57
  * Render an emoji button to open the reactions select picker
26
58
  */
@@ -40,23 +72,15 @@ var Trigger = exports.Trigger = /*#__PURE__*/_react.default.forwardRef(function
40
72
  return (0, _react2.jsx)(_tooltip.default, {
41
73
  testId: RENDER_TOOLTIP_TRIGGER_TESTID,
42
74
  content: tooltipContent
43
- }, (0, _react2.jsx)(_standardButton.default, (0, _extends2.default)({
44
- testId: RENDER_TRIGGER_BUTTON_TESTID
45
- // TODO: (from codemod) Buttons with "component", "css" or "style" prop can't be automatically migrated with codemods. Please migrate it manually.
46
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
47
- ,
48
- css: (0, _styles.triggerStyle)({
49
- miniMode: miniMode,
50
- disabled: disabled
51
- }),
52
- appearance: "subtle",
75
+ }, (0, _react2.jsx)(_primitives.Pressable, (0, _extends2.default)({
76
+ testId: RENDER_TRIGGER_BUTTON_TESTID,
77
+ xcss: [triggerStyles, disabled ? disabledTriggerStyles : enabledTriggerStyles, miniMode && miniModeStyles],
53
78
  onClick: handleMouseDown,
54
- "aria-disabled": disabled,
55
- iconBefore: (0, _react2.jsx)(_emojiAdd.default, {
56
- size: "small",
57
- label: "Add reaction"
58
- }),
59
- spacing: "none",
79
+ isDisabled: disabled,
60
80
  ref: ref
61
- }, ariaAttributes)));
81
+ }, ariaAttributes), (0, _react2.jsx)(_emojiAdd.default, {
82
+ primaryColor: disabled ? "var(--ds-icon-disabled, #091E424F)" : "var(--ds-icon, #44546F)",
83
+ size: "small",
84
+ label: "Add reaction"
85
+ })));
62
86
  });
@@ -33,6 +33,7 @@ var UfoErrorBoundary = exports.UfoErrorBoundary = /*#__PURE__*/function (_React$
33
33
  _step;
34
34
  try {
35
35
  for (_iterator.s(); !(_step = _iterator.n()).done;) {
36
+ var _errorInfo$componentS;
36
37
  var exp = _step.value;
37
38
  exp.failure({
38
39
  metadata: {
@@ -41,7 +42,7 @@ var UfoErrorBoundary = exports.UfoErrorBoundary = /*#__PURE__*/function (_React$
41
42
  error: {
42
43
  name: error.name,
43
44
  message: error.message,
44
- infoStack: errorInfo.componentStack
45
+ infoStack: (_errorInfo$componentS = errorInfo.componentStack) !== null && _errorInfo$componentS !== void 0 ? _errorInfo$componentS : undefined
45
46
  }
46
47
  }
47
48
  });
@@ -1,7 +1,7 @@
1
1
  import { createAndFireEvent } from '@atlaskit/analytics-next';
2
2
  import { UI_EVENT_TYPE, OPERATIONAL_EVENT_TYPE } from '@atlaskit/analytics-gas-types';
3
3
  const packageName = "@atlaskit/reactions";
4
- const packageVersion = "22.7.3";
4
+ const packageVersion = "22.7.5";
5
5
  /**
6
6
  * TODO: move to utility package?
7
7
  * A random sampling function
@@ -3,16 +3,48 @@ import _extends from "@babel/runtime/helpers/extends";
3
3
  import React from 'react';
4
4
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
5
5
  import { jsx } from '@emotion/react';
6
- import Button from '@atlaskit/button/standard-button';
6
+ import { Pressable, xcss } from '@atlaskit/primitives';
7
7
  import Tooltip from '@atlaskit/tooltip';
8
8
  import EmojiAddIcon from '@atlaskit/icon/glyph/emoji-add';
9
- import { triggerStyle } from './styles';
10
9
 
11
10
  /**
12
11
  * Test id for the tooltip
13
12
  */
14
13
  export const RENDER_TOOLTIP_TRIGGER_TESTID = 'render-tooltip-trigger';
15
14
  export const RENDER_TRIGGER_BUTTON_TESTID = 'render-trigger-button';
15
+ const triggerStyles = xcss({
16
+ minWidth: '32px',
17
+ height: '24px',
18
+ padding: 'space.0',
19
+ borderWidth: 'border.width',
20
+ borderStyle: 'solid',
21
+ borderRadius: 'border.radius.circle',
22
+ display: 'flex',
23
+ justifyContent: 'center',
24
+ alignItems: 'center',
25
+ lineHeight: '16px'
26
+ });
27
+ const enabledTriggerStyles = xcss({
28
+ borderColor: 'color.border',
29
+ backgroundColor: 'color.background.neutral.subtle',
30
+ ':hover': {
31
+ backgroundColor: 'color.background.neutral.subtle.hovered'
32
+ },
33
+ ':active': {
34
+ backgroundColor: 'color.background.neutral.subtle.pressed'
35
+ }
36
+ });
37
+ const disabledTriggerStyles = xcss({
38
+ borderColor: 'color.border.disabled',
39
+ backgroundColor: 'color.background.disabled'
40
+ });
41
+ const miniModeStyles = xcss({
42
+ minWidth: '24px',
43
+ padding: 'space.050',
44
+ border: 'none',
45
+ borderRadius: 'border.radius'
46
+ });
47
+
16
48
  /**
17
49
  * Render an emoji button to open the reactions select picker
18
50
  */
@@ -32,23 +64,15 @@ export const Trigger = /*#__PURE__*/React.forwardRef((props, ref) => {
32
64
  return jsx(Tooltip, {
33
65
  testId: RENDER_TOOLTIP_TRIGGER_TESTID,
34
66
  content: tooltipContent
35
- }, jsx(Button, _extends({
36
- testId: RENDER_TRIGGER_BUTTON_TESTID
37
- // TODO: (from codemod) Buttons with "component", "css" or "style" prop can't be automatically migrated with codemods. Please migrate it manually.
38
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
39
- ,
40
- css: triggerStyle({
41
- miniMode,
42
- disabled
43
- }),
44
- appearance: "subtle",
67
+ }, jsx(Pressable, _extends({
68
+ testId: RENDER_TRIGGER_BUTTON_TESTID,
69
+ xcss: [triggerStyles, disabled ? disabledTriggerStyles : enabledTriggerStyles, miniMode && miniModeStyles],
45
70
  onClick: handleMouseDown,
46
- "aria-disabled": disabled,
47
- iconBefore: jsx(EmojiAddIcon, {
48
- size: "small",
49
- label: "Add reaction"
50
- }),
51
- spacing: "none",
71
+ isDisabled: disabled,
52
72
  ref: ref
53
- }, ariaAttributes)));
73
+ }, ariaAttributes), jsx(EmojiAddIcon, {
74
+ primaryColor: disabled ? "var(--ds-icon-disabled, #091E424F)" : "var(--ds-icon, #44546F)",
75
+ size: "small",
76
+ label: "Add reaction"
77
+ })));
54
78
  });
@@ -5,6 +5,7 @@ import React from 'react';
5
5
  export class UfoErrorBoundary extends React.Component {
6
6
  componentDidCatch(error, errorInfo) {
7
7
  for (const exp of this.props.experiences) {
8
+ var _errorInfo$componentS;
8
9
  exp.failure({
9
10
  metadata: {
10
11
  source: 'UfoErrorBoundary',
@@ -12,7 +13,7 @@ export class UfoErrorBoundary extends React.Component {
12
13
  error: {
13
14
  name: error.name,
14
15
  message: error.message,
15
- infoStack: errorInfo.componentStack
16
+ infoStack: (_errorInfo$componentS = errorInfo.componentStack) !== null && _errorInfo$componentS !== void 0 ? _errorInfo$componentS : undefined
16
17
  }
17
18
  }
18
19
  });
@@ -4,7 +4,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
4
4
  import { createAndFireEvent } from '@atlaskit/analytics-next';
5
5
  import { UI_EVENT_TYPE, OPERATIONAL_EVENT_TYPE } from '@atlaskit/analytics-gas-types';
6
6
  var packageName = "@atlaskit/reactions";
7
- var packageVersion = "22.7.3";
7
+ var packageVersion = "22.7.5";
8
8
  /**
9
9
  * TODO: move to utility package?
10
10
  * A random sampling function
@@ -3,16 +3,48 @@ import _extends from "@babel/runtime/helpers/extends";
3
3
  import React from 'react';
4
4
  // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
5
5
  import { jsx } from '@emotion/react';
6
- import Button from '@atlaskit/button/standard-button';
6
+ import { Pressable, xcss } from '@atlaskit/primitives';
7
7
  import Tooltip from '@atlaskit/tooltip';
8
8
  import EmojiAddIcon from '@atlaskit/icon/glyph/emoji-add';
9
- import { triggerStyle } from './styles';
10
9
 
11
10
  /**
12
11
  * Test id for the tooltip
13
12
  */
14
13
  export var RENDER_TOOLTIP_TRIGGER_TESTID = 'render-tooltip-trigger';
15
14
  export var RENDER_TRIGGER_BUTTON_TESTID = 'render-trigger-button';
15
+ var triggerStyles = xcss({
16
+ minWidth: '32px',
17
+ height: '24px',
18
+ padding: 'space.0',
19
+ borderWidth: 'border.width',
20
+ borderStyle: 'solid',
21
+ borderRadius: 'border.radius.circle',
22
+ display: 'flex',
23
+ justifyContent: 'center',
24
+ alignItems: 'center',
25
+ lineHeight: '16px'
26
+ });
27
+ var enabledTriggerStyles = xcss({
28
+ borderColor: 'color.border',
29
+ backgroundColor: 'color.background.neutral.subtle',
30
+ ':hover': {
31
+ backgroundColor: 'color.background.neutral.subtle.hovered'
32
+ },
33
+ ':active': {
34
+ backgroundColor: 'color.background.neutral.subtle.pressed'
35
+ }
36
+ });
37
+ var disabledTriggerStyles = xcss({
38
+ borderColor: 'color.border.disabled',
39
+ backgroundColor: 'color.background.disabled'
40
+ });
41
+ var miniModeStyles = xcss({
42
+ minWidth: '24px',
43
+ padding: 'space.050',
44
+ border: 'none',
45
+ borderRadius: 'border.radius'
46
+ });
47
+
16
48
  /**
17
49
  * Render an emoji button to open the reactions select picker
18
50
  */
@@ -32,23 +64,15 @@ export var Trigger = /*#__PURE__*/React.forwardRef(function (props, ref) {
32
64
  return jsx(Tooltip, {
33
65
  testId: RENDER_TOOLTIP_TRIGGER_TESTID,
34
66
  content: tooltipContent
35
- }, jsx(Button, _extends({
36
- testId: RENDER_TRIGGER_BUTTON_TESTID
37
- // TODO: (from codemod) Buttons with "component", "css" or "style" prop can't be automatically migrated with codemods. Please migrate it manually.
38
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
39
- ,
40
- css: triggerStyle({
41
- miniMode: miniMode,
42
- disabled: disabled
43
- }),
44
- appearance: "subtle",
67
+ }, jsx(Pressable, _extends({
68
+ testId: RENDER_TRIGGER_BUTTON_TESTID,
69
+ xcss: [triggerStyles, disabled ? disabledTriggerStyles : enabledTriggerStyles, miniMode && miniModeStyles],
45
70
  onClick: handleMouseDown,
46
- "aria-disabled": disabled,
47
- iconBefore: jsx(EmojiAddIcon, {
48
- size: "small",
49
- label: "Add reaction"
50
- }),
51
- spacing: "none",
71
+ isDisabled: disabled,
52
72
  ref: ref
53
- }, ariaAttributes)));
73
+ }, ariaAttributes), jsx(EmojiAddIcon, {
74
+ primaryColor: disabled ? "var(--ds-icon-disabled, #091E424F)" : "var(--ds-icon, #44546F)",
75
+ size: "small",
76
+ label: "Add reaction"
77
+ })));
54
78
  });
@@ -26,6 +26,7 @@ export var UfoErrorBoundary = /*#__PURE__*/function (_React$Component) {
26
26
  _step;
27
27
  try {
28
28
  for (_iterator.s(); !(_step = _iterator.n()).done;) {
29
+ var _errorInfo$componentS;
29
30
  var exp = _step.value;
30
31
  exp.failure({
31
32
  metadata: {
@@ -34,7 +35,7 @@ export var UfoErrorBoundary = /*#__PURE__*/function (_React$Component) {
34
35
  error: {
35
36
  name: error.name,
36
37
  message: error.message,
37
- infoStack: errorInfo.componentStack
38
+ infoStack: (_errorInfo$componentS = errorInfo.componentStack) !== null && _errorInfo$componentS !== void 0 ? _errorInfo$componentS : undefined
38
39
  }
39
40
  }
40
41
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/reactions",
3
- "version": "22.7.3",
3
+ "version": "22.7.5",
4
4
  "description": "Reactions component",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -39,15 +39,15 @@
39
39
  "@atlaskit/avatar": "^21.10.0",
40
40
  "@atlaskit/button": "^18.0.0",
41
41
  "@atlaskit/emoji": "^67.6.0",
42
- "@atlaskit/icon": "^22.4.0",
42
+ "@atlaskit/icon": "^22.5.0",
43
43
  "@atlaskit/modal-dialog": "^12.14.0",
44
44
  "@atlaskit/motion": "^1.7.0",
45
45
  "@atlaskit/popper": "^6.1.0",
46
- "@atlaskit/primitives": "^8.0.0",
46
+ "@atlaskit/primitives": "^9.0.0",
47
47
  "@atlaskit/spinner": "^16.2.0",
48
48
  "@atlaskit/tabs": "^16.2.0",
49
49
  "@atlaskit/theme": "^12.11.0",
50
- "@atlaskit/tokens": "^1.52.0",
50
+ "@atlaskit/tokens": "^1.53.0",
51
51
  "@atlaskit/tooltip": "^18.5.0",
52
52
  "@atlaskit/ufo": "^0.2.0",
53
53
  "@atlaskit/util-service-support": "^6.2.0",
@@ -1,50 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.triggerStyle = exports.DISABLED_BUTTON_COLOR = void 0;
8
- var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
9
- var _react = require("@emotion/react");
10
- var _colors = require("@atlaskit/theme/colors");
11
- var _constants = require("@atlaskit/theme/constants");
12
- 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; }
13
- 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 */ // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
14
- var DISABLED_BUTTON_COLOR = exports.DISABLED_BUTTON_COLOR = "".concat("var(--ds-text-disabled, ".concat(_colors.N70, ")"), " !important");
15
- var triggerStyle = exports.triggerStyle = function triggerStyle(_ref) {
16
- var _ref$miniMode = _ref.miniMode,
17
- miniMode = _ref$miniMode === void 0 ? false : _ref$miniMode,
18
- _ref$disabled = _ref.disabled,
19
- disabled = _ref$disabled === void 0 ? false : _ref$disabled;
20
- return (0, _react.css)(_objectSpread(_objectSpread(_objectSpread({
21
- minWidth: '32px',
22
- height: '24px',
23
- padding: 0,
24
- border: "1px solid ".concat("var(--ds-border, ".concat(_colors.N40, ")")),
25
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
26
- borderRadius: '20px',
27
- display: 'flex',
28
- justifyContent: 'center',
29
- alignItems: 'center',
30
- lineHeight: '16px'
31
- }, miniMode && {
32
- minWidth: '24px',
33
- padding: "var(--ds-space-050, 4px)",
34
- border: 'none',
35
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
36
- borderRadius: "".concat((0, _constants.borderRadius)(), "px")
37
- }), disabled && {
38
- color: DISABLED_BUTTON_COLOR,
39
- cursor: 'not-allowed'
40
- }), {}, {
41
- '&:hover': {
42
- background: "".concat("var(--ds-background-neutral-subtle-hovered, ".concat(_colors.N20, ")"))
43
- },
44
- '&:focus': {
45
- boxShadow: "0 0 0 2px ".concat("var(--ds-border-focused, ".concat(_colors.B100, ")")),
46
- transitionDuration: '0s, 0.2s',
47
- outline: 'none'
48
- }
49
- }));
50
- };
@@ -1,42 +0,0 @@
1
- /** @jsx jsx */
2
- // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
3
- import { css } from '@emotion/react';
4
- import { N70, N20, N40, B100 } from '@atlaskit/theme/colors';
5
- import { borderRadius } from '@atlaskit/theme/constants';
6
- export const DISABLED_BUTTON_COLOR = `${`var(--ds-text-disabled, ${N70})`} !important`;
7
- export const triggerStyle = ({
8
- miniMode = false,
9
- disabled = false
10
- }) => css({
11
- minWidth: '32px',
12
- height: '24px',
13
- padding: 0,
14
- border: `1px solid ${`var(--ds-border, ${N40})`}`,
15
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
16
- borderRadius: '20px',
17
- display: 'flex',
18
- justifyContent: 'center',
19
- alignItems: 'center',
20
- lineHeight: '16px',
21
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
22
- ...(miniMode && {
23
- minWidth: '24px',
24
- padding: "var(--ds-space-050, 4px)",
25
- border: 'none',
26
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
27
- borderRadius: `${borderRadius()}px`
28
- }),
29
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
30
- ...(disabled && {
31
- color: DISABLED_BUTTON_COLOR,
32
- cursor: 'not-allowed'
33
- }),
34
- '&:hover': {
35
- background: `${`var(--ds-background-neutral-subtle-hovered, ${N20})`}`
36
- },
37
- '&:focus': {
38
- boxShadow: `0 0 0 2px ${`var(--ds-border-focused, ${B100})`}`,
39
- transitionDuration: '0s, 0.2s',
40
- outline: 'none'
41
- }
42
- });
@@ -1,45 +0,0 @@
1
- import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
- 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; }
3
- 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) { _defineProperty(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; }
4
- /** @jsx jsx */
5
- // eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
6
- import { css } from '@emotion/react';
7
- import { N70, N20, N40, B100 } from '@atlaskit/theme/colors';
8
- import { borderRadius } from '@atlaskit/theme/constants';
9
- export var DISABLED_BUTTON_COLOR = "".concat("var(--ds-text-disabled, ".concat(N70, ")"), " !important");
10
- export var triggerStyle = function triggerStyle(_ref) {
11
- var _ref$miniMode = _ref.miniMode,
12
- miniMode = _ref$miniMode === void 0 ? false : _ref$miniMode,
13
- _ref$disabled = _ref.disabled,
14
- disabled = _ref$disabled === void 0 ? false : _ref$disabled;
15
- return css(_objectSpread(_objectSpread(_objectSpread({
16
- minWidth: '32px',
17
- height: '24px',
18
- padding: 0,
19
- border: "1px solid ".concat("var(--ds-border, ".concat(N40, ")")),
20
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
21
- borderRadius: '20px',
22
- display: 'flex',
23
- justifyContent: 'center',
24
- alignItems: 'center',
25
- lineHeight: '16px'
26
- }, miniMode && {
27
- minWidth: '24px',
28
- padding: "var(--ds-space-050, 4px)",
29
- border: 'none',
30
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values -- Ignored via go/DSP-18766
31
- borderRadius: "".concat(borderRadius(), "px")
32
- }), disabled && {
33
- color: DISABLED_BUTTON_COLOR,
34
- cursor: 'not-allowed'
35
- }), {}, {
36
- '&:hover': {
37
- background: "".concat("var(--ds-background-neutral-subtle-hovered, ".concat(N20, ")"))
38
- },
39
- '&:focus': {
40
- boxShadow: "0 0 0 2px ".concat("var(--ds-border-focused, ".concat(B100, ")")),
41
- transitionDuration: '0s, 0.2s',
42
- outline: 'none'
43
- }
44
- }));
45
- };
@@ -1,5 +0,0 @@
1
- export declare const DISABLED_BUTTON_COLOR: string;
2
- export declare const triggerStyle: ({ miniMode, disabled }: {
3
- miniMode?: boolean | undefined;
4
- disabled?: boolean | undefined;
5
- }) => import("@emotion/react").SerializedStyles;
@@ -1,5 +0,0 @@
1
- export declare const DISABLED_BUTTON_COLOR: string;
2
- export declare const triggerStyle: ({ miniMode, disabled }: {
3
- miniMode?: boolean | undefined;
4
- disabled?: boolean | undefined;
5
- }) => import("@emotion/react").SerializedStyles;