@atlaskit/link-create 0.3.0 → 0.3.2

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.
Files changed (46) hide show
  1. package/CHANGELOG.md +12 -0
  2. package/analytics.spec.yaml +85 -0
  3. package/dist/cjs/common/constants.js +10 -0
  4. package/dist/cjs/common/utils/analytics/analytics.codegen.js +27 -0
  5. package/dist/cjs/common/utils/analytics/context.js +103 -0
  6. package/dist/cjs/common/utils/analytics/index.js +18 -0
  7. package/dist/cjs/controllers/callback-context/main.js +17 -3
  8. package/dist/cjs/ui/create-form/main.js +18 -8
  9. package/dist/cjs/ui/error-boundary/error-boundary-ui/error-svg/index.js +1 -0
  10. package/dist/cjs/ui/error-boundary/index.js +22 -2
  11. package/dist/cjs/ui/main.js +51 -15
  12. package/dist/cjs/version.json +1 -1
  13. package/dist/es2019/common/constants.js +2 -0
  14. package/dist/es2019/common/utils/analytics/analytics.codegen.js +20 -0
  15. package/dist/es2019/common/utils/analytics/context.js +86 -0
  16. package/dist/es2019/common/utils/analytics/index.js +1 -0
  17. package/dist/es2019/controllers/callback-context/main.js +18 -2
  18. package/dist/es2019/ui/create-form/main.js +15 -4
  19. package/dist/es2019/ui/error-boundary/error-boundary-ui/error-svg/index.js +1 -0
  20. package/dist/es2019/ui/error-boundary/index.js +20 -2
  21. package/dist/es2019/ui/main.js +53 -16
  22. package/dist/es2019/version.json +1 -1
  23. package/dist/esm/common/constants.js +2 -0
  24. package/dist/esm/common/utils/analytics/analytics.codegen.js +20 -0
  25. package/dist/esm/common/utils/analytics/context.js +91 -0
  26. package/dist/esm/common/utils/analytics/index.js +1 -0
  27. package/dist/esm/controllers/callback-context/main.js +16 -3
  28. package/dist/esm/ui/create-form/main.js +18 -8
  29. package/dist/esm/ui/error-boundary/error-boundary-ui/error-svg/index.js +1 -0
  30. package/dist/esm/ui/error-boundary/index.js +19 -2
  31. package/dist/esm/ui/main.js +49 -15
  32. package/dist/esm/version.json +1 -1
  33. package/dist/types/common/constants.d.ts +2 -0
  34. package/dist/types/common/types.d.ts +80 -0
  35. package/dist/types/common/utils/analytics/analytics.codegen.d.ts +48 -0
  36. package/dist/types/common/utils/analytics/context.d.ts +29 -0
  37. package/dist/types/common/utils/analytics/index.d.ts +1 -0
  38. package/dist/types/controllers/callback-context/main.d.ts +5 -1
  39. package/dist/types/index.d.ts +2 -2
  40. package/dist/types/ui/error-boundary/index.d.ts +2 -6
  41. package/dist/types/ui/group-selection/types.d.ts +1 -14
  42. package/dist/types/ui/main.d.ts +5 -3
  43. package/dist/types/ui/types.d.ts +0 -61
  44. package/package.json +7 -2
  45. package/report.api.md +12 -7
  46. package/tmp/api-report-tmp.d.ts +10 -5
@@ -1,3 +1,4 @@
1
+ import { ReactNode } from 'react';
1
2
  /** Map of field names to a list of validators for that field */
2
3
  export declare type ValidatorMap = Record<string, Validator[]>;
3
4
  export declare type Validator = {
@@ -6,3 +7,82 @@ export declare type Validator = {
6
7
  /** An error message is used to tell a user that the field input is invalid. For example, an error message could be 'Invalid username, needs to be more than 4 characters'. */
7
8
  errorMessage: string;
8
9
  };
10
+ export interface Group {
11
+ /**
12
+ * A label to display for the Group
13
+ */
14
+ label: string;
15
+ /**
16
+ * An icon to display for the Group
17
+ */
18
+ icon: string;
19
+ /**
20
+ * A unique key for the Group
21
+ */
22
+ key: string;
23
+ }
24
+ export interface LinkCreatePlugin {
25
+ /**
26
+ * The Group that this plugin entity belongs to
27
+ */
28
+ group: Group;
29
+ /**
30
+ * A label to display for the plugin entity
31
+ */
32
+ label: string;
33
+ /**
34
+ * An icon to display for the plugin entity
35
+ */
36
+ icon: string;
37
+ /**
38
+ * A unique key for the plugin entity
39
+ */
40
+ key: string;
41
+ /**
42
+ * A renderer function to render the form
43
+ */
44
+ form: ReactNode;
45
+ }
46
+ export interface LinkCreateProps {
47
+ /**
48
+ * A `testId` prop is provided for specified elements, which is a unique
49
+ * string that appears as a data attribute `data-testid` in the rendered code,
50
+ * serving as a hook for automated tests */
51
+ testId?: string;
52
+ plugins: LinkCreatePlugin[];
53
+ /**
54
+ * The initial group key for create. If this is provided, it will jump
55
+ * directly to the entity selection screen
56
+ */
57
+ groupKey?: string;
58
+ /**
59
+ * The initial entity name for create. If this is provided, it will jump
60
+ * directly to the entity creation form.
61
+ * Note: it will be non-optional for now and can move to optional when we have
62
+ * the meta creation flow built.
63
+ */
64
+ entityKey: string;
65
+ /**
66
+ * This callback for when the resource has been successfully created.
67
+ */
68
+ onCreate?: (url: string) => void;
69
+ /**
70
+ * This callback for any errors
71
+ */
72
+ onFailure?: (error: unknown) => void;
73
+ /**
74
+ * This callback for when the form was manually discarded by user
75
+ */
76
+ onCancel?: () => void;
77
+ /**
78
+ * This value controls whether the Create Modal should be active or hidden
79
+ * Default: false
80
+ */
81
+ active?: boolean;
82
+ /**
83
+ * This value tells where the linkCreate was triggered from. And it's for
84
+ * analytic purpose only.
85
+ * Default: unknown
86
+ */
87
+ triggeredFrom?: string;
88
+ }
@@ -0,0 +1,48 @@
1
+ /**
2
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
3
+ *
4
+ * Generates Typescript types for analytics events from analytics.spec.yaml
5
+ *
6
+ * @codegen <<SignedSource::6d7803f5c035dc3cde1be03caa91eb04>>
7
+ * @codegenCommand yarn workspace @atlaskit/link-create run codegen-analytics
8
+ */
9
+ export declare type PackageMetaDataType = {
10
+ packageName: '@atlaskit/link-create';
11
+ packageVersion: string;
12
+ source: 'linkCreate';
13
+ componentName: 'linkCreate';
14
+ };
15
+ export declare type LinkCreateAnalyticsContextType = {
16
+ triggeredFrom: string;
17
+ objectName: string;
18
+ appearance: 'modal' | 'popup';
19
+ };
20
+ export declare type LinkCreateScreenViewedAttributesType = {};
21
+ export declare type ButtonClickedCreateAttributesType = {};
22
+ export declare type ButtonClickedCancelAttributesType = {};
23
+ export declare type LinkCreateScreenClosedAttributesType = {};
24
+ export declare type LinkCreateUnhandledErrorCaughtAttributesType = {
25
+ browserInfo: string;
26
+ error: string;
27
+ componentStack: string | null;
28
+ };
29
+ export declare type ObjectCreatedLinkCreateAttributesType = {
30
+ objectId: string;
31
+ objectType: string;
32
+ };
33
+ declare type AnalyticsEventAttributes = {
34
+ 'screen.linkCreateScreen.viewed': LinkCreateScreenViewedAttributesType;
35
+ 'ui.button.clicked.create': ButtonClickedCreateAttributesType;
36
+ 'ui.button.clicked.cancel': ButtonClickedCancelAttributesType;
37
+ 'screen.linkCreateScreen.closed': LinkCreateScreenClosedAttributesType;
38
+ 'operational.linkCreate.unhandledErrorCaught': LinkCreateUnhandledErrorCaughtAttributesType;
39
+ 'track.object.created.linkCreate': ObjectCreatedLinkCreateAttributesType;
40
+ };
41
+ declare function createEventPayload<K extends keyof AnalyticsEventAttributes>(eventKey: K, attributes: AnalyticsEventAttributes[K]): {
42
+ eventType: string;
43
+ actionSubject: string;
44
+ action: string;
45
+ actionSubjectId: string;
46
+ attributes: AnalyticsEventAttributes[K];
47
+ };
48
+ export default createEventPayload;
@@ -0,0 +1,29 @@
1
+ import React from 'react';
2
+ import { LinkCreateProps } from '../../types';
3
+ import { LinkCreateAnalyticsContextType } from './analytics.codegen';
4
+ export declare type TrackAttribute = <K extends keyof LinkCreateAnalyticsContextType>(attribute: K, value: LinkCreateAnalyticsContextType[K]) => void;
5
+ interface AnalyticsContextType {
6
+ /**
7
+ * Update a single attribute in the analytics context
8
+ */
9
+ trackAttribute: TrackAttribute;
10
+ /**
11
+ * Update a set of attributes in the analytics context
12
+ */
13
+ trackAttributes: (attributes: Partial<LinkCreateAnalyticsContextType>) => void;
14
+ /**
15
+ * Retrieve the current set of attributes
16
+ * Can be used by components to derive/compute new attributes for specific events
17
+ */
18
+ getAttributes: () => LinkCreateAnalyticsContextType;
19
+ }
20
+ /**
21
+ * Hook that exposes the context-level attribute getters and setters.
22
+ */
23
+ export declare const useLinkCreateAnalytics: () => AnalyticsContextType;
24
+ /**
25
+ * Wraps a component with the analytics context + listener to update events with contextual-level attributes.
26
+ * Should be implemented once at the root of the link create.
27
+ */
28
+ export declare function withLinkCreateAnalyticsContext<P extends Pick<LinkCreateProps, 'groupKey' | 'entityKey' | 'triggeredFrom'>>(WrappedComponent: React.ComponentType<P>): React.ComponentType<P>;
29
+ export {};
@@ -0,0 +1 @@
1
+ export { useLinkCreateAnalytics, withLinkCreateAnalyticsContext, } from './context';
@@ -3,7 +3,11 @@ interface LinkCreateCallbackProviderProps {
3
3
  /**
4
4
  * This callback for when the resource has been successfully created.
5
5
  */
6
- onCreate?: (url: string) => void;
6
+ onCreate?: (result: {
7
+ url: string;
8
+ objectId: string;
9
+ objectType: string;
10
+ }) => void;
7
11
  /**
8
12
  * This callback for any errors
9
13
  */
@@ -1,7 +1,7 @@
1
- export type { LinkCreatePlugin, Option } from './ui/types';
1
+ export type { Option } from './ui/types';
2
2
  export type { CreateFormProps } from './ui/index';
3
+ export type { LinkCreateProps, LinkCreatePlugin } from './common/types';
3
4
  export { default, TextField, CreateForm, AsyncSelect } from './ui/index';
4
5
  export { useLinkCreateCallback, LinkCreateCallbackProvider, } from './controllers/callback-context';
5
6
  export { FormContextProvider, useFormContext, } from './controllers/form-context';
6
- export type { LinkCreateProps } from './ui/types';
7
7
  export type { Validator, ValidatorMap } from './common/types';
@@ -1,6 +1,2 @@
1
- import { ReactNode } from 'react';
2
- interface ErrorBoundaryProps {
3
- children: ReactNode;
4
- }
5
- export declare const ErrorBoundary: ({ children }: ErrorBoundaryProps) => JSX.Element;
6
- export {};
1
+ import React from 'react';
2
+ export declare const ErrorBoundary: React.FC<{}>;
@@ -1,17 +1,4 @@
1
- export interface Group {
2
- /**
3
- * A label to display for the Group
4
- */
5
- label: string;
6
- /**
7
- * An icon to display for the Group
8
- */
9
- icon: string;
10
- /**
11
- * A unique key for the Group
12
- */
13
- key: string;
14
- }
1
+ import { Group } from '../../common/types';
15
2
  export interface GroupSelectProps {
16
3
  /**
17
4
  * A `testId` prop is provided for specified elements, which is a unique
@@ -1,5 +1,7 @@
1
1
  /// <reference types="react" />
2
2
  import { jsx } from '@emotion/react';
3
- import { LinkCreateProps } from './types';
4
- declare const LinkCreate: import("react").MemoExoticComponent<(props: LinkCreateProps) => jsx.JSX.Element>;
5
- export default LinkCreate;
3
+ import { LinkCreateProps } from '../common/types';
4
+ import { PackageMetaDataType } from '../common/utils/analytics/analytics.codegen';
5
+ export declare const PACKAGE_DATA: PackageMetaDataType;
6
+ declare const ComposedLinkCreate: import("react").MemoExoticComponent<(props: LinkCreateProps) => jsx.JSX.Element>;
7
+ export default ComposedLinkCreate;
@@ -1,64 +1,3 @@
1
- import { ReactNode } from 'react';
2
- import { Group } from './group-selection/types';
3
- export interface LinkCreatePlugin {
4
- /**
5
- * The Group that this plugin entity belongs to
6
- */
7
- group: Group;
8
- /**
9
- * A label to display for the plugin entity
10
- */
11
- label: string;
12
- /**
13
- * An icon to display for the plugin entity
14
- */
15
- icon: string;
16
- /**
17
- * A unique key for the plugin entity
18
- */
19
- key: string;
20
- /**
21
- * A renderer function to render the form
22
- */
23
- form: ReactNode;
24
- }
25
- export interface LinkCreateProps {
26
- /**
27
- * A `testId` prop is provided for specified elements, which is a unique
28
- * string that appears as a data attribute `data-testid` in the rendered code,
29
- * serving as a hook for automated tests */
30
- testId?: string;
31
- plugins: LinkCreatePlugin[];
32
- /**
33
- * The initial group key for create. If this is provided, it will jump
34
- * directly to the entity selection screen
35
- */
36
- groupKey?: string;
37
- /**
38
- * The initial entity name for create. If this is provided, it will jump
39
- * directly to the entity creation form.
40
- * Note: it will be non-optional for now and can move to optional when we have
41
- * the meta creation flow built.
42
- */
43
- entityKey: string;
44
- /**
45
- * This callback for when the resource has been successfully created.
46
- */
47
- onCreate?: (url: string) => void;
48
- /**
49
- * This callback for any errors
50
- */
51
- onFailure?: (error: unknown) => void;
52
- /**
53
- * This callback for when the form was manually discarded by user
54
- */
55
- onCancel?: () => void;
56
- /**
57
- * This value controls whether the Create Modal should be active or hidden
58
- * Default: false
59
- */
60
- active?: boolean;
61
- }
62
1
  export interface Option {
63
2
  /** html `value` attribute to differentiate options */
64
3
  value: string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/link-create",
3
- "version": "0.3.0",
3
+ "version": "0.3.2",
4
4
  "description": "The driver component of meta creation flow",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -26,6 +26,7 @@
26
26
  ".": "./src/index.ts"
27
27
  },
28
28
  "dependencies": {
29
+ "@atlaskit/analytics-next": "^9.0.0",
29
30
  "@atlaskit/button": "^16.6.0",
30
31
  "@atlaskit/empty-state": "^7.4.0",
31
32
  "@atlaskit/form": "^8.8.4",
@@ -44,6 +45,7 @@
44
45
  "@atlaskit/docs": "*",
45
46
  "@atlaskit/link-picker": "^1.18.0",
46
47
  "@atlaskit/link-provider": "^1.4.0",
48
+ "@atlaskit/link-test-helpers": "^2.2.0",
47
49
  "@atlaskit/popup": "^1.5.0",
48
50
  "@atlaskit/ssr": "*",
49
51
  "@atlaskit/visual-regression": "*",
@@ -53,13 +55,16 @@
53
55
  "@atlassian/link-create-presets": "^2.0.0",
54
56
  "@atlassian/link-picker-plugins": "^18.1.0",
55
57
  "@atlassian/recent-work-client": "^1.7.0",
56
- "@atlassian/search-client": "^0.5.0",
58
+ "@atlassian/search-client": "^0.6.0",
57
59
  "@testing-library/react": "^12.1.5",
58
60
  "@testing-library/user-event": "^14.4.3",
59
61
  "react-dom": "^16.8.0",
60
62
  "typescript": "4.5.5",
61
63
  "wait-for-expect": "^1.2.0"
62
64
  },
65
+ "scripts": {
66
+ "codegen-analytics": "yarn run ts-analytics-codegen --command='yarn workspace @atlaskit/link-create run codegen-analytics'"
67
+ },
63
68
  "techstack": {
64
69
  "@atlassian/frontend": {
65
70
  "code-structure": [
package/report.api.md CHANGED
@@ -45,6 +45,12 @@ type AsyncSelectProps<T = OptionType> = AsyncSelectProps_2<T> & {
45
45
  validators?: Validator[];
46
46
  };
47
47
 
48
+ // @public (undocumented)
49
+ const ComposedLinkCreate: MemoExoticComponent<
50
+ (props: LinkCreateProps) => jsx.JSX.Element
51
+ >;
52
+ export default ComposedLinkCreate;
53
+
48
54
  // @public (undocumented)
49
55
  export const CreateForm: (props: any) => jsx.JSX.Element;
50
56
 
@@ -78,19 +84,17 @@ interface Group {
78
84
  label: string;
79
85
  }
80
86
 
81
- // @public (undocumented)
82
- const LinkCreate: MemoExoticComponent<
83
- (props: LinkCreateProps) => jsx.JSX.Element
84
- >;
85
- export default LinkCreate;
86
-
87
87
  // @public (undocumented)
88
88
  export const LinkCreateCallbackProvider: React_2.FC<LinkCreateCallbackProviderProps>;
89
89
 
90
90
  // @public (undocumented)
91
91
  interface LinkCreateCallbackProviderProps {
92
92
  onCancel?: () => void;
93
- onCreate?: (url: string) => void;
93
+ onCreate?: (result: {
94
+ url: string;
95
+ objectId: string;
96
+ objectType: string;
97
+ }) => void;
94
98
  onFailure?: (error: unknown) => void;
95
99
  }
96
100
 
@@ -114,6 +118,7 @@ export interface LinkCreateProps {
114
118
  // (undocumented)
115
119
  plugins: LinkCreatePlugin[];
116
120
  testId?: string;
121
+ triggeredFrom?: string;
117
122
  }
118
123
 
119
124
  // @public (undocumented)
@@ -26,6 +26,10 @@ type AsyncSelectProps<T = OptionType> = AsyncSelectProps_2<T> & {
26
26
  validators?: Validator[];
27
27
  };
28
28
 
29
+ // @public (undocumented)
30
+ const ComposedLinkCreate: MemoExoticComponent<(props: LinkCreateProps) => jsx.JSX.Element>;
31
+ export default ComposedLinkCreate;
32
+
29
33
  // @public (undocumented)
30
34
  export const CreateForm: (props: any) => jsx.JSX.Element;
31
35
 
@@ -59,17 +63,17 @@ interface Group {
59
63
  label: string;
60
64
  }
61
65
 
62
- // @public (undocumented)
63
- const LinkCreate: MemoExoticComponent<(props: LinkCreateProps) => jsx.JSX.Element>;
64
- export default LinkCreate;
65
-
66
66
  // @public (undocumented)
67
67
  export const LinkCreateCallbackProvider: React_2.FC<LinkCreateCallbackProviderProps>;
68
68
 
69
69
  // @public (undocumented)
70
70
  interface LinkCreateCallbackProviderProps {
71
71
  onCancel?: () => void;
72
- onCreate?: (url: string) => void;
72
+ onCreate?: (result: {
73
+ url: string;
74
+ objectId: string;
75
+ objectType: string;
76
+ }) => void;
73
77
  onFailure?: (error: unknown) => void;
74
78
  }
75
79
 
@@ -93,6 +97,7 @@ export interface LinkCreateProps {
93
97
  // (undocumented)
94
98
  plugins: LinkCreatePlugin[];
95
99
  testId?: string;
100
+ triggeredFrom?: string;
96
101
  }
97
102
 
98
103
  // @public (undocumented)