react-pure-modal 3.0.0 → 3.0.1

package/dist/@types/types.d.ts

@@ -0,0 +1 @@
+export type MouseOrTouch = React.MouseEvent<HTMLDivElement> | React.TouchEvent<HTMLDivElement>;

package/dist/index.js

@@ -0,0 +1 @@
+import{jsx as e}from"react/jsx-runtime";import{createContext as o,useCallback as r,useContext as t,useEffect as n,useId as a,useLayoutEffect as d,useMemo as i,useRef as l}from"react";var s={"./node_modules/@rslib/core/node_modules/@rsbuild/core/compiled/css-loader/index.js??ruleSet[1].rules[1].use[1]!builtin:lightningcss-loader??ruleSet[1].rules[1].use[2]!./src/compounds/Modal.module.css":function(e,o,r){r.d(o,{A:()=>i});var t=r("./node_modules/@rslib/core/node_modules/@rsbuild/core/compiled/css-loader/noSourceMaps.js"),n=r.n(t),a=r("./node_modules/@rslib/core/node_modules/@rsbuild/core/compiled/css-loader/api.js"),d=r.n(a)()(n());d.push([e.id,"body:has(.pureModalBackdrop-RW7tAF){overflow:hidden}.pureModalBackdrop-RW7tAF{--radius:12px;--aspect-ratio:auto;--backdrop-blur:2px;--backdrop-color:#0006;--box-shadow:0px 1px 2px #00000024,0px 8px 20px #0000002e,0px 20px 48px #00000038;--max-width:95vw;--max-height:90vh;--min-width:320px;--background:white;--background-panels:#ffffffe6;--z-index:1041;--top-content-padding:16px;--bottom-content-padding:16px;--top-header-padding:16px;--bottom-header-padding:16px;--top-footer-padding:16px;--bottom-footer-padding:16px;--left-padding:24px;--base-right-padding:24px;--right-padding:var(--base-right-padding);--close-button-background:var(--background-panels,white);--close-button-size:30px;--close-button-hit-padding:calc(var(--right-padding)/2);--close-button-space:var(--close-button-size);--contrast-color:oklch(from var(--background-panels)clamp(.08,calc(1 - l),.92)c h);--dividers-color:color-mix(in oklch,var(--background-panels)78%,var(--contrast-color)22%);--border:1px solid var(--dividers-color);--backdrop-filter:blur(3px);backdrop-filter:var(--backdrop-filter);z-index:var(--z-index);background-color:var(--backdrop-color);flex-direction:column;justify-content:center;align-items:center;animation:.26s cubic-bezier(.16,.84,.44,1) both backdropFadeSmooth-ZnEuSQ;display:flex;position:fixed;inset:0;overflow:auto}@keyframes backdropFadeSmooth-ZnEuSQ{0%{opacity:0;-webkit-backdrop-filter:blur();background-color:#0000}to{opacity:1;backdrop-filter:var(--backdrop-filter);background-color:var(--backdrop-color)}}.pureModal-Hr1gWI{z-index:calc(var(--z-index) + 1);background:var(--background);box-shadow:var(--box-shadow);border-radius:var(--radius);max-height:var(--max-height);max-width:max(320px,var(--max-width));min-width:var(--min-width);aspect-ratio:var(--aspect-ratio);grid-template-rows:auto minmax(0,1fr) minmax(0,max-content);grid-template-columns:1fr;grid-auto-flow:row;display:grid;overflow:auto;&:has(>.pureModalHeader-DahjVw)>.pureModalContent-t7nwPr{grid-row:2}animation:.24s cubic-bezier(.18,.77,.42,1) both panelSoftPop-JNSB6U}@keyframes panelSoftPop-JNSB6U{0%{opacity:0;transform:translateY(8px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}.pureModalHeader-DahjVw{padding:var(--top-header-padding)var(--right-padding)var(--bottom-header-padding)var(--left-padding);border-bottom:var(--border);background:var(--background-panels);box-sizing:border-box;grid-area:1/1;align-items:center;width:100%;display:flex}.pureModalContent-t7nwPr{padding:var(--top-content-padding)var(--right-padding)var(--bottom-content-padding)var(--left-padding);box-sizing:border-box;overscroll-behavior:contain;width:100%;grid-area:1/1/2/-1;min-block-size:0;overflow:auto}.pureModalFooter-hj8jgh{padding:var(--top-footer-padding)var(--right-padding)calc(var(--bottom-footer-padding) + env(safe-area-inset-bottom))var(--left-padding);border-top:var(--border);background:var(--background-panels);box-sizing:border-box;grid-area:3/1/auto/-1;width:100%;display:block}@media (width<=600px){.pureModalBackdrop-RW7tAF{--radius:12px 12px 0 0;justify-content:end}.pureModal-Hr1gWI{--aspect-ratio:auto;min-width:var(--max-width);animation:.28s cubic-bezier(.25,.85,.35,1) panelSheetIn-loLXeB}@keyframes panelSheetIn-loLXeB{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}}.pureModal-Hr1gWI:has(.pureCloseButton-Ac2K32) .pureModalHeader-DahjVw{--right-padding:calc(var(--base-right-padding) + var(--close-button-space))}.pureCloseButton-Ac2K32{padding:var(--close-button-hit-padding);z-index:3;grid-area:1/1/auto/-1;place-self:start end;align-items:center;display:flex}.pureCloseButtonIcon-m_tk65{font-weight:700;font-size:calc(var(--close-button-size)/2);height:var(--close-button-size);color:var(--dividers-color);width:var(--close-button-size);cursor:pointer;text-align:center;line-height:calc(var(--close-button-size) - 1px);aspect-ratio:1;border:var(--border);background:var(--close-button-background);border-radius:50%;padding:0;transition:all .1s ease-in-out;&:hover{color:var(--contrast-color);border-color:var(--contrast-color)}}",""]),d.locals={pureModalBackdrop:"pureModalBackdrop-RW7tAF",backdropFadeSmooth:"backdropFadeSmooth-ZnEuSQ",pureModal:"pureModal-Hr1gWI",panelSoftPop:"panelSoftPop-JNSB6U",pureModalHeader:"pureModalHeader-DahjVw",pureModalContent:"pureModalContent-t7nwPr",pureModalFooter:"pureModalFooter-hj8jgh",panelSheetIn:"panelSheetIn-loLXeB",pureCloseButton:"pureCloseButton-Ac2K32",pureCloseButtonIcon:"pureCloseButtonIcon-m_tk65"};let i=d},"./node_modules/@rslib/core/node_modules/@rsbuild/core/compiled/css-loader/api.js":function(e){e.exports=function(e){var o=[];return o.toString=function(){return this.map(function(o){var r="",t=void 0!==o[5];return o[4]&&(r+="@supports (".concat(o[4],") {")),o[2]&&(r+="@media ".concat(o[2]," {")),t&&(r+="@layer".concat(o[5].length>0?" ".concat(o[5]):""," {")),r+=e(o),t&&(r+="}"),o[2]&&(r+="}"),o[4]&&(r+="}"),r}).join("")},o.i=function(e,r,t,n,a){"string"==typeof e&&(e=[[null,e,void 0]]);var d={};if(t)for(var i=0;i<this.length;i++){var l=this[i][0];null!=l&&(d[l]=!0)}for(var s=0;s<e.length;s++){var c=[].concat(e[s]);t&&d[c[0]]||(void 0!==a&&(void 0===c[5]||(c[1]="@layer".concat(c[5].length>0?" ".concat(c[5]):""," {").concat(c[1],"}")),c[5]=a),r&&(c[2]&&(c[1]="@media ".concat(c[2]," {").concat(c[1],"}")),c[2]=r),n&&(c[4]?(c[1]="@supports (".concat(c[4],") {").concat(c[1],"}"),c[4]=n):c[4]="".concat(n)),o.push(c))}},o}},"./node_modules/@rslib/core/node_modules/@rsbuild/core/compiled/css-loader/noSourceMaps.js":function(e){e.exports=function(e){return e[1]}},"./node_modules/@rslib/core/node_modules/@rsbuild/core/compiled/style-loader/runtime/injectStylesIntoStyleTag.js":function(e){var o=[];function r(e){for(var r=-1,t=0;t<o.length;t++)if(o[t].identifier===e){r=t;break}return r}function t(e,t){for(var n={},a=[],d=0;d<e.length;d++){var i=e[d],l=t.base?i[0]+t.base:i[0],s=n[l]||0,c="".concat(l," ").concat(s);n[l]=s+1;var u=r(c),p={css:i[1],media:i[2],sourceMap:i[3],supports:i[4],layer:i[5]};if(-1!==u)o[u].references++,o[u].updater(p);else{var m=function(e,o){var r=o.domAPI(o);return r.update(e),function(o){o?(o.css!==e.css||o.media!==e.media||o.sourceMap!==e.sourceMap||o.supports!==e.supports||o.layer!==e.layer)&&r.update(e=o):r.remove()}}(p,t);t.byIndex=d,o.splice(d,0,{identifier:c,updater:m,references:1})}a.push(c)}return a}e.exports=function(e,n){var a=t(e=e||[],n=n||{});return function(e){e=e||[];for(var d=0;d<a.length;d++){var i=r(a[d]);o[i].references--}for(var l=t(e,n),s=0;s<a.length;s++){var c=r(a[s]);0===o[c].references&&(o[c].updater(),o.splice(c,1))}a=l}}},"./node_modules/@rslib/core/node_modules/@rsbuild/core/compiled/style-loader/runtime/insertBySelector.js":function(e){var o={};e.exports=function(e,r){var t=function(e){if(void 0===o[e]){var r=document.querySelector(e);if(window.HTMLIFrameElement&&r instanceof window.HTMLIFrameElement)try{r=r.contentDocument.head}catch(e){r=null}o[e]=r}return o[e]}(e);if(!t)throw Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");t.appendChild(r)}},"./node_modules/@rslib/core/node_modules/@rsbuild/core/compiled/style-loader/runtime/insertStyleElement.js":function(e){e.exports=function(e){var o=document.createElement("style");return e.setAttributes(o,e.attributes),e.insert(o,e.options),o}},"./node_modules/@rslib/core/node_modules/@rsbuild/core/compiled/style-loader/runtime/setAttributesWithoutAttributes.js":function(e,o,r){e.exports=function(e){var o=r.nc;o&&e.setAttribute("nonce",o)}},"./node_modules/@rslib/core/node_modules/@rsbuild/core/compiled/style-loader/runtime/styleDomAPI.js":function(e){e.exports=function(e){if("undefined"==typeof document)return{update:function(){},remove:function(){}};var o=e.insertStyleElement(e);return{update:function(r){var t,n,a;t="",r.supports&&(t+="@supports (".concat(r.supports,") {")),r.media&&(t+="@media ".concat(r.media," {")),(n=void 0!==r.layer)&&(t+="@layer".concat(r.layer.length>0?" ".concat(r.layer):""," {")),t+=r.css,n&&(t+="}"),r.media&&(t+="}"),r.supports&&(t+="}"),(a=r.sourceMap)&&"undefined"!=typeof btoa&&(t+="\n/*# sourceMappingURL=data:application/json;base64,".concat(btoa(unescape(encodeURIComponent(JSON.stringify(a))))," */")),e.styleTagTransform(t,o,e.options)},remove:function(){var e;null===(e=o).parentNode||e.parentNode.removeChild(e)}}}},"./node_modules/@rslib/core/node_modules/@rsbuild/core/compiled/style-loader/runtime/styleTagTransform.js":function(e){e.exports=function(e,o){if(o.styleSheet)o.styleSheet.cssText=e;else{for(;o.firstChild;)o.removeChild(o.firstChild);o.appendChild(document.createTextNode(e))}}}},c={};function u(e){var o=c[e];if(void 0!==o)return o.exports;var r=c[e]={id:e,exports:{}};return s[e](r,r.exports,u),r.exports}u.n=e=>{var o=e&&e.__esModule?()=>e.default:()=>e;return u.d(o,{a:o}),o},u.d=(e,o)=>{for(var r in o)u.o(o,r)&&!u.o(e,r)&&Object.defineProperty(e,r,{enumerable:!0,get:o[r]})},u.o=(e,o)=>Object.prototype.hasOwnProperty.call(e,o),u.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},u.nc=void 0;var p={};u.r(p),u.d(p,{default:()=>N});var m=u("./node_modules/@rslib/core/node_modules/@rsbuild/core/compiled/style-loader/runtime/injectStylesIntoStyleTag.js"),b=u.n(m),f=u("./node_modules/@rslib/core/node_modules/@rsbuild/core/compiled/style-loader/runtime/styleDomAPI.js"),v=u.n(f),g=u("./node_modules/@rslib/core/node_modules/@rsbuild/core/compiled/style-loader/runtime/insertBySelector.js"),h=u.n(g),x=u("./node_modules/@rslib/core/node_modules/@rsbuild/core/compiled/style-loader/runtime/setAttributesWithoutAttributes.js"),y=u.n(x),k=u("./node_modules/@rslib/core/node_modules/@rsbuild/core/compiled/style-loader/runtime/insertStyleElement.js"),M=u.n(k),S=u("./node_modules/@rslib/core/node_modules/@rsbuild/core/compiled/style-loader/runtime/styleTagTransform.js"),w=u.n(S),_=u("./node_modules/@rslib/core/node_modules/@rsbuild/core/compiled/css-loader/index.js??ruleSet[1].rules[1].use[1]!builtin:lightningcss-loader??ruleSet[1].rules[1].use[2]!./src/compounds/Modal.module.css"),j={};j.styleTagTransform=w(),j.setAttributes=y(),j.insert=h().bind(null,"head"),j.domAPI=v(),j.insertStyleElement=M(),b()(_.A,j);let C=_.A&&_.A.locals?_.A.locals:void 0,B=o(void 0);function I(e){if(!e)return -99999;let o=Number.parseInt(getComputedStyle(e).zIndex||"0",10);return Number.isNaN(o)?-99999:o}function z(e){return Math.max(Math.max(...Array.from(document.querySelectorAll(e)).map(e=>I(e))),1)}function A({children:o}){let{isOpen:a,onClose:i,style:s,closeOnBackdropClick:c}=t(B)??{},u=l(null),p=r(e=>{if(function(e){if(!e)return!1;let o=e.tagName.toLowerCase();return"input"===o||"textarea"===o||"select"===o||!!e.isContentEditable}(document.activeElement))return;let o=I(u.current),r=z(`.${C.pureModalBackdrop}`);return!!i&&"Escape"===e.key&&o===r&&(i(),!0)},[i]);return n(()=>{if(a)return document.addEventListener("keydown",p),()=>{document.removeEventListener("keydown",p)}},[a,p]),d(()=>{let e="number"==typeof s?.zIndex?s.zIndex:z(`.${C.pureModalBackdrop}`);u.current&&(u.current.style.zIndex=String(e+1))},[s?.zIndex]),e("div",{ref:u,className:C.pureModalBackdrop,onMouseDown:e=>{if(c){if(e){if(!e.target.classList.contains(C.pureModalBackdrop))return;e.stopPropagation(),e.preventDefault()}i?.()}},"aria-modal":"true",role:"dialog",style:s,children:o})}function N(o){let r=a(),t=i(()=>({isOpen:!!o.isOpen,onClose:o.onClose,closeOnBackdropClick:!!o.closeOnBackdropClick,style:o.style}),[o.isOpen,o.onClose,o.closeOnBackdropClick,o.style]);return t.isOpen?e(B.Provider,{value:t,children:e(A,{children:e("div",{id:`pure-modal-${r}`,className:C.pureModal,children:o.children})})}):null}N.Footer=function({children:o}){return e("div",{className:C.pureModalFooter,children:o})},N.Header=function({children:o}){return e("div",{className:C.pureModalHeader,children:o})},N.Backdrop=A,N.Content=function({children:o}){return e("div",{className:C.pureModalContent,children:o})},N.Close=function({children:o}){let{onClose:r}=t(B)??{};return e("div",{className:C.pureCloseButton,children:o||e("button",{type:"button",onClick:r,className:C.pureCloseButtonIcon,children:"✕"})})};export{p as Modal};

package/dist/rslib.config.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("@rslib/core").RslibConfig;
+export default _default;

package/dist/src/compounds/Backdrop.d.ts

@@ -0,0 +1,3 @@
+export declare function ModalBackdrop({ children }: {
+    children?: React.ReactNode;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/src/compounds/Close.d.ts

@@ -0,0 +1,5 @@
+type ModalCloseProps = {
+    children?: React.ReactNode;
+};
+export declare function ModalClose({ children }: ModalCloseProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/src/compounds/Content.d.ts

@@ -0,0 +1,5 @@
+type ModalContentProps = {
+    children?: React.ReactNode;
+};
+export declare function ModalContent({ children }: ModalContentProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/src/compounds/Footer.d.ts

@@ -0,0 +1,5 @@
+type ModalFooterProps = {
+    children?: React.ReactNode;
+};
+export declare function ModalFooter({ children }: ModalFooterProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/src/compounds/Header.d.ts

@@ -0,0 +1,5 @@
+type ModalHeaderProps = {
+    children?: React.ReactNode;
+};
+export declare function ModalHeader({ children }: ModalHeaderProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/src/compounds/Modal.d.ts

@@ -0,0 +1,15 @@
+import { ModalContent } from "./Content";
+import { ModalBackdrop } from "./Backdrop";
+import { ModalFooter } from "./Footer";
+import { ModalHeader } from "./Header";
+import { ModalClose } from "./Close";
+import type { ModalProps } from "./Modal.types";
+declare function Modal(props: ModalProps): import("react/jsx-runtime").JSX.Element | null;
+declare namespace Modal {
+    var Footer: typeof ModalFooter;
+    var Header: typeof ModalHeader;
+    var Backdrop: typeof ModalBackdrop;
+    var Content: typeof ModalContent;
+    var Close: typeof ModalClose;
+}
+export default Modal;

package/dist/src/compounds/Modal.types.d.ts

@@ -0,0 +1,15 @@
+import type { ReactElement } from "react";
+import type { ModalBackdrop } from "./Backdrop";
+import type { ModalClose } from "./Close";
+import type { ModalContent } from "./Content";
+import type { ModalFooter } from "./Footer";
+import type { ModalHeader } from "./Header";
+export type ModalCompoundElement = ReactElement<typeof ModalBackdrop> | ReactElement<typeof ModalClose> | ReactElement<typeof ModalHeader> | ReactElement<typeof ModalContent> | ReactElement<typeof ModalFooter>;
+export type ModalChildren = ModalCompoundElement | ModalCompoundElement[];
+export type ModalProps = {
+    children: ModalChildren;
+    isOpen?: boolean;
+    style?: React.CSSProperties;
+    onClose?: () => boolean | undefined;
+    closeOnBackdropClick?: boolean;
+};

package/dist/src/compounds/ModalContext.d.ts

@@ -0,0 +1,4 @@
+import type { ModalProps } from "./Modal.types";
+export type ModalContextType = Pick<ModalProps, "isOpen" | "onClose" | "closeOnBackdropClick" | "style"> & {};
+export declare const ModalContext: import("react").Context<Pick<ModalProps, "isOpen" | "onClose" | "closeOnBackdropClick" | "style"> | undefined>;
+export declare function useModalContext(): ModalContextType;

package/dist/src/index.d.ts

@@ -0,0 +1 @@
+export * as Modal from "./compounds/Modal";

package/package.json

@@ -1,6 +1,7 @@
 {
   "name": "react-pure-modal",
-  "version": "3.0.0",
+  "version": "3.0.1",
+  "description": "React modal",
   "type": "module",
   "exports": {
     ".": {
@@ -17,6 +18,21 @@
   "files": [
     "dist"
   ],
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/Memcrab/react-pure-modal.git"
+  },
+  "keywords": [
+    "react",
+    "modal",
+    "dialog"
+  ],
+  "author": "Max Mykhailenko",
+  "license": "ISC",
+  "bugs": {
+    "url": "https://github.com/Memcrab/react-pure-modal/issues"
+  },
+  "homepage": "https://github.com/Memcrab/react-pure-modal#readme",
   "scripts": {
     "build": "rslib build",
     "dev": "rslib build --watch",