@tatan22/jcd-product-card 0.0.1 → 1.0.0-rc

package/dist/components/ProductCard.d.ts

@@ -12,6 +12,6 @@ export interface Props {
 export declare const ProductCard: {
     ({ children, product, className, style, onChange, value, initialValues, }: Props): JSX.Element;
     Image: ({ img, className, style }: import("./ProductImage").Props) => JSX.Element;
-    Title: ({ title, className, style }: import("./ProductTitle").Props) => React.ReactElement<any, string | ((props: any) => React.ReactElement<any, any> | null) | (new (props: any) => React.Component<any, any, any>)>;
+    Title: ({ title, className, style }: import("./ProductTitle").Props) => React.ReactElement<unknown, string | ((props: any) => React.ReactElement<any, any> | null) | (new (props: any, context: any) => React.Component<any, any, any>)>;
     Buttons: ({ className, style }: import("./ProductButtons").Props) => JSX.Element;
 };

package/dist/jcd-product-card.cjs.development.js

@@ -13,9 +13,6 @@ var useProduct = function useProduct(_ref) {
     _ref$value = _ref.value,
     value = _ref$value === void 0 ? 0 : _ref$value,
     initialValues = _ref.initialValues;
-  // if (initialValues) {
-  // 	value = initialValues.count || value;
-  // }
   var _useState = React.useState((initialValues == null ? void 0 : initialValues.count) || value),
     counter = _useState[0],
     setCounter = _useState[1];
@@ -40,7 +37,6 @@ var useProduct = function useProduct(_ref) {
       product: product
     });
   };
-  // El use ref se puede usar como un elemento que no tiene dependencias de renderizado
   React.useEffect(function () {
     if (!isMounted.current) return;
     setCounter(value);
@@ -116,7 +112,6 @@ var ProductImage = function ProductImage(_ref) {
   });
 };
 
-// export const ProductTitle = ({ title, className }: { title?: string, className?: string }): ReactElement => {
 var ProductTitle = function ProductTitle(_ref) {
   var title = _ref.title,
     className = _ref.className,
@@ -136,13 +131,9 @@ var ProductButtons = function ProductButtons(_ref) {
     increaseBy = _useContext.increaseBy,
     counter = _useContext.counter,
     maxCount = _useContext.maxCount;
-  //TODO: Una función isMaxReached = useCallback, dependencias [counter, maxCounter]
-  //? True si el count === maxCount, caso contrario False
   var isMaxReached = React.useCallback(function () {
     return !!maxCount && counter === maxCount;
-  },
-  // retorna true o false
-  [counter, maxCount]);
+  }, [counter, maxCount]);
   return React__default.createElement("div", {
     className: "\t" + styles.buttonsContainer + " " + className,
     style: style

package/dist/jcd-product-card.cjs.development.js.map

@@ -1 +1 @@
-{"version":3,"file":"jcd-product-card.cjs.development.js","sources":["../src/hooks/useProduct.ts","../node_modules/style-inject/dist/style-inject.es.js","../src/components/ProductContext.tsx","../src/components/ProductImage.tsx","../src/components/ProductTitle.tsx","../src/components/ProductButtons.tsx","../src/components/ProductCard.tsx","../src/components/index.ts"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\r\nimport { InitialValues, onChangeArgs, Product } from \"../interfaces/interfaces\";\r\n\r\ninterface useProductArgs {\r\n\tproduct: Product;\r\n\tonChange?: (args: onChangeArgs) => void;\r\n\tvalue?: number;\r\n\tinitialValues?: InitialValues;\r\n}\r\n\r\nexport const useProduct = ({\r\n\tonChange,\r\n\tproduct,\r\n\tvalue = 0,\r\n\tinitialValues,\r\n}: useProductArgs) => {\r\n\t// if (initialValues) {\r\n\t// \tvalue = initialValues.count || value;\r\n\t// }\r\n\r\n\tconst [counter, setCounter] = useState<number>(initialValues?.count || value);\r\n\r\n\tconst isMounted = useRef(false);\r\n\r\n\tconst increaseBy = (value?: number) => {\r\n\t\tconst amount = value ?? 1;\r\n\t\tlet newValue = Math.max(counter + amount, 0);\r\n\r\n\t\tif (initialValues?.maxCount) {\r\n\t\t\tnewValue = Math.min(newValue, initialValues.maxCount);\r\n\t\t}\r\n\r\n\t\tsetCounter(newValue);\r\n\r\n\t\tonChange && onChange({ count: newValue, product });\r\n\t};\r\n\r\n\tconst reset = () => {\r\n\t\tconst newValue = initialValues?.count || value;\r\n\t\tsetCounter(newValue);\r\n\t\tonChange && onChange({ count: newValue, product });\r\n\r\n\t}\r\n\r\n\t// El use ref se puede usar como un elemento que no tiene dependencias de renderizado\r\n\tuseEffect(() => {\r\n\t\tif (!isMounted.current) return;\r\n\t\tsetCounter(value);\r\n\t}, [value]);\r\n\r\n\tuseEffect(() => {\r\n\t\tisMounted.current = true;\r\n\t}, []);\r\n\r\n\treturn {\r\n\t\t//Props\r\n\t\tcounter,\r\n\t\tmaxCount: initialValues?.maxCount,\r\n\t\t//Methods\r\n\t\tincreaseBy,\r\n\t\tisMaxCountReached: !!initialValues?.maxCount && counter === initialValues.maxCount,\r\n\t\treset\r\n\t};\r\n};\r\n","function styleInject(css, ref) {\n  if ( ref === void 0 ) ref = {};\n  var insertAt = ref.insertAt;\n\n  if (!css || typeof document === 'undefined') { return; }\n\n  var head = document.head || document.getElementsByTagName('head')[0];\n  var style = document.createElement('style');\n  style.type = 'text/css';\n\n  if (insertAt === 'top') {\n    if (head.firstChild) {\n      head.insertBefore(style, head.firstChild);\n    } else {\n      head.appendChild(style);\n    }\n  } else {\n    head.appendChild(style);\n  }\n\n  if (style.styleSheet) {\n    style.styleSheet.cssText = css;\n  } else {\n    style.appendChild(document.createTextNode(css));\n  }\n}\n\nexport default styleInject;\n","// ProductContext.tsx\r\nimport { createContext } from \"react\";\r\nimport { ProductContextProps } from \"../interfaces/interfaces\";\r\n\r\nexport const ProductContext = createContext({} as ProductContextProps);","import React, { useContext } from \"react\";\r\nimport styles from \"../styles/styles.module.css\";\r\n\r\n// import noImages from \"../assets/no-image.jpg\";\r\nimport { ProductContext } from \"./ProductContext\";\r\n\r\nexport interface Props {\r\n\timg?: string;\r\n\tclassName?: string;\r\n\tstyle?: React.CSSProperties;\r\n}\r\nconst DEFAULT_IMAGE =\r\n  \"https://via.placeholder.com/300x200?text=No+Image\";\r\n\r\nexport const ProductImage = ({ img , className, style }: Props) => {\r\n\tconst { product } = useContext(ProductContext);\r\n\tlet imgToShow: string = \"\";\r\n\tif (img) {\r\n\t\timgToShow = img;\r\n\t} else if (product.img) {\r\n\t\timgToShow = product.img;\r\n\t} else {\r\n\t\timgToShow = DEFAULT_IMAGE;\r\n\t}\r\n\r\n\treturn <img className={`\t${styles.productImg} ${className}`} src={imgToShow} alt=\"Product\" style={style} />;\r\n};\r\n","import React, { ReactElement, useContext } from \"react\";\r\nimport styles from \"../styles/styles.module.css\";\r\nimport { ProductContext } from \"./ProductContext\";\r\n\r\nexport interface Props {\r\n\ttitle?: string;\r\n\tclassName?: string;\r\n\tstyle?: React.CSSProperties;\r\n}\r\n\r\n// export const ProductTitle = ({ title, className }: { title?: string, className?: string }): ReactElement => {\r\nexport const ProductTitle = ({ title, className, style }: Props): ReactElement => {\r\n\tconst { product } = useContext(ProductContext);\r\n\r\n\treturn (\r\n\t\t<span className={`${styles.productTitle} ${className}`} style={style}>\r\n\t\t\t{title || product.title}\r\n\t\t</span>\r\n\t);\r\n};\r\n\r\n\r\n","import React, { useCallback, useContext } from \"react\";\r\nimport styles from \"../styles/styles.module.css\";\r\nimport { ProductContext } from \"./ProductContext\";\r\n\r\nexport interface Props {\r\n\t// className para poder recibir estilos personalizados\r\n\tclassName?: string;\r\n\tstyle?: React.CSSProperties;\r\n\tactiveBtnClass?: string;\r\n}\r\n\r\nexport const ProductButtons = ({ className, style }: Props) => {\r\n\r\n\tconst { increaseBy, counter, maxCount } = useContext(ProductContext);\r\n\r\n//TODO: Una función isMaxReached = useCallback, dependencias [counter, maxCounter]\r\n//? True si el count === maxCount, caso contrario False\r\n\r\nconst isMaxReached = useCallback(\r\n\t() => !!maxCount && counter === maxCount, // retorna true o false\r\n\t[counter, maxCount],\r\n)\r\n\r\n\treturn (\r\n\t\t<div className={`\t${styles.buttonsContainer} ${className}`} style={style}>\r\n\t\t\t<button className={styles.buttonMinus} onClick={() => increaseBy(-1)}>\r\n\t\t\t\t-\r\n\t\t\t</button>\r\n\t\t\t<div className={styles.countLabel}>{counter}</div>\r\n\r\n\t\t\t<button className={`${styles.buttonAdd} ${ isMaxReached() && styles.disabled}`} onClick={() => increaseBy(1)}>\r\n\t\t\t\t+\r\n\t\t\t</button>\r\n\t\t</div>\r\n\t);\r\n};\r\n","import React, { JSX } from 'react';\r\nimport { useProduct } from '../hooks/useProduct';\r\nimport {\r\n  InitialValues,\r\n  onChangeArgs,\r\n  Product,\r\n  ProductCardHandlers,\r\n} from '../interfaces/interfaces';\r\nimport styles from '../styles/styles.module.css';\r\n\r\nimport { ProductImage } from './ProductImage';\r\nimport { ProductTitle } from './ProductTitle';\r\nimport { ProductButtons } from './ProductButtons';\r\nimport { ProductContext } from './ProductContext';\r\n\r\nconst { Provider } = ProductContext;\r\n\r\nexport interface Props {\r\n  product: Product;\r\n  // children?: ReactElement | ReactElement[];\r\n  children: (args: ProductCardHandlers) => JSX.Element;\r\n  className?: string;\r\n  style?: React.CSSProperties;\r\n  onChange?: (args: onChangeArgs) => void;\r\n  value?: number;\r\n  initialValues?: InitialValues;\r\n}\r\n\r\nexport const ProductCard = ({\r\n  children,\r\n  product,\r\n  className,\r\n  style,\r\n  onChange,\r\n  value,\r\n  initialValues,\r\n}: Props) => {\r\n  const {\r\n    counter,\r\n    increaseBy,\r\n    isMaxCountReached,\r\n    maxCount,\r\n    reset,\r\n  } = useProduct({\r\n    onChange,\r\n    product,\r\n    value,\r\n    initialValues,\r\n  });\r\n\r\n  return (\r\n    <Provider value={{ counter, increaseBy, maxCount, product }}>\r\n      <div className={`${styles.productCard} ${className}`} style={style}>\r\n        {/* {children} */}\r\n        {children({\r\n          count: counter,\r\n          isMaxCountReached,\r\n          maxCount: initialValues?.maxCount,\r\n          product,\r\n          increaseBy,\r\n          reset,\r\n        })}\r\n      </div>\r\n    </Provider>\r\n  );\r\n};\r\n\r\nProductCard.Image = ProductImage;\r\nProductCard.Title = ProductTitle;\r\nProductCard.Buttons = ProductButtons;\r\n","import { ProductCard as ProductCardHOC } from './ProductCard';\r\nimport { ProductCardHOCProps } from '../interfaces/interfaces';\r\nimport { ProductButtons } from './ProductButtons';\r\nimport { ProductImage } from './ProductImage';\r\nimport { ProductTitle } from './ProductTitle';\r\nexport { ProductButtons } from './ProductButtons';\r\nexport { ProductImage } from './ProductImage';\r\nexport { ProductTitle } from './ProductTitle';\r\n\r\nexport const ProductCard: ProductCardHOCProps = Object.assign(ProductCardHOC, {\r\n  Button: ProductButtons,\r\n  Image: ProductImage,\r\n  Title: ProductTitle,\r\n});\r\n\r\nexport default ProductCard;"],"names":["useProduct","_ref","onChange","product","_ref$value","value","initialValues","_useState","useState","count","counter","setCounter","isMounted","useRef","increaseBy","amount","newValue","Math","max","maxCount","min","reset","useEffect","current","isMaxCountReached","ProductContext","createContext","DEFAULT_IMAGE","ProductImage","img","className","style","_useContext","useContext","imgToShow","React","styles","productImg","src","alt","ProductTitle","title","productTitle","ProductButtons","isMaxReached","useCallback","buttonsContainer","buttonMinus","onClick","countLabel","buttonAdd","disabled","Provider","ProductCard","children","_useProduct","productCard","Image","Title","Buttons","Object","assign","ProductCardHOC","Button"],"mappings":"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"}
+{"version":3,"file":"jcd-product-card.cjs.development.js","sources":["../src/hooks/useProduct.ts","../node_modules/style-inject/dist/style-inject.es.js","../src/components/ProductContext.tsx","../src/components/ProductImage.tsx","../src/components/ProductTitle.tsx","../src/components/ProductButtons.tsx","../src/components/ProductCard.tsx","../src/components/index.ts"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\r\nimport { InitialValues, onChangeArgs, Product } from \"../interfaces/interfaces\";\r\n\r\ninterface useProductArgs {\r\n\tproduct: Product;\r\n\tonChange?: (args: onChangeArgs) => void;\r\n\tvalue?: number;\r\n\tinitialValues?: InitialValues;\r\n}\r\n\r\nexport const useProduct = ({\r\n\tonChange,\r\n\tproduct,\r\n\tvalue = 0,\r\n\tinitialValues,\r\n}: useProductArgs) => {\r\n\r\n\tconst [counter, setCounter] = useState<number>(initialValues?.count || value);\r\n\r\n\tconst isMounted = useRef(false);\r\n\r\n\tconst increaseBy = (value?: number) => {\r\n\t\tconst amount = value ?? 1;\r\n\t\tlet newValue = Math.max(counter + amount, 0);\r\n\r\n\t\tif (initialValues?.maxCount) {\r\n\t\t\tnewValue = Math.min(newValue, initialValues.maxCount);\r\n\t\t}\r\n\r\n\t\tsetCounter(newValue);\r\n\r\n\t\tonChange && onChange({ count: newValue, product });\r\n\t};\r\n\r\n\tconst reset = () => {\r\n\t\tconst newValue = initialValues?.count || value;\r\n\t\tsetCounter(newValue);\r\n\t\tonChange && onChange({ count: newValue, product });\r\n\r\n\t}\r\n\r\n\tuseEffect(() => {\r\n\t\tif (!isMounted.current) return;\r\n\t\tsetCounter(value);\r\n\t}, [value]);\r\n\r\n\tuseEffect(() => {\r\n\t\tisMounted.current = true;\r\n\t}, []);\r\n\r\n\treturn {\r\n\t\t//Props\r\n\t\tcounter,\r\n\t\tmaxCount: initialValues?.maxCount,\r\n\t\t//Methods\r\n\t\tincreaseBy,\r\n\t\tisMaxCountReached: !!initialValues?.maxCount && counter === initialValues.maxCount,\r\n\t\treset\r\n\t};\r\n};\r\n","function styleInject(css, ref) {\n  if ( ref === void 0 ) ref = {};\n  var insertAt = ref.insertAt;\n\n  if (!css || typeof document === 'undefined') { return; }\n\n  var head = document.head || document.getElementsByTagName('head')[0];\n  var style = document.createElement('style');\n  style.type = 'text/css';\n\n  if (insertAt === 'top') {\n    if (head.firstChild) {\n      head.insertBefore(style, head.firstChild);\n    } else {\n      head.appendChild(style);\n    }\n  } else {\n    head.appendChild(style);\n  }\n\n  if (style.styleSheet) {\n    style.styleSheet.cssText = css;\n  } else {\n    style.appendChild(document.createTextNode(css));\n  }\n}\n\nexport default styleInject;\n","// ProductContext.tsx\r\nimport { createContext } from \"react\";\r\nimport { ProductContextProps } from \"../interfaces/interfaces\";\r\n\r\nexport const ProductContext = createContext({} as ProductContextProps);","import React, { useContext } from \"react\";\r\nimport styles from \"../styles/styles.module.css\";\r\n\r\n// import noImages from \"../assets/no-image.jpg\";\r\nimport { ProductContext } from \"./ProductContext\";\r\n\r\nexport interface Props {\r\n\timg?: string;\r\n\tclassName?: string;\r\n\tstyle?: React.CSSProperties;\r\n}\r\nconst DEFAULT_IMAGE =\r\n  \"https://via.placeholder.com/300x200?text=No+Image\";\r\n\r\nexport const ProductImage = ({ img , className, style }: Props) => {\r\n\tconst { product } = useContext(ProductContext);\r\n\tlet imgToShow: string = \"\";\r\n\tif (img) {\r\n\t\timgToShow = img;\r\n\t} else if (product.img) {\r\n\t\timgToShow = product.img;\r\n\t} else {\r\n\t\timgToShow = DEFAULT_IMAGE;\r\n\t}\r\n\r\n\treturn <img className={`\t${styles.productImg} ${className}`} src={imgToShow} alt=\"Product\" style={style} />;\r\n};\r\n","import React, { ReactElement, useContext } from \"react\";\r\nimport styles from \"../styles/styles.module.css\";\r\nimport { ProductContext } from \"./ProductContext\";\r\n\r\nexport interface Props {\r\n\ttitle?: string;\r\n\tclassName?: string;\r\n\tstyle?: React.CSSProperties;\r\n}\r\n\r\nexport const ProductTitle = ({ title, className, style }: Props): ReactElement => {\r\n\tconst { product } = useContext(ProductContext);\r\n\r\n\treturn (\r\n\t\t<span className={`${styles.productTitle} ${className}`} style={style}>\r\n\t\t\t{title || product.title}\r\n\t\t</span>\r\n\t);\r\n};\r\n\r\n\r\n","import React, { useCallback, useContext } from \"react\";\r\nimport styles from \"../styles/styles.module.css\";\r\nimport { ProductContext } from \"./ProductContext\";\r\n\r\nexport interface Props {\r\n\tclassName?: string;\r\n\tstyle?: React.CSSProperties;\r\n\tactiveBtnClass?: string;\r\n}\r\n\r\nexport const ProductButtons = ({ className, style }: Props) => {\r\n\r\n\tconst { increaseBy, counter, maxCount } = useContext(ProductContext);\r\n\r\nconst isMaxReached = useCallback(\r\n\t() => !!maxCount && counter === maxCount, \r\n\t[counter, maxCount],\r\n)\r\n\r\n\treturn (\r\n\t\t<div className={`\t${styles.buttonsContainer} ${className}`} style={style}>\r\n\t\t\t<button className={styles.buttonMinus} onClick={() => increaseBy(-1)}>\r\n\t\t\t\t-\r\n\t\t\t</button>\r\n\t\t\t<div className={styles.countLabel}>{counter}</div>\r\n\r\n\t\t\t<button className={`${styles.buttonAdd} ${ isMaxReached() && styles.disabled}`} onClick={() => increaseBy(1)}>\r\n\t\t\t\t+\r\n\t\t\t</button>\r\n\t\t</div>\r\n\t);\r\n};\r\n","import React, { JSX } from 'react';\r\nimport { useProduct } from '../hooks/useProduct';\r\nimport {\r\n  InitialValues,\r\n  onChangeArgs,\r\n  Product,\r\n  ProductCardHandlers,\r\n} from '../interfaces/interfaces';\r\nimport styles from '../styles/styles.module.css';\r\n\r\nimport { ProductImage } from './ProductImage';\r\nimport { ProductTitle } from './ProductTitle';\r\nimport { ProductButtons } from './ProductButtons';\r\nimport { ProductContext } from './ProductContext';\r\n\r\nconst { Provider } = ProductContext;\r\n\r\nexport interface Props {\r\n  product: Product;\r\n  // children?: ReactElement | ReactElement[];\r\n  children: (args: ProductCardHandlers) => JSX.Element;\r\n  className?: string;\r\n  style?: React.CSSProperties;\r\n  onChange?: (args: onChangeArgs) => void;\r\n  value?: number;\r\n  initialValues?: InitialValues;\r\n}\r\n\r\nexport const ProductCard = ({\r\n  children,\r\n  product,\r\n  className,\r\n  style,\r\n  onChange,\r\n  value,\r\n  initialValues,\r\n}: Props) => {\r\n  const {\r\n    counter,\r\n    increaseBy,\r\n    isMaxCountReached,\r\n    maxCount,\r\n    reset,\r\n  } = useProduct({\r\n    onChange,\r\n    product,\r\n    value,\r\n    initialValues,\r\n  });\r\n\r\n  return (\r\n    <Provider value={{ counter, increaseBy, maxCount, product }}>\r\n      <div className={`${styles.productCard} ${className}`} style={style}>\r\n        {children({\r\n          count: counter,\r\n          isMaxCountReached,\r\n          maxCount: initialValues?.maxCount,\r\n          product,\r\n          increaseBy,\r\n          reset,\r\n        })}\r\n      </div>\r\n    </Provider>\r\n  );\r\n};\r\n\r\nProductCard.Image = ProductImage;\r\nProductCard.Title = ProductTitle;\r\nProductCard.Buttons = ProductButtons;\r\n","import { ProductCard as ProductCardHOC } from './ProductCard';\r\nimport { ProductCardHOCProps } from '../interfaces/interfaces';\r\nimport { ProductButtons } from './ProductButtons';\r\nimport { ProductImage } from './ProductImage';\r\nimport { ProductTitle } from './ProductTitle';\r\nexport { ProductButtons } from './ProductButtons';\r\nexport { ProductImage } from './ProductImage';\r\nexport { ProductTitle } from './ProductTitle';\r\n\r\nexport const ProductCard: ProductCardHOCProps = Object.assign(ProductCardHOC, {\r\n  Button: ProductButtons,\r\n  Image: ProductImage,\r\n  Title: ProductTitle,\r\n});\r\n\r\nexport default ProductCard;"],"names":["useProduct","_ref","onChange","product","_ref$value","value","initialValues","_useState","useState","count","counter","setCounter","isMounted","useRef","increaseBy","amount","newValue","Math","max","maxCount","min","reset","useEffect","current","isMaxCountReached","ProductContext","createContext","DEFAULT_IMAGE","ProductImage","img","className","style","_useContext","useContext","imgToShow","React","styles","productImg","src","alt","ProductTitle","title","productTitle","ProductButtons","isMaxReached","useCallback","buttonsContainer","buttonMinus","onClick","countLabel","buttonAdd","disabled","Provider","ProductCard","children","_useProduct","productCard","Image","Title","Buttons","Object","assign","ProductCardHOC","Button"],"mappings":"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"}

package/dist/jcd-product-card.cjs.production.min.js.map

@@ -1 +1 @@
-{"version":3,"file":"jcd-product-card.cjs.production.min.js","sources":["../node_modules/style-inject/dist/style-inject.es.js","../src/components/ProductContext.tsx","../src/components/ProductImage.tsx","../src/components/ProductTitle.tsx","../src/components/ProductButtons.tsx","../src/components/ProductCard.tsx","../src/hooks/useProduct.ts","../src/components/index.ts"],"sourcesContent":["function styleInject(css, ref) {\n  if ( ref === void 0 ) ref = {};\n  var insertAt = ref.insertAt;\n\n  if (!css || typeof document === 'undefined') { return; }\n\n  var head = document.head || document.getElementsByTagName('head')[0];\n  var style = document.createElement('style');\n  style.type = 'text/css';\n\n  if (insertAt === 'top') {\n    if (head.firstChild) {\n      head.insertBefore(style, head.firstChild);\n    } else {\n      head.appendChild(style);\n    }\n  } else {\n    head.appendChild(style);\n  }\n\n  if (style.styleSheet) {\n    style.styleSheet.cssText = css;\n  } else {\n    style.appendChild(document.createTextNode(css));\n  }\n}\n\nexport default styleInject;\n","// ProductContext.tsx\r\nimport { createContext } from \"react\";\r\nimport { ProductContextProps } from \"../interfaces/interfaces\";\r\n\r\nexport const ProductContext = createContext({} as ProductContextProps);","import React, { useContext } from \"react\";\r\nimport styles from \"../styles/styles.module.css\";\r\n\r\n// import noImages from \"../assets/no-image.jpg\";\r\nimport { ProductContext } from \"./ProductContext\";\r\n\r\nexport interface Props {\r\n\timg?: string;\r\n\tclassName?: string;\r\n\tstyle?: React.CSSProperties;\r\n}\r\nconst DEFAULT_IMAGE =\r\n  \"https://via.placeholder.com/300x200?text=No+Image\";\r\n\r\nexport const ProductImage = ({ img , className, style }: Props) => {\r\n\tconst { product } = useContext(ProductContext);\r\n\tlet imgToShow: string = \"\";\r\n\tif (img) {\r\n\t\timgToShow = img;\r\n\t} else if (product.img) {\r\n\t\timgToShow = product.img;\r\n\t} else {\r\n\t\timgToShow = DEFAULT_IMAGE;\r\n\t}\r\n\r\n\treturn <img className={`\t${styles.productImg} ${className}`} src={imgToShow} alt=\"Product\" style={style} />;\r\n};\r\n","import React, { ReactElement, useContext } from \"react\";\r\nimport styles from \"../styles/styles.module.css\";\r\nimport { ProductContext } from \"./ProductContext\";\r\n\r\nexport interface Props {\r\n\ttitle?: string;\r\n\tclassName?: string;\r\n\tstyle?: React.CSSProperties;\r\n}\r\n\r\n// export const ProductTitle = ({ title, className }: { title?: string, className?: string }): ReactElement => {\r\nexport const ProductTitle = ({ title, className, style }: Props): ReactElement => {\r\n\tconst { product } = useContext(ProductContext);\r\n\r\n\treturn (\r\n\t\t<span className={`${styles.productTitle} ${className}`} style={style}>\r\n\t\t\t{title || product.title}\r\n\t\t</span>\r\n\t);\r\n};\r\n\r\n\r\n","import React, { useCallback, useContext } from \"react\";\r\nimport styles from \"../styles/styles.module.css\";\r\nimport { ProductContext } from \"./ProductContext\";\r\n\r\nexport interface Props {\r\n\t// className para poder recibir estilos personalizados\r\n\tclassName?: string;\r\n\tstyle?: React.CSSProperties;\r\n\tactiveBtnClass?: string;\r\n}\r\n\r\nexport const ProductButtons = ({ className, style }: Props) => {\r\n\r\n\tconst { increaseBy, counter, maxCount } = useContext(ProductContext);\r\n\r\n//TODO: Una función isMaxReached = useCallback, dependencias [counter, maxCounter]\r\n//? True si el count === maxCount, caso contrario False\r\n\r\nconst isMaxReached = useCallback(\r\n\t() => !!maxCount && counter === maxCount, // retorna true o false\r\n\t[counter, maxCount],\r\n)\r\n\r\n\treturn (\r\n\t\t<div className={`\t${styles.buttonsContainer} ${className}`} style={style}>\r\n\t\t\t<button className={styles.buttonMinus} onClick={() => increaseBy(-1)}>\r\n\t\t\t\t-\r\n\t\t\t</button>\r\n\t\t\t<div className={styles.countLabel}>{counter}</div>\r\n\r\n\t\t\t<button className={`${styles.buttonAdd} ${ isMaxReached() && styles.disabled}`} onClick={() => increaseBy(1)}>\r\n\t\t\t\t+\r\n\t\t\t</button>\r\n\t\t</div>\r\n\t);\r\n};\r\n","import React, { JSX } from 'react';\r\nimport { useProduct } from '../hooks/useProduct';\r\nimport {\r\n  InitialValues,\r\n  onChangeArgs,\r\n  Product,\r\n  ProductCardHandlers,\r\n} from '../interfaces/interfaces';\r\nimport styles from '../styles/styles.module.css';\r\n\r\nimport { ProductImage } from './ProductImage';\r\nimport { ProductTitle } from './ProductTitle';\r\nimport { ProductButtons } from './ProductButtons';\r\nimport { ProductContext } from './ProductContext';\r\n\r\nconst { Provider } = ProductContext;\r\n\r\nexport interface Props {\r\n  product: Product;\r\n  // children?: ReactElement | ReactElement[];\r\n  children: (args: ProductCardHandlers) => JSX.Element;\r\n  className?: string;\r\n  style?: React.CSSProperties;\r\n  onChange?: (args: onChangeArgs) => void;\r\n  value?: number;\r\n  initialValues?: InitialValues;\r\n}\r\n\r\nexport const ProductCard = ({\r\n  children,\r\n  product,\r\n  className,\r\n  style,\r\n  onChange,\r\n  value,\r\n  initialValues,\r\n}: Props) => {\r\n  const {\r\n    counter,\r\n    increaseBy,\r\n    isMaxCountReached,\r\n    maxCount,\r\n    reset,\r\n  } = useProduct({\r\n    onChange,\r\n    product,\r\n    value,\r\n    initialValues,\r\n  });\r\n\r\n  return (\r\n    <Provider value={{ counter, increaseBy, maxCount, product }}>\r\n      <div className={`${styles.productCard} ${className}`} style={style}>\r\n        {/* {children} */}\r\n        {children({\r\n          count: counter,\r\n          isMaxCountReached,\r\n          maxCount: initialValues?.maxCount,\r\n          product,\r\n          increaseBy,\r\n          reset,\r\n        })}\r\n      </div>\r\n    </Provider>\r\n  );\r\n};\r\n\r\nProductCard.Image = ProductImage;\r\nProductCard.Title = ProductTitle;\r\nProductCard.Buttons = ProductButtons;\r\n","import { useEffect, useRef, useState } from \"react\";\r\nimport { InitialValues, onChangeArgs, Product } from \"../interfaces/interfaces\";\r\n\r\ninterface useProductArgs {\r\n\tproduct: Product;\r\n\tonChange?: (args: onChangeArgs) => void;\r\n\tvalue?: number;\r\n\tinitialValues?: InitialValues;\r\n}\r\n\r\nexport const useProduct = ({\r\n\tonChange,\r\n\tproduct,\r\n\tvalue = 0,\r\n\tinitialValues,\r\n}: useProductArgs) => {\r\n\t// if (initialValues) {\r\n\t// \tvalue = initialValues.count || value;\r\n\t// }\r\n\r\n\tconst [counter, setCounter] = useState<number>(initialValues?.count || value);\r\n\r\n\tconst isMounted = useRef(false);\r\n\r\n\tconst increaseBy = (value?: number) => {\r\n\t\tconst amount = value ?? 1;\r\n\t\tlet newValue = Math.max(counter + amount, 0);\r\n\r\n\t\tif (initialValues?.maxCount) {\r\n\t\t\tnewValue = Math.min(newValue, initialValues.maxCount);\r\n\t\t}\r\n\r\n\t\tsetCounter(newValue);\r\n\r\n\t\tonChange && onChange({ count: newValue, product });\r\n\t};\r\n\r\n\tconst reset = () => {\r\n\t\tconst newValue = initialValues?.count || value;\r\n\t\tsetCounter(newValue);\r\n\t\tonChange && onChange({ count: newValue, product });\r\n\r\n\t}\r\n\r\n\t// El use ref se puede usar como un elemento que no tiene dependencias de renderizado\r\n\tuseEffect(() => {\r\n\t\tif (!isMounted.current) return;\r\n\t\tsetCounter(value);\r\n\t}, [value]);\r\n\r\n\tuseEffect(() => {\r\n\t\tisMounted.current = true;\r\n\t}, []);\r\n\r\n\treturn {\r\n\t\t//Props\r\n\t\tcounter,\r\n\t\tmaxCount: initialValues?.maxCount,\r\n\t\t//Methods\r\n\t\tincreaseBy,\r\n\t\tisMaxCountReached: !!initialValues?.maxCount && counter === initialValues.maxCount,\r\n\t\treset\r\n\t};\r\n};\r\n","import { ProductCard as ProductCardHOC } from './ProductCard';\r\nimport { ProductCardHOCProps } from '../interfaces/interfaces';\r\nimport { ProductButtons } from './ProductButtons';\r\nimport { ProductImage } from './ProductImage';\r\nimport { ProductTitle } from './ProductTitle';\r\nexport { ProductButtons } from './ProductButtons';\r\nexport { ProductImage } from './ProductImage';\r\nexport { ProductTitle } from './ProductTitle';\r\n\r\nexport const ProductCard: ProductCardHOCProps = Object.assign(ProductCardHOC, {\r\n  Button: ProductButtons,\r\n  Image: ProductImage,\r\n  Title: ProductTitle,\r\n});\r\n\r\nexport default ProductCard;"],"names":["css","ref","insertAt","document","head","getElementsByTagName","style","createElement","type","firstChild","insertBefore","appendChild","styleSheet","cssText","createTextNode","ProductContext","createContext","ProductImage","_ref","img","className","product","useContext","React","styles","productImg","src","alt","ProductTitle","title","_useContext","productTitle","ProductButtons","increaseBy","counter","maxCount","isMaxReached","useCallback","buttonsContainer","buttonMinus","onClick","countLabel","buttonAdd","disabled","Provider","ProductCard","children","initialValues","_useProduct","onChange","_ref$value","value","_useState","useState","count","setCounter","isMounted","useRef","useEffect","current","newValue","Math","max","min","isMaxCountReached","reset","useProduct","productCard","Image","Title","Buttons","Object","assign","ProductCardHOC","Button"],"mappings":"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"}
+{"version":3,"file":"jcd-product-card.cjs.production.min.js","sources":["../node_modules/style-inject/dist/style-inject.es.js","../src/components/ProductContext.tsx","../src/components/ProductImage.tsx","../src/components/ProductTitle.tsx","../src/components/ProductButtons.tsx","../src/components/ProductCard.tsx","../src/hooks/useProduct.ts","../src/components/index.ts"],"sourcesContent":["function styleInject(css, ref) {\n  if ( ref === void 0 ) ref = {};\n  var insertAt = ref.insertAt;\n\n  if (!css || typeof document === 'undefined') { return; }\n\n  var head = document.head || document.getElementsByTagName('head')[0];\n  var style = document.createElement('style');\n  style.type = 'text/css';\n\n  if (insertAt === 'top') {\n    if (head.firstChild) {\n      head.insertBefore(style, head.firstChild);\n    } else {\n      head.appendChild(style);\n    }\n  } else {\n    head.appendChild(style);\n  }\n\n  if (style.styleSheet) {\n    style.styleSheet.cssText = css;\n  } else {\n    style.appendChild(document.createTextNode(css));\n  }\n}\n\nexport default styleInject;\n","// ProductContext.tsx\r\nimport { createContext } from \"react\";\r\nimport { ProductContextProps } from \"../interfaces/interfaces\";\r\n\r\nexport const ProductContext = createContext({} as ProductContextProps);","import React, { useContext } from \"react\";\r\nimport styles from \"../styles/styles.module.css\";\r\n\r\n// import noImages from \"../assets/no-image.jpg\";\r\nimport { ProductContext } from \"./ProductContext\";\r\n\r\nexport interface Props {\r\n\timg?: string;\r\n\tclassName?: string;\r\n\tstyle?: React.CSSProperties;\r\n}\r\nconst DEFAULT_IMAGE =\r\n  \"https://via.placeholder.com/300x200?text=No+Image\";\r\n\r\nexport const ProductImage = ({ img , className, style }: Props) => {\r\n\tconst { product } = useContext(ProductContext);\r\n\tlet imgToShow: string = \"\";\r\n\tif (img) {\r\n\t\timgToShow = img;\r\n\t} else if (product.img) {\r\n\t\timgToShow = product.img;\r\n\t} else {\r\n\t\timgToShow = DEFAULT_IMAGE;\r\n\t}\r\n\r\n\treturn <img className={`\t${styles.productImg} ${className}`} src={imgToShow} alt=\"Product\" style={style} />;\r\n};\r\n","import React, { ReactElement, useContext } from \"react\";\r\nimport styles from \"../styles/styles.module.css\";\r\nimport { ProductContext } from \"./ProductContext\";\r\n\r\nexport interface Props {\r\n\ttitle?: string;\r\n\tclassName?: string;\r\n\tstyle?: React.CSSProperties;\r\n}\r\n\r\nexport const ProductTitle = ({ title, className, style }: Props): ReactElement => {\r\n\tconst { product } = useContext(ProductContext);\r\n\r\n\treturn (\r\n\t\t<span className={`${styles.productTitle} ${className}`} style={style}>\r\n\t\t\t{title || product.title}\r\n\t\t</span>\r\n\t);\r\n};\r\n\r\n\r\n","import React, { useCallback, useContext } from \"react\";\r\nimport styles from \"../styles/styles.module.css\";\r\nimport { ProductContext } from \"./ProductContext\";\r\n\r\nexport interface Props {\r\n\tclassName?: string;\r\n\tstyle?: React.CSSProperties;\r\n\tactiveBtnClass?: string;\r\n}\r\n\r\nexport const ProductButtons = ({ className, style }: Props) => {\r\n\r\n\tconst { increaseBy, counter, maxCount } = useContext(ProductContext);\r\n\r\nconst isMaxReached = useCallback(\r\n\t() => !!maxCount && counter === maxCount, \r\n\t[counter, maxCount],\r\n)\r\n\r\n\treturn (\r\n\t\t<div className={`\t${styles.buttonsContainer} ${className}`} style={style}>\r\n\t\t\t<button className={styles.buttonMinus} onClick={() => increaseBy(-1)}>\r\n\t\t\t\t-\r\n\t\t\t</button>\r\n\t\t\t<div className={styles.countLabel}>{counter}</div>\r\n\r\n\t\t\t<button className={`${styles.buttonAdd} ${ isMaxReached() && styles.disabled}`} onClick={() => increaseBy(1)}>\r\n\t\t\t\t+\r\n\t\t\t</button>\r\n\t\t</div>\r\n\t);\r\n};\r\n","import React, { JSX } from 'react';\r\nimport { useProduct } from '../hooks/useProduct';\r\nimport {\r\n  InitialValues,\r\n  onChangeArgs,\r\n  Product,\r\n  ProductCardHandlers,\r\n} from '../interfaces/interfaces';\r\nimport styles from '../styles/styles.module.css';\r\n\r\nimport { ProductImage } from './ProductImage';\r\nimport { ProductTitle } from './ProductTitle';\r\nimport { ProductButtons } from './ProductButtons';\r\nimport { ProductContext } from './ProductContext';\r\n\r\nconst { Provider } = ProductContext;\r\n\r\nexport interface Props {\r\n  product: Product;\r\n  // children?: ReactElement | ReactElement[];\r\n  children: (args: ProductCardHandlers) => JSX.Element;\r\n  className?: string;\r\n  style?: React.CSSProperties;\r\n  onChange?: (args: onChangeArgs) => void;\r\n  value?: number;\r\n  initialValues?: InitialValues;\r\n}\r\n\r\nexport const ProductCard = ({\r\n  children,\r\n  product,\r\n  className,\r\n  style,\r\n  onChange,\r\n  value,\r\n  initialValues,\r\n}: Props) => {\r\n  const {\r\n    counter,\r\n    increaseBy,\r\n    isMaxCountReached,\r\n    maxCount,\r\n    reset,\r\n  } = useProduct({\r\n    onChange,\r\n    product,\r\n    value,\r\n    initialValues,\r\n  });\r\n\r\n  return (\r\n    <Provider value={{ counter, increaseBy, maxCount, product }}>\r\n      <div className={`${styles.productCard} ${className}`} style={style}>\r\n        {children({\r\n          count: counter,\r\n          isMaxCountReached,\r\n          maxCount: initialValues?.maxCount,\r\n          product,\r\n          increaseBy,\r\n          reset,\r\n        })}\r\n      </div>\r\n    </Provider>\r\n  );\r\n};\r\n\r\nProductCard.Image = ProductImage;\r\nProductCard.Title = ProductTitle;\r\nProductCard.Buttons = ProductButtons;\r\n","import { useEffect, useRef, useState } from \"react\";\r\nimport { InitialValues, onChangeArgs, Product } from \"../interfaces/interfaces\";\r\n\r\ninterface useProductArgs {\r\n\tproduct: Product;\r\n\tonChange?: (args: onChangeArgs) => void;\r\n\tvalue?: number;\r\n\tinitialValues?: InitialValues;\r\n}\r\n\r\nexport const useProduct = ({\r\n\tonChange,\r\n\tproduct,\r\n\tvalue = 0,\r\n\tinitialValues,\r\n}: useProductArgs) => {\r\n\r\n\tconst [counter, setCounter] = useState<number>(initialValues?.count || value);\r\n\r\n\tconst isMounted = useRef(false);\r\n\r\n\tconst increaseBy = (value?: number) => {\r\n\t\tconst amount = value ?? 1;\r\n\t\tlet newValue = Math.max(counter + amount, 0);\r\n\r\n\t\tif (initialValues?.maxCount) {\r\n\t\t\tnewValue = Math.min(newValue, initialValues.maxCount);\r\n\t\t}\r\n\r\n\t\tsetCounter(newValue);\r\n\r\n\t\tonChange && onChange({ count: newValue, product });\r\n\t};\r\n\r\n\tconst reset = () => {\r\n\t\tconst newValue = initialValues?.count || value;\r\n\t\tsetCounter(newValue);\r\n\t\tonChange && onChange({ count: newValue, product });\r\n\r\n\t}\r\n\r\n\tuseEffect(() => {\r\n\t\tif (!isMounted.current) return;\r\n\t\tsetCounter(value);\r\n\t}, [value]);\r\n\r\n\tuseEffect(() => {\r\n\t\tisMounted.current = true;\r\n\t}, []);\r\n\r\n\treturn {\r\n\t\t//Props\r\n\t\tcounter,\r\n\t\tmaxCount: initialValues?.maxCount,\r\n\t\t//Methods\r\n\t\tincreaseBy,\r\n\t\tisMaxCountReached: !!initialValues?.maxCount && counter === initialValues.maxCount,\r\n\t\treset\r\n\t};\r\n};\r\n","import { ProductCard as ProductCardHOC } from './ProductCard';\r\nimport { ProductCardHOCProps } from '../interfaces/interfaces';\r\nimport { ProductButtons } from './ProductButtons';\r\nimport { ProductImage } from './ProductImage';\r\nimport { ProductTitle } from './ProductTitle';\r\nexport { ProductButtons } from './ProductButtons';\r\nexport { ProductImage } from './ProductImage';\r\nexport { ProductTitle } from './ProductTitle';\r\n\r\nexport const ProductCard: ProductCardHOCProps = Object.assign(ProductCardHOC, {\r\n  Button: ProductButtons,\r\n  Image: ProductImage,\r\n  Title: ProductTitle,\r\n});\r\n\r\nexport default ProductCard;"],"names":["css","ref","insertAt","document","head","getElementsByTagName","style","createElement","type","firstChild","insertBefore","appendChild","styleSheet","cssText","createTextNode","ProductContext","createContext","ProductImage","_ref","img","className","product","useContext","React","styles","productImg","src","alt","ProductTitle","title","_useContext","productTitle","ProductButtons","increaseBy","counter","maxCount","isMaxReached","useCallback","buttonsContainer","buttonMinus","onClick","countLabel","buttonAdd","disabled","Provider","ProductCard","children","initialValues","_useProduct","onChange","_ref$value","value","_useState","useState","count","setCounter","isMounted","useRef","useEffect","current","newValue","Math","max","min","isMaxCountReached","reset","useProduct","productCard","Image","Title","Buttons","Object","assign","ProductCardHOC","Button"],"mappings":"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"}

package/dist/jcd-product-card.esm.js

@@ -6,9 +6,6 @@ var useProduct = function useProduct(_ref) {
     _ref$value = _ref.value,
     value = _ref$value === void 0 ? 0 : _ref$value,
     initialValues = _ref.initialValues;
-  // if (initialValues) {
-  // 	value = initialValues.count || value;
-  // }
   var _useState = useState((initialValues == null ? void 0 : initialValues.count) || value),
     counter = _useState[0],
     setCounter = _useState[1];
@@ -33,7 +30,6 @@ var useProduct = function useProduct(_ref) {
       product: product
     });
   };
-  // El use ref se puede usar como un elemento que no tiene dependencias de renderizado
   useEffect(function () {
     if (!isMounted.current) return;
     setCounter(value);
@@ -109,7 +105,6 @@ var ProductImage = function ProductImage(_ref) {
   });
 };
 
-// export const ProductTitle = ({ title, className }: { title?: string, className?: string }): ReactElement => {
 var ProductTitle = function ProductTitle(_ref) {
   var title = _ref.title,
     className = _ref.className,
@@ -129,13 +124,9 @@ var ProductButtons = function ProductButtons(_ref) {
     increaseBy = _useContext.increaseBy,
     counter = _useContext.counter,
     maxCount = _useContext.maxCount;
-  //TODO: Una función isMaxReached = useCallback, dependencias [counter, maxCounter]
-  //? True si el count === maxCount, caso contrario False
   var isMaxReached = useCallback(function () {
     return !!maxCount && counter === maxCount;
-  },
-  // retorna true o false
-  [counter, maxCount]);
+  }, [counter, maxCount]);
   return React.createElement("div", {
     className: "\t" + styles.buttonsContainer + " " + className,
     style: style

package/dist/jcd-product-card.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"jcd-product-card.esm.js","sources":["../src/hooks/useProduct.ts","../node_modules/style-inject/dist/style-inject.es.js","../src/components/ProductContext.tsx","../src/components/ProductImage.tsx","../src/components/ProductTitle.tsx","../src/components/ProductButtons.tsx","../src/components/ProductCard.tsx","../src/components/index.ts"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\r\nimport { InitialValues, onChangeArgs, Product } from \"../interfaces/interfaces\";\r\n\r\ninterface useProductArgs {\r\n\tproduct: Product;\r\n\tonChange?: (args: onChangeArgs) => void;\r\n\tvalue?: number;\r\n\tinitialValues?: InitialValues;\r\n}\r\n\r\nexport const useProduct = ({\r\n\tonChange,\r\n\tproduct,\r\n\tvalue = 0,\r\n\tinitialValues,\r\n}: useProductArgs) => {\r\n\t// if (initialValues) {\r\n\t// \tvalue = initialValues.count || value;\r\n\t// }\r\n\r\n\tconst [counter, setCounter] = useState<number>(initialValues?.count || value);\r\n\r\n\tconst isMounted = useRef(false);\r\n\r\n\tconst increaseBy = (value?: number) => {\r\n\t\tconst amount = value ?? 1;\r\n\t\tlet newValue = Math.max(counter + amount, 0);\r\n\r\n\t\tif (initialValues?.maxCount) {\r\n\t\t\tnewValue = Math.min(newValue, initialValues.maxCount);\r\n\t\t}\r\n\r\n\t\tsetCounter(newValue);\r\n\r\n\t\tonChange && onChange({ count: newValue, product });\r\n\t};\r\n\r\n\tconst reset = () => {\r\n\t\tconst newValue = initialValues?.count || value;\r\n\t\tsetCounter(newValue);\r\n\t\tonChange && onChange({ count: newValue, product });\r\n\r\n\t}\r\n\r\n\t// El use ref se puede usar como un elemento que no tiene dependencias de renderizado\r\n\tuseEffect(() => {\r\n\t\tif (!isMounted.current) return;\r\n\t\tsetCounter(value);\r\n\t}, [value]);\r\n\r\n\tuseEffect(() => {\r\n\t\tisMounted.current = true;\r\n\t}, []);\r\n\r\n\treturn {\r\n\t\t//Props\r\n\t\tcounter,\r\n\t\tmaxCount: initialValues?.maxCount,\r\n\t\t//Methods\r\n\t\tincreaseBy,\r\n\t\tisMaxCountReached: !!initialValues?.maxCount && counter === initialValues.maxCount,\r\n\t\treset\r\n\t};\r\n};\r\n","function styleInject(css, ref) {\n  if ( ref === void 0 ) ref = {};\n  var insertAt = ref.insertAt;\n\n  if (!css || typeof document === 'undefined') { return; }\n\n  var head = document.head || document.getElementsByTagName('head')[0];\n  var style = document.createElement('style');\n  style.type = 'text/css';\n\n  if (insertAt === 'top') {\n    if (head.firstChild) {\n      head.insertBefore(style, head.firstChild);\n    } else {\n      head.appendChild(style);\n    }\n  } else {\n    head.appendChild(style);\n  }\n\n  if (style.styleSheet) {\n    style.styleSheet.cssText = css;\n  } else {\n    style.appendChild(document.createTextNode(css));\n  }\n}\n\nexport default styleInject;\n","// ProductContext.tsx\r\nimport { createContext } from \"react\";\r\nimport { ProductContextProps } from \"../interfaces/interfaces\";\r\n\r\nexport const ProductContext = createContext({} as ProductContextProps);","import React, { useContext } from \"react\";\r\nimport styles from \"../styles/styles.module.css\";\r\n\r\n// import noImages from \"../assets/no-image.jpg\";\r\nimport { ProductContext } from \"./ProductContext\";\r\n\r\nexport interface Props {\r\n\timg?: string;\r\n\tclassName?: string;\r\n\tstyle?: React.CSSProperties;\r\n}\r\nconst DEFAULT_IMAGE =\r\n  \"https://via.placeholder.com/300x200?text=No+Image\";\r\n\r\nexport const ProductImage = ({ img , className, style }: Props) => {\r\n\tconst { product } = useContext(ProductContext);\r\n\tlet imgToShow: string = \"\";\r\n\tif (img) {\r\n\t\timgToShow = img;\r\n\t} else if (product.img) {\r\n\t\timgToShow = product.img;\r\n\t} else {\r\n\t\timgToShow = DEFAULT_IMAGE;\r\n\t}\r\n\r\n\treturn <img className={`\t${styles.productImg} ${className}`} src={imgToShow} alt=\"Product\" style={style} />;\r\n};\r\n","import React, { ReactElement, useContext } from \"react\";\r\nimport styles from \"../styles/styles.module.css\";\r\nimport { ProductContext } from \"./ProductContext\";\r\n\r\nexport interface Props {\r\n\ttitle?: string;\r\n\tclassName?: string;\r\n\tstyle?: React.CSSProperties;\r\n}\r\n\r\n// export const ProductTitle = ({ title, className }: { title?: string, className?: string }): ReactElement => {\r\nexport const ProductTitle = ({ title, className, style }: Props): ReactElement => {\r\n\tconst { product } = useContext(ProductContext);\r\n\r\n\treturn (\r\n\t\t<span className={`${styles.productTitle} ${className}`} style={style}>\r\n\t\t\t{title || product.title}\r\n\t\t</span>\r\n\t);\r\n};\r\n\r\n\r\n","import React, { useCallback, useContext } from \"react\";\r\nimport styles from \"../styles/styles.module.css\";\r\nimport { ProductContext } from \"./ProductContext\";\r\n\r\nexport interface Props {\r\n\t// className para poder recibir estilos personalizados\r\n\tclassName?: string;\r\n\tstyle?: React.CSSProperties;\r\n\tactiveBtnClass?: string;\r\n}\r\n\r\nexport const ProductButtons = ({ className, style }: Props) => {\r\n\r\n\tconst { increaseBy, counter, maxCount } = useContext(ProductContext);\r\n\r\n//TODO: Una función isMaxReached = useCallback, dependencias [counter, maxCounter]\r\n//? True si el count === maxCount, caso contrario False\r\n\r\nconst isMaxReached = useCallback(\r\n\t() => !!maxCount && counter === maxCount, // retorna true o false\r\n\t[counter, maxCount],\r\n)\r\n\r\n\treturn (\r\n\t\t<div className={`\t${styles.buttonsContainer} ${className}`} style={style}>\r\n\t\t\t<button className={styles.buttonMinus} onClick={() => increaseBy(-1)}>\r\n\t\t\t\t-\r\n\t\t\t</button>\r\n\t\t\t<div className={styles.countLabel}>{counter}</div>\r\n\r\n\t\t\t<button className={`${styles.buttonAdd} ${ isMaxReached() && styles.disabled}`} onClick={() => increaseBy(1)}>\r\n\t\t\t\t+\r\n\t\t\t</button>\r\n\t\t</div>\r\n\t);\r\n};\r\n","import React, { JSX } from 'react';\r\nimport { useProduct } from '../hooks/useProduct';\r\nimport {\r\n  InitialValues,\r\n  onChangeArgs,\r\n  Product,\r\n  ProductCardHandlers,\r\n} from '../interfaces/interfaces';\r\nimport styles from '../styles/styles.module.css';\r\n\r\nimport { ProductImage } from './ProductImage';\r\nimport { ProductTitle } from './ProductTitle';\r\nimport { ProductButtons } from './ProductButtons';\r\nimport { ProductContext } from './ProductContext';\r\n\r\nconst { Provider } = ProductContext;\r\n\r\nexport interface Props {\r\n  product: Product;\r\n  // children?: ReactElement | ReactElement[];\r\n  children: (args: ProductCardHandlers) => JSX.Element;\r\n  className?: string;\r\n  style?: React.CSSProperties;\r\n  onChange?: (args: onChangeArgs) => void;\r\n  value?: number;\r\n  initialValues?: InitialValues;\r\n}\r\n\r\nexport const ProductCard = ({\r\n  children,\r\n  product,\r\n  className,\r\n  style,\r\n  onChange,\r\n  value,\r\n  initialValues,\r\n}: Props) => {\r\n  const {\r\n    counter,\r\n    increaseBy,\r\n    isMaxCountReached,\r\n    maxCount,\r\n    reset,\r\n  } = useProduct({\r\n    onChange,\r\n    product,\r\n    value,\r\n    initialValues,\r\n  });\r\n\r\n  return (\r\n    <Provider value={{ counter, increaseBy, maxCount, product }}>\r\n      <div className={`${styles.productCard} ${className}`} style={style}>\r\n        {/* {children} */}\r\n        {children({\r\n          count: counter,\r\n          isMaxCountReached,\r\n          maxCount: initialValues?.maxCount,\r\n          product,\r\n          increaseBy,\r\n          reset,\r\n        })}\r\n      </div>\r\n    </Provider>\r\n  );\r\n};\r\n\r\nProductCard.Image = ProductImage;\r\nProductCard.Title = ProductTitle;\r\nProductCard.Buttons = ProductButtons;\r\n","import { ProductCard as ProductCardHOC } from './ProductCard';\r\nimport { ProductCardHOCProps } from '../interfaces/interfaces';\r\nimport { ProductButtons } from './ProductButtons';\r\nimport { ProductImage } from './ProductImage';\r\nimport { ProductTitle } from './ProductTitle';\r\nexport { ProductButtons } from './ProductButtons';\r\nexport { ProductImage } from './ProductImage';\r\nexport { ProductTitle } from './ProductTitle';\r\n\r\nexport const ProductCard: ProductCardHOCProps = Object.assign(ProductCardHOC, {\r\n  Button: ProductButtons,\r\n  Image: ProductImage,\r\n  Title: ProductTitle,\r\n});\r\n\r\nexport default ProductCard;"],"names":["useProduct","_ref","onChange","product","_ref$value","value","initialValues","_useState","useState","count","counter","setCounter","isMounted","useRef","increaseBy","amount","newValue","Math","max","maxCount","min","reset","useEffect","current","isMaxCountReached","ProductContext","createContext","DEFAULT_IMAGE","ProductImage","img","className","style","_useContext","useContext","imgToShow","React","styles","productImg","src","alt","ProductTitle","title","productTitle","ProductButtons","isMaxReached","useCallback","buttonsContainer","buttonMinus","onClick","countLabel","buttonAdd","disabled","Provider","ProductCard","children","_useProduct","productCard","Image","Title","Buttons","Object","assign","ProductCardHOC","Button"],"mappings":"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"}
+{"version":3,"file":"jcd-product-card.esm.js","sources":["../src/hooks/useProduct.ts","../node_modules/style-inject/dist/style-inject.es.js","../src/components/ProductContext.tsx","../src/components/ProductImage.tsx","../src/components/ProductTitle.tsx","../src/components/ProductButtons.tsx","../src/components/ProductCard.tsx","../src/components/index.ts"],"sourcesContent":["import { useEffect, useRef, useState } from \"react\";\r\nimport { InitialValues, onChangeArgs, Product } from \"../interfaces/interfaces\";\r\n\r\ninterface useProductArgs {\r\n\tproduct: Product;\r\n\tonChange?: (args: onChangeArgs) => void;\r\n\tvalue?: number;\r\n\tinitialValues?: InitialValues;\r\n}\r\n\r\nexport const useProduct = ({\r\n\tonChange,\r\n\tproduct,\r\n\tvalue = 0,\r\n\tinitialValues,\r\n}: useProductArgs) => {\r\n\r\n\tconst [counter, setCounter] = useState<number>(initialValues?.count || value);\r\n\r\n\tconst isMounted = useRef(false);\r\n\r\n\tconst increaseBy = (value?: number) => {\r\n\t\tconst amount = value ?? 1;\r\n\t\tlet newValue = Math.max(counter + amount, 0);\r\n\r\n\t\tif (initialValues?.maxCount) {\r\n\t\t\tnewValue = Math.min(newValue, initialValues.maxCount);\r\n\t\t}\r\n\r\n\t\tsetCounter(newValue);\r\n\r\n\t\tonChange && onChange({ count: newValue, product });\r\n\t};\r\n\r\n\tconst reset = () => {\r\n\t\tconst newValue = initialValues?.count || value;\r\n\t\tsetCounter(newValue);\r\n\t\tonChange && onChange({ count: newValue, product });\r\n\r\n\t}\r\n\r\n\tuseEffect(() => {\r\n\t\tif (!isMounted.current) return;\r\n\t\tsetCounter(value);\r\n\t}, [value]);\r\n\r\n\tuseEffect(() => {\r\n\t\tisMounted.current = true;\r\n\t}, []);\r\n\r\n\treturn {\r\n\t\t//Props\r\n\t\tcounter,\r\n\t\tmaxCount: initialValues?.maxCount,\r\n\t\t//Methods\r\n\t\tincreaseBy,\r\n\t\tisMaxCountReached: !!initialValues?.maxCount && counter === initialValues.maxCount,\r\n\t\treset\r\n\t};\r\n};\r\n","function styleInject(css, ref) {\n  if ( ref === void 0 ) ref = {};\n  var insertAt = ref.insertAt;\n\n  if (!css || typeof document === 'undefined') { return; }\n\n  var head = document.head || document.getElementsByTagName('head')[0];\n  var style = document.createElement('style');\n  style.type = 'text/css';\n\n  if (insertAt === 'top') {\n    if (head.firstChild) {\n      head.insertBefore(style, head.firstChild);\n    } else {\n      head.appendChild(style);\n    }\n  } else {\n    head.appendChild(style);\n  }\n\n  if (style.styleSheet) {\n    style.styleSheet.cssText = css;\n  } else {\n    style.appendChild(document.createTextNode(css));\n  }\n}\n\nexport default styleInject;\n","// ProductContext.tsx\r\nimport { createContext } from \"react\";\r\nimport { ProductContextProps } from \"../interfaces/interfaces\";\r\n\r\nexport const ProductContext = createContext({} as ProductContextProps);","import React, { useContext } from \"react\";\r\nimport styles from \"../styles/styles.module.css\";\r\n\r\n// import noImages from \"../assets/no-image.jpg\";\r\nimport { ProductContext } from \"./ProductContext\";\r\n\r\nexport interface Props {\r\n\timg?: string;\r\n\tclassName?: string;\r\n\tstyle?: React.CSSProperties;\r\n}\r\nconst DEFAULT_IMAGE =\r\n  \"https://via.placeholder.com/300x200?text=No+Image\";\r\n\r\nexport const ProductImage = ({ img , className, style }: Props) => {\r\n\tconst { product } = useContext(ProductContext);\r\n\tlet imgToShow: string = \"\";\r\n\tif (img) {\r\n\t\timgToShow = img;\r\n\t} else if (product.img) {\r\n\t\timgToShow = product.img;\r\n\t} else {\r\n\t\timgToShow = DEFAULT_IMAGE;\r\n\t}\r\n\r\n\treturn <img className={`\t${styles.productImg} ${className}`} src={imgToShow} alt=\"Product\" style={style} />;\r\n};\r\n","import React, { ReactElement, useContext } from \"react\";\r\nimport styles from \"../styles/styles.module.css\";\r\nimport { ProductContext } from \"./ProductContext\";\r\n\r\nexport interface Props {\r\n\ttitle?: string;\r\n\tclassName?: string;\r\n\tstyle?: React.CSSProperties;\r\n}\r\n\r\nexport const ProductTitle = ({ title, className, style }: Props): ReactElement => {\r\n\tconst { product } = useContext(ProductContext);\r\n\r\n\treturn (\r\n\t\t<span className={`${styles.productTitle} ${className}`} style={style}>\r\n\t\t\t{title || product.title}\r\n\t\t</span>\r\n\t);\r\n};\r\n\r\n\r\n","import React, { useCallback, useContext } from \"react\";\r\nimport styles from \"../styles/styles.module.css\";\r\nimport { ProductContext } from \"./ProductContext\";\r\n\r\nexport interface Props {\r\n\tclassName?: string;\r\n\tstyle?: React.CSSProperties;\r\n\tactiveBtnClass?: string;\r\n}\r\n\r\nexport const ProductButtons = ({ className, style }: Props) => {\r\n\r\n\tconst { increaseBy, counter, maxCount } = useContext(ProductContext);\r\n\r\nconst isMaxReached = useCallback(\r\n\t() => !!maxCount && counter === maxCount, \r\n\t[counter, maxCount],\r\n)\r\n\r\n\treturn (\r\n\t\t<div className={`\t${styles.buttonsContainer} ${className}`} style={style}>\r\n\t\t\t<button className={styles.buttonMinus} onClick={() => increaseBy(-1)}>\r\n\t\t\t\t-\r\n\t\t\t</button>\r\n\t\t\t<div className={styles.countLabel}>{counter}</div>\r\n\r\n\t\t\t<button className={`${styles.buttonAdd} ${ isMaxReached() && styles.disabled}`} onClick={() => increaseBy(1)}>\r\n\t\t\t\t+\r\n\t\t\t</button>\r\n\t\t</div>\r\n\t);\r\n};\r\n","import React, { JSX } from 'react';\r\nimport { useProduct } from '../hooks/useProduct';\r\nimport {\r\n  InitialValues,\r\n  onChangeArgs,\r\n  Product,\r\n  ProductCardHandlers,\r\n} from '../interfaces/interfaces';\r\nimport styles from '../styles/styles.module.css';\r\n\r\nimport { ProductImage } from './ProductImage';\r\nimport { ProductTitle } from './ProductTitle';\r\nimport { ProductButtons } from './ProductButtons';\r\nimport { ProductContext } from './ProductContext';\r\n\r\nconst { Provider } = ProductContext;\r\n\r\nexport interface Props {\r\n  product: Product;\r\n  // children?: ReactElement | ReactElement[];\r\n  children: (args: ProductCardHandlers) => JSX.Element;\r\n  className?: string;\r\n  style?: React.CSSProperties;\r\n  onChange?: (args: onChangeArgs) => void;\r\n  value?: number;\r\n  initialValues?: InitialValues;\r\n}\r\n\r\nexport const ProductCard = ({\r\n  children,\r\n  product,\r\n  className,\r\n  style,\r\n  onChange,\r\n  value,\r\n  initialValues,\r\n}: Props) => {\r\n  const {\r\n    counter,\r\n    increaseBy,\r\n    isMaxCountReached,\r\n    maxCount,\r\n    reset,\r\n  } = useProduct({\r\n    onChange,\r\n    product,\r\n    value,\r\n    initialValues,\r\n  });\r\n\r\n  return (\r\n    <Provider value={{ counter, increaseBy, maxCount, product }}>\r\n      <div className={`${styles.productCard} ${className}`} style={style}>\r\n        {children({\r\n          count: counter,\r\n          isMaxCountReached,\r\n          maxCount: initialValues?.maxCount,\r\n          product,\r\n          increaseBy,\r\n          reset,\r\n        })}\r\n      </div>\r\n    </Provider>\r\n  );\r\n};\r\n\r\nProductCard.Image = ProductImage;\r\nProductCard.Title = ProductTitle;\r\nProductCard.Buttons = ProductButtons;\r\n","import { ProductCard as ProductCardHOC } from './ProductCard';\r\nimport { ProductCardHOCProps } from '../interfaces/interfaces';\r\nimport { ProductButtons } from './ProductButtons';\r\nimport { ProductImage } from './ProductImage';\r\nimport { ProductTitle } from './ProductTitle';\r\nexport { ProductButtons } from './ProductButtons';\r\nexport { ProductImage } from './ProductImage';\r\nexport { ProductTitle } from './ProductTitle';\r\n\r\nexport const ProductCard: ProductCardHOCProps = Object.assign(ProductCardHOC, {\r\n  Button: ProductButtons,\r\n  Image: ProductImage,\r\n  Title: ProductTitle,\r\n});\r\n\r\nexport default ProductCard;"],"names":["useProduct","_ref","onChange","product","_ref$value","value","initialValues","_useState","useState","count","counter","setCounter","isMounted","useRef","increaseBy","amount","newValue","Math","max","maxCount","min","reset","useEffect","current","isMaxCountReached","ProductContext","createContext","DEFAULT_IMAGE","ProductImage","img","className","style","_useContext","useContext","imgToShow","React","styles","productImg","src","alt","ProductTitle","title","productTitle","ProductButtons","isMaxReached","useCallback","buttonsContainer","buttonMinus","onClick","countLabel","buttonAdd","disabled","Provider","ProductCard","children","_useProduct","productCard","Image","Title","Buttons","Object","assign","ProductCardHOC","Button"],"mappings":"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"}

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.0.1",
+  "version": "1.0.0-rc",
   "license": "MIT",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",

package/src/components/ProductButtons.tsx

@@ -3,7 +3,6 @@ import styles from "../styles/styles.module.css";
 import { ProductContext } from "./ProductContext";
 
 export interface Props {
-	// className para poder recibir estilos personalizados
 	className?: string;
 	style?: React.CSSProperties;
 	activeBtnClass?: string;
@@ -13,11 +12,8 @@ export const ProductButtons = ({ className, style }: Props) => {
 
 	const { increaseBy, counter, maxCount } = useContext(ProductContext);
 
-//TODO: Una función isMaxReached = useCallback, dependencias [counter, maxCounter]
-//? True si el count === maxCount, caso contrario False
-
 const isMaxReached = useCallback(
-	() => !!maxCount && counter === maxCount, // retorna true o false
+	() => !!maxCount && counter === maxCount, 
 	[counter, maxCount],
 )
 

package/src/components/ProductCard.tsx

@@ -51,7 +51,6 @@ export const ProductCard = ({
   return (
     <Provider value={{ counter, increaseBy, maxCount, product }}>
       <div className={`${styles.productCard} ${className}`} style={style}>
-        {/* {children} */}
         {children({
           count: counter,
           isMaxCountReached,

package/src/components/ProductTitle.tsx

@@ -8,7 +8,6 @@ export interface Props {
 	style?: React.CSSProperties;
 }
 
-// export const ProductTitle = ({ title, className }: { title?: string, className?: string }): ReactElement => {
 export const ProductTitle = ({ title, className, style }: Props): ReactElement => {
 	const { product } = useContext(ProductContext);
 

package/src/hooks/useProduct.ts

@@ -14,9 +14,6 @@ export const useProduct = ({
 	value = 0,
 	initialValues,
 }: useProductArgs) => {
-	// if (initialValues) {
-	// 	value = initialValues.count || value;
-	// }
 
 	const [counter, setCounter] = useState<number>(initialValues?.count || value);
 
@@ -42,7 +39,6 @@ export const useProduct = ({
 
 	}
 
-	// El use ref se puede usar como un elemento que no tiene dependencias de renderizado
 	useEffect(() => {
 		if (!isMounted.current) return;
 		setCounter(value);