diff --git a/packages/utils/package.json b/packages/utils/package.json index 53e0e3f..0afe291 100644 --- a/packages/utils/package.json +++ b/packages/utils/package.json @@ -3,7 +3,7 @@ "type": "module", "description": "Common functions for working with Iconify icon sets used by various packages.", "author": "Vjacheslav Trushkin", - "version": "2.1.23", + "version": "2.1.24", "license": "MIT", "bugs": "https://github.com/iconify/iconify/issues", "homepage": "https://iconify.design/docs/libraries/utils/", @@ -257,6 +257,11 @@ "require": "./lib/icon/name.cjs", "import": "./lib/icon/name.mjs" }, + "./lib/icon/square": { + "types": "./lib/icon/square.d.ts", + "require": "./lib/icon/square.cjs", + "import": "./lib/icon/square.mjs" + }, "./lib/icon/transformations": { "types": "./lib/icon/transformations.d.ts", "require": "./lib/icon/transformations.cjs", diff --git a/packages/utils/src/css/common.ts b/packages/utils/src/css/common.ts index e7b2bdc..5897bac 100644 --- a/packages/utils/src/css/common.ts +++ b/packages/utils/src/css/common.ts @@ -7,6 +7,7 @@ import type { IconCSSItemOptions, IconContentItemOptions, } from './types'; +import { makeIconSquare } from '../icon/square'; /** * Generates common CSS rules for multiple icons, rendered as background/mask @@ -64,14 +65,7 @@ export function generateItemCSSRules( if (icon.width !== icon.height) { if (options.forceSquare) { // Change viewBox - const max = Math.max(icon.width, icon.height); - icon = { - ...icon, - width: max, - height: max, - left: icon.left - (max - icon.width) / 2, - top: icon.top - (max - icon.height) / 2, - }; + icon = makeIconSquare(icon); } else { // Change width in result result['width'] = calculateSize('1em', icon.width / icon.height); diff --git a/packages/utils/src/icon/square.ts b/packages/utils/src/icon/square.ts new file mode 100644 index 0000000..6461a98 --- /dev/null +++ b/packages/utils/src/icon/square.ts @@ -0,0 +1,21 @@ +import type { IconifyIcon } from '@iconify/types'; + +/** + * Make icon square + */ +export function makeIconSquare( + icon: Required +): Required { + if (icon.width !== icon.height) { + // Change viewBox + const max = Math.max(icon.width, icon.height); + return { + ...icon, + width: max, + height: max, + left: icon.left - (max - icon.width) / 2, + top: icon.top - (max - icon.height) / 2, + }; + } + return icon; +} diff --git a/packages/utils/src/index.ts b/packages/utils/src/index.ts index 90e62aa..e8fb4cb 100644 --- a/packages/utils/src/index.ts +++ b/packages/utils/src/index.ts @@ -35,6 +35,7 @@ export type { PartialExtendedIconifyIcon, FullExtendedIconifyIcon, } from './icon/defaults'; +export { makeIconSquare } from './icon/square'; // Icon set functions export { getIconsTree } from './icon-set/tree';