@dynamic-labs/iconic - npm Package Compare versions

Comparing version 0.0.5 to 0.1.0

dist/src/Iconic.d.ts

 import { type FC } from 'react';
-export type Iconic = FC<{
-    alt?: string;
-    width?: string | number;
-    height?: string | number;
-    className?: string;
-}>;
+export declare const ICONIC_SPRITE_URL: `https://iconic.dynamic-static-assets.com/icons/sprite.svg?v=${string}`;
+export type Iconic = FC<React.SVGProps<SVGSVGElement> & {
+    title?: string | undefined;
+}> & {
+    iconName: string;
+    link: () => HTMLLinkElement;
+    sourcePath: string;
+};
 export declare const createIconic: (props: {
@@ -9,0 +11,0 @@ sourcePath: string;

dist/src/Iconic.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.createIconic = void 0;
+exports.createIconic = exports.ICONIC_SPRITE_URL = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const CDN_BASE_URL = 'https://iconic.dynamic-static-assets.com';
+const package_json_1 = require("../package.json");
+exports.ICONIC_SPRITE_URL = `https://iconic.dynamic-static-assets.com/icons/sprite.svg?v=${package_json_1.version}`;
 const createIconic = (props) => {
     const Icon = Object.assign(Object.assign({}, props), { function: (props) => {
-            return ((0, jsx_runtime_1.jsx)("img", Object.assign({ "data-testid": Icon.iconName, src: `${CDN_BASE_URL}${Icon.sourcePath}`, alt: Icon.alt }, props)));
+            const url = `${exports.ICONIC_SPRITE_URL}#${Icon.iconName}`;
+            return (0, jsx_runtime_1.jsx)("img", Object.assign({ "data-testid": `iconic-${Icon.iconName}`, src: url, alt: Icon.alt }, props));
         } });
-    return Icon.function.bind(Icon);
+    const IconicComponent = Icon.function.bind(Icon);
+    Object.assign(IconicComponent, { iconName: Icon.iconName, sourcePath: Icon.sourcePath });
+    return IconicComponent;
 };
 exports.createIconic = createIconic;

dist/src/icons/browsers/index.d.ts

@@ -1,1 +0,7 @@
-export * from './brave';
+import { type Iconic } from '../../Iconic';
+export declare const BraveIcon: Iconic;
+export declare const ChromeIcon: Iconic;
+export declare const EdgeIcon: Iconic;
+export declare const FirefoxIcon: Iconic;
+export declare const OperaIcon: Iconic;
+export declare const SafariIcon: Iconic;

dist/src/icons/browsers/index.js

 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./brave"), exports);
+exports.SafariIcon = exports.OperaIcon = exports.FirefoxIcon = exports.EdgeIcon = exports.ChromeIcon = exports.BraveIcon = void 0;
+const Iconic_1 = require("../../Iconic");
+exports.BraveIcon = (0, Iconic_1.createIconic)({
+    iconName: 'brave',
+    alt: 'Brave Browser',
+    sourcePath: 'icons/browsers/brave.svg'
+});
+exports.ChromeIcon = (0, Iconic_1.createIconic)({
+    iconName: 'chrome',
+    alt: 'Chrome Browser',
+    sourcePath: 'icons/browsers/chrome.svg'
+});
+exports.EdgeIcon = (0, Iconic_1.createIconic)({
+    iconName: 'edge',
+    alt: 'Edge Browser',
+    sourcePath: 'icons/browsers/edge.svg'
+});
+exports.FirefoxIcon = (0, Iconic_1.createIconic)({
+    iconName: 'firefox',
+    alt: 'Firefox Browser',
+    sourcePath: 'icons/browsers/firefox.svg'
+});
+exports.OperaIcon = (0, Iconic_1.createIconic)({
+    iconName: 'opera',
+    alt: 'Opera Browser',
+    sourcePath: 'icons/browsers/opera.svg'
+});
+exports.SafariIcon = (0, Iconic_1.createIconic)({
+    iconName: 'safari',
+    alt: 'Opera Browser',
+    sourcePath: 'icons/browsers/safari.svg'
+});

dist/src/icons/chains/index.d.ts

@@ -1,1 +0,8 @@
-export * from './arbitrum';
+import { type Iconic } from '../../Iconic';
+export declare const ArbitrumIcon: Iconic;
+export declare const AuroraIcon: Iconic;
+export declare const BnbIcon: Iconic;
+export declare const EthereumIcon: Iconic;
+export declare const OptimismIcon: Iconic;
+export declare const SolanaIcon: Iconic;
+export declare const StarknetIcon: Iconic;

dist/src/icons/chains/index.js

 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __exportStar = (this && this.__exportStar) || function(m, exports) {
-    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-__exportStar(require("./arbitrum"), exports);
+exports.StarknetIcon = exports.SolanaIcon = exports.OptimismIcon = exports.EthereumIcon = exports.BnbIcon = exports.AuroraIcon = exports.ArbitrumIcon = void 0;
+const Iconic_1 = require("../../Iconic");
+exports.ArbitrumIcon = (0, Iconic_1.createIconic)({
+    iconName: 'arbitrum',
+    alt: 'Arbitrum Chain',
+    sourcePath: 'icons/chains/arbitrum.svg'
+});
+exports.AuroraIcon = (0, Iconic_1.createIconic)({
+    iconName: 'aurora',
+    alt: 'Aurora Chain',
+    sourcePath: 'icons/chains/aurora.svg'
+});
+exports.BnbIcon = (0, Iconic_1.createIconic)({
+    iconName: 'bnb',
+    alt: 'BNB Chain',
+    sourcePath: 'icons/chains/bnb.svg'
+});
+exports.EthereumIcon = (0, Iconic_1.createIconic)({
+    iconName: 'ethereum',
+    alt: 'Ethereum Chain',
+    sourcePath: 'icons/chains/ethereum.svg'
+});
+exports.OptimismIcon = (0, Iconic_1.createIconic)({
+    iconName: 'optimism',
+    alt: 'Optimism Chain',
+    sourcePath: 'icons/chains/optimism.svg'
+});
+exports.SolanaIcon = (0, Iconic_1.createIconic)({
+    iconName: 'palm',
+    alt: 'Solana Chain',
+    sourcePath: 'icons/chains/solana.svg'
+});
+exports.StarknetIcon = (0, Iconic_1.createIconic)({
+    iconName: 'starknet',
+    alt: 'Starknet Chain',
+    sourcePath: 'icons/chains/starknet.svg'
+});

dist/src/icons/index.d.ts

 export * from './browsers';
 export * from './chains';
+export * from './wallets';
+export * from './mobile';
+export * from './social';

dist/src/icons/index.js

@@ -19,1 +19,4 @@ "use strict";
 __exportStar(require("./chains"), exports);
+__exportStar(require("./wallets"), exports);
+__exportStar(require("./mobile"), exports);
+__exportStar(require("./social"), exports);

dist/src/index.d.ts

 export * from './icons';
-export * from './Iconic';
+export { type Iconic, ICONIC_SPRITE_URL } from './Iconic';

dist/src/index.js

@@ -17,3 +17,5 @@ "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.ICONIC_SPRITE_URL = void 0;
 __exportStar(require("./icons"), exports);
-__exportStar(require("./Iconic"), exports);
+var Iconic_1 = require("./Iconic");
+Object.defineProperty(exports, "ICONIC_SPRITE_URL", { enumerable: true, get: function () { return Iconic_1.ICONIC_SPRITE_URL; } });

package.json

 {
   "name": "@dynamic-labs/iconic",
-  "version": "0.0.5",
+  "version": "0.1.0",
   "description": "A library of icons used by Dynamic Lab's SDK, served via CDN",
   "main": "dist/src/index.js",
   "scripts": {
-    "build": "rimraf dist build && tsc",
+    "build": "rimraf dist build && tsc && ts-node ./scripts/build-sprite.ts",
     "test": "jest",
@@ -30,2 +30,3 @@ "lint": "eslint .",
     "@types/react": "^18.0.27",
+    "@types/svg-sprite": "^0.0.34",
     "@types/svgo": "^3.0.0",
@@ -41,2 +42,3 @@ "@typescript-eslint/eslint-plugin": "^5.0.0",
     "eslint-plugin-react": "^7.32.2",
+    "fs-extra": "^11.1.0",
     "jest": "^29.4.2",
@@ -48,2 +50,3 @@ "jest-environment-jsdom": "^29.4.2",
     "rimraf": "^4.1.2",
+    "svg-sprite": "^2.0.2",
     "svgo": "^3.0.2",
@@ -50,0 +53,0 @@ "ts-jest": "^29.0.5",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

19341

increased by137.84%

Number of package files

20

increased by17.65%

Lines of code

381

increased by202.38%

Worsened metrics

Dev dependency count

29

increased by11.54%

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes