Update components

components/ember/src/component.ts

@@ -5,8 +5,8 @@ import { tracked } from '@glimmer/tracking';
 import type { IconifyIconName } from '@iconify/utils/lib/icon/name';
 import { stringToIcon } from '@iconify/utils/lib/icon/name';
 import { getIconData } from '@iconify/core/lib/storage/functions';
-import type { FullIconifyIcon } from '@iconify/utils/lib/icon';
+import type { FullIconifyIcon } from '@iconify/utils/lib/icon/defaults';
-import { fullIcon } from '@iconify/utils/lib/icon';
+import { defaultIconProps } from '@iconify/utils/lib/icon/defaults';
 
 // API
 import { loadIcon } from '@iconify/core/lib/api/icons';
@@ -68,7 +68,7 @@ export class IconifyIconComponent extends Component<IconifyIconProps> {
 			this._icon = null;
 
 			// Render object
-			return render(fullIcon(icon), this.args, '');
+			return render({ ...defaultIconProps, ...icon }, this.args, '');
 		}
 
 		// Already loaded

components/ember/src/iconify-icon.ts

@@ -2,7 +2,7 @@ import type { IconifyJSON, IconifyIcon } from '@iconify/types';
 
 // Core
 import type { IconifyIconName } from '@iconify/utils/lib/icon/name';
-import type { IconifyIconSize } from '@iconify/utils/lib/customisations';
+import type { IconifyIconSize } from '@iconify/utils/lib/customisations/defaults';
 import type { IconifyStorageFunctions } from '@iconify/core/lib/storage/functions';
 import {
 	iconExists,
@@ -64,7 +64,6 @@ import type {
 
 // Properties
 import type {
-	RawIconCustomisations,
 	IconifyIconOnLoad,
 	IconifyIconCustomisations,
 	IconifyIconProps,
@@ -111,7 +110,7 @@ export {
 };
 
 // Builder functions
-export { RawIconCustomisations, IconifyIconBuildResult };
+export { IconifyIconBuildResult };
 
 /* Browser cache */
 export { IconifyBrowserCacheType };

components/ember/src/props.ts

@@ -1,14 +1,21 @@
 import type { IconifyIcon } from '@iconify/types';
-import type { IconifyIconCustomisations as RawIconCustomisations } from '@iconify/utils/lib/customisations';
+import type { IconifyIconCustomisations as RawIconifyIconCustomisations } from '@iconify/utils/lib/customisations/defaults';
+import { defaultIconCustomisations } from '@iconify/utils/lib/customisations/defaults';
 
-export { RawIconCustomisations };
-
-// Allow rotation to be string
 /**
  * Icon customisations
  */
-export type IconifyIconCustomisations = RawIconCustomisations & {
+export type IconifyIconCustomisations = RawIconifyIconCustomisations & {
+	// Allow rotation to be string
 	rotate?: string | number;
+
+	// Inline mode
+	inline?: boolean;
+};
+
+export const defaultExtendedIconCustomisations = {
+	...defaultIconCustomisations,
+	inline: false,
 };
 
 /**

components/ember/src/render.ts

@@ -1,16 +1,13 @@
 // @ts-ignore
 import { htmlSafe } from '@ember/template';
 import type { IconifyIcon } from '@iconify/types';
-import type { FullIconCustomisations } from '@iconify/utils/lib/customisations';
+import { mergeCustomisations } from '@iconify/utils/lib/customisations/merge';
-import {
-	defaults,
-	mergeCustomisations,
-} from '@iconify/utils/lib/customisations';
 import { flipFromString } from '@iconify/utils/lib/customisations/flip';
 import { rotateFromString } from '@iconify/utils/lib/customisations/rotate';
 import { iconToSVG } from '@iconify/utils/lib/svg/build';
 import { replaceIDs } from '@iconify/utils/lib/svg/id';
 import type { IconifyIconCustomisations, IconifyIconProps } from './props';
+import { defaultExtendedIconCustomisations } from './props';
 
 /**
  * Render result
@@ -39,9 +36,9 @@ export const render = (
 ): RenderResult => {
 	// Get all customisations
 	const customisations = mergeCustomisations(
-		defaults,
+		defaultExtendedIconCustomisations,
 		props as IconifyIconCustomisations
-	) as FullIconCustomisations;
+	);
 
 	// Create empty style
 	let style = '';
@@ -109,7 +106,7 @@ export const render = (
 	);
 
 	// Add inline
-	if (item.inline) {
+	if (customisations.inline) {
 		style += 'vertical-align: -0.125em;';
 	}
 

components/react/src/iconify.ts

@@ -4,7 +4,7 @@ import type { IconifyJSON, IconifyIcon } from '@iconify/types';
 // Core
 import type { IconifyIconName } from '@iconify/utils/lib/icon/name';
 import { stringToIcon } from '@iconify/utils/lib/icon/name';
-import type { IconifyIconSize } from '@iconify/utils/lib/customisations';
+import type { IconifyIconSize } from '@iconify/utils/lib/customisations/defaults';
 import type { IconifyStorageFunctions } from '@iconify/core/lib/storage/functions';
 import {
 	iconExists,
@@ -20,7 +20,7 @@ import { buildIcon } from '@iconify/core/lib/builder/functions';
 import { replaceIDs } from '@iconify/utils/lib/svg/id';
 import { calculateSize } from '@iconify/utils/lib/svg/size';
 import type { IconifyIconBuildResult } from '@iconify/utils/lib/svg/build';
-import { fullIcon } from '@iconify/utils/lib/icon';
+import { defaultIconProps } from '@iconify/utils/lib/icon/defaults';
 
 // API
 import type {
@@ -68,7 +68,6 @@ import type {
 
 // Properties
 import type {
-	RawIconCustomisations,
 	IconifyIconOnLoad,
 	IconifyIconCustomisations,
 	IconifyIconProps,
@@ -120,7 +119,7 @@ export {
 };
 
 // Builder functions
-export { RawIconCustomisations, IconifyIconBuildResult };
+export { IconifyIconBuildResult };
 
 /* Browser cache */
 export { IconifyBrowserCacheType };
@@ -293,7 +292,7 @@ class IconComponent extends React.Component<
 			if (changed || state.icon === null) {
 				// Set data if it was changed
 				this._setData({
-					data: fullIcon(icon),
+					data: { ...defaultIconProps, ...icon },
 				});
 			}
 			return;

components/react/src/offline.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import type { IconifyIcon, IconifyJSON } from '@iconify/types';
-import type { IconifyIconSize } from '@iconify/utils/lib/customisations';
+import type { IconifyIconSize } from '@iconify/utils/lib/customisations/defaults';
-import { fullIcon } from '@iconify/utils/lib/icon';
+import { defaultIconProps } from '@iconify/utils/lib/icon/defaults';
 import { parseIconSet } from '@iconify/utils/lib/icon-set/parse';
 import { quicklyValidateIconSet } from '@iconify/utils/lib/icon-set/validate-basic';
 import type {
@@ -41,7 +41,7 @@ function component(
 		typeof props.icon === 'string'
 			? storage[props.icon]
 			: typeof props.icon === 'object'
-			? fullIcon(props.icon)
+			? { ...defaultIconProps, ...props.icon }
 			: null;
 
 	// Validate icon object
@@ -89,7 +89,7 @@ export const InlineIcon = React.forwardRef<IconRef, IconProps>(
  * @param data
  */
 export function addIcon(name: string, data: IconifyIcon): void {
-	storage[name] = fullIcon(data);
+	storage[name] = { ...defaultIconProps, ...data };
 }
 
 /**

components/react/src/props.ts

@@ -1,8 +1,7 @@
 import type { SVGProps, RefAttributes } from 'react';
 import type { IconifyIcon } from '@iconify/types';
-import type { IconifyIconCustomisations as RawIconCustomisations } from '@iconify/utils/lib/customisations';
+import type { IconifyIconCustomisations as RawIconifyIconCustomisations } from '@iconify/utils/lib/customisations/defaults';
-
+import { defaultIconCustomisations } from '@iconify/utils/lib/customisations/defaults';
-export { RawIconCustomisations };
 
 /**
  * Icon render mode
@@ -14,15 +13,20 @@ export { RawIconCustomisations };
  */
 export type IconifyRenderMode = 'style' | 'bg' | 'mask' | 'svg';
 
-// Allow rotation to be string
 /**
  * Icon customisations
  */
-export type IconifyIconCustomisations = Omit<
+export type IconifyIconCustomisations = RawIconifyIconCustomisations & {
-	RawIconCustomisations,
+	// Allow rotation to be string
-	'rotate'
-> & {
 	rotate?: string | number;
+
+	// Inline mode
+	inline?: boolean;
+};
+
+export const defaultExtendedIconCustomisations = {
+	...defaultIconCustomisations,
+	inline: false,
 };
 
 /**

components/react/src/render.ts

@@ -1,18 +1,20 @@
 import React from 'react';
 import type { SVGProps } from 'react';
 import type { IconifyIcon } from '@iconify/types';
-import type { FullIconCustomisations } from '@iconify/utils/lib/customisations';
+import { mergeCustomisations } from '@iconify/utils/lib/customisations/merge';
-import {
-	defaults,
-	mergeCustomisations,
-} from '@iconify/utils/lib/customisations';
 import { flipFromString } from '@iconify/utils/lib/customisations/flip';
 import { rotateFromString } from '@iconify/utils/lib/customisations/rotate';
 import { iconToSVG } from '@iconify/utils/lib/svg/build';
 import { replaceIDs } from '@iconify/utils/lib/svg/id';
 import { iconToHTML } from '@iconify/utils/lib/svg/html';
 import { svgToURL } from '@iconify/utils/lib/svg/url';
-import type { IconifyRenderMode, IconProps, IconRef } from './props';
+import type {
+	IconifyIconCustomisations,
+	IconifyRenderMode,
+	IconProps,
+	IconRef,
+} from './props';
+import { defaultExtendedIconCustomisations } from './props';
 
 /**
  * Default SVG attributes
@@ -60,7 +62,10 @@ for (const prefix in propsToAddTo) {
 /**
  * Default values for customisations for inline icon
  */
-const inlineDefaults: FullIconCustomisations = { ...defaults, inline: true };
+const inlineDefaults: Required<IconifyIconCustomisations> = {
+	...defaultExtendedIconCustomisations,
+	inline: true,
+};
 
 /**
  * Fix size: add 'px' to numbers
@@ -86,13 +91,12 @@ export const render = (
 	ref?: IconRef
 ): JSX.Element => {
 	// Get default properties
-	const defaultProps = inline ? inlineDefaults : defaults;
+	const defaultProps = inline
+		? inlineDefaults
+		: defaultExtendedIconCustomisations;
 
 	// Get all customisations
-	const customisations = mergeCustomisations(
+	const customisations = mergeCustomisations(defaultProps, props);
-		defaultProps,
-		props as FullIconCustomisations
-	);
 
 	// Check mode
 	const mode: IconifyRenderMode = props.mode || 'svg';
@@ -174,7 +178,7 @@ export const render = (
 	const renderAttribs = item.attributes;
 
 	// Inline display
-	if (item.inline) {
+	if (customisations.inline) {
 		style.verticalAlign = '-0.125em';
 	}
 

components/svelte/src/functions.ts

@@ -3,7 +3,7 @@ import type { IconifyJSON, IconifyIcon } from '@iconify/types';
 // Core
 import type { IconifyIconName } from '@iconify/utils/lib/icon/name';
 import { stringToIcon } from '@iconify/utils/lib/icon/name';
-import type { IconifyIconSize } from '@iconify/utils/lib/customisations';
+import type { IconifyIconSize } from '@iconify/utils/lib/customisations/defaults';
 import type { IconifyStorageFunctions } from '@iconify/core/lib/storage/functions';
 import {
 	iconExists,
@@ -19,7 +19,7 @@ import { buildIcon } from '@iconify/core/lib/builder/functions';
 import { replaceIDs } from '@iconify/utils/lib/svg/id';
 import { calculateSize } from '@iconify/utils/lib/svg/size';
 import type { IconifyIconBuildResult } from '@iconify/utils/lib/svg/build';
-import { fullIcon } from '@iconify/utils/lib/icon';
+import { defaultIconProps } from '@iconify/utils/lib/icon/defaults';
 
 // API
 import type {
@@ -67,7 +67,6 @@ import type {
 
 // Properties
 import type {
-	RawIconCustomisations,
 	IconProps,
 	IconifyIconCustomisations,
 	IconifyIconProps,
@@ -117,7 +116,7 @@ export {
 };
 
 // Builder functions
-export { RawIconCustomisations, IconifyIconBuildResult };
+export { IconifyIconBuildResult };
 
 /* Browser cache */
 export { IconifyBrowserCacheType };
@@ -275,7 +274,7 @@ export function checkIconState(
 		// Stop loading
 		state.name = '';
 		abortLoading();
-		return { data: fullIcon(icon) };
+		return { data: { ...defaultIconProps, ...icon } };
 	}
 
 	// Invalid icon?

components/svelte/src/iconify.ts

@@ -37,7 +37,7 @@ export {
 } from './functions';
 
 // Builder functions
-export { RawIconCustomisations, IconifyIconBuildResult } from './functions';
+export { IconifyIconBuildResult } from './functions';
 
 // Browser cache
 export { IconifyBrowserCacheType } from './functions';

components/svelte/src/offline-functions.ts

@@ -1,5 +1,5 @@
 import type { IconifyIcon, IconifyJSON } from '@iconify/types';
-import { fullIcon } from '@iconify/utils/lib/icon';
+import { defaultIconProps } from '@iconify/utils/lib/icon/defaults';
 import { parseIconSet } from '@iconify/utils/lib/icon-set/parse';
 import { quicklyValidateIconSet } from '@iconify/utils/lib/icon-set/validate-basic';
 import { render } from './render';
@@ -20,7 +20,7 @@ export function generateIcon(props: IconProps): RenderResult | null {
 		typeof props.icon === 'string'
 			? storage[props.icon]
 			: typeof props.icon === 'object'
-			? fullIcon(props.icon)
+			? { ...defaultIconProps, ...props.icon }
 			: null;
 
 	// Validate icon object
@@ -42,7 +42,7 @@ export function generateIcon(props: IconProps): RenderResult | null {
  * @param data
  */
 export function addIcon(name: string, data: IconifyIcon): void {
-	storage[name] = fullIcon(data);
+	storage[name] = { ...defaultIconProps, ...data };
 }
 
 /**

components/svelte/src/offline-iconify.ts

@@ -1,6 +1,6 @@
 // Types
 export type { IconifyJSON, IconifyIcon } from '@iconify/types';
-export type { IconifyIconSize } from '@iconify/utils/lib/customisations';
+export type { IconifyIconSize } from '@iconify/utils/lib/customisations/defaults';
 
 // Types from props.ts
 export type {

components/svelte/src/props.ts

@@ -1,7 +1,6 @@
 import type { IconifyIcon } from '@iconify/types';
-import type { IconifyIconCustomisations as RawIconCustomisations } from '@iconify/utils/lib/customisations';
+import type { IconifyIconCustomisations as RawIconifyIconCustomisations } from '@iconify/utils/lib/customisations/defaults';
-
+import { defaultIconCustomisations } from '@iconify/utils/lib/customisations/defaults';
-export { RawIconCustomisations };
 
 /**
  * Icon render mode
@@ -13,12 +12,20 @@ export { RawIconCustomisations };
  */
 export type IconifyRenderMode = 'style' | 'bg' | 'mask' | 'svg';
 
-// Allow rotation to be string
 /**
  * Icon customisations
  */
-export type IconifyIconCustomisations = RawIconCustomisations & {
+export type IconifyIconCustomisations = RawIconifyIconCustomisations & {
+	// Allow rotation to be string
 	rotate?: string | number;
+
+	// Inline mode
+	inline?: boolean;
+};
+
+export const defaultExtendedIconCustomisations = {
+	...defaultIconCustomisations,
+	inline: false,
 };
 
 /**

components/svelte/src/render.ts

@@ -1,8 +1,5 @@
 import type { IconifyIcon } from '@iconify/types';
-import {
+import { mergeCustomisations } from '@iconify/utils/lib/customisations/merge';
-	defaults,
-	mergeCustomisations,
-} from '@iconify/utils/lib/customisations';
 import { flipFromString } from '@iconify/utils/lib/customisations/flip';
 import { rotateFromString } from '@iconify/utils/lib/customisations/rotate';
 import { iconToSVG } from '@iconify/utils/lib/svg/build';
@@ -10,6 +7,7 @@ import { replaceIDs } from '@iconify/utils/lib/svg/id';
 import { iconToHTML } from '@iconify/utils/lib/svg/html';
 import { svgToURL } from '@iconify/utils/lib/svg/url';
 import type { IconProps, IconifyRenderMode } from './props';
+import { defaultExtendedIconCustomisations } from './props';
 
 /**
  * Default SVG attributes
@@ -85,8 +83,8 @@ export function render(
 	props: IconProps
 ): RenderResult {
 	const customisations = mergeCustomisations(
-		defaults,
+		defaultExtendedIconCustomisations,
-		props as typeof defaults
+		props
 	);
 
 	// Check mode
@@ -163,7 +161,14 @@ export function render(
 					break;
 				}
 				// Copy missing property if it does not exist in customisations
-				if ((defaults as Record<string, unknown>)[key] === void 0) {
+				if (
+					(
+						defaultExtendedIconCustomisations as Record<
+							string,
+							unknown
+						>
+					)[key] === void 0
+				) {
 					componentProps[key] = value;
 				}
 		}
@@ -174,7 +179,7 @@ export function render(
 	const renderAttribs = item.attributes;
 
 	// Inline display
-	if (item.inline) {
+	if (customisations.inline) {
 		// Style overrides it
 		style = 'vertical-align: -0.125em; ' + style;
 	}

components/svg-framework/src/iconify.ts

@@ -71,7 +71,7 @@ import {
 } from './observer/index';
 import type {
 	IconifyRenderMode,
-	ExtendedIconifyIconCustomisations as IconifyIconCustomisations,
+	IconifyIconCustomisations,
 } from './scanner/config';
 
 /**

components/svg-framework/src/iconify.without-api.ts

@@ -27,7 +27,7 @@ import {
 } from './observer/index';
 import type {
 	IconifyRenderMode,
-	ExtendedIconifyIconCustomisations as IconifyIconCustomisations,
+	IconifyIconCustomisations,
 } from './scanner/config';
 
 /**

components/svg-framework/src/scanner/config.ts

@@ -1,14 +1,12 @@
 import type { IconifyIconName } from '@iconify/utils/lib/icon/name';
-import {
+import type { IconifyIconCustomisations as RawIconifyIconCustomisations } from '@iconify/utils/lib/customisations/defaults';
-	defaultIconCustomisations,
+import { defaultIconCustomisations } from '@iconify/utils/lib/customisations/defaults';
-	IconifyIconCustomisations,
-} from '@iconify/utils/lib/customisations/defaults';
 
 /**
  * Add inline to customisations
  */
-export interface ExtendedIconifyIconCustomisations
+export interface IconifyIconCustomisations
-	extends IconifyIconCustomisations {
+	extends RawIconifyIconCustomisations {
 	inline?: boolean;
 }
 
@@ -44,7 +42,7 @@ export interface IconifyElementProps {
 	icon: IconifyIconName;
 
 	// Customisations
-	customisations: Required<ExtendedIconifyIconCustomisations>;
+	customisations: Required<IconifyIconCustomisations>;
 
 	// Render mode
 	mode?: IconifyRenderMode;

components/svg-framework/src/scanner/get-props.ts

@@ -6,23 +6,17 @@ import {
 	IconifyRenderMode,
 	inlineClass,
 } from './config';
-import type {
+import type { IconifyElementProps, IconifyIconCustomisations } from './config';
-	IconifyElementProps,
-	ExtendedIconifyIconCustomisations,
-} from './config';
 
 /**
  * Size attributes
  */
-const sizeAttributes: (keyof ExtendedIconifyIconCustomisations)[] = [
+const sizeAttributes: (keyof IconifyIconCustomisations)[] = ['width', 'height'];
-	'width',
-	'height',
-];
 
 /**
  * Boolean attributes
  */
-const booleanAttributes: (keyof ExtendedIconifyIconCustomisations)[] = [
+const booleanAttributes: (keyof IconifyIconCustomisations)[] = [
 	'inline',
 	'hFlip',
 	'vFlip',

components/vue/src/iconify.ts

@@ -13,7 +13,7 @@ import type { IconifyJSON, IconifyIcon } from '@iconify/types';
 // Core
 import type { IconifyIconName } from '@iconify/utils/lib/icon/name';
 import { stringToIcon } from '@iconify/utils/lib/icon/name';
-import type { IconifyIconSize } from '@iconify/utils/lib/customisations';
+import type { IconifyIconSize } from '@iconify/utils/lib/customisations/defaults';
 import type { IconifyStorageFunctions } from '@iconify/core/lib/storage/functions';
 import {
 	iconExists,
@@ -29,7 +29,7 @@ import { buildIcon } from '@iconify/core/lib/builder/functions';
 import { replaceIDs } from '@iconify/utils/lib/svg/id';
 import { calculateSize } from '@iconify/utils/lib/svg/size';
 import type { IconifyIconBuildResult } from '@iconify/utils/lib/svg/build';
-import { fullIcon } from '@iconify/utils/lib/icon';
+import { defaultIconProps } from '@iconify/utils/lib/icon/defaults';
 
 // API
 import type {
@@ -77,7 +77,6 @@ import type {
 
 // Properties
 import type {
-	RawIconCustomisations,
 	IconifyIconOnLoad,
 	IconProps,
 	IconifyIconCustomisations,
@@ -128,7 +127,7 @@ export {
 };
 
 // Builder functions
-export { RawIconCustomisations, IconifyIconBuildResult };
+export { IconifyIconBuildResult };
 
 /* Browser cache */
 export { IconifyBrowserCacheType };
@@ -226,9 +225,10 @@ if (typeof document !== 'undefined' && typeof window !== 'undefined') {
 /**
  * Empty icon data, rendered when icon is not available
  */
-const emptyIcon = fullIcon({
+const emptyIcon = {
+	...defaultIconProps,
 	body: '',
-});
+};
 
 /**
  * Component
@@ -291,7 +291,7 @@ export const Icon = defineComponent({
 				this._name = '';
 				this.abortLoading();
 				return {
-					data: fullIcon(icon),
+					data: { ...defaultIconProps, ...icon },
 				};
 			}
 

components/vue/src/offline.ts

@@ -9,8 +9,8 @@ import type {
 	ComponentCustomProps,
 } from 'vue';
 import type { IconifyIcon, IconifyJSON } from '@iconify/types';
-import type { IconifyIconSize } from '@iconify/utils/lib/customisations';
+import type { IconifyIconSize } from '@iconify/utils/lib/customisations/defaults';
-import { fullIcon } from '@iconify/utils/lib/icon';
+import { defaultIconProps } from '@iconify/utils/lib/icon/defaults';
 import { parseIconSet } from '@iconify/utils/lib/icon-set/parse';
 import { quicklyValidateIconSet } from '@iconify/utils/lib/icon-set/validate-basic';
 import type {
@@ -43,7 +43,7 @@ const storage: Record<string, Required<IconifyIcon>> = Object.create(null);
  * @param data
  */
 export function addIcon(name: string, data: IconifyIcon): void {
-	storage[name] = fullIcon(data);
+	storage[name] = { ...defaultIconProps, ...data };
 }
 
 /**
@@ -86,7 +86,7 @@ export const Icon = defineComponent({
 			typeof props.icon === 'string'
 				? storage[props.icon]
 				: typeof props.icon === 'object'
-				? fullIcon(props.icon)
+				? { ...defaultIconProps, ...props.icon }
 				: null;
 
 		// Validate icon object

components/vue/src/props.ts

@@ -1,7 +1,6 @@
 import type { IconifyIcon } from '@iconify/types';
-import type { IconifyIconCustomisations as RawIconCustomisations } from '@iconify/utils/lib/customisations';
+import type { IconifyIconCustomisations as RawIconifyIconCustomisations } from '@iconify/utils/lib/customisations/defaults';
-
+import { defaultIconCustomisations } from '@iconify/utils/lib/customisations/defaults';
-export { RawIconCustomisations };
 
 /**
  * Icon render mode
@@ -13,12 +12,20 @@ export { RawIconCustomisations };
  */
 export type IconifyRenderMode = 'style' | 'bg' | 'mask' | 'svg';
 
-// Allow rotation to be string
 /**
  * Icon customisations
  */
-export type IconifyIconCustomisations = RawIconCustomisations & {
+export type IconifyIconCustomisations = RawIconifyIconCustomisations & {
+	// Allow rotation to be string
 	rotate?: string | number;
+
+	// Inline mode
+	inline?: boolean;
+};
+
+export const defaultExtendedIconCustomisations = {
+	...defaultIconCustomisations,
+	inline: false,
 };
 
 /**

components/vue/src/render.ts

@@ -1,11 +1,7 @@
 import { h } from 'vue';
 import type { VNode } from 'vue';
 import type { IconifyIcon } from '@iconify/types';
-import type { FullIconCustomisations } from '@iconify/utils/lib/customisations';
+import { mergeCustomisations } from '@iconify/utils/lib/customisations/merge';
-import {
-	defaults,
-	mergeCustomisations,
-} from '@iconify/utils/lib/customisations';
 import { flipFromString } from '@iconify/utils/lib/customisations/flip';
 import { rotateFromString } from '@iconify/utils/lib/customisations/rotate';
 import { iconToSVG } from '@iconify/utils/lib/svg/build';
@@ -17,6 +13,7 @@ import type {
 	IconifyRenderMode,
 	IconProps,
 } from './props';
+import { defaultExtendedIconCustomisations } from './props';
 
 /**
  * Default SVG attributes
@@ -102,9 +99,9 @@ export const render = (
 ): VNode => {
 	// Split properties
 	const customisations = mergeCustomisations(
-		defaults,
+		defaultExtendedIconCustomisations,
-		props as IconifyIconCustomisations
+		props
-	) as FullIconCustomisations;
+	);
 	const componentProps = { ...svgDefaults };
 
 	// Check mode
@@ -177,7 +174,7 @@ export const render = (
 					if (value === true || value === 'true' || value === 1) {
 						customisations[alias] = true;
 					}
-				} else if (defaults[key] === void 0) {
+				} else if (defaultExtendedIconCustomisations[key] === void 0) {
 					// Copy missing property if it does not exist in customisations
 					componentProps[key] = value;
 				}
@@ -190,7 +187,7 @@ export const render = (
 	const renderAttribs = item.attributes;
 
 	// Inline display
-	if (item.inline) {
+	if (customisations.inline) {
 		style.verticalAlign = '-0.125em';
 	}
 

components/vue2/src/iconify.ts

@@ -6,7 +6,7 @@ import type { IconifyJSON, IconifyIcon } from '@iconify/types';
 // Core
 import type { IconifyIconName } from '@iconify/utils/lib/icon/name';
 import { stringToIcon } from '@iconify/utils/lib/icon/name';
-import type { IconifyIconSize } from '@iconify/utils/lib/customisations';
+import type { IconifyIconSize } from '@iconify/utils/lib/customisations/defaults';
 import type { IconifyStorageFunctions } from '@iconify/core/lib/storage/functions';
 import {
 	iconExists,
@@ -22,7 +22,7 @@ import { buildIcon } from '@iconify/core/lib/builder/functions';
 import { replaceIDs } from '@iconify/utils/lib/svg/id';
 import { calculateSize } from '@iconify/utils/lib/svg/size';
 import type { IconifyIconBuildResult } from '@iconify/utils/lib/svg/build';
-import { fullIcon } from '@iconify/utils/lib/icon';
+import { defaultIconProps } from '@iconify/utils/lib/icon/defaults';
 
 // API
 import type {
@@ -66,7 +66,6 @@ import type {
 
 // Properties
 import type {
-	RawIconCustomisations,
 	IconifyIconOnLoad,
 	IconProps,
 	IconifyIconCustomisations,
@@ -115,7 +114,7 @@ export {
 };
 
 // Builder functions
-export { RawIconCustomisations, IconifyIconBuildResult };
+export { IconifyIconBuildResult };
 
 /* Browser cache */
 export { IconifyBrowserCacheType };
@@ -213,9 +212,10 @@ if (typeof document !== 'undefined' && typeof window !== 'undefined') {
 /**
  * Empty icon data, rendered when icon is not available
  */
- const emptyIcon = fullIcon({
+const emptyIcon = {
+	...defaultIconProps,
 	body: '',
-});
+};
 
 /**
  * Component
@@ -275,7 +275,7 @@ export const Icon = Vue.extend({
 				this._name = '';
 				this.abortLoading();
 				return {
-					data: fullIcon(icon),
+					data: {...defaultIconProps, ...icon},
 				};
 			}
 

components/vue2/src/offline.ts

@@ -2,8 +2,8 @@ import Vue from 'vue';
 import type { CreateElement, VNode } from 'vue';
 import type { ExtendedVue } from 'vue/types/vue';
 import type { IconifyIcon, IconifyJSON } from '@iconify/types';
-import type { IconifyIconSize } from '@iconify/utils/lib/customisations';
+import type { IconifyIconSize } from '@iconify/utils/lib/customisations/defaults';
-import { fullIcon } from '@iconify/utils/lib/icon';
+import { defaultIconProps } from '@iconify/utils/lib/icon/defaults';
 import { parseIconSet } from '@iconify/utils/lib/icon-set/parse';
 import { quicklyValidateIconSet } from '@iconify/utils/lib/icon-set/validate-basic';
 import type {
@@ -39,7 +39,7 @@ const storage: Record<string, Required<IconifyIcon>> = Object.create(null);
  * @param data
  */
 export function addIcon(name: string, data: IconifyIcon): void {
-	storage[name] = fullIcon(data);
+	storage[name] = {...defaultIconProps, ...data};
 }
 
 /**
@@ -82,7 +82,7 @@ export const Icon = Vue.extend({
 			typeof props.icon === 'string'
 				? storage[props.icon]
 				: typeof props.icon === 'object'
-				? fullIcon(props.icon)
+				? {...defaultIconProps, ...props.icon}
 				: null;
 
 		// Validate icon object

components/vue2/src/props.ts

@@ -1,14 +1,21 @@
 import type { IconifyIcon } from '@iconify/types';
-import type { IconifyIconCustomisations as RawIconCustomisations } from '@iconify/utils/lib/customisations';
+import type { IconifyIconCustomisations as RawIconifyIconCustomisations } from '@iconify/utils/lib/customisations/defaults';
+import { defaultIconCustomisations } from '@iconify/utils/lib/customisations/defaults';
 
-export { RawIconCustomisations };
-
-// Allow rotation to be string
 /**
  * Icon customisations
  */
-export type IconifyIconCustomisations = RawIconCustomisations & {
+ export type IconifyIconCustomisations = RawIconifyIconCustomisations & {
+	// Allow rotation to be string
 	rotate?: string | number;
+
+	// Inline mode
+	inline?: boolean;
+};
+
+export const defaultExtendedIconCustomisations = {
+	...defaultIconCustomisations,
+	inline: false,
 };
 
 /**

components/vue2/src/render.ts

@@ -1,16 +1,15 @@
 import type _Vue from 'vue';
 import type { VNode, VNodeData, RenderContext } from 'vue';
 import type { IconifyIcon } from '@iconify/types';
-import type { FullIconCustomisations } from '@iconify/utils/lib/customisations';
 import {
-	defaults,
 	mergeCustomisations,
-} from '@iconify/utils/lib/customisations';
+} from '@iconify/utils/lib/customisations/merge';
 import { flipFromString } from '@iconify/utils/lib/customisations/flip';
 import { rotateFromString } from '@iconify/utils/lib/customisations/rotate';
 import { iconToSVG } from '@iconify/utils/lib/svg/build';
 import { replaceIDs } from '@iconify/utils/lib/svg/id';
 import type { IconifyIconCustomisations, IconProps } from './props';
+import { defaultExtendedIconCustomisations } from './props';
 
 /**
  * Default SVG attributes
@@ -56,9 +55,9 @@ export const render = (
 ): VNode => {
 	// Split properties
 	const customisations = mergeCustomisations(
-		defaults,
+		defaultExtendedIconCustomisations,
-		props as IconifyIconCustomisations
+		props
-	) as FullIconCustomisations;
+	);
 	const componentProps = { ...svgDefaults };
 
 	// Style in Vue 2 components is always passed to rendered component, so no point in parsing it
@@ -122,7 +121,7 @@ export const render = (
 					if (value === true || value === 'true' || value === 1) {
 						customisations[alias] = true;
 					}
-				} else if (defaults[key] === void 0) {
+				} else if (defaultExtendedIconCustomisations[key] === void 0) {
 					// Copy missing property if it does not exist in customisations
 					componentProps[key] = value;
 				}
@@ -137,7 +136,7 @@ export const render = (
 		componentProps[key] = item.attributes[key];
 	}
 
-	if (item.inline) {
+	if (customisations.inline) {
 		style.verticalAlign = '-0.125em';
 	}