@atlaskit/smart-card 26.46.0 → 26.46.1

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/smart-card
 
+## 26.46.1
+
+### Patch Changes
+
+- [#69731](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/69731) [`fc420fa28bcc`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/fc420fa28bcc) - Add AI prism border and icon component
+- [#69560](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/69560) [`0c8262def83c`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/0c8262def83c) - Add base AISummaryBlock for internal usage
+- Updated dependencies
+
 ## 26.46.0
 
 ### Minor Changes

package/dist/cjs/messages.js

@@ -19,6 +19,11 @@ var messages = exports.messages = (0, _reactIntlNext.defineMessages)({
     defaultMessage: 'Add account',
     description: 'Allows to add a new account'
   },
+  ai_summarize: {
+    id: 'fabric.linking.ai_summarize',
+    defaultMessage: 'Summarize',
+    description: 'Action to summarize link resource content with AI'
+  },
   assigned_to: {
     id: 'fabric.linking.assigned_to',
     defaultMessage: 'Assigned to {context}',

package/dist/cjs/utils/analytics/analytics.js

@@ -22,7 +22,7 @@ var ANALYTICS_CHANNEL = exports.ANALYTICS_CHANNEL = 'media';
 var context = exports.context = {
   componentName: 'smart-cards',
   packageName: "@atlaskit/smart-card",
-  packageVersion: "26.46.0"
+  packageVersion: "26.46.1"
 };
 var TrackQuickActionType = exports.TrackQuickActionType = /*#__PURE__*/function (TrackQuickActionType) {
   TrackQuickActionType["StatusUpdate"] = "StatusUpdate";

package/dist/cjs/view/FlexibleCard/components/blocks/ai-summary-block/index.js

@@ -0,0 +1,33 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _react = _interopRequireDefault(require("react"));
+var _resolved = _interopRequireDefault(require("./resolved"));
+var _constants = require("../../../../../constants");
+var _excluded = ["status", "testId"];
+/**
+ * Represents an AISummaryBlock, designed to summarising link resource
+ * content using AI.
+ * @public
+ * @param {AISummaryBlockProps} AISummaryBlock
+ * @see Block
+ */
+var AISummaryBlock = function AISummaryBlock(_ref) {
+  var status = _ref.status,
+    _ref$testId = _ref.testId,
+    testId = _ref$testId === void 0 ? 'smart-ai-summary-block' : _ref$testId,
+    props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  if (status !== _constants.SmartLinkStatus.Resolved) {
+    return null;
+  }
+  return /*#__PURE__*/_react.default.createElement(_resolved.default, (0, _extends2.default)({}, props, {
+    testId: testId
+  }));
+};
+var _default = exports.default = AISummaryBlock;

package/dist/cjs/view/FlexibleCard/components/blocks/ai-summary-block/resolved/index.js

@@ -0,0 +1,73 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _react = _interopRequireWildcard(require("react"));
+var _reactIntlNext = require("react-intl-next");
+var _constants = require("../../../../../../constants");
+var _flexibleUiContext = require("../../../../../../state/flexible-ui-context");
+var _actionGroup = _interopRequireDefault(require("../../action-group"));
+var _block = _interopRequireDefault(require("../../block"));
+var _elementGroup = _interopRequireDefault(require("../../element-group"));
+var _utils = require("../../utils");
+var _messages = require("../../../../../../messages");
+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); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+var AISummaryBlockResolvedView = function AISummaryBlockResolvedView(props) {
+  var _props$actions = props.actions,
+    actions = _props$actions === void 0 ? [] : _props$actions,
+    metadata = props.metadata,
+    testId = props.testId,
+    onActionMenuOpenChange = props.onActionMenuOpenChange,
+    onAIActionChange = props.onAIActionChange,
+    _props$size = props.size,
+    size = _props$size === void 0 ? _constants.SmartLinkSize.Medium : _props$size;
+  var context = (0, _flexibleUiContext.useFlexibleUiContext)();
+  var metadataElements = (0, _utils.renderElementItems)(metadata);
+  var onAIActionClick = (0, _react.useCallback)(function () {
+    if (onAIActionChange) {
+      onAIActionChange();
+    }
+  }, [onAIActionChange]);
+  var combinedActions = (0, _react.useMemo)(function () {
+    var aiAction = {
+      content: /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _messages.messages.ai_summarize),
+      name: _constants.ActionName.CustomAction,
+      onClick: onAIActionClick,
+      testId: "".concat(testId, "-ai-summary-action")
+    };
+    return [aiAction].concat((0, _toConsumableArray2.default)(actions));
+  }, [actions, onAIActionClick, testId]);
+  var hasActions = (0, _react.useMemo)(function () {
+    var _filterActionItems;
+    return ((_filterActionItems = (0, _utils.filterActionItems)(combinedActions, context)) === null || _filterActionItems === void 0 ? void 0 : _filterActionItems.length) > 0;
+  }, [combinedActions, context]);
+  var onDropdownOpenChange = (0, _react.useCallback)(function (isOpen) {
+    if (onActionMenuOpenChange) {
+      onActionMenuOpenChange({
+        isOpen: isOpen
+      });
+    }
+  }, [onActionMenuOpenChange]);
+  return /*#__PURE__*/_react.default.createElement(_block.default, (0, _extends2.default)({}, props, {
+    testId: "".concat(testId, "-resolved-view")
+  }), /*#__PURE__*/_react.default.createElement(_elementGroup.default, {
+    width: _constants.SmartLinkWidth.Flexible
+  }, metadataElements), hasActions && /*#__PURE__*/_react.default.createElement(_elementGroup.default, {
+    testId: "smart-element-group-actions",
+    align: _constants.SmartLinkAlignment.Right,
+    overrideCss: (0, _utils.getActionGroupStyles)(size),
+    width: _constants.SmartLinkWidth.Flexible
+  }, /*#__PURE__*/_react.default.createElement(_actionGroup.default, {
+    onDropdownOpenChange: onDropdownOpenChange,
+    items: combinedActions,
+    appearance: "default"
+  })));
+};
+var _default = exports.default = AISummaryBlockResolvedView;

package/dist/cjs/view/FlexibleCard/components/blocks/ai-summary-block/types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/dist/cjs/view/FlexibleCard/components/blocks/footer-block/resolved/index.js

@@ -7,9 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-var _react = require("@emotion/react");
-var _react2 = _interopRequireWildcard(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 var _constants = require("../../../../../../constants");
 var _flexibleUiContext = require("../../../../../../state/flexible-ui-context");
 var _elements = require("../../../elements");
@@ -17,17 +15,8 @@ var _actionGroup = _interopRequireDefault(require("../../action-group"));
 var _block = _interopRequireDefault(require("../../block"));
 var _elementGroup = _interopRequireDefault(require("../../element-group"));
 var _utils = require("../../utils");
-var _templateObject;
 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); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-var getActionGroupStyles = function getActionGroupStyles(size) {
-  if (size === _constants.SmartLinkSize.XLarge) {
-    // The biggest height of the action button exceeds the max line-height
-    // of the elements causing the action on the block with x-large size to
-    // get cut at the bottom.
-    return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n      max-height: 2rem;\n    "])));
-  }
-};
 var FooterBlockResolvedView = function FooterBlockResolvedView(props) {
   var actions = props.actions,
     testId = props.testId,
@@ -35,28 +24,28 @@ var FooterBlockResolvedView = function FooterBlockResolvedView(props) {
     _props$size = props.size,
     size = _props$size === void 0 ? _constants.SmartLinkSize.Medium : _props$size;
   var context = (0, _flexibleUiContext.useFlexibleUiContext)();
-  var hasActions = (0, _react2.useMemo)(function () {
+  var hasActions = (0, _react.useMemo)(function () {
     var _filterActionItems;
     return ((_filterActionItems = (0, _utils.filterActionItems)(actions, context)) === null || _filterActionItems === void 0 ? void 0 : _filterActionItems.length) > 0;
   }, [actions, context]);
-  var onDropdownOpenChange = (0, _react2.useCallback)(function (isOpen) {
+  var onDropdownOpenChange = (0, _react.useCallback)(function (isOpen) {
     if (onActionMenuOpenChange) {
       onActionMenuOpenChange({
         isOpen: isOpen
       });
     }
   }, [onActionMenuOpenChange]);
-  return /*#__PURE__*/_react2.default.createElement(_block.default, (0, _extends2.default)({}, props, {
+  return /*#__PURE__*/_react.default.createElement(_block.default, (0, _extends2.default)({}, props, {
     testId: "".concat(testId, "-resolved-view")
-  }), /*#__PURE__*/_react2.default.createElement(_elements.Provider, {
+  }), /*#__PURE__*/_react.default.createElement(_elements.Provider, {
     testId: "".concat(testId, "-provider")
-  }), actions && hasActions ? /*#__PURE__*/_react2.default.createElement(_elementGroup.default, {
+  }), actions && hasActions ? /*#__PURE__*/_react.default.createElement(_elementGroup.default, {
     testId: "smart-element-group-actions",
     align: _constants.SmartLinkAlignment.Right,
     direction: _constants.SmartLinkDirection.Horizontal,
-    overrideCss: getActionGroupStyles(size),
+    overrideCss: (0, _utils.getActionGroupStyles)(size),
     width: _constants.SmartLinkWidth.Flexible
-  }, /*#__PURE__*/_react2.default.createElement(_actionGroup.default, {
+  }, /*#__PURE__*/_react.default.createElement(_actionGroup.default, {
     onDropdownOpenChange: onDropdownOpenChange,
     items: actions,
     appearance: "default"

package/dist/cjs/view/FlexibleCard/components/blocks/index.js

@@ -4,6 +4,12 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+Object.defineProperty(exports, "AISummaryBlock", {
+  enumerable: true,
+  get: function get() {
+    return _aiSummaryBlock.default;
+  }
+});
 Object.defineProperty(exports, "CustomBlock", {
   enumerable: true,
   get: function get() {
@@ -59,4 +65,5 @@ var _snippetBlock = _interopRequireDefault(require("./snippet-block"));
 var _titleBlock = _interopRequireDefault(require("./title-block"));
 var _block = _interopRequireDefault(require("./block"));
 var _resolved = _interopRequireDefault(require("./footer-block/resolved"));
-var _relatedUrlsBlock = _interopRequireDefault(require("./related-urls-block"));
+var _relatedUrlsBlock = _interopRequireDefault(require("./related-urls-block"));
+var _aiSummaryBlock = _interopRequireDefault(require("./ai-summary-block"));

package/dist/cjs/view/FlexibleCard/components/blocks/utils.js

@@ -5,7 +5,7 @@ var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.renderElementItems = exports.renderChildren = exports.isJSXElementNull = exports.highlightRemoveStyles = exports.getGapSize = exports.getBaseStyles = exports.filterActionItems = exports.ElementDisplaySchema = void 0;
+exports.renderElementItems = exports.renderChildren = exports.isJSXElementNull = exports.highlightRemoveStyles = exports.getGapSize = exports.getBaseStyles = exports.getActionGroupStyles = exports.filterActionItems = exports.ElementDisplaySchema = void 0;
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
@@ -19,7 +19,7 @@ var _flexible = require("../../../../utils/flexible");
 var _actionGroup = _interopRequireDefault(require("./action-group"));
 var _elementGroup = _interopRequireDefault(require("./element-group"));
 var _excluded = ["name"];
-var _ElementDisplaySchema, _templateObject, _templateObject2, _templateObject3, _templateObject4;
+var _ElementDisplaySchema, _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
 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); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 // Determine whether the element can be display as inline/block.
@@ -64,6 +64,14 @@ var isJSXElementNull = exports.isJSXElementNull = function isJSXElementNull(chil
 var isElementOrElementGroup = function isElementOrElementGroup(node) {
   return /*#__PURE__*/_react.default.isValidElement(node) && ((0, _flexible.isFlexibleUiElement)(node) || node.type === _elementGroup.default);
 };
+var getActionGroupStyles = exports.getActionGroupStyles = function getActionGroupStyles(size) {
+  if (size === _constants.SmartLinkSize.XLarge) {
+    // The biggest height of the action button exceeds the max line-height
+    // of the elements causing the action on the block with x-large size to
+    // get cut at the bottom.
+    return (0, _react2.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n      max-height: 2rem;\n    "])));
+  }
+};
 var filterActionItems = exports.filterActionItems = function filterActionItems() {
   var items = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
   var context = arguments.length > 1 ? arguments[1] : undefined;

package/dist/cjs/view/LinkUrl/index.js

@@ -17,7 +17,7 @@ var _excluded = ["href", "children", "checkSafety", "onClick", "testId"],
   _excluded2 = ["isLinkSafe", "showSafetyWarningModal"];
 var PACKAGE_DATA = {
   packageName: "@atlaskit/smart-card",
-  packageVersion: "26.46.0",
+  packageVersion: "26.46.1",
   componentName: 'linkUrl'
 };
 var Link = (0, _click.withLinkClickedEvent)('a');

package/dist/cjs/view/common/ai-icon/index.js

@@ -0,0 +1,117 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _svg = _interopRequireDefault(require("@atlaskit/icon/svg"));
+var _colors = require("@atlaskit/theme/colors");
+/**
+ * The bulk of this file is originally from
+ * https://bitbucket.org/atlassian/barrel/src/master/ui/platform/ui-kit/ai
+ * with modifications
+ */
+var AiIcon = function AiIcon(props) {
+  return /*#__PURE__*/_react.default.createElement(_svg.default, props, /*#__PURE__*/_react.default.createElement("defs", null, /*#__PURE__*/_react.default.createElement("linearGradient", {
+    id: "ai_icon_lg0",
+    x1: "21",
+    y1: "12",
+    x2: "17.5",
+    y2: "12",
+    gradientUnits: "userSpaceOnUse"
+  }, /*#__PURE__*/_react.default.createElement("stop", {
+    offset: "0.270833",
+    stopColor: "var(--ds-icon-accent-blue, ".concat(_colors.B200, ")"),
+    color: "var(--ds-icon-accent-blue, ".concat(_colors.B200, ")")
+  }), /*#__PURE__*/_react.default.createElement("stop", {
+    offset: "1",
+    stopColor: "var(--ds-text-accent-blue, ".concat(_colors.B400, ")"),
+    color: "var(--ds-text-accent-blue, ".concat(_colors.B400, ")")
+  })), /*#__PURE__*/_react.default.createElement("linearGradient", {
+    id: "ai_icon_lg1",
+    x1: "12.5",
+    y1: "3",
+    x2: "12.5",
+    y2: "6.5",
+    gradientUnits: "userSpaceOnUse"
+  }, /*#__PURE__*/_react.default.createElement("stop", {
+    offset: "0.1875",
+    stopColor: "var(--ds-icon-accent-blue, ".concat(_colors.B200, ")"),
+    color: "var(--ds-icon-accent-blue, ".concat(_colors.B200, ")")
+  }), /*#__PURE__*/_react.default.createElement("stop", {
+    offset: "1",
+    stopColor: "var(--ds-text-accent-blue, ".concat(_colors.B400, ")"),
+    color: "var(--ds-text-accent-blue, ".concat(_colors.B400, ")")
+  })), /*#__PURE__*/_react.default.createElement("linearGradient", {
+    id: "ai_icon_lg2",
+    x1: "6.82996",
+    y1: "12",
+    x2: "3.32996",
+    y2: "12",
+    gradientUnits: "userSpaceOnUse"
+  }, /*#__PURE__*/_react.default.createElement("stop", {
+    stopColor: "var(--ds-text-accent-blue, ".concat(_colors.B400, ")"),
+    color: "var(--ds-text-accent-blue, ".concat(_colors.B400, ")")
+  }), /*#__PURE__*/_react.default.createElement("stop", {
+    offset: "0.791667",
+    stopColor: "var(--ds-icon-accent-blue, ".concat(_colors.B200, ")"),
+    color: "var(--ds-icon-accent-blue, ".concat(_colors.B200, ")")
+  })), /*#__PURE__*/_react.default.createElement("linearGradient", {
+    id: "ai_icon_lg3",
+    x1: "12.5",
+    y1: "17",
+    x2: "12.5",
+    y2: "21",
+    gradientUnits: "userSpaceOnUse"
+  }, /*#__PURE__*/_react.default.createElement("stop", {
+    stopColor: "var(--ds-text-accent-blue, ".concat(_colors.B400, ")"),
+    color: "var(--ds-text-accent-blue, ".concat(_colors.B400, ")")
+  }), /*#__PURE__*/_react.default.createElement("stop", {
+    offset: "0.802083",
+    stopColor: "var(--ds-icon-accent-blue, ".concat(_colors.B200, ")"),
+    color: "var(--ds-icon-accent-blue, ".concat(_colors.B200, ")")
+  }))), /*#__PURE__*/_react.default.createElement("g", null, /*#__PURE__*/_react.default.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M17.17 12C17.17 11.4477 17.6177 11 18.17 11H20C20.5523 11 21 11.4477 21 12C21 12.5523 20.5523 13 20 13H18.17C17.6177 13 17.17 12.5523 17.17 12Z",
+    fill: "url(#ai_icon_lg0)"
+  }), /*#__PURE__*/_react.default.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M12 3C12.5523 3 13 3.44772 13 4V5.83C13 6.38228 12.5523 6.83 12 6.83C11.4477 6.83 11 6.38228 11 5.83V4C11 3.44772 11.4477 3 12 3Z",
+    fill: "url(#ai_icon_lg1)"
+  }), /*#__PURE__*/_react.default.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M3 12C3 11.4477 3.44772 11 4 11H5.83C6.38228 11 6.83 11.4477 6.83 12C6.83 12.5523 6.38228 13 5.83 13H4C3.44772 13 3 12.5523 3 12Z",
+    fill: "url(#ai_icon_lg2)"
+  }), /*#__PURE__*/_react.default.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M12 17.17C12.5523 17.17 13 17.6177 13 18.17V20C13 20.5523 12.5523 21 12 21C11.4477 21 11 20.5523 11 20V18.17C11 17.6177 11.4477 17.17 12 17.17Z",
+    fill: "url(#ai_icon_lg3)"
+  }), /*#__PURE__*/_react.default.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M14.2929 14.2929C14.6835 13.9024 15.3166 13.9024 15.7071 14.2929L19.7071 18.2929C20.0977 18.6834 20.0977 19.3166 19.7071 19.7071C19.3166 20.0976 18.6835 20.0976 18.2929 19.7071L14.2929 15.7071C13.9024 15.3166 13.9024 14.6834 14.2929 14.2929Z",
+    fill: "var(--ds-icon-accent-blue, ".concat(_colors.B200, ")")
+  }), /*#__PURE__*/_react.default.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M19.7071 4.29289C20.0977 4.68342 20.0977 5.31658 19.7071 5.70711L15.7071 9.70711C15.3166 10.0976 14.6835 10.0976 14.2929 9.70711C13.9024 9.31658 13.9024 8.68342 14.2929 8.29289L18.2929 4.29289C18.6835 3.90237 19.3166 3.90237 19.7071 4.29289Z",
+    fill: "var(--ds-icon-accent-blue, ".concat(_colors.B200, ")")
+  }), /*#__PURE__*/_react.default.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M4.29289 4.29289C4.68342 3.90237 5.31658 3.90237 5.70711 4.29289L9.70711 8.29289C10.0976 8.68342 10.0976 9.31658 9.70711 9.70711C9.31658 10.0976 8.68342 10.0976 8.29289 9.70711L4.29289 5.70711C3.90237 5.31658 3.90237 4.68342 4.29289 4.29289Z",
+    fill: "var(--ds-icon-accent-blue, ".concat(_colors.B200, ")")
+  }), /*#__PURE__*/_react.default.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M9.70711 14.2929C10.0976 14.6834 10.0976 15.3166 9.70711 15.7071L5.70711 19.7071C5.31658 20.0976 4.68342 20.0976 4.29289 19.7071C3.90237 19.3166 3.90237 18.6834 4.29289 18.2929L8.29289 14.2929C8.68342 13.9024 9.31658 13.9024 9.70711 14.2929Z",
+    fill: "var(--ds-icon-accent-blue, ".concat(_colors.B200, ")")
+  })));
+};
+var _default = exports.default = AiIcon;

package/dist/cjs/view/common/ai-prism/ai-glowing-border/animated-svg-container.js

@@ -0,0 +1,249 @@
+"use strict";
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = require("@emotion/react");
+var _react2 = _interopRequireWildcard(require("react"));
+var _constants = require("../constants");
+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); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+/** @jsx jsx */
+
+var namespaceUUID = 0;
+var svgStyles = (0, _react.css)({
+  position: 'absolute',
+  borderRadius: _constants.OUTER_BORDER_RADIUS
+});
+var blurredStyles = (0, _react.css)({
+  width: "calc(100% - ".concat(_constants.GLOW_SIZE / 2, "px)"),
+  height: "calc(100% - ".concat(_constants.GLOW_SIZE / 2, "px)"),
+  top: _constants.GLOW_SIZE / 2,
+  left: _constants.GLOW_SIZE / 2,
+  filter: "blur(".concat(_constants.GLOW_SIZE, "px)"),
+  // for safari... : https://stackoverflow.com/a/71353198
+  backfaceVisibility: 'hidden',
+  transform: 'translate3d(0, 0, 0)'
+});
+var notBlurredStyles = (0, _react.css)({
+  left: 0,
+  top: 0,
+  width: '100%',
+  height: '100%'
+});
+
+/**
+ * The bulk of this file is originally from
+ * https://bitbucket.org/atlassian/barrel/src/master/ui/platform/ui-kit/ai
+ * with modifications.
+ */
+var AnimatedSvgContainer = function AnimatedSvgContainer(_ref) {
+  var palette = _ref.palette,
+    isMoving = _ref.isMoving,
+    isGlowing = _ref.isGlowing,
+    additionalCss = _ref.additionalCss;
+  var svgRef = (0, _react2.useRef)(null);
+  var namespaceId = (0, _react2.useRef)();
+  if (namespaceId.current === undefined) {
+    namespaceId.current = namespaceUUID;
+    namespaceUUID += 1;
+  }
+  (0, _react2.useEffect)(function () {
+    if (isMoving) {
+      var svg = svgRef.current;
+
+      // Schedule animation to begin before next browser paint
+      var beginReq = requestAnimationFrame(function () {
+        svg === null || svg === void 0 || svg.querySelectorAll('animate').forEach(function (node) {
+          return node.beginElement();
+        });
+      });
+      return function () {
+        // Ensure any pending animation frame is cancelled as the element animation does not end properly if it
+        // begins in the same event tick, i.e. isLoading synchronously changes to true then false.
+        cancelAnimationFrame(beginReq);
+        requestAnimationFrame(function () {
+          svg === null || svg === void 0 || svg.querySelectorAll('animate').forEach(function (node) {
+            return node.endElement();
+          });
+        });
+      };
+    }
+    return undefined;
+  }, [isMoving]);
+  return (0, _react.jsx)("svg", {
+    css: [svgStyles, isGlowing ? blurredStyles : notBlurredStyles, additionalCss],
+    ref: svgRef,
+    viewBox: "0 0 24 24",
+    preserveAspectRatio: "none"
+  }, (0, _react.jsx)("defs", null, (0, _react.jsx)("linearGradient", {
+    id: "".concat(namespaceId.current, "_lg1"),
+    gradientUnits: "userSpaceOnUse",
+    x1: "0%",
+    y1: "0",
+    x2: "400%",
+    y2: "0",
+    spreadMethod: "reflect"
+  }, (0, _react.jsx)("animate", {
+    begin: "indefinite",
+    attributeName: "x1",
+    from: "0%",
+    to: "400%",
+    repeatCount: "indefinite",
+    dur: "3s"
+  }), (0, _react.jsx)("animate", {
+    begin: "indefinite",
+    attributeName: "x2",
+    from: "400%",
+    to: "800%",
+    repeatCount: "indefinite",
+    dur: "3s"
+  }), (0, _react.jsx)("stop", {
+    offset: "0",
+    stopColor: palette.blue
+  }), (0, _react.jsx)("stop", {
+    offset: "0.25",
+    stopColor: palette.teal
+  }), (0, _react.jsx)("stop", {
+    offset: "0.5",
+    stopColor: palette.yellow
+  }), (0, _react.jsx)("stop", {
+    offset: "0.75",
+    stopColor: palette.teal
+  }), (0, _react.jsx)("stop", {
+    offset: "1",
+    stopColor: palette.blue
+  })), (0, _react.jsx)("linearGradient", {
+    id: "".concat(namespaceId.current, "_lg2"),
+    gradientUnits: "userSpaceOnUse",
+    x1: "0",
+    y1: "-100%",
+    x2: "0",
+    y2: "300%",
+    spreadMethod: "reflect"
+  }, (0, _react.jsx)("animate", {
+    begin: "indefinite",
+    attributeName: "y1",
+    from: "-100%",
+    to: "300%",
+    repeatCount: "indefinite",
+    dur: "3s"
+  }), (0, _react.jsx)("animate", {
+    begin: "indefinite",
+    attributeName: "y2",
+    from: "300%",
+    to: "700%",
+    repeatCount: "indefinite",
+    dur: "3s"
+  }), (0, _react.jsx)("stop", {
+    offset: "0",
+    stopColor: palette.blue
+  }), (0, _react.jsx)("stop", {
+    offset: "0.25",
+    stopColor: palette.teal
+  }), (0, _react.jsx)("stop", {
+    offset: "0.5",
+    stopColor: palette.yellow
+  }), (0, _react.jsx)("stop", {
+    offset: "0.75",
+    stopColor: palette.teal
+  }), (0, _react.jsx)("stop", {
+    offset: "1",
+    stopColor: palette.blue
+  })), (0, _react.jsx)("linearGradient", {
+    id: "".concat(namespaceId.current, "_lg3"),
+    gradientUnits: "userSpaceOnUse",
+    x1: "300%",
+    y1: "0",
+    x2: "700%",
+    y2: "0",
+    spreadMethod: "reflect"
+  }, (0, _react.jsx)("animate", {
+    begin: "indefinite",
+    attributeName: "x1",
+    from: "300%",
+    to: "-100%",
+    repeatCount: "indefinite",
+    dur: "3s"
+  }), (0, _react.jsx)("animate", {
+    begin: "indefinite",
+    attributeName: "x2",
+    from: "700%",
+    to: "300%",
+    repeatCount: "indefinite",
+    dur: "3s"
+  }), (0, _react.jsx)("stop", {
+    offset: "0",
+    stopColor: palette.blue
+  }), (0, _react.jsx)("stop", {
+    offset: "0.25",
+    stopColor: palette.teal
+  }), (0, _react.jsx)("stop", {
+    offset: "0.5",
+    stopColor: palette.yellow
+  }), (0, _react.jsx)("stop", {
+    offset: "0.75",
+    stopColor: palette.teal
+  }), (0, _react.jsx)("stop", {
+    offset: "1",
+    stopColor: palette.blue
+  })), (0, _react.jsx)("linearGradient", {
+    id: "".concat(namespaceId.current, "_lg4"),
+    gradientUnits: "userSpaceOnUse",
+    x1: "0",
+    y1: "0",
+    x2: "0",
+    y2: "400%",
+    spreadMethod: "reflect"
+  }, (0, _react.jsx)("animate", {
+    begin: "indefinite",
+    attributeName: "y1",
+    from: "0%",
+    to: "-400%",
+    repeatCount: "indefinite",
+    dur: "3s"
+  }), (0, _react.jsx)("animate", {
+    begin: "indefinite",
+    attributeName: "y2",
+    from: "400%",
+    to: "0%",
+    repeatCount: "indefinite",
+    dur: "3s"
+  }), (0, _react.jsx)("stop", {
+    offset: "0",
+    stopColor: palette.blue
+  }), (0, _react.jsx)("stop", {
+    offset: "0.25",
+    stopColor: palette.teal
+  }), (0, _react.jsx)("stop", {
+    offset: "0.5",
+    stopColor: palette.yellow
+  }), (0, _react.jsx)("stop", {
+    offset: "0.75",
+    stopColor: palette.teal
+  }), (0, _react.jsx)("stop", {
+    offset: "1",
+    stopColor: palette.blue
+  }))), (0, _react.jsx)("g", {
+    strokeWidth: "8"
+  }, (0, _react.jsx)("path", {
+    stroke: "url(#".concat(namespaceId.current, "_lg1)"),
+    d: "M0 0h24",
+    vectorEffect: "non-scaling-stroke"
+  }), (0, _react.jsx)("path", {
+    stroke: "url(#".concat(namespaceId.current, "_lg2)"),
+    d: "M24 0v24",
+    vectorEffect: "non-scaling-stroke"
+  }), (0, _react.jsx)("path", {
+    stroke: "url(#".concat(namespaceId.current, "_lg3)"),
+    d: "M24 24H0",
+    vectorEffect: "non-scaling-stroke"
+  }), (0, _react.jsx)("path", {
+    stroke: "url(#".concat(namespaceId.current, "_lg4)"),
+    d: "M0 24V0",
+    vectorEffect: "non-scaling-stroke"
+  })));
+};
+var _default = exports.default = AnimatedSvgContainer;