npm - @cuemath/leap - Versions diffs - 3.3.18-j6 → 3.3.18-link.1 - Mend

@cuemath/leap 3.3.18-j6 → 3.3.18-link.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (112) hide show

package/dist/features/auth/account-selector/account-selector-styled.js ADDED Viewed

@@ -0,0 +1,9 @@
+import r from "styled-components";
+import m from "../../ui/image/image.js";
+const t = r(m)`
+  background-color: ${({ theme: o }) => o.colors.WHITE};
+`;
+export {
+  t as ImageWrapper
+};
+//# sourceMappingURL=account-selector-styled.js.map

package/dist/features/auth/account-selector/account-selector-styled.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"account-selector-styled.js","sources":["../../../../src/features/auth/account-selector/account-selector-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport Image from '../../ui/image/image';\n\nexport const ImageWrapper = styled(Image)`\n background-color: ${({ theme }) => theme.colors.WHITE};\n`;\n"],"names":["ImageWrapper","styled","Image","theme"],"mappings":";;AAIa,MAAAA,IAAeC,EAAOC,CAAK;AAAA,sBAClB,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA;"}

package/dist/features/auth/account-selector/account-selector.js CHANGED Viewed

@@ -1,23 +1,24 @@
-import { jsxs as a, jsx as e } from "react/jsx-runtime";
-import { memo as s } from "react";
-import { useTheme as p } from "styled-components";
-import { ILLUSTRATIONS as f } from "../../../assets/illustrations/illustrations.js";
-import l from "../../ui/image/image.js";
-import h from "../../ui/layout/flex-view.js";
-import t from "../../ui/separator/separator.js";
-import T from "../../ui/text/text.js";
+import { jsxs as r, jsx as e, Fragment as s } from "react/jsx-runtime";
+import { memo as d } from "react";
+import { useTheme as $ } from "styled-components";
+import { ILLUSTRATIONS as m } from "../../../assets/illustrations/illustrations.js";
+import f from "../../ui/image/image.js";
+import t from "../../ui/layout/flex-view.js";
+import o from "../../ui/separator/separator.js";
+import n from "../../ui/text/text.js";
 import { EDeviceType as g } from "../../ui/theme/constants.js";
-import $ from "../comps/overlay-loader/overlay-loader.js";
-import d from "../comps/user-list/user-list.js";
-const u = ({
-  userAccounts: r,
-  onSelect: o,
-  onAddNew: m,
-  isLoading: i
+import T from "../comps/overlay-loader/overlay-loader.js";
+import u from "../comps/user-list/user-list.js";
+import { ImageWrapper as w } from "./account-selector-styled.js";
+const L = ({
+  userAccounts: i,
+  onSelect: c,
+  onAddNew: h,
+  isLoading: l
 }) => {
-  const { device: n } = p(), c = n <= g.TABLET;
-  return /* @__PURE__ */ a(
-    h,
+  const { device: p } = $(), a = p <= g.TABLET;
+  return /* @__PURE__ */ r(
+    t,
     {
       $flex: 1,
       $alignItems: "center",
@@ -26,17 +27,44 @@ const u = ({
       $height: "100%",
       $gapX: 2,
       children: [
-        /* @__PURE__ */ e($, { isLoading: i }),
-        /* @__PURE__ */ e(l, { src: f.CIRCLE_CUEMATH_LOGO_WHITE, alt: "Parent Signup", withLoader: !1 }),
-        /* @__PURE__ */ e(t, { heightX: 1 }),
-        /* @__PURE__ */ e(T, { $renderAs: "ab1", $color: "WHITE_T_60", $align: "center", children: "Switch between accounts" }),
-        /* @__PURE__ */ e(t, { heightX: c ? 1.5 : 5 }),
-        r.length > 0 && /* @__PURE__ */ e(d, { users: r, onSelect: o, onAddNew: m, maxColumns: 3 })
+        /* @__PURE__ */ e(T, { isLoading: l }),
+        /* @__PURE__ */ e(f, { src: m.CIRCLE_CUEMATH_LOGO_WHITE, alt: "Parent Signup", withLoader: !1 }),
+        /* @__PURE__ */ e(o, { heightX: 1 }),
+        /* @__PURE__ */ e(n, { $renderAs: "ab1", $color: "WHITE_T_60", $align: "center", children: "Switch between accounts" }),
+        /* @__PURE__ */ e(o, { heightX: a ? 1.5 : 5 }),
+        i.length > 0 && /* @__PURE__ */ r(s, { children: [
+          /* @__PURE__ */ e(u, { users: i, onSelect: c, onAddNew: h }),
+          /* @__PURE__ */ e(o, { heightX: a ? 1.5 : 5 }),
+          /* @__PURE__ */ r(
+            t,
+            {
+              $gutterX: 0.5,
+              $gapX: 1,
+              $flexGapX: 0.5,
+              $width: 280,
+              $borderColor: "BLACK_5",
+              $background: "BLACK_3",
+              $flexDirection: "row",
+              children: [
+                /* @__PURE__ */ e(
+                  w,
+                  {
+                    src: m.CUEMATH_APP_QR_CODE,
+                    width: 80,
+                    height: 80,
+                    withLoader: !1
+                  }
+                ),
+                /* @__PURE__ */ e(t, { $gapX: 0.5, $flex: 1, children: /* @__PURE__ */ e(n, { $color: "WHITE", $renderOnTabletAs: "ab3", $renderAs: "ab2", children: "Download the cuemath app to view your children’s report" }) })
+              ]
+            }
+          )
+        ] })
       ]
     }
   );
-}, v = s(u);
+}, y = d(L);
 export {
-  v as default
+  y as default
 };
 //# sourceMappingURL=account-selector.js.map

package/dist/features/auth/account-selector/account-selector.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"account-selector.js","sources":["../../../../src/features/auth/account-selector/account-selector.tsx"],"sourcesContent":["import type { IAccountSelectorViewProps } from './account-selector-types';\n\nimport { memo } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport { ILLUSTRATIONS } from '../../../assets/illustrations/illustrations';\nimport Image from '../../ui/image/image';\nimport FlexView from '../../ui/layout/flex-view';\nimport Separator from '../../ui/separator/separator';\nimport Text from '../../ui/text/text';\nimport { EDeviceType } from '../../ui/theme/constants';\nimport OverlayLoader from '../comps/overlay-loader/overlay-loader';\nimport UserList from '../comps/user-list/user-list';\n\nconst AccountSelector = ({\n userAccounts,\n onSelect,\n onAddNew,\n isLoading,\n}: IAccountSelectorViewProps) => {\n const { device } = useTheme();\n const isCompact = device <= EDeviceType.TABLET;\n\n return (\n <FlexView\n $flex={1}\n $alignItems=\"center\"\n $justifyContent=\"center\"\n $width=\"100%\"\n $height=\"100%\"\n $gapX={2}\n >\n <OverlayLoader isLoading={isLoading} />\n <Image src={ILLUSTRATIONS.CIRCLE_CUEMATH_LOGO_WHITE} alt=\"Parent Signup\" withLoader={false} />\n <Separator heightX={1} />\n <Text $renderAs=\"ab1\" $color=\"WHITE_T_60\" $align=\"center\">\n Switch between accounts\n </Text>\n <Separator heightX={isCompact ? 1.5 : 5} />\n {userAccounts.length > 0 && (\n <UserList users={userAccounts} onSelect={onSelect} onAddNew={onAddNew} ~~maxColumns~~={3} />\n )}\n </FlexView>\n );\n};\n\nexport default memo(AccountSelector);\n"],"names":["AccountSelector","userAccounts","onSelect","onAddNew","isLoading","device","useTheme","isCompact","EDeviceType","jsxs","FlexView","jsx","OverlayLoader","Image","ILLUSTRATIONS","Separator","Text","UserList","accountSelector","memo"],"mappings":"~~;;;;;;;;;;;AAcA~~,MAAMA,IAAkB,CAAC;AAAA,EACvB,cAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AACF,MAAiC;AACzB,QAAA,EAAE,QAAAC,MAAWC,KACbC,IAAYF,KAAUG,EAAY;AAGtC,SAAA,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,OAAO;AAAA,MACP,aAAY;AAAA,MACZ,iBAAgB;AAAA,MAChB,QAAO;AAAA,MACP,SAAQ;AAAA,MACR,OAAO;AAAA,MAEP,UAAA;AAAA,QAAA,gBAAAC,EAACC,KAAc,WAAAR,GAAsB;AAAA,QACrC,gBAAAO,EAACE,KAAM,KAAKC,EAAc,2BAA2B,KAAI,iBAAgB,YAAY,IAAO;AAAA,QAC5F,gBAAAH,EAACI,GAAU,EAAA,SAAS,EAAG,CAAA;AAAA,QACvB,gBAAAJ,EAACK,KAAK,WAAU,OAAM,QAAO,cAAa,QAAO,UAAS,UAE1D,0BAAA,CAAA;AAAA,QACC,gBAAAL,EAAAI,GAAA,EAAU,SAASR,IAAY,MAAM,GAAG;AAAA,QACxCN,EAAa,SAAS,~~KACpB~~,~~gBAAAU~~,~~EAAAM~~,GAAA,~~EAAS~~,~~OAAOhB~~,GAAc,UAAAC,GAAoB,UAAAC,GAAoB,YAAY,~~EAAG~~,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;~~AAI9F~~,~~GAEee~~,IAAAC,~~EAAKnB~~,CAAe;"}
1	+ {"version":3,"file":"account-selector.js","sources":["../../../../src/features/auth/account-selector/account-selector.tsx"],"sourcesContent":["import type { IAccountSelectorViewProps } from './account-selector-types';\n\nimport { memo } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport { ILLUSTRATIONS } from '../../../assets/illustrations/illustrations';\nimport Image from '../../ui/image/image';\nimport FlexView from '../../ui/layout/flex-view';\nimport Separator from '../../ui/separator/separator';\nimport Text from '../../ui/text/text';\nimport { EDeviceType } from '../../ui/theme/constants';\nimport OverlayLoader from '../comps/overlay-loader/overlay-loader';\nimport UserList from '../comps/user-list/user-list';\nimport * as Styled from './account-selector-styled';\n\nconst AccountSelector = ({\n userAccounts,\n onSelect,\n onAddNew,\n isLoading,\n}: IAccountSelectorViewProps) => {\n const { device } = useTheme();\n const isCompact = device <= EDeviceType.TABLET;\n\n return (\n <FlexView\n $flex={1}\n $alignItems=\"center\"\n $justifyContent=\"center\"\n $width=\"100%\"\n $height=\"100%\"\n $gapX={2}\n >\n <OverlayLoader isLoading={isLoading} />\n <Image src={ILLUSTRATIONS.CIRCLE_CUEMATH_LOGO_WHITE} alt=\"Parent Signup\" withLoader={false} />\n <Separator heightX={1} />\n <Text $renderAs=\"ab1\" $color=\"WHITE_T_60\" $align=\"center\">\n Switch between accounts\n </Text>\n <Separator heightX={isCompact ? 1.5 : 5} />\n {userAccounts.length > 0 && (\n <>\n <UserList users={userAccounts} onSelect={onSelect} onAddNew={onAddNew} />\n <Separator heightX={isCompact ? 1.5 : 5} />\n <FlexView\n $gutterX={0.5}\n $gapX={1}\n $flexGapX={0.5}\n $width={280}\n $borderColor=\"BLACK_5\"\n $background=\"BLACK_3\"\n $flexDirection=\"row\"\n >\n <Styled.ImageWrapper\n src={ILLUSTRATIONS.CUEMATH_APP_QR_CODE}\n width={80}\n height={80}\n withLoader={false}\n />\n <FlexView $gapX={0.5} $flex={1}>\n <Text $color=\"WHITE\" $renderOnTabletAs=\"ab3\" $renderAs=\"ab2\">\n Download the cuemath app to view your children’s report\n </Text>\n </FlexView>\n </FlexView>\n </>\n )}\n </FlexView>\n );\n};\n\nexport default memo(AccountSelector);\n"],"names":["AccountSelector","userAccounts","onSelect","onAddNew","isLoading","device","useTheme","isCompact","EDeviceType","jsxs","FlexView","jsx","OverlayLoader","Image","ILLUSTRATIONS","Separator","Text","Fragment","UserList","Styled.ImageWrapper","accountSelector","memo"],"mappings":";;;;;;;;;;;;AAeA,MAAMA,IAAkB,CAAC;AAAA,EACvB,cAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AACF,MAAiC;AACzB,QAAA,EAAE,QAAAC,MAAWC,KACbC,IAAYF,KAAUG,EAAY;AAGtC,SAAA,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,OAAO;AAAA,MACP,aAAY;AAAA,MACZ,iBAAgB;AAAA,MAChB,QAAO;AAAA,MACP,SAAQ;AAAA,MACR,OAAO;AAAA,MAEP,UAAA;AAAA,QAAA,gBAAAC,EAACC,KAAc,WAAAR,GAAsB;AAAA,QACrC,gBAAAO,EAACE,KAAM,KAAKC,EAAc,2BAA2B,KAAI,iBAAgB,YAAY,IAAO;AAAA,QAC5F,gBAAAH,EAACI,GAAU,EAAA,SAAS,EAAG,CAAA;AAAA,QACvB,gBAAAJ,EAACK,KAAK,WAAU,OAAM,QAAO,cAAa,QAAO,UAAS,UAE1D,0BAAA,CAAA;AAAA,QACC,gBAAAL,EAAAI,GAAA,EAAU,SAASR,IAAY,MAAM,GAAG;AAAA,QACxCN,EAAa,SAAS,KAEnB,gBAAAQ,EAAAQ,GAAA,EAAA,UAAA;AAAA,UAAA,gBAAAN,EAACO,GAAS,EAAA,OAAOjB,GAAc,UAAAC,GAAoB,UAAAC,GAAoB;AAAA,UACtE,gBAAAQ,EAAAI,GAAA,EAAU,SAASR,IAAY,MAAM,GAAG;AAAA,UACzC,gBAAAE;AAAA,YAACC;AAAA,YAAA;AAAA,cACC,UAAU;AAAA,cACV,OAAO;AAAA,cACP,WAAW;AAAA,cACX,QAAQ;AAAA,cACR,cAAa;AAAA,cACb,aAAY;AAAA,cACZ,gBAAe;AAAA,cAEf,UAAA;AAAA,gBAAA,gBAAAC;AAAA,kBAACQ;AAAAA,kBAAA;AAAA,oBACC,KAAKL,EAAc;AAAA,oBACnB,OAAO;AAAA,oBACP,QAAQ;AAAA,oBACR,YAAY;AAAA,kBAAA;AAAA,gBACd;AAAA,gBACC,gBAAAH,EAAAD,GAAA,EAAS,OAAO,KAAK,OAAO,GAC3B,UAAA,gBAAAC,EAACK,GAAK,EAAA,QAAO,SAAQ,mBAAkB,OAAM,WAAU,OAAM,oEAE7D,CAAA,GACF;AAAA,cAAA;AAAA,YAAA;AAAA,UACF;AAAA,QAAA,GACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIR,GAEeI,IAAAC,EAAKrB,CAAe;"}

package/dist/features/auth/pla-signup/pla-analytics-events.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { PLUGINS as _ } from "../../../node_modules/@cuemath/analytics-v2/dist/constants.js";
-var t = /* @__PURE__ */ ((e) => (e.START_SIGNUP_CTA_CLICKED = "start_signup_cta_clicked", e.ECNA_STEP_VIEWED = "ecna_step_viewed", e.ECNA_RESPONSE_RECORDED_DEBUG = "ecna_response_recorded_debug", e.PARENT_SIGNUP_CTA_CLICKED = "parent_signup_cta_clicked", e.PARENT_SIGNUP_SUCCESSFUL = "parent_signup_successful", e.PARENT_SIGNUP_FAILED = "parent_signup_failed", e.STUDENT_SIGNUP_SUCCESSFUL = "signup_successful", e.STUDENT_SIGNUP_FAILED = "signup_failed", e.SIGNUP_OTP_ENTERED = "signup_otp_entered", e.SIGNUP_OTP_VERIFIED = "signup_otp_verified", e.SIGNUP_OTP_FAILED = "signup_otp_failed", e.SLOTS_SHOWN = "slots_shown", e.SLOT_DATE_SELECTED = "slot_date_selected", e.SLOT_TIME_SELECTED = "slot_time_selected", e.TUTOR_CHANGE_REASON_SELECTED = "tutor_change_reason_selected", e.SUBSCRIPTION_INTENT_FAILED = "subscription_intent_failed", e.SUBSCRIPTION_INTENT_CREATED = "subscription_intent_created", e.STRIPE_PAYMENT_ELEMENT_READY = "stripe_payment_element_ready", e.STRIPE_PAYMENT_FAILED = "stripe_payment_failed", e.STRIPE_PAYMENT_SUCCESS = "stripe_payment_success", e.PAYMENT_PLAN_SELECTED = "payment_plan_selected", e))(t || {});
+var s = /* @__PURE__ */ ((e) => (e.START_SIGNUP_CTA_CLICKED = "start_signup_cta_clicked", e.ECNA_STEP_VIEWED = "ecna_step_viewed", e.ECNA_RESPONSE_RECORDED_DEBUG = "ecna_response_recorded_debug", e.PARENT_SIGNUP_CTA_CLICKED = "parent_signup_cta_clicked", e.PARENT_SIGNUP_SUCCESSFUL = "parent_signup_successful", e.PARENT_SIGNUP_FAILED = "parent_signup_failed", e.STUDENT_SIGNUP_SUCCESSFUL = "signup_successful", e.STUDENT_SIGNUP_FAILED = "signup_failed", e.SIGNUP_OTP_ENTERED = "signup_otp_entered", e.SIGNUP_OTP_VERIFIED = "signup_otp_verified", e.SIGNUP_OTP_FAILED = "signup_otp_failed", e.SLOTS_SHOWN = "slots_shown", e.SLOT_DATE_SELECTED = "slot_date_selected", e.SLOT_TIME_SELECTED = "slot_time_selected", e.TUTOR_CHANGE_REASON_SELECTED = "tutor_change_reason_selected", e))(s || {});
 const n = {
   start_signup_cta_clicked: [_.MIXPANEL],
   ecna_step_viewed: [_.MIXPANEL],
@@ -15,16 +15,10 @@ const n = {
   slots_shown: [_.MIXPANEL],
   slot_date_selected: [_.MIXPANEL],
   slot_time_selected: [_.MIXPANEL],
-  tutor_change_reason_selected: [_.MIXPANEL],
-  subscription_intent_failed: [_.MIXPANEL],
-  subscription_intent_created: [_.MIXPANEL],
-  stripe_payment_element_ready: [_.MIXPANEL],
-  stripe_payment_failed: [_.MIXPANEL],
-  stripe_payment_success: [_.MIXPANEL],
-  payment_plan_selected: [_.MIXPANEL]
+  tutor_change_reason_selected: [_.MIXPANEL]
 };
 export {
-  t as PLA_ANALYTICS_EVENTS,
+  s as PLA_ANALYTICS_EVENTS,
   n as PLA_ANALYTICS_WHITELIST_EVENTS
 };
 //# sourceMappingURL=pla-analytics-events.js.map

package/dist/features/auth/pla-signup/pla-analytics-events.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"pla-analytics-events.js","sources":["../../../../src/features/auth/pla-signup/pla-analytics-events.ts"],"sourcesContent":["import { PLUGINS } from '@cuemath/analytics-v2/dist/constants';\n\nexport enum PLA_ANALYTICS_EVENTS {\n START_SIGNUP_CTA_CLICKED = 'start_signup_cta_clicked',\n ECNA_STEP_VIEWED = 'ecna_step_viewed',\n ECNA_RESPONSE_RECORDED_DEBUG = 'ecna_response_recorded_debug',\n PARENT_SIGNUP_CTA_CLICKED = 'parent_signup_cta_clicked',\n PARENT_SIGNUP_SUCCESSFUL = 'parent_signup_successful',\n PARENT_SIGNUP_FAILED = 'parent_signup_failed',\n STUDENT_SIGNUP_SUCCESSFUL = 'signup_successful',\n STUDENT_SIGNUP_FAILED = 'signup_failed',\n SIGNUP_OTP_ENTERED = 'signup_otp_entered',\n SIGNUP_OTP_VERIFIED = 'signup_otp_verified',\n SIGNUP_OTP_FAILED = 'signup_otp_failed',\n SLOTS_SHOWN = 'slots_shown',\n SLOT_DATE_SELECTED = 'slot_date_selected',\n SLOT_TIME_SELECTED = 'slot_time_selected',\n TUTOR_CHANGE_REASON_SELECTED = 'tutor_change_reason_selected',\n SUBSCRIPTION_INTENT_FAILED = 'subscription_intent_failed',\n SUBSCRIPTION_INTENT_CREATED = 'subscription_intent_created',\n STRIPE_PAYMENT_ELEMENT_READY = 'stripe_payment_element_ready',\n STRIPE_PAYMENT_FAILED = 'stripe_payment_failed',\n STRIPE_PAYMENT_SUCCESS = 'stripe_payment_success',\n PAYMENT_PLAN_SELECTED = 'payment_plan_selected',\n}\n\nexport const PLA_ANALYTICS_WHITELIST_EVENTS = {\n [PLA_ANALYTICS_EVENTS.START_SIGNUP_CTA_CLICKED]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.ECNA_STEP_VIEWED]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.ECNA_RESPONSE_RECORDED_DEBUG]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.PARENT_SIGNUP_CTA_CLICKED]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.PARENT_SIGNUP_SUCCESSFUL]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.PARENT_SIGNUP_FAILED]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.STUDENT_SIGNUP_SUCCESSFUL]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.STUDENT_SIGNUP_FAILED]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.SIGNUP_OTP_ENTERED]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.SIGNUP_OTP_VERIFIED]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.SIGNUP_OTP_FAILED]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.SLOTS_SHOWN]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.SLOT_DATE_SELECTED]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.SLOT_TIME_SELECTED]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.TUTOR_CHANGE_REASON_SELECTED]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.SUBSCRIPTION_INTENT_FAILED]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.SUBSCRIPTION_INTENT_CREATED]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.STRIPE_PAYMENT_ELEMENT_READY]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.STRIPE_PAYMENT_FAILED]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.STRIPE_PAYMENT_SUCCESS]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.PAYMENT_PLAN_SELECTED]: [PLUGINS.MIXPANEL],\n};\n"],"names":["PLA_ANALYTICS_EVENTS","PLA_ANALYTICS_WHITELIST_EVENTS","PLUGINS"],"mappings":";AAEY,IAAAA,sBAAAA,OACVA,EAAA,2BAA2B,4BAC3BA,EAAA,mBAAmB,oBACnBA,EAAA,+BAA+B,gCAC/BA,EAAA,4BAA4B,6BAC5BA,EAAA,2BAA2B,4BAC3BA,EAAA,uBAAuB,wBACvBA,EAAA,4BAA4B,qBAC5BA,EAAA,wBAAwB,iBACxBA,EAAA,qBAAqB,sBACrBA,EAAA,sBAAsB,uBACtBA,EAAA,oBAAoB,qBACpBA,EAAA,cAAc,eACdA,EAAA,qBAAqB,sBACrBA,EAAA,qBAAqB,sBACrBA,EAAA,+BAA+B,~~gCAC/BA~~,~~EAAA,6BAA6B,8BAC7BA,EAAA,8BAA8B,+BAC9BA,EAAA,+BAA+B,gCAC/BA,EAAA,wBAAwB,yBACxBA,EAAA,yBAAyB,0BACzBA,EAAA,wBAAwB,yBArBdA,~~IAAAA,KAAA,CAAA,CAAA;~~AAwBL~~,MAAMC,IAAiC;AAAA,EAC3C,0BAAgD,CAACC,EAAQ,QAAQ;AAAA,EACjE,kBAAwC,CAACA,EAAQ,QAAQ;AAAA,EACzD,8BAAoD,CAACA,EAAQ,QAAQ;AAAA,EACrE,2BAAiD,CAACA,EAAQ,QAAQ;AAAA,EAClE,0BAAgD,CAACA,EAAQ,QAAQ;AAAA,EACjE,sBAA4C,CAACA,EAAQ,QAAQ;AAAA,EAC7D,mBAAiD,CAACA,EAAQ,QAAQ;AAAA,EAClE,eAA6C,CAACA,EAAQ,QAAQ;AAAA,EAC9D,oBAA0C,CAACA,EAAQ,QAAQ;AAAA,EAC3D,qBAA2C,CAACA,EAAQ,QAAQ;AAAA,EAC5D,mBAAyC,CAACA,EAAQ,QAAQ;AAAA,EAC1D,aAAmC,CAACA,EAAQ,QAAQ;AAAA,EACpD,oBAA0C,CAACA,EAAQ,QAAQ;AAAA,EAC3D,oBAA0C,CAACA,EAAQ,QAAQ;AAAA,EAC3D,8BAAoD,CAACA,EAAQ,QAAQ;~~AAAA,EACrE,4BAAkD,CAACA,EAAQ,QAAQ~~;~~AAAA,EACnE,6BAAmD,CAACA,EAAQ,QAAQ;AAAA,EACpE,8BAAoD,CAACA,EAAQ,QAAQ;AAAA,EACrE,uBAA6C,CAACA,EAAQ,QAAQ;AAAA,EAC9D,wBAA8C,CAACA,EAAQ,QAAQ;AAAA,EAC/D,uBAA6C,CAACA,EAAQ,QAAQ;AACjE;~~"}
1	+ {"version":3,"file":"pla-analytics-events.js","sources":["../../../../src/features/auth/pla-signup/pla-analytics-events.ts"],"sourcesContent":["import { PLUGINS } from '@cuemath/analytics-v2/dist/constants';\n\nexport enum PLA_ANALYTICS_EVENTS {\n START_SIGNUP_CTA_CLICKED = 'start_signup_cta_clicked',\n ECNA_STEP_VIEWED = 'ecna_step_viewed',\n ECNA_RESPONSE_RECORDED_DEBUG = 'ecna_response_recorded_debug',\n PARENT_SIGNUP_CTA_CLICKED = 'parent_signup_cta_clicked',\n PARENT_SIGNUP_SUCCESSFUL = 'parent_signup_successful',\n PARENT_SIGNUP_FAILED = 'parent_signup_failed',\n STUDENT_SIGNUP_SUCCESSFUL = 'signup_successful',\n STUDENT_SIGNUP_FAILED = 'signup_failed',\n SIGNUP_OTP_ENTERED = 'signup_otp_entered',\n SIGNUP_OTP_VERIFIED = 'signup_otp_verified',\n SIGNUP_OTP_FAILED = 'signup_otp_failed',\n SLOTS_SHOWN = 'slots_shown',\n SLOT_DATE_SELECTED = 'slot_date_selected',\n SLOT_TIME_SELECTED = 'slot_time_selected',\n TUTOR_CHANGE_REASON_SELECTED = 'tutor_change_reason_selected',\n}\n\nexport const PLA_ANALYTICS_WHITELIST_EVENTS = {\n [PLA_ANALYTICS_EVENTS.START_SIGNUP_CTA_CLICKED]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.ECNA_STEP_VIEWED]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.ECNA_RESPONSE_RECORDED_DEBUG]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.PARENT_SIGNUP_CTA_CLICKED]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.PARENT_SIGNUP_SUCCESSFUL]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.PARENT_SIGNUP_FAILED]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.STUDENT_SIGNUP_SUCCESSFUL]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.STUDENT_SIGNUP_FAILED]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.SIGNUP_OTP_ENTERED]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.SIGNUP_OTP_VERIFIED]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.SIGNUP_OTP_FAILED]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.SLOTS_SHOWN]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.SLOT_DATE_SELECTED]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.SLOT_TIME_SELECTED]: [PLUGINS.MIXPANEL],\n [PLA_ANALYTICS_EVENTS.TUTOR_CHANGE_REASON_SELECTED]: [PLUGINS.MIXPANEL],\n};\n"],"names":["PLA_ANALYTICS_EVENTS","PLA_ANALYTICS_WHITELIST_EVENTS","PLUGINS"],"mappings":";AAEY,IAAAA,sBAAAA,OACVA,EAAA,2BAA2B,4BAC3BA,EAAA,mBAAmB,oBACnBA,EAAA,+BAA+B,gCAC/BA,EAAA,4BAA4B,6BAC5BA,EAAA,2BAA2B,4BAC3BA,EAAA,uBAAuB,wBACvBA,EAAA,4BAA4B,qBAC5BA,EAAA,wBAAwB,iBACxBA,EAAA,qBAAqB,sBACrBA,EAAA,sBAAsB,uBACtBA,EAAA,oBAAoB,qBACpBA,EAAA,cAAc,eACdA,EAAA,qBAAqB,sBACrBA,EAAA,qBAAqB,sBACrBA,EAAA,+BAA+B,gCAfrBA,IAAAA,KAAA,CAAA,CAAA;AAkBL,MAAMC,IAAiC;AAAA,EAC3C,0BAAgD,CAACC,EAAQ,QAAQ;AAAA,EACjE,kBAAwC,CAACA,EAAQ,QAAQ;AAAA,EACzD,8BAAoD,CAACA,EAAQ,QAAQ;AAAA,EACrE,2BAAiD,CAACA,EAAQ,QAAQ;AAAA,EAClE,0BAAgD,CAACA,EAAQ,QAAQ;AAAA,EACjE,sBAA4C,CAACA,EAAQ,QAAQ;AAAA,EAC7D,mBAAiD,CAACA,EAAQ,QAAQ;AAAA,EAClE,eAA6C,CAACA,EAAQ,QAAQ;AAAA,EAC9D,oBAA0C,CAACA,EAAQ,QAAQ;AAAA,EAC3D,qBAA2C,CAACA,EAAQ,QAAQ;AAAA,EAC5D,mBAAyC,CAACA,EAAQ,QAAQ;AAAA,EAC1D,aAAmC,CAACA,EAAQ,QAAQ;AAAA,EACpD,oBAA0C,CAACA,EAAQ,QAAQ;AAAA,EAC3D,oBAA0C,CAACA,EAAQ,QAAQ;AAAA,EAC3D,8BAAoD,CAACA,EAAQ,QAAQ;AACxE;"}

package/dist/features/auth/signup/circular-step-wrapper/circular-step-wrapper.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"circular-step-wrapper.js","sources":["../../../../../src/features/auth/signup/circular-step-wrapper/circular-step-wrapper.tsx"],"sourcesContent":["import type { ILottieAnimationRef } from '../../../ui/lottie-animation/types';\nimport type { ICircularStepRef, ICircularStepWrapperProps } from './circular-step-wrapper-types';\n\nimport {\n forwardRef,\n useCallback,\n useEffect,\n useImperativeHandle,\n useLayoutEffect,\n useRef,\n useState,\n memo,\n type Ref,\n} from 'react';\nimport { useTheme } from 'styled-components';\n\nimport Back2Icon from '../../../../assets/line-icons/icons/back2';\nimport Next2Icon from '../../../../assets/line-icons/icons/next2';\nimport AnimatedArc from '../../../ui/animated-arc/animated-arc';\nimport IconButton from '../../../ui/buttons/icon-button/icon-button';\nimport FlexView from '../../../ui/layout/flex-view';\nimport LottieAnimation from '../../../ui/lottie-animation/lottie-animation';\nimport Separator from '../../../ui/separator/separator';\nimport Text from '../../../ui/text/text';\nimport { EDeviceType } from '../../../ui/theme/constants';\nimport * as Styled from './circular-step-wrapper-styled';\n\nconst animationSettings = {\n autoplay: false,\n loop: false,\n renderer: 'canvas',\n rendererSettings: {\n preserveAspectRatio: 'xMidYMin slice',\n },\n};\n\nconst CircularStepWrapper = forwardRef<ICircularStepRef, ICircularStepWrapperProps>(\n (\n {\n children,\n onGoBack,\n onNext,\n label,\n showNext,\n showPrevious,\n animation,\n introFrames,\n outroFrames,\n isNextLoading,\n progressAngle,\n footerElement,\n isNextDisabled,\n animationSrcMobile,\n },\n ref: Ref<ICircularStepRef>,\n ) => {\n const animationRef = useRef<ILottieAnimationRef \| null>(null);\n const containerRef = useRef<HTMLDivElement>(null);\n const [containerHeight, setContainerHeight] = useState<number \| undefined>();\n const [showContent, setShowContent] = useState(false);\n const timeoutRef = useRef<NodeJS.Timeout \| null>(null);\n const { device } = useTheme();\n const isMobile = device <= EDeviceType.MOBILE;\n\n const onLottieRender = useCallback(() => {\n if (animation && animationRef.current) {\n animationRef.current.playSegments(introFrames, true);\n setShowContent(true);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [animation]);\n\n useEffect(() => {\n return () => {\n if (timeoutRef.current) {\n clearTimeout(timeoutRef.current);\n }\n };\n }, [animation]);\n\n useImperativeHandle(ref, () => ({\n playOutroAndFadeOut: async () => {\n return new Promise<void>(resolve => {\n const handleComplete = () => {\n resolve();\n animationRef.current?.removeEventListener('complete', handleComplete);\n };\n\n animationRef.current?.playSegments(outroFrames, true);\n timeoutRef.current = setTimeout(() => setShowContent(false), 400);\n animationRef.current?.addEventListener('complete', handleComplete);\n });\n },\n }));\n\n useLayoutEffect(() => {\n if (containerRef.current) {\n setContainerHeight(containerRef.current.offsetHeight);\n }\n }, []);\n\n return (\n <Styled.Container\n $flex={1}\n $flexDirection=\"column\"\n $alignItems=\"center\"\n $justifyContent=\"center\"\n $width=\"100%\"\n $height=\"100%\"\n ref={containerRef}\n >\n {containerHeight && (\n <LottieAnimation\n width={1280}\n height={containerHeight}\n src={isMobile ? animationSrcMobile ?? animation : animation}\n ref={animationRef}\n onRender={onLottieRender}\n settings={animationSettings}\n />\n )}\n <Styled.CircularStepContainer\n $width={isMobile ? 290 : 400}\n $height={isMobile ? 290 : 400}\n $background=\"REAL_BLACK\"\n $alignItems=\"center\"\n $justifyContent=\"center\"\n >\n {progressAngle && (\n <AnimatedArc\n radius={isMobile ? 145 : 200}\n strokeWidth={2}\n color=\"WHITE\"\n targetAngle={progressAngle}\n mode=\"fade\"\n duration={1}\n />\n )}\n <Styled.ContentWrapper $isVisible={showContent} $width=\"100%\">\n {label && (\n <FlexView $gutterX={isMobile ? 1.5 : 3.5}>\n <Text $renderAs=\"ab2\" $color=\"WHITE\" $align=\"center\">\n {label}\n </Text>\n <Separator heightX={1} />\n </FlexView>\n )}\n <Styled.InputContainer>{children}</Styled.InputContainer>\n </Styled.ContentWrapper>\n </Styled.CircularStepContainer>\n {footerElement && (\n <Styled.FooterWrapper $alignItems=\"center\" $justifyContent=\"center\">\n {footerElement}\n </Styled.FooterWrapper>\n )}\n {showPrevious && (\n <Styled.PrevButtonWrapper>\n <IconButton\n Icon={Back2Icon}\n renderAs=\"black-dark\"\n analyticsLabel=\"Prev\"\n onClick={onGoBack}\n disabled={isNextLoading}\n size=\"small\"\n />\n </Styled.PrevButtonWrapper>\n )}\n {showNext && (\n <Styled.NextButtonWrapper>\n <IconButton\n size=\"small\"\n Icon={Next2Icon}\n renderAs=\"secondary-dark\"\n analyticsLabel=\"Next\"\n onClick={onNext}\n busy={isNextLoading}\n disabled={isNextLoading \|\| isNextDisabled}\n />\n </Styled.NextButtonWrapper>\n )}\n </Styled.Container>\n );\n },\n);\n\nexport default memo(CircularStepWrapper);\n"],"names":["animationSettings","CircularStepWrapper","forwardRef","children","onGoBack","onNext","label","showNext","showPrevious","animation","introFrames","outroFrames","isNextLoading","progressAngle","footerElement","isNextDisabled","animationSrcMobile","ref","animationRef","useRef","containerRef","containerHeight","setContainerHeight","useState","showContent","setShowContent","timeoutRef","device","useTheme","isMobile","EDeviceType","onLottieRender","useCallback","useEffect","useImperativeHandle","resolve","handleComplete","_a","_b","useLayoutEffect","jsxs","Styled.Container","jsx","LottieAnimation","Styled.CircularStepContainer","AnimatedArc","Styled.ContentWrapper","FlexView","Text","Separator","Styled.InputContainer","Styled.FooterWrapper","Styled.PrevButtonWrapper","IconButton","Back2Icon","Styled.NextButtonWrapper","Next2Icon","~~CircularStepWrapper$1~~","memo"],"mappings":"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"}
1	+ {"version":3,"file":"circular-step-wrapper.js","sources":["../../../../../src/features/auth/signup/circular-step-wrapper/circular-step-wrapper.tsx"],"sourcesContent":["import type { ILottieAnimationRef } from '../../../ui/lottie-animation/types';\nimport type { ICircularStepRef, ICircularStepWrapperProps } from './circular-step-wrapper-types';\n\nimport {\n forwardRef,\n useCallback,\n useEffect,\n useImperativeHandle,\n useLayoutEffect,\n useRef,\n useState,\n memo,\n type Ref,\n} from 'react';\nimport { useTheme } from 'styled-components';\n\nimport Back2Icon from '../../../../assets/line-icons/icons/back2';\nimport Next2Icon from '../../../../assets/line-icons/icons/next2';\nimport AnimatedArc from '../../../ui/animated-arc/animated-arc';\nimport IconButton from '../../../ui/buttons/icon-button/icon-button';\nimport FlexView from '../../../ui/layout/flex-view';\nimport LottieAnimation from '../../../ui/lottie-animation/lottie-animation';\nimport Separator from '../../../ui/separator/separator';\nimport Text from '../../../ui/text/text';\nimport { EDeviceType } from '../../../ui/theme/constants';\nimport * as Styled from './circular-step-wrapper-styled';\n\nconst animationSettings = {\n autoplay: false,\n loop: false,\n renderer: 'canvas',\n rendererSettings: {\n preserveAspectRatio: 'xMidYMin slice',\n },\n};\n\nconst CircularStepWrapper = forwardRef<ICircularStepRef, ICircularStepWrapperProps>(\n (\n {\n children,\n onGoBack,\n onNext,\n label,\n showNext,\n showPrevious,\n animation,\n introFrames,\n outroFrames,\n isNextLoading,\n progressAngle,\n footerElement,\n isNextDisabled,\n animationSrcMobile,\n },\n ref: Ref<ICircularStepRef>,\n ) => {\n const animationRef = useRef<ILottieAnimationRef \| null>(null);\n const containerRef = useRef<HTMLDivElement>(null);\n const [containerHeight, setContainerHeight] = useState<number \| undefined>();\n const [showContent, setShowContent] = useState(false);\n const timeoutRef = useRef<NodeJS.Timeout \| null>(null);\n const { device } = useTheme();\n const isMobile = device <= EDeviceType.MOBILE;\n\n const onLottieRender = useCallback(() => {\n if (animation && animationRef.current) {\n animationRef.current.playSegments(introFrames, true);\n setShowContent(true);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [animation]);\n\n useEffect(() => {\n return () => {\n if (timeoutRef.current) {\n clearTimeout(timeoutRef.current);\n }\n };\n }, [animation]);\n\n useImperativeHandle(ref, () => ({\n playOutroAndFadeOut: async () => {\n return new Promise<void>(resolve => {\n const handleComplete = () => {\n resolve();\n animationRef.current?.removeEventListener('complete', handleComplete);\n };\n\n animationRef.current?.playSegments(outroFrames, true);\n timeoutRef.current = setTimeout(() => setShowContent(false), 400);\n animationRef.current?.addEventListener('complete', handleComplete);\n });\n },\n }));\n\n useLayoutEffect(() => {\n if (containerRef.current) {\n setContainerHeight(containerRef.current.offsetHeight);\n }\n }, []);\n\n return (\n <Styled.Container\n $flex={1}\n $flexDirection=\"column\"\n $alignItems=\"center\"\n $justifyContent=\"center\"\n $width=\"100%\"\n $height=\"100%\"\n ref={containerRef}\n >\n {containerHeight && (\n <LottieAnimation\n width={1280}\n height={containerHeight}\n src={isMobile ? animationSrcMobile ?? animation : animation}\n ref={animationRef}\n onRender={onLottieRender}\n settings={animationSettings}\n />\n )}\n <Styled.CircularStepContainer\n $width={isMobile ? 290 : 400}\n $height={isMobile ? 290 : 400}\n $background=\"REAL_BLACK\"\n $alignItems=\"center\"\n $justifyContent=\"center\"\n >\n {progressAngle && (\n <AnimatedArc\n radius={isMobile ? 145 : 200}\n strokeWidth={2}\n color=\"WHITE\"\n targetAngle={progressAngle}\n mode=\"fade\"\n duration={1}\n />\n )}\n <Styled.ContentWrapper $isVisible={showContent} $width=\"100%\">\n {label && (\n <FlexView $gutterX={isMobile ? 1.5 : 3.5}>\n <Text $renderAs=\"ab2\" $color=\"WHITE\" $align=\"center\">\n {label}\n </Text>\n <Separator heightX={1} />\n </FlexView>\n )}\n <Styled.InputContainer>{children}</Styled.InputContainer>\n </Styled.ContentWrapper>\n </Styled.CircularStepContainer>\n {footerElement && (\n <Styled.FooterWrapper $alignItems=\"center\" $justifyContent=\"center\">\n {footerElement}\n </Styled.FooterWrapper>\n )}\n {showPrevious && (\n <Styled.PrevButtonWrapper>\n <IconButton\n Icon={Back2Icon}\n renderAs=\"black-dark\"\n analyticsLabel=\"Prev\"\n onClick={onGoBack}\n disabled={isNextLoading}\n size=\"small\"\n />\n </Styled.PrevButtonWrapper>\n )}\n {showNext && (\n <Styled.NextButtonWrapper>\n <IconButton\n size=\"small\"\n Icon={Next2Icon}\n renderAs=\"secondary-dark\"\n analyticsLabel=\"Next\"\n onClick={onNext}\n busy={isNextLoading}\n disabled={isNextLoading \|\| isNextDisabled}\n />\n </Styled.NextButtonWrapper>\n )}\n </Styled.Container>\n );\n },\n);\n\nexport default memo(CircularStepWrapper);\n"],"names":["animationSettings","CircularStepWrapper","forwardRef","children","onGoBack","onNext","label","showNext","showPrevious","animation","introFrames","outroFrames","isNextLoading","progressAngle","footerElement","isNextDisabled","animationSrcMobile","ref","animationRef","useRef","containerRef","containerHeight","setContainerHeight","useState","showContent","setShowContent","timeoutRef","device","useTheme","isMobile","EDeviceType","onLottieRender","useCallback","useEffect","useImperativeHandle","resolve","handleComplete","_a","_b","useLayoutEffect","jsxs","Styled.Container","jsx","LottieAnimation","Styled.CircularStepContainer","AnimatedArc","Styled.ContentWrapper","FlexView","Text","Separator","Styled.InputContainer","Styled.FooterWrapper","Styled.PrevButtonWrapper","IconButton","Back2Icon","Styled.NextButtonWrapper","Next2Icon","circularStepWrapper","memo"],"mappings":"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"}

package/dist/features/auth/signup/custom-input-field/custom-input-field.js CHANGED Viewed

@@ -13,12 +13,12 @@ const q = ({
   error: u,
   helperText: b,
   onEnter: n,
-  isLoading: $,
+  isLoading: D,
   isValid: h,
   type: t = "text",
-  placeholder: D,
-  actionElement: F,
-  maxLength: R,
+  placeholder: F,
+  actionElement: R,
+  maxLength: $,
   width: E,
   textTransform: P,
   textAlign: v = "center",
@@ -56,8 +56,8 @@ const q = ({
     X,
     {
       helperText: u || b,
-      isLoading: $,
-      actionElement: F,
+      isLoading: D,
+      actionElement: R,
       children: /* @__PURE__ */ K(
         B,
         {
@@ -75,13 +75,13 @@ const q = ({
                 value: r,
                 onChange: G,
                 autoFocus: !0,
-                placeholder: D,
+                placeholder: F,
                 color: z,
                 autoCapitalize: "none",
                 textTransform: P,
                 type: y,
                 onKeyDown: k,
-                maxLength: R,
+                maxLength: $,
                 align: v,
                 fontSize: j
               }

package/dist/features/auth/signup/custom-input-field/custom-input-field.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"custom-input-field.js","sources":["../../../../../src/features/auth/signup/custom-input-field/custom-input-field.tsx"],"sourcesContent":["import type { ICustomInputFieldProps } from './custom-input-field-types';\n\nimport {\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n memo,\n type FC,\n type KeyboardEvent,\n type ChangeEvent,\n} from 'react';\nimport { useTheme } from 'styled-components';\n\nimport FlexView from '../../../ui/layout/flex-view';\nimport { EDeviceType } from '../../../ui/theme/constants';\nimport PhoneCountrySelector from './country-selector/country-selector';\nimport * as Styled from './custom-input-field-styled';\nimport InputWrapper from './input-wrapper/input-wrapper';\nimport PasswordToggleIcon from './password-toggle/password-toggle';\n\nconst CustomInputField: FC<ICustomInputFieldProps> = ({\n value,\n onChange,\n error,\n helperText,\n onEnter,\n isLoading,\n isValid,\n type = 'text',\n placeholder,\n actionElement,\n maxLength,\n width,\n textTransform,\n textAlign = 'center',\n selectedCountry,\n onCountryChange,\n autoSize = false,\n}) => {\n const theme = useTheme();\n const isMobile = theme.device <= EDeviceType.MOBILE;\n const [isPasswordVisible, setIsPasswordVisible] = useState(false);\n const [fontSize, setFontSize] = useState(isMobile ? 24 : 32);\n const inputRef = useRef<HTMLInputElement>(null);\n const canvasRef = useRef<HTMLCanvasElement \| null>(null);\n\n const handleKeyDown = useCallback(\n (event: KeyboardEvent<HTMLInputElement>) => {\n if (event.key === 'Enter') {\n onEnter?.();\n }\n },\n [onEnter],\n );\n\n const inputType = useMemo(() => {\n if (type === 'password') return isPasswordVisible ? 'text' : 'password';\n\n if (type === 'phone') return 'number';\n\n return type;\n }, [type, isPasswordVisible]);\n\n const inputColor = useMemo(() => {\n if (error) return theme.colors.RED;\n\n if (isValid) return theme.colors.GREEN_4;\n\n return theme.colors.WHITE;\n }, [error, isValid, theme.colors]);\n\n const measureTextWidth = useCallback((text: string, font: string): number => {\n if (!canvasRef.current) {\n canvasRef.current = document.createElement('canvas');\n }\n\n const context = canvasRef.current.getContext('2d');\n\n if (!context) return 0;\n\n context.font = font;\n\n return context.measureText(text).width;\n }, []);\n\n useEffect(() => {\n if (!inputRef.current \|\| !value \|\| !autoSize) {\n return;\n }\n\n if (isMobile) {\n setFontSize(24);\n\n return;\n }\n\n const inputWidth = inputRef.current.clientWidth;\n\n const font32 = \"32px 'Athletics-Light'\";\n\n const textWidth32 = measureTextWidth(value, font32);\n\n if (textWidth32 > inputWidth) {\n setFontSize(24);\n } else {\n setFontSize(32);\n }\n }, [value, measureTextWidth, autoSize, isMobile]);\n\n useEffect(() => {\n return () => {\n canvasRef.current = null;\n };\n }, []);\n\n const handleChange = useCallback(\n (event: ChangeEvent<HTMLInputElement>) => onChange(event.target.value),\n [onChange],\n );\n\n return (\n <InputWrapper\n helperText={error \|\| helperText}\n isLoading={isLoading}\n actionElement={actionElement}\n >\n <FlexView\n $width={width ?? '100%'}\n $flex={1}\n $alignItems=\"center\"\n $flexDirection=\"row\"\n $flexGapX={0.5}\n >\n {type === 'phone' && (\n <PhoneCountrySelector onChange={onCountryChange} value={selectedCountry} />\n )}\n <Styled.CustomInput\n ref={inputRef}\n value={value}\n onChange={handleChange}\n autoFocus\n placeholder={placeholder}\n color={inputColor}\n autoCapitalize=\"none\"\n textTransform={textTransform}\n type={inputType}\n onKeyDown={handleKeyDown}\n maxLength={maxLength}\n align={textAlign}\n fontSize={fontSize}\n />\n {type === 'password' && (\n <PasswordToggleIcon\n isVisible={isPasswordVisible}\n onToggle={() => setIsPasswordVisible(prev => !prev)}\n />\n )}\n </FlexView>\n </InputWrapper>\n );\n};\n\nexport default memo(CustomInputField);\n"],"names":["CustomInputField","value","onChange","error","helperText","onEnter","isLoading","isValid","type","placeholder","actionElement","maxLength","width","textTransform","textAlign","selectedCountry","onCountryChange","autoSize","theme","useTheme","isMobile","EDeviceType","isPasswordVisible","setIsPasswordVisible","useState","fontSize","setFontSize","inputRef","useRef","canvasRef","handleKeyDown","useCallback","event","inputType","useMemo","inputColor","measureTextWidth","text","font","context","useEffect","inputWidth","handleChange","jsx","InputWrapper","jsxs","FlexView","PhoneCountrySelector","Styled.CustomInput","PasswordToggleIcon","prev","~~CustomInputField$1~~","memo"],"mappings":"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"}
1	+ {"version":3,"file":"custom-input-field.js","sources":["../../../../../src/features/auth/signup/custom-input-field/custom-input-field.tsx"],"sourcesContent":["import type { ICustomInputFieldProps } from './custom-input-field-types';\n\nimport {\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n memo,\n type FC,\n type KeyboardEvent,\n type ChangeEvent,\n} from 'react';\nimport { useTheme } from 'styled-components';\n\nimport FlexView from '../../../ui/layout/flex-view';\nimport { EDeviceType } from '../../../ui/theme/constants';\nimport PhoneCountrySelector from './country-selector/country-selector';\nimport * as Styled from './custom-input-field-styled';\nimport InputWrapper from './input-wrapper/input-wrapper';\nimport PasswordToggleIcon from './password-toggle/password-toggle';\n\nconst CustomInputField: FC<ICustomInputFieldProps> = ({\n value,\n onChange,\n error,\n helperText,\n onEnter,\n isLoading,\n isValid,\n type = 'text',\n placeholder,\n actionElement,\n maxLength,\n width,\n textTransform,\n textAlign = 'center',\n selectedCountry,\n onCountryChange,\n autoSize = false,\n}) => {\n const theme = useTheme();\n const isMobile = theme.device <= EDeviceType.MOBILE;\n const [isPasswordVisible, setIsPasswordVisible] = useState(false);\n const [fontSize, setFontSize] = useState(isMobile ? 24 : 32);\n const inputRef = useRef<HTMLInputElement>(null);\n const canvasRef = useRef<HTMLCanvasElement \| null>(null);\n\n const handleKeyDown = useCallback(\n (event: KeyboardEvent<HTMLInputElement>) => {\n if (event.key === 'Enter') {\n onEnter?.();\n }\n },\n [onEnter],\n );\n\n const inputType = useMemo(() => {\n if (type === 'password') return isPasswordVisible ? 'text' : 'password';\n\n if (type === 'phone') return 'number';\n\n return type;\n }, [type, isPasswordVisible]);\n\n const inputColor = useMemo(() => {\n if (error) return theme.colors.RED;\n\n if (isValid) return theme.colors.GREEN_4;\n\n return theme.colors.WHITE;\n }, [error, isValid, theme.colors]);\n\n const measureTextWidth = useCallback((text: string, font: string): number => {\n if (!canvasRef.current) {\n canvasRef.current = document.createElement('canvas');\n }\n\n const context = canvasRef.current.getContext('2d');\n\n if (!context) return 0;\n\n context.font = font;\n\n return context.measureText(text).width;\n }, []);\n\n useEffect(() => {\n if (!inputRef.current \|\| !value \|\| !autoSize) {\n return;\n }\n\n if (isMobile) {\n setFontSize(24);\n\n return;\n }\n\n const inputWidth = inputRef.current.clientWidth;\n\n const font32 = \"32px 'Athletics-Light'\";\n\n const textWidth32 = measureTextWidth(value, font32);\n\n if (textWidth32 > inputWidth) {\n setFontSize(24);\n } else {\n setFontSize(32);\n }\n }, [value, measureTextWidth, autoSize, isMobile]);\n\n useEffect(() => {\n return () => {\n canvasRef.current = null;\n };\n }, []);\n\n const handleChange = useCallback(\n (event: ChangeEvent<HTMLInputElement>) => onChange(event.target.value),\n [onChange],\n );\n\n return (\n <InputWrapper\n helperText={error \|\| helperText}\n isLoading={isLoading}\n actionElement={actionElement}\n >\n <FlexView\n $width={width ?? '100%'}\n $flex={1}\n $alignItems=\"center\"\n $flexDirection=\"row\"\n $flexGapX={0.5}\n >\n {type === 'phone' && (\n <PhoneCountrySelector onChange={onCountryChange} value={selectedCountry} />\n )}\n <Styled.CustomInput\n ref={inputRef}\n value={value}\n onChange={handleChange}\n autoFocus\n placeholder={placeholder}\n color={inputColor}\n autoCapitalize=\"none\"\n textTransform={textTransform}\n type={inputType}\n onKeyDown={handleKeyDown}\n maxLength={maxLength}\n align={textAlign}\n fontSize={fontSize}\n />\n {type === 'password' && (\n <PasswordToggleIcon\n isVisible={isPasswordVisible}\n onToggle={() => setIsPasswordVisible(prev => !prev)}\n />\n )}\n </FlexView>\n </InputWrapper>\n );\n};\n\nexport default memo(CustomInputField);\n"],"names":["CustomInputField","value","onChange","error","helperText","onEnter","isLoading","isValid","type","placeholder","actionElement","maxLength","width","textTransform","textAlign","selectedCountry","onCountryChange","autoSize","theme","useTheme","isMobile","EDeviceType","isPasswordVisible","setIsPasswordVisible","useState","fontSize","setFontSize","inputRef","useRef","canvasRef","handleKeyDown","useCallback","event","inputType","useMemo","inputColor","measureTextWidth","text","font","context","useEffect","inputWidth","handleChange","jsx","InputWrapper","jsxs","FlexView","PhoneCountrySelector","Styled.CustomInput","PasswordToggleIcon","prev","customInputField","memo"],"mappings":"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"}

package/dist/features/circle-games/sign-up/comp/circular-steps/circular-steps.js CHANGED Viewed

@@ -1,11 +1,11 @@
-import { jsx as e, Fragment as S, jsxs as c } from "react/jsx-runtime";
-import { useRef as m, useCallback as k } from "react";
+import { jsx as e, Fragment as k, jsxs as c } from "react/jsx-runtime";
+import { useRef as m, useCallback as S } from "react";
 import B from "../../../../../assets/line-icons/icons/circle-back.js";
 import { LOTTIE as R } from "../../../../../assets/lottie/lottie.js";
 import A from "../../../../ui/lottie-animation/lottie-animation.js";
 import I from "../../../../ui/text/text.js";
-import { BackgroundImage as P, ScreenWrapper as b, TransparentIconButton as L, CircularStepsContainer as T, CircularStepsWrapper as $, CustEleContainer as q, CircularProgressContainer as v, CircularProgress as w, Label as F, CustomDataContainer as M } from "./circular-steps-styled.js";
-import { TOTAL_FRAMES as W } from "./constants.js";
+import { BackgroundImage as P, ScreenWrapper as b, TransparentIconButton as L, CircularStepsContainer as T, CircularStepsWrapper as q, CustEleContainer as v, CircularProgressContainer as F, CircularProgress as w, Label as M, CustomDataContainer as W } from "./circular-steps-styled.js";
+import { TOTAL_FRAMES as $ } from "./constants.js";
 const j = ({ img: n }) => /* @__PURE__ */ e(P, { children: n }), x = {
   autoplay: !1,
   loop: !1,
@@ -14,18 +14,18 @@ const j = ({ img: n }) => /* @__PURE__ */ e(P, { children: n }), x = {
   const { width: s, height: u } = d, r = n[t], l = m(null), a = m(-1), g = () => {
     var o, i;
     (i = (o = n[t]) == null ? void 0 : o.onBack) == null || i.call(o);
-  }, h = k(() => {
+  }, h = S(() => {
     if (l.current && (r != null && r.isProgressAnimationRequired)) {
-      const o = n.filter((E) => E.isProgressAnimationRequired), i = W / o.length, p = a.current >= 0 ? a.current : 0, f = Math.round(p * i + 1), C = Math.round(t * i);
+      const o = n.filter((E) => E.isProgressAnimationRequired), i = $ / o.length, p = a.current >= 0 ? a.current : 0, f = Math.round(p * i + 1), C = Math.round(t * i);
       a.current = t, l.current.playSegments([f, C], !0);
     }
   }, [t, r == null ? void 0 : r.isProgressAnimationRequired, n]);
-  return /* @__PURE__ */ e(S, { children: r ? /* @__PURE__ */ c(b, { width: s, height: u, children: [
+  return /* @__PURE__ */ e(k, { children: r ? /* @__PURE__ */ c(b, { width: s, height: u, children: [
     r.onBack ? /* @__PURE__ */ e(L, { children: /* @__PURE__ */ e(B, { onClick: g }) }) : null,
     r.background ? /* @__PURE__ */ e(j, { img: r.background }) : null,
-    /* @__PURE__ */ e(T, { children: /* @__PURE__ */ c($, { children: [
-      r.custEle ? /* @__PURE__ */ e(q, { children: r.custEle }) : null,
-      r.custEleInsideStep ? /* @__PURE__ */ c(v, { width: s, height: u, children: [
+    /* @__PURE__ */ e(T, { children: /* @__PURE__ */ c(q, { children: [
+      r.custEle ? /* @__PURE__ */ e(v, { children: r.custEle }) : null,
+      r.custEleInsideStep ? /* @__PURE__ */ c(F, { width: s, height: u, children: [
         r.isProgressAnimationRequired ? /* @__PURE__ */ e(w, { children: /* @__PURE__ */ e(
           A,
           {
@@ -35,11 +35,11 @@ const j = ({ img: n }) => /* @__PURE__ */ e(P, { children: n }), x = {
             onRender: h
           }
         ) }) : null,
-        r.label ? /* @__PURE__ */ e(F, { children: /* @__PURE__ */ e(I, { $renderAs: "ab2", $align: "center", $color: "WHITE", $whiteSpace: "pre", children: r.label }) }) : null,
+        r.label ? /* @__PURE__ */ e(M, { children: /* @__PURE__ */ e(I, { $renderAs: "ab2", $color: "WHITE", children: r.label }) }) : null,
         r.custEleInsideStep
       ] }) : null
     ] }) }),
-    r.custEleBelowStep ? /* @__PURE__ */ e(M, { children: r.custEleBelowStep }) : null
+    r.custEleBelowStep ? /* @__PURE__ */ e(W, { children: r.custEleBelowStep }) : null
   ] }) : null });
 };
 export {

package/dist/features/circle-games/sign-up/comp/circular-steps/circular-steps.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"circular-steps.js","sources":["../../../../../../src/features/circle-games/sign-up/comp/circular-steps/circular-steps.tsx"],"sourcesContent":["import type { ILottieAnimationRef } from '../../../../ui/lottie-animation/types';\nimport type { ICircularStepsProps } from './circular-steps-types';\nimport type { FC } from 'react';\n\nimport { useCallback, useRef } from 'react';\n\nimport CircleBackIcon from '../../../../../assets/line-icons/icons/circle-back';\nimport { LOTTIE } from '../../../../../assets/lottie/lottie';\nimport LottieAnimation from '../../../../ui/lottie-animation/lottie-animation';\nimport Text from '../../../../ui/text/text';\nimport * as Styled from './circular-steps-styled';\nimport { TOTAL_FRAMES } from './constants';\n\nexport const BackgroundImage = ({ img }: { img: React.ReactNode }) => {\n return <Styled.BackgroundImage>{img}</Styled.BackgroundImage>;\n};\n\nconst animationSettings = {\n autoplay: false,\n loop: false,\n renderer: 'canvas',\n};\n\nexport const CircularSteps: FC<ICircularStepsProps> = ({ steps, currentStepIndex, dimensions }) => {\n const { width, height } = dimensions;\n\n const step = steps[currentStepIndex];\n const animationRef = useRef<ILottieAnimationRef \| null>(null);\n const previousStepIndex = useRef<number>(-1);\n\n const handleBack = () => {\n steps[currentStepIndex]?.onBack?.();\n };\n\n const onLottieRender = useCallback(() => {\n if (animationRef.current && step?.isProgressAnimationRequired) {\n const actualSteps = steps.filter(_step => _step.isProgressAnimationRequired);\n const stepSize = TOTAL_FRAMES / actualSteps.length;\n\n const validPreviousIndex = previousStepIndex.current >= 0 ? previousStepIndex.current : 0;\n\n const fromFrame = Math.round(validPreviousIndex * stepSize + 1);\n const toFrame = Math.round(currentStepIndex * stepSize);\n\n previousStepIndex.current = currentStepIndex;\n animationRef.current.playSegments([fromFrame, toFrame], true);\n }\n }, [currentStepIndex, step?.isProgressAnimationRequired, steps]);\n\n return (\n <>\n {step ? (\n <Styled.ScreenWrapper width={width} height={height}>\n {step.onBack ? (\n <Styled.TransparentIconButton>\n <CircleBackIcon onClick={handleBack} />\n </Styled.TransparentIconButton>\n ) : null}\n {step.background ? <BackgroundImage img={step.background} /> : null}\n <Styled.CircularStepsContainer>\n <Styled.CircularStepsWrapper>\n {step.custEle ? (\n <Styled.CustEleContainer>{step.custEle}</Styled.CustEleContainer>\n ) : null}\n\n {/circular data container/}\n {step.custEleInsideStep ? (\n <Styled.CircularProgressContainer width={width} height={height}>\n {step.isProgressAnimationRequired ? (\n <Styled.CircularProgress>\n <LottieAnimation\n ref={animationRef}\n src={LOTTIE.LEVELUP_RINGS}\n settings={animationSettings}\n onRender={onLottieRender}\n />\n </Styled.CircularProgress>\n ) : null}\n\n {step.label ? (\n <Styled.Label>\n <Text $renderAs=\"ab2\" $~~align=\"center\" $~~color=\"WHITE\" ~~$whiteSpace=\"pre\"~~>\n {step.label}\n </Text>\n </Styled.Label>\n ) : null}\n {step.custEleInsideStep}\n </Styled.CircularProgressContainer>\n ) : null}\n </Styled.CircularStepsWrapper>\n </Styled.CircularStepsContainer>\n {/* custom data container below circle */}\n {step.custEleBelowStep ? (\n <Styled.CustomDataContainer>{step.custEleBelowStep}</Styled.CustomDataContainer>\n ) : null}\n </Styled.ScreenWrapper>\n ) : null}\n </>\n );\n};\n"],"names":["BackgroundImage","img","jsx","Styled.BackgroundImage","animationSettings","CircularSteps","steps","currentStepIndex","dimensions","width","height","step","animationRef","useRef","previousStepIndex","handleBack","_b","_a","onLottieRender","useCallback","actualSteps","_step","stepSize","TOTAL_FRAMES","validPreviousIndex","fromFrame","toFrame","jsxs","Styled.ScreenWrapper","Styled.TransparentIconButton","CircleBackIcon","Styled.CircularStepsContainer","Styled.CircularStepsWrapper","Styled.CustEleContainer","Styled.CircularProgressContainer","Styled.CircularProgress","LottieAnimation","LOTTIE","Styled.Label","Text","Styled.CustomDataContainer"],"mappings":";;;;;;;;AAaO,MAAMA,IAAkB,CAAC,EAAE,KAAAC,QACxB,gBAAAC,EAAAC,GAAA,EAAwB,UAAIF,EAAA,CAAA,GAGhCG,IAAoB;AAAA,EACxB,UAAU;AAAA,EACV,MAAM;AAAA,EACN,UAAU;AACZ,GAEaC,IAAyC,CAAC,EAAE,OAAAC,GAAO,kBAAAC,GAAkB,YAAAC,QAAiB;AAC3F,QAAA,EAAE,OAAAC,GAAO,QAAAC,EAAW,IAAAF,GAEpBG,IAAOL,EAAMC,CAAgB,GAC7BK,IAAeC,EAAmC,IAAI,GACtDC,IAAoBD,EAAe,EAAE,GAErCE,IAAa,MAAM;;AACjB,KAAAC,KAAAC,IAAAX,EAAAC,CAAgB,MAAhB,gBAAAU,EAAmB,WAAnB,QAAAD,EAAA,KAAAC;AAAA,EAA4B,GAG9BC,IAAiBC,EAAY,MAAM;AACnC,QAAAP,EAAa,YAAWD,KAAA,QAAAA,EAAM,8BAA6B;AAC7D,YAAMS,IAAcd,EAAM,OAAO,CAAAe,MAASA,EAAM,2BAA2B,GACrEC,IAAWC,IAAeH,EAAY,QAEtCI,IAAqBV,EAAkB,WAAW,IAAIA,EAAkB,UAAU,GAElFW,IAAY,KAAK,MAAMD,IAAqBF,IAAW,CAAC,GACxDI,IAAU,KAAK,MAAMnB,IAAmBe,CAAQ;AAEtD,MAAAR,EAAkB,UAAUP,GAC5BK,EAAa,QAAQ,aAAa,CAACa,GAAWC,CAAO,GAAG,EAAI;AAAA,IAC9D;AAAA,KACC,CAACnB,GAAkBI,KAAA,gBAAAA,EAAM,6BAA6BL,CAAK,CAAC;AAE/D,gCAEK,UACCK,IAAA,gBAAAgB,EAACC,GAAA,EAAqB,OAAAnB,GAAc,QAAAC,GACjC,UAAA;AAAA,IAAKC,EAAA,SACH,gBAAAT,EAAA2B,GAAA,EACC,4BAACC,GAAe,EAAA,SAASf,GAAY,EAAA,CACvC,IACE;AAAA,IACHJ,EAAK,aAAa,gBAAAT,EAACF,KAAgB,KAAKW,EAAK,WAAY,CAAA,IAAK;AAAA,sBAC9DoB,GAAA,EACC,UAAC,gBAAAJ,EAAAK,GAAA,EACE,UAAA;AAAA,MAAArB,EAAK,UACH,gBAAAT,EAAA+B,GAAA,EAAyB,UAAAtB,EAAK,QAAQ,CAAA,IACrC;AAAA,MAGHA,EAAK,oBACJ,gBAAAgB,EAACO,GAAA,EAAiC,OAAAzB,GAAc,QAAAC,GAC7C,UAAA;AAAA,QAAAC,EAAK,8BACJ,gBAAAT,EAACiC,GAAA,EACC,UAAA,gBAAAjC;AAAA,UAACkC;AAAA,UAAA;AAAA,YACC,KAAKxB;AAAA,YACL,KAAKyB,EAAO;AAAA,YACZ,UAAUjC;AAAA,YACV,UAAUc;AAAA,UAAA;AAAA,WAEd,IACE;AAAA,QAEHP,EAAK,~~QACJ~~,gBAAAT,~~EAACoC~~,GAAA,EACC,~~4BAACC~~,GAAK,EAAA,WAAU,OAAM,QAAO,~~UAAS~~,~~QAAO,SAAQ,aAAY,OAC9D,~~UAAK5B,EAAA,~~MAAA~~,~~CACR~~,EACF,CAAA,IACE;AAAA,QACHA,EAAK;AAAA,MAAA,EAAA,CACR,IACE;AAAA,IAAA,EAAA,CACN,EACF,CAAA;AAAA,IAECA,EAAK,mBACH,gBAAAT,EAAAsC,GAAA,EAA4B,UAAA7B,EAAK,iBAAiB,CAAA,IACjD;AAAA,EAAA,GACN,IACE,KACN,CAAA;AAEJ;"}
1	+ {"version":3,"file":"circular-steps.js","sources":["../../../../../../src/features/circle-games/sign-up/comp/circular-steps/circular-steps.tsx"],"sourcesContent":["import type { ILottieAnimationRef } from '../../../../ui/lottie-animation/types';\nimport type { ICircularStepsProps } from './circular-steps-types';\nimport type { FC } from 'react';\n\nimport { useCallback, useRef } from 'react';\n\nimport CircleBackIcon from '../../../../../assets/line-icons/icons/circle-back';\nimport { LOTTIE } from '../../../../../assets/lottie/lottie';\nimport LottieAnimation from '../../../../ui/lottie-animation/lottie-animation';\nimport Text from '../../../../ui/text/text';\nimport * as Styled from './circular-steps-styled';\nimport { TOTAL_FRAMES } from './constants';\n\nexport const BackgroundImage = ({ img }: { img: React.ReactNode }) => {\n return <Styled.BackgroundImage>{img}</Styled.BackgroundImage>;\n};\n\nconst animationSettings = {\n autoplay: false,\n loop: false,\n renderer: 'canvas',\n};\n\nexport const CircularSteps: FC<ICircularStepsProps> = ({ steps, currentStepIndex, dimensions }) => {\n const { width, height } = dimensions;\n\n const step = steps[currentStepIndex];\n const animationRef = useRef<ILottieAnimationRef \| null>(null);\n const previousStepIndex = useRef<number>(-1);\n\n const handleBack = () => {\n steps[currentStepIndex]?.onBack?.();\n };\n\n const onLottieRender = useCallback(() => {\n if (animationRef.current && step?.isProgressAnimationRequired) {\n const actualSteps = steps.filter(_step => _step.isProgressAnimationRequired);\n const stepSize = TOTAL_FRAMES / actualSteps.length;\n\n const validPreviousIndex = previousStepIndex.current >= 0 ? previousStepIndex.current : 0;\n\n const fromFrame = Math.round(validPreviousIndex * stepSize + 1);\n const toFrame = Math.round(currentStepIndex * stepSize);\n\n previousStepIndex.current = currentStepIndex;\n animationRef.current.playSegments([fromFrame, toFrame], true);\n }\n }, [currentStepIndex, step?.isProgressAnimationRequired, steps]);\n\n return (\n <>\n {step ? (\n <Styled.ScreenWrapper width={width} height={height}>\n {step.onBack ? (\n <Styled.TransparentIconButton>\n <CircleBackIcon onClick={handleBack} />\n </Styled.TransparentIconButton>\n ) : null}\n {step.background ? <BackgroundImage img={step.background} /> : null}\n <Styled.CircularStepsContainer>\n <Styled.CircularStepsWrapper>\n {step.custEle ? (\n <Styled.CustEleContainer>{step.custEle}</Styled.CustEleContainer>\n ) : null}\n\n {/circular data container/}\n {step.custEleInsideStep ? (\n <Styled.CircularProgressContainer width={width} height={height}>\n {step.isProgressAnimationRequired ? (\n <Styled.CircularProgress>\n <LottieAnimation\n ref={animationRef}\n src={LOTTIE.LEVELUP_RINGS}\n settings={animationSettings}\n onRender={onLottieRender}\n />\n </Styled.CircularProgress>\n ) : null}\n\n {step.label ? (\n <Styled.Label>\n <Text $renderAs=\"ab2\" $color=\"WHITE\">\n {step.label}\n </Text>\n </Styled.Label>\n ) : null}\n {step.custEleInsideStep}\n </Styled.CircularProgressContainer>\n ) : null}\n </Styled.CircularStepsWrapper>\n </Styled.CircularStepsContainer>\n {/* custom data container below circle */}\n {step.custEleBelowStep ? (\n <Styled.CustomDataContainer>{step.custEleBelowStep}</Styled.CustomDataContainer>\n ) : null}\n </Styled.ScreenWrapper>\n ) : null}\n </>\n );\n};\n"],"names":["BackgroundImage","img","jsx","Styled.BackgroundImage","animationSettings","CircularSteps","steps","currentStepIndex","dimensions","width","height","step","animationRef","useRef","previousStepIndex","handleBack","_b","_a","onLottieRender","useCallback","actualSteps","_step","stepSize","TOTAL_FRAMES","validPreviousIndex","fromFrame","toFrame","jsxs","Styled.ScreenWrapper","Styled.TransparentIconButton","CircleBackIcon","Styled.CircularStepsContainer","Styled.CircularStepsWrapper","Styled.CustEleContainer","Styled.CircularProgressContainer","Styled.CircularProgress","LottieAnimation","LOTTIE","Styled.Label","Text","Styled.CustomDataContainer"],"mappings":";;;;;;;;AAaO,MAAMA,IAAkB,CAAC,EAAE,KAAAC,QACxB,gBAAAC,EAAAC,GAAA,EAAwB,UAAIF,EAAA,CAAA,GAGhCG,IAAoB;AAAA,EACxB,UAAU;AAAA,EACV,MAAM;AAAA,EACN,UAAU;AACZ,GAEaC,IAAyC,CAAC,EAAE,OAAAC,GAAO,kBAAAC,GAAkB,YAAAC,QAAiB;AAC3F,QAAA,EAAE,OAAAC,GAAO,QAAAC,EAAW,IAAAF,GAEpBG,IAAOL,EAAMC,CAAgB,GAC7BK,IAAeC,EAAmC,IAAI,GACtDC,IAAoBD,EAAe,EAAE,GAErCE,IAAa,MAAM;;AACjB,KAAAC,KAAAC,IAAAX,EAAAC,CAAgB,MAAhB,gBAAAU,EAAmB,WAAnB,QAAAD,EAAA,KAAAC;AAAA,EAA4B,GAG9BC,IAAiBC,EAAY,MAAM;AACnC,QAAAP,EAAa,YAAWD,KAAA,QAAAA,EAAM,8BAA6B;AAC7D,YAAMS,IAAcd,EAAM,OAAO,CAAAe,MAASA,EAAM,2BAA2B,GACrEC,IAAWC,IAAeH,EAAY,QAEtCI,IAAqBV,EAAkB,WAAW,IAAIA,EAAkB,UAAU,GAElFW,IAAY,KAAK,MAAMD,IAAqBF,IAAW,CAAC,GACxDI,IAAU,KAAK,MAAMnB,IAAmBe,CAAQ;AAEtD,MAAAR,EAAkB,UAAUP,GAC5BK,EAAa,QAAQ,aAAa,CAACa,GAAWC,CAAO,GAAG,EAAI;AAAA,IAC9D;AAAA,KACC,CAACnB,GAAkBI,KAAA,gBAAAA,EAAM,6BAA6BL,CAAK,CAAC;AAE/D,gCAEK,UACCK,IAAA,gBAAAgB,EAACC,GAAA,EAAqB,OAAAnB,GAAc,QAAAC,GACjC,UAAA;AAAA,IAAKC,EAAA,SACH,gBAAAT,EAAA2B,GAAA,EACC,4BAACC,GAAe,EAAA,SAASf,GAAY,EAAA,CACvC,IACE;AAAA,IACHJ,EAAK,aAAa,gBAAAT,EAACF,KAAgB,KAAKW,EAAK,WAAY,CAAA,IAAK;AAAA,sBAC9DoB,GAAA,EACC,UAAC,gBAAAJ,EAAAK,GAAA,EACE,UAAA;AAAA,MAAArB,EAAK,UACH,gBAAAT,EAAA+B,GAAA,EAAyB,UAAAtB,EAAK,QAAQ,CAAA,IACrC;AAAA,MAGHA,EAAK,oBACJ,gBAAAgB,EAACO,GAAA,EAAiC,OAAAzB,GAAc,QAAAC,GAC7C,UAAA;AAAA,QAAAC,EAAK,8BACJ,gBAAAT,EAACiC,GAAA,EACC,UAAA,gBAAAjC;AAAA,UAACkC;AAAA,UAAA;AAAA,YACC,KAAKxB;AAAA,YACL,KAAKyB,EAAO;AAAA,YACZ,UAAUjC;AAAA,YACV,UAAUc;AAAA,UAAA;AAAA,WAEd,IACE;AAAA,QAEHP,EAAK,QACH,gBAAAT,EAAAoC,GAAA,EACC,UAAA,gBAAApC,EAACqC,GAAK,EAAA,WAAU,OAAM,QAAO,SAC1B,UAAK5B,EAAA,MACR,CAAA,EACF,CAAA,IACE;AAAA,QACHA,EAAK;AAAA,MAAA,EAAA,CACR,IACE;AAAA,IAAA,EAAA,CACN,EACF,CAAA;AAAA,IAECA,EAAK,mBACH,gBAAAT,EAAAsC,GAAA,EAA4B,UAAA7B,EAAK,iBAAiB,CAAA,IACjD;AAAA,EAAA,GACN,IACE,KACN,CAAA;AAEJ;"}

package/dist/features/circle-games/sign-up/sign-up-types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sign-up-types.js","sources":["../../../../src/features/circle-games/sign-up/sign-up-types.ts"],"sourcesContent":["import type { ~~IUpdateUsernameResponse } from './api/use-update-username-api/use-update-username-api-types';\nimport type {~~ ICreateUserResponseDal } from './dal/create-user-dal/create-user-dal-types';\nimport type { IUpdateUserPayloadDal } from './dal/update-user-dal/update-user-dal-types';\n\nexport enum State {\n ADDED = 'ADDED',\n DEMO = 'DEMO',\n TRIAL = 'TRL',\n PAID = 'PAID',\n ACTIVE = 'ACT',\n INACTIVE = 'INACT',\n LEFT = 'LEFT',\n PAUSED = 'PSD',\n HOLD = 'HOLD',\n}\n\nexport interface ISignUpProps {\n circleOnLeapSignedUp: boolean;\n circleOnLeapPremiumEnabled: boolean;\n mathGymEnrolledUser: boolean;\n circleEnrolledUser: boolean;\n circleOnLeapPremiumDays: number;\n circleUsername: string;\n countryCode: string;\n grade: string;\n state: State;\n studentId: string;\n isSignUpProcessing: boolean;\n onUpdateUser?: (data: IUpdateUserPayloadDal) => void;\n onCreateUser?: (data: ICreateUserResponseDal) => void;\n onSignupStepsComplete: (\n data: IUpdateUserPayloadDal \| ICreateUserResponseDal \| ~~IUpdateUsernameResponse \|~~ null~~,\n~~ ) => void;\n ~~isPLAStudent?: boolean;\n~~}\n"],"names":["State"],"mappings":"~~AAIY~~,IAAAA,sBAAAA,OACVA,EAAA,QAAQ,SACRA,EAAA,OAAO,QACPA,EAAA,QAAQ,OACRA,EAAA,OAAO,QACPA,EAAA,SAAS,OACTA,EAAA,WAAW,SACXA,EAAA,OAAO,QACPA,EAAA,SAAS,OACTA,EAAA,OAAO,QATGA,IAAAA,KAAA,CAAA,CAAA;"}
1	+ {"version":3,"file":"sign-up-types.js","sources":["../../../../src/features/circle-games/sign-up/sign-up-types.ts"],"sourcesContent":["import type { ICreateUserResponseDal } from './dal/create-user-dal/create-user-dal-types';\nimport type { IUpdateUserPayloadDal } from './dal/update-user-dal/update-user-dal-types';\n\nexport enum State {\n ADDED = 'ADDED',\n DEMO = 'DEMO',\n TRIAL = 'TRL',\n PAID = 'PAID',\n ACTIVE = 'ACT',\n INACTIVE = 'INACT',\n LEFT = 'LEFT',\n PAUSED = 'PSD',\n HOLD = 'HOLD',\n}\n\nexport interface ISignUpProps {\n circleOnLeapSignedUp: boolean;\n circleOnLeapPremiumEnabled: boolean;\n mathGymEnrolledUser: boolean;\n circleEnrolledUser: boolean;\n circleOnLeapPremiumDays: number;\n circleUsername: string;\n countryCode: string;\n grade: string;\n state: State;\n studentId: string;\n isSignUpProcessing: boolean;\n onUpdateUser?: (data: IUpdateUserPayloadDal) => void;\n onCreateUser?: (data: ICreateUserResponseDal) => void;\n onSignupStepsComplete: (data: IUpdateUserPayloadDal \| ICreateUserResponseDal \| null) => void;\n}\n"],"names":["State"],"mappings":"AAGY,IAAAA,sBAAAA,OACVA,EAAA,QAAQ,SACRA,EAAA,OAAO,QACPA,EAAA,QAAQ,OACRA,EAAA,OAAO,QACPA,EAAA,SAAS,OACTA,EAAA,WAAW,SACXA,EAAA,OAAO,QACPA,EAAA,SAAS,OACTA,EAAA,OAAO,QATGA,IAAAA,KAAA,CAAA,CAAA;"}