File tree Expand file tree Collapse file tree 2 files changed +24
-26
lines changed
Expand file tree Collapse file tree 2 files changed +24
-26
lines changed Original file line number Diff line number Diff line change 1+ // Convert the CSS class name of mdi icons to the JS name
2+ function mdiIconName ( str ) {
3+ // https://github.com/Templarian/MaterialDesign-JS/blob/master/build.js#L5
4+ let name = str . replace ( / ( - \w ) / g, ( matches ) => matches [ 1 ] . toUpperCase ( ) ) ;
5+ name = `${ name [ 0 ] . toUpperCase ( ) } ${ name . slice ( 1 ) } ` ;
6+ return `mdi${ name } ` ;
7+ }
8+
9+ let mdi ; // mdi iconSet
10+ export async function createMDIIcon ( iconName , iconSize ) {
11+ if ( ! mdi ) {
12+ mdi = await import ( '@mdi/js' )
13+ }
14+ const iconData = mdi [ mdiIconName ( iconName ) ] ;
15+ const icon = document . createElement ( "div" ) ;
16+ icon . style . verticalAlign = "bottom"
17+ icon . innerHTML = `
18+ <svg style='width:${ iconSize } px; height:${ iconSize } px' viewBox='0 0 24 24'>
19+ <path fill='currentColor', d='${ iconData } '/>
20+ <svg/>
21+ `
22+ return icon
23+ }
Original file line number Diff line number Diff line change 11import { CompositeDisposable } from 'atom' ;
22import { ToolBarItem } from './tool-bar-item' ;
3-
4-
5- // Convert the CSS class name of mdi icons to the JS name
6- function mdiIconName ( str ) {
7- // https://github.com/Templarian/MaterialDesign-JS/blob/master/build.js#L5
8- let name = str . replace ( / ( - \w ) / g, ( matches ) => matches [ 1 ] . toUpperCase ( ) ) ;
9- name = `${ name [ 0 ] . toUpperCase ( ) } ${ name . slice ( 1 ) } ` ;
10- return `mdi${ name } ` ;
11- }
12-
13- let mdi ; // mdi iconSet
14- async function createMDIIcon ( iconName , iconSize ) {
15- if ( ! mdi ) {
16- mdi = await import ( '@mdi/js' )
17- }
18- const iconData = mdi [ mdiIconName ( iconName ) ] ;
19- const icon = document . createElement ( "div" ) ;
20- icon . style . verticalAlign = "bottom"
21- icon . innerHTML = `
22- <svg style='width:${ iconSize } px; height:${ iconSize } px' viewBox='0 0 24 24'>
23- <path fill='currentColor', d='${ iconData } '/>
24- <svg/>
25- `
26- return icon
27- }
28-
3+ import { createMDIIcon } from '../icon-service' ;
294
305/**
316 * A button class with many options
You can’t perform that action at this time.
0 commit comments