@vincentgraul/react-components 1.0.6 → 1.0.8

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{i as o}from"../is-number-object/index.js";import{i as n}from"../is-boolean-object/index.js";import{i as r}from"../is-symbol/index.js";import{i as s}from"../is-bigint/index.js";var t=i,e=o,m=n,a=r,b=s,f=function(i){return null==i||"object"!=typeof i&&"function"!=typeof i?null:t(i)?"String":e(i)?"Number":m(i)?"Boolean":a(i)?"Symbol":b(i)?"BigInt":void 0};export{f as w};

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{i}from"../is-map/index.js";import{i as e}from"../is-set/index.js";import{i as r}from"../is-weakmap/index.js";import{i as t}from"../is-weakset/index.js";var s=i,a=e,o=r,f=t,n=function(i){if(i&&"object"==typeof i){if(s(i))return"Map";if(a(i))return"Set";if(o(i))return"WeakMap";if(f(i))return"WeakSet"}return!1};export{n as w};

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 t}from"../../_virtual/_commonjsHelpers.js";import{f as o}from"../for-each/index.js";import{a as r}from"../available-typed-arrays/index.js";import{c as i}from"../call-bind/callBound.js";import{g as a}from"../gopd/index.js";import{s as n}from"../has-tostringtag/shams.js";import{i as e}from"../is-typed-array/index.js";var s=o,f=r,m=i,l=a,p=m("Object.prototype.toString"),g=n(),c="undefined"==typeof globalThis?t:globalThis,y=f(),d=m("String.prototype.slice"),b={},j=Object.getPrototypeOf;g&&l&&j&&s(y,(function(t){if("function"==typeof c[t]){var o=new c[t];if(Symbol.toStringTag in o){var r=j(o),i=l(r,Symbol.toStringTag);if(!i){var a=j(r);i=l(a,Symbol.toStringTag)}b[t]=i.get}}}));var u=e,S=function(t){return!!u(t)&&(g&&Symbol.toStringTag in t?function(t){var o=!1;return s(b,(function(r,i){if(!o)try{var a=r.call(t);a===i&&(o=a)}catch(t){}})),o}(t):d(p(t),8,-1))};export{S as w};

package/build/esm/src/index.d.ts

@@ -14,4 +14,8 @@ export { default as Table } from "./table/Table";
 export * from "./table/Table";
 export { default as useVisible } from "./visible/useVisible";
 export * from "./visible/useVisible";
+export { default as useOutsideAlerter } from "./outside-alerter/useOutsideAlerter";
+export * from "./outside-alerter/useOutsideAlerter";
+export { default as Modal } from "./modal/Modal";
+export * from "./modal/Modal";
 //# sourceMappingURL=index.d.ts.map

package/build/esm/src/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAC1E,cAAc,+BAA+B,CAAC;AAE9C,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,uCAAuC,CAAC;AACtF,cAAc,uCAAuC,CAAC;AAEtD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,mCAAmC,CAAC;AAC9E,cAAc,mCAAmC,CAAC;AAElD,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,0CAA0C,CAAC;AACzF,cAAc,0CAA0C,CAAC;AAEzD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,4BAA4B,CAAC;AACtE,cAAc,4BAA4B,CAAC;AAE3C,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACjE,cAAc,yBAAyB,CAAC;AAExC,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,eAAe,CAAC;AACjD,cAAc,eAAe,CAAC;AAE9B,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAC7D,cAAc,sBAAsB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAC1E,cAAc,+BAA+B,CAAC;AAE9C,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,uCAAuC,CAAC;AACtF,cAAc,uCAAuC,CAAC;AAEtD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,mCAAmC,CAAC;AAC9E,cAAc,mCAAmC,CAAC;AAElD,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,0CAA0C,CAAC;AACzF,cAAc,0CAA0C,CAAC;AAEzD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,4BAA4B,CAAC;AACtE,cAAc,4BAA4B,CAAC;AAE3C,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACjE,cAAc,yBAAyB,CAAC;AAExC,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,eAAe,CAAC;AACjD,cAAc,eAAe,CAAC;AAE9B,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAC7D,cAAc,sBAAsB,CAAC;AAErC,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,qCAAqC,CAAC;AACnF,cAAc,qCAAqC,CAAC;AAEpD,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,eAAe,CAAC;AACjD,cAAc,eAAe,CAAC"}

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";export{default as useOutsideAlerter}from"./outside-alerter/useOutsideAlerter.js";export{default as Modal}from"./modal/Modal.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/modal/Modal.d.ts

@@ -0,0 +1,9 @@
+import { ReactNode } from "react";
+interface Props {
+    children: ReactNode;
+    onClickedOutside?: () => void;
+    className?: string;
+}
+export default function Modal(props: Props): JSX.Element | null;
+export {};
+//# sourceMappingURL=Modal.d.ts.map

package/build/esm/src/modal/Modal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../../src/modal/Modal.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,SAAS,EAAqB,MAAM,OAAO,CAAC;AAI5D,UAAU,KAAK;IACb,QAAQ,EAAE,SAAS,CAAC;IACpB,gBAAgB,CAAC,EAAE,MAAM,IAAI,CAAC;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,CAAC,OAAO,UAAU,KAAK,CAAC,KAAK,EAAE,KAAK,GAAG,GAAG,CAAC,OAAO,GAAG,IAAI,CAkB9D"}

package/build/esm/src/modal/Modal.js

@@ -0,0 +1,20 @@
+import{j as e}from"../../node_modules/react/jsx-runtime.js";import{useRef as o,useEffect as r}from"react";import t from"../../node_modules/styled-components/dist/styled-components.esm.js";import s from"../outside-alerter/useOutsideAlerter.js";function n(t){const{className:n,children:a,onClickedOutside:l}=t,m=o(null),c=s(m);return r((()=>{l&&c&&l()}),[c]),e.jsx(d,{className:`modal-overlay ${n}`,children:e.jsx(i,{className:"modal-content",ref:m,children:a})})}const d=t.div`
+  position: fixed;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  background-color: rgba(0, 0, 0, 0.5);
+  overflow-y: auto;
+  z-index: 1;
+`,i=t.div`
+  position: absolute;
+  top: 0;
+  left: 50%;
+  transform: translate(-50%, 0);
+  background-color: #f9fbff;
+  border-radius: 0.5rem;
+  padding: 1rem;
+  z-index: 1;
+  margin: 5rem 0 5rem 0;
+`;export{n as default};

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{j as t}from"../../node_modules/react/jsx-runtime.js";import{render as n}from"../../node_modules/@testing-library/react/dist/@testing-library/react.esm.js";function e(e,r={}){let o=null;const{container:s,unmount:i}=n(t.jsx(e,Object.assign({},r,{children:t=>(o=t,null)})));return{container:s,unmount:i,value:o}}export{e as default};

package/build/esm/src/numbered-pagination/NumberedPagination.d.ts

@@ -9,5 +9,5 @@ export interface NumberedPaginationProps extends Pagination {
     renderDoubleArrow?: (position: ArrowPosition) => ReactNode;
     className?: string;
 }
-export default function NumberedPagination(props: NumberedPaginationProps): JSX.Element;
+export default function NumberedPagination(props: NumberedPaginationProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=NumberedPagination.d.ts.map

package/build/esm/src/numbered-pagination/NumberedPagination.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NumberedPagination.d.ts","sourceRoot":"","sources":["../../../../src/numbered-pagination/NumberedPagination.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEzC,OAAO,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAC;AAEzD,oBAAY,aAAa;IACvB,IAAI,IAAA;IACJ,KAAK,IAAA;CACN;AAED,MAAM,WAAW,uBAAwB,SAAQ,UAAU;IACzD,iBAAiB,CAAC,EAAE,CAAC,QAAQ,EAAE,aAAa,KAAK,SAAS,CAAC;IAC3D,iBAAiB,CAAC,EAAE,CAAC,QAAQ,EAAE,aAAa,KAAK,SAAS,CAAC;IAC3D,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAUD,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,eA0ExE"}
+{"version":3,"file":"NumberedPagination.d.ts","sourceRoot":"","sources":["../../../../src/numbered-pagination/NumberedPagination.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEzC,OAAO,EAAE,UAAU,EAAE,MAAM,6BAA6B,CAAC;AAEzD,oBAAY,aAAa;IACvB,IAAI,IAAA;IACJ,KAAK,IAAA;CACN;AAED,MAAM,WAAW,uBAAwB,SAAQ,UAAU;IACzD,iBAAiB,CAAC,EAAE,CAAC,QAAQ,EAAE,aAAa,KAAK,SAAS,CAAC;IAC3D,iBAAiB,CAAC,EAAE,CAAC,QAAQ,EAAE,aAAa,KAAK,SAAS,CAAC;IAC3D,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAUD,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,2CA0ExE"}

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{j as i}from"../../node_modules/react/jsx-runtime.js";import e from"../../node_modules/styled-components/dist/styled-components.esm.js";var a;function n(e){const{page:n,total:r,items:s,goToFirst:l,goToLeft:m,goToRight:d,goToLast:p,goToPage:c,renderSingleArrow:g,renderDoubleArrow:x,className:T=""}=e;return i.jsxs(o,{className:`${T} pagination`,children:[n>1&&i.jsxs(i.Fragment,{children:[x&&i.jsx(t,{className:"pagination-item pagination-item-arrow pagination-item-double-arrow",onClick:()=>l(),children:x(a.LEFT)}),g&&i.jsx(t,{className:"pagination-item pagination-item-arrow pagination-item-single-arrow",onClick:()=>m(),children:g(a.LEFT)})]}),s.map(((a,n)=>i.jsx(t,{className:"pagination-item pagination-item-number "+(a===e.page?"selected":""),onClick:()=>c(a),children:a},n))),n<r&&i.jsxs(i.Fragment,{children:[g&&i.jsx(t,{className:"pagination-item pagination-item-arrow pagination-item-single-arrow",onClick:()=>d(),children:g(a.RIGHT)}),x&&i.jsx(t,{className:"pagination-item pagination-item-arrow pagination-item-double-arrow",onClick:()=>p(),children:x(a.RIGHT)})]})]})}!function(i){i[i.LEFT=0]="LEFT",i[i.RIGHT=1]="RIGHT"}(a||(a={}));const o=e.div`
   display: flex;
-`;
-const Item = qe.div `
+`,t=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{a as ArrowPosition,n as default};

package/build/esm/src/outside-alerter/useOutsideAlerter.d.ts

@@ -0,0 +1,3 @@
+import { RefObject } from "react";
+export default function useOutsideAlerter(ref: RefObject<HTMLElement>): boolean;
+//# sourceMappingURL=useOutsideAlerter.d.ts.map

package/build/esm/src/outside-alerter/useOutsideAlerter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useOutsideAlerter.d.ts","sourceRoot":"","sources":["../../../../src/outside-alerter/useOutsideAlerter.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAa,SAAS,EAAY,MAAM,OAAO,CAAC;AAEvD,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,GAAG,EAAE,SAAS,CAAC,WAAW,CAAC,GAAG,OAAO,CAqB9E"}

package/build/esm/src/outside-alerter/useOutsideAlerter.js

@@ -0,0 +1 @@
+import{useState as e,useEffect as t}from"react";function n(n){const[r,o]=e(!1),u=e=>{e.target&&n.current&&(n.current.contains(e.target)||o(!0))};return t((()=>(n&&document.addEventListener("mousedown",(e=>u(e))),()=>{document.removeEventListener("mousedown",(e=>u(e)))})),[n]),r}export{n 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{j as e}from"../../node_modules/react/jsx-runtime.js";import r from"../../node_modules/styled-components/dist/styled-components.esm.js";function l(r){const{columns:l,records:t,renderHeader:m=(()=>null),renderFooter:i=(()=>null),renderColumnsRow:p=(r=>e.jsx("tr",{className:"table-main-columns-row",children:r})),renderColumnsCell:u=((r,l)=>e.jsx(o,{className:"table-main-columns-cell",children:r.name},l)),renderRecordsRow:b=((r,l)=>e.jsx(d,{className:"table-main-records-row",children:r},l)),renderRecordsCell:x=((r,l)=>e.jsx(c,{className:"table-main-records-cell",children:r},l)),renderRecordsEmptyCell:h=(r=>e.jsx(c,{className:"table-main-records-cell",children:"X"},r)),renderNoRecords:w=(()=>null),className:j=""}=r;return e.jsxs(s,{className:`table ${j}`,children:[m(),0===t.length?w():e.jsx(e.Fragment,{children:e.jsxs(a,{className:"table-main",children:[e.jsx("thead",{className:"table-main-columns",children:p(l.map(((e,r)=>u(e,`column-${r}`))))}),e.jsx(n,{className:"table-main-records",children:(()=>{const e=l.map((e=>e.name));return t.map(((r,l)=>{const s=e.map((e=>r[e]));return b(s.map(((e,r)=>e?x(e,`cell-${r}`):h(`cell-${r}`))),`row-${l}`)}))})()})]})}),i()]})}const s=r.div`
   display: flex;
   flex-flow: column;
-`;
-const Main = qe.table `
+`,a=r.table`
   width: 100%;
   table-layout: fixed;
   border-collapse: collapse;
-`;
-const TBody = qe.tbody `
+`,n=r.tbody`
   user-select: text;
   tr:last-child {
     border: none;
   }
-`;
-const Th = qe.th `
+`,o=r.th`
   padding: 2rem 1rem 1rem 0;
   word-wrap: break-word;
   white-space: nowrap;
-`;
-const Tr = qe.tr `
+`,d=r.tr`
   text-align: center;
   border-bottom: 2px solid black;
-`;
-const Td = qe.td `
+`,c=r.td`
   padding: 2rem 1rem 1rem 0;
   word-wrap: break-word;
-`;
-
-export { Td, Th, Tr, Table as default };
+`;export{c as Td,o as Th,d as Tr,l 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.8",
   "main": "build/esm/src/index.js",
   "module": "build/cjs/src/index.js",
   "exports": {
@@ -21,20 +21,28 @@
       "require": "./build/cjs/src/numbered-pagination/NumberedPagination.js"
     },
     "./pagination": {
-      "import": "./build/esm/src/pagination/pagination.js",
-      "require": "./build/cjs/src/pagination/pagination.js"
+      "import": "./build/esm/src/pagination/usePagination.js",
+      "require": "./build/cjs/src/pagination/usePagination.js"
     },
     "./scroll-to": {
       "import": "./build/esm/src/scroll-to/useScrollTo.js",
       "require": "./build/cjs/src/scroll-to/useScrollTo.js"
     },
     "./table": {
-      "import": "./build/esm/src/table/table.js",
-      "require": "./build/cjs/src/table/table.js"
+      "import": "./build/esm/src/table/Table.js",
+      "require": "./build/cjs/src/table/Table.js"
     },
     "./visible": {
       "import": "./build/esm/src/visible/useVisible.js",
       "require": "./build/cjs/src/visible/useVisible.js"
+    },
+    "./outside-alerter": {
+      "import": "./build/esm/src/outside-alerter/useOutsideAlerter.js",
+      "require": "./build/cjs/src/outside-alerter/useOutsideAlerter.js"
+    },
+    "./modal": {
+      "import": "./build/esm/src/modal/Modal.js",
+      "require": "./build/cjs/src/modal/Modal.js"
     }
   },
   "typesVersions": {
@@ -48,7 +56,7 @@
       "mount-react-hook": [
         "build/esm/src/mount-react-hook/mountReactHook.d.ts"
       ],
-      "numberedPagination": [
+      "numbered-pagination": [
         "build/esm/src/numbered-pagination/NumberedPagination.d.ts"
       ],
       "pagination": [
@@ -62,6 +70,12 @@
       ],
       "visible": [
         "build/esm/src/visible/useVisible.d.ts"
+      ],
+      "outside-alerter": [
+        "build/esm/src/outside-alerter/useOutsideAlerter.d.ts"
+      ],
+      "modal": [
+        "build/esm/src/modal/Modal.d.ts"
       ]
     }
   },
@@ -91,7 +105,7 @@
     "lint": "eslint src"
   },
   "dependencies": {
-    "@testing-library/react": "^13.4.0",
+    "@testing-library/react": "^14.0.0",
     "@types/react": "^18.0.21",
     "@types/react-dom": "^18.0.6",
     "@types/styled-components": "^5.1.26",
@@ -104,13 +118,14 @@
     "ua-parser-js": "^1.0.2"
   },
   "devDependencies": {
-    "@rollup/plugin-typescript": "^8.5.0",
+    "@rollup/plugin-commonjs": "^25.0.2",
     "@rollup/plugin-node-resolve": "^15.0.1",
-    "@rollup/plugin-commonjs": "^23.0.2",
-    "@storybook/addon-actions": "^6.5.12",
-    "@storybook/addon-essentials": "^6.5.12",
-    "@storybook/addon-links": "^6.5.12",
-    "@storybook/react": "^6.5.12",
+    "@rollup/plugin-terser": "^0.4.3",
+    "@rollup/plugin-typescript": "^11.1.1",
+    "@storybook/addon-actions": "^7.0.23",
+    "@storybook/addon-essentials": "^7.0.23",
+    "@storybook/addon-links": "^7.0.23",
+    "@storybook/react": "^7.0.23",
     "@types/jest": "^29.0.3",
     "@typescript-eslint/eslint-plugin": "^5.38.0",
     "@typescript-eslint/parser": "^5.38.0",
@@ -120,9 +135,10 @@
     "jest": "^29.0.3",
     "jest-environment-jsdom": "^29.0.3",
     "prettier": "^2.7.1",
-    "rollup": "^2.79.1",
+    "rollup": "^3.25.1",
+    "rollup-plugin-peer-deps-external": "^2.2.4",
     "ts-jest": "^29.0.2",
-    "typedoc": "^0.23.15",
-    "typescript": "^4.8.3"
+    "typedoc": "^0.24.8",
+    "typescript": "^5.1.3"
   }
 }

package/build/cjs/_virtual/index11.js

@@ -1,7 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var reactIs = {exports: {}};
-
-exports.reactIs = reactIs;