@cuemath/leap 2.8.61-rj-12 → 2.8.61-rj-13

package/dist/features/ui/layout/flex-view.js

@@ -1,29 +1,29 @@
 import I from "styled-components";
 const J = (i, p) => {
-  const { $gutter: n, $gutterX: a, $gap: o, $gapX: $ } = i;
+  const { $gutter: a, $gutterX: n, $gap: o, $gapX: $ } = i;
   let e = 0, r = 0;
-  return n ? e = n : a && (e = a * p), o ? r = o : $ && (r = $ * p), `${r}px ${e}px`;
-}, K = I.div(
+  return a ? e = a : n && (e = n * p), o ? r = o : $ && (r = $ * p), `${r}px ${e}px`;
+}, L = I.div(
   ({
     theme: i,
     $position: p,
-    $flexDirection: n = "column",
-    $inherit: a,
+    $flexDirection: a = "column",
+    $inherit: n,
     $flexWrap: o = !1,
     $flexGap: $,
     $flexGapX: e,
     $flexRowGap: r,
     $flexRowGapX: s,
     $flexColumnGap: x,
-    $flexColumnGapX: c,
-    $gutter: V,
-    $gutterX: j = 0,
-    $gap: k,
-    $gapX: z = 0,
+    $flexColumnGapX: d,
+    $gutter: k,
+    $gutterX: z = 0,
+    $gap: F,
+    $gapX: V = 0,
     $marginBottom: g,
-    $marginBottomX: d,
+    $marginBottomX: f,
     $width: l,
-    $widthX: f,
+    $widthX: c,
     $height: u,
     $heightX: y,
     $alignSelf: q,
@@ -37,27 +37,27 @@ const J = (i, p) => {
     $hidden: H = !1,
     $flex: v
   }) => {
-    const { layout: t, colors: F } = i;
+    const { layout: t, colors: j } = i;
     return `
       ${p ? `position: ${p};` : ""}
       display: flex;
       ${H ? "display: none;" : ""}
       flex-wrap: ${o ? "wrap" : "nowrap"};
-      ${a ? "flex-grow: 1; flex-shrink: 1;" : ""}
-      flex-direction: ${n};
-      padding: ${J({ $gutter: V, $gutterX: j, $gap: k, $gapX: z }, t.gutter)};
+      ${n ? "flex-grow: 1; flex-shrink: 1;" : ""}
+      flex-direction: ${a};
+      padding: ${J({ $gutter: k, $gutterX: z, $gap: F, $gapX: V }, t.gutter)};
       margin-bottom: ${g ? `${g}` : "initial"}${typeof g == "number" ? "px" : ""};
-      ${d ? `margin-bottom: ${d * t.gutter}px;` : ""}
+      ${f ? `margin-bottom: ${f * t.gutter}px;` : ""}
       align-self: ${q || "auto"};
       align-items: ${A || "normal"};
       justify-content: ${D || "flex-start"};
-      background-color: ${m ? F[m] : "transparent"};
+      background-color: ${m ? j[m] : "transparent"};
       border-radius: ${typeof w == "number" ? w : 0}px;
       ${P ? `border-radius: ${P * t.gutter}px;` : ""}
-      ${b ? `border: 1px solid ${F[b]};` : ""}
+      ${b ? `border: 1px solid ${j[b]};` : ""}
       opacity: ${E};
       width: ${l ? `${l}` : "auto"}${typeof l == "number" ? "px" : ""};
-      ${f ? `width: ${f * t.gutter}px;` : ""}
+      ${c ? `width: ${c * t.gutter}px;` : ""}
       height: ${u ? `${u}` : "auto"}${typeof u == "number" ? "px" : ""};
       ${y ? `height: ${y * t.gutter}px;` : ""}
       ${$ ? `gap: ${$}px;` : ""}
@@ -65,12 +65,12 @@ const J = (i, p) => {
       ${r ? `row-gap: ${r}px;` : ""}
       ${s ? `row-gap: ${s * t.gutter}px;` : ""}
       ${x ? `column-gap: ${x}px;` : ""}
-      ${c ? `column-gap: ${c * t.gutter}px;` : ""}
+      ${d ? `column-gap: ${d * t.gutter}px;` : ""}
       ${v ? `flex: ${v};` : ""}
   `;
   }
-), M = K;
+);
 export {
-  M as default
+  L as default
 };
 //# sourceMappingURL=flex-view.js.map

package/dist/features/ui/layout/flex-view.js.map

@@ -1 +1 @@
-{"version":3,"file":"flex-view.js","sources":["../../../../src/features/ui/layout/flex-view.tsx"],"sourcesContent":["import type { TColorNames } from '../types';\nimport type { HTMLAttributes } from 'react';\n\nimport styled from 'styled-components';\n\ntype TStyleAttrubutes = NonNullable<HTMLAttributes<HTMLDivElement>['style']>;\n\ninterface IGetPadding {\n  (\n    options: {\n      $gutter?: number;\n      $gutterX?: number;\n      $gap?: number;\n      $gapX?: number;\n    },\n    gutter: number,\n  ): string;\n}\n\nconst getPadding: IGetPadding = (options, gutter) => {\n  const { $gutter, $gutterX, $gap, $gapX } = options;\n  let horizontalPadding = 0;\n  let verticalPadding = 0;\n\n  if ($gutter) {\n    horizontalPadding = $gutter;\n  } else if ($gutterX) {\n    horizontalPadding = $gutterX * gutter;\n  }\n\n  if ($gap) {\n    verticalPadding = $gap;\n  } else if ($gapX) {\n    verticalPadding = $gapX * gutter;\n  }\n\n  return `${verticalPadding}px ${horizontalPadding}px`;\n};\n\nexport interface FlexViewProps {\n  $position?: TStyleAttrubutes['position'];\n  $inherit?: boolean;\n  $gutter?: number;\n  $gutterX?: number;\n  $gap?: number;\n  $gapX?: number;\n  $marginBottom?: number;\n  $marginBottomX?: number;\n  $flexWrap?: boolean;\n  $flexGap?: number;\n  $flexGapX?: number;\n  $flexRowGap?: number;\n  $flexRowGapX?: number;\n  $flexColumnGap?: number;\n  $flexColumnGapX?: number;\n  $width?: number | string;\n  $widthX?: number;\n  $height?: number | string;\n  $heightX?: number;\n  $flexDirection?: TStyleAttrubutes['flexDirection'];\n  $alignSelf?: TStyleAttrubutes['alignSelf'];\n  $alignItems?: TStyleAttrubutes['alignItems'];\n  $justifyContent?: TStyleAttrubutes['justifyContent'];\n  $background?: TColorNames;\n  $borderRadius?: number;\n  $borderRadiusX?: number;\n  $borderColor?: TColorNames;\n  $opacity?: number;\n  $hidden?: boolean;\n  $flex?: number;\n}\n\nconst FlexView = styled.div<FlexViewProps>(\n  ({\n    theme,\n    $position,\n    $flexDirection = 'column',\n    $inherit,\n    $flexWrap = false,\n    $flexGap,\n    $flexGapX,\n    $flexRowGap,\n    $flexRowGapX,\n    $flexColumnGap,\n    $flexColumnGapX,\n    $gutter,\n    $gutterX = 0,\n    $gap,\n    $gapX = 0,\n    $marginBottom,\n    $marginBottomX,\n    $width,\n    $widthX,\n    $height,\n    $heightX,\n    $alignSelf,\n    $alignItems,\n    $justifyContent,\n    $background,\n    $borderColor,\n    $borderRadius,\n    $borderRadiusX,\n    $opacity = 1,\n    $hidden = false,\n    $flex,\n  }) => {\n    const { layout, colors } = theme;\n\n    return `\n      ${$position ? `position: ${$position};` : ''}\n      display: flex;\n      ${$hidden ? 'display: none;' : ''}\n      flex-wrap: ${$flexWrap ? 'wrap' : 'nowrap'};\n      ${$inherit ? 'flex-grow: 1; flex-shrink: 1;' : ''}\n      flex-direction: ${$flexDirection};\n      padding: ${getPadding({ $gutter, $gutterX, $gap, $gapX }, layout.gutter)};\n      margin-bottom: ${$marginBottom ? `${$marginBottom}` : 'initial'}${\n        typeof $marginBottom === 'number' ? 'px' : ''\n      };\n      ${$marginBottomX ? `margin-bottom: ${$marginBottomX * layout.gutter}px;` : ''}\n      align-self: ${$alignSelf || 'auto'};\n      align-items: ${$alignItems || 'normal'};\n      justify-content: ${$justifyContent || 'flex-start'};\n      background-color: ${$background ? colors[$background] : 'transparent'};\n      border-radius: ${typeof $borderRadius === 'number' ? $borderRadius : 0}px;\n      ${$borderRadiusX ? `border-radius: ${$borderRadiusX * layout.gutter}px;` : ''}\n      ${$borderColor ? `border: 1px solid ${colors[$borderColor]};` : ''}\n      opacity: ${$opacity};\n      width: ${$width ? `${$width}` : 'auto'}${typeof $width === 'number' ? 'px' : ''};\n      ${$widthX ? `width: ${$widthX * layout.gutter}px;` : ''}\n      height: ${$height ? `${$height}` : 'auto'}${typeof $height === 'number' ? 'px' : ''};\n      ${$heightX ? `height: ${$heightX * layout.gutter}px;` : ''}\n      ${$flexGap ? `gap: ${$flexGap}px;` : ''}\n      ${$flexGapX ? `gap: ${$flexGapX * layout.gutter}px;` : ''}\n      ${$flexRowGap ? `row-gap: ${$flexRowGap}px;` : ''}\n      ${$flexRowGapX ? `row-gap: ${$flexRowGapX * layout.gutter}px;` : ''}\n      ${$flexColumnGap ? `column-gap: ${$flexColumnGap}px;` : ''}\n      ${$flexColumnGapX ? `column-gap: ${$flexColumnGapX * layout.gutter}px;` : ''}\n      ${$flex ? `flex: ${$flex};` : ''}\n  `;\n  },\n);\n\nexport default FlexView;\n"],"names":["getPadding","options","gutter","$gutter","$gutterX","$gap","$gapX","horizontalPadding","verticalPadding","FlexView","styled","theme","$position","$flexDirection","$inherit","$flexWrap","$flexGap","$flexGapX","$flexRowGap","$flexRowGapX","$flexColumnGap","$flexColumnGapX","$marginBottom","$marginBottomX","$width","$widthX","$height","$heightX","$alignSelf","$alignItems","$justifyContent","$background","$borderColor","$borderRadius","$borderRadiusX","$opacity","$hidden","$flex","layout","colors","FlexView$1"],"mappings":"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"}
+{"version":3,"file":"flex-view.js","sources":["../../../../src/features/ui/layout/flex-view.tsx"],"sourcesContent":["import type { TColorNames } from '../types';\nimport type { HTMLAttributes } from 'react';\n\nimport styled from 'styled-components';\n\ntype TStyleAttrubutes = NonNullable<HTMLAttributes<HTMLDivElement>['style']>;\n\ninterface IGetPadding {\n  (\n    options: {\n      $gutter?: number;\n      $gutterX?: number;\n      $gap?: number;\n      $gapX?: number;\n    },\n    gutter: number,\n  ): string;\n}\n\nconst getPadding: IGetPadding = (options, gutter) => {\n  const { $gutter, $gutterX, $gap, $gapX } = options;\n  let horizontalPadding = 0;\n  let verticalPadding = 0;\n\n  if ($gutter) {\n    horizontalPadding = $gutter;\n  } else if ($gutterX) {\n    horizontalPadding = $gutterX * gutter;\n  }\n\n  if ($gap) {\n    verticalPadding = $gap;\n  } else if ($gapX) {\n    verticalPadding = $gapX * gutter;\n  }\n\n  return `${verticalPadding}px ${horizontalPadding}px`;\n};\n\nexport interface FlexViewProps {\n  $position?: TStyleAttrubutes['position'];\n  $inherit?: boolean;\n  $gutter?: number;\n  $gutterX?: number;\n  $gap?: number;\n  $gapX?: number;\n  $marginBottom?: number;\n  $marginBottomX?: number;\n  $flexWrap?: boolean;\n  $flexGap?: number;\n  $flexGapX?: number;\n  $flexRowGap?: number;\n  $flexRowGapX?: number;\n  $flexColumnGap?: number;\n  $flexColumnGapX?: number;\n  $width?: number | string;\n  $widthX?: number;\n  $height?: number | string;\n  $heightX?: number;\n  $flexDirection?: TStyleAttrubutes['flexDirection'];\n  $alignSelf?: TStyleAttrubutes['alignSelf'];\n  $alignItems?: TStyleAttrubutes['alignItems'];\n  $justifyContent?: TStyleAttrubutes['justifyContent'];\n  $background?: TColorNames;\n  $borderRadius?: number;\n  $borderRadiusX?: number;\n  $borderColor?: TColorNames;\n  $opacity?: number;\n  $hidden?: boolean;\n  $flex?: number;\n}\n\nconst FlexView = styled.div<FlexViewProps>(\n  ({\n    theme,\n    $position,\n    $flexDirection = 'column',\n    $inherit,\n    $flexWrap = false,\n    $flexGap,\n    $flexGapX,\n    $flexRowGap,\n    $flexRowGapX,\n    $flexColumnGap,\n    $flexColumnGapX,\n    $gutter,\n    $gutterX = 0,\n    $gap,\n    $gapX = 0,\n    $marginBottom,\n    $marginBottomX,\n    $width,\n    $widthX,\n    $height,\n    $heightX,\n    $alignSelf,\n    $alignItems,\n    $justifyContent,\n    $background,\n    $borderColor,\n    $borderRadius,\n    $borderRadiusX,\n    $opacity = 1,\n    $hidden = false,\n    $flex,\n  }) => {\n    const { layout, colors } = theme;\n\n    return `\n      ${$position ? `position: ${$position};` : ''}\n      display: flex;\n      ${$hidden ? 'display: none;' : ''}\n      flex-wrap: ${$flexWrap ? 'wrap' : 'nowrap'};\n      ${$inherit ? 'flex-grow: 1; flex-shrink: 1;' : ''}\n      flex-direction: ${$flexDirection};\n      padding: ${getPadding({ $gutter, $gutterX, $gap, $gapX }, layout.gutter)};\n      margin-bottom: ${$marginBottom ? `${$marginBottom}` : 'initial'}${\n        typeof $marginBottom === 'number' ? 'px' : ''\n      };\n      ${$marginBottomX ? `margin-bottom: ${$marginBottomX * layout.gutter}px;` : ''}\n      align-self: ${$alignSelf || 'auto'};\n      align-items: ${$alignItems || 'normal'};\n      justify-content: ${$justifyContent || 'flex-start'};\n      background-color: ${$background ? colors[$background] : 'transparent'};\n      border-radius: ${typeof $borderRadius === 'number' ? $borderRadius : 0}px;\n      ${$borderRadiusX ? `border-radius: ${$borderRadiusX * layout.gutter}px;` : ''}\n      ${$borderColor ? `border: 1px solid ${colors[$borderColor]};` : ''}\n      opacity: ${$opacity};\n      width: ${$width ? `${$width}` : 'auto'}${typeof $width === 'number' ? 'px' : ''};\n      ${$widthX ? `width: ${$widthX * layout.gutter}px;` : ''}\n      height: ${$height ? `${$height}` : 'auto'}${typeof $height === 'number' ? 'px' : ''};\n      ${$heightX ? `height: ${$heightX * layout.gutter}px;` : ''}\n      ${$flexGap ? `gap: ${$flexGap}px;` : ''}\n      ${$flexGapX ? `gap: ${$flexGapX * layout.gutter}px;` : ''}\n      ${$flexRowGap ? `row-gap: ${$flexRowGap}px;` : ''}\n      ${$flexRowGapX ? `row-gap: ${$flexRowGapX * layout.gutter}px;` : ''}\n      ${$flexColumnGap ? `column-gap: ${$flexColumnGap}px;` : ''}\n      ${$flexColumnGapX ? `column-gap: ${$flexColumnGapX * layout.gutter}px;` : ''}\n      ${$flex ? `flex: ${$flex};` : ''}\n  `;\n  },\n);\n\nexport default FlexView;\n"],"names":["getPadding","options","gutter","$gutter","$gutterX","$gap","$gapX","horizontalPadding","verticalPadding","FlexView","styled","theme","$position","$flexDirection","$inherit","$flexWrap","$flexGap","$flexGapX","$flexRowGap","$flexRowGapX","$flexColumnGap","$flexColumnGapX","$marginBottom","$marginBottomX","$width","$widthX","$height","$heightX","$alignSelf","$alignItems","$justifyContent","$background","$borderColor","$borderRadius","$borderRadiusX","$opacity","$hidden","$flex","layout","colors"],"mappings":"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"}

package/dist/features/ui/loader/app-loader/app-loader.js

@@ -1,7 +1,7 @@
 import { jsx as e } from "react/jsx-runtime";
-import o from "../../layout/flex-view.js";
-const n = ({ width: t, height: r }) => /* @__PURE__ */ e(o, { $alignItems: "center", $justifyContent: "center", $width: t, $height: r, children: /* @__PURE__ */ e("div", { className: "app-loader", children: "Load ng" }) }), d = n;
+import i from "../../layout/flex-view.js";
+const a = ({ width: t, height: r }) => /* @__PURE__ */ e(i, { $alignItems: "center", $justifyContent: "center", $width: t, $height: r, children: /* @__PURE__ */ e("div", { className: "app-loader", children: "Load ng" }) });
 export {
-  d as default
+  a as default
 };
 //# sourceMappingURL=app-loader.js.map

package/dist/features/ui/loader/app-loader/app-loader.js.map

@@ -1 +1 @@
-{"version":3,"file":"app-loader.js","sources":["../../../../../src/features/ui/loader/app-loader/app-loader.tsx"],"sourcesContent":["import type { FC } from 'react';\n\nimport FlexView from '../../layout/flex-view';\n\ninterface IAppLoaderProps {\n  width?: string | number;\n  height?: string | number;\n}\n\nconst AppLoader: FC<IAppLoaderProps> = ({ width, height }) => {\n  return (\n    <FlexView $alignItems=\"center\" $justifyContent=\"center\" $width={width} $height={height}>\n      <div className=\"app-loader\">Load&nbsp;ng</div>\n    </FlexView>\n  );\n};\n\nexport default AppLoader;\n"],"names":["AppLoader","width","height","jsx","FlexView","AppLoader$1"],"mappings":";;AASA,MAAMA,IAAiC,CAAC,EAAE,OAAAC,GAAO,QAAAC,QAE5C,gBAAAC,EAAAC,GAAA,EAAS,aAAY,UAAS,iBAAgB,UAAS,QAAQH,GAAO,SAASC,GAC9E,UAAC,gBAAAC,EAAA,OAAA,EAAI,WAAU,cAAa,qBAAY,EAC1C,CAAA,GAIJE,IAAeL;"}
+{"version":3,"file":"app-loader.js","sources":["../../../../../src/features/ui/loader/app-loader/app-loader.tsx"],"sourcesContent":["import type { FC } from 'react';\n\nimport FlexView from '../../layout/flex-view';\n\ninterface IAppLoaderProps {\n  width?: string | number;\n  height?: string | number;\n}\n\nconst AppLoader: FC<IAppLoaderProps> = ({ width, height }) => {\n  return (\n    <FlexView $alignItems=\"center\" $justifyContent=\"center\" $width={width} $height={height}>\n      <div className=\"app-loader\">Load&nbsp;ng</div>\n    </FlexView>\n  );\n};\n\nexport default AppLoader;\n"],"names":["AppLoader","width","height","jsx","FlexView"],"mappings":";;AASA,MAAMA,IAAiC,CAAC,EAAE,OAAAC,GAAO,QAAAC,QAE5C,gBAAAC,EAAAC,GAAA,EAAS,aAAY,UAAS,iBAAgB,UAAS,QAAQH,GAAO,SAASC,GAC9E,UAAC,gBAAAC,EAAA,OAAA,EAAI,WAAU,cAAa,oBAAY,CAAA,GAC1C;"}

package/dist/features/ui/lottie-animation/helper.js.map

@@ -1 +1 @@
-{"version":3,"file":"helper.js","sources":["../../../../src/features/ui/lottie-animation/helper.ts"],"sourcesContent":["import type { AnimationItem } from 'lottie-web';\n\nexport const fetchLottie = async (lottieSrc: string): Promise<AnimationItem | null> => {\n  let lottieJson: AnimationItem | null = null;\n\n  try {\n    lottieJson = await fetch(lottieSrc)\n      .then(res => res.json())\n      .catch(() => null);\n  } catch (error) {\n    /* eslint-disable no-console */\n    console.log('Error while fetching the lottie: ', error);\n  }\n\n  return lottieJson;\n};\n"],"names":["fetchLottie","lottieSrc","lottieJson","res","error"],"mappings":"AAEa,MAAAA,IAAc,OAAOC,MAAqD;AACrF,MAAIC,IAAmC;AAEnC,MAAA;AACF,IAAAA,IAAa,MAAM,MAAMD,CAAS,EAC/B,KAAK,CAAAE,MAAOA,EAAI,KAAA,CAAM,EACtB,MAAM,MAAM,IAAI;AAAA,WACZC,GAAO;AAEN,YAAA,IAAI,qCAAqCA,CAAK;AAAA,EACxD;AAEO,SAAAF;AACT;"}
+{"version":3,"file":"helper.js","sources":["../../../../src/features/ui/lottie-animation/helper.ts"],"sourcesContent":["import type { AnimationItem } from 'lottie-web';\n\nexport const fetchLottie = async (lottieSrc: string): Promise<AnimationItem | null> => {\n  let lottieJson: AnimationItem | null = null;\n\n  try {\n    lottieJson = await fetch(lottieSrc)\n      .then(res => res.json())\n      .catch(() => null);\n  } catch (error) {\n    /* eslint-disable no-console */\n    console.log('Error while fetching the lottie: ', error);\n  }\n\n  return lottieJson;\n};\n"],"names":["fetchLottie","lottieSrc","lottieJson","res","error"],"mappings":"AAEa,MAAAA,IAAc,OAAOC,MAAqD;AACrF,MAAIC,IAAmC;AAEnC,MAAA;AACF,IAAAA,IAAa,MAAM,MAAMD,CAAS,EAC/B,KAAK,CAAAE,MAAOA,EAAI,KAAM,CAAA,EACtB,MAAM,MAAM,IAAI;AAAA,WACZC,GAAO;AAEN,YAAA,IAAI,qCAAqCA,CAAK;AAAA,EAAA;AAGjD,SAAAF;AACT;"}

package/dist/features/ui/lottie-animation/lottie-animation.js.map

@@ -1 +1 @@
-{"version":3,"file":"lottie-animation.js","sources":["../../../../src/features/ui/lottie-animation/lottie-animation.tsx"],"sourcesContent":["import type { ILottieAnimationProps, ILottieAnimationRef } from './types';\nimport type { AnimationItem, AnimationSegment } from 'lottie-web';\n\nimport lottie from 'lottie-web';\nimport { forwardRef, memo, useEffect, useImperativeHandle, useRef } from 'react';\n\nimport FlexView from '../layout/flex-view';\nimport { fetchLottie } from './helper';\n\nconst LottieAnimation = forwardRef<ILottieAnimationRef, ILottieAnimationProps>((props, ref) => {\n  const {\n    src,\n    width = '100%',\n    height = '100%',\n    settings,\n    eventListener,\n    onRender,\n    animateOnIntersect,\n  } = props;\n\n  const container = useRef<HTMLDivElement>(null);\n  const animationInstance = useRef<AnimationItem | null>(null);\n  const intersectionObserver = useRef<IntersectionObserver | null>(null);\n\n  useImperativeHandle(\n    ref,\n    () => ({\n      playSegments: (segments: AnimationSegment, forceFlag?: boolean) => {\n        if (animationInstance.current) {\n          animationInstance.current.playSegments(segments, forceFlag);\n        }\n      },\n    }),\n    [],\n  );\n\n  useEffect(() => {\n    const loadAnimation = async () => {\n      try {\n        const animationData = await fetchLottie(src);\n\n        if (container.current) {\n          animationInstance.current = lottie.loadAnimation({\n            container: container.current,\n            animationData,\n            renderer: 'svg',\n            loop: true,\n            autoplay: true,\n            ...settings,\n          });\n\n          if (animateOnIntersect) {\n            intersectionObserver.current = new IntersectionObserver(\n              ([entry]) => {\n                if (entry && entry.isIntersecting) {\n                  animationInstance.current?.play();\n                } else {\n                  animationInstance.current?.pause();\n                }\n              },\n              { threshold: 0 },\n            );\n\n            if (container.current) {\n              intersectionObserver.current.observe(container.current);\n            }\n          }\n\n          onRender?.();\n          if (eventListener) {\n            animationInstance.current.addEventListener(eventListener.name, eventListener.callback);\n          }\n        }\n      } catch (error) {\n        throw Error(`Error loading Lottie animation: ${error}`);\n      }\n    };\n\n    loadAnimation();\n\n    return () => {\n      if (animationInstance.current) {\n        if (eventListener) {\n          animationInstance.current.removeEventListener(eventListener.name, eventListener.callback);\n        }\n\n        if (animateOnIntersect) {\n          intersectionObserver.current?.disconnect();\n        }\n        animationInstance.current.destroy();\n      }\n    };\n  }, [src, eventListener, onRender, animateOnIntersect, settings]);\n\n  return <FlexView ref={container} $width={width} $height={height} />;\n});\n\nexport default memo(LottieAnimation);\n"],"names":["LottieAnimation","forwardRef","props","ref","src","width","height","settings","eventListener","onRender","animateOnIntersect","container","useRef","animationInstance","intersectionObserver","useImperativeHandle","segments","forceFlag","useEffect","animationData","fetchLottie","lottie","entry","_a","_b","error","FlexView","LottieAnimation$1","memo"],"mappings":";;;;;AASA,MAAMA,IAAkBC,EAAuD,CAACC,GAAOC,MAAQ;AACvF,QAAA;AAAA,IACJ,KAAAC;AAAA,IACA,OAAAC,IAAQ;AAAA,IACR,QAAAC,IAAS;AAAA,IACT,UAAAC;AAAA,IACA,eAAAC;AAAA,IACA,UAAAC;AAAA,IACA,oBAAAC;AAAA,EACE,IAAAR,GAEES,IAAYC,EAAuB,IAAI,GACvCC,IAAoBD,EAA6B,IAAI,GACrDE,IAAuBF,EAAoC,IAAI;AAErE,SAAAG;AAAA,IACEZ;AAAA,IACA,OAAO;AAAA,MACL,cAAc,CAACa,GAA4BC,MAAwB;AACjE,QAAIJ,EAAkB,WACFA,EAAA,QAAQ,aAAaG,GAAUC,CAAS;AAAA,MAE9D;AAAA,IAAA;AAAA,IAEF,CAAC;AAAA,EAAA,GAGHC,EAAU,QACc,YAAY;AAC5B,QAAA;AACI,YAAAC,IAAgB,MAAMC,EAAYhB,CAAG;AAE3C,MAAIO,EAAU,YACME,EAAA,UAAUQ,EAAO,cAAc;AAAA,QAC/C,WAAWV,EAAU;AAAA,QACrB,eAAAQ;AAAA,QACA,UAAU;AAAA,QACV,MAAM;AAAA,QACN,UAAU;AAAA,QACV,GAAGZ;AAAA,MAAA,CACJ,GAEGG,MACFI,EAAqB,UAAU,IAAI;AAAA,QACjC,CAAC,CAACQ,CAAK,MAAM;;AACP,UAAAA,KAASA,EAAM,kBACjBC,IAAAV,EAAkB,YAAlB,QAAAU,EAA2B,UAE3BC,IAAAX,EAAkB,YAAlB,QAAAW,EAA2B;AAAA,QAE/B;AAAA,QACA,EAAE,WAAW,EAAE;AAAA,MAAA,GAGbb,EAAU,WACSG,EAAA,QAAQ,QAAQH,EAAU,OAAO,IAI/CF,KAAA,QAAAA,KACPD,KACFK,EAAkB,QAAQ,iBAAiBL,EAAc,MAAMA,EAAc,QAAQ;AAAA,aAGlFiB,GAAO;AACR,YAAA,MAAM,mCAAmCA,CAAK,EAAE;AAAA,IACxD;AAAA,EAAA,MAKK,MAAM;;AACX,IAAIZ,EAAkB,YAChBL,KACFK,EAAkB,QAAQ,oBAAoBL,EAAc,MAAMA,EAAc,QAAQ,GAGtFE,OACFa,IAAAT,EAAqB,YAArB,QAAAS,EAA8B,eAEhCV,EAAkB,QAAQ;EAC5B,IAED,CAACT,GAAKI,GAAeC,GAAUC,GAAoBH,CAAQ,CAAC,qBAEvDmB,GAAS,EAAA,KAAKf,GAAW,QAAQN,GAAO,SAASC,EAAQ,CAAA;AACnE,CAAC,GAEcqB,IAAAC,EAAK5B,CAAe;"}
+{"version":3,"file":"lottie-animation.js","sources":["../../../../src/features/ui/lottie-animation/lottie-animation.tsx"],"sourcesContent":["import type { ILottieAnimationProps, ILottieAnimationRef } from './types';\nimport type { AnimationItem, AnimationSegment } from 'lottie-web';\n\nimport lottie from 'lottie-web';\nimport { forwardRef, memo, useEffect, useImperativeHandle, useRef } from 'react';\n\nimport FlexView from '../layout/flex-view';\nimport { fetchLottie } from './helper';\n\nconst LottieAnimation = forwardRef<ILottieAnimationRef, ILottieAnimationProps>((props, ref) => {\n  const {\n    src,\n    width = '100%',\n    height = '100%',\n    settings,\n    eventListener,\n    onRender,\n    animateOnIntersect,\n  } = props;\n\n  const container = useRef<HTMLDivElement>(null);\n  const animationInstance = useRef<AnimationItem | null>(null);\n  const intersectionObserver = useRef<IntersectionObserver | null>(null);\n\n  useImperativeHandle(\n    ref,\n    () => ({\n      playSegments: (segments: AnimationSegment, forceFlag?: boolean) => {\n        if (animationInstance.current) {\n          animationInstance.current.playSegments(segments, forceFlag);\n        }\n      },\n    }),\n    [],\n  );\n\n  useEffect(() => {\n    const loadAnimation = async () => {\n      try {\n        const animationData = await fetchLottie(src);\n\n        if (container.current) {\n          animationInstance.current = lottie.loadAnimation({\n            container: container.current,\n            animationData,\n            renderer: 'svg',\n            loop: true,\n            autoplay: true,\n            ...settings,\n          });\n\n          if (animateOnIntersect) {\n            intersectionObserver.current = new IntersectionObserver(\n              ([entry]) => {\n                if (entry && entry.isIntersecting) {\n                  animationInstance.current?.play();\n                } else {\n                  animationInstance.current?.pause();\n                }\n              },\n              { threshold: 0 },\n            );\n\n            if (container.current) {\n              intersectionObserver.current.observe(container.current);\n            }\n          }\n\n          onRender?.();\n          if (eventListener) {\n            animationInstance.current.addEventListener(eventListener.name, eventListener.callback);\n          }\n        }\n      } catch (error) {\n        throw Error(`Error loading Lottie animation: ${error}`);\n      }\n    };\n\n    loadAnimation();\n\n    return () => {\n      if (animationInstance.current) {\n        if (eventListener) {\n          animationInstance.current.removeEventListener(eventListener.name, eventListener.callback);\n        }\n\n        if (animateOnIntersect) {\n          intersectionObserver.current?.disconnect();\n        }\n        animationInstance.current.destroy();\n      }\n    };\n  }, [src, eventListener, onRender, animateOnIntersect, settings]);\n\n  return <FlexView ref={container} $width={width} $height={height} />;\n});\n\nexport default memo(LottieAnimation);\n"],"names":["LottieAnimation","forwardRef","props","ref","src","width","height","settings","eventListener","onRender","animateOnIntersect","container","useRef","animationInstance","intersectionObserver","useImperativeHandle","segments","forceFlag","useEffect","animationData","fetchLottie","lottie","entry","_a","_b","error","FlexView","LottieAnimation$1","memo"],"mappings":";;;;;AASA,MAAMA,IAAkBC,EAAuD,CAACC,GAAOC,MAAQ;AACvF,QAAA;AAAA,IACJ,KAAAC;AAAA,IACA,OAAAC,IAAQ;AAAA,IACR,QAAAC,IAAS;AAAA,IACT,UAAAC;AAAA,IACA,eAAAC;AAAA,IACA,UAAAC;AAAA,IACA,oBAAAC;AAAA,EAAA,IACER,GAEES,IAAYC,EAAuB,IAAI,GACvCC,IAAoBD,EAA6B,IAAI,GACrDE,IAAuBF,EAAoC,IAAI;AAErE,SAAAG;AAAA,IACEZ;AAAA,IACA,OAAO;AAAA,MACL,cAAc,CAACa,GAA4BC,MAAwB;AACjE,QAAIJ,EAAkB,WACFA,EAAA,QAAQ,aAAaG,GAAUC,CAAS;AAAA,MAC5D;AAAA,IACF;AAAA,IAEF,CAAA;AAAA,EACF,GAEAC,EAAU,QACc,YAAY;AAC5B,QAAA;AACI,YAAAC,IAAgB,MAAMC,EAAYhB,CAAG;AAE3C,MAAIO,EAAU,YACME,EAAA,UAAUQ,EAAO,cAAc;AAAA,QAC/C,WAAWV,EAAU;AAAA,QACrB,eAAAQ;AAAA,QACA,UAAU;AAAA,QACV,MAAM;AAAA,QACN,UAAU;AAAA,QACV,GAAGZ;AAAA,MAAA,CACJ,GAEGG,MACFI,EAAqB,UAAU,IAAI;AAAA,QACjC,CAAC,CAACQ,CAAK,MAAM;;AACP,UAAAA,KAASA,EAAM,kBACjBC,IAAAV,EAAkB,YAAlB,QAAAU,EAA2B,UAE3BC,IAAAX,EAAkB,YAAlB,QAAAW,EAA2B;AAAA,QAE/B;AAAA,QACA,EAAE,WAAW,EAAE;AAAA,MACjB,GAEIb,EAAU,WACSG,EAAA,QAAQ,QAAQH,EAAU,OAAO,IAI/CF,KAAA,QAAAA,KACPD,KACFK,EAAkB,QAAQ,iBAAiBL,EAAc,MAAMA,EAAc,QAAQ;AAAA,aAGlFiB,GAAO;AACR,YAAA,MAAM,mCAAmCA,CAAK,EAAE;AAAA,IAAA;AAAA,EAE1D,GAEc,GAEP,MAAM;;AACX,IAAIZ,EAAkB,YAChBL,KACFK,EAAkB,QAAQ,oBAAoBL,EAAc,MAAMA,EAAc,QAAQ,GAGtFE,OACFa,IAAAT,EAAqB,YAArB,QAAAS,EAA8B,eAEhCV,EAAkB,QAAQ,QAAQ;AAAA,EAEtC,IACC,CAACT,GAAKI,GAAeC,GAAUC,GAAoBH,CAAQ,CAAC,qBAEvDmB,GAAS,EAAA,KAAKf,GAAW,QAAQN,GAAO,SAASC,GAAQ;AACnE,CAAC,GAEcqB,IAAAC,EAAK5B,CAAe;"}

package/dist/features/ui/nudge/nudge.js

@@ -1,17 +1,17 @@
-import { jsxs as n, jsx as t } from "react/jsx-runtime";
-import { LOTTIE as d } from "../../../assets/lottie/lottie.js";
-import m from "../lottie-animation/lottie-animation.js";
-import { NudgeWrapper as p, NudgeLottieContainer as s } from "./nudge-styled.js";
-const f = ({
+import { jsxs as m, jsx as t } from "react/jsx-runtime";
+import { LOTTIE as n } from "../../../assets/lottie/lottie.js";
+import d from "../lottie-animation/lottie-animation.js";
+import { NudgeWrapper as p, NudgeLottieContainer as f } from "./nudge-styled.js";
+const $ = ({
   content: r,
   nudgePointerX: e = 0,
   nudgePointerY: o = 0,
   zIndex: i = 100
-}) => /* @__PURE__ */ n(p, { $top: o, $left: e, $zIndex: i, children: [
-  /* @__PURE__ */ t(s, { $height: 64, $width: 64, children: /* @__PURE__ */ t(m, { src: d.NUDGE_TAP }) }),
+}) => /* @__PURE__ */ m(p, { $top: o, $left: e, $zIndex: i, children: [
+  /* @__PURE__ */ t(f, { $height: 64, $width: 64, children: /* @__PURE__ */ t(d, { src: n.NUDGE_TAP }) }),
   r
-] }), g = f;
+] });
 export {
-  g as default
+  $ as default
 };
 //# sourceMappingURL=nudge.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"nudge.js","sources":["../../../../src/features/ui/nudge/nudge.tsx"],"sourcesContent":["import type { INudgeProps } from './nudge-types';\n\nimport React from 'react';\n\nimport { LOTTIE } from '../../../assets/lottie/lottie';\nimport LottieAnimation from '../lottie-animation/lottie-animation';\nimport * as S from './nudge-styled';\n\nconst Nudge: React.FC<INudgeProps> = ({\n  content,\n  nudgePointerX = 0,\n  nudgePointerY = 0,\n  zIndex = 100,\n}) => {\n  return (\n    <S.NudgeWrapper $top={nudgePointerY} $left={nudgePointerX} $zIndex={zIndex}>\n      <S.NudgeLottieContainer $height={64} $width={64}>\n        <LottieAnimation src={LOTTIE.NUDGE_TAP} />\n      </S.NudgeLottieContainer>\n      {content}\n    </S.NudgeWrapper>\n  );\n};\n\nexport default Nudge;\n"],"names":["Nudge","content","nudgePointerX","nudgePointerY","zIndex","jsxs","S.NudgeWrapper","jsx","S.NudgeLottieContainer","LottieAnimation","LOTTIE","Nudge$1"],"mappings":";;;;AAQA,MAAMA,IAA+B,CAAC;AAAA,EACpC,SAAAC;AAAA,EACA,eAAAC,IAAgB;AAAA,EAChB,eAAAC,IAAgB;AAAA,EAChB,QAAAC,IAAS;AACX,MAEI,gBAAAC,EAACC,GAAA,EAAe,MAAMH,GAAe,OAAOD,GAAe,SAASE,GAClE,UAAA;AAAA,EAAA,gBAAAG,EAACC,GAAA,EAAuB,SAAS,IAAI,QAAQ,IAC3C,UAAA,gBAAAD,EAACE,GAAgB,EAAA,KAAKC,EAAO,UAAA,CAAW,EAC1C,CAAA;AAAA,EACCT;AACH,EAAA,CAAA,GAIJU,IAAeX;"}
+{"version":3,"file":"nudge.js","sources":["../../../../src/features/ui/nudge/nudge.tsx"],"sourcesContent":["import type { INudgeProps } from './nudge-types';\n\nimport React from 'react';\n\nimport { LOTTIE } from '../../../assets/lottie/lottie';\nimport LottieAnimation from '../lottie-animation/lottie-animation';\nimport * as S from './nudge-styled';\n\nconst Nudge: React.FC<INudgeProps> = ({\n  content,\n  nudgePointerX = 0,\n  nudgePointerY = 0,\n  zIndex = 100,\n}) => {\n  return (\n    <S.NudgeWrapper $top={nudgePointerY} $left={nudgePointerX} $zIndex={zIndex}>\n      <S.NudgeLottieContainer $height={64} $width={64}>\n        <LottieAnimation src={LOTTIE.NUDGE_TAP} />\n      </S.NudgeLottieContainer>\n      {content}\n    </S.NudgeWrapper>\n  );\n};\n\nexport default Nudge;\n"],"names":["Nudge","content","nudgePointerX","nudgePointerY","zIndex","jsxs","S.NudgeWrapper","jsx","S.NudgeLottieContainer","LottieAnimation","LOTTIE"],"mappings":";;;;AAQA,MAAMA,IAA+B,CAAC;AAAA,EACpC,SAAAC;AAAA,EACA,eAAAC,IAAgB;AAAA,EAChB,eAAAC,IAAgB;AAAA,EAChB,QAAAC,IAAS;AACX,MAEI,gBAAAC,EAACC,GAAA,EAAe,MAAMH,GAAe,OAAOD,GAAe,SAASE,GAClE,UAAA;AAAA,EAAA,gBAAAG,EAACC,GAAA,EAAuB,SAAS,IAAI,QAAQ,IAC3C,UAAA,gBAAAD,EAACE,GAAgB,EAAA,KAAKC,EAAO,UAAA,CAAW,EAC1C,CAAA;AAAA,EACCT;AAAA,GACH;"}

package/dist/features/ui/perfect-hits/perfect-hits-helpers.js

@@ -1,6 +1,6 @@
 import { LOTTIE as o } from "../../../assets/lottie/lottie.js";
 import { fetchLottie as a } from "../lottie-animation/helper.js";
-import { RANGE_SIZE as t, TIERS as e } from "./constants.js";
+import { TIERS as e, RANGE_SIZE as t } from "./constants.js";
 const s = {
   bronze_1: o.BRONZE_1,
   bronze_2: o.BRONZE_2,

package/dist/features/ui/perfect-hits/perfect-hits-helpers.js.map

@@ -1 +1 @@
-{"version":3,"file":"perfect-hits-helpers.js","sources":["../../../../src/features/ui/perfect-hits/perfect-hits-helpers.ts"],"sourcesContent":["import { LOTTIE } from '../../../assets/lottie/lottie';\nimport { fetchLottie } from '../lottie-animation/helper';\nimport { RANGE_SIZE, TIERS } from './constants';\n\ntype AnimationData = Record<string, unknown>;\n\nconst animationFilesMap: Record<string, string> = {\n  bronze_1: LOTTIE.BRONZE_1,\n  bronze_2: LOTTIE.BRONZE_2,\n  bronze_3: LOTTIE.BRONZE_3,\n  silver_1: LOTTIE.SILVER_1,\n  silver_2: LOTTIE.SILVER_2,\n  silver_3: LOTTIE.SILVER_3,\n  gold_1: LOTTIE.GOLD_1,\n  gold_2: LOTTIE.GOLD_2,\n  gold_3: LOTTIE.GOLD_3,\n  color_1: LOTTIE.COLOR_1,\n  color_2: LOTTIE.COLOR_2,\n  color_3: LOTTIE.COLOR_3,\n};\n\n/**\n * [0-4] => bronze_1\n * [5-9] => silver_1\n * [10-14] => gold_1\n * [15-19] => color_1\n * [20-24] => bronze_2\n * [25-29] => silver_2\n * [30-34] => gold_2\n * [35-39] => color_2\n * [40-44] => bronze_3\n * [45-49] => silver_3\n * [50-54] => gold_3\n * [55-59] => color_3\n * [>60] => color_3\n */\n\nasync function getAnimationFile(num: number): Promise<AnimationData | null> {\n  const setNumber = num >= RANGE_SIZE * 12 ? 3 : Math.floor(num / (TIERS.length * RANGE_SIZE)) + 1;\n\n  const tierIndex = Math.floor((num % (TIERS.length * RANGE_SIZE)) / RANGE_SIZE);\n  const tier = num >= RANGE_SIZE * 12 ? 'color' : TIERS[tierIndex];\n  const fileName = `${tier}_${setNumber}`;\n\n  const loadAnimationPath = animationFilesMap[fileName];\n\n  if (loadAnimationPath) {\n    try {\n      const lottieModule = await fetchLottie(loadAnimationPath);\n\n      return lottieModule;\n    } catch (error) {\n      return null;\n    }\n  }\n\n  return null;\n}\n\nexport { getAnimationFile, RANGE_SIZE };\n"],"names":["animationFilesMap","LOTTIE","getAnimationFile","num","setNumber","RANGE_SIZE","TIERS","tierIndex","fileName","loadAnimationPath","fetchLottie"],"mappings":";;;AAMA,MAAMA,IAA4C;AAAA,EAChD,UAAUC,EAAO;AAAA,EACjB,UAAUA,EAAO;AAAA,EACjB,UAAUA,EAAO;AAAA,EACjB,UAAUA,EAAO;AAAA,EACjB,UAAUA,EAAO;AAAA,EACjB,UAAUA,EAAO;AAAA,EACjB,QAAQA,EAAO;AAAA,EACf,QAAQA,EAAO;AAAA,EACf,QAAQA,EAAO;AAAA,EACf,SAASA,EAAO;AAAA,EAChB,SAASA,EAAO;AAAA,EAChB,SAASA,EAAO;AAClB;AAkBA,eAAeC,EAAiBC,GAA4C;AACpE,QAAAC,IAAYD,KAAOE,IAAa,KAAK,IAAI,KAAK,MAAMF,KAAOG,EAAM,SAASD,EAAW,IAAI,GAEzFE,IAAY,KAAK,MAAOJ,KAAOG,EAAM,SAASD,KAAeA,CAAU,GAEvEG,IAAW,GADJL,KAAOE,IAAa,KAAK,UAAUC,EAAMC,CAAS,CACvC,IAAIH,CAAS,IAE/BK,IAAoBT,EAAkBQ,CAAQ;AAEpD,MAAIC;AACE,QAAA;AAGK,aAFc,MAAMC,EAAYD,CAAiB;AAAA,YAG1C;AACP,aAAA;AAAA,IACT;AAGK,SAAA;AACT;"}
+{"version":3,"file":"perfect-hits-helpers.js","sources":["../../../../src/features/ui/perfect-hits/perfect-hits-helpers.ts"],"sourcesContent":["import { LOTTIE } from '../../../assets/lottie/lottie';\nimport { fetchLottie } from '../lottie-animation/helper';\nimport { RANGE_SIZE, TIERS } from './constants';\n\ntype AnimationData = Record<string, unknown>;\n\nconst animationFilesMap: Record<string, string> = {\n  bronze_1: LOTTIE.BRONZE_1,\n  bronze_2: LOTTIE.BRONZE_2,\n  bronze_3: LOTTIE.BRONZE_3,\n  silver_1: LOTTIE.SILVER_1,\n  silver_2: LOTTIE.SILVER_2,\n  silver_3: LOTTIE.SILVER_3,\n  gold_1: LOTTIE.GOLD_1,\n  gold_2: LOTTIE.GOLD_2,\n  gold_3: LOTTIE.GOLD_3,\n  color_1: LOTTIE.COLOR_1,\n  color_2: LOTTIE.COLOR_2,\n  color_3: LOTTIE.COLOR_3,\n};\n\n/**\n * [0-4] => bronze_1\n * [5-9] => silver_1\n * [10-14] => gold_1\n * [15-19] => color_1\n * [20-24] => bronze_2\n * [25-29] => silver_2\n * [30-34] => gold_2\n * [35-39] => color_2\n * [40-44] => bronze_3\n * [45-49] => silver_3\n * [50-54] => gold_3\n * [55-59] => color_3\n * [>60] => color_3\n */\n\nasync function getAnimationFile(num: number): Promise<AnimationData | null> {\n  const setNumber = num >= RANGE_SIZE * 12 ? 3 : Math.floor(num / (TIERS.length * RANGE_SIZE)) + 1;\n\n  const tierIndex = Math.floor((num % (TIERS.length * RANGE_SIZE)) / RANGE_SIZE);\n  const tier = num >= RANGE_SIZE * 12 ? 'color' : TIERS[tierIndex];\n  const fileName = `${tier}_${setNumber}`;\n\n  const loadAnimationPath = animationFilesMap[fileName];\n\n  if (loadAnimationPath) {\n    try {\n      const lottieModule = await fetchLottie(loadAnimationPath);\n\n      return lottieModule;\n    } catch (error) {\n      return null;\n    }\n  }\n\n  return null;\n}\n\nexport { getAnimationFile, RANGE_SIZE };\n"],"names":["animationFilesMap","LOTTIE","getAnimationFile","num","setNumber","RANGE_SIZE","TIERS","tierIndex","fileName","loadAnimationPath","fetchLottie"],"mappings":";;;AAMA,MAAMA,IAA4C;AAAA,EAChD,UAAUC,EAAO;AAAA,EACjB,UAAUA,EAAO;AAAA,EACjB,UAAUA,EAAO;AAAA,EACjB,UAAUA,EAAO;AAAA,EACjB,UAAUA,EAAO;AAAA,EACjB,UAAUA,EAAO;AAAA,EACjB,QAAQA,EAAO;AAAA,EACf,QAAQA,EAAO;AAAA,EACf,QAAQA,EAAO;AAAA,EACf,SAASA,EAAO;AAAA,EAChB,SAASA,EAAO;AAAA,EAChB,SAASA,EAAO;AAClB;AAkBA,eAAeC,EAAiBC,GAA4C;AACpE,QAAAC,IAAYD,KAAOE,IAAa,KAAK,IAAI,KAAK,MAAMF,KAAOG,EAAM,SAASD,EAAW,IAAI,GAEzFE,IAAY,KAAK,MAAOJ,KAAOG,EAAM,SAASD,KAAeA,CAAU,GAEvEG,IAAW,GADJL,KAAOE,IAAa,KAAK,UAAUC,EAAMC,CAAS,CACvC,IAAIH,CAAS,IAE/BK,IAAoBT,EAAkBQ,CAAQ;AAEpD,MAAIC;AACE,QAAA;AAGK,aAFc,MAAMC,EAAYD,CAAiB;AAAA,YAG1C;AACP,aAAA;AAAA,IAAA;AAIJ,SAAA;AACT;"}

package/dist/features/ui/perfect-hits/perfect-hits-styled.js

@@ -1,4 +1,4 @@
-import a, { keyframes as s, css as o } from "styled-components";
+import a, { css as o, keyframes as s } from "styled-components";
 import t from "../layout/flex-view.js";
 import e from "../text/text.js";
 const f = a(t)`

package/dist/features/ui/perfect-hits/perfect-hits.js.map

@@ -1 +1 @@
-{"version":3,"file":"perfect-hits.js","sources":["../../../../src/features/ui/perfect-hits/perfect-hits.tsx"],"sourcesContent":["import type { IPerfectHitsProps, TTextAnimationType } from './perfect-hits-types';\n\nimport lottieWeb, { type AnimationItem } from 'lottie-web';\nimport { memo, useCallback, useEffect, useRef, useState } from 'react';\n\nimport { RANGE_SIZE, getAnimationFile } from './perfect-hits-helpers';\nimport { Wrapper, AnimatedText, AnimationContainer } from './perfect-hits-styled';\n\nconst PerfectHits: React.FC<IPerfectHitsProps> = ({ value }) => {\n  const lottieContainer = useRef<HTMLDivElement | null>(null);\n  const lottieInstance = useRef<AnimationItem | null>(null);\n  const [textAnimationType, setTextAnimationType] = useState<TTextAnimationType>('reveal');\n  const [displayValue, setDisplayValue] = useState(value ?? 0);\n\n  const playAnimation = useCallback(\n    (num: number) => {\n      const isLevelChanged = num % RANGE_SIZE === 0;\n\n      if (isLevelChanged && lottieInstance.current) {\n        lottieInstance.current.playSegments([84, 117], true);\n        lottieInstance.current.addEventListener('complete', async () => {\n          if (lottieContainer.current) {\n            lottieInstance.current?.destroy();\n            const nextAnimationData = await getAnimationFile(num);\n\n            if (nextAnimationData) {\n              const nextInstance = lottieWeb.loadAnimation({\n                container: lottieContainer.current,\n                renderer: 'svg',\n                loop: false,\n                autoplay: false,\n                animationData: nextAnimationData,\n              });\n\n              lottieInstance.current = nextInstance;\n              lottieInstance.current.playSegments([0, 36], true);\n            }\n          }\n        });\n      } else {\n        lottieInstance.current?.playSegments([36, 83], true);\n      }\n    },\n    [lottieInstance],\n  );\n\n  const initializeAnimation = useCallback(async (num: number) => {\n    const animationData = await getAnimationFile(num);\n\n    if (animationData && lottieContainer.current) {\n      const instance = lottieWeb.loadAnimation({\n        container: lottieContainer.current,\n        renderer: 'svg',\n        loop: false,\n        autoplay: false,\n        animationData,\n      });\n\n      lottieInstance.current = instance;\n\n      lottieInstance.current.goToAndStop(36, true);\n    }\n  }, []);\n\n  useEffect(() => {\n    return () => {\n      if (lottieInstance.current) {\n        lottieInstance.current.destroy();\n      }\n    };\n  }, []);\n\n  useEffect(() => {\n    let timeoutId: NodeJS.Timeout | null = null;\n\n    if (value > 0 && lottieInstance.current) {\n      playAnimation(value);\n      setTextAnimationType('disappear');\n      timeoutId = setTimeout(() => {\n        setDisplayValue(value);\n        setTextAnimationType('reveal');\n      }, 1200);\n    } else if (!lottieInstance.current && value >= 0) {\n      setDisplayValue(value);\n      initializeAnimation(value);\n    }\n\n    return () => {\n      if (timeoutId) clearTimeout(timeoutId);\n    };\n  }, [value, playAnimation, initializeAnimation]);\n\n  return (\n    <Wrapper $flexDirection=\"row\" $alignItems=\"center\" $justifyContent=\"center\">\n      <AnimatedText $renderAs=\"h4\" $color=\"YELLOW_4\" $animationType={textAnimationType}>\n        {displayValue}\n      </AnimatedText>\n\n      <AnimationContainer ref={lottieContainer} $width={90} $height={55} />\n    </Wrapper>\n  );\n};\n\nexport default memo(PerfectHits);\n"],"names":["PerfectHits","value","lottieContainer","useRef","lottieInstance","textAnimationType","setTextAnimationType","useState","displayValue","setDisplayValue","playAnimation","useCallback","num","RANGE_SIZE","_a","nextAnimationData","getAnimationFile","nextInstance","lottieWeb","initializeAnimation","animationData","instance","useEffect","timeoutId","Wrapper","jsx","AnimatedText","AnimationContainer","perfectHits","memo"],"mappings":";;;;;;AAQA,MAAMA,IAA2C,CAAC,EAAE,OAAAC,QAAY;AACxD,QAAAC,IAAkBC,EAA8B,IAAI,GACpDC,IAAiBD,EAA6B,IAAI,GAClD,CAACE,GAAmBC,CAAoB,IAAIC,EAA6B,QAAQ,GACjF,CAACC,GAAcC,CAAe,IAAIF,EAASN,KAAS,CAAC,GAErDS,IAAgBC;AAAA,IACpB,CAACC,MAAgB;;AAGX,MAFmBA,IAAMC,MAAe,KAEtBT,EAAe,WACnCA,EAAe,QAAQ,aAAa,CAAC,IAAI,GAAG,GAAG,EAAI,GACpCA,EAAA,QAAQ,iBAAiB,YAAY,YAAY;;AAC9D,YAAIF,EAAgB,SAAS;AAC3B,WAAAY,IAAAV,EAAe,YAAf,QAAAU,EAAwB;AAClB,gBAAAC,IAAoB,MAAMC,EAAiBJ,CAAG;AAEpD,cAAIG,GAAmB;AACf,kBAAAE,IAAeC,EAAU,cAAc;AAAA,cAC3C,WAAWhB,EAAgB;AAAA,cAC3B,UAAU;AAAA,cACV,MAAM;AAAA,cACN,UAAU;AAAA,cACV,eAAea;AAAA,YAAA,CAChB;AAED,YAAAX,EAAe,UAAUa,GACzBb,EAAe,QAAQ,aAAa,CAAC,GAAG,EAAE,GAAG,EAAI;AAAA,UACnD;AAAA,QACF;AAAA,MAAA,CACD,MAEDU,IAAAV,EAAe,YAAf,QAAAU,EAAwB,aAAa,CAAC,IAAI,EAAE,GAAG;AAAA,IAEnD;AAAA,IACA,CAACV,CAAc;AAAA,EAAA,GAGXe,IAAsBR,EAAY,OAAOC,MAAgB;AACvD,UAAAQ,IAAgB,MAAMJ,EAAiBJ,CAAG;AAE5C,QAAAQ,KAAiBlB,EAAgB,SAAS;AACtC,YAAAmB,IAAWH,EAAU,cAAc;AAAA,QACvC,WAAWhB,EAAgB;AAAA,QAC3B,UAAU;AAAA,QACV,MAAM;AAAA,QACN,UAAU;AAAA,QACV,eAAAkB;AAAA,MAAA,CACD;AAED,MAAAhB,EAAe,UAAUiB,GAEVjB,EAAA,QAAQ,YAAY,IAAI,EAAI;AAAA,IAC7C;AAAA,EACF,GAAG,CAAE,CAAA;AAEL,SAAAkB,EAAU,MACD,MAAM;AACX,IAAIlB,EAAe,WACjBA,EAAe,QAAQ;EACzB,GAED,CAAE,CAAA,GAELkB,EAAU,MAAM;AACd,QAAIC,IAAmC;AAEnC,WAAAtB,IAAQ,KAAKG,EAAe,WAC9BM,EAAcT,CAAK,GACnBK,EAAqB,WAAW,GAChCiB,IAAY,WAAW,MAAM;AAC3B,MAAAd,EAAgBR,CAAK,GACrBK,EAAqB,QAAQ;AAAA,OAC5B,IAAI,KACE,CAACF,EAAe,WAAWH,KAAS,MAC7CQ,EAAgBR,CAAK,GACrBkB,EAAoBlB,CAAK,IAGpB,MAAM;AACP,MAAAsB,kBAAwBA,CAAS;AAAA,IAAA;AAAA,EAEtC,GAAA,CAACtB,GAAOS,GAAeS,CAAmB,CAAC,qBAG3CK,GAAQ,EAAA,gBAAe,OAAM,aAAY,UAAS,iBAAgB,UACjE,UAAA;AAAA,IAAA,gBAAAC,EAACC,KAAa,WAAU,MAAK,QAAO,YAAW,gBAAgBrB,GAC5D,UACHG,EAAA,CAAA;AAAA,sBAECmB,GAAmB,EAAA,KAAKzB,GAAiB,QAAQ,IAAI,SAAS,IAAI;AAAA,EACrE,EAAA,CAAA;AAEJ,GAEe0B,IAAAC,EAAK7B,CAAW;"}
+{"version":3,"file":"perfect-hits.js","sources":["../../../../src/features/ui/perfect-hits/perfect-hits.tsx"],"sourcesContent":["import type { IPerfectHitsProps, TTextAnimationType } from './perfect-hits-types';\n\nimport lottieWeb, { type AnimationItem } from 'lottie-web';\nimport { memo, useCallback, useEffect, useRef, useState } from 'react';\n\nimport { RANGE_SIZE, getAnimationFile } from './perfect-hits-helpers';\nimport { Wrapper, AnimatedText, AnimationContainer } from './perfect-hits-styled';\n\nconst PerfectHits: React.FC<IPerfectHitsProps> = ({ value }) => {\n  const lottieContainer = useRef<HTMLDivElement | null>(null);\n  const lottieInstance = useRef<AnimationItem | null>(null);\n  const [textAnimationType, setTextAnimationType] = useState<TTextAnimationType>('reveal');\n  const [displayValue, setDisplayValue] = useState(value ?? 0);\n\n  const playAnimation = useCallback(\n    (num: number) => {\n      const isLevelChanged = num % RANGE_SIZE === 0;\n\n      if (isLevelChanged && lottieInstance.current) {\n        lottieInstance.current.playSegments([84, 117], true);\n        lottieInstance.current.addEventListener('complete', async () => {\n          if (lottieContainer.current) {\n            lottieInstance.current?.destroy();\n            const nextAnimationData = await getAnimationFile(num);\n\n            if (nextAnimationData) {\n              const nextInstance = lottieWeb.loadAnimation({\n                container: lottieContainer.current,\n                renderer: 'svg',\n                loop: false,\n                autoplay: false,\n                animationData: nextAnimationData,\n              });\n\n              lottieInstance.current = nextInstance;\n              lottieInstance.current.playSegments([0, 36], true);\n            }\n          }\n        });\n      } else {\n        lottieInstance.current?.playSegments([36, 83], true);\n      }\n    },\n    [lottieInstance],\n  );\n\n  const initializeAnimation = useCallback(async (num: number) => {\n    const animationData = await getAnimationFile(num);\n\n    if (animationData && lottieContainer.current) {\n      const instance = lottieWeb.loadAnimation({\n        container: lottieContainer.current,\n        renderer: 'svg',\n        loop: false,\n        autoplay: false,\n        animationData,\n      });\n\n      lottieInstance.current = instance;\n\n      lottieInstance.current.goToAndStop(36, true);\n    }\n  }, []);\n\n  useEffect(() => {\n    return () => {\n      if (lottieInstance.current) {\n        lottieInstance.current.destroy();\n      }\n    };\n  }, []);\n\n  useEffect(() => {\n    let timeoutId: NodeJS.Timeout | null = null;\n\n    if (value > 0 && lottieInstance.current) {\n      playAnimation(value);\n      setTextAnimationType('disappear');\n      timeoutId = setTimeout(() => {\n        setDisplayValue(value);\n        setTextAnimationType('reveal');\n      }, 1200);\n    } else if (!lottieInstance.current && value >= 0) {\n      setDisplayValue(value);\n      initializeAnimation(value);\n    }\n\n    return () => {\n      if (timeoutId) clearTimeout(timeoutId);\n    };\n  }, [value, playAnimation, initializeAnimation]);\n\n  return (\n    <Wrapper $flexDirection=\"row\" $alignItems=\"center\" $justifyContent=\"center\">\n      <AnimatedText $renderAs=\"h4\" $color=\"YELLOW_4\" $animationType={textAnimationType}>\n        {displayValue}\n      </AnimatedText>\n\n      <AnimationContainer ref={lottieContainer} $width={90} $height={55} />\n    </Wrapper>\n  );\n};\n\nexport default memo(PerfectHits);\n"],"names":["PerfectHits","value","lottieContainer","useRef","lottieInstance","textAnimationType","setTextAnimationType","useState","displayValue","setDisplayValue","playAnimation","useCallback","num","RANGE_SIZE","_a","nextAnimationData","getAnimationFile","nextInstance","lottieWeb","initializeAnimation","animationData","instance","useEffect","timeoutId","Wrapper","jsx","AnimatedText","AnimationContainer","perfectHits","memo"],"mappings":";;;;;;AAQA,MAAMA,IAA2C,CAAC,EAAE,OAAAC,QAAY;AACxD,QAAAC,IAAkBC,EAA8B,IAAI,GACpDC,IAAiBD,EAA6B,IAAI,GAClD,CAACE,GAAmBC,CAAoB,IAAIC,EAA6B,QAAQ,GACjF,CAACC,GAAcC,CAAe,IAAIF,EAASN,KAAS,CAAC,GAErDS,IAAgBC;AAAA,IACpB,CAACC,MAAgB;;AAGX,MAFmBA,IAAMC,MAAe,KAEtBT,EAAe,WACnCA,EAAe,QAAQ,aAAa,CAAC,IAAI,GAAG,GAAG,EAAI,GACpCA,EAAA,QAAQ,iBAAiB,YAAY,YAAY;;AAC9D,YAAIF,EAAgB,SAAS;AAC3B,WAAAY,IAAAV,EAAe,YAAf,QAAAU,EAAwB;AAClB,gBAAAC,IAAoB,MAAMC,EAAiBJ,CAAG;AAEpD,cAAIG,GAAmB;AACf,kBAAAE,IAAeC,EAAU,cAAc;AAAA,cAC3C,WAAWhB,EAAgB;AAAA,cAC3B,UAAU;AAAA,cACV,MAAM;AAAA,cACN,UAAU;AAAA,cACV,eAAea;AAAA,YAAA,CAChB;AAED,YAAAX,EAAe,UAAUa,GACzBb,EAAe,QAAQ,aAAa,CAAC,GAAG,EAAE,GAAG,EAAI;AAAA,UAAA;AAAA,QACnD;AAAA,MACF,CACD,MAEDU,IAAAV,EAAe,YAAf,QAAAU,EAAwB,aAAa,CAAC,IAAI,EAAE,GAAG;AAAA,IAEnD;AAAA,IACA,CAACV,CAAc;AAAA,EACjB,GAEMe,IAAsBR,EAAY,OAAOC,MAAgB;AACvD,UAAAQ,IAAgB,MAAMJ,EAAiBJ,CAAG;AAE5C,QAAAQ,KAAiBlB,EAAgB,SAAS;AACtC,YAAAmB,IAAWH,EAAU,cAAc;AAAA,QACvC,WAAWhB,EAAgB;AAAA,QAC3B,UAAU;AAAA,QACV,MAAM;AAAA,QACN,UAAU;AAAA,QACV,eAAAkB;AAAA,MAAA,CACD;AAED,MAAAhB,EAAe,UAAUiB,GAEVjB,EAAA,QAAQ,YAAY,IAAI,EAAI;AAAA,IAAA;AAAA,EAE/C,GAAG,EAAE;AAEL,SAAAkB,EAAU,MACD,MAAM;AACX,IAAIlB,EAAe,WACjBA,EAAe,QAAQ,QAAQ;AAAA,EAEnC,GACC,EAAE,GAELkB,EAAU,MAAM;AACd,QAAIC,IAAmC;AAEnC,WAAAtB,IAAQ,KAAKG,EAAe,WAC9BM,EAAcT,CAAK,GACnBK,EAAqB,WAAW,GAChCiB,IAAY,WAAW,MAAM;AAC3B,MAAAd,EAAgBR,CAAK,GACrBK,EAAqB,QAAQ;AAAA,OAC5B,IAAI,KACE,CAACF,EAAe,WAAWH,KAAS,MAC7CQ,EAAgBR,CAAK,GACrBkB,EAAoBlB,CAAK,IAGpB,MAAM;AACP,MAAAsB,kBAAwBA,CAAS;AAAA,IACvC;AAAA,EACC,GAAA,CAACtB,GAAOS,GAAeS,CAAmB,CAAC,qBAG3CK,GAAQ,EAAA,gBAAe,OAAM,aAAY,UAAS,iBAAgB,UACjE,UAAA;AAAA,IAAA,gBAAAC,EAACC,KAAa,WAAU,MAAK,QAAO,YAAW,gBAAgBrB,GAC5D,UACHG,EAAA,CAAA;AAAA,sBAECmB,GAAmB,EAAA,KAAKzB,GAAiB,QAAQ,IAAI,SAAS,GAAI,CAAA;AAAA,EAAA,GACrE;AAEJ,GAEe0B,IAAAC,EAAK7B,CAAW;"}

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

@@ -1 +1 @@
-{"version":3,"file":"radio-card-option-styled.js","sources":["../../../../../src/features/ui/radio-cards/radio-card-option/radio-card-option-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport FlexView from '../../layout/flex-view';\n\ninterface IRadioCardOptionWrapperProps {\n  $width?: string | number;\n  $widthX?: number;\n  $selected?: boolean;\n}\n\nconst RadioCardOptionWrapper = styled.div<IRadioCardOptionWrapperProps>(\n  ({ $width, $widthX, $selected, theme }) => {\n    const { BLACK, GREY_2, WHITE } = theme.colors;\n    const { gutter } = theme.layout;\n\n    return `\n      width: ${$width ?? 'auto'}${typeof $width === 'number' ? 'px' : ''};\n      ${$widthX ? `width: ${$widthX * theme.layout.gutter}px;` : ''}\n      padding: ${gutter}px;\n      background-color: ${WHITE};\n      border-radius: ${gutter * 0.5}px;\n\n      border-width: 1px;\n      border-color: ${$selected ? BLACK : GREY_2};\n      border-style: solid;\n      cursor: pointer;\n      position: relative;\n      \n      display: flex;\n      flex-direction: row;\n      flex-wrap: nowrap;\n      height: 100%; // To keep it attached with Dummy border.\n    `;\n  },\n);\n\ninterface IDummyBorderProps {\n  $selected?: boolean;\n}\n\nconst DummyBorder = styled.div<IDummyBorderProps>(({ $selected, theme }) => {\n  return `\n    border-radius: 9px;\n    border-width: 1px;\n    border-color: ${$selected ? theme.colors.BLACK : 'transparent'};\n    border-style: solid;\n  `;\n});\n\nconst RadioImageContainer = styled(FlexView)`\n  width: 100%;\n`;\n\nconst ImageWrapper = styled.div`\n  display: flex;\n  align-items: center;\n  justify-content: center;\n`;\n\ninterface IInputOptionCircleProps {\n  $size: number;\n  $innerCircle: boolean;\n}\n\nconst InputOptionCircle = styled.div<IInputOptionCircleProps>(({ theme, $size, $innerCircle }) => {\n  const { BLACK, WHITE } = theme.colors;\n  const { gutter } = theme.layout;\n\n  return `\n    position: relative;\n    flex-shrink: 0;\n    width: ${$size}px;\n    height: ${$size}px;\n    margin: ${gutter * 0.25}px;\n    border-radius: ${$size / 2}px;\n    background-color: ${$innerCircle ? BLACK : WHITE};\n    border-color: ${BLACK};\n    border-width: ${$innerCircle ? 0 : 2}px;\n    border-style: solid;\n  `;\n});\n\nconst InputOptionInnerCircle = styled.div`\n  inset: 0;\n  display: flex;\n  position: absolute;\n  align-items: center;\n  justify-content: center;\n`;\n\nexport {\n  RadioCardOptionWrapper,\n  RadioImageContainer,\n  ImageWrapper,\n  InputOptionCircle,\n  InputOptionInnerCircle,\n  DummyBorder,\n};\n"],"names":["RadioCardOptionWrapper","styled","$width","$widthX","$selected","theme","BLACK","GREY_2","WHITE","gutter","DummyBorder","RadioImageContainer","FlexView","ImageWrapper","InputOptionCircle","$size","$innerCircle","InputOptionInnerCircle"],"mappings":";;AAUA,MAAMA,IAAyBC,EAAO;AAAA,EACpC,CAAC,EAAE,QAAAC,GAAQ,SAAAC,GAAS,WAAAC,GAAW,OAAAC,QAAY;AACzC,UAAM,EAAE,OAAAC,GAAO,QAAAC,GAAQ,OAAAC,EAAA,IAAUH,EAAM,QACjC,EAAE,QAAAI,EAAO,IAAIJ,EAAM;AAElB,WAAA;AAAA,eACIH,KAAU,MAAM,GAAG,OAAOA,KAAW,WAAW,OAAO,EAAE;AAAA,QAChEC,IAAU,UAAUA,IAAUE,EAAM,OAAO,MAAM,QAAQ,EAAE;AAAA,iBAClDI,CAAM;AAAA,0BACGD,CAAK;AAAA,uBACRC,IAAS,GAAG;AAAA;AAAA;AAAA,sBAGbL,IAAYE,IAAQC,CAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAU9C;AACF,GAMMG,IAAcT,EAAO,IAAuB,CAAC,EAAE,WAAAG,GAAW,OAAAC,QACvD;AAAA;AAAA;AAAA,oBAGWD,IAAYC,EAAM,OAAO,QAAQ,aAAa;AAAA;AAAA,GAGjE,GAEKM,IAAsBV,EAAOW,CAAQ;AAAA;AAAA,GAIrCC,IAAeZ,EAAO;AAAA;AAAA;AAAA;AAAA,GAWtBa,IAAoBb,EAAO,IAA6B,CAAC,EAAE,OAAAI,GAAO,OAAAU,GAAO,cAAAC,QAAmB;AAChG,QAAM,EAAE,OAAAV,GAAO,OAAAE,MAAUH,EAAM,QACzB,EAAE,QAAAI,EAAO,IAAIJ,EAAM;AAElB,SAAA;AAAA;AAAA;AAAA,aAGIU,CAAK;AAAA,cACJA,CAAK;AAAA,cACLN,IAAS,IAAI;AAAA,qBACNM,IAAQ,CAAC;AAAA,wBACNC,IAAeV,IAAQE,CAAK;AAAA,oBAChCF,CAAK;AAAA,oBACLU,IAAe,IAAI,CAAC;AAAA;AAAA;AAGxC,CAAC,GAEKC,IAAyBhB,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}
+{"version":3,"file":"radio-card-option-styled.js","sources":["../../../../../src/features/ui/radio-cards/radio-card-option/radio-card-option-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport FlexView from '../../layout/flex-view';\n\ninterface IRadioCardOptionWrapperProps {\n  $width?: string | number;\n  $widthX?: number;\n  $selected?: boolean;\n}\n\nconst RadioCardOptionWrapper = styled.div<IRadioCardOptionWrapperProps>(\n  ({ $width, $widthX, $selected, theme }) => {\n    const { BLACK, GREY_2, WHITE } = theme.colors;\n    const { gutter } = theme.layout;\n\n    return `\n      width: ${$width ?? 'auto'}${typeof $width === 'number' ? 'px' : ''};\n      ${$widthX ? `width: ${$widthX * theme.layout.gutter}px;` : ''}\n      padding: ${gutter}px;\n      background-color: ${WHITE};\n      border-radius: ${gutter * 0.5}px;\n\n      border-width: 1px;\n      border-color: ${$selected ? BLACK : GREY_2};\n      border-style: solid;\n      cursor: pointer;\n      position: relative;\n      \n      display: flex;\n      flex-direction: row;\n      flex-wrap: nowrap;\n      height: 100%; // To keep it attached with Dummy border.\n    `;\n  },\n);\n\ninterface IDummyBorderProps {\n  $selected?: boolean;\n}\n\nconst DummyBorder = styled.div<IDummyBorderProps>(({ $selected, theme }) => {\n  return `\n    border-radius: 9px;\n    border-width: 1px;\n    border-color: ${$selected ? theme.colors.BLACK : 'transparent'};\n    border-style: solid;\n  `;\n});\n\nconst RadioImageContainer = styled(FlexView)`\n  width: 100%;\n`;\n\nconst ImageWrapper = styled.div`\n  display: flex;\n  align-items: center;\n  justify-content: center;\n`;\n\ninterface IInputOptionCircleProps {\n  $size: number;\n  $innerCircle: boolean;\n}\n\nconst InputOptionCircle = styled.div<IInputOptionCircleProps>(({ theme, $size, $innerCircle }) => {\n  const { BLACK, WHITE } = theme.colors;\n  const { gutter } = theme.layout;\n\n  return `\n    position: relative;\n    flex-shrink: 0;\n    width: ${$size}px;\n    height: ${$size}px;\n    margin: ${gutter * 0.25}px;\n    border-radius: ${$size / 2}px;\n    background-color: ${$innerCircle ? BLACK : WHITE};\n    border-color: ${BLACK};\n    border-width: ${$innerCircle ? 0 : 2}px;\n    border-style: solid;\n  `;\n});\n\nconst InputOptionInnerCircle = styled.div`\n  inset: 0;\n  display: flex;\n  position: absolute;\n  align-items: center;\n  justify-content: center;\n`;\n\nexport {\n  RadioCardOptionWrapper,\n  RadioImageContainer,\n  ImageWrapper,\n  InputOptionCircle,\n  InputOptionInnerCircle,\n  DummyBorder,\n};\n"],"names":["RadioCardOptionWrapper","styled","$width","$widthX","$selected","theme","BLACK","GREY_2","WHITE","gutter","DummyBorder","RadioImageContainer","FlexView","ImageWrapper","InputOptionCircle","$size","$innerCircle","InputOptionInnerCircle"],"mappings":";;AAUA,MAAMA,IAAyBC,EAAO;AAAA,EACpC,CAAC,EAAE,QAAAC,GAAQ,SAAAC,GAAS,WAAAC,GAAW,OAAAC,QAAY;AACzC,UAAM,EAAE,OAAAC,GAAO,QAAAC,GAAQ,OAAAC,MAAUH,EAAM,QACjC,EAAE,QAAAI,MAAWJ,EAAM;AAElB,WAAA;AAAA,eACIH,KAAU,MAAM,GAAG,OAAOA,KAAW,WAAW,OAAO,EAAE;AAAA,QAChEC,IAAU,UAAUA,IAAUE,EAAM,OAAO,MAAM,QAAQ,EAAE;AAAA,iBAClDI,CAAM;AAAA,0BACGD,CAAK;AAAA,uBACRC,IAAS,GAAG;AAAA;AAAA;AAAA,sBAGbL,IAAYE,IAAQC,CAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAA;AAWhD,GAMMG,IAAcT,EAAO,IAAuB,CAAC,EAAE,WAAAG,GAAW,OAAAC,QACvD;AAAA;AAAA;AAAA,oBAGWD,IAAYC,EAAM,OAAO,QAAQ,aAAa;AAAA;AAAA,GAGjE,GAEKM,IAAsBV,EAAOW,CAAQ;AAAA;AAAA,GAIrCC,IAAeZ,EAAO;AAAA;AAAA;AAAA;AAAA,GAWtBa,IAAoBb,EAAO,IAA6B,CAAC,EAAE,OAAAI,GAAO,OAAAU,GAAO,cAAAC,QAAmB;AAChG,QAAM,EAAE,OAAAV,GAAO,OAAAE,EAAM,IAAIH,EAAM,QACzB,EAAE,QAAAI,MAAWJ,EAAM;AAElB,SAAA;AAAA;AAAA;AAAA,aAGIU,CAAK;AAAA,cACJA,CAAK;AAAA,cACLN,IAAS,IAAI;AAAA,qBACNM,IAAQ,CAAC;AAAA,wBACNC,IAAeV,IAAQE,CAAK;AAAA,oBAChCF,CAAK;AAAA,oBACLU,IAAe,IAAI,CAAC;AAAA;AAAA;AAGxC,CAAC,GAEKC,IAAyBhB,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}

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 type { IRadioCardOptionProps } from './radio-card-option-types';\n\nimport { 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';\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=\"h6\">{title}</Text>\n            {description && (\n              <Text $renderAs=\"body2\" $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":";;;;;;;AAUA,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,MAAM,UAAMxB,GAAA;AAAA,gBAC3BC,KACE,gBAAAgB,EAAAO,GAAA,EAAK,WAAU,SAAQ,QAAO,YAC5B,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 type { IRadioCardOptionProps } from './radio-card-option-types';\n\nimport { 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';\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=\"h6\">{title}</Text>\n            {description && (\n              <Text $renderAs=\"body2\" $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":";;;;;;;AAUA,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,EAAS,GACjB,EAAE,QAAAC,MAAWF,EAAM,QAEnBG,IAAiBC,EAAmB,EAAE,gBAAAP,GAAgB,gBAAAC,GAAgB,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,MAAM,UAAMxB,GAAA;AAAA,gBAC3BC,KACE,gBAAAgB,EAAAO,GAAA,EAAK,WAAU,SAAQ,QAAO,YAC5B,UACHvB,EAAA,CAAA;AAAA,cAAA,EAEJ,CAAA;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,IAAM,EAAA,CACrE,EAEJ,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,GAEJ;AAEJ;"}

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

@@ -1,36 +1,36 @@
-import { jsx as o } from "react/jsx-runtime";
+import { jsx as e } from "react/jsx-runtime";
 import x from "../layout/flex-view.js";
 import u from "./radio-card-option/radio-card-option.js";
-const $ = ({
-  options: e,
+const C = ({
+  options: o,
   value: t,
   width: i,
   widthX: a,
   onChange: d,
   analyticsLabel: n,
-  analyticsProps: c,
-  horizontalCard: p
-}) => /* @__PURE__ */ o(x, { $flexWrap: !0, $flexDirection: "row", $flexGapX: 1, children: e.map((s) => {
-  const { title: f, Icon: l, description: m, id: r } = s;
-  return /* @__PURE__ */ o(
+  analyticsProps: p,
+  horizontalCard: c
+}) => /* @__PURE__ */ e(x, { $flexWrap: !0, $flexDirection: "row", $flexGapX: 1, children: o.map((f) => {
+  const { title: l, Icon: m, description: s, id: r } = f;
+  return /* @__PURE__ */ e(
     u,
     {
-      title: f,
-      description: m,
+      title: l,
+      description: s,
       checked: t === r,
-      Icon: l,
+      Icon: m,
       id: r,
       onChange: d,
       width: i,
       widthX: a,
       analyticsLabel: n,
-      analyticsProps: c,
-      horizontalCard: p
+      analyticsProps: p,
+      horizontalCard: c
     },
     r
   );
-}) }), w = $;
+}) });
 export {
-  w as default
+  C as default
 };
 //# sourceMappingURL=radio-cards.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"radio-cards.js","sources":["../../../../src/features/ui/radio-cards/radio-cards.tsx"],"sourcesContent":["import type { IRadioCardListProps } from './radio-cards-types';\n\nimport FlexView from '../layout/flex-view';\nimport RadioCardOption from './radio-card-option/radio-card-option';\n\nconst RadioCards = <IDType extends string | number>({\n  options,\n  value,\n  width,\n  widthX,\n  onChange,\n  analyticsLabel,\n  analyticsProps,\n  horizontalCard,\n}: IRadioCardListProps<IDType>) => {\n  return (\n    <FlexView $flexWrap $flexDirection=\"row\" $flexGapX={1}>\n      {options.map(option => {\n        const { title, Icon, description, id } = option;\n\n        return (\n          <RadioCardOption<IDType>\n            key={id}\n            title={title}\n            description={description}\n            checked={value === id}\n            Icon={Icon}\n            id={id}\n            onChange={onChange}\n            width={width}\n            widthX={widthX}\n            analyticsLabel={analyticsLabel}\n            analyticsProps={analyticsProps}\n            horizontalCard={horizontalCard}\n          />\n        );\n      })}\n    </FlexView>\n  );\n};\n\nexport default RadioCards;\n"],"names":["RadioCards","options","value","width","widthX","onChange","analyticsLabel","analyticsProps","horizontalCard","jsx","FlexView","option","title","Icon","description","id","RadioCardOption","RadioCards$1"],"mappings":";;;AAKA,MAAMA,IAAa,CAAiC;AAAA,EAClD,SAAAC;AAAA,EACA,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,gBAAAC;AACF,MAEI,gBAAAC,EAACC,GAAS,EAAA,WAAS,IAAC,gBAAe,OAAM,WAAW,GACjD,UAAQT,EAAA,IAAI,CAAUU,MAAA;AACrB,QAAM,EAAE,OAAAC,GAAO,MAAAC,GAAM,aAAAC,GAAa,IAAAC,MAAOJ;AAGvC,SAAA,gBAAAF;AAAA,IAACO;AAAA,IAAA;AAAA,MAEC,OAAAJ;AAAA,MACA,aAAAE;AAAA,MACA,SAASZ,MAAUa;AAAA,MACnB,MAAAF;AAAA,MACA,IAAAE;AAAA,MACA,UAAAV;AAAA,MACA,OAAAF;AAAA,MACA,QAAAC;AAAA,MACA,gBAAAE;AAAA,MACA,gBAAAC;AAAA,MACA,gBAAAC;AAAA,IAAA;AAAA,IAXKO;AAAA,EAAA;AAcV,CAAA,EACH,CAAA,GAIJE,IAAejB;"}
+{"version":3,"file":"radio-cards.js","sources":["../../../../src/features/ui/radio-cards/radio-cards.tsx"],"sourcesContent":["import type { IRadioCardListProps } from './radio-cards-types';\n\nimport FlexView from '../layout/flex-view';\nimport RadioCardOption from './radio-card-option/radio-card-option';\n\nconst RadioCards = <IDType extends string | number>({\n  options,\n  value,\n  width,\n  widthX,\n  onChange,\n  analyticsLabel,\n  analyticsProps,\n  horizontalCard,\n}: IRadioCardListProps<IDType>) => {\n  return (\n    <FlexView $flexWrap $flexDirection=\"row\" $flexGapX={1}>\n      {options.map(option => {\n        const { title, Icon, description, id } = option;\n\n        return (\n          <RadioCardOption<IDType>\n            key={id}\n            title={title}\n            description={description}\n            checked={value === id}\n            Icon={Icon}\n            id={id}\n            onChange={onChange}\n            width={width}\n            widthX={widthX}\n            analyticsLabel={analyticsLabel}\n            analyticsProps={analyticsProps}\n            horizontalCard={horizontalCard}\n          />\n        );\n      })}\n    </FlexView>\n  );\n};\n\nexport default RadioCards;\n"],"names":["RadioCards","options","value","width","widthX","onChange","analyticsLabel","analyticsProps","horizontalCard","jsx","FlexView","option","title","Icon","description","id","RadioCardOption"],"mappings":";;;AAKA,MAAMA,IAAa,CAAiC;AAAA,EAClD,SAAAC;AAAA,EACA,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,gBAAAC;AACF,MAEI,gBAAAC,EAACC,GAAS,EAAA,WAAS,IAAC,gBAAe,OAAM,WAAW,GACjD,UAAQT,EAAA,IAAI,CAAUU,MAAA;AACrB,QAAM,EAAE,OAAAC,GAAO,MAAAC,GAAM,aAAAC,GAAa,IAAAC,EAAO,IAAAJ;AAGvC,SAAA,gBAAAF;AAAA,IAACO;AAAA,IAAA;AAAA,MAEC,OAAAJ;AAAA,MACA,aAAAE;AAAA,MACA,SAASZ,MAAUa;AAAA,MACnB,MAAAF;AAAA,MACA,IAAAE;AAAA,MACA,UAAAV;AAAA,MACA,OAAAF;AAAA,MACA,QAAAC;AAAA,MACA,gBAAAE;AAAA,MACA,gBAAAC;AAAA,MACA,gBAAAC;AAAA,IAAA;AAAA,IAXKO;AAAA,EAYP;AAEH,CAAA,GACH;"}

package/dist/features/ui/section-list/section-list.js

@@ -1,17 +1,17 @@
 import { jsx as t, Fragment as p, jsxs as $ } from "react/jsx-runtime";
-import { memo as f, Fragment as c } from "react";
+import { memo as f, Fragment as m } from "react";
 import h from "../layout/flex-view.js";
-const u = (m) => {
-  const { data: i, renderSectionHeader: n, renderItem: s, keyExtractor: o } = m;
-  return /* @__PURE__ */ t(p, { children: i.map((r, d) => /* @__PURE__ */ $(h, { children: [
+const u = (c) => {
+  const { data: d, renderSectionHeader: n, renderItem: i, keyExtractor: o } = c;
+  return /* @__PURE__ */ t(p, { children: d.map((r, s) => /* @__PURE__ */ $(h, { children: [
     n && n(r),
-    /* @__PURE__ */ t(c, { children: r.data.map((e, a) => {
+    /* @__PURE__ */ t(m, { children: r.data.map((e, a) => {
       const l = o ? o(e, a) : `${e}_${a}`;
-      return /* @__PURE__ */ t(c, { children: s(e) }, l);
+      return /* @__PURE__ */ t(m, { children: i(e) }, l);
     }) })
-  ] }, `${r.title}_${d}`)) });
-}, x = f(u), L = x;
+  ] }, `${r.title}_${s}`)) });
+}, S = f(u);
 export {
-  L as default
+  S as default
 };
 //# sourceMappingURL=section-list.js.map

package/dist/features/ui/section-list/section-list.js.map

@@ -1 +1 @@
-{"version":3,"file":"section-list.js","sources":["../../../../src/features/ui/section-list/section-list.tsx"],"sourcesContent":["import type { ISectionList, TDefaultSection } from './section-list-types';\n\nimport { Fragment, memo } from 'react';\n\nimport FlexView from '../layout/flex-view';\n\nconst SectionListComponent = <Section extends string | number | TDefaultSection>(\n  props: ISectionList<Section>,\n): JSX.Element => {\n  const { data, renderSectionHeader, renderItem, keyExtractor } = props;\n\n  return (\n    <>\n      {data.map((section, idx) => {\n        return (\n          <FlexView key={`${section.title}_${idx}`}>\n            {renderSectionHeader && renderSectionHeader(section)}\n\n            <Fragment>\n              {section.data.map((item, itemIdx) => {\n                const key = keyExtractor ? keyExtractor(item, itemIdx) : `${item}_${itemIdx}`;\n\n                return <Fragment key={key}>{renderItem(item)}</Fragment>;\n              })}\n            </Fragment>\n          </FlexView>\n        );\n      })}\n    </>\n  );\n};\n\nconst SelectionList = memo(SectionListComponent) as <\n  Section extends string | number | TDefaultSection,\n>(\n  props: ISectionList<Section>,\n) => JSX.Element;\n\nexport default SelectionList;\n"],"names":["SectionListComponent","props","data","renderSectionHeader","renderItem","keyExtractor","jsx","Fragment","section","idx","FlexView","item","itemIdx","key","SelectionList","memo","SectionList"],"mappings":";;;AAMA,MAAMA,IAAuB,CAC3BC,MACgB;AAChB,QAAM,EAAE,MAAAC,GAAM,qBAAAC,GAAqB,YAAAC,GAAY,cAAAC,MAAiBJ;AAEhE,SAEK,gBAAAK,EAAAC,GAAA,EAAA,UAAAL,EAAK,IAAI,CAACM,GAASC,wBAEfC,GACE,EAAA,UAAA;AAAA,IAAAP,KAAuBA,EAAoBK,CAAO;AAAA,IAEnD,gBAAAF,EAACC,GAAA,EACE,UAAAC,EAAQ,KAAK,IAAI,CAACG,GAAMC,MAAY;AAC7B,YAAAC,IAAMR,IAAeA,EAAaM,GAAMC,CAAO,IAAI,GAAGD,CAAI,IAAIC,CAAO;AAE3E,+BAAQL,GAAA,EAAoB,UAAWH,EAAAO,CAAI,KAArBE,CAAuB;AAAA,IAC9C,CAAA,GACH;AAAA,EAAA,EAAA,GATa,GAAGL,EAAQ,KAAK,IAAIC,CAAG,EAUtC,CAEH,EACH,CAAA;AAEJ,GAEMK,IAAgBC,EAAKf,CAAoB,GAM/CgB,IAAeF;"}
+{"version":3,"file":"section-list.js","sources":["../../../../src/features/ui/section-list/section-list.tsx"],"sourcesContent":["import type { ISectionList, TDefaultSection } from './section-list-types';\n\nimport { Fragment, memo } from 'react';\n\nimport FlexView from '../layout/flex-view';\n\nconst SectionListComponent = <Section extends string | number | TDefaultSection>(\n  props: ISectionList<Section>,\n): JSX.Element => {\n  const { data, renderSectionHeader, renderItem, keyExtractor } = props;\n\n  return (\n    <>\n      {data.map((section, idx) => {\n        return (\n          <FlexView key={`${section.title}_${idx}`}>\n            {renderSectionHeader && renderSectionHeader(section)}\n\n            <Fragment>\n              {section.data.map((item, itemIdx) => {\n                const key = keyExtractor ? keyExtractor(item, itemIdx) : `${item}_${itemIdx}`;\n\n                return <Fragment key={key}>{renderItem(item)}</Fragment>;\n              })}\n            </Fragment>\n          </FlexView>\n        );\n      })}\n    </>\n  );\n};\n\nconst SelectionList = memo(SectionListComponent) as <\n  Section extends string | number | TDefaultSection,\n>(\n  props: ISectionList<Section>,\n) => JSX.Element;\n\nexport default SelectionList;\n"],"names":["SectionListComponent","props","data","renderSectionHeader","renderItem","keyExtractor","jsx","Fragment","section","idx","FlexView","item","itemIdx","key","SelectionList","memo"],"mappings":";;;AAMA,MAAMA,IAAuB,CAC3BC,MACgB;AAChB,QAAM,EAAE,MAAAC,GAAM,qBAAAC,GAAqB,YAAAC,GAAY,cAAAC,EAAiB,IAAAJ;AAEhE,SAEK,gBAAAK,EAAAC,GAAA,EAAA,UAAAL,EAAK,IAAI,CAACM,GAASC,wBAEfC,GACE,EAAA,UAAA;AAAA,IAAAP,KAAuBA,EAAoBK,CAAO;AAAA,IAEnD,gBAAAF,EAACC,GAAA,EACE,UAAAC,EAAQ,KAAK,IAAI,CAACG,GAAMC,MAAY;AAC7B,YAAAC,IAAMR,IAAeA,EAAaM,GAAMC,CAAO,IAAI,GAAGD,CAAI,IAAIC,CAAO;AAE3E,+BAAQL,GAAA,EAAoB,UAAWH,EAAAO,CAAI,KAArBE,CAAuB;AAAA,IAAA,CAC9C,EACH,CAAA;AAAA,EAAA,EAAA,GATa,GAAGL,EAAQ,KAAK,IAAIC,CAAG,EAUtC,CAEH,GACH;AAEJ,GAEMK,IAAgBC,EAAKf,CAAoB;"}

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

@@ -1 +1 @@
-{"version":3,"file":"selection-card-option-styled.js","sources":["../../../../../src/features/ui/selection-cards/selection-card-option/selection-card-option-styled.tsx"],"sourcesContent":["import type { TColorNames } from '../../types';\n\nimport styled from 'styled-components';\n\ninterface ISelectionCardOptionWrapperProps {\n  $width?: string | number;\n  $widthX?: number;\n  $selected?: boolean;\n  $background?: TColorNames;\n  $selectedBackground?: TColorNames;\n}\n\nconst SelectionCardOptionWrapper = styled.div<ISelectionCardOptionWrapperProps>(\n  ({ $selected, theme, $background = 'WHITE', $selectedBackground = 'WHITE', $width }) => {\n    const { BLACK_T_87, WHITE_5 } = theme.colors;\n\n    return `\n      background-color: ${$selected ? $selectedBackground : $background};\n      border-width: 1px;\n      border-color: ${$selected ? BLACK_T_87 : WHITE_5};\n      width: ${$width ? `${$width}` : 'auto'}${typeof $width === 'number' ? 'px' : ''};\n      border-style: solid;\n      cursor: pointer;\n      position: relative;\n    `;\n  },\n);\n\nexport { SelectionCardOptionWrapper };\n"],"names":["SelectionCardOptionWrapper","styled","$selected","theme","$background","$selectedBackground","$width","BLACK_T_87","WHITE_5"],"mappings":";AAYA,MAAMA,IAA6BC,EAAO;AAAA,EACxC,CAAC,EAAE,WAAAC,GAAW,OAAAC,GAAO,aAAAC,IAAc,SAAS,qBAAAC,IAAsB,SAAS,QAAAC,QAAa;AACtF,UAAM,EAAE,YAAAC,GAAY,SAAAC,MAAYL,EAAM;AAE/B,WAAA;AAAA,0BACeD,IAAYG,IAAsBD,CAAW;AAAA;AAAA,sBAEjDF,IAAYK,IAAaC,CAAO;AAAA,eACvCF,IAAS,GAAGA,CAAM,KAAK,MAAM,GAAG,OAAOA,KAAW,WAAW,OAAO,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA,EAKnF;AACF;"}
+{"version":3,"file":"selection-card-option-styled.js","sources":["../../../../../src/features/ui/selection-cards/selection-card-option/selection-card-option-styled.tsx"],"sourcesContent":["import type { TColorNames } from '../../types';\n\nimport styled from 'styled-components';\n\ninterface ISelectionCardOptionWrapperProps {\n  $width?: string | number;\n  $widthX?: number;\n  $selected?: boolean;\n  $background?: TColorNames;\n  $selectedBackground?: TColorNames;\n}\n\nconst SelectionCardOptionWrapper = styled.div<ISelectionCardOptionWrapperProps>(\n  ({ $selected, theme, $background = 'WHITE', $selectedBackground = 'WHITE', $width }) => {\n    const { BLACK_T_87, WHITE_5 } = theme.colors;\n\n    return `\n      background-color: ${$selected ? $selectedBackground : $background};\n      border-width: 1px;\n      border-color: ${$selected ? BLACK_T_87 : WHITE_5};\n      width: ${$width ? `${$width}` : 'auto'}${typeof $width === 'number' ? 'px' : ''};\n      border-style: solid;\n      cursor: pointer;\n      position: relative;\n    `;\n  },\n);\n\nexport { SelectionCardOptionWrapper };\n"],"names":["SelectionCardOptionWrapper","styled","$selected","theme","$background","$selectedBackground","$width","BLACK_T_87","WHITE_5"],"mappings":";AAYA,MAAMA,IAA6BC,EAAO;AAAA,EACxC,CAAC,EAAE,WAAAC,GAAW,OAAAC,GAAO,aAAAC,IAAc,SAAS,qBAAAC,IAAsB,SAAS,QAAAC,QAAa;AACtF,UAAM,EAAE,YAAAC,GAAY,SAAAC,EAAQ,IAAIL,EAAM;AAE/B,WAAA;AAAA,0BACeD,IAAYG,IAAsBD,CAAW;AAAA;AAAA,sBAEjDF,IAAYK,IAAaC,CAAO;AAAA,eACvCF,IAAS,GAAGA,CAAM,KAAK,MAAM,GAAG,OAAOA,KAAW,WAAW,OAAO,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA,EAAA;AAMrF;"}

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

@@ -1 +1 @@
-{"version":3,"file":"selection-card-option.js","sources":["../../../../../src/features/ui/selection-cards/selection-card-option/selection-card-option.tsx"],"sourcesContent":["import type { ISelectionCardOptionProps } from './selection-card-types';\n\nimport { useCallback } from 'react';\n\nimport useResponseHandler from '../../hooks/use-response-handler';\nimport * as Styled from './selection-card-option-styled';\n\nconst SelectionCardOption = <IDTypes extends string | number>({\n  id,\n  children,\n  checked,\n  onChange,\n  analyticsLabel,\n  analyticsProps,\n  type,\n  $background,\n  $selectedBackground,\n  $cardWidth,\n}: ISelectionCardOptionProps<IDTypes>) => {\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 (type === 'radio' && !checked) {\n      onChange(id);\n      handleTracking(id);\n    }\n\n    if (type === 'checkbox') {\n      onChange(id);\n      handleTracking(id);\n    }\n  }, [checked, handleTracking, type, id, onChange]);\n\n  return (\n    <Styled.SelectionCardOptionWrapper\n      $selectedBackground={$selectedBackground}\n      $background={$background}\n      $selected={checked}\n      onClick={handleOnCardClick}\n      $width={$cardWidth}\n    >\n      {children}\n    </Styled.SelectionCardOptionWrapper>\n  );\n};\n\nexport default SelectionCardOption;\n"],"names":["SelectionCardOption","id","children","checked","onChange","analyticsLabel","analyticsProps","type","$background","$selectedBackground","$cardWidth","handleTracking","useResponseHandler","handleOnCardClick","useCallback","jsx","Styled.SelectionCardOptionWrapper"],"mappings":";;;;AAOA,MAAMA,IAAsB,CAAkC;AAAA,EAC5D,IAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,UAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,MAAAC;AAAA,EACA,aAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,YAAAC;AACF,MAA0C;AACxC,QAAMC,IAAiBC,EAAmB,EAAE,gBAAAP,GAAgB,gBAAAC,EAAgB,CAAA,GAEtEO,IAAoBC,EAAY,MAAM;AACtC,QAAA,OAAOV,KAAa;AAChB,YAAA,IAAI,MAAM,6BAA6B;AAG3C,IAAAG,MAAS,WAAW,CAACJ,MACvBC,EAASH,CAAE,GACXU,EAAeV,CAAE,IAGfM,MAAS,eACXH,EAASH,CAAE,GACXU,EAAeV,CAAE;AAAA,EACnB,GACC,CAACE,GAASQ,GAAgBJ,GAAMN,GAAIG,CAAQ,CAAC;AAG9C,SAAA,gBAAAW;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,qBAAAP;AAAA,MACA,aAAAD;AAAA,MACA,WAAWL;AAAA,MACX,SAASU;AAAA,MACT,QAAQH;AAAA,MAEP,UAAAR;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"selection-card-option.js","sources":["../../../../../src/features/ui/selection-cards/selection-card-option/selection-card-option.tsx"],"sourcesContent":["import type { ISelectionCardOptionProps } from './selection-card-types';\n\nimport { useCallback } from 'react';\n\nimport useResponseHandler from '../../hooks/use-response-handler';\nimport * as Styled from './selection-card-option-styled';\n\nconst SelectionCardOption = <IDTypes extends string | number>({\n  id,\n  children,\n  checked,\n  onChange,\n  analyticsLabel,\n  analyticsProps,\n  type,\n  $background,\n  $selectedBackground,\n  $cardWidth,\n}: ISelectionCardOptionProps<IDTypes>) => {\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 (type === 'radio' && !checked) {\n      onChange(id);\n      handleTracking(id);\n    }\n\n    if (type === 'checkbox') {\n      onChange(id);\n      handleTracking(id);\n    }\n  }, [checked, handleTracking, type, id, onChange]);\n\n  return (\n    <Styled.SelectionCardOptionWrapper\n      $selectedBackground={$selectedBackground}\n      $background={$background}\n      $selected={checked}\n      onClick={handleOnCardClick}\n      $width={$cardWidth}\n    >\n      {children}\n    </Styled.SelectionCardOptionWrapper>\n  );\n};\n\nexport default SelectionCardOption;\n"],"names":["SelectionCardOption","id","children","checked","onChange","analyticsLabel","analyticsProps","type","$background","$selectedBackground","$cardWidth","handleTracking","useResponseHandler","handleOnCardClick","useCallback","jsx","Styled.SelectionCardOptionWrapper"],"mappings":";;;;AAOA,MAAMA,IAAsB,CAAkC;AAAA,EAC5D,IAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,UAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,MAAAC;AAAA,EACA,aAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,YAAAC;AACF,MAA0C;AACxC,QAAMC,IAAiBC,EAAmB,EAAE,gBAAAP,GAAgB,gBAAAC,GAAgB,GAEtEO,IAAoBC,EAAY,MAAM;AACtC,QAAA,OAAOV,KAAa;AAChB,YAAA,IAAI,MAAM,6BAA6B;AAG3C,IAAAG,MAAS,WAAW,CAACJ,MACvBC,EAASH,CAAE,GACXU,EAAeV,CAAE,IAGfM,MAAS,eACXH,EAASH,CAAE,GACXU,EAAeV,CAAE;AAAA,EACnB,GACC,CAACE,GAASQ,GAAgBJ,GAAMN,GAAIG,CAAQ,CAAC;AAG9C,SAAA,gBAAAW;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,qBAAAP;AAAA,MACA,aAAAD;AAAA,MACA,WAAWL;AAAA,MACX,SAASU;AAAA,MACT,QAAQH;AAAA,MAEP,UAAAR;AAAA,IAAA;AAAA,EACH;AAEJ;"}

package/dist/features/ui/selection-cards/selection-cards.js

@@ -1,36 +1,36 @@
-import { jsx as n, Fragment as k } from "react/jsx-runtime";
-import x from "./selection-card-option/selection-card-option.js";
-const b = ({
+import { jsx as n, Fragment as C } from "react/jsx-runtime";
+import S from "./selection-card-option/selection-card-option.js";
+const j = ({
   options: t,
-  value: c,
+  value: i,
   values: o,
-  onChange: i,
+  onChange: c,
   analyticsLabel: d,
   analyticsProps: m,
   type: e,
   $background: l,
-  $selectedBackground: s,
-  $cardWidth: a
-}) => /* @__PURE__ */ n(k, { children: t.map((f) => {
-  const { children: h, id: r, visible: p } = f, C = e === "radio" ? c === r : o == null ? void 0 : o.some((S) => S === r);
-  return p ? /* @__PURE__ */ n(
-    x,
+  $selectedBackground: a,
+  $cardWidth: f
+}) => /* @__PURE__ */ n(C, { children: t.map((h) => {
+  const { children: p, id: r, visible: s } = h, k = e === "radio" ? i === r : o == null ? void 0 : o.some((x) => x === r);
+  return s ? /* @__PURE__ */ n(
+    S,
     {
-      checked: !!C,
-      children: h,
+      checked: !!k,
+      children: p,
       id: r,
-      onChange: i,
+      onChange: c,
       analyticsLabel: d,
       analyticsProps: m,
       type: e,
       $background: l,
-      $selectedBackground: s,
-      $cardWidth: a
+      $selectedBackground: a,
+      $cardWidth: f
     },
     r
   ) : null;
-}) }), u = b;
+}) });
 export {
-  u as default
+  j as default
 };
 //# sourceMappingURL=selection-cards.js.map

package/dist/features/ui/selection-cards/selection-cards.js.map

@@ -1 +1 @@
-{"version":3,"file":"selection-cards.js","sources":["../../../../src/features/ui/selection-cards/selection-cards.tsx"],"sourcesContent":["import type { ISelectionCardListProps } from './selection-cards-types';\n\nimport SelectionCardOption from './selection-card-option/selection-card-option';\n\nconst SelectionCards = <IDType extends string | number>({\n  options,\n  value,\n  values,\n  onChange,\n  analyticsLabel,\n  analyticsProps,\n  type,\n  $background,\n  $selectedBackground,\n  $cardWidth,\n}: ISelectionCardListProps<IDType>) => {\n  return (\n    <>\n      {options.map(option => {\n        const { children, id, visible } = option;\n\n        const checked = type === 'radio' ? value === id : values?.some(val => val === id);\n\n        if (!visible) return null;\n\n        return (\n          <SelectionCardOption<IDType>\n            key={id}\n            checked={Boolean(checked)}\n            children={children}\n            id={id}\n            onChange={onChange}\n            analyticsLabel={analyticsLabel}\n            analyticsProps={analyticsProps}\n            type={type}\n            $background={$background}\n            $selectedBackground={$selectedBackground}\n            $cardWidth={$cardWidth}\n          />\n        );\n      })}\n    </>\n  );\n};\n\nexport default SelectionCards;\n"],"names":["SelectionCards","options","value","values","onChange","analyticsLabel","analyticsProps","type","$background","$selectedBackground","$cardWidth","jsx","Fragment","option","children","id","visible","checked","val","SelectionCardOption","SelectionCards$1"],"mappings":";;AAIA,MAAMA,IAAiB,CAAiC;AAAA,EACtD,SAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,MAAAC;AAAA,EACA,aAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,YAAAC;AACF,MAEI,gBAAAC,EAAAC,GAAA,EACG,UAAQX,EAAA,IAAI,CAAUY,MAAA;AACrB,QAAM,EAAE,UAAAC,GAAU,IAAAC,GAAI,SAAAC,EAAA,IAAYH,GAE5BI,IAAUV,MAAS,UAAUL,MAAUa,IAAKZ,KAAA,gBAAAA,EAAQ,KAAK,CAAOe,MAAAA,MAAQH;AAE1E,SAACC,IAGH,gBAAAL;AAAA,IAACQ;AAAA,IAAA;AAAA,MAEC,SAAS,EAAQF;AAAA,MACjB,UAAAH;AAAA,MACA,IAAAC;AAAA,MACA,UAAAX;AAAA,MACA,gBAAAC;AAAA,MACA,gBAAAC;AAAA,MACA,MAAAC;AAAA,MACA,aAAAC;AAAA,MACA,qBAAAC;AAAA,MACA,YAAAC;AAAA,IAAA;AAAA,IAVKK;AAAA,EAAA,IAJY;AAiBtB,CAAA,EACH,CAAA,GAIJK,IAAepB;"}
+{"version":3,"file":"selection-cards.js","sources":["../../../../src/features/ui/selection-cards/selection-cards.tsx"],"sourcesContent":["import type { ISelectionCardListProps } from './selection-cards-types';\n\nimport SelectionCardOption from './selection-card-option/selection-card-option';\n\nconst SelectionCards = <IDType extends string | number>({\n  options,\n  value,\n  values,\n  onChange,\n  analyticsLabel,\n  analyticsProps,\n  type,\n  $background,\n  $selectedBackground,\n  $cardWidth,\n}: ISelectionCardListProps<IDType>) => {\n  return (\n    <>\n      {options.map(option => {\n        const { children, id, visible } = option;\n\n        const checked = type === 'radio' ? value === id : values?.some(val => val === id);\n\n        if (!visible) return null;\n\n        return (\n          <SelectionCardOption<IDType>\n            key={id}\n            checked={Boolean(checked)}\n            children={children}\n            id={id}\n            onChange={onChange}\n            analyticsLabel={analyticsLabel}\n            analyticsProps={analyticsProps}\n            type={type}\n            $background={$background}\n            $selectedBackground={$selectedBackground}\n            $cardWidth={$cardWidth}\n          />\n        );\n      })}\n    </>\n  );\n};\n\nexport default SelectionCards;\n"],"names":["SelectionCards","options","value","values","onChange","analyticsLabel","analyticsProps","type","$background","$selectedBackground","$cardWidth","jsx","Fragment","option","children","id","visible","checked","val","SelectionCardOption"],"mappings":";;AAIA,MAAMA,IAAiB,CAAiC;AAAA,EACtD,SAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,MAAAC;AAAA,EACA,aAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,YAAAC;AACF,MAEI,gBAAAC,EAAAC,GAAA,EACG,UAAQX,EAAA,IAAI,CAAUY,MAAA;AACrB,QAAM,EAAE,UAAAC,GAAU,IAAAC,GAAI,SAAAC,EAAY,IAAAH,GAE5BI,IAAUV,MAAS,UAAUL,MAAUa,IAAKZ,KAAA,gBAAAA,EAAQ,KAAK,CAAOe,MAAAA,MAAQH;AAE1E,SAACC,IAGH,gBAAAL;AAAA,IAACQ;AAAA,IAAA;AAAA,MAEC,SAAS,EAAQF;AAAA,MACjB,UAAAH;AAAA,MACA,IAAAC;AAAA,MACA,UAAAX;AAAA,MACA,gBAAAC;AAAA,MACA,gBAAAC;AAAA,MACA,MAAAC;AAAA,MACA,aAAAC;AAAA,MACA,qBAAAC;AAAA,MACA,YAAAC;AAAA,IAAA;AAAA,IAVKK;AAAA,EAWP,IAfmB;AAiBtB,CAAA,GACH;"}

package/dist/features/ui/separator/separator.js

@@ -1,11 +1,11 @@
 import { jsx as i } from "react/jsx-runtime";
-import { memo as a } from "react";
-import m from "../layout/flex-view.js";
-const g = a((t) => {
+import { memo as m } from "react";
+import a from "../layout/flex-view.js";
+const p = m((t) => {
   const { width: o, height: r = 1, heightX: e, background: h } = t;
-  return /* @__PURE__ */ i(m, { $width: o, $height: r, $heightX: e, $background: h });
-}), d = g;
+  return /* @__PURE__ */ i(a, { $width: o, $height: r, $heightX: e, $background: h });
+});
 export {
-  d as default
+  p as default
 };
 //# sourceMappingURL=separator.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"separator.js","sources":["../../../../src/features/ui/separator/separator.tsx"],"sourcesContent":["import type { ISeparatorProps } from './separator-types';\n\nimport React, { memo } from 'react';\n\nimport FlexView from '../layout/flex-view';\n\nconst Separator: React.FC<ISeparatorProps> = memo(props => {\n  const { width, height = 1, heightX, background } = props;\n\n  return <FlexView $width={width} $height={height} $heightX={heightX} $background={background} />;\n});\n\nexport default Separator;\n"],"names":["Separator","memo","props","width","height","heightX","background","jsx","FlexView","Separator$1"],"mappings":";;;AAMA,MAAMA,IAAuCC,EAAK,CAASC,MAAA;AACzD,QAAM,EAAE,OAAAC,GAAO,QAAAC,IAAS,GAAG,SAAAC,GAAS,YAAAC,EAAe,IAAAJ;AAE5C,SAAA,gBAAAK,EAACC,KAAS,QAAQL,GAAO,SAASC,GAAQ,UAAUC,GAAS,aAAaC,EAAY,CAAA;AAC/F,CAAC,GAEDG,IAAeT;"}
+{"version":3,"file":"separator.js","sources":["../../../../src/features/ui/separator/separator.tsx"],"sourcesContent":["import type { ISeparatorProps } from './separator-types';\n\nimport React, { memo } from 'react';\n\nimport FlexView from '../layout/flex-view';\n\nconst Separator: React.FC<ISeparatorProps> = memo(props => {\n  const { width, height = 1, heightX, background } = props;\n\n  return <FlexView $width={width} $height={height} $heightX={heightX} $background={background} />;\n});\n\nexport default Separator;\n"],"names":["Separator","memo","props","width","height","heightX","background","jsx","FlexView"],"mappings":";;;AAMM,MAAAA,IAAuCC,EAAK,CAASC,MAAA;AACzD,QAAM,EAAE,OAAAC,GAAO,QAAAC,IAAS,GAAG,SAAAC,GAAS,YAAAC,MAAeJ;AAE5C,SAAA,gBAAAK,EAACC,KAAS,QAAQL,GAAO,SAASC,GAAQ,UAAUC,GAAS,aAAaC,EAAY,CAAA;AAC/F,CAAC;"}

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

@@ -1 +1 @@
-{"version":3,"file":"stepper-styled.js","sources":["../../../../src/features/ui/stepper/stepper-styled.tsx"],"sourcesContent":["import type { IHorizontallineProps, INumberWrapperProps } from './stepper-types';\n\nimport styled from 'styled-components';\n\nimport FlexView from '../layout/flex-view';\nimport Text from '../text/text';\nimport { getTheme } from '../theme/get-theme';\n\nconst { colors, layout } = getTheme();\nconst { gutter } = layout;\n\nconst MainWrapper = styled(FlexView)`\n  position: relative;\n`;\n\nconst NumberWrapper = styled(FlexView)<INumberWrapperProps>(\n  ({ $stepNumber, $currentStep }) => `\n    border-radius: ${gutter * 0.625}px;\n    background:${\n      $stepNumber < $currentStep\n        ? colors.GREEN_3\n        : $stepNumber === $currentStep\n          ? colors.BLACK\n          : colors.GREY_3\n    };\n    margin:0 ${gutter * 0.25}px;\n`,\n);\n\nconst Wrapper = styled(FlexView)`\n  position: relative;\n  margin: 0 ${gutter * 0.875}px;\n`;\n\nconst StyledText = styled(Text)`\n  margin-right: ${gutter * 0.25}px;\n`;\n\nconst HorizontalLine = styled(FlexView)<IHorizontallineProps>(\n  ({ $percentageCompleted }) => `\n  position: absolute;\n  background-image: linear-gradient(to right, ${colors.BLACK} ${$percentageCompleted}%, ${\n    colors.GREY_3\n  } ${$percentageCompleted}%);\n  width: calc(100% - ${gutter * 5.375}px);\n  top: 50%;\n  left: ${gutter * 2.5}px;\n`,\n);\n\nexport { MainWrapper, NumberWrapper, Wrapper, StyledText, HorizontalLine };\n"],"names":["colors","layout","getTheme","gutter","MainWrapper","styled","FlexView","NumberWrapper","$stepNumber","$currentStep","Wrapper","StyledText","Text","HorizontalLine","$percentageCompleted"],"mappings":";;;;AAQA,MAAM,EAAE,QAAAA,GAAQ,QAAAC,MAAWC,KACrB,EAAE,QAAAC,EAAW,IAAAF,GAEbG,IAAcC,EAAOC,CAAQ;AAAA;AAAA,GAI7BC,IAAgBF,EAAOC,CAAQ;AAAA,EACnC,CAAC,EAAE,aAAAE,GAAa,cAAAC,EAAA,MAAmB;AAAA,qBAChBN,IAAS,KAAK;AAAA,iBAE7BK,IAAcC,IACVT,EAAO,UACPQ,MAAgBC,IACdT,EAAO,QACPA,EAAO,MACf;AAAA,eACWG,IAAS,IAAI;AAAA;AAE5B,GAEMO,IAAUL,EAAOC,CAAQ;AAAA;AAAA,cAEjBH,IAAS,KAAK;AAAA,GAGtBQ,IAAaN,EAAOO,CAAI;AAAA,kBACZT,IAAS,IAAI;AAAA,GAGzBU,IAAiBR,EAAOC,CAAQ;AAAA,EACpC,CAAC,EAAE,sBAAAQ,EAAA,MAA2B;AAAA;AAAA,gDAEgBd,EAAO,KAAK,IAAIc,CAAoB,MAChFd,EAAO,MACT,IAAIc,CAAoB;AAAA,uBACHX,IAAS,KAAK;AAAA;AAAA,UAE3BA,IAAS,GAAG;AAAA;AAEtB;"}
+{"version":3,"file":"stepper-styled.js","sources":["../../../../src/features/ui/stepper/stepper-styled.tsx"],"sourcesContent":["import type { IHorizontallineProps, INumberWrapperProps } from './stepper-types';\n\nimport styled from 'styled-components';\n\nimport FlexView from '../layout/flex-view';\nimport Text from '../text/text';\nimport { getTheme } from '../theme/get-theme';\n\nconst { colors, layout } = getTheme();\nconst { gutter } = layout;\n\nconst MainWrapper = styled(FlexView)`\n  position: relative;\n`;\n\nconst NumberWrapper = styled(FlexView)<INumberWrapperProps>(\n  ({ $stepNumber, $currentStep }) => `\n    border-radius: ${gutter * 0.625}px;\n    background:${\n      $stepNumber < $currentStep\n        ? colors.GREEN_3\n        : $stepNumber === $currentStep\n          ? colors.BLACK\n          : colors.GREY_3\n    };\n    margin:0 ${gutter * 0.25}px;\n`,\n);\n\nconst Wrapper = styled(FlexView)`\n  position: relative;\n  margin: 0 ${gutter * 0.875}px;\n`;\n\nconst StyledText = styled(Text)`\n  margin-right: ${gutter * 0.25}px;\n`;\n\nconst HorizontalLine = styled(FlexView)<IHorizontallineProps>(\n  ({ $percentageCompleted }) => `\n  position: absolute;\n  background-image: linear-gradient(to right, ${colors.BLACK} ${$percentageCompleted}%, ${\n    colors.GREY_3\n  } ${$percentageCompleted}%);\n  width: calc(100% - ${gutter * 5.375}px);\n  top: 50%;\n  left: ${gutter * 2.5}px;\n`,\n);\n\nexport { MainWrapper, NumberWrapper, Wrapper, StyledText, HorizontalLine };\n"],"names":["colors","layout","getTheme","gutter","MainWrapper","styled","FlexView","NumberWrapper","$stepNumber","$currentStep","Wrapper","StyledText","Text","HorizontalLine","$percentageCompleted"],"mappings":";;;;AAQA,MAAM,EAAE,QAAAA,GAAQ,QAAAC,EAAO,IAAIC,EAAS,GAC9B,EAAE,QAAAC,EAAW,IAAAF,GAEbG,IAAcC,EAAOC,CAAQ;AAAA;AAAA,GAI7BC,IAAgBF,EAAOC,CAAQ;AAAA,EACnC,CAAC,EAAE,aAAAE,GAAa,cAAAC,QAAmB;AAAA,qBAChBN,IAAS,KAAK;AAAA,iBAE7BK,IAAcC,IACVT,EAAO,UACPQ,MAAgBC,IACdT,EAAO,QACPA,EAAO,MACf;AAAA,eACWG,IAAS,IAAI;AAAA;AAE5B,GAEMO,IAAUL,EAAOC,CAAQ;AAAA;AAAA,cAEjBH,IAAS,KAAK;AAAA,GAGtBQ,IAAaN,EAAOO,CAAI;AAAA,kBACZT,IAAS,IAAI;AAAA,GAGzBU,IAAiBR,EAAOC,CAAQ;AAAA,EACpC,CAAC,EAAE,sBAAAQ,EAAA,MAA2B;AAAA;AAAA,gDAEgBd,EAAO,KAAK,IAAIc,CAAoB,MAChFd,EAAO,MACT,IAAIc,CAAoB;AAAA,uBACHX,IAAS,KAAK;AAAA;AAAA,UAE3BA,IAAS,GAAG;AAAA;AAEtB;"}