@atlaskit/link-picker 1.14.0 → 1.15.1

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/link-picker
 
+## 1.15.1
+
+### Patch Changes
+
+- [`4a83c28f27b`](https://bitbucket.org/atlassian/atlassian-frontend/commits/4a83c28f27b) - Add support for inline SVGs in ListItem by converting them to Base64 images
+
+## 1.15.0
+
+### Minor Changes
+
+- [`b7ace618362`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b7ace618362) - [ux] EDM-3578: adding a prop hideDisplayText for link picker to allow support that stops rendering of the display text field in link picker if prop is set to true.
+
 ## 1.14.0
 
 ### Minor Changes

package/dist/cjs/ui/link-picker/index.js

@@ -142,6 +142,7 @@ function LinkPicker(_ref) {
       plugins = _ref.plugins,
       initUrl = _ref.url,
       initDisplayText = _ref.displayText,
+      hideDisplayText = _ref.hideDisplayText,
       featureFlags = _ref.featureFlags;
 
   var _useAnalyticsEvents = (0, _analyticsNext.useAnalyticsEvents)(),
@@ -390,7 +391,7 @@ function LinkPicker(_ref) {
     onClear: handleUrlClear,
     onKeyDown: handleKeyDown,
     onChange: handleChangeUrl
-  }), (0, _react2.jsx)(DisplayTextInputField, {
+  }), !hideDisplayText && (0, _react2.jsx)(DisplayTextInputField, {
     autoComplete: "off",
     name: "displayText",
     testId: testIds.textInputField,

package/dist/cjs/ui/link-picker/list-item/index.js

@@ -80,6 +80,16 @@ var formatDate = function formatDate(date) {
   return [date.pageAction, date.dateString, date.timeSince].filter(Boolean).join(' ');
 };
 
+var isSVG = function isSVG(icon) {
+  return icon.startsWith('<svg') && icon.endsWith('</svg>');
+};
+
+var base64SVG = function base64SVG(icon) {
+  return "data:image/svg+xml;base64,".concat(Buffer.from(icon).toString('base64'));
+};
+
+var testId = 'link-search-list-item-icon';
+
 var ListItemIcon = function ListItemIcon(props) {
   var item = props.item,
       intl = props.intl;
@@ -97,14 +107,16 @@ var ListItemIcon = function ListItemIcon(props) {
     return (0, _react2.jsx)("span", {
       css: _styled.itemIconStyles
     }, (0, _react2.jsx)(Glyph, {
-      alt: alt
+      alt: alt,
+      "data-testid": testId
     }));
   }
 
   return (0, _react2.jsx)("span", {
     css: _styled.itemIconStyles
   }, (0, _react2.jsx)("img", {
-    src: icon,
+    "data-testid": testId,
+    src: isSVG(icon) ? base64SVG(icon) : icon,
     alt: alt,
     css: _styled.imgStyles
   }));

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/link-picker",
-	"version": "1.14.0",
+	"version": "1.15.1",
 	"sideEffects": false
 }

package/dist/es2019/ui/link-picker/index.js

@@ -88,6 +88,7 @@ function LinkPicker({
   plugins,
   url: initUrl,
   displayText: initDisplayText,
+  hideDisplayText,
   featureFlags
 }) {
   var _errorFallback;
@@ -333,7 +334,7 @@ function LinkPicker({
     onClear: handleUrlClear,
     onKeyDown: handleKeyDown,
     onChange: handleChangeUrl
-  }), jsx(DisplayTextInputField, {
+  }), !hideDisplayText && jsx(DisplayTextInputField, {
     autoComplete: "off",
     name: "displayText",
     testId: testIds.textInputField,

package/dist/es2019/ui/link-picker/list-item/index.js

@@ -60,6 +60,12 @@ const formatDate = date => {
   return [date.pageAction, date.dateString, date.timeSince].filter(Boolean).join(' ');
 };
 
+const isSVG = icon => icon.startsWith('<svg') && icon.endsWith('</svg>');
+
+const base64SVG = icon => `data:image/svg+xml;base64,${Buffer.from(icon).toString('base64')}`;
+
+const testId = 'link-search-list-item-icon';
+
 const ListItemIcon = props => {
   const {
     item,
@@ -81,14 +87,16 @@ const ListItemIcon = props => {
     return jsx("span", {
       css: itemIconStyles
     }, jsx(Glyph, {
-      alt: alt
+      alt: alt,
+      "data-testid": testId
     }));
   }
 
   return jsx("span", {
     css: itemIconStyles
   }, jsx("img", {
-    src: icon,
+    "data-testid": testId,
+    src: isSVG(icon) ? base64SVG(icon) : icon,
     alt: alt,
     css: imgStyles
   }));

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/link-picker",
-	"version": "1.14.0",
+	"version": "1.15.1",
 	"sideEffects": false
 }

package/dist/esm/ui/link-picker/index.js

@@ -94,6 +94,7 @@ function LinkPicker(_ref) {
       plugins = _ref.plugins,
       initUrl = _ref.url,
       initDisplayText = _ref.displayText,
+      hideDisplayText = _ref.hideDisplayText,
       featureFlags = _ref.featureFlags;
 
   var _useAnalyticsEvents = useAnalyticsEvents(),
@@ -342,7 +343,7 @@ function LinkPicker(_ref) {
     onClear: handleUrlClear,
     onKeyDown: handleKeyDown,
     onChange: handleChangeUrl
-  }), jsx(DisplayTextInputField, {
+  }), !hideDisplayText && jsx(DisplayTextInputField, {
     autoComplete: "off",
     name: "displayText",
     testId: testIds.textInputField,

package/dist/esm/ui/link-picker/list-item/index.js

@@ -66,6 +66,16 @@ var formatDate = function formatDate(date) {
   return [date.pageAction, date.dateString, date.timeSince].filter(Boolean).join(' ');
 };
 
+var isSVG = function isSVG(icon) {
+  return icon.startsWith('<svg') && icon.endsWith('</svg>');
+};
+
+var base64SVG = function base64SVG(icon) {
+  return "data:image/svg+xml;base64,".concat(Buffer.from(icon).toString('base64'));
+};
+
+var testId = 'link-search-list-item-icon';
+
 var ListItemIcon = function ListItemIcon(props) {
   var item = props.item,
       intl = props.intl;
@@ -83,14 +93,16 @@ var ListItemIcon = function ListItemIcon(props) {
     return jsx("span", {
       css: itemIconStyles
     }, jsx(Glyph, {
-      alt: alt
+      alt: alt,
+      "data-testid": testId
     }));
   }
 
   return jsx("span", {
     css: itemIconStyles
   }, jsx("img", {
-    src: icon,
+    "data-testid": testId,
+    src: isSVG(icon) ? base64SVG(icon) : icon,
     alt: alt,
     css: imgStyles
   }));

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/link-picker",
-	"version": "1.14.0",
+	"version": "1.15.1",
 	"sideEffects": false
 }

package/dist/types/ui/link-picker/index.d.ts

@@ -61,6 +61,8 @@ export interface LinkPickerProps {
     component?: React.ComponentType<Partial<LinkPickerProps> & {
         children: React.ReactElement;
     }>;
+    /** Hides the link picker display text field if set to true. */
+    hideDisplayText?: boolean;
     featureFlags?: Record<string, unknown>;
 }
 export interface PickerState {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/link-picker",
-  "version": "1.14.0",
+  "version": "1.15.1",
   "description": "Standalone link picker",
   "author": "Atlassian Pty Ltd",
   "publishConfig": {
@@ -73,8 +73,8 @@
     "@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-picker-atlassian-plugin": "^24.0.0",
-    "@atlassian/link-picker-plugins": "^12.0.0",
+    "@atlassian/link-picker-atlassian-plugin": "^25.0.0",
+    "@atlassian/link-picker-plugins": "^13.0.0",
     "@atlassian/recent-work-client": "^1.6.0",
     "@atlassian/search-provider": "^2.3.0",
     "@testing-library/dom": "^8.17.1",

package/report.api.md

@@ -8,6 +8,7 @@
 ### Table of contents
 
 - [Main Entry Types](#main-entry-types)
+- [Peer Dependencies](#peer-dependencies)
 
 ### Main Entry Types
 
@@ -60,6 +61,7 @@ export interface LinkPickerProps {
   displayText?: null | string;
   // (undocumented)
   featureFlags?: Record<string, unknown>;
+  hideDisplayText?: boolean;
   onCancel: () => void;
   onContentResize?: () => void;
   onSubmit: (
@@ -119,3 +121,16 @@ interface ResolveResult {
 ```
 
 <!--SECTION END: Main Entry Types-->
+
+### Peer Dependencies
+
+<!--SECTION START: Peer Dependencies-->
+
+```json
+{
+  "react": "^16.8.0",
+  "react-intl-next": "npm:react-intl@^5.18.1"
+}
+```
+
+<!--SECTION END: Peer Dependencies-->

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

@@ -41,6 +41,7 @@ export interface LinkPickerProps {
     displayText?: null | string;
     // (undocumented)
     featureFlags?: Record<string, unknown>;
+    hideDisplayText?: boolean;
     onCancel: () => void;
     onContentResize?: () => void;
     onSubmit: (arg: OnSubmitParameter, analytic?: UIAnalyticsEvent | null) => void;