@intlayer/design-system 2.0.2

package/dist/components/Navbar/DesktopNavbar.es.js

@@ -0,0 +1,76 @@
+"use client";
+import { j as a } from "../../jsx-runtime-Tw_Kw2GZ.js";
+import { p as o, c as b } from "../../styled-components.browser.esm-D6kkzXl4.js";
+import { Button as v } from "../Button/index.es.js";
+import { useNavActions as k } from "./useNavigation.es.js";
+const m = o.nav(() => [{
+  position: "sticky",
+  top: "0px",
+  zIndex: "50",
+  display: "flex",
+  width: "100vw",
+  alignItems: "center",
+  backgroundColor: "rgba(231, 231, 231, 0.8)",
+  paddingLeft: "1rem",
+  paddingRight: "1rem",
+  paddingTop: "0.75rem",
+  paddingBottom: "0.75rem",
+  "--tw-shadow": "0 0 10px -15px rgba(0,0,0,0.3)",
+  "--tw-shadow-colored": "0 0 10px -15px var(--tw-shadow-color)",
+  boxShadow: "var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)",
+  "--tw-backdrop-blur": "blur(8px)",
+  backdropFilter: "var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)",
+  '&:where([data-theme="dark"], [data-theme="dark"] *)': {
+    backgroundColor: "rgba(69, 69, 69, 0.8)"
+  }
+}, b`
+    -webkit-backdrop-filter: var(--tw-backdrop-blur)
+      var(--tw-backdrop-brightness) var(--tw-backdrop-contrast)
+      var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate)
+      var(--tw-backdrop-invert) var(--tw-backdrop-opacity)
+      var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
+  `]), g = o.div({
+  marginLeft: "10vw",
+  display: "flex",
+  flexDirection: "row",
+  gap: "1.5rem",
+  letterSpacing: "0.025em",
+  "--tw-text-opacity": "1",
+  color: "rgba(93, 93, 93, var(--tw-text-opacity))",
+  '&:where([data-theme="dark"], [data-theme="dark"] *)': {
+    "--tw-text-opacity": "1",
+    color: "rgba(136, 136, 136, var(--tw-text-opacity))"
+  }
+}), h = o.div({
+  marginRight: "1rem",
+  display: "flex",
+  width: "100%",
+  alignItems: "center",
+  justifyContent: "flex-end",
+  gap: "0.5rem"
+}), j = ({
+  logo: e,
+  sections: t,
+  rightItems: i
+}) => {
+  const {
+    activeSection: d,
+    onClickSection: c
+  } = k();
+  return /* @__PURE__ */ a.jsxs(m, { children: [
+    e,
+    /* @__PURE__ */ a.jsx(g, { role: "tablist", "aria-orientation": "horizontal", "aria-multiselectable": "false", children: t == null ? void 0 : t.map(({
+      id: r,
+      url: p,
+      label: n,
+      title: l,
+      onClick: s
+    }) => /* @__PURE__ */ a.jsx(v, { role: "tab", variant: "invisible-link", color: "text", "aria-selected": d === r, label: n, onClick: (w) => {
+      c(r, p), s(w);
+    }, children: l }, r)) }),
+    /* @__PURE__ */ a.jsx(h, { children: i })
+  ] });
+};
+export {
+  j as DesktopNavbar
+};

package/dist/components/Navbar/MobileNavbar.cjs.js

@@ -0,0 +1,9 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../../jsx-runtime-D6agescH.cjs"),r=require("../../styled-components.browser.esm-GqWwDlfY.cjs"),w=require("react"),D=require("../../hooks/useScrollBlockage/index.cjs.js"),H=require("../../hooks/useScrollDetection.cjs.js"),q=require("../MaxHeightSmoother/index.cjs.js"),I=require("./Burger.cjs.js"),B=require("./useNavigation.cjs.js"),y=require("../../motion-BuKul-u9.cjs"),N={open:{y:0,opacity:1,transition:{y:{stiffness:1e3,velocity:-100}}},closed:{y:50,opacity:0,transition:{y:{stiffness:1e3}}}},X={open:{transition:{staggerChildren:.07,delayChildren:.2}},closed:{transition:{staggerChildren:.05,staggerDirection:-1}}},Y=r.pt(y.motion.div)`
+  ${{width:"100%",cursor:"pointer",padding:"0.75rem",textAlign:"center",transitionProperty:"color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter",transitionTimingFunction:"cubic-bezier(0.4, 0, 0.2, 1)",transitionDuration:"150ms","&:hover":{"--tw-text-opacity":"1",color:"rgba(232, 121, 249, var(--tw-text-opacity))"},'&[aria-selected="true"]':{"--tw-text-opacity":"1",color:"rgba(232, 121, 249, var(--tw-text-opacity))"}}}
+`,g=({sections:o,activeSection:l,onClickSection:s})=>t.jsxRuntimeExports.jsx("div",{role:"tablist","aria-orientation":"vertical","aria-multiselectable":"false",children:o==null?void 0:o.map(({id:a,label:d,url:n,title:i,onClick:e})=>t.jsxRuntimeExports.jsx(Y,{role:"tab",id:a,"aria-label":d,onClick:c=>{s(a,n),e==null||e(c)},variants:N,"aria-selected":l===a,children:i},a))}),F=({logo:o,topChildren:l,topSections:s=[],bottomSections:a=[],rightItems:d})=>{var m;const[n,i]=w.useState(!1),[e,c]=w.useState(!1),x=w.useRef(null),{activeSection:v,onClickSection:u}=B.useNavActions();D.useScrollBlockage({disableScroll:e,key:"mobile_nav"}),H.useScrollDetection({onScrollUp:()=>i(!1),onScrollDown:()=>i(!0),isEnabled:!e});const h=n?0:((m=x.current)==null?void 0:m.clientHeight)??0,k=s.length+a.length>0,b=[{backgroundColor:"rgba(231, 231, 231, 0.95)","--tw-shadow":"0 0 10px -15px rgba(0,0,0,0.3)","--tw-shadow-colored":"0 0 10px -15px var(--tw-shadow-color)",boxShadow:"var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)","--tw-backdrop-blur":"blur(8px)",backdropFilter:"var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)",'&:where([data-theme="dark"], [data-theme="dark"] *)':{backgroundColor:"rgba(69, 69, 69, 0.95)"}},r.ct`
+      -webkit-backdrop-filter: var(--tw-backdrop-blur)
+        var(--tw-backdrop-brightness) var(--tw-backdrop-contrast)
+        var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate)
+        var(--tw-backdrop-invert) var(--tw-backdrop-opacity)
+        var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
+    `],f=r.pt.nav(({$isHidden:p})=>[...b,{position:"sticky",top:"0px",zIndex:"50",display:"flex",width:"100vw",flexDirection:"column",transitionProperty:"color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter",transitionTimingFunction:"cubic-bezier(0.4, 0, 0.2, 1)",transitionDuration:"150ms"},p?{"--tw-translate-y":"-100%",transform:"translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))"}:{"--tw-translate-y":"0px",transform:"translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))"}]),j=r.pt.div({display:"flex",width:"100%",alignItems:"center",justifyContent:"space-between",gap:"10vw",paddingLeft:"1rem",paddingRight:"1rem",paddingTop:"0.75rem",paddingBottom:"0.75rem"}),S=r.pt.div({display:"flex",width:"100%",alignItems:"center",justifyContent:"flex-end",gap:"1.5rem"}),R=r.pt.div({display:"flex",width:"100%",alignItems:"center",justifyContent:"flex-end",gap:"0.25rem"}),C=r.pt.div(()=>[...b,{position:"absolute",bottom:"0px",left:"0px",width:"100%","--tw-translate-y":"100%",transform:"translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))"}]),E=r.pt(y.motion.div)(()=>({display:"flex",width:"100%",flexDirection:"column",paddingBottom:"20%",paddingTop:"2.5rem",fontSize:"1.125rem",lineHeight:"1.75rem",letterSpacing:"0.025em","--tw-text-opacity":"1",color:"rgba(18, 18, 18, var(--tw-text-opacity))",'&:where([data-theme="dark"], [data-theme="dark"] *)':{"--tw-text-opacity":"1",color:"rgba(255, 245, 237, var(--tw-text-opacity))"}})),_=r.pt.div({display:"flex",height:"100%",flexDirection:"column",justifyContent:"space-between"});return t.jsxRuntimeExports.jsxs(f,{id:"mobile-menu",$isHidden:n,children:[t.jsxRuntimeExports.jsxs(j,{ref:x,children:[o,t.jsxRuntimeExports.jsxs(S,{children:[t.jsxRuntimeExports.jsx(R,{children:d}),k&&t.jsxRuntimeExports.jsx(I.Burger,{isActive:e,onClick:()=>c(p=>!p)})]})]}),t.jsxRuntimeExports.jsx(C,{children:t.jsxRuntimeExports.jsx(q.MaxHeightSmoother,{isHidden:!e,children:t.jsxRuntimeExports.jsxs(E,{onClick:()=>c(!1),animate:e?"open":"closed",variants:X,style:{height:`calc(100vh - ${h}px)`},children:[l,t.jsxRuntimeExports.jsxs(_,{children:[t.jsxRuntimeExports.jsx(g,{sections:s,activeSection:v,onClickSection:u}),t.jsxRuntimeExports.jsx(g,{sections:a,activeSection:v,onClickSection:u})]})]})})})]})};exports.MobileNavbar=F;

package/dist/components/Navbar/MobileNavbar.d.ts

@@ -0,0 +1,12 @@
+import { FC, ReactNode } from 'react';
+import { NavSection } from '.';
+
+type MobileNavbarProps = {
+    logo: ReactNode;
+    topChildren?: ReactNode;
+    topSections?: NavSection[];
+    bottomSections?: NavSection[];
+    rightItems?: ReactNode;
+};
+export declare const MobileNavbar: FC<MobileNavbarProps>;
+export {};

package/dist/components/Navbar/MobileNavbar.es.js

@@ -0,0 +1,199 @@
+"use client";
+import { j as t } from "../../jsx-runtime-Tw_Kw2GZ.js";
+import { p as r, c as R } from "../../styled-components.browser.esm-D6kkzXl4.js";
+import { useState as y, useRef as X } from "react";
+import { useScrollBlockage as Y } from "../../hooks/useScrollBlockage/index.es.js";
+import { useScrollDetection as B } from "../../hooks/useScrollDetection.es.js";
+import { MaxHeightSmoother as F } from "../MaxHeightSmoother/index.es.js";
+import { Burger as z } from "./Burger.es.js";
+import { useNavActions as P } from "./useNavigation.es.js";
+import { m as g } from "../../motion-CP5YERk7.js";
+const T = {
+  open: {
+    y: 0,
+    opacity: 1,
+    transition: {
+      y: {
+        stiffness: 1e3,
+        velocity: -100
+      }
+    }
+  },
+  closed: {
+    y: 50,
+    opacity: 0,
+    transition: {
+      y: {
+        stiffness: 1e3
+      }
+    }
+  }
+}, A = {
+  open: {
+    transition: {
+      staggerChildren: 0.07,
+      delayChildren: 0.2
+    }
+  },
+  closed: {
+    transition: {
+      staggerChildren: 0.05,
+      staggerDirection: -1
+    }
+  }
+}, L = r(g.div)`
+  ${{
+  width: "100%",
+  cursor: "pointer",
+  padding: "0.75rem",
+  textAlign: "center",
+  transitionProperty: "color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter",
+  transitionTimingFunction: "cubic-bezier(0.4, 0, 0.2, 1)",
+  transitionDuration: "150ms",
+  "&:hover": {
+    "--tw-text-opacity": "1",
+    color: "rgba(232, 121, 249, var(--tw-text-opacity))"
+  },
+  '&[aria-selected="true"]': {
+    "--tw-text-opacity": "1",
+    color: "rgba(232, 121, 249, var(--tw-text-opacity))"
+  }
+}}
+`, h = ({
+  sections: o,
+  activeSection: c,
+  onClickSection: i
+}) => /* @__PURE__ */ t.jsx("div", { role: "tablist", "aria-orientation": "vertical", "aria-multiselectable": "false", children: o == null ? void 0 : o.map(({
+  id: a,
+  label: d,
+  url: n,
+  title: s,
+  onClick: e
+}) => /* @__PURE__ */ t.jsx(L, { role: "tab", id: a, "aria-label": d, onClick: (l) => {
+  i(a, n), e == null || e(l);
+}, variants: T, "aria-selected": c === a, children: s }, a)) }), J = ({
+  logo: o,
+  topChildren: c,
+  topSections: i = [],
+  bottomSections: a = [],
+  rightItems: d
+}) => {
+  var x;
+  const [n, s] = y(!1), [e, l] = y(!1), p = X(null), {
+    activeSection: v,
+    onClickSection: b
+  } = P();
+  Y({
+    disableScroll: e,
+    key: "mobile_nav"
+  }), B({
+    onScrollUp: () => s(!1),
+    onScrollDown: () => s(!0),
+    isEnabled: !e
+  });
+  const f = n ? 0 : ((x = p.current) == null ? void 0 : x.clientHeight) ?? 0, k = i.length + a.length > 0, m = [{
+    backgroundColor: "rgba(231, 231, 231, 0.95)",
+    "--tw-shadow": "0 0 10px -15px rgba(0,0,0,0.3)",
+    "--tw-shadow-colored": "0 0 10px -15px var(--tw-shadow-color)",
+    boxShadow: "var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)",
+    "--tw-backdrop-blur": "blur(8px)",
+    backdropFilter: "var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)",
+    '&:where([data-theme="dark"], [data-theme="dark"] *)': {
+      backgroundColor: "rgba(69, 69, 69, 0.95)"
+    }
+  }, R`
+      -webkit-backdrop-filter: var(--tw-backdrop-blur)
+        var(--tw-backdrop-brightness) var(--tw-backdrop-contrast)
+        var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate)
+        var(--tw-backdrop-invert) var(--tw-backdrop-opacity)
+        var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
+    `], u = r.nav(({
+    $isHidden: w
+  }) => [...m, {
+    position: "sticky",
+    top: "0px",
+    zIndex: "50",
+    display: "flex",
+    width: "100vw",
+    flexDirection: "column",
+    transitionProperty: "color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter",
+    transitionTimingFunction: "cubic-bezier(0.4, 0, 0.2, 1)",
+    transitionDuration: "150ms"
+  }, w ? {
+    "--tw-translate-y": "-100%",
+    transform: "translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))"
+  } : {
+    "--tw-translate-y": "0px",
+    transform: "translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))"
+  }]), S = r.div({
+    display: "flex",
+    width: "100%",
+    alignItems: "center",
+    justifyContent: "space-between",
+    gap: "10vw",
+    paddingLeft: "1rem",
+    paddingRight: "1rem",
+    paddingTop: "0.75rem",
+    paddingBottom: "0.75rem"
+  }), j = r.div({
+    display: "flex",
+    width: "100%",
+    alignItems: "center",
+    justifyContent: "flex-end",
+    gap: "1.5rem"
+  }), C = r.div({
+    display: "flex",
+    width: "100%",
+    alignItems: "center",
+    justifyContent: "flex-end",
+    gap: "0.25rem"
+  }), D = r.div(() => [...m, {
+    position: "absolute",
+    bottom: "0px",
+    left: "0px",
+    width: "100%",
+    "--tw-translate-y": "100%",
+    transform: "translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))"
+  }]), H = r(g.div)(() => ({
+    display: "flex",
+    width: "100%",
+    flexDirection: "column",
+    paddingBottom: "20%",
+    paddingTop: "2.5rem",
+    fontSize: "1.125rem",
+    lineHeight: "1.75rem",
+    letterSpacing: "0.025em",
+    "--tw-text-opacity": "1",
+    color: "rgba(18, 18, 18, var(--tw-text-opacity))",
+    '&:where([data-theme="dark"], [data-theme="dark"] *)': {
+      "--tw-text-opacity": "1",
+      color: "rgba(255, 245, 237, var(--tw-text-opacity))"
+    }
+  })), I = r.div({
+    display: "flex",
+    height: "100%",
+    flexDirection: "column",
+    justifyContent: "space-between"
+  });
+  return /* @__PURE__ */ t.jsxs(u, { id: "mobile-menu", $isHidden: n, children: [
+    /* @__PURE__ */ t.jsxs(S, { ref: p, children: [
+      o,
+      /* @__PURE__ */ t.jsxs(j, { children: [
+        /* @__PURE__ */ t.jsx(C, { children: d }),
+        k && /* @__PURE__ */ t.jsx(z, { isActive: e, onClick: () => l((w) => !w) })
+      ] })
+    ] }),
+    /* @__PURE__ */ t.jsx(D, { children: /* @__PURE__ */ t.jsx(F, { isHidden: !e, children: /* @__PURE__ */ t.jsxs(H, { onClick: () => l(!1), animate: e ? "open" : "closed", variants: A, style: {
+      height: `calc(100vh - ${f}px)`
+    }, children: [
+      c,
+      /* @__PURE__ */ t.jsxs(I, { children: [
+        /* @__PURE__ */ t.jsx(h, { sections: i, activeSection: v, onClickSection: b }),
+        /* @__PURE__ */ t.jsx(h, { sections: a, activeSection: v, onClickSection: b })
+      ] })
+    ] }) }) })
+  ] });
+};
+export {
+  J as MobileNavbar
+};

package/dist/components/Navbar/index.cjs.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../jsx-runtime-D6agescH.cjs"),c=require("../../hooks/useDevice.cjs.js");require("react");require("../../hooks/useScrollBlockage/useScrollBlockageStore.cjs.js");const x=require("../../hooks/useIsMounted.cjs.js"),m=require("./DesktopNavbar.cjs.js"),b=require("./MobileNavbar.cjs.js"),p=({logo:t,mobileTopChildren:s,desktopSections:r=[],mobileTopSections:o=[],mobileBottomSections:n=[],rightItemsDesktop:i,rightItemsMobile:u})=>{const{isMobile:a}=c.useDevice();return x.useIsMounted()?e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{children:a?e.jsxRuntimeExports.jsx(b.MobileNavbar,{topChildren:s,topSections:o,bottomSections:n,logo:t,rightItems:u}):e.jsxRuntimeExports.jsx(m.DesktopNavbar,{sections:r,rightItems:i,logo:t})}):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{})};exports.Navbar=p;

package/dist/components/Navbar/index.d.ts

@@ -0,0 +1,20 @@
+import { FC, MouseEventHandler, ReactNode } from 'react';
+
+export interface NavSection {
+    title: ReactNode;
+    id: string;
+    onClick: MouseEventHandler;
+    url?: string;
+    label: string;
+}
+interface NavbarProps {
+    logo: ReactNode;
+    desktopSections?: NavSection[];
+    mobileTopChildren?: ReactNode;
+    mobileTopSections?: NavSection[];
+    mobileBottomSections?: NavSection[];
+    rightItemsDesktop?: ReactNode;
+    rightItemsMobile?: ReactNode;
+}
+export declare const Navbar: FC<NavbarProps>;
+export {};

package/dist/components/Navbar/index.es.js

@@ -0,0 +1,25 @@
+"use client";
+import { j as t } from "../../jsx-runtime-Tw_Kw2GZ.js";
+import { useDevice as a } from "../../hooks/useDevice.es.js";
+import "react";
+import "../../hooks/useScrollBlockage/useScrollBlockageStore.es.js";
+import { useIsMounted as c } from "../../hooks/useIsMounted.es.js";
+import { DesktopNavbar as u } from "./DesktopNavbar.es.js";
+import { MobileNavbar as x } from "./MobileNavbar.es.js";
+const g = ({
+  logo: o,
+  mobileTopChildren: r,
+  desktopSections: e = [],
+  mobileTopSections: s = [],
+  mobileBottomSections: i = [],
+  rightItemsDesktop: m,
+  rightItemsMobile: n
+}) => {
+  const {
+    isMobile: p
+  } = a();
+  return c() ? /* @__PURE__ */ t.jsx(t.Fragment, { children: p ? /* @__PURE__ */ t.jsx(x, { topChildren: r, topSections: s, bottomSections: i, logo: o, rightItems: n }) : /* @__PURE__ */ t.jsx(u, { sections: e, rightItems: m, logo: o }) }) : /* @__PURE__ */ t.jsx(t.Fragment, {});
+};
+export {
+  g as Navbar
+};

package/dist/components/Navbar/useNavigation.cjs.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react"),f=()=>{const[r,i]=l.useState(null),c=()=>{const e=window.scrollY,s=document.querySelectorAll("section"),t=[];s.forEach(o=>t.push({id:o.id,offsetTop:o.offsetTop,offsetHeight:o.offsetHeight}));const n=t.find(o=>o.offsetTop<=e+window.screen.height/4&&o.offsetTop+o.offsetHeight>e+window.screen.height/4);n&&i(n.id)};return l.useEffect(()=>(window.addEventListener("scroll",c),()=>{window.removeEventListener("scroll",c)}),[]),{activeSection:r,onClickLogo:e=>{i(null),window.location.pathname==="/"?window.scrollTo({top:0,behavior:"smooth"}):e("/")},onClickSection:(e,s,t)=>{if(i(e),window.location.pathname===s){const n=document.getElementById(e);n&&n.scrollIntoView({behavior:"smooth",block:"center",inline:"nearest"})}else t==null||t()}}};exports.useNavActions=f;

package/dist/components/Navbar/useNavigation.d.ts

@@ -0,0 +1,5 @@
+export declare const useNavActions: () => {
+    activeSection: string | null;
+    onClickLogo: (onClick: (url: string) => void) => void;
+    onClickSection: (sectionId: string, url?: string, onClick?: () => void) => void;
+};

package/dist/components/Navbar/useNavigation.es.js

@@ -0,0 +1,39 @@
+"use client";
+import { useState as r, useEffect as f } from "react";
+const h = () => {
+  const [l, i] = r(null), c = () => {
+    const e = window.scrollY, s = document.querySelectorAll("section"), t = [];
+    s.forEach((o) => t.push({
+      id: o.id,
+      offsetTop: o.offsetTop,
+      offsetHeight: o.offsetHeight
+    }));
+    const n = t.find((o) => o.offsetTop <= e + window.screen.height / 4 && o.offsetTop + o.offsetHeight > e + window.screen.height / 4);
+    n && i(n.id);
+  };
+  return f(() => (window.addEventListener("scroll", c), () => {
+    window.removeEventListener("scroll", c);
+  }), []), {
+    activeSection: l,
+    onClickLogo: (e) => {
+      i(null), window.location.pathname === "/" ? window.scrollTo({
+        top: 0,
+        behavior: "smooth"
+      }) : e("/");
+    },
+    onClickSection: (e, s, t) => {
+      if (i(e), window.location.pathname === s) {
+        const n = document.getElementById(e);
+        n && n.scrollIntoView({
+          behavior: "smooth",
+          block: "center",
+          inline: "nearest"
+        });
+      } else
+        t == null || t();
+    }
+  };
+};
+export {
+  h as useNavActions
+};

package/dist/components/Popover/index.cjs.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../jsx-runtime-D6agescH.cjs"),r=require("../../styled-components.browser.esm-GqWwDlfY.cjs"),a=r.pt.div({position:"relative"}),o=r.pt.div({position:"absolute",bottom:"0px",right:"1.25rem","--tw-translate-y":"1.75rem",transform:"translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))",borderRadius:"0.375rem",backgroundColor:"currentColor",padding:"0.25rem",fontSize:"0.75rem",lineHeight:"1rem","--tw-text-opacity":"0.75",opacity:"0",transitionProperty:"all",transitionTimingFunction:"cubic-bezier(0.4, 0, 0.2, 1)",transitionDuration:"200ms",transitionDelay:"700ms",animationDelay:"700ms",animationDuration:"200ms",animationTimingFunction:"cubic-bezier(0.4, 0, 0.2, 1)","&:hover":{transitionDelay:"0s",animationDelay:"0s"},".group:hover &":{opacity:"1"}}),n=r.pt.span({maxWidth:"60%",userSelect:"none","--tw-text-opacity":"1",color:"rgba(255, 255, 255, var(--tw-text-opacity))",mixBlendMode:"difference"}),s=({children:i,content:t})=>e.jsxRuntimeExports.jsxs(a,{className:"group","aria-haspopup":!0,"aria-expanded":!1,"aria-label":"Display the popup by hovering this element",children:[i,e.jsxRuntimeExports.jsx(o,{"aria-hidden":!0,children:typeof t=="string"?e.jsxRuntimeExports.jsx(n,{children:t}):t})]});exports.Popover=s;

package/dist/components/Popover/index.d.ts

@@ -0,0 +1,8 @@
+import { FC, ReactNode } from 'react';
+
+type PopoverProps = {
+    content: ReactNode | string;
+    children: ReactNode;
+};
+export declare const Popover: FC<PopoverProps>;
+export {};

package/dist/components/Popover/index.es.js

@@ -0,0 +1,48 @@
+"use client";
+import { j as e } from "../../jsx-runtime-Tw_Kw2GZ.js";
+import { p as a } from "../../styled-components.browser.esm-D6kkzXl4.js";
+const i = a.div({
+  position: "relative"
+}), o = a.div({
+  position: "absolute",
+  bottom: "0px",
+  right: "1.25rem",
+  "--tw-translate-y": "1.75rem",
+  transform: "translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))",
+  borderRadius: "0.375rem",
+  backgroundColor: "currentColor",
+  padding: "0.25rem",
+  fontSize: "0.75rem",
+  lineHeight: "1rem",
+  "--tw-text-opacity": "0.75",
+  opacity: "0",
+  transitionProperty: "all",
+  transitionTimingFunction: "cubic-bezier(0.4, 0, 0.2, 1)",
+  transitionDuration: "200ms",
+  transitionDelay: "700ms",
+  animationDelay: "700ms",
+  animationDuration: "200ms",
+  animationTimingFunction: "cubic-bezier(0.4, 0, 0.2, 1)",
+  "&:hover": {
+    transitionDelay: "0s",
+    animationDelay: "0s"
+  },
+  ".group:hover &": {
+    opacity: "1"
+  }
+}), n = a.span({
+  maxWidth: "60%",
+  userSelect: "none",
+  "--tw-text-opacity": "1",
+  color: "rgba(255, 255, 255, var(--tw-text-opacity))",
+  mixBlendMode: "difference"
+}), p = ({
+  children: r,
+  content: t
+}) => /* @__PURE__ */ e.jsxs(i, { className: "group", "aria-haspopup": !0, "aria-expanded": !1, "aria-label": "Display the popup by hovering this element", children: [
+  r,
+  /* @__PURE__ */ e.jsx(o, { "aria-hidden": !0, children: typeof t == "string" ? /* @__PURE__ */ e.jsx(n, { children: t }) : t })
+] });
+export {
+  p as Popover
+};

package/dist/components/PressableDiv/PressableDiv.cjs.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b=require("../../jsx-runtime-D6agescH.cjs"),e=require("react"),v=require("../../styled-components.browser.esm-GqWwDlfY.cjs"),y=400,g=v.pt.div(({$isSelecting:s})=>[{display:"inline",cursor:"pointer",borderRadius:"0.375rem",outlineStyle:"solid",outlineWidth:"2px",outlineOffset:"4px",outlineColor:"transparent",transitionProperty:"all",transitionTimingFunction:"cubic-bezier(0.4, 0, 0.2, 1)",transitionDuration:"200ms",transitionDelay:"100ms",animationDelay:"100ms",animationDuration:"200ms"},s?{outlineColor:"inherit"}:{"&:hover":{outlineColor:"inherit"}}]),E=({children:s,onPress:f,onClickOutside:t,pressDuration:p=y,isSelecting:a,...S})=>{const i=e.useRef(null),[c,u]=e.useState(a),n=e.useRef(null),T=()=>{u(!0),f()},h=()=>{n.current=setTimeout(()=>{T()},p)},d=()=>{n.current&&(clearTimeout(n.current),n.current=null)},m=()=>{d(),h()},o=()=>{d()},l=e.useCallback(r=>{i.current&&!i.current.contains(r.target)&&(u(!1),t==null||t())},[t]);e.useEffect(()=>(document.addEventListener("mousedown",l),()=>{document.removeEventListener("mousedown",l)}),[l]);const C=r=>{c&&(r.preventDefault(),r.stopPropagation())},D=()=>{u(!1)};return b.jsxRuntimeExports.jsx(g,{role:"button",tabIndex:0,onKeyUp:()=>null,onClick:C,onMouseDown:m,onMouseUp:o,onMouseLeave:o,onTouchStart:m,onTouchEnd:o,onTouchCancel:o,onBlur:D,ref:i,$isSelecting:a??c,...S,children:s})};exports.PressableDiv=E;

package/dist/components/PressableDiv/PressableDiv.d.ts

@@ -0,0 +1,10 @@
+import { FC, HTMLAttributes } from 'react';
+
+type PressableDivProps = {
+    onPress: () => void;
+    onClickOutside?: () => void;
+    pressDuration?: number;
+    isSelecting?: boolean;
+} & HTMLAttributes<HTMLDivElement>;
+export declare const PressableDiv: FC<PressableDivProps>;
+export {};

package/dist/components/PressableDiv/PressableDiv.es.js

@@ -0,0 +1,62 @@
+"use client";
+import { j as v } from "../../jsx-runtime-Tw_Kw2GZ.js";
+import { useRef as d, useState as E, useCallback as b, useEffect as g } from "react";
+import { p as x } from "../../styled-components.browser.esm-D6kkzXl4.js";
+const y = 400, O = x.div(({
+  $isSelecting: r
+}) => [{
+  display: "inline",
+  cursor: "pointer",
+  borderRadius: "0.375rem",
+  outlineStyle: "solid",
+  outlineWidth: "2px",
+  outlineOffset: "4px",
+  outlineColor: "transparent",
+  transitionProperty: "all",
+  transitionTimingFunction: "cubic-bezier(0.4, 0, 0.2, 1)",
+  transitionDuration: "200ms",
+  transitionDelay: "100ms",
+  animationDelay: "100ms",
+  animationDuration: "200ms"
+}, r ? {
+  outlineColor: "inherit"
+} : {
+  "&:hover": {
+    outlineColor: "inherit"
+  }
+}]), L = ({
+  children: r,
+  onPress: p,
+  onClickOutside: e,
+  pressDuration: f = y,
+  isSelecting: l,
+  ...h
+}) => {
+  const i = d(null), [a, s] = E(l), t = d(null), T = () => {
+    s(!0), p();
+  }, S = () => {
+    t.current = setTimeout(() => {
+      T();
+    }, f);
+  }, c = () => {
+    t.current && (clearTimeout(t.current), t.current = null);
+  }, m = () => {
+    c(), S();
+  }, n = () => {
+    c();
+  }, u = b((o) => {
+    i.current && !i.current.contains(o.target) && (s(!1), e == null || e());
+  }, [e]);
+  g(() => (document.addEventListener("mousedown", u), () => {
+    document.removeEventListener("mousedown", u);
+  }), [u]);
+  const C = (o) => {
+    a && (o.preventDefault(), o.stopPropagation());
+  }, D = () => {
+    s(!1);
+  };
+  return /* @__PURE__ */ v.jsx(O, { role: "button", tabIndex: 0, onKeyUp: () => null, onClick: C, onMouseDown: m, onMouseUp: n, onMouseLeave: n, onTouchStart: m, onTouchEnd: n, onTouchCancel: n, onBlur: D, ref: i, $isSelecting: l ?? a, ...h, children: r });
+};
+export {
+  L as PressableDiv
+};

package/dist/components/PressableDiv/index.cjs.js

@@ -0,0 +1 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./PressableDiv.cjs.js");exports.PressableDiv=e.PressableDiv;

package/dist/components/PressableDiv/index.d.ts

@@ -0,0 +1 @@
+export * from './PressableDiv';

package/dist/components/PressableDiv/index.es.js

@@ -0,0 +1,5 @@
+"use client";
+import { PressableDiv as s } from "./PressableDiv.es.js";
+export {
+  s as PressableDiv
+};

package/dist/components/ProfileDropDown/index.cjs.js

@@ -0,0 +1,6 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../jsx-runtime-D6agescH.cjs"),i=require("../../styled-components.browser.esm-GqWwDlfY.cjs"),s=require("../Avatar/index.cjs.js"),t=require("../DropDown/index.cjs.js"),c=require("../../createLucideIcon-ZOnO-fn6.cjs");/**
+ * @license lucide-react v0.376.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */const p=c.createLucideIcon("Container",[["path",{d:"M22 7.7c0-.6-.4-1.2-.8-1.5l-6.3-3.9a1.72 1.72 0 0 0-1.7 0l-10.3 6c-.5.2-.9.8-.9 1.4v6.6c0 .5.4 1.2.8 1.5l6.3 3.9a1.72 1.72 0 0 0 1.7 0l10.3-6c.5-.3.9-1 .9-1.5Z",key:"1t2lqe"}],["path",{d:"M10 21.9V14L2.1 9.1",key:"o7czzq"}],["path",{d:"m10 14 11.9-6.9",key:"zm5e20"}],["path",{d:"M14 19.8v-8.1",key:"159ecu"}],["path",{d:"M18 17.5V9.4",key:"11uown"}]]),n="profile",d=i.pt(p)(()=>({minWidth:"100px",padding:"1.5rem"})),a=({children:o,...r})=>e.jsxRuntimeExports.jsxs(t.DropDown.Trigger,{identifier:n,children:[e.jsxRuntimeExports.jsx(s.Avatar,{...r}),e.jsxRuntimeExports.jsx(t.DropDown,{identifier:n,children:e.jsxRuntimeExports.jsx(d,{children:o})})]});exports.ProfileDropDown=a;

package/dist/components/ProfileDropDown/index.d.ts

@@ -0,0 +1,6 @@
+import { FC, PropsWithChildren } from 'react';
+import { AvatarProps } from '../Avatar';
+
+type ProfileDropDownProps = PropsWithChildren<AvatarProps>;
+export declare const ProfileDropDown: FC<ProfileDropDownProps>;
+export {};

package/dist/components/ProfileDropDown/index.es.js

@@ -0,0 +1,37 @@
+"use client";
+import { j as e } from "../../jsx-runtime-Tw_Kw2GZ.js";
+import { p as n } from "../../styled-components.browser.esm-D6kkzXl4.js";
+import { Avatar as p } from "../Avatar/index.es.js";
+import { DropDown as t } from "../DropDown/index.es.js";
+import { c as a } from "../../createLucideIcon-DlZEiEGq.js";
+/**
+ * @license lucide-react v0.376.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const c = a("Container", [
+  [
+    "path",
+    {
+      d: "M22 7.7c0-.6-.4-1.2-.8-1.5l-6.3-3.9a1.72 1.72 0 0 0-1.7 0l-10.3 6c-.5.2-.9.8-.9 1.4v6.6c0 .5.4 1.2.8 1.5l6.3 3.9a1.72 1.72 0 0 0 1.7 0l10.3-6c.5-.3.9-1 .9-1.5Z",
+      key: "1t2lqe"
+    }
+  ],
+  ["path", { d: "M10 21.9V14L2.1 9.1", key: "o7czzq" }],
+  ["path", { d: "m10 14 11.9-6.9", key: "zm5e20" }],
+  ["path", { d: "M14 19.8v-8.1", key: "159ecu" }],
+  ["path", { d: "M18 17.5V9.4", key: "11uown" }]
+]), o = "profile", m = n(c)(() => ({
+  minWidth: "100px",
+  padding: "1.5rem"
+})), x = ({
+  children: r,
+  ...i
+}) => /* @__PURE__ */ e.jsxs(t.Trigger, { identifier: o, children: [
+  /* @__PURE__ */ e.jsx(p, { ...i }),
+  /* @__PURE__ */ e.jsx(t, { identifier: o, children: /* @__PURE__ */ e.jsx(m, { children: r }) })
+] });
+export {
+  x as ProfileDropDown
+};

package/dist/components/RedirectionButton/RedirectionButton.cjs.js

@@ -0,0 +1,6 @@
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../jsx-runtime-D6agescH.cjs"),r=require("../../styled-components.browser.esm-GqWwDlfY.cjs"),s=require("../../createLucideIcon-ZOnO-fn6.cjs");/**
+ * @license lucide-react v0.376.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */const i=s.createLucideIcon("ChevronRight",[["path",{d:"m9 18 6-6-6-6",key:"mthhwq"}]]),c=r.pt.button({display:"flex",width:"100%",alignItems:"center",justifyContent:"space-between",gap:"0.5rem",borderRadius:"0.25rem",padding:"0.5rem","&:hover":{backgroundColor:"rgb(241 245 249 / 0.3)"},"&:focus":{outline:"2px solid transparent",outlineOffset:"2px"},"&:disabled":{cursor:"not-allowed",opacity:"0.5"}}),u=({children:t,label:o,...n})=>e.jsxRuntimeExports.jsxs(c,{"aria-label":o,...n,children:[t,e.jsxRuntimeExports.jsx(i,{})]});exports.RedirectionButton=u;

package/dist/components/RedirectionButton/RedirectionButton.d.ts

@@ -0,0 +1,8 @@
+import { ButtonHTMLAttributes, FC, ReactNode } from 'react';
+
+type RedirectionButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {
+    children: ReactNode;
+    label: string;
+};
+export declare const RedirectionButton: FC<RedirectionButtonProps>;
+export {};