@womp/kookie-ui 0.9.0 → 0.10.0

package/dist/cjs/hooks/use-scroll-edges.d.ts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+/**
+ * Publishes how much content is hidden past each block edge of a scroller, as
+ * `--scroll-overflow-start` and `--scroll-overflow-end` (px) on the element.
+ * The scroll fade reads them, so an edge fades only while content is hidden
+ * there, and the fade ramps in over the first pixels of scrolling.
+ *
+ * Writes happen at most once per frame, on scroll and when the element or its
+ * content resizes. Nothing re-renders.
+ */
+export declare function useScrollEdges<T extends HTMLElement>(enabled: boolean): React.Dispatch<React.SetStateAction<T | null>>;
+//# sourceMappingURL=use-scroll-edges.d.ts.map

package/dist/cjs/hooks/use-scroll-edges.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-scroll-edges.d.ts","sourceRoot":"","sources":["../../../src/hooks/use-scroll-edges.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B;;;;;;;;GAQG;AACH,wBAAgB,cAAc,CAAC,CAAC,SAAS,WAAW,EAAE,OAAO,EAAE,OAAO,kDAkCrE"}

package/dist/cjs/hooks/use-scroll-edges.js

@@ -0,0 +1,2 @@
+"use strict";var m=Object.create;var l=Object.defineProperty;var d=Object.getOwnPropertyDescriptor;var p=Object.getOwnPropertyNames;var y=Object.getPrototypeOf,b=Object.prototype.hasOwnProperty;var h=(t,e)=>{for(var r in e)l(t,r,{get:e[r],enumerable:!0})},f=(t,e,r,o)=>{if(e&&typeof e=="object"||typeof e=="function")for(let s of p(e))!b.call(t,s)&&s!==r&&l(t,s,{get:()=>e[s],enumerable:!(o=d(e,s))||o.enumerable});return t};var w=(t,e,r)=>(r=t!=null?m(y(t)):{},f(e||!t||!t.__esModule?l(r,"default",{value:t,enumerable:!0}):r,t)),x=t=>f(l({},"__esModule",{value:!0}),t);var M={};h(M,{useScrollEdges:()=>E});module.exports=x(M);var c=w(require("react"));function E(t){let[e,r]=c.useState(null);return c.useEffect(()=>{if(!t||!e)return;let o=0,s=()=>{o=0;let a=Math.max(0,e.scrollTop),v=Math.max(0,e.scrollHeight-e.clientHeight-e.scrollTop);e.style.setProperty("--scroll-overflow-start",`${a}px`),e.style.setProperty("--scroll-overflow-end",`${v}px`)},n=()=>{o||(o=requestAnimationFrame(s))};s(),e.addEventListener("scroll",n,{passive:!0});let i=typeof ResizeObserver>"u"?null:new ResizeObserver(n);i?.observe(e);for(let a of Array.from(e.children))i?.observe(a);let u=typeof MutationObserver>"u"?null:new MutationObserver(n);return u?.observe(e,{childList:!0}),()=>{o&&cancelAnimationFrame(o),e.removeEventListener("scroll",n),i?.disconnect(),u?.disconnect(),e.style.removeProperty("--scroll-overflow-start"),e.style.removeProperty("--scroll-overflow-end")}},[t,e]),r}
+//# sourceMappingURL=use-scroll-edges.js.map

package/dist/cjs/hooks/use-scroll-edges.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/hooks/use-scroll-edges.ts"],
+  "sourcesContent": ["import * as React from 'react';\n\n/**\n * Publishes how much content is hidden past each block edge of a scroller, as\n * `--scroll-overflow-start` and `--scroll-overflow-end` (px) on the element.\n * The scroll fade reads them, so an edge fades only while content is hidden\n * there, and the fade ramps in over the first pixels of scrolling.\n *\n * Writes happen at most once per frame, on scroll and when the element or its\n * content resizes. Nothing re-renders.\n */\nexport function useScrollEdges<T extends HTMLElement>(enabled: boolean) {\n  const [element, setElement] = React.useState<T | null>(null);\n\n  React.useEffect(() => {\n    if (!enabled || !element) return;\n    let frame = 0;\n    const write = () => {\n      frame = 0;\n      const start = Math.max(0, element.scrollTop);\n      const end = Math.max(0, element.scrollHeight - element.clientHeight - element.scrollTop);\n      element.style.setProperty('--scroll-overflow-start', `${start}px`);\n      element.style.setProperty('--scroll-overflow-end', `${end}px`);\n    };\n    const schedule = () => {\n      if (!frame) frame = requestAnimationFrame(write);\n    };\n    write();\n    element.addEventListener('scroll', schedule, { passive: true });\n    const observer = typeof ResizeObserver === 'undefined' ? null : new ResizeObserver(schedule);\n    observer?.observe(element);\n    for (const child of Array.from(element.children)) observer?.observe(child);\n    const mutations = typeof MutationObserver === 'undefined' ? null : new MutationObserver(schedule);\n    mutations?.observe(element, { childList: true });\n    return () => {\n      if (frame) cancelAnimationFrame(frame);\n      element.removeEventListener('scroll', schedule);\n      observer?.disconnect();\n      mutations?.disconnect();\n      element.style.removeProperty('--scroll-overflow-start');\n      element.style.removeProperty('--scroll-overflow-end');\n    };\n  }, [enabled, element]);\n\n  return setElement;\n}\n"],
+  "mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,oBAAAE,IAAA,eAAAC,EAAAH,GAAA,IAAAI,EAAuB,oBAWhB,SAASF,EAAsCG,EAAkB,CACtE,GAAM,CAACC,EAASC,CAAU,EAAU,WAAmB,IAAI,EAE3D,OAAM,YAAU,IAAM,CACpB,GAAI,CAACF,GAAW,CAACC,EAAS,OAC1B,IAAIE,EAAQ,EACNC,EAAQ,IAAM,CAClBD,EAAQ,EACR,IAAME,EAAQ,KAAK,IAAI,EAAGJ,EAAQ,SAAS,EACrCK,EAAM,KAAK,IAAI,EAAGL,EAAQ,aAAeA,EAAQ,aAAeA,EAAQ,SAAS,EACvFA,EAAQ,MAAM,YAAY,0BAA2B,GAAGI,CAAK,IAAI,EACjEJ,EAAQ,MAAM,YAAY,wBAAyB,GAAGK,CAAG,IAAI,CAC/D,EACMC,EAAW,IAAM,CAChBJ,IAAOA,EAAQ,sBAAsBC,CAAK,EACjD,EACAA,EAAM,EACNH,EAAQ,iBAAiB,SAAUM,EAAU,CAAE,QAAS,EAAK,CAAC,EAC9D,IAAMC,EAAW,OAAO,eAAmB,IAAc,KAAO,IAAI,eAAeD,CAAQ,EAC3FC,GAAU,QAAQP,CAAO,EACzB,QAAWQ,KAAS,MAAM,KAAKR,EAAQ,QAAQ,EAAGO,GAAU,QAAQC,CAAK,EACzE,IAAMC,EAAY,OAAO,iBAAqB,IAAc,KAAO,IAAI,iBAAiBH,CAAQ,EAChG,OAAAG,GAAW,QAAQT,EAAS,CAAE,UAAW,EAAK,CAAC,EACxC,IAAM,CACPE,GAAO,qBAAqBA,CAAK,EACrCF,EAAQ,oBAAoB,SAAUM,CAAQ,EAC9CC,GAAU,WAAW,EACrBE,GAAW,WAAW,EACtBT,EAAQ,MAAM,eAAe,yBAAyB,EACtDA,EAAQ,MAAM,eAAe,uBAAuB,CACtD,CACF,EAAG,CAACD,EAASC,CAAO,CAAC,EAEdC,CACT",
+  "names": ["use_scroll_edges_exports", "__export", "useScrollEdges", "__toCommonJS", "React", "enabled", "element", "setElement", "frame", "write", "start", "end", "schedule", "observer", "child", "mutations"]
+}