@vincentgraul/react-components 1.0.6 → 1.0.7

package/build/esm/node_modules/which-boxed-primitive/index.js

@@ -1,38 +1 @@
-import isString$1 from '../is-string/index.js';
-import isNumberObject from '../is-number-object/index.js';
-import isBooleanObject from '../is-boolean-object/index.js';
-import '../is-symbol/index.js';
-import '../is-bigint/index.js';
-import { i as isSymbol$1 } from '../../_virtual/index6.js';
-import { i as isBigint } from '../../_virtual/index7.js';
-
-var isString = isString$1;
-var isNumber = isNumberObject;
-var isBoolean = isBooleanObject;
-var isSymbol = isSymbol$1.exports;
-var isBigInt = isBigint.exports;
-
-// eslint-disable-next-line consistent-return
-var whichBoxedPrimitive = function whichBoxedPrimitive(value) {
-	// eslint-disable-next-line eqeqeq
-	if (value == null || (typeof value !== 'object' && typeof value !== 'function')) {
-		return null;
-	}
-	if (isString(value)) {
-		return 'String';
-	}
-	if (isNumber(value)) {
-		return 'Number';
-	}
-	if (isBoolean(value)) {
-		return 'Boolean';
-	}
-	if (isSymbol(value)) {
-		return 'Symbol';
-	}
-	if (isBigInt(value)) {
-		return 'BigInt';
-	}
-};
-
-export { whichBoxedPrimitive as default };
+import i from"../is-string/index.js";import o from"../is-number-object/index.js";import t from"../is-boolean-object/index.js";import"../is-symbol/index.js";import"../is-bigint/index.js";import{i as r}from"../../_virtual/index6.js";import{i as e}from"../../_virtual/index7.js";var n=i,s=o,m=t,p=r.exports,l=e.exports,f=function(i){return null==i||"object"!=typeof i&&"function"!=typeof i?null:n(i)?"String":s(i)?"Number":m(i)?"Boolean":p(i)?"Symbol":l(i)?"BigInt":void 0};export{f as default};

package/build/esm/node_modules/which-collection/index.js

@@ -1,30 +1 @@
-import isMap$1 from '../is-map/index.js';
-import isSet$1 from '../is-set/index.js';
-import isWeakmap from '../is-weakmap/index.js';
-import '../is-weakset/index.js';
-import { i as isWeakset } from '../../_virtual/index8.js';
-
-var isMap = isMap$1;
-var isSet = isSet$1;
-var isWeakMap = isWeakmap;
-var isWeakSet = isWeakset.exports;
-
-var whichCollection = function whichCollection(value) {
-	if (value && typeof value === 'object') {
-		if (isMap(value)) {
-			return 'Map';
-		}
-		if (isSet(value)) {
-			return 'Set';
-		}
-		if (isWeakMap(value)) {
-			return 'WeakMap';
-		}
-		if (isWeakSet(value)) {
-			return 'WeakSet';
-		}
-	}
-	return false;
-};
-
-export { whichCollection as default };
+import e from"../is-map/index.js";import r from"../is-set/index.js";import i from"../is-weakmap/index.js";import"../is-weakset/index.js";import{i as t}from"../../_virtual/index8.js";var o=e,s=r,a=i,f=t.exports,n=function(e){if(e&&"object"==typeof e){if(o(e))return"Map";if(s(e))return"Set";if(a(e))return"WeakMap";if(f(e))return"WeakSet"}return!1};export{n as default};

package/build/esm/node_modules/which-typed-array/index.js

@@ -1,63 +1 @@
-import { commonjsGlobal } from '../../_virtual/_commonjsHelpers.js';
-import forEach_1 from '../for-each/index.js';
-import availableTypedArrays$1 from '../available-typed-arrays/index.js';
-import callBound$1 from '../call-bind/callBound.js';
-import shams from '../has-tostringtag/shams.js';
-import { __require as requireGetOwnPropertyDescriptor } from '../es-abstract/helpers/getOwnPropertyDescriptor.js';
-import { __require as requireIsTypedArray } from '../is-typed-array/index.js';
-
-var forEach = forEach_1;
-var availableTypedArrays = availableTypedArrays$1;
-var callBound = callBound$1;
-
-var $toString = callBound('Object.prototype.toString');
-var hasToStringTag = shams();
-
-var g = typeof globalThis === 'undefined' ? commonjsGlobal : globalThis;
-var typedArrays = availableTypedArrays();
-
-var $slice = callBound('String.prototype.slice');
-var toStrTags = {};
-var gOPD = requireGetOwnPropertyDescriptor();
-var getPrototypeOf = Object.getPrototypeOf; // require('getprototypeof');
-if (hasToStringTag && gOPD && getPrototypeOf) {
-	forEach(typedArrays, function (typedArray) {
-		if (typeof g[typedArray] === 'function') {
-			var arr = new g[typedArray]();
-			if (Symbol.toStringTag in arr) {
-				var proto = getPrototypeOf(arr);
-				var descriptor = gOPD(proto, Symbol.toStringTag);
-				if (!descriptor) {
-					var superProto = getPrototypeOf(proto);
-					descriptor = gOPD(superProto, Symbol.toStringTag);
-				}
-				toStrTags[typedArray] = descriptor.get;
-			}
-		}
-	});
-}
-
-var tryTypedArrays = function tryAllTypedArrays(value) {
-	var foundName = false;
-	forEach(toStrTags, function (getter, typedArray) {
-		if (!foundName) {
-			try {
-				var name = getter.call(value);
-				if (name === typedArray) {
-					foundName = name;
-				}
-			} catch (e) {}
-		}
-	});
-	return foundName;
-};
-
-var isTypedArray = requireIsTypedArray();
-
-var whichTypedArray = function whichTypedArray(value) {
-	if (!isTypedArray(value)) { return false; }
-	if (!hasToStringTag || !(Symbol.toStringTag in value)) { return $slice($toString(value), 8, -1); }
-	return tryTypedArrays(value);
-};
-
-export { whichTypedArray as default };
+import{commonjsGlobal as r}from"../../_virtual/_commonjsHelpers.js";import t from"../for-each/index.js";import o from"../available-typed-arrays/index.js";import i from"../call-bind/callBound.js";import e from"../has-tostringtag/shams.js";import{__require as a}from"../es-abstract/helpers/getOwnPropertyDescriptor.js";import{__require as n}from"../is-typed-array/index.js";var s=t,f=o,l=i,m=l("Object.prototype.toString"),p=e(),c="undefined"==typeof globalThis?r:globalThis,g=f(),y=l("String.prototype.slice"),u={},b=a(),d=Object.getPrototypeOf;p&&b&&d&&s(g,(function(r){if("function"==typeof c[r]){var t=new c[r];if(Symbol.toStringTag in t){var o=d(t),i=b(o,Symbol.toStringTag);if(!i){var e=d(o);i=b(e,Symbol.toStringTag)}u[r]=i.get}}}));var j=n(),S=function(r){return!!j(r)&&(p&&Symbol.toStringTag in r?function(r){var t=!1;return s(u,(function(o,i){if(!t)try{var e=o.call(r);e===i&&(t=e)}catch(r){}})),t}(r):y(m(r),8,-1))};export{S as default};

package/build/esm/src/index.js

@@ -1,8 +1 @@
-export { default as useMatchDevice } from './match-device/useMatchDevice.js';
-export { defaultBreakpoints, default as useMatchResolution } from './match-resolution/useMatchResolution.js';
-export { default as mountReactHook } from './mount-react-hook/mountReactHook.js';
-export { ArrowPosition, default as NumberedPagination } from './numbered-pagination/NumberedPagination.js';
-export { default as usePagination } from './pagination/usePagination.js';
-export { default as useScrollTo } from './scroll-to/useScrollTo.js';
-export { default as Table, Td, Th, Tr } from './table/Table.js';
-export { default as useVisible } from './visible/useVisible.js';
+export{default as useMatchDevice}from"./match-device/useMatchDevice.js";export{defaultBreakpoints,default as useMatchResolution}from"./match-resolution/useMatchResolution.js";export{default as mountReactHook}from"./mount-react-hook/mountReactHook.js";export{ArrowPosition,default as NumberedPagination}from"./numbered-pagination/NumberedPagination.js";export{default as usePagination}from"./pagination/usePagination.js";export{default as useScrollTo}from"./scroll-to/useScrollTo.js";export{default as Table,Td,Th,Tr}from"./table/Table.js";export{default as useVisible}from"./visible/useVisible.js";

package/build/esm/src/match-device/useMatchDevice.js

@@ -1,28 +1 @@
-import { useState, useEffect } from 'react';
-import UAParser from '../../node_modules/ua-parser-js/src/ua-parser.js';
-
-function useMatchDevice(UA) {
-    const isClientSide = typeof window !== "undefined";
-    const compute = () => {
-        const parser = new UAParser.UAParser(UA);
-        const { type } = parser.getDevice();
-        const device = {
-            isMobile: type === "mobile",
-            isTablet: type === "tablet",
-            isMobileOrTablet: false,
-            isDesktop: !type,
-        };
-        device.isMobileOrTablet = device.isMobile || device.isTablet;
-        return device;
-    };
-    if (!isClientSide) {
-        return compute();
-    }
-    const [device, setDevice] = useState(compute());
-    useEffect(() => {
-        setDevice(compute());
-    }, [UA]);
-    return device;
-}
-
-export { useMatchDevice as default };
+import{useState as e,useEffect as t}from"react";import r from"../../node_modules/ua-parser-js/src/ua-parser.js";function i(i){const o="undefined"!=typeof window,s=()=>{const e=new r.UAParser(i),{type:t}=e.getDevice(),o={isMobile:"mobile"===t,isTablet:"tablet"===t,isMobileOrTablet:!1,isDesktop:!t};return o.isMobileOrTablet=o.isMobile||o.isTablet,o};if(!o)return s();const[a,n]=e(s());return t((()=>{n(s())}),[i]),a}export{i as default};

package/build/esm/src/match-resolution/useMatchResolution.js

@@ -1,52 +1 @@
-import { useState, useEffect } from 'react';
-import useMatchDevice from '../match-device/useMatchDevice.js';
-
-const defaultBreakpoints = {
-    desktop: "(min-width: 1281px)",
-    laptop: "(min-width: 1025px) and (max-width: 1280px)",
-    laptopOrUpper: "(min-width: 1025px)",
-    laptopOrLower: "(max-width: 1280px)",
-    tablet: "(min-width: 768px) and (max-width: 1024px)",
-    tabletOrUpper: "(min-width: 768px)",
-    tabletOrLower: "(max-width: 1024px)",
-    largeMobile: "(min-width: 481px) and (max-width: 767px)",
-    largeMobileOrUpper: "(min-width: 481px)",
-    largeMobileOrLower: "(max-width: 767px)",
-    mobile: "(min-width: 320px) and (max-width: 480px)",
-    portrait: "(orientation: portrait)",
-    landscape: "(orientation: landscape)",
-};
-function useMatchResolution(breakpoints = defaultBreakpoints, UA = "") {
-    const isClientSide = typeof window !== "undefined";
-    const { isDesktop, isMobile } = useMatchDevice(UA);
-    const match = (query) => isClientSide && window.matchMedia(query).matches;
-    const compute = () => ({
-        isDesktop: isClientSide ? match(breakpoints.desktop) : isDesktop,
-        isLaptop: isClientSide ? match(breakpoints.laptop) : isDesktop,
-        isLaptopOrUpper: isClientSide ? match(breakpoints.laptopOrUpper) : isDesktop,
-        isLaptopOrLower: isClientSide ? match(breakpoints.laptopOrLower) : false,
-        isTablet: isClientSide ? match(breakpoints.tablet) : isMobile,
-        isTabletOrUpper: isClientSide ? match(breakpoints.tabletOrUpper) : false,
-        isTabletOrLower: isClientSide ? match(breakpoints.tabletOrLower) : isMobile,
-        isLargeMobile: isClientSide ? match(breakpoints.largeMobile) : isMobile,
-        isLargeMobileOrUpper: isClientSide ? match(breakpoints.largeMobileOrUpper) : false,
-        isLargeMobileOrLower: isClientSide ? match(breakpoints.largeMobileOrLower) : isMobile,
-        isMobile: isClientSide ? match(breakpoints.mobile) : isMobile,
-        isPortrait: isClientSide ? match(breakpoints.portrait) : false,
-        isLandscape: isClientSide ? match(breakpoints.landscape) : false,
-    });
-    const [resolution, setResolution] = useState(compute());
-    useEffect(() => {
-        const onResize = () => setResolution(compute());
-        window.addEventListener("resize", onResize);
-        return () => {
-            window.removeEventListener("resize", onResize);
-        };
-    }, []);
-    useEffect(() => {
-        setResolution(compute());
-    }, [breakpoints]);
-    return { resolution, breakpoints, match };
-}
-
-export { useMatchResolution as default, defaultBreakpoints };
+import{useState as e,useEffect as t}from"react";import i from"../match-device/useMatchDevice.js";const r={desktop:"(min-width: 1281px)",laptop:"(min-width: 1025px) and (max-width: 1280px)",laptopOrUpper:"(min-width: 1025px)",laptopOrLower:"(max-width: 1280px)",tablet:"(min-width: 768px) and (max-width: 1024px)",tabletOrUpper:"(min-width: 768px)",tabletOrLower:"(max-width: 1024px)",largeMobile:"(min-width: 481px) and (max-width: 767px)",largeMobileOrUpper:"(min-width: 481px)",largeMobileOrLower:"(max-width: 767px)",mobile:"(min-width: 320px) and (max-width: 480px)",portrait:"(orientation: portrait)",landscape:"(orientation: landscape)"};function p(p=r,a=""){const o="undefined"!=typeof window,{isDesktop:l,isMobile:n}=i(a),d=e=>o&&window.matchMedia(e).matches,s=()=>({isDesktop:o?d(p.desktop):l,isLaptop:o?d(p.laptop):l,isLaptopOrUpper:o?d(p.laptopOrUpper):l,isLaptopOrLower:!!o&&d(p.laptopOrLower),isTablet:o?d(p.tablet):n,isTabletOrUpper:!!o&&d(p.tabletOrUpper),isTabletOrLower:o?d(p.tabletOrLower):n,isLargeMobile:o?d(p.largeMobile):n,isLargeMobileOrUpper:!!o&&d(p.largeMobileOrUpper),isLargeMobileOrLower:o?d(p.largeMobileOrLower):n,isMobile:o?d(p.mobile):n,isPortrait:!!o&&d(p.portrait),isLandscape:!!o&&d(p.landscape)}),[w,m]=e(s());return t((()=>{const e=()=>m(s());return window.addEventListener("resize",e),()=>{window.removeEventListener("resize",e)}}),[]),t((()=>{m(s())}),[p]),{resolution:w,breakpoints:p,match:d}}export{p as default,r as defaultBreakpoints};

package/build/esm/src/mount-react-hook/mountReactHook.js

@@ -1,14 +1 @@
-import '../../node_modules/react/jsx-runtime.js';
-import { render } from '../../node_modules/@testing-library/react/dist/@testing-library/react.esm.js';
-import { j as jsxRuntime } from '../../_virtual/jsx-runtime.js';
-
-function mountReactHook(Component, props = {}) {
-    let value = null;
-    const { container, unmount } = render(jsxRuntime.exports.jsx(Component, Object.assign({}, props, { children: (hookValue) => {
-            value = hookValue;
-            return null;
-        } })));
-    return { container, unmount, value };
-}
-
-export { mountReactHook as default };
+import"../../node_modules/react/jsx-runtime.js";import{render as t}from"../../node_modules/@testing-library/react/dist/@testing-library/react.esm.js";import{j as e}from"../../_virtual/jsx-runtime.js";function n(n,r={}){let s=null;const{container:o,unmount:i}=t(e.exports.jsx(n,Object.assign({},r,{children:t=>(s=t,null)})));return{container:o,unmount:i,value:s}}export{n as default};

package/build/esm/src/numbered-pagination/NumberedPagination.js

@@ -1,20 +1,6 @@
-import '../../node_modules/react/jsx-runtime.js';
-import qe from '../../node_modules/styled-components/dist/styled-components.esm.js';
-import { j as jsxRuntime } from '../../_virtual/jsx-runtime.js';
-
-var ArrowPosition;
-(function (ArrowPosition) {
-    ArrowPosition[ArrowPosition["LEFT"] = 0] = "LEFT";
-    ArrowPosition[ArrowPosition["RIGHT"] = 1] = "RIGHT";
-})(ArrowPosition || (ArrowPosition = {}));
-function NumberedPagination(props) {
-    const { page, total, items, goToFirst, goToLeft, goToRight, goToLast, goToPage, renderSingleArrow, renderDoubleArrow, className = "", } = props;
-    return (jsxRuntime.exports.jsxs(Container, Object.assign({ className: `${className} pagination` }, { children: [page > 1 && (jsxRuntime.exports.jsxs(jsxRuntime.exports.Fragment, { children: [renderDoubleArrow && (jsxRuntime.exports.jsx(Item, Object.assign({ className: "pagination-item pagination-item-arrow pagination-item-double-arrow", onClick: () => goToFirst() }, { children: renderDoubleArrow(ArrowPosition.LEFT) }))), renderSingleArrow && (jsxRuntime.exports.jsx(Item, Object.assign({ className: "pagination-item pagination-item-arrow pagination-item-single-arrow", onClick: () => goToLeft() }, { children: renderSingleArrow(ArrowPosition.LEFT) })))] })), items.map((page, index) => (jsxRuntime.exports.jsx(Item, Object.assign({ className: `pagination-item pagination-item-number ${page === props.page ? "selected" : ""}`, onClick: () => goToPage(page) }, { children: page }), index))), page < total && (jsxRuntime.exports.jsxs(jsxRuntime.exports.Fragment, { children: [renderSingleArrow && (jsxRuntime.exports.jsx(Item, Object.assign({ className: "pagination-item pagination-item-arrow pagination-item-single-arrow", onClick: () => goToRight() }, { children: renderSingleArrow(ArrowPosition.RIGHT) }))), renderDoubleArrow && (jsxRuntime.exports.jsx(Item, Object.assign({ className: "pagination-item pagination-item-arrow pagination-item-double-arrow", onClick: () => goToLast() }, { children: renderDoubleArrow(ArrowPosition.RIGHT) })))] }))] })));
-}
-const Container = qe.div `
+import"../../node_modules/react/jsx-runtime.js";import e from"../../node_modules/styled-components/dist/styled-components.esm.js";import{j as i}from"../../_virtual/jsx-runtime.js";var t;function o(e){const{page:o,total:n,items:r,goToFirst:p,goToLeft:m,goToRight:l,goToLast:c,goToPage:g,renderSingleArrow:d,renderDoubleArrow:x,className:j=""}=e;return i.exports.jsxs(s,Object.assign({className:`${j} pagination`},{children:[o>1&&i.exports.jsxs(i.exports.Fragment,{children:[x&&i.exports.jsx(a,Object.assign({className:"pagination-item pagination-item-arrow pagination-item-double-arrow",onClick:()=>p()},{children:x(t.LEFT)})),d&&i.exports.jsx(a,Object.assign({className:"pagination-item pagination-item-arrow pagination-item-single-arrow",onClick:()=>m()},{children:d(t.LEFT)}))]}),r.map(((t,o)=>i.exports.jsx(a,Object.assign({className:"pagination-item pagination-item-number "+(t===e.page?"selected":""),onClick:()=>g(t)},{children:t}),o))),o<n&&i.exports.jsxs(i.exports.Fragment,{children:[d&&i.exports.jsx(a,Object.assign({className:"pagination-item pagination-item-arrow pagination-item-single-arrow",onClick:()=>l()},{children:d(t.RIGHT)})),x&&i.exports.jsx(a,Object.assign({className:"pagination-item pagination-item-arrow pagination-item-double-arrow",onClick:()=>c()},{children:x(t.RIGHT)}))]})]}))}!function(e){e[e.LEFT=0]="LEFT",e[e.RIGHT=1]="RIGHT"}(t||(t={}));const s=e.div`
   display: flex;
-`;
-const Item = qe.div `
+`,a=e.div`
   &:first-child {
     border-width: 1px 1px 1px 1px;
   }
@@ -24,6 +10,4 @@ const Item = qe.div `
   display: flex;
   align-items: center;
   cursor: pointer;
-`;
-
-export { ArrowPosition, NumberedPagination as default };
+`;export{t as ArrowPosition,o as default};

package/build/esm/src/pagination/usePagination.js

@@ -1,52 +1 @@
-import { useState, useEffect } from 'react';
-
-function usePagination(props) {
-    const { totalRecords, itemNeighbours = 2, minItems = 5, maxRecordsPerPage = 10 } = props;
-    const [page, setPage] = useState(props.page);
-    const [total, setTotal] = useState(0);
-    const [items, setItems] = useState([]);
-    const generateItems = () => {
-        const items = [];
-        const from = Math.max(1, Math.min(page - itemNeighbours, total + 1 - minItems));
-        const to = Math.min(total, Math.max(minItems, page + itemNeighbours));
-        for (let i = from; i <= to; i++) {
-            items.push(i);
-        }
-        return items;
-    };
-    useEffect(() => {
-        setTotal(Math.ceil(totalRecords / maxRecordsPerPage));
-    }, [totalRecords, maxRecordsPerPage]);
-    useEffect(() => {
-        setItems(generateItems());
-    }, [page, total, itemNeighbours, minItems]);
-    const goToPage = (page) => {
-        const currentPage = Math.max(1, Math.min(page, total));
-        setPage(currentPage);
-    };
-    const goToFirst = () => {
-        goToPage(1);
-    };
-    const goToLeft = () => {
-        goToPage(page - 1);
-    };
-    const goToRight = () => {
-        goToPage(page + 1);
-    };
-    const goToLast = () => {
-        goToPage(total);
-    };
-    return {
-        page,
-        total,
-        items,
-        maxRecordsPerPage,
-        goToPage,
-        goToFirst,
-        goToLeft,
-        goToRight,
-        goToLast,
-    };
-}
-
-export { usePagination as default };
+import{useState as t,useEffect as o}from"react";function a(a){const{totalRecords:e,itemNeighbours:r=2,minItems:m=5,maxRecordsPerPage:s=10}=a,[g,i]=t(a.page),[n,c]=t(0),[h,M]=t([]);o((()=>{c(Math.ceil(e/s))}),[e,s]),o((()=>{M((()=>{const t=[],o=Math.max(1,Math.min(g-r,n+1-m)),a=Math.min(n,Math.max(m,g+r));for(let e=o;e<=a;e++)t.push(e);return t})())}),[g,n,r,m]);const u=t=>{const o=Math.max(1,Math.min(t,n));i(o)};return{page:g,total:n,items:h,maxRecordsPerPage:s,goToPage:u,goToFirst:()=>{u(1)},goToLeft:()=>{u(g-1)},goToRight:()=>{u(g+1)},goToLast:()=>{u(n)}}}export{a as default};

package/build/esm/src/scroll-to/useScrollTo.js

@@ -1,14 +1 @@
-function useScrollTo(target) {
-    const isClientSide = typeof window !== "undefined";
-    if (!isClientSide) {
-        return { scrollToTop: () => null };
-    }
-    const scrollToTop = () => {
-        if (target.current) {
-            window.scrollTo(0, target.current.offsetTop);
-        }
-    };
-    return { scrollToTop };
-}
-
-export { useScrollTo as default };
+function o(o){if(!("undefined"!=typeof window))return{scrollToTop:()=>null};return{scrollToTop:()=>{o.current&&window.scrollTo(0,o.current.offsetTop)}}}export{o as default};

package/build/esm/src/table/Table.js

@@ -1,48 +1,23 @@
-import '../../node_modules/react/jsx-runtime.js';
-import qe from '../../node_modules/styled-components/dist/styled-components.esm.js';
-import { j as jsxRuntime } from '../../_virtual/jsx-runtime.js';
-
-function Table(props) {
-    const { columns, records, renderHeader = () => null, renderFooter = () => null, renderColumnsRow = (columns) => (jsxRuntime.exports.jsx("tr", Object.assign({ className: "table-main-columns-row" }, { children: columns }))), renderColumnsCell = (column, key) => (jsxRuntime.exports.jsx(Th, Object.assign({ className: "table-main-columns-cell" }, { children: column.name }), key)), renderRecordsRow = (cells, key) => (jsxRuntime.exports.jsx(Tr, Object.assign({ className: "table-main-records-row" }, { children: cells }), key)), renderRecordsCell = (cell, key) => (jsxRuntime.exports.jsx(Td, Object.assign({ className: "table-main-records-cell" }, { children: cell }), key)), renderRecordsEmptyCell = (key) => (jsxRuntime.exports.jsx(Td, Object.assign({ className: "table-main-records-cell" }, { children: "X" }), key)), renderNoRecords = () => null, className = "", } = props;
-    const displayColumns = () => renderColumnsRow(columns.map((column, index) => renderColumnsCell(column, `column-${index}`)));
-    const displayRows = () => {
-        const columnNames = columns.map((column) => column.name);
-        return records.map((record, rowIndex) => {
-            const cells = columnNames.map((name) => record[name]);
-            return renderRecordsRow(cells.map((cell, cellIndex) => cell
-                ? renderRecordsCell(cell, `cell-${cellIndex}`)
-                : renderRecordsEmptyCell(`cell-${cellIndex}`)), `row-${rowIndex}`);
-        });
-    };
-    return (jsxRuntime.exports.jsxs(Container, Object.assign({ className: `table ${className}` }, { children: [renderHeader(), records.length === 0 ? (renderNoRecords()) : (jsxRuntime.exports.jsx(jsxRuntime.exports.Fragment, { children: jsxRuntime.exports.jsxs(Main, Object.assign({ className: "table-main" }, { children: [jsxRuntime.exports.jsx("thead", Object.assign({ className: "table-main-columns" }, { children: displayColumns() })), jsxRuntime.exports.jsx(TBody, Object.assign({ className: "table-main-records" }, { children: displayRows() }))] })) })), renderFooter()] })));
-}
-const Container = qe.div `
+import"../../node_modules/react/jsx-runtime.js";import e from"../../node_modules/styled-components/dist/styled-components.esm.js";import{j as s}from"../../_virtual/jsx-runtime.js";function r(e){const{columns:r,records:d,renderHeader:m=(()=>null),renderFooter:i=(()=>null),renderColumnsRow:p=(e=>s.exports.jsx("tr",Object.assign({className:"table-main-columns-row"},{children:e}))),renderColumnsCell:x=((e,r)=>s.exports.jsx(n,Object.assign({className:"table-main-columns-cell"},{children:e.name}),r)),renderRecordsRow:b=((e,r)=>s.exports.jsx(o,Object.assign({className:"table-main-records-row"},{children:e}),r)),renderRecordsCell:j=((e,r)=>s.exports.jsx(c,Object.assign({className:"table-main-records-cell"},{children:e}),r)),renderRecordsEmptyCell:u=(e=>s.exports.jsx(c,Object.assign({className:"table-main-records-cell"},{children:"X"}),e)),renderNoRecords:h=(()=>null),className:w=""}=e;return s.exports.jsxs(l,Object.assign({className:`table ${w}`},{children:[m(),0===d.length?h():s.exports.jsx(s.exports.Fragment,{children:s.exports.jsxs(a,Object.assign({className:"table-main"},{children:[s.exports.jsx("thead",Object.assign({className:"table-main-columns"},{children:p(r.map(((e,s)=>x(e,`column-${s}`))))})),s.exports.jsx(t,Object.assign({className:"table-main-records"},{children:(()=>{const e=r.map((e=>e.name));return d.map(((s,r)=>{const l=e.map((e=>s[e]));return b(l.map(((e,s)=>e?j(e,`cell-${s}`):u(`cell-${s}`))),`row-${r}`)}))})()}))]}))}),i()]}))}const l=e.div`
   display: flex;
   flex-flow: column;
-`;
-const Main = qe.table `
+`,a=e.table`
   width: 100%;
   table-layout: fixed;
   border-collapse: collapse;
-`;
-const TBody = qe.tbody `
+`,t=e.tbody`
   user-select: text;
   tr:last-child {
     border: none;
   }
-`;
-const Th = qe.th `
+`,n=e.th`
   padding: 2rem 1rem 1rem 0;
   word-wrap: break-word;
   white-space: nowrap;
-`;
-const Tr = qe.tr `
+`,o=e.tr`
   text-align: center;
   border-bottom: 2px solid black;
-`;
-const Td = qe.td `
+`,c=e.td`
   padding: 2rem 1rem 1rem 0;
   word-wrap: break-word;
-`;
-
-export { Td, Th, Tr, Table as default };
+`;export{c as Td,n as Th,o as Tr,r as default};

package/build/esm/src/visible/useVisible.js

@@ -1,22 +1 @@
-import { useState, useEffect } from 'react';
-
-function useVisible(target) {
-    const [isVisible, setVisibility] = useState(false);
-    const handleObserver = (entry) => {
-        setVisibility(entry.isIntersecting);
-    };
-    useEffect(() => {
-        const observer = new IntersectionObserver(([entry]) => handleObserver(entry));
-        if (target && target.current) {
-            observer.observe(target.current);
-        }
-        return () => {
-            if (target && target.current) {
-                observer.unobserve(target.current);
-            }
-        };
-    }, [target]);
-    return isVisible;
-}
-
-export { useVisible as default };
+import{useState as r,useEffect as e}from"react";function t(t){const[n,c]=r(!1);return e((()=>{const r=new IntersectionObserver((([r])=>(r=>{c(r.isIntersecting)})(r)));return t&&t.current&&r.observe(t.current),()=>{t&&t.current&&r.unobserve(t.current)}}),[t]),n}export{t as default};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vincentgraul/react-components",
-  "version": "1.0.6",
+  "version": "1.0.7",
   "main": "build/esm/src/index.js",
   "module": "build/cjs/src/index.js",
   "exports": {
@@ -104,9 +104,9 @@
     "ua-parser-js": "^1.0.2"
   },
   "devDependencies": {
-    "@rollup/plugin-typescript": "^8.5.0",
-    "@rollup/plugin-node-resolve": "^15.0.1",
     "@rollup/plugin-commonjs": "^23.0.2",
+    "@rollup/plugin-node-resolve": "^15.0.1",
+    "@rollup/plugin-typescript": "^8.5.0",
     "@storybook/addon-actions": "^6.5.12",
     "@storybook/addon-essentials": "^6.5.12",
     "@storybook/addon-links": "^6.5.12",
@@ -121,6 +121,8 @@
     "jest-environment-jsdom": "^29.0.3",
     "prettier": "^2.7.1",
     "rollup": "^2.79.1",
+    "rollup-plugin-peer-deps-external": "^2.2.4",
+    "rollup-plugin-terser": "^7.0.2",
     "ts-jest": "^29.0.2",
     "typedoc": "^0.23.15",
     "typescript": "^4.8.3"