@deriv/quill-icons 2.13.0 → 2.14.0

package/dist/react/Illustration/DerivLightBchIcon.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import type { QuillIllustrationProps } from '../../types';
+declare const ForwardRef: React.ForwardRefExoticComponent<QuillIllustrationProps & React.RefAttributes<HTMLImageElement>>;
+export default ForwardRef;

package/dist/react/Illustration/DerivLightBchIcon.js

@@ -0,0 +1,6 @@
+import * as React from 'react';
+import { forwardRef } from 'react';
+import illustrationSrc from './assets/DerivLightBch.webp';
+const DerivLightBchIcon = ({ title, titleId, alt, ...props }, ref) => (React.createElement("img", { src: illustrationSrc, ref: ref, role: 'img', alt: alt ?? title ?? '', "aria-labelledby": titleId, ...props }));
+const ForwardRef = forwardRef(DerivLightBchIcon);
+export default ForwardRef;

package/dist/react/Illustration/DerivLightNearIcon.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import type { QuillIllustrationProps } from '../../types';
+declare const ForwardRef: React.ForwardRefExoticComponent<QuillIllustrationProps & React.RefAttributes<HTMLImageElement>>;
+export default ForwardRef;

package/dist/react/Illustration/DerivLightNearIcon.js

@@ -0,0 +1,6 @@
+import * as React from 'react';
+import { forwardRef } from 'react';
+import illustrationSrc from './assets/DerivLightNear.webp';
+const DerivLightNearIcon = ({ title, titleId, alt, ...props }, ref) => (React.createElement("img", { src: illustrationSrc, ref: ref, role: 'img', alt: alt ?? title ?? '', "aria-labelledby": titleId, ...props }));
+const ForwardRef = forwardRef(DerivLightNearIcon);
+export default ForwardRef;

package/dist/react/Illustration/DerivLightSuiIcon.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import type { QuillIllustrationProps } from '../../types';
+declare const ForwardRef: React.ForwardRefExoticComponent<QuillIllustrationProps & React.RefAttributes<HTMLImageElement>>;
+export default ForwardRef;

package/dist/react/Illustration/DerivLightSuiIcon.js

@@ -0,0 +1,6 @@
+import * as React from 'react';
+import { forwardRef } from 'react';
+import illustrationSrc from './assets/DerivLightSui.webp';
+const DerivLightSuiIcon = ({ title, titleId, alt, ...props }, ref) => (React.createElement("img", { src: illustrationSrc, ref: ref, role: 'img', alt: alt ?? title ?? '', "aria-labelledby": titleId, ...props }));
+const ForwardRef = forwardRef(DerivLightSuiIcon);
+export default ForwardRef;

package/dist/react/Illustration/DerivLightWbethIcon.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import type { QuillIllustrationProps } from '../../types';
+declare const ForwardRef: React.ForwardRefExoticComponent<QuillIllustrationProps & React.RefAttributes<HTMLImageElement>>;
+export default ForwardRef;

package/dist/react/Illustration/DerivLightWbethIcon.js

@@ -0,0 +1,6 @@
+import * as React from 'react';
+import { forwardRef } from 'react';
+import illustrationSrc from './assets/DerivLightWbeth.webp';
+const DerivLightWbethIcon = ({ title, titleId, alt, ...props }, ref) => (React.createElement("img", { src: illustrationSrc, ref: ref, role: 'img', alt: alt ?? title ?? '', "aria-labelledby": titleId, ...props }));
+const ForwardRef = forwardRef(DerivLightWbethIcon);
+export default ForwardRef;

package/dist/react/Illustration/index.d.ts

@@ -44,6 +44,7 @@ export { default as DerivLightAptosIcon } from './DerivLightAptosIcon';
 export { default as DerivLightAtomIcon } from './DerivLightAtomIcon';
 export { default as DerivLightAvaxIcon } from './DerivLightAvaxIcon';
 export { default as DerivLightBaseIcon } from './DerivLightBaseIcon';
+export { default as DerivLightBchIcon } from './DerivLightBchIcon';
 export { default as DerivLightBeFairIcon } from './DerivLightBeFairIcon';
 export { default as DerivLightBeTransparentIcon } from './DerivLightBeTransparentIcon';
 export { default as DerivLightBnbIcon } from './DerivLightBnbIcon';
@@ -189,6 +190,7 @@ export { default as DerivLightMyComputerIcon } from './DerivLightMyComputerIcon'
 export { default as DerivLightNakalaIcon } from './DerivLightNakalaIcon';
 export { default as DerivLightNameDobPoiIcon } from './DerivLightNameDobPoiIcon';
 export { default as DerivLightNamePoiIcon } from './DerivLightNamePoiIcon';
+export { default as DerivLightNearIcon } from './DerivLightNearIcon';
 export { default as DerivLightNegativeAnnouncementIcon } from './DerivLightNegativeAnnouncementIcon';
 export { default as DerivLightNewPromisingIcon } from './DerivLightNewPromisingIcon';
 export { default as DerivLightNimcSlipFrontKycIcon } from './DerivLightNimcSlipFrontKycIcon';
@@ -241,6 +243,7 @@ export { default as DerivLightSolIcon } from './DerivLightSolIcon';
 export { default as DerivLightSpreadRiskIcon } from './DerivLightSpreadRiskIcon';
 export { default as DerivLightStandardLinkCopyIcon } from './DerivLightStandardLinkCopyIcon';
 export { default as DerivLightSuccessBiometricsIcon } from './DerivLightSuccessBiometricsIcon';
+export { default as DerivLightSuiIcon } from './DerivLightSuiIcon';
 export { default as DerivLightSwapFreeIcon } from './DerivLightSwapFreeIcon';
 export { default as DerivLightTeamworkIcon } from './DerivLightTeamworkIcon';
 export { default as DerivLightTightSpreadsIcon } from './DerivLightTightSpreadsIcon';
@@ -297,6 +300,7 @@ export { default as DerivLightWalletMaintenanceIcon } from './DerivLightWalletMa
 export { default as DerivLightWalletSuccessIcon } from './DerivLightWalletSuccessIcon';
 export { default as DerivLightWalletTopUpIcon } from './DerivLightWalletTopUpIcon';
 export { default as DerivLightWalletUnavailableIcon } from './DerivLightWalletUnavailableIcon';
+export { default as DerivLightWbethIcon } from './DerivLightWbethIcon';
 export { default as DerivLightWbtcIcon } from './DerivLightWbtcIcon';
 export { default as DerivLightWithdrawalIcon } from './DerivLightWithdrawalIcon';
 export { default as DerivLightXlmIcon } from './DerivLightXlmIcon';

package/dist/react/Illustration/index.js

@@ -44,6 +44,7 @@ export { default as DerivLightAptosIcon } from './DerivLightAptosIcon';
 export { default as DerivLightAtomIcon } from './DerivLightAtomIcon';
 export { default as DerivLightAvaxIcon } from './DerivLightAvaxIcon';
 export { default as DerivLightBaseIcon } from './DerivLightBaseIcon';
+export { default as DerivLightBchIcon } from './DerivLightBchIcon';
 export { default as DerivLightBeFairIcon } from './DerivLightBeFairIcon';
 export { default as DerivLightBeTransparentIcon } from './DerivLightBeTransparentIcon';
 export { default as DerivLightBnbIcon } from './DerivLightBnbIcon';
@@ -189,6 +190,7 @@ export { default as DerivLightMyComputerIcon } from './DerivLightMyComputerIcon'
 export { default as DerivLightNakalaIcon } from './DerivLightNakalaIcon';
 export { default as DerivLightNameDobPoiIcon } from './DerivLightNameDobPoiIcon';
 export { default as DerivLightNamePoiIcon } from './DerivLightNamePoiIcon';
+export { default as DerivLightNearIcon } from './DerivLightNearIcon';
 export { default as DerivLightNegativeAnnouncementIcon } from './DerivLightNegativeAnnouncementIcon';
 export { default as DerivLightNewPromisingIcon } from './DerivLightNewPromisingIcon';
 export { default as DerivLightNimcSlipFrontKycIcon } from './DerivLightNimcSlipFrontKycIcon';
@@ -241,6 +243,7 @@ export { default as DerivLightSolIcon } from './DerivLightSolIcon';
 export { default as DerivLightSpreadRiskIcon } from './DerivLightSpreadRiskIcon';
 export { default as DerivLightStandardLinkCopyIcon } from './DerivLightStandardLinkCopyIcon';
 export { default as DerivLightSuccessBiometricsIcon } from './DerivLightSuccessBiometricsIcon';
+export { default as DerivLightSuiIcon } from './DerivLightSuiIcon';
 export { default as DerivLightSwapFreeIcon } from './DerivLightSwapFreeIcon';
 export { default as DerivLightTeamworkIcon } from './DerivLightTeamworkIcon';
 export { default as DerivLightTightSpreadsIcon } from './DerivLightTightSpreadsIcon';
@@ -297,6 +300,7 @@ export { default as DerivLightWalletMaintenanceIcon } from './DerivLightWalletMa
 export { default as DerivLightWalletSuccessIcon } from './DerivLightWalletSuccessIcon';
 export { default as DerivLightWalletTopUpIcon } from './DerivLightWalletTopUpIcon';
 export { default as DerivLightWalletUnavailableIcon } from './DerivLightWalletUnavailableIcon';
+export { default as DerivLightWbethIcon } from './DerivLightWbethIcon';
 export { default as DerivLightWbtcIcon } from './DerivLightWbtcIcon';
 export { default as DerivLightWithdrawalIcon } from './DerivLightWithdrawalIcon';
 export { default as DerivLightXlmIcon } from './DerivLightXlmIcon';

package/dist/react/allIconsNames.js

@@ -1745,6 +1745,10 @@ export const allIconsNames = [
                                 type: 'file',
                                 name: 'DerivLightBase.webp',
                             },
+                            {
+                                type: 'file',
+                                name: 'DerivLightBch.webp',
+                            },
                             {
                                 type: 'file',
                                 name: 'DerivLightBeFair.webp',
@@ -2325,6 +2329,10 @@ export const allIconsNames = [
                                 type: 'file',
                                 name: 'DerivLightNamePoi.webp',
                             },
+                            {
+                                type: 'file',
+                                name: 'DerivLightNear.webp',
+                            },
                             {
                                 type: 'file',
                                 name: 'DerivLightNegativeAnnouncement.webp',
@@ -2533,6 +2541,10 @@ export const allIconsNames = [
                                 type: 'file',
                                 name: 'DerivLightSuccessBiometrics.webp',
                             },
+                            {
+                                type: 'file',
+                                name: 'DerivLightSui.webp',
+                            },
                             {
                                 type: 'file',
                                 name: 'DerivLightSwapFree.webp',
@@ -2757,6 +2769,10 @@ export const allIconsNames = [
                                 type: 'file',
                                 name: 'DerivLightWalletUnavailable.webp',
                             },
+                            {
+                                type: 'file',
+                                name: 'DerivLightWbeth.webp',
+                            },
                             {
                                 type: 'file',
                                 name: 'DerivLightWbtc.webp',
@@ -2963,6 +2979,10 @@ export const allIconsNames = [
                         type: 'file',
                         name: 'DerivLightBaseIcon.tsx',
                     },
+                    {
+                        type: 'file',
+                        name: 'DerivLightBchIcon.tsx',
+                    },
                     {
                         type: 'file',
                         name: 'DerivLightBeFairIcon.tsx',
@@ -3543,6 +3563,10 @@ export const allIconsNames = [
                         type: 'file',
                         name: 'DerivLightNamePoiIcon.tsx',
                     },
+                    {
+                        type: 'file',
+                        name: 'DerivLightNearIcon.tsx',
+                    },
                     {
                         type: 'file',
                         name: 'DerivLightNegativeAnnouncementIcon.tsx',
@@ -3751,6 +3775,10 @@ export const allIconsNames = [
                         type: 'file',
                         name: 'DerivLightSuccessBiometricsIcon.tsx',
                     },
+                    {
+                        type: 'file',
+                        name: 'DerivLightSuiIcon.tsx',
+                    },
                     {
                         type: 'file',
                         name: 'DerivLightSwapFreeIcon.tsx',
@@ -3975,6 +4003,10 @@ export const allIconsNames = [
                         type: 'file',
                         name: 'DerivLightWalletUnavailableIcon.tsx',
                     },
+                    {
+                        type: 'file',
+                        name: 'DerivLightWbethIcon.tsx',
+                    },
                     {
                         type: 'file',
                         name: 'DerivLightWbtcIcon.tsx',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@deriv/quill-icons",
-  "version": "2.13.0",
+  "version": "2.14.0",
   "description": "This is the central repository for quill icons, exported from figma design file",
   "files": [
     "dist"
@@ -92,12 +92,13 @@
     "migrate:illustrations:png": "tsx ./scripts/migrate-illustrations-to-png.ts",
     "sync:illustration:components": "tsx ./scripts/sync-illustration-components.ts",
     "export:figma": "npm-run-all export:icons export:logos export:illustrations",
-    "rexport": "npm-run-all clean export:figma format",
+    "finalize:figma": "tsx ./scripts/finalize-figma-export.ts",
+    "rexport": "npm-run-all export:figma finalize:figma",
     "export:barrels": "barrelsby -c barrelsby.config.json",
-    "export": "npm-run-all clean export:figma allIconsNames export:barrels format",
+    "export": "npm-run-all export:figma finalize:figma",
     "clean:postBuild": "rimraf dist/types dist/index.d.ts dist/index.js",
     "build": "rimraf dist && node --max-old-space-size=8192 ./node_modules/typescript/bin/tsc -p tsconfig.json && tsx ./scripts/copy-illustration-assets.ts",
-    "rebuild": "npm-run-all clean export build",
+    "rebuild": "npm-run-all export build",
     "lint": "node --max-old-space-size=4096 ./node_modules/.bin/eslint . --cache",
     "lint:fix": "node --max-old-space-size=4096 ./node_modules/.bin/eslint . --cache --fix",
     "format": "prettier --write . --config ./.prettierrc",

package/readme.md

@@ -86,6 +86,7 @@ With [@figma-export](https://www.npmjs.com/package/@figma-export/cli) we export
 - [@figma-export/output-components-as-svgr](https://github.com/marcomontalbano/figma-exporter/blob/HEAD/packages/cli/packages/output-components-as-svgr):
   We use this to generate `React` Components based on `transformed (optimized) SVG` files. you can check them in `src/react` folder.
 - `npm run export:icons` and `npm run export:logos` use the SVG/SVGR outputters above — **all icon and logo categories remain SVG React components**.
+- `npm run export` pulls from Figma **without wiping** `src/react`, `svg`, or `webp`, then `finalize:figma` adds barrel/catalog entries only for new files and drops Logo copies of names that already exist under `PaymentMethods`. Unchanged icons stay out of the git diff / PR.
 - **Illustrations only (custom WebP pipeline)** — the `Illustration` category is excluded from `export:icons` and exported as **WebP** (Figma PNG → WebP via `sharp`), not SVG:
   - `npm run export:illustrations` — fetches PNG renders from Figma (`scripts/export-illustrations-png.ts`), converts to WebP, writes to `webp/Illustration/` and `src/react/Illustration/assets/`, and writes `<img>` React wrappers in `src/react/Illustration/`.
   - `npm run export:illustrations:3d` — re-exports account/currency 3D coin icons only (same 1× Figma source size as other illustrations).
@@ -136,7 +137,7 @@ import { DerivLightWalletIcon } from '@deriv/quill-icons/Illustration';
     npm run export
     ```
 
-    Icons and logos export as optimized SVG React components; illustrations export as WebP assets via `export:illustrations` (included in `export` / `rebuild`).
+    Icons and logos export as optimized SVG React components; illustrations export as WebP assets via `export:illustrations` (included in `export` / `rebuild`). Git only records **new or modified** icon files; existing icons that Figma did not change are left untouched.
 
 5.  **Build** (for local publish or linking):
 
@@ -188,7 +189,7 @@ In the Quill Design System, we utilise naming conventions to store and locate co
 
 ## Exporting New Icons
 
-To export new icons, run `npm run rebuild`. It will automatically export, optimize, and convert SVGs to React components. Afterward, just commit the changes and create a new PR.
+To export new icons, run `npm run export` (or `npm run rebuild` to also compile). Figma output is written in place, then `finalize:figma` updates barrels and `allIconsNames` incrementally. Commit the resulting diff — it should contain only new or actually changed icons, plus the barrel/catalog lines needed to export them. The GitHub `from-figma` workflow uses the same path and stages only `svg/`, `src/react/`, `webp/`, and `src/index.ts`.
 
 ## Build and Publish