@tsminh/spreacte 0.2.3 → 0.2.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index.js +1 -1
- package/dist/esm/index.js +1 -1
- package/dist/index.d.ts +1 -1
- package/package.json +1 -1
package/dist/cjs/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var t=require("react/jsx-runtime"),n=require("react"),e=require("styled-components"),r=function(){return r=Object.assign||function(t){for(var n,e=1,r=arguments.length;e<r;e++)for(var i in n=arguments[e])Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i]);return t},r.apply(this,arguments)};function i(t,n,e){if(e||2===arguments.length)for(var r,i=0,o=n.length;i<o;i++)!r&&i in n||(r||(r=Array.prototype.slice.call(n,0,i)),r[i]=n[i]);return t.concat(r||Array.prototype.slice.call(n))}function o(t,n){return Object.defineProperty?Object.defineProperty(t,"raw",{value:n}):t.raw=n,t}"function"==typeof SuppressedError&&SuppressedError;var a,s,c=function(){document.documentElement.style.setProperty("--vw","".concat(window.innerWidth,"px")),document.documentElement.style.setProperty("--vh","".concat(window.innerHeight,"px"))},u=Object.freeze({__proto__:null,isDev:function(){return window.location.hostname.includes("localhost")},measureWindowSize:c,numberWithCommas:function(t){void 0===t&&(t=0);var n=t.toString().split(".");return n[0]=n[0].replace(/\B(?=(\d{3})+(?!\d))/g,"."),n.join(".")}}),d=e.div(a||(a=o(["\n background: rgba(0, 0, 0, 0.7);\n width: var(--vw);\n height: var(--vh);\n position: fixed;\n top: 0;\n left: 0;\n\n transition: 0.5s ease all;\n opacity: ",";\n transition: opacity 200ms ease;\n"],["\n background: rgba(0, 0, 0, 0.7);\n width: var(--vw);\n height: var(--vh);\n position: fixed;\n top: 0;\n left: 0;\n\n transition: 0.5s ease all;\n opacity: ",";\n transition: opacity 200ms ease;\n"])),function(t){return"enter"===t.$state?1:0}),l=e.div(s||(s=o(["\n width: var(--vw);\n height: var(--vh);\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n position: fixed;\n top: 0;\n left: 0;\n\n opacity: ",";\n transform: ",";\n\n transition:\n transform 200ms ease,\n opacity 200ms ease;\n"],["\n width: var(--vw);\n height: var(--vh);\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n position: fixed;\n top: 0;\n left: 0;\n\n opacity: ",";\n transform: ",";\n\n transition:\n transform 200ms ease,\n opacity 200ms ease;\n"])),function(t){return"enter"===t.$state?1:0},function(t){return"enter"===t.$state?"translateY(0) scale(1)":"translateY(16px) scale(0.96)"}),f=n.createContext(null),p=function(e){var o=e.children,a=n.useState([]),s=a[0],c=a[1];return t.jsxs(f.Provider,r({value:{open:function(t){var n=crypto.randomUUID();return c(function(e){return i(i([],e,!0),[{id:n,content:t,state:"
|
|
1
|
+
"use strict";var t=require("react/jsx-runtime"),n=require("react"),e=require("styled-components"),r=function(){return r=Object.assign||function(t){for(var n,e=1,r=arguments.length;e<r;e++)for(var i in n=arguments[e])Object.prototype.hasOwnProperty.call(n,i)&&(t[i]=n[i]);return t},r.apply(this,arguments)};function i(t,n,e){if(e||2===arguments.length)for(var r,i=0,o=n.length;i<o;i++)!r&&i in n||(r||(r=Array.prototype.slice.call(n,0,i)),r[i]=n[i]);return t.concat(r||Array.prototype.slice.call(n))}function o(t,n){return Object.defineProperty?Object.defineProperty(t,"raw",{value:n}):t.raw=n,t}"function"==typeof SuppressedError&&SuppressedError;var a,s,c=function(){document.documentElement.style.setProperty("--vw","".concat(window.innerWidth,"px")),document.documentElement.style.setProperty("--vh","".concat(window.innerHeight,"px"))},u=Object.freeze({__proto__:null,isDev:function(){return window.location.hostname.includes("localhost")},measureWindowSize:c,numberWithCommas:function(t){void 0===t&&(t=0);var n=t.toString().split(".");return n[0]=n[0].replace(/\B(?=(\d{3})+(?!\d))/g,"."),n.join(".")}}),d=e.div(a||(a=o(["\n background: rgba(0, 0, 0, 0.7);\n width: var(--vw);\n height: var(--vh);\n position: fixed;\n top: 0;\n left: 0;\n\n transition: 0.5s ease all;\n opacity: ",";\n transition: opacity 200ms ease;\n"],["\n background: rgba(0, 0, 0, 0.7);\n width: var(--vw);\n height: var(--vh);\n position: fixed;\n top: 0;\n left: 0;\n\n transition: 0.5s ease all;\n opacity: ",";\n transition: opacity 200ms ease;\n"])),function(t){return"enter"===t.$state?1:0}),l=e.div(s||(s=o(["\n width: var(--vw);\n height: var(--vh);\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n position: fixed;\n top: 0;\n left: 0;\n\n opacity: ",";\n transform: ",";\n\n transition:\n transform 200ms ease,\n opacity 200ms ease;\n"],["\n width: var(--vw);\n height: var(--vh);\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n position: fixed;\n top: 0;\n left: 0;\n\n opacity: ",";\n transform: ",";\n\n transition:\n transform 200ms ease,\n opacity 200ms ease;\n"])),function(t){return"enter"===t.$state?1:0},function(t){return"enter"===t.$state?"translateY(0) scale(1)":"translateY(16px) scale(0.96)"}),f=n.createContext(null),p=function(e){var o=e.children,a=n.useState([]),s=a[0],c=a[1];return t.jsxs(f.Provider,r({value:{open:function(t){var n=crypto.randomUUID();return c(function(e){return i(i([],e,!0),[{id:n,content:t,state:"entering"}],!1)}),requestAnimationFrame(function(){c(function(t){return t.map(function(t){return t.id===n?r(r({},t),{state:"enter"}):t})})}),n},close:function(t){c(function(n){var e,i=null!=t?t:null===(e=n[n.length-1])||void 0===e?void 0:e.id;return i?n.map(function(t){return t.id===i?r(r({},t),{state:"exit"}):t}):n}),setTimeout(function(){c(function(t){return t.filter(function(t){return"exit"!==t.state})})},200)},closeAll:function(){c(function(t){return t.map(function(t){return r(r({},t),{state:"exit"})})}),setTimeout(function(){return c([])},200)},stack:s}},{children:[o,s.map(function(n,e){var i=e===s.length-1;return t.jsxs(t.Fragment,{children:[t.jsx(d,{$state:n.state,style:{zIndex:1e3+2*e-1,pointerEvents:i?"auto":"none"}}),t.jsx(l,r({$state:n.state,style:{zIndex:1e3+2*e,pointerEvents:i?"auto":"none"}},{children:n.content}))]})})]}))},m=n.createContext({ratio:1,imgRootPath:""}),v=function(){return n.useContext(m)},h={mt:["marginTop"],mb:["marginBottom"],ml:["marginLeft"],mr:["marginRight"],mx:["marginLeft","marginRight"],my:["marginTop","marginBottom"],pt:["paddingTop"],pb:["paddingBottom"],pl:["paddingLeft"],pr:["paddingRight"],px:["paddingLeft","paddingRight"],py:["paddingTop","paddingBottom"]},g=new Set(["onClick","children","className","style","img","fwidth","safeAreaTop"]),w=new Set(["fwidth","safeAreaTop","img","style"]),x=function(t){var n=t.img,e=t.imgRootPath;return n?{backgroundImage:n.startsWith("http")?n:"url(".concat([process.env.PUBLIC_URL,e,n].filter(function(t){return!!t}).join("/"),")"),backgroundSize:"cover",backgroundRepeat:"no-repeat",backgroundPosition:"center"}:void 0};exports.Box=function(e){var i=v(),o=i.ratio,a=i.imgRootPath,s=n.useMemo(function(){var t;return r({style:r(r(r(r(r(r({},Object.fromEntries(Object.entries(e).filter(function(t){var n=t[0];return!g.has(n)&&"style"!==n}).flatMap(function(t){var n=t[0],e=t[1];return h[n]?h[n].map(function(t){return[t,e*o]}):[[n,e*o]]}))),x({img:e.img,imgRootPath:a})),e.safeAreaTop?{top:"calc(var(--ot) + ".concat((null!==(t=e.top)&&void 0!==t?t:0)*o,"px)")}:void 0),e.fwidth?{width:"var(--vw)"}:void 0),{aspectRatio:e.aspectRatio,pointerEvents:e.onClick||!e.img?"all":"none"}),e.style)},Object.fromEntries(Object.entries(e).filter(function(t){var n=t[0];return g.has(n)&&!w.has(n)}).map(function(t){return[t[0],t[1]]})))},[a,e,o]);return console.log(s),alert(1),t.jsx("div",r({},s))},exports.GlobalContextProvider=function(e){var i=e.children,o=e.width,a=e.imgRootPath,s=void 0===a?"":a,u=function(t){var e=n.useState({width:window.innerWidth,height:window.innerHeight,ratio:window.innerWidth/t}),r=e[0],i=e[1];return n.useEffect(function(){function n(){i({width:window.screen.availWidth,height:window.screen.availHeight,ratio:window.screen.availWidth/t})}return window.addEventListener("resize",n),n(),function(){return window.removeEventListener("resize",n)}},[t]),r}(o).ratio,d=n.useMemo(function(){return{ratio:u,imgRootPath:s}},[s,u]);return n.useEffect(function(){return c(),window.addEventListener("resize",c),function(){window.removeEventListener("resize",c)}},[]),t.jsx(m.Provider,r({value:d},{children:t.jsx(p,{children:i})}))},exports.useGlobalContext=v,exports.useModal=function(){var t=n.useContext(f);if(!t)throw new Error("useModal must be used inside ModalProvider");return t},exports.utils=u;
|
package/dist/esm/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{jsxs as n,Fragment as t,jsx as e}from"react/jsx-runtime";import{useState as r,useEffect as i,createContext as o,useContext as a,useMemo as c}from"react";import s from"styled-components";var u=function(){return u=Object.assign||function(n){for(var t,e=1,r=arguments.length;e<r;e++)for(var i in t=arguments[e])Object.prototype.hasOwnProperty.call(t,i)&&(n[i]=t[i]);return n},u.apply(this,arguments)};function d(n,t,e){if(e||2===arguments.length)for(var r,i=0,o=t.length;i<o;i++)!r&&i in t||(r||(r=Array.prototype.slice.call(t,0,i)),r[i]=t[i]);return n.concat(r||Array.prototype.slice.call(t))}function l(n,t){return Object.defineProperty?Object.defineProperty(n,"raw",{value:t}):n.raw=t,n}"function"==typeof SuppressedError&&SuppressedError;var f,p,m=function(){document.documentElement.style.setProperty("--vw","".concat(window.innerWidth,"px")),document.documentElement.style.setProperty("--vh","".concat(window.innerHeight,"px"))},v=Object.freeze({__proto__:null,isDev:function(){return window.location.hostname.includes("localhost")},measureWindowSize:m,numberWithCommas:function(n){void 0===n&&(n=0);var t=n.toString().split(".");return t[0]=t[0].replace(/\B(?=(\d{3})+(?!\d))/g,"."),t.join(".")}}),h=s.div(f||(f=l(["\n background: rgba(0, 0, 0, 0.7);\n width: var(--vw);\n height: var(--vh);\n position: fixed;\n top: 0;\n left: 0;\n\n transition: 0.5s ease all;\n opacity: ",";\n transition: opacity 200ms ease;\n"],["\n background: rgba(0, 0, 0, 0.7);\n width: var(--vw);\n height: var(--vh);\n position: fixed;\n top: 0;\n left: 0;\n\n transition: 0.5s ease all;\n opacity: ",";\n transition: opacity 200ms ease;\n"])),function(n){return"enter"===n.$state?1:0}),g=s.div(p||(p=l(["\n width: var(--vw);\n height: var(--vh);\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n position: fixed;\n top: 0;\n left: 0;\n\n opacity: ",";\n transform: ",";\n\n transition:\n transform 200ms ease,\n opacity 200ms ease;\n"],["\n width: var(--vw);\n height: var(--vh);\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n position: fixed;\n top: 0;\n left: 0;\n\n opacity: ",";\n transform: ",";\n\n transition:\n transform 200ms ease,\n opacity 200ms ease;\n"])),function(n){return"enter"===n.$state?1:0},function(n){return"enter"===n.$state?"translateY(0) scale(1)":"translateY(16px) scale(0.96)"}),w=o(null),y=function(){var n=a(w);if(!n)throw new Error("useModal must be used inside ModalProvider");return n},b=function(i){var o=i.children,a=r([]),c=a[0],s=a[1];return n(w.Provider,u({value:{open:function(n){var t=crypto.randomUUID();return s(function(e){return d(d([],e,!0),[{id:t,content:n,state:"
|
|
1
|
+
import{jsxs as n,Fragment as t,jsx as e}from"react/jsx-runtime";import{useState as r,useEffect as i,createContext as o,useContext as a,useMemo as c}from"react";import s from"styled-components";var u=function(){return u=Object.assign||function(n){for(var t,e=1,r=arguments.length;e<r;e++)for(var i in t=arguments[e])Object.prototype.hasOwnProperty.call(t,i)&&(n[i]=t[i]);return n},u.apply(this,arguments)};function d(n,t,e){if(e||2===arguments.length)for(var r,i=0,o=t.length;i<o;i++)!r&&i in t||(r||(r=Array.prototype.slice.call(t,0,i)),r[i]=t[i]);return n.concat(r||Array.prototype.slice.call(t))}function l(n,t){return Object.defineProperty?Object.defineProperty(n,"raw",{value:t}):n.raw=t,n}"function"==typeof SuppressedError&&SuppressedError;var f,p,m=function(){document.documentElement.style.setProperty("--vw","".concat(window.innerWidth,"px")),document.documentElement.style.setProperty("--vh","".concat(window.innerHeight,"px"))},v=Object.freeze({__proto__:null,isDev:function(){return window.location.hostname.includes("localhost")},measureWindowSize:m,numberWithCommas:function(n){void 0===n&&(n=0);var t=n.toString().split(".");return t[0]=t[0].replace(/\B(?=(\d{3})+(?!\d))/g,"."),t.join(".")}}),h=s.div(f||(f=l(["\n background: rgba(0, 0, 0, 0.7);\n width: var(--vw);\n height: var(--vh);\n position: fixed;\n top: 0;\n left: 0;\n\n transition: 0.5s ease all;\n opacity: ",";\n transition: opacity 200ms ease;\n"],["\n background: rgba(0, 0, 0, 0.7);\n width: var(--vw);\n height: var(--vh);\n position: fixed;\n top: 0;\n left: 0;\n\n transition: 0.5s ease all;\n opacity: ",";\n transition: opacity 200ms ease;\n"])),function(n){return"enter"===n.$state?1:0}),g=s.div(p||(p=l(["\n width: var(--vw);\n height: var(--vh);\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n position: fixed;\n top: 0;\n left: 0;\n\n opacity: ",";\n transform: ",";\n\n transition:\n transform 200ms ease,\n opacity 200ms ease;\n"],["\n width: var(--vw);\n height: var(--vh);\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n position: fixed;\n top: 0;\n left: 0;\n\n opacity: ",";\n transform: ",";\n\n transition:\n transform 200ms ease,\n opacity 200ms ease;\n"])),function(n){return"enter"===n.$state?1:0},function(n){return"enter"===n.$state?"translateY(0) scale(1)":"translateY(16px) scale(0.96)"}),w=o(null),y=function(){var n=a(w);if(!n)throw new Error("useModal must be used inside ModalProvider");return n},b=function(i){var o=i.children,a=r([]),c=a[0],s=a[1];return n(w.Provider,u({value:{open:function(n){var t=crypto.randomUUID();return s(function(e){return d(d([],e,!0),[{id:t,content:n,state:"entering"}],!1)}),requestAnimationFrame(function(){s(function(n){return n.map(function(n){return n.id===t?u(u({},n),{state:"enter"}):n})})}),t},close:function(n){s(function(t){var e,r=null!=n?n:null===(e=t[t.length-1])||void 0===e?void 0:e.id;return r?t.map(function(n){return n.id===r?u(u({},n),{state:"exit"}):n}):t}),setTimeout(function(){s(function(n){return n.filter(function(n){return"exit"!==n.state})})},200)},closeAll:function(){s(function(n){return n.map(function(n){return u(u({},n),{state:"exit"})})}),setTimeout(function(){return s([])},200)},stack:c}},{children:[o,c.map(function(r,i){var o=i===c.length-1;return n(t,{children:[e(h,{$state:r.state,style:{zIndex:1e3+2*i-1,pointerEvents:o?"auto":"none"}}),e(g,u({$state:r.state,style:{zIndex:1e3+2*i,pointerEvents:o?"auto":"none"}},{children:r.content}))]})})]}))},x=o({ratio:1,imgRootPath:""}),P=function(n){var t=n.children,o=n.width,a=n.imgRootPath,s=void 0===a?"":a,d=function(n){var t=r({width:window.innerWidth,height:window.innerHeight,ratio:window.innerWidth/n}),e=t[0],o=t[1];return i(function(){function t(){o({width:window.screen.availWidth,height:window.screen.availHeight,ratio:window.screen.availWidth/n})}return window.addEventListener("resize",t),t(),function(){return window.removeEventListener("resize",t)}},[n]),e}(o).ratio,l=c(function(){return{ratio:d,imgRootPath:s}},[s,d]);return i(function(){return m(),window.addEventListener("resize",m),function(){window.removeEventListener("resize",m)}},[]),e(x.Provider,u({value:l},{children:e(b,{children:t})}))},j=function(){return a(x)},E={mt:["marginTop"],mb:["marginBottom"],ml:["marginLeft"],mr:["marginRight"],mx:["marginLeft","marginRight"],my:["marginTop","marginBottom"],pt:["paddingTop"],pb:["paddingBottom"],pl:["paddingLeft"],pr:["paddingRight"],px:["paddingLeft","paddingRight"],py:["paddingTop","paddingBottom"]},R=new Set(["onClick","children","className","style","img","fwidth","safeAreaTop"]),L=new Set(["fwidth","safeAreaTop","img","style"]),O=function(n){var t=n.img,e=n.imgRootPath;return t?{backgroundImage:t.startsWith("http")?t:"url(".concat([process.env.PUBLIC_URL,e,t].filter(function(n){return!!n}).join("/"),")"),backgroundSize:"cover",backgroundRepeat:"no-repeat",backgroundPosition:"center"}:void 0},k=function(n){var t=j(),r=t.ratio,i=t.imgRootPath,o=c(function(){var t;return u({style:u(u(u(u(u(u({},Object.fromEntries(Object.entries(n).filter(function(n){var t=n[0];return!R.has(t)&&"style"!==t}).flatMap(function(n){var t=n[0],e=n[1];return E[t]?E[t].map(function(n){return[n,e*r]}):[[t,e*r]]}))),O({img:n.img,imgRootPath:i})),n.safeAreaTop?{top:"calc(var(--ot) + ".concat((null!==(t=n.top)&&void 0!==t?t:0)*r,"px)")}:void 0),n.fwidth?{width:"var(--vw)"}:void 0),{aspectRatio:n.aspectRatio,pointerEvents:n.onClick||!n.img?"all":"none"}),n.style)},Object.fromEntries(Object.entries(n).filter(function(n){var t=n[0];return R.has(t)&&!L.has(t)}).map(function(n){return[n[0],n[1]]})))},[i,n,r]);return console.log(o),alert(1),e("div",u({},o))};export{k as Box,P as GlobalContextProvider,j as useGlobalContext,y as useModal,v as utils};
|
package/dist/index.d.ts
CHANGED
|
@@ -52,7 +52,7 @@ declare const useGlobalContext: () => IGlobalContext;
|
|
|
52
52
|
type ModalItem = {
|
|
53
53
|
id: string;
|
|
54
54
|
content: ReactNode;
|
|
55
|
-
state: "enter" | "exit";
|
|
55
|
+
state: "enter" | "exit" | "entering";
|
|
56
56
|
};
|
|
57
57
|
interface ModalContextValue {
|
|
58
58
|
open: (content: ReactNode) => string;
|