|
@@ -24,10 +24,10 @@ const ICON_IMPORTS_TEMPLATE = `
|
|
|
import { JLIcon } from './jlicon';
|
|
|
|
|
|
// icon svg import statements
|
|
|
-{{iconImportStatements}}
|
|
|
+{{svgImportStatements}}
|
|
|
|
|
|
// JLIcon instance construction
|
|
|
-{{jliconConstruction}}
|
|
|
+{{jliconConstructions}}
|
|
|
`;
|
|
|
|
|
|
const ICON_CSS_CLASSES_TEMPLATE = `
|
|
@@ -358,47 +358,47 @@ export async function ensureUiComponents(
|
|
|
const pkgName = utils.stem(pkgPath);
|
|
|
let messages: string[] = [];
|
|
|
|
|
|
- const svgs = glob.sync(path.join(pkgPath, 'style/icons', '**/*.svg'));
|
|
|
+ const svgPaths = glob.sync(path.join(pkgPath, 'style/icons', '**/*.svg'));
|
|
|
|
|
|
/* support for glob import of icon svgs */
|
|
|
const iconSrcDir = path.join(pkgPath, 'src/icon');
|
|
|
|
|
|
// build the per-icon import code
|
|
|
- let _iconImportStatements: string[] = [];
|
|
|
- let _jliconConstruction: string[] = [];
|
|
|
- svgs.forEach(svg => {
|
|
|
- const name = utils.stem(svg);
|
|
|
- const svgpath = path
|
|
|
- .relative(iconSrcDir, svg)
|
|
|
+ let _svgImportStatements: string[] = [];
|
|
|
+ let _jliconConstructions: string[] = [];
|
|
|
+ svgPaths.forEach(svgPath => {
|
|
|
+ const svgName = utils.stem(svgPath);
|
|
|
+ const svgImportPath = path
|
|
|
+ .relative(iconSrcDir, svgPath)
|
|
|
.split(path.sep)
|
|
|
.join('/');
|
|
|
|
|
|
- const svgname = utils.camelCase(name) + 'Svg';
|
|
|
- const iconname = utils.camelCase(name) + 'Icon';
|
|
|
- const qualname = [pkgName, utils.stem(svg)].join(':');
|
|
|
+ const svgstrRef = utils.camelCase(svgName) + 'Svg';
|
|
|
+ const iconRef = utils.camelCase(svgName) + 'Icon';
|
|
|
+ const iconName = [pkgName, utils.stem(svgPath)].join(':');
|
|
|
|
|
|
if (dorequire) {
|
|
|
// load the icon svg using `require`
|
|
|
- _jliconConstruction.push(
|
|
|
- `export const ${iconname} = new JLIcon({ name: '${qualname}', svgstr: require('${svgpath}').default });`
|
|
|
+ _jliconConstructions.push(
|
|
|
+ `export const ${iconRef} = new JLIcon({ name: '${iconName}', svgstr: require('${svgImportPath}').default });`
|
|
|
);
|
|
|
} else {
|
|
|
// load the icon svg using `import`
|
|
|
- _iconImportStatements.push(`import ${svgname} from '${svgpath}';`);
|
|
|
+ _svgImportStatements.push(`import ${svgstrRef} from '${svgImportPath}';`);
|
|
|
|
|
|
- _jliconConstruction.push(
|
|
|
- `export const ${iconname} = new JLIcon({ name: '${qualname}', svgstr: ${svgname} });`
|
|
|
+ _jliconConstructions.push(
|
|
|
+ `export const ${iconRef} = new JLIcon({ name: '${iconName}', svgstr: ${svgstrRef} });`
|
|
|
);
|
|
|
}
|
|
|
});
|
|
|
- const iconImportStatements = _iconImportStatements.join('\n');
|
|
|
- const jliconConstruction = _jliconConstruction.join('\n');
|
|
|
+ const svgImportStatements = _svgImportStatements.join('\n');
|
|
|
+ const jliconConstructions = _jliconConstructions.join('\n');
|
|
|
|
|
|
// generate the actual contents of the iconImports file
|
|
|
const iconImportsPath = path.join(iconSrcDir, 'iconimports.ts');
|
|
|
const iconImportsContents = utils.fromTemplate(
|
|
|
HEADER_TEMPLATE + ICON_IMPORTS_TEMPLATE,
|
|
|
- { funcName, iconImportStatements, jliconConstruction }
|
|
|
+ { funcName, svgImportStatements, jliconConstructions }
|
|
|
);
|
|
|
messages.push(...ensureFile(iconImportsPath, iconImportsContents, false));
|
|
|
|
|
@@ -408,14 +408,14 @@ export async function ensureUiComponents(
|
|
|
// build the per-icon import code
|
|
|
let _iconCSSUrls: string[] = [];
|
|
|
let _iconCSSDeclarations: string[] = [];
|
|
|
- svgs.forEach(svg => {
|
|
|
- const name = utils.stem(svg);
|
|
|
- const urlName = 'jp-icon-' + name;
|
|
|
- const className = 'jp-' + utils.camelCase(name, true) + 'Icon';
|
|
|
+ svgPaths.forEach(svgPath => {
|
|
|
+ const svgName = utils.stem(svgPath);
|
|
|
+ const urlName = 'jp-icon-' + svgName;
|
|
|
+ const className = 'jp-' + utils.camelCase(svgName, true) + 'Icon';
|
|
|
|
|
|
_iconCSSUrls.push(
|
|
|
`--${urlName}: url('${path
|
|
|
- .relative(iconCSSDir, svg)
|
|
|
+ .relative(iconCSSDir, svgPath)
|
|
|
.split(path.sep)
|
|
|
.join('/')}');`
|
|
|
);
|