matsuri-ui 16.6.1-alpha-1736063445138-dc67269.0 → 16.6.1-alpha-1736669614668-b87c8e4.0

package/hooks/useHover.js.map

@@ -1 +1 @@
-{"version":3,"file":"useHover.js","names":["useCallback","useLayoutEffect","useState","useHover","ref","isHover","setIsHover","handleMouseOver","handleMouseOut","node","current","addEventListener","removeEventListener"],"sources":["../../../src/hooks/useHover.tsx"],"sourcesContent":["import React, { useCallback, useLayoutEffect, useState } from \"react\";\nexport const useHover = (ref: React.RefObject<HTMLElement>) => {\n  const [isHover, setIsHover] = useState(false);\n  const handleMouseOver = useCallback(() => {\n    setIsHover(true);\n  }, []);\n  const handleMouseOut = useCallback(() => {\n    setIsHover(false);\n  }, []);\n\n  useLayoutEffect(() => {\n    const node = ref.current;\n    if (node) {\n      node.addEventListener(\"mouseover\", handleMouseOver);\n      node.addEventListener(\"mouseout\", handleMouseOut);\n    }\n    return () => {\n      if (node) {\n        node.removeEventListener(\"mouseover\", handleMouseOver);\n        node.removeEventListener(\"mouseout\", handleMouseOut);\n      }\n    };\n  }, [handleMouseOut, handleMouseOver, ref]);\n\n  return isHover;\n};\n"],"mappings":"AAAA,SAAgBA,WAAW,EAAEC,eAAe,EAAEC,QAAQ,QAAQ,OAAO;AACrE,OAAO,IAAMC,QAAQ,GAAIC,GAAiC,IAAK;EAC7D,IAAM,CAACC,OAAO,EAAEC,UAAU,CAAC,GAAGJ,QAAQ,CAAC,KAAK,CAAC;EAC7C,IAAMK,eAAe,GAAGP,WAAW,CAAC,MAAM;IACxCM,UAAU,CAAC,IAAI,CAAC;EAClB,CAAC,EAAE,EAAE,CAAC;EACN,IAAME,cAAc,GAAGR,WAAW,CAAC,MAAM;IACvCM,UAAU,CAAC,KAAK,CAAC;EACnB,CAAC,EAAE,EAAE,CAAC;EAENL,eAAe,CAAC,MAAM;IACpB,IAAMQ,IAAI,GAAGL,GAAG,CAACM,OAAO;IACxB,IAAID,IAAI,EAAE;MACRA,IAAI,CAACE,gBAAgB,CAAC,WAAW,EAAEJ,eAAe,CAAC;MACnDE,IAAI,CAACE,gBAAgB,CAAC,UAAU,EAAEH,cAAc,CAAC;IACnD;IACA,OAAO,MAAM;MACX,IAAIC,IAAI,EAAE;QACRA,IAAI,CAACG,mBAAmB,CAAC,WAAW,EAAEL,eAAe,CAAC;QACtDE,IAAI,CAACG,mBAAmB,CAAC,UAAU,EAAEJ,cAAc,CAAC;MACtD;IACF,CAAC;EACH,CAAC,EAAE,CAACA,cAAc,EAAED,eAAe,EAAEH,GAAG,CAAC,CAAC;EAE1C,OAAOC,OAAO;AAChB,CAAC","ignoreList":[]}
+{"version":3,"file":"useHover.js","names":["useCallback","useLayoutEffect","useState","useHover","ref","isHover","setIsHover","handleMouseOver","handleMouseOut","node","current","addEventListener","removeEventListener"],"sources":["../../../src/hooks/useHover.tsx"],"sourcesContent":["import React, { useCallback, useLayoutEffect, useState } from \"react\";\nexport const useHover = (ref: React.RefObject<HTMLElement | null>) => {\n  const [isHover, setIsHover] = useState(false);\n  const handleMouseOver = useCallback(() => {\n    setIsHover(true);\n  }, []);\n  const handleMouseOut = useCallback(() => {\n    setIsHover(false);\n  }, []);\n\n  useLayoutEffect(() => {\n    const node = ref.current;\n    if (node) {\n      node.addEventListener(\"mouseover\", handleMouseOver);\n      node.addEventListener(\"mouseout\", handleMouseOut);\n    }\n    return () => {\n      if (node) {\n        node.removeEventListener(\"mouseover\", handleMouseOver);\n        node.removeEventListener(\"mouseout\", handleMouseOut);\n      }\n    };\n  }, [handleMouseOut, handleMouseOver, ref]);\n\n  return isHover;\n};\n"],"mappings":"AAAA,SAAgBA,WAAW,EAAEC,eAAe,EAAEC,QAAQ,QAAQ,OAAO;AACrE,OAAO,IAAMC,QAAQ,GAAIC,GAAwC,IAAK;EACpE,IAAM,CAACC,OAAO,EAAEC,UAAU,CAAC,GAAGJ,QAAQ,CAAC,KAAK,CAAC;EAC7C,IAAMK,eAAe,GAAGP,WAAW,CAAC,MAAM;IACxCM,UAAU,CAAC,IAAI,CAAC;EAClB,CAAC,EAAE,EAAE,CAAC;EACN,IAAME,cAAc,GAAGR,WAAW,CAAC,MAAM;IACvCM,UAAU,CAAC,KAAK,CAAC;EACnB,CAAC,EAAE,EAAE,CAAC;EAENL,eAAe,CAAC,MAAM;IACpB,IAAMQ,IAAI,GAAGL,GAAG,CAACM,OAAO;IACxB,IAAID,IAAI,EAAE;MACRA,IAAI,CAACE,gBAAgB,CAAC,WAAW,EAAEJ,eAAe,CAAC;MACnDE,IAAI,CAACE,gBAAgB,CAAC,UAAU,EAAEH,cAAc,CAAC;IACnD;IACA,OAAO,MAAM;MACX,IAAIC,IAAI,EAAE;QACRA,IAAI,CAACG,mBAAmB,CAAC,WAAW,EAAEL,eAAe,CAAC;QACtDE,IAAI,CAACG,mBAAmB,CAAC,UAAU,EAAEJ,cAAc,CAAC;MACtD;IACF,CAAC;EACH,CAAC,EAAE,CAACA,cAAc,EAAED,eAAe,EAAEH,GAAG,CAAC,CAAC;EAE1C,OAAOC,OAAO;AAChB,CAAC","ignoreList":[]}

package/hooks/useIntersectionObserver.d.ts

@@ -1 +1 @@
-export declare const useIntersectionObserver: (ref: React.RefObject<HTMLElement>, options?: IntersectionObserverInit) => IntersectionObserverEntry | undefined;
+export declare const useIntersectionObserver: (ref: React.RefObject<HTMLElement | null>, options?: IntersectionObserverInit) => IntersectionObserverEntry | undefined;

package/hooks/useIntersectionObserver.js.map

@@ -1 +1 @@
-{"version":3,"file":"useIntersectionObserver.js","names":["useLayoutEffect","useState","useIntersectionObserver","ref","options","entry","setEntry","element","current","intersectionObserver","IntersectionObserver","entries","Array","isArray","length","observe","unobserve"],"sources":["../../../src/hooks/useIntersectionObserver.ts"],"sourcesContent":["import { useLayoutEffect, useState } from \"react\";\n\nexport const useIntersectionObserver = (\n  ref: React.RefObject<HTMLElement>,\n  options?: IntersectionObserverInit,\n): IntersectionObserverEntry | undefined => {\n  const [entry, setEntry] = useState<IntersectionObserverEntry>();\n  useLayoutEffect(() => {\n    const element = ref.current ? ref.current : null;\n    const intersectionObserver = new IntersectionObserver((entries) => {\n      if (!Array.isArray(entries)) {\n        return;\n      }\n      if (!entries.length) {\n        return;\n      }\n      setEntry(entries[0]);\n    }, options);\n    if (element) {\n      intersectionObserver.observe(element);\n    }\n    return () => {\n      if (element) {\n        intersectionObserver.unobserve(element);\n      }\n    };\n  }, [options, ref]);\n  return entry;\n};\n"],"mappings":"AAAA,SAASA,eAAe,EAAEC,QAAQ,QAAQ,OAAO;AAEjD,OAAO,IAAMC,uBAAuB,GAAGA,CACrCC,GAAiC,EACjCC,OAAkC,KACQ;EAC1C,IAAM,CAACC,KAAK,EAAEC,QAAQ,CAAC,GAAGL,QAAQ,CAA4B,CAAC;EAC/DD,eAAe,CAAC,MAAM;IACpB,IAAMO,OAAO,GAAGJ,GAAG,CAACK,OAAO,GAAGL,GAAG,CAACK,OAAO,GAAG,IAAI;IAChD,IAAMC,oBAAoB,GAAG,IAAIC,oBAAoB,CAAEC,OAAO,IAAK;MACjE,IAAI,CAACC,KAAK,CAACC,OAAO,CAACF,OAAO,CAAC,EAAE;QAC3B;MACF;MACA,IAAI,CAACA,OAAO,CAACG,MAAM,EAAE;QACnB;MACF;MACAR,QAAQ,CAACK,OAAO,CAAC,CAAC,CAAC,CAAC;IACtB,CAAC,EAAEP,OAAO,CAAC;IACX,IAAIG,OAAO,EAAE;MACXE,oBAAoB,CAACM,OAAO,CAACR,OAAO,CAAC;IACvC;IACA,OAAO,MAAM;MACX,IAAIA,OAAO,EAAE;QACXE,oBAAoB,CAACO,SAAS,CAACT,OAAO,CAAC;MACzC;IACF,CAAC;EACH,CAAC,EAAE,CAACH,OAAO,EAAED,GAAG,CAAC,CAAC;EAClB,OAAOE,KAAK;AACd,CAAC","ignoreList":[]}
+{"version":3,"file":"useIntersectionObserver.js","names":["useLayoutEffect","useState","useIntersectionObserver","ref","options","entry","setEntry","element","current","intersectionObserver","IntersectionObserver","entries","Array","isArray","length","observe","unobserve"],"sources":["../../../src/hooks/useIntersectionObserver.ts"],"sourcesContent":["import { useLayoutEffect, useState } from \"react\";\n\nexport const useIntersectionObserver = (\n  ref: React.RefObject<HTMLElement | null>,\n  options?: IntersectionObserverInit,\n): IntersectionObserverEntry | undefined => {\n  const [entry, setEntry] = useState<IntersectionObserverEntry>();\n  useLayoutEffect(() => {\n    const element = ref.current ? ref.current : null;\n    const intersectionObserver = new IntersectionObserver((entries) => {\n      if (!Array.isArray(entries)) {\n        return;\n      }\n      if (!entries.length) {\n        return;\n      }\n      setEntry(entries[0]);\n    }, options);\n    if (element) {\n      intersectionObserver.observe(element);\n    }\n    return () => {\n      if (element) {\n        intersectionObserver.unobserve(element);\n      }\n    };\n  }, [options, ref]);\n  return entry;\n};\n"],"mappings":"AAAA,SAASA,eAAe,EAAEC,QAAQ,QAAQ,OAAO;AAEjD,OAAO,IAAMC,uBAAuB,GAAGA,CACrCC,GAAwC,EACxCC,OAAkC,KACQ;EAC1C,IAAM,CAACC,KAAK,EAAEC,QAAQ,CAAC,GAAGL,QAAQ,CAA4B,CAAC;EAC/DD,eAAe,CAAC,MAAM;IACpB,IAAMO,OAAO,GAAGJ,GAAG,CAACK,OAAO,GAAGL,GAAG,CAACK,OAAO,GAAG,IAAI;IAChD,IAAMC,oBAAoB,GAAG,IAAIC,oBAAoB,CAAEC,OAAO,IAAK;MACjE,IAAI,CAACC,KAAK,CAACC,OAAO,CAACF,OAAO,CAAC,EAAE;QAC3B;MACF;MACA,IAAI,CAACA,OAAO,CAACG,MAAM,EAAE;QACnB;MACF;MACAR,QAAQ,CAACK,OAAO,CAAC,CAAC,CAAC,CAAC;IACtB,CAAC,EAAEP,OAAO,CAAC;IACX,IAAIG,OAAO,EAAE;MACXE,oBAAoB,CAACM,OAAO,CAACR,OAAO,CAAC;IACvC;IACA,OAAO,MAAM;MACX,IAAIA,OAAO,EAAE;QACXE,oBAAoB,CAACO,SAAS,CAACT,OAAO,CAAC;MACzC;IACF,CAAC;EACH,CAAC,EAAE,CAACH,OAAO,EAAED,GAAG,CAAC,CAAC;EAClB,OAAOE,KAAK;AACd,CAAC","ignoreList":[]}

package/hooks/useInterval.js

@@ -1,7 +1,7 @@
 import { isBrowser } from "../isBrowser";
 import { useEffect, useRef } from "react";
 export var useInterval = (callback, delay, flag) => {
-  var savedCallback = useRef();
+  var savedCallback = useRef(undefined);
   useEffect(() => {
     savedCallback.current = callback;
   }, [callback]);

package/hooks/useInterval.js.map

@@ -1 +1 @@
-{"version":3,"file":"useInterval.js","names":["isBrowser","useEffect","useRef","useInterval","callback","delay","flag","savedCallback","current","tick","undefined","id","window","setInterval","clearInterval"],"sources":["../../../src/hooks/useInterval.ts"],"sourcesContent":["import { isBrowser } from \"../isBrowser\";\nimport { useEffect, useRef } from \"react\";\n\ntype Callback = (...argv: unknown[]) => void;\n\nexport const useInterval = (\n  callback: Callback,\n  delay: number,\n  flag?: boolean,\n) => {\n  const savedCallback = useRef<undefined | Callback>();\n\n  useEffect(() => {\n    savedCallback.current = callback;\n  }, [callback]);\n\n  useEffect(() => {\n    if (!isBrowser) return;\n    const tick = () => {\n      if (savedCallback.current !== undefined) {\n        savedCallback.current();\n      }\n    };\n\n    const id = flag || flag === undefined ? window.setInterval(tick, delay) : 0;\n    return () => window.clearInterval(id);\n  }, [delay, flag]);\n};\n"],"mappings":"AAAA,SAASA,SAAS,QAAQ,cAAc;AACxC,SAASC,SAAS,EAAEC,MAAM,QAAQ,OAAO;AAIzC,OAAO,IAAMC,WAAW,GAAGA,CACzBC,QAAkB,EAClBC,KAAa,EACbC,IAAc,KACX;EACH,IAAMC,aAAa,GAAGL,MAAM,CAAuB,CAAC;EAEpDD,SAAS,CAAC,MAAM;IACdM,aAAa,CAACC,OAAO,GAAGJ,QAAQ;EAClC,CAAC,EAAE,CAACA,QAAQ,CAAC,CAAC;EAEdH,SAAS,CAAC,MAAM;IACd,IAAI,CAACD,SAAS,EAAE;IAChB,IAAMS,IAAI,GAAGA,CAAA,KAAM;MACjB,IAAIF,aAAa,CAACC,OAAO,KAAKE,SAAS,EAAE;QACvCH,aAAa,CAACC,OAAO,CAAC,CAAC;MACzB;IACF,CAAC;IAED,IAAMG,EAAE,GAAGL,IAAI,IAAIA,IAAI,KAAKI,SAAS,GAAGE,MAAM,CAACC,WAAW,CAACJ,IAAI,EAAEJ,KAAK,CAAC,GAAG,CAAC;IAC3E,OAAO,MAAMO,MAAM,CAACE,aAAa,CAACH,EAAE,CAAC;EACvC,CAAC,EAAE,CAACN,KAAK,EAAEC,IAAI,CAAC,CAAC;AACnB,CAAC","ignoreList":[]}
+{"version":3,"file":"useInterval.js","names":["isBrowser","useEffect","useRef","useInterval","callback","delay","flag","savedCallback","undefined","current","tick","id","window","setInterval","clearInterval"],"sources":["../../../src/hooks/useInterval.ts"],"sourcesContent":["import { isBrowser } from \"../isBrowser\";\nimport { useEffect, useRef } from \"react\";\n\ntype Callback = (...argv: unknown[]) => void;\n\nexport const useInterval = (\n  callback: Callback,\n  delay: number,\n  flag?: boolean,\n) => {\n  const savedCallback = useRef<undefined | Callback>(undefined);\n\n  useEffect(() => {\n    savedCallback.current = callback;\n  }, [callback]);\n\n  useEffect(() => {\n    if (!isBrowser) return;\n    const tick = () => {\n      if (savedCallback.current !== undefined) {\n        savedCallback.current();\n      }\n    };\n\n    const id = flag || flag === undefined ? window.setInterval(tick, delay) : 0;\n    return () => window.clearInterval(id);\n  }, [delay, flag]);\n};\n"],"mappings":"AAAA,SAASA,SAAS,QAAQ,cAAc;AACxC,SAASC,SAAS,EAAEC,MAAM,QAAQ,OAAO;AAIzC,OAAO,IAAMC,WAAW,GAAGA,CACzBC,QAAkB,EAClBC,KAAa,EACbC,IAAc,KACX;EACH,IAAMC,aAAa,GAAGL,MAAM,CAAuBM,SAAS,CAAC;EAE7DP,SAAS,CAAC,MAAM;IACdM,aAAa,CAACE,OAAO,GAAGL,QAAQ;EAClC,CAAC,EAAE,CAACA,QAAQ,CAAC,CAAC;EAEdH,SAAS,CAAC,MAAM;IACd,IAAI,CAACD,SAAS,EAAE;IAChB,IAAMU,IAAI,GAAGA,CAAA,KAAM;MACjB,IAAIH,aAAa,CAACE,OAAO,KAAKD,SAAS,EAAE;QACvCD,aAAa,CAACE,OAAO,CAAC,CAAC;MACzB;IACF,CAAC;IAED,IAAME,EAAE,GAAGL,IAAI,IAAIA,IAAI,KAAKE,SAAS,GAAGI,MAAM,CAACC,WAAW,CAACH,IAAI,EAAEL,KAAK,CAAC,GAAG,CAAC;IAC3E,OAAO,MAAMO,MAAM,CAACE,aAAa,CAACH,EAAE,CAAC;EACvC,CAAC,EAAE,CAACN,KAAK,EAAEC,IAAI,CAAC,CAAC;AACnB,CAAC","ignoreList":[]}

package/hooks/useOnClickOutside.d.ts

@@ -1 +1 @@
-export declare const useOnClickOutside: (ref: React.RefObject<HTMLElement> | React.RefObject<HTMLElement>[], handler?: (event: MouseEvent | TouchEvent) => void) => void;
+export declare const useOnClickOutside: (ref: React.RefObject<HTMLElement | null> | React.RefObject<HTMLElement | null>[], handler?: (event: MouseEvent | TouchEvent) => void) => void;

package/hooks/useOnClickOutside.js.map

@@ -1 +1 @@
-{"version":3,"file":"useOnClickOutside.js","names":["useEffect","useOnClickOutside","ref","handler","undefined","listener","event","Array","isArray","i","length","element","current","contains","composedPath","document","addEventListener","removeEventListener"],"sources":["../../../src/hooks/useOnClickOutside.ts"],"sourcesContent":["import { useEffect } from \"react\";\nexport const useOnClickOutside = (\n  ref: React.RefObject<HTMLElement> | React.RefObject<HTMLElement>[],\n  handler?: (event: MouseEvent | TouchEvent) => void,\n) => {\n  useEffect(() => {\n    if (!handler) {\n      return undefined;\n    }\n    const listener = (event: MouseEvent | TouchEvent) => {\n      if (Array.isArray(ref)) {\n        // eslint-disable-next-line @typescript-eslint/prefer-for-of\n        for (let i = 0; i < ref.length; i++) {\n          const element = ref[i].current;\n          // 1つ目の要素がないからといって、2つ目の要素もなくクリック範囲に含まれていないとは言えない。\n          if (element?.contains(event.composedPath()[0] as Node)) {\n            return;\n          }\n        }\n      } else {\n        if (\n          !ref.current ||\n          ref.current.contains(event.composedPath()[0] as Node)\n        ) {\n          return;\n        }\n      }\n\n      handler(event);\n    };\n\n    document.addEventListener(\"mousedown\", listener);\n    document.addEventListener(\"touchstart\", listener);\n\n    return () => {\n      document.removeEventListener(\"mousedown\", listener);\n      document.removeEventListener(\"touchstart\", listener);\n    };\n  }, [ref, handler]);\n};\n"],"mappings":"AAAA,SAASA,SAAS,QAAQ,OAAO;AACjC,OAAO,IAAMC,iBAAiB,GAAGA,CAC/BC,GAAkE,EAClEC,OAAkD,KAC/C;EACHH,SAAS,CAAC,MAAM;IACd,IAAI,CAACG,OAAO,EAAE;MACZ,OAAOC,SAAS;IAClB;IACA,IAAMC,QAAQ,GAAIC,KAA8B,IAAK;MACnD,IAAIC,KAAK,CAACC,OAAO,CAACN,GAAG,CAAC,EAAE;QACtB;QACA,KAAK,IAAIO,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGP,GAAG,CAACQ,MAAM,EAAED,CAAC,EAAE,EAAE;UACnC,IAAME,OAAO,GAAGT,GAAG,CAACO,CAAC,CAAC,CAACG,OAAO;UAC9B;UACA,IAAID,OAAO,YAAPA,OAAO,CAAEE,QAAQ,CAACP,KAAK,CAACQ,YAAY,CAAC,CAAC,CAAC,CAAC,CAAS,CAAC,EAAE;YACtD;UACF;QACF;MACF,CAAC,MAAM;QACL,IACE,CAACZ,GAAG,CAACU,OAAO,IACZV,GAAG,CAACU,OAAO,CAACC,QAAQ,CAACP,KAAK,CAACQ,YAAY,CAAC,CAAC,CAAC,CAAC,CAAS,CAAC,EACrD;UACA;QACF;MACF;MAEAX,OAAO,CAACG,KAAK,CAAC;IAChB,CAAC;IAEDS,QAAQ,CAACC,gBAAgB,CAAC,WAAW,EAAEX,QAAQ,CAAC;IAChDU,QAAQ,CAACC,gBAAgB,CAAC,YAAY,EAAEX,QAAQ,CAAC;IAEjD,OAAO,MAAM;MACXU,QAAQ,CAACE,mBAAmB,CAAC,WAAW,EAAEZ,QAAQ,CAAC;MACnDU,QAAQ,CAACE,mBAAmB,CAAC,YAAY,EAAEZ,QAAQ,CAAC;IACtD,CAAC;EACH,CAAC,EAAE,CAACH,GAAG,EAAEC,OAAO,CAAC,CAAC;AACpB,CAAC","ignoreList":[]}
+{"version":3,"file":"useOnClickOutside.js","names":["useEffect","useOnClickOutside","ref","handler","undefined","listener","event","Array","isArray","i","length","element","current","contains","composedPath","document","addEventListener","removeEventListener"],"sources":["../../../src/hooks/useOnClickOutside.ts"],"sourcesContent":["import { useEffect } from \"react\";\nexport const useOnClickOutside = (\n  ref:\n    | React.RefObject<HTMLElement | null>\n    | React.RefObject<HTMLElement | null>[],\n  handler?: (event: MouseEvent | TouchEvent) => void,\n) => {\n  useEffect(() => {\n    if (!handler) {\n      return undefined;\n    }\n    const listener = (event: MouseEvent | TouchEvent) => {\n      if (Array.isArray(ref)) {\n        // eslint-disable-next-line @typescript-eslint/prefer-for-of\n        for (let i = 0; i < ref.length; i++) {\n          const element = ref[i].current;\n          // 1つ目の要素がないからといって、2つ目の要素もなくクリック範囲に含まれていないとは言えない。\n          if (element?.contains(event.composedPath()[0] as Node)) {\n            return;\n          }\n        }\n      } else {\n        if (\n          !ref.current ||\n          ref.current.contains(event.composedPath()[0] as Node)\n        ) {\n          return;\n        }\n      }\n\n      handler(event);\n    };\n\n    document.addEventListener(\"mousedown\", listener);\n    document.addEventListener(\"touchstart\", listener);\n\n    return () => {\n      document.removeEventListener(\"mousedown\", listener);\n      document.removeEventListener(\"touchstart\", listener);\n    };\n  }, [ref, handler]);\n};\n"],"mappings":"AAAA,SAASA,SAAS,QAAQ,OAAO;AACjC,OAAO,IAAMC,iBAAiB,GAAGA,CAC/BC,GAEyC,EACzCC,OAAkD,KAC/C;EACHH,SAAS,CAAC,MAAM;IACd,IAAI,CAACG,OAAO,EAAE;MACZ,OAAOC,SAAS;IAClB;IACA,IAAMC,QAAQ,GAAIC,KAA8B,IAAK;MACnD,IAAIC,KAAK,CAACC,OAAO,CAACN,GAAG,CAAC,EAAE;QACtB;QACA,KAAK,IAAIO,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGP,GAAG,CAACQ,MAAM,EAAED,CAAC,EAAE,EAAE;UACnC,IAAME,OAAO,GAAGT,GAAG,CAACO,CAAC,CAAC,CAACG,OAAO;UAC9B;UACA,IAAID,OAAO,YAAPA,OAAO,CAAEE,QAAQ,CAACP,KAAK,CAACQ,YAAY,CAAC,CAAC,CAAC,CAAC,CAAS,CAAC,EAAE;YACtD;UACF;QACF;MACF,CAAC,MAAM;QACL,IACE,CAACZ,GAAG,CAACU,OAAO,IACZV,GAAG,CAACU,OAAO,CAACC,QAAQ,CAACP,KAAK,CAACQ,YAAY,CAAC,CAAC,CAAC,CAAC,CAAS,CAAC,EACrD;UACA;QACF;MACF;MAEAX,OAAO,CAACG,KAAK,CAAC;IAChB,CAAC;IAEDS,QAAQ,CAACC,gBAAgB,CAAC,WAAW,EAAEX,QAAQ,CAAC;IAChDU,QAAQ,CAACC,gBAAgB,CAAC,YAAY,EAAEX,QAAQ,CAAC;IAEjD,OAAO,MAAM;MACXU,QAAQ,CAACE,mBAAmB,CAAC,WAAW,EAAEZ,QAAQ,CAAC;MACnDU,QAAQ,CAACE,mBAAmB,CAAC,YAAY,EAAEZ,QAAQ,CAAC;IACtD,CAAC;EACH,CAAC,EAAE,CAACH,GAAG,EAAEC,OAAO,CAAC,CAAC;AACpB,CAAC","ignoreList":[]}

package/hooks/useResizeObserver.d.ts

@@ -1 +1 @@
-export declare const useResizeObserver: <T extends HTMLElement>(ref: React.RefObject<T>) => ResizeObserverEntry | undefined;
+export declare const useResizeObserver: <T extends HTMLElement>(ref: React.RefObject<T | null>) => ResizeObserverEntry | undefined;

package/hooks/useResizeObserver.js.map

@@ -1 +1 @@
-{"version":3,"file":"useResizeObserver.js","names":["isBrowser","useEffect","useState","ResizeObserver","animationFrameID","useResizeObserver","ref","entry","setEntry","element","current","resizeObserver","entries","Array","isArray","length","window","requestAnimationFrame","observe","unobserve","cancelAnimationFrame"],"sources":["../../../src/hooks/useResizeObserver.ts"],"sourcesContent":["import { isBrowser } from \"../isBrowser\";\nimport { useEffect, useState } from \"react\";\nimport ResizeObserver from \"resize-observer-polyfill\";\n\nlet animationFrameID = 0;\nexport const useResizeObserver = <T extends HTMLElement>(\n  ref: React.RefObject<T>,\n): ResizeObserverEntry | undefined => {\n  const [entry, setEntry] = useState<ResizeObserverEntry>();\n\n  useEffect(() => {\n    if (!isBrowser) return;\n    const element = ref.current ? ref.current : null;\n    const resizeObserver = new ResizeObserver(\n      (entries: ResizeObserverEntry[]) => {\n        if (!Array.isArray(entries)) {\n          return;\n        }\n        if (!entries.length) {\n          return;\n        }\n        animationFrameID = window.requestAnimationFrame(() => {\n          setEntry(entries[0]);\n        });\n      },\n    );\n    if (element) {\n      resizeObserver.observe(element);\n    }\n\n    return () => {\n      if (element) {\n        resizeObserver.unobserve(element);\n      }\n      window.cancelAnimationFrame(animationFrameID);\n    };\n  }, [ref]);\n  return entry;\n};\n"],"mappings":"AAAA,SAASA,SAAS,QAAQ,cAAc;AACxC,SAASC,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAC3C,OAAOC,cAAc,MAAM,0BAA0B;AAErD,IAAIC,gBAAgB,GAAG,CAAC;AACxB,OAAO,IAAMC,iBAAiB,GAC5BC,GAAuB,IACa;EACpC,IAAM,CAACC,KAAK,EAAEC,QAAQ,CAAC,GAAGN,QAAQ,CAAsB,CAAC;EAEzDD,SAAS,CAAC,MAAM;IACd,IAAI,CAACD,SAAS,EAAE;IAChB,IAAMS,OAAO,GAAGH,GAAG,CAACI,OAAO,GAAGJ,GAAG,CAACI,OAAO,GAAG,IAAI;IAChD,IAAMC,cAAc,GAAG,IAAIR,cAAc,CACtCS,OAA8B,IAAK;MAClC,IAAI,CAACC,KAAK,CAACC,OAAO,CAACF,OAAO,CAAC,EAAE;QAC3B;MACF;MACA,IAAI,CAACA,OAAO,CAACG,MAAM,EAAE;QACnB;MACF;MACAX,gBAAgB,GAAGY,MAAM,CAACC,qBAAqB,CAAC,MAAM;QACpDT,QAAQ,CAACI,OAAO,CAAC,CAAC,CAAC,CAAC;MACtB,CAAC,CAAC;IACJ,CACF,CAAC;IACD,IAAIH,OAAO,EAAE;MACXE,cAAc,CAACO,OAAO,CAACT,OAAO,CAAC;IACjC;IAEA,OAAO,MAAM;MACX,IAAIA,OAAO,EAAE;QACXE,cAAc,CAACQ,SAAS,CAACV,OAAO,CAAC;MACnC;MACAO,MAAM,CAACI,oBAAoB,CAAChB,gBAAgB,CAAC;IAC/C,CAAC;EACH,CAAC,EAAE,CAACE,GAAG,CAAC,CAAC;EACT,OAAOC,KAAK;AACd,CAAC","ignoreList":[]}
+{"version":3,"file":"useResizeObserver.js","names":["isBrowser","useEffect","useState","ResizeObserver","animationFrameID","useResizeObserver","ref","entry","setEntry","element","current","resizeObserver","entries","Array","isArray","length","window","requestAnimationFrame","observe","unobserve","cancelAnimationFrame"],"sources":["../../../src/hooks/useResizeObserver.ts"],"sourcesContent":["import { isBrowser } from \"../isBrowser\";\nimport { useEffect, useState } from \"react\";\nimport ResizeObserver from \"resize-observer-polyfill\";\n\nlet animationFrameID = 0;\nexport const useResizeObserver = <T extends HTMLElement>(\n  ref: React.RefObject<T | null>,\n): ResizeObserverEntry | undefined => {\n  const [entry, setEntry] = useState<ResizeObserverEntry>();\n\n  useEffect(() => {\n    if (!isBrowser) return;\n    const element = ref.current ? ref.current : null;\n    const resizeObserver = new ResizeObserver(\n      (entries: ResizeObserverEntry[]) => {\n        if (!Array.isArray(entries)) {\n          return;\n        }\n        if (!entries.length) {\n          return;\n        }\n        animationFrameID = window.requestAnimationFrame(() => {\n          setEntry(entries[0]);\n        });\n      },\n    );\n    if (element) {\n      resizeObserver.observe(element);\n    }\n\n    return () => {\n      if (element) {\n        resizeObserver.unobserve(element);\n      }\n      window.cancelAnimationFrame(animationFrameID);\n    };\n  }, [ref]);\n  return entry;\n};\n"],"mappings":"AAAA,SAASA,SAAS,QAAQ,cAAc;AACxC,SAASC,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAC3C,OAAOC,cAAc,MAAM,0BAA0B;AAErD,IAAIC,gBAAgB,GAAG,CAAC;AACxB,OAAO,IAAMC,iBAAiB,GAC5BC,GAA8B,IACM;EACpC,IAAM,CAACC,KAAK,EAAEC,QAAQ,CAAC,GAAGN,QAAQ,CAAsB,CAAC;EAEzDD,SAAS,CAAC,MAAM;IACd,IAAI,CAACD,SAAS,EAAE;IAChB,IAAMS,OAAO,GAAGH,GAAG,CAACI,OAAO,GAAGJ,GAAG,CAACI,OAAO,GAAG,IAAI;IAChD,IAAMC,cAAc,GAAG,IAAIR,cAAc,CACtCS,OAA8B,IAAK;MAClC,IAAI,CAACC,KAAK,CAACC,OAAO,CAACF,OAAO,CAAC,EAAE;QAC3B;MACF;MACA,IAAI,CAACA,OAAO,CAACG,MAAM,EAAE;QACnB;MACF;MACAX,gBAAgB,GAAGY,MAAM,CAACC,qBAAqB,CAAC,MAAM;QACpDT,QAAQ,CAACI,OAAO,CAAC,CAAC,CAAC,CAAC;MACtB,CAAC,CAAC;IACJ,CACF,CAAC;IACD,IAAIH,OAAO,EAAE;MACXE,cAAc,CAACO,OAAO,CAACT,OAAO,CAAC;IACjC;IAEA,OAAO,MAAM;MACX,IAAIA,OAAO,EAAE;QACXE,cAAc,CAACQ,SAAS,CAACV,OAAO,CAAC;MACnC;MACAO,MAAM,CAACI,oBAAoB,CAAChB,gBAAgB,CAAC;IAC/C,CAAC;EACH,CAAC,EAAE,CAACE,GAAG,CAAC,CAAC;EACT,OAAOC,KAAK;AACd,CAAC","ignoreList":[]}

package/hooks/useTimeout.js

@@ -1,6 +1,6 @@
 import { useEffect, useRef } from "react";
 export var useTimeout = (callback, delay) => {
-  var savedCallback = useRef();
+  var savedCallback = useRef(undefined);
   useEffect(() => {
     savedCallback.current = callback;
   }, [callback]);

package/hooks/useTimeout.js.map

@@ -1 +1 @@
-{"version":3,"file":"useTimeout.js","names":["useEffect","useRef","useTimeout","callback","delay","savedCallback","current","tick","undefined","id","setTimeout","clearTimeout"],"sources":["../../../src/hooks/useTimeout.ts"],"sourcesContent":["import { useEffect, useRef } from \"react\";\n\ntype Callback = (...argv: unknown[]) => void;\n\nexport const useTimeout = (callback: Callback, delay: number) => {\n  const savedCallback = useRef<undefined | Callback>();\n\n  useEffect(() => {\n    savedCallback.current = callback;\n  }, [callback]);\n\n  useEffect(() => {\n    const tick = () => {\n      if (savedCallback.current !== undefined) {\n        savedCallback.current();\n      }\n    };\n    const id = setTimeout(tick, delay);\n    return () => clearTimeout(id);\n  }, [delay]);\n};\n"],"mappings":"AAAA,SAASA,SAAS,EAAEC,MAAM,QAAQ,OAAO;AAIzC,OAAO,IAAMC,UAAU,GAAGA,CAACC,QAAkB,EAAEC,KAAa,KAAK;EAC/D,IAAMC,aAAa,GAAGJ,MAAM,CAAuB,CAAC;EAEpDD,SAAS,CAAC,MAAM;IACdK,aAAa,CAACC,OAAO,GAAGH,QAAQ;EAClC,CAAC,EAAE,CAACA,QAAQ,CAAC,CAAC;EAEdH,SAAS,CAAC,MAAM;IACd,IAAMO,IAAI,GAAGA,CAAA,KAAM;MACjB,IAAIF,aAAa,CAACC,OAAO,KAAKE,SAAS,EAAE;QACvCH,aAAa,CAACC,OAAO,CAAC,CAAC;MACzB;IACF,CAAC;IACD,IAAMG,EAAE,GAAGC,UAAU,CAACH,IAAI,EAAEH,KAAK,CAAC;IAClC,OAAO,MAAMO,YAAY,CAACF,EAAE,CAAC;EAC/B,CAAC,EAAE,CAACL,KAAK,CAAC,CAAC;AACb,CAAC","ignoreList":[]}
+{"version":3,"file":"useTimeout.js","names":["useEffect","useRef","useTimeout","callback","delay","savedCallback","undefined","current","tick","id","setTimeout","clearTimeout"],"sources":["../../../src/hooks/useTimeout.ts"],"sourcesContent":["import { useEffect, useRef } from \"react\";\n\ntype Callback = (...argv: unknown[]) => void;\n\nexport const useTimeout = (callback: Callback, delay: number) => {\n  const savedCallback = useRef<undefined | Callback>(undefined);\n\n  useEffect(() => {\n    savedCallback.current = callback;\n  }, [callback]);\n\n  useEffect(() => {\n    const tick = () => {\n      if (savedCallback.current !== undefined) {\n        savedCallback.current();\n      }\n    };\n    const id = setTimeout(tick, delay);\n    return () => clearTimeout(id);\n  }, [delay]);\n};\n"],"mappings":"AAAA,SAASA,SAAS,EAAEC,MAAM,QAAQ,OAAO;AAIzC,OAAO,IAAMC,UAAU,GAAGA,CAACC,QAAkB,EAAEC,KAAa,KAAK;EAC/D,IAAMC,aAAa,GAAGJ,MAAM,CAAuBK,SAAS,CAAC;EAE7DN,SAAS,CAAC,MAAM;IACdK,aAAa,CAACE,OAAO,GAAGJ,QAAQ;EAClC,CAAC,EAAE,CAACA,QAAQ,CAAC,CAAC;EAEdH,SAAS,CAAC,MAAM;IACd,IAAMQ,IAAI,GAAGA,CAAA,KAAM;MACjB,IAAIH,aAAa,CAACE,OAAO,KAAKD,SAAS,EAAE;QACvCD,aAAa,CAACE,OAAO,CAAC,CAAC;MACzB;IACF,CAAC;IACD,IAAME,EAAE,GAAGC,UAAU,CAACF,IAAI,EAAEJ,KAAK,CAAC;IAClC,OAAO,MAAMO,YAAY,CAACF,EAAE,CAAC;EAC/B,CAAC,EAAE,CAACL,KAAK,CAAC,CAAC;AACb,CAAC","ignoreList":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "matsuri-ui",
-  "version": "16.6.1-alpha-1736063445138-dc67269.0",
+  "version": "16.6.1-alpha-1736669614668-b87c8e4.0",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/matsuri-tech/matsuri-ui.git"
@@ -32,8 +32,8 @@
     "node_modules"
   ],
   "dependencies": {
-    "@mui/icons-material": "6.3.0",
-    "@mui/material": "6.3.0",
+    "@mui/icons-material": "6.3.1",
+    "@mui/material": "6.3.1",
     "@popperjs/core": "2.11.8",
     "framer-motion": "11.15.0",
     "react-popper": "2.3.0",
@@ -69,14 +69,10 @@
     "@tanstack/react-virtual": "3.11.2",
     "@testing-library/react": "16.1.0",
     "@types/jest": "29.5.14",
-    "@types/react": "18.3.18",
-    "@types/react-dom": "18.3.5",
     "concurrently": "9.1.2",
     "dayjs": "1.11.13",
     "jest": "29.7.0",
     "jest-environment-jsdom": "29.7.0",
-    "react": "18.3.1",
-    "react-dom": "18.3.1",
     "react-router-dom": "7.1.1",
     "ress": "5.0.2",
     "tslib": "2.8.1"

package/react-spring.d.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=react-spring.d.js.map

package/react-spring.d.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"react-spring.d.js","names":[],"sources":["../../src/react-spring.d.ts"],"sourcesContent":["import { WithAnimated } from \"react-spring\";\n\ntype Animated = {\n  [Tag in keyof React.JSX.IntrinsicElements]: AnimatedComponent;\n};\n\ndeclare module \"react-spring\" {\n  export const animated: Animated & WithAnimated;\n}\n"],"mappings":"","ignoreList":[]}

package/types/AsComponentProps.d.ts

@@ -10,4 +10,4 @@ export type MergeWithAs<ComponentProps extends object, AsProps extends object, A
 };
 export type ComponentWithAs<Component extends As, Props extends object = Dict> = <AsComponent extends As = Component>(props: MergeWithAs<React.ComponentProps<Component>, React.ComponentProps<AsComponent>, Props, AsComponent> & {
     ref?: AsRef<AsComponent>;
-}) => JSX.Element | null;
+}) => React.JSX.Element | null;

package/types/CSVImportUI/CSVImportUI.d.ts

@@ -18,7 +18,7 @@ export type CSVImportUIColumn = Readonly<{
         value: string;
         header: string;
         row: Record<string, string>;
-    }) => JSX.Element;
+    }) => React.JSX.Element;
 }>;
 /**
  * ライブラリ利用者用の型
@@ -173,7 +173,7 @@ export interface CSVImportUIProps<Columns extends CSVImportUIColumns, Row extend
      * 省略するとonSearchData, searchLabelを用いた単一の検索フィールドが表示される。これを指定するとonSearchData, searchLabelは無視される。
      * (only upload mode)
      */
-    renderSearchField?: (props: CSVImportUIRenderSearchFieldProps<Row>) => JSX.Element;
+    renderSearchField?: (props: CSVImportUIRenderSearchFieldProps<Row>) => React.JSX.Element;
     /**
      * 編集用CSVをダウンロードするページをスキップする
      */

package/types/CSVImportUI/CSVImportUISearchScreen.d.ts

@@ -1,14 +1,14 @@
 import { CSVImportUIRenderSearchFieldProps } from "./CSVImportUI";
 interface CSVImportUISearchScreenProps<Row> {
     searchLabel?: string;
-    renderData: (data: Row[]) => JSX.Element;
+    renderData: (data: Row[]) => React.JSX.Element;
     onSearch?: (args: {
         value: string;
     }) => Promise<{
         data: Row[];
     }>;
     onDownloadTemplate: (data: Row[]) => void;
-    renderSearchField?: (props: CSVImportUIRenderSearchFieldProps<Row>) => JSX.Element;
+    renderSearchField?: (props: CSVImportUIRenderSearchFieldProps<Row>) => React.JSX.Element;
 }
 export declare const CSVImportUISearchScreen: <Row extends Record<string, string>>({ searchLabel, renderData, onSearch, onDownloadTemplate, renderSearchField: RenderSearchField, }: CSVImportUISearchScreenProps<Row>) => import("@emotion/react/jsx-runtime").JSX.Element;
 export {};

package/types/CSVImportUI/screens/DownloadUpdateTemplateScreen.d.ts

@@ -7,7 +7,7 @@ export interface DownloadUpdateTemplateScreenProps<Row> extends ScreenProps {
     }) => Promise<{
         data: Row[];
     }>;
-    renderSearchField?: (props: CSVImportUIRenderSearchFieldProps<Row>) => JSX.Element;
+    renderSearchField?: (props: CSVImportUIRenderSearchFieldProps<Row>) => React.JSX.Element;
     headers: string[];
     csvPrefix?: string;
     onDownloadCSV?: (args: {

package/types/CalendarUI/index.d.ts

@@ -31,4 +31,4 @@ export interface CalendarUIProps<T> extends CalendarProps<T> {
 }
 export declare const CalendarUI: <Props>(props: CalendarUIProps<Props> & {
     ref?: React.Ref<HTMLDivElement>;
-}) => JSX.Element;
+}) => React.JSX.Element;

package/types/ErrorBoundary/ErrorBoundary.d.ts

@@ -7,7 +7,7 @@ export type ErrorBoundaryHandleError = (args: ErrorBoundaryHandleArguments) => v
 export interface ErrorBoundaryProps {
     children?: React.ReactNode;
     onError?: ErrorBoundaryHandleError;
-    fallback?: React.ReactNode | ((props: ErrorBoundaryHandleArguments) => JSX.Element);
+    fallback?: React.ReactNode | ((props: ErrorBoundaryHandleArguments) => React.JSX.Element);
 }
 export type ErrorBoundaryState = {
     hasError: true;

package/types/GlobalMenu/index.d.ts

@@ -1,7 +1,7 @@
 export type GlobalMenuRenderInternalLink = (props: {
     href: string;
     children: React.ReactNode;
-}) => JSX.Element;
+}) => React.JSX.Element;
 interface MenuItem {
     text: string;
     href: string;
@@ -25,7 +25,7 @@ export interface GlobalMenuProps {
     renderInternalLink: (props: {
         href: string;
         children: React.ReactNode;
-    }) => JSX.Element;
+    }) => React.JSX.Element;
 }
 export declare const GlobalMenu: (props: GlobalMenuProps) => import("@emotion/react/jsx-runtime").JSX.Element;
 export {};

package/types/ImageUploadArea/ImageUploadArea.d.ts

@@ -1,3 +1,4 @@
+import React from "react";
 export interface Image {
     data: string;
     id: string;
@@ -13,6 +14,6 @@ export interface ImageUploadAreaProps {
     onUpload: (data: string[]) => void;
     onDelete: (id: string) => void;
     onReorder?: (ids: string[]) => void;
-    renderImage?: (props: ImageUploadAreaImageProps) => JSX.Element;
+    renderImage?: (props: ImageUploadAreaImageProps) => React.JSX.Element;
 }
 export declare const ImageUploadArea: ({ images, readBlob, onUpload, onDelete, onReorder, renderImage: ImageComponent, }: ImageUploadAreaProps) => import("@emotion/react/jsx-runtime").JSX.Element;

package/types/InputBase/InputBase.d.ts

@@ -15,7 +15,7 @@ export interface InputBaseProps extends React.InputHTMLAttributes<HTMLInputEleme
     children?: never;
     renderInputWrapper?: ({ children, }: {
         children: React.ReactNode;
-    }) => JSX.Element;
+    }) => React.JSX.Element;
     "data-touched"?: string | boolean;
     "data-invalid"?: string | boolean;
 }

package/types/Modal/Modal.d.ts

@@ -25,15 +25,15 @@ export interface ModalProps extends React.HTMLAttributes<HTMLDivElement>, Pick<P
     /**
      * Modal上部に指定された要素を挿入します。
      */
-    header?: JSX.Element;
+    header?: React.JSX.Element;
     /**
      * Modalに指定された要素を挿入します。
      */
-    body?: JSX.Element;
+    body?: React.JSX.Element;
     /**
      * Modal下部に指定された要素を挿入します。
      */
-    footer?: JSX.Element;
+    footer?: React.JSX.Element;
     /**
      * Modalの幅を固定にしたい場合に指定します。
      * maxWidthを超えられない点には注意してください。

package/types/Modal/useModal.d.ts

@@ -10,4 +10,4 @@ export interface UseModalOptions extends UseModalStateOptions {
      */
     size?: "sm" | "md" | "lg";
 }
-export declare const useModal: <T extends Record<string, any>>(Modal: (props: T) => JSX.Element, options?: UseModalOptions) => readonly [(props?: T) => void, () => void];
+export declare const useModal: <T extends Record<string, any>>(Modal: (props: T) => React.JSX.Element, options?: UseModalOptions) => readonly [(props?: T) => void, () => void];

package/types/Peek/index.d.ts

@@ -9,7 +9,7 @@ interface PeekPanelProps<T> {
      */
     renderContent: (props: {
         data?: T;
-    }) => JSX.Element;
+    }) => React.JSX.Element;
     /**
      * renderContentに渡されるデータ
      */

package/types/ProgressBar/ProgressBar.d.ts

@@ -6,7 +6,7 @@ export type ProgressBarLabel = (props: Readonly<{
     rate: number;
     percent: number;
     children?: never;
-}>) => JSX.Element;
+}>) => React.JSX.Element;
 export interface ProgressBarProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "color">, PartialColorProps {
     /**
      * 進捗度合いを表します。0以上の自然数のみ有効です。

package/types/RadioButton/RadioButtonGroup.d.ts

@@ -3,6 +3,6 @@ export interface RadioButtonGroupProps {
     name: string;
     value?: string;
     onChange?: (event: React.SyntheticEvent<HTMLInputElement>) => void;
-    children: React.ReactElement[];
+    children: React.ReactElement<any>[];
 }
 export declare const RadioButtonGroup: ({ name, children, value, onChange, }: RadioButtonGroupProps) => import("@emotion/react/jsx-runtime").JSX.Element;

package/types/SelectField/SelectField.d.ts

@@ -7,7 +7,7 @@ export interface SelectOptionValue {
     keys?: string[];
     [key: string]: any;
 }
-export type RenderSelectOption<T extends SelectOptionValue = SelectOptionValue> = (peops: T) => JSX.Element;
+export type RenderSelectOption<T extends SelectOptionValue = SelectOptionValue> = (peops: T) => React.JSX.Element;
 export interface SelectFieldProps<T extends SelectOptionValue = SelectOptionValue> extends Pick<FieldProps<string>, "helperText" | "invalid">, FieldGroupProps {
     renderOption?: RenderSelectOption<T>;
     children?: React.ReactNode;

package/types/ShimmerEffect/ShimmerEffect.d.ts

@@ -1,3 +1,4 @@
+import { SerializedStyles } from "@emotion/react";
 import React from "react";
 /**
  * 要素の大きさに合わせたローディング用の表示を作ることができます。
@@ -7,6 +8,8 @@ import React from "react";
  * - ローディング前から大きさは固定だが、入れる場所によって大きさが変動してしまう要素
  */
 export declare const ShimmerEffect: ({ children, active, }: {
-    children: React.ReactElement;
+    children: React.ReactElement<{
+        css?: SerializedStyles | SerializedStyles[];
+    }>;
     active?: boolean;
 }) => React.ReactElement<any, string | React.JSXElementConstructor<any>>;

package/types/SortArea/index.d.ts

@@ -6,7 +6,7 @@ export interface SortAreaProps extends Omit<RowProps, "onChange"> {
      * keyはuniqueでなければなりません。決して安直なmapのindexなどを渡さないようにしてください。
      * また子コンポーネントは任意のpropsを受け取れるようになっている必要があります。
      */
-    children: React.ReactElement[];
+    children: React.ReactElement<any>[];
     /**
      * 並び順を管理するための配列です。
      * これが存在しない場合、SortAreaは無効化されます。

package/types/Table/useTable.d.ts

@@ -23,7 +23,7 @@ export interface UseTableCellProps<S, K extends keyof S> {
     };
     row: Props<S>;
 }
-export type TableCell<S, K extends keyof S> = (props: UseTableCellProps<S, K>) => JSX.Element;
+export type TableCell<S, K extends keyof S> = (props: UseTableCellProps<S, K>) => React.JSX.Element;
 interface ColumnLayoutProperties {
     width?: string | number;
     minWidth?: string | number;
@@ -40,8 +40,8 @@ type Column<S, K extends keyof S> = {
             filterValue: S[K];
             setFilter: (value: S[K]) => void;
         };
-    }) => JSX.Element);
-    Cell?: (props: UseTableCellProps<S, K>) => JSX.Element;
+    }) => React.JSX.Element);
+    Cell?: (props: UseTableCellProps<S, K>) => React.JSX.Element;
     cellProps?: {
         style?: React.CSSProperties;
     };
@@ -76,7 +76,7 @@ export declare const useTable: <S extends TableDataItem>({ data, ...props }: {
     headers: {
         key: string;
         style: Record<string, any>;
-        render: () => JSX.Element | string;
+        render: () => React.JSX.Element | string;
     }[];
     rows: Rows<S>;
     page: Row<S>[];

package/types/TableUI/index.d.ts

@@ -1,4 +1,5 @@
 import { WithPaginationProps } from "./WithPagination";
+import React from "react";
 export interface TableUIRenderCellProps<Row, Value> {
     cell: {
         value: Value;
@@ -9,7 +10,7 @@ export type TableUIColumn<Row> = {
     [Key in keyof Row]: {
         key: Key;
         title?: string;
-        renderCell?: ({ cell, row, }: TableUIRenderCellProps<Row, Row[Key]>) => JSX.Element;
+        renderCell?: ({ cell, row, }: TableUIRenderCellProps<Row, Row[Key]>) => React.JSX.Element;
         sort?: (a: Row[Key], b: Row[Key]) => number;
         /**
          * この列の幅が全体に占める比を指定する。
@@ -74,6 +75,6 @@ export interface TableUIProps<Row> extends WithPaginationProps {
     /**
      * 行の末尾にインタラクティブ要素を追加するためのメソッド
      */
-    renderActions?: (args: TableUIPropsRenderActionsArgs<Row>) => JSX.Element;
+    renderActions?: (args: TableUIPropsRenderActionsArgs<Row>) => React.JSX.Element;
 }
 export declare const TableUI: <Row extends Record<string, any>>(props: TableUIProps<Row>) => import("@emotion/react/jsx-runtime").JSX.Element;

package/types/Tabs/TabUI.d.ts

@@ -21,7 +21,7 @@ export interface BaseTabUIProps<T> {
      */
     renderTab?: (props: T & {
         children: React.ReactNode;
-    }) => React.ReactElement | null;
+    }) => React.ReactElement<any> | null;
     /**
      * タブをどのような位置に表示するかを指定します。
      * @default "start"

package/types/Timeline/Timeline.d.ts

@@ -13,11 +13,11 @@ export interface TimelineProps<Props extends UnknownProps> extends React.HTMLAtt
      * TimelineProps.datesで指定されたデータをpropsとして受け取り表示するためのコンポーネントを指定します。
      * @deprecated Use `renderItem` instead.
      */
-    item?: (props: TimelineItemProps<Props>) => JSX.Element;
+    item?: (props: TimelineItemProps<Props>) => React.JSX.Element;
     /**
      * TimelineProps.datesで指定されたデータをpropsとして受け取り表示するためのコンポーネントを指定します。
      */
-    renderItem?: (props: TimelineItemProps<Props>) => JSX.Element;
+    renderItem?: (props: TimelineItemProps<Props>) => React.JSX.Element;
     /**
      * 日付と、日付に対応するデータ群を指定します。
      *
@@ -61,6 +61,6 @@ export interface TimelineProps<Props extends UnknownProps> extends React.HTMLAtt
     /**
      * フォーマットされた日付を受け取り、ラベルとして表示するコンポーネントを指定します。
      */
-    renderLabel?: (props: TimelineLabelProps) => JSX.Element;
+    renderLabel?: (props: TimelineLabelProps) => React.JSX.Element;
 }
 export declare const Timeline: <E extends UnknownProps>({ item, renderItem, dates, format, separators, date, renderLabel: Label, ...props }: TimelineProps<E>) => import("@emotion/react/jsx-runtime").JSX.Element | null;

package/types/Tooltip/Tooltip.d.ts

@@ -2,7 +2,7 @@ import { PopperBaseProps } from "../Popper";
 import React from "react";
 export interface TooltipProps extends Pick<PopperBaseProps, "placement"> {
     title: string;
-    children: React.ReactElement | string;
+    children: React.ReactElement<any> | string;
     /**
      * 矢印を表示します。
      *

package/types/UserTextRenderer/UserTextRenderer.d.ts

@@ -3,6 +3,6 @@ export interface UserTextRendererProps {
     children?: string;
     renderLink?: (props: {
         href: string;
-    }) => JSX.Element;
+    }) => React.JSX.Element;
 }
 export declare const UserTextRenderer: ({ children, renderLink: RenderLink, }: UserTextRendererProps) => import("@emotion/react/jsx-runtime").JSX.Element;

package/types/WeeklyCalendarUI/WeeklyCalendar.d.ts

@@ -12,7 +12,7 @@ export type WeeklyCalendarRenderCellProps<T> = {
 /**
  * @deprecated use WeeklyCalendarRenderCellProps instead.
  */
-export type WeeklyCalendarRenderCell<T> = (props: WeeklyCalendarRenderCellProps<T>) => JSX.Element;
+export type WeeklyCalendarRenderCell<T> = (props: WeeklyCalendarRenderCellProps<T>) => React.JSX.Element;
 export interface WeeklyCalendarRenderDateProps {
     date: Date;
     isToday: boolean;
@@ -26,7 +26,7 @@ export interface WeeklyCalendarProps<T> {
     /**
      * datesで使用されたオブジェクトを引数として受け取り、どのように表示するかJSXで記述する。
      */
-    renderCell: (props: WeeklyCalendarRenderCellProps<T>) => JSX.Element;
+    renderCell: (props: WeeklyCalendarRenderCellProps<T>) => React.JSX.Element;
     /**
      * 最初に表示する日付を指定する。
      */
@@ -35,11 +35,11 @@ export interface WeeklyCalendarProps<T> {
      * 列の表示部分を別のコンポーネントに切り替えられます。
      * childrenからは各セルが配列で渡されます。
      */
-    renderColumn?: (props: WeeklyCalendarRenderColumnProps<T>) => JSX.Element;
+    renderColumn?: (props: WeeklyCalendarRenderColumnProps<T>) => React.JSX.Element;
     /**
      * 日付の表示部分を別のコンポーネントに切り替えられます。
      */
-    renderDate?: (props: WeeklyCalendarRenderDateProps) => JSX.Element;
+    renderDate?: (props: WeeklyCalendarRenderDateProps) => React.JSX.Element;
     /**
      * カラムの高さを指定する。
      * @default "auto"

package/types/WeeklyCalendarUI/WeeklyCalendarColumn.d.ts

@@ -5,11 +5,11 @@ export interface WeeklyCalendarColumnType<T> {
     isToday: boolean;
     index: number;
     rows: T[];
-    renderCell: (props: WeeklyCalendarRenderCellProps<T>) => JSX.Element;
+    renderCell: (props: WeeklyCalendarRenderCellProps<T>) => React.JSX.Element;
 }
 export interface WeeklyCalendarRenderColumnProps<T> extends WeeklyCalendarColumnType<T> {
     children: React.ReactNode;
-    rootRef?: React.RefObject<HTMLDivElement>;
-    renderCell: (props: WeeklyCalendarRenderCellProps<T>) => JSX.Element;
+    rootRef?: React.RefObject<HTMLDivElement | null>;
+    renderCell: (props: WeeklyCalendarRenderCellProps<T>) => React.JSX.Element;
 }
 export declare const WeeklyCalendarColumn: <T>({ isToday, children, rootRef, }: Partial<WeeklyCalendarRenderColumnProps<T>>) => import("@emotion/react/jsx-runtime").JSX.Element;

package/types/hooks/useFocus.d.ts

@@ -1 +1 @@
-export declare const useFocus: <T extends HTMLElement>(ref: React.RefObject<T>, defaultState?: boolean) => boolean;
+export declare const useFocus: <T extends HTMLElement>(ref: React.RefObject<T | null>, defaultState?: boolean) => boolean;

package/types/hooks/useHover.d.ts

@@ -1,2 +1,2 @@
 import React from "react";
-export declare const useHover: (ref: React.RefObject<HTMLElement>) => boolean;
+export declare const useHover: (ref: React.RefObject<HTMLElement | null>) => boolean;

package/types/hooks/useIntersectionObserver.d.ts

@@ -1 +1 @@
-export declare const useIntersectionObserver: (ref: React.RefObject<HTMLElement>, options?: IntersectionObserverInit) => IntersectionObserverEntry | undefined;
+export declare const useIntersectionObserver: (ref: React.RefObject<HTMLElement | null>, options?: IntersectionObserverInit) => IntersectionObserverEntry | undefined;

package/types/hooks/useOnClickOutside.d.ts

@@ -1 +1 @@
-export declare const useOnClickOutside: (ref: React.RefObject<HTMLElement> | React.RefObject<HTMLElement>[], handler?: (event: MouseEvent | TouchEvent) => void) => void;
+export declare const useOnClickOutside: (ref: React.RefObject<HTMLElement | null> | React.RefObject<HTMLElement | null>[], handler?: (event: MouseEvent | TouchEvent) => void) => void;

package/types/hooks/useResizeObserver.d.ts

@@ -1 +1 @@
-export declare const useResizeObserver: <T extends HTMLElement>(ref: React.RefObject<T>) => ResizeObserverEntry | undefined;
+export declare const useResizeObserver: <T extends HTMLElement>(ref: React.RefObject<T | null>) => ResizeObserverEntry | undefined;