@atlaskit/smart-card 17.3.0 → 17.4.1
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 +24 -0
- package/dist/cjs/constants.js +16 -1
- package/dist/cjs/extractors/flexible/icon/extract-document-type-icon.js +28 -7
- package/dist/cjs/extractors/flexible/icon/extract-file-formatIcon.js +88 -22
- package/dist/cjs/extractors/flexible/icon/extract-jira-task-icon.js +36 -9
- package/dist/cjs/extractors/flexible/icon/extract-jsonld-data-icon.js +33 -9
- package/dist/cjs/extractors/flexible/icon/extract-provider-icon.js +20 -3
- package/dist/cjs/extractors/flexible/icon/extract-url-icon.js +4 -1
- package/dist/cjs/extractors/flexible/icon/index.js +11 -20
- package/dist/cjs/extractors/flexible/index.js +5 -0
- package/dist/cjs/utils/flexible.js +2 -2
- package/dist/cjs/version.json +1 -1
- package/dist/cjs/view/CardWithUrl/component.js +1 -1
- package/dist/cjs/view/FlexibleCard/components/blocks/utils.js +27 -7
- package/dist/cjs/view/FlexibleCard/components/common/atlaskit-icon/index.js +2 -0
- package/dist/cjs/view/FlexibleCard/components/elements/badge/index.js +2 -4
- package/dist/cjs/view/FlexibleCard/components/elements/index.js +6 -2
- package/dist/cjs/view/FlexibleCard/components/elements/text/index.js +6 -2
- package/dist/cjs/view/FlexibleCard/components/elements/utils.js +64 -39
- package/dist/es2019/constants.js +15 -1
- package/dist/es2019/extractors/flexible/icon/extract-document-type-icon.js +28 -7
- package/dist/es2019/extractors/flexible/icon/extract-file-formatIcon.js +88 -22
- package/dist/es2019/extractors/flexible/icon/extract-jira-task-icon.js +36 -9
- package/dist/es2019/extractors/flexible/icon/extract-jsonld-data-icon.js +33 -9
- package/dist/es2019/extractors/flexible/icon/extract-provider-icon.js +19 -3
- package/dist/es2019/extractors/flexible/icon/extract-url-icon.js +4 -1
- package/dist/es2019/extractors/flexible/icon/index.js +6 -9
- package/dist/es2019/extractors/flexible/index.js +5 -1
- package/dist/es2019/utils/flexible.js +2 -2
- package/dist/es2019/version.json +1 -1
- package/dist/es2019/view/CardWithUrl/component.js +1 -1
- package/dist/es2019/view/FlexibleCard/components/blocks/utils.js +38 -6
- package/dist/es2019/view/FlexibleCard/components/common/atlaskit-icon/index.js +2 -0
- package/dist/es2019/view/FlexibleCard/components/elements/badge/index.js +2 -4
- package/dist/es2019/view/FlexibleCard/components/elements/index.js +3 -1
- package/dist/es2019/view/FlexibleCard/components/elements/text/index.js +5 -3
- package/dist/es2019/view/FlexibleCard/components/elements/utils.js +66 -37
- package/dist/esm/constants.js +15 -1
- package/dist/esm/extractors/flexible/icon/extract-document-type-icon.js +28 -7
- package/dist/esm/extractors/flexible/icon/extract-file-formatIcon.js +88 -22
- package/dist/esm/extractors/flexible/icon/extract-jira-task-icon.js +36 -9
- package/dist/esm/extractors/flexible/icon/extract-jsonld-data-icon.js +33 -9
- package/dist/esm/extractors/flexible/icon/extract-provider-icon.js +19 -3
- package/dist/esm/extractors/flexible/icon/extract-url-icon.js +4 -1
- package/dist/esm/extractors/flexible/icon/index.js +12 -20
- package/dist/esm/extractors/flexible/index.js +5 -1
- package/dist/esm/utils/flexible.js +2 -2
- package/dist/esm/version.json +1 -1
- package/dist/esm/view/CardWithUrl/component.js +1 -1
- package/dist/esm/view/FlexibleCard/components/blocks/utils.js +25 -7
- package/dist/esm/view/FlexibleCard/components/common/atlaskit-icon/index.js +2 -0
- package/dist/esm/view/FlexibleCard/components/elements/badge/index.js +2 -4
- package/dist/esm/view/FlexibleCard/components/elements/index.js +3 -1
- package/dist/esm/view/FlexibleCard/components/elements/text/index.js +7 -2
- package/dist/esm/view/FlexibleCard/components/elements/utils.js +64 -39
- package/dist/types/__fixtures__/flexible-ui-data-context.d.ts +3 -0
- package/dist/types/constants.d.ts +3 -1
- package/dist/types/extractors/flexible/icon/extract-provider-icon.d.ts +1 -1
- package/dist/types/extractors/flexible/icon/index.d.ts +3 -3
- package/dist/types/extractors/flexible/icon/types.d.ts +5 -1
- package/dist/types/state/flexible-ui-context/types.d.ts +4 -2
- package/dist/types/utils/flexible.d.ts +1 -2
- package/dist/types/view/FlexibleCard/components/blocks/utils.d.ts +4 -2
- package/dist/types/view/FlexibleCard/components/elements/avatar-group/types.d.ts +1 -2
- package/dist/types/view/FlexibleCard/components/elements/index.d.ts +2 -0
- package/dist/types/view/FlexibleCard/components/elements/text/types.d.ts +1 -0
- package/package.json +1 -1
|
@@ -36,6 +36,11 @@ var elementMappings = (_elementMappings = {}, _defineProperty(_elementMappings,
|
|
|
36
36
|
props: {
|
|
37
37
|
icon: IconType.ProgrammingLanguage
|
|
38
38
|
}
|
|
39
|
+
}), _defineProperty(_elementMappings, ElementName.Snippet, {
|
|
40
|
+
component: Text,
|
|
41
|
+
props: {
|
|
42
|
+
maxLines: 3
|
|
43
|
+
}
|
|
39
44
|
}), _defineProperty(_elementMappings, ElementName.State, {
|
|
40
45
|
component: Lozenge
|
|
41
46
|
}), _defineProperty(_elementMappings, ElementName.SubscriberCount, {
|
|
@@ -49,6 +54,8 @@ var elementMappings = (_elementMappings = {}, _defineProperty(_elementMappings,
|
|
|
49
54
|
component: DateTime
|
|
50
55
|
}), _defineProperty(_elementMappings, ElementName.ModifiedOn, {
|
|
51
56
|
component: DateTime
|
|
57
|
+
}), _defineProperty(_elementMappings, ElementName.Provider, {
|
|
58
|
+
component: Badge
|
|
52
59
|
}), _elementMappings);
|
|
53
60
|
|
|
54
61
|
var getContextKey = function getContextKey(name) {
|
|
@@ -57,17 +64,6 @@ var getContextKey = function getContextKey(name) {
|
|
|
57
64
|
return name.length > 0 ? name.charAt(0).toLowerCase() + name.slice(1) : undefined;
|
|
58
65
|
};
|
|
59
66
|
|
|
60
|
-
var getFormattedMessage = function getFormattedMessage(descriptor, value) {
|
|
61
|
-
return value ? {
|
|
62
|
-
message: {
|
|
63
|
-
descriptor: descriptor,
|
|
64
|
-
values: {
|
|
65
|
-
context: value
|
|
66
|
-
}
|
|
67
|
-
}
|
|
68
|
-
} : undefined;
|
|
69
|
-
};
|
|
70
|
-
|
|
71
67
|
var getData = function getData(elementName, contextKey, context) {
|
|
72
68
|
if (!context) {
|
|
73
69
|
return undefined;
|
|
@@ -76,52 +72,81 @@ var getData = function getData(elementName, contextKey, context) {
|
|
|
76
72
|
var data = context[contextKey];
|
|
77
73
|
|
|
78
74
|
switch (elementName) {
|
|
75
|
+
case ElementName.AuthorGroup:
|
|
76
|
+
case ElementName.CollaboratorGroup:
|
|
77
|
+
return toAvatarGroupProps(data);
|
|
78
|
+
|
|
79
79
|
case ElementName.CommentCount:
|
|
80
80
|
case ElementName.ProgrammingLanguage:
|
|
81
81
|
case ElementName.SubscriberCount:
|
|
82
|
-
return
|
|
83
|
-
label: data
|
|
84
|
-
};
|
|
85
|
-
|
|
86
|
-
case ElementName.AuthorGroup:
|
|
87
|
-
return {
|
|
88
|
-
items: context.authorGroup
|
|
89
|
-
};
|
|
90
|
-
|
|
91
|
-
case ElementName.CollaboratorGroup:
|
|
92
|
-
return {
|
|
93
|
-
items: context.collaboratorGroup
|
|
94
|
-
};
|
|
82
|
+
return toBadgeProps(data);
|
|
95
83
|
|
|
96
84
|
case ElementName.CreatedBy:
|
|
97
|
-
return
|
|
85
|
+
return toFormattedTextProps(messages.created_by, context.createdBy);
|
|
86
|
+
|
|
87
|
+
case ElementName.CreatedOn:
|
|
88
|
+
return toDateTimeProps('created', context.createdOn);
|
|
98
89
|
|
|
99
90
|
case ElementName.ModifiedBy:
|
|
100
|
-
return
|
|
91
|
+
return toFormattedTextProps(messages.modified_by, context.modifiedBy);
|
|
101
92
|
|
|
102
93
|
case ElementName.ModifiedOn:
|
|
103
|
-
return context.modifiedOn
|
|
104
|
-
date: new Date(context.modifiedOn),
|
|
105
|
-
type: 'modified'
|
|
106
|
-
} : undefined;
|
|
94
|
+
return toDateTimeProps('modified', context.modifiedOn);
|
|
107
95
|
|
|
108
|
-
case ElementName.
|
|
109
|
-
return
|
|
110
|
-
date: new Date(context.createdOn),
|
|
111
|
-
type: 'created'
|
|
112
|
-
} : undefined;
|
|
96
|
+
case ElementName.Snippet:
|
|
97
|
+
return toTextProps(data);
|
|
113
98
|
|
|
114
99
|
case ElementName.Title:
|
|
115
|
-
return
|
|
116
|
-
text: context.title,
|
|
117
|
-
url: context.url
|
|
118
|
-
};
|
|
100
|
+
return toLinkProps(context.title, context.url);
|
|
119
101
|
|
|
120
102
|
default:
|
|
121
103
|
return data;
|
|
122
104
|
}
|
|
123
105
|
};
|
|
124
106
|
|
|
107
|
+
var toAvatarGroupProps = function toAvatarGroupProps(items) {
|
|
108
|
+
return items ? {
|
|
109
|
+
items: items
|
|
110
|
+
} : undefined;
|
|
111
|
+
};
|
|
112
|
+
|
|
113
|
+
var toBadgeProps = function toBadgeProps(label) {
|
|
114
|
+
return label ? {
|
|
115
|
+
label: label
|
|
116
|
+
} : undefined;
|
|
117
|
+
};
|
|
118
|
+
|
|
119
|
+
var toDateTimeProps = function toDateTimeProps(type, dateString) {
|
|
120
|
+
return dateString ? {
|
|
121
|
+
date: new Date(dateString),
|
|
122
|
+
type: type
|
|
123
|
+
} : undefined;
|
|
124
|
+
};
|
|
125
|
+
|
|
126
|
+
var toFormattedTextProps = function toFormattedTextProps(descriptor, context) {
|
|
127
|
+
return context ? {
|
|
128
|
+
message: {
|
|
129
|
+
descriptor: descriptor,
|
|
130
|
+
values: {
|
|
131
|
+
context: context
|
|
132
|
+
}
|
|
133
|
+
}
|
|
134
|
+
} : undefined;
|
|
135
|
+
};
|
|
136
|
+
|
|
137
|
+
var toLinkProps = function toLinkProps(text, url) {
|
|
138
|
+
return text ? {
|
|
139
|
+
text: text,
|
|
140
|
+
url: url
|
|
141
|
+
} : undefined;
|
|
142
|
+
};
|
|
143
|
+
|
|
144
|
+
var toTextProps = function toTextProps(content) {
|
|
145
|
+
return content ? {
|
|
146
|
+
content: content
|
|
147
|
+
} : undefined;
|
|
148
|
+
};
|
|
149
|
+
|
|
125
150
|
export var createElement = function createElement(name) {
|
|
126
151
|
var _ref = elementMappings[name] || {},
|
|
127
152
|
BaseElement = _ref.component,
|
|
@@ -45,9 +45,11 @@ export declare enum ElementName {
|
|
|
45
45
|
ModifiedOn = "ModifiedOn",
|
|
46
46
|
Priority = "Priority",
|
|
47
47
|
ProgrammingLanguage = "ProgrammingLanguage",
|
|
48
|
+
Snippet = "Snippet",
|
|
48
49
|
State = "State",
|
|
49
50
|
SubscriberCount = "SubscriberCount",
|
|
50
|
-
Title = "Title"
|
|
51
|
+
Title = "Title",
|
|
52
|
+
Provider = "Provider"
|
|
51
53
|
}
|
|
52
54
|
export declare enum ActionName {
|
|
53
55
|
DeleteAction = "DeleteAction"
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import { JsonLd } from 'json-ld-types';
|
|
2
2
|
import { IconDescriptor } from './types';
|
|
3
|
-
declare const extractProviderIcon: (
|
|
3
|
+
declare const extractProviderIcon: (data?: JsonLd.Data.BaseData | undefined) => IconDescriptor | undefined;
|
|
4
4
|
export default extractProviderIcon;
|
|
@@ -3,10 +3,10 @@ import { JsonLd } from 'json-ld-types';
|
|
|
3
3
|
import { IconType, SmartLinkStatus } from '../../../constants';
|
|
4
4
|
import { CardProviderRenderers } from '../../../state/context/types';
|
|
5
5
|
export declare const extractLinkIcon: (response: JsonLd.Response, renderers?: CardProviderRenderers | undefined) => {
|
|
6
|
-
icon: IconType | undefined;
|
|
7
|
-
label: string | undefined;
|
|
8
6
|
render: (() => import("react").ReactNode) | undefined;
|
|
9
|
-
|
|
7
|
+
icon?: IconType | undefined;
|
|
8
|
+
label?: string | undefined;
|
|
9
|
+
url?: string | undefined;
|
|
10
10
|
};
|
|
11
11
|
export declare const extractErrorIcon: (response?: JsonLd.Response<JsonLd.Data.BaseData> | undefined, status?: SmartLinkStatus | undefined) => {
|
|
12
12
|
icon: IconType | undefined;
|
|
@@ -2,6 +2,8 @@ import { LinkLozenge } from '../../extractors/common/lozenge/types';
|
|
|
2
2
|
import { LinkPerson } from '../../extractors/common/person/types';
|
|
3
3
|
import { IconType } from '../../constants';
|
|
4
4
|
export declare type FlexibleUiDataContext = {
|
|
5
|
+
authorGroup?: LinkPerson[];
|
|
6
|
+
collaboratorGroup?: LinkPerson[];
|
|
5
7
|
commentCount?: number;
|
|
6
8
|
createdBy?: string;
|
|
7
9
|
createdOn?: string;
|
|
@@ -10,12 +12,12 @@ export declare type FlexibleUiDataContext = {
|
|
|
10
12
|
modifiedOn?: string;
|
|
11
13
|
priority?: Icon;
|
|
12
14
|
programmingLanguage?: string;
|
|
15
|
+
snippet?: string;
|
|
13
16
|
subscriberCount?: number;
|
|
14
17
|
state?: LinkLozenge;
|
|
15
18
|
title?: string;
|
|
16
19
|
url?: string;
|
|
17
|
-
|
|
18
|
-
collaboratorGroup?: LinkPerson[];
|
|
20
|
+
provider?: Icon;
|
|
19
21
|
};
|
|
20
22
|
export declare type Icon = {
|
|
21
23
|
icon?: IconType;
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
|
|
3
|
-
export declare const isFlexibleUiCard: (appearance: CardAppearance, children?: React.ReactNode) => boolean;
|
|
2
|
+
export declare const isFlexibleUiCard: (children?: React.ReactNode) => boolean;
|
|
4
3
|
export declare const isFlexibleUiBlock: (node: React.ReactNode) => boolean;
|
|
5
4
|
export declare const isFlexibleUiElement: (node: React.ReactNode) => boolean;
|
|
6
5
|
export declare const isFlexibleUiTitleBlock: (node: React.ReactNode) => boolean;
|
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { SerializedStyles } from '@emotion/core';
|
|
3
3
|
import { ActionItem, ElementItem } from './types';
|
|
4
|
-
import { SmartLinkDirection, SmartLinkSize } from '../../../../constants';
|
|
4
|
+
import { ElementName, SmartLinkDirection, SmartLinkSize } from '../../../../constants';
|
|
5
|
+
export declare type ElementDisplaySchemaType = 'inline' | 'block';
|
|
6
|
+
export declare const ElementDisplaySchema: Record<ElementName, ElementDisplaySchemaType[]>;
|
|
5
7
|
export declare const getGapSize: (size: SmartLinkSize) => number;
|
|
6
8
|
export declare const getBaseStyles: (direction: SmartLinkDirection, size: SmartLinkSize) => SerializedStyles;
|
|
7
9
|
export declare const renderChildren: (children: React.ReactNode, size: SmartLinkSize) => React.ReactNode;
|
|
8
|
-
export declare const renderElementItems: (items?: ElementItem[]) => React.ReactNode | undefined;
|
|
10
|
+
export declare const renderElementItems: (items?: ElementItem[], display?: ElementDisplaySchemaType) => React.ReactNode | undefined;
|
|
9
11
|
export declare const renderActionItems: (items?: ActionItem[], size?: SmartLinkSize) => React.ReactNode | undefined;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ElementProps } from '../types';
|
|
2
|
-
declare type AvatarItemProps = {
|
|
2
|
+
export declare type AvatarItemProps = {
|
|
3
3
|
src?: string;
|
|
4
4
|
name: string;
|
|
5
5
|
};
|
|
@@ -7,4 +7,3 @@ export declare type AvatarGroupProps = ElementProps & {
|
|
|
7
7
|
items?: AvatarItemProps[];
|
|
8
8
|
maxCount?: number;
|
|
9
9
|
};
|
|
10
|
-
export {};
|
|
@@ -16,6 +16,8 @@ export declare const ModifiedBy: import("react").FC<TextProps>;
|
|
|
16
16
|
export declare const ModifiedOn: import("react").FC<DateTimeProps>;
|
|
17
17
|
export declare const Priority: import("react").FC<BadgeProps>;
|
|
18
18
|
export declare const ProgrammingLanguage: import("react").FC<BadgeProps>;
|
|
19
|
+
export declare const Snippet: import("react").FC<TextProps>;
|
|
19
20
|
export declare const State: import("react").FC<LozengeProps>;
|
|
20
21
|
export declare const SubscriberCount: import("react").FC<BadgeProps>;
|
|
21
22
|
export declare const Title: import("react").FC<LinkProps>;
|
|
23
|
+
export declare const Provider: import("react").FC<BadgeProps>;
|