@bearei/react-icon - npm Package Compare versions

Comparing version 0.0.3 to 0.0.4

lib-esm/components/Icon.d.ts

@@ -0,11 +1,8 @@
+import type { HandleEvent } from '@bearei/react-util/lib/event';
 import type { DetailedHTMLProps, HTMLAttributes, ReactNode, Ref } from 'react';
 import type { ViewProps } from 'react-native';
-import type { HandleEvent } from '@bearei/react-util/lib/event';
 /**
  * Base icon props
  */
-export interface BaseIconProps<T> extends Omit<DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement> & ViewProps, 'ref'> {
-    /**
-     * Custom icon ref
-     */
+export interface BaseIconProps<T> extends Omit<DetailedHTMLProps<HTMLAttributes<T>, T> & ViewProps, ''> {
     ref?: Ref<T>;
@@ -44,3 +41,3 @@ /**
      */
-    renderContainer?: (props: IconContainerProps<T>, element?: ReactNode) => ReactNode;
+    renderContainer?: (props: IconContainerProps<T>) => ReactNode;
 }
@@ -52,5 +49,6 @@ /**
     /**
-     * Unique ID of icon component
+     * The unique ID of the component
      */
     id: string;
+    children?: ReactNode;
     /**
@@ -61,11 +59,5 @@ * Used to handle some common default events
 }
-/**
- * Icon main props
- */
 export declare type IconMainProps<T> = IconChildrenProps<T>;
-/**
- * Icon container props
- */
 export declare type IconContainerProps<T> = Pick<IconProps<T>, 'ref'> & IconChildrenProps<T>;
 declare function Icon<T>({ ref, renderMain, renderContainer, ...props }: IconProps<T>): JSX.Element;
 export default Icon;

lib-esm/components/Icon.js

@@ -137,5 +137,5 @@ import * as __WEBPACK_EXTERNAL_MODULE_react__ from "react";
 /* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(177);
-/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(810);
-/* harmony import */ var _bearei_react_util_lib_event__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(308);
-/* harmony import */ var _bearei_react_util_lib_event__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_bearei_react_util_lib_event__WEBPACK_IMPORTED_MODULE_2__);
+/* harmony import */ var _bearei_react_util_lib_event__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(308);
+/* harmony import */ var _bearei_react_util_lib_event__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_bearei_react_util_lib_event__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(810);
 var __rest = undefined && undefined.__rest || function (s, e) {
@@ -160,17 +160,14 @@ var t = {};
     props = __rest(_a, ["ref", "renderMain", "renderContainer"]);
-  var id = (0,react__WEBPACK_IMPORTED_MODULE_1__.useId)();
+  var id = (0,react__WEBPACK_IMPORTED_MODULE_2__.useId)();
   var childrenProps = Object.assign(Object.assign({}, props), {
     id: id,
-    handleEvent: (_bearei_react_util_lib_event__WEBPACK_IMPORTED_MODULE_2___default())
+    handleEvent: (_bearei_react_util_lib_event__WEBPACK_IMPORTED_MODULE_1___default())
   });
-  var mainElement = (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, {
-    children: renderMain === null || renderMain === void 0 ? void 0 : renderMain(childrenProps)
-  });
-  var containerElement = (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, {
-    children: (_b = renderContainer === null || renderContainer === void 0 ? void 0 : renderContainer(Object.assign(Object.assign({}, childrenProps), {
-      ref: ref
-    }), mainElement)) !== null && _b !== void 0 ? _b : mainElement
-  });
+  var main = renderMain === null || renderMain === void 0 ? void 0 : renderMain(childrenProps);
+  var container = (_b = renderContainer === null || renderContainer === void 0 ? void 0 : renderContainer(Object.assign(Object.assign({}, childrenProps), {
+    children: main,
+    ref: ref
+  }))) !== null && _b !== void 0 ? _b : main;
   return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, {
-    children: containerElement
+    children: container
   });
@@ -177,0 +174,0 @@ }

lib-esm/index.js

@@ -8,5 +8,5 @@ import * as __WEBPACK_EXTERNAL_MODULE_react__ from "react";
 /* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(177);
-/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(810);
-/* harmony import */ var _bearei_react_util_lib_event__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(308);
-/* harmony import */ var _bearei_react_util_lib_event__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_bearei_react_util_lib_event__WEBPACK_IMPORTED_MODULE_2__);
+/* harmony import */ var _bearei_react_util_lib_event__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(308);
+/* harmony import */ var _bearei_react_util_lib_event__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_bearei_react_util_lib_event__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(810);
 var __rest = undefined && undefined.__rest || function (s, e) {
@@ -31,17 +31,14 @@ var t = {};
     props = __rest(_a, ["ref", "renderMain", "renderContainer"]);
-  var id = (0,react__WEBPACK_IMPORTED_MODULE_1__.useId)();
+  var id = (0,react__WEBPACK_IMPORTED_MODULE_2__.useId)();
   var childrenProps = Object.assign(Object.assign({}, props), {
     id: id,
-    handleEvent: (_bearei_react_util_lib_event__WEBPACK_IMPORTED_MODULE_2___default())
+    handleEvent: (_bearei_react_util_lib_event__WEBPACK_IMPORTED_MODULE_1___default())
   });
-  var mainElement = (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, {
-    children: renderMain === null || renderMain === void 0 ? void 0 : renderMain(childrenProps)
-  });
-  var containerElement = (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, {
-    children: (_b = renderContainer === null || renderContainer === void 0 ? void 0 : renderContainer(Object.assign(Object.assign({}, childrenProps), {
-      ref: ref
-    }), mainElement)) !== null && _b !== void 0 ? _b : mainElement
-  });
+  var main = renderMain === null || renderMain === void 0 ? void 0 : renderMain(childrenProps);
+  var container = (_b = renderContainer === null || renderContainer === void 0 ? void 0 : renderContainer(Object.assign(Object.assign({}, childrenProps), {
+    children: main,
+    ref: ref
+  }))) !== null && _b !== void 0 ? _b : main;
   return (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.Fragment, {
-    children: containerElement
+    children: container
   });
@@ -48,0 +45,0 @@ }

lib/components/Icon.d.ts

@@ -0,11 +1,8 @@
+import type { HandleEvent } from '@bearei/react-util/lib/event';
 import type { DetailedHTMLProps, HTMLAttributes, ReactNode, Ref } from 'react';
 import type { ViewProps } from 'react-native';
-import type { HandleEvent } from '@bearei/react-util/lib/event';
 /**
  * Base icon props
  */
-export interface BaseIconProps<T> extends Omit<DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement> & ViewProps, 'ref'> {
-    /**
-     * Custom icon ref
-     */
+export interface BaseIconProps<T> extends Omit<DetailedHTMLProps<HTMLAttributes<T>, T> & ViewProps, ''> {
     ref?: Ref<T>;
@@ -44,3 +41,3 @@ /**
      */
-    renderContainer?: (props: IconContainerProps<T>, element?: ReactNode) => ReactNode;
+    renderContainer?: (props: IconContainerProps<T>) => ReactNode;
 }
@@ -52,5 +49,6 @@ /**
     /**
-     * Unique ID of icon component
+     * The unique ID of the component
      */
     id: string;
+    children?: ReactNode;
     /**
@@ -61,11 +59,5 @@ * Used to handle some common default events
 }
-/**
- * Icon main props
- */
 export declare type IconMainProps<T> = IconChildrenProps<T>;
-/**
- * Icon container props
- */
 export declare type IconContainerProps<T> = Pick<IconProps<T>, 'ref'> & IconChildrenProps<T>;
 declare function Icon<T>({ ref, renderMain, renderContainer, ...props }: IconProps<T>): JSX.Element;
 export default Icon;

lib/components/Icon.js

@@ -29,4 +29,4 @@ /******/ (function() { // webpackBootstrap
 var jsx_runtime_1 = __webpack_require__(177);
+var event_1 = __importDefault(__webpack_require__(308));
 var react_1 = __webpack_require__(689);
-var event_1 = __importDefault(__webpack_require__(308));
 function Icon(_a) {
@@ -43,12 +43,9 @@ var _b;
   });
-  var mainElement = (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {
-    children: renderMain === null || renderMain === void 0 ? void 0 : renderMain(childrenProps)
-  });
-  var containerElement = (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {
-    children: (_b = renderContainer === null || renderContainer === void 0 ? void 0 : renderContainer(Object.assign(Object.assign({}, childrenProps), {
-      ref: ref
-    }), mainElement)) !== null && _b !== void 0 ? _b : mainElement
-  });
+  var main = renderMain === null || renderMain === void 0 ? void 0 : renderMain(childrenProps);
+  var container = (_b = renderContainer === null || renderContainer === void 0 ? void 0 : renderContainer(Object.assign(Object.assign({}, childrenProps), {
+    children: main,
+    ref: ref
+  }))) !== null && _b !== void 0 ? _b : main;
   return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {
-    children: containerElement
+    children: container
   });
@@ -55,0 +52,0 @@ }

lib/index.js

@@ -29,4 +29,4 @@ /******/ (function() { // webpackBootstrap
 var jsx_runtime_1 = __webpack_require__(177);
+var event_1 = __importDefault(__webpack_require__(308));
 var react_1 = __webpack_require__(689);
-var event_1 = __importDefault(__webpack_require__(308));
 function Icon(_a) {
@@ -43,12 +43,9 @@ var _b;
   });
-  var mainElement = (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {
-    children: renderMain === null || renderMain === void 0 ? void 0 : renderMain(childrenProps)
-  });
-  var containerElement = (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {
-    children: (_b = renderContainer === null || renderContainer === void 0 ? void 0 : renderContainer(Object.assign(Object.assign({}, childrenProps), {
-      ref: ref
-    }), mainElement)) !== null && _b !== void 0 ? _b : mainElement
-  });
+  var main = renderMain === null || renderMain === void 0 ? void 0 : renderMain(childrenProps);
+  var container = (_b = renderContainer === null || renderContainer === void 0 ? void 0 : renderContainer(Object.assign(Object.assign({}, childrenProps), {
+    children: main,
+    ref: ref
+  }))) !== null && _b !== void 0 ? _b : main;
   return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {
-    children: containerElement
+    children: container
   });
@@ -55,0 +52,0 @@ }

package.json

 {
   "name": "@bearei/react-icon",
-  "version": "0.0.3",
+  "version": "0.0.4",
   "main": "./lib/index.js",
@@ -5,0 +5,0 @@ "types": "./lib/index.d.ts",

README.md

@@ -11,11 +11,11 @@ # react-icon
 
-| Name            |                     Type | Required | Description                       |
-| :-------------- | -----------------------: | -------: | :-------------------------------- |
-| size            | 'small','medium','large' |        ✘ | Set the icon size                 |
-| width           |            string,number |        ✘ | Set the width of the icon         |
-| height          |            string,number |        ✘ | Set the icon height               |
-| fill            |                   string |        ✘ | Set the icon fill color           |
-| content         |          React.ReactNode |        ✘ | The main area content of the icon |
-| renderMain      |          function(props) |        ✘ | Render the icon main              |
-| renderContainer |  function(props,element) |        ✘ | Render the icon container         |
+| Name | Type | Required | Description |
+| :-- | --: | --: | :-- |
+| size | `small` `medium` `large` | ✘ | Set the icon size |
+| width | `string` `number` | ✘ | Set the width of the icon |
+| height | `string` `number` | ✘ | Set the icon height |
+| fill | `string` | ✘ | Set the icon fill color |
+| content | `ReactNode` | ✘ | The main area content of the icon |
+| renderMain | `(props: IconMainProps) => ReactNode` | ✘ | Render the icon main |
+| renderContainer | `(props: IconContainerProps) => ReactNode` | ✘ | Render the icon container |
 
@@ -31,6 +31,6 @@ ## Use
   <Icon
-    renderMain={() => <i data-cy="icon">{'icon'}</i>}
-    renderContainer={({id}, element) => (
-      <div data-cy="container" data-id={id} tabIndex={1}>
-        {element}
+    renderMain={() => <i>{'icon'}</i>}
+    renderContainer={({id, children}) => (
+      <div data-id={id} tabIndex={1}>
+        {children}
       </div>
@@ -37,0 +37,0 @@ )}

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

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

Worsened metrics

Total package byte prevSize

35264

decreased by-4%

Lines of code

757

decreased by-3.57%

No dependency changes