@intlayer/design-system 5.7.2-canary.3 → 5.7.3

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

@@ -1 +1 @@
-{"version":3,"file":"MobileNavbar.cjs","sources":["../../../src/components/Navbar/MobileNavbar.tsx"],"sourcesContent":["'use client';\n\nimport { m, type Variants } from 'framer-motion';\nimport { useRef, useState, type ReactElement, type ReactNode } from 'react';\nimport { useScrollBlockage, useScrollDetection } from '../../hooks';\nimport { cn } from '../../utils/cn';\nimport { MaxHeightSmoother } from '../MaxHeightSmoother';\nimport type { TabProps } from '../TabSelector';\nimport { Burger } from './Burger';\n\ntype MobileNavbarProps<T extends TabProps> = {\n  logo: ReactNode;\n  topChildren?: ReactNode;\n  topSections?: ReactElement<T>[];\n  bottomChildren?: ReactNode;\n  bottomSections?: ReactElement<T>[];\n  rightItems?: ReactNode;\n};\n\nconst navVariants: Variants = {\n  open: {\n    transition: { staggerChildren: 0.07, delayChildren: 0.2 },\n  },\n  closed: {\n    transition: { staggerChildren: 0.05, staggerDirection: -1 },\n  },\n};\n\nconst bgStyle =\n  'bg-card/95 shadow-[0_0_10px_-15px_rgba(0,0,0,0.3)] backdrop-blur';\n\nexport const MobileNavbar = <T extends TabProps>({\n  logo,\n  topChildren,\n  topSections = [],\n  bottomChildren,\n  bottomSections = [],\n  rightItems,\n}: MobileNavbarProps<T>) => {\n  const [isHidden, setIsHidden] = useState<boolean>(false);\n  const [isUnrolled, setIsUnrolled] = useState<boolean>(false);\n\n  const navRef = useRef<HTMLDivElement>(null);\n\n  useScrollBlockage({\n    disableScroll: isUnrolled,\n    key: 'mobile_nav',\n  });\n\n  useScrollDetection({\n    onScrollUp: () => setIsHidden(false),\n    onScrollDown: () => setIsHidden(true),\n    isEnabled: !isUnrolled,\n  });\n\n  const backDivHeight = !isHidden ? (navRef.current?.clientHeight ?? 0) : 0;\n\n  const isBurgerShowed = topSections.length + bottomSections.length > 0;\n\n  return (\n    <nav\n      className={cn(\n        bgStyle,\n        'sticky top-0 z-50 flex w-screen flex-col transition',\n        isHidden ? '-translate-y-full' : 'translate-y-0'\n      )}\n      id=\"mobile-menu\"\n    >\n      <div\n        className=\"flex w-full items-center justify-between gap-1 px-4 py-3 md:gap-[10vw]\"\n        ref={navRef}\n      >\n        {logo}\n\n        <div className=\"flex w-full flex-1 items-center justify-end gap-6\">\n          <div className=\"flex w-full items-center justify-end gap-1\">\n            {rightItems}\n          </div>\n\n          {isBurgerShowed && (\n            <Burger\n              isActive={isUnrolled}\n              onClick={() => setIsUnrolled((isUnrolled) => !isUnrolled)}\n            />\n          )}\n        </div>\n      </div>\n\n      <div\n        className={cn(\n          bgStyle,\n          'absolute bottom-0 left-0 w-full translate-y-full'\n        )}\n      >\n        <MaxHeightSmoother isHidden={!isUnrolled}>\n          <m.div\n            className=\"text-text flex w-full flex-col pb-[20%] pt-10 text-lg tracking-wide\"\n            onClick={() => setIsUnrolled(false)}\n            animate={isUnrolled ? 'open' : 'closed'}\n            variants={navVariants}\n            style={{\n              height: `calc(100vh - ${backDivHeight}px)`,\n            }}\n          >\n            {topChildren}\n            <div className=\"flex h-full flex-col justify-center\">\n              {topSections}\n              {bottomSections}\n            </div>\n\n            <div className=\"m-auto flex w-full max-w-[400px] items-center justify-center gap-1 px-5 py-3\">\n              {bottomChildren}\n            </div>\n          </m.div>\n        </MaxHeightSmoother>\n      </div>\n    </nav>\n  );\n};\n"],"names":["useState","useRef","useScrollBlockage","useScrollDetection","jsxs","cn","jsx","Burger","isUnrolled","MaxHeightSmoother","m"],"mappings":";;;;;;;;;;;;;;;;;AAmBA,MAAM,cAAwB;AAAA,EAC5B,MAAM;AAAA,IACJ,YAAY,EAAE,iBAAiB,MAAM,eAAe,IAAI;AAAA,EAC1D;AAAA,EACA,QAAQ;AAAA,IACN,YAAY,EAAE,iBAAiB,MAAM,kBAAkB,GAAG;AAAA,EAAA;AAE9D;AAEA,MAAM,UACJ;AAEK,MAAM,eAAe,CAAqB;AAAA,EAC/C;AAAA,EACA;AAAA,EACA,cAAc,CAAC;AAAA,EACf;AAAA,EACA,iBAAiB,CAAC;AAAA,EAClB;AACF,MAA4B;AAC1B,QAAM,CAAC,UAAU,WAAW,IAAIA,aAAAA,SAAkB,KAAK;AACvD,QAAM,CAAC,YAAY,aAAa,IAAIA,aAAAA,SAAkB,KAAK;AAErD,QAAA,SAASC,oBAAuB,IAAI;AAExBC,kDAAA;AAAA,IAChB,eAAe;AAAA,IACf,KAAK;AAAA,EAAA,CACN;AAEkBC,8CAAA;AAAA,IACjB,YAAY,MAAM,YAAY,KAAK;AAAA,IACnC,cAAc,MAAM,YAAY,IAAI;AAAA,IACpC,WAAW,CAAC;AAAA,EAAA,CACb;AAED,QAAM,gBAAgB,CAAC,WAAY,OAAO,SAAS,gBAAgB,IAAK;AAExE,QAAM,iBAAiB,YAAY,SAAS,eAAe,SAAS;AAGlE,SAAAC,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,SAAA;AAAA,QACT;AAAA,QACA;AAAA,QACA,WAAW,sBAAsB;AAAA,MACnC;AAAA,MACA,IAAG;AAAA,MAEH,UAAA;AAAA,QAAAD,2BAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,KAAK;AAAA,YAEJ,UAAA;AAAA,cAAA;AAAA,cAEDA,2BAAAA,KAAC,OAAI,EAAA,WAAU,qDACb,UAAA;AAAA,gBAACE,2BAAA,IAAA,OAAA,EAAI,WAAU,8CACZ,UACH,YAAA;AAAA,gBAEC,kBACCA,2BAAA;AAAA,kBAACC,yBAAA;AAAA,kBAAA;AAAA,oBACC,UAAU;AAAA,oBACV,SAAS,MAAM,cAAc,CAACC,gBAAe,CAACA,WAAU;AAAA,kBAAA;AAAA,gBAAA;AAAA,cAC1D,EAEJ,CAAA;AAAA,YAAA;AAAA,UAAA;AAAA,QACF;AAAA,QAEAF,2BAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWD,SAAA;AAAA,cACT;AAAA,cACA;AAAA,YACF;AAAA,YAEA,UAACC,2BAAA,IAAAG,sDAAA,EAAkB,UAAU,CAAC,YAC5B,UAAAL,2BAAA;AAAA,cAACM,aAAAA,EAAE;AAAA,cAAF;AAAA,gBACC,WAAU;AAAA,gBACV,SAAS,MAAM,cAAc,KAAK;AAAA,gBAClC,SAAS,aAAa,SAAS;AAAA,gBAC/B,UAAU;AAAA,gBACV,OAAO;AAAA,kBACL,QAAQ,gBAAgB,aAAa;AAAA,gBACvC;AAAA,gBAEC,UAAA;AAAA,kBAAA;AAAA,kBACDN,2BAAAA,KAAC,OAAI,EAAA,WAAU,uCACZ,UAAA;AAAA,oBAAA;AAAA,oBACA;AAAA,kBAAA,GACH;AAAA,kBAECE,2BAAA,IAAA,OAAA,EAAI,WAAU,gFACZ,UACH,eAAA,CAAA;AAAA,gBAAA;AAAA,cAAA;AAAA,YAAA,EAEJ,CAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EACF;AAEJ;;"}
+{"version":3,"file":"MobileNavbar.cjs","sources":["../../../src/components/Navbar/MobileNavbar.tsx"],"sourcesContent":["'use client';\n\nimport { m, type Variants } from 'framer-motion';\nimport { useRef, useState, type ReactElement, type ReactNode } from 'react';\nimport { useScrollBlockage, useScrollDetection } from '../../hooks';\nimport { cn } from '../../utils/cn';\nimport { MaxHeightSmoother } from '../MaxHeightSmoother';\nimport type { TabProps } from '../TabSelector';\nimport { Burger } from './Burger';\n\ntype MobileNavbarProps<T extends TabProps> = {\n  logo: ReactNode;\n  topChildren?: ReactNode;\n  topSections?: ReactElement<T>[];\n  bottomChildren?: ReactNode;\n  bottomSections?: ReactElement<T>[];\n  rightItems?: ReactNode;\n};\n\nconst navVariants: Variants = {\n  open: {\n    transition: { staggerChildren: 0.07, delayChildren: 0.2 },\n  },\n  closed: {\n    transition: { staggerChildren: 0.05, staggerDirection: -1 },\n  },\n};\n\nconst bgStyle =\n  'bg-card/95 shadow-[0_0_10px_-15px_rgba(0,0,0,0.3)] backdrop-blur';\n\nexport const MobileNavbar = <T extends TabProps>({\n  logo,\n  topChildren,\n  topSections = [],\n  bottomChildren,\n  bottomSections = [],\n  rightItems,\n}: MobileNavbarProps<T>) => {\n  const [isHidden, setIsHidden] = useState<boolean>(false);\n  const [isUnrolled, setIsUnrolled] = useState<boolean>(false);\n\n  const navRef = useRef<HTMLDivElement>(null);\n\n  useScrollBlockage({\n    disableScroll: isUnrolled,\n    key: 'mobile_nav',\n  });\n\n  useScrollDetection({\n    onScrollUp: () => setIsHidden(false),\n    onScrollDown: () => setIsHidden(true),\n    isEnabled: !isUnrolled,\n  });\n\n  const backDivHeight = !isHidden ? (navRef.current?.clientHeight ?? 0) : 0;\n\n  const isBurgerShowed = topSections.length + bottomSections.length > 0;\n\n  return (\n    <nav\n      className={cn(\n        bgStyle,\n        'sticky top-0 z-50 flex w-screen flex-col transition',\n        isHidden ? '-translate-y-full' : 'translate-y-0'\n      )}\n      id=\"mobile-menu\"\n    >\n      <div\n        className=\"flex w-full items-center justify-between gap-1 px-4 py-3 md:gap-[10vw]\"\n        ref={navRef}\n      >\n        {logo}\n\n        <div className=\"flex w-full flex-1 items-center justify-end gap-6\">\n          <div className=\"flex w-full items-center justify-end gap-1\">\n            {rightItems}\n          </div>\n\n          {isBurgerShowed && (\n            <Burger\n              isActive={isUnrolled}\n              onClick={() => setIsUnrolled((isUnrolled) => !isUnrolled)}\n            />\n          )}\n        </div>\n      </div>\n\n      <div\n        className={cn(\n          bgStyle,\n          'absolute bottom-0 left-0 w-full translate-y-full'\n        )}\n      >\n        <MaxHeightSmoother isHidden={!isUnrolled}>\n          <m.div\n            className=\"text-text flex w-full flex-col pb-[20%] pt-10 text-lg tracking-wide\"\n            onClick={() => setIsUnrolled(false)}\n            animate={isUnrolled ? 'open' : 'closed'}\n            variants={navVariants}\n            style={{\n              height: `calc(100vh - ${backDivHeight}px)`,\n            }}\n          >\n            {topChildren}\n            <div className=\"flex h-full flex-col justify-center\">\n              {topSections}\n              {bottomSections}\n            </div>\n\n            <div className=\"m-auto flex w-full max-w-[400px] items-center justify-center gap-1 px-5 py-3\">\n              {bottomChildren}\n            </div>\n          </m.div>\n        </MaxHeightSmoother>\n      </div>\n    </nav>\n  );\n};\n"],"names":["useState","useRef","useScrollBlockage","useScrollDetection","jsxs","cn","jsx","Burger","isUnrolled","MaxHeightSmoother","m"],"mappings":";;;;;;;;;;;;;;;;;;AAmBA,MAAM,cAAwB;AAAA,EAC5B,MAAM;AAAA,IACJ,YAAY,EAAE,iBAAiB,MAAM,eAAe,IAAI;AAAA,EAC1D;AAAA,EACA,QAAQ;AAAA,IACN,YAAY,EAAE,iBAAiB,MAAM,kBAAkB,GAAG;AAAA,EAAA;AAE9D;AAEA,MAAM,UACJ;AAEK,MAAM,eAAe,CAAqB;AAAA,EAC/C;AAAA,EACA;AAAA,EACA,cAAc,CAAC;AAAA,EACf;AAAA,EACA,iBAAiB,CAAC;AAAA,EAClB;AACF,MAA4B;AAC1B,QAAM,CAAC,UAAU,WAAW,IAAIA,aAAAA,SAAkB,KAAK;AACvD,QAAM,CAAC,YAAY,aAAa,IAAIA,aAAAA,SAAkB,KAAK;AAErD,QAAA,SAASC,oBAAuB,IAAI;AAExBC,kDAAA;AAAA,IAChB,eAAe;AAAA,IACf,KAAK;AAAA,EAAA,CACN;AAEkBC,8CAAA;AAAA,IACjB,YAAY,MAAM,YAAY,KAAK;AAAA,IACnC,cAAc,MAAM,YAAY,IAAI;AAAA,IACpC,WAAW,CAAC;AAAA,EAAA,CACb;AAED,QAAM,gBAAgB,CAAC,WAAY,OAAO,SAAS,gBAAgB,IAAK;AAExE,QAAM,iBAAiB,YAAY,SAAS,eAAe,SAAS;AAGlE,SAAAC,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,SAAA;AAAA,QACT;AAAA,QACA;AAAA,QACA,WAAW,sBAAsB;AAAA,MACnC;AAAA,MACA,IAAG;AAAA,MAEH,UAAA;AAAA,QAAAD,2BAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,KAAK;AAAA,YAEJ,UAAA;AAAA,cAAA;AAAA,cAEDA,2BAAAA,KAAC,OAAI,EAAA,WAAU,qDACb,UAAA;AAAA,gBAACE,2BAAA,IAAA,OAAA,EAAI,WAAU,8CACZ,UACH,YAAA;AAAA,gBAEC,kBACCA,2BAAA;AAAA,kBAACC,yBAAA;AAAA,kBAAA;AAAA,oBACC,UAAU;AAAA,oBACV,SAAS,MAAM,cAAc,CAACC,gBAAe,CAACA,WAAU;AAAA,kBAAA;AAAA,gBAAA;AAAA,cAC1D,EAEJ,CAAA;AAAA,YAAA;AAAA,UAAA;AAAA,QACF;AAAA,QAEAF,2BAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWD,SAAA;AAAA,cACT;AAAA,cACA;AAAA,YACF;AAAA,YAEA,UAACC,2BAAA,IAAAG,sDAAA,EAAkB,UAAU,CAAC,YAC5B,UAAAL,2BAAA;AAAA,cAACM,aAAAA,EAAE;AAAA,cAAF;AAAA,gBACC,WAAU;AAAA,gBACV,SAAS,MAAM,cAAc,KAAK;AAAA,gBAClC,SAAS,aAAa,SAAS;AAAA,gBAC/B,UAAU;AAAA,gBACV,OAAO;AAAA,kBACL,QAAQ,gBAAgB,aAAa;AAAA,gBACvC;AAAA,gBAEC,UAAA;AAAA,kBAAA;AAAA,kBACDN,2BAAAA,KAAC,OAAI,EAAA,WAAU,uCACZ,UAAA;AAAA,oBAAA;AAAA,oBACA;AAAA,kBAAA,GACH;AAAA,kBAECE,2BAAA,IAAA,OAAA,EAAI,WAAU,gFACZ,UACH,eAAA,CAAA;AAAA,gBAAA;AAAA,cAAA;AAAA,YAAA,EAEJ,CAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EACF;AAEJ;;"}

package/dist/components/Navbar/MobileNavbar.mjs

@@ -2,11 +2,12 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { m } from "framer-motion";
 import { useState, useRef } from "react";
+import "@intlayer/config/built";
+import "../../better-auth.8zoxzg-F-D8e0X4ys.js";
 import "@intlayer/editor-react";
 import "../Toaster/Toast.mjs";
 import "../../hooks/useAsync/useAsyncStateStore.mjs";
 import "@intlayer/api";
-import "@intlayer/config/built";
 import "deepmerge";
 import { u as useScrollBlockage } from "../../index-BCuMWKyy.js";
 import { useScrollDetection } from "../../hooks/useScrollDetection.mjs";

package/dist/components/Navbar/MobileNavbar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"MobileNavbar.mjs","sources":["../../../src/components/Navbar/MobileNavbar.tsx"],"sourcesContent":["'use client';\n\nimport { m, type Variants } from 'framer-motion';\nimport { useRef, useState, type ReactElement, type ReactNode } from 'react';\nimport { useScrollBlockage, useScrollDetection } from '../../hooks';\nimport { cn } from '../../utils/cn';\nimport { MaxHeightSmoother } from '../MaxHeightSmoother';\nimport type { TabProps } from '../TabSelector';\nimport { Burger } from './Burger';\n\ntype MobileNavbarProps<T extends TabProps> = {\n  logo: ReactNode;\n  topChildren?: ReactNode;\n  topSections?: ReactElement<T>[];\n  bottomChildren?: ReactNode;\n  bottomSections?: ReactElement<T>[];\n  rightItems?: ReactNode;\n};\n\nconst navVariants: Variants = {\n  open: {\n    transition: { staggerChildren: 0.07, delayChildren: 0.2 },\n  },\n  closed: {\n    transition: { staggerChildren: 0.05, staggerDirection: -1 },\n  },\n};\n\nconst bgStyle =\n  'bg-card/95 shadow-[0_0_10px_-15px_rgba(0,0,0,0.3)] backdrop-blur';\n\nexport const MobileNavbar = <T extends TabProps>({\n  logo,\n  topChildren,\n  topSections = [],\n  bottomChildren,\n  bottomSections = [],\n  rightItems,\n}: MobileNavbarProps<T>) => {\n  const [isHidden, setIsHidden] = useState<boolean>(false);\n  const [isUnrolled, setIsUnrolled] = useState<boolean>(false);\n\n  const navRef = useRef<HTMLDivElement>(null);\n\n  useScrollBlockage({\n    disableScroll: isUnrolled,\n    key: 'mobile_nav',\n  });\n\n  useScrollDetection({\n    onScrollUp: () => setIsHidden(false),\n    onScrollDown: () => setIsHidden(true),\n    isEnabled: !isUnrolled,\n  });\n\n  const backDivHeight = !isHidden ? (navRef.current?.clientHeight ?? 0) : 0;\n\n  const isBurgerShowed = topSections.length + bottomSections.length > 0;\n\n  return (\n    <nav\n      className={cn(\n        bgStyle,\n        'sticky top-0 z-50 flex w-screen flex-col transition',\n        isHidden ? '-translate-y-full' : 'translate-y-0'\n      )}\n      id=\"mobile-menu\"\n    >\n      <div\n        className=\"flex w-full items-center justify-between gap-1 px-4 py-3 md:gap-[10vw]\"\n        ref={navRef}\n      >\n        {logo}\n\n        <div className=\"flex w-full flex-1 items-center justify-end gap-6\">\n          <div className=\"flex w-full items-center justify-end gap-1\">\n            {rightItems}\n          </div>\n\n          {isBurgerShowed && (\n            <Burger\n              isActive={isUnrolled}\n              onClick={() => setIsUnrolled((isUnrolled) => !isUnrolled)}\n            />\n          )}\n        </div>\n      </div>\n\n      <div\n        className={cn(\n          bgStyle,\n          'absolute bottom-0 left-0 w-full translate-y-full'\n        )}\n      >\n        <MaxHeightSmoother isHidden={!isUnrolled}>\n          <m.div\n            className=\"text-text flex w-full flex-col pb-[20%] pt-10 text-lg tracking-wide\"\n            onClick={() => setIsUnrolled(false)}\n            animate={isUnrolled ? 'open' : 'closed'}\n            variants={navVariants}\n            style={{\n              height: `calc(100vh - ${backDivHeight}px)`,\n            }}\n          >\n            {topChildren}\n            <div className=\"flex h-full flex-col justify-center\">\n              {topSections}\n              {bottomSections}\n            </div>\n\n            <div className=\"m-auto flex w-full max-w-[400px] items-center justify-center gap-1 px-5 py-3\">\n              {bottomChildren}\n            </div>\n          </m.div>\n        </MaxHeightSmoother>\n      </div>\n    </nav>\n  );\n};\n"],"names":["isUnrolled"],"mappings":";;;;;;;;;;;;;;;AAmBA,MAAM,cAAwB;AAAA,EAC5B,MAAM;AAAA,IACJ,YAAY,EAAE,iBAAiB,MAAM,eAAe,IAAI;AAAA,EAC1D;AAAA,EACA,QAAQ;AAAA,IACN,YAAY,EAAE,iBAAiB,MAAM,kBAAkB,GAAG;AAAA,EAAA;AAE9D;AAEA,MAAM,UACJ;AAEK,MAAM,eAAe,CAAqB;AAAA,EAC/C;AAAA,EACA;AAAA,EACA,cAAc,CAAC;AAAA,EACf;AAAA,EACA,iBAAiB,CAAC;AAAA,EAClB;AACF,MAA4B;AAC1B,QAAM,CAAC,UAAU,WAAW,IAAI,SAAkB,KAAK;AACvD,QAAM,CAAC,YAAY,aAAa,IAAI,SAAkB,KAAK;AAErD,QAAA,SAAS,OAAuB,IAAI;AAExB,oBAAA;AAAA,IAChB,eAAe;AAAA,IACf,KAAK;AAAA,EAAA,CACN;AAEkB,qBAAA;AAAA,IACjB,YAAY,MAAM,YAAY,KAAK;AAAA,IACnC,cAAc,MAAM,YAAY,IAAI;AAAA,IACpC,WAAW,CAAC;AAAA,EAAA,CACb;AAED,QAAM,gBAAgB,CAAC,WAAY,OAAO,SAAS,gBAAgB,IAAK;AAExE,QAAM,iBAAiB,YAAY,SAAS,eAAe,SAAS;AAGlE,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA,WAAW,sBAAsB;AAAA,MACnC;AAAA,MACA,IAAG;AAAA,MAEH,UAAA;AAAA,QAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,KAAK;AAAA,YAEJ,UAAA;AAAA,cAAA;AAAA,cAED,qBAAC,OAAI,EAAA,WAAU,qDACb,UAAA;AAAA,gBAAC,oBAAA,OAAA,EAAI,WAAU,8CACZ,UACH,YAAA;AAAA,gBAEC,kBACC;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,UAAU;AAAA,oBACV,SAAS,MAAM,cAAc,CAACA,gBAAe,CAACA,WAAU;AAAA,kBAAA;AAAA,gBAAA;AAAA,cAC1D,EAEJ,CAAA;AAAA,YAAA;AAAA,UAAA;AAAA,QACF;AAAA,QAEA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW;AAAA,cACT;AAAA,cACA;AAAA,YACF;AAAA,YAEA,UAAC,oBAAA,mBAAA,EAAkB,UAAU,CAAC,YAC5B,UAAA;AAAA,cAAC,EAAE;AAAA,cAAF;AAAA,gBACC,WAAU;AAAA,gBACV,SAAS,MAAM,cAAc,KAAK;AAAA,gBAClC,SAAS,aAAa,SAAS;AAAA,gBAC/B,UAAU;AAAA,gBACV,OAAO;AAAA,kBACL,QAAQ,gBAAgB,aAAa;AAAA,gBACvC;AAAA,gBAEC,UAAA;AAAA,kBAAA;AAAA,kBACD,qBAAC,OAAI,EAAA,WAAU,uCACZ,UAAA;AAAA,oBAAA;AAAA,oBACA;AAAA,kBAAA,GACH;AAAA,kBAEC,oBAAA,OAAA,EAAI,WAAU,gFACZ,UACH,eAAA,CAAA;AAAA,gBAAA;AAAA,cAAA;AAAA,YAAA,EAEJ,CAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EACF;AAEJ;"}
+{"version":3,"file":"MobileNavbar.mjs","sources":["../../../src/components/Navbar/MobileNavbar.tsx"],"sourcesContent":["'use client';\n\nimport { m, type Variants } from 'framer-motion';\nimport { useRef, useState, type ReactElement, type ReactNode } from 'react';\nimport { useScrollBlockage, useScrollDetection } from '../../hooks';\nimport { cn } from '../../utils/cn';\nimport { MaxHeightSmoother } from '../MaxHeightSmoother';\nimport type { TabProps } from '../TabSelector';\nimport { Burger } from './Burger';\n\ntype MobileNavbarProps<T extends TabProps> = {\n  logo: ReactNode;\n  topChildren?: ReactNode;\n  topSections?: ReactElement<T>[];\n  bottomChildren?: ReactNode;\n  bottomSections?: ReactElement<T>[];\n  rightItems?: ReactNode;\n};\n\nconst navVariants: Variants = {\n  open: {\n    transition: { staggerChildren: 0.07, delayChildren: 0.2 },\n  },\n  closed: {\n    transition: { staggerChildren: 0.05, staggerDirection: -1 },\n  },\n};\n\nconst bgStyle =\n  'bg-card/95 shadow-[0_0_10px_-15px_rgba(0,0,0,0.3)] backdrop-blur';\n\nexport const MobileNavbar = <T extends TabProps>({\n  logo,\n  topChildren,\n  topSections = [],\n  bottomChildren,\n  bottomSections = [],\n  rightItems,\n}: MobileNavbarProps<T>) => {\n  const [isHidden, setIsHidden] = useState<boolean>(false);\n  const [isUnrolled, setIsUnrolled] = useState<boolean>(false);\n\n  const navRef = useRef<HTMLDivElement>(null);\n\n  useScrollBlockage({\n    disableScroll: isUnrolled,\n    key: 'mobile_nav',\n  });\n\n  useScrollDetection({\n    onScrollUp: () => setIsHidden(false),\n    onScrollDown: () => setIsHidden(true),\n    isEnabled: !isUnrolled,\n  });\n\n  const backDivHeight = !isHidden ? (navRef.current?.clientHeight ?? 0) : 0;\n\n  const isBurgerShowed = topSections.length + bottomSections.length > 0;\n\n  return (\n    <nav\n      className={cn(\n        bgStyle,\n        'sticky top-0 z-50 flex w-screen flex-col transition',\n        isHidden ? '-translate-y-full' : 'translate-y-0'\n      )}\n      id=\"mobile-menu\"\n    >\n      <div\n        className=\"flex w-full items-center justify-between gap-1 px-4 py-3 md:gap-[10vw]\"\n        ref={navRef}\n      >\n        {logo}\n\n        <div className=\"flex w-full flex-1 items-center justify-end gap-6\">\n          <div className=\"flex w-full items-center justify-end gap-1\">\n            {rightItems}\n          </div>\n\n          {isBurgerShowed && (\n            <Burger\n              isActive={isUnrolled}\n              onClick={() => setIsUnrolled((isUnrolled) => !isUnrolled)}\n            />\n          )}\n        </div>\n      </div>\n\n      <div\n        className={cn(\n          bgStyle,\n          'absolute bottom-0 left-0 w-full translate-y-full'\n        )}\n      >\n        <MaxHeightSmoother isHidden={!isUnrolled}>\n          <m.div\n            className=\"text-text flex w-full flex-col pb-[20%] pt-10 text-lg tracking-wide\"\n            onClick={() => setIsUnrolled(false)}\n            animate={isUnrolled ? 'open' : 'closed'}\n            variants={navVariants}\n            style={{\n              height: `calc(100vh - ${backDivHeight}px)`,\n            }}\n          >\n            {topChildren}\n            <div className=\"flex h-full flex-col justify-center\">\n              {topSections}\n              {bottomSections}\n            </div>\n\n            <div className=\"m-auto flex w-full max-w-[400px] items-center justify-center gap-1 px-5 py-3\">\n              {bottomChildren}\n            </div>\n          </m.div>\n        </MaxHeightSmoother>\n      </div>\n    </nav>\n  );\n};\n"],"names":["isUnrolled"],"mappings":";;;;;;;;;;;;;;;;AAmBA,MAAM,cAAwB;AAAA,EAC5B,MAAM;AAAA,IACJ,YAAY,EAAE,iBAAiB,MAAM,eAAe,IAAI;AAAA,EAC1D;AAAA,EACA,QAAQ;AAAA,IACN,YAAY,EAAE,iBAAiB,MAAM,kBAAkB,GAAG;AAAA,EAAA;AAE9D;AAEA,MAAM,UACJ;AAEK,MAAM,eAAe,CAAqB;AAAA,EAC/C;AAAA,EACA;AAAA,EACA,cAAc,CAAC;AAAA,EACf;AAAA,EACA,iBAAiB,CAAC;AAAA,EAClB;AACF,MAA4B;AAC1B,QAAM,CAAC,UAAU,WAAW,IAAI,SAAkB,KAAK;AACvD,QAAM,CAAC,YAAY,aAAa,IAAI,SAAkB,KAAK;AAErD,QAAA,SAAS,OAAuB,IAAI;AAExB,oBAAA;AAAA,IAChB,eAAe;AAAA,IACf,KAAK;AAAA,EAAA,CACN;AAEkB,qBAAA;AAAA,IACjB,YAAY,MAAM,YAAY,KAAK;AAAA,IACnC,cAAc,MAAM,YAAY,IAAI;AAAA,IACpC,WAAW,CAAC;AAAA,EAAA,CACb;AAED,QAAM,gBAAgB,CAAC,WAAY,OAAO,SAAS,gBAAgB,IAAK;AAExE,QAAM,iBAAiB,YAAY,SAAS,eAAe,SAAS;AAGlE,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA;AAAA,QACA,WAAW,sBAAsB;AAAA,MACnC;AAAA,MACA,IAAG;AAAA,MAEH,UAAA;AAAA,QAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,KAAK;AAAA,YAEJ,UAAA;AAAA,cAAA;AAAA,cAED,qBAAC,OAAI,EAAA,WAAU,qDACb,UAAA;AAAA,gBAAC,oBAAA,OAAA,EAAI,WAAU,8CACZ,UACH,YAAA;AAAA,gBAEC,kBACC;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,UAAU;AAAA,oBACV,SAAS,MAAM,cAAc,CAACA,gBAAe,CAACA,WAAU;AAAA,kBAAA;AAAA,gBAAA;AAAA,cAC1D,EAEJ,CAAA;AAAA,YAAA;AAAA,UAAA;AAAA,QACF;AAAA,QAEA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW;AAAA,cACT;AAAA,cACA;AAAA,YACF;AAAA,YAEA,UAAC,oBAAA,mBAAA,EAAkB,UAAU,CAAC,YAC5B,UAAA;AAAA,cAAC,EAAE;AAAA,cAAF;AAAA,gBACC,WAAU;AAAA,gBACV,SAAS,MAAM,cAAc,KAAK;AAAA,gBAClC,SAAS,aAAa,SAAS;AAAA,gBAC/B,UAAU;AAAA,gBACV,OAAO;AAAA,kBACL,QAAQ,gBAAgB,aAAa;AAAA,gBACvC;AAAA,gBAEC,UAAA;AAAA,kBAAA;AAAA,kBACD,qBAAC,OAAI,EAAA,WAAU,uCACZ,UAAA;AAAA,oBAAA;AAAA,oBACA;AAAA,kBAAA,GACH;AAAA,kBAEC,oBAAA,OAAA,EAAI,WAAU,gFACZ,UACH,eAAA,CAAA;AAAA,gBAAA;AAAA,cAAA;AAAA,YAAA,EAEJ,CAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EACF;AAEJ;"}

package/dist/components/Navbar/index.cjs

@@ -2,12 +2,13 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
+require("@intlayer/config/built");
+require("../../better-auth.8zoxzg-F-BEBqzpjz.cjs");
 require("@intlayer/editor-react");
 require("../Toaster/Toast.cjs");
 require("react");
 require("../../hooks/useAsync/useAsyncStateStore.cjs");
 require("@intlayer/api");
-require("@intlayer/config/built");
 const hooks_useDevice = require("../../hooks/useDevice.cjs");
 require("deepmerge");
 const hooks_useIsMounted = require("../../hooks/useIsMounted.cjs");

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

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../src/components/Navbar/index.tsx"],"sourcesContent":["'use client';\n\nimport type { ReactElement, ReactNode } from 'react';\nimport { useDevice, useIsMounted } from '../../hooks';\nimport type { TabProps } from '../TabSelector';\nimport { DesktopNavbar } from './DesktopNavbar';\nimport { MobileNavbar } from './MobileNavbar';\n\ntype NavbarProps<T extends TabProps> = {\n  logo: ReactNode;\n  selectedChoice: T['key'];\n  desktopSections?: ReactElement<T>[];\n  mobileTopChildren?: ReactNode;\n  mobileTopSections?: ReactElement<T>[];\n  mobileBottomChildren?: ReactNode;\n  mobileBottomSections?: ReactElement<T>[];\n  rightItemsDesktop?: ReactNode;\n  rightItemsMobile?: ReactNode;\n};\n\nexport const Navbar = <T extends TabProps>({\n  logo,\n  mobileTopChildren,\n  desktopSections = [],\n  mobileTopSections = [],\n  mobileBottomChildren,\n  mobileBottomSections = [],\n  rightItemsDesktop,\n  rightItemsMobile,\n  selectedChoice,\n}: NavbarProps<T>) => {\n  const { isMobile } = useDevice();\n  const isMoUnted = useIsMounted();\n\n  if (!isMoUnted) return <></>;\n\n  return isMobile ? (\n    <MobileNavbar\n      topChildren={mobileTopChildren}\n      topSections={mobileTopSections}\n      bottomChildren={mobileBottomChildren}\n      bottomSections={mobileBottomSections}\n      logo={logo}\n      rightItems={rightItemsMobile}\n    />\n  ) : (\n    <DesktopNavbar\n      sections={desktopSections}\n      rightItems={rightItemsDesktop}\n      logo={logo}\n      selectedChoice={selectedChoice}\n    />\n  );\n};\n"],"names":["useDevice","useIsMounted","jsx","Fragment","MobileNavbar","DesktopNavbar"],"mappings":";;;;;;;;;;;;;;;;AAoBO,MAAM,SAAS,CAAqB;AAAA,EACzC;AAAA,EACA;AAAA,EACA,kBAAkB,CAAC;AAAA,EACnB,oBAAoB,CAAC;AAAA,EACrB;AAAA,EACA,uBAAuB,CAAC;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AACF,MAAsB;AACd,QAAA,EAAE,SAAS,IAAIA,0BAAU;AAC/B,QAAM,YAAYC,mBAAAA,aAAa;AAE3B,MAAA,CAAC,UAAW,QAASC,+BAAAC,WAAAA,UAAA,CAAA,CAAA;AAEzB,SAAO,WACLD,2BAAA;AAAA,IAACE,+BAAA;AAAA,IAAA;AAAA,MACC,aAAa;AAAA,MACb,aAAa;AAAA,MACb,gBAAgB;AAAA,MAChB,gBAAgB;AAAA,MAChB;AAAA,MACA,YAAY;AAAA,IAAA;AAAA,EAAA,IAGdF,2BAAA;AAAA,IAACG,gCAAA;AAAA,IAAA;AAAA,MACC,UAAU;AAAA,MACV,YAAY;AAAA,MACZ;AAAA,MACA;AAAA,IAAA;AAAA,EACF;AAEJ;;"}
+{"version":3,"file":"index.cjs","sources":["../../../src/components/Navbar/index.tsx"],"sourcesContent":["'use client';\n\nimport type { ReactElement, ReactNode } from 'react';\nimport { useDevice, useIsMounted } from '../../hooks';\nimport type { TabProps } from '../TabSelector';\nimport { DesktopNavbar } from './DesktopNavbar';\nimport { MobileNavbar } from './MobileNavbar';\n\ntype NavbarProps<T extends TabProps> = {\n  logo: ReactNode;\n  selectedChoice: T['key'];\n  desktopSections?: ReactElement<T>[];\n  mobileTopChildren?: ReactNode;\n  mobileTopSections?: ReactElement<T>[];\n  mobileBottomChildren?: ReactNode;\n  mobileBottomSections?: ReactElement<T>[];\n  rightItemsDesktop?: ReactNode;\n  rightItemsMobile?: ReactNode;\n};\n\nexport const Navbar = <T extends TabProps>({\n  logo,\n  mobileTopChildren,\n  desktopSections = [],\n  mobileTopSections = [],\n  mobileBottomChildren,\n  mobileBottomSections = [],\n  rightItemsDesktop,\n  rightItemsMobile,\n  selectedChoice,\n}: NavbarProps<T>) => {\n  const { isMobile } = useDevice();\n  const isMoUnted = useIsMounted();\n\n  if (!isMoUnted) return <></>;\n\n  return isMobile ? (\n    <MobileNavbar\n      topChildren={mobileTopChildren}\n      topSections={mobileTopSections}\n      bottomChildren={mobileBottomChildren}\n      bottomSections={mobileBottomSections}\n      logo={logo}\n      rightItems={rightItemsMobile}\n    />\n  ) : (\n    <DesktopNavbar\n      sections={desktopSections}\n      rightItems={rightItemsDesktop}\n      logo={logo}\n      selectedChoice={selectedChoice}\n    />\n  );\n};\n"],"names":["useDevice","useIsMounted","jsx","Fragment","MobileNavbar","DesktopNavbar"],"mappings":";;;;;;;;;;;;;;;;;AAoBO,MAAM,SAAS,CAAqB;AAAA,EACzC;AAAA,EACA;AAAA,EACA,kBAAkB,CAAC;AAAA,EACnB,oBAAoB,CAAC;AAAA,EACrB;AAAA,EACA,uBAAuB,CAAC;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AACF,MAAsB;AACd,QAAA,EAAE,SAAS,IAAIA,0BAAU;AAC/B,QAAM,YAAYC,mBAAAA,aAAa;AAE3B,MAAA,CAAC,UAAW,QAASC,+BAAAC,WAAAA,UAAA,CAAA,CAAA;AAEzB,SAAO,WACLD,2BAAA;AAAA,IAACE,+BAAA;AAAA,IAAA;AAAA,MACC,aAAa;AAAA,MACb,aAAa;AAAA,MACb,gBAAgB;AAAA,MAChB,gBAAgB;AAAA,MAChB;AAAA,MACA,YAAY;AAAA,IAAA;AAAA,EAAA,IAGdF,2BAAA;AAAA,IAACG,gCAAA;AAAA,IAAA;AAAA,MACC,UAAU;AAAA,MACV,YAAY;AAAA,MACZ;AAAA,MACA;AAAA,IAAA;AAAA,EACF;AAEJ;;"}

package/dist/components/Navbar/index.mjs

@@ -1,11 +1,12 @@
 "use client";
 import { jsx, Fragment } from "react/jsx-runtime";
+import "@intlayer/config/built";
+import "../../better-auth.8zoxzg-F-D8e0X4ys.js";
 import "@intlayer/editor-react";
 import "../Toaster/Toast.mjs";
 import "react";
 import "../../hooks/useAsync/useAsyncStateStore.mjs";
 import "@intlayer/api";
-import "@intlayer/config/built";
 import { useDevice } from "../../hooks/useDevice.mjs";
 import "deepmerge";
 import { useIsMounted } from "../../hooks/useIsMounted.mjs";

package/dist/components/Navbar/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../../src/components/Navbar/index.tsx"],"sourcesContent":["'use client';\n\nimport type { ReactElement, ReactNode } from 'react';\nimport { useDevice, useIsMounted } from '../../hooks';\nimport type { TabProps } from '../TabSelector';\nimport { DesktopNavbar } from './DesktopNavbar';\nimport { MobileNavbar } from './MobileNavbar';\n\ntype NavbarProps<T extends TabProps> = {\n  logo: ReactNode;\n  selectedChoice: T['key'];\n  desktopSections?: ReactElement<T>[];\n  mobileTopChildren?: ReactNode;\n  mobileTopSections?: ReactElement<T>[];\n  mobileBottomChildren?: ReactNode;\n  mobileBottomSections?: ReactElement<T>[];\n  rightItemsDesktop?: ReactNode;\n  rightItemsMobile?: ReactNode;\n};\n\nexport const Navbar = <T extends TabProps>({\n  logo,\n  mobileTopChildren,\n  desktopSections = [],\n  mobileTopSections = [],\n  mobileBottomChildren,\n  mobileBottomSections = [],\n  rightItemsDesktop,\n  rightItemsMobile,\n  selectedChoice,\n}: NavbarProps<T>) => {\n  const { isMobile } = useDevice();\n  const isMoUnted = useIsMounted();\n\n  if (!isMoUnted) return <></>;\n\n  return isMobile ? (\n    <MobileNavbar\n      topChildren={mobileTopChildren}\n      topSections={mobileTopSections}\n      bottomChildren={mobileBottomChildren}\n      bottomSections={mobileBottomSections}\n      logo={logo}\n      rightItems={rightItemsMobile}\n    />\n  ) : (\n    <DesktopNavbar\n      sections={desktopSections}\n      rightItems={rightItemsDesktop}\n      logo={logo}\n      selectedChoice={selectedChoice}\n    />\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAoBO,MAAM,SAAS,CAAqB;AAAA,EACzC;AAAA,EACA;AAAA,EACA,kBAAkB,CAAC;AAAA,EACnB,oBAAoB,CAAC;AAAA,EACrB;AAAA,EACA,uBAAuB,CAAC;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AACF,MAAsB;AACd,QAAA,EAAE,SAAS,IAAI,UAAU;AAC/B,QAAM,YAAY,aAAa;AAE3B,MAAA,CAAC,UAAW,QAAS,oBAAA,UAAA,CAAA,CAAA;AAEzB,SAAO,WACL;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAa;AAAA,MACb,aAAa;AAAA,MACb,gBAAgB;AAAA,MAChB,gBAAgB;AAAA,MAChB;AAAA,MACA,YAAY;AAAA,IAAA;AAAA,EAAA,IAGd;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,UAAU;AAAA,MACV,YAAY;AAAA,MACZ;AAAA,MACA;AAAA,IAAA;AAAA,EACF;AAEJ;"}
+{"version":3,"file":"index.mjs","sources":["../../../src/components/Navbar/index.tsx"],"sourcesContent":["'use client';\n\nimport type { ReactElement, ReactNode } from 'react';\nimport { useDevice, useIsMounted } from '../../hooks';\nimport type { TabProps } from '../TabSelector';\nimport { DesktopNavbar } from './DesktopNavbar';\nimport { MobileNavbar } from './MobileNavbar';\n\ntype NavbarProps<T extends TabProps> = {\n  logo: ReactNode;\n  selectedChoice: T['key'];\n  desktopSections?: ReactElement<T>[];\n  mobileTopChildren?: ReactNode;\n  mobileTopSections?: ReactElement<T>[];\n  mobileBottomChildren?: ReactNode;\n  mobileBottomSections?: ReactElement<T>[];\n  rightItemsDesktop?: ReactNode;\n  rightItemsMobile?: ReactNode;\n};\n\nexport const Navbar = <T extends TabProps>({\n  logo,\n  mobileTopChildren,\n  desktopSections = [],\n  mobileTopSections = [],\n  mobileBottomChildren,\n  mobileBottomSections = [],\n  rightItemsDesktop,\n  rightItemsMobile,\n  selectedChoice,\n}: NavbarProps<T>) => {\n  const { isMobile } = useDevice();\n  const isMoUnted = useIsMounted();\n\n  if (!isMoUnted) return <></>;\n\n  return isMobile ? (\n    <MobileNavbar\n      topChildren={mobileTopChildren}\n      topSections={mobileTopSections}\n      bottomChildren={mobileBottomChildren}\n      bottomSections={mobileBottomSections}\n      logo={logo}\n      rightItems={rightItemsMobile}\n    />\n  ) : (\n    <DesktopNavbar\n      sections={desktopSections}\n      rightItems={rightItemsDesktop}\n      logo={logo}\n      selectedChoice={selectedChoice}\n    />\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;AAoBO,MAAM,SAAS,CAAqB;AAAA,EACzC;AAAA,EACA;AAAA,EACA,kBAAkB,CAAC;AAAA,EACnB,oBAAoB,CAAC;AAAA,EACrB;AAAA,EACA,uBAAuB,CAAC;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AACF,MAAsB;AACd,QAAA,EAAE,SAAS,IAAI,UAAU;AAC/B,QAAM,YAAY,aAAa;AAE3B,MAAA,CAAC,UAAW,QAAS,oBAAA,UAAA,CAAA,CAAA;AAEzB,SAAO,WACL;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAa;AAAA,MACb,aAAa;AAAA,MACb,gBAAgB;AAAA,MAChB,gBAAgB;AAAA,MAChB;AAAA,MACA,YAAY;AAAA,IAAA;AAAA,EAAA,IAGd;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,UAAU;AAAA,MACV,YAAY;AAAA,MACZ;AAAA,MACA;AAAA,IAAA;AAAA,EACF;AAEJ;"}

package/dist/components/SwitchSelector/index.cjs

@@ -4,11 +4,12 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const ReactExports = require("react");
 const classVarianceAuthority = require("class-variance-authority");
+require("@intlayer/config/built");
+require("../../better-auth.8zoxzg-F-BEBqzpjz.cjs");
 require("@intlayer/editor-react");
 require("../Toaster/Toast.cjs");
 require("../../hooks/useAsync/useAsyncStateStore.cjs");
 require("@intlayer/api");
-require("@intlayer/config/built");
 require("deepmerge");
 const hooks_useItemSelector = require("../../hooks/useItemSelector.cjs");
 require("../../hooks/useScrollBlockage/useScrollBlockageStore.cjs");

package/dist/components/SwitchSelector/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../src/components/SwitchSelector/index.tsx"],"sourcesContent":["'use client';\n\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport {\n  useEffect,\n  useRef,\n  useState,\n  type HTMLAttributes,\n  type ReactNode,\n} from 'react';\nimport { useItemSelector } from '../../hooks';\nimport { cn } from '../../utils/cn';\n\nexport type SwitchSelectorChoice<T = boolean> = {\n  content: ReactNode;\n  value: T;\n} & HTMLAttributes<HTMLButtonElement>;\nexport type SwitchSelectorChoices<T> = SwitchSelectorChoice<T>[];\n\nconst defaultChoices: SwitchSelectorChoices<boolean> = [\n  { content: 'Off', value: false },\n  { content: 'On', value: true },\n];\n\nexport type SwitchSelectorProps<T = boolean> = {\n  choices?: SwitchSelectorChoices<T>;\n  value?: T;\n  defaultValue?: T;\n  onChange?: (choice: T) => void;\n  className?: string;\n} & VariantProps<typeof switchSelectorVariant> &\n  VariantProps<typeof choiceVariant>;\n\nconst switchSelectorVariant = cva(\n  'flex flex-row gap-2 rounded-full w-fit border-[1.5px] p-[1.5px]',\n  {\n    variants: {\n      color: {\n        primary: 'border-primary text-primary',\n        secondary: 'border-secondary text-secondary',\n        destructive: 'border-destructive bg-destructive text-destructive',\n        neutral: 'border-neutral text-neutral ',\n        light: 'border-white text-white',\n        dark: 'border-neutral-800 text-neutral-800',\n        text: 'border-text text-text',\n      },\n    },\n    defaultVariants: {\n      color: 'primary',\n    },\n  }\n);\n\nconst choiceVariant = cva(\n  'z-1 w-full flex-1 text-sm font-medium transition-all duration-300 ease-in-out cursor-pointer aria-selected:cursor-default aria-selected:text-text-opposite motion-reduce:transition-none',\n  {\n    variants: {\n      size: {\n        sm: 'py-1 px-2 text-xs',\n        md: 'p-2 text-sm',\n        lg: 'p-4 text-base',\n      },\n    },\n    defaultVariants: {\n      size: 'md',\n    },\n  }\n);\n\nconst indicatorVariant = cva(\n  'absolute top-0 z-[-1] h-full w-auto rounded-full transition-[left,width] duration-300 ease-in-out motion-reduce:transition-none',\n  {\n    variants: {\n      color: {\n        primary: 'bg-primary aria-selected:text-text',\n        secondary: 'bg-secondary aria-selected:text-text',\n        destructive: 'bg-destructive aria-selected:text-text',\n        neutral: 'bg-neutral aria-selected:text-white ',\n        light: 'bg-white aria-selected:text-black',\n        dark: 'bg-neutral-800 aria-selected:text-white',\n        text: 'bg-text aria-selected:text-text-opposite',\n      },\n    },\n  }\n);\n\n/**\n *\n * Component that allows the user to select one of the provided choices.\n *\n * Example:\n * ```jsx\n * <SwitchSelector\n *   choices={[\n *     { content: 'Option 1', value: 'option1' },\n *     { content: 'Option 2', value: 'option2' },\n *     { content: 'Option 3', value: 'option3' },\n *   ]}\n *   value=\"option1\"\n *   onChange={(choice) => console.log(choice)}\n * />\n * ```\n */\nexport const SwitchSelector = <T,>({\n  choices = defaultChoices as SwitchSelectorChoices<T>,\n  value,\n  defaultValue,\n  onChange,\n  color = 'primary',\n  size = 'md',\n  className,\n}: SwitchSelectorProps<T>) => {\n  const [valueState, setValue] = useState<T>(\n    value ?? defaultValue ?? choices[0].value\n  );\n  const optionsRefs = useRef<HTMLButtonElement[]>([]);\n  const indicatorRef = useRef<HTMLDivElement | null>(null);\n  const { choiceIndicatorPosition } = useItemSelector(optionsRefs);\n\n  const handleChange = (newValue: T) => {\n    setValue(newValue);\n    onChange?.(newValue);\n  };\n\n  useEffect(() => {\n    if (value === undefined) return;\n    setValue(value);\n  }, [value]);\n\n  return (\n    <div\n      className={switchSelectorVariant({\n        color,\n        className,\n      })}\n      role=\"tablist\"\n    >\n      <div className=\"relative flex size-full flex-row items-center justify-center\">\n        {choices.map((choice, index) => {\n          const { content, value, ...buttonProps } = choice;\n\n          const isKeyOfKey =\n            typeof value === 'string' || typeof value === 'number';\n\n          const isSelected = value === valueState;\n\n          return (\n            <button\n              {...buttonProps}\n              className={cn(\n                choiceVariant({\n                  size,\n                })\n              )}\n              key={isKeyOfKey ? value : index}\n              role=\"tab\"\n              onClick={() => handleChange(value)}\n              aria-selected={isSelected}\n              disabled={isSelected}\n              ref={(el) => {\n                optionsRefs.current[index] = el!;\n              }}\n            >\n              {content}\n            </button>\n          );\n        })}\n        {choiceIndicatorPosition && (\n          <div\n            className={cn(\n              indicatorVariant({\n                color,\n              })\n            )}\n            style={choiceIndicatorPosition}\n            ref={indicatorRef}\n          />\n        )}\n      </div>\n    </div>\n  );\n};\n"],"names":["cva","useState","useRef","useItemSelector","useEffect","jsx","jsxs","value","createElement","cn"],"mappings":";;;;;;;;;;;;;;;AAmBA,MAAM,iBAAiD;AAAA,EACrD,EAAE,SAAS,OAAO,OAAO,MAAM;AAAA,EAC/B,EAAE,SAAS,MAAM,OAAO,KAAK;AAC/B;AAWA,MAAM,wBAAwBA,uBAAA;AAAA,EAC5B;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,OAAO;AAAA,QACL,SAAS;AAAA,QACT,WAAW;AAAA,QACX,aAAa;AAAA,QACb,SAAS;AAAA,QACT,OAAO;AAAA,QACP,MAAM;AAAA,QACN,MAAM;AAAA,MAAA;AAAA,IAEV;AAAA,IACA,iBAAiB;AAAA,MACf,OAAO;AAAA,IAAA;AAAA,EACT;AAEJ;AAEA,MAAM,gBAAgBA,uBAAA;AAAA,EACpB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,MAAM;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,QACJ,IAAI;AAAA,MAAA;AAAA,IAER;AAAA,IACA,iBAAiB;AAAA,MACf,MAAM;AAAA,IAAA;AAAA,EACR;AAEJ;AAEA,MAAM,mBAAmBA,uBAAA;AAAA,EACvB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,OAAO;AAAA,QACL,SAAS;AAAA,QACT,WAAW;AAAA,QACX,aAAa;AAAA,QACb,SAAS;AAAA,QACT,OAAO;AAAA,QACP,MAAM;AAAA,QACN,MAAM;AAAA,MAAA;AAAA,IACR;AAAA,EACF;AAEJ;AAmBO,MAAM,iBAAiB,CAAK;AAAA,EACjC,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR,OAAO;AAAA,EACP;AACF,MAA8B;AACtB,QAAA,CAAC,YAAY,QAAQ,IAAIC,aAAA;AAAA,IAC7B,SAAS,gBAAgB,QAAQ,CAAC,EAAE;AAAA,EACtC;AACM,QAAA,cAAcC,aAA4B,OAAA,EAAE;AAC5C,QAAA,eAAeA,oBAA8B,IAAI;AACvD,QAAM,EAAE,wBAAA,IAA4BC,sBAAA,gBAAgB,WAAW;AAEzD,QAAA,eAAe,CAAC,aAAgB;AACpC,aAAS,QAAQ;AACjB,eAAW,QAAQ;AAAA,EACrB;AAEAC,eAAAA,UAAU,MAAM;AACd,QAAI,UAAU,OAAW;AACzB,aAAS,KAAK;AAAA,EAAA,GACb,CAAC,KAAK,CAAC;AAGR,SAAAC,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,sBAAsB;AAAA,QAC/B;AAAA,QACA;AAAA,MAAA,CACD;AAAA,MACD,MAAK;AAAA,MAEL,UAAAC,2BAAA,KAAC,OAAI,EAAA,WAAU,gEACZ,UAAA;AAAA,QAAQ,QAAA,IAAI,CAAC,QAAQ,UAAU;AAC9B,gBAAM,EAAE,SAAS,OAAAC,QAAO,GAAG,YAAgB,IAAA;AAE3C,gBAAM,aACJ,OAAOA,WAAU,YAAY,OAAOA,WAAU;AAEhD,gBAAM,aAAaA,WAAU;AAG3B,iBAAAC,6BAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACE,GAAG;AAAA,cACJ,WAAWC,SAAA;AAAA,gBACT,cAAc;AAAA,kBACZ;AAAA,gBACD,CAAA;AAAA,cACH;AAAA,cACA,KAAK,aAAaF,SAAQ;AAAA,cAC1B,MAAK;AAAA,cACL,SAAS,MAAM,aAAaA,MAAK;AAAA,cACjC,iBAAe;AAAA,cACf,UAAU;AAAA,cACV,KAAK,CAAC,OAAO;AACC,4BAAA,QAAQ,KAAK,IAAI;AAAA,cAAA;AAAA,YAC/B;AAAA,YAEC;AAAA,UACH;AAAA,QAAA,CAEH;AAAA,QACA,2BACCF,2BAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWI,SAAA;AAAA,cACT,iBAAiB;AAAA,gBACf;AAAA,cACD,CAAA;AAAA,YACH;AAAA,YACA,OAAO;AAAA,YACP,KAAK;AAAA,UAAA;AAAA,QAAA;AAAA,MACP,EAEJ,CAAA;AAAA,IAAA;AAAA,EACF;AAEJ;;"}
+{"version":3,"file":"index.cjs","sources":["../../../src/components/SwitchSelector/index.tsx"],"sourcesContent":["'use client';\n\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport {\n  useEffect,\n  useRef,\n  useState,\n  type HTMLAttributes,\n  type ReactNode,\n} from 'react';\nimport { useItemSelector } from '../../hooks';\nimport { cn } from '../../utils/cn';\n\nexport type SwitchSelectorChoice<T = boolean> = {\n  content: ReactNode;\n  value: T;\n} & HTMLAttributes<HTMLButtonElement>;\nexport type SwitchSelectorChoices<T> = SwitchSelectorChoice<T>[];\n\nconst defaultChoices: SwitchSelectorChoices<boolean> = [\n  { content: 'Off', value: false },\n  { content: 'On', value: true },\n];\n\nexport type SwitchSelectorProps<T = boolean> = {\n  choices?: SwitchSelectorChoices<T>;\n  value?: T;\n  defaultValue?: T;\n  onChange?: (choice: T) => void;\n  className?: string;\n} & VariantProps<typeof switchSelectorVariant> &\n  VariantProps<typeof choiceVariant>;\n\nconst switchSelectorVariant = cva(\n  'flex flex-row gap-2 rounded-full w-fit border-[1.5px] p-[1.5px]',\n  {\n    variants: {\n      color: {\n        primary: 'border-primary text-primary',\n        secondary: 'border-secondary text-secondary',\n        destructive: 'border-destructive bg-destructive text-destructive',\n        neutral: 'border-neutral text-neutral ',\n        light: 'border-white text-white',\n        dark: 'border-neutral-800 text-neutral-800',\n        text: 'border-text text-text',\n      },\n    },\n    defaultVariants: {\n      color: 'primary',\n    },\n  }\n);\n\nconst choiceVariant = cva(\n  'z-1 w-full flex-1 text-sm font-medium transition-all duration-300 ease-in-out cursor-pointer aria-selected:cursor-default aria-selected:text-text-opposite motion-reduce:transition-none',\n  {\n    variants: {\n      size: {\n        sm: 'py-1 px-2 text-xs',\n        md: 'p-2 text-sm',\n        lg: 'p-4 text-base',\n      },\n    },\n    defaultVariants: {\n      size: 'md',\n    },\n  }\n);\n\nconst indicatorVariant = cva(\n  'absolute top-0 z-[-1] h-full w-auto rounded-full transition-[left,width] duration-300 ease-in-out motion-reduce:transition-none',\n  {\n    variants: {\n      color: {\n        primary: 'bg-primary aria-selected:text-text',\n        secondary: 'bg-secondary aria-selected:text-text',\n        destructive: 'bg-destructive aria-selected:text-text',\n        neutral: 'bg-neutral aria-selected:text-white ',\n        light: 'bg-white aria-selected:text-black',\n        dark: 'bg-neutral-800 aria-selected:text-white',\n        text: 'bg-text aria-selected:text-text-opposite',\n      },\n    },\n  }\n);\n\n/**\n *\n * Component that allows the user to select one of the provided choices.\n *\n * Example:\n * ```jsx\n * <SwitchSelector\n *   choices={[\n *     { content: 'Option 1', value: 'option1' },\n *     { content: 'Option 2', value: 'option2' },\n *     { content: 'Option 3', value: 'option3' },\n *   ]}\n *   value=\"option1\"\n *   onChange={(choice) => console.log(choice)}\n * />\n * ```\n */\nexport const SwitchSelector = <T,>({\n  choices = defaultChoices as SwitchSelectorChoices<T>,\n  value,\n  defaultValue,\n  onChange,\n  color = 'primary',\n  size = 'md',\n  className,\n}: SwitchSelectorProps<T>) => {\n  const [valueState, setValue] = useState<T>(\n    value ?? defaultValue ?? choices[0].value\n  );\n  const optionsRefs = useRef<HTMLButtonElement[]>([]);\n  const indicatorRef = useRef<HTMLDivElement | null>(null);\n  const { choiceIndicatorPosition } = useItemSelector(optionsRefs);\n\n  const handleChange = (newValue: T) => {\n    setValue(newValue);\n    onChange?.(newValue);\n  };\n\n  useEffect(() => {\n    if (value === undefined) return;\n    setValue(value);\n  }, [value]);\n\n  return (\n    <div\n      className={switchSelectorVariant({\n        color,\n        className,\n      })}\n      role=\"tablist\"\n    >\n      <div className=\"relative flex size-full flex-row items-center justify-center\">\n        {choices.map((choice, index) => {\n          const { content, value, ...buttonProps } = choice;\n\n          const isKeyOfKey =\n            typeof value === 'string' || typeof value === 'number';\n\n          const isSelected = value === valueState;\n\n          return (\n            <button\n              {...buttonProps}\n              className={cn(\n                choiceVariant({\n                  size,\n                })\n              )}\n              key={isKeyOfKey ? value : index}\n              role=\"tab\"\n              onClick={() => handleChange(value)}\n              aria-selected={isSelected}\n              disabled={isSelected}\n              ref={(el) => {\n                optionsRefs.current[index] = el!;\n              }}\n            >\n              {content}\n            </button>\n          );\n        })}\n        {choiceIndicatorPosition && (\n          <div\n            className={cn(\n              indicatorVariant({\n                color,\n              })\n            )}\n            style={choiceIndicatorPosition}\n            ref={indicatorRef}\n          />\n        )}\n      </div>\n    </div>\n  );\n};\n"],"names":["cva","useState","useRef","useItemSelector","useEffect","jsx","jsxs","value","createElement","cn"],"mappings":"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"}

package/dist/components/SwitchSelector/index.mjs

@@ -2,11 +2,12 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useState, useRef, useEffect, createElement } from "react";
 import { cva } from "class-variance-authority";
+import "@intlayer/config/built";
+import "../../better-auth.8zoxzg-F-D8e0X4ys.js";
 import "@intlayer/editor-react";
 import "../Toaster/Toast.mjs";
 import "../../hooks/useAsync/useAsyncStateStore.mjs";
 import "@intlayer/api";
-import "@intlayer/config/built";
 import "deepmerge";
 import { useItemSelector } from "../../hooks/useItemSelector.mjs";
 import "../../hooks/useScrollBlockage/useScrollBlockageStore.mjs";

package/dist/components/SwitchSelector/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../../../src/components/SwitchSelector/index.tsx"],"sourcesContent":["'use client';\n\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport {\n  useEffect,\n  useRef,\n  useState,\n  type HTMLAttributes,\n  type ReactNode,\n} from 'react';\nimport { useItemSelector } from '../../hooks';\nimport { cn } from '../../utils/cn';\n\nexport type SwitchSelectorChoice<T = boolean> = {\n  content: ReactNode;\n  value: T;\n} & HTMLAttributes<HTMLButtonElement>;\nexport type SwitchSelectorChoices<T> = SwitchSelectorChoice<T>[];\n\nconst defaultChoices: SwitchSelectorChoices<boolean> = [\n  { content: 'Off', value: false },\n  { content: 'On', value: true },\n];\n\nexport type SwitchSelectorProps<T = boolean> = {\n  choices?: SwitchSelectorChoices<T>;\n  value?: T;\n  defaultValue?: T;\n  onChange?: (choice: T) => void;\n  className?: string;\n} & VariantProps<typeof switchSelectorVariant> &\n  VariantProps<typeof choiceVariant>;\n\nconst switchSelectorVariant = cva(\n  'flex flex-row gap-2 rounded-full w-fit border-[1.5px] p-[1.5px]',\n  {\n    variants: {\n      color: {\n        primary: 'border-primary text-primary',\n        secondary: 'border-secondary text-secondary',\n        destructive: 'border-destructive bg-destructive text-destructive',\n        neutral: 'border-neutral text-neutral ',\n        light: 'border-white text-white',\n        dark: 'border-neutral-800 text-neutral-800',\n        text: 'border-text text-text',\n      },\n    },\n    defaultVariants: {\n      color: 'primary',\n    },\n  }\n);\n\nconst choiceVariant = cva(\n  'z-1 w-full flex-1 text-sm font-medium transition-all duration-300 ease-in-out cursor-pointer aria-selected:cursor-default aria-selected:text-text-opposite motion-reduce:transition-none',\n  {\n    variants: {\n      size: {\n        sm: 'py-1 px-2 text-xs',\n        md: 'p-2 text-sm',\n        lg: 'p-4 text-base',\n      },\n    },\n    defaultVariants: {\n      size: 'md',\n    },\n  }\n);\n\nconst indicatorVariant = cva(\n  'absolute top-0 z-[-1] h-full w-auto rounded-full transition-[left,width] duration-300 ease-in-out motion-reduce:transition-none',\n  {\n    variants: {\n      color: {\n        primary: 'bg-primary aria-selected:text-text',\n        secondary: 'bg-secondary aria-selected:text-text',\n        destructive: 'bg-destructive aria-selected:text-text',\n        neutral: 'bg-neutral aria-selected:text-white ',\n        light: 'bg-white aria-selected:text-black',\n        dark: 'bg-neutral-800 aria-selected:text-white',\n        text: 'bg-text aria-selected:text-text-opposite',\n      },\n    },\n  }\n);\n\n/**\n *\n * Component that allows the user to select one of the provided choices.\n *\n * Example:\n * ```jsx\n * <SwitchSelector\n *   choices={[\n *     { content: 'Option 1', value: 'option1' },\n *     { content: 'Option 2', value: 'option2' },\n *     { content: 'Option 3', value: 'option3' },\n *   ]}\n *   value=\"option1\"\n *   onChange={(choice) => console.log(choice)}\n * />\n * ```\n */\nexport const SwitchSelector = <T,>({\n  choices = defaultChoices as SwitchSelectorChoices<T>,\n  value,\n  defaultValue,\n  onChange,\n  color = 'primary',\n  size = 'md',\n  className,\n}: SwitchSelectorProps<T>) => {\n  const [valueState, setValue] = useState<T>(\n    value ?? defaultValue ?? choices[0].value\n  );\n  const optionsRefs = useRef<HTMLButtonElement[]>([]);\n  const indicatorRef = useRef<HTMLDivElement | null>(null);\n  const { choiceIndicatorPosition } = useItemSelector(optionsRefs);\n\n  const handleChange = (newValue: T) => {\n    setValue(newValue);\n    onChange?.(newValue);\n  };\n\n  useEffect(() => {\n    if (value === undefined) return;\n    setValue(value);\n  }, [value]);\n\n  return (\n    <div\n      className={switchSelectorVariant({\n        color,\n        className,\n      })}\n      role=\"tablist\"\n    >\n      <div className=\"relative flex size-full flex-row items-center justify-center\">\n        {choices.map((choice, index) => {\n          const { content, value, ...buttonProps } = choice;\n\n          const isKeyOfKey =\n            typeof value === 'string' || typeof value === 'number';\n\n          const isSelected = value === valueState;\n\n          return (\n            <button\n              {...buttonProps}\n              className={cn(\n                choiceVariant({\n                  size,\n                })\n              )}\n              key={isKeyOfKey ? value : index}\n              role=\"tab\"\n              onClick={() => handleChange(value)}\n              aria-selected={isSelected}\n              disabled={isSelected}\n              ref={(el) => {\n                optionsRefs.current[index] = el!;\n              }}\n            >\n              {content}\n            </button>\n          );\n        })}\n        {choiceIndicatorPosition && (\n          <div\n            className={cn(\n              indicatorVariant({\n                color,\n              })\n            )}\n            style={choiceIndicatorPosition}\n            ref={indicatorRef}\n          />\n        )}\n      </div>\n    </div>\n  );\n};\n"],"names":["value"],"mappings":"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"}
+{"version":3,"file":"index.mjs","sources":["../../../src/components/SwitchSelector/index.tsx"],"sourcesContent":["'use client';\n\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport {\n  useEffect,\n  useRef,\n  useState,\n  type HTMLAttributes,\n  type ReactNode,\n} from 'react';\nimport { useItemSelector } from '../../hooks';\nimport { cn } from '../../utils/cn';\n\nexport type SwitchSelectorChoice<T = boolean> = {\n  content: ReactNode;\n  value: T;\n} & HTMLAttributes<HTMLButtonElement>;\nexport type SwitchSelectorChoices<T> = SwitchSelectorChoice<T>[];\n\nconst defaultChoices: SwitchSelectorChoices<boolean> = [\n  { content: 'Off', value: false },\n  { content: 'On', value: true },\n];\n\nexport type SwitchSelectorProps<T = boolean> = {\n  choices?: SwitchSelectorChoices<T>;\n  value?: T;\n  defaultValue?: T;\n  onChange?: (choice: T) => void;\n  className?: string;\n} & VariantProps<typeof switchSelectorVariant> &\n  VariantProps<typeof choiceVariant>;\n\nconst switchSelectorVariant = cva(\n  'flex flex-row gap-2 rounded-full w-fit border-[1.5px] p-[1.5px]',\n  {\n    variants: {\n      color: {\n        primary: 'border-primary text-primary',\n        secondary: 'border-secondary text-secondary',\n        destructive: 'border-destructive bg-destructive text-destructive',\n        neutral: 'border-neutral text-neutral ',\n        light: 'border-white text-white',\n        dark: 'border-neutral-800 text-neutral-800',\n        text: 'border-text text-text',\n      },\n    },\n    defaultVariants: {\n      color: 'primary',\n    },\n  }\n);\n\nconst choiceVariant = cva(\n  'z-1 w-full flex-1 text-sm font-medium transition-all duration-300 ease-in-out cursor-pointer aria-selected:cursor-default aria-selected:text-text-opposite motion-reduce:transition-none',\n  {\n    variants: {\n      size: {\n        sm: 'py-1 px-2 text-xs',\n        md: 'p-2 text-sm',\n        lg: 'p-4 text-base',\n      },\n    },\n    defaultVariants: {\n      size: 'md',\n    },\n  }\n);\n\nconst indicatorVariant = cva(\n  'absolute top-0 z-[-1] h-full w-auto rounded-full transition-[left,width] duration-300 ease-in-out motion-reduce:transition-none',\n  {\n    variants: {\n      color: {\n        primary: 'bg-primary aria-selected:text-text',\n        secondary: 'bg-secondary aria-selected:text-text',\n        destructive: 'bg-destructive aria-selected:text-text',\n        neutral: 'bg-neutral aria-selected:text-white ',\n        light: 'bg-white aria-selected:text-black',\n        dark: 'bg-neutral-800 aria-selected:text-white',\n        text: 'bg-text aria-selected:text-text-opposite',\n      },\n    },\n  }\n);\n\n/**\n *\n * Component that allows the user to select one of the provided choices.\n *\n * Example:\n * ```jsx\n * <SwitchSelector\n *   choices={[\n *     { content: 'Option 1', value: 'option1' },\n *     { content: 'Option 2', value: 'option2' },\n *     { content: 'Option 3', value: 'option3' },\n *   ]}\n *   value=\"option1\"\n *   onChange={(choice) => console.log(choice)}\n * />\n * ```\n */\nexport const SwitchSelector = <T,>({\n  choices = defaultChoices as SwitchSelectorChoices<T>,\n  value,\n  defaultValue,\n  onChange,\n  color = 'primary',\n  size = 'md',\n  className,\n}: SwitchSelectorProps<T>) => {\n  const [valueState, setValue] = useState<T>(\n    value ?? defaultValue ?? choices[0].value\n  );\n  const optionsRefs = useRef<HTMLButtonElement[]>([]);\n  const indicatorRef = useRef<HTMLDivElement | null>(null);\n  const { choiceIndicatorPosition } = useItemSelector(optionsRefs);\n\n  const handleChange = (newValue: T) => {\n    setValue(newValue);\n    onChange?.(newValue);\n  };\n\n  useEffect(() => {\n    if (value === undefined) return;\n    setValue(value);\n  }, [value]);\n\n  return (\n    <div\n      className={switchSelectorVariant({\n        color,\n        className,\n      })}\n      role=\"tablist\"\n    >\n      <div className=\"relative flex size-full flex-row items-center justify-center\">\n        {choices.map((choice, index) => {\n          const { content, value, ...buttonProps } = choice;\n\n          const isKeyOfKey =\n            typeof value === 'string' || typeof value === 'number';\n\n          const isSelected = value === valueState;\n\n          return (\n            <button\n              {...buttonProps}\n              className={cn(\n                choiceVariant({\n                  size,\n                })\n              )}\n              key={isKeyOfKey ? value : index}\n              role=\"tab\"\n              onClick={() => handleChange(value)}\n              aria-selected={isSelected}\n              disabled={isSelected}\n              ref={(el) => {\n                optionsRefs.current[index] = el!;\n              }}\n            >\n              {content}\n            </button>\n          );\n        })}\n        {choiceIndicatorPosition && (\n          <div\n            className={cn(\n              indicatorVariant({\n                color,\n              })\n            )}\n            style={choiceIndicatorPosition}\n            ref={indicatorRef}\n          />\n        )}\n      </div>\n    </div>\n  );\n};\n"],"names":["value"],"mappings":"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"}

package/dist/components/TabSelector/TabSelector.cjs

@@ -4,11 +4,12 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const classVarianceAuthority = require("class-variance-authority");
 const ReactExports = require("react");
+require("@intlayer/config/built");
+require("../../better-auth.8zoxzg-F-BEBqzpjz.cjs");
 require("@intlayer/editor-react");
 require("../Toaster/Toast.cjs");
 require("../../hooks/useAsync/useAsyncStateStore.cjs");
 require("@intlayer/api");
-require("@intlayer/config/built");
 require("deepmerge");
 const hooks_useItemSelector = require("../../hooks/useItemSelector.cjs");
 require("../../hooks/useScrollBlockage/useScrollBlockageStore.cjs");

package/dist/components/TabSelector/TabSelector.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TabSelector.cjs","sources":["../../../src/components/TabSelector/TabSelector.tsx"],"sourcesContent":["'use client';\n\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport {\n  useRef,\n  type HTMLAttributes,\n  type ReactElement,\n  cloneElement,\n} from 'react';\nimport { useItemSelector } from '../../hooks';\nimport { cn } from '../../utils/cn';\n\nconst tabSelectorVariant = cva(\n  'relative flex size-full flex-row items-center gap-2',\n  {\n    variants: {\n      color: {\n        primary: 'border-primary text-primary',\n        secondary: 'border-secondary text-secondary',\n        destructive: 'border-destructive bg-destructive text-destructive',\n        neutral: 'border-neutral text-neutral ',\n        light: 'border-white text-white',\n        dark: 'border-neutral-800 text-neutral-800',\n        text: 'border-text text-text',\n      },\n    },\n    defaultVariants: {\n      color: 'primary',\n    },\n  }\n);\n\nconst indicatorVariant = cva(\n  'absolute top-0 z-[-1] h-full w-auto rounded-lg transition-[left,width] duration-300 ease-in-out motion-reduce:transition-none',\n  {\n    variants: {\n      color: {\n        primary: 'bg-primary/10 aria-selected:text-text',\n        secondary: 'bg-secondary/10 aria-selected:text-text',\n        destructive: 'bg-destructive/10 aria-selected:text-text',\n        neutral: 'bg-neutral/10 aria-selected:text-white/10',\n        light: 'bg-white/10 aria-selected:text-black',\n        dark: 'bg-neutral-800/10 aria-selected:text-white',\n        text: 'bg-text/10 aria-selected:text-text-opposite',\n      },\n    },\n  }\n);\n\nexport type TabProps = HTMLAttributes<HTMLElement> & {\n  key: string | number;\n};\n\ntype TabSelectorProps<T extends TabProps> = {\n  tabs: ReactElement<T>[];\n  selectedChoice: T['key'];\n  onTabClick?: (choice: T['key']) => void;\n  hoverable?: boolean;\n} & HTMLAttributes<HTMLElement> &\n  VariantProps<typeof tabSelectorVariant>;\n\n/**\n *\n * Component that allows the user to select one of the provided choices.\n *\n * Example:\n * ```jsx\n * <TabSelector\n *   selectedChoice=\"option1\"\n *   onTabClick={(choice) => console.log(choice)}\n *   hoverable={true}\n * >\n *   <Button key=\"option1\"/>\n *   <Button key=\"option2\"/>\n *   <Button key=\"option3\"/>\n * </TabSelector>\n * ```\n */\nexport const TabSelector = <T extends TabProps>({\n  tabs,\n  selectedChoice,\n  onTabClick,\n  color = 'primary',\n  hoverable = false,\n  className,\n}: TabSelectorProps<T>) => {\n  const optionsRefs = useRef<HTMLElement[]>([]);\n  const indicatorRef = useRef<HTMLDivElement | null>(null);\n  const { choiceIndicatorPosition } = useItemSelector(\n    optionsRefs,\n    undefined,\n    hoverable\n  );\n\n  return (\n    <div\n      className={cn(\n        tabSelectorVariant({\n          color,\n        }),\n        className\n      )}\n      aria-orientation=\"horizontal\"\n      aria-multiselectable=\"false\"\n      role=\"tablist\"\n    >\n      {tabs.map((Tab, index) => {\n        const key = Tab.key!;\n\n        const isSelected = selectedChoice === key;\n\n        return cloneElement(Tab, {\n          key: key ?? index,\n          role: 'tab',\n          onClick: () => onTabClick?.(key),\n          'aria-selected': isSelected,\n          ref: (el: HTMLElement) => {\n            optionsRefs.current[index] = el!;\n          },\n        } as unknown as T);\n      })}\n      {choiceIndicatorPosition && (\n        <div\n          className={cn(\n            indicatorVariant({\n              color,\n            })\n          )}\n          style={choiceIndicatorPosition}\n          ref={indicatorRef}\n          key={`${selectedChoice}${JSON.stringify(tabs.map((tab) => tab.key))}`}\n        />\n      )}\n    </div>\n  );\n};\n"],"names":["cva","useRef","useItemSelector","jsxs","cn","cloneElement","jsx"],"mappings":";;;;;;;;;;;;;;;AAYA,MAAM,qBAAqBA,uBAAA;AAAA,EACzB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,OAAO;AAAA,QACL,SAAS;AAAA,QACT,WAAW;AAAA,QACX,aAAa;AAAA,QACb,SAAS;AAAA,QACT,OAAO;AAAA,QACP,MAAM;AAAA,QACN,MAAM;AAAA,MAAA;AAAA,IAEV;AAAA,IACA,iBAAiB;AAAA,MACf,OAAO;AAAA,IAAA;AAAA,EACT;AAEJ;AAEA,MAAM,mBAAmBA,uBAAA;AAAA,EACvB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,OAAO;AAAA,QACL,SAAS;AAAA,QACT,WAAW;AAAA,QACX,aAAa;AAAA,QACb,SAAS;AAAA,QACT,OAAO;AAAA,QACP,MAAM;AAAA,QACN,MAAM;AAAA,MAAA;AAAA,IACR;AAAA,EACF;AAEJ;AA+BO,MAAM,cAAc,CAAqB;AAAA,EAC9C;AAAA,EACA;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR,YAAY;AAAA,EACZ;AACF,MAA2B;AACnB,QAAA,cAAcC,aAAsB,OAAA,EAAE;AACtC,QAAA,eAAeA,oBAA8B,IAAI;AACjD,QAAA,EAAE,4BAA4BC,sBAAA;AAAA,IAClC;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAGE,SAAAC,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,SAAA;AAAA,QACT,mBAAmB;AAAA,UACjB;AAAA,QAAA,CACD;AAAA,QACD;AAAA,MACF;AAAA,MACA,oBAAiB;AAAA,MACjB,wBAAqB;AAAA,MACrB,MAAK;AAAA,MAEJ,UAAA;AAAA,QAAK,KAAA,IAAI,CAAC,KAAK,UAAU;AACxB,gBAAM,MAAM,IAAI;AAEhB,gBAAM,aAAa,mBAAmB;AAEtC,iBAAOC,aAAAA,aAAa,KAAK;AAAA,YACvB,KAAK,OAAO;AAAA,YACZ,MAAM;AAAA,YACN,SAAS,MAAM,aAAa,GAAG;AAAA,YAC/B,iBAAiB;AAAA,YACjB,KAAK,CAAC,OAAoB;AACZ,0BAAA,QAAQ,KAAK,IAAI;AAAA,YAAA;AAAA,UAC/B,CACe;AAAA,QAAA,CAClB;AAAA,QACA,2BACCC,2BAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWF,SAAA;AAAA,cACT,iBAAiB;AAAA,gBACf;AAAA,cACD,CAAA;AAAA,YACH;AAAA,YACA,OAAO;AAAA,YACP,KAAK;AAAA,UAAA;AAAA,UACA,GAAG,cAAc,GAAG,KAAK,UAAU,KAAK,IAAI,CAAC,QAAQ,IAAI,GAAG,CAAC,CAAC;AAAA,QAAA;AAAA,MACrE;AAAA,IAAA;AAAA,EAEJ;AAEJ;;"}
+{"version":3,"file":"TabSelector.cjs","sources":["../../../src/components/TabSelector/TabSelector.tsx"],"sourcesContent":["'use client';\n\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport {\n  useRef,\n  type HTMLAttributes,\n  type ReactElement,\n  cloneElement,\n} from 'react';\nimport { useItemSelector } from '../../hooks';\nimport { cn } from '../../utils/cn';\n\nconst tabSelectorVariant = cva(\n  'relative flex size-full flex-row items-center gap-2',\n  {\n    variants: {\n      color: {\n        primary: 'border-primary text-primary',\n        secondary: 'border-secondary text-secondary',\n        destructive: 'border-destructive bg-destructive text-destructive',\n        neutral: 'border-neutral text-neutral ',\n        light: 'border-white text-white',\n        dark: 'border-neutral-800 text-neutral-800',\n        text: 'border-text text-text',\n      },\n    },\n    defaultVariants: {\n      color: 'primary',\n    },\n  }\n);\n\nconst indicatorVariant = cva(\n  'absolute top-0 z-[-1] h-full w-auto rounded-lg transition-[left,width] duration-300 ease-in-out motion-reduce:transition-none',\n  {\n    variants: {\n      color: {\n        primary: 'bg-primary/10 aria-selected:text-text',\n        secondary: 'bg-secondary/10 aria-selected:text-text',\n        destructive: 'bg-destructive/10 aria-selected:text-text',\n        neutral: 'bg-neutral/10 aria-selected:text-white/10',\n        light: 'bg-white/10 aria-selected:text-black',\n        dark: 'bg-neutral-800/10 aria-selected:text-white',\n        text: 'bg-text/10 aria-selected:text-text-opposite',\n      },\n    },\n  }\n);\n\nexport type TabProps = HTMLAttributes<HTMLElement> & {\n  key: string | number;\n};\n\ntype TabSelectorProps<T extends TabProps> = {\n  tabs: ReactElement<T>[];\n  selectedChoice: T['key'];\n  onTabClick?: (choice: T['key']) => void;\n  hoverable?: boolean;\n} & HTMLAttributes<HTMLElement> &\n  VariantProps<typeof tabSelectorVariant>;\n\n/**\n *\n * Component that allows the user to select one of the provided choices.\n *\n * Example:\n * ```jsx\n * <TabSelector\n *   selectedChoice=\"option1\"\n *   onTabClick={(choice) => console.log(choice)}\n *   hoverable={true}\n * >\n *   <Button key=\"option1\"/>\n *   <Button key=\"option2\"/>\n *   <Button key=\"option3\"/>\n * </TabSelector>\n * ```\n */\nexport const TabSelector = <T extends TabProps>({\n  tabs,\n  selectedChoice,\n  onTabClick,\n  color = 'primary',\n  hoverable = false,\n  className,\n}: TabSelectorProps<T>) => {\n  const optionsRefs = useRef<HTMLElement[]>([]);\n  const indicatorRef = useRef<HTMLDivElement | null>(null);\n  const { choiceIndicatorPosition } = useItemSelector(\n    optionsRefs,\n    undefined,\n    hoverable\n  );\n\n  return (\n    <div\n      className={cn(\n        tabSelectorVariant({\n          color,\n        }),\n        className\n      )}\n      aria-orientation=\"horizontal\"\n      aria-multiselectable=\"false\"\n      role=\"tablist\"\n    >\n      {tabs.map((Tab, index) => {\n        const key = Tab.key!;\n\n        const isSelected = selectedChoice === key;\n\n        return cloneElement(Tab, {\n          key: key ?? index,\n          role: 'tab',\n          onClick: () => onTabClick?.(key),\n          'aria-selected': isSelected,\n          ref: (el: HTMLElement) => {\n            optionsRefs.current[index] = el!;\n          },\n        } as unknown as T);\n      })}\n      {choiceIndicatorPosition && (\n        <div\n          className={cn(\n            indicatorVariant({\n              color,\n            })\n          )}\n          style={choiceIndicatorPosition}\n          ref={indicatorRef}\n          key={`${selectedChoice}${JSON.stringify(tabs.map((tab) => tab.key))}`}\n        />\n      )}\n    </div>\n  );\n};\n"],"names":["cva","useRef","useItemSelector","jsxs","cn","cloneElement","jsx"],"mappings":";;;;;;;;;;;;;;;;AAYA,MAAM,qBAAqBA,uBAAA;AAAA,EACzB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,OAAO;AAAA,QACL,SAAS;AAAA,QACT,WAAW;AAAA,QACX,aAAa;AAAA,QACb,SAAS;AAAA,QACT,OAAO;AAAA,QACP,MAAM;AAAA,QACN,MAAM;AAAA,MAAA;AAAA,IAEV;AAAA,IACA,iBAAiB;AAAA,MACf,OAAO;AAAA,IAAA;AAAA,EACT;AAEJ;AAEA,MAAM,mBAAmBA,uBAAA;AAAA,EACvB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,OAAO;AAAA,QACL,SAAS;AAAA,QACT,WAAW;AAAA,QACX,aAAa;AAAA,QACb,SAAS;AAAA,QACT,OAAO;AAAA,QACP,MAAM;AAAA,QACN,MAAM;AAAA,MAAA;AAAA,IACR;AAAA,EACF;AAEJ;AA+BO,MAAM,cAAc,CAAqB;AAAA,EAC9C;AAAA,EACA;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR,YAAY;AAAA,EACZ;AACF,MAA2B;AACnB,QAAA,cAAcC,aAAsB,OAAA,EAAE;AACtC,QAAA,eAAeA,oBAA8B,IAAI;AACjD,QAAA,EAAE,4BAA4BC,sBAAA;AAAA,IAClC;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAGE,SAAAC,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,SAAA;AAAA,QACT,mBAAmB;AAAA,UACjB;AAAA,QAAA,CACD;AAAA,QACD;AAAA,MACF;AAAA,MACA,oBAAiB;AAAA,MACjB,wBAAqB;AAAA,MACrB,MAAK;AAAA,MAEJ,UAAA;AAAA,QAAK,KAAA,IAAI,CAAC,KAAK,UAAU;AACxB,gBAAM,MAAM,IAAI;AAEhB,gBAAM,aAAa,mBAAmB;AAEtC,iBAAOC,aAAAA,aAAa,KAAK;AAAA,YACvB,KAAK,OAAO;AAAA,YACZ,MAAM;AAAA,YACN,SAAS,MAAM,aAAa,GAAG;AAAA,YAC/B,iBAAiB;AAAA,YACjB,KAAK,CAAC,OAAoB;AACZ,0BAAA,QAAQ,KAAK,IAAI;AAAA,YAAA;AAAA,UAC/B,CACe;AAAA,QAAA,CAClB;AAAA,QACA,2BACCC,2BAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWF,SAAA;AAAA,cACT,iBAAiB;AAAA,gBACf;AAAA,cACD,CAAA;AAAA,YACH;AAAA,YACA,OAAO;AAAA,YACP,KAAK;AAAA,UAAA;AAAA,UACA,GAAG,cAAc,GAAG,KAAK,UAAU,KAAK,IAAI,CAAC,QAAQ,IAAI,GAAG,CAAC,CAAC;AAAA,QAAA;AAAA,MACrE;AAAA,IAAA;AAAA,EAEJ;AAEJ;;"}

package/dist/components/TabSelector/TabSelector.mjs

@@ -2,11 +2,12 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { cva } from "class-variance-authority";
 import { useRef, cloneElement } from "react";
+import "@intlayer/config/built";
+import "../../better-auth.8zoxzg-F-D8e0X4ys.js";
 import "@intlayer/editor-react";
 import "../Toaster/Toast.mjs";
 import "../../hooks/useAsync/useAsyncStateStore.mjs";
 import "@intlayer/api";
-import "@intlayer/config/built";
 import "deepmerge";
 import { useItemSelector } from "../../hooks/useItemSelector.mjs";
 import "../../hooks/useScrollBlockage/useScrollBlockageStore.mjs";

package/dist/components/TabSelector/TabSelector.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"TabSelector.mjs","sources":["../../../src/components/TabSelector/TabSelector.tsx"],"sourcesContent":["'use client';\n\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport {\n  useRef,\n  type HTMLAttributes,\n  type ReactElement,\n  cloneElement,\n} from 'react';\nimport { useItemSelector } from '../../hooks';\nimport { cn } from '../../utils/cn';\n\nconst tabSelectorVariant = cva(\n  'relative flex size-full flex-row items-center gap-2',\n  {\n    variants: {\n      color: {\n        primary: 'border-primary text-primary',\n        secondary: 'border-secondary text-secondary',\n        destructive: 'border-destructive bg-destructive text-destructive',\n        neutral: 'border-neutral text-neutral ',\n        light: 'border-white text-white',\n        dark: 'border-neutral-800 text-neutral-800',\n        text: 'border-text text-text',\n      },\n    },\n    defaultVariants: {\n      color: 'primary',\n    },\n  }\n);\n\nconst indicatorVariant = cva(\n  'absolute top-0 z-[-1] h-full w-auto rounded-lg transition-[left,width] duration-300 ease-in-out motion-reduce:transition-none',\n  {\n    variants: {\n      color: {\n        primary: 'bg-primary/10 aria-selected:text-text',\n        secondary: 'bg-secondary/10 aria-selected:text-text',\n        destructive: 'bg-destructive/10 aria-selected:text-text',\n        neutral: 'bg-neutral/10 aria-selected:text-white/10',\n        light: 'bg-white/10 aria-selected:text-black',\n        dark: 'bg-neutral-800/10 aria-selected:text-white',\n        text: 'bg-text/10 aria-selected:text-text-opposite',\n      },\n    },\n  }\n);\n\nexport type TabProps = HTMLAttributes<HTMLElement> & {\n  key: string | number;\n};\n\ntype TabSelectorProps<T extends TabProps> = {\n  tabs: ReactElement<T>[];\n  selectedChoice: T['key'];\n  onTabClick?: (choice: T['key']) => void;\n  hoverable?: boolean;\n} & HTMLAttributes<HTMLElement> &\n  VariantProps<typeof tabSelectorVariant>;\n\n/**\n *\n * Component that allows the user to select one of the provided choices.\n *\n * Example:\n * ```jsx\n * <TabSelector\n *   selectedChoice=\"option1\"\n *   onTabClick={(choice) => console.log(choice)}\n *   hoverable={true}\n * >\n *   <Button key=\"option1\"/>\n *   <Button key=\"option2\"/>\n *   <Button key=\"option3\"/>\n * </TabSelector>\n * ```\n */\nexport const TabSelector = <T extends TabProps>({\n  tabs,\n  selectedChoice,\n  onTabClick,\n  color = 'primary',\n  hoverable = false,\n  className,\n}: TabSelectorProps<T>) => {\n  const optionsRefs = useRef<HTMLElement[]>([]);\n  const indicatorRef = useRef<HTMLDivElement | null>(null);\n  const { choiceIndicatorPosition } = useItemSelector(\n    optionsRefs,\n    undefined,\n    hoverable\n  );\n\n  return (\n    <div\n      className={cn(\n        tabSelectorVariant({\n          color,\n        }),\n        className\n      )}\n      aria-orientation=\"horizontal\"\n      aria-multiselectable=\"false\"\n      role=\"tablist\"\n    >\n      {tabs.map((Tab, index) => {\n        const key = Tab.key!;\n\n        const isSelected = selectedChoice === key;\n\n        return cloneElement(Tab, {\n          key: key ?? index,\n          role: 'tab',\n          onClick: () => onTabClick?.(key),\n          'aria-selected': isSelected,\n          ref: (el: HTMLElement) => {\n            optionsRefs.current[index] = el!;\n          },\n        } as unknown as T);\n      })}\n      {choiceIndicatorPosition && (\n        <div\n          className={cn(\n            indicatorVariant({\n              color,\n            })\n          )}\n          style={choiceIndicatorPosition}\n          ref={indicatorRef}\n          key={`${selectedChoice}${JSON.stringify(tabs.map((tab) => tab.key))}`}\n        />\n      )}\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;AAYA,MAAM,qBAAqB;AAAA,EACzB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,OAAO;AAAA,QACL,SAAS;AAAA,QACT,WAAW;AAAA,QACX,aAAa;AAAA,QACb,SAAS;AAAA,QACT,OAAO;AAAA,QACP,MAAM;AAAA,QACN,MAAM;AAAA,MAAA;AAAA,IAEV;AAAA,IACA,iBAAiB;AAAA,MACf,OAAO;AAAA,IAAA;AAAA,EACT;AAEJ;AAEA,MAAM,mBAAmB;AAAA,EACvB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,OAAO;AAAA,QACL,SAAS;AAAA,QACT,WAAW;AAAA,QACX,aAAa;AAAA,QACb,SAAS;AAAA,QACT,OAAO;AAAA,QACP,MAAM;AAAA,QACN,MAAM;AAAA,MAAA;AAAA,IACR;AAAA,EACF;AAEJ;AA+BO,MAAM,cAAc,CAAqB;AAAA,EAC9C;AAAA,EACA;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR,YAAY;AAAA,EACZ;AACF,MAA2B;AACnB,QAAA,cAAc,OAAsB,EAAE;AACtC,QAAA,eAAe,OAA8B,IAAI;AACjD,QAAA,EAAE,4BAA4B;AAAA,IAClC;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAGE,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT,mBAAmB;AAAA,UACjB;AAAA,QAAA,CACD;AAAA,QACD;AAAA,MACF;AAAA,MACA,oBAAiB;AAAA,MACjB,wBAAqB;AAAA,MACrB,MAAK;AAAA,MAEJ,UAAA;AAAA,QAAK,KAAA,IAAI,CAAC,KAAK,UAAU;AACxB,gBAAM,MAAM,IAAI;AAEhB,gBAAM,aAAa,mBAAmB;AAEtC,iBAAO,aAAa,KAAK;AAAA,YACvB,KAAK,OAAO;AAAA,YACZ,MAAM;AAAA,YACN,SAAS,MAAM,aAAa,GAAG;AAAA,YAC/B,iBAAiB;AAAA,YACjB,KAAK,CAAC,OAAoB;AACZ,0BAAA,QAAQ,KAAK,IAAI;AAAA,YAAA;AAAA,UAC/B,CACe;AAAA,QAAA,CAClB;AAAA,QACA,2BACC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW;AAAA,cACT,iBAAiB;AAAA,gBACf;AAAA,cACD,CAAA;AAAA,YACH;AAAA,YACA,OAAO;AAAA,YACP,KAAK;AAAA,UAAA;AAAA,UACA,GAAG,cAAc,GAAG,KAAK,UAAU,KAAK,IAAI,CAAC,QAAQ,IAAI,GAAG,CAAC,CAAC;AAAA,QAAA;AAAA,MACrE;AAAA,IAAA;AAAA,EAEJ;AAEJ;"}
+{"version":3,"file":"TabSelector.mjs","sources":["../../../src/components/TabSelector/TabSelector.tsx"],"sourcesContent":["'use client';\n\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport {\n  useRef,\n  type HTMLAttributes,\n  type ReactElement,\n  cloneElement,\n} from 'react';\nimport { useItemSelector } from '../../hooks';\nimport { cn } from '../../utils/cn';\n\nconst tabSelectorVariant = cva(\n  'relative flex size-full flex-row items-center gap-2',\n  {\n    variants: {\n      color: {\n        primary: 'border-primary text-primary',\n        secondary: 'border-secondary text-secondary',\n        destructive: 'border-destructive bg-destructive text-destructive',\n        neutral: 'border-neutral text-neutral ',\n        light: 'border-white text-white',\n        dark: 'border-neutral-800 text-neutral-800',\n        text: 'border-text text-text',\n      },\n    },\n    defaultVariants: {\n      color: 'primary',\n    },\n  }\n);\n\nconst indicatorVariant = cva(\n  'absolute top-0 z-[-1] h-full w-auto rounded-lg transition-[left,width] duration-300 ease-in-out motion-reduce:transition-none',\n  {\n    variants: {\n      color: {\n        primary: 'bg-primary/10 aria-selected:text-text',\n        secondary: 'bg-secondary/10 aria-selected:text-text',\n        destructive: 'bg-destructive/10 aria-selected:text-text',\n        neutral: 'bg-neutral/10 aria-selected:text-white/10',\n        light: 'bg-white/10 aria-selected:text-black',\n        dark: 'bg-neutral-800/10 aria-selected:text-white',\n        text: 'bg-text/10 aria-selected:text-text-opposite',\n      },\n    },\n  }\n);\n\nexport type TabProps = HTMLAttributes<HTMLElement> & {\n  key: string | number;\n};\n\ntype TabSelectorProps<T extends TabProps> = {\n  tabs: ReactElement<T>[];\n  selectedChoice: T['key'];\n  onTabClick?: (choice: T['key']) => void;\n  hoverable?: boolean;\n} & HTMLAttributes<HTMLElement> &\n  VariantProps<typeof tabSelectorVariant>;\n\n/**\n *\n * Component that allows the user to select one of the provided choices.\n *\n * Example:\n * ```jsx\n * <TabSelector\n *   selectedChoice=\"option1\"\n *   onTabClick={(choice) => console.log(choice)}\n *   hoverable={true}\n * >\n *   <Button key=\"option1\"/>\n *   <Button key=\"option2\"/>\n *   <Button key=\"option3\"/>\n * </TabSelector>\n * ```\n */\nexport const TabSelector = <T extends TabProps>({\n  tabs,\n  selectedChoice,\n  onTabClick,\n  color = 'primary',\n  hoverable = false,\n  className,\n}: TabSelectorProps<T>) => {\n  const optionsRefs = useRef<HTMLElement[]>([]);\n  const indicatorRef = useRef<HTMLDivElement | null>(null);\n  const { choiceIndicatorPosition } = useItemSelector(\n    optionsRefs,\n    undefined,\n    hoverable\n  );\n\n  return (\n    <div\n      className={cn(\n        tabSelectorVariant({\n          color,\n        }),\n        className\n      )}\n      aria-orientation=\"horizontal\"\n      aria-multiselectable=\"false\"\n      role=\"tablist\"\n    >\n      {tabs.map((Tab, index) => {\n        const key = Tab.key!;\n\n        const isSelected = selectedChoice === key;\n\n        return cloneElement(Tab, {\n          key: key ?? index,\n          role: 'tab',\n          onClick: () => onTabClick?.(key),\n          'aria-selected': isSelected,\n          ref: (el: HTMLElement) => {\n            optionsRefs.current[index] = el!;\n          },\n        } as unknown as T);\n      })}\n      {choiceIndicatorPosition && (\n        <div\n          className={cn(\n            indicatorVariant({\n              color,\n            })\n          )}\n          style={choiceIndicatorPosition}\n          ref={indicatorRef}\n          key={`${selectedChoice}${JSON.stringify(tabs.map((tab) => tab.key))}`}\n        />\n      )}\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAYA,MAAM,qBAAqB;AAAA,EACzB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,OAAO;AAAA,QACL,SAAS;AAAA,QACT,WAAW;AAAA,QACX,aAAa;AAAA,QACb,SAAS;AAAA,QACT,OAAO;AAAA,QACP,MAAM;AAAA,QACN,MAAM;AAAA,MAAA;AAAA,IAEV;AAAA,IACA,iBAAiB;AAAA,MACf,OAAO;AAAA,IAAA;AAAA,EACT;AAEJ;AAEA,MAAM,mBAAmB;AAAA,EACvB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,OAAO;AAAA,QACL,SAAS;AAAA,QACT,WAAW;AAAA,QACX,aAAa;AAAA,QACb,SAAS;AAAA,QACT,OAAO;AAAA,QACP,MAAM;AAAA,QACN,MAAM;AAAA,MAAA;AAAA,IACR;AAAA,EACF;AAEJ;AA+BO,MAAM,cAAc,CAAqB;AAAA,EAC9C;AAAA,EACA;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR,YAAY;AAAA,EACZ;AACF,MAA2B;AACnB,QAAA,cAAc,OAAsB,EAAE;AACtC,QAAA,eAAe,OAA8B,IAAI;AACjD,QAAA,EAAE,4BAA4B;AAAA,IAClC;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAGE,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT,mBAAmB;AAAA,UACjB;AAAA,QAAA,CACD;AAAA,QACD;AAAA,MACF;AAAA,MACA,oBAAiB;AAAA,MACjB,wBAAqB;AAAA,MACrB,MAAK;AAAA,MAEJ,UAAA;AAAA,QAAK,KAAA,IAAI,CAAC,KAAK,UAAU;AACxB,gBAAM,MAAM,IAAI;AAEhB,gBAAM,aAAa,mBAAmB;AAEtC,iBAAO,aAAa,KAAK;AAAA,YACvB,KAAK,OAAO;AAAA,YACZ,MAAM;AAAA,YACN,SAAS,MAAM,aAAa,GAAG;AAAA,YAC/B,iBAAiB;AAAA,YACjB,KAAK,CAAC,OAAoB;AACZ,0BAAA,QAAQ,KAAK,IAAI;AAAA,YAAA;AAAA,UAC/B,CACe;AAAA,QAAA,CAClB;AAAA,QACA,2BACC;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW;AAAA,cACT,iBAAiB;AAAA,gBACf;AAAA,cACD,CAAA;AAAA,YACH;AAAA,YACA,OAAO;AAAA,YACP,KAAK;AAAA,UAAA;AAAA,UACA,GAAG,cAAc,GAAG,KAAK,UAAU,KAAK,IAAI,CAAC,QAAQ,IAAI,GAAG,CAAC,CAAC;AAAA,QAAA;AAAA,MACrE;AAAA,IAAA;AAAA,EAEJ;AAEJ;"}

package/dist/components/TextArea/AutocompleteTextArea.cjs

@@ -4,10 +4,11 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const editorReact = require("@intlayer/editor-react");
 const ReactExports = require("react");
+require("@intlayer/config/built");
+require("../../better-auth.8zoxzg-F-BEBqzpjz.cjs");
 const hooks_intlayerAPIHooks = require("../../hooks/intlayerAPIHooks.cjs");
 require("../../hooks/useAsync/useAsyncStateStore.cjs");
 require("@intlayer/api");
-require("@intlayer/config/built");
 require("deepmerge");
 require("../../hooks/useScrollBlockage/useScrollBlockageStore.cjs");
 const components_TextArea_AutoSizeTextArea = require("./AutoSizeTextArea.cjs");
@@ -66,9 +67,9 @@ const AutoCompleteTextarea = ({
           currentLine,
           contextAfter,
           aiOptions: {
-            apiKey: configuration.editor.openAiApiKey,
-            model: configuration.editor.openAiApiModel,
-            temperature: configuration.editor.openAiApiTemperature
+            apiKey: configuration.ai?.apiKey,
+            model: configuration.ai?.model,
+            temperature: configuration.ai?.temperature
           }
         });
         const autocompletion = response?.data?.autocompletion ?? "";

package/dist/components/TextArea/AutocompleteTextArea.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"AutocompleteTextArea.cjs","sources":["../../../src/components/TextArea/AutocompleteTextArea.tsx"],"sourcesContent":["'use client';\n\nimport { useConfiguration } from '@intlayer/editor-react';\nimport { type FC, useEffect, useRef, useState } from 'react';\nimport { useAutocomplete } from '../../hooks';\nimport {\n  type AutoSizedTextAreaProps,\n  AutoSizedTextArea,\n} from './AutoSizeTextArea';\n\nexport const useDebounce = <T,>(value: T, delay: number): T => {\n  const [debouncedValue, setDebouncedValue] = useState<T>(value);\n\n  useEffect(() => {\n    const timer = setTimeout(() => {\n      setDebouncedValue(value);\n    }, delay);\n\n    // Cleanup the timer if value changes before 'delay' ms\n    return () => clearTimeout(timer);\n  }, [value, delay]);\n\n  return debouncedValue;\n};\n\nexport type AutocompleteTextAreaProps = AutoSizedTextAreaProps & {\n  isActive?: boolean;\n  suggestion?: string;\n};\n\nexport const AutoCompleteTextarea: FC<AutocompleteTextAreaProps> = ({\n  isActive = true,\n  suggestion: suggestionProp,\n  ...props\n}) => {\n  const defaultValue = String(props.value ?? props.defaultValue ?? '');\n  const { autocomplete } = useAutocomplete();\n  const configuration = useConfiguration();\n  const [isTyped, setIsTyped] = useState(false);\n  const [text, setText] = useState(defaultValue);\n  const [suggestion, setSuggestion] = useState('');\n  const textareaRef = useRef<HTMLTextAreaElement>(null);\n  const placeholderRef = useRef<HTMLSpanElement>(null);\n  const ghostLayerRef = useRef<HTMLDivElement>(null);\n  const [suggestionPosition, setSuggestionPosition] = useState<{\n    left: number;\n    top: number;\n  } | null>(null);\n  const [cursorAtFetch, setCursorAtFetch] = useState(-1);\n\n  // Only update this “debouncedText” after the user stops typing for 200ms\n  const debouncedText = useDebounce(text, 200);\n\n  useEffect(() => {\n    if (typeof props.value === 'undefined') return;\n    setText(defaultValue);\n  }, [props.value, props.defaultValue]);\n\n  useEffect(() => {\n    if (!isActive) return;\n    if (!isTyped) return;\n\n    const fetchSuggestion = async () => {\n      try {\n        const cursor =\n          textareaRef.current?.selectionStart ?? debouncedText.length;\n        const before = debouncedText.slice(0, cursor);\n        const after = debouncedText.slice(cursor);\n        const numLines = 5;\n        const beforeLines = before.split('\\n');\n        const contextBeforeLines = beforeLines.slice(\n          Math.max(0, beforeLines.length - numLines - 1),\n          -1\n        );\n        const contextBefore = contextBeforeLines.join('\\n');\n        const currentLine = beforeLines[beforeLines.length - 1] ?? '';\n        const afterLines = after.split('\\n');\n        const contextAfter = afterLines.slice(1, numLines + 1).join('\\n');\n\n        const response = await autocomplete({\n          text: before,\n          contextBefore,\n          currentLine,\n          contextAfter,\n          aiOptions: {\n            apiKey: configuration.editor.openAiApiKey,\n            model: configuration.editor.openAiApiModel,\n            temperature: configuration.editor.openAiApiTemperature,\n          },\n        });\n        const autocompletion = response?.data?.autocompletion ?? '';\n\n        setSuggestion(autocompletion);\n        setCursorAtFetch(cursor);\n      } catch (err) {\n        console.error('Autocomplete error:', err);\n      }\n    };\n\n    if (debouncedText.length > 3) {\n      // Only fetch if user typed more than 3 chars and has paused\n      setSuggestion('');\n      fetchSuggestion();\n    } else {\n      // If typed less than threshold, clear the suggestion\n      setSuggestion('');\n    }\n  }, [debouncedText, isActive, autocomplete, configuration]);\n\n  useEffect(() => {\n    if (\n      !suggestion ||\n      cursorAtFetch === -1 ||\n      !placeholderRef.current ||\n      !ghostLayerRef.current\n    ) {\n      setSuggestionPosition(null);\n      return;\n    }\n\n    const rect = placeholderRef.current.getBoundingClientRect();\n    const parentRect = ghostLayerRef.current.getBoundingClientRect();\n    setSuggestionPosition({\n      left: rect.left - parentRect.left,\n      top: rect.top - parentRect.top,\n    });\n  }, [suggestion, cursorAtFetch, text]);\n\n  const acceptSuggestion = () => {\n    const currentCursor = textareaRef.current?.selectionStart ?? cursorAtFetch;\n    if (currentCursor !== cursorAtFetch) return;\n    const newText =\n      text.slice(0, currentCursor) + suggestion + text.slice(currentCursor);\n    setText(newText);\n    setSuggestion('');\n    setCursorAtFetch(-1);\n    setTimeout(() => {\n      textareaRef.current?.focus();\n      const newCursorPos = currentCursor + suggestion.length;\n      textareaRef.current?.setSelectionRange(newCursorPos, newCursorPos);\n    }, 0);\n  };\n\n  return (\n    <div className=\"relative w-full\">\n      <div\n        ref={ghostLayerRef}\n        className=\"pointer-events-none absolute inset-0 whitespace-pre-wrap break-words px-1 py-3 text-base leading-[1.45rem] md:py-1 md:text-sm md:leading-[1.23rem]\"\n        aria-hidden=\"true\"\n      >\n        {suggestion && cursorAtFetch !== -1 ? (\n          <>\n            <span className=\"align-text-top text-transparent\">\n              {text.slice(0, cursorAtFetch)}\n            </span>\n            <span\n              ref={placeholderRef}\n              style={{ visibility: 'hidden' }}\n              aria-hidden=\"true\"\n            >\n              {suggestion}\n            </span>\n            <span className=\"align-text-top text-transparent\">\n              {text.slice(cursorAtFetch)}\n            </span>\n          </>\n        ) : (\n          <span className=\"align-text-top text-transparent\">{text}</span>\n        )}\n        {suggestionProp && (\n          <span className=\"text-neutral align-text-top\">{suggestionProp}</span>\n        )}\n      </div>\n      {suggestion && suggestionPosition && (\n        <div\n          className=\"pointer-events-none text-neutral whitespace-pre-wrap break-words text-base leading-[1.45rem] md:text-sm md:leading-[1.23rem]\"\n          style={{\n            position: 'absolute',\n            left: suggestionPosition.left,\n            top: suggestionPosition.top,\n          }}\n        >\n          {suggestion}\n        </div>\n      )}\n      <AutoSizedTextArea\n        {...props}\n        ref={textareaRef}\n        value={text}\n        onChange={(e) => {\n          setIsTyped(true);\n          setText(e.target.value);\n          setSuggestion('');\n          props.onChange?.(e);\n        }}\n        onKeyDown={(e) => {\n          if (e.key === 'Tab' && suggestion) {\n            e.preventDefault();\n            acceptSuggestion();\n          }\n          props.onKeyDown?.(e);\n        }}\n        onSelect={(e) => {\n          if (\n            suggestion &&\n            (e.target as HTMLTextAreaElement).selectionStart !== cursorAtFetch\n          ) {\n            setSuggestion('');\n            setCursorAtFetch(-1);\n          }\n          props.onSelect?.(e);\n        }}\n      />\n    </div>\n  );\n};\n"],"names":["useState","useEffect","useAutocomplete","useConfiguration","useRef","jsxs","Fragment","jsx","AutoSizedTextArea"],"mappings":"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"}
+{"version":3,"file":"AutocompleteTextArea.cjs","sources":["../../../src/components/TextArea/AutocompleteTextArea.tsx"],"sourcesContent":["'use client';\n\nimport { useConfiguration } from '@intlayer/editor-react';\nimport { type FC, useEffect, useRef, useState } from 'react';\nimport { useAutocomplete } from '../../hooks';\nimport {\n  type AutoSizedTextAreaProps,\n  AutoSizedTextArea,\n} from './AutoSizeTextArea';\n\nexport const useDebounce = <T,>(value: T, delay: number): T => {\n  const [debouncedValue, setDebouncedValue] = useState<T>(value);\n\n  useEffect(() => {\n    const timer = setTimeout(() => {\n      setDebouncedValue(value);\n    }, delay);\n\n    // Cleanup the timer if value changes before 'delay' ms\n    return () => clearTimeout(timer);\n  }, [value, delay]);\n\n  return debouncedValue;\n};\n\nexport type AutocompleteTextAreaProps = AutoSizedTextAreaProps & {\n  isActive?: boolean;\n  suggestion?: string;\n};\n\nexport const AutoCompleteTextarea: FC<AutocompleteTextAreaProps> = ({\n  isActive = true,\n  suggestion: suggestionProp,\n  ...props\n}) => {\n  const defaultValue = String(props.value ?? props.defaultValue ?? '');\n  const { autocomplete } = useAutocomplete();\n  const configuration = useConfiguration();\n  const [isTyped, setIsTyped] = useState(false);\n  const [text, setText] = useState(defaultValue);\n  const [suggestion, setSuggestion] = useState('');\n  const textareaRef = useRef<HTMLTextAreaElement>(null);\n  const placeholderRef = useRef<HTMLSpanElement>(null);\n  const ghostLayerRef = useRef<HTMLDivElement>(null);\n  const [suggestionPosition, setSuggestionPosition] = useState<{\n    left: number;\n    top: number;\n  } | null>(null);\n  const [cursorAtFetch, setCursorAtFetch] = useState(-1);\n\n  // Only update this “debouncedText” after the user stops typing for 200ms\n  const debouncedText = useDebounce(text, 200);\n\n  useEffect(() => {\n    if (typeof props.value === 'undefined') return;\n    setText(defaultValue);\n  }, [props.value, props.defaultValue]);\n\n  useEffect(() => {\n    if (!isActive) return;\n    if (!isTyped) return;\n\n    const fetchSuggestion = async () => {\n      try {\n        const cursor =\n          textareaRef.current?.selectionStart ?? debouncedText.length;\n        const before = debouncedText.slice(0, cursor);\n        const after = debouncedText.slice(cursor);\n        const numLines = 5;\n        const beforeLines = before.split('\\n');\n        const contextBeforeLines = beforeLines.slice(\n          Math.max(0, beforeLines.length - numLines - 1),\n          -1\n        );\n        const contextBefore = contextBeforeLines.join('\\n');\n        const currentLine = beforeLines[beforeLines.length - 1] ?? '';\n        const afterLines = after.split('\\n');\n        const contextAfter = afterLines.slice(1, numLines + 1).join('\\n');\n\n        const response = await autocomplete({\n          text: before,\n          contextBefore,\n          currentLine,\n          contextAfter,\n          aiOptions: {\n            apiKey: configuration.ai?.apiKey,\n            model: configuration.ai?.model,\n            temperature: configuration.ai?.temperature,\n          },\n        });\n        const autocompletion = response?.data?.autocompletion ?? '';\n\n        setSuggestion(autocompletion);\n        setCursorAtFetch(cursor);\n      } catch (err) {\n        console.error('Autocomplete error:', err);\n      }\n    };\n\n    if (debouncedText.length > 3) {\n      // Only fetch if user typed more than 3 chars and has paused\n      setSuggestion('');\n      fetchSuggestion();\n    } else {\n      // If typed less than threshold, clear the suggestion\n      setSuggestion('');\n    }\n  }, [debouncedText, isActive, autocomplete, configuration]);\n\n  useEffect(() => {\n    if (\n      !suggestion ||\n      cursorAtFetch === -1 ||\n      !placeholderRef.current ||\n      !ghostLayerRef.current\n    ) {\n      setSuggestionPosition(null);\n      return;\n    }\n\n    const rect = placeholderRef.current.getBoundingClientRect();\n    const parentRect = ghostLayerRef.current.getBoundingClientRect();\n    setSuggestionPosition({\n      left: rect.left - parentRect.left,\n      top: rect.top - parentRect.top,\n    });\n  }, [suggestion, cursorAtFetch, text]);\n\n  const acceptSuggestion = () => {\n    const currentCursor = textareaRef.current?.selectionStart ?? cursorAtFetch;\n    if (currentCursor !== cursorAtFetch) return;\n    const newText =\n      text.slice(0, currentCursor) + suggestion + text.slice(currentCursor);\n    setText(newText);\n    setSuggestion('');\n    setCursorAtFetch(-1);\n    setTimeout(() => {\n      textareaRef.current?.focus();\n      const newCursorPos = currentCursor + suggestion.length;\n      textareaRef.current?.setSelectionRange(newCursorPos, newCursorPos);\n    }, 0);\n  };\n\n  return (\n    <div className=\"relative w-full\">\n      <div\n        ref={ghostLayerRef}\n        className=\"pointer-events-none absolute inset-0 whitespace-pre-wrap break-words px-1 py-3 text-base leading-[1.45rem] md:py-1 md:text-sm md:leading-[1.23rem]\"\n        aria-hidden=\"true\"\n      >\n        {suggestion && cursorAtFetch !== -1 ? (\n          <>\n            <span className=\"align-text-top text-transparent\">\n              {text.slice(0, cursorAtFetch)}\n            </span>\n            <span\n              ref={placeholderRef}\n              style={{ visibility: 'hidden' }}\n              aria-hidden=\"true\"\n            >\n              {suggestion}\n            </span>\n            <span className=\"align-text-top text-transparent\">\n              {text.slice(cursorAtFetch)}\n            </span>\n          </>\n        ) : (\n          <span className=\"align-text-top text-transparent\">{text}</span>\n        )}\n        {suggestionProp && (\n          <span className=\"text-neutral align-text-top\">{suggestionProp}</span>\n        )}\n      </div>\n      {suggestion && suggestionPosition && (\n        <div\n          className=\"pointer-events-none text-neutral whitespace-pre-wrap break-words text-base leading-[1.45rem] md:text-sm md:leading-[1.23rem]\"\n          style={{\n            position: 'absolute',\n            left: suggestionPosition.left,\n            top: suggestionPosition.top,\n          }}\n        >\n          {suggestion}\n        </div>\n      )}\n      <AutoSizedTextArea\n        {...props}\n        ref={textareaRef}\n        value={text}\n        onChange={(e) => {\n          setIsTyped(true);\n          setText(e.target.value);\n          setSuggestion('');\n          props.onChange?.(e);\n        }}\n        onKeyDown={(e) => {\n          if (e.key === 'Tab' && suggestion) {\n            e.preventDefault();\n            acceptSuggestion();\n          }\n          props.onKeyDown?.(e);\n        }}\n        onSelect={(e) => {\n          if (\n            suggestion &&\n            (e.target as HTMLTextAreaElement).selectionStart !== cursorAtFetch\n          ) {\n            setSuggestion('');\n            setCursorAtFetch(-1);\n          }\n          props.onSelect?.(e);\n        }}\n      />\n    </div>\n  );\n};\n"],"names":["useState","useEffect","useAutocomplete","useConfiguration","useRef","jsxs","Fragment","jsx","AutoSizedTextArea"],"mappings":"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"}

package/dist/components/TextArea/AutocompleteTextArea.mjs

@@ -2,10 +2,11 @@
 import { jsxs, jsx, Fragment } from "react/jsx-runtime";
 import { useConfiguration } from "@intlayer/editor-react";
 import { useState, useEffect, useRef } from "react";
+import "@intlayer/config/built";
+import "../../better-auth.8zoxzg-F-D8e0X4ys.js";
 import { useAutocomplete } from "../../hooks/intlayerAPIHooks.mjs";
 import "../../hooks/useAsync/useAsyncStateStore.mjs";
 import "@intlayer/api";
-import "@intlayer/config/built";
 import "deepmerge";
 import "../../hooks/useScrollBlockage/useScrollBlockageStore.mjs";
 import { AutoSizedTextArea } from "./AutoSizeTextArea.mjs";
@@ -64,9 +65,9 @@ const AutoCompleteTextarea = ({
           currentLine,
           contextAfter,
           aiOptions: {
-            apiKey: configuration.editor.openAiApiKey,
-            model: configuration.editor.openAiApiModel,
-            temperature: configuration.editor.openAiApiTemperature
+            apiKey: configuration.ai?.apiKey,
+            model: configuration.ai?.model,
+            temperature: configuration.ai?.temperature
           }
         });
         const autocompletion = response?.data?.autocompletion ?? "";

package/dist/components/TextArea/AutocompleteTextArea.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"AutocompleteTextArea.mjs","sources":["../../../src/components/TextArea/AutocompleteTextArea.tsx"],"sourcesContent":["'use client';\n\nimport { useConfiguration } from '@intlayer/editor-react';\nimport { type FC, useEffect, useRef, useState } from 'react';\nimport { useAutocomplete } from '../../hooks';\nimport {\n  type AutoSizedTextAreaProps,\n  AutoSizedTextArea,\n} from './AutoSizeTextArea';\n\nexport const useDebounce = <T,>(value: T, delay: number): T => {\n  const [debouncedValue, setDebouncedValue] = useState<T>(value);\n\n  useEffect(() => {\n    const timer = setTimeout(() => {\n      setDebouncedValue(value);\n    }, delay);\n\n    // Cleanup the timer if value changes before 'delay' ms\n    return () => clearTimeout(timer);\n  }, [value, delay]);\n\n  return debouncedValue;\n};\n\nexport type AutocompleteTextAreaProps = AutoSizedTextAreaProps & {\n  isActive?: boolean;\n  suggestion?: string;\n};\n\nexport const AutoCompleteTextarea: FC<AutocompleteTextAreaProps> = ({\n  isActive = true,\n  suggestion: suggestionProp,\n  ...props\n}) => {\n  const defaultValue = String(props.value ?? props.defaultValue ?? '');\n  const { autocomplete } = useAutocomplete();\n  const configuration = useConfiguration();\n  const [isTyped, setIsTyped] = useState(false);\n  const [text, setText] = useState(defaultValue);\n  const [suggestion, setSuggestion] = useState('');\n  const textareaRef = useRef<HTMLTextAreaElement>(null);\n  const placeholderRef = useRef<HTMLSpanElement>(null);\n  const ghostLayerRef = useRef<HTMLDivElement>(null);\n  const [suggestionPosition, setSuggestionPosition] = useState<{\n    left: number;\n    top: number;\n  } | null>(null);\n  const [cursorAtFetch, setCursorAtFetch] = useState(-1);\n\n  // Only update this “debouncedText” after the user stops typing for 200ms\n  const debouncedText = useDebounce(text, 200);\n\n  useEffect(() => {\n    if (typeof props.value === 'undefined') return;\n    setText(defaultValue);\n  }, [props.value, props.defaultValue]);\n\n  useEffect(() => {\n    if (!isActive) return;\n    if (!isTyped) return;\n\n    const fetchSuggestion = async () => {\n      try {\n        const cursor =\n          textareaRef.current?.selectionStart ?? debouncedText.length;\n        const before = debouncedText.slice(0, cursor);\n        const after = debouncedText.slice(cursor);\n        const numLines = 5;\n        const beforeLines = before.split('\\n');\n        const contextBeforeLines = beforeLines.slice(\n          Math.max(0, beforeLines.length - numLines - 1),\n          -1\n        );\n        const contextBefore = contextBeforeLines.join('\\n');\n        const currentLine = beforeLines[beforeLines.length - 1] ?? '';\n        const afterLines = after.split('\\n');\n        const contextAfter = afterLines.slice(1, numLines + 1).join('\\n');\n\n        const response = await autocomplete({\n          text: before,\n          contextBefore,\n          currentLine,\n          contextAfter,\n          aiOptions: {\n            apiKey: configuration.editor.openAiApiKey,\n            model: configuration.editor.openAiApiModel,\n            temperature: configuration.editor.openAiApiTemperature,\n          },\n        });\n        const autocompletion = response?.data?.autocompletion ?? '';\n\n        setSuggestion(autocompletion);\n        setCursorAtFetch(cursor);\n      } catch (err) {\n        console.error('Autocomplete error:', err);\n      }\n    };\n\n    if (debouncedText.length > 3) {\n      // Only fetch if user typed more than 3 chars and has paused\n      setSuggestion('');\n      fetchSuggestion();\n    } else {\n      // If typed less than threshold, clear the suggestion\n      setSuggestion('');\n    }\n  }, [debouncedText, isActive, autocomplete, configuration]);\n\n  useEffect(() => {\n    if (\n      !suggestion ||\n      cursorAtFetch === -1 ||\n      !placeholderRef.current ||\n      !ghostLayerRef.current\n    ) {\n      setSuggestionPosition(null);\n      return;\n    }\n\n    const rect = placeholderRef.current.getBoundingClientRect();\n    const parentRect = ghostLayerRef.current.getBoundingClientRect();\n    setSuggestionPosition({\n      left: rect.left - parentRect.left,\n      top: rect.top - parentRect.top,\n    });\n  }, [suggestion, cursorAtFetch, text]);\n\n  const acceptSuggestion = () => {\n    const currentCursor = textareaRef.current?.selectionStart ?? cursorAtFetch;\n    if (currentCursor !== cursorAtFetch) return;\n    const newText =\n      text.slice(0, currentCursor) + suggestion + text.slice(currentCursor);\n    setText(newText);\n    setSuggestion('');\n    setCursorAtFetch(-1);\n    setTimeout(() => {\n      textareaRef.current?.focus();\n      const newCursorPos = currentCursor + suggestion.length;\n      textareaRef.current?.setSelectionRange(newCursorPos, newCursorPos);\n    }, 0);\n  };\n\n  return (\n    <div className=\"relative w-full\">\n      <div\n        ref={ghostLayerRef}\n        className=\"pointer-events-none absolute inset-0 whitespace-pre-wrap break-words px-1 py-3 text-base leading-[1.45rem] md:py-1 md:text-sm md:leading-[1.23rem]\"\n        aria-hidden=\"true\"\n      >\n        {suggestion && cursorAtFetch !== -1 ? (\n          <>\n            <span className=\"align-text-top text-transparent\">\n              {text.slice(0, cursorAtFetch)}\n            </span>\n            <span\n              ref={placeholderRef}\n              style={{ visibility: 'hidden' }}\n              aria-hidden=\"true\"\n            >\n              {suggestion}\n            </span>\n            <span className=\"align-text-top text-transparent\">\n              {text.slice(cursorAtFetch)}\n            </span>\n          </>\n        ) : (\n          <span className=\"align-text-top text-transparent\">{text}</span>\n        )}\n        {suggestionProp && (\n          <span className=\"text-neutral align-text-top\">{suggestionProp}</span>\n        )}\n      </div>\n      {suggestion && suggestionPosition && (\n        <div\n          className=\"pointer-events-none text-neutral whitespace-pre-wrap break-words text-base leading-[1.45rem] md:text-sm md:leading-[1.23rem]\"\n          style={{\n            position: 'absolute',\n            left: suggestionPosition.left,\n            top: suggestionPosition.top,\n          }}\n        >\n          {suggestion}\n        </div>\n      )}\n      <AutoSizedTextArea\n        {...props}\n        ref={textareaRef}\n        value={text}\n        onChange={(e) => {\n          setIsTyped(true);\n          setText(e.target.value);\n          setSuggestion('');\n          props.onChange?.(e);\n        }}\n        onKeyDown={(e) => {\n          if (e.key === 'Tab' && suggestion) {\n            e.preventDefault();\n            acceptSuggestion();\n          }\n          props.onKeyDown?.(e);\n        }}\n        onSelect={(e) => {\n          if (\n            suggestion &&\n            (e.target as HTMLTextAreaElement).selectionStart !== cursorAtFetch\n          ) {\n            setSuggestion('');\n            setCursorAtFetch(-1);\n          }\n          props.onSelect?.(e);\n        }}\n      />\n    </div>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"AutocompleteTextArea.mjs","sources":["../../../src/components/TextArea/AutocompleteTextArea.tsx"],"sourcesContent":["'use client';\n\nimport { useConfiguration } from '@intlayer/editor-react';\nimport { type FC, useEffect, useRef, useState } from 'react';\nimport { useAutocomplete } from '../../hooks';\nimport {\n  type AutoSizedTextAreaProps,\n  AutoSizedTextArea,\n} from './AutoSizeTextArea';\n\nexport const useDebounce = <T,>(value: T, delay: number): T => {\n  const [debouncedValue, setDebouncedValue] = useState<T>(value);\n\n  useEffect(() => {\n    const timer = setTimeout(() => {\n      setDebouncedValue(value);\n    }, delay);\n\n    // Cleanup the timer if value changes before 'delay' ms\n    return () => clearTimeout(timer);\n  }, [value, delay]);\n\n  return debouncedValue;\n};\n\nexport type AutocompleteTextAreaProps = AutoSizedTextAreaProps & {\n  isActive?: boolean;\n  suggestion?: string;\n};\n\nexport const AutoCompleteTextarea: FC<AutocompleteTextAreaProps> = ({\n  isActive = true,\n  suggestion: suggestionProp,\n  ...props\n}) => {\n  const defaultValue = String(props.value ?? props.defaultValue ?? '');\n  const { autocomplete } = useAutocomplete();\n  const configuration = useConfiguration();\n  const [isTyped, setIsTyped] = useState(false);\n  const [text, setText] = useState(defaultValue);\n  const [suggestion, setSuggestion] = useState('');\n  const textareaRef = useRef<HTMLTextAreaElement>(null);\n  const placeholderRef = useRef<HTMLSpanElement>(null);\n  const ghostLayerRef = useRef<HTMLDivElement>(null);\n  const [suggestionPosition, setSuggestionPosition] = useState<{\n    left: number;\n    top: number;\n  } | null>(null);\n  const [cursorAtFetch, setCursorAtFetch] = useState(-1);\n\n  // Only update this “debouncedText” after the user stops typing for 200ms\n  const debouncedText = useDebounce(text, 200);\n\n  useEffect(() => {\n    if (typeof props.value === 'undefined') return;\n    setText(defaultValue);\n  }, [props.value, props.defaultValue]);\n\n  useEffect(() => {\n    if (!isActive) return;\n    if (!isTyped) return;\n\n    const fetchSuggestion = async () => {\n      try {\n        const cursor =\n          textareaRef.current?.selectionStart ?? debouncedText.length;\n        const before = debouncedText.slice(0, cursor);\n        const after = debouncedText.slice(cursor);\n        const numLines = 5;\n        const beforeLines = before.split('\\n');\n        const contextBeforeLines = beforeLines.slice(\n          Math.max(0, beforeLines.length - numLines - 1),\n          -1\n        );\n        const contextBefore = contextBeforeLines.join('\\n');\n        const currentLine = beforeLines[beforeLines.length - 1] ?? '';\n        const afterLines = after.split('\\n');\n        const contextAfter = afterLines.slice(1, numLines + 1).join('\\n');\n\n        const response = await autocomplete({\n          text: before,\n          contextBefore,\n          currentLine,\n          contextAfter,\n          aiOptions: {\n            apiKey: configuration.ai?.apiKey,\n            model: configuration.ai?.model,\n            temperature: configuration.ai?.temperature,\n          },\n        });\n        const autocompletion = response?.data?.autocompletion ?? '';\n\n        setSuggestion(autocompletion);\n        setCursorAtFetch(cursor);\n      } catch (err) {\n        console.error('Autocomplete error:', err);\n      }\n    };\n\n    if (debouncedText.length > 3) {\n      // Only fetch if user typed more than 3 chars and has paused\n      setSuggestion('');\n      fetchSuggestion();\n    } else {\n      // If typed less than threshold, clear the suggestion\n      setSuggestion('');\n    }\n  }, [debouncedText, isActive, autocomplete, configuration]);\n\n  useEffect(() => {\n    if (\n      !suggestion ||\n      cursorAtFetch === -1 ||\n      !placeholderRef.current ||\n      !ghostLayerRef.current\n    ) {\n      setSuggestionPosition(null);\n      return;\n    }\n\n    const rect = placeholderRef.current.getBoundingClientRect();\n    const parentRect = ghostLayerRef.current.getBoundingClientRect();\n    setSuggestionPosition({\n      left: rect.left - parentRect.left,\n      top: rect.top - parentRect.top,\n    });\n  }, [suggestion, cursorAtFetch, text]);\n\n  const acceptSuggestion = () => {\n    const currentCursor = textareaRef.current?.selectionStart ?? cursorAtFetch;\n    if (currentCursor !== cursorAtFetch) return;\n    const newText =\n      text.slice(0, currentCursor) + suggestion + text.slice(currentCursor);\n    setText(newText);\n    setSuggestion('');\n    setCursorAtFetch(-1);\n    setTimeout(() => {\n      textareaRef.current?.focus();\n      const newCursorPos = currentCursor + suggestion.length;\n      textareaRef.current?.setSelectionRange(newCursorPos, newCursorPos);\n    }, 0);\n  };\n\n  return (\n    <div className=\"relative w-full\">\n      <div\n        ref={ghostLayerRef}\n        className=\"pointer-events-none absolute inset-0 whitespace-pre-wrap break-words px-1 py-3 text-base leading-[1.45rem] md:py-1 md:text-sm md:leading-[1.23rem]\"\n        aria-hidden=\"true\"\n      >\n        {suggestion && cursorAtFetch !== -1 ? (\n          <>\n            <span className=\"align-text-top text-transparent\">\n              {text.slice(0, cursorAtFetch)}\n            </span>\n            <span\n              ref={placeholderRef}\n              style={{ visibility: 'hidden' }}\n              aria-hidden=\"true\"\n            >\n              {suggestion}\n            </span>\n            <span className=\"align-text-top text-transparent\">\n              {text.slice(cursorAtFetch)}\n            </span>\n          </>\n        ) : (\n          <span className=\"align-text-top text-transparent\">{text}</span>\n        )}\n        {suggestionProp && (\n          <span className=\"text-neutral align-text-top\">{suggestionProp}</span>\n        )}\n      </div>\n      {suggestion && suggestionPosition && (\n        <div\n          className=\"pointer-events-none text-neutral whitespace-pre-wrap break-words text-base leading-[1.45rem] md:text-sm md:leading-[1.23rem]\"\n          style={{\n            position: 'absolute',\n            left: suggestionPosition.left,\n            top: suggestionPosition.top,\n          }}\n        >\n          {suggestion}\n        </div>\n      )}\n      <AutoSizedTextArea\n        {...props}\n        ref={textareaRef}\n        value={text}\n        onChange={(e) => {\n          setIsTyped(true);\n          setText(e.target.value);\n          setSuggestion('');\n          props.onChange?.(e);\n        }}\n        onKeyDown={(e) => {\n          if (e.key === 'Tab' && suggestion) {\n            e.preventDefault();\n            acceptSuggestion();\n          }\n          props.onKeyDown?.(e);\n        }}\n        onSelect={(e) => {\n          if (\n            suggestion &&\n            (e.target as HTMLTextAreaElement).selectionStart !== cursorAtFetch\n          ) {\n            setSuggestion('');\n            setCursorAtFetch(-1);\n          }\n          props.onSelect?.(e);\n        }}\n      />\n    </div>\n  );\n};\n"],"names":[],"mappings":"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"}