@cuemath/leap 4.0.2 → 4.0.3

package/dist/features/ui/accordion/accordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"accordion.js","sources":["../../../../src/features/ui/accordion/accordion.tsx"],"sourcesContent":["import { useCallback, useEffect, useMemo, useState, memo } from 'react';\n\nimport FlexView from '../layout/flex-view';\nimport Separator from '../separator/separator';\nimport Text from '../text/text';\nimport AccordionItem from './accordion-items/accordion-items';\nimport type { AccordionProps } from './accordion-types';\n\nconst Accordion = memo<AccordionProps>(function Accordion(props) {\n  const { theme = 'light', visibleBuffer, accordionData, defaultOpenElement = -1 } = props;\n  const [visible, setVisible] = useState(visibleBuffer);\n  const [openIndex, setOpenIndex] = useState<number>(defaultOpenElement);\n  const refList = useMemo<(HTMLDivElement | null)[]>(() => [], []);\n  const iconRef = useMemo<(SVGSVGElement | null)[]>(() => [], []);\n  const isDarkTheme = theme === 'dark';\n\n  const handleShowToggle = useCallback(() => {\n    setVisible(prev => (prev < accordionData.length ? accordionData.length : visibleBuffer));\n  }, [accordionData.length, visibleBuffer]);\n\n  const animateElement = useCallback((element: HTMLElement | SVGElement, isOpen: boolean) => {\n    if (element instanceof HTMLDivElement) {\n      element.style.maxHeight = isOpen ? `${element.scrollHeight}px` : '0px';\n    } else if (element instanceof SVGSVGElement) {\n      element.style.transform = isOpen ? 'rotateZ(45deg)' : 'rotateZ(0deg)';\n    }\n  }, []);\n\n  const handleToggle = useCallback(\n    (currentIndex: number) => {\n      const currentRefList = refList[currentIndex];\n      const currentIconRef = iconRef[currentIndex];\n\n      if (!currentRefList || !currentIconRef) return;\n\n      const isCurrentlyOpen = openIndex === currentIndex;\n      const newOpenIndex = isCurrentlyOpen ? -1 : currentIndex;\n\n      // Close previously open item\n      if (openIndex !== -1 && openIndex !== currentIndex) {\n        const prevRef = refList[openIndex];\n        const prevIcon = iconRef[openIndex];\n\n        if (prevRef && prevIcon) {\n          animateElement(prevRef, false);\n          animateElement(prevIcon, false);\n        }\n      }\n\n      // Toggle current item\n      animateElement(currentRefList, !isCurrentlyOpen);\n      animateElement(currentIconRef, !isCurrentlyOpen);\n\n      setOpenIndex(newOpenIndex);\n    },\n    [refList, iconRef, openIndex, animateElement],\n  );\n\n  useEffect(() => {\n    setVisible(visibleBuffer);\n  }, [visibleBuffer]);\n\n  useEffect(() => {\n    if (openIndex !== -1 && refList[openIndex] && iconRef[openIndex]) {\n      animateElement(refList[openIndex]!, true);\n      animateElement(iconRef[openIndex]!, true);\n    }\n  }, [visible, openIndex, refList, iconRef, animateElement]);\n\n  return (\n    <FlexView $flexDirection=\"column\">\n      {accordionData.map((item, index) => (\n        <AccordionItem\n          key={`${item.accordionQuestion}-${index}`}\n          item={item}\n          index={index}\n          handleToggle={handleToggle}\n          refList={refList}\n          iconRef={iconRef}\n          visible={index < visible}\n          theme={theme}\n        />\n      ))}\n      <Separator height={24} />\n      <Text\n        $renderAs=\"ub3-bold\"\n        $align=\"center\"\n        $textDecoration=\"underline\"\n        $marginBottom={24}\n        onClick={handleShowToggle}\n        $color={isDarkTheme ? 'WHITE' : 'BLACK'}\n        $cursor=\"pointer\"\n      >\n        {visible < accordionData.length ? 'See More' : 'See Less'}\n      </Text>\n    </FlexView>\n  );\n});\n\nexport default Accordion;\n"],"names":["Accordion","memo","props","theme","visibleBuffer","accordionData","defaultOpenElement","visible","setVisible","useState","openIndex","setOpenIndex","refList","useMemo","iconRef","isDarkTheme","handleShowToggle","useCallback","prev","animateElement","element","isOpen","handleToggle","currentIndex","currentRefList","currentIconRef","isCurrentlyOpen","newOpenIndex","prevRef","prevIcon","useEffect","jsxs","FlexView","item","index","jsx","AccordionItem","Separator","Text","Accordion$1"],"mappings":";;;;;;AAQA,MAAMA,IAAYC,EAAqB,SAAmBC,GAAO;AAC/D,QAAM,EAAE,OAAAC,IAAQ,SAAS,eAAAC,GAAe,eAAAC,GAAe,oBAAAC,IAAqB,GAAO,IAAAJ,GAC7E,CAACK,GAASC,CAAU,IAAIC,EAASL,CAAa,GAC9C,CAACM,GAAWC,CAAY,IAAIF,EAAiBH,CAAkB,GAC/DM,IAAUC,EAAmC,MAAM,CAAC,GAAG,CAAE,CAAA,GACzDC,IAAUD,EAAkC,MAAM,CAAC,GAAG,CAAE,CAAA,GACxDE,IAAcZ,MAAU,QAExBa,IAAmBC,EAAY,MAAM;AACzC,IAAAT,EAAW,OAASU,IAAOb,EAAc,SAASA,EAAc,SAASD,CAAc;AAAA,EACtF,GAAA,CAACC,EAAc,QAAQD,CAAa,CAAC,GAElCe,IAAiBF,EAAY,CAACG,GAAmCC,MAAoB;AACzF,IAAID,aAAmB,iBACrBA,EAAQ,MAAM,YAAYC,IAAS,GAAGD,EAAQ,YAAY,OAAO,QACxDA,aAAmB,kBACpBA,EAAA,MAAM,YAAYC,IAAS,mBAAmB;AAAA,EAE1D,GAAG,CAAE,CAAA,GAECC,IAAeL;AAAA,IACnB,CAACM,MAAyB;AAClB,YAAAC,IAAiBZ,EAAQW,CAAY,GACrCE,IAAiBX,EAAQS,CAAY;AAEvC,UAAA,CAACC,KAAkB,CAACC,EAAgB;AAExC,YAAMC,IAAkBhB,MAAca,GAChCI,IAAeD,IAAkB,KAAKH;AAGxC,UAAAb,MAAc,MAAMA,MAAca,GAAc;AAC5C,cAAAK,IAAUhB,EAAQF,CAAS,GAC3BmB,IAAWf,EAAQJ,CAAS;AAElC,QAAIkB,KAAWC,MACbV,EAAeS,GAAS,EAAK,GAC7BT,EAAeU,GAAU,EAAK;AAAA,MAElC;AAGe,MAAAV,EAAAK,GAAgB,CAACE,CAAe,GAChCP,EAAAM,GAAgB,CAACC,CAAe,GAE/Cf,EAAagB,CAAY;AAAA,IAC3B;AAAA,IACA,CAACf,GAASE,GAASJ,GAAWS,CAAc;AAAA,EAAA;AAG9C,SAAAW,EAAU,MAAM;AACd,IAAAtB,EAAWJ,CAAa;AAAA,EAAA,GACvB,CAACA,CAAa,CAAC,GAElB0B,EAAU,MAAM;AACd,IAAIpB,MAAc,MAAME,EAAQF,CAAS,KAAKI,EAAQJ,CAAS,MAC9CS,EAAAP,EAAQF,CAAS,GAAI,EAAI,GACzBS,EAAAL,EAAQJ,CAAS,GAAI,EAAI;AAAA,EAC1C,GACC,CAACH,GAASG,GAAWE,GAASE,GAASK,CAAc,CAAC,GAGvD,gBAAAY,EAACC,GAAS,EAAA,gBAAe,UACtB,UAAA;AAAA,IAAc3B,EAAA,IAAI,CAAC4B,GAAMC,MACxB,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QAEC,MAAAH;AAAA,QACA,OAAAC;AAAA,QACA,cAAAZ;AAAA,QACA,SAAAV;AAAA,QACA,SAAAE;AAAA,QACA,SAASoB,IAAQ3B;AAAA,QACjB,OAAAJ;AAAA,MAAA;AAAA,MAPK,GAAG8B,EAAK,iBAAiB,IAAIC,CAAK;AAAA,IAAA,CAS1C;AAAA,IACD,gBAAAC,EAACE,GAAU,EAAA,QAAQ,GAAI,CAAA;AAAA,IACvB,gBAAAF;AAAA,MAACG;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,QAAO;AAAA,QACP,iBAAgB;AAAA,QAChB,eAAe;AAAA,QACf,SAAStB;AAAA,QACT,QAAQD,IAAc,UAAU;AAAA,QAChC,SAAQ;AAAA,QAEP,UAAAR,IAAUF,EAAc,SAAS,aAAa;AAAA,MAAA;AAAA,IACjD;AAAA,EACF,EAAA,CAAA;AAEJ,CAAC,GAEDkC,IAAevC;"}
+{"version":3,"file":"accordion.js","sources":["../../../../src/features/ui/accordion/accordion.tsx"],"sourcesContent":["import { useCallback, useEffect, useMemo, useState, memo } from 'react';\n\nimport FlexView from '../layout/flex-view';\nimport Separator from '../separator/separator';\nimport Text from '../text/text';\nimport AccordionItem from './accordion-items/accordion-items';\nimport type { AccordionProps } from './accordion-types';\n\nconst Accordion = memo<AccordionProps>(function Accordion(props) {\n  const { theme = 'light', visibleBuffer, accordionData, defaultOpenElement = -1 } = props;\n  const [visible, setVisible] = useState(visibleBuffer);\n  const [openIndex, setOpenIndex] = useState<number>(defaultOpenElement);\n  const refList = useMemo<(HTMLDivElement | null)[]>(() => [], []);\n  const iconRef = useMemo<(SVGSVGElement | null)[]>(() => [], []);\n  const isDarkTheme = theme === 'dark';\n\n  const handleShowToggle = useCallback(() => {\n    setVisible(prev => (prev < accordionData.length ? accordionData.length : visibleBuffer));\n  }, [accordionData.length, visibleBuffer]);\n\n  const animateElement = useCallback((element: HTMLElement | SVGElement, isOpen: boolean) => {\n    if (element instanceof HTMLDivElement) {\n      element.style.maxHeight = isOpen ? `${element.scrollHeight}px` : '0px';\n    } else if (element instanceof SVGSVGElement) {\n      element.style.transform = isOpen ? 'rotateZ(45deg)' : 'rotateZ(0deg)';\n    }\n  }, []);\n\n  const handleToggle = useCallback(\n    (currentIndex: number) => {\n      const currentRefList = refList[currentIndex];\n      const currentIconRef = iconRef[currentIndex];\n\n      if (!currentRefList || !currentIconRef) return;\n\n      const isCurrentlyOpen = openIndex === currentIndex;\n      const newOpenIndex = isCurrentlyOpen ? -1 : currentIndex;\n\n      // Close previously open item\n      if (openIndex !== -1 && openIndex !== currentIndex) {\n        const prevRef = refList[openIndex];\n        const prevIcon = iconRef[openIndex];\n\n        if (prevRef && prevIcon) {\n          animateElement(prevRef, false);\n          animateElement(prevIcon, false);\n        }\n      }\n\n      // Toggle current item\n      animateElement(currentRefList, !isCurrentlyOpen);\n      animateElement(currentIconRef, !isCurrentlyOpen);\n\n      setOpenIndex(newOpenIndex);\n    },\n    [refList, iconRef, openIndex, animateElement],\n  );\n\n  useEffect(() => {\n    setVisible(visibleBuffer);\n  }, [visibleBuffer]);\n\n  useEffect(() => {\n    if (openIndex !== -1 && refList[openIndex] && iconRef[openIndex]) {\n      animateElement(refList[openIndex]!, true);\n      animateElement(iconRef[openIndex]!, true);\n    }\n  }, [visible, openIndex, refList, iconRef, animateElement]);\n\n  return (\n    <FlexView $flexDirection=\"column\">\n      {accordionData.map((item, index) => (\n        <AccordionItem\n          key={`${item.accordionQuestion}-${index}`}\n          item={item}\n          index={index}\n          handleToggle={handleToggle}\n          refList={refList}\n          iconRef={iconRef}\n          visible={index < visible}\n          theme={theme}\n        />\n      ))}\n      <Separator height={24} />\n      <Text\n        $renderAs=\"ub4-bold\"\n        $align=\"center\"\n        $textDecoration=\"underline\"\n        $marginBottom={24}\n        onClick={handleShowToggle}\n        $color={isDarkTheme ? 'WHITE' : 'BLACK'}\n        $cursor=\"pointer\"\n      >\n        {visible < accordionData.length ? 'See More' : 'See Less'}\n      </Text>\n    </FlexView>\n  );\n});\n\nexport default Accordion;\n"],"names":["Accordion","memo","props","theme","visibleBuffer","accordionData","defaultOpenElement","visible","setVisible","useState","openIndex","setOpenIndex","refList","useMemo","iconRef","isDarkTheme","handleShowToggle","useCallback","prev","animateElement","element","isOpen","handleToggle","currentIndex","currentRefList","currentIconRef","isCurrentlyOpen","newOpenIndex","prevRef","prevIcon","useEffect","jsxs","FlexView","item","index","jsx","AccordionItem","Separator","Text","Accordion$1"],"mappings":";;;;;;AAQA,MAAMA,IAAYC,EAAqB,SAAmBC,GAAO;AAC/D,QAAM,EAAE,OAAAC,IAAQ,SAAS,eAAAC,GAAe,eAAAC,GAAe,oBAAAC,IAAqB,GAAO,IAAAJ,GAC7E,CAACK,GAASC,CAAU,IAAIC,EAASL,CAAa,GAC9C,CAACM,GAAWC,CAAY,IAAIF,EAAiBH,CAAkB,GAC/DM,IAAUC,EAAmC,MAAM,CAAC,GAAG,CAAE,CAAA,GACzDC,IAAUD,EAAkC,MAAM,CAAC,GAAG,CAAE,CAAA,GACxDE,IAAcZ,MAAU,QAExBa,IAAmBC,EAAY,MAAM;AACzC,IAAAT,EAAW,OAASU,IAAOb,EAAc,SAASA,EAAc,SAASD,CAAc;AAAA,EACtF,GAAA,CAACC,EAAc,QAAQD,CAAa,CAAC,GAElCe,IAAiBF,EAAY,CAACG,GAAmCC,MAAoB;AACzF,IAAID,aAAmB,iBACrBA,EAAQ,MAAM,YAAYC,IAAS,GAAGD,EAAQ,YAAY,OAAO,QACxDA,aAAmB,kBACpBA,EAAA,MAAM,YAAYC,IAAS,mBAAmB;AAAA,EAE1D,GAAG,CAAE,CAAA,GAECC,IAAeL;AAAA,IACnB,CAACM,MAAyB;AAClB,YAAAC,IAAiBZ,EAAQW,CAAY,GACrCE,IAAiBX,EAAQS,CAAY;AAEvC,UAAA,CAACC,KAAkB,CAACC,EAAgB;AAExC,YAAMC,IAAkBhB,MAAca,GAChCI,IAAeD,IAAkB,KAAKH;AAGxC,UAAAb,MAAc,MAAMA,MAAca,GAAc;AAC5C,cAAAK,IAAUhB,EAAQF,CAAS,GAC3BmB,IAAWf,EAAQJ,CAAS;AAElC,QAAIkB,KAAWC,MACbV,EAAeS,GAAS,EAAK,GAC7BT,EAAeU,GAAU,EAAK;AAAA,MAElC;AAGe,MAAAV,EAAAK,GAAgB,CAACE,CAAe,GAChCP,EAAAM,GAAgB,CAACC,CAAe,GAE/Cf,EAAagB,CAAY;AAAA,IAC3B;AAAA,IACA,CAACf,GAASE,GAASJ,GAAWS,CAAc;AAAA,EAAA;AAG9C,SAAAW,EAAU,MAAM;AACd,IAAAtB,EAAWJ,CAAa;AAAA,EAAA,GACvB,CAACA,CAAa,CAAC,GAElB0B,EAAU,MAAM;AACd,IAAIpB,MAAc,MAAME,EAAQF,CAAS,KAAKI,EAAQJ,CAAS,MAC9CS,EAAAP,EAAQF,CAAS,GAAI,EAAI,GACzBS,EAAAL,EAAQJ,CAAS,GAAI,EAAI;AAAA,EAC1C,GACC,CAACH,GAASG,GAAWE,GAASE,GAASK,CAAc,CAAC,GAGvD,gBAAAY,EAACC,GAAS,EAAA,gBAAe,UACtB,UAAA;AAAA,IAAc3B,EAAA,IAAI,CAAC4B,GAAMC,MACxB,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QAEC,MAAAH;AAAA,QACA,OAAAC;AAAA,QACA,cAAAZ;AAAA,QACA,SAAAV;AAAA,QACA,SAAAE;AAAA,QACA,SAASoB,IAAQ3B;AAAA,QACjB,OAAAJ;AAAA,MAAA;AAAA,MAPK,GAAG8B,EAAK,iBAAiB,IAAIC,CAAK;AAAA,IAAA,CAS1C;AAAA,IACD,gBAAAC,EAACE,GAAU,EAAA,QAAQ,GAAI,CAAA;AAAA,IACvB,gBAAAF;AAAA,MAACG;AAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,QAAO;AAAA,QACP,iBAAgB;AAAA,QAChB,eAAe;AAAA,QACf,SAAStB;AAAA,QACT,QAAQD,IAAc,UAAU;AAAA,QAChC,SAAQ;AAAA,QAEP,UAAAR,IAAUF,EAAc,SAAS,aAAa;AAAA,MAAA;AAAA,IACjD;AAAA,EACF,EAAA,CAAA;AAEJ,CAAC,GAEDkC,IAAevC;"}

package/dist/features/ui/arrow-tooltip/arrow-tooltip.js

@@ -76,7 +76,7 @@ const Q = ({
       $isAnimated: C,
       $width: b,
       $widthX: k,
-      textVariant: L || "ub3",
+      textVariant: L || "ub4",
       children: g
     }
   );

package/dist/features/ui/arrow-tooltip/arrow-tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"arrow-tooltip.js","sources":["../../../../src/features/ui/arrow-tooltip/arrow-tooltip.tsx"],"sourcesContent":["import throttle from 'lodash.throttle';\nimport { useState, type FC, useCallback, useRef, useEffect, memo } from 'react';\n\nimport FlexView from '../layout/flex-view';\nimport Portal from '../portal/portal';\nimport { DEFAULT_ARROW_SIZE, THROTTLE_DURATION } from './arrow-tooltip-constants';\nimport * as Styled from './arrow-tooltip-styled';\nimport type {\n  IArrowTooltipProps,\n  THandleVisibleNCoOrdinatesProps,\n  TTooltipCoOrdinatesProps,\n} from './arrow-tooltip-types';\nimport { computeTooltipNewCoOrdinates } from './arrow-tooltip-util';\nimport TooltipBody from './comps/tooltip-body';\n\nconst ArrowTooltip: FC<IArrowTooltipProps> = ({\n  isAnimated,\n  alwaysVisible = false,\n  arrowColor,\n  arrowSize = DEFAULT_ARROW_SIZE,\n  arrowXCoOrdinates,\n  arrowYCoOrdinates,\n  backgroundColor,\n  borderColor,\n  children,\n  hidden,\n  position,\n  renderAs,\n  textVariant,\n  tooltipItem,\n  tooltipOffset,\n  tooltipXCoOrdinates,\n  tooltipYCoOrdinates,\n  width,\n  widthX,\n  zIndex,\n  parentWidth,\n  isBlocking = false,\n}) => {\n  const tooltipWrapperRef = useRef<HTMLDivElement>(null);\n  const [visible, setVisible] = useState(alwaysVisible);\n  const [tooltipCoOrdinates, setTooltipCoOrdinates] = useState<TTooltipCoOrdinatesProps | null>(\n    null,\n  );\n\n  const handleVisibleNCoOrdinates: THandleVisibleNCoOrdinatesProps = useCallback(\n    (newCoOrdinates, visibility) => {\n      setTooltipCoOrdinates(newCoOrdinates);\n      setVisible(visibility);\n    },\n    [],\n  );\n\n  const handleVisibility = useCallback(() => {\n    if (hidden || alwaysVisible) {\n      return null;\n    }\n\n    handleVisibleNCoOrdinates(null, false);\n\n    return;\n  }, [alwaysVisible, handleVisibleNCoOrdinates, hidden]);\n\n  const handleOnMouseEnter = throttle(() => {\n    const { current } = tooltipWrapperRef;\n\n    if (hidden || !current) return null;\n\n    const boundingClientRect = current.children[0]?.getBoundingClientRect();\n    const newCoOrdinates = boundingClientRect\n      ? computeTooltipNewCoOrdinates(position, boundingClientRect)\n      : null;\n\n    handleVisibleNCoOrdinates(newCoOrdinates, true);\n\n    return null;\n  }, THROTTLE_DURATION);\n\n  useEffect(() => {\n    if (!alwaysVisible || hidden) return;\n\n    window.addEventListener('scroll', handleOnMouseEnter, true);\n    window.addEventListener('resize', handleOnMouseEnter);\n\n    return () => {\n      window.removeEventListener('scroll', handleOnMouseEnter, true);\n      window.removeEventListener('resize', handleOnMouseEnter);\n    };\n  }, [alwaysVisible, hidden, position, handleOnMouseEnter]);\n\n  useEffect(() => {\n    if (hidden) {\n      setVisible(false);\n    }\n\n    if (alwaysVisible) {\n      handleOnMouseEnter();\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [alwaysVisible, hidden]);\n\n  const tooltipContent = (\n    <TooltipBody\n      $arrowSize={arrowSize}\n      $arrowXCoOrdinates={arrowXCoOrdinates}\n      $arrowYCoOrdinates={arrowYCoOrdinates}\n      $position={position}\n      $renderAs={renderAs}\n      $tooltipCoOrdinates={tooltipCoOrdinates}\n      $tooltipOffset={tooltipOffset}\n      $tooltipXCoOrdinates={tooltipXCoOrdinates}\n      $tooltipYCoOrdinates={tooltipYCoOrdinates}\n      $zIndex={zIndex}\n      $backgroundColor={backgroundColor}\n      $arrowColor={arrowColor}\n      $borderColor={borderColor}\n      $isAnimated={isAnimated}\n      $width={width}\n      $widthX={widthX}\n      textVariant={textVariant || 'ub3'}\n    >\n      {tooltipItem}\n    </TooltipBody>\n  );\n\n  return (\n    <>\n      <FlexView\n        $width={parentWidth || 'fit-content'}\n        ref={tooltipWrapperRef}\n        onMouseEnter={handleOnMouseEnter}\n        onMouseLeave={handleVisibility}\n      >\n        <FlexView>{children}</FlexView>\n      </FlexView>\n\n      {visible && (\n        <Portal portalId=\"tooltip-root\">\n          {isBlocking ? (\n            <Styled.BackgroundOverlay>{tooltipContent}</Styled.BackgroundOverlay>\n          ) : (\n            tooltipContent\n          )}\n        </Portal>\n      )}\n    </>\n  );\n};\n\nexport default memo(ArrowTooltip);\n"],"names":["ArrowTooltip","isAnimated","alwaysVisible","arrowColor","arrowSize","DEFAULT_ARROW_SIZE","arrowXCoOrdinates","arrowYCoOrdinates","backgroundColor","borderColor","children","hidden","position","renderAs","textVariant","tooltipItem","tooltipOffset","tooltipXCoOrdinates","tooltipYCoOrdinates","width","widthX","zIndex","parentWidth","isBlocking","tooltipWrapperRef","useRef","visible","setVisible","useState","tooltipCoOrdinates","setTooltipCoOrdinates","handleVisibleNCoOrdinates","useCallback","newCoOrdinates","visibility","handleVisibility","handleOnMouseEnter","throttle","current","boundingClientRect","_a","computeTooltipNewCoOrdinates","THROTTLE_DURATION","useEffect","tooltipContent","jsx","TooltipBody","jsxs","Fragment","FlexView","Portal","Styled.BackgroundOverlay","ArrowTooltip$1","memo"],"mappings":"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"}
+{"version":3,"file":"arrow-tooltip.js","sources":["../../../../src/features/ui/arrow-tooltip/arrow-tooltip.tsx"],"sourcesContent":["import throttle from 'lodash.throttle';\nimport { useState, type FC, useCallback, useRef, useEffect, memo } from 'react';\n\nimport FlexView from '../layout/flex-view';\nimport Portal from '../portal/portal';\nimport { DEFAULT_ARROW_SIZE, THROTTLE_DURATION } from './arrow-tooltip-constants';\nimport * as Styled from './arrow-tooltip-styled';\nimport type {\n  IArrowTooltipProps,\n  THandleVisibleNCoOrdinatesProps,\n  TTooltipCoOrdinatesProps,\n} from './arrow-tooltip-types';\nimport { computeTooltipNewCoOrdinates } from './arrow-tooltip-util';\nimport TooltipBody from './comps/tooltip-body';\n\nconst ArrowTooltip: FC<IArrowTooltipProps> = ({\n  isAnimated,\n  alwaysVisible = false,\n  arrowColor,\n  arrowSize = DEFAULT_ARROW_SIZE,\n  arrowXCoOrdinates,\n  arrowYCoOrdinates,\n  backgroundColor,\n  borderColor,\n  children,\n  hidden,\n  position,\n  renderAs,\n  textVariant,\n  tooltipItem,\n  tooltipOffset,\n  tooltipXCoOrdinates,\n  tooltipYCoOrdinates,\n  width,\n  widthX,\n  zIndex,\n  parentWidth,\n  isBlocking = false,\n}) => {\n  const tooltipWrapperRef = useRef<HTMLDivElement>(null);\n  const [visible, setVisible] = useState(alwaysVisible);\n  const [tooltipCoOrdinates, setTooltipCoOrdinates] = useState<TTooltipCoOrdinatesProps | null>(\n    null,\n  );\n\n  const handleVisibleNCoOrdinates: THandleVisibleNCoOrdinatesProps = useCallback(\n    (newCoOrdinates, visibility) => {\n      setTooltipCoOrdinates(newCoOrdinates);\n      setVisible(visibility);\n    },\n    [],\n  );\n\n  const handleVisibility = useCallback(() => {\n    if (hidden || alwaysVisible) {\n      return null;\n    }\n\n    handleVisibleNCoOrdinates(null, false);\n\n    return;\n  }, [alwaysVisible, handleVisibleNCoOrdinates, hidden]);\n\n  const handleOnMouseEnter = throttle(() => {\n    const { current } = tooltipWrapperRef;\n\n    if (hidden || !current) return null;\n\n    const boundingClientRect = current.children[0]?.getBoundingClientRect();\n    const newCoOrdinates = boundingClientRect\n      ? computeTooltipNewCoOrdinates(position, boundingClientRect)\n      : null;\n\n    handleVisibleNCoOrdinates(newCoOrdinates, true);\n\n    return null;\n  }, THROTTLE_DURATION);\n\n  useEffect(() => {\n    if (!alwaysVisible || hidden) return;\n\n    window.addEventListener('scroll', handleOnMouseEnter, true);\n    window.addEventListener('resize', handleOnMouseEnter);\n\n    return () => {\n      window.removeEventListener('scroll', handleOnMouseEnter, true);\n      window.removeEventListener('resize', handleOnMouseEnter);\n    };\n  }, [alwaysVisible, hidden, position, handleOnMouseEnter]);\n\n  useEffect(() => {\n    if (hidden) {\n      setVisible(false);\n    }\n\n    if (alwaysVisible) {\n      handleOnMouseEnter();\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [alwaysVisible, hidden]);\n\n  const tooltipContent = (\n    <TooltipBody\n      $arrowSize={arrowSize}\n      $arrowXCoOrdinates={arrowXCoOrdinates}\n      $arrowYCoOrdinates={arrowYCoOrdinates}\n      $position={position}\n      $renderAs={renderAs}\n      $tooltipCoOrdinates={tooltipCoOrdinates}\n      $tooltipOffset={tooltipOffset}\n      $tooltipXCoOrdinates={tooltipXCoOrdinates}\n      $tooltipYCoOrdinates={tooltipYCoOrdinates}\n      $zIndex={zIndex}\n      $backgroundColor={backgroundColor}\n      $arrowColor={arrowColor}\n      $borderColor={borderColor}\n      $isAnimated={isAnimated}\n      $width={width}\n      $widthX={widthX}\n      textVariant={textVariant || 'ub4'}\n    >\n      {tooltipItem}\n    </TooltipBody>\n  );\n\n  return (\n    <>\n      <FlexView\n        $width={parentWidth || 'fit-content'}\n        ref={tooltipWrapperRef}\n        onMouseEnter={handleOnMouseEnter}\n        onMouseLeave={handleVisibility}\n      >\n        <FlexView>{children}</FlexView>\n      </FlexView>\n\n      {visible && (\n        <Portal portalId=\"tooltip-root\">\n          {isBlocking ? (\n            <Styled.BackgroundOverlay>{tooltipContent}</Styled.BackgroundOverlay>\n          ) : (\n            tooltipContent\n          )}\n        </Portal>\n      )}\n    </>\n  );\n};\n\nexport default memo(ArrowTooltip);\n"],"names":["ArrowTooltip","isAnimated","alwaysVisible","arrowColor","arrowSize","DEFAULT_ARROW_SIZE","arrowXCoOrdinates","arrowYCoOrdinates","backgroundColor","borderColor","children","hidden","position","renderAs","textVariant","tooltipItem","tooltipOffset","tooltipXCoOrdinates","tooltipYCoOrdinates","width","widthX","zIndex","parentWidth","isBlocking","tooltipWrapperRef","useRef","visible","setVisible","useState","tooltipCoOrdinates","setTooltipCoOrdinates","handleVisibleNCoOrdinates","useCallback","newCoOrdinates","visibility","handleVisibility","handleOnMouseEnter","throttle","current","boundingClientRect","_a","computeTooltipNewCoOrdinates","THROTTLE_DURATION","useEffect","tooltipContent","jsx","TooltipBody","jsxs","Fragment","FlexView","Portal","Styled.BackgroundOverlay","ArrowTooltip$1","memo"],"mappings":"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"}

package/dist/features/ui/arrow-tooltip/comps/tooltip-body.js

@@ -8,7 +8,7 @@ const c = (o) => {
   return /* @__PURE__ */ t(a, { ...r, children: typeof o.children == "string" ? /* @__PURE__ */ t(
     m,
     {
-      $renderAs: o.textVariant || "ub3",
+      $renderAs: o.textVariant || "ub4",
       $color: i[o.$renderAs].textColorName,
       $align: "center",
       children: o.children

package/dist/features/ui/arrow-tooltip/comps/tooltip-body.js.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip-body.js","sources":["../../../../../src/features/ui/arrow-tooltip/comps/tooltip-body.tsx"],"sourcesContent":["import { memo, type FC } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport Text from '../../text/text';\nimport * as Styled from './tooltip-body-styled';\nimport type { ITooltipBodyProps } from './tooltip-body-types';\n\nconst TooltipBody: FC<ITooltipBodyProps> = props => {\n  const { textVariant, ...rest } = props;\n  const { arrowTooltip } = useTheme();\n  const { tooltipVariants } = arrowTooltip;\n\n  return (\n    <Styled.TooltipBody {...rest}>\n      {typeof props.children === 'string' ? (\n        <Text\n          $renderAs={props.textVariant || 'ub3'}\n          $color={tooltipVariants[props.$renderAs].textColorName}\n          $align=\"center\"\n        >\n          {props.children}\n        </Text>\n      ) : (\n        props.children\n      )}\n    </Styled.TooltipBody>\n  );\n};\n\nexport default memo(TooltipBody);\n"],"names":["TooltipBody","props","textVariant","rest","arrowTooltip","useTheme","tooltipVariants","jsx","Styled.TooltipBody","Text","TooltipBody$1","memo"],"mappings":";;;;;AAOA,MAAMA,IAAqC,CAASC,MAAA;AAClD,QAAM,EAAE,aAAAC,GAAa,GAAGC,EAAA,IAASF,GAC3B,EAAE,cAAAG,MAAiBC,KACnB,EAAE,iBAAAC,EAAoB,IAAAF;AAG1B,SAAA,gBAAAG,EAACC,GAAA,EAAoB,GAAGL,GACrB,UAAA,OAAOF,EAAM,YAAa,WACzB,gBAAAM;AAAA,IAACE;AAAA,IAAA;AAAA,MACC,WAAWR,EAAM,eAAe;AAAA,MAChC,QAAQK,EAAgBL,EAAM,SAAS,EAAE;AAAA,MACzC,QAAO;AAAA,MAEN,UAAMA,EAAA;AAAA,IAAA;AAAA,EAAA,IAGTA,EAAM,SAEV,CAAA;AAEJ,GAEeS,IAAAC,EAAKX,CAAW;"}
+{"version":3,"file":"tooltip-body.js","sources":["../../../../../src/features/ui/arrow-tooltip/comps/tooltip-body.tsx"],"sourcesContent":["import { memo, type FC } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport Text from '../../text/text';\nimport * as Styled from './tooltip-body-styled';\nimport type { ITooltipBodyProps } from './tooltip-body-types';\n\nconst TooltipBody: FC<ITooltipBodyProps> = props => {\n  const { textVariant, ...rest } = props;\n  const { arrowTooltip } = useTheme();\n  const { tooltipVariants } = arrowTooltip;\n\n  return (\n    <Styled.TooltipBody {...rest}>\n      {typeof props.children === 'string' ? (\n        <Text\n          $renderAs={props.textVariant || 'ub4'}\n          $color={tooltipVariants[props.$renderAs].textColorName}\n          $align=\"center\"\n        >\n          {props.children}\n        </Text>\n      ) : (\n        props.children\n      )}\n    </Styled.TooltipBody>\n  );\n};\n\nexport default memo(TooltipBody);\n"],"names":["TooltipBody","props","textVariant","rest","arrowTooltip","useTheme","tooltipVariants","jsx","Styled.TooltipBody","Text","TooltipBody$1","memo"],"mappings":";;;;;AAOA,MAAMA,IAAqC,CAASC,MAAA;AAClD,QAAM,EAAE,aAAAC,GAAa,GAAGC,EAAA,IAASF,GAC3B,EAAE,cAAAG,MAAiBC,KACnB,EAAE,iBAAAC,EAAoB,IAAAF;AAG1B,SAAA,gBAAAG,EAACC,GAAA,EAAoB,GAAGL,GACrB,UAAA,OAAOF,EAAM,YAAa,WACzB,gBAAAM;AAAA,IAACE;AAAA,IAAA;AAAA,MACC,WAAWR,EAAM,eAAe;AAAA,MAChC,QAAQK,EAAgBL,EAAM,SAAS,EAAE;AAAA,MACzC,QAAO;AAAA,MAEN,UAAMA,EAAA;AAAA,IAAA;AAAA,EAAA,IAGTA,EAAM,SAEV,CAAA;AAEJ,GAEeS,IAAAC,EAAKX,CAAW;"}

package/dist/features/ui/callout/callout.js

@@ -15,7 +15,7 @@ const i = (o) => ({ backgroundColor: `${o}_1`, borderColor: `${o}_4` }), s = ({
       $gapX: 0.5,
       $borderRadiusX: 0.25,
       $marginBottomX: e,
-      children: /* @__PURE__ */ t(a, { $renderAs: "ub2", children: o })
+      children: /* @__PURE__ */ t(a, { $renderAs: "ub3", children: o })
     }
   );
 }, g = s;

package/dist/features/ui/callout/callout.js.map

@@ -1 +1 @@
-{"version":3,"file":"callout.js","sources":["../../../../src/features/ui/callout/callout.tsx"],"sourcesContent":["import { useMemo, type FC } from 'react';\n\nimport FlexView from '../layout/flex-view';\nimport Text from '../text/text';\nimport type { TColorNames, THueNames } from '../types';\nimport type { ICalloutProps } from './callout-types';\n\nconst computeColorsFromHue = (\n  hue: THueNames,\n): { backgroundColor: TColorNames; borderColor: TColorNames } => {\n  return { backgroundColor: `${hue}_1`, borderColor: `${hue}_4` };\n};\n\nconst Callout: FC<ICalloutProps> = ({ children, hue, marginBottomX, width, widthX }) => {\n  const { backgroundColor, borderColor } = useMemo(() => computeColorsFromHue(hue), [hue]);\n\n  return (\n    <FlexView\n      $width={width}\n      $widthX={widthX}\n      $background={backgroundColor}\n      $borderColor={borderColor}\n      $gutterX={0.5}\n      $gapX={0.5}\n      $borderRadiusX={0.25}\n      $marginBottomX={marginBottomX}\n    >\n      <Text $renderAs=\"ub2\">{children}</Text>\n    </FlexView>\n  );\n};\n\nexport default Callout;\n"],"names":["computeColorsFromHue","hue","Callout","children","marginBottomX","width","widthX","backgroundColor","borderColor","useMemo","jsx","FlexView","Text","Callout$1"],"mappings":";;;;AAOA,MAAMA,IAAuB,CAC3BC,OAEO,EAAE,iBAAiB,GAAGA,CAAG,MAAM,aAAa,GAAGA,CAAG,SAGrDC,IAA6B,CAAC,EAAE,UAAAC,GAAU,KAAAF,GAAK,eAAAG,GAAe,OAAAC,GAAO,QAAAC,QAAa;AAChF,QAAA,EAAE,iBAAAC,GAAiB,aAAAC,EAAA,IAAgBC,EAAQ,MAAMT,EAAqBC,CAAG,GAAG,CAACA,CAAG,CAAC;AAGrF,SAAA,gBAAAS;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,QAAQN;AAAA,MACR,SAASC;AAAA,MACT,aAAaC;AAAA,MACb,cAAcC;AAAA,MACd,UAAU;AAAA,MACV,OAAO;AAAA,MACP,gBAAgB;AAAA,MAChB,gBAAgBJ;AAAA,MAEhB,UAAC,gBAAAM,EAAAE,GAAA,EAAK,WAAU,OAAO,UAAAT,GAAS;AAAA,IAAA;AAAA,EAAA;AAGtC,GAEAU,IAAeX;"}
+{"version":3,"file":"callout.js","sources":["../../../../src/features/ui/callout/callout.tsx"],"sourcesContent":["import { useMemo, type FC } from 'react';\n\nimport FlexView from '../layout/flex-view';\nimport Text from '../text/text';\nimport type { TColorNames, THueNames } from '../types';\nimport type { ICalloutProps } from './callout-types';\n\nconst computeColorsFromHue = (\n  hue: THueNames,\n): { backgroundColor: TColorNames; borderColor: TColorNames } => {\n  return { backgroundColor: `${hue}_1`, borderColor: `${hue}_4` };\n};\n\nconst Callout: FC<ICalloutProps> = ({ children, hue, marginBottomX, width, widthX }) => {\n  const { backgroundColor, borderColor } = useMemo(() => computeColorsFromHue(hue), [hue]);\n\n  return (\n    <FlexView\n      $width={width}\n      $widthX={widthX}\n      $background={backgroundColor}\n      $borderColor={borderColor}\n      $gutterX={0.5}\n      $gapX={0.5}\n      $borderRadiusX={0.25}\n      $marginBottomX={marginBottomX}\n    >\n      <Text $renderAs=\"ub3\">{children}</Text>\n    </FlexView>\n  );\n};\n\nexport default Callout;\n"],"names":["computeColorsFromHue","hue","Callout","children","marginBottomX","width","widthX","backgroundColor","borderColor","useMemo","jsx","FlexView","Text","Callout$1"],"mappings":";;;;AAOA,MAAMA,IAAuB,CAC3BC,OAEO,EAAE,iBAAiB,GAAGA,CAAG,MAAM,aAAa,GAAGA,CAAG,SAGrDC,IAA6B,CAAC,EAAE,UAAAC,GAAU,KAAAF,GAAK,eAAAG,GAAe,OAAAC,GAAO,QAAAC,QAAa;AAChF,QAAA,EAAE,iBAAAC,GAAiB,aAAAC,EAAA,IAAgBC,EAAQ,MAAMT,EAAqBC,CAAG,GAAG,CAACA,CAAG,CAAC;AAGrF,SAAA,gBAAAS;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,QAAQN;AAAA,MACR,SAASC;AAAA,MACT,aAAaC;AAAA,MACb,cAAcC;AAAA,MACd,UAAU;AAAA,MACV,OAAO;AAAA,MACP,gBAAgB;AAAA,MAChB,gBAAgBJ;AAAA,MAEhB,UAAC,gBAAAM,EAAAE,GAAA,EAAK,WAAU,OAAO,UAAAT,GAAS;AAAA,IAAA;AAAA,EAAA;AAGtC,GAEAU,IAAeX;"}

package/dist/features/ui/error/error.js

@@ -12,7 +12,7 @@ const e = {
     borderRadiusX: 1,
     marginBottomX: 1,
     title: "ab2-bold",
-    description: "ub3",
+    description: "ub4",
     imageWidth: 54,
     imageHeight: 44
   },
@@ -22,7 +22,7 @@ const e = {
     borderRadiusX: 1,
     marginBottomX: 1.5,
     title: "ah4-bold",
-    description: "ub2",
+    description: "ub3",
     imageWidth: 122,
     imageHeight: 100
   }
@@ -62,7 +62,7 @@ const e = {
         children: s ?? "Oops! Looks like something went wrong"
       }
     ),
-    /* @__PURE__ */ i(l, { $renderAs: "ub2", $align: "center", $marginBottomX: 1.5, $color: o, children: g ?? /* @__PURE__ */ n(X, { children: [
+    /* @__PURE__ */ i(l, { $renderAs: "ub3", $align: "center", $marginBottomX: 1.5, $color: o, children: g ?? /* @__PURE__ */ n(X, { children: [
       "Please try again. Alternatively if that does not work,",
       /* @__PURE__ */ i("br", {}),
       " please contact support."

package/dist/features/ui/error/error.js.map

@@ -1 +1 @@
-{"version":3,"file":"error.js","sources":["../../../../src/features/ui/error/error.tsx"],"sourcesContent":["import { useCallback, type FC } from 'react';\n\nimport { ILLUSTRATIONS } from '../../../assets/illustrations/illustrations';\nimport Button from '../buttons/button/button';\nimport Image from '../image/image';\nimport FlexView from '../layout/flex-view';\nimport Text from '../text/text';\nimport type { TTextVariants } from '../types';\n\ninterface IErrorProps {\n  onTryAgain?: () => void;\n  height?: string | number;\n  theme?: 'light' | 'dark';\n  title?: string;\n  description?: string;\n  size?: 'compact' | 'full';\n}\n\ninterface IErrorConfig {\n  widthX: number;\n  heightX: number;\n  borderRadiusX: number;\n  marginBottomX: number;\n  title: TTextVariants;\n  description: TTextVariants;\n  imageWidth: number;\n  imageHeight: number;\n}\n\nconst ERROR_CONFIG: Record<'compact' | 'full', IErrorConfig> = {\n  compact: {\n    widthX: 10,\n    heightX: 5,\n    borderRadiusX: 1,\n    marginBottomX: 1,\n    title: 'ab2-bold',\n    description: 'ub3',\n    imageWidth: 54,\n    imageHeight: 44,\n  },\n  full: {\n    widthX: 22.5,\n    heightX: 11.5,\n    borderRadiusX: 1,\n    marginBottomX: 1.5,\n    title: 'ah4-bold',\n    description: 'ub2',\n    imageWidth: 122,\n    imageHeight: 100,\n  },\n};\n\nconst Error: FC<IErrorProps> = props => {\n  const { height, onTryAgain, theme = 'light', title, description, size = 'full' } = props;\n\n  const handleTryAgain = useCallback(() => {\n    if (onTryAgain) {\n      onTryAgain();\n    } else {\n      window.location.reload();\n    }\n  }, [onTryAgain]);\n\n  const textColor = theme === 'dark' ? 'WHITE_T_87' : 'BLACK_T_87';\n\n  return (\n    <FlexView $alignItems=\"center\" $justifyContent=\"center\" $height={height}>\n      <FlexView\n        $widthX={ERROR_CONFIG[size].widthX}\n        $heightX={ERROR_CONFIG[size].heightX}\n        $borderRadiusX={ERROR_CONFIG[size].borderRadiusX}\n        $marginBottomX={ERROR_CONFIG[size].marginBottomX}\n        $background=\"GREY_1\"\n        $justifyContent=\"center\"\n        $alignItems=\"center\"\n      >\n        <Image\n          width={ERROR_CONFIG[size].imageWidth}\n          height={ERROR_CONFIG[size].imageHeight}\n          src={ILLUSTRATIONS.ROCKET_BROKEN}\n          withLoader={false}\n        />\n      </FlexView>\n      <Text\n        $renderAs={ERROR_CONFIG[size].title}\n        $marginBottomX={0.5}\n        $color={textColor}\n        $align=\"center\"\n      >\n        {title ?? 'Oops! Looks like something went wrong'}\n      </Text>\n      <Text $renderAs=\"ub2\" $align=\"center\" $marginBottomX={1.5} $color={textColor}>\n        {description ?? (\n          <>\n            Please try again. Alternatively if that does not work,\n            <br /> please contact support.\n          </>\n        )}\n      </Text>\n      <Button\n        label=\"Try again\"\n        onClick={handleTryAgain}\n        renderAs=\"primary\"\n        size=\"small\"\n        widthX={14}\n      />\n    </FlexView>\n  );\n};\n\nexport default Error;\n"],"names":["ERROR_CONFIG","Error","props","height","onTryAgain","theme","title","description","size","handleTryAgain","useCallback","textColor","FlexView","jsx","Image","ILLUSTRATIONS","Text","jsxs","Fragment","Button","Error$1"],"mappings":";;;;;;;AA6BA,MAAMA,IAAyD;AAAA,EAC7D,SAAS;AAAA,IACP,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,eAAe;AAAA,IACf,eAAe;AAAA,IACf,OAAO;AAAA,IACP,aAAa;AAAA,IACb,YAAY;AAAA,IACZ,aAAa;AAAA,EACf;AAAA,EACA,MAAM;AAAA,IACJ,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,eAAe;AAAA,IACf,eAAe;AAAA,IACf,OAAO;AAAA,IACP,aAAa;AAAA,IACb,YAAY;AAAA,IACZ,aAAa;AAAA,EACf;AACF,GAEMC,IAAyB,CAASC,MAAA;AAChC,QAAA,EAAE,QAAAC,GAAQ,YAAAC,GAAY,OAAAC,IAAQ,SAAS,OAAAC,GAAO,aAAAC,GAAa,MAAAC,IAAO,OAAW,IAAAN,GAE7EO,IAAiBC,EAAY,MAAM;AACvC,IAAIN,IACSA,MAEX,OAAO,SAAS;EAClB,GACC,CAACA,CAAU,CAAC,GAETO,IAAYN,MAAU,SAAS,eAAe;AAEpD,2BACGO,GAAS,EAAA,aAAY,UAAS,iBAAgB,UAAS,SAAST,GAC/D,UAAA;AAAA,IAAA,gBAAAU;AAAA,MAACD;AAAA,MAAA;AAAA,QACC,SAASZ,EAAaQ,CAAI,EAAE;AAAA,QAC5B,UAAUR,EAAaQ,CAAI,EAAE;AAAA,QAC7B,gBAAgBR,EAAaQ,CAAI,EAAE;AAAA,QACnC,gBAAgBR,EAAaQ,CAAI,EAAE;AAAA,QACnC,aAAY;AAAA,QACZ,iBAAgB;AAAA,QAChB,aAAY;AAAA,QAEZ,UAAA,gBAAAK;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,OAAOd,EAAaQ,CAAI,EAAE;AAAA,YAC1B,QAAQR,EAAaQ,CAAI,EAAE;AAAA,YAC3B,KAAKO,EAAc;AAAA,YACnB,YAAY;AAAA,UAAA;AAAA,QACd;AAAA,MAAA;AAAA,IACF;AAAA,IACA,gBAAAF;AAAA,MAACG;AAAA,MAAA;AAAA,QACC,WAAWhB,EAAaQ,CAAI,EAAE;AAAA,QAC9B,gBAAgB;AAAA,QAChB,QAAQG;AAAA,QACR,QAAO;AAAA,QAEN,UAASL,KAAA;AAAA,MAAA;AAAA,IACZ;AAAA,IACA,gBAAAO,EAACG,GAAK,EAAA,WAAU,OAAM,QAAO,UAAS,gBAAgB,KAAK,QAAQL,GAChE,UAAAJ,KACG,gBAAAU,EAAAC,GAAA,EAAA,UAAA;AAAA,MAAA;AAAA,wBAEC,MAAG,EAAA;AAAA,MAAE;AAAA,IAAA,EAAA,CACR,EAEJ,CAAA;AAAA,IACA,gBAAAL;AAAA,MAACM;AAAA,MAAA;AAAA,QACC,OAAM;AAAA,QACN,SAASV;AAAA,QACT,UAAS;AAAA,QACT,MAAK;AAAA,QACL,QAAQ;AAAA,MAAA;AAAA,IACV;AAAA,EACF,EAAA,CAAA;AAEJ,GAEAW,IAAenB;"}
+{"version":3,"file":"error.js","sources":["../../../../src/features/ui/error/error.tsx"],"sourcesContent":["import { useCallback, type FC } from 'react';\n\nimport { ILLUSTRATIONS } from '../../../assets/illustrations/illustrations';\nimport Button from '../buttons/button/button';\nimport Image from '../image/image';\nimport FlexView from '../layout/flex-view';\nimport Text from '../text/text';\nimport type { TTextVariants } from '../types';\n\ninterface IErrorProps {\n  onTryAgain?: () => void;\n  height?: string | number;\n  theme?: 'light' | 'dark';\n  title?: string;\n  description?: string;\n  size?: 'compact' | 'full';\n}\n\ninterface IErrorConfig {\n  widthX: number;\n  heightX: number;\n  borderRadiusX: number;\n  marginBottomX: number;\n  title: TTextVariants;\n  description: TTextVariants;\n  imageWidth: number;\n  imageHeight: number;\n}\n\nconst ERROR_CONFIG: Record<'compact' | 'full', IErrorConfig> = {\n  compact: {\n    widthX: 10,\n    heightX: 5,\n    borderRadiusX: 1,\n    marginBottomX: 1,\n    title: 'ab2-bold',\n    description: 'ub4',\n    imageWidth: 54,\n    imageHeight: 44,\n  },\n  full: {\n    widthX: 22.5,\n    heightX: 11.5,\n    borderRadiusX: 1,\n    marginBottomX: 1.5,\n    title: 'ah4-bold',\n    description: 'ub3',\n    imageWidth: 122,\n    imageHeight: 100,\n  },\n};\n\nconst Error: FC<IErrorProps> = props => {\n  const { height, onTryAgain, theme = 'light', title, description, size = 'full' } = props;\n\n  const handleTryAgain = useCallback(() => {\n    if (onTryAgain) {\n      onTryAgain();\n    } else {\n      window.location.reload();\n    }\n  }, [onTryAgain]);\n\n  const textColor = theme === 'dark' ? 'WHITE_T_87' : 'BLACK_T_87';\n\n  return (\n    <FlexView $alignItems=\"center\" $justifyContent=\"center\" $height={height}>\n      <FlexView\n        $widthX={ERROR_CONFIG[size].widthX}\n        $heightX={ERROR_CONFIG[size].heightX}\n        $borderRadiusX={ERROR_CONFIG[size].borderRadiusX}\n        $marginBottomX={ERROR_CONFIG[size].marginBottomX}\n        $background=\"GREY_1\"\n        $justifyContent=\"center\"\n        $alignItems=\"center\"\n      >\n        <Image\n          width={ERROR_CONFIG[size].imageWidth}\n          height={ERROR_CONFIG[size].imageHeight}\n          src={ILLUSTRATIONS.ROCKET_BROKEN}\n          withLoader={false}\n        />\n      </FlexView>\n      <Text\n        $renderAs={ERROR_CONFIG[size].title}\n        $marginBottomX={0.5}\n        $color={textColor}\n        $align=\"center\"\n      >\n        {title ?? 'Oops! Looks like something went wrong'}\n      </Text>\n      <Text $renderAs=\"ub3\" $align=\"center\" $marginBottomX={1.5} $color={textColor}>\n        {description ?? (\n          <>\n            Please try again. Alternatively if that does not work,\n            <br /> please contact support.\n          </>\n        )}\n      </Text>\n      <Button\n        label=\"Try again\"\n        onClick={handleTryAgain}\n        renderAs=\"primary\"\n        size=\"small\"\n        widthX={14}\n      />\n    </FlexView>\n  );\n};\n\nexport default Error;\n"],"names":["ERROR_CONFIG","Error","props","height","onTryAgain","theme","title","description","size","handleTryAgain","useCallback","textColor","FlexView","jsx","Image","ILLUSTRATIONS","Text","jsxs","Fragment","Button","Error$1"],"mappings":";;;;;;;AA6BA,MAAMA,IAAyD;AAAA,EAC7D,SAAS;AAAA,IACP,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,eAAe;AAAA,IACf,eAAe;AAAA,IACf,OAAO;AAAA,IACP,aAAa;AAAA,IACb,YAAY;AAAA,IACZ,aAAa;AAAA,EACf;AAAA,EACA,MAAM;AAAA,IACJ,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,eAAe;AAAA,IACf,eAAe;AAAA,IACf,OAAO;AAAA,IACP,aAAa;AAAA,IACb,YAAY;AAAA,IACZ,aAAa;AAAA,EACf;AACF,GAEMC,IAAyB,CAASC,MAAA;AAChC,QAAA,EAAE,QAAAC,GAAQ,YAAAC,GAAY,OAAAC,IAAQ,SAAS,OAAAC,GAAO,aAAAC,GAAa,MAAAC,IAAO,OAAW,IAAAN,GAE7EO,IAAiBC,EAAY,MAAM;AACvC,IAAIN,IACSA,MAEX,OAAO,SAAS;EAClB,GACC,CAACA,CAAU,CAAC,GAETO,IAAYN,MAAU,SAAS,eAAe;AAEpD,2BACGO,GAAS,EAAA,aAAY,UAAS,iBAAgB,UAAS,SAAST,GAC/D,UAAA;AAAA,IAAA,gBAAAU;AAAA,MAACD;AAAA,MAAA;AAAA,QACC,SAASZ,EAAaQ,CAAI,EAAE;AAAA,QAC5B,UAAUR,EAAaQ,CAAI,EAAE;AAAA,QAC7B,gBAAgBR,EAAaQ,CAAI,EAAE;AAAA,QACnC,gBAAgBR,EAAaQ,CAAI,EAAE;AAAA,QACnC,aAAY;AAAA,QACZ,iBAAgB;AAAA,QAChB,aAAY;AAAA,QAEZ,UAAA,gBAAAK;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,OAAOd,EAAaQ,CAAI,EAAE;AAAA,YAC1B,QAAQR,EAAaQ,CAAI,EAAE;AAAA,YAC3B,KAAKO,EAAc;AAAA,YACnB,YAAY;AAAA,UAAA;AAAA,QACd;AAAA,MAAA;AAAA,IACF;AAAA,IACA,gBAAAF;AAAA,MAACG;AAAA,MAAA;AAAA,QACC,WAAWhB,EAAaQ,CAAI,EAAE;AAAA,QAC9B,gBAAgB;AAAA,QAChB,QAAQG;AAAA,QACR,QAAO;AAAA,QAEN,UAASL,KAAA;AAAA,MAAA;AAAA,IACZ;AAAA,IACA,gBAAAO,EAACG,GAAK,EAAA,WAAU,OAAM,QAAO,UAAS,gBAAgB,KAAK,QAAQL,GAChE,UAAAJ,KACG,gBAAAU,EAAAC,GAAA,EAAA,UAAA;AAAA,MAAA;AAAA,wBAEC,MAAG,EAAA;AAAA,MAAE;AAAA,IAAA,EAAA,CACR,EAEJ,CAAA;AAAA,IACA,gBAAAL;AAAA,MAACM;AAAA,MAAA;AAAA,QACC,OAAM;AAAA,QACN,SAASV;AAAA,QACT,UAAS;AAAA,QACT,MAAK;AAAA,QACL,QAAQ;AAAA,MAAA;AAAA,IACV;AAAA,EACF,EAAA,CAAA;AAEJ,GAEAW,IAAenB;"}

package/dist/features/ui/inputs/base-input/base-input.js

@@ -31,8 +31,8 @@ const H = ($) => {
       children: [
         /* @__PURE__ */ a(f, { children: [
           w,
-          n && /* @__PURE__ */ r(L, { $renderAs: "ub3", $inputRenderAs: e, children: n }),
-          o && !n && /* @__PURE__ */ r(R, { $renderAs: "ub3", $inputRenderAs: e, children: o })
+          n && /* @__PURE__ */ r(L, { $renderAs: "ub4", $inputRenderAs: e, children: n }),
+          o && !n && /* @__PURE__ */ r(R, { $renderAs: "ub4", $inputRenderAs: e, children: o })
         ] }),
         d ? /* @__PURE__ */ r(
           y,

package/dist/features/ui/inputs/base-input/base-input.js.map

@@ -1 +1 @@
-{"version":3,"file":"base-input.js","sources":["../../../../../src/features/ui/inputs/base-input/base-input.tsx"],"sourcesContent":["import { type FC } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport {\n  Container,\n  Error,\n  InputWrapper,\n  Label,\n  SiblingWrapper,\n  Wrapper,\n  HelperText,\n} from './base-input-styled';\nimport type { IBaseInputProps } from './base-input-types';\n\nconst BaseInput: FC<IBaseInputProps> = props => {\n  const {\n    label,\n    stickyLabel,\n    renderAs,\n    width,\n    widthX,\n    disabled,\n    willShowMessage,\n    inputElement,\n    siblingElement,\n    siblingPosition,\n    size,\n    errorMessage,\n    mandatory,\n    shape,\n    isTransparent = false,\n    helperText,\n  } = props;\n  const { input } = useTheme();\n  const showLabel = label && shape !== 'curved';\n  const showHelperText = helperText && !errorMessage;\n\n  return (\n    <Container $width={width} $widthX={widthX} $size={size} $willShowMessage={willShowMessage}>\n      <Wrapper\n        $renderAs={renderAs}\n        $size={size}\n        $disabled={disabled}\n        $shape={shape}\n        $isTransparent={isTransparent}\n      >\n        <InputWrapper>\n          {inputElement}\n          {errorMessage && (\n            <Error $renderAs=\"ub3\" $inputRenderAs={renderAs}>\n              {errorMessage}\n            </Error>\n          )}\n          {showHelperText && (\n            <HelperText $renderAs=\"ub3\" $inputRenderAs={renderAs}>\n              {helperText}\n            </HelperText>\n          )}\n        </InputWrapper>\n        {siblingElement ? (\n          <SiblingWrapper\n            $inputRenderAs={renderAs}\n            $disabled={disabled}\n            $size={size}\n            $siblingPosition={siblingPosition ?? 'right'}\n          >\n            {siblingElement}\n          </SiblingWrapper>\n        ) : undefined}\n        {showLabel && (\n          <Label\n            $renderAs={input.sizes[size].labelTextVariant}\n            $inputRenderAs={renderAs}\n            $size={size}\n            $stickyLabel={stickyLabel}\n            $disabled={disabled}\n            $shape={shape}\n            $isTransparent={isTransparent}\n          >\n            {label}\n            {mandatory && <span>*</span>}\n          </Label>\n        )}\n      </Wrapper>\n    </Container>\n  );\n};\n\nexport default BaseInput;\n"],"names":["BaseInput","props","label","stickyLabel","renderAs","width","widthX","disabled","willShowMessage","inputElement","siblingElement","siblingPosition","size","errorMessage","mandatory","shape","isTransparent","helperText","input","useTheme","jsx","Container","jsxs","Wrapper","InputWrapper","Error","HelperText","SiblingWrapper","Label","BaseInput$1"],"mappings":";;;AAcA,MAAMA,IAAiC,CAASC,MAAA;AACxC,QAAA;AAAA,IACJ,OAAAC;AAAA,IACA,aAAAC;AAAA,IACA,UAAAC;AAAA,IACA,OAAAC;AAAA,IACA,QAAAC;AAAA,IACA,UAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,cAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,MAAAC;AAAA,IACA,cAAAC;AAAA,IACA,WAAAC;AAAA,IACA,OAAAC;AAAA,IACA,eAAAC,IAAgB;AAAA,IAChB,YAAAC;AAAA,EACE,IAAAhB,GACE,EAAE,OAAAiB,MAAUC;AAKhB,SAAA,gBAAAC,EAACC,KAAU,QAAQhB,GAAO,SAASC,GAAQ,OAAOM,GAAM,kBAAkBJ,GACxE,UAAA,gBAAAc;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAWnB;AAAA,MACX,OAAOQ;AAAA,MACP,WAAWL;AAAA,MACX,QAAQQ;AAAA,MACR,gBAAgBC;AAAA,MAEhB,UAAA;AAAA,QAAA,gBAAAM,EAACE,GACE,EAAA,UAAA;AAAA,UAAAf;AAAA,UACAI,KACE,gBAAAO,EAAAK,GAAA,EAAM,WAAU,OAAM,gBAAgBrB,GACpC,UACHS,GAAA;AAAA,UAhBaI,KAAc,CAACJ,KAmB3B,gBAAAO,EAAAM,GAAA,EAAW,WAAU,OAAM,gBAAgBtB,GACzC,UACHa,GAAA;AAAA,QAAA,GAEJ;AAAA,QACCP,IACC,gBAAAU;AAAA,UAACO;AAAA,UAAA;AAAA,YACC,gBAAgBvB;AAAA,YAChB,WAAWG;AAAA,YACX,OAAOK;AAAA,YACP,kBAAkBD,KAAmB;AAAA,YAEpC,UAAAD;AAAA,UAAA;AAAA,QAED,IAAA;AAAA,QAlCQR,KAASa,MAAU,YAoC7B,gBAAAO;AAAA,UAACM;AAAA,UAAA;AAAA,YACC,WAAWV,EAAM,MAAMN,CAAI,EAAE;AAAA,YAC7B,gBAAgBR;AAAA,YAChB,OAAOQ;AAAA,YACP,cAAcT;AAAA,YACd,WAAWI;AAAA,YACX,QAAQQ;AAAA,YACR,gBAAgBC;AAAA,YAEf,UAAA;AAAA,cAAAd;AAAA,cACAY,KAAc,gBAAAM,EAAA,QAAA,EAAK,UAAC,IAAA,CAAA;AAAA,YAAA;AAAA,UAAA;AAAA,QACvB;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN,EAAA,CAAA;AAEJ,GAEAS,IAAe7B;"}
+{"version":3,"file":"base-input.js","sources":["../../../../../src/features/ui/inputs/base-input/base-input.tsx"],"sourcesContent":["import { type FC } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport {\n  Container,\n  Error,\n  InputWrapper,\n  Label,\n  SiblingWrapper,\n  Wrapper,\n  HelperText,\n} from './base-input-styled';\nimport type { IBaseInputProps } from './base-input-types';\n\nconst BaseInput: FC<IBaseInputProps> = props => {\n  const {\n    label,\n    stickyLabel,\n    renderAs,\n    width,\n    widthX,\n    disabled,\n    willShowMessage,\n    inputElement,\n    siblingElement,\n    siblingPosition,\n    size,\n    errorMessage,\n    mandatory,\n    shape,\n    isTransparent = false,\n    helperText,\n  } = props;\n  const { input } = useTheme();\n  const showLabel = label && shape !== 'curved';\n  const showHelperText = helperText && !errorMessage;\n\n  return (\n    <Container $width={width} $widthX={widthX} $size={size} $willShowMessage={willShowMessage}>\n      <Wrapper\n        $renderAs={renderAs}\n        $size={size}\n        $disabled={disabled}\n        $shape={shape}\n        $isTransparent={isTransparent}\n      >\n        <InputWrapper>\n          {inputElement}\n          {errorMessage && (\n            <Error $renderAs=\"ub4\" $inputRenderAs={renderAs}>\n              {errorMessage}\n            </Error>\n          )}\n          {showHelperText && (\n            <HelperText $renderAs=\"ub4\" $inputRenderAs={renderAs}>\n              {helperText}\n            </HelperText>\n          )}\n        </InputWrapper>\n        {siblingElement ? (\n          <SiblingWrapper\n            $inputRenderAs={renderAs}\n            $disabled={disabled}\n            $size={size}\n            $siblingPosition={siblingPosition ?? 'right'}\n          >\n            {siblingElement}\n          </SiblingWrapper>\n        ) : undefined}\n        {showLabel && (\n          <Label\n            $renderAs={input.sizes[size].labelTextVariant}\n            $inputRenderAs={renderAs}\n            $size={size}\n            $stickyLabel={stickyLabel}\n            $disabled={disabled}\n            $shape={shape}\n            $isTransparent={isTransparent}\n          >\n            {label}\n            {mandatory && <span>*</span>}\n          </Label>\n        )}\n      </Wrapper>\n    </Container>\n  );\n};\n\nexport default BaseInput;\n"],"names":["BaseInput","props","label","stickyLabel","renderAs","width","widthX","disabled","willShowMessage","inputElement","siblingElement","siblingPosition","size","errorMessage","mandatory","shape","isTransparent","helperText","input","useTheme","jsx","Container","jsxs","Wrapper","InputWrapper","Error","HelperText","SiblingWrapper","Label","BaseInput$1"],"mappings":";;;AAcA,MAAMA,IAAiC,CAASC,MAAA;AACxC,QAAA;AAAA,IACJ,OAAAC;AAAA,IACA,aAAAC;AAAA,IACA,UAAAC;AAAA,IACA,OAAAC;AAAA,IACA,QAAAC;AAAA,IACA,UAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,cAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,MAAAC;AAAA,IACA,cAAAC;AAAA,IACA,WAAAC;AAAA,IACA,OAAAC;AAAA,IACA,eAAAC,IAAgB;AAAA,IAChB,YAAAC;AAAA,EACE,IAAAhB,GACE,EAAE,OAAAiB,MAAUC;AAKhB,SAAA,gBAAAC,EAACC,KAAU,QAAQhB,GAAO,SAASC,GAAQ,OAAOM,GAAM,kBAAkBJ,GACxE,UAAA,gBAAAc;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAWnB;AAAA,MACX,OAAOQ;AAAA,MACP,WAAWL;AAAA,MACX,QAAQQ;AAAA,MACR,gBAAgBC;AAAA,MAEhB,UAAA;AAAA,QAAA,gBAAAM,EAACE,GACE,EAAA,UAAA;AAAA,UAAAf;AAAA,UACAI,KACE,gBAAAO,EAAAK,GAAA,EAAM,WAAU,OAAM,gBAAgBrB,GACpC,UACHS,GAAA;AAAA,UAhBaI,KAAc,CAACJ,KAmB3B,gBAAAO,EAAAM,GAAA,EAAW,WAAU,OAAM,gBAAgBtB,GACzC,UACHa,GAAA;AAAA,QAAA,GAEJ;AAAA,QACCP,IACC,gBAAAU;AAAA,UAACO;AAAA,UAAA;AAAA,YACC,gBAAgBvB;AAAA,YAChB,WAAWG;AAAA,YACX,OAAOK;AAAA,YACP,kBAAkBD,KAAmB;AAAA,YAEpC,UAAAD;AAAA,UAAA;AAAA,QAED,IAAA;AAAA,QAlCQR,KAASa,MAAU,YAoC7B,gBAAAO;AAAA,UAACM;AAAA,UAAA;AAAA,YACC,WAAWV,EAAM,MAAMN,CAAI,EAAE;AAAA,YAC7B,gBAAgBR;AAAA,YAChB,OAAOQ;AAAA,YACP,cAAcT;AAAA,YACd,WAAWI;AAAA,YACX,QAAQQ;AAAA,YACR,gBAAgBC;AAAA,YAEf,UAAA;AAAA,cAAAd;AAAA,cACAY,KAAc,gBAAAM,EAAA,QAAA,EAAK,UAAC,IAAA,CAAA;AAAA,YAAA;AAAA,UAAA;AAAA,QACvB;AAAA,MAAA;AAAA,IAAA;AAAA,EAGN,EAAA,CAAA;AAEJ,GAEAS,IAAe7B;"}

package/dist/features/ui/inputs/base-select-input/select-option/select-option.js

@@ -10,7 +10,7 @@ const f = ({
 }) => {
   const { id: t, label: n } = e, i = d(() => {
     o(t, e);
-  }, [o, t, e]), a = r ? "ub1-bold" : "ub1", m = r ? "ub2-bold" : "ub2", l = c === "dark";
+  }, [o, t, e]), a = r ? "ub2-bold" : "ub2", m = r ? "ub3-bold" : "ub3", l = c === "dark";
   return /* @__PURE__ */ s(p, { onClick: i, className: "base-select-input-option", children: /* @__PURE__ */ s(
     b,
     {

package/dist/features/ui/inputs/base-select-input/select-option/select-option.js.map

@@ -1 +1 @@
-{"version":3,"file":"select-option.js","sources":["../../../../../../src/features/ui/inputs/base-select-input/select-option/select-option.tsx"],"sourcesContent":["import { useCallback, type ReactElement } from 'react';\n\nimport Text from '../../../text/text';\nimport * as Styled from './select-option-styled';\nimport type { ISelectOptionProps } from './select-option-types';\n\nconst SelectOption = <IDType extends string | number>({\n  option,\n  selected,\n  onChange,\n  theme,\n}: ISelectOptionProps<IDType>): ReactElement => {\n  const { id, label } = option;\n\n  const handleOnClick = useCallback(() => {\n    onChange(id, option);\n  }, [onChange, id, option]);\n\n  const lightThemeRenderAs = selected ? 'ub1-bold' : 'ub1';\n  const darkThemeRenderAs = selected ? 'ub2-bold' : 'ub2';\n  const isDarkTheme = theme === 'dark';\n\n  return (\n    <Styled.SelectOptionWrapper onClick={handleOnClick} className=\"base-select-input-option\">\n      <Text\n        $renderAs={isDarkTheme ? darkThemeRenderAs : lightThemeRenderAs}\n        $color={isDarkTheme ? 'WHITE_T_87' : 'BLACK'}\n      >\n        {label}\n      </Text>\n    </Styled.SelectOptionWrapper>\n  );\n};\n\nexport default SelectOption;\n"],"names":["SelectOption","option","selected","onChange","theme","id","label","handleOnClick","useCallback","lightThemeRenderAs","darkThemeRenderAs","isDarkTheme","Styled.SelectOptionWrapper","jsx","Text"],"mappings":";;;;AAMA,MAAMA,IAAe,CAAiC;AAAA,EACpD,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC;AACF,MAAgD;AACxC,QAAA,EAAE,IAAAC,GAAI,OAAAC,EAAU,IAAAL,GAEhBM,IAAgBC,EAAY,MAAM;AACtC,IAAAL,EAASE,GAAIJ,CAAM;AAAA,EAClB,GAAA,CAACE,GAAUE,GAAIJ,CAAM,CAAC,GAEnBQ,IAAqBP,IAAW,aAAa,OAC7CQ,IAAoBR,IAAW,aAAa,OAC5CS,IAAcP,MAAU;AAE9B,2BACGQ,GAAA,EAA2B,SAASL,GAAe,WAAU,4BAC5D,UAAA,gBAAAM;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAWH,IAAcD,IAAoBD;AAAA,MAC7C,QAAQE,IAAc,eAAe;AAAA,MAEpC,UAAAL;AAAA,IAAA;AAAA,EAEL,EAAA,CAAA;AAEJ;"}
+{"version":3,"file":"select-option.js","sources":["../../../../../../src/features/ui/inputs/base-select-input/select-option/select-option.tsx"],"sourcesContent":["import { useCallback, type ReactElement } from 'react';\n\nimport Text from '../../../text/text';\nimport * as Styled from './select-option-styled';\nimport type { ISelectOptionProps } from './select-option-types';\n\nconst SelectOption = <IDType extends string | number>({\n  option,\n  selected,\n  onChange,\n  theme,\n}: ISelectOptionProps<IDType>): ReactElement => {\n  const { id, label } = option;\n\n  const handleOnClick = useCallback(() => {\n    onChange(id, option);\n  }, [onChange, id, option]);\n\n  const lightThemeRenderAs = selected ? 'ub2-bold' : 'ub2';\n  const darkThemeRenderAs = selected ? 'ub3-bold' : 'ub3';\n  const isDarkTheme = theme === 'dark';\n\n  return (\n    <Styled.SelectOptionWrapper onClick={handleOnClick} className=\"base-select-input-option\">\n      <Text\n        $renderAs={isDarkTheme ? darkThemeRenderAs : lightThemeRenderAs}\n        $color={isDarkTheme ? 'WHITE_T_87' : 'BLACK'}\n      >\n        {label}\n      </Text>\n    </Styled.SelectOptionWrapper>\n  );\n};\n\nexport default SelectOption;\n"],"names":["SelectOption","option","selected","onChange","theme","id","label","handleOnClick","useCallback","lightThemeRenderAs","darkThemeRenderAs","isDarkTheme","Styled.SelectOptionWrapper","jsx","Text"],"mappings":";;;;AAMA,MAAMA,IAAe,CAAiC;AAAA,EACpD,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC;AACF,MAAgD;AACxC,QAAA,EAAE,IAAAC,GAAI,OAAAC,EAAU,IAAAL,GAEhBM,IAAgBC,EAAY,MAAM;AACtC,IAAAL,EAASE,GAAIJ,CAAM;AAAA,EAClB,GAAA,CAACE,GAAUE,GAAIJ,CAAM,CAAC,GAEnBQ,IAAqBP,IAAW,aAAa,OAC7CQ,IAAoBR,IAAW,aAAa,OAC5CS,IAAcP,MAAU;AAE9B,2BACGQ,GAAA,EAA2B,SAASL,GAAe,WAAU,4BAC5D,UAAA,gBAAAM;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAWH,IAAcD,IAAoBD;AAAA,MAC7C,QAAQE,IAAc,eAAe;AAAA,MAEpC,UAAAL;AAAA,IAAA;AAAA,EAEL,EAAA,CAAA;AAEJ;"}

package/dist/features/ui/inputs/base-select-input/select-section/select-section.js

@@ -29,7 +29,7 @@ const S = ({
             /* @__PURE__ */ o(
               a,
               {
-                $renderAs: t ? s ? "ub2-bold" : "ub2" : s ? "ub1-bold" : "ub1",
+                $renderAs: t ? s ? "ub3-bold" : "ub3" : s ? "ub2-bold" : "ub2",
                 $color: t ? "WHITE_T_87" : "BLACK",
                 $textDecoration: u,
                 children: $

package/dist/features/ui/inputs/base-select-input/select-section/select-section.js.map

@@ -1 +1 @@
-{"version":3,"file":"select-section.js","sources":["../../../../../../src/features/ui/inputs/base-select-input/select-section/select-section.tsx"],"sourcesContent":["import { memo, useCallback, type ReactElement } from 'react';\n\nimport SectionList from '../../../section-list/section-list';\nimport type { ISectionOption } from '../../../section-list/section-list-types';\nimport Text from '../../../text/text';\nimport type { ISelectOption } from '../base-select-input-types';\nimport * as Styled from './select-section-styled';\nimport type { ISelectSection } from './select-section-types';\n\nconst SelectSectionComponent = <IDType extends string | number>({\n  sectionOptions,\n  theme,\n  value,\n  onChange,\n}: ISelectSection<IDType>): ReactElement => {\n  const isDarkTheme = theme === 'dark';\n\n  const renderSectionHeader = useCallback(\n    (section: ISectionOption<ISelectOption<IDType>>) => {\n      return (\n        <Styled.SelectOptionHeader $gutterX={1}>\n          <Text $renderAs=\"ac4\" $color={isDarkTheme ? 'WHITE_T_38' : 'BLACK_T_38'}>\n            {section.title}\n          </Text>\n        </Styled.SelectOptionHeader>\n      );\n    },\n    [isDarkTheme],\n  );\n\n  const renderItem = useCallback(\n    (dataItem: ISelectOption<IDType>) => {\n      const { id, label, tag, textDecoration } = dataItem;\n      const selected = id === value;\n      const lightThemeRenderAs = selected ? 'ub1-bold' : 'ub1';\n      const darkThemeRenderAs = selected ? 'ub2-bold' : 'ub2';\n      const Tag = tag ? (tag as ReactElement) : null;\n\n      return (\n        <Styled.SelectOptionWrapper\n          className=\"base-select-input-option\"\n          onClick={() => onChange(id, dataItem)}\n          $width=\"100%\"\n          $flexDirection=\"row\"\n          $justifyContent=\"space-between\"\n          $alignItems=\"center\"\n          $flexGapX={0.5}\n        >\n          <Text\n            $renderAs={isDarkTheme ? darkThemeRenderAs : lightThemeRenderAs}\n            $color={isDarkTheme ? 'WHITE_T_87' : 'BLACK'}\n            $textDecoration={textDecoration}\n          >\n            {label}\n          </Text>\n\n          {Tag}\n        </Styled.SelectOptionWrapper>\n      );\n    },\n    [value, isDarkTheme, onChange],\n  );\n\n  return (\n    <SectionList<ISelectOption<IDType>>\n      data={sectionOptions}\n      renderSectionHeader={renderSectionHeader}\n      renderItem={renderItem}\n      keyExtractor={({ id }, idx) => `${id}_${idx}`}\n    />\n  );\n};\n\nconst SelectSection = memo(SelectSectionComponent) as <IDType extends string | number>(\n  props: ISelectSection<IDType>,\n) => ReactElement;\n\nexport default SelectSection;\n"],"names":["SelectSectionComponent","sectionOptions","theme","value","onChange","isDarkTheme","renderSectionHeader","useCallback","section","Styled.SelectOptionHeader","jsx","Text","renderItem","dataItem","id","label","tag","textDecoration","selected","jsxs","Styled.SelectOptionWrapper","SectionList","idx","SelectSection","memo"],"mappings":";;;;;AASA,MAAMA,IAAyB,CAAiC;AAAA,EAC9D,gBAAAC;AAAA,EACA,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AACF,MAA4C;AAC1C,QAAMC,IAAcH,MAAU,QAExBI,IAAsBC;AAAA,IAC1B,CAACC,wBAEIC,GAAA,EAA0B,UAAU,GACnC,UAAC,gBAAAC,EAAAC,GAAA,EAAK,WAAU,OAAM,QAAQN,IAAc,eAAe,cACxD,UAAAG,EAAQ,OACX,EACF,CAAA;AAAA,IAGJ,CAACH,CAAW;AAAA,EAAA,GAGRO,IAAaL;AAAA,IACjB,CAACM,MAAoC;AACnC,YAAM,EAAE,IAAAC,GAAI,OAAAC,GAAO,KAAAC,GAAK,gBAAAC,MAAmBJ,GACrCK,IAAWJ,MAAOX;AAMtB,aAAA,gBAAAgB;AAAA,QAACC;AAAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,SAAS,MAAMhB,EAASU,GAAID,CAAQ;AAAA,UACpC,QAAO;AAAA,UACP,gBAAe;AAAA,UACf,iBAAgB;AAAA,UAChB,aAAY;AAAA,UACZ,WAAW;AAAA,UAEX,UAAA;AAAA,YAAA,gBAAAH;AAAA,cAACC;AAAA,cAAA;AAAA,gBACC,WAAWN,IAdSa,IAAW,aAAa,QADvBA,IAAW,aAAa;AAAA,gBAgB7C,QAAQb,IAAc,eAAe;AAAA,gBACrC,iBAAiBY;AAAA,gBAEhB,UAAAF;AAAA,cAAA;AAAA,YACH;AAAA,YAlBQC,KAA8B;AAAA,UAoBrC;AAAA,QAAA;AAAA,MAAA;AAAA,IAGP;AAAA,IACA,CAACb,GAAOE,GAAaD,CAAQ;AAAA,EAAA;AAI7B,SAAA,gBAAAM;AAAA,IAACW;AAAA,IAAA;AAAA,MACC,MAAMpB;AAAA,MACN,qBAAAK;AAAA,MACA,YAAAM;AAAA,MACA,cAAc,CAAC,EAAE,IAAAE,KAAMQ,MAAQ,GAAGR,CAAE,IAAIQ,CAAG;AAAA,IAAA;AAAA,EAAA;AAGjD,GAEMC,IAAgBC,EAAKxB,CAAsB;"}
+{"version":3,"file":"select-section.js","sources":["../../../../../../src/features/ui/inputs/base-select-input/select-section/select-section.tsx"],"sourcesContent":["import { memo, useCallback, type ReactElement } from 'react';\n\nimport SectionList from '../../../section-list/section-list';\nimport type { ISectionOption } from '../../../section-list/section-list-types';\nimport Text from '../../../text/text';\nimport type { ISelectOption } from '../base-select-input-types';\nimport * as Styled from './select-section-styled';\nimport type { ISelectSection } from './select-section-types';\n\nconst SelectSectionComponent = <IDType extends string | number>({\n  sectionOptions,\n  theme,\n  value,\n  onChange,\n}: ISelectSection<IDType>): ReactElement => {\n  const isDarkTheme = theme === 'dark';\n\n  const renderSectionHeader = useCallback(\n    (section: ISectionOption<ISelectOption<IDType>>) => {\n      return (\n        <Styled.SelectOptionHeader $gutterX={1}>\n          <Text $renderAs=\"ac4\" $color={isDarkTheme ? 'WHITE_T_38' : 'BLACK_T_38'}>\n            {section.title}\n          </Text>\n        </Styled.SelectOptionHeader>\n      );\n    },\n    [isDarkTheme],\n  );\n\n  const renderItem = useCallback(\n    (dataItem: ISelectOption<IDType>) => {\n      const { id, label, tag, textDecoration } = dataItem;\n      const selected = id === value;\n      const lightThemeRenderAs = selected ? 'ub2-bold' : 'ub2';\n      const darkThemeRenderAs = selected ? 'ub3-bold' : 'ub3';\n      const Tag = tag ? (tag as ReactElement) : null;\n\n      return (\n        <Styled.SelectOptionWrapper\n          className=\"base-select-input-option\"\n          onClick={() => onChange(id, dataItem)}\n          $width=\"100%\"\n          $flexDirection=\"row\"\n          $justifyContent=\"space-between\"\n          $alignItems=\"center\"\n          $flexGapX={0.5}\n        >\n          <Text\n            $renderAs={isDarkTheme ? darkThemeRenderAs : lightThemeRenderAs}\n            $color={isDarkTheme ? 'WHITE_T_87' : 'BLACK'}\n            $textDecoration={textDecoration}\n          >\n            {label}\n          </Text>\n\n          {Tag}\n        </Styled.SelectOptionWrapper>\n      );\n    },\n    [value, isDarkTheme, onChange],\n  );\n\n  return (\n    <SectionList<ISelectOption<IDType>>\n      data={sectionOptions}\n      renderSectionHeader={renderSectionHeader}\n      renderItem={renderItem}\n      keyExtractor={({ id }, idx) => `${id}_${idx}`}\n    />\n  );\n};\n\nconst SelectSection = memo(SelectSectionComponent) as <IDType extends string | number>(\n  props: ISelectSection<IDType>,\n) => ReactElement;\n\nexport default SelectSection;\n"],"names":["SelectSectionComponent","sectionOptions","theme","value","onChange","isDarkTheme","renderSectionHeader","useCallback","section","Styled.SelectOptionHeader","jsx","Text","renderItem","dataItem","id","label","tag","textDecoration","selected","jsxs","Styled.SelectOptionWrapper","SectionList","idx","SelectSection","memo"],"mappings":";;;;;AASA,MAAMA,IAAyB,CAAiC;AAAA,EAC9D,gBAAAC;AAAA,EACA,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AACF,MAA4C;AAC1C,QAAMC,IAAcH,MAAU,QAExBI,IAAsBC;AAAA,IAC1B,CAACC,wBAEIC,GAAA,EAA0B,UAAU,GACnC,UAAC,gBAAAC,EAAAC,GAAA,EAAK,WAAU,OAAM,QAAQN,IAAc,eAAe,cACxD,UAAAG,EAAQ,OACX,EACF,CAAA;AAAA,IAGJ,CAACH,CAAW;AAAA,EAAA,GAGRO,IAAaL;AAAA,IACjB,CAACM,MAAoC;AACnC,YAAM,EAAE,IAAAC,GAAI,OAAAC,GAAO,KAAAC,GAAK,gBAAAC,MAAmBJ,GACrCK,IAAWJ,MAAOX;AAMtB,aAAA,gBAAAgB;AAAA,QAACC;AAAAA,QAAA;AAAA,UACC,WAAU;AAAA,UACV,SAAS,MAAMhB,EAASU,GAAID,CAAQ;AAAA,UACpC,QAAO;AAAA,UACP,gBAAe;AAAA,UACf,iBAAgB;AAAA,UAChB,aAAY;AAAA,UACZ,WAAW;AAAA,UAEX,UAAA;AAAA,YAAA,gBAAAH;AAAA,cAACC;AAAA,cAAA;AAAA,gBACC,WAAWN,IAdSa,IAAW,aAAa,QADvBA,IAAW,aAAa;AAAA,gBAgB7C,QAAQb,IAAc,eAAe;AAAA,gBACrC,iBAAiBY;AAAA,gBAEhB,UAAAF;AAAA,cAAA;AAAA,YACH;AAAA,YAlBQC,KAA8B;AAAA,UAoBrC;AAAA,QAAA;AAAA,MAAA;AAAA,IAGP;AAAA,IACA,CAACb,GAAOE,GAAaD,CAAQ;AAAA,EAAA;AAI7B,SAAA,gBAAAM;AAAA,IAACW;AAAA,IAAA;AAAA,MACC,MAAMpB;AAAA,MACN,qBAAAK;AAAA,MACA,YAAAM;AAAA,MACA,cAAc,CAAC,EAAE,IAAAE,KAAMQ,MAAQ,GAAGR,CAAE,IAAIQ,CAAG;AAAA,IAAA;AAAA,EAAA;AAGjD,GAEMC,IAAgBC,EAAKxB,CAAsB;"}

package/dist/features/ui/inputs/num-range-input/num-range-input.js

@@ -35,7 +35,7 @@ const $ = ({
         placeholder: s
       }
     ),
-    /* @__PURE__ */ t(I, { $renderAs: "ub3", $color: "REAL_BLACK", children: "/" }),
+    /* @__PURE__ */ t(I, { $renderAs: "ub4", $color: "REAL_BLACK", children: "/" }),
     /* @__PURE__ */ t(
       p,
       {

package/dist/features/ui/inputs/num-range-input/num-range-input.js.map

@@ -1 +1 @@
-{"version":3,"file":"num-range-input.js","sources":["../../../../../src/features/ui/inputs/num-range-input/num-range-input.tsx"],"sourcesContent":["import { type FC, type ChangeEvent } from 'react';\n\nimport FlexView from '../../layout/flex-view';\nimport Text from '../../text/text';\nimport { normalizeInputValue } from '../percentile-input/percentile-input-helpers';\nimport TextInput from '../text-input/text-input';\nimport { isValueInRange } from './num-range-helpers';\nimport type { NumRangeInputProps } from './num-range-input-types';\n\n//TODO: Extract shared normalization logic to a base component - BaseNumericInput\n\nconst NumRangeInput: FC<NumRangeInputProps> = ({\n  onChange,\n  value,\n  middleMin,\n  middleMax,\n  endMin,\n  endMax,\n  middlePlaceholder = '',\n  endPlaceholder = '',\n}) => {\n  const handleMiddleChange = (e: ChangeEvent<HTMLInputElement>) => {\n    const normalizedValue = normalizeInputValue(e.target.value);\n\n    // TODO: need to handle validation onSubmit/onBlur instead of onValueChange\n    if (isValueInRange(normalizedValue, middleMin, middleMax)) {\n      onChange({ middle: normalizedValue, end: value.end });\n    }\n  };\n\n  const handleEndChange = (e: ChangeEvent<HTMLInputElement>) => {\n    const normalizedValue = normalizeInputValue(e.target.value);\n\n    if (isValueInRange(normalizedValue, endMin, endMax)) {\n      onChange({ middle: value.middle, end: normalizedValue });\n    }\n  };\n\n  return (\n    <FlexView $flexDirection=\"row\" $alignItems=\"center\" $flexGapX={1}>\n      <TextInput\n        renderAs=\"primary\"\n        widthX={6}\n        type=\"number\"\n        min={middleMin}\n        max={middleMax}\n        value={value.middle ?? ''}\n        onChange={handleMiddleChange}\n        placeholder={middlePlaceholder}\n      />\n      <Text $renderAs=\"ub3\" $color=\"REAL_BLACK\">\n        /\n      </Text>\n      <TextInput\n        renderAs=\"primary\"\n        type=\"number\"\n        widthX={6}\n        min={endMin}\n        max={endMax}\n        value={value.end ?? ''}\n        onChange={handleEndChange}\n        placeholder={endPlaceholder}\n      />\n    </FlexView>\n  );\n};\n\nexport default NumRangeInput;\n"],"names":["NumRangeInput","onChange","value","middleMin","middleMax","endMin","endMax","middlePlaceholder","endPlaceholder","handleMiddleChange","e","normalizedValue","normalizeInputValue","isValueInRange","handleEndChange","FlexView","jsx","TextInput","Text","NumRangeInput$1"],"mappings":";;;;;;AAWA,MAAMA,IAAwC,CAAC;AAAA,EAC7C,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC;AAAA,EACA,QAAAC;AAAA,EACA,mBAAAC,IAAoB;AAAA,EACpB,gBAAAC,IAAiB;AACnB,MAAM;AACE,QAAAC,IAAqB,CAACC,MAAqC;AAC/D,UAAMC,IAAkBC,EAAoBF,EAAE,OAAO,KAAK;AAG1D,IAAIG,EAAeF,GAAiBR,GAAWC,CAAS,KACtDH,EAAS,EAAE,QAAQU,GAAiB,KAAKT,EAAM,KAAK;AAAA,EACtD,GAGIY,IAAkB,CAACJ,MAAqC;AAC5D,UAAMC,IAAkBC,EAAoBF,EAAE,OAAO,KAAK;AAE1D,IAAIG,EAAeF,GAAiBN,GAAQC,CAAM,KAChDL,EAAS,EAAE,QAAQC,EAAM,QAAQ,KAAKS,GAAiB;AAAA,EACzD;AAGF,2BACGI,GAAS,EAAA,gBAAe,OAAM,aAAY,UAAS,WAAW,GAC7D,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,UAAS;AAAA,QACT,QAAQ;AAAA,QACR,MAAK;AAAA,QACL,KAAKd;AAAA,QACL,KAAKC;AAAA,QACL,OAAOF,EAAM,UAAU;AAAA,QACvB,UAAUO;AAAA,QACV,aAAaF;AAAA,MAAA;AAAA,IACf;AAAA,sBACCW,GAAK,EAAA,WAAU,OAAM,QAAO,cAAa,UAE1C,KAAA;AAAA,IACA,gBAAAF;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,UAAS;AAAA,QACT,MAAK;AAAA,QACL,QAAQ;AAAA,QACR,KAAKZ;AAAA,QACL,KAAKC;AAAA,QACL,OAAOJ,EAAM,OAAO;AAAA,QACpB,UAAUY;AAAA,QACV,aAAaN;AAAA,MAAA;AAAA,IACf;AAAA,EACF,EAAA,CAAA;AAEJ,GAEAW,IAAenB;"}
+{"version":3,"file":"num-range-input.js","sources":["../../../../../src/features/ui/inputs/num-range-input/num-range-input.tsx"],"sourcesContent":["import { type FC, type ChangeEvent } from 'react';\n\nimport FlexView from '../../layout/flex-view';\nimport Text from '../../text/text';\nimport { normalizeInputValue } from '../percentile-input/percentile-input-helpers';\nimport TextInput from '../text-input/text-input';\nimport { isValueInRange } from './num-range-helpers';\nimport type { NumRangeInputProps } from './num-range-input-types';\n\n//TODO: Extract shared normalization logic to a base component - BaseNumericInput\n\nconst NumRangeInput: FC<NumRangeInputProps> = ({\n  onChange,\n  value,\n  middleMin,\n  middleMax,\n  endMin,\n  endMax,\n  middlePlaceholder = '',\n  endPlaceholder = '',\n}) => {\n  const handleMiddleChange = (e: ChangeEvent<HTMLInputElement>) => {\n    const normalizedValue = normalizeInputValue(e.target.value);\n\n    // TODO: need to handle validation onSubmit/onBlur instead of onValueChange\n    if (isValueInRange(normalizedValue, middleMin, middleMax)) {\n      onChange({ middle: normalizedValue, end: value.end });\n    }\n  };\n\n  const handleEndChange = (e: ChangeEvent<HTMLInputElement>) => {\n    const normalizedValue = normalizeInputValue(e.target.value);\n\n    if (isValueInRange(normalizedValue, endMin, endMax)) {\n      onChange({ middle: value.middle, end: normalizedValue });\n    }\n  };\n\n  return (\n    <FlexView $flexDirection=\"row\" $alignItems=\"center\" $flexGapX={1}>\n      <TextInput\n        renderAs=\"primary\"\n        widthX={6}\n        type=\"number\"\n        min={middleMin}\n        max={middleMax}\n        value={value.middle ?? ''}\n        onChange={handleMiddleChange}\n        placeholder={middlePlaceholder}\n      />\n      <Text $renderAs=\"ub4\" $color=\"REAL_BLACK\">\n        /\n      </Text>\n      <TextInput\n        renderAs=\"primary\"\n        type=\"number\"\n        widthX={6}\n        min={endMin}\n        max={endMax}\n        value={value.end ?? ''}\n        onChange={handleEndChange}\n        placeholder={endPlaceholder}\n      />\n    </FlexView>\n  );\n};\n\nexport default NumRangeInput;\n"],"names":["NumRangeInput","onChange","value","middleMin","middleMax","endMin","endMax","middlePlaceholder","endPlaceholder","handleMiddleChange","e","normalizedValue","normalizeInputValue","isValueInRange","handleEndChange","FlexView","jsx","TextInput","Text","NumRangeInput$1"],"mappings":";;;;;;AAWA,MAAMA,IAAwC,CAAC;AAAA,EAC7C,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC;AAAA,EACA,QAAAC;AAAA,EACA,mBAAAC,IAAoB;AAAA,EACpB,gBAAAC,IAAiB;AACnB,MAAM;AACE,QAAAC,IAAqB,CAACC,MAAqC;AAC/D,UAAMC,IAAkBC,EAAoBF,EAAE,OAAO,KAAK;AAG1D,IAAIG,EAAeF,GAAiBR,GAAWC,CAAS,KACtDH,EAAS,EAAE,QAAQU,GAAiB,KAAKT,EAAM,KAAK;AAAA,EACtD,GAGIY,IAAkB,CAACJ,MAAqC;AAC5D,UAAMC,IAAkBC,EAAoBF,EAAE,OAAO,KAAK;AAE1D,IAAIG,EAAeF,GAAiBN,GAAQC,CAAM,KAChDL,EAAS,EAAE,QAAQC,EAAM,QAAQ,KAAKS,GAAiB;AAAA,EACzD;AAGF,2BACGI,GAAS,EAAA,gBAAe,OAAM,aAAY,UAAS,WAAW,GAC7D,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,UAAS;AAAA,QACT,QAAQ;AAAA,QACR,MAAK;AAAA,QACL,KAAKd;AAAA,QACL,KAAKC;AAAA,QACL,OAAOF,EAAM,UAAU;AAAA,QACvB,UAAUO;AAAA,QACV,aAAaF;AAAA,MAAA;AAAA,IACf;AAAA,sBACCW,GAAK,EAAA,WAAU,OAAM,QAAO,cAAa,UAE1C,KAAA;AAAA,IACA,gBAAAF;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,UAAS;AAAA,QACT,MAAK;AAAA,QACL,QAAQ;AAAA,QACR,KAAKZ;AAAA,QACL,KAAKC;AAAA,QACL,OAAOJ,EAAM,OAAO;AAAA,QACpB,UAAUY;AAAA,QACV,aAAaN;AAAA,MAAA;AAAA,IACf;AAAA,EACF,EAAA,CAAA;AAEJ,GAEAW,IAAenB;"}

package/dist/features/ui/inputs/radio-input/radio-option/radio-option.js

@@ -17,7 +17,7 @@ const $ = ({
   }, [r, n, e]);
   return /* @__PURE__ */ s(f, { onClick: p, children: [
     /* @__PURE__ */ i(t, { $size: o, $innerCircle: !1, children: r && /* @__PURE__ */ i(c, { children: /* @__PURE__ */ i(t, { $size: o * 0.5, $innerCircle: !0 }) }) }),
-    /* @__PURE__ */ i(m, { $renderAs: r ? "ub1-bold" : "ub1", children: l })
+    /* @__PURE__ */ i(m, { $renderAs: r ? "ub2-bold" : "ub2", children: l })
   ] });
 };
 export {

package/dist/features/ui/inputs/radio-input/radio-option/radio-option.js.map

@@ -1 +1 @@
-{"version":3,"file":"radio-option.js","sources":["../../../../../../src/features/ui/inputs/radio-input/radio-option/radio-option.tsx"],"sourcesContent":["import { useCallback, type ReactElement } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport * as Styled from './radio-option-styled';\nimport type { IRadioOptionProps } from './radio-option-types';\n\nconst RadioOption = <IDType extends string | number>({\n  id,\n  label,\n  checked,\n  onChange,\n}: IRadioOptionProps<IDType>): ReactElement => {\n  const {\n    layout: { gutter },\n  } = useTheme();\n  const handleOnClick = useCallback(() => {\n    if (typeof onChange !== 'function') {\n      throw new Error('onChange must be a function');\n    }\n\n    if (!checked) onChange(id);\n  }, [checked, onChange, id]);\n\n  return (\n    <Styled.RadioOptionWrapper onClick={handleOnClick}>\n      <Styled.InputOptionCircle $size={gutter} $innerCircle={false}>\n        {checked && (\n          <Styled.InputOptionInnerCircleWrraper>\n            <Styled.InputOptionCircle $size={gutter * 0.5} $innerCircle={true} />\n          </Styled.InputOptionInnerCircleWrraper>\n        )}\n      </Styled.InputOptionCircle>\n      <Styled.Label $renderAs={checked ? 'ub1-bold' : 'ub1'}>{label}</Styled.Label>\n    </Styled.RadioOptionWrapper>\n  );\n};\n\nexport default RadioOption;\n"],"names":["RadioOption","id","label","checked","onChange","gutter","useTheme","handleOnClick","useCallback","jsxs","Styled.RadioOptionWrapper","jsx","Styled.InputOptionCircle","Styled.InputOptionInnerCircleWrraper","Styled.Label"],"mappings":";;;;AAMA,MAAMA,IAAc,CAAiC;AAAA,EACnD,IAAAC;AAAA,EACA,OAAAC;AAAA,EACA,SAAAC;AAAA,EACA,UAAAC;AACF,MAA+C;AACvC,QAAA;AAAA,IACJ,QAAQ,EAAE,QAAAC,EAAO;AAAA,MACfC,EAAS,GACPC,IAAgBC,EAAY,MAAM;AAClC,QAAA,OAAOJ,KAAa;AAChB,YAAA,IAAI,MAAM,6BAA6B;AAG3C,IAACD,KAASC,EAASH,CAAE;AAAA,EACxB,GAAA,CAACE,GAASC,GAAUH,CAAE,CAAC;AAE1B,SACG,gBAAAQ,EAAAC,GAAA,EAA0B,SAASH,GAClC,UAAA;AAAA,IAAC,gBAAAI,EAAAC,GAAA,EAAyB,OAAOP,GAAQ,cAAc,IACpD,UACCF,KAAA,gBAAAQ,EAACE,GAAA,EACC,UAAC,gBAAAF,EAAAC,GAAA,EAAyB,OAAOP,IAAS,KAAK,cAAc,GAAM,CAAA,EACrE,CAAA,GAEJ;AAAA,IACA,gBAAAM,EAACG,GAAA,EAAa,WAAWX,IAAU,aAAa,OAAQ,UAAMD,GAAA;AAAA,EAChE,EAAA,CAAA;AAEJ;"}
+{"version":3,"file":"radio-option.js","sources":["../../../../../../src/features/ui/inputs/radio-input/radio-option/radio-option.tsx"],"sourcesContent":["import { useCallback, type ReactElement } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport * as Styled from './radio-option-styled';\nimport type { IRadioOptionProps } from './radio-option-types';\n\nconst RadioOption = <IDType extends string | number>({\n  id,\n  label,\n  checked,\n  onChange,\n}: IRadioOptionProps<IDType>): ReactElement => {\n  const {\n    layout: { gutter },\n  } = useTheme();\n  const handleOnClick = useCallback(() => {\n    if (typeof onChange !== 'function') {\n      throw new Error('onChange must be a function');\n    }\n\n    if (!checked) onChange(id);\n  }, [checked, onChange, id]);\n\n  return (\n    <Styled.RadioOptionWrapper onClick={handleOnClick}>\n      <Styled.InputOptionCircle $size={gutter} $innerCircle={false}>\n        {checked && (\n          <Styled.InputOptionInnerCircleWrraper>\n            <Styled.InputOptionCircle $size={gutter * 0.5} $innerCircle={true} />\n          </Styled.InputOptionInnerCircleWrraper>\n        )}\n      </Styled.InputOptionCircle>\n      <Styled.Label $renderAs={checked ? 'ub2-bold' : 'ub2'}>{label}</Styled.Label>\n    </Styled.RadioOptionWrapper>\n  );\n};\n\nexport default RadioOption;\n"],"names":["RadioOption","id","label","checked","onChange","gutter","useTheme","handleOnClick","useCallback","jsxs","Styled.RadioOptionWrapper","jsx","Styled.InputOptionCircle","Styled.InputOptionInnerCircleWrraper","Styled.Label"],"mappings":";;;;AAMA,MAAMA,IAAc,CAAiC;AAAA,EACnD,IAAAC;AAAA,EACA,OAAAC;AAAA,EACA,SAAAC;AAAA,EACA,UAAAC;AACF,MAA+C;AACvC,QAAA;AAAA,IACJ,QAAQ,EAAE,QAAAC,EAAO;AAAA,MACfC,EAAS,GACPC,IAAgBC,EAAY,MAAM;AAClC,QAAA,OAAOJ,KAAa;AAChB,YAAA,IAAI,MAAM,6BAA6B;AAG3C,IAACD,KAASC,EAASH,CAAE;AAAA,EACxB,GAAA,CAACE,GAASC,GAAUH,CAAE,CAAC;AAE1B,SACG,gBAAAQ,EAAAC,GAAA,EAA0B,SAASH,GAClC,UAAA;AAAA,IAAC,gBAAAI,EAAAC,GAAA,EAAyB,OAAOP,GAAQ,cAAc,IACpD,UACCF,KAAA,gBAAAQ,EAACE,GAAA,EACC,UAAC,gBAAAF,EAAAC,GAAA,EAAyB,OAAOP,IAAS,KAAK,cAAc,GAAM,CAAA,EACrE,CAAA,GAEJ;AAAA,IACA,gBAAAM,EAACG,GAAA,EAAa,WAAWX,IAAU,aAAa,OAAQ,UAAMD,GAAA;AAAA,EAChE,EAAA,CAAA;AAEJ;"}

package/dist/features/ui/radio-cards/radio-card-option/radio-card-option.js

@@ -41,7 +41,7 @@ const F = ({
               /* @__PURE__ */ e(A, { children: d }),
               /* @__PURE__ */ o(g, { $gutter: i ? 16 : 0, $flexGapX: 0.25, children: [
                 /* @__PURE__ */ e(a, { $renderAs: "ab1-bold", children: c }),
-                l && /* @__PURE__ */ e(a, { $renderAs: "ub2", $color: "BLACK_75", children: l })
+                l && /* @__PURE__ */ e(a, { $renderAs: "ub3", $color: "BLACK_75", children: l })
               ] })
             ]
           }

package/dist/features/ui/radio-cards/radio-card-option/radio-card-option.js.map

@@ -1 +1 @@
-{"version":3,"file":"radio-card-option.js","sources":["../../../../../src/features/ui/radio-cards/radio-card-option/radio-card-option.tsx"],"sourcesContent":["import { useCallback } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport useResponseHandler from '../../hooks/use-response-handler';\nimport FlexView from '../../layout/flex-view';\nimport Text from '../../text/text';\nimport * as Styled from './radio-card-option-styled';\nimport type { IRadioCardOptionProps } from './radio-card-option-types';\n\nconst RadioCardOption = <IDTypes extends string | number>({\n  id,\n  title,\n  description,\n  checked,\n  Icon,\n  onChange,\n  width,\n  widthX,\n  analyticsLabel,\n  analyticsProps,\n  horizontalCard,\n}: IRadioCardOptionProps<IDTypes>) => {\n  const theme = useTheme();\n  const { gutter } = theme.layout;\n\n  const handleTracking = useResponseHandler({ analyticsLabel, analyticsProps });\n\n  const handleOnCardClick = useCallback(() => {\n    if (typeof onChange !== 'function') {\n      throw new Error('onChange must be a function');\n    }\n\n    if (!checked) {\n      onChange(id);\n      handleTracking(id);\n    }\n  }, [checked, handleTracking, id, onChange]);\n\n  return (\n    <Styled.DummyBorder $selected={checked}>\n      <Styled.RadioCardOptionWrapper\n        $width={width}\n        $widthX={widthX}\n        $selected={checked}\n        onClick={handleOnCardClick}\n      >\n        <Styled.RadioImageContainer\n          $flexDirection={horizontalCard ? 'row' : 'column'}\n          $alignItems=\"flex-start\"\n          $flexGap={horizontalCard ? 0 : 16}\n        >\n          <Styled.ImageWrapper>{Icon}</Styled.ImageWrapper>\n\n          <FlexView $gutter={horizontalCard ? 16 : 0} $flexGapX={0.25}>\n            <Text $renderAs=\"ab1-bold\">{title}</Text>\n            {description && (\n              <Text $renderAs=\"ub2\" $color=\"BLACK_75\">\n                {description}\n              </Text>\n            )}\n          </FlexView>\n        </Styled.RadioImageContainer>\n        <Styled.InputOptionCircle $size={gutter} $innerCircle={false}>\n          {checked && (\n            <Styled.InputOptionInnerCircle>\n              <Styled.InputOptionCircle $size={gutter * 0.5} $innerCircle={true} />\n            </Styled.InputOptionInnerCircle>\n          )}\n        </Styled.InputOptionCircle>\n      </Styled.RadioCardOptionWrapper>\n    </Styled.DummyBorder>\n  );\n};\n\nexport default RadioCardOption;\n"],"names":["RadioCardOption","id","title","description","checked","Icon","onChange","width","widthX","analyticsLabel","analyticsProps","horizontalCard","theme","useTheme","gutter","handleTracking","useResponseHandler","handleOnCardClick","useCallback","jsx","Styled.DummyBorder","jsxs","Styled.RadioCardOptionWrapper","Styled.RadioImageContainer","Styled.ImageWrapper","FlexView","Text","Styled.InputOptionCircle","Styled.InputOptionInnerCircle"],"mappings":";;;;;;;AASA,MAAMA,IAAkB,CAAkC;AAAA,EACxD,IAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,SAAAC;AAAA,EACA,MAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,gBAAAC;AACF,MAAsC;AACpC,QAAMC,IAAQC,KACR,EAAE,QAAAC,EAAO,IAAIF,EAAM,QAEnBG,IAAiBC,EAAmB,EAAE,gBAAAP,GAAgB,gBAAAC,EAAgB,CAAA,GAEtEO,IAAoBC,EAAY,MAAM;AACtC,QAAA,OAAOZ,KAAa;AAChB,YAAA,IAAI,MAAM,6BAA6B;AAG/C,IAAKF,MACHE,EAASL,CAAE,GACXc,EAAed,CAAE;AAAA,KAElB,CAACG,GAASW,GAAgBd,GAAIK,CAAQ,CAAC;AAE1C,SACG,gBAAAa,EAAAC,GAAA,EAAmB,WAAWhB,GAC7B,UAAA,gBAAAiB;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,QAAQf;AAAA,MACR,SAASC;AAAA,MACT,WAAWJ;AAAA,MACX,SAASa;AAAA,MAET,UAAA;AAAA,QAAA,gBAAAI;AAAA,UAACE;AAAAA,UAAA;AAAA,YACC,gBAAgBZ,IAAiB,QAAQ;AAAA,YACzC,aAAY;AAAA,YACZ,UAAUA,IAAiB,IAAI;AAAA,YAE/B,UAAA;AAAA,cAAC,gBAAAQ,EAAAK,GAAA,EAAqB,UAAKnB,EAAA,CAAA;AAAA,gCAE1BoB,GAAS,EAAA,SAASd,IAAiB,KAAK,GAAG,WAAW,MACrD,UAAA;AAAA,gBAAC,gBAAAQ,EAAAO,GAAA,EAAK,WAAU,YAAY,UAAMxB,GAAA;AAAA,gBACjCC,KACE,gBAAAgB,EAAAO,GAAA,EAAK,WAAU,OAAM,QAAO,YAC1B,UACHvB,GAAA;AAAA,cAAA,GAEJ;AAAA,YAAA;AAAA,UAAA;AAAA,QACF;AAAA,QACA,gBAAAgB,EAACQ,GAAA,EAAyB,OAAOb,GAAQ,cAAc,IACpD,UAAAV,KACE,gBAAAe,EAAAS,GAAA,EACC,UAAA,gBAAAT,EAACQ,GAAA,EAAyB,OAAOb,IAAS,KAAK,cAAc,GAAM,CAAA,EACrE,CAAA,GAEJ;AAAA,MAAA;AAAA,IAAA;AAAA,EAEJ,EAAA,CAAA;AAEJ;"}
+{"version":3,"file":"radio-card-option.js","sources":["../../../../../src/features/ui/radio-cards/radio-card-option/radio-card-option.tsx"],"sourcesContent":["import { useCallback } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport useResponseHandler from '../../hooks/use-response-handler';\nimport FlexView from '../../layout/flex-view';\nimport Text from '../../text/text';\nimport * as Styled from './radio-card-option-styled';\nimport type { IRadioCardOptionProps } from './radio-card-option-types';\n\nconst RadioCardOption = <IDTypes extends string | number>({\n  id,\n  title,\n  description,\n  checked,\n  Icon,\n  onChange,\n  width,\n  widthX,\n  analyticsLabel,\n  analyticsProps,\n  horizontalCard,\n}: IRadioCardOptionProps<IDTypes>) => {\n  const theme = useTheme();\n  const { gutter } = theme.layout;\n\n  const handleTracking = useResponseHandler({ analyticsLabel, analyticsProps });\n\n  const handleOnCardClick = useCallback(() => {\n    if (typeof onChange !== 'function') {\n      throw new Error('onChange must be a function');\n    }\n\n    if (!checked) {\n      onChange(id);\n      handleTracking(id);\n    }\n  }, [checked, handleTracking, id, onChange]);\n\n  return (\n    <Styled.DummyBorder $selected={checked}>\n      <Styled.RadioCardOptionWrapper\n        $width={width}\n        $widthX={widthX}\n        $selected={checked}\n        onClick={handleOnCardClick}\n      >\n        <Styled.RadioImageContainer\n          $flexDirection={horizontalCard ? 'row' : 'column'}\n          $alignItems=\"flex-start\"\n          $flexGap={horizontalCard ? 0 : 16}\n        >\n          <Styled.ImageWrapper>{Icon}</Styled.ImageWrapper>\n\n          <FlexView $gutter={horizontalCard ? 16 : 0} $flexGapX={0.25}>\n            <Text $renderAs=\"ab1-bold\">{title}</Text>\n            {description && (\n              <Text $renderAs=\"ub3\" $color=\"BLACK_75\">\n                {description}\n              </Text>\n            )}\n          </FlexView>\n        </Styled.RadioImageContainer>\n        <Styled.InputOptionCircle $size={gutter} $innerCircle={false}>\n          {checked && (\n            <Styled.InputOptionInnerCircle>\n              <Styled.InputOptionCircle $size={gutter * 0.5} $innerCircle={true} />\n            </Styled.InputOptionInnerCircle>\n          )}\n        </Styled.InputOptionCircle>\n      </Styled.RadioCardOptionWrapper>\n    </Styled.DummyBorder>\n  );\n};\n\nexport default RadioCardOption;\n"],"names":["RadioCardOption","id","title","description","checked","Icon","onChange","width","widthX","analyticsLabel","analyticsProps","horizontalCard","theme","useTheme","gutter","handleTracking","useResponseHandler","handleOnCardClick","useCallback","jsx","Styled.DummyBorder","jsxs","Styled.RadioCardOptionWrapper","Styled.RadioImageContainer","Styled.ImageWrapper","FlexView","Text","Styled.InputOptionCircle","Styled.InputOptionInnerCircle"],"mappings":";;;;;;;AASA,MAAMA,IAAkB,CAAkC;AAAA,EACxD,IAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,SAAAC;AAAA,EACA,MAAAC;AAAA,EACA,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,gBAAAC;AACF,MAAsC;AACpC,QAAMC,IAAQC,KACR,EAAE,QAAAC,EAAO,IAAIF,EAAM,QAEnBG,IAAiBC,EAAmB,EAAE,gBAAAP,GAAgB,gBAAAC,EAAgB,CAAA,GAEtEO,IAAoBC,EAAY,MAAM;AACtC,QAAA,OAAOZ,KAAa;AAChB,YAAA,IAAI,MAAM,6BAA6B;AAG/C,IAAKF,MACHE,EAASL,CAAE,GACXc,EAAed,CAAE;AAAA,KAElB,CAACG,GAASW,GAAgBd,GAAIK,CAAQ,CAAC;AAE1C,SACG,gBAAAa,EAAAC,GAAA,EAAmB,WAAWhB,GAC7B,UAAA,gBAAAiB;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,QAAQf;AAAA,MACR,SAASC;AAAA,MACT,WAAWJ;AAAA,MACX,SAASa;AAAA,MAET,UAAA;AAAA,QAAA,gBAAAI;AAAA,UAACE;AAAAA,UAAA;AAAA,YACC,gBAAgBZ,IAAiB,QAAQ;AAAA,YACzC,aAAY;AAAA,YACZ,UAAUA,IAAiB,IAAI;AAAA,YAE/B,UAAA;AAAA,cAAC,gBAAAQ,EAAAK,GAAA,EAAqB,UAAKnB,EAAA,CAAA;AAAA,gCAE1BoB,GAAS,EAAA,SAASd,IAAiB,KAAK,GAAG,WAAW,MACrD,UAAA;AAAA,gBAAC,gBAAAQ,EAAAO,GAAA,EAAK,WAAU,YAAY,UAAMxB,GAAA;AAAA,gBACjCC,KACE,gBAAAgB,EAAAO,GAAA,EAAK,WAAU,OAAM,QAAO,YAC1B,UACHvB,GAAA;AAAA,cAAA,GAEJ;AAAA,YAAA;AAAA,UAAA;AAAA,QACF;AAAA,QACA,gBAAAgB,EAACQ,GAAA,EAAyB,OAAOb,GAAQ,cAAc,IACpD,UAAAV,KACE,gBAAAe,EAAAS,GAAA,EACC,UAAA,gBAAAT,EAACQ,GAAA,EAAyB,OAAOb,IAAS,KAAK,cAAc,GAAM,CAAA,EACrE,CAAA,GAEJ;AAAA,MAAA;AAAA,IAAA;AAAA,EAEJ,EAAA,CAAA;AAEJ;"}

package/dist/features/ui/stepper/stepper.js

@@ -25,10 +25,10 @@ function j({ stepsInfo: n = [], currentStep: e = 2 }) {
               $justifyContent: "center",
               $heightX: 1.25,
               $widthX: 1.25,
-              children: r + 1 < e ? /* @__PURE__ */ t(l, { height: i, width: i }) : /* @__PURE__ */ t(m, { $renderAs: "ub3", $color: "WHITE", children: $ })
+              children: r + 1 < e ? /* @__PURE__ */ t(l, { height: i, width: i }) : /* @__PURE__ */ t(m, { $renderAs: "ub4", $color: "WHITE", children: $ })
             }
           ),
-          r + 1 === e && /* @__PURE__ */ t(s, { $renderAs: "ub2", children: h })
+          r + 1 === e && /* @__PURE__ */ t(s, { $renderAs: "ub3", children: h })
         ]
       },
       r

package/dist/features/ui/stepper/stepper.js.map

@@ -1 +1 @@
-{"version":3,"file":"stepper.js","sources":["../../../../src/features/ui/stepper/stepper.tsx"],"sourcesContent":["import CheckIcon from '../../../assets/line-icons/icons/check';\nimport Text from '../text/text';\nimport { getTheme } from '../theme/get-theme';\nimport { MainWrapper, NumberWrapper, Wrapper, StyledText, HorizontalLine } from './stepper-styled';\nimport type { IStepperProps } from './stepper-types';\n\nconst { layout } = getTheme();\nconst { gutter } = layout;\n\nfunction Stepper({ stepsInfo = [], currentStep = 2 }: IStepperProps) {\n  const percentageCompleted =\n    stepsInfo.length && currentStep >= 1 ? ((currentStep - 1) / stepsInfo.length) * 100 : 0;\n\n  return (\n    <MainWrapper $flexDirection=\"row\" $width=\"fit-content\" $gutterX={0.625} $gapX={0.625}>\n      <HorizontalLine $percentageCompleted={percentageCompleted} $height={1} />\n      {stepsInfo.map(({ id, label }, idx) => (\n        <Wrapper\n          key={idx}\n          $flexDirection=\"row\"\n          $alignItems=\"center\"\n          $justifyContent=\"center\"\n          $background=\"WHITE\"\n        >\n          <NumberWrapper\n            $stepNumber={idx + 1}\n            $currentStep={currentStep}\n            $alignItems=\"center\"\n            $justifyContent=\"center\"\n            $heightX={1.25}\n            $widthX={1.25}\n          >\n            {idx + 1 < currentStep ? (\n              <CheckIcon height={gutter} width={gutter} />\n            ) : (\n              <Text $renderAs=\"ub3\" $color=\"WHITE\">\n                {id}\n              </Text>\n            )}\n          </NumberWrapper>\n          {idx + 1 === currentStep && <StyledText $renderAs=\"ub2\">{label}</StyledText>}\n        </Wrapper>\n      ))}\n    </MainWrapper>\n  );\n}\n\nexport default Stepper;\n"],"names":["layout","getTheme","gutter","Stepper","stepsInfo","currentStep","percentageCompleted","jsxs","MainWrapper","jsx","HorizontalLine","id","label","idx","Wrapper","NumberWrapper","CheckIcon","Text","StyledText"],"mappings":";;;;;AAMA,MAAM,EAAE,QAAAA,EAAO,IAAIC,KACb,EAAE,QAAAC,EAAW,IAAAF;AAEnB,SAASG,EAAQ,EAAE,WAAAC,IAAY,CAAI,GAAA,aAAAC,IAAc,KAAoB;AAC7D,QAAAC,IACJF,EAAU,UAAUC,KAAe,KAAMA,IAAc,KAAKD,EAAU,SAAU,MAAM;AAGtF,SAAA,gBAAAG,EAACC,KAAY,gBAAe,OAAM,QAAO,eAAc,UAAU,OAAO,OAAO,OAC7E,UAAA;AAAA,IAAA,gBAAAC,EAACC,GAAe,EAAA,sBAAsBJ,GAAqB,SAAS,GAAG;AAAA,IACtEF,EAAU,IAAI,CAAC,EAAE,IAAAO,GAAI,OAAAC,EAAA,GAASC,MAC7B,gBAAAN;AAAA,MAACO;AAAA,MAAA;AAAA,QAEC,gBAAe;AAAA,QACf,aAAY;AAAA,QACZ,iBAAgB;AAAA,QAChB,aAAY;AAAA,QAEZ,UAAA;AAAA,UAAA,gBAAAL;AAAA,YAACM;AAAA,YAAA;AAAA,cACC,aAAaF,IAAM;AAAA,cACnB,cAAcR;AAAA,cACd,aAAY;AAAA,cACZ,iBAAgB;AAAA,cAChB,UAAU;AAAA,cACV,SAAS;AAAA,cAER,cAAM,IAAIA,IACR,gBAAAI,EAAAO,GAAA,EAAU,QAAQd,GAAQ,OAAOA,EAAQ,CAAA,sBAEzCe,GAAK,EAAA,WAAU,OAAM,QAAO,SAC1B,UACHN,GAAA;AAAA,YAAA;AAAA,UAEJ;AAAA,UACCE,IAAM,MAAMR,uBAAgBa,GAAW,EAAA,WAAU,OAAO,UAAMN,GAAA;AAAA,QAAA;AAAA,MAAA;AAAA,MAtB1DC;AAAA,IAAA,CAwBR;AAAA,EACH,EAAA,CAAA;AAEJ;"}
+{"version":3,"file":"stepper.js","sources":["../../../../src/features/ui/stepper/stepper.tsx"],"sourcesContent":["import CheckIcon from '../../../assets/line-icons/icons/check';\nimport Text from '../text/text';\nimport { getTheme } from '../theme/get-theme';\nimport { MainWrapper, NumberWrapper, Wrapper, StyledText, HorizontalLine } from './stepper-styled';\nimport type { IStepperProps } from './stepper-types';\n\nconst { layout } = getTheme();\nconst { gutter } = layout;\n\nfunction Stepper({ stepsInfo = [], currentStep = 2 }: IStepperProps) {\n  const percentageCompleted =\n    stepsInfo.length && currentStep >= 1 ? ((currentStep - 1) / stepsInfo.length) * 100 : 0;\n\n  return (\n    <MainWrapper $flexDirection=\"row\" $width=\"fit-content\" $gutterX={0.625} $gapX={0.625}>\n      <HorizontalLine $percentageCompleted={percentageCompleted} $height={1} />\n      {stepsInfo.map(({ id, label }, idx) => (\n        <Wrapper\n          key={idx}\n          $flexDirection=\"row\"\n          $alignItems=\"center\"\n          $justifyContent=\"center\"\n          $background=\"WHITE\"\n        >\n          <NumberWrapper\n            $stepNumber={idx + 1}\n            $currentStep={currentStep}\n            $alignItems=\"center\"\n            $justifyContent=\"center\"\n            $heightX={1.25}\n            $widthX={1.25}\n          >\n            {idx + 1 < currentStep ? (\n              <CheckIcon height={gutter} width={gutter} />\n            ) : (\n              <Text $renderAs=\"ub4\" $color=\"WHITE\">\n                {id}\n              </Text>\n            )}\n          </NumberWrapper>\n          {idx + 1 === currentStep && <StyledText $renderAs=\"ub3\">{label}</StyledText>}\n        </Wrapper>\n      ))}\n    </MainWrapper>\n  );\n}\n\nexport default Stepper;\n"],"names":["layout","getTheme","gutter","Stepper","stepsInfo","currentStep","percentageCompleted","jsxs","MainWrapper","jsx","HorizontalLine","id","label","idx","Wrapper","NumberWrapper","CheckIcon","Text","StyledText"],"mappings":";;;;;AAMA,MAAM,EAAE,QAAAA,EAAO,IAAIC,KACb,EAAE,QAAAC,EAAW,IAAAF;AAEnB,SAASG,EAAQ,EAAE,WAAAC,IAAY,CAAI,GAAA,aAAAC,IAAc,KAAoB;AAC7D,QAAAC,IACJF,EAAU,UAAUC,KAAe,KAAMA,IAAc,KAAKD,EAAU,SAAU,MAAM;AAGtF,SAAA,gBAAAG,EAACC,KAAY,gBAAe,OAAM,QAAO,eAAc,UAAU,OAAO,OAAO,OAC7E,UAAA;AAAA,IAAA,gBAAAC,EAACC,GAAe,EAAA,sBAAsBJ,GAAqB,SAAS,GAAG;AAAA,IACtEF,EAAU,IAAI,CAAC,EAAE,IAAAO,GAAI,OAAAC,EAAA,GAASC,MAC7B,gBAAAN;AAAA,MAACO;AAAA,MAAA;AAAA,QAEC,gBAAe;AAAA,QACf,aAAY;AAAA,QACZ,iBAAgB;AAAA,QAChB,aAAY;AAAA,QAEZ,UAAA;AAAA,UAAA,gBAAAL;AAAA,YAACM;AAAA,YAAA;AAAA,cACC,aAAaF,IAAM;AAAA,cACnB,cAAcR;AAAA,cACd,aAAY;AAAA,cACZ,iBAAgB;AAAA,cAChB,UAAU;AAAA,cACV,SAAS;AAAA,cAER,cAAM,IAAIA,IACR,gBAAAI,EAAAO,GAAA,EAAU,QAAQd,GAAQ,OAAOA,EAAQ,CAAA,sBAEzCe,GAAK,EAAA,WAAU,OAAM,QAAO,SAC1B,UACHN,GAAA;AAAA,YAAA;AAAA,UAEJ;AAAA,UACCE,IAAM,MAAMR,uBAAgBa,GAAW,EAAA,WAAU,OAAO,UAAMN,GAAA;AAAA,QAAA;AAAA,MAAA;AAAA,MAtB1DC;AAAA,IAAA,CAwBR;AAAA,EACH,EAAA,CAAA;AAEJ;"}

package/dist/features/ui/tag/tag.js

@@ -1,7 +1,7 @@
 import { jsx as r } from "react/jsx-runtime";
 import n from "../text/text.js";
 import { Wrapper as a } from "./tag-styled.js";
-const c = ({ text: o, backgroundColor: e, textColor: t }) => /* @__PURE__ */ r(a, { $backgroundColor: e, children: /* @__PURE__ */ r(n, { $renderAs: "ub3", $color: t, children: o }) }), i = c;
+const c = ({ text: o, backgroundColor: e, textColor: t }) => /* @__PURE__ */ r(a, { $backgroundColor: e, children: /* @__PURE__ */ r(n, { $renderAs: "ub4", $color: t, children: o }) }), i = c;
 export {
   i as default
 };

package/dist/features/ui/tag/tag.js.map

@@ -1 +1 @@
-{"version":3,"file":"tag.js","sources":["../../../../src/features/ui/tag/tag.tsx"],"sourcesContent":["import { type FC } from 'react';\n\nimport Text from '../text/text';\nimport * as Styled from './tag-styled';\nimport type { ITagProps } from './tag-types';\n\nconst Tag: FC<ITagProps> = ({ text, backgroundColor, textColor }) => {\n  return (\n    <Styled.Wrapper $backgroundColor={backgroundColor}>\n      <Text $renderAs=\"ub3\" $color={textColor}>\n        {text}\n      </Text>\n    </Styled.Wrapper>\n  );\n};\n\nexport default Tag;\n"],"names":["Tag","text","backgroundColor","textColor","jsx","Styled.Wrapper","Text","Tag$1"],"mappings":";;;AAMA,MAAMA,IAAqB,CAAC,EAAE,MAAAC,GAAM,iBAAAC,GAAiB,WAAAC,QAEhD,gBAAAC,EAAAC,GAAA,EAAe,kBAAkBH,GAChC,UAAC,gBAAAE,EAAAE,GAAA,EAAK,WAAU,OAAM,QAAQH,GAC3B,aACH,EACF,CAAA,GAIJI,IAAeP;"}
+{"version":3,"file":"tag.js","sources":["../../../../src/features/ui/tag/tag.tsx"],"sourcesContent":["import { type FC } from 'react';\n\nimport Text from '../text/text';\nimport * as Styled from './tag-styled';\nimport type { ITagProps } from './tag-types';\n\nconst Tag: FC<ITagProps> = ({ text, backgroundColor, textColor }) => {\n  return (\n    <Styled.Wrapper $backgroundColor={backgroundColor}>\n      <Text $renderAs=\"ub4\" $color={textColor}>\n        {text}\n      </Text>\n    </Styled.Wrapper>\n  );\n};\n\nexport default Tag;\n"],"names":["Tag","text","backgroundColor","textColor","jsx","Styled.Wrapper","Text","Tag$1"],"mappings":";;;AAMA,MAAMA,IAAqB,CAAC,EAAE,MAAAC,GAAM,iBAAAC,GAAiB,WAAAC,QAEhD,gBAAAC,EAAAC,GAAA,EAAe,kBAAkBH,GAChC,UAAC,gBAAAE,EAAAE,GAAA,EAAK,WAAU,OAAM,QAAQH,GAC3B,aACH,EACF,CAAA,GAIJI,IAAeP;"}

package/dist/features/ui/text/text.js.map

@@ -1 +1 @@
-{"version":3,"file":"text.js","sources":["../../../../src/features/ui/text/text.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport styled from 'styled-components';\n\nimport { EDeviceType } from '../theme/constants';\nimport type { TColorNames, TTextVariants } from '../types';\n\nexport interface TextProps {\n  $renderAs: TTextVariants;\n  $color?: TColorNames;\n  $align?: 'auto' | 'left' | 'right' | 'center' | 'justify';\n  $alignSelf?: 'auto' | 'flex-start' | 'flex-end' | 'center' | 'baseline' | 'stretch';\n  $opacity?: number | undefined;\n  $width?: number | string;\n  $widthX?: number;\n  $marginBottom?: number;\n  $marginBottomX?: number;\n  $inline?: boolean;\n  $textDecoration?: string;\n  $whiteSpace?: 'pre-line' | 'normal' | 'pre-wrap' | 'no-wrap' | 'pre' | 'break-spaces';\n  $renderOnMobileAs?: TTextVariants;\n  $renderOnTabletAs?: TTextVariants;\n  $cursor?: 'pointer' | 'default' | 'text' | 'not-allowed' | 'move' | 'help';\n}\n\n/**\n * @param $renderAs (fallback for any device), @param $renderOnMobileAs, @param $renderOnTabletAs - The text variant to render as (ah1-ah4, ab1-ab3, ac1-ac4, ub1-ub3), anything else is deprecated\n */\nconst Text = styled.div<TextProps>(\n  ({\n    theme,\n    $renderAs,\n    $color,\n    $align = 'left',\n    $width,\n    $widthX,\n    $marginBottom,\n    $marginBottomX,\n    $alignSelf,\n    $opacity = 1,\n    $inline,\n    $textDecoration,\n    $whiteSpace,\n    $renderOnMobileAs,\n    $renderOnTabletAs,\n    $cursor,\n  }) => {\n    const { text, colors, layout, device } = theme;\n    const renderAs = useMemo(() => {\n      if (device <= EDeviceType.MOBILE) {\n        return $renderOnMobileAs || $renderOnTabletAs || $renderAs;\n      }\n\n      if (device <= EDeviceType.TABLET) {\n        return $renderOnTabletAs || $renderAs;\n      }\n\n      return $renderAs;\n    }, [device, $renderAs, $renderOnMobileAs, $renderOnTabletAs]);\n\n    const {\n      fontFamily,\n      fontSize,\n      lineHeight,\n      letterSpacing,\n      textTransform = 'none',\n    } = text[renderAs];\n\n    return `\n      display: ${$inline ? 'inline-block' : 'block'};\n      font-family: ${fontFamily};\n      font-size: ${fontSize}px;\n      text-align: ${$align};\n      line-height: ${lineHeight}px;\n      text-transform: ${textTransform};\n      ${typeof letterSpacing === 'number' ? `letter-spacing: ${letterSpacing}px;` : ''}\n      color: ${$color ? colors[$color] : colors.BLACK};\n      opacity: ${$opacity};\n      width: ${$width ? `${$width}` : 'auto'}${typeof $width === 'number' ? 'px' : ''};\n      ${$widthX ? `width: ${$widthX * layout.gutter}px;` : ''}\n      margin-bottom: ${$marginBottom ? `${$marginBottom}` : 'initial'}${\n        typeof $marginBottom === 'number' ? 'px' : ''\n      };\n      ${$marginBottomX ? `margin-bottom: ${$marginBottomX * layout.gutter}px;` : ''}\n      ${$alignSelf ? `align-self: ${$alignSelf};` : ''}\n      ${$textDecoration ? `text-decoration: ${$textDecoration};` : ''}\n      ${$whiteSpace ? `white-space: ${$whiteSpace};` : ''}\n      ${$cursor ? `cursor: ${$cursor};` : ''}\n    `;\n  },\n);\n\nText.displayName = 'Text';\n\nexport default Text;\n"],"names":["Text","styled","theme","$renderAs","$color","$align","$width","$widthX","$marginBottom","$marginBottomX","$alignSelf","$opacity","$inline","$textDecoration","$whiteSpace","$renderOnMobileAs","$renderOnTabletAs","$cursor","text","colors","layout","device","renderAs","useMemo","EDeviceType","fontFamily","fontSize","lineHeight","letterSpacing","textTransform","Text$1"],"mappings":";;;AA2BA,MAAMA,IAAOC,EAAO;AAAA,EAClB,CAAC;AAAA,IACC,OAAAC;AAAA,IACA,WAAAC;AAAA,IACA,QAAAC;AAAA,IACA,QAAAC,IAAS;AAAA,IACT,QAAAC;AAAA,IACA,SAAAC;AAAA,IACA,eAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,YAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,SAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,aAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,SAAAC;AAAA,EAAA,MACI;AACJ,UAAM,EAAE,MAAAC,GAAM,QAAAC,GAAQ,QAAAC,GAAQ,QAAAC,MAAWnB,GACnCoB,IAAWC,EAAQ,MACnBF,KAAUG,EAAY,SACjBT,KAAqBC,KAAqBb,IAG/CkB,KAAUG,EAAY,UACjBR,KAAqBb,GAI7B,CAACkB,GAAQlB,GAAWY,GAAmBC,CAAiB,CAAC,GAEtD;AAAA,MACJ,YAAAS;AAAA,MACA,UAAAC;AAAA,MACA,YAAAC;AAAA,MACA,eAAAC;AAAA,MACA,eAAAC,IAAgB;AAAA,IAAA,IACdX,EAAKI,CAAQ;AAEV,WAAA;AAAA,iBACMV,IAAU,iBAAiB,OAAO;AAAA,qBAC9Ba,CAAU;AAAA,mBACZC,CAAQ;AAAA,oBACPrB,CAAM;AAAA,qBACLsB,CAAU;AAAA,wBACPE,CAAa;AAAA,QAC7B,OAAOD,KAAkB,WAAW,mBAAmBA,CAAa,QAAQ,EAAE;AAAA,eACvExB,IAASe,EAAOf,CAAM,IAAIe,EAAO,KAAK;AAAA,iBACpCR,CAAQ;AAAA,eACVL,IAAS,GAAGA,CAAM,KAAK,MAAM,GAAG,OAAOA,KAAW,WAAW,OAAO,EAAE;AAAA,QAC7EC,IAAU,UAAUA,IAAUa,EAAO,MAAM,QAAQ,EAAE;AAAA,uBACtCZ,IAAgB,GAAGA,CAAa,KAAK,SAAS,GAC7D,OAAOA,KAAkB,WAAW,OAAO,EAC7C;AAAA,QACEC,IAAiB,kBAAkBA,IAAiBW,EAAO,MAAM,QAAQ,EAAE;AAAA,QAC3EV,IAAa,eAAeA,CAAU,MAAM,EAAE;AAAA,QAC9CG,IAAkB,oBAAoBA,CAAe,MAAM,EAAE;AAAA,QAC7DC,IAAc,gBAAgBA,CAAW,MAAM,EAAE;AAAA,QACjDG,IAAU,WAAWA,CAAO,MAAM,EAAE;AAAA;AAAA,EAE1C;AACF;AAEAjB,EAAK,cAAc;AAEnB,MAAA8B,IAAe9B;"}
+{"version":3,"file":"text.js","sources":["../../../../src/features/ui/text/text.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport styled from 'styled-components';\n\nimport { EDeviceType } from '../theme/constants';\nimport type { TColorNames, TTextVariants } from '../types';\n\nexport interface TextProps {\n  $renderAs: TTextVariants;\n  $color?: TColorNames;\n  $align?: 'auto' | 'left' | 'right' | 'center' | 'justify';\n  $alignSelf?: 'auto' | 'flex-start' | 'flex-end' | 'center' | 'baseline' | 'stretch';\n  $opacity?: number | undefined;\n  $width?: number | string;\n  $widthX?: number;\n  $marginBottom?: number;\n  $marginBottomX?: number;\n  $inline?: boolean;\n  $textDecoration?: string;\n  $whiteSpace?: 'pre-line' | 'normal' | 'pre-wrap' | 'no-wrap' | 'pre' | 'break-spaces';\n  $renderOnMobileAs?: TTextVariants;\n  $renderOnTabletAs?: TTextVariants;\n  $cursor?: 'pointer' | 'default' | 'text' | 'not-allowed' | 'move' | 'help';\n}\n\n/**\n * @param $renderAs (fallback for any device), @param $renderOnMobileAs, @param $renderOnTabletAs - The text variant to render as (ah1-ah4, ab1-ab3, ac1-ac4, ub1-ub4), anything else is deprecated\n */\nconst Text = styled.div<TextProps>(\n  ({\n    theme,\n    $renderAs,\n    $color,\n    $align = 'left',\n    $width,\n    $widthX,\n    $marginBottom,\n    $marginBottomX,\n    $alignSelf,\n    $opacity = 1,\n    $inline,\n    $textDecoration,\n    $whiteSpace,\n    $renderOnMobileAs,\n    $renderOnTabletAs,\n    $cursor,\n  }) => {\n    const { text, colors, layout, device } = theme;\n    const renderAs = useMemo(() => {\n      if (device <= EDeviceType.MOBILE) {\n        return $renderOnMobileAs || $renderOnTabletAs || $renderAs;\n      }\n\n      if (device <= EDeviceType.TABLET) {\n        return $renderOnTabletAs || $renderAs;\n      }\n\n      return $renderAs;\n    }, [device, $renderAs, $renderOnMobileAs, $renderOnTabletAs]);\n\n    const {\n      fontFamily,\n      fontSize,\n      lineHeight,\n      letterSpacing,\n      textTransform = 'none',\n    } = text[renderAs];\n\n    return `\n      display: ${$inline ? 'inline-block' : 'block'};\n      font-family: ${fontFamily};\n      font-size: ${fontSize}px;\n      text-align: ${$align};\n      line-height: ${lineHeight}px;\n      text-transform: ${textTransform};\n      ${typeof letterSpacing === 'number' ? `letter-spacing: ${letterSpacing}px;` : ''}\n      color: ${$color ? colors[$color] : colors.BLACK};\n      opacity: ${$opacity};\n      width: ${$width ? `${$width}` : 'auto'}${typeof $width === 'number' ? 'px' : ''};\n      ${$widthX ? `width: ${$widthX * layout.gutter}px;` : ''}\n      margin-bottom: ${$marginBottom ? `${$marginBottom}` : 'initial'}${\n        typeof $marginBottom === 'number' ? 'px' : ''\n      };\n      ${$marginBottomX ? `margin-bottom: ${$marginBottomX * layout.gutter}px;` : ''}\n      ${$alignSelf ? `align-self: ${$alignSelf};` : ''}\n      ${$textDecoration ? `text-decoration: ${$textDecoration};` : ''}\n      ${$whiteSpace ? `white-space: ${$whiteSpace};` : ''}\n      ${$cursor ? `cursor: ${$cursor};` : ''}\n    `;\n  },\n);\n\nText.displayName = 'Text';\n\nexport default Text;\n"],"names":["Text","styled","theme","$renderAs","$color","$align","$width","$widthX","$marginBottom","$marginBottomX","$alignSelf","$opacity","$inline","$textDecoration","$whiteSpace","$renderOnMobileAs","$renderOnTabletAs","$cursor","text","colors","layout","device","renderAs","useMemo","EDeviceType","fontFamily","fontSize","lineHeight","letterSpacing","textTransform","Text$1"],"mappings":";;;AA2BA,MAAMA,IAAOC,EAAO;AAAA,EAClB,CAAC;AAAA,IACC,OAAAC;AAAA,IACA,WAAAC;AAAA,IACA,QAAAC;AAAA,IACA,QAAAC,IAAS;AAAA,IACT,QAAAC;AAAA,IACA,SAAAC;AAAA,IACA,eAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,YAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,SAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,aAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,SAAAC;AAAA,EAAA,MACI;AACJ,UAAM,EAAE,MAAAC,GAAM,QAAAC,GAAQ,QAAAC,GAAQ,QAAAC,MAAWnB,GACnCoB,IAAWC,EAAQ,MACnBF,KAAUG,EAAY,SACjBT,KAAqBC,KAAqBb,IAG/CkB,KAAUG,EAAY,UACjBR,KAAqBb,GAI7B,CAACkB,GAAQlB,GAAWY,GAAmBC,CAAiB,CAAC,GAEtD;AAAA,MACJ,YAAAS;AAAA,MACA,UAAAC;AAAA,MACA,YAAAC;AAAA,MACA,eAAAC;AAAA,MACA,eAAAC,IAAgB;AAAA,IAAA,IACdX,EAAKI,CAAQ;AAEV,WAAA;AAAA,iBACMV,IAAU,iBAAiB,OAAO;AAAA,qBAC9Ba,CAAU;AAAA,mBACZC,CAAQ;AAAA,oBACPrB,CAAM;AAAA,qBACLsB,CAAU;AAAA,wBACPE,CAAa;AAAA,QAC7B,OAAOD,KAAkB,WAAW,mBAAmBA,CAAa,QAAQ,EAAE;AAAA,eACvExB,IAASe,EAAOf,CAAM,IAAIe,EAAO,KAAK;AAAA,iBACpCR,CAAQ;AAAA,eACVL,IAAS,GAAGA,CAAM,KAAK,MAAM,GAAG,OAAOA,KAAW,WAAW,OAAO,EAAE;AAAA,QAC7EC,IAAU,UAAUA,IAAUa,EAAO,MAAM,QAAQ,EAAE;AAAA,uBACtCZ,IAAgB,GAAGA,CAAa,KAAK,SAAS,GAC7D,OAAOA,KAAkB,WAAW,OAAO,EAC7C;AAAA,QACEC,IAAiB,kBAAkBA,IAAiBW,EAAO,MAAM,QAAQ,EAAE;AAAA,QAC3EV,IAAa,eAAeA,CAAU,MAAM,EAAE;AAAA,QAC9CG,IAAkB,oBAAoBA,CAAe,MAAM,EAAE;AAAA,QAC7DC,IAAc,gBAAgBA,CAAW,MAAM,EAAE;AAAA,QACjDG,IAAU,WAAWA,CAAO,MAAM,EAAE;AAAA;AAAA,EAE1C;AACF;AAEAjB,EAAK,cAAc;AAEnB,MAAA8B,IAAe9B;"}

package/dist/features/ui/theme/button.js

@@ -2,7 +2,7 @@ const d = (a) => ({ sizes: {
   xsmall: {
     height: a * 2,
     paddingHorizontal: a * 1.375,
-    textVariant: "ub3-bold",
+    textVariant: "ub4-bold",
     borderWidth: 1,
     iconSize: a,
     iconPadding: a * 0.25,
@@ -11,7 +11,7 @@ const d = (a) => ({ sizes: {
   small: {
     height: a * 2.5,
     paddingHorizontal: a * 1.625,
-    textVariant: "ub2-bold",
+    textVariant: "ub3-bold",
     borderWidth: 1,
     iconSize: a * 1.25,
     iconPadding: a * 0.375,
@@ -20,7 +20,7 @@ const d = (a) => ({ sizes: {
   regular: {
     height: a * 3,
     paddingHorizontal: a * 1.875,
-    textVariant: "ub1-bold",
+    textVariant: "ub2-bold",
     borderWidth: 1,
     iconSize: a * 1.5,
     iconPadding: a * 0.5,
@@ -29,7 +29,7 @@ const d = (a) => ({ sizes: {
   medium: {
     height: a * 3.5,
     paddingHorizontal: a * 2.125,
-    textVariant: "ub1-bold",
+    textVariant: "ub2-bold",
     borderWidth: 1.5,
     iconSize: a * 1.5,
     iconPadding: a * 0.5,
@@ -38,7 +38,7 @@ const d = (a) => ({ sizes: {
   large: {
     height: a * 4,
     paddingHorizontal: a * 2.375,
-    textVariant: "ub1-bold",
+    textVariant: "ub2-bold",
     borderWidth: 2,
     iconSize: a * 1.5,
     iconPadding: a * 0.5,

package/dist/features/ui/theme/button.js.map

@@ -1 +1 @@
-{"version":3,"file":"button.js","sources":["../../../../src/features/ui/theme/button.ts"],"sourcesContent":["import type {\n  IButtonSizeConfig,\n  TButtonSizes,\n  IButtonVariantConfig,\n  TButtonVariants,\n} from '../types';\n\ninterface IGetButtonConfig {\n  (gutter: number): {\n    sizes: Record<TButtonSizes, IButtonSizeConfig>;\n    variants: Record<TButtonVariants, IButtonVariantConfig>;\n  };\n}\n\nconst getButtonConfig: IGetButtonConfig = (gutter: number) => {\n  const sizes: Record<TButtonSizes, IButtonSizeConfig> = {\n    xsmall: {\n      height: gutter * 2,\n      paddingHorizontal: gutter * (1 + 0.375),\n      textVariant: 'ub3-bold',\n      borderWidth: 1,\n      iconSize: gutter,\n      iconPadding: gutter * 0.25,\n      loaderSize: gutter * 1.25,\n    },\n    small: {\n      height: gutter * 2.5,\n      paddingHorizontal: gutter * (1 + 0.625),\n      textVariant: 'ub2-bold',\n      borderWidth: 1,\n      iconSize: gutter * 1.25,\n      iconPadding: gutter * 0.375,\n      loaderSize: gutter * 1.5,\n    },\n    regular: {\n      height: gutter * 3,\n      paddingHorizontal: gutter * (1 + 0.875),\n      textVariant: 'ub1-bold',\n      borderWidth: 1,\n      iconSize: gutter * 1.5,\n      iconPadding: gutter * 0.5,\n      loaderSize: gutter * 1.75,\n    },\n    medium: {\n      height: gutter * 3.5,\n      paddingHorizontal: gutter * (1 + 1.125),\n      textVariant: 'ub1-bold',\n      borderWidth: 1.5,\n      iconSize: gutter * 1.5,\n      iconPadding: gutter * 0.5,\n      loaderSize: gutter * 2,\n    },\n    large: {\n      height: gutter * 4,\n      paddingHorizontal: gutter * (1 + 1.375),\n      textVariant: 'ub1-bold',\n      borderWidth: 2,\n      iconSize: gutter * 1.5,\n      iconPadding: gutter * 0.5,\n      loaderSize: gutter * 2.25,\n    },\n  };\n\n  const variants: Record<TButtonVariants, IButtonVariantConfig> = {\n    'primary': {\n      backgroundColorName: {\n        inactive: 'YELLOW_4',\n        active: 'BLACK',\n        disabled: 'GREY_3',\n      },\n      colorName: {\n        inactive: 'BLACK',\n        active: 'WHITE',\n        disabled: 'BLACK',\n      },\n      borderColorName: {\n        inactive: 'BLACK',\n        active: 'BLACK',\n        disabled: 'GREY_3',\n      },\n    },\n    'secondary': {\n      backgroundColorName: {\n        inactive: 'WHITE',\n        active: 'BLACK',\n        disabled: 'GREY_3',\n      },\n      colorName: {\n        inactive: 'BLACK',\n        active: 'WHITE',\n        disabled: 'BLACK',\n      },\n      borderColorName: {\n        inactive: 'BLACK',\n        active: 'BLACK',\n        disabled: 'GREY_3',\n      },\n    },\n    'tertiary': {\n      backgroundColorName: {\n        inactive: 'RED',\n        active: 'BLACK',\n        disabled: 'GREY_3',\n      },\n      colorName: {\n        inactive: 'WHITE',\n        active: 'WHITE',\n        disabled: 'BLACK',\n      },\n      borderColorName: {\n        inactive: 'BLACK',\n        active: 'BLACK',\n        disabled: 'GREY_3',\n      },\n    },\n    'secondary-gray': {\n      backgroundColorName: {\n        inactive: 'WHITE',\n        active: 'WHITE_4',\n        disabled: 'GREY_3',\n      },\n      colorName: {\n        inactive: 'BLACK',\n        active: 'BLACK',\n        disabled: 'BLACK',\n      },\n      borderColorName: {\n        inactive: 'BLACK',\n        active: 'BLACK',\n        disabled: 'GREY_3',\n      },\n    },\n    'secondary-dark': {\n      backgroundColorName: {\n        inactive: 'WHITE',\n        active: 'BLACK',\n        disabled: 'WHITE_T_10',\n      },\n      colorName: {\n        inactive: 'BLACK',\n        active: 'WHITE',\n        disabled: 'WHITE_T_38',\n      },\n      borderColorName: {\n        inactive: 'WHITE',\n        active: 'BLACK',\n        disabled: 'WHITE_T_15',\n      },\n    },\n    'black': {\n      backgroundColorName: {\n        inactive: 'BLACK_1',\n        active: 'BLACK_T_60',\n        disabled: 'BLACK_T_15',\n      },\n      borderColorName: {\n        inactive: 'BLACK_1',\n        active: 'BLACK_1',\n        disabled: 'BLACK_T_15',\n      },\n      colorName: {\n        inactive: 'WHITE_1',\n        active: 'WHITE_1',\n        disabled: 'WHITE_T_87',\n      },\n    },\n    'black-dark': {\n      backgroundColorName: {\n        inactive: 'BLACK_1',\n        active: 'BLACK_4',\n        disabled: 'WHITE_T_10',\n      },\n      borderColorName: {\n        inactive: 'WHITE_1',\n        active: 'WHITE_1',\n        disabled: 'WHITE_T_15',\n      },\n      colorName: {\n        inactive: 'WHITE_1',\n        active: 'WHITE_1',\n        disabled: 'WHITE_T_38',\n      },\n    },\n    'white-danger': {\n      backgroundColorName: {\n        inactive: 'WHITE',\n        active: 'BLACK',\n        disabled: 'WHITE_T_10',\n      },\n      colorName: {\n        inactive: 'RED',\n        active: 'WHITE',\n        disabled: 'GREY_3',\n      },\n      borderColorName: {\n        inactive: 'RED',\n        active: 'BLACK',\n        disabled: 'GREY_3',\n      },\n    },\n    'yellow-dark': {\n      backgroundColorName: {\n        inactive: 'YELLOW_4',\n        active: 'YELLOW_3',\n        disabled: 'WHITE_T_10',\n      },\n      borderColorName: {\n        inactive: 'WHITE',\n        active: 'WHITE',\n        disabled: 'WHITE_T_15',\n      },\n      colorName: {\n        inactive: 'BLACK_1',\n        active: 'BLACK_1',\n        disabled: 'WHITE_T_38',\n      },\n    },\n    // 'yellow': {\n    //   backgroundColorName: {\n    //     inactive: 'YELLOW_4',\n    //     active: 'BLACK_4',\n    //     disabled: 'BLACK_T_35',\n    //   },\n    //   borderColorName: {\n    //     inactive: 'BLACK_4',\n    //     active: 'BLACK_4',\n    //     disabled: 'BLACK_T_35',\n    //   },\n    //   colorName: {\n    //     inactive: 'BLACK_4',\n    //     active: 'WHITE_4',\n    //     disabled: 'BLACK_T_35',\n    //   },\n    // },\n\n    // 'white': {\n    //   backgroundColorName: {\n    //     inactive: 'WHITE_1',\n    //     active: 'BLACK_T_35',\n    //     disabled: 'BLACK_T_35',\n    //   },\n    //   borderColorName: {\n    //     inactive: 'BLACK_4',\n    //     active: 'BLACK_4',\n    //     disabled: 'BLACK_T_35',\n    //   },\n    //   colorName: {\n    //     inactive: 'BLACK_4',\n    //     active: 'BLACK_4',\n    //     disabled: 'BLACK_T_35',\n    //   },\n    // },\n    // 'white-dark': {\n    //   backgroundColorName: {\n    //     inactive: 'WHITE_4',\n    //     active: 'WHITE_T_70',\n    //     disabled: 'WHITE_T_40',\n    //   },\n    //   borderColorName: {\n    //     inactive: 'BLACK_4',\n    //     active: 'BLACK_4',\n    //     disabled: 'WHITE_T_40',\n    //   },\n    //   colorName: {\n    //     inactive: 'BLACK_4',\n    //     active: 'BLACK_4',\n    //     disabled: 'WHITE_T_40',\n    //   },\n    // },\n  };\n\n  return { sizes, variants };\n};\n\nexport default getButtonConfig;\n"],"names":["getButtonConfig","gutter"],"mappings":"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"}
+{"version":3,"file":"button.js","sources":["../../../../src/features/ui/theme/button.ts"],"sourcesContent":["import type {\n  IButtonSizeConfig,\n  TButtonSizes,\n  IButtonVariantConfig,\n  TButtonVariants,\n} from '../types';\n\ninterface IGetButtonConfig {\n  (gutter: number): {\n    sizes: Record<TButtonSizes, IButtonSizeConfig>;\n    variants: Record<TButtonVariants, IButtonVariantConfig>;\n  };\n}\n\nconst getButtonConfig: IGetButtonConfig = (gutter: number) => {\n  const sizes: Record<TButtonSizes, IButtonSizeConfig> = {\n    xsmall: {\n      height: gutter * 2,\n      paddingHorizontal: gutter * (1 + 0.375),\n      textVariant: 'ub4-bold',\n      borderWidth: 1,\n      iconSize: gutter,\n      iconPadding: gutter * 0.25,\n      loaderSize: gutter * 1.25,\n    },\n    small: {\n      height: gutter * 2.5,\n      paddingHorizontal: gutter * (1 + 0.625),\n      textVariant: 'ub3-bold',\n      borderWidth: 1,\n      iconSize: gutter * 1.25,\n      iconPadding: gutter * 0.375,\n      loaderSize: gutter * 1.5,\n    },\n    regular: {\n      height: gutter * 3,\n      paddingHorizontal: gutter * (1 + 0.875),\n      textVariant: 'ub2-bold',\n      borderWidth: 1,\n      iconSize: gutter * 1.5,\n      iconPadding: gutter * 0.5,\n      loaderSize: gutter * 1.75,\n    },\n    medium: {\n      height: gutter * 3.5,\n      paddingHorizontal: gutter * (1 + 1.125),\n      textVariant: 'ub2-bold',\n      borderWidth: 1.5,\n      iconSize: gutter * 1.5,\n      iconPadding: gutter * 0.5,\n      loaderSize: gutter * 2,\n    },\n    large: {\n      height: gutter * 4,\n      paddingHorizontal: gutter * (1 + 1.375),\n      textVariant: 'ub2-bold',\n      borderWidth: 2,\n      iconSize: gutter * 1.5,\n      iconPadding: gutter * 0.5,\n      loaderSize: gutter * 2.25,\n    },\n  };\n\n  const variants: Record<TButtonVariants, IButtonVariantConfig> = {\n    'primary': {\n      backgroundColorName: {\n        inactive: 'YELLOW_4',\n        active: 'BLACK',\n        disabled: 'GREY_3',\n      },\n      colorName: {\n        inactive: 'BLACK',\n        active: 'WHITE',\n        disabled: 'BLACK',\n      },\n      borderColorName: {\n        inactive: 'BLACK',\n        active: 'BLACK',\n        disabled: 'GREY_3',\n      },\n    },\n    'secondary': {\n      backgroundColorName: {\n        inactive: 'WHITE',\n        active: 'BLACK',\n        disabled: 'GREY_3',\n      },\n      colorName: {\n        inactive: 'BLACK',\n        active: 'WHITE',\n        disabled: 'BLACK',\n      },\n      borderColorName: {\n        inactive: 'BLACK',\n        active: 'BLACK',\n        disabled: 'GREY_3',\n      },\n    },\n    'tertiary': {\n      backgroundColorName: {\n        inactive: 'RED',\n        active: 'BLACK',\n        disabled: 'GREY_3',\n      },\n      colorName: {\n        inactive: 'WHITE',\n        active: 'WHITE',\n        disabled: 'BLACK',\n      },\n      borderColorName: {\n        inactive: 'BLACK',\n        active: 'BLACK',\n        disabled: 'GREY_3',\n      },\n    },\n    'secondary-gray': {\n      backgroundColorName: {\n        inactive: 'WHITE',\n        active: 'WHITE_4',\n        disabled: 'GREY_3',\n      },\n      colorName: {\n        inactive: 'BLACK',\n        active: 'BLACK',\n        disabled: 'BLACK',\n      },\n      borderColorName: {\n        inactive: 'BLACK',\n        active: 'BLACK',\n        disabled: 'GREY_3',\n      },\n    },\n    'secondary-dark': {\n      backgroundColorName: {\n        inactive: 'WHITE',\n        active: 'BLACK',\n        disabled: 'WHITE_T_10',\n      },\n      colorName: {\n        inactive: 'BLACK',\n        active: 'WHITE',\n        disabled: 'WHITE_T_38',\n      },\n      borderColorName: {\n        inactive: 'WHITE',\n        active: 'BLACK',\n        disabled: 'WHITE_T_15',\n      },\n    },\n    'black': {\n      backgroundColorName: {\n        inactive: 'BLACK_1',\n        active: 'BLACK_T_60',\n        disabled: 'BLACK_T_15',\n      },\n      borderColorName: {\n        inactive: 'BLACK_1',\n        active: 'BLACK_1',\n        disabled: 'BLACK_T_15',\n      },\n      colorName: {\n        inactive: 'WHITE_1',\n        active: 'WHITE_1',\n        disabled: 'WHITE_T_87',\n      },\n    },\n    'black-dark': {\n      backgroundColorName: {\n        inactive: 'BLACK_1',\n        active: 'BLACK_4',\n        disabled: 'WHITE_T_10',\n      },\n      borderColorName: {\n        inactive: 'WHITE_1',\n        active: 'WHITE_1',\n        disabled: 'WHITE_T_15',\n      },\n      colorName: {\n        inactive: 'WHITE_1',\n        active: 'WHITE_1',\n        disabled: 'WHITE_T_38',\n      },\n    },\n    'white-danger': {\n      backgroundColorName: {\n        inactive: 'WHITE',\n        active: 'BLACK',\n        disabled: 'WHITE_T_10',\n      },\n      colorName: {\n        inactive: 'RED',\n        active: 'WHITE',\n        disabled: 'GREY_3',\n      },\n      borderColorName: {\n        inactive: 'RED',\n        active: 'BLACK',\n        disabled: 'GREY_3',\n      },\n    },\n    'yellow-dark': {\n      backgroundColorName: {\n        inactive: 'YELLOW_4',\n        active: 'YELLOW_3',\n        disabled: 'WHITE_T_10',\n      },\n      borderColorName: {\n        inactive: 'WHITE',\n        active: 'WHITE',\n        disabled: 'WHITE_T_15',\n      },\n      colorName: {\n        inactive: 'BLACK_1',\n        active: 'BLACK_1',\n        disabled: 'WHITE_T_38',\n      },\n    },\n    // 'yellow': {\n    //   backgroundColorName: {\n    //     inactive: 'YELLOW_4',\n    //     active: 'BLACK_4',\n    //     disabled: 'BLACK_T_35',\n    //   },\n    //   borderColorName: {\n    //     inactive: 'BLACK_4',\n    //     active: 'BLACK_4',\n    //     disabled: 'BLACK_T_35',\n    //   },\n    //   colorName: {\n    //     inactive: 'BLACK_4',\n    //     active: 'WHITE_4',\n    //     disabled: 'BLACK_T_35',\n    //   },\n    // },\n\n    // 'white': {\n    //   backgroundColorName: {\n    //     inactive: 'WHITE_1',\n    //     active: 'BLACK_T_35',\n    //     disabled: 'BLACK_T_35',\n    //   },\n    //   borderColorName: {\n    //     inactive: 'BLACK_4',\n    //     active: 'BLACK_4',\n    //     disabled: 'BLACK_T_35',\n    //   },\n    //   colorName: {\n    //     inactive: 'BLACK_4',\n    //     active: 'BLACK_4',\n    //     disabled: 'BLACK_T_35',\n    //   },\n    // },\n    // 'white-dark': {\n    //   backgroundColorName: {\n    //     inactive: 'WHITE_4',\n    //     active: 'WHITE_T_70',\n    //     disabled: 'WHITE_T_40',\n    //   },\n    //   borderColorName: {\n    //     inactive: 'BLACK_4',\n    //     active: 'BLACK_4',\n    //     disabled: 'WHITE_T_40',\n    //   },\n    //   colorName: {\n    //     inactive: 'BLACK_4',\n    //     active: 'BLACK_4',\n    //     disabled: 'WHITE_T_40',\n    //   },\n    // },\n  };\n\n  return { sizes, variants };\n};\n\nexport default getButtonConfig;\n"],"names":["getButtonConfig","gutter"],"mappings":"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"}