@atlaskit/icon 21.8.1 → 21.9.3

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,38 @@
1
1
  # @atlaskit/icon
2
2
 
3
+ ## 21.9.3
4
+
5
+ ### Patch Changes
6
+
7
+ - [`c55c736ecea`](https://bitbucket.org/atlassian/atlassian-frontend/commits/c55c736ecea) - Patch VULN AFP-3486 AFP-3487 AFP-3488 AFP-3489
8
+
9
+ ## 21.9.2
10
+
11
+ ### Minor Changes
12
+
13
+ - [`229177bb85d`](https://bitbucket.org/atlassian/atlassian-frontend/commits/229177bb85d) - CETI-16 added remove emoji icon so that it appears in mobilekit too
14
+
15
+ ### Patch Changes
16
+
17
+ - [`f460cc7c411`](https://bitbucket.org/atlassian/atlassian-frontend/commits/f460cc7c411) - Builds for this package now pass through a tokens babel plugin, removing runtime invocations of the tokens() function and improving bundle size.
18
+ - Updated dependencies
19
+
20
+ ## 21.9.1
21
+
22
+ ### Patch Changes
23
+
24
+ - Updated dependencies
25
+
26
+ ## 21.9.0
27
+
28
+ ### Minor Changes
29
+
30
+ - [`cf853e39278`](https://bitbucket.org/atlassian/atlassian-frontend/commits/cf853e39278) - [ux] add single layout support for layout
31
+
32
+ ### Patch Changes
33
+
34
+ - Updated dependencies
35
+
3
36
  ## 21.8.1
4
37
 
5
38
  ### Patch Changes
package/README.md CHANGED
@@ -11,3 +11,4 @@ yarn add @atlaskit/icon
11
11
  ## Usage
12
12
 
13
13
  Detailed docs and example usage can be found [here](https://atlaskit.atlassian.com/packages/design-system/icon).
14
+ For adding a new icon to the icon set please follow the [adding new icons](https://developer.atlassian.com/cloud/framework/atlassian-frontend/documentation/02-adding-new-icons/) documentation.
package/build/index.tsx CHANGED
@@ -27,5 +27,5 @@ buildIcons(config).then((icons) => {
27
27
  'core',
28
28
  ]);
29
29
 
30
- return fs.outputFile(path.resolve(root, 'src/metadata.ts'), iconDocs);
30
+ return fs.outputFile(path.resolve(root, 'src/metadata.tsx'), iconDocs);
31
31
  });
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.getIconSize = exports.sizeStyleMap = exports.commonSVGStyles = void 0;
6
+ exports.sizeStyleMap = exports.getIconSize = exports.commonSVGStyles = void 0;
7
7
 
8
8
  var _constants = require("../constants");
9
9
 
@@ -4,12 +4,9 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.getBackground = void 0;
7
-
8
- var _tokens = require("@atlaskit/tokens");
9
-
10
7
  var themedBackground = {
11
- light: (0, _tokens.token)('color.background.default', '#FFFFFF'),
12
- dark: (0, _tokens.token)('color.background.default', '#1B2638')
8
+ light: "var(--ds-background-default, #FFFFFF)",
9
+ dark: "var(--ds-background-default, #1B2638)"
13
10
  };
14
11
  /**
15
12
  * Returns the background color depending on the passed through mode.
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.dimensions = exports.sizeMap = exports.sizes = void 0;
6
+ exports.sizes = exports.sizeMap = exports.dimensions = void 0;
7
7
  var sizes = {
8
8
  small: '16px',
9
9
  medium: '24px',
@@ -5,16 +5,16 @@ var _typeof = require("@babel/runtime/helpers/typeof");
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
- Object.defineProperty(exports, "default", {
8
+ Object.defineProperty(exports, "Icon", {
9
9
  enumerable: true,
10
10
  get: function get() {
11
- return _icon.default;
11
+ return _icon.Icon;
12
12
  }
13
13
  });
14
- Object.defineProperty(exports, "Icon", {
14
+ Object.defineProperty(exports, "default", {
15
15
  enumerable: true,
16
16
  get: function get() {
17
- return _icon.Icon;
17
+ return _icon.default;
18
18
  }
19
19
  });
20
20
 
package/dist/cjs/index.js CHANGED
@@ -5,34 +5,34 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
- Object.defineProperty(exports, "default", {
8
+ Object.defineProperty(exports, "SVG", {
9
9
  enumerable: true,
10
10
  get: function get() {
11
- return _icon.default;
11
+ return _svg.default;
12
12
  }
13
13
  });
14
- Object.defineProperty(exports, "SVG", {
14
+ Object.defineProperty(exports, "Skeleton", {
15
15
  enumerable: true,
16
16
  get: function get() {
17
- return _svg.default;
17
+ return _skeleton.default;
18
18
  }
19
19
  });
20
- Object.defineProperty(exports, "size", {
20
+ Object.defineProperty(exports, "default", {
21
21
  enumerable: true,
22
22
  get: function get() {
23
- return _constants.sizeMap;
23
+ return _icon.default;
24
24
  }
25
25
  });
26
- Object.defineProperty(exports, "sizes", {
26
+ Object.defineProperty(exports, "size", {
27
27
  enumerable: true,
28
28
  get: function get() {
29
- return _constants.sizes;
29
+ return _constants.sizeMap;
30
30
  }
31
31
  });
32
- Object.defineProperty(exports, "Skeleton", {
32
+ Object.defineProperty(exports, "sizes", {
33
33
  enumerable: true,
34
34
  get: function get() {
35
- return _skeleton.default;
35
+ return _constants.sizes;
36
36
  }
37
37
  });
38
38
 
@@ -552,6 +552,11 @@ var metaData = {
552
552
  componentName: 'EditorFeedbackIcon',
553
553
  package: '@atlaskit/icon/glyph/editor/feedback'
554
554
  },
555
+ 'editor/file-preview': {
556
+ keywords: ['editor/file-preview', 'editorfilepreview', 'icon', 'core'],
557
+ componentName: 'EditorFilePreviewIcon',
558
+ package: '@atlaskit/icon/glyph/editor/file-preview'
559
+ },
555
560
  'editor/file': {
556
561
  keywords: ['editor/file', 'editorfile', 'page', 'document', 'paper', 'sheet', 'icon', 'core'],
557
562
  componentName: 'EditorFileIcon',
@@ -602,6 +607,11 @@ var metaData = {
602
607
  componentName: 'EditorItalicIcon',
603
608
  package: '@atlaskit/icon/glyph/editor/italic'
604
609
  },
610
+ 'editor/layout-single': {
611
+ keywords: ['editor/layout-single', 'editorlayoutsingle', 'icon', 'core'],
612
+ componentName: 'EditorLayoutSingleIcon',
613
+ package: '@atlaskit/icon/glyph/editor/layout-single'
614
+ },
605
615
  'editor/layout-three-equal': {
606
616
  keywords: ['editor/layout-three-equal', 'editorlayoutthreeequal', 'icon', 'core'],
607
617
  componentName: 'EditorLayoutThreeEqualIcon',
@@ -712,6 +722,11 @@ var metaData = {
712
722
  componentName: 'EditorRedoIcon',
713
723
  package: '@atlaskit/icon/glyph/editor/redo'
714
724
  },
725
+ 'editor/remove-emoji': {
726
+ keywords: ['editor/remove-emoji', 'editorremoveemoji', 'icon', 'core'],
727
+ componentName: 'EditorRemoveEmojiIcon',
728
+ package: '@atlaskit/icon/glyph/editor/remove-emoji'
729
+ },
715
730
  'editor/remove': {
716
731
  keywords: ['editor/remove', 'editorremove', 'bin', 'trash', 'recycle', 'delete', 'icon', 'core'],
717
732
  componentName: 'EditorRemoveIcon',
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/icon",
3
- "version": "21.8.1",
3
+ "version": "21.9.3",
4
4
  "sideEffects": false
5
5
  }
@@ -1,7 +1,6 @@
1
- import { token } from '@atlaskit/tokens';
2
1
  const themedBackground = {
3
- light: token('color.background.default', '#FFFFFF'),
4
- dark: token('color.background.default', '#1B2638')
2
+ light: "var(--ds-background-default, #FFFFFF)",
3
+ dark: "var(--ds-background-default, #1B2638)"
5
4
  };
6
5
  /**
7
6
  * Returns the background color depending on the passed through mode.
@@ -545,6 +545,11 @@ const metaData = {
545
545
  componentName: 'EditorFeedbackIcon',
546
546
  package: '@atlaskit/icon/glyph/editor/feedback'
547
547
  },
548
+ 'editor/file-preview': {
549
+ keywords: ['editor/file-preview', 'editorfilepreview', 'icon', 'core'],
550
+ componentName: 'EditorFilePreviewIcon',
551
+ package: '@atlaskit/icon/glyph/editor/file-preview'
552
+ },
548
553
  'editor/file': {
549
554
  keywords: ['editor/file', 'editorfile', 'page', 'document', 'paper', 'sheet', 'icon', 'core'],
550
555
  componentName: 'EditorFileIcon',
@@ -595,6 +600,11 @@ const metaData = {
595
600
  componentName: 'EditorItalicIcon',
596
601
  package: '@atlaskit/icon/glyph/editor/italic'
597
602
  },
603
+ 'editor/layout-single': {
604
+ keywords: ['editor/layout-single', 'editorlayoutsingle', 'icon', 'core'],
605
+ componentName: 'EditorLayoutSingleIcon',
606
+ package: '@atlaskit/icon/glyph/editor/layout-single'
607
+ },
598
608
  'editor/layout-three-equal': {
599
609
  keywords: ['editor/layout-three-equal', 'editorlayoutthreeequal', 'icon', 'core'],
600
610
  componentName: 'EditorLayoutThreeEqualIcon',
@@ -705,6 +715,11 @@ const metaData = {
705
715
  componentName: 'EditorRedoIcon',
706
716
  package: '@atlaskit/icon/glyph/editor/redo'
707
717
  },
718
+ 'editor/remove-emoji': {
719
+ keywords: ['editor/remove-emoji', 'editorremoveemoji', 'icon', 'core'],
720
+ componentName: 'EditorRemoveEmojiIcon',
721
+ package: '@atlaskit/icon/glyph/editor/remove-emoji'
722
+ },
708
723
  'editor/remove': {
709
724
  keywords: ['editor/remove', 'editorremove', 'bin', 'trash', 'recycle', 'delete', 'icon', 'core'],
710
725
  componentName: 'EditorRemoveIcon',
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/icon",
3
- "version": "21.8.1",
3
+ "version": "21.9.3",
4
4
  "sideEffects": false
5
5
  }
@@ -1,7 +1,6 @@
1
- import { token } from '@atlaskit/tokens';
2
1
  var themedBackground = {
3
- light: token('color.background.default', '#FFFFFF'),
4
- dark: token('color.background.default', '#1B2638')
2
+ light: "var(--ds-background-default, #FFFFFF)",
3
+ dark: "var(--ds-background-default, #1B2638)"
5
4
  };
6
5
  /**
7
6
  * Returns the background color depending on the passed through mode.
@@ -545,6 +545,11 @@ var metaData = {
545
545
  componentName: 'EditorFeedbackIcon',
546
546
  package: '@atlaskit/icon/glyph/editor/feedback'
547
547
  },
548
+ 'editor/file-preview': {
549
+ keywords: ['editor/file-preview', 'editorfilepreview', 'icon', 'core'],
550
+ componentName: 'EditorFilePreviewIcon',
551
+ package: '@atlaskit/icon/glyph/editor/file-preview'
552
+ },
548
553
  'editor/file': {
549
554
  keywords: ['editor/file', 'editorfile', 'page', 'document', 'paper', 'sheet', 'icon', 'core'],
550
555
  componentName: 'EditorFileIcon',
@@ -595,6 +600,11 @@ var metaData = {
595
600
  componentName: 'EditorItalicIcon',
596
601
  package: '@atlaskit/icon/glyph/editor/italic'
597
602
  },
603
+ 'editor/layout-single': {
604
+ keywords: ['editor/layout-single', 'editorlayoutsingle', 'icon', 'core'],
605
+ componentName: 'EditorLayoutSingleIcon',
606
+ package: '@atlaskit/icon/glyph/editor/layout-single'
607
+ },
598
608
  'editor/layout-three-equal': {
599
609
  keywords: ['editor/layout-three-equal', 'editorlayoutthreeequal', 'icon', 'core'],
600
610
  componentName: 'EditorLayoutThreeEqualIcon',
@@ -705,6 +715,11 @@ var metaData = {
705
715
  componentName: 'EditorRedoIcon',
706
716
  package: '@atlaskit/icon/glyph/editor/redo'
707
717
  },
718
+ 'editor/remove-emoji': {
719
+ keywords: ['editor/remove-emoji', 'editorremoveemoji', 'icon', 'core'],
720
+ componentName: 'EditorRemoveEmojiIcon',
721
+ package: '@atlaskit/icon/glyph/editor/remove-emoji'
722
+ },
708
723
  'editor/remove': {
709
724
  keywords: ['editor/remove', 'editorremove', 'bin', 'trash', 'recycle', 'delete', 'icon', 'core'],
710
725
  componentName: 'EditorRemoveIcon',
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/icon",
3
- "version": "21.8.1",
3
+ "version": "21.9.3",
4
4
  "sideEffects": false
5
5
  }
@@ -3,4 +3,4 @@ import type { ThemeModes } from '@atlaskit/theme/types';
3
3
  * Returns the background color depending on the passed through mode.
4
4
  * @param mode
5
5
  */
6
- export declare const getBackground: (mode?: ThemeModes) => "var(--background-default)";
6
+ export declare const getBackground: (mode?: ThemeModes) => "var(--ds-background-default)";
@@ -0,0 +1,4 @@
1
+ import { PureComponent } from 'react';
2
+ import type { GlyphProps } from '@atlaskit/icon/types';
3
+
4
+ export default class extends PureComponent<GlyphProps> {}
@@ -0,0 +1,20 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+
8
+ var _react = _interopRequireDefault(require("react"));
9
+
10
+ var _base = require("@atlaskit/icon/base");
11
+
12
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
13
+
14
+ const EditorLayoutSingleIcon = props => /*#__PURE__*/_react.default.createElement(_base.Icon, Object.assign({
15
+ dangerouslySetGlyph: `<svg width="24" height="24" viewBox="0 0 24 24" role="presentation"><rect x="4" y="5" width="16" height="14" rx="2" fill="currentColor"/></svg>`
16
+ }, props));
17
+
18
+ EditorLayoutSingleIcon.displayName = 'EditorLayoutSingleIcon';
19
+ var _default = EditorLayoutSingleIcon;
20
+ exports.default = _default;
@@ -0,0 +1,4 @@
1
+ import { PureComponent } from 'react';
2
+ import type { GlyphProps } from '@atlaskit/icon/types';
3
+
4
+ export default class extends PureComponent<GlyphProps> {}
@@ -0,0 +1,20 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+
8
+ var _react = _interopRequireDefault(require("react"));
9
+
10
+ var _base = require("@atlaskit/icon/base");
11
+
12
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
13
+
14
+ const EditorRemoveEmojiIcon = props => /*#__PURE__*/_react.default.createElement(_base.Icon, Object.assign({
15
+ dangerouslySetGlyph: `<svg width="24" height="24" viewBox="0 0 24 24" role="presentation"><rect width="24" height="24" rx="3" fill="#fff" fill-opacity=".01"/><path fill-rule="evenodd" clip-rule="evenodd" d="M5.842 8.67a7 7 0 009.487 9.488l-1.12-1.121A5.47 5.47 0 0112 17.5 5.506 5.506 0 016.5 12a5.5 5.5 0 01.464-2.207L5.842 8.67zm11.195 5.539A5.47 5.47 0 0017.5 12c0-3.033-2.467-5.5-5.5-5.5a5.5 5.5 0 00-2.207.464L8.67 5.842a7 7 0 019.487 9.487l-1.12-1.12z" fill="currentColor"/><rect x="4.319" y="5.556" width="1.75" height="19.976" rx=".875" transform="rotate(-45 4.319 5.556)" fill="currentColor"/></svg>`
16
+ }, props));
17
+
18
+ EditorRemoveEmojiIcon.displayName = 'EditorRemoveEmojiIcon';
19
+ var _default = EditorRemoveEmojiIcon;
20
+ exports.default = _default;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/icon",
3
- "version": "21.8.1",
3
+ "version": "21.9.3",
4
4
  "description": "An icon is used as a visual representation of common actions and commands to provide context.",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -16,7 +16,6 @@
16
16
  "atlaskit:src": "src/index.tsx",
17
17
  "atlassian": {
18
18
  "team": "Design System Team",
19
- "inPublicMirror": true,
20
19
  "releaseModel": "scheduled",
21
20
  "website": {
22
21
  "name": "Icon"
@@ -35,8 +34,8 @@
35
34
  "build-glyphs": "ts-node --project ../../../tsconfig.node.json ./build/index.tsx"
36
35
  },
37
36
  "dependencies": {
38
- "@atlaskit/theme": "^11.5.0",
39
- "@atlaskit/tokens": "^0.2.0",
37
+ "@atlaskit/theme": "^12.0.0",
38
+ "@atlaskit/tokens": "^0.4.0",
40
39
  "@babel/runtime": "^7.0.0",
41
40
  "@emotion/core": "^10.0.9"
42
41
  },
@@ -48,16 +47,16 @@
48
47
  "@atlaskit/build-utils": "*",
49
48
  "@atlaskit/button": "^16.1.0",
50
49
  "@atlaskit/docs": "*",
51
- "@atlaskit/dynamic-table": "^14.3.0",
50
+ "@atlaskit/dynamic-table": "^14.4.0",
52
51
  "@atlaskit/icon-file-type": "^6.3.0",
53
52
  "@atlaskit/icon-object": "^6.2.0",
54
53
  "@atlaskit/icon-priority": "^6.2.0",
55
54
  "@atlaskit/logo": "^13.5.0",
56
- "@atlaskit/modal-dialog": "^12.0.0",
55
+ "@atlaskit/modal-dialog": "^12.2.0",
57
56
  "@atlaskit/section-message": "^6.1.0",
58
57
  "@atlaskit/ssr": "*",
59
58
  "@atlaskit/textfield": "^5.1.0",
60
- "@atlaskit/tooltip": "^17.4.0",
59
+ "@atlaskit/tooltip": "^17.5.0",
61
60
  "@atlaskit/visual-regression": "*",
62
61
  "@atlassian/atlassian-frontend-prettier-config-1.0.1": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.1",
63
62
  "@babel/core": "^7.12.3",
@@ -67,7 +66,7 @@
67
66
  "fs-extra": "^4.0.2",
68
67
  "jest-emotion": "^10.0.32",
69
68
  "jscodeshift": "^0.13.0",
70
- "lodash": "^4.17.15",
69
+ "lodash": "^4.17.21",
71
70
  "nullthrows": "^1.1.1",
72
71
  "pkg-dir": "^4.2.0",
73
72
  "react-dom": "^16.8.0",
@@ -81,7 +80,10 @@
81
80
  "techstack": {
82
81
  "@repo/internal": {
83
82
  "design-system": "v1",
84
- "styling": "emotion",
83
+ "styling": [
84
+ "static",
85
+ "emotion"
86
+ ],
85
87
  "ui-components": "lite-mode",
86
88
  "analytics": "analytics-next",
87
89
  "theming": "tokens",
@@ -0,0 +1 @@
1
+ <svg width="24" height="24" viewBox="0 0 24 24"><rect x="4" y="5" width="16" height="14" rx="2" fill="currentColor"/></svg>
@@ -0,0 +1 @@
1
+ <svg width="24" height="24" viewBox="0 0 24 24"><rect width="24" height="24" rx="3" fill="#fff" fill-opacity=".01"/><path fill-rule="evenodd" clip-rule="evenodd" d="M5.842 8.67a7 7 0 009.487 9.488l-1.12-1.121A5.47 5.47 0 0112 17.5 5.506 5.506 0 016.5 12a5.5 5.5 0 01.464-2.207L5.842 8.67zm11.195 5.539A5.47 5.47 0 0017.5 12c0-3.033-2.467-5.5-5.5-5.5a5.5 5.5 0 00-2.207.464L8.67 5.842a7 7 0 019.487 9.487l-1.12-1.12z" fill="currentColor"/><rect x="4.319" y="5.556" width="1.75" height="19.976" rx=".875" transform="rotate(-45 4.319 5.556)" fill="currentColor"/></svg>
@@ -0,0 +1,3 @@
1
+ <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <rect x="4" y="5" width="16" height="14" rx="2" fill="#42526E"/>
3
+ </svg>
@@ -0,0 +1,5 @@
1
+ <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <rect width="24" height="24" rx="3" fill="white" fill-opacity="0.01"/>
3
+ <path fill-rule="evenodd" clip-rule="evenodd" d="M5.84238 8.67075C5.29444 9.68427 5 10.827 5 12C5 13.8565 5.7375 15.637 7.05025 16.9497C8.36301 18.2625 10.1435 19 12 19C12.9193 19 13.8295 18.8189 14.6788 18.4672C14.9012 18.375 15.1183 18.2717 15.3292 18.1576L14.2087 17.037C13.5324 17.3347 12.7851 17.5 12 17.5C8.967 17.5 6.5 15.033 6.5 12C6.50084 11.2327 6.66182 10.4821 6.9644 9.79277L5.84238 8.67075ZM17.0371 14.2086C17.3347 13.5323 17.5 12.7851 17.5 12C17.5 8.967 15.033 6.5 12 6.5C11.2327 6.50084 10.4821 6.6618 9.79285 6.96437L8.67083 5.84234C9.68433 5.29442 10.827 5 12 5C12.9193 5 13.8295 5.18106 14.6788 5.53284C15.5281 5.88463 16.2997 6.40024 16.9497 7.05025C17.5998 7.70026 18.1154 8.47194 18.4672 9.32122C18.8189 10.1705 19 11.0807 19 12C19 12.9193 18.8189 13.8295 18.4672 14.6788C18.375 14.9012 18.2717 15.1182 18.1577 15.3292L17.0371 14.2086Z" fill="#42526E"/>
4
+ <rect x="4.31885" y="5.55615" width="1.75" height="19.9758" rx="0.875" transform="rotate(-45 4.31885 5.55615)" fill="#42526E"/>
5
+ </svg>