@atlaskit/smart-card 17.7.4 → 17.7.7

package/CHANGELOG.md

@@ -1,5 +1,49 @@
 # @atlaskit/smart-card
 
+## 17.7.7
+
+### Patch Changes
+
+- [`c01f6404d0c`](https://bitbucket.org/atlassian/atlassian-frontend/commits/c01f6404d0c) - Add ability to trigger actions for a Smart Link from outside of the Smart Link card.
+
+  Example usage:
+
+  ```tsx
+  import { useSmartLinkActions } from '@atlaskit/smart-card/hooks';
+
+  const ExampleToolbar = () => {
+    const actions = useSmartLinkActions({
+      url,
+      appearance: 'block',
+      analyticsHandler: analytics,
+    });
+
+    return (
+      <ExampleToolbarWrapper>
+        {actions.map((action) => (
+          <Tooltip content={action.text}>
+            <ExampleToolbarItem key={action.id} onClick={action.invoke}>
+              {idToIcon[action.id] ?? action.id}
+            </ExampleToolbarItem>
+          </Tooltip>
+        ))}
+      </ExampleToolbarWrapper>
+    );
+  };
+  ```
+
+## 17.7.6
+
+### Patch Changes
+
+- [`0e5c8b501d6`](https://bitbucket.org/atlassian/atlassian-frontend/commits/0e5c8b501d6) - add test for when hover preview prop is not provided to inline card
+
+## 17.7.5
+
+### Patch Changes
+
+- [`b89ef291fb9`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b89ef291fb9) - EDM-2902: Move common component out of BlockCard
+
 ## 17.7.4
 
 ### Patch Changes

package/dist/cjs/classNames.js

@@ -84,7 +84,7 @@ Object.defineProperty(exports, "metadataListClassName", {
 
 var _ContentFooter = require("./view/BlockCard/components/ContentFooter");
 
-var _MetadataList = require("./view/BlockCard/components/MetadataList");
+var _MetadataList = require("./view/common/MetadataList");
 
 var _ResolvingView = require("./view/BlockCard/views/ResolvingView");
 
@@ -92,7 +92,7 @@ var _ResolvedView = require("./view/BlockCard/views/ResolvedView");
 
 var _ForbiddenView = require("./view/BlockCard/views/ForbiddenView");
 
-var _Icon = require("./view/BlockCard/components/Icon");
+var _Icon = require("./view/common/Icon");
 
 var _Content = require("./view/BlockCard/components/Content");
 

package/dist/cjs/hooks.js

@@ -0,0 +1,13 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "useSmartLinkActions", {
+  enumerable: true,
+  get: function get() {
+    return _useSmartLinkActions.useSmartLinkActions;
+  }
+});
+
+var _useSmartLinkActions = require("./state/hooks-external/useSmartLinkActions");

package/dist/cjs/state/hooks-external/useSmartLinkActions.js

@@ -0,0 +1,71 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useSmartLinkActions = useSmartLinkActions;
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _react = require("react");
+
+var _uuid = _interopRequireDefault(require("uuid"));
+
+var _block = require("../../extractors/block");
+
+var _actions = require("../actions");
+
+var _analytics = require("../analytics");
+
+var _store = require("../store");
+
+var _helpers = require("../helpers");
+
+function useSmartLinkActions(_ref) {
+  var url = _ref.url,
+      appearance = _ref.appearance,
+      analyticsHandler = _ref.analyticsHandler,
+      _ref$platform = _ref.platform,
+      platform = _ref$platform === void 0 ? 'web' : _ref$platform;
+  var id = (0, _react.useMemo)(function () {
+    return (0, _uuid.default)();
+  }, []);
+
+  var _useState = (0, _react.useState)([]),
+      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+      actions = _useState2[0],
+      setActions = _useState2[1];
+
+  var linkState = (0, _store.useSmartCardState)(url);
+  var linkAnalytics = (0, _analytics.useSmartLinkAnalytics)(analyticsHandler);
+  var linkActions = (0, _actions.useSmartCardActions)(id, url, linkAnalytics);
+  (0, _react.useEffect)(function () {
+    if (!linkState.details) {
+      return;
+    }
+
+    var cardProperties = (0, _block.extractBlockProps)(linkState.details.data, linkState.details.meta, {
+      handleInvoke: function handleInvoke(opts) {
+        return linkActions.invoke(opts, appearance);
+      },
+      handleAnalytics: analyticsHandler,
+      extensionKey: (0, _helpers.getExtensionKey)(linkState.details)
+    }, undefined, platform);
+
+    if (!cardProperties.actions || cardProperties.actions.length === 0) {
+      return;
+    }
+
+    var cardActions = cardProperties.actions.map(function (action) {
+      return {
+        id: action.id,
+        text: action.text,
+        invoke: action.promise
+      };
+    });
+    setActions(cardActions);
+  }, [linkState, linkActions, analyticsHandler, appearance, platform]);
+  return actions;
+}

package/dist/cjs/utils/mocks.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.waitFor = exports.mocks = exports.fakeResponse = exports.fakeFactory = void 0;
+exports.waitFor = exports.mocks = exports.mockContext = exports.fakeResponse = exports.fakeFactory = void 0;
 
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
 
@@ -27,6 +27,12 @@ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflec
 
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 
+var mockContext = {
+  '@vocab': 'https://www.w3.org/ns/activitystreams#',
+  atlassian: 'https://schema.atlassian.com/ns/vocabulary#',
+  schema: 'http://schema.org/'
+};
+exports.mockContext = mockContext;
 var mocks = {
   success: {
     meta: {

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/smart-card",
-	"version": "17.7.4",
+	"version": "17.7.7",
 	"sideEffects": false
 }

package/dist/cjs/view/BlockCard/actions/PreviewAction.js

@@ -81,7 +81,7 @@ function _previewFunction() {
 
             _context.next = 5;
             return Promise.resolve().then(function () {
-              return _interopRequireWildcard(require('../components/Modal'));
+              return _interopRequireWildcard(require('../../common/Modal'));
             });
 
           case 5:

package/dist/cjs/view/BlockCard/components/ActionList.js

@@ -25,7 +25,7 @@ var _more = _interopRequireDefault(require("@atlaskit/icon/glyph/more"));
 
 var _Action = require("./Action");
 
-var _utils = require("../utils");
+var _utils = require("../../common/utils");
 
 var _excluded = ["triggerRef"];
 

package/dist/cjs/view/BlockCard/components/CollaboratorList.js

@@ -11,7 +11,7 @@ var _core = require("@emotion/core");
 
 var _avatarGroup = _interopRequireDefault(require("@atlaskit/avatar-group"));
 
-var _utils = require("../utils");
+var _utils = require("../../common/utils");
 
 /** @jsx jsx */
 var CollaboratorList = function CollaboratorList(_ref) {

package/dist/cjs/view/BlockCard/components/Content.js

@@ -7,7 +7,7 @@ exports.blockCardContentClassName = exports.Content = void 0;
 
 var _core = require("@emotion/core");
 
-var _utils = require("../utils");
+var _utils = require("../../common/utils");
 
 /** @jsx jsx */
 var blockCardContentClassName = 'block-card-content';

package/dist/cjs/view/BlockCard/components/ContentFooter.js

@@ -7,7 +7,7 @@ exports.contentFooterClassName = exports.ContentFooter = void 0;
 
 var _core = require("@emotion/core");
 
-var _utils = require("../utils");
+var _utils = require("../../common/utils");
 
 /** @jsx jsx */
 var contentFooterClassName = 'smart-link-content-footer';

package/dist/cjs/view/BlockCard/components/Emoji.js

@@ -11,7 +11,7 @@ var _core = require("@emotion/core");
 
 var _react = _interopRequireDefault(require("react"));
 
-var _utils = require("../utils");
+var _utils = require("../../common/utils");
 
 /** @jsx jsx */
 var Emoji = function Emoji(_ref) {

package/dist/cjs/view/BlockCard/components/Frame.js

@@ -15,7 +15,7 @@ var _react = _interopRequireDefault(require("react"));
 
 var _colors = require("@atlaskit/theme/colors");
 
-var _utils = require("../utils");
+var _utils = require("../../common/utils");
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 

package/dist/cjs/view/BlockCard/components/Name.js

@@ -9,7 +9,7 @@ var _core = require("@emotion/core");
 
 var _constants = require("@atlaskit/theme/constants");
 
-var _utils = require("../utils");
+var _utils = require("../../common/utils");
 
 /** @jsx jsx */
 var blockCardContentHeaderNameClassName = 'block-card-content-header-name';

package/dist/cjs/view/BlockCard/components/Provider.js

@@ -9,7 +9,7 @@ var _core = require("@emotion/core");
 
 var _colors = require("@atlaskit/theme/colors");
 
-var _utils = require("../utils");
+var _utils = require("../../common/utils");
 
 /** @jsx jsx */
 var Provider = function Provider(_ref) {

package/dist/cjs/view/BlockCard/components/Thumbnail.js

@@ -11,7 +11,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 
 var _core = require("@emotion/core");
 
-var _utils = require("../utils");
+var _utils = require("../../common/utils");
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 

package/dist/cjs/view/BlockCard/views/ErroredView.js

@@ -21,7 +21,7 @@ var _warning = _interopRequireDefault(require("@atlaskit/icon/glyph/warning"));
 
 var _Frame = require("../components/Frame");
 
-var _Byline = require("../components/Byline");
+var _Byline = require("../../common/Byline");
 
 var _ActionList = require("../components/ActionList");
 

package/dist/cjs/view/BlockCard/views/ForbiddenView.js

@@ -23,7 +23,7 @@ var _Frame = require("../components/Frame");
 
 var _Provider = require("../components/Provider");
 
-var _Byline = require("../components/Byline");
+var _Byline = require("../../common/Byline");
 
 var _ActionList = require("../components/ActionList");
 

package/dist/cjs/view/BlockCard/views/NotFoundView.js

@@ -23,7 +23,7 @@ var _Frame = require("../components/Frame");
 
 var _Provider = require("../components/Provider");
 
-var _Byline = require("../components/Byline");
+var _Byline = require("../../common/Byline");
 
 var _Content = require("../components/Content");
 

package/dist/cjs/view/BlockCard/views/ResolvedView.js

@@ -19,7 +19,7 @@ var _Provider = require("../components/Provider");
 
 var _Name = require("../components/Name");
 
-var _Byline = require("../components/Byline");
+var _Byline = require("../../common/Byline");
 
 var _ActionList = require("../components/ActionList");
 
@@ -27,11 +27,11 @@ var _CollaboratorList = require("../components/CollaboratorList");
 
 var _Emoji = require("../components/Emoji");
 
-var _Icon = require("../components/Icon");
+var _Icon = require("../../common/Icon");
 
 var _Content = require("../components/Content");
 
-var _MetadataList = require("../components/MetadataList");
+var _MetadataList = require("../../common/MetadataList");
 
 var _styled = require("../../InlineCard/IconAndTitleLayout/styled");
 
@@ -39,7 +39,7 @@ var _ContentHeader = require("../components/ContentHeader");
 
 var _ContentFooter = require("../components/ContentFooter");
 
-var _utils = require("../utils");
+var _utils = require("../../common/utils");
 
 var _handlers = require("../utils/handlers");
 

package/dist/cjs/view/BlockCard/views/ResolvingView.js

@@ -17,7 +17,7 @@ var _constants = require("@atlaskit/theme/constants");
 
 var _Frame = require("../components/Frame");
 
-var _utils = require("../utils");
+var _utils = require("../../common/utils");
 
 var _reactIntlNext = require("react-intl-next");
 

package/dist/cjs/view/BlockCard/views/UnauthorizedView.js

@@ -19,7 +19,7 @@ var _Frame = require("../components/Frame");
 
 var _Provider = require("../components/Provider");
 
-var _Byline = require("../components/Byline");
+var _Byline = require("../../common/Byline");
 
 var _ActionList = require("../components/ActionList");
 

package/dist/cjs/view/EmbedCard/components/styled.js

@@ -19,7 +19,7 @@ var _constants = require("@atlaskit/theme/constants");
 
 var colors = _interopRequireWildcard(require("@atlaskit/theme/colors"));
 
-var _utils = require("../../BlockCard/utils");
+var _utils = require("../../common/utils");
 
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16;
 

package/dist/cjs/view/EmbedCard/views/ErroredView.js

@@ -23,7 +23,7 @@ var _reactIntlNext = require("react-intl-next");
 
 var _messages = require("@atlaskit/media-ui/messages");
 
-var _utils = require("../../BlockCard/utils");
+var _utils = require("../../common/utils");
 
 /** @jsx jsx */
 var EmbedCardErroredView = function EmbedCardErroredView(_ref) {

package/dist/cjs/view/EmbedCard/views/UnresolvedView.js

@@ -19,7 +19,7 @@ var _reactIntlNext = require("react-intl-next");
 
 var _messages = require("@atlaskit/media-ui/messages");
 
-var _utils = require("../../BlockCard/utils");
+var _utils = require("../../common/utils");
 
 /** @jsx jsx */
 var EmbedCardUnresolvedView = function EmbedCardUnresolvedView(_ref) {

package/dist/cjs/view/{BlockCard/components → common}/Byline.js

@@ -9,7 +9,7 @@ var _core = require("@emotion/core");
 
 var _colors = require("@atlaskit/theme/colors");
 
-var _utils = require("../utils");
+var _utils = require("./utils");
 
 /** @jsx jsx */
 var Byline = function Byline(_ref) {

package/dist/cjs/view/{BlockCard/components → common}/Icon.js

@@ -15,7 +15,7 @@ var _reactRenderImage = _interopRequireDefault(require("react-render-image"));
 
 var _link = _interopRequireDefault(require("@atlaskit/icon/glyph/link"));
 
-var _utils = require("../utils");
+var _utils = require("./utils");
 
 /** @jsx jsx */
 var blockCardIconImageClassName = 'block-card-icon-image';

package/dist/cjs/view/{BlockCard/components → common}/Metadata.js

@@ -11,7 +11,7 @@ var _core = require("@emotion/core");
 
 var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
 
-var _utils = require("../utils");
+var _utils = require("./utils");
 
 var _colors = require("@atlaskit/theme/colors");
 

package/dist/cjs/view/{BlockCard/components → common}/MetadataList.js

@@ -13,7 +13,7 @@ var _core = require("@emotion/core");
 
 var _Metadata = require("./Metadata");
 
-var _utils = require("../utils");
+var _utils = require("./utils");
 
 /** @jsx jsx */
 var metadataListClassName = 'smart-link-metadata-list';

package/dist/cjs/view/{BlockCard/components → common}/Modal.js

@@ -27,7 +27,7 @@ var _modalDialog = _interopRequireWildcard(require("@atlaskit/modal-dialog"));
 
 var _ModalHeader = require("./ModalHeader");
 
-var _utils = require("../../../utils");
+var _utils = require("../../utils");
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 

package/dist/cjs/view/{BlockCard/components → common}/ModalHeader.js

@@ -23,7 +23,7 @@ var _colors = require("@atlaskit/theme/colors");
 
 var _reactIntlNext = require("react-intl-next");
 
-var _utils = require("../utils");
+var _utils = require("./utils");
 
 var _Icon = require("./Icon");
 

package/dist/es2019/classNames.js

@@ -1,9 +1,9 @@
 export { contentFooterClassName } from './view/BlockCard/components/ContentFooter';
-export { metadataListClassName } from './view/BlockCard/components/MetadataList';
+export { metadataListClassName } from './view/common/MetadataList';
 export { blockCardResolvingViewClassName } from './view/BlockCard/views/ResolvingView';
 export { blockCardResolvedViewClassName, blockCardResolvedViewByClassName } from './view/BlockCard/views/ResolvedView';
 export { blockCardForbiddenViewClassName, blockCardForbiddenViewLinkClassName } from './view/BlockCard/views/ForbiddenView';
-export { blockCardIconImageClassName } from './view/BlockCard/components/Icon';
+export { blockCardIconImageClassName } from './view/common/Icon';
 export { blockCardContentClassName } from './view/BlockCard/components/Content';
 export { blockCardContentHeaderClassName } from './view/BlockCard/components/ContentHeader';
 export { blockCardContentHeaderNameClassName } from './view/BlockCard/components/Name';

package/dist/es2019/hooks.js

@@ -0,0 +1 @@
+export { useSmartLinkActions } from './state/hooks-external/useSmartLinkActions';

package/dist/es2019/state/hooks-external/useSmartLinkActions.js

@@ -0,0 +1,42 @@
+import { useEffect, useMemo, useState } from 'react';
+import uuid from 'uuid';
+import { extractBlockProps as extractCardProps } from '../../extractors/block';
+import { useSmartCardActions as useLinkActions } from '../actions';
+import { useSmartLinkAnalytics as useLinkAnalytics } from '../analytics';
+import { useSmartCardState as useLinkState } from '../store';
+import { getExtensionKey } from '../helpers';
+export function useSmartLinkActions({
+  url,
+  appearance,
+  analyticsHandler,
+  platform = 'web'
+}) {
+  const id = useMemo(() => uuid(), []);
+  const [actions, setActions] = useState([]);
+  const linkState = useLinkState(url);
+  const linkAnalytics = useLinkAnalytics(analyticsHandler);
+  const linkActions = useLinkActions(id, url, linkAnalytics);
+  useEffect(() => {
+    if (!linkState.details) {
+      return;
+    }
+
+    const cardProperties = extractCardProps(linkState.details.data, linkState.details.meta, {
+      handleInvoke: opts => linkActions.invoke(opts, appearance),
+      handleAnalytics: analyticsHandler,
+      extensionKey: getExtensionKey(linkState.details)
+    }, undefined, platform);
+
+    if (!cardProperties.actions || cardProperties.actions.length === 0) {
+      return;
+    }
+
+    const cardActions = cardProperties.actions.map(action => ({
+      id: action.id,
+      text: action.text,
+      invoke: action.promise
+    }));
+    setActions(cardActions);
+  }, [linkState, linkActions, analyticsHandler, appearance, platform]);
+  return actions;
+}

package/dist/es2019/utils/mocks.js

@@ -1,4 +1,9 @@
 import CardClient from '../client';
+export const mockContext = {
+  '@vocab': 'https://www.w3.org/ns/activitystreams#',
+  atlassian: 'https://schema.atlassian.com/ns/vocabulary#',
+  schema: 'http://schema.org/'
+};
 export const mocks = {
   success: {
     meta: {

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/smart-card",
-	"version": "17.7.4",
+	"version": "17.7.7",
 	"sideEffects": false
 }

package/dist/es2019/view/BlockCard/actions/PreviewAction.js

@@ -32,7 +32,7 @@ export async function previewFunction({
     document.body.appendChild(popupMountPoint);
   }
 
-  let Modal = await import('../components/Modal');
+  let Modal = await import('../../common/Modal');
   ReactDOM.render( /*#__PURE__*/React.createElement(IntlProvider, {
     locale: "en"
   }, /*#__PURE__*/React.createElement(Modal.default, _extends({}, rest, {

package/dist/es2019/view/BlockCard/components/ActionList.js

@@ -7,7 +7,7 @@ import Button from '@atlaskit/button/standard-button';
 import DropdownMenu, { DropdownItem, DropdownItemGroup } from '@atlaskit/dropdown-menu';
 import MoreIcon from '@atlaskit/icon/glyph/more';
 import { Action } from './Action';
-import { gs, mq } from '../utils';
+import { gs, mq } from '../../common/utils';
 export const ActionList = ({
   items
 }) => {

package/dist/es2019/view/BlockCard/components/CollaboratorList.js

@@ -1,7 +1,7 @@
 /** @jsx jsx */
 import { jsx } from '@emotion/core';
 import AvatarGroup from '@atlaskit/avatar-group';
-import { mq } from '../utils';
+import { mq } from '../../common/utils';
 export const CollaboratorList = ({
   items,
   handleAvatarClick = () => {},

package/dist/es2019/view/BlockCard/components/Content.js

@@ -1,6 +1,6 @@
 /** @jsx jsx */
 import { jsx } from '@emotion/core';
-import { gs, mq } from '../utils';
+import { gs, mq } from '../../common/utils';
 export const blockCardContentClassName = 'block-card-content';
 export const Content = ({
   children,

package/dist/es2019/view/BlockCard/components/ContentFooter.js

@@ -1,6 +1,6 @@
 /** @jsx jsx */
 import { jsx } from '@emotion/core';
-import { gs, mq } from '../utils';
+import { gs, mq } from '../../common/utils';
 export const contentFooterClassName = 'smart-link-content-footer';
 export const ContentFooter = ({
   children,

package/dist/es2019/view/BlockCard/components/Emoji.js

@@ -1,7 +1,7 @@
 /** @jsx jsx */
 import { jsx } from '@emotion/core';
 import React from 'react';
-import { gs } from '../utils';
+import { gs } from '../../common/utils';
 export const Emoji = ({
   emoji
 }) => {

package/dist/es2019/view/BlockCard/components/Frame.js

@@ -2,7 +2,7 @@
 import { jsx } from '@emotion/core';
 import React from 'react';
 import { N20A, N30A, B200, N40A, N50A } from '@atlaskit/theme/colors';
-import { gs, br, mq } from '../utils';
+import { gs, br, mq } from '../../common/utils';
 export const Frame = (props = {
   isSelected: false,
   isHoverable: false,

package/dist/es2019/view/BlockCard/components/Name.js

@@ -1,7 +1,7 @@
 /** @jsx jsx */
 import { jsx } from '@emotion/core';
 import { fontSize } from '@atlaskit/theme/constants';
-import { gs } from '../utils';
+import { gs } from '../../common/utils';
 export const blockCardContentHeaderNameClassName = 'block-card-content-header-name';
 export const Name = ({
   name,

package/dist/es2019/view/BlockCard/components/Provider.js

@@ -1,7 +1,7 @@
 /** @jsx jsx */
 import { jsx } from '@emotion/core';
 import { N300 } from '@atlaskit/theme/colors';
-import { gs } from '../utils';
+import { gs } from '../../common/utils';
 export const Provider = ({
   name,
   icon