@onoxm/react-hooks 0.1.4 → 0.1.5
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/hooks/index.js +1 -1
- package/dist/hooks/useClickOutSide.js +1 -0
- package/dist/hooks/useCountdown.js +1 -0
- package/dist/hooks/useEventListener.js +1 -0
- package/dist/hooks/useGetElementSize.js +1 -0
- package/dist/hooks/useKeyPress.js +1 -0
- package/dist/hooks/useMouseClick.js +1 -0
- package/dist/hooks/useTheme.js +1 -0
- package/dist/hooks/useThemePro.js +1 -0
- package/dist/hooks/utils/dist/utils/viewTransition/changeThemeClipPathCircle.js +1 -0
- package/dist/types/index.d.ts +8 -11
- package/dist/types/{src/useThemePro.d.ts → useThemePro.d.ts} +2 -4
- package/package.json +11 -7
- package/dist/hooks/useClickOutSide.tsx-C6XuLZzd.js +0 -1
- package/dist/hooks/useCountdown.tsx-DWqs6wNp.js +0 -1
- package/dist/hooks/useEventListener.tsx-C8V9Qip6.js +0 -1
- package/dist/hooks/useGetElementSize.tsx-DML7z5Xp.js +0 -1
- package/dist/hooks/useKeyPress.tsx-hgs6v_Jt.js +0 -1
- package/dist/hooks/useMouseClick.tsx-BmzbuM6X.js +0 -1
- package/dist/hooks/useQuery.tsx-FzGWYq50.js +0 -1
- package/dist/hooks/useTheme.tsx-C-GCpzAS.js +0 -1
- package/dist/hooks/useThemePro.tsx-Da38iQ5J.js +0 -1
- package/dist/types/src/useQuery.d.ts +0 -3
- /package/dist/types/{src/useClickOutSide.d.ts → useClickOutSide.d.ts} +0 -0
- /package/dist/types/{src/useCountdown.d.ts → useCountdown.d.ts} +0 -0
- /package/dist/types/{src/useEventListener.d.ts → useEventListener.d.ts} +0 -0
- /package/dist/types/{src/useGetElementSize.d.ts → useGetElementSize.d.ts} +0 -0
- /package/dist/types/{src/useKeyPress.d.ts → useKeyPress.d.ts} +0 -0
- /package/dist/types/{src/useMouseClick.d.ts → useMouseClick.d.ts} +0 -0
- /package/dist/types/{src/useTheme.d.ts → useTheme.d.ts} +0 -0
package/dist/hooks/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{
|
|
1
|
+
import{useClickOutSide as r}from "./useClickOutSide.js";import{useCountdown as s}from "./useCountdown.js";import{useEventListener as u}from "./useEventListener.js";import{useGetElementSize as p}from "./useGetElementSize.js";import{useKeyPress as i}from "./useKeyPress.js";import{useMouseClick as l}from "./useMouseClick.js";import{useTheme as c}from "./useTheme.js";import{useThemePro as h}from "./useThemePro.js";export{r as useClickOutSide,s as useCountdown,u as useEventListener,p as useGetElementSize,i as useKeyPress,l as useMouseClick,c as useTheme,h as useThemePro};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{c as u}from "react/compiler-runtime";import{useEventListener as m}from "./useEventListener.js";const h=(e,i,c)=>{const t=u(10),f=c?.event||"click";let o,a,s,p;return t[0]!==f ?(o=((n)=>{const r=typeof n=="string" ? [n]:n;if(new Set(r).size!==r.length)throw new Error("there are duplicates in the event type");return r;})(f),t[0]=f,t[1]=o):o=t[1],t[2]!==i||t[3]!==e ?(a=(n)=>{if(e)if(e instanceof Array)e.map(l).some((r)=>!!r&&r.contains(n.target))||i(n);else{const r=e instanceof HTMLElement ? e:e.current;r&&!r.contains(n.target)&&i(n);}},t[2]=i,t[3]=e,t[4]=a):a=t[4],t[5]!==c?.deps ?(s=c?.deps||[],t[5]=c?.deps,t[6]=s):s=t[6],t[7]!==e||t[8]!==s ?(p={deps:[e,...s]},t[7]=e,t[8]=s,t[9]=p):p=t[9],m(o,a,p);};function l(e){return e instanceof HTMLElement ? e:e.current;}export{h as useClickOutSide};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{c as b}from "react/compiler-runtime";import{useState as d,useRef as h,useEffect as v}from "react";const y=(o,f)=>{const e=b(12),u=o===void 0 ? 60:o,[t,p]=d(u),[c,T]=d(!1),r=h(null);let s;e[0]===Symbol.for("react.memo_cache_sentinel")?(s=()=>T(!0),e[0]=s):s=e[0];const _=s;let l;e[1]!==u||e[2]!==f ?(l=()=>{T(!1),p(u),r.current&&(clearTimeout(r.current),r.current=null),f?.();},e[1]=u,e[2]=f,e[3]=l):l=e[3];const n=l;let a,m,i;return e[4]!==c||e[5]!==t||e[6]!==n ?(a=()=>{if(c)return t>0 ? r.current=setTimeout(()=>{p(x);},1e3):n(),()=>{r.current&&(clearTimeout(r.current),r.current=null);};},m=[c,t,n],e[4]=c,e[5]=t,e[6]=n,e[7]=a,e[8]=m):(a=e[7],m=e[8]),v(a,m),e[9]!==t||e[10]!==n ?(i=[t,_,n],e[9]=t,e[10]=n,e[11]=i):i=e[11],i;};function x(o){return o-1;}export{y as useCountdown};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{c as m}from "react/compiler-runtime";import{useEffect as L}from "react";const l=(t,v,c)=>{const e=m(19);let r;e[0]!==c ?(r=c||{},e[0]=c,e[1]=r):r=e[1];const{target:n,deps:p,isDeferred:s}=r;let w;e[2]!==v ?(w=(i)=>v(i),e[2]=v,e[3]=w):w=e[3];const o=w;let a,d,f,E;return e[4]!==t||e[5]!==o||e[6]!==s||e[7]!==n ?(a=()=>(typeof t=="string" ?!s&&(n||window).addEventListener(t,o):t.forEach((i)=>!s&&(n||window).addEventListener(i,o)),()=>{typeof t=="string" ?(n||window).removeEventListener(t,o):t.forEach((i)=>(n||window).removeEventListener(i,o));}),e[4]=t,e[5]=o,e[6]=s,e[7]=n,e[8]=a):a=e[8],e[9]!==p ?(d=p||[],e[9]=p,e[10]=d):d=e[10],e[11]!==d||e[12]!==n ?(f=[n,...d],e[11]=d,e[12]=n,e[13]=f):f=e[13],L(a,f),e[14]!==t||e[15]!==o||e[16]!==s||e[17]!==n ?(E=s ?()=>{typeof t=="string" ?(n||window).addEventListener(t,o):t.forEach((i)=>(n||window).addEventListener(i,o));}:void 0,e[14]=t,e[15]=o,e[16]=s,e[17]=n,e[18]=E):E=e[18],E;};export{l as useEventListener};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{c as w}from "react/compiler-runtime";import{useState as b,useEffect as d}from "react";const E=(e)=>{const n=w(9);let i;n[0]===Symbol.for("react.memo_cache_sentinel")?(i={w:0,h:0},n[0]=i):i=n[0];const [u,m]=b(i);let s;n[1]===Symbol.for("react.memo_cache_sentinel")?(s=new ResizeObserver((t)=>{for(const a of t)m({w:a.borderBoxSize[0].inlineSize,h:a.borderBoxSize[0].blockSize});}),n[1]=s):s=n[1];const c=s;let o;n[2]!==e ?(o=()=>{if(e&&typeof e!="function")c.observe(e instanceof HTMLElement ? e:e.current);else if(e&&typeof e=="function"){const t=e();c.observe(t instanceof HTMLElement ? t:t.current);}else m({w:window.innerWidth,h:window.innerHeight});},n[2]=e,n[3]=o):o=n[3];const r=o;let f,l;return n[4]!==r||n[5]!==e ?(f=()=>(r(),window.addEventListener("resize",r),()=>{if(window.removeEventListener("resize",r),e&&typeof e!="function")c.unobserve(e instanceof HTMLElement ? e:e.current);else if(e&&typeof e=="function"){const t=e();c.unobserve(t instanceof HTMLElement ? t:t.current);}}),n[4]=r,n[5]=e,n[6]=f):f=n[6],n[7]!==e ?(l=[e],n[7]=e,n[8]=l):l=n[8],d(f,l),u;};export{E as useGetElementSize};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{useEventListener as g}from "./useEventListener.js";const d=(c)=>c.toString().toLocaleLowerCase(),p=(c,f,a)=>{const K=(h)=>g(h,(u)=>((n,e,m)=>{n.forEach((s)=>{if(s.includes("+")&&s.length>1){const t=s.split("+"),o=e.ctrlKey&&t.includes("ctrl"),r=e.shiftKey&&t.includes("shift"),l=e.altKey&&t.includes("alt"),i=e.metaKey&&t.includes("meta"),y=(e.ctrlKey||e.metaKey)&&t.includes("commandorcontrol");t.length===2 ?(o||r||l||i||y)&&e.key.toLocaleLowerCase()===t[t.length-1]&&f(e,s):t.length===3&&(o&&r||o&&l||o&&i||o&&y||r&&l||r&&i||r&&y||l&&i||l&&y||i&&y)&&e.key.toLocaleLowerCase()===t[t.length-1]&&f(e,s);}else if(s.includes(d(e.key))){if(m)s===d(e.key)&&f(e,s);else if(!(e.ctrlKey||e.metaKey||e.shiftKey||e.altKey))return f(e,s);}});})(c instanceof Array ? c.map((n)=>d(n)):[d(c)],u,a?.exactMatch||!1),{deps:[a?.target,...a?.deps||[]]});a?.events instanceof Array ? a.events.forEach((h)=>K(h)):K(a?.events||"keydown");};export{p as useKeyPress};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{c as X}from "react/compiler-runtime";import{useState as Y}from "react";import{useEventListener as g}from "./useEventListener.js";const S=()=>{const e=X(2);let t;e[0]===Symbol.for("react.memo_cache_sentinel")?(t={clientX:0,clientY:0,screenX:0,screenY:0,pageX:0,pageY:0},e[0]=t):t=e[0];const [s,r]=Y(t);let n;return e[1]===Symbol.for("react.memo_cache_sentinel")?(n=(c)=>{const o=c.clientX,a=c.clientY,i=c.screenX,l=c.screenY,m=c.pageX,p=c.pageY;r({clientX:o,clientY:a,screenX:i,screenY:l,pageX:m,pageY:p});},e[1]=n):n=e[1],g("click",n),s;};export{S as useMouseClick};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{c as k}from "react/compiler-runtime";import{useEffect as p}from "react";let d=!1;const u=(f)=>{const e=k(13),{theme:t,onDark:a,onLight:c}=f;let s;e[0]===Symbol.for("react.memo_cache_sentinel")?(s=window.matchMedia("(prefers-color-scheme:dark)"),e[0]=s):s=e[0];const i=s;let r;e[1]!==a||e[2]!==c ?(r=()=>{i.matches ? a():c();},e[1]=a,e[2]=c,e[3]=r):r=e[3];const o=r;let n;e[4]!==o||e[5]!==a||e[6]!==c||e[7]!==t ?(n=()=>{d&&(d=!1,i.removeEventListener("change",o));e:switch(t){case "light":c();break e;case "dark":a();break e;default:o(),d=!0,i.addEventListener("change",o);}},e[4]=o,e[5]=a,e[6]=c,e[7]=t,e[8]=n):n=e[8];const l=n;let m,h;e[9]!==l ?(m=()=>{l();},e[9]=l,e[10]=m):m=e[10],e[11]!==t ?(h=[t],e[11]=t,e[12]=h):h=e[12],p(m,h);};export{u as useTheme};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{changeThemeClipPathCircle as m}from "./utils/dist/utils/viewTransition/changeThemeClipPathCircle.js";import{useState as h,useRef as l}from "react";import{useTheme as i}from "./useTheme.js";const p=(o)=>{const{initTheme:s="light",themeRules:t=(n)=>{n ? document.documentElement.classList.add("dark"):document.documentElement.classList.remove("dark");}}=o||Object.assign({}),[r,a]=h(s),e=l(null);return i({theme:r,onDark:()=>{e.current ? m({element:e.current,onChangeTheme:()=>t(!0)}):t(!0);},onLight:()=>{e.current ? m({element:e.current,onChangeTheme:()=>t(!1)}):t(!1);}}),[r,({targetTheme:n,element:c,onChange:u})=>{e.current=c||null,u?.(),a(n);}];};export{p as useThemePro};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
const v=(c)=>{const r="ono-view-transition-clip-path-circle",{element:h,duration:d=300,themeRules:m,onChangeTheme:s}=c,a=m?.()||document.documentElement.classList.contains("dark")? "dark":"light";if(!document.startViewTransition)return s(a==="dark" ? "light":"dark");const u=document.startViewTransition(()=>{const t=document.documentElement.classList.contains("dark");s(t ? "light":"dark");}),{top:w,left:p,width:g,height:x}=h.getBoundingClientRect(),e=p+g/2,n=w+x/2,l=[`circle(0%at ${e}px ${n}px)`,`circle(${Math.hypot(Math.max(e,window.innerWidth-e),Math.max(n,window.innerHeight-n))}px at ${e}px ${n}px)`];((t,i)=>{const o=document.createElement("style");o.setAttribute("type","text/css"),o.setAttribute("data-style-tag",i),o.textContent="::view-transition-old(root),::view-transition-new(root){animation:none;}.dark::view-transition-old(root){z-index:1;}.dark::view-transition-new(root){z-index:999;}::view-transition-old(root){z-index:999;}::view-transition-new(root){z-index:1;}",document.head.appendChild(o);})(0,r),u.ready.then(()=>{document.documentElement.animate({clipPath:a==="light" ? l:l.reverse()},{duration:d,fill:"forwards",easing:"ease-in-out",pseudoElement:a==="light" ? "::view-transition-new(root)":"::view-transition-old(root)"}),setTimeout(()=>{return t=r,void document.head.querySelectorAll("style").forEach((i)=>i.getAttribute("data-style-tag")===t&&i.remove());var t;},d+50);});};export{v as changeThemeClipPathCircle};
|
package/dist/types/index.d.ts
CHANGED
|
@@ -1,11 +1,8 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
import { useThemePro } from './src/useThemePro';
|
|
10
|
-
export { useClickOutSide, useCountdown, useEventListener, useGetElementSize, useKeyPress, useMouseClick, useQuery, useTheme, useThemePro };
|
|
11
|
-
export type { KeyEvent, KeyType, ThemeType };
|
|
1
|
+
export * from './useClickOutSide';
|
|
2
|
+
export * from './useCountdown';
|
|
3
|
+
export * from './useEventListener';
|
|
4
|
+
export * from './useGetElementSize';
|
|
5
|
+
export * from './useKeyPress';
|
|
6
|
+
export * from './useMouseClick';
|
|
7
|
+
export * from './useTheme';
|
|
8
|
+
export * from './useThemePro';
|
|
@@ -1,11 +1,9 @@
|
|
|
1
1
|
import { ThemeType } from './useTheme';
|
|
2
|
-
|
|
2
|
+
export declare const useThemePro: (options?: {
|
|
3
3
|
initTheme?: ThemeType;
|
|
4
4
|
themeRules?: (isDark: boolean) => void;
|
|
5
|
-
}
|
|
6
|
-
export declare const useThemePro: (options?: useThemeProps) => readonly [ThemeType, ({ targetTheme, element, onChange }: {
|
|
5
|
+
}) => readonly [ThemeType, ({ targetTheme, element, onChange }: {
|
|
7
6
|
targetTheme: ThemeType;
|
|
8
7
|
element?: HTMLElement;
|
|
9
8
|
onChange?: () => void;
|
|
10
9
|
}) => void];
|
|
11
|
-
export {};
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@onoxm/react-hooks",
|
|
3
3
|
"private": false,
|
|
4
|
-
"version": "0.1.
|
|
4
|
+
"version": "0.1.5",
|
|
5
5
|
"description": "Component library by React + Typescript",
|
|
6
6
|
"type": "module",
|
|
7
7
|
"main": "./dist/hooks/index.js",
|
|
@@ -26,22 +26,26 @@
|
|
|
26
26
|
"keywords": [
|
|
27
27
|
"react",
|
|
28
28
|
"typescript",
|
|
29
|
-
"
|
|
29
|
+
"hooks"
|
|
30
30
|
],
|
|
31
31
|
"author": "ono",
|
|
32
32
|
"license": "MIT",
|
|
33
33
|
"dependencies": {
|
|
34
|
-
"@onoxm/utils": "0.1.
|
|
34
|
+
"@onoxm/utils": "0.1.5"
|
|
35
35
|
},
|
|
36
36
|
"peerDependencies": {
|
|
37
|
-
"react": ">=18",
|
|
38
|
-
"react
|
|
37
|
+
"@types/react": ">=18",
|
|
38
|
+
"react": ">=18"
|
|
39
|
+
},
|
|
40
|
+
"peerDependenciesMeta": {
|
|
41
|
+
"@types/react": {
|
|
42
|
+
"optional": true
|
|
43
|
+
}
|
|
39
44
|
},
|
|
40
45
|
"publishConfig": {
|
|
41
46
|
"access": "public"
|
|
42
47
|
},
|
|
43
48
|
"scripts": {
|
|
44
|
-
"build": "vite build"
|
|
45
|
-
"release": "release-it"
|
|
49
|
+
"build": "vite build"
|
|
46
50
|
}
|
|
47
51
|
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{u as i}from "./useEventListener.tsx-C8V9Qip6.js";const c=(n,o,s)=>i(((t)=>{const e=typeof t=="string" ? [t]:t;if(new Set(e).size!==e.length)throw new Error("there are duplicates in the event type");return e;})((s==null ? void 0:s.event)||"click"),(t)=>{if(n)if(n instanceof Array)n.map((e)=>e instanceof HTMLElement ? e:e.current).some((e)=>!!e&&e.contains(t.target))||o(t);else{const e=n instanceof HTMLElement ? n:n.current;e&&!e.contains(t.target)&&o(t);}},{deps:[n,...(s==null ? void 0:s.deps)||[]]});export{c as u};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{useState as o,useRef as f,useCallback as c,useEffect as T}from "react";const b=(t=60,r)=>{const [u,s]=o(t),[a,l]=o(!1),e=f(null),i=c(()=>l(!0),[]),n=c(()=>{l(!1),s(t),e.current&&(clearTimeout(e.current),e.current=null),r==null||r();},[t,r]);return T(()=>{if(a)return u>0 ? e.current=setTimeout(()=>{s((m)=>m-1);},1e3):n(),()=>{e.current&&(clearTimeout(e.current),e.current=null);};},[a,u,n]),[u,i,n];};export{b as u};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{useEffect as w}from "react";const f=(e,t,d)=>{const{target:n,deps:s,isDeferred:i}=d||{},o=(r)=>t(r);return w(()=>(typeof e=="string" ?!i&&(n||window).addEventListener(e,o):e.forEach((r)=>!i&&(n||window).addEventListener(r,o)),()=>{typeof e=="string" ?(n||window).removeEventListener(e,o):e.forEach((r)=>(n||window).removeEventListener(r,o));}),[n,...s||[]]),i ?()=>{typeof e=="string" ?(n||window).addEventListener(e,o):e.forEach((r)=>(n||window).addEventListener(r,o));}:void 0;};export{f as u};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{useState as o,useEffect as c}from "react";const w=(e)=>{const [f,r]=o({w:0,h:0}),t=new ResizeObserver((n)=>{for(const s of n)r({w:s.borderBoxSize[0].inlineSize,h:s.borderBoxSize[0].blockSize});}),i=()=>{if(e&&typeof e!="function")t.observe(e instanceof HTMLElement ? e:e.current);else if(e&&typeof e=="function"){const n=e();t.observe(n instanceof HTMLElement ? n:n.current);}else r({w:window.innerWidth,h:window.innerHeight});};return c(()=>(i(),window.addEventListener("resize",i),()=>{if(window.removeEventListener("resize",i),e&&typeof e!="function")t.unobserve(e instanceof HTMLElement ? e:e.current);else if(e&&typeof e=="function"){const n=e();t.unobserve(n instanceof HTMLElement ? n:n.current);}}),[e]),f;};export{w as u};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{u as p}from "./useEventListener.tsx-C8V9Qip6.js";const h=(o)=>o.toString().toLocaleLowerCase(),k=(o,d,t)=>{const K=(s)=>p(s,(m)=>((u,e,g)=>{u.forEach((c)=>{if(c.includes("+")&&c.length>1){const l=c.split("+"),n=e.ctrlKey&&l.includes("ctrl"),r=e.shiftKey&&l.includes("shift"),i=e.altKey&&l.includes("alt"),y=e.metaKey&&l.includes("meta"),f=(e.ctrlKey||e.metaKey)&&l.includes("commandorcontrol");l.length===2 ?(n||r||i||y||f)&&e.key.toLocaleLowerCase()===l[l.length-1]&&d(e,c):l.length===3&&(n&&r||n&&i||n&&y||n&&f||r&&i||r&&y||r&&f||i&&y||i&&f||y&&f)&&e.key.toLocaleLowerCase()===l[l.length-1]&&d(e,c);}else if(c.includes(h(e.key))){if(g)c===h(e.key)&&d(e,c);else if(!(e.ctrlKey||e.metaKey||e.shiftKey||e.altKey))return d(e,c);}});})(o instanceof Array ? o.map((u)=>h(u)):[h(o)],m,(t==null ? void 0:t.exactMatch)||!1),{deps:[t==null ? void 0:t.target,...(t==null ? void 0:t.deps)||[]]});(t==null ? void 0:t.events)instanceof Array ? t.events.forEach((s)=>K(s)):K((t==null ? void 0:t.events)||"keydown");};export{k as u};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{useState as X}from "react";import{u as Y}from "./useEventListener.tsx-C8V9Qip6.js";const g=()=>{const [c,n]=X({clientX:0,clientY:0,screenX:0,screenY:0,pageX:0,pageY:0});return Y("click",(e)=>{const t=e.clientX,r=e.clientY,s=e.screenX,a=e.screenY,i=e.pageX,p=e.pageY;n({clientX:t,clientY:r,screenX:s,screenY:a,pageX:i,pageY:p});}),c;};export{g as u};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{useLocation as a}from "react-router-dom";const c=()=>{const r=a(),o=new URLSearchParams(r.search),e={};for(let [t,s] of o.entries())e[t]=s;return e;};export{c as u};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{useEffect as o}from "react";let a=!1;const h=({theme:r,onDark:s,onLight:n})=>{const e=window.matchMedia("(prefers-color-scheme:dark)"),t=()=>{e.matches ? s():n();};o(()=>{(()=>{switch(a&&(a=!1,e.removeEventListener("change",t)),r){case "light":n();break;case "dark":s();break;default:t(),a=!0,e.addEventListener("change",t);}})();},[r]);};export{h as u};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{useState as k,useRef as f}from "react";import{u as y}from "./useTheme.tsx-C-GCpzAS.js";const w=(u)=>{const a="ono-view-transition-clip-path-circle",{element:n,duration:o=300,themeRules:s,onChangeTheme:t}=u,e=s!=null&&s()||document.documentElement.classList.contains("dark")? "dark":"light";if(!document.startViewTransition)return t(e==="dark" ? "light":"dark");const h=document.startViewTransition(()=>{const r=document.documentElement.classList.contains("dark");t(r ? "light":"dark");}),{top:i,left:p,width:v,height:x}=n.getBoundingClientRect(),d=p+v/2,l=i+x/2,g=[`circle(0%at ${d}px ${l}px)`,`circle(${Math.hypot(Math.max(d,window.innerWidth-d),Math.max(l,window.innerHeight-l))}px at ${d}px ${l}px)`];((r,c)=>{const m=document.createElement("style");m.setAttribute("type","text/css"),m.setAttribute("data-style-tag",c),m.textContent="::view-transition-old(root),::view-transition-new(root){animation:none;}.dark::view-transition-old(root){z-index:1;}.dark::view-transition-new(root){z-index:999;}::view-transition-old(root){z-index:999;}::view-transition-new(root){z-index:1;}",document.head.appendChild(m);})(0,a),h.ready.then(()=>{document.documentElement.animate({clipPath:e==="light" ? g:g.reverse()},{duration:o,fill:"forwards",easing:"ease-in-out",pseudoElement:e==="light" ? "::view-transition-new(root)":"::view-transition-old(root)"}),setTimeout(()=>{return r=a,void document.head.querySelectorAll("style").forEach((c)=>c.getAttribute("data-style-tag")===r&&c.remove());var r;},o+50);});},C=(u)=>{const{initTheme:a="light",themeRules:n=(e)=>{e ? document.documentElement.classList.add("dark"):document.documentElement.classList.remove("dark");}}=u||Object.assign({}),[o,s]=k(a),t=f(null);return y({theme:o,onDark:()=>{t.current ? w({element:t.current,onChangeTheme:()=>n(!0)}):n(!0);},onLight:()=>{t.current ? w({element:t.current,onChangeTheme:()=>n(!1)}):n(!1);}}),[o,({targetTheme:e,element:h,onChange:i})=>{t.current=h||null,i==null||i(),s(e);}];};export{C as u};
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|