@atlaskit/status 1.4.8 → 1.4.10
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 +296 -125
- package/afm-cc/tsconfig.json +3 -0
- package/afm-jira/tsconfig.json +40 -0
- package/dist/cjs/components/Status.js +6 -2
- package/dist/cjs/components/StatusPicker.js +9 -5
- package/dist/cjs/components/analytics.js +1 -1
- package/dist/cjs/components/internal/color-palette.js +12 -7
- package/dist/cjs/components/internal/color.js +20 -7
- package/dist/es2019/components/Status.js +6 -1
- package/dist/es2019/components/StatusPicker.js +9 -3
- package/dist/es2019/components/analytics.js +1 -1
- package/dist/es2019/components/internal/color-palette.js +16 -12
- package/dist/es2019/components/internal/color.js +29 -27
- package/dist/esm/components/Status.js +6 -1
- package/dist/esm/components/StatusPicker.js +9 -3
- package/dist/esm/components/analytics.js +1 -1
- package/dist/esm/components/internal/color-palette.js +12 -7
- package/dist/esm/components/internal/color.js +21 -8
- package/dist/types/components/Status.d.ts +1 -1
- package/dist/types/components/StatusPicker.d.ts +4 -4
- package/dist/types/components/analytics.d.ts +1 -1
- package/dist/types/components/internal/color-palette.d.ts +2 -2
- package/dist/types/components/internal/color.d.ts +1 -1
- package/dist/types-ts4.5/components/Status.d.ts +1 -1
- package/dist/types-ts4.5/components/StatusPicker.d.ts +4 -4
- package/dist/types-ts4.5/components/analytics.d.ts +1 -1
- package/dist/types-ts4.5/components/internal/color-palette.d.ts +2 -2
- package/dist/types-ts4.5/components/internal/color.d.ts +1 -1
- package/docs/0-intro.tsx +15 -21
- package/element/package.json +1 -1
- package/package.json +78 -79
- package/picker/package.json +1 -1
- package/report.api.md +35 -36
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
|
|
2
|
+
import { type WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
|
|
3
3
|
export type Color = 'neutral' | 'purple' | 'blue' | 'red' | 'yellow' | 'green';
|
|
4
4
|
export type StatusStyle = 'bold' | 'subtle';
|
|
5
5
|
export interface OwnProps {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { WrappedComponentProps } from 'react-intl-next';
|
|
3
|
-
import { Color } from './Status';
|
|
2
|
+
import { type WrappedComponentProps } from 'react-intl-next';
|
|
3
|
+
import { type Color } from './Status';
|
|
4
4
|
export type ColorType = Color;
|
|
5
5
|
export interface Props {
|
|
6
6
|
selectedColor: ColorType;
|
|
@@ -11,6 +11,6 @@ export interface Props {
|
|
|
11
11
|
onTextChanged: (value: string) => void;
|
|
12
12
|
autoFocus?: boolean;
|
|
13
13
|
}
|
|
14
|
-
export declare const StatusPicker: React.FC<import("react-intl-next").WithIntlProps<Props & WrappedComponentProps
|
|
15
|
-
WrappedComponent: React.ComponentType<Props & WrappedComponentProps
|
|
14
|
+
export declare const StatusPicker: React.FC<import("react-intl-next").WithIntlProps<Props & WrappedComponentProps>> & {
|
|
15
|
+
WrappedComponent: React.ComponentType<Props & WrappedComponentProps>;
|
|
16
16
|
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { CreateUIAnalyticsEvent, UIAnalyticsEvent } from '@atlaskit/analytics-next';
|
|
1
|
+
import { type CreateUIAnalyticsEvent, type UIAnalyticsEvent } from '@atlaskit/analytics-next';
|
|
2
2
|
export declare const ELEMENTS_CHANNEL = "fabric-elements";
|
|
3
3
|
type EventPayload = {
|
|
4
4
|
action: string;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx } from '@emotion/react';
|
|
2
|
-
import { Color as ColorType } from '../Status';
|
|
2
|
+
import { type Color as ColorType } from '../Status';
|
|
3
3
|
interface ColorPaletteProps {
|
|
4
4
|
selectedColor?: ColorType;
|
|
5
5
|
onClick: (value: ColorType) => void;
|
|
@@ -7,5 +7,5 @@ interface ColorPaletteProps {
|
|
|
7
7
|
cols?: number;
|
|
8
8
|
className?: string;
|
|
9
9
|
}
|
|
10
|
-
declare const _default: ({ cols, onClick, selectedColor, className, onHover
|
|
10
|
+
declare const _default: ({ cols, onClick, selectedColor, className, onHover }: ColorPaletteProps) => jsx.JSX.Element;
|
|
11
11
|
export default _default;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
|
|
2
|
+
import { type WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
|
|
3
3
|
export type Color = 'neutral' | 'purple' | 'blue' | 'red' | 'yellow' | 'green';
|
|
4
4
|
export type StatusStyle = 'bold' | 'subtle';
|
|
5
5
|
export interface OwnProps {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { WrappedComponentProps } from 'react-intl-next';
|
|
3
|
-
import { Color } from './Status';
|
|
2
|
+
import { type WrappedComponentProps } from 'react-intl-next';
|
|
3
|
+
import { type Color } from './Status';
|
|
4
4
|
export type ColorType = Color;
|
|
5
5
|
export interface Props {
|
|
6
6
|
selectedColor: ColorType;
|
|
@@ -11,6 +11,6 @@ export interface Props {
|
|
|
11
11
|
onTextChanged: (value: string) => void;
|
|
12
12
|
autoFocus?: boolean;
|
|
13
13
|
}
|
|
14
|
-
export declare const StatusPicker: React.FC<import("react-intl-next").WithIntlProps<Props & WrappedComponentProps
|
|
15
|
-
WrappedComponent: React.ComponentType<Props & WrappedComponentProps
|
|
14
|
+
export declare const StatusPicker: React.FC<import("react-intl-next").WithIntlProps<Props & WrappedComponentProps>> & {
|
|
15
|
+
WrappedComponent: React.ComponentType<Props & WrappedComponentProps>;
|
|
16
16
|
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { CreateUIAnalyticsEvent, UIAnalyticsEvent } from '@atlaskit/analytics-next';
|
|
1
|
+
import { type CreateUIAnalyticsEvent, type UIAnalyticsEvent } from '@atlaskit/analytics-next';
|
|
2
2
|
export declare const ELEMENTS_CHANNEL = "fabric-elements";
|
|
3
3
|
type EventPayload = {
|
|
4
4
|
action: string;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx } from '@emotion/react';
|
|
2
|
-
import { Color as ColorType } from '../Status';
|
|
2
|
+
import { type Color as ColorType } from '../Status';
|
|
3
3
|
interface ColorPaletteProps {
|
|
4
4
|
selectedColor?: ColorType;
|
|
5
5
|
onClick: (value: ColorType) => void;
|
|
@@ -7,5 +7,5 @@ interface ColorPaletteProps {
|
|
|
7
7
|
cols?: number;
|
|
8
8
|
className?: string;
|
|
9
9
|
}
|
|
10
|
-
declare const _default: ({ cols, onClick, selectedColor, className, onHover
|
|
10
|
+
declare const _default: ({ cols, onClick, selectedColor, className, onHover }: ColorPaletteProps) => jsx.JSX.Element;
|
|
11
11
|
export default _default;
|
package/docs/0-intro.tsx
CHANGED
|
@@ -1,11 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import {
|
|
3
|
-
md,
|
|
4
|
-
Example,
|
|
5
|
-
Props,
|
|
6
|
-
code,
|
|
7
|
-
AtlassianInternalWarning,
|
|
8
|
-
} from '@atlaskit/docs';
|
|
2
|
+
import { md, Example, Props, code, AtlassianInternalWarning } from '@atlaskit/docs';
|
|
9
3
|
|
|
10
4
|
import StatusExample from '../examples/00-simple-status';
|
|
11
5
|
const StatusSource = require('!!raw-loader!../examples/00-simple-status');
|
|
@@ -24,13 +18,13 @@ This component is the implementation of the Status element in React.
|
|
|
24
18
|
${code`import { Status, Color } from '@atlaskit/status';`}
|
|
25
19
|
|
|
26
20
|
${(
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
21
|
+
<Example
|
|
22
|
+
packageName="@atlaskit/status"
|
|
23
|
+
Component={StatusExample}
|
|
24
|
+
title="Status"
|
|
25
|
+
source={StatusSource}
|
|
26
|
+
/>
|
|
27
|
+
)}
|
|
34
28
|
|
|
35
29
|
### Status Picker
|
|
36
30
|
|
|
@@ -39,13 +33,13 @@ This component is the implementation of the Status element in React.
|
|
|
39
33
|
|
|
40
34
|
|
|
41
35
|
${(
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
36
|
+
<Example
|
|
37
|
+
packageName="@atlaskit/status"
|
|
38
|
+
Component={StatusPickerExample}
|
|
39
|
+
title="Status Picker"
|
|
40
|
+
source={StatusPickerSource}
|
|
41
|
+
/>
|
|
42
|
+
)}
|
|
49
43
|
|
|
50
44
|
${(<Props heading="StatusPicker Props" props={StatusPickerProps} />)}
|
|
51
45
|
`;
|
package/element/package.json
CHANGED
package/package.json
CHANGED
|
@@ -1,81 +1,80 @@
|
|
|
1
1
|
{
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
}
|
|
2
|
+
"name": "@atlaskit/status",
|
|
3
|
+
"version": "1.4.10",
|
|
4
|
+
"description": "Fabric Status React Components",
|
|
5
|
+
"publishConfig": {
|
|
6
|
+
"registry": "https://registry.npmjs.org/"
|
|
7
|
+
},
|
|
8
|
+
"repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
|
|
9
|
+
"author": "Atlassian Pty Ltd",
|
|
10
|
+
"license": "Apache-2.0",
|
|
11
|
+
"main": "dist/cjs/index.js",
|
|
12
|
+
"module": "dist/esm/index.js",
|
|
13
|
+
"module:es2019": "dist/es2019/index.js",
|
|
14
|
+
"types": "dist/types/index.d.ts",
|
|
15
|
+
"atlaskit:src": "src/index.ts",
|
|
16
|
+
"atlassian": {
|
|
17
|
+
"team": "Editor: Scarlet",
|
|
18
|
+
"releaseModel": "continuous",
|
|
19
|
+
"website": {
|
|
20
|
+
"name": "Status"
|
|
21
|
+
},
|
|
22
|
+
"runReact18": false
|
|
23
|
+
},
|
|
24
|
+
"config": {
|
|
25
|
+
"access": "public"
|
|
26
|
+
},
|
|
27
|
+
"dependencies": {
|
|
28
|
+
"@atlaskit/analytics-next": "^9.3.0",
|
|
29
|
+
"@atlaskit/icon": "^22.4.0",
|
|
30
|
+
"@atlaskit/lozenge": "^11.8.0",
|
|
31
|
+
"@atlaskit/primitives": "^8.0.0",
|
|
32
|
+
"@atlaskit/textfield": "^6.4.0",
|
|
33
|
+
"@atlaskit/theme": "^12.10.0",
|
|
34
|
+
"@atlaskit/tokens": "^1.51.0",
|
|
35
|
+
"@babel/runtime": "^7.0.0",
|
|
36
|
+
"@emotion/react": "^11.7.1"
|
|
37
|
+
},
|
|
38
|
+
"peerDependencies": {
|
|
39
|
+
"react": "^16.8.0",
|
|
40
|
+
"react-intl-next": "npm:react-intl@^5.18.1"
|
|
41
|
+
},
|
|
42
|
+
"devDependencies": {
|
|
43
|
+
"@af/visual-regression": "*",
|
|
44
|
+
"@atlaskit/elements-test-helpers": "^0.7.0",
|
|
45
|
+
"@atlaskit/visual-regression": "*",
|
|
46
|
+
"@testing-library/jest-dom": "^6.4.5",
|
|
47
|
+
"@testing-library/react": "^12.1.5",
|
|
48
|
+
"enzyme": "^3.10.0",
|
|
49
|
+
"enzyme-adapter-react-16": "^1.15.1",
|
|
50
|
+
"react": "^16.8.0",
|
|
51
|
+
"react-intl-next": "npm:react-intl@^5.18.1",
|
|
52
|
+
"typescript": "~5.4.2"
|
|
53
|
+
},
|
|
54
|
+
"keywords": [
|
|
55
|
+
"ui",
|
|
56
|
+
"date",
|
|
57
|
+
"fabric",
|
|
58
|
+
"editor"
|
|
59
|
+
],
|
|
60
|
+
"techstack": {
|
|
61
|
+
"@repo/internal": {
|
|
62
|
+
"design-tokens": [
|
|
63
|
+
"color"
|
|
64
|
+
]
|
|
65
|
+
}
|
|
66
|
+
},
|
|
67
|
+
"typesVersions": {
|
|
68
|
+
">=4.5 <4.9": {
|
|
69
|
+
"*": [
|
|
70
|
+
"dist/types-ts4.5/*",
|
|
71
|
+
"dist/types-ts4.5/index.d.ts"
|
|
72
|
+
]
|
|
73
|
+
}
|
|
74
|
+
},
|
|
75
|
+
"af:exports": {
|
|
76
|
+
".": "./src/index.ts",
|
|
77
|
+
"./element": "./src/element.ts",
|
|
78
|
+
"./picker": "./src/picker.ts"
|
|
79
|
+
}
|
|
81
80
|
}
|
package/picker/package.json
CHANGED
package/report.api.md
CHANGED
|
@@ -2,7 +2,8 @@
|
|
|
2
2
|
|
|
3
3
|
## API Report File for "@atlaskit/status"
|
|
4
4
|
|
|
5
|
-
> Do not edit this file. This report is auto-generated using
|
|
5
|
+
> Do not edit this file. This report is auto-generated using
|
|
6
|
+
> [API Extractor](https://api-extractor.com/).
|
|
6
7
|
> [Learn more about API reports](https://hello.atlassian.net/wiki/spaces/UR/pages/1825484529/Package+API+Reports)
|
|
7
8
|
|
|
8
9
|
### Table of contents
|
|
@@ -32,20 +33,20 @@ type ColorType = Color;
|
|
|
32
33
|
|
|
33
34
|
// @public (undocumented)
|
|
34
35
|
interface OwnProps {
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
36
|
+
// (undocumented)
|
|
37
|
+
color: Color;
|
|
38
|
+
// (undocumented)
|
|
39
|
+
localId?: string;
|
|
40
|
+
// (undocumented)
|
|
41
|
+
onClick?: (event: React.SyntheticEvent<any>) => void;
|
|
42
|
+
// (undocumented)
|
|
43
|
+
onHover?: () => void;
|
|
44
|
+
// (undocumented)
|
|
45
|
+
role?: string;
|
|
46
|
+
// (undocumented)
|
|
47
|
+
style?: StatusStyle;
|
|
48
|
+
// (undocumented)
|
|
49
|
+
text: string;
|
|
49
50
|
}
|
|
50
51
|
|
|
51
52
|
// @public (undocumented)
|
|
@@ -53,34 +54,32 @@ export type Props = OwnProps & WithAnalyticsEventsProps;
|
|
|
53
54
|
|
|
54
55
|
// @public (undocumented)
|
|
55
56
|
export const Status: ForwardRefExoticComponent<
|
|
56
|
-
|
|
57
|
+
Omit<Props, keyof WithAnalyticsEventsProps> & RefAttributes<any>
|
|
57
58
|
>;
|
|
58
59
|
|
|
59
60
|
// @public (undocumented)
|
|
60
61
|
export const StatusPicker: React_2.FC<
|
|
61
|
-
|
|
62
|
+
WithIntlProps<StatusPickerProps & WrappedComponentProps<'intl'>>
|
|
62
63
|
> & {
|
|
63
|
-
|
|
64
|
-
StatusPickerProps & WrappedComponentProps<'intl'>
|
|
65
|
-
>;
|
|
64
|
+
WrappedComponent: React_2.ComponentType<StatusPickerProps & WrappedComponentProps<'intl'>>;
|
|
66
65
|
};
|
|
67
66
|
|
|
68
67
|
// @public (undocumented)
|
|
69
68
|
export interface StatusPickerProps {
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
69
|
+
// (undocumented)
|
|
70
|
+
autoFocus?: boolean;
|
|
71
|
+
// (undocumented)
|
|
72
|
+
onColorClick: (value: ColorType) => void;
|
|
73
|
+
// (undocumented)
|
|
74
|
+
onColorHover?: (value: ColorType) => void;
|
|
75
|
+
// (undocumented)
|
|
76
|
+
onEnter: () => void;
|
|
77
|
+
// (undocumented)
|
|
78
|
+
onTextChanged: (value: string) => void;
|
|
79
|
+
// (undocumented)
|
|
80
|
+
selectedColor: ColorType;
|
|
81
|
+
// (undocumented)
|
|
82
|
+
text: string;
|
|
84
83
|
}
|
|
85
84
|
|
|
86
85
|
// @public (undocumented)
|
|
@@ -97,8 +96,8 @@ export type StatusStyle = 'bold' | 'subtle';
|
|
|
97
96
|
|
|
98
97
|
```json
|
|
99
98
|
{
|
|
100
|
-
|
|
101
|
-
|
|
99
|
+
"react": "^16.8.0",
|
|
100
|
+
"react-intl-next": "npm:react-intl@^5.18.1"
|
|
102
101
|
}
|
|
103
102
|
```
|
|
104
103
|
|