@atlaskit/icon 25.8.0 → 26.1.0
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 +26 -0
- package/core/chevron-double-left.d.ts +13 -0
- package/core/chevron-double-left.js +27 -0
- package/core/chevron-double-right.d.ts +13 -0
- package/core/chevron-double-right.js +27 -0
- package/core/chevron-down.d.ts +13 -0
- package/core/chevron-down.js +27 -0
- package/core/chevron-left.d.ts +13 -0
- package/core/chevron-left.js +27 -0
- package/core/chevron-right.d.ts +13 -0
- package/core/chevron-right.js +27 -0
- package/core/chevron-up.d.ts +13 -0
- package/core/chevron-up.js +27 -0
- package/core/migration/chevron-down--chevron-down-circle.d.ts +15 -0
- package/core/migration/chevron-down--chevron-down-circle.js +30 -0
- package/core/migration/chevron-down--hipchat-chevron-down.d.ts +15 -0
- package/core/migration/chevron-down--hipchat-chevron-down.js +30 -0
- package/core/migration/chevron-down.d.ts +15 -0
- package/core/migration/chevron-down.js +30 -0
- package/core/migration/chevron-left--chevron-left-circle.d.ts +15 -0
- package/core/migration/chevron-left--chevron-left-circle.js +30 -0
- package/core/migration/chevron-left--chevron-left-large.d.ts +15 -0
- package/core/migration/chevron-left--chevron-left-large.js +30 -0
- package/core/migration/chevron-left.d.ts +15 -0
- package/core/migration/chevron-left.js +30 -0
- package/core/migration/chevron-right--chevron-right-circle.d.ts +15 -0
- package/core/migration/chevron-right--chevron-right-circle.js +30 -0
- package/core/migration/chevron-right--chevron-right-large.d.ts +15 -0
- package/core/migration/chevron-right--chevron-right-large.js +30 -0
- package/core/migration/chevron-right.d.ts +15 -0
- package/core/migration/chevron-right.js +30 -0
- package/core/migration/chevron-up--chevron-up-circle.d.ts +15 -0
- package/core/migration/chevron-up--chevron-up-circle.js +30 -0
- package/core/migration/chevron-up--hipchat-chevron-up.d.ts +15 -0
- package/core/migration/chevron-up--hipchat-chevron-up.js +30 -0
- package/core/migration/chevron-up.d.ts +15 -0
- package/core/migration/chevron-up.js +30 -0
- package/dist/cjs/components/icon-facade.js +9 -7
- package/dist/cjs/components/icon-new.compiled.css +22 -0
- package/dist/cjs/components/icon-new.js +67 -100
- package/dist/cjs/components/icon-tile.compiled.css +48 -0
- package/dist/cjs/components/icon-tile.js +40 -125
- package/dist/cjs/components/icon.compiled.css +30 -0
- package/dist/cjs/components/icon.js +31 -76
- package/dist/cjs/components/skeleton.compiled.css +12 -0
- package/dist/cjs/components/skeleton.js +20 -24
- package/dist/cjs/components/svg.compiled.css +13 -0
- package/dist/cjs/components/svg.js +20 -17
- package/dist/cjs/metadata-core.js +65 -1
- package/dist/cjs/migration-map.js +254 -182
- package/dist/es2019/components/icon-facade.js +8 -6
- package/dist/es2019/components/icon-new.compiled.css +22 -0
- package/dist/es2019/components/icon-new.js +62 -98
- package/dist/es2019/components/icon-tile.compiled.css +48 -0
- package/dist/es2019/components/icon-tile.js +37 -124
- package/dist/es2019/components/icon.compiled.css +30 -0
- package/dist/es2019/components/icon.js +26 -77
- package/dist/es2019/components/skeleton.compiled.css +12 -0
- package/dist/es2019/components/skeleton.js +15 -21
- package/dist/es2019/components/svg.compiled.css +13 -0
- package/dist/es2019/components/svg.js +16 -15
- package/dist/es2019/metadata-core.js +65 -1
- package/dist/es2019/migration-map.js +254 -182
- package/dist/esm/components/icon-facade.js +9 -7
- package/dist/esm/components/icon-new.compiled.css +22 -0
- package/dist/esm/components/icon-new.js +63 -98
- package/dist/esm/components/icon-tile.compiled.css +48 -0
- package/dist/esm/components/icon-tile.js +37 -124
- package/dist/esm/components/icon.compiled.css +30 -0
- package/dist/esm/components/icon.js +26 -77
- package/dist/esm/components/skeleton.compiled.css +12 -0
- package/dist/esm/components/skeleton.js +15 -21
- package/dist/esm/components/svg.compiled.css +13 -0
- package/dist/esm/components/svg.js +16 -15
- package/dist/esm/metadata-core.js +65 -1
- package/dist/esm/migration-map.js +254 -182
- package/dist/types/components/icon-tile.d.ts +2 -2
- package/dist/types/index.d.ts +1 -1
- package/dist/types/metadata-core.d.ts +1 -1
- package/dist/types/types.d.ts +25 -8
- package/dist/types-ts4.5/components/icon-tile.d.ts +2 -2
- package/dist/types-ts4.5/index.d.ts +1 -1
- package/dist/types-ts4.5/metadata-core.d.ts +1 -1
- package/dist/types-ts4.5/types.d.ts +25 -8
- package/glyph/chevron-down-circle.js +2 -3
- package/glyph/chevron-down.js +2 -3
- package/glyph/chevron-left-circle.js +2 -3
- package/glyph/chevron-left-large.js +2 -3
- package/glyph/chevron-left.js +2 -3
- package/glyph/chevron-right-circle.js +2 -3
- package/glyph/chevron-right-large.js +2 -3
- package/glyph/chevron-right.js +2 -3
- package/glyph/chevron-up-circle.js +2 -3
- package/glyph/chevron-up.js +2 -3
- package/glyph/hipchat/chevron-down.js +2 -3
- package/glyph/hipchat/chevron-up.js +2 -3
- package/package.json +8 -10
- package/svgs/core/chevron-double-left.svg +1 -0
- package/svgs/core/chevron-double-right.svg +1 -0
- package/svgs/core/chevron-down.svg +1 -0
- package/svgs/core/chevron-left.svg +1 -0
- package/svgs/core/chevron-right.svg +1 -0
- package/svgs/core/chevron-up.svg +1 -0
- package/dist/cjs/components/styles.js +0 -64
- package/dist/cjs/components/utils.js +0 -9
- package/dist/es2019/components/styles.js +0 -58
- package/dist/es2019/components/utils.js +0 -1
- package/dist/esm/components/styles.js +0 -57
- package/dist/esm/components/utils.js +0 -3
- package/dist/types/components/styles.d.ts +0 -28
- package/dist/types/components/utils.d.ts +0 -1
- package/dist/types-ts4.5/components/styles.d.ts +0 -28
- package/dist/types-ts4.5/components/utils.d.ts +0 -1
|
@@ -1,58 +0,0 @@
|
|
|
1
|
-
import { dimensions } from '../constants';
|
|
2
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
3
|
-
import { css } from '@emotion/react';
|
|
4
|
-
export const commonSVGStyles = {
|
|
5
|
-
overflow: 'hidden',
|
|
6
|
-
pointerEvents: 'none',
|
|
7
|
-
/**
|
|
8
|
-
* Stop-color doesn't properly apply in chrome when the inherited/current color changes.
|
|
9
|
-
* We have to initially set stop-color to inherit (either via DOM attribute or an initial CSS
|
|
10
|
-
* rule) and then override it with currentColor for the color changes to be picked up.
|
|
11
|
-
*/
|
|
12
|
-
stop: {
|
|
13
|
-
stopColor: 'currentColor'
|
|
14
|
-
}
|
|
15
|
-
};
|
|
16
|
-
|
|
17
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
18
|
-
const smallStyles = css(dimensions.small);
|
|
19
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
20
|
-
const mediumStyles = css(dimensions.medium);
|
|
21
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
22
|
-
const largeStyles = css(dimensions.large);
|
|
23
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
24
|
-
const xlargeStyles = css(dimensions.xlarge);
|
|
25
|
-
|
|
26
|
-
// pre-built css style-size map
|
|
27
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
|
|
28
|
-
export const sizeStyleMap = {
|
|
29
|
-
small: smallStyles,
|
|
30
|
-
medium: mediumStyles,
|
|
31
|
-
large: largeStyles,
|
|
32
|
-
xlarge: xlargeStyles
|
|
33
|
-
};
|
|
34
|
-
|
|
35
|
-
/**
|
|
36
|
-
* Returns the width of the icon's parent span. This function has
|
|
37
|
-
* special behaviour to deal with icon-file-type specifically.
|
|
38
|
-
*
|
|
39
|
-
* The reality is the SVG still has its own dimensions, so this is
|
|
40
|
-
* a secondary fallback which in 95% of cases is not required.
|
|
41
|
-
* It's only really being kept to maintain backward compatability.
|
|
42
|
-
*/
|
|
43
|
-
export const getIconSize = ({
|
|
44
|
-
width,
|
|
45
|
-
height,
|
|
46
|
-
size
|
|
47
|
-
}) => {
|
|
48
|
-
if (width && height) {
|
|
49
|
-
return {
|
|
50
|
-
width,
|
|
51
|
-
height
|
|
52
|
-
};
|
|
53
|
-
}
|
|
54
|
-
if (size) {
|
|
55
|
-
return dimensions[size];
|
|
56
|
-
}
|
|
57
|
-
return undefined;
|
|
58
|
-
};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export const getBackground = () => "var(--ds-surface, #FFFFFF)";
|
|
@@ -1,57 +0,0 @@
|
|
|
1
|
-
import { dimensions } from '../constants';
|
|
2
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
|
|
3
|
-
import { css } from '@emotion/react';
|
|
4
|
-
export var commonSVGStyles = {
|
|
5
|
-
overflow: 'hidden',
|
|
6
|
-
pointerEvents: 'none',
|
|
7
|
-
/**
|
|
8
|
-
* Stop-color doesn't properly apply in chrome when the inherited/current color changes.
|
|
9
|
-
* We have to initially set stop-color to inherit (either via DOM attribute or an initial CSS
|
|
10
|
-
* rule) and then override it with currentColor for the color changes to be picked up.
|
|
11
|
-
*/
|
|
12
|
-
stop: {
|
|
13
|
-
stopColor: 'currentColor'
|
|
14
|
-
}
|
|
15
|
-
};
|
|
16
|
-
|
|
17
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
18
|
-
var smallStyles = css(dimensions.small);
|
|
19
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
20
|
-
var mediumStyles = css(dimensions.medium);
|
|
21
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
22
|
-
var largeStyles = css(dimensions.large);
|
|
23
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
|
|
24
|
-
var xlargeStyles = css(dimensions.xlarge);
|
|
25
|
-
|
|
26
|
-
// pre-built css style-size map
|
|
27
|
-
// eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
|
|
28
|
-
export var sizeStyleMap = {
|
|
29
|
-
small: smallStyles,
|
|
30
|
-
medium: mediumStyles,
|
|
31
|
-
large: largeStyles,
|
|
32
|
-
xlarge: xlargeStyles
|
|
33
|
-
};
|
|
34
|
-
|
|
35
|
-
/**
|
|
36
|
-
* Returns the width of the icon's parent span. This function has
|
|
37
|
-
* special behaviour to deal with icon-file-type specifically.
|
|
38
|
-
*
|
|
39
|
-
* The reality is the SVG still has its own dimensions, so this is
|
|
40
|
-
* a secondary fallback which in 95% of cases is not required.
|
|
41
|
-
* It's only really being kept to maintain backward compatability.
|
|
42
|
-
*/
|
|
43
|
-
export var getIconSize = function getIconSize(_ref) {
|
|
44
|
-
var width = _ref.width,
|
|
45
|
-
height = _ref.height,
|
|
46
|
-
size = _ref.size;
|
|
47
|
-
if (width && height) {
|
|
48
|
-
return {
|
|
49
|
-
width: width,
|
|
50
|
-
height: height
|
|
51
|
-
};
|
|
52
|
-
}
|
|
53
|
-
if (size) {
|
|
54
|
-
return dimensions[size];
|
|
55
|
-
}
|
|
56
|
-
return undefined;
|
|
57
|
-
};
|
|
@@ -1,28 +0,0 @@
|
|
|
1
|
-
import type { Size } from '../types';
|
|
2
|
-
import { type CSSObject } from '@emotion/react';
|
|
3
|
-
export declare const commonSVGStyles: CSSObject;
|
|
4
|
-
export declare const sizeStyleMap: {
|
|
5
|
-
small: import("@emotion/react").SerializedStyles;
|
|
6
|
-
medium: import("@emotion/react").SerializedStyles;
|
|
7
|
-
large: import("@emotion/react").SerializedStyles;
|
|
8
|
-
xlarge: import("@emotion/react").SerializedStyles;
|
|
9
|
-
};
|
|
10
|
-
/**
|
|
11
|
-
* Returns the width of the icon's parent span. This function has
|
|
12
|
-
* special behaviour to deal with icon-file-type specifically.
|
|
13
|
-
*
|
|
14
|
-
* The reality is the SVG still has its own dimensions, so this is
|
|
15
|
-
* a secondary fallback which in 95% of cases is not required.
|
|
16
|
-
* It's only really being kept to maintain backward compatability.
|
|
17
|
-
*/
|
|
18
|
-
export declare const getIconSize: ({ width, height, size, }: {
|
|
19
|
-
size?: Size | undefined;
|
|
20
|
-
width?: number | undefined;
|
|
21
|
-
height?: number | undefined;
|
|
22
|
-
}) => {
|
|
23
|
-
readonly width: string;
|
|
24
|
-
readonly height: string;
|
|
25
|
-
} | {
|
|
26
|
-
width: number;
|
|
27
|
-
height: number;
|
|
28
|
-
} | undefined;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare const getBackground: () => "var(--ds-surface)";
|
|
@@ -1,28 +0,0 @@
|
|
|
1
|
-
import type { Size } from '../types';
|
|
2
|
-
import { type CSSObject } from '@emotion/react';
|
|
3
|
-
export declare const commonSVGStyles: CSSObject;
|
|
4
|
-
export declare const sizeStyleMap: {
|
|
5
|
-
small: import("@emotion/react").SerializedStyles;
|
|
6
|
-
medium: import("@emotion/react").SerializedStyles;
|
|
7
|
-
large: import("@emotion/react").SerializedStyles;
|
|
8
|
-
xlarge: import("@emotion/react").SerializedStyles;
|
|
9
|
-
};
|
|
10
|
-
/**
|
|
11
|
-
* Returns the width of the icon's parent span. This function has
|
|
12
|
-
* special behaviour to deal with icon-file-type specifically.
|
|
13
|
-
*
|
|
14
|
-
* The reality is the SVG still has its own dimensions, so this is
|
|
15
|
-
* a secondary fallback which in 95% of cases is not required.
|
|
16
|
-
* It's only really being kept to maintain backward compatability.
|
|
17
|
-
*/
|
|
18
|
-
export declare const getIconSize: ({ width, height, size, }: {
|
|
19
|
-
size?: Size | undefined;
|
|
20
|
-
width?: number | undefined;
|
|
21
|
-
height?: number | undefined;
|
|
22
|
-
}) => {
|
|
23
|
-
readonly width: string;
|
|
24
|
-
readonly height: string;
|
|
25
|
-
} | {
|
|
26
|
-
width: number;
|
|
27
|
-
height: number;
|
|
28
|
-
} | undefined;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare const getBackground: () => "var(--ds-surface)";
|