@atlaskit/reactions 22.7.0 → 22.7.2

package/docs/0-intro.tsx

@@ -1,11 +1,5 @@
 import React from 'react';
-import {
-  md,
-  Example,
-  Props,
-  code,
-  AtlassianInternalWarning,
-} from '@atlaskit/docs';
+import { md, Example, Props, code, AtlassianInternalWarning } from '@atlaskit/docs';
 import SectionMessage from '@atlaskit/section-message';
 
 import ReactionsExample from '../examples/01-connected-reactions-view';
@@ -117,30 +111,30 @@ export default md`
   };`}
 
   ${(
-    <>
-      <br />
-      <SectionMessage
-        appearance="warning"
-        title="There should be only one instance of EmojiResource in your application"
-      >
-        <p>
-          Make sure EmojiResource is initialised only once to avoid performance
-          issues using useMemo.
-        </p>
-      </SectionMessage>
-      <br />
-      <SectionMessage appearance="information">
-        <p>EmojiResource object implements the EmojiProvider interface.</p>
-        <a
-          href="https://atlaskit.atlassian.com/packages/elements/emoji/docs/emoji-provider"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          See here for information on EmojiProvider.
-        </a>
-      </SectionMessage>
-    </>
-  )}
+		<>
+			<br />
+			<SectionMessage
+				appearance="warning"
+				title="There should be only one instance of EmojiResource in your application"
+			>
+				<p>
+					Make sure EmojiResource is initialised only once to avoid performance issues using
+					useMemo.
+				</p>
+			</SectionMessage>
+			<br />
+			<SectionMessage appearance="information">
+				<p>EmojiResource object implements the EmojiProvider interface.</p>
+				<a
+					href="https://atlaskit.atlassian.com/packages/elements/emoji/docs/emoji-provider"
+					target="_blank"
+					rel="noopener noreferrer"
+				>
+					See here for information on EmojiProvider.
+				</a>
+			</SectionMessage>
+		</>
+	)}
 
   ### Note:
 
@@ -150,25 +144,25 @@ export default md`
   ### Example:
 
   ${(
-    <Example
-      packageName="@atlaskit/reactions"
-      Component={ReactionsExample}
-      title="Picker and Reactions"
-      source={require('!!raw-loader!../examples/01-connected-reactions-view')}
-    />
-  )}
+		<Example
+			packageName="@atlaskit/reactions"
+			Component={ReactionsExample}
+			title="Picker and Reactions"
+			source={require('!!raw-loader!../examples/01-connected-reactions-view')}
+		/>
+	)}
 
   ${(
-    <Props
-      heading="Reactions Props"
-      props={require('!!extract-react-types-loader!../extract-react-type/Reactions')}
-    />
-  )}
+		<Props
+			heading="Reactions Props"
+			props={require('!!extract-react-types-loader!../extract-react-type/Reactions')}
+		/>
+	)}
 
 
   ${(
-    <Props
-      heading="Reaction Props"
-      props={require('!!extract-react-types-loader!../extract-react-type/Reaction')}
-    />
-  )}`;
+		<Props
+			heading="Reaction Props"
+			props={require('!!extract-react-types-loader!../extract-react-type/Reaction')}
+		/>
+	)}`;

package/docs/1-connected-reaction-picker.tsx

@@ -99,35 +99,35 @@ export default md`
   );`}
 
   ${(
-    <>
-      <br />
-      <SectionMessage
-        appearance="warning"
-        title="There should be only one instance of EmojiResource in your application"
-      >
-        <p>
-          Make sure EmojiResource is initialised only once to avoid performance
-          issues using useMemo.
-        </p>
-      </SectionMessage>
-    </>
-  )}
+		<>
+			<br />
+			<SectionMessage
+				appearance="warning"
+				title="There should be only one instance of EmojiResource in your application"
+			>
+				<p>
+					Make sure EmojiResource is initialised only once to avoid performance issues using
+					useMemo.
+				</p>
+			</SectionMessage>
+		</>
+	)}
 
   ### Example:
 
   ${(
-    <Example
-      packageName="@atlaskit/reactions"
-      Component={ConnectedReactionPickerExample}
-      title="Connected Reactions Picker"
-      source={require('!!raw-loader!../examples/00-connected-reaction-picker')}
-    />
-  )}
+		<Example
+			packageName="@atlaskit/reactions"
+			Component={ConnectedReactionPickerExample}
+			title="Connected Reactions Picker"
+			source={require('!!raw-loader!../examples/00-connected-reaction-picker')}
+		/>
+	)}
 
   ${(
-    <Props
-      heading="ConnectedReactionPicker Props"
-      props={require('!!extract-react-types-loader!../extract-react-type/ConnectedReactionPicker')}
-    />
-  )}
+		<Props
+			heading="ConnectedReactionPicker Props"
+			props={require('!!extract-react-types-loader!../extract-react-type/ConnectedReactionPicker')}
+		/>
+	)}
 `;

package/docs/2-connected-reactions-view.tsx

@@ -98,33 +98,33 @@ export default md`
   };`}
 
   ${(
-    <>
-      <br />
-      <SectionMessage
-        appearance="warning"
-        title="There should be only one instance of EmojiResource in your application"
-      >
-        <p>
-          Make sure EmojiResource is initialised only once to avoid performance
-          issues using useMemo.
-        </p>
-      </SectionMessage>
-    </>
-  )}
+		<>
+			<br />
+			<SectionMessage
+				appearance="warning"
+				title="There should be only one instance of EmojiResource in your application"
+			>
+				<p>
+					Make sure EmojiResource is initialised only once to avoid performance issues using
+					useMemo.
+				</p>
+			</SectionMessage>
+		</>
+	)}
 
   ${(
-    <Example
-      packageName="@atlaskit/reactions"
-      Component={ConnectedReactionsViewExample}
-      title="Connected Reactions View"
-      source={require('!!raw-loader!../examples/01-connected-reactions-view')}
-    />
-  )}
+		<Example
+			packageName="@atlaskit/reactions"
+			Component={ConnectedReactionsViewExample}
+			title="Connected Reactions View"
+			source={require('!!raw-loader!../examples/01-connected-reactions-view')}
+		/>
+	)}
 
   ${(
-    <Props
-      heading="ConnectedReactionsView type"
-      props={require('!!extract-react-types-loader!../extract-react-type/ConnectedReactionsView')}
-    />
-  )}
+		<Props
+			heading="ConnectedReactionsView type"
+			props={require('!!extract-react-types-loader!../extract-react-type/ConnectedReactionsView')}
+		/>
+	)}
 `;

package/docs/3-reactions-store.tsx

@@ -8,26 +8,25 @@ export default md`
   It serves as one of the key props passed to the connected HoC used in Reactions: (\`ConnectedReactionPicker\` and \`ConnectedReactions\`).
 
   ${(
-    <>
-      <br />
-      <SectionMessage appearance="information" title="">
-        You can instantiate an instance of the ReactionsStore object using the
-        built in <strong>MemoryReactionsStore</strong> class object that
-        contains all logic required to communicate with the store. It provides
-        all the methods to interact with the store and the API calls to the
-        server, including logging
-        <a
-          target="_blank"
-          rel="noopener noreferrer"
-          href="https://developer.atlassian.com/platform/ufo/"
-        >
-          UFO
-        </a>
-        .
-        <br />
-      </SectionMessage>
-    </>
-  )}
+		<>
+			<br />
+			<SectionMessage appearance="information" title="">
+				You can instantiate an instance of the ReactionsStore object using the built in{' '}
+				<strong>MemoryReactionsStore</strong> class object that contains all logic required to
+				communicate with the store. It provides all the methods to interact with the store and the
+				API calls to the server, including logging
+				<a
+					target="_blank"
+					rel="noopener noreferrer"
+					href="https://developer.atlassian.com/platform/ufo/"
+				>
+					UFO
+				</a>
+				.
+				<br />
+			</SectionMessage>
+		</>
+	)}
 
   ## Usage
 
@@ -56,16 +55,16 @@ export default md`
 `}
 
   ${(
-    <Props
-      heading="Store Type"
-      props={require('!!extract-react-types-loader!../extract-react-type/reactionsStore')}
-    />
-  )}
+		<Props
+			heading="Store Type"
+			props={require('!!extract-react-types-loader!../extract-react-type/reactionsStore')}
+		/>
+	)}
 
   ${(
-    <Props
-      heading="Actions type"
-      props={require('!!extract-react-types-loader!../extract-react-type/actions')}
-    />
-  )}
+		<Props
+			heading="Actions type"
+			props={require('!!extract-react-types-loader!../extract-react-type/actions')}
+		/>
+	)}
 `;

package/docs/4-reaction-service-client.tsx

@@ -34,9 +34,9 @@ export default md`
 `}
 
   ${(
-    <Props
-      heading="ReactionClient type"
-      props={require('!!extract-react-types-loader!../extract-react-type/reactionClient')}
-    />
-  )}
+		<Props
+			heading="ReactionClient type"
+			props={require('!!extract-react-types-loader!../extract-react-type/reactionClient')}
+		/>
+	)}
 `;

package/docs/5-graphql-support.tsx

@@ -120,34 +120,32 @@ export default md`
   };`}
 
 ${(
-  <>
-    <br />
-    <SectionMessage
-      appearance="information"
-      title="There should be only one instance of EmojiResource in your application"
-    >
-      <p>
-        Above examples show the best practice to integrate Graphql APIs. By
-        extending from our `ReactionsClient` interface, you are free to use any
-        GrapqhQL client, any queries or mutations, as long as they return the
-        same type as defined in the interface.
-      </p>
-    </SectionMessage>
-    <br />
-    <SectionMessage appearance="warning">
-      Use base UI Components `Reactions` from `@atlaskit/reactions` directly
-      with your own implementation around to support GraphQL or custom behavior
-      is at your own risk. Without using ReactionsStore, we can't track the
-      operations of reactions, please add your own tracking to measure. The
-      custom implementation will lead to limited support from us.
-    </SectionMessage>
-  </>
+	<>
+		<br />
+		<SectionMessage
+			appearance="information"
+			title="There should be only one instance of EmojiResource in your application"
+		>
+			<p>
+				Above examples show the best practice to integrate Graphql APIs. By extending from our
+				`ReactionsClient` interface, you are free to use any GrapqhQL client, any queries or
+				mutations, as long as they return the same type as defined in the interface.
+			</p>
+		</SectionMessage>
+		<br />
+		<SectionMessage appearance="warning">
+			Use base UI Components `Reactions` from `@atlaskit/reactions` directly with your own
+			implementation around to support GraphQL or custom behavior is at your own risk. Without using
+			ReactionsStore, we can't track the operations of reactions, please add your own tracking to
+			measure. The custom implementation will lead to limited support from us.
+		</SectionMessage>
+	</>
 )}
 
 ${(
-  <Props
-    heading="ReactionClient type"
-    props={require('!!extract-react-types-loader!../extract-react-type/reactionClient')}
-  />
+	<Props
+		heading="ReactionClient type"
+		props={require('!!extract-react-types-loader!../extract-react-type/reactionClient')}
+	/>
 )}
 `;

package/local-config-example.ts

@@ -1,6 +1,6 @@
 // Copy this file to local-config.ts and customise.
 export default {
-  baseUrl: 'http://www.example.org',
-  // optional, generate token from asap, check pf-emoji-service README.md
-  authHeader: 'Bearer token',
+	baseUrl: 'http://www.example.org',
+	// optional, generate token from asap, check pf-emoji-service README.md
+	authHeader: 'Bearer token',
 };

package/package.json

@@ -1,111 +1,110 @@
 {
-  "name": "@atlaskit/reactions",
-  "version": "22.7.0",
-  "description": "Reactions component",
-  "publishConfig": {
-    "registry": "https://registry.npmjs.org/"
-  },
-  "repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
-  "author": "Atlassian Pty Ltd",
-  "license": "Apache-2.0",
-  "main": "dist/cjs/index.js",
-  "module": "dist/esm/index.js",
-  "module:es2019": "dist/es2019/index.js",
-  "types": "dist/types/index.d.ts",
-  "typesVersions": {
-    ">=4.5 <4.9": {
-      "*": [
-        "dist/types-ts4.5/*",
-        "dist/types-ts4.5/index.d.ts"
-      ]
-    }
-  },
-  "atlaskit:src": "src/index.ts",
-  "atlassian": {
-    "team": "Editor: Collaboration",
-    "releaseModel": "continuous",
-    "website": {
-      "name": "Reactions"
-    },
-    "runReact18": true
-  },
-  "config": {
-    "access": "public"
-  },
-  "dependencies": {
-    "@atlaskit/analytics-gas-types": "^5.1.0",
-    "@atlaskit/analytics-namespaced-context": "^6.9.0",
-    "@atlaskit/analytics-next": "^9.3.0",
-    "@atlaskit/avatar": "^21.6.0",
-    "@atlaskit/button": "^17.14.0",
-    "@atlaskit/emoji": "^67.6.0",
-    "@atlaskit/icon": "^22.1.0",
-    "@atlaskit/modal-dialog": "^12.13.0",
-    "@atlaskit/motion": "^1.5.0",
-    "@atlaskit/popper": "^5.5.0",
-    "@atlaskit/spinner": "^16.1.0",
-    "@atlaskit/tabs": "^16.1.0",
-    "@atlaskit/theme": "^12.7.0",
-    "@atlaskit/tokens": "^1.45.0",
-    "@atlaskit/tooltip": "^18.3.0",
-    "@atlaskit/ufo": "^0.2.0",
-    "@atlaskit/util-service-support": "^6.2.0",
-    "@babel/runtime": "^7.0.0",
-    "@emotion/react": "^11.7.1",
-    "focus-trap": "^2.4.5"
-  },
-  "peerDependencies": {
-    "react": "^16.8.0",
-    "react-dom": "^16.8.0",
-    "react-intl-next": "npm:react-intl@^5.18.1"
-  },
-  "devDependencies": {
-    "@atlaskit/elements-test-helpers": "^0.7.0",
-    "@atlaskit/util-data-test": "^17.9.0",
-    "@atlassian/atlassian-frontend-prettier-config-1.0.1": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.1",
-    "@emotion/jest": "^11.8.0",
-    "@testing-library/dom": "^8.17.1",
-    "@testing-library/jest-dom": "^5.16.5",
-    "@testing-library/react": "^12.1.5",
-    "@testing-library/react-hooks": "^8.0.1",
-    "@testing-library/user-event": "^14.4.3",
-    "dotenv": "^8.2.0",
-    "es6-promise": "^4.0.5",
-    "fetch-mock": "^8.0.0",
-    "raf-stub": "^2.0.1",
-    "react": "^16.8.0",
-    "react-intl-next": "npm:react-intl@^5.18.1",
-    "typescript": "~5.4.2",
-    "wait-for-expect": "^1.2.0",
-    "webpack-dev-server": "^4.11.1"
-  },
-  "keywords": [
-    "fabric",
-    "ui"
-  ],
-  "af:exports": {
-    ".": "./src/index.ts",
-    "./MockReactionsClient": "./src/MockReactionsClient.ts"
-  },
-  "prettier": "@atlassian/atlassian-frontend-prettier-config-1.0.1",
-  "techstack": {
-    "@repo/internal": {
-      "design-tokens": [
-        "color"
-      ]
-    },
-    "@atlassian/frontend": {
-      "tree-shaking": []
-    }
-  },
-  "scripts": {
-    "setup-first-time": "yarn run setup-local-config; yarn run setup-env",
-    "setup-local-config": "cp -nv local-config-template.ts local-config.ts",
-    "setup-env": "cp -nv .env-template .env",
-    "start": "cd ../../ && yarn start reactions",
-    "test": "cd ../../ && yarn test reactions",
-    "typecheck": "cd ../../ && yarn typecheck:package ./packages/elements/reactions",
-    "start:dev": "cd ../../ && yarn start reactions --proxy ./packages/elements/reactions/proxy.ts",
-    "start:edge": "cd ../../ && PROXY_TARGET_ENV=edge yarn start reactions --proxy ./packages/elements/reactions/proxy.ts"
-  }
-}
+	"name": "@atlaskit/reactions",
+	"version": "22.7.2",
+	"description": "Reactions component",
+	"publishConfig": {
+		"registry": "https://registry.npmjs.org/"
+	},
+	"repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
+	"author": "Atlassian Pty Ltd",
+	"license": "Apache-2.0",
+	"main": "dist/cjs/index.js",
+	"module": "dist/esm/index.js",
+	"module:es2019": "dist/es2019/index.js",
+	"types": "dist/types/index.d.ts",
+	"typesVersions": {
+		">=4.5 <4.9": {
+			"*": [
+				"dist/types-ts4.5/*",
+				"dist/types-ts4.5/index.d.ts"
+			]
+		}
+	},
+	"atlaskit:src": "src/index.ts",
+	"atlassian": {
+		"team": "Editor: Collaboration",
+		"releaseModel": "continuous",
+		"website": {
+			"name": "Reactions"
+		},
+		"runReact18": true
+	},
+	"config": {
+		"access": "public"
+	},
+	"dependencies": {
+		"@atlaskit/analytics-gas-types": "^5.1.0",
+		"@atlaskit/analytics-namespaced-context": "^6.10.0",
+		"@atlaskit/analytics-next": "^9.3.0",
+		"@atlaskit/avatar": "^21.10.0",
+		"@atlaskit/button": "^17.22.0",
+		"@atlaskit/emoji": "^67.6.0",
+		"@atlaskit/icon": "^22.4.0",
+		"@atlaskit/modal-dialog": "^12.14.0",
+		"@atlaskit/motion": "^1.7.0",
+		"@atlaskit/popper": "^6.1.0",
+		"@atlaskit/primitives": "^8.0.0",
+		"@atlaskit/spinner": "^16.2.0",
+		"@atlaskit/tabs": "^16.2.0",
+		"@atlaskit/theme": "^12.10.0",
+		"@atlaskit/tokens": "^1.51.0",
+		"@atlaskit/tooltip": "^18.5.0",
+		"@atlaskit/ufo": "^0.2.0",
+		"@atlaskit/util-service-support": "^6.2.0",
+		"@babel/runtime": "^7.0.0",
+		"@emotion/react": "^11.7.1",
+		"focus-trap": "^2.4.5"
+	},
+	"peerDependencies": {
+		"react": "^16.8.0",
+		"react-dom": "^16.8.0",
+		"react-intl-next": "npm:react-intl@^5.18.1"
+	},
+	"devDependencies": {
+		"@atlaskit/elements-test-helpers": "^0.7.0",
+		"@atlaskit/util-data-test": "^17.9.0",
+		"@emotion/jest": "^11.8.0",
+		"@testing-library/dom": "^8.17.1",
+		"@testing-library/jest-dom": "^6.4.5",
+		"@testing-library/react": "^12.1.5",
+		"@testing-library/react-hooks": "^8.0.1",
+		"@testing-library/user-event": "^14.4.3",
+		"dotenv": "^8.2.0",
+		"es6-promise": "^4.0.5",
+		"fetch-mock": "^8.0.0",
+		"raf-stub": "^2.0.1",
+		"react": "^16.8.0",
+		"react-intl-next": "npm:react-intl@^5.18.1",
+		"typescript": "~5.4.2",
+		"wait-for-expect": "^1.2.0",
+		"webpack-dev-server": "^4.11.1"
+	},
+	"keywords": [
+		"fabric",
+		"ui"
+	],
+	"af:exports": {
+		".": "./src/index.ts",
+		"./MockReactionsClient": "./src/MockReactionsClient.ts"
+	},
+	"techstack": {
+		"@repo/internal": {
+			"design-tokens": [
+				"color"
+			]
+		},
+		"@atlassian/frontend": {
+			"tree-shaking": []
+		}
+	},
+	"scripts": {
+		"setup-first-time": "yarn run setup-local-config; yarn run setup-env",
+		"setup-local-config": "cp -nv local-config-template.ts local-config.ts",
+		"setup-env": "cp -nv .env-template .env",
+		"start": "cd ../../ && yarn start reactions",
+		"test": "cd ../../ && yarn test reactions",
+		"typecheck": "cd ../../ && yarn typecheck:package ./packages/elements/reactions",
+		"start:dev": "cd ../../ && yarn start reactions --proxy ./packages/elements/reactions/proxy.ts",
+		"start:edge": "cd ../../ && PROXY_TARGET_ENV=edge yarn start reactions --proxy ./packages/elements/reactions/proxy.ts"
+	}
+}