UNPKG

11.7 kBTypeScriptView Raw
1import { IRenderMime } from '@jupyterlab/rendermime-interfaces';
2import { Signal } from '@lumino/signaling';
3import { ElementAttrs, VirtualElement, VirtualNode } from '@lumino/virtualdom';
4import React from 'react';
5import { LabIconStyle } from '../style';
6export declare class LabIcon implements LabIcon.ILabIcon, VirtualElement.IRenderer {
7 /** *********
8 * statics *
9 ***********/
10 /**
11 * Remove any rendered icon from the element that contains it
12 *
13 * @param container - a DOM node into which an icon was
14 * previously rendered
15 *
16 * @returns the cleaned container
17 */
18 static remove(container: HTMLElement): HTMLElement;
19 /**
20 * Resolve an icon name or a \{name, svgstr\} pair into an
21 * actual LabIcon.
22 *
23 * @param options - icon: either a string with the name of an existing icon
24 * or an object with \{name: string, svgstr: string\} fields.
25 *
26 * @returns a LabIcon instance
27 */
28 static resolve({ icon }: {
29 icon: LabIcon.IResolvable;
30 }): LabIcon;
31 /**
32 * Resolve an icon name or a \{name, svgstr\} pair into a DOM element.
33 * If icon arg is undefined, the function will fall back to trying to render
34 * the icon as a CSS background image, via the iconClass arg.
35 * If both icon and iconClass are undefined, this function will return
36 * an empty div.
37 *
38 * @param icon - optional, either a string with the name of an existing icon
39 * or an object with \{name: string, svgstr: string\} fields
40 *
41 * @param iconClass - optional, if the icon arg is not set, the iconClass arg
42 * should be a CSS class associated with an existing CSS background-image
43 *
44 * @param fallback - DEPRECATED, optional, a LabIcon instance that will
45 * be used if neither icon nor iconClass are defined
46 *
47 * @param props - any additional args are passed though to the element method
48 * of the resolved icon on render
49 *
50 * @returns a DOM node with the resolved icon rendered into it
51 */
52 static resolveElement({ icon, iconClass, fallback, ...props }: Partial<LabIcon.IResolverProps> & LabIcon.IProps): HTMLElement;
53 /**
54 * Resolve an icon name or a \{name, svgstr\} pair into a React component.
55 * If icon arg is undefined, the function will fall back to trying to render
56 * the icon as a CSS background image, via the iconClass arg.
57 * If both icon and iconClass are undefined, the returned component
58 * will simply render an empty div.
59 *
60 * @param icon - optional, either a string with the name of an existing icon
61 * or an object with \{name: string, svgstr: string\} fields
62 *
63 * @param iconClass - optional, if the icon arg is not set, the iconClass arg
64 * should be a CSS class associated with an existing CSS background-image
65 *
66 * @param fallback - DEPRECATED, optional, a LabIcon instance that will
67 * be used if neither icon nor iconClass are defined
68 *
69 * @param props - any additional args are passed though to the React component
70 * of the resolved icon on render
71 *
72 * @returns a React component that will render the resolved icon
73 */
74 static resolveReact({ icon, iconClass, fallback, ...props }: Partial<LabIcon.IResolverProps> & LabIcon.IReactProps): JSX.Element;
75 /**
76 * Resolve a \{name, svgstr\} pair into an actual svg node.
77 */
78 static resolveSvg({ name, svgstr }: LabIcon.IIcon): HTMLElement | null;
79 /**
80 * Toggle icon debug from off-to-on, or vice-versa.
81 *
82 * @param debug - optional boolean to force debug on or off
83 */
84 static toggleDebug(debug?: boolean): void;
85 private static _debug;
86 private static _instances;
87 /** *********
88 * members *
89 ***********/
90 constructor({ name, svgstr, render, unrender, _loading }: LabIcon.IOptions & {
91 _loading?: boolean;
92 });
93 /**
94 * Get a view of this icon that is bound to the specified icon/style props
95 *
96 * @param optional icon/style props (same as args for .element
97 * and .react methods). These will be bound to the resulting view
98 *
99 * @returns a view of this LabIcon instance
100 */
101 bindprops(props?: LabIcon.IProps): LabIcon;
102 /**
103 * Create an icon as a DOM element
104 *
105 * @param className - a string that will be used as the class
106 * of the container element. Overrides any existing class
107 *
108 * @param container - a preexisting DOM element that
109 * will be used as the container for the svg element
110 *
111 * @param label - text that will be displayed adjacent
112 * to the icon
113 *
114 * @param title - a tooltip for the icon
115 *
116 * @param tag - if container is not explicitly
117 * provided, this tag will be used when creating the container
118 *
119 * @param stylesheet - optional string naming a builtin icon
120 * stylesheet, for example 'menuItem' or `statusBar`. Can also be an
121 * object defining a custom icon stylesheet, or a list of builtin
122 * stylesheet names and/or custom stylesheet objects. If array,
123 * the given stylesheets will be merged.
124 *
125 * See @jupyterlab/ui-components/src/style/icon.ts for details
126 *
127 * @param elementPosition - optional position for the inner svg element
128 *
129 * @param elementSize - optional size for the inner svg element.
130 * Set to 'normal' to get a standard 16px x 16px icon
131 *
132 * @param ...elementCSS - all additional args are treated as
133 * overrides for the CSS props applied to the inner svg element
134 *
135 * @returns A DOM element that contains an (inline) svg element
136 * that displays an icon
137 */
138 element(props?: LabIcon.IProps): HTMLElement;
139 render(container: HTMLElement, options?: LabIcon.IRendererOptions): void;
140 protected get svgElement(): HTMLElement | null;
141 protected get svgInnerHTML(): string | null;
142 protected get svgReactAttrs(): any | null;
143 get svgstr(): string;
144 set svgstr(svgstr: string);
145 unrender?(container: HTMLElement, options?: LabIcon.IRendererOptions): void;
146 protected _initReact(displayName: string): React.ForwardRefExoticComponent<LabIcon.IProps & React.RefAttributes<SVGElement>>;
147 protected _initRender({ render, unrender }: Partial<VirtualElement.IRenderer>): void;
148 protected _initSvg({ title, uuid }?: {
149 title?: string;
150 uuid?: string;
151 }): HTMLElement | null;
152 readonly name: string;
153 /**
154 * A React component that will create the icon.
155 *
156 * @param className - a string that will be used as the class
157 * of the container element. Overrides any existing class
158 *
159 * @param container - a preexisting DOM element that
160 * will be used as the container for the svg element
161 *
162 * @param label - text that will be displayed adjacent
163 * to the icon
164 *
165 * @param title - a tooltip for the icon
166 *
167 * @param tag - if container is not explicitly
168 * provided, this tag will be used when creating the container
169 *
170 * @param stylesheet - optional string naming a builtin icon
171 * stylesheet, for example 'menuItem' or `statusBar`. Can also be an
172 * object defining a custom icon stylesheet, or a list of builtin
173 * stylesheet names and/or custom stylesheet objects. If array,
174 * the given stylesheets will be merged.
175 *
176 * See @jupyterlab/ui-components/src/style/icon.ts for details
177 *
178 * @param elementPosition - optional position for the inner svg element
179 *
180 * @param elementSize - optional size for the inner svg element.
181 * Set to 'normal' to get a standard 16px x 16px icon
182 *
183 * @param ...elementCSS - all additional args are treated as
184 * overrides for the CSS props applied to the inner svg element
185 *
186 * @param ref - forwarded to the ref prop of the icon's svg element
187 */
188 readonly react: LabIcon.IReact;
189 protected _className: string;
190 protected _loading: boolean;
191 protected _props: LabIcon.IProps;
192 protected _svgReplaced: Signal<this, void>;
193 protected _svgstr: string;
194 protected _uuid: string;
195 /**
196 * Cache for svg parsing intermediates
197 * - undefined: the cache has not yet been populated
198 * - null: a valid, but empty, value
199 */
200 protected _svgElement: HTMLElement | null | undefined;
201 protected _svgInnerHTML: string | null | undefined;
202 protected _svgReactAttrs: any | null | undefined;
203}
204/**
205 * A namespace for LabIcon statics.
206 */
207export declare namespace LabIcon {
208 /** ***********
209 * interfaces *
210 *************/
211 /**
212 * The simplest possible interface for defining a generic icon.
213 */
214 interface IIcon extends IRenderMime.LabIcon.IIcon {
215 }
216 interface IRendererOptions {
217 attrs?: ElementAttrs;
218 children?: ReadonlyArray<VirtualNode>;
219 props?: IProps;
220 }
221 /**
222 * The ILabIcon interface. Outside of this interface the actual
223 * implementation of LabIcon may vary
224 */
225 interface ILabIcon extends IIcon, VirtualElement.IRenderer {
226 }
227 /**
228 * Interface defining the parameters to be passed to the LabIcon
229 * constructor
230 */
231 interface IOptions extends IIcon, Partial<VirtualElement.IRenderer> {
232 }
233 /**
234 * The input props for creating a new LabIcon
235 */
236 interface IProps extends LabIconStyle.IProps {
237 /**
238 * Extra classNames. Used in addition to the typestyle className to
239 * set the className of the icon's outermost container node
240 */
241 className?: string;
242 /**
243 * The icon's outermost node, which acts as a container for the actual
244 * svg node. If container is not supplied, it will be created
245 */
246 container?: HTMLElement;
247 /**
248 * Optional text label that will be added as a sibling to the icon's
249 * svg node
250 */
251 label?: string;
252 /**
253 * HTML element tag used to create the icon's outermost container node,
254 * if no container is passed in
255 *
256 * #### Notes
257 * If `null` is provided and no container is defined, the icon SVG will return directly
258 * ignoring all other attributes (label, title,...)
259 */
260 tag?: 'div' | 'span' | null;
261 /**
262 * Optional title that will be set on the icon's outermost container node
263 */
264 title?: string;
265 /**
266 * Optional slot property to specify the position of the icon in the template
267 */
268 slot?: string | null;
269 }
270 interface IResolverProps {
271 icon?: IMaybeResolvable;
272 iconClass?: string;
273 fallback?: LabIcon;
274 }
275 /** ******
276 * types *
277 *********/
278 /**
279 * A type that can be resolved to a LabIcon instance.
280 */
281 type IResolvable = IRenderMime.LabIcon.IResolvable;
282 /**
283 * A type that maybe can be resolved to a LabIcon instance.
284 */
285 type IMaybeResolvable = IResolvable | VirtualElement.IRenderer | undefined;
286 /**
287 * The type of the svg node ref that can be passed into icon React components
288 */
289 type IReactRef = React.RefObject<SVGElement>;
290 /**
291 * The properties that can be passed into the React component stored in
292 * the .react field of a LabIcon.
293 */
294 type IReactProps = IProps & React.RefAttributes<SVGElement>;
295 /**
296 * The complete type of the React component stored in the .react
297 * field of a LabIcon.
298 */
299 type IReact = React.ForwardRefExoticComponent<IReactProps>;
300}
301export declare const badIcon: LabIcon;
302export declare const blankIcon: LabIcon;