@atlaskit/link-create 0.2.1 → 0.3.1

package/dist/types/common/constants.d.ts

@@ -0,0 +1,2 @@
+export declare const ANALYTICS_CHANNEL = "media";
+export declare const COMPONENT_NAME = "linkCreate";

package/dist/types/common/types.d.ts

@@ -1,3 +1,4 @@
+import { ReactNode } from 'react';
 /** Map of field names to a list of validators for that field */
 export declare type ValidatorMap = Record<string, Validator[]>;
 export declare type Validator = {
@@ -6,3 +7,82 @@ export declare type Validator = {
     /** 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'. */
     errorMessage: string;
 };
+export interface Group {
+    /**
+     * A label to display for the Group
+     */
+    label: string;
+    /**
+     * An icon to display for the Group
+     */
+    icon: string;
+    /**
+     * A unique key for the Group
+     */
+    key: string;
+}
+export interface LinkCreatePlugin {
+    /**
+     * The Group that this plugin entity belongs to
+     */
+    group: Group;
+    /**
+     * A label to display for the plugin entity
+     */
+    label: string;
+    /**
+     * An icon to display for the plugin entity
+     */
+    icon: string;
+    /**
+     * A unique key for the plugin entity
+     */
+    key: string;
+    /**
+     * A renderer function to render the form
+     */
+    form: ReactNode;
+}
+export interface LinkCreateProps {
+    /**
+     * A `testId` prop is provided for specified elements, which is a unique
+     * string that appears as a data attribute `data-testid` in the rendered code,
+     * serving as a hook for automated tests */
+    testId?: string;
+    plugins: LinkCreatePlugin[];
+    /**
+     * The initial group key for create. If this is provided, it will jump
+     * directly to the entity selection screen
+     */
+    groupKey?: string;
+    /**
+     * The initial entity name for create. If this is provided, it will jump
+     * directly to the entity creation form.
+     * Note: it will be non-optional for now and can move to optional when we have
+     * the meta creation flow built.
+     */
+    entityKey: string;
+    /**
+     * This callback for when the resource has been successfully created.
+     */
+    onCreate?: (url: string) => void;
+    /**
+     * This callback for any errors
+     */
+    onFailure?: (error: unknown) => void;
+    /**
+     * This callback for when the form was manually discarded by user
+     */
+    onCancel?: () => void;
+    /**
+     * This value controls whether the Create Modal should be active or hidden
+     * Default: false
+     */
+    active?: boolean;
+    /**
+     * This value tells where the linkCreate was triggered from. And it's for
+     * analytic purpose only.
+     * Default: unknown
+     */
+    triggeredFrom?: string;
+}

package/dist/types/common/utils/analytics/analytics.codegen.d.ts

@@ -0,0 +1,48 @@
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ *
+ * Generates Typescript types for analytics events from analytics.spec.yaml
+ *
+ * @codegen <<SignedSource::6d7803f5c035dc3cde1be03caa91eb04>>
+ * @codegenCommand yarn workspace @atlaskit/link-create run codegen-analytics
+ */
+export declare type PackageMetaDataType = {
+    packageName: '@atlaskit/link-create';
+    packageVersion: string;
+    source: 'linkCreate';
+    componentName: 'linkCreate';
+};
+export declare type LinkCreateAnalyticsContextType = {
+    triggeredFrom: string;
+    objectName: string;
+    appearance: 'modal' | 'popup';
+};
+export declare type LinkCreateScreenViewedAttributesType = {};
+export declare type ButtonClickedCreateAttributesType = {};
+export declare type ButtonClickedCancelAttributesType = {};
+export declare type LinkCreateScreenClosedAttributesType = {};
+export declare type LinkCreateUnhandledErrorCaughtAttributesType = {
+    browserInfo: string;
+    error: string;
+    componentStack: string | null;
+};
+export declare type ObjectCreatedLinkCreateAttributesType = {
+    objectId: string;
+    objectType: string;
+};
+declare type AnalyticsEventAttributes = {
+    'screen.linkCreateScreen.viewed': LinkCreateScreenViewedAttributesType;
+    'ui.button.clicked.create': ButtonClickedCreateAttributesType;
+    'ui.button.clicked.cancel': ButtonClickedCancelAttributesType;
+    'screen.linkCreateScreen.closed': LinkCreateScreenClosedAttributesType;
+    'operational.linkCreate.unhandledErrorCaught': LinkCreateUnhandledErrorCaughtAttributesType;
+    'track.object.created.linkCreate': ObjectCreatedLinkCreateAttributesType;
+};
+declare function createEventPayload<K extends keyof AnalyticsEventAttributes>(eventKey: K, attributes: AnalyticsEventAttributes[K]): {
+    eventType: string;
+    actionSubject: string;
+    action: string;
+    actionSubjectId: string;
+    attributes: AnalyticsEventAttributes[K];
+};
+export default createEventPayload;

package/dist/types/common/utils/analytics/context.d.ts

@@ -0,0 +1,29 @@
+import React from 'react';
+import { LinkCreateProps } from '../../types';
+import { LinkCreateAnalyticsContextType } from './analytics.codegen';
+export declare type TrackAttribute = <K extends keyof LinkCreateAnalyticsContextType>(attribute: K, value: LinkCreateAnalyticsContextType[K]) => void;
+interface AnalyticsContextType {
+    /**
+     * Update a single attribute in the analytics context
+     */
+    trackAttribute: TrackAttribute;
+    /**
+     * Update a set of attributes in the analytics context
+     */
+    trackAttributes: (attributes: Partial<LinkCreateAnalyticsContextType>) => void;
+    /**
+     * Retrieve the current set of attributes
+     * Can be used by components to derive/compute new attributes for specific events
+     */
+    getAttributes: () => LinkCreateAnalyticsContextType;
+}
+/**
+ * Hook that exposes the context-level attribute getters and setters.
+ */
+export declare const useLinkCreateAnalytics: () => AnalyticsContextType;
+/**
+ * Wraps a component with the analytics context + listener to update events with contextual-level attributes.
+ * Should be implemented once at the root of the link create.
+ */
+export declare function withLinkCreateAnalyticsContext<P extends Pick<LinkCreateProps, 'groupKey' | 'entityKey' | 'triggeredFrom'>>(WrappedComponent: React.ComponentType<P>): React.ComponentType<P>;
+export {};

package/dist/types/common/utils/analytics/index.d.ts

@@ -0,0 +1 @@
+export { useLinkCreateAnalytics, withLinkCreateAnalyticsContext, } from './context';

package/dist/types/controllers/callback-context/main.d.ts

@@ -3,7 +3,11 @@ interface LinkCreateCallbackProviderProps {
     /**
      * This callback for when the resource has been successfully created.
      */
-    onCreate?: (url: string) => void;
+    onCreate?: (result: {
+        url: string;
+        objectId: string;
+        objectType: string;
+    }) => void;
     /**
      * This callback for any errors
      */

package/dist/types/index.d.ts

@@ -1,7 +1,7 @@
-export type { LinkCreatePlugin, Option } from './ui/types';
+export type { Option } from './ui/types';
 export type { CreateFormProps } from './ui/index';
+export type { LinkCreateProps, LinkCreatePlugin } from './common/types';
 export { default, TextField, CreateForm, AsyncSelect } from './ui/index';
 export { useLinkCreateCallback, LinkCreateCallbackProvider, } from './controllers/callback-context';
 export { FormContextProvider, useFormContext, } from './controllers/form-context';
-export type { LinkCreateProps } from './ui/types';
 export type { Validator, ValidatorMap } from './common/types';

package/dist/types/ui/create-form/main.d.ts

@@ -1,8 +1,10 @@
+/** @jsx jsx */
 import { ReactNode } from 'react';
+import { jsx } from '@emotion/react';
 export interface CreateFormProps {
     children: ReactNode;
     testId?: string;
     onCancel?: () => void;
     onSubmit: (data: Record<string, unknown>) => void;
 }
-export declare const CreateForm: (props: any) => JSX.Element;
+export declare const CreateForm: (props: any) => jsx.JSX.Element;

package/dist/types/ui/create-form/styled.d.ts

@@ -0,0 +1 @@
+export declare const formStyles: import("@emotion/react").SerializedStyles;

package/dist/types/ui/error-boundary/error-boundary-base/index.d.ts

@@ -0,0 +1,18 @@
+import React, { Component, ReactNode } from 'react';
+export declare type ErrorBoundaryErrorInfo = {
+    componentStack: string;
+};
+declare type BaseErrorBoundaryState = {
+    hasError: boolean;
+};
+interface BaseErrorBoundaryProps {
+    children: ReactNode;
+    ErrorComponent?: React.ComponentType;
+    onError?: (error: Error, info?: ErrorBoundaryErrorInfo) => void;
+}
+export declare class BaseErrorBoundary extends Component<BaseErrorBoundaryProps, BaseErrorBoundaryState> {
+    constructor(props: BaseErrorBoundaryProps);
+    componentDidCatch(error: Error, info?: ErrorBoundaryErrorInfo): void;
+    render(): React.ReactNode;
+}
+export {};

package/dist/types/ui/error-boundary/error-boundary-ui/error-svg/index.d.ts

@@ -0,0 +1,4 @@
+/** @jsx jsx */
+import { jsx } from '@emotion/react';
+declare const ErrorSVG: () => jsx.JSX.Element;
+export default ErrorSVG;

package/dist/types/ui/error-boundary/error-boundary-ui/error-svg/styled.d.ts

@@ -0,0 +1 @@
+export declare const errorStyles: import("@emotion/react").SerializedStyles;

package/dist/types/ui/error-boundary/error-boundary-ui/index.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+export declare const CONTACT_SUPPORT_LINK = "https://support.atlassian.com/contact/";
+export declare const ErrorBoundaryUI: () => JSX.Element;

package/dist/types/ui/error-boundary/error-boundary-ui/messages.d.ts

@@ -0,0 +1,13 @@
+declare const _default: {
+    heading: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+    description: {
+        id: string;
+        defaultMessage: string;
+        description: string;
+    };
+};
+export default _default;

package/dist/types/ui/error-boundary/index.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const ErrorBoundary: React.FC<{}>;

package/dist/types/ui/group-selection/types.d.ts

@@ -1,17 +1,4 @@
-export interface Group {
-    /**
-     * A label to display for the Group
-     */
-    label: string;
-    /**
-     * An icon to display for the Group
-     */
-    icon: string;
-    /**
-     * A unique key for the Group
-     */
-    key: string;
-}
+import { Group } from '../../common/types';
 export interface GroupSelectProps {
     /**
      * A `testId` prop is provided for specified elements, which is a unique

package/dist/types/ui/main.d.ts

@@ -1,4 +1,7 @@
-/** @jsx jsx */
+/// <reference types="react" />
 import { jsx } from '@emotion/react';
-import { LinkCreateProps } from './types';
-export default function LinkCreate({ plugins, testId, groupKey, entityKey, onCreate, onFailure, onCancel, active, }: LinkCreateProps): jsx.JSX.Element;
+import { LinkCreateProps } from '../common/types';
+import { PackageMetaDataType } from '../common/utils/analytics/analytics.codegen';
+export declare const PACKAGE_DATA: PackageMetaDataType;
+declare const ComposedLinkCreate: import("react").MemoExoticComponent<(props: LinkCreateProps) => jsx.JSX.Element>;
+export default ComposedLinkCreate;

package/dist/types/ui/types.d.ts

@@ -1,64 +1,3 @@
-import { ReactNode } from 'react';
-import { Group } from './group-selection/types';
-export interface LinkCreatePlugin {
-    /**
-     * The Group that this plugin entity belongs to
-     */
-    group: Group;
-    /**
-     * A label to display for the plugin entity
-     */
-    label: string;
-    /**
-     * An icon to display for the plugin entity
-     */
-    icon: string;
-    /**
-     * A unique key for the plugin entity
-     */
-    key: string;
-    /**
-     * A renderer function to render the form
-     */
-    form: ReactNode;
-}
-export interface LinkCreateProps {
-    /**
-     * A `testId` prop is provided for specified elements, which is a unique
-     * string that appears as a data attribute `data-testid` in the rendered code,
-     * serving as a hook for automated tests */
-    testId?: string;
-    plugins: LinkCreatePlugin[];
-    /**
-     * The initial group key for create. If this is provided, it will jump
-     * directly to the entity selection screen
-     */
-    groupKey?: string;
-    /**
-     * The initial entity name for create. If this is provided, it will jump
-     * directly to the entity creation form.
-     * Note: it will be non-optional for now and can move to optional when we have
-     * the meta creation flow built.
-     */
-    entityKey: string;
-    /**
-     * This callback for when the resource has been successfully created.
-     */
-    onCreate?: (url: string) => void;
-    /**
-     * This callback for any errors
-     */
-    onFailure?: (error: unknown) => void;
-    /**
-     * This callback for when the form was manually discarded by user
-     */
-    onCancel?: () => void;
-    /**
-     * This value controls whether the Create Modal should be active or hidden
-     * Default: false
-     */
-    active?: boolean;
-}
 export interface Option {
     /** html `value` attribute to differentiate options */
     value: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/link-create",
-  "version": "0.2.1",
+  "version": "0.3.1",
   "description": "The driver component of meta creation flow",
   "author": "Atlassian Pty Ltd",
   "license": "Apache-2.0",
@@ -26,11 +26,14 @@
     ".": "./src/index.ts"
   },
   "dependencies": {
+    "@atlaskit/analytics-next": "^9.0.0",
     "@atlaskit/button": "^16.6.0",
-    "@atlaskit/form": "^8.9.0",
+    "@atlaskit/empty-state": "^7.4.0",
+    "@atlaskit/form": "^8.8.4",
     "@atlaskit/modal-dialog": "^12.4.4",
     "@atlaskit/select": "^16.1.5",
     "@atlaskit/textfield": "^5.3.5",
+    "@atlaskit/tokens": "^1.2.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/react": "^11.7.1"
   },
@@ -42,22 +45,26 @@
     "@atlaskit/docs": "*",
     "@atlaskit/link-picker": "^1.18.0",
     "@atlaskit/link-provider": "^1.4.0",
+    "@atlaskit/link-test-helpers": "^2.2.0",
     "@atlaskit/popup": "^1.5.0",
     "@atlaskit/ssr": "*",
     "@atlaskit/visual-regression": "*",
     "@atlaskit/webdriver-runner": "*",
     "@atlassian/atlassian-frontend-prettier-config-1.0.0": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.0",
-    "@atlassian/link-create-confluence": "^2.0.0",
-    "@atlassian/link-create-presets": "^1.0.0",
+    "@atlassian/link-create-confluence": "^3.0.0",
+    "@atlassian/link-create-presets": "^2.0.0",
     "@atlassian/link-picker-plugins": "^18.1.0",
     "@atlassian/recent-work-client": "^1.7.0",
-    "@atlassian/search-client": "^0.5.0",
+    "@atlassian/search-client": "^0.6.0",
     "@testing-library/react": "^12.1.5",
     "@testing-library/user-event": "^14.4.3",
     "react-dom": "^16.8.0",
     "typescript": "4.5.5",
     "wait-for-expect": "^1.2.0"
   },
+  "scripts": {
+    "codegen-analytics": "yarn run ts-analytics-codegen --command='yarn workspace @atlaskit/link-create run codegen-analytics'"
+  },
   "techstack": {
     "@atlassian/frontend": {
       "code-structure": [

package/report.api.md

@@ -15,8 +15,11 @@
 <!--SECTION START: Main Entry Types-->
 
 ```ts
+/// <reference types="react" />
+
 import { AsyncSelectProps as AsyncSelectProps_2 } from '@atlaskit/select';
 import { jsx } from '@emotion/react';
+import { MemoExoticComponent } from 'react';
 import { OptionType } from '@atlaskit/select';
 import { default as React_2 } from 'react';
 import { ReactNode } from 'react';
@@ -43,7 +46,13 @@ type AsyncSelectProps<T = OptionType> = AsyncSelectProps_2<T> & {
 };
 
 // @public (undocumented)
-export const CreateForm: (props: any) => JSX.Element;
+const ComposedLinkCreate: MemoExoticComponent<
+  (props: LinkCreateProps) => jsx.JSX.Element
+>;
+export default ComposedLinkCreate;
+
+// @public (undocumented)
+export const CreateForm: (props: any) => jsx.JSX.Element;
 
 // @public (undocumented)
 export interface CreateFormProps {
@@ -75,26 +84,17 @@ interface Group {
   label: string;
 }
 
-// @public (undocumented)
-function LinkCreate({
-  plugins,
-  testId,
-  groupKey,
-  entityKey,
-  onCreate,
-  onFailure,
-  onCancel,
-  active,
-}: LinkCreateProps): jsx.JSX.Element;
-export default LinkCreate;
-
 // @public (undocumented)
 export const LinkCreateCallbackProvider: React_2.FC<LinkCreateCallbackProviderProps>;
 
 // @public (undocumented)
 interface LinkCreateCallbackProviderProps {
   onCancel?: () => void;
-  onCreate?: (url: string) => void;
+  onCreate?: (result: {
+    url: string;
+    objectId: string;
+    objectType: string;
+  }) => void;
   onFailure?: (error: unknown) => void;
 }
 
@@ -118,6 +118,7 @@ export interface LinkCreateProps {
   // (undocumented)
   plugins: LinkCreatePlugin[];
   testId?: string;
+  triggeredFrom?: string;
 }
 
 // @public (undocumented)

package/tmp/api-report-tmp.d.ts

@@ -4,8 +4,11 @@
 
 ```ts
 
+/// <reference types="react" />
+
 import { AsyncSelectProps as AsyncSelectProps_2 } from '@atlaskit/select';
 import { jsx } from '@emotion/react';
+import { MemoExoticComponent } from 'react';
 import { OptionType } from '@atlaskit/select';
 import { default as React_2 } from 'react';
 import { ReactNode } from 'react';
@@ -24,7 +27,11 @@ type AsyncSelectProps<T = OptionType> = AsyncSelectProps_2<T> & {
 };
 
 // @public (undocumented)
-export const CreateForm: (props: any) => JSX.Element;
+const ComposedLinkCreate: MemoExoticComponent<(props: LinkCreateProps) => jsx.JSX.Element>;
+export default ComposedLinkCreate;
+
+// @public (undocumented)
+export const CreateForm: (props: any) => jsx.JSX.Element;
 
 // @public (undocumented)
 export interface CreateFormProps {
@@ -56,17 +63,17 @@ interface Group {
     label: string;
 }
 
-// @public (undocumented)
-function LinkCreate({ plugins, testId, groupKey, entityKey, onCreate, onFailure, onCancel, active, }: LinkCreateProps): jsx.JSX.Element;
-export default LinkCreate;
-
 // @public (undocumented)
 export const LinkCreateCallbackProvider: React_2.FC<LinkCreateCallbackProviderProps>;
 
 // @public (undocumented)
 interface LinkCreateCallbackProviderProps {
     onCancel?: () => void;
-    onCreate?: (url: string) => void;
+    onCreate?: (result: {
+        url: string;
+        objectId: string;
+        objectType: string;
+    }) => void;
     onFailure?: (error: unknown) => void;
 }
 
@@ -90,6 +97,7 @@ export interface LinkCreateProps {
     // (undocumented)
     plugins: LinkCreatePlugin[];
     testId?: string;
+    triggeredFrom?: string;
 }
 
 // @public (undocumented)