(value: T) {\n const ref = React.useRef({ value, previous: value });\n\n // We compare values before making an update to ensure that\n // a change has been made. This ensures the previous value is\n // persisted correctly between renders.\n return React.useMemo(() => {\n if (ref.current.value !== value) {\n ref.current.previous = ref.current.value;\n ref.current.value = value;\n }\n return ref.current.previous;\n }, [value]);\n}\n\nexport { usePrevious };\n","/// \n\nimport * as React from 'react';\nimport { useLayoutEffect } from '@radix-ui/react-use-layout-effect';\n\nfunction useSize(element: HTMLElement | null) {\n const [size, setSize] = React.useState<{ width: number; height: number } | undefined>(undefined);\n\n useLayoutEffect(() => {\n if (element) {\n // provide size as early as possible\n setSize({ width: element.offsetWidth, height: element.offsetHeight });\n\n const resizeObserver = new ResizeObserver((entries) => {\n if (!Array.isArray(entries)) {\n return;\n }\n\n // Since we only observe the one element, we don't need to loop over the\n // array\n if (!entries.length) {\n return;\n }\n\n const entry = entries[0];\n let width: number;\n let height: number;\n\n if ('borderBoxSize' in entry) {\n const borderSizeEntry = entry['borderBoxSize'];\n // iron out differences between browsers\n const borderSize = Array.isArray(borderSizeEntry) ? borderSizeEntry[0] : borderSizeEntry;\n width = borderSize['inlineSize'];\n height = borderSize['blockSize'];\n } else {\n // for browsers that don't support `borderBoxSize`\n // we calculate it ourselves to get the correct border box.\n width = element.offsetWidth;\n height = element.offsetHeight;\n }\n\n setSize({ width, height });\n });\n\n resizeObserver.observe(element, { box: 'border-box' });\n\n return () => resizeObserver.unobserve(element);\n } else {\n // We only want to reset to `undefined` when the element becomes `null`,\n // not if it changes to another element.\n setSize(undefined);\n }\n }, [element]);\n\n return size;\n}\n\nexport { useSize };\n","import * as React from 'react';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { createContextScope } from '@radix-ui/react-context';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { usePrevious } from '@radix-ui/react-use-previous';\nimport { useSize } from '@radix-ui/react-use-size';\nimport { Presence } from '@radix-ui/react-presence';\nimport { Primitive } from '@radix-ui/react-primitive';\n\nimport type * as Radix from '@radix-ui/react-primitive';\nimport type { Scope } from '@radix-ui/react-context';\n\n/* -------------------------------------------------------------------------------------------------\n * Checkbox\n * -----------------------------------------------------------------------------------------------*/\n\nconst CHECKBOX_NAME = 'Checkbox';\n\ntype ScopedProps = P & { __scopeCheckbox?: Scope };\nconst [createCheckboxContext, createCheckboxScope] = createContextScope(CHECKBOX_NAME);\n\ntype CheckedState = boolean | 'indeterminate';\n\ntype CheckboxContextValue = {\n state: CheckedState;\n disabled?: boolean;\n};\n\nconst [CheckboxProvider, useCheckboxContext] =\n createCheckboxContext(CHECKBOX_NAME);\n\ntype CheckboxElement = React.ElementRef;\ntype PrimitiveButtonProps = Radix.ComponentPropsWithoutRef;\ninterface CheckboxProps extends Omit {\n checked?: CheckedState;\n defaultChecked?: CheckedState;\n required?: boolean;\n onCheckedChange?(checked: CheckedState): void;\n}\n\nconst Checkbox = React.forwardRef(\n (props: ScopedProps, forwardedRef) => {\n const {\n __scopeCheckbox,\n name,\n checked: checkedProp,\n defaultChecked,\n required,\n disabled,\n value = 'on',\n onCheckedChange,\n ...checkboxProps\n } = props;\n const [button, setButton] = React.useState(null);\n const composedRefs = useComposedRefs(forwardedRef, (node) => setButton(node));\n const hasConsumerStoppedPropagationRef = React.useRef(false);\n // We set this to true by default so that events bubble to forms without JS (SSR)\n const isFormControl = button ? Boolean(button.closest('form')) : true;\n const [checked = false, setChecked] = useControllableState({\n prop: checkedProp,\n defaultProp: defaultChecked,\n onChange: onCheckedChange,\n });\n const initialCheckedStateRef = React.useRef(checked);\n React.useEffect(() => {\n const form = button?.form;\n if (form) {\n const reset = () => setChecked(initialCheckedStateRef.current);\n form.addEventListener('reset', reset);\n return () => form.removeEventListener('reset', reset);\n }\n }, [button, setChecked]);\n\n return (\n \n {\n // According to WAI ARIA, Checkboxes don't activate on enter keypress\n if (event.key === 'Enter') event.preventDefault();\n })}\n onClick={composeEventHandlers(props.onClick, (event) => {\n setChecked((prevChecked) => (isIndeterminate(prevChecked) ? true : !prevChecked));\n if (isFormControl) {\n hasConsumerStoppedPropagationRef.current = event.isPropagationStopped();\n // if checkbox is in a form, stop propagation from the button so that we only propagate\n // one click event (from the input). We propagate changes from an input so that native\n // form validation works and form events reflect checkbox updates.\n if (!hasConsumerStoppedPropagationRef.current) event.stopPropagation();\n }\n })}\n />\n {isFormControl && (\n \n )}\n \n );\n }\n);\n\nCheckbox.displayName = CHECKBOX_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * CheckboxIndicator\n * -----------------------------------------------------------------------------------------------*/\n\nconst INDICATOR_NAME = 'CheckboxIndicator';\n\ntype CheckboxIndicatorElement = React.ElementRef;\ntype PrimitiveSpanProps = Radix.ComponentPropsWithoutRef;\ninterface CheckboxIndicatorProps extends PrimitiveSpanProps {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true;\n}\n\nconst CheckboxIndicator = React.forwardRef(\n (props: ScopedProps, forwardedRef) => {\n const { __scopeCheckbox, forceMount, ...indicatorProps } = props;\n const context = useCheckboxContext(INDICATOR_NAME, __scopeCheckbox);\n return (\n \n \n \n );\n }\n);\n\nCheckboxIndicator.displayName = INDICATOR_NAME;\n\n/* ---------------------------------------------------------------------------------------------- */\n\ntype InputProps = Radix.ComponentPropsWithoutRef<'input'>;\ninterface BubbleInputProps extends Omit {\n checked: CheckedState;\n control: HTMLElement | null;\n bubbles: boolean;\n}\n\nconst BubbleInput = (props: BubbleInputProps) => {\n const { control, checked, bubbles = true, ...inputProps } = props;\n const ref = React.useRef(null);\n const prevChecked = usePrevious(checked);\n const controlSize = useSize(control);\n\n // Bubble checked change to parents (e.g form change event)\n React.useEffect(() => {\n const input = ref.current!;\n const inputProto = window.HTMLInputElement.prototype;\n const descriptor = Object.getOwnPropertyDescriptor(inputProto, 'checked') as PropertyDescriptor;\n const setChecked = descriptor.set;\n\n if (prevChecked !== checked && setChecked) {\n const event = new Event('click', { bubbles });\n input.indeterminate = isIndeterminate(checked);\n setChecked.call(input, isIndeterminate(checked) ? false : checked);\n input.dispatchEvent(event);\n }\n }, [prevChecked, checked, bubbles]);\n\n return (\n \n );\n};\n\nfunction isIndeterminate(checked?: CheckedState): checked is 'indeterminate' {\n return checked === 'indeterminate';\n}\n\nfunction getState(checked: CheckedState) {\n return isIndeterminate(checked) ? 'indeterminate' : checked ? 'checked' : 'unchecked';\n}\n\nconst Root = Checkbox;\nconst Indicator = CheckboxIndicator;\n\nexport {\n createCheckboxScope,\n //\n Checkbox,\n CheckboxIndicator,\n //\n Root,\n Indicator,\n};\nexport type { CheckboxProps, CheckboxIndicatorProps };\n","\"use client\";\n\nimport createSvgIcon from './utils/createSvgIcon';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z\"\n}), 'Check');","import React from 'react'\nimport { styled, CSS, VariantProps } from 'styles/stitches.config'\nimport * as CheckboxPrimitive from '@radix-ui/react-checkbox'\nimport { Check } from '@mui/icons-material'\nimport { useController, UseControllerProps } from 'react-hook-form'\n\nconst CheckboxRoot = styled(CheckboxPrimitive.Root, {\n 'display': 'inline-flex',\n 'justifyContent': 'center',\n 'alignItems': 'center',\n 'appearance': 'none',\n 'lineHeight': '1',\n 'backgroundColor': 'transparent',\n 'border': '2px solid $gray7',\n 'borderRadius': '4px',\n 'WebkitTapHighlightColor': 'transparent',\n 'overflow': 'hidden',\n 'outline': 'none',\n\n '&:hover': {\n boxShadow: 'inset 0 0 0 1px $colors$slate8',\n },\n '&:focus-visible': {\n boxShadow: '$outline',\n },\n '&[data-state=\"checked\"]': {\n backgroundColor: '$primary',\n borderColor: '$primary',\n },\n 'svg': {\n size: '1rem',\n },\n\n 'variants': {\n size: {\n sm: {\n size: '$3',\n },\n md: {\n size: '20px',\n },\n lg: {\n size: '$5',\n },\n },\n },\n 'defaultVariants': {\n size: 'md',\n },\n})\n\nconst CheckboxIndicator = styled(CheckboxPrimitive.Indicator, {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n color: '$white',\n size: '100%',\n})\n\ntype CheckboxPrimitiveProps = React.ComponentPropsWithoutRef\ntype CheckboxVariants = VariantProps\ntype CheckboxProps = Omit & CheckboxVariants & { css?: CSS }\n\nexport const Checkbox = React.forwardRef, CheckboxProps>((props, forwardedRef) => (\n \n \n \n \n \n))\n\ntype ControllerProps = CheckboxProps & UseControllerProps\n\nexport const ControlledCheckbox = (props: ControllerProps) => {\n const { control, rules, name, defaultValue = false, ...rest } = props\n const { field } = useController({ control, rules, name, defaultValue })\n\n return \n}\n\nCheckbox.displayName = 'Checkbox'\n","import * as React from 'react';\nimport { composeRefs } from '@radix-ui/react-compose-refs';\n\n/* -------------------------------------------------------------------------------------------------\n * Slot\n * -----------------------------------------------------------------------------------------------*/\n\ninterface SlotProps extends React.HTMLAttributes {\n children?: React.ReactNode;\n}\n\nconst Slot = React.forwardRef((props, forwardedRef) => {\n const { children, ...slotProps } = props;\n const childrenArray = React.Children.toArray(children);\n const slottable = childrenArray.find(isSlottable);\n\n if (slottable) {\n // the new element to render is the one passed as a child of `Slottable`\n const newElement = slottable.props.children as React.ReactNode;\n\n const newChildren = childrenArray.map((child) => {\n if (child === slottable) {\n // because the new element will be the one rendered, we are only interested\n // in grabbing its children (`newElement.props.children`)\n if (React.Children.count(newElement) > 1) return React.Children.only(null);\n return React.isValidElement(newElement)\n ? (newElement.props.children as React.ReactNode)\n : null;\n } else {\n return child;\n }\n });\n\n return (\n \n {React.isValidElement(newElement)\n ? React.cloneElement(newElement, undefined, newChildren)\n : null}\n \n );\n }\n\n return (\n \n {children}\n \n );\n});\n\nSlot.displayName = 'Slot';\n\n/* -------------------------------------------------------------------------------------------------\n * SlotClone\n * -----------------------------------------------------------------------------------------------*/\n\ninterface SlotCloneProps {\n children: React.ReactNode;\n}\n\nconst SlotClone = React.forwardRef((props, forwardedRef) => {\n const { children, ...slotProps } = props;\n\n if (React.isValidElement(children)) {\n return React.cloneElement(children, {\n ...mergeProps(slotProps, children.props),\n ref: forwardedRef ? composeRefs(forwardedRef, (children as any).ref) : (children as any).ref,\n });\n }\n\n return React.Children.count(children) > 1 ? React.Children.only(null) : null;\n});\n\nSlotClone.displayName = 'SlotClone';\n\n/* -------------------------------------------------------------------------------------------------\n * Slottable\n * -----------------------------------------------------------------------------------------------*/\n\nconst Slottable = ({ children }: { children: React.ReactNode }) => {\n return <>{children};\n};\n\n/* ---------------------------------------------------------------------------------------------- */\n\ntype AnyProps = Record;\n\nfunction isSlottable(child: React.ReactNode): child is React.ReactElement {\n return React.isValidElement(child) && child.type === Slottable;\n}\n\nfunction mergeProps(slotProps: AnyProps, childProps: AnyProps) {\n // all child props should override\n const overrideProps = { ...childProps };\n\n for (const propName in childProps) {\n const slotPropValue = slotProps[propName];\n const childPropValue = childProps[propName];\n\n const isHandler = /^on[A-Z]/.test(propName);\n if (isHandler) {\n // if the handler exists on both, we compose them\n if (slotPropValue && childPropValue) {\n overrideProps[propName] = (...args: unknown[]) => {\n childPropValue(...args);\n slotPropValue(...args);\n };\n }\n // but if it exists only on the slot, we use only this one\n else if (slotPropValue) {\n overrideProps[propName] = slotPropValue;\n }\n }\n // if it's `style`, we merge them\n else if (propName === 'style') {\n overrideProps[propName] = { ...slotPropValue, ...childPropValue };\n } else if (propName === 'className') {\n overrideProps[propName] = [slotPropValue, childPropValue].filter(Boolean).join(' ');\n }\n }\n\n return { ...slotProps, ...overrideProps };\n}\n\nconst Root = Slot;\n\nexport {\n Slot,\n Slottable,\n //\n Root,\n};\nexport type { SlotProps };\n","import * as React from 'react';\n\ntype Direction = 'ltr' | 'rtl';\nconst DirectionContext = React.createContext(undefined);\n\n/* -------------------------------------------------------------------------------------------------\n * Direction\n * -----------------------------------------------------------------------------------------------*/\n\ninterface DirectionProviderProps {\n children?: React.ReactNode;\n dir: Direction;\n}\nconst DirectionProvider: React.FC = (props) => {\n const { dir, children } = props;\n return {children};\n};\n\n/* -----------------------------------------------------------------------------------------------*/\n\nfunction useDirection(localDir?: Direction) {\n const globalDir = React.useContext(DirectionContext);\n return localDir || globalDir || 'ltr';\n}\n\nconst Provider = DirectionProvider;\n\nexport {\n useDirection,\n //\n Provider,\n //\n DirectionProvider,\n};\n","import * as React from 'react';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { createCollection } from '@radix-ui/react-collection';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { createContextScope } from '@radix-ui/react-context';\nimport { useId } from '@radix-ui/react-id';\nimport { Primitive } from '@radix-ui/react-primitive';\nimport { useCallbackRef } from '@radix-ui/react-use-callback-ref';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { useDirection } from '@radix-ui/react-direction';\n\nimport type * as Radix from '@radix-ui/react-primitive';\nimport type { Scope } from '@radix-ui/react-context';\n\nconst ENTRY_FOCUS = 'rovingFocusGroup.onEntryFocus';\nconst EVENT_OPTIONS = { bubbles: false, cancelable: true };\n\n/* -------------------------------------------------------------------------------------------------\n * RovingFocusGroup\n * -----------------------------------------------------------------------------------------------*/\n\nconst GROUP_NAME = 'RovingFocusGroup';\n\ntype ItemData = { id: string; focusable: boolean; active: boolean };\nconst [Collection, useCollection, createCollectionScope] = createCollection<\n HTMLSpanElement,\n ItemData\n>(GROUP_NAME);\n\ntype ScopedProps = P & { __scopeRovingFocusGroup?: Scope };\nconst [createRovingFocusGroupContext, createRovingFocusGroupScope] = createContextScope(\n GROUP_NAME,\n [createCollectionScope]\n);\n\ntype Orientation = React.AriaAttributes['aria-orientation'];\ntype Direction = 'ltr' | 'rtl';\n\ninterface RovingFocusGroupOptions {\n /**\n * The orientation of the group.\n * Mainly so arrow navigation is done accordingly (left & right vs. up & down)\n */\n orientation?: Orientation;\n /**\n * The direction of navigation between items.\n */\n dir?: Direction;\n /**\n * Whether keyboard navigation should loop around\n * @defaultValue false\n */\n loop?: boolean;\n}\n\ntype RovingContextValue = RovingFocusGroupOptions & {\n currentTabStopId: string | null;\n onItemFocus(tabStopId: string): void;\n onItemShiftTab(): void;\n onFocusableItemAdd(): void;\n onFocusableItemRemove(): void;\n};\n\nconst [RovingFocusProvider, useRovingFocusContext] =\n createRovingFocusGroupContext(GROUP_NAME);\n\ntype RovingFocusGroupElement = RovingFocusGroupImplElement;\ninterface RovingFocusGroupProps extends RovingFocusGroupImplProps {}\n\nconst RovingFocusGroup = React.forwardRef(\n (props: ScopedProps, forwardedRef) => {\n return (\n \n \n \n \n \n );\n }\n);\n\nRovingFocusGroup.displayName = GROUP_NAME;\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype RovingFocusGroupImplElement = React.ElementRef;\ntype PrimitiveDivProps = Radix.ComponentPropsWithoutRef;\ninterface RovingFocusGroupImplProps\n extends Omit,\n RovingFocusGroupOptions {\n currentTabStopId?: string | null;\n defaultCurrentTabStopId?: string;\n onCurrentTabStopIdChange?: (tabStopId: string | null) => void;\n onEntryFocus?: (event: Event) => void;\n}\n\nconst RovingFocusGroupImpl = React.forwardRef<\n RovingFocusGroupImplElement,\n RovingFocusGroupImplProps\n>((props: ScopedProps, forwardedRef) => {\n const {\n __scopeRovingFocusGroup,\n orientation,\n loop = false,\n dir,\n currentTabStopId: currentTabStopIdProp,\n defaultCurrentTabStopId,\n onCurrentTabStopIdChange,\n onEntryFocus,\n ...groupProps\n } = props;\n const ref = React.useRef(null);\n const composedRefs = useComposedRefs(forwardedRef, ref);\n const direction = useDirection(dir);\n const [currentTabStopId = null, setCurrentTabStopId] = useControllableState({\n prop: currentTabStopIdProp,\n defaultProp: defaultCurrentTabStopId,\n onChange: onCurrentTabStopIdChange,\n });\n const [isTabbingBackOut, setIsTabbingBackOut] = React.useState(false);\n const handleEntryFocus = useCallbackRef(onEntryFocus);\n const getItems = useCollection(__scopeRovingFocusGroup);\n const isClickFocusRef = React.useRef(false);\n const [focusableItemsCount, setFocusableItemsCount] = React.useState(0);\n\n React.useEffect(() => {\n const node = ref.current;\n if (node) {\n node.addEventListener(ENTRY_FOCUS, handleEntryFocus);\n return () => node.removeEventListener(ENTRY_FOCUS, handleEntryFocus);\n }\n }, [handleEntryFocus]);\n\n return (\n setCurrentTabStopId(tabStopId),\n [setCurrentTabStopId]\n )}\n onItemShiftTab={React.useCallback(() => setIsTabbingBackOut(true), [])}\n onFocusableItemAdd={React.useCallback(\n () => setFocusableItemsCount((prevCount) => prevCount + 1),\n []\n )}\n onFocusableItemRemove={React.useCallback(\n () => setFocusableItemsCount((prevCount) => prevCount - 1),\n []\n )}\n >\n {\n isClickFocusRef.current = true;\n })}\n onFocus={composeEventHandlers(props.onFocus, (event) => {\n // We normally wouldn't need this check, because we already check\n // that the focus is on the current target and not bubbling to it.\n // We do this because Safari doesn't focus buttons when clicked, and\n // instead, the wrapper will get focused and not through a bubbling event.\n const isKeyboardFocus = !isClickFocusRef.current;\n\n if (event.target === event.currentTarget && isKeyboardFocus && !isTabbingBackOut) {\n const entryFocusEvent = new CustomEvent(ENTRY_FOCUS, EVENT_OPTIONS);\n event.currentTarget.dispatchEvent(entryFocusEvent);\n\n if (!entryFocusEvent.defaultPrevented) {\n const items = getItems().filter((item) => item.focusable);\n const activeItem = items.find((item) => item.active);\n const currentItem = items.find((item) => item.id === currentTabStopId);\n const candidateItems = [activeItem, currentItem, ...items].filter(\n Boolean\n ) as typeof items;\n const candidateNodes = candidateItems.map((item) => item.ref.current!);\n focusFirst(candidateNodes);\n }\n }\n\n isClickFocusRef.current = false;\n })}\n onBlur={composeEventHandlers(props.onBlur, () => setIsTabbingBackOut(false))}\n />\n \n );\n});\n\n/* -------------------------------------------------------------------------------------------------\n * RovingFocusGroupItem\n * -----------------------------------------------------------------------------------------------*/\n\nconst ITEM_NAME = 'RovingFocusGroupItem';\n\ntype RovingFocusItemElement = React.ElementRef;\ntype PrimitiveSpanProps = Radix.ComponentPropsWithoutRef;\ninterface RovingFocusItemProps extends PrimitiveSpanProps {\n tabStopId?: string;\n focusable?: boolean;\n active?: boolean;\n}\n\nconst RovingFocusGroupItem = React.forwardRef(\n (props: ScopedProps, forwardedRef) => {\n const {\n __scopeRovingFocusGroup,\n focusable = true,\n active = false,\n tabStopId,\n ...itemProps\n } = props;\n const autoId = useId();\n const id = tabStopId || autoId;\n const context = useRovingFocusContext(ITEM_NAME, __scopeRovingFocusGroup);\n const isCurrentTabStop = context.currentTabStopId === id;\n const getItems = useCollection(__scopeRovingFocusGroup);\n\n const { onFocusableItemAdd, onFocusableItemRemove } = context;\n\n React.useEffect(() => {\n if (focusable) {\n onFocusableItemAdd();\n return () => onFocusableItemRemove();\n }\n }, [focusable, onFocusableItemAdd, onFocusableItemRemove]);\n\n return (\n \n {\n // We prevent focusing non-focusable items on `mousedown`.\n // Even though the item has tabIndex={-1}, that only means take it out of the tab order.\n if (!focusable) event.preventDefault();\n // Safari doesn't focus a button when clicked so we run our logic on mousedown also\n else context.onItemFocus(id);\n })}\n onFocus={composeEventHandlers(props.onFocus, () => context.onItemFocus(id))}\n onKeyDown={composeEventHandlers(props.onKeyDown, (event) => {\n if (event.key === 'Tab' && event.shiftKey) {\n context.onItemShiftTab();\n return;\n }\n\n if (event.target !== event.currentTarget) return;\n\n const focusIntent = getFocusIntent(event, context.orientation, context.dir);\n\n if (focusIntent !== undefined) {\n event.preventDefault();\n const items = getItems().filter((item) => item.focusable);\n let candidateNodes = items.map((item) => item.ref.current!);\n\n if (focusIntent === 'last') candidateNodes.reverse();\n else if (focusIntent === 'prev' || focusIntent === 'next') {\n if (focusIntent === 'prev') candidateNodes.reverse();\n const currentIndex = candidateNodes.indexOf(event.currentTarget);\n candidateNodes = context.loop\n ? wrapArray(candidateNodes, currentIndex + 1)\n : candidateNodes.slice(currentIndex + 1);\n }\n\n /**\n * Imperative focus during keydown is risky so we prevent React's batching updates\n * to avoid potential bugs. See: https://github.com/facebook/react/issues/20332\n */\n setTimeout(() => focusFirst(candidateNodes));\n }\n })}\n />\n \n );\n }\n);\n\nRovingFocusGroupItem.displayName = ITEM_NAME;\n\n/* -----------------------------------------------------------------------------------------------*/\n\n// prettier-ignore\nconst MAP_KEY_TO_FOCUS_INTENT: Record = {\n ArrowLeft: 'prev', ArrowUp: 'prev',\n ArrowRight: 'next', ArrowDown: 'next',\n PageUp: 'first', Home: 'first',\n PageDown: 'last', End: 'last',\n};\n\nfunction getDirectionAwareKey(key: string, dir?: Direction) {\n if (dir !== 'rtl') return key;\n return key === 'ArrowLeft' ? 'ArrowRight' : key === 'ArrowRight' ? 'ArrowLeft' : key;\n}\n\ntype FocusIntent = 'first' | 'last' | 'prev' | 'next';\n\nfunction getFocusIntent(event: React.KeyboardEvent, orientation?: Orientation, dir?: Direction) {\n const key = getDirectionAwareKey(event.key, dir);\n if (orientation === 'vertical' && ['ArrowLeft', 'ArrowRight'].includes(key)) return undefined;\n if (orientation === 'horizontal' && ['ArrowUp', 'ArrowDown'].includes(key)) return undefined;\n return MAP_KEY_TO_FOCUS_INTENT[key];\n}\n\nfunction focusFirst(candidates: HTMLElement[]) {\n const PREVIOUSLY_FOCUSED_ELEMENT = document.activeElement;\n for (const candidate of candidates) {\n // if focus is already where we want to go, we don't want to keep going through the candidates\n if (candidate === PREVIOUSLY_FOCUSED_ELEMENT) return;\n candidate.focus();\n if (document.activeElement !== PREVIOUSLY_FOCUSED_ELEMENT) return;\n }\n}\n\n/**\n * Wraps an array around itself at a given start index\n * Example: `wrapArray(['a', 'b', 'c', 'd'], 2) === ['c', 'd', 'a', 'b']`\n */\nfunction wrapArray(array: T[], startIndex: number) {\n return array.map((_, index) => array[(startIndex + index) % array.length]);\n}\n\nconst Root = RovingFocusGroup;\nconst Item = RovingFocusGroupItem;\n\nexport {\n createRovingFocusGroupScope,\n //\n RovingFocusGroup,\n RovingFocusGroupItem,\n //\n Root,\n Item,\n};\nexport type { RovingFocusGroupProps, RovingFocusItemProps };\n","import React from 'react';\nimport { createContextScope } from '@radix-ui/react-context';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { Slot } from '@radix-ui/react-slot';\n\nimport type * as Radix from '@radix-ui/react-primitive';\n\ntype SlotProps = Radix.ComponentPropsWithoutRef;\ntype CollectionElement = HTMLElement;\ninterface CollectionProps extends SlotProps {\n scope: any;\n}\n\n// We have resorted to returning slots directly rather than exposing primitives that can then\n// be slotted like `…`.\n// This is because we encountered issues with generic types that cannot be statically analysed\n// due to creating them dynamically via createCollection.\n\nfunction createCollection(name: string) {\n /* -----------------------------------------------------------------------------------------------\n * CollectionProvider\n * ---------------------------------------------------------------------------------------------*/\n\n const PROVIDER_NAME = name + 'CollectionProvider';\n const [createCollectionContext, createCollectionScope] = createContextScope(PROVIDER_NAME);\n\n type ContextValue = {\n collectionRef: React.RefObject;\n itemMap: Map, { ref: React.RefObject } & ItemData>;\n };\n\n const [CollectionProviderImpl, useCollectionContext] = createCollectionContext(\n PROVIDER_NAME,\n { collectionRef: { current: null }, itemMap: new Map() }\n );\n\n const CollectionProvider: React.FC<{ children?: React.ReactNode; scope: any }> = (props) => {\n const { scope, children } = props;\n const ref = React.useRef(null);\n const itemMap = React.useRef(new Map()).current;\n return (\n \n {children}\n \n );\n };\n\n CollectionProvider.displayName = PROVIDER_NAME;\n\n /* -----------------------------------------------------------------------------------------------\n * CollectionSlot\n * ---------------------------------------------------------------------------------------------*/\n\n const COLLECTION_SLOT_NAME = name + 'CollectionSlot';\n\n const CollectionSlot = React.forwardRef(\n (props, forwardedRef) => {\n const { scope, children } = props;\n const context = useCollectionContext(COLLECTION_SLOT_NAME, scope);\n const composedRefs = useComposedRefs(forwardedRef, context.collectionRef);\n return {children};\n }\n );\n\n CollectionSlot.displayName = COLLECTION_SLOT_NAME;\n\n /* -----------------------------------------------------------------------------------------------\n * CollectionItem\n * ---------------------------------------------------------------------------------------------*/\n\n const ITEM_SLOT_NAME = name + 'CollectionItemSlot';\n const ITEM_DATA_ATTR = 'data-radix-collection-item';\n\n type CollectionItemSlotProps = ItemData & {\n children: React.ReactNode;\n scope: any;\n };\n\n const CollectionItemSlot = React.forwardRef(\n (props, forwardedRef) => {\n const { scope, children, ...itemData } = props;\n const ref = React.useRef(null);\n const composedRefs = useComposedRefs(forwardedRef, ref);\n const context = useCollectionContext(ITEM_SLOT_NAME, scope);\n\n React.useEffect(() => {\n context.itemMap.set(ref, { ref, ...(itemData as unknown as ItemData) });\n return () => void context.itemMap.delete(ref);\n });\n\n return (\n \n {children}\n \n );\n }\n );\n\n CollectionItemSlot.displayName = ITEM_SLOT_NAME;\n\n /* -----------------------------------------------------------------------------------------------\n * useCollection\n * ---------------------------------------------------------------------------------------------*/\n\n function useCollection(scope: any) {\n const context = useCollectionContext(name + 'CollectionConsumer', scope);\n\n const getItems = React.useCallback(() => {\n const collectionNode = context.collectionRef.current;\n if (!collectionNode) return [];\n const orderedNodes = Array.from(collectionNode.querySelectorAll(`[${ITEM_DATA_ATTR}]`));\n const items = Array.from(context.itemMap.values());\n const orderedItems = items.sort(\n (a, b) => orderedNodes.indexOf(a.ref.current!) - orderedNodes.indexOf(b.ref.current!)\n );\n return orderedItems;\n }, [context.collectionRef, context.itemMap]);\n\n return getItems;\n }\n\n return [\n { Provider: CollectionProvider, Slot: CollectionSlot, ItemSlot: CollectionItemSlot },\n useCollection,\n createCollectionScope,\n ] as const;\n}\n\nexport { createCollection };\nexport type { CollectionProps };\n","import * as React from 'react';\n\n/**\n * A custom hook that converts a callback to a ref to avoid triggering re-renders when passed as a\n * prop or avoid re-executing effects when passed as a dependency\n */\nfunction useCallbackRef any>(callback: T | undefined): T {\n const callbackRef = React.useRef(callback);\n\n React.useEffect(() => {\n callbackRef.current = callback;\n });\n\n // https://github.com/facebook/react/issues/19240\n return React.useMemo(() => ((...args) => callbackRef.current?.(...args)) as T, []);\n}\n\nexport { useCallbackRef };\n","import * as React from 'react';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { createContextScope } from '@radix-ui/react-context';\nimport { useSize } from '@radix-ui/react-use-size';\nimport { usePrevious } from '@radix-ui/react-use-previous';\nimport { Presence } from '@radix-ui/react-presence';\nimport { Primitive } from '@radix-ui/react-primitive';\n\nimport type * as Radix from '@radix-ui/react-primitive';\nimport type { Scope } from '@radix-ui/react-context';\n\n/* -------------------------------------------------------------------------------------------------\n * Radio\n * -----------------------------------------------------------------------------------------------*/\n\nconst RADIO_NAME = 'Radio';\n\ntype ScopedProps = P & { __scopeRadio?: Scope };\nconst [createRadioContext, createRadioScope] = createContextScope(RADIO_NAME);\n\ntype RadioContextValue = { checked: boolean; disabled?: boolean };\nconst [RadioProvider, useRadioContext] = createRadioContext(RADIO_NAME);\n\ntype RadioElement = React.ElementRef;\ntype PrimitiveButtonProps = Radix.ComponentPropsWithoutRef;\ninterface RadioProps extends PrimitiveButtonProps {\n checked?: boolean;\n required?: boolean;\n onCheck?(): void;\n}\n\nconst Radio = React.forwardRef(\n (props: ScopedProps, forwardedRef) => {\n const {\n __scopeRadio,\n name,\n checked = false,\n required,\n disabled,\n value = 'on',\n onCheck,\n ...radioProps\n } = props;\n const [button, setButton] = React.useState(null);\n const composedRefs = useComposedRefs(forwardedRef, (node) => setButton(node));\n const hasConsumerStoppedPropagationRef = React.useRef(false);\n // We set this to true by default so that events bubble to forms without JS (SSR)\n const isFormControl = button ? Boolean(button.closest('form')) : true;\n\n return (\n \n {\n // radios cannot be unchecked so we only communicate a checked state\n if (!checked) onCheck?.();\n if (isFormControl) {\n hasConsumerStoppedPropagationRef.current = event.isPropagationStopped();\n // if radio is in a form, stop propagation from the button so that we only propagate\n // one click event (from the input). We propagate changes from an input so that native\n // form validation works and form events reflect radio updates.\n if (!hasConsumerStoppedPropagationRef.current) event.stopPropagation();\n }\n })}\n />\n {isFormControl && (\n \n )}\n \n );\n }\n);\n\nRadio.displayName = RADIO_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * RadioIndicator\n * -----------------------------------------------------------------------------------------------*/\n\nconst INDICATOR_NAME = 'RadioIndicator';\n\ntype RadioIndicatorElement = React.ElementRef;\ntype PrimitiveSpanProps = Radix.ComponentPropsWithoutRef;\nexport interface RadioIndicatorProps extends PrimitiveSpanProps {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true;\n}\n\nconst RadioIndicator = React.forwardRef(\n (props: ScopedProps, forwardedRef) => {\n const { __scopeRadio, forceMount, ...indicatorProps } = props;\n const context = useRadioContext(INDICATOR_NAME, __scopeRadio);\n return (\n \n \n \n );\n }\n);\n\nRadioIndicator.displayName = INDICATOR_NAME;\n\n/* ---------------------------------------------------------------------------------------------- */\n\ntype InputProps = Radix.ComponentPropsWithoutRef<'input'>;\ninterface BubbleInputProps extends Omit {\n checked: boolean;\n control: HTMLElement | null;\n bubbles: boolean;\n}\n\nconst BubbleInput = (props: BubbleInputProps) => {\n const { control, checked, bubbles = true, ...inputProps } = props;\n const ref = React.useRef(null);\n const prevChecked = usePrevious(checked);\n const controlSize = useSize(control);\n\n // Bubble checked change to parents (e.g form change event)\n React.useEffect(() => {\n const input = ref.current!;\n const inputProto = window.HTMLInputElement.prototype;\n const descriptor = Object.getOwnPropertyDescriptor(inputProto, 'checked') as PropertyDescriptor;\n const setChecked = descriptor.set;\n if (prevChecked !== checked && setChecked) {\n const event = new Event('click', { bubbles });\n setChecked.call(input, checked);\n input.dispatchEvent(event);\n }\n }, [prevChecked, checked, bubbles]);\n\n return (\n \n );\n};\n\nfunction getState(checked: boolean) {\n return checked ? 'checked' : 'unchecked';\n}\n\nexport {\n createRadioScope,\n //\n Radio,\n RadioIndicator,\n};\nexport type { RadioProps };\n","import * as React from 'react';\nimport { composeEventHandlers } from '@radix-ui/primitive';\nimport { useComposedRefs } from '@radix-ui/react-compose-refs';\nimport { createContextScope } from '@radix-ui/react-context';\nimport { Primitive } from '@radix-ui/react-primitive';\nimport * as RovingFocusGroup from '@radix-ui/react-roving-focus';\nimport { createRovingFocusGroupScope } from '@radix-ui/react-roving-focus';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport { useDirection } from '@radix-ui/react-direction';\nimport { Radio, RadioIndicator, createRadioScope } from './Radio';\n\nimport type * as Radix from '@radix-ui/react-primitive';\nimport type { Scope } from '@radix-ui/react-context';\n\nconst ARROW_KEYS = ['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'];\n\n/* -------------------------------------------------------------------------------------------------\n * RadioGroup\n * -----------------------------------------------------------------------------------------------*/\nconst RADIO_GROUP_NAME = 'RadioGroup';\n\ntype ScopedProps = P & { __scopeRadioGroup?: Scope };\nconst [createRadioGroupContext, createRadioGroupScope] = createContextScope(RADIO_GROUP_NAME, [\n createRovingFocusGroupScope,\n createRadioScope,\n]);\nconst useRovingFocusGroupScope = createRovingFocusGroupScope();\nconst useRadioScope = createRadioScope();\n\ntype RadioGroupContextValue = {\n name?: string;\n required: boolean;\n disabled: boolean;\n value?: string;\n onValueChange(value: string): void;\n};\n\nconst [RadioGroupProvider, useRadioGroupContext] =\n createRadioGroupContext(RADIO_GROUP_NAME);\n\ntype RadioGroupElement = React.ElementRef;\ntype RovingFocusGroupProps = Radix.ComponentPropsWithoutRef;\ntype PrimitiveDivProps = Radix.ComponentPropsWithoutRef;\ninterface RadioGroupProps extends PrimitiveDivProps {\n name?: RadioGroupContextValue['name'];\n required?: Radix.ComponentPropsWithoutRef['required'];\n disabled?: Radix.ComponentPropsWithoutRef['disabled'];\n dir?: RovingFocusGroupProps['dir'];\n orientation?: RovingFocusGroupProps['orientation'];\n loop?: RovingFocusGroupProps['loop'];\n defaultValue?: string;\n value?: RadioGroupContextValue['value'];\n onValueChange?: RadioGroupContextValue['onValueChange'];\n}\n\nconst RadioGroup = React.forwardRef(\n (props: ScopedProps, forwardedRef) => {\n const {\n __scopeRadioGroup,\n name,\n defaultValue,\n value: valueProp,\n required = false,\n disabled = false,\n orientation,\n dir,\n loop = true,\n onValueChange,\n ...groupProps\n } = props;\n const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeRadioGroup);\n const direction = useDirection(dir);\n const [value, setValue] = useControllableState({\n prop: valueProp,\n defaultProp: defaultValue,\n onChange: onValueChange,\n });\n\n return (\n \n \n \n \n \n );\n }\n);\n\nRadioGroup.displayName = RADIO_GROUP_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * RadioGroupItem\n * -----------------------------------------------------------------------------------------------*/\n\nconst ITEM_NAME = 'RadioGroupItem';\n\ntype RadioGroupItemElement = React.ElementRef;\ntype RadioProps = Radix.ComponentPropsWithoutRef;\ninterface RadioGroupItemProps extends Omit {\n value: string;\n}\n\nconst RadioGroupItem = React.forwardRef(\n (props: ScopedProps, forwardedRef) => {\n const { __scopeRadioGroup, disabled, ...itemProps } = props;\n const context = useRadioGroupContext(ITEM_NAME, __scopeRadioGroup);\n const isDisabled = context.disabled || disabled;\n const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeRadioGroup);\n const radioScope = useRadioScope(__scopeRadioGroup);\n const ref = React.useRef>(null);\n const composedRefs = useComposedRefs(forwardedRef, ref);\n const checked = context.value === itemProps.value;\n const isArrowKeyPressedRef = React.useRef(false);\n\n React.useEffect(() => {\n const handleKeyDown = (event: KeyboardEvent) => {\n if (ARROW_KEYS.includes(event.key)) {\n isArrowKeyPressedRef.current = true;\n }\n };\n const handleKeyUp = () => (isArrowKeyPressedRef.current = false);\n document.addEventListener('keydown', handleKeyDown);\n document.addEventListener('keyup', handleKeyUp);\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n document.removeEventListener('keyup', handleKeyUp);\n };\n }, []);\n\n return (\n \n context.onValueChange(itemProps.value)}\n onKeyDown={composeEventHandlers((event) => {\n // According to WAI ARIA, radio groups don't activate items on enter keypress\n if (event.key === 'Enter') event.preventDefault();\n })}\n onFocus={composeEventHandlers(itemProps.onFocus, () => {\n /**\n * Our `RovingFocusGroup` will focus the radio when navigating with arrow keys\n * and we need to \"check\" it in that case. We click it to \"check\" it (instead\n * of updating `context.value`) so that the radio change event fires.\n */\n if (isArrowKeyPressedRef.current) ref.current?.click();\n })}\n />\n \n );\n }\n);\n\nRadioGroupItem.displayName = ITEM_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * RadioGroupIndicator\n * -----------------------------------------------------------------------------------------------*/\n\nconst INDICATOR_NAME = 'RadioGroupIndicator';\n\ntype RadioGroupIndicatorElement = React.ElementRef;\ntype RadioIndicatorProps = Radix.ComponentPropsWithoutRef;\ninterface RadioGroupIndicatorProps extends RadioIndicatorProps {}\n\nconst RadioGroupIndicator = React.forwardRef(\n (props: ScopedProps, forwardedRef) => {\n const { __scopeRadioGroup, ...indicatorProps } = props;\n const radioScope = useRadioScope(__scopeRadioGroup);\n return ;\n }\n);\n\nRadioGroupIndicator.displayName = INDICATOR_NAME;\n\n/* ---------------------------------------------------------------------------------------------- */\n\nconst Root = RadioGroup;\nconst Item = RadioGroupItem;\nconst Indicator = RadioGroupIndicator;\n\nexport {\n createRadioGroupScope,\n //\n RadioGroup,\n RadioGroupItem,\n RadioGroupIndicator,\n //\n Root,\n Item,\n Indicator,\n};\nexport type { RadioGroupProps, RadioGroupItemProps, RadioGroupIndicatorProps };\n","import React from 'react'\nimport { styled, CSS, VariantProps } from 'styles/stitches.config'\nimport * as RadioGroupPrimitive from '@radix-ui/react-radio-group'\n\nconst Label = styled('label', {\n position: 'relative',\n cursor: 'pointer',\n display: 'inline-flex',\n alignItems: 'center',\n gap: '$2',\n})\n\nexport const RadioGroup = styled(RadioGroupPrimitive.Root, {\n display: 'flex',\n gap: '$6',\n alignItems: 'center',\n})\n\nconst StyledIndicator = styled(RadioGroupPrimitive.Indicator, {\n display: 'block',\n width: '12px',\n height: '12px',\n borderRadius: 'inherit',\n backgroundColor: '$primary',\n})\n\nconst StyledRadio = styled(RadioGroupPrimitive.Item, {\n 'userSelect': 'none',\n 'appearance': 'none',\n 'display': 'inline-flex',\n 'alignItems': 'center',\n 'justifyContent': 'center',\n 'flexShrink': 0,\n 'padding': 0,\n 'border': '1.5px solid $blue4',\n 'backgroundColor': 'transparent',\n 'borderRadius': '50%',\n 'color': '$fg',\n 'overflow': 'hidden',\n\n '&:focus-visible': {\n boxShadow: '$outline',\n },\n\n '&[data-state=\"checked\"]': {\n borderColor: '$primaryLight',\n },\n\n 'variants': {\n size: {\n sm: {\n width: '$3',\n height: '$3',\n },\n md: {\n width: '20px',\n height: '20px',\n },\n },\n },\n 'defaultVariants': {\n size: 'md',\n },\n})\n\ntype RadioVariants = VariantProps\ntype RadioGroupItemPrimitiveProps = React.ComponentProps\ntype RadioProps = RadioGroupItemPrimitiveProps & RadioVariants & { css?: CSS }\n\nexport const Radio = React.forwardRef, RadioProps>(({ children, ...rest }, forwardedRef) => (\n \n))\n\nRadio.displayName = 'Radio'\n","import * as React from 'react'\nimport { SVGProps } from 'react'\nconst SvgQuestionBulletIcon = (props: SVGProps) => (\n \n)\nexport default SvgQuestionBulletIcon\n","import * as React from 'react'\nimport { SVGProps } from 'react'\n\nconst SvgBackNavArrowIcon = (props: SVGProps) => (\n \n)\n\nexport default SvgBackNavArrowIcon\n","import * as React from 'react'\nimport { SVGProps } from 'react'\n\nconst SvgCloseIcon = (props: SVGProps) => (\n \n)\n\nexport default SvgCloseIcon\n","import * as React from 'react'\nimport { SVGProps } from 'react'\n\nconst SvgDownArrowIcon = (props: SVGProps) => (\n \n)\n\nexport default SvgDownArrowIcon\n","import * as React from 'react'\nimport { SVGProps } from 'react'\nconst SvgLeftArrowIcon = (props: SVGProps) => (\n \n)\nexport default SvgLeftArrowIcon\n","import * as React from 'react'\nimport { SVGProps } from 'react'\nconst SvgRightArrowIcon = (props: SVGProps) => (\n \n)\nexport default SvgRightArrowIcon\n","import * as React from 'react'\nimport { SVGProps } from 'react'\n\nconst SvgEditIcon = (props: SVGProps) => (\n \n)\n\nexport default SvgEditIcon\n","import * as React from 'react'\nimport { SVGProps } from 'react'\n\nconst SvgEyeIcon = (props: SVGProps) => (\n \n)\n\nexport default SvgEyeIcon\n","import * as React from 'react'\nimport { SVGProps } from 'react'\n\nconst SvgIncidentIcon = (props: SVGProps) => (\n \n)\n\nexport default SvgIncidentIcon\n","const SvgInsuranceIcon = () => (\n \n)\n\nexport default SvgInsuranceIcon\n","import * as React from 'react'\nimport { SVGProps } from 'react'\n\nconst SvgKeyIcon = (props: SVGProps) => (\n \n)\n\nexport default SvgKeyIcon\n","import * as React from 'react'\nimport { SVGProps } from 'react'\n\nconst SvgLogoutIcon = (props: SVGProps) => (\n \n)\n\nexport default SvgLogoutIcon\n","import * as React from 'react'\nimport { SVGProps } from 'react'\n\nconst SvgMenuIcon = (props: SVGProps) => (\n \n)\n\nexport default SvgMenuIcon\n","import * as React from 'react'\nimport { SVGProps } from 'react'\n\nconst SvgSettingsIcon = (props: SVGProps) => (\n \n)\n\nexport default SvgSettingsIcon\n","import * as React from 'react'\nimport { SVGProps } from 'react'\n\nconst SvgUpArrowIcon = (props: SVGProps) => (\n \n)\n\nexport default SvgUpArrowIcon\n","import * as React from 'react'\nimport { SVGProps } from 'react'\n\nconst SvgUserIcon = (props: SVGProps) => (\n \n)\n\nexport default SvgUserIcon\n","import { SVGProps } from 'react'\n\nconst SvgHideIcon = (props: SVGProps) => (\n \n)\n\nexport default SvgHideIcon\n","import { SVGProps } from 'react'\n\nconst ScoreA = (props: SVGProps) => (\n \n)\n\nexport default ScoreA\n","import { SVGProps } from 'react'\n\nconst ScoreB = (props: SVGProps) => (\n \n)\n\nexport default ScoreB\n","import { SVGProps } from 'react'\n\nconst ScoreC = (props: SVGProps) => (\n \n)\n\nexport default ScoreC\n","import { SVGProps } from 'react'\n\nconst ScoreD = (props: SVGProps) => (\n \n)\n\nexport default ScoreD\n","import * as React from 'react'\nimport { SVGProps } from 'react'\n\nconst SvgFileIcon = (props: SVGProps) => (\n \n)\n\nexport default SvgFileIcon\n","const SvgDownloadIcon = () => (\n \n)\n\nexport default SvgDownloadIcon\n","import { SVGProps } from 'react'\n\nconst EmailIcon = (props: SVGProps) => (\n \n)\n\nexport default EmailIcon\n","import { SVGProps } from 'react'\n\nconst DltEmailIconSvg = (props: SVGProps) => (\n \n)\n\nexport default DltEmailIconSvg\n","import { SVGProps } from 'react'\n\nconst NewLinkedInIconSvg = (props: SVGProps) => (\n \n)\n\nexport default NewLinkedInIconSvg\n","import { SVGProps } from 'react'\n\nconst LocationIconSvg = (props: SVGProps) => (\n \n)\n\nexport default LocationIconSvg\n","import { SVGProps } from 'react'\n\nconst NewTwitterIconSvg = (props: SVGProps) => (\n \n)\n\nexport default NewTwitterIconSvg\n","import { SVGProps } from 'react'\n\nconst PhoneIconSvg = (props: SVGProps) => (\n \n)\n\nexport default PhoneIconSvg\n","import generateUtilityClasses from '@mui/utils/generateUtilityClasses';\nimport generateUtilityClass from '@mui/utils/generateUtilityClass';\nexport function getButtonUtilityClass(slot) {\n return generateUtilityClass('MuiButton', slot);\n}\nconst buttonClasses = generateUtilityClasses('MuiButton', ['root', 'text', 'textInherit', 'textPrimary', 'textSecondary', 'textSuccess', 'textError', 'textInfo', 'textWarning', 'outlined', 'outlinedInherit', 'outlinedPrimary', 'outlinedSecondary', 'outlinedSuccess', 'outlinedError', 'outlinedInfo', 'outlinedWarning', 'contained', 'containedInherit', 'containedPrimary', 'containedSecondary', 'containedSuccess', 'containedError', 'containedInfo', 'containedWarning', 'disableElevation', 'focusVisible', 'disabled', 'colorInherit', 'textSizeSmall', 'textSizeMedium', 'textSizeLarge', 'outlinedSizeSmall', 'outlinedSizeMedium', 'outlinedSizeLarge', 'containedSizeSmall', 'containedSizeMedium', 'containedSizeLarge', 'sizeMedium', 'sizeSmall', 'sizeLarge', 'fullWidth', 'startIcon', 'endIcon', 'iconSizeSmall', 'iconSizeMedium', 'iconSizeLarge']);\nexport default buttonClasses;","import * as React from 'react';\n/**\n * @ignore - internal component.\n */\nconst ButtonGroupContext = /*#__PURE__*/React.createContext({});\nif (process.env.NODE_ENV !== 'production') {\n ButtonGroupContext.displayName = 'ButtonGroupContext';\n}\nexport default ButtonGroupContext;","import * as React from 'react';\n/**\n * @ignore - internal component.\n */\nconst ButtonGroupButtonContext = /*#__PURE__*/React.createContext(undefined);\nif (process.env.NODE_ENV !== 'production') {\n ButtonGroupButtonContext.displayName = 'ButtonGroupButtonContext';\n}\nexport default ButtonGroupButtonContext;","'use client';\n\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"children\", \"color\", \"component\", \"className\", \"disabled\", \"disableElevation\", \"disableFocusRipple\", \"endIcon\", \"focusVisibleClassName\", \"fullWidth\", \"size\", \"startIcon\", \"type\", \"variant\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { internal_resolveProps as resolveProps } from '@mui/utils';\nimport { unstable_composeClasses as composeClasses } from '@mui/base/composeClasses';\nimport { alpha } from '@mui/system';\nimport styled, { rootShouldForwardProp } from '../styles/styled';\nimport useThemeProps from '../styles/useThemeProps';\nimport ButtonBase from '../ButtonBase';\nimport capitalize from '../utils/capitalize';\nimport buttonClasses, { getButtonUtilityClass } from './buttonClasses';\nimport ButtonGroupContext from '../ButtonGroup/ButtonGroupContext';\nimport ButtonGroupButtonContext from '../ButtonGroup/ButtonGroupButtonContext';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n color,\n disableElevation,\n fullWidth,\n size,\n variant,\n classes\n } = ownerState;\n const slots = {\n root: ['root', variant, `${variant}${capitalize(color)}`, `size${capitalize(size)}`, `${variant}Size${capitalize(size)}`, color === 'inherit' && 'colorInherit', disableElevation && 'disableElevation', fullWidth && 'fullWidth'],\n label: ['label'],\n startIcon: ['startIcon', `iconSize${capitalize(size)}`],\n endIcon: ['endIcon', `iconSize${capitalize(size)}`]\n };\n const composedClasses = composeClasses(slots, getButtonUtilityClass, classes);\n return _extends({}, classes, composedClasses);\n};\nconst commonIconStyles = ownerState => _extends({}, ownerState.size === 'small' && {\n '& > *:nth-of-type(1)': {\n fontSize: 18\n }\n}, ownerState.size === 'medium' && {\n '& > *:nth-of-type(1)': {\n fontSize: 20\n }\n}, ownerState.size === 'large' && {\n '& > *:nth-of-type(1)': {\n fontSize: 22\n }\n});\nconst ButtonRoot = styled(ButtonBase, {\n shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',\n name: 'MuiButton',\n slot: 'Root',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.root, styles[ownerState.variant], styles[`${ownerState.variant}${capitalize(ownerState.color)}`], styles[`size${capitalize(ownerState.size)}`], styles[`${ownerState.variant}Size${capitalize(ownerState.size)}`], ownerState.color === 'inherit' && styles.colorInherit, ownerState.disableElevation && styles.disableElevation, ownerState.fullWidth && styles.fullWidth];\n }\n})(({\n theme,\n ownerState\n}) => {\n var _theme$palette$getCon, _theme$palette;\n const inheritContainedBackgroundColor = theme.palette.mode === 'light' ? theme.palette.grey[300] : theme.palette.grey[800];\n const inheritContainedHoverBackgroundColor = theme.palette.mode === 'light' ? theme.palette.grey.A100 : theme.palette.grey[700];\n return _extends({}, theme.typography.button, {\n minWidth: 64,\n padding: '6px 16px',\n borderRadius: (theme.vars || theme).shape.borderRadius,\n transition: theme.transitions.create(['background-color', 'box-shadow', 'border-color', 'color'], {\n duration: theme.transitions.duration.short\n }),\n '&:hover': _extends({\n textDecoration: 'none',\n backgroundColor: theme.vars ? `rgba(${theme.vars.palette.text.primaryChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(theme.palette.text.primary, theme.palette.action.hoverOpacity),\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n backgroundColor: 'transparent'\n }\n }, ownerState.variant === 'text' && ownerState.color !== 'inherit' && {\n backgroundColor: theme.vars ? `rgba(${theme.vars.palette[ownerState.color].mainChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(theme.palette[ownerState.color].main, theme.palette.action.hoverOpacity),\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n backgroundColor: 'transparent'\n }\n }, ownerState.variant === 'outlined' && ownerState.color !== 'inherit' && {\n border: `1px solid ${(theme.vars || theme).palette[ownerState.color].main}`,\n backgroundColor: theme.vars ? `rgba(${theme.vars.palette[ownerState.color].mainChannel} / ${theme.vars.palette.action.hoverOpacity})` : alpha(theme.palette[ownerState.color].main, theme.palette.action.hoverOpacity),\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n backgroundColor: 'transparent'\n }\n }, ownerState.variant === 'contained' && {\n backgroundColor: theme.vars ? theme.vars.palette.Button.inheritContainedHoverBg : inheritContainedHoverBackgroundColor,\n boxShadow: (theme.vars || theme).shadows[4],\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n boxShadow: (theme.vars || theme).shadows[2],\n backgroundColor: (theme.vars || theme).palette.grey[300]\n }\n }, ownerState.variant === 'contained' && ownerState.color !== 'inherit' && {\n backgroundColor: (theme.vars || theme).palette[ownerState.color].dark,\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n backgroundColor: (theme.vars || theme).palette[ownerState.color].main\n }\n }),\n '&:active': _extends({}, ownerState.variant === 'contained' && {\n boxShadow: (theme.vars || theme).shadows[8]\n }),\n [`&.${buttonClasses.focusVisible}`]: _extends({}, ownerState.variant === 'contained' && {\n boxShadow: (theme.vars || theme).shadows[6]\n }),\n [`&.${buttonClasses.disabled}`]: _extends({\n color: (theme.vars || theme).palette.action.disabled\n }, ownerState.variant === 'outlined' && {\n border: `1px solid ${(theme.vars || theme).palette.action.disabledBackground}`\n }, ownerState.variant === 'contained' && {\n color: (theme.vars || theme).palette.action.disabled,\n boxShadow: (theme.vars || theme).shadows[0],\n backgroundColor: (theme.vars || theme).palette.action.disabledBackground\n })\n }, ownerState.variant === 'text' && {\n padding: '6px 8px'\n }, ownerState.variant === 'text' && ownerState.color !== 'inherit' && {\n color: (theme.vars || theme).palette[ownerState.color].main\n }, ownerState.variant === 'outlined' && {\n padding: '5px 15px',\n border: '1px solid currentColor'\n }, ownerState.variant === 'outlined' && ownerState.color !== 'inherit' && {\n color: (theme.vars || theme).palette[ownerState.color].main,\n border: theme.vars ? `1px solid rgba(${theme.vars.palette[ownerState.color].mainChannel} / 0.5)` : `1px solid ${alpha(theme.palette[ownerState.color].main, 0.5)}`\n }, ownerState.variant === 'contained' && {\n color: theme.vars ?\n // this is safe because grey does not change between default light/dark mode\n theme.vars.palette.text.primary : (_theme$palette$getCon = (_theme$palette = theme.palette).getContrastText) == null ? void 0 : _theme$palette$getCon.call(_theme$palette, theme.palette.grey[300]),\n backgroundColor: theme.vars ? theme.vars.palette.Button.inheritContainedBg : inheritContainedBackgroundColor,\n boxShadow: (theme.vars || theme).shadows[2]\n }, ownerState.variant === 'contained' && ownerState.color !== 'inherit' && {\n color: (theme.vars || theme).palette[ownerState.color].contrastText,\n backgroundColor: (theme.vars || theme).palette[ownerState.color].main\n }, ownerState.color === 'inherit' && {\n color: 'inherit',\n borderColor: 'currentColor'\n }, ownerState.size === 'small' && ownerState.variant === 'text' && {\n padding: '4px 5px',\n fontSize: theme.typography.pxToRem(13)\n }, ownerState.size === 'large' && ownerState.variant === 'text' && {\n padding: '8px 11px',\n fontSize: theme.typography.pxToRem(15)\n }, ownerState.size === 'small' && ownerState.variant === 'outlined' && {\n padding: '3px 9px',\n fontSize: theme.typography.pxToRem(13)\n }, ownerState.size === 'large' && ownerState.variant === 'outlined' && {\n padding: '7px 21px',\n fontSize: theme.typography.pxToRem(15)\n }, ownerState.size === 'small' && ownerState.variant === 'contained' && {\n padding: '4px 10px',\n fontSize: theme.typography.pxToRem(13)\n }, ownerState.size === 'large' && ownerState.variant === 'contained' && {\n padding: '8px 22px',\n fontSize: theme.typography.pxToRem(15)\n }, ownerState.fullWidth && {\n width: '100%'\n });\n}, ({\n ownerState\n}) => ownerState.disableElevation && {\n boxShadow: 'none',\n '&:hover': {\n boxShadow: 'none'\n },\n [`&.${buttonClasses.focusVisible}`]: {\n boxShadow: 'none'\n },\n '&:active': {\n boxShadow: 'none'\n },\n [`&.${buttonClasses.disabled}`]: {\n boxShadow: 'none'\n }\n});\nconst ButtonStartIcon = styled('span', {\n name: 'MuiButton',\n slot: 'StartIcon',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.startIcon, styles[`iconSize${capitalize(ownerState.size)}`]];\n }\n})(({\n ownerState\n}) => _extends({\n display: 'inherit',\n marginRight: 8,\n marginLeft: -4\n}, ownerState.size === 'small' && {\n marginLeft: -2\n}, commonIconStyles(ownerState)));\nconst ButtonEndIcon = styled('span', {\n name: 'MuiButton',\n slot: 'EndIcon',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.endIcon, styles[`iconSize${capitalize(ownerState.size)}`]];\n }\n})(({\n ownerState\n}) => _extends({\n display: 'inherit',\n marginRight: -4,\n marginLeft: 8\n}, ownerState.size === 'small' && {\n marginRight: -2\n}, commonIconStyles(ownerState)));\nconst Button = /*#__PURE__*/React.forwardRef(function Button(inProps, ref) {\n // props priority: `inProps` > `contextProps` > `themeDefaultProps`\n const contextProps = React.useContext(ButtonGroupContext);\n const buttonGroupButtonContextPositionClassName = React.useContext(ButtonGroupButtonContext);\n const resolvedProps = resolveProps(contextProps, inProps);\n const props = useThemeProps({\n props: resolvedProps,\n name: 'MuiButton'\n });\n const {\n children,\n color = 'primary',\n component = 'button',\n className,\n disabled = false,\n disableElevation = false,\n disableFocusRipple = false,\n endIcon: endIconProp,\n focusVisibleClassName,\n fullWidth = false,\n size = 'medium',\n startIcon: startIconProp,\n type,\n variant = 'text'\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const ownerState = _extends({}, props, {\n color,\n component,\n disabled,\n disableElevation,\n disableFocusRipple,\n fullWidth,\n size,\n type,\n variant\n });\n const classes = useUtilityClasses(ownerState);\n const startIcon = startIconProp && /*#__PURE__*/_jsx(ButtonStartIcon, {\n className: classes.startIcon,\n ownerState: ownerState,\n children: startIconProp\n });\n const endIcon = endIconProp && /*#__PURE__*/_jsx(ButtonEndIcon, {\n className: classes.endIcon,\n ownerState: ownerState,\n children: endIconProp\n });\n const positionClassName = buttonGroupButtonContextPositionClassName || '';\n return /*#__PURE__*/_jsxs(ButtonRoot, _extends({\n ownerState: ownerState,\n className: clsx(contextProps.className, classes.root, className, positionClassName),\n component: component,\n disabled: disabled,\n focusRipple: !disableFocusRipple,\n focusVisibleClassName: clsx(classes.focusVisible, focusVisibleClassName),\n ref: ref,\n type: type\n }, other, {\n classes: classes,\n children: [startIcon, children, endIcon]\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? Button.propTypes /* remove-proptypes */ = {\n // ┌────────────────────────────── Warning ──────────────────────────────┐\n // │ These PropTypes are generated from the TypeScript type definitions. │\n // │ To update them, edit the d.ts file and run `pnpm proptypes`. │\n // └─────────────────────────────────────────────────────────────────────┘\n /**\n * The content of the component.\n */\n children: PropTypes.node,\n /**\n * Override or extend the styles applied to the component.\n */\n classes: PropTypes.object,\n /**\n * @ignore\n */\n className: PropTypes.string,\n /**\n * The color of the component.\n * It supports both default and custom theme colors, which can be added as shown in the\n * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).\n * @default 'primary'\n */\n color: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['inherit', 'primary', 'secondary', 'success', 'error', 'info', 'warning']), PropTypes.string]),\n /**\n * The component used for the root node.\n * Either a string to use a HTML element or a component.\n */\n component: PropTypes.elementType,\n /**\n * If `true`, the component is disabled.\n * @default false\n */\n disabled: PropTypes.bool,\n /**\n * If `true`, no elevation is used.\n * @default false\n */\n disableElevation: PropTypes.bool,\n /**\n * If `true`, the keyboard focus ripple is disabled.\n * @default false\n */\n disableFocusRipple: PropTypes.bool,\n /**\n * If `true`, the ripple effect is disabled.\n *\n * ⚠️ Without a ripple there is no styling for :focus-visible by default. Be sure\n * to highlight the element by applying separate styles with the `.Mui-focusVisible` class.\n * @default false\n */\n disableRipple: PropTypes.bool,\n /**\n * Element placed after the children.\n */\n endIcon: PropTypes.node,\n /**\n * @ignore\n */\n focusVisibleClassName: PropTypes.string,\n /**\n * If `true`, the button will take up the full width of its container.\n * @default false\n */\n fullWidth: PropTypes.bool,\n /**\n * The URL to link to when the button is clicked.\n * If defined, an `a` element will be used as the root node.\n */\n href: PropTypes.string,\n /**\n * The size of the component.\n * `small` is equivalent to the dense button styling.\n * @default 'medium'\n */\n size: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['small', 'medium', 'large']), PropTypes.string]),\n /**\n * Element placed before the children.\n */\n startIcon: PropTypes.node,\n /**\n * The system prop that allows defining system overrides as well as additional CSS styles.\n */\n sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),\n /**\n * @ignore\n */\n type: PropTypes.oneOfType([PropTypes.oneOf(['button', 'reset', 'submit']), PropTypes.string]),\n /**\n * The variant to use.\n * @default 'text'\n */\n variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['contained', 'outlined', 'text']), PropTypes.string])\n} : void 0;\nexport default Button;","import React, { useEffect, useRef, useState } from 'react'\nimport { StyledLabel, StyledDropdownWrap } from 'components/form/Textfield.styles'\nimport Button from '@mui/material/Button'\nimport Grow from '@mui/material/Grow'\nimport Paper from '@mui/material/Paper'\nimport Popper from '@mui/material/Popper'\nimport MenuList from '@mui/material/MenuList'\nimport ClickAwayListener from '@mui/material/ClickAwayListener'\nimport KeyboardArrowDownIcon from '@mui/icons-material/KeyboardArrowDown'\nimport { ServiceListing } from 'features/quote/components/type'\nimport { CircularProgress } from '@mui/material'\nimport { CircularSpinnerCss } from 'features/incidents/components/style'\nimport { OptionsLabel } from 'features/incidents/components/enums'\nimport { Box } from 'components/elements'\nimport CSS from 'csstype'\n\nexport type Listing = {\n label: string\n value: string | number\n key?: number\n premiumAmount?: number\n maxCoverage?: number\n primaryService?: ServiceListing\n services?: ServiceListing[]\n discount?: number\n}\n\ntype MenuDropdownProps = {\n label?: string\n value?: Listing\n placeholder?: string\n setValue?: (...arg: any) => void\n list?: Listing[]\n isResponseFetching?: boolean\n isDisabled?: boolean\n style?: CSS.Properties\n inputStyle?: CSS.Properties\n}\n\nexport const MenuDropdown = ({ placeholder, label, value, setValue, list, isResponseFetching, isDisabled, style, inputStyle }: MenuDropdownProps) => {\n const [open, setOpen] = useState(false)\n const [filteredList, setFilteredList] = useState(list)\n const [filterValue, setFilterValue] = useState('')\n const anchorRef = useRef(null)\n const inputRef = useRef(null)\n\n const handleToggle = () => {\n setOpen(prevOpen => !prevOpen)\n }\n\n const handleClose = (event: Event | React.SyntheticEvent) => {\n if (anchorRef.current && anchorRef.current.contains(event.target as HTMLElement)) {\n return\n }\n setOpen(false)\n setFilterValue('')\n }\n\n useEffect(() => {\n if (!filterValue.trim()) {\n setFilteredList(list)\n } else {\n const filtered = list?.filter(item => item?.label.toLowerCase().includes(filterValue.trim().toLowerCase()))\n setFilteredList(filtered?.length ? filtered : list)\n }\n }, [filterValue, list])\n\n function handleListKeyDown(event: React.KeyboardEvent) {\n if (event.key === 'Tab') {\n event.preventDefault()\n setOpen(false)\n } else if (event.key === 'Escape') {\n setOpen(false)\n }\n }\n\n useEffect(() => {\n if (open) {\n inputRef?.current?.focus()\n }\n }, [open])\n\n return (\n \n {label}\n : }\n >\n {value?.label || placeholder}\n \n\n \n {({ TransitionProps, placement }) => (\n \n \n setFilterValue(e.target.value)} ref={inputRef} />\n \n \n \n \n )}\n \n \n )\n}\n","import { styled } from 'styles'\n\nexport const ModalBlock = styled('div', {\n 'display': 'flex',\n 'justifyContent': 'center',\n 'alignItems': 'flex-end',\n 'overflow': 'hidden',\n 'position': 'fixed',\n 'bottom': 0,\n 'left': 0,\n 'right': 0,\n 'top': 0,\n 'opacity': 1,\n 'zIndex': 400,\n\n '@sm': {\n alignItems: 'center',\n },\n})\n\nexport const ModalOverlay = styled('div', {\n bottom: 0,\n cursor: 'default',\n display: 'block',\n left: 0,\n position: 'absolute',\n right: 0,\n top: 0,\n backgroundColor: 'rgb(0,0,0,.4)',\n})\n\nexport const ModalClose = styled('a', {\n float: 'right !important',\n textDecoration: 'none !important',\n cursor: 'pointer',\n fontSize: '1rem',\n})\n\nexport const ModalContainer = styled('div', {\n 'bg': '$cardGradient',\n 'backdropFilter': 'blur(50px)',\n 'borderRadius': '.75rem .75rem 0 0',\n 'display': 'flex',\n 'flexDirection': 'column',\n 'maxHeight': '75vh',\n 'maxWidth': '550px',\n 'padding': '2rem',\n 'width': '100%',\n 'animation': 'slide-down 0.2s ease 1',\n 'zIndex': 1,\n 'boxShadow': '0px 4px 24px -1px $black33',\n 'overflowY': 'auto',\n\n '@sm': {\n borderRadius: '$base',\n },\n})\n\nexport const ModalBody = styled('div', {\n position: 'relative',\n})\n\nexport const ModalHeader = styled('div', {\n justifyContent: 'space-between',\n color: '$gray9',\n margin: 'auto',\n paddingBottom: '1rem',\n})\n\nexport const ModalTitle = styled('h2', {\n textTransform: 'capitalize',\n textAlign: 'center',\n color: '$white',\n})\n\nexport const ModalDescription = styled('h4', {\n textAlign: 'center',\n color: '$white',\n margin: 0,\n})\n\nexport const ModalFooter = styled('div', {\n display: 'flex',\n padding: '10px 0px',\n})\n\nexport const Button = styled('button', {\n background: '$purple',\n color: '$white',\n fontSize: '1em',\n margin: '10px',\n padding: '5px 10px',\n border: '2px solid $purple',\n borderRadius: '3px',\n cursor: 'pointer',\n})\n","import CSS from 'csstype'\nimport React, { Fragment, useEffect } from 'react'\nimport { ModalBlock, ModalBody, ModalDescription, ModalContainer, ModalFooter, ModalHeader, ModalOverlay, ModalTitle } from './style'\nimport { Button } from 'components/button'\nimport { ErrorBox, ModalbuttonWrapCss } from 'features/profile/components/EditProfileForm'\nimport { CircularProgress } from '@mui/material'\n\ntype ModalProps = {\n title?: string\n footer?: React.ReactNode\n children?: React.ReactNode\n active?: boolean\n hideModal?: () => void\n onAccept?: () => void\n description?: string\n isLoading?: boolean\n style?: CSS.Properties\n hasError?: boolean\n apiErrorText?: string\n isForm?: boolean\n acceptText: string\n buttonAsAnchor?: boolean\n hrefValue?: string\n isHidden?: boolean\n isFooterHidden?: boolean\n}\n\nexport const Modal = (props: ModalProps) => {\n const {\n isFooterHidden,\n isHidden,\n title,\n description,\n children,\n active,\n hideModal,\n onAccept,\n style,\n isLoading,\n hasError,\n apiErrorText,\n isForm,\n acceptText,\n buttonAsAnchor,\n hrefValue,\n } = props\n const doc: Document = document\n const body = doc.querySelector('body')\n useEffect(() => {\n active ? body?.classList.add('overflow--hidden--modal') : body?.classList.remove('overflow--hidden--modal')\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [active])\n const cancelButtonText = buttonAsAnchor ? 'Ok' : 'Cancel'\n const acceptButton = buttonAsAnchor ? (\n \n ) : (\n \n )\n\n return (\n \n {active && (\n \n \n \n \n {title}\n {description}\n \n \n <>\n {children}\n {!!hasError && {apiErrorText}}\n \n \n {!isFooterHidden && (\n \n <>\n {isHidden ? (\n <>{acceptButton}\n ) : (\n <>\n \n {acceptButton}\n \n )}\n \n \n )}\n \n \n )}\n \n )\n}\n","function r(e){var t,f,n=\"\";if(\"string\"==typeof e||\"number\"==typeof e)n+=e;else if(\"object\"==typeof e)if(Array.isArray(e))for(t=0;t = P & { __scopeCollapsible?: Scope };\nconst [createCollapsibleContext, createCollapsibleScope] = createContextScope(COLLAPSIBLE_NAME);\n\ntype CollapsibleContextValue = {\n contentId: string;\n disabled?: boolean;\n open: boolean;\n onOpenToggle(): void;\n};\n\nconst [CollapsibleProvider, useCollapsibleContext] =\n createCollapsibleContext(COLLAPSIBLE_NAME);\n\ntype CollapsibleElement = React.ElementRef;\ntype PrimitiveDivProps = Radix.ComponentPropsWithoutRef;\ninterface CollapsibleProps extends PrimitiveDivProps {\n defaultOpen?: boolean;\n open?: boolean;\n disabled?: boolean;\n onOpenChange?(open: boolean): void;\n}\n\nconst Collapsible = React.forwardRef(\n (props: ScopedProps, forwardedRef) => {\n const {\n __scopeCollapsible,\n open: openProp,\n defaultOpen,\n disabled,\n onOpenChange,\n ...collapsibleProps\n } = props;\n\n const [open = false, setOpen] = useControllableState({\n prop: openProp,\n defaultProp: defaultOpen,\n onChange: onOpenChange,\n });\n\n return (\n setOpen((prevOpen) => !prevOpen), [setOpen])}\n >\n \n \n );\n }\n);\n\nCollapsible.displayName = COLLAPSIBLE_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * CollapsibleTrigger\n * -----------------------------------------------------------------------------------------------*/\n\nconst TRIGGER_NAME = 'CollapsibleTrigger';\n\ntype CollapsibleTriggerElement = React.ElementRef;\ntype PrimitiveButtonProps = Radix.ComponentPropsWithoutRef;\ninterface CollapsibleTriggerProps extends PrimitiveButtonProps {}\n\nconst CollapsibleTrigger = React.forwardRef(\n (props: ScopedProps, forwardedRef) => {\n const { __scopeCollapsible, ...triggerProps } = props;\n const context = useCollapsibleContext(TRIGGER_NAME, __scopeCollapsible);\n return (\n \n );\n }\n);\n\nCollapsibleTrigger.displayName = TRIGGER_NAME;\n\n/* -------------------------------------------------------------------------------------------------\n * CollapsibleContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'CollapsibleContent';\n\ntype CollapsibleContentElement = CollapsibleContentImplElement;\ninterface CollapsibleContentProps extends Omit {\n /**\n * Used to force mounting when more control is needed. Useful when\n * controlling animation with React animation libraries.\n */\n forceMount?: true;\n}\n\nconst CollapsibleContent = React.forwardRef(\n (props: ScopedProps, forwardedRef) => {\n const { forceMount, ...contentProps } = props;\n const context = useCollapsibleContext(CONTENT_NAME, props.__scopeCollapsible);\n return (\n \n {({ present }) => (\n \n )}\n \n );\n }\n);\n\nCollapsibleContent.displayName = CONTENT_NAME;\n\n/* -----------------------------------------------------------------------------------------------*/\n\ntype CollapsibleContentImplElement = React.ElementRef;\ninterface CollapsibleContentImplProps extends PrimitiveDivProps {\n present: boolean;\n}\n\nconst CollapsibleContentImpl = React.forwardRef<\n CollapsibleContentImplElement,\n CollapsibleContentImplProps\n>((props: ScopedProps, forwardedRef) => {\n const { __scopeCollapsible, present, children, ...contentProps } = props;\n const context = useCollapsibleContext(CONTENT_NAME, __scopeCollapsible);\n const [isPresent, setIsPresent] = React.useState(present);\n const ref = React.useRef(null);\n const composedRefs = useComposedRefs(forwardedRef, ref);\n const heightRef = React.useRef(0);\n const height = heightRef.current;\n const widthRef = React.useRef(0);\n const width = widthRef.current;\n // when opening we want it to immediately open to retrieve dimensions\n // when closing we delay `present` to retrieve dimensions before closing\n const isOpen = context.open || isPresent;\n const isMountAnimationPreventedRef = React.useRef(isOpen);\n const originalStylesRef = React.useRef>();\n\n React.useEffect(() => {\n const rAF = requestAnimationFrame(() => (isMountAnimationPreventedRef.current = false));\n return () => cancelAnimationFrame(rAF);\n }, []);\n\n useLayoutEffect(() => {\n const node = ref.current;\n if (node) {\n originalStylesRef.current = originalStylesRef.current || {\n transitionDuration: node.style.transitionDuration,\n animationName: node.style.animationName,\n };\n // block any animations/transitions so the element renders at its full dimensions\n node.style.transitionDuration = '0s';\n node.style.animationName = 'none';\n\n // get width and height from full dimensions\n const rect = node.getBoundingClientRect();\n heightRef.current = rect.height;\n widthRef.current = rect.width;\n\n // kick off any animations/transitions that were originally set up if it isn't the initial mount\n if (!isMountAnimationPreventedRef.current) {\n node.style.transitionDuration = originalStylesRef.current.transitionDuration;\n node.style.animationName = originalStylesRef.current.animationName;\n }\n\n setIsPresent(present);\n }\n /**\n * depends on `context.open` because it will change to `false`\n * when a close is triggered but `present` will be `false` on\n * animation end (so when close finishes). This allows us to\n * retrieve the dimensions *before* closing.\n */\n }, [context.open, present]);\n\n return (\n \n {isOpen && children}\n \n );\n});\n\n/* -----------------------------------------------------------------------------------------------*/\n\nfunction getState(open?: boolean) {\n return open ? 'open' : 'closed';\n}\n\nconst Root = Collapsible;\nconst Trigger = CollapsibleTrigger;\nconst Content = CollapsibleContent;\n\nexport {\n createCollapsibleScope,\n //\n Collapsible,\n CollapsibleTrigger,\n CollapsibleContent,\n //\n Root,\n Trigger,\n Content,\n};\nexport type { CollapsibleProps, CollapsibleTriggerProps, CollapsibleContentProps };\n","import { keyframes, styled } from 'styles/stitches.config'\nimport * as CollapsiblePrimitive from '@radix-ui/react-collapsible'\n\nconst open = keyframes({\n from: { height: 0 },\n to: { height: 'var(--radix-collapsible-content-height)' },\n})\n\nconst close = keyframes({\n from: { height: 'var(--radix-collapsible-content-height)' },\n to: { height: 0 },\n})\n\nconst StyledCollapsible = styled(CollapsiblePrimitive.Root, {})\n\nconst StyledCollapsibleContent = styled(CollapsiblePrimitive.Content, {\n 'overflow': 'hidden',\n '&[data-state=\"open\"]': { animation: `${open} 300ms ease-out` },\n '&[data-state=\"closed\"]': { animation: `${close} 300ms ease-out` },\n})\n\n// Exports\nexport const Collapsible = StyledCollapsible\nexport const CollapsibleTrigger = CollapsiblePrimitive.Trigger\nexport const CollapsibleContent = StyledCollapsibleContent\n","\"use client\";\n\nimport createSvgIcon from './utils/createSvgIcon';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2M9 17H7v-7h2zm4 0h-2V7h2zm4 0h-2v-4h2z\"\n}), 'Assessment');","import { axios } from 'lib/axios'\nimport { endpoints } from 'utils/endpoints'\nimport { useQuery } from '@tanstack/react-query'\nimport { ApiKey } from '../components/enums'\n\nexport const getIncidentApplicableCount = async () => {\n return axios.get(endpoints.incidentsApplicableCount)\n}\n\nexport const useGetIncidentApplicableCount = () => {\n return useQuery([ApiKey.Incident_Applicable_Count], getIncidentApplicableCount)\n}\n","//get bitsight pdf report\nimport { useQuery, useQueryClient } from '@tanstack/react-query'\nimport { ApiKey } from 'features/incidents/components/enums'\nimport { axios } from 'lib/axios'\nimport { endpoints } from 'utils/endpoints'\n\nexport const getBitSightReport = async () => {\n return axios.get(endpoints.BitSightReport)\n}\nexport const useGetBitSightReport = (enabled: boolean) => {\n const queryClient = useQueryClient()\n\n return useQuery([ApiKey.BitSightReport], getBitSightReport, {\n enabled, // Query will only run when this is true\n\n // Invalidate another query\n onSuccess: () => {\n queryClient.invalidateQueries([ApiKey.policies, ApiKey.list])\n },\n onError: () => {\n queryClient.invalidateQueries([ApiKey.policies, ApiKey.list])\n },\n })\n}\n","import clsx from 'clsx'\nimport { styled } from 'styles'\nimport { routes } from 'configs/constants'\nimport { Link as RouterLink, useLocation } from 'react-router-dom'\nimport { DownArrowIcon, IncidentIcon, SettingsIcon, EditIcon, KeyIcon, InsuranceIcon, EmailIcon } from 'components/icons'\nimport { Collapsible, CollapsibleContent, CollapsibleTrigger } from 'components/collapsible'\nimport { Box, Flex } from 'components/elements'\nimport { Assessment } from '@mui/icons-material'\nimport { useGetIncidentApplicableCount } from 'features/incidents/api/getIncidentApplicableCount'\nimport { Button } from 'components/button'\nimport { Zendesk_Email } from 'features/incidents/components/enums'\nimport { useGetBitSightReport } from 'features/profile/api/bitSightReport'\nimport { useEffect, useState } from 'react'\nimport { CircularProgress, Tooltip } from '@mui/material'\nimport { getUpperCase } from 'utils/function'\nimport { AxiosError } from 'axios'\nimport { useGetPolicies } from 'features/insurance/api/getPolicies'\nimport { ToolTipcss } from 'features/incidents/components/style'\ntype SidebarItem = {\n name: string\n icon: React.ReactNode\n path?: string\n disabled?: boolean\n children?: SidebarItem[]\n notificationCount?: number\n}\nexport interface ErrorResponse {\n errorMessage: string\n}\nconst sidebarConfig: SidebarItem[] = [\n {\n name: 'Policy',\n icon: ,\n path: routes.insurancePolicy,\n disabled: false,\n },\n {\n name: 'Incidents',\n icon: ,\n path: routes.incidents,\n disabled: false,\n notificationCount: 76,\n },\n {\n name: 'Monitoring Services',\n icon: ,\n path: routes.assessments,\n disabled: false,\n },\n {\n name: 'Settings',\n icon: ,\n children: [\n {\n name: 'Edit Profile',\n icon: ,\n path: routes.editProfile,\n disabled: false,\n },\n {\n name: 'Change Password',\n icon: ,\n path: routes.changePass,\n disabled: false,\n },\n ],\n },\n]\n\nfunction SidebarMenu() {\n const { pathname } = useLocation()\n //set trigger the get bitsight report on click\n const [fetchReport, setFetchReport] = useState(false)\n const [showReportTooltip, setShowReportTooltip] = useState(false) // State to control tooltip visibility\n\n const { data } = useGetIncidentApplicableCount()\n //get bitsight report\n const { data: bitsightReport, isFetching, error: apiError } = useGetBitSightReport(fetchReport)\n //get user current Policy\n const { data: currentPolicy, isLoading: PolicyLoading } = useGetPolicies()\n // report generatedCount Check\n const reportGeneratedCount = currentPolicy?.data?.report_generated\n //is report already generated\n const isReportGenerated = reportGeneratedCount > 0\n const potentialClaim = data?.data?.applicableClaimCount\n //api error\n const bitSightError = (apiError as AxiosError)?.response?.data?.errorMessage || 'Unexpected Error Occured'\n\n //dowbload bitsight pdf report\n useEffect(() => {\n if (bitsightReport?.data?.pdf_url) {\n const link = document.createElement('a')\n link.href = bitsightReport?.data?.pdf_url // Set the URL for the download\n link.download = 'BitSightReport.pdf' // Optional: Set a default file name\n link.target = '_blank' // Open in a new tab if needed\n link.click() // Trigger the download\n setFetchReport(false)\n // Show tooltip when report is downloaded\n setShowReportTooltip(true)\n setTimeout(() => {\n setShowReportTooltip(false) // Hide tooltip after 5 seconds\n }, 5000)\n }\n }, [bitsightReport])\n //api error handling\n useEffect(() => {\n if (apiError) {\n setFetchReport(false)\n }\n }, [apiError])\n const handleFetchReport = () => {\n setFetchReport(true) // Trigger the query\n }\n const getMenuItem = (entry: any, isNested = false) => (\n \n \n {entry.icon}\n {entry.name}\n {!!entry.notificationCount && (\n <>\n {potentialClaim > 0 && (\n \n \n {potentialClaim}\n \n \n )}\n \n )}\n \n \n )\n return (\n \n \n {sidebarConfig.map((entry, idx) => {\n if (!entry.children) {\n return getMenuItem(entry)\n }\n return (\n <>\n \n \n \n \n \n Settings\n \n \n \n\n \n {entry.children.map(subEntry => getMenuItem(subEntry, true))}\n \n \n \n \n )\n })}\n \n \n {!!apiError && (\n \n {getUpperCase(bitSightError)}\n \n )}\n\n \n {showReportTooltip\n ? 'Report downloaded successfully!'\n : 'You have availed the detailed company report feature already. In case you wanted to download the report, please contact your administrator.'}\n \n }\n placement=\"bottom\"\n enterTouchDelay={0}\n disableHoverListener={!isReportGenerated && !showReportTooltip} // Disable hover if report is not generated\n >\n {\n //reportGeneratedcount 0 means report not generated\n if (!isReportGenerated) {\n handleFetchReport()\n }\n }}\n disabled={isFetching || PolicyLoading}\n >\n {isFetching ? : 'Generate Bitsight Report'}\n \n \n \n \n \n \n \n )\n}\n\nconst MenuWrapper = styled('div', {\n 'display': 'flex',\n 'flexDirection': 'column',\n 'flex': 1,\n 'pt': 30,\n 'pb': 20,\n 'justifyContent': 'space-between',\n 'overflowY': 'scroll',\n '&::-webkit-scrollbar': {\n width: '4px',\n },\n\n '&::-webkit-scrollbar-track': {\n background: 'transparent',\n borderRadius: '2px',\n },\n\n '&::-webkit-scrollbar-thumb': {\n background: '$white',\n borderRadius: '2px',\n },\n})\n\nconst NotificationNumber = styled('div', {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n width: '2.5rem',\n height: '2.5rem',\n p: '.5rem',\n background: '$red',\n borderRadius: '50%',\n})\n\nexport const MenuList = styled('ul', {\n 'listStyle': 'none',\n 'padding': 0,\n 'margin': 0,\n\n 'li ul li': {\n borderTop: '1px solid $gray3',\n },\n})\n\nexport const MenuLink = styled(RouterLink, {\n 'display': 'flex',\n 'cursor': 'pointer',\n 'border': 'none',\n 'background': 'none',\n 'width': '100%',\n 'alignItems': 'center',\n 'justifyContent': 'flex-start',\n 'padding': '16px 24px 16px 34px',\n 'height': 60,\n 'gap': 14,\n\n '&[data-state]': {\n '.svg-icon': {\n transition: 'transform .25s linear',\n },\n },\n\n '&.is--setting': {\n '&[data-state=\"open\"]': {\n '.svg-icon': {\n transform: 'rotate(180deg)',\n },\n },\n },\n\n '&.nested': {\n paddingLeft: 54,\n },\n '&.active': {\n background: '$primary',\n borderRadius: '0 6px 6px 0',\n },\n 'svg': {\n fontSize: 28,\n },\n 'span': {\n fontSize: 16,\n fontWeight: 500,\n },\n})\n\nconst SidebarMenuButtonCss = {\n borderRadius: '$base',\n border: 'none',\n width: '190px',\n fontSize: '14px',\n alignSelf: 'center',\n padding: '0.58rem 1.25rem',\n}\nexport default SidebarMenu\n","import { Monitoring_Notification, ServiceConfig } from 'features/quote/components/type'\nimport {\n ClaimStatus,\n CommunicationMediumEnum,\n NotificationMessages,\n ServicesAssessmentsEnum,\n ServicesEnum,\n ThreatMonitoringStartDate,\n TimeZone,\n ComingSoonServicesEnum,\n} from 'utils/enum'\n\nexport const NODE_ENV = process.env.REACT_APP_NODE_ENV\nexport const API_URL = process.env.REACT_APP_API_URL\nexport const POLY_EXPLORER_URL = process.env.REACT_APP_EXPLORER_URL\nexport const PLOYGON_AMOY_RPC_URL = process.env.REACT_APP_PLOYGON_AMOY_RPC_URL\nexport const Contract_Address = process.env.REACT_APP_CONTRACT_ADDRESS\nexport const Chain_Id = Number(process.env.REACT_APP_CHAIN_ID)\nexport const StripPublicKey = String(process.env.REACT_APP_API_STRIPE_PAYEMENT)\nexport const AffiliateID = process.env.REACT_APP_AFFILIATE_ID as string\nexport const routes = {\n // general\n home: '/',\n about: '/about',\n security: '/security',\n support: '/support',\n warranty: '/warranty',\n blog: '/blog',\n blogCatagory: '/blog/:catagory',\n blogDetail: '/blog/:catagory/:detail/:id',\n stripPayment: '/stripe-payment',\n //quote\n qoute: 'get-a-quote', //first time login\n quoteSupportForm: '/get-a-quote-support',\n quoteSentinelOne: '/get-a-quote-sentinel-one',\n\n //affiliate id base user by subadmin carrier\n customLanding: '/box-carrier',\n\n // auth\n login: '/auth/login',\n register: '/auth/register',\n reset: '/auth/reset-password',\n forgot: '/auth/forgot-password',\n sentinel: '/misc/sentinel-one',\n sentinelNew: '/misc/sentinel-one/new',\n accountVerification: '/auth/account-verification',\n // dashboard\n dashboard: '/app/incidents',\n incidents: '/app/incidents',\n insurancePolicy: '/app/insurance',\n editProfile: '/app/profile/edit',\n changePass: '/app/profile/change',\n assessments: '/app/profile/assessments',\n insuranceForm: '/Insurance-form',\n resendVerificationLink: '/auth/resend-verification-link',\n}\nexport const steps = ['Incident Detected', 'Verifiying Incident', 'Initiate Claim', 'Insurance Confirmation', 'User Confirmation ', 'Block Creation', ' Resolved']\nexport const ClaimStatusList = [\n {\n label: ClaimStatus.ALL,\n value: '',\n },\n {\n label: ClaimStatus.APPLICABLE,\n value: ClaimStatus.APPLICABLE,\n },\n {\n label: ClaimStatus.NOT_APPLICABLE,\n value: ClaimStatus.NOT_APPLICABLE,\n },\n {\n label: ClaimStatus.CLAIM_RAISED,\n value: ClaimStatus.CLAIM_RAISED,\n },\n {\n label: ClaimStatus.APPROVED,\n value: ClaimStatus.APPROVED,\n },\n {\n label: ClaimStatus.DISAPPROVED,\n value: ClaimStatus.DISAPPROVED,\n },\n {\n label: ClaimStatus.ACCEPTED,\n value: ClaimStatus.ACCEPTED,\n },\n {\n label: ClaimStatus.REJECTED,\n value: ClaimStatus.REJECTED,\n },\n {\n label: ClaimStatus.RE_EVALUATE,\n value: ClaimStatus.RE_EVALUATE,\n },\n]\nexport const startDates = [\n {\n label: 'As soon as possible',\n value: ThreatMonitoringStartDate.ASAP,\n },\n {\n label: 'Withing a month or two',\n value: ThreatMonitoringStartDate.IN_MONTH,\n },\n {\n label: '2-4 months',\n value: ThreatMonitoringStartDate.TWO_TO_FOUR_MONTHS,\n },\n {\n label: 'More than 4 months in advance',\n value: ThreatMonitoringStartDate.MORE_THAN_4_Months,\n },\n]\nexport const commMediumList = [\n {\n label: CommunicationMediumEnum.PHONENUMBER,\n value: CommunicationMediumEnum.PHONENUMBER,\n },\n {\n label: CommunicationMediumEnum.EMAIL,\n value: CommunicationMediumEnum.EMAIL,\n },\n {\n label: CommunicationMediumEnum.WHATSAPP,\n value: CommunicationMediumEnum.WHATSAPP,\n },\n]\n\nexport const TimeList = [\n {\n label: TimeZone.MORNING,\n value: TimeZone.MORNING_VALUE,\n },\n {\n label: TimeZone.AFTERNOON,\n value: TimeZone.AFTERNOON_VALUE,\n },\n {\n label: TimeZone.EVENING,\n value: TimeZone.EVENING_VALUE,\n },\n]\n\n//TODO:In start client want all the services handling,and now only three of them is integrated\n// right now the all the catageorization and classfication done in FE\n// Next scope all this will be done from BE\n//was handle in generic way,which is now conflict so divvide into 2 group\nexport const serviceLableAssessments: { [key in ServicesEnum | string]: string } = {\n [ServicesEnum.COVE_DATA]: 'Backup',\n [ServicesEnum.EDR]: 'EDR',\n [ServicesEnum.N_SIGHT_PATCH]: 'Patch Management',\n [ServicesEnum.N_SIGHT_AV]: 'Anti-Virus',\n [ServicesEnum.N_CENTERAL]: 'Patch Management',\n}\n\nexport const serviceArrayAssessment = [ServicesEnum.EDR, ServicesEnum.COVE_DATA, ServicesEnum.N_SIGHT_AV, ServicesEnum.N_SIGHT_PATCH, ServicesEnum.N_CENTERAL]\n\nexport const serviceArray = [ServicesEnum.EDR, ServicesEnum.COVE_DATA, ServicesEnum.N_SIGHT_PATCH]\n\nexport const serviceConfig: ServiceConfig = {\n [ServicesEnum.EDR]: {\n label: 'EDR',\n title: 'How to get started with EDR',\n youtubeLink: 'https://www.youtube.com/embed/sTwJ7Cu0w-g',\n },\n [ServicesEnum.COVE_DATA]: {\n label: 'Cove',\n title: 'How to get started with Cove',\n youtubeLink: 'https://www.youtube.com/embed/AtDAOfP8Wn8',\n },\n [ServicesEnum.N_SIGHT_PATCH]: {\n label: 'N Sight Patch Management',\n title: 'How to get started with N-Sight-Patch Management',\n youtubeLink: 'https://www.youtube.com/embed/vWgwv6R7-ZI',\n },\n [ServicesEnum.N_SIGHT_AV]: {\n label: 'N-Sight AV',\n title: 'How to get started with N-Sight AV Management',\n youtubeLink: 'https://www.youtube.com/embed/x4K4UAuP_gc',\n },\n [ServicesEnum.N_CENTERAL]: {\n label: 'N-Central',\n title: 'How to get started with N-Central',\n youtubeLink: 'https://www.youtube.com/embed/x4K4UAuP_gc',\n },\n [ServicesAssessmentsEnum.VEEM]: {\n label: '',\n title: '',\n youtubeLink: '',\n },\n}\n\nexport const Monitoring_Services_Notification: Monitoring_Notification = {\n [ServicesEnum.EDR]: {\n Notification: NotificationMessages.SENTINEL_KEY,\n },\n [ServicesEnum.N_SIGHT_PATCH]: {\n Notification: NotificationMessages.Patch_N_Sight,\n },\n [ServicesEnum.COVE_DATA]: {\n Notification: NotificationMessages.COVE,\n },\n [ServicesEnum.N_SIGHT_AV]: {\n Notification: '',\n },\n [ServicesEnum.N_CENTERAL]: {\n Notification: '',\n },\n}\nexport const IncidentArray = ['EDR', 'Cove Data Backup', 'N Sight AV', 'N Sight Patch']\nexport const comingSoonServices = [\n ComingSoonServicesEnum.Crowd_Strike,\n ComingSoonServicesEnum.Bitdefender_Gravity,\n ComingSoonServicesEnum.Malware_Bytes,\n ComingSoonServicesEnum.Windows_Defender,\n]\nexport const galaxyImageStaticDataArray = [\n {\n Orgc: {\n id: '3',\n name: 'CIRCL',\n uuid: '55f6ea5e-2c60-40e5-964f-47a8950d210f',\n local: false,\n },\n Tag: [\n {\n local: false,\n id: '7',\n name: 'tlp:white',\n colour: '#ffffff',\n numerical_value: null,\n },\n {\n local: false,\n id: '8',\n name: 'osint:source-type=\"blog-post\"',\n colour: '#00223b',\n numerical_value: null,\n },\n {\n local: false,\n id: '148',\n name: 'misp-galaxy:ransomware=\"WannaCry\"',\n colour: '#0088cc',\n numerical_value: null,\n },\n ],\n },\n\n {\n Orgc: {\n id: '31',\n name: 'abuse.ch',\n uuid: '9b086132-8588-49ed-97fd-8578a777822c',\n local: false,\n },\n Tag: [\n {\n id: '1437',\n name: 'exe',\n colour: '#D984D4',\n numerical_value: null,\n is_galaxy: false,\n local: false,\n },\n {\n id: '3573',\n name: 'WannaCry',\n colour: '#130D20',\n numerical_value: null,\n is_galaxy: false,\n local: false,\n },\n {\n id: '5',\n name: 'type:OSINT',\n colour: '#004646',\n numerical_value: null,\n inherited: 1,\n },\n {\n id: '7',\n name: 'tlp:white',\n colour: '#ffffff',\n numerical_value: null,\n inherited: 1,\n },\n ],\n },\n]\n\nexport const SectorList = [\n { label: 'Accounting', value: 'accounting' },\n { label: 'Aerospace/Defense', value: 'aerospace-defense' },\n { label: 'Airlines/Aviation', value: 'airlines-aviation' },\n { label: 'Alternative Dispute Resolution', value: 'alternative-dispute-resolution' },\n { label: 'Alternative Medicine', value: 'alternative-medicine' },\n { label: 'Animation', value: 'animation' },\n { label: 'Apparel & Fashion', value: 'apparel-fashion' },\n { label: 'Architecture & Planning', value: 'architecture-planning' },\n { label: 'Arts and Crafts', value: 'arts-and-crafts' },\n { label: 'Automotive', value: 'automotive' },\n { label: 'Aviation & Aerospace', value: 'aviation-aerospace' },\n { label: 'Banking', value: 'banking' },\n { label: 'Biotechnology', value: 'biotechnology' },\n { label: 'Broadcast Media', value: 'broadcast-media' },\n { label: 'Building Materials', value: 'building-materials' },\n { label: 'Business Services', value: 'business-services' },\n { label: 'Business Supplies and Equipment', value: 'business-supplies-equipment' },\n { label: 'Capital Markets', value: 'capital-markets' },\n { label: 'Chemicals', value: 'chemicals' },\n { label: 'Civic & Social Organization', value: 'civic-social-organization' },\n { label: 'Civil Engineering', value: 'civil-engineering' },\n { label: 'Commercial Real Estate', value: 'commercial-real-estate' },\n { label: 'Computer & Network Security', value: 'computer-network-security' },\n { label: 'Computer Games', value: 'computer-games' },\n { label: 'Computer Hardware', value: 'computer-hardware' },\n { label: 'Computer Networking', value: 'computer-networking' },\n { label: 'Computer Software', value: 'computer-software' },\n { label: 'Construction', value: 'construction' },\n { label: 'Consumer Electronics', value: 'consumer-electronics' },\n { label: 'Consumer Goods', value: 'consumer-goods' },\n { label: 'Consumer Services', value: 'consumer-services' },\n { label: 'Cosmetics', value: 'cosmetics' },\n { label: 'Credit Union', value: 'credit-union' },\n { label: 'Dairy', value: 'dairy' },\n { label: 'Defense & Space', value: 'defense-space' },\n { label: 'Design', value: 'design' },\n { label: 'E-Learning', value: 'e-learning' },\n { label: 'Education', value: 'education' },\n { label: 'Education Management', value: 'education-management' },\n { label: 'Electrical/Electronic Manufacturing', value: 'electrical-electronic-manufacturing' },\n { label: 'Energy/Resources', value: 'energy-resources' },\n { label: 'Engineering', value: 'engineering' },\n { label: 'Entertainment', value: 'entertainment' },\n { label: 'Environmental Services', value: 'environmental-services' },\n { label: 'Events Services', value: 'events-services' },\n { label: 'Executive Office', value: 'executive-office' },\n { label: 'Facilities Services', value: 'facilities-services' },\n { label: 'Farming', value: 'farming' },\n { label: 'Finance', value: 'finance' },\n { label: 'Financial Services', value: 'financial-services' },\n { label: 'Fine Art', value: 'fine-art' },\n { label: 'Fishery', value: 'fishery' },\n { label: 'Food & Beverages', value: 'food-beverages' },\n { label: 'Food Production', value: 'food-production' },\n { label: 'Fund-Raising', value: 'fund-raising' },\n { label: 'Furniture', value: 'furniture' },\n { label: 'Gambling & Casinos', value: 'gambling-casinos' },\n { label: 'Glass, Ceramics & Concrete', value: 'glass-ceramics-concrete' },\n { label: 'Government Administration', value: 'government-administration' },\n { label: 'Government Relations', value: 'government-relations' },\n { label: 'Government/Politics', value: 'government-politics' },\n { label: 'Graphic Design', value: 'graphic-design' },\n { label: 'Health, Wellness and Fitness', value: 'health-wellness-fitness' },\n { label: 'Healthcare/Wellness', value: 'healthcare-wellness' },\n { label: 'Higher Education', value: 'higher-education' },\n { label: 'Hospital & Health Care', value: 'hospital-health-care' },\n { label: 'Hospitality', value: 'hospitality' },\n { label: 'Human Resources', value: 'human-resources' },\n { label: 'Import and Export', value: 'import-export' },\n { label: 'Individual & Family Services', value: 'individual-family-services' },\n { label: 'Industrial Automation', value: 'industrial-automation' },\n { label: 'Information Services', value: 'information-services' },\n { label: 'Information Technology and Services', value: 'information-technology-services' },\n { label: 'Insurance', value: 'insurance' },\n { label: 'International Affairs', value: 'international-affairs' },\n { label: 'International Trade and Development', value: 'international-trade-development' },\n { label: 'Internet', value: 'internet' },\n { label: 'Investment Banking', value: 'investment-banking' },\n { label: 'Investment Management', value: 'investment-management' },\n { label: 'Judiciary', value: 'judiciary' },\n { label: 'Law Enforcement', value: 'law-enforcement' },\n { label: 'Law Practice', value: 'law-practice' },\n { label: 'Legal', value: 'legal' },\n { label: 'Legal Services', value: 'legal-services' },\n { label: 'Legislative Office', value: 'legislative-office' },\n { label: 'Leisure, Travel & Tourism', value: 'leisure-travel-tourism' },\n { label: 'Libraries', value: 'libraries' },\n { label: 'Logistics and Supply Chain', value: 'logistics-supply-chain' },\n { label: 'Luxury Goods & Jewelry', value: 'luxury-goods-jewelry' },\n { label: 'Machinery', value: 'machinery' },\n { label: 'Management Consulting', value: 'management-consulting' },\n { label: 'Manufacturing', value: 'manufacturing' },\n { label: 'Maritime', value: 'maritime' },\n { label: 'Market Research', value: 'market-research' },\n { label: 'Marketing and Advertising', value: 'marketing-advertising' },\n { label: 'Mechanical or Industrial Engineering', value: 'mechanical-industrial-engineering' },\n { label: 'Media Production', value: 'media-production' },\n { label: 'Media/Entertainment', value: 'media-entertainment' },\n { label: 'Medical Devices', value: 'medical-devices' },\n { label: 'Medical Practice', value: 'medical-practice' },\n { label: 'Mental Health Care', value: 'mental-health-care' },\n { label: 'Military', value: 'military' },\n { label: 'Mining & Metals', value: 'mining-metals' },\n { label: 'Motion Pictures and Film', value: 'motion-pictures-film' },\n { label: 'Museums and Institutions', value: 'museums-institutions' },\n { label: 'Music', value: 'music' },\n { label: 'Nanotechnology', value: 'nanotechnology' },\n { label: 'Newspapers', value: 'newspapers' },\n { label: 'Non-Profit Organization Management', value: 'non-profit-organization-management' },\n { label: 'Nonprofit/NGO', value: 'nonprofit-ngo' },\n { label: 'Oil & Energy', value: 'oil-energy' },\n { label: 'Online Media', value: 'online-media' },\n { label: 'Outsourcing/Offshoring', value: 'outsourcing-offshoring' },\n { label: 'Package/Freight Delivery', value: 'package-freight-delivery' },\n { label: 'Packaging and Containers', value: 'packaging-containers' },\n { label: 'Paper & Forest Products', value: 'paper-forest-products' },\n { label: 'Performing Arts', value: 'performing-arts' },\n { label: 'Pharmaceuticals', value: 'pharmaceuticals' },\n { label: 'Philanthropy', value: 'philanthropy' },\n { label: 'Photography', value: 'photography' },\n { label: 'Plastics', value: 'Plastics' },\n { label: 'Political Organization', value: 'Political Organization' },\n { label: 'Primary/Secondary Education', value: 'Primary/Secondary Education' },\n { label: 'Printing', value: 'Printing' },\n { label: 'Professional Training & Coaching', value: 'Professional Training & Coaching' },\n { label: 'Program Development', value: 'Program Development' },\n { label: 'Public Policy', value: 'Public Policy' },\n { label: 'Public Relations and Communications', value: 'Public Relations and Communications' },\n { label: 'Public Safety', value: 'Public Safety' },\n { label: 'Publishing', value: 'Publishing' },\n { label: 'Railroad Manufacture', value: 'Railroad Manufacture' },\n { label: 'Ranching', value: 'Ranching' },\n { label: 'Real Estate', value: 'Real Estate' },\n { label: 'Recreational Facilities and Services', value: 'Recreational Facilities and Services' },\n { label: 'Religious Institutions', value: 'Religious Institutions' },\n { label: 'Renewables & Environment', value: 'Renewables & Environment' },\n { label: 'Research', value: 'Research' },\n { label: 'Restaurants', value: 'Restaurants' },\n { label: 'Retail', value: 'Retail' },\n { label: 'Security and Investigations', value: 'Security and Investigations' },\n { label: 'Semiconductors', value: 'Semiconductors' },\n { label: 'Shipbuilding', value: 'Shipbuilding' },\n { label: 'Sporting Goods', value: 'Sporting Goods' },\n { label: 'Sports', value: 'Sports' },\n { label: 'Staffing and Recruiting', value: 'Staffing and Recruiting' },\n { label: 'Supermarkets', value: 'Supermarkets' },\n { label: 'Technology', value: 'Technology' },\n { label: 'Telecommunications', value: 'Telecommunications' },\n { label: 'Textiles', value: 'Textiles' },\n { label: 'Think Tanks', value: 'Think Tanks' },\n { label: 'Tobacco', value: 'Tobacco' },\n { label: 'Tourism/Hospitality', value: 'Tourism/Hospitality' },\n { label: 'Translation and Localization', value: 'Translation and Localization' },\n { label: 'Transportation', value: 'Transportation' },\n { label: 'Utilities', value: 'Utilities' },\n { label: 'Venture Capital & Private Equity', value: 'Venture Capital & Private Equity' },\n { label: 'Veterinary', value: 'Veterinary' },\n { label: 'Warehousing', value: 'Warehousing' },\n { label: 'Wholesale', value: 'Wholesale' },\n { label: 'Wine and Spirits', value: 'Wine and Spirits' },\n { label: 'Wireless', value: 'Wireless' },\n { label: 'Writing and Editing', value: 'Writing and Editing' },\n]\n","import { axios } from './axios'\nimport storage from 'utils/storage'\nimport { LoginResponse, User } from 'features/auth/types'\n\nexport type SentinelKeyDTO = {\n sentinelOneApiKey?: string\n}\n\nexport type RegisterDTO = {\n firstName: string\n lastName: string\n email: string\n websiteUrl?: string\n companyWebsite?: string\n companyName?: string\n phoneNum: string\n password: string\n confirmPassword: string\n}\n\nexport async function register(data: RegisterDTO) {\n return axios.post('/user/register', data)\n}\n\nexport type LoginCredentialsDTO = {\n email: string\n password: string\n}\n\nexport async function loginWithEmailAndPassword(data: LoginCredentialsDTO): Promise {\n const resp = await axios.post('/user/login', data)\n storage.setToken(resp.data.token)\n return resp.data.user\n}\n\nexport async function logout() {\n storage.clearToken()\n}\n\nexport async function getUserIdentity(): Promise {\n let user = null\n if (storage.getToken()) {\n const resp = await axios.get('/user/profile')\n user = resp.data\n }\n return user\n}\n\ntype ResetPasswordDTO = {\n jwt: string\n password: string\n confirmPassword: string\n}\n\nexport function resetPassword(data: ResetPasswordDTO): Promise {\n return axios.post('/user/reset/password', data)\n}\n\ntype UpdatePasswordDTO = {\n oldPassword: string\n password: string\n confirmPassword: string\n}\n\nexport function updatePassword(data: UpdatePasswordDTO): Promise {\n return axios.post('/user/change/password', data)\n}\n","export enum AUTH_STATUS {\n SUCESS = 'success',\n LOADING = 'loading',\n IDLE = 'idle',\n}\n","import { createContext, useEffect, useMemo, useState } from 'react'\nimport { useQuery, useMutation, useQueryClient, QueryKey, QueryStatus } from '@tanstack/react-query'\nimport { loginWithEmailAndPassword as loginFn, logout as logoutFn, register as registerFn, getUserIdentity } from 'lib/auth'\nimport { User } from 'features/auth/types'\nimport { AxiosError } from 'axios'\nimport { ValidationErrors } from 'utils/enum'\nimport { useNavigate, useLocation } from 'react-router-dom'\nimport { routes } from 'configs/constants'\nimport { AUTH_STATUS } from './enums'\n\ninterface AuthContextValue {\n user: User | null | undefined\n authStatus: QueryStatus\n error: unknown\n refetchUser: () => void\n login: (...arg: any) => void\n isLoggingIn: boolean\n logout: () => void\n isLoggingOut: boolean\n register: (...arg: any) => void\n isRegistering: boolean\n isRegisterError: boolean\n registerError: string\n}\n\nexport const AuthContext = createContext(null)\nAuthContext.displayName = 'AuthContext'\n\nexport interface AuthProviderProps {\n children: React.ReactNode\n authKey?: QueryKey\n waitInitial?: boolean\n}\n\nexport function AuthProvider(props: AuthProviderProps) {\n const { children, authKey = ['auth-user'], waitInitial = true } = props\n const queryClient = useQueryClient()\n\n const [registerApiError, setRegisterApiError] = useState('')\n\n const { data: user, error, status, fetchStatus, refetch } = useQuery(authKey, getUserIdentity)\n\n const loginMutation = useMutation(loginFn, {\n onSuccess: user => {\n queryClient.setQueryData(authKey, user)\n },\n })\n\n const { mutateAsync, isLoading, isError } = useMutation(registerFn, {\n onError: error => {\n if (error instanceof AxiosError) {\n setRegisterApiError(error.response?.data.message)\n } else {\n setRegisterApiError(ValidationErrors.DEFAULT)\n }\n },\n })\n\n const logoutMutation = useMutation(logoutFn, {\n onSuccess: () => {\n queryClient.clear()\n // setUser(null);\n },\n })\n\n const navigate = useNavigate()\n const { pathname } = useLocation()\n\n // redirect to sentinel one key form on first login\n useEffect(() => {\n if (!user) return\n if (user.status && !user.sentinelOneAPiKey && pathname === '/misc/sentinel-one') {\n navigate(routes.sentinel)\n }\n }, [user, navigate, pathname])\n\n const value = useMemo(\n () => ({\n user,\n authStatus: status,\n error,\n refetchUser: refetch,\n login: loginMutation.mutateAsync,\n isLoggingIn: loginMutation.isLoading,\n logout: logoutMutation.mutateAsync,\n isLoggingOut: logoutMutation.isLoading,\n register: mutateAsync,\n isRegistering: isLoading,\n isRegisterError: isError,\n registerError: registerApiError,\n }),\n [\n user,\n status,\n error,\n refetch,\n loginMutation.mutateAsync,\n loginMutation.isLoading,\n logoutMutation.mutateAsync,\n logoutMutation.isLoading,\n mutateAsync,\n isLoading,\n isError,\n registerApiError,\n ]\n )\n\n if (status === AUTH_STATUS.SUCESS || !waitInitial) {\n return {children}\n }\n\n if (status === AUTH_STATUS.LOADING || fetchStatus === AUTH_STATUS.IDLE) {\n return Loading...
\n }\n\n if (error) {\n return Something went wrong
\n }\n\n return Unhandled status: {status}
\n}\n","import { Flex } from 'components/elements'\nimport { Card, CardBorder } from 'components/elements/Card'\nimport React from 'react'\nimport { CSS, styled } from 'styles'\n\ntype FormWrapperProps = {\n children: React.ReactNode\n title?: string\n text?: JSX.Element | string\n style?: React.CSSProperties\n logo?: string\n logoHidden?: boolean\n logoStyle?: React.CSSProperties\n controlWidth?: React.CSSProperties\n css?: CSS\n isCardBackgroundNone?: boolean\n}\n\nfunction FormWrapper(props: FormWrapperProps) {\n const { children, title, logoHidden, text, style, logo = '/images/dlt-alert-logo.png', logoStyle, controlWidth, css, isCardBackgroundNone } = props\n return (\n \n \n \n {logoHidden && logo && }\n {title && {title}}\n {text && {text}}\n {children}\n \n \n \n )\n}\n\nexport const BodyItemMiddle = {\n 'minHeight': 'calc(100vh - 85px)',\n 'alignItems': 'center',\n 'justifyContent': 'center',\n 'maxWidth': 550,\n 'width': '100%',\n\n '& > div': {\n width: '100%',\n },\n}\n\nconst StyledCard = styled(Card, {\n 'padding': '2.5rem 1.5rem',\n 'textAlign': 'center',\n\n '@md': {\n padding: '3.75rem',\n },\n})\n\nexport const Logo = styled('img', {\n display: 'block',\n margin: '0 auto',\n maxWidth: 240,\n marginBottom: 40,\n})\n\nconst Title = styled('h2', {\n textTransform: 'capitalize',\n textAlign: 'center',\n})\n\nconst SubText = styled('p', {\n mb: '$6',\n textAlign: 'center',\n color: '$gray4',\n})\n\nexport default FormWrapper\n","export enum IncidentEnums {\n SENTINEL_VALIDATION = 'Sentinel key is required',\n SENTINEL_SUCCESS_MESSAGE = 'Sentinel key updated successfully',\n SENTINEL_ERROR_MESSAGE = 'Failed to update sentinel key',\n DESCRIPTION_AMOUNT = 'Aggregate Coverage Amount',\n DESCRIPTION_DATE = 'Validation Date',\n INSURANCE_DETAIL = 'insuranceDetail',\n PENDING = 'Pending',\n VALID = 'Valid',\n INVALID = 'Invalid',\n RISK_SCORE = 'Risk Score',\n THREAT_STATUS = 'threatStatus',\n THREAT_ID = 'threatId',\n AGENT_DETECTION_INFO = 'Agent Detection Info',\n GROUP_ID = 'Group Id',\n GROUP_NAME = 'Group Name',\n AGENT_OS_NAME = 'Agent Os Name',\n THREAT_NAME = 'Threat Name',\n THREAT_INFO = 'Threat Info',\n COMPANY_URL = 'companyLogoUrl',\n COMPANY_NAME = 'companyName',\n PLAN_NAME = 'planName',\n ACTIVE = 'active',\n CREATED_AT = 'CreatedAt',\n THREAT_CREATED_AT = 'Created At',\n ACTIVED = 'Active',\n regOnChainStatus = 'regOnChainStatus',\n REG_ON_CHAIN_STATUS = 'Reg On Chain Status',\n MISP_DATA = 'mispData',\n}\nexport enum InsurancePolicyEnum {\n ACTIVED = 'Active',\n CANCELLED = 'Cancelled',\n PAYMENT_OVER_DUE = 'Payment Overdue',\n EXPIRED = 'Expired',\n MESSAGE = 'you have not been assigned any plan yet',\n PENDING = 'Service Activation Pending',\n}\nexport enum FileExtension {\n PDF = '.pdf',\n IMAGE = '.img',\n DOCX = '.docx',\n}\nexport const AlertKeyEnum = {\n STATUS: 'status',\n FA: '2FA',\n EDR: 'EDR',\n BACK_UPS: 'Backups',\n PERSONAL_TRAINING: 'Personal Training',\n PATCH_MANAGEMENT: 'Patch Management',\n PREMIUM: 'Premium',\n}\nexport enum STATUS_MAPPING {\n ACTIVE = 'Active',\n SUCCESS = 'success',\n PENDING = 'Pending',\n WARNING = 'warning',\n INACTIVE = 'Inactive',\n ERROR = 'error',\n COMING_SOON = 'coming soon',\n EXPIRED = 'Expired',\n}\nexport enum ApiKey {\n message = 'message',\n comment = 'comments',\n insurance = 'insurance',\n request = 'request',\n features = 'features',\n list = 'list',\n policies = 'policies',\n incidents = 'incidents',\n incidentsHash = 'incidentshash',\n paymentStripe = 'paymentStripe',\n scoreCard = 'soreCard',\n Quote = 'Quote',\n Wait = 'Wait',\n Blog = 'Blog',\n QuoteReg = 'QuoteRegister',\n Services = 'services',\n planListing = 'planListing',\n cove = 'cove',\n CoveLisiting = 'CoveLisiting',\n PreviousPolicies = 'PreviousPolicies',\n PlanClaims = 'PlanClaims',\n N_SIGHT_PATCH_Listing = 'N Sight Listing',\n Incident_Applicable_Count = 'incident applicable count',\n merchantAffiliateDetails = 'merchant affiliate details',\n details = 'details',\n MISP = 'mip',\n BitSightReport = 'BitSightReport',\n CountryList = 'Country list',\n}\n\nexport enum Comment {\n message = 'message',\n userThreatId = 'userThreatId',\n type = 'type',\n}\nexport enum Comment_Type {\n type = 'External',\n}\nexport enum AlertKeyEnums {\n CONFIDENCE_LEVEL = 'Confidence Level',\n CLASSIFICATION = 'Classification',\n}\n\nexport enum ClaimStatus {\n ALL = 'All',\n APPLICABLE = 'Applicable',\n NOT_APPLICABLE = 'Not Applicable',\n CLAIM_RAISED = 'Claim Raised',\n APPROVED = 'Approved',\n DISAPPROVED = 'Disapproved',\n ACCEPTED = 'Accepted',\n REJECTED = 'Rejected',\n RE_EVALUATE = 'Re-Evaluate',\n PENDING = 'Pending',\n}\n\nexport enum Assessment {\n COMING_SOON = 'Coming Soon',\n ADD = 'Add',\n CONNECT = 'Connect ',\n}\n\nexport enum PlanStatus {\n ALL = 'All',\n ACTIVE = 'Active',\n EXPIRED = 'Expired',\n OVERDUE = 'Payment Overdue',\n}\n\nexport type LossRunReportProps = {\n title: string\n threatName?: string\n classification?: string\n description?: string\n documentUrl?: string[]\n documentName?: string\n amount?: string\n time?: string\n show: boolean\n status?: string\n lossAmount?: string\n}\nexport enum ReactionRespone {\n ERROR = 'jwt is required',\n CUSTOMERROR = 'Please Login First',\n LIKE = 'Like',\n DISLIKE = 'Dislike',\n CLEAR = 'Clear',\n}\n\nexport enum IncidentStatus {\n ALL = 'All',\n INCIDENT_DETECTED = 'Incident Detected',\n INCIDENT_VERIFIED = 'Incident Verified',\n CLAIM_INITIATED = 'Claim Initiated',\n INSURANCE_CONFIRMATION = 'Insurance Confirmation',\n CLAIM_RESOLVED = 'Claim Resolved',\n}\n\nexport enum ThreatStatus {\n CLAIM_INITIATED = 'Claim Initiated',\n INCIDENT_DETECTED = 'Incident Detected',\n INCIDENT_VERIFIYING = 'Incident Verified',\n INSURANCE_CONFIRMATION = 'Insurance Confirmation',\n USER_CONFIRMATION = 'User Confirmed',\n BLOCK_CREATION = 'Block Created',\n CLAIM_RESOLVED = 'Claim Resolved',\n}\n\nexport enum IncidentEnum {\n SENTINEL_VALIDATION = 'Sentinel key is required',\n SENTINEL_SUCCESS_MESSAGE = 'Sentinel key updated successfully',\n SENTINEL_ERROR_MESSAGE = 'Failed to update sentinel key',\n DESCRIPTION_AMOUNT = 'Aggregate Coverage Amount',\n DESCRIPTION_DATE = 'Validation Date',\n INSURANCE_DETAIL = 'Insurance Detail',\n PENDING = 'Pending',\n VALID = 'Valid',\n INVALID = 'Invalid',\n RISK_SCORE = 'Risk Score',\n RE_EVALUATION = 'Re-evaluation',\n CASE_CLOSED = 'CASE CLOSED',\n ACTION_COMPLETED_SUCCESSFULLY = 'ACTION COMPLETED SUCCESSFULLY',\n DOC_LABEL = 'Upload an Document',\n DOC_UPLOAD_LABEL = 'Upload an official file/doc supporting your action',\n USER_DOC_UPLOAD_LABEL = 'User Re-evalution file/doc supporting the claim amount',\n}\n\nexport enum TabNavigation {\n Tab0 = 0,\n Tab1 = 1,\n Tab2 = 2,\n}\nexport enum BlogContentType {\n IMAGE = 'image',\n PACKAGE_IMAGE = 'IMAGE',\n EMBEDDED_LINK = 'EMBEDDED_LINK',\n LINK = 'LINK',\n ORDERLIST = 'ordered-list-item',\n}\nexport enum ReactQueryStatus {\n LOADING = 'loading',\n}\nexport enum ModalEnum {\n ADD_SERVICES = 'Add Services',\n CHANGE_POLICY = 'Change Policy',\n CHANGE_PaymentMethod = 'Change PaymentMethod',\n RECURRING_PAYMENT = 'Recurring Payment',\n}\nexport enum EvaluationStatus {\n EDR = 'EDR',\n COVE = 'Cove',\n NSIGHT = 'NSight',\n}\nexport enum RECURRING_PAYMENTS {\n ENABLE = 'enable',\n DISABLE = 'disable',\n}\nexport enum StripePaymentStatus {\n PAYING = 'Paying',\n PAY = 'Pay',\n CHANGE = 'Change',\n CHANGING = 'Changing',\n}\nexport enum StripeCardType {\n VISA = 'visa',\n MASTER = 'mastercard',\n AMEX = 'amex',\n DISCOVER = 'discover',\n JCB = 'jcb',\n DINERS = 'diners',\n ELO = 'elo',\n}\nexport enum AssessmentStatus {\n ACTIVE = ' is connected so your policy is Active now',\n NON_ACTIVE = ' to activate your Policy',\n}\nexport enum Mitigation_Status {\n NOT_MITIGATED = 'Not Mitigated',\n MITIGATED = 'mitigated',\n}\nexport enum Environment_Status {\n DEVELOPMENT = 'development',\n}\nexport enum Quote_Email {\n EMAIL = 'info@dltalert.com',\n SUBJECT = 'Request For Warranty Info',\n BODY = 'Please send me more information.',\n}\nexport enum OptionsLabel {\n NO_OPTIONS = 'No option available',\n}\nexport enum PrimaryService_ID {\n EDR = 1,\n COVE_DATA = 2,\n N_SIGHT_PATCH = 4,\n}\nexport enum Zendesk_Email {\n EMAIL = 'support@dltalert.com',\n}\nexport enum BoxUserEnum {\n PLAN_ID = 279,\n PLAN_NAME = 'Ransomware policy (EDR)',\n COVERAGE_VALUE = '5000',\n AFFILIATE_ID = 'vOkMHzjcIo0zUDo7',\n}\nexport enum BlogStylingEnum {\n ITALIC = 'ITALIC',\n UNDERLINE = 'UNDERLINE',\n STRIKETHROUGH = 'STRIKETHROUGH',\n CODE = 'CODE',\n SUPERSCRIP = 'SUPERSCRIPT',\n SUBSCRIPT = 'SUBSCRIPT',\n BOLD = 'BOLD',\n}\nexport enum ExtneralLink {\n GET_A_QUOTE_SERVICE = 'https://www.asgardmsp.com/product/sentinalone-edr-license/',\n}\n","import generateUtilityClasses from '@mui/utils/generateUtilityClasses';\nimport generateUtilityClass from '@mui/utils/generateUtilityClass';\nexport function getCardUtilityClass(slot) {\n return generateUtilityClass('MuiCard', slot);\n}\nconst cardClasses = generateUtilityClasses('MuiCard', ['root']);\nexport default cardClasses;","'use client';\n\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"className\", \"raised\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport { chainPropTypes } from '@mui/utils';\nimport { unstable_composeClasses as composeClasses } from '@mui/base/composeClasses';\nimport styled from '../styles/styled';\nimport useThemeProps from '../styles/useThemeProps';\nimport Paper from '../Paper';\nimport { getCardUtilityClass } from './cardClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes\n } = ownerState;\n const slots = {\n root: ['root']\n };\n return composeClasses(slots, getCardUtilityClass, classes);\n};\nconst CardRoot = styled(Paper, {\n name: 'MuiCard',\n slot: 'Root',\n overridesResolver: (props, styles) => styles.root\n})(() => {\n return {\n overflow: 'hidden'\n };\n});\nconst Card = /*#__PURE__*/React.forwardRef(function Card(inProps, ref) {\n const props = useThemeProps({\n props: inProps,\n name: 'MuiCard'\n });\n const {\n className,\n raised = false\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const ownerState = _extends({}, props, {\n raised\n });\n const classes = useUtilityClasses(ownerState);\n return /*#__PURE__*/_jsx(CardRoot, _extends({\n className: clsx(classes.root, className),\n elevation: raised ? 8 : undefined,\n ref: ref,\n ownerState: ownerState\n }, other));\n});\nprocess.env.NODE_ENV !== \"production\" ? Card.propTypes /* remove-proptypes */ = {\n // ┌────────────────────────────── Warning ──────────────────────────────┐\n // │ These PropTypes are generated from the TypeScript type definitions. │\n // │ To update them, edit the d.ts file and run `pnpm proptypes`. │\n // └─────────────────────────────────────────────────────────────────────┘\n /**\n * The content of the component.\n */\n children: PropTypes.node,\n /**\n * Override or extend the styles applied to the component.\n */\n classes: PropTypes.object,\n /**\n * @ignore\n */\n className: PropTypes.string,\n /**\n * If `true`, the card will use raised styling.\n * @default false\n */\n raised: chainPropTypes(PropTypes.bool, props => {\n if (props.raised && props.variant === 'outlined') {\n return new Error('MUI: Combining `raised={true}` with `variant=\"outlined\"` has no effect.');\n }\n return null;\n }),\n /**\n * The system prop that allows defining system overrides as well as additional CSS styles.\n */\n sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object])\n} : void 0;\nexport default Card;","import { Card } from '@mui/material'\nimport { Link } from 'react-router-dom'\nimport { styled } from 'styles'\n\nexport const StyledGradientDot = styled('div', {\n width: '16px',\n height: '16px',\n background: '$cardGradient',\n border: '1px solid $gray4',\n boxShadow: '0px 4px 24px -1px $black33',\n backdropfilter: 'blur(25px)',\n borderRadius: '50%',\n})\n\nexport const StyledGradientLine = styled('div', {\n width: '4px',\n height: 'calc(100% - 36px)',\n background: '$gradientYellow',\n borderRadius: '4px',\n})\n\nexport const MainWrapCSS = {\n 'bgImage': '$offcanvasGradient',\n 'padding': '1rem',\n\n '@xs': {\n padding: '2rem',\n },\n\n '&.no--bg': {\n bgImage: 'none',\n },\n\n '&.controlled--width': {\n 'maxWidth': '100%',\n\n '@md': {\n maxWidth: 'calc(100vw - 390px)',\n },\n },\n}\nexport const MainCard = styled('div', {\n '&::-webkit-scrollbar': {\n width: '6px',\n },\n\n '&::-webkit-scrollbar-track': {\n background: '$white1A',\n borderRadius: '4px',\n },\n\n '&::-webkit-scrollbar-thumb': {\n background: '$white',\n borderRadius: '4px',\n },\n\n '& > .tabs': {\n 'backgroundColor': '$background',\n 'boxShadow': 'unset',\n 'margin': '0 10px',\n\n '& > .MuiTabs-scroller': {\n '& > .MuiTabs-flexContainer': {\n '& > .MuiButtonBase-root': {\n color: '$white',\n borderRadius: '8px',\n backgroundColor: '$primary10',\n },\n '& > .Mui-selected': {\n color: '$white',\n borderRadius: '8px',\n backgroundColor: '$primary',\n },\n },\n },\n },\n\n '& > .paginator': {\n 'color': '$white',\n\n '& > .MuiToolbar-root': {\n '& > .MuiTablePagination-actions': {\n '& > .Mui-disabled': {\n color: '$gray6',\n },\n },\n '& > .MuiInputBase-root': {\n '& > .MuiSvgIcon-root': {\n color: '$gray6',\n },\n },\n },\n },\n})\n\nexport const ComponentCardItemsCSS = {\n 'width': '100%',\n 'pb': '1rem',\n 'maxWidth': 400,\n\n '@bssm': {\n width: 'calc(33.33% - 10px)',\n pb: 0,\n },\n\n '&.two--items': {\n '@bssm': {\n width: 'calc(50% - 15px)',\n pb: 0,\n },\n },\n}\n\nexport const CircleBg = styled('div', {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n backgroundColor: '$green',\n borderRadius: '50%',\n overflow: 'hidden',\n padding: 4,\n width: '1.5rem',\n height: '1.5rem',\n})\n\nexport const StyledLineBoxWrap = styled('div', {\n display: 'flex',\n flexWrap: 'wrap',\n justifyContent: 'center',\n gap: '10px',\n width: '16px',\n paddingTop: '3px',\n})\n\nexport const ComponentCard = styled('div', {\n display: 'flex',\n flexWrap: 'wrap',\n alignItems: 'end',\n justifyContent: 'end',\n gap: 15,\n paddingBottom: '$5',\n})\nexport const OverflowScroll = {\n 'overflowX': 'auto',\n\n '&::-webkit-scrollbar': {\n width: '6px',\n },\n '&::-webkit-scrollbar-track': {\n background: '$white1A',\n borderRadius: '4px',\n },\n '&::-webkit-scrollbar-thumb': {\n background: '$white',\n borderRadius: '4px',\n },\n}\n\nexport const EmptyRecord = styled('th', {\n padding: '1.25rem',\n})\nexport const DetailContainer = styled('div', {\n 'display': 'grid',\n 'columnGap': 20,\n '&.custom--grid': {\n gridTemplateColumns: '1fr 1fr',\n },\n '@sm': {\n gridTemplateColumns: 'repeat(2, minmax(200px, 610px))',\n },\n})\n\nexport const DetailWrapper = styled('div', {\n 'p': '2rem 0 1rem',\n 'borderBottom': '1px solid $gray5',\n 'borderTop': '1px solid $gray5',\n '& ~ div': {\n borderTop: 'none',\n },\n})\n\nexport const Divider = styled('div', {\n height: '1px',\n width: '100%',\n margin: '0 15px',\n backgroundColor: '$gray5',\n})\nexport const InlineCSS = {\n display: 'inline-block',\n margin: 0,\n wordBreak: 'break-all',\n}\n\nexport const InfoColumn = styled('div', {\n 'marginBottom': '$5',\n\n '& .t-key': {\n fontSize: '$md',\n fontWeight: 600,\n color: '$gray5',\n wordBreak: 'break-word',\n margin: '0 0 .75rem',\n },\n '& .t-title': {\n 'fontSize': '$sm',\n 'fontWeight': 500,\n 'color': '$white',\n 'wordBreak': 'break-word',\n 'margin': '0 0 .75rem',\n '&.m-0': {\n margin: '0px',\n },\n },\n '& .t-value': {\n 'fontSize': '$sm',\n 'wordBreak': 'break-all',\n 'margin': 0,\n\n '&.transformation': {\n textTransform: 'capitalize',\n },\n\n '&.claim': {\n fontSize: '22px',\n fontWeight: 'bold',\n color: '$primary',\n m: 0,\n },\n\n '&.colorBox': {\n display: 'inline-block',\n borderRadius: 8,\n padding: '4px 10px 6px',\n },\n\n '&.affiliateReview': {\n 'color': '$black00',\n 'wordBreak': 'break-word',\n 'margin': '0 0 .75rem',\n 'fontSize': '$sm',\n 'fontWeight': 500,\n '&.m-0': {\n margin: '0px',\n },\n },\n },\n})\n\nexport const StyledTable = styled('table', {\n 'borderCollapse': 'separate',\n 'borderSpacing': 0,\n 'border': '1px solid $gray8',\n 'borderRadius': 14,\n 'width': '100%',\n 'overflow': 'hidden',\n '.responsive-mobile': {\n border: '1px solid $gray8',\n justifyContent: 'center',\n },\n})\n\nexport const BoxBorder = styled('div', {\n position: 'relative',\n display: 'flex',\n alignItems: 'center',\n p: '.75rem',\n paddingtop: '.85rem',\n border: '1px solid $primary',\n borderRadius: 8,\n})\nexport const InlineTextCss = {\n display: 'flex',\n columnGap: 10,\n}\nexport const TextOverFlowCSS = {\n m: 0,\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n}\n\nexport const CopiedBgCSS = {\n position: 'absolute',\n left: 0,\n right: 0,\n bottom: 0,\n top: 0,\n m: 0,\n p: '.75rem',\n background: '$white',\n borderRadius: 8,\n color: '$primary',\n textAlign: 'center',\n}\n\nexport const StyledRow = styled('tr', {\n '& > th': {\n borderBottom: '1px solid $gray8',\n },\n 'td': {\n 'borderBottom': '1px solid $gray8',\n\n '&:last-child': {\n 'borderBottom': 'none',\n '@md': {\n borderBottom: '1px solid $gray8',\n },\n },\n },\n '& .td': {\n border: '1px solid $gray12',\n },\n})\nexport const DetailedCard = styled('div', {\n 'maxWidth': '380px',\n 'width': '100%',\n 'p': '1.25rem',\n 'border': '2px solid $white',\n 'borderRadius': '8px',\n 'fontFamily': 'Inter',\n 'fontStyle': 'normal',\n 'lineHeight': '34px',\n 'color': '$white',\n 'mb': '20px',\n\n '& > .wrap > .description ': {\n fontWeight: '500',\n fontsize: '14px',\n lineHeight: '150%',\n color: '$gray5',\n textAlign: 'justify',\n m: 0,\n },\n '& > .wrap > .title': {\n fontWeight: '600',\n fontsize: '16px',\n lineHeight: '150%',\n m: 0,\n },\n '& > .heading': {\n fontWeight: '700',\n fontSize: '20px',\n mb: '15px',\n },\n '& > .main-wrap': {\n 'display': 'flex',\n 'width': '100%',\n '& > .img-wrap': {\n display: 'flex',\n alignSelf: 'center',\n marginRight: '10px',\n },\n '& > .sub-wrap > .title': {\n fontWeight: '500',\n fontsize: '14px',\n lineHeight: '150%',\n color: '$gray5',\n m: 0,\n },\n '& > .sub-wrap > .description': {\n fontWeight: '600',\n fontsize: '16px',\n lineHeight: '150%',\n m: 0,\n },\n },\n})\nexport const StyledStatusBox = styled('div', {\n display: 'inline-block',\n p: '2px 10px 6px',\n borderRadius: 8,\n textAlign: 'center',\n})\n\nexport const SummaryCard = styled('div', {\n 'width': '100%',\n\n '@md': {\n width: 'calc(100% - 360px)',\n },\n '@bssm': {\n width: 'calc(100% - 280px)',\n },\n})\n\nexport const SideCard = styled('div', {\n 'width': '100%',\n 'color': '$white',\n\n '@md': {\n maxWidth: 360,\n pl: '2rem',\n ml: '2rem',\n borderLeft: '1px solid $gray8',\n },\n '@bssm': {\n maxWidth: 280,\n pl: '1.5rem',\n pr: '1.5rem',\n ml: '1.5rem',\n borderLeft: '1px solid $gray8',\n },\n '& .title': {\n fontWeight: '600',\n fontSize: '20px',\n },\n '& .heading': {\n fontWeight: '500',\n fontSize: '16px',\n mb: '15px',\n },\n '& .subheading': {\n fontWeight: '500',\n fontSize: '14px',\n mb: '15px',\n },\n})\n\nexport const StyledTCard = styled(Card, {\n 'minWidth': 320,\n 'p': '.75rem 1rem',\n 'borderRadius': '8px',\n\n '& > .main-wrap': {\n 'display': 'flex',\n 'width': '100%',\n '& > .img-wrap': {\n display: 'flex',\n alignSelf: 'center',\n marginRight: '10px',\n },\n '& > .sub-wrap > .title': {\n fontWeight: '500',\n fontsize: '14px',\n lineHeight: '150%',\n color: '$gray5',\n m: 0,\n },\n '& > .sub-wrap > .description': {\n fontWeight: '600',\n fontsize: '16px',\n lineHeight: '150%',\n m: 0,\n },\n },\n})\n\nexport const uploadCss = {\n width: 'auto',\n padding: '0 2px 0 0',\n margin: '0',\n}\n\nexport const ProgressCard = styled('div', {\n display: 'flex',\n justifyContent: 'space-between',\n width: '100%',\n borderBottom: '1px solid $gray8',\n})\n\nexport const ShowLessTextCss = {\n fontSize: 16,\n fontWeight: '$semibold',\n lineHeight: '34px',\n flexGrow: 1,\n mb: 0,\n}\n\nexport const ToggleButtonCss = {\n padding: '.3rem',\n background: '$primary10',\n borderRadius: 8,\n marginTop: '1.25rem',\n justifyContent: 'center',\n gap: '1rem',\n}\nexport const browseButtonCss = {\n textAlign: 'center',\n backgroundColor: '$primary',\n width: '100%',\n borderRadius: '8px',\n border: 'none',\n padding: '.75rem 1.5rem',\n cursor: 'pointer',\n}\n\nexport const ButtonCellCSS = {\n padding: '1.25rem',\n}\n\nexport const ExpendedCSS = {\n border: 'none !important',\n marginBottom: '0 !important',\n}\nexport const flexCss = {\n 'display': 'flex',\n 'flexDirection': 'column-reverse',\n 'gap': '1rem',\n 'width': '100%',\n\n '@sm': {\n justifyContent: 'space-between',\n flexDirection: 'row',\n },\n}\nexport const imgCss = {\n borderRadius: '8px',\n marginBottom: '1.5rem',\n cursor: 'zoom-in',\n}\nexport const claimbgCss = {\n background: '$gradientGray',\n borderRadius: '4px',\n padding: '.5rem 1rem',\n maxWidth: 220,\n}\n\nexport const CardCss = {\n maxWidth: '380px',\n width: '100%',\n mb: 30,\n}\n\nexport const InsurancePolicyCss = {\n borderCollapse: 'separate',\n borderSpacing: 0,\n border: '1px solid $gray8',\n borderRadius: 14,\n width: '100%',\n overflow: 'hidden',\n}\n\nexport const TooltipTextCss = {\n fontWeight: 'bold',\n color: '$black',\n textAlign: 'left',\n backgroundColor: '$beigeBackGround',\n maxWidth: 'fit-content',\n fontSize: '14px',\n}\n\nexport const ToolTipcss = {\n '& .MuiTooltip-tooltip': {\n backgroundColor: 'var(--colors-white) !important',\n },\n}\nexport const LinkUrl = styled(Link, {\n color: '$primary',\n cursor: 'pointer',\n textDecoration: 'underline',\n})\n\nexport const StripeLabel = styled('label', {\n display: 'block',\n color: '$gray4',\n fontSize: '$base',\n})\nexport const CircularSpinnerCss = {\n '& .MuiCircularProgress-svg': {\n color: 'var(--colors-primary) !important',\n },\n}\n","import { axios } from 'lib/axios'\nimport { endpoints } from 'utils/endpoints'\nimport { useQuery } from '@tanstack/react-query'\nimport { ApiKey } from 'features/incidents/components/enums'\n\nexport const getPolicies = async () => {\n return axios.get(endpoints.getPolicies)\n}\n\nexport const useGetPolicies = () => {\n return useQuery([ApiKey.policies, ApiKey.list], () => getPolicies())\n}\n","import { axios } from 'lib/axios'\nimport { endpoints } from 'utils/endpoints'\nimport { useMutation, useQueryClient } from '@tanstack/react-query'\nimport { ApiKey } from 'features/incidents/components/enums'\n\nexport const editProfile = async (data: object) => {\n return axios.put(endpoints.userProfile, data)\n}\n\nexport const useEditProfile = () => {\n const client = useQueryClient()\n return useMutation(editProfile, {\n onSuccess: () => {\n client.invalidateQueries({ queryKey: ['auth-user'] })\n client.invalidateQueries([ApiKey.policies, ApiKey.list])\n },\n })\n}\n","import g, { PureComponent as E, createRef as _ } from \"react\";\nconst M = {\n x: 0,\n y: 0,\n width: 0,\n height: 0,\n unit: \"px\"\n}, f = (s, t, e) => Math.min(Math.max(s, t), e), S = (...s) => s.filter((t) => t && typeof t == \"string\").join(\" \"), P = (s, t) => s === t || s.width === t.width && s.height === t.height && s.x === t.x && s.y === t.y && s.unit === t.unit;\nfunction H(s, t, e, o) {\n const i = y(s, e, o);\n return s.width && (i.height = i.width / t), s.height && (i.width = i.height * t), i.y + i.height > o && (i.height = o - i.y, i.width = i.height * t), i.x + i.width > e && (i.width = e - i.x, i.height = i.width / t), s.unit === \"%\" ? D(i, e, o) : i;\n}\nfunction N(s, t, e) {\n const o = y(s, t, e);\n return o.x = (t - o.width) / 2, o.y = (e - o.height) / 2, s.unit === \"%\" ? D(o, t, e) : o;\n}\nfunction D(s, t, e) {\n return s.unit === \"%\" ? { ...M, ...s, unit: \"%\" } : {\n unit: \"%\",\n x: s.x ? s.x / t * 100 : 0,\n y: s.y ? s.y / e * 100 : 0,\n width: s.width ? s.width / t * 100 : 0,\n height: s.height ? s.height / e * 100 : 0\n };\n}\nfunction y(s, t, e) {\n return s.unit ? s.unit === \"px\" ? { ...M, ...s, unit: \"px\" } : {\n unit: \"px\",\n x: s.x ? s.x * t / 100 : 0,\n y: s.y ? s.y * e / 100 : 0,\n width: s.width ? s.width * t / 100 : 0,\n height: s.height ? s.height * e / 100 : 0\n } : { ...M, ...s, unit: \"px\" };\n}\nfunction X(s, t, e, o, i, n = 0, a = 0, w = o, h = i) {\n const r = { ...s };\n let c = Math.min(n, o), d = Math.min(a, i), p = Math.min(w, o), l = Math.min(h, i);\n t && (t > 1 ? (c = a ? a * t : c, d = c / t, p = w * t) : (d = n ? n / t : d, c = d * t, l = h / t)), r.y < 0 && (r.height = Math.max(r.height + r.y, d), r.y = 0), r.x < 0 && (r.width = Math.max(r.width + r.x, c), r.x = 0);\n const u = o - (r.x + r.width);\n u < 0 && (r.x = Math.min(r.x, o - c), r.width += u);\n const C = i - (r.y + r.height);\n if (C < 0 && (r.y = Math.min(r.y, i - d), r.height += C), r.width < c && ((e === \"sw\" || e == \"nw\") && (r.x -= c - r.width), r.width = c), r.height < d && ((e === \"nw\" || e == \"ne\") && (r.y -= d - r.height), r.height = d), r.width > p && ((e === \"sw\" || e == \"nw\") && (r.x -= p - r.width), r.width = p), r.height > l && ((e === \"nw\" || e == \"ne\") && (r.y -= l - r.height), r.height = l), t) {\n const R = r.width / r.height;\n if (R < t) {\n const x = Math.max(r.width / t, d);\n (e === \"nw\" || e == \"ne\") && (r.y -= x - r.height), r.height = x;\n } else if (R > t) {\n const x = Math.max(r.height * t, c);\n (e === \"sw\" || e == \"nw\") && (r.x -= x - r.width), r.width = x;\n }\n }\n return r;\n}\nfunction K(s, t, e, o) {\n const i = { ...s };\n return t === \"ArrowLeft\" ? o === \"nw\" ? (i.x -= e, i.y -= e, i.width += e, i.height += e) : o === \"w\" ? (i.x -= e, i.width += e) : o === \"sw\" ? (i.x -= e, i.width += e, i.height += e) : o === \"ne\" ? (i.y += e, i.width -= e, i.height -= e) : o === \"e\" ? i.width -= e : o === \"se\" && (i.width -= e, i.height -= e) : t === \"ArrowRight\" && (o === \"nw\" ? (i.x += e, i.y += e, i.width -= e, i.height -= e) : o === \"w\" ? (i.x += e, i.width -= e) : o === \"sw\" ? (i.x += e, i.width -= e, i.height -= e) : o === \"ne\" ? (i.y -= e, i.width += e, i.height += e) : o === \"e\" ? i.width += e : o === \"se\" && (i.width += e, i.height += e)), t === \"ArrowUp\" ? o === \"nw\" ? (i.x -= e, i.y -= e, i.width += e, i.height += e) : o === \"n\" ? (i.y -= e, i.height += e) : o === \"ne\" ? (i.y -= e, i.width += e, i.height += e) : o === \"sw\" ? (i.x += e, i.width -= e, i.height -= e) : o === \"s\" ? i.height -= e : o === \"se\" && (i.width -= e, i.height -= e) : t === \"ArrowDown\" && (o === \"nw\" ? (i.x += e, i.y += e, i.width -= e, i.height -= e) : o === \"n\" ? (i.y += e, i.height -= e) : o === \"ne\" ? (i.y += e, i.width -= e, i.height -= e) : o === \"sw\" ? (i.x -= e, i.width += e, i.height += e) : o === \"s\" ? i.height += e : o === \"se\" && (i.width += e, i.height += e)), i;\n}\nconst b = { capture: !0, passive: !1 }, v = class m extends E {\n constructor() {\n super(...arguments), this.docMoveBound = !1, this.mouseDownOnCrop = !1, this.dragStarted = !1, this.evData = {\n startClientX: 0,\n startClientY: 0,\n startCropX: 0,\n startCropY: 0,\n clientX: 0,\n clientY: 0,\n isResize: !0\n }, this.componentRef = _(), this.mediaRef = _(), this.initChangeCalled = !1, this.state = {\n cropIsActive: !1,\n newCropIsBeingDrawn: !1\n }, this.onCropPointerDown = (t) => {\n const { crop: e, disabled: o } = this.props, i = this.getBox();\n if (!e)\n return;\n const n = y(e, i.width, i.height);\n if (o)\n return;\n t.cancelable && t.preventDefault(), this.bindDocMove(), this.componentRef.current.focus({ preventScroll: !0 });\n const a = t.target.dataset.ord, w = !!a;\n let h = t.clientX, r = t.clientY, c = n.x, d = n.y;\n if (a) {\n const p = t.clientX - i.x, l = t.clientY - i.y;\n let u = 0, C = 0;\n a === \"ne\" || a == \"e\" ? (u = p - (n.x + n.width), C = l - n.y, c = n.x, d = n.y + n.height) : a === \"se\" || a === \"s\" ? (u = p - (n.x + n.width), C = l - (n.y + n.height), c = n.x, d = n.y) : a === \"sw\" || a == \"w\" ? (u = p - n.x, C = l - (n.y + n.height), c = n.x + n.width, d = n.y) : (a === \"nw\" || a == \"n\") && (u = p - n.x, C = l - n.y, c = n.x + n.width, d = n.y + n.height), h = c + i.x + u, r = d + i.y + C;\n }\n this.evData = {\n startClientX: h,\n startClientY: r,\n startCropX: c,\n startCropY: d,\n clientX: t.clientX,\n clientY: t.clientY,\n isResize: w,\n ord: a\n }, this.mouseDownOnCrop = !0, this.setState({ cropIsActive: !0 });\n }, this.onComponentPointerDown = (t) => {\n const { crop: e, disabled: o, locked: i, keepSelection: n, onChange: a } = this.props, w = this.getBox();\n if (o || i || n && e)\n return;\n t.cancelable && t.preventDefault(), this.bindDocMove(), this.componentRef.current.focus({ preventScroll: !0 });\n const h = t.clientX - w.x, r = t.clientY - w.y, c = {\n unit: \"px\",\n x: h,\n y: r,\n width: 0,\n height: 0\n };\n this.evData = {\n startClientX: t.clientX,\n startClientY: t.clientY,\n startCropX: h,\n startCropY: r,\n clientX: t.clientX,\n clientY: t.clientY,\n isResize: !0\n }, this.mouseDownOnCrop = !0, a(y(c, w.width, w.height), D(c, w.width, w.height)), this.setState({ cropIsActive: !0, newCropIsBeingDrawn: !0 });\n }, this.onDocPointerMove = (t) => {\n const { crop: e, disabled: o, onChange: i, onDragStart: n } = this.props, a = this.getBox();\n if (o || !e || !this.mouseDownOnCrop)\n return;\n t.cancelable && t.preventDefault(), this.dragStarted || (this.dragStarted = !0, n && n(t));\n const { evData: w } = this;\n w.clientX = t.clientX, w.clientY = t.clientY;\n let h;\n w.isResize ? h = this.resizeCrop() : h = this.dragCrop(), P(e, h) || i(\n y(h, a.width, a.height),\n D(h, a.width, a.height)\n );\n }, this.onComponentKeyDown = (t) => {\n const { crop: e, disabled: o, onChange: i, onComplete: n } = this.props;\n if (o)\n return;\n const a = t.key;\n let w = !1;\n if (!e)\n return;\n const h = this.getBox(), r = this.makePixelCrop(h), d = (navigator.platform.match(\"Mac\") ? t.metaKey : t.ctrlKey) ? m.nudgeStepLarge : t.shiftKey ? m.nudgeStepMedium : m.nudgeStep;\n if (a === \"ArrowLeft\" ? (r.x -= d, w = !0) : a === \"ArrowRight\" ? (r.x += d, w = !0) : a === \"ArrowUp\" ? (r.y -= d, w = !0) : a === \"ArrowDown\" && (r.y += d, w = !0), w) {\n t.cancelable && t.preventDefault(), r.x = f(r.x, 0, h.width - r.width), r.y = f(r.y, 0, h.height - r.height);\n const p = y(r, h.width, h.height), l = D(r, h.width, h.height);\n i(p, l), n && n(p, l);\n }\n }, this.onHandlerKeyDown = (t, e) => {\n const {\n aspect: o = 0,\n crop: i,\n disabled: n,\n minWidth: a = 0,\n minHeight: w = 0,\n maxWidth: h,\n maxHeight: r,\n onChange: c,\n onComplete: d\n } = this.props, p = this.getBox();\n if (n || !i)\n return;\n if (t.key === \"ArrowUp\" || t.key === \"ArrowDown\" || t.key === \"ArrowLeft\" || t.key === \"ArrowRight\")\n t.stopPropagation(), t.preventDefault();\n else\n return;\n const u = (navigator.platform.match(\"Mac\") ? t.metaKey : t.ctrlKey) ? m.nudgeStepLarge : t.shiftKey ? m.nudgeStepMedium : m.nudgeStep, C = y(i, p.width, p.height), R = K(C, t.key, u, e), x = X(\n R,\n o,\n e,\n p.width,\n p.height,\n a,\n w,\n h,\n r\n );\n if (!P(i, x)) {\n const Y = D(x, p.width, p.height);\n c(x, Y), d && d(x, Y);\n }\n }, this.onDocPointerDone = (t) => {\n const { crop: e, disabled: o, onComplete: i, onDragEnd: n } = this.props, a = this.getBox();\n this.unbindDocMove(), !(o || !e) && this.mouseDownOnCrop && (this.mouseDownOnCrop = !1, this.dragStarted = !1, n && n(t), i && i(y(e, a.width, a.height), D(e, a.width, a.height)), this.setState({ cropIsActive: !1, newCropIsBeingDrawn: !1 }));\n }, this.onDragFocus = (t) => {\n var e;\n (e = this.componentRef.current) == null || e.scrollTo(0, 0);\n };\n }\n get document() {\n return document;\n }\n // We unfortunately get the bounding box every time as x+y changes\n // due to scrolling.\n getBox() {\n const t = this.mediaRef.current;\n if (!t)\n return { x: 0, y: 0, width: 0, height: 0 };\n const { x: e, y: o, width: i, height: n } = t.getBoundingClientRect();\n return { x: e, y: o, width: i, height: n };\n }\n componentDidUpdate(t) {\n const { crop: e, onComplete: o } = this.props;\n if (o && !t.crop && e) {\n const { width: i, height: n } = this.getBox();\n i && n && o(y(e, i, n), D(e, i, n));\n }\n }\n componentWillUnmount() {\n this.resizeObserver && this.resizeObserver.disconnect();\n }\n bindDocMove() {\n this.docMoveBound || (this.document.addEventListener(\"pointermove\", this.onDocPointerMove, b), this.document.addEventListener(\"pointerup\", this.onDocPointerDone, b), this.document.addEventListener(\"pointercancel\", this.onDocPointerDone, b), this.docMoveBound = !0);\n }\n unbindDocMove() {\n this.docMoveBound && (this.document.removeEventListener(\"pointermove\", this.onDocPointerMove, b), this.document.removeEventListener(\"pointerup\", this.onDocPointerDone, b), this.document.removeEventListener(\"pointercancel\", this.onDocPointerDone, b), this.docMoveBound = !1);\n }\n getCropStyle() {\n const { crop: t } = this.props;\n if (t)\n return {\n top: `${t.y}${t.unit}`,\n left: `${t.x}${t.unit}`,\n width: `${t.width}${t.unit}`,\n height: `${t.height}${t.unit}`\n };\n }\n dragCrop() {\n const { evData: t } = this, e = this.getBox(), o = this.makePixelCrop(e), i = t.clientX - t.startClientX, n = t.clientY - t.startClientY;\n return o.x = f(t.startCropX + i, 0, e.width - o.width), o.y = f(t.startCropY + n, 0, e.height - o.height), o;\n }\n getPointRegion(t, e, o, i) {\n const { evData: n } = this, a = n.clientX - t.x, w = n.clientY - t.y;\n let h;\n i && e ? h = e === \"nw\" || e === \"n\" || e === \"ne\" : h = w < n.startCropY;\n let r;\n return o && e ? r = e === \"nw\" || e === \"w\" || e === \"sw\" : r = a < n.startCropX, r ? h ? \"nw\" : \"sw\" : h ? \"ne\" : \"se\";\n }\n resolveMinDimensions(t, e, o = 0, i = 0) {\n let n = Math.min(o, t.width), a = Math.min(i, t.height);\n return !e || !n && !a ? [n, a] : e > 1 ? n ? [n, n / e] : [a * e, a] : a ? [a * e, a] : [n, n / e];\n }\n resizeCrop() {\n const { evData: t } = this, { aspect: e = 0, maxWidth: o, maxHeight: i } = this.props, n = this.getBox(), [a, w] = this.resolveMinDimensions(n, e, this.props.minWidth, this.props.minHeight);\n let h = this.makePixelCrop(n), r = this.getPointRegion(n, t.ord, a, w);\n const c = t.ord || r;\n let d = t.clientX - t.startClientX, p = t.clientY - t.startClientY;\n (a && c === \"nw\" || c === \"w\" || c === \"sw\") && (d = Math.min(d, -a)), (w && c === \"nw\" || c === \"n\" || c === \"ne\") && (p = Math.min(p, -w));\n const l = {\n unit: \"px\",\n x: 0,\n y: 0,\n width: 0,\n height: 0\n };\n r === \"ne\" ? (l.x = t.startCropX, l.width = d, e ? (l.height = l.width / e, l.y = t.startCropY - l.height) : (l.height = Math.abs(p), l.y = t.startCropY - l.height)) : r === \"se\" ? (l.x = t.startCropX, l.y = t.startCropY, l.width = d, e ? l.height = l.width / e : l.height = p) : r === \"sw\" ? (l.x = t.startCropX + d, l.y = t.startCropY, l.width = Math.abs(d), e ? l.height = l.width / e : l.height = p) : r === \"nw\" && (l.x = t.startCropX + d, l.width = Math.abs(d), e ? (l.height = l.width / e, l.y = t.startCropY - l.height) : (l.height = Math.abs(p), l.y = t.startCropY + p));\n const u = X(\n l,\n e,\n r,\n n.width,\n n.height,\n a,\n w,\n o,\n i\n );\n return e || m.xyOrds.indexOf(c) > -1 ? h = u : m.xOrds.indexOf(c) > -1 ? (h.x = u.x, h.width = u.width) : m.yOrds.indexOf(c) > -1 && (h.y = u.y, h.height = u.height), h.x = f(h.x, 0, n.width - h.width), h.y = f(h.y, 0, n.height - h.height), h;\n }\n createCropSelection() {\n const {\n ariaLabels: t = m.defaultProps.ariaLabels,\n disabled: e,\n locked: o,\n renderSelectionAddon: i,\n ruleOfThirds: n,\n crop: a\n } = this.props, w = this.getCropStyle();\n if (a)\n return /* @__PURE__ */ g.createElement(\n \"div\",\n {\n style: w,\n className: \"ReactCrop__crop-selection\",\n onPointerDown: this.onCropPointerDown,\n \"aria-label\": t.cropArea,\n tabIndex: 0,\n onKeyDown: this.onComponentKeyDown,\n role: \"group\"\n },\n !e && !o && /* @__PURE__ */ g.createElement(\"div\", { className: \"ReactCrop__drag-elements\", onFocus: this.onDragFocus }, /* @__PURE__ */ g.createElement(\"div\", { className: \"ReactCrop__drag-bar ord-n\", \"data-ord\": \"n\" }), /* @__PURE__ */ g.createElement(\"div\", { className: \"ReactCrop__drag-bar ord-e\", \"data-ord\": \"e\" }), /* @__PURE__ */ g.createElement(\"div\", { className: \"ReactCrop__drag-bar ord-s\", \"data-ord\": \"s\" }), /* @__PURE__ */ g.createElement(\"div\", { className: \"ReactCrop__drag-bar ord-w\", \"data-ord\": \"w\" }), /* @__PURE__ */ g.createElement(\n \"div\",\n {\n className: \"ReactCrop__drag-handle ord-nw\",\n \"data-ord\": \"nw\",\n tabIndex: 0,\n \"aria-label\": t.nwDragHandle,\n onKeyDown: (h) => this.onHandlerKeyDown(h, \"nw\"),\n role: \"button\"\n }\n ), /* @__PURE__ */ g.createElement(\n \"div\",\n {\n className: \"ReactCrop__drag-handle ord-n\",\n \"data-ord\": \"n\",\n tabIndex: 0,\n \"aria-label\": t.nDragHandle,\n onKeyDown: (h) => this.onHandlerKeyDown(h, \"n\"),\n role: \"button\"\n }\n ), /* @__PURE__ */ g.createElement(\n \"div\",\n {\n className: \"ReactCrop__drag-handle ord-ne\",\n \"data-ord\": \"ne\",\n tabIndex: 0,\n \"aria-label\": t.neDragHandle,\n onKeyDown: (h) => this.onHandlerKeyDown(h, \"ne\"),\n role: \"button\"\n }\n ), /* @__PURE__ */ g.createElement(\n \"div\",\n {\n className: \"ReactCrop__drag-handle ord-e\",\n \"data-ord\": \"e\",\n tabIndex: 0,\n \"aria-label\": t.eDragHandle,\n onKeyDown: (h) => this.onHandlerKeyDown(h, \"e\"),\n role: \"button\"\n }\n ), /* @__PURE__ */ g.createElement(\n \"div\",\n {\n className: \"ReactCrop__drag-handle ord-se\",\n \"data-ord\": \"se\",\n tabIndex: 0,\n \"aria-label\": t.seDragHandle,\n onKeyDown: (h) => this.onHandlerKeyDown(h, \"se\"),\n role: \"button\"\n }\n ), /* @__PURE__ */ g.createElement(\n \"div\",\n {\n className: \"ReactCrop__drag-handle ord-s\",\n \"data-ord\": \"s\",\n tabIndex: 0,\n \"aria-label\": t.sDragHandle,\n onKeyDown: (h) => this.onHandlerKeyDown(h, \"s\"),\n role: \"button\"\n }\n ), /* @__PURE__ */ g.createElement(\n \"div\",\n {\n className: \"ReactCrop__drag-handle ord-sw\",\n \"data-ord\": \"sw\",\n tabIndex: 0,\n \"aria-label\": t.swDragHandle,\n onKeyDown: (h) => this.onHandlerKeyDown(h, \"sw\"),\n role: \"button\"\n }\n ), /* @__PURE__ */ g.createElement(\n \"div\",\n {\n className: \"ReactCrop__drag-handle ord-w\",\n \"data-ord\": \"w\",\n tabIndex: 0,\n \"aria-label\": t.wDragHandle,\n onKeyDown: (h) => this.onHandlerKeyDown(h, \"w\"),\n role: \"button\"\n }\n )),\n i && /* @__PURE__ */ g.createElement(\"div\", { className: \"ReactCrop__selection-addon\", onMouseDown: (h) => h.stopPropagation() }, i(this.state)),\n n && /* @__PURE__ */ g.createElement(g.Fragment, null, /* @__PURE__ */ g.createElement(\"div\", { className: \"ReactCrop__rule-of-thirds-hz\" }), /* @__PURE__ */ g.createElement(\"div\", { className: \"ReactCrop__rule-of-thirds-vt\" }))\n );\n }\n makePixelCrop(t) {\n const e = { ...M, ...this.props.crop || {} };\n return y(e, t.width, t.height);\n }\n render() {\n const { aspect: t, children: e, circularCrop: o, className: i, crop: n, disabled: a, locked: w, style: h, ruleOfThirds: r } = this.props, { cropIsActive: c, newCropIsBeingDrawn: d } = this.state, p = n ? this.createCropSelection() : null, l = S(\n \"ReactCrop\",\n i,\n c && \"ReactCrop--active\",\n a && \"ReactCrop--disabled\",\n w && \"ReactCrop--locked\",\n d && \"ReactCrop--new-crop\",\n n && t && \"ReactCrop--fixed-aspect\",\n n && o && \"ReactCrop--circular-crop\",\n n && r && \"ReactCrop--rule-of-thirds\",\n !this.dragStarted && n && !n.width && !n.height && \"ReactCrop--invisible-crop\",\n o && \"ReactCrop--no-animate\"\n );\n return /* @__PURE__ */ g.createElement(\"div\", { ref: this.componentRef, className: l, style: h }, /* @__PURE__ */ g.createElement(\"div\", { ref: this.mediaRef, className: \"ReactCrop__child-wrapper\", onPointerDown: this.onComponentPointerDown }, e), p);\n }\n};\nv.xOrds = [\"e\", \"w\"];\nv.yOrds = [\"n\", \"s\"];\nv.xyOrds = [\"nw\", \"ne\", \"se\", \"sw\"];\nv.nudgeStep = 1;\nv.nudgeStepMedium = 10;\nv.nudgeStepLarge = 100;\nv.defaultProps = {\n ariaLabels: {\n cropArea: \"Use the arrow keys to move the crop selection area\",\n nwDragHandle: \"Use the arrow keys to move the north west drag handle to change the crop selection area\",\n nDragHandle: \"Use the up and down arrow keys to move the north drag handle to change the crop selection area\",\n neDragHandle: \"Use the arrow keys to move the north east drag handle to change the crop selection area\",\n eDragHandle: \"Use the up and down arrow keys to move the east drag handle to change the crop selection area\",\n seDragHandle: \"Use the arrow keys to move the south east drag handle to change the crop selection area\",\n sDragHandle: \"Use the up and down arrow keys to move the south drag handle to change the crop selection area\",\n swDragHandle: \"Use the arrow keys to move the south west drag handle to change the crop selection area\",\n wDragHandle: \"Use the up and down arrow keys to move the west drag handle to change the crop selection area\"\n }\n};\nlet I = v;\nexport {\n I as Component,\n I as ReactCrop,\n P as areCropsEqual,\n N as centerCrop,\n f as clamp,\n S as cls,\n X as containCrop,\n D as convertToPercentCrop,\n y as convertToPixelCrop,\n I as default,\n M as defaultCrop,\n H as makeAspectCrop,\n K as nudgeCrop\n};\n","import { PixelCrop } from 'react-image-crop'\n\nconst TO_RADIANS = Math.PI / 180\n\nexport async function canvasPreview(image: HTMLImageElement, canvas: HTMLCanvasElement, crop: PixelCrop, scale = 1, rotate = 0) {\n const ctx = canvas.getContext('2d')\n\n if (!ctx) {\n throw new Error('No 2d context')\n }\n\n const scaleX = image.naturalWidth / image.width\n const scaleY = image.naturalHeight / image.height\n const pixelRatio = window.devicePixelRatio\n\n // Create a new variable to reference the canvas element\n const canvasRef = canvas\n\n // Modify the properties of the canvasRef variable instead of the canvas parameter\n canvasRef.width = Math.floor(crop.width * scaleX * pixelRatio)\n canvasRef.height = Math.floor(crop.height * scaleY * pixelRatio)\n\n ctx.scale(pixelRatio, pixelRatio)\n ctx.imageSmoothingQuality = 'high'\n\n const cropX = crop.x * scaleX\n const cropY = crop.y * scaleY\n\n const rotateRads = rotate * TO_RADIANS\n const centerX = image.naturalWidth / 2\n const centerY = image.naturalHeight / 2\n\n ctx.save()\n\n ctx.translate(-cropX, -cropY)\n ctx.translate(centerX, centerY)\n ctx.rotate(rotateRads)\n ctx.scale(scale, scale)\n ctx.translate(-centerX, -centerY)\n ctx.drawImage(image, 0, 0, image.naturalWidth, image.naturalHeight, 0, 0, image.naturalWidth, image.naturalHeight)\n\n ctx.restore()\n}\n","import CSS from 'csstype'\nimport { styled } from 'styles'\nimport { useEffect, useRef, useState } from 'react'\nimport { Modal } from 'components/modal'\nimport EditOutlinedIcon from '@mui/icons-material/EditOutlined'\nimport { convertDocUrlsToBase64, useDebounceEffect } from 'utils/function'\nimport ReactCrop, { centerCrop, makeAspectCrop, Crop, PixelCrop } from 'react-image-crop'\nimport 'react-image-crop/dist/ReactCrop.css'\nimport { TextField } from 'components/form'\nimport { Box, Flex } from 'components/elements'\nimport { Button } from 'components/button'\nimport { canvasPreview } from './canvasPreview'\nimport { OverflowScroll } from 'features/profile/components/EditProfileForm'\n\ntype ModalProps = {\n defaultImage?: string\n preview?: string\n setPreview?: (value: string) => void\n selectedFile?: Blob | undefined\n setSelectedFile?: (value: Blob | undefined) => void\n containerStyle?: CSS.Properties\n}\n\nconst centerAspectCrop = (mediaWidth: number, mediaHeight: number, aspect: number) => {\n return centerCrop(\n makeAspectCrop(\n {\n unit: '%',\n width: 90,\n },\n aspect,\n mediaWidth,\n mediaHeight\n ),\n mediaWidth,\n mediaHeight\n )\n}\n\nexport const UploadImage = (props: ModalProps) => {\n const { defaultImage = '/images/img-placeholder.png', preview, selectedFile, setSelectedFile, containerStyle } = props\n\n const [showPreview, setShowPreview] = useState(false)\n const [profileImage, setProfileImage] = useState('')\n\n const previewCanvasRef = useRef(null)\n const imgRef = useRef(null)\n const [crop, setCrop] = useState()\n const [completedCrop, setCompletedCrop] = useState()\n const [scale, setScale] = useState(1)\n const [rotate, setRotate] = useState(0)\n const [aspect, setAspect] = useState(16 / 9)\n\n const onImageLoad = (e: React.SyntheticEvent) => {\n if (aspect) {\n const { width, height } = e.currentTarget\n setCrop(centerAspectCrop(width, height, aspect))\n }\n }\n\n useDebounceEffect(\n async () => {\n if (completedCrop?.width && completedCrop?.height && imgRef.current && previewCanvasRef.current) {\n canvasPreview(imgRef.current, previewCanvasRef.current, completedCrop, scale, rotate)\n }\n },\n 500,\n [completedCrop, scale, rotate]\n )\n\n const getImageUrl = () => {\n const canvas = document.getElementById('cropped-preview')\n if (canvas instanceof HTMLCanvasElement) {\n canvas.toBlob(blob => {\n if (blob) {\n const file = new File([blob], 'profile.png', { type: blob.type })\n const objectUrl = URL.createObjectURL(blob)\n setProfileImage(objectUrl)\n setSelectedFile?.(file)\n }\n })\n }\n }\n\n const handleToggleAspectClick = () => {\n if (aspect) {\n setAspect(undefined)\n } else if (imgRef.current) {\n const { width, height } = imgRef.current\n setAspect(16 / 9)\n setCrop(centerAspectCrop(width, height, 16 / 9))\n }\n }\n\n const profileHandler = (e: React.ChangeEvent) => {\n if (!e.target.files || e.target.files.length === 0) {\n setSelectedFile?.(selectedFile)\n return\n }\n setSelectedFile?.(e.target.files[0])\n const objectUrl = URL.createObjectURL(e.target.files[0])\n setProfileImage(objectUrl)\n }\n\n const handleModal = () => {\n setShowPreview(true)\n }\n\n useEffect(() => {\n const profileImg = async () => {\n if (preview) {\n const base64IUrl = await convertDocUrlsToBase64([preview])\n setProfileImage(base64IUrl[0])\n }\n }\n profileImg()\n }, [preview])\n\n return (\n <>\n \n {\n handleModal()\n }}\n />\n \n \n \n setShowPreview(false)}\n onAccept={() => {\n getImageUrl()\n setShowPreview(false)\n }}\n children={\n <>\n \n \n setScale(Number(e.target.value))} />\n \n \n setRotate(Math.min(180, Math.max(-180, Number(e.target.value))))}\n />\n \n \n \n \n \n \n {!!profileImage && (\n setCrop(percentCrop)} onComplete={c => setCompletedCrop(c)} aspect={aspect}>\n 
\n \n )}\n {!!completedCrop && (\n \n )}\n \n \n }\n acceptText={'Crop'}\n />\n \n )\n}\n\nconst ImageUpdateContainer = styled('div', {\n 'position': 'relative',\n 'width': '80px',\n 'height': '80px',\n 'margin': '0 0 1.5rem',\n\n '@sm': {\n mx: 12,\n },\n\n '.background': {\n width: '80px',\n height: '80px',\n borderRadius: '100px',\n objectFit: 'cover',\n },\n '.update': {\n 'cursor': 'pointer',\n 'position': 'absolute',\n 'width': '26px',\n 'height': '26px',\n 'right': 0,\n 'bottom': 0,\n 'backgroundColor': '$background',\n 'border': '1px solid $primary',\n 'borderRadius': '16px',\n 'padding': '3px',\n\n '.icon': {\n width: '18px',\n height: '18px',\n },\n },\n})\n\nexport const boxItemsCss = {\n flex: '1 0 130px',\n}\n\nexport const flexWrapCss = {\n flexWrap: 'wrap',\n alignItems: 'flex-end',\n gap: '.75rem',\n marginBottom: '1rem',\n}\n","import { endpoints } from 'utils/endpoints'\nimport { useQuery } from '@tanstack/react-query'\nimport axios from 'axios'\nimport { ApiKey } from 'features/incidents/components/enums'\n\n/**\n * Makes a GET request to the endpoint that returns a list of countries.\n *\n * @returns A list of countries.\n */\nexport const getCountryList = async () => {\n const response = await axios.get(endpoints.getCountryList)\n return response.data\n}\n\nexport const useGetCountries = () => {\n return useQuery([ApiKey.CountryList], () => getCountryList())\n}\n","import * as Yup from 'yup'\nimport { yupResolver } from '@hookform/resolvers/yup'\nimport { TextField } from 'components/form'\nimport { Button } from 'components/button'\nimport { styled } from 'styles/stitches.config'\nimport { Controller, useForm } from 'react-hook-form'\nimport useAuth from 'hooks/use-auth'\nimport { useEffect, useMemo, useState } from 'react'\nimport { AxiosError } from 'axios'\nimport { Box, Flex } from 'components/elements'\nimport { defaultImage, NotificationMessages, PHONE_VALIDATION, RegPattern, ValidationErrors } from 'utils/enum'\nimport { UploadImage } from 'components/uploadImage'\nimport { errorMessage } from 'utils/function'\nimport SnackBar from 'components/SnackBar'\nimport { CircularProgress, FormControl } from '@mui/material'\nimport 'react-phone-number-input/style.css'\nimport PhoneInput, { isValidPhoneNumber } from 'react-phone-number-input'\nimport { StyledDropdownWrap } from 'components/form/Textfield.styles'\nimport { FlexWrapCSS, inputStyle, NegativeMargin, wrapStyle } from 'views/Support/SupportForm'\nimport { useEditProfile } from '../api/editProfile'\nimport { useGetCountries } from '../api/countryList'\nimport { Listing, MenuDropdown } from 'components/menuDropdown'\nimport { SectorList } from 'configs/constants'\n\nexport type ModalFormFields = {\n oldSentinelOneApiKey: string\n sentinelOneApiKey: string\n}\n\ntype EditProfileFormType = {\n firstName: string\n lastName: string\n companyName: string\n companyAddress: string\n companyWebsite: string\n phoneNum: string\n email: string | undefined\n annualRevenue: number | null\n country: string | null\n}\n\nexport const EditProfileForm = () => {\n const { user } = useAuth()\n const { mutate, isLoading, isSuccess } = useEditProfile()\n // countries list api\n const { data: getCountries, isLoading: isCountriesLoading } = useGetCountries()\n const [errorModal, setErrorModal] = useState(false)\n const [phoneNum, setPhoneNumber] = useState(user?.phoneNum || '')\n const [hasError, setHasError] = useState('')\n const [notification, setNotification] = useState(false)\n //user selected country and sector\n const [userSelectedContry, setUserSelectedContry] = useState()\n const [userSector, setUserSector] = useState()\n\n const countryList = useMemo(() => {\n return getCountries?.countries || []\n }, [getCountries])\n\n const {\n register,\n handleSubmit,\n setValue,\n formState: { errors },\n control,\n } = useForm({\n resolver: yupResolver(profileSchema),\n // TODO: refactor default values, also add validation\n defaultValues: {\n firstName: user?.firstName || '',\n lastName: user?.lastName || '',\n phoneNum: user?.phoneNum || '',\n email: user?.email || '',\n companyName: user?.companyName || '',\n companyAddress: user?.companyAddress || '',\n companyWebsite: user?.companyWebsite || '',\n sentinelOneApiKey: user?.sentinelOneAPiKey || '',\n annualRevenue: user?.annualRevenue || null,\n country: user?.country || '',\n sector: user?.sector || '',\n },\n })\n\n useEffect(() => {\n // Set the initial preview image if user has an imageUrl\n if (user?.imageUrl) {\n setPreview(user?.imageUrl || '')\n }\n // Set the initial selected country if user has a country\n if (user?.country && countryList.length > 0) {\n const foundCountry = countryList.find((country: { label: (string | null)[] }) => country.label.includes(user?.country))\n setUserSelectedContry({ label: foundCountry?.label, value: foundCountry?.value })\n }\n // Set the initial selected sector if user has a sector\n if (user?.sector) {\n setUserSector({ label: user?.sector, value: user?.sector })\n }\n }, [countryList, user])\n\n const [submitError, setSubmitError] = useState('')\n const [selectedFile, setSelectedFile] = useState()\n const [preview, setPreview] = useState('')\n\n const onSubmit = (data: EditProfileFormType) => {\n if (hasError !== '') return\n\n // Extract the country name (excluding the flag emoji)\n const countryNameOnly = userSelectedContry?.label.replace(/^[^\\w\\s]+/g, '').trim()\n\n setSubmitError('')\n const bodyFormData = new FormData()\n bodyFormData.append('firstName', data.firstName)\n bodyFormData.append('lastName', data.lastName)\n bodyFormData.append('companyName', data.companyName)\n bodyFormData.append('companyAddress', data.companyAddress)\n bodyFormData.append('companyWebsite', data.companyWebsite)\n bodyFormData.append('phoneNum', data.phoneNum)\n bodyFormData.append('country', countryNameOnly || '')\n bodyFormData.append('sector', userSector?.label || '')\n // bodyFormData.append('annualRevenue', data.annualRevenue !== null ? data.annualRevenue.toString() : '')\n\n if (selectedFile) {\n bodyFormData.append('user_profile_image', selectedFile)\n }\n\n mutate(bodyFormData, {\n onError: (error: unknown) => {\n if (error instanceof AxiosError) {\n setErrorModal(!!submitError)\n setSubmitError(errorMessage(error))\n }\n },\n })\n }\n\n useEffect(() => {\n if (isSuccess) {\n setNotification(true)\n setTimeout(() => {\n setNotification(false)\n }, 2000)\n }\n }, [isSuccess])\n\n const PhoneNumber = (newValue: string | undefined) => {\n if (newValue !== undefined) {\n setPhoneNumber(newValue)\n setValue('phoneNum', newValue, { shouldValidate: true })\n if (isValidPhoneNumber(newValue)) setHasError('')\n else {\n setHasError(PHONE_VALIDATION.PHONEERROR)\n }\n }\n }\n\n return (\n <>\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n {\n PhoneNumber(newValue)\n }}\n />\n \n \n {hasError}\n \n {!!errors.phoneNum && (\n \n {errors.phoneNum?.message}\n \n )}\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n {/* TODO:Might need it later */}\n {/* \n \n */}\n \n \n \n (\n {\n // Update the state with the selected country object\n setUserSelectedContry(e)\n field.onChange(e.value)\n setValue('country', e.value)\n }}\n />\n )}\n />\n {!!errors.country && {errors.country?.message}}\n \n \n \n \n \n \n \n \n (\n {\n // Update the state with the selected sector object and form field value\n setUserSector(e)\n field.onChange(e.value)\n setValue('sector', e.value)\n }}\n />\n )}\n />\n {!!errors.sector && {errors.sector?.message}}\n \n \n \n \n\n \n \n \n\n setNotification(false)} text={NotificationMessages.PROFILE_UPDATE_SUCCESS} severity={'success'} />\n setErrorModal(!submitError)} text={submitError} severity={'error'} />\n \n \n )\n}\n\nconst profileSchema = Yup.object().shape({\n firstName: Yup.string()\n .required(ValidationErrors.FIRST_NAME)\n .matches(RegPattern.NO_WHITE_SPACE, ValidationErrors.NO_WHITE_SPACE)\n .matches(RegPattern.FIRST_NAME_VALIDATION, ValidationErrors.FIRST_NAME_VALIDATION),\n\n lastName: Yup.string()\n .required(ValidationErrors.LAST_NAME)\n .matches(RegPattern.WHITE_SPACE, ValidationErrors.WHITE_SPACE)\n .matches(RegPattern.LAST_NAME_VALIDATION, ValidationErrors.LAST_NAME_VALIDATION),\n\n companyName: Yup.string()\n .required(ValidationErrors.COMPANY_NAME)\n .matches(RegPattern.WHITE_SPACE, ValidationErrors.WHITE_SPACE)\n .matches(RegPattern.COMPANY_NAME_VALIDATION, ValidationErrors.COMPANY_NAME_VALIDATION),\n companyAddress: Yup.string()\n .required(ValidationErrors.ADDRESS)\n .matches(RegPattern.WHITE_SPACE, ValidationErrors.WHITE_SPACE)\n .matches(RegPattern.ADDRESS_VALIDATION, ValidationErrors.ADDRESS_VALIDATION),\n companyWebsite: Yup.string().required(ValidationErrors.WEBSITE_URL).matches(RegPattern.URL_VALIDATION, ValidationErrors.WEBSITE_URL_VALIDATION),\n phoneNum: Yup.string().required(ValidationErrors.PHONE),\n email: Yup.string(),\n country: Yup.string().required(ValidationErrors.COUNTRY_NAME),\n sector: Yup.string().required(ValidationErrors.SECTOR),\n // annualRevenue: Yup.number().typeError(ValidationErrors.ANNUAL_REVENUE_TYPEERROR).positive(ValidationErrors.ANNUAL_REVENUE_POSITIVE).required(ValidationErrors.REQUIRED),\n})\n\nexport const OverflowScroll = {\n 'overflowX': 'auto',\n\n '&::-webkit-scrollbar': {\n width: '6px',\n },\n '&::-webkit-scrollbar-track': {\n background: '$white1A',\n borderRadius: '4px',\n },\n '&::-webkit-scrollbar-thumb': {\n background: '$white',\n borderRadius: '4px',\n },\n}\n\nexport const ButtonWrap = styled('div', {\n 'display': 'flex',\n 'alignItems': 'flex-end',\n 'gap': 15,\n\n '&.circle--icon': {\n button: {\n backgroundColor: '$primary',\n padding: '.4rem',\n borderRadius: '50%',\n\n svg: {\n fontSize: '1.15rem',\n },\n },\n },\n})\n\nexport const ModalbuttonWrapCss = {\n 'justifyContent': 'center',\n 'alignItems': 'center',\n 'flexWrap': 'wrap',\n 'width': '100%',\n 'padding': '1.5rem 0 0',\n 'gap': '20px',\n\n '@sm': {\n padding: '2.5rem 12px 0',\n },\n\n '&.item--left': {\n justifyContent: 'flex-start',\n },\n\n '&.noPadding': {\n padding: 0,\n },\n}\n\nexport const FormBtnWrap = {\n '[class*=\"size-lg\"]': {\n flexGrow: 1,\n },\n}\n\nexport const ModalForm = styled('form', {\n display: 'grid',\n gridTemplateColumns: '1fr',\n gap: 28,\n})\n\nexport const KeyButtonCSS = {\n minWidth: 'unset',\n flexGrow: 1,\n}\n\nexport const ErrorBox = styled('div', {\n color: '$error',\n textAlign: 'center',\n margin: 'auto',\n fontSize: '$sm',\n width: '100%',\n})\nexport const LinkCss = {\n display: 'block',\n color: '$primary',\n mt: 8,\n height: 'auto',\n border: 'none',\n bgColor: 'transparent',\n}\n","import { useMutation, useQueryClient } from '@tanstack/react-query'\nimport { ApiKey } from 'features/incidents/components/enums'\nimport { axios } from 'lib/axios'\nimport { endpoints } from 'utils/endpoints'\n\nexport const addCoveActivation = (data: object) => {\n return axios.post(endpoints.activateCoveActivation, data)\n}\n\nexport const useAddCoveActivation = () => {\n const queryClient = useQueryClient()\n return useMutation(addCoveActivation, {\n onSuccess: () => {\n queryClient.invalidateQueries([ApiKey.policies, ApiKey.list])\n },\n })\n}\n","import { useMutation, useQueryClient } from '@tanstack/react-query'\nimport { ApiKey } from 'features/incidents/components/enums'\nimport { axios } from 'lib/axios'\nimport { endpoints } from 'utils/endpoints'\n\nexport const activatePatchService = (data: object) => {\n return axios.post(endpoints.activatePatchService, data)\n}\nexport const useActivatePatchService = () => {\n const queryClient = useQueryClient()\n return useMutation(activatePatchService, {\n onSuccess: () => {\n queryClient.invalidateQueries([ApiKey.policies, ApiKey.list])\n },\n })\n}\n","import SnackBar from 'components/SnackBar'\nimport { Box, Flex } from 'components/elements'\nimport { TextField } from 'components/form'\nimport { Modal } from 'components/modal'\nimport { RegPattern, ServicesEnum, ValidationErrors } from 'utils/enum'\nimport { useAddCoveActivation } from '../api/coveActivation'\nimport { useForm } from 'react-hook-form'\nimport { yupResolver } from '@hookform/resolvers/yup'\nimport * as Yup from 'yup'\nimport { useEffect, useState } from 'react'\nimport { errorMessage, getFormSchemaAndFields, getUpperCase } from 'utils/function'\nimport { useActivatePatchService } from '../api/activatePatchService'\nimport { useEditProfile } from '../api/editProfile'\nimport { Monitoring_Services_Notification } from 'configs/constants'\nimport { AxiosError } from 'axios'\nimport { ErrorBox } from './EditProfileForm'\nimport { GenericActivationModalProps, ServiceActivationKeys, ServiceModalProp } from 'features/quote/components/type'\n\nconst GenericActivationModal = (props: GenericActivationModalProps) => {\n const { active, hideModal, onAccept, title, formSchema, formFields, confirmLabel, isLoading, error } = props\n const isEDRModal = title?.includes('EDR')\n const {\n register,\n handleSubmit,\n reset,\n formState: { errors },\n } = useForm({\n resolver: yupResolver(formSchema),\n })\n\n const onSubmit = (data: ServiceActivationKeys) => {\n onAccept(data)\n }\n const handleCancel = () => {\n hideModal()\n reset()\n }\n\n return (\n \n {!!error && {getUpperCase(error)}}\n\n {formFields.map((field: { name: string; placeholder: string; label: string }) => (\n \n ))}\n {isEDRModal && (\n \n Don’t have EDR? \n \n Click Here \n \n to learn more and get covered now.\n \n )}\n \n }\n isForm={true}\n acceptText={isLoading ? 'Connecting' : confirmLabel}\n />\n )\n}\nexport const ServiceActivationModal = (props: ServiceModalProp) => {\n const { isOpenModal, setIsOpenModal, setInitialCheckDone } = props\n const [notification, setNotification] = useState(false)\n const [submitError, setSubmitError] = useState('')\n const [notificationMessage, setNotificationMessage] = useState('')\n const { mutate: CoverService, isLoading: isLoadingCove } = useAddCoveActivation()\n const { mutate: PatchService, isLoading: isLoadingPatch } = useActivatePatchService()\n const { mutate: editProfile, isLoading: editingProfile } = useEditProfile()\n const { schema, fields, title } = getFormSchemaAndFields(isOpenModal as ServicesEnum)\n useEffect(() => {\n const customs_message = Monitoring_Services_Notification[isOpenModal as ServicesEnum]\n if (customs_message?.Notification) {\n setNotificationMessage(customs_message.Notification)\n }\n }, [isOpenModal])\n\n const handleSubmit = (data: ServiceActivationKeys) => {\n let apiCall\n if (isOpenModal === ServicesEnum.COVE_DATA) apiCall = CoverService\n else if (isOpenModal === ServicesEnum.N_SIGHT_PATCH) apiCall = PatchService\n else if (isOpenModal === ServicesEnum.EDR) apiCall = editProfile\n setSubmitError('')\n //creating new object at run time based on API need,as data hold all the states\n const obj: Record = {}\n\n fields.forEach((field: { name: string }) => {\n const fieldName = field.name as keyof ServiceActivationKeys\n //adding the endpoint to the url\n if (fieldName === 'sentinelOneConsoleUrl') {\n obj[fieldName] = data[fieldName] + 'web/api/v2.1/threats' ?? null\n } else {\n obj[fieldName] = data[fieldName] ?? null\n }\n })\n if (apiCall) {\n apiCall(obj, {\n onSuccess: () => {\n setNotification(true)\n setIsOpenModal(null)\n setSubmitError('')\n setInitialCheckDone?.(true)\n },\n onError: (error: unknown) => {\n if (error instanceof AxiosError) {\n setSubmitError(errorMessage(error))\n }\n },\n })\n }\n }\n return (\n <>\n {\n setIsOpenModal(null)\n setSubmitError('')\n }}\n onAccept={(data: ServiceActivationKeys) => {\n handleSubmit(data)\n }}\n title={title}\n formSchema={schema}\n formFields={fields}\n confirmLabel=\"Connect\"\n error={submitError}\n isLoading={isLoadingCove || isLoadingPatch || editingProfile}\n />\n {\n setNotification(false)\n setIsOpenModal(null)\n }}\n text={notificationMessage}\n severity={'success'}\n />\n \n )\n}\n\nexport const schema = Yup.object().shape({\n password: Yup.string().required(ValidationErrors.PASSWORD),\n userName: Yup.string().email(ValidationErrors.EMAIL_VALIDATION).required(ValidationErrors.EMAIL),\n})\nexport const patchSchema = Yup.object().shape({\n apiKey: Yup.string().required(ValidationErrors.Patch).matches(RegPattern.NO_WHITE_SPACE, ValidationErrors.NO_WHITE_SPACE),\n})\nexport const edrScheme = Yup.object().shape({\n sentinelOneApiKey: Yup.string().required(ValidationErrors.SENTINEL).matches(RegPattern.NO_WHITE_SPACE, ValidationErrors.NO_WHITE_SPACE),\n sentinelOneConsoleUrl: Yup.string().required(ValidationErrors.SENTINELONE_URL).matches(RegPattern.SENTINELONE_URL, ValidationErrors.SENTINELONE_URL_VALIDATION),\n})\n","import { useQuery } from '@tanstack/react-query'\nimport { ApiKey } from 'features/incidents/components/enums'\nimport { axios } from 'lib/axios'\nimport { endpoints } from 'utils/endpoints'\n\nexport type PlanListingProps = {\n id?: number\n servicesIds?: string\n maxCoverage?: string\n}\n\nexport const getPlanListingForQuote = async (params: PlanListingProps) => {\n return axios.get(endpoints.getPlanForQuote, { params })\n}\nexport const useGetPlanListingForQuote = (params?: PlanListingProps) => {\n return useQuery({\n queryKey: [ApiKey.planListing, ApiKey.list, params],\n queryFn: () => getPlanListingForQuote(params || {}),\n enabled: !!params?.id,\n select: data => {\n const firstPlan = data.data.plans[0] ?? {}\n Object.assign(firstPlan, {\n coveragePlans: firstPlan.options ?? [],\n })\n return { ...data, firstPlan }\n },\n })\n}\n","import { endpoints } from 'utils/endpoints'\nimport { useMutation, useQueryClient } from '@tanstack/react-query'\nimport { ApiKey } from 'features/incidents/components/enums'\nimport { axios } from 'lib/axios'\nexport const signupByQuote = (data: object) => {\n return axios.post(endpoints.signupByQuote, data)\n}\nexport const useSignupByQuote = () => {\n const queryClient = useQueryClient()\n return useMutation(signupByQuote, {\n onSuccess: () => {\n queryClient.invalidateQueries([ApiKey.QuoteReg, ApiKey.list])\n },\n })\n}\n","import { yupResolver } from '@hookform/resolvers/yup'\nimport { Button } from 'components/button'\nimport { Box, Flex, Spinner } from 'components/elements'\nimport FormWrapper from 'features/auth/components/FormWrapper'\nimport { ErrorBox } from 'features/profile/components/EditProfileForm'\nimport { Controller, FieldError, useForm } from 'react-hook-form'\nimport * as Yup from 'yup'\nimport { FormData, QuoteProps, Service } from '../type'\nimport { ApiErrorCode, MESSAGE_ENUM, Stages, ValidationErrors } from 'utils/enum'\nimport { useNavigate } from 'react-router-dom'\nimport { routes } from 'configs/constants'\nimport { CustomRadioButton, ErrorCSS, Form, Label, userRegHeadingCss } from 'views/style'\nimport _ from 'lodash'\nimport { useGetPlanListingForQuote } from 'features/quote/api/getPlanListingForQuote'\nimport { useEffect, useMemo, useState } from 'react'\n\nimport { QouteLayout } from 'features/quote/page/GetAQuotes'\nimport { AxiosError } from 'axios'\nimport { getUpperCase } from 'utils/function'\nimport { BackNavArrowIcon } from 'components/icons'\n\nexport const step2Schema = Yup.object().shape({\n period: Yup.string().required('Please select a payment period'),\n coverage: Yup.string().required(ValidationErrors.COVERAGE_PLAN),\n})\n\nconst Period = {\n month: 'MONTHLY',\n annual: 'YEARLY',\n}\n\nconst CoveragePlan = (props: QuoteProps) => {\n const navigate = useNavigate()\n const planId = props?.quoteUserReg?.planId\n const { data: planList, isLoading, isError, error } = useGetPlanListingForQuote({ id: planId })\n const [submitError, setSubmitError] = useState('')\n const coverageRange = planList?.firstPlan?.coveragePlans\n if (coverageRange) {\n coverageRange.sort((a: { maxCoverage: number }, b: { maxCoverage: number }) => a.maxCoverage - b.maxCoverage)\n }\n const maxCoverageRange: Service[] = coverageRange?.map((item: { maxCoverage: string }) => {\n const coverage = parseFloat(item.maxCoverage).toLocaleString()\n\n // Format the number with thousands separators\n return {\n label: `$${coverage}`,\n value: `${item.maxCoverage}`,\n }\n })\n // remove the duplicates from maxCoverageRange (TODO: check on backend and remove from here)\n const uniqueMaxCoverageRange = maxCoverageRange?.reduce((acc: Service[], curr: Service) => {\n const existingItem = acc.find((item: Service) => item.value === curr.value)\n if (!existingItem) {\n acc.push(curr)\n }\n return acc\n }, [])\n\n const cLookup = useMemo(() => {\n const map = {} as any\n const coveragePlans = coverageRange ?? []\n coveragePlans.forEach((item: any) => {\n map[item.maxCoverage] = item\n })\n return map\n }, [coverageRange])\n\n const {\n handleSubmit,\n control,\n formState: { errors },\n watch,\n } = useForm({\n resolver: yupResolver(step2Schema),\n defaultValues: {\n coverage: (props?.quoteUserReg && props?.quoteUserReg.coverage?.toString()) || '',\n period: (props as any)?.quoteUserReg?.period,\n },\n })\n useEffect(() => {\n window.scrollTo(0, 0)\n }, [])\n\n useEffect(() => {\n if (error instanceof AxiosError) {\n if (error.code === ApiErrorCode.CODE) {\n setSubmitError(MESSAGE_ENUM.ERROR_MESSAGE)\n }\n }\n }, [error, isError])\n\n const coverage = watch('coverage')\n const plan = cLookup[coverage]\n\n const onSubmit = async (data: FormData) => {\n if (!plan) return\n\n const obj = {\n ...props.quoteUserReg,\n coverageId: plan.id,\n period: data.period,\n coverage: data.coverage,\n }\n props.setQuoteUserReg && props.setQuoteUserReg(obj)\n props?.setStage && props.setStage(Stages.STAGE4)\n }\n const chunkedAs = _.chunk(uniqueMaxCoverageRange, 4)\n\n return (\n <>\n {isLoading ? (\n \n \n \n ) : isError ? (\n submitError && (\n <>\n \n \n \n \n {getUpperCase(submitError)}\n \n \n \n \n \n )\n ) : (\n <>\n \n \n \n \n props?.setStage && props.setStage(Stages.STAGE2)} />\n \n Get A Quote\n \n \n\n \n \n \n \n )}\n \n )\n}\n\nexport const buttonCss = {\n 'display': 'grid',\n 'gridTemplateColumns': '1fr',\n 'gap': 28,\n '@sm': {\n gridTemplateColumns: '1fr 1fr',\n },\n}\nexport default CoveragePlan\n","import { useQuery } from '@tanstack/react-query'\nimport { ApiKey } from 'features/incidents/components/enums'\nimport { axios } from 'lib/axios'\nimport { endpoints } from 'utils/endpoints'\n\nexport type MerchantAffiliateProps = {\n affiliateId: string\n}\n\nexport const getMerchantAffiliateDetails = async (params: MerchantAffiliateProps) => {\n return axios.get(endpoints.merchantAffiliateDetails, { params })\n}\nexport const useGetMerchantAffiliateDetails = (params: MerchantAffiliateProps) => {\n return useQuery([ApiKey.merchantAffiliateDetails, ApiKey.details, params], () => getMerchantAffiliateDetails(params), {\n enabled: !!params.affiliateId,\n })\n}\n","import * as Yup from 'yup'\nimport { PlanFormData, QuoteReviewProps, ServiceListing } from '../type'\nimport { Controller, useForm } from 'react-hook-form'\nimport { yupResolver } from '@hookform/resolvers/yup'\nimport { wrapStyle } from 'views/Support/SupportForm'\nimport { Box, Flex } from 'components/elements'\nimport { Listing, MenuDropdown } from 'components/menuDropdown'\nimport { useEffect, useMemo, useState } from 'react'\nimport FormWrapper from 'features/auth/components/FormWrapper'\nimport { Button } from 'components/button/Button'\nimport { useLocation, useNavigate } from 'react-router-dom'\nimport { AffiliateID, routes } from 'configs/constants'\nimport { ErrorBox } from 'features/profile/components/EditProfileForm'\nimport { Stages, ValidationErrors } from 'utils/enum'\nimport { ErrorCSS, Form, userRegHeadingCss } from 'views/style'\nimport { QouteLayout } from 'features/quote/page/GetAQuotes'\nimport { buttonCss } from './CoveragePlan'\nimport { useGetMerchantAffiliateDetails } from 'features/quote/api/getmerchantAffiliateDetails'\n\nexport const planScehema = Yup.object({\n planId: Yup.number().required(ValidationErrors.QuotePolicy),\n})\n\nconst PlanSelection = (props: QuoteReviewProps) => {\n const { quoteUserReg, setQuoteReview, setStage, setQuoteUserReg } = props\n const [insurancePlan, setInsurancePlan] = useState()\n const [merchantAffiliateId, setIsMerchantAffiliateId] = useState('')\n\n const navigate = useNavigate()\n\n const location = useLocation()\n // //if url has sepecific affiliateId then user is coming from box carrier\n const searchParams = new URLSearchParams(location.search)\n const carrier_AffiliateId = searchParams.get('affiliateId')\n\n const { data: planList, isFetching: isPlanListingLoading, isError } = useGetMerchantAffiliateDetails({ affiliateId: merchantAffiliateId })\n\n const {\n register,\n handleSubmit,\n formState: { errors },\n control,\n setValue,\n } = useForm({\n resolver: yupResolver(planScehema),\n defaultValues: {\n planId: (quoteUserReg && quoteUserReg.planId) || undefined,\n },\n })\n\n //all the policy into select lisiting format\n const insurancePlansList = useMemo(() => {\n return planList?.data.insurancePlans || []\n }, [planList?.data.insurancePlans])\n\n const policyPlansList = useMemo(() => {\n if (insurancePlansList) {\n return insurancePlansList.map(\n (\n items: { name: string; id: number; basePremium: string; maxCoverage: string; primaryService: ServiceListing; services: ServiceListing[]; discount: number },\n index: number\n ) => {\n return {\n label: items?.name,\n value: items?.id,\n key: index,\n discount: items?.discount,\n premiumAmount: items?.basePremium,\n maxCoverage: items?.maxCoverage,\n primaryService: items?.primaryService,\n services: items?.services,\n }\n }\n )\n }\n }, [insurancePlansList])\n\n //if url has sepecific affiliateId then user is coming from box carrier\n //and then sepecific plan\n useEffect(() => {\n if (carrier_AffiliateId) setIsMerchantAffiliateId(carrier_AffiliateId)\n }, [carrier_AffiliateId])\n //if there is error then set the default value of affiliateId & go with that.\n useEffect(() => {\n if (isError) setIsMerchantAffiliateId(AffiliateID)\n }, [isError])\n useEffect(() => {\n window.scrollTo(0, 0)\n }, [])\n useEffect(() => {\n const plan = quoteUserReg && quoteUserReg?.planId\n\n if (policyPlansList) {\n const planDetails = policyPlansList.find((policy: { value: number }) => policy.value === plan)\n\n // Set the plan state with the matching label and value i already record exist\n if (planDetails) {\n setInsurancePlan({\n label: planDetails.label,\n value: planDetails.value,\n premiumAmount: planDetails.premiumAmount,\n maxCoverage: planDetails.maxCoverage,\n primaryService: planDetails.primaryService,\n services: planDetails.services,\n discount: planDetails?.discount,\n })\n }\n }\n }, [policyPlansList, quoteUserReg])\n const onSubmit = async (data: PlanFormData) => {\n const primaryService = insurancePlan?.primaryService\n //secondary service should not have the primary service\n const secondaryservices = insurancePlan?.services?.filter((service: { id: number }) => service.id !== primaryService?.id)\n\n const obj = {\n ...quoteUserReg,\n planId: data.planId,\n primaryService: primaryService,\n secondaryservices: secondaryservices,\n discount: insurancePlan?.discount,\n merchantAffiliateId,\n }\n\n if (insurancePlan) setQuoteReview && setQuoteReview({ insurancePlan })\n\n setQuoteUserReg && setQuoteUserReg(obj)\n setStage && setStage(Stages.STAGE2)\n }\n\n return (\n <>\n \n \n \n \n Get Quote\n \n \n \n \n \n \n )\n}\n\nexport const TermsCSS = {\n color: '$primary',\n border: 'none',\n bgColor: 'transparent',\n textAlign: 'center',\n padding: '0px',\n}\n\nexport const BorderCss = {\n border: '1px solid $white5',\n}\nexport default PlanSelection\n","import { Box, Flex } from 'components/elements'\nimport { Modal } from 'components/modal'\nimport { ModalForm } from 'features/profile/components/EditProfileForm'\n\ninterface QuoteReviewModalProps {\n openModal: boolean\n setOpenModal: (open: boolean) => void\n handleAccept: () => void\n background?: string\n isLoading?: boolean\n}\n\nconst QuoteReviewModal = ({ openModal, setOpenModal, handleAccept, background, isLoading }: QuoteReviewModalProps) => {\n return (\n setOpenModal(false)}\n onAccept={handleAccept}\n title=\"\"\n description=\"\"\n style={{ maxWidth: '800px', background: background }}\n children={\n <>\n \n \n \n Terms and Conditions\n \n Your Agreement\n \n \n Last Revised: December 16, 2022\n \n Welcome to DLT Alert. This site is provided as a service to our visitors and may be used for informational purposes only. Because the Terms and Conditions contain\n legal obligations, please read them carefully.\n \n 1. YOUR AGREEMENT\n \n By using this Site, you agree to be bound by, and to comply with, these Terms and Conditions. If you do not agree to these Terms and Conditions, please do not use\n this site. PLEASE NOTE: We reserve the right, at our sole discretion, to change, modify or otherwise alter these Terms and Conditions at any time. Unless otherwise\n indicated, amendments will become effective immediately. Please review these Terms and Conditions periodically. Your continued use of the Site following the posting\n of changes and/or modifications will constitute your acceptance of the revised Terms and Conditions and the reasonableness of these standards for notice of changes.\n For your information, this page was last updated as of the date at the top of these terms and conditions.\n \n 2. PRIVACY\n Please review our Privacy Policy, which also governs your visit to this Site, to understand our practices.\n \n \n \n }\n isForm={true}\n acceptText={'Accept'}\n />\n )\n}\n\nexport default QuoteReviewModal\n","import { Box, Flex } from 'components/elements'\nimport { DetailContainer, DetailWrapper, DetailedCard, InfoColumn, MainWrapCSS } from 'features/incidents/components/style'\nimport { useEffect, useState, useMemo } from 'react'\nimport { routes, serviceArrayAssessment, serviceLableAssessments } from 'configs/constants'\nimport FormWrapper from 'features/auth/components/FormWrapper'\nimport { CheckBoxInput, Form, Label, userRegHeadingCss } from 'views/style'\nimport { Button } from 'components/button/Button'\nimport { useNavigate } from 'react-router-dom'\nimport { Controller, useForm } from 'react-hook-form'\nimport { QouteLayout } from 'features/quote/page/GetAQuotes'\nimport { PlanReviewSummaryProps, ReviewTermsConditionCompDTO } from 'features/quote/components/type'\nimport { BoxCss, textCss } from 'features/quote/components/GetAQuoteProcess/QuoteReview'\nimport { buttonCss } from 'features/quote/components/GetAQuoteProcess/CoveragePlan'\nimport QuoteReviewModal from 'features/quote/components/GetAQuoteProcess/QuoteReviewModal'\nimport { useSignupByQuote } from 'features/quote/api/signupByQuote'\nimport { AxiosError } from 'axios'\nimport { errorMessage, getUpperCase } from 'utils/function'\nimport { ErrorBox } from 'features/profile/components/EditProfileForm'\nimport { CircularProgress } from '@mui/material'\n\nconst AffiliateUserQuoteReview = (prop: PlanReviewSummaryProps) => {\n const { quoteUserReg } = prop\n const [openModal, setOpenModal] = useState(false)\n const [submitError, setSubmitError] = useState('')\n\n const services = useMemo(() => {\n return quoteUserReg?.service || []\n }, [quoteUserReg])\n\n const navigate = useNavigate()\n //proper box carrier user comp registration\n const { mutate, isLoading } = useSignupByQuote()\n\n useEffect(() => {\n window.scrollTo(0, 0)\n }, [])\n\n const { handleSubmit, control, setValue } = useForm()\n const onSubmit = () => {\n if (openModal) {\n handleAccept()\n } else setOpenModal(true)\n }\n const handleAccept = () => {\n setValue('terms', true)\n const services = quoteUserReg?.service\n const skipPayment = true\n const userRegistrationObject = {\n ...quoteUserReg,\n ...quoteUserReg?.users,\n services,\n skipPayment, //it true mean alreay paid\n }\n\n mutate(userRegistrationObject, {\n onSuccess: data => {\n setOpenModal(false)\n window.location.href = data?.url\n },\n onError: error => {\n if (error instanceof AxiosError) {\n setSubmitError(errorMessage(error))\n setOpenModal(false)\n }\n },\n })\n }\n return (\n <>\n \n \n \n \n Quote Review\n \n \n\n \n \n\n \n \n \n )\n}\n\nexport const ReviewTermsConditionComp = (props: ReviewTermsConditionCompDTO) => {\n const { control, setOpenModal, color, border } = props\n return (\n \n \n \n \n \n )\n}\nexport const InnerBorderCss = {\n border: '2px solid $gray14',\n}\n\nexport default AffiliateUserQuoteReview\n","import { Box, Flex } from 'components/elements'\nimport { DetailContainer, DetailWrapper, DetailedCard, InfoColumn, MainWrapCSS } from 'features/incidents/components/style'\nimport { styled } from '@stitches/react'\nimport { PlanReviewSummaryProps } from '../type'\nimport { useEffect, useState, useMemo } from 'react'\nimport { routes, serviceArrayAssessment, serviceLableAssessments } from 'configs/constants'\nimport FormWrapper from 'features/auth/components/FormWrapper'\nimport { Form, userRegHeadingCss } from 'views/style'\nimport { Button } from 'components/button/Button'\nimport { useNavigate } from 'react-router-dom'\nimport { useForm } from 'react-hook-form'\nimport { BorderCss } from './PlanSelection'\nimport { BackNavArrowIcon } from 'components/icons'\nimport { Stages } from 'utils/enum'\n// import { TotalDiscountApplied } from 'utils/function'\n// import { calculateDiscount } from './ServiceFormBase'\nimport { QouteLayout } from 'features/quote/page/GetAQuotes'\nimport { buttonCss } from './CoveragePlan'\nimport { ReviewTermsConditionComp } from 'features/customLandingPage/component/AffiliateUserQuoteReview'\nimport QuoteReviewModal from './QuoteReviewModal'\n\nconst QuoteReview = (prop: PlanReviewSummaryProps) => {\n const [hasServices, setHasServices] = useState('')\n const [openModal, setOpenModal] = useState(false)\n const [hasDiscount, setHadDiscount] = useState(false)\n const services = useMemo(() => {\n return (prop?.quoteUserReg && prop.quoteUserReg.service) || []\n }, [prop?.quoteUserReg])\n\n const secondaryServices = services.filter(item => item !== prop?.quoteUserReg?.primaryService?.id)\n const navigate = useNavigate()\n const totalDiscount = (prop?.quoteUserReg && prop?.quoteUserReg.discount) || 0\n // nullish operator to provide a default value of 0\n // const discountAmount =\n // (prop?.quoteReview?.insurancePlan?.premiumAmount ?? 0) - (prop?.quoteReview?.insurancePlan?.premiumAmount ?? 0) * (calculateDiscount(secondaryServices, totalDiscount) / 100)\n\n useEffect(() => {\n //settting the discount on the base on services\n // TotalDiscountApplied({\n // services: secondaryServices || [],\n // totalDiscount: totalDiscount,\n // setHasServices: setHasServices,\n // setHadDiscount: setHadDiscount,\n // })\n //\n const d = prop?.quoteUserReg?.premiumInfo?.discountPercent\n if (d && d > 0) {\n setHadDiscount(true)\n setHasServices(d.toString())\n }\n }, [prop.quoteUserReg, secondaryServices, services, totalDiscount])\n useEffect(() => {\n window.scrollTo(0, 0)\n }, [])\n\n const { handleSubmit, control, setValue } = useForm()\n const onSubmit = () => {\n if (openModal) {\n prop?.setStage && prop.setStage(Stages.STAGE7)\n } else setOpenModal(true)\n }\n const handleAccept = () => {\n setValue('terms', true)\n setOpenModal(false)\n prop?.setStage && prop.setStage(Stages.STAGE7)\n }\n return (\n <>\n \n \n \n \n prop?.setStage && prop.setStage(Stages.STAGE4)} />\n\n \n Quote Review\n \n \n\n \n \n \n \n \n )\n}\nexport const Notification = styled(Box, {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n alignSelf: 'center',\n height: 'fit-content',\n background: '$primary',\n borderRadius: '90px',\n padding: ' 7px 15px',\n})\nexport const BoxCss = {\n marginBottom: 0,\n maxWidth: '200px',\n width: '100%',\n padding: '1rem 1.5rem',\n}\nexport const textCss = {\n fontSize: '$base',\n fontWeight: '$semibold',\n wordBreak: 'break-word !important',\n}\nexport default QuoteReview\n","import { Box, Flex } from 'components/elements'\nimport { Button } from 'components/button'\nimport { yupResolver } from '@hookform/resolvers/yup'\nimport { Controller, useForm } from 'react-hook-form'\nimport { useEffect, useState } from 'react'\nimport { NotificationMessages, QuoteStatement, Stages, ValidationErrors } from 'utils/enum'\nimport { ErrorBox } from 'features/profile/components/EditProfileForm'\nimport { QuoteProps, QuoteServicesProps } from '../type'\nimport FormWrapper from 'features/auth/components/FormWrapper'\nimport { useNavigate } from 'react-router-dom'\nimport { routes, serviceLableAssessments } from 'configs/constants'\nimport * as Yup from 'yup'\nimport { MenuList } from 'components/sidebarLayout/Sidebar/SidebarMenu'\nimport { FlexWrapCSS, inputStyle, wrapStyle } from 'views/Support/SupportForm'\nimport { StyledDropdownWrap, StyledHelperText, StyledLabel } from 'components/form/Textfield.styles'\nimport { TextField } from 'components/form'\nimport { CheckBoxInput, ErrorCSS, Form, Label, userRegHeadingCss } from 'views/style'\nimport { BackNavArrowIcon } from 'components/icons'\nimport { QouteLayout } from 'features/quote/page/GetAQuotes'\nimport { buttonCss } from './CoveragePlan'\nimport { formatServiceName } from 'utils/function'\nimport { ExtneralLink } from 'features/incidents/components/enums'\nexport const step1Schema = Yup.object({\n service: Yup.array().required(ValidationErrors.SERVICESOPTIONS),\n others: Yup.string().nullable(),\n})\n\nexport const ServicesFormBase = ({ props, stage }: { props: QuoteProps; stage: Stages }) => {\n const { quoteUserReg, setStage, setQuoteUserReg } = props\n\n const [, setHasServices] = useState('') //if user selected more then two services\n const secondaryServices = quoteUserReg?.secondaryservices\n const primary_service = quoteUserReg?.primaryService\n const discount = quoteUserReg?.discount || 0\n const {\n handleSubmit,\n control,\n setValue,\n getValues,\n formState: { errors },\n register,\n } = useForm({\n resolver: yupResolver(step1Schema),\n defaultValues: {\n service: [],\n others: quoteUserReg && quoteUserReg?.others,\n },\n })\n\n useEffect(() => {\n //settting the value of checkboxes if already checked\n if (quoteUserReg && quoteUserReg.service) {\n quoteUserReg &&\n quoteUserReg.service.forEach(item => {\n setValue(`service.${item}`, item)\n })\n //exculding the primary services\n //discount will applied if user have more then on secondary services\n const services = quoteUserReg && quoteUserReg.service.filter(item => item !== primary_service?.id)\n if (services && services.length > 1) {\n const appliedDiscount = calculateDiscount(services, discount)\n setHasServices(`${appliedDiscount}${NotificationMessages.DISCOUNT}`)\n }\n }\n }, [discount, primary_service, quoteUserReg, setValue])\n\n const navigate = useNavigate()\n\n const onSubmit = (data: QuoteServicesProps) => {\n //filter out the services should not be null,undefined and should not have primaryservice\n let services = (data?.service && data?.service.filter(item => item !== null && item !== undefined)) || []\n services = services.filter(item => item !== primary_service?.id)\n\n if (primary_service) {\n services = [...services, primary_service?.id]\n }\n\n const obj = {\n ...props.quoteUserReg,\n service: services,\n others: data?.others && data?.others,\n discount: discount,\n }\n if (obj.others === '') delete obj.others\n setQuoteUserReg && setQuoteUserReg(obj)\n setStage && setStage(stage)\n }\n\n const handleServices = () => {\n const servicesRecord = getValues('service')\n //exculding the primaryServices\n\n const services = (servicesRecord && servicesRecord.filter(item => item !== null && item !== undefined && item !== primary_service?.id)) || []\n if (services && services.length > 1) {\n const appliedDiscount = calculateDiscount(services, discount)\n\n setHasServices(`${appliedDiscount}${NotificationMessages.DISCOUNT}`)\n } else {\n setHasServices('')\n }\n }\n return (\n <>\n \n \n \n props?.setStage && props.setStage(Stages.STAGE1)} />\n \n Get A Quote\n \n \n \n \n \n \n )\n}\nexport const calculateDiscount = (services: number[], discount: number) => {\n if (services.length > 1) {\n const serviceLength = services.length - 1\n return serviceLength * discount\n } else {\n return 0\n }\n}\n","import { Stages } from 'utils/enum'\nimport { QuoteProps } from '../type'\nimport { ServicesFormBase } from './ServiceFormBase'\n\nexport const ServicesForm = (props: QuoteProps) => {\n return \n}\n","import { TextField } from 'components/form'\nimport { Box, Flex } from 'components/elements'\nimport { Button } from 'components/button'\nimport { FlexWrapCSS, inputStyle, NegativeMargin, wrapStyle } from 'views/Support/SupportForm'\nimport { ErrorBox, FormBtnWrap, ModalbuttonWrapCss } from 'features/profile/components/EditProfileForm'\nimport { yupResolver } from '@hookform/resolvers/yup'\nimport { CircularProgress, FormControl, Tooltip } from '@mui/material'\nimport { StyledDropdownWrap, StyledLabel } from 'components/form/Textfield.styles'\nimport { useState } from 'react'\nimport { useForm, SubmitHandler } from 'react-hook-form'\nimport { PHONE_VALIDATION, ValidationErrors, RegPattern, Stages } from 'utils/enum'\nimport * as Yup from 'yup'\nimport PhoneInput, { isValidPhoneNumber } from 'react-phone-number-input'\nimport { routes } from 'configs/constants'\nimport { useNavigate } from 'react-router-dom'\nimport { Form1Props, QuoteDTO } from './type'\nimport FormWrapper from 'features/auth/components/FormWrapper'\nimport { userRegHeadingCss } from 'views/style'\nimport { errorMessage, getUpperCase } from 'utils/function'\nimport { BackNavArrowIcon } from 'components/icons'\nimport { useSignupByQuote } from '../api/signupByQuote'\nimport { AxiosError } from 'axios'\nimport HelpOutlineIcon from '@mui/icons-material/HelpOutline'\nimport { ToolTipcss } from 'features/incidents/components/style'\nimport { QouteLayout } from '../page/GetAQuotes'\n\nexport const GetAQuoteForm = (props: Form1Props) => {\n const { quoteUserReg, setQuoteUserReg, setStage, apiError } = props\n const user = quoteUserReg?.users\n const [submitError, setSubmitError] = useState('')\n const [phoneNum, setPhoneNumber] = useState(user?.phoneNum || '')\n const [hasError, setHasError] = useState('')\n const navigate = useNavigate()\n const { mutate, isLoading } = useSignupByQuote()\n\n const {\n handleSubmit,\n register,\n setValue,\n formState: { errors },\n } = useForm({\n resolver: yupResolver(getAQoute),\n defaultValues: {\n firstName: user?.firstName || '',\n lastName: user?.lastName || '',\n email: user?.email || '',\n companyName: user?.companyName || '',\n phoneNum: user?.phoneNum || '',\n //user affiliate id or client provided\n merchantAffiliateId: user?.merchantAffiliateId || quoteUserReg?.merchantAffiliateId,\n },\n })\n\n const onSubmit: SubmitHandler = async data => {\n if (hasError !== '') return\n setSubmitError('')\n\n const services = quoteUserReg?.service\n //box carrier is paid , skip Payment\n const newObj = {\n ...quoteUserReg,\n ...data,\n email: data.email.trim(),\n paymentPeriod: quoteUserReg?.period,\n services,\n }\n data.merchantAffiliateId\n setQuoteUserReg?.({\n ...quoteUserReg,\n users: {\n ...data,\n merchantAffiliateId: data.merchantAffiliateId === '' ? null : data.merchantAffiliateId,\n },\n status: true,\n })\n\n delete newObj.service\n delete newObj.users\n if (newObj.merchantAffiliateId === '') {\n newObj.merchantAffiliateId = null\n }\n mutate(newObj, {\n onSuccess: data => {\n //@ts-expect-error improve type\n setQuoteUserReg?.(prev => ({\n ...prev,\n premiumInfo: {\n premium: (data?.premium ?? 0).toLocaleString(),\n maxCoverage: (data?.maxCoverage ?? 0).toLocaleString(),\n discountPercent: data?.discountedPercentage ?? 0,\n discountValue: (data?.discountedPremium ?? 0).toLocaleString(),\n period: data?.paymentPeriod ?? '',\n },\n }))\n setStage?.(Stages.STAGE5)\n },\n onError: error => {\n if (error instanceof AxiosError) {\n setSubmitError(errorMessage(error))\n }\n },\n })\n }\n\n const PhoneNumber = (newValue: string | undefined) => {\n if (newValue !== undefined) {\n setPhoneNumber(newValue)\n setValue('phoneNum', newValue, { shouldValidate: true })\n if (isValidPhoneNumber(newValue)) setHasError('')\n else {\n setHasError(PHONE_VALIDATION.PHONEERROR)\n }\n }\n }\n\n return (\n <>\n \n \n \n props?.setStage && props.setStage(Stages.STAGE3)} />\n \n Get A Quote\n \n \n \n {!!submitError && {getUpperCase(submitError)}}\n {!!apiError && {getUpperCase(apiError)}}\n\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n Phone Number\n {\n PhoneNumber(newValue)\n }}\n />\n \n \n {hasError}\n \n {!!errors.phoneNum && (\n \n {errors.phoneNum?.message}\n \n )}\n \n \n \n \n Carrier AffiliateId\n \n This is the affiliate ID for reference of the carrier through which you came to know of DLT.\n \n }\n placement=\"bottom\"\n enterTouchDelay={0}\n >\n \n \n \n \n \n\n \n \n \n\n \n \n\n \n \n \n \n \n \n )\n}\nexport const getAQoute = Yup.object().shape({\n firstName: Yup.string()\n .required(ValidationErrors.FIRST_NAME)\n .matches(RegPattern.NO_WHITE_SPACE, ValidationErrors.NO_WHITE_SPACE)\n .matches(RegPattern.FIRST_NAME_VALIDATION, ValidationErrors.FIRST_NAME_VALIDATION),\n\n lastName: Yup.string()\n .required(ValidationErrors.LAST_NAME)\n .matches(RegPattern.NO_WHITE_SPACE, ValidationErrors.NO_WHITE_SPACE)\n .matches(RegPattern.LAST_NAME_VALIDATION, ValidationErrors.LAST_NAME_VALIDATION),\n email: Yup.string().required(ValidationErrors.EMAIL_VALIDATION).matches(RegPattern.EMAIL_VALIDATION, ValidationErrors.EMAIL_VALIDATION),\n companyName: Yup.string()\n .required(ValidationErrors.COMPANY_NAME)\n .matches(RegPattern.WHITE_SPACE, ValidationErrors.WHITE_SPACE)\n .matches(RegPattern.COMPANY_NAME_VALIDATION, ValidationErrors.COMPANY_NAME_VALIDATION),\n phoneNum: Yup.string().required(ValidationErrors.PHONE),\n merchantAffiliateId: Yup.string().nullable(),\n})\n","import { axios } from 'lib/axios'\nimport { endpoints } from 'utils/endpoints'\nimport { useQuery } from '@tanstack/react-query'\nimport { ApiKey } from 'features/incidents/components/enums'\nimport { ALreadyLoginDTO } from '../components/type'\n\nexport const getUserQouteInfo = async (params: ALreadyLoginDTO) => {\n return axios.get(endpoints.getUserQuote, { params })\n}\n\nexport const useGetUserQouteInfo = (params: ALreadyLoginDTO) => {\n return useQuery(\n [ApiKey.Quote, ApiKey.list, params],\n () => getUserQouteInfo(params),\n\n //API only get call whem email is not empty string\n {\n enabled: params.email ? params.email.includes('@') : false,\n }\n )\n}\n","import { yupResolver } from '@hookform/resolvers/yup'\nimport { Button } from 'components/button'\nimport { Box, Flex } from 'components/elements'\nimport { TextField } from 'components/form'\nimport FormWrapper from 'features/auth/components/FormWrapper'\nimport { useForm } from 'react-hook-form'\nimport { RegPattern, Stages, ValidationErrors } from 'utils/enum'\nimport { ALreadyLoginDTO, QuoteProps } from '../type'\nimport * as Yup from 'yup'\nimport { ModalbuttonWrapCss } from 'features/profile/components/EditProfileForm'\nimport { useEffect, useState } from 'react'\nimport { errorMessage, getUpperCase } from 'utils/function'\nimport { useGetUserQouteInfo } from '../../api/getQuoteUserInfo'\nimport { AxiosError } from 'axios'\nimport { userRegHeadingCss } from 'views/style'\nimport { QouteLayout } from 'features/quote/page/GetAQuotes'\n\nconst QuoteFormRegistered = (props: QuoteProps) => {\n const { setQuoteUserReg, setStage } = props\n const [submitError, setSubmitError] = useState('')\n const [userEmail, setUserEmail] = useState(null)\n const {\n data: qouteData,\n error,\n isFetched,\n } = useGetUserQouteInfo({\n email: userEmail,\n })\n const {\n handleSubmit,\n register,\n formState: { errors },\n } = useForm({\n resolver: yupResolver(scheme),\n })\n const onSubmit = async (data: ALreadyLoginDTO) => {\n setUserEmail(data?.email && data?.email?.trim())\n }\n\n useEffect(() => {\n window.scrollTo(0, 0)\n }, [])\n\n useEffect(() => {\n if (qouteData?.data && isFetched) {\n setSubmitError('')\n\n const userDetails = qouteData?.data?.user\n const userServices = qouteData?.data?.userPlan?.services\n const primaryService = qouteData?.data?.userPlan?.primaryServiceId\n //service is secondary service and it should not include the primary services\n const service =\n userServices && userServices.filter((item: { serviceId: number }) => item.serviceId !== primaryService?.id).map((item: { serviceId: number }) => item.serviceId)\n const obj = {\n users: userDetails,\n service,\n coverage: qouteData?.data?.userPlan?.maxCoverage,\n others: qouteData?.data?.userPlan?.others,\n planId: qouteData?.data?.userPlan?.planId,\n status: qouteData?.data?.userPlan?.status,\n primaryService: primaryService,\n }\n setQuoteUserReg && setQuoteUserReg(obj)\n setStage && setStage(Stages.STAGE1)\n } else {\n if (error instanceof AxiosError) {\n setSubmitError(errorMessage(error))\n }\n }\n }, [error, isFetched, qouteData, setQuoteUserReg, setStage])\n\n return (\n <>\n \n \n \n Get A Quote\n \n \n {!!submitError && (\n \n {getUpperCase(submitError)}\n \n )}\n \n\n \n \n \n \n \n \n \n \n )\n}\nconst scheme = Yup.object().shape({\n email: Yup.string().required(ValidationErrors.EMAIL_VALIDATION).matches(RegPattern.EMAIL_VALIDATION, ValidationErrors.EMAIL_VALIDATION),\n})\n\nexport default QuoteFormRegistered\n","import { AxiosError } from 'axios'\nimport { Box, Flex } from 'components/elements'\nimport FormWrapper from 'features/auth/components/FormWrapper'\nimport { DetailContainer, InfoColumn, MainWrapCSS } from 'features/incidents/components/style'\nimport { ErrorBox } from 'features/profile/components/EditProfileForm'\nimport { useSignupByQuote } from 'features/quote/api/signupByQuote'\nimport { BoxCss, Notification, textCss } from 'features/quote/components/GetAQuoteProcess/QuoteReview'\nimport { PaymentProps } from 'features/quote/components/type'\nimport { useState, useEffect, useMemo } from 'react'\nimport { TotalDiscountApplied, errorMessage, getUpperCase } from 'utils/function'\nimport StripePayment from './StripePayment'\n// import { calculateDiscount } from 'features/quote/components/GetAQuoteProcess/ServiceFormBase'\n\nexport const PaymentQuoteForm = (props: PaymentProps) => {\n const [submitError, setSubmitError] = useState('')\n const [hasServices, setHasServices] = useState('')\n const [hasDiscount, setHadDiscount] = useState(false)\n const services = useMemo(() => {\n return (props?.quoteUserReg && props?.quoteUserReg.service) || []\n }, [props?.quoteUserReg])\n const secondaryServices = services.filter(item => item !== props?.quoteUserReg?.primaryService?.id)\n const totalDiscount = (props?.quoteUserReg && props?.quoteUserReg.discount) || 0\n // const discountApplied = (props?.quoteReview?.insurancePlan?.premiumAmount ?? 0) * (calculateDiscount(secondaryServices, totalDiscount) / 100)\n // nullish operator to provide a default value of 0\n // const discountedAmount = (props?.quoteReview?.insurancePlan?.premiumAmount ?? 0) - discountApplied\n\n const { mutate, isLoading } = useSignupByQuote()\n useEffect(() => {\n window.scrollTo(0, 0)\n }, [])\n const doc: Document = document\n const body = doc.querySelector('body')\n useEffect(() => {\n body?.classList.remove('overflow--hidden--modal')\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n useEffect(() => {\n //settting the discount on the base on services\n TotalDiscountApplied({\n services: secondaryServices || [],\n totalDiscount: totalDiscount,\n setHasServices: setHasServices,\n setHadDiscount: setHadDiscount,\n })\n }, [props.quoteUserReg, secondaryServices, totalDiscount])\n const handleStripeSubmit = (paymentMethodId: string) => {\n const services = props?.quoteUserReg && props?.quoteUserReg?.service\n const newObj = {\n ...props.quoteUserReg,\n ...props.quoteUserReg?.users,\n paymentPeriod: props.quoteUserReg?.period,\n services,\n paymentMethodId,\n isAutoSubscriptionEnabled: true,\n }\n delete newObj.service\n delete newObj.users\n delete newObj.status\n mutate(newObj, {\n onSuccess: data => {\n window.location.href = data?.data.url\n },\n onError: error => {\n if (error instanceof AxiosError) {\n setSubmitError(errorMessage(error))\n }\n },\n })\n }\n\n return (\n \n \n \n \n Payment Information\n \n {hasDiscount && (\n \n \n You saved {hasServices}\n \n \n )}\n \n {props?.quoteReview?.insurancePlan && (\n \n \n \n \n Original Premium{' '}\n \n \n ${props?.quoteUserReg?.premiumInfo?.premium}\n \n \n \n \n Discounted Premium\n \n \n ${props?.quoteUserReg?.premiumInfo?.discountValue}\n \n \n \n \n )}\n \n Card Information\n \n \n {!!submitError && {getUpperCase(submitError)}}\n \n \n \n \n )\n}\n","import { ServicesForm } from './GetAQuoteProcess/ServicesForm'\nimport { useEffect, useState } from 'react'\nimport { GetAQuoteForm } from './GetAQuoteForm'\nimport { Stages } from 'utils/enum'\nimport { QuoteServicesProps, PlanSelectionReviewProps } from './type'\nimport PlanSelection from './GetAQuoteProcess/PlanSelection'\nimport CoveragePlan from './GetAQuoteProcess/CoveragePlan'\nimport QuoteFormRegistered from './GetAQuoteProcess/UserQuoteFormRegistered'\nimport QuoteReview from './GetAQuoteProcess/QuoteReview'\nimport StripeComponent from 'features/stripe/page/StripeComponent'\nimport { PaymentQuoteForm } from 'features/stripe/components/PaymentQuote'\n\nconst GetAQuoteRegister = () => {\n const [stage, setStage] = useState(Stages.STAGE1)\n const [quoteUserReg, setQuoteUserReg] = useState()\n const [quoteReview, setQuoteReview] = useState()\n\n // TODO: Commenting CRC Flow\n // const [carrierDetails, setCarrierDetails] = useState()\n // button of register form disabled till box carrier plan auto assign\n // const [isMerchantAffiliateDetailSet, setIsMerchantAffiliateDetailSet] = useState(true)\n // const location = useLocation()\n // //if url has sepecific affiliateId then user is coming from box carrier\n // //and there policy and coverage is already selected\n // const searchParams = new URLSearchParams(location.search)\n // const carrier_AffiliateId = searchParams.get('affiliateId') || AffiliateID\n\n // const { data: merchantAffiliateDetails, isFetched, error } = useGetMerchantAffiliateDetails({ affiliateId: carrier_AffiliateId })\n // const merchantInfo = merchantAffiliateDetails?.data\n useEffect(() => {\n window.scrollTo(0, 0)\n }, [])\n // useEffect(() => {\n // if (isFetched && merchantAffiliateDetails) {\n // const boxUserPreSelectedPlan = {\n // ...quoteUserReg,\n // coverage: merchantInfo?.maxCoverage,\n // planId: merchantInfo?.id,\n // service: [merchantInfo?.primaryServiceId],\n // }\n // const boxCarrierDetails = {\n // companyLogo: merchantInfo?.comapnyLogo,\n // companyName: merchantInfo?.companyName,\n // companyWebsite: merchantInfo?.companyWebsite,\n // policyName: merchantInfo?.name,\n // }\n // setQuoteReview({\n // insurancePlan: {\n // label: merchantInfo.name,\n // value: merchantInfo.id,\n // premiumAmount: merchantInfo.basePremium,\n // maxCoverage: merchantInfo.maxCoverage,\n // primaryService: merchantInfo.primaryServiceId,\n // },\n // })\n // setQuoteUserReg(boxUserPreSelectedPlan)\n // setCarrierDetails(boxCarrierDetails)\n // setIsMerchantAffiliateDetailSet(false)\n // }\n // // eslint-disable-next-line react-hooks/exhaustive-deps\n // }, [isFetched, merchantAffiliateDetails])\n\n //if the user is coming from box carrier(specific carrier) then plan is preassigned and user is paid .only registration is required\n // const apiError = error instanceof AxiosError ? error.response?.data?.message : undefined\n // if (carrier_AffiliateId) {\n // if (stage === Stages.STAGE2) return \n // return (\n // \n // )\n // } else {\n if (stage === Stages.STAGE2) return \n else if (stage === Stages.STAGE3) return \n else if (stage === Stages.STAGE4) return \n else if (stage === Stages.STAGE5) return \n else if (stage === Stages.STAGE6) return \n else if (stage === Stages.STAGE7) return } />\n return \n // }\n}\n\nexport default GetAQuoteRegister\n","import GetAQuoteRegister from '../components/GetAQuoteRegister'\n\nconst GetAQuotes = () => {\n return \n}\nexport const QouteLayout = {\n 'backgroundImage': \"url('/images/bg-pattern.png')\",\n 'pt': '4.25rem',\n 'backgroundPosition': 'center',\n\n '@md': {\n pt: 0,\n },\n}\n\nexport default GetAQuotes\n","import { CardNumberElement, CardExpiryElement, CardCvcElement, useElements, useStripe } from '@stripe/react-stripe-js'\nimport { useState } from 'react'\nimport { styled } from 'styles'\nimport { StripeLabel } from 'features/incidents/components/style'\nimport { ErrorBox } from 'features/profile/components/EditProfileForm'\nimport { getUpperCase } from 'utils/function'\nimport { Button } from 'components/button'\nimport { Box, Flex } from 'components/elements'\nimport { useNavigate } from 'react-router'\nimport { routes } from 'configs/constants'\nimport { StripeInputProps } from 'features/quote/components/type'\nimport { StripePaymentStatus } from 'features/incidents/components/enums'\nimport { buttonCss } from 'features/quote/components/GetAQuoteProcess/CoveragePlan'\n\nexport const customInputStyle = {\n base: {\n 'fontSize': '16px',\n 'fontWeight': '700',\n 'lineHeight': '24px',\n 'color': 'white',\n '::placeholder': {\n color: '#A1A1A1',\n },\n },\n\n invalid: {\n color: '#FF0303',\n },\n}\n\nconst StripePayment = (props: StripeInputProps) => {\n const { onSubmit, isLoading, IsOpenInModal, handleCancel, isChangedCard } = props\n const stripe = useStripe()\n const elements = useElements()\n const [submitError, setSubmitError] = useState('')\n //Stripe Error handling\n const [fieldErrors, setFieldErrors] = useState({\n cardNumber: '',\n cardExpiry: '',\n cardCvc: '',\n })\n\n //\n /**\n * Handles the change of a field in the Stripe payment form.\n * Updates the error messages in the state.\n *\n * @param {string} field - The name of the field that changed.\n * @param {object} event - The event that triggered the change.\n * @param {object} event.error - The error object that contains the message.\n */\n const handleFieldChange = (field: string, event: { error?: { message: string } }) => {\n if (event.error) {\n // If there is an error, update the state with the error message\n setFieldErrors(prev => ({\n ...prev,\n [field]: event?.error?.message,\n }))\n } else {\n // If there is no error, clear the error message from the state\n setFieldErrors(prev => ({\n ...prev,\n [field]: '',\n }))\n }\n }\n\n const navigate = useNavigate()\n\n const handleSubmit = async (event: { preventDefault: () => void }) => {\n event.preventDefault()\n\n if (!stripe || !elements) {\n setSubmitError('Stripe.js or Elements is not available')\n return\n }\n // Ensure CardNumberElement, CardExpiryElement, and CardCvcElement are mounted\n const cardNumberElement = elements.getElement(CardNumberElement)\n const cardExpiryElement = elements.getElement(CardExpiryElement)\n const cardCvcElement = elements.getElement(CardCvcElement)\n if (!cardNumberElement || !cardExpiryElement || !cardCvcElement) {\n setSubmitError('One or more card elements are not mounted')\n return\n }\n\n const { paymentMethod, error } = await stripe.createPaymentMethod({\n type: 'card',\n card: cardNumberElement,\n })\n\n if (error && error.message) {\n setSubmitError(error.message)\n } else {\n // Explicitly type paymentMethod to avoid 'never' type\n const typedPaymentMethod = paymentMethod as { id?: string }\n\n if (typedPaymentMethod && typedPaymentMethod.id) {\n onSubmit(typedPaymentMethod.id)\n } else {\n // paymentMethod is undefined or doesn't have an 'id' property\n setSubmitError('Invalid payment method')\n }\n }\n }\n return (\n <>\n \n {!!submitError && {getUpperCase(submitError)}}\n\n Card Number\n\n handleFieldChange('cardNumber', event)}\n />\n\n {fieldErrors.cardNumber && {fieldErrors.cardNumber}}\n \n \n Expiry Date\n handleFieldChange('cardExpiry', event)} />\n {fieldErrors.cardExpiry && {fieldErrors.cardExpiry}}\n \n \n CVC\n handleFieldChange('cardCvc', event)} />\n {fieldErrors.cardCvc && {fieldErrors.cardCvc}}\n \n\n {IsOpenInModal ? (\n \n \n {isChangedCard ? (\n \n ) : (\n \n )}\n \n ) : (\n \n \n \n \n )}\n \n )\n}\nexport const StripeBox = styled('div', {\n '.Card': {\n padding: '0.75rem 1rem',\n width: '100%',\n },\n '.CardBorder': {\n 'background': '$white1A',\n 'borderRadius': '4px',\n '&.bg-succes': {\n border: '1px solid $border',\n },\n '&.bg-error': {\n border: '1px solid $error',\n },\n },\n '.Label': {\n marginBottom: '$2',\n },\n})\nconst StripeErrorBox = styled(ErrorBox, {\n textAlign: 'left',\n})\n\nexport default StripePayment\n","var V3_URL = 'https://js.stripe.com/v3';\nvar V3_URL_REGEX = /^https:\\/\\/js\\.stripe\\.com\\/v3\\/?(\\?.*)?$/;\nvar EXISTING_SCRIPT_MESSAGE = 'loadStripe.setLoadParameters was called but an existing Stripe.js script already exists in the document; existing script parameters will be used';\nvar findScript = function findScript() {\n var scripts = document.querySelectorAll(\"script[src^=\\\"\".concat(V3_URL, \"\\\"]\"));\n\n for (var i = 0; i < scripts.length; i++) {\n var script = scripts[i];\n\n if (!V3_URL_REGEX.test(script.src)) {\n continue;\n }\n\n return script;\n }\n\n return null;\n};\n\nvar injectScript = function injectScript(params) {\n var queryString = params && !params.advancedFraudSignals ? '?advancedFraudSignals=false' : '';\n var script = document.createElement('script');\n script.src = \"\".concat(V3_URL).concat(queryString);\n var headOrBody = document.head || document.body;\n\n if (!headOrBody) {\n throw new Error('Expected document.body not to be null. Stripe.js requires a element.');\n }\n\n headOrBody.appendChild(script);\n return script;\n};\n\nvar registerWrapper = function registerWrapper(stripe, startTime) {\n if (!stripe || !stripe._registerWrapper) {\n return;\n }\n\n stripe._registerWrapper({\n name: 'stripe-js',\n version: \"2.3.0\",\n startTime: startTime\n });\n};\n\nvar stripePromise = null;\nvar onErrorListener = null;\nvar onLoadListener = null;\n\nvar onError = function onError(reject) {\n return function () {\n reject(new Error('Failed to load Stripe.js'));\n };\n};\n\nvar onLoad = function onLoad(resolve, reject) {\n return function () {\n if (window.Stripe) {\n resolve(window.Stripe);\n } else {\n reject(new Error('Stripe.js not available'));\n }\n };\n};\n\nvar loadScript = function loadScript(params) {\n // Ensure that we only attempt to load Stripe.js at most once\n if (stripePromise !== null) {\n return stripePromise;\n }\n\n stripePromise = new Promise(function (resolve, reject) {\n if (typeof window === 'undefined' || typeof document === 'undefined') {\n // Resolve to null when imported server side. This makes the module\n // safe to import in an isomorphic code base.\n resolve(null);\n return;\n }\n\n if (window.Stripe && params) {\n console.warn(EXISTING_SCRIPT_MESSAGE);\n }\n\n if (window.Stripe) {\n resolve(window.Stripe);\n return;\n }\n\n try {\n var script = findScript();\n\n if (script && params) {\n console.warn(EXISTING_SCRIPT_MESSAGE);\n } else if (!script) {\n script = injectScript(params);\n } else if (script && onLoadListener !== null && onErrorListener !== null) {\n var _script$parentNode;\n\n // remove event listeners\n script.removeEventListener('load', onLoadListener);\n script.removeEventListener('error', onErrorListener); // if script exists, but we are reloading due to an error,\n // reload script to trigger 'load' event\n\n (_script$parentNode = script.parentNode) === null || _script$parentNode === void 0 ? void 0 : _script$parentNode.removeChild(script);\n script = injectScript(params);\n }\n\n onLoadListener = onLoad(resolve, reject);\n onErrorListener = onError(reject);\n script.addEventListener('load', onLoadListener);\n script.addEventListener('error', onErrorListener);\n } catch (error) {\n reject(error);\n return;\n }\n }); // Resets stripePromise on error\n\n return stripePromise[\"catch\"](function (error) {\n stripePromise = null;\n return Promise.reject(error);\n });\n};\nvar initStripe = function initStripe(maybeStripe, args, startTime) {\n if (maybeStripe === null) {\n return null;\n }\n\n var stripe = maybeStripe.apply(undefined, args);\n registerWrapper(stripe, startTime);\n return stripe;\n}; // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types\n\nvar stripePromise$1;\nvar loadCalled = false;\n\nvar getStripePromise = function getStripePromise() {\n if (stripePromise$1) {\n return stripePromise$1;\n }\n\n stripePromise$1 = loadScript(null)[\"catch\"](function (error) {\n // clear cache on error\n stripePromise$1 = null;\n return Promise.reject(error);\n });\n return stripePromise$1;\n}; // Execute our own script injection after a tick to give users time to do their\n// own script injection.\n\n\nPromise.resolve().then(function () {\n return getStripePromise();\n})[\"catch\"](function (error) {\n if (!loadCalled) {\n console.warn(error);\n }\n});\nvar loadStripe = function loadStripe() {\n for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {\n args[_key] = arguments[_key];\n }\n\n loadCalled = true;\n var startTime = Date.now(); // if previous attempts are unsuccessful, will re-load script\n\n return getStripePromise().then(function (maybeStripe) {\n return initStripe(maybeStripe, args, startTime);\n });\n};\n\nexport { loadStripe };\n","import { loadStripe } from '@stripe/stripe-js'\nimport { Elements } from '@stripe/react-stripe-js'\nimport { StripeComponentProps } from 'features/quote/components/type'\nimport { StripPublicKey } from 'configs/constants'\nexport const stripePromise = loadStripe(StripPublicKey)\n\nconst StripeComponent: React.FC = ({ WrappedComponent }) => {\n return (\n \n \n \n )\n}\n\nexport default StripeComponent\n","import { useContext } from 'react'\nimport { AuthContext } from 'contexts/AuthContext'\n\nexport default function useAuth() {\n const context = useContext(AuthContext)\n if (!context) {\n throw new Error(`useAuth must be used within an AuthProvider`)\n }\n return context\n}\n","import Axios, { AxiosRequestConfig } from 'axios'\nimport { API_URL } from 'configs/constants'\nimport storage from 'utils/storage'\nimport { queryClient } from './react-query'\n// import { useNotificationStore } from '@/stores/notifications';\n\nexport const axios = Axios.create({\n baseURL: API_URL,\n})\n\nconst authRequestInterceptor = (config: AxiosRequestConfig) => {\n const token = storage.getToken()\n const newConfig = { ...config } // Clone the config object\n if (!newConfig.headers) {\n newConfig.headers = {}\n }\n if (token) {\n newConfig.headers.authorization = `${token}`\n }\n newConfig.headers.accept = 'application/json'\n newConfig.headers['ngrok-skip-browser-warning'] = '69420'\n return newConfig\n}\n\naxios.interceptors.request.use(authRequestInterceptor)\n\naxios.interceptors.response.use(\n response => {\n return response.data\n },\n error => {\n const status = error.response?.status || 200\n\n if (status === 401) {\n storage.clearToken()\n queryClient.clear()\n }\n return Promise.reject(error)\n }\n)\n","import { QueryClient } from '@tanstack/react-query'\n\nexport const queryClient = new QueryClient({\n defaultOptions: {\n queries: {\n refetchOnWindowFocus: false,\n // useErrorBoundary: true,\n retry: false,\n },\n },\n})\n","import { globalCss } from './stitches.config'\n\nexport const globalStyles = globalCss({\n 'html': {\n fontSize: '16px',\n boxSizing: 'border-box',\n colorScheme: 'dark',\n },\n '*, *:before, *:after': {\n boxSizing: 'inherit',\n },\n 'body': {\n margin: 0,\n padding: 0,\n backgroundColor: '$background',\n fontFamily: '$inter',\n color: '$text',\n WebkitFontSmoothing: 'antialiased',\n MozOsxFontSmoothing: 'grayscale',\n textRendering: 'optimizeLegibility',\n overFlowX: 'hidden',\n },\n '.overflow--hidden': {\n 'overflow': 'hidden',\n '&--modal': {\n overflow: 'hidden !important',\n },\n\n '@md': {\n overflow: 'visible',\n },\n },\n 'h1, h2, h3, h4, h5, h6': {\n margin: '0 0 1rem',\n },\n 'h2, h3, h4, h5, h6': {\n fontFamily: '$inter',\n },\n 'h1': {\n fontSize: '$2xl',\n fontWeight: '$semibold',\n lineHeight: 1,\n },\n 'h2': {\n fontSize: '$xl',\n fontWeight: '$semibold',\n lineHeight: 1,\n },\n 'h3': {\n fontSize: '$lg',\n fontWeight: '$semibold',\n lineHeight: 2,\n },\n 'h4': {\n fontSize: '$base',\n fontWeight: '$semibold',\n lineHeight: 1.5,\n },\n 'h5': {\n fontSize: '$sm',\n fontWeight: '$semibold',\n lineHeight: 1.25,\n },\n 'p': {\n 'fontFamily': '$inter',\n 'fontSize': '$base',\n 'fontWeight': '$normal',\n 'lineHeight': 1.5,\n 'margin': '0 0 1rem',\n\n '&.small': {\n fontSize: '$sm',\n },\n },\n 'a, span': {\n fontFamily: '$inter',\n fontSize: '$base',\n color: '$white',\n fontWeight: '$normal',\n lineHeight: 1.5,\n textDecoration: 'none',\n margin: '0',\n },\n 'b': {\n fontFamily: '$inter',\n fontSize: '$base',\n fontWeight: '$semibold',\n lineHeight: 1.5,\n margin: '0 0 1rem',\n },\n 'button': {\n fontFamily: '$grotesk !important',\n fontWeight: '$medium',\n padding: 0,\n border: 'none',\n cursor: 'pointer',\n },\n 'th': {\n fontWeight: 500,\n },\n 'img': {\n maxWidth: '100%',\n },\n 'video': {\n maxWidth: '100%',\n },\n '.primary': {\n color: '$primary',\n },\n '.gray3': {\n color: '$gray3',\n },\n '.fontBold': {\n fontWeight: '$bold',\n },\n '.sr-only': {\n position: 'absolute',\n border: 0,\n width: 1,\n height: 1,\n padding: 0,\n margin: -1,\n overflow: 'hidden',\n clip: 'rect(0,0,0,0)',\n },\n // controversial way to do this\n '#root': {\n maxWidth: '1920px',\n margin: '0 auto',\n },\n // TODO: improve and limit the scope of these styles\n [`.MuiTypography-root, \n .MuiIconButton-root, \n .MuiClockNumber-root, \n .MuiPickersCalendarHeader-label,\n .MuiPickersDay-root, \n .MuiMenuItem-root`]: {\n fontFamily: '$grotesk !important',\n color: '$gray5 !important',\n },\n '.MuiTablePagination-root': {\n '.MuiTablePagination-selectLabel, .MuiTablePagination-displayedRows': {\n marginBottom: 0,\n },\n },\n '.MuiChip-root': {\n '&.MuiChip-colorDefault': {\n 'background': '$chipGradient',\n 'padding': '0.3rem 0.1rem',\n 'borderRadius': '0.5rem',\n 'height': 'auto',\n\n 'svg.MuiChip-avatar': {\n color: '$primary',\n },\n },\n '&.MuiChip-outlined': {\n padding: 0,\n borderColor: '$primary',\n background: '$aboutGradient',\n },\n },\n '.MuiCardMedia-root': {\n '&.MuiCardMedia-media': {\n '&.custom-class': {\n '@sm': {\n maxWidth: '500px',\n width: 'auto',\n },\n },\n },\n },\n '.MuiTabs': {\n '&-root': {\n '.MuiButtonBase-root': {\n 'display': 'grid',\n 'minHeight': 'auto',\n 'color': '$white',\n 'border': '1px solid',\n 'borderColor': '$primary',\n 'borderRadius': 8,\n 'transition': 'background .2s',\n 'fontFamily': '$inter',\n 'fontWeight': '$normal',\n 'fontSize': '1rem',\n\n '&.Mui-selected': {\n color: '$white',\n background: '$primary',\n },\n },\n '.MuiTabs-flexContainer': {\n paddingBottom: 4,\n gap: 10,\n flexWrap: 'wrap',\n },\n },\n '&-indicator': {\n display: 'none',\n },\n },\n '.MuiPaper-root, .MuiPickersDay-root': {\n 'backgroundColor': '$blue5 !important',\n\n '&.MuiAlert-filled': {\n position: 'relative',\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'center',\n padding: '1.5rem 1.5rem 2rem !important',\n borderRadius: '.75rem !important',\n minWidth: 300,\n },\n\n '.MuiAlert-icon': {\n order: 2,\n margin: 0,\n padding: '0 0 1rem',\n\n svg: {\n width: '3.75rem',\n height: '3.75rem',\n },\n },\n '.MuiAlert-message': {\n padding: 0,\n textAlign: 'center',\n order: 3,\n },\n '.MuiAlert-action': {\n 'padding': 0,\n\n '.MuiButtonBase-root': {\n 'marginTop': -8,\n\n '.MuiSvgIcon-root': {\n path: {\n fill: '$white',\n },\n },\n },\n },\n },\n '.MuiClock-pin, .MuiClockPointer-root': {\n backgroundColor: '$primaryLight !important',\n },\n '.MuiClockPointer-thumb': {\n backgroundColor: '$primary !important',\n borderColor: '$primary !important',\n },\n '.MuiButton-text': {\n fontFamily: '$grotesk !important',\n fontSize: '0.875rem !important',\n fontWeight: '$medium !important',\n color: '$primary !important',\n },\n '.MuiPickersToolbar-content .Mui-selected': {\n borderRadius: 8,\n backgroundColor: '$background !important',\n padding: 5,\n },\n '.MuiPickersDay-today': {\n color: '$primary !important',\n borderColor: '$primary !important',\n },\n '.MuiPickersDay-root.Mui-selected': {\n backgroundColor: '$primary !important',\n },\n '.dropdown': {\n '&Width': {\n 'left': '0 !important',\n 'right': '0 !important',\n 'borderRadius': '.5rem',\n 'zIndex': 10,\n 'maxHeight': 300,\n 'overflow': 'overlay',\n\n '&::-webkit-scrollbar': {\n width: '4px',\n },\n\n '&::-webkit-scrollbar-track': {\n background: 'transparent',\n borderRadius: '2px',\n },\n\n '&::-webkit-scrollbar-thumb': {\n background: '$white',\n borderRadius: '2px',\n },\n\n '.MuiPaper-root': {\n backgroundColor: 'transparent',\n },\n },\n '&List': {\n 'color': '$white',\n 'padding': '.75rem 1rem',\n 'cursor': 'pointer',\n '&:hover': {\n backgroundColor: '$background40',\n },\n },\n\n '&-hidden': {\n position: 'absolute',\n top: '-9999px',\n zIndex: '-10',\n },\n },\n '.table--mobile': {\n 'border': 'none !important',\n\n 'tbody': {\n display: 'flex',\n flexWrap: 'wrap',\n },\n 'tr': {\n display: 'flex',\n flexDirection: 'column',\n width: '100%',\n border: '1px solid $gray8',\n borderRadius: 14,\n mb: '1rem',\n\n td: {\n display: 'flex',\n justifyContent: 'space-between',\n alignItems: 'center',\n },\n },\n '.detail--view': {\n width: '100%',\n justifyContent: 'space-between',\n },\n },\n 'tr.expanded': {\n 'background': '$background',\n 'position': 'fixed',\n 'top': 0,\n 'left': 0,\n 'right': 0,\n 'bottom': 0,\n 'zIndex': 10,\n 'overflowY': 'auto',\n 'margin': 0,\n 'borderRadius': 0,\n 'border': 0,\n\n '.back--button': {\n justifyContent: 'unset',\n p: '1.5rem',\n width: '100%',\n borderRadius: '0 0 8px 8px',\n background: '$aboutGradient',\n boxShadow: '0 1px 0 $white66',\n },\n '&--bg-color': {\n //directly assign bcz of safari\n background: '-webkit-linear-gradient( 90.18deg, #32385B 0%, #1A1F41 100%)',\n },\n '.detail-box': {\n 'border': 0,\n 'width': '100%',\n 'height': '100%',\n 'p': 0,\n\n '@md': {\n padding: '2rem 0px 1rem',\n },\n },\n '.detail-container': {\n 'padding': '1.5rem',\n\n '@md': {\n padding: '0 4rem',\n },\n },\n '@md': {\n //directly assign bcz of safari\n background: '-webkit-linear-gradient( 90.18deg, #32385B 0%, #1A1F41 100%)',\n position: 'static',\n height: 'auto',\n },\n },\n '.minWidth': {\n '&-50': {\n minWidth: '50px',\n },\n '&-75': {\n minWidth: '75px',\n },\n '&-100': {\n minWidth: '100px',\n },\n '&-125': {\n minWidth: '125px',\n },\n '&-150': {\n minWidth: '150px',\n },\n '&-175': {\n minWidth: '175px',\n },\n '&-200': {\n minWidth: '200px',\n },\n '&-225': {\n minWidth: '225px',\n },\n '&-250': {\n minWidth: '250px',\n },\n },\n '.success': {\n 'color': '$green',\n '&Bg': {\n 'color': '$green',\n 'background': '$green33',\n '&--only': {\n background: '$green33',\n },\n },\n 'path': {\n fill: '$green',\n },\n },\n '.info': {\n 'color': '$blue1',\n '&Bg': {\n 'color': '$blue1',\n 'background': '$blue33',\n '&--only': {\n background: '$blue33',\n },\n },\n 'path': {\n fill: '$blue1',\n },\n },\n '.warning': {\n 'color': '$yellow',\n '&Bg': {\n 'color': '$yellow',\n 'background': '$yellow33',\n '&--only': {\n background: '$yellow33',\n },\n },\n 'path': {\n fill: '$yellow',\n },\n },\n '.error': {\n 'color': '$red',\n '&Bg': {\n 'color': '$red',\n 'background': '$red33',\n '&--only': {\n background: '$red33',\n },\n },\n 'path': {\n fill: '$red',\n },\n },\n '.primarys': {\n 'color': '$primary',\n '&Bg': {\n 'color': '$white',\n 'background': '$primary',\n '&--only': {\n background: '$primary',\n },\n },\n 'path': {\n fill: '$red',\n },\n },\n '#tempContainer': {\n '.stepperBox': {\n padding: '0 0 1rem',\n },\n },\n '.social-icons': {\n 'columnGap': '.5rem',\n 'padding': '1rem 0',\n\n 'button': {\n 'background': '$downloadGradient',\n 'padding': '.25rem',\n 'borderRadius': 6,\n '&:hover': {\n background: '$offcanvasGradient',\n },\n },\n '&.icons-details': {\n button: {\n 'background': '$offcanvasGradient',\n '&:hover': {\n background: '$white10',\n },\n },\n },\n },\n})\n","import type * as Stitches from '@stitches/react'\n\nconst grayDark = {\n gray1: '#333333',\n gray2: '#4F4F4F',\n gray3: '#828282',\n gray4: '#BDBDBD',\n gray5: '#E0E0E0',\n gray6: '#434554',\n gray7: '#7B7979',\n gray8: '#524F4F',\n gray9: '#303742',\n gray10: '#3d3f4e',\n gray11: '#d9d9d9',\n gray12: '#5B5B5B',\n gray13: '#0000001A',\n gray14: '#524F4F1A',\n gray15: '#f7f8f9b0',\n gray16: '#999999',\n}\nconst blueDark = {\n blue1: '#2F80ED',\n blue2: '#32385b50',\n blue3: '#4a4e6a',\n blue4: '#94A3B8',\n blue5: '#32385b',\n blue6: '#1F2545',\n blue33: '#2F80ED33',\n blue7: '#373946CC',\n}\nconst greenDark = {\n green: '#27AE60',\n green1: '#52C41A',\n green33: '#27AE6033',\n green4: '#36A010',\n}\nconst yellowDark = {\n yellow: '#E2B93B',\n yellow1: '#f9c50d',\n yellow33: '#E2B93B33',\n yellow2: '#FFCE1E',\n}\nconst redDark = {\n red: '#EB5757',\n red33: '#EB575733',\n}\nconst purpleDark = {\n purple: '#7b2cbf',\n}\nconst brownDark = {\n brown: '#6c3f3f',\n}\n\nexport const defaultTokens = {\n colors: {\n // generic colors\n white: '#ffffff',\n white5: '#FFFFFF0D',\n white10: '#ffffff10',\n white1A: '#ffffff1a',\n white66: '#ffffff66',\n white77: '#F7F8F9',\n black: '#04000A',\n black00: '#000000',\n black33: '#00000033',\n black40: '#00000040',\n black39: '#2D2D39',\n black80: '#00000080',\n background: '#0D1023',\n foreground: '$white',\n //semantic colors\n ...grayDark,\n ...blueDark,\n ...greenDark,\n ...redDark,\n ...yellowDark,\n ...purpleDark,\n ...brownDark,\n // brand colors\n primaryLight: '#E9D16B',\n primary: '#B79313',\n primary10: '#B7931310',\n primaryMain: '#FCCA00',\n primaryBorder: '#FF9E00',\n primaryHover: '#917205',\n primaryNew: '#FCCA00',\n advantage: '#FFAB00',\n error: '#FF0D0D',\n success500: '#10B981',\n // misc\n text: '$white',\n textSubtle: '$gray4',\n textDim: '$gray5',\n link: '$blue700',\n border: '#F1F5F9',\n border1: 'rgba(255, 255, 255, 0.70)',\n beigeBackGround: ' rgba(235, 87, 87, 0.20)',\n\n linearGradientBlue: '153.32deg, rgba(255, 255, 255, 0.3) -65.62%, rgba(255, 255, 255, 0.1) 83.28%',\n linearGradientGray: `90deg, rgba(217, 217, 217, 0.1) 0%, rgba(217, 217, 217, 0) 100%`,\n linearGradientYellow: `153.32deg, $primary -65.62%, rgba(233, 209, 107, 0.1) 83.28%`,\n cardGradient: 'linear-gradient($linearGradientBlue)',\n gradientYellow: `linear-gradient(300.96deg, $primary 18.75%, rgba(183, 147, 19, 0.3) 81.54%)`,\n gradientBlue: 'linear-gradient(90deg, rgba(42, 38, 75, 0) 1.34%, #58C3FF 100%)',\n gradientYellowReverse: 'linear-gradient(296.15deg, $primary 16.47%, rgba(183, 147, 19, 0.3) 53.84%)',\n gradientGray: 'linear-gradient($linearGradientGray)',\n borderGradient: `linear-gradient(\n 142.08deg, \n rgba(255, 255, 255, 0.7) -5.03%, \n rgba(188, 188, 188, 0.85) 21.3%, \n rgba(13, 16, 35, 0.2) 49.04%, \n rgba(187, 187, 187, 0.5) 70.19%)`,\n multiGradient: `$linearGradientYellow, $borderGradient`,\n aboutGradient: `linear-gradient(90.18deg, rgba(50, 56, 91, 0.57) 0%, rgba(26, 31, 65, 0.57) 100%)`,\n chipGradient: `linear-gradient(90.18deg, rgba(50, 56, 91, 1) 0%, rgba(26, 31, 65, 1) 100%)`,\n downloadGradient: `linear-gradient( 90.18deg, $background 0%, $background 15%)`,\n transparentGradient: `linear-gradient(90deg, rgba(255, 255, 255, 0.065) 0%, rgba(255, 255, 255, 0) 103.76%)`,\n\n offcanvasGradient: `linear-gradient(\n 90.18deg, \n #32385B 0%, #1A1F41 100%)`,\n bgPatternGradient: `radial-gradient(\n 30.8% 30.8% at 57.79% 54.71%, \n rgba(43, 24, 103, 0.2) 0%, \n rgba(56, 35, 131, 0.2) 48.71%, \n rgba(69, 40, 150, 0.2) 78.16%, \n rgba(118, 36, 142, 0.2) 100%)`,\n bgPatternGradient1: `radial-gradient(41.68% 41.68% at 57.79% 54.71%, rgba(43, 24, 103, 0.20) 0%, rgba(56, 35, 131, 0.20) 48.71%, rgba(69, 40, 150, 0.20) 78.16%, rgba(118, 36, 142, 0.20) 100%)`,\n accordionBg: 'linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(171, 171, 171, 0.06) 100%) ',\n accordionTitle: '#EBEBEB',\n accordionContent: '#D1D1D1',\n },\n fonts: {\n grotesk: 'Space Grotesk',\n inter: 'Inter',\n lexend: \"'Lexend Deca', sans-serif\",\n },\n fontSizes: {\n 'xs': '0.75rem',\n 'sm': '0.875rem',\n 'base': '1rem',\n 'md': '1.15rem',\n 'lg': '1.25rem',\n 'xl': '1.5rem',\n '1xl': '1.75rem',\n '2xl': '2rem',\n '3xl': '2.25rem',\n '3xxl': '2.5rem',\n '4xl': '3rem',\n },\n fontWeights: {\n light: 300,\n normal: 400,\n medium: 500,\n semibold: 600,\n bold: 700,\n },\n lineHeights: {},\n letterSpacings: {},\n radii: {\n sm: '4px',\n xsm: '5px',\n md: '8px',\n base: '12px',\n lg: '14px',\n xl: '18px',\n squared: '33%',\n rounded: '50%',\n pill: '50%',\n },\n space: {\n 1: '4px',\n 2: '8px',\n 3: '12px',\n 4: '16px',\n 5: '24px',\n 6: '32px',\n 7: '38px',\n 8: '48px',\n 10: '64px',\n 12: '80px',\n 13: '100px',\n 14: '120px',\n 20: '20px',\n 30: '30px',\n 40: '40px',\n 50: '50px',\n headerHeight: '61px',\n sidebarWidth: '300px',\n },\n sizes: {\n 1: '4px',\n 2: '8px',\n 3: '12px',\n },\n shadows: {\n md: '0px 4px 24px -1px $black33',\n },\n}\n\nexport const defaultUtils = {\n bg: (value: Stitches.PropertyValue<'backgroundColor'>) => ({\n background: value,\n }),\n bgImage: (value: Stitches.PropertyValue<'backgroundColor'>) => ({\n backgroundImage: value,\n }),\n bgColor: (value: Stitches.PropertyValue<'backgroundColor'>) => ({\n backgroundColor: value,\n }),\n\n dflex: (value: Stitches.PropertyValue<'alignItems'>) => ({\n display: 'flex',\n alignItems: value,\n justifyContent: value,\n }),\n\n p: (value: Stitches.PropertyValue<'padding'>) => ({\n padding: value,\n }),\n pt: (value: Stitches.PropertyValue<'paddingTop'>) => ({\n paddingTop: value,\n }),\n pr: (value: Stitches.PropertyValue<'paddingRight'>) => ({\n paddingRight: value,\n }),\n pb: (value: Stitches.PropertyValue<'paddingBottom'>) => ({\n paddingBottom: value,\n }),\n pl: (value: Stitches.PropertyValue<'paddingLeft'>) => ({\n paddingLeft: value,\n }),\n px: (value: Stitches.PropertyValue<'paddingLeft'>) => ({\n paddingLeft: value,\n paddingRight: value,\n }),\n py: (value: Stitches.PropertyValue<'paddingTop'>) => ({\n paddingTop: value,\n paddingBottom: value,\n }),\n\n m: (value: Stitches.PropertyValue<'margin'>) => ({\n margin: value,\n }),\n mt: (value: Stitches.PropertyValue<'marginTop'>) => ({\n marginTop: value,\n }),\n mr: (value: Stitches.PropertyValue<'marginRight'>) => ({\n marginRight: value,\n }),\n mb: (value: Stitches.PropertyValue<'marginBottom'>) => ({\n marginBottom: value,\n }),\n ml: (value: Stitches.PropertyValue<'marginLeft'>) => ({\n marginLeft: value,\n }),\n mx: (value: Stitches.PropertyValue<'marginLeft'>) => ({\n marginLeft: value,\n marginRight: value,\n }),\n my: (value: Stitches.PropertyValue<'marginTop'>) => ({\n marginTop: value,\n marginBottom: value,\n }),\n\n size: (value: Stitches.PropertyValue<'width'>) => ({\n width: value,\n height: value,\n }),\n\n linearGradient: (value: Stitches.PropertyValue<'backgroundImage'>) => ({\n backgroundImage: `linear-gradient(${value})`,\n }),\n textGradient: (value: Stitches.PropertyValue<'backgroundImage'>) => ({\n 'backgroundImage': `linear-gradient(${value})`,\n 'WebkitBackgroundClip': 'text',\n 'WebkitTextFillColor': 'transparent',\n '&::selection': {\n WebkitTextFillColor: '$colors$text',\n },\n }),\n}\n\nconst commonTheme = {\n theme: defaultTokens,\n media: {\n xxs: '(min-width: 320px)',\n xs: '(min-width: 475px)',\n sm: '(min-width: 600px)',\n bssm: '(min-width: 769px)',\n md: '(min-width: 991px)',\n lg: '(min-width: 1199px)',\n xl: '(min-width: 1399px)',\n motion: '(prefers-reduced-motion)',\n hover: '(any-hover: hover)',\n dark: '(prefers-color-scheme: dark)',\n light: '(prefers-color-scheme: light)',\n },\n utils: defaultUtils,\n}\n\nexport default commonTheme\n","import { createStitches } from '@stitches/react'\nimport type * as Stitches from '@stitches/react'\nimport commonTheme from './common'\n\nexport const { theme, styled, keyframes, createTheme, globalCss, css, getCssText, config } = createStitches(commonTheme)\n\nexport type CSS = Stitches.CSS\nexport type VariantProps = Stitches.VariantProps\nexport type StitchesTheme = typeof theme\n","export const endpoints = {\n removeSentinelKey: '/user/sentinel',\n userProfile: '/user/profile',\n setPassword: '/user/set/password',\n addComment: '/comments/add',\n getComment: 'comments/',\n addInsuranceRequests: '/insurance/requests/add',\n removeComment: 'comments/remove',\n updateComment: 'comments/update',\n supportRequest: 'support/request/add',\n getPolicies: 'user/insurance/plans/current',\n getFeatures: 'user/insurance/plans/policies',\n cancelPolicies: 'user/insurance/plans/withdraw',\n claimRaised: 'claim/request/raised',\n reEvaluationRequest: 'claim/request/confirmation',\n getClaimRequest: 'claim/request',\n getPreviousPolicyList: 'user/insurance/plans',\n getResolvedClaimsInPlanHistory: 'user/insurance/plans/claims',\n getThreatChainTransaction: 'threats/user/chain/hash',\n plansPayment: 'user/insurance/plans/payment',\n addClaimManually: 'claim/request/manually',\n addScoreCard: 'domain/security/score/add/request',\n connectRequest: 'admin/connection/request',\n getBlog: 'blog/',\n blogEmojiReaction: 'blog/emoji/reaction',\n signupByQuote: 'user/quote/registration',\n servicesListing: 'user/services/list',\n submitRegReq: 'user/registration/request',\n getPlanForQuote: 'insurance/plans/listing/for/quote',\n getUserQuote: 'user/quote/registration',\n addService: 'user/insurance/plans/add/service',\n activateCoveActivation: 'user/activate/cove',\n getCoveThreatLisiting: 'cove/threats/user/listing',\n getCoveClaimRequest: 'cove/claim/request',\n coveReEvaluationRequest: 'cove/claim/request/confirmation',\n claimRaisedCove: 'cove/claim/request/raised',\n changePolicy: 'user/insurance/plans/change',\n activatePatchService: 'user/activate/patch',\n //patch\n getNSightPatchThreatLisiting: 'patch/threats/user/listing',\n getNSightPatchClaimRequest: 'patch/claim/request',\n NSightPatchReEvaluationRequest: 'patch/claim/request/confirmation',\n claimRaisedNSightPatch: 'patch/claim/request/raised',\n deactivateCove: 'user/deactivate/cove',\n deactivateNSight: 'user/deactivate/patch',\n changePaymentMethod: 'user/add/payment/method',\n addUserRegPayment: 'user/registration/payment',\n //base on primary Service\n incidentsApplicableCount: 'user/applicable/count',\n merchantAffiliateDetails: 'merchants/affiliate/details',\n MISP_API: '/misp',\n LossRunRation: 'threats/loss',\n BitSightReport: 'user/download/report',\n getCountryList: 'https://valid.layercode.workers.dev/list/countries?format=select&flags=true&value=code',\n}\n","export enum ROUTE_ENUM {\n HOME_ROUTE = '/',\n LOGIN_ROUTE = '/login',\n SIGNUP_ROUTE = '/signup',\n FORGOT = '/forgot',\n SET_PASSWORD = '/set-password',\n TWOFA = '/two-fa',\n}\n\nexport enum FIELD_ICON_POSITION_ENUM {\n LEFT = 'left',\n RIGHT = 'right',\n}\n\nexport enum PHONE_VALIDATION {\n PHONEERROR = 'Please enter valid area code',\n}\nexport enum FORM_FIELD_TYPE_ENUM {\n EMAIL = 'email',\n PASSWORD = 'password',\n TEXT = 'text',\n SELECT = 'select',\n CHECKBOX = 'checkbox',\n RADIO = 'radio',\n NUMBER = 'number',\n}\n\nexport const MESSAGE_ENUM = {\n SENTINEL_REGISTERATION: 'We are fetching your data and it may take some time',\n ERROR_MESSAGE: 'DLT Server is facing some temporary issue, please try again later',\n VERIFICATION_LINK: 'to login to your account please verify your account. we have sent a verification link to your registered email',\n}\n\nexport enum ValidationErrors {\n NAME = 'Name is required',\n Message = 'Message is required',\n EMAIL_VALIDATION = 'Email must be a valid email address',\n EMAIL = 'Email is required',\n WEBSITE_URL = 'Website URL is required',\n WEBSITE_URL_VALIDATION = 'Please provide a valid website url',\n INSURANCE_COMPANY = 'Insurance Company is required',\n PORTFOLIO_NUMBER = 'Portfolio number is required',\n DESCRIPTION = 'Description is required',\n ISSUE_NAME = 'Issue name is required',\n COMPANY = 'Company name is required',\n COMPANY_URL = 'Company url is required',\n ADDRESS = 'Address is required',\n PASSWORD = 'Password is required',\n PHONE = 'Phone number is required',\n PHONE_VALIDATION = 'Phone number start with + followed by the country code with 10 digits',\n MATCH_PASSWORD = 'Passwords must match',\n CONFIRM_PASSWORD = 'Confirm password is required',\n DEFAULT = 'Failed to register, Please try again.',\n PASSWORD_VALIDATION = 'Must Contain 8 Characters, One Uppercase, One Lowercase, One Number and One Special Case Character',\n OLD_PASSWORD = 'Old password is required',\n NEW_PASSWORD = 'New password is required',\n FIRST_NAME = 'First name is required',\n LAST_NAME = 'Last name is required',\n FIRST_NAME_VALIDATION = 'First name must have only alphabet shorter than or equal to 10 characters ',\n LAST_NAME_VALIDATION = 'Last name must have only alphabet shorter than or equal to 10 characters ',\n WHITE_SPACE = 'White space not allowed',\n NO_WHITE_SPACE = 'No white space is allowed',\n ADDRESS_VALIDATION = 'Address at least have 5, but not more than 100 characters',\n COMPANY_NAME = 'Company name is required',\n COMPANY_NAME_VALIDATION = 'Company name must have only alphabets',\n SENTINEL = 'Sentinel One API Key is required',\n START_TIME = 'Start time is required',\n TITLE = 'Title is required',\n NO_DEVICES = 'Number of devices is required',\n TIME = 'Time is required',\n DATE = 'Date is required',\n TIME_ZONE = 'Time Zone is required',\n COMMUNICATION_MEDIUM = 'Communication Medium is required',\n COVERAGE_PLAN = 'Please select one of the Ransomeware Coverage options',\n TC = 'Please agree to the terms and conditions',\n SERVICESOPTIONS = 'Please select at least on of the services',\n QuotePolicy = 'Please select one of the policy',\n ADD_SERVICE = 'Please select one of the services',\n USER_NAME = 'Username is required',\n Patch = 'N-Sight-Patch Managment API Key is required',\n SUPPORT_FORM_ERROR = 'At least one service must be selected',\n FILE_DUPLICATION = 'Duplicate file found. Please resolve before submitting.',\n SENTINELONE_URL = 'Sentinel One URL is required',\n SENTINELONE_URL_VALIDATION = 'Sentinel One URL must be a valid URL',\n REQUIRED = 'This field is required',\n CostPerInfected_TYPEERROR = 'Cost Per Infected EndPoints must be a number',\n CostPerInfected_POSITIVE = 'Cost Per Infected EndPoints must be greater than zero',\n ANNUAL_REVENUE_TYPEERROR = 'Annual Revenue must be a number',\n ANNUAL_REVENUE_POSITIVE = 'Annual Revenue must be greater than zero',\n COUNTRY_NAME = 'Country is required',\n SECTOR = 'Industry is required',\n}\n\nexport enum NotificationMessages {\n PASSWORD_UPDATE_SUCCESS = 'Password updated successfully',\n PROFILE_UPDATE_SUCCESS = 'Profile updated successfully',\n PASSWORD_SET_SUCCESS = 'Password set successfully',\n INSURANCE_FORM_SUCCESS = 'Insurance form submitted successfully',\n SENTINEL_DELETE_SUCCESS = 'Sentinel One API Key deleted',\n SENTINEL_KEY_UPDATE = 'Sentinel key updated successfully',\n RESEND_LINK = 'Verification email sent successfully',\n COMMENT_DELETE = 'Comment deleted successfully',\n COMMENT_EDIT = 'Comment edited successfully',\n SUPPORT_FORM = 'Contact us form submitted sucessfully',\n INITIATE_CLAIM = 'Initiate claim successfully',\n REEVALUATE_CLAIM = 'Re-evaluate claim successfully',\n ACCEPT_CLAIM = 'Claim has been accepted',\n SENTINEL_KEY = 'Sentinel one connected successfully',\n GETAQUOTE = 'Make sure you save else you lose the data with in 10 secs',\n ScoreCard = 'Score Card Added Successfully',\n MANUAL_CLAIM = 'Your manual claim request is submitted successfully',\n QUOTE_SAVE = 'Information saved successfully',\n QUOTE_SUBMIT = 'Get A Quote form submitted successfully',\n CONNECTION_REQUEST = 'Connect Request sent successfully',\n USER_QUOTE_REGISTRATION = 'Your Submission is successfully saved',\n USER_QUOTE_SUPPORT = 'Thank you for your response. Someone from our support team will reach out to you for your query.',\n DISCOUNT = '% Discount Applied',\n RECORD_FOUND = 'Please continue to with rest of the registration information',\n NO_POLICY_EXIST = 'No active policy exist yet',\n REQ_FORM_ERROR = 'You have already saved some information please continue with that.',\n ADD_SERVICE = 'Service Added Successfully',\n COVE = 'Cove Connected Successfully',\n CHANGE_POLICY = 'Policy Changed Successfully',\n Patch_N_Sight = ' N Sight patch Connected Successfully',\n Service_Deactivated = 'Service Disconnected Successfully',\n Change_PaymentMethod = ' Card Details Changed Successfully',\n Manual_Payment = 'Payment Done Successfully',\n}\n\nexport enum UserStatus {\n PENDING = 'Pending',\n ACCEPTED = 'Accepted',\n REJECTED = 'Rejected',\n BLOCKED = 'Blocked',\n}\nexport enum PolicyStatus {\n ACTIVE = 'Active',\n INACTIVE = 'Inactive',\n CANCEL = 'Cancel Plan',\n Cancelled = 'Cancelled',\n PAYMENT_OVER_DUE = 'Payment Overdue',\n}\nexport const keyEnum = {\n ENTER: 'Enter',\n}\nexport enum ClaimStatus {\n ALL = 'All',\n APPLICABLE = 'Applicable',\n NOT_APPLICABLE = 'Not Applicable',\n CLAIM_RAISED = 'Claim Raised',\n APPROVED = 'Approved',\n DISAPPROVED = 'Disapproved',\n ACCEPTED = 'Accepted',\n REJECTED = 'Rejected',\n RE_EVALUATE = 'Re-Evaluate',\n}\nexport enum OsNameEnum {\n MAC_OS = 'MAC Os',\n LINUX = 'Linux',\n WINDOWS = 'Windows',\n}\nexport enum ServicesEnum {\n EDR = 'Sentinel One',\n COVE_DATA = 'Cove Data Protection',\n N_SIGHT_PATCH = 'N-Sight-Patch Management',\n N_SIGHT_AV = 'N-Sight AV (Bitdefender)',\n N_CENTERAL = 'N-Central',\n}\nexport enum ComingSoonServicesEnum {\n Crowd_Strike = 'Crowd Strike',\n Bitdefender_Gravity = 'BitDefender Gravity Zone',\n Malware_Bytes = 'Malware Bytes',\n Windows_Defender = 'Windows Defender',\n}\n\nexport enum CommunicationMediumEnum {\n WHATSAPP = 'Whatsapp',\n EMAIL = 'Email',\n PHONENUMBER = 'Phone Number',\n}\n\nexport enum TimeZone {\n MORNING = 'Morning (08:00 AM - 12:00 PM)',\n EVENING = 'Evening (05:00 PM - 08:00PM)',\n AFTERNOON = 'Afternoon (12:00 PM - 05:00 PM)',\n MORNING_VALUE = 'Morning',\n EVENING_VALUE = 'Evening',\n AFTERNOON_VALUE = 'Afternoon',\n}\n\nexport enum ThreatMonitoringStartDate {\n ASAP = 'Asap',\n IN_MONTH = 'With in a month',\n TWO_TO_FOUR_MONTHS = '2 to 4 months',\n MORE_THAN_4_Months = 'More than 4 months in advance',\n}\n\nexport enum ERROR_ENUM {\n EMAIL_VERIFIED = 'Your Account was successfully verified.',\n EMAIL_VERIFYING = 'Please wait while we verify your email address...',\n}\n\nexport const RegPattern = {\n PASSWORD_VALIDATION:\n // eslint-disable-next-line no-useless-escape\n /^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[!@#\\$%\\^&\\*])(?=.{8,})/,\n\n // eslint-disable-next-line no-useless-escape\n URL_VALIDATION: /^(https?|ftp):\\/\\/|www\\.|[a-zA-Z0-9\\-\\.]+\\.[a-zA-Z]{2,}(\\/\\S*)?$/,\n ADDRESS_VALIDATION: /^[a-zA-Z0-9 @.,!?()]{5,100}$/,\n PHONE_VALIDATION: /^\\+[1-9]{1}[0-9]{10,12}$/,\n NO_WHITE_SPACE: /^\\S*$/,\n WHITE_SPACE: /^\\S/,\n LENGTH_VALIDATION: /^[a-zA-Z0-9 @.,!?()]{0,300}$/,\n FIRST_NAME_VALIDATION: /^(?=.{2,10}$)[A-Za-z]+(?:\\s[A-Za-z]+)*\\s?$/,\n LAST_NAME_VALIDATION: /^(?=.{2,10}$)[A-Za-z]+(?:\\s[A-Za-z]+)*\\s?$/,\n COMPANY_NAME_VALIDATION: /^[a-zA-Z]+([ -]?[a-zA-Z]+)*$/,\n SENTINELONE_URL: /^https:\\/\\/.*\\.sentinelone\\.net\\/$/,\n EMAIL_VALIDATION: /^\\s*[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,}(?:\\.[a-zA-Z]{2,})?\\s*$/,\n}\n\nexport const validTitle = {\n // eslint-disable-next-line\n pattern: /^([a-zA-Z0-9]+\\s)*[a-zA-Z0-9]+$/,\n message: 'Title name at least have 5, but not more than 50 characters and will not accept only spaces',\n}\nexport const defaultImage = {\n admin: '/images/img-placeholder.png',\n logo: '/images/default_Logo.png',\n}\n\nexport const ApplicationEnum = {\n PENDING: 'Pending',\n ACCEPTED: 'Accepted',\n REJECTED: 'Rejected',\n ACTIVE: 'Active',\n EXPIRED: 'Expired',\n PAYMENT_OVER_DUE: 'Payment Overdue',\n}\nexport enum SentinelOneFormError {\n ERROR = 'OS need Protection ,atleast one should be selected',\n}\nexport enum ServicesFormError {\n ERROR = ' Primary service must be selected.',\n}\n\nexport enum ResendVerification {\n TEXT = 'Please enter the Email address associated with your account and we will send you an Email to verify your account',\n SUCCESS_TEXT = 'We have sent a verification Email on your account, please visit your Email account',\n}\nexport enum Stages {\n STAGE1 = 'step1',\n STAGE2 = 'step2',\n STAGE3 = 'step3',\n STAGE4 = 'step4',\n STAGE5 = 'step5',\n STAGE6 = 'step6',\n STAGE7 = 'step7',\n}\n\nexport enum QuoteStatement {\n STEP2 = 'Select more than one secondary service to get additional discount on premium.',\n NEW_SERVICE = 'A DLT Alert Specialist will review your request and get in touch to discuss options that best fit your companies requirements.',\n}\nexport enum Add_ServiceStatement {\n ADD_SERVICE = 'Add More Then One Secondary Service For Additional Discount',\n}\nexport enum NSightPatchEnum {\n STATUSLABEL = 'statusLabel',\n PATCHURL = 'patchUrl',\n SEVERITYLABEL = 'severityLabel',\n}\nexport enum ModalAcceptText {\n TEXT = 'Initiate Claim',\n ACCEPTED_TEXT = 'Initiating Claim',\n}\nexport enum ServicesAssessmentsEnum {\n EDR = 'Sentinel One',\n COVE_DATA = 'Cove Data Protection',\n N_SIGHT_PATCH = 'N-Sight-Patch Management',\n N_SIGHT_AV = 'N-Sight AV (Bitdefender)',\n N_CENTERAL = 'N-Central',\n VEEM = 'Veeam',\n}\nexport enum ApiErrorCode {\n CODE = 'ERR_NETWORK',\n}\n\nexport enum LandingPageVideoLink {\n LINK = 'https://publicbucketdlt.s3.us-east-2.amazonaws.com/DLT+Cover+Video.mp4',\n}\n","import { AxiosError } from 'axios'\nimport { Assessment, BlogStylingEnum, ClaimStatus, EvaluationStatus, FileExtension, IncidentEnums, PlanStatus, ThreatStatus } from 'features/incidents/components/enums'\nimport { Attribute, BlogStyleType, OpenFullscreenProps, Orgc, PolicyFileInfo, Tag } from 'features/incidents/components/type'\nimport { edrScheme, patchSchema, schema } from 'features/profile/components/ServicesActivationModal'\nimport { calculateDiscount } from 'features/quote/components/GetAQuoteProcess/ServiceFormBase'\nimport { InsuranceData, TotalDiscountProps } from 'features/quote/components/type'\nimport html2canvas from 'html2canvas'\nimport { jsPDF } from 'jspdf'\nimport moment from 'moment'\nimport { DependencyList, useEffect } from 'react'\nimport * as Yup from 'yup'\nimport { ServicesEnum } from './enum'\n\nexport const getFileInfoFromUrl = (url: string | URL | undefined): PolicyFileInfo | undefined => {\n const fileURL: string | URL = String(url)\n const { pathname } = new URL(fileURL)\n const index = pathname.lastIndexOf('/')\n const _url = pathname.substring(index + 1)\n\n if (pathname.endsWith('.html') || pathname.endsWith('.pdf')) {\n return { type: FileExtension.PDF, _url }\n } else if (pathname.endsWith('.docx')) {\n return { type: FileExtension.DOCX, _url }\n } else if (pathname.endsWith('.png') || pathname.endsWith('.jpeg') || pathname.endsWith('.jpg')) {\n return { type: FileExtension.IMAGE, _url }\n }\n}\n\nexport const openInNewTab = (url: string | URL | undefined) => {\n window.open(url, '_blank')\n}\n\nexport const openFullscreen = ({ elementRefs, idx }: OpenFullscreenProps) => {\n const elem = elementRefs.current[idx]\n if (elem) {\n elem.requestFullscreen()\n }\n}\n\nexport const addThousandsOperator = (value: number) => {\n return String(value.toString()).replace(/(\\d)(?=(\\d{3})+(?!\\d))/g, '$1,')\n}\n\nexport const addNumeral = (number: number) => {\n if (number < 1e3) return number\n if (number >= 1e3 && number < 1e6) return +(number / 1e3).toFixed(3) + ' K'\n if (number >= 1e6 && number < 1e9) return +(number / 1e6).toFixed(7) + ' M'\n if (number >= 1e9 && number < 1e12) return +(number / 1e9).toFixed(7) + ' B'\n if (number >= 1e12) return +(number / 1e12).toFixed(7) + ' T'\n}\nexport const addEllipsis = (string: string, characters = 4, inCenter = true) => {\n if (inCenter) {\n if (string?.length > characters * 2) {\n return string.substr(0, characters) + '...' + string.substr(string.length - characters, string.length)\n }\n } else {\n if (string?.length > characters) {\n return string.substr(0, characters) + '...'\n }\n }\n return string\n}\nexport const getUpperCase = (string: string, isValue?: boolean) => {\n let value = ''\n string.split('.').forEach(sentene => {\n value = value + `${sentene.trim().slice(0, 1).toUpperCase()}${sentene.trim().slice(1)}${isValue ? '' : ''}`\n })\n return value\n}\n\nexport const errorMessage = (error: unknown) => {\n if (error instanceof AxiosError) {\n if (typeof error.response?.data?.message === 'string') {\n return error.response?.data?.message\n } else {\n return error.response?.data?.message[0]\n }\n }\n}\n\nexport const convertImagesToBase64 = async (imageSrcs: string[]): Promise => {\n const dataUrls: string[] = []\n let count = 0\n\n const loadNextImage = () => {\n return new Promise(resolve => {\n if (count >= imageSrcs.length) {\n resolve()\n return\n }\n\n const image = new Image()\n image.crossOrigin = 'anonymous'\n image.onload = () => {\n const canvas = document.createElement('canvas')\n const ctx = canvas.getContext('2d')\n canvas.height = image.naturalHeight\n canvas.width = image.naturalWidth\n ctx?.drawImage(image, 0, 0)\n const dataUrl = canvas.toDataURL()\n dataUrls.push(dataUrl)\n count++\n loadNextImage().then(() => {\n resolve()\n })\n }\n image.src = imageSrcs[count]\n })\n }\n\n await loadNextImage()\n\n return dataUrls\n}\n\nexport const convertDocUrlsToBase64 = async (docUrls: string[] | string): Promise => {\n const base64Urls: string[] = []\n if (docUrls) {\n for (const url of docUrls) {\n if (url.endsWith('jpg') || url.endsWith('jpeg') || url.endsWith('png')) {\n const convertedUrl = await convertImagesToBase64([url])\n base64Urls.push(...convertedUrl)\n } else {\n base64Urls.push(url)\n }\n }\n }\n return base64Urls\n}\n\nexport const processAcceptText = (acceptText: string) => {\n if (acceptText.charAt(acceptText.length - 1) === 'e') {\n return acceptText.slice(0, -1)\n }\n return acceptText\n}\n\nexport const downloadPdfDocument = (pdfElement: HTMLElement[], callback?: () => void, setDownloadStatus?: (value: boolean) => void, name?: string) => {\n const options = {\n scale: 2, // Increase the scale value for higher resolution\n backgroundColor: '#0d1023',\n }\n\n const pdf = new jsPDF('p', 'mm', 'a4', true)\n pdf.setFillColor(13, 16, 35)\n pdf.rect(0, 0, pdf.internal.pageSize.width, pdf.internal.pageSize.height, 'F')\n\n let currentPage = 1 // Declare and initialize currentPage to 1\n\n const processElement = (element: HTMLElement, index: number) => {\n const elementRect = element.getBoundingClientRect()\n const padding = 10\n const aspectRatio = elementRect.width / elementRect.height\n\n html2canvas(element, {\n ...options,\n scrollY: -window.scrollY,\n }).then(canvas => {\n // Check if a new page is needed\n if (index > 0) {\n pdf.addPage()\n pdf.internal.pageSize.height = pdf.internal.pageSize.width / aspectRatio // update the page height\n currentPage++ // Increment currentPage if a new page is added\n }\n\n pdf.setFillColor(13, 16, 35)\n pdf.rect(0, 0, pdf.internal.pageSize.width, pdf.internal.pageSize.height, 'F')\n\n // Calculate the position and size of the image on the current page\n const imageTopPosition = padding\n const elementWidth = pdf.internal.pageSize.width - padding * 2\n const elementHeight = elementWidth / aspectRatio\n\n let imageWidth, imageHeight\n\n if (elementHeight <= pdf.internal.pageSize.height - padding * 2) {\n imageWidth = elementWidth\n imageHeight = elementHeight\n } else {\n imageHeight = pdf.internal.pageSize.height - padding * 2\n imageWidth = imageHeight * aspectRatio\n }\n\n const imageLeftPosition = (pdf.internal.pageSize.width - imageWidth) / 2\n\n pdf.addImage(canvas.toDataURL('image/jpeg', 1.0), 'JPEG', imageLeftPosition, imageTopPosition, imageWidth, imageHeight, undefined, 'FAST')\n\n // If this is the last element, save the PDF\n if (index === pdfElement.length - 1) {\n setTimeout(() => {\n pdf.save(name ? `${name}_${currentPage}.pdf` : `Stats-Report.pdf`)\n setDownloadStatus?.(true)\n if (callback) {\n callback()\n }\n }, 500)\n } else {\n processElement(pdfElement[index + 1], index + 1)\n }\n })\n }\n\n // Start processing the first element\n processElement(pdfElement[0], 0)\n}\n\nexport function useDebounceEffect(fn: () => void, waitTime: number, deps: DependencyList = []) {\n useEffect(() => {\n const timeoutId = setTimeout(() => {\n fn()\n }, waitTime)\n\n return () => {\n clearTimeout(timeoutId)\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, deps)\n}\n\nexport const convertPdfToImage = (pdfUrl: string, callback: (imageUrl: string) => void): void => {\n const pdf = new jsPDF()\n\n pdf.addImage(pdfUrl, 'JPEG', 0, 0, 0, 0)\n const imageData = pdf.output('datauristring')\n\n const image = new Image()\n image.src = imageData\n\n image.onload = () => {\n const canvas = document.createElement('canvas')\n const context = canvas.getContext('2d')\n if (context) {\n canvas.width = image.width\n canvas.height = image.height\n context.drawImage(image, 0, 0)\n\n const imageUrl = canvas.toDataURL('image/png')\n callback(imageUrl)\n } else {\n // eslint-disable-next-line no-console\n console.error('Could not get canvas context.')\n }\n }\n}\n\nexport const downloadPDF = (url: string | URL | undefined, fileName = 'example.pdf') => {\n if (url) {\n fetch(url)\n .then(response => response.blob())\n .then(blob => {\n const url = window.URL.createObjectURL(blob)\n const link = document.createElement('a')\n link.href = url\n link.download = fileName\n link.click()\n window.URL.revokeObjectURL(url)\n })\n .catch(error => console.error('Error fetching PDF:', error))\n }\n}\nexport const ClaimMsg = (claimStatus: string) => {\n if (claimStatus === ClaimStatus.CLAIM_RAISED) {\n return 'Claim has been Initiated by the User.'\n } else if (claimStatus === ClaimStatus.APPROVED) {\n return 'Claim has been Approved.'\n } else if (claimStatus === ClaimStatus.DISAPPROVED) {\n return 'Claim has been Disapproved.'\n } else if (claimStatus === ClaimStatus.ACCEPTED) {\n return 'Claim has been Accepted.'\n } else if (claimStatus === ClaimStatus.REJECTED) {\n return 'Claim has been Rejected.'\n } else if (claimStatus === ClaimStatus.RE_EVALUATE) {\n return 'Claim has been Re-Evaluated by the User.'\n }\n}\nexport const ProgressId = (threatStatus: string) => {\n if (threatStatus === ThreatStatus.INCIDENT_DETECTED) return 0\n else if (threatStatus === ThreatStatus.INCIDENT_VERIFIYING) return 1\n else if (threatStatus === ThreatStatus.CLAIM_INITIATED) return 2\n else if (threatStatus === ThreatStatus.INSURANCE_CONFIRMATION) return 3\n else if (threatStatus === ThreatStatus.USER_CONFIRMATION) return 4\n else if (threatStatus === ThreatStatus.BLOCK_CREATION) return 5\n else if (threatStatus === ThreatStatus.CLAIM_RESOLVED) return 6\n else return -1\n}\nexport const ClaimColor = (claimStatus: string) => {\n if (claimStatus === ClaimStatus.APPLICABLE || claimStatus === Assessment.COMING_SOON) {\n return 'infoBg'\n } else if (\n claimStatus === ClaimStatus.APPROVED ||\n claimStatus === ClaimStatus.ACCEPTED ||\n claimStatus === Assessment.CONNECT ||\n claimStatus === ThreatStatus.USER_CONFIRMATION ||\n claimStatus === ThreatStatus.BLOCK_CREATION\n ) {\n return 'successBg'\n } else if (claimStatus === ClaimStatus.DISAPPROVED || claimStatus === ClaimStatus.REJECTED || claimStatus === ClaimStatus.NOT_APPLICABLE) {\n return 'errorBg'\n } else if (claimStatus === ClaimStatus.RE_EVALUATE || claimStatus === ClaimStatus.CLAIM_RAISED || status === PlanStatus.OVERDUE) {\n return 'warningBg'\n } else if (claimStatus === Assessment.ADD) {\n return 'primarysBg'\n }\n}\nexport const ReturnTags = (tag: string) => {\n if (tag == 'header-one') return 'h1'\n else if (tag == 'header-two') return 'h2'\n else if (tag == 'header-three') return 'h3'\n else if (tag == 'header-four') return 'h4'\n else if (tag == 'header-five') return 'h5'\n else if (tag == 'header-six') return 'h6'\n else if (tag == 'blockquote') return 'blockquote'\n else if (tag == 'code') return 'code'\n else if (tag == 'unstyled') return 'p'\n else if (tag == 'image') return 'img'\n else if (tag === 'IMAGE') return 'IMAGE'\n else if (tag === 'EMBEDDED_LINK') return 'EMBEDDED_LINK'\n else if (tag === 'LINK') return 'LINK'\n else if (tag === 'unordered-list-item') return 'li'\n}\n\nexport const getDefaultValuesInsuranceForm = (insuranceObj: InsuranceData) => ({\n q1: {\n label: insuranceObj?.typesOfSensitiveData || null,\n value: insuranceObj?.typesOfSensitiveData || null,\n },\n q2: insuranceObj?.annualRevenue || null,\n q3: {\n label: insuranceObj?.experiencedCyberAttack || null,\n value: insuranceObj?.experiencedCyberAttack || null,\n },\n q4: {\n label: insuranceObj?.conductCyberAttackTraining || null,\n value: insuranceObj?.conductCyberAttackTraining || null,\n },\n q5: {\n label: insuranceObj?.howManyEmployees || null,\n value: insuranceObj?.howManyEmployees || null,\n },\n // q6: {\n // label: insuranceObj?.backupAtSecondaryLocation || null,\n // value: insuranceObj?.backupAtSecondaryLocation || null,\n // },\n // q7: {\n // label: insuranceObj?.totalServersCompanyHave || null,\n // value: insuranceObj?.totalServersCompanyHave || null,\n // },\n // q8: {\n // label: insuranceObj?.totalEndPointsCompanyHave || null,\n // value: insuranceObj?.totalEndPointsCompanyHave || null,\n // },\n // q9: insuranceObj?.isPerformVulnerabilityAndPatching === null ? '' : insuranceObj?.isPerformVulnerabilityAndPatching.toString(),\n // q10: insuranceObj?.isPiiStoredEncrypted === null ? '' : insuranceObj?.isPiiStoredEncrypted.toString(),\n\n // q11: insuranceObj?.isMeasuresImplementedToProtect === null ? '' : insuranceObj?.isMeasuresImplementedToProtect.toString(),\n // q12: {\n // label: insuranceObj?.employeesUndergoAwarenessTraining || null,\n // value: insuranceObj?.employeesUndergoAwarenessTraining || null,\n // },\n // q13: insuranceObj?.isSecondaryConfirmationProcessImplemented === null ? '' : insuranceObj?.isSecondaryConfirmationProcessImplemented.toString(),\n // q14: insuranceObj?.isNetworkSegmented === null ? '' : insuranceObj?.isNetworkSegmented.toString(),\n // q15: {\n // label: insuranceObj?.organizationRestrictAuthorizedUsers || null,\n // value: insuranceObj?.organizationRestrictAuthorizedUsers || null,\n // },\n // q16: {\n // label: insuranceObj?.passwordPolicyImplemented || null,\n // value: insuranceObj?.passwordPolicyImplemented || null,\n // },\n // q17: {\n // label: insuranceObj?.multifactorAuthenticationImplemented || null,\n // value: insuranceObj?.multifactorAuthenticationImplemented || null,\n // },\n // q18: insuranceObj?.isPacisProtected === null ? '' : insuranceObj?.isPacisProtected.toString(),\n})\n\nexport const CoveSessionStatus = (value: string) => {\n switch (value) {\n case '1':\n return 'In process'\n break\n case '2':\n return 'Failed'\n break\n case '3':\n return 'Aborted'\n break\n case '5':\n return 'Completed'\n break\n case '6':\n return 'Interrupted'\n break\n case '7':\n return 'NotStarted'\n break\n case '8':\n return 'CompletedWithErrors'\n break\n case '9':\n return 'InProgressWithFaults'\n break\n case '10':\n return 'OverQuota'\n break\n case '11':\n return 'NoSelection'\n break\n case '12':\n return 'Restarted'\n break\n case '0':\n return 'No Data'\n break\n default:\n return 'Unknown Status'\n }\n}\nexport const CoveRecoveryStatus = (value: string) => {\n if (value == '1') return 'On'\n else if (value == '0') return 'Off'\n}\nexport const Last28DaysStatus = (value: string) => {\n switch (value) {\n case '0':\n return 'grey'\n break\n case '5':\n return 'green'\n break\n case '8':\n return 'orange'\n break\n default:\n return 'red'\n }\n}\nexport const Last28DaysDateCount = (value: string, index: number) => {\n const updatedDate = moment(value).subtract(index, 'days')\n return updatedDate.format('MM-DD-YYYY')\n}\nexport const TotalDiscountApplied = (props: TotalDiscountProps) => {\n const { services, totalDiscount, setHasServices, setHadDiscount } = props\n if (services) {\n if (services && services.length > 1) {\n const appliedDiscount = calculateDiscount(services, totalDiscount)\n setHasServices(`${appliedDiscount}%`)\n }\n setHadDiscount(services.length > 1)\n }\n}\nexport const getFormSchemaAndFields = (modalType: ServicesEnum) => {\n switch (modalType) {\n case ServicesEnum.EDR:\n return {\n schema: edrScheme,\n fields: [\n { name: 'sentinelOneApiKey', label: 'Sentinel One API Key', placeholder: 'Enter Sentinel One API Key' },\n {\n name: 'sentinelOneConsoleUrl',\n label: 'Sentinel One URL ',\n placeholder: 'Enter Sentinel One URL ',\n },\n ],\n title: 'Connect EDR',\n open: true,\n }\n case ServicesEnum.COVE_DATA:\n return {\n schema: schema,\n fields: [\n { name: 'userName', label: 'Email', placeholder: 'Enter Email' },\n { name: 'password', label: 'Password', placeholder: 'Enter Password' },\n ],\n title: 'Connect Cove',\n open: true,\n }\n case ServicesEnum.N_SIGHT_PATCH:\n return {\n schema: patchSchema,\n fields: [{ name: 'apiKey', label: 'Api Key', placeholder: 'Enter API Key' }],\n title: 'Connect Patch',\n open: true,\n }\n default:\n return { schema: Yup.object(), fields: [] }\n }\n}\nexport function convertFirstLetterToUpperCase(value: string) {\n if (typeof value !== 'string' || value.length === 0) {\n return value\n }\n\n return value.charAt(0).toUpperCase() + value.slice(1)\n}\n\nexport const formatServiceName = (inputString: string) => {\n const words = inputString.split(' ')\n\n // Capitalize the first letter of each word and join with spaces\n const formattedWords = words.map(word =>\n word\n //if hyphen then sub word and map other wise the word is treated as a subword\n .split('-')\n .map(subword => subword.charAt(0).toUpperCase() + subword.slice(1).toLowerCase())\n .join('-')\n )\n\n return formattedWords.join(' ')\n}\n\nexport const ViewOnChainDataBasedOnPrimaryService = (serviceName: string, incidentListRow: Record) => {\n switch (serviceName) {\n case EvaluationStatus.COVE:\n return [\n {\n key: 'Claim Status ',\n value: incidentListRow?.claimStatus,\n },\n {\n key: 'Device Name',\n value: incidentListRow?.threatData?.Settings[0]?.AN,\n },\n {\n key: 'Device ID',\n value: incidentListRow?.deviceId,\n },\n ]\n case EvaluationStatus.EDR:\n return [\n {\n key: 'Claim Status ',\n value: incidentListRow?.insuranceDetail?.claimStatus,\n },\n {\n key: 'Sentinel One Hash',\n value: incidentListRow?.sha1,\n },\n {\n key: 'Classification',\n value: incidentListRow[IncidentEnums.THREAT_INFO]?.Classification,\n },\n ]\n case EvaluationStatus.NSIGHT:\n return [\n {\n key: 'Claim Status ',\n value: incidentListRow?.claimStatus,\n },\n {\n key: 'Device Name',\n value: incidentListRow?.threatData?.deviceName,\n },\n {\n key: 'Device ID',\n value: incidentListRow?.deviceId,\n },\n ]\n default:\n return []\n }\n}\n\nexport function convertMISPApiResponse(response: { response: { Attribute: Attribute[] } }): { Orgc: Orgc; Tag: Tag[] }[] {\n const galaxyImageStaticDataArray: { Orgc: Orgc; Tag: Tag[] }[] = []\n\n // Extracting unique Orgc entries and their associated tags\n const uniqueOrgcMap = new Map()\n response?.response?.Attribute?.forEach(attr => {\n const orgcId = attr.Event.Orgc.id\n if (!uniqueOrgcMap.has(orgcId)) {\n uniqueOrgcMap.set(orgcId, {\n Orgc: {\n id: orgcId,\n name: attr.Event.Orgc.name,\n uuid: attr.Event.Orgc.uuid,\n local: attr.Event.Orgc.local,\n },\n Tag: [],\n })\n }\n\n // Adding unique tags to each Orgc\n attr?.Tag?.forEach(tag => {\n if (!uniqueOrgcMap.get(orgcId)?.Tag.some(existingTag => existingTag.id === tag.id)) {\n uniqueOrgcMap.get(orgcId)?.Tag.push({\n id: tag.id,\n name: tag.name,\n colour: tag.colour,\n is_galaxy: tag.is_galaxy,\n local: tag.local,\n inherited: tag.inherited,\n })\n }\n })\n })\n\n // Converting map values to array for the final output\n uniqueOrgcMap?.forEach(orgcData => {\n galaxyImageStaticDataArray.push(orgcData)\n })\n\n return galaxyImageStaticDataArray\n}\nexport function countOccurrences(str: string) {\n // Use a regular expression to find all occurrences of \"click here\" (case-insensitive)\n const matches = str.match(/click here/gi)\n\n // Return the number of matches found or 0 if no matches are found\n return matches ? matches.length : 0\n}\nexport function BlogStylFun(inlineStyleRanges: BlogStyleType[] | undefined) {\n let cssStyling = {}\n let isCodeStyle = false\n inlineStyleRanges?.forEach(inlineStyleRange => {\n if (inlineStyleRange?.style === BlogStylingEnum.ITALIC) {\n cssStyling = { ...cssStyling, fontStyle: BlogStylingEnum.ITALIC.toLowerCase() }\n }\n if (inlineStyleRange?.style === BlogStylingEnum.UNDERLINE) {\n cssStyling = { ...cssStyling, textDecoration: BlogStylingEnum.UNDERLINE.toLowerCase() }\n }\n if (inlineStyleRange?.style === BlogStylingEnum.BOLD) {\n cssStyling = { ...cssStyling, fontWeight: BlogStylingEnum.BOLD.toLowerCase() }\n }\n if (inlineStyleRange?.style === BlogStylingEnum.STRIKETHROUGH) {\n cssStyling = { ...cssStyling, textDecoration: 'line-through' }\n }\n if (inlineStyleRange?.style.includes('color-')) {\n const customColor = inlineStyleRange?.style?.replace('color-', '')\n cssStyling = { ...cssStyling, color: customColor }\n }\n if (inlineStyleRange?.style.includes('fontsize-')) {\n const customFontSize = inlineStyleRange?.style?.replace('fontsize-', '')\n cssStyling = { ...cssStyling, fontSize: `${customFontSize}px` }\n }\n if (inlineStyleRange?.style.includes('fontfamily-')) {\n const customFontFamily = inlineStyleRange?.style?.replace('fontfamily-', '')\n cssStyling = { ...cssStyling, fontFamily: customFontFamily }\n }\n if (inlineStyleRange?.style === BlogStylingEnum.CODE) {\n cssStyling = {\n ...cssStyling,\n fontFamily: 'monospace',\n overflowWrap: 'break-word',\n background: 'rgb(241, 241, 241)',\n borderRadius: '3px',\n paddding: '1px 3px',\n fontSize: '1.2rem',\n display: 'inline',\n margin: '10px 0px',\n }\n isCodeStyle = true\n }\n if (inlineStyleRange?.style === BlogStylingEnum?.SUPERSCRIP) {\n cssStyling = {\n ...cssStyling,\n position: 'relative',\n top: '-8px',\n fontSize: '15px',\n }\n }\n if (inlineStyleRange?.style === BlogStylingEnum?.SUBSCRIPT) {\n cssStyling = {\n ...cssStyling,\n position: 'relative',\n bottom: '-8px',\n fontSize: '15px',\n }\n }\n })\n return { cssStyling, isCodeStyle }\n}\n","const storagePrefix = 'dlt_portal'\n\nconst storage = {\n getToken(): string | null {\n return JSON.parse(localStorage.getItem(`${storagePrefix}_token`) as string)\n },\n setToken(token: string) {\n localStorage.setItem(`${storagePrefix}_token`, JSON.stringify(token))\n },\n clearToken() {\n localStorage.removeItem(`${storagePrefix}_token`)\n },\n setLoginBefore(state: string) {\n localStorage.setItem(`${storagePrefix}_logged_before`, state)\n },\n getLoginBefore() {\n return localStorage.getItem(`${storagePrefix}_logged_before`)\n },\n}\n\nexport default storage\n","export const validUrl = {\n // eslint-disable-next-line\n pattern: /[-a-zA-Z0-9@:%._\\+~#=]{1,256}\\.[a-zA-Z0-9()]{1,6}\\b([-a-zA-Z0-9()@:%_\\+.~#?&//=]*)/,\n message: 'Please provide valid company url',\n}\n\nexport const validDescription = {\n pattern: /^(?=\\S)(?=.{5,200})([a-zA-Z0-9!@#$%^&*()[\\]{}\\-_+=~`|:;\"'<>,.?/\\n]+ ?)*[a-zA-Z0-9!@#$%^&*()[\\]{}\\-_+=~`|:;\"'<>,.?/\\n]$/,\n message: 'Please enter between 5 and 200 characters, and avoid ending with a space.',\n}\nexport const validName = {\n pattern: /^([a-zA-Z0-9]+\\s)*[a-zA-Z0-9]+$/,\n message: 'Can not enter only spaces ',\n}\nexport const validIssue = {\n pattern: /^([a-zA-Z0-9]+\\s)*[a-zA-Z0-9]+$/,\n message: 'Can not enter only spaces',\n}\n","import { styled } from 'styles'\nimport { Box, Flex } from 'components/elements'\nimport { Card, CardBorder } from 'components/elements/Card'\nimport { Button } from 'components/button'\nimport * as Yup from 'yup'\nimport { yupResolver } from '@hookform/resolvers/yup'\nimport { useForm } from 'react-hook-form'\nimport { TextField } from 'components/form'\nimport { NotificationMessages, RegPattern, ValidationErrors } from 'utils/enum'\nimport DescriptionField from '@mui/material/TextField'\nimport { StyledLabel, StyledDropdownWrap, StyledHelperText } from 'components/form/Textfield.styles'\nimport { validDescription, validIssue, validName } from 'utils/validation'\nimport { AxiosError } from 'axios'\nimport { useState } from 'react'\nimport { useSupportRequest } from './api/changePassword'\nimport SnackBar from 'components/SnackBar'\n\ntype InputFields = {\n name: string\n email: string\n coverage: string\n companyName: string\n}\n\ntype SupportFormProps = {\n formPrefix?: string\n}\n\nconst SupportForm = ({ formPrefix }: SupportFormProps) => {\n const defaultValues = {\n name: '',\n email: '',\n coverage: '',\n companyName: '',\n }\n const [submitError, setSubmitError] = useState('')\n const { mutate, isLoading } = useSupportRequest()\n const [notification, setNotification] = useState(false)\n const [commentDeleted, setCommentDeleted] = useState(false)\n\n const {\n handleSubmit,\n formState: { errors },\n register,\n reset,\n } = useForm({\n resolver: yupResolver(loginSchema),\n defaultValues,\n })\n\n const onSubmit = async (data: InputFields) => {\n setSubmitError('')\n\n const modifiedData = {\n ...data,\n companyName: `${formPrefix} - ${data.companyName}`,\n }\n mutate(modifiedData, {\n onSuccess: () => {\n setCommentDeleted(true)\n setNotification(true)\n },\n onError: error => {\n if (error instanceof AxiosError) {\n setSubmitError(error.response?.data.message)\n }\n },\n })\n reset()\n }\n\n return (\n \n \n {!!submitError && {submitError}}\n \n \n \n \n {errors.name?.message && errors.name?.message}\n \n \n \n {errors.email?.message && errors.email?.message}\n \n \n \n \n \n {errors.companyName?.message && errors.companyName?.message}\n \n \n \n \n What type of Coverage are you interested in\n \n {errors.coverage?.message && errors.coverage?.message}\n \n \n \n \n \n \n \n {\n setCommentDeleted(false)\n\n setNotification(false)\n }}\n text={NotificationMessages.SUPPORT_FORM}\n severity={'success'}\n />\n \n )\n}\n\nexport const NegativeMargin = {\n 'mx': 0,\n\n '@sm': {\n mx: -12,\n },\n}\n\nexport const FlexWrapCSS = {\n flexWrap: 'wrap',\n width: '100%',\n}\n\nexport const StyledTeamCard = styled(Card, {\n 'padding': '$6',\n\n '& .ip': {\n fontStyle: 'normal',\n fontWeight: '400',\n fontSize: '32px',\n color: '$black',\n },\n '& .score': {\n fontStyle: 'normal',\n fontWeight: '700',\n fontSize: '16px',\n color: '$white',\n textTransform: 'uppercase',\n letterSpacing: '0.5em',\n marginBottom: '$5',\n },\n '& .score-percentage': {\n fontStyle: 'normal',\n fontWeight: '700',\n fontSize: '30px',\n color: '$white',\n },\n '& .date': {\n fontSize: '$sm',\n fontWeight: '$light',\n marginTop: 4,\n },\n '& .heading': {\n fontSize: '14px',\n fontWeight: '$normal',\n },\n '& .sub-heading': {\n fontSize: '$md',\n fontWeight: '$light',\n },\n '& .detail': {\n 'fontSize': '16px',\n 'fontWeight': '$bold',\n\n 'wordBreak': 'break-word',\n '&.extended': {\n m: '0 $3 0 $5',\n lineHeight: '17px',\n },\n },\n '& .error': {\n fontSize: '$sm',\n fontWeight: '$medium',\n color: '$error',\n textAlign: 'left',\n },\n '@md': {\n '& .date': {\n mt: -20,\n },\n '& .ip': {\n fontSize: '32px',\n },\n },\n})\n\nexport const inputStyle = {\n width: '100%',\n}\n\nexport const wrapStyle = {\n 'position': 'relative',\n 'mb': '$5',\n 'width': '100%',\n\n '@sm': {\n width: '50%',\n px: 12,\n },\n\n '&.fullWidth': {\n width: '100%',\n },\n\n '&.noPadding': {\n px: 0,\n },\n}\n\nconst loginSchema = Yup.object().shape({\n name: Yup.string().required(ValidationErrors.NAME).matches(validName.pattern, validName.message),\n email: Yup.string().required(ValidationErrors.EMAIL_VALIDATION).matches(RegPattern.EMAIL_VALIDATION, ValidationErrors.EMAIL_VALIDATION),\n coverage: Yup.string().matches(validDescription.pattern, validDescription.message).required(ValidationErrors.DESCRIPTION),\n companyName: Yup.string().required(ValidationErrors.COMPANY).matches(validIssue.pattern, validIssue.message),\n})\n\nexport default SupportForm\n","import { Box } from 'components/elements'\nimport { styled } from 'styles'\n\nexport const Main = styled('main', {\n 'padding': '0 1.15rem',\n 'overflow': 'hidden',\n 'bgImage': \"url('/images/bg-pattern.png')\",\n 'backgroundSize': 'auto 640px',\n 'backgroundRepeatY': 'no-repeat',\n 'marginTop': 72,\n 'minHeight': 'calc(100vh - 100px)',\n 'margin': 'auto',\n '.section-title': {\n mb: '$6',\n textAlign: 'center',\n },\n\n '@sm': {\n '.section-title': {\n mb: '$8',\n fontSize: '2rem',\n },\n },\n\n '@md': {\n marginTop: 0,\n padding: '0 80px',\n },\n})\n\nexport const Section = styled('section', {\n 'mb': '$6',\n 'mt': '$6',\n '@md': {\n mb: '$13',\n mt: '$13',\n },\n '@lg': {\n mb: '$10',\n mt: '$10',\n },\n})\n\nexport const CardTextBox = {\n 'maxWidth': 630,\n 'mb': 40,\n '@md': { mb: 0 },\n}\n\nexport const DateOverlap = {\n position: 'absolute',\n right: '.75rem',\n top: '.75rem',\n}\n\nexport const ItemChipOverlap = {\n position: 'absolute',\n left: '.75rem',\n bottom: '.75rem',\n}\n\nexport const StyledWrapper = styled('div', {\n 'bgImage': '$aboutGradient',\n 'borderRadius': '$base',\n 'backdropFilter': 'blur(20px)',\n\n 'p': '$4',\n 'py': '$6',\n '& p': {\n color: '$red',\n pr: 12,\n },\n '@sm': {\n p: '$6',\n },\n '@md': {\n p: '$8',\n },\n})\n\nexport const rightStyle = {\n right: '-10%',\n top: '55%',\n}\n\nexport const leftStyle = {\n left: '-8%',\n bottom: '-20%',\n}\n\nexport const bodyStyle = {\n display: 'flex',\n justifyContent: 'center',\n}\n\nexport const BoxTextCenter = {\n display: 'flex',\n alignItems: 'center',\n}\n\nexport const FormStyle = {\n display: 'flex',\n justifyContent: 'center',\n paddingTop: '2rem',\n maxWidth: 650,\n margin: 'auto',\n}\n\nexport const ProfileItem = {\n 'pb': '1.25rem',\n 'mb': '1.25rem',\n 'borderBottom': '2px solid $primary',\n\n '.MuiAvatar-root': {\n size: '4rem',\n },\n}\n\nexport const ProfileTextCSS = {\n pl: '1.5rem',\n flexDirection: 'column',\n}\n\nexport const ContentImage = styled(Box, {\n 'display': 'flex',\n 'flex': '0 0 calc(100% - 0.5rem)',\n '@md': {\n flex: '0 0 calc(30% - 0.5rem)',\n },\n})\nexport const BlogContentSection = styled(Box, {\n 'display': 'flex',\n 'flexDirection': 'column',\n\n 'flex': '0 0 calc(100% - 0.5rem)',\n '@md': {\n flex: '0 0 calc(70% - 0.5rem)',\n },\n})\n\nexport const BlogSection = {\n marginTop: '.5rem',\n wordBreak: 'break-all',\n}\n\nexport const CustomRadioButton = styled('input', {\n 'width': '12px',\n 'height': '12px',\n 'backgroundColor': 'transparent',\n 'display': 'inline-flex',\n 'alignItems': 'center',\n 'justifyContent': 'center',\n 'flexShrink': 0,\n 'padding': '0px',\n 'border': '1.5px solid var(--colors-blue4)',\n 'borderRadius': '50%',\n 'color': 'var(--colors-fg)',\n 'overflow': 'hidden',\n 'marginTop': '0',\n '&[data-state=\"unchecked\"]': {\n userSelect: 'none',\n appearance: 'none',\n },\n '&[data-state=\"checked\"]': {\n accentColor: 'var(--colors-primary)',\n },\n})\nexport const CheckBoxInput = styled('input', {\n // Your styling for the unchecked state\n '&[data-state=\"unchecked\"]': {\n appearance: 'none',\n width: '20px',\n height: '20px',\n border: '2px solid $gray7',\n borderRadius: '4px',\n backgroundColor: 'transparent',\n outline: 'none',\n cursor: 'pointer',\n position: 'relative',\n },\n // Your styling for the checked state (with tick)\n '&[data-state=\"checked\"]': {\n appearance: 'none',\n width: '20px',\n height: '20px',\n border: '2px solid transparent',\n borderRadius: '4px',\n outline: 'none',\n cursor: 'pointer',\n position: 'relative',\n backgroundColor: '$primary',\n accentColor: 'var(--colors-primary)',\n },\n // Styling for the tick mark when checked\n '&[data-state=\"checked\"]::before': {\n content: '\"\"',\n position: 'absolute',\n top: '24%', // Adjust the top position as needed\n left: '16%', // Adjust the left position as needed\n width: '11px',\n height: '5px',\n border: '2px solid white',\n borderImage: 'initial',\n borderTop: 'none',\n borderRight: 'none',\n opacity: 1,\n transform: 'rotate(306deg)', // Rotate the tick to the desired angle (306 degrees)\n transition: 'transform 0.2s ease',\n },\n})\n\nexport const userRegisterQuoteCss = {\n textAlign: 'left',\n cursor: 'pointer',\n marginTop: '10px',\n}\nexport const userRegHeadingCss = {\n marginTop: '$4',\n marginBottom: '$5',\n textAlign: 'center',\n width: '100%',\n}\nexport const Form = styled('form', {\n display: 'flex',\n flexDirection: 'column',\n gap: '1.25rem',\n})\n\nexport const Label = styled('label', {\n display: 'flex',\n gap: '1rem',\n marginBottom: 14,\n})\nexport const ErrorCSS = {\n fontSize: '$sm',\n color: '$error',\n textAlign: 'end',\n}\n\nexport const StyledSection = styled('section', {\n 'mt': '$12',\n 'mb': '$12',\n '@md': {\n display: 'flex',\n alignItems: 'center',\n },\n})\n\nexport const AdvantageDot = styled('div', {\n 'width': '$space$30',\n 'height': '$space$30',\n 'minWidth': '$space$30',\n 'mr': '$space$20',\n 'backgroundColor': '$advantage',\n 'display': 'flex',\n 'alignItems': 'center',\n 'justifyContent': 'center',\n 'borderRadius': '$radii$rounded',\n '@sm': {\n width: '$space$40',\n height: '$space$40',\n minWidth: '$space$40',\n },\n '@lg': {\n width: '$space$50',\n height: '$space$50',\n minWidth: '$space$50',\n },\n})\n","/*\n\nBased off glamor's StyleSheet, thanks Sunil ❤️\n\nhigh performance StyleSheet for css-in-js systems\n\n- uses multiple style tags behind the scenes for millions of rules\n- uses `insertRule` for appending in production for *much* faster performance\n\n// usage\n\nimport { StyleSheet } from '@emotion/sheet'\n\nlet styleSheet = new StyleSheet({ key: '', container: document.head })\n\nstyleSheet.insert('#box { border: 1px solid red; }')\n- appends a css rule into the stylesheet\n\nstyleSheet.flush()\n- empties the stylesheet of all its contents\n\n*/\n// $FlowFixMe\nfunction sheetForTag(tag) {\n if (tag.sheet) {\n // $FlowFixMe\n return tag.sheet;\n } // this weirdness brought to you by firefox\n\n /* istanbul ignore next */\n\n\n for (var i = 0; i < document.styleSheets.length; i++) {\n if (document.styleSheets[i].ownerNode === tag) {\n // $FlowFixMe\n return document.styleSheets[i];\n }\n }\n}\n\nfunction createStyleElement(options) {\n var tag = document.createElement('style');\n tag.setAttribute('data-emotion', options.key);\n\n if (options.nonce !== undefined) {\n tag.setAttribute('nonce', options.nonce);\n }\n\n tag.appendChild(document.createTextNode(''));\n tag.setAttribute('data-s', '');\n return tag;\n}\n\nvar StyleSheet = /*#__PURE__*/function () {\n // Using Node instead of HTMLElement since container may be a ShadowRoot\n function StyleSheet(options) {\n var _this = this;\n\n this._insertTag = function (tag) {\n var before;\n\n if (_this.tags.length === 0) {\n if (_this.insertionPoint) {\n before = _this.insertionPoint.nextSibling;\n } else if (_this.prepend) {\n before = _this.container.firstChild;\n } else {\n before = _this.before;\n }\n } else {\n before = _this.tags[_this.tags.length - 1].nextSibling;\n }\n\n _this.container.insertBefore(tag, before);\n\n _this.tags.push(tag);\n };\n\n this.isSpeedy = options.speedy === undefined ? process.env.NODE_ENV === 'production' : options.speedy;\n this.tags = [];\n this.ctr = 0;\n this.nonce = options.nonce; // key is the value of the data-emotion attribute, it's used to identify different sheets\n\n this.key = options.key;\n this.container = options.container;\n this.prepend = options.prepend;\n this.insertionPoint = options.insertionPoint;\n this.before = null;\n }\n\n var _proto = StyleSheet.prototype;\n\n _proto.hydrate = function hydrate(nodes) {\n nodes.forEach(this._insertTag);\n };\n\n _proto.insert = function insert(rule) {\n // the max length is how many rules we have per style tag, it's 65000 in speedy mode\n // it's 1 in dev because we insert source maps that map a single rule to a location\n // and you can only have one source map per style tag\n if (this.ctr % (this.isSpeedy ? 65000 : 1) === 0) {\n this._insertTag(createStyleElement(this));\n }\n\n var tag = this.tags[this.tags.length - 1];\n\n if (process.env.NODE_ENV !== 'production') {\n var isImportRule = rule.charCodeAt(0) === 64 && rule.charCodeAt(1) === 105;\n\n if (isImportRule && this._alreadyInsertedOrderInsensitiveRule) {\n // this would only cause problem in speedy mode\n // but we don't want enabling speedy to affect the observable behavior\n // so we report this error at all times\n console.error(\"You're attempting to insert the following rule:\\n\" + rule + '\\n\\n`@import` rules must be before all other types of rules in a stylesheet but other rules have already been inserted. Please ensure that `@import` rules are before all other rules.');\n }\n this._alreadyInsertedOrderInsensitiveRule = this._alreadyInsertedOrderInsensitiveRule || !isImportRule;\n }\n\n if (this.isSpeedy) {\n var sheet = sheetForTag(tag);\n\n try {\n // this is the ultrafast version, works across browsers\n // the big drawback is that the css won't be editable in devtools\n sheet.insertRule(rule, sheet.cssRules.length);\n } catch (e) {\n if (process.env.NODE_ENV !== 'production' && !/:(-moz-placeholder|-moz-focus-inner|-moz-focusring|-ms-input-placeholder|-moz-read-write|-moz-read-only|-ms-clear|-ms-expand|-ms-reveal){/.test(rule)) {\n console.error(\"There was a problem inserting the following rule: \\\"\" + rule + \"\\\"\", e);\n }\n }\n } else {\n tag.appendChild(document.createTextNode(rule));\n }\n\n this.ctr++;\n };\n\n _proto.flush = function flush() {\n // $FlowFixMe\n this.tags.forEach(function (tag) {\n return tag.parentNode && tag.parentNode.removeChild(tag);\n });\n this.tags = [];\n this.ctr = 0;\n\n if (process.env.NODE_ENV !== 'production') {\n this._alreadyInsertedOrderInsensitiveRule = false;\n }\n };\n\n return StyleSheet;\n}();\n\nexport { StyleSheet };\n","/**\n * @param {number}\n * @return {number}\n */\nexport var abs = Math.abs\n\n/**\n * @param {number}\n * @return {string}\n */\nexport var from = String.fromCharCode\n\n/**\n * @param {object}\n * @return {object}\n */\nexport var assign = Object.assign\n\n/**\n * @param {string} value\n * @param {number} length\n * @return {number}\n */\nexport function hash (value, length) {\n\treturn charat(value, 0) ^ 45 ? (((((((length << 2) ^ charat(value, 0)) << 2) ^ charat(value, 1)) << 2) ^ charat(value, 2)) << 2) ^ charat(value, 3) : 0\n}\n\n/**\n * @param {string} value\n * @return {string}\n */\nexport function trim (value) {\n\treturn value.trim()\n}\n\n/**\n * @param {string} value\n * @param {RegExp} pattern\n * @return {string?}\n */\nexport function match (value, pattern) {\n\treturn (value = pattern.exec(value)) ? value[0] : value\n}\n\n/**\n * @param {string} value\n * @param {(string|RegExp)} pattern\n * @param {string} replacement\n * @return {string}\n */\nexport function replace (value, pattern, replacement) {\n\treturn value.replace(pattern, replacement)\n}\n\n/**\n * @param {string} value\n * @param {string} search\n * @return {number}\n */\nexport function indexof (value, search) {\n\treturn value.indexOf(search)\n}\n\n/**\n * @param {string} value\n * @param {number} index\n * @return {number}\n */\nexport function charat (value, index) {\n\treturn value.charCodeAt(index) | 0\n}\n\n/**\n * @param {string} value\n * @param {number} begin\n * @param {number} end\n * @return {string}\n */\nexport function substr (value, begin, end) {\n\treturn value.slice(begin, end)\n}\n\n/**\n * @param {string} value\n * @return {number}\n */\nexport function strlen (value) {\n\treturn value.length\n}\n\n/**\n * @param {any[]} value\n * @return {number}\n */\nexport function sizeof (value) {\n\treturn value.length\n}\n\n/**\n * @param {any} value\n * @param {any[]} array\n * @return {any}\n */\nexport function append (value, array) {\n\treturn array.push(value), value\n}\n\n/**\n * @param {string[]} array\n * @param {function} callback\n * @return {string}\n */\nexport function combine (array, callback) {\n\treturn array.map(callback).join('')\n}\n","import {from, trim, charat, strlen, substr, append, assign} from './Utility.js'\n\nexport var line = 1\nexport var column = 1\nexport var length = 0\nexport var position = 0\nexport var character = 0\nexport var characters = ''\n\n/**\n * @param {string} value\n * @param {object | null} root\n * @param {object | null} parent\n * @param {string} type\n * @param {string[] | string} props\n * @param {object[] | string} children\n * @param {number} length\n */\nexport function node (value, root, parent, type, props, children, length) {\n\treturn {value: value, root: root, parent: parent, type: type, props: props, children: children, line: line, column: column, length: length, return: ''}\n}\n\n/**\n * @param {object} root\n * @param {object} props\n * @return {object}\n */\nexport function copy (root, props) {\n\treturn assign(node('', null, null, '', null, null, 0), root, {length: -root.length}, props)\n}\n\n/**\n * @return {number}\n */\nexport function char () {\n\treturn character\n}\n\n/**\n * @return {number}\n */\nexport function prev () {\n\tcharacter = position > 0 ? charat(characters, --position) : 0\n\n\tif (column--, character === 10)\n\t\tcolumn = 1, line--\n\n\treturn character\n}\n\n/**\n * @return {number}\n */\nexport function next () {\n\tcharacter = position < length ? charat(characters, position++) : 0\n\n\tif (column++, character === 10)\n\t\tcolumn = 1, line++\n\n\treturn character\n}\n\n/**\n * @return {number}\n */\nexport function peek () {\n\treturn charat(characters, position)\n}\n\n/**\n * @return {number}\n */\nexport function caret () {\n\treturn position\n}\n\n/**\n * @param {number} begin\n * @param {number} end\n * @return {string}\n */\nexport function slice (begin, end) {\n\treturn substr(characters, begin, end)\n}\n\n/**\n * @param {number} type\n * @return {number}\n */\nexport function token (type) {\n\tswitch (type) {\n\t\t// \\0 \\t \\n \\r \\s whitespace token\n\t\tcase 0: case 9: case 10: case 13: case 32:\n\t\t\treturn 5\n\t\t// ! + , / > @ ~ isolate token\n\t\tcase 33: case 43: case 44: case 47: case 62: case 64: case 126:\n\t\t// ; { } breakpoint token\n\t\tcase 59: case 123: case 125:\n\t\t\treturn 4\n\t\t// : accompanied token\n\t\tcase 58:\n\t\t\treturn 3\n\t\t// \" ' ( [ opening delimit token\n\t\tcase 34: case 39: case 40: case 91:\n\t\t\treturn 2\n\t\t// ) ] closing delimit token\n\t\tcase 41: case 93:\n\t\t\treturn 1\n\t}\n\n\treturn 0\n}\n\n/**\n * @param {string} value\n * @return {any[]}\n */\nexport function alloc (value) {\n\treturn line = column = 1, length = strlen(characters = value), position = 0, []\n}\n\n/**\n * @param {any} value\n * @return {any}\n */\nexport function dealloc (value) {\n\treturn characters = '', value\n}\n\n/**\n * @param {number} type\n * @return {string}\n */\nexport function delimit (type) {\n\treturn trim(slice(position - 1, delimiter(type === 91 ? type + 2 : type === 40 ? type + 1 : type)))\n}\n\n/**\n * @param {string} value\n * @return {string[]}\n */\nexport function tokenize (value) {\n\treturn dealloc(tokenizer(alloc(value)))\n}\n\n/**\n * @param {number} type\n * @return {string}\n */\nexport function whitespace (type) {\n\twhile (character = peek())\n\t\tif (character < 33)\n\t\t\tnext()\n\t\telse\n\t\t\tbreak\n\n\treturn token(type) > 2 || token(character) > 3 ? '' : ' '\n}\n\n/**\n * @param {string[]} children\n * @return {string[]}\n */\nexport function tokenizer (children) {\n\twhile (next())\n\t\tswitch (token(character)) {\n\t\t\tcase 0: append(identifier(position - 1), children)\n\t\t\t\tbreak\n\t\t\tcase 2: append(delimit(character), children)\n\t\t\t\tbreak\n\t\t\tdefault: append(from(character), children)\n\t\t}\n\n\treturn children\n}\n\n/**\n * @param {number} index\n * @param {number} count\n * @return {string}\n */\nexport function escaping (index, count) {\n\twhile (--count && next())\n\t\t// not 0-9 A-F a-f\n\t\tif (character < 48 || character > 102 || (character > 57 && character < 65) || (character > 70 && character < 97))\n\t\t\tbreak\n\n\treturn slice(index, caret() + (count < 6 && peek() == 32 && next() == 32))\n}\n\n/**\n * @param {number} type\n * @return {number}\n */\nexport function delimiter (type) {\n\twhile (next())\n\t\tswitch (character) {\n\t\t\t// ] ) \" '\n\t\t\tcase type:\n\t\t\t\treturn position\n\t\t\t// \" '\n\t\t\tcase 34: case 39:\n\t\t\t\tif (type !== 34 && type !== 39)\n\t\t\t\t\tdelimiter(character)\n\t\t\t\tbreak\n\t\t\t// (\n\t\t\tcase 40:\n\t\t\t\tif (type === 41)\n\t\t\t\t\tdelimiter(type)\n\t\t\t\tbreak\n\t\t\t// \\\n\t\t\tcase 92:\n\t\t\t\tnext()\n\t\t\t\tbreak\n\t\t}\n\n\treturn position\n}\n\n/**\n * @param {number} type\n * @param {number} index\n * @return {number}\n */\nexport function commenter (type, index) {\n\twhile (next())\n\t\t// //\n\t\tif (type + character === 47 + 10)\n\t\t\tbreak\n\t\t// /*\n\t\telse if (type + character === 42 + 42 && peek() === 47)\n\t\t\tbreak\n\n\treturn '/*' + slice(index, position - 1) + '*' + from(type === 47 ? type : next())\n}\n\n/**\n * @param {number} index\n * @return {string}\n */\nexport function identifier (index) {\n\twhile (!token(peek()))\n\t\tnext()\n\n\treturn slice(index, position)\n}\n","export var MS = '-ms-'\nexport var MOZ = '-moz-'\nexport var WEBKIT = '-webkit-'\n\nexport var COMMENT = 'comm'\nexport var RULESET = 'rule'\nexport var DECLARATION = 'decl'\n\nexport var PAGE = '@page'\nexport var MEDIA = '@media'\nexport var IMPORT = '@import'\nexport var CHARSET = '@charset'\nexport var VIEWPORT = '@viewport'\nexport var SUPPORTS = '@supports'\nexport var DOCUMENT = '@document'\nexport var NAMESPACE = '@namespace'\nexport var KEYFRAMES = '@keyframes'\nexport var FONT_FACE = '@font-face'\nexport var COUNTER_STYLE = '@counter-style'\nexport var FONT_FEATURE_VALUES = '@font-feature-values'\nexport var LAYER = '@layer'\n","import {IMPORT, LAYER, COMMENT, RULESET, DECLARATION, KEYFRAMES} from './Enum.js'\nimport {strlen, sizeof} from './Utility.js'\n\n/**\n * @param {object[]} children\n * @param {function} callback\n * @return {string}\n */\nexport function serialize (children, callback) {\n\tvar output = ''\n\tvar length = sizeof(children)\n\n\tfor (var i = 0; i < length; i++)\n\t\toutput += callback(children[i], i, children, callback) || ''\n\n\treturn output\n}\n\n/**\n * @param {object} element\n * @param {number} index\n * @param {object[]} children\n * @param {function} callback\n * @return {string}\n */\nexport function stringify (element, index, children, callback) {\n\tswitch (element.type) {\n\t\tcase LAYER: if (element.children.length) break\n\t\tcase IMPORT: case DECLARATION: return element.return = element.return || element.value\n\t\tcase COMMENT: return ''\n\t\tcase KEYFRAMES: return element.return = element.value + '{' + serialize(element.children, callback) + '}'\n\t\tcase RULESET: element.value = element.props.join(',')\n\t}\n\n\treturn strlen(children = serialize(element.children, callback)) ? element.return = element.value + '{' + children + '}' : ''\n}\n","import {COMMENT, RULESET, DECLARATION} from './Enum.js'\nimport {abs, charat, trim, from, sizeof, strlen, substr, append, replace, indexof} from './Utility.js'\nimport {node, char, prev, next, peek, caret, alloc, dealloc, delimit, whitespace, escaping, identifier, commenter} from './Tokenizer.js'\n\n/**\n * @param {string} value\n * @return {object[]}\n */\nexport function compile (value) {\n\treturn dealloc(parse('', null, null, null, [''], value = alloc(value), 0, [0], value))\n}\n\n/**\n * @param {string} value\n * @param {object} root\n * @param {object?} parent\n * @param {string[]} rule\n * @param {string[]} rules\n * @param {string[]} rulesets\n * @param {number[]} pseudo\n * @param {number[]} points\n * @param {string[]} declarations\n * @return {object}\n */\nexport function parse (value, root, parent, rule, rules, rulesets, pseudo, points, declarations) {\n\tvar index = 0\n\tvar offset = 0\n\tvar length = pseudo\n\tvar atrule = 0\n\tvar property = 0\n\tvar previous = 0\n\tvar variable = 1\n\tvar scanning = 1\n\tvar ampersand = 1\n\tvar character = 0\n\tvar type = ''\n\tvar props = rules\n\tvar children = rulesets\n\tvar reference = rule\n\tvar characters = type\n\n\twhile (scanning)\n\t\tswitch (previous = character, character = next()) {\n\t\t\t// (\n\t\t\tcase 40:\n\t\t\t\tif (previous != 108 && charat(characters, length - 1) == 58) {\n\t\t\t\t\tif (indexof(characters += replace(delimit(character), '&', '&\\f'), '&\\f') != -1)\n\t\t\t\t\t\tampersand = -1\n\t\t\t\t\tbreak\n\t\t\t\t}\n\t\t\t// \" ' [\n\t\t\tcase 34: case 39: case 91:\n\t\t\t\tcharacters += delimit(character)\n\t\t\t\tbreak\n\t\t\t// \\t \\n \\r \\s\n\t\t\tcase 9: case 10: case 13: case 32:\n\t\t\t\tcharacters += whitespace(previous)\n\t\t\t\tbreak\n\t\t\t// \\\n\t\t\tcase 92:\n\t\t\t\tcharacters += escaping(caret() - 1, 7)\n\t\t\t\tcontinue\n\t\t\t// /\n\t\t\tcase 47:\n\t\t\t\tswitch (peek()) {\n\t\t\t\t\tcase 42: case 47:\n\t\t\t\t\t\tappend(comment(commenter(next(), caret()), root, parent), declarations)\n\t\t\t\t\t\tbreak\n\t\t\t\t\tdefault:\n\t\t\t\t\t\tcharacters += '/'\n\t\t\t\t}\n\t\t\t\tbreak\n\t\t\t// {\n\t\t\tcase 123 * variable:\n\t\t\t\tpoints[index++] = strlen(characters) * ampersand\n\t\t\t// } ; \\0\n\t\t\tcase 125 * variable: case 59: case 0:\n\t\t\t\tswitch (character) {\n\t\t\t\t\t// \\0 }\n\t\t\t\t\tcase 0: case 125: scanning = 0\n\t\t\t\t\t// ;\n\t\t\t\t\tcase 59 + offset: if (ampersand == -1) characters = replace(characters, /\\f/g, '')\n\t\t\t\t\t\tif (property > 0 && (strlen(characters) - length))\n\t\t\t\t\t\t\tappend(property > 32 ? declaration(characters + ';', rule, parent, length - 1) : declaration(replace(characters, ' ', '') + ';', rule, parent, length - 2), declarations)\n\t\t\t\t\t\tbreak\n\t\t\t\t\t// @ ;\n\t\t\t\t\tcase 59: characters += ';'\n\t\t\t\t\t// { rule/at-rule\n\t\t\t\t\tdefault:\n\t\t\t\t\t\tappend(reference = ruleset(characters, root, parent, index, offset, rules, points, type, props = [], children = [], length), rulesets)\n\n\t\t\t\t\t\tif (character === 123)\n\t\t\t\t\t\t\tif (offset === 0)\n\t\t\t\t\t\t\t\tparse(characters, root, reference, reference, props, rulesets, length, points, children)\n\t\t\t\t\t\t\telse\n\t\t\t\t\t\t\t\tswitch (atrule === 99 && charat(characters, 3) === 110 ? 100 : atrule) {\n\t\t\t\t\t\t\t\t\t// d l m s\n\t\t\t\t\t\t\t\t\tcase 100: case 108: case 109: case 115:\n\t\t\t\t\t\t\t\t\t\tparse(value, reference, reference, rule && append(ruleset(value, reference, reference, 0, 0, rules, points, type, rules, props = [], length), children), rules, children, length, points, rule ? props : children)\n\t\t\t\t\t\t\t\t\t\tbreak\n\t\t\t\t\t\t\t\t\tdefault:\n\t\t\t\t\t\t\t\t\t\tparse(characters, reference, reference, reference, [''], children, 0, points, children)\n\t\t\t\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tindex = offset = property = 0, variable = ampersand = 1, type = characters = '', length = pseudo\n\t\t\t\tbreak\n\t\t\t// :\n\t\t\tcase 58:\n\t\t\t\tlength = 1 + strlen(characters), property = previous\n\t\t\tdefault:\n\t\t\t\tif (variable < 1)\n\t\t\t\t\tif (character == 123)\n\t\t\t\t\t\t--variable\n\t\t\t\t\telse if (character == 125 && variable++ == 0 && prev() == 125)\n\t\t\t\t\t\tcontinue\n\n\t\t\t\tswitch (characters += from(character), character * variable) {\n\t\t\t\t\t// &\n\t\t\t\t\tcase 38:\n\t\t\t\t\t\tampersand = offset > 0 ? 1 : (characters += '\\f', -1)\n\t\t\t\t\t\tbreak\n\t\t\t\t\t// ,\n\t\t\t\t\tcase 44:\n\t\t\t\t\t\tpoints[index++] = (strlen(characters) - 1) * ampersand, ampersand = 1\n\t\t\t\t\t\tbreak\n\t\t\t\t\t// @\n\t\t\t\t\tcase 64:\n\t\t\t\t\t\t// -\n\t\t\t\t\t\tif (peek() === 45)\n\t\t\t\t\t\t\tcharacters += delimit(next())\n\n\t\t\t\t\t\tatrule = peek(), offset = length = strlen(type = characters += identifier(caret())), character++\n\t\t\t\t\t\tbreak\n\t\t\t\t\t// -\n\t\t\t\t\tcase 45:\n\t\t\t\t\t\tif (previous === 45 && strlen(characters) == 2)\n\t\t\t\t\t\t\tvariable = 0\n\t\t\t\t}\n\t\t}\n\n\treturn rulesets\n}\n\n/**\n * @param {string} value\n * @param {object} root\n * @param {object?} parent\n * @param {number} index\n * @param {number} offset\n * @param {string[]} rules\n * @param {number[]} points\n * @param {string} type\n * @param {string[]} props\n * @param {string[]} children\n * @param {number} length\n * @return {object}\n */\nexport function ruleset (value, root, parent, index, offset, rules, points, type, props, children, length) {\n\tvar post = offset - 1\n\tvar rule = offset === 0 ? rules : ['']\n\tvar size = sizeof(rule)\n\n\tfor (var i = 0, j = 0, k = 0; i < index; ++i)\n\t\tfor (var x = 0, y = substr(value, post + 1, post = abs(j = points[i])), z = value; x < size; ++x)\n\t\t\tif (z = trim(j > 0 ? rule[x] + ' ' + y : replace(y, /&\\f/g, rule[x])))\n\t\t\t\tprops[k++] = z\n\n\treturn node(value, root, parent, offset === 0 ? RULESET : type, props, children, length)\n}\n\n/**\n * @param {number} value\n * @param {object} root\n * @param {object?} parent\n * @return {object}\n */\nexport function comment (value, root, parent) {\n\treturn node(value, root, parent, COMMENT, from(char()), substr(value, 2, -2), 0)\n}\n\n/**\n * @param {string} value\n * @param {object} root\n * @param {object?} parent\n * @param {number} length\n * @return {object}\n */\nexport function declaration (value, root, parent, length) {\n\treturn node(value, root, parent, DECLARATION, substr(value, 0, length), substr(value, length + 1, -1), length)\n}\n","import { StyleSheet } from '@emotion/sheet';\nimport { dealloc, alloc, next, token, from, peek, delimit, slice, position, RULESET, combine, match, serialize, copy, replace, WEBKIT, MOZ, MS, KEYFRAMES, DECLARATION, hash, charat, strlen, indexof, stringify, COMMENT, rulesheet, middleware, compile } from 'stylis';\nimport '@emotion/weak-memoize';\nimport '@emotion/memoize';\n\nvar identifierWithPointTracking = function identifierWithPointTracking(begin, points, index) {\n var previous = 0;\n var character = 0;\n\n while (true) {\n previous = character;\n character = peek(); // &\\f\n\n if (previous === 38 && character === 12) {\n points[index] = 1;\n }\n\n if (token(character)) {\n break;\n }\n\n next();\n }\n\n return slice(begin, position);\n};\n\nvar toRules = function toRules(parsed, points) {\n // pretend we've started with a comma\n var index = -1;\n var character = 44;\n\n do {\n switch (token(character)) {\n case 0:\n // &\\f\n if (character === 38 && peek() === 12) {\n // this is not 100% correct, we don't account for literal sequences here - like for example quoted strings\n // stylis inserts \\f after & to know when & where it should replace this sequence with the context selector\n // and when it should just concatenate the outer and inner selectors\n // it's very unlikely for this sequence to actually appear in a different context, so we just leverage this fact here\n points[index] = 1;\n }\n\n parsed[index] += identifierWithPointTracking(position - 1, points, index);\n break;\n\n case 2:\n parsed[index] += delimit(character);\n break;\n\n case 4:\n // comma\n if (character === 44) {\n // colon\n parsed[++index] = peek() === 58 ? '&\\f' : '';\n points[index] = parsed[index].length;\n break;\n }\n\n // fallthrough\n\n default:\n parsed[index] += from(character);\n }\n } while (character = next());\n\n return parsed;\n};\n\nvar getRules = function getRules(value, points) {\n return dealloc(toRules(alloc(value), points));\n}; // WeakSet would be more appropriate, but only WeakMap is supported in IE11\n\n\nvar fixedElements = /* #__PURE__ */new WeakMap();\nvar compat = function compat(element) {\n if (element.type !== 'rule' || !element.parent || // positive .length indicates that this rule contains pseudo\n // negative .length indicates that this rule has been already prefixed\n element.length < 1) {\n return;\n }\n\n var value = element.value,\n parent = element.parent;\n var isImplicitRule = element.column === parent.column && element.line === parent.line;\n\n while (parent.type !== 'rule') {\n parent = parent.parent;\n if (!parent) return;\n } // short-circuit for the simplest case\n\n\n if (element.props.length === 1 && value.charCodeAt(0) !== 58\n /* colon */\n && !fixedElements.get(parent)) {\n return;\n } // if this is an implicitly inserted rule (the one eagerly inserted at the each new nested level)\n // then the props has already been manipulated beforehand as they that array is shared between it and its \"rule parent\"\n\n\n if (isImplicitRule) {\n return;\n }\n\n fixedElements.set(element, true);\n var points = [];\n var rules = getRules(value, points);\n var parentRules = parent.props;\n\n for (var i = 0, k = 0; i < rules.length; i++) {\n for (var j = 0; j < parentRules.length; j++, k++) {\n element.props[k] = points[i] ? rules[i].replace(/&\\f/g, parentRules[j]) : parentRules[j] + \" \" + rules[i];\n }\n }\n};\nvar removeLabel = function removeLabel(element) {\n if (element.type === 'decl') {\n var value = element.value;\n\n if ( // charcode for l\n value.charCodeAt(0) === 108 && // charcode for b\n value.charCodeAt(2) === 98) {\n // this ignores label\n element[\"return\"] = '';\n element.value = '';\n }\n }\n};\nvar ignoreFlag = 'emotion-disable-server-rendering-unsafe-selector-warning-please-do-not-use-this-the-warning-exists-for-a-reason';\n\nvar isIgnoringComment = function isIgnoringComment(element) {\n return element.type === 'comm' && element.children.indexOf(ignoreFlag) > -1;\n};\n\nvar createUnsafeSelectorsAlarm = function createUnsafeSelectorsAlarm(cache) {\n return function (element, index, children) {\n if (element.type !== 'rule' || cache.compat) return;\n var unsafePseudoClasses = element.value.match(/(:first|:nth|:nth-last)-child/g);\n\n if (unsafePseudoClasses) {\n var isNested = !!element.parent; // in nested rules comments become children of the \"auto-inserted\" rule and that's always the `element.parent`\n //\n // considering this input:\n // .a {\n // .b /* comm */ {}\n // color: hotpink;\n // }\n // we get output corresponding to this:\n // .a {\n // & {\n // /* comm */\n // color: hotpink;\n // }\n // .b {}\n // }\n\n var commentContainer = isNested ? element.parent.children : // global rule at the root level\n children;\n\n for (var i = commentContainer.length - 1; i >= 0; i--) {\n var node = commentContainer[i];\n\n if (node.line < element.line) {\n break;\n } // it is quite weird but comments are *usually* put at `column: element.column - 1`\n // so we seek *from the end* for the node that is earlier than the rule's `element` and check that\n // this will also match inputs like this:\n // .a {\n // /* comm */\n // .b {}\n // }\n //\n // but that is fine\n //\n // it would be the easiest to change the placement of the comment to be the first child of the rule:\n // .a {\n // .b { /* comm */ }\n // }\n // with such inputs we wouldn't have to search for the comment at all\n // TODO: consider changing this comment placement in the next major version\n\n\n if (node.column < element.column) {\n if (isIgnoringComment(node)) {\n return;\n }\n\n break;\n }\n }\n\n unsafePseudoClasses.forEach(function (unsafePseudoClass) {\n console.error(\"The pseudo class \\\"\" + unsafePseudoClass + \"\\\" is potentially unsafe when doing server-side rendering. Try changing it to \\\"\" + unsafePseudoClass.split('-child')[0] + \"-of-type\\\".\");\n });\n }\n };\n};\n\nvar isImportRule = function isImportRule(element) {\n return element.type.charCodeAt(1) === 105 && element.type.charCodeAt(0) === 64;\n};\n\nvar isPrependedWithRegularRules = function isPrependedWithRegularRules(index, children) {\n for (var i = index - 1; i >= 0; i--) {\n if (!isImportRule(children[i])) {\n return true;\n }\n }\n\n return false;\n}; // use this to remove incorrect elements from further processing\n// so they don't get handed to the `sheet` (or anything else)\n// as that could potentially lead to additional logs which in turn could be overhelming to the user\n\n\nvar nullifyElement = function nullifyElement(element) {\n element.type = '';\n element.value = '';\n element[\"return\"] = '';\n element.children = '';\n element.props = '';\n};\n\nvar incorrectImportAlarm = function incorrectImportAlarm(element, index, children) {\n if (!isImportRule(element)) {\n return;\n }\n\n if (element.parent) {\n console.error(\"`@import` rules can't be nested inside other rules. Please move it to the top level and put it before regular rules. Keep in mind that they can only be used within global styles.\");\n nullifyElement(element);\n } else if (isPrependedWithRegularRules(index, children)) {\n console.error(\"`@import` rules can't be after other rules. Please put your `@import` rules before your other rules.\");\n nullifyElement(element);\n }\n};\n\n/* eslint-disable no-fallthrough */\n\nfunction prefix(value, length) {\n switch (hash(value, length)) {\n // color-adjust\n case 5103:\n return WEBKIT + 'print-' + value + value;\n // animation, animation-(delay|direction|duration|fill-mode|iteration-count|name|play-state|timing-function)\n\n case 5737:\n case 4201:\n case 3177:\n case 3433:\n case 1641:\n case 4457:\n case 2921: // text-decoration, filter, clip-path, backface-visibility, column, box-decoration-break\n\n case 5572:\n case 6356:\n case 5844:\n case 3191:\n case 6645:\n case 3005: // mask, mask-image, mask-(mode|clip|size), mask-(repeat|origin), mask-position, mask-composite,\n\n case 6391:\n case 5879:\n case 5623:\n case 6135:\n case 4599:\n case 4855: // background-clip, columns, column-(count|fill|gap|rule|rule-color|rule-style|rule-width|span|width)\n\n case 4215:\n case 6389:\n case 5109:\n case 5365:\n case 5621:\n case 3829:\n return WEBKIT + value + value;\n // appearance, user-select, transform, hyphens, text-size-adjust\n\n case 5349:\n case 4246:\n case 4810:\n case 6968:\n case 2756:\n return WEBKIT + value + MOZ + value + MS + value + value;\n // flex, flex-direction\n\n case 6828:\n case 4268:\n return WEBKIT + value + MS + value + value;\n // order\n\n case 6165:\n return WEBKIT + value + MS + 'flex-' + value + value;\n // align-items\n\n case 5187:\n return WEBKIT + value + replace(value, /(\\w+).+(:[^]+)/, WEBKIT + 'box-$1$2' + MS + 'flex-$1$2') + value;\n // align-self\n\n case 5443:\n return WEBKIT + value + MS + 'flex-item-' + replace(value, /flex-|-self/, '') + value;\n // align-content\n\n case 4675:\n return WEBKIT + value + MS + 'flex-line-pack' + replace(value, /align-content|flex-|-self/, '') + value;\n // flex-shrink\n\n case 5548:\n return WEBKIT + value + MS + replace(value, 'shrink', 'negative') + value;\n // flex-basis\n\n case 5292:\n return WEBKIT + value + MS + replace(value, 'basis', 'preferred-size') + value;\n // flex-grow\n\n case 6060:\n return WEBKIT + 'box-' + replace(value, '-grow', '') + WEBKIT + value + MS + replace(value, 'grow', 'positive') + value;\n // transition\n\n case 4554:\n return WEBKIT + replace(value, /([^-])(transform)/g, '$1' + WEBKIT + '$2') + value;\n // cursor\n\n case 6187:\n return replace(replace(replace(value, /(zoom-|grab)/, WEBKIT + '$1'), /(image-set)/, WEBKIT + '$1'), value, '') + value;\n // background, background-image\n\n case 5495:\n case 3959:\n return replace(value, /(image-set\\([^]*)/, WEBKIT + '$1' + '$`$1');\n // justify-content\n\n case 4968:\n return replace(replace(value, /(.+:)(flex-)?(.*)/, WEBKIT + 'box-pack:$3' + MS + 'flex-pack:$3'), /s.+-b[^;]+/, 'justify') + WEBKIT + value + value;\n // (margin|padding)-inline-(start|end)\n\n case 4095:\n case 3583:\n case 4068:\n case 2532:\n return replace(value, /(.+)-inline(.+)/, WEBKIT + '$1$2') + value;\n // (min|max)?(width|height|inline-size|block-size)\n\n case 8116:\n case 7059:\n case 5753:\n case 5535:\n case 5445:\n case 5701:\n case 4933:\n case 4677:\n case 5533:\n case 5789:\n case 5021:\n case 4765:\n // stretch, max-content, min-content, fill-available\n if (strlen(value) - 1 - length > 6) switch (charat(value, length + 1)) {\n // (m)ax-content, (m)in-content\n case 109:\n // -\n if (charat(value, length + 4) !== 45) break;\n // (f)ill-available, (f)it-content\n\n case 102:\n return replace(value, /(.+:)(.+)-([^]+)/, '$1' + WEBKIT + '$2-$3' + '$1' + MOZ + (charat(value, length + 3) == 108 ? '$3' : '$2-$3')) + value;\n // (s)tretch\n\n case 115:\n return ~indexof(value, 'stretch') ? prefix(replace(value, 'stretch', 'fill-available'), length) + value : value;\n }\n break;\n // position: sticky\n\n case 4949:\n // (s)ticky?\n if (charat(value, length + 1) !== 115) break;\n // display: (flex|inline-flex)\n\n case 6444:\n switch (charat(value, strlen(value) - 3 - (~indexof(value, '!important') && 10))) {\n // stic(k)y\n case 107:\n return replace(value, ':', ':' + WEBKIT) + value;\n // (inline-)?fl(e)x\n\n case 101:\n return replace(value, /(.+:)([^;!]+)(;|!.+)?/, '$1' + WEBKIT + (charat(value, 14) === 45 ? 'inline-' : '') + 'box$3' + '$1' + WEBKIT + '$2$3' + '$1' + MS + '$2box$3') + value;\n }\n\n break;\n // writing-mode\n\n case 5936:\n switch (charat(value, length + 11)) {\n // vertical-l(r)\n case 114:\n return WEBKIT + value + MS + replace(value, /[svh]\\w+-[tblr]{2}/, 'tb') + value;\n // vertical-r(l)\n\n case 108:\n return WEBKIT + value + MS + replace(value, /[svh]\\w+-[tblr]{2}/, 'tb-rl') + value;\n // horizontal(-)tb\n\n case 45:\n return WEBKIT + value + MS + replace(value, /[svh]\\w+-[tblr]{2}/, 'lr') + value;\n }\n\n return WEBKIT + value + MS + value + value;\n }\n\n return value;\n}\n\nvar prefixer = function prefixer(element, index, children, callback) {\n if (element.length > -1) if (!element[\"return\"]) switch (element.type) {\n case DECLARATION:\n element[\"return\"] = prefix(element.value, element.length);\n break;\n\n case KEYFRAMES:\n return serialize([copy(element, {\n value: replace(element.value, '@', '@' + WEBKIT)\n })], callback);\n\n case RULESET:\n if (element.length) return combine(element.props, function (value) {\n switch (match(value, /(::plac\\w+|:read-\\w+)/)) {\n // :read-(only|write)\n case ':read-only':\n case ':read-write':\n return serialize([copy(element, {\n props: [replace(value, /:(read-\\w+)/, ':' + MOZ + '$1')]\n })], callback);\n // :placeholder\n\n case '::placeholder':\n return serialize([copy(element, {\n props: [replace(value, /:(plac\\w+)/, ':' + WEBKIT + 'input-$1')]\n }), copy(element, {\n props: [replace(value, /:(plac\\w+)/, ':' + MOZ + '$1')]\n }), copy(element, {\n props: [replace(value, /:(plac\\w+)/, MS + 'input-$1')]\n })], callback);\n }\n\n return '';\n });\n }\n};\n\nvar defaultStylisPlugins = [prefixer];\n\nvar createCache = function createCache(options) {\n var key = options.key;\n\n if (process.env.NODE_ENV !== 'production' && !key) {\n throw new Error(\"You have to configure `key` for your cache. Please make sure it's unique (and not equal to 'css') as it's used for linking styles to your cache.\\n\" + \"If multiple caches share the same key they might \\\"fight\\\" for each other's style elements.\");\n }\n\n if (key === 'css') {\n var ssrStyles = document.querySelectorAll(\"style[data-emotion]:not([data-s])\"); // get SSRed styles out of the way of React's hydration\n // document.head is a safe place to move them to(though note document.head is not necessarily the last place they will be)\n // note this very very intentionally targets all style elements regardless of the key to ensure\n // that creating a cache works inside of render of a React component\n\n Array.prototype.forEach.call(ssrStyles, function (node) {\n // we want to only move elements which have a space in the data-emotion attribute value\n // because that indicates that it is an Emotion 11 server-side rendered style elements\n // while we will already ignore Emotion 11 client-side inserted styles because of the :not([data-s]) part in the selector\n // Emotion 10 client-side inserted styles did not have data-s (but importantly did not have a space in their data-emotion attributes)\n // so checking for the space ensures that loading Emotion 11 after Emotion 10 has inserted some styles\n // will not result in the Emotion 10 styles being destroyed\n var dataEmotionAttribute = node.getAttribute('data-emotion');\n\n if (dataEmotionAttribute.indexOf(' ') === -1) {\n return;\n }\n document.head.appendChild(node);\n node.setAttribute('data-s', '');\n });\n }\n\n var stylisPlugins = options.stylisPlugins || defaultStylisPlugins;\n\n if (process.env.NODE_ENV !== 'production') {\n // $FlowFixMe\n if (/[^a-z-]/.test(key)) {\n throw new Error(\"Emotion key must only contain lower case alphabetical characters and - but \\\"\" + key + \"\\\" was passed\");\n }\n }\n\n var inserted = {};\n var container;\n var nodesToHydrate = [];\n\n {\n container = options.container || document.head;\n Array.prototype.forEach.call( // this means we will ignore elements which don't have a space in them which\n // means that the style elements we're looking at are only Emotion 11 server-rendered style elements\n document.querySelectorAll(\"style[data-emotion^=\\\"\" + key + \" \\\"]\"), function (node) {\n var attrib = node.getAttribute(\"data-emotion\").split(' '); // $FlowFixMe\n\n for (var i = 1; i < attrib.length; i++) {\n inserted[attrib[i]] = true;\n }\n\n nodesToHydrate.push(node);\n });\n }\n\n var _insert;\n\n var omnipresentPlugins = [compat, removeLabel];\n\n if (process.env.NODE_ENV !== 'production') {\n omnipresentPlugins.push(createUnsafeSelectorsAlarm({\n get compat() {\n return cache.compat;\n }\n\n }), incorrectImportAlarm);\n }\n\n {\n var currentSheet;\n var finalizingPlugins = [stringify, process.env.NODE_ENV !== 'production' ? function (element) {\n if (!element.root) {\n if (element[\"return\"]) {\n currentSheet.insert(element[\"return\"]);\n } else if (element.value && element.type !== COMMENT) {\n // insert empty rule in non-production environments\n // so @emotion/jest can grab `key` from the (JS)DOM for caches without any rules inserted yet\n currentSheet.insert(element.value + \"{}\");\n }\n }\n } : rulesheet(function (rule) {\n currentSheet.insert(rule);\n })];\n var serializer = middleware(omnipresentPlugins.concat(stylisPlugins, finalizingPlugins));\n\n var stylis = function stylis(styles) {\n return serialize(compile(styles), serializer);\n };\n\n _insert = function insert(selector, serialized, sheet, shouldCache) {\n currentSheet = sheet;\n\n if (process.env.NODE_ENV !== 'production' && serialized.map !== undefined) {\n currentSheet = {\n insert: function insert(rule) {\n sheet.insert(rule + serialized.map);\n }\n };\n }\n\n stylis(selector ? selector + \"{\" + serialized.styles + \"}\" : serialized.styles);\n\n if (shouldCache) {\n cache.inserted[serialized.name] = true;\n }\n };\n }\n\n var cache = {\n key: key,\n sheet: new StyleSheet({\n key: key,\n container: container,\n nonce: options.nonce,\n speedy: options.speedy,\n prepend: options.prepend,\n insertionPoint: options.insertionPoint\n }),\n nonce: options.nonce,\n inserted: inserted,\n registered: {},\n insert: _insert\n };\n cache.sheet.hydrate(nodesToHydrate);\n return cache;\n};\n\nexport { createCache as default };\n","import {MS, MOZ, WEBKIT, RULESET, KEYFRAMES, DECLARATION} from './Enum.js'\nimport {match, charat, substr, strlen, sizeof, replace, combine} from './Utility.js'\nimport {copy, tokenize} from './Tokenizer.js'\nimport {serialize} from './Serializer.js'\nimport {prefix} from './Prefixer.js'\n\n/**\n * @param {function[]} collection\n * @return {function}\n */\nexport function middleware (collection) {\n\tvar length = sizeof(collection)\n\n\treturn function (element, index, children, callback) {\n\t\tvar output = ''\n\n\t\tfor (var i = 0; i < length; i++)\n\t\t\toutput += collection[i](element, index, children, callback) || ''\n\n\t\treturn output\n\t}\n}\n\n/**\n * @param {function} callback\n * @return {function}\n */\nexport function rulesheet (callback) {\n\treturn function (element) {\n\t\tif (!element.root)\n\t\t\tif (element = element.return)\n\t\t\t\tcallback(element)\n\t}\n}\n\n/**\n * @param {object} element\n * @param {number} index\n * @param {object[]} children\n * @param {function} callback\n */\nexport function prefixer (element, index, children, callback) {\n\tif (element.length > -1)\n\t\tif (!element.return)\n\t\t\tswitch (element.type) {\n\t\t\t\tcase DECLARATION: element.return = prefix(element.value, element.length, children)\n\t\t\t\t\treturn\n\t\t\t\tcase KEYFRAMES:\n\t\t\t\t\treturn serialize([copy(element, {value: replace(element.value, '@', '@' + WEBKIT)})], callback)\n\t\t\t\tcase RULESET:\n\t\t\t\t\tif (element.length)\n\t\t\t\t\t\treturn combine(element.props, function (value) {\n\t\t\t\t\t\t\tswitch (match(value, /(::plac\\w+|:read-\\w+)/)) {\n\t\t\t\t\t\t\t\t// :read-(only|write)\n\t\t\t\t\t\t\t\tcase ':read-only': case ':read-write':\n\t\t\t\t\t\t\t\t\treturn serialize([copy(element, {props: [replace(value, /:(read-\\w+)/, ':' + MOZ + '$1')]})], callback)\n\t\t\t\t\t\t\t\t// :placeholder\n\t\t\t\t\t\t\t\tcase '::placeholder':\n\t\t\t\t\t\t\t\t\treturn serialize([\n\t\t\t\t\t\t\t\t\t\tcopy(element, {props: [replace(value, /:(plac\\w+)/, ':' + WEBKIT + 'input-$1')]}),\n\t\t\t\t\t\t\t\t\t\tcopy(element, {props: [replace(value, /:(plac\\w+)/, ':' + MOZ + '$1')]}),\n\t\t\t\t\t\t\t\t\t\tcopy(element, {props: [replace(value, /:(plac\\w+)/, MS + 'input-$1')]})\n\t\t\t\t\t\t\t\t\t], callback)\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\treturn ''\n\t\t\t\t\t\t})\n\t\t\t}\n}\n\n/**\n * @param {object} element\n * @param {number} index\n * @param {object[]} children\n */\nexport function namespace (element) {\n\tswitch (element.type) {\n\t\tcase RULESET:\n\t\t\telement.props = element.props.map(function (value) {\n\t\t\t\treturn combine(tokenize(value), function (value, index, children) {\n\t\t\t\t\tswitch (charat(value, 0)) {\n\t\t\t\t\t\t// \\f\n\t\t\t\t\t\tcase 12:\n\t\t\t\t\t\t\treturn substr(value, 1, strlen(value))\n\t\t\t\t\t\t// \\0 ( + > ~\n\t\t\t\t\t\tcase 0: case 40: case 43: case 62: case 126:\n\t\t\t\t\t\t\treturn value\n\t\t\t\t\t\t// :\n\t\t\t\t\t\tcase 58:\n\t\t\t\t\t\t\tif (children[++index] === 'global')\n\t\t\t\t\t\t\t\tchildren[index] = '', children[++index] = '\\f' + substr(children[index], index = 1, -1)\n\t\t\t\t\t\t// \\s\n\t\t\t\t\t\tcase 32:\n\t\t\t\t\t\t\treturn index === 1 ? '' : value\n\t\t\t\t\t\tdefault:\n\t\t\t\t\t\t\tswitch (index) {\n\t\t\t\t\t\t\t\tcase 0: element = value\n\t\t\t\t\t\t\t\t\treturn sizeof(children) > 1 ? '' : value\n\t\t\t\t\t\t\t\tcase index = sizeof(children) - 1: case 2:\n\t\t\t\t\t\t\t\t\treturn index === 2 ? value + element + element : value + element\n\t\t\t\t\t\t\t\tdefault:\n\t\t\t\t\t\t\t\t\treturn value\n\t\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t})\n\t}\n}\n","function memoize(fn) {\n var cache = Object.create(null);\n return function (arg) {\n if (cache[arg] === undefined) cache[arg] = fn(arg);\n return cache[arg];\n };\n}\n\nexport { memoize as default };\n","import * as React from 'react';\nimport { useContext, forwardRef } from 'react';\nimport createCache from '@emotion/cache';\nimport _extends from '@babel/runtime/helpers/esm/extends';\nimport weakMemoize from '@emotion/weak-memoize';\nimport hoistNonReactStatics from '../_isolated-hnrs/dist/emotion-react-_isolated-hnrs.browser.esm.js';\nimport { getRegisteredStyles, registerStyles, insertStyles } from '@emotion/utils';\nimport { serializeStyles } from '@emotion/serialize';\nimport { useInsertionEffectAlwaysWithSyncFallback } from '@emotion/use-insertion-effect-with-fallbacks';\n\nvar isBrowser = \"object\" !== 'undefined';\nvar hasOwnProperty = {}.hasOwnProperty;\n\nvar EmotionCacheContext = /* #__PURE__ */React.createContext( // we're doing this to avoid preconstruct's dead code elimination in this one case\n// because this module is primarily intended for the browser and node\n// but it's also required in react native and similar environments sometimes\n// and we could have a special build just for that\n// but this is much easier and the native packages\n// might use a different theme context in the future anyway\ntypeof HTMLElement !== 'undefined' ? /* #__PURE__ */createCache({\n key: 'css'\n}) : null);\n\nif (process.env.NODE_ENV !== 'production') {\n EmotionCacheContext.displayName = 'EmotionCacheContext';\n}\n\nvar CacheProvider = EmotionCacheContext.Provider;\nvar __unsafe_useEmotionCache = function useEmotionCache() {\n return useContext(EmotionCacheContext);\n};\n\nvar withEmotionCache = function withEmotionCache(func) {\n // $FlowFixMe\n return /*#__PURE__*/forwardRef(function (props, ref) {\n // the cache will never be null in the browser\n var cache = useContext(EmotionCacheContext);\n return func(props, cache, ref);\n });\n};\n\nif (!isBrowser) {\n withEmotionCache = function withEmotionCache(func) {\n return function (props) {\n var cache = useContext(EmotionCacheContext);\n\n if (cache === null) {\n // yes, we're potentially creating this on every render\n // it doesn't actually matter though since it's only on the server\n // so there will only every be a single render\n // that could change in the future because of suspense and etc. but for now,\n // this works and i don't want to optimise for a future thing that we aren't sure about\n cache = createCache({\n key: 'css'\n });\n return /*#__PURE__*/React.createElement(EmotionCacheContext.Provider, {\n value: cache\n }, func(props, cache));\n } else {\n return func(props, cache);\n }\n };\n };\n}\n\nvar ThemeContext = /* #__PURE__ */React.createContext({});\n\nif (process.env.NODE_ENV !== 'production') {\n ThemeContext.displayName = 'EmotionThemeContext';\n}\n\nvar useTheme = function useTheme() {\n return React.useContext(ThemeContext);\n};\n\nvar getTheme = function getTheme(outerTheme, theme) {\n if (typeof theme === 'function') {\n var mergedTheme = theme(outerTheme);\n\n if (process.env.NODE_ENV !== 'production' && (mergedTheme == null || typeof mergedTheme !== 'object' || Array.isArray(mergedTheme))) {\n throw new Error('[ThemeProvider] Please return an object from your theme function, i.e. theme={() => ({})}!');\n }\n\n return mergedTheme;\n }\n\n if (process.env.NODE_ENV !== 'production' && (theme == null || typeof theme !== 'object' || Array.isArray(theme))) {\n throw new Error('[ThemeProvider] Please make your theme prop a plain object');\n }\n\n return _extends({}, outerTheme, theme);\n};\n\nvar createCacheWithTheme = /* #__PURE__ */weakMemoize(function (outerTheme) {\n return weakMemoize(function (theme) {\n return getTheme(outerTheme, theme);\n });\n});\nvar ThemeProvider = function ThemeProvider(props) {\n var theme = React.useContext(ThemeContext);\n\n if (props.theme !== theme) {\n theme = createCacheWithTheme(theme)(props.theme);\n }\n\n return /*#__PURE__*/React.createElement(ThemeContext.Provider, {\n value: theme\n }, props.children);\n};\nfunction withTheme(Component) {\n var componentName = Component.displayName || Component.name || 'Component';\n\n var render = function render(props, ref) {\n var theme = React.useContext(ThemeContext);\n return /*#__PURE__*/React.createElement(Component, _extends({\n theme: theme,\n ref: ref\n }, props));\n }; // $FlowFixMe\n\n\n var WithTheme = /*#__PURE__*/React.forwardRef(render);\n WithTheme.displayName = \"WithTheme(\" + componentName + \")\";\n return hoistNonReactStatics(WithTheme, Component);\n}\n\nvar getLastPart = function getLastPart(functionName) {\n // The match may be something like 'Object.createEmotionProps' or\n // 'Loader.prototype.render'\n var parts = functionName.split('.');\n return parts[parts.length - 1];\n};\n\nvar getFunctionNameFromStackTraceLine = function getFunctionNameFromStackTraceLine(line) {\n // V8\n var match = /^\\s+at\\s+([A-Za-z0-9$.]+)\\s/.exec(line);\n if (match) return getLastPart(match[1]); // Safari / Firefox\n\n match = /^([A-Za-z0-9$.]+)@/.exec(line);\n if (match) return getLastPart(match[1]);\n return undefined;\n};\n\nvar internalReactFunctionNames = /* #__PURE__ */new Set(['renderWithHooks', 'processChild', 'finishClassComponent', 'renderToString']); // These identifiers come from error stacks, so they have to be valid JS\n// identifiers, thus we only need to replace what is a valid character for JS,\n// but not for CSS.\n\nvar sanitizeIdentifier = function sanitizeIdentifier(identifier) {\n return identifier.replace(/\\$/g, '-');\n};\n\nvar getLabelFromStackTrace = function getLabelFromStackTrace(stackTrace) {\n if (!stackTrace) return undefined;\n var lines = stackTrace.split('\\n');\n\n for (var i = 0; i < lines.length; i++) {\n var functionName = getFunctionNameFromStackTraceLine(lines[i]); // The first line of V8 stack traces is just \"Error\"\n\n if (!functionName) continue; // If we reach one of these, we have gone too far and should quit\n\n if (internalReactFunctionNames.has(functionName)) break; // The component name is the first function in the stack that starts with an\n // uppercase letter\n\n if (/^[A-Z]/.test(functionName)) return sanitizeIdentifier(functionName);\n }\n\n return undefined;\n};\n\nvar typePropName = '__EMOTION_TYPE_PLEASE_DO_NOT_USE__';\nvar labelPropName = '__EMOTION_LABEL_PLEASE_DO_NOT_USE__';\nvar createEmotionProps = function createEmotionProps(type, props) {\n if (process.env.NODE_ENV !== 'production' && typeof props.css === 'string' && // check if there is a css declaration\n props.css.indexOf(':') !== -1) {\n throw new Error(\"Strings are not allowed as css prop values, please wrap it in a css template literal from '@emotion/react' like this: css`\" + props.css + \"`\");\n }\n\n var newProps = {};\n\n for (var key in props) {\n if (hasOwnProperty.call(props, key)) {\n newProps[key] = props[key];\n }\n }\n\n newProps[typePropName] = type; // For performance, only call getLabelFromStackTrace in development and when\n // the label hasn't already been computed\n\n if (process.env.NODE_ENV !== 'production' && !!props.css && (typeof props.css !== 'object' || typeof props.css.name !== 'string' || props.css.name.indexOf('-') === -1)) {\n var label = getLabelFromStackTrace(new Error().stack);\n if (label) newProps[labelPropName] = label;\n }\n\n return newProps;\n};\n\nvar Insertion = function Insertion(_ref) {\n var cache = _ref.cache,\n serialized = _ref.serialized,\n isStringTag = _ref.isStringTag;\n registerStyles(cache, serialized, isStringTag);\n useInsertionEffectAlwaysWithSyncFallback(function () {\n return insertStyles(cache, serialized, isStringTag);\n });\n\n return null;\n};\n\nvar Emotion = /* #__PURE__ */withEmotionCache(function (props, cache, ref) {\n var cssProp = props.css; // so that using `css` from `emotion` and passing the result to the css prop works\n // not passing the registered cache to serializeStyles because it would\n // make certain babel optimisations not possible\n\n if (typeof cssProp === 'string' && cache.registered[cssProp] !== undefined) {\n cssProp = cache.registered[cssProp];\n }\n\n var WrappedComponent = props[typePropName];\n var registeredStyles = [cssProp];\n var className = '';\n\n if (typeof props.className === 'string') {\n className = getRegisteredStyles(cache.registered, registeredStyles, props.className);\n } else if (props.className != null) {\n className = props.className + \" \";\n }\n\n var serialized = serializeStyles(registeredStyles, undefined, React.useContext(ThemeContext));\n\n if (process.env.NODE_ENV !== 'production' && serialized.name.indexOf('-') === -1) {\n var labelFromStack = props[labelPropName];\n\n if (labelFromStack) {\n serialized = serializeStyles([serialized, 'label:' + labelFromStack + ';']);\n }\n }\n\n className += cache.key + \"-\" + serialized.name;\n var newProps = {};\n\n for (var key in props) {\n if (hasOwnProperty.call(props, key) && key !== 'css' && key !== typePropName && (process.env.NODE_ENV === 'production' || key !== labelPropName)) {\n newProps[key] = props[key];\n }\n }\n\n newProps.ref = ref;\n newProps.className = className;\n return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Insertion, {\n cache: cache,\n serialized: serialized,\n isStringTag: typeof WrappedComponent === 'string'\n }), /*#__PURE__*/React.createElement(WrappedComponent, newProps));\n});\n\nif (process.env.NODE_ENV !== 'production') {\n Emotion.displayName = 'EmotionCssPropInternal';\n}\n\nvar Emotion$1 = Emotion;\n\nexport { CacheProvider as C, Emotion$1 as E, ThemeContext as T, __unsafe_useEmotionCache as _, ThemeProvider as a, withTheme as b, createEmotionProps as c, hasOwnProperty as h, isBrowser as i, useTheme as u, withEmotionCache as w };\n","import { h as hasOwnProperty, E as Emotion, c as createEmotionProps, w as withEmotionCache, T as ThemeContext, i as isBrowser$1 } from './emotion-element-c39617d8.browser.esm.js';\nexport { C as CacheProvider, T as ThemeContext, a as ThemeProvider, _ as __unsafe_useEmotionCache, u as useTheme, w as withEmotionCache, b as withTheme } from './emotion-element-c39617d8.browser.esm.js';\nimport * as React from 'react';\nimport { insertStyles, registerStyles, getRegisteredStyles } from '@emotion/utils';\nimport { useInsertionEffectWithLayoutFallback, useInsertionEffectAlwaysWithSyncFallback } from '@emotion/use-insertion-effect-with-fallbacks';\nimport { serializeStyles } from '@emotion/serialize';\nimport '@emotion/cache';\nimport '@babel/runtime/helpers/extends';\nimport '@emotion/weak-memoize';\nimport '../_isolated-hnrs/dist/emotion-react-_isolated-hnrs.browser.esm.js';\nimport 'hoist-non-react-statics';\n\nvar pkg = {\n\tname: \"@emotion/react\",\n\tversion: \"11.11.3\",\n\tmain: \"dist/emotion-react.cjs.js\",\n\tmodule: \"dist/emotion-react.esm.js\",\n\tbrowser: {\n\t\t\"./dist/emotion-react.esm.js\": \"./dist/emotion-react.browser.esm.js\"\n\t},\n\texports: {\n\t\t\".\": {\n\t\t\tmodule: {\n\t\t\t\tworker: \"./dist/emotion-react.worker.esm.js\",\n\t\t\t\tbrowser: \"./dist/emotion-react.browser.esm.js\",\n\t\t\t\t\"default\": \"./dist/emotion-react.esm.js\"\n\t\t\t},\n\t\t\t\"import\": \"./dist/emotion-react.cjs.mjs\",\n\t\t\t\"default\": \"./dist/emotion-react.cjs.js\"\n\t\t},\n\t\t\"./jsx-runtime\": {\n\t\t\tmodule: {\n\t\t\t\tworker: \"./jsx-runtime/dist/emotion-react-jsx-runtime.worker.esm.js\",\n\t\t\t\tbrowser: \"./jsx-runtime/dist/emotion-react-jsx-runtime.browser.esm.js\",\n\t\t\t\t\"default\": \"./jsx-runtime/dist/emotion-react-jsx-runtime.esm.js\"\n\t\t\t},\n\t\t\t\"import\": \"./jsx-runtime/dist/emotion-react-jsx-runtime.cjs.mjs\",\n\t\t\t\"default\": \"./jsx-runtime/dist/emotion-react-jsx-runtime.cjs.js\"\n\t\t},\n\t\t\"./_isolated-hnrs\": {\n\t\t\tmodule: {\n\t\t\t\tworker: \"./_isolated-hnrs/dist/emotion-react-_isolated-hnrs.worker.esm.js\",\n\t\t\t\tbrowser: \"./_isolated-hnrs/dist/emotion-react-_isolated-hnrs.browser.esm.js\",\n\t\t\t\t\"default\": \"./_isolated-hnrs/dist/emotion-react-_isolated-hnrs.esm.js\"\n\t\t\t},\n\t\t\t\"import\": \"./_isolated-hnrs/dist/emotion-react-_isolated-hnrs.cjs.mjs\",\n\t\t\t\"default\": \"./_isolated-hnrs/dist/emotion-react-_isolated-hnrs.cjs.js\"\n\t\t},\n\t\t\"./jsx-dev-runtime\": {\n\t\t\tmodule: {\n\t\t\t\tworker: \"./jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.worker.esm.js\",\n\t\t\t\tbrowser: \"./jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.browser.esm.js\",\n\t\t\t\t\"default\": \"./jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.esm.js\"\n\t\t\t},\n\t\t\t\"import\": \"./jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.cjs.mjs\",\n\t\t\t\"default\": \"./jsx-dev-runtime/dist/emotion-react-jsx-dev-runtime.cjs.js\"\n\t\t},\n\t\t\"./package.json\": \"./package.json\",\n\t\t\"./types/css-prop\": \"./types/css-prop.d.ts\",\n\t\t\"./macro\": {\n\t\t\ttypes: {\n\t\t\t\t\"import\": \"./macro.d.mts\",\n\t\t\t\t\"default\": \"./macro.d.ts\"\n\t\t\t},\n\t\t\t\"default\": \"./macro.js\"\n\t\t}\n\t},\n\ttypes: \"types/index.d.ts\",\n\tfiles: [\n\t\t\"src\",\n\t\t\"dist\",\n\t\t\"jsx-runtime\",\n\t\t\"jsx-dev-runtime\",\n\t\t\"_isolated-hnrs\",\n\t\t\"types/*.d.ts\",\n\t\t\"macro.*\"\n\t],\n\tsideEffects: false,\n\tauthor: \"Emotion Contributors\",\n\tlicense: \"MIT\",\n\tscripts: {\n\t\t\"test:typescript\": \"dtslint types\"\n\t},\n\tdependencies: {\n\t\t\"@babel/runtime\": \"^7.18.3\",\n\t\t\"@emotion/babel-plugin\": \"^11.11.0\",\n\t\t\"@emotion/cache\": \"^11.11.0\",\n\t\t\"@emotion/serialize\": \"^1.1.3\",\n\t\t\"@emotion/use-insertion-effect-with-fallbacks\": \"^1.0.1\",\n\t\t\"@emotion/utils\": \"^1.2.1\",\n\t\t\"@emotion/weak-memoize\": \"^0.3.1\",\n\t\t\"hoist-non-react-statics\": \"^3.3.1\"\n\t},\n\tpeerDependencies: {\n\t\treact: \">=16.8.0\"\n\t},\n\tpeerDependenciesMeta: {\n\t\t\"@types/react\": {\n\t\t\toptional: true\n\t\t}\n\t},\n\tdevDependencies: {\n\t\t\"@definitelytyped/dtslint\": \"0.0.112\",\n\t\t\"@emotion/css\": \"11.11.2\",\n\t\t\"@emotion/css-prettifier\": \"1.1.3\",\n\t\t\"@emotion/server\": \"11.11.0\",\n\t\t\"@emotion/styled\": \"11.11.0\",\n\t\t\"html-tag-names\": \"^1.1.2\",\n\t\treact: \"16.14.0\",\n\t\t\"svg-tag-names\": \"^1.1.1\",\n\t\ttypescript: \"^4.5.5\"\n\t},\n\trepository: \"https://github.com/emotion-js/emotion/tree/main/packages/react\",\n\tpublishConfig: {\n\t\taccess: \"public\"\n\t},\n\t\"umd:main\": \"dist/emotion-react.umd.min.js\",\n\tpreconstruct: {\n\t\tentrypoints: [\n\t\t\t\"./index.js\",\n\t\t\t\"./jsx-runtime.js\",\n\t\t\t\"./jsx-dev-runtime.js\",\n\t\t\t\"./_isolated-hnrs.js\"\n\t\t],\n\t\tumdName: \"emotionReact\",\n\t\texports: {\n\t\t\tenvConditions: [\n\t\t\t\t\"browser\",\n\t\t\t\t\"worker\"\n\t\t\t],\n\t\t\textra: {\n\t\t\t\t\"./types/css-prop\": \"./types/css-prop.d.ts\",\n\t\t\t\t\"./macro\": {\n\t\t\t\t\ttypes: {\n\t\t\t\t\t\t\"import\": \"./macro.d.mts\",\n\t\t\t\t\t\t\"default\": \"./macro.d.ts\"\n\t\t\t\t\t},\n\t\t\t\t\t\"default\": \"./macro.js\"\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n};\n\nvar jsx = function jsx(type, props) {\n var args = arguments;\n\n if (props == null || !hasOwnProperty.call(props, 'css')) {\n // $FlowFixMe\n return React.createElement.apply(undefined, args);\n }\n\n var argsLength = args.length;\n var createElementArgArray = new Array(argsLength);\n createElementArgArray[0] = Emotion;\n createElementArgArray[1] = createEmotionProps(type, props);\n\n for (var i = 2; i < argsLength; i++) {\n createElementArgArray[i] = args[i];\n } // $FlowFixMe\n\n\n return React.createElement.apply(null, createElementArgArray);\n};\n\nvar warnedAboutCssPropForGlobal = false; // maintain place over rerenders.\n// initial render from browser, insertBefore context.sheet.tags[0] or if a style hasn't been inserted there yet, appendChild\n// initial client-side render from SSR, use place of hydrating tag\n\nvar Global = /* #__PURE__ */withEmotionCache(function (props, cache) {\n if (process.env.NODE_ENV !== 'production' && !warnedAboutCssPropForGlobal && ( // check for className as well since the user is\n // probably using the custom createElement which\n // means it will be turned into a className prop\n // $FlowFixMe I don't really want to add it to the type since it shouldn't be used\n props.className || props.css)) {\n console.error(\"It looks like you're using the css prop on Global, did you mean to use the styles prop instead?\");\n warnedAboutCssPropForGlobal = true;\n }\n\n var styles = props.styles;\n var serialized = serializeStyles([styles], undefined, React.useContext(ThemeContext));\n\n if (!isBrowser$1) {\n var _ref;\n\n var serializedNames = serialized.name;\n var serializedStyles = serialized.styles;\n var next = serialized.next;\n\n while (next !== undefined) {\n serializedNames += ' ' + next.name;\n serializedStyles += next.styles;\n next = next.next;\n }\n\n var shouldCache = cache.compat === true;\n var rules = cache.insert(\"\", {\n name: serializedNames,\n styles: serializedStyles\n }, cache.sheet, shouldCache);\n\n if (shouldCache) {\n return null;\n }\n\n return /*#__PURE__*/React.createElement(\"style\", (_ref = {}, _ref[\"data-emotion\"] = cache.key + \"-global \" + serializedNames, _ref.dangerouslySetInnerHTML = {\n __html: rules\n }, _ref.nonce = cache.sheet.nonce, _ref));\n } // yes, i know these hooks are used conditionally\n // but it is based on a constant that will never change at runtime\n // it's effectively like having two implementations and switching them out\n // so it's not actually breaking anything\n\n\n var sheetRef = React.useRef();\n useInsertionEffectWithLayoutFallback(function () {\n var key = cache.key + \"-global\"; // use case of https://github.com/emotion-js/emotion/issues/2675\n\n var sheet = new cache.sheet.constructor({\n key: key,\n nonce: cache.sheet.nonce,\n container: cache.sheet.container,\n speedy: cache.sheet.isSpeedy\n });\n var rehydrating = false; // $FlowFixMe\n\n var node = document.querySelector(\"style[data-emotion=\\\"\" + key + \" \" + serialized.name + \"\\\"]\");\n\n if (cache.sheet.tags.length) {\n sheet.before = cache.sheet.tags[0];\n }\n\n if (node !== null) {\n rehydrating = true; // clear the hash so this node won't be recognizable as rehydratable by other s\n\n node.setAttribute('data-emotion', key);\n sheet.hydrate([node]);\n }\n\n sheetRef.current = [sheet, rehydrating];\n return function () {\n sheet.flush();\n };\n }, [cache]);\n useInsertionEffectWithLayoutFallback(function () {\n var sheetRefCurrent = sheetRef.current;\n var sheet = sheetRefCurrent[0],\n rehydrating = sheetRefCurrent[1];\n\n if (rehydrating) {\n sheetRefCurrent[1] = false;\n return;\n }\n\n if (serialized.next !== undefined) {\n // insert keyframes\n insertStyles(cache, serialized.next, true);\n }\n\n if (sheet.tags.length) {\n // if this doesn't exist then it will be null so the style element will be appended\n var element = sheet.tags[sheet.tags.length - 1].nextElementSibling;\n sheet.before = element;\n sheet.flush();\n }\n\n cache.insert(\"\", serialized, sheet, false);\n }, [cache, serialized.name]);\n return null;\n});\n\nif (process.env.NODE_ENV !== 'production') {\n Global.displayName = 'EmotionGlobal';\n}\n\nfunction css() {\n for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {\n args[_key] = arguments[_key];\n }\n\n return serializeStyles(args);\n}\n\nvar keyframes = function keyframes() {\n var insertable = css.apply(void 0, arguments);\n var name = \"animation-\" + insertable.name; // $FlowFixMe\n\n return {\n name: name,\n styles: \"@keyframes \" + name + \"{\" + insertable.styles + \"}\",\n anim: 1,\n toString: function toString() {\n return \"_EMO_\" + this.name + \"_\" + this.styles + \"_EMO_\";\n }\n };\n};\n\nvar classnames = function classnames(args) {\n var len = args.length;\n var i = 0;\n var cls = '';\n\n for (; i < len; i++) {\n var arg = args[i];\n if (arg == null) continue;\n var toAdd = void 0;\n\n switch (typeof arg) {\n case 'boolean':\n break;\n\n case 'object':\n {\n if (Array.isArray(arg)) {\n toAdd = classnames(arg);\n } else {\n if (process.env.NODE_ENV !== 'production' && arg.styles !== undefined && arg.name !== undefined) {\n console.error('You have passed styles created with `css` from `@emotion/react` package to the `cx`.\\n' + '`cx` is meant to compose class names (strings) so you should convert those styles to a class name by passing them to the `css` received from component.');\n }\n\n toAdd = '';\n\n for (var k in arg) {\n if (arg[k] && k) {\n toAdd && (toAdd += ' ');\n toAdd += k;\n }\n }\n }\n\n break;\n }\n\n default:\n {\n toAdd = arg;\n }\n }\n\n if (toAdd) {\n cls && (cls += ' ');\n cls += toAdd;\n }\n }\n\n return cls;\n};\n\nfunction merge(registered, css, className) {\n var registeredStyles = [];\n var rawClassName = getRegisteredStyles(registered, registeredStyles, className);\n\n if (registeredStyles.length < 2) {\n return className;\n }\n\n return rawClassName + css(registeredStyles);\n}\n\nvar Insertion = function Insertion(_ref) {\n var cache = _ref.cache,\n serializedArr = _ref.serializedArr;\n useInsertionEffectAlwaysWithSyncFallback(function () {\n\n for (var i = 0; i < serializedArr.length; i++) {\n insertStyles(cache, serializedArr[i], false);\n }\n });\n\n return null;\n};\n\nvar ClassNames = /* #__PURE__ */withEmotionCache(function (props, cache) {\n var hasRendered = false;\n var serializedArr = [];\n\n var css = function css() {\n if (hasRendered && process.env.NODE_ENV !== 'production') {\n throw new Error('css can only be used during render');\n }\n\n for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {\n args[_key] = arguments[_key];\n }\n\n var serialized = serializeStyles(args, cache.registered);\n serializedArr.push(serialized); // registration has to happen here as the result of this might get consumed by `cx`\n\n registerStyles(cache, serialized, false);\n return cache.key + \"-\" + serialized.name;\n };\n\n var cx = function cx() {\n if (hasRendered && process.env.NODE_ENV !== 'production') {\n throw new Error('cx can only be used during render');\n }\n\n for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {\n args[_key2] = arguments[_key2];\n }\n\n return merge(cache.registered, css, classnames(args));\n };\n\n var content = {\n css: css,\n cx: cx,\n theme: React.useContext(ThemeContext)\n };\n var ele = props.children(content);\n hasRendered = true;\n return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Insertion, {\n cache: cache,\n serializedArr: serializedArr\n }), ele);\n});\n\nif (process.env.NODE_ENV !== 'production') {\n ClassNames.displayName = 'EmotionClassNames';\n}\n\nif (process.env.NODE_ENV !== 'production') {\n var isBrowser = \"object\" !== 'undefined'; // #1727, #2905 for some reason Jest and Vitest evaluate modules twice if some consuming module gets mocked\n\n var isTestEnv = typeof jest !== 'undefined' || typeof vi !== 'undefined';\n\n if (isBrowser && !isTestEnv) {\n // globalThis has wide browser support - https://caniuse.com/?search=globalThis, Node.js 12 and later\n var globalContext = // $FlowIgnore\n typeof globalThis !== 'undefined' ? globalThis // eslint-disable-line no-undef\n : isBrowser ? window : global;\n var globalKey = \"__EMOTION_REACT_\" + pkg.version.split('.')[0] + \"__\";\n\n if (globalContext[globalKey]) {\n console.warn('You are loading @emotion/react when it is already loaded. Running ' + 'multiple instances may cause problems. This can happen if multiple ' + 'versions are used, or if multiple builds of the same version are ' + 'used.');\n }\n\n globalContext[globalKey] = true;\n }\n}\n\nexport { ClassNames, Global, jsx as createElement, css, jsx, keyframes };\n","var unitlessKeys = {\n animationIterationCount: 1,\n aspectRatio: 1,\n borderImageOutset: 1,\n borderImageSlice: 1,\n borderImageWidth: 1,\n boxFlex: 1,\n boxFlexGroup: 1,\n boxOrdinalGroup: 1,\n columnCount: 1,\n columns: 1,\n flex: 1,\n flexGrow: 1,\n flexPositive: 1,\n flexShrink: 1,\n flexNegative: 1,\n flexOrder: 1,\n gridRow: 1,\n gridRowEnd: 1,\n gridRowSpan: 1,\n gridRowStart: 1,\n gridColumn: 1,\n gridColumnEnd: 1,\n gridColumnSpan: 1,\n gridColumnStart: 1,\n msGridRow: 1,\n msGridRowSpan: 1,\n msGridColumn: 1,\n msGridColumnSpan: 1,\n fontWeight: 1,\n lineHeight: 1,\n opacity: 1,\n order: 1,\n orphans: 1,\n tabSize: 1,\n widows: 1,\n zIndex: 1,\n zoom: 1,\n WebkitLineClamp: 1,\n // SVG-related properties\n fillOpacity: 1,\n floodOpacity: 1,\n stopOpacity: 1,\n strokeDasharray: 1,\n strokeDashoffset: 1,\n strokeMiterlimit: 1,\n strokeOpacity: 1,\n strokeWidth: 1\n};\n\nexport { unitlessKeys as default };\n","import hashString from '@emotion/hash';\nimport unitless from '@emotion/unitless';\nimport memoize from '@emotion/memoize';\n\nvar ILLEGAL_ESCAPE_SEQUENCE_ERROR = \"You have illegal escape sequence in your template literal, most likely inside content's property value.\\nBecause you write your CSS inside a JavaScript string you actually have to do double escaping, so for example \\\"content: '\\\\00d7';\\\" should become \\\"content: '\\\\\\\\00d7';\\\".\\nYou can read more about this here:\\nhttps://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals#ES2018_revision_of_illegal_escape_sequences\";\nvar UNDEFINED_AS_OBJECT_KEY_ERROR = \"You have passed in falsy value as style object's key (can happen when in example you pass unexported component as computed key).\";\nvar hyphenateRegex = /[A-Z]|^ms/g;\nvar animationRegex = /_EMO_([^_]+?)_([^]*?)_EMO_/g;\n\nvar isCustomProperty = function isCustomProperty(property) {\n return property.charCodeAt(1) === 45;\n};\n\nvar isProcessableValue = function isProcessableValue(value) {\n return value != null && typeof value !== 'boolean';\n};\n\nvar processStyleName = /* #__PURE__ */memoize(function (styleName) {\n return isCustomProperty(styleName) ? styleName : styleName.replace(hyphenateRegex, '-$&').toLowerCase();\n});\n\nvar processStyleValue = function processStyleValue(key, value) {\n switch (key) {\n case 'animation':\n case 'animationName':\n {\n if (typeof value === 'string') {\n return value.replace(animationRegex, function (match, p1, p2) {\n cursor = {\n name: p1,\n styles: p2,\n next: cursor\n };\n return p1;\n });\n }\n }\n }\n\n if (unitless[key] !== 1 && !isCustomProperty(key) && typeof value === 'number' && value !== 0) {\n return value + 'px';\n }\n\n return value;\n};\n\nif (process.env.NODE_ENV !== 'production') {\n var contentValuePattern = /(var|attr|counters?|url|element|(((repeating-)?(linear|radial))|conic)-gradient)\\(|(no-)?(open|close)-quote/;\n var contentValues = ['normal', 'none', 'initial', 'inherit', 'unset'];\n var oldProcessStyleValue = processStyleValue;\n var msPattern = /^-ms-/;\n var hyphenPattern = /-(.)/g;\n var hyphenatedCache = {};\n\n processStyleValue = function processStyleValue(key, value) {\n if (key === 'content') {\n if (typeof value !== 'string' || contentValues.indexOf(value) === -1 && !contentValuePattern.test(value) && (value.charAt(0) !== value.charAt(value.length - 1) || value.charAt(0) !== '\"' && value.charAt(0) !== \"'\")) {\n throw new Error(\"You seem to be using a value for 'content' without quotes, try replacing it with `content: '\\\"\" + value + \"\\\"'`\");\n }\n }\n\n var processed = oldProcessStyleValue(key, value);\n\n if (processed !== '' && !isCustomProperty(key) && key.indexOf('-') !== -1 && hyphenatedCache[key] === undefined) {\n hyphenatedCache[key] = true;\n console.error(\"Using kebab-case for css properties in objects is not supported. Did you mean \" + key.replace(msPattern, 'ms-').replace(hyphenPattern, function (str, _char) {\n return _char.toUpperCase();\n }) + \"?\");\n }\n\n return processed;\n };\n}\n\nvar noComponentSelectorMessage = 'Component selectors can only be used in conjunction with ' + '@emotion/babel-plugin, the swc Emotion plugin, or another Emotion-aware ' + 'compiler transform.';\n\nfunction handleInterpolation(mergedProps, registered, interpolation) {\n if (interpolation == null) {\n return '';\n }\n\n if (interpolation.__emotion_styles !== undefined) {\n if (process.env.NODE_ENV !== 'production' && interpolation.toString() === 'NO_COMPONENT_SELECTOR') {\n throw new Error(noComponentSelectorMessage);\n }\n\n return interpolation;\n }\n\n switch (typeof interpolation) {\n case 'boolean':\n {\n return '';\n }\n\n case 'object':\n {\n if (interpolation.anim === 1) {\n cursor = {\n name: interpolation.name,\n styles: interpolation.styles,\n next: cursor\n };\n return interpolation.name;\n }\n\n if (interpolation.styles !== undefined) {\n var next = interpolation.next;\n\n if (next !== undefined) {\n // not the most efficient thing ever but this is a pretty rare case\n // and there will be very few iterations of this generally\n while (next !== undefined) {\n cursor = {\n name: next.name,\n styles: next.styles,\n next: cursor\n };\n next = next.next;\n }\n }\n\n var styles = interpolation.styles + \";\";\n\n if (process.env.NODE_ENV !== 'production' && interpolation.map !== undefined) {\n styles += interpolation.map;\n }\n\n return styles;\n }\n\n return createStringFromObject(mergedProps, registered, interpolation);\n }\n\n case 'function':\n {\n if (mergedProps !== undefined) {\n var previousCursor = cursor;\n var result = interpolation(mergedProps);\n cursor = previousCursor;\n return handleInterpolation(mergedProps, registered, result);\n } else if (process.env.NODE_ENV !== 'production') {\n console.error('Functions that are interpolated in css calls will be stringified.\\n' + 'If you want to have a css call based on props, create a function that returns a css call like this\\n' + 'let dynamicStyle = (props) => css`color: ${props.color}`\\n' + 'It can be called directly with props or interpolated in a styled call like this\\n' + \"let SomeComponent = styled('div')`${dynamicStyle}`\");\n }\n\n break;\n }\n\n case 'string':\n if (process.env.NODE_ENV !== 'production') {\n var matched = [];\n var replaced = interpolation.replace(animationRegex, function (match, p1, p2) {\n var fakeVarName = \"animation\" + matched.length;\n matched.push(\"const \" + fakeVarName + \" = keyframes`\" + p2.replace(/^@keyframes animation-\\w+/, '') + \"`\");\n return \"${\" + fakeVarName + \"}\";\n });\n\n if (matched.length) {\n console.error('`keyframes` output got interpolated into plain string, please wrap it with `css`.\\n\\n' + 'Instead of doing this:\\n\\n' + [].concat(matched, [\"`\" + replaced + \"`\"]).join('\\n') + '\\n\\nYou should wrap it with `css` like this:\\n\\n' + (\"css`\" + replaced + \"`\"));\n }\n }\n\n break;\n } // finalize string values (regular strings and functions interpolated into css calls)\n\n\n if (registered == null) {\n return interpolation;\n }\n\n var cached = registered[interpolation];\n return cached !== undefined ? cached : interpolation;\n}\n\nfunction createStringFromObject(mergedProps, registered, obj) {\n var string = '';\n\n if (Array.isArray(obj)) {\n for (var i = 0; i < obj.length; i++) {\n string += handleInterpolation(mergedProps, registered, obj[i]) + \";\";\n }\n } else {\n for (var _key in obj) {\n var value = obj[_key];\n\n if (typeof value !== 'object') {\n if (registered != null && registered[value] !== undefined) {\n string += _key + \"{\" + registered[value] + \"}\";\n } else if (isProcessableValue(value)) {\n string += processStyleName(_key) + \":\" + processStyleValue(_key, value) + \";\";\n }\n } else {\n if (_key === 'NO_COMPONENT_SELECTOR' && process.env.NODE_ENV !== 'production') {\n throw new Error(noComponentSelectorMessage);\n }\n\n if (Array.isArray(value) && typeof value[0] === 'string' && (registered == null || registered[value[0]] === undefined)) {\n for (var _i = 0; _i < value.length; _i++) {\n if (isProcessableValue(value[_i])) {\n string += processStyleName(_key) + \":\" + processStyleValue(_key, value[_i]) + \";\";\n }\n }\n } else {\n var interpolated = handleInterpolation(mergedProps, registered, value);\n\n switch (_key) {\n case 'animation':\n case 'animationName':\n {\n string += processStyleName(_key) + \":\" + interpolated + \";\";\n break;\n }\n\n default:\n {\n if (process.env.NODE_ENV !== 'production' && _key === 'undefined') {\n console.error(UNDEFINED_AS_OBJECT_KEY_ERROR);\n }\n\n string += _key + \"{\" + interpolated + \"}\";\n }\n }\n }\n }\n }\n }\n\n return string;\n}\n\nvar labelPattern = /label:\\s*([^\\s;\\n{]+)\\s*(;|$)/g;\nvar sourceMapPattern;\n\nif (process.env.NODE_ENV !== 'production') {\n sourceMapPattern = /\\/\\*#\\ssourceMappingURL=data:application\\/json;\\S+\\s+\\*\\//g;\n} // this is the cursor for keyframes\n// keyframes are stored on the SerializedStyles object as a linked list\n\n\nvar cursor;\nvar serializeStyles = function serializeStyles(args, registered, mergedProps) {\n if (args.length === 1 && typeof args[0] === 'object' && args[0] !== null && args[0].styles !== undefined) {\n return args[0];\n }\n\n var stringMode = true;\n var styles = '';\n cursor = undefined;\n var strings = args[0];\n\n if (strings == null || strings.raw === undefined) {\n stringMode = false;\n styles += handleInterpolation(mergedProps, registered, strings);\n } else {\n if (process.env.NODE_ENV !== 'production' && strings[0] === undefined) {\n console.error(ILLEGAL_ESCAPE_SEQUENCE_ERROR);\n }\n\n styles += strings[0];\n } // we start at 1 since we've already handled the first arg\n\n\n for (var i = 1; i < args.length; i++) {\n styles += handleInterpolation(mergedProps, registered, args[i]);\n\n if (stringMode) {\n if (process.env.NODE_ENV !== 'production' && strings[i] === undefined) {\n console.error(ILLEGAL_ESCAPE_SEQUENCE_ERROR);\n }\n\n styles += strings[i];\n }\n }\n\n var sourceMap;\n\n if (process.env.NODE_ENV !== 'production') {\n styles = styles.replace(sourceMapPattern, function (match) {\n sourceMap = match;\n return '';\n });\n } // using a global regex with .exec is stateful so lastIndex has to be reset each time\n\n\n labelPattern.lastIndex = 0;\n var identifierName = '';\n var match; // https://esbench.com/bench/5b809c2cf2949800a0f61fb5\n\n while ((match = labelPattern.exec(styles)) !== null) {\n identifierName += '-' + // $FlowFixMe we know it's not null\n match[1];\n }\n\n var name = hashString(styles) + identifierName;\n\n if (process.env.NODE_ENV !== 'production') {\n // $FlowFixMe SerializedStyles type doesn't have toString property (and we don't want to add it)\n return {\n name: name,\n styles: styles,\n map: sourceMap,\n next: cursor,\n toString: function toString() {\n return \"You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).\";\n }\n };\n }\n\n return {\n name: name,\n styles: styles,\n next: cursor\n };\n};\n\nexport { serializeStyles };\n","/* eslint-disable */\n// Inspired by https://github.com/garycourt/murmurhash-js\n// Ported from https://github.com/aappleby/smhasher/blob/61a0530f28277f2e850bfc39600ce61d02b518de/src/MurmurHash2.cpp#L37-L86\nfunction murmur2(str) {\n // 'm' and 'r' are mixing constants generated offline.\n // They're not really 'magic', they just happen to work well.\n // const m = 0x5bd1e995;\n // const r = 24;\n // Initialize the hash\n var h = 0; // Mix 4 bytes at a time into the hash\n\n var k,\n i = 0,\n len = str.length;\n\n for (; len >= 4; ++i, len -= 4) {\n k = str.charCodeAt(i) & 0xff | (str.charCodeAt(++i) & 0xff) << 8 | (str.charCodeAt(++i) & 0xff) << 16 | (str.charCodeAt(++i) & 0xff) << 24;\n k =\n /* Math.imul(k, m): */\n (k & 0xffff) * 0x5bd1e995 + ((k >>> 16) * 0xe995 << 16);\n k ^=\n /* k >>> r: */\n k >>> 24;\n h =\n /* Math.imul(k, m): */\n (k & 0xffff) * 0x5bd1e995 + ((k >>> 16) * 0xe995 << 16) ^\n /* Math.imul(h, m): */\n (h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);\n } // Handle the last few bytes of the input array\n\n\n switch (len) {\n case 3:\n h ^= (str.charCodeAt(i + 2) & 0xff) << 16;\n\n case 2:\n h ^= (str.charCodeAt(i + 1) & 0xff) << 8;\n\n case 1:\n h ^= str.charCodeAt(i) & 0xff;\n h =\n /* Math.imul(h, m): */\n (h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);\n } // Do a few final mixes of the hash to ensure the last few\n // bytes are well-incorporated.\n\n\n h ^= h >>> 13;\n h =\n /* Math.imul(h, m): */\n (h & 0xffff) * 0x5bd1e995 + ((h >>> 16) * 0xe995 << 16);\n return ((h ^ h >>> 15) >>> 0).toString(36);\n}\n\nexport { murmur2 as default };\n","import * as React from 'react';\n\nvar syncFallback = function syncFallback(create) {\n return create();\n};\n\nvar useInsertionEffect = React['useInsertion' + 'Effect'] ? React['useInsertion' + 'Effect'] : false;\nvar useInsertionEffectAlwaysWithSyncFallback = useInsertionEffect || syncFallback;\nvar useInsertionEffectWithLayoutFallback = useInsertionEffect || React.useLayoutEffect;\n\nexport { useInsertionEffectAlwaysWithSyncFallback, useInsertionEffectWithLayoutFallback };\n","var isBrowser = \"object\" !== 'undefined';\nfunction getRegisteredStyles(registered, registeredStyles, classNames) {\n var rawClassName = '';\n classNames.split(' ').forEach(function (className) {\n if (registered[className] !== undefined) {\n registeredStyles.push(registered[className] + \";\");\n } else {\n rawClassName += className + \" \";\n }\n });\n return rawClassName;\n}\nvar registerStyles = function registerStyles(cache, serialized, isStringTag) {\n var className = cache.key + \"-\" + serialized.name;\n\n if ( // we only need to add the styles to the registered cache if the\n // class name could be used further down\n // the tree but if it's a string tag, we know it won't\n // so we don't have to add it to registered cache.\n // this improves memory usage since we can avoid storing the whole style string\n (isStringTag === false || // we need to always store it if we're in compat mode and\n // in node since emotion-server relies on whether a style is in\n // the registered cache to know whether a style is global or not\n // also, note that this check will be dead code eliminated in the browser\n isBrowser === false ) && cache.registered[className] === undefined) {\n cache.registered[className] = serialized.styles;\n }\n};\nvar insertStyles = function insertStyles(cache, serialized, isStringTag) {\n registerStyles(cache, serialized, isStringTag);\n var className = cache.key + \"-\" + serialized.name;\n\n if (cache.inserted[serialized.name] === undefined) {\n var current = serialized;\n\n do {\n cache.insert(serialized === current ? \".\" + className : '', current, cache.sheet, true);\n\n current = current.next;\n } while (current !== undefined);\n }\n};\n\nexport { getRegisteredStyles, insertStyles, registerStyles };\n","export const version = \"abi/5.7.0\";\n","\"use strict\";\n\nimport { BigNumber } from \"@ethersproject/bignumber\";\nimport { defineReadOnly } from \"@ethersproject/properties\";\n\nimport { Logger } from \"@ethersproject/logger\";\nimport { version } from \"./_version\";\nconst logger = new Logger(version);\n\nexport interface JsonFragmentType {\n readonly name?: string;\n readonly indexed?: boolean;\n readonly type?: string;\n readonly internalType?: any; // @TODO: in v6 reduce type\n readonly components?: ReadonlyArray;\n}\n\nexport interface JsonFragment {\n readonly name?: string;\n readonly type?: string;\n\n readonly anonymous?: boolean;\n\n readonly payable?: boolean;\n readonly constant?: boolean;\n readonly stateMutability?: string;\n\n readonly inputs?: ReadonlyArray;\n readonly outputs?: ReadonlyArray;\n\n readonly gas?: string;\n};\n\nconst _constructorGuard = { };\n\n// AST Node parser state\ntype ParseState = {\n allowArray?: boolean,\n allowName?: boolean,\n allowParams?: boolean,\n allowType?: boolean,\n readArray?: boolean,\n};\n\n// AST Node\ntype ParseNode = {\n parent?: any,\n type?: string,\n name?: string,\n state?: ParseState,\n indexed?: boolean,\n components?: Array\n};\n\nlet ModifiersBytes: { [ name: string ]: boolean } = { calldata: true, memory: true, storage: true };\nlet ModifiersNest: { [ name: string ]: boolean } = { calldata: true, memory: true };\nfunction checkModifier(type: string, name: string): boolean {\n if (type === \"bytes\" || type === \"string\") {\n if (ModifiersBytes[name]) { return true; }\n } else if (type === \"address\") {\n if (name === \"payable\") { return true; }\n } else if (type.indexOf(\"[\") >= 0 || type === \"tuple\") {\n if (ModifiersNest[name]) { return true; }\n }\n if (ModifiersBytes[name] || name === \"payable\") {\n logger.throwArgumentError(\"invalid modifier\", \"name\", name);\n }\n return false;\n}\n\n// @TODO: Make sure that children of an indexed tuple are marked with a null indexed\nfunction parseParamType(param: string, allowIndexed: boolean): ParseNode {\n\n let originalParam = param;\n function throwError(i: number) {\n logger.throwArgumentError(`unexpected character at position ${ i }`, \"param\", param);\n }\n param = param.replace(/\\s/g, \" \");\n\n function newNode(parent: ParseNode): ParseNode {\n let node: ParseNode = { type: \"\", name: \"\", parent: parent, state: { allowType: true } };\n if (allowIndexed) { node.indexed = false; }\n return node\n }\n\n let parent: ParseNode = { type: \"\", name: \"\", state: { allowType: true } };\n let node = parent;\n\n for (let i = 0; i < param.length; i++) {\n let c = param[i];\n switch (c) {\n case \"(\":\n if (node.state.allowType && node.type === \"\") {\n node.type = \"tuple\";\n } else if (!node.state.allowParams) {\n throwError(i);\n }\n node.state.allowType = false;\n node.type = verifyType(node.type);\n node.components = [ newNode(node) ];\n node = node.components[0];\n break;\n\n case \")\":\n delete node.state;\n\n if (node.name === \"indexed\") {\n if (!allowIndexed) { throwError(i); }\n node.indexed = true;\n node.name = \"\";\n }\n\n if (checkModifier(node.type, node.name)) { node.name = \"\"; }\n\n node.type = verifyType(node.type);\n\n let child = node;\n node = node.parent;\n if (!node) { throwError(i); }\n delete child.parent;\n node.state.allowParams = false;\n node.state.allowName = true;\n node.state.allowArray = true;\n break;\n\n case \",\":\n delete node.state;\n\n if (node.name === \"indexed\") {\n if (!allowIndexed) { throwError(i); }\n node.indexed = true;\n node.name = \"\";\n }\n\n if (checkModifier(node.type, node.name)) { node.name = \"\"; }\n\n node.type = verifyType(node.type);\n\n let sibling: ParseNode = newNode(node.parent);\n //{ type: \"\", name: \"\", parent: node.parent, state: { allowType: true } };\n node.parent.components.push(sibling);\n delete node.parent;\n node = sibling;\n break;\n\n // Hit a space...\n case \" \":\n\n // If reading type, the type is done and may read a param or name\n if (node.state.allowType) {\n if (node.type !== \"\") {\n node.type = verifyType(node.type);\n delete node.state.allowType;\n node.state.allowName = true;\n node.state.allowParams = true;\n }\n }\n\n // If reading name, the name is done\n if (node.state.allowName) {\n if (node.name !== \"\") {\n if (node.name === \"indexed\") {\n if (!allowIndexed) { throwError(i); }\n if (node.indexed) { throwError(i); }\n node.indexed = true;\n node.name = \"\";\n } else if (checkModifier(node.type, node.name)) {\n node.name = \"\";\n } else {\n node.state.allowName = false;\n }\n }\n }\n\n break;\n\n case \"[\":\n if (!node.state.allowArray) { throwError(i); }\n\n node.type += c;\n\n node.state.allowArray = false;\n node.state.allowName = false;\n node.state.readArray = true;\n break;\n\n case \"]\":\n if (!node.state.readArray) { throwError(i); }\n\n node.type += c;\n\n node.state.readArray = false;\n node.state.allowArray = true;\n node.state.allowName = true;\n break;\n\n default:\n if (node.state.allowType) {\n node.type += c;\n node.state.allowParams = true;\n node.state.allowArray = true;\n } else if (node.state.allowName) {\n node.name += c;\n delete node.state.allowArray;\n } else if (node.state.readArray) {\n node.type += c;\n } else {\n throwError(i);\n }\n }\n }\n\n if (node.parent) { logger.throwArgumentError(\"unexpected eof\", \"param\", param); }\n\n delete parent.state;\n\n if (node.name === \"indexed\") {\n if (!allowIndexed) { throwError(originalParam.length - 7); }\n if (node.indexed) { throwError(originalParam.length - 7); }\n node.indexed = true;\n node.name = \"\";\n } else if (checkModifier(node.type, node.name)) {\n node.name = \"\";\n }\n\n parent.type = verifyType(parent.type);\n\n return parent;\n}\n\nfunction populate(object: any, params: any) {\n for (let key in params) { defineReadOnly(object, key, params[key]); }\n}\n\nexport const FormatTypes: { [ name: string ]: string } = Object.freeze({\n // Bare formatting, as is needed for computing a sighash of an event or function\n sighash: \"sighash\",\n\n // Human-Readable with Minimal spacing and without names (compact human-readable)\n minimal: \"minimal\",\n\n // Human-Readable with nice spacing, including all names\n full: \"full\",\n\n // JSON-format a la Solidity\n json: \"json\"\n});\n\nconst paramTypeArray = new RegExp(/^(.*)\\[([0-9]*)\\]$/);\n\nexport class ParamType {\n\n // The local name of the parameter (of null if unbound)\n readonly name: string;\n\n // The fully qualified type (e.g. \"address\", \"tuple(address)\", \"uint256[3][]\"\n readonly type: string;\n\n // The base type (e.g. \"address\", \"tuple\", \"array\")\n readonly baseType: string;\n\n // Indexable Paramters ONLY (otherwise null)\n readonly indexed: boolean;\n\n // Tuples ONLY: (otherwise null)\n // - sub-components\n readonly components: Array;\n\n // Arrays ONLY: (otherwise null)\n // - length of the array (-1 for dynamic length)\n // - child type\n readonly arrayLength: number;\n readonly arrayChildren: ParamType;\n\n readonly _isParamType: boolean;\n\n constructor(constructorGuard: any, params: any) {\n if (constructorGuard !== _constructorGuard) { logger.throwError(\"use fromString\", Logger.errors.UNSUPPORTED_OPERATION, {\n operation: \"new ParamType()\"\n }); }\n populate(this, params);\n\n let match = this.type.match(paramTypeArray);\n if (match) {\n populate(this, {\n arrayLength: parseInt(match[2] || \"-1\"),\n arrayChildren: ParamType.fromObject({\n type: match[1],\n components: this.components\n }),\n baseType: \"array\"\n });\n } else {\n populate(this, {\n arrayLength: null,\n arrayChildren: null,\n baseType: ((this.components != null) ? \"tuple\": this.type)\n });\n }\n\n this._isParamType = true;\n\n Object.freeze(this);\n }\n\n // Format the parameter fragment\n // - sighash: \"(uint256,address)\"\n // - minimal: \"tuple(uint256,address) indexed\"\n // - full: \"tuple(uint256 foo, address bar) indexed baz\"\n format(format?: string): string {\n if (!format) { format = FormatTypes.sighash; }\n if (!FormatTypes[format]) {\n logger.throwArgumentError(\"invalid format type\", \"format\", format);\n }\n\n if (format === FormatTypes.json) {\n let result: any = {\n type: ((this.baseType === \"tuple\") ? \"tuple\": this.type),\n name: (this.name || undefined)\n };\n if (typeof(this.indexed) === \"boolean\") { result.indexed = this.indexed; }\n if (this.components) {\n result.components = this.components.map((comp) => JSON.parse(comp.format(format)));\n }\n return JSON.stringify(result);\n }\n\n let result = \"\";\n\n // Array\n if (this.baseType === \"array\") {\n result += this.arrayChildren.format(format);\n result += \"[\" + (this.arrayLength < 0 ? \"\": String(this.arrayLength)) + \"]\";\n } else {\n if (this.baseType === \"tuple\") {\n if (format !== FormatTypes.sighash) {\n result += this.type;\n }\n result += \"(\" + this.components.map(\n (comp) => comp.format(format)\n ).join((format === FormatTypes.full) ? \", \": \",\") + \")\";\n } else {\n result += this.type;\n }\n }\n\n if (format !== FormatTypes.sighash) {\n if (this.indexed === true) { result += \" indexed\"; }\n if (format === FormatTypes.full && this.name) {\n result += \" \" + this.name;\n }\n }\n\n return result;\n }\n\n static from(value: string | JsonFragmentType | ParamType, allowIndexed?: boolean): ParamType {\n if (typeof(value) === \"string\") {\n return ParamType.fromString(value, allowIndexed);\n }\n return ParamType.fromObject(value);\n }\n\n static fromObject(value: JsonFragmentType | ParamType): ParamType {\n if (ParamType.isParamType(value)) { return value; }\n\n return new ParamType(_constructorGuard, {\n name: (value.name || null),\n type: verifyType(value.type),\n indexed: ((value.indexed == null) ? null: !!value.indexed),\n components: (value.components ? value.components.map(ParamType.fromObject): null)\n });\n }\n\n static fromString(value: string, allowIndexed?: boolean): ParamType {\n function ParamTypify(node: ParseNode): ParamType {\n return ParamType.fromObject({\n name: node.name,\n type: node.type,\n indexed: node.indexed,\n components: node.components\n });\n }\n\n return ParamTypify(parseParamType(value, !!allowIndexed));\n }\n\n static isParamType(value: any): value is ParamType {\n return !!(value != null && value._isParamType);\n }\n};\n\nfunction parseParams(value: string, allowIndex: boolean): Array {\n return splitNesting(value).map((param) => ParamType.fromString(param, allowIndex));\n}\n\ntype TypeCheck = { -readonly [ K in keyof T ]: T[K] };\n\ninterface _Fragment {\n readonly type: string;\n readonly name: string;\n readonly inputs: ReadonlyArray;\n}\n\nexport abstract class Fragment {\n\n readonly type: string;\n readonly name: string;\n readonly inputs: Array;\n\n readonly _isFragment: boolean;\n\n constructor(constructorGuard: any, params: any) {\n if (constructorGuard !== _constructorGuard) {\n logger.throwError(\"use a static from method\", Logger.errors.UNSUPPORTED_OPERATION, {\n operation: \"new Fragment()\"\n });\n }\n populate(this, params);\n\n this._isFragment = true;\n\n Object.freeze(this);\n }\n\n abstract format(format?: string): string;\n\n static from(value: Fragment | JsonFragment | string): Fragment {\n if (Fragment.isFragment(value)) { return value; }\n\n if (typeof(value) === \"string\") {\n return Fragment.fromString(value);\n }\n\n return Fragment.fromObject(value);\n }\n\n static fromObject(value: Fragment | JsonFragment): Fragment {\n if (Fragment.isFragment(value)) { return value; }\n\n switch (value.type) {\n case \"function\":\n return FunctionFragment.fromObject(value);\n case \"event\":\n return EventFragment.fromObject(value);\n case \"constructor\":\n return ConstructorFragment.fromObject(value);\n case \"error\":\n return ErrorFragment.fromObject(value);\n case \"fallback\":\n case \"receive\":\n // @TODO: Something? Maybe return a FunctionFragment? A custom DefaultFunctionFragment?\n return null;\n }\n\n return logger.throwArgumentError(\"invalid fragment object\", \"value\", value);\n }\n\n static fromString(value: string): Fragment {\n // Make sure the \"returns\" is surrounded by a space and all whitespace is exactly one space\n value = value.replace(/\\s/g, \" \");\n value = value.replace(/\\(/g, \" (\").replace(/\\)/g, \") \").replace(/\\s+/g, \" \");\n value = value.trim();\n\n if (value.split(\" \")[0] === \"event\") {\n return EventFragment.fromString(value.substring(5).trim());\n } else if (value.split(\" \")[0] === \"function\") {\n return FunctionFragment.fromString(value.substring(8).trim());\n } else if (value.split(\"(\")[0].trim() === \"constructor\") {\n return ConstructorFragment.fromString(value.trim());\n } else if (value.split(\" \")[0] === \"error\") {\n return ErrorFragment.fromString(value.substring(5).trim());\n }\n\n return logger.throwArgumentError(\"unsupported fragment\", \"value\", value);\n }\n\n static isFragment(value: any): value is Fragment {\n return !!(value && value._isFragment);\n }\n}\n\ninterface _EventFragment extends _Fragment {\n readonly anonymous: boolean;\n}\n\nexport class EventFragment extends Fragment {\n readonly anonymous: boolean;\n\n format(format?: string): string {\n if (!format) { format = FormatTypes.sighash; }\n if (!FormatTypes[format]) {\n logger.throwArgumentError(\"invalid format type\", \"format\", format);\n }\n\n if (format === FormatTypes.json) {\n return JSON.stringify({\n type: \"event\",\n anonymous: this.anonymous,\n name: this.name,\n inputs: this.inputs.map((input) => JSON.parse(input.format(format)))\n });\n }\n\n let result = \"\";\n\n if (format !== FormatTypes.sighash) {\n result += \"event \";\n }\n\n result += this.name + \"(\" + this.inputs.map(\n (input) => input.format(format)\n ).join((format === FormatTypes.full) ? \", \": \",\") + \") \";\n\n if (format !== FormatTypes.sighash) {\n if (this.anonymous) {\n result += \"anonymous \";\n }\n }\n\n return result.trim();\n }\n\n static from(value: EventFragment | JsonFragment | string): EventFragment {\n if (typeof(value) === \"string\") {\n return EventFragment.fromString(value);\n }\n return EventFragment.fromObject(value);\n }\n\n static fromObject(value: JsonFragment | EventFragment): EventFragment {\n if (EventFragment.isEventFragment(value)) { return value; }\n\n if (value.type !== \"event\") {\n logger.throwArgumentError(\"invalid event object\", \"value\", value);\n }\n\n const params: TypeCheck<_EventFragment> = {\n name: verifyIdentifier(value.name),\n anonymous: value.anonymous,\n inputs: (value.inputs ? value.inputs.map(ParamType.fromObject) : []),\n type: \"event\"\n };\n\n return new EventFragment(_constructorGuard, params);\n }\n\n static fromString(value: string): EventFragment {\n\n let match = value.match(regexParen);\n if (!match) {\n logger.throwArgumentError(\"invalid event string\", \"value\", value);\n }\n\n let anonymous = false;\n match[3].split(\" \").forEach((modifier) => {\n switch(modifier.trim()) {\n case \"anonymous\":\n anonymous = true;\n break;\n case \"\":\n break;\n default:\n logger.warn(\"unknown modifier: \" + modifier);\n }\n });\n\n return EventFragment.fromObject({\n name: match[1].trim(),\n anonymous: anonymous,\n inputs: parseParams(match[2], true),\n type: \"event\"\n });\n }\n\n static isEventFragment(value: any): value is EventFragment {\n return (value && value._isFragment && value.type === \"event\");\n }\n}\n\nfunction parseGas(value: string, params: any): string {\n params.gas = null;\n\n let comps = value.split(\"@\");\n if (comps.length !== 1) {\n if (comps.length > 2) {\n logger.throwArgumentError(\"invalid human-readable ABI signature\", \"value\", value);\n }\n if (!comps[1].match(/^[0-9]+$/)) {\n logger.throwArgumentError(\"invalid human-readable ABI signature gas\", \"value\", value);\n }\n params.gas = BigNumber.from(comps[1]);\n return comps[0];\n }\n\n return value;\n}\n\nfunction parseModifiers(value: string, params: any): void {\n params.constant = false;\n params.payable = false;\n params.stateMutability = \"nonpayable\";\n\n value.split(\" \").forEach((modifier) => {\n switch (modifier.trim()) {\n case \"constant\":\n params.constant = true;\n break;\n case \"payable\":\n params.payable = true;\n params.stateMutability = \"payable\";\n break;\n case \"nonpayable\":\n params.payable = false;\n params.stateMutability = \"nonpayable\";\n break;\n case \"pure\":\n params.constant = true;\n params.stateMutability = \"pure\";\n break;\n case \"view\":\n params.constant = true;\n params.stateMutability = \"view\";\n break;\n case \"external\":\n case \"public\":\n case \"\":\n break;\n default:\n console.log(\"unknown modifier: \" + modifier);\n }\n });\n}\n\ntype StateInputValue = {\n constant?: boolean;\n payable?: boolean;\n stateMutability?: string;\n type?: string;\n};\n\ntype StateOutputValue = {\n constant: boolean;\n payable: boolean;\n stateMutability: string;\n};\n\nfunction verifyState(value: StateInputValue): StateOutputValue {\n let result: any = {\n constant: false,\n payable: true,\n stateMutability: \"payable\"\n };\n\n if (value.stateMutability != null) {\n result.stateMutability = value.stateMutability;\n\n // Set (and check things are consistent) the constant property\n result.constant = (result.stateMutability === \"view\" || result.stateMutability === \"pure\");\n if (value.constant != null) {\n if ((!!value.constant) !== result.constant) {\n logger.throwArgumentError(\"cannot have constant function with mutability \" + result.stateMutability, \"value\", value);\n }\n }\n\n // Set (and check things are consistent) the payable property\n result.payable = (result.stateMutability === \"payable\");\n if (value.payable != null) {\n if ((!!value.payable) !== result.payable) {\n logger.throwArgumentError(\"cannot have payable function with mutability \" + result.stateMutability, \"value\", value);\n }\n }\n\n } else if (value.payable != null) {\n result.payable = !!value.payable;\n\n // If payable we can assume non-constant; otherwise we can't assume\n if (value.constant == null && !result.payable && value.type !== \"constructor\") {\n logger.throwArgumentError(\"unable to determine stateMutability\", \"value\", value);\n }\n\n result.constant = !!value.constant;\n\n if (result.constant) {\n result.stateMutability = \"view\";\n } else {\n result.stateMutability = (result.payable ? \"payable\": \"nonpayable\");\n }\n\n if (result.payable && result.constant) {\n logger.throwArgumentError(\"cannot have constant payable function\", \"value\", value);\n }\n\n } else if (value.constant != null) {\n result.constant = !!value.constant;\n result.payable = !result.constant;\n result.stateMutability = (result.constant ? \"view\": \"payable\");\n\n } else if (value.type !== \"constructor\") {\n logger.throwArgumentError(\"unable to determine stateMutability\", \"value\", value);\n }\n\n return result;\n}\n\ninterface _ConstructorFragment extends _Fragment {\n stateMutability: string;\n payable: boolean;\n gas?: BigNumber;\n}\n\nexport class ConstructorFragment extends Fragment {\n stateMutability: string;\n payable: boolean;\n gas?: BigNumber;\n\n format(format?: string): string {\n if (!format) { format = FormatTypes.sighash; }\n if (!FormatTypes[format]) {\n logger.throwArgumentError(\"invalid format type\", \"format\", format);\n }\n\n if (format === FormatTypes.json) {\n return JSON.stringify({\n type: \"constructor\",\n stateMutability: ((this.stateMutability !== \"nonpayable\") ? this.stateMutability: undefined),\n payable: this.payable,\n gas: (this.gas ? this.gas.toNumber(): undefined),\n inputs: this.inputs.map((input) => JSON.parse(input.format(format)))\n });\n }\n\n if (format === FormatTypes.sighash) {\n logger.throwError(\"cannot format a constructor for sighash\", Logger.errors.UNSUPPORTED_OPERATION, {\n operation: \"format(sighash)\"\n });\n }\n\n let result = \"constructor(\" + this.inputs.map(\n (input) => input.format(format)\n ).join((format === FormatTypes.full) ? \", \": \",\") + \") \";\n\n if (this.stateMutability && this.stateMutability !== \"nonpayable\") {\n result += this.stateMutability + \" \";\n }\n\n return result.trim();\n }\n\n static from(value: ConstructorFragment | JsonFragment | string): ConstructorFragment {\n if (typeof(value) === \"string\") {\n return ConstructorFragment.fromString(value);\n }\n return ConstructorFragment.fromObject(value);\n }\n\n static fromObject(value: ConstructorFragment | JsonFragment): ConstructorFragment {\n if (ConstructorFragment.isConstructorFragment(value)) { return value; }\n\n if (value.type !== \"constructor\") {\n logger.throwArgumentError(\"invalid constructor object\", \"value\", value);\n }\n\n let state = verifyState(value);\n if (state.constant) {\n logger.throwArgumentError(\"constructor cannot be constant\", \"value\", value);\n }\n\n const params: TypeCheck<_ConstructorFragment> = {\n name: null,\n type: value.type,\n inputs: (value.inputs ? value.inputs.map(ParamType.fromObject): []),\n payable: state.payable,\n stateMutability: state.stateMutability,\n gas: (value.gas ? BigNumber.from(value.gas): null)\n };\n\n return new ConstructorFragment(_constructorGuard, params);\n }\n\n static fromString(value: string): ConstructorFragment {\n let params: any = { type: \"constructor\" };\n\n value = parseGas(value, params);\n\n let parens = value.match(regexParen);\n if (!parens || parens[1].trim() !== \"constructor\") {\n logger.throwArgumentError(\"invalid constructor string\", \"value\", value);\n }\n\n params.inputs = parseParams(parens[2].trim(), false);\n\n parseModifiers(parens[3].trim(), params);\n\n return ConstructorFragment.fromObject(params);\n }\n\n static isConstructorFragment(value: any): value is ConstructorFragment {\n return (value && value._isFragment && value.type === \"constructor\");\n }\n}\n\ninterface _FunctionFragment extends _ConstructorFragment {\n constant: boolean;\n outputs?: Array;\n}\n\nexport class FunctionFragment extends ConstructorFragment {\n constant: boolean;\n outputs?: Array;\n\n format(format?: string): string {\n if (!format) { format = FormatTypes.sighash; }\n if (!FormatTypes[format]) {\n logger.throwArgumentError(\"invalid format type\", \"format\", format);\n }\n\n if (format === FormatTypes.json) {\n return JSON.stringify({\n type: \"function\",\n name: this.name,\n constant: this.constant,\n stateMutability: ((this.stateMutability !== \"nonpayable\") ? this.stateMutability: undefined),\n payable: this.payable,\n gas: (this.gas ? this.gas.toNumber(): undefined),\n inputs: this.inputs.map((input) => JSON.parse(input.format(format))),\n outputs: this.outputs.map((output) => JSON.parse(output.format(format))),\n });\n }\n\n let result = \"\";\n\n if (format !== FormatTypes.sighash) {\n result += \"function \";\n }\n\n result += this.name + \"(\" + this.inputs.map(\n (input) => input.format(format)\n ).join((format === FormatTypes.full) ? \", \": \",\") + \") \";\n\n if (format !== FormatTypes.sighash) {\n if (this.stateMutability) {\n if (this.stateMutability !== \"nonpayable\") {\n result += (this.stateMutability + \" \");\n }\n } else if (this.constant) {\n result += \"view \";\n }\n\n if (this.outputs && this.outputs.length) {\n result += \"returns (\" + this.outputs.map(\n (output) => output.format(format)\n ).join(\", \") + \") \";\n }\n\n if (this.gas != null) {\n result += \"@\" + this.gas.toString() + \" \";\n }\n }\n\n return result.trim();\n }\n\n static from(value: FunctionFragment | JsonFragment | string): FunctionFragment {\n if (typeof(value) === \"string\") {\n return FunctionFragment.fromString(value);\n }\n return FunctionFragment.fromObject(value);\n }\n\n static fromObject(value: FunctionFragment | JsonFragment): FunctionFragment {\n if (FunctionFragment.isFunctionFragment(value)) { return value; }\n\n if (value.type !== \"function\") {\n logger.throwArgumentError(\"invalid function object\", \"value\", value);\n }\n\n let state = verifyState(value);\n\n const params: TypeCheck<_FunctionFragment> = {\n type: value.type,\n name: verifyIdentifier(value.name),\n constant: state.constant,\n inputs: (value.inputs ? value.inputs.map(ParamType.fromObject): []),\n outputs: (value.outputs ? value.outputs.map(ParamType.fromObject): [ ]),\n payable: state.payable,\n stateMutability: state.stateMutability,\n gas: (value.gas ? BigNumber.from(value.gas): null)\n };\n\n return new FunctionFragment(_constructorGuard, params);\n }\n\n static fromString(value: string): FunctionFragment {\n let params: any = { type: \"function\" };\n value = parseGas(value, params);\n\n let comps = value.split(\" returns \");\n if (comps.length > 2) {\n logger.throwArgumentError(\"invalid function string\", \"value\", value);\n }\n\n let parens = comps[0].match(regexParen);\n if (!parens) {\n logger.throwArgumentError(\"invalid function signature\", \"value\", value);\n }\n\n params.name = parens[1].trim();\n if (params.name) { verifyIdentifier(params.name); }\n\n params.inputs = parseParams(parens[2], false);\n\n parseModifiers(parens[3].trim(), params);\n\n // We have outputs\n if (comps.length > 1) {\n let returns = comps[1].match(regexParen);\n if (returns[1].trim() != \"\" || returns[3].trim() != \"\") {\n logger.throwArgumentError(\"unexpected tokens\", \"value\", value);\n }\n params.outputs = parseParams(returns[2], false);\n } else {\n params.outputs = [ ];\n }\n\n return FunctionFragment.fromObject(params);\n }\n\n static isFunctionFragment(value: any): value is FunctionFragment {\n return (value && value._isFragment && value.type === \"function\");\n }\n}\n\n//export class StructFragment extends Fragment {\n//}\n\nfunction checkForbidden(fragment: ErrorFragment): ErrorFragment {\n const sig = fragment.format();\n if (sig === \"Error(string)\" || sig === \"Panic(uint256)\") {\n logger.throwArgumentError(`cannot specify user defined ${ sig } error`, \"fragment\", fragment);\n }\n return fragment;\n}\n\nexport class ErrorFragment extends Fragment {\n\n format(format?: string): string {\n if (!format) { format = FormatTypes.sighash; }\n if (!FormatTypes[format]) {\n logger.throwArgumentError(\"invalid format type\", \"format\", format);\n }\n\n if (format === FormatTypes.json) {\n return JSON.stringify({\n type: \"error\",\n name: this.name,\n inputs: this.inputs.map((input) => JSON.parse(input.format(format))),\n });\n }\n\n let result = \"\";\n\n if (format !== FormatTypes.sighash) {\n result += \"error \";\n }\n\n result += this.name + \"(\" + this.inputs.map(\n (input) => input.format(format)\n ).join((format === FormatTypes.full) ? \", \": \",\") + \") \";\n\n return result.trim();\n }\n\n static from(value: ErrorFragment | JsonFragment | string): ErrorFragment {\n if (typeof(value) === \"string\") {\n return ErrorFragment.fromString(value);\n }\n return ErrorFragment.fromObject(value);\n }\n\n static fromObject(value: ErrorFragment | JsonFragment): ErrorFragment {\n if (ErrorFragment.isErrorFragment(value)) { return value; }\n\n if (value.type !== \"error\") {\n logger.throwArgumentError(\"invalid error object\", \"value\", value);\n }\n\n const params: TypeCheck<_Fragment> = {\n type: value.type,\n name: verifyIdentifier(value.name),\n inputs: (value.inputs ? value.inputs.map(ParamType.fromObject): [])\n };\n\n return checkForbidden(new ErrorFragment(_constructorGuard, params));\n }\n\n static fromString(value: string): ErrorFragment {\n let params: any = { type: \"error\" };\n\n let parens = value.match(regexParen);\n if (!parens) {\n logger.throwArgumentError(\"invalid error signature\", \"value\", value);\n }\n\n params.name = parens[1].trim();\n if (params.name) { verifyIdentifier(params.name); }\n\n params.inputs = parseParams(parens[2], false);\n\n return checkForbidden(ErrorFragment.fromObject(params));\n }\n\n static isErrorFragment(value: any): value is ErrorFragment {\n return (value && value._isFragment && value.type === \"error\");\n }\n}\n\nfunction verifyType(type: string): string {\n\n // These need to be transformed to their full description\n if (type.match(/^uint($|[^1-9])/)) {\n type = \"uint256\" + type.substring(4);\n } else if (type.match(/^int($|[^1-9])/)) {\n type = \"int256\" + type.substring(3);\n }\n\n // @TODO: more verification\n\n return type;\n}\n\n// See: https://github.com/ethereum/solidity/blob/1f8f1a3db93a548d0555e3e14cfc55a10e25b60e/docs/grammar/SolidityLexer.g4#L234\nconst regexIdentifier = new RegExp(\"^[a-zA-Z$_][a-zA-Z0-9$_]*$\");\nfunction verifyIdentifier(value: string): string {\n if (!value || !value.match(regexIdentifier)) {\n logger.throwArgumentError(`invalid identifier \"${ value }\"`, \"value\", value);\n }\n return value;\n}\n\nconst regexParen = new RegExp(\"^([^)(]*)\\\\((.*)\\\\)([^)(]*)$\");\n\nfunction splitNesting(value: string): Array {\n value = value.trim();\n\n let result = [];\n let accum = \"\";\n let depth = 0;\n for (let offset = 0; offset < value.length; offset++) {\n let c = value[offset];\n if (c === \",\" && depth === 0) {\n result.push(accum);\n accum = \"\";\n } else {\n accum += c;\n if (c === \"(\") {\n depth++;\n } else if (c === \")\") {\n depth--;\n if (depth === -1) {\n logger.throwArgumentError(\"unbalanced parenthesis\", \"value\", value);\n }\n }\n }\n }\n if (accum) { result.push(accum); }\n\n return result;\n}\n\n","\"use strict\";\n\nimport { arrayify, BytesLike, concat, hexConcat, hexlify } from \"@ethersproject/bytes\";\nimport { BigNumber, BigNumberish } from \"@ethersproject/bignumber\";\nimport { defineReadOnly } from \"@ethersproject/properties\";\n\nimport { Logger } from \"@ethersproject/logger\";\nimport { version } from \"../_version\";\nconst logger = new Logger(version);\n\nexport interface Result extends ReadonlyArray {\n readonly [key: string]: any;\n}\n\nexport function checkResultErrors(result: Result): Array<{ path: Array, error: Error }> {\n // Find the first error (if any)\n const errors: Array<{ path: Array, error: Error }> = [ ];\n\n const checkErrors = function(path: Array, object: any): void {\n if (!Array.isArray(object)) { return; }\n for (let key in object) {\n const childPath = path.slice();\n childPath.push(key);\n\n try {\n checkErrors(childPath, object[key]);\n } catch (error) {\n errors.push({ path: childPath, error: error });\n }\n }\n }\n checkErrors([ ], result);\n\n return errors;\n\n}\n\nexport type CoerceFunc = (type: string, value: any) => any;\n\nexport abstract class Coder {\n\n // The coder name:\n // - address, uint256, tuple, array, etc.\n readonly name: string;\n\n // The fully expanded type, including composite types:\n // - address, uint256, tuple(address,bytes), uint256[3][4][], etc.\n readonly type: string;\n\n // The localName bound in the signature, in this example it is \"baz\":\n // - tuple(address foo, uint bar) baz\n readonly localName: string;\n\n // Whether this type is dynamic:\n // - Dynamic: bytes, string, address[], tuple(boolean[]), etc.\n // - Not Dynamic: address, uint256, boolean[3], tuple(address, uint8)\n readonly dynamic: boolean;\n\n constructor(name: string, type: string, localName: string, dynamic: boolean) {\n // @TODO: defineReadOnly these\n this.name = name;\n this.type = type;\n this.localName = localName;\n this.dynamic = dynamic;\n }\n\n _throwError(message: string, value: any): void {\n logger.throwArgumentError(message, this.localName, value);\n }\n\n abstract encode(writer: Writer, value: any): number;\n abstract decode(reader: Reader): any;\n\n abstract defaultValue(): any;\n}\n\nexport class Writer {\n readonly wordSize: number;\n\n _data: Array;\n _dataLength: number;\n _padding: Uint8Array;\n\n constructor(wordSize?: number) {\n defineReadOnly(this, \"wordSize\", wordSize || 32);\n this._data = [ ];\n this._dataLength = 0;\n this._padding = new Uint8Array(wordSize);\n }\n\n get data(): string {\n return hexConcat(this._data);\n }\n get length(): number { return this._dataLength; }\n\n _writeData(data: Uint8Array): number {\n this._data.push(data);\n this._dataLength += data.length;\n return data.length;\n }\n\n appendWriter(writer: Writer): number {\n return this._writeData(concat(writer._data));\n }\n\n // Arrayish items; padded on the right to wordSize\n writeBytes(value: BytesLike): number {\n let bytes = arrayify(value);\n const paddingOffset = bytes.length % this.wordSize;\n if (paddingOffset) {\n bytes = concat([ bytes, this._padding.slice(paddingOffset) ])\n }\n return this._writeData(bytes);\n }\n\n _getValue(value: BigNumberish): Uint8Array {\n let bytes = arrayify(BigNumber.from(value));\n if (bytes.length > this.wordSize) {\n logger.throwError(\"value out-of-bounds\", Logger.errors.BUFFER_OVERRUN, {\n length: this.wordSize,\n offset: bytes.length\n });\n }\n if (bytes.length % this.wordSize) {\n bytes = concat([ this._padding.slice(bytes.length % this.wordSize), bytes ]);\n }\n return bytes;\n }\n\n // BigNumberish items; padded on the left to wordSize\n writeValue(value: BigNumberish): number {\n return this._writeData(this._getValue(value));\n }\n\n writeUpdatableValue(): (value: BigNumberish) => void {\n const offset = this._data.length;\n this._data.push(this._padding);\n this._dataLength += this.wordSize;\n return (value: BigNumberish) => {\n this._data[offset] = this._getValue(value);\n };\n }\n}\n\nexport class Reader {\n readonly wordSize: number;\n readonly allowLoose: boolean;\n\n readonly _data: Uint8Array;\n readonly _coerceFunc: CoerceFunc;\n\n _offset: number;\n\n constructor(data: BytesLike, wordSize?: number, coerceFunc?: CoerceFunc, allowLoose?: boolean) {\n defineReadOnly(this, \"_data\", arrayify(data));\n defineReadOnly(this, \"wordSize\", wordSize || 32);\n defineReadOnly(this, \"_coerceFunc\", coerceFunc);\n defineReadOnly(this, \"allowLoose\", allowLoose);\n\n this._offset = 0;\n }\n\n get data(): string { return hexlify(this._data); }\n get consumed(): number { return this._offset; }\n\n // The default Coerce function\n static coerce(name: string, value: any): any {\n let match = name.match(\"^u?int([0-9]+)$\");\n if (match && parseInt(match[1]) <= 48) { value = value.toNumber(); }\n return value;\n }\n\n coerce(name: string, value: any): any {\n if (this._coerceFunc) { return this._coerceFunc(name, value); }\n return Reader.coerce(name, value);\n }\n\n _peekBytes(offset: number, length: number, loose?: boolean): Uint8Array {\n let alignedLength = Math.ceil(length / this.wordSize) * this.wordSize;\n if (this._offset + alignedLength > this._data.length) {\n if (this.allowLoose && loose && this._offset + length <= this._data.length) {\n alignedLength = length;\n } else {\n logger.throwError(\"data out-of-bounds\", Logger.errors.BUFFER_OVERRUN, {\n length: this._data.length,\n offset: this._offset + alignedLength\n });\n }\n }\n return this._data.slice(this._offset, this._offset + alignedLength)\n }\n\n subReader(offset: number): Reader {\n return new Reader(this._data.slice(this._offset + offset), this.wordSize, this._coerceFunc, this.allowLoose);\n }\n\n readBytes(length: number, loose?: boolean): Uint8Array {\n let bytes = this._peekBytes(0, length, !!loose);\n this._offset += bytes.length;\n // @TODO: Make sure the length..end bytes are all 0?\n return bytes.slice(0, length);\n }\n\n readValue(): BigNumber {\n return BigNumber.from(this.readBytes(this.wordSize));\n }\n}\n","\"use strict\";\n\nimport { getAddress } from \"@ethersproject/address\";\nimport { hexZeroPad } from \"@ethersproject/bytes\";\n\nimport { Coder, Reader, Writer } from \"./abstract-coder\";\n\nexport class AddressCoder extends Coder {\n\n constructor(localName: string) {\n super(\"address\", \"address\", localName, false);\n }\n\n defaultValue(): string {\n return \"0x0000000000000000000000000000000000000000\";\n }\n\n encode(writer: Writer, value: string): number {\n try {\n value = getAddress(value)\n } catch (error) {\n this._throwError(error.message, value);\n }\n return writer.writeValue(value);\n }\n\n decode(reader: Reader): any {\n return getAddress(hexZeroPad(reader.readValue().toHexString(), 20));\n }\n}\n\n","\"use strict\";\n\nimport { Coder, Reader, Writer } from \"./abstract-coder\";\n\n// Clones the functionality of an existing Coder, but without a localName\nexport class AnonymousCoder extends Coder {\n private coder: Coder;\n\n constructor(coder: Coder) {\n super(coder.name, coder.type, undefined, coder.dynamic);\n this.coder = coder;\n }\n\n defaultValue(): any {\n return this.coder.defaultValue();\n }\n\n encode(writer: Writer, value: any): number {\n return this.coder.encode(writer, value);\n }\n\n decode(reader: Reader): any {\n return this.coder.decode(reader);\n }\n}\n","\"use strict\";\n\nimport { Logger } from \"@ethersproject/logger\";\nimport { version } from \"../_version\";\nconst logger = new Logger(version);\n\nimport { Coder, Reader, Result, Writer } from \"./abstract-coder\";\nimport { AnonymousCoder } from \"./anonymous\";\n\nexport function pack(writer: Writer, coders: ReadonlyArray, values: Array | { [ name: string ]: any }): number {\n let arrayValues: Array = null;\n\n if (Array.isArray(values)) {\n arrayValues = values;\n\n } else if (values && typeof(values) === \"object\") {\n let unique: { [ name: string ]: boolean } = { };\n\n arrayValues = coders.map((coder) => {\n const name = coder.localName;\n if (!name) {\n logger.throwError(\"cannot encode object for signature with missing names\", Logger.errors.INVALID_ARGUMENT, {\n argument: \"values\",\n coder: coder,\n value: values\n });\n }\n\n if (unique[name]) {\n logger.throwError(\"cannot encode object for signature with duplicate names\", Logger.errors.INVALID_ARGUMENT, {\n argument: \"values\",\n coder: coder,\n value: values\n });\n }\n\n unique[name] = true;\n\n return values[name];\n });\n\n } else {\n logger.throwArgumentError(\"invalid tuple value\", \"tuple\", values);\n }\n\n if (coders.length !== arrayValues.length) {\n logger.throwArgumentError(\"types/value length mismatch\", \"tuple\", values);\n }\n\n let staticWriter = new Writer(writer.wordSize);\n let dynamicWriter = new Writer(writer.wordSize);\n\n let updateFuncs: Array<(baseOffset: number) => void> = [];\n coders.forEach((coder, index) => {\n let value = arrayValues[index];\n\n if (coder.dynamic) {\n // Get current dynamic offset (for the future pointer)\n let dynamicOffset = dynamicWriter.length;\n\n // Encode the dynamic value into the dynamicWriter\n coder.encode(dynamicWriter, value);\n\n // Prepare to populate the correct offset once we are done\n let updateFunc = staticWriter.writeUpdatableValue();\n updateFuncs.push((baseOffset: number) => {\n updateFunc(baseOffset + dynamicOffset);\n });\n\n } else {\n coder.encode(staticWriter, value);\n }\n });\n\n // Backfill all the dynamic offsets, now that we know the static length\n updateFuncs.forEach((func) => { func(staticWriter.length); });\n\n let length = writer.appendWriter(staticWriter);\n length += writer.appendWriter(dynamicWriter);\n return length;\n}\n\nexport function unpack(reader: Reader, coders: Array): Result {\n let values: any = [];\n\n // A reader anchored to this base\n let baseReader = reader.subReader(0);\n\n coders.forEach((coder) => {\n let value: any = null;\n\n if (coder.dynamic) {\n let offset = reader.readValue();\n let offsetReader = baseReader.subReader(offset.toNumber());\n try {\n value = coder.decode(offsetReader);\n } catch (error) {\n // Cannot recover from this\n if (error.code === Logger.errors.BUFFER_OVERRUN) { throw error; }\n value = error;\n value.baseType = coder.name;\n value.name = coder.localName;\n value.type = coder.type;\n }\n\n } else {\n try {\n value = coder.decode(reader);\n } catch (error) {\n // Cannot recover from this\n if (error.code === Logger.errors.BUFFER_OVERRUN) { throw error; }\n value = error;\n value.baseType = coder.name;\n value.name = coder.localName;\n value.type = coder.type;\n }\n }\n\n if (value != undefined) {\n values.push(value);\n }\n });\n\n // We only output named properties for uniquely named coders\n const uniqueNames = coders.reduce((accum, coder) => {\n const name = coder.localName;\n if (name) {\n if (!accum[name]) { accum[name] = 0; }\n accum[name]++;\n }\n return accum;\n }, <{ [ name: string ]: number }>{ });\n\n // Add any named parameters (i.e. tuples)\n coders.forEach((coder: Coder, index: number) => {\n let name = coder.localName;\n if (!name || uniqueNames[name] !== 1) { return; }\n\n if (name === \"length\") { name = \"_length\"; }\n\n if (values[name] != null) { return; }\n\n const value = values[index];\n\n if (value instanceof Error) {\n Object.defineProperty(values, name, {\n enumerable: true,\n get: () => { throw value; }\n });\n } else {\n values[name] = value;\n }\n });\n\n for (let i = 0; i < values.length; i++) {\n const value = values[i];\n if (value instanceof Error) {\n Object.defineProperty(values, i, {\n enumerable: true,\n get: () => { throw value; }\n });\n }\n }\n\n return Object.freeze(values);\n}\n\n\nexport class ArrayCoder extends Coder {\n readonly coder: Coder;\n readonly length: number;\n\n constructor(coder: Coder, length: number, localName: string) {\n const type = (coder.type + \"[\" + (length >= 0 ? length: \"\") + \"]\");\n const dynamic = (length === -1 || coder.dynamic);\n super(\"array\", type, localName, dynamic);\n\n this.coder = coder;\n this.length = length;\n }\n\n defaultValue(): Array {\n // Verifies the child coder is valid (even if the array is dynamic or 0-length)\n const defaultChild = this.coder.defaultValue();\n\n const result: Array = [];\n for (let i = 0; i < this.length; i++) {\n result.push(defaultChild);\n }\n return result;\n }\n\n encode(writer: Writer, value: Array): number {\n if (!Array.isArray(value)) {\n this._throwError(\"expected array value\", value);\n }\n\n let count = this.length;\n\n if (count === -1) {\n count = value.length;\n writer.writeValue(value.length);\n }\n\n logger.checkArgumentCount(value.length, count, \"coder array\" + (this.localName? (\" \"+ this.localName): \"\"));\n\n let coders = [];\n for (let i = 0; i < value.length; i++) { coders.push(this.coder); }\n\n return pack(writer, coders, value);\n }\n\n decode(reader: Reader): any {\n let count = this.length;\n if (count === -1) {\n count = reader.readValue().toNumber();\n\n // Check that there is *roughly* enough data to ensure\n // stray random data is not being read as a length. Each\n // slot requires at least 32 bytes for their value (or 32\n // bytes as a link to the data). This could use a much\n // tighter bound, but we are erroring on the side of safety.\n if (count * 32 > reader._data.length) {\n logger.throwError(\"insufficient data length\", Logger.errors.BUFFER_OVERRUN, {\n length: reader._data.length,\n count: count\n });\n }\n }\n let coders = [];\n for (let i = 0; i < count; i++) { coders.push(new AnonymousCoder(this.coder)); }\n\n return reader.coerce(this.name, unpack(reader, coders));\n }\n}\n\n","\"use strict\";\n\nimport { Coder, Reader, Writer } from \"./abstract-coder\";\n\nexport class BooleanCoder extends Coder {\n\n constructor(localName: string) {\n super(\"bool\", \"bool\", localName, false);\n }\n\n defaultValue(): boolean {\n return false;\n }\n\n encode(writer: Writer, value: boolean): number {\n return writer.writeValue(value ? 1: 0);\n }\n\n decode(reader: Reader): any {\n return reader.coerce(this.type, !reader.readValue().isZero());\n }\n}\n\n","\"use strict\";\n\nimport { arrayify, hexlify } from \"@ethersproject/bytes\";\n\nimport { Coder, Reader, Writer } from \"./abstract-coder\";\n\nexport class DynamicBytesCoder extends Coder {\n constructor(type: string, localName: string) {\n super(type, type, localName, true);\n }\n\n defaultValue(): string {\n return \"0x\";\n }\n\n encode(writer: Writer, value: any): number {\n value = arrayify(value);\n let length = writer.writeValue(value.length);\n length += writer.writeBytes(value);\n return length;\n }\n\n decode(reader: Reader): any {\n return reader.readBytes(reader.readValue().toNumber(), true);\n }\n}\n\nexport class BytesCoder extends DynamicBytesCoder {\n constructor(localName: string) {\n super(\"bytes\", localName);\n }\n\n decode(reader: Reader): any {\n return reader.coerce(this.name, hexlify(super.decode(reader)));\n }\n}\n\n\n","\"use strict\";\n\nimport { arrayify, BytesLike, hexlify } from \"@ethersproject/bytes\";\n\nimport { Coder, Reader, Writer } from \"./abstract-coder\";\n\n// @TODO: Merge this with bytes\nexport class FixedBytesCoder extends Coder {\n readonly size: number;\n\n constructor(size: number, localName: string) {\n let name = \"bytes\" + String(size);\n super(name, name, localName, false);\n this.size = size;\n }\n\n defaultValue(): string {\n return (\"0x0000000000000000000000000000000000000000000000000000000000000000\").substring(0, 2 + this.size * 2);\n }\n\n encode(writer: Writer, value: BytesLike): number {\n let data = arrayify(value);\n if (data.length !== this.size) { this._throwError(\"incorrect data length\", value); }\n return writer.writeBytes(data);\n }\n\n decode(reader: Reader): any {\n return reader.coerce(this.name, hexlify(reader.readBytes(this.size)));\n }\n}\n","\"use strict\";\n\nimport { Coder, Reader, Writer } from \"./abstract-coder\";\n\nexport class NullCoder extends Coder {\n\n constructor(localName: string) {\n super(\"null\", \"\", localName, false);\n }\n\n defaultValue(): null {\n return null;\n }\n\n encode(writer: Writer, value: any): number {\n if (value != null) { this._throwError(\"not null\", value); }\n return writer.writeBytes([ ]);\n }\n\n decode(reader: Reader): any {\n reader.readBytes(0);\n return reader.coerce(this.name, null);\n }\n}\n","\"use strict\";\n\nimport { BigNumber, BigNumberish } from \"@ethersproject/bignumber\";\nimport { MaxUint256, NegativeOne, One, Zero } from \"@ethersproject/constants\";\n\nimport { Coder, Reader, Writer } from \"./abstract-coder\";\n\nexport class NumberCoder extends Coder {\n readonly size: number;\n readonly signed: boolean;\n\n constructor(size: number, signed: boolean, localName: string) {\n const name = ((signed ? \"int\": \"uint\") + (size * 8));\n super(name, name, localName, false);\n\n this.size = size;\n this.signed = signed;\n }\n\n defaultValue(): number {\n return 0;\n }\n\n encode(writer: Writer, value: BigNumberish): number {\n let v = BigNumber.from(value);\n\n // Check bounds are safe for encoding\n let maxUintValue = MaxUint256.mask(writer.wordSize * 8);\n if (this.signed) {\n let bounds = maxUintValue.mask(this.size * 8 - 1);\n if (v.gt(bounds) || v.lt(bounds.add(One).mul(NegativeOne))) {\n this._throwError(\"value out-of-bounds\", value);\n }\n } else if (v.lt(Zero) || v.gt(maxUintValue.mask(this.size * 8))) {\n this._throwError(\"value out-of-bounds\", value);\n }\n\n v = v.toTwos(this.size * 8).mask(this.size * 8);\n\n if (this.signed) {\n v = v.fromTwos(this.size * 8).toTwos(8 * writer.wordSize);\n }\n\n return writer.writeValue(v);\n }\n\n decode(reader: Reader): any {\n let value = reader.readValue().mask(this.size * 8);\n\n if (this.signed) {\n value = value.fromTwos(this.size * 8);\n }\n\n return reader.coerce(this.name, value);\n }\n}\n\n","\"use strict\";\n\nimport { toUtf8Bytes, toUtf8String } from \"@ethersproject/strings\";\n\nimport { Reader, Writer } from \"./abstract-coder\";\nimport { DynamicBytesCoder } from \"./bytes\";\n\nexport class StringCoder extends DynamicBytesCoder {\n\n constructor(localName: string) {\n super(\"string\", localName);\n }\n\n defaultValue(): string {\n return \"\";\n }\n\n encode(writer: Writer, value: any): number {\n return super.encode(writer, toUtf8Bytes(value));\n }\n\n decode(reader: Reader): any {\n return toUtf8String(super.decode(reader));\n }\n}\n","\"use strict\";\n\nimport { Coder, Reader, Writer } from \"./abstract-coder\";\nimport { pack, unpack } from \"./array\";\n\nexport class TupleCoder extends Coder {\n readonly coders: Array;\n\n constructor(coders: Array, localName: string) {\n let dynamic = false;\n const types: Array = [];\n coders.forEach((coder) => {\n if (coder.dynamic) { dynamic = true; }\n types.push(coder.type);\n });\n const type = (\"tuple(\" + types.join(\",\") + \")\");\n\n super(\"tuple\", type, localName, dynamic);\n this.coders = coders;\n }\n\n defaultValue(): any {\n const values: any = [ ];\n this.coders.forEach((coder) => {\n values.push(coder.defaultValue());\n });\n\n // We only output named properties for uniquely named coders\n const uniqueNames = this.coders.reduce((accum, coder) => {\n const name = coder.localName;\n if (name) {\n if (!accum[name]) { accum[name] = 0; }\n accum[name]++;\n }\n return accum;\n }, <{ [ name: string ]: number }>{ });\n\n // Add named values\n this.coders.forEach((coder: Coder, index: number) => {\n let name = coder.localName;\n if (!name || uniqueNames[name] !== 1) { return; }\n\n if (name === \"length\") { name = \"_length\"; }\n\n if (values[name] != null) { return; }\n\n values[name] = values[index];\n });\n\n return Object.freeze(values);\n }\n\n encode(writer: Writer, value: Array | { [ name: string ]: any }): number {\n return pack(writer, this.coders, value);\n }\n\n decode(reader: Reader): any {\n return reader.coerce(this.name, unpack(reader, this.coders));\n }\n}\n\n","\"use strict\";\n\n// See: https://github.com/ethereum/wiki/wiki/Ethereum-Contract-ABI\n\nimport { arrayify, BytesLike } from \"@ethersproject/bytes\";\nimport { defineReadOnly } from \"@ethersproject/properties\";\n\nimport { Logger } from \"@ethersproject/logger\";\nimport { version } from \"./_version\";\nconst logger = new Logger(version);\n\nimport { Coder, Reader, Result, Writer } from \"./coders/abstract-coder\";\nimport { AddressCoder } from \"./coders/address\";\nimport { ArrayCoder } from \"./coders/array\";\nimport { BooleanCoder } from \"./coders/boolean\";\nimport { BytesCoder } from \"./coders/bytes\";\nimport { FixedBytesCoder } from \"./coders/fixed-bytes\";\nimport { NullCoder } from \"./coders/null\";\nimport { NumberCoder } from \"./coders/number\";\nimport { StringCoder } from \"./coders/string\";\nimport { TupleCoder } from \"./coders/tuple\";\n\nimport { ParamType } from \"./fragments\";\n\n\nconst paramTypeBytes = new RegExp(/^bytes([0-9]*)$/);\nconst paramTypeNumber = new RegExp(/^(u?int)([0-9]*)$/);\n\n\nexport type CoerceFunc = (type: string, value: any) => any;\n\nexport class AbiCoder {\n readonly coerceFunc: CoerceFunc;\n\n constructor(coerceFunc?: CoerceFunc) {\n defineReadOnly(this, \"coerceFunc\", coerceFunc || null);\n }\n\n _getCoder(param: ParamType): Coder {\n\n switch (param.baseType) {\n case \"address\":\n return new AddressCoder(param.name);\n case \"bool\":\n return new BooleanCoder(param.name);\n case \"string\":\n return new StringCoder(param.name);\n case \"bytes\":\n return new BytesCoder(param.name);\n case \"array\":\n return new ArrayCoder(this._getCoder(param.arrayChildren), param.arrayLength, param.name);\n case \"tuple\":\n return new TupleCoder((param.components || []).map((component) => {\n return this._getCoder(component);\n }), param.name);\n case \"\":\n return new NullCoder(param.name);\n }\n\n // u?int[0-9]*\n let match = param.type.match(paramTypeNumber);\n if (match) {\n let size = parseInt(match[2] || \"256\");\n if (size === 0 || size > 256 || (size % 8) !== 0) {\n logger.throwArgumentError(\"invalid \" + match[1] + \" bit length\", \"param\", param);\n }\n return new NumberCoder(size / 8, (match[1] === \"int\"), param.name);\n }\n\n // bytes[0-9]+\n match = param.type.match(paramTypeBytes);\n if (match) {\n let size = parseInt(match[1]);\n if (size === 0 || size > 32) {\n logger.throwArgumentError(\"invalid bytes length\", \"param\", param);\n }\n return new FixedBytesCoder(size, param.name);\n }\n\n return logger.throwArgumentError(\"invalid type\", \"type\", param.type);\n }\n\n _getWordSize(): number { return 32; }\n\n _getReader(data: Uint8Array, allowLoose?: boolean): Reader {\n return new Reader(data, this._getWordSize(), this.coerceFunc, allowLoose);\n }\n\n _getWriter(): Writer {\n return new Writer(this._getWordSize());\n }\n\n getDefaultValue(types: ReadonlyArray): Result {\n const coders: Array = types.map((type) => this._getCoder(ParamType.from(type)));\n const coder = new TupleCoder(coders, \"_\");\n return coder.defaultValue();\n }\n\n encode(types: ReadonlyArray, values: ReadonlyArray): string {\n if (types.length !== values.length) {\n logger.throwError(\"types/values length mismatch\", Logger.errors.INVALID_ARGUMENT, {\n count: { types: types.length, values: values.length },\n value: { types: types, values: values }\n });\n }\n\n const coders = types.map((type) => this._getCoder(ParamType.from(type)));\n const coder = (new TupleCoder(coders, \"_\"));\n\n const writer = this._getWriter();\n coder.encode(writer, values);\n return writer.data;\n }\n\n decode(types: ReadonlyArray, data: BytesLike, loose?: boolean): Result {\n const coders: Array = types.map((type) => this._getCoder(ParamType.from(type)));\n const coder = new TupleCoder(coders, \"_\");\n return coder.decode(this._getReader(arrayify(data), loose));\n }\n}\n\nexport const defaultAbiCoder: AbiCoder = new AbiCoder();\n\n","\"use strict\";\n\nimport { getAddress } from \"@ethersproject/address\";\nimport { BigNumber, BigNumberish } from \"@ethersproject/bignumber\";\nimport { arrayify, BytesLike, concat, hexDataSlice, hexlify, hexZeroPad, isHexString } from \"@ethersproject/bytes\";\nimport { id } from \"@ethersproject/hash\";\nimport { keccak256 } from \"@ethersproject/keccak256\"\nimport { defineReadOnly, Description, getStatic } from \"@ethersproject/properties\";\n\nimport { AbiCoder, defaultAbiCoder } from \"./abi-coder\";\nimport { checkResultErrors, Result } from \"./coders/abstract-coder\";\nimport { ConstructorFragment, ErrorFragment, EventFragment, FormatTypes, Fragment, FunctionFragment, JsonFragment, ParamType } from \"./fragments\";\n\nimport { Logger } from \"@ethersproject/logger\";\nimport { version } from \"./_version\";\nconst logger = new Logger(version);\n\nexport { checkResultErrors, Result };\n\nexport class LogDescription extends Description {\n readonly eventFragment: EventFragment;\n readonly name: string;\n readonly signature: string;\n readonly topic: string;\n readonly args: Result\n}\n\nexport class TransactionDescription extends Description {\n readonly functionFragment: FunctionFragment;\n readonly name: string;\n readonly args: Result;\n readonly signature: string;\n readonly sighash: string;\n readonly value: BigNumber;\n}\n\nexport class ErrorDescription extends Description {\n readonly errorFragment: ErrorFragment;\n readonly name: string;\n readonly args: Result;\n readonly signature: string;\n readonly sighash: string;\n}\n\nexport class Indexed extends Description {\n readonly hash: string;\n readonly _isIndexed: boolean;\n\n static isIndexed(value: any): value is Indexed {\n return !!(value && value._isIndexed);\n }\n}\n\nconst BuiltinErrors: Record, name: string, reason?: boolean }> = {\n \"0x08c379a0\": { signature: \"Error(string)\", name: \"Error\", inputs: [ \"string\" ], reason: true },\n \"0x4e487b71\": { signature: \"Panic(uint256)\", name: \"Panic\", inputs: [ \"uint256\" ] }\n}\n\nfunction wrapAccessError(property: string, error: Error): Error {\n const wrap = new Error(`deferred error during ABI decoding triggered accessing ${ property }`);\n (wrap).error = error;\n return wrap;\n}\n\n/*\nfunction checkNames(fragment: Fragment, type: \"input\" | \"output\", params: Array): void {\n params.reduce((accum, param) => {\n if (param.name) {\n if (accum[param.name]) {\n logger.throwArgumentError(`duplicate ${ type } parameter ${ JSON.stringify(param.name) } in ${ fragment.format(\"full\") }`, \"fragment\", fragment);\n }\n accum[param.name] = true;\n }\n return accum;\n }, <{ [ name: string ]: boolean }>{ });\n}\n*/\nexport class Interface {\n readonly fragments: ReadonlyArray