@sleetch/react 1.0.7 → 1.0.8

package/dist/toc-CI_8-KFH.cjs

@@ -1,2 +0,0 @@
-require('./assets/toc.css');const e=require("./clsx-GLXUd3yb.cjs");let t=require("react"),n=require("react/jsx-runtime");var r={default:`_default_bwrp8_1`,title:`_title_bwrp8_27`,track:`_track_bwrp8_34`,line:`_line_bwrp8_38`,gapDot:`_gapDot_bwrp8_48`,list:`_list_bwrp8_61`,item:`_item_bwrp8_72`,link:`_link_bwrp8_76`,active:`_active_bwrp8_109`};function i({className:i,children:a,page:o,...s}){let c=(0,t.use)(o).default.toc;if(c.length==0)return null;let[l,u]=(0,t.useState)(new Set),[d,f]=(0,t.useState)(null),p=(0,t.useRef)(null),m=(0,t.useRef)(new Map),h=(0,t.useRef)(null);return(0,t.useEffect)(()=>{if(c.length===0)return;let e=c.map(e=>document.getElementById(e.id)).filter(e=>e!==null);if(e.length===0)return;let t=new IntersectionObserver(e=>{u(t=>{let n=new Set(t);for(let t of e)t.isIntersecting?n.add(t.target.id):n.delete(t.target.id);return n})},{rootMargin:`0px 0px -70% 0px`,threshold:0});for(let n of e)t.observe(n);return()=>t.disconnect()},[c]),(0,t.useEffect)(()=>{if(l.size>0){let e=-1;c.forEach((t,n)=>{l.has(t.id)&&(e=n)}),h.current=e,f(null);return}let e=p.current,t=h.current;if(!e||t===null||t>=c.length-1){f(null);return}let n=m.current.get(c[t].id),r=m.current.get(c[t+1].id);if(!n||!r){f(null);return}let i=e.getBoundingClientRect(),a=n.getBoundingClientRect(),o=r.getBoundingClientRect(),s=(a.bottom-i.top+(o.top-i.top))/2;f(s)},[l,c]),(0,n.jsxs)(`aside`,{className:e.t(r.default,i),...s,children:[(0,n.jsx)(`h3`,{className:r.title,children:`On this page`}),(0,n.jsxs)(`div`,{className:r.track,ref:p,children:[(0,n.jsx)(`span`,{className:r.line,"aria-hidden":`true`}),d!==null&&(0,n.jsx)(`span`,{className:r.gapDot,style:{top:d},"aria-hidden":`true`}),(0,n.jsx)(`ul`,{className:r.list,children:c.map(t=>{let i=l.has(t.id),a={"--depth":t.level};return(0,n.jsx)(`li`,{className:r.item,ref:e=>{e?m.current.set(t.id,e):m.current.delete(t.id)},children:(0,n.jsx)(`a`,{href:`#${t.id}`,title:t.title,"aria-current":i?`location`:void 0,className:e.t(r.link,i&&r.active),style:a,children:t.title})},t.id)})})]})]})}Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return i}});
-//# sourceMappingURL=toc-CI_8-KFH.cjs.map

package/dist/toc-CI_8-KFH.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"toc-CI_8-KFH.cjs","names":[],"sources":["../../styles/src/components/documentation/toc/index.module.css","../src/components/documentation/toc/index.tsx"],"sourcesContent":[".default {\n  min-width: var(--_sleetch-toc-width);\n  height: calc(100vh - var(--_sleetch-header-height));\n  position: sticky;\n  top: var(--_sleetch-header-height);\n  color: var(--_sleetch-color-text);\n  padding: 4em 2em;\n  border-left: 1px dashed var(--_sleetch-color-border);\n  display: flex;\n  flex-direction: column;\n  overflow-y: auto;\n}\n\n@media (max-width: 1024px) {\n  .default {\n    display: none;\n  }\n}\n\n@media (min-width: 1025px) and (max-width: 1280px) {\n  .default {\n    min-width: 220px;\n    padding: 3em 1.5em;\n  }\n}\n\n.title {\n  margin: 0 0 0.5em;\n  font-size: 0.9em;\n  font-weight: var(--_sleetch-font-weight-heading);\n  color: var(--_sleetch-color-text);\n}\n\n.track {\n  position: relative;\n}\n\n.line {\n  position: absolute;\n  left: 0;\n  top: 0;\n  bottom: 0;\n  width: 1px;\n  background: var(--_sleetch-color-muted);\n  z-index: 0;\n}\n\n.gapDot {\n  position: absolute;\n  left: 0;\n  width: 6px;\n  height: 6px;\n  border-radius: 50%;\n  background: var(--_sleetch-color-muted-foreground);\n  transform: translate(-50%, -50%);\n  z-index: 1;\n  pointer-events: none;\n  transition: top var(--_sleetch-transition-duration) var(--_sleetch-transition-timing);\n}\n\n.list {\n  position: relative; /* nécessaire pour que le z-index prenne le dessus sur .line */\n  z-index: 1;\n  list-style: none;\n  margin: 0;\n  padding: 0;\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n}\n\n.item {\n  min-width: 0; /* requis pour que l'ellipsis fonctionne dans un flex/grid parent */\n}\n\n.link {\n  --depth: 1;\n\n  display: block;\n  width: 100%;\n  margin-left: -1px; /* centre la bordure de 3px sur la ligne de 1px */\n  padding-block: 0.4em;\n  padding-left: calc(1em + (var(--depth) - 1) * 0.85em);\n  padding-right: 0.5em;\n\n  border-left: 3px solid transparent;\n\n  font-family: var(--_sleetch-font-base);\n  font-size: calc(0.85em - (var(--depth) - 1) * 0.03em);\n  line-height: 1.3;\n  color: var(--_sleetch-color-muted-foreground);\n  text-decoration: none;\n\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n\n  transition:\n    color var(--_sleetch-transition-duration) var(--_sleetch-transition-timing),\n    border-color var(--_sleetch-transition-duration) var(--_sleetch-transition-timing),\n    background-color var(--_sleetch-transition-duration) var(--_sleetch-transition-timing),\n    transform var(--_sleetch-transition-duration) var(--_sleetch-transition-timing);\n}\n\n.link:hover {\n  color: var(--_sleetch-color-text);\n}\n\n.active {\n  border-left-color: var(--_sleetch-color-text-primary);\n  background: color-mix(in srgb, var(--_sleetch-color-text-underline) 35%, transparent);\n  color: var(--_sleetch-color-text);\n  transform: translateX(4px);\n}\n","/*\nAI Generated :(\nNeeds more testing\n*/\n\nimport { use, useEffect, useRef, useState, type BaseHTMLAttributes, type CSSProperties } from 'react';\nimport styles from '@sleetch/styles/components/documentation/toc/index.module.css';\nimport clsx from 'clsx';\nimport type { page_module } from '@sleetch/core/compiler';\n\nexport interface DocumentationTocProps extends BaseHTMLAttributes<HTMLBaseElement> {\n  page: Promise<page_module>;\n}\n\ninterface TocLinkStyle extends CSSProperties {\n  '--depth'?: number;\n}\n\nexport function DocumentationToc({ className, children, page, ...props }: DocumentationTocProps) {\n  const value = use(page);\n  const toc = value.default.toc;\n  if (toc.length == 0) return null;\n\n  const [activeIds, setActiveIds] = useState<Set<string>>(new Set());\n  const [gapY, setGapY] = useState<number | null>(null);\n\n  const trackRef = useRef<HTMLDivElement>(null);\n  const itemRefs = useRef<Map<string, HTMLLIElement>>(new Map());\n  const lastActiveIndexRef = useRef<number | null>(null);\n\n  useEffect(() => {\n    if (toc.length === 0) return;\n\n    const elements = toc.map((item) => document.getElementById(item.id)).filter((el): el is HTMLElement => el !== null);\n\n    if (elements.length === 0) return;\n\n    const observer = new IntersectionObserver(\n      (entries) => {\n        setActiveIds((prev) => {\n          const next = new Set(prev);\n          for (const entry of entries) {\n            if (entry.isIntersecting) {\n              next.add(entry.target.id);\n            } else {\n              next.delete(entry.target.id);\n            }\n          }\n          return next;\n        });\n      },\n      {\n        rootMargin: '0px 0px -70% 0px',\n        threshold: 0,\n      }\n    );\n\n    for (const el of elements) observer.observe(el);\n\n    return () => observer.disconnect();\n  }, [toc]);\n\n  useEffect(() => {\n    if (activeIds.size > 0) {\n      let maxIndex = -1;\n      toc.forEach((item, i) => {\n        if (activeIds.has(item.id)) maxIndex = i;\n      });\n      lastActiveIndexRef.current = maxIndex;\n      setGapY(null);\n      return;\n    }\n\n    const track = trackRef.current;\n    const lastIndex = lastActiveIndexRef.current;\n\n    if (!track || lastIndex === null || lastIndex >= toc.length - 1) {\n      setGapY(null);\n      return;\n    }\n\n    const currentLi = itemRefs.current.get(toc[lastIndex].id);\n    const nextLi = itemRefs.current.get(toc[lastIndex + 1].id);\n\n    if (!currentLi || !nextLi) {\n      setGapY(null);\n      return;\n    }\n\n    const trackRect = track.getBoundingClientRect();\n    const currentRect = currentLi.getBoundingClientRect();\n    const nextRect = nextLi.getBoundingClientRect();\n\n    const y = (currentRect.bottom - trackRect.top + (nextRect.top - trackRect.top)) / 2;\n\n    setGapY(y);\n  }, [activeIds, toc]);\n\n  return (\n    <aside className={clsx(styles['default'], className)} {...props}>\n      <h3 className={styles['title']}>On this page</h3>\n      <div className={styles['track']} ref={trackRef}>\n        <span className={styles['line']} aria-hidden=\"true\" />\n        {gapY !== null && <span className={styles['gapDot']} style={{ top: gapY }} aria-hidden=\"true\" />}\n        <ul className={styles['list']}>\n          {toc.map((item) => {\n            const focused = activeIds.has(item.id);\n            const linkStyle: TocLinkStyle = { '--depth': item.level };\n\n            return (\n              <li\n                key={item.id}\n                className={styles['item']}\n                ref={(el) => {\n                  if (el) itemRefs.current.set(item.id, el);\n                  else itemRefs.current.delete(item.id);\n                }}\n              >\n                <a\n                  href={`#${item.id}`}\n                  title={item.title}\n                  aria-current={focused ? 'location' : undefined}\n                  className={clsx(styles['link'], focused && styles['active'])}\n                  style={linkStyle}\n                >\n                  {item.title}\n                </a>\n              </li>\n            );\n          })}\n        </ul>\n      </div>\n    </aside>\n  );\n}\n"],"mappings":"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"}

package/dist/toc-Dvn-UEjm.js

@@ -1,103 +0,0 @@
-import { t as e } from "./clsx-CaAiuA5w.js";
-import { use as t, useEffect as n, useRef as r, useState as i } from "react";
-import { jsx as a, jsxs as o } from "react/jsx-runtime";
-import './assets/toc.css';var s = {
-	default: "_default_bwrp8_1",
-	title: "_title_bwrp8_27",
-	track: "_track_bwrp8_34",
-	line: "_line_bwrp8_38",
-	gapDot: "_gapDot_bwrp8_48",
-	list: "_list_bwrp8_61",
-	item: "_item_bwrp8_72",
-	link: "_link_bwrp8_76",
-	active: "_active_bwrp8_109"
-};
-//#endregion
-//#region src/components/documentation/toc/index.tsx
-function c({ className: c, children: l, page: u, ...d }) {
-	let f = t(u).default.toc;
-	if (f.length == 0) return null;
-	let [p, m] = i(/* @__PURE__ */ new Set()), [h, g] = i(null), _ = r(null), v = r(/* @__PURE__ */ new Map()), y = r(null);
-	return n(() => {
-		if (f.length === 0) return;
-		let e = f.map((e) => document.getElementById(e.id)).filter((e) => e !== null);
-		if (e.length === 0) return;
-		let t = new IntersectionObserver((e) => {
-			m((t) => {
-				let n = new Set(t);
-				for (let t of e) t.isIntersecting ? n.add(t.target.id) : n.delete(t.target.id);
-				return n;
-			});
-		}, {
-			rootMargin: "0px 0px -70% 0px",
-			threshold: 0
-		});
-		for (let n of e) t.observe(n);
-		return () => t.disconnect();
-	}, [f]), n(() => {
-		if (p.size > 0) {
-			let e = -1;
-			f.forEach((t, n) => {
-				p.has(t.id) && (e = n);
-			}), y.current = e, g(null);
-			return;
-		}
-		let e = _.current, t = y.current;
-		if (!e || t === null || t >= f.length - 1) {
-			g(null);
-			return;
-		}
-		let n = v.current.get(f[t].id), r = v.current.get(f[t + 1].id);
-		if (!n || !r) {
-			g(null);
-			return;
-		}
-		let i = e.getBoundingClientRect(), a = n.getBoundingClientRect(), o = r.getBoundingClientRect(), s = (a.bottom - i.top + (o.top - i.top)) / 2;
-		g(s);
-	}, [p, f]), /* @__PURE__ */ o("aside", {
-		className: e(s.default, c),
-		...d,
-		children: [/* @__PURE__ */ a("h3", {
-			className: s.title,
-			children: "On this page"
-		}), /* @__PURE__ */ o("div", {
-			className: s.track,
-			ref: _,
-			children: [
-				/* @__PURE__ */ a("span", {
-					className: s.line,
-					"aria-hidden": "true"
-				}),
-				h !== null && /* @__PURE__ */ a("span", {
-					className: s.gapDot,
-					style: { top: h },
-					"aria-hidden": "true"
-				}),
-				/* @__PURE__ */ a("ul", {
-					className: s.list,
-					children: f.map((t) => {
-						let n = p.has(t.id), r = { "--depth": t.level };
-						return /* @__PURE__ */ a("li", {
-							className: s.item,
-							ref: (e) => {
-								e ? v.current.set(t.id, e) : v.current.delete(t.id);
-							},
-							children: /* @__PURE__ */ a("a", {
-								href: `#${t.id}`,
-								title: t.title,
-								"aria-current": n ? "location" : void 0,
-								className: e(s.link, n && s.active),
-								style: r,
-								children: t.title
-							})
-						}, t.id);
-					})
-				})
-			]
-		})]
-	});
-}
-//#endregion
-export { c as t };
-
-//# sourceMappingURL=toc-Dvn-UEjm.js.map

package/dist/toc-Dvn-UEjm.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"toc-Dvn-UEjm.js","names":[],"sources":["../../styles/src/components/documentation/toc/index.module.css","../src/components/documentation/toc/index.tsx"],"sourcesContent":[".default {\n  min-width: var(--_sleetch-toc-width);\n  height: calc(100vh - var(--_sleetch-header-height));\n  position: sticky;\n  top: var(--_sleetch-header-height);\n  color: var(--_sleetch-color-text);\n  padding: 4em 2em;\n  border-left: 1px dashed var(--_sleetch-color-border);\n  display: flex;\n  flex-direction: column;\n  overflow-y: auto;\n}\n\n@media (max-width: 1024px) {\n  .default {\n    display: none;\n  }\n}\n\n@media (min-width: 1025px) and (max-width: 1280px) {\n  .default {\n    min-width: 220px;\n    padding: 3em 1.5em;\n  }\n}\n\n.title {\n  margin: 0 0 0.5em;\n  font-size: 0.9em;\n  font-weight: var(--_sleetch-font-weight-heading);\n  color: var(--_sleetch-color-text);\n}\n\n.track {\n  position: relative;\n}\n\n.line {\n  position: absolute;\n  left: 0;\n  top: 0;\n  bottom: 0;\n  width: 1px;\n  background: var(--_sleetch-color-muted);\n  z-index: 0;\n}\n\n.gapDot {\n  position: absolute;\n  left: 0;\n  width: 6px;\n  height: 6px;\n  border-radius: 50%;\n  background: var(--_sleetch-color-muted-foreground);\n  transform: translate(-50%, -50%);\n  z-index: 1;\n  pointer-events: none;\n  transition: top var(--_sleetch-transition-duration) var(--_sleetch-transition-timing);\n}\n\n.list {\n  position: relative; /* nécessaire pour que le z-index prenne le dessus sur .line */\n  z-index: 1;\n  list-style: none;\n  margin: 0;\n  padding: 0;\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n}\n\n.item {\n  min-width: 0; /* requis pour que l'ellipsis fonctionne dans un flex/grid parent */\n}\n\n.link {\n  --depth: 1;\n\n  display: block;\n  width: 100%;\n  margin-left: -1px; /* centre la bordure de 3px sur la ligne de 1px */\n  padding-block: 0.4em;\n  padding-left: calc(1em + (var(--depth) - 1) * 0.85em);\n  padding-right: 0.5em;\n\n  border-left: 3px solid transparent;\n\n  font-family: var(--_sleetch-font-base);\n  font-size: calc(0.85em - (var(--depth) - 1) * 0.03em);\n  line-height: 1.3;\n  color: var(--_sleetch-color-muted-foreground);\n  text-decoration: none;\n\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n\n  transition:\n    color var(--_sleetch-transition-duration) var(--_sleetch-transition-timing),\n    border-color var(--_sleetch-transition-duration) var(--_sleetch-transition-timing),\n    background-color var(--_sleetch-transition-duration) var(--_sleetch-transition-timing),\n    transform var(--_sleetch-transition-duration) var(--_sleetch-transition-timing);\n}\n\n.link:hover {\n  color: var(--_sleetch-color-text);\n}\n\n.active {\n  border-left-color: var(--_sleetch-color-text-primary);\n  background: color-mix(in srgb, var(--_sleetch-color-text-underline) 35%, transparent);\n  color: var(--_sleetch-color-text);\n  transform: translateX(4px);\n}\n","/*\nAI Generated :(\nNeeds more testing\n*/\n\nimport { use, useEffect, useRef, useState, type BaseHTMLAttributes, type CSSProperties } from 'react';\nimport styles from '@sleetch/styles/components/documentation/toc/index.module.css';\nimport clsx from 'clsx';\nimport type { page_module } from '@sleetch/core/compiler';\n\nexport interface DocumentationTocProps extends BaseHTMLAttributes<HTMLBaseElement> {\n  page: Promise<page_module>;\n}\n\ninterface TocLinkStyle extends CSSProperties {\n  '--depth'?: number;\n}\n\nexport function DocumentationToc({ className, children, page, ...props }: DocumentationTocProps) {\n  const value = use(page);\n  const toc = value.default.toc;\n  if (toc.length == 0) return null;\n\n  const [activeIds, setActiveIds] = useState<Set<string>>(new Set());\n  const [gapY, setGapY] = useState<number | null>(null);\n\n  const trackRef = useRef<HTMLDivElement>(null);\n  const itemRefs = useRef<Map<string, HTMLLIElement>>(new Map());\n  const lastActiveIndexRef = useRef<number | null>(null);\n\n  useEffect(() => {\n    if (toc.length === 0) return;\n\n    const elements = toc.map((item) => document.getElementById(item.id)).filter((el): el is HTMLElement => el !== null);\n\n    if (elements.length === 0) return;\n\n    const observer = new IntersectionObserver(\n      (entries) => {\n        setActiveIds((prev) => {\n          const next = new Set(prev);\n          for (const entry of entries) {\n            if (entry.isIntersecting) {\n              next.add(entry.target.id);\n            } else {\n              next.delete(entry.target.id);\n            }\n          }\n          return next;\n        });\n      },\n      {\n        rootMargin: '0px 0px -70% 0px',\n        threshold: 0,\n      }\n    );\n\n    for (const el of elements) observer.observe(el);\n\n    return () => observer.disconnect();\n  }, [toc]);\n\n  useEffect(() => {\n    if (activeIds.size > 0) {\n      let maxIndex = -1;\n      toc.forEach((item, i) => {\n        if (activeIds.has(item.id)) maxIndex = i;\n      });\n      lastActiveIndexRef.current = maxIndex;\n      setGapY(null);\n      return;\n    }\n\n    const track = trackRef.current;\n    const lastIndex = lastActiveIndexRef.current;\n\n    if (!track || lastIndex === null || lastIndex >= toc.length - 1) {\n      setGapY(null);\n      return;\n    }\n\n    const currentLi = itemRefs.current.get(toc[lastIndex].id);\n    const nextLi = itemRefs.current.get(toc[lastIndex + 1].id);\n\n    if (!currentLi || !nextLi) {\n      setGapY(null);\n      return;\n    }\n\n    const trackRect = track.getBoundingClientRect();\n    const currentRect = currentLi.getBoundingClientRect();\n    const nextRect = nextLi.getBoundingClientRect();\n\n    const y = (currentRect.bottom - trackRect.top + (nextRect.top - trackRect.top)) / 2;\n\n    setGapY(y);\n  }, [activeIds, toc]);\n\n  return (\n    <aside className={clsx(styles['default'], className)} {...props}>\n      <h3 className={styles['title']}>On this page</h3>\n      <div className={styles['track']} ref={trackRef}>\n        <span className={styles['line']} aria-hidden=\"true\" />\n        {gapY !== null && <span className={styles['gapDot']} style={{ top: gapY }} aria-hidden=\"true\" />}\n        <ul className={styles['list']}>\n          {toc.map((item) => {\n            const focused = activeIds.has(item.id);\n            const linkStyle: TocLinkStyle = { '--depth': item.level };\n\n            return (\n              <li\n                key={item.id}\n                className={styles['item']}\n                ref={(el) => {\n                  if (el) itemRefs.current.set(item.id, el);\n                  else itemRefs.current.delete(item.id);\n                }}\n              >\n                <a\n                  href={`#${item.id}`}\n                  title={item.title}\n                  aria-current={focused ? 'location' : undefined}\n                  className={clsx(styles['link'], focused && styles['active'])}\n                  style={linkStyle}\n                >\n                  {item.title}\n                </a>\n              </li>\n            );\n          })}\n        </ul>\n      </div>\n    </aside>\n  );\n}\n"],"mappings":"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"}