@impulse-ui-native/icon 1.0.2 → 1.0.4

package/dist/index.cjs.js

@@ -25,26 +25,22 @@ __export(index_exports, {
 module.exports = __toCommonJS(index_exports);
 
 // src/components/icon.tsx
-var import_react_native_fontawesome = require("@fortawesome/react-native-fontawesome");
-var import_theme = require("@impulse-ui-native/theme");
 var import_react = require("react");
 var Icon = (0, import_react.memo)(function Icon2({
   size = "medium",
   icon,
-  children,
-  style,
   ...props
 }) {
-  const theme = (0, import_theme.useTheme)();
+  const Icon3 = icon;
   const iconSize = (0, import_react.useMemo)(
     () => ({
       small: 14,
       medium: 16,
       large: 16
     })[size],
-    [theme, size]
-  );
-  return /* @__PURE__ */ React.createElement(import_react_native_fontawesome.FontAwesomeIcon, { size: iconSize, icon, style, ...props });
+    [size]
+  ) ?? 16;
+  return /* @__PURE__ */ React.createElement(Icon3, { ...props, width: iconSize, height: iconSize, fill: props.color });
 });
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/index.cjs.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts","../src/components/icon.tsx"],"sourcesContent":["export * from \"./components\";\r\nexport * from \"./types\";\r\n","import { FontAwesomeIcon } from \"@fortawesome/react-native-fontawesome\";\r\nimport { useTheme } from \"@impulse-ui-native/theme\";\r\nimport { memo, PropsWithChildren, useMemo } from \"react\";\r\nimport { IconProps } from \"../types\";\r\n\r\nexport const Icon = memo(function Icon({\r\n  size = \"medium\",\r\n  icon,\r\n  children,\r\n  style,\r\n  ...props\r\n}: PropsWithChildren<IconProps>) {\r\n  const theme = useTheme();\r\n  const iconSize = useMemo(\r\n    () =>\r\n      ({\r\n        small: 14,\r\n        medium: 16,\r\n        large: 16,\r\n      }[size]),\r\n    [theme, size]\r\n  );\r\n\r\n  return (\r\n    <FontAwesomeIcon size={iconSize} icon={icon} style={style} {...props} />\r\n  );\r\n});\r\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,sCAAgC;AAChC,mBAAyB;AACzB,mBAAiD;AAG1C,IAAM,WAAO,mBAAK,SAASA,MAAK;AAAA,EACrC,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAiC;AAC/B,QAAM,YAAQ,uBAAS;AACvB,QAAM,eAAW;AAAA,IACf,OACG;AAAA,MACC,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,OAAO;AAAA,IACT,GAAE,IAAI;AAAA,IACR,CAAC,OAAO,IAAI;AAAA,EACd;AAEA,SACE,oCAAC,mDAAgB,MAAM,UAAU,MAAY,OAAe,GAAG,OAAO;AAE1E,CAAC;","names":["Icon"]}
+{"version":3,"sources":["../src/index.ts","../src/components/icon.tsx"],"sourcesContent":["export * from \"./components\";\r\nexport * from \"./types\";\r\n","import { memo, useMemo } from \"react\";\r\nimport { IconProps } from \"../types\";\r\n\r\nexport const Icon = memo(function Icon({\r\n  size = \"medium\",\r\n  icon,\r\n  ...props\r\n}: IconProps) {\r\n  const Icon = icon;\r\n\r\n  const iconSize =\r\n    useMemo(\r\n      () =>\r\n        ({\r\n          small: 14,\r\n          medium: 16,\r\n          large: 16,\r\n        }[size]),\r\n      [size]\r\n    ) ?? 16;\r\n\r\n  return (\r\n    <Icon {...props} width={iconSize} height={iconSize} fill={props.color} />\r\n  );\r\n});\r\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,mBAA8B;AAGvB,IAAM,WAAO,mBAAK,SAASA,MAAK;AAAA,EACrC,OAAO;AAAA,EACP;AAAA,EACA,GAAG;AACL,GAAc;AACZ,QAAMA,QAAO;AAEb,QAAM,eACJ;AAAA,IACE,OACG;AAAA,MACC,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,OAAO;AAAA,IACT,GAAE,IAAI;AAAA,IACR,CAAC,IAAI;AAAA,EACP,KAAK;AAEP,SACE,oCAACA,OAAA,EAAM,GAAG,OAAO,OAAO,UAAU,QAAQ,UAAU,MAAM,MAAM,OAAO;AAE3E,CAAC;","names":["Icon"]}

package/dist/index.d.mts

@@ -1,16 +1,16 @@
 import * as react from 'react';
-import { PropsWithChildren } from 'react';
-import { Props } from '@fortawesome/react-native-fontawesome';
+import { ComponentType } from 'react';
 import { ComponentSize } from '@impulse-ui-native/theme';
-import { ViewStyle } from 'react-native';
+import { SvgProps } from 'react-native-svg';
 
-interface IconStyle extends ViewStyle {
-    color?: string;
-}
-interface IconProps extends Omit<Props, "size"> {
+type IconStyle = SvgProps["style"];
+interface IconProps {
     size?: ComponentSize | number;
+    color?: string;
+    icon: ComponentType<SvgProps>;
+    style?: IconStyle;
 }
 
-declare const Icon: react.NamedExoticComponent<PropsWithChildren<IconProps>>;
+declare const Icon: react.NamedExoticComponent<IconProps>;
 
 export { Icon, type IconProps, type IconStyle };

package/dist/index.d.ts

@@ -1,16 +1,16 @@
 import * as react from 'react';
-import { PropsWithChildren } from 'react';
-import { Props } from '@fortawesome/react-native-fontawesome';
+import { ComponentType } from 'react';
 import { ComponentSize } from '@impulse-ui-native/theme';
-import { ViewStyle } from 'react-native';
+import { SvgProps } from 'react-native-svg';
 
-interface IconStyle extends ViewStyle {
-    color?: string;
-}
-interface IconProps extends Omit<Props, "size"> {
+type IconStyle = SvgProps["style"];
+interface IconProps {
     size?: ComponentSize | number;
+    color?: string;
+    icon: ComponentType<SvgProps>;
+    style?: IconStyle;
 }
 
-declare const Icon: react.NamedExoticComponent<PropsWithChildren<IconProps>>;
+declare const Icon: react.NamedExoticComponent<IconProps>;
 
 export { Icon, type IconProps, type IconStyle };

package/dist/index.esm.js

@@ -1,24 +1,20 @@
 // src/components/icon.tsx
-import { FontAwesomeIcon } from "@fortawesome/react-native-fontawesome";
-import { useTheme } from "@impulse-ui-native/theme";
 import { memo, useMemo } from "react";
 var Icon = memo(function Icon2({
   size = "medium",
   icon,
-  children,
-  style,
   ...props
 }) {
-  const theme = useTheme();
+  const Icon3 = icon;
   const iconSize = useMemo(
     () => ({
       small: 14,
       medium: 16,
       large: 16
     })[size],
-    [theme, size]
-  );
-  return /* @__PURE__ */ React.createElement(FontAwesomeIcon, { size: iconSize, icon, style, ...props });
+    [size]
+  ) ?? 16;
+  return /* @__PURE__ */ React.createElement(Icon3, { ...props, width: iconSize, height: iconSize, fill: props.color });
 });
 export {
   Icon

package/dist/index.esm.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/icon.tsx"],"sourcesContent":["import { FontAwesomeIcon } from \"@fortawesome/react-native-fontawesome\";\r\nimport { useTheme } from \"@impulse-ui-native/theme\";\r\nimport { memo, PropsWithChildren, useMemo } from \"react\";\r\nimport { IconProps } from \"../types\";\r\n\r\nexport const Icon = memo(function Icon({\r\n  size = \"medium\",\r\n  icon,\r\n  children,\r\n  style,\r\n  ...props\r\n}: PropsWithChildren<IconProps>) {\r\n  const theme = useTheme();\r\n  const iconSize = useMemo(\r\n    () =>\r\n      ({\r\n        small: 14,\r\n        medium: 16,\r\n        large: 16,\r\n      }[size]),\r\n    [theme, size]\r\n  );\r\n\r\n  return (\r\n    <FontAwesomeIcon size={iconSize} icon={icon} style={style} {...props} />\r\n  );\r\n});\r\n"],"mappings":";AAAA,SAAS,uBAAuB;AAChC,SAAS,gBAAgB;AACzB,SAAS,MAAyB,eAAe;AAG1C,IAAM,OAAO,KAAK,SAASA,MAAK;AAAA,EACrC,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAiC;AAC/B,QAAM,QAAQ,SAAS;AACvB,QAAM,WAAW;AAAA,IACf,OACG;AAAA,MACC,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,OAAO;AAAA,IACT,GAAE,IAAI;AAAA,IACR,CAAC,OAAO,IAAI;AAAA,EACd;AAEA,SACE,oCAAC,mBAAgB,MAAM,UAAU,MAAY,OAAe,GAAG,OAAO;AAE1E,CAAC;","names":["Icon"]}
+{"version":3,"sources":["../src/components/icon.tsx"],"sourcesContent":["import { memo, useMemo } from \"react\";\r\nimport { IconProps } from \"../types\";\r\n\r\nexport const Icon = memo(function Icon({\r\n  size = \"medium\",\r\n  icon,\r\n  ...props\r\n}: IconProps) {\r\n  const Icon = icon;\r\n\r\n  const iconSize =\r\n    useMemo(\r\n      () =>\r\n        ({\r\n          small: 14,\r\n          medium: 16,\r\n          large: 16,\r\n        }[size]),\r\n      [size]\r\n    ) ?? 16;\r\n\r\n  return (\r\n    <Icon {...props} width={iconSize} height={iconSize} fill={props.color} />\r\n  );\r\n});\r\n"],"mappings":";AAAA,SAAS,MAAM,eAAe;AAGvB,IAAM,OAAO,KAAK,SAASA,MAAK;AAAA,EACrC,OAAO;AAAA,EACP;AAAA,EACA,GAAG;AACL,GAAc;AACZ,QAAMA,QAAO;AAEb,QAAM,WACJ;AAAA,IACE,OACG;AAAA,MACC,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,OAAO;AAAA,IACT,GAAE,IAAI;AAAA,IACR,CAAC,IAAI;AAAA,EACP,KAAK;AAEP,SACE,oCAACA,OAAA,EAAM,GAAG,OAAO,OAAO,UAAU,QAAQ,UAAU,MAAM,MAAM,OAAO;AAE3E,CAAC;","names":["Icon"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@impulse-ui-native/icon",
-  "version": "1.0.2",
+  "version": "1.0.4",
   "source": "src/index.ts",
   "main": "dist/index.cjs.js",
   "module": "dist/index.esm.js",
@@ -21,14 +21,9 @@
     "LICENSE"
   ],
   "dependencies": {
-    "@fortawesome/fontawesome-svg-core": "^7.1.0",
-    "@fortawesome/free-brands-svg-icons": "^7.1.0",
-    "@fortawesome/free-regular-svg-icons": "^7.1.0",
-    "@fortawesome/free-solid-svg-icons": "^7.1.0",
-    "@fortawesome/react-native-fontawesome": "^0.3.2",
     "react-native-svg": "^15.14.0",
-    "@impulse-ui-native/theme": "1.0.2",
-    "@impulse-ui-native/core": "1.0.2"
+    "@impulse-ui-native/core": "1.0.4",
+    "@impulse-ui-native/theme": "1.0.4"
   },
   "peerDependencies": {
     "@fortawesome/free-brands-svg-icons": "^7.1.0",

package/src/components/icon.tsx

@@ -1,27 +1,25 @@
-import { FontAwesomeIcon } from "@fortawesome/react-native-fontawesome";
-import { useTheme } from "@impulse-ui-native/theme";
-import { memo, PropsWithChildren, useMemo } from "react";
+import { memo, useMemo } from "react";
 import { IconProps } from "../types";
 
 export const Icon = memo(function Icon({
   size = "medium",
   icon,
-  children,
-  style,
   ...props
-}: PropsWithChildren<IconProps>) {
-  const theme = useTheme();
-  const iconSize = useMemo(
-    () =>
-      ({
-        small: 14,
-        medium: 16,
-        large: 16,
-      }[size]),
-    [theme, size]
-  );
+}: IconProps) {
+  const Icon = icon;
+
+  const iconSize =
+    useMemo(
+      () =>
+        ({
+          small: 14,
+          medium: 16,
+          large: 16,
+        }[size]),
+      [size]
+    ) ?? 16;
 
   return (
-    <FontAwesomeIcon size={iconSize} icon={icon} style={style} {...props} />
+    <Icon {...props} width={iconSize} height={iconSize} fill={props.color} />
   );
 });

package/src/types/icon.types.ts

@@ -1,11 +1,12 @@
-import { Props } from "@fortawesome/react-native-fontawesome";
 import { ComponentSize } from "@impulse-ui-native/theme";
-import { ViewStyle } from "react-native";
+import { ComponentType } from "react";
+import { SvgProps } from "react-native-svg";
 
-export interface IconStyle extends ViewStyle {
-  color?: string;
-}
+export type IconStyle = SvgProps["style"];
 
-export interface IconProps extends Omit<Props, "size"> {
+export interface IconProps {
   size?: ComponentSize | number;
+  color?: string;
+  icon: ComponentType<SvgProps>;
+  style?: IconStyle;
 }