agerix/iconify
2
0
Fork 0
mirror of https://github.com/iconify/iconify.git synced 2025-01-07 15:44:05 +00:00
Code Issues Releases Activity

Update SVG framework

Browse Source
This commit is contained in:
Vjacheslav Trushkin 2022-06-19 18:22:42 +03:00
parent c892879e90
commit 9ad23abd6a
16 changed files with 115 additions and 92 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
components/svg-framework/src/common.ts
View File

@ -1,10 +1,7 @@
import type { IconifyJSON } from '@iconify/types'; import type { IconifyJSON } from '@iconify/types';
import { stringToIcon } from '@iconify/utils/lib/icon/name'; import { stringToIcon } from '@iconify/utils/lib/icon/name';
import type { IconifyIconCustomisations } from '@iconify/utils/lib/customisations'; import type { IconifyIconCustomisations } from '@iconify/utils/lib/customisations/defaults';
import { import { mergeCustomisations } from '@iconify/utils/lib/customisations/merge';
defaults,
mergeCustomisations,
} from '@iconify/utils/lib/customisations';
import { import {
getIconData, getIconData,
addCollection, addCollection,
@ -15,6 +12,7 @@ import { initObserver } from './observer/index';
import { scanDOM, scanElement } from './scanner/index'; import { scanDOM, scanElement } from './scanner/index';
import { addBodyNode } from './observer/root'; import { addBodyNode } from './observer/root';
import { renderInlineSVG } from './render/svg'; import { renderInlineSVG } from './render/svg';
import { defaultExtendedIconCustomisations } from './scanner/config';
/** /**
* Generate icon * Generate icon
@ -45,8 +43,8 @@ function generateIcon(
// Clean up customisations // Clean up customisations
const changes = mergeCustomisations( const changes = mergeCustomisations(
defaults, defaultExtendedIconCustomisations,
typeof customisations === 'object' ? customisations : {} customisations || {}
); );
// Get data // Get data
@ -166,8 +164,8 @@ export function renderIcon(
// Clean up customisations // Clean up customisations
const changes = mergeCustomisations( const changes = mergeCustomisations(
defaults, defaultExtendedIconCustomisations,
typeof customisations === 'object' ? customisations : {} customisations || {}
); );
// Get data // Get data

10
components/svg-framework/src/iconify.ts
View File

@ -1,10 +1,7 @@
// Core // Core
import type { IconifyJSON, IconifyIcon } from '@iconify/types'; import type { IconifyJSON, IconifyIcon } from '@iconify/types';
import type { IconifyIconName } from '@iconify/utils/lib/icon/name'; import type { IconifyIconName } from '@iconify/utils/lib/icon/name';
import type { import type { IconifyIconSize } from '@iconify/utils/lib/customisations/defaults';
IconifyIconCustomisations,
IconifyIconSize,
} from '@iconify/utils/lib/customisations';
import type { IconifyIconBuildResult } from '@iconify/utils/lib/svg/build'; import type { IconifyIconBuildResult } from '@iconify/utils/lib/svg/build';
import type { IconifyStorageFunctions } from '@iconify/core/lib/storage/functions'; import type { IconifyStorageFunctions } from '@iconify/core/lib/storage/functions';
import { import {
@ -72,7 +69,10 @@ import {
pauseObserver, pauseObserver,
resumeObserver, resumeObserver,
} from './observer/index'; } from './observer/index';
import type { IconifyRenderMode } from './scanner/config'; import type {
IconifyRenderMode,
ExtendedIconifyIconCustomisations as IconifyIconCustomisations,
} from './scanner/config';
/** /**
* Export required types * Export required types

12
components/svg-framework/src/iconify.without-api.ts
View File

@ -1,10 +1,7 @@
// Core // Core
import type { IconifyJSON, IconifyIcon } from '@iconify/types'; import type { IconifyJSON, IconifyIcon } from '@iconify/types';
import type { IconifyIconName } from '@iconify/utils/lib/icon/name'; import type { IconifyIconName } from '@iconify/utils/lib/icon/name';
import type { import type { IconifyIconSize } from '@iconify/utils/lib/customisations/defaults';
IconifyIconCustomisations,
IconifyIconSize,
} from '@iconify/utils/lib/customisations';
import type { IconifyIconBuildResult } from '@iconify/utils/lib/svg/build'; import type { IconifyIconBuildResult } from '@iconify/utils/lib/svg/build';
import type { IconifyStorageFunctions } from '@iconify/core/lib/storage/functions'; import type { IconifyStorageFunctions } from '@iconify/core/lib/storage/functions';
import { import {
@ -28,7 +25,10 @@ import {
pauseObserver, pauseObserver,
resumeObserver, resumeObserver,
} from './observer/index'; } from './observer/index';
import type { IconifyRenderMode } from './scanner/config'; import type {
IconifyRenderMode,
ExtendedIconifyIconCustomisations as IconifyIconCustomisations,
} from './scanner/config';
/** /**
* Export required types * Export required types
@ -40,7 +40,7 @@ export { IconifyStorageFunctions, IconifyBuilderFunctions };
export { IconifyIcon, IconifyJSON, IconifyIconName }; export { IconifyIcon, IconifyJSON, IconifyIconName };
// Customisations // Customisations
export { IconifyIconCustomisations, IconifyIconSize, IconifyRenderMode }; export { IconifyIconSize, IconifyRenderMode, IconifyIconCustomisations };
// Build // Build
export { IconifyIconBuildResult }; export { IconifyIconBuildResult };

9
components/svg-framework/src/render/bg.ts
View File

@ -1,4 +1,4 @@
import type { FullIconifyIcon } from '@iconify/utils/lib/icon'; import type { FullIconifyIcon } from '@iconify/utils/lib/icon/defaults';
import { iconToSVG } from '@iconify/utils/lib/svg/build'; import { iconToSVG } from '@iconify/utils/lib/svg/build';
import { iconToHTML } from '@iconify/utils/lib/svg/html'; import { iconToHTML } from '@iconify/utils/lib/svg/html';
import { svgToURL } from '@iconify/utils/lib/svg/url'; import { svgToURL } from '@iconify/utils/lib/svg/url';
@ -58,9 +58,8 @@ export function renderBackground(
useMask: boolean useMask: boolean
): IconifyElement { ): IconifyElement {
// Generate data to render // Generate data to render
const renderData = iconToSVG(iconData, { const customisations = props.customisations;
...props.customisations, const renderData = iconToSVG(iconData, customisations);
});
const renderAttribs = renderData.attributes; const renderAttribs = renderData.attributes;
// Get old data // Get old data
@ -90,7 +89,7 @@ export function renderBackground(
...commonProps, ...commonProps,
...(useMask ? monotoneProps : coloredProps), ...(useMask ? monotoneProps : coloredProps),
}; };
if (renderData.inline) { if (customisations.inline) {
newStyles['vertical-align'] = '-0.125em'; newStyles['vertical-align'] = '-0.125em';
} }

7
components/svg-framework/src/render/svg.ts
View File

@ -1,4 +1,4 @@
import type { FullIconifyIcon } from '@iconify/utils/lib/icon'; import type { FullIconifyIcon } from '@iconify/utils/lib/icon/defaults';
import { iconToSVG } from '@iconify/utils/lib/svg/build'; import { iconToSVG } from '@iconify/utils/lib/svg/build';
import { replaceIDs } from '@iconify/utils/lib/svg/id'; import { replaceIDs } from '@iconify/utils/lib/svg/id';
import { iconToHTML } from '@iconify/utils/lib/svg/html'; import { iconToHTML } from '@iconify/utils/lib/svg/html';
@ -28,7 +28,8 @@ export function renderInlineSVG(
} }
// Generate data to render // Generate data to render
const renderData = iconToSVG(iconData, props.customisations); const customisations = props.customisations;
const renderData = iconToSVG(iconData, customisations);
// Get old data // Get old data
const oldData = element[elementDataProperty]; const oldData = element[elementDataProperty];
@ -66,7 +67,7 @@ export function renderInlineSVG(
// Update style // Update style
const addedStyles = applyStyle( const addedStyles = applyStyle(
svg, svg,
renderData.inline customisations.inline
? { ? {
'vertical-align': '-0.125em', 'vertical-align': '-0.125em',
} }

8
components/svg-framework/src/scanner/compare.ts
View File

@ -1,5 +1,7 @@
import type { IconifyElementProps } from './config'; import {
import { defaults } from '@iconify/utils/lib/customisations'; defaultExtendedIconCustomisations,
IconifyElementProps,
} from './config';
/** /**
* Compare props * Compare props
@ -14,7 +16,7 @@ export function propsChanged(
const customisations1 = props1.customisations; const customisations1 = props1.customisations;
const customisations2 = props2.customisations; const customisations2 = props2.customisations;
for (const key in defaults) { for (const key in defaultExtendedIconCustomisations) {
if (customisations1[key] !== customisations2[key]) { if (customisations1[key] !== customisations2[key]) {
return true; return true;
} }

20
components/svg-framework/src/scanner/config.ts
View File

@ -1,5 +1,21 @@
import type { IconifyIconName } from '@iconify/utils/lib/icon/name'; import type { IconifyIconName } from '@iconify/utils/lib/icon/name';
import type { IconifyIconCustomisations } from '@iconify/utils/lib/customisations'; import {
defaultIconCustomisations,
IconifyIconCustomisations,
} from '@iconify/utils/lib/customisations/defaults';
/**
* Add inline to customisations
*/
export interface ExtendedIconifyIconCustomisations
extends IconifyIconCustomisations {
inline?: boolean;
}
export const defaultExtendedIconCustomisations = {
...defaultIconCustomisations,
inline: false,
};
/** /**
* Class names * Class names
@ -28,7 +44,7 @@ export interface IconifyElementProps {
icon: IconifyIconName; icon: IconifyIconName;
// Customisations // Customisations
customisations: Required<IconifyIconCustomisations>; customisations: Required<ExtendedIconifyIconCustomisations>;
// Render mode // Render mode
mode?: IconifyRenderMode; mode?: IconifyRenderMode;

29
components/svg-framework/src/scanner/get-props.ts
View File

@ -1,20 +1,28 @@
import { stringToIcon } from '@iconify/utils/lib/icon/name'; import { stringToIcon } from '@iconify/utils/lib/icon/name';
import { defaults } from '@iconify/utils/lib/customisations';
import type { IconifyIconCustomisations } from '@iconify/utils/lib/customisations';
import { rotateFromString } from '@iconify/utils/lib/customisations/rotate'; import { rotateFromString } from '@iconify/utils/lib/customisations/rotate';
import { flipFromString } from '@iconify/utils/lib/customisations/flip'; import { flipFromString } from '@iconify/utils/lib/customisations/flip';
import { IconifyRenderMode, inlineClass } from './config'; import {
import type { IconifyElementProps } from './config'; defaultExtendedIconCustomisations,
IconifyRenderMode,
inlineClass,
} from './config';
import type {
IconifyElementProps,
ExtendedIconifyIconCustomisations,
} from './config';
/** /**
* Size attributes * Size attributes
*/ */
const sizeAttributes: (keyof IconifyIconCustomisations)[] = ['width', 'height']; const sizeAttributes: (keyof ExtendedIconifyIconCustomisations)[] = [
'width',
'height',
];
/** /**
* Boolean attributes * Boolean attributes
*/ */
const booleanAttributes: (keyof IconifyIconCustomisations)[] = [ const booleanAttributes: (keyof ExtendedIconifyIconCustomisations)[] = [
'inline', 'inline',
'hFlip', 'hFlip',
'vFlip', 'vFlip',
@ -44,15 +52,12 @@ export function getElementProps(element: Element): IconifyElementProps | null {
return null; return null;
} }
// Get defaults // Get defaults and inline
const customisations = { const customisations = {
...defaults, ...defaultExtendedIconCustomisations,
inline: element.classList && element.classList.contains(inlineClass),
}; };
// Get inline status
customisations.inline =
element.classList && element.classList.contains(inlineClass);
// Get dimensions // Get dimensions
sizeAttributes.forEach((attr) => { sizeAttributes.forEach((attr) => {
const value = element.getAttribute('data-' + attr); const value = element.getAttribute('data-' + attr);

2
components/svg-framework/src/scanner/index.ts
View File

@ -11,7 +11,7 @@ import {
} from './config'; } from './config';
import { scanRootNode } from './find'; import { scanRootNode } from './find';
import type { IconifyIconName } from '../iconify'; import type { IconifyIconName } from '../iconify';
import type { FullIconifyIcon } from '@iconify/utils/lib/icon'; import type { FullIconifyIcon } from '@iconify/utils/lib/icon/defaults';
import { import {
observe, observe,
pauseObservingNode, pauseObservingNode,

1
components/svg-framework/tests/changing-modes-test.ts
View File

@ -7,7 +7,6 @@ import {
resetState, resetState,
mockAPIData, mockAPIData,
awaitUntil, awaitUntil,
nextTick,
} from './helpers'; } from './helpers';
import { addBodyNode } from '../src/observer/root'; import { addBodyNode } from '../src/observer/root';
import { scanDOM } from '../src/scanner/index'; import { scanDOM } from '../src/scanner/index';

62
components/svg-framework/tests/element-props-test.ts
View File

@ -1,7 +1,7 @@
import { cleanupGlobals, setupDOM } from './helpers'; import { cleanupGlobals, setupDOM } from './helpers';
import { getElementProps } from '../src/scanner/get-props'; import { getElementProps } from '../src/scanner/get-props';
import { propsChanged } from '../src/scanner/compare'; import { propsChanged } from '../src/scanner/compare';
import { defaults } from '@iconify/utils/lib/customisations'; import { defaultExtendedIconCustomisations } from '../src/scanner/config';
describe('Testing element properties', () => { describe('Testing element properties', () => {
beforeEach(() => { beforeEach(() => {
@ -25,7 +25,7 @@ describe('Testing element properties', () => {
name: 'home', name: 'home',
}, },
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
}, },
// Value is null because that is what getAttribute() returns, but type and value are not // Value is null because that is what getAttribute() returns, but type and value are not
// checked because it does not actually matter. In render it compares to string, any other // checked because it does not actually matter. In render it compares to string, any other
@ -44,7 +44,7 @@ describe('Testing element properties', () => {
name: 'icon-name', name: 'icon-name',
}, },
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
}, },
mode: null, mode: null,
}); });
@ -61,7 +61,7 @@ describe('Testing element properties', () => {
name: 'home', name: 'home',
}, },
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
}, },
mode: null, mode: null,
}); });
@ -91,7 +91,7 @@ describe('Testing element properties', () => {
name, name,
icon, icon,
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
inline: false, inline: false,
}, },
mode: null, mode: null,
@ -104,7 +104,7 @@ describe('Testing element properties', () => {
name, name,
icon, icon,
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
inline: true, inline: true,
}, },
mode: null, mode: null,
@ -118,7 +118,7 @@ describe('Testing element properties', () => {
name, name,
icon, icon,
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
inline: false, inline: false,
}, },
mode: null, mode: null,
@ -133,7 +133,7 @@ describe('Testing element properties', () => {
name, name,
icon, icon,
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
inline: true, inline: true,
}, },
mode: null, mode: null,
@ -147,7 +147,7 @@ describe('Testing element properties', () => {
name, name,
icon, icon,
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
inline: false, inline: false,
}, },
mode: null, mode: null,
@ -160,7 +160,7 @@ describe('Testing element properties', () => {
name, name,
icon, icon,
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
inline: true, inline: true,
}, },
mode: null, mode: null,
@ -173,7 +173,7 @@ describe('Testing element properties', () => {
name, name,
icon, icon,
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
inline: false, inline: false,
}, },
mode: null, mode: null,
@ -197,7 +197,7 @@ describe('Testing element properties', () => {
name, name,
icon, icon,
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
width: null, width: null,
height: null, height: null,
}, },
@ -210,7 +210,7 @@ describe('Testing element properties', () => {
name, name,
icon, icon,
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
width: '200', width: '200',
height: null, height: null,
}, },
@ -223,7 +223,7 @@ describe('Testing element properties', () => {
name, name,
icon, icon,
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
width: '200', width: '200',
height: '1em', height: '1em',
}, },
@ -236,7 +236,7 @@ describe('Testing element properties', () => {
name, name,
icon, icon,
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
width: null, width: null,
height: '1em', height: '1em',
}, },
@ -261,7 +261,7 @@ describe('Testing element properties', () => {
name, name,
icon, icon,
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
rotate: 0, rotate: 0,
}, },
mode: null, mode: null,
@ -273,7 +273,7 @@ describe('Testing element properties', () => {
name, name,
icon, icon,
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
rotate: 1, rotate: 1,
}, },
mode: null, mode: null,
@ -285,7 +285,7 @@ describe('Testing element properties', () => {
name, name,
icon, icon,
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
rotate: 2, rotate: 2,
}, },
mode: null, mode: null,
@ -297,7 +297,7 @@ describe('Testing element properties', () => {
name, name,
icon, icon,
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
rotate: 3, rotate: 3,
}, },
mode: null, mode: null,
@ -309,7 +309,7 @@ describe('Testing element properties', () => {
name, name,
icon, icon,
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
rotate: 3, rotate: 3,
}, },
mode: null, mode: null,
@ -321,7 +321,7 @@ describe('Testing element properties', () => {
name, name,
icon, icon,
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
}, },
mode: null, mode: null,
}); });
@ -331,7 +331,7 @@ describe('Testing element properties', () => {
name, name,
icon, icon,
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
}, },
mode: null, mode: null,
}); });
@ -341,7 +341,7 @@ describe('Testing element properties', () => {
name, name,
icon, icon,
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
}, },
mode: null, mode: null,
}); });
@ -351,7 +351,7 @@ describe('Testing element properties', () => {
name, name,
icon, icon,
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
}, },
mode: null, mode: null,
}); });
@ -374,7 +374,7 @@ describe('Testing element properties', () => {
name, name,
icon, icon,
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
hFlip: false, hFlip: false,
vFlip: false, vFlip: false,
}, },
@ -387,7 +387,7 @@ describe('Testing element properties', () => {
name, name,
icon, icon,
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
hFlip: true, hFlip: true,
}, },
mode: null, mode: null,
@ -399,7 +399,7 @@ describe('Testing element properties', () => {
name, name,
icon, icon,
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
hFlip: true, hFlip: true,
vFlip: true, vFlip: true,
}, },
@ -413,7 +413,7 @@ describe('Testing element properties', () => {
name, name,
icon, icon,
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
vFlip: true, vFlip: true,
}, },
mode: null, mode: null,
@ -426,7 +426,7 @@ describe('Testing element properties', () => {
name, name,
icon, icon,
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
}, },
mode: null, mode: null,
}); });
@ -438,7 +438,7 @@ describe('Testing element properties', () => {
name, name,
icon, icon,
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
hFlip: true, hFlip: true,
vFlip: true, vFlip: true,
}, },
@ -452,7 +452,7 @@ describe('Testing element properties', () => {
name, name,
icon, icon,
customisations: { customisations: {
...defaults, ...defaultExtendedIconCustomisations,
}, },
mode: null, mode: null,
}); });

4
components/svg-framework/tests/mock-api-test.ts
View File

@ -1,6 +1,6 @@
import { iconExists } from '@iconify/core/lib/storage/functions'; import { iconExists } from '@iconify/core/lib/storage/functions';
import { loadIcon } from '@iconify/core/lib/api/icons'; import { loadIcon } from '@iconify/core/lib/api/icons';
import { iconDefaults } from '@iconify/utils/lib/icon'; import { defaultIconProps } from '@iconify/utils/lib/icon/defaults';
import { fakeAPI, nextPrefix, mockAPIData } from './helpers'; import { fakeAPI, nextPrefix, mockAPIData } from './helpers';
describe('Testing mock API', () => { describe('Testing mock API', () => {
@ -34,7 +34,7 @@ describe('Testing mock API', () => {
// Load icon // Load icon
const data = await loadIcon(iconName); const data = await loadIcon(iconName);
expect(data).toEqual({ expect(data).toEqual({
...iconDefaults, ...defaultIconProps,
body: '<g />', body: '<g />',
}); });
}); });

6
components/svg-framework/tests/re-render-node-test.ts
View File

@ -1,8 +1,8 @@
import { iconDefaults } from '@iconify/utils/lib/icon'; import { defaultIconProps } from '@iconify/utils/lib/icon/defaults';
import { cleanupGlobals, setupDOM, waitDOMReady } from './helpers'; import { cleanupGlobals, setupDOM, waitDOMReady } from './helpers';
import { scanRootNode } from '../src/scanner/find'; import { scanRootNode } from '../src/scanner/find';
import { renderInlineSVG } from '../src/render/svg'; import { renderInlineSVG } from '../src/render/svg';
import type { IconifyIcon } from '@iconify/utils/lib/icon'; import type { IconifyIcon } from '@iconify/utils/lib/icon/defaults';
import { elementDataProperty, IconifyElement } from '../src/scanner/config'; import { elementDataProperty, IconifyElement } from '../src/scanner/config';
describe('Testing re-rendering nodes', () => { describe('Testing re-rendering nodes', () => {
@ -33,7 +33,7 @@ describe('Testing re-rendering nodes', () => {
// Get node and render it // Get node and render it
const { node, props } = items[0]; const { node, props } = items[0];
const svg = renderInlineSVG(node, props, { const svg = renderInlineSVG(node, props, {
...iconDefaults, ...defaultIconProps,
...data, ...data,
}); });

6
components/svg-framework/tests/render-bg-test.ts
View File

@ -1,8 +1,8 @@
import { iconDefaults } from '@iconify/utils/lib/icon'; import { defaultIconProps } from '@iconify/utils/lib/icon/defaults';
import { cleanupGlobals, setupDOM, waitDOMReady } from './helpers'; import { cleanupGlobals, setupDOM, waitDOMReady } from './helpers';
import { scanRootNode } from '../src/scanner/find'; import { scanRootNode } from '../src/scanner/find';
import { renderBackground } from '../src/render/bg'; import { renderBackground } from '../src/render/bg';
import type { IconifyIcon } from '@iconify/utils/lib/icon'; import type { IconifyIcon } from '@iconify/utils/lib/icon/defaults';
import { elementDataProperty, IconifyElement } from '../src/scanner/config'; import { elementDataProperty, IconifyElement } from '../src/scanner/config';
describe('Testing rendering nodes as background', () => { describe('Testing rendering nodes as background', () => {
@ -40,7 +40,7 @@ describe('Testing rendering nodes as background', () => {
node, node,
props, props,
{ {
...iconDefaults, ...defaultIconProps,
...data, ...data,
}, },
data.body.indexOf('currentColor') !== -1 data.body.indexOf('currentColor') !== -1

9
components/svg-framework/tests/render-node-test.ts
View File

@ -1,8 +1,8 @@
import { iconDefaults } from '@iconify/utils/lib/icon'; import { defaultIconProps } from '@iconify/utils/lib/icon/defaults';
import { cleanupGlobals, setupDOM, waitDOMReady } from './helpers'; import { cleanupGlobals, setupDOM, waitDOMReady } from './helpers';
import { scanRootNode } from '../src/scanner/find'; import { scanRootNode } from '../src/scanner/find';
import { renderInlineSVG } from '../src/render/svg'; import { renderInlineSVG } from '../src/render/svg';
import type { IconifyIcon } from '@iconify/utils/lib/icon'; import type { IconifyIcon } from '@iconify/utils/lib/icon/defaults';
import { elementDataProperty, IconifyElement } from '../src/scanner/config'; import { elementDataProperty, IconifyElement } from '../src/scanner/config';
describe('Testing rendering nodes', () => { describe('Testing rendering nodes', () => {
@ -25,7 +25,10 @@ describe('Testing rendering nodes', () => {
// Get node and render it // Get node and render it
const { node, props } = items[0]; const { node, props } = items[0];
const svg = renderInlineSVG(node, props, { ...iconDefaults, ...data }); const svg = renderInlineSVG(node, props, {
...defaultIconProps,
...data,
});
// Find SVG in DOM // Find SVG in DOM
expect(root.childNodes.length).toBe(1); expect(root.childNodes.length).toBe(1);

6
packages/utils/src/customisations/merge.ts
View File

@ -9,10 +9,10 @@ import {
/** /**
* Convert IconifyIconCustomisations to FullIconCustomisations * Convert IconifyIconCustomisations to FullIconCustomisations
*/ */
export function mergeCustomisations( export function mergeCustomisations<T extends FullIconCustomisations>(
defaults: FullIconCustomisations, defaults: T,
item: IconifyIconCustomisations item: IconifyIconCustomisations
): FullIconCustomisations { ): T {
// Merge transformations // Merge transformations
const result = mergeIconTransformations(defaults, item); const result = mergeIconTransformations(defaults, item);