mirror of
https://github.com/react/react-native-devtools-frontend.git
synced 2026-10-12 17:45:49 +08:00
chait pinnamaneni
8a5112747f
Markdown image example: https://i.imgur.com/NDgsEA4.png MarkdownImagesMap entries ``` [ 'settingIcon', { src: 'Images/settings-gear.svg', isIcon: true, width: '20px', height: '20px', color: 'var(--color-primary)' } ], [ 'lighthouseLogo', { src: 'Images/lighthouse_logo.svg', isIcon: false, } ] ``` Markdown ``` Following is settings icon  Image in markdown can be done like this  ``` Bug:1154783 Change-Id: Ia13e5d2c40de3c457429d7d550dbb326511873c1 Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2587634 Commit-Queue: Chait Pinnamaneni <cpinnamaneni@microsoft.com> Reviewed-by: Jack Franklin <jacktfranklin@chromium.org> Reviewed-by: Simon Zünd <szuend@chromium.org> Reviewed-by: Patrick Brosset <patrick.brosset@microsoft.com>
47 lines
1.2 KiB
TypeScript
47 lines
1.2 KiB
TypeScript
// Copyright (c) 2020 The Chromium Authors. All rights reserved.
|
|
// Use of this source code is governed by a BSD-style license that can be
|
|
// found in the LICENSE file.
|
|
|
|
/*
|
|
* To use images in markdown, add key in markdownImages with the image data and
|
|
* use the added key in markdown.
|
|
* @example markdown
|
|
* Give feedback by clicking 
|
|
*/
|
|
export interface ImageData {
|
|
src: string;
|
|
isIcon: boolean;
|
|
color?: string;
|
|
width?: string;
|
|
height?: string;
|
|
}
|
|
|
|
/*
|
|
* src for image is relative url for image location.
|
|
* @example icon
|
|
* [
|
|
* 'feedbackIcon',
|
|
* {
|
|
* src: 'Images/feedback_thin_16x16_icon.svg',
|
|
* isIcon: true,
|
|
* width: '20px',
|
|
* height: '20px',
|
|
* color: 'var(--color-text-disabled)',
|
|
* },
|
|
* ]
|
|
*
|
|
*/
|
|
|
|
// NOTE: This is only exported for tests, and it should not be
|
|
// imported in any component, instead add image data in map and
|
|
// use getMarkdownImage to get the appropriate image data.
|
|
export const markdownImages = new Map<string, ImageData>([]);
|
|
|
|
export const getMarkdownImage = (key: string): ImageData => {
|
|
const image = markdownImages.get(key);
|
|
if (!image) {
|
|
throw new Error(`Markdown image with key '${key}' is not available, please check MarkdownImagesMap.ts`);
|
|
}
|
|
return image;
|
|
};
|