@blueshift-gg/ui-components 0.1.70 → 0.1.72

package/dist/Input.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Input.cjs","names":["motion","Tooltip","Icon","CrosshairCorners","Badge","Button","AnimatePresence","crisp"],"sources":["../src/Input.tsx"],"sourcesContent":["\"use client\";\nimport { AnimatePresence, motion, MotionProps } from \"motion/react\";\nimport { Icon, IconName, IconProps } from \"./Icon\";\nimport classNames from \"classnames\";\nimport { Badge, BadgeProps } from \"./Badge\";\nimport { Button } from \"./Button\";\nimport { crisp } from \"./utils/easings\";\nimport { CrosshairCorners } from \"./CrossHair\";\nimport { Tooltip, TooltipProps } from \"./Tooltip\";\nimport { useState } from \"react\";\n\nexport type InputProps = {\n  title?: string;\n  value: string;\n  className?: string;\n  innerClassname?: string;\n  onChange?: (value: string) => void;\n  onFocus?: () => void;\n  onBlur?: () => void;\n  onClear?: () => void;\n  badge?: BadgeProps;\n  message?: string;\n  hasMessage?: boolean;\n  disabled?: boolean;\n  placeholder?: string;\n  isValid?: boolean;\n  type?: \"generic\" | \"value\";\n  balance?: {\n    amount: string;\n    unit: string;\n    icon?: IconName;\n  };\n  action?: {\n    label: string;\n    onClick: () => void;\n  };\n  animation?: MotionProps;\n  tooltip?: TooltipProps;\n  children?: React.ReactNode;\n};\n\nexport const Input = ({\n  title,\n  value,\n  className,\n  onChange,\n  onFocus,\n  onBlur,\n  onClear,\n  badge,\n  type,\n  message,\n  hasMessage = true,\n  disabled,\n  placeholder,\n  isValid = true,\n  balance,\n  action,\n  animation,\n  tooltip,\n  children,\n  innerClassname,\n}: InputProps) => {\n  const [isTooltipOpen, setIsTooltipOpen] = useState(false);\n  return (\n    <motion.div\n      {...animation}\n      className={classNames(\n        \"flex flex-col gap-y-2.5 w-full relative group/input\",\n        className\n      )}\n    >\n      {title && (\n        <div className=\"px-1 flex items-center justify-between w-full\">\n          <div className=\"flex items-center gap-x-1.5\">\n            <span className=\"font-medium text-shade-primary leading-[100%]\">\n              {title}\n            </span>\n            {tooltip && (\n              <div\n                className=\"h-[14px] w-[14px] relative\"\n                onMouseEnter={() => setIsTooltipOpen(true)}\n                onMouseLeave={() => setIsTooltipOpen(false)}\n              >\n                <Tooltip\n                  isOpen={isTooltipOpen}\n                  position={tooltip.position}\n                  description={tooltip.description}\n                />\n                <Icon name=\"Info\" size={14} className=\"text-shade-tertiary\" />\n              </div>\n            )}\n          </div>\n          {balance && (\n            <div className=\"flex items-center gap-x-1.5\">\n              <Icon\n                name={balance.icon as IconName}\n                size={12}\n                className=\"text-shade-tertiary\"\n              />\n              <span className=\"font-medium text-shade-primary leading-[100%] text-sm font-mono\">\n                {balance.amount} {balance.unit}\n              </span>\n            </div>\n          )}\n        </div>\n      )}\n      <div\n        className={classNames(\n          \"min-h-[44px] pr-4 relative h-full py-1.5 flex items-center justify-between group/input bg-background border text-shade-tertiary border-border enabled:focus-within:border-current/20 enabled:focus-within:bg-current/2 enabled:focus-within:shadow-[inset_0px_0px_12px] enabled:focus-within:shadow-current/10 transition-colors duration-100 ease-crisp\",\n          !isValid && \"border-state-error/20 text-state-error\",\n          !!badge && \"pl-1.5 pr-[10px]\",\n          !badge && \"pl-3 pr-4\",\n          !!children && \"!pr-1.5\",\n          innerClassname\n        )}\n      >\n        {onFocus && (\n          <div className=\"pointer-events-none absolute inset-1.5 text-shade-mute enabled:group-hover/input:text-shade-primary enabled:group-focus-within/input:inset-0.5 enabled:group-focus-within/input:text-shade-primary transition-all duration-50 ease-glide\">\n            <CrosshairCorners\n              size={6}\n              variant=\"corners\"\n              corners={[\"bottom-right\"]}\n              animationDelay={0}\n              animationDuration={0.75}\n            />\n          </div>\n        )}\n        <div\n          className={classNames(\n            \"flex w-full items-center gap-x-3 text-shade-primary\"\n          )}\n        >\n          {badge && <Badge {...badge} />}\n          <input\n            className={classNames(\n              \"h-full w-full flex-shrink font-medium focus:outline-none bg-transparent placeholder:text-shade-mute\",\n              type === \"value\" && \"text-2xl font-mono text-right\",\n              // Hide buttons\n              \"[-moz-appearance:_textfield] [&::-webkit-inner-spin-button]:m-0 [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:m-0 [&::-webkit-outer-spin-button]:appearance-none\"\n            )}\n            onFocus={onFocus}\n            onBlur={onBlur}\n            placeholder={placeholder}\n            value={value}\n            onChange={(e) => onChange?.(e.target.value)}\n            disabled={disabled}\n            type={type === \"value\" ? \"number\" : \"text\"}\n          />\n          {onClear && value && (\n            <button\n              onClick={onClear}\n              className=\"absolute right-2 p-2 hover:bg-border-light/50 transition-colors duration-100 ease-crisp\"\n              type=\"button\"\n            >\n              <Icon\n                name=\"Close\"\n                size={12}\n                className=\"text-shade-tertiary hover:text-shade-primary transition-colors duration-100 ease-crisp\"\n              />\n            </button>\n          )}\n          {children && children}\n          {action && (\n            <Button\n              label={action.label}\n              onClick={action.onClick}\n              variant=\"secondary\"\n              size=\"xs\"\n              useHoverEffect={false}\n            />\n          )}\n        </div>\n      </div>\n      {hasMessage && (\n        <div className=\"h-[14px] ml-auto px-1\">\n          <AnimatePresence>\n            {message && (\n              <motion.span\n                initial={{ opacity: 0, filter: \"blur(4px)\" }}\n                animate={{ opacity: 1, filter: \"blur(0px)\" }}\n                exit={{ opacity: 0, filter: \"blur(4px)\" }}\n                transition={{ duration: 0.1, ease: crisp }}\n                className={classNames(\n                  \"text-sm text-shade-secondary font-medium leading-[100%]\",\n                  !isValid && \"text-state-error\"\n                )}\n              >\n                {message}\n              </motion.span>\n            )}\n          </AnimatePresence>\n        </div>\n      )}\n    </motion.div>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;AAyCA,MAAa,SAAS,EACpB,OACA,OACA,WACA,UACA,SACA,QACA,SACA,OACA,MACA,SACA,aAAa,MACb,UACA,aACA,UAAU,MACV,SACA,QACA,WACA,SACA,UACA,qBACgB;CAChB,MAAM,CAAC,eAAe,wCAA6B,MAAM;AACzD,QACE,4CAACA,oBAAO;EACN,GAAI;EACJ,mCACE,uDACA,UACD;;GAEA,SACC,4CAAC;IAAI,WAAU;eACb,4CAAC;KAAI,WAAU;gBACb,2CAAC;MAAK,WAAU;gBACb;OACI,EACN,WACC,4CAAC;MACC,WAAU;MACV,oBAAoB,iBAAiB,KAAK;MAC1C,oBAAoB,iBAAiB,MAAM;iBAE3C,2CAACC;OACC,QAAQ;OACR,UAAU,QAAQ;OAClB,aAAa,QAAQ;QACrB,EACF,2CAACC;OAAK,MAAK;OAAO,MAAM;OAAI,WAAU;QAAwB;OAC1D;MAEJ,EACL,WACC,4CAAC;KAAI,WAAU;gBACb,2CAACA;MACC,MAAM,QAAQ;MACd,MAAM;MACN,WAAU;OACV,EACF,4CAAC;MAAK,WAAU;;OACb,QAAQ;OAAO;OAAE,QAAQ;;OACrB;MACH;KAEJ;GAER,4CAAC;IACC,mCACE,4VACA,CAAC,WAAW,0CACZ,CAAC,CAAC,SAAS,oBACX,CAAC,SAAS,aACV,CAAC,CAAC,YAAY,WACd,eACD;eAEA,WACC,2CAAC;KAAI,WAAU;eACb,2CAACC;MACC,MAAM;MACN,SAAQ;MACR,SAAS,CAAC,eAAe;MACzB,gBAAgB;MAChB,mBAAmB;OACnB;MACE,EAER,4CAAC;KACC,mCACE,sDACD;;MAEA,SAAS,2CAACC,uBAAM,GAAI,QAAS;MAC9B,2CAAC;OACC,mCACE,uGACA,SAAS,WAAW,iCAEpB,mMACD;OACQ;OACD;OACK;OACN;OACP,WAAW,MAAM,WAAW,EAAE,OAAO,MAAM;OACjC;OACV,MAAM,SAAS,UAAU,WAAW;QACpC;MACD,WAAW,SACV,2CAAC;OACC,SAAS;OACT,WAAU;OACV,MAAK;iBAEL,2CAACF;QACC,MAAK;QACL,MAAM;QACN,WAAU;SACV;QACK;MAEV,YAAY;MACZ,UACC,2CAACG;OACC,OAAO,OAAO;OACd,SAAS,OAAO;OAChB,SAAQ;OACR,MAAK;OACL,gBAAgB;QAChB;;MAEA;KACF;GACL,cACC,2CAAC;IAAI,WAAU;cACb,2CAACC,0CACE,WACC,2CAACN,oBAAO;KACN,SAAS;MAAE,SAAS;MAAG,QAAQ;MAAa;KAC5C,SAAS;MAAE,SAAS;MAAG,QAAQ;MAAa;KAC5C,MAAM;MAAE,SAAS;MAAG,QAAQ;MAAa;KACzC,YAAY;MAAE,UAAU;MAAK,MAAMO;MAAO;KAC1C,mCACE,2DACA,CAAC,WAAW,mBACb;eAEA;MACW,GAEA;KACd;;GAEG"}
+{"version":3,"file":"Input.cjs","names":["motion","Tooltip","Icon","CrosshairCorners","Badge","Button","AnimatePresence","crisp"],"sources":["../src/Input.tsx"],"sourcesContent":["\"use client\";\nimport { AnimatePresence, motion, MotionProps } from \"motion/react\";\nimport { Icon, IconName, IconProps } from \"./Icon\";\nimport classNames from \"classnames\";\nimport { Badge, BadgeProps } from \"./Badge\";\nimport { Button } from \"./Button\";\nimport { crisp } from \"./utils/easings\";\nimport { CrosshairCorners } from \"./CrossHair\";\nimport { Tooltip, TooltipProps } from \"./Tooltip\";\nimport { useState } from \"react\";\n\nexport type InputProps = {\n  title?: string;\n  value: string;\n  className?: string;\n  innerClassname?: string;\n  onChange?: (value: string) => void;\n  onFocus?: () => void;\n  onBlur?: () => void;\n  onClear?: () => void;\n  badge?: BadgeProps;\n  message?: string;\n  hasMessage?: boolean;\n  disabled?: boolean;\n  placeholder?: string;\n  isValid?: boolean;\n  type?: \"generic\" | \"value\";\n  balance?: {\n    amount: string;\n    unit: string;\n    icon?: IconName;\n  };\n  action?: {\n    label: string;\n    onClick: () => void;\n  };\n  animation?: MotionProps;\n  tooltip?: TooltipProps;\n  children?: React.ReactNode;\n  inputClassName?: string;\n};\n\nexport const Input = ({\n  title,\n  value,\n  className,\n  onChange,\n  onFocus,\n  onBlur,\n  onClear,\n  badge,\n  type,\n  message,\n  hasMessage = true,\n  disabled,\n  placeholder,\n  isValid = true,\n  balance,\n  action,\n  animation,\n  tooltip,\n  children,\n  innerClassname,\n  inputClassName,\n}: InputProps) => {\n  const [isTooltipOpen, setIsTooltipOpen] = useState(false);\n  return (\n    <motion.div\n      {...animation}\n      className={classNames(\n        \"flex flex-col gap-y-2.5 w-full relative group/input\",\n        className\n      )}\n    >\n      {title && (\n        <div className=\"px-1 flex items-center justify-between w-full\">\n          <div className=\"flex items-center gap-x-1.5\">\n            <span className=\"font-medium text-shade-primary leading-[100%]\">\n              {title}\n            </span>\n            {tooltip && (\n              <div\n                className=\"h-[14px] w-[14px] relative\"\n                onMouseEnter={() => setIsTooltipOpen(true)}\n                onMouseLeave={() => setIsTooltipOpen(false)}\n              >\n                <Tooltip\n                  isOpen={isTooltipOpen}\n                  position={tooltip.position}\n                  description={tooltip.description}\n                />\n                <Icon name=\"Info\" size={14} className=\"text-shade-tertiary\" />\n              </div>\n            )}\n          </div>\n          {balance && (\n            <div className=\"flex items-center gap-x-1.5\">\n              <Icon\n                name={balance.icon as IconName}\n                size={12}\n                className=\"text-shade-tertiary\"\n              />\n              <span className=\"font-medium text-shade-primary leading-[100%] text-sm font-mono\">\n                {balance.amount} {balance.unit}\n              </span>\n            </div>\n          )}\n        </div>\n      )}\n      <div\n        className={classNames(\n          \"min-h-[44px] pr-4 relative h-full py-1.5 flex items-center justify-between group/input bg-background border text-shade-tertiary border-border enabled:focus-within:border-current/20 enabled:focus-within:bg-current/2 enabled:focus-within:shadow-[inset_0px_0px_12px] enabled:focus-within:shadow-current/10 transition-colors duration-100 ease-crisp\",\n          !isValid && \"border-state-error/20 text-state-error\",\n          !!badge && \"pl-1.5 pr-[10px]\",\n          !badge && \"pl-3 pr-4\",\n          !!children && \"!pr-1.5\",\n          innerClassname\n        )}\n      >\n        {onFocus && (\n          <div className=\"pointer-events-none absolute inset-1.5 text-shade-mute enabled:group-hover/input:text-shade-primary enabled:group-focus-within/input:inset-0.5 enabled:group-focus-within/input:text-shade-primary transition-all duration-50 ease-glide\">\n            <CrosshairCorners\n              size={6}\n              variant=\"corners\"\n              corners={[\"bottom-right\"]}\n              animationDelay={0}\n              animationDuration={0.75}\n            />\n          </div>\n        )}\n        <div\n          className={classNames(\n            \"flex w-full items-center gap-x-3 text-shade-primary\"\n          )}\n        >\n          {badge && <Badge {...badge} />}\n          <input\n            className={classNames(\n              \"h-full w-full flex-shrink font-medium focus:outline-none bg-transparent placeholder:text-shade-mute\",\n              type === \"value\" && \"text-2xl font-mono text-right\",\n              // Hide buttons\n              \"[-moz-appearance:_textfield] [&::-webkit-inner-spin-button]:m-0 [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:m-0 [&::-webkit-outer-spin-button]:appearance-none\",\n              inputClassName\n            )}\n            onFocus={onFocus}\n            onBlur={onBlur}\n            placeholder={placeholder}\n            value={value}\n            onChange={(e) => onChange?.(e.target.value)}\n            disabled={disabled}\n            type={type === \"value\" ? \"number\" : \"text\"}\n          />\n          {onClear && value && (\n            <button\n              onClick={onClear}\n              className=\"absolute right-2 p-2 hover:bg-border-light/50 transition-colors duration-100 ease-crisp\"\n              type=\"button\"\n            >\n              <Icon\n                name=\"Close\"\n                size={12}\n                className=\"text-shade-tertiary hover:text-shade-primary transition-colors duration-100 ease-crisp\"\n              />\n            </button>\n          )}\n          {children && children}\n          {action && (\n            <Button\n              label={action.label}\n              onClick={action.onClick}\n              variant=\"secondary\"\n              size=\"xs\"\n              useHoverEffect={false}\n            />\n          )}\n        </div>\n      </div>\n      {hasMessage && (\n        <div className=\"h-[14px] ml-auto px-1\">\n          <AnimatePresence>\n            {message && (\n              <motion.span\n                initial={{ opacity: 0, filter: \"blur(4px)\" }}\n                animate={{ opacity: 1, filter: \"blur(0px)\" }}\n                exit={{ opacity: 0, filter: \"blur(4px)\" }}\n                transition={{ duration: 0.1, ease: crisp }}\n                className={classNames(\n                  \"text-sm text-shade-secondary font-medium leading-[100%]\",\n                  !isValid && \"text-state-error\"\n                )}\n              >\n                {message}\n              </motion.span>\n            )}\n          </AnimatePresence>\n        </div>\n      )}\n    </motion.div>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;AA0CA,MAAa,SAAS,EACpB,OACA,OACA,WACA,UACA,SACA,QACA,SACA,OACA,MACA,SACA,aAAa,MACb,UACA,aACA,UAAU,MACV,SACA,QACA,WACA,SACA,UACA,gBACA,qBACgB;CAChB,MAAM,CAAC,eAAe,wCAA6B,MAAM;AACzD,QACE,4CAACA,oBAAO;EACN,GAAI;EACJ,mCACE,uDACA,UACD;;GAEA,SACC,4CAAC;IAAI,WAAU;eACb,4CAAC;KAAI,WAAU;gBACb,2CAAC;MAAK,WAAU;gBACb;OACI,EACN,WACC,4CAAC;MACC,WAAU;MACV,oBAAoB,iBAAiB,KAAK;MAC1C,oBAAoB,iBAAiB,MAAM;iBAE3C,2CAACC;OACC,QAAQ;OACR,UAAU,QAAQ;OAClB,aAAa,QAAQ;QACrB,EACF,2CAACC;OAAK,MAAK;OAAO,MAAM;OAAI,WAAU;QAAwB;OAC1D;MAEJ,EACL,WACC,4CAAC;KAAI,WAAU;gBACb,2CAACA;MACC,MAAM,QAAQ;MACd,MAAM;MACN,WAAU;OACV,EACF,4CAAC;MAAK,WAAU;;OACb,QAAQ;OAAO;OAAE,QAAQ;;OACrB;MACH;KAEJ;GAER,4CAAC;IACC,mCACE,4VACA,CAAC,WAAW,0CACZ,CAAC,CAAC,SAAS,oBACX,CAAC,SAAS,aACV,CAAC,CAAC,YAAY,WACd,eACD;eAEA,WACC,2CAAC;KAAI,WAAU;eACb,2CAACC;MACC,MAAM;MACN,SAAQ;MACR,SAAS,CAAC,eAAe;MACzB,gBAAgB;MAChB,mBAAmB;OACnB;MACE,EAER,4CAAC;KACC,mCACE,sDACD;;MAEA,SAAS,2CAACC,uBAAM,GAAI,QAAS;MAC9B,2CAAC;OACC,mCACE,uGACA,SAAS,WAAW,iCAEpB,oMACA,eACD;OACQ;OACD;OACK;OACN;OACP,WAAW,MAAM,WAAW,EAAE,OAAO,MAAM;OACjC;OACV,MAAM,SAAS,UAAU,WAAW;QACpC;MACD,WAAW,SACV,2CAAC;OACC,SAAS;OACT,WAAU;OACV,MAAK;iBAEL,2CAACF;QACC,MAAK;QACL,MAAM;QACN,WAAU;SACV;QACK;MAEV,YAAY;MACZ,UACC,2CAACG;OACC,OAAO,OAAO;OACd,SAAS,OAAO;OAChB,SAAQ;OACR,MAAK;OACL,gBAAgB;QAChB;;MAEA;KACF;GACL,cACC,2CAAC;IAAI,WAAU;cACb,2CAACC,0CACE,WACC,2CAACN,oBAAO;KACN,SAAS;MAAE,SAAS;MAAG,QAAQ;MAAa;KAC5C,SAAS;MAAE,SAAS;MAAG,QAAQ;MAAa;KAC5C,MAAM;MAAE,SAAS;MAAG,QAAQ;MAAa;KACzC,YAAY;MAAE,UAAU;MAAK,MAAMO;MAAO;KAC1C,mCACE,2DACA,CAAC,WAAW,mBACb;eAEA;MACW,GAEA;KACd;;GAEG"}

package/dist/Input.d.cts

@@ -1,7 +1,8 @@
 import { BadgeProps } from "./Badge.cjs";
 import { TooltipProps } from "./Tooltip.cjs";
 import { IconName } from "./icons/index.cjs";
-import * as react_jsx_runtime22 from "react/jsx-runtime";
+import "./Icon.cjs";
+import * as react_jsx_runtime12 from "react/jsx-runtime";
 import { MotionProps } from "motion/react";
 
 //#region src/Input.d.ts
@@ -33,6 +34,7 @@ type InputProps = {
   animation?: MotionProps;
   tooltip?: TooltipProps;
   children?: React.ReactNode;
+  inputClassName?: string;
 };
 declare const Input: ({
   title,
@@ -54,8 +56,9 @@ declare const Input: ({
   animation,
   tooltip,
   children,
-  innerClassname
-}: InputProps) => react_jsx_runtime22.JSX.Element;
+  innerClassname,
+  inputClassName
+}: InputProps) => react_jsx_runtime12.JSX.Element;
 //#endregion
 export { Input, InputProps };
 //# sourceMappingURL=Input.d.cts.map

package/dist/Input.d.cts.map

@@ -1 +1 @@
-{"version":3,"file":"Input.d.cts","names":[],"sources":["../src/Input.tsx"],"sourcesContent":[],"mappings":";;;;;;;KAWY,UAAA;;;EAAA,SAAA,CAAA,EAAA,MAAU;EASZ,cAAA,CAAA,EAAA,MAAA;EAUC,QAAA,CAAA,EAAA,CAAA,KAAA,EAAA,MAAA,EAAA,GAAA,IAAA;EAMG,OAAA,CAAA,EAAA,GAAA,GAAA,IAAA;EACF,MAAA,CAAA,EAAA,GAAA,GAAA,IAAA;EACC,OAAM,CAAA,EAAA,GAAA,GAAA,IAAA;EAAS,KAAA,CAAA,EAlBlB,UAkBkB;EAGf,OAAA,CA2JZ,EAAA,MAAA;EA3JqB,UAAA,CAAA,EAAA,OAAA;EAAA,QAAA,CAAA,EAAA,OAAA;EAAA,WAAA,CAAA,EAAA,MAAA;EAAA,OAAA,CAAA,EAAA,OAAA;EAAA,IAAA,CAAA,EAAA,SAAA,GAAA,OAAA;EAAA,OAAA,CAAA,EAAA;IAAA,MAAA,EAAA,MAAA;IAAA,IAAA,EAAA,MAAA;IAAA,IAAA,CAAA,EAXX,QAWW;EAAA,CAAA;EAAA,MAAA,CAAA,EAAA;IAAA,KAAA,EAAA,MAAA;IAAA,OAAA,EAAA,GAAA,GAAA,IAAA;EAAA,CAAA;EAAA,SAAA,CAAA,EALR,WAKQ;EAAA,OAAA,CAAA,EAJV,YAIU;EAAA,QAAA,CAAA,EAHT,KAAA,CAAM,SAGG;CAAA;AAAA,cAAT,KAAS,EAAA,CAAA;EAAA,KAAA;EAAA,KAAA;EAAA,SAAA;EAAA,QAAA;EAAA,OAAA;EAAA,MAAA;EAAA,OAAA;EAAA,KAAA;EAAA,IAAA;EAAA,OAAA;EAAA,UAAA;EAAA,QAAA;EAAA,WAAA;EAAA,OAAA;EAAA,OAAA;EAAA,MAAA;EAAA,SAAA;EAAA,OAAA;EAAA,QAAA;EAAA;AAAA,CAAA,EAqBnB,UArBmB,EAAA,GAqBT,mBAAA,CAAA,GAAA,CAAA,OArBS"}
+{"version":3,"file":"Input.d.cts","names":[],"sources":["../src/Input.tsx"],"sourcesContent":[],"mappings":";;;;;;;;KAWY,UAAA;;;;EAAA,cAAU,CAAA,EAAA,MAAA;EASZ,QAAA,CAAA,EAAA,CAAA,KAAA,EAAA,MAAA,EAAA,GAAA,IAAA;EAUC,OAAA,CAAA,EAAA,GAAA,GAAA,IAAA;EAMG,MAAA,CAAA,EAAA,GAAA,GAAA,IAAA;EACF,OAAA,CAAA,EAAA,GAAA,GAAA,IAAA;EACC,KAAM,CAAA,EAlBT,UAkBS;EAAS,OAAA,CAAA,EAAA,MAAA;EAIf,UA6JZ,CAAA,EAAA,OAAA;EA7JqB,QAAA,CAAA,EAAA,OAAA;EAAA,WAAA,CAAA,EAAA,MAAA;EAAA,OAAA,CAAA,EAAA,OAAA;EAAA,IAAA,CAAA,EAAA,SAAA,GAAA,OAAA;EAAA,OAAA,CAAA,EAAA;IAAA,MAAA,EAAA,MAAA;IAAA,IAAA,EAAA,MAAA;IAAA,IAAA,CAAA,EAZX,QAYW;EAAA,CAAA;EAAA,MAAA,CAAA,EAAA;IAAA,KAAA,EAAA,MAAA;IAAA,OAAA,EAAA,GAAA,GAAA,IAAA;EAAA,CAAA;EAAA,SAAA,CAAA,EANR,WAMQ;EAAA,OAAA,CAAA,EALV,YAKU;EAAA,QAAA,CAAA,EAJT,KAAA,CAAM,SAIG;EAAA,cAAA,CAAA,EAAA,MAAA;CAAA;AAAA,cAAT,KAAS,EAAA,CAAA;EAAA,KAAA;EAAA,KAAA;EAAA,SAAA;EAAA,QAAA;EAAA,OAAA;EAAA,MAAA;EAAA,OAAA;EAAA,KAAA;EAAA,IAAA;EAAA,OAAA;EAAA,UAAA;EAAA,QAAA;EAAA,WAAA;EAAA,OAAA;EAAA,OAAA;EAAA,MAAA;EAAA,SAAA;EAAA,OAAA;EAAA,QAAA;EAAA,cAAA;EAAA;AAAA,CAAA,EAsBnB,UAtBmB,EAAA,GAsBT,mBAAA,CAAA,GAAA,CAAA,OAtBS"}

package/dist/Input.d.mts

@@ -3,7 +3,7 @@ import { TooltipProps } from "./Tooltip.mjs";
 import { IconName } from "./icons/index.mjs";
 import "./Icon.mjs";
 import { MotionProps } from "motion/react";
-import * as react_jsx_runtime18 from "react/jsx-runtime";
+import * as react_jsx_runtime22 from "react/jsx-runtime";
 
 //#region src/Input.d.ts
 type InputProps = {
@@ -34,6 +34,7 @@ type InputProps = {
   animation?: MotionProps;
   tooltip?: TooltipProps;
   children?: React.ReactNode;
+  inputClassName?: string;
 };
 declare const Input: ({
   title,
@@ -55,8 +56,9 @@ declare const Input: ({
   animation,
   tooltip,
   children,
-  innerClassname
-}: InputProps) => react_jsx_runtime18.JSX.Element;
+  innerClassname,
+  inputClassName
+}: InputProps) => react_jsx_runtime22.JSX.Element;
 //#endregion
 export { Input, InputProps };
 //# sourceMappingURL=Input.d.mts.map

package/dist/Input.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"Input.d.mts","names":[],"sources":["../src/Input.tsx"],"sourcesContent":[],"mappings":";;;;;;;;KAWY,UAAA;;;;EAAA,cAAU,CAAA,EAAA,MAAA;EASZ,QAAA,CAAA,EAAA,CAAA,KAAA,EAAA,MAAA,EAAA,GAAA,IAAA;EAUC,OAAA,CAAA,EAAA,GAAA,GAAA,IAAA;EAMG,MAAA,CAAA,EAAA,GAAA,GAAA,IAAA;EACF,OAAA,CAAA,EAAA,GAAA,GAAA,IAAA;EACC,KAAM,CAAA,EAlBT,UAkBS;EAAS,OAAA,CAAA,EAAA,MAAA;EAGf,UA2JZ,CAAA,EAAA,OAAA;EA3JqB,QAAA,CAAA,EAAA,OAAA;EAAA,WAAA,CAAA,EAAA,MAAA;EAAA,OAAA,CAAA,EAAA,OAAA;EAAA,IAAA,CAAA,EAAA,SAAA,GAAA,OAAA;EAAA,OAAA,CAAA,EAAA;IAAA,MAAA,EAAA,MAAA;IAAA,IAAA,EAAA,MAAA;IAAA,IAAA,CAAA,EAXX,QAWW;EAAA,CAAA;EAAA,MAAA,CAAA,EAAA;IAAA,KAAA,EAAA,MAAA;IAAA,OAAA,EAAA,GAAA,GAAA,IAAA;EAAA,CAAA;EAAA,SAAA,CAAA,EALR,WAKQ;EAAA,OAAA,CAAA,EAJV,YAIU;EAAA,QAAA,CAAA,EAHT,KAAA,CAAM,SAGG;CAAA;AAAA,cAAT,KAAS,EAAA,CAAA;EAAA,KAAA;EAAA,KAAA;EAAA,SAAA;EAAA,QAAA;EAAA,OAAA;EAAA,MAAA;EAAA,OAAA;EAAA,KAAA;EAAA,IAAA;EAAA,OAAA;EAAA,UAAA;EAAA,QAAA;EAAA,WAAA;EAAA,OAAA;EAAA,OAAA;EAAA,MAAA;EAAA,SAAA;EAAA,OAAA;EAAA,QAAA;EAAA;AAAA,CAAA,EAqBnB,UArBmB,EAAA,GAqBT,mBAAA,CAAA,GAAA,CAAA,OArBS"}
+{"version":3,"file":"Input.d.mts","names":[],"sources":["../src/Input.tsx"],"sourcesContent":[],"mappings":";;;;;;;;KAWY,UAAA;;;;EAAA,cAAU,CAAA,EAAA,MAAA;EASZ,QAAA,CAAA,EAAA,CAAA,KAAA,EAAA,MAAA,EAAA,GAAA,IAAA;EAUC,OAAA,CAAA,EAAA,GAAA,GAAA,IAAA;EAMG,MAAA,CAAA,EAAA,GAAA,GAAA,IAAA;EACF,OAAA,CAAA,EAAA,GAAA,GAAA,IAAA;EACC,KAAM,CAAA,EAlBT,UAkBS;EAAS,OAAA,CAAA,EAAA,MAAA;EAIf,UA6JZ,CAAA,EAAA,OAAA;EA7JqB,QAAA,CAAA,EAAA,OAAA;EAAA,WAAA,CAAA,EAAA,MAAA;EAAA,OAAA,CAAA,EAAA,OAAA;EAAA,IAAA,CAAA,EAAA,SAAA,GAAA,OAAA;EAAA,OAAA,CAAA,EAAA;IAAA,MAAA,EAAA,MAAA;IAAA,IAAA,EAAA,MAAA;IAAA,IAAA,CAAA,EAZX,QAYW;EAAA,CAAA;EAAA,MAAA,CAAA,EAAA;IAAA,KAAA,EAAA,MAAA;IAAA,OAAA,EAAA,GAAA,GAAA,IAAA;EAAA,CAAA;EAAA,SAAA,CAAA,EANR,WAMQ;EAAA,OAAA,CAAA,EALV,YAKU;EAAA,QAAA,CAAA,EAJT,KAAA,CAAM,SAIG;EAAA,cAAA,CAAA,EAAA,MAAA;CAAA;AAAA,cAAT,KAAS,EAAA,CAAA;EAAA,KAAA;EAAA,KAAA;EAAA,SAAA;EAAA,QAAA;EAAA,OAAA;EAAA,MAAA;EAAA,OAAA;EAAA,KAAA;EAAA,IAAA;EAAA,OAAA;EAAA,UAAA;EAAA,QAAA;EAAA,WAAA;EAAA,OAAA;EAAA,OAAA;EAAA,MAAA;EAAA,SAAA;EAAA,OAAA;EAAA,QAAA;EAAA,cAAA;EAAA;AAAA,CAAA,EAsBnB,UAtBmB,EAAA,GAsBT,mBAAA,CAAA,GAAA,CAAA,OAtBS"}

package/dist/Input.mjs

@@ -12,7 +12,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 
 //#region src/Input.tsx
-const Input = ({ title, value, className, onChange, onFocus, onBlur, onClear, badge, type, message, hasMessage = true, disabled, placeholder, isValid = true, balance, action, animation, tooltip, children, innerClassname }) => {
+const Input = ({ title, value, className, onChange, onFocus, onBlur, onClear, badge, type, message, hasMessage = true, disabled, placeholder, isValid = true, balance, action, animation, tooltip, children, innerClassname, inputClassName }) => {
 	const [isTooltipOpen, setIsTooltipOpen] = useState(false);
 	return /* @__PURE__ */ jsxs(motion.div, {
 		...animation,
@@ -71,7 +71,7 @@ const Input = ({ title, value, className, onChange, onFocus, onBlur, onClear, ba
 					children: [
 						badge && /* @__PURE__ */ jsx(Badge, { ...badge }),
 						/* @__PURE__ */ jsx("input", {
-							className: classNames("h-full w-full flex-shrink font-medium focus:outline-none bg-transparent placeholder:text-shade-mute", type === "value" && "text-2xl font-mono text-right", "[-moz-appearance:_textfield] [&::-webkit-inner-spin-button]:m-0 [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:m-0 [&::-webkit-outer-spin-button]:appearance-none"),
+							className: classNames("h-full w-full flex-shrink font-medium focus:outline-none bg-transparent placeholder:text-shade-mute", type === "value" && "text-2xl font-mono text-right", "[-moz-appearance:_textfield] [&::-webkit-inner-spin-button]:m-0 [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:m-0 [&::-webkit-outer-spin-button]:appearance-none", inputClassName),
 							onFocus,
 							onBlur,
 							placeholder,

package/dist/Input.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Input.mjs","names":[],"sources":["../src/Input.tsx"],"sourcesContent":["\"use client\";\nimport { AnimatePresence, motion, MotionProps } from \"motion/react\";\nimport { Icon, IconName, IconProps } from \"./Icon\";\nimport classNames from \"classnames\";\nimport { Badge, BadgeProps } from \"./Badge\";\nimport { Button } from \"./Button\";\nimport { crisp } from \"./utils/easings\";\nimport { CrosshairCorners } from \"./CrossHair\";\nimport { Tooltip, TooltipProps } from \"./Tooltip\";\nimport { useState } from \"react\";\n\nexport type InputProps = {\n  title?: string;\n  value: string;\n  className?: string;\n  innerClassname?: string;\n  onChange?: (value: string) => void;\n  onFocus?: () => void;\n  onBlur?: () => void;\n  onClear?: () => void;\n  badge?: BadgeProps;\n  message?: string;\n  hasMessage?: boolean;\n  disabled?: boolean;\n  placeholder?: string;\n  isValid?: boolean;\n  type?: \"generic\" | \"value\";\n  balance?: {\n    amount: string;\n    unit: string;\n    icon?: IconName;\n  };\n  action?: {\n    label: string;\n    onClick: () => void;\n  };\n  animation?: MotionProps;\n  tooltip?: TooltipProps;\n  children?: React.ReactNode;\n};\n\nexport const Input = ({\n  title,\n  value,\n  className,\n  onChange,\n  onFocus,\n  onBlur,\n  onClear,\n  badge,\n  type,\n  message,\n  hasMessage = true,\n  disabled,\n  placeholder,\n  isValid = true,\n  balance,\n  action,\n  animation,\n  tooltip,\n  children,\n  innerClassname,\n}: InputProps) => {\n  const [isTooltipOpen, setIsTooltipOpen] = useState(false);\n  return (\n    <motion.div\n      {...animation}\n      className={classNames(\n        \"flex flex-col gap-y-2.5 w-full relative group/input\",\n        className\n      )}\n    >\n      {title && (\n        <div className=\"px-1 flex items-center justify-between w-full\">\n          <div className=\"flex items-center gap-x-1.5\">\n            <span className=\"font-medium text-shade-primary leading-[100%]\">\n              {title}\n            </span>\n            {tooltip && (\n              <div\n                className=\"h-[14px] w-[14px] relative\"\n                onMouseEnter={() => setIsTooltipOpen(true)}\n                onMouseLeave={() => setIsTooltipOpen(false)}\n              >\n                <Tooltip\n                  isOpen={isTooltipOpen}\n                  position={tooltip.position}\n                  description={tooltip.description}\n                />\n                <Icon name=\"Info\" size={14} className=\"text-shade-tertiary\" />\n              </div>\n            )}\n          </div>\n          {balance && (\n            <div className=\"flex items-center gap-x-1.5\">\n              <Icon\n                name={balance.icon as IconName}\n                size={12}\n                className=\"text-shade-tertiary\"\n              />\n              <span className=\"font-medium text-shade-primary leading-[100%] text-sm font-mono\">\n                {balance.amount} {balance.unit}\n              </span>\n            </div>\n          )}\n        </div>\n      )}\n      <div\n        className={classNames(\n          \"min-h-[44px] pr-4 relative h-full py-1.5 flex items-center justify-between group/input bg-background border text-shade-tertiary border-border enabled:focus-within:border-current/20 enabled:focus-within:bg-current/2 enabled:focus-within:shadow-[inset_0px_0px_12px] enabled:focus-within:shadow-current/10 transition-colors duration-100 ease-crisp\",\n          !isValid && \"border-state-error/20 text-state-error\",\n          !!badge && \"pl-1.5 pr-[10px]\",\n          !badge && \"pl-3 pr-4\",\n          !!children && \"!pr-1.5\",\n          innerClassname\n        )}\n      >\n        {onFocus && (\n          <div className=\"pointer-events-none absolute inset-1.5 text-shade-mute enabled:group-hover/input:text-shade-primary enabled:group-focus-within/input:inset-0.5 enabled:group-focus-within/input:text-shade-primary transition-all duration-50 ease-glide\">\n            <CrosshairCorners\n              size={6}\n              variant=\"corners\"\n              corners={[\"bottom-right\"]}\n              animationDelay={0}\n              animationDuration={0.75}\n            />\n          </div>\n        )}\n        <div\n          className={classNames(\n            \"flex w-full items-center gap-x-3 text-shade-primary\"\n          )}\n        >\n          {badge && <Badge {...badge} />}\n          <input\n            className={classNames(\n              \"h-full w-full flex-shrink font-medium focus:outline-none bg-transparent placeholder:text-shade-mute\",\n              type === \"value\" && \"text-2xl font-mono text-right\",\n              // Hide buttons\n              \"[-moz-appearance:_textfield] [&::-webkit-inner-spin-button]:m-0 [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:m-0 [&::-webkit-outer-spin-button]:appearance-none\"\n            )}\n            onFocus={onFocus}\n            onBlur={onBlur}\n            placeholder={placeholder}\n            value={value}\n            onChange={(e) => onChange?.(e.target.value)}\n            disabled={disabled}\n            type={type === \"value\" ? \"number\" : \"text\"}\n          />\n          {onClear && value && (\n            <button\n              onClick={onClear}\n              className=\"absolute right-2 p-2 hover:bg-border-light/50 transition-colors duration-100 ease-crisp\"\n              type=\"button\"\n            >\n              <Icon\n                name=\"Close\"\n                size={12}\n                className=\"text-shade-tertiary hover:text-shade-primary transition-colors duration-100 ease-crisp\"\n              />\n            </button>\n          )}\n          {children && children}\n          {action && (\n            <Button\n              label={action.label}\n              onClick={action.onClick}\n              variant=\"secondary\"\n              size=\"xs\"\n              useHoverEffect={false}\n            />\n          )}\n        </div>\n      </div>\n      {hasMessage && (\n        <div className=\"h-[14px] ml-auto px-1\">\n          <AnimatePresence>\n            {message && (\n              <motion.span\n                initial={{ opacity: 0, filter: \"blur(4px)\" }}\n                animate={{ opacity: 1, filter: \"blur(0px)\" }}\n                exit={{ opacity: 0, filter: \"blur(4px)\" }}\n                transition={{ duration: 0.1, ease: crisp }}\n                className={classNames(\n                  \"text-sm text-shade-secondary font-medium leading-[100%]\",\n                  !isValid && \"text-state-error\"\n                )}\n              >\n                {message}\n              </motion.span>\n            )}\n          </AnimatePresence>\n        </div>\n      )}\n    </motion.div>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;AAyCA,MAAa,SAAS,EACpB,OACA,OACA,WACA,UACA,SACA,QACA,SACA,OACA,MACA,SACA,aAAa,MACb,UACA,aACA,UAAU,MACV,SACA,QACA,WACA,SACA,UACA,qBACgB;CAChB,MAAM,CAAC,eAAe,oBAAoB,SAAS,MAAM;AACzD,QACE,qBAAC,OAAO;EACN,GAAI;EACJ,WAAW,WACT,uDACA,UACD;;GAEA,SACC,qBAAC;IAAI,WAAU;eACb,qBAAC;KAAI,WAAU;gBACb,oBAAC;MAAK,WAAU;gBACb;OACI,EACN,WACC,qBAAC;MACC,WAAU;MACV,oBAAoB,iBAAiB,KAAK;MAC1C,oBAAoB,iBAAiB,MAAM;iBAE3C,oBAAC;OACC,QAAQ;OACR,UAAU,QAAQ;OAClB,aAAa,QAAQ;QACrB,EACF,oBAAC;OAAK,MAAK;OAAO,MAAM;OAAI,WAAU;QAAwB;OAC1D;MAEJ,EACL,WACC,qBAAC;KAAI,WAAU;gBACb,oBAAC;MACC,MAAM,QAAQ;MACd,MAAM;MACN,WAAU;OACV,EACF,qBAAC;MAAK,WAAU;;OACb,QAAQ;OAAO;OAAE,QAAQ;;OACrB;MACH;KAEJ;GAER,qBAAC;IACC,WAAW,WACT,4VACA,CAAC,WAAW,0CACZ,CAAC,CAAC,SAAS,oBACX,CAAC,SAAS,aACV,CAAC,CAAC,YAAY,WACd,eACD;eAEA,WACC,oBAAC;KAAI,WAAU;eACb,oBAAC;MACC,MAAM;MACN,SAAQ;MACR,SAAS,CAAC,eAAe;MACzB,gBAAgB;MAChB,mBAAmB;OACnB;MACE,EAER,qBAAC;KACC,WAAW,WACT,sDACD;;MAEA,SAAS,oBAAC,SAAM,GAAI,QAAS;MAC9B,oBAAC;OACC,WAAW,WACT,uGACA,SAAS,WAAW,iCAEpB,mMACD;OACQ;OACD;OACK;OACN;OACP,WAAW,MAAM,WAAW,EAAE,OAAO,MAAM;OACjC;OACV,MAAM,SAAS,UAAU,WAAW;QACpC;MACD,WAAW,SACV,oBAAC;OACC,SAAS;OACT,WAAU;OACV,MAAK;iBAEL,oBAAC;QACC,MAAK;QACL,MAAM;QACN,WAAU;SACV;QACK;MAEV,YAAY;MACZ,UACC,oBAAC;OACC,OAAO,OAAO;OACd,SAAS,OAAO;OAChB,SAAQ;OACR,MAAK;OACL,gBAAgB;QAChB;;MAEA;KACF;GACL,cACC,oBAAC;IAAI,WAAU;cACb,oBAAC,6BACE,WACC,oBAAC,OAAO;KACN,SAAS;MAAE,SAAS;MAAG,QAAQ;MAAa;KAC5C,SAAS;MAAE,SAAS;MAAG,QAAQ;MAAa;KAC5C,MAAM;MAAE,SAAS;MAAG,QAAQ;MAAa;KACzC,YAAY;MAAE,UAAU;MAAK,MAAM;MAAO;KAC1C,WAAW,WACT,2DACA,CAAC,WAAW,mBACb;eAEA;MACW,GAEA;KACd;;GAEG"}
+{"version":3,"file":"Input.mjs","names":[],"sources":["../src/Input.tsx"],"sourcesContent":["\"use client\";\nimport { AnimatePresence, motion, MotionProps } from \"motion/react\";\nimport { Icon, IconName, IconProps } from \"./Icon\";\nimport classNames from \"classnames\";\nimport { Badge, BadgeProps } from \"./Badge\";\nimport { Button } from \"./Button\";\nimport { crisp } from \"./utils/easings\";\nimport { CrosshairCorners } from \"./CrossHair\";\nimport { Tooltip, TooltipProps } from \"./Tooltip\";\nimport { useState } from \"react\";\n\nexport type InputProps = {\n  title?: string;\n  value: string;\n  className?: string;\n  innerClassname?: string;\n  onChange?: (value: string) => void;\n  onFocus?: () => void;\n  onBlur?: () => void;\n  onClear?: () => void;\n  badge?: BadgeProps;\n  message?: string;\n  hasMessage?: boolean;\n  disabled?: boolean;\n  placeholder?: string;\n  isValid?: boolean;\n  type?: \"generic\" | \"value\";\n  balance?: {\n    amount: string;\n    unit: string;\n    icon?: IconName;\n  };\n  action?: {\n    label: string;\n    onClick: () => void;\n  };\n  animation?: MotionProps;\n  tooltip?: TooltipProps;\n  children?: React.ReactNode;\n  inputClassName?: string;\n};\n\nexport const Input = ({\n  title,\n  value,\n  className,\n  onChange,\n  onFocus,\n  onBlur,\n  onClear,\n  badge,\n  type,\n  message,\n  hasMessage = true,\n  disabled,\n  placeholder,\n  isValid = true,\n  balance,\n  action,\n  animation,\n  tooltip,\n  children,\n  innerClassname,\n  inputClassName,\n}: InputProps) => {\n  const [isTooltipOpen, setIsTooltipOpen] = useState(false);\n  return (\n    <motion.div\n      {...animation}\n      className={classNames(\n        \"flex flex-col gap-y-2.5 w-full relative group/input\",\n        className\n      )}\n    >\n      {title && (\n        <div className=\"px-1 flex items-center justify-between w-full\">\n          <div className=\"flex items-center gap-x-1.5\">\n            <span className=\"font-medium text-shade-primary leading-[100%]\">\n              {title}\n            </span>\n            {tooltip && (\n              <div\n                className=\"h-[14px] w-[14px] relative\"\n                onMouseEnter={() => setIsTooltipOpen(true)}\n                onMouseLeave={() => setIsTooltipOpen(false)}\n              >\n                <Tooltip\n                  isOpen={isTooltipOpen}\n                  position={tooltip.position}\n                  description={tooltip.description}\n                />\n                <Icon name=\"Info\" size={14} className=\"text-shade-tertiary\" />\n              </div>\n            )}\n          </div>\n          {balance && (\n            <div className=\"flex items-center gap-x-1.5\">\n              <Icon\n                name={balance.icon as IconName}\n                size={12}\n                className=\"text-shade-tertiary\"\n              />\n              <span className=\"font-medium text-shade-primary leading-[100%] text-sm font-mono\">\n                {balance.amount} {balance.unit}\n              </span>\n            </div>\n          )}\n        </div>\n      )}\n      <div\n        className={classNames(\n          \"min-h-[44px] pr-4 relative h-full py-1.5 flex items-center justify-between group/input bg-background border text-shade-tertiary border-border enabled:focus-within:border-current/20 enabled:focus-within:bg-current/2 enabled:focus-within:shadow-[inset_0px_0px_12px] enabled:focus-within:shadow-current/10 transition-colors duration-100 ease-crisp\",\n          !isValid && \"border-state-error/20 text-state-error\",\n          !!badge && \"pl-1.5 pr-[10px]\",\n          !badge && \"pl-3 pr-4\",\n          !!children && \"!pr-1.5\",\n          innerClassname\n        )}\n      >\n        {onFocus && (\n          <div className=\"pointer-events-none absolute inset-1.5 text-shade-mute enabled:group-hover/input:text-shade-primary enabled:group-focus-within/input:inset-0.5 enabled:group-focus-within/input:text-shade-primary transition-all duration-50 ease-glide\">\n            <CrosshairCorners\n              size={6}\n              variant=\"corners\"\n              corners={[\"bottom-right\"]}\n              animationDelay={0}\n              animationDuration={0.75}\n            />\n          </div>\n        )}\n        <div\n          className={classNames(\n            \"flex w-full items-center gap-x-3 text-shade-primary\"\n          )}\n        >\n          {badge && <Badge {...badge} />}\n          <input\n            className={classNames(\n              \"h-full w-full flex-shrink font-medium focus:outline-none bg-transparent placeholder:text-shade-mute\",\n              type === \"value\" && \"text-2xl font-mono text-right\",\n              // Hide buttons\n              \"[-moz-appearance:_textfield] [&::-webkit-inner-spin-button]:m-0 [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:m-0 [&::-webkit-outer-spin-button]:appearance-none\",\n              inputClassName\n            )}\n            onFocus={onFocus}\n            onBlur={onBlur}\n            placeholder={placeholder}\n            value={value}\n            onChange={(e) => onChange?.(e.target.value)}\n            disabled={disabled}\n            type={type === \"value\" ? \"number\" : \"text\"}\n          />\n          {onClear && value && (\n            <button\n              onClick={onClear}\n              className=\"absolute right-2 p-2 hover:bg-border-light/50 transition-colors duration-100 ease-crisp\"\n              type=\"button\"\n            >\n              <Icon\n                name=\"Close\"\n                size={12}\n                className=\"text-shade-tertiary hover:text-shade-primary transition-colors duration-100 ease-crisp\"\n              />\n            </button>\n          )}\n          {children && children}\n          {action && (\n            <Button\n              label={action.label}\n              onClick={action.onClick}\n              variant=\"secondary\"\n              size=\"xs\"\n              useHoverEffect={false}\n            />\n          )}\n        </div>\n      </div>\n      {hasMessage && (\n        <div className=\"h-[14px] ml-auto px-1\">\n          <AnimatePresence>\n            {message && (\n              <motion.span\n                initial={{ opacity: 0, filter: \"blur(4px)\" }}\n                animate={{ opacity: 1, filter: \"blur(0px)\" }}\n                exit={{ opacity: 0, filter: \"blur(4px)\" }}\n                transition={{ duration: 0.1, ease: crisp }}\n                className={classNames(\n                  \"text-sm text-shade-secondary font-medium leading-[100%]\",\n                  !isValid && \"text-state-error\"\n                )}\n              >\n                {message}\n              </motion.span>\n            )}\n          </AnimatePresence>\n        </div>\n      )}\n    </motion.div>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;AA0CA,MAAa,SAAS,EACpB,OACA,OACA,WACA,UACA,SACA,QACA,SACA,OACA,MACA,SACA,aAAa,MACb,UACA,aACA,UAAU,MACV,SACA,QACA,WACA,SACA,UACA,gBACA,qBACgB;CAChB,MAAM,CAAC,eAAe,oBAAoB,SAAS,MAAM;AACzD,QACE,qBAAC,OAAO;EACN,GAAI;EACJ,WAAW,WACT,uDACA,UACD;;GAEA,SACC,qBAAC;IAAI,WAAU;eACb,qBAAC;KAAI,WAAU;gBACb,oBAAC;MAAK,WAAU;gBACb;OACI,EACN,WACC,qBAAC;MACC,WAAU;MACV,oBAAoB,iBAAiB,KAAK;MAC1C,oBAAoB,iBAAiB,MAAM;iBAE3C,oBAAC;OACC,QAAQ;OACR,UAAU,QAAQ;OAClB,aAAa,QAAQ;QACrB,EACF,oBAAC;OAAK,MAAK;OAAO,MAAM;OAAI,WAAU;QAAwB;OAC1D;MAEJ,EACL,WACC,qBAAC;KAAI,WAAU;gBACb,oBAAC;MACC,MAAM,QAAQ;MACd,MAAM;MACN,WAAU;OACV,EACF,qBAAC;MAAK,WAAU;;OACb,QAAQ;OAAO;OAAE,QAAQ;;OACrB;MACH;KAEJ;GAER,qBAAC;IACC,WAAW,WACT,4VACA,CAAC,WAAW,0CACZ,CAAC,CAAC,SAAS,oBACX,CAAC,SAAS,aACV,CAAC,CAAC,YAAY,WACd,eACD;eAEA,WACC,oBAAC;KAAI,WAAU;eACb,oBAAC;MACC,MAAM;MACN,SAAQ;MACR,SAAS,CAAC,eAAe;MACzB,gBAAgB;MAChB,mBAAmB;OACnB;MACE,EAER,qBAAC;KACC,WAAW,WACT,sDACD;;MAEA,SAAS,oBAAC,SAAM,GAAI,QAAS;MAC9B,oBAAC;OACC,WAAW,WACT,uGACA,SAAS,WAAW,iCAEpB,oMACA,eACD;OACQ;OACD;OACK;OACN;OACP,WAAW,MAAM,WAAW,EAAE,OAAO,MAAM;OACjC;OACV,MAAM,SAAS,UAAU,WAAW;QACpC;MACD,WAAW,SACV,oBAAC;OACC,SAAS;OACT,WAAU;OACV,MAAK;iBAEL,oBAAC;QACC,MAAK;QACL,MAAM;QACN,WAAU;SACV;QACK;MAEV,YAAY;MACZ,UACC,oBAAC;OACC,OAAO,OAAO;OACd,SAAS,OAAO;OAChB,SAAQ;OACR,MAAK;OACL,gBAAgB;QAChB;;MAEA;KACF;GACL,cACC,oBAAC;IAAI,WAAU;cACb,oBAAC,6BACE,WACC,oBAAC,OAAO;KACN,SAAS;MAAE,SAAS;MAAG,QAAQ;MAAa;KAC5C,SAAS;MAAE,SAAS;MAAG,QAAQ;MAAa;KAC5C,MAAM;MAAE,SAAS;MAAG,QAAQ;MAAa;KACzC,YAAY;MAAE,UAAU;MAAK,MAAM;MAAO;KAC1C,WAAW,WACT,2DACA,CAAC,WAAW,mBACb;eAEA;MACW,GAEA;KACd;;GAEG"}

package/dist/Logo.d.cts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime17 from "react/jsx-runtime";
+import * as react_jsx_runtime26 from "react/jsx-runtime";
 
 //#region src/Logo.d.ts
 type LogoProps = {
@@ -12,7 +12,7 @@ declare const Logo: ({
   height,
   hideText,
   isScrolled
-}: LogoProps) => react_jsx_runtime17.JSX.Element;
+}: LogoProps) => react_jsx_runtime26.JSX.Element;
 //#endregion
 export { Logo, LogoProps };
 //# sourceMappingURL=Logo.d.cts.map

package/dist/Logo.d.mts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime2 from "react/jsx-runtime";
+import * as react_jsx_runtime29 from "react/jsx-runtime";
 
 //#region src/Logo.d.ts
 type LogoProps = {
@@ -12,7 +12,7 @@ declare const Logo: ({
   height,
   hideText,
   isScrolled
-}: LogoProps) => react_jsx_runtime2.JSX.Element;
+}: LogoProps) => react_jsx_runtime29.JSX.Element;
 //#endregion
 export { Logo, LogoProps };
 //# sourceMappingURL=Logo.d.mts.map

package/dist/Logo.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"Logo.d.mts","names":[],"sources":["../src/Logo.tsx"],"sourcesContent":[],"mappings":";;;KAMY,SAAA;;;EAAA,QAAA,CAAA,EAAA,OAAS;EAOR,UAgHZ,CAAA,EAAA,OAAA;CAhHoB;AAAA,cAAR,IAAQ,EAAA,CAAA;EAAA,KAAA;EAAA,MAAA;EAAA,QAAA;EAAA;AAAA,CAAA,EAKlB,SALkB,EAAA,GAKT,kBAAA,CAAA,GAAA,CAAA,OALS"}
+{"version":3,"file":"Logo.d.mts","names":[],"sources":["../src/Logo.tsx"],"sourcesContent":[],"mappings":";;;KAMY,SAAA;;;EAAA,QAAA,CAAA,EAAA,OAAS;EAOR,UAgHZ,CAAA,EAAA,OAAA;CAhHoB;AAAA,cAAR,IAAQ,EAAA,CAAA;EAAA,KAAA;EAAA,MAAA;EAAA,QAAA;EAAA;AAAA,CAAA,EAKlB,SALkB,EAAA,GAKT,mBAAA,CAAA,GAAA,CAAA,OALS"}

package/dist/Pagination.d.mts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime11 from "react/jsx-runtime";
+import * as react_jsx_runtime31 from "react/jsx-runtime";
 
 //#region src/Pagination.d.ts
 type PaginationProps = {
@@ -18,7 +18,7 @@ declare const Pagination: ({
   className,
   itemsPerPage,
   itemsPerPageOptions
-}: PaginationProps) => react_jsx_runtime11.JSX.Element;
+}: PaginationProps) => react_jsx_runtime31.JSX.Element;
 type PaginationButtonProps = {
   label: string;
   onClick: () => void;
@@ -34,7 +34,7 @@ declare const PaginationButton: ({
   isControl,
   isActive,
   controlDirection
-}: PaginationButtonProps) => react_jsx_runtime11.JSX.Element;
+}: PaginationButtonProps) => react_jsx_runtime31.JSX.Element;
 //#endregion
 export { Pagination, PaginationButton, PaginationButtonProps, PaginationProps };
 //# sourceMappingURL=Pagination.d.mts.map

package/dist/Slider.d.cts

@@ -1,5 +1,5 @@
 import { IconProps } from "./Icon.cjs";
-import * as react_jsx_runtime34 from "react/jsx-runtime";
+import * as react_jsx_runtime19 from "react/jsx-runtime";
 
 //#region src/Slider.d.ts
 type SliderProps = {
@@ -34,7 +34,7 @@ declare const Slider: ({
   onChange,
   className,
   abbreviateValues
-}: SliderProps) => react_jsx_runtime34.JSX.Element;
+}: SliderProps) => react_jsx_runtime19.JSX.Element;
 //#endregion
 export { Slider, SliderProps };
 //# sourceMappingURL=Slider.d.cts.map

package/dist/Slider.d.mts

@@ -1,5 +1,5 @@
 import { IconProps } from "./Icon.mjs";
-import * as react_jsx_runtime16 from "react/jsx-runtime";
+import * as react_jsx_runtime69 from "react/jsx-runtime";
 
 //#region src/Slider.d.ts
 type SliderProps = {
@@ -34,7 +34,7 @@ declare const Slider: ({
   onChange,
   className,
   abbreviateValues
-}: SliderProps) => react_jsx_runtime16.JSX.Element;
+}: SliderProps) => react_jsx_runtime69.JSX.Element;
 //#endregion
 export { Slider, SliderProps };
 //# sourceMappingURL=Slider.d.mts.map

package/dist/Tabs.d.cts

@@ -1,5 +1,5 @@
 import { IconProps } from "./Icon.cjs";
-import * as react_jsx_runtime9 from "react/jsx-runtime";
+import * as react_jsx_runtime17 from "react/jsx-runtime";
 import { MotionProps } from "motion/react";
 
 //#region src/Tabs.d.ts
@@ -33,7 +33,7 @@ declare const Tabs: ({
   size,
   title,
   isNavigation
-}: TabsProps) => react_jsx_runtime9.JSX.Element;
+}: TabsProps) => react_jsx_runtime17.JSX.Element;
 //#endregion
 export { Tabs, TabsProps };
 //# sourceMappingURL=Tabs.d.cts.map

package/dist/Tabs.d.cts.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.d.cts","names":[],"sources":["../src/Tabs.tsx"],"sourcesContent":[],"mappings":";;;;;KAQY,SAAA;;;EAAA,KAAA,EAAA;IAMD,KAAA,CAAA,EAAA,MAAA;IAIU,KAAA,EAAA,MAAA;IAIP,IAAA,CAAA,EARH,SAQG;IAAW,QAAA,CAAA,EAAA,OAAA;IAOZ,QA6FZ,CAAA,EAAA,OAAA;IA7FoB,OAAA,CAAA,EAAA,GAAA,GAAA,IAAA;IAAA,QAAA,CAAA,EAXN,KAAA,CAAM,SAWA;IAAA,SAAA,CAAA,EAAA,MAAA;EAAA,CAAA,EAAA;EAAA,KAAA,EAAA,SAAA,GAAA,WAAA;EAAA,SAAA,CAAA,EAPP,WAOO;EAAA,OAAA,CAAA,EAAA,OAAA;EAAA,IAAA,CAAA,EAAA,IAAA,GAAA,IAAA;EAAA,KAAA,CAAA,EAAA,MAAA;EAUlB,YAAA,CAAA,EAAA,OAAA;CAAS;AAmFX,cA7FY,IA6FZ,EAAA,CAAA;EAAA,SAAA;EAAA,OAAA;EAAA,KAAA;EAAA,KAAA;EAAA,SAAA;EAAA,OAAA;EAAA,IAAA;EAAA,KAAA;EAAA;AAAA,CAAA,EAnFE,SAmFF,EAAA,GAnFW,kBAAA,CAAA,GAAA,CAAA,OAmFX"}
+{"version":3,"file":"Tabs.d.cts","names":[],"sources":["../src/Tabs.tsx"],"sourcesContent":[],"mappings":";;;;;KAQY,SAAA;;;EAAA,KAAA,EAAA;IAMD,KAAA,CAAA,EAAA,MAAA;IAIU,KAAA,EAAA,MAAA;IAIP,IAAA,CAAA,EARH,SAQG;IAAW,QAAA,CAAA,EAAA,OAAA;IAOZ,QA6FZ,CAAA,EAAA,OAAA;IA7FoB,OAAA,CAAA,EAAA,GAAA,GAAA,IAAA;IAAA,QAAA,CAAA,EAXN,KAAA,CAAM,SAWA;IAAA,SAAA,CAAA,EAAA,MAAA;EAAA,CAAA,EAAA;EAAA,KAAA,EAAA,SAAA,GAAA,WAAA;EAAA,SAAA,CAAA,EAPP,WAOO;EAAA,OAAA,CAAA,EAAA,OAAA;EAAA,IAAA,CAAA,EAAA,IAAA,GAAA,IAAA;EAAA,KAAA,CAAA,EAAA,MAAA;EAUlB,YAAA,CAAA,EAAA,OAAA;CAAS;AAmFX,cA7FY,IA6FZ,EAAA,CAAA;EAAA,SAAA;EAAA,OAAA;EAAA,KAAA;EAAA,KAAA;EAAA,SAAA;EAAA,OAAA;EAAA,IAAA;EAAA,KAAA;EAAA;AAAA,CAAA,EAnFE,SAmFF,EAAA,GAnFW,mBAAA,CAAA,GAAA,CAAA,OAmFX"}

package/dist/Tabs.d.mts

@@ -1,6 +1,6 @@
 import { IconProps } from "./Icon.mjs";
 import { MotionProps } from "motion/react";
-import * as react_jsx_runtime8 from "react/jsx-runtime";
+import * as react_jsx_runtime62 from "react/jsx-runtime";
 
 //#region src/Tabs.d.ts
 type TabsProps = {
@@ -33,7 +33,7 @@ declare const Tabs: ({
   size,
   title,
   isNavigation
-}: TabsProps) => react_jsx_runtime8.JSX.Element;
+}: TabsProps) => react_jsx_runtime62.JSX.Element;
 //#endregion
 export { Tabs, TabsProps };
 //# sourceMappingURL=Tabs.d.mts.map

package/dist/Tabs.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.d.mts","names":[],"sources":["../src/Tabs.tsx"],"sourcesContent":[],"mappings":";;;;;KAQY,SAAA;;;EAAA,KAAA,EAAA;IAMD,KAAA,CAAA,EAAA,MAAA;IAIU,KAAA,EAAA,MAAA;IAIP,IAAA,CAAA,EARH,SAQG;IAAW,QAAA,CAAA,EAAA,OAAA;IAOZ,QA6FZ,CAAA,EAAA,OAAA;IA7FoB,OAAA,CAAA,EAAA,GAAA,GAAA,IAAA;IAAA,QAAA,CAAA,EAXN,KAAA,CAAM,SAWA;IAAA,SAAA,CAAA,EAAA,MAAA;EAAA,CAAA,EAAA;EAAA,KAAA,EAAA,SAAA,GAAA,WAAA;EAAA,SAAA,CAAA,EAPP,WAOO;EAAA,OAAA,CAAA,EAAA,OAAA;EAAA,IAAA,CAAA,EAAA,IAAA,GAAA,IAAA;EAAA,KAAA,CAAA,EAAA,MAAA;EAUlB,YAAA,CAAA,EAAA,OAAA;CAAS;AAmFX,cA7FY,IA6FZ,EAAA,CAAA;EAAA,SAAA;EAAA,OAAA;EAAA,KAAA;EAAA,KAAA;EAAA,SAAA;EAAA,OAAA;EAAA,IAAA;EAAA,KAAA;EAAA;AAAA,CAAA,EAnFE,SAmFF,EAAA,GAnFW,kBAAA,CAAA,GAAA,CAAA,OAmFX"}
+{"version":3,"file":"Tabs.d.mts","names":[],"sources":["../src/Tabs.tsx"],"sourcesContent":[],"mappings":";;;;;KAQY,SAAA;;;EAAA,KAAA,EAAA;IAMD,KAAA,CAAA,EAAA,MAAA;IAIU,KAAA,EAAA,MAAA;IAIP,IAAA,CAAA,EARH,SAQG;IAAW,QAAA,CAAA,EAAA,OAAA;IAOZ,QA6FZ,CAAA,EAAA,OAAA;IA7FoB,OAAA,CAAA,EAAA,GAAA,GAAA,IAAA;IAAA,QAAA,CAAA,EAXN,KAAA,CAAM,SAWA;IAAA,SAAA,CAAA,EAAA,MAAA;EAAA,CAAA,EAAA;EAAA,KAAA,EAAA,SAAA,GAAA,WAAA;EAAA,SAAA,CAAA,EAPP,WAOO;EAAA,OAAA,CAAA,EAAA,OAAA;EAAA,IAAA,CAAA,EAAA,IAAA,GAAA,IAAA;EAAA,KAAA,CAAA,EAAA,MAAA;EAUlB,YAAA,CAAA,EAAA,OAAA;CAAS;AAmFX,cA7FY,IA6FZ,EAAA,CAAA;EAAA,SAAA;EAAA,OAAA;EAAA,KAAA;EAAA,KAAA;EAAA,SAAA;EAAA,OAAA;EAAA,IAAA;EAAA,KAAA;EAAA;AAAA,CAAA,EAnFE,SAmFF,EAAA,GAnFW,mBAAA,CAAA,GAAA,CAAA,OAmFX"}

package/dist/Toast.d.cts

@@ -1,5 +1,6 @@
 import { IconName } from "./icons/index.cjs";
-import * as react_jsx_runtime16 from "react/jsx-runtime";
+import "./Icon.cjs";
+import * as react_jsx_runtime21 from "react/jsx-runtime";
 
 //#region src/Toast.d.ts
 type ToastProps = {
@@ -17,7 +18,7 @@ declare const Toast: ({
   icon,
   variant,
   clearable
-}: ToastProps) => react_jsx_runtime16.JSX.Element;
+}: ToastProps) => react_jsx_runtime21.JSX.Element;
 declare const showToast: (props: Omit<ToastProps, "className">) => string | number;
 declare const showSuccessToast: (title: string, description: string) => string | number;
 declare const showErrorToast: (title: string, description: string) => string | number;

package/dist/Toast.d.cts.map

@@ -1 +1 @@
-{"version":3,"file":"Toast.d.cts","names":[],"sources":["../src/Toast.tsx"],"sourcesContent":[],"mappings":";;;;KAOY,UAAA;;;EAAA,WAAA,EAAU,MAAA;EAST,IAAA,EALL,QAwCP;EAnCqB,OAAA,EAAA,SAAA,GAAA,OAAA,GAAA,MAAA;EAAA,SAAA,CAAA,EAAA,OAAA;CAAA;AAAA,cAAT,KAAS,EAAA,CAAA;EAAA,SAAA;EAAA,KAAA;EAAA,WAAA;EAAA,IAAA;EAAA,OAAA;EAAA;AAAA,CAAA,EAOnB,UAPmB,EAAA,GAOT,mBAAA,CAAA,GAAA,CAAA,OAPS;AAAA,cAsCT,SAtCS,EAAA,CAAA,KAAA,EAsCW,IAtCX,CAsCgB,UAtChB,EAAA,WAAA,CAAA,EAAA,GAAA,MAAA,GAAA,MAAA;AAAA,cA6CT,gBA7CS,EAAA,CAAA,KAAA,EAAA,MAAA,EAAA,WAAA,EAAA,MAAA,EAAA,GAAA,MAAA,GAAA,MAAA;AAOnB,cA+CU,cA/CV,EAAA,CAAA,KAAA,EAAA,MAAA,EAAA,WAAA,EAAA,MAAA,EAAA,GAAA,MAAA,GAAA,MAAA;AAAU,cAwDA,aAxDA,EAAA,CAAA,KAAA,EAAA,MAAA,EAAA,WAAA,EAAA,MAAA,EAAA,GAAA,MAAA,GAAA,MAAA"}
+{"version":3,"file":"Toast.d.cts","names":[],"sources":["../src/Toast.tsx"],"sourcesContent":[],"mappings":";;;;;KAOY,UAAA;;;;EAAA,IAAA,EAIJ,QAJc;EAST,OAAA,EAmCZ,SAAA,GAAA,OAAA,GAAA,MAAA;EAnCqB,SAAA,CAAA,EAAA,OAAA;CAAA;AAAA,cAAT,KAAS,EAAA,CAAA;EAAA,SAAA;EAAA,KAAA;EAAA,WAAA;EAAA,IAAA;EAAA,OAAA;EAAA;AAAA,CAAA,EAOnB,UAPmB,EAAA,GAOT,mBAAA,CAAA,GAAA,CAAA,OAPS;AAAA,cAsCT,SAtCS,EAAA,CAAA,KAAA,EAsCW,IAtCX,CAsCgB,UAtChB,EAAA,WAAA,CAAA,EAAA,GAAA,MAAA,GAAA,MAAA;AAAA,cA6CT,gBA7CS,EAAA,CAAA,KAAA,EAAA,MAAA,EAAA,WAAA,EAAA,MAAA,EAAA,GAAA,MAAA,GAAA,MAAA;AAAA,cAsDT,cAtDS,EAAA,CAAA,KAAA,EAAA,MAAA,EAAA,WAAA,EAAA,MAAA,EAAA,GAAA,MAAA,GAAA,MAAA;AAOnB,cAwDU,aAxDV,EAAA,CAAA,KAAA,EAAA,MAAA,EAAA,WAAA,EAAA,MAAA,EAAA,GAAA,MAAA,GAAA,MAAA"}

package/dist/Toast.d.mts

@@ -1,6 +1,6 @@
 import { IconName } from "./icons/index.mjs";
 import "./Icon.mjs";
-import * as react_jsx_runtime29 from "react/jsx-runtime";
+import * as react_jsx_runtime27 from "react/jsx-runtime";
 
 //#region src/Toast.d.ts
 type ToastProps = {
@@ -18,7 +18,7 @@ declare const Toast: ({
   icon,
   variant,
   clearable
-}: ToastProps) => react_jsx_runtime29.JSX.Element;
+}: ToastProps) => react_jsx_runtime27.JSX.Element;
 declare const showToast: (props: Omit<ToastProps, "className">) => string | number;
 declare const showSuccessToast: (title: string, description: string) => string | number;
 declare const showErrorToast: (title: string, description: string) => string | number;

package/dist/Tooltip.cjs

@@ -9,7 +9,14 @@ classnames = require_rolldown_runtime.__toESM(classnames);
 let react_jsx_runtime = require("react/jsx-runtime");
 
 //#region src/Tooltip.tsx
-const Tooltip = ({ description, position, isOpen }) => {
+const Tooltip = ({ description, position, isOpen, className, crosshairProps = {
+	size: 4,
+	variant: "corners",
+	className: "text-shade-mute",
+	animationDelay: .15,
+	animationDuration: .75,
+	corners: position === "top-left" || position === "bottom-right" ? ["bottom-left", "top-right"] : ["bottom-right", "top-left"]
+} }) => {
 	const getPositionBasedAnimation = (position$1) => {
 		const baseAnimation = {
 			animate: {
@@ -92,18 +99,11 @@ const Tooltip = ({ description, position, isOpen }) => {
 	const animations = getPositionBasedAnimation(position);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(motion_react.AnimatePresence, { children: isOpen && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(motion_react.motion.div, {
 		...animations,
-		className: (0, classnames.default)("z-50 absolute font-medium w-max max-w-[200px] px-2.5 pt-1.5 pb-2 bg-card-foreground gradient-border before:bg-border text-xs leading-[150%] text-shade-tertiary", "after:absolute after:bg-border", !position.startsWith("center") && "after:!w-[10px] after:!h-[5px]", position.startsWith("center") && "after:!h-[10px] after:!w-[5px]", getTooltipPosition(position), getArrowPosition(position)),
+		className: (0, classnames.default)("z-50 absolute font-medium w-max max-w-[200px] px-2.5 pt-1.5 pb-2 bg-card-foreground gradient-border before:bg-border text-xs leading-[150%] text-shade-tertiary", "after:absolute after:bg-border", !position.startsWith("center") && "after:!w-[10px] after:!h-[5px]", position.startsWith("center") && "after:!h-[10px] after:!w-[5px]", getTooltipPosition(position), getArrowPosition(position), className),
 		style: { transformOrigin: getTransformOrigin(position) },
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 			className: "absolute inset-0.5",
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_CrossHair.CrosshairCorners, {
-				size: 4,
-				variant: "corners",
-				className: "text-shade-mute",
-				animationDelay: .15,
-				animationDuration: .75,
-				corners: position === "top-left" || position === "bottom-right" ? ["bottom-left", "top-right"] : ["bottom-right", "top-left"]
-			})
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_CrossHair.CrosshairCorners, { ...crosshairProps })
 		}), description]
 	}, position) });
 };

package/dist/Tooltip.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.cjs","names":["crisp","position","AnimatePresence","motion","CrosshairCorners"],"sources":["../src/Tooltip.tsx"],"sourcesContent":["\"use client\";\n\nimport classNames from \"classnames\";\nimport { AnimatePresence, motion } from \"motion/react\";\nimport { crisp, swift } from \"./utils/easings\";\nimport { CrosshairCorners } from \"./CrossHair\";\n\nexport type TooltipProps = {\n  description: string;\n  isOpen?: boolean;\n  position:\n    | \"top-left\"\n    | \"top-center\"\n    | \"top-right\"\n    | \"bottom-left\"\n    | \"bottom-center\"\n    | \"bottom-right\"\n    | \"center-left\"\n    | \"center-right\";\n};\n\nexport const Tooltip = ({ description, position, isOpen }: TooltipProps) => {\n  const getPositionBasedAnimation = (position: TooltipProps[\"position\"]) => {\n    const baseAnimation = {\n      animate: { opacity: 1, y: 0, x: 0, scale: 1 },\n      exit: { opacity: 0, scale: 0.9 },\n      transition: { duration: 0.15, ease: crisp, delay: 0.15 },\n    };\n\n    if (position.startsWith(\"bottom\")) {\n      return {\n        ...baseAnimation,\n        initial: { opacity: 0, y: -10, scale: 0.9 },\n        exit: { ...baseAnimation.exit, y: -10 },\n      };\n    } else if (position.startsWith(\"top\")) {\n      return {\n        ...baseAnimation,\n        initial: { opacity: 0, y: 10, scale: 0.9 },\n        exit: { ...baseAnimation.exit, y: 10 },\n      };\n    } else if (position.startsWith(\"center-left\")) {\n      return {\n        ...baseAnimation,\n        initial: { opacity: 0, x: 10, scale: 0.9 },\n        exit: { ...baseAnimation.exit, x: 10 },\n      };\n    } else if (position.startsWith(\"center-right\")) {\n      return {\n        ...baseAnimation,\n        initial: { opacity: 0, x: -10, scale: 0.9 },\n        exit: { ...baseAnimation.exit, x: -10 },\n      };\n    }\n\n    // Fallback to default animation\n    return {\n      ...baseAnimation,\n      initial: { opacity: 0, y: -10, scale: 0.9 },\n      exit: { ...baseAnimation.exit, y: -10 },\n    };\n  };\n\n  const animations = getPositionBasedAnimation(position);\n\n  return (\n    <AnimatePresence>\n      {isOpen && (\n        <motion.div\n          key={position}\n          {...animations}\n          className={classNames(\n            \"z-50 absolute font-medium w-max max-w-[200px] px-2.5 pt-1.5 pb-2 bg-card-foreground gradient-border before:bg-border text-xs leading-[150%] text-shade-tertiary\",\n            \"after:absolute after:bg-border\",\n            !position.startsWith(\"center\") && \"after:!w-[10px] after:!h-[5px]\",\n            position.startsWith(\"center\") && \"after:!h-[10px] after:!w-[5px]\",\n            getTooltipPosition(position),\n            getArrowPosition(position)\n          )}\n          style={{ transformOrigin: getTransformOrigin(position) }}\n        >\n          <div className=\"absolute inset-0.5\">\n            <CrosshairCorners\n              size={4}\n              variant=\"corners\"\n              className=\"text-shade-mute\"\n              animationDelay={0.15}\n              animationDuration={0.75}\n              corners={\n                position === \"top-left\" || position === \"bottom-right\"\n                  ? [\"bottom-left\", \"top-right\"]\n                  : [\"bottom-right\", \"top-left\"]\n              }\n            />\n          </div>\n          {description}\n        </motion.div>\n      )}\n    </AnimatePresence>\n  );\n};\n\nconst getTooltipPosition = (position: TooltipProps[\"position\"]) => {\n  switch (position) {\n    case \"top-right\":\n      return \"bottom-[calc(100%+6px)] left-1/2 mb-1\";\n    case \"top-center\":\n      return \"bottom-[calc(100%+6px)] left-1/2 -translate-x-1/2 mb-1\";\n    case \"top-left\":\n      return \"bottom-[calc(100%+6px)] right-1/2 mb-1\";\n    case \"bottom-right\":\n      return \"top-[calc(100%+6px)] left-1/2 mt-1\";\n    case \"bottom-center\":\n      return \"top-[calc(100%+6px)] left-1/2 -translate-x-1/2 mt-1\";\n    case \"bottom-left\":\n      return \"top-[calc(100%+6px)] right-1/2 mt-1\";\n    case \"center-left\":\n      return \"right-[calc(100%+6px)] top-1/2 -translate-y-1/2 mr-1\";\n    case \"center-right\":\n      return \"left-[calc(100%+6px)] top-1/2 -translate-y-1/2 ml-1\";\n  }\n};\n\nconst getTransformOrigin = (position: TooltipProps[\"position\"]) => {\n  switch (position) {\n    case \"bottom-right\":\n      return \"bottom left\";\n    case \"bottom-center\":\n      return \"bottom center\";\n    case \"bottom-left\":\n      return \"bottom right\";\n    case \"top-right\":\n      return \"top left\";\n    case \"top-center\":\n      return \"top center\";\n    case \"top-left\":\n      return \"top right\";\n    case \"center-left\":\n      return \"center right\";\n    case \"center-right\":\n      return \"center left\";\n  }\n};\n\nconst getArrowPosition = (position: TooltipProps[\"position\"]) => {\n  switch (position) {\n    case \"bottom-right\":\n      return \"after:top-[calc(0%-5px)] after:left-0 after:[clip-path:polygon(0%_0%,100%_100%,0%_100%,0%_0%)]\";\n    case \"bottom-center\":\n      return \"after:top-[calc(0%-5px)] after:left-1/2 after:-translate-x-1/2 after:[clip-path:polygon(50%_0%,0%_100%,100%_100%)]\";\n    case \"bottom-left\":\n      return \"after:top-[calc(0%-5px)] after:right-0 after:[clip-path:polygon(100%_0%,0%_100%,100%_100%,100%_0%)]\";\n    case \"top-right\":\n      return \"after:bottom-[calc(0%-5px)] after:left-0 after:[clip-path:polygon(0%_100%,100%_0%,0%_0%,0%_100%)]\";\n    case \"top-center\":\n      return \"after:bottom-[calc(0%-5px)] after:left-1/2 after:-translate-x-1/2 after:[clip-path:polygon(50%_100%,0%_0%,100%_0%)]\";\n    case \"top-left\":\n      return \"after:bottom-[calc(0%-5px)] after:right-0 after:[clip-path:polygon(100%_100%,0%_0%,100%_0%,100%_100%)]\";\n    case \"center-right\":\n      return \"after:top-1/2 after:left-[calc(0%-5px)] after:-translate-y-1/2 after:[clip-path:polygon(100%_0%,0%_50%,100%_100%)]\";\n    case \"center-left\":\n      return \"after:top-1/2 after:right-[calc(0%-5px)] after:-translate-y-1/2 after:[clip-path:polygon(0%_0%,100%_50%,0%_100%)]\";\n  }\n};\n"],"mappings":";;;;;;;;;;;AAqBA,MAAa,WAAW,EAAE,aAAa,UAAU,aAA2B;CAC1E,MAAM,6BAA6B,eAAuC;EACxE,MAAM,gBAAgB;GACpB,SAAS;IAAE,SAAS;IAAG,GAAG;IAAG,GAAG;IAAG,OAAO;IAAG;GAC7C,MAAM;IAAE,SAAS;IAAG,OAAO;IAAK;GAChC,YAAY;IAAE,UAAU;IAAM,MAAMA;IAAO,OAAO;IAAM;GACzD;AAED,MAAIC,WAAS,WAAW,SAAS,CAC/B,QAAO;GACL,GAAG;GACH,SAAS;IAAE,SAAS;IAAG,GAAG;IAAK,OAAO;IAAK;GAC3C,MAAM;IAAE,GAAG,cAAc;IAAM,GAAG;IAAK;GACxC;WACQA,WAAS,WAAW,MAAM,CACnC,QAAO;GACL,GAAG;GACH,SAAS;IAAE,SAAS;IAAG,GAAG;IAAI,OAAO;IAAK;GAC1C,MAAM;IAAE,GAAG,cAAc;IAAM,GAAG;IAAI;GACvC;WACQA,WAAS,WAAW,cAAc,CAC3C,QAAO;GACL,GAAG;GACH,SAAS;IAAE,SAAS;IAAG,GAAG;IAAI,OAAO;IAAK;GAC1C,MAAM;IAAE,GAAG,cAAc;IAAM,GAAG;IAAI;GACvC;WACQA,WAAS,WAAW,eAAe,CAC5C,QAAO;GACL,GAAG;GACH,SAAS;IAAE,SAAS;IAAG,GAAG;IAAK,OAAO;IAAK;GAC3C,MAAM;IAAE,GAAG,cAAc;IAAM,GAAG;IAAK;GACxC;AAIH,SAAO;GACL,GAAG;GACH,SAAS;IAAE,SAAS;IAAG,GAAG;IAAK,OAAO;IAAK;GAC3C,MAAM;IAAE,GAAG,cAAc;IAAM,GAAG;IAAK;GACxC;;CAGH,MAAM,aAAa,0BAA0B,SAAS;AAEtD,QACE,2CAACC,0CACE,UACC,4CAACC,oBAAO;EAEN,GAAI;EACJ,mCACE,mKACA,kCACA,CAAC,SAAS,WAAW,SAAS,IAAI,kCAClC,SAAS,WAAW,SAAS,IAAI,kCACjC,mBAAmB,SAAS,EAC5B,iBAAiB,SAAS,CAC3B;EACD,OAAO,EAAE,iBAAiB,mBAAmB,SAAS,EAAE;aAExD,2CAAC;GAAI,WAAU;aACb,2CAACC;IACC,MAAM;IACN,SAAQ;IACR,WAAU;IACV,gBAAgB;IAChB,mBAAmB;IACnB,SACE,aAAa,cAAc,aAAa,iBACpC,CAAC,eAAe,YAAY,GAC5B,CAAC,gBAAgB,WAAW;KAElC;IACE,EACL;IA1BI,SA2BM,GAEC;;AAItB,MAAM,sBAAsB,aAAuC;AACjE,SAAQ,UAAR;EACE,KAAK,YACH,QAAO;EACT,KAAK,aACH,QAAO;EACT,KAAK,WACH,QAAO;EACT,KAAK,eACH,QAAO;EACT,KAAK,gBACH,QAAO;EACT,KAAK,cACH,QAAO;EACT,KAAK,cACH,QAAO;EACT,KAAK,eACH,QAAO;;;AAIb,MAAM,sBAAsB,aAAuC;AACjE,SAAQ,UAAR;EACE,KAAK,eACH,QAAO;EACT,KAAK,gBACH,QAAO;EACT,KAAK,cACH,QAAO;EACT,KAAK,YACH,QAAO;EACT,KAAK,aACH,QAAO;EACT,KAAK,WACH,QAAO;EACT,KAAK,cACH,QAAO;EACT,KAAK,eACH,QAAO;;;AAIb,MAAM,oBAAoB,aAAuC;AAC/D,SAAQ,UAAR;EACE,KAAK,eACH,QAAO;EACT,KAAK,gBACH,QAAO;EACT,KAAK,cACH,QAAO;EACT,KAAK,YACH,QAAO;EACT,KAAK,aACH,QAAO;EACT,KAAK,WACH,QAAO;EACT,KAAK,eACH,QAAO;EACT,KAAK,cACH,QAAO"}
+{"version":3,"file":"Tooltip.cjs","names":["crisp","position","AnimatePresence","motion","CrosshairCorners"],"sources":["../src/Tooltip.tsx"],"sourcesContent":["\"use client\";\n\nimport classNames from \"classnames\";\nimport { AnimatePresence, motion } from \"motion/react\";\nimport { crisp, swift } from \"./utils/easings\";\nimport { CrosshairCorners, CrosshairCornersProps } from \"./CrossHair\";\n\nexport type TooltipProps = {\n  description: string;\n  isOpen?: boolean;\n  position:\n  | \"top-left\"\n  | \"top-center\"\n  | \"top-right\"\n  | \"bottom-left\"\n  | \"bottom-center\"\n  | \"bottom-right\"\n  | \"center-left\"\n  | \"center-right\";\n  crosshairProps?: CrosshairCornersProps;\n  className?: string;\n};\n\nexport const Tooltip = ({ description, position, isOpen, className, crosshairProps = {\n  size: 4,\n  variant: \"corners\",\n  className: \"text-shade-mute\",\n  animationDelay: 0.15,\n  animationDuration: 0.75,\n  corners: position === \"top-left\" || position === \"bottom-right\"\n    ? [\"bottom-left\", \"top-right\"]\n    : [\"bottom-right\", \"top-left\"]\n} }: TooltipProps) => {\n  const getPositionBasedAnimation = (position: TooltipProps[\"position\"]) => {\n    const baseAnimation = {\n      animate: { opacity: 1, y: 0, x: 0, scale: 1 },\n      exit: { opacity: 0, scale: 0.9 },\n      transition: { duration: 0.15, ease: crisp, delay: 0.15 },\n    };\n\n    if (position.startsWith(\"bottom\")) {\n      return {\n        ...baseAnimation,\n        initial: { opacity: 0, y: -10, scale: 0.9 },\n        exit: { ...baseAnimation.exit, y: -10 },\n      };\n    } else if (position.startsWith(\"top\")) {\n      return {\n        ...baseAnimation,\n        initial: { opacity: 0, y: 10, scale: 0.9 },\n        exit: { ...baseAnimation.exit, y: 10 },\n      };\n    } else if (position.startsWith(\"center-left\")) {\n      return {\n        ...baseAnimation,\n        initial: { opacity: 0, x: 10, scale: 0.9 },\n        exit: { ...baseAnimation.exit, x: 10 },\n      };\n    } else if (position.startsWith(\"center-right\")) {\n      return {\n        ...baseAnimation,\n        initial: { opacity: 0, x: -10, scale: 0.9 },\n        exit: { ...baseAnimation.exit, x: -10 },\n      };\n    }\n\n    // Fallback to default animation\n    return {\n      ...baseAnimation,\n      initial: { opacity: 0, y: -10, scale: 0.9 },\n      exit: { ...baseAnimation.exit, y: -10 },\n    };\n  };\n\n  const animations = getPositionBasedAnimation(position);\n\n  return (\n    <AnimatePresence>\n      {isOpen && (\n        <motion.div\n          key={position}\n          {...animations}\n          className={classNames(\n            \"z-50 absolute font-medium w-max max-w-[200px] px-2.5 pt-1.5 pb-2 bg-card-foreground gradient-border before:bg-border text-xs leading-[150%] text-shade-tertiary\",\n            \"after:absolute after:bg-border\",\n            !position.startsWith(\"center\") && \"after:!w-[10px] after:!h-[5px]\",\n            position.startsWith(\"center\") && \"after:!h-[10px] after:!w-[5px]\",\n            getTooltipPosition(position),\n            getArrowPosition(position),\n            className\n          )}\n          style={{ transformOrigin: getTransformOrigin(position) }}\n        >\n          <div className=\"absolute inset-0.5\">\n            <CrosshairCorners\n              {...crosshairProps}\n            />\n          </div>\n          {description}\n        </motion.div>\n      )}\n    </AnimatePresence>\n  );\n};\n\nconst getTooltipPosition = (position: TooltipProps[\"position\"]) => {\n  switch (position) {\n    case \"top-right\":\n      return \"bottom-[calc(100%+6px)] left-1/2 mb-1\";\n    case \"top-center\":\n      return \"bottom-[calc(100%+6px)] left-1/2 -translate-x-1/2 mb-1\";\n    case \"top-left\":\n      return \"bottom-[calc(100%+6px)] right-1/2 mb-1\";\n    case \"bottom-right\":\n      return \"top-[calc(100%+6px)] left-1/2 mt-1\";\n    case \"bottom-center\":\n      return \"top-[calc(100%+6px)] left-1/2 -translate-x-1/2 mt-1\";\n    case \"bottom-left\":\n      return \"top-[calc(100%+6px)] right-1/2 mt-1\";\n    case \"center-left\":\n      return \"right-[calc(100%+6px)] top-1/2 -translate-y-1/2 mr-1\";\n    case \"center-right\":\n      return \"left-[calc(100%+6px)] top-1/2 -translate-y-1/2 ml-1\";\n  }\n};\n\nconst getTransformOrigin = (position: TooltipProps[\"position\"]) => {\n  switch (position) {\n    case \"bottom-right\":\n      return \"bottom left\";\n    case \"bottom-center\":\n      return \"bottom center\";\n    case \"bottom-left\":\n      return \"bottom right\";\n    case \"top-right\":\n      return \"top left\";\n    case \"top-center\":\n      return \"top center\";\n    case \"top-left\":\n      return \"top right\";\n    case \"center-left\":\n      return \"center right\";\n    case \"center-right\":\n      return \"center left\";\n  }\n};\n\nconst getArrowPosition = (position: TooltipProps[\"position\"]) => {\n  switch (position) {\n    case \"bottom-right\":\n      return \"after:top-[calc(0%-5px)] after:left-0 after:[clip-path:polygon(0%_0%,100%_100%,0%_100%,0%_0%)]\";\n    case \"bottom-center\":\n      return \"after:top-[calc(0%-5px)] after:left-1/2 after:-translate-x-1/2 after:[clip-path:polygon(50%_0%,0%_100%,100%_100%)]\";\n    case \"bottom-left\":\n      return \"after:top-[calc(0%-5px)] after:right-0 after:[clip-path:polygon(100%_0%,0%_100%,100%_100%,100%_0%)]\";\n    case \"top-right\":\n      return \"after:bottom-[calc(0%-5px)] after:left-0 after:[clip-path:polygon(0%_100%,100%_0%,0%_0%,0%_100%)]\";\n    case \"top-center\":\n      return \"after:bottom-[calc(0%-5px)] after:left-1/2 after:-translate-x-1/2 after:[clip-path:polygon(50%_100%,0%_0%,100%_0%)]\";\n    case \"top-left\":\n      return \"after:bottom-[calc(0%-5px)] after:right-0 after:[clip-path:polygon(100%_100%,0%_0%,100%_0%,100%_100%)]\";\n    case \"center-right\":\n      return \"after:top-1/2 after:left-[calc(0%-5px)] after:-translate-y-1/2 after:[clip-path:polygon(100%_0%,0%_50%,100%_100%)]\";\n    case \"center-left\":\n      return \"after:top-1/2 after:right-[calc(0%-5px)] after:-translate-y-1/2 after:[clip-path:polygon(0%_0%,100%_50%,0%_100%)]\";\n  }\n};\n"],"mappings":";;;;;;;;;;;AAuBA,MAAa,WAAW,EAAE,aAAa,UAAU,QAAQ,WAAW,iBAAiB;CACnF,MAAM;CACN,SAAS;CACT,WAAW;CACX,gBAAgB;CAChB,mBAAmB;CACnB,SAAS,aAAa,cAAc,aAAa,iBAC7C,CAAC,eAAe,YAAY,GAC5B,CAAC,gBAAgB,WAAW;CACjC,OAAqB;CACpB,MAAM,6BAA6B,eAAuC;EACxE,MAAM,gBAAgB;GACpB,SAAS;IAAE,SAAS;IAAG,GAAG;IAAG,GAAG;IAAG,OAAO;IAAG;GAC7C,MAAM;IAAE,SAAS;IAAG,OAAO;IAAK;GAChC,YAAY;IAAE,UAAU;IAAM,MAAMA;IAAO,OAAO;IAAM;GACzD;AAED,MAAIC,WAAS,WAAW,SAAS,CAC/B,QAAO;GACL,GAAG;GACH,SAAS;IAAE,SAAS;IAAG,GAAG;IAAK,OAAO;IAAK;GAC3C,MAAM;IAAE,GAAG,cAAc;IAAM,GAAG;IAAK;GACxC;WACQA,WAAS,WAAW,MAAM,CACnC,QAAO;GACL,GAAG;GACH,SAAS;IAAE,SAAS;IAAG,GAAG;IAAI,OAAO;IAAK;GAC1C,MAAM;IAAE,GAAG,cAAc;IAAM,GAAG;IAAI;GACvC;WACQA,WAAS,WAAW,cAAc,CAC3C,QAAO;GACL,GAAG;GACH,SAAS;IAAE,SAAS;IAAG,GAAG;IAAI,OAAO;IAAK;GAC1C,MAAM;IAAE,GAAG,cAAc;IAAM,GAAG;IAAI;GACvC;WACQA,WAAS,WAAW,eAAe,CAC5C,QAAO;GACL,GAAG;GACH,SAAS;IAAE,SAAS;IAAG,GAAG;IAAK,OAAO;IAAK;GAC3C,MAAM;IAAE,GAAG,cAAc;IAAM,GAAG;IAAK;GACxC;AAIH,SAAO;GACL,GAAG;GACH,SAAS;IAAE,SAAS;IAAG,GAAG;IAAK,OAAO;IAAK;GAC3C,MAAM;IAAE,GAAG,cAAc;IAAM,GAAG;IAAK;GACxC;;CAGH,MAAM,aAAa,0BAA0B,SAAS;AAEtD,QACE,2CAACC,0CACE,UACC,4CAACC,oBAAO;EAEN,GAAI;EACJ,mCACE,mKACA,kCACA,CAAC,SAAS,WAAW,SAAS,IAAI,kCAClC,SAAS,WAAW,SAAS,IAAI,kCACjC,mBAAmB,SAAS,EAC5B,iBAAiB,SAAS,EAC1B,UACD;EACD,OAAO,EAAE,iBAAiB,mBAAmB,SAAS,EAAE;aAExD,2CAAC;GAAI,WAAU;aACb,2CAACC,sCACC,GAAI,iBACJ;IACE,EACL;IAlBI,SAmBM,GAEC;;AAItB,MAAM,sBAAsB,aAAuC;AACjE,SAAQ,UAAR;EACE,KAAK,YACH,QAAO;EACT,KAAK,aACH,QAAO;EACT,KAAK,WACH,QAAO;EACT,KAAK,eACH,QAAO;EACT,KAAK,gBACH,QAAO;EACT,KAAK,cACH,QAAO;EACT,KAAK,cACH,QAAO;EACT,KAAK,eACH,QAAO;;;AAIb,MAAM,sBAAsB,aAAuC;AACjE,SAAQ,UAAR;EACE,KAAK,eACH,QAAO;EACT,KAAK,gBACH,QAAO;EACT,KAAK,cACH,QAAO;EACT,KAAK,YACH,QAAO;EACT,KAAK,aACH,QAAO;EACT,KAAK,WACH,QAAO;EACT,KAAK,cACH,QAAO;EACT,KAAK,eACH,QAAO;;;AAIb,MAAM,oBAAoB,aAAuC;AAC/D,SAAQ,UAAR;EACE,KAAK,eACH,QAAO;EACT,KAAK,gBACH,QAAO;EACT,KAAK,cACH,QAAO;EACT,KAAK,YACH,QAAO;EACT,KAAK,aACH,QAAO;EACT,KAAK,WACH,QAAO;EACT,KAAK,eACH,QAAO;EACT,KAAK,cACH,QAAO"}

package/dist/Tooltip.d.cts

@@ -1,3 +1,4 @@
+import { CrosshairCornersProps } from "./CrossHair.cjs";
 import * as react_jsx_runtime23 from "react/jsx-runtime";
 
 //#region src/Tooltip.d.ts
@@ -5,11 +6,15 @@ type TooltipProps = {
   description: string;
   isOpen?: boolean;
   position: "top-left" | "top-center" | "top-right" | "bottom-left" | "bottom-center" | "bottom-right" | "center-left" | "center-right";
+  crosshairProps?: CrosshairCornersProps;
+  className?: string;
 };
 declare const Tooltip: ({
   description,
   position,
-  isOpen
+  isOpen,
+  className,
+  crosshairProps
 }: TooltipProps) => react_jsx_runtime23.JSX.Element;
 //#endregion
 export { Tooltip, TooltipProps };

package/dist/Tooltip.d.cts.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.d.cts","names":[],"sources":["../src/Tooltip.tsx"],"sourcesContent":[],"mappings":";;;KAOY,YAAA;;;EAAA,QAAA,EAAA,UAAY,GAAA,YAAA,GAAA,WAAA,GAAA,aAAA,GAAA,eAAA,GAAA,cAAA,GAAA,aAAA,GAAA,cAAA;AAcxB,CAAA;AAAwB,cAAX,OAAW,EAAA,CAAA;EAAA,WAAA;EAAA,QAAA;EAAA;AAAA,CAAA,EAAmC,YAAnC,EAAA,GAA+C,mBAAA,CAAA,GAAA,CAAA,OAA/C"}
+{"version":3,"file":"Tooltip.d.cts","names":[],"sources":["../src/Tooltip.tsx"],"sourcesContent":[],"mappings":";;;;KAOY,YAAA;;;EAAA,QAAA,EAAA,UAAY,GAAA,YAYL,GAAA,WAAqB,GAAA,aAAA,GAAA,eAAA,GAAA,cAAA,GAAA,aAAA,GAAA,cAAA;EAI3B,cAgFZ,CAAA,EApFkB,qBAoFlB;EAhFuB,SAAA,CAAA,EAAA,MAAA;CAAA;AAAA,cAAX,OAAW,EAAA,CAAA;EAAA,WAAA;EAAA,QAAA;EAAA,MAAA;EAAA,SAAA;EAAA;AAAA,CAAA,EASnB,YATmB,EAAA,GASP,mBAAA,CAAA,GAAA,CAAA,OATO"}

package/dist/Tooltip.d.mts

@@ -1,16 +1,21 @@
-import * as react_jsx_runtime17 from "react/jsx-runtime";
+import { CrosshairCornersProps } from "./CrossHair.mjs";
+import * as react_jsx_runtime18 from "react/jsx-runtime";
 
 //#region src/Tooltip.d.ts
 type TooltipProps = {
   description: string;
   isOpen?: boolean;
   position: "top-left" | "top-center" | "top-right" | "bottom-left" | "bottom-center" | "bottom-right" | "center-left" | "center-right";
+  crosshairProps?: CrosshairCornersProps;
+  className?: string;
 };
 declare const Tooltip: ({
   description,
   position,
-  isOpen
-}: TooltipProps) => react_jsx_runtime17.JSX.Element;
+  isOpen,
+  className,
+  crosshairProps
+}: TooltipProps) => react_jsx_runtime18.JSX.Element;
 //#endregion
 export { Tooltip, TooltipProps };
 //# sourceMappingURL=Tooltip.d.mts.map

package/dist/Tooltip.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.d.mts","names":[],"sources":["../src/Tooltip.tsx"],"sourcesContent":[],"mappings":";;;KAOY,YAAA;;;EAAA,QAAA,EAAA,UAAY,GAAA,YAAA,GAAA,WAAA,GAAA,aAAA,GAAA,eAAA,GAAA,cAAA,GAAA,aAAA,GAAA,cAAA;AAcxB,CAAA;AAAwB,cAAX,OAAW,EAAA,CAAA;EAAA,WAAA;EAAA,QAAA;EAAA;AAAA,CAAA,EAAmC,YAAnC,EAAA,GAA+C,mBAAA,CAAA,GAAA,CAAA,OAA/C"}
+{"version":3,"file":"Tooltip.d.mts","names":[],"sources":["../src/Tooltip.tsx"],"sourcesContent":[],"mappings":";;;;KAOY,YAAA;;;EAAA,QAAA,EAAA,UAAY,GAAA,YAYL,GAAA,WAAqB,GAAA,aAAA,GAAA,eAAA,GAAA,cAAA,GAAA,aAAA,GAAA,cAAA;EAI3B,cAgFZ,CAAA,EApFkB,qBAoFlB;EAhFuB,SAAA,CAAA,EAAA,MAAA;CAAA;AAAA,cAAX,OAAW,EAAA,CAAA;EAAA,WAAA;EAAA,QAAA;EAAA,MAAA;EAAA,SAAA;EAAA;AAAA,CAAA,EASnB,YATmB,EAAA,GASP,mBAAA,CAAA,GAAA,CAAA,OATO"}

package/dist/Tooltip.mjs

@@ -7,7 +7,14 @@ import classNames from "classnames";
 import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/Tooltip.tsx
-const Tooltip = ({ description, position, isOpen }) => {
+const Tooltip = ({ description, position, isOpen, className, crosshairProps = {
+	size: 4,
+	variant: "corners",
+	className: "text-shade-mute",
+	animationDelay: .15,
+	animationDuration: .75,
+	corners: position === "top-left" || position === "bottom-right" ? ["bottom-left", "top-right"] : ["bottom-right", "top-left"]
+} }) => {
 	const getPositionBasedAnimation = (position$1) => {
 		const baseAnimation = {
 			animate: {
@@ -90,18 +97,11 @@ const Tooltip = ({ description, position, isOpen }) => {
 	const animations = getPositionBasedAnimation(position);
 	return /* @__PURE__ */ jsx(AnimatePresence, { children: isOpen && /* @__PURE__ */ jsxs(motion.div, {
 		...animations,
-		className: classNames("z-50 absolute font-medium w-max max-w-[200px] px-2.5 pt-1.5 pb-2 bg-card-foreground gradient-border before:bg-border text-xs leading-[150%] text-shade-tertiary", "after:absolute after:bg-border", !position.startsWith("center") && "after:!w-[10px] after:!h-[5px]", position.startsWith("center") && "after:!h-[10px] after:!w-[5px]", getTooltipPosition(position), getArrowPosition(position)),
+		className: classNames("z-50 absolute font-medium w-max max-w-[200px] px-2.5 pt-1.5 pb-2 bg-card-foreground gradient-border before:bg-border text-xs leading-[150%] text-shade-tertiary", "after:absolute after:bg-border", !position.startsWith("center") && "after:!w-[10px] after:!h-[5px]", position.startsWith("center") && "after:!h-[10px] after:!w-[5px]", getTooltipPosition(position), getArrowPosition(position), className),
 		style: { transformOrigin: getTransformOrigin(position) },
 		children: [/* @__PURE__ */ jsx("div", {
 			className: "absolute inset-0.5",
-			children: /* @__PURE__ */ jsx(CrosshairCorners, {
-				size: 4,
-				variant: "corners",
-				className: "text-shade-mute",
-				animationDelay: .15,
-				animationDuration: .75,
-				corners: position === "top-left" || position === "bottom-right" ? ["bottom-left", "top-right"] : ["bottom-right", "top-left"]
-			})
+			children: /* @__PURE__ */ jsx(CrosshairCorners, { ...crosshairProps })
 		}), description]
 	}, position) });
 };

package/dist/Tooltip.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.mjs","names":["position"],"sources":["../src/Tooltip.tsx"],"sourcesContent":["\"use client\";\n\nimport classNames from \"classnames\";\nimport { AnimatePresence, motion } from \"motion/react\";\nimport { crisp, swift } from \"./utils/easings\";\nimport { CrosshairCorners } from \"./CrossHair\";\n\nexport type TooltipProps = {\n  description: string;\n  isOpen?: boolean;\n  position:\n    | \"top-left\"\n    | \"top-center\"\n    | \"top-right\"\n    | \"bottom-left\"\n    | \"bottom-center\"\n    | \"bottom-right\"\n    | \"center-left\"\n    | \"center-right\";\n};\n\nexport const Tooltip = ({ description, position, isOpen }: TooltipProps) => {\n  const getPositionBasedAnimation = (position: TooltipProps[\"position\"]) => {\n    const baseAnimation = {\n      animate: { opacity: 1, y: 0, x: 0, scale: 1 },\n      exit: { opacity: 0, scale: 0.9 },\n      transition: { duration: 0.15, ease: crisp, delay: 0.15 },\n    };\n\n    if (position.startsWith(\"bottom\")) {\n      return {\n        ...baseAnimation,\n        initial: { opacity: 0, y: -10, scale: 0.9 },\n        exit: { ...baseAnimation.exit, y: -10 },\n      };\n    } else if (position.startsWith(\"top\")) {\n      return {\n        ...baseAnimation,\n        initial: { opacity: 0, y: 10, scale: 0.9 },\n        exit: { ...baseAnimation.exit, y: 10 },\n      };\n    } else if (position.startsWith(\"center-left\")) {\n      return {\n        ...baseAnimation,\n        initial: { opacity: 0, x: 10, scale: 0.9 },\n        exit: { ...baseAnimation.exit, x: 10 },\n      };\n    } else if (position.startsWith(\"center-right\")) {\n      return {\n        ...baseAnimation,\n        initial: { opacity: 0, x: -10, scale: 0.9 },\n        exit: { ...baseAnimation.exit, x: -10 },\n      };\n    }\n\n    // Fallback to default animation\n    return {\n      ...baseAnimation,\n      initial: { opacity: 0, y: -10, scale: 0.9 },\n      exit: { ...baseAnimation.exit, y: -10 },\n    };\n  };\n\n  const animations = getPositionBasedAnimation(position);\n\n  return (\n    <AnimatePresence>\n      {isOpen && (\n        <motion.div\n          key={position}\n          {...animations}\n          className={classNames(\n            \"z-50 absolute font-medium w-max max-w-[200px] px-2.5 pt-1.5 pb-2 bg-card-foreground gradient-border before:bg-border text-xs leading-[150%] text-shade-tertiary\",\n            \"after:absolute after:bg-border\",\n            !position.startsWith(\"center\") && \"after:!w-[10px] after:!h-[5px]\",\n            position.startsWith(\"center\") && \"after:!h-[10px] after:!w-[5px]\",\n            getTooltipPosition(position),\n            getArrowPosition(position)\n          )}\n          style={{ transformOrigin: getTransformOrigin(position) }}\n        >\n          <div className=\"absolute inset-0.5\">\n            <CrosshairCorners\n              size={4}\n              variant=\"corners\"\n              className=\"text-shade-mute\"\n              animationDelay={0.15}\n              animationDuration={0.75}\n              corners={\n                position === \"top-left\" || position === \"bottom-right\"\n                  ? [\"bottom-left\", \"top-right\"]\n                  : [\"bottom-right\", \"top-left\"]\n              }\n            />\n          </div>\n          {description}\n        </motion.div>\n      )}\n    </AnimatePresence>\n  );\n};\n\nconst getTooltipPosition = (position: TooltipProps[\"position\"]) => {\n  switch (position) {\n    case \"top-right\":\n      return \"bottom-[calc(100%+6px)] left-1/2 mb-1\";\n    case \"top-center\":\n      return \"bottom-[calc(100%+6px)] left-1/2 -translate-x-1/2 mb-1\";\n    case \"top-left\":\n      return \"bottom-[calc(100%+6px)] right-1/2 mb-1\";\n    case \"bottom-right\":\n      return \"top-[calc(100%+6px)] left-1/2 mt-1\";\n    case \"bottom-center\":\n      return \"top-[calc(100%+6px)] left-1/2 -translate-x-1/2 mt-1\";\n    case \"bottom-left\":\n      return \"top-[calc(100%+6px)] right-1/2 mt-1\";\n    case \"center-left\":\n      return \"right-[calc(100%+6px)] top-1/2 -translate-y-1/2 mr-1\";\n    case \"center-right\":\n      return \"left-[calc(100%+6px)] top-1/2 -translate-y-1/2 ml-1\";\n  }\n};\n\nconst getTransformOrigin = (position: TooltipProps[\"position\"]) => {\n  switch (position) {\n    case \"bottom-right\":\n      return \"bottom left\";\n    case \"bottom-center\":\n      return \"bottom center\";\n    case \"bottom-left\":\n      return \"bottom right\";\n    case \"top-right\":\n      return \"top left\";\n    case \"top-center\":\n      return \"top center\";\n    case \"top-left\":\n      return \"top right\";\n    case \"center-left\":\n      return \"center right\";\n    case \"center-right\":\n      return \"center left\";\n  }\n};\n\nconst getArrowPosition = (position: TooltipProps[\"position\"]) => {\n  switch (position) {\n    case \"bottom-right\":\n      return \"after:top-[calc(0%-5px)] after:left-0 after:[clip-path:polygon(0%_0%,100%_100%,0%_100%,0%_0%)]\";\n    case \"bottom-center\":\n      return \"after:top-[calc(0%-5px)] after:left-1/2 after:-translate-x-1/2 after:[clip-path:polygon(50%_0%,0%_100%,100%_100%)]\";\n    case \"bottom-left\":\n      return \"after:top-[calc(0%-5px)] after:right-0 after:[clip-path:polygon(100%_0%,0%_100%,100%_100%,100%_0%)]\";\n    case \"top-right\":\n      return \"after:bottom-[calc(0%-5px)] after:left-0 after:[clip-path:polygon(0%_100%,100%_0%,0%_0%,0%_100%)]\";\n    case \"top-center\":\n      return \"after:bottom-[calc(0%-5px)] after:left-1/2 after:-translate-x-1/2 after:[clip-path:polygon(50%_100%,0%_0%,100%_0%)]\";\n    case \"top-left\":\n      return \"after:bottom-[calc(0%-5px)] after:right-0 after:[clip-path:polygon(100%_100%,0%_0%,100%_0%,100%_100%)]\";\n    case \"center-right\":\n      return \"after:top-1/2 after:left-[calc(0%-5px)] after:-translate-y-1/2 after:[clip-path:polygon(100%_0%,0%_50%,100%_100%)]\";\n    case \"center-left\":\n      return \"after:top-1/2 after:right-[calc(0%-5px)] after:-translate-y-1/2 after:[clip-path:polygon(0%_0%,100%_50%,0%_100%)]\";\n  }\n};\n"],"mappings":";;;;;;;;;AAqBA,MAAa,WAAW,EAAE,aAAa,UAAU,aAA2B;CAC1E,MAAM,6BAA6B,eAAuC;EACxE,MAAM,gBAAgB;GACpB,SAAS;IAAE,SAAS;IAAG,GAAG;IAAG,GAAG;IAAG,OAAO;IAAG;GAC7C,MAAM;IAAE,SAAS;IAAG,OAAO;IAAK;GAChC,YAAY;IAAE,UAAU;IAAM,MAAM;IAAO,OAAO;IAAM;GACzD;AAED,MAAIA,WAAS,WAAW,SAAS,CAC/B,QAAO;GACL,GAAG;GACH,SAAS;IAAE,SAAS;IAAG,GAAG;IAAK,OAAO;IAAK;GAC3C,MAAM;IAAE,GAAG,cAAc;IAAM,GAAG;IAAK;GACxC;WACQA,WAAS,WAAW,MAAM,CACnC,QAAO;GACL,GAAG;GACH,SAAS;IAAE,SAAS;IAAG,GAAG;IAAI,OAAO;IAAK;GAC1C,MAAM;IAAE,GAAG,cAAc;IAAM,GAAG;IAAI;GACvC;WACQA,WAAS,WAAW,cAAc,CAC3C,QAAO;GACL,GAAG;GACH,SAAS;IAAE,SAAS;IAAG,GAAG;IAAI,OAAO;IAAK;GAC1C,MAAM;IAAE,GAAG,cAAc;IAAM,GAAG;IAAI;GACvC;WACQA,WAAS,WAAW,eAAe,CAC5C,QAAO;GACL,GAAG;GACH,SAAS;IAAE,SAAS;IAAG,GAAG;IAAK,OAAO;IAAK;GAC3C,MAAM;IAAE,GAAG,cAAc;IAAM,GAAG;IAAK;GACxC;AAIH,SAAO;GACL,GAAG;GACH,SAAS;IAAE,SAAS;IAAG,GAAG;IAAK,OAAO;IAAK;GAC3C,MAAM;IAAE,GAAG,cAAc;IAAM,GAAG;IAAK;GACxC;;CAGH,MAAM,aAAa,0BAA0B,SAAS;AAEtD,QACE,oBAAC,6BACE,UACC,qBAAC,OAAO;EAEN,GAAI;EACJ,WAAW,WACT,mKACA,kCACA,CAAC,SAAS,WAAW,SAAS,IAAI,kCAClC,SAAS,WAAW,SAAS,IAAI,kCACjC,mBAAmB,SAAS,EAC5B,iBAAiB,SAAS,CAC3B;EACD,OAAO,EAAE,iBAAiB,mBAAmB,SAAS,EAAE;aAExD,oBAAC;GAAI,WAAU;aACb,oBAAC;IACC,MAAM;IACN,SAAQ;IACR,WAAU;IACV,gBAAgB;IAChB,mBAAmB;IACnB,SACE,aAAa,cAAc,aAAa,iBACpC,CAAC,eAAe,YAAY,GAC5B,CAAC,gBAAgB,WAAW;KAElC;IACE,EACL;IA1BI,SA2BM,GAEC;;AAItB,MAAM,sBAAsB,aAAuC;AACjE,SAAQ,UAAR;EACE,KAAK,YACH,QAAO;EACT,KAAK,aACH,QAAO;EACT,KAAK,WACH,QAAO;EACT,KAAK,eACH,QAAO;EACT,KAAK,gBACH,QAAO;EACT,KAAK,cACH,QAAO;EACT,KAAK,cACH,QAAO;EACT,KAAK,eACH,QAAO;;;AAIb,MAAM,sBAAsB,aAAuC;AACjE,SAAQ,UAAR;EACE,KAAK,eACH,QAAO;EACT,KAAK,gBACH,QAAO;EACT,KAAK,cACH,QAAO;EACT,KAAK,YACH,QAAO;EACT,KAAK,aACH,QAAO;EACT,KAAK,WACH,QAAO;EACT,KAAK,cACH,QAAO;EACT,KAAK,eACH,QAAO;;;AAIb,MAAM,oBAAoB,aAAuC;AAC/D,SAAQ,UAAR;EACE,KAAK,eACH,QAAO;EACT,KAAK,gBACH,QAAO;EACT,KAAK,cACH,QAAO;EACT,KAAK,YACH,QAAO;EACT,KAAK,aACH,QAAO;EACT,KAAK,WACH,QAAO;EACT,KAAK,eACH,QAAO;EACT,KAAK,cACH,QAAO"}
+{"version":3,"file":"Tooltip.mjs","names":["position"],"sources":["../src/Tooltip.tsx"],"sourcesContent":["\"use client\";\n\nimport classNames from \"classnames\";\nimport { AnimatePresence, motion } from \"motion/react\";\nimport { crisp, swift } from \"./utils/easings\";\nimport { CrosshairCorners, CrosshairCornersProps } from \"./CrossHair\";\n\nexport type TooltipProps = {\n  description: string;\n  isOpen?: boolean;\n  position:\n  | \"top-left\"\n  | \"top-center\"\n  | \"top-right\"\n  | \"bottom-left\"\n  | \"bottom-center\"\n  | \"bottom-right\"\n  | \"center-left\"\n  | \"center-right\";\n  crosshairProps?: CrosshairCornersProps;\n  className?: string;\n};\n\nexport const Tooltip = ({ description, position, isOpen, className, crosshairProps = {\n  size: 4,\n  variant: \"corners\",\n  className: \"text-shade-mute\",\n  animationDelay: 0.15,\n  animationDuration: 0.75,\n  corners: position === \"top-left\" || position === \"bottom-right\"\n    ? [\"bottom-left\", \"top-right\"]\n    : [\"bottom-right\", \"top-left\"]\n} }: TooltipProps) => {\n  const getPositionBasedAnimation = (position: TooltipProps[\"position\"]) => {\n    const baseAnimation = {\n      animate: { opacity: 1, y: 0, x: 0, scale: 1 },\n      exit: { opacity: 0, scale: 0.9 },\n      transition: { duration: 0.15, ease: crisp, delay: 0.15 },\n    };\n\n    if (position.startsWith(\"bottom\")) {\n      return {\n        ...baseAnimation,\n        initial: { opacity: 0, y: -10, scale: 0.9 },\n        exit: { ...baseAnimation.exit, y: -10 },\n      };\n    } else if (position.startsWith(\"top\")) {\n      return {\n        ...baseAnimation,\n        initial: { opacity: 0, y: 10, scale: 0.9 },\n        exit: { ...baseAnimation.exit, y: 10 },\n      };\n    } else if (position.startsWith(\"center-left\")) {\n      return {\n        ...baseAnimation,\n        initial: { opacity: 0, x: 10, scale: 0.9 },\n        exit: { ...baseAnimation.exit, x: 10 },\n      };\n    } else if (position.startsWith(\"center-right\")) {\n      return {\n        ...baseAnimation,\n        initial: { opacity: 0, x: -10, scale: 0.9 },\n        exit: { ...baseAnimation.exit, x: -10 },\n      };\n    }\n\n    // Fallback to default animation\n    return {\n      ...baseAnimation,\n      initial: { opacity: 0, y: -10, scale: 0.9 },\n      exit: { ...baseAnimation.exit, y: -10 },\n    };\n  };\n\n  const animations = getPositionBasedAnimation(position);\n\n  return (\n    <AnimatePresence>\n      {isOpen && (\n        <motion.div\n          key={position}\n          {...animations}\n          className={classNames(\n            \"z-50 absolute font-medium w-max max-w-[200px] px-2.5 pt-1.5 pb-2 bg-card-foreground gradient-border before:bg-border text-xs leading-[150%] text-shade-tertiary\",\n            \"after:absolute after:bg-border\",\n            !position.startsWith(\"center\") && \"after:!w-[10px] after:!h-[5px]\",\n            position.startsWith(\"center\") && \"after:!h-[10px] after:!w-[5px]\",\n            getTooltipPosition(position),\n            getArrowPosition(position),\n            className\n          )}\n          style={{ transformOrigin: getTransformOrigin(position) }}\n        >\n          <div className=\"absolute inset-0.5\">\n            <CrosshairCorners\n              {...crosshairProps}\n            />\n          </div>\n          {description}\n        </motion.div>\n      )}\n    </AnimatePresence>\n  );\n};\n\nconst getTooltipPosition = (position: TooltipProps[\"position\"]) => {\n  switch (position) {\n    case \"top-right\":\n      return \"bottom-[calc(100%+6px)] left-1/2 mb-1\";\n    case \"top-center\":\n      return \"bottom-[calc(100%+6px)] left-1/2 -translate-x-1/2 mb-1\";\n    case \"top-left\":\n      return \"bottom-[calc(100%+6px)] right-1/2 mb-1\";\n    case \"bottom-right\":\n      return \"top-[calc(100%+6px)] left-1/2 mt-1\";\n    case \"bottom-center\":\n      return \"top-[calc(100%+6px)] left-1/2 -translate-x-1/2 mt-1\";\n    case \"bottom-left\":\n      return \"top-[calc(100%+6px)] right-1/2 mt-1\";\n    case \"center-left\":\n      return \"right-[calc(100%+6px)] top-1/2 -translate-y-1/2 mr-1\";\n    case \"center-right\":\n      return \"left-[calc(100%+6px)] top-1/2 -translate-y-1/2 ml-1\";\n  }\n};\n\nconst getTransformOrigin = (position: TooltipProps[\"position\"]) => {\n  switch (position) {\n    case \"bottom-right\":\n      return \"bottom left\";\n    case \"bottom-center\":\n      return \"bottom center\";\n    case \"bottom-left\":\n      return \"bottom right\";\n    case \"top-right\":\n      return \"top left\";\n    case \"top-center\":\n      return \"top center\";\n    case \"top-left\":\n      return \"top right\";\n    case \"center-left\":\n      return \"center right\";\n    case \"center-right\":\n      return \"center left\";\n  }\n};\n\nconst getArrowPosition = (position: TooltipProps[\"position\"]) => {\n  switch (position) {\n    case \"bottom-right\":\n      return \"after:top-[calc(0%-5px)] after:left-0 after:[clip-path:polygon(0%_0%,100%_100%,0%_100%,0%_0%)]\";\n    case \"bottom-center\":\n      return \"after:top-[calc(0%-5px)] after:left-1/2 after:-translate-x-1/2 after:[clip-path:polygon(50%_0%,0%_100%,100%_100%)]\";\n    case \"bottom-left\":\n      return \"after:top-[calc(0%-5px)] after:right-0 after:[clip-path:polygon(100%_0%,0%_100%,100%_100%,100%_0%)]\";\n    case \"top-right\":\n      return \"after:bottom-[calc(0%-5px)] after:left-0 after:[clip-path:polygon(0%_100%,100%_0%,0%_0%,0%_100%)]\";\n    case \"top-center\":\n      return \"after:bottom-[calc(0%-5px)] after:left-1/2 after:-translate-x-1/2 after:[clip-path:polygon(50%_100%,0%_0%,100%_0%)]\";\n    case \"top-left\":\n      return \"after:bottom-[calc(0%-5px)] after:right-0 after:[clip-path:polygon(100%_100%,0%_0%,100%_0%,100%_100%)]\";\n    case \"center-right\":\n      return \"after:top-1/2 after:left-[calc(0%-5px)] after:-translate-y-1/2 after:[clip-path:polygon(100%_0%,0%_50%,100%_100%)]\";\n    case \"center-left\":\n      return \"after:top-1/2 after:right-[calc(0%-5px)] after:-translate-y-1/2 after:[clip-path:polygon(0%_0%,100%_50%,0%_100%)]\";\n  }\n};\n"],"mappings":";;;;;;;;;AAuBA,MAAa,WAAW,EAAE,aAAa,UAAU,QAAQ,WAAW,iBAAiB;CACnF,MAAM;CACN,SAAS;CACT,WAAW;CACX,gBAAgB;CAChB,mBAAmB;CACnB,SAAS,aAAa,cAAc,aAAa,iBAC7C,CAAC,eAAe,YAAY,GAC5B,CAAC,gBAAgB,WAAW;CACjC,OAAqB;CACpB,MAAM,6BAA6B,eAAuC;EACxE,MAAM,gBAAgB;GACpB,SAAS;IAAE,SAAS;IAAG,GAAG;IAAG,GAAG;IAAG,OAAO;IAAG;GAC7C,MAAM;IAAE,SAAS;IAAG,OAAO;IAAK;GAChC,YAAY;IAAE,UAAU;IAAM,MAAM;IAAO,OAAO;IAAM;GACzD;AAED,MAAIA,WAAS,WAAW,SAAS,CAC/B,QAAO;GACL,GAAG;GACH,SAAS;IAAE,SAAS;IAAG,GAAG;IAAK,OAAO;IAAK;GAC3C,MAAM;IAAE,GAAG,cAAc;IAAM,GAAG;IAAK;GACxC;WACQA,WAAS,WAAW,MAAM,CACnC,QAAO;GACL,GAAG;GACH,SAAS;IAAE,SAAS;IAAG,GAAG;IAAI,OAAO;IAAK;GAC1C,MAAM;IAAE,GAAG,cAAc;IAAM,GAAG;IAAI;GACvC;WACQA,WAAS,WAAW,cAAc,CAC3C,QAAO;GACL,GAAG;GACH,SAAS;IAAE,SAAS;IAAG,GAAG;IAAI,OAAO;IAAK;GAC1C,MAAM;IAAE,GAAG,cAAc;IAAM,GAAG;IAAI;GACvC;WACQA,WAAS,WAAW,eAAe,CAC5C,QAAO;GACL,GAAG;GACH,SAAS;IAAE,SAAS;IAAG,GAAG;IAAK,OAAO;IAAK;GAC3C,MAAM;IAAE,GAAG,cAAc;IAAM,GAAG;IAAK;GACxC;AAIH,SAAO;GACL,GAAG;GACH,SAAS;IAAE,SAAS;IAAG,GAAG;IAAK,OAAO;IAAK;GAC3C,MAAM;IAAE,GAAG,cAAc;IAAM,GAAG;IAAK;GACxC;;CAGH,MAAM,aAAa,0BAA0B,SAAS;AAEtD,QACE,oBAAC,6BACE,UACC,qBAAC,OAAO;EAEN,GAAI;EACJ,WAAW,WACT,mKACA,kCACA,CAAC,SAAS,WAAW,SAAS,IAAI,kCAClC,SAAS,WAAW,SAAS,IAAI,kCACjC,mBAAmB,SAAS,EAC5B,iBAAiB,SAAS,EAC1B,UACD;EACD,OAAO,EAAE,iBAAiB,mBAAmB,SAAS,EAAE;aAExD,oBAAC;GAAI,WAAU;aACb,oBAAC,oBACC,GAAI,iBACJ;IACE,EACL;IAlBI,SAmBM,GAEC;;AAItB,MAAM,sBAAsB,aAAuC;AACjE,SAAQ,UAAR;EACE,KAAK,YACH,QAAO;EACT,KAAK,aACH,QAAO;EACT,KAAK,WACH,QAAO;EACT,KAAK,eACH,QAAO;EACT,KAAK,gBACH,QAAO;EACT,KAAK,cACH,QAAO;EACT,KAAK,cACH,QAAO;EACT,KAAK,eACH,QAAO;;;AAIb,MAAM,sBAAsB,aAAuC;AACjE,SAAQ,UAAR;EACE,KAAK,eACH,QAAO;EACT,KAAK,gBACH,QAAO;EACT,KAAK,cACH,QAAO;EACT,KAAK,YACH,QAAO;EACT,KAAK,aACH,QAAO;EACT,KAAK,WACH,QAAO;EACT,KAAK,cACH,QAAO;EACT,KAAK,eACH,QAAO;;;AAIb,MAAM,oBAAoB,aAAuC;AAC/D,SAAQ,UAAR;EACE,KAAK,eACH,QAAO;EACT,KAAK,gBACH,QAAO;EACT,KAAK,cACH,QAAO;EACT,KAAK,YACH,QAAO;EACT,KAAK,aACH,QAAO;EACT,KAAK,WACH,QAAO;EACT,KAAK,eACH,QAAO;EACT,KAAK,cACH,QAAO"}