\n var CSS_NUMBER = \"[-\\\\+]?\\\\d*\\\\.\\\\d+%?\";\n\n // Allow positive/negative integer/number. Don't capture the either/or, just the entire outcome.\n var CSS_UNIT = \"(?:\" + CSS_NUMBER + \")|(?:\" + CSS_INTEGER + \")\";\n\n // Actual matching.\n // Parentheses and commas are optional, but not required.\n // Whitespace can take the place of commas or opening paren\n var PERMISSIVE_MATCH3 =\n \"[\\\\s|\\\\(]+(\" +\n CSS_UNIT +\n \")[,|\\\\s]+(\" +\n CSS_UNIT +\n \")[,|\\\\s]+(\" +\n CSS_UNIT +\n \")\\\\s*\\\\)?\";\n var PERMISSIVE_MATCH4 =\n \"[\\\\s|\\\\(]+(\" +\n CSS_UNIT +\n \")[,|\\\\s]+(\" +\n CSS_UNIT +\n \")[,|\\\\s]+(\" +\n CSS_UNIT +\n \")[,|\\\\s]+(\" +\n CSS_UNIT +\n \")\\\\s*\\\\)?\";\n\n return {\n CSS_UNIT: new RegExp(CSS_UNIT),\n rgb: new RegExp(\"rgb\" + PERMISSIVE_MATCH3),\n rgba: new RegExp(\"rgba\" + PERMISSIVE_MATCH4),\n hsl: new RegExp(\"hsl\" + PERMISSIVE_MATCH3),\n hsla: new RegExp(\"hsla\" + PERMISSIVE_MATCH4),\n hsv: new RegExp(\"hsv\" + PERMISSIVE_MATCH3),\n hsva: new RegExp(\"hsva\" + PERMISSIVE_MATCH4),\n hex3: /^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,\n hex6: /^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/,\n hex4: /^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,\n hex8: /^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/,\n };\n})();\n\n// `isValidCSSUnit`\n// Take in a single string / number and check to see if it looks like a CSS unit\n// (see `matchers` above for definition).\nfunction isValidCSSUnit(color) {\n return !!matchers.CSS_UNIT.exec(color);\n}\n\n// `stringInputToObject`\n// Permissive string parsing. Take in a number of formats, and output an object\n// based on detected format. Returns `{ r, g, b }` or `{ h, s, l }` or `{ h, s, v}`\nfunction stringInputToObject(color) {\n color = color.replace(trimLeft, \"\").replace(trimRight, \"\").toLowerCase();\n var named = false;\n if (names[color]) {\n color = names[color];\n named = true;\n } else if (color == \"transparent\") {\n return { r: 0, g: 0, b: 0, a: 0, format: \"name\" };\n }\n\n // Try to match string input using regular expressions.\n // Keep most of the number bounding out of this function - don't worry about [0,1] or [0,100] or [0,360]\n // Just return an object and let the conversion functions handle that.\n // This way the result will be the same whether the tinycolor is initialized with string or object.\n var match;\n if ((match = matchers.rgb.exec(color))) {\n return { r: match[1], g: match[2], b: match[3] };\n }\n if ((match = matchers.rgba.exec(color))) {\n return { r: match[1], g: match[2], b: match[3], a: match[4] };\n }\n if ((match = matchers.hsl.exec(color))) {\n return { h: match[1], s: match[2], l: match[3] };\n }\n if ((match = matchers.hsla.exec(color))) {\n return { h: match[1], s: match[2], l: match[3], a: match[4] };\n }\n if ((match = matchers.hsv.exec(color))) {\n return { h: match[1], s: match[2], v: match[3] };\n }\n if ((match = matchers.hsva.exec(color))) {\n return { h: match[1], s: match[2], v: match[3], a: match[4] };\n }\n if ((match = matchers.hex8.exec(color))) {\n return {\n r: parseIntFromHex(match[1]),\n g: parseIntFromHex(match[2]),\n b: parseIntFromHex(match[3]),\n a: convertHexToDecimal(match[4]),\n format: named ? \"name\" : \"hex8\",\n };\n }\n if ((match = matchers.hex6.exec(color))) {\n return {\n r: parseIntFromHex(match[1]),\n g: parseIntFromHex(match[2]),\n b: parseIntFromHex(match[3]),\n format: named ? \"name\" : \"hex\",\n };\n }\n if ((match = matchers.hex4.exec(color))) {\n return {\n r: parseIntFromHex(match[1] + \"\" + match[1]),\n g: parseIntFromHex(match[2] + \"\" + match[2]),\n b: parseIntFromHex(match[3] + \"\" + match[3]),\n a: convertHexToDecimal(match[4] + \"\" + match[4]),\n format: named ? \"name\" : \"hex8\",\n };\n }\n if ((match = matchers.hex3.exec(color))) {\n return {\n r: parseIntFromHex(match[1] + \"\" + match[1]),\n g: parseIntFromHex(match[2] + \"\" + match[2]),\n b: parseIntFromHex(match[3] + \"\" + match[3]),\n format: named ? \"name\" : \"hex\",\n };\n }\n\n return false;\n}\n\nfunction validateWCAG2Parms(parms) {\n // return valid WCAG2 parms for isReadable.\n // If input parms are invalid, return {\"level\":\"AA\", \"size\":\"small\"}\n var level, size;\n parms = parms || { level: \"AA\", size: \"small\" };\n level = (parms.level || \"AA\").toUpperCase();\n size = (parms.size || \"small\").toLowerCase();\n if (level !== \"AA\" && level !== \"AAA\") {\n level = \"AA\";\n }\n if (size !== \"small\" && size !== \"large\") {\n size = \"small\";\n }\n return { level: level, size: size };\n}\n\nexport { tinycolor as default };\n","import {\r\n styled,\r\n TableBody,\r\n TableContainer,\r\n TableRow,\r\n} from '@mui/material';\r\nimport {colors} from '../../../options/colors';\r\nimport tinycolor from 'tinycolor2';\r\n\r\nexport const TableWrapper = styled('div')(() => ({\r\n width: '100%',\r\n overflow: 'hidden',\r\n '& > p': {\r\n marginTop: 20,\r\n },\r\n}));\r\n\r\nexport const StyledTableContainer = styled(TableContainer)(({ fullheight }) => ({\r\n maxHeight: fullheight ? 'unset' : 660,\r\n}));\r\n\r\nexport const StyledTableBody = styled(TableBody)(() => ({}));\r\n\r\nexport const StyledTableRow = styled(TableRow)(({ color }) => ({\r\n '& .MuiTableCell-root': {\r\n background: color ? color : 'transparent',\r\n // Dynamically set color based on presence of color prop and if it is perceived to be light or dark\r\n color: color\r\n ? tinycolor(color).isDark()\r\n ? colors.white\r\n : colors.disabledBlack\r\n : colors.primaryGrey,\r\n },\r\n '&:nth-of-type(even)': {\r\n '& .MuiTableCell-root': {\r\n background: color ? color : 'rgba(255, 255, 255, 0.03)',\r\n },\r\n },\r\n}));\r\n","import generateUtilityClasses from '@mui/utils/generateUtilityClasses';\nimport generateUtilityClass from '@mui/utils/generateUtilityClass';\nexport function getTableHeadUtilityClass(slot) {\n return generateUtilityClass('MuiTableHead', slot);\n}\nconst tableHeadClasses = generateUtilityClasses('MuiTableHead', ['root']);\nexport default tableHeadClasses;","'use client';\n\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nconst _excluded = [\"className\", \"component\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport composeClasses from '@mui/utils/composeClasses';\nimport Tablelvl2Context from '../Table/Tablelvl2Context';\nimport useThemeProps from '../styles/useThemeProps';\nimport styled from '../styles/styled';\nimport { getTableHeadUtilityClass } from './tableHeadClasses';\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, getTableHeadUtilityClass, classes);\n};\nconst TableHeadRoot = styled('thead', {\n name: 'MuiTableHead',\n slot: 'Root',\n overridesResolver: (props, styles) => styles.root\n})({\n display: 'table-header-group'\n});\nconst tablelvl2 = {\n variant: 'head'\n};\nconst defaultComponent = 'thead';\nconst TableHead = /*#__PURE__*/React.forwardRef(function TableHead(inProps, ref) {\n const props = useThemeProps({\n props: inProps,\n name: 'MuiTableHead'\n });\n const {\n className,\n component = defaultComponent\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const ownerState = _extends({}, props, {\n component\n });\n const classes = useUtilityClasses(ownerState);\n return /*#__PURE__*/_jsx(Tablelvl2Context.Provider, {\n value: tablelvl2,\n children: /*#__PURE__*/_jsx(TableHeadRoot, _extends({\n as: component,\n className: clsx(classes.root, className),\n ref: ref,\n role: component === defaultComponent ? null : 'rowgroup',\n ownerState: ownerState\n }, other))\n });\n});\nprocess.env.NODE_ENV !== \"production\" ? TableHead.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, normally `TableRow`.\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 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 * 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 TableHead;","'use client';\n\nimport * as React from 'react';\n\n/**\n * @ignore - internal component.\n */\nconst TableContext = /*#__PURE__*/React.createContext();\nif (process.env.NODE_ENV !== 'production') {\n TableContext.displayName = 'TableContext';\n}\nexport default TableContext;","import generateUtilityClasses from '@mui/utils/generateUtilityClasses';\nimport generateUtilityClass from '@mui/utils/generateUtilityClass';\nexport function getTableCellUtilityClass(slot) {\n return generateUtilityClass('MuiTableCell', slot);\n}\nconst tableCellClasses = generateUtilityClasses('MuiTableCell', ['root', 'head', 'body', 'footer', 'sizeSmall', 'sizeMedium', 'paddingCheckbox', 'paddingNone', 'alignLeft', 'alignCenter', 'alignRight', 'alignJustify', 'stickyHeader']);\nexport default tableCellClasses;","'use client';\n\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"align\", \"className\", \"component\", \"padding\", \"scope\", \"size\", \"sortDirection\", \"variant\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport composeClasses from '@mui/utils/composeClasses';\nimport { darken, alpha, lighten } from '@mui/system/colorManipulator';\nimport capitalize from '../utils/capitalize';\nimport TableContext from '../Table/TableContext';\nimport Tablelvl2Context from '../Table/Tablelvl2Context';\nimport useThemeProps from '../styles/useThemeProps';\nimport styled from '../styles/styled';\nimport tableCellClasses, { getTableCellUtilityClass } from './tableCellClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes,\n variant,\n align,\n padding,\n size,\n stickyHeader\n } = ownerState;\n const slots = {\n root: ['root', variant, stickyHeader && 'stickyHeader', align !== 'inherit' && `align${capitalize(align)}`, padding !== 'normal' && `padding${capitalize(padding)}`, `size${capitalize(size)}`]\n };\n return composeClasses(slots, getTableCellUtilityClass, classes);\n};\nconst TableCellRoot = styled('td', {\n name: 'MuiTableCell',\n slot: 'Root',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.root, styles[ownerState.variant], styles[`size${capitalize(ownerState.size)}`], ownerState.padding !== 'normal' && styles[`padding${capitalize(ownerState.padding)}`], ownerState.align !== 'inherit' && styles[`align${capitalize(ownerState.align)}`], ownerState.stickyHeader && styles.stickyHeader];\n }\n})(({\n theme,\n ownerState\n}) => _extends({}, theme.typography.body2, {\n display: 'table-cell',\n verticalAlign: 'inherit',\n // Workaround for a rendering bug with spanned columns in Chrome 62.0.\n // Removes the alpha (sets it to 1), and lightens or darkens the theme color.\n borderBottom: theme.vars ? `1px solid ${theme.vars.palette.TableCell.border}` : `1px solid\n ${theme.palette.mode === 'light' ? lighten(alpha(theme.palette.divider, 1), 0.88) : darken(alpha(theme.palette.divider, 1), 0.68)}`,\n textAlign: 'left',\n padding: 16\n}, ownerState.variant === 'head' && {\n color: (theme.vars || theme).palette.text.primary,\n lineHeight: theme.typography.pxToRem(24),\n fontWeight: theme.typography.fontWeightMedium\n}, ownerState.variant === 'body' && {\n color: (theme.vars || theme).palette.text.primary\n}, ownerState.variant === 'footer' && {\n color: (theme.vars || theme).palette.text.secondary,\n lineHeight: theme.typography.pxToRem(21),\n fontSize: theme.typography.pxToRem(12)\n}, ownerState.size === 'small' && {\n padding: '6px 16px',\n [`&.${tableCellClasses.paddingCheckbox}`]: {\n width: 24,\n // prevent the checkbox column from growing\n padding: '0 12px 0 16px',\n '& > *': {\n padding: 0\n }\n }\n}, ownerState.padding === 'checkbox' && {\n width: 48,\n // prevent the checkbox column from growing\n padding: '0 0 0 4px'\n}, ownerState.padding === 'none' && {\n padding: 0\n}, ownerState.align === 'left' && {\n textAlign: 'left'\n}, ownerState.align === 'center' && {\n textAlign: 'center'\n}, ownerState.align === 'right' && {\n textAlign: 'right',\n flexDirection: 'row-reverse'\n}, ownerState.align === 'justify' && {\n textAlign: 'justify'\n}, ownerState.stickyHeader && {\n position: 'sticky',\n top: 0,\n zIndex: 2,\n backgroundColor: (theme.vars || theme).palette.background.default\n}));\n\n/**\n * The component renders a `` element when the parent context is a header\n * or otherwise a ` | ` element.\n */\nconst TableCell = /*#__PURE__*/React.forwardRef(function TableCell(inProps, ref) {\n const props = useThemeProps({\n props: inProps,\n name: 'MuiTableCell'\n });\n const {\n align = 'inherit',\n className,\n component: componentProp,\n padding: paddingProp,\n scope: scopeProp,\n size: sizeProp,\n sortDirection,\n variant: variantProp\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const table = React.useContext(TableContext);\n const tablelvl2 = React.useContext(Tablelvl2Context);\n const isHeadCell = tablelvl2 && tablelvl2.variant === 'head';\n let component;\n if (componentProp) {\n component = componentProp;\n } else {\n component = isHeadCell ? 'th' : 'td';\n }\n let scope = scopeProp;\n // scope is not a valid attribute for | | elements.\n // source: https://html.spec.whatwg.org/multipage/tables.html#the-td-element\n if (component === 'td') {\n scope = undefined;\n } else if (!scope && isHeadCell) {\n scope = 'col';\n }\n const variant = variantProp || tablelvl2 && tablelvl2.variant;\n const ownerState = _extends({}, props, {\n align,\n component,\n padding: paddingProp || (table && table.padding ? table.padding : 'normal'),\n size: sizeProp || (table && table.size ? table.size : 'medium'),\n sortDirection,\n stickyHeader: variant === 'head' && table && table.stickyHeader,\n variant\n });\n const classes = useUtilityClasses(ownerState);\n let ariaSort = null;\n if (sortDirection) {\n ariaSort = sortDirection === 'asc' ? 'ascending' : 'descending';\n }\n return /*#__PURE__*/_jsx(TableCellRoot, _extends({\n as: component,\n ref: ref,\n className: clsx(classes.root, className),\n \"aria-sort\": ariaSort,\n scope: scope,\n ownerState: ownerState\n }, other));\n});\nprocess.env.NODE_ENV !== \"production\" ? TableCell.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 * Set the text-align on the table cell content.\n *\n * Monetary or generally number fields **should be right aligned** as that allows\n * you to add them up quickly in your head without having to worry about decimals.\n * @default 'inherit'\n */\n align: PropTypes.oneOf(['center', 'inherit', 'justify', 'left', 'right']),\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 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 * Sets the padding applied to the cell.\n * The prop defaults to the value (`'default'`) inherited from the parent Table component.\n */\n padding: PropTypes.oneOf(['checkbox', 'none', 'normal']),\n /**\n * Set scope attribute.\n */\n scope: PropTypes.string,\n /**\n * Specify the size of the cell.\n * The prop defaults to the value (`'medium'`) inherited from the parent Table component.\n */\n size: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['medium', 'small']), PropTypes.string]),\n /**\n * Set aria-sort direction.\n */\n sortDirection: PropTypes.oneOf(['asc', 'desc', false]),\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 * Specify the cell type.\n * The prop defaults to the value inherited from the parent TableHead, TableBody, or TableFooter components.\n */\n variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['body', 'footer', 'head']), PropTypes.string])\n} : void 0;\nexport default TableCell;","'use client';\n\nimport * as React from 'react';\nimport createSvgIcon from '../../utils/createSvgIcon';\n\n/**\n * @ignore - internal component.\n */\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M20 12l-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8 8-8z\"\n}), 'ArrowDownward');","import generateUtilityClasses from '@mui/utils/generateUtilityClasses';\nimport generateUtilityClass from '@mui/utils/generateUtilityClass';\nexport function getTableSortLabelUtilityClass(slot) {\n return generateUtilityClass('MuiTableSortLabel', slot);\n}\nconst tableSortLabelClasses = generateUtilityClasses('MuiTableSortLabel', ['root', 'active', 'icon', 'iconDirectionDesc', 'iconDirectionAsc']);\nexport default tableSortLabelClasses;","'use client';\n\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"active\", \"children\", \"className\", \"direction\", \"hideSortIcon\", \"IconComponent\"];\nimport composeClasses from '@mui/utils/composeClasses';\nimport clsx from 'clsx';\nimport PropTypes from 'prop-types';\nimport * as React from 'react';\nimport ButtonBase from '../ButtonBase';\nimport ArrowDownwardIcon from '../internal/svg-icons/ArrowDownward';\nimport styled from '../styles/styled';\nimport useThemeProps from '../styles/useThemeProps';\nimport capitalize from '../utils/capitalize';\nimport tableSortLabelClasses, { getTableSortLabelUtilityClass } from './tableSortLabelClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes,\n direction,\n active\n } = ownerState;\n const slots = {\n root: ['root', active && 'active'],\n icon: ['icon', `iconDirection${capitalize(direction)}`]\n };\n return composeClasses(slots, getTableSortLabelUtilityClass, classes);\n};\nconst TableSortLabelRoot = styled(ButtonBase, {\n name: 'MuiTableSortLabel',\n slot: 'Root',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.root, ownerState.active && styles.active];\n }\n})(({\n theme\n}) => ({\n cursor: 'pointer',\n display: 'inline-flex',\n justifyContent: 'flex-start',\n flexDirection: 'inherit',\n alignItems: 'center',\n '&:focus': {\n color: (theme.vars || theme).palette.text.secondary\n },\n '&:hover': {\n color: (theme.vars || theme).palette.text.secondary,\n [`& .${tableSortLabelClasses.icon}`]: {\n opacity: 0.5\n }\n },\n [`&.${tableSortLabelClasses.active}`]: {\n color: (theme.vars || theme).palette.text.primary,\n [`& .${tableSortLabelClasses.icon}`]: {\n opacity: 1,\n color: (theme.vars || theme).palette.text.secondary\n }\n }\n}));\nconst TableSortLabelIcon = styled('span', {\n name: 'MuiTableSortLabel',\n slot: 'Icon',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.icon, styles[`iconDirection${capitalize(ownerState.direction)}`]];\n }\n})(({\n theme,\n ownerState\n}) => _extends({\n fontSize: 18,\n marginRight: 4,\n marginLeft: 4,\n opacity: 0,\n transition: theme.transitions.create(['opacity', 'transform'], {\n duration: theme.transitions.duration.shorter\n }),\n userSelect: 'none'\n}, ownerState.direction === 'desc' && {\n transform: 'rotate(0deg)'\n}, ownerState.direction === 'asc' && {\n transform: 'rotate(180deg)'\n}));\n\n/**\n * A button based label for placing inside `TableCell` for column sorting.\n */\nconst TableSortLabel = /*#__PURE__*/React.forwardRef(function TableSortLabel(inProps, ref) {\n const props = useThemeProps({\n props: inProps,\n name: 'MuiTableSortLabel'\n });\n const {\n active = false,\n children,\n className,\n direction = 'asc',\n hideSortIcon = false,\n IconComponent = ArrowDownwardIcon\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const ownerState = _extends({}, props, {\n active,\n direction,\n hideSortIcon,\n IconComponent\n });\n const classes = useUtilityClasses(ownerState);\n return /*#__PURE__*/_jsxs(TableSortLabelRoot, _extends({\n className: clsx(classes.root, className),\n component: \"span\",\n disableRipple: true,\n ownerState: ownerState,\n ref: ref\n }, other, {\n children: [children, hideSortIcon && !active ? null : /*#__PURE__*/_jsx(TableSortLabelIcon, {\n as: IconComponent,\n className: clsx(classes.icon),\n ownerState: ownerState\n })]\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? TableSortLabel.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 * If `true`, the label will have the active styling (should be true for the sorted column).\n * @default false\n */\n active: PropTypes.bool,\n /**\n * Label contents, the arrow will be appended automatically.\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 current sort direction.\n * @default 'asc'\n */\n direction: PropTypes.oneOf(['asc', 'desc']),\n /**\n * Hide sort icon when active is false.\n * @default false\n */\n hideSortIcon: PropTypes.bool,\n /**\n * Sort icon to use.\n * @default ArrowDownwardIcon\n */\n IconComponent: PropTypes.elementType,\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 TableSortLabel;","import {\r\n styled,\r\n TableHead,\r\n TableRow,\r\n TableCell,\r\n TableSortLabel,\r\n} from '@mui/material';\r\n\r\nexport const StyledTableHead = styled(TableHead)(({ small }) => ({\r\n '& .MuiTableCell-root': {\r\n fontSize: small ? 12 : 14,\r\n },\r\n}));\r\n\r\nexport const StyledTableRow = styled(TableRow)(() => ({}));\r\n\r\nexport const StyledTableCell = styled(TableCell)(({email}) => ({\r\n maxWidth: email ? 175 : 'unset',\r\n whiteSpace: email ? 'nowrap' : 'unset',\r\n overflow: email ? 'hidden' : 'unset',\r\n textOverflow: email ? 'ellipsis' : 'unset',\r\n}));\r\n\r\nexport const StyledTableSortLabel = styled(TableSortLabel)(() => ({}));\r\n\r\nexport const TextWithTooltipContainer = styled('div')(() => ({\r\n display: 'flex',\r\n}));\r\n\r\nexport const TooltipContainer = styled('div')(() => ({\r\n marginLeft: 5,\r\n transform: 'translateY(-1px)',\r\n}));\r\n","import {\r\n styled,\r\n Typography,\r\n} from '@mui/material';\r\nimport {\r\n StyledTableBody,\r\n StyledTableRow,\r\n} from '../CustomTableWrapper/CustomTableWrapper.styles';\r\nimport {StyledTableCell} from '../CustomTableHead/CustomTableHead.styles';\r\n\r\nexport const Container = styled('div')(() => ({\r\n marginBottom: 40,\r\n}));\r\n\r\nexport const DeleteText = styled(Typography)(({ theme }) =>({\r\n ...theme.typography.body1,\r\n}));\r\n\r\nexport {\r\n StyledTableBody,\r\n StyledTableRow,\r\n StyledTableCell,\r\n}\r\n","export const teamMembersColumns = [\r\n {\r\n id: 'name',\r\n label: 'Name',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'email',\r\n label: 'Email',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'role',\r\n label: 'Role',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'edit',\r\n label: '',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'delete',\r\n label: '',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n];\r\n\r\nexport const subscriptionColumns = [\r\n // {\r\n // id: 'licences',\r\n // label: 'Licence No.',\r\n // align: 'left',\r\n // sortable: false,\r\n // showTooltip: false,\r\n // tooltipText: '',\r\n // },\r\n // {\r\n // id: 'add-ons',\r\n // label: 'No. Add-Ons',\r\n // align: 'left',\r\n // sortable: false,\r\n // showTooltip: false,\r\n // tooltipText: '',\r\n // },\r\n {\r\n id: 'name',\r\n label: 'Product name',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n\r\n {\r\n id: 'frequency',\r\n label: 'Frequency',\r\n align: 'center',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'next-amount',\r\n label: 'Next Billing Amount',\r\n align: 'center',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'expires',\r\n label: 'Renewal Date',\r\n align: 'center',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n /* {\r\n id: 'auto-renew',\r\n label: 'Auto Renew',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n }, */\r\n {\r\n id: 'cancel',\r\n label: '',\r\n align: 'right',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n];\r\n\r\nexport const paymentMethodColumns = [\r\n {\r\n id: 'name',\r\n label: 'Name',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'expiry',\r\n label: 'Expiration date',\r\n align: 'left',\r\n sortable: true,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'status',\r\n label: 'Status',\r\n align: 'left',\r\n sortable: true,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'type',\r\n label: 'Type',\r\n align: 'left',\r\n sortable: true,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'edit',\r\n label: '',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'delete',\r\n label: '',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n];\r\n\r\nexport const invoicesColumns = [\r\n {\r\n id: 'date',\r\n label: 'Date',\r\n align: 'left',\r\n sortable: true,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'docId',\r\n label: 'Document ID',\r\n align: 'left',\r\n sortable: true,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'docType',\r\n label: 'Document type',\r\n align: 'left',\r\n sortable: true,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'billedAmount',\r\n label: 'Billed amount',\r\n align: 'left',\r\n sortable: true,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'status',\r\n label: 'Status',\r\n align: 'left',\r\n sortable: true,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'link',\r\n label: '',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n];\r\n\r\nexport const indexTopTenColumns = [\r\n {\r\n id: 'rank',\r\n label: 'No.',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'name',\r\n label: 'Player',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'birthYear',\r\n label: 'YOB',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'topScore',\r\n label: 'Top Score',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'avgScore',\r\n label: 'Avg Score',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'lastScore',\r\n label: 'Last Score',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'worldRank',\r\n label: 'World Rank',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n];\r\n\r\nexport const indexBestDrillsColumns = [\r\n {\r\n id: 'drill',\r\n label: 'Drill',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'name',\r\n label: 'Player',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'highScore',\r\n label: 'Highest Score',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'worldAvg',\r\n label: 'World Average',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n];\r\n\r\nexport const playerProfilesColumns = [\r\n {\r\n id: 'burger',\r\n label: '',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'name',\r\n label: 'Name',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'dob',\r\n label: 'DOB',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'position',\r\n label: 'Position',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'shoe_size',\r\n label: 'Shoe size',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'gender',\r\n label: 'Gender',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'nationality',\r\n label: 'Nationality',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'email',\r\n label: 'Email',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'leaderboards_active',\r\n label: 'LB',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: true,\r\n tooltipText: 'Show or hide in leaderboards',\r\n },\r\n {\r\n id: 'edit',\r\n label: '',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'forgotPassword',\r\n label: '',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'delete',\r\n label: '',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n];\r\n\r\nexport const groupsColumns = [\r\n {\r\n id: 'name',\r\n label: 'Name',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'edit',\r\n label: '',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'delete',\r\n label: '',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n];\r\n\r\nexport const indexLeaderboardColumns = [\r\n {\r\n id: 'rank',\r\n label: '',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'name',\r\n label: 'Name',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'yob',\r\n label: 'YOB',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'topScore',\r\n label: 'Top Score',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'avgScore',\r\n label: 'Avg Score',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'lastScore',\r\n label: 'Last Score',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'worldRank',\r\n label: 'World Rank',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n];\r\n\r\nexport const rezzilPlayerLeaderboardColumns = [\r\n {\r\n id: 'rank',\r\n label: '',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'userName',\r\n label: 'User Name',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'score',\r\n label: 'Score',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n];\r\n\r\nexport const squadDeviceColumns = [\r\n {\r\n id: 'name',\r\n label: 'Name',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'dateRegistered',\r\n label: 'Date Registered',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n // {\r\n // id: 'mainDevice',\r\n // label: 'Main Device',\r\n // align: 'left',\r\n // sortable: false,\r\n // showTooltip: false,\r\n // tooltipText: '',\r\n // },\r\n {\r\n id: 'delete',\r\n label: '',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n];\r\n\r\nexport const squadPlayerColumns = [\r\n {\r\n id: 'name',\r\n label: 'Name',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'dateRegistered',\r\n label: 'Date Registered',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n {\r\n id: 'delete',\r\n label: '',\r\n align: 'left',\r\n sortable: false,\r\n showTooltip: false,\r\n tooltipText: '',\r\n },\r\n];","export const tableParentOptions = {\r\n teamMembers: 'TeamMembersList.jsx',\r\n playerProfiles: 'PlayerProfilesList.jsx',\r\n groups: 'GroupsList.jsx'\r\n};\r\n","import {\r\n TableWrapper,\r\n StyledTableContainer,\r\n} from './CustomTableWrapper.styles';\r\nimport NoResultsText from '../../Typography/NoResultsText/NoResultsText';\r\n\r\nconst CustomTableWrapper = ({children, noResultsText, fullHeight}) => {\r\n return (\r\n \r\n \r\n {children}\r\n \r\n {\r\n noResultsText &&\r\n \r\n }\r\n \r\n );\r\n};\r\n\r\nexport default CustomTableWrapper;\r\n","import generateUtilityClasses from '@mui/utils/generateUtilityClasses';\nimport generateUtilityClass from '@mui/utils/generateUtilityClass';\nexport function getTableUtilityClass(slot) {\n return generateUtilityClass('MuiTable', slot);\n}\nconst tableClasses = generateUtilityClasses('MuiTable', ['root', 'stickyHeader']);\nexport default tableClasses;","'use client';\n\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"className\", \"component\", \"padding\", \"size\", \"stickyHeader\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport composeClasses from '@mui/utils/composeClasses';\nimport TableContext from './TableContext';\nimport useThemeProps from '../styles/useThemeProps';\nimport styled from '../styles/styled';\nimport { getTableUtilityClass } from './tableClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n classes,\n stickyHeader\n } = ownerState;\n const slots = {\n root: ['root', stickyHeader && 'stickyHeader']\n };\n return composeClasses(slots, getTableUtilityClass, classes);\n};\nconst TableRoot = styled('table', {\n name: 'MuiTable',\n slot: 'Root',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.root, ownerState.stickyHeader && styles.stickyHeader];\n }\n})(({\n theme,\n ownerState\n}) => _extends({\n display: 'table',\n width: '100%',\n borderCollapse: 'collapse',\n borderSpacing: 0,\n '& caption': _extends({}, theme.typography.body2, {\n padding: theme.spacing(2),\n color: (theme.vars || theme).palette.text.secondary,\n textAlign: 'left',\n captionSide: 'bottom'\n })\n}, ownerState.stickyHeader && {\n borderCollapse: 'separate'\n}));\nconst defaultComponent = 'table';\nconst Table = /*#__PURE__*/React.forwardRef(function Table(inProps, ref) {\n const props = useThemeProps({\n props: inProps,\n name: 'MuiTable'\n });\n const {\n className,\n component = defaultComponent,\n padding = 'normal',\n size = 'medium',\n stickyHeader = false\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const ownerState = _extends({}, props, {\n component,\n padding,\n size,\n stickyHeader\n });\n const classes = useUtilityClasses(ownerState);\n const table = React.useMemo(() => ({\n padding,\n size,\n stickyHeader\n }), [padding, size, stickyHeader]);\n return /*#__PURE__*/_jsx(TableContext.Provider, {\n value: table,\n children: /*#__PURE__*/_jsx(TableRoot, _extends({\n as: component,\n role: component === defaultComponent ? null : 'table',\n ref: ref,\n className: clsx(classes.root, className),\n ownerState: ownerState\n }, other))\n });\n});\nprocess.env.NODE_ENV !== \"production\" ? Table.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 table, normally `TableHead` and `TableBody`.\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 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 * Allows TableCells to inherit padding of the Table.\n * @default 'normal'\n */\n padding: PropTypes.oneOf(['checkbox', 'none', 'normal']),\n /**\n * Allows TableCells to inherit size of the Table.\n * @default 'medium'\n */\n size: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['medium', 'small']), PropTypes.string]),\n /**\n * Set the header sticky.\n *\n * ⚠️ It doesn't work with IE11.\n * @default false\n */\n stickyHeader: PropTypes.bool,\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 Table;","import {styled, Table} from '@mui/material';\r\n\r\nexport const StandardTable = styled(Table)(() => {});\r\n\r\nexport const StyledTeamMembersTable = styled(Table)(() => ({\r\n '& .MuiTableCell-root': {\r\n '&:nth-of-type(4)': {\r\n width: 50,\r\n },\r\n '&:last-of-type': {\r\n width: 50,\r\n },\r\n },\r\n}));\r\n\r\nexport const StyledProfilesTable = styled(Table)(() => ({\r\n '& .MuiTableCell-root': {\r\n whiteSpace: 'nowrap',\r\n '&:nth-of-type(8)': {\r\n width: 50,\r\n },\r\n '&:nth-of-type(9)': {\r\n width: 50,\r\n },\r\n '&:nth-of-type(10)': {\r\n width: 50,\r\n },\r\n '&:last-of-type': {\r\n width: 50,\r\n },\r\n },\r\n}));\r\n\r\nexport const StyledGroupsTable = styled(Table)(() => ({\r\n '& .MuiTableCell-root': {\r\n whiteSpace: 'nowrap',\r\n '&:nth-of-type(2)': {\r\n width: 50,\r\n },\r\n '&:last-of-type': {\r\n width: 50,\r\n },\r\n },\r\n}));\r\n","import {memo} from 'react';\r\nimport {\r\n StandardTable,\r\n StyledTeamMembersTable,\r\n StyledProfilesTable,\r\n StyledGroupsTable,\r\n} from './MemoizedTable.styles';\r\nimport {tableParentOptions} from '../../../options/tableParentOptions';\r\n\r\nconst MemoizedTable = ({\r\n list,\r\n parentComponent,\r\n children,\r\n}) => {\r\n\r\n const getParentComponent = () => {\r\n // Return correct table component based on parent component\r\n switch (parentComponent) {\r\n case tableParentOptions.teamMembers:\r\n return {children};\r\n case tableParentOptions.playerProfiles:\r\n return {children};\r\n case tableParentOptions.groups:\r\n return {children};\r\n default:\r\n return {children};\r\n }\r\n };\r\n\r\n return (\r\n <>\r\n {\r\n list.length > 0 && getParentComponent()\r\n }\r\n >\r\n )\r\n};\r\n\r\n// Use memo HOC to only re-render component if change to the profiles array\r\nconst areEqual = (prevProps, nextProps) => prevProps.list === nextProps.list;\r\n\r\nexport default memo(MemoizedTable, areEqual);\r\n","import createSvgIcon from './utils/createSvgIcon';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"m7 10 5 5 5-5z\"\n}), 'ArrowDropDown');","import generateUtilityClasses from '@mui/utils/generateUtilityClasses';\nimport generateUtilityClass from '@mui/utils/generateUtilityClass';\nexport function getTooltipUtilityClass(slot) {\n return generateUtilityClass('MuiTooltip', slot);\n}\nconst tooltipClasses = generateUtilityClasses('MuiTooltip', ['popper', 'popperInteractive', 'popperArrow', 'popperClose', 'tooltip', 'tooltipArrow', 'touch', 'tooltipPlacementLeft', 'tooltipPlacementRight', 'tooltipPlacementTop', 'tooltipPlacementBottom', 'arrow']);\nexport default tooltipClasses;","'use client';\n\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"arrow\", \"children\", \"classes\", \"components\", \"componentsProps\", \"describeChild\", \"disableFocusListener\", \"disableHoverListener\", \"disableInteractive\", \"disableTouchListener\", \"enterDelay\", \"enterNextDelay\", \"enterTouchDelay\", \"followCursor\", \"id\", \"leaveDelay\", \"leaveTouchDelay\", \"onClose\", \"onOpen\", \"open\", \"placement\", \"PopperComponent\", \"PopperProps\", \"slotProps\", \"slots\", \"title\", \"TransitionComponent\", \"TransitionProps\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport useTimeout, { Timeout } from '@mui/utils/useTimeout';\nimport elementAcceptingRef from '@mui/utils/elementAcceptingRef';\nimport { appendOwnerState } from '@mui/base/utils';\nimport composeClasses from '@mui/utils/composeClasses';\nimport { alpha } from '@mui/system/colorManipulator';\nimport { useRtl } from '@mui/system/RtlProvider';\nimport styled from '../styles/styled';\nimport useTheme from '../styles/useTheme';\nimport useThemeProps from '../styles/useThemeProps';\nimport capitalize from '../utils/capitalize';\nimport Grow from '../Grow';\nimport Popper from '../Popper';\nimport useEventCallback from '../utils/useEventCallback';\nimport useForkRef from '../utils/useForkRef';\nimport useId from '../utils/useId';\nimport useIsFocusVisible from '../utils/useIsFocusVisible';\nimport useControlled from '../utils/useControlled';\nimport tooltipClasses, { getTooltipUtilityClass } from './tooltipClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nfunction round(value) {\n return Math.round(value * 1e5) / 1e5;\n}\nconst useUtilityClasses = ownerState => {\n const {\n classes,\n disableInteractive,\n arrow,\n touch,\n placement\n } = ownerState;\n const slots = {\n popper: ['popper', !disableInteractive && 'popperInteractive', arrow && 'popperArrow'],\n tooltip: ['tooltip', arrow && 'tooltipArrow', touch && 'touch', `tooltipPlacement${capitalize(placement.split('-')[0])}`],\n arrow: ['arrow']\n };\n return composeClasses(slots, getTooltipUtilityClass, classes);\n};\nconst TooltipPopper = styled(Popper, {\n name: 'MuiTooltip',\n slot: 'Popper',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.popper, !ownerState.disableInteractive && styles.popperInteractive, ownerState.arrow && styles.popperArrow, !ownerState.open && styles.popperClose];\n }\n})(({\n theme,\n ownerState,\n open\n}) => _extends({\n zIndex: (theme.vars || theme).zIndex.tooltip,\n pointerEvents: 'none'\n}, !ownerState.disableInteractive && {\n pointerEvents: 'auto'\n}, !open && {\n pointerEvents: 'none'\n}, ownerState.arrow && {\n [`&[data-popper-placement*=\"bottom\"] .${tooltipClasses.arrow}`]: {\n top: 0,\n marginTop: '-0.71em',\n '&::before': {\n transformOrigin: '0 100%'\n }\n },\n [`&[data-popper-placement*=\"top\"] .${tooltipClasses.arrow}`]: {\n bottom: 0,\n marginBottom: '-0.71em',\n '&::before': {\n transformOrigin: '100% 0'\n }\n },\n [`&[data-popper-placement*=\"right\"] .${tooltipClasses.arrow}`]: _extends({}, !ownerState.isRtl ? {\n left: 0,\n marginLeft: '-0.71em'\n } : {\n right: 0,\n marginRight: '-0.71em'\n }, {\n height: '1em',\n width: '0.71em',\n '&::before': {\n transformOrigin: '100% 100%'\n }\n }),\n [`&[data-popper-placement*=\"left\"] .${tooltipClasses.arrow}`]: _extends({}, !ownerState.isRtl ? {\n right: 0,\n marginRight: '-0.71em'\n } : {\n left: 0,\n marginLeft: '-0.71em'\n }, {\n height: '1em',\n width: '0.71em',\n '&::before': {\n transformOrigin: '0 0'\n }\n })\n}));\nconst TooltipTooltip = styled('div', {\n name: 'MuiTooltip',\n slot: 'Tooltip',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.tooltip, ownerState.touch && styles.touch, ownerState.arrow && styles.tooltipArrow, styles[`tooltipPlacement${capitalize(ownerState.placement.split('-')[0])}`]];\n }\n})(({\n theme,\n ownerState\n}) => _extends({\n backgroundColor: theme.vars ? theme.vars.palette.Tooltip.bg : alpha(theme.palette.grey[700], 0.92),\n borderRadius: (theme.vars || theme).shape.borderRadius,\n color: (theme.vars || theme).palette.common.white,\n fontFamily: theme.typography.fontFamily,\n padding: '4px 8px',\n fontSize: theme.typography.pxToRem(11),\n maxWidth: 300,\n margin: 2,\n wordWrap: 'break-word',\n fontWeight: theme.typography.fontWeightMedium\n}, ownerState.arrow && {\n position: 'relative',\n margin: 0\n}, ownerState.touch && {\n padding: '8px 16px',\n fontSize: theme.typography.pxToRem(14),\n lineHeight: `${round(16 / 14)}em`,\n fontWeight: theme.typography.fontWeightRegular\n}, {\n [`.${tooltipClasses.popper}[data-popper-placement*=\"left\"] &`]: _extends({\n transformOrigin: 'right center'\n }, !ownerState.isRtl ? _extends({\n marginRight: '14px'\n }, ownerState.touch && {\n marginRight: '24px'\n }) : _extends({\n marginLeft: '14px'\n }, ownerState.touch && {\n marginLeft: '24px'\n })),\n [`.${tooltipClasses.popper}[data-popper-placement*=\"right\"] &`]: _extends({\n transformOrigin: 'left center'\n }, !ownerState.isRtl ? _extends({\n marginLeft: '14px'\n }, ownerState.touch && {\n marginLeft: '24px'\n }) : _extends({\n marginRight: '14px'\n }, ownerState.touch && {\n marginRight: '24px'\n })),\n [`.${tooltipClasses.popper}[data-popper-placement*=\"top\"] &`]: _extends({\n transformOrigin: 'center bottom',\n marginBottom: '14px'\n }, ownerState.touch && {\n marginBottom: '24px'\n }),\n [`.${tooltipClasses.popper}[data-popper-placement*=\"bottom\"] &`]: _extends({\n transformOrigin: 'center top',\n marginTop: '14px'\n }, ownerState.touch && {\n marginTop: '24px'\n })\n}));\nconst TooltipArrow = styled('span', {\n name: 'MuiTooltip',\n slot: 'Arrow',\n overridesResolver: (props, styles) => styles.arrow\n})(({\n theme\n}) => ({\n overflow: 'hidden',\n position: 'absolute',\n width: '1em',\n height: '0.71em' /* = width / sqrt(2) = (length of the hypotenuse) */,\n boxSizing: 'border-box',\n color: theme.vars ? theme.vars.palette.Tooltip.bg : alpha(theme.palette.grey[700], 0.9),\n '&::before': {\n content: '\"\"',\n margin: 'auto',\n display: 'block',\n width: '100%',\n height: '100%',\n backgroundColor: 'currentColor',\n transform: 'rotate(45deg)'\n }\n}));\nlet hystersisOpen = false;\nconst hystersisTimer = new Timeout();\nlet cursorPosition = {\n x: 0,\n y: 0\n};\nexport function testReset() {\n hystersisOpen = false;\n hystersisTimer.clear();\n}\nfunction composeEventHandler(handler, eventHandler) {\n return (event, ...params) => {\n if (eventHandler) {\n eventHandler(event, ...params);\n }\n handler(event, ...params);\n };\n}\n\n// TODO v6: Remove PopperComponent, PopperProps, TransitionComponent and TransitionProps.\nconst Tooltip = /*#__PURE__*/React.forwardRef(function Tooltip(inProps, ref) {\n var _ref, _slots$popper, _ref2, _ref3, _slots$transition, _ref4, _slots$tooltip, _ref5, _slots$arrow, _slotProps$popper, _ref6, _slotProps$popper2, _slotProps$transition, _slotProps$tooltip, _ref7, _slotProps$tooltip2, _slotProps$arrow, _ref8, _slotProps$arrow2;\n const props = useThemeProps({\n props: inProps,\n name: 'MuiTooltip'\n });\n const {\n arrow = false,\n children: childrenProp,\n components = {},\n componentsProps = {},\n describeChild = false,\n disableFocusListener = false,\n disableHoverListener = false,\n disableInteractive: disableInteractiveProp = false,\n disableTouchListener = false,\n enterDelay = 100,\n enterNextDelay = 0,\n enterTouchDelay = 700,\n followCursor = false,\n id: idProp,\n leaveDelay = 0,\n leaveTouchDelay = 1500,\n onClose,\n onOpen,\n open: openProp,\n placement = 'bottom',\n PopperComponent: PopperComponentProp,\n PopperProps = {},\n slotProps = {},\n slots = {},\n title,\n TransitionComponent: TransitionComponentProp = Grow,\n TransitionProps\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n\n // to prevent runtime errors, developers will need to provide a child as a React element anyway.\n const children = /*#__PURE__*/React.isValidElement(childrenProp) ? childrenProp : /*#__PURE__*/_jsx(\"span\", {\n children: childrenProp\n });\n const theme = useTheme();\n const isRtl = useRtl();\n const [childNode, setChildNode] = React.useState();\n const [arrowRef, setArrowRef] = React.useState(null);\n const ignoreNonTouchEvents = React.useRef(false);\n const disableInteractive = disableInteractiveProp || followCursor;\n const closeTimer = useTimeout();\n const enterTimer = useTimeout();\n const leaveTimer = useTimeout();\n const touchTimer = useTimeout();\n const [openState, setOpenState] = useControlled({\n controlled: openProp,\n default: false,\n name: 'Tooltip',\n state: 'open'\n });\n let open = openState;\n if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const {\n current: isControlled\n } = React.useRef(openProp !== undefined);\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n React.useEffect(() => {\n if (childNode && childNode.disabled && !isControlled && title !== '' && childNode.tagName.toLowerCase() === 'button') {\n console.error(['MUI: You are providing a disabled `button` child to the Tooltip component.', 'A disabled element does not fire events.', \"Tooltip needs to listen to the child element's events to display the title.\", '', 'Add a simple wrapper element, such as a `span`.'].join('\\n'));\n }\n }, [title, childNode, isControlled]);\n }\n const id = useId(idProp);\n const prevUserSelect = React.useRef();\n const stopTouchInteraction = useEventCallback(() => {\n if (prevUserSelect.current !== undefined) {\n document.body.style.WebkitUserSelect = prevUserSelect.current;\n prevUserSelect.current = undefined;\n }\n touchTimer.clear();\n });\n React.useEffect(() => stopTouchInteraction, [stopTouchInteraction]);\n const handleOpen = event => {\n hystersisTimer.clear();\n hystersisOpen = true;\n\n // The mouseover event will trigger for every nested element in the tooltip.\n // We can skip rerendering when the tooltip is already open.\n // We are using the mouseover event instead of the mouseenter event to fix a hide/show issue.\n setOpenState(true);\n if (onOpen && !open) {\n onOpen(event);\n }\n };\n const handleClose = useEventCallback(\n /**\n * @param {React.SyntheticEvent | Event} event\n */\n event => {\n hystersisTimer.start(800 + leaveDelay, () => {\n hystersisOpen = false;\n });\n setOpenState(false);\n if (onClose && open) {\n onClose(event);\n }\n closeTimer.start(theme.transitions.duration.shortest, () => {\n ignoreNonTouchEvents.current = false;\n });\n });\n const handleMouseOver = event => {\n if (ignoreNonTouchEvents.current && event.type !== 'touchstart') {\n return;\n }\n\n // Remove the title ahead of time.\n // We don't want to wait for the next render commit.\n // We would risk displaying two tooltips at the same time (native + this one).\n if (childNode) {\n childNode.removeAttribute('title');\n }\n enterTimer.clear();\n leaveTimer.clear();\n if (enterDelay || hystersisOpen && enterNextDelay) {\n enterTimer.start(hystersisOpen ? enterNextDelay : enterDelay, () => {\n handleOpen(event);\n });\n } else {\n handleOpen(event);\n }\n };\n const handleMouseLeave = event => {\n enterTimer.clear();\n leaveTimer.start(leaveDelay, () => {\n handleClose(event);\n });\n };\n const {\n isFocusVisibleRef,\n onBlur: handleBlurVisible,\n onFocus: handleFocusVisible,\n ref: focusVisibleRef\n } = useIsFocusVisible();\n // We don't necessarily care about the focusVisible state (which is safe to access via ref anyway).\n // We just need to re-render the Tooltip if the focus-visible state changes.\n const [, setChildIsFocusVisible] = React.useState(false);\n const handleBlur = event => {\n handleBlurVisible(event);\n if (isFocusVisibleRef.current === false) {\n setChildIsFocusVisible(false);\n handleMouseLeave(event);\n }\n };\n const handleFocus = event => {\n // Workaround for https://github.com/facebook/react/issues/7769\n // The autoFocus of React might trigger the event before the componentDidMount.\n // We need to account for this eventuality.\n if (!childNode) {\n setChildNode(event.currentTarget);\n }\n handleFocusVisible(event);\n if (isFocusVisibleRef.current === true) {\n setChildIsFocusVisible(true);\n handleMouseOver(event);\n }\n };\n const detectTouchStart = event => {\n ignoreNonTouchEvents.current = true;\n const childrenProps = children.props;\n if (childrenProps.onTouchStart) {\n childrenProps.onTouchStart(event);\n }\n };\n const handleTouchStart = event => {\n detectTouchStart(event);\n leaveTimer.clear();\n closeTimer.clear();\n stopTouchInteraction();\n prevUserSelect.current = document.body.style.WebkitUserSelect;\n // Prevent iOS text selection on long-tap.\n document.body.style.WebkitUserSelect = 'none';\n touchTimer.start(enterTouchDelay, () => {\n document.body.style.WebkitUserSelect = prevUserSelect.current;\n handleMouseOver(event);\n });\n };\n const handleTouchEnd = event => {\n if (children.props.onTouchEnd) {\n children.props.onTouchEnd(event);\n }\n stopTouchInteraction();\n leaveTimer.start(leaveTouchDelay, () => {\n handleClose(event);\n });\n };\n React.useEffect(() => {\n if (!open) {\n return undefined;\n }\n\n /**\n * @param {KeyboardEvent} nativeEvent\n */\n function handleKeyDown(nativeEvent) {\n // IE11, Edge (prior to using Bink?) use 'Esc'\n if (nativeEvent.key === 'Escape' || nativeEvent.key === 'Esc') {\n handleClose(nativeEvent);\n }\n }\n document.addEventListener('keydown', handleKeyDown);\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n };\n }, [handleClose, open]);\n const handleRef = useForkRef(children.ref, focusVisibleRef, setChildNode, ref);\n\n // There is no point in displaying an empty tooltip.\n // So we exclude all falsy values, except 0, which is valid.\n if (!title && title !== 0) {\n open = false;\n }\n const popperRef = React.useRef();\n const handleMouseMove = event => {\n const childrenProps = children.props;\n if (childrenProps.onMouseMove) {\n childrenProps.onMouseMove(event);\n }\n cursorPosition = {\n x: event.clientX,\n y: event.clientY\n };\n if (popperRef.current) {\n popperRef.current.update();\n }\n };\n const nameOrDescProps = {};\n const titleIsString = typeof title === 'string';\n if (describeChild) {\n nameOrDescProps.title = !open && titleIsString && !disableHoverListener ? title : null;\n nameOrDescProps['aria-describedby'] = open ? id : null;\n } else {\n nameOrDescProps['aria-label'] = titleIsString ? title : null;\n nameOrDescProps['aria-labelledby'] = open && !titleIsString ? id : null;\n }\n const childrenProps = _extends({}, nameOrDescProps, other, children.props, {\n className: clsx(other.className, children.props.className),\n onTouchStart: detectTouchStart,\n ref: handleRef\n }, followCursor ? {\n onMouseMove: handleMouseMove\n } : {});\n if (process.env.NODE_ENV !== 'production') {\n childrenProps['data-mui-internal-clone-element'] = true;\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n React.useEffect(() => {\n if (childNode && !childNode.getAttribute('data-mui-internal-clone-element')) {\n console.error(['MUI: The `children` component of the Tooltip is not forwarding its props correctly.', 'Please make sure that props are spread on the same element that the ref is applied to.'].join('\\n'));\n }\n }, [childNode]);\n }\n const interactiveWrapperListeners = {};\n if (!disableTouchListener) {\n childrenProps.onTouchStart = handleTouchStart;\n childrenProps.onTouchEnd = handleTouchEnd;\n }\n if (!disableHoverListener) {\n childrenProps.onMouseOver = composeEventHandler(handleMouseOver, childrenProps.onMouseOver);\n childrenProps.onMouseLeave = composeEventHandler(handleMouseLeave, childrenProps.onMouseLeave);\n if (!disableInteractive) {\n interactiveWrapperListeners.onMouseOver = handleMouseOver;\n interactiveWrapperListeners.onMouseLeave = handleMouseLeave;\n }\n }\n if (!disableFocusListener) {\n childrenProps.onFocus = composeEventHandler(handleFocus, childrenProps.onFocus);\n childrenProps.onBlur = composeEventHandler(handleBlur, childrenProps.onBlur);\n if (!disableInteractive) {\n interactiveWrapperListeners.onFocus = handleFocus;\n interactiveWrapperListeners.onBlur = handleBlur;\n }\n }\n if (process.env.NODE_ENV !== 'production') {\n if (children.props.title) {\n console.error(['MUI: You have provided a `title` prop to the child of .', `Remove this title prop \\`${children.props.title}\\` or the Tooltip component.`].join('\\n'));\n }\n }\n const popperOptions = React.useMemo(() => {\n var _PopperProps$popperOp;\n let tooltipModifiers = [{\n name: 'arrow',\n enabled: Boolean(arrowRef),\n options: {\n element: arrowRef,\n padding: 4\n }\n }];\n if ((_PopperProps$popperOp = PopperProps.popperOptions) != null && _PopperProps$popperOp.modifiers) {\n tooltipModifiers = tooltipModifiers.concat(PopperProps.popperOptions.modifiers);\n }\n return _extends({}, PopperProps.popperOptions, {\n modifiers: tooltipModifiers\n });\n }, [arrowRef, PopperProps]);\n const ownerState = _extends({}, props, {\n isRtl,\n arrow,\n disableInteractive,\n placement,\n PopperComponentProp,\n touch: ignoreNonTouchEvents.current\n });\n const classes = useUtilityClasses(ownerState);\n const PopperComponent = (_ref = (_slots$popper = slots.popper) != null ? _slots$popper : components.Popper) != null ? _ref : TooltipPopper;\n const TransitionComponent = (_ref2 = (_ref3 = (_slots$transition = slots.transition) != null ? _slots$transition : components.Transition) != null ? _ref3 : TransitionComponentProp) != null ? _ref2 : Grow;\n const TooltipComponent = (_ref4 = (_slots$tooltip = slots.tooltip) != null ? _slots$tooltip : components.Tooltip) != null ? _ref4 : TooltipTooltip;\n const ArrowComponent = (_ref5 = (_slots$arrow = slots.arrow) != null ? _slots$arrow : components.Arrow) != null ? _ref5 : TooltipArrow;\n const popperProps = appendOwnerState(PopperComponent, _extends({}, PopperProps, (_slotProps$popper = slotProps.popper) != null ? _slotProps$popper : componentsProps.popper, {\n className: clsx(classes.popper, PopperProps == null ? void 0 : PopperProps.className, (_ref6 = (_slotProps$popper2 = slotProps.popper) != null ? _slotProps$popper2 : componentsProps.popper) == null ? void 0 : _ref6.className)\n }), ownerState);\n const transitionProps = appendOwnerState(TransitionComponent, _extends({}, TransitionProps, (_slotProps$transition = slotProps.transition) != null ? _slotProps$transition : componentsProps.transition), ownerState);\n const tooltipProps = appendOwnerState(TooltipComponent, _extends({}, (_slotProps$tooltip = slotProps.tooltip) != null ? _slotProps$tooltip : componentsProps.tooltip, {\n className: clsx(classes.tooltip, (_ref7 = (_slotProps$tooltip2 = slotProps.tooltip) != null ? _slotProps$tooltip2 : componentsProps.tooltip) == null ? void 0 : _ref7.className)\n }), ownerState);\n const tooltipArrowProps = appendOwnerState(ArrowComponent, _extends({}, (_slotProps$arrow = slotProps.arrow) != null ? _slotProps$arrow : componentsProps.arrow, {\n className: clsx(classes.arrow, (_ref8 = (_slotProps$arrow2 = slotProps.arrow) != null ? _slotProps$arrow2 : componentsProps.arrow) == null ? void 0 : _ref8.className)\n }), ownerState);\n return /*#__PURE__*/_jsxs(React.Fragment, {\n children: [/*#__PURE__*/React.cloneElement(children, childrenProps), /*#__PURE__*/_jsx(PopperComponent, _extends({\n as: PopperComponentProp != null ? PopperComponentProp : Popper,\n placement: placement,\n anchorEl: followCursor ? {\n getBoundingClientRect: () => ({\n top: cursorPosition.y,\n left: cursorPosition.x,\n right: cursorPosition.x,\n bottom: cursorPosition.y,\n width: 0,\n height: 0\n })\n } : childNode,\n popperRef: popperRef,\n open: childNode ? open : false,\n id: id,\n transition: true\n }, interactiveWrapperListeners, popperProps, {\n popperOptions: popperOptions,\n children: ({\n TransitionProps: TransitionPropsInner\n }) => /*#__PURE__*/_jsx(TransitionComponent, _extends({\n timeout: theme.transitions.duration.shorter\n }, TransitionPropsInner, transitionProps, {\n children: /*#__PURE__*/_jsxs(TooltipComponent, _extends({}, tooltipProps, {\n children: [title, arrow ? /*#__PURE__*/_jsx(ArrowComponent, _extends({}, tooltipArrowProps, {\n ref: setArrowRef\n })) : null]\n }))\n }))\n }))]\n });\n});\nprocess.env.NODE_ENV !== \"production\" ? Tooltip.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 * If `true`, adds an arrow to the tooltip.\n * @default false\n */\n arrow: PropTypes.bool,\n /**\n * Tooltip reference element.\n */\n children: elementAcceptingRef.isRequired,\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 components used for each slot inside.\n *\n * This prop is an alias for the `slots` prop.\n * It's recommended to use the `slots` prop instead.\n *\n * @default {}\n */\n components: PropTypes.shape({\n Arrow: PropTypes.elementType,\n Popper: PropTypes.elementType,\n Tooltip: PropTypes.elementType,\n Transition: PropTypes.elementType\n }),\n /**\n * The extra props for the slot components.\n * You can override the existing props or add new ones.\n *\n * This prop is an alias for the `slotProps` prop.\n * It's recommended to use the `slotProps` prop instead, as `componentsProps` will be deprecated in the future.\n *\n * @default {}\n */\n componentsProps: PropTypes.shape({\n arrow: PropTypes.object,\n popper: PropTypes.object,\n tooltip: PropTypes.object,\n transition: PropTypes.object\n }),\n /**\n * Set to `true` if the `title` acts as an accessible description.\n * By default the `title` acts as an accessible label for the child.\n * @default false\n */\n describeChild: PropTypes.bool,\n /**\n * Do not respond to focus-visible events.\n * @default false\n */\n disableFocusListener: PropTypes.bool,\n /**\n * Do not respond to hover events.\n * @default false\n */\n disableHoverListener: PropTypes.bool,\n /**\n * Makes a tooltip not interactive, i.e. it will close when the user\n * hovers over the tooltip before the `leaveDelay` is expired.\n * @default false\n */\n disableInteractive: PropTypes.bool,\n /**\n * Do not respond to long press touch events.\n * @default false\n */\n disableTouchListener: PropTypes.bool,\n /**\n * The number of milliseconds to wait before showing the tooltip.\n * This prop won't impact the enter touch delay (`enterTouchDelay`).\n * @default 100\n */\n enterDelay: PropTypes.number,\n /**\n * The number of milliseconds to wait before showing the tooltip when one was already recently opened.\n * @default 0\n */\n enterNextDelay: PropTypes.number,\n /**\n * The number of milliseconds a user must touch the element before showing the tooltip.\n * @default 700\n */\n enterTouchDelay: PropTypes.number,\n /**\n * If `true`, the tooltip follow the cursor over the wrapped element.\n * @default false\n */\n followCursor: PropTypes.bool,\n /**\n * This prop is used to help implement the accessibility logic.\n * If you don't provide this prop. It falls back to a randomly generated id.\n */\n id: PropTypes.string,\n /**\n * The number of milliseconds to wait before hiding the tooltip.\n * This prop won't impact the leave touch delay (`leaveTouchDelay`).\n * @default 0\n */\n leaveDelay: PropTypes.number,\n /**\n * The number of milliseconds after the user stops touching an element before hiding the tooltip.\n * @default 1500\n */\n leaveTouchDelay: PropTypes.number,\n /**\n * Callback fired when the component requests to be closed.\n *\n * @param {React.SyntheticEvent} event The event source of the callback.\n */\n onClose: PropTypes.func,\n /**\n * Callback fired when the component requests to be open.\n *\n * @param {React.SyntheticEvent} event The event source of the callback.\n */\n onOpen: PropTypes.func,\n /**\n * If `true`, the component is shown.\n */\n open: PropTypes.bool,\n /**\n * Tooltip placement.\n * @default 'bottom'\n */\n placement: PropTypes.oneOf(['bottom-end', 'bottom-start', 'bottom', 'left-end', 'left-start', 'left', 'right-end', 'right-start', 'right', 'top-end', 'top-start', 'top']),\n /**\n * The component used for the popper.\n * @default Popper\n */\n PopperComponent: PropTypes.elementType,\n /**\n * Props applied to the [`Popper`](/material-ui/api/popper/) element.\n * @default {}\n */\n PopperProps: PropTypes.object,\n /**\n * The extra props for the slot components.\n * You can override the existing props or add new ones.\n *\n * This prop is an alias for the `componentsProps` prop, which will be deprecated in the future.\n *\n * @default {}\n */\n slotProps: PropTypes.shape({\n arrow: PropTypes.object,\n popper: PropTypes.object,\n tooltip: PropTypes.object,\n transition: PropTypes.object\n }),\n /**\n * The components used for each slot inside.\n *\n * This prop is an alias for the `components` prop, which will be deprecated in the future.\n *\n * @default {}\n */\n slots: PropTypes.shape({\n arrow: PropTypes.elementType,\n popper: PropTypes.elementType,\n tooltip: PropTypes.elementType,\n transition: PropTypes.elementType\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 /**\n * Tooltip title. Zero-length titles string, undefined, null and false are never displayed.\n */\n title: PropTypes.node,\n /**\n * The component used for the transition.\n * [Follow this guide](/material-ui/transitions/#transitioncomponent-prop) to learn more about the requirements for this component.\n * @default Grow\n */\n TransitionComponent: PropTypes.elementType,\n /**\n * Props applied to the transition element.\n * By default, the element is based on this [`Transition`](https://reactcommunity.org/react-transition-group/transition/) component.\n */\n TransitionProps: PropTypes.object\n} : void 0;\nexport default Tooltip;","import createSvgIcon from './utils/createSvgIcon';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z\"\n}), 'Info');","import {\r\n styled,\r\n Tooltip,\r\n Button,\r\n} from '@mui/material';\r\nimport {colors} from '../../../options/colors';\r\nimport {Info} from '@mui/icons-material';\r\n\r\nexport const StyledTooltip = styled(Tooltip)(() => ({\r\n color: colors.primaryGrey,\r\n cursor: 'pointer',\r\n}));\r\n\r\nexport const InfoButton = styled(Button)(() => ({\r\n width: 'auto',\r\n padding: 0,\r\n minWidth: 'unset',\r\n border: 'none',\r\n background: 'none',\r\n '&:hover': {\r\n border: 'none !important',\r\n background: 'none !important',\r\n },\r\n '&:focus': {\r\n border: 'none !important',\r\n background: 'none !important',\r\n },\r\n}));\r\n\r\nexport const InfoIcon = styled(Info)(() => ({\r\n color: `${colors.beige} !important`,\r\n fontSize: 20,\r\n}));\r\n","import {\r\n StyledTooltip,\r\n InfoButton,\r\n InfoIcon,\r\n} from './InfoTooltip.styles';\r\n\r\nconst InfoTooltip = ({title}) => {\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n );\r\n};\r\n\r\nexport default InfoTooltip;\r\n","import {\r\n StyledTableHead,\r\n StyledTableRow,\r\n StyledTableCell,\r\n StyledTableSortLabel, TextWithTooltipContainer, TooltipContainer,\r\n} from './CustomTableHead.styles';\r\nimport {ArrowDropDown} from '@mui/icons-material';\r\nimport InfoTooltip from '../../Tooltips/InfoTooltip/InfoTooltip';\r\n\r\nconst CustomTableHead = ({order, orderBy, onRequestSort, columnHeadings, small}) => {\r\n const createSortHandler = (property) => (event) => {\r\n onRequestSort(event, property);\r\n };\r\n\r\n return (\r\n \r\n \r\n {\r\n columnHeadings.map(({id, label, align, sortable, showTooltip, tooltipText}) => (\r\n \r\n {\r\n sortable &&\r\n \r\n {\r\n !showTooltip &&\r\n label\r\n }\r\n {\r\n showTooltip && tooltipText &&\r\n \r\n {label}\r\n \r\n \r\n \r\n \r\n }\r\n \r\n }\r\n {\r\n !sortable &&\r\n <>\r\n {\r\n !showTooltip &&\r\n label\r\n }\r\n {\r\n showTooltip && tooltipText &&\r\n \r\n {label}\r\n \r\n \r\n \r\n \r\n }\r\n >\r\n }\r\n \r\n ))\r\n }\r\n \r\n \r\n );\r\n};\r\n\r\nexport default CustomTableHead;\r\n","import {useState} from 'react';\r\nimport {\r\n StyledModal,\r\n ModalHeader,\r\n ModalContent,\r\n ModalActions,\r\n CloseButton,\r\n CloseIcon,\r\n} from './StandardModal.styles';\r\nimport ModalTitle from '../../Typography/ModalTitle/ModalTitle';\r\nimport LinkButton from '../../Buttons/LinkButton/LinkButton';\r\nimport OutlinedButton from '../../Buttons/OutlinedButton/OutlinedButton';\r\nimport SectionSpinner from '../../Loading/SectionSpinner/SectionSpinner';\r\n\r\nconst StandardModal = ({children, open, onClose, title, btnText, onClick, disabled, loading, hideCancelBtn, width}) => {\r\n const [show, setShow] = useState(open);\r\n\r\n const handleClose = () => {\r\n setShow(false);\r\n onClose();\r\n };\r\n\r\n return (\r\n <>\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {children}\r\n \r\n \r\n {\r\n loading &&\r\n \r\n }\r\n {\r\n !loading &&\r\n <>\r\n {\r\n !hideCancelBtn &&\r\n \r\n }\r\n \r\n >\r\n }\r\n \r\n \r\n >\r\n );\r\n};\r\n\r\nexport default StandardModal;\r\n","import {styled} from '@mui/material';\r\n\r\nexport const Container = styled('div')(() => ({}));\r\n\r\nexport const InlineFieldContainer = styled('div')(({ theme }) => ({\r\n display: 'flex',\r\n justifyContent: 'space-between',\r\n '& > div:nth-of-type(1)': {\r\n display: 'inline-block',\r\n width: '47%',\r\n },\r\n '& > div:nth-of-type(2)': {\r\n display: 'inline-block',\r\n width: '47%',\r\n },\r\n [theme.breakpoints.down('sm')]: {\r\n flexDirection: 'column',\r\n justifyContent: 'unset',\r\n '& > div': {\r\n width: '100% !important',\r\n }\r\n },\r\n}));\r\n\r\nexport const PhoneFieldContainer = styled('div')(() => ({\r\n display: 'flex !important',\r\n justifyContent: 'space-between',\r\n '& > div:nth-of-type(1)': {\r\n display: 'inline-block',\r\n width: 125,\r\n marginRight: 20,\r\n },\r\n '& > div:nth-of-type(2)': {\r\n display: 'inline-block',\r\n width: '100%',\r\n },\r\n}));\r\n\r\nexport const FieldContainer = styled('div')(() => ({\r\n marginBottom: 20,\r\n 'role': {\r\n marginBottom: 0,\r\n },\r\n}));\r\n","export const userRoles = [\r\n // {\r\n // value: 'CLUB_SUPER_ADMIN',\r\n // label: 'Club Super Administrator',\r\n // },\r\n {\r\n value: 'CLUB_ADMIN',\r\n label: 'Club Administrator',\r\n },\r\n {\r\n value: 'CLUB_MEMBER',\r\n label: 'Member',\r\n },\r\n // {\r\n // value: 'CLUB_PLAYER',\r\n // label: 'Player',\r\n // },\r\n];\r\n\r\n\r\nexport const repRoles = [\r\n {\r\n value: 'REP_TEAM_ADMIN',\r\n label: 'Rep Administrator',\r\n },\r\n {\r\n value: 'REP_TEAM_MEMBER',\r\n label: 'Rep Member',\r\n },\r\n];\r\n","import {\r\n Container,\r\n InlineFieldContainer,\r\n PhoneFieldContainer,\r\n FieldContainer,\r\n} from './TeamMemberForm.styles';\r\nimport {userRoles} from '../../../options/userRoles';\r\nimport CustomTextField from '../../Inputs/CustomTextField/CustomTextField';\r\nimport CustomAutocomplete from '../../Inputs/CustomAutocomplete/CustomAutocomplete';\r\nimport FieldError from '../../Inputs/FieldError/FieldError';\r\n// Helpers\r\nimport getSortedCountryCodes from '../../../utils/helpers/getSortedCountryCodes';\r\n\r\nconst TeamMemberForm = ({formData, errors, onChange}) => {\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {errors.saveError && }\r\n \r\n )\r\n};\r\n\r\nexport default TeamMemberForm;\r\n","import createSvgIcon from './utils/createSvgIcon';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"m14.06 9.02.92.92L5.92 19H5v-.92l9.06-9.06M17.66 3c-.25 0-.51.1-.7.29l-1.83 1.83 3.75 3.75 1.83-1.83c.39-.39.39-1.02 0-1.41l-2.34-2.34c-.2-.2-.45-.29-.71-.29zm-3.6 3.19L3 17.25V21h3.75L17.81 9.94l-3.75-3.75z\"\n}), 'EditOutlined');","import createSvgIcon from './utils/createSvgIcon';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M16 9v10H8V9h8m-1.5-6h-5l-1 1H5v2h14V4h-3.5l-1-1zM18 7H6v12c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7z\"\n}), 'DeleteOutlined');","export const descendingComparator = (a, b, orderBy) => {\r\n if (b[orderBy] < a[orderBy]) {\r\n return -1;\r\n }\r\n if (b[orderBy] > a[orderBy]) {\r\n return 1;\r\n }\r\n return 0;\r\n}\r\n\r\nexport const getComparator = (order, orderBy) => {\r\n return order === 'desc'\r\n ? (a, b) => descendingComparator(a, b, orderBy)\r\n : (a, b) => -descendingComparator(a, b, orderBy);\r\n}\r\n\r\nexport const stableSort = (array, comparator) => {\r\n const stabilizedThis = array.map((el, index) => [el, index]);\r\n stabilizedThis.sort((a, b) => {\r\n const order = comparator(a[0], b[0]);\r\n if (order !== 0) {\r\n return order;\r\n }\r\n return a[1] - b[1];\r\n });\r\n return stabilizedThis.map((el) => el[0]);\r\n}\r\n\r\nexport const handleRequestSort = (event, id, orderBy, order, setOrder, setOrderBy) => {\r\n const isAsc = orderBy === id && order === 'asc';\r\n setOrder(isAsc ? 'desc' : 'asc');\r\n setOrderBy(id);\r\n};\r\n","import {useState} from 'react';\r\nimport {\r\n Container,\r\n StyledTableBody,\r\n StyledTableRow,\r\n StyledTableCell,\r\n DeleteText,\r\n} from './TeamMembersList.styles';\r\nimport {buttonTypes} from '../../../options/buttonTypes';\r\nimport {teamMembersColumns} from '../../../options/tableColumns';\r\nimport {tableParentOptions} from '../../../options/tableParentOptions';\r\nimport SectionContainer from '../../Containers/SectionContainer/SectionContainer';\r\nimport CustomTableWrapper from '../CustomTableWrapper/CustomTableWrapper';\r\nimport MemoizedTable from '../MemoizedTable/MemoizedTable';\r\nimport CustomTableHead from '../CustomTableHead/CustomTableHead';\r\nimport IconButton from '../../Buttons/IconButton/IconButton';\r\nimport StandardModal from '../../Modals/StandardModal/StandardModal';\r\nimport TeamMemberForm from '../../Forms/TeamMemberForm/TeamMemberForm';\r\nimport {EditOutlined, DeleteOutlined} from '@mui/icons-material';\r\n\r\n// Helpers\r\nimport {getComparator, stableSort, handleRequestSort} from '../../../utils/tableSortHelpers/tableSortHelpers';\r\nimport { capitaliseUserRole } from '../../../utils/helpers/userRoleHelper';\r\n\r\nconst TeamMembersList = ({\r\n teamMembers,\r\n clubId,\r\n clubName,\r\n handleDelete,\r\n onFieldChange,\r\n onSubmit,\r\n formData,\r\n formErrors,\r\n setFormData,\r\n setFormErrors,\r\n updateLoading,\r\n deleteLoading,\r\n}) => {\r\n const [order, setOrder] = useState('asc');\r\n const [orderBy, setOrderBy] = useState('');\r\n const [formModalOpen, setFormModalOpen] = useState(false);\r\n const [deleteModalOpen, setDeleteModalOpen] = useState(false);\r\n const [deleteUser, setDeleteUser] = useState({});\r\n const [isAdd, setIsAdd] = useState(true);\r\n\r\n const handleFormModalClose = () => {\r\n // Reset state back to original values\r\n setFormModalOpen(false);\r\n setIsAdd(true);\r\n setFormData({\r\n id: undefined,\r\n clubId,\r\n firstname: '',\r\n lastname: '',\r\n email: '',\r\n telephoneCountryCode: '',\r\n telephone: '',\r\n clubname: clubName,\r\n });\r\n setFormErrors({\r\n firstname: '',\r\n lastname: '',\r\n email: '',\r\n telephoneCountryCode: '',\r\n telephone: '',\r\n });\r\n };\r\n\r\n const handleFormModalOpen = id => {\r\n if (id) {\r\n // Find index of item with matching id and pass those details into modal\r\n const index = teamMembers.findIndex(el => el.id === id);\r\n setFormData(teamMembers[index]);\r\n setIsAdd(false);\r\n }\r\n setFormModalOpen(true);\r\n };\r\n\r\n const handleFormModalSubmit = async () => {\r\n const result = await onSubmit();\r\n if (result) {\r\n handleFormModalClose();\r\n }\r\n };\r\n\r\n const handleDeleteModalClose = () => {\r\n setDeleteModalOpen(false);\r\n setDeleteUser({});\r\n };\r\n\r\n const handleDeleteModalOpen = id => {\r\n const index = teamMembers.findIndex(el => el.id === id);\r\n setDeleteUser(teamMembers[index]);\r\n setDeleteModalOpen(true);\r\n };\r\n\r\n const handleDeleteModalSubmit = async () => {\r\n const result = await handleDelete(deleteUser.id);\r\n if (result) {\r\n handleDeleteModalClose();\r\n }\r\n };\r\n\r\n return (\r\n \r\n handleFormModalOpen()}\r\n >\r\n \r\n {\r\n teamMembers && teamMembers.length > 0 &&\r\n \r\n handleRequestSort(e, id, orderBy, order, setOrder, setOrderBy)}\r\n columnHeadings={teamMembersColumns}\r\n />\r\n \r\n {\r\n stableSort(teamMembers, getComparator(order, orderBy))\r\n .map(({id, firstname, lastname, email, role}) => (\r\n \r\n \r\n {firstname} {lastname}\r\n \r\n \r\n {email}\r\n \r\n \r\n {role ? capitaliseUserRole(role.display_name) : '--'}\r\n \r\n \r\n }\r\n onClick={() => handleFormModalOpen(id)}\r\n />\r\n \r\n \r\n }\r\n onClick={() => handleDeleteModalOpen(id)}\r\n />\r\n \r\n \r\n ))\r\n }\r\n \r\n \r\n }\r\n \r\n {\r\n formModalOpen &&\r\n \r\n \r\n \r\n }\r\n {\r\n deleteModalOpen &&\r\n \r\n \r\n Are you sure you want to delete {deleteUser.firstname} {deleteUser.lastname}?\r\n Once confirmed, this action cannot be undone.\r\n \r\n \r\n }\r\n \r\n \r\n );\r\n};\r\n\r\nexport default TeamMembersList;\r\n","import {\r\n styled,\r\n Typography,\r\n} from '@mui/material';\r\n\r\nexport const Container = styled('div')(() => ({}));\r\n\r\nexport const InlineFieldContainer = styled('div')(({ theme }) => ({\r\n display: 'flex',\r\n justifyContent: 'space-between',\r\n '& > div:nth-of-type(1)': {\r\n display: 'inline-block',\r\n width: '47%',\r\n },\r\n '& > div:nth-of-type(2)': {\r\n display: 'inline-block',\r\n width: '47%',\r\n },\r\n [theme.breakpoints.down('sm')]: {\r\n flexDirection: 'column',\r\n justifyContent: 'unset',\r\n '& > div': {\r\n width: '100% !important',\r\n }\r\n },\r\n}));\r\n\r\nexport const FieldContainer = styled('div')(({ theme }) => ({\r\n marginBottom: 20,\r\n 'noMarginField': {\r\n marginBottom: 10,\r\n },\r\n [theme.breakpoints.down('sm')]: {\r\n 'noMarginField:first-of-type': {\r\n marginBottom: 20,\r\n },\r\n },\r\n}));\r\n\r\nexport const IdText = styled(Typography)(({ theme }) => ({\r\n ...theme.typography.body1,\r\n marginTop: 23,\r\n}));\r\n","import {\r\n Container,\r\n InlineFieldContainer,\r\n FieldContainer,\r\n IdText,\r\n} from './ClubProfileForm.styles';\r\nimport {countries} from '../../../options/countries';\r\nimport CustomTextField from '../../Inputs/CustomTextField/CustomTextField';\r\nimport CustomAutocomplete from '../../Inputs/CustomAutocomplete/CustomAutocomplete';\r\nimport Label from '../../Typography/Label/Label';\r\n\r\nconst ClubProfileForm = ({clubId, formData, errors, onChange}) => {\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n {clubId}\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n )\r\n};\r\n\r\nexport default ClubProfileForm;\r\n","const convertToBase64 = async (file, setState, isLogo) => {\r\n // Convert image to base64 string to display in image area\r\n const reader = new FileReader();\r\n let picturefile;\r\n reader.onloadend = (loadEvent) => {\r\n picturefile = loadEvent.target.result;\r\n if (isLogo) {\r\n setState({\r\n logofile: picturefile,\r\n });\r\n } else {\r\n setState({\r\n picturefile,\r\n });\r\n }\r\n }\r\n reader.readAsDataURL(file);\r\n};\r\n\r\nexport default convertToBase64;\r\n","import {useEffect, useState, useCallback, createContext, useContext} from 'react';\r\nimport {routes} from '../../options/routes';\r\n\r\n// API calls\r\nimport { getClubUsers, getUserRoles } from '../../api';\r\n\r\n// Contexts\r\nimport {BaseContext} from '../Global/BaseProvider';\r\n\r\nconst AccountContext = createContext({});\r\n\r\nconst AccountProvider = ({children}) => {\r\n const baseContext = useContext(BaseContext);\r\n const [accountData, setAccountData] = useState({\r\n loading: true,\r\n teamMembers: null,\r\n });\r\n\r\n const getAccountData = useCallback(async () => {\r\n // Only trigger API call for admin account route\r\n const activeRoute = window.location.pathname;\r\n if (activeRoute !== routes.adminAccount) return;\r\n\r\n if (!baseContext.baseData.loading) {\r\n const {id} = baseContext.baseData.clubProfile;\r\n // Call API\r\n const teamMembersData = await getClubUsers(id);\r\n const userRoles = await getUserRoles();\r\n if (!teamMembersData || !teamMembersData.success || !teamMembersData.data || !teamMembersData.data.length) {\r\n setAccountData({\r\n loading: false,\r\n teamMembers: null,\r\n userRoles: []\r\n });\r\n }\r\n\r\n // Set data\r\n setAccountData({\r\n loading: false,\r\n teamMembers: teamMembersData.data.filter((teamMember) => teamMember.id.toString() !== baseContext.baseData.userProfile.id),\r\n userRoles: userRoles.data || []\r\n });\r\n }\r\n }, [baseContext]);\r\n\r\n useEffect(() => {\r\n getAccountData();\r\n }, [getAccountData]);\r\n\r\n return (\r\n \r\n {children}\r\n \r\n );\r\n}\r\n\r\nexport {AccountProvider, AccountContext};\r\n\r\nexport default AccountProvider;\r\n","import { useEffect, useContext, useState } from 'react';\r\nimport\r\n{\r\n UserProfileContainer,\r\n ClubProfileContainer,\r\n} from './Account.styles';\r\nimport MainWrapper from '../../../components/Wrappers/MainWrapper/MainWrapper';\r\nimport Title from '../../../components/Typography/Title/Title';\r\nimport SectionTitle from '../../../components/Typography/SectionTitle/SectionTitle';\r\nimport FileInputCard from '../../../components/Cards/FileInputCard/FileInputCard';\r\nimport ActionCard from '../../../components/Cards/ActionCard/ActionCard';\r\nimport UserProfileForm from '../../../components/Forms/UserProfileForm/UserProfileForm';\r\nimport UserPasswordForm from '../../../components/Forms/UserPasswordForm/UserPasswordForm';\r\nimport TeamMembersList from '../../../components/Tables/TeamMembersList/TeamMembersList';\r\nimport ClubProfileForm from '../../../components/Forms/ClubProfileForm/ClubProfileForm';\r\n\r\n// Validators & Helpers\r\nimport convertToBase64 from '../../../utils/helpers/convertToBase64';\r\nimport emailIsValid from '../../../utils/validation/email';\r\nimport phoneNumberIsValid from '../../../utils/validation/phoneNumber';\r\nimport { passwordIsValid, repeatPasswordIsValid } from '../../../utils/validation/password';\r\nimport convertNumberToString from '../../../utils/helpers/convertNumberToString';\r\n\r\n// Contexts\r\nimport { BaseContext } from '../../../providers/Global/BaseProvider';\r\nimport { AccountContext } from '../../../providers/Admin/AccountProvider';\r\n\r\n// API Calls\r\nimport\r\n{\r\n addUserProfile,\r\n updateUserProfile,\r\n updateUserPicture,\r\n updateUserPassword,\r\n updateUserTwoStep,\r\n deleteUserProfile,\r\n getClubUsers,\r\n getClubProfile,\r\n updateClubLogo,\r\n updateClubProfile,\r\n} from '../../../api';\r\nimport { routes } from '../../../options/routes';\r\nimport { canEditTeamMembers, capitaliseUserRole, isAboveClubMember } from '../../../utils/helpers/userRoleHelper';\r\nimport { Label } from '@mui/icons-material';\r\nimport { StyledCard, StyledCardContent } from '../../../components/Cards/ActionCard/ActionCard.styles';\r\nimport { Stack, Typography } from '@mui/material';\r\nimport { getManageClubId } from '../../../utils/helpers/clubHelper';\r\n\r\nconst Account = () =>\r\n{\r\n const baseContext = useContext(BaseContext);\r\n const accountContext = useContext(AccountContext);\r\n const [dataLoading, setDataLoading] = useState(true);\r\n const [userImageLoading, setUserImageLoading] = useState(false);\r\n const [userProfileLoading, setUserProfileLoading] = useState(false);\r\n const [userPasswordLoading, setUserPasswordLoading] = useState(false);\r\n const [deleteLoading, setDeleteLoading] = useState(false);\r\n const [teamMemberLoading, setTeamMemberLoading] = useState(false);\r\n const [error, setError] = useState({\r\n show: false,\r\n message: '',\r\n });\r\n const [userId, setUserId] = useState('');\r\n const [clubId, setClubId] = useState('');\r\n const [clubName, setClubName] = useState('');\r\n const [userImageData, setUserImageData] = useState({\r\n picturefile: '',\r\n });\r\n const [userProfileData, setUserProfileData] = useState({\r\n firstname: '',\r\n lastname: '',\r\n telephoneCountryCode: '',\r\n telephone: '',\r\n email: '',\r\n });\r\n const userRole = JSON.parse(localStorage.getItem('userRole'));\r\n const [userProfileErrors, setUserProfileErrors] = useState({\r\n firstname: '',\r\n lastname: '',\r\n telephoneCountryCode: '',\r\n telephone: '',\r\n email: '',\r\n });\r\n const [userPasswordData, setUserPasswordData] = useState({\r\n oldPassword: '',\r\n updatePassword: '',\r\n confirmPassword: '',\r\n });\r\n const [userPasswordErrors, setUserPasswordErrors] = useState({\r\n oldPassword: '',\r\n updatePassword: '',\r\n confirmPassword: '',\r\n });\r\n const [twoStepData, setTwoStepData] = useState({\r\n userId: null,\r\n twoStep: 0,\r\n });\r\n const [teamMembers, setTeamMembers] = useState([]);\r\n const [teamMemberData, setTeamMemberData] = useState({\r\n id: undefined,\r\n clubId: '',\r\n firstname: '',\r\n lastname: '',\r\n email: '',\r\n telephoneCountryCode: '',\r\n telephone: '',\r\n clubname: '',\r\n });\r\n const [teamMemberErrors, setTeamMemberErrors] = useState({\r\n firstname: '',\r\n lastname: '',\r\n email: '',\r\n telephoneCountryCode: '',\r\n telephone: '',\r\n });\r\n const [clubLogoLoading, setClubLogoLoading] = useState(false);\r\n const [clubProfileLoading, setClubProfileLoading] = useState(false);\r\n const [clubLogoData, setClubLogoData] = useState({\r\n logofile: '',\r\n });\r\n const [clubProfileData, setClubProfileData] = useState({\r\n name: '',\r\n addr1: '',\r\n addr2: '',\r\n addr3: '',\r\n city: '',\r\n postcode: '',\r\n country: '',\r\n });\r\n const [clubProfileErrors, setClubProfileErrors] = useState({\r\n name: '',\r\n addr1: '',\r\n addr2: '',\r\n addr3: '',\r\n city: '',\r\n postcode: '',\r\n country: '',\r\n });\r\n\r\n useEffect(() =>\r\n {\r\n if (!baseContext.baseData.loading && !accountContext.accountData.loading)\r\n {\r\n setDataLoading(false);\r\n const { userProfile, clubProfile } = baseContext.baseData;\r\n const { teamMembers, userRoles } = accountContext.accountData;\r\n const { id, picture, firstname, lastname, telephoneCountryCode, telephone, email, twoStep } = userProfile;\r\n const { logo, name, addr1, addr2, addr3, city, postcode, country } = clubProfile;\r\n // Set user data\r\n setUserId(id);\r\n setUserImageData({ picturefile: picture });\r\n const userRoleDisplayName = userRoles.length ? userRoles.find((role) => userRole === role.type)?.display_name : '--';\r\n setUserProfileData({\r\n firstname,\r\n lastname,\r\n telephoneCountryCode,\r\n telephone,\r\n email,\r\n role: capitaliseUserRole(userRoleDisplayName),\r\n });\r\n setTwoStepData({\r\n userId: id,\r\n twoStep: Number(twoStep),\r\n });\r\n setClubLogoData({ logofile: logo });\r\n setClubProfileData({\r\n clubId: clubProfile.id,\r\n name,\r\n addr1,\r\n addr2,\r\n addr3,\r\n city,\r\n postcode,\r\n country,\r\n });\r\n\r\n // Set team members list data - don't display current user\r\n const teamMembersList = teamMembers && teamMembers.length\r\n ? teamMembers.filter(member => member.id !== id)\r\n : [];\r\n setTeamMembers(teamMembersList);\r\n\r\n // Set clubId and clubname in teamMemberData\r\n setClubId(clubProfile.id);\r\n setClubName((name));\r\n setTeamMemberData({\r\n id: undefined,\r\n clubId: clubProfile.id,\r\n firstname: '',\r\n lastname: '',\r\n email: '',\r\n telephoneCountryCode: '',\r\n telephone: '',\r\n clubname: name,\r\n });\r\n }\r\n }, [baseContext, accountContext]);\r\n\r\n const handleBannerClose = () =>\r\n {\r\n setError({\r\n show: false,\r\n message: '',\r\n });\r\n };\r\n\r\n const handleImageChange = async e =>\r\n {\r\n await setUserImageLoading(true);\r\n if (e.target.files.length)\r\n {\r\n // Create new FormData instance and append file to it to enable successful POST request\r\n const file = e.target.files[0];\r\n let formData = new FormData();\r\n formData.append('picturefile', file);\r\n\r\n // Trigger API call\r\n const data = await updateUserPicture(userId, formData);\r\n if (!data || !data.success || data.code !== 201)\r\n {\r\n setError({\r\n show: true,\r\n message: 'There was an error with the request. Please try again.'\r\n }\r\n );\r\n setUserImageLoading(false);\r\n return;\r\n }\r\n\r\n setError({\r\n ...error,\r\n message: 'Your profile photo has been successfully updated',\r\n });\r\n\r\n // Convert image to base64 string to display in image area\r\n await convertToBase64(file, setUserImageData);\r\n }\r\n setUserImageLoading(false);\r\n };\r\n\r\n const handleUserProfileChange = (e, id, val) =>\r\n {\r\n // Clear errors\r\n setUserProfileErrors({\r\n firstname: '',\r\n lastname: '',\r\n telephoneCountryCode: '',\r\n telephone: '',\r\n email: '',\r\n });\r\n handleBannerClose();\r\n\r\n // Update userProfileData\r\n let data = { ...userProfileData };\r\n if (e && id)\r\n {\r\n // For autocomplete fields\r\n data[id] = val;\r\n } else\r\n {\r\n data[e.target.id] = e.target.value;\r\n }\r\n setUserProfileData(data);\r\n };\r\n\r\n const handleUserProfileSubmit = async () =>\r\n {\r\n await setUserProfileLoading(true);\r\n // Set form errors\r\n let formErrors = { ...userProfileErrors };\r\n let hasErrors = false;\r\n if (!userProfileData.firstname)\r\n {\r\n formErrors = { ...formErrors, firstname: 'First Name is required' };\r\n hasErrors = true;\r\n }\r\n if (!userProfileData.lastname)\r\n {\r\n formErrors = { ...formErrors, lastname: 'Last Name is required' };\r\n hasErrors = true;\r\n }\r\n if (!userProfileData.telephoneCountryCode && userProfileData.telephone)\r\n {\r\n formErrors = { ...formErrors, telephoneCountryCode: 'A valid Area Code is required' };\r\n hasErrors = true;\r\n }\r\n if (userProfileData.telephone && !phoneNumberIsValid(userProfileData.telephone))\r\n {\r\n formErrors = { ...formErrors, telephone: 'A valid Phone number is required' };\r\n hasErrors = true;\r\n }\r\n if (!emailIsValid(userProfileData.email))\r\n {\r\n formErrors = { ...formErrors, email: 'A valid Email Address is required' };\r\n hasErrors = true;\r\n }\r\n\r\n // Set errors and return if there are errors\r\n setUserProfileErrors(formErrors);\r\n if (hasErrors)\r\n {\r\n setUserProfileLoading(false);\r\n return;\r\n }\r\n\r\n // Remove leading zeros from phone and convert to string\r\n const formData = {\r\n ...userProfileData,\r\n telephone: convertNumberToString(userProfileData.telephone),\r\n };\r\n\r\n // Trigger API call\r\n const data = await updateUserProfile(userId, formData);\r\n if (!data || !data.success || !data.data.length || data.code !== 200)\r\n {\r\n setError({\r\n show: true,\r\n message: 'There was an error with the request. Please try again.'\r\n }\r\n );\r\n setUserProfileLoading(false);\r\n return;\r\n }\r\n\r\n setError({\r\n ...error,\r\n message: 'Your profile details have been successfully updated',\r\n });\r\n\r\n // Update local storage with latest info\r\n localStorage.setItem('userProfile', JSON.stringify(data.data.user));\r\n setUserProfileLoading(false);\r\n };\r\n\r\n const handleUserPasswordChange = e =>\r\n {\r\n // Clear errors\r\n setUserPasswordErrors({\r\n oldPassword: '',\r\n updatePassword: '',\r\n confirmPassword: '',\r\n });\r\n handleBannerClose();\r\n\r\n // Update userPasswordData\r\n let data = { ...userPasswordData };\r\n data[e.target.id] = e.target.value;\r\n setUserPasswordData(data);\r\n };\r\n\r\n const handleUserPasswordSubmit = async () =>\r\n {\r\n await setUserPasswordLoading(true);\r\n // Set form errors\r\n let formErrors = { ...userPasswordErrors };\r\n let hasErrors = false;\r\n if (!userPasswordData.oldPassword)\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n oldPassword: 'Current Password is required'\r\n };\r\n hasErrors = true;\r\n }\r\n if (!passwordIsValid(userPasswordData.updatePassword))\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n updatePassword: 'Password must include at least 8 characters, 1 number, 1 lowercase letter, 1 uppercase letter'\r\n };\r\n hasErrors = true;\r\n }\r\n if (!repeatPasswordIsValid(userPasswordData.updatePassword, userPasswordData.confirmPassword))\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n confirmPassword: 'Password doesn\\'t match'\r\n };\r\n hasErrors = true;\r\n }\r\n\r\n // Set errors and return if there are errors\r\n setUserPasswordErrors(formErrors);\r\n if (hasErrors)\r\n {\r\n setUserPasswordLoading(false);\r\n return;\r\n }\r\n\r\n // Trigger API call\r\n const data = await updateUserPassword(userId, userPasswordData);\r\n if (!data || !data.success || data.code !== 200 || !data.data.accessToken)\r\n {\r\n setError({\r\n show: true,\r\n message: 'There was an error with the request. Please try again.'\r\n }\r\n );\r\n setUserPasswordLoading(false);\r\n return;\r\n }\r\n\r\n setError({\r\n ...error,\r\n message: 'Your password details have been successfully updated',\r\n });\r\n\r\n // Update local storage with access token returned from request\r\n localStorage.setItem('token', JSON.stringify(data.data.accessToken));\r\n setUserPasswordLoading(false);\r\n };\r\n\r\n const handleTwoStepChange = async e =>\r\n {\r\n // Update twoStep data - convert checked bool to string (either '0' or '1')\r\n let formData = { ...twoStepData };\r\n const value = e.target.checked;\r\n formData[e.target.id] = value;\r\n await setUserPasswordLoading(true);\r\n await handleBannerClose();\r\n\r\n // Trigger API call\r\n const data = await updateUserTwoStep(formData);\r\n if (!data || !data.success || data.code !== 200)\r\n {\r\n setError({\r\n show: true,\r\n message: 'There was an error with the request. Please try again.'\r\n }\r\n );\r\n setUserPasswordLoading(false);\r\n return;\r\n }\r\n\r\n setError({\r\n ...error,\r\n message: 'Your 2-step details have been successfully updated',\r\n });\r\n\r\n setTwoStepData({\r\n ...twoStepData,\r\n twoStep: Number(value),\r\n });\r\n setUserPasswordLoading(false);\r\n };\r\n\r\n const handleTeamMemberDelete = async id =>\r\n {\r\n await setDeleteLoading(true);\r\n await handleBannerClose();\r\n\r\n // Trigger API call\r\n const data = await deleteUserProfile(id);\r\n if (!data || !data.success || data.code !== 200)\r\n {\r\n setError({\r\n show: true,\r\n message: 'There was an error with the request. Please try again.'\r\n }\r\n );\r\n setDeleteLoading(false);\r\n return false;\r\n }\r\n\r\n setError({\r\n ...error,\r\n message: 'User has been successfully deleted',\r\n })\r\n\r\n // Remove profile from array on success\r\n const teamMembersList = teamMembers.filter(member => member.id !== id);\r\n setTeamMembers(teamMembersList);\r\n\r\n setDeleteLoading(false);\r\n return true;\r\n };\r\n\r\n const handleTeamMemberChange = (e, id, val) =>\r\n {\r\n // Clear errors\r\n setTeamMemberErrors({\r\n firstname: '',\r\n lastname: '',\r\n email: '',\r\n telephoneCountryCode: '',\r\n telephone: '',\r\n // TODO: comment in role once API work is done\r\n // role: '',\r\n });\r\n handleBannerClose();\r\n\r\n // Update teamMemberData\r\n let data = { ...teamMemberData };\r\n if (e && id)\r\n {\r\n // For autocomplete fields\r\n data[id] = val;\r\n } else\r\n {\r\n // For all other fields\r\n data[e.target.id] = e.target.value;\r\n }\r\n setTeamMemberData(data);\r\n };\r\n\r\n const handleTeamMemberSubmit = async () =>\r\n {\r\n await setTeamMemberLoading(true);\r\n // Set form errors\r\n let formErrors = { ...teamMemberErrors };\r\n let hasErrors = false;\r\n if (!teamMemberData.firstname)\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n firstname: 'First Name is required'\r\n };\r\n hasErrors = true;\r\n }\r\n if (!teamMemberData.lastname)\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n lastname: 'Last Name is required'\r\n };\r\n hasErrors = true;\r\n }\r\n if (!emailIsValid(teamMemberData.email))\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n email: 'A valid Email is required'\r\n };\r\n hasErrors = true;\r\n }\r\n if (!teamMemberData.telephoneCountryCode && teamMemberData.telephone)\r\n {\r\n formErrors = { ...formErrors, telephoneCountryCode: 'A valid Area Code is required' };\r\n hasErrors = true;\r\n }\r\n if (teamMemberData.telephone && !phoneNumberIsValid(teamMemberData.telephone))\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n telephone: 'A valid Phone number is required'\r\n };\r\n hasErrors = true;\r\n }\r\n\r\n // Set errors and return if there are errors\r\n setTeamMemberErrors(formErrors);\r\n if (hasErrors)\r\n {\r\n setTeamMemberLoading(false);\r\n return false;\r\n }\r\n\r\n const postData = {\r\n ...teamMemberData,\r\n telephone: convertNumberToString(teamMemberData.telephone),\r\n };\r\n\r\n // Trigger API call - update if id or create if no id\r\n try\r\n {\r\n const data = teamMemberData.id\r\n ? await updateUserProfile(teamMemberData.id, postData)\r\n : await addUserProfile(postData);\r\n if (!data || !data.success || data.code !== 200)\r\n {\r\n setTeamMemberErrors({\r\n saveError: 'There was an error with the request. Please check email and phone number are unique.',\r\n });\r\n setTeamMemberLoading(false);\r\n return false;\r\n }\r\n } catch (error)\r\n {\r\n setTeamMemberErrors({\r\n saveError: 'There was an error with the request. Please check email and phone number are unique.',\r\n });\r\n setTeamMemberLoading(false);\r\n return false;\r\n }\r\n\r\n\r\n\r\n // Get new team members list\r\n const membersData = await getClubUsers(clubProfileData.clubId);\r\n if (!membersData || !membersData.success || !membersData.data)\r\n {\r\n setError({\r\n show: true,\r\n message: `User has been ${teamMemberData.id ? 'updated' : 'added'}, but there was an error when getting the updated information`\r\n });\r\n setTeamMemberLoading(false);\r\n return false;\r\n }\r\n\r\n // Reset team members list data - don't display current user\r\n const teamMembersList = membersData.data && membersData.data.length\r\n ? membersData.data.filter(member => member.id !== userId)\r\n : [];\r\n setTeamMembers(teamMembersList);\r\n\r\n setError({\r\n ...error,\r\n message: `User has been successfully ${teamMemberData.id ? 'updated' : 'added'}`,\r\n });\r\n\r\n setTeamMemberData({\r\n id: undefined,\r\n clubId,\r\n firstname: '',\r\n lastname: '',\r\n email: '',\r\n telephoneCountryCode: '',\r\n telephone: '',\r\n clubname: clubName,\r\n });\r\n setTeamMemberLoading(false);\r\n return true;\r\n };\r\n\r\n const resetClubProfileDetails = async () =>\r\n {\r\n // Get club profile details and update in local storage\r\n const data = await getClubProfile(clubId);\r\n if (!data || !data.success || data.code !== 200 || !(data.data && (Object.keys(data.data).length)))\r\n {\r\n return false;\r\n }\r\n\r\n if (getManageClubId() === clubId)\r\n {\r\n localStorage.setItem('manageClubProfile', JSON.stringify(data.data));\r\n } else\r\n {\r\n localStorage.setItem('clubProfile', JSON.stringify(data.data));\r\n }\r\n\r\n return true;\r\n };\r\n\r\n const handleLogoChange = async e =>\r\n {\r\n await setClubLogoLoading(true);\r\n if (e.target.files.length)\r\n {\r\n // Create new FormData instance and append file to it to enable successful POST request\r\n const file = e.target.files[0];\r\n let formData = new FormData();\r\n formData.append('logofile', file);\r\n\r\n // Trigger API call\r\n const data = await updateClubLogo(clubId, formData);\r\n if (!data || !data.success || data.code !== 200)\r\n {\r\n setError({\r\n show: true,\r\n message: 'There was an error with the request. Please try again.'\r\n }\r\n );\r\n setClubLogoLoading(false);\r\n return;\r\n }\r\n\r\n // Convert image to base64 string to display in image area\r\n await convertToBase64(file, setClubLogoData, true);\r\n }\r\n\r\n // Get updated club profile data with new logo and update local storage\r\n const getClubProfileSuccess = await resetClubProfileDetails();\r\n if (!getClubProfileSuccess)\r\n {\r\n setError({\r\n show: true,\r\n message: 'Club photo has been successfully updated, but there was an error when getting the updated information'\r\n }\r\n );\r\n setClubLogoLoading(false);\r\n return;\r\n }\r\n\r\n // Show success message providing all logic is successful\r\n setError({\r\n ...error,\r\n message: 'Club photo has been successfully updated',\r\n });\r\n\r\n setClubLogoLoading(false);\r\n };\r\n\r\n const handleClubProfileChange = (e, id, val) =>\r\n {\r\n // Clear errors\r\n setClubProfileErrors({\r\n name: '',\r\n addr1: '',\r\n addr2: '',\r\n addr3: '',\r\n city: '',\r\n postcode: '',\r\n country: '',\r\n });\r\n handleBannerClose();\r\n\r\n // Update userProfileData\r\n let data = { ...clubProfileData };\r\n if (e && id)\r\n {\r\n // For autocomplete fields\r\n data[id] = val;\r\n } else\r\n {\r\n // For all other fields\r\n data[e.target.id] = e.target.value;\r\n }\r\n setClubProfileData(data);\r\n };\r\n\r\n const handleClubProfileSubmit = async () =>\r\n {\r\n await setClubProfileLoading(true);\r\n // Set form errors\r\n let formErrors = { ...clubProfileErrors };\r\n let hasErrors = false;\r\n if (!clubProfileData.name)\r\n {\r\n formErrors = { ...formErrors, name: 'Club Name is required' };\r\n hasErrors = true;\r\n }\r\n if (!clubProfileData.addr1)\r\n {\r\n formErrors = { ...formErrors, addr1: 'Address 1 is required' };\r\n hasErrors = true;\r\n }\r\n if (!clubProfileData.city)\r\n {\r\n formErrors = { ...formErrors, city: 'City is required' };\r\n hasErrors = true;\r\n }\r\n if (!clubProfileData.postcode)\r\n {\r\n formErrors = { ...formErrors, postcode: 'Post/Zip Code is required' };\r\n hasErrors = true;\r\n }\r\n if (!clubProfileData.country)\r\n {\r\n formErrors = { ...formErrors, country: 'Country is required' };\r\n hasErrors = true;\r\n }\r\n\r\n // Set errors and return if there are errors\r\n setClubProfileErrors(formErrors);\r\n if (hasErrors)\r\n {\r\n setClubProfileLoading(false);\r\n return;\r\n }\r\n\r\n // Trigger API call\r\n const data = await updateClubProfile(clubId, clubProfileData);\r\n if (!data || !data.success || data.code !== 200)\r\n {\r\n setError({\r\n show: true,\r\n message: 'There was an error with the request. Please try again.'\r\n }\r\n );\r\n setClubProfileLoading(false);\r\n return;\r\n }\r\n\r\n // Get updated club profile data with new logo and update local storage\r\n const getClubProfileSuccess = await resetClubProfileDetails();\r\n if (!getClubProfileSuccess)\r\n {\r\n setError({\r\n show: true,\r\n message: 'Club details have been successfully updated, but there was an error when getting the updated information'\r\n }\r\n );\r\n setClubLogoLoading(false);\r\n return;\r\n }\r\n\r\n // Show success message providing all logic is successful\r\n setError({\r\n ...error,\r\n message: 'Club details have been successfully updated',\r\n });\r\n\r\n setClubProfileLoading(false);\r\n };\r\n\r\n return (\r\n <>\r\n {\r\n \r\n \r\n \r\n \r\n {baseContext.baseData.isManagingClub == false &&\r\n <>\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n >\r\n }\r\n {\r\n baseContext.baseData.isManagingClub == true &&\r\n\r\n \r\n \r\n Your details are disabled while managing clubs\r\n \r\n \r\n }\r\n \r\n {baseContext.baseData.hasEliteClubLicence && canEditTeamMembers(userRole) &&\r\n \r\n }\r\n {\r\n isAboveClubMember(userRole) &&\r\n <>\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n >\r\n }\r\n\r\n \r\n }\r\n >\r\n );\r\n};\r\n\r\nexport default Account;\r\n","import {styled} from '@mui/material';\r\n\r\nexport const SubscriptionContainer = styled('div')(() => ({\r\n marginBottom: 30,\r\n '&:last-of-type': {\r\n marginBottom: 0,\r\n },\r\n}));\r\n","import {\r\n styled,\r\n Table,\r\n} from '@mui/material';\r\nimport {\r\n StyledTableBody,\r\n StyledTableRow,\r\n} from '../CustomTableWrapper/CustomTableWrapper.styles';\r\nimport {StyledTableCell} from '../CustomTableHead/CustomTableHead.styles';\r\n\r\nexport const StyledTable = styled(Table)(() => ({}));\r\n\r\nexport const FrequencyContainer = styled('div')(() => ({\r\n display: 'flex',\r\n alignItems: 'center',\r\n '& .MuiButton-root': {\r\n marginLeft: 10,\r\n },\r\n}));\r\n\r\nexport {\r\n StyledTableBody,\r\n StyledTableRow,\r\n StyledTableCell,\r\n}\r\n","import { useEffect, useState } from 'react';\r\nimport\r\n{\r\n StyledTable,\r\n StyledTableBody,\r\n StyledTableRow,\r\n StyledTableCell,\r\n} from './SubscriptionsList.styles';\r\nimport { subscriptionColumns } from '../../../options/tableColumns';\r\nimport CustomTableWrapper from '../CustomTableWrapper/CustomTableWrapper';\r\nimport CustomTableHead from '../CustomTableHead/CustomTableHead';\r\nimport SectionSpinner from '../../Loading/SectionSpinner/SectionSpinner';\r\n// import CustomToggle from '../../Inputs/CustomToggle/CustomToggle';\r\n\r\n// Helpers\r\nimport { getComparator, stableSort, handleRequestSort } from '../../../utils/tableSortHelpers/tableSortHelpers';\r\nimport { formatStandardDateString } from '../../../utils/helpers/formatDateString';\r\nimport LinkButton from '../../Buttons/LinkButton/LinkButton';\r\nimport DeleteOutlineIcon from '@mui/icons-material/DeleteOutline';\r\n// import { getCustomerPortalRedirect } from '../../../api';\r\n// import SectionContainer from '../../Containers/SectionContainer/SectionContainer';\r\n// import InvoicesList from '../InvoicesList/InvoicesList';\r\nimport { getCustomerPortalUrl, handleCustomerPortalRedirect } from '../../../utils/helpers/billingHelper';\r\n\r\nimport { routes } from '../../../options/routes';\r\n\r\nconst redirectToLicencePage = async () =>\r\n{\r\n window.location.href = routes.indexLicences;\r\n}\r\nconst SubscriptionsList = ({\r\n subscriptions,\r\n onAutoRenewChange,\r\n autoRenewLoading,\r\n onSubscriptionChangeClick\r\n}) =>\r\n{\r\n const [order, setOrder] = useState('asc');\r\n const [orderBy, setOrderBy] = useState('');\r\n const [redirectLoading, setRedirectLoading] = useState(false);\r\n const [billingUrl, setBillingUrl] = useState(null);\r\n\r\n useEffect(async () =>\r\n {\r\n if (!billingUrl)\r\n {\r\n let url = await getCustomerPortalUrl();\r\n if (url)\r\n {\r\n setBillingUrl(url);\r\n }\r\n }\r\n });\r\n\r\n return (\r\n <>\r\n \r\n \r\n handleRequestSort(e, id, orderBy, order, setOrder, setOrderBy)}\r\n columnHeadings={subscriptionColumns}\r\n />\r\n \r\n {\r\n subscriptions.length === 0 &&\r\n \r\n \r\n INDEX TRIAL \r\n \r\n \r\n \r\n --\r\n \r\n \r\n --\r\n \r\n \r\n --\r\n \r\n \r\n }\r\n {\r\n subscriptions.length > 0 &&\r\n stableSort(subscriptions, getComparator(order, orderBy))\r\n .map(({ id, name, changeTo, frequency, nextAmount, expires, autoRenew }, idx) => (\r\n \r\n \r\n {name}\r\n \r\n \r\n {frequency}\r\n \r\n \r\n {nextAmount}\r\n \r\n \r\n {formatStandardDateString(expires)}\r\n \r\n {billingUrl ?\r\n \r\n {redirectLoading ?\r\n \r\n :\r\n { handleCustomerPortalRedirect(setRedirectLoading, billingUrl) }} />\r\n }\r\n \r\n :\r\n \r\n }\r\n \r\n ))\r\n }\r\n \r\n \r\n \r\n >\r\n );\r\n};\r\n\r\nexport default SubscriptionsList;\r\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: \"1.52.1\",\n startTime: startTime\n });\n};\n\nvar stripePromise = null;\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 }\n\n script.addEventListener('load', function () {\n if (window.Stripe) {\n resolve(window.Stripe);\n } else {\n reject(new Error('Stripe.js not available'));\n }\n });\n script.addEventListener('error', function () {\n reject(new Error('Failed to load Stripe.js'));\n });\n } catch (error) {\n reject(error);\n return;\n }\n });\n return stripePromise;\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\n// own script injection.\n\nvar stripePromise$1 = Promise.resolve().then(function () {\n return loadScript(null);\n});\nvar loadCalled = false;\nstripePromise$1[\"catch\"](function (err) {\n if (!loadCalled) {\n console.warn(err);\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();\n return stripePromise$1.then(function (maybeStripe) {\n return initStripe(maybeStripe, args, startTime);\n });\n};\n\nexport { loadStripe };\n","\r\nimport\r\n {\r\n styled,\r\n Card,\r\n CardActions,\r\n CardContent,\r\n Typography,\r\n } from \"@mui/material\";\r\nimport { colors } from \"../../../options/colors\";\r\n\r\nexport const Container = styled('div')(() => ({\r\n position: 'relative',\r\n display: 'flex',\r\n width: \"400px\",\r\n height: \"550px\"\r\n}));\r\n\r\nexport const RecommendedContainer = styled(\"div\")(() => ({\r\n textAlign: \"center\",\r\n width: \"100%\",\r\n position: \"absolute\",\r\n top: 8,\r\n}));\r\n\r\nexport const RecommendedText = styled(Typography)(({ theme }) => ({\r\n ...theme.typography.h3,\r\n letterSpacing: 1.4,\r\n textTransform: \"uppercase\",\r\n}));\r\n\r\nexport const StyledCard = styled(Card)(({ theme, recommended }) => ({\r\n padding: \"20px 20px 25px\",\r\n background: \"rgba(0, 0, 0, 0.4)\",\r\n width: \"100%\",\r\n height: recommended ? \"unset\" : \"calc(100% - 76px)\",\r\n borderRadius: 5,\r\n marginTop: recommended ? `0 !important` : `auto`,\r\n display: \"flex\",\r\n flexDirection: \"column\",\r\n border: recommended ? `3px solid ${colors.primaryOrange}` : undefined,\r\n borderTopWidth: recommended ? 30 : undefined,\r\n [theme.breakpoints.down(\"sm\")]: {\r\n height: \"unset\",\r\n margin: 0,\r\n },\r\n}));\r\n\r\nexport const StyledCardActions = styled(CardActions)(() => ({\r\n padding: 0,\r\n margin: \"auto 0 0\",\r\n textAlign: \"center\",\r\n}));\r\n\r\nexport const StyledCardContent = styled(CardContent)(() => ({\r\n padding: 0,\r\n marginBottom: 20,\r\n display: \"flex\",\r\n flexDirection: \"column\",\r\n alignItems: \"center\",\r\n}));\r\n\r\nexport const IconAvatarContainer = styled(\"div\")(() => ({\r\n marginBottom: 25,\r\n}));\r\n\r\nexport const FeatureLinesContainer = styled(\"div\")(() => ({\r\n width: \"100%\",\r\n}));\r\n","'use client';\n\nimport * as React from 'react';\nimport createSvgIcon from '../../utils/createSvgIcon';\n\n/**\n * @ignore - internal component.\n */\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z\"\n}), 'Person');","import generateUtilityClasses from '@mui/utils/generateUtilityClasses';\nimport generateUtilityClass from '@mui/utils/generateUtilityClass';\nexport function getAvatarUtilityClass(slot) {\n return generateUtilityClass('MuiAvatar', slot);\n}\nconst avatarClasses = generateUtilityClasses('MuiAvatar', ['root', 'colorDefault', 'circular', 'rounded', 'square', 'img', 'fallback']);\nexport default avatarClasses;","'use client';\n\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"alt\", \"children\", \"className\", \"component\", \"slots\", \"slotProps\", \"imgProps\", \"sizes\", \"src\", \"srcSet\", \"variant\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport composeClasses from '@mui/utils/composeClasses';\nimport { styled, createUseThemeProps } from '../zero-styled';\nimport Person from '../internal/svg-icons/Person';\nimport { getAvatarUtilityClass } from './avatarClasses';\nimport useSlot from '../utils/useSlot';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nconst useThemeProps = createUseThemeProps('MuiAvatar');\nconst useUtilityClasses = ownerState => {\n const {\n classes,\n variant,\n colorDefault\n } = ownerState;\n const slots = {\n root: ['root', variant, colorDefault && 'colorDefault'],\n img: ['img'],\n fallback: ['fallback']\n };\n return composeClasses(slots, getAvatarUtilityClass, classes);\n};\nconst AvatarRoot = styled('div', {\n name: 'MuiAvatar',\n slot: 'Root',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.root, styles[ownerState.variant], ownerState.colorDefault && styles.colorDefault];\n }\n})(({\n theme\n}) => ({\n position: 'relative',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n flexShrink: 0,\n width: 40,\n height: 40,\n fontFamily: theme.typography.fontFamily,\n fontSize: theme.typography.pxToRem(20),\n lineHeight: 1,\n borderRadius: '50%',\n overflow: 'hidden',\n userSelect: 'none',\n variants: [{\n props: {\n variant: 'rounded'\n },\n style: {\n borderRadius: (theme.vars || theme).shape.borderRadius\n }\n }, {\n props: {\n variant: 'square'\n },\n style: {\n borderRadius: 0\n }\n }, {\n props: {\n colorDefault: true\n },\n style: _extends({\n color: (theme.vars || theme).palette.background.default\n }, theme.vars ? {\n backgroundColor: theme.vars.palette.Avatar.defaultBg\n } : _extends({\n backgroundColor: theme.palette.grey[400]\n }, theme.applyStyles('dark', {\n backgroundColor: theme.palette.grey[600]\n })))\n }]\n}));\nconst AvatarImg = styled('img', {\n name: 'MuiAvatar',\n slot: 'Img',\n overridesResolver: (props, styles) => styles.img\n})({\n width: '100%',\n height: '100%',\n textAlign: 'center',\n // Handle non-square image. The property isn't supported by IE11.\n objectFit: 'cover',\n // Hide alt text.\n color: 'transparent',\n // Hide the image broken icon, only works on Chrome.\n textIndent: 10000\n});\nconst AvatarFallback = styled(Person, {\n name: 'MuiAvatar',\n slot: 'Fallback',\n overridesResolver: (props, styles) => styles.fallback\n})({\n width: '75%',\n height: '75%'\n});\nfunction useLoaded({\n crossOrigin,\n referrerPolicy,\n src,\n srcSet\n}) {\n const [loaded, setLoaded] = React.useState(false);\n React.useEffect(() => {\n if (!src && !srcSet) {\n return undefined;\n }\n setLoaded(false);\n let active = true;\n const image = new Image();\n image.onload = () => {\n if (!active) {\n return;\n }\n setLoaded('loaded');\n };\n image.onerror = () => {\n if (!active) {\n return;\n }\n setLoaded('error');\n };\n image.crossOrigin = crossOrigin;\n image.referrerPolicy = referrerPolicy;\n image.src = src;\n if (srcSet) {\n image.srcset = srcSet;\n }\n return () => {\n active = false;\n };\n }, [crossOrigin, referrerPolicy, src, srcSet]);\n return loaded;\n}\nconst Avatar = /*#__PURE__*/React.forwardRef(function Avatar(inProps, ref) {\n const props = useThemeProps({\n props: inProps,\n name: 'MuiAvatar'\n });\n const {\n alt,\n children: childrenProp,\n className,\n component = 'div',\n slots = {},\n slotProps = {},\n imgProps,\n sizes,\n src,\n srcSet,\n variant = 'circular'\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n let children = null;\n\n // Use a hook instead of onError on the img element to support server-side rendering.\n const loaded = useLoaded(_extends({}, imgProps, {\n src,\n srcSet\n }));\n const hasImg = src || srcSet;\n const hasImgNotFailing = hasImg && loaded !== 'error';\n const ownerState = _extends({}, props, {\n colorDefault: !hasImgNotFailing,\n component,\n variant\n });\n const classes = useUtilityClasses(ownerState);\n const [ImgSlot, imgSlotProps] = useSlot('img', {\n className: classes.img,\n elementType: AvatarImg,\n externalForwardedProps: {\n slots,\n slotProps: {\n img: _extends({}, imgProps, slotProps.img)\n }\n },\n additionalProps: {\n alt,\n src,\n srcSet,\n sizes\n },\n ownerState\n });\n if (hasImgNotFailing) {\n children = /*#__PURE__*/_jsx(ImgSlot, _extends({}, imgSlotProps));\n // We only render valid children, non valid children are rendered with a fallback\n // We consider that invalid children are all falsy values, except 0, which is valid.\n } else if (!!childrenProp || childrenProp === 0) {\n children = childrenProp;\n } else if (hasImg && alt) {\n children = alt[0];\n } else {\n children = /*#__PURE__*/_jsx(AvatarFallback, {\n ownerState: ownerState,\n className: classes.fallback\n });\n }\n return /*#__PURE__*/_jsx(AvatarRoot, _extends({\n as: component,\n ownerState: ownerState,\n className: clsx(classes.root, className),\n ref: ref\n }, other, {\n children: children\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? Avatar.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 * Used in combination with `src` or `srcSet` to\n * provide an alt attribute for the rendered `img` element.\n */\n alt: PropTypes.string,\n /**\n * Used to render icon or text elements inside the Avatar if `src` is not set.\n * This can be an element, or just a string.\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 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 * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attributes) applied to the `img` element if the component is used to display an image.\n * It can be used to listen for the loading error event.\n * @deprecated Use `slotProps.img` instead. This prop will be removed in v7. [How to migrate](/material-ui/migration/migrating-from-deprecated-apis/).\n */\n imgProps: PropTypes.object,\n /**\n * The `sizes` attribute for the `img` element.\n */\n sizes: PropTypes.string,\n /**\n * The props used for each slot inside.\n * @default {}\n */\n slotProps: PropTypes.shape({\n img: PropTypes.oneOfType([PropTypes.func, PropTypes.object])\n }),\n /**\n * The components used for each slot inside.\n * @default {}\n */\n slots: PropTypes.shape({\n img: PropTypes.elementType\n }),\n /**\n * The `src` attribute for the `img` element.\n */\n src: PropTypes.string,\n /**\n * The `srcSet` attribute for the `img` element.\n * Use this attribute for responsive image display.\n */\n srcSet: PropTypes.string,\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 * The shape of the avatar.\n * @default 'circular'\n */\n variant: PropTypes /* @typescript-to-proptypes-ignore */.oneOfType([PropTypes.oneOf(['circular', 'rounded', 'square']), PropTypes.string])\n} : void 0;\nexport default Avatar;","import {styled, Avatar} from '@mui/material';\r\n\r\nexport const StyledAvatar = styled(Avatar)(({background}) => ({\r\n width: 50,\r\n height: 50,\r\n backgroundColor: background,\r\n}));\r\n","import {StyledAvatar} from './IconAvatar.styles';\r\n\r\nconst IconAvatar = ({icon, bgColor}) => {\r\n return (\r\n \r\n {icon}\r\n \r\n );\r\n};\r\n\r\nexport default IconAvatar;\r\n","import {\r\n styled,\r\n Typography,\r\n} from '@mui/material';\r\nimport {colors} from '../../../options/colors';\r\n\r\nexport const Container = styled('div')(() => ({\r\n marginBottom: 26,\r\n textAlign: 'center',\r\n}));\r\n\r\nexport const StyledTitle = styled(Typography)(({ theme, recommended }) => ({\r\n ...theme.typography.h2,\r\n color: recommended ? colors.primaryOrange : colors.white,\r\n}));\r\n","import {\r\n Container,\r\n StyledTitle,\r\n} from './CardTitle.styles';\r\n\r\nconst CardTitle = ({text, isRecommended}) => {\r\n return (\r\n \r\n \r\n {text}\r\n \r\n \r\n );\r\n};\r\n\r\nexport default CardTitle;\r\n","import 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.41L9 16.17z\"\n}), 'CheckOutlined');","import {\r\n styled,\r\n Typography,\r\n} from '@mui/material';\r\nimport {colors} from '../../../options/colors';\r\nimport {CheckOutlined} from '@mui/icons-material';\r\n\r\nexport const Container = styled('div')(() => ({\r\n display: 'flex',\r\n marginBottom: 12,\r\n}));\r\n\r\nexport const StyledText = styled(Typography)(({ theme }) => ({\r\n ...theme.typography.body1,\r\n}));\r\n\r\nexport const StyledIcon = styled(CheckOutlined)(({ recommended }) => ({\r\n color: recommended ? colors.primaryOrange : colors.secondaryGrey,\r\n marginRight: 16,\r\n fontSize: 22,\r\n}));\r\n","import {\r\n Container,\r\n StyledIcon,\r\n StyledText,\r\n} from './FeatureLine.styles';\r\n\r\nconst FeatureLine = ({text, isRecommended}) => {\r\n return (\r\n \r\n \r\n \r\n {text}\r\n \r\n \r\n );\r\n};\r\n\r\nexport default FeatureLine;\r\n","import generateUtilityClass from '@mui/material/generateUtilityClass';\nimport generateUtilityClasses from '@mui/material/generateUtilityClasses';\nexport function getLoadingButtonUtilityClass(slot) {\n return generateUtilityClass('MuiLoadingButton', slot);\n}\nconst loadingButtonClasses = generateUtilityClasses('MuiLoadingButton', ['root', 'loading', 'loadingIndicator', 'loadingIndicatorCenter', 'loadingIndicatorStart', 'loadingIndicatorEnd', 'endIconLoadingEnd', 'startIconLoadingStart']);\nexport default loadingButtonClasses;","import _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"children\", \"disabled\", \"id\", \"loading\", \"loadingIndicator\", \"loadingPosition\", \"variant\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport { chainPropTypes } from '@mui/utils';\nimport { capitalize, unstable_useId as useId } from '@mui/material/utils';\nimport { unstable_composeClasses as composeClasses } from '@mui/base';\nimport { styled, useThemeProps } from '@mui/material/styles';\nimport Button from '@mui/material/Button';\nimport CircularProgress from '@mui/material/CircularProgress';\nimport loadingButtonClasses, { getLoadingButtonUtilityClass } from './loadingButtonClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { jsxs as _jsxs } from \"react/jsx-runtime\";\nconst useUtilityClasses = ownerState => {\n const {\n loading,\n loadingPosition,\n classes\n } = ownerState;\n const slots = {\n root: ['root', loading && 'loading'],\n startIcon: [loading && `startIconLoading${capitalize(loadingPosition)}`],\n endIcon: [loading && `endIconLoading${capitalize(loadingPosition)}`],\n loadingIndicator: ['loadingIndicator', loading && `loadingIndicator${capitalize(loadingPosition)}`]\n };\n const composedClasses = composeClasses(slots, getLoadingButtonUtilityClass, classes);\n return _extends({}, classes, composedClasses);\n};\n\n// TODO use `import { rootShouldForwardProp } from '../styles/styled';` once move to core\nconst rootShouldForwardProp = prop => prop !== 'ownerState' && prop !== 'theme' && prop !== 'sx' && prop !== 'as' && prop !== 'classes';\nconst LoadingButtonRoot = styled(Button, {\n shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',\n name: 'MuiLoadingButton',\n slot: 'Root',\n overridesResolver: (props, styles) => {\n return [styles.root, styles.startIconLoadingStart && {\n [`& .${loadingButtonClasses.startIconLoadingStart}`]: styles.startIconLoadingStart\n }, styles.endIconLoadingEnd && {\n [`& .${loadingButtonClasses.endIconLoadingEnd}`]: styles.endIconLoadingEnd\n }];\n }\n})(({\n ownerState,\n theme\n}) => _extends({\n [`& .${loadingButtonClasses.startIconLoadingStart}, & .${loadingButtonClasses.endIconLoadingEnd}`]: {\n transition: theme.transitions.create(['opacity'], {\n duration: theme.transitions.duration.short\n }),\n opacity: 0\n }\n}, ownerState.loadingPosition === 'center' && {\n transition: theme.transitions.create(['background-color', 'box-shadow', 'border-color'], {\n duration: theme.transitions.duration.short\n }),\n [`&.${loadingButtonClasses.loading}`]: {\n color: 'transparent'\n }\n}, ownerState.loadingPosition === 'start' && ownerState.fullWidth && {\n [`& .${loadingButtonClasses.startIconLoadingStart}, & .${loadingButtonClasses.endIconLoadingEnd}`]: {\n transition: theme.transitions.create(['opacity'], {\n duration: theme.transitions.duration.short\n }),\n opacity: 0,\n marginRight: -8\n }\n}, ownerState.loadingPosition === 'end' && ownerState.fullWidth && {\n [`& .${loadingButtonClasses.startIconLoadingStart}, & .${loadingButtonClasses.endIconLoadingEnd}`]: {\n transition: theme.transitions.create(['opacity'], {\n duration: theme.transitions.duration.short\n }),\n opacity: 0,\n marginLeft: -8\n }\n}));\nconst LoadingButtonLoadingIndicator = styled('div', {\n name: 'MuiLoadingButton',\n slot: 'LoadingIndicator',\n overridesResolver: (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.loadingIndicator, styles[`loadingIndicator${capitalize(ownerState.loadingPosition)}`]];\n }\n})(({\n theme,\n ownerState\n}) => _extends({\n position: 'absolute',\n visibility: 'visible',\n display: 'flex'\n}, ownerState.loadingPosition === 'start' && (ownerState.variant === 'outlined' || ownerState.variant === 'contained') && {\n left: ownerState.size === 'small' ? 10 : 14\n}, ownerState.loadingPosition === 'start' && ownerState.variant === 'text' && {\n left: 6\n}, ownerState.loadingPosition === 'center' && {\n left: '50%',\n transform: 'translate(-50%)',\n color: (theme.vars || theme).palette.action.disabled\n}, ownerState.loadingPosition === 'end' && (ownerState.variant === 'outlined' || ownerState.variant === 'contained') && {\n right: ownerState.size === 'small' ? 10 : 14\n}, ownerState.loadingPosition === 'end' && ownerState.variant === 'text' && {\n right: 6\n}, ownerState.loadingPosition === 'start' && ownerState.fullWidth && {\n position: 'relative',\n left: -10\n}, ownerState.loadingPosition === 'end' && ownerState.fullWidth && {\n position: 'relative',\n right: -10\n}));\nconst LoadingButton = /*#__PURE__*/React.forwardRef(function LoadingButton(inProps, ref) {\n const props = useThemeProps({\n props: inProps,\n name: 'MuiLoadingButton'\n });\n const {\n children,\n disabled = false,\n id: idProp,\n loading = false,\n loadingIndicator: loadingIndicatorProp,\n loadingPosition = 'center',\n variant = 'text'\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const id = useId(idProp);\n const loadingIndicator = loadingIndicatorProp != null ? loadingIndicatorProp : /*#__PURE__*/_jsx(CircularProgress, {\n \"aria-labelledby\": id,\n color: \"inherit\",\n size: 16\n });\n const ownerState = _extends({}, props, {\n disabled,\n loading,\n loadingIndicator,\n loadingPosition,\n variant\n });\n const classes = useUtilityClasses(ownerState);\n const loadingButtonLoadingIndicator = loading ? /*#__PURE__*/_jsx(LoadingButtonLoadingIndicator, {\n className: classes.loadingIndicator,\n ownerState: ownerState,\n children: loadingIndicator\n }) : null;\n return /*#__PURE__*/_jsxs(LoadingButtonRoot, _extends({\n disabled: disabled || loading,\n id: id,\n ref: ref\n }, other, {\n variant: variant,\n classes: classes,\n ownerState: ownerState,\n children: [ownerState.loadingPosition === 'end' ? children : loadingButtonLoadingIndicator, ownerState.loadingPosition === 'end' ? loadingButtonLoadingIndicator : children]\n }));\n});\nprocess.env.NODE_ENV !== \"production\" ? LoadingButton.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 \"yarn 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 * If `true`, the component is disabled.\n * @default false\n */\n disabled: PropTypes.bool,\n /**\n * @ignore\n */\n id: PropTypes.string,\n /**\n * If `true`, the loading indicator is shown.\n * @default false\n */\n loading: PropTypes.bool,\n /**\n * Element placed before the children if the button is in loading state.\n * The node should contain an element with `role=\"progressbar\"` with an accessible name.\n * By default we render a `CircularProgress` that is labelled by the button itself.\n * @default \n */\n loadingIndicator: PropTypes.node,\n /**\n * The loading indicator can be positioned on the start, end, or the center of the button.\n * @default 'center'\n */\n loadingPosition: chainPropTypes(PropTypes.oneOf(['start', 'end', 'center']), props => {\n if (props.loadingPosition === 'start' && !props.startIcon) {\n return new Error(`MUI: The loadingPosition=\"start\" should be used in combination with startIcon.`);\n }\n if (props.loadingPosition === 'end' && !props.endIcon) {\n return new Error(`MUI: The loadingPosition=\"end\" should be used in combination with endIcon.`);\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 /**\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 LoadingButton;","import {\r\n styled,\r\n} from '@mui/material';\r\nimport LoadingButton from '@mui/lab/LoadingButton';\r\n\r\nimport {colors} from '../../../options/colors';\r\n\r\nexport const StyledButton = styled(LoadingButton)(({ theme}) => ({\r\n ...theme.typography.h5,\r\n borderColor: colors.primaryOrange,\r\n backgroundColor: colors.primaryOrange,\r\n color: colors.buttonTextBlack,\r\n width: '100%',\r\n}));\r\n","import {StyledButton} from './SolidButton.styles';\r\n\r\nconst SolidButton = ({text, onClick, loading}) => {\r\n return (\r\n \r\n {text}\r\n \r\n );\r\n};\r\n\r\nexport default SolidButton;\r\n","import {styled} from '@mui/material';\r\nimport {colors} from '../../../options/colors';\r\n\r\nexport const StyledText = styled('span')(({ theme, active, small }) => ({\r\n ...theme.typography.h4,\r\n color: active ? colors.successDarkGreen : colors.primaryRed,\r\n padding: small ? '5px 8px' : '11px 8px',\r\n display: small ? undefined : 'block',\r\n width: small ? undefined : '100%',\r\n textAlign: 'center',\r\n backgroundColor: active ? colors.successLightGreen : colors.secondaryRed,\r\n borderRadius: 5,\r\n}));\r\n","import {StyledText} from './StatusPill.styles';\r\n\r\nconst StatusPill = ({text, isActive, small}) => {\r\n return (\r\n \r\n {text}\r\n \r\n );\r\n};\r\n\r\nexport default StatusPill;\r\n","import\r\n{\r\n Container,\r\n StyledCard,\r\n RecommendedContainer,\r\n RecommendedText,\r\n StyledCardContent,\r\n StyledCardActions,\r\n IconAvatarContainer,\r\n FeatureLinesContainer,\r\n} from './SubscriptionCard.styles';\r\nimport IconAvatar from '../../Avatars/IconAvatar/IconAvatar';\r\nimport CardTitle from '../../Typography/CardTitle/CardTitle';\r\nimport FeatureLine from '../../Typography/FeatureLine/FeatureLine';\r\nimport OutlinedButton from '../../Buttons/OutlinedButton/OutlinedButton';\r\nimport SolidButton from '../../Buttons/SolidButton/SolidButton';\r\nimport StatusPill from '../../Pills/StatusPill/StatusPill';\r\nimport { Box, Stack } from '@mui/material';\r\nimport SectionSpinner from '../../Loading/SectionSpinner/SectionSpinner';\r\nimport { useState } from 'react';\r\n\r\n\r\nconst SubscriptionCard = ({\r\n avatarBgColor,\r\n icon,\r\n title,\r\n features,\r\n isRecommended,\r\n isExpired,\r\n isSelected,\r\n isActive,\r\n isTrial,\r\n isEnabled,\r\n showDowngrade,\r\n showUpgrade,\r\n onClick,\r\n willRedirect\r\n}) =>\r\n{\r\n const [redirectLoading, setRedirectLoading] = useState(false);\r\n const getButtonText = () =>\r\n {\r\n if (isSelected !== undefined)\r\n {\r\n return isSelected ? \"Selected\" : \"Select\";\r\n }\r\n if (isRecommended)\r\n {\r\n return showUpgrade ? \"Upgrade\" : \"Activate\";\r\n }\r\n return showDowngrade ? \"Downgrade\" : showUpgrade ? \"Upgrade\" : \"Activate\";\r\n };\r\n\r\n const getSubButtonText = (text) =>\r\n {\r\n if (willRedirect)\r\n {\r\n if (redirectLoading && 0 === text.toLowerCase().indexOf(redirectLoading))\r\n {\r\n return \r\n }\r\n }\r\n return text;\r\n };\r\n\r\n const handleSubClick = (onClick, freq, event) =>\r\n {\r\n setRedirectLoading(freq);\r\n onClick(freq)\r\n };\r\n\r\n return (\r\n \r\n {isRecommended && (\r\n \r\n Recommended\r\n \r\n )}\r\n \r\n \r\n \r\n \r\n \r\n \r\n {features &&\r\n features.map((feature) => (\r\n \r\n \r\n \r\n ))}\r\n \r\n \r\n {\r\n isExpired &&\r\n \r\n }\r\n {\r\n isActive &&\r\n \r\n }\r\n {\r\n isSelected && !isExpired && !isActive &&\r\n \r\n }\r\n {\r\n !isExpired && !isActive && !isSelected && !isTrial && isEnabled &&\r\n \r\n { handleSubClick(onClick, \"monthly\", event) }}\r\n fullWidth\r\n />\r\n { handleSubClick(onClick, \"annual\", event) }}\r\n fullWidth\r\n />\r\n \r\n }\r\n {\r\n isTrial && !isExpired &&\r\n \r\n { onClick(\"trial\") }}\r\n fullWidth\r\n />\r\n \r\n }\r\n \r\n \r\n \r\n );\r\n};\r\n\r\nexport default SubscriptionCard;\r\n","import {styled,Typography} from '@mui/material';\r\nimport {colors} from '../../../options/colors';\r\n\r\nexport const Container = styled('div')(() => ({}));\r\n\r\nexport const ContentContainer = styled('div')(() => ({\r\n display: 'flex',\r\n flexDirection: 'row',\r\n}));\r\n\r\nexport const SubscriptionDetailsContainer = styled('div')(({ theme }) => ({\r\n display: 'flex',\r\n flex: 1,\r\n flexDirection: 'column',\r\n [theme.breakpoints.down('sm')]: {\r\n display: 'none',\r\n }\r\n}));\r\n\r\nexport const FormContainer = styled('div')(() => ({\r\n display: 'flex',\r\n flex: 1,\r\n}));\r\n\r\nexport const Form = styled('form')(() => ({\r\n width: '100%',\r\n}));\r\n\r\nexport const StripeInputWrapper = styled('div')(() => ({\r\n height: 46,\r\n border: `1px ${colors.secondaryGrey} solid`,\r\n borderRadius: 5,\r\n padding: '0 20px',\r\n}));\r\n\r\nexport const InputWrapper = styled('div')(() => ({\r\n marginBottom: 20,\r\n}));\r\n\r\nexport const InputRow = styled('div')(() => ({\r\n display: 'flex',\r\n}));\r\n\r\nexport const InputColumn = styled('div')(() => ({\r\n display: 'flex',\r\n flexDirection: 'column',\r\n flex: 3,\r\n}));\r\n\r\nexport const InputSpacing = styled('div')(() => ({\r\n display: 'flex',\r\n flexDirection: 'column',\r\n flex: 1,\r\n}));\r\n\r\nexport const FeatureLinesContainer = styled('div')(() => ({\r\n width: '100%',\r\n}));\r\n\r\nexport const IconAvatarContainer = styled('div')(() => ({\r\n display: 'flex',\r\n alignItems: 'center',\r\n marginBottom: 25,\r\n}));\r\n\r\nexport const SubscriptionTitle = styled(Typography)(({ theme }) => ({\r\n ...theme.typography.h2,\r\n color: colors.white,\r\n marginLeft: 10,\r\n}));\r\n\r\n\r\nexport const PaymentContainer = styled('div')(() => ({\r\n display: 'flex',\r\n marginBottom: 25,\r\n flexDirection: 'column',\r\n}));\r\n\r\nexport const PaymentTitle = styled(Typography)(({ theme }) => ({\r\n ...theme.typography.h2,\r\n fontSize: 18,\r\n color: colors.white,\r\n}));\r\n\r\nexport const PaymentAmount = styled(Typography)(({ theme }) => ({\r\n ...theme.typography.h2,\r\n fontSize: 18,\r\n color: colors.primaryOrange,\r\n}));","/**\n * Days in 1 week.\n *\n * @name daysInWeek\n * @constant\n * @type {number}\n * @default\n */\nexport var daysInWeek = 7;\n/**\n * Days in 1 year\n * One years equals 365.2425 days according to the formula:\n *\n * > Leap year occures every 4 years, except for years that are divisable by 100 and not divisable by 400.\n * > 1 mean year = (365+1/4-1/100+1/400) days = 365.2425 days\n *\n * @name daysInYear\n * @constant\n * @type {number}\n * @default\n */\n\nexport var daysInYear = 365.2425;\n/**\n * Maximum allowed time.\n *\n * @name maxTime\n * @constant\n * @type {number}\n * @default\n */\n\nexport var maxTime = Math.pow(10, 8) * 24 * 60 * 60 * 1000;\n/**\n * Milliseconds in 1 minute\n *\n * @name millisecondsInMinute\n * @constant\n * @type {number}\n * @default\n */\n\nexport var millisecondsInMinute = 60000;\n/**\n * Milliseconds in 1 hour\n *\n * @name millisecondsInHour\n * @constant\n * @type {number}\n * @default\n */\n\nexport var millisecondsInHour = 3600000;\n/**\n * Milliseconds in 1 second\n *\n * @name millisecondsInSecond\n * @constant\n * @type {number}\n * @default\n */\n\nexport var millisecondsInSecond = 1000;\n/**\n * Minimum allowed time.\n *\n * @name minTime\n * @constant\n * @type {number}\n * @default\n */\n\nexport var minTime = -maxTime;\n/**\n * Minutes in 1 hour\n *\n * @name minutesInHour\n * @constant\n * @type {number}\n * @default\n */\n\nexport var minutesInHour = 60;\n/**\n * Months in 1 quarter\n *\n * @name monthsInQuarter\n * @constant\n * @type {number}\n * @default\n */\n\nexport var monthsInQuarter = 3;\n/**\n * Months in 1 year\n *\n * @name monthsInYear\n * @constant\n * @type {number}\n * @default\n */\n\nexport var monthsInYear = 12;\n/**\n * Quarters in 1 year\n *\n * @name quartersInYear\n * @constant\n * @type {number}\n * @default\n */\n\nexport var quartersInYear = 4;\n/**\n * Seconds in 1 hour\n *\n * @name secondsInHour\n * @constant\n * @type {number}\n * @default\n */\n\nexport var secondsInHour = 3600;\n/**\n * Seconds in 1 minute\n *\n * @name secondsInMinute\n * @constant\n * @type {number}\n * @default\n */\n\nexport var secondsInMinute = 60;\n/**\n * Seconds in 1 day\n *\n * @name secondsInDay\n * @constant\n * @type {number}\n * @default\n */\n\nexport var secondsInDay = secondsInHour * 24;\n/**\n * Seconds in 1 week\n *\n * @name secondsInWeek\n * @constant\n * @type {number}\n * @default\n */\n\nexport var secondsInWeek = secondsInDay * 7;\n/**\n * Seconds in 1 year\n *\n * @name secondsInYear\n * @constant\n * @type {number}\n * @default\n */\n\nexport var secondsInYear = secondsInDay * daysInYear;\n/**\n * Seconds in 1 month\n *\n * @name secondsInMonth\n * @constant\n * @type {number}\n * @default\n */\n\nexport var secondsInMonth = secondsInYear / 12;\n/**\n * Seconds in 1 quarter\n *\n * @name secondsInQuarter\n * @constant\n * @type {number}\n * @default\n */\n\nexport var secondsInQuarter = secondsInMonth * 3;","export default function requiredArgs(required, args) {\n if (args.length < required) {\n throw new TypeError(required + ' argument' + (required > 1 ? 's' : '') + ' required, but only ' + args.length + ' present');\n }\n}","function _typeof(obj) { \"@babel/helpers - typeof\"; if (typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }; } return _typeof(obj); }\n\nimport requiredArgs from \"../_lib/requiredArgs/index.js\";\n/**\n * @name toDate\n * @category Common Helpers\n * @summary Convert the given argument to an instance of Date.\n *\n * @description\n * Convert the given argument to an instance of Date.\n *\n * If the argument is an instance of Date, the function returns its clone.\n *\n * If the argument is a number, it is treated as a timestamp.\n *\n * If the argument is none of the above, the function returns Invalid Date.\n *\n * **Note**: *all* Date arguments passed to any *date-fns* function is processed by `toDate`.\n *\n * @param {Date|Number} argument - the value to convert\n * @returns {Date} the parsed date in the local time zone\n * @throws {TypeError} 1 argument required\n *\n * @example\n * // Clone the date:\n * const result = toDate(new Date(2014, 1, 11, 11, 30, 30))\n * //=> Tue Feb 11 2014 11:30:30\n *\n * @example\n * // Convert the timestamp to date:\n * const result = toDate(1392098430000)\n * //=> Tue Feb 11 2014 11:30:30\n */\n\nexport default function toDate(argument) {\n requiredArgs(1, arguments);\n var argStr = Object.prototype.toString.call(argument); // Clone the date\n\n if (argument instanceof Date || _typeof(argument) === 'object' && argStr === '[object Date]') {\n // Prevent the date to lose the milliseconds when passed to new Date() in IE10\n return new Date(argument.getTime());\n } else if (typeof argument === 'number' || argStr === '[object Number]') {\n return new Date(argument);\n } else {\n if ((typeof argument === 'string' || argStr === '[object String]') && typeof console !== 'undefined') {\n // eslint-disable-next-line no-console\n console.warn(\"Starting with v2.0.0-beta.1 date-fns doesn't accept strings as date arguments. Please use `parseISO` to parse strings. See: https://github.com/date-fns/date-fns/blob/master/docs/upgradeGuide.md#string-arguments\"); // eslint-disable-next-line no-console\n\n console.warn(new Error().stack);\n }\n\n return new Date(NaN);\n }\n}","import toDate from \"../toDate/index.js\";\nimport requiredArgs from \"../_lib/requiredArgs/index.js\";\n/**\n * @name differenceInMilliseconds\n * @category Millisecond Helpers\n * @summary Get the number of milliseconds between the given dates.\n *\n * @description\n * Get the number of milliseconds between the given dates.\n *\n * @param {Date|Number} dateLeft - the later date\n * @param {Date|Number} dateRight - the earlier date\n * @returns {Number} the number of milliseconds\n * @throws {TypeError} 2 arguments required\n *\n * @example\n * // How many milliseconds are between\n * // 2 July 2014 12:30:20.600 and 2 July 2014 12:30:21.700?\n * const result = differenceInMilliseconds(\n * new Date(2014, 6, 2, 12, 30, 21, 700),\n * new Date(2014, 6, 2, 12, 30, 20, 600)\n * )\n * //=> 1100\n */\n\nexport default function differenceInMilliseconds(dateLeft, dateRight) {\n requiredArgs(2, arguments);\n return toDate(dateLeft).getTime() - toDate(dateRight).getTime();\n}","var roundingMap = {\n ceil: Math.ceil,\n round: Math.round,\n floor: Math.floor,\n trunc: function trunc(value) {\n return value < 0 ? Math.ceil(value) : Math.floor(value);\n } // Math.trunc is not supported by IE\n\n};\nvar defaultRoundingMethod = 'trunc';\nexport function getRoundingMethod(method) {\n return method ? roundingMap[method] : roundingMap[defaultRoundingMethod];\n}","import { millisecondsInHour } from \"../constants/index.js\";\nimport differenceInMilliseconds from \"../differenceInMilliseconds/index.js\";\nimport requiredArgs from \"../_lib/requiredArgs/index.js\";\nimport { getRoundingMethod } from \"../_lib/roundingMethods/index.js\";\n/**\n * @name differenceInHours\n * @category Hour Helpers\n * @summary Get the number of hours between the given dates.\n *\n * @description\n * Get the number of hours between the given dates.\n *\n * @param {Date|Number} dateLeft - the later date\n * @param {Date|Number} dateRight - the earlier date\n * @param {Object} [options] - an object with options.\n * @param {String} [options.roundingMethod='trunc'] - a rounding method (`ceil`, `floor`, `round` or `trunc`)\n * @returns {Number} the number of hours\n * @throws {TypeError} 2 arguments required\n *\n * @example\n * // How many hours are between 2 July 2014 06:50:00 and 2 July 2014 19:00:00?\n * const result = differenceInHours(\n * new Date(2014, 6, 2, 19, 0),\n * new Date(2014, 6, 2, 6, 50)\n * )\n * //=> 12\n */\n\nexport default function differenceInHours(dateLeft, dateRight, options) {\n requiredArgs(2, arguments);\n var diff = differenceInMilliseconds(dateLeft, dateRight) / millisecondsInHour;\n return getRoundingMethod(options === null || options === void 0 ? void 0 : options.roundingMethod)(diff);\n}","export const currencyCodeToSymbol = (currenyCode) => {\r\n switch (currenyCode) {\r\n case 'eur':\r\n return '€';\r\n case 'usd':\r\n return '$';\r\n default:\r\n return '£';\r\n };\r\n}\r\n","import differenceInHours from 'date-fns/differenceInHours';\r\nimport { getProducts, createSubscription } from '../../api';\r\n\r\nimport { currencyCodeToSymbol } from './currencyHelper';\r\n\r\nexport const hasActiveEliteLicence = (subscriptions, stripeProducts) =>\r\n{\r\n const stripeProduct = stripeProducts?.data?.products.find(product => product?.metadata?.LicenseId === 'elite');\r\n const eliteSubscription = subscriptions[0].data.find((subscription) => subscription.plan.product === stripeProduct.id && subscription.status === 'active')\r\n return !!eliteSubscription;\r\n}\r\n\r\n\r\n// Return client secret and price of subscription...s\r\nexport const setupSubscriptionHelper = async (licenceId, billingPeriod, quantity) =>\r\n{\r\n const stripeProducts = await getProducts();\r\n\r\n if (!stripeProducts?.data || !stripeProducts?.data.products || !stripeProducts?.data.products.length ||\r\n !stripeProducts?.data.prices || !stripeProducts?.data.prices.length)\r\n {\r\n return;\r\n }\r\n\r\n const stripeProduct = stripeProducts?.data?.products.find(product => product?.metadata?.LicenseId === licenceId);\r\n if (!stripeProduct)\r\n {\r\n return;\r\n }\r\n const subscriptionProduct = stripeProducts?.data?.prices.find(\r\n (price) => price.product === stripeProduct.id && price.recurring.interval === billingPeriod)\r\n const subscriptionProductId = subscriptionProduct.id;\r\n const subscriptionTokens = JSON.parse(localStorage.getItem('subscriptionTokens')) || [];\r\n // Check to see if there is an existing subscription token for this product that we can use\r\n // This is to reduce the amount of incomplete subscriptions created\r\n // Note the subscription token expires after 23 hours so we need to check the createdTimestamp\r\n\r\n const validSubscriptionTokens = subscriptionTokens.filter((token) => differenceInHours(new Date(), new Date(token.createdTimestamp)) < 23);\r\n if (validSubscriptionTokens && validSubscriptionTokens.length)\r\n {\r\n const existingToken = validSubscriptionTokens.find((token) => token.productId === subscriptionProductId);\r\n if (existingToken && existingToken.clientSecret)\r\n {\r\n // setClientSecret(existingToken.clientSecret);\r\n // setSubsriptionPrice(existingToken.subscriptionPrice ? existingToken.subscriptionPrice : undefined);\r\n // setLoading(false);\r\n return {\r\n clientSecret: existingToken.clientSecret,\r\n subscriptionPrice: existingToken.subscriptionPrice ? existingToken.subscriptionPrice : undefined,\r\n }\r\n }\r\n }\r\n\r\n // No existing tokens for this priceId so we need to create a new secret here (and store it in localstorage for if they\r\n // close the modal and open it again)\r\n const subscribeResponse = await createSubscription(subscriptionProductId);\r\n if (subscribeResponse && subscribeResponse.data && subscribeResponse.data.paymentIntent)\r\n {\r\n const clientSecret = subscribeResponse.data.paymentIntent.client_secret;\r\n const subscriptionPrice = `${currencyCodeToSymbol(subscribeResponse.data.paymentIntent.currency)}${subscribeResponse.data.paymentIntent.amount / 100}`;\r\n validSubscriptionTokens.push({\r\n productId: subscriptionProductId,\r\n subscriptionId: subscribeResponse.data.subscriptionId,\r\n clientSecret,\r\n subscriptionPrice,\r\n createdTimestamp: new Date().getTime(),\r\n });\r\n localStorage.setItem('subscriptionTokens', JSON.stringify(validSubscriptionTokens));\r\n return {\r\n clientSecret: clientSecret,\r\n subscriptionPrice: subscriptionPrice,\r\n }\r\n }\r\n}\r\n\r\nexport const getSpecificLicences = (licences, licenceCode) =>\r\n{\r\n return licences.filter((licence) => licence.code === licenceCode);\r\n}\r\n\r\nexport const getSubscriptionPrice = (stripeProducts, licenceId, billingPeriod) =>\r\n{\r\n // const stripeProduct = stripeProducts?.data?.products.find(product => product?.metadata?.LicenseId === licenceId);\r\n const product = stripeProducts.products.find((product) => product.metadata?.LicenseId === licenceId);\r\n if (product)\r\n {\r\n const price = stripeProducts.prices.find((price) =>\r\n {\r\n return price.product === product.id && price.recurring.interval === billingPeriod;\r\n });\r\n return {\r\n formatted: `${currencyCodeToSymbol(price.currency)}${price.unit_amount / 100}.00`,\r\n price: price.unit_amount / 100,\r\n currencySymbol: currencyCodeToSymbol(price.currency),\r\n };\r\n }\r\n return false;\r\n};\r\n","import {useEffect, useState} from 'react';\r\nimport {useStripe, useElements} from '@stripe/react-stripe-js';\r\nimport {\r\n Container,\r\n ContentContainer,\r\n SubscriptionDetailsContainer,\r\n Form,\r\n FormContainer,\r\n InputRow,\r\n InputColumn,\r\n StripeInputWrapper,\r\n InputWrapper,\r\n InputSpacing,\r\n FeatureLinesContainer,\r\n IconAvatarContainer,\r\n SubscriptionTitle,\r\n PaymentContainer,\r\n PaymentTitle,\r\n PaymentAmount\r\n} from './CheckoutForm.styles';\r\nimport IconAvatar from '../../Avatars/IconAvatar/IconAvatar';\r\nimport FeatureLine from '../../Typography/FeatureLine/FeatureLine';\r\nimport {colors} from '../../../options/colors';\r\nimport Label from '../../Typography/Label/Label';\r\nimport FieldError\r\n from '../../Inputs/FieldError/FieldError';\r\nimport SolidButton from '../../Buttons/SolidButton/SolidButton';\r\nimport SectionSpinner from '../../Loading/SectionSpinner/SectionSpinner';\r\nimport {routes} from '../../../options/routes';\r\nimport { getSubscriptionPrice } from '../../../utils/helpers/subscriptionsHelper';\r\n\r\nconst fieldOptions = {\r\n style: {\r\n base: {\r\n iconColor: colors.primaryGreen,\r\n color: colors.white,\r\n fontWeight: '500',\r\n fontFamily: 'GraphikRegular, sans-serif',\r\n fontSize: '16px',\r\n fontSmoothing: 'antialiased',\r\n lineHeight: '46px',\r\n },\r\n invalid: {\r\n iconColor: colors.secondaryRed,\r\n color: colors.secondaryRed,\r\n },\r\n },\r\n};\r\n\r\n// const returnURL = `http://localhost:3000${routes.adminProducts}`\r\nconst returnURL = `https://rezzil-portal.test-link.co.uk${routes.adminProducts}/checkoutRedirect`\r\n\r\nconst CheckoutForm = ({ clientSecret, licence, paymentAmount, stripeProducts }) => {\r\n const stripe = useStripe();\r\n const elements = useElements();\r\n const [processing, setProcessing] = useState(false);\r\n const [cardNumberError, setCardNumberError] = useState();\r\n const [cardExpiryError, setCardExpiryError] = useState();\r\n const [cardCVCError, setCardCVCError] = useState();\r\n const [miscCheckoutError, setMiscCheckoutError] = useState();\r\n\r\n useEffect(() => {\r\n const cardNumberElement = elements?.create(\"cardNumber\", fieldOptions);\r\n const cardExpiryElement = elements?.create(\"cardExpiry\", fieldOptions);\r\n const cardCvvElement = elements?.create(\"cardCvc\", fieldOptions);\r\n\r\n cardNumberElement?.mount(\"#card-number-element\");\r\n cardExpiryElement?.mount(\"#card-expiry-element\");\r\n cardCvvElement?.mount(\"#card-cvv-element\");\r\n }, [elements]);\r\n\r\n const handleSubmit = async (event) => {\r\n event.preventDefault();\r\n\r\n if (!stripe || !elements || processing) {\r\n // Stripe.js has not yet loaded.\r\n return;\r\n }\r\n setProcessing(true);\r\n\r\n setCardNumberError('');\r\n setCardCVCError('');\r\n setCardExpiryError('');\r\n setMiscCheckoutError('');\r\n\r\n try {\r\n const result = await stripe.confirmCardPayment(\r\n clientSecret,\r\n {\r\n return_url: returnURL,\r\n payment_method: {\r\n card: elements.getElement('cardNumber'),\r\n },\r\n // setup_future_usage: 'off_session', // Use this for saving the card for later\r\n }\r\n )\r\n\r\n if (result.error) {\r\n // Show error to customer (for example, payment details incomplete)\r\n /*\r\n {\r\n \"invalid_number\": \"The card number is not a valid credit card number\",\r\n \"invalid_expiry_month\": \"The card’s expiration month is invalid\",\r\n \"invalid_expiry_year\": \"The card’s expiration year is invalid\",\r\n \"invalid_cvc\": \"The card’s security code is invalid\",\r\n \"incorrect_number\": \"The card number is incorrect\",\r\n \"incomplete_number\": \"The card number is incomplete\",\r\n \"incomplete_cvc\": \"The card’s security code is incomplete\",\r\n \"incomplete_expiry\": \"The card’s expiration date is incomplete\",\r\n \"expired_card\": \"The card has expired\",\r\n \"incorrect_cvc\": \"The card’s security code is incorrect\",\r\n \"incorrect_zip\": \"The card’s zip code failed validation\",\r\n \"invalid_expiry_year_past\": \"The card’s expiration year is in the past\",\r\n \"card_declined\": \"The card was declined\",\r\n \"missing\": \"There is no card on a customer that is being charged\",\r\n \"processing_error\": \"An error occurred while processing the card\"\r\n }\r\n */\r\n switch (result.error?.code) {\r\n case 'invalid_number':\r\n case 'incorrect_number':\r\n case 'incomplete_number':\r\n setCardNumberError(result.error.message);\r\n break;\r\n case 'incomplete_expiry':\r\n case 'invalid_expiry_month':\r\n case 'invalid_expiry_year':\r\n case 'invalid_expiry_year_past':\r\n setCardExpiryError(result.error.message);\r\n break;\r\n case 'invalid_cvc':\r\n case 'incomplete_cvc':\r\n case 'incorrect_cvc':\r\n setCardCVCError(result.error.message);\r\n break;\r\n default:\r\n console.log('Unknown / Misc error code:')\r\n console.log(result.error)\r\n if (result.error.message) {\r\n setMiscCheckoutError(result.error.message);\r\n }\r\n }\r\n console.log(result.error.message);\r\n } else if (result.paymentIntent?.status === 'succeeded') {\r\n const subscriptionTokens = JSON.parse(localStorage.getItem('subscriptionTokens')) || [];\r\n if (subscriptionTokens && subscriptionTokens.length) {\r\n // Remove subscription local storage for subscription that has just been used\r\n const existingTokens = subscriptionTokens.filter((token) => token.clientSecret !== clientSecret);\r\n localStorage.setItem('subscriptionTokens', JSON.stringify(existingTokens));\r\n }\r\n\r\n window.location.href = `${returnURL}/#checkout-complete`;\r\n // Customer will be redirected to your `return_url`. For some payment\r\n // methods like iDEAL, your customer will be redirected to an intermediate\r\n // site first to authorize the payment, then redirected to the `return_url`.\r\n }\r\n setProcessing(false);\r\n } catch (error) {\r\n console.log('Unknown checkout error:');\r\n console.log(error);\r\n setProcessing(false);\r\n }\r\n }\r\n\r\n return (\r\n \r\n {!stripe || !elements ?\r\n :\r\n \r\n \r\n {\r\n paymentAmount &&\r\n \r\n Total Payment\r\n {paymentAmount}\r\n \r\n }\r\n \r\n \r\n {licence.shortTitle}\r\n \r\n\r\n {\r\n licence.features && licence.features.map(feature => (\r\n \r\n \r\n \r\n ))\r\n }\r\n \r\n \r\n \r\n \r\n \r\n }\r\n \r\n );\r\n};\r\n\r\nexport default CheckoutForm;\r\n","import generateUtilityClasses from '@mui/utils/generateUtilityClasses';\nimport generateUtilityClass from '@mui/utils/generateUtilityClass';\nexport function getDividerUtilityClass(slot) {\n return generateUtilityClass('MuiDivider', slot);\n}\nconst dividerClasses = generateUtilityClasses('MuiDivider', ['root', 'absolute', 'fullWidth', 'inset', 'middle', 'flexItem', 'light', 'vertical', 'withChildren', 'withChildrenVertical', 'textAlignRight', 'textAlignLeft', 'wrapper', 'wrapperVertical']);\nexport default dividerClasses;","import generateUtilityClasses from '@mui/utils/generateUtilityClasses';\nimport generateUtilityClass from '@mui/utils/generateUtilityClass';\nexport function getListItemIconUtilityClass(slot) {\n return generateUtilityClass('MuiListItemIcon', slot);\n}\nconst listItemIconClasses = generateUtilityClasses('MuiListItemIcon', ['root', 'alignItemsFlexStart']);\nexport default listItemIconClasses;","import generateUtilityClasses from '@mui/utils/generateUtilityClasses';\nimport generateUtilityClass from '@mui/utils/generateUtilityClass';\nexport function getListItemTextUtilityClass(slot) {\n return generateUtilityClass('MuiListItemText', slot);\n}\nconst listItemTextClasses = generateUtilityClasses('MuiListItemText', ['root', 'multiline', 'dense', 'inset', 'primary', 'secondary']);\nexport default listItemTextClasses;","import generateUtilityClasses from '@mui/utils/generateUtilityClasses';\nimport generateUtilityClass from '@mui/utils/generateUtilityClass';\nexport function getMenuItemUtilityClass(slot) {\n return generateUtilityClass('MuiMenuItem', slot);\n}\nconst menuItemClasses = generateUtilityClasses('MuiMenuItem', ['root', 'focusVisible', 'dense', 'disabled', 'divider', 'gutters', 'selected']);\nexport default menuItemClasses;","'use client';\n\nimport _objectWithoutPropertiesLoose from \"@babel/runtime/helpers/esm/objectWithoutPropertiesLoose\";\nimport _extends from \"@babel/runtime/helpers/esm/extends\";\nconst _excluded = [\"autoFocus\", \"component\", \"dense\", \"divider\", \"disableGutters\", \"focusVisibleClassName\", \"role\", \"tabIndex\", \"className\"];\nimport * as React from 'react';\nimport PropTypes from 'prop-types';\nimport clsx from 'clsx';\nimport composeClasses from '@mui/utils/composeClasses';\nimport { alpha } from '@mui/system/colorManipulator';\nimport styled, { rootShouldForwardProp } from '../styles/styled';\nimport useThemeProps from '../styles/useThemeProps';\nimport ListContext from '../List/ListContext';\nimport ButtonBase from '../ButtonBase';\nimport useEnhancedEffect from '../utils/useEnhancedEffect';\nimport useForkRef from '../utils/useForkRef';\nimport { dividerClasses } from '../Divider';\nimport { listItemIconClasses } from '../ListItemIcon';\nimport { listItemTextClasses } from '../ListItemText';\nimport menuItemClasses, { getMenuItemUtilityClass } from './menuItemClasses';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport const overridesResolver = (props, styles) => {\n const {\n ownerState\n } = props;\n return [styles.root, ownerState.dense && styles.dense, ownerState.divider && styles.divider, !ownerState.disableGutters && styles.gutters];\n};\nconst useUtilityClasses = ownerState => {\n const {\n disabled,\n dense,\n divider,\n disableGutters,\n selected,\n classes\n } = ownerState;\n const slots = {\n root: ['root', dense && 'dense', disabled && 'disabled', !disableGutters && 'gutters', divider && 'divider', selected && 'selected']\n };\n const composedClasses = composeClasses(slots, getMenuItemUtilityClass, classes);\n return _extends({}, classes, composedClasses);\n};\nconst MenuItemRoot = styled(ButtonBase, {\n shouldForwardProp: prop => rootShouldForwardProp(prop) || prop === 'classes',\n name: 'MuiMenuItem',\n slot: 'Root',\n overridesResolver\n})(({\n theme,\n ownerState\n}) => _extends({}, theme.typography.body1, {\n display: 'flex',\n justifyContent: 'flex-start',\n alignItems: 'center',\n position: 'relative',\n textDecoration: 'none',\n minHeight: 48,\n paddingTop: 6,\n paddingBottom: 6,\n boxSizing: 'border-box',\n whiteSpace: 'nowrap'\n}, !ownerState.disableGutters && {\n paddingLeft: 16,\n paddingRight: 16\n}, ownerState.divider && {\n borderBottom: `1px solid ${(theme.vars || theme).palette.divider}`,\n backgroundClip: 'padding-box'\n}, {\n '&:hover': {\n textDecoration: 'none',\n backgroundColor: (theme.vars || theme).palette.action.hover,\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n backgroundColor: 'transparent'\n }\n },\n [`&.${menuItemClasses.selected}`]: {\n backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / ${theme.vars.palette.action.selectedOpacity})` : alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity),\n [`&.${menuItemClasses.focusVisible}`]: {\n backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / calc(${theme.vars.palette.action.selectedOpacity} + ${theme.vars.palette.action.focusOpacity}))` : alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity + theme.palette.action.focusOpacity)\n }\n },\n [`&.${menuItemClasses.selected}:hover`]: {\n backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / calc(${theme.vars.palette.action.selectedOpacity} + ${theme.vars.palette.action.hoverOpacity}))` : alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity + theme.palette.action.hoverOpacity),\n // Reset on touch devices, it doesn't add specificity\n '@media (hover: none)': {\n backgroundColor: theme.vars ? `rgba(${theme.vars.palette.primary.mainChannel} / ${theme.vars.palette.action.selectedOpacity})` : alpha(theme.palette.primary.main, theme.palette.action.selectedOpacity)\n }\n },\n [`&.${menuItemClasses.focusVisible}`]: {\n backgroundColor: (theme.vars || theme).palette.action.focus\n },\n [`&.${menuItemClasses.disabled}`]: {\n opacity: (theme.vars || theme).palette.action.disabledOpacity\n },\n [`& + .${dividerClasses.root}`]: {\n marginTop: theme.spacing(1),\n marginBottom: theme.spacing(1)\n },\n [`& + .${dividerClasses.inset}`]: {\n marginLeft: 52\n },\n [`& .${listItemTextClasses.root}`]: {\n marginTop: 0,\n marginBottom: 0\n },\n [`& .${listItemTextClasses.inset}`]: {\n paddingLeft: 36\n },\n [`& .${listItemIconClasses.root}`]: {\n minWidth: 36\n }\n}, !ownerState.dense && {\n [theme.breakpoints.up('sm')]: {\n minHeight: 'auto'\n }\n}, ownerState.dense && _extends({\n minHeight: 32,\n // https://m2.material.io/components/menus#specs > Dense\n paddingTop: 4,\n paddingBottom: 4\n}, theme.typography.body2, {\n [`& .${listItemIconClasses.root} svg`]: {\n fontSize: '1.25rem'\n }\n})));\nconst MenuItem = /*#__PURE__*/React.forwardRef(function MenuItem(inProps, ref) {\n const props = useThemeProps({\n props: inProps,\n name: 'MuiMenuItem'\n });\n const {\n autoFocus = false,\n component = 'li',\n dense = false,\n divider = false,\n disableGutters = false,\n focusVisibleClassName,\n role = 'menuitem',\n tabIndex: tabIndexProp,\n className\n } = props,\n other = _objectWithoutPropertiesLoose(props, _excluded);\n const context = React.useContext(ListContext);\n const childContext = React.useMemo(() => ({\n dense: dense || context.dense || false,\n disableGutters\n }), [context.dense, dense, disableGutters]);\n const menuItemRef = React.useRef(null);\n useEnhancedEffect(() => {\n if (autoFocus) {\n if (menuItemRef.current) {\n menuItemRef.current.focus();\n } else if (process.env.NODE_ENV !== 'production') {\n console.error('MUI: Unable to set focus to a MenuItem whose component has not been rendered.');\n }\n }\n }, [autoFocus]);\n const ownerState = _extends({}, props, {\n dense: childContext.dense,\n divider,\n disableGutters\n });\n const classes = useUtilityClasses(props);\n const handleRef = useForkRef(menuItemRef, ref);\n let tabIndex;\n if (!props.disabled) {\n tabIndex = tabIndexProp !== undefined ? tabIndexProp : -1;\n }\n return /*#__PURE__*/_jsx(ListContext.Provider, {\n value: childContext,\n children: /*#__PURE__*/_jsx(MenuItemRoot, _extends({\n ref: handleRef,\n role: role,\n tabIndex: tabIndex,\n component: component,\n focusVisibleClassName: clsx(classes.focusVisible, focusVisibleClassName),\n className: clsx(classes.root, className)\n }, other, {\n ownerState: ownerState,\n classes: classes\n }))\n });\n});\nprocess.env.NODE_ENV !== \"production\" ? MenuItem.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 * If `true`, the list item is focused during the first mount.\n * Focus will also be triggered if the value changes from false to true.\n * @default false\n */\n autoFocus: PropTypes.bool,\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 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`, compact vertical padding designed for keyboard and mouse input is used.\n * The prop defaults to the value inherited from the parent Menu component.\n * @default false\n */\n dense: PropTypes.bool,\n /**\n * @ignore\n */\n disabled: PropTypes.bool,\n /**\n * If `true`, the left and right padding is removed.\n * @default false\n */\n disableGutters: PropTypes.bool,\n /**\n * If `true`, a 1px light border is added to the bottom of the menu item.\n * @default false\n */\n divider: PropTypes.bool,\n /**\n * This prop can help identify which element has keyboard focus.\n * The class name will be applied when the element gains the focus through keyboard interaction.\n * It's a polyfill for the [CSS :focus-visible selector](https://drafts.csswg.org/selectors-4/#the-focus-visible-pseudo).\n * The rationale for using this feature [is explained here](https://github.com/WICG/focus-visible/blob/HEAD/explainer.md).\n * A [polyfill can be used](https://github.com/WICG/focus-visible) to apply a `focus-visible` class to other components\n * if needed.\n */\n focusVisibleClassName: PropTypes.string,\n /**\n * @ignore\n */\n role: PropTypes /* @typescript-to-proptypes-ignore */.string,\n /**\n * If `true`, the component is selected.\n * @default false\n */\n selected: PropTypes.bool,\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 * @default 0\n */\n tabIndex: PropTypes.number\n} : void 0;\nexport default MenuItem;","import { styled, FormControl, Select, MenuItem, Box, Autocomplete } from \"@mui/material\";\r\nimport { colors } from \"../../../options/colors\";\r\nimport { KeyboardArrowDown } from \"@mui/icons-material\";\r\n\r\nexport const Container = styled(FormControl)(() => ({\r\n width: \"100%\",\r\n}));\r\n\r\nexport const StyledSelect = styled(Select)(({ theme, value, error }) => ({\r\n ...theme.typography.body1,\r\n padding: 0,\r\n borderRadius: 5,\r\n color: value ? colors.white : colors.secondaryGrey,\r\n overflow: \"hidden\",\r\n \".MuiOutlinedInput-input\": {\r\n padding: \"15px 40px 15px 20px !important\",\r\n background: error ? colors.menuPrimaryBlack : \"transparent\",\r\n },\r\n \".MuiOutlinedInput-notchedOutline\": {\r\n padding: 0,\r\n borderColor: colors.secondaryGrey,\r\n },\r\n \"&.Mui-focused\": {\r\n \".MuiOutlinedInput-notchedOutline\": {\r\n borderColor: error\r\n ? `${colors.primaryRed} !important`\r\n : colors.secondaryGrey,\r\n borderWidth: 1,\r\n },\r\n },\r\n \"&.Mui-disabled\": {\r\n color: `${colors.disabledBlack} !important`,\r\n \".MuiSelect-icon\": {\r\n color: `${colors.disabledBlack} !important`,\r\n right: 20,\r\n },\r\n \".MuiOutlinedInput-notchedOutline\": {\r\n borderColor: `${colors.disabledBlack} !important`,\r\n borderWidth: 1,\r\n },\r\n \"&.Mui-focused\": {\r\n \".MuiOutlinedInput-notchedOutline\": {\r\n borderColor: `${colors.disabledBlack} !important`,\r\n borderWidth: 1,\r\n },\r\n },\r\n },\r\n \"&:hover\": {\r\n \".MuiOutlinedInput-notchedOutline\": {\r\n padding: 0,\r\n borderColor: error ? colors.primaryRed : colors.secondaryGrey,\r\n },\r\n },\r\n \".MuiSelect-icon\": {\r\n color: colors.secondaryGrey,\r\n right: 20,\r\n },\r\n \"& .MuiSelect-select\": {\r\n display: \"flex\",\r\n alignItems: \"center\",\r\n },\r\n}));\r\n\r\nexport const StyledAutocomplete = styled(Autocomplete)(({ theme, value, error }) => ({\r\n ...theme.typography.body1,\r\n padding: 0,\r\n borderRadius: 5,\r\n color: value ? colors.white : colors.secondaryGrey,\r\n ':hover': {\r\n 'legend':\r\n {\r\n marginLeft: \"8px\",\r\n }\r\n },\r\n\r\n \".MuiAutocomplete-endAdornment\": {\r\n right: \"0 !important\"\r\n },\r\n '.MuiInputLabel-root': {\r\n top: '-6px',\r\n },\r\n '.MuiInputLabel-shrink': {\r\n top: 0,\r\n\r\n },\r\n\r\n \".MuiOutlinedInput-input\": {\r\n paddingTop: \"0 !important\",\r\n paddingBottom: \"0 !important\",\r\n paddingLeft: \"5px !important\",\r\n\r\n background: error ? colors.menuPrimaryBlack : \"transparent\",\r\n },\r\n \".MuiOutlinedInput-notchedOutline\": {\r\n borderColor: colors.secondaryGrey,\r\n },\r\n \"&.Mui-focused\": {\r\n \".MuiOutlinedInput-notchedOutline\": {\r\n borderColor: error\r\n ? `${colors.primaryRed} !important`\r\n : colors.secondaryGrey,\r\n borderWidth: 1,\r\n },\r\n },\r\n \"&.Mui-disabled\": {\r\n color: `${colors.disabledBlack} !important`,\r\n \".MuiSelect-icon\": {\r\n color: `${colors.disabledBlack} !important`,\r\n right: 20,\r\n },\r\n \".MuiOutlinedInput-notchedOutline\": {\r\n borderColor: `${colors.disabledBlack} !important`,\r\n borderWidth: 1,\r\n },\r\n \"&.Mui-focused\": {\r\n \".MuiOutlinedInput-notchedOutline\": {\r\n borderColor: `${colors.disabledBlack} !important`,\r\n borderWidth: 1,\r\n },\r\n },\r\n },\r\n \"&:hover\": {\r\n \".MuiOutlinedInput-notchedOutline\": {\r\n padding: 0,\r\n borderColor: error ? colors.primaryRed : colors.secondaryGrey,\r\n },\r\n },\r\n \".MuiIconButton-root\": {\r\n color: colors.secondaryGrey,\r\n right: 0,\r\n },\r\n\r\n}));\r\n\r\nexport const StyledMenuItem = styled(MenuItem)(({ theme }) => ({\r\n ...theme.typography.body1,\r\n \"&.Mui-selected\": {\r\n backgroundColor: `${colors.secondaryGrey} !important`,\r\n \"&:hover\": {\r\n backgroundColor: `${colors.secondaryGrey} !important`,\r\n },\r\n },\r\n \"&:hover\": {\r\n backgroundColor: `${colors.secondaryGrey} !important`,\r\n },\r\n}));\r\nexport const StyledAutoBox = styled(Box)(({ theme }) => ({\r\n ...theme.typography.body1,\r\n \"&.Mui-selected\": {\r\n backgroundColor: `${colors.secondaryGrey} !important`,\r\n \"&:hover\": {\r\n backgroundColor: `${colors.secondaryGrey} !important`,\r\n },\r\n },\r\n \"&:hover\": {\r\n backgroundColor: `${colors.secondaryGrey} !important`,\r\n },\r\n}));\r\nexport const SelectIcon = styled(KeyboardArrowDown)(() => ({}));\r\n\r\nexport const StyledColorIcon = styled(\"div\")(({ color }) => ({\r\n height: 8,\r\n width: 8,\r\n borderRadius: 4,\r\n background: color,\r\n marginRight: 5,\r\n}));\r\n","import\r\n{\r\n Container,\r\n StyledSelect,\r\n StyledMenuItem,\r\n SelectIcon,\r\n StyledColorIcon,\r\n StyledAutoBox,\r\n StyledAutocomplete,\r\n} from \"./CustomSelect.styles\";\r\nimport FieldError from \"../FieldError/FieldError\";\r\nimport Label from \"../../Typography/Label/Label\";\r\nimport { TextField } from \"@mui/material\";\r\nimport { colors } from \"../../../options/colors\";\r\nimport theme from \"../../../theme/muiTheme\";\r\n\r\nconst nameCheck = (option, value) =>\r\n{\r\n return value === option.label\r\n}\r\nexport const CustomSelect = ({\r\n label,\r\n name,\r\n onChange,\r\n placeholder,\r\n required,\r\n value,\r\n error,\r\n options,\r\n disabled,\r\n}) =>\r\n{\r\n return (\r\n \r\n {label && }\r\n onChange(e)}\r\n displayEmpty\r\n value={value}\r\n IconComponent={SelectIcon}\r\n fullWidth\r\n selected={value}\r\n error={!!error}\r\n disabled={disabled}\r\n >\r\n {placeholder}\r\n {options &&\r\n options.map(({ value, label, color }) =>\r\n {\r\n return (\r\n \r\n {color && }\r\n {label}\r\n \r\n );\r\n })}\r\n \r\n {error && }\r\n \r\n );\r\n};\r\nexport const CustomAutoSelect = ({\r\n label,\r\n name,\r\n onChange,\r\n placeholder,\r\n required,\r\n value,\r\n error,\r\n options,\r\n disabled,\r\n}) =>\r\n{\r\n return (\r\n \r\n (\r\n \r\n )}\r\n renderOption={(props, option) => (\r\n \r\n {option.color && }\r\n {option.label}\r\n \r\n )}\r\n />\r\n {error && }\r\n \r\n );\r\n};\r\n","import {styled} from '@mui/material';\r\nimport {colors} from '../../../options/colors';\r\n\r\nexport const PriceContainer = styled('div')(() => ({\r\n display: 'flex',\r\n flexDirection: 'column',\r\n color: colors.secondaryOrange,\r\n fontSize: 30,\r\n}));\r\n\r\nexport const DisplayPrice = styled('div')(() => ({\r\n flexDirection: 'row',\r\n display: 'flex',\r\n}));\r\n\r\nexport const Pence = styled('div')(() => ({\r\n fontSize: 15,\r\n}));\r\n\r\nexport const TermCopy = styled('div')(() => ({\r\n fontSize: 12,\r\n color: colors.primaryGrey\r\n}));","import { PriceContainer, Pence, DisplayPrice, TermCopy } from './Price.styles';\r\n\r\nconst Price = ({ price, hasAsterisk, perMonth, perAnnum }) => {\r\n // split price into pounds and pence\r\n if (!price) return <>>;\r\n const [pounds, pence] = price.split('.');\r\n const showTerm = perMonth || perAnnum;\r\n return (\r\n \r\n {showTerm && From}\r\n \r\n {pounds}\r\n \r\n {pence}\r\n {hasAsterisk && '*'}\r\n \r\n \r\n {showTerm && {perMonth ? 'per month' : 'annually'}}\r\n \r\n )\r\n ;\r\n};\r\n\r\nexport default Price;","\r\nimport { styled, Typography } from '@mui/material';\r\nimport { colors } from '../../../options/colors';\r\n\r\nexport const InfoBlockContainer = styled('div')(({theme, multiline, nomargin}) => ({\r\n display: 'flex',\r\n flex: 1,\r\n marginTop: nomargin ? 0 : multiline ? 72 : 16,\r\n borderTop: `3px solid ${colors.rezzilPlayerBlue}`,\r\n marginLeft: 15,\r\n paddingTop: 24,\r\n [theme.breakpoints.down('sm')]: {\r\n display: 'none',\r\n },\r\n}));\r\n\r\nexport const Icon = styled('div')(() => ({\r\n display: 'flex',\r\n justifyContent: 'center',\r\n alignItems: 'center',\r\n backgroundColor: colors.rezzilPlayerBlue,\r\n color: colors.white,\r\n borderRadius: 25,\r\n height: 50,\r\n width: 50,\r\n}));\r\n\r\nexport const InfoText = styled(Typography)(({ theme }) => ({\r\n ...theme.typography.body1,\r\n color: colors.primaryGrey,\r\n marginBottom: 10,\r\n}));\r\n\r\nexport const InfoTextContainer = styled('div')(() => ({\r\n display: 'flex',\r\n flexDirection: 'column',\r\n marginLeft: 20,\r\n flex: 1,\r\n}));","import createSvgIcon from './utils/createSvgIcon';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M9 21c0 .55.45 1 1 1h4c.55 0 1-.45 1-1v-1H9v1zm3-19C8.14 2 5 5.14 5 9c0 2.38 1.19 4.47 3 5.74V17c0 .55.45 1 1 1h6c.55 0 1-.45 1-1v-2.26c1.81-1.27 3-3.36 3-5.74 0-3.86-3.14-7-7-7zm2.85 11.1-.85.6V16h-4v-2.3l-.85-.6C7.8 12.16 7 10.63 7 9c0-2.76 2.24-5 5-5s5 2.24 5 5c0 1.63-.8 3.16-2.15 4.1z\"\n}), 'LightbulbOutlined');","import {\r\n InfoBlockContainer,\r\n Icon,\r\n InfoText,\r\n InfoTextContainer,\r\n} from './InfoBlock.styles';\r\nimport {\r\n LightbulbOutlined\r\n} from '@mui/icons-material';\r\nconst InfoBlock = ({info, isMultiLine, noMargin}) => {\r\n return (\r\n \r\n \r\n \r\n {info.map((text) => {text})}\r\n \r\n\r\n \r\n );\r\n};\r\n\r\nexport default InfoBlock;\r\n","import createSvgIcon from './utils/createSvgIcon';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M20 6h-2.18c.11-.31.18-.65.18-1 0-1.66-1.34-3-3-3-1.05 0-1.96.54-2.5 1.35l-.5.67-.5-.68C10.96 2.54 10.05 2 9 2 7.34 2 6 3.34 6 5c0 .35.07.69.18 1H4c-1.11 0-1.99.89-1.99 2L2 19c0 1.11.89 2 2 2h16c1.11 0 2-.89 2-2V8c0-1.11-.89-2-2-2zm-5-2c.55 0 1 .45 1 1s-.45 1-1 1-1-.45-1-1 .45-1 1-1zM9 4c.55 0 1 .45 1 1s-.45 1-1 1-1-.45-1-1 .45-1 1-1zm11 15H4v-2h16v2zm0-5H4V8h5.08L7 10.83 8.62 12 12 7.4l3.38 4.6L17 10.83 14.92 8H20v6z\"\n}), 'CardGiftcardOutlined');","import createSvgIcon from './utils/createSvgIcon';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M13 3c-4.97 0-9 4.03-9 9H1l3.89 3.89.07.14L9 12H6c0-3.87 3.13-7 7-7s7 3.13 7 7-3.13 7-7 7c-1.93 0-3.68-.79-4.94-2.06l-1.42 1.42C8.27 19.99 10.51 21 13 21c4.97 0 9-4.03 9-9s-4.03-9-9-9zm-1 5v5l4.28 2.54.72-1.21-3.5-2.08V8H12z\"\n}), 'Restore');","import createSvgIcon from './utils/createSvgIcon';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M19 4h-1V2h-2v2H8V2H6v2H5c-1.11 0-1.99.9-1.99 2L3 20c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 16H5V10h14v10zm0-12H5V6h14v2zm-7 5h5v5h-5z\"\n}), 'EventOutlined');","import createSvgIcon from './utils/createSvgIcon';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default createSvgIcon([/*#__PURE__*/_jsx(\"path\", {\n d: \"M23 11.99 20.56 9.2l.34-3.69-3.61-.82L15.4 1.5 12 2.96 8.6 1.5 6.71 4.69 3.1 5.5l.34 3.7L1 11.99l2.44 2.79-.34 3.7 3.61.82 1.89 3.2 3.4-1.47 3.4 1.46 1.89-3.19 3.61-.82-.34-3.69 2.44-2.8zm-3.95 1.48-.56.65.08.85.18 1.95-1.9.43-.84.19-.44.74-.99 1.68-1.78-.77-.8-.34-.79.34-1.78.77-.99-1.67-.44-.74-.84-.19-1.9-.43.18-1.96.08-.85-.56-.65L3.67 12l1.29-1.48.56-.65-.09-.86-.18-1.94 1.9-.43.84-.19.44-.74.99-1.68 1.78.77.8.34.79-.34 1.78-.77.99 1.68.44.74.84.19 1.9.43-.18 1.95-.08.85.56.65 1.29 1.47-1.28 1.48z\"\n}, \"0\"), /*#__PURE__*/_jsx(\"path\", {\n d: \"m10.09 13.75-2.32-2.33-1.48 1.49 3.8 3.81 7.34-7.36-1.48-1.49z\"\n}, \"1\")], 'VerifiedOutlined');","export const nonCommercialFeatures = [\r\n \"FREE\",\r\n \"Single Drill\",\r\n \"1 Profile\",\r\n];\r\n\r\nexport const limitedTrialFeatures = [\r\n \"FREE for 30 days\",\r\n \"All Index Drills\",\r\n \"5 Profiles\",\r\n];\r\n\r\nexport const personalLicenseFeatures = [\r\n \"$50 per month ($500 annually)\",\r\n \"All index Drills\",\r\n \"5 Profiles\",\r\n \"Personal Portal\",\r\n \"Limited Locker\",\r\n \"Basic Support\",\r\n];\r\n\r\nexport const clubLicenseFeatures = [\r\n \"$500 per month ($5000 annually)\",\r\n \"All index Drills\",\r\n \"Unlimited Profiles\",\r\n \"Club Portal\",\r\n \"Full Locker\",\r\n \"Premium Support\",\r\n \"Batch Upload\",\r\n \"2 Add-ons Included\",\r\n];\r\n\r\nexport const eliteLicenseFeatures = [\r\n \"$1000 per month ($10000 annually)\",\r\n \"All index Drills\",\r\n \"Unlimited Profiles\",\r\n \"Elite Portal\",\r\n \"Full Locker\",\r\n \"Premium Support\",\r\n \"Batch Upload\",\r\n \"All Add-ons Included\",\r\n];\r\n","import { colors } from \"./colors\";\r\nimport\r\n{\r\n CardGiftcardOutlined,\r\n // HistoryOutlined,\r\n EventOutlined,\r\n Restore,\r\n Verified,\r\n VerifiedOutlined,\r\n} from \"@mui/icons-material\";\r\nimport\r\n{\r\n subscriptionAnnualFeatures,\r\n subscriptionMonthlyFeatures,\r\n nonCommercialFeatures,\r\n personalLicenseFeatures,\r\n clubLicenseFeatures,\r\n limitedTrialFeatures,\r\n} from \"./features\";\r\n\r\nexport const licenceTypes = {\r\n nonCommercial: \"Non Commercial\",\r\n trial: \"Limited Trial\",\r\n clubSub: \"Club Subscription\",\r\n personalSub: \"Personal Subscription\",\r\n};\r\n\r\nexport const licenceHandles = {\r\n nonCommercial: \"Non Commercial\",\r\n trial: \"Limited Trial\",\r\n index_personal_year: \"Annual Personal Subscription\",\r\n index_personal_month: \"Monthly Personal Subscription\",\r\n index_club_year: \"Annual Club Subscription\",\r\n index_club_month: \"Monthly Club Subscription\",\r\n index_elite_month: \"Monthly Elite Subscription\",\r\n index_elite_year: \"Annual Elite Subscription\",\r\n personalSub: \"Personal Subscription\",\r\n squadsPro: \"squadspro Subscription\"\r\n};\r\nexport const licencePeriods = {\r\n annually: {\r\n stripe: \"year\",\r\n cms: 'year',\r\n display: \"Annual\",\r\n },\r\n monthly: {\r\n stripe: \"Monthly\",\r\n cms: 'month',\r\n display: \"Monthly\",\r\n },\r\n\r\n};\r\nexport const licenceOptions = [\r\n {\r\n id: 1,\r\n avatarBgColor: colors.beige,\r\n icon: ,\r\n title: licenceTypes.nonCommercial,\r\n features: nonCommercialFeatures,\r\n isRecommended: false,\r\n },\r\n {\r\n id: 8,\r\n avatarBgColor: colors.secondaryPurple,\r\n icon: ,\r\n title: licenceTypes.trial,\r\n shortTitle: \"Limited Trial\",\r\n features: limitedTrialFeatures,\r\n isRecommended: false,\r\n licenceId: \"trial_index_personal\",\r\n },\r\n {\r\n id: 3,\r\n avatarBgColor: colors.secondaryOrange,\r\n icon: ,\r\n title: licenceTypes.personalSub,\r\n shortTitle: \"Personal\",\r\n features: personalLicenseFeatures,\r\n isRecommended: false,\r\n licenceId: \"index-personal\",\r\n },\r\n {\r\n id: 5,\r\n avatarBgColor: colors.primaryOrange,\r\n icon: ,\r\n title: licenceTypes.clubSub,\r\n shortTitle: \"Club\",\r\n features: clubLicenseFeatures,\r\n isRecommended: true,\r\n licenceId: \"index-club\",\r\n },\r\n];\r\n\r\nexport const rezzilPlayerLicenceOptions = [\r\n {\r\n id: 1,\r\n avatarBgColor: colors.secondaryOrange,\r\n icon: ,\r\n title: licenceTypes.monthlySub,\r\n features: [],\r\n isRecommended: false,\r\n licenceId: \"squadspro\",\r\n billingPeriod: \"month\",\r\n },\r\n {\r\n id: 2,\r\n avatarBgColor: colors.primaryOrange,\r\n icon: ,\r\n title: licenceTypes.annualSub,\r\n features: [],\r\n isRecommended: true,\r\n licenceId: \"squadspro\",\r\n billingPeriod: \"year\",\r\n },\r\n];\r\n","import {\r\n styled,\r\n Typography\r\n} from '@mui/material';\r\nimport {colors} from '../../../options/colors';\r\n\r\nexport const Container = styled('div')(({ theme }) => ({\r\n display: 'flex',\r\n flexDirection: 'column',\r\n justifyContent: 'space-between',\r\n alignItems: 'stretch',\r\n}));\r\n\r\nexport const LicenceContainer = styled('div')(({ theme }) => ({\r\n '.MuiPaper-root': {\r\n backgroundColor: 'green',\r\n width: 215,\r\n background: 'rgba(255, 255, 255, 0.05)',\r\n // opacity: '0.05',\r\n padding: '20px 20px 25px 20px',\r\n margin: '30px 0 0 0',\r\n [theme.breakpoints.down('sm')]: {\r\n width: '100%',\r\n },\r\n },\r\n '.MuiCardActions-root': {\r\n marginTop: 0,\r\n },\r\n display: 'flex',\r\n justifyContent: 'space-between',\r\n marginBottom: 10,\r\n [theme.breakpoints.down('sm')]: {\r\n flexDirection: 'column',\r\n }\r\n\r\n}));\r\n\r\nexport const PricePerLicence = styled('div')(() => ({\r\n fontSize: 12,\r\n color: colors.primaryGrey,\r\n marginBottom: 10,\r\n}));\r\n\r\nexport const SelectContainer = styled('div')(() => ({\r\n display: 'flex',\r\n flexDirection: 'column',\r\n width: 255,\r\n}));\r\n\r\nexport const RowContainer = styled('div')(() => ({\r\n display: 'flex',\r\n flexDirection: 'row',\r\n justifyContent: 'space-between',\r\n marginTop: 20,\r\n marginBottom: 20,\r\n}));\r\n\r\nexport const InfoText = styled(Typography)(({ theme }) => ({\r\n ...theme.typography.h6,\r\n marginTop: 20,\r\n}));\r\n\r\nexport const TitleText = styled(Typography)(({ theme }) => ({\r\n ...theme.typography.h2,\r\n fontSize: 18,\r\n marginBottom: 5,\r\n}));\r\n\r\nexport const CountText = styled(Typography)(({ theme }) => ({\r\n ...theme.typography.body1,\r\n color: colors.primaryGrey,\r\n}));\r\n\r\nexport const LicenceCount = styled('div')(() => ({\r\n display: 'flex',\r\n flexDirection: 'column',\r\n}));\r\n\r\nexport const LicencesContainer = styled('div')(() => ({\r\n display: 'flex',\r\n flexDirection: 'column',\r\n}))\r\n\r\n\r\n","export const squadDeviceOptions = [\r\n { value: 5, label: '5' },\r\n { value: 10, label: '10' },\r\n { value: 15, label: '15' },\r\n { value: 20, label: '20' },\r\n { value: 25, label: '25' },\r\n];\r\n\r\nexport const squadPlayerOptions = [\r\n { value: 50, label: '50' },\r\n { value: 100, label: '100' },\r\n { value: 150, label: '150' },\r\n { value: 200, label: '200' },\r\n { value: 250, label: '250' },\r\n];","import { useState, useEffect } from \"react\";\r\nimport { Elements } from \"@stripe/react-stripe-js\";\r\nimport { loadStripe } from \"@stripe/stripe-js\";\r\nimport SubscriptionCard from \"../../Cards/SubscriptionCard/SubscriptionCard\";\r\nimport CheckoutForm from \"../../Forms/CheckoutForm/CheckoutForm\";\r\nimport {CustomSelect} from \"../../Inputs/CustomSelect/CustomSelect\";\r\nimport Label from \"../../Typography/Label/Label\";\r\nimport SolidButton from \"../../Buttons/SolidButton/SolidButton\";\r\nimport Price from \"../../Typography/Price/Price\";\r\nimport InfoBlock from \"../../Blocks/InfoBlock/InfoBlock\";\r\nimport {\r\n licenceTypes,\r\n rezzilPlayerLicenceOptions,\r\n} from \"../../../options/licenceOptions\";\r\nimport {\r\n Container,\r\n PricePerLicence,\r\n LicenceContainer,\r\n SelectContainer,\r\n RowContainer,\r\n InfoText,\r\n TitleText,\r\n CountText,\r\n LicenceCount,\r\n} from \"./SubscriptionModal.styles\";\r\nimport {\r\n squadDeviceOptions,\r\n squadPlayerOptions,\r\n} from \"../../../options/squadLicenceOptions\";\r\nimport {\r\n getSubscriptionPrice,\r\n setupSubscriptionHelper,\r\n} from \"../../../utils/helpers/subscriptionsHelper\";\r\n\r\nconst SubscriptionModal = ({ numberOfExitingLicences, stripeProducts }) => {\r\n const [selectedLicence, setSelectedLicence] = useState(\r\n licenceTypes.annualSub\r\n );\r\n const [numberOfLicences, setNumberOfLicences] = useState(0);\r\n const [clientSecret, setClientSecret] = useState();\r\n const [formattedSubscriptionPrice, setFormattedSubscriptionPrice] =\r\n useState();\r\n const [subscriptionPrice, setSubsriptionPrice] = useState();\r\n const [selectedSquadDevices, setSelectedSquadDevices] = useState(5);\r\n const [selectedSquadPlayers, setSelectedSquadPlayers] = useState(50);\r\n const stripePromise = loadStripe(\r\n process.env.REACT_APP_STRIPE_PUBLISHABLE_KEY\r\n );\r\n const selectedLicenceDetails = rezzilPlayerLicenceOptions.find(\r\n (licence) => licence.title === selectedLicence\r\n );\r\n\r\n useEffect(() => {\r\n // Calculate Number of licences needed for the selected squad players and devices\r\n // 1 licence = 5 squad devices and 50 squad players\r\n const newLicencesNeeded = Math.max(\r\n selectedSquadDevices / 5,\r\n selectedSquadPlayers / 50\r\n );\r\n setNumberOfLicences(newLicencesNeeded);\r\n }, [selectedSquadPlayers, selectedSquadDevices]);\r\n\r\n useEffect(() => {\r\n const subscriptionCost = getSubscriptionPrice(\r\n stripeProducts,\r\n \"squadspro\",\r\n selectedLicenceDetails.billingPeriod\r\n );\r\n setFormattedSubscriptionPrice(\r\n `${subscriptionCost.currencySymbol}${\r\n subscriptionCost.price * numberOfLicences\r\n }`\r\n );\r\n }, [numberOfLicences, selectedLicenceDetails, stripeProducts]);\r\n\r\n const setupSubscription = async () => {\r\n try {\r\n const { clientSecret, subscriptionPrice } = await setupSubscriptionHelper(\r\n \"squadspro\",\r\n selectedLicenceDetails.billingPeriod,\r\n numberOfLicences\r\n );\r\n setSubsriptionPrice(subscriptionPrice);\r\n setClientSecret(clientSecret);\r\n // setLoading(false);\r\n } catch (error) {\r\n console.log(\"error\");\r\n console.log(error);\r\n }\r\n };\r\n\r\n return (\r\n <>\r\n {!clientSecret && (\r\n \r\n {!numberOfExitingLicences && (\r\n <>\r\n \r\n {rezzilPlayerLicenceOptions.map(\r\n ({\r\n id,\r\n avatarBgColor,\r\n icon,\r\n title,\r\n features,\r\n isRecommended,\r\n billingPeriod,\r\n licenceId,\r\n }) => (\r\n \r\n feature.replace(\r\n \"{formattedPrice}\",\r\n getSubscriptionPrice(\r\n stripeProducts,\r\n licenceId,\r\n billingPeriod\r\n ).formatted\r\n )\r\n )}\r\n isRecommended={isRecommended}\r\n onClick={() => setSelectedLicence(title)}\r\n isSelected={selectedLicence === title}\r\n />\r\n )\r\n )}\r\n \r\n * Price per licence\r\n >\r\n )}\r\n\r\n {numberOfExitingLicences && (\r\n <>\r\n \r\n \r\n Current number of licences\r\n {numberOfExitingLicences}\r\n \r\n\r\n \r\n \r\n >\r\n )}\r\n\r\n \r\n \r\n \r\n {\r\n setSelectedSquadDevices(event.target.value);\r\n setSelectedSquadPlayers(event.target.value * 10);\r\n }}\r\n value={selectedSquadDevices}\r\n options={squadDeviceOptions}\r\n />\r\n Total number of licences\r\n \r\n \r\n \r\n \r\n {\r\n setSelectedSquadPlayers(event.target.value);\r\n setSelectedSquadDevices(event.target.value / 10);\r\n }}\r\n value={selectedSquadPlayers}\r\n options={squadPlayerOptions}\r\n />\r\n Total Cost\r\n \r\n \r\n \r\n \r\n \r\n )}\r\n {clientSecret && (\r\n \r\n \r\n \r\n )}\r\n >\r\n );\r\n};\r\n\r\nexport default SubscriptionModal;\r\n","export default function toInteger(dirtyNumber) {\n if (dirtyNumber === null || dirtyNumber === true || dirtyNumber === false) {\n return NaN;\n }\n\n var number = Number(dirtyNumber);\n\n if (isNaN(number)) {\n return number;\n }\n\n return number < 0 ? Math.ceil(number) : Math.floor(number);\n}","import toDate from \"../toDate/index.js\";\nimport toInteger from \"../_lib/toInteger/index.js\";\nimport requiredArgs from \"../_lib/requiredArgs/index.js\";\n/**\n * @name fromUnixTime\n * @category Timestamp Helpers\n * @summary Create a date from a Unix timestamp.\n *\n * @description\n * Create a date from a Unix timestamp (in seconds). Decimal values will be discarded.\n *\n * @param {Number} unixTime - the given Unix timestamp (in seconds)\n * @returns {Date} the date\n * @throws {TypeError} 1 argument required\n *\n * @example\n * // Create the date 29 February 2012 11:45:05:\n * const result = fromUnixTime(1330515905)\n * //=> Wed Feb 29 2012 11:45:05\n */\n\nexport default function fromUnixTime(dirtyUnixTime) {\n requiredArgs(1, arguments);\n var unixTime = toInteger(dirtyUnixTime);\n return toDate(unixTime * 1000);\n}","import { colors } from \"./colors\";\r\n\r\n\r\nimport addonHeadersPassingImage from '../assets/images/addons/rezzil-headers-passing.png';\r\nimport addonReactionWallImage from '../assets/images/addons/rezzil-reaction-wall.png';\r\nimport addonVolleysImage from '../assets/images/addons/rezzil-volleys.png';\r\nimport addonBoardTestImage from '../assets/images/addons/rezzil-board-test.png';\r\n\r\nimport addonHeadersBundleImage from '../assets/images/addons/rezzil-headers-bundle.png';\r\nimport addonProBundleImage from '../assets/images/addons/rezzil-pro-bundle.png';\r\nimport addonHeadersControlImage from '../assets/images/addons/addon-12.png';\r\nimport addonHeadersClearingImage from '../assets/images/addons/addon-13.png';\r\n\r\nimport addonHeadersShootingImage from '../assets/images/addons/addon-15.png';\r\n\r\nimport addonHeartRateImage from '../assets/images/addons/addon-21.png';\r\nimport addonBrandPackImage from '../assets/images/addons/brand_addon.png';\r\n\r\n\r\nexport const addonOptions = [\r\n {\r\n id: 0,\r\n title: \"Headers - Control\",\r\n name: \"addon_headers_control\",\r\n type: 'individual',\r\n image: addonHeadersControlImage,\r\n description: \"Headers control is designed to perfect your ability to manipulate the direction of the ball. Aim for the centre of the hoops to score more points.\",\r\n monthlyClubPrice: \"15\",\r\n yearlyClubPrice: \"150\",\r\n monthlyPersonalPrice: \"15\",\r\n yearlyPersonalPrice: \"150\",\r\n },\r\n {\r\n id: 1,\r\n title: \"Headers - Shooting\",\r\n name: \"addon_headers_shooting\",\r\n type: 'individual',\r\n image: addonHeadersShootingImage,\r\n description: \"The shooting drill is designed to test and develop your finshing ability infront of goal. This drill will develop an accurate and powerful finish.\",\r\n monthlyClubPrice: \"15\",\r\n yearlyClubPrice: \"150\",\r\n monthlyPersonalPrice: \"15\",\r\n yearlyPersonalPrice: \"150\",\r\n },\r\n {\r\n id: 2,\r\n title: \"Headers - Clearing\",\r\n name: \"addon_headers_clearing\",\r\n type: 'individual',\r\n image: addonHeadersClearingImage,\r\n description: \"Headers clearing is designed to develop your defensive skills in a safe enviornment. For this drill, your feet and body position to head the ball are important.\",\r\n monthlyClubPrice: \"15\",\r\n yearlyClubPrice: \"150\",\r\n monthlyPersonalPrice: \"15\",\r\n yearlyPersonalPrice: \"150\",\r\n },\r\n {\r\n id: 3,\r\n title: \"Headers - Passing\",\r\n name: \"addon_headers_passing\",\r\n type: 'individual',\r\n image: addonHeadersPassingImage,\r\n description: \"Headers passing is designed to improve your ability to accurately deliver a ball to a team mate. This drill is all about controlled handling of the ball.\",\r\n monthlyClubPrice: \"15\",\r\n yearlyClubPrice: \"150\",\r\n monthlyPersonalPrice: \"15\",\r\n yearlyPersonalPrice: \"150\",\r\n }, {\r\n id: 4,\r\n title: \"Reaction Wall\",\r\n name: \"addon_reaction_wall\",\r\n type: 'individual',\r\n image: addonReactionWallImage,\r\n description: \"The reaction wall puts your reaction time, and hand eye coordination to the test. Touch as many lights that appear on the wall before the time runs out.\",\r\n monthlyClubPrice: \"15\",\r\n yearlyClubPrice: \"150\",\r\n monthlyPersonalPrice: \"10\",\r\n yearlyPersonalPrice: \"100\",\r\n }, {\r\n id: 5,\r\n title: \"Volleys\",\r\n name: \"addon_volley_rehab\",\r\n type: 'individual',\r\n image: addonVolleysImage,\r\n description: \"For this drill, just pass the oncoming ball back into the hoop. Try a variety of passes such as a simple volley, half volley, or laces.\",\r\n monthlyClubPrice: \"15\",\r\n yearlyClubPrice: \"150\",\r\n monthlyPersonalPrice: \"15\",\r\n yearlyPersonalPrice: \"150\",\r\n }, {\r\n id: 6,\r\n title: \"Board Test\",\r\n name: \"addon_board_test\",\r\n type: 'individual',\r\n image: addonBoardTestImage,\r\n description: \"The Rezzil board test is a passing drill designed to test your ability to pass and control the ball. Pass the ball between the two boards as many times as you can before the time runs out.\",\r\n monthlyClubPrice: \"15\",\r\n yearlyClubPrice: \"150\",\r\n monthlyPersonalPrice: \"15\",\r\n yearlyPersonalPrice: \"150\",\r\n },\r\n {\r\n id: 7,\r\n title: \"Heart Rate\",\r\n name: \"addon_heart_rate\",\r\n type: 'individual',\r\n image: addonHeartRateImage,\r\n description: \"A heart rate monitor is an electronic device designed to measure your heart rate during physical activity. You can monitor and measure your heart rate while playing the rezzil activites.\",\r\n monthlyClubPrice: \"15\",\r\n yearlyClubPrice: \"150\",\r\n monthlyPersonalPrice: \"15\",\r\n yearlyPersonalPrice: \"150\",\r\n },/*\r\n {\r\n id: 8,\r\n title: \"Shot Stopper\",\r\n name: \"addon_shot_stopper\",\r\n type: 'individual',\r\n image: addonHeartRateImage,\r\n description: \"\",\r\n monthlyClubPrice: \"15\",\r\n yearlyClubPrice: \"150\",\r\n monthlyPersonalPrice: \"15\",\r\n yearlyPersonalPrice: \"150\",\r\n },\r\n\r\n {\r\n id: 9,\r\n title: \"Darts\",\r\n name: \"addon_darts\",\r\n type: 'individual',\r\n image: addonHeartRateImage,\r\n description: \"\",\r\n monthlyClubPrice: \"15\",\r\n yearlyClubPrice: \"150\",\r\n monthlyPersonalPrice: \"15\",\r\n yearlyPersonalPrice: \"150\",\r\n },\r\n {\r\n id: 10,\r\n title: \"Golf\",\r\n name: \"addon_golf\",\r\n type: 'individual',\r\n image: addonHeartRateImage,\r\n description: \"\",\r\n monthlyClubPrice: \"15\",\r\n yearlyClubPrice: \"150\",\r\n monthlyPersonalPrice: \"15\",\r\n yearlyPersonalPrice: \"150\",\r\n },*/\r\n {\r\n id: 12,\r\n title: \"Brand Pack\",\r\n name: \"addon_brand_pack\",\r\n type: 'individual',\r\n image: addonBrandPackImage,\r\n description: \"Customise the environments with your own branding or adverts.\",\r\n monthlyClubPrice: \"100\",\r\n yearlyClubPrice: \"1000\",\r\n monthlyPersonalPrice: null,\r\n yearlyPersonalPrice: null,\r\n }, {\r\n id: 13,\r\n title: \"Headers Bundle\",\r\n name: \"addon_headers_bundle\",\r\n type: 'bundle',\r\n image: addonHeadersBundleImage,\r\n description: \"Get all header drills at a discount\",\r\n addons: [0, 1, 2, 3],\r\n monthlyClubPrice: \"40\",\r\n yearlyClubPrice: \"400\",\r\n monthlyPersonalPrice: \"40\",\r\n yearlyPersonalPrice: \"400\",\r\n }, {\r\n id: 14,\r\n title: \"Pro Bundle\",\r\n name: \"addon_pro_bundle\",\r\n type: 'bundle',\r\n image: addonProBundleImage,\r\n description: \"Gell all drills at a discount\",\r\n addons: [0, 1, 2, 3, 4, 5, 6, 7, 8],\r\n monthlyClubPrice: \"70\",\r\n yearlyClubPrice: \"700\",\r\n monthlyPersonalPrice: \"70\",\r\n yearlyPersonalPrice: \"700\",\r\n },\r\n];\r\n\r\nexport const addonTabs = [\r\n {\r\n id: 'individual',\r\n value: 'individual',\r\n label: 'Individual'\r\n }, {\r\n id: 'bundle',\r\n value: 'bundle',\r\n label: 'Bundles'\r\n }\r\n];\r\n\r\nexport const getOptionByName = (name) =>\r\n{\r\n let out = addonOptions.filter((e) => { return name === e.name });\r\n if (out.length === 1) { return out[0] };\r\n return false;\r\n\r\n}\r\n","import { useEffect, useState, useCallback, createContext, useContext } from 'react';\r\nimport fromUnixTime from 'date-fns/fromUnixTime'\r\nimport { BaseContext } from '../Global/BaseProvider';\r\n// API calls\r\nimport { getSubscriptions, getProducts } from '../../api';\r\nimport { currencyCodeToSymbol } from '../../utils/helpers/currencyHelper';\r\nimport { licenceHandles, licencePeriods } from '../../options/licenceOptions';\r\nimport { addonOptions } from '../../options/addonOptions';\r\n\r\nconst ProductsContext = createContext({});\r\n\r\nconst ProductsProvider = ({ children }) =>\r\n{\r\n const baseContext = useContext(BaseContext);\r\n const [productsData, setProductsData] = useState({\r\n loading: true,\r\n indexSubscriptions: [],\r\n rezzilPlayerSubscriptions: [],\r\n apiError: false,\r\n });\r\n\r\n\r\n const getProductsData = useCallback(async (clubId) =>\r\n {\r\n\r\n const lookupProductName = (id) =>\r\n {\r\n\r\n if (id)\r\n {\r\n let res;\r\n try\r\n {\r\n Object.keys(licenceHandles).forEach((info) =>\r\n {\r\n if (id === info)\r\n {\r\n res = licenceHandles[info];\r\n }\r\n }, [licenceHandles]);\r\n\r\n if (res)\r\n {\r\n return res;\r\n }\r\n\r\n res = addonOptions.find((info) =>\r\n {\r\n return 0 === id.indexOf(info.name);\r\n }, [addonOptions]);\r\n if (res)\r\n {\r\n return res.title;\r\n }\r\n } catch (e)\r\n {\r\n console.error(e);\r\n }\r\n }\r\n return 'Unknown item';\r\n }\r\n\r\n const getProductDisplayName = (id, period_end) =>\r\n {\r\n let displayName = lookupProductName(id);\r\n\r\n if (Date() > Date(period_end))\r\n {\r\n displayName += '(EXPIRED)';\r\n }\r\n return displayName;\r\n }\r\n\r\n // Only trigger API call for admin products route\r\n // Call API\r\n try\r\n {\r\n const stripeProducts = await getProducts();\r\n const subscriptionsData = await getSubscriptions(clubId);\r\n if (!subscriptionsData || !subscriptionsData.success || !subscriptionsData.data ||\r\n !stripeProducts || !stripeProducts.success || !stripeProducts.data)\r\n {\r\n setProductsData({\r\n loading: false,\r\n indexSubscriptions: [],\r\n rezzilPlayerSubscriptions: [],\r\n apiError: true,\r\n });\r\n return;\r\n }\r\n const indexSubscriptionData = [];\r\n const rezzilPlayerSubscriptionData = [];\r\n const stripeProductsData = stripeProducts.data;\r\n const squadProProduct = stripeProductsData.products.find((product) => product.metadata?.LicenseId === licenceHandles.squadsPro);\r\n const indexProduct = stripeProductsData.products.find((product) => product.metadata?.LicenseId === licenceHandles.elite);\r\n\r\n const { prices } = stripeProductsData;\r\n Object.values(subscriptionsData.data).forEach((subscriptionArr) =>\r\n {\r\n subscriptionArr.data.forEach((subscription) =>\r\n {\r\n\r\n indexSubscriptionData.push({\r\n id: subscription.id,\r\n name: getProductDisplayName(subscription.plan.metadata.license_type, subscription.current_period_end),\r\n frequency: subscription.plan.interval === licencePeriods.annually.stripe ? licencePeriods.annually.display : licencePeriods.monthly.display,\r\n nextAmount: `${currencyCodeToSymbol(subscription.plan.currency)}${subscription.plan.amount / 100}`,\r\n expires: fromUnixTime(subscription.current_period_end),\r\n autoRenew: subscription.cancel_at_period_end ? 0 : 1,\r\n changeTo: prices.find((price) => price.product === subscription.plan.product && price.id !== subscription.plan.id), // Use subscription.plan.product and stripeProducts to find the other priceId\r\n });\r\n if (subscription.status === 'active' && subscription.plan.product === indexProduct?.id)\r\n {\r\n indexSubscriptionData.push({\r\n id: subscription.id,\r\n frequency: subscription.plan.interval === licencePeriods.annually.stripe ? licencePeriods.annually.display : licencePeriods.monthly.display,\r\n nextAmount: `${currencyCodeToSymbol(subscription.plan.currency)}${subscription.plan.amount / 100}`,\r\n expires: fromUnixTime(subscription.current_period_end),\r\n autoRenew: subscription.cancel_at_period_end ? 0 : 1,\r\n changeTo: prices.find((price) => price.product === subscription.plan.product && price.id !== subscription.plan.id), // Use subscription.plan.product and stripeProducts to find the other priceId\r\n });\r\n }\r\n if (subscription.status === 'active' && subscription.plan.product === squadProProduct?.id)\r\n {\r\n rezzilPlayerSubscriptionData.push({\r\n id: subscription.id,\r\n frequency: subscription.plan.interval === licencePeriods.annually.stripe ? licencePeriods.annually.display : licencePeriods.monthly.display,\r\n nextAmount: `${currencyCodeToSymbol(subscription.plan.currency)}${subscription.plan.amount / 100}`,\r\n expires: fromUnixTime(subscription.current_period_end),\r\n autoRenew: subscription.cancel_at_period_end ? 0 : 1,\r\n changeTo: prices.find((price) => price.product === subscription.plan.product && price.id !== subscription.plan.id), // Use subscription.plan.product and stripeProducts to find the other priceId\r\n });\r\n }\r\n\r\n });\r\n });\r\n setProductsData({\r\n loading: false,\r\n indexSubscriptions: indexSubscriptionData,\r\n rezzilPlayerSubscriptions: rezzilPlayerSubscriptionData,\r\n apiError: false,\r\n products: stripeProductsData,\r\n });\r\n } catch (error)\r\n {\r\n setProductsData({\r\n loading: false,\r\n subscriptions: [],\r\n indexSubscriptions: [],\r\n rezzilPlayerSubscriptions: [],\r\n apiError: true,\r\n });\r\n }\r\n }, [licencePeriods, addonOptions]);\r\n\r\n useEffect(() =>\r\n {\r\n if (!baseContext.baseData.loading)\r\n {\r\n const { id } = baseContext.baseData.clubProfile;\r\n getProductsData(id);\r\n }\r\n }, [getProductsData, baseContext]);\r\n\r\n return (\r\n \r\n {children}\r\n \r\n );\r\n}\r\n\r\nexport { ProductsProvider, ProductsContext };\r\n\r\nexport default ProductsProvider;\r\n","function _typeof(obj) { \"@babel/helpers - typeof\"; if (typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj; }; } return _typeof(obj); }\n\nimport requiredArgs from \"../_lib/requiredArgs/index.js\";\n/**\n * @name isDate\n * @category Common Helpers\n * @summary Is the given value a date?\n *\n * @description\n * Returns true if the given value is an instance of Date. The function works for dates transferred across iframes.\n *\n * @param {*} value - the value to check\n * @returns {boolean} true if the given value is a date\n * @throws {TypeError} 1 arguments required\n *\n * @example\n * // For a valid date:\n * const result = isDate(new Date())\n * //=> true\n *\n * @example\n * // For an invalid date:\n * const result = isDate(new Date(NaN))\n * //=> true\n *\n * @example\n * // For some value:\n * const result = isDate('2014-02-31')\n * //=> false\n *\n * @example\n * // For an object:\n * const result = isDate({})\n * //=> false\n */\n\nexport default function isDate(value) {\n requiredArgs(1, arguments);\n return value instanceof Date || _typeof(value) === 'object' && Object.prototype.toString.call(value) === '[object Date]';\n}","import isDate from \"../isDate/index.js\";\nimport toDate from \"../toDate/index.js\";\nimport requiredArgs from \"../_lib/requiredArgs/index.js\";\n/**\n * @name isValid\n * @category Common Helpers\n * @summary Is the given date valid?\n *\n * @description\n * Returns false if argument is Invalid Date and true otherwise.\n * Argument is converted to Date using `toDate`. See [toDate]{@link https://date-fns.org/docs/toDate}\n * Invalid Date is a Date, whose time value is NaN.\n *\n * Time value of Date: http://es5.github.io/#x15.9.1.1\n *\n * @param {*} date - the date to check\n * @returns {Boolean} the date is valid\n * @throws {TypeError} 1 argument required\n *\n * @example\n * // For the valid date:\n * const result = isValid(new Date(2014, 1, 31))\n * //=> true\n *\n * @example\n * // For the value, convertable into a date:\n * const result = isValid(1393804800000)\n * //=> true\n *\n * @example\n * // For the invalid date:\n * const result = isValid(new Date(''))\n * //=> false\n */\n\nexport default function isValid(dirtyDate) {\n requiredArgs(1, arguments);\n\n if (!isDate(dirtyDate) && typeof dirtyDate !== 'number') {\n return false;\n }\n\n var date = toDate(dirtyDate);\n return !isNaN(Number(date));\n}","import toInteger from \"../_lib/toInteger/index.js\";\nimport toDate from \"../toDate/index.js\";\nimport requiredArgs from \"../_lib/requiredArgs/index.js\";\n/**\n * @name addMilliseconds\n * @category Millisecond Helpers\n * @summary Add the specified number of milliseconds to the given date.\n *\n * @description\n * Add the specified number of milliseconds to the given date.\n *\n * @param {Date|Number} date - the date to be changed\n * @param {Number} amount - the amount of milliseconds to be added. Positive decimals will be rounded using `Math.floor`, decimals less than zero will be rounded using `Math.ceil`.\n * @returns {Date} the new date with the milliseconds added\n * @throws {TypeError} 2 arguments required\n *\n * @example\n * // Add 750 milliseconds to 10 July 2014 12:45:30.000:\n * const result = addMilliseconds(new Date(2014, 6, 10, 12, 45, 30, 0), 750)\n * //=> Thu Jul 10 2014 12:45:30.750\n */\n\nexport default function addMilliseconds(dirtyDate, dirtyAmount) {\n requiredArgs(2, arguments);\n var timestamp = toDate(dirtyDate).getTime();\n var amount = toInteger(dirtyAmount);\n return new Date(timestamp + amount);\n}","import addMilliseconds from \"../addMilliseconds/index.js\";\nimport requiredArgs from \"../_lib/requiredArgs/index.js\";\nimport toInteger from \"../_lib/toInteger/index.js\";\n/**\n * @name subMilliseconds\n * @category Millisecond Helpers\n * @summary Subtract the specified number of milliseconds from the given date.\n *\n * @description\n * Subtract the specified number of milliseconds from the given date.\n *\n * @param {Date|Number} date - the date to be changed\n * @param {Number} amount - the amount of milliseconds to be subtracted. Positive decimals will be rounded using `Math.floor`, decimals less than zero will be rounded using `Math.ceil`.\n * @returns {Date} the new date with the milliseconds subtracted\n * @throws {TypeError} 2 arguments required\n *\n * @example\n * // Subtract 750 milliseconds from 10 July 2014 12:45:30.000:\n * const result = subMilliseconds(new Date(2014, 6, 10, 12, 45, 30, 0), 750)\n * //=> Thu Jul 10 2014 12:45:29.250\n */\n\nexport default function subMilliseconds(dirtyDate, dirtyAmount) {\n requiredArgs(2, arguments);\n var amount = toInteger(dirtyAmount);\n return addMilliseconds(dirtyDate, -amount);\n}","import toDate from \"../../toDate/index.js\";\nimport requiredArgs from \"../requiredArgs/index.js\";\nvar MILLISECONDS_IN_DAY = 86400000;\nexport default function getUTCDayOfYear(dirtyDate) {\n requiredArgs(1, arguments);\n var date = toDate(dirtyDate);\n var timestamp = date.getTime();\n date.setUTCMonth(0, 1);\n date.setUTCHours(0, 0, 0, 0);\n var startOfYearTimestamp = date.getTime();\n var difference = timestamp - startOfYearTimestamp;\n return Math.floor(difference / MILLISECONDS_IN_DAY) + 1;\n}","import toDate from \"../../toDate/index.js\";\nimport requiredArgs from \"../requiredArgs/index.js\";\nexport default function startOfUTCISOWeek(dirtyDate) {\n requiredArgs(1, arguments);\n var weekStartsOn = 1;\n var date = toDate(dirtyDate);\n var day = date.getUTCDay();\n var diff = (day < weekStartsOn ? 7 : 0) + day - weekStartsOn;\n date.setUTCDate(date.getUTCDate() - diff);\n date.setUTCHours(0, 0, 0, 0);\n return date;\n}","import toDate from \"../../toDate/index.js\";\nimport requiredArgs from \"../requiredArgs/index.js\";\nimport startOfUTCISOWeek from \"../startOfUTCISOWeek/index.js\";\nexport default function getUTCISOWeekYear(dirtyDate) {\n requiredArgs(1, arguments);\n var date = toDate(dirtyDate);\n var year = date.getUTCFullYear();\n var fourthOfJanuaryOfNextYear = new Date(0);\n fourthOfJanuaryOfNextYear.setUTCFullYear(year + 1, 0, 4);\n fourthOfJanuaryOfNextYear.setUTCHours(0, 0, 0, 0);\n var startOfNextYear = startOfUTCISOWeek(fourthOfJanuaryOfNextYear);\n var fourthOfJanuaryOfThisYear = new Date(0);\n fourthOfJanuaryOfThisYear.setUTCFullYear(year, 0, 4);\n fourthOfJanuaryOfThisYear.setUTCHours(0, 0, 0, 0);\n var startOfThisYear = startOfUTCISOWeek(fourthOfJanuaryOfThisYear);\n\n if (date.getTime() >= startOfNextYear.getTime()) {\n return year + 1;\n } else if (date.getTime() >= startOfThisYear.getTime()) {\n return year;\n } else {\n return year - 1;\n }\n}","import getUTCISOWeekYear from \"../getUTCISOWeekYear/index.js\";\nimport startOfUTCISOWeek from \"../startOfUTCISOWeek/index.js\";\nimport requiredArgs from \"../requiredArgs/index.js\";\nexport default function startOfUTCISOWeekYear(dirtyDate) {\n requiredArgs(1, arguments);\n var year = getUTCISOWeekYear(dirtyDate);\n var fourthOfJanuary = new Date(0);\n fourthOfJanuary.setUTCFullYear(year, 0, 4);\n fourthOfJanuary.setUTCHours(0, 0, 0, 0);\n var date = startOfUTCISOWeek(fourthOfJanuary);\n return date;\n}","import toDate from \"../../toDate/index.js\";\nimport startOfUTCISOWeek from \"../startOfUTCISOWeek/index.js\";\nimport startOfUTCISOWeekYear from \"../startOfUTCISOWeekYear/index.js\";\nimport requiredArgs from \"../requiredArgs/index.js\";\nvar MILLISECONDS_IN_WEEK = 604800000;\nexport default function getUTCISOWeek(dirtyDate) {\n requiredArgs(1, arguments);\n var date = toDate(dirtyDate);\n var diff = startOfUTCISOWeek(date).getTime() - startOfUTCISOWeekYear(date).getTime(); // Round the number of days to the nearest integer\n // because the number of milliseconds in a week is not constant\n // (e.g. it's different in the week of the daylight saving time clock shift)\n\n return Math.round(diff / MILLISECONDS_IN_WEEK) + 1;\n}","var defaultOptions = {};\nexport function getDefaultOptions() {\n return defaultOptions;\n}\nexport function setDefaultOptions(newOptions) {\n defaultOptions = newOptions;\n}","import toDate from \"../../toDate/index.js\";\nimport requiredArgs from \"../requiredArgs/index.js\";\nimport toInteger from \"../toInteger/index.js\";\nimport { getDefaultOptions } from \"../defaultOptions/index.js\";\nexport default function startOfUTCWeek(dirtyDate, options) {\n var _ref, _ref2, _ref3, _options$weekStartsOn, _options$locale, _options$locale$optio, _defaultOptions$local, _defaultOptions$local2;\n\n requiredArgs(1, arguments);\n var defaultOptions = getDefaultOptions();\n var weekStartsOn = toInteger((_ref = (_ref2 = (_ref3 = (_options$weekStartsOn = options === null || options === void 0 ? void 0 : options.weekStartsOn) !== null && _options$weekStartsOn !== void 0 ? _options$weekStartsOn : options === null || options === void 0 ? void 0 : (_options$locale = options.locale) === null || _options$locale === void 0 ? void 0 : (_options$locale$optio = _options$locale.options) === null || _options$locale$optio === void 0 ? void 0 : _options$locale$optio.weekStartsOn) !== null && _ref3 !== void 0 ? _ref3 : defaultOptions.weekStartsOn) !== null && _ref2 !== void 0 ? _ref2 : (_defaultOptions$local = defaultOptions.locale) === null || _defaultOptions$local === void 0 ? void 0 : (_defaultOptions$local2 = _defaultOptions$local.options) === null || _defaultOptions$local2 === void 0 ? void 0 : _defaultOptions$local2.weekStartsOn) !== null && _ref !== void 0 ? _ref : 0); // Test if weekStartsOn is between 0 and 6 _and_ is not NaN\n\n if (!(weekStartsOn >= 0 && weekStartsOn <= 6)) {\n throw new RangeError('weekStartsOn must be between 0 and 6 inclusively');\n }\n\n var date = toDate(dirtyDate);\n var day = date.getUTCDay();\n var diff = (day < weekStartsOn ? 7 : 0) + day - weekStartsOn;\n date.setUTCDate(date.getUTCDate() - diff);\n date.setUTCHours(0, 0, 0, 0);\n return date;\n}","import toDate from \"../../toDate/index.js\";\nimport requiredArgs from \"../requiredArgs/index.js\";\nimport startOfUTCWeek from \"../startOfUTCWeek/index.js\";\nimport toInteger from \"../toInteger/index.js\";\nimport { getDefaultOptions } from \"../defaultOptions/index.js\";\nexport default function getUTCWeekYear(dirtyDate, options) {\n var _ref, _ref2, _ref3, _options$firstWeekCon, _options$locale, _options$locale$optio, _defaultOptions$local, _defaultOptions$local2;\n\n requiredArgs(1, arguments);\n var date = toDate(dirtyDate);\n var year = date.getUTCFullYear();\n var defaultOptions = getDefaultOptions();\n var firstWeekContainsDate = toInteger((_ref = (_ref2 = (_ref3 = (_options$firstWeekCon = options === null || options === void 0 ? void 0 : options.firstWeekContainsDate) !== null && _options$firstWeekCon !== void 0 ? _options$firstWeekCon : options === null || options === void 0 ? void 0 : (_options$locale = options.locale) === null || _options$locale === void 0 ? void 0 : (_options$locale$optio = _options$locale.options) === null || _options$locale$optio === void 0 ? void 0 : _options$locale$optio.firstWeekContainsDate) !== null && _ref3 !== void 0 ? _ref3 : defaultOptions.firstWeekContainsDate) !== null && _ref2 !== void 0 ? _ref2 : (_defaultOptions$local = defaultOptions.locale) === null || _defaultOptions$local === void 0 ? void 0 : (_defaultOptions$local2 = _defaultOptions$local.options) === null || _defaultOptions$local2 === void 0 ? void 0 : _defaultOptions$local2.firstWeekContainsDate) !== null && _ref !== void 0 ? _ref : 1); // Test if weekStartsOn is between 1 and 7 _and_ is not NaN\n\n if (!(firstWeekContainsDate >= 1 && firstWeekContainsDate <= 7)) {\n throw new RangeError('firstWeekContainsDate must be between 1 and 7 inclusively');\n }\n\n var firstWeekOfNextYear = new Date(0);\n firstWeekOfNextYear.setUTCFullYear(year + 1, 0, firstWeekContainsDate);\n firstWeekOfNextYear.setUTCHours(0, 0, 0, 0);\n var startOfNextYear = startOfUTCWeek(firstWeekOfNextYear, options);\n var firstWeekOfThisYear = new Date(0);\n firstWeekOfThisYear.setUTCFullYear(year, 0, firstWeekContainsDate);\n firstWeekOfThisYear.setUTCHours(0, 0, 0, 0);\n var startOfThisYear = startOfUTCWeek(firstWeekOfThisYear, options);\n\n if (date.getTime() >= startOfNextYear.getTime()) {\n return year + 1;\n } else if (date.getTime() >= startOfThisYear.getTime()) {\n return year;\n } else {\n return year - 1;\n }\n}","import getUTCWeekYear from \"../getUTCWeekYear/index.js\";\nimport requiredArgs from \"../requiredArgs/index.js\";\nimport startOfUTCWeek from \"../startOfUTCWeek/index.js\";\nimport toInteger from \"../toInteger/index.js\";\nimport { getDefaultOptions } from \"../defaultOptions/index.js\";\nexport default function startOfUTCWeekYear(dirtyDate, options) {\n var _ref, _ref2, _ref3, _options$firstWeekCon, _options$locale, _options$locale$optio, _defaultOptions$local, _defaultOptions$local2;\n\n requiredArgs(1, arguments);\n var defaultOptions = getDefaultOptions();\n var firstWeekContainsDate = toInteger((_ref = (_ref2 = (_ref3 = (_options$firstWeekCon = options === null || options === void 0 ? void 0 : options.firstWeekContainsDate) !== null && _options$firstWeekCon !== void 0 ? _options$firstWeekCon : options === null || options === void 0 ? void 0 : (_options$locale = options.locale) === null || _options$locale === void 0 ? void 0 : (_options$locale$optio = _options$locale.options) === null || _options$locale$optio === void 0 ? void 0 : _options$locale$optio.firstWeekContainsDate) !== null && _ref3 !== void 0 ? _ref3 : defaultOptions.firstWeekContainsDate) !== null && _ref2 !== void 0 ? _ref2 : (_defaultOptions$local = defaultOptions.locale) === null || _defaultOptions$local === void 0 ? void 0 : (_defaultOptions$local2 = _defaultOptions$local.options) === null || _defaultOptions$local2 === void 0 ? void 0 : _defaultOptions$local2.firstWeekContainsDate) !== null && _ref !== void 0 ? _ref : 1);\n var year = getUTCWeekYear(dirtyDate, options);\n var firstWeek = new Date(0);\n firstWeek.setUTCFullYear(year, 0, firstWeekContainsDate);\n firstWeek.setUTCHours(0, 0, 0, 0);\n var date = startOfUTCWeek(firstWeek, options);\n return date;\n}","import toDate from \"../../toDate/index.js\";\nimport startOfUTCWeek from \"../startOfUTCWeek/index.js\";\nimport startOfUTCWeekYear from \"../startOfUTCWeekYear/index.js\";\nimport requiredArgs from \"../requiredArgs/index.js\";\nvar MILLISECONDS_IN_WEEK = 604800000;\nexport default function getUTCWeek(dirtyDate, options) {\n requiredArgs(1, arguments);\n var date = toDate(dirtyDate);\n var diff = startOfUTCWeek(date, options).getTime() - startOfUTCWeekYear(date, options).getTime(); // Round the number of days to the nearest integer\n // because the number of milliseconds in a week is not constant\n // (e.g. it's different in the week of the daylight saving time clock shift)\n\n return Math.round(diff / MILLISECONDS_IN_WEEK) + 1;\n}","export default function addLeadingZeros(number, targetLength) {\n var sign = number < 0 ? '-' : '';\n var output = Math.abs(number).toString();\n\n while (output.length < targetLength) {\n output = '0' + output;\n }\n\n return sign + output;\n}","import addLeadingZeros from \"../../addLeadingZeros/index.js\";\n/*\n * | | Unit | | Unit |\n * |-----|--------------------------------|-----|--------------------------------|\n * | a | AM, PM | A* | |\n * | d | Day of month | D | |\n * | h | Hour [1-12] | H | Hour [0-23] |\n * | m | Minute | M | Month |\n * | s | Second | S | Fraction of second |\n * | y | Year (abs) | Y | |\n *\n * Letters marked by * are not implemented but reserved by Unicode standard.\n */\n\nvar formatters = {\n // Year\n y: function y(date, token) {\n // From http://www.unicode.org/reports/tr35/tr35-31/tr35-dates.html#Date_Format_tokens\n // | Year | y | yy | yyy | yyyy | yyyyy |\n // |----------|-------|----|-------|-------|-------|\n // | AD 1 | 1 | 01 | 001 | 0001 | 00001 |\n // | AD 12 | 12 | 12 | 012 | 0012 | 00012 |\n // | AD 123 | 123 | 23 | 123 | 0123 | 00123 |\n // | AD 1234 | 1234 | 34 | 1234 | 1234 | 01234 |\n // | AD 12345 | 12345 | 45 | 12345 | 12345 | 12345 |\n var signedYear = date.getUTCFullYear(); // Returns 1 for 1 BC (which is year 0 in JavaScript)\n\n var year = signedYear > 0 ? signedYear : 1 - signedYear;\n return addLeadingZeros(token === 'yy' ? year % 100 : year, token.length);\n },\n // Month\n M: function M(date, token) {\n var month = date.getUTCMonth();\n return token === 'M' ? String(month + 1) : addLeadingZeros(month + 1, 2);\n },\n // Day of the month\n d: function d(date, token) {\n return addLeadingZeros(date.getUTCDate(), token.length);\n },\n // AM or PM\n a: function a(date, token) {\n var dayPeriodEnumValue = date.getUTCHours() / 12 >= 1 ? 'pm' : 'am';\n\n switch (token) {\n case 'a':\n case 'aa':\n return dayPeriodEnumValue.toUpperCase();\n\n case 'aaa':\n return dayPeriodEnumValue;\n\n case 'aaaaa':\n return dayPeriodEnumValue[0];\n\n case 'aaaa':\n default:\n return dayPeriodEnumValue === 'am' ? 'a.m.' : 'p.m.';\n }\n },\n // Hour [1-12]\n h: function h(date, token) {\n return addLeadingZeros(date.getUTCHours() % 12 || 12, token.length);\n },\n // Hour [0-23]\n H: function H(date, token) {\n return addLeadingZeros(date.getUTCHours(), token.length);\n },\n // Minute\n m: function m(date, token) {\n return addLeadingZeros(date.getUTCMinutes(), token.length);\n },\n // Second\n s: function s(date, token) {\n return addLeadingZeros(date.getUTCSeconds(), token.length);\n },\n // Fraction of second\n S: function S(date, token) {\n var numberOfDigits = token.length;\n var milliseconds = date.getUTCMilliseconds();\n var fractionalSeconds = Math.floor(milliseconds * Math.pow(10, numberOfDigits - 3));\n return addLeadingZeros(fractionalSeconds, token.length);\n }\n};\nexport default formatters;","import getUTCDayOfYear from \"../../../_lib/getUTCDayOfYear/index.js\";\nimport getUTCISOWeek from \"../../../_lib/getUTCISOWeek/index.js\";\nimport getUTCISOWeekYear from \"../../../_lib/getUTCISOWeekYear/index.js\";\nimport getUTCWeek from \"../../../_lib/getUTCWeek/index.js\";\nimport getUTCWeekYear from \"../../../_lib/getUTCWeekYear/index.js\";\nimport addLeadingZeros from \"../../addLeadingZeros/index.js\";\nimport lightFormatters from \"../lightFormatters/index.js\";\nvar dayPeriodEnum = {\n am: 'am',\n pm: 'pm',\n midnight: 'midnight',\n noon: 'noon',\n morning: 'morning',\n afternoon: 'afternoon',\n evening: 'evening',\n night: 'night'\n};\n\n/*\n * | | Unit | | Unit |\n * |-----|--------------------------------|-----|--------------------------------|\n * | a | AM, PM | A* | Milliseconds in day |\n * | b | AM, PM, noon, midnight | B | Flexible day period |\n * | c | Stand-alone local day of week | C* | Localized hour w/ day period |\n * | d | Day of month | D | Day of year |\n * | e | Local day of week | E | Day of week |\n * | f | | F* | Day of week in month |\n * | g* | Modified Julian day | G | Era |\n * | h | Hour [1-12] | H | Hour [0-23] |\n * | i! | ISO day of week | I! | ISO week of year |\n * | j* | Localized hour w/ day period | J* | Localized hour w/o day period |\n * | k | Hour [1-24] | K | Hour [0-11] |\n * | l* | (deprecated) | L | Stand-alone month |\n * | m | Minute | M | Month |\n * | n | | N | |\n * | o! | Ordinal number modifier | O | Timezone (GMT) |\n * | p! | Long localized time | P! | Long localized date |\n * | q | Stand-alone quarter | Q | Quarter |\n * | r* | Related Gregorian year | R! | ISO week-numbering year |\n * | s | Second | S | Fraction of second |\n * | t! | Seconds timestamp | T! | Milliseconds timestamp |\n * | u | Extended year | U* | Cyclic year |\n * | v* | Timezone (generic non-locat.) | V* | Timezone (location) |\n * | w | Local week of year | W* | Week of month |\n * | x | Timezone (ISO-8601 w/o Z) | X | Timezone (ISO-8601) |\n * | y | Year (abs) | Y | Local week-numbering year |\n * | z | Timezone (specific non-locat.) | Z* | Timezone (aliases) |\n *\n * Letters marked by * are not implemented but reserved by Unicode standard.\n *\n * Letters marked by ! are non-standard, but implemented by date-fns:\n * - `o` modifies the previous token to turn it into an ordinal (see `format` docs)\n * - `i` is ISO day of week. For `i` and `ii` is returns numeric ISO week days,\n * i.e. 7 for Sunday, 1 for Monday, etc.\n * - `I` is ISO week of year, as opposed to `w` which is local week of year.\n * - `R` is ISO week-numbering year, as opposed to `Y` which is local week-numbering year.\n * `R` is supposed to be used in conjunction with `I` and `i`\n * for universal ISO week-numbering date, whereas\n * `Y` is supposed to be used in conjunction with `w` and `e`\n * for week-numbering date specific to the locale.\n * - `P` is long localized date format\n * - `p` is long localized time format\n */\nvar formatters = {\n // Era\n G: function G(date, token, localize) {\n var era = date.getUTCFullYear() > 0 ? 1 : 0;\n\n switch (token) {\n // AD, BC\n case 'G':\n case 'GG':\n case 'GGG':\n return localize.era(era, {\n width: 'abbreviated'\n });\n // A, B\n\n case 'GGGGG':\n return localize.era(era, {\n width: 'narrow'\n });\n // Anno Domini, Before Christ\n\n case 'GGGG':\n default:\n return localize.era(era, {\n width: 'wide'\n });\n }\n },\n // Year\n y: function y(date, token, localize) {\n // Ordinal number\n if (token === 'yo') {\n var signedYear = date.getUTCFullYear(); // Returns 1 for 1 BC (which is year 0 in JavaScript)\n\n var year = signedYear > 0 ? signedYear : 1 - signedYear;\n return localize.ordinalNumber(year, {\n unit: 'year'\n });\n }\n\n return lightFormatters.y(date, token);\n },\n // Local week-numbering year\n Y: function Y(date, token, localize, options) {\n var signedWeekYear = getUTCWeekYear(date, options); // Returns 1 for 1 BC (which is year 0 in JavaScript)\n\n var weekYear = signedWeekYear > 0 ? signedWeekYear : 1 - signedWeekYear; // Two digit year\n\n if (token === 'YY') {\n var twoDigitYear = weekYear % 100;\n return addLeadingZeros(twoDigitYear, 2);\n } // Ordinal number\n\n\n if (token === 'Yo') {\n return localize.ordinalNumber(weekYear, {\n unit: 'year'\n });\n } // Padding\n\n\n return addLeadingZeros(weekYear, token.length);\n },\n // ISO week-numbering year\n R: function R(date, token) {\n var isoWeekYear = getUTCISOWeekYear(date); // Padding\n\n return addLeadingZeros(isoWeekYear, token.length);\n },\n // Extended year. This is a single number designating the year of this calendar system.\n // The main difference between `y` and `u` localizers are B.C. years:\n // | Year | `y` | `u` |\n // |------|-----|-----|\n // | AC 1 | 1 | 1 |\n // | BC 1 | 1 | 0 |\n // | BC 2 | 2 | -1 |\n // Also `yy` always returns the last two digits of a year,\n // while `uu` pads single digit years to 2 characters and returns other years unchanged.\n u: function u(date, token) {\n var year = date.getUTCFullYear();\n return addLeadingZeros(year, token.length);\n },\n // Quarter\n Q: function Q(date, token, localize) {\n var quarter = Math.ceil((date.getUTCMonth() + 1) / 3);\n\n switch (token) {\n // 1, 2, 3, 4\n case 'Q':\n return String(quarter);\n // 01, 02, 03, 04\n\n case 'QQ':\n return addLeadingZeros(quarter, 2);\n // 1st, 2nd, 3rd, 4th\n\n case 'Qo':\n return localize.ordinalNumber(quarter, {\n unit: 'quarter'\n });\n // Q1, Q2, Q3, Q4\n\n case 'QQQ':\n return localize.quarter(quarter, {\n width: 'abbreviated',\n context: 'formatting'\n });\n // 1, 2, 3, 4 (narrow quarter; could be not numerical)\n\n case 'QQQQQ':\n return localize.quarter(quarter, {\n width: 'narrow',\n context: 'formatting'\n });\n // 1st quarter, 2nd quarter, ...\n\n case 'QQQQ':\n default:\n return localize.quarter(quarter, {\n width: 'wide',\n context: 'formatting'\n });\n }\n },\n // Stand-alone quarter\n q: function q(date, token, localize) {\n var quarter = Math.ceil((date.getUTCMonth() + 1) / 3);\n\n switch (token) {\n // 1, 2, 3, 4\n case 'q':\n return String(quarter);\n // 01, 02, 03, 04\n\n case 'qq':\n return addLeadingZeros(quarter, 2);\n // 1st, 2nd, 3rd, 4th\n\n case 'qo':\n return localize.ordinalNumber(quarter, {\n unit: 'quarter'\n });\n // Q1, Q2, Q3, Q4\n\n case 'qqq':\n return localize.quarter(quarter, {\n width: 'abbreviated',\n context: 'standalone'\n });\n // 1, 2, 3, 4 (narrow quarter; could be not numerical)\n\n case 'qqqqq':\n return localize.quarter(quarter, {\n width: 'narrow',\n context: 'standalone'\n });\n // 1st quarter, 2nd quarter, ...\n\n case 'qqqq':\n default:\n return localize.quarter(quarter, {\n width: 'wide',\n context: 'standalone'\n });\n }\n },\n // Month\n M: function M(date, token, localize) {\n var month = date.getUTCMonth();\n\n switch (token) {\n case 'M':\n case 'MM':\n return lightFormatters.M(date, token);\n // 1st, 2nd, ..., 12th\n\n case 'Mo':\n return localize.ordinalNumber(month + 1, {\n unit: 'month'\n });\n // Jan, Feb, ..., Dec\n\n case 'MMM':\n return localize.month(month, {\n width: 'abbreviated',\n context: 'formatting'\n });\n // J, F, ..., D\n\n case 'MMMMM':\n return localize.month(month, {\n width: 'narrow',\n context: 'formatting'\n });\n // January, February, ..., December\n\n case 'MMMM':\n default:\n return localize.month(month, {\n width: 'wide',\n context: 'formatting'\n });\n }\n },\n // Stand-alone month\n L: function L(date, token, localize) {\n var month = date.getUTCMonth();\n\n switch (token) {\n // 1, 2, ..., 12\n case 'L':\n return String(month + 1);\n // 01, 02, ..., 12\n\n case 'LL':\n return addLeadingZeros(month + 1, 2);\n // 1st, 2nd, ..., 12th\n\n case 'Lo':\n return localize.ordinalNumber(month + 1, {\n unit: 'month'\n });\n // Jan, Feb, ..., Dec\n\n case 'LLL':\n return localize.month(month, {\n width: 'abbreviated',\n context: 'standalone'\n });\n // J, F, ..., D\n\n case 'LLLLL':\n return localize.month(month, {\n width: 'narrow',\n context: 'standalone'\n });\n // January, February, ..., December\n\n case 'LLLL':\n default:\n return localize.month(month, {\n width: 'wide',\n context: 'standalone'\n });\n }\n },\n // Local week of year\n w: function w(date, token, localize, options) {\n var week = getUTCWeek(date, options);\n\n if (token === 'wo') {\n return localize.ordinalNumber(week, {\n unit: 'week'\n });\n }\n\n return addLeadingZeros(week, token.length);\n },\n // ISO week of year\n I: function I(date, token, localize) {\n var isoWeek = getUTCISOWeek(date);\n\n if (token === 'Io') {\n return localize.ordinalNumber(isoWeek, {\n unit: 'week'\n });\n }\n\n return addLeadingZeros(isoWeek, token.length);\n },\n // Day of the month\n d: function d(date, token, localize) {\n if (token === 'do') {\n return localize.ordinalNumber(date.getUTCDate(), {\n unit: 'date'\n });\n }\n\n return lightFormatters.d(date, token);\n },\n // Day of year\n D: function D(date, token, localize) {\n var dayOfYear = getUTCDayOfYear(date);\n\n if (token === 'Do') {\n return localize.ordinalNumber(dayOfYear, {\n unit: 'dayOfYear'\n });\n }\n\n return addLeadingZeros(dayOfYear, token.length);\n },\n // Day of week\n E: function E(date, token, localize) {\n var dayOfWeek = date.getUTCDay();\n\n switch (token) {\n // Tue\n case 'E':\n case 'EE':\n case 'EEE':\n return localize.day(dayOfWeek, {\n width: 'abbreviated',\n context: 'formatting'\n });\n // T\n\n case 'EEEEE':\n return localize.day(dayOfWeek, {\n width: 'narrow',\n context: 'formatting'\n });\n // Tu\n\n case 'EEEEEE':\n return localize.day(dayOfWeek, {\n width: 'short',\n context: 'formatting'\n });\n // Tuesday\n\n case 'EEEE':\n default:\n return localize.day(dayOfWeek, {\n width: 'wide',\n context: 'formatting'\n });\n }\n },\n // Local day of week\n e: function e(date, token, localize, options) {\n var dayOfWeek = date.getUTCDay();\n var localDayOfWeek = (dayOfWeek - options.weekStartsOn + 8) % 7 || 7;\n\n switch (token) {\n // Numerical value (Nth day of week with current locale or weekStartsOn)\n case 'e':\n return String(localDayOfWeek);\n // Padded numerical value\n\n case 'ee':\n return addLeadingZeros(localDayOfWeek, 2);\n // 1st, 2nd, ..., 7th\n\n case 'eo':\n return localize.ordinalNumber(localDayOfWeek, {\n unit: 'day'\n });\n\n case 'eee':\n return localize.day(dayOfWeek, {\n width: 'abbreviated',\n context: 'formatting'\n });\n // T\n\n case 'eeeee':\n return localize.day(dayOfWeek, {\n width: 'narrow',\n context: 'formatting'\n });\n // Tu\n\n case 'eeeeee':\n return localize.day(dayOfWeek, {\n width: 'short',\n context: 'formatting'\n });\n // Tuesday\n\n case 'eeee':\n default:\n return localize.day(dayOfWeek, {\n width: 'wide',\n context: 'formatting'\n });\n }\n },\n // Stand-alone local day of week\n c: function c(date, token, localize, options) {\n var dayOfWeek = date.getUTCDay();\n var localDayOfWeek = (dayOfWeek - options.weekStartsOn + 8) % 7 || 7;\n\n switch (token) {\n // Numerical value (same as in `e`)\n case 'c':\n return String(localDayOfWeek);\n // Padded numerical value\n\n case 'cc':\n return addLeadingZeros(localDayOfWeek, token.length);\n // 1st, 2nd, ..., 7th\n\n case 'co':\n return localize.ordinalNumber(localDayOfWeek, {\n unit: 'day'\n });\n\n case 'ccc':\n return localize.day(dayOfWeek, {\n width: 'abbreviated',\n context: 'standalone'\n });\n // T\n\n case 'ccccc':\n return localize.day(dayOfWeek, {\n width: 'narrow',\n context: 'standalone'\n });\n // Tu\n\n case 'cccccc':\n return localize.day(dayOfWeek, {\n width: 'short',\n context: 'standalone'\n });\n // Tuesday\n\n case 'cccc':\n default:\n return localize.day(dayOfWeek, {\n width: 'wide',\n context: 'standalone'\n });\n }\n },\n // ISO day of week\n i: function i(date, token, localize) {\n var dayOfWeek = date.getUTCDay();\n var isoDayOfWeek = dayOfWeek === 0 ? 7 : dayOfWeek;\n\n switch (token) {\n // 2\n case 'i':\n return String(isoDayOfWeek);\n // 02\n\n case 'ii':\n return addLeadingZeros(isoDayOfWeek, token.length);\n // 2nd\n\n case 'io':\n return localize.ordinalNumber(isoDayOfWeek, {\n unit: 'day'\n });\n // Tue\n\n case 'iii':\n return localize.day(dayOfWeek, {\n width: 'abbreviated',\n context: 'formatting'\n });\n // T\n\n case 'iiiii':\n return localize.day(dayOfWeek, {\n width: 'narrow',\n context: 'formatting'\n });\n // Tu\n\n case 'iiiiii':\n return localize.day(dayOfWeek, {\n width: 'short',\n context: 'formatting'\n });\n // Tuesday\n\n case 'iiii':\n default:\n return localize.day(dayOfWeek, {\n width: 'wide',\n context: 'formatting'\n });\n }\n },\n // AM or PM\n a: function a(date, token, localize) {\n var hours = date.getUTCHours();\n var dayPeriodEnumValue = hours / 12 >= 1 ? 'pm' : 'am';\n\n switch (token) {\n case 'a':\n case 'aa':\n return localize.dayPeriod(dayPeriodEnumValue, {\n width: 'abbreviated',\n context: 'formatting'\n });\n\n case 'aaa':\n return localize.dayPeriod(dayPeriodEnumValue, {\n width: 'abbreviated',\n context: 'formatting'\n }).toLowerCase();\n\n case 'aaaaa':\n return localize.dayPeriod(dayPeriodEnumValue, {\n width: 'narrow',\n context: 'formatting'\n });\n\n case 'aaaa':\n default:\n return localize.dayPeriod(dayPeriodEnumValue, {\n width: 'wide',\n context: 'formatting'\n });\n }\n },\n // AM, PM, midnight, noon\n b: function b(date, token, localize) {\n var hours = date.getUTCHours();\n var dayPeriodEnumValue;\n\n if (hours === 12) {\n dayPeriodEnumValue = dayPeriodEnum.noon;\n } else if (hours === 0) {\n dayPeriodEnumValue = dayPeriodEnum.midnight;\n } else {\n dayPeriodEnumValue = hours / 12 >= 1 ? 'pm' : 'am';\n }\n\n switch (token) {\n case 'b':\n case 'bb':\n return localize.dayPeriod(dayPeriodEnumValue, {\n width: 'abbreviated',\n context: 'formatting'\n });\n\n case 'bbb':\n return localize.dayPeriod(dayPeriodEnumValue, {\n width: 'abbreviated',\n context: 'formatting'\n }).toLowerCase();\n\n case 'bbbbb':\n return localize.dayPeriod(dayPeriodEnumValue, {\n width: 'narrow',\n context: 'formatting'\n });\n\n case 'bbbb':\n default:\n return localize.dayPeriod(dayPeriodEnumValue, {\n width: 'wide',\n context: 'formatting'\n });\n }\n },\n // in the morning, in the afternoon, in the evening, at night\n B: function B(date, token, localize) {\n var hours = date.getUTCHours();\n var dayPeriodEnumValue;\n\n if (hours >= 17) {\n dayPeriodEnumValue = dayPeriodEnum.evening;\n } else if (hours >= 12) {\n dayPeriodEnumValue = dayPeriodEnum.afternoon;\n } else if (hours >= 4) {\n dayPeriodEnumValue = dayPeriodEnum.morning;\n } else {\n dayPeriodEnumValue = dayPeriodEnum.night;\n }\n\n switch (token) {\n case 'B':\n case 'BB':\n case 'BBB':\n return localize.dayPeriod(dayPeriodEnumValue, {\n width: 'abbreviated',\n context: 'formatting'\n });\n\n case 'BBBBB':\n return localize.dayPeriod(dayPeriodEnumValue, {\n width: 'narrow',\n context: 'formatting'\n });\n\n case 'BBBB':\n default:\n return localize.dayPeriod(dayPeriodEnumValue, {\n width: 'wide',\n context: 'formatting'\n });\n }\n },\n // Hour [1-12]\n h: function h(date, token, localize) {\n if (token === 'ho') {\n var hours = date.getUTCHours() % 12;\n if (hours === 0) hours = 12;\n return localize.ordinalNumber(hours, {\n unit: 'hour'\n });\n }\n\n return lightFormatters.h(date, token);\n },\n // Hour [0-23]\n H: function H(date, token, localize) {\n if (token === 'Ho') {\n return localize.ordinalNumber(date.getUTCHours(), {\n unit: 'hour'\n });\n }\n\n return lightFormatters.H(date, token);\n },\n // Hour [0-11]\n K: function K(date, token, localize) {\n var hours = date.getUTCHours() % 12;\n\n if (token === 'Ko') {\n return localize.ordinalNumber(hours, {\n unit: 'hour'\n });\n }\n\n return addLeadingZeros(hours, token.length);\n },\n // Hour [1-24]\n k: function k(date, token, localize) {\n var hours = date.getUTCHours();\n if (hours === 0) hours = 24;\n\n if (token === 'ko') {\n return localize.ordinalNumber(hours, {\n unit: 'hour'\n });\n }\n\n return addLeadingZeros(hours, token.length);\n },\n // Minute\n m: function m(date, token, localize) {\n if (token === 'mo') {\n return localize.ordinalNumber(date.getUTCMinutes(), {\n unit: 'minute'\n });\n }\n\n return lightFormatters.m(date, token);\n },\n // Second\n s: function s(date, token, localize) {\n if (token === 'so') {\n return localize.ordinalNumber(date.getUTCSeconds(), {\n unit: 'second'\n });\n }\n\n return lightFormatters.s(date, token);\n },\n // Fraction of second\n S: function S(date, token) {\n return lightFormatters.S(date, token);\n },\n // Timezone (ISO-8601. If offset is 0, output is always `'Z'`)\n X: function X(date, token, _localize, options) {\n var originalDate = options._originalDate || date;\n var timezoneOffset = originalDate.getTimezoneOffset();\n\n if (timezoneOffset === 0) {\n return 'Z';\n }\n\n switch (token) {\n // Hours and optional minutes\n case 'X':\n return formatTimezoneWithOptionalMinutes(timezoneOffset);\n // Hours, minutes and optional seconds without `:` delimiter\n // Note: neither ISO-8601 nor JavaScript supports seconds in timezone offsets\n // so this token always has the same output as `XX`\n\n case 'XXXX':\n case 'XX':\n // Hours and minutes without `:` delimiter\n return formatTimezone(timezoneOffset);\n // Hours, minutes and optional seconds with `:` delimiter\n // Note: neither ISO-8601 nor JavaScript supports seconds in timezone offsets\n // so this token always has the same output as `XXX`\n\n case 'XXXXX':\n case 'XXX': // Hours and minutes with `:` delimiter\n\n default:\n return formatTimezone(timezoneOffset, ':');\n }\n },\n // Timezone (ISO-8601. If offset is 0, output is `'+00:00'` or equivalent)\n x: function x(date, token, _localize, options) {\n var originalDate = options._originalDate || date;\n var timezoneOffset = originalDate.getTimezoneOffset();\n\n switch (token) {\n // Hours and optional minutes\n case 'x':\n return formatTimezoneWithOptionalMinutes(timezoneOffset);\n // Hours, minutes and optional seconds without `:` delimiter\n // Note: neither ISO-8601 nor JavaScript supports seconds in timezone offsets\n // so this token always has the same output as `xx`\n\n case 'xxxx':\n case 'xx':\n // Hours and minutes without `:` delimiter\n return formatTimezone(timezoneOffset);\n // Hours, minutes and optional seconds with `:` delimiter\n // Note: neither ISO-8601 nor JavaScript supports seconds in timezone offsets\n // so this token always has the same output as `xxx`\n\n case 'xxxxx':\n case 'xxx': // Hours and minutes with `:` delimiter\n\n default:\n return formatTimezone(timezoneOffset, ':');\n }\n },\n // Timezone (GMT)\n O: function O(date, token, _localize, options) {\n var originalDate = options._originalDate || date;\n var timezoneOffset = originalDate.getTimezoneOffset();\n\n switch (token) {\n // Short\n case 'O':\n case 'OO':\n case 'OOO':\n return 'GMT' + formatTimezoneShort(timezoneOffset, ':');\n // Long\n\n case 'OOOO':\n default:\n return 'GMT' + formatTimezone(timezoneOffset, ':');\n }\n },\n // Timezone (specific non-location)\n z: function z(date, token, _localize, options) {\n var originalDate = options._originalDate || date;\n var timezoneOffset = originalDate.getTimezoneOffset();\n\n switch (token) {\n // Short\n case 'z':\n case 'zz':\n case 'zzz':\n return 'GMT' + formatTimezoneShort(timezoneOffset, ':');\n // Long\n\n case 'zzzz':\n default:\n return 'GMT' + formatTimezone(timezoneOffset, ':');\n }\n },\n // Seconds timestamp\n t: function t(date, token, _localize, options) {\n var originalDate = options._originalDate || date;\n var timestamp = Math.floor(originalDate.getTime() / 1000);\n return addLeadingZeros(timestamp, token.length);\n },\n // Milliseconds timestamp\n T: function T(date, token, _localize, options) {\n var originalDate = options._originalDate || date;\n var timestamp = originalDate.getTime();\n return addLeadingZeros(timestamp, token.length);\n }\n};\n\nfunction formatTimezoneShort(offset, dirtyDelimiter) {\n var sign = offset > 0 ? '-' : '+';\n var absOffset = Math.abs(offset);\n var hours = Math.floor(absOffset / 60);\n var minutes = absOffset % 60;\n\n if (minutes === 0) {\n return sign + String(hours);\n }\n\n var delimiter = dirtyDelimiter || '';\n return sign + String(hours) + delimiter + addLeadingZeros(minutes, 2);\n}\n\nfunction formatTimezoneWithOptionalMinutes(offset, dirtyDelimiter) {\n if (offset % 60 === 0) {\n var sign = offset > 0 ? '-' : '+';\n return sign + addLeadingZeros(Math.abs(offset) / 60, 2);\n }\n\n return formatTimezone(offset, dirtyDelimiter);\n}\n\nfunction formatTimezone(offset, dirtyDelimiter) {\n var delimiter = dirtyDelimiter || '';\n var sign = offset > 0 ? '-' : '+';\n var absOffset = Math.abs(offset);\n var hours = addLeadingZeros(Math.floor(absOffset / 60), 2);\n var minutes = addLeadingZeros(absOffset % 60, 2);\n return sign + hours + delimiter + minutes;\n}\n\nexport default formatters;","var dateLongFormatter = function dateLongFormatter(pattern, formatLong) {\n switch (pattern) {\n case 'P':\n return formatLong.date({\n width: 'short'\n });\n\n case 'PP':\n return formatLong.date({\n width: 'medium'\n });\n\n case 'PPP':\n return formatLong.date({\n width: 'long'\n });\n\n case 'PPPP':\n default:\n return formatLong.date({\n width: 'full'\n });\n }\n};\n\nvar timeLongFormatter = function timeLongFormatter(pattern, formatLong) {\n switch (pattern) {\n case 'p':\n return formatLong.time({\n width: 'short'\n });\n\n case 'pp':\n return formatLong.time({\n width: 'medium'\n });\n\n case 'ppp':\n return formatLong.time({\n width: 'long'\n });\n\n case 'pppp':\n default:\n return formatLong.time({\n width: 'full'\n });\n }\n};\n\nvar dateTimeLongFormatter = function dateTimeLongFormatter(pattern, formatLong) {\n var matchResult = pattern.match(/(P+)(p+)?/) || [];\n var datePattern = matchResult[1];\n var timePattern = matchResult[2];\n\n if (!timePattern) {\n return dateLongFormatter(pattern, formatLong);\n }\n\n var dateTimeFormat;\n\n switch (datePattern) {\n case 'P':\n dateTimeFormat = formatLong.dateTime({\n width: 'short'\n });\n break;\n\n case 'PP':\n dateTimeFormat = formatLong.dateTime({\n width: 'medium'\n });\n break;\n\n case 'PPP':\n dateTimeFormat = formatLong.dateTime({\n width: 'long'\n });\n break;\n\n case 'PPPP':\n default:\n dateTimeFormat = formatLong.dateTime({\n width: 'full'\n });\n break;\n }\n\n return dateTimeFormat.replace('{{date}}', dateLongFormatter(datePattern, formatLong)).replace('{{time}}', timeLongFormatter(timePattern, formatLong));\n};\n\nvar longFormatters = {\n p: timeLongFormatter,\n P: dateTimeLongFormatter\n};\nexport default longFormatters;","/**\n * Google Chrome as of 67.0.3396.87 introduced timezones with offset that includes seconds.\n * They usually appear for dates that denote time before the timezones were introduced\n * (e.g. for 'Europe/Prague' timezone the offset is GMT+00:57:44 before 1 October 1891\n * and GMT+01:00:00 after that date)\n *\n * Date#getTimezoneOffset returns the offset in minutes and would return 57 for the example above,\n * which would lead to incorrect calculations.\n *\n * This function returns the timezone offset in milliseconds that takes seconds in account.\n */\nexport default function getTimezoneOffsetInMilliseconds(date) {\n var utcDate = new Date(Date.UTC(date.getFullYear(), date.getMonth(), date.getDate(), date.getHours(), date.getMinutes(), date.getSeconds(), date.getMilliseconds()));\n utcDate.setUTCFullYear(date.getFullYear());\n return date.getTime() - utcDate.getTime();\n}","var protectedDayOfYearTokens = ['D', 'DD'];\nvar protectedWeekYearTokens = ['YY', 'YYYY'];\nexport function isProtectedDayOfYearToken(token) {\n return protectedDayOfYearTokens.indexOf(token) !== -1;\n}\nexport function isProtectedWeekYearToken(token) {\n return protectedWeekYearTokens.indexOf(token) !== -1;\n}\nexport function throwProtectedError(token, format, input) {\n if (token === 'YYYY') {\n throw new RangeError(\"Use `yyyy` instead of `YYYY` (in `\".concat(format, \"`) for formatting years to the input `\").concat(input, \"`; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md\"));\n } else if (token === 'YY') {\n throw new RangeError(\"Use `yy` instead of `YY` (in `\".concat(format, \"`) for formatting years to the input `\").concat(input, \"`; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md\"));\n } else if (token === 'D') {\n throw new RangeError(\"Use `d` instead of `D` (in `\".concat(format, \"`) for formatting days of the month to the input `\").concat(input, \"`; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md\"));\n } else if (token === 'DD') {\n throw new RangeError(\"Use `dd` instead of `DD` (in `\".concat(format, \"`) for formatting days of the month to the input `\").concat(input, \"`; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md\"));\n }\n}","var formatDistanceLocale = {\n lessThanXSeconds: {\n one: 'less than a second',\n other: 'less than {{count}} seconds'\n },\n xSeconds: {\n one: '1 second',\n other: '{{count}} seconds'\n },\n halfAMinute: 'half a minute',\n lessThanXMinutes: {\n one: 'less than a minute',\n other: 'less than {{count}} minutes'\n },\n xMinutes: {\n one: '1 minute',\n other: '{{count}} minutes'\n },\n aboutXHours: {\n one: 'about 1 hour',\n other: 'about {{count}} hours'\n },\n xHours: {\n one: '1 hour',\n other: '{{count}} hours'\n },\n xDays: {\n one: '1 day',\n other: '{{count}} days'\n },\n aboutXWeeks: {\n one: 'about 1 week',\n other: 'about {{count}} weeks'\n },\n xWeeks: {\n one: '1 week',\n other: '{{count}} weeks'\n },\n aboutXMonths: {\n one: 'about 1 month',\n other: 'about {{count}} months'\n },\n xMonths: {\n one: '1 month',\n other: '{{count}} months'\n },\n aboutXYears: {\n one: 'about 1 year',\n other: 'about {{count}} years'\n },\n xYears: {\n one: '1 year',\n other: '{{count}} years'\n },\n overXYears: {\n one: 'over 1 year',\n other: 'over {{count}} years'\n },\n almostXYears: {\n one: 'almost 1 year',\n other: 'almost {{count}} years'\n }\n};\n\nvar formatDistance = function formatDistance(token, count, options) {\n var result;\n var tokenValue = formatDistanceLocale[token];\n\n if (typeof tokenValue === 'string') {\n result = tokenValue;\n } else if (count === 1) {\n result = tokenValue.one;\n } else {\n result = tokenValue.other.replace('{{count}}', count.toString());\n }\n\n if (options !== null && options !== void 0 && options.addSuffix) {\n if (options.comparison && options.comparison > 0) {\n return 'in ' + result;\n } else {\n return result + ' ago';\n }\n }\n\n return result;\n};\n\nexport default formatDistance;","export default function buildFormatLongFn(args) {\n return function () {\n var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};\n // TODO: Remove String()\n var width = options.width ? String(options.width) : args.defaultWidth;\n var format = args.formats[width] || args.formats[args.defaultWidth];\n return format;\n };\n}","import buildFormatLongFn from \"../../../_lib/buildFormatLongFn/index.js\";\nvar dateFormats = {\n full: 'EEEE, MMMM do, y',\n long: 'MMMM do, y',\n medium: 'MMM d, y',\n short: 'MM/dd/yyyy'\n};\nvar timeFormats = {\n full: 'h:mm:ss a zzzz',\n long: 'h:mm:ss a z',\n medium: 'h:mm:ss a',\n short: 'h:mm a'\n};\nvar dateTimeFormats = {\n full: \"{{date}} 'at' {{time}}\",\n long: \"{{date}} 'at' {{time}}\",\n medium: '{{date}}, {{time}}',\n short: '{{date}}, {{time}}'\n};\nvar formatLong = {\n date: buildFormatLongFn({\n formats: dateFormats,\n defaultWidth: 'full'\n }),\n time: buildFormatLongFn({\n formats: timeFormats,\n defaultWidth: 'full'\n }),\n dateTime: buildFormatLongFn({\n formats: dateTimeFormats,\n defaultWidth: 'full'\n })\n};\nexport default formatLong;","var formatRelativeLocale = {\n lastWeek: \"'last' eeee 'at' p\",\n yesterday: \"'yesterday at' p\",\n today: \"'today at' p\",\n tomorrow: \"'tomorrow at' p\",\n nextWeek: \"eeee 'at' p\",\n other: 'P'\n};\n\nvar formatRelative = function formatRelative(token, _date, _baseDate, _options) {\n return formatRelativeLocale[token];\n};\n\nexport default formatRelative;","export default function buildLocalizeFn(args) {\n return function (dirtyIndex, options) {\n var context = options !== null && options !== void 0 && options.context ? String(options.context) : 'standalone';\n var valuesArray;\n\n if (context === 'formatting' && args.formattingValues) {\n var defaultWidth = args.defaultFormattingWidth || args.defaultWidth;\n var width = options !== null && options !== void 0 && options.width ? String(options.width) : defaultWidth;\n valuesArray = args.formattingValues[width] || args.formattingValues[defaultWidth];\n } else {\n var _defaultWidth = args.defaultWidth;\n\n var _width = options !== null && options !== void 0 && options.width ? String(options.width) : args.defaultWidth;\n\n valuesArray = args.values[_width] || args.values[_defaultWidth];\n }\n\n var index = args.argumentCallback ? args.argumentCallback(dirtyIndex) : dirtyIndex; // @ts-ignore: For some reason TypeScript just don't want to match it, no matter how hard we try. I challenge you to try to remove it!\n\n return valuesArray[index];\n };\n}","import buildLocalizeFn from \"../../../_lib/buildLocalizeFn/index.js\";\nvar eraValues = {\n narrow: ['B', 'A'],\n abbreviated: ['BC', 'AD'],\n wide: ['Before Christ', 'Anno Domini']\n};\nvar quarterValues = {\n narrow: ['1', '2', '3', '4'],\n abbreviated: ['Q1', 'Q2', 'Q3', 'Q4'],\n wide: ['1st quarter', '2nd quarter', '3rd quarter', '4th quarter']\n}; // Note: in English, the names of days of the week and months are capitalized.\n// If you are making a new locale based on this one, check if the same is true for the language you're working on.\n// Generally, formatted dates should look like they are in the middle of a sentence,\n// e.g. in Spanish language the weekdays and months should be in the lowercase.\n\nvar monthValues = {\n narrow: ['J', 'F', 'M', 'A', 'M', 'J', 'J', 'A', 'S', 'O', 'N', 'D'],\n abbreviated: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],\n wide: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December']\n};\nvar dayValues = {\n narrow: ['S', 'M', 'T', 'W', 'T', 'F', 'S'],\n short: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'],\n abbreviated: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],\n wide: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday']\n};\nvar dayPeriodValues = {\n narrow: {\n am: 'a',\n pm: 'p',\n midnight: 'mi',\n noon: 'n',\n morning: 'morning',\n afternoon: 'afternoon',\n evening: 'evening',\n night: 'night'\n },\n abbreviated: {\n am: 'AM',\n pm: 'PM',\n midnight: 'midnight',\n noon: 'noon',\n morning: 'morning',\n afternoon: 'afternoon',\n evening: 'evening',\n night: 'night'\n },\n wide: {\n am: 'a.m.',\n pm: 'p.m.',\n midnight: 'midnight',\n noon: 'noon',\n morning: 'morning',\n afternoon: 'afternoon',\n evening: 'evening',\n night: 'night'\n }\n};\nvar formattingDayPeriodValues = {\n narrow: {\n am: 'a',\n pm: 'p',\n midnight: 'mi',\n noon: 'n',\n morning: 'in the morning',\n afternoon: 'in the afternoon',\n evening: 'in the evening',\n night: 'at night'\n },\n abbreviated: {\n am: 'AM',\n pm: 'PM',\n midnight: 'midnight',\n noon: 'noon',\n morning: 'in the morning',\n afternoon: 'in the afternoon',\n evening: 'in the evening',\n night: 'at night'\n },\n wide: {\n am: 'a.m.',\n pm: 'p.m.',\n midnight: 'midnight',\n noon: 'noon',\n morning: 'in the morning',\n afternoon: 'in the afternoon',\n evening: 'in the evening',\n night: 'at night'\n }\n};\n\nvar ordinalNumber = function ordinalNumber(dirtyNumber, _options) {\n var number = Number(dirtyNumber); // If ordinal numbers depend on context, for example,\n // if they are different for different grammatical genders,\n // use `options.unit`.\n //\n // `unit` can be 'year', 'quarter', 'month', 'week', 'date', 'dayOfYear',\n // 'day', 'hour', 'minute', 'second'.\n\n var rem100 = number % 100;\n\n if (rem100 > 20 || rem100 < 10) {\n switch (rem100 % 10) {\n case 1:\n return number + 'st';\n\n case 2:\n return number + 'nd';\n\n case 3:\n return number + 'rd';\n }\n }\n\n return number + 'th';\n};\n\nvar localize = {\n ordinalNumber: ordinalNumber,\n era: buildLocalizeFn({\n values: eraValues,\n defaultWidth: 'wide'\n }),\n quarter: buildLocalizeFn({\n values: quarterValues,\n defaultWidth: 'wide',\n argumentCallback: function argumentCallback(quarter) {\n return quarter - 1;\n }\n }),\n month: buildLocalizeFn({\n values: monthValues,\n defaultWidth: 'wide'\n }),\n day: buildLocalizeFn({\n values: dayValues,\n defaultWidth: 'wide'\n }),\n dayPeriod: buildLocalizeFn({\n values: dayPeriodValues,\n defaultWidth: 'wide',\n formattingValues: formattingDayPeriodValues,\n defaultFormattingWidth: 'wide'\n })\n};\nexport default localize;","export default function buildMatchFn(args) {\n return function (string) {\n var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n var width = options.width;\n var matchPattern = width && args.matchPatterns[width] || args.matchPatterns[args.defaultMatchWidth];\n var matchResult = string.match(matchPattern);\n\n if (!matchResult) {\n return null;\n }\n\n var matchedString = matchResult[0];\n var parsePatterns = width && args.parsePatterns[width] || args.parsePatterns[args.defaultParseWidth];\n var key = Array.isArray(parsePatterns) ? findIndex(parsePatterns, function (pattern) {\n return pattern.test(matchedString);\n }) : findKey(parsePatterns, function (pattern) {\n return pattern.test(matchedString);\n });\n var value;\n value = args.valueCallback ? args.valueCallback(key) : key;\n value = options.valueCallback ? options.valueCallback(value) : value;\n var rest = string.slice(matchedString.length);\n return {\n value: value,\n rest: rest\n };\n };\n}\n\nfunction findKey(object, predicate) {\n for (var key in object) {\n if (object.hasOwnProperty(key) && predicate(object[key])) {\n return key;\n }\n }\n\n return undefined;\n}\n\nfunction findIndex(array, predicate) {\n for (var key = 0; key < array.length; key++) {\n if (predicate(array[key])) {\n return key;\n }\n }\n\n return undefined;\n}","import buildMatchFn from \"../../../_lib/buildMatchFn/index.js\";\nimport buildMatchPatternFn from \"../../../_lib/buildMatchPatternFn/index.js\";\nvar matchOrdinalNumberPattern = /^(\\d+)(th|st|nd|rd)?/i;\nvar parseOrdinalNumberPattern = /\\d+/i;\nvar matchEraPatterns = {\n narrow: /^(b|a)/i,\n abbreviated: /^(b\\.?\\s?c\\.?|b\\.?\\s?c\\.?\\s?e\\.?|a\\.?\\s?d\\.?|c\\.?\\s?e\\.?)/i,\n wide: /^(before christ|before common era|anno domini|common era)/i\n};\nvar parseEraPatterns = {\n any: [/^b/i, /^(a|c)/i]\n};\nvar matchQuarterPatterns = {\n narrow: /^[1234]/i,\n abbreviated: /^q[1234]/i,\n wide: /^[1234](th|st|nd|rd)? quarter/i\n};\nvar parseQuarterPatterns = {\n any: [/1/i, /2/i, /3/i, /4/i]\n};\nvar matchMonthPatterns = {\n narrow: /^[jfmasond]/i,\n abbreviated: /^(jan|feb|mar|apr|may|jun|jul|aug|sep|oct|nov|dec)/i,\n wide: /^(january|february|march|april|may|june|july|august|september|october|november|december)/i\n};\nvar parseMonthPatterns = {\n narrow: [/^j/i, /^f/i, /^m/i, /^a/i, /^m/i, /^j/i, /^j/i, /^a/i, /^s/i, /^o/i, /^n/i, /^d/i],\n any: [/^ja/i, /^f/i, /^mar/i, /^ap/i, /^may/i, /^jun/i, /^jul/i, /^au/i, /^s/i, /^o/i, /^n/i, /^d/i]\n};\nvar matchDayPatterns = {\n narrow: /^[smtwf]/i,\n short: /^(su|mo|tu|we|th|fr|sa)/i,\n abbreviated: /^(sun|mon|tue|wed|thu|fri|sat)/i,\n wide: /^(sunday|monday|tuesday|wednesday|thursday|friday|saturday)/i\n};\nvar parseDayPatterns = {\n narrow: [/^s/i, /^m/i, /^t/i, /^w/i, /^t/i, /^f/i, /^s/i],\n any: [/^su/i, /^m/i, /^tu/i, /^w/i, /^th/i, /^f/i, /^sa/i]\n};\nvar matchDayPeriodPatterns = {\n narrow: /^(a|p|mi|n|(in the|at) (morning|afternoon|evening|night))/i,\n any: /^([ap]\\.?\\s?m\\.?|midnight|noon|(in the|at) (morning|afternoon|evening|night))/i\n};\nvar parseDayPeriodPatterns = {\n any: {\n am: /^a/i,\n pm: /^p/i,\n midnight: /^mi/i,\n noon: /^no/i,\n morning: /morning/i,\n afternoon: /afternoon/i,\n evening: /evening/i,\n night: /night/i\n }\n};\nvar match = {\n ordinalNumber: buildMatchPatternFn({\n matchPattern: matchOrdinalNumberPattern,\n parsePattern: parseOrdinalNumberPattern,\n valueCallback: function valueCallback(value) {\n return parseInt(value, 10);\n }\n }),\n era: buildMatchFn({\n matchPatterns: matchEraPatterns,\n defaultMatchWidth: 'wide',\n parsePatterns: parseEraPatterns,\n defaultParseWidth: 'any'\n }),\n quarter: buildMatchFn({\n matchPatterns: matchQuarterPatterns,\n defaultMatchWidth: 'wide',\n parsePatterns: parseQuarterPatterns,\n defaultParseWidth: 'any',\n valueCallback: function valueCallback(index) {\n return index + 1;\n }\n }),\n month: buildMatchFn({\n matchPatterns: matchMonthPatterns,\n defaultMatchWidth: 'wide',\n parsePatterns: parseMonthPatterns,\n defaultParseWidth: 'any'\n }),\n day: buildMatchFn({\n matchPatterns: matchDayPatterns,\n defaultMatchWidth: 'wide',\n parsePatterns: parseDayPatterns,\n defaultParseWidth: 'any'\n }),\n dayPeriod: buildMatchFn({\n matchPatterns: matchDayPeriodPatterns,\n defaultMatchWidth: 'any',\n parsePatterns: parseDayPeriodPatterns,\n defaultParseWidth: 'any'\n })\n};\nexport default match;","export default function buildMatchPatternFn(args) {\n return function (string) {\n var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n var matchResult = string.match(args.matchPattern);\n if (!matchResult) return null;\n var matchedString = matchResult[0];\n var parseResult = string.match(args.parsePattern);\n if (!parseResult) return null;\n var value = args.valueCallback ? args.valueCallback(parseResult[0]) : parseResult[0];\n value = options.valueCallback ? options.valueCallback(value) : value;\n var rest = string.slice(matchedString.length);\n return {\n value: value,\n rest: rest\n };\n };\n}","import formatDistance from \"./_lib/formatDistance/index.js\";\nimport formatLong from \"./_lib/formatLong/index.js\";\nimport formatRelative from \"./_lib/formatRelative/index.js\";\nimport localize from \"./_lib/localize/index.js\";\nimport match from \"./_lib/match/index.js\";\n\n/**\n * @type {Locale}\n * @category Locales\n * @summary English locale (United States).\n * @language English\n * @iso-639-2 eng\n * @author Sasha Koss [@kossnocorp]{@link https://github.com/kossnocorp}\n * @author Lesha Koss [@leshakoss]{@link https://github.com/leshakoss}\n */\nvar locale = {\n code: 'en-US',\n formatDistance: formatDistance,\n formatLong: formatLong,\n formatRelative: formatRelative,\n localize: localize,\n match: match,\n options: {\n weekStartsOn: 0\n /* Sunday */\n ,\n firstWeekContainsDate: 1\n }\n};\nexport default locale;","import defaultLocale from \"../../locale/en-US/index.js\";\nexport default defaultLocale;","import isValid from \"../isValid/index.js\";\nimport subMilliseconds from \"../subMilliseconds/index.js\";\nimport toDate from \"../toDate/index.js\";\nimport formatters from \"../_lib/format/formatters/index.js\";\nimport longFormatters from \"../_lib/format/longFormatters/index.js\";\nimport getTimezoneOffsetInMilliseconds from \"../_lib/getTimezoneOffsetInMilliseconds/index.js\";\nimport { isProtectedDayOfYearToken, isProtectedWeekYearToken, throwProtectedError } from \"../_lib/protectedTokens/index.js\";\nimport toInteger from \"../_lib/toInteger/index.js\";\nimport requiredArgs from \"../_lib/requiredArgs/index.js\";\nimport { getDefaultOptions } from \"../_lib/defaultOptions/index.js\";\nimport defaultLocale from \"../_lib/defaultLocale/index.js\"; // This RegExp consists of three parts separated by `|`:\n// - [yYQqMLwIdDecihHKkms]o matches any available ordinal number token\n// (one of the certain letters followed by `o`)\n// - (\\w)\\1* matches any sequences of the same letter\n// - '' matches two quote characters in a row\n// - '(''|[^'])+('|$) matches anything surrounded by two quote characters ('),\n// except a single quote symbol, which ends the sequence.\n// Two quote characters do not end the sequence.\n// If there is no matching single quote\n// then the sequence will continue until the end of the string.\n// - . matches any single character unmatched by previous parts of the RegExps\n\nvar formattingTokensRegExp = /[yYQqMLwIdDecihHKkms]o|(\\w)\\1*|''|'(''|[^'])+('|$)|./g; // This RegExp catches symbols escaped by quotes, and also\n// sequences of symbols P, p, and the combinations like `PPPPPPPppppp`\n\nvar longFormattingTokensRegExp = /P+p+|P+|p+|''|'(''|[^'])+('|$)|./g;\nvar escapedStringRegExp = /^'([^]*?)'?$/;\nvar doubleQuoteRegExp = /''/g;\nvar unescapedLatinCharacterRegExp = /[a-zA-Z]/;\n/**\n * @name format\n * @category Common Helpers\n * @summary Format the date.\n *\n * @description\n * Return the formatted date string in the given format. The result may vary by locale.\n *\n * > ⚠️ Please note that the `format` tokens differ from Moment.js and other libraries.\n * > See: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md\n *\n * The characters wrapped between two single quotes characters (') are escaped.\n * Two single quotes in a row, whether inside or outside a quoted sequence, represent a 'real' single quote.\n * (see the last example)\n *\n * Format of the string is based on Unicode Technical Standard #35:\n * https://www.unicode.org/reports/tr35/tr35-dates.html#Date_Field_Symbol_Table\n * with a few additions (see note 7 below the table).\n *\n * Accepted patterns:\n * | Unit | Pattern | Result examples | Notes |\n * |---------------------------------|---------|-----------------------------------|-------|\n * | Era | G..GGG | AD, BC | |\n * | | GGGG | Anno Domini, Before Christ | 2 |\n * | | GGGGG | A, B | |\n * | Calendar year | y | 44, 1, 1900, 2017 | 5 |\n * | | yo | 44th, 1st, 0th, 17th | 5,7 |\n * | | yy | 44, 01, 00, 17 | 5 |\n * | | yyy | 044, 001, 1900, 2017 | 5 |\n * | | yyyy | 0044, 0001, 1900, 2017 | 5 |\n * | | yyyyy | ... | 3,5 |\n * | Local week-numbering year | Y | 44, 1, 1900, 2017 | 5 |\n * | | Yo | 44th, 1st, 1900th, 2017th | 5,7 |\n * | | YY | 44, 01, 00, 17 | 5,8 |\n * | | YYY | 044, 001, 1900, 2017 | 5 |\n * | | YYYY | 0044, 0001, 1900, 2017 | 5,8 |\n * | | YYYYY | ... | 3,5 |\n * | ISO week-numbering year | R | -43, 0, 1, 1900, 2017 | 5,7 |\n * | | RR | -43, 00, 01, 1900, 2017 | 5,7 |\n * | | RRR | -043, 000, 001, 1900, 2017 | 5,7 |\n * | | RRRR | -0043, 0000, 0001, 1900, 2017 | 5,7 |\n * | | RRRRR | ... | 3,5,7 |\n * | Extended year | u | -43, 0, 1, 1900, 2017 | 5 |\n * | | uu | -43, 01, 1900, 2017 | 5 |\n * | | uuu | -043, 001, 1900, 2017 | 5 |\n * | | uuuu | -0043, 0001, 1900, 2017 | 5 |\n * | | uuuuu | ... | 3,5 |\n * | Quarter (formatting) | Q | 1, 2, 3, 4 | |\n * | | Qo | 1st, 2nd, 3rd, 4th | 7 |\n * | | QQ | 01, 02, 03, 04 | |\n * | | QQQ | Q1, Q2, Q3, Q4 | |\n * | | QQQQ | 1st quarter, 2nd quarter, ... | 2 |\n * | | QQQQQ | 1, 2, 3, 4 | 4 |\n * | Quarter (stand-alone) | q | 1, 2, 3, 4 | |\n * | | qo | 1st, 2nd, 3rd, 4th | 7 |\n * | | qq | 01, 02, 03, 04 | |\n * | | qqq | Q1, Q2, Q3, Q4 | |\n * | | qqqq | 1st quarter, 2nd quarter, ... | 2 |\n * | | qqqqq | 1, 2, 3, 4 | 4 |\n * | Month (formatting) | M | 1, 2, ..., 12 | |\n * | | Mo | 1st, 2nd, ..., 12th | 7 |\n * | | MM | 01, 02, ..., 12 | |\n * | | MMM | Jan, Feb, ..., Dec | |\n * | | MMMM | January, February, ..., December | 2 |\n * | | MMMMM | J, F, ..., D | |\n * | Month (stand-alone) | L | 1, 2, ..., 12 | |\n * | | Lo | 1st, 2nd, ..., 12th | 7 |\n * | | LL | 01, 02, ..., 12 | |\n * | | LLL | Jan, Feb, ..., Dec | |\n * | | LLLL | January, February, ..., December | 2 |\n * | | LLLLL | J, F, ..., D | |\n * | Local week of year | w | 1, 2, ..., 53 | |\n * | | wo | 1st, 2nd, ..., 53th | 7 |\n * | | ww | 01, 02, ..., 53 | |\n * | ISO week of year | I | 1, 2, ..., 53 | 7 |\n * | | Io | 1st, 2nd, ..., 53th | 7 |\n * | | II | 01, 02, ..., 53 | 7 |\n * | Day of month | d | 1, 2, ..., 31 | |\n * | | do | 1st, 2nd, ..., 31st | 7 |\n * | | dd | 01, 02, ..., 31 | |\n * | Day of year | D | 1, 2, ..., 365, 366 | 9 |\n * | | Do | 1st, 2nd, ..., 365th, 366th | 7 |\n * | | DD | 01, 02, ..., 365, 366 | 9 |\n * | | DDD | 001, 002, ..., 365, 366 | |\n * | | DDDD | ... | 3 |\n * | Day of week (formatting) | E..EEE | Mon, Tue, Wed, ..., Sun | |\n * | | EEEE | Monday, Tuesday, ..., Sunday | 2 |\n * | | EEEEE | M, T, W, T, F, S, S | |\n * | | EEEEEE | Mo, Tu, We, Th, Fr, Sa, Su | |\n * | ISO day of week (formatting) | i | 1, 2, 3, ..., 7 | 7 |\n * | | io | 1st, 2nd, ..., 7th | 7 |\n * | | ii | 01, 02, ..., 07 | 7 |\n * | | iii | Mon, Tue, Wed, ..., Sun | 7 |\n * | | iiii | Monday, Tuesday, ..., Sunday | 2,7 |\n * | | iiiii | M, T, W, T, F, S, S | 7 |\n * | | iiiiii | Mo, Tu, We, Th, Fr, Sa, Su | 7 |\n * | Local day of week (formatting) | e | 2, 3, 4, ..., 1 | |\n * | | eo | 2nd, 3rd, ..., 1st | 7 |\n * | | ee | 02, 03, ..., 01 | |\n * | | eee | Mon, Tue, Wed, ..., Sun | |\n * | | eeee | Monday, Tuesday, ..., Sunday | 2 |\n * | | eeeee | M, T, W, T, F, S, S | |\n * | | eeeeee | Mo, Tu, We, Th, Fr, Sa, Su | |\n * | Local day of week (stand-alone) | c | 2, 3, 4, ..., 1 | |\n * | | co | 2nd, 3rd, ..., 1st | 7 |\n * | | cc | 02, 03, ..., 01 | |\n * | | ccc | Mon, Tue, Wed, ..., Sun | |\n * | | cccc | Monday, Tuesday, ..., Sunday | 2 |\n * | | ccccc | M, T, W, T, F, S, S | |\n * | | cccccc | Mo, Tu, We, Th, Fr, Sa, Su | |\n * | AM, PM | a..aa | AM, PM | |\n * | | aaa | am, pm | |\n * | | aaaa | a.m., p.m. | 2 |\n * | | aaaaa | a, p | |\n * | AM, PM, noon, midnight | b..bb | AM, PM, noon, midnight | |\n * | | bbb | am, pm, noon, midnight | |\n * | | bbbb | a.m., p.m., noon, midnight | 2 |\n * | | bbbbb | a, p, n, mi | |\n * | Flexible day period | B..BBB | at night, in the morning, ... | |\n * | | BBBB | at night, in the morning, ... | 2 |\n * | | BBBBB | at night, in the morning, ... | |\n * | Hour [1-12] | h | 1, 2, ..., 11, 12 | |\n * | | ho | 1st, 2nd, ..., 11th, 12th | 7 |\n * | | hh | 01, 02, ..., 11, 12 | |\n * | Hour [0-23] | H | 0, 1, 2, ..., 23 | |\n * | | Ho | 0th, 1st, 2nd, ..., 23rd | 7 |\n * | | HH | 00, 01, 02, ..., 23 | |\n * | Hour [0-11] | K | 1, 2, ..., 11, 0 | |\n * | | Ko | 1st, 2nd, ..., 11th, 0th | 7 |\n * | | KK | 01, 02, ..., 11, 00 | |\n * | Hour [1-24] | k | 24, 1, 2, ..., 23 | |\n * | | ko | 24th, 1st, 2nd, ..., 23rd | 7 |\n * | | kk | 24, 01, 02, ..., 23 | |\n * | Minute | m | 0, 1, ..., 59 | |\n * | | mo | 0th, 1st, ..., 59th | 7 |\n * | | mm | 00, 01, ..., 59 | |\n * | Second | s | 0, 1, ..., 59 | |\n * | | so | 0th, 1st, ..., 59th | 7 |\n * | | ss | 00, 01, ..., 59 | |\n * | Fraction of second | S | 0, 1, ..., 9 | |\n * | | SS | 00, 01, ..., 99 | |\n * | | SSS | 000, 001, ..., 999 | |\n * | | SSSS | ... | 3 |\n * | Timezone (ISO-8601 w/ Z) | X | -08, +0530, Z | |\n * | | XX | -0800, +0530, Z | |\n * | | XXX | -08:00, +05:30, Z | |\n * | | XXXX | -0800, +0530, Z, +123456 | 2 |\n * | | XXXXX | -08:00, +05:30, Z, +12:34:56 | |\n * | Timezone (ISO-8601 w/o Z) | x | -08, +0530, +00 | |\n * | | xx | -0800, +0530, +0000 | |\n * | | xxx | -08:00, +05:30, +00:00 | 2 |\n * | | xxxx | -0800, +0530, +0000, +123456 | |\n * | | xxxxx | -08:00, +05:30, +00:00, +12:34:56 | |\n * | Timezone (GMT) | O...OOO | GMT-8, GMT+5:30, GMT+0 | |\n * | | OOOO | GMT-08:00, GMT+05:30, GMT+00:00 | 2 |\n * | Timezone (specific non-locat.) | z...zzz | GMT-8, GMT+5:30, GMT+0 | 6 |\n * | | zzzz | GMT-08:00, GMT+05:30, GMT+00:00 | 2,6 |\n * | Seconds timestamp | t | 512969520 | 7 |\n * | | tt | ... | 3,7 |\n * | Milliseconds timestamp | T | 512969520900 | 7 |\n * | | TT | ... | 3,7 |\n * | Long localized date | P | 04/29/1453 | 7 |\n * | | PP | Apr 29, 1453 | 7 |\n * | | PPP | April 29th, 1453 | 7 |\n * | | PPPP | Friday, April 29th, 1453 | 2,7 |\n * | Long localized time | p | 12:00 AM | 7 |\n * | | pp | 12:00:00 AM | 7 |\n * | | ppp | 12:00:00 AM GMT+2 | 7 |\n * | | pppp | 12:00:00 AM GMT+02:00 | 2,7 |\n * | Combination of date and time | Pp | 04/29/1453, 12:00 AM | 7 |\n * | | PPpp | Apr 29, 1453, 12:00:00 AM | 7 |\n * | | PPPppp | April 29th, 1453 at ... | 7 |\n * | | PPPPpppp| Friday, April 29th, 1453 at ... | 2,7 |\n * Notes:\n * 1. \"Formatting\" units (e.g. formatting quarter) in the default en-US locale\n * are the same as \"stand-alone\" units, but are different in some languages.\n * \"Formatting\" units are declined according to the rules of the language\n * in the context of a date. \"Stand-alone\" units are always nominative singular:\n *\n * `format(new Date(2017, 10, 6), 'do LLLL', {locale: cs}) //=> '6. listopad'`\n *\n * `format(new Date(2017, 10, 6), 'do MMMM', {locale: cs}) //=> '6. listopadu'`\n *\n * 2. Any sequence of the identical letters is a pattern, unless it is escaped by\n * the single quote characters (see below).\n * If the sequence is longer than listed in table (e.g. `EEEEEEEEEEE`)\n * the output will be the same as default pattern for this unit, usually\n * the longest one (in case of ISO weekdays, `EEEE`). Default patterns for units\n * are marked with \"2\" in the last column of the table.\n *\n * `format(new Date(2017, 10, 6), 'MMM') //=> 'Nov'`\n *\n * `format(new Date(2017, 10, 6), 'MMMM') //=> 'November'`\n *\n * `format(new Date(2017, 10, 6), 'MMMMM') //=> 'N'`\n *\n * `format(new Date(2017, 10, 6), 'MMMMMM') //=> 'November'`\n *\n * `format(new Date(2017, 10, 6), 'MMMMMMM') //=> 'November'`\n *\n * 3. Some patterns could be unlimited length (such as `yyyyyyyy`).\n * The output will be padded with zeros to match the length of the pattern.\n *\n * `format(new Date(2017, 10, 6), 'yyyyyyyy') //=> '00002017'`\n *\n * 4. `QQQQQ` and `qqqqq` could be not strictly numerical in some locales.\n * These tokens represent the shortest form of the quarter.\n *\n * 5. The main difference between `y` and `u` patterns are B.C. years:\n *\n * | Year | `y` | `u` |\n * |------|-----|-----|\n * | AC 1 | 1 | 1 |\n * | BC 1 | 1 | 0 |\n * | BC 2 | 2 | -1 |\n *\n * Also `yy` always returns the last two digits of a year,\n * while `uu` pads single digit years to 2 characters and returns other years unchanged:\n *\n * | Year | `yy` | `uu` |\n * |------|------|------|\n * | 1 | 01 | 01 |\n * | 14 | 14 | 14 |\n * | 376 | 76 | 376 |\n * | 1453 | 53 | 1453 |\n *\n * The same difference is true for local and ISO week-numbering years (`Y` and `R`),\n * except local week-numbering years are dependent on `options.weekStartsOn`\n * and `options.firstWeekContainsDate` (compare [getISOWeekYear]{@link https://date-fns.org/docs/getISOWeekYear}\n * and [getWeekYear]{@link https://date-fns.org/docs/getWeekYear}).\n *\n * 6. Specific non-location timezones are currently unavailable in `date-fns`,\n * so right now these tokens fall back to GMT timezones.\n *\n * 7. These patterns are not in the Unicode Technical Standard #35:\n * - `i`: ISO day of week\n * - `I`: ISO week of year\n * - `R`: ISO week-numbering year\n * - `t`: seconds timestamp\n * - `T`: milliseconds timestamp\n * - `o`: ordinal number modifier\n * - `P`: long localized date\n * - `p`: long localized time\n *\n * 8. `YY` and `YYYY` tokens represent week-numbering years but they are often confused with years.\n * You should enable `options.useAdditionalWeekYearTokens` to use them. See: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md\n *\n * 9. `D` and `DD` tokens represent days of the year but they are often confused with days of the month.\n * You should enable `options.useAdditionalDayOfYearTokens` to use them. See: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md\n *\n * @param {Date|Number} date - the original date\n * @param {String} format - the string of tokens\n * @param {Object} [options] - an object with options.\n * @param {Locale} [options.locale=defaultLocale] - the locale object. See [Locale]{@link https://date-fns.org/docs/Locale}\n * @param {0|1|2|3|4|5|6} [options.weekStartsOn=0] - the index of the first day of the week (0 - Sunday)\n * @param {Number} [options.firstWeekContainsDate=1] - the day of January, which is\n * @param {Boolean} [options.useAdditionalWeekYearTokens=false] - if true, allows usage of the week-numbering year tokens `YY` and `YYYY`;\n * see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md\n * @param {Boolean} [options.useAdditionalDayOfYearTokens=false] - if true, allows usage of the day of year tokens `D` and `DD`;\n * see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md\n * @returns {String} the formatted date string\n * @throws {TypeError} 2 arguments required\n * @throws {RangeError} `date` must not be Invalid Date\n * @throws {RangeError} `options.locale` must contain `localize` property\n * @throws {RangeError} `options.locale` must contain `formatLong` property\n * @throws {RangeError} `options.weekStartsOn` must be between 0 and 6\n * @throws {RangeError} `options.firstWeekContainsDate` must be between 1 and 7\n * @throws {RangeError} use `yyyy` instead of `YYYY` for formatting years using [format provided] to the input [input provided]; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md\n * @throws {RangeError} use `yy` instead of `YY` for formatting years using [format provided] to the input [input provided]; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md\n * @throws {RangeError} use `d` instead of `D` for formatting days of the month using [format provided] to the input [input provided]; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md\n * @throws {RangeError} use `dd` instead of `DD` for formatting days of the month using [format provided] to the input [input provided]; see: https://github.com/date-fns/date-fns/blob/master/docs/unicodeTokens.md\n * @throws {RangeError} format string contains an unescaped latin alphabet character\n *\n * @example\n * // Represent 11 February 2014 in middle-endian format:\n * const result = format(new Date(2014, 1, 11), 'MM/dd/yyyy')\n * //=> '02/11/2014'\n *\n * @example\n * // Represent 2 July 2014 in Esperanto:\n * import { eoLocale } from 'date-fns/locale/eo'\n * const result = format(new Date(2014, 6, 2), \"do 'de' MMMM yyyy\", {\n * locale: eoLocale\n * })\n * //=> '2-a de julio 2014'\n *\n * @example\n * // Escape string by single quote characters:\n * const result = format(new Date(2014, 6, 2, 15), \"h 'o''clock'\")\n * //=> \"3 o'clock\"\n */\n\nexport default function format(dirtyDate, dirtyFormatStr, options) {\n var _ref, _options$locale, _ref2, _ref3, _ref4, _options$firstWeekCon, _options$locale2, _options$locale2$opti, _defaultOptions$local, _defaultOptions$local2, _ref5, _ref6, _ref7, _options$weekStartsOn, _options$locale3, _options$locale3$opti, _defaultOptions$local3, _defaultOptions$local4;\n\n requiredArgs(2, arguments);\n var formatStr = String(dirtyFormatStr);\n var defaultOptions = getDefaultOptions();\n var locale = (_ref = (_options$locale = options === null || options === void 0 ? void 0 : options.locale) !== null && _options$locale !== void 0 ? _options$locale : defaultOptions.locale) !== null && _ref !== void 0 ? _ref : defaultLocale;\n var firstWeekContainsDate = toInteger((_ref2 = (_ref3 = (_ref4 = (_options$firstWeekCon = options === null || options === void 0 ? void 0 : options.firstWeekContainsDate) !== null && _options$firstWeekCon !== void 0 ? _options$firstWeekCon : options === null || options === void 0 ? void 0 : (_options$locale2 = options.locale) === null || _options$locale2 === void 0 ? void 0 : (_options$locale2$opti = _options$locale2.options) === null || _options$locale2$opti === void 0 ? void 0 : _options$locale2$opti.firstWeekContainsDate) !== null && _ref4 !== void 0 ? _ref4 : defaultOptions.firstWeekContainsDate) !== null && _ref3 !== void 0 ? _ref3 : (_defaultOptions$local = defaultOptions.locale) === null || _defaultOptions$local === void 0 ? void 0 : (_defaultOptions$local2 = _defaultOptions$local.options) === null || _defaultOptions$local2 === void 0 ? void 0 : _defaultOptions$local2.firstWeekContainsDate) !== null && _ref2 !== void 0 ? _ref2 : 1); // Test if weekStartsOn is between 1 and 7 _and_ is not NaN\n\n if (!(firstWeekContainsDate >= 1 && firstWeekContainsDate <= 7)) {\n throw new RangeError('firstWeekContainsDate must be between 1 and 7 inclusively');\n }\n\n var weekStartsOn = toInteger((_ref5 = (_ref6 = (_ref7 = (_options$weekStartsOn = options === null || options === void 0 ? void 0 : options.weekStartsOn) !== null && _options$weekStartsOn !== void 0 ? _options$weekStartsOn : options === null || options === void 0 ? void 0 : (_options$locale3 = options.locale) === null || _options$locale3 === void 0 ? void 0 : (_options$locale3$opti = _options$locale3.options) === null || _options$locale3$opti === void 0 ? void 0 : _options$locale3$opti.weekStartsOn) !== null && _ref7 !== void 0 ? _ref7 : defaultOptions.weekStartsOn) !== null && _ref6 !== void 0 ? _ref6 : (_defaultOptions$local3 = defaultOptions.locale) === null || _defaultOptions$local3 === void 0 ? void 0 : (_defaultOptions$local4 = _defaultOptions$local3.options) === null || _defaultOptions$local4 === void 0 ? void 0 : _defaultOptions$local4.weekStartsOn) !== null && _ref5 !== void 0 ? _ref5 : 0); // Test if weekStartsOn is between 0 and 6 _and_ is not NaN\n\n if (!(weekStartsOn >= 0 && weekStartsOn <= 6)) {\n throw new RangeError('weekStartsOn must be between 0 and 6 inclusively');\n }\n\n if (!locale.localize) {\n throw new RangeError('locale must contain localize property');\n }\n\n if (!locale.formatLong) {\n throw new RangeError('locale must contain formatLong property');\n }\n\n var originalDate = toDate(dirtyDate);\n\n if (!isValid(originalDate)) {\n throw new RangeError('Invalid time value');\n } // Convert the date in system timezone to the same date in UTC+00:00 timezone.\n // This ensures that when UTC functions will be implemented, locales will be compatible with them.\n // See an issue about UTC functions: https://github.com/date-fns/date-fns/issues/376\n\n\n var timezoneOffset = getTimezoneOffsetInMilliseconds(originalDate);\n var utcDate = subMilliseconds(originalDate, timezoneOffset);\n var formatterOptions = {\n firstWeekContainsDate: firstWeekContainsDate,\n weekStartsOn: weekStartsOn,\n locale: locale,\n _originalDate: originalDate\n };\n var result = formatStr.match(longFormattingTokensRegExp).map(function (substring) {\n var firstCharacter = substring[0];\n\n if (firstCharacter === 'p' || firstCharacter === 'P') {\n var longFormatter = longFormatters[firstCharacter];\n return longFormatter(substring, locale.formatLong);\n }\n\n return substring;\n }).join('').match(formattingTokensRegExp).map(function (substring) {\n // Replace two single quote characters with one single quote character\n if (substring === \"''\") {\n return \"'\";\n }\n\n var firstCharacter = substring[0];\n\n if (firstCharacter === \"'\") {\n return cleanEscapedString(substring);\n }\n\n var formatter = formatters[firstCharacter];\n\n if (formatter) {\n if (!(options !== null && options !== void 0 && options.useAdditionalWeekYearTokens) && isProtectedWeekYearToken(substring)) {\n throwProtectedError(substring, dirtyFormatStr, String(dirtyDate));\n }\n\n if (!(options !== null && options !== void 0 && options.useAdditionalDayOfYearTokens) && isProtectedDayOfYearToken(substring)) {\n throwProtectedError(substring, dirtyFormatStr, String(dirtyDate));\n }\n\n return formatter(utcDate, substring, locale.localize, formatterOptions);\n }\n\n if (firstCharacter.match(unescapedLatinCharacterRegExp)) {\n throw new RangeError('Format string contains an unescaped latin alphabet character `' + firstCharacter + '`');\n }\n\n return substring;\n }).join('');\n return result;\n}\n\nfunction cleanEscapedString(input) {\n var matched = input.match(escapedStringRegExp);\n\n if (!matched) {\n return input;\n }\n\n return matched[1].replace(doubleQuoteRegExp, \"'\");\n}","import toInteger from \"../_lib/toInteger/index.js\";\nimport toDate from \"../toDate/index.js\";\nimport requiredArgs from \"../_lib/requiredArgs/index.js\";\n/**\n * @name addDays\n * @category Day Helpers\n * @summary Add the specified number of days to the given date.\n *\n * @description\n * Add the specified number of days to the given date.\n *\n * @param {Date|Number} date - the date to be changed\n * @param {Number} amount - the amount of days to be added. Positive decimals will be rounded using `Math.floor`, decimals less than zero will be rounded using `Math.ceil`.\n * @returns {Date} - the new date with the days added\n * @throws {TypeError} - 2 arguments required\n *\n * @example\n * // Add 10 days to 1 September 2014:\n * const result = addDays(new Date(2014, 8, 1), 10)\n * //=> Thu Sep 11 2014 00:00:00\n */\n\nexport default function addDays(dirtyDate, dirtyAmount) {\n requiredArgs(2, arguments);\n var date = toDate(dirtyDate);\n var amount = toInteger(dirtyAmount);\n\n if (isNaN(amount)) {\n return new Date(NaN);\n }\n\n if (!amount) {\n // If 0 days, no-op to avoid changing times in the hour before end of DST\n return date;\n }\n\n date.setDate(date.getDate() + amount);\n return date;\n}","\r\nimport {styled, Typography} from '@mui/material';\r\nimport { colors } from '../../../options/colors';\r\n\r\nexport const Container = styled('div')(() => ({}));\r\n\r\nexport const RowContainer = styled('div')(() => ({\r\n display: 'flex',\r\n flexDirection: 'row',\r\n justifyContent: 'space-between',\r\n}));\r\n\r\nexport const SecondaryTitle = styled(Typography)(({ theme }) => ({\r\n ...theme.typography.h2,\r\n fontSize: 18,\r\n color: colors.white,\r\n}));\r\n\r\nexport const SubscriptionDetails = styled(Typography)(({ theme }) => ({\r\n ...theme.typography.body1,\r\n color: colors.primaryGrey,\r\n marginTop: 20,\r\n}));\r\n\r\nexport const PaymentAmount = styled(Typography)(({ theme }) => ({\r\n ...theme.typography.h2,\r\n fontSize: 18,\r\n color: colors.primaryOrange,\r\n marginTop: 20,\r\n}));\r\n","import format from 'date-fns/format'\r\nimport addDays from 'date-fns/addDays'\r\nimport { Container, RowContainer, SecondaryTitle, SubscriptionDetails, PaymentAmount } from './SubscriptionChangeForm.styles';\r\nimport { currencyCodeToSymbol } from '../../../utils/helpers/currencyHelper';\r\n\r\nconst SubscriptionChangeForm = ({ subscription, isDowngrade }) =>\r\n{\r\n if (isDowngrade)\r\n {\r\n return (\r\n \r\n \r\n Annual subscription ends\r\n First monthly payment due\r\n \r\n \r\n {format(subscription.expires, 'd MMMM yyyy')}\r\n {`${format(addDays(subscription.expires, 1), 'd MMMM yyyy')} (${currencyCodeToSymbol(subscription.changeTo?.currency)}${subscription.changeTo?.unit_amount / 100} a month)`}\r\n \r\n \r\n );\r\n }\r\n\r\n // If this is an upgrade - confirm that the user want to go ahead with this as the request will instantly update the current month subscription\r\n\r\n return (\r\n \r\n \r\n Subscription frequency\r\n Annual amount\r\n \r\n \r\n Annual\r\n {`${currencyCodeToSymbol(subscription.changeTo.currency)} ${subscription.changeTo.unit_amount / 100}`}\r\n \r\n \r\n )\r\n\r\n}\r\n\r\nexport default SubscriptionChangeForm;\r\n","import { styled } from '@mui/material';\r\n\r\nexport const HeaderContainer = styled('div')(() => ({\r\n display: 'flex',\r\n justifyContent: 'space-between',\r\n}));\r\n\r\nexport const StyledSectionContainer = styled('div')(() => ({\r\n marginBottom: 40,\r\n}));\r\n\r\nexport const FirstPlayerContainer = styled('div')(({ theme }) => ({\r\n display: 'flex',\r\n '& > div:first-of-type': {\r\n flex: 1,\r\n },\r\n '& > div:last-of-type': {\r\n width: '33%',\r\n marginLeft: 20,\r\n },\r\n [theme.breakpoints.down('md')]: {\r\n flexDirection: 'column',\r\n '& > div:first-of-type': {\r\n flex: 'unset',\r\n width: 'auto',\r\n marginBottom: 20,\r\n },\r\n '& > div:last-of-type': {\r\n width: 'auto',\r\n marginLeft: 0,\r\n },\r\n },\r\n}));\r\n\r\nexport const StatsWrapper = styled('div')(({ theme }) => ({\r\n display: 'flex',\r\n [theme.breakpoints.down('sm')]: {\r\n flexDirection: 'column',\r\n },\r\n}));\r\n\r\nexport const StatsLeftContainer = styled('div')(({ theme }) => ({\r\n minWidth: 185,\r\n marginRight: 30,\r\n width: '30%',\r\n [theme.breakpoints.down('sm')]: {\r\n width: 'auto',\r\n marginRight: 0,\r\n marginBottom: 20,\r\n },\r\n}));\r\n\r\nexport const StatsRightContainer = styled('div')(() => ({\r\n flex: 1,\r\n}));\r\n\r\nexport const AvatarContainer = styled('div')(() => ({\r\n marginBottom: 30,\r\n}));\r\n\r\nexport const RadarChartContainer = styled('div')(({ theme }) => ({\r\n [theme.breakpoints.down('md')]: {\r\n maxWidth: 300,\r\n margin: 'auto',\r\n },\r\n [theme.breakpoints.down('xs')]: {\r\n maxWidth: 'unset',\r\n width: '100%',\r\n },\r\n '@media print': {\r\n display: 'none',\r\n },\r\n}));\r\n\r\n\r\nexport const BarChartIncLegendContainer = styled('div')(() => ({\r\n '@media print': {\r\n width: `500px !important`,\r\n // display: 'none',\r\n }\r\n}));\r\n\r\n\r\nexport const BarChartContainer = styled('div')(() => ({\r\n '@media print': {\r\n // width: '60% !important',\r\n }\r\n}));\r\n","import { useEffect, useContext, useState } from 'react';\r\nimport { useParams } from \"react-router-dom\";\r\nimport\r\n{\r\n SubscriptionContainer,\r\n} from './Products.styles';\r\nimport { routes } from '../../../options/routes';\r\nimport MainWrapper from '../../../components/Wrappers/MainWrapper/MainWrapper';\r\nimport Title from '../../../components/Typography/Title/Title';\r\nimport SectionContainer from '../../../components/Containers/SectionContainer/SectionContainer';\r\nimport SubscriptionsList from '../../../components/Tables/SubscriptionsList/SubscriptionsList';\r\nimport RezzilPlayerSubscriptionModal from '../../../components/RezzilPlayerSubscribe/SubscriptionModal/SubscriptionModal';\r\nimport StandardModal from '../../../components/Modals/StandardModal/StandardModal';\r\n// Contexts\r\nimport { BaseContext } from '../../../providers/Global/BaseProvider';\r\nimport { ProductsContext } from '../../../providers/Admin/ProductsProvider';\r\nimport SubscriptionChangeForm from '../../../components/Forms/SubscriptionChangeForm/SubscriptionChangeForm';\r\nimport { useCallback } from 'react';\r\n\r\n//API\r\nimport { downgradeSubscription, getSubscriptions, subscriptionRenew, upgradeSubscription } from '../../../api';\r\nimport { getClubId } from '../../../utils/helpers/clubHelper';\r\nimport Grid2 from '@mui/material/Unstable_Grid2/Grid2';\r\nimport { Box, Typography } from '@mui/material';\r\nimport { FirstPlayerContainer } from '../Stats/ClubStats/ClubStats.styles';\r\nimport CustomTableWrapper from '../../../components/Tables/CustomTableWrapper/CustomTableWrapper';\r\nimport { StyledTable, StyledTableBody, StyledTableCell, StyledTableRow } from '../../../components/Tables/SubscriptionsList/SubscriptionsList.styles';\r\nimport CustomTableHead from '../../../components/Tables/CustomTableHead/CustomTableHead';\r\nimport { formatStandardDateString } from '../../../utils/helpers/formatDateString';\r\nimport { hasCorrectRole } from '../../../utils/helpers/licenceHelper';\r\n\r\n\r\nconst Products = () =>\r\n{\r\n const baseContext = useContext(BaseContext);\r\n const { checkoutRedirect } = useParams();\r\n const [refetchedLicences, setRefetchedLicences] = useState(false);\r\n const productsContext = useContext(ProductsContext);\r\n const [indexProductsList, setIndexProductsList] = useState([]);\r\n const [rezzilPlayerProductsList, setRezzilPlayerProductsList] = useState([]);\r\n const [stripeProducts, setStripeProducts] = useState();\r\n const [subscriptionChangeOpen, setSubscriptionChangeOpen] = useState(false);\r\n const [currentSubscription, setCurrentSubscription] = useState();\r\n const [dataLoading, setDataLoading] = useState(true);\r\n const [autoRenewLoading, setAutoRenewLoading] = useState(false);\r\n const [licencesModalOpen, setLicencesModalOpen] = useState(false);\r\n const [error, setError] = useState({\r\n show: false,\r\n message: '',\r\n });\r\n const [subscriptionData, setSubscriptionData] = useState(null);\r\n\r\n const refetchBaseData = useCallback(() =>\r\n {\r\n baseContext.getBaseData();\r\n }, [baseContext])\r\n\r\n useEffect(() =>\r\n {\r\n if (checkoutRedirect && !refetchedLicences)\r\n {\r\n setRefetchedLicences(true);\r\n setTimeout(() =>\r\n {\r\n refetchBaseData();\r\n }, [5000]);\r\n }\r\n }, [checkoutRedirect, refetchBaseData, refetchedLicences]);\r\n\r\n useEffect(() =>\r\n {\r\n if (!baseContext.baseData.loading && !productsContext.productsData.loading)\r\n {\r\n setDataLoading(false);\r\n\r\n setIndexProductsList(productsContext.productsData.indexSubscriptions);\r\n console.log('list', productsContext.productsData.indexSubscriptions);\r\n setRezzilPlayerProductsList(productsContext.productsData.rezzilPlayerSubscriptions);\r\n setStripeProducts(productsContext.productsData.products);\r\n }\r\n\r\n }, [baseContext, productsContext]);\r\n\r\n useEffect(async () =>\r\n {\r\n if (!subscriptionData)\r\n {\r\n const clubId = await getClubId();\r\n const subscriptionResponse = await getSubscriptions(clubId);\r\n\r\n if (subscriptionResponse.success)\r\n {\r\n let subArray = [];\r\n for (const [userId, subRow] of Object.entries(subscriptionResponse.data))\r\n {\r\n\r\n if (subRow.data.length)\r\n {\r\n subArray.push({ userId, data: subRow.data })\r\n console.log(`stuff ${userId}`, subRow)\r\n }\r\n }\r\n console.log('sub', clubId, subArray);\r\n setSubscriptionData(subArray)\r\n }\r\n }\r\n });\r\n const handleBannerClose = () =>\r\n {\r\n setError({\r\n show: false,\r\n message: '',\r\n });\r\n };\r\n\r\n const handleAddLicenceClick = () =>\r\n {\r\n window.location.href = routes.indexLicences;\r\n }\r\n\r\n const handleSubscriptionChangeClick = (currentSubscriptionId) =>\r\n {\r\n const subscription = indexProductsList.concat(rezzilPlayerProductsList).find((subscription) => subscription.id === currentSubscriptionId);\r\n setCurrentSubscription(subscription);\r\n setSubscriptionChangeOpen(true);\r\n };\r\n\r\n const handleAutoRenewChange = async (id) =>\r\n {\r\n // Update autoRenew data - convert checked bool to int (either 0 or 1)\r\n const subscriptionUpdate = indexProductsList.concat(rezzilPlayerProductsList).find((subscription) => subscription.id === id);\r\n\r\n // Trigger API call\r\n if (!subscriptionUpdate)\r\n {\r\n return;\r\n }\r\n setAutoRenewLoading(id);\r\n await subscriptionRenew({\r\n subscriptionId: id,\r\n renew: subscriptionUpdate.autoRenew === 0,\r\n });\r\n await productsContext.getProductsData(baseContext.baseData.clubProfile.id);\r\n setAutoRenewLoading(false);\r\n };\r\n\r\n const handleAddRezzilPlayerLicenceClick = () => setLicencesModalOpen(true);\r\n\r\n const handleLicencesModalClose = () => setLicencesModalOpen(false);\r\n const handleChangeSubscription = async () =>\r\n {\r\n const isDowngrade = currentSubscription.frequency === 'Annual';\r\n if (isDowngrade)\r\n {\r\n await downgradeSubscription({\r\n subscriptionId: currentSubscription.id,\r\n newPriceId: currentSubscription.changeTo?.id\r\n })\r\n setError({\r\n show: false,\r\n message: 'Subscription successfully downgraded',\r\n });\r\n } else\r\n {\r\n await upgradeSubscription({\r\n subscriptionId: currentSubscription.id,\r\n newPriceId: currentSubscription.changeTo?.id\r\n });\r\n setError({\r\n show: false,\r\n message: 'Subscription successfully upgraded',\r\n });\r\n }\r\n\r\n setSubscriptionChangeOpen(false);\r\n setCurrentSubscription(undefined);\r\n };\r\n\r\n return (\r\n <>\r\n {\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {hasCorrectRole(['REZZIL_SUPER_ADMIN']) && subscriptionData?.length > 0 &&\r\n \r\n \r\n \r\n \r\n \r\n \r\n {subscriptionData.length && subscriptionData[0].data.length && subscriptionData[0].data.map((licence) =>\r\n {\r\n return (\r\n <>\r\n \r\n \r\n {licence.items.data[0].plan.metadata.license_type}\r\n \r\n \r\n {licence.object}\r\n \r\n \r\n {formatStandardDateString(licence.current_period_start)}\r\n \r\n \r\n {formatStandardDateString(licence.current_period_end)}\r\n \r\n \r\n {licence.status}\r\n \r\n \r\n \r\n {JSON.stringify(licence, null, 2)}
\r\n \r\n \r\n \r\n >\r\n );\r\n })}\r\n \r\n \r\n \r\n \r\n \r\n }\r\n {\r\n licencesModalOpen &&\r\n \r\n \r\n \r\n }\r\n {\r\n subscriptionChangeOpen &&\r\n \r\n \r\n \r\n }\r\n\r\n \r\n }\r\n >\r\n );\r\n};\r\n\r\nexport default Products;\r\n","import {styled} from '@mui/material';\r\n\r\nexport const TableContainer = styled('div')(() => ({\r\n marginBottom: 40,\r\n '&:last-of-type': {\r\n marginBottom: 0,\r\n },\r\n}));\r\n","import {\r\n styled,\r\n Table,\r\n} from '@mui/material';\r\nimport {\r\n StyledTableBody,\r\n StyledTableRow,\r\n} from '../CustomTableWrapper/CustomTableWrapper.styles';\r\nimport {StyledTableCell} from '../CustomTableHead/CustomTableHead.styles';\r\n\r\nexport const StyledTable = styled(Table)(() => ({\r\n '& .MuiTableCell-root': {\r\n '&:nth-of-type(5)': {\r\n width: 50,\r\n },\r\n '&:last-of-type': {\r\n width: 50,\r\n },\r\n },\r\n}));\r\n\r\nexport {\r\n StyledTableBody,\r\n StyledTableRow,\r\n StyledTableCell,\r\n};\r\n\r\nexport const InlineFieldContainer = styled('div')(({ theme }) => ({\r\n display: 'flex',\r\n justifyContent: 'space-between',\r\n '& > div:nth-of-type(1)': {\r\n display: 'inline-block',\r\n width: '47%',\r\n },\r\n '& > div:nth-of-type(2)': {\r\n display: 'inline-block',\r\n width: '47%',\r\n },\r\n [theme.breakpoints.down('sm')]: {\r\n flexDirection: 'column',\r\n justifyContent: 'unset',\r\n '& > div': {\r\n width: '100% !important',\r\n }\r\n },\r\n}));\r\n\r\nexport const FieldContainer = styled('div')(() => ({\r\n marginBottom: 20,\r\n}));\r\n","import {useState, useEffect} from 'react';\r\nimport {\r\n StyledTable,\r\n StyledTableBody,\r\n StyledTableRow,\r\n StyledTableCell,\r\n InlineFieldContainer,\r\n FieldContainer,\r\n} from './PaymentMethodsList.styles';\r\nimport {paymentMethodColumns} from '../../../options/tableColumns';\r\nimport CustomTableWrapper from '../CustomTableWrapper/CustomTableWrapper';\r\nimport CustomTableHead from '../CustomTableHead/CustomTableHead';\r\nimport CustomTextField from '../../Inputs/CustomTextField/CustomTextField';\r\nimport StatusPill from '../../Pills/StatusPill/StatusPill';\r\nimport IconButton from '../../Buttons/IconButton/IconButton';\r\nimport StandardModal from '../../Modals/StandardModal/StandardModal';\r\nimport {EditOutlined, DeleteOutlined} from '@mui/icons-material';\r\nimport FieldError\r\n from '../../Inputs/FieldError/FieldError';\r\n// Helpers\r\nimport {getComparator, stableSort, handleRequestSort} from '../../../utils/tableSortHelpers/tableSortHelpers';\r\nimport {DeleteText} from '../TeamMembersList/TeamMembersList.styles';\r\n\r\nconst PaymentMethodsList = ({\r\n paymentMethods,\r\n handleEditSubmit,\r\n formData,\r\n setFormData,\r\n formErrors,\r\n setFormErrors,\r\n editLoading,\r\n handleDelete,\r\n deleteLoading,\r\n}) => {\r\n const [order, setOrder] = useState('asc');\r\n const [orderBy, setOrderBy] = useState('');\r\n const [formModalOpen, setFormModalOpen] = useState(false);\r\n const [deleteModalOpen, setDeleteModalOpen] = useState(false);\r\n const [deleteMethod, setDeleteMethod] = useState({});\r\n const [cardExpiryMonth, setCardExpiryMonth] = useState();\r\n const [cardExpiryYear, setCardExpiryYear] = useState();\r\n\r\n useEffect(() => {\r\n setCardExpiryMonth(formData.expiryMonth);\r\n setCardExpiryYear(formData.expiryYear);\r\n }, [formData]);\r\n\r\n const handleFormModalClose = () => {\r\n // Reset state back to original values\r\n setFormModalOpen(false);\r\n setFormData({});\r\n setFormErrors();\r\n };\r\n\r\n const handleFormModalOpen = id => {\r\n // Find index of item with matching id and pass those details into modal\r\n const index = paymentMethods.findIndex(el => el.id === id);\r\n setFormData(paymentMethods[index]);\r\n setFormModalOpen(true);\r\n };\r\n\r\n const handleFormModalSubmit = async () => {\r\n const result = await handleEditSubmit(formData.id, Number(cardExpiryMonth), Number(cardExpiryYear));\r\n if (result) {\r\n handleFormModalClose();\r\n }\r\n };\r\n\r\n const handleDeleteModalClose = () => {\r\n setDeleteModalOpen(false);\r\n setDeleteMethod({});\r\n };\r\n\r\n const handleDeleteModalOpen = id => {\r\n const index = paymentMethods.findIndex(el => el.id === id);\r\n setDeleteMethod(paymentMethods[index]);\r\n setDeleteModalOpen(true);\r\n };\r\n\r\n const handleDeleteModalSubmit = async () => {\r\n const result = await handleDelete(deleteMethod.id);\r\n if (result) {\r\n handleDeleteModalClose();\r\n }\r\n };\r\n\r\n return (\r\n <>\r\n \r\n \r\n handleRequestSort(e, id, orderBy, order, setOrder, setOrderBy)}\r\n columnHeadings={paymentMethodColumns}\r\n />\r\n \r\n {\r\n paymentMethods.length > 0 &&\r\n stableSort(paymentMethods, getComparator(order, orderBy))\r\n .map(({id, name, expiry, status, type}) => (\r\n \r\n \r\n {name}\r\n \r\n \r\n {expiry}\r\n \r\n \r\n \r\n \r\n \r\n {type}\r\n \r\n \r\n {\r\n status === 'Active' &&\r\n }\r\n onClick={() => handleFormModalOpen(id)}\r\n />\r\n }\r\n \r\n \r\n }\r\n onClick={() => handleDeleteModalOpen(id)}\r\n />\r\n \r\n \r\n ))\r\n }\r\n \r\n \r\n \r\n {\r\n formModalOpen &&\r\n \r\n \r\n Edit Payment Method {formData.name}\r\n
\r\n \r\n \r\n setCardExpiryMonth(event.target.value)}\r\n type={'text'}\r\n value={cardExpiryMonth}\r\n />\r\n \r\n \r\n setCardExpiryYear(event.target.value)}\r\n type={'text'}\r\n value={cardExpiryYear}\r\n />\r\n \r\n \r\n {formErrors && }\r\n \r\n }\r\n {\r\n deleteModalOpen &&\r\n \r\n \r\n Are you sure you want to delete {deleteMethod.name}?\r\n Once confirmed, this action cannot be undone.\r\n \r\n \r\n }\r\n >\r\n );\r\n};\r\n\r\nexport default PaymentMethodsList;\r\n","import {\r\n styled,\r\n Table,\r\n} from '@mui/material';\r\nimport {\r\n StyledTableBody,\r\n StyledTableRow,\r\n} from '../CustomTableWrapper/CustomTableWrapper.styles';\r\nimport {StyledTableCell} from '../CustomTableHead/CustomTableHead.styles';\r\n\r\nexport const StyledTable = styled(Table)(() => ({\r\n '& .MuiTableCell-root': {\r\n '&:last-of-type': {\r\n width: 50,\r\n },\r\n },\r\n}));\r\n\r\nexport {\r\n StyledTableBody,\r\n StyledTableRow,\r\n StyledTableCell,\r\n};\r\n","import { useState } from 'react';\r\nimport\r\n{\r\n StyledTable,\r\n StyledTableBody,\r\n StyledTableRow,\r\n StyledTableCell,\r\n} from './InvoicesList.styles';\r\nimport { invoicesColumns } from '../../../options/tableColumns';\r\nimport CustomTableWrapper from '../CustomTableWrapper/CustomTableWrapper';\r\nimport CustomTableHead from '../CustomTableHead/CustomTableHead';\r\nimport IconButton from '../../Buttons/IconButton/IconButton';\r\nimport { FileDownloadOutlined } from '@mui/icons-material';\r\n\r\n// Helpers\r\nimport { getComparator, stableSort, handleRequestSort } from '../../../utils/tableSortHelpers/tableSortHelpers';\r\nimport { formatStandardDateString } from '../../../utils/helpers/formatDateString';\r\nimport { Box } from '@mui/material';\r\nimport { colors } from '../../../options/colors';\r\n\r\nconst InvoicesList = ({ invoicesList }) =>\r\n{\r\n const [order, setOrder] = useState('asc');\r\n const [orderBy, setOrderBy] = useState('');\r\n\r\n const handleDownloadClick = link =>\r\n {\r\n window.open(link, '_blank');\r\n };\r\n\r\n return (\r\n <>\r\n \r\n \r\n handleRequestSort(e, id, orderBy, order, setOrder, setOrderBy)}\r\n columnHeadings={invoicesColumns}\r\n />\r\n \r\n {\r\n invoicesList.length > 0 &&\r\n stableSort(invoicesList, getComparator(order, orderBy))\r\n .map(({ id, date, docId, docType, billedAmount, status, link }) => (\r\n \r\n \r\n {formatStandardDateString(date, true)}\r\n \r\n \r\n {docId}\r\n \r\n \r\n {docType}\r\n \r\n \r\n {billedAmount}\r\n \r\n \r\n {status === 'paid' &&\r\n PAID\r\n }\r\n {status === 'failed' &&\r\n FAILED\r\n }\r\n \r\n \r\n }\r\n onClick={() => handleDownloadClick(link)}\r\n />\r\n \r\n \r\n ))\r\n }\r\n \r\n \r\n \r\n >\r\n );\r\n};\r\n\r\nexport default InvoicesList;\r\n","import toDate from \"../toDate/index.js\";\nimport requiredArgs from \"../_lib/requiredArgs/index.js\";\n/**\n * @name isPast\n * @category Common Helpers\n * @summary Is the given date in the past?\n * @pure false\n *\n * @description\n * Is the given date in the past?\n *\n * > ⚠️ Please note that this function is not present in the FP submodule as\n * > it uses `Date.now()` internally hence impure and can't be safely curried.\n *\n * @param {Date|Number} date - the date to check\n * @returns {Boolean} the date is in the past\n * @throws {TypeError} 1 argument required\n *\n * @example\n * // If today is 6 October 2014, is 2 July 2014 in the past?\n * const result = isPast(new Date(2014, 6, 2))\n * //=> true\n */\n\nexport default function isPast(dirtyDate) {\n requiredArgs(1, arguments);\n return toDate(dirtyDate).getTime() < Date.now();\n}","import { useEffect, useState, useCallback, createContext, useContext } from 'react';\r\nimport isPast from 'date-fns/isPast'\r\nimport fromUnixTime from 'date-fns/fromUnixTime'\r\nimport { routes } from '../../options/routes';\r\nimport { getPaymentMethods, getInvoices } from '../../api';\r\nimport { BaseContext } from '../Global/BaseProvider';\r\n\r\nconst BillingContext = createContext({});\r\n\r\nconst BillingProvider = ({ children }) =>\r\n{\r\n const baseContext = useContext(BaseContext);\r\n const [billingData, setBillingData] = useState({\r\n loading: true,\r\n payments: null,\r\n invoices: null,\r\n apiError: false,\r\n });\r\n\r\n const getBillingData = useCallback(async (clubId) =>\r\n {\r\n // Only trigger API call for admin billing route\r\n const activeRoute = window.location.pathname;\r\n if (activeRoute !== routes.adminBilling) return;\r\n\r\n try\r\n {\r\n const paymentMethods = await getPaymentMethods();\r\n const invoices = await getInvoices(clubId);\r\n if (!paymentMethods || !paymentMethods.success || !invoices || !invoices.success)\r\n {\r\n setBillingData({\r\n loading: false,\r\n payments: null,\r\n invoices: null,\r\n apiError: true,\r\n });\r\n return;\r\n }\r\n\r\n const formattedPaymentMethods = paymentMethods.data.map((method) =>\r\n {\r\n const expiryDate = new Date(method?.card?.exp_year, method?.card?.exp_month - 1, 0);\r\n const cardType = method?.card?.funding;\r\n const cardBrand = method?.card?.brand;\r\n return {\r\n id: method.id,\r\n name: `${cardBrand.charAt(0).toUpperCase() + cardBrand.slice(1)} ****${method?.card?.last4}`,\r\n expiry: `${method?.card?.exp_month}/${method?.card?.exp_year}`,\r\n expiryMonth: method?.card?.exp_month,\r\n expiryYear: method?.card?.exp_year,\r\n status: isPast(expiryDate) ? 'Expired' : 'Active',\r\n type: `${cardType.charAt(0).toUpperCase() + cardType.slice(1)} Card`,\r\n };\r\n });\r\n\r\n let invoicesArray = [];\r\n if (typeof invoices.data === 'object')\r\n {\r\n Object.values(invoices.data).forEach((arr) =>\r\n {\r\n invoicesArray = invoicesArray.concat(arr.data.filter(invoice => invoice.status !== 'void' && invoice.status !== 'open'));\r\n });\r\n } else\r\n {\r\n invoicesArray.concat(invoices.data);\r\n }\r\n\r\n const formattedInvoices = invoicesArray.map((invoice) =>\r\n {\r\n return {\r\n id: invoice.id,\r\n date: fromUnixTime(invoice.created),\r\n docId: invoice.number,\r\n status: invoice.status,\r\n docType: 'Invoice',\r\n billedAmount: `£${invoice.total / 100}`,\r\n link: invoice.invoice_pdf,\r\n }\r\n });\r\n\r\n setBillingData({\r\n loading: false,\r\n payments: formattedPaymentMethods,\r\n invoices: formattedInvoices,\r\n apiError: true,\r\n });\r\n } catch (error)\r\n {\r\n setBillingData({\r\n loading: false,\r\n payments: null,\r\n invoices: null,\r\n apiError: true,\r\n });\r\n return;\r\n }\r\n }, []);\r\n\r\n useEffect(() =>\r\n {\r\n if (!baseContext.baseData.loading)\r\n {\r\n const { id } = baseContext.baseData.clubProfile;\r\n getBillingData(id);\r\n }\r\n }, [getBillingData, baseContext]);\r\n\r\n return (\r\n \r\n {children}\r\n \r\n );\r\n}\r\n\r\nexport { BillingProvider, BillingContext };\r\n\r\nexport default BillingProvider;\r\n","import { useEffect, useContext, useState } from \"react\";\r\nimport { TableContainer } from \"./Billing.styles\";\r\nimport MainWrapper from \"../../../components/Wrappers/MainWrapper/MainWrapper\";\r\nimport Title from \"../../../components/Typography/Title/Title\";\r\nimport SectionContainer from \"../../../components/Containers/SectionContainer/SectionContainer\";\r\nimport PaymentMethodsList from \"../../../components/Tables/PaymentMethodsList/PaymentMethodsList\";\r\nimport InvoicesList from \"../../../components/Tables/InvoicesList/InvoicesList\";\r\n\r\n// Contexts\r\nimport { BaseContext } from \"../../../providers/Global/BaseProvider\";\r\nimport { BillingContext } from \"../../../providers/Admin/BillingProvider\";\r\n\r\n// API Calls\r\nimport\r\n{\r\n updatePaymentMethod,\r\n deletePaymentMethod,\r\n\r\n} from \"../../../api\";\r\nimport { routes } from \"../../../options/routes\";\r\nimport { isClubSuperAdmin } from \"../../../utils/helpers/userRoleHelper\";\r\nimport { checkForFailedInvoices, getCustomerPortalUrl, handleCustomerPortalRedirect } from \"../../../utils/helpers/billingHelper\";\r\nimport SectionSpinner from \"../../../components/Loading/SectionSpinner/SectionSpinner\";\r\n\r\nconst Billing = () =>\r\n{\r\n const baseContext = useContext(BaseContext);\r\n const billingContext = useContext(BillingContext);\r\n const [dataLoading, setDataLoading] = useState(true);\r\n const [redirectLoading, setRedirectLoading] = useState(false);\r\n const [editLoading, setEditLoading] = useState(false);\r\n const [deleteLoading, setDeleteLoading] = useState(false);\r\n const [methodsList, setMethodsList] = useState([]);\r\n const [editMethodData, setEditMethodData] = useState({});\r\n const [editMethodErrors, setEditMethodErrors] = useState();\r\n const [billingUrl, setBillingUrl] = useState();\r\n const [invoicesList, setInvoicesList] = useState([]);\r\n const [error, setError] = useState({\r\n show: false,\r\n message: \"\",\r\n });\r\n\r\n useEffect(async () =>\r\n {\r\n if (!billingUrl)\r\n {\r\n let url = await getCustomerPortalUrl();\r\n if (url)\r\n {\r\n setBillingUrl(url);\r\n }\r\n }\r\n if (!baseContext.baseData.loading && !billingContext.billingData.loading)\r\n {\r\n setDataLoading(false);\r\n setMethodsList(billingContext.billingData.payments || []);\r\n setInvoicesList(billingContext.billingData.invoices || []);\r\n }\r\n checkForFailedInvoices(baseContext, setError);\r\n // Set auto-renew on page load\r\n }, [baseContext, billingContext]);\r\n\r\n const handleBannerClose = () =>\r\n {\r\n setError({\r\n show: false,\r\n message: \"\",\r\n });\r\n };\r\n\r\n const handleEditMethodSubmit = async (methodId, expiryMonth, expiryYear) =>\r\n {\r\n await setEditLoading(true);\r\n try\r\n {\r\n const cardUpdate = await updatePaymentMethod(methodId, {\r\n expiryMonth,\r\n expiryYear,\r\n });\r\n if (cardUpdate.success)\r\n {\r\n // Refetch the data on success\r\n await billingContext.getBillingData();\r\n return true;\r\n } else\r\n {\r\n setEditMethodErrors(\"Something went wrong - Please check your details\");\r\n }\r\n } catch (error)\r\n {\r\n console.log(\"error:\");\r\n console.log(error);\r\n setEditMethodErrors(\"Something went wrong - Please check your details\");\r\n }\r\n setEditLoading(false);\r\n };\r\n\r\n const handlePaymentMethodDelete = async (id) =>\r\n {\r\n setDeleteLoading(true);\r\n await deletePaymentMethod(id);\r\n handleBannerClose();\r\n // Remove payment method from array on success\r\n const paymentMethodsList = methodsList.filter((method) => method.id !== id);\r\n setMethodsList(paymentMethodsList);\r\n\r\n setDeleteLoading(false);\r\n return true;\r\n };\r\n\r\n return (\r\n <>\r\n {\r\n \r\n {\" \"}\r\n {isClubSuperAdmin() && (\r\n \r\n \r\n \r\n \r\n \r\n )}\r\n \r\n\r\n : \"Manage billing & details\") : ''}\r\n onTitleBtnClick={() => { handleCustomerPortalRedirect(setRedirectLoading, billingUrl) }}\r\n >\r\n \r\n \r\n\r\n \r\n \r\n }\r\n >\r\n );\r\n};\r\n\r\nexport default Billing;\r\n","import {styled} from '@mui/material';\r\n\r\nexport const SearchContainer = styled('div')(({ theme }) => ({\r\n marginBottom: 15,\r\n width: '50%',\r\n position: 'relative',\r\n zIndex: 1,\r\n [theme.breakpoints.down('sm')]: {\r\n width: '100%',\r\n },\r\n}));\r\n","import createSvgIcon from './utils/createSvgIcon';\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nexport default createSvgIcon( /*#__PURE__*/_jsx(\"path\", {\n d: \"M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z\"\n}), 'Search');","import {\r\n styled,\r\n TextField,\r\n IconButton,\r\n} from '@mui/material';\r\nimport {colors} from '../../../options/colors';\r\nimport {Search, Close} from '@mui/icons-material';\r\n\r\nexport const Container = styled('div')(() => ({\r\n width: '100%',\r\n position: 'relative',\r\n}));\r\n\r\nexport const StyledSearchField = styled(TextField)(({ theme }) => ({\r\n '.MuiOutlinedInput-root': {\r\n ...theme.typography.body1,\r\n padding: 0,\r\n borderRadius: 5,\r\n overflow: 'hidden',\r\n '.MuiOutlinedInput-input': {\r\n padding: '15px 65px 15px 20px',\r\n background: 'transparent',\r\n '&::placeholder': {\r\n color: colors.secondaryGrey,\r\n },\r\n },\r\n '.MuiOutlinedInput-notchedOutline': {\r\n padding: 0,\r\n borderColor: colors.secondaryGrey,\r\n },\r\n '&.Mui-focused': {\r\n '.MuiOutlinedInput-input': {\r\n background: 'rgba(255, 255, 255, 0.2)'\r\n },\r\n '.MuiOutlinedInput-notchedOutline': {\r\n borderColor: 'rgba(255, 255, 255, 0.2)',\r\n borderWidth: 1,\r\n },\r\n '&:hover': {\r\n '.MuiOutlinedInput-notchedOutline': {\r\n borderColor: 'rgba(255, 255, 255, 0.2)',\r\n borderWidth: 1,\r\n },\r\n }\r\n },\r\n '&:hover': {\r\n '.MuiOutlinedInput-notchedOutline': {\r\n padding: 0,\r\n borderColor: colors.secondaryGrey,\r\n },\r\n },\r\n },\r\n}));\r\n\r\nexport const SearchIconContainer = styled('div')(() => ({\r\n position: 'absolute',\r\n right: 12,\r\n top: 13,\r\n zIndex: -1,\r\n}));\r\n\r\nexport const SearchIcon = styled(Search)(() => ({\r\n color: colors.beige,\r\n fontSize: 26,\r\n}));\r\n\r\nexport const ClearButton = styled(IconButton)(() => ({\r\n position: 'absolute',\r\n right: 38,\r\n top: 13,\r\n padding: 2,\r\n transition: 'all 0.3s ease',\r\n}));\r\n\r\nexport const ClearIcon = styled(Close)(() => ({\r\n color: colors.white,\r\n fontSize: 22,\r\n}));\r\n","import {useState} from 'react';\r\nimport {\r\n Container,\r\n StyledSearchField,\r\n SearchIconContainer,\r\n SearchIcon,\r\n ClearButton,\r\n ClearIcon\r\n} from './CustomSearchField.styles';\r\n\r\nconst CustomSearchField = ({id, onChange, onClear, value}) => {\r\n const [searchTerm, setSearchTerm] = useState(value);\r\n\r\n const handleChange = e => {\r\n setSearchTerm(e.target.value);\r\n onChange(e);\r\n };\r\n\r\n const handleClear = () => {\r\n setSearchTerm('');\r\n onClear();\r\n };\r\n\r\n return (\r\n \r\n \r\n {\r\n searchTerm &&\r\n \r\n \r\n \r\n }\r\n \r\n \r\n \r\n \r\n );\r\n};\r\n\r\nexport default CustomSearchField;\r\n","import {\r\n styled,\r\n Typography,\r\n} from '@mui/material';\r\nimport {colors} from \"../../../options/colors\";\r\n\r\nexport const RepsContainer = styled('div')(() => ({\r\n marginBottom: 20,\r\n padding: 10,\r\n display: 'flex',\r\n justifyContent: 'space-between',\r\n alignItems: 'flex-start',\r\n '&:nth-of-type(even)': {\r\n background: 'rgba(255, 255, 255, 0.03)',\r\n },\r\n}));\r\n\r\nexport const IconsContainer = styled('div')(() => ({\r\n display: 'flex',\r\n '& .MuiButtonBase-root': {\r\n marginLeft: 10,\r\n },\r\n}));\r\n\r\nexport const DeleteText = styled(Typography)(({ theme }) =>({\r\n ...theme.typography.body1,\r\n marginBottom: 20,\r\n}));\r\n\r\nexport const DeleteInstructionsContainer = styled('div')(({ theme }) =>({\r\n display: 'flex',\r\n flexDirection: 'column',\r\n justifyContent: 'center',\r\n alignItems: 'center',\r\n maxWidth: 280,\r\n padding: 20,\r\n background: colors.menuPrimaryBlack,\r\n borderRadius: 5,\r\n margin: 'auto',\r\n [theme.breakpoints.down(450)]: {\r\n maxWidth: 'unset',\r\n },\r\n}));\r\n\r\nexport const DeleteInstructionsText = styled(Typography)(({ theme }) =>({\r\n ...theme.typography.h3,\r\n marginBottom: 10,\r\n}));\r\n\r\nexport const FieldContainer = styled('div')(({ theme }) => ({\r\n width: 280,\r\n [theme.breakpoints.down(450)]: {\r\n width: '100%',\r\n },\r\n}));\r\n","import {styled} from '@mui/material';\r\n\r\nexport const DetailsContainer = styled('div')(({ theme }) => ({\r\n marginTop: -40,\r\n display: 'flex',\r\n flex: 1,\r\n flexWrap: 'wrap',\r\n '& > div': {\r\n width: 200,\r\n overflowX: 'clip',\r\n flexWrap: 'nowrap',\r\n [theme.breakpoints.down('xs')]: {\r\n minWidth: 'unset',\r\n width: '100%',\r\n flexWrap: 'wrap',\r\n },\r\n },\r\n}));\r\n","import {\r\n styled,\r\n Typography,\r\n} from '@mui/material';\r\nimport {colors} from '../../../options/colors';\r\n\r\nexport const Container = styled('div')(() => ({\r\n display: 'flex',\r\n flexDirection: 'column',\r\n marginTop: 40,\r\n}));\r\n\r\nexport const TextContainer = styled('div')(() => ({\r\n display: 'flex',\r\n justifyContent: 'space-between',\r\n alignItems: 'center',\r\n overflowWrap: 'anywhere',\r\n}));\r\n\r\nexport const StyledText = styled(Typography)(({ theme, discount }) => ({\r\n ...theme.typography.body1,\r\n margin: discount ? 0 : '15px 0 0 0',\r\n}));\r\n\r\nexport const DiscountContainer = styled('div')(() => ({\r\n marginRight: 25,\r\n}));\r\n\r\nexport const DiscountHeading = styled(Typography)(({ theme }) => ({\r\n ...theme.typography.body2,\r\n marginBottom: 2,\r\n color: colors.primaryGrey,\r\n}));\r\n\r\nexport const DiscountText = styled(Typography)(({ theme }) => ({\r\n ...theme.typography.body1,\r\n}));\r\n","import {\r\n Container,\r\n TextContainer,\r\n StyledText,\r\n DiscountContainer,\r\n DiscountHeading,\r\n DiscountText\r\n} from './ReadOnlyField.styles';\r\nimport Label from '../../Typography/Label/Label';\r\n\r\nconst ReadOnlyField = ({label, value, showDiscount, discount}) => {\r\n return (\r\n \r\n \r\n \r\n \r\n {value}\r\n \r\n {\r\n showDiscount &&\r\n \r\n \r\n Discount\r\n \r\n \r\n {discount}%\r\n \r\n \r\n }\r\n \r\n \r\n )\r\n};\r\n\r\nexport default ReadOnlyField;\r\n","import {\r\n DetailsContainer,\r\n} from './RepsDetails.styles';\r\nimport ReadOnlyField from '../../../components/Inputs/ReadOnlyField/ReadOnlyField';\r\n\r\nconst RepsDetails = ({rep}) => {\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n {/* \r\n \r\n */}\r\n \r\n );\r\n};\r\n\r\nexport default RepsDetails;\r\n","import {styled} from '@mui/material';\r\n\r\nexport const Container = styled('div')(() => ({}));\r\n\r\nexport const InlineFieldContainer = styled('div')(({ theme }) => ({\r\n display: 'flex',\r\n justifyContent: 'space-between',\r\n '& > div:nth-of-type(1)': {\r\n display: 'inline-block',\r\n width: '47%',\r\n },\r\n '& > div:nth-of-type(2)': {\r\n display: 'inline-block',\r\n width: '47%',\r\n },\r\n [theme.breakpoints.down('sm')]: {\r\n flexDirection: 'column',\r\n justifyContent: 'unset',\r\n '& > div': {\r\n width: '100% !important',\r\n }\r\n },\r\n}));\r\n\r\nexport const FieldContainer = styled('div')(() => ({\r\n marginBottom: 20,\r\n '&:last-of-type': {\r\n marginBottom: 10,\r\n },\r\n}));\r\n\r\n\r\nexport const PhoneFieldContainer = styled('div')(() => ({\r\n display: 'flex !important',\r\n justifyContent: 'space-between',\r\n '& > div:nth-of-type(1)': {\r\n display: 'inline-block',\r\n width: 125,\r\n marginRight: 20,\r\n },\r\n '& > div:nth-of-type(2)': {\r\n display: 'inline-block',\r\n width: '100%',\r\n },\r\n}));","import {\r\n Container,\r\n InlineFieldContainer,\r\n FieldContainer,\r\n PhoneFieldContainer,\r\n} from './RepForm.styles';\r\nimport {countries} from '../../../options/countries';\r\nimport CustomTextField from '../../Inputs/CustomTextField/CustomTextField';\r\nimport CustomAutocomplete from '../../Inputs/CustomAutocomplete/CustomAutocomplete';\r\nimport getSortedCountryCodes from '../../../utils/helpers/getSortedCountryCodes';\r\nimport FieldError from '../../Inputs/FieldError/FieldError';\r\nimport { repRoles } from '../../../options/userRoles';\r\n\r\nconst RepForm = ({formData, errors, onChange}) => {\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {errors.saveError && }\r\n\r\n \r\n )\r\n};\r\n\r\nexport default RepForm;\r\n","import {useState} from 'react';\r\nimport {\r\n RepsContainer,\r\n IconsContainer,\r\n DeleteText,\r\n DeleteInstructionsContainer,\r\n DeleteInstructionsText,\r\n FieldContainer,\r\n} from './RepsList.styles';\r\nimport {buttonTypes} from '../../../options/buttonTypes';\r\nimport SectionContainer from '../../../components/Containers/SectionContainer/SectionContainer';\r\nimport RepsDetails from '../../../components/RepsPage/RepsDetails/RepsDetails';\r\nimport IconButton from '../../../components/Buttons/IconButton/IconButton';\r\nimport NoResultsText from '../../../components/Typography/NoResultsText/NoResultsText';\r\nimport StandardModal from '../../Modals/StandardModal/StandardModal';\r\nimport RepForm from '../../Forms/RepForm/RepForm';\r\nimport CustomTextField from '../../Inputs/CustomTextField/CustomTextField';\r\nimport {EditOutlined, DeleteOutlined} from '@mui/icons-material';\r\n\r\nconst RepsList = ({\r\n reps,\r\n onFieldChange,\r\n onSubmit,\r\n formData,\r\n formErrors,\r\n setFormData,\r\n setFormErrors,\r\n updateLoading,\r\n handleDelete,\r\n deleteLoading,\r\n}) => {\r\n const [formModalOpen, setFormModalOpen] = useState(false);\r\n const [isAdd, setIsAdd] = useState(true);\r\n const [deleteModalOpen, setDeleteModalOpen] = useState(false);\r\n const [deleteRep, setDeleteRep] = useState({});\r\n const [deleteValue, setDeleteValue] = useState('');\r\n const [enableDelete, setEnableDelete] = useState(false);\r\n\r\n const handleFormModalClose = () => {\r\n // Reset state back to original values\r\n setFormModalOpen(false);\r\n setIsAdd(true);\r\n setFormData({\r\n id: undefined,\r\n firstname: '',\r\n lastname: '',\r\n email: '',\r\n role: 'REP_TEAM_MEMBER',\r\n telephoneCountryCode: '',\r\n telephone: '',\r\n location: '',\r\n });\r\n setFormErrors({\r\n firstname: '',\r\n lastname: '',\r\n email: '',\r\n role: '',\r\n telephoneCountryCode: '',\r\n telephone: '',\r\n location: '',\r\n });\r\n };\r\n\r\n const handleFormModalOpen = id => {\r\n if (id) {\r\n // Find index of item with matching id and pass those details into modal\r\n const index = reps.findIndex(el => el.id === id);\r\n setFormData(reps[index]);\r\n setIsAdd(false);\r\n }\r\n setFormModalOpen(true);\r\n };\r\n\r\n const handleFormModalSubmit = async () => {\r\n const result = await onSubmit();\r\n if (result) {\r\n handleFormModalClose();\r\n }\r\n };\r\n\r\n const handleDeleteModalClose = () => {\r\n setDeleteModalOpen(false);\r\n setDeleteRep({});\r\n };\r\n\r\n const handleDeleteModalOpen = id => {\r\n const index = reps.findIndex(el => el.id === id);\r\n setDeleteRep(reps[index]);\r\n setDeleteModalOpen(true);\r\n };\r\n\r\n const handleDeleteChange = e => {\r\n // Only enable delete button in modal after user has typed 'delete' in the text field\r\n setDeleteValue(e.target.value);\r\n const enable = e.target.value === 'delete';\r\n setEnableDelete(enable);\r\n };\r\n\r\n const handleDeleteModalSubmit = async () => {\r\n const result = await handleDelete(deleteRep.id);\r\n if (result) {\r\n handleDeleteModalClose();\r\n }\r\n\r\n // Reset delete text value\r\n setDeleteValue('');\r\n setEnableDelete(false);\r\n };\r\n\r\n return (\r\n handleFormModalOpen()}\r\n >\r\n {\r\n reps && reps.length > 0 && reps.map(rep => (\r\n \r\n \r\n \r\n }\r\n onClick={() => handleFormModalOpen(rep.id)}\r\n />\r\n }\r\n onClick={() => handleDeleteModalOpen(rep.id)}\r\n />\r\n \r\n \r\n ))\r\n }\r\n {\r\n (!reps || reps.length === 0) &&\r\n \r\n }\r\n {\r\n formModalOpen &&\r\n \r\n \r\n \r\n }\r\n {\r\n deleteModalOpen &&\r\n \r\n \r\n Are you sure you want to delete {deleteRep.name}?\r\n Once confirmed, this action cannot be undone.\r\n \r\n \r\n \r\n Type 'delete' in the below field to confirm\r\n \r\n \r\n \r\n \r\n \r\n \r\n }\r\n \r\n );\r\n};\r\n\r\nexport default RepsList;\r\n","import { useEffect, useState, useCallback, createContext, useContext } from 'react';\r\nimport {routes} from '../../options/routes';\r\nimport {BaseContext} from '../Global/BaseProvider';\r\n// API calls\r\nimport {getRepsByCompany} from '../../api';\r\n\r\n\r\nconst RepsContext = createContext({});\r\n\r\nconst RepsProvider = ({children}) => {\r\n const baseContext = useContext(BaseContext);\r\n const [repsData, setRepsData] = useState({\r\n loading: true,\r\n reps: null,\r\n apiError: false,\r\n });\r\n\r\n const getRepsData = useCallback(async (id) => {\r\n // Only trigger API call for admin reps route\r\n const activeRoute = window.location.pathname;\r\n if (activeRoute !== routes.repManagement) return;\r\n\r\n try {\r\n const repsApiData = await getRepsByCompany(id);\r\n if (!repsApiData || !repsApiData.success || !repsApiData.data) {\r\n setRepsData({\r\n loading: false,\r\n reps: null,\r\n apiError: true,\r\n });\r\n return;\r\n }\r\n\r\n const formattedReps = repsApiData.data && repsApiData.data.length ? repsApiData.data[0].map(({role, user}) => {\r\n return {\r\n id: user.id,\r\n name: `${user.firstname} ${user.lastname}`,\r\n firstname: user.firstname,\r\n lastname: user.lastname,\r\n email: user.email,\r\n telephoneCountryCode: user.telephoneCountryCode,\r\n telephone: user.telephone,\r\n location: user.location,\r\n role\r\n }\r\n }) : [];\r\n\r\n setRepsData({\r\n loading: false,\r\n reps: formattedReps,\r\n apiError: false,\r\n });\r\n } catch (error) {\r\n setRepsData({\r\n loading: false,\r\n reps: null,\r\n apiError: true,\r\n });\r\n }\r\n }, []);\r\n\r\n useEffect(() => {\r\n if (!baseContext.baseData.loading) {\r\n const { id } = baseContext.baseData.clubProfile;\r\n const manageRepCompanyId = localStorage.getItem('manageRepCompanyId');\r\n getRepsData(manageRepCompanyId ? manageRepCompanyId : id);\r\n }\r\n }, [getRepsData, baseContext]);\r\n\r\n return (\r\n \r\n {children}\r\n \r\n );\r\n}\r\n\r\nexport {RepsProvider, RepsContext};\r\n\r\nexport default RepsProvider;\r\n","import { useEffect, useContext, useState } from 'react';\r\nimport\r\n{\r\n SearchContainer,\r\n} from './RepManagement.styles';\r\nimport MainWrapper from '../../../components/Wrappers/MainWrapper/MainWrapper';\r\nimport Title from '../../../components/Typography/Title/Title';\r\nimport SectionTitle from '../../../components/Typography/SectionTitle/SectionTitle';\r\nimport CustomSearchField from '../../../components/Inputs/CustomSearchField/CustomSearchField';\r\nimport RepsList from '../../../components/Tables/RepsList/RepsList';\r\n\r\n// Contexts\r\nimport { BaseContext } from '../../../providers/Global/BaseProvider';\r\nimport { RepsContext } from '../../../providers/Admin/RepsProvider';\r\n\r\n// Validators & helpers\r\nimport emailIsValid from '../../../utils/validation/email';\r\nimport phoneNumberIsValid from '../../../utils/validation/phoneNumber';\r\nimport { debounce } from 'debounce';\r\n\r\n// API Calls\r\nimport { addRep, deleteRep, updateRep } from '../../../api';\r\nimport { routes } from '../../../options/routes';\r\n\r\nconst RepManagement = () =>\r\n{\r\n const baseContext = useContext(BaseContext);\r\n const repsContext = useContext(RepsContext);\r\n const [dataLoading, setDataLoading] = useState(true);\r\n const [deleteLoading, setDeleteLoading] = useState(false);\r\n const [repLoading, setRepLoading] = useState(false);\r\n const [repsList, setRepsList] = useState([]);\r\n const [clubId, setClubId] = useState();\r\n const [error, setError] = useState({\r\n show: false,\r\n message: '',\r\n });\r\n const [searchData, setSearchData] = useState({\r\n repSearch: '',\r\n });\r\n const [searchResults, setSearchResults] = useState([]);\r\n const manageRepCompanyId = localStorage.getItem('manageRepCompanyId');\r\n const manageRepCompanyName = localStorage.getItem('manageRepCompanyName');\r\n\r\n const emptyState = {\r\n firstname: '',\r\n lastname: '',\r\n email: '',\r\n role: 'REP_TEAM_MEMBER',\r\n telephoneCountryCode: '',\r\n telephone: '',\r\n location: '',\r\n };\r\n\r\n const emptyErrors = {\r\n firstname: '',\r\n lastname: '',\r\n email: '',\r\n role: '',\r\n telephoneCountryCode: '',\r\n telephone: '',\r\n location: '',\r\n };\r\n\r\n const [repData, setRepData] = useState(emptyState);\r\n const [repErrors, setRepErrors] = useState(emptyErrors);\r\n\r\n useEffect(() =>\r\n {\r\n if (!baseContext.baseData.loading && !repsContext.repsData.loading)\r\n {\r\n setClubId(manageRepCompanyId ? manageRepCompanyId : baseContext.baseData.clubProfile.id);\r\n setDataLoading(false);\r\n setRepsList(repsContext.repsData.reps);\r\n }\r\n }, [baseContext, repsContext, manageRepCompanyId]);\r\n\r\n const handleBannerClose = () =>\r\n {\r\n setError({\r\n show: false,\r\n message: '',\r\n });\r\n };\r\n\r\n const handleSearchChange = e =>\r\n {\r\n let data = { ...searchData };\r\n data[e.target.id] = e.target.value;\r\n setSearchData(data);\r\n\r\n // Ensure all data is in lowercase for comparison logic to work correctly\r\n handleSearchSubmit(data.repSearch.toLowerCase());\r\n };\r\n\r\n const handleSearchSubmit = searchTerm =>\r\n {\r\n // Filter results with name, email, phone or location matching searchTerm\r\n const results = repsList.filter(\r\n rep =>\r\n rep.name.toLowerCase()?.includes(searchTerm) ||\r\n rep.email.toLowerCase()?.includes(searchTerm) ||\r\n rep.telephone?.includes(searchTerm) ||\r\n rep.location.toLowerCase()?.includes(searchTerm)\r\n );\r\n setSearchResults(results);\r\n };\r\n\r\n const handleSearchClear = () =>\r\n {\r\n setSearchData({\r\n repSearch: '',\r\n });\r\n setSearchResults([]);\r\n };\r\n\r\n const handleRepDelete = async id =>\r\n {\r\n setDeleteLoading(true);\r\n handleBannerClose();\r\n\r\n // Trigger API call\r\n try\r\n {\r\n const deleteRepCall = await deleteRep(id);\r\n if (!deleteRepCall || !deleteRepCall.success || deleteRepCall.code !== 200)\r\n {\r\n setError({\r\n show: true,\r\n message: 'There was an error with the request. Please try again.'\r\n }\r\n );\r\n return;\r\n }\r\n await repsContext.getRepsData(clubId);\r\n } catch (error)\r\n {\r\n setError({\r\n show: true,\r\n message: 'There was an error with the request. Please try again.'\r\n }\r\n );\r\n setDeleteLoading(false);\r\n return;\r\n }\r\n setError({\r\n ...error,\r\n message: 'Rep has been successfully deleted',\r\n });\r\n };\r\n\r\n const handleRepChange = (e, id, val) =>\r\n {\r\n // Clear errors\r\n setRepErrors(emptyErrors);\r\n handleBannerClose();\r\n\r\n // Update repData\r\n let data = { ...repData };\r\n if (e && id)\r\n {\r\n // For autocomplete field\r\n data[id] = val;\r\n } else\r\n {\r\n data[e.target.id] = e.target.value;\r\n }\r\n setRepData(data);\r\n };\r\n\r\n const handleRepSubmit = async () =>\r\n {\r\n await setRepLoading(true);\r\n // Set form errors\r\n let formErrors = { ...repErrors };\r\n let hasErrors = false;\r\n if (!repData.firstname)\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n firstname: 'Name is required'\r\n };\r\n hasErrors = true;\r\n }\r\n if (!repData.lastname)\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n lastName: 'Name is required'\r\n };\r\n hasErrors = true;\r\n }\r\n if (!emailIsValid(repData.email))\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n email: 'A valid Contact email is required'\r\n };\r\n hasErrors = true;\r\n }\r\n if (!repData.telephoneCountryCode)\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n telephoneCountryCode: 'Country Code is required'\r\n };\r\n hasErrors = true;\r\n }\r\n if (!phoneNumberIsValid(repData.telephone))\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n telephone: 'A valid Phone number is required'\r\n };\r\n hasErrors = true;\r\n }\r\n if (!repData.location)\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n location: 'Location is required'\r\n };\r\n hasErrors = true;\r\n }\r\n\r\n if (!repData.role)\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n role: 'Role is required'\r\n };\r\n hasErrors = true;\r\n }\r\n\r\n // Set errors and return if there are errors\r\n setRepErrors(formErrors);\r\n if (hasErrors)\r\n {\r\n setRepLoading(false);\r\n return false;\r\n }\r\n\r\n try\r\n {\r\n const saveRepCal = repData.id ? await updateRep(repData.id, { ...repData, repCoId: clubId }) : await addRep({ ...repData, repCoId: clubId });\r\n\r\n if (!saveRepCal || !saveRepCal.success || saveRepCal.code !== 200)\r\n {\r\n setRepLoading(false);\r\n setRepErrors({\r\n saveError: 'There was an error with the request. Please check email and phone number are unique.',\r\n });\r\n return;\r\n }\r\n await repsContext.getRepsData(clubId);\r\n\r\n setError({\r\n ...error,\r\n message: `Rep has been successfully ${repData.id ? 'updated' : 'added'}`,\r\n });\r\n\r\n setRepData(emptyState);\r\n setRepLoading(false);\r\n } catch (error)\r\n {\r\n setError({\r\n show: true,\r\n message: 'There was an error with the request. Please check phone number is unique'\r\n }\r\n );\r\n }\r\n // Trigger API call - update if id or create if no id\r\n\r\n return true;\r\n };\r\n\r\n return (\r\n <>\r\n {\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n }\r\n >\r\n );\r\n};\r\n\r\nexport default RepManagement;\r\n","import objectWithoutPropertiesLoose from \"./objectWithoutPropertiesLoose.js\";\nexport default function _objectWithoutProperties(source, excluded) {\n if (source == null) return {};\n var target = objectWithoutPropertiesLoose(source, excluded);\n var key, i;\n if (Object.getOwnPropertySymbols) {\n var sourceSymbolKeys = Object.getOwnPropertySymbols(source);\n for (i = 0; i < sourceSymbolKeys.length; i++) {\n key = sourceSymbolKeys[i];\n if (excluded.indexOf(key) >= 0) continue;\n if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;\n target[key] = source[key];\n }\n }\n return target;\n}","import {styled} from '@mui/material';\r\n\r\nexport const SearchContainer = styled('div')(({ theme }) => ({\r\n marginBottom: 15,\r\n width: '50%',\r\n position: 'relative',\r\n zIndex: 1,\r\n [theme.breakpoints.down('sm')]: {\r\n width: '100%',\r\n },\r\n}));\r\n","import {styled} from '@mui/material';\r\n\r\nexport const RepCompaniesContainer = styled('div')(() => ({\r\n marginBottom: 20,\r\n padding: 10,\r\n display: 'flex',\r\n justifyContent: 'space-between',\r\n alignItems: 'flex-start',\r\n '&:nth-of-type(even)': {\r\n background: 'rgba(255, 255, 255, 0.03)',\r\n },\r\n}));\r\n\r\nexport const IconsContainer = styled('div')(() => ({\r\n display: 'flex',\r\n '& .MuiButtonBase-root': {\r\n marginLeft: 10,\r\n },\r\n}));\r\n","import {styled} from '@mui/material';\r\n\r\nexport const DetailsContainer = styled('div')(({ theme }) => ({\r\n marginTop: -40,\r\n display: 'flex',\r\n flex: 1,\r\n flexWrap: 'wrap',\r\n '& > div': {\r\n width: 200,\r\n overflowX: 'clip',\r\n flexWrap: 'nowrap',\r\n [theme.breakpoints.down('xs')]: {\r\n minWidth: 'unset',\r\n width: '100%',\r\n flexWrap: 'wrap',\r\n },\r\n },\r\n}));\r\n","import\r\n{\r\n DetailsContainer,\r\n} from './ClubsDetails.styles';\r\nimport ReadOnlyField from '../../../components/Inputs/ReadOnlyField/ReadOnlyField';\r\n\r\nconst ClubsDetails = ({ club, showLicenceInfo }) =>\r\n{\r\n let phoneNumber = '';\r\n if (club.telephone)\r\n {\r\n if (club.telephoneCountryCode)\r\n {\r\n phoneNumber = `+${club.telephoneCountryCode} `;\r\n }\r\n phoneNumber += club.telephone;\r\n }\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n {\r\n showLicenceInfo &&\r\n \r\n }\r\n {/* */}\r\n {/* */}\r\n {/* */}\r\n {/* \r\n */}\r\n \r\n );\r\n};\r\n\r\nexport default ClubsDetails;\r\n","import { useRef } from \"react\";\n\n// Saves incoming handler to the ref in order to avoid \"useCallback hell\"\nexport function useEventCallback(handler?: (value: T) => void): (value: T) => void {\n const callbackRef = useRef(handler);\n const fn = useRef((value: T) => {\n callbackRef.current && callbackRef.current(value);\n });\n callbackRef.current = handler;\n\n return fn.current;\n}\n","// Clamps a value between an upper and lower bound.\n// We use ternary operators because it makes the minified code\n// 2 times shorter then `Math.min(Math.max(a,b),c)`\nexport const clamp = (number: number, min = 0, max = 1): number => {\n return number > max ? max : number < min ? min : number;\n};\n","import React, { useRef, useMemo, useEffect } from \"react\";\n\nimport { useEventCallback } from \"../../hooks/useEventCallback\";\nimport { clamp } from \"../../utils/clamp\";\n\nexport interface Interaction {\n left: number;\n top: number;\n}\n\n// Check if an event was triggered by touch\nconst isTouch = (event: MouseEvent | TouchEvent): event is TouchEvent => \"touches\" in event;\n\n// Finds a proper touch point by its identifier\nconst getTouchPoint = (touches: TouchList, touchId: null | number): Touch => {\n for (let i = 0; i < touches.length; i++) {\n if (touches[i].identifier === touchId) return touches[i];\n }\n return touches[0];\n};\n\n// Finds the proper window object to fix iframe embedding issues\nconst getParentWindow = (node?: HTMLDivElement | null): Window => {\n return (node && node.ownerDocument.defaultView) || self;\n};\n\n// Returns a relative position of the pointer inside the node's bounding box\nconst getRelativePosition = (\n node: HTMLDivElement,\n event: MouseEvent | TouchEvent,\n touchId: null | number\n): Interaction => {\n const rect = node.getBoundingClientRect();\n\n // Get user's pointer position from `touches` array if it's a `TouchEvent`\n const pointer = isTouch(event) ? getTouchPoint(event.touches, touchId) : (event as MouseEvent);\n\n return {\n left: clamp((pointer.pageX - (rect.left + getParentWindow(node).pageXOffset)) / rect.width),\n top: clamp((pointer.pageY - (rect.top + getParentWindow(node).pageYOffset)) / rect.height),\n };\n};\n\n// Browsers introduced an intervention, making touch events passive by default.\n// This workaround removes `preventDefault` call from the touch handlers.\n// https://github.com/facebook/react/issues/19651\nconst preventDefaultMove = (event: MouseEvent | TouchEvent): void => {\n !isTouch(event) && event.preventDefault();\n};\n\n// Prevent mobile browsers from handling mouse events (conflicting with touch ones).\n// If we detected a touch interaction before, we prefer reacting to touch events only.\nconst isInvalid = (event: MouseEvent | TouchEvent, hasTouch: boolean): boolean => {\n return hasTouch && !isTouch(event);\n};\n\ninterface Props {\n onMove: (interaction: Interaction) => void;\n onKey: (offset: Interaction) => void;\n children: React.ReactNode;\n}\n\nconst InteractiveBase = ({ onMove, onKey, ...rest }: Props) => {\n const container = useRef(null);\n const onMoveCallback = useEventCallback(onMove);\n const onKeyCallback = useEventCallback(onKey);\n const touchId = useRef(null);\n const hasTouch = useRef(false);\n\n const [handleMoveStart, handleKeyDown, toggleDocumentEvents] = useMemo(() => {\n const handleMoveStart = ({ nativeEvent }: React.MouseEvent | React.TouchEvent) => {\n const el = container.current;\n if (!el) return;\n\n // Prevent text selection\n preventDefaultMove(nativeEvent);\n\n if (isInvalid(nativeEvent, hasTouch.current) || !el) return;\n\n if (isTouch(nativeEvent)) {\n hasTouch.current = true;\n const changedTouches = nativeEvent.changedTouches || [];\n if (changedTouches.length) touchId.current = changedTouches[0].identifier;\n }\n\n el.focus();\n onMoveCallback(getRelativePosition(el, nativeEvent, touchId.current));\n toggleDocumentEvents(true);\n };\n\n const handleMove = (event: MouseEvent | TouchEvent) => {\n // Prevent text selection\n preventDefaultMove(event);\n\n // If user moves the pointer outside of the window or iframe bounds and release it there,\n // `mouseup`/`touchend` won't be fired. In order to stop the picker from following the cursor\n // after the user has moved the mouse/finger back to the document, we check `event.buttons`\n // and `event.touches`. It allows us to detect that the user is just moving his pointer\n // without pressing it down\n const isDown = isTouch(event) ? event.touches.length > 0 : event.buttons > 0;\n\n if (isDown && container.current) {\n onMoveCallback(getRelativePosition(container.current, event, touchId.current));\n } else {\n toggleDocumentEvents(false);\n }\n };\n\n const handleMoveEnd = () => toggleDocumentEvents(false);\n\n const handleKeyDown = (event: React.KeyboardEvent) => {\n const keyCode = event.which || event.keyCode;\n\n // Ignore all keys except arrow ones\n if (keyCode < 37 || keyCode > 40) return;\n // Do not scroll page by arrow keys when document is focused on the element\n event.preventDefault();\n // Send relative offset to the parent component.\n // We use codes (37←, 38↑, 39→, 40↓) instead of keys ('ArrowRight', 'ArrowDown', etc)\n // to reduce the size of the library\n onKeyCallback({\n left: keyCode === 39 ? 0.05 : keyCode === 37 ? -0.05 : 0,\n top: keyCode === 40 ? 0.05 : keyCode === 38 ? -0.05 : 0,\n });\n };\n\n function toggleDocumentEvents(state?: boolean) {\n const touch = hasTouch.current;\n const el = container.current;\n const parentWindow = getParentWindow(el);\n\n // Add or remove additional pointer event listeners\n const toggleEvent = state ? parentWindow.addEventListener : parentWindow.removeEventListener;\n toggleEvent(touch ? \"touchmove\" : \"mousemove\", handleMove);\n toggleEvent(touch ? \"touchend\" : \"mouseup\", handleMoveEnd);\n }\n\n return [handleMoveStart, handleKeyDown, toggleDocumentEvents];\n }, [onKeyCallback, onMoveCallback]);\n\n // Remove window event listeners before unmounting\n useEffect(() => toggleDocumentEvents, [toggleDocumentEvents]);\n\n return (\n \n );\n};\n\nexport const Interactive = React.memo(InteractiveBase);\n","export const formatClassName = (names: unknown[]): string => names.filter(Boolean).join(\" \");\n","import React from \"react\";\nimport { formatClassName } from \"../../utils/format\";\n\ninterface Props {\n className?: string;\n top?: number;\n left: number;\n color: string;\n}\n\nexport const Pointer = ({ className, color, left, top = 0.5 }: Props): JSX.Element => {\n const nodeClassName = formatClassName([\"react-colorful__pointer\", className]);\n\n const style = {\n top: `${top * 100}%`,\n left: `${left * 100}%`,\n };\n\n return (\n \n );\n};\n","export const round = (number: number, digits = 0, base = Math.pow(10, digits)): number => {\n return Math.round(base * number) / base;\n};\n","import { round } from \"./round\";\nimport { RgbaColor, RgbColor, HslaColor, HslColor, HsvaColor, HsvColor } from \"../types\";\n\n/**\n * Valid CSS units.\n * https://developer.mozilla.org/en-US/docs/Web/CSS/angle\n */\nconst angleUnits: Record = {\n grad: 360 / 400,\n turn: 360,\n rad: 360 / (Math.PI * 2),\n};\n\nexport const hexToHsva = (hex: string): HsvaColor => rgbaToHsva(hexToRgba(hex));\n\nexport const hexToRgba = (hex: string): RgbaColor => {\n if (hex[0] === \"#\") hex = hex.substring(1);\n\n if (hex.length < 6) {\n return {\n r: parseInt(hex[0] + hex[0], 16),\n g: parseInt(hex[1] + hex[1], 16),\n b: parseInt(hex[2] + hex[2], 16),\n a: hex.length === 4 ? round(parseInt(hex[3] + hex[3], 16) / 255, 2) : 1,\n };\n }\n\n return {\n r: parseInt(hex.substring(0, 2), 16),\n g: parseInt(hex.substring(2, 4), 16),\n b: parseInt(hex.substring(4, 6), 16),\n a: hex.length === 8 ? round(parseInt(hex.substring(6, 8), 16) / 255, 2) : 1,\n };\n};\n\nexport const parseHue = (value: string, unit = \"deg\"): number => {\n return Number(value) * (angleUnits[unit] || 1);\n};\n\nexport const hslaStringToHsva = (hslString: string): HsvaColor => {\n const matcher = /hsla?\\(?\\s*(-?\\d*\\.?\\d+)(deg|rad|grad|turn)?[,\\s]+(-?\\d*\\.?\\d+)%?[,\\s]+(-?\\d*\\.?\\d+)%?,?\\s*[/\\s]*(-?\\d*\\.?\\d+)?(%)?\\s*\\)?/i;\n const match = matcher.exec(hslString);\n\n if (!match) return { h: 0, s: 0, v: 0, a: 1 };\n\n return hslaToHsva({\n h: parseHue(match[1], match[2]),\n s: Number(match[3]),\n l: Number(match[4]),\n a: match[5] === undefined ? 1 : Number(match[5]) / (match[6] ? 100 : 1),\n });\n};\n\nexport const hslStringToHsva = hslaStringToHsva;\n\nexport const hslaToHsva = ({ h, s, l, a }: HslaColor): HsvaColor => {\n s *= (l < 50 ? l : 100 - l) / 100;\n\n return {\n h: h,\n s: s > 0 ? ((2 * s) / (l + s)) * 100 : 0,\n v: l + s,\n a,\n };\n};\n\nexport const hsvaToHex = (hsva: HsvaColor): string => rgbaToHex(hsvaToRgba(hsva));\n\nexport const hsvaToHsla = ({ h, s, v, a }: HsvaColor): HslaColor => {\n const hh = ((200 - s) * v) / 100;\n\n return {\n h: round(h),\n s: round(hh > 0 && hh < 200 ? ((s * v) / 100 / (hh <= 100 ? hh : 200 - hh)) * 100 : 0),\n l: round(hh / 2),\n a: round(a, 2),\n };\n};\n\nexport const hsvaToHslString = (hsva: HsvaColor): string => {\n const { h, s, l } = hsvaToHsla(hsva);\n return `hsl(${h}, ${s}%, ${l}%)`;\n};\n\nexport const hsvaToHsvString = (hsva: HsvaColor): string => {\n const { h, s, v } = roundHsva(hsva);\n return `hsv(${h}, ${s}%, ${v}%)`;\n};\n\nexport const hsvaToHsvaString = (hsva: HsvaColor): string => {\n const { h, s, v, a } = roundHsva(hsva);\n return `hsva(${h}, ${s}%, ${v}%, ${a})`;\n};\n\nexport const hsvaToHslaString = (hsva: HsvaColor): string => {\n const { h, s, l, a } = hsvaToHsla(hsva);\n return `hsla(${h}, ${s}%, ${l}%, ${a})`;\n};\n\nexport const hsvaToRgba = ({ h, s, v, a }: HsvaColor): RgbaColor => {\n h = (h / 360) * 6;\n s = s / 100;\n v = v / 100;\n\n const hh = Math.floor(h),\n b = v * (1 - s),\n c = v * (1 - (h - hh) * s),\n d = v * (1 - (1 - h + hh) * s),\n module = hh % 6;\n\n return {\n r: round([v, c, b, b, d, v][module] * 255),\n g: round([d, v, v, c, b, b][module] * 255),\n b: round([b, b, d, v, v, c][module] * 255),\n a: round(a, 2),\n };\n};\n\nexport const hsvaToRgbString = (hsva: HsvaColor): string => {\n const { r, g, b } = hsvaToRgba(hsva);\n return `rgb(${r}, ${g}, ${b})`;\n};\n\nexport const hsvaToRgbaString = (hsva: HsvaColor): string => {\n const { r, g, b, a } = hsvaToRgba(hsva);\n return `rgba(${r}, ${g}, ${b}, ${a})`;\n};\n\nexport const hsvaStringToHsva = (hsvString: string): HsvaColor => {\n const matcher = /hsva?\\(?\\s*(-?\\d*\\.?\\d+)(deg|rad|grad|turn)?[,\\s]+(-?\\d*\\.?\\d+)%?[,\\s]+(-?\\d*\\.?\\d+)%?,?\\s*[/\\s]*(-?\\d*\\.?\\d+)?(%)?\\s*\\)?/i;\n const match = matcher.exec(hsvString);\n\n if (!match) return { h: 0, s: 0, v: 0, a: 1 };\n\n return roundHsva({\n h: parseHue(match[1], match[2]),\n s: Number(match[3]),\n v: Number(match[4]),\n a: match[5] === undefined ? 1 : Number(match[5]) / (match[6] ? 100 : 1),\n });\n};\n\nexport const hsvStringToHsva = hsvaStringToHsva;\n\nexport const rgbaStringToHsva = (rgbaString: string): HsvaColor => {\n const matcher = /rgba?\\(?\\s*(-?\\d*\\.?\\d+)(%)?[,\\s]+(-?\\d*\\.?\\d+)(%)?[,\\s]+(-?\\d*\\.?\\d+)(%)?,?\\s*[/\\s]*(-?\\d*\\.?\\d+)?(%)?\\s*\\)?/i;\n const match = matcher.exec(rgbaString);\n\n if (!match) return { h: 0, s: 0, v: 0, a: 1 };\n\n return rgbaToHsva({\n r: Number(match[1]) / (match[2] ? 100 / 255 : 1),\n g: Number(match[3]) / (match[4] ? 100 / 255 : 1),\n b: Number(match[5]) / (match[6] ? 100 / 255 : 1),\n a: match[7] === undefined ? 1 : Number(match[7]) / (match[8] ? 100 : 1),\n });\n};\n\nexport const rgbStringToHsva = rgbaStringToHsva;\n\nconst format = (number: number) => {\n const hex = number.toString(16);\n return hex.length < 2 ? \"0\" + hex : hex;\n};\n\nexport const rgbaToHex = ({ r, g, b, a }: RgbaColor): string => {\n const alphaHex = a < 1 ? format(round(a * 255)) : \"\";\n return \"#\" + format(r) + format(g) + format(b) + alphaHex;\n};\n\nexport const rgbaToHsva = ({ r, g, b, a }: RgbaColor): HsvaColor => {\n const max = Math.max(r, g, b);\n const delta = max - Math.min(r, g, b);\n\n // prettier-ignore\n const hh = delta\n ? max === r\n ? (g - b) / delta\n : max === g\n ? 2 + (b - r) / delta\n : 4 + (r - g) / delta\n : 0;\n\n return {\n h: round(60 * (hh < 0 ? hh + 6 : hh)),\n s: round(max ? (delta / max) * 100 : 0),\n v: round((max / 255) * 100),\n a,\n };\n};\n\nexport const roundHsva = (hsva: HsvaColor): HsvaColor => ({\n h: round(hsva.h),\n s: round(hsva.s),\n v: round(hsva.v),\n a: round(hsva.a, 2),\n});\n\nexport const rgbaToRgb = ({ r, g, b }: RgbaColor): RgbColor => ({ r, g, b });\n\nexport const hslaToHsl = ({ h, s, l }: HslaColor): HslColor => ({ h, s, l });\n\nexport const hsvaToHsv = (hsva: HsvaColor): HsvColor => {\n const { h, s, v } = roundHsva(hsva);\n return { h, s, v };\n};\n","import React from \"react\";\n\nimport { Interactive, Interaction } from \"./Interactive\";\nimport { Pointer } from \"./Pointer\";\n\nimport { hsvaToHslString } from \"../../utils/convert\";\nimport { formatClassName } from \"../../utils/format\";\nimport { clamp } from \"../../utils/clamp\";\nimport { round } from \"../../utils/round\";\n\ninterface Props {\n className?: string;\n hue: number;\n onChange: (newHue: { h: number }) => void;\n}\n\nconst HueBase = ({ className, hue, onChange }: Props) => {\n const handleMove = (interaction: Interaction) => {\n onChange({ h: 360 * interaction.left });\n };\n\n const handleKey = (offset: Interaction) => {\n // Hue measured in degrees of the color circle ranging from 0 to 360\n onChange({\n h: clamp(hue + offset.left * 360, 0, 360),\n });\n };\n\n const nodeClassName = formatClassName([\"react-colorful__hue\", className]);\n\n return (\n \n );\n};\n\nexport const Hue = React.memo(HueBase);\n","import React from \"react\";\nimport { Interactive, Interaction } from \"./Interactive\";\nimport { Pointer } from \"./Pointer\";\nimport { HsvaColor } from \"../../types\";\nimport { hsvaToHslString } from \"../../utils/convert\";\nimport { clamp } from \"../../utils/clamp\";\nimport { round } from \"../../utils/round\";\n\ninterface Props {\n hsva: HsvaColor;\n onChange: (newColor: { s: number; v: number }) => void;\n}\n\nconst SaturationBase = ({ hsva, onChange }: Props) => {\n const handleMove = (interaction: Interaction) => {\n onChange({\n s: interaction.left * 100,\n v: 100 - interaction.top * 100,\n });\n };\n\n const handleKey = (offset: Interaction) => {\n // Saturation and brightness always fit into [0, 100] range\n onChange({\n s: clamp(hsva.s + offset.left * 100, 0, 100),\n v: clamp(hsva.v - offset.top * 100, 0, 100),\n });\n };\n\n const containerStyle = {\n backgroundColor: hsvaToHslString({ h: hsva.h, s: 100, v: 100, a: 1 }),\n };\n\n return (\n \n );\n};\n\nexport const Saturation = React.memo(SaturationBase);\n","import { hexToRgba } from \"./convert\";\nimport { ObjectColor } from \"../types\";\n\nexport const equalColorObjects = (first: ObjectColor, second: ObjectColor): boolean => {\n if (first === second) return true;\n\n for (const prop in first) {\n // The following allows for a type-safe calling of this function (first & second have to be HSL, HSV, or RGB)\n // with type-unsafe iterating over object keys. TS does not allow this without an index (`[key: string]: number`)\n // on an object to define how iteration is normally done. To ensure extra keys are not allowed on our types,\n // we must cast our object to unknown (as RGB demands `r` be a key, while `Record` does not care if\n // there is or not), and then as a type TS can iterate over.\n if (\n ((first as unknown) as Record)[prop] !==\n ((second as unknown) as Record)[prop]\n )\n return false;\n }\n\n return true;\n};\n\nexport const equalColorString = (first: string, second: string): boolean => {\n return first.replace(/\\s/g, \"\") === second.replace(/\\s/g, \"\");\n};\n\nexport const equalHex = (first: string, second: string): boolean => {\n if (first.toLowerCase() === second.toLowerCase()) return true;\n\n // To compare colors like `#FFF` and `ffffff` we convert them into RGB objects\n return equalColorObjects(hexToRgba(first), hexToRgba(second));\n};\n","import { useState, useEffect, useCallback, useRef } from \"react\";\nimport { ColorModel, AnyColor, HsvaColor } from \"../types\";\nimport { equalColorObjects } from \"../utils/compare\";\nimport { useEventCallback } from \"./useEventCallback\";\n\nexport function useColorManipulation(\n colorModel: ColorModel,\n color: T,\n onChange?: (color: T) => void\n): [HsvaColor, (color: Partial) => void] {\n // Save onChange callback in the ref for avoiding \"useCallback hell\"\n const onChangeCallback = useEventCallback(onChange);\n\n // No matter which color model is used (HEX, RGB(A) or HSL(A)),\n // all internal calculations are based on HSVA model\n const [hsva, updateHsva] = useState(() => colorModel.toHsva(color));\n\n // By using this ref we're able to prevent extra updates\n // and the effects recursion during the color conversion\n const cache = useRef({ color, hsva });\n\n // Update local HSVA-value if `color` property value is changed,\n // but only if that's not the same color that we just sent to the parent\n useEffect(() => {\n if (!colorModel.equal(color, cache.current.color)) {\n const newHsva = colorModel.toHsva(color);\n cache.current = { hsva: newHsva, color };\n updateHsva(newHsva);\n }\n }, [color, colorModel]);\n\n // Trigger `onChange` callback only if an updated color is different from cached one;\n // save the new color to the ref to prevent unnecessary updates\n useEffect(() => {\n let newColor;\n if (\n !equalColorObjects(hsva, cache.current.hsva) &&\n !colorModel.equal((newColor = colorModel.fromHsva(hsva)), cache.current.color)\n ) {\n cache.current = { hsva, color: newColor };\n onChangeCallback(newColor);\n }\n }, [hsva, colorModel, onChangeCallback]);\n\n // Merge the current HSVA color object with updated params.\n // For example, when a child component sends `h` or `s` only\n const handleChange = useCallback((params: Partial) => {\n updateHsva((current) => Object.assign({}, current, params));\n }, []);\n\n return [hsva, handleChange];\n}\n","declare const __webpack_nonce__: string | undefined;\nlet nonce: string | undefined;\n\n/**\n * Returns a nonce hash included by Webpack or the one defined manually by developer.\n * https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/nonce\n * https://webpack.js.org/guides/csp/\n */\nexport const getNonce = (): string | undefined => {\n if (nonce) return nonce;\n if (typeof __webpack_nonce__ !== \"undefined\") return __webpack_nonce__;\n return undefined;\n};\n\n/**\n * Signs the style tag with a base64-encoded string (nonce) to conforms to Content Security Policies.\n * This function has to be invoked before any picker is rendered if you aren't using Webpack for CSP.\n */\nexport const setNonce = (hash: string): void => {\n nonce = hash;\n};\n","import { useLayoutEffect, useEffect } from \"react\";\n\n// React currently throws a warning when using useLayoutEffect on the server.\n// To get around it, we can conditionally useEffect on the server (no-op) and\n// useLayoutEffect in the browser.\nexport const useIsomorphicLayoutEffect =\n typeof window !== \"undefined\" ? useLayoutEffect : useEffect;\n","import { RefObject } from \"react\";\n\nimport { useIsomorphicLayoutEffect } from \"./useIsomorphicLayoutEffect\";\nimport { getNonce } from \"../utils/nonce\";\n\n// Bundler is configured to load this as a processed minified CSS-string\nimport styles from \"../css/styles.css\";\n\nconst styleElementMap: Map = new Map();\n\n/**\n * Injects CSS code into the document's \n */\nexport const useStyleSheet = (nodeRef: RefObject): void => {\n useIsomorphicLayoutEffect(() => {\n const parentDocument = nodeRef.current ? nodeRef.current.ownerDocument : document;\n\n if (typeof parentDocument !== \"undefined\" && !styleElementMap.has(parentDocument)) {\n const styleElement = parentDocument.createElement(\"style\");\n styleElement.innerHTML = styles;\n styleElementMap.set(parentDocument, styleElement);\n\n // Conform to CSP rules by setting `nonce` attribute to the inline styles\n const nonce = getNonce();\n if (nonce) styleElement.setAttribute(\"nonce\", nonce);\n\n parentDocument.head.appendChild(styleElement);\n }\n }, []);\n};\n","import React, { useRef } from \"react\";\n\nimport { Hue } from \"./Hue\";\nimport { Saturation } from \"./Saturation\";\n\nimport { ColorModel, ColorPickerBaseProps, AnyColor } from \"../../types\";\nimport { useColorManipulation } from \"../../hooks/useColorManipulation\";\nimport { useStyleSheet } from \"../../hooks/useStyleSheet\";\nimport { formatClassName } from \"../../utils/format\";\n\ninterface Props extends Partial> {\n colorModel: ColorModel;\n}\n\nexport const ColorPicker = ({\n className,\n colorModel,\n color = colorModel.defaultColor,\n onChange,\n ...rest\n}: Props): JSX.Element => {\n const nodeRef = useRef(null);\n useStyleSheet(nodeRef);\n\n const [hsva, updateHsva] = useColorManipulation(colorModel, color, onChange);\n\n const nodeClassName = formatClassName([\"react-colorful\", className]);\n\n return (\n \n \n \n
\n );\n};\n","import React from \"react\";\n\nimport { ColorPicker } from \"./common/ColorPicker\";\nimport { ColorModel, ColorPickerBaseProps } from \"../types\";\nimport { equalHex } from \"../utils/compare\";\nimport { hexToHsva, hsvaToHex } from \"../utils/convert\";\n\nconst colorModel: ColorModel = {\n defaultColor: \"000\",\n toHsva: hexToHsva,\n fromHsva: ({ h, s, v }) => hsvaToHex({ h, s, v, a: 1 }),\n equal: equalHex,\n};\n\nexport const HexColorPicker = (props: Partial>): JSX.Element => (\n \n);\n","import {styled} from '@mui/material';\r\nimport {colors} from '../../../options/colors';\r\n\r\nexport const Container = styled('div')(() => ({\r\n '& > div:last-of-type': {\r\n marginBottom: 0,\r\n },\r\n}));\r\n\r\nexport const InlineFieldContainer = styled('div')(({ theme }) => ({\r\n display: 'flex',\r\n justifyContent: 'space-between',\r\n '& > div:nth-of-type(1)': {\r\n display: 'inline-block',\r\n width: '47%',\r\n },\r\n '& > div:nth-of-type(2)': {\r\n display: 'inline-block',\r\n width: '47%',\r\n },\r\n [theme.breakpoints.down('sm')]: {\r\n flexDirection: 'column',\r\n justifyContent: 'unset',\r\n '& > div': {\r\n width: '100% !important',\r\n }\r\n },\r\n}));\r\n\r\nexport const FieldContainer = styled('div')(() => ({\r\n marginBottom: 20,\r\n}));\r\n\r\nexport const DiscountFieldContainer = styled('div')(({ theme }) => ({\r\n display: 'flex',\r\n justifyContent: 'space-between',\r\n '& > div:nth-of-type(1)': {\r\n display: 'inline-block',\r\n width: '64%',\r\n },\r\n '& > div:nth-of-type(2)': {\r\n display: 'inline-block',\r\n width: '30%',\r\n },\r\n [theme.breakpoints.down('xs')]: {\r\n flexDirection: 'column',\r\n '& > div': {\r\n width: '100% !important',\r\n },\r\n '& > div:nth-of-type(1)': {\r\n marginBottom: 20,\r\n },\r\n },\r\n}));\r\n\r\nexport const PhoneFieldContainer = styled('div')(() => ({\r\n display: 'flex !important',\r\n justifyContent: 'space-between',\r\n '& > div:nth-of-type(1)': {\r\n display: 'inline-block',\r\n width: 125,\r\n marginRight: 20,\r\n },\r\n '& > div:nth-of-type(2)': {\r\n display: 'inline-block',\r\n width: '100%',\r\n },\r\n}));\r\n\r\nexport const ColourSelectorInput = styled('div')(({selectedcolour}) => ({\r\n border: `1px solid ${colors.secondaryGrey}`,\r\n borderRadius: 5,\r\n height: 53,\r\n cursor: 'pointer',\r\n backgroundColor: selectedcolour ? selectedcolour : colors.black,\r\n}));\r\n\r\nexport const ColourPickerContainer = styled('div')(() => ({\r\n display: 'flex',\r\n justifyContent: 'center',\r\n}));\r\n\r\n","import {useState} from 'react';\r\nimport {HexColorPicker} from 'react-colorful';\r\nimport {\r\n Container,\r\n InlineFieldContainer,\r\n FieldContainer,\r\n PhoneFieldContainer,\r\n ColourPickerContainer,\r\n} from './RepCompanyForm.styles';\r\nimport StandardModal from '../../Modals/StandardModal/StandardModal';\r\nimport {countries} from '../../../options/countries';\r\nimport CustomTextField from '../../Inputs/CustomTextField/CustomTextField';\r\nimport CustomAutocomplete from '../../Inputs/CustomAutocomplete/CustomAutocomplete';\r\nimport getSortedCountryCodes from '../../../utils/helpers/getSortedCountryCodes';\r\nimport FieldError from '../../Inputs/FieldError/FieldError';\r\n\r\nconst ClubForm = ({formData, errors, onChange}) => {\r\n const [showColourPicker, setShowColourPicker] = useState(false);\r\n const [colour, setColour] = useState(formData.colour);\r\n const [pickerColour, setPickerColour] = useState(formData.colour ? formData.colour : '#aabbcc');\r\n\r\n const updateColour = () => {\r\n setColour(pickerColour);\r\n setShowColourPicker(false);\r\n // Manually trigger on change.\r\n onChange(true, 'colour', pickerColour);\r\n }\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {/* \r\n \r\n */}\r\n \r\n {/* \r\n \r\n \r\n {\r\n setShowColourPicker(true)\r\n }\r\n } />\r\n \r\n */}\r\n {/* \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n */}\r\n {errors.saveError && }\r\n\r\n {showColourPicker &&\r\n setShowColourPicker(false)}\r\n title={'Select Colour'}\r\n btnText={'Select Colour'}\r\n onClick={updateColour}\r\n >\r\n \r\n \r\n \r\n\r\n \r\n }\r\n \r\n )\r\n};\r\n\r\nexport default ClubForm;\r\n","import {useState} from 'react';\r\nimport {\r\n RepCompaniesContainer,\r\n IconsContainer,\r\n} from './RepCompaniesList.styles';\r\nimport {routes} from '../../../options/routes';\r\nimport {buttonTypes} from '../../../options/buttonTypes';\r\nimport SectionContainer from '../../Containers/SectionContainer/SectionContainer';\r\nimport ClubsDetails from '../../ClubsPage/ClubsDetails/ClubsDetails';\r\nimport IconButton from '../../Buttons/IconButton/IconButton';\r\nimport LinkButton from '../../Buttons/LinkButton/LinkButton';\r\nimport NoResultsText from '../../Typography/NoResultsText/NoResultsText';\r\nimport StandardModal from '../../Modals/StandardModal/StandardModal';\r\nimport RepCompanyForm from '../../Forms/RepCompanyForm/RepCompanyForm';\r\nimport {EditOutlined} from '@mui/icons-material';\r\n\r\nconst RepCompaniesList = ({\r\n repCompanies,\r\n onFieldChange,\r\n onSubmit,\r\n formData,\r\n formErrors,\r\n setFormData,\r\n setFormErrors,\r\n updateLoading,\r\n}) => {\r\n const [formModalOpen, setFormModalOpen] = useState(false);\r\n const [isAdd, setIsAdd] = useState(true);\r\n const [managingRepCompany, setManagingClub] = useState(localStorage.getItem('manageRepCompanyId'));\r\n const unManageRepCompany = () => {\r\n setManagingClub(undefined);\r\n localStorage.removeItem('manageRepCompanyId');\r\n localStorage.removeItem('manageRepCompanyName');\r\n }\r\n\r\n const setManageRepCompany = (repCompanyId, repCompanyName) => {\r\n unManageRepCompany();\r\n localStorage.setItem('manageRepCompanyId', repCompanyId);\r\n localStorage.setItem('manageRepCompanyName', repCompanyName);\r\n setManagingClub(repCompanyId);\r\n window.location.href = routes.repManagement;\r\n }\r\n\r\n const handleFormModalClose = () => {\r\n // Reset state back to original values\r\n setFormModalOpen(false);\r\n setIsAdd(true);\r\n setFormData({\r\n id: undefined,\r\n name: '',\r\n contact: '',\r\n phone: '',\r\n location: '',\r\n indexLicenceCount: '',\r\n indexLicenceDiscount: '',\r\n analysisLicenceCount: '',\r\n analysisLicenceDiscount: '',\r\n dbLicenceCount: '',\r\n dbLicenceDiscount: '',\r\n player22LicenceCount: '',\r\n player22LicenceDiscount: '',\r\n salesRep: '',\r\n revenue: '',\r\n link: '',\r\n });\r\n setFormErrors({\r\n name: '',\r\n contact: '',\r\n phone: '',\r\n location: '',\r\n indexLicenceCount: '',\r\n indexLicenceDiscount: '',\r\n analysisLicenceCount: '',\r\n analysisLicenceDiscount: '',\r\n dbLicenceCount: '',\r\n dbLicenceDiscount: '',\r\n player22LicenceCount: '',\r\n player22LicenceDiscount: '',\r\n salesRep: '',\r\n revenue: '',\r\n link: '',\r\n });\r\n };\r\n\r\n const handleFormModalOpen = id => {\r\n if (id) {\r\n // Find index of item with matching id and pass those details into modal\r\n const index = repCompanies.findIndex(el => el.id === id);\r\n setFormData(repCompanies[index]);\r\n setIsAdd(false);\r\n }\r\n setFormModalOpen(true);\r\n };\r\n\r\n const handleFormModalSubmit = async () => {\r\n const result = await onSubmit();\r\n if (result) {\r\n handleFormModalClose();\r\n }\r\n };\r\n\r\n return (\r\n handleFormModalOpen()}\r\n >\r\n {\r\n repCompanies && repCompanies.length > 0 && repCompanies.map(repCompany => (\r\n \r\n \r\n \r\n }\r\n onClick={() => handleFormModalOpen(repCompany.id)}\r\n />\r\n {\r\n managingRepCompany === repCompany.id.toString() &&\r\n {\r\n unManageRepCompany();\r\n window.location.reload();\r\n }}\r\n />\r\n }\r\n {\r\n managingRepCompany !== repCompany.id.toString() &&\r\n setManageRepCompany(repCompany.id, repCompany.name)}\r\n />\r\n }\r\n \r\n \r\n ))\r\n }\r\n {\r\n (!repCompanies || repCompanies.length === 0) &&\r\n \r\n }\r\n {\r\n formModalOpen &&\r\n \r\n \r\n \r\n }\r\n \r\n );\r\n};\r\n\r\nexport default RepCompaniesList;\r\n","import { useEffect, useState, useCallback, createContext } from 'react';\r\nimport { routes } from '../../options/routes';\r\n\r\n// API calls\r\nimport { getRepCompanies } from '../../api';\r\n\r\nconst RepCompaniesContext = createContext({});\r\n\r\nconst RepCompaniesProvider = ({ children }) => {\r\n const [repCompaniesData, setRepCompaniesData] = useState({\r\n loading: true,\r\n repCompanies: null,\r\n apiError: false,\r\n });\r\n\r\n const getRepCompaniesData = useCallback(async () => {\r\n // Only trigger API call for rep companies route\r\n const activeRoute = window.location.pathname;\r\n\r\n if (activeRoute !== routes.repCompanyManagement) return;\r\n\r\n // Call API\r\n try {\r\n const repCompaniesApiData = await getRepCompanies();\r\n if (!repCompaniesApiData || !repCompaniesApiData.success || !repCompaniesApiData.data) {\r\n setRepCompaniesData({\r\n loading: false,\r\n repCompanies: null,\r\n apiError: true,\r\n });\r\n return;\r\n }\r\n const formattedRepCompanyData = repCompaniesApiData.data.map(({ id, club }) => {\r\n let location = '';\r\n if (club.city && club.country) {\r\n location = `${club.city}, ${club.country}`;\r\n } else if (club.city) {\r\n location = `${club.city}`;\r\n } else if (club.country) {\r\n location = `${club.country}`;\r\n }\r\n return {\r\n id,\r\n name: club.name,\r\n contact: club.contact,\r\n telephone: club.telephone,\r\n telephoneCountryCode: club.telephoneCountryCode,\r\n addr1: club.addr1,\r\n addr2: club.addr2,\r\n addr3: club.addr3,\r\n city: club.city,\r\n colour: `#${club.colour}`,\r\n location,\r\n postcode: club.postcode,\r\n country: club.country,\r\n safe_zone_radius: club.safe_zone_radius || 0.74,\r\n // indexLicenceCount: '2',\r\n // indexLicenceDiscount: '20',\r\n // analysisLicenceCount: '0',\r\n // analysisLicenceDiscount: '0',\r\n // dbLicenceCount: '0',\r\n // dbLicenceDiscount: '0',\r\n // player22LicenceCount: '20',\r\n // player22LicenceDiscount: '0',\r\n // salesRep: 'PerfTeq',\r\n // revenue: '£125 PM',\r\n // link: '',\r\n };\r\n });\r\n setRepCompaniesData({\r\n loading: false,\r\n repCompanies: formattedRepCompanyData,\r\n apiError: false,\r\n });\r\n return;\r\n } catch (error) {\r\n setRepCompaniesData({\r\n loading: false,\r\n repCompanies: null,\r\n apiError: true,\r\n });\r\n return;\r\n }\r\n }, []);\r\n\r\n useEffect(() => {\r\n getRepCompaniesData();\r\n }, [getRepCompaniesData]);\r\n\r\n return (\r\n \r\n {children}\r\n \r\n );\r\n}\r\n\r\nexport { RepCompaniesProvider, RepCompaniesContext };\r\n\r\nexport default RepCompaniesProvider;\r\n","import { useEffect, useContext, useState } from 'react';\r\nimport\r\n {\r\n SearchContainer,\r\n } from './RepCompanyManagement.styles';\r\nimport MainWrapper from '../../../components/Wrappers/MainWrapper/MainWrapper';\r\nimport Title from '../../../components/Typography/Title/Title';\r\nimport SectionTitle from '../../../components/Typography/SectionTitle/SectionTitle';\r\nimport CustomSearchField from '../../../components/Inputs/CustomSearchField/CustomSearchField';\r\nimport RepCompaniesList from '../../../components/Tables/RepCompaniesList/RepCompaniesList';\r\n\r\n// Contexts\r\nimport { BaseContext } from '../../../providers/Global/BaseProvider';\r\nimport { RepCompaniesContext } from '../../../providers/Admin/RepCompaniesProvider';\r\n// Validators & helpers\r\nimport emailIsValid from '../../../utils/validation/email';\r\nimport phoneNumberIsValid from '../../../utils/validation/phoneNumber';\r\nimport { debounce } from 'debounce';\r\n\r\n// API Calls\r\nimport { addRepCompany, updateRepCompany } from '../../../api';\r\nimport { routes } from '../../../options/routes';\r\n\r\nconst RepCompanyManagement = () =>\r\n{\r\n const baseContext = useContext(BaseContext);\r\n const repCompaniesContext = useContext(RepCompaniesContext);\r\n const [dataLoading, setDataLoading] = useState(true);\r\n const [repCompanyLoading, setRepCompanyLoading] = useState(false);\r\n const [repCompaniesList, setRepCompaniesList] = useState([]);\r\n const [error, setError] = useState({\r\n show: false,\r\n message: '',\r\n });\r\n const [searchData, setSearchData] = useState({\r\n repCompanySearch: '',\r\n });\r\n const initialRepCompanyState = {\r\n name: '',\r\n contact: '',\r\n telephoneCountryCode: '',\r\n telephone: '',\r\n location: '',\r\n addr1: '',\r\n addr2: '',\r\n addr3: '',\r\n city: '',\r\n postcode: '',\r\n safe_zone_radius: '0.74',\r\n colour: '#ffffff',\r\n }\r\n\r\n const initialRepCompanyErrors = {\r\n name: '',\r\n contact: '',\r\n telephoneCountryCode: '',\r\n telephone: '',\r\n location: '',\r\n addr1: '',\r\n addr2: '',\r\n addr3: '',\r\n city: '',\r\n postcode: '',\r\n safe_zone_radius: '',\r\n colour: '',\r\n }\r\n const [searchResults, setSearchResults] = useState([]);\r\n const [repCompanyData, setRepCompanyData] = useState(initialRepCompanyState);\r\n const [repCompanyErrors, setRepCompanyErrors] = useState(initialRepCompanyErrors);\r\n\r\n useEffect(() =>\r\n {\r\n if (!baseContext.baseData.loading && !repCompaniesContext.repCompaniesData.loading)\r\n {\r\n setDataLoading(false);\r\n setRepCompaniesList(repCompaniesContext.repCompaniesData.repCompanies);\r\n }\r\n // Set auto-renew on page load\r\n }, [baseContext, repCompaniesContext]);\r\n\r\n const handleBannerClose = () =>\r\n {\r\n setError({\r\n show: false,\r\n message: '',\r\n });\r\n };\r\n\r\n const handleSearchChange = e =>\r\n {\r\n let data = { ...searchData };\r\n data[e.target.id] = e.target.value;\r\n setSearchData(data);\r\n\r\n // Ensure all data is in lowercase for comparison logic to work correctly\r\n handleSearchSubmit(data.clubSearch.toLowerCase());\r\n };\r\n\r\n const handleSearchSubmit = searchTerm =>\r\n {\r\n // Filter results with name, email, phone or location matching searchTerm\r\n const results = repCompaniesList.filter(\r\n repCompany =>\r\n repCompany.name.toLowerCase()?.includes(searchTerm) ||\r\n repCompany.contact.toLowerCase()?.includes(searchTerm) ||\r\n repCompany.telephone?.includes(searchTerm) ||\r\n repCompany.location.toLowerCase()?.includes(searchTerm)\r\n );\r\n setSearchResults(results);\r\n };\r\n\r\n const handleSearchClear = () =>\r\n {\r\n setSearchData({\r\n repCompanySearch: '',\r\n });\r\n setSearchResults([]);\r\n };\r\n\r\n const handleClubChange = (e, id, val) =>\r\n {\r\n // Clear errors\r\n setRepCompanyErrors(initialRepCompanyErrors);\r\n handleBannerClose();\r\n\r\n // Update repData\r\n let data = { ...repCompanyData };\r\n if (e && id)\r\n {\r\n // For autocomplete field\r\n data[id] = val;\r\n } else\r\n {\r\n data[e.target.id] = e.target.value;\r\n }\r\n setRepCompanyData(data);\r\n };\r\n\r\n const handleClubSubmit = async () =>\r\n {\r\n await setRepCompanyLoading(true);\r\n // Set form errors\r\n let formErrors = { ...repCompanyErrors };\r\n let hasErrors = false;\r\n if (!repCompanyData.name)\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n name: 'Name is required'\r\n };\r\n hasErrors = true;\r\n }\r\n if (!emailIsValid(repCompanyData.contact))\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n contact: 'A valid Contact email is required'\r\n };\r\n hasErrors = true;\r\n }\r\n if (!phoneNumberIsValid(repCompanyData.telephone))\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n telephone: 'A valid Phone number is required'\r\n };\r\n hasErrors = true;\r\n }\r\n if (!repCompanyData.telephoneCountryCode)\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n telephoneCountryCode: 'Country Code is required'\r\n };\r\n hasErrors = true;\r\n }\r\n if (!repCompanyData.country)\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n country: 'Country is required'\r\n };\r\n hasErrors = true;\r\n }\r\n if (!repCompanyData.addr1)\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n addr1: 'Address is required'\r\n };\r\n hasErrors = true;\r\n }\r\n if (!repCompanyData.city)\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n city: 'City is required'\r\n };\r\n hasErrors = true;\r\n }\r\n if (!repCompanyData.postcode)\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n postcode: 'Postcode is required'\r\n };\r\n hasErrors = true;\r\n }\r\n // Set errors and return if there are errors\r\n setRepCompanyErrors(formErrors);\r\n if (hasErrors)\r\n {\r\n setRepCompanyLoading(false);\r\n return false;\r\n }\r\n\r\n // Trigger API call\r\n const { id, location, ...dataToSave } = repCompanyData;\r\n const repCompanySaveResponse = id ? await updateRepCompany(id, dataToSave) : await addRepCompany(repCompanyData);\r\n\r\n if (!repCompanySaveResponse || !repCompanySaveResponse.success || repCompanySaveResponse.code !== 200)\r\n {\r\n setRepCompanyLoading(false);\r\n setRepCompanyErrors({\r\n saveError: 'There was an error with the request. Please check email and phone number are unique.',\r\n });\r\n return;\r\n }\r\n\r\n setError({\r\n ...error,\r\n message: 'Rep Company has been successfully added',\r\n });\r\n await repCompaniesContext.getRepCompaniesData();\r\n setRepCompanyData(initialRepCompanyState);\r\n setRepCompanyLoading(false);\r\n return true;\r\n };\r\n\r\n return (\r\n <>\r\n {\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n }\r\n >\r\n );\r\n};\r\n\r\nexport default RepCompanyManagement;\r\n","import {styled} from '@mui/material';\r\n\r\nexport const SearchContainer = styled('div')(({ theme }) => ({\r\n marginBottom: 15,\r\n width: '50%',\r\n position: 'relative',\r\n zIndex: 1,\r\n [theme.breakpoints.down('sm')]: {\r\n width: '100%',\r\n },\r\n}));\r\n","import {styled} from '@mui/material';\r\n\r\nexport const ClubsContainer = styled('div')(() => ({\r\n marginBottom: 20,\r\n padding: 10,\r\n display: 'flex',\r\n justifyContent: 'space-between',\r\n alignItems: 'flex-start',\r\n '&:nth-of-type(even)': {\r\n background: 'rgba(255, 255, 255, 0.03)',\r\n },\r\n}));\r\n\r\nexport const IconsContainer = styled('div')(() => ({\r\n display: 'flex',\r\n '& .MuiButtonBase-root': {\r\n marginLeft: 10,\r\n },\r\n}));\r\n","import {styled} from '@mui/material';\r\nimport {colors} from '../../../options/colors';\r\n\r\nexport const Container = styled('div')(() => ({\r\n '& > div:last-of-type': {\r\n marginBottom: 0,\r\n },\r\n}));\r\n\r\nexport const InlineFieldContainer = styled('div')(({ theme }) => ({\r\n display: 'flex',\r\n justifyContent: 'space-between',\r\n '& > div:nth-of-type(1)': {\r\n display: 'inline-block',\r\n width: '47%',\r\n },\r\n '& > div:nth-of-type(2)': {\r\n display: 'inline-block',\r\n width: '47%',\r\n },\r\n [theme.breakpoints.down('sm')]: {\r\n flexDirection: 'column',\r\n justifyContent: 'unset',\r\n '& > div': {\r\n width: '100% !important',\r\n }\r\n },\r\n}));\r\n\r\nexport const FieldContainer = styled('div')(() => ({\r\n marginBottom: 20,\r\n}));\r\n\r\nexport const DiscountFieldContainer = styled('div')(({ theme }) => ({\r\n display: 'flex',\r\n justifyContent: 'space-between',\r\n '& > div:nth-of-type(1)': {\r\n display: 'inline-block',\r\n width: '64%',\r\n },\r\n '& > div:nth-of-type(2)': {\r\n display: 'inline-block',\r\n width: '30%',\r\n },\r\n [theme.breakpoints.down('xs')]: {\r\n flexDirection: 'column',\r\n '& > div': {\r\n width: '100% !important',\r\n },\r\n '& > div:nth-of-type(1)': {\r\n marginBottom: 20,\r\n },\r\n },\r\n}));\r\n\r\nexport const PhoneFieldContainer = styled('div')(() => ({\r\n display: 'flex !important',\r\n justifyContent: 'space-between',\r\n '& > div:nth-of-type(1)': {\r\n display: 'inline-block',\r\n width: 125,\r\n marginRight: 20,\r\n },\r\n '& > div:nth-of-type(2)': {\r\n display: 'inline-block',\r\n width: '100%',\r\n },\r\n}));\r\n\r\nexport const ColourSelectorInput = styled('div')(({selectedcolour}) => ({\r\n border: `1px solid ${colors.secondaryGrey}`,\r\n borderRadius: 5,\r\n height: 53,\r\n cursor: 'pointer',\r\n backgroundColor: selectedcolour ? selectedcolour : colors.black,\r\n}));\r\n\r\nexport const ColourPickerContainer = styled('div')(() => ({\r\n display: 'flex',\r\n justifyContent: 'center',\r\n}));\r\n\r\n","import {useState} from 'react';\r\nimport {HexColorPicker} from 'react-colorful';\r\nimport {\r\n Container,\r\n InlineFieldContainer,\r\n FieldContainer,\r\n PhoneFieldContainer,\r\n ColourSelectorInput,\r\n ColourPickerContainer,\r\n} from './ClubForm.styles';\r\nimport StandardModal from '../../Modals/StandardModal/StandardModal';\r\nimport {countries} from '../../../options/countries';\r\nimport CustomTextField from '../../Inputs/CustomTextField/CustomTextField';\r\nimport Label from '../../Typography/Label/Label';\r\nimport CustomAutocomplete from '../../Inputs/CustomAutocomplete/CustomAutocomplete';\r\nimport getSortedCountryCodes from '../../../utils/helpers/getSortedCountryCodes';\r\n\r\nconst ClubForm = ({formData, errors, onChange}) => {\r\n const [showColourPicker, setShowColourPicker] = useState(false);\r\n const [colour, setColour] = useState(formData.colour);\r\n const [pickerColour, setPickerColour] = useState(formData.colour ? formData.colour : '#aabbcc');\r\n\r\n const updateColour = () => {\r\n setColour(pickerColour);\r\n setShowColourPicker(false);\r\n // Manually trigger on change.\r\n onChange(true, 'colour', pickerColour);\r\n }\r\n\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {/* \r\n \r\n */}\r\n \r\n \r\n {\r\n setShowColourPicker(true)\r\n }\r\n } />\r\n \r\n \r\n {/* \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n */}\r\n {showColourPicker &&\r\n setShowColourPicker(false)}\r\n title={'Select Colour'}\r\n btnText={'Select Colour'}\r\n onClick={updateColour}\r\n >\r\n \r\n \r\n \r\n\r\n \r\n }\r\n \r\n )\r\n};\r\n\r\nexport default ClubForm;\r\n","import { useState } from 'react';\r\nimport\r\n{\r\n ClubsContainer,\r\n IconsContainer,\r\n} from './ClubsList.styles';\r\nimport { routes } from '../../../options/routes';\r\nimport { buttonTypes } from '../../../options/buttonTypes';\r\nimport SectionContainer from '../../../components/Containers/SectionContainer/SectionContainer';\r\nimport ClubsDetails from '../../ClubsPage/ClubsDetails/ClubsDetails';\r\nimport IconButton from '../../../components/Buttons/IconButton/IconButton';\r\nimport LinkButton from '../../Buttons/LinkButton/LinkButton';\r\nimport NoResultsText from '../../../components/Typography/NoResultsText/NoResultsText';\r\nimport StandardModal from '../../Modals/StandardModal/StandardModal';\r\nimport ClubForm from '../../Forms/ClubForm/ClubForm';\r\nimport { EditOutlined } from '@mui/icons-material';\r\nimport { setManageClubId, unsetManage } from '../../../utils/helpers/clubHelper';\r\n\r\nconst ClubsList = ({\r\n clubs,\r\n onFieldChange,\r\n onSubmit,\r\n formData,\r\n formErrors,\r\n setFormData,\r\n setFormErrors,\r\n updateLoading,\r\n}) =>\r\n{\r\n const [formModalOpen, setFormModalOpen] = useState(false);\r\n const [isAdd, setIsAdd] = useState(true);\r\n const [managingClub, setManagingClub] = useState(localStorage.getItem('manageClubId'));\r\n const unManageClub = () =>\r\n {\r\n setManagingClub(undefined);\r\n unsetManage()\r\n }\r\n\r\n const setManageClub = (clubId) =>\r\n {\r\n unManageClub();\r\n setManageClubId(clubId);\r\n setManagingClub(clubId);\r\n window.location.href = routes.home;\r\n }\r\n\r\n const handleFormModalClose = () =>\r\n {\r\n // Reset state back to original values\r\n setFormModalOpen(false);\r\n setIsAdd(true);\r\n setFormData({\r\n id: undefined,\r\n name: '',\r\n contact: '',\r\n phone: '',\r\n location: '',\r\n indexLicenceCount: '',\r\n indexLicenceDiscount: '',\r\n analysisLicenceCount: '',\r\n analysisLicenceDiscount: '',\r\n dbLicenceCount: '',\r\n dbLicenceDiscount: '',\r\n rezzilPlayerLicenceCount: '',\r\n rezzilPlayerLicenceDiscount: '',\r\n salesRep: '',\r\n revenue: '',\r\n link: '',\r\n });\r\n setFormErrors({\r\n name: '',\r\n contact: '',\r\n phone: '',\r\n location: '',\r\n indexLicenceCount: '',\r\n indexLicenceDiscount: '',\r\n analysisLicenceCount: '',\r\n analysisLicenceDiscount: '',\r\n dbLicenceCount: '',\r\n dbLicenceDiscount: '',\r\n rezzilPlayerLicenceCount: '',\r\n rezzilPlayerLicenceDiscount: '',\r\n salesRep: '',\r\n revenue: '',\r\n link: '',\r\n });\r\n };\r\n\r\n const handleFormModalOpen = id =>\r\n {\r\n if (id)\r\n {\r\n // Find index of item with matching id and pass those details into modal\r\n const index = clubs.findIndex(el => el.id === id);\r\n setFormData(clubs[index]);\r\n setIsAdd(false);\r\n }\r\n setFormModalOpen(true);\r\n };\r\n\r\n const handleFormModalSubmit = async () =>\r\n {\r\n const result = await onSubmit();\r\n if (result)\r\n {\r\n handleFormModalClose();\r\n }\r\n };\r\n\r\n return (\r\n handleFormModalOpen()}\r\n caption={'Club not listed?'}\r\n >\r\n {\r\n clubs && clubs.length > 0 && clubs.map(club => (\r\n \r\n \r\n \r\n }\r\n onClick={() => handleFormModalOpen(club.id)}\r\n />\r\n {\r\n\r\n }\r\n {\r\n managingClub === club.id &&\r\n \r\n {\r\n unManageClub();\r\n window.location.reload();\r\n }}\r\n />\r\n }\r\n {\r\n managingClub !== club.id &&\r\n setManageClub(club.id)}\r\n />\r\n }\r\n \r\n \r\n ))\r\n }\r\n {\r\n (!clubs || clubs.length === 0) &&\r\n \r\n }\r\n {\r\n formModalOpen &&\r\n \r\n \r\n \r\n }\r\n \r\n );\r\n};\r\n\r\nexport default ClubsList;\r\n","import { useEffect, useState, useCallback, createContext, useContext } from 'react';\r\nimport {routes} from '../../options/routes';\r\n\r\n// Contexts\r\nimport {BaseContext} from '../Global/BaseProvider';\r\n\r\n// API calls\r\nimport {getAllClubs, getClubsByRep} from '../../api';\r\nimport { isRep } from '../../utils/helpers/userRoleHelper';\r\n\r\nconst ClubsContext = createContext({});\r\n\r\nconst ClubsProvider = ({children}) => {\r\n const [clubsData, setClubsData] = useState({\r\n loading: true,\r\n clubs: null,\r\n apiError: false,\r\n });\r\n const baseContext = useContext(BaseContext);\r\n\r\n const getClubsData = useCallback(async () => {\r\n // Only trigger API call for admin clubs route\r\n const activeRoute = window.location.pathname;\r\n if (activeRoute !== routes.clubManagement) return;\r\n\r\n // Call API - get payments and invoice data\r\n if (!baseContext.baseData.loading) {\r\n try {\r\n // Check to see if they have permission to see all clubs:\r\n const clubsApiData = isRep() ? await getClubsByRep(baseContext.baseData.userProfile.id): await getAllClubs();\r\n if (!clubsApiData || !clubsApiData.success || !clubsApiData.data) {\r\n setClubsData({\r\n loading: false,\r\n clubs: null,\r\n apiError: true,\r\n });\r\n return;\r\n }\r\n const formattedClubData = clubsApiData.data.map((club) => {\r\n let location = '';\r\n if (club.city && club.country) {\r\n location = `${club.city}, ${club.country}`;\r\n } else if (club.city) {\r\n location = `${club.city}`;\r\n } else if (club.country) {\r\n location = `${club.country}`;\r\n }\r\n return {\r\n id: club.id,\r\n name: club.name,\r\n contact: club.contact,\r\n telephone: club.telephone,\r\n telephoneCountryCode: club.telephoneCountryCode,\r\n addr1: club.addr1,\r\n addr2: club.addr2,\r\n addr3: club.addr3,\r\n city: club.city,\r\n colour: `#${club.colour}`,\r\n location,\r\n postcode: club.postcode,\r\n country: club.country,\r\n safe_zone_radius: club.safe_zone_radius || 0.74,\r\n indexLicenceCount: '--',\r\n // indexLicenceDiscount: '20',\r\n // analysisLicenceCount: '0',\r\n // analysisLicenceDiscount: '0',\r\n // dbLicenceCount: '0',\r\n // dbLicenceDiscount: '0',\r\n // player22LicenceCount: '20',\r\n // player22LicenceDiscount: '0',\r\n // salesRep: 'PerfTeq',\r\n // revenue: '£125 PM',\r\n // link: '',\r\n };\r\n });\r\n setClubsData({\r\n loading: false,\r\n clubs: formattedClubData,\r\n apiError: false,\r\n });\r\n return;\r\n } catch (error) {\r\n setClubsData({\r\n loading: false,\r\n clubs: null,\r\n apiError: true,\r\n });\r\n return;\r\n }\r\n }\r\n }, [baseContext]);\r\n\r\n useEffect(() => {\r\n getClubsData();\r\n }, [getClubsData]);\r\n\r\n return (\r\n \r\n {children}\r\n \r\n );\r\n}\r\n\r\nexport {ClubsProvider, ClubsContext};\r\n\r\nexport default ClubsProvider;\r\n","import { useEffect, useContext, useState } from 'react';\r\nimport\r\n{\r\n SearchContainer,\r\n} from './ClubManagement.styles';\r\nimport MainWrapper from '../../../components/Wrappers/MainWrapper/MainWrapper';\r\nimport Title from '../../../components/Typography/Title/Title';\r\nimport SectionTitle from '../../../components/Typography/SectionTitle/SectionTitle';\r\nimport CustomSearchField from '../../../components/Inputs/CustomSearchField/CustomSearchField';\r\nimport ClubsList from '../../../components/Tables/ClubsList/ClubsList';\r\n\r\n// Contexts\r\nimport { BaseContext } from '../../../providers/Global/BaseProvider';\r\nimport { ClubsContext } from '../../../providers/Admin/ClubProvider';\r\n// Validators & helpers\r\nimport emailIsValid from '../../../utils/validation/email';\r\nimport phoneNumberIsValid from '../../../utils/validation/phoneNumber';\r\nimport { debounce } from 'debounce';\r\n\r\n// API Calls\r\nimport { addClub, getClubLicences, updateClub } from '../../../api';\r\nimport { routes } from '../../../options/routes';\r\n\r\nconst ClubManagement = () =>\r\n{\r\n const baseContext = useContext(BaseContext);\r\n const clubsContext = useContext(ClubsContext);\r\n const [dataLoading, setDataLoading] = useState(true);\r\n const [clubLoading, setClubLoading] = useState(false);\r\n const [clubsList, setClubsList] = useState([]);\r\n const [error, setError] = useState({\r\n show: false,\r\n message: '',\r\n });\r\n const [searchData, setSearchData] = useState({\r\n clubSearch: '',\r\n });\r\n const initialClubState = {\r\n name: '',\r\n contact: '',\r\n telephoneCountryCode: '',\r\n telephone: '',\r\n location: '',\r\n addr1: '',\r\n addr2: '',\r\n addr3: '',\r\n city: '',\r\n postcode: '',\r\n safe_zone_radius: '0.74',\r\n colour: '',\r\n }\r\n\r\n const initialClubErrors = {\r\n name: '',\r\n contact: '',\r\n telephoneCountryCode: '',\r\n telephone: '',\r\n location: '',\r\n addr1: '',\r\n addr2: '',\r\n addr3: '',\r\n city: '',\r\n postcode: '',\r\n safe_zone_radius: '',\r\n colour: '',\r\n }\r\n const [searchResults, setSearchResults] = useState([]);\r\n const [clubData, setClubData] = useState(initialClubState);\r\n const [clubErrors, setClubErrors] = useState(initialClubErrors);\r\n const [clubLicences, setClubLicences] = useState([]);\r\n\r\n const getClubLicenceData = async (clubData) =>\r\n {\r\n // Need to call the licence endpoint for each club to get the number of licences\r\n let updatedClubLicences = [];\r\n for (let i = 0; i < clubData.length; i++)\r\n {\r\n const currentIndexLicenceCount = clubLicences.find(club => club.clubId === clubData[i].id)?.indexLicenceCount;\r\n if (currentIndexLicenceCount !== undefined && currentIndexLicenceCount !== '--')\r\n {\r\n // Licence data already populated\r\n updatedClubLicences.push({ clubId: clubData[i].id, indexLicenceCount: currentIndexLicenceCount });\r\n } else\r\n {\r\n const clubLicence = await getClubLicences(clubData[i].id);\r\n if (!clubLicence || !clubLicence.data || !clubLicence?.data.length)\r\n {\r\n updatedClubLicences.push({\r\n clubId: clubData[i].id,\r\n indexLicenceCount: 0,\r\n licenseList: 'none'\r\n });\r\n // return;\r\n } else\r\n {\r\n const indexLicence = clubLicence?.data.filter((licence) => licence.type === 'BASE');\r\n let licenseList = indexLicence.map(a => a.label);\r\n licenseList = [...new Set(licenseList)];\r\n\r\n updatedClubLicences.push({\r\n clubId: clubData[i].id,\r\n indexLicenceCount: indexLicence ? indexLicence.length : 0,\r\n licenseList: licenseList.join(', ')\r\n });\r\n }\r\n }\r\n }\r\n const updatedClubData = clubData.map((club) =>\r\n {\r\n const clubLicenceData = updatedClubLicences.find((licenceData) => licenceData.clubId === club.id);\r\n return {\r\n ...club,\r\n indexLicenceCount: clubLicenceData ? clubLicenceData.indexLicenceCount : 0,\r\n licenseList: clubLicenceData.licenseList\r\n }\r\n });\r\n setClubLicences([...updatedClubLicences]);\r\n setClubsList([...updatedClubData]);\r\n }\r\n\r\n useEffect(() =>\r\n {\r\n if (!baseContext.baseData.loading && !clubsContext.clubsData.loading)\r\n {\r\n setDataLoading(false);\r\n setClubsList(clubsContext.clubsData.clubs);\r\n getClubLicenceData(clubsContext.clubsData.clubs);\r\n }\r\n }, [baseContext, clubsContext]);\r\n\r\n const handleBannerClose = () =>\r\n {\r\n setError({\r\n show: false,\r\n message: '',\r\n });\r\n };\r\n\r\n const handleSearchChange = e =>\r\n {\r\n let data = { ...searchData };\r\n data[e.target.id] = e.target.value;\r\n setSearchData(data);\r\n\r\n // Ensure all data is in lowercase for comparison logic to work correctly\r\n handleSearchSubmit(data.clubSearch.toLowerCase());\r\n };\r\n\r\n const handleSearchSubmit = searchTerm =>\r\n {\r\n // Filter results with name, email, phone or location matching searchTerm\r\n const results = clubsList.filter(\r\n club =>\r\n club.name.toLowerCase()?.includes(searchTerm) ||\r\n club.contact.toLowerCase()?.includes(searchTerm) ||\r\n club.telephone?.includes(searchTerm) ||\r\n club.location.toLowerCase()?.includes(searchTerm)\r\n );\r\n setSearchResults(results);\r\n };\r\n\r\n const handleSearchClear = () =>\r\n {\r\n setSearchData({\r\n clubSearch: '',\r\n });\r\n setSearchResults([]);\r\n };\r\n\r\n const handleClubChange = (e, id, val) =>\r\n {\r\n // Clear errors\r\n setClubErrors(initialClubErrors);\r\n handleBannerClose();\r\n\r\n // Update repData\r\n let data = { ...clubData };\r\n if (e && id)\r\n {\r\n // For autocomplete field\r\n data[id] = val;\r\n } else\r\n {\r\n data[e.target.id] = e.target.value;\r\n }\r\n setClubData(data);\r\n };\r\n\r\n const handleClubSubmit = async () =>\r\n {\r\n await setClubLoading(true);\r\n // Set form errors\r\n let formErrors = { ...clubErrors };\r\n let hasErrors = false;\r\n if (!clubData.name)\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n name: 'Name is required'\r\n };\r\n hasErrors = true;\r\n }\r\n if (!emailIsValid(clubData.contact))\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n contact: 'A valid Contact email is required'\r\n };\r\n hasErrors = true;\r\n }\r\n if (!phoneNumberIsValid(clubData.telephone))\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n telephone: 'A valid Phone number is required'\r\n };\r\n hasErrors = true;\r\n }\r\n if (!clubData.telephoneCountryCode)\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n telephoneCountryCode: 'Country Code is required'\r\n };\r\n hasErrors = true;\r\n }\r\n if (!clubData.country)\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n country: 'Country is required'\r\n };\r\n hasErrors = true;\r\n }\r\n if (!clubData.addr1)\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n addr1: 'Address is required'\r\n };\r\n hasErrors = true;\r\n }\r\n if (!clubData.city)\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n city: 'City is required'\r\n };\r\n hasErrors = true;\r\n }\r\n if (!clubData.postcode)\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n postcode: 'Postcode is required'\r\n };\r\n hasErrors = true;\r\n }\r\n // if(!clubData.safe_zone_radius) {\r\n // formErrors = {\r\n // ...formErrors,\r\n // safe_zone_radius: 'Safe Zone Radius is required'\r\n // };\r\n // hasErrors = true;\r\n // }\r\n if (!clubData.colour)\r\n {\r\n formErrors = {\r\n ...formErrors,\r\n colour: 'Colour is required'\r\n };\r\n hasErrors = true;\r\n }\r\n // if (!clubData.indexLicenceCount) {\r\n // formErrors = {\r\n // ...formErrors,\r\n // indexLicenceCount: 'Index Licence is required'\r\n // };\r\n // hasErrors = true;\r\n // }\r\n // if (clubData.indexLicenceDiscount > 100) {\r\n // formErrors = {\r\n // ...formErrors,\r\n // indexLicenceDiscount: 'The maximum available discount is 100%'\r\n // };\r\n // hasErrors = true;\r\n // }\r\n // if (!clubData.analysisLicenceCount) {\r\n // formErrors = {\r\n // ...formErrors,\r\n // analysisLicenceCount: 'Analysis Licence is required'\r\n // };\r\n // hasErrors = true;\r\n // }\r\n // if (clubData.analysisLicenceDiscount > 100) {\r\n // formErrors = {\r\n // ...formErrors,\r\n // analysisLicenceDiscount: 'The maximum available discount is 100%'\r\n // };\r\n // hasErrors = true;\r\n // }\r\n // if (!clubData.dbLicenceCount) {\r\n // formErrors = {\r\n // ...formErrors,\r\n // dbLicenceCount: 'DB Licence is required'\r\n // };\r\n // hasErrors = true;\r\n // }\r\n // if (clubData.dbLicenceDiscount > 100) {\r\n // formErrors = {\r\n // ...formErrors,\r\n // dbLicenceDiscount: 'The maximum available discount is 100%'\r\n // };\r\n // hasErrors = true;\r\n // }\r\n // if (!clubData.rezzilPlayerLicenceCount) {\r\n // formErrors = {\r\n // ...formErrors,\r\n // rezzilPlayerLicenceCount: 'Rezzil Player Licence is required'\r\n // };\r\n // hasErrors = true;\r\n // }\r\n // if (clubData.rezzilPlayerLicenceDiscount > 100) {\r\n // formErrors = {\r\n // ...formErrors,\r\n // rezzilPlayerLicenceDiscount: 'The maximum available discount is 100%'\r\n // };\r\n // hasErrors = true;\r\n // }\r\n // if(!clubData.salesRep) {\r\n // formErrors = {\r\n // ...formErrors,\r\n // salesRep: 'Sales Rep is required'\r\n // };\r\n // hasErrors = true;\r\n // }\r\n // if(!clubData.revenue) {\r\n // formErrors = {\r\n // ...formErrors,\r\n // revenue: 'Rep Revenue is required'\r\n // };\r\n // hasErrors = true;\r\n // }\r\n\r\n // Set errors and return if there are errors\r\n setClubErrors(formErrors);\r\n if (hasErrors)\r\n {\r\n setClubLoading(false);\r\n return false;\r\n }\r\n\r\n // Trigger API call\r\n const { id, location, ...dataToSave } = clubData;\r\n if (id)\r\n {\r\n await updateClub(id, dataToSave);\r\n } else\r\n {\r\n await addClub(clubData);\r\n }\r\n\r\n clubsContext.getClubsData();\r\n setError({\r\n ...error,\r\n message: id ? 'Club has been successfully updated' : 'Club has been successfully added',\r\n });\r\n\r\n setClubData(initialClubState);\r\n setClubLoading(false);\r\n return true;\r\n };\r\n\r\n return (\r\n <>\r\n {\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n }\r\n >\r\n );\r\n};\r\n\r\nexport default ClubManagement;\r\n","import {styled} from '@mui/material';\r\n\r\nexport const OverviewContainer = styled('div')(() => ({\r\n marginBottom: 40,\r\n}));\r\n\r\nexport const SelectContainer = styled('div')(() => ({\r\n width: 220,\r\n marginBottom: 15,\r\n}));\r\n\r\nexport const BreakdownContainer = styled('div')(() => ({\r\n marginBottom: 30,\r\n}));\r\n\r\nexport const ChartContainer = styled('div')(() => ({}));\r\n","import {styled} from '@mui/material';\r\n\r\nexport const CardsContainer = styled('div')(({ theme, data }) => ({\r\n display: 'flex',\r\n justifyContent: data ? 'space-between' : 'center',\r\n '& > div': {\r\n margin: '0 15px',\r\n width: '33%',\r\n '&:first-of-type': {\r\n marginLeft: 0,\r\n },\r\n '&:last-of-type': {\r\n marginRight: 0,\r\n },\r\n },\r\n [theme.breakpoints.down('md')]: {\r\n flexWrap: 'wrap',\r\n '& > div': {\r\n margin: '0 0 30px',\r\n width: '41%',\r\n },\r\n },\r\n [theme.breakpoints.down('sm')]: {\r\n flexDirection: 'column',\r\n '& > div': {\r\n width: 'unset',\r\n maxWidth: 'unset',\r\n '&:last-of-type': {\r\n marginBottom: 0,\r\n },\r\n },\r\n },\r\n}));\r\n","import {\r\n styled,\r\n Card,\r\n CardContent,\r\n Typography,\r\n} from '@mui/material';\r\nimport {colors} from '../../../options/colors';\r\n\r\nexport const StyledCard = styled(Card)(() => ({\r\n padding: 20,\r\n background: 'rgba(0, 0, 0, 0.4)',\r\n borderRadius: 5,\r\n boxShadow: 'none',\r\n backdropFilter: 'blur(20px)',\r\n}));\r\n\r\nexport const StyledCardContent = styled(CardContent)(() => ({\r\n padding: '0 !important',\r\n display: 'flex',\r\n alignItems: 'center',\r\n}));\r\n\r\nexport const IconAvatarContainer = styled('div')(() => ({\r\n marginRight: 20,\r\n}));\r\n\r\nexport const DetailsContainer = styled('div')(() => ({}));\r\n\r\nexport const CardTitle = styled(Typography)(() => ({\r\n fontFamily: 'GraphikMedium, sans-serif',\r\n fontSize: 18,\r\n lineHeight: '18px',\r\n margin: '0 0 8px',\r\n color: colors.primaryGrey,\r\n}));\r\n\r\nexport const PriceText = styled(Typography)(() => ({\r\n fontFamily: 'GraphikMedium, sans-serif',\r\n fontSize: 26,\r\n lineHeight: '26px',\r\n margin: 0,\r\n color: colors.white,\r\n}));\r\n","import {\r\n StyledCard,\r\n StyledCardContent,\r\n IconAvatarContainer,\r\n DetailsContainer,\r\n CardTitle,\r\n PriceText,\r\n} from './RevenueCard.styles';\r\nimport IconAvatar from '../../Avatars/IconAvatar/IconAvatar';\r\n\r\nconst RevenueCard = ({avatarBgColor, icon, title, price}) => {\r\n return (\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {title}\r\n \r\n \r\n {price}\r\n \r\n \r\n \r\n \r\n );\r\n};\r\n\r\nexport default RevenueCard;\r\n","import {\r\n CardsContainer,\r\n} from './RevenueCards.styles';\r\nimport SectionSpinner from '../../Loading/SectionSpinner/SectionSpinner';\r\nimport RevenueCard from '../../Cards/RevenueCard/RevenueCard';\r\nimport NoResultsText from '../../Typography/NoResultsText/NoResultsText';\r\n\r\nconst RevenueCards = ({data, loading}) => {\r\n return (\r\n 0 ? 'true' : undefined}\r\n >\r\n {\r\n loading &&\r\n \r\n }\r\n {\r\n !loading && data.length > 0 && data.map(({id, avatarBgColor, icon, title, price}) => (\r\n \r\n ))\r\n }\r\n {\r\n (!loading && (!data || data.length === 0)) &&\r\n \r\n }\r\n \r\n );\r\n};\r\n\r\nexport default RevenueCards;\r\n","export const abbreviatedMonths = [\r\n 'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'\r\n];\r\n\r\nexport const fullMonths = {\r\n Jan: 'January',\r\n Feb: 'February',\r\n Mar: 'March',\r\n Apr: 'April',\r\n May: 'May',\r\n Jun: 'June',\r\n Jul: 'July',\r\n Aug: 'August',\r\n Sep: 'September',\r\n Oct: 'October',\r\n Nov: 'November',\r\n Dec: 'December'\r\n};\r\n","export default function _getPrototypeOf(o) {\n _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) {\n return o.__proto__ || Object.getPrototypeOf(o);\n };\n return _getPrototypeOf(o);\n}","import getPrototypeOf from \"./getPrototypeOf.js\";\nexport default function _superPropBase(object, property) {\n while (!Object.prototype.hasOwnProperty.call(object, property)) {\n object = getPrototypeOf(object);\n if (object === null) break;\n }\n return object;\n}","import superPropBase from \"./superPropBase.js\";\nexport default function _get() {\n if (typeof Reflect !== \"undefined\" && Reflect.get) {\n _get = Reflect.get.bind();\n } else {\n _get = function _get(target, property, receiver) {\n var base = superPropBase(target, property);\n if (!base) return;\n var desc = Object.getOwnPropertyDescriptor(base, property);\n if (desc.get) {\n return desc.get.call(arguments.length < 3 ? target : receiver);\n }\n return desc.value;\n };\n }\n return _get.apply(this, arguments);\n}","import setPrototypeOf from \"./setPrototypeOf.js\";\nexport default function _inherits(subClass, superClass) {\n if (typeof superClass !== \"function\" && superClass !== null) {\n throw new TypeError(\"Super expression must either be null or a function\");\n }\n subClass.prototype = Object.create(superClass && superClass.prototype, {\n constructor: {\n value: subClass,\n writable: true,\n configurable: true\n }\n });\n Object.defineProperty(subClass, \"prototype\", {\n writable: false\n });\n if (superClass) setPrototypeOf(subClass, superClass);\n}","export default function _isNativeReflectConstruct() {\n try {\n var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));\n } catch (t) {}\n return (_isNativeReflectConstruct = function _isNativeReflectConstruct() {\n return !!t;\n })();\n}","import _typeof from \"./typeof.js\";\nimport assertThisInitialized from \"./assertThisInitialized.js\";\nexport default function _possibleConstructorReturn(self, call) {\n if (call && (_typeof(call) === \"object\" || typeof call === \"function\")) {\n return call;\n } else if (call !== void 0) {\n throw new TypeError(\"Derived constructors may only return object or undefined\");\n }\n return assertThisInitialized(self);\n}","import getPrototypeOf from \"./getPrototypeOf.js\";\nimport isNativeReflectConstruct from \"./isNativeReflectConstruct.js\";\nimport possibleConstructorReturn from \"./possibleConstructorReturn.js\";\nexport default function _createSuper(Derived) {\n var hasNativeReflectConstruct = isNativeReflectConstruct();\n return function _createSuperInternal() {\n var Super = getPrototypeOf(Derived),\n result;\n if (hasNativeReflectConstruct) {\n var NewTarget = getPrototypeOf(this).constructor;\n result = Reflect.construct(Super, arguments, NewTarget);\n } else {\n result = Super.apply(this, arguments);\n }\n return possibleConstructorReturn(this, result);\n };\n}","import unsupportedIterableToArray from \"./unsupportedIterableToArray.js\";\nexport default function _createForOfIteratorHelper(o, allowArrayLike) {\n var it = typeof Symbol !== \"undefined\" && o[Symbol.iterator] || o[\"@@iterator\"];\n if (!it) {\n if (Array.isArray(o) || (it = unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === \"number\") {\n if (it) o = it;\n var i = 0;\n var F = function F() {};\n return {\n s: F,\n n: function n() {\n if (i >= o.length) return {\n done: true\n };\n return {\n done: false,\n value: o[i++]\n };\n },\n e: function e(_e) {\n throw _e;\n },\n f: F\n };\n }\n throw new TypeError(\"Invalid attempt to iterate non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\");\n }\n var normalCompletion = true,\n didErr = false,\n err;\n return {\n s: function s() {\n it = it.call(o);\n },\n n: function n() {\n var step = it.next();\n normalCompletion = step.done;\n return step;\n },\n e: function e(_e2) {\n didErr = true;\n err = _e2;\n },\n f: function f() {\n try {\n if (!normalCompletion && it[\"return\"] != null) it[\"return\"]();\n } finally {\n if (didErr) throw err;\n }\n }\n };\n}","/*!\n * Chart.js v3.9.1\n * https://www.chartjs.org\n * (c) 2022 Chart.js Contributors\n * Released under the MIT License\n */\nfunction noop() {}\nconst uid = (function() {\n let id = 0;\n return function() {\n return id++;\n };\n}());\nfunction isNullOrUndef(value) {\n return value === null || typeof value === 'undefined';\n}\nfunction isArray(value) {\n if (Array.isArray && Array.isArray(value)) {\n return true;\n }\n const type = Object.prototype.toString.call(value);\n if (type.slice(0, 7) === '[object' && type.slice(-6) === 'Array]') {\n return true;\n }\n return false;\n}\nfunction isObject(value) {\n return value !== null && Object.prototype.toString.call(value) === '[object Object]';\n}\nconst isNumberFinite = (value) => (typeof value === 'number' || value instanceof Number) && isFinite(+value);\nfunction finiteOrDefault(value, defaultValue) {\n return isNumberFinite(value) ? value : defaultValue;\n}\nfunction valueOrDefault(value, defaultValue) {\n return typeof value === 'undefined' ? defaultValue : value;\n}\nconst toPercentage = (value, dimension) =>\n typeof value === 'string' && value.endsWith('%') ?\n parseFloat(value) / 100\n : value / dimension;\nconst toDimension = (value, dimension) =>\n typeof value === 'string' && value.endsWith('%') ?\n parseFloat(value) / 100 * dimension\n : +value;\nfunction callback(fn, args, thisArg) {\n if (fn && typeof fn.call === 'function') {\n return fn.apply(thisArg, args);\n }\n}\nfunction each(loopable, fn, thisArg, reverse) {\n let i, len, keys;\n if (isArray(loopable)) {\n len = loopable.length;\n if (reverse) {\n for (i = len - 1; i >= 0; i--) {\n fn.call(thisArg, loopable[i], i);\n }\n } else {\n for (i = 0; i < len; i++) {\n fn.call(thisArg, loopable[i], i);\n }\n }\n } else if (isObject(loopable)) {\n keys = Object.keys(loopable);\n len = keys.length;\n for (i = 0; i < len; i++) {\n fn.call(thisArg, loopable[keys[i]], keys[i]);\n }\n }\n}\nfunction _elementsEqual(a0, a1) {\n let i, ilen, v0, v1;\n if (!a0 || !a1 || a0.length !== a1.length) {\n return false;\n }\n for (i = 0, ilen = a0.length; i < ilen; ++i) {\n v0 = a0[i];\n v1 = a1[i];\n if (v0.datasetIndex !== v1.datasetIndex || v0.index !== v1.index) {\n return false;\n }\n }\n return true;\n}\nfunction clone$1(source) {\n if (isArray(source)) {\n return source.map(clone$1);\n }\n if (isObject(source)) {\n const target = Object.create(null);\n const keys = Object.keys(source);\n const klen = keys.length;\n let k = 0;\n for (; k < klen; ++k) {\n target[keys[k]] = clone$1(source[keys[k]]);\n }\n return target;\n }\n return source;\n}\nfunction isValidKey(key) {\n return ['__proto__', 'prototype', 'constructor'].indexOf(key) === -1;\n}\nfunction _merger(key, target, source, options) {\n if (!isValidKey(key)) {\n return;\n }\n const tval = target[key];\n const sval = source[key];\n if (isObject(tval) && isObject(sval)) {\n merge(tval, sval, options);\n } else {\n target[key] = clone$1(sval);\n }\n}\nfunction merge(target, source, options) {\n const sources = isArray(source) ? source : [source];\n const ilen = sources.length;\n if (!isObject(target)) {\n return target;\n }\n options = options || {};\n const merger = options.merger || _merger;\n for (let i = 0; i < ilen; ++i) {\n source = sources[i];\n if (!isObject(source)) {\n continue;\n }\n const keys = Object.keys(source);\n for (let k = 0, klen = keys.length; k < klen; ++k) {\n merger(keys[k], target, source, options);\n }\n }\n return target;\n}\nfunction mergeIf(target, source) {\n return merge(target, source, {merger: _mergerIf});\n}\nfunction _mergerIf(key, target, source) {\n if (!isValidKey(key)) {\n return;\n }\n const tval = target[key];\n const sval = source[key];\n if (isObject(tval) && isObject(sval)) {\n mergeIf(tval, sval);\n } else if (!Object.prototype.hasOwnProperty.call(target, key)) {\n target[key] = clone$1(sval);\n }\n}\nfunction _deprecated(scope, value, previous, current) {\n if (value !== undefined) {\n console.warn(scope + ': \"' + previous +\n\t\t\t'\" is deprecated. Please use \"' + current + '\" instead');\n }\n}\nconst keyResolvers = {\n '': v => v,\n x: o => o.x,\n y: o => o.y\n};\nfunction resolveObjectKey(obj, key) {\n const resolver = keyResolvers[key] || (keyResolvers[key] = _getKeyResolver(key));\n return resolver(obj);\n}\nfunction _getKeyResolver(key) {\n const keys = _splitKey(key);\n return obj => {\n for (const k of keys) {\n if (k === '') {\n break;\n }\n obj = obj && obj[k];\n }\n return obj;\n };\n}\nfunction _splitKey(key) {\n const parts = key.split('.');\n const keys = [];\n let tmp = '';\n for (const part of parts) {\n tmp += part;\n if (tmp.endsWith('\\\\')) {\n tmp = tmp.slice(0, -1) + '.';\n } else {\n keys.push(tmp);\n tmp = '';\n }\n }\n return keys;\n}\nfunction _capitalize(str) {\n return str.charAt(0).toUpperCase() + str.slice(1);\n}\nconst defined = (value) => typeof value !== 'undefined';\nconst isFunction = (value) => typeof value === 'function';\nconst setsEqual = (a, b) => {\n if (a.size !== b.size) {\n return false;\n }\n for (const item of a) {\n if (!b.has(item)) {\n return false;\n }\n }\n return true;\n};\nfunction _isClickEvent(e) {\n return e.type === 'mouseup' || e.type === 'click' || e.type === 'contextmenu';\n}\n\nconst PI = Math.PI;\nconst TAU = 2 * PI;\nconst PITAU = TAU + PI;\nconst INFINITY = Number.POSITIVE_INFINITY;\nconst RAD_PER_DEG = PI / 180;\nconst HALF_PI = PI / 2;\nconst QUARTER_PI = PI / 4;\nconst TWO_THIRDS_PI = PI * 2 / 3;\nconst log10 = Math.log10;\nconst sign = Math.sign;\nfunction niceNum(range) {\n const roundedRange = Math.round(range);\n range = almostEquals(range, roundedRange, range / 1000) ? roundedRange : range;\n const niceRange = Math.pow(10, Math.floor(log10(range)));\n const fraction = range / niceRange;\n const niceFraction = fraction <= 1 ? 1 : fraction <= 2 ? 2 : fraction <= 5 ? 5 : 10;\n return niceFraction * niceRange;\n}\nfunction _factorize(value) {\n const result = [];\n const sqrt = Math.sqrt(value);\n let i;\n for (i = 1; i < sqrt; i++) {\n if (value % i === 0) {\n result.push(i);\n result.push(value / i);\n }\n }\n if (sqrt === (sqrt | 0)) {\n result.push(sqrt);\n }\n result.sort((a, b) => a - b).pop();\n return result;\n}\nfunction isNumber(n) {\n return !isNaN(parseFloat(n)) && isFinite(n);\n}\nfunction almostEquals(x, y, epsilon) {\n return Math.abs(x - y) < epsilon;\n}\nfunction almostWhole(x, epsilon) {\n const rounded = Math.round(x);\n return ((rounded - epsilon) <= x) && ((rounded + epsilon) >= x);\n}\nfunction _setMinAndMaxByKey(array, target, property) {\n let i, ilen, value;\n for (i = 0, ilen = array.length; i < ilen; i++) {\n value = array[i][property];\n if (!isNaN(value)) {\n target.min = Math.min(target.min, value);\n target.max = Math.max(target.max, value);\n }\n }\n}\nfunction toRadians(degrees) {\n return degrees * (PI / 180);\n}\nfunction toDegrees(radians) {\n return radians * (180 / PI);\n}\nfunction _decimalPlaces(x) {\n if (!isNumberFinite(x)) {\n return;\n }\n let e = 1;\n let p = 0;\n while (Math.round(x * e) / e !== x) {\n e *= 10;\n p++;\n }\n return p;\n}\nfunction getAngleFromPoint(centrePoint, anglePoint) {\n const distanceFromXCenter = anglePoint.x - centrePoint.x;\n const distanceFromYCenter = anglePoint.y - centrePoint.y;\n const radialDistanceFromCenter = Math.sqrt(distanceFromXCenter * distanceFromXCenter + distanceFromYCenter * distanceFromYCenter);\n let angle = Math.atan2(distanceFromYCenter, distanceFromXCenter);\n if (angle < (-0.5 * PI)) {\n angle += TAU;\n }\n return {\n angle,\n distance: radialDistanceFromCenter\n };\n}\nfunction distanceBetweenPoints(pt1, pt2) {\n return Math.sqrt(Math.pow(pt2.x - pt1.x, 2) + Math.pow(pt2.y - pt1.y, 2));\n}\nfunction _angleDiff(a, b) {\n return (a - b + PITAU) % TAU - PI;\n}\nfunction _normalizeAngle(a) {\n return (a % TAU + TAU) % TAU;\n}\nfunction _angleBetween(angle, start, end, sameAngleIsFullCircle) {\n const a = _normalizeAngle(angle);\n const s = _normalizeAngle(start);\n const e = _normalizeAngle(end);\n const angleToStart = _normalizeAngle(s - a);\n const angleToEnd = _normalizeAngle(e - a);\n const startToAngle = _normalizeAngle(a - s);\n const endToAngle = _normalizeAngle(a - e);\n return a === s || a === e || (sameAngleIsFullCircle && s === e)\n || (angleToStart > angleToEnd && startToAngle < endToAngle);\n}\nfunction _limitValue(value, min, max) {\n return Math.max(min, Math.min(max, value));\n}\nfunction _int16Range(value) {\n return _limitValue(value, -32768, 32767);\n}\nfunction _isBetween(value, start, end, epsilon = 1e-6) {\n return value >= Math.min(start, end) - epsilon && value <= Math.max(start, end) + epsilon;\n}\n\nfunction _lookup(table, value, cmp) {\n cmp = cmp || ((index) => table[index] < value);\n let hi = table.length - 1;\n let lo = 0;\n let mid;\n while (hi - lo > 1) {\n mid = (lo + hi) >> 1;\n if (cmp(mid)) {\n lo = mid;\n } else {\n hi = mid;\n }\n }\n return {lo, hi};\n}\nconst _lookupByKey = (table, key, value, last) =>\n _lookup(table, value, last\n ? index => table[index][key] <= value\n : index => table[index][key] < value);\nconst _rlookupByKey = (table, key, value) =>\n _lookup(table, value, index => table[index][key] >= value);\nfunction _filterBetween(values, min, max) {\n let start = 0;\n let end = values.length;\n while (start < end && values[start] < min) {\n start++;\n }\n while (end > start && values[end - 1] > max) {\n end--;\n }\n return start > 0 || end < values.length\n ? values.slice(start, end)\n : values;\n}\nconst arrayEvents = ['push', 'pop', 'shift', 'splice', 'unshift'];\nfunction listenArrayEvents(array, listener) {\n if (array._chartjs) {\n array._chartjs.listeners.push(listener);\n return;\n }\n Object.defineProperty(array, '_chartjs', {\n configurable: true,\n enumerable: false,\n value: {\n listeners: [listener]\n }\n });\n arrayEvents.forEach((key) => {\n const method = '_onData' + _capitalize(key);\n const base = array[key];\n Object.defineProperty(array, key, {\n configurable: true,\n enumerable: false,\n value(...args) {\n const res = base.apply(this, args);\n array._chartjs.listeners.forEach((object) => {\n if (typeof object[method] === 'function') {\n object[method](...args);\n }\n });\n return res;\n }\n });\n });\n}\nfunction unlistenArrayEvents(array, listener) {\n const stub = array._chartjs;\n if (!stub) {\n return;\n }\n const listeners = stub.listeners;\n const index = listeners.indexOf(listener);\n if (index !== -1) {\n listeners.splice(index, 1);\n }\n if (listeners.length > 0) {\n return;\n }\n arrayEvents.forEach((key) => {\n delete array[key];\n });\n delete array._chartjs;\n}\nfunction _arrayUnique(items) {\n const set = new Set();\n let i, ilen;\n for (i = 0, ilen = items.length; i < ilen; ++i) {\n set.add(items[i]);\n }\n if (set.size === ilen) {\n return items;\n }\n return Array.from(set);\n}\n\nfunction fontString(pixelSize, fontStyle, fontFamily) {\n return fontStyle + ' ' + pixelSize + 'px ' + fontFamily;\n}\nconst requestAnimFrame = (function() {\n if (typeof window === 'undefined') {\n return function(callback) {\n return callback();\n };\n }\n return window.requestAnimationFrame;\n}());\nfunction throttled(fn, thisArg, updateFn) {\n const updateArgs = updateFn || ((args) => Array.prototype.slice.call(args));\n let ticking = false;\n let args = [];\n return function(...rest) {\n args = updateArgs(rest);\n if (!ticking) {\n ticking = true;\n requestAnimFrame.call(window, () => {\n ticking = false;\n fn.apply(thisArg, args);\n });\n }\n };\n}\nfunction debounce(fn, delay) {\n let timeout;\n return function(...args) {\n if (delay) {\n clearTimeout(timeout);\n timeout = setTimeout(fn, delay, args);\n } else {\n fn.apply(this, args);\n }\n return delay;\n };\n}\nconst _toLeftRightCenter = (align) => align === 'start' ? 'left' : align === 'end' ? 'right' : 'center';\nconst _alignStartEnd = (align, start, end) => align === 'start' ? start : align === 'end' ? end : (start + end) / 2;\nconst _textX = (align, left, right, rtl) => {\n const check = rtl ? 'left' : 'right';\n return align === check ? right : align === 'center' ? (left + right) / 2 : left;\n};\nfunction _getStartAndCountOfVisiblePoints(meta, points, animationsDisabled) {\n const pointCount = points.length;\n let start = 0;\n let count = pointCount;\n if (meta._sorted) {\n const {iScale, _parsed} = meta;\n const axis = iScale.axis;\n const {min, max, minDefined, maxDefined} = iScale.getUserBounds();\n if (minDefined) {\n start = _limitValue(Math.min(\n _lookupByKey(_parsed, iScale.axis, min).lo,\n animationsDisabled ? pointCount : _lookupByKey(points, axis, iScale.getPixelForValue(min)).lo),\n 0, pointCount - 1);\n }\n if (maxDefined) {\n count = _limitValue(Math.max(\n _lookupByKey(_parsed, iScale.axis, max, true).hi + 1,\n animationsDisabled ? 0 : _lookupByKey(points, axis, iScale.getPixelForValue(max), true).hi + 1),\n start, pointCount) - start;\n } else {\n count = pointCount - start;\n }\n }\n return {start, count};\n}\nfunction _scaleRangesChanged(meta) {\n const {xScale, yScale, _scaleRanges} = meta;\n const newRanges = {\n xmin: xScale.min,\n xmax: xScale.max,\n ymin: yScale.min,\n ymax: yScale.max\n };\n if (!_scaleRanges) {\n meta._scaleRanges = newRanges;\n return true;\n }\n const changed = _scaleRanges.xmin !== xScale.min\n\t\t|| _scaleRanges.xmax !== xScale.max\n\t\t|| _scaleRanges.ymin !== yScale.min\n\t\t|| _scaleRanges.ymax !== yScale.max;\n Object.assign(_scaleRanges, newRanges);\n return changed;\n}\n\nconst atEdge = (t) => t === 0 || t === 1;\nconst elasticIn = (t, s, p) => -(Math.pow(2, 10 * (t -= 1)) * Math.sin((t - s) * TAU / p));\nconst elasticOut = (t, s, p) => Math.pow(2, -10 * t) * Math.sin((t - s) * TAU / p) + 1;\nconst effects = {\n linear: t => t,\n easeInQuad: t => t * t,\n easeOutQuad: t => -t * (t - 2),\n easeInOutQuad: t => ((t /= 0.5) < 1)\n ? 0.5 * t * t\n : -0.5 * ((--t) * (t - 2) - 1),\n easeInCubic: t => t * t * t,\n easeOutCubic: t => (t -= 1) * t * t + 1,\n easeInOutCubic: t => ((t /= 0.5) < 1)\n ? 0.5 * t * t * t\n : 0.5 * ((t -= 2) * t * t + 2),\n easeInQuart: t => t * t * t * t,\n easeOutQuart: t => -((t -= 1) * t * t * t - 1),\n easeInOutQuart: t => ((t /= 0.5) < 1)\n ? 0.5 * t * t * t * t\n : -0.5 * ((t -= 2) * t * t * t - 2),\n easeInQuint: t => t * t * t * t * t,\n easeOutQuint: t => (t -= 1) * t * t * t * t + 1,\n easeInOutQuint: t => ((t /= 0.5) < 1)\n ? 0.5 * t * t * t * t * t\n : 0.5 * ((t -= 2) * t * t * t * t + 2),\n easeInSine: t => -Math.cos(t * HALF_PI) + 1,\n easeOutSine: t => Math.sin(t * HALF_PI),\n easeInOutSine: t => -0.5 * (Math.cos(PI * t) - 1),\n easeInExpo: t => (t === 0) ? 0 : Math.pow(2, 10 * (t - 1)),\n easeOutExpo: t => (t === 1) ? 1 : -Math.pow(2, -10 * t) + 1,\n easeInOutExpo: t => atEdge(t) ? t : t < 0.5\n ? 0.5 * Math.pow(2, 10 * (t * 2 - 1))\n : 0.5 * (-Math.pow(2, -10 * (t * 2 - 1)) + 2),\n easeInCirc: t => (t >= 1) ? t : -(Math.sqrt(1 - t * t) - 1),\n easeOutCirc: t => Math.sqrt(1 - (t -= 1) * t),\n easeInOutCirc: t => ((t /= 0.5) < 1)\n ? -0.5 * (Math.sqrt(1 - t * t) - 1)\n : 0.5 * (Math.sqrt(1 - (t -= 2) * t) + 1),\n easeInElastic: t => atEdge(t) ? t : elasticIn(t, 0.075, 0.3),\n easeOutElastic: t => atEdge(t) ? t : elasticOut(t, 0.075, 0.3),\n easeInOutElastic(t) {\n const s = 0.1125;\n const p = 0.45;\n return atEdge(t) ? t :\n t < 0.5\n ? 0.5 * elasticIn(t * 2, s, p)\n : 0.5 + 0.5 * elasticOut(t * 2 - 1, s, p);\n },\n easeInBack(t) {\n const s = 1.70158;\n return t * t * ((s + 1) * t - s);\n },\n easeOutBack(t) {\n const s = 1.70158;\n return (t -= 1) * t * ((s + 1) * t + s) + 1;\n },\n easeInOutBack(t) {\n let s = 1.70158;\n if ((t /= 0.5) < 1) {\n return 0.5 * (t * t * (((s *= (1.525)) + 1) * t - s));\n }\n return 0.5 * ((t -= 2) * t * (((s *= (1.525)) + 1) * t + s) + 2);\n },\n easeInBounce: t => 1 - effects.easeOutBounce(1 - t),\n easeOutBounce(t) {\n const m = 7.5625;\n const d = 2.75;\n if (t < (1 / d)) {\n return m * t * t;\n }\n if (t < (2 / d)) {\n return m * (t -= (1.5 / d)) * t + 0.75;\n }\n if (t < (2.5 / d)) {\n return m * (t -= (2.25 / d)) * t + 0.9375;\n }\n return m * (t -= (2.625 / d)) * t + 0.984375;\n },\n easeInOutBounce: t => (t < 0.5)\n ? effects.easeInBounce(t * 2) * 0.5\n : effects.easeOutBounce(t * 2 - 1) * 0.5 + 0.5,\n};\n\n/*!\n * @kurkle/color v0.2.1\n * https://github.com/kurkle/color#readme\n * (c) 2022 Jukka Kurkela\n * Released under the MIT License\n */\nfunction round(v) {\n return v + 0.5 | 0;\n}\nconst lim = (v, l, h) => Math.max(Math.min(v, h), l);\nfunction p2b(v) {\n return lim(round(v * 2.55), 0, 255);\n}\nfunction n2b(v) {\n return lim(round(v * 255), 0, 255);\n}\nfunction b2n(v) {\n return lim(round(v / 2.55) / 100, 0, 1);\n}\nfunction n2p(v) {\n return lim(round(v * 100), 0, 100);\n}\nconst map$1 = {0: 0, 1: 1, 2: 2, 3: 3, 4: 4, 5: 5, 6: 6, 7: 7, 8: 8, 9: 9, A: 10, B: 11, C: 12, D: 13, E: 14, F: 15, a: 10, b: 11, c: 12, d: 13, e: 14, f: 15};\nconst hex = [...'0123456789ABCDEF'];\nconst h1 = b => hex[b & 0xF];\nconst h2 = b => hex[(b & 0xF0) >> 4] + hex[b & 0xF];\nconst eq = b => ((b & 0xF0) >> 4) === (b & 0xF);\nconst isShort = v => eq(v.r) && eq(v.g) && eq(v.b) && eq(v.a);\nfunction hexParse(str) {\n var len = str.length;\n var ret;\n if (str[0] === '#') {\n if (len === 4 || len === 5) {\n ret = {\n r: 255 & map$1[str[1]] * 17,\n g: 255 & map$1[str[2]] * 17,\n b: 255 & map$1[str[3]] * 17,\n a: len === 5 ? map$1[str[4]] * 17 : 255\n };\n } else if (len === 7 || len === 9) {\n ret = {\n r: map$1[str[1]] << 4 | map$1[str[2]],\n g: map$1[str[3]] << 4 | map$1[str[4]],\n b: map$1[str[5]] << 4 | map$1[str[6]],\n a: len === 9 ? (map$1[str[7]] << 4 | map$1[str[8]]) : 255\n };\n }\n }\n return ret;\n}\nconst alpha = (a, f) => a < 255 ? f(a) : '';\nfunction hexString(v) {\n var f = isShort(v) ? h1 : h2;\n return v\n ? '#' + f(v.r) + f(v.g) + f(v.b) + alpha(v.a, f)\n : undefined;\n}\nconst HUE_RE = /^(hsla?|hwb|hsv)\\(\\s*([-+.e\\d]+)(?:deg)?[\\s,]+([-+.e\\d]+)%[\\s,]+([-+.e\\d]+)%(?:[\\s,]+([-+.e\\d]+)(%)?)?\\s*\\)$/;\nfunction hsl2rgbn(h, s, l) {\n const a = s * Math.min(l, 1 - l);\n const f = (n, k = (n + h / 30) % 12) => l - a * Math.max(Math.min(k - 3, 9 - k, 1), -1);\n return [f(0), f(8), f(4)];\n}\nfunction hsv2rgbn(h, s, v) {\n const f = (n, k = (n + h / 60) % 6) => v - v * s * Math.max(Math.min(k, 4 - k, 1), 0);\n return [f(5), f(3), f(1)];\n}\nfunction hwb2rgbn(h, w, b) {\n const rgb = hsl2rgbn(h, 1, 0.5);\n let i;\n if (w + b > 1) {\n i = 1 / (w + b);\n w *= i;\n b *= i;\n }\n for (i = 0; i < 3; i++) {\n rgb[i] *= 1 - w - b;\n rgb[i] += w;\n }\n return rgb;\n}\nfunction hueValue(r, g, b, d, max) {\n if (r === max) {\n return ((g - b) / d) + (g < b ? 6 : 0);\n }\n if (g === max) {\n return (b - r) / d + 2;\n }\n return (r - g) / d + 4;\n}\nfunction rgb2hsl(v) {\n const range = 255;\n const r = v.r / range;\n const g = v.g / range;\n const b = v.b / range;\n const max = Math.max(r, g, b);\n const min = Math.min(r, g, b);\n const l = (max + min) / 2;\n let h, s, d;\n if (max !== min) {\n d = max - min;\n s = l > 0.5 ? d / (2 - max - min) : d / (max + min);\n h = hueValue(r, g, b, d, max);\n h = h * 60 + 0.5;\n }\n return [h | 0, s || 0, l];\n}\nfunction calln(f, a, b, c) {\n return (\n Array.isArray(a)\n ? f(a[0], a[1], a[2])\n : f(a, b, c)\n ).map(n2b);\n}\nfunction hsl2rgb(h, s, l) {\n return calln(hsl2rgbn, h, s, l);\n}\nfunction hwb2rgb(h, w, b) {\n return calln(hwb2rgbn, h, w, b);\n}\nfunction hsv2rgb(h, s, v) {\n return calln(hsv2rgbn, h, s, v);\n}\nfunction hue(h) {\n return (h % 360 + 360) % 360;\n}\nfunction hueParse(str) {\n const m = HUE_RE.exec(str);\n let a = 255;\n let v;\n if (!m) {\n return;\n }\n if (m[5] !== v) {\n a = m[6] ? p2b(+m[5]) : n2b(+m[5]);\n }\n const h = hue(+m[2]);\n const p1 = +m[3] / 100;\n const p2 = +m[4] / 100;\n if (m[1] === 'hwb') {\n v = hwb2rgb(h, p1, p2);\n } else if (m[1] === 'hsv') {\n v = hsv2rgb(h, p1, p2);\n } else {\n v = hsl2rgb(h, p1, p2);\n }\n return {\n r: v[0],\n g: v[1],\n b: v[2],\n a: a\n };\n}\nfunction rotate(v, deg) {\n var h = rgb2hsl(v);\n h[0] = hue(h[0] + deg);\n h = hsl2rgb(h);\n v.r = h[0];\n v.g = h[1];\n v.b = h[2];\n}\nfunction hslString(v) {\n if (!v) {\n return;\n }\n const a = rgb2hsl(v);\n const h = a[0];\n const s = n2p(a[1]);\n const l = n2p(a[2]);\n return v.a < 255\n ? `hsla(${h}, ${s}%, ${l}%, ${b2n(v.a)})`\n : `hsl(${h}, ${s}%, ${l}%)`;\n}\nconst map = {\n x: 'dark',\n Z: 'light',\n Y: 're',\n X: 'blu',\n W: 'gr',\n V: 'medium',\n U: 'slate',\n A: 'ee',\n T: 'ol',\n S: 'or',\n B: 'ra',\n C: 'lateg',\n D: 'ights',\n R: 'in',\n Q: 'turquois',\n E: 'hi',\n P: 'ro',\n O: 'al',\n N: 'le',\n M: 'de',\n L: 'yello',\n F: 'en',\n K: 'ch',\n G: 'arks',\n H: 'ea',\n I: 'ightg',\n J: 'wh'\n};\nconst names$1 = {\n OiceXe: 'f0f8ff',\n antiquewEte: 'faebd7',\n aqua: 'ffff',\n aquamarRe: '7fffd4',\n azuY: 'f0ffff',\n beige: 'f5f5dc',\n bisque: 'ffe4c4',\n black: '0',\n blanKedOmond: 'ffebcd',\n Xe: 'ff',\n XeviTet: '8a2be2',\n bPwn: 'a52a2a',\n burlywood: 'deb887',\n caMtXe: '5f9ea0',\n KartYuse: '7fff00',\n KocTate: 'd2691e',\n cSO: 'ff7f50',\n cSnflowerXe: '6495ed',\n cSnsilk: 'fff8dc',\n crimson: 'dc143c',\n cyan: 'ffff',\n xXe: '8b',\n xcyan: '8b8b',\n xgTMnPd: 'b8860b',\n xWay: 'a9a9a9',\n xgYF: '6400',\n xgYy: 'a9a9a9',\n xkhaki: 'bdb76b',\n xmagFta: '8b008b',\n xTivegYF: '556b2f',\n xSange: 'ff8c00',\n xScEd: '9932cc',\n xYd: '8b0000',\n xsOmon: 'e9967a',\n xsHgYF: '8fbc8f',\n xUXe: '483d8b',\n xUWay: '2f4f4f',\n xUgYy: '2f4f4f',\n xQe: 'ced1',\n xviTet: '9400d3',\n dAppRk: 'ff1493',\n dApskyXe: 'bfff',\n dimWay: '696969',\n dimgYy: '696969',\n dodgerXe: '1e90ff',\n fiYbrick: 'b22222',\n flSOwEte: 'fffaf0',\n foYstWAn: '228b22',\n fuKsia: 'ff00ff',\n gaRsbSo: 'dcdcdc',\n ghostwEte: 'f8f8ff',\n gTd: 'ffd700',\n gTMnPd: 'daa520',\n Way: '808080',\n gYF: '8000',\n gYFLw: 'adff2f',\n gYy: '808080',\n honeyMw: 'f0fff0',\n hotpRk: 'ff69b4',\n RdianYd: 'cd5c5c',\n Rdigo: '4b0082',\n ivSy: 'fffff0',\n khaki: 'f0e68c',\n lavFMr: 'e6e6fa',\n lavFMrXsh: 'fff0f5',\n lawngYF: '7cfc00',\n NmoncEffon: 'fffacd',\n ZXe: 'add8e6',\n ZcSO: 'f08080',\n Zcyan: 'e0ffff',\n ZgTMnPdLw: 'fafad2',\n ZWay: 'd3d3d3',\n ZgYF: '90ee90',\n ZgYy: 'd3d3d3',\n ZpRk: 'ffb6c1',\n ZsOmon: 'ffa07a',\n ZsHgYF: '20b2aa',\n ZskyXe: '87cefa',\n ZUWay: '778899',\n ZUgYy: '778899',\n ZstAlXe: 'b0c4de',\n ZLw: 'ffffe0',\n lime: 'ff00',\n limegYF: '32cd32',\n lRF: 'faf0e6',\n magFta: 'ff00ff',\n maPon: '800000',\n VaquamarRe: '66cdaa',\n VXe: 'cd',\n VScEd: 'ba55d3',\n VpurpN: '9370db',\n VsHgYF: '3cb371',\n VUXe: '7b68ee',\n VsprRggYF: 'fa9a',\n VQe: '48d1cc',\n VviTetYd: 'c71585',\n midnightXe: '191970',\n mRtcYam: 'f5fffa',\n mistyPse: 'ffe4e1',\n moccasR: 'ffe4b5',\n navajowEte: 'ffdead',\n navy: '80',\n Tdlace: 'fdf5e6',\n Tive: '808000',\n TivedBb: '6b8e23',\n Sange: 'ffa500',\n SangeYd: 'ff4500',\n ScEd: 'da70d6',\n pOegTMnPd: 'eee8aa',\n pOegYF: '98fb98',\n pOeQe: 'afeeee',\n pOeviTetYd: 'db7093',\n papayawEp: 'ffefd5',\n pHKpuff: 'ffdab9',\n peru: 'cd853f',\n pRk: 'ffc0cb',\n plum: 'dda0dd',\n powMrXe: 'b0e0e6',\n purpN: '800080',\n YbeccapurpN: '663399',\n Yd: 'ff0000',\n Psybrown: 'bc8f8f',\n PyOXe: '4169e1',\n saddNbPwn: '8b4513',\n sOmon: 'fa8072',\n sandybPwn: 'f4a460',\n sHgYF: '2e8b57',\n sHshell: 'fff5ee',\n siFna: 'a0522d',\n silver: 'c0c0c0',\n skyXe: '87ceeb',\n UXe: '6a5acd',\n UWay: '708090',\n UgYy: '708090',\n snow: 'fffafa',\n sprRggYF: 'ff7f',\n stAlXe: '4682b4',\n tan: 'd2b48c',\n teO: '8080',\n tEstN: 'd8bfd8',\n tomato: 'ff6347',\n Qe: '40e0d0',\n viTet: 'ee82ee',\n JHt: 'f5deb3',\n wEte: 'ffffff',\n wEtesmoke: 'f5f5f5',\n Lw: 'ffff00',\n LwgYF: '9acd32'\n};\nfunction unpack() {\n const unpacked = {};\n const keys = Object.keys(names$1);\n const tkeys = Object.keys(map);\n let i, j, k, ok, nk;\n for (i = 0; i < keys.length; i++) {\n ok = nk = keys[i];\n for (j = 0; j < tkeys.length; j++) {\n k = tkeys[j];\n nk = nk.replace(k, map[k]);\n }\n k = parseInt(names$1[ok], 16);\n unpacked[nk] = [k >> 16 & 0xFF, k >> 8 & 0xFF, k & 0xFF];\n }\n return unpacked;\n}\nlet names;\nfunction nameParse(str) {\n if (!names) {\n names = unpack();\n names.transparent = [0, 0, 0, 0];\n }\n const a = names[str.toLowerCase()];\n return a && {\n r: a[0],\n g: a[1],\n b: a[2],\n a: a.length === 4 ? a[3] : 255\n };\n}\nconst RGB_RE = /^rgba?\\(\\s*([-+.\\d]+)(%)?[\\s,]+([-+.e\\d]+)(%)?[\\s,]+([-+.e\\d]+)(%)?(?:[\\s,/]+([-+.e\\d]+)(%)?)?\\s*\\)$/;\nfunction rgbParse(str) {\n const m = RGB_RE.exec(str);\n let a = 255;\n let r, g, b;\n if (!m) {\n return;\n }\n if (m[7] !== r) {\n const v = +m[7];\n a = m[8] ? p2b(v) : lim(v * 255, 0, 255);\n }\n r = +m[1];\n g = +m[3];\n b = +m[5];\n r = 255 & (m[2] ? p2b(r) : lim(r, 0, 255));\n g = 255 & (m[4] ? p2b(g) : lim(g, 0, 255));\n b = 255 & (m[6] ? p2b(b) : lim(b, 0, 255));\n return {\n r: r,\n g: g,\n b: b,\n a: a\n };\n}\nfunction rgbString(v) {\n return v && (\n v.a < 255\n ? `rgba(${v.r}, ${v.g}, ${v.b}, ${b2n(v.a)})`\n : `rgb(${v.r}, ${v.g}, ${v.b})`\n );\n}\nconst to = v => v <= 0.0031308 ? v * 12.92 : Math.pow(v, 1.0 / 2.4) * 1.055 - 0.055;\nconst from = v => v <= 0.04045 ? v / 12.92 : Math.pow((v + 0.055) / 1.055, 2.4);\nfunction interpolate(rgb1, rgb2, t) {\n const r = from(b2n(rgb1.r));\n const g = from(b2n(rgb1.g));\n const b = from(b2n(rgb1.b));\n return {\n r: n2b(to(r + t * (from(b2n(rgb2.r)) - r))),\n g: n2b(to(g + t * (from(b2n(rgb2.g)) - g))),\n b: n2b(to(b + t * (from(b2n(rgb2.b)) - b))),\n a: rgb1.a + t * (rgb2.a - rgb1.a)\n };\n}\nfunction modHSL(v, i, ratio) {\n if (v) {\n let tmp = rgb2hsl(v);\n tmp[i] = Math.max(0, Math.min(tmp[i] + tmp[i] * ratio, i === 0 ? 360 : 1));\n tmp = hsl2rgb(tmp);\n v.r = tmp[0];\n v.g = tmp[1];\n v.b = tmp[2];\n }\n}\nfunction clone(v, proto) {\n return v ? Object.assign(proto || {}, v) : v;\n}\nfunction fromObject(input) {\n var v = {r: 0, g: 0, b: 0, a: 255};\n if (Array.isArray(input)) {\n if (input.length >= 3) {\n v = {r: input[0], g: input[1], b: input[2], a: 255};\n if (input.length > 3) {\n v.a = n2b(input[3]);\n }\n }\n } else {\n v = clone(input, {r: 0, g: 0, b: 0, a: 1});\n v.a = n2b(v.a);\n }\n return v;\n}\nfunction functionParse(str) {\n if (str.charAt(0) === 'r') {\n return rgbParse(str);\n }\n return hueParse(str);\n}\nclass Color {\n constructor(input) {\n if (input instanceof Color) {\n return input;\n }\n const type = typeof input;\n let v;\n if (type === 'object') {\n v = fromObject(input);\n } else if (type === 'string') {\n v = hexParse(input) || nameParse(input) || functionParse(input);\n }\n this._rgb = v;\n this._valid = !!v;\n }\n get valid() {\n return this._valid;\n }\n get rgb() {\n var v = clone(this._rgb);\n if (v) {\n v.a = b2n(v.a);\n }\n return v;\n }\n set rgb(obj) {\n this._rgb = fromObject(obj);\n }\n rgbString() {\n return this._valid ? rgbString(this._rgb) : undefined;\n }\n hexString() {\n return this._valid ? hexString(this._rgb) : undefined;\n }\n hslString() {\n return this._valid ? hslString(this._rgb) : undefined;\n }\n mix(color, weight) {\n if (color) {\n const c1 = this.rgb;\n const c2 = color.rgb;\n let w2;\n const p = weight === w2 ? 0.5 : weight;\n const w = 2 * p - 1;\n const a = c1.a - c2.a;\n const w1 = ((w * a === -1 ? w : (w + a) / (1 + w * a)) + 1) / 2.0;\n w2 = 1 - w1;\n c1.r = 0xFF & w1 * c1.r + w2 * c2.r + 0.5;\n c1.g = 0xFF & w1 * c1.g + w2 * c2.g + 0.5;\n c1.b = 0xFF & w1 * c1.b + w2 * c2.b + 0.5;\n c1.a = p * c1.a + (1 - p) * c2.a;\n this.rgb = c1;\n }\n return this;\n }\n interpolate(color, t) {\n if (color) {\n this._rgb = interpolate(this._rgb, color._rgb, t);\n }\n return this;\n }\n clone() {\n return new Color(this.rgb);\n }\n alpha(a) {\n this._rgb.a = n2b(a);\n return this;\n }\n clearer(ratio) {\n const rgb = this._rgb;\n rgb.a *= 1 - ratio;\n return this;\n }\n greyscale() {\n const rgb = this._rgb;\n const val = round(rgb.r * 0.3 + rgb.g * 0.59 + rgb.b * 0.11);\n rgb.r = rgb.g = rgb.b = val;\n return this;\n }\n opaquer(ratio) {\n const rgb = this._rgb;\n rgb.a *= 1 + ratio;\n return this;\n }\n negate() {\n const v = this._rgb;\n v.r = 255 - v.r;\n v.g = 255 - v.g;\n v.b = 255 - v.b;\n return this;\n }\n lighten(ratio) {\n modHSL(this._rgb, 2, ratio);\n return this;\n }\n darken(ratio) {\n modHSL(this._rgb, 2, -ratio);\n return this;\n }\n saturate(ratio) {\n modHSL(this._rgb, 1, ratio);\n return this;\n }\n desaturate(ratio) {\n modHSL(this._rgb, 1, -ratio);\n return this;\n }\n rotate(deg) {\n rotate(this._rgb, deg);\n return this;\n }\n}\nfunction index_esm(input) {\n return new Color(input);\n}\n\nfunction isPatternOrGradient(value) {\n if (value && typeof value === 'object') {\n const type = value.toString();\n return type === '[object CanvasPattern]' || type === '[object CanvasGradient]';\n }\n return false;\n}\nfunction color(value) {\n return isPatternOrGradient(value) ? value : index_esm(value);\n}\nfunction getHoverColor(value) {\n return isPatternOrGradient(value)\n ? value\n : index_esm(value).saturate(0.5).darken(0.1).hexString();\n}\n\nconst overrides = Object.create(null);\nconst descriptors = Object.create(null);\nfunction getScope$1(node, key) {\n if (!key) {\n return node;\n }\n const keys = key.split('.');\n for (let i = 0, n = keys.length; i < n; ++i) {\n const k = keys[i];\n node = node[k] || (node[k] = Object.create(null));\n }\n return node;\n}\nfunction set(root, scope, values) {\n if (typeof scope === 'string') {\n return merge(getScope$1(root, scope), values);\n }\n return merge(getScope$1(root, ''), scope);\n}\nclass Defaults {\n constructor(_descriptors) {\n this.animation = undefined;\n this.backgroundColor = 'rgba(0,0,0,0.1)';\n this.borderColor = 'rgba(0,0,0,0.1)';\n this.color = '#666';\n this.datasets = {};\n this.devicePixelRatio = (context) => context.chart.platform.getDevicePixelRatio();\n this.elements = {};\n this.events = [\n 'mousemove',\n 'mouseout',\n 'click',\n 'touchstart',\n 'touchmove'\n ];\n this.font = {\n family: \"'Helvetica Neue', 'Helvetica', 'Arial', sans-serif\",\n size: 12,\n style: 'normal',\n lineHeight: 1.2,\n weight: null\n };\n this.hover = {};\n this.hoverBackgroundColor = (ctx, options) => getHoverColor(options.backgroundColor);\n this.hoverBorderColor = (ctx, options) => getHoverColor(options.borderColor);\n this.hoverColor = (ctx, options) => getHoverColor(options.color);\n this.indexAxis = 'x';\n this.interaction = {\n mode: 'nearest',\n intersect: true,\n includeInvisible: false\n };\n this.maintainAspectRatio = true;\n this.onHover = null;\n this.onClick = null;\n this.parsing = true;\n this.plugins = {};\n this.responsive = true;\n this.scale = undefined;\n this.scales = {};\n this.showLine = true;\n this.drawActiveElementsOnTop = true;\n this.describe(_descriptors);\n }\n set(scope, values) {\n return set(this, scope, values);\n }\n get(scope) {\n return getScope$1(this, scope);\n }\n describe(scope, values) {\n return set(descriptors, scope, values);\n }\n override(scope, values) {\n return set(overrides, scope, values);\n }\n route(scope, name, targetScope, targetName) {\n const scopeObject = getScope$1(this, scope);\n const targetScopeObject = getScope$1(this, targetScope);\n const privateName = '_' + name;\n Object.defineProperties(scopeObject, {\n [privateName]: {\n value: scopeObject[name],\n writable: true\n },\n [name]: {\n enumerable: true,\n get() {\n const local = this[privateName];\n const target = targetScopeObject[targetName];\n if (isObject(local)) {\n return Object.assign({}, target, local);\n }\n return valueOrDefault(local, target);\n },\n set(value) {\n this[privateName] = value;\n }\n }\n });\n }\n}\nvar defaults = new Defaults({\n _scriptable: (name) => !name.startsWith('on'),\n _indexable: (name) => name !== 'events',\n hover: {\n _fallback: 'interaction'\n },\n interaction: {\n _scriptable: false,\n _indexable: false,\n }\n});\n\nfunction toFontString(font) {\n if (!font || isNullOrUndef(font.size) || isNullOrUndef(font.family)) {\n return null;\n }\n return (font.style ? font.style + ' ' : '')\n\t\t+ (font.weight ? font.weight + ' ' : '')\n\t\t+ font.size + 'px '\n\t\t+ font.family;\n}\nfunction _measureText(ctx, data, gc, longest, string) {\n let textWidth = data[string];\n if (!textWidth) {\n textWidth = data[string] = ctx.measureText(string).width;\n gc.push(string);\n }\n if (textWidth > longest) {\n longest = textWidth;\n }\n return longest;\n}\nfunction _longestText(ctx, font, arrayOfThings, cache) {\n cache = cache || {};\n let data = cache.data = cache.data || {};\n let gc = cache.garbageCollect = cache.garbageCollect || [];\n if (cache.font !== font) {\n data = cache.data = {};\n gc = cache.garbageCollect = [];\n cache.font = font;\n }\n ctx.save();\n ctx.font = font;\n let longest = 0;\n const ilen = arrayOfThings.length;\n let i, j, jlen, thing, nestedThing;\n for (i = 0; i < ilen; i++) {\n thing = arrayOfThings[i];\n if (thing !== undefined && thing !== null && isArray(thing) !== true) {\n longest = _measureText(ctx, data, gc, longest, thing);\n } else if (isArray(thing)) {\n for (j = 0, jlen = thing.length; j < jlen; j++) {\n nestedThing = thing[j];\n if (nestedThing !== undefined && nestedThing !== null && !isArray(nestedThing)) {\n longest = _measureText(ctx, data, gc, longest, nestedThing);\n }\n }\n }\n }\n ctx.restore();\n const gcLen = gc.length / 2;\n if (gcLen > arrayOfThings.length) {\n for (i = 0; i < gcLen; i++) {\n delete data[gc[i]];\n }\n gc.splice(0, gcLen);\n }\n return longest;\n}\nfunction _alignPixel(chart, pixel, width) {\n const devicePixelRatio = chart.currentDevicePixelRatio;\n const halfWidth = width !== 0 ? Math.max(width / 2, 0.5) : 0;\n return Math.round((pixel - halfWidth) * devicePixelRatio) / devicePixelRatio + halfWidth;\n}\nfunction clearCanvas(canvas, ctx) {\n ctx = ctx || canvas.getContext('2d');\n ctx.save();\n ctx.resetTransform();\n ctx.clearRect(0, 0, canvas.width, canvas.height);\n ctx.restore();\n}\nfunction drawPoint(ctx, options, x, y) {\n drawPointLegend(ctx, options, x, y, null);\n}\nfunction drawPointLegend(ctx, options, x, y, w) {\n let type, xOffset, yOffset, size, cornerRadius, width;\n const style = options.pointStyle;\n const rotation = options.rotation;\n const radius = options.radius;\n let rad = (rotation || 0) * RAD_PER_DEG;\n if (style && typeof style === 'object') {\n type = style.toString();\n if (type === '[object HTMLImageElement]' || type === '[object HTMLCanvasElement]') {\n ctx.save();\n ctx.translate(x, y);\n ctx.rotate(rad);\n ctx.drawImage(style, -style.width / 2, -style.height / 2, style.width, style.height);\n ctx.restore();\n return;\n }\n }\n if (isNaN(radius) || radius <= 0) {\n return;\n }\n ctx.beginPath();\n switch (style) {\n default:\n if (w) {\n ctx.ellipse(x, y, w / 2, radius, 0, 0, TAU);\n } else {\n ctx.arc(x, y, radius, 0, TAU);\n }\n ctx.closePath();\n break;\n case 'triangle':\n ctx.moveTo(x + Math.sin(rad) * radius, y - Math.cos(rad) * radius);\n rad += TWO_THIRDS_PI;\n ctx.lineTo(x + Math.sin(rad) * radius, y - Math.cos(rad) * radius);\n rad += TWO_THIRDS_PI;\n ctx.lineTo(x + Math.sin(rad) * radius, y - Math.cos(rad) * radius);\n ctx.closePath();\n break;\n case 'rectRounded':\n cornerRadius = radius * 0.516;\n size = radius - cornerRadius;\n xOffset = Math.cos(rad + QUARTER_PI) * size;\n yOffset = Math.sin(rad + QUARTER_PI) * size;\n ctx.arc(x - xOffset, y - yOffset, cornerRadius, rad - PI, rad - HALF_PI);\n ctx.arc(x + yOffset, y - xOffset, cornerRadius, rad - HALF_PI, rad);\n ctx.arc(x + xOffset, y + yOffset, cornerRadius, rad, rad + HALF_PI);\n ctx.arc(x - yOffset, y + xOffset, cornerRadius, rad + HALF_PI, rad + PI);\n ctx.closePath();\n break;\n case 'rect':\n if (!rotation) {\n size = Math.SQRT1_2 * radius;\n width = w ? w / 2 : size;\n ctx.rect(x - width, y - size, 2 * width, 2 * size);\n break;\n }\n rad += QUARTER_PI;\n case 'rectRot':\n xOffset = Math.cos(rad) * radius;\n yOffset = Math.sin(rad) * radius;\n ctx.moveTo(x - xOffset, y - yOffset);\n ctx.lineTo(x + yOffset, y - xOffset);\n ctx.lineTo(x + xOffset, y + yOffset);\n ctx.lineTo(x - yOffset, y + xOffset);\n ctx.closePath();\n break;\n case 'crossRot':\n rad += QUARTER_PI;\n case 'cross':\n xOffset = Math.cos(rad) * radius;\n yOffset = Math.sin(rad) * radius;\n ctx.moveTo(x - xOffset, y - yOffset);\n ctx.lineTo(x + xOffset, y + yOffset);\n ctx.moveTo(x + yOffset, y - xOffset);\n ctx.lineTo(x - yOffset, y + xOffset);\n break;\n case 'star':\n xOffset = Math.cos(rad) * radius;\n yOffset = Math.sin(rad) * radius;\n ctx.moveTo(x - xOffset, y - yOffset);\n ctx.lineTo(x + xOffset, y + yOffset);\n ctx.moveTo(x + yOffset, y - xOffset);\n ctx.lineTo(x - yOffset, y + xOffset);\n rad += QUARTER_PI;\n xOffset = Math.cos(rad) * radius;\n yOffset = Math.sin(rad) * radius;\n ctx.moveTo(x - xOffset, y - yOffset);\n ctx.lineTo(x + xOffset, y + yOffset);\n ctx.moveTo(x + yOffset, y - xOffset);\n ctx.lineTo(x - yOffset, y + xOffset);\n break;\n case 'line':\n xOffset = w ? w / 2 : Math.cos(rad) * radius;\n yOffset = Math.sin(rad) * radius;\n ctx.moveTo(x - xOffset, y - yOffset);\n ctx.lineTo(x + xOffset, y + yOffset);\n break;\n case 'dash':\n ctx.moveTo(x, y);\n ctx.lineTo(x + Math.cos(rad) * radius, y + Math.sin(rad) * radius);\n break;\n }\n ctx.fill();\n if (options.borderWidth > 0) {\n ctx.stroke();\n }\n}\nfunction _isPointInArea(point, area, margin) {\n margin = margin || 0.5;\n return !area || (point && point.x > area.left - margin && point.x < area.right + margin &&\n\t\tpoint.y > area.top - margin && point.y < area.bottom + margin);\n}\nfunction clipArea(ctx, area) {\n ctx.save();\n ctx.beginPath();\n ctx.rect(area.left, area.top, area.right - area.left, area.bottom - area.top);\n ctx.clip();\n}\nfunction unclipArea(ctx) {\n ctx.restore();\n}\nfunction _steppedLineTo(ctx, previous, target, flip, mode) {\n if (!previous) {\n return ctx.lineTo(target.x, target.y);\n }\n if (mode === 'middle') {\n const midpoint = (previous.x + target.x) / 2.0;\n ctx.lineTo(midpoint, previous.y);\n ctx.lineTo(midpoint, target.y);\n } else if (mode === 'after' !== !!flip) {\n ctx.lineTo(previous.x, target.y);\n } else {\n ctx.lineTo(target.x, previous.y);\n }\n ctx.lineTo(target.x, target.y);\n}\nfunction _bezierCurveTo(ctx, previous, target, flip) {\n if (!previous) {\n return ctx.lineTo(target.x, target.y);\n }\n ctx.bezierCurveTo(\n flip ? previous.cp1x : previous.cp2x,\n flip ? previous.cp1y : previous.cp2y,\n flip ? target.cp2x : target.cp1x,\n flip ? target.cp2y : target.cp1y,\n target.x,\n target.y);\n}\nfunction renderText(ctx, text, x, y, font, opts = {}) {\n const lines = isArray(text) ? text : [text];\n const stroke = opts.strokeWidth > 0 && opts.strokeColor !== '';\n let i, line;\n ctx.save();\n ctx.font = font.string;\n setRenderOpts(ctx, opts);\n for (i = 0; i < lines.length; ++i) {\n line = lines[i];\n if (stroke) {\n if (opts.strokeColor) {\n ctx.strokeStyle = opts.strokeColor;\n }\n if (!isNullOrUndef(opts.strokeWidth)) {\n ctx.lineWidth = opts.strokeWidth;\n }\n ctx.strokeText(line, x, y, opts.maxWidth);\n }\n ctx.fillText(line, x, y, opts.maxWidth);\n decorateText(ctx, x, y, line, opts);\n y += font.lineHeight;\n }\n ctx.restore();\n}\nfunction setRenderOpts(ctx, opts) {\n if (opts.translation) {\n ctx.translate(opts.translation[0], opts.translation[1]);\n }\n if (!isNullOrUndef(opts.rotation)) {\n ctx.rotate(opts.rotation);\n }\n if (opts.color) {\n ctx.fillStyle = opts.color;\n }\n if (opts.textAlign) {\n ctx.textAlign = opts.textAlign;\n }\n if (opts.textBaseline) {\n ctx.textBaseline = opts.textBaseline;\n }\n}\nfunction decorateText(ctx, x, y, line, opts) {\n if (opts.strikethrough || opts.underline) {\n const metrics = ctx.measureText(line);\n const left = x - metrics.actualBoundingBoxLeft;\n const right = x + metrics.actualBoundingBoxRight;\n const top = y - metrics.actualBoundingBoxAscent;\n const bottom = y + metrics.actualBoundingBoxDescent;\n const yDecoration = opts.strikethrough ? (top + bottom) / 2 : bottom;\n ctx.strokeStyle = ctx.fillStyle;\n ctx.beginPath();\n ctx.lineWidth = opts.decorationWidth || 2;\n ctx.moveTo(left, yDecoration);\n ctx.lineTo(right, yDecoration);\n ctx.stroke();\n }\n}\nfunction addRoundedRectPath(ctx, rect) {\n const {x, y, w, h, radius} = rect;\n ctx.arc(x + radius.topLeft, y + radius.topLeft, radius.topLeft, -HALF_PI, PI, true);\n ctx.lineTo(x, y + h - radius.bottomLeft);\n ctx.arc(x + radius.bottomLeft, y + h - radius.bottomLeft, radius.bottomLeft, PI, HALF_PI, true);\n ctx.lineTo(x + w - radius.bottomRight, y + h);\n ctx.arc(x + w - radius.bottomRight, y + h - radius.bottomRight, radius.bottomRight, HALF_PI, 0, true);\n ctx.lineTo(x + w, y + radius.topRight);\n ctx.arc(x + w - radius.topRight, y + radius.topRight, radius.topRight, 0, -HALF_PI, true);\n ctx.lineTo(x + radius.topLeft, y);\n}\n\nconst LINE_HEIGHT = new RegExp(/^(normal|(\\d+(?:\\.\\d+)?)(px|em|%)?)$/);\nconst FONT_STYLE = new RegExp(/^(normal|italic|initial|inherit|unset|(oblique( -?[0-9]?[0-9]deg)?))$/);\nfunction toLineHeight(value, size) {\n const matches = ('' + value).match(LINE_HEIGHT);\n if (!matches || matches[1] === 'normal') {\n return size * 1.2;\n }\n value = +matches[2];\n switch (matches[3]) {\n case 'px':\n return value;\n case '%':\n value /= 100;\n break;\n }\n return size * value;\n}\nconst numberOrZero = v => +v || 0;\nfunction _readValueToProps(value, props) {\n const ret = {};\n const objProps = isObject(props);\n const keys = objProps ? Object.keys(props) : props;\n const read = isObject(value)\n ? objProps\n ? prop => valueOrDefault(value[prop], value[props[prop]])\n : prop => value[prop]\n : () => value;\n for (const prop of keys) {\n ret[prop] = numberOrZero(read(prop));\n }\n return ret;\n}\nfunction toTRBL(value) {\n return _readValueToProps(value, {top: 'y', right: 'x', bottom: 'y', left: 'x'});\n}\nfunction toTRBLCorners(value) {\n return _readValueToProps(value, ['topLeft', 'topRight', 'bottomLeft', 'bottomRight']);\n}\nfunction toPadding(value) {\n const obj = toTRBL(value);\n obj.width = obj.left + obj.right;\n obj.height = obj.top + obj.bottom;\n return obj;\n}\nfunction toFont(options, fallback) {\n options = options || {};\n fallback = fallback || defaults.font;\n let size = valueOrDefault(options.size, fallback.size);\n if (typeof size === 'string') {\n size = parseInt(size, 10);\n }\n let style = valueOrDefault(options.style, fallback.style);\n if (style && !('' + style).match(FONT_STYLE)) {\n console.warn('Invalid font style specified: \"' + style + '\"');\n style = '';\n }\n const font = {\n family: valueOrDefault(options.family, fallback.family),\n lineHeight: toLineHeight(valueOrDefault(options.lineHeight, fallback.lineHeight), size),\n size,\n style,\n weight: valueOrDefault(options.weight, fallback.weight),\n string: ''\n };\n font.string = toFontString(font);\n return font;\n}\nfunction resolve(inputs, context, index, info) {\n let cacheable = true;\n let i, ilen, value;\n for (i = 0, ilen = inputs.length; i < ilen; ++i) {\n value = inputs[i];\n if (value === undefined) {\n continue;\n }\n if (context !== undefined && typeof value === 'function') {\n value = value(context);\n cacheable = false;\n }\n if (index !== undefined && isArray(value)) {\n value = value[index % value.length];\n cacheable = false;\n }\n if (value !== undefined) {\n if (info && !cacheable) {\n info.cacheable = false;\n }\n return value;\n }\n }\n}\nfunction _addGrace(minmax, grace, beginAtZero) {\n const {min, max} = minmax;\n const change = toDimension(grace, (max - min) / 2);\n const keepZero = (value, add) => beginAtZero && value === 0 ? 0 : value + add;\n return {\n min: keepZero(min, -Math.abs(change)),\n max: keepZero(max, change)\n };\n}\nfunction createContext(parentContext, context) {\n return Object.assign(Object.create(parentContext), context);\n}\n\nfunction _createResolver(scopes, prefixes = [''], rootScopes = scopes, fallback, getTarget = () => scopes[0]) {\n if (!defined(fallback)) {\n fallback = _resolve('_fallback', scopes);\n }\n const cache = {\n [Symbol.toStringTag]: 'Object',\n _cacheable: true,\n _scopes: scopes,\n _rootScopes: rootScopes,\n _fallback: fallback,\n _getTarget: getTarget,\n override: (scope) => _createResolver([scope, ...scopes], prefixes, rootScopes, fallback),\n };\n return new Proxy(cache, {\n deleteProperty(target, prop) {\n delete target[prop];\n delete target._keys;\n delete scopes[0][prop];\n return true;\n },\n get(target, prop) {\n return _cached(target, prop,\n () => _resolveWithPrefixes(prop, prefixes, scopes, target));\n },\n getOwnPropertyDescriptor(target, prop) {\n return Reflect.getOwnPropertyDescriptor(target._scopes[0], prop);\n },\n getPrototypeOf() {\n return Reflect.getPrototypeOf(scopes[0]);\n },\n has(target, prop) {\n return getKeysFromAllScopes(target).includes(prop);\n },\n ownKeys(target) {\n return getKeysFromAllScopes(target);\n },\n set(target, prop, value) {\n const storage = target._storage || (target._storage = getTarget());\n target[prop] = storage[prop] = value;\n delete target._keys;\n return true;\n }\n });\n}\nfunction _attachContext(proxy, context, subProxy, descriptorDefaults) {\n const cache = {\n _cacheable: false,\n _proxy: proxy,\n _context: context,\n _subProxy: subProxy,\n _stack: new Set(),\n _descriptors: _descriptors(proxy, descriptorDefaults),\n setContext: (ctx) => _attachContext(proxy, ctx, subProxy, descriptorDefaults),\n override: (scope) => _attachContext(proxy.override(scope), context, subProxy, descriptorDefaults)\n };\n return new Proxy(cache, {\n deleteProperty(target, prop) {\n delete target[prop];\n delete proxy[prop];\n return true;\n },\n get(target, prop, receiver) {\n return _cached(target, prop,\n () => _resolveWithContext(target, prop, receiver));\n },\n getOwnPropertyDescriptor(target, prop) {\n return target._descriptors.allKeys\n ? Reflect.has(proxy, prop) ? {enumerable: true, configurable: true} : undefined\n : Reflect.getOwnPropertyDescriptor(proxy, prop);\n },\n getPrototypeOf() {\n return Reflect.getPrototypeOf(proxy);\n },\n has(target, prop) {\n return Reflect.has(proxy, prop);\n },\n ownKeys() {\n return Reflect.ownKeys(proxy);\n },\n set(target, prop, value) {\n proxy[prop] = value;\n delete target[prop];\n return true;\n }\n });\n}\nfunction _descriptors(proxy, defaults = {scriptable: true, indexable: true}) {\n const {_scriptable = defaults.scriptable, _indexable = defaults.indexable, _allKeys = defaults.allKeys} = proxy;\n return {\n allKeys: _allKeys,\n scriptable: _scriptable,\n indexable: _indexable,\n isScriptable: isFunction(_scriptable) ? _scriptable : () => _scriptable,\n isIndexable: isFunction(_indexable) ? _indexable : () => _indexable\n };\n}\nconst readKey = (prefix, name) => prefix ? prefix + _capitalize(name) : name;\nconst needsSubResolver = (prop, value) => isObject(value) && prop !== 'adapters' &&\n (Object.getPrototypeOf(value) === null || value.constructor === Object);\nfunction _cached(target, prop, resolve) {\n if (Object.prototype.hasOwnProperty.call(target, prop)) {\n return target[prop];\n }\n const value = resolve();\n target[prop] = value;\n return value;\n}\nfunction _resolveWithContext(target, prop, receiver) {\n const {_proxy, _context, _subProxy, _descriptors: descriptors} = target;\n let value = _proxy[prop];\n if (isFunction(value) && descriptors.isScriptable(prop)) {\n value = _resolveScriptable(prop, value, target, receiver);\n }\n if (isArray(value) && value.length) {\n value = _resolveArray(prop, value, target, descriptors.isIndexable);\n }\n if (needsSubResolver(prop, value)) {\n value = _attachContext(value, _context, _subProxy && _subProxy[prop], descriptors);\n }\n return value;\n}\nfunction _resolveScriptable(prop, value, target, receiver) {\n const {_proxy, _context, _subProxy, _stack} = target;\n if (_stack.has(prop)) {\n throw new Error('Recursion detected: ' + Array.from(_stack).join('->') + '->' + prop);\n }\n _stack.add(prop);\n value = value(_context, _subProxy || receiver);\n _stack.delete(prop);\n if (needsSubResolver(prop, value)) {\n value = createSubResolver(_proxy._scopes, _proxy, prop, value);\n }\n return value;\n}\nfunction _resolveArray(prop, value, target, isIndexable) {\n const {_proxy, _context, _subProxy, _descriptors: descriptors} = target;\n if (defined(_context.index) && isIndexable(prop)) {\n value = value[_context.index % value.length];\n } else if (isObject(value[0])) {\n const arr = value;\n const scopes = _proxy._scopes.filter(s => s !== arr);\n value = [];\n for (const item of arr) {\n const resolver = createSubResolver(scopes, _proxy, prop, item);\n value.push(_attachContext(resolver, _context, _subProxy && _subProxy[prop], descriptors));\n }\n }\n return value;\n}\nfunction resolveFallback(fallback, prop, value) {\n return isFunction(fallback) ? fallback(prop, value) : fallback;\n}\nconst getScope = (key, parent) => key === true ? parent\n : typeof key === 'string' ? resolveObjectKey(parent, key) : undefined;\nfunction addScopes(set, parentScopes, key, parentFallback, value) {\n for (const parent of parentScopes) {\n const scope = getScope(key, parent);\n if (scope) {\n set.add(scope);\n const fallback = resolveFallback(scope._fallback, key, value);\n if (defined(fallback) && fallback !== key && fallback !== parentFallback) {\n return fallback;\n }\n } else if (scope === false && defined(parentFallback) && key !== parentFallback) {\n return null;\n }\n }\n return false;\n}\nfunction createSubResolver(parentScopes, resolver, prop, value) {\n const rootScopes = resolver._rootScopes;\n const fallback = resolveFallback(resolver._fallback, prop, value);\n const allScopes = [...parentScopes, ...rootScopes];\n const set = new Set();\n set.add(value);\n let key = addScopesFromKey(set, allScopes, prop, fallback || prop, value);\n if (key === null) {\n return false;\n }\n if (defined(fallback) && fallback !== prop) {\n key = addScopesFromKey(set, allScopes, fallback, key, value);\n if (key === null) {\n return false;\n }\n }\n return _createResolver(Array.from(set), [''], rootScopes, fallback,\n () => subGetTarget(resolver, prop, value));\n}\nfunction addScopesFromKey(set, allScopes, key, fallback, item) {\n while (key) {\n key = addScopes(set, allScopes, key, fallback, item);\n }\n return key;\n}\nfunction subGetTarget(resolver, prop, value) {\n const parent = resolver._getTarget();\n if (!(prop in parent)) {\n parent[prop] = {};\n }\n const target = parent[prop];\n if (isArray(target) && isObject(value)) {\n return value;\n }\n return target;\n}\nfunction _resolveWithPrefixes(prop, prefixes, scopes, proxy) {\n let value;\n for (const prefix of prefixes) {\n value = _resolve(readKey(prefix, prop), scopes);\n if (defined(value)) {\n return needsSubResolver(prop, value)\n ? createSubResolver(scopes, proxy, prop, value)\n : value;\n }\n }\n}\nfunction _resolve(key, scopes) {\n for (const scope of scopes) {\n if (!scope) {\n continue;\n }\n const value = scope[key];\n if (defined(value)) {\n return value;\n }\n }\n}\nfunction getKeysFromAllScopes(target) {\n let keys = target._keys;\n if (!keys) {\n keys = target._keys = resolveKeysFromAllScopes(target._scopes);\n }\n return keys;\n}\nfunction resolveKeysFromAllScopes(scopes) {\n const set = new Set();\n for (const scope of scopes) {\n for (const key of Object.keys(scope).filter(k => !k.startsWith('_'))) {\n set.add(key);\n }\n }\n return Array.from(set);\n}\nfunction _parseObjectDataRadialScale(meta, data, start, count) {\n const {iScale} = meta;\n const {key = 'r'} = this._parsing;\n const parsed = new Array(count);\n let i, ilen, index, item;\n for (i = 0, ilen = count; i < ilen; ++i) {\n index = i + start;\n item = data[index];\n parsed[i] = {\n r: iScale.parse(resolveObjectKey(item, key), index)\n };\n }\n return parsed;\n}\n\nconst EPSILON = Number.EPSILON || 1e-14;\nconst getPoint = (points, i) => i < points.length && !points[i].skip && points[i];\nconst getValueAxis = (indexAxis) => indexAxis === 'x' ? 'y' : 'x';\nfunction splineCurve(firstPoint, middlePoint, afterPoint, t) {\n const previous = firstPoint.skip ? middlePoint : firstPoint;\n const current = middlePoint;\n const next = afterPoint.skip ? middlePoint : afterPoint;\n const d01 = distanceBetweenPoints(current, previous);\n const d12 = distanceBetweenPoints(next, current);\n let s01 = d01 / (d01 + d12);\n let s12 = d12 / (d01 + d12);\n s01 = isNaN(s01) ? 0 : s01;\n s12 = isNaN(s12) ? 0 : s12;\n const fa = t * s01;\n const fb = t * s12;\n return {\n previous: {\n x: current.x - fa * (next.x - previous.x),\n y: current.y - fa * (next.y - previous.y)\n },\n next: {\n x: current.x + fb * (next.x - previous.x),\n y: current.y + fb * (next.y - previous.y)\n }\n };\n}\nfunction monotoneAdjust(points, deltaK, mK) {\n const pointsLen = points.length;\n let alphaK, betaK, tauK, squaredMagnitude, pointCurrent;\n let pointAfter = getPoint(points, 0);\n for (let i = 0; i < pointsLen - 1; ++i) {\n pointCurrent = pointAfter;\n pointAfter = getPoint(points, i + 1);\n if (!pointCurrent || !pointAfter) {\n continue;\n }\n if (almostEquals(deltaK[i], 0, EPSILON)) {\n mK[i] = mK[i + 1] = 0;\n continue;\n }\n alphaK = mK[i] / deltaK[i];\n betaK = mK[i + 1] / deltaK[i];\n squaredMagnitude = Math.pow(alphaK, 2) + Math.pow(betaK, 2);\n if (squaredMagnitude <= 9) {\n continue;\n }\n tauK = 3 / Math.sqrt(squaredMagnitude);\n mK[i] = alphaK * tauK * deltaK[i];\n mK[i + 1] = betaK * tauK * deltaK[i];\n }\n}\nfunction monotoneCompute(points, mK, indexAxis = 'x') {\n const valueAxis = getValueAxis(indexAxis);\n const pointsLen = points.length;\n let delta, pointBefore, pointCurrent;\n let pointAfter = getPoint(points, 0);\n for (let i = 0; i < pointsLen; ++i) {\n pointBefore = pointCurrent;\n pointCurrent = pointAfter;\n pointAfter = getPoint(points, i + 1);\n if (!pointCurrent) {\n continue;\n }\n const iPixel = pointCurrent[indexAxis];\n const vPixel = pointCurrent[valueAxis];\n if (pointBefore) {\n delta = (iPixel - pointBefore[indexAxis]) / 3;\n pointCurrent[`cp1${indexAxis}`] = iPixel - delta;\n pointCurrent[`cp1${valueAxis}`] = vPixel - delta * mK[i];\n }\n if (pointAfter) {\n delta = (pointAfter[indexAxis] - iPixel) / 3;\n pointCurrent[`cp2${indexAxis}`] = iPixel + delta;\n pointCurrent[`cp2${valueAxis}`] = vPixel + delta * mK[i];\n }\n }\n}\nfunction splineCurveMonotone(points, indexAxis = 'x') {\n const valueAxis = getValueAxis(indexAxis);\n const pointsLen = points.length;\n const deltaK = Array(pointsLen).fill(0);\n const mK = Array(pointsLen);\n let i, pointBefore, pointCurrent;\n let pointAfter = getPoint(points, 0);\n for (i = 0; i < pointsLen; ++i) {\n pointBefore = pointCurrent;\n pointCurrent = pointAfter;\n pointAfter = getPoint(points, i + 1);\n if (!pointCurrent) {\n continue;\n }\n if (pointAfter) {\n const slopeDelta = pointAfter[indexAxis] - pointCurrent[indexAxis];\n deltaK[i] = slopeDelta !== 0 ? (pointAfter[valueAxis] - pointCurrent[valueAxis]) / slopeDelta : 0;\n }\n mK[i] = !pointBefore ? deltaK[i]\n : !pointAfter ? deltaK[i - 1]\n : (sign(deltaK[i - 1]) !== sign(deltaK[i])) ? 0\n : (deltaK[i - 1] + deltaK[i]) / 2;\n }\n monotoneAdjust(points, deltaK, mK);\n monotoneCompute(points, mK, indexAxis);\n}\nfunction capControlPoint(pt, min, max) {\n return Math.max(Math.min(pt, max), min);\n}\nfunction capBezierPoints(points, area) {\n let i, ilen, point, inArea, inAreaPrev;\n let inAreaNext = _isPointInArea(points[0], area);\n for (i = 0, ilen = points.length; i < ilen; ++i) {\n inAreaPrev = inArea;\n inArea = inAreaNext;\n inAreaNext = i < ilen - 1 && _isPointInArea(points[i + 1], area);\n if (!inArea) {\n continue;\n }\n point = points[i];\n if (inAreaPrev) {\n point.cp1x = capControlPoint(point.cp1x, area.left, area.right);\n point.cp1y = capControlPoint(point.cp1y, area.top, area.bottom);\n }\n if (inAreaNext) {\n point.cp2x = capControlPoint(point.cp2x, area.left, area.right);\n point.cp2y = capControlPoint(point.cp2y, area.top, area.bottom);\n }\n }\n}\nfunction _updateBezierControlPoints(points, options, area, loop, indexAxis) {\n let i, ilen, point, controlPoints;\n if (options.spanGaps) {\n points = points.filter((pt) => !pt.skip);\n }\n if (options.cubicInterpolationMode === 'monotone') {\n splineCurveMonotone(points, indexAxis);\n } else {\n let prev = loop ? points[points.length - 1] : points[0];\n for (i = 0, ilen = points.length; i < ilen; ++i) {\n point = points[i];\n controlPoints = splineCurve(\n prev,\n point,\n points[Math.min(i + 1, ilen - (loop ? 0 : 1)) % ilen],\n options.tension\n );\n point.cp1x = controlPoints.previous.x;\n point.cp1y = controlPoints.previous.y;\n point.cp2x = controlPoints.next.x;\n point.cp2y = controlPoints.next.y;\n prev = point;\n }\n }\n if (options.capBezierPoints) {\n capBezierPoints(points, area);\n }\n}\n\nfunction _isDomSupported() {\n return typeof window !== 'undefined' && typeof document !== 'undefined';\n}\nfunction _getParentNode(domNode) {\n let parent = domNode.parentNode;\n if (parent && parent.toString() === '[object ShadowRoot]') {\n parent = parent.host;\n }\n return parent;\n}\nfunction parseMaxStyle(styleValue, node, parentProperty) {\n let valueInPixels;\n if (typeof styleValue === 'string') {\n valueInPixels = parseInt(styleValue, 10);\n if (styleValue.indexOf('%') !== -1) {\n valueInPixels = valueInPixels / 100 * node.parentNode[parentProperty];\n }\n } else {\n valueInPixels = styleValue;\n }\n return valueInPixels;\n}\nconst getComputedStyle = (element) => window.getComputedStyle(element, null);\nfunction getStyle(el, property) {\n return getComputedStyle(el).getPropertyValue(property);\n}\nconst positions = ['top', 'right', 'bottom', 'left'];\nfunction getPositionedStyle(styles, style, suffix) {\n const result = {};\n suffix = suffix ? '-' + suffix : '';\n for (let i = 0; i < 4; i++) {\n const pos = positions[i];\n result[pos] = parseFloat(styles[style + '-' + pos + suffix]) || 0;\n }\n result.width = result.left + result.right;\n result.height = result.top + result.bottom;\n return result;\n}\nconst useOffsetPos = (x, y, target) => (x > 0 || y > 0) && (!target || !target.shadowRoot);\nfunction getCanvasPosition(e, canvas) {\n const touches = e.touches;\n const source = touches && touches.length ? touches[0] : e;\n const {offsetX, offsetY} = source;\n let box = false;\n let x, y;\n if (useOffsetPos(offsetX, offsetY, e.target)) {\n x = offsetX;\n y = offsetY;\n } else {\n const rect = canvas.getBoundingClientRect();\n x = source.clientX - rect.left;\n y = source.clientY - rect.top;\n box = true;\n }\n return {x, y, box};\n}\nfunction getRelativePosition(evt, chart) {\n if ('native' in evt) {\n return evt;\n }\n const {canvas, currentDevicePixelRatio} = chart;\n const style = getComputedStyle(canvas);\n const borderBox = style.boxSizing === 'border-box';\n const paddings = getPositionedStyle(style, 'padding');\n const borders = getPositionedStyle(style, 'border', 'width');\n const {x, y, box} = getCanvasPosition(evt, canvas);\n const xOffset = paddings.left + (box && borders.left);\n const yOffset = paddings.top + (box && borders.top);\n let {width, height} = chart;\n if (borderBox) {\n width -= paddings.width + borders.width;\n height -= paddings.height + borders.height;\n }\n return {\n x: Math.round((x - xOffset) / width * canvas.width / currentDevicePixelRatio),\n y: Math.round((y - yOffset) / height * canvas.height / currentDevicePixelRatio)\n };\n}\nfunction getContainerSize(canvas, width, height) {\n let maxWidth, maxHeight;\n if (width === undefined || height === undefined) {\n const container = _getParentNode(canvas);\n if (!container) {\n width = canvas.clientWidth;\n height = canvas.clientHeight;\n } else {\n const rect = container.getBoundingClientRect();\n const containerStyle = getComputedStyle(container);\n const containerBorder = getPositionedStyle(containerStyle, 'border', 'width');\n const containerPadding = getPositionedStyle(containerStyle, 'padding');\n width = rect.width - containerPadding.width - containerBorder.width;\n height = rect.height - containerPadding.height - containerBorder.height;\n maxWidth = parseMaxStyle(containerStyle.maxWidth, container, 'clientWidth');\n maxHeight = parseMaxStyle(containerStyle.maxHeight, container, 'clientHeight');\n }\n }\n return {\n width,\n height,\n maxWidth: maxWidth || INFINITY,\n maxHeight: maxHeight || INFINITY\n };\n}\nconst round1 = v => Math.round(v * 10) / 10;\nfunction getMaximumSize(canvas, bbWidth, bbHeight, aspectRatio) {\n const style = getComputedStyle(canvas);\n const margins = getPositionedStyle(style, 'margin');\n const maxWidth = parseMaxStyle(style.maxWidth, canvas, 'clientWidth') || INFINITY;\n const maxHeight = parseMaxStyle(style.maxHeight, canvas, 'clientHeight') || INFINITY;\n const containerSize = getContainerSize(canvas, bbWidth, bbHeight);\n let {width, height} = containerSize;\n if (style.boxSizing === 'content-box') {\n const borders = getPositionedStyle(style, 'border', 'width');\n const paddings = getPositionedStyle(style, 'padding');\n width -= paddings.width + borders.width;\n height -= paddings.height + borders.height;\n }\n width = Math.max(0, width - margins.width);\n height = Math.max(0, aspectRatio ? Math.floor(width / aspectRatio) : height - margins.height);\n width = round1(Math.min(width, maxWidth, containerSize.maxWidth));\n height = round1(Math.min(height, maxHeight, containerSize.maxHeight));\n if (width && !height) {\n height = round1(width / 2);\n }\n return {\n width,\n height\n };\n}\nfunction retinaScale(chart, forceRatio, forceStyle) {\n const pixelRatio = forceRatio || 1;\n const deviceHeight = Math.floor(chart.height * pixelRatio);\n const deviceWidth = Math.floor(chart.width * pixelRatio);\n chart.height = deviceHeight / pixelRatio;\n chart.width = deviceWidth / pixelRatio;\n const canvas = chart.canvas;\n if (canvas.style && (forceStyle || (!canvas.style.height && !canvas.style.width))) {\n canvas.style.height = `${chart.height}px`;\n canvas.style.width = `${chart.width}px`;\n }\n if (chart.currentDevicePixelRatio !== pixelRatio\n || canvas.height !== deviceHeight\n || canvas.width !== deviceWidth) {\n chart.currentDevicePixelRatio = pixelRatio;\n canvas.height = deviceHeight;\n canvas.width = deviceWidth;\n chart.ctx.setTransform(pixelRatio, 0, 0, pixelRatio, 0, 0);\n return true;\n }\n return false;\n}\nconst supportsEventListenerOptions = (function() {\n let passiveSupported = false;\n try {\n const options = {\n get passive() {\n passiveSupported = true;\n return false;\n }\n };\n window.addEventListener('test', null, options);\n window.removeEventListener('test', null, options);\n } catch (e) {\n }\n return passiveSupported;\n}());\nfunction readUsedSize(element, property) {\n const value = getStyle(element, property);\n const matches = value && value.match(/^(\\d+)(\\.\\d+)?px$/);\n return matches ? +matches[1] : undefined;\n}\n\nfunction _pointInLine(p1, p2, t, mode) {\n return {\n x: p1.x + t * (p2.x - p1.x),\n y: p1.y + t * (p2.y - p1.y)\n };\n}\nfunction _steppedInterpolation(p1, p2, t, mode) {\n return {\n x: p1.x + t * (p2.x - p1.x),\n y: mode === 'middle' ? t < 0.5 ? p1.y : p2.y\n : mode === 'after' ? t < 1 ? p1.y : p2.y\n : t > 0 ? p2.y : p1.y\n };\n}\nfunction _bezierInterpolation(p1, p2, t, mode) {\n const cp1 = {x: p1.cp2x, y: p1.cp2y};\n const cp2 = {x: p2.cp1x, y: p2.cp1y};\n const a = _pointInLine(p1, cp1, t);\n const b = _pointInLine(cp1, cp2, t);\n const c = _pointInLine(cp2, p2, t);\n const d = _pointInLine(a, b, t);\n const e = _pointInLine(b, c, t);\n return _pointInLine(d, e, t);\n}\n\nconst intlCache = new Map();\nfunction getNumberFormat(locale, options) {\n options = options || {};\n const cacheKey = locale + JSON.stringify(options);\n let formatter = intlCache.get(cacheKey);\n if (!formatter) {\n formatter = new Intl.NumberFormat(locale, options);\n intlCache.set(cacheKey, formatter);\n }\n return formatter;\n}\nfunction formatNumber(num, locale, options) {\n return getNumberFormat(locale, options).format(num);\n}\n\nconst getRightToLeftAdapter = function(rectX, width) {\n return {\n x(x) {\n return rectX + rectX + width - x;\n },\n setWidth(w) {\n width = w;\n },\n textAlign(align) {\n if (align === 'center') {\n return align;\n }\n return align === 'right' ? 'left' : 'right';\n },\n xPlus(x, value) {\n return x - value;\n },\n leftForLtr(x, itemWidth) {\n return x - itemWidth;\n },\n };\n};\nconst getLeftToRightAdapter = function() {\n return {\n x(x) {\n return x;\n },\n setWidth(w) {\n },\n textAlign(align) {\n return align;\n },\n xPlus(x, value) {\n return x + value;\n },\n leftForLtr(x, _itemWidth) {\n return x;\n },\n };\n};\nfunction getRtlAdapter(rtl, rectX, width) {\n return rtl ? getRightToLeftAdapter(rectX, width) : getLeftToRightAdapter();\n}\nfunction overrideTextDirection(ctx, direction) {\n let style, original;\n if (direction === 'ltr' || direction === 'rtl') {\n style = ctx.canvas.style;\n original = [\n style.getPropertyValue('direction'),\n style.getPropertyPriority('direction'),\n ];\n style.setProperty('direction', direction, 'important');\n ctx.prevTextDirection = original;\n }\n}\nfunction restoreTextDirection(ctx, original) {\n if (original !== undefined) {\n delete ctx.prevTextDirection;\n ctx.canvas.style.setProperty('direction', original[0], original[1]);\n }\n}\n\nfunction propertyFn(property) {\n if (property === 'angle') {\n return {\n between: _angleBetween,\n compare: _angleDiff,\n normalize: _normalizeAngle,\n };\n }\n return {\n between: _isBetween,\n compare: (a, b) => a - b,\n normalize: x => x\n };\n}\nfunction normalizeSegment({start, end, count, loop, style}) {\n return {\n start: start % count,\n end: end % count,\n loop: loop && (end - start + 1) % count === 0,\n style\n };\n}\nfunction getSegment(segment, points, bounds) {\n const {property, start: startBound, end: endBound} = bounds;\n const {between, normalize} = propertyFn(property);\n const count = points.length;\n let {start, end, loop} = segment;\n let i, ilen;\n if (loop) {\n start += count;\n end += count;\n for (i = 0, ilen = count; i < ilen; ++i) {\n if (!between(normalize(points[start % count][property]), startBound, endBound)) {\n break;\n }\n start--;\n end--;\n }\n start %= count;\n end %= count;\n }\n if (end < start) {\n end += count;\n }\n return {start, end, loop, style: segment.style};\n}\nfunction _boundSegment(segment, points, bounds) {\n if (!bounds) {\n return [segment];\n }\n const {property, start: startBound, end: endBound} = bounds;\n const count = points.length;\n const {compare, between, normalize} = propertyFn(property);\n const {start, end, loop, style} = getSegment(segment, points, bounds);\n const result = [];\n let inside = false;\n let subStart = null;\n let value, point, prevValue;\n const startIsBefore = () => between(startBound, prevValue, value) && compare(startBound, prevValue) !== 0;\n const endIsBefore = () => compare(endBound, value) === 0 || between(endBound, prevValue, value);\n const shouldStart = () => inside || startIsBefore();\n const shouldStop = () => !inside || endIsBefore();\n for (let i = start, prev = start; i <= end; ++i) {\n point = points[i % count];\n if (point.skip) {\n continue;\n }\n value = normalize(point[property]);\n if (value === prevValue) {\n continue;\n }\n inside = between(value, startBound, endBound);\n if (subStart === null && shouldStart()) {\n subStart = compare(value, startBound) === 0 ? i : prev;\n }\n if (subStart !== null && shouldStop()) {\n result.push(normalizeSegment({start: subStart, end: i, loop, count, style}));\n subStart = null;\n }\n prev = i;\n prevValue = value;\n }\n if (subStart !== null) {\n result.push(normalizeSegment({start: subStart, end, loop, count, style}));\n }\n return result;\n}\nfunction _boundSegments(line, bounds) {\n const result = [];\n const segments = line.segments;\n for (let i = 0; i < segments.length; i++) {\n const sub = _boundSegment(segments[i], line.points, bounds);\n if (sub.length) {\n result.push(...sub);\n }\n }\n return result;\n}\nfunction findStartAndEnd(points, count, loop, spanGaps) {\n let start = 0;\n let end = count - 1;\n if (loop && !spanGaps) {\n while (start < count && !points[start].skip) {\n start++;\n }\n }\n while (start < count && points[start].skip) {\n start++;\n }\n start %= count;\n if (loop) {\n end += start;\n }\n while (end > start && points[end % count].skip) {\n end--;\n }\n end %= count;\n return {start, end};\n}\nfunction solidSegments(points, start, max, loop) {\n const count = points.length;\n const result = [];\n let last = start;\n let prev = points[start];\n let end;\n for (end = start + 1; end <= max; ++end) {\n const cur = points[end % count];\n if (cur.skip || cur.stop) {\n if (!prev.skip) {\n loop = false;\n result.push({start: start % count, end: (end - 1) % count, loop});\n start = last = cur.stop ? end : null;\n }\n } else {\n last = end;\n if (prev.skip) {\n start = end;\n }\n }\n prev = cur;\n }\n if (last !== null) {\n result.push({start: start % count, end: last % count, loop});\n }\n return result;\n}\nfunction _computeSegments(line, segmentOptions) {\n const points = line.points;\n const spanGaps = line.options.spanGaps;\n const count = points.length;\n if (!count) {\n return [];\n }\n const loop = !!line._loop;\n const {start, end} = findStartAndEnd(points, count, loop, spanGaps);\n if (spanGaps === true) {\n return splitByStyles(line, [{start, end, loop}], points, segmentOptions);\n }\n const max = end < start ? end + count : end;\n const completeLoop = !!line._fullLoop && start === 0 && end === count - 1;\n return splitByStyles(line, solidSegments(points, start, max, completeLoop), points, segmentOptions);\n}\nfunction splitByStyles(line, segments, points, segmentOptions) {\n if (!segmentOptions || !segmentOptions.setContext || !points) {\n return segments;\n }\n return doSplitByStyles(line, segments, points, segmentOptions);\n}\nfunction doSplitByStyles(line, segments, points, segmentOptions) {\n const chartContext = line._chart.getContext();\n const baseStyle = readStyle(line.options);\n const {_datasetIndex: datasetIndex, options: {spanGaps}} = line;\n const count = points.length;\n const result = [];\n let prevStyle = baseStyle;\n let start = segments[0].start;\n let i = start;\n function addStyle(s, e, l, st) {\n const dir = spanGaps ? -1 : 1;\n if (s === e) {\n return;\n }\n s += count;\n while (points[s % count].skip) {\n s -= dir;\n }\n while (points[e % count].skip) {\n e += dir;\n }\n if (s % count !== e % count) {\n result.push({start: s % count, end: e % count, loop: l, style: st});\n prevStyle = st;\n start = e % count;\n }\n }\n for (const segment of segments) {\n start = spanGaps ? start : segment.start;\n let prev = points[start % count];\n let style;\n for (i = start + 1; i <= segment.end; i++) {\n const pt = points[i % count];\n style = readStyle(segmentOptions.setContext(createContext(chartContext, {\n type: 'segment',\n p0: prev,\n p1: pt,\n p0DataIndex: (i - 1) % count,\n p1DataIndex: i % count,\n datasetIndex\n })));\n if (styleChanged(style, prevStyle)) {\n addStyle(start, i - 1, segment.loop, prevStyle);\n }\n prev = pt;\n prevStyle = style;\n }\n if (start < i - 1) {\n addStyle(start, i - 1, segment.loop, prevStyle);\n }\n }\n return result;\n}\nfunction readStyle(options) {\n return {\n backgroundColor: options.backgroundColor,\n borderCapStyle: options.borderCapStyle,\n borderDash: options.borderDash,\n borderDashOffset: options.borderDashOffset,\n borderJoinStyle: options.borderJoinStyle,\n borderWidth: options.borderWidth,\n borderColor: options.borderColor\n };\n}\nfunction styleChanged(style, prevStyle) {\n return prevStyle && JSON.stringify(style) !== JSON.stringify(prevStyle);\n}\n\nexport { _isPointInArea as $, _factorize as A, finiteOrDefault as B, callback as C, _addGrace as D, _limitValue as E, toDegrees as F, _measureText as G, HALF_PI as H, _int16Range as I, _alignPixel as J, toPadding as K, clipArea as L, renderText as M, unclipArea as N, toFont as O, PI as P, each as Q, _toLeftRightCenter as R, _alignStartEnd as S, TAU as T, overrides as U, merge as V, _capitalize as W, getRelativePosition as X, _rlookupByKey as Y, _lookupByKey as Z, _arrayUnique as _, resolve as a, toLineHeight as a$, getAngleFromPoint as a0, getMaximumSize as a1, _getParentNode as a2, readUsedSize as a3, throttled as a4, supportsEventListenerOptions as a5, _isDomSupported as a6, descriptors as a7, isFunction as a8, _attachContext as a9, getRtlAdapter as aA, overrideTextDirection as aB, _textX as aC, restoreTextDirection as aD, drawPointLegend as aE, noop as aF, distanceBetweenPoints as aG, _setMinAndMaxByKey as aH, niceNum as aI, almostWhole as aJ, almostEquals as aK, _decimalPlaces as aL, _longestText as aM, _filterBetween as aN, _lookup as aO, isPatternOrGradient as aP, getHoverColor as aQ, clone$1 as aR, _merger as aS, _mergerIf as aT, _deprecated as aU, _splitKey as aV, toFontString as aW, splineCurve as aX, splineCurveMonotone as aY, getStyle as aZ, fontString as a_, _createResolver as aa, _descriptors as ab, mergeIf as ac, uid as ad, debounce as ae, retinaScale as af, clearCanvas as ag, setsEqual as ah, _elementsEqual as ai, _isClickEvent as aj, _isBetween as ak, _readValueToProps as al, _updateBezierControlPoints as am, _computeSegments as an, _boundSegments as ao, _steppedInterpolation as ap, _bezierInterpolation as aq, _pointInLine as ar, _steppedLineTo as as, _bezierCurveTo as at, drawPoint as au, addRoundedRectPath as av, toTRBL as aw, toTRBLCorners as ax, _boundSegment as ay, _normalizeAngle as az, isArray as b, PITAU as b0, INFINITY as b1, RAD_PER_DEG as b2, QUARTER_PI as b3, TWO_THIRDS_PI as b4, _angleDiff as b5, color as c, defaults as d, effects as e, resolveObjectKey as f, isNumberFinite as g, createContext as h, isObject as i, defined as j, isNullOrUndef as k, listenArrayEvents as l, toPercentage as m, toDimension as n, formatNumber as o, _angleBetween as p, _getStartAndCountOfVisiblePoints as q, requestAnimFrame as r, sign as s, toRadians as t, unlistenArrayEvents as u, valueOrDefault as v, _scaleRangesChanged as w, isNumber as x, _parseObjectDataRadialScale as y, log10 as z };\n","/*!\n * Chart.js v3.9.1\n * https://www.chartjs.org\n * (c) 2022 Chart.js Contributors\n * Released under the MIT License\n */\nimport { r as requestAnimFrame, a as resolve, e as effects, c as color, d as defaults, i as isObject, b as isArray, v as valueOrDefault, u as unlistenArrayEvents, l as listenArrayEvents, f as resolveObjectKey, g as isNumberFinite, h as createContext, j as defined, s as sign, k as isNullOrUndef, _ as _arrayUnique, t as toRadians, m as toPercentage, n as toDimension, T as TAU, o as formatNumber, p as _angleBetween, H as HALF_PI, P as PI, q as _getStartAndCountOfVisiblePoints, w as _scaleRangesChanged, x as isNumber, y as _parseObjectDataRadialScale, z as log10, A as _factorize, B as finiteOrDefault, C as callback, D as _addGrace, E as _limitValue, F as toDegrees, G as _measureText, I as _int16Range, J as _alignPixel, K as toPadding, L as clipArea, M as renderText, N as unclipArea, O as toFont, Q as each, R as _toLeftRightCenter, S as _alignStartEnd, U as overrides, V as merge, W as _capitalize, X as getRelativePosition, Y as _rlookupByKey, Z as _lookupByKey, $ as _isPointInArea, a0 as getAngleFromPoint, a1 as getMaximumSize, a2 as _getParentNode, a3 as readUsedSize, a4 as throttled, a5 as supportsEventListenerOptions, a6 as _isDomSupported, a7 as descriptors, a8 as isFunction, a9 as _attachContext, aa as _createResolver, ab as _descriptors, ac as mergeIf, ad as uid, ae as debounce, af as retinaScale, ag as clearCanvas, ah as setsEqual, ai as _elementsEqual, aj as _isClickEvent, ak as _isBetween, al as _readValueToProps, am as _updateBezierControlPoints, an as _computeSegments, ao as _boundSegments, ap as _steppedInterpolation, aq as _bezierInterpolation, ar as _pointInLine, as as _steppedLineTo, at as _bezierCurveTo, au as drawPoint, av as addRoundedRectPath, aw as toTRBL, ax as toTRBLCorners, ay as _boundSegment, az as _normalizeAngle, aA as getRtlAdapter, aB as overrideTextDirection, aC as _textX, aD as restoreTextDirection, aE as drawPointLegend, aF as noop, aG as distanceBetweenPoints, aH as _setMinAndMaxByKey, aI as niceNum, aJ as almostWhole, aK as almostEquals, aL as _decimalPlaces, aM as _longestText, aN as _filterBetween, aO as _lookup } from './chunks/helpers.segment.mjs';\nexport { d as defaults } from './chunks/helpers.segment.mjs';\n\nclass Animator {\n constructor() {\n this._request = null;\n this._charts = new Map();\n this._running = false;\n this._lastDate = undefined;\n }\n _notify(chart, anims, date, type) {\n const callbacks = anims.listeners[type];\n const numSteps = anims.duration;\n callbacks.forEach(fn => fn({\n chart,\n initial: anims.initial,\n numSteps,\n currentStep: Math.min(date - anims.start, numSteps)\n }));\n }\n _refresh() {\n if (this._request) {\n return;\n }\n this._running = true;\n this._request = requestAnimFrame.call(window, () => {\n this._update();\n this._request = null;\n if (this._running) {\n this._refresh();\n }\n });\n }\n _update(date = Date.now()) {\n let remaining = 0;\n this._charts.forEach((anims, chart) => {\n if (!anims.running || !anims.items.length) {\n return;\n }\n const items = anims.items;\n let i = items.length - 1;\n let draw = false;\n let item;\n for (; i >= 0; --i) {\n item = items[i];\n if (item._active) {\n if (item._total > anims.duration) {\n anims.duration = item._total;\n }\n item.tick(date);\n draw = true;\n } else {\n items[i] = items[items.length - 1];\n items.pop();\n }\n }\n if (draw) {\n chart.draw();\n this._notify(chart, anims, date, 'progress');\n }\n if (!items.length) {\n anims.running = false;\n this._notify(chart, anims, date, 'complete');\n anims.initial = false;\n }\n remaining += items.length;\n });\n this._lastDate = date;\n if (remaining === 0) {\n this._running = false;\n }\n }\n _getAnims(chart) {\n const charts = this._charts;\n let anims = charts.get(chart);\n if (!anims) {\n anims = {\n running: false,\n initial: true,\n items: [],\n listeners: {\n complete: [],\n progress: []\n }\n };\n charts.set(chart, anims);\n }\n return anims;\n }\n listen(chart, event, cb) {\n this._getAnims(chart).listeners[event].push(cb);\n }\n add(chart, items) {\n if (!items || !items.length) {\n return;\n }\n this._getAnims(chart).items.push(...items);\n }\n has(chart) {\n return this._getAnims(chart).items.length > 0;\n }\n start(chart) {\n const anims = this._charts.get(chart);\n if (!anims) {\n return;\n }\n anims.running = true;\n anims.start = Date.now();\n anims.duration = anims.items.reduce((acc, cur) => Math.max(acc, cur._duration), 0);\n this._refresh();\n }\n running(chart) {\n if (!this._running) {\n return false;\n }\n const anims = this._charts.get(chart);\n if (!anims || !anims.running || !anims.items.length) {\n return false;\n }\n return true;\n }\n stop(chart) {\n const anims = this._charts.get(chart);\n if (!anims || !anims.items.length) {\n return;\n }\n const items = anims.items;\n let i = items.length - 1;\n for (; i >= 0; --i) {\n items[i].cancel();\n }\n anims.items = [];\n this._notify(chart, anims, Date.now(), 'complete');\n }\n remove(chart) {\n return this._charts.delete(chart);\n }\n}\nvar animator = new Animator();\n\nconst transparent = 'transparent';\nconst interpolators = {\n boolean(from, to, factor) {\n return factor > 0.5 ? to : from;\n },\n color(from, to, factor) {\n const c0 = color(from || transparent);\n const c1 = c0.valid && color(to || transparent);\n return c1 && c1.valid\n ? c1.mix(c0, factor).hexString()\n : to;\n },\n number(from, to, factor) {\n return from + (to - from) * factor;\n }\n};\nclass Animation {\n constructor(cfg, target, prop, to) {\n const currentValue = target[prop];\n to = resolve([cfg.to, to, currentValue, cfg.from]);\n const from = resolve([cfg.from, currentValue, to]);\n this._active = true;\n this._fn = cfg.fn || interpolators[cfg.type || typeof from];\n this._easing = effects[cfg.easing] || effects.linear;\n this._start = Math.floor(Date.now() + (cfg.delay || 0));\n this._duration = this._total = Math.floor(cfg.duration);\n this._loop = !!cfg.loop;\n this._target = target;\n this._prop = prop;\n this._from = from;\n this._to = to;\n this._promises = undefined;\n }\n active() {\n return this._active;\n }\n update(cfg, to, date) {\n if (this._active) {\n this._notify(false);\n const currentValue = this._target[this._prop];\n const elapsed = date - this._start;\n const remain = this._duration - elapsed;\n this._start = date;\n this._duration = Math.floor(Math.max(remain, cfg.duration));\n this._total += elapsed;\n this._loop = !!cfg.loop;\n this._to = resolve([cfg.to, to, currentValue, cfg.from]);\n this._from = resolve([cfg.from, currentValue, to]);\n }\n }\n cancel() {\n if (this._active) {\n this.tick(Date.now());\n this._active = false;\n this._notify(false);\n }\n }\n tick(date) {\n const elapsed = date - this._start;\n const duration = this._duration;\n const prop = this._prop;\n const from = this._from;\n const loop = this._loop;\n const to = this._to;\n let factor;\n this._active = from !== to && (loop || (elapsed < duration));\n if (!this._active) {\n this._target[prop] = to;\n this._notify(true);\n return;\n }\n if (elapsed < 0) {\n this._target[prop] = from;\n return;\n }\n factor = (elapsed / duration) % 2;\n factor = loop && factor > 1 ? 2 - factor : factor;\n factor = this._easing(Math.min(1, Math.max(0, factor)));\n this._target[prop] = this._fn(from, to, factor);\n }\n wait() {\n const promises = this._promises || (this._promises = []);\n return new Promise((res, rej) => {\n promises.push({res, rej});\n });\n }\n _notify(resolved) {\n const method = resolved ? 'res' : 'rej';\n const promises = this._promises || [];\n for (let i = 0; i < promises.length; i++) {\n promises[i][method]();\n }\n }\n}\n\nconst numbers = ['x', 'y', 'borderWidth', 'radius', 'tension'];\nconst colors = ['color', 'borderColor', 'backgroundColor'];\ndefaults.set('animation', {\n delay: undefined,\n duration: 1000,\n easing: 'easeOutQuart',\n fn: undefined,\n from: undefined,\n loop: undefined,\n to: undefined,\n type: undefined,\n});\nconst animationOptions = Object.keys(defaults.animation);\ndefaults.describe('animation', {\n _fallback: false,\n _indexable: false,\n _scriptable: (name) => name !== 'onProgress' && name !== 'onComplete' && name !== 'fn',\n});\ndefaults.set('animations', {\n colors: {\n type: 'color',\n properties: colors\n },\n numbers: {\n type: 'number',\n properties: numbers\n },\n});\ndefaults.describe('animations', {\n _fallback: 'animation',\n});\ndefaults.set('transitions', {\n active: {\n animation: {\n duration: 400\n }\n },\n resize: {\n animation: {\n duration: 0\n }\n },\n show: {\n animations: {\n colors: {\n from: 'transparent'\n },\n visible: {\n type: 'boolean',\n duration: 0\n },\n }\n },\n hide: {\n animations: {\n colors: {\n to: 'transparent'\n },\n visible: {\n type: 'boolean',\n easing: 'linear',\n fn: v => v | 0\n },\n }\n }\n});\nclass Animations {\n constructor(chart, config) {\n this._chart = chart;\n this._properties = new Map();\n this.configure(config);\n }\n configure(config) {\n if (!isObject(config)) {\n return;\n }\n const animatedProps = this._properties;\n Object.getOwnPropertyNames(config).forEach(key => {\n const cfg = config[key];\n if (!isObject(cfg)) {\n return;\n }\n const resolved = {};\n for (const option of animationOptions) {\n resolved[option] = cfg[option];\n }\n (isArray(cfg.properties) && cfg.properties || [key]).forEach((prop) => {\n if (prop === key || !animatedProps.has(prop)) {\n animatedProps.set(prop, resolved);\n }\n });\n });\n }\n _animateOptions(target, values) {\n const newOptions = values.options;\n const options = resolveTargetOptions(target, newOptions);\n if (!options) {\n return [];\n }\n const animations = this._createAnimations(options, newOptions);\n if (newOptions.$shared) {\n awaitAll(target.options.$animations, newOptions).then(() => {\n target.options = newOptions;\n }, () => {\n });\n }\n return animations;\n }\n _createAnimations(target, values) {\n const animatedProps = this._properties;\n const animations = [];\n const running = target.$animations || (target.$animations = {});\n const props = Object.keys(values);\n const date = Date.now();\n let i;\n for (i = props.length - 1; i >= 0; --i) {\n const prop = props[i];\n if (prop.charAt(0) === '$') {\n continue;\n }\n if (prop === 'options') {\n animations.push(...this._animateOptions(target, values));\n continue;\n }\n const value = values[prop];\n let animation = running[prop];\n const cfg = animatedProps.get(prop);\n if (animation) {\n if (cfg && animation.active()) {\n animation.update(cfg, value, date);\n continue;\n } else {\n animation.cancel();\n }\n }\n if (!cfg || !cfg.duration) {\n target[prop] = value;\n continue;\n }\n running[prop] = animation = new Animation(cfg, target, prop, value);\n animations.push(animation);\n }\n return animations;\n }\n update(target, values) {\n if (this._properties.size === 0) {\n Object.assign(target, values);\n return;\n }\n const animations = this._createAnimations(target, values);\n if (animations.length) {\n animator.add(this._chart, animations);\n return true;\n }\n }\n}\nfunction awaitAll(animations, properties) {\n const running = [];\n const keys = Object.keys(properties);\n for (let i = 0; i < keys.length; i++) {\n const anim = animations[keys[i]];\n if (anim && anim.active()) {\n running.push(anim.wait());\n }\n }\n return Promise.all(running);\n}\nfunction resolveTargetOptions(target, newOptions) {\n if (!newOptions) {\n return;\n }\n let options = target.options;\n if (!options) {\n target.options = newOptions;\n return;\n }\n if (options.$shared) {\n target.options = options = Object.assign({}, options, {$shared: false, $animations: {}});\n }\n return options;\n}\n\nfunction scaleClip(scale, allowedOverflow) {\n const opts = scale && scale.options || {};\n const reverse = opts.reverse;\n const min = opts.min === undefined ? allowedOverflow : 0;\n const max = opts.max === undefined ? allowedOverflow : 0;\n return {\n start: reverse ? max : min,\n end: reverse ? min : max\n };\n}\nfunction defaultClip(xScale, yScale, allowedOverflow) {\n if (allowedOverflow === false) {\n return false;\n }\n const x = scaleClip(xScale, allowedOverflow);\n const y = scaleClip(yScale, allowedOverflow);\n return {\n top: y.end,\n right: x.end,\n bottom: y.start,\n left: x.start\n };\n}\nfunction toClip(value) {\n let t, r, b, l;\n if (isObject(value)) {\n t = value.top;\n r = value.right;\n b = value.bottom;\n l = value.left;\n } else {\n t = r = b = l = value;\n }\n return {\n top: t,\n right: r,\n bottom: b,\n left: l,\n disabled: value === false\n };\n}\nfunction getSortedDatasetIndices(chart, filterVisible) {\n const keys = [];\n const metasets = chart._getSortedDatasetMetas(filterVisible);\n let i, ilen;\n for (i = 0, ilen = metasets.length; i < ilen; ++i) {\n keys.push(metasets[i].index);\n }\n return keys;\n}\nfunction applyStack(stack, value, dsIndex, options = {}) {\n const keys = stack.keys;\n const singleMode = options.mode === 'single';\n let i, ilen, datasetIndex, otherValue;\n if (value === null) {\n return;\n }\n for (i = 0, ilen = keys.length; i < ilen; ++i) {\n datasetIndex = +keys[i];\n if (datasetIndex === dsIndex) {\n if (options.all) {\n continue;\n }\n break;\n }\n otherValue = stack.values[datasetIndex];\n if (isNumberFinite(otherValue) && (singleMode || (value === 0 || sign(value) === sign(otherValue)))) {\n value += otherValue;\n }\n }\n return value;\n}\nfunction convertObjectDataToArray(data) {\n const keys = Object.keys(data);\n const adata = new Array(keys.length);\n let i, ilen, key;\n for (i = 0, ilen = keys.length; i < ilen; ++i) {\n key = keys[i];\n adata[i] = {\n x: key,\n y: data[key]\n };\n }\n return adata;\n}\nfunction isStacked(scale, meta) {\n const stacked = scale && scale.options.stacked;\n return stacked || (stacked === undefined && meta.stack !== undefined);\n}\nfunction getStackKey(indexScale, valueScale, meta) {\n return `${indexScale.id}.${valueScale.id}.${meta.stack || meta.type}`;\n}\nfunction getUserBounds(scale) {\n const {min, max, minDefined, maxDefined} = scale.getUserBounds();\n return {\n min: minDefined ? min : Number.NEGATIVE_INFINITY,\n max: maxDefined ? max : Number.POSITIVE_INFINITY\n };\n}\nfunction getOrCreateStack(stacks, stackKey, indexValue) {\n const subStack = stacks[stackKey] || (stacks[stackKey] = {});\n return subStack[indexValue] || (subStack[indexValue] = {});\n}\nfunction getLastIndexInStack(stack, vScale, positive, type) {\n for (const meta of vScale.getMatchingVisibleMetas(type).reverse()) {\n const value = stack[meta.index];\n if ((positive && value > 0) || (!positive && value < 0)) {\n return meta.index;\n }\n }\n return null;\n}\nfunction updateStacks(controller, parsed) {\n const {chart, _cachedMeta: meta} = controller;\n const stacks = chart._stacks || (chart._stacks = {});\n const {iScale, vScale, index: datasetIndex} = meta;\n const iAxis = iScale.axis;\n const vAxis = vScale.axis;\n const key = getStackKey(iScale, vScale, meta);\n const ilen = parsed.length;\n let stack;\n for (let i = 0; i < ilen; ++i) {\n const item = parsed[i];\n const {[iAxis]: index, [vAxis]: value} = item;\n const itemStacks = item._stacks || (item._stacks = {});\n stack = itemStacks[vAxis] = getOrCreateStack(stacks, key, index);\n stack[datasetIndex] = value;\n stack._top = getLastIndexInStack(stack, vScale, true, meta.type);\n stack._bottom = getLastIndexInStack(stack, vScale, false, meta.type);\n }\n}\nfunction getFirstScaleId(chart, axis) {\n const scales = chart.scales;\n return Object.keys(scales).filter(key => scales[key].axis === axis).shift();\n}\nfunction createDatasetContext(parent, index) {\n return createContext(parent,\n {\n active: false,\n dataset: undefined,\n datasetIndex: index,\n index,\n mode: 'default',\n type: 'dataset'\n }\n );\n}\nfunction createDataContext(parent, index, element) {\n return createContext(parent, {\n active: false,\n dataIndex: index,\n parsed: undefined,\n raw: undefined,\n element,\n index,\n mode: 'default',\n type: 'data'\n });\n}\nfunction clearStacks(meta, items) {\n const datasetIndex = meta.controller.index;\n const axis = meta.vScale && meta.vScale.axis;\n if (!axis) {\n return;\n }\n items = items || meta._parsed;\n for (const parsed of items) {\n const stacks = parsed._stacks;\n if (!stacks || stacks[axis] === undefined || stacks[axis][datasetIndex] === undefined) {\n return;\n }\n delete stacks[axis][datasetIndex];\n }\n}\nconst isDirectUpdateMode = (mode) => mode === 'reset' || mode === 'none';\nconst cloneIfNotShared = (cached, shared) => shared ? cached : Object.assign({}, cached);\nconst createStack = (canStack, meta, chart) => canStack && !meta.hidden && meta._stacked\n && {keys: getSortedDatasetIndices(chart, true), values: null};\nclass DatasetController {\n constructor(chart, datasetIndex) {\n this.chart = chart;\n this._ctx = chart.ctx;\n this.index = datasetIndex;\n this._cachedDataOpts = {};\n this._cachedMeta = this.getMeta();\n this._type = this._cachedMeta.type;\n this.options = undefined;\n this._parsing = false;\n this._data = undefined;\n this._objectData = undefined;\n this._sharedOptions = undefined;\n this._drawStart = undefined;\n this._drawCount = undefined;\n this.enableOptionSharing = false;\n this.supportsDecimation = false;\n this.$context = undefined;\n this._syncList = [];\n this.initialize();\n }\n initialize() {\n const meta = this._cachedMeta;\n this.configure();\n this.linkScales();\n meta._stacked = isStacked(meta.vScale, meta);\n this.addElements();\n }\n updateIndex(datasetIndex) {\n if (this.index !== datasetIndex) {\n clearStacks(this._cachedMeta);\n }\n this.index = datasetIndex;\n }\n linkScales() {\n const chart = this.chart;\n const meta = this._cachedMeta;\n const dataset = this.getDataset();\n const chooseId = (axis, x, y, r) => axis === 'x' ? x : axis === 'r' ? r : y;\n const xid = meta.xAxisID = valueOrDefault(dataset.xAxisID, getFirstScaleId(chart, 'x'));\n const yid = meta.yAxisID = valueOrDefault(dataset.yAxisID, getFirstScaleId(chart, 'y'));\n const rid = meta.rAxisID = valueOrDefault(dataset.rAxisID, getFirstScaleId(chart, 'r'));\n const indexAxis = meta.indexAxis;\n const iid = meta.iAxisID = chooseId(indexAxis, xid, yid, rid);\n const vid = meta.vAxisID = chooseId(indexAxis, yid, xid, rid);\n meta.xScale = this.getScaleForId(xid);\n meta.yScale = this.getScaleForId(yid);\n meta.rScale = this.getScaleForId(rid);\n meta.iScale = this.getScaleForId(iid);\n meta.vScale = this.getScaleForId(vid);\n }\n getDataset() {\n return this.chart.data.datasets[this.index];\n }\n getMeta() {\n return this.chart.getDatasetMeta(this.index);\n }\n getScaleForId(scaleID) {\n return this.chart.scales[scaleID];\n }\n _getOtherScale(scale) {\n const meta = this._cachedMeta;\n return scale === meta.iScale\n ? meta.vScale\n : meta.iScale;\n }\n reset() {\n this._update('reset');\n }\n _destroy() {\n const meta = this._cachedMeta;\n if (this._data) {\n unlistenArrayEvents(this._data, this);\n }\n if (meta._stacked) {\n clearStacks(meta);\n }\n }\n _dataCheck() {\n const dataset = this.getDataset();\n const data = dataset.data || (dataset.data = []);\n const _data = this._data;\n if (isObject(data)) {\n this._data = convertObjectDataToArray(data);\n } else if (_data !== data) {\n if (_data) {\n unlistenArrayEvents(_data, this);\n const meta = this._cachedMeta;\n clearStacks(meta);\n meta._parsed = [];\n }\n if (data && Object.isExtensible(data)) {\n listenArrayEvents(data, this);\n }\n this._syncList = [];\n this._data = data;\n }\n }\n addElements() {\n const meta = this._cachedMeta;\n this._dataCheck();\n if (this.datasetElementType) {\n meta.dataset = new this.datasetElementType();\n }\n }\n buildOrUpdateElements(resetNewElements) {\n const meta = this._cachedMeta;\n const dataset = this.getDataset();\n let stackChanged = false;\n this._dataCheck();\n const oldStacked = meta._stacked;\n meta._stacked = isStacked(meta.vScale, meta);\n if (meta.stack !== dataset.stack) {\n stackChanged = true;\n clearStacks(meta);\n meta.stack = dataset.stack;\n }\n this._resyncElements(resetNewElements);\n if (stackChanged || oldStacked !== meta._stacked) {\n updateStacks(this, meta._parsed);\n }\n }\n configure() {\n const config = this.chart.config;\n const scopeKeys = config.datasetScopeKeys(this._type);\n const scopes = config.getOptionScopes(this.getDataset(), scopeKeys, true);\n this.options = config.createResolver(scopes, this.getContext());\n this._parsing = this.options.parsing;\n this._cachedDataOpts = {};\n }\n parse(start, count) {\n const {_cachedMeta: meta, _data: data} = this;\n const {iScale, _stacked} = meta;\n const iAxis = iScale.axis;\n let sorted = start === 0 && count === data.length ? true : meta._sorted;\n let prev = start > 0 && meta._parsed[start - 1];\n let i, cur, parsed;\n if (this._parsing === false) {\n meta._parsed = data;\n meta._sorted = true;\n parsed = data;\n } else {\n if (isArray(data[start])) {\n parsed = this.parseArrayData(meta, data, start, count);\n } else if (isObject(data[start])) {\n parsed = this.parseObjectData(meta, data, start, count);\n } else {\n parsed = this.parsePrimitiveData(meta, data, start, count);\n }\n const isNotInOrderComparedToPrev = () => cur[iAxis] === null || (prev && cur[iAxis] < prev[iAxis]);\n for (i = 0; i < count; ++i) {\n meta._parsed[i + start] = cur = parsed[i];\n if (sorted) {\n if (isNotInOrderComparedToPrev()) {\n sorted = false;\n }\n prev = cur;\n }\n }\n meta._sorted = sorted;\n }\n if (_stacked) {\n updateStacks(this, parsed);\n }\n }\n parsePrimitiveData(meta, data, start, count) {\n const {iScale, vScale} = meta;\n const iAxis = iScale.axis;\n const vAxis = vScale.axis;\n const labels = iScale.getLabels();\n const singleScale = iScale === vScale;\n const parsed = new Array(count);\n let i, ilen, index;\n for (i = 0, ilen = count; i < ilen; ++i) {\n index = i + start;\n parsed[i] = {\n [iAxis]: singleScale || iScale.parse(labels[index], index),\n [vAxis]: vScale.parse(data[index], index)\n };\n }\n return parsed;\n }\n parseArrayData(meta, data, start, count) {\n const {xScale, yScale} = meta;\n const parsed = new Array(count);\n let i, ilen, index, item;\n for (i = 0, ilen = count; i < ilen; ++i) {\n index = i + start;\n item = data[index];\n parsed[i] = {\n x: xScale.parse(item[0], index),\n y: yScale.parse(item[1], index)\n };\n }\n return parsed;\n }\n parseObjectData(meta, data, start, count) {\n const {xScale, yScale} = meta;\n const {xAxisKey = 'x', yAxisKey = 'y'} = this._parsing;\n const parsed = new Array(count);\n let i, ilen, index, item;\n for (i = 0, ilen = count; i < ilen; ++i) {\n index = i + start;\n item = data[index];\n parsed[i] = {\n x: xScale.parse(resolveObjectKey(item, xAxisKey), index),\n y: yScale.parse(resolveObjectKey(item, yAxisKey), index)\n };\n }\n return parsed;\n }\n getParsed(index) {\n return this._cachedMeta._parsed[index];\n }\n getDataElement(index) {\n return this._cachedMeta.data[index];\n }\n applyStack(scale, parsed, mode) {\n const chart = this.chart;\n const meta = this._cachedMeta;\n const value = parsed[scale.axis];\n const stack = {\n keys: getSortedDatasetIndices(chart, true),\n values: parsed._stacks[scale.axis]\n };\n return applyStack(stack, value, meta.index, {mode});\n }\n updateRangeFromParsed(range, scale, parsed, stack) {\n const parsedValue = parsed[scale.axis];\n let value = parsedValue === null ? NaN : parsedValue;\n const values = stack && parsed._stacks[scale.axis];\n if (stack && values) {\n stack.values = values;\n value = applyStack(stack, parsedValue, this._cachedMeta.index);\n }\n range.min = Math.min(range.min, value);\n range.max = Math.max(range.max, value);\n }\n getMinMax(scale, canStack) {\n const meta = this._cachedMeta;\n const _parsed = meta._parsed;\n const sorted = meta._sorted && scale === meta.iScale;\n const ilen = _parsed.length;\n const otherScale = this._getOtherScale(scale);\n const stack = createStack(canStack, meta, this.chart);\n const range = {min: Number.POSITIVE_INFINITY, max: Number.NEGATIVE_INFINITY};\n const {min: otherMin, max: otherMax} = getUserBounds(otherScale);\n let i, parsed;\n function _skip() {\n parsed = _parsed[i];\n const otherValue = parsed[otherScale.axis];\n return !isNumberFinite(parsed[scale.axis]) || otherMin > otherValue || otherMax < otherValue;\n }\n for (i = 0; i < ilen; ++i) {\n if (_skip()) {\n continue;\n }\n this.updateRangeFromParsed(range, scale, parsed, stack);\n if (sorted) {\n break;\n }\n }\n if (sorted) {\n for (i = ilen - 1; i >= 0; --i) {\n if (_skip()) {\n continue;\n }\n this.updateRangeFromParsed(range, scale, parsed, stack);\n break;\n }\n }\n return range;\n }\n getAllParsedValues(scale) {\n const parsed = this._cachedMeta._parsed;\n const values = [];\n let i, ilen, value;\n for (i = 0, ilen = parsed.length; i < ilen; ++i) {\n value = parsed[i][scale.axis];\n if (isNumberFinite(value)) {\n values.push(value);\n }\n }\n return values;\n }\n getMaxOverflow() {\n return false;\n }\n getLabelAndValue(index) {\n const meta = this._cachedMeta;\n const iScale = meta.iScale;\n const vScale = meta.vScale;\n const parsed = this.getParsed(index);\n return {\n label: iScale ? '' + iScale.getLabelForValue(parsed[iScale.axis]) : '',\n value: vScale ? '' + vScale.getLabelForValue(parsed[vScale.axis]) : ''\n };\n }\n _update(mode) {\n const meta = this._cachedMeta;\n this.update(mode || 'default');\n meta._clip = toClip(valueOrDefault(this.options.clip, defaultClip(meta.xScale, meta.yScale, this.getMaxOverflow())));\n }\n update(mode) {}\n draw() {\n const ctx = this._ctx;\n const chart = this.chart;\n const meta = this._cachedMeta;\n const elements = meta.data || [];\n const area = chart.chartArea;\n const active = [];\n const start = this._drawStart || 0;\n const count = this._drawCount || (elements.length - start);\n const drawActiveElementsOnTop = this.options.drawActiveElementsOnTop;\n let i;\n if (meta.dataset) {\n meta.dataset.draw(ctx, area, start, count);\n }\n for (i = start; i < start + count; ++i) {\n const element = elements[i];\n if (element.hidden) {\n continue;\n }\n if (element.active && drawActiveElementsOnTop) {\n active.push(element);\n } else {\n element.draw(ctx, area);\n }\n }\n for (i = 0; i < active.length; ++i) {\n active[i].draw(ctx, area);\n }\n }\n getStyle(index, active) {\n const mode = active ? 'active' : 'default';\n return index === undefined && this._cachedMeta.dataset\n ? this.resolveDatasetElementOptions(mode)\n : this.resolveDataElementOptions(index || 0, mode);\n }\n getContext(index, active, mode) {\n const dataset = this.getDataset();\n let context;\n if (index >= 0 && index < this._cachedMeta.data.length) {\n const element = this._cachedMeta.data[index];\n context = element.$context ||\n (element.$context = createDataContext(this.getContext(), index, element));\n context.parsed = this.getParsed(index);\n context.raw = dataset.data[index];\n context.index = context.dataIndex = index;\n } else {\n context = this.$context ||\n (this.$context = createDatasetContext(this.chart.getContext(), this.index));\n context.dataset = dataset;\n context.index = context.datasetIndex = this.index;\n }\n context.active = !!active;\n context.mode = mode;\n return context;\n }\n resolveDatasetElementOptions(mode) {\n return this._resolveElementOptions(this.datasetElementType.id, mode);\n }\n resolveDataElementOptions(index, mode) {\n return this._resolveElementOptions(this.dataElementType.id, mode, index);\n }\n _resolveElementOptions(elementType, mode = 'default', index) {\n const active = mode === 'active';\n const cache = this._cachedDataOpts;\n const cacheKey = elementType + '-' + mode;\n const cached = cache[cacheKey];\n const sharing = this.enableOptionSharing && defined(index);\n if (cached) {\n return cloneIfNotShared(cached, sharing);\n }\n const config = this.chart.config;\n const scopeKeys = config.datasetElementScopeKeys(this._type, elementType);\n const prefixes = active ? [`${elementType}Hover`, 'hover', elementType, ''] : [elementType, ''];\n const scopes = config.getOptionScopes(this.getDataset(), scopeKeys);\n const names = Object.keys(defaults.elements[elementType]);\n const context = () => this.getContext(index, active);\n const values = config.resolveNamedOptions(scopes, names, context, prefixes);\n if (values.$shared) {\n values.$shared = sharing;\n cache[cacheKey] = Object.freeze(cloneIfNotShared(values, sharing));\n }\n return values;\n }\n _resolveAnimations(index, transition, active) {\n const chart = this.chart;\n const cache = this._cachedDataOpts;\n const cacheKey = `animation-${transition}`;\n const cached = cache[cacheKey];\n if (cached) {\n return cached;\n }\n let options;\n if (chart.options.animation !== false) {\n const config = this.chart.config;\n const scopeKeys = config.datasetAnimationScopeKeys(this._type, transition);\n const scopes = config.getOptionScopes(this.getDataset(), scopeKeys);\n options = config.createResolver(scopes, this.getContext(index, active, transition));\n }\n const animations = new Animations(chart, options && options.animations);\n if (options && options._cacheable) {\n cache[cacheKey] = Object.freeze(animations);\n }\n return animations;\n }\n getSharedOptions(options) {\n if (!options.$shared) {\n return;\n }\n return this._sharedOptions || (this._sharedOptions = Object.assign({}, options));\n }\n includeOptions(mode, sharedOptions) {\n return !sharedOptions || isDirectUpdateMode(mode) || this.chart._animationsDisabled;\n }\n _getSharedOptions(start, mode) {\n const firstOpts = this.resolveDataElementOptions(start, mode);\n const previouslySharedOptions = this._sharedOptions;\n const sharedOptions = this.getSharedOptions(firstOpts);\n const includeOptions = this.includeOptions(mode, sharedOptions) || (sharedOptions !== previouslySharedOptions);\n this.updateSharedOptions(sharedOptions, mode, firstOpts);\n return {sharedOptions, includeOptions};\n }\n updateElement(element, index, properties, mode) {\n if (isDirectUpdateMode(mode)) {\n Object.assign(element, properties);\n } else {\n this._resolveAnimations(index, mode).update(element, properties);\n }\n }\n updateSharedOptions(sharedOptions, mode, newOptions) {\n if (sharedOptions && !isDirectUpdateMode(mode)) {\n this._resolveAnimations(undefined, mode).update(sharedOptions, newOptions);\n }\n }\n _setStyle(element, index, mode, active) {\n element.active = active;\n const options = this.getStyle(index, active);\n this._resolveAnimations(index, mode, active).update(element, {\n options: (!active && this.getSharedOptions(options)) || options\n });\n }\n removeHoverStyle(element, datasetIndex, index) {\n this._setStyle(element, index, 'active', false);\n }\n setHoverStyle(element, datasetIndex, index) {\n this._setStyle(element, index, 'active', true);\n }\n _removeDatasetHoverStyle() {\n const element = this._cachedMeta.dataset;\n if (element) {\n this._setStyle(element, undefined, 'active', false);\n }\n }\n _setDatasetHoverStyle() {\n const element = this._cachedMeta.dataset;\n if (element) {\n this._setStyle(element, undefined, 'active', true);\n }\n }\n _resyncElements(resetNewElements) {\n const data = this._data;\n const elements = this._cachedMeta.data;\n for (const [method, arg1, arg2] of this._syncList) {\n this[method](arg1, arg2);\n }\n this._syncList = [];\n const numMeta = elements.length;\n const numData = data.length;\n const count = Math.min(numData, numMeta);\n if (count) {\n this.parse(0, count);\n }\n if (numData > numMeta) {\n this._insertElements(numMeta, numData - numMeta, resetNewElements);\n } else if (numData < numMeta) {\n this._removeElements(numData, numMeta - numData);\n }\n }\n _insertElements(start, count, resetNewElements = true) {\n const meta = this._cachedMeta;\n const data = meta.data;\n const end = start + count;\n let i;\n const move = (arr) => {\n arr.length += count;\n for (i = arr.length - 1; i >= end; i--) {\n arr[i] = arr[i - count];\n }\n };\n move(data);\n for (i = start; i < end; ++i) {\n data[i] = new this.dataElementType();\n }\n if (this._parsing) {\n move(meta._parsed);\n }\n this.parse(start, count);\n if (resetNewElements) {\n this.updateElements(data, start, count, 'reset');\n }\n }\n updateElements(element, start, count, mode) {}\n _removeElements(start, count) {\n const meta = this._cachedMeta;\n if (this._parsing) {\n const removed = meta._parsed.splice(start, count);\n if (meta._stacked) {\n clearStacks(meta, removed);\n }\n }\n meta.data.splice(start, count);\n }\n _sync(args) {\n if (this._parsing) {\n this._syncList.push(args);\n } else {\n const [method, arg1, arg2] = args;\n this[method](arg1, arg2);\n }\n this.chart._dataChanges.push([this.index, ...args]);\n }\n _onDataPush() {\n const count = arguments.length;\n this._sync(['_insertElements', this.getDataset().data.length - count, count]);\n }\n _onDataPop() {\n this._sync(['_removeElements', this._cachedMeta.data.length - 1, 1]);\n }\n _onDataShift() {\n this._sync(['_removeElements', 0, 1]);\n }\n _onDataSplice(start, count) {\n if (count) {\n this._sync(['_removeElements', start, count]);\n }\n const newCount = arguments.length - 2;\n if (newCount) {\n this._sync(['_insertElements', start, newCount]);\n }\n }\n _onDataUnshift() {\n this._sync(['_insertElements', 0, arguments.length]);\n }\n}\nDatasetController.defaults = {};\nDatasetController.prototype.datasetElementType = null;\nDatasetController.prototype.dataElementType = null;\n\nfunction getAllScaleValues(scale, type) {\n if (!scale._cache.$bar) {\n const visibleMetas = scale.getMatchingVisibleMetas(type);\n let values = [];\n for (let i = 0, ilen = visibleMetas.length; i < ilen; i++) {\n values = values.concat(visibleMetas[i].controller.getAllParsedValues(scale));\n }\n scale._cache.$bar = _arrayUnique(values.sort((a, b) => a - b));\n }\n return scale._cache.$bar;\n}\nfunction computeMinSampleSize(meta) {\n const scale = meta.iScale;\n const values = getAllScaleValues(scale, meta.type);\n let min = scale._length;\n let i, ilen, curr, prev;\n const updateMinAndPrev = () => {\n if (curr === 32767 || curr === -32768) {\n return;\n }\n if (defined(prev)) {\n min = Math.min(min, Math.abs(curr - prev) || min);\n }\n prev = curr;\n };\n for (i = 0, ilen = values.length; i < ilen; ++i) {\n curr = scale.getPixelForValue(values[i]);\n updateMinAndPrev();\n }\n prev = undefined;\n for (i = 0, ilen = scale.ticks.length; i < ilen; ++i) {\n curr = scale.getPixelForTick(i);\n updateMinAndPrev();\n }\n return min;\n}\nfunction computeFitCategoryTraits(index, ruler, options, stackCount) {\n const thickness = options.barThickness;\n let size, ratio;\n if (isNullOrUndef(thickness)) {\n size = ruler.min * options.categoryPercentage;\n ratio = options.barPercentage;\n } else {\n size = thickness * stackCount;\n ratio = 1;\n }\n return {\n chunk: size / stackCount,\n ratio,\n start: ruler.pixels[index] - (size / 2)\n };\n}\nfunction computeFlexCategoryTraits(index, ruler, options, stackCount) {\n const pixels = ruler.pixels;\n const curr = pixels[index];\n let prev = index > 0 ? pixels[index - 1] : null;\n let next = index < pixels.length - 1 ? pixels[index + 1] : null;\n const percent = options.categoryPercentage;\n if (prev === null) {\n prev = curr - (next === null ? ruler.end - ruler.start : next - curr);\n }\n if (next === null) {\n next = curr + curr - prev;\n }\n const start = curr - (curr - Math.min(prev, next)) / 2 * percent;\n const size = Math.abs(next - prev) / 2 * percent;\n return {\n chunk: size / stackCount,\n ratio: options.barPercentage,\n start\n };\n}\nfunction parseFloatBar(entry, item, vScale, i) {\n const startValue = vScale.parse(entry[0], i);\n const endValue = vScale.parse(entry[1], i);\n const min = Math.min(startValue, endValue);\n const max = Math.max(startValue, endValue);\n let barStart = min;\n let barEnd = max;\n if (Math.abs(min) > Math.abs(max)) {\n barStart = max;\n barEnd = min;\n }\n item[vScale.axis] = barEnd;\n item._custom = {\n barStart,\n barEnd,\n start: startValue,\n end: endValue,\n min,\n max\n };\n}\nfunction parseValue(entry, item, vScale, i) {\n if (isArray(entry)) {\n parseFloatBar(entry, item, vScale, i);\n } else {\n item[vScale.axis] = vScale.parse(entry, i);\n }\n return item;\n}\nfunction parseArrayOrPrimitive(meta, data, start, count) {\n const iScale = meta.iScale;\n const vScale = meta.vScale;\n const labels = iScale.getLabels();\n const singleScale = iScale === vScale;\n const parsed = [];\n let i, ilen, item, entry;\n for (i = start, ilen = start + count; i < ilen; ++i) {\n entry = data[i];\n item = {};\n item[iScale.axis] = singleScale || iScale.parse(labels[i], i);\n parsed.push(parseValue(entry, item, vScale, i));\n }\n return parsed;\n}\nfunction isFloatBar(custom) {\n return custom && custom.barStart !== undefined && custom.barEnd !== undefined;\n}\nfunction barSign(size, vScale, actualBase) {\n if (size !== 0) {\n return sign(size);\n }\n return (vScale.isHorizontal() ? 1 : -1) * (vScale.min >= actualBase ? 1 : -1);\n}\nfunction borderProps(properties) {\n let reverse, start, end, top, bottom;\n if (properties.horizontal) {\n reverse = properties.base > properties.x;\n start = 'left';\n end = 'right';\n } else {\n reverse = properties.base < properties.y;\n start = 'bottom';\n end = 'top';\n }\n if (reverse) {\n top = 'end';\n bottom = 'start';\n } else {\n top = 'start';\n bottom = 'end';\n }\n return {start, end, reverse, top, bottom};\n}\nfunction setBorderSkipped(properties, options, stack, index) {\n let edge = options.borderSkipped;\n const res = {};\n if (!edge) {\n properties.borderSkipped = res;\n return;\n }\n if (edge === true) {\n properties.borderSkipped = {top: true, right: true, bottom: true, left: true};\n return;\n }\n const {start, end, reverse, top, bottom} = borderProps(properties);\n if (edge === 'middle' && stack) {\n properties.enableBorderRadius = true;\n if ((stack._top || 0) === index) {\n edge = top;\n } else if ((stack._bottom || 0) === index) {\n edge = bottom;\n } else {\n res[parseEdge(bottom, start, end, reverse)] = true;\n edge = top;\n }\n }\n res[parseEdge(edge, start, end, reverse)] = true;\n properties.borderSkipped = res;\n}\nfunction parseEdge(edge, a, b, reverse) {\n if (reverse) {\n edge = swap(edge, a, b);\n edge = startEnd(edge, b, a);\n } else {\n edge = startEnd(edge, a, b);\n }\n return edge;\n}\nfunction swap(orig, v1, v2) {\n return orig === v1 ? v2 : orig === v2 ? v1 : orig;\n}\nfunction startEnd(v, start, end) {\n return v === 'start' ? start : v === 'end' ? end : v;\n}\nfunction setInflateAmount(properties, {inflateAmount}, ratio) {\n properties.inflateAmount = inflateAmount === 'auto'\n ? ratio === 1 ? 0.33 : 0\n : inflateAmount;\n}\nclass BarController extends DatasetController {\n parsePrimitiveData(meta, data, start, count) {\n return parseArrayOrPrimitive(meta, data, start, count);\n }\n parseArrayData(meta, data, start, count) {\n return parseArrayOrPrimitive(meta, data, start, count);\n }\n parseObjectData(meta, data, start, count) {\n const {iScale, vScale} = meta;\n const {xAxisKey = 'x', yAxisKey = 'y'} = this._parsing;\n const iAxisKey = iScale.axis === 'x' ? xAxisKey : yAxisKey;\n const vAxisKey = vScale.axis === 'x' ? xAxisKey : yAxisKey;\n const parsed = [];\n let i, ilen, item, obj;\n for (i = start, ilen = start + count; i < ilen; ++i) {\n obj = data[i];\n item = {};\n item[iScale.axis] = iScale.parse(resolveObjectKey(obj, iAxisKey), i);\n parsed.push(parseValue(resolveObjectKey(obj, vAxisKey), item, vScale, i));\n }\n return parsed;\n }\n updateRangeFromParsed(range, scale, parsed, stack) {\n super.updateRangeFromParsed(range, scale, parsed, stack);\n const custom = parsed._custom;\n if (custom && scale === this._cachedMeta.vScale) {\n range.min = Math.min(range.min, custom.min);\n range.max = Math.max(range.max, custom.max);\n }\n }\n getMaxOverflow() {\n return 0;\n }\n getLabelAndValue(index) {\n const meta = this._cachedMeta;\n const {iScale, vScale} = meta;\n const parsed = this.getParsed(index);\n const custom = parsed._custom;\n const value = isFloatBar(custom)\n ? '[' + custom.start + ', ' + custom.end + ']'\n : '' + vScale.getLabelForValue(parsed[vScale.axis]);\n return {\n label: '' + iScale.getLabelForValue(parsed[iScale.axis]),\n value\n };\n }\n initialize() {\n this.enableOptionSharing = true;\n super.initialize();\n const meta = this._cachedMeta;\n meta.stack = this.getDataset().stack;\n }\n update(mode) {\n const meta = this._cachedMeta;\n this.updateElements(meta.data, 0, meta.data.length, mode);\n }\n updateElements(bars, start, count, mode) {\n const reset = mode === 'reset';\n const {index, _cachedMeta: {vScale}} = this;\n const base = vScale.getBasePixel();\n const horizontal = vScale.isHorizontal();\n const ruler = this._getRuler();\n const {sharedOptions, includeOptions} = this._getSharedOptions(start, mode);\n for (let i = start; i < start + count; i++) {\n const parsed = this.getParsed(i);\n const vpixels = reset || isNullOrUndef(parsed[vScale.axis]) ? {base, head: base} : this._calculateBarValuePixels(i);\n const ipixels = this._calculateBarIndexPixels(i, ruler);\n const stack = (parsed._stacks || {})[vScale.axis];\n const properties = {\n horizontal,\n base: vpixels.base,\n enableBorderRadius: !stack || isFloatBar(parsed._custom) || (index === stack._top || index === stack._bottom),\n x: horizontal ? vpixels.head : ipixels.center,\n y: horizontal ? ipixels.center : vpixels.head,\n height: horizontal ? ipixels.size : Math.abs(vpixels.size),\n width: horizontal ? Math.abs(vpixels.size) : ipixels.size\n };\n if (includeOptions) {\n properties.options = sharedOptions || this.resolveDataElementOptions(i, bars[i].active ? 'active' : mode);\n }\n const options = properties.options || bars[i].options;\n setBorderSkipped(properties, options, stack, index);\n setInflateAmount(properties, options, ruler.ratio);\n this.updateElement(bars[i], i, properties, mode);\n }\n }\n _getStacks(last, dataIndex) {\n const {iScale} = this._cachedMeta;\n const metasets = iScale.getMatchingVisibleMetas(this._type)\n .filter(meta => meta.controller.options.grouped);\n const stacked = iScale.options.stacked;\n const stacks = [];\n const skipNull = (meta) => {\n const parsed = meta.controller.getParsed(dataIndex);\n const val = parsed && parsed[meta.vScale.axis];\n if (isNullOrUndef(val) || isNaN(val)) {\n return true;\n }\n };\n for (const meta of metasets) {\n if (dataIndex !== undefined && skipNull(meta)) {\n continue;\n }\n if (stacked === false || stacks.indexOf(meta.stack) === -1 ||\n\t\t\t\t(stacked === undefined && meta.stack === undefined)) {\n stacks.push(meta.stack);\n }\n if (meta.index === last) {\n break;\n }\n }\n if (!stacks.length) {\n stacks.push(undefined);\n }\n return stacks;\n }\n _getStackCount(index) {\n return this._getStacks(undefined, index).length;\n }\n _getStackIndex(datasetIndex, name, dataIndex) {\n const stacks = this._getStacks(datasetIndex, dataIndex);\n const index = (name !== undefined)\n ? stacks.indexOf(name)\n : -1;\n return (index === -1)\n ? stacks.length - 1\n : index;\n }\n _getRuler() {\n const opts = this.options;\n const meta = this._cachedMeta;\n const iScale = meta.iScale;\n const pixels = [];\n let i, ilen;\n for (i = 0, ilen = meta.data.length; i < ilen; ++i) {\n pixels.push(iScale.getPixelForValue(this.getParsed(i)[iScale.axis], i));\n }\n const barThickness = opts.barThickness;\n const min = barThickness || computeMinSampleSize(meta);\n return {\n min,\n pixels,\n start: iScale._startPixel,\n end: iScale._endPixel,\n stackCount: this._getStackCount(),\n scale: iScale,\n grouped: opts.grouped,\n ratio: barThickness ? 1 : opts.categoryPercentage * opts.barPercentage\n };\n }\n _calculateBarValuePixels(index) {\n const {_cachedMeta: {vScale, _stacked}, options: {base: baseValue, minBarLength}} = this;\n const actualBase = baseValue || 0;\n const parsed = this.getParsed(index);\n const custom = parsed._custom;\n const floating = isFloatBar(custom);\n let value = parsed[vScale.axis];\n let start = 0;\n let length = _stacked ? this.applyStack(vScale, parsed, _stacked) : value;\n let head, size;\n if (length !== value) {\n start = length - value;\n length = value;\n }\n if (floating) {\n value = custom.barStart;\n length = custom.barEnd - custom.barStart;\n if (value !== 0 && sign(value) !== sign(custom.barEnd)) {\n start = 0;\n }\n start += value;\n }\n const startValue = !isNullOrUndef(baseValue) && !floating ? baseValue : start;\n let base = vScale.getPixelForValue(startValue);\n if (this.chart.getDataVisibility(index)) {\n head = vScale.getPixelForValue(start + length);\n } else {\n head = base;\n }\n size = head - base;\n if (Math.abs(size) < minBarLength) {\n size = barSign(size, vScale, actualBase) * minBarLength;\n if (value === actualBase) {\n base -= size / 2;\n }\n const startPixel = vScale.getPixelForDecimal(0);\n const endPixel = vScale.getPixelForDecimal(1);\n const min = Math.min(startPixel, endPixel);\n const max = Math.max(startPixel, endPixel);\n base = Math.max(Math.min(base, max), min);\n head = base + size;\n }\n if (base === vScale.getPixelForValue(actualBase)) {\n const halfGrid = sign(size) * vScale.getLineWidthForValue(actualBase) / 2;\n base += halfGrid;\n size -= halfGrid;\n }\n return {\n size,\n base,\n head,\n center: head + size / 2\n };\n }\n _calculateBarIndexPixels(index, ruler) {\n const scale = ruler.scale;\n const options = this.options;\n const skipNull = options.skipNull;\n const maxBarThickness = valueOrDefault(options.maxBarThickness, Infinity);\n let center, size;\n if (ruler.grouped) {\n const stackCount = skipNull ? this._getStackCount(index) : ruler.stackCount;\n const range = options.barThickness === 'flex'\n ? computeFlexCategoryTraits(index, ruler, options, stackCount)\n : computeFitCategoryTraits(index, ruler, options, stackCount);\n const stackIndex = this._getStackIndex(this.index, this._cachedMeta.stack, skipNull ? index : undefined);\n center = range.start + (range.chunk * stackIndex) + (range.chunk / 2);\n size = Math.min(maxBarThickness, range.chunk * range.ratio);\n } else {\n center = scale.getPixelForValue(this.getParsed(index)[scale.axis], index);\n size = Math.min(maxBarThickness, ruler.min * ruler.ratio);\n }\n return {\n base: center - size / 2,\n head: center + size / 2,\n center,\n size\n };\n }\n draw() {\n const meta = this._cachedMeta;\n const vScale = meta.vScale;\n const rects = meta.data;\n const ilen = rects.length;\n let i = 0;\n for (; i < ilen; ++i) {\n if (this.getParsed(i)[vScale.axis] !== null) {\n rects[i].draw(this._ctx);\n }\n }\n }\n}\nBarController.id = 'bar';\nBarController.defaults = {\n datasetElementType: false,\n dataElementType: 'bar',\n categoryPercentage: 0.8,\n barPercentage: 0.9,\n grouped: true,\n animations: {\n numbers: {\n type: 'number',\n properties: ['x', 'y', 'base', 'width', 'height']\n }\n }\n};\nBarController.overrides = {\n scales: {\n _index_: {\n type: 'category',\n offset: true,\n grid: {\n offset: true\n }\n },\n _value_: {\n type: 'linear',\n beginAtZero: true,\n }\n }\n};\n\nclass BubbleController extends DatasetController {\n initialize() {\n this.enableOptionSharing = true;\n super.initialize();\n }\n parsePrimitiveData(meta, data, start, count) {\n const parsed = super.parsePrimitiveData(meta, data, start, count);\n for (let i = 0; i < parsed.length; i++) {\n parsed[i]._custom = this.resolveDataElementOptions(i + start).radius;\n }\n return parsed;\n }\n parseArrayData(meta, data, start, count) {\n const parsed = super.parseArrayData(meta, data, start, count);\n for (let i = 0; i < parsed.length; i++) {\n const item = data[start + i];\n parsed[i]._custom = valueOrDefault(item[2], this.resolveDataElementOptions(i + start).radius);\n }\n return parsed;\n }\n parseObjectData(meta, data, start, count) {\n const parsed = super.parseObjectData(meta, data, start, count);\n for (let i = 0; i < parsed.length; i++) {\n const item = data[start + i];\n parsed[i]._custom = valueOrDefault(item && item.r && +item.r, this.resolveDataElementOptions(i + start).radius);\n }\n return parsed;\n }\n getMaxOverflow() {\n const data = this._cachedMeta.data;\n let max = 0;\n for (let i = data.length - 1; i >= 0; --i) {\n max = Math.max(max, data[i].size(this.resolveDataElementOptions(i)) / 2);\n }\n return max > 0 && max;\n }\n getLabelAndValue(index) {\n const meta = this._cachedMeta;\n const {xScale, yScale} = meta;\n const parsed = this.getParsed(index);\n const x = xScale.getLabelForValue(parsed.x);\n const y = yScale.getLabelForValue(parsed.y);\n const r = parsed._custom;\n return {\n label: meta.label,\n value: '(' + x + ', ' + y + (r ? ', ' + r : '') + ')'\n };\n }\n update(mode) {\n const points = this._cachedMeta.data;\n this.updateElements(points, 0, points.length, mode);\n }\n updateElements(points, start, count, mode) {\n const reset = mode === 'reset';\n const {iScale, vScale} = this._cachedMeta;\n const {sharedOptions, includeOptions} = this._getSharedOptions(start, mode);\n const iAxis = iScale.axis;\n const vAxis = vScale.axis;\n for (let i = start; i < start + count; i++) {\n const point = points[i];\n const parsed = !reset && this.getParsed(i);\n const properties = {};\n const iPixel = properties[iAxis] = reset ? iScale.getPixelForDecimal(0.5) : iScale.getPixelForValue(parsed[iAxis]);\n const vPixel = properties[vAxis] = reset ? vScale.getBasePixel() : vScale.getPixelForValue(parsed[vAxis]);\n properties.skip = isNaN(iPixel) || isNaN(vPixel);\n if (includeOptions) {\n properties.options = sharedOptions || this.resolveDataElementOptions(i, point.active ? 'active' : mode);\n if (reset) {\n properties.options.radius = 0;\n }\n }\n this.updateElement(point, i, properties, mode);\n }\n }\n resolveDataElementOptions(index, mode) {\n const parsed = this.getParsed(index);\n let values = super.resolveDataElementOptions(index, mode);\n if (values.$shared) {\n values = Object.assign({}, values, {$shared: false});\n }\n const radius = values.radius;\n if (mode !== 'active') {\n values.radius = 0;\n }\n values.radius += valueOrDefault(parsed && parsed._custom, radius);\n return values;\n }\n}\nBubbleController.id = 'bubble';\nBubbleController.defaults = {\n datasetElementType: false,\n dataElementType: 'point',\n animations: {\n numbers: {\n type: 'number',\n properties: ['x', 'y', 'borderWidth', 'radius']\n }\n }\n};\nBubbleController.overrides = {\n scales: {\n x: {\n type: 'linear'\n },\n y: {\n type: 'linear'\n }\n },\n plugins: {\n tooltip: {\n callbacks: {\n title() {\n return '';\n }\n }\n }\n }\n};\n\nfunction getRatioAndOffset(rotation, circumference, cutout) {\n let ratioX = 1;\n let ratioY = 1;\n let offsetX = 0;\n let offsetY = 0;\n if (circumference < TAU) {\n const startAngle = rotation;\n const endAngle = startAngle + circumference;\n const startX = Math.cos(startAngle);\n const startY = Math.sin(startAngle);\n const endX = Math.cos(endAngle);\n const endY = Math.sin(endAngle);\n const calcMax = (angle, a, b) => _angleBetween(angle, startAngle, endAngle, true) ? 1 : Math.max(a, a * cutout, b, b * cutout);\n const calcMin = (angle, a, b) => _angleBetween(angle, startAngle, endAngle, true) ? -1 : Math.min(a, a * cutout, b, b * cutout);\n const maxX = calcMax(0, startX, endX);\n const maxY = calcMax(HALF_PI, startY, endY);\n const minX = calcMin(PI, startX, endX);\n const minY = calcMin(PI + HALF_PI, startY, endY);\n ratioX = (maxX - minX) / 2;\n ratioY = (maxY - minY) / 2;\n offsetX = -(maxX + minX) / 2;\n offsetY = -(maxY + minY) / 2;\n }\n return {ratioX, ratioY, offsetX, offsetY};\n}\nclass DoughnutController extends DatasetController {\n constructor(chart, datasetIndex) {\n super(chart, datasetIndex);\n this.enableOptionSharing = true;\n this.innerRadius = undefined;\n this.outerRadius = undefined;\n this.offsetX = undefined;\n this.offsetY = undefined;\n }\n linkScales() {}\n parse(start, count) {\n const data = this.getDataset().data;\n const meta = this._cachedMeta;\n if (this._parsing === false) {\n meta._parsed = data;\n } else {\n let getter = (i) => +data[i];\n if (isObject(data[start])) {\n const {key = 'value'} = this._parsing;\n getter = (i) => +resolveObjectKey(data[i], key);\n }\n let i, ilen;\n for (i = start, ilen = start + count; i < ilen; ++i) {\n meta._parsed[i] = getter(i);\n }\n }\n }\n _getRotation() {\n return toRadians(this.options.rotation - 90);\n }\n _getCircumference() {\n return toRadians(this.options.circumference);\n }\n _getRotationExtents() {\n let min = TAU;\n let max = -TAU;\n for (let i = 0; i < this.chart.data.datasets.length; ++i) {\n if (this.chart.isDatasetVisible(i)) {\n const controller = this.chart.getDatasetMeta(i).controller;\n const rotation = controller._getRotation();\n const circumference = controller._getCircumference();\n min = Math.min(min, rotation);\n max = Math.max(max, rotation + circumference);\n }\n }\n return {\n rotation: min,\n circumference: max - min,\n };\n }\n update(mode) {\n const chart = this.chart;\n const {chartArea} = chart;\n const meta = this._cachedMeta;\n const arcs = meta.data;\n const spacing = this.getMaxBorderWidth() + this.getMaxOffset(arcs) + this.options.spacing;\n const maxSize = Math.max((Math.min(chartArea.width, chartArea.height) - spacing) / 2, 0);\n const cutout = Math.min(toPercentage(this.options.cutout, maxSize), 1);\n const chartWeight = this._getRingWeight(this.index);\n const {circumference, rotation} = this._getRotationExtents();\n const {ratioX, ratioY, offsetX, offsetY} = getRatioAndOffset(rotation, circumference, cutout);\n const maxWidth = (chartArea.width - spacing) / ratioX;\n const maxHeight = (chartArea.height - spacing) / ratioY;\n const maxRadius = Math.max(Math.min(maxWidth, maxHeight) / 2, 0);\n const outerRadius = toDimension(this.options.radius, maxRadius);\n const innerRadius = Math.max(outerRadius * cutout, 0);\n const radiusLength = (outerRadius - innerRadius) / this._getVisibleDatasetWeightTotal();\n this.offsetX = offsetX * outerRadius;\n this.offsetY = offsetY * outerRadius;\n meta.total = this.calculateTotal();\n this.outerRadius = outerRadius - radiusLength * this._getRingWeightOffset(this.index);\n this.innerRadius = Math.max(this.outerRadius - radiusLength * chartWeight, 0);\n this.updateElements(arcs, 0, arcs.length, mode);\n }\n _circumference(i, reset) {\n const opts = this.options;\n const meta = this._cachedMeta;\n const circumference = this._getCircumference();\n if ((reset && opts.animation.animateRotate) || !this.chart.getDataVisibility(i) || meta._parsed[i] === null || meta.data[i].hidden) {\n return 0;\n }\n return this.calculateCircumference(meta._parsed[i] * circumference / TAU);\n }\n updateElements(arcs, start, count, mode) {\n const reset = mode === 'reset';\n const chart = this.chart;\n const chartArea = chart.chartArea;\n const opts = chart.options;\n const animationOpts = opts.animation;\n const centerX = (chartArea.left + chartArea.right) / 2;\n const centerY = (chartArea.top + chartArea.bottom) / 2;\n const animateScale = reset && animationOpts.animateScale;\n const innerRadius = animateScale ? 0 : this.innerRadius;\n const outerRadius = animateScale ? 0 : this.outerRadius;\n const {sharedOptions, includeOptions} = this._getSharedOptions(start, mode);\n let startAngle = this._getRotation();\n let i;\n for (i = 0; i < start; ++i) {\n startAngle += this._circumference(i, reset);\n }\n for (i = start; i < start + count; ++i) {\n const circumference = this._circumference(i, reset);\n const arc = arcs[i];\n const properties = {\n x: centerX + this.offsetX,\n y: centerY + this.offsetY,\n startAngle,\n endAngle: startAngle + circumference,\n circumference,\n outerRadius,\n innerRadius\n };\n if (includeOptions) {\n properties.options = sharedOptions || this.resolveDataElementOptions(i, arc.active ? 'active' : mode);\n }\n startAngle += circumference;\n this.updateElement(arc, i, properties, mode);\n }\n }\n calculateTotal() {\n const meta = this._cachedMeta;\n const metaData = meta.data;\n let total = 0;\n let i;\n for (i = 0; i < metaData.length; i++) {\n const value = meta._parsed[i];\n if (value !== null && !isNaN(value) && this.chart.getDataVisibility(i) && !metaData[i].hidden) {\n total += Math.abs(value);\n }\n }\n return total;\n }\n calculateCircumference(value) {\n const total = this._cachedMeta.total;\n if (total > 0 && !isNaN(value)) {\n return TAU * (Math.abs(value) / total);\n }\n return 0;\n }\n getLabelAndValue(index) {\n const meta = this._cachedMeta;\n const chart = this.chart;\n const labels = chart.data.labels || [];\n const value = formatNumber(meta._parsed[index], chart.options.locale);\n return {\n label: labels[index] || '',\n value,\n };\n }\n getMaxBorderWidth(arcs) {\n let max = 0;\n const chart = this.chart;\n let i, ilen, meta, controller, options;\n if (!arcs) {\n for (i = 0, ilen = chart.data.datasets.length; i < ilen; ++i) {\n if (chart.isDatasetVisible(i)) {\n meta = chart.getDatasetMeta(i);\n arcs = meta.data;\n controller = meta.controller;\n break;\n }\n }\n }\n if (!arcs) {\n return 0;\n }\n for (i = 0, ilen = arcs.length; i < ilen; ++i) {\n options = controller.resolveDataElementOptions(i);\n if (options.borderAlign !== 'inner') {\n max = Math.max(max, options.borderWidth || 0, options.hoverBorderWidth || 0);\n }\n }\n return max;\n }\n getMaxOffset(arcs) {\n let max = 0;\n for (let i = 0, ilen = arcs.length; i < ilen; ++i) {\n const options = this.resolveDataElementOptions(i);\n max = Math.max(max, options.offset || 0, options.hoverOffset || 0);\n }\n return max;\n }\n _getRingWeightOffset(datasetIndex) {\n let ringWeightOffset = 0;\n for (let i = 0; i < datasetIndex; ++i) {\n if (this.chart.isDatasetVisible(i)) {\n ringWeightOffset += this._getRingWeight(i);\n }\n }\n return ringWeightOffset;\n }\n _getRingWeight(datasetIndex) {\n return Math.max(valueOrDefault(this.chart.data.datasets[datasetIndex].weight, 1), 0);\n }\n _getVisibleDatasetWeightTotal() {\n return this._getRingWeightOffset(this.chart.data.datasets.length) || 1;\n }\n}\nDoughnutController.id = 'doughnut';\nDoughnutController.defaults = {\n datasetElementType: false,\n dataElementType: 'arc',\n animation: {\n animateRotate: true,\n animateScale: false\n },\n animations: {\n numbers: {\n type: 'number',\n properties: ['circumference', 'endAngle', 'innerRadius', 'outerRadius', 'startAngle', 'x', 'y', 'offset', 'borderWidth', 'spacing']\n },\n },\n cutout: '50%',\n rotation: 0,\n circumference: 360,\n radius: '100%',\n spacing: 0,\n indexAxis: 'r',\n};\nDoughnutController.descriptors = {\n _scriptable: (name) => name !== 'spacing',\n _indexable: (name) => name !== 'spacing',\n};\nDoughnutController.overrides = {\n aspectRatio: 1,\n plugins: {\n legend: {\n labels: {\n generateLabels(chart) {\n const data = chart.data;\n if (data.labels.length && data.datasets.length) {\n const {labels: {pointStyle}} = chart.legend.options;\n return data.labels.map((label, i) => {\n const meta = chart.getDatasetMeta(0);\n const style = meta.controller.getStyle(i);\n return {\n text: label,\n fillStyle: style.backgroundColor,\n strokeStyle: style.borderColor,\n lineWidth: style.borderWidth,\n pointStyle: pointStyle,\n hidden: !chart.getDataVisibility(i),\n index: i\n };\n });\n }\n return [];\n }\n },\n onClick(e, legendItem, legend) {\n legend.chart.toggleDataVisibility(legendItem.index);\n legend.chart.update();\n }\n },\n tooltip: {\n callbacks: {\n title() {\n return '';\n },\n label(tooltipItem) {\n let dataLabel = tooltipItem.label;\n const value = ': ' + tooltipItem.formattedValue;\n if (isArray(dataLabel)) {\n dataLabel = dataLabel.slice();\n dataLabel[0] += value;\n } else {\n dataLabel += value;\n }\n return dataLabel;\n }\n }\n }\n }\n};\n\nclass LineController extends DatasetController {\n initialize() {\n this.enableOptionSharing = true;\n this.supportsDecimation = true;\n super.initialize();\n }\n update(mode) {\n const meta = this._cachedMeta;\n const {dataset: line, data: points = [], _dataset} = meta;\n const animationsDisabled = this.chart._animationsDisabled;\n let {start, count} = _getStartAndCountOfVisiblePoints(meta, points, animationsDisabled);\n this._drawStart = start;\n this._drawCount = count;\n if (_scaleRangesChanged(meta)) {\n start = 0;\n count = points.length;\n }\n line._chart = this.chart;\n line._datasetIndex = this.index;\n line._decimated = !!_dataset._decimated;\n line.points = points;\n const options = this.resolveDatasetElementOptions(mode);\n if (!this.options.showLine) {\n options.borderWidth = 0;\n }\n options.segment = this.options.segment;\n this.updateElement(line, undefined, {\n animated: !animationsDisabled,\n options\n }, mode);\n this.updateElements(points, start, count, mode);\n }\n updateElements(points, start, count, mode) {\n const reset = mode === 'reset';\n const {iScale, vScale, _stacked, _dataset} = this._cachedMeta;\n const {sharedOptions, includeOptions} = this._getSharedOptions(start, mode);\n const iAxis = iScale.axis;\n const vAxis = vScale.axis;\n const {spanGaps, segment} = this.options;\n const maxGapLength = isNumber(spanGaps) ? spanGaps : Number.POSITIVE_INFINITY;\n const directUpdate = this.chart._animationsDisabled || reset || mode === 'none';\n let prevParsed = start > 0 && this.getParsed(start - 1);\n for (let i = start; i < start + count; ++i) {\n const point = points[i];\n const parsed = this.getParsed(i);\n const properties = directUpdate ? point : {};\n const nullData = isNullOrUndef(parsed[vAxis]);\n const iPixel = properties[iAxis] = iScale.getPixelForValue(parsed[iAxis], i);\n const vPixel = properties[vAxis] = reset || nullData ? vScale.getBasePixel() : vScale.getPixelForValue(_stacked ? this.applyStack(vScale, parsed, _stacked) : parsed[vAxis], i);\n properties.skip = isNaN(iPixel) || isNaN(vPixel) || nullData;\n properties.stop = i > 0 && (Math.abs(parsed[iAxis] - prevParsed[iAxis])) > maxGapLength;\n if (segment) {\n properties.parsed = parsed;\n properties.raw = _dataset.data[i];\n }\n if (includeOptions) {\n properties.options = sharedOptions || this.resolveDataElementOptions(i, point.active ? 'active' : mode);\n }\n if (!directUpdate) {\n this.updateElement(point, i, properties, mode);\n }\n prevParsed = parsed;\n }\n }\n getMaxOverflow() {\n const meta = this._cachedMeta;\n const dataset = meta.dataset;\n const border = dataset.options && dataset.options.borderWidth || 0;\n const data = meta.data || [];\n if (!data.length) {\n return border;\n }\n const firstPoint = data[0].size(this.resolveDataElementOptions(0));\n const lastPoint = data[data.length - 1].size(this.resolveDataElementOptions(data.length - 1));\n return Math.max(border, firstPoint, lastPoint) / 2;\n }\n draw() {\n const meta = this._cachedMeta;\n meta.dataset.updateControlPoints(this.chart.chartArea, meta.iScale.axis);\n super.draw();\n }\n}\nLineController.id = 'line';\nLineController.defaults = {\n datasetElementType: 'line',\n dataElementType: 'point',\n showLine: true,\n spanGaps: false,\n};\nLineController.overrides = {\n scales: {\n _index_: {\n type: 'category',\n },\n _value_: {\n type: 'linear',\n },\n }\n};\n\nclass PolarAreaController extends DatasetController {\n constructor(chart, datasetIndex) {\n super(chart, datasetIndex);\n this.innerRadius = undefined;\n this.outerRadius = undefined;\n }\n getLabelAndValue(index) {\n const meta = this._cachedMeta;\n const chart = this.chart;\n const labels = chart.data.labels || [];\n const value = formatNumber(meta._parsed[index].r, chart.options.locale);\n return {\n label: labels[index] || '',\n value,\n };\n }\n parseObjectData(meta, data, start, count) {\n return _parseObjectDataRadialScale.bind(this)(meta, data, start, count);\n }\n update(mode) {\n const arcs = this._cachedMeta.data;\n this._updateRadius();\n this.updateElements(arcs, 0, arcs.length, mode);\n }\n getMinMax() {\n const meta = this._cachedMeta;\n const range = {min: Number.POSITIVE_INFINITY, max: Number.NEGATIVE_INFINITY};\n meta.data.forEach((element, index) => {\n const parsed = this.getParsed(index).r;\n if (!isNaN(parsed) && this.chart.getDataVisibility(index)) {\n if (parsed < range.min) {\n range.min = parsed;\n }\n if (parsed > range.max) {\n range.max = parsed;\n }\n }\n });\n return range;\n }\n _updateRadius() {\n const chart = this.chart;\n const chartArea = chart.chartArea;\n const opts = chart.options;\n const minSize = Math.min(chartArea.right - chartArea.left, chartArea.bottom - chartArea.top);\n const outerRadius = Math.max(minSize / 2, 0);\n const innerRadius = Math.max(opts.cutoutPercentage ? (outerRadius / 100) * (opts.cutoutPercentage) : 1, 0);\n const radiusLength = (outerRadius - innerRadius) / chart.getVisibleDatasetCount();\n this.outerRadius = outerRadius - (radiusLength * this.index);\n this.innerRadius = this.outerRadius - radiusLength;\n }\n updateElements(arcs, start, count, mode) {\n const reset = mode === 'reset';\n const chart = this.chart;\n const opts = chart.options;\n const animationOpts = opts.animation;\n const scale = this._cachedMeta.rScale;\n const centerX = scale.xCenter;\n const centerY = scale.yCenter;\n const datasetStartAngle = scale.getIndexAngle(0) - 0.5 * PI;\n let angle = datasetStartAngle;\n let i;\n const defaultAngle = 360 / this.countVisibleElements();\n for (i = 0; i < start; ++i) {\n angle += this._computeAngle(i, mode, defaultAngle);\n }\n for (i = start; i < start + count; i++) {\n const arc = arcs[i];\n let startAngle = angle;\n let endAngle = angle + this._computeAngle(i, mode, defaultAngle);\n let outerRadius = chart.getDataVisibility(i) ? scale.getDistanceFromCenterForValue(this.getParsed(i).r) : 0;\n angle = endAngle;\n if (reset) {\n if (animationOpts.animateScale) {\n outerRadius = 0;\n }\n if (animationOpts.animateRotate) {\n startAngle = endAngle = datasetStartAngle;\n }\n }\n const properties = {\n x: centerX,\n y: centerY,\n innerRadius: 0,\n outerRadius,\n startAngle,\n endAngle,\n options: this.resolveDataElementOptions(i, arc.active ? 'active' : mode)\n };\n this.updateElement(arc, i, properties, mode);\n }\n }\n countVisibleElements() {\n const meta = this._cachedMeta;\n let count = 0;\n meta.data.forEach((element, index) => {\n if (!isNaN(this.getParsed(index).r) && this.chart.getDataVisibility(index)) {\n count++;\n }\n });\n return count;\n }\n _computeAngle(index, mode, defaultAngle) {\n return this.chart.getDataVisibility(index)\n ? toRadians(this.resolveDataElementOptions(index, mode).angle || defaultAngle)\n : 0;\n }\n}\nPolarAreaController.id = 'polarArea';\nPolarAreaController.defaults = {\n dataElementType: 'arc',\n animation: {\n animateRotate: true,\n animateScale: true\n },\n animations: {\n numbers: {\n type: 'number',\n properties: ['x', 'y', 'startAngle', 'endAngle', 'innerRadius', 'outerRadius']\n },\n },\n indexAxis: 'r',\n startAngle: 0,\n};\nPolarAreaController.overrides = {\n aspectRatio: 1,\n plugins: {\n legend: {\n labels: {\n generateLabels(chart) {\n const data = chart.data;\n if (data.labels.length && data.datasets.length) {\n const {labels: {pointStyle}} = chart.legend.options;\n return data.labels.map((label, i) => {\n const meta = chart.getDatasetMeta(0);\n const style = meta.controller.getStyle(i);\n return {\n text: label,\n fillStyle: style.backgroundColor,\n strokeStyle: style.borderColor,\n lineWidth: style.borderWidth,\n pointStyle: pointStyle,\n hidden: !chart.getDataVisibility(i),\n index: i\n };\n });\n }\n return [];\n }\n },\n onClick(e, legendItem, legend) {\n legend.chart.toggleDataVisibility(legendItem.index);\n legend.chart.update();\n }\n },\n tooltip: {\n callbacks: {\n title() {\n return '';\n },\n label(context) {\n return context.chart.data.labels[context.dataIndex] + ': ' + context.formattedValue;\n }\n }\n }\n },\n scales: {\n r: {\n type: 'radialLinear',\n angleLines: {\n display: false\n },\n beginAtZero: true,\n grid: {\n circular: true\n },\n pointLabels: {\n display: false\n },\n startAngle: 0\n }\n }\n};\n\nclass PieController extends DoughnutController {\n}\nPieController.id = 'pie';\nPieController.defaults = {\n cutout: 0,\n rotation: 0,\n circumference: 360,\n radius: '100%'\n};\n\nclass RadarController extends DatasetController {\n getLabelAndValue(index) {\n const vScale = this._cachedMeta.vScale;\n const parsed = this.getParsed(index);\n return {\n label: vScale.getLabels()[index],\n value: '' + vScale.getLabelForValue(parsed[vScale.axis])\n };\n }\n parseObjectData(meta, data, start, count) {\n return _parseObjectDataRadialScale.bind(this)(meta, data, start, count);\n }\n update(mode) {\n const meta = this._cachedMeta;\n const line = meta.dataset;\n const points = meta.data || [];\n const labels = meta.iScale.getLabels();\n line.points = points;\n if (mode !== 'resize') {\n const options = this.resolveDatasetElementOptions(mode);\n if (!this.options.showLine) {\n options.borderWidth = 0;\n }\n const properties = {\n _loop: true,\n _fullLoop: labels.length === points.length,\n options\n };\n this.updateElement(line, undefined, properties, mode);\n }\n this.updateElements(points, 0, points.length, mode);\n }\n updateElements(points, start, count, mode) {\n const scale = this._cachedMeta.rScale;\n const reset = mode === 'reset';\n for (let i = start; i < start + count; i++) {\n const point = points[i];\n const options = this.resolveDataElementOptions(i, point.active ? 'active' : mode);\n const pointPosition = scale.getPointPositionForValue(i, this.getParsed(i).r);\n const x = reset ? scale.xCenter : pointPosition.x;\n const y = reset ? scale.yCenter : pointPosition.y;\n const properties = {\n x,\n y,\n angle: pointPosition.angle,\n skip: isNaN(x) || isNaN(y),\n options\n };\n this.updateElement(point, i, properties, mode);\n }\n }\n}\nRadarController.id = 'radar';\nRadarController.defaults = {\n datasetElementType: 'line',\n dataElementType: 'point',\n indexAxis: 'r',\n showLine: true,\n elements: {\n line: {\n fill: 'start'\n }\n },\n};\nRadarController.overrides = {\n aspectRatio: 1,\n scales: {\n r: {\n type: 'radialLinear',\n }\n }\n};\n\nclass Element {\n constructor() {\n this.x = undefined;\n this.y = undefined;\n this.active = false;\n this.options = undefined;\n this.$animations = undefined;\n }\n tooltipPosition(useFinalPosition) {\n const {x, y} = this.getProps(['x', 'y'], useFinalPosition);\n return {x, y};\n }\n hasValue() {\n return isNumber(this.x) && isNumber(this.y);\n }\n getProps(props, final) {\n const anims = this.$animations;\n if (!final || !anims) {\n return this;\n }\n const ret = {};\n props.forEach(prop => {\n ret[prop] = anims[prop] && anims[prop].active() ? anims[prop]._to : this[prop];\n });\n return ret;\n }\n}\nElement.defaults = {};\nElement.defaultRoutes = undefined;\n\nconst formatters = {\n values(value) {\n return isArray(value) ? value : '' + value;\n },\n numeric(tickValue, index, ticks) {\n if (tickValue === 0) {\n return '0';\n }\n const locale = this.chart.options.locale;\n let notation;\n let delta = tickValue;\n if (ticks.length > 1) {\n const maxTick = Math.max(Math.abs(ticks[0].value), Math.abs(ticks[ticks.length - 1].value));\n if (maxTick < 1e-4 || maxTick > 1e+15) {\n notation = 'scientific';\n }\n delta = calculateDelta(tickValue, ticks);\n }\n const logDelta = log10(Math.abs(delta));\n const numDecimal = Math.max(Math.min(-1 * Math.floor(logDelta), 20), 0);\n const options = {notation, minimumFractionDigits: numDecimal, maximumFractionDigits: numDecimal};\n Object.assign(options, this.options.ticks.format);\n return formatNumber(tickValue, locale, options);\n },\n logarithmic(tickValue, index, ticks) {\n if (tickValue === 0) {\n return '0';\n }\n const remain = tickValue / (Math.pow(10, Math.floor(log10(tickValue))));\n if (remain === 1 || remain === 2 || remain === 5) {\n return formatters.numeric.call(this, tickValue, index, ticks);\n }\n return '';\n }\n};\nfunction calculateDelta(tickValue, ticks) {\n let delta = ticks.length > 3 ? ticks[2].value - ticks[1].value : ticks[1].value - ticks[0].value;\n if (Math.abs(delta) >= 1 && tickValue !== Math.floor(tickValue)) {\n delta = tickValue - Math.floor(tickValue);\n }\n return delta;\n}\nvar Ticks = {formatters};\n\ndefaults.set('scale', {\n display: true,\n offset: false,\n reverse: false,\n beginAtZero: false,\n bounds: 'ticks',\n grace: 0,\n grid: {\n display: true,\n lineWidth: 1,\n drawBorder: true,\n drawOnChartArea: true,\n drawTicks: true,\n tickLength: 8,\n tickWidth: (_ctx, options) => options.lineWidth,\n tickColor: (_ctx, options) => options.color,\n offset: false,\n borderDash: [],\n borderDashOffset: 0.0,\n borderWidth: 1\n },\n title: {\n display: false,\n text: '',\n padding: {\n top: 4,\n bottom: 4\n }\n },\n ticks: {\n minRotation: 0,\n maxRotation: 50,\n mirror: false,\n textStrokeWidth: 0,\n textStrokeColor: '',\n padding: 3,\n display: true,\n autoSkip: true,\n autoSkipPadding: 3,\n labelOffset: 0,\n callback: Ticks.formatters.values,\n minor: {},\n major: {},\n align: 'center',\n crossAlign: 'near',\n showLabelBackdrop: false,\n backdropColor: 'rgba(255, 255, 255, 0.75)',\n backdropPadding: 2,\n }\n});\ndefaults.route('scale.ticks', 'color', '', 'color');\ndefaults.route('scale.grid', 'color', '', 'borderColor');\ndefaults.route('scale.grid', 'borderColor', '', 'borderColor');\ndefaults.route('scale.title', 'color', '', 'color');\ndefaults.describe('scale', {\n _fallback: false,\n _scriptable: (name) => !name.startsWith('before') && !name.startsWith('after') && name !== 'callback' && name !== 'parser',\n _indexable: (name) => name !== 'borderDash' && name !== 'tickBorderDash',\n});\ndefaults.describe('scales', {\n _fallback: 'scale',\n});\ndefaults.describe('scale.ticks', {\n _scriptable: (name) => name !== 'backdropPadding' && name !== 'callback',\n _indexable: (name) => name !== 'backdropPadding',\n});\n\nfunction autoSkip(scale, ticks) {\n const tickOpts = scale.options.ticks;\n const ticksLimit = tickOpts.maxTicksLimit || determineMaxTicks(scale);\n const majorIndices = tickOpts.major.enabled ? getMajorIndices(ticks) : [];\n const numMajorIndices = majorIndices.length;\n const first = majorIndices[0];\n const last = majorIndices[numMajorIndices - 1];\n const newTicks = [];\n if (numMajorIndices > ticksLimit) {\n skipMajors(ticks, newTicks, majorIndices, numMajorIndices / ticksLimit);\n return newTicks;\n }\n const spacing = calculateSpacing(majorIndices, ticks, ticksLimit);\n if (numMajorIndices > 0) {\n let i, ilen;\n const avgMajorSpacing = numMajorIndices > 1 ? Math.round((last - first) / (numMajorIndices - 1)) : null;\n skip(ticks, newTicks, spacing, isNullOrUndef(avgMajorSpacing) ? 0 : first - avgMajorSpacing, first);\n for (i = 0, ilen = numMajorIndices - 1; i < ilen; i++) {\n skip(ticks, newTicks, spacing, majorIndices[i], majorIndices[i + 1]);\n }\n skip(ticks, newTicks, spacing, last, isNullOrUndef(avgMajorSpacing) ? ticks.length : last + avgMajorSpacing);\n return newTicks;\n }\n skip(ticks, newTicks, spacing);\n return newTicks;\n}\nfunction determineMaxTicks(scale) {\n const offset = scale.options.offset;\n const tickLength = scale._tickSize();\n const maxScale = scale._length / tickLength + (offset ? 0 : 1);\n const maxChart = scale._maxLength / tickLength;\n return Math.floor(Math.min(maxScale, maxChart));\n}\nfunction calculateSpacing(majorIndices, ticks, ticksLimit) {\n const evenMajorSpacing = getEvenSpacing(majorIndices);\n const spacing = ticks.length / ticksLimit;\n if (!evenMajorSpacing) {\n return Math.max(spacing, 1);\n }\n const factors = _factorize(evenMajorSpacing);\n for (let i = 0, ilen = factors.length - 1; i < ilen; i++) {\n const factor = factors[i];\n if (factor > spacing) {\n return factor;\n }\n }\n return Math.max(spacing, 1);\n}\nfunction getMajorIndices(ticks) {\n const result = [];\n let i, ilen;\n for (i = 0, ilen = ticks.length; i < ilen; i++) {\n if (ticks[i].major) {\n result.push(i);\n }\n }\n return result;\n}\nfunction skipMajors(ticks, newTicks, majorIndices, spacing) {\n let count = 0;\n let next = majorIndices[0];\n let i;\n spacing = Math.ceil(spacing);\n for (i = 0; i < ticks.length; i++) {\n if (i === next) {\n newTicks.push(ticks[i]);\n count++;\n next = majorIndices[count * spacing];\n }\n }\n}\nfunction skip(ticks, newTicks, spacing, majorStart, majorEnd) {\n const start = valueOrDefault(majorStart, 0);\n const end = Math.min(valueOrDefault(majorEnd, ticks.length), ticks.length);\n let count = 0;\n let length, i, next;\n spacing = Math.ceil(spacing);\n if (majorEnd) {\n length = majorEnd - majorStart;\n spacing = length / Math.floor(length / spacing);\n }\n next = start;\n while (next < 0) {\n count++;\n next = Math.round(start + count * spacing);\n }\n for (i = Math.max(start, 0); i < end; i++) {\n if (i === next) {\n newTicks.push(ticks[i]);\n count++;\n next = Math.round(start + count * spacing);\n }\n }\n}\nfunction getEvenSpacing(arr) {\n const len = arr.length;\n let i, diff;\n if (len < 2) {\n return false;\n }\n for (diff = arr[0], i = 1; i < len; ++i) {\n if (arr[i] - arr[i - 1] !== diff) {\n return false;\n }\n }\n return diff;\n}\n\nconst reverseAlign = (align) => align === 'left' ? 'right' : align === 'right' ? 'left' : align;\nconst offsetFromEdge = (scale, edge, offset) => edge === 'top' || edge === 'left' ? scale[edge] + offset : scale[edge] - offset;\nfunction sample(arr, numItems) {\n const result = [];\n const increment = arr.length / numItems;\n const len = arr.length;\n let i = 0;\n for (; i < len; i += increment) {\n result.push(arr[Math.floor(i)]);\n }\n return result;\n}\nfunction getPixelForGridLine(scale, index, offsetGridLines) {\n const length = scale.ticks.length;\n const validIndex = Math.min(index, length - 1);\n const start = scale._startPixel;\n const end = scale._endPixel;\n const epsilon = 1e-6;\n let lineValue = scale.getPixelForTick(validIndex);\n let offset;\n if (offsetGridLines) {\n if (length === 1) {\n offset = Math.max(lineValue - start, end - lineValue);\n } else if (index === 0) {\n offset = (scale.getPixelForTick(1) - lineValue) / 2;\n } else {\n offset = (lineValue - scale.getPixelForTick(validIndex - 1)) / 2;\n }\n lineValue += validIndex < index ? offset : -offset;\n if (lineValue < start - epsilon || lineValue > end + epsilon) {\n return;\n }\n }\n return lineValue;\n}\nfunction garbageCollect(caches, length) {\n each(caches, (cache) => {\n const gc = cache.gc;\n const gcLen = gc.length / 2;\n let i;\n if (gcLen > length) {\n for (i = 0; i < gcLen; ++i) {\n delete cache.data[gc[i]];\n }\n gc.splice(0, gcLen);\n }\n });\n}\nfunction getTickMarkLength(options) {\n return options.drawTicks ? options.tickLength : 0;\n}\nfunction getTitleHeight(options, fallback) {\n if (!options.display) {\n return 0;\n }\n const font = toFont(options.font, fallback);\n const padding = toPadding(options.padding);\n const lines = isArray(options.text) ? options.text.length : 1;\n return (lines * font.lineHeight) + padding.height;\n}\nfunction createScaleContext(parent, scale) {\n return createContext(parent, {\n scale,\n type: 'scale'\n });\n}\nfunction createTickContext(parent, index, tick) {\n return createContext(parent, {\n tick,\n index,\n type: 'tick'\n });\n}\nfunction titleAlign(align, position, reverse) {\n let ret = _toLeftRightCenter(align);\n if ((reverse && position !== 'right') || (!reverse && position === 'right')) {\n ret = reverseAlign(ret);\n }\n return ret;\n}\nfunction titleArgs(scale, offset, position, align) {\n const {top, left, bottom, right, chart} = scale;\n const {chartArea, scales} = chart;\n let rotation = 0;\n let maxWidth, titleX, titleY;\n const height = bottom - top;\n const width = right - left;\n if (scale.isHorizontal()) {\n titleX = _alignStartEnd(align, left, right);\n if (isObject(position)) {\n const positionAxisID = Object.keys(position)[0];\n const value = position[positionAxisID];\n titleY = scales[positionAxisID].getPixelForValue(value) + height - offset;\n } else if (position === 'center') {\n titleY = (chartArea.bottom + chartArea.top) / 2 + height - offset;\n } else {\n titleY = offsetFromEdge(scale, position, offset);\n }\n maxWidth = right - left;\n } else {\n if (isObject(position)) {\n const positionAxisID = Object.keys(position)[0];\n const value = position[positionAxisID];\n titleX = scales[positionAxisID].getPixelForValue(value) - width + offset;\n } else if (position === 'center') {\n titleX = (chartArea.left + chartArea.right) / 2 - width + offset;\n } else {\n titleX = offsetFromEdge(scale, position, offset);\n }\n titleY = _alignStartEnd(align, bottom, top);\n rotation = position === 'left' ? -HALF_PI : HALF_PI;\n }\n return {titleX, titleY, maxWidth, rotation};\n}\nclass Scale extends Element {\n constructor(cfg) {\n super();\n this.id = cfg.id;\n this.type = cfg.type;\n this.options = undefined;\n this.ctx = cfg.ctx;\n this.chart = cfg.chart;\n this.top = undefined;\n this.bottom = undefined;\n this.left = undefined;\n this.right = undefined;\n this.width = undefined;\n this.height = undefined;\n this._margins = {\n left: 0,\n right: 0,\n top: 0,\n bottom: 0\n };\n this.maxWidth = undefined;\n this.maxHeight = undefined;\n this.paddingTop = undefined;\n this.paddingBottom = undefined;\n this.paddingLeft = undefined;\n this.paddingRight = undefined;\n this.axis = undefined;\n this.labelRotation = undefined;\n this.min = undefined;\n this.max = undefined;\n this._range = undefined;\n this.ticks = [];\n this._gridLineItems = null;\n this._labelItems = null;\n this._labelSizes = null;\n this._length = 0;\n this._maxLength = 0;\n this._longestTextCache = {};\n this._startPixel = undefined;\n this._endPixel = undefined;\n this._reversePixels = false;\n this._userMax = undefined;\n this._userMin = undefined;\n this._suggestedMax = undefined;\n this._suggestedMin = undefined;\n this._ticksLength = 0;\n this._borderValue = 0;\n this._cache = {};\n this._dataLimitsCached = false;\n this.$context = undefined;\n }\n init(options) {\n this.options = options.setContext(this.getContext());\n this.axis = options.axis;\n this._userMin = this.parse(options.min);\n this._userMax = this.parse(options.max);\n this._suggestedMin = this.parse(options.suggestedMin);\n this._suggestedMax = this.parse(options.suggestedMax);\n }\n parse(raw, index) {\n return raw;\n }\n getUserBounds() {\n let {_userMin, _userMax, _suggestedMin, _suggestedMax} = this;\n _userMin = finiteOrDefault(_userMin, Number.POSITIVE_INFINITY);\n _userMax = finiteOrDefault(_userMax, Number.NEGATIVE_INFINITY);\n _suggestedMin = finiteOrDefault(_suggestedMin, Number.POSITIVE_INFINITY);\n _suggestedMax = finiteOrDefault(_suggestedMax, Number.NEGATIVE_INFINITY);\n return {\n min: finiteOrDefault(_userMin, _suggestedMin),\n max: finiteOrDefault(_userMax, _suggestedMax),\n minDefined: isNumberFinite(_userMin),\n maxDefined: isNumberFinite(_userMax)\n };\n }\n getMinMax(canStack) {\n let {min, max, minDefined, maxDefined} = this.getUserBounds();\n let range;\n if (minDefined && maxDefined) {\n return {min, max};\n }\n const metas = this.getMatchingVisibleMetas();\n for (let i = 0, ilen = metas.length; i < ilen; ++i) {\n range = metas[i].controller.getMinMax(this, canStack);\n if (!minDefined) {\n min = Math.min(min, range.min);\n }\n if (!maxDefined) {\n max = Math.max(max, range.max);\n }\n }\n min = maxDefined && min > max ? max : min;\n max = minDefined && min > max ? min : max;\n return {\n min: finiteOrDefault(min, finiteOrDefault(max, min)),\n max: finiteOrDefault(max, finiteOrDefault(min, max))\n };\n }\n getPadding() {\n return {\n left: this.paddingLeft || 0,\n top: this.paddingTop || 0,\n right: this.paddingRight || 0,\n bottom: this.paddingBottom || 0\n };\n }\n getTicks() {\n return this.ticks;\n }\n getLabels() {\n const data = this.chart.data;\n return this.options.labels || (this.isHorizontal() ? data.xLabels : data.yLabels) || data.labels || [];\n }\n beforeLayout() {\n this._cache = {};\n this._dataLimitsCached = false;\n }\n beforeUpdate() {\n callback(this.options.beforeUpdate, [this]);\n }\n update(maxWidth, maxHeight, margins) {\n const {beginAtZero, grace, ticks: tickOpts} = this.options;\n const sampleSize = tickOpts.sampleSize;\n this.beforeUpdate();\n this.maxWidth = maxWidth;\n this.maxHeight = maxHeight;\n this._margins = margins = Object.assign({\n left: 0,\n right: 0,\n top: 0,\n bottom: 0\n }, margins);\n this.ticks = null;\n this._labelSizes = null;\n this._gridLineItems = null;\n this._labelItems = null;\n this.beforeSetDimensions();\n this.setDimensions();\n this.afterSetDimensions();\n this._maxLength = this.isHorizontal()\n ? this.width + margins.left + margins.right\n : this.height + margins.top + margins.bottom;\n if (!this._dataLimitsCached) {\n this.beforeDataLimits();\n this.determineDataLimits();\n this.afterDataLimits();\n this._range = _addGrace(this, grace, beginAtZero);\n this._dataLimitsCached = true;\n }\n this.beforeBuildTicks();\n this.ticks = this.buildTicks() || [];\n this.afterBuildTicks();\n const samplingEnabled = sampleSize < this.ticks.length;\n this._convertTicksToLabels(samplingEnabled ? sample(this.ticks, sampleSize) : this.ticks);\n this.configure();\n this.beforeCalculateLabelRotation();\n this.calculateLabelRotation();\n this.afterCalculateLabelRotation();\n if (tickOpts.display && (tickOpts.autoSkip || tickOpts.source === 'auto')) {\n this.ticks = autoSkip(this, this.ticks);\n this._labelSizes = null;\n this.afterAutoSkip();\n }\n if (samplingEnabled) {\n this._convertTicksToLabels(this.ticks);\n }\n this.beforeFit();\n this.fit();\n this.afterFit();\n this.afterUpdate();\n }\n configure() {\n let reversePixels = this.options.reverse;\n let startPixel, endPixel;\n if (this.isHorizontal()) {\n startPixel = this.left;\n endPixel = this.right;\n } else {\n startPixel = this.top;\n endPixel = this.bottom;\n reversePixels = !reversePixels;\n }\n this._startPixel = startPixel;\n this._endPixel = endPixel;\n this._reversePixels = reversePixels;\n this._length = endPixel - startPixel;\n this._alignToPixels = this.options.alignToPixels;\n }\n afterUpdate() {\n callback(this.options.afterUpdate, [this]);\n }\n beforeSetDimensions() {\n callback(this.options.beforeSetDimensions, [this]);\n }\n setDimensions() {\n if (this.isHorizontal()) {\n this.width = this.maxWidth;\n this.left = 0;\n this.right = this.width;\n } else {\n this.height = this.maxHeight;\n this.top = 0;\n this.bottom = this.height;\n }\n this.paddingLeft = 0;\n this.paddingTop = 0;\n this.paddingRight = 0;\n this.paddingBottom = 0;\n }\n afterSetDimensions() {\n callback(this.options.afterSetDimensions, [this]);\n }\n _callHooks(name) {\n this.chart.notifyPlugins(name, this.getContext());\n callback(this.options[name], [this]);\n }\n beforeDataLimits() {\n this._callHooks('beforeDataLimits');\n }\n determineDataLimits() {}\n afterDataLimits() {\n this._callHooks('afterDataLimits');\n }\n beforeBuildTicks() {\n this._callHooks('beforeBuildTicks');\n }\n buildTicks() {\n return [];\n }\n afterBuildTicks() {\n this._callHooks('afterBuildTicks');\n }\n beforeTickToLabelConversion() {\n callback(this.options.beforeTickToLabelConversion, [this]);\n }\n generateTickLabels(ticks) {\n const tickOpts = this.options.ticks;\n let i, ilen, tick;\n for (i = 0, ilen = ticks.length; i < ilen; i++) {\n tick = ticks[i];\n tick.label = callback(tickOpts.callback, [tick.value, i, ticks], this);\n }\n }\n afterTickToLabelConversion() {\n callback(this.options.afterTickToLabelConversion, [this]);\n }\n beforeCalculateLabelRotation() {\n callback(this.options.beforeCalculateLabelRotation, [this]);\n }\n calculateLabelRotation() {\n const options = this.options;\n const tickOpts = options.ticks;\n const numTicks = this.ticks.length;\n const minRotation = tickOpts.minRotation || 0;\n const maxRotation = tickOpts.maxRotation;\n let labelRotation = minRotation;\n let tickWidth, maxHeight, maxLabelDiagonal;\n if (!this._isVisible() || !tickOpts.display || minRotation >= maxRotation || numTicks <= 1 || !this.isHorizontal()) {\n this.labelRotation = minRotation;\n return;\n }\n const labelSizes = this._getLabelSizes();\n const maxLabelWidth = labelSizes.widest.width;\n const maxLabelHeight = labelSizes.highest.height;\n const maxWidth = _limitValue(this.chart.width - maxLabelWidth, 0, this.maxWidth);\n tickWidth = options.offset ? this.maxWidth / numTicks : maxWidth / (numTicks - 1);\n if (maxLabelWidth + 6 > tickWidth) {\n tickWidth = maxWidth / (numTicks - (options.offset ? 0.5 : 1));\n maxHeight = this.maxHeight - getTickMarkLength(options.grid)\n\t\t\t\t- tickOpts.padding - getTitleHeight(options.title, this.chart.options.font);\n maxLabelDiagonal = Math.sqrt(maxLabelWidth * maxLabelWidth + maxLabelHeight * maxLabelHeight);\n labelRotation = toDegrees(Math.min(\n Math.asin(_limitValue((labelSizes.highest.height + 6) / tickWidth, -1, 1)),\n Math.asin(_limitValue(maxHeight / maxLabelDiagonal, -1, 1)) - Math.asin(_limitValue(maxLabelHeight / maxLabelDiagonal, -1, 1))\n ));\n labelRotation = Math.max(minRotation, Math.min(maxRotation, labelRotation));\n }\n this.labelRotation = labelRotation;\n }\n afterCalculateLabelRotation() {\n callback(this.options.afterCalculateLabelRotation, [this]);\n }\n afterAutoSkip() {}\n beforeFit() {\n callback(this.options.beforeFit, [this]);\n }\n fit() {\n const minSize = {\n width: 0,\n height: 0\n };\n const {chart, options: {ticks: tickOpts, title: titleOpts, grid: gridOpts}} = this;\n const display = this._isVisible();\n const isHorizontal = this.isHorizontal();\n if (display) {\n const titleHeight = getTitleHeight(titleOpts, chart.options.font);\n if (isHorizontal) {\n minSize.width = this.maxWidth;\n minSize.height = getTickMarkLength(gridOpts) + titleHeight;\n } else {\n minSize.height = this.maxHeight;\n minSize.width = getTickMarkLength(gridOpts) + titleHeight;\n }\n if (tickOpts.display && this.ticks.length) {\n const {first, last, widest, highest} = this._getLabelSizes();\n const tickPadding = tickOpts.padding * 2;\n const angleRadians = toRadians(this.labelRotation);\n const cos = Math.cos(angleRadians);\n const sin = Math.sin(angleRadians);\n if (isHorizontal) {\n const labelHeight = tickOpts.mirror ? 0 : sin * widest.width + cos * highest.height;\n minSize.height = Math.min(this.maxHeight, minSize.height + labelHeight + tickPadding);\n } else {\n const labelWidth = tickOpts.mirror ? 0 : cos * widest.width + sin * highest.height;\n minSize.width = Math.min(this.maxWidth, minSize.width + labelWidth + tickPadding);\n }\n this._calculatePadding(first, last, sin, cos);\n }\n }\n this._handleMargins();\n if (isHorizontal) {\n this.width = this._length = chart.width - this._margins.left - this._margins.right;\n this.height = minSize.height;\n } else {\n this.width = minSize.width;\n this.height = this._length = chart.height - this._margins.top - this._margins.bottom;\n }\n }\n _calculatePadding(first, last, sin, cos) {\n const {ticks: {align, padding}, position} = this.options;\n const isRotated = this.labelRotation !== 0;\n const labelsBelowTicks = position !== 'top' && this.axis === 'x';\n if (this.isHorizontal()) {\n const offsetLeft = this.getPixelForTick(0) - this.left;\n const offsetRight = this.right - this.getPixelForTick(this.ticks.length - 1);\n let paddingLeft = 0;\n let paddingRight = 0;\n if (isRotated) {\n if (labelsBelowTicks) {\n paddingLeft = cos * first.width;\n paddingRight = sin * last.height;\n } else {\n paddingLeft = sin * first.height;\n paddingRight = cos * last.width;\n }\n } else if (align === 'start') {\n paddingRight = last.width;\n } else if (align === 'end') {\n paddingLeft = first.width;\n } else if (align !== 'inner') {\n paddingLeft = first.width / 2;\n paddingRight = last.width / 2;\n }\n this.paddingLeft = Math.max((paddingLeft - offsetLeft + padding) * this.width / (this.width - offsetLeft), 0);\n this.paddingRight = Math.max((paddingRight - offsetRight + padding) * this.width / (this.width - offsetRight), 0);\n } else {\n let paddingTop = last.height / 2;\n let paddingBottom = first.height / 2;\n if (align === 'start') {\n paddingTop = 0;\n paddingBottom = first.height;\n } else if (align === 'end') {\n paddingTop = last.height;\n paddingBottom = 0;\n }\n this.paddingTop = paddingTop + padding;\n this.paddingBottom = paddingBottom + padding;\n }\n }\n _handleMargins() {\n if (this._margins) {\n this._margins.left = Math.max(this.paddingLeft, this._margins.left);\n this._margins.top = Math.max(this.paddingTop, this._margins.top);\n this._margins.right = Math.max(this.paddingRight, this._margins.right);\n this._margins.bottom = Math.max(this.paddingBottom, this._margins.bottom);\n }\n }\n afterFit() {\n callback(this.options.afterFit, [this]);\n }\n isHorizontal() {\n const {axis, position} = this.options;\n return position === 'top' || position === 'bottom' || axis === 'x';\n }\n isFullSize() {\n return this.options.fullSize;\n }\n _convertTicksToLabels(ticks) {\n this.beforeTickToLabelConversion();\n this.generateTickLabels(ticks);\n let i, ilen;\n for (i = 0, ilen = ticks.length; i < ilen; i++) {\n if (isNullOrUndef(ticks[i].label)) {\n ticks.splice(i, 1);\n ilen--;\n i--;\n }\n }\n this.afterTickToLabelConversion();\n }\n _getLabelSizes() {\n let labelSizes = this._labelSizes;\n if (!labelSizes) {\n const sampleSize = this.options.ticks.sampleSize;\n let ticks = this.ticks;\n if (sampleSize < ticks.length) {\n ticks = sample(ticks, sampleSize);\n }\n this._labelSizes = labelSizes = this._computeLabelSizes(ticks, ticks.length);\n }\n return labelSizes;\n }\n _computeLabelSizes(ticks, length) {\n const {ctx, _longestTextCache: caches} = this;\n const widths = [];\n const heights = [];\n let widestLabelSize = 0;\n let highestLabelSize = 0;\n let i, j, jlen, label, tickFont, fontString, cache, lineHeight, width, height, nestedLabel;\n for (i = 0; i < length; ++i) {\n label = ticks[i].label;\n tickFont = this._resolveTickFontOptions(i);\n ctx.font = fontString = tickFont.string;\n cache = caches[fontString] = caches[fontString] || {data: {}, gc: []};\n lineHeight = tickFont.lineHeight;\n width = height = 0;\n if (!isNullOrUndef(label) && !isArray(label)) {\n width = _measureText(ctx, cache.data, cache.gc, width, label);\n height = lineHeight;\n } else if (isArray(label)) {\n for (j = 0, jlen = label.length; j < jlen; ++j) {\n nestedLabel = label[j];\n if (!isNullOrUndef(nestedLabel) && !isArray(nestedLabel)) {\n width = _measureText(ctx, cache.data, cache.gc, width, nestedLabel);\n height += lineHeight;\n }\n }\n }\n widths.push(width);\n heights.push(height);\n widestLabelSize = Math.max(width, widestLabelSize);\n highestLabelSize = Math.max(height, highestLabelSize);\n }\n garbageCollect(caches, length);\n const widest = widths.indexOf(widestLabelSize);\n const highest = heights.indexOf(highestLabelSize);\n const valueAt = (idx) => ({width: widths[idx] || 0, height: heights[idx] || 0});\n return {\n first: valueAt(0),\n last: valueAt(length - 1),\n widest: valueAt(widest),\n highest: valueAt(highest),\n widths,\n heights,\n };\n }\n getLabelForValue(value) {\n return value;\n }\n getPixelForValue(value, index) {\n return NaN;\n }\n getValueForPixel(pixel) {}\n getPixelForTick(index) {\n const ticks = this.ticks;\n if (index < 0 || index > ticks.length - 1) {\n return null;\n }\n return this.getPixelForValue(ticks[index].value);\n }\n getPixelForDecimal(decimal) {\n if (this._reversePixels) {\n decimal = 1 - decimal;\n }\n const pixel = this._startPixel + decimal * this._length;\n return _int16Range(this._alignToPixels ? _alignPixel(this.chart, pixel, 0) : pixel);\n }\n getDecimalForPixel(pixel) {\n const decimal = (pixel - this._startPixel) / this._length;\n return this._reversePixels ? 1 - decimal : decimal;\n }\n getBasePixel() {\n return this.getPixelForValue(this.getBaseValue());\n }\n getBaseValue() {\n const {min, max} = this;\n return min < 0 && max < 0 ? max :\n min > 0 && max > 0 ? min :\n 0;\n }\n getContext(index) {\n const ticks = this.ticks || [];\n if (index >= 0 && index < ticks.length) {\n const tick = ticks[index];\n return tick.$context ||\n\t\t\t\t(tick.$context = createTickContext(this.getContext(), index, tick));\n }\n return this.$context ||\n\t\t\t(this.$context = createScaleContext(this.chart.getContext(), this));\n }\n _tickSize() {\n const optionTicks = this.options.ticks;\n const rot = toRadians(this.labelRotation);\n const cos = Math.abs(Math.cos(rot));\n const sin = Math.abs(Math.sin(rot));\n const labelSizes = this._getLabelSizes();\n const padding = optionTicks.autoSkipPadding || 0;\n const w = labelSizes ? labelSizes.widest.width + padding : 0;\n const h = labelSizes ? labelSizes.highest.height + padding : 0;\n return this.isHorizontal()\n ? h * cos > w * sin ? w / cos : h / sin\n : h * sin < w * cos ? h / cos : w / sin;\n }\n _isVisible() {\n const display = this.options.display;\n if (display !== 'auto') {\n return !!display;\n }\n return this.getMatchingVisibleMetas().length > 0;\n }\n _computeGridLineItems(chartArea) {\n const axis = this.axis;\n const chart = this.chart;\n const options = this.options;\n const {grid, position} = options;\n const offset = grid.offset;\n const isHorizontal = this.isHorizontal();\n const ticks = this.ticks;\n const ticksLength = ticks.length + (offset ? 1 : 0);\n const tl = getTickMarkLength(grid);\n const items = [];\n const borderOpts = grid.setContext(this.getContext());\n const axisWidth = borderOpts.drawBorder ? borderOpts.borderWidth : 0;\n const axisHalfWidth = axisWidth / 2;\n const alignBorderValue = function(pixel) {\n return _alignPixel(chart, pixel, axisWidth);\n };\n let borderValue, i, lineValue, alignedLineValue;\n let tx1, ty1, tx2, ty2, x1, y1, x2, y2;\n if (position === 'top') {\n borderValue = alignBorderValue(this.bottom);\n ty1 = this.bottom - tl;\n ty2 = borderValue - axisHalfWidth;\n y1 = alignBorderValue(chartArea.top) + axisHalfWidth;\n y2 = chartArea.bottom;\n } else if (position === 'bottom') {\n borderValue = alignBorderValue(this.top);\n y1 = chartArea.top;\n y2 = alignBorderValue(chartArea.bottom) - axisHalfWidth;\n ty1 = borderValue + axisHalfWidth;\n ty2 = this.top + tl;\n } else if (position === 'left') {\n borderValue = alignBorderValue(this.right);\n tx1 = this.right - tl;\n tx2 = borderValue - axisHalfWidth;\n x1 = alignBorderValue(chartArea.left) + axisHalfWidth;\n x2 = chartArea.right;\n } else if (position === 'right') {\n borderValue = alignBorderValue(this.left);\n x1 = chartArea.left;\n x2 = alignBorderValue(chartArea.right) - axisHalfWidth;\n tx1 = borderValue + axisHalfWidth;\n tx2 = this.left + tl;\n } else if (axis === 'x') {\n if (position === 'center') {\n borderValue = alignBorderValue((chartArea.top + chartArea.bottom) / 2 + 0.5);\n } else if (isObject(position)) {\n const positionAxisID = Object.keys(position)[0];\n const value = position[positionAxisID];\n borderValue = alignBorderValue(this.chart.scales[positionAxisID].getPixelForValue(value));\n }\n y1 = chartArea.top;\n y2 = chartArea.bottom;\n ty1 = borderValue + axisHalfWidth;\n ty2 = ty1 + tl;\n } else if (axis === 'y') {\n if (position === 'center') {\n borderValue = alignBorderValue((chartArea.left + chartArea.right) / 2);\n } else if (isObject(position)) {\n const positionAxisID = Object.keys(position)[0];\n const value = position[positionAxisID];\n borderValue = alignBorderValue(this.chart.scales[positionAxisID].getPixelForValue(value));\n }\n tx1 = borderValue - axisHalfWidth;\n tx2 = tx1 - tl;\n x1 = chartArea.left;\n x2 = chartArea.right;\n }\n const limit = valueOrDefault(options.ticks.maxTicksLimit, ticksLength);\n const step = Math.max(1, Math.ceil(ticksLength / limit));\n for (i = 0; i < ticksLength; i += step) {\n const optsAtIndex = grid.setContext(this.getContext(i));\n const lineWidth = optsAtIndex.lineWidth;\n const lineColor = optsAtIndex.color;\n const borderDash = optsAtIndex.borderDash || [];\n const borderDashOffset = optsAtIndex.borderDashOffset;\n const tickWidth = optsAtIndex.tickWidth;\n const tickColor = optsAtIndex.tickColor;\n const tickBorderDash = optsAtIndex.tickBorderDash || [];\n const tickBorderDashOffset = optsAtIndex.tickBorderDashOffset;\n lineValue = getPixelForGridLine(this, i, offset);\n if (lineValue === undefined) {\n continue;\n }\n alignedLineValue = _alignPixel(chart, lineValue, lineWidth);\n if (isHorizontal) {\n tx1 = tx2 = x1 = x2 = alignedLineValue;\n } else {\n ty1 = ty2 = y1 = y2 = alignedLineValue;\n }\n items.push({\n tx1,\n ty1,\n tx2,\n ty2,\n x1,\n y1,\n x2,\n y2,\n width: lineWidth,\n color: lineColor,\n borderDash,\n borderDashOffset,\n tickWidth,\n tickColor,\n tickBorderDash,\n tickBorderDashOffset,\n });\n }\n this._ticksLength = ticksLength;\n this._borderValue = borderValue;\n return items;\n }\n _computeLabelItems(chartArea) {\n const axis = this.axis;\n const options = this.options;\n const {position, ticks: optionTicks} = options;\n const isHorizontal = this.isHorizontal();\n const ticks = this.ticks;\n const {align, crossAlign, padding, mirror} = optionTicks;\n const tl = getTickMarkLength(options.grid);\n const tickAndPadding = tl + padding;\n const hTickAndPadding = mirror ? -padding : tickAndPadding;\n const rotation = -toRadians(this.labelRotation);\n const items = [];\n let i, ilen, tick, label, x, y, textAlign, pixel, font, lineHeight, lineCount, textOffset;\n let textBaseline = 'middle';\n if (position === 'top') {\n y = this.bottom - hTickAndPadding;\n textAlign = this._getXAxisLabelAlignment();\n } else if (position === 'bottom') {\n y = this.top + hTickAndPadding;\n textAlign = this._getXAxisLabelAlignment();\n } else if (position === 'left') {\n const ret = this._getYAxisLabelAlignment(tl);\n textAlign = ret.textAlign;\n x = ret.x;\n } else if (position === 'right') {\n const ret = this._getYAxisLabelAlignment(tl);\n textAlign = ret.textAlign;\n x = ret.x;\n } else if (axis === 'x') {\n if (position === 'center') {\n y = ((chartArea.top + chartArea.bottom) / 2) + tickAndPadding;\n } else if (isObject(position)) {\n const positionAxisID = Object.keys(position)[0];\n const value = position[positionAxisID];\n y = this.chart.scales[positionAxisID].getPixelForValue(value) + tickAndPadding;\n }\n textAlign = this._getXAxisLabelAlignment();\n } else if (axis === 'y') {\n if (position === 'center') {\n x = ((chartArea.left + chartArea.right) / 2) - tickAndPadding;\n } else if (isObject(position)) {\n const positionAxisID = Object.keys(position)[0];\n const value = position[positionAxisID];\n x = this.chart.scales[positionAxisID].getPixelForValue(value);\n }\n textAlign = this._getYAxisLabelAlignment(tl).textAlign;\n }\n if (axis === 'y') {\n if (align === 'start') {\n textBaseline = 'top';\n } else if (align === 'end') {\n textBaseline = 'bottom';\n }\n }\n const labelSizes = this._getLabelSizes();\n for (i = 0, ilen = ticks.length; i < ilen; ++i) {\n tick = ticks[i];\n label = tick.label;\n const optsAtIndex = optionTicks.setContext(this.getContext(i));\n pixel = this.getPixelForTick(i) + optionTicks.labelOffset;\n font = this._resolveTickFontOptions(i);\n lineHeight = font.lineHeight;\n lineCount = isArray(label) ? label.length : 1;\n const halfCount = lineCount / 2;\n const color = optsAtIndex.color;\n const strokeColor = optsAtIndex.textStrokeColor;\n const strokeWidth = optsAtIndex.textStrokeWidth;\n let tickTextAlign = textAlign;\n if (isHorizontal) {\n x = pixel;\n if (textAlign === 'inner') {\n if (i === ilen - 1) {\n tickTextAlign = !this.options.reverse ? 'right' : 'left';\n } else if (i === 0) {\n tickTextAlign = !this.options.reverse ? 'left' : 'right';\n } else {\n tickTextAlign = 'center';\n }\n }\n if (position === 'top') {\n if (crossAlign === 'near' || rotation !== 0) {\n textOffset = -lineCount * lineHeight + lineHeight / 2;\n } else if (crossAlign === 'center') {\n textOffset = -labelSizes.highest.height / 2 - halfCount * lineHeight + lineHeight;\n } else {\n textOffset = -labelSizes.highest.height + lineHeight / 2;\n }\n } else {\n if (crossAlign === 'near' || rotation !== 0) {\n textOffset = lineHeight / 2;\n } else if (crossAlign === 'center') {\n textOffset = labelSizes.highest.height / 2 - halfCount * lineHeight;\n } else {\n textOffset = labelSizes.highest.height - lineCount * lineHeight;\n }\n }\n if (mirror) {\n textOffset *= -1;\n }\n } else {\n y = pixel;\n textOffset = (1 - lineCount) * lineHeight / 2;\n }\n let backdrop;\n if (optsAtIndex.showLabelBackdrop) {\n const labelPadding = toPadding(optsAtIndex.backdropPadding);\n const height = labelSizes.heights[i];\n const width = labelSizes.widths[i];\n let top = y + textOffset - labelPadding.top;\n let left = x - labelPadding.left;\n switch (textBaseline) {\n case 'middle':\n top -= height / 2;\n break;\n case 'bottom':\n top -= height;\n break;\n }\n switch (textAlign) {\n case 'center':\n left -= width / 2;\n break;\n case 'right':\n left -= width;\n break;\n }\n backdrop = {\n left,\n top,\n width: width + labelPadding.width,\n height: height + labelPadding.height,\n color: optsAtIndex.backdropColor,\n };\n }\n items.push({\n rotation,\n label,\n font,\n color,\n strokeColor,\n strokeWidth,\n textOffset,\n textAlign: tickTextAlign,\n textBaseline,\n translation: [x, y],\n backdrop,\n });\n }\n return items;\n }\n _getXAxisLabelAlignment() {\n const {position, ticks} = this.options;\n const rotation = -toRadians(this.labelRotation);\n if (rotation) {\n return position === 'top' ? 'left' : 'right';\n }\n let align = 'center';\n if (ticks.align === 'start') {\n align = 'left';\n } else if (ticks.align === 'end') {\n align = 'right';\n } else if (ticks.align === 'inner') {\n align = 'inner';\n }\n return align;\n }\n _getYAxisLabelAlignment(tl) {\n const {position, ticks: {crossAlign, mirror, padding}} = this.options;\n const labelSizes = this._getLabelSizes();\n const tickAndPadding = tl + padding;\n const widest = labelSizes.widest.width;\n let textAlign;\n let x;\n if (position === 'left') {\n if (mirror) {\n x = this.right + padding;\n if (crossAlign === 'near') {\n textAlign = 'left';\n } else if (crossAlign === 'center') {\n textAlign = 'center';\n x += (widest / 2);\n } else {\n textAlign = 'right';\n x += widest;\n }\n } else {\n x = this.right - tickAndPadding;\n if (crossAlign === 'near') {\n textAlign = 'right';\n } else if (crossAlign === 'center') {\n textAlign = 'center';\n x -= (widest / 2);\n } else {\n textAlign = 'left';\n x = this.left;\n }\n }\n } else if (position === 'right') {\n if (mirror) {\n x = this.left + padding;\n if (crossAlign === 'near') {\n textAlign = 'right';\n } else if (crossAlign === 'center') {\n textAlign = 'center';\n x -= (widest / 2);\n } else {\n textAlign = 'left';\n x -= widest;\n }\n } else {\n x = this.left + tickAndPadding;\n if (crossAlign === 'near') {\n textAlign = 'left';\n } else if (crossAlign === 'center') {\n textAlign = 'center';\n x += widest / 2;\n } else {\n textAlign = 'right';\n x = this.right;\n }\n }\n } else {\n textAlign = 'right';\n }\n return {textAlign, x};\n }\n _computeLabelArea() {\n if (this.options.ticks.mirror) {\n return;\n }\n const chart = this.chart;\n const position = this.options.position;\n if (position === 'left' || position === 'right') {\n return {top: 0, left: this.left, bottom: chart.height, right: this.right};\n } if (position === 'top' || position === 'bottom') {\n return {top: this.top, left: 0, bottom: this.bottom, right: chart.width};\n }\n }\n drawBackground() {\n const {ctx, options: {backgroundColor}, left, top, width, height} = this;\n if (backgroundColor) {\n ctx.save();\n ctx.fillStyle = backgroundColor;\n ctx.fillRect(left, top, width, height);\n ctx.restore();\n }\n }\n getLineWidthForValue(value) {\n const grid = this.options.grid;\n if (!this._isVisible() || !grid.display) {\n return 0;\n }\n const ticks = this.ticks;\n const index = ticks.findIndex(t => t.value === value);\n if (index >= 0) {\n const opts = grid.setContext(this.getContext(index));\n return opts.lineWidth;\n }\n return 0;\n }\n drawGrid(chartArea) {\n const grid = this.options.grid;\n const ctx = this.ctx;\n const items = this._gridLineItems || (this._gridLineItems = this._computeGridLineItems(chartArea));\n let i, ilen;\n const drawLine = (p1, p2, style) => {\n if (!style.width || !style.color) {\n return;\n }\n ctx.save();\n ctx.lineWidth = style.width;\n ctx.strokeStyle = style.color;\n ctx.setLineDash(style.borderDash || []);\n ctx.lineDashOffset = style.borderDashOffset;\n ctx.beginPath();\n ctx.moveTo(p1.x, p1.y);\n ctx.lineTo(p2.x, p2.y);\n ctx.stroke();\n ctx.restore();\n };\n if (grid.display) {\n for (i = 0, ilen = items.length; i < ilen; ++i) {\n const item = items[i];\n if (grid.drawOnChartArea) {\n drawLine(\n {x: item.x1, y: item.y1},\n {x: item.x2, y: item.y2},\n item\n );\n }\n if (grid.drawTicks) {\n drawLine(\n {x: item.tx1, y: item.ty1},\n {x: item.tx2, y: item.ty2},\n {\n color: item.tickColor,\n width: item.tickWidth,\n borderDash: item.tickBorderDash,\n borderDashOffset: item.tickBorderDashOffset\n }\n );\n }\n }\n }\n }\n drawBorder() {\n const {chart, ctx, options: {grid}} = this;\n const borderOpts = grid.setContext(this.getContext());\n const axisWidth = grid.drawBorder ? borderOpts.borderWidth : 0;\n if (!axisWidth) {\n return;\n }\n const lastLineWidth = grid.setContext(this.getContext(0)).lineWidth;\n const borderValue = this._borderValue;\n let x1, x2, y1, y2;\n if (this.isHorizontal()) {\n x1 = _alignPixel(chart, this.left, axisWidth) - axisWidth / 2;\n x2 = _alignPixel(chart, this.right, lastLineWidth) + lastLineWidth / 2;\n y1 = y2 = borderValue;\n } else {\n y1 = _alignPixel(chart, this.top, axisWidth) - axisWidth / 2;\n y2 = _alignPixel(chart, this.bottom, lastLineWidth) + lastLineWidth / 2;\n x1 = x2 = borderValue;\n }\n ctx.save();\n ctx.lineWidth = borderOpts.borderWidth;\n ctx.strokeStyle = borderOpts.borderColor;\n ctx.beginPath();\n ctx.moveTo(x1, y1);\n ctx.lineTo(x2, y2);\n ctx.stroke();\n ctx.restore();\n }\n drawLabels(chartArea) {\n const optionTicks = this.options.ticks;\n if (!optionTicks.display) {\n return;\n }\n const ctx = this.ctx;\n const area = this._computeLabelArea();\n if (area) {\n clipArea(ctx, area);\n }\n const items = this._labelItems || (this._labelItems = this._computeLabelItems(chartArea));\n let i, ilen;\n for (i = 0, ilen = items.length; i < ilen; ++i) {\n const item = items[i];\n const tickFont = item.font;\n const label = item.label;\n if (item.backdrop) {\n ctx.fillStyle = item.backdrop.color;\n ctx.fillRect(item.backdrop.left, item.backdrop.top, item.backdrop.width, item.backdrop.height);\n }\n let y = item.textOffset;\n renderText(ctx, label, 0, y, tickFont, item);\n }\n if (area) {\n unclipArea(ctx);\n }\n }\n drawTitle() {\n const {ctx, options: {position, title, reverse}} = this;\n if (!title.display) {\n return;\n }\n const font = toFont(title.font);\n const padding = toPadding(title.padding);\n const align = title.align;\n let offset = font.lineHeight / 2;\n if (position === 'bottom' || position === 'center' || isObject(position)) {\n offset += padding.bottom;\n if (isArray(title.text)) {\n offset += font.lineHeight * (title.text.length - 1);\n }\n } else {\n offset += padding.top;\n }\n const {titleX, titleY, maxWidth, rotation} = titleArgs(this, offset, position, align);\n renderText(ctx, title.text, 0, 0, font, {\n color: title.color,\n maxWidth,\n rotation,\n textAlign: titleAlign(align, position, reverse),\n textBaseline: 'middle',\n translation: [titleX, titleY],\n });\n }\n draw(chartArea) {\n if (!this._isVisible()) {\n return;\n }\n this.drawBackground();\n this.drawGrid(chartArea);\n this.drawBorder();\n this.drawTitle();\n this.drawLabels(chartArea);\n }\n _layers() {\n const opts = this.options;\n const tz = opts.ticks && opts.ticks.z || 0;\n const gz = valueOrDefault(opts.grid && opts.grid.z, -1);\n if (!this._isVisible() || this.draw !== Scale.prototype.draw) {\n return [{\n z: tz,\n draw: (chartArea) => {\n this.draw(chartArea);\n }\n }];\n }\n return [{\n z: gz,\n draw: (chartArea) => {\n this.drawBackground();\n this.drawGrid(chartArea);\n this.drawTitle();\n }\n }, {\n z: gz + 1,\n draw: () => {\n this.drawBorder();\n }\n }, {\n z: tz,\n draw: (chartArea) => {\n this.drawLabels(chartArea);\n }\n }];\n }\n getMatchingVisibleMetas(type) {\n const metas = this.chart.getSortedVisibleDatasetMetas();\n const axisID = this.axis + 'AxisID';\n const result = [];\n let i, ilen;\n for (i = 0, ilen = metas.length; i < ilen; ++i) {\n const meta = metas[i];\n if (meta[axisID] === this.id && (!type || meta.type === type)) {\n result.push(meta);\n }\n }\n return result;\n }\n _resolveTickFontOptions(index) {\n const opts = this.options.ticks.setContext(this.getContext(index));\n return toFont(opts.font);\n }\n _maxDigits() {\n const fontSize = this._resolveTickFontOptions(0).lineHeight;\n return (this.isHorizontal() ? this.width : this.height) / fontSize;\n }\n}\n\nclass TypedRegistry {\n constructor(type, scope, override) {\n this.type = type;\n this.scope = scope;\n this.override = override;\n this.items = Object.create(null);\n }\n isForType(type) {\n return Object.prototype.isPrototypeOf.call(this.type.prototype, type.prototype);\n }\n register(item) {\n const proto = Object.getPrototypeOf(item);\n let parentScope;\n if (isIChartComponent(proto)) {\n parentScope = this.register(proto);\n }\n const items = this.items;\n const id = item.id;\n const scope = this.scope + '.' + id;\n if (!id) {\n throw new Error('class does not have id: ' + item);\n }\n if (id in items) {\n return scope;\n }\n items[id] = item;\n registerDefaults(item, scope, parentScope);\n if (this.override) {\n defaults.override(item.id, item.overrides);\n }\n return scope;\n }\n get(id) {\n return this.items[id];\n }\n unregister(item) {\n const items = this.items;\n const id = item.id;\n const scope = this.scope;\n if (id in items) {\n delete items[id];\n }\n if (scope && id in defaults[scope]) {\n delete defaults[scope][id];\n if (this.override) {\n delete overrides[id];\n }\n }\n }\n}\nfunction registerDefaults(item, scope, parentScope) {\n const itemDefaults = merge(Object.create(null), [\n parentScope ? defaults.get(parentScope) : {},\n defaults.get(scope),\n item.defaults\n ]);\n defaults.set(scope, itemDefaults);\n if (item.defaultRoutes) {\n routeDefaults(scope, item.defaultRoutes);\n }\n if (item.descriptors) {\n defaults.describe(scope, item.descriptors);\n }\n}\nfunction routeDefaults(scope, routes) {\n Object.keys(routes).forEach(property => {\n const propertyParts = property.split('.');\n const sourceName = propertyParts.pop();\n const sourceScope = [scope].concat(propertyParts).join('.');\n const parts = routes[property].split('.');\n const targetName = parts.pop();\n const targetScope = parts.join('.');\n defaults.route(sourceScope, sourceName, targetScope, targetName);\n });\n}\nfunction isIChartComponent(proto) {\n return 'id' in proto && 'defaults' in proto;\n}\n\nclass Registry {\n constructor() {\n this.controllers = new TypedRegistry(DatasetController, 'datasets', true);\n this.elements = new TypedRegistry(Element, 'elements');\n this.plugins = new TypedRegistry(Object, 'plugins');\n this.scales = new TypedRegistry(Scale, 'scales');\n this._typedRegistries = [this.controllers, this.scales, this.elements];\n }\n add(...args) {\n this._each('register', args);\n }\n remove(...args) {\n this._each('unregister', args);\n }\n addControllers(...args) {\n this._each('register', args, this.controllers);\n }\n addElements(...args) {\n this._each('register', args, this.elements);\n }\n addPlugins(...args) {\n this._each('register', args, this.plugins);\n }\n addScales(...args) {\n this._each('register', args, this.scales);\n }\n getController(id) {\n return this._get(id, this.controllers, 'controller');\n }\n getElement(id) {\n return this._get(id, this.elements, 'element');\n }\n getPlugin(id) {\n return this._get(id, this.plugins, 'plugin');\n }\n getScale(id) {\n return this._get(id, this.scales, 'scale');\n }\n removeControllers(...args) {\n this._each('unregister', args, this.controllers);\n }\n removeElements(...args) {\n this._each('unregister', args, this.elements);\n }\n removePlugins(...args) {\n this._each('unregister', args, this.plugins);\n }\n removeScales(...args) {\n this._each('unregister', args, this.scales);\n }\n _each(method, args, typedRegistry) {\n [...args].forEach(arg => {\n const reg = typedRegistry || this._getRegistryForType(arg);\n if (typedRegistry || reg.isForType(arg) || (reg === this.plugins && arg.id)) {\n this._exec(method, reg, arg);\n } else {\n each(arg, item => {\n const itemReg = typedRegistry || this._getRegistryForType(item);\n this._exec(method, itemReg, item);\n });\n }\n });\n }\n _exec(method, registry, component) {\n const camelMethod = _capitalize(method);\n callback(component['before' + camelMethod], [], component);\n registry[method](component);\n callback(component['after' + camelMethod], [], component);\n }\n _getRegistryForType(type) {\n for (let i = 0; i < this._typedRegistries.length; i++) {\n const reg = this._typedRegistries[i];\n if (reg.isForType(type)) {\n return reg;\n }\n }\n return this.plugins;\n }\n _get(id, typedRegistry, type) {\n const item = typedRegistry.get(id);\n if (item === undefined) {\n throw new Error('\"' + id + '\" is not a registered ' + type + '.');\n }\n return item;\n }\n}\nvar registry = new Registry();\n\nclass ScatterController extends DatasetController {\n update(mode) {\n const meta = this._cachedMeta;\n const {data: points = []} = meta;\n const animationsDisabled = this.chart._animationsDisabled;\n let {start, count} = _getStartAndCountOfVisiblePoints(meta, points, animationsDisabled);\n this._drawStart = start;\n this._drawCount = count;\n if (_scaleRangesChanged(meta)) {\n start = 0;\n count = points.length;\n }\n if (this.options.showLine) {\n const {dataset: line, _dataset} = meta;\n line._chart = this.chart;\n line._datasetIndex = this.index;\n line._decimated = !!_dataset._decimated;\n line.points = points;\n const options = this.resolveDatasetElementOptions(mode);\n options.segment = this.options.segment;\n this.updateElement(line, undefined, {\n animated: !animationsDisabled,\n options\n }, mode);\n }\n this.updateElements(points, start, count, mode);\n }\n addElements() {\n const {showLine} = this.options;\n if (!this.datasetElementType && showLine) {\n this.datasetElementType = registry.getElement('line');\n }\n super.addElements();\n }\n updateElements(points, start, count, mode) {\n const reset = mode === 'reset';\n const {iScale, vScale, _stacked, _dataset} = this._cachedMeta;\n const firstOpts = this.resolveDataElementOptions(start, mode);\n const sharedOptions = this.getSharedOptions(firstOpts);\n const includeOptions = this.includeOptions(mode, sharedOptions);\n const iAxis = iScale.axis;\n const vAxis = vScale.axis;\n const {spanGaps, segment} = this.options;\n const maxGapLength = isNumber(spanGaps) ? spanGaps : Number.POSITIVE_INFINITY;\n const directUpdate = this.chart._animationsDisabled || reset || mode === 'none';\n let prevParsed = start > 0 && this.getParsed(start - 1);\n for (let i = start; i < start + count; ++i) {\n const point = points[i];\n const parsed = this.getParsed(i);\n const properties = directUpdate ? point : {};\n const nullData = isNullOrUndef(parsed[vAxis]);\n const iPixel = properties[iAxis] = iScale.getPixelForValue(parsed[iAxis], i);\n const vPixel = properties[vAxis] = reset || nullData ? vScale.getBasePixel() : vScale.getPixelForValue(_stacked ? this.applyStack(vScale, parsed, _stacked) : parsed[vAxis], i);\n properties.skip = isNaN(iPixel) || isNaN(vPixel) || nullData;\n properties.stop = i > 0 && (Math.abs(parsed[iAxis] - prevParsed[iAxis])) > maxGapLength;\n if (segment) {\n properties.parsed = parsed;\n properties.raw = _dataset.data[i];\n }\n if (includeOptions) {\n properties.options = sharedOptions || this.resolveDataElementOptions(i, point.active ? 'active' : mode);\n }\n if (!directUpdate) {\n this.updateElement(point, i, properties, mode);\n }\n prevParsed = parsed;\n }\n this.updateSharedOptions(sharedOptions, mode, firstOpts);\n }\n getMaxOverflow() {\n const meta = this._cachedMeta;\n const data = meta.data || [];\n if (!this.options.showLine) {\n let max = 0;\n for (let i = data.length - 1; i >= 0; --i) {\n max = Math.max(max, data[i].size(this.resolveDataElementOptions(i)) / 2);\n }\n return max > 0 && max;\n }\n const dataset = meta.dataset;\n const border = dataset.options && dataset.options.borderWidth || 0;\n if (!data.length) {\n return border;\n }\n const firstPoint = data[0].size(this.resolveDataElementOptions(0));\n const lastPoint = data[data.length - 1].size(this.resolveDataElementOptions(data.length - 1));\n return Math.max(border, firstPoint, lastPoint) / 2;\n }\n}\nScatterController.id = 'scatter';\nScatterController.defaults = {\n datasetElementType: false,\n dataElementType: 'point',\n showLine: false,\n fill: false\n};\nScatterController.overrides = {\n interaction: {\n mode: 'point'\n },\n plugins: {\n tooltip: {\n callbacks: {\n title() {\n return '';\n },\n label(item) {\n return '(' + item.label + ', ' + item.formattedValue + ')';\n }\n }\n }\n },\n scales: {\n x: {\n type: 'linear'\n },\n y: {\n type: 'linear'\n }\n }\n};\n\nvar controllers = /*#__PURE__*/Object.freeze({\n__proto__: null,\nBarController: BarController,\nBubbleController: BubbleController,\nDoughnutController: DoughnutController,\nLineController: LineController,\nPolarAreaController: PolarAreaController,\nPieController: PieController,\nRadarController: RadarController,\nScatterController: ScatterController\n});\n\nfunction abstract() {\n throw new Error('This method is not implemented: Check that a complete date adapter is provided.');\n}\nclass DateAdapter {\n constructor(options) {\n this.options = options || {};\n }\n init(chartOptions) {}\n formats() {\n return abstract();\n }\n parse(value, format) {\n return abstract();\n }\n format(timestamp, format) {\n return abstract();\n }\n add(timestamp, amount, unit) {\n return abstract();\n }\n diff(a, b, unit) {\n return abstract();\n }\n startOf(timestamp, unit, weekday) {\n return abstract();\n }\n endOf(timestamp, unit) {\n return abstract();\n }\n}\nDateAdapter.override = function(members) {\n Object.assign(DateAdapter.prototype, members);\n};\nvar adapters = {\n _date: DateAdapter\n};\n\nfunction binarySearch(metaset, axis, value, intersect) {\n const {controller, data, _sorted} = metaset;\n const iScale = controller._cachedMeta.iScale;\n if (iScale && axis === iScale.axis && axis !== 'r' && _sorted && data.length) {\n const lookupMethod = iScale._reversePixels ? _rlookupByKey : _lookupByKey;\n if (!intersect) {\n return lookupMethod(data, axis, value);\n } else if (controller._sharedOptions) {\n const el = data[0];\n const range = typeof el.getRange === 'function' && el.getRange(axis);\n if (range) {\n const start = lookupMethod(data, axis, value - range);\n const end = lookupMethod(data, axis, value + range);\n return {lo: start.lo, hi: end.hi};\n }\n }\n }\n return {lo: 0, hi: data.length - 1};\n}\nfunction evaluateInteractionItems(chart, axis, position, handler, intersect) {\n const metasets = chart.getSortedVisibleDatasetMetas();\n const value = position[axis];\n for (let i = 0, ilen = metasets.length; i < ilen; ++i) {\n const {index, data} = metasets[i];\n const {lo, hi} = binarySearch(metasets[i], axis, value, intersect);\n for (let j = lo; j <= hi; ++j) {\n const element = data[j];\n if (!element.skip) {\n handler(element, index, j);\n }\n }\n }\n}\nfunction getDistanceMetricForAxis(axis) {\n const useX = axis.indexOf('x') !== -1;\n const useY = axis.indexOf('y') !== -1;\n return function(pt1, pt2) {\n const deltaX = useX ? Math.abs(pt1.x - pt2.x) : 0;\n const deltaY = useY ? Math.abs(pt1.y - pt2.y) : 0;\n return Math.sqrt(Math.pow(deltaX, 2) + Math.pow(deltaY, 2));\n };\n}\nfunction getIntersectItems(chart, position, axis, useFinalPosition, includeInvisible) {\n const items = [];\n if (!includeInvisible && !chart.isPointInArea(position)) {\n return items;\n }\n const evaluationFunc = function(element, datasetIndex, index) {\n if (!includeInvisible && !_isPointInArea(element, chart.chartArea, 0)) {\n return;\n }\n if (element.inRange(position.x, position.y, useFinalPosition)) {\n items.push({element, datasetIndex, index});\n }\n };\n evaluateInteractionItems(chart, axis, position, evaluationFunc, true);\n return items;\n}\nfunction getNearestRadialItems(chart, position, axis, useFinalPosition) {\n let items = [];\n function evaluationFunc(element, datasetIndex, index) {\n const {startAngle, endAngle} = element.getProps(['startAngle', 'endAngle'], useFinalPosition);\n const {angle} = getAngleFromPoint(element, {x: position.x, y: position.y});\n if (_angleBetween(angle, startAngle, endAngle)) {\n items.push({element, datasetIndex, index});\n }\n }\n evaluateInteractionItems(chart, axis, position, evaluationFunc);\n return items;\n}\nfunction getNearestCartesianItems(chart, position, axis, intersect, useFinalPosition, includeInvisible) {\n let items = [];\n const distanceMetric = getDistanceMetricForAxis(axis);\n let minDistance = Number.POSITIVE_INFINITY;\n function evaluationFunc(element, datasetIndex, index) {\n const inRange = element.inRange(position.x, position.y, useFinalPosition);\n if (intersect && !inRange) {\n return;\n }\n const center = element.getCenterPoint(useFinalPosition);\n const pointInArea = !!includeInvisible || chart.isPointInArea(center);\n if (!pointInArea && !inRange) {\n return;\n }\n const distance = distanceMetric(position, center);\n if (distance < minDistance) {\n items = [{element, datasetIndex, index}];\n minDistance = distance;\n } else if (distance === minDistance) {\n items.push({element, datasetIndex, index});\n }\n }\n evaluateInteractionItems(chart, axis, position, evaluationFunc);\n return items;\n}\nfunction getNearestItems(chart, position, axis, intersect, useFinalPosition, includeInvisible) {\n if (!includeInvisible && !chart.isPointInArea(position)) {\n return [];\n }\n return axis === 'r' && !intersect\n ? getNearestRadialItems(chart, position, axis, useFinalPosition)\n : getNearestCartesianItems(chart, position, axis, intersect, useFinalPosition, includeInvisible);\n}\nfunction getAxisItems(chart, position, axis, intersect, useFinalPosition) {\n const items = [];\n const rangeMethod = axis === 'x' ? 'inXRange' : 'inYRange';\n let intersectsItem = false;\n evaluateInteractionItems(chart, axis, position, (element, datasetIndex, index) => {\n if (element[rangeMethod](position[axis], useFinalPosition)) {\n items.push({element, datasetIndex, index});\n intersectsItem = intersectsItem || element.inRange(position.x, position.y, useFinalPosition);\n }\n });\n if (intersect && !intersectsItem) {\n return [];\n }\n return items;\n}\nvar Interaction = {\n evaluateInteractionItems,\n modes: {\n index(chart, e, options, useFinalPosition) {\n const position = getRelativePosition(e, chart);\n const axis = options.axis || 'x';\n const includeInvisible = options.includeInvisible || false;\n const items = options.intersect\n ? getIntersectItems(chart, position, axis, useFinalPosition, includeInvisible)\n : getNearestItems(chart, position, axis, false, useFinalPosition, includeInvisible);\n const elements = [];\n if (!items.length) {\n return [];\n }\n chart.getSortedVisibleDatasetMetas().forEach((meta) => {\n const index = items[0].index;\n const element = meta.data[index];\n if (element && !element.skip) {\n elements.push({element, datasetIndex: meta.index, index});\n }\n });\n return elements;\n },\n dataset(chart, e, options, useFinalPosition) {\n const position = getRelativePosition(e, chart);\n const axis = options.axis || 'xy';\n const includeInvisible = options.includeInvisible || false;\n let items = options.intersect\n ? getIntersectItems(chart, position, axis, useFinalPosition, includeInvisible) :\n getNearestItems(chart, position, axis, false, useFinalPosition, includeInvisible);\n if (items.length > 0) {\n const datasetIndex = items[0].datasetIndex;\n const data = chart.getDatasetMeta(datasetIndex).data;\n items = [];\n for (let i = 0; i < data.length; ++i) {\n items.push({element: data[i], datasetIndex, index: i});\n }\n }\n return items;\n },\n point(chart, e, options, useFinalPosition) {\n const position = getRelativePosition(e, chart);\n const axis = options.axis || 'xy';\n const includeInvisible = options.includeInvisible || false;\n return getIntersectItems(chart, position, axis, useFinalPosition, includeInvisible);\n },\n nearest(chart, e, options, useFinalPosition) {\n const position = getRelativePosition(e, chart);\n const axis = options.axis || 'xy';\n const includeInvisible = options.includeInvisible || false;\n return getNearestItems(chart, position, axis, options.intersect, useFinalPosition, includeInvisible);\n },\n x(chart, e, options, useFinalPosition) {\n const position = getRelativePosition(e, chart);\n return getAxisItems(chart, position, 'x', options.intersect, useFinalPosition);\n },\n y(chart, e, options, useFinalPosition) {\n const position = getRelativePosition(e, chart);\n return getAxisItems(chart, position, 'y', options.intersect, useFinalPosition);\n }\n }\n};\n\nconst STATIC_POSITIONS = ['left', 'top', 'right', 'bottom'];\nfunction filterByPosition(array, position) {\n return array.filter(v => v.pos === position);\n}\nfunction filterDynamicPositionByAxis(array, axis) {\n return array.filter(v => STATIC_POSITIONS.indexOf(v.pos) === -1 && v.box.axis === axis);\n}\nfunction sortByWeight(array, reverse) {\n return array.sort((a, b) => {\n const v0 = reverse ? b : a;\n const v1 = reverse ? a : b;\n return v0.weight === v1.weight ?\n v0.index - v1.index :\n v0.weight - v1.weight;\n });\n}\nfunction wrapBoxes(boxes) {\n const layoutBoxes = [];\n let i, ilen, box, pos, stack, stackWeight;\n for (i = 0, ilen = (boxes || []).length; i < ilen; ++i) {\n box = boxes[i];\n ({position: pos, options: {stack, stackWeight = 1}} = box);\n layoutBoxes.push({\n index: i,\n box,\n pos,\n horizontal: box.isHorizontal(),\n weight: box.weight,\n stack: stack && (pos + stack),\n stackWeight\n });\n }\n return layoutBoxes;\n}\nfunction buildStacks(layouts) {\n const stacks = {};\n for (const wrap of layouts) {\n const {stack, pos, stackWeight} = wrap;\n if (!stack || !STATIC_POSITIONS.includes(pos)) {\n continue;\n }\n const _stack = stacks[stack] || (stacks[stack] = {count: 0, placed: 0, weight: 0, size: 0});\n _stack.count++;\n _stack.weight += stackWeight;\n }\n return stacks;\n}\nfunction setLayoutDims(layouts, params) {\n const stacks = buildStacks(layouts);\n const {vBoxMaxWidth, hBoxMaxHeight} = params;\n let i, ilen, layout;\n for (i = 0, ilen = layouts.length; i < ilen; ++i) {\n layout = layouts[i];\n const {fullSize} = layout.box;\n const stack = stacks[layout.stack];\n const factor = stack && layout.stackWeight / stack.weight;\n if (layout.horizontal) {\n layout.width = factor ? factor * vBoxMaxWidth : fullSize && params.availableWidth;\n layout.height = hBoxMaxHeight;\n } else {\n layout.width = vBoxMaxWidth;\n layout.height = factor ? factor * hBoxMaxHeight : fullSize && params.availableHeight;\n }\n }\n return stacks;\n}\nfunction buildLayoutBoxes(boxes) {\n const layoutBoxes = wrapBoxes(boxes);\n const fullSize = sortByWeight(layoutBoxes.filter(wrap => wrap.box.fullSize), true);\n const left = sortByWeight(filterByPosition(layoutBoxes, 'left'), true);\n const right = sortByWeight(filterByPosition(layoutBoxes, 'right'));\n const top = sortByWeight(filterByPosition(layoutBoxes, 'top'), true);\n const bottom = sortByWeight(filterByPosition(layoutBoxes, 'bottom'));\n const centerHorizontal = filterDynamicPositionByAxis(layoutBoxes, 'x');\n const centerVertical = filterDynamicPositionByAxis(layoutBoxes, 'y');\n return {\n fullSize,\n leftAndTop: left.concat(top),\n rightAndBottom: right.concat(centerVertical).concat(bottom).concat(centerHorizontal),\n chartArea: filterByPosition(layoutBoxes, 'chartArea'),\n vertical: left.concat(right).concat(centerVertical),\n horizontal: top.concat(bottom).concat(centerHorizontal)\n };\n}\nfunction getCombinedMax(maxPadding, chartArea, a, b) {\n return Math.max(maxPadding[a], chartArea[a]) + Math.max(maxPadding[b], chartArea[b]);\n}\nfunction updateMaxPadding(maxPadding, boxPadding) {\n maxPadding.top = Math.max(maxPadding.top, boxPadding.top);\n maxPadding.left = Math.max(maxPadding.left, boxPadding.left);\n maxPadding.bottom = Math.max(maxPadding.bottom, boxPadding.bottom);\n maxPadding.right = Math.max(maxPadding.right, boxPadding.right);\n}\nfunction updateDims(chartArea, params, layout, stacks) {\n const {pos, box} = layout;\n const maxPadding = chartArea.maxPadding;\n if (!isObject(pos)) {\n if (layout.size) {\n chartArea[pos] -= layout.size;\n }\n const stack = stacks[layout.stack] || {size: 0, count: 1};\n stack.size = Math.max(stack.size, layout.horizontal ? box.height : box.width);\n layout.size = stack.size / stack.count;\n chartArea[pos] += layout.size;\n }\n if (box.getPadding) {\n updateMaxPadding(maxPadding, box.getPadding());\n }\n const newWidth = Math.max(0, params.outerWidth - getCombinedMax(maxPadding, chartArea, 'left', 'right'));\n const newHeight = Math.max(0, params.outerHeight - getCombinedMax(maxPadding, chartArea, 'top', 'bottom'));\n const widthChanged = newWidth !== chartArea.w;\n const heightChanged = newHeight !== chartArea.h;\n chartArea.w = newWidth;\n chartArea.h = newHeight;\n return layout.horizontal\n ? {same: widthChanged, other: heightChanged}\n : {same: heightChanged, other: widthChanged};\n}\nfunction handleMaxPadding(chartArea) {\n const maxPadding = chartArea.maxPadding;\n function updatePos(pos) {\n const change = Math.max(maxPadding[pos] - chartArea[pos], 0);\n chartArea[pos] += change;\n return change;\n }\n chartArea.y += updatePos('top');\n chartArea.x += updatePos('left');\n updatePos('right');\n updatePos('bottom');\n}\nfunction getMargins(horizontal, chartArea) {\n const maxPadding = chartArea.maxPadding;\n function marginForPositions(positions) {\n const margin = {left: 0, top: 0, right: 0, bottom: 0};\n positions.forEach((pos) => {\n margin[pos] = Math.max(chartArea[pos], maxPadding[pos]);\n });\n return margin;\n }\n return horizontal\n ? marginForPositions(['left', 'right'])\n : marginForPositions(['top', 'bottom']);\n}\nfunction fitBoxes(boxes, chartArea, params, stacks) {\n const refitBoxes = [];\n let i, ilen, layout, box, refit, changed;\n for (i = 0, ilen = boxes.length, refit = 0; i < ilen; ++i) {\n layout = boxes[i];\n box = layout.box;\n box.update(\n layout.width || chartArea.w,\n layout.height || chartArea.h,\n getMargins(layout.horizontal, chartArea)\n );\n const {same, other} = updateDims(chartArea, params, layout, stacks);\n refit |= same && refitBoxes.length;\n changed = changed || other;\n if (!box.fullSize) {\n refitBoxes.push(layout);\n }\n }\n return refit && fitBoxes(refitBoxes, chartArea, params, stacks) || changed;\n}\nfunction setBoxDims(box, left, top, width, height) {\n box.top = top;\n box.left = left;\n box.right = left + width;\n box.bottom = top + height;\n box.width = width;\n box.height = height;\n}\nfunction placeBoxes(boxes, chartArea, params, stacks) {\n const userPadding = params.padding;\n let {x, y} = chartArea;\n for (const layout of boxes) {\n const box = layout.box;\n const stack = stacks[layout.stack] || {count: 1, placed: 0, weight: 1};\n const weight = (layout.stackWeight / stack.weight) || 1;\n if (layout.horizontal) {\n const width = chartArea.w * weight;\n const height = stack.size || box.height;\n if (defined(stack.start)) {\n y = stack.start;\n }\n if (box.fullSize) {\n setBoxDims(box, userPadding.left, y, params.outerWidth - userPadding.right - userPadding.left, height);\n } else {\n setBoxDims(box, chartArea.left + stack.placed, y, width, height);\n }\n stack.start = y;\n stack.placed += width;\n y = box.bottom;\n } else {\n const height = chartArea.h * weight;\n const width = stack.size || box.width;\n if (defined(stack.start)) {\n x = stack.start;\n }\n if (box.fullSize) {\n setBoxDims(box, x, userPadding.top, width, params.outerHeight - userPadding.bottom - userPadding.top);\n } else {\n setBoxDims(box, x, chartArea.top + stack.placed, width, height);\n }\n stack.start = x;\n stack.placed += height;\n x = box.right;\n }\n }\n chartArea.x = x;\n chartArea.y = y;\n}\ndefaults.set('layout', {\n autoPadding: true,\n padding: {\n top: 0,\n right: 0,\n bottom: 0,\n left: 0\n }\n});\nvar layouts = {\n addBox(chart, item) {\n if (!chart.boxes) {\n chart.boxes = [];\n }\n item.fullSize = item.fullSize || false;\n item.position = item.position || 'top';\n item.weight = item.weight || 0;\n item._layers = item._layers || function() {\n return [{\n z: 0,\n draw(chartArea) {\n item.draw(chartArea);\n }\n }];\n };\n chart.boxes.push(item);\n },\n removeBox(chart, layoutItem) {\n const index = chart.boxes ? chart.boxes.indexOf(layoutItem) : -1;\n if (index !== -1) {\n chart.boxes.splice(index, 1);\n }\n },\n configure(chart, item, options) {\n item.fullSize = options.fullSize;\n item.position = options.position;\n item.weight = options.weight;\n },\n update(chart, width, height, minPadding) {\n if (!chart) {\n return;\n }\n const padding = toPadding(chart.options.layout.padding);\n const availableWidth = Math.max(width - padding.width, 0);\n const availableHeight = Math.max(height - padding.height, 0);\n const boxes = buildLayoutBoxes(chart.boxes);\n const verticalBoxes = boxes.vertical;\n const horizontalBoxes = boxes.horizontal;\n each(chart.boxes, box => {\n if (typeof box.beforeLayout === 'function') {\n box.beforeLayout();\n }\n });\n const visibleVerticalBoxCount = verticalBoxes.reduce((total, wrap) =>\n wrap.box.options && wrap.box.options.display === false ? total : total + 1, 0) || 1;\n const params = Object.freeze({\n outerWidth: width,\n outerHeight: height,\n padding,\n availableWidth,\n availableHeight,\n vBoxMaxWidth: availableWidth / 2 / visibleVerticalBoxCount,\n hBoxMaxHeight: availableHeight / 2\n });\n const maxPadding = Object.assign({}, padding);\n updateMaxPadding(maxPadding, toPadding(minPadding));\n const chartArea = Object.assign({\n maxPadding,\n w: availableWidth,\n h: availableHeight,\n x: padding.left,\n y: padding.top\n }, padding);\n const stacks = setLayoutDims(verticalBoxes.concat(horizontalBoxes), params);\n fitBoxes(boxes.fullSize, chartArea, params, stacks);\n fitBoxes(verticalBoxes, chartArea, params, stacks);\n if (fitBoxes(horizontalBoxes, chartArea, params, stacks)) {\n fitBoxes(verticalBoxes, chartArea, params, stacks);\n }\n handleMaxPadding(chartArea);\n placeBoxes(boxes.leftAndTop, chartArea, params, stacks);\n chartArea.x += chartArea.w;\n chartArea.y += chartArea.h;\n placeBoxes(boxes.rightAndBottom, chartArea, params, stacks);\n chart.chartArea = {\n left: chartArea.left,\n top: chartArea.top,\n right: chartArea.left + chartArea.w,\n bottom: chartArea.top + chartArea.h,\n height: chartArea.h,\n width: chartArea.w,\n };\n each(boxes.chartArea, (layout) => {\n const box = layout.box;\n Object.assign(box, chart.chartArea);\n box.update(chartArea.w, chartArea.h, {left: 0, top: 0, right: 0, bottom: 0});\n });\n }\n};\n\nclass BasePlatform {\n acquireContext(canvas, aspectRatio) {}\n releaseContext(context) {\n return false;\n }\n addEventListener(chart, type, listener) {}\n removeEventListener(chart, type, listener) {}\n getDevicePixelRatio() {\n return 1;\n }\n getMaximumSize(element, width, height, aspectRatio) {\n width = Math.max(0, width || element.width);\n height = height || element.height;\n return {\n width,\n height: Math.max(0, aspectRatio ? Math.floor(width / aspectRatio) : height)\n };\n }\n isAttached(canvas) {\n return true;\n }\n updateConfig(config) {\n }\n}\n\nclass BasicPlatform extends BasePlatform {\n acquireContext(item) {\n return item && item.getContext && item.getContext('2d') || null;\n }\n updateConfig(config) {\n config.options.animation = false;\n }\n}\n\nconst EXPANDO_KEY = '$chartjs';\nconst EVENT_TYPES = {\n touchstart: 'mousedown',\n touchmove: 'mousemove',\n touchend: 'mouseup',\n pointerenter: 'mouseenter',\n pointerdown: 'mousedown',\n pointermove: 'mousemove',\n pointerup: 'mouseup',\n pointerleave: 'mouseout',\n pointerout: 'mouseout'\n};\nconst isNullOrEmpty = value => value === null || value === '';\nfunction initCanvas(canvas, aspectRatio) {\n const style = canvas.style;\n const renderHeight = canvas.getAttribute('height');\n const renderWidth = canvas.getAttribute('width');\n canvas[EXPANDO_KEY] = {\n initial: {\n height: renderHeight,\n width: renderWidth,\n style: {\n display: style.display,\n height: style.height,\n width: style.width\n }\n }\n };\n style.display = style.display || 'block';\n style.boxSizing = style.boxSizing || 'border-box';\n if (isNullOrEmpty(renderWidth)) {\n const displayWidth = readUsedSize(canvas, 'width');\n if (displayWidth !== undefined) {\n canvas.width = displayWidth;\n }\n }\n if (isNullOrEmpty(renderHeight)) {\n if (canvas.style.height === '') {\n canvas.height = canvas.width / (aspectRatio || 2);\n } else {\n const displayHeight = readUsedSize(canvas, 'height');\n if (displayHeight !== undefined) {\n canvas.height = displayHeight;\n }\n }\n }\n return canvas;\n}\nconst eventListenerOptions = supportsEventListenerOptions ? {passive: true} : false;\nfunction addListener(node, type, listener) {\n node.addEventListener(type, listener, eventListenerOptions);\n}\nfunction removeListener(chart, type, listener) {\n chart.canvas.removeEventListener(type, listener, eventListenerOptions);\n}\nfunction fromNativeEvent(event, chart) {\n const type = EVENT_TYPES[event.type] || event.type;\n const {x, y} = getRelativePosition(event, chart);\n return {\n type,\n chart,\n native: event,\n x: x !== undefined ? x : null,\n y: y !== undefined ? y : null,\n };\n}\nfunction nodeListContains(nodeList, canvas) {\n for (const node of nodeList) {\n if (node === canvas || node.contains(canvas)) {\n return true;\n }\n }\n}\nfunction createAttachObserver(chart, type, listener) {\n const canvas = chart.canvas;\n const observer = new MutationObserver(entries => {\n let trigger = false;\n for (const entry of entries) {\n trigger = trigger || nodeListContains(entry.addedNodes, canvas);\n trigger = trigger && !nodeListContains(entry.removedNodes, canvas);\n }\n if (trigger) {\n listener();\n }\n });\n observer.observe(document, {childList: true, subtree: true});\n return observer;\n}\nfunction createDetachObserver(chart, type, listener) {\n const canvas = chart.canvas;\n const observer = new MutationObserver(entries => {\n let trigger = false;\n for (const entry of entries) {\n trigger = trigger || nodeListContains(entry.removedNodes, canvas);\n trigger = trigger && !nodeListContains(entry.addedNodes, canvas);\n }\n if (trigger) {\n listener();\n }\n });\n observer.observe(document, {childList: true, subtree: true});\n return observer;\n}\nconst drpListeningCharts = new Map();\nlet oldDevicePixelRatio = 0;\nfunction onWindowResize() {\n const dpr = window.devicePixelRatio;\n if (dpr === oldDevicePixelRatio) {\n return;\n }\n oldDevicePixelRatio = dpr;\n drpListeningCharts.forEach((resize, chart) => {\n if (chart.currentDevicePixelRatio !== dpr) {\n resize();\n }\n });\n}\nfunction listenDevicePixelRatioChanges(chart, resize) {\n if (!drpListeningCharts.size) {\n window.addEventListener('resize', onWindowResize);\n }\n drpListeningCharts.set(chart, resize);\n}\nfunction unlistenDevicePixelRatioChanges(chart) {\n drpListeningCharts.delete(chart);\n if (!drpListeningCharts.size) {\n window.removeEventListener('resize', onWindowResize);\n }\n}\nfunction createResizeObserver(chart, type, listener) {\n const canvas = chart.canvas;\n const container = canvas && _getParentNode(canvas);\n if (!container) {\n return;\n }\n const resize = throttled((width, height) => {\n const w = container.clientWidth;\n listener(width, height);\n if (w < container.clientWidth) {\n listener();\n }\n }, window);\n const observer = new ResizeObserver(entries => {\n const entry = entries[0];\n const width = entry.contentRect.width;\n const height = entry.contentRect.height;\n if (width === 0 && height === 0) {\n return;\n }\n resize(width, height);\n });\n observer.observe(container);\n listenDevicePixelRatioChanges(chart, resize);\n return observer;\n}\nfunction releaseObserver(chart, type, observer) {\n if (observer) {\n observer.disconnect();\n }\n if (type === 'resize') {\n unlistenDevicePixelRatioChanges(chart);\n }\n}\nfunction createProxyAndListen(chart, type, listener) {\n const canvas = chart.canvas;\n const proxy = throttled((event) => {\n if (chart.ctx !== null) {\n listener(fromNativeEvent(event, chart));\n }\n }, chart, (args) => {\n const event = args[0];\n return [event, event.offsetX, event.offsetY];\n });\n addListener(canvas, type, proxy);\n return proxy;\n}\nclass DomPlatform extends BasePlatform {\n acquireContext(canvas, aspectRatio) {\n const context = canvas && canvas.getContext && canvas.getContext('2d');\n if (context && context.canvas === canvas) {\n initCanvas(canvas, aspectRatio);\n return context;\n }\n return null;\n }\n releaseContext(context) {\n const canvas = context.canvas;\n if (!canvas[EXPANDO_KEY]) {\n return false;\n }\n const initial = canvas[EXPANDO_KEY].initial;\n ['height', 'width'].forEach((prop) => {\n const value = initial[prop];\n if (isNullOrUndef(value)) {\n canvas.removeAttribute(prop);\n } else {\n canvas.setAttribute(prop, value);\n }\n });\n const style = initial.style || {};\n Object.keys(style).forEach((key) => {\n canvas.style[key] = style[key];\n });\n canvas.width = canvas.width;\n delete canvas[EXPANDO_KEY];\n return true;\n }\n addEventListener(chart, type, listener) {\n this.removeEventListener(chart, type);\n const proxies = chart.$proxies || (chart.$proxies = {});\n const handlers = {\n attach: createAttachObserver,\n detach: createDetachObserver,\n resize: createResizeObserver\n };\n const handler = handlers[type] || createProxyAndListen;\n proxies[type] = handler(chart, type, listener);\n }\n removeEventListener(chart, type) {\n const proxies = chart.$proxies || (chart.$proxies = {});\n const proxy = proxies[type];\n if (!proxy) {\n return;\n }\n const handlers = {\n attach: releaseObserver,\n detach: releaseObserver,\n resize: releaseObserver\n };\n const handler = handlers[type] || removeListener;\n handler(chart, type, proxy);\n proxies[type] = undefined;\n }\n getDevicePixelRatio() {\n return window.devicePixelRatio;\n }\n getMaximumSize(canvas, width, height, aspectRatio) {\n return getMaximumSize(canvas, width, height, aspectRatio);\n }\n isAttached(canvas) {\n const container = _getParentNode(canvas);\n return !!(container && container.isConnected);\n }\n}\n\nfunction _detectPlatform(canvas) {\n if (!_isDomSupported() || (typeof OffscreenCanvas !== 'undefined' && canvas instanceof OffscreenCanvas)) {\n return BasicPlatform;\n }\n return DomPlatform;\n}\n\nclass PluginService {\n constructor() {\n this._init = [];\n }\n notify(chart, hook, args, filter) {\n if (hook === 'beforeInit') {\n this._init = this._createDescriptors(chart, true);\n this._notify(this._init, chart, 'install');\n }\n const descriptors = filter ? this._descriptors(chart).filter(filter) : this._descriptors(chart);\n const result = this._notify(descriptors, chart, hook, args);\n if (hook === 'afterDestroy') {\n this._notify(descriptors, chart, 'stop');\n this._notify(this._init, chart, 'uninstall');\n }\n return result;\n }\n _notify(descriptors, chart, hook, args) {\n args = args || {};\n for (const descriptor of descriptors) {\n const plugin = descriptor.plugin;\n const method = plugin[hook];\n const params = [chart, args, descriptor.options];\n if (callback(method, params, plugin) === false && args.cancelable) {\n return false;\n }\n }\n return true;\n }\n invalidate() {\n if (!isNullOrUndef(this._cache)) {\n this._oldCache = this._cache;\n this._cache = undefined;\n }\n }\n _descriptors(chart) {\n if (this._cache) {\n return this._cache;\n }\n const descriptors = this._cache = this._createDescriptors(chart);\n this._notifyStateChanges(chart);\n return descriptors;\n }\n _createDescriptors(chart, all) {\n const config = chart && chart.config;\n const options = valueOrDefault(config.options && config.options.plugins, {});\n const plugins = allPlugins(config);\n return options === false && !all ? [] : createDescriptors(chart, plugins, options, all);\n }\n _notifyStateChanges(chart) {\n const previousDescriptors = this._oldCache || [];\n const descriptors = this._cache;\n const diff = (a, b) => a.filter(x => !b.some(y => x.plugin.id === y.plugin.id));\n this._notify(diff(previousDescriptors, descriptors), chart, 'stop');\n this._notify(diff(descriptors, previousDescriptors), chart, 'start');\n }\n}\nfunction allPlugins(config) {\n const localIds = {};\n const plugins = [];\n const keys = Object.keys(registry.plugins.items);\n for (let i = 0; i < keys.length; i++) {\n plugins.push(registry.getPlugin(keys[i]));\n }\n const local = config.plugins || [];\n for (let i = 0; i < local.length; i++) {\n const plugin = local[i];\n if (plugins.indexOf(plugin) === -1) {\n plugins.push(plugin);\n localIds[plugin.id] = true;\n }\n }\n return {plugins, localIds};\n}\nfunction getOpts(options, all) {\n if (!all && options === false) {\n return null;\n }\n if (options === true) {\n return {};\n }\n return options;\n}\nfunction createDescriptors(chart, {plugins, localIds}, options, all) {\n const result = [];\n const context = chart.getContext();\n for (const plugin of plugins) {\n const id = plugin.id;\n const opts = getOpts(options[id], all);\n if (opts === null) {\n continue;\n }\n result.push({\n plugin,\n options: pluginOpts(chart.config, {plugin, local: localIds[id]}, opts, context)\n });\n }\n return result;\n}\nfunction pluginOpts(config, {plugin, local}, opts, context) {\n const keys = config.pluginScopeKeys(plugin);\n const scopes = config.getOptionScopes(opts, keys);\n if (local && plugin.defaults) {\n scopes.push(plugin.defaults);\n }\n return config.createResolver(scopes, context, [''], {\n scriptable: false,\n indexable: false,\n allKeys: true\n });\n}\n\nfunction getIndexAxis(type, options) {\n const datasetDefaults = defaults.datasets[type] || {};\n const datasetOptions = (options.datasets || {})[type] || {};\n return datasetOptions.indexAxis || options.indexAxis || datasetDefaults.indexAxis || 'x';\n}\nfunction getAxisFromDefaultScaleID(id, indexAxis) {\n let axis = id;\n if (id === '_index_') {\n axis = indexAxis;\n } else if (id === '_value_') {\n axis = indexAxis === 'x' ? 'y' : 'x';\n }\n return axis;\n}\nfunction getDefaultScaleIDFromAxis(axis, indexAxis) {\n return axis === indexAxis ? '_index_' : '_value_';\n}\nfunction axisFromPosition(position) {\n if (position === 'top' || position === 'bottom') {\n return 'x';\n }\n if (position === 'left' || position === 'right') {\n return 'y';\n }\n}\nfunction determineAxis(id, scaleOptions) {\n if (id === 'x' || id === 'y') {\n return id;\n }\n return scaleOptions.axis || axisFromPosition(scaleOptions.position) || id.charAt(0).toLowerCase();\n}\nfunction mergeScaleConfig(config, options) {\n const chartDefaults = overrides[config.type] || {scales: {}};\n const configScales = options.scales || {};\n const chartIndexAxis = getIndexAxis(config.type, options);\n const firstIDs = Object.create(null);\n const scales = Object.create(null);\n Object.keys(configScales).forEach(id => {\n const scaleConf = configScales[id];\n if (!isObject(scaleConf)) {\n return console.error(`Invalid scale configuration for scale: ${id}`);\n }\n if (scaleConf._proxy) {\n return console.warn(`Ignoring resolver passed as options for scale: ${id}`);\n }\n const axis = determineAxis(id, scaleConf);\n const defaultId = getDefaultScaleIDFromAxis(axis, chartIndexAxis);\n const defaultScaleOptions = chartDefaults.scales || {};\n firstIDs[axis] = firstIDs[axis] || id;\n scales[id] = mergeIf(Object.create(null), [{axis}, scaleConf, defaultScaleOptions[axis], defaultScaleOptions[defaultId]]);\n });\n config.data.datasets.forEach(dataset => {\n const type = dataset.type || config.type;\n const indexAxis = dataset.indexAxis || getIndexAxis(type, options);\n const datasetDefaults = overrides[type] || {};\n const defaultScaleOptions = datasetDefaults.scales || {};\n Object.keys(defaultScaleOptions).forEach(defaultID => {\n const axis = getAxisFromDefaultScaleID(defaultID, indexAxis);\n const id = dataset[axis + 'AxisID'] || firstIDs[axis] || axis;\n scales[id] = scales[id] || Object.create(null);\n mergeIf(scales[id], [{axis}, configScales[id], defaultScaleOptions[defaultID]]);\n });\n });\n Object.keys(scales).forEach(key => {\n const scale = scales[key];\n mergeIf(scale, [defaults.scales[scale.type], defaults.scale]);\n });\n return scales;\n}\nfunction initOptions(config) {\n const options = config.options || (config.options = {});\n options.plugins = valueOrDefault(options.plugins, {});\n options.scales = mergeScaleConfig(config, options);\n}\nfunction initData(data) {\n data = data || {};\n data.datasets = data.datasets || [];\n data.labels = data.labels || [];\n return data;\n}\nfunction initConfig(config) {\n config = config || {};\n config.data = initData(config.data);\n initOptions(config);\n return config;\n}\nconst keyCache = new Map();\nconst keysCached = new Set();\nfunction cachedKeys(cacheKey, generate) {\n let keys = keyCache.get(cacheKey);\n if (!keys) {\n keys = generate();\n keyCache.set(cacheKey, keys);\n keysCached.add(keys);\n }\n return keys;\n}\nconst addIfFound = (set, obj, key) => {\n const opts = resolveObjectKey(obj, key);\n if (opts !== undefined) {\n set.add(opts);\n }\n};\nclass Config {\n constructor(config) {\n this._config = initConfig(config);\n this._scopeCache = new Map();\n this._resolverCache = new Map();\n }\n get platform() {\n return this._config.platform;\n }\n get type() {\n return this._config.type;\n }\n set type(type) {\n this._config.type = type;\n }\n get data() {\n return this._config.data;\n }\n set data(data) {\n this._config.data = initData(data);\n }\n get options() {\n return this._config.options;\n }\n set options(options) {\n this._config.options = options;\n }\n get plugins() {\n return this._config.plugins;\n }\n update() {\n const config = this._config;\n this.clearCache();\n initOptions(config);\n }\n clearCache() {\n this._scopeCache.clear();\n this._resolverCache.clear();\n }\n datasetScopeKeys(datasetType) {\n return cachedKeys(datasetType,\n () => [[\n `datasets.${datasetType}`,\n ''\n ]]);\n }\n datasetAnimationScopeKeys(datasetType, transition) {\n return cachedKeys(`${datasetType}.transition.${transition}`,\n () => [\n [\n `datasets.${datasetType}.transitions.${transition}`,\n `transitions.${transition}`,\n ],\n [\n `datasets.${datasetType}`,\n ''\n ]\n ]);\n }\n datasetElementScopeKeys(datasetType, elementType) {\n return cachedKeys(`${datasetType}-${elementType}`,\n () => [[\n `datasets.${datasetType}.elements.${elementType}`,\n `datasets.${datasetType}`,\n `elements.${elementType}`,\n ''\n ]]);\n }\n pluginScopeKeys(plugin) {\n const id = plugin.id;\n const type = this.type;\n return cachedKeys(`${type}-plugin-${id}`,\n () => [[\n `plugins.${id}`,\n ...plugin.additionalOptionScopes || [],\n ]]);\n }\n _cachedScopes(mainScope, resetCache) {\n const _scopeCache = this._scopeCache;\n let cache = _scopeCache.get(mainScope);\n if (!cache || resetCache) {\n cache = new Map();\n _scopeCache.set(mainScope, cache);\n }\n return cache;\n }\n getOptionScopes(mainScope, keyLists, resetCache) {\n const {options, type} = this;\n const cache = this._cachedScopes(mainScope, resetCache);\n const cached = cache.get(keyLists);\n if (cached) {\n return cached;\n }\n const scopes = new Set();\n keyLists.forEach(keys => {\n if (mainScope) {\n scopes.add(mainScope);\n keys.forEach(key => addIfFound(scopes, mainScope, key));\n }\n keys.forEach(key => addIfFound(scopes, options, key));\n keys.forEach(key => addIfFound(scopes, overrides[type] || {}, key));\n keys.forEach(key => addIfFound(scopes, defaults, key));\n keys.forEach(key => addIfFound(scopes, descriptors, key));\n });\n const array = Array.from(scopes);\n if (array.length === 0) {\n array.push(Object.create(null));\n }\n if (keysCached.has(keyLists)) {\n cache.set(keyLists, array);\n }\n return array;\n }\n chartOptionScopes() {\n const {options, type} = this;\n return [\n options,\n overrides[type] || {},\n defaults.datasets[type] || {},\n {type},\n defaults,\n descriptors\n ];\n }\n resolveNamedOptions(scopes, names, context, prefixes = ['']) {\n const result = {$shared: true};\n const {resolver, subPrefixes} = getResolver(this._resolverCache, scopes, prefixes);\n let options = resolver;\n if (needContext(resolver, names)) {\n result.$shared = false;\n context = isFunction(context) ? context() : context;\n const subResolver = this.createResolver(scopes, context, subPrefixes);\n options = _attachContext(resolver, context, subResolver);\n }\n for (const prop of names) {\n result[prop] = options[prop];\n }\n return result;\n }\n createResolver(scopes, context, prefixes = [''], descriptorDefaults) {\n const {resolver} = getResolver(this._resolverCache, scopes, prefixes);\n return isObject(context)\n ? _attachContext(resolver, context, undefined, descriptorDefaults)\n : resolver;\n }\n}\nfunction getResolver(resolverCache, scopes, prefixes) {\n let cache = resolverCache.get(scopes);\n if (!cache) {\n cache = new Map();\n resolverCache.set(scopes, cache);\n }\n const cacheKey = prefixes.join();\n let cached = cache.get(cacheKey);\n if (!cached) {\n const resolver = _createResolver(scopes, prefixes);\n cached = {\n resolver,\n subPrefixes: prefixes.filter(p => !p.toLowerCase().includes('hover'))\n };\n cache.set(cacheKey, cached);\n }\n return cached;\n}\nconst hasFunction = value => isObject(value)\n && Object.getOwnPropertyNames(value).reduce((acc, key) => acc || isFunction(value[key]), false);\nfunction needContext(proxy, names) {\n const {isScriptable, isIndexable} = _descriptors(proxy);\n for (const prop of names) {\n const scriptable = isScriptable(prop);\n const indexable = isIndexable(prop);\n const value = (indexable || scriptable) && proxy[prop];\n if ((scriptable && (isFunction(value) || hasFunction(value)))\n || (indexable && isArray(value))) {\n return true;\n }\n }\n return false;\n}\n\nvar version = \"3.9.1\";\n\nconst KNOWN_POSITIONS = ['top', 'bottom', 'left', 'right', 'chartArea'];\nfunction positionIsHorizontal(position, axis) {\n return position === 'top' || position === 'bottom' || (KNOWN_POSITIONS.indexOf(position) === -1 && axis === 'x');\n}\nfunction compare2Level(l1, l2) {\n return function(a, b) {\n return a[l1] === b[l1]\n ? a[l2] - b[l2]\n : a[l1] - b[l1];\n };\n}\nfunction onAnimationsComplete(context) {\n const chart = context.chart;\n const animationOptions = chart.options.animation;\n chart.notifyPlugins('afterRender');\n callback(animationOptions && animationOptions.onComplete, [context], chart);\n}\nfunction onAnimationProgress(context) {\n const chart = context.chart;\n const animationOptions = chart.options.animation;\n callback(animationOptions && animationOptions.onProgress, [context], chart);\n}\nfunction getCanvas(item) {\n if (_isDomSupported() && typeof item === 'string') {\n item = document.getElementById(item);\n } else if (item && item.length) {\n item = item[0];\n }\n if (item && item.canvas) {\n item = item.canvas;\n }\n return item;\n}\nconst instances = {};\nconst getChart = (key) => {\n const canvas = getCanvas(key);\n return Object.values(instances).filter((c) => c.canvas === canvas).pop();\n};\nfunction moveNumericKeys(obj, start, move) {\n const keys = Object.keys(obj);\n for (const key of keys) {\n const intKey = +key;\n if (intKey >= start) {\n const value = obj[key];\n delete obj[key];\n if (move > 0 || intKey > start) {\n obj[intKey + move] = value;\n }\n }\n }\n}\nfunction determineLastEvent(e, lastEvent, inChartArea, isClick) {\n if (!inChartArea || e.type === 'mouseout') {\n return null;\n }\n if (isClick) {\n return lastEvent;\n }\n return e;\n}\nclass Chart {\n constructor(item, userConfig) {\n const config = this.config = new Config(userConfig);\n const initialCanvas = getCanvas(item);\n const existingChart = getChart(initialCanvas);\n if (existingChart) {\n throw new Error(\n 'Canvas is already in use. Chart with ID \\'' + existingChart.id + '\\'' +\n\t\t\t\t' must be destroyed before the canvas with ID \\'' + existingChart.canvas.id + '\\' can be reused.'\n );\n }\n const options = config.createResolver(config.chartOptionScopes(), this.getContext());\n this.platform = new (config.platform || _detectPlatform(initialCanvas))();\n this.platform.updateConfig(config);\n const context = this.platform.acquireContext(initialCanvas, options.aspectRatio);\n const canvas = context && context.canvas;\n const height = canvas && canvas.height;\n const width = canvas && canvas.width;\n this.id = uid();\n this.ctx = context;\n this.canvas = canvas;\n this.width = width;\n this.height = height;\n this._options = options;\n this._aspectRatio = this.aspectRatio;\n this._layers = [];\n this._metasets = [];\n this._stacks = undefined;\n this.boxes = [];\n this.currentDevicePixelRatio = undefined;\n this.chartArea = undefined;\n this._active = [];\n this._lastEvent = undefined;\n this._listeners = {};\n this._responsiveListeners = undefined;\n this._sortedMetasets = [];\n this.scales = {};\n this._plugins = new PluginService();\n this.$proxies = {};\n this._hiddenIndices = {};\n this.attached = false;\n this._animationsDisabled = undefined;\n this.$context = undefined;\n this._doResize = debounce(mode => this.update(mode), options.resizeDelay || 0);\n this._dataChanges = [];\n instances[this.id] = this;\n if (!context || !canvas) {\n console.error(\"Failed to create chart: can't acquire context from the given item\");\n return;\n }\n animator.listen(this, 'complete', onAnimationsComplete);\n animator.listen(this, 'progress', onAnimationProgress);\n this._initialize();\n if (this.attached) {\n this.update();\n }\n }\n get aspectRatio() {\n const {options: {aspectRatio, maintainAspectRatio}, width, height, _aspectRatio} = this;\n if (!isNullOrUndef(aspectRatio)) {\n return aspectRatio;\n }\n if (maintainAspectRatio && _aspectRatio) {\n return _aspectRatio;\n }\n return height ? width / height : null;\n }\n get data() {\n return this.config.data;\n }\n set data(data) {\n this.config.data = data;\n }\n get options() {\n return this._options;\n }\n set options(options) {\n this.config.options = options;\n }\n _initialize() {\n this.notifyPlugins('beforeInit');\n if (this.options.responsive) {\n this.resize();\n } else {\n retinaScale(this, this.options.devicePixelRatio);\n }\n this.bindEvents();\n this.notifyPlugins('afterInit');\n return this;\n }\n clear() {\n clearCanvas(this.canvas, this.ctx);\n return this;\n }\n stop() {\n animator.stop(this);\n return this;\n }\n resize(width, height) {\n if (!animator.running(this)) {\n this._resize(width, height);\n } else {\n this._resizeBeforeDraw = {width, height};\n }\n }\n _resize(width, height) {\n const options = this.options;\n const canvas = this.canvas;\n const aspectRatio = options.maintainAspectRatio && this.aspectRatio;\n const newSize = this.platform.getMaximumSize(canvas, width, height, aspectRatio);\n const newRatio = options.devicePixelRatio || this.platform.getDevicePixelRatio();\n const mode = this.width ? 'resize' : 'attach';\n this.width = newSize.width;\n this.height = newSize.height;\n this._aspectRatio = this.aspectRatio;\n if (!retinaScale(this, newRatio, true)) {\n return;\n }\n this.notifyPlugins('resize', {size: newSize});\n callback(options.onResize, [this, newSize], this);\n if (this.attached) {\n if (this._doResize(mode)) {\n this.render();\n }\n }\n }\n ensureScalesHaveIDs() {\n const options = this.options;\n const scalesOptions = options.scales || {};\n each(scalesOptions, (axisOptions, axisID) => {\n axisOptions.id = axisID;\n });\n }\n buildOrUpdateScales() {\n const options = this.options;\n const scaleOpts = options.scales;\n const scales = this.scales;\n const updated = Object.keys(scales).reduce((obj, id) => {\n obj[id] = false;\n return obj;\n }, {});\n let items = [];\n if (scaleOpts) {\n items = items.concat(\n Object.keys(scaleOpts).map((id) => {\n const scaleOptions = scaleOpts[id];\n const axis = determineAxis(id, scaleOptions);\n const isRadial = axis === 'r';\n const isHorizontal = axis === 'x';\n return {\n options: scaleOptions,\n dposition: isRadial ? 'chartArea' : isHorizontal ? 'bottom' : 'left',\n dtype: isRadial ? 'radialLinear' : isHorizontal ? 'category' : 'linear'\n };\n })\n );\n }\n each(items, (item) => {\n const scaleOptions = item.options;\n const id = scaleOptions.id;\n const axis = determineAxis(id, scaleOptions);\n const scaleType = valueOrDefault(scaleOptions.type, item.dtype);\n if (scaleOptions.position === undefined || positionIsHorizontal(scaleOptions.position, axis) !== positionIsHorizontal(item.dposition)) {\n scaleOptions.position = item.dposition;\n }\n updated[id] = true;\n let scale = null;\n if (id in scales && scales[id].type === scaleType) {\n scale = scales[id];\n } else {\n const scaleClass = registry.getScale(scaleType);\n scale = new scaleClass({\n id,\n type: scaleType,\n ctx: this.ctx,\n chart: this\n });\n scales[scale.id] = scale;\n }\n scale.init(scaleOptions, options);\n });\n each(updated, (hasUpdated, id) => {\n if (!hasUpdated) {\n delete scales[id];\n }\n });\n each(scales, (scale) => {\n layouts.configure(this, scale, scale.options);\n layouts.addBox(this, scale);\n });\n }\n _updateMetasets() {\n const metasets = this._metasets;\n const numData = this.data.datasets.length;\n const numMeta = metasets.length;\n metasets.sort((a, b) => a.index - b.index);\n if (numMeta > numData) {\n for (let i = numData; i < numMeta; ++i) {\n this._destroyDatasetMeta(i);\n }\n metasets.splice(numData, numMeta - numData);\n }\n this._sortedMetasets = metasets.slice(0).sort(compare2Level('order', 'index'));\n }\n _removeUnreferencedMetasets() {\n const {_metasets: metasets, data: {datasets}} = this;\n if (metasets.length > datasets.length) {\n delete this._stacks;\n }\n metasets.forEach((meta, index) => {\n if (datasets.filter(x => x === meta._dataset).length === 0) {\n this._destroyDatasetMeta(index);\n }\n });\n }\n buildOrUpdateControllers() {\n const newControllers = [];\n const datasets = this.data.datasets;\n let i, ilen;\n this._removeUnreferencedMetasets();\n for (i = 0, ilen = datasets.length; i < ilen; i++) {\n const dataset = datasets[i];\n let meta = this.getDatasetMeta(i);\n const type = dataset.type || this.config.type;\n if (meta.type && meta.type !== type) {\n this._destroyDatasetMeta(i);\n meta = this.getDatasetMeta(i);\n }\n meta.type = type;\n meta.indexAxis = dataset.indexAxis || getIndexAxis(type, this.options);\n meta.order = dataset.order || 0;\n meta.index = i;\n meta.label = '' + dataset.label;\n meta.visible = this.isDatasetVisible(i);\n if (meta.controller) {\n meta.controller.updateIndex(i);\n meta.controller.linkScales();\n } else {\n const ControllerClass = registry.getController(type);\n const {datasetElementType, dataElementType} = defaults.datasets[type];\n Object.assign(ControllerClass.prototype, {\n dataElementType: registry.getElement(dataElementType),\n datasetElementType: datasetElementType && registry.getElement(datasetElementType)\n });\n meta.controller = new ControllerClass(this, i);\n newControllers.push(meta.controller);\n }\n }\n this._updateMetasets();\n return newControllers;\n }\n _resetElements() {\n each(this.data.datasets, (dataset, datasetIndex) => {\n this.getDatasetMeta(datasetIndex).controller.reset();\n }, this);\n }\n reset() {\n this._resetElements();\n this.notifyPlugins('reset');\n }\n update(mode) {\n const config = this.config;\n config.update();\n const options = this._options = config.createResolver(config.chartOptionScopes(), this.getContext());\n const animsDisabled = this._animationsDisabled = !options.animation;\n this._updateScales();\n this._checkEventBindings();\n this._updateHiddenIndices();\n this._plugins.invalidate();\n if (this.notifyPlugins('beforeUpdate', {mode, cancelable: true}) === false) {\n return;\n }\n const newControllers = this.buildOrUpdateControllers();\n this.notifyPlugins('beforeElementsUpdate');\n let minPadding = 0;\n for (let i = 0, ilen = this.data.datasets.length; i < ilen; i++) {\n const {controller} = this.getDatasetMeta(i);\n const reset = !animsDisabled && newControllers.indexOf(controller) === -1;\n controller.buildOrUpdateElements(reset);\n minPadding = Math.max(+controller.getMaxOverflow(), minPadding);\n }\n minPadding = this._minPadding = options.layout.autoPadding ? minPadding : 0;\n this._updateLayout(minPadding);\n if (!animsDisabled) {\n each(newControllers, (controller) => {\n controller.reset();\n });\n }\n this._updateDatasets(mode);\n this.notifyPlugins('afterUpdate', {mode});\n this._layers.sort(compare2Level('z', '_idx'));\n const {_active, _lastEvent} = this;\n if (_lastEvent) {\n this._eventHandler(_lastEvent, true);\n } else if (_active.length) {\n this._updateHoverStyles(_active, _active, true);\n }\n this.render();\n }\n _updateScales() {\n each(this.scales, (scale) => {\n layouts.removeBox(this, scale);\n });\n this.ensureScalesHaveIDs();\n this.buildOrUpdateScales();\n }\n _checkEventBindings() {\n const options = this.options;\n const existingEvents = new Set(Object.keys(this._listeners));\n const newEvents = new Set(options.events);\n if (!setsEqual(existingEvents, newEvents) || !!this._responsiveListeners !== options.responsive) {\n this.unbindEvents();\n this.bindEvents();\n }\n }\n _updateHiddenIndices() {\n const {_hiddenIndices} = this;\n const changes = this._getUniformDataChanges() || [];\n for (const {method, start, count} of changes) {\n const move = method === '_removeElements' ? -count : count;\n moveNumericKeys(_hiddenIndices, start, move);\n }\n }\n _getUniformDataChanges() {\n const _dataChanges = this._dataChanges;\n if (!_dataChanges || !_dataChanges.length) {\n return;\n }\n this._dataChanges = [];\n const datasetCount = this.data.datasets.length;\n const makeSet = (idx) => new Set(\n _dataChanges\n .filter(c => c[0] === idx)\n .map((c, i) => i + ',' + c.splice(1).join(','))\n );\n const changeSet = makeSet(0);\n for (let i = 1; i < datasetCount; i++) {\n if (!setsEqual(changeSet, makeSet(i))) {\n return;\n }\n }\n return Array.from(changeSet)\n .map(c => c.split(','))\n .map(a => ({method: a[1], start: +a[2], count: +a[3]}));\n }\n _updateLayout(minPadding) {\n if (this.notifyPlugins('beforeLayout', {cancelable: true}) === false) {\n return;\n }\n layouts.update(this, this.width, this.height, minPadding);\n const area = this.chartArea;\n const noArea = area.width <= 0 || area.height <= 0;\n this._layers = [];\n each(this.boxes, (box) => {\n if (noArea && box.position === 'chartArea') {\n return;\n }\n if (box.configure) {\n box.configure();\n }\n this._layers.push(...box._layers());\n }, this);\n this._layers.forEach((item, index) => {\n item._idx = index;\n });\n this.notifyPlugins('afterLayout');\n }\n _updateDatasets(mode) {\n if (this.notifyPlugins('beforeDatasetsUpdate', {mode, cancelable: true}) === false) {\n return;\n }\n for (let i = 0, ilen = this.data.datasets.length; i < ilen; ++i) {\n this.getDatasetMeta(i).controller.configure();\n }\n for (let i = 0, ilen = this.data.datasets.length; i < ilen; ++i) {\n this._updateDataset(i, isFunction(mode) ? mode({datasetIndex: i}) : mode);\n }\n this.notifyPlugins('afterDatasetsUpdate', {mode});\n }\n _updateDataset(index, mode) {\n const meta = this.getDatasetMeta(index);\n const args = {meta, index, mode, cancelable: true};\n if (this.notifyPlugins('beforeDatasetUpdate', args) === false) {\n return;\n }\n meta.controller._update(mode);\n args.cancelable = false;\n this.notifyPlugins('afterDatasetUpdate', args);\n }\n render() {\n if (this.notifyPlugins('beforeRender', {cancelable: true}) === false) {\n return;\n }\n if (animator.has(this)) {\n if (this.attached && !animator.running(this)) {\n animator.start(this);\n }\n } else {\n this.draw();\n onAnimationsComplete({chart: this});\n }\n }\n draw() {\n let i;\n if (this._resizeBeforeDraw) {\n const {width, height} = this._resizeBeforeDraw;\n this._resize(width, height);\n this._resizeBeforeDraw = null;\n }\n this.clear();\n if (this.width <= 0 || this.height <= 0) {\n return;\n }\n if (this.notifyPlugins('beforeDraw', {cancelable: true}) === false) {\n return;\n }\n const layers = this._layers;\n for (i = 0; i < layers.length && layers[i].z <= 0; ++i) {\n layers[i].draw(this.chartArea);\n }\n this._drawDatasets();\n for (; i < layers.length; ++i) {\n layers[i].draw(this.chartArea);\n }\n this.notifyPlugins('afterDraw');\n }\n _getSortedDatasetMetas(filterVisible) {\n const metasets = this._sortedMetasets;\n const result = [];\n let i, ilen;\n for (i = 0, ilen = metasets.length; i < ilen; ++i) {\n const meta = metasets[i];\n if (!filterVisible || meta.visible) {\n result.push(meta);\n }\n }\n return result;\n }\n getSortedVisibleDatasetMetas() {\n return this._getSortedDatasetMetas(true);\n }\n _drawDatasets() {\n if (this.notifyPlugins('beforeDatasetsDraw', {cancelable: true}) === false) {\n return;\n }\n const metasets = this.getSortedVisibleDatasetMetas();\n for (let i = metasets.length - 1; i >= 0; --i) {\n this._drawDataset(metasets[i]);\n }\n this.notifyPlugins('afterDatasetsDraw');\n }\n _drawDataset(meta) {\n const ctx = this.ctx;\n const clip = meta._clip;\n const useClip = !clip.disabled;\n const area = this.chartArea;\n const args = {\n meta,\n index: meta.index,\n cancelable: true\n };\n if (this.notifyPlugins('beforeDatasetDraw', args) === false) {\n return;\n }\n if (useClip) {\n clipArea(ctx, {\n left: clip.left === false ? 0 : area.left - clip.left,\n right: clip.right === false ? this.width : area.right + clip.right,\n top: clip.top === false ? 0 : area.top - clip.top,\n bottom: clip.bottom === false ? this.height : area.bottom + clip.bottom\n });\n }\n meta.controller.draw();\n if (useClip) {\n unclipArea(ctx);\n }\n args.cancelable = false;\n this.notifyPlugins('afterDatasetDraw', args);\n }\n isPointInArea(point) {\n return _isPointInArea(point, this.chartArea, this._minPadding);\n }\n getElementsAtEventForMode(e, mode, options, useFinalPosition) {\n const method = Interaction.modes[mode];\n if (typeof method === 'function') {\n return method(this, e, options, useFinalPosition);\n }\n return [];\n }\n getDatasetMeta(datasetIndex) {\n const dataset = this.data.datasets[datasetIndex];\n const metasets = this._metasets;\n let meta = metasets.filter(x => x && x._dataset === dataset).pop();\n if (!meta) {\n meta = {\n type: null,\n data: [],\n dataset: null,\n controller: null,\n hidden: null,\n xAxisID: null,\n yAxisID: null,\n order: dataset && dataset.order || 0,\n index: datasetIndex,\n _dataset: dataset,\n _parsed: [],\n _sorted: false\n };\n metasets.push(meta);\n }\n return meta;\n }\n getContext() {\n return this.$context || (this.$context = createContext(null, {chart: this, type: 'chart'}));\n }\n getVisibleDatasetCount() {\n return this.getSortedVisibleDatasetMetas().length;\n }\n isDatasetVisible(datasetIndex) {\n const dataset = this.data.datasets[datasetIndex];\n if (!dataset) {\n return false;\n }\n const meta = this.getDatasetMeta(datasetIndex);\n return typeof meta.hidden === 'boolean' ? !meta.hidden : !dataset.hidden;\n }\n setDatasetVisibility(datasetIndex, visible) {\n const meta = this.getDatasetMeta(datasetIndex);\n meta.hidden = !visible;\n }\n toggleDataVisibility(index) {\n this._hiddenIndices[index] = !this._hiddenIndices[index];\n }\n getDataVisibility(index) {\n return !this._hiddenIndices[index];\n }\n _updateVisibility(datasetIndex, dataIndex, visible) {\n const mode = visible ? 'show' : 'hide';\n const meta = this.getDatasetMeta(datasetIndex);\n const anims = meta.controller._resolveAnimations(undefined, mode);\n if (defined(dataIndex)) {\n meta.data[dataIndex].hidden = !visible;\n this.update();\n } else {\n this.setDatasetVisibility(datasetIndex, visible);\n anims.update(meta, {visible});\n this.update((ctx) => ctx.datasetIndex === datasetIndex ? mode : undefined);\n }\n }\n hide(datasetIndex, dataIndex) {\n this._updateVisibility(datasetIndex, dataIndex, false);\n }\n show(datasetIndex, dataIndex) {\n this._updateVisibility(datasetIndex, dataIndex, true);\n }\n _destroyDatasetMeta(datasetIndex) {\n const meta = this._metasets[datasetIndex];\n if (meta && meta.controller) {\n meta.controller._destroy();\n }\n delete this._metasets[datasetIndex];\n }\n _stop() {\n let i, ilen;\n this.stop();\n animator.remove(this);\n for (i = 0, ilen = this.data.datasets.length; i < ilen; ++i) {\n this._destroyDatasetMeta(i);\n }\n }\n destroy() {\n this.notifyPlugins('beforeDestroy');\n const {canvas, ctx} = this;\n this._stop();\n this.config.clearCache();\n if (canvas) {\n this.unbindEvents();\n clearCanvas(canvas, ctx);\n this.platform.releaseContext(ctx);\n this.canvas = null;\n this.ctx = null;\n }\n this.notifyPlugins('destroy');\n delete instances[this.id];\n this.notifyPlugins('afterDestroy');\n }\n toBase64Image(...args) {\n return this.canvas.toDataURL(...args);\n }\n bindEvents() {\n this.bindUserEvents();\n if (this.options.responsive) {\n this.bindResponsiveEvents();\n } else {\n this.attached = true;\n }\n }\n bindUserEvents() {\n const listeners = this._listeners;\n const platform = this.platform;\n const _add = (type, listener) => {\n platform.addEventListener(this, type, listener);\n listeners[type] = listener;\n };\n const listener = (e, x, y) => {\n e.offsetX = x;\n e.offsetY = y;\n this._eventHandler(e);\n };\n each(this.options.events, (type) => _add(type, listener));\n }\n bindResponsiveEvents() {\n if (!this._responsiveListeners) {\n this._responsiveListeners = {};\n }\n const listeners = this._responsiveListeners;\n const platform = this.platform;\n const _add = (type, listener) => {\n platform.addEventListener(this, type, listener);\n listeners[type] = listener;\n };\n const _remove = (type, listener) => {\n if (listeners[type]) {\n platform.removeEventListener(this, type, listener);\n delete listeners[type];\n }\n };\n const listener = (width, height) => {\n if (this.canvas) {\n this.resize(width, height);\n }\n };\n let detached;\n const attached = () => {\n _remove('attach', attached);\n this.attached = true;\n this.resize();\n _add('resize', listener);\n _add('detach', detached);\n };\n detached = () => {\n this.attached = false;\n _remove('resize', listener);\n this._stop();\n this._resize(0, 0);\n _add('attach', attached);\n };\n if (platform.isAttached(this.canvas)) {\n attached();\n } else {\n detached();\n }\n }\n unbindEvents() {\n each(this._listeners, (listener, type) => {\n this.platform.removeEventListener(this, type, listener);\n });\n this._listeners = {};\n each(this._responsiveListeners, (listener, type) => {\n this.platform.removeEventListener(this, type, listener);\n });\n this._responsiveListeners = undefined;\n }\n updateHoverStyle(items, mode, enabled) {\n const prefix = enabled ? 'set' : 'remove';\n let meta, item, i, ilen;\n if (mode === 'dataset') {\n meta = this.getDatasetMeta(items[0].datasetIndex);\n meta.controller['_' + prefix + 'DatasetHoverStyle']();\n }\n for (i = 0, ilen = items.length; i < ilen; ++i) {\n item = items[i];\n const controller = item && this.getDatasetMeta(item.datasetIndex).controller;\n if (controller) {\n controller[prefix + 'HoverStyle'](item.element, item.datasetIndex, item.index);\n }\n }\n }\n getActiveElements() {\n return this._active || [];\n }\n setActiveElements(activeElements) {\n const lastActive = this._active || [];\n const active = activeElements.map(({datasetIndex, index}) => {\n const meta = this.getDatasetMeta(datasetIndex);\n if (!meta) {\n throw new Error('No dataset found at index ' + datasetIndex);\n }\n return {\n datasetIndex,\n element: meta.data[index],\n index,\n };\n });\n const changed = !_elementsEqual(active, lastActive);\n if (changed) {\n this._active = active;\n this._lastEvent = null;\n this._updateHoverStyles(active, lastActive);\n }\n }\n notifyPlugins(hook, args, filter) {\n return this._plugins.notify(this, hook, args, filter);\n }\n _updateHoverStyles(active, lastActive, replay) {\n const hoverOptions = this.options.hover;\n const diff = (a, b) => a.filter(x => !b.some(y => x.datasetIndex === y.datasetIndex && x.index === y.index));\n const deactivated = diff(lastActive, active);\n const activated = replay ? active : diff(active, lastActive);\n if (deactivated.length) {\n this.updateHoverStyle(deactivated, hoverOptions.mode, false);\n }\n if (activated.length && hoverOptions.mode) {\n this.updateHoverStyle(activated, hoverOptions.mode, true);\n }\n }\n _eventHandler(e, replay) {\n const args = {\n event: e,\n replay,\n cancelable: true,\n inChartArea: this.isPointInArea(e)\n };\n const eventFilter = (plugin) => (plugin.options.events || this.options.events).includes(e.native.type);\n if (this.notifyPlugins('beforeEvent', args, eventFilter) === false) {\n return;\n }\n const changed = this._handleEvent(e, replay, args.inChartArea);\n args.cancelable = false;\n this.notifyPlugins('afterEvent', args, eventFilter);\n if (changed || args.changed) {\n this.render();\n }\n return this;\n }\n _handleEvent(e, replay, inChartArea) {\n const {_active: lastActive = [], options} = this;\n const useFinalPosition = replay;\n const active = this._getActiveElements(e, lastActive, inChartArea, useFinalPosition);\n const isClick = _isClickEvent(e);\n const lastEvent = determineLastEvent(e, this._lastEvent, inChartArea, isClick);\n if (inChartArea) {\n this._lastEvent = null;\n callback(options.onHover, [e, active, this], this);\n if (isClick) {\n callback(options.onClick, [e, active, this], this);\n }\n }\n const changed = !_elementsEqual(active, lastActive);\n if (changed || replay) {\n this._active = active;\n this._updateHoverStyles(active, lastActive, replay);\n }\n this._lastEvent = lastEvent;\n return changed;\n }\n _getActiveElements(e, lastActive, inChartArea, useFinalPosition) {\n if (e.type === 'mouseout') {\n return [];\n }\n if (!inChartArea) {\n return lastActive;\n }\n const hoverOptions = this.options.hover;\n return this.getElementsAtEventForMode(e, hoverOptions.mode, hoverOptions, useFinalPosition);\n }\n}\nconst invalidatePlugins = () => each(Chart.instances, (chart) => chart._plugins.invalidate());\nconst enumerable = true;\nObject.defineProperties(Chart, {\n defaults: {\n enumerable,\n value: defaults\n },\n instances: {\n enumerable,\n value: instances\n },\n overrides: {\n enumerable,\n value: overrides\n },\n registry: {\n enumerable,\n value: registry\n },\n version: {\n enumerable,\n value: version\n },\n getChart: {\n enumerable,\n value: getChart\n },\n register: {\n enumerable,\n value: (...items) => {\n registry.add(...items);\n invalidatePlugins();\n }\n },\n unregister: {\n enumerable,\n value: (...items) => {\n registry.remove(...items);\n invalidatePlugins();\n }\n }\n});\n\nfunction clipArc(ctx, element, endAngle) {\n const {startAngle, pixelMargin, x, y, outerRadius, innerRadius} = element;\n let angleMargin = pixelMargin / outerRadius;\n ctx.beginPath();\n ctx.arc(x, y, outerRadius, startAngle - angleMargin, endAngle + angleMargin);\n if (innerRadius > pixelMargin) {\n angleMargin = pixelMargin / innerRadius;\n ctx.arc(x, y, innerRadius, endAngle + angleMargin, startAngle - angleMargin, true);\n } else {\n ctx.arc(x, y, pixelMargin, endAngle + HALF_PI, startAngle - HALF_PI);\n }\n ctx.closePath();\n ctx.clip();\n}\nfunction toRadiusCorners(value) {\n return _readValueToProps(value, ['outerStart', 'outerEnd', 'innerStart', 'innerEnd']);\n}\nfunction parseBorderRadius$1(arc, innerRadius, outerRadius, angleDelta) {\n const o = toRadiusCorners(arc.options.borderRadius);\n const halfThickness = (outerRadius - innerRadius) / 2;\n const innerLimit = Math.min(halfThickness, angleDelta * innerRadius / 2);\n const computeOuterLimit = (val) => {\n const outerArcLimit = (outerRadius - Math.min(halfThickness, val)) * angleDelta / 2;\n return _limitValue(val, 0, Math.min(halfThickness, outerArcLimit));\n };\n return {\n outerStart: computeOuterLimit(o.outerStart),\n outerEnd: computeOuterLimit(o.outerEnd),\n innerStart: _limitValue(o.innerStart, 0, innerLimit),\n innerEnd: _limitValue(o.innerEnd, 0, innerLimit),\n };\n}\nfunction rThetaToXY(r, theta, x, y) {\n return {\n x: x + r * Math.cos(theta),\n y: y + r * Math.sin(theta),\n };\n}\nfunction pathArc(ctx, element, offset, spacing, end, circular) {\n const {x, y, startAngle: start, pixelMargin, innerRadius: innerR} = element;\n const outerRadius = Math.max(element.outerRadius + spacing + offset - pixelMargin, 0);\n const innerRadius = innerR > 0 ? innerR + spacing + offset + pixelMargin : 0;\n let spacingOffset = 0;\n const alpha = end - start;\n if (spacing) {\n const noSpacingInnerRadius = innerR > 0 ? innerR - spacing : 0;\n const noSpacingOuterRadius = outerRadius > 0 ? outerRadius - spacing : 0;\n const avNogSpacingRadius = (noSpacingInnerRadius + noSpacingOuterRadius) / 2;\n const adjustedAngle = avNogSpacingRadius !== 0 ? (alpha * avNogSpacingRadius) / (avNogSpacingRadius + spacing) : alpha;\n spacingOffset = (alpha - adjustedAngle) / 2;\n }\n const beta = Math.max(0.001, alpha * outerRadius - offset / PI) / outerRadius;\n const angleOffset = (alpha - beta) / 2;\n const startAngle = start + angleOffset + spacingOffset;\n const endAngle = end - angleOffset - spacingOffset;\n const {outerStart, outerEnd, innerStart, innerEnd} = parseBorderRadius$1(element, innerRadius, outerRadius, endAngle - startAngle);\n const outerStartAdjustedRadius = outerRadius - outerStart;\n const outerEndAdjustedRadius = outerRadius - outerEnd;\n const outerStartAdjustedAngle = startAngle + outerStart / outerStartAdjustedRadius;\n const outerEndAdjustedAngle = endAngle - outerEnd / outerEndAdjustedRadius;\n const innerStartAdjustedRadius = innerRadius + innerStart;\n const innerEndAdjustedRadius = innerRadius + innerEnd;\n const innerStartAdjustedAngle = startAngle + innerStart / innerStartAdjustedRadius;\n const innerEndAdjustedAngle = endAngle - innerEnd / innerEndAdjustedRadius;\n ctx.beginPath();\n if (circular) {\n ctx.arc(x, y, outerRadius, outerStartAdjustedAngle, outerEndAdjustedAngle);\n if (outerEnd > 0) {\n const pCenter = rThetaToXY(outerEndAdjustedRadius, outerEndAdjustedAngle, x, y);\n ctx.arc(pCenter.x, pCenter.y, outerEnd, outerEndAdjustedAngle, endAngle + HALF_PI);\n }\n const p4 = rThetaToXY(innerEndAdjustedRadius, endAngle, x, y);\n ctx.lineTo(p4.x, p4.y);\n if (innerEnd > 0) {\n const pCenter = rThetaToXY(innerEndAdjustedRadius, innerEndAdjustedAngle, x, y);\n ctx.arc(pCenter.x, pCenter.y, innerEnd, endAngle + HALF_PI, innerEndAdjustedAngle + Math.PI);\n }\n ctx.arc(x, y, innerRadius, endAngle - (innerEnd / innerRadius), startAngle + (innerStart / innerRadius), true);\n if (innerStart > 0) {\n const pCenter = rThetaToXY(innerStartAdjustedRadius, innerStartAdjustedAngle, x, y);\n ctx.arc(pCenter.x, pCenter.y, innerStart, innerStartAdjustedAngle + Math.PI, startAngle - HALF_PI);\n }\n const p8 = rThetaToXY(outerStartAdjustedRadius, startAngle, x, y);\n ctx.lineTo(p8.x, p8.y);\n if (outerStart > 0) {\n const pCenter = rThetaToXY(outerStartAdjustedRadius, outerStartAdjustedAngle, x, y);\n ctx.arc(pCenter.x, pCenter.y, outerStart, startAngle - HALF_PI, outerStartAdjustedAngle);\n }\n } else {\n ctx.moveTo(x, y);\n const outerStartX = Math.cos(outerStartAdjustedAngle) * outerRadius + x;\n const outerStartY = Math.sin(outerStartAdjustedAngle) * outerRadius + y;\n ctx.lineTo(outerStartX, outerStartY);\n const outerEndX = Math.cos(outerEndAdjustedAngle) * outerRadius + x;\n const outerEndY = Math.sin(outerEndAdjustedAngle) * outerRadius + y;\n ctx.lineTo(outerEndX, outerEndY);\n }\n ctx.closePath();\n}\nfunction drawArc(ctx, element, offset, spacing, circular) {\n const {fullCircles, startAngle, circumference} = element;\n let endAngle = element.endAngle;\n if (fullCircles) {\n pathArc(ctx, element, offset, spacing, startAngle + TAU, circular);\n for (let i = 0; i < fullCircles; ++i) {\n ctx.fill();\n }\n if (!isNaN(circumference)) {\n endAngle = startAngle + circumference % TAU;\n if (circumference % TAU === 0) {\n endAngle += TAU;\n }\n }\n }\n pathArc(ctx, element, offset, spacing, endAngle, circular);\n ctx.fill();\n return endAngle;\n}\nfunction drawFullCircleBorders(ctx, element, inner) {\n const {x, y, startAngle, pixelMargin, fullCircles} = element;\n const outerRadius = Math.max(element.outerRadius - pixelMargin, 0);\n const innerRadius = element.innerRadius + pixelMargin;\n let i;\n if (inner) {\n clipArc(ctx, element, startAngle + TAU);\n }\n ctx.beginPath();\n ctx.arc(x, y, innerRadius, startAngle + TAU, startAngle, true);\n for (i = 0; i < fullCircles; ++i) {\n ctx.stroke();\n }\n ctx.beginPath();\n ctx.arc(x, y, outerRadius, startAngle, startAngle + TAU);\n for (i = 0; i < fullCircles; ++i) {\n ctx.stroke();\n }\n}\nfunction drawBorder(ctx, element, offset, spacing, endAngle, circular) {\n const {options} = element;\n const {borderWidth, borderJoinStyle} = options;\n const inner = options.borderAlign === 'inner';\n if (!borderWidth) {\n return;\n }\n if (inner) {\n ctx.lineWidth = borderWidth * 2;\n ctx.lineJoin = borderJoinStyle || 'round';\n } else {\n ctx.lineWidth = borderWidth;\n ctx.lineJoin = borderJoinStyle || 'bevel';\n }\n if (element.fullCircles) {\n drawFullCircleBorders(ctx, element, inner);\n }\n if (inner) {\n clipArc(ctx, element, endAngle);\n }\n pathArc(ctx, element, offset, spacing, endAngle, circular);\n ctx.stroke();\n}\nclass ArcElement extends Element {\n constructor(cfg) {\n super();\n this.options = undefined;\n this.circumference = undefined;\n this.startAngle = undefined;\n this.endAngle = undefined;\n this.innerRadius = undefined;\n this.outerRadius = undefined;\n this.pixelMargin = 0;\n this.fullCircles = 0;\n if (cfg) {\n Object.assign(this, cfg);\n }\n }\n inRange(chartX, chartY, useFinalPosition) {\n const point = this.getProps(['x', 'y'], useFinalPosition);\n const {angle, distance} = getAngleFromPoint(point, {x: chartX, y: chartY});\n const {startAngle, endAngle, innerRadius, outerRadius, circumference} = this.getProps([\n 'startAngle',\n 'endAngle',\n 'innerRadius',\n 'outerRadius',\n 'circumference'\n ], useFinalPosition);\n const rAdjust = this.options.spacing / 2;\n const _circumference = valueOrDefault(circumference, endAngle - startAngle);\n const betweenAngles = _circumference >= TAU || _angleBetween(angle, startAngle, endAngle);\n const withinRadius = _isBetween(distance, innerRadius + rAdjust, outerRadius + rAdjust);\n return (betweenAngles && withinRadius);\n }\n getCenterPoint(useFinalPosition) {\n const {x, y, startAngle, endAngle, innerRadius, outerRadius} = this.getProps([\n 'x',\n 'y',\n 'startAngle',\n 'endAngle',\n 'innerRadius',\n 'outerRadius',\n 'circumference',\n ], useFinalPosition);\n const {offset, spacing} = this.options;\n const halfAngle = (startAngle + endAngle) / 2;\n const halfRadius = (innerRadius + outerRadius + spacing + offset) / 2;\n return {\n x: x + Math.cos(halfAngle) * halfRadius,\n y: y + Math.sin(halfAngle) * halfRadius\n };\n }\n tooltipPosition(useFinalPosition) {\n return this.getCenterPoint(useFinalPosition);\n }\n draw(ctx) {\n const {options, circumference} = this;\n const offset = (options.offset || 0) / 2;\n const spacing = (options.spacing || 0) / 2;\n const circular = options.circular;\n this.pixelMargin = (options.borderAlign === 'inner') ? 0.33 : 0;\n this.fullCircles = circumference > TAU ? Math.floor(circumference / TAU) : 0;\n if (circumference === 0 || this.innerRadius < 0 || this.outerRadius < 0) {\n return;\n }\n ctx.save();\n let radiusOffset = 0;\n if (offset) {\n radiusOffset = offset / 2;\n const halfAngle = (this.startAngle + this.endAngle) / 2;\n ctx.translate(Math.cos(halfAngle) * radiusOffset, Math.sin(halfAngle) * radiusOffset);\n if (this.circumference >= PI) {\n radiusOffset = offset;\n }\n }\n ctx.fillStyle = options.backgroundColor;\n ctx.strokeStyle = options.borderColor;\n const endAngle = drawArc(ctx, this, radiusOffset, spacing, circular);\n drawBorder(ctx, this, radiusOffset, spacing, endAngle, circular);\n ctx.restore();\n }\n}\nArcElement.id = 'arc';\nArcElement.defaults = {\n borderAlign: 'center',\n borderColor: '#fff',\n borderJoinStyle: undefined,\n borderRadius: 0,\n borderWidth: 2,\n offset: 0,\n spacing: 0,\n angle: undefined,\n circular: true,\n};\nArcElement.defaultRoutes = {\n backgroundColor: 'backgroundColor'\n};\n\nfunction setStyle(ctx, options, style = options) {\n ctx.lineCap = valueOrDefault(style.borderCapStyle, options.borderCapStyle);\n ctx.setLineDash(valueOrDefault(style.borderDash, options.borderDash));\n ctx.lineDashOffset = valueOrDefault(style.borderDashOffset, options.borderDashOffset);\n ctx.lineJoin = valueOrDefault(style.borderJoinStyle, options.borderJoinStyle);\n ctx.lineWidth = valueOrDefault(style.borderWidth, options.borderWidth);\n ctx.strokeStyle = valueOrDefault(style.borderColor, options.borderColor);\n}\nfunction lineTo(ctx, previous, target) {\n ctx.lineTo(target.x, target.y);\n}\nfunction getLineMethod(options) {\n if (options.stepped) {\n return _steppedLineTo;\n }\n if (options.tension || options.cubicInterpolationMode === 'monotone') {\n return _bezierCurveTo;\n }\n return lineTo;\n}\nfunction pathVars(points, segment, params = {}) {\n const count = points.length;\n const {start: paramsStart = 0, end: paramsEnd = count - 1} = params;\n const {start: segmentStart, end: segmentEnd} = segment;\n const start = Math.max(paramsStart, segmentStart);\n const end = Math.min(paramsEnd, segmentEnd);\n const outside = paramsStart < segmentStart && paramsEnd < segmentStart || paramsStart > segmentEnd && paramsEnd > segmentEnd;\n return {\n count,\n start,\n loop: segment.loop,\n ilen: end < start && !outside ? count + end - start : end - start\n };\n}\nfunction pathSegment(ctx, line, segment, params) {\n const {points, options} = line;\n const {count, start, loop, ilen} = pathVars(points, segment, params);\n const lineMethod = getLineMethod(options);\n let {move = true, reverse} = params || {};\n let i, point, prev;\n for (i = 0; i <= ilen; ++i) {\n point = points[(start + (reverse ? ilen - i : i)) % count];\n if (point.skip) {\n continue;\n } else if (move) {\n ctx.moveTo(point.x, point.y);\n move = false;\n } else {\n lineMethod(ctx, prev, point, reverse, options.stepped);\n }\n prev = point;\n }\n if (loop) {\n point = points[(start + (reverse ? ilen : 0)) % count];\n lineMethod(ctx, prev, point, reverse, options.stepped);\n }\n return !!loop;\n}\nfunction fastPathSegment(ctx, line, segment, params) {\n const points = line.points;\n const {count, start, ilen} = pathVars(points, segment, params);\n const {move = true, reverse} = params || {};\n let avgX = 0;\n let countX = 0;\n let i, point, prevX, minY, maxY, lastY;\n const pointIndex = (index) => (start + (reverse ? ilen - index : index)) % count;\n const drawX = () => {\n if (minY !== maxY) {\n ctx.lineTo(avgX, maxY);\n ctx.lineTo(avgX, minY);\n ctx.lineTo(avgX, lastY);\n }\n };\n if (move) {\n point = points[pointIndex(0)];\n ctx.moveTo(point.x, point.y);\n }\n for (i = 0; i <= ilen; ++i) {\n point = points[pointIndex(i)];\n if (point.skip) {\n continue;\n }\n const x = point.x;\n const y = point.y;\n const truncX = x | 0;\n if (truncX === prevX) {\n if (y < minY) {\n minY = y;\n } else if (y > maxY) {\n maxY = y;\n }\n avgX = (countX * avgX + x) / ++countX;\n } else {\n drawX();\n ctx.lineTo(x, y);\n prevX = truncX;\n countX = 0;\n minY = maxY = y;\n }\n lastY = y;\n }\n drawX();\n}\nfunction _getSegmentMethod(line) {\n const opts = line.options;\n const borderDash = opts.borderDash && opts.borderDash.length;\n const useFastPath = !line._decimated && !line._loop && !opts.tension && opts.cubicInterpolationMode !== 'monotone' && !opts.stepped && !borderDash;\n return useFastPath ? fastPathSegment : pathSegment;\n}\nfunction _getInterpolationMethod(options) {\n if (options.stepped) {\n return _steppedInterpolation;\n }\n if (options.tension || options.cubicInterpolationMode === 'monotone') {\n return _bezierInterpolation;\n }\n return _pointInLine;\n}\nfunction strokePathWithCache(ctx, line, start, count) {\n let path = line._path;\n if (!path) {\n path = line._path = new Path2D();\n if (line.path(path, start, count)) {\n path.closePath();\n }\n }\n setStyle(ctx, line.options);\n ctx.stroke(path);\n}\nfunction strokePathDirect(ctx, line, start, count) {\n const {segments, options} = line;\n const segmentMethod = _getSegmentMethod(line);\n for (const segment of segments) {\n setStyle(ctx, options, segment.style);\n ctx.beginPath();\n if (segmentMethod(ctx, line, segment, {start, end: start + count - 1})) {\n ctx.closePath();\n }\n ctx.stroke();\n }\n}\nconst usePath2D = typeof Path2D === 'function';\nfunction draw(ctx, line, start, count) {\n if (usePath2D && !line.options.segment) {\n strokePathWithCache(ctx, line, start, count);\n } else {\n strokePathDirect(ctx, line, start, count);\n }\n}\nclass LineElement extends Element {\n constructor(cfg) {\n super();\n this.animated = true;\n this.options = undefined;\n this._chart = undefined;\n this._loop = undefined;\n this._fullLoop = undefined;\n this._path = undefined;\n this._points = undefined;\n this._segments = undefined;\n this._decimated = false;\n this._pointsUpdated = false;\n this._datasetIndex = undefined;\n if (cfg) {\n Object.assign(this, cfg);\n }\n }\n updateControlPoints(chartArea, indexAxis) {\n const options = this.options;\n if ((options.tension || options.cubicInterpolationMode === 'monotone') && !options.stepped && !this._pointsUpdated) {\n const loop = options.spanGaps ? this._loop : this._fullLoop;\n _updateBezierControlPoints(this._points, options, chartArea, loop, indexAxis);\n this._pointsUpdated = true;\n }\n }\n set points(points) {\n this._points = points;\n delete this._segments;\n delete this._path;\n this._pointsUpdated = false;\n }\n get points() {\n return this._points;\n }\n get segments() {\n return this._segments || (this._segments = _computeSegments(this, this.options.segment));\n }\n first() {\n const segments = this.segments;\n const points = this.points;\n return segments.length && points[segments[0].start];\n }\n last() {\n const segments = this.segments;\n const points = this.points;\n const count = segments.length;\n return count && points[segments[count - 1].end];\n }\n interpolate(point, property) {\n const options = this.options;\n const value = point[property];\n const points = this.points;\n const segments = _boundSegments(this, {property, start: value, end: value});\n if (!segments.length) {\n return;\n }\n const result = [];\n const _interpolate = _getInterpolationMethod(options);\n let i, ilen;\n for (i = 0, ilen = segments.length; i < ilen; ++i) {\n const {start, end} = segments[i];\n const p1 = points[start];\n const p2 = points[end];\n if (p1 === p2) {\n result.push(p1);\n continue;\n }\n const t = Math.abs((value - p1[property]) / (p2[property] - p1[property]));\n const interpolated = _interpolate(p1, p2, t, options.stepped);\n interpolated[property] = point[property];\n result.push(interpolated);\n }\n return result.length === 1 ? result[0] : result;\n }\n pathSegment(ctx, segment, params) {\n const segmentMethod = _getSegmentMethod(this);\n return segmentMethod(ctx, this, segment, params);\n }\n path(ctx, start, count) {\n const segments = this.segments;\n const segmentMethod = _getSegmentMethod(this);\n let loop = this._loop;\n start = start || 0;\n count = count || (this.points.length - start);\n for (const segment of segments) {\n loop &= segmentMethod(ctx, this, segment, {start, end: start + count - 1});\n }\n return !!loop;\n }\n draw(ctx, chartArea, start, count) {\n const options = this.options || {};\n const points = this.points || [];\n if (points.length && options.borderWidth) {\n ctx.save();\n draw(ctx, this, start, count);\n ctx.restore();\n }\n if (this.animated) {\n this._pointsUpdated = false;\n this._path = undefined;\n }\n }\n}\nLineElement.id = 'line';\nLineElement.defaults = {\n borderCapStyle: 'butt',\n borderDash: [],\n borderDashOffset: 0,\n borderJoinStyle: 'miter',\n borderWidth: 3,\n capBezierPoints: true,\n cubicInterpolationMode: 'default',\n fill: false,\n spanGaps: false,\n stepped: false,\n tension: 0,\n};\nLineElement.defaultRoutes = {\n backgroundColor: 'backgroundColor',\n borderColor: 'borderColor'\n};\nLineElement.descriptors = {\n _scriptable: true,\n _indexable: (name) => name !== 'borderDash' && name !== 'fill',\n};\n\nfunction inRange$1(el, pos, axis, useFinalPosition) {\n const options = el.options;\n const {[axis]: value} = el.getProps([axis], useFinalPosition);\n return (Math.abs(pos - value) < options.radius + options.hitRadius);\n}\nclass PointElement extends Element {\n constructor(cfg) {\n super();\n this.options = undefined;\n this.parsed = undefined;\n this.skip = undefined;\n this.stop = undefined;\n if (cfg) {\n Object.assign(this, cfg);\n }\n }\n inRange(mouseX, mouseY, useFinalPosition) {\n const options = this.options;\n const {x, y} = this.getProps(['x', 'y'], useFinalPosition);\n return ((Math.pow(mouseX - x, 2) + Math.pow(mouseY - y, 2)) < Math.pow(options.hitRadius + options.radius, 2));\n }\n inXRange(mouseX, useFinalPosition) {\n return inRange$1(this, mouseX, 'x', useFinalPosition);\n }\n inYRange(mouseY, useFinalPosition) {\n return inRange$1(this, mouseY, 'y', useFinalPosition);\n }\n getCenterPoint(useFinalPosition) {\n const {x, y} = this.getProps(['x', 'y'], useFinalPosition);\n return {x, y};\n }\n size(options) {\n options = options || this.options || {};\n let radius = options.radius || 0;\n radius = Math.max(radius, radius && options.hoverRadius || 0);\n const borderWidth = radius && options.borderWidth || 0;\n return (radius + borderWidth) * 2;\n }\n draw(ctx, area) {\n const options = this.options;\n if (this.skip || options.radius < 0.1 || !_isPointInArea(this, area, this.size(options) / 2)) {\n return;\n }\n ctx.strokeStyle = options.borderColor;\n ctx.lineWidth = options.borderWidth;\n ctx.fillStyle = options.backgroundColor;\n drawPoint(ctx, options, this.x, this.y);\n }\n getRange() {\n const options = this.options || {};\n return options.radius + options.hitRadius;\n }\n}\nPointElement.id = 'point';\nPointElement.defaults = {\n borderWidth: 1,\n hitRadius: 1,\n hoverBorderWidth: 1,\n hoverRadius: 4,\n pointStyle: 'circle',\n radius: 3,\n rotation: 0\n};\nPointElement.defaultRoutes = {\n backgroundColor: 'backgroundColor',\n borderColor: 'borderColor'\n};\n\nfunction getBarBounds(bar, useFinalPosition) {\n const {x, y, base, width, height} = bar.getProps(['x', 'y', 'base', 'width', 'height'], useFinalPosition);\n let left, right, top, bottom, half;\n if (bar.horizontal) {\n half = height / 2;\n left = Math.min(x, base);\n right = Math.max(x, base);\n top = y - half;\n bottom = y + half;\n } else {\n half = width / 2;\n left = x - half;\n right = x + half;\n top = Math.min(y, base);\n bottom = Math.max(y, base);\n }\n return {left, top, right, bottom};\n}\nfunction skipOrLimit(skip, value, min, max) {\n return skip ? 0 : _limitValue(value, min, max);\n}\nfunction parseBorderWidth(bar, maxW, maxH) {\n const value = bar.options.borderWidth;\n const skip = bar.borderSkipped;\n const o = toTRBL(value);\n return {\n t: skipOrLimit(skip.top, o.top, 0, maxH),\n r: skipOrLimit(skip.right, o.right, 0, maxW),\n b: skipOrLimit(skip.bottom, o.bottom, 0, maxH),\n l: skipOrLimit(skip.left, o.left, 0, maxW)\n };\n}\nfunction parseBorderRadius(bar, maxW, maxH) {\n const {enableBorderRadius} = bar.getProps(['enableBorderRadius']);\n const value = bar.options.borderRadius;\n const o = toTRBLCorners(value);\n const maxR = Math.min(maxW, maxH);\n const skip = bar.borderSkipped;\n const enableBorder = enableBorderRadius || isObject(value);\n return {\n topLeft: skipOrLimit(!enableBorder || skip.top || skip.left, o.topLeft, 0, maxR),\n topRight: skipOrLimit(!enableBorder || skip.top || skip.right, o.topRight, 0, maxR),\n bottomLeft: skipOrLimit(!enableBorder || skip.bottom || skip.left, o.bottomLeft, 0, maxR),\n bottomRight: skipOrLimit(!enableBorder || skip.bottom || skip.right, o.bottomRight, 0, maxR)\n };\n}\nfunction boundingRects(bar) {\n const bounds = getBarBounds(bar);\n const width = bounds.right - bounds.left;\n const height = bounds.bottom - bounds.top;\n const border = parseBorderWidth(bar, width / 2, height / 2);\n const radius = parseBorderRadius(bar, width / 2, height / 2);\n return {\n outer: {\n x: bounds.left,\n y: bounds.top,\n w: width,\n h: height,\n radius\n },\n inner: {\n x: bounds.left + border.l,\n y: bounds.top + border.t,\n w: width - border.l - border.r,\n h: height - border.t - border.b,\n radius: {\n topLeft: Math.max(0, radius.topLeft - Math.max(border.t, border.l)),\n topRight: Math.max(0, radius.topRight - Math.max(border.t, border.r)),\n bottomLeft: Math.max(0, radius.bottomLeft - Math.max(border.b, border.l)),\n bottomRight: Math.max(0, radius.bottomRight - Math.max(border.b, border.r)),\n }\n }\n };\n}\nfunction inRange(bar, x, y, useFinalPosition) {\n const skipX = x === null;\n const skipY = y === null;\n const skipBoth = skipX && skipY;\n const bounds = bar && !skipBoth && getBarBounds(bar, useFinalPosition);\n return bounds\n\t\t&& (skipX || _isBetween(x, bounds.left, bounds.right))\n\t\t&& (skipY || _isBetween(y, bounds.top, bounds.bottom));\n}\nfunction hasRadius(radius) {\n return radius.topLeft || radius.topRight || radius.bottomLeft || radius.bottomRight;\n}\nfunction addNormalRectPath(ctx, rect) {\n ctx.rect(rect.x, rect.y, rect.w, rect.h);\n}\nfunction inflateRect(rect, amount, refRect = {}) {\n const x = rect.x !== refRect.x ? -amount : 0;\n const y = rect.y !== refRect.y ? -amount : 0;\n const w = (rect.x + rect.w !== refRect.x + refRect.w ? amount : 0) - x;\n const h = (rect.y + rect.h !== refRect.y + refRect.h ? amount : 0) - y;\n return {\n x: rect.x + x,\n y: rect.y + y,\n w: rect.w + w,\n h: rect.h + h,\n radius: rect.radius\n };\n}\nclass BarElement extends Element {\n constructor(cfg) {\n super();\n this.options = undefined;\n this.horizontal = undefined;\n this.base = undefined;\n this.width = undefined;\n this.height = undefined;\n this.inflateAmount = undefined;\n if (cfg) {\n Object.assign(this, cfg);\n }\n }\n draw(ctx) {\n const {inflateAmount, options: {borderColor, backgroundColor}} = this;\n const {inner, outer} = boundingRects(this);\n const addRectPath = hasRadius(outer.radius) ? addRoundedRectPath : addNormalRectPath;\n ctx.save();\n if (outer.w !== inner.w || outer.h !== inner.h) {\n ctx.beginPath();\n addRectPath(ctx, inflateRect(outer, inflateAmount, inner));\n ctx.clip();\n addRectPath(ctx, inflateRect(inner, -inflateAmount, outer));\n ctx.fillStyle = borderColor;\n ctx.fill('evenodd');\n }\n ctx.beginPath();\n addRectPath(ctx, inflateRect(inner, inflateAmount));\n ctx.fillStyle = backgroundColor;\n ctx.fill();\n ctx.restore();\n }\n inRange(mouseX, mouseY, useFinalPosition) {\n return inRange(this, mouseX, mouseY, useFinalPosition);\n }\n inXRange(mouseX, useFinalPosition) {\n return inRange(this, mouseX, null, useFinalPosition);\n }\n inYRange(mouseY, useFinalPosition) {\n return inRange(this, null, mouseY, useFinalPosition);\n }\n getCenterPoint(useFinalPosition) {\n const {x, y, base, horizontal} = this.getProps(['x', 'y', 'base', 'horizontal'], useFinalPosition);\n return {\n x: horizontal ? (x + base) / 2 : x,\n y: horizontal ? y : (y + base) / 2\n };\n }\n getRange(axis) {\n return axis === 'x' ? this.width / 2 : this.height / 2;\n }\n}\nBarElement.id = 'bar';\nBarElement.defaults = {\n borderSkipped: 'start',\n borderWidth: 0,\n borderRadius: 0,\n inflateAmount: 'auto',\n pointStyle: undefined\n};\nBarElement.defaultRoutes = {\n backgroundColor: 'backgroundColor',\n borderColor: 'borderColor'\n};\n\nvar elements = /*#__PURE__*/Object.freeze({\n__proto__: null,\nArcElement: ArcElement,\nLineElement: LineElement,\nPointElement: PointElement,\nBarElement: BarElement\n});\n\nfunction lttbDecimation(data, start, count, availableWidth, options) {\n const samples = options.samples || availableWidth;\n if (samples >= count) {\n return data.slice(start, start + count);\n }\n const decimated = [];\n const bucketWidth = (count - 2) / (samples - 2);\n let sampledIndex = 0;\n const endIndex = start + count - 1;\n let a = start;\n let i, maxAreaPoint, maxArea, area, nextA;\n decimated[sampledIndex++] = data[a];\n for (i = 0; i < samples - 2; i++) {\n let avgX = 0;\n let avgY = 0;\n let j;\n const avgRangeStart = Math.floor((i + 1) * bucketWidth) + 1 + start;\n const avgRangeEnd = Math.min(Math.floor((i + 2) * bucketWidth) + 1, count) + start;\n const avgRangeLength = avgRangeEnd - avgRangeStart;\n for (j = avgRangeStart; j < avgRangeEnd; j++) {\n avgX += data[j].x;\n avgY += data[j].y;\n }\n avgX /= avgRangeLength;\n avgY /= avgRangeLength;\n const rangeOffs = Math.floor(i * bucketWidth) + 1 + start;\n const rangeTo = Math.min(Math.floor((i + 1) * bucketWidth) + 1, count) + start;\n const {x: pointAx, y: pointAy} = data[a];\n maxArea = area = -1;\n for (j = rangeOffs; j < rangeTo; j++) {\n area = 0.5 * Math.abs(\n (pointAx - avgX) * (data[j].y - pointAy) -\n (pointAx - data[j].x) * (avgY - pointAy)\n );\n if (area > maxArea) {\n maxArea = area;\n maxAreaPoint = data[j];\n nextA = j;\n }\n }\n decimated[sampledIndex++] = maxAreaPoint;\n a = nextA;\n }\n decimated[sampledIndex++] = data[endIndex];\n return decimated;\n}\nfunction minMaxDecimation(data, start, count, availableWidth) {\n let avgX = 0;\n let countX = 0;\n let i, point, x, y, prevX, minIndex, maxIndex, startIndex, minY, maxY;\n const decimated = [];\n const endIndex = start + count - 1;\n const xMin = data[start].x;\n const xMax = data[endIndex].x;\n const dx = xMax - xMin;\n for (i = start; i < start + count; ++i) {\n point = data[i];\n x = (point.x - xMin) / dx * availableWidth;\n y = point.y;\n const truncX = x | 0;\n if (truncX === prevX) {\n if (y < minY) {\n minY = y;\n minIndex = i;\n } else if (y > maxY) {\n maxY = y;\n maxIndex = i;\n }\n avgX = (countX * avgX + point.x) / ++countX;\n } else {\n const lastIndex = i - 1;\n if (!isNullOrUndef(minIndex) && !isNullOrUndef(maxIndex)) {\n const intermediateIndex1 = Math.min(minIndex, maxIndex);\n const intermediateIndex2 = Math.max(minIndex, maxIndex);\n if (intermediateIndex1 !== startIndex && intermediateIndex1 !== lastIndex) {\n decimated.push({\n ...data[intermediateIndex1],\n x: avgX,\n });\n }\n if (intermediateIndex2 !== startIndex && intermediateIndex2 !== lastIndex) {\n decimated.push({\n ...data[intermediateIndex2],\n x: avgX\n });\n }\n }\n if (i > 0 && lastIndex !== startIndex) {\n decimated.push(data[lastIndex]);\n }\n decimated.push(point);\n prevX = truncX;\n countX = 0;\n minY = maxY = y;\n minIndex = maxIndex = startIndex = i;\n }\n }\n return decimated;\n}\nfunction cleanDecimatedDataset(dataset) {\n if (dataset._decimated) {\n const data = dataset._data;\n delete dataset._decimated;\n delete dataset._data;\n Object.defineProperty(dataset, 'data', {value: data});\n }\n}\nfunction cleanDecimatedData(chart) {\n chart.data.datasets.forEach((dataset) => {\n cleanDecimatedDataset(dataset);\n });\n}\nfunction getStartAndCountOfVisiblePointsSimplified(meta, points) {\n const pointCount = points.length;\n let start = 0;\n let count;\n const {iScale} = meta;\n const {min, max, minDefined, maxDefined} = iScale.getUserBounds();\n if (minDefined) {\n start = _limitValue(_lookupByKey(points, iScale.axis, min).lo, 0, pointCount - 1);\n }\n if (maxDefined) {\n count = _limitValue(_lookupByKey(points, iScale.axis, max).hi + 1, start, pointCount) - start;\n } else {\n count = pointCount - start;\n }\n return {start, count};\n}\nvar plugin_decimation = {\n id: 'decimation',\n defaults: {\n algorithm: 'min-max',\n enabled: false,\n },\n beforeElementsUpdate: (chart, args, options) => {\n if (!options.enabled) {\n cleanDecimatedData(chart);\n return;\n }\n const availableWidth = chart.width;\n chart.data.datasets.forEach((dataset, datasetIndex) => {\n const {_data, indexAxis} = dataset;\n const meta = chart.getDatasetMeta(datasetIndex);\n const data = _data || dataset.data;\n if (resolve([indexAxis, chart.options.indexAxis]) === 'y') {\n return;\n }\n if (!meta.controller.supportsDecimation) {\n return;\n }\n const xAxis = chart.scales[meta.xAxisID];\n if (xAxis.type !== 'linear' && xAxis.type !== 'time') {\n return;\n }\n if (chart.options.parsing) {\n return;\n }\n let {start, count} = getStartAndCountOfVisiblePointsSimplified(meta, data);\n const threshold = options.threshold || 4 * availableWidth;\n if (count <= threshold) {\n cleanDecimatedDataset(dataset);\n return;\n }\n if (isNullOrUndef(_data)) {\n dataset._data = data;\n delete dataset.data;\n Object.defineProperty(dataset, 'data', {\n configurable: true,\n enumerable: true,\n get: function() {\n return this._decimated;\n },\n set: function(d) {\n this._data = d;\n }\n });\n }\n let decimated;\n switch (options.algorithm) {\n case 'lttb':\n decimated = lttbDecimation(data, start, count, availableWidth, options);\n break;\n case 'min-max':\n decimated = minMaxDecimation(data, start, count, availableWidth);\n break;\n default:\n throw new Error(`Unsupported decimation algorithm '${options.algorithm}'`);\n }\n dataset._decimated = decimated;\n });\n },\n destroy(chart) {\n cleanDecimatedData(chart);\n }\n};\n\nfunction _segments(line, target, property) {\n const segments = line.segments;\n const points = line.points;\n const tpoints = target.points;\n const parts = [];\n for (const segment of segments) {\n let {start, end} = segment;\n end = _findSegmentEnd(start, end, points);\n const bounds = _getBounds(property, points[start], points[end], segment.loop);\n if (!target.segments) {\n parts.push({\n source: segment,\n target: bounds,\n start: points[start],\n end: points[end]\n });\n continue;\n }\n const targetSegments = _boundSegments(target, bounds);\n for (const tgt of targetSegments) {\n const subBounds = _getBounds(property, tpoints[tgt.start], tpoints[tgt.end], tgt.loop);\n const fillSources = _boundSegment(segment, points, subBounds);\n for (const fillSource of fillSources) {\n parts.push({\n source: fillSource,\n target: tgt,\n start: {\n [property]: _getEdge(bounds, subBounds, 'start', Math.max)\n },\n end: {\n [property]: _getEdge(bounds, subBounds, 'end', Math.min)\n }\n });\n }\n }\n }\n return parts;\n}\nfunction _getBounds(property, first, last, loop) {\n if (loop) {\n return;\n }\n let start = first[property];\n let end = last[property];\n if (property === 'angle') {\n start = _normalizeAngle(start);\n end = _normalizeAngle(end);\n }\n return {property, start, end};\n}\nfunction _pointsFromSegments(boundary, line) {\n const {x = null, y = null} = boundary || {};\n const linePoints = line.points;\n const points = [];\n line.segments.forEach(({start, end}) => {\n end = _findSegmentEnd(start, end, linePoints);\n const first = linePoints[start];\n const last = linePoints[end];\n if (y !== null) {\n points.push({x: first.x, y});\n points.push({x: last.x, y});\n } else if (x !== null) {\n points.push({x, y: first.y});\n points.push({x, y: last.y});\n }\n });\n return points;\n}\nfunction _findSegmentEnd(start, end, points) {\n for (;end > start; end--) {\n const point = points[end];\n if (!isNaN(point.x) && !isNaN(point.y)) {\n break;\n }\n }\n return end;\n}\nfunction _getEdge(a, b, prop, fn) {\n if (a && b) {\n return fn(a[prop], b[prop]);\n }\n return a ? a[prop] : b ? b[prop] : 0;\n}\n\nfunction _createBoundaryLine(boundary, line) {\n let points = [];\n let _loop = false;\n if (isArray(boundary)) {\n _loop = true;\n points = boundary;\n } else {\n points = _pointsFromSegments(boundary, line);\n }\n return points.length ? new LineElement({\n points,\n options: {tension: 0},\n _loop,\n _fullLoop: _loop\n }) : null;\n}\nfunction _shouldApplyFill(source) {\n return source && source.fill !== false;\n}\n\nfunction _resolveTarget(sources, index, propagate) {\n const source = sources[index];\n let fill = source.fill;\n const visited = [index];\n let target;\n if (!propagate) {\n return fill;\n }\n while (fill !== false && visited.indexOf(fill) === -1) {\n if (!isNumberFinite(fill)) {\n return fill;\n }\n target = sources[fill];\n if (!target) {\n return false;\n }\n if (target.visible) {\n return fill;\n }\n visited.push(fill);\n fill = target.fill;\n }\n return false;\n}\nfunction _decodeFill(line, index, count) {\n const fill = parseFillOption(line);\n if (isObject(fill)) {\n return isNaN(fill.value) ? false : fill;\n }\n let target = parseFloat(fill);\n if (isNumberFinite(target) && Math.floor(target) === target) {\n return decodeTargetIndex(fill[0], index, target, count);\n }\n return ['origin', 'start', 'end', 'stack', 'shape'].indexOf(fill) >= 0 && fill;\n}\nfunction decodeTargetIndex(firstCh, index, target, count) {\n if (firstCh === '-' || firstCh === '+') {\n target = index + target;\n }\n if (target === index || target < 0 || target >= count) {\n return false;\n }\n return target;\n}\nfunction _getTargetPixel(fill, scale) {\n let pixel = null;\n if (fill === 'start') {\n pixel = scale.bottom;\n } else if (fill === 'end') {\n pixel = scale.top;\n } else if (isObject(fill)) {\n pixel = scale.getPixelForValue(fill.value);\n } else if (scale.getBasePixel) {\n pixel = scale.getBasePixel();\n }\n return pixel;\n}\nfunction _getTargetValue(fill, scale, startValue) {\n let value;\n if (fill === 'start') {\n value = startValue;\n } else if (fill === 'end') {\n value = scale.options.reverse ? scale.min : scale.max;\n } else if (isObject(fill)) {\n value = fill.value;\n } else {\n value = scale.getBaseValue();\n }\n return value;\n}\nfunction parseFillOption(line) {\n const options = line.options;\n const fillOption = options.fill;\n let fill = valueOrDefault(fillOption && fillOption.target, fillOption);\n if (fill === undefined) {\n fill = !!options.backgroundColor;\n }\n if (fill === false || fill === null) {\n return false;\n }\n if (fill === true) {\n return 'origin';\n }\n return fill;\n}\n\nfunction _buildStackLine(source) {\n const {scale, index, line} = source;\n const points = [];\n const segments = line.segments;\n const sourcePoints = line.points;\n const linesBelow = getLinesBelow(scale, index);\n linesBelow.push(_createBoundaryLine({x: null, y: scale.bottom}, line));\n for (let i = 0; i < segments.length; i++) {\n const segment = segments[i];\n for (let j = segment.start; j <= segment.end; j++) {\n addPointsBelow(points, sourcePoints[j], linesBelow);\n }\n }\n return new LineElement({points, options: {}});\n}\nfunction getLinesBelow(scale, index) {\n const below = [];\n const metas = scale.getMatchingVisibleMetas('line');\n for (let i = 0; i < metas.length; i++) {\n const meta = metas[i];\n if (meta.index === index) {\n break;\n }\n if (!meta.hidden) {\n below.unshift(meta.dataset);\n }\n }\n return below;\n}\nfunction addPointsBelow(points, sourcePoint, linesBelow) {\n const postponed = [];\n for (let j = 0; j < linesBelow.length; j++) {\n const line = linesBelow[j];\n const {first, last, point} = findPoint(line, sourcePoint, 'x');\n if (!point || (first && last)) {\n continue;\n }\n if (first) {\n postponed.unshift(point);\n } else {\n points.push(point);\n if (!last) {\n break;\n }\n }\n }\n points.push(...postponed);\n}\nfunction findPoint(line, sourcePoint, property) {\n const point = line.interpolate(sourcePoint, property);\n if (!point) {\n return {};\n }\n const pointValue = point[property];\n const segments = line.segments;\n const linePoints = line.points;\n let first = false;\n let last = false;\n for (let i = 0; i < segments.length; i++) {\n const segment = segments[i];\n const firstValue = linePoints[segment.start][property];\n const lastValue = linePoints[segment.end][property];\n if (_isBetween(pointValue, firstValue, lastValue)) {\n first = pointValue === firstValue;\n last = pointValue === lastValue;\n break;\n }\n }\n return {first, last, point};\n}\n\nclass simpleArc {\n constructor(opts) {\n this.x = opts.x;\n this.y = opts.y;\n this.radius = opts.radius;\n }\n pathSegment(ctx, bounds, opts) {\n const {x, y, radius} = this;\n bounds = bounds || {start: 0, end: TAU};\n ctx.arc(x, y, radius, bounds.end, bounds.start, true);\n return !opts.bounds;\n }\n interpolate(point) {\n const {x, y, radius} = this;\n const angle = point.angle;\n return {\n x: x + Math.cos(angle) * radius,\n y: y + Math.sin(angle) * radius,\n angle\n };\n }\n}\n\nfunction _getTarget(source) {\n const {chart, fill, line} = source;\n if (isNumberFinite(fill)) {\n return getLineByIndex(chart, fill);\n }\n if (fill === 'stack') {\n return _buildStackLine(source);\n }\n if (fill === 'shape') {\n return true;\n }\n const boundary = computeBoundary(source);\n if (boundary instanceof simpleArc) {\n return boundary;\n }\n return _createBoundaryLine(boundary, line);\n}\nfunction getLineByIndex(chart, index) {\n const meta = chart.getDatasetMeta(index);\n const visible = meta && chart.isDatasetVisible(index);\n return visible ? meta.dataset : null;\n}\nfunction computeBoundary(source) {\n const scale = source.scale || {};\n if (scale.getPointPositionForValue) {\n return computeCircularBoundary(source);\n }\n return computeLinearBoundary(source);\n}\nfunction computeLinearBoundary(source) {\n const {scale = {}, fill} = source;\n const pixel = _getTargetPixel(fill, scale);\n if (isNumberFinite(pixel)) {\n const horizontal = scale.isHorizontal();\n return {\n x: horizontal ? pixel : null,\n y: horizontal ? null : pixel\n };\n }\n return null;\n}\nfunction computeCircularBoundary(source) {\n const {scale, fill} = source;\n const options = scale.options;\n const length = scale.getLabels().length;\n const start = options.reverse ? scale.max : scale.min;\n const value = _getTargetValue(fill, scale, start);\n const target = [];\n if (options.grid.circular) {\n const center = scale.getPointPositionForValue(0, start);\n return new simpleArc({\n x: center.x,\n y: center.y,\n radius: scale.getDistanceFromCenterForValue(value)\n });\n }\n for (let i = 0; i < length; ++i) {\n target.push(scale.getPointPositionForValue(i, value));\n }\n return target;\n}\n\nfunction _drawfill(ctx, source, area) {\n const target = _getTarget(source);\n const {line, scale, axis} = source;\n const lineOpts = line.options;\n const fillOption = lineOpts.fill;\n const color = lineOpts.backgroundColor;\n const {above = color, below = color} = fillOption || {};\n if (target && line.points.length) {\n clipArea(ctx, area);\n doFill(ctx, {line, target, above, below, area, scale, axis});\n unclipArea(ctx);\n }\n}\nfunction doFill(ctx, cfg) {\n const {line, target, above, below, area, scale} = cfg;\n const property = line._loop ? 'angle' : cfg.axis;\n ctx.save();\n if (property === 'x' && below !== above) {\n clipVertical(ctx, target, area.top);\n fill(ctx, {line, target, color: above, scale, property});\n ctx.restore();\n ctx.save();\n clipVertical(ctx, target, area.bottom);\n }\n fill(ctx, {line, target, color: below, scale, property});\n ctx.restore();\n}\nfunction clipVertical(ctx, target, clipY) {\n const {segments, points} = target;\n let first = true;\n let lineLoop = false;\n ctx.beginPath();\n for (const segment of segments) {\n const {start, end} = segment;\n const firstPoint = points[start];\n const lastPoint = points[_findSegmentEnd(start, end, points)];\n if (first) {\n ctx.moveTo(firstPoint.x, firstPoint.y);\n first = false;\n } else {\n ctx.lineTo(firstPoint.x, clipY);\n ctx.lineTo(firstPoint.x, firstPoint.y);\n }\n lineLoop = !!target.pathSegment(ctx, segment, {move: lineLoop});\n if (lineLoop) {\n ctx.closePath();\n } else {\n ctx.lineTo(lastPoint.x, clipY);\n }\n }\n ctx.lineTo(target.first().x, clipY);\n ctx.closePath();\n ctx.clip();\n}\nfunction fill(ctx, cfg) {\n const {line, target, property, color, scale} = cfg;\n const segments = _segments(line, target, property);\n for (const {source: src, target: tgt, start, end} of segments) {\n const {style: {backgroundColor = color} = {}} = src;\n const notShape = target !== true;\n ctx.save();\n ctx.fillStyle = backgroundColor;\n clipBounds(ctx, scale, notShape && _getBounds(property, start, end));\n ctx.beginPath();\n const lineLoop = !!line.pathSegment(ctx, src);\n let loop;\n if (notShape) {\n if (lineLoop) {\n ctx.closePath();\n } else {\n interpolatedLineTo(ctx, target, end, property);\n }\n const targetLoop = !!target.pathSegment(ctx, tgt, {move: lineLoop, reverse: true});\n loop = lineLoop && targetLoop;\n if (!loop) {\n interpolatedLineTo(ctx, target, start, property);\n }\n }\n ctx.closePath();\n ctx.fill(loop ? 'evenodd' : 'nonzero');\n ctx.restore();\n }\n}\nfunction clipBounds(ctx, scale, bounds) {\n const {top, bottom} = scale.chart.chartArea;\n const {property, start, end} = bounds || {};\n if (property === 'x') {\n ctx.beginPath();\n ctx.rect(start, top, end - start, bottom - top);\n ctx.clip();\n }\n}\nfunction interpolatedLineTo(ctx, target, point, property) {\n const interpolatedPoint = target.interpolate(point, property);\n if (interpolatedPoint) {\n ctx.lineTo(interpolatedPoint.x, interpolatedPoint.y);\n }\n}\n\nvar index = {\n id: 'filler',\n afterDatasetsUpdate(chart, _args, options) {\n const count = (chart.data.datasets || []).length;\n const sources = [];\n let meta, i, line, source;\n for (i = 0; i < count; ++i) {\n meta = chart.getDatasetMeta(i);\n line = meta.dataset;\n source = null;\n if (line && line.options && line instanceof LineElement) {\n source = {\n visible: chart.isDatasetVisible(i),\n index: i,\n fill: _decodeFill(line, i, count),\n chart,\n axis: meta.controller.options.indexAxis,\n scale: meta.vScale,\n line,\n };\n }\n meta.$filler = source;\n sources.push(source);\n }\n for (i = 0; i < count; ++i) {\n source = sources[i];\n if (!source || source.fill === false) {\n continue;\n }\n source.fill = _resolveTarget(sources, i, options.propagate);\n }\n },\n beforeDraw(chart, _args, options) {\n const draw = options.drawTime === 'beforeDraw';\n const metasets = chart.getSortedVisibleDatasetMetas();\n const area = chart.chartArea;\n for (let i = metasets.length - 1; i >= 0; --i) {\n const source = metasets[i].$filler;\n if (!source) {\n continue;\n }\n source.line.updateControlPoints(area, source.axis);\n if (draw && source.fill) {\n _drawfill(chart.ctx, source, area);\n }\n }\n },\n beforeDatasetsDraw(chart, _args, options) {\n if (options.drawTime !== 'beforeDatasetsDraw') {\n return;\n }\n const metasets = chart.getSortedVisibleDatasetMetas();\n for (let i = metasets.length - 1; i >= 0; --i) {\n const source = metasets[i].$filler;\n if (_shouldApplyFill(source)) {\n _drawfill(chart.ctx, source, chart.chartArea);\n }\n }\n },\n beforeDatasetDraw(chart, args, options) {\n const source = args.meta.$filler;\n if (!_shouldApplyFill(source) || options.drawTime !== 'beforeDatasetDraw') {\n return;\n }\n _drawfill(chart.ctx, source, chart.chartArea);\n },\n defaults: {\n propagate: true,\n drawTime: 'beforeDatasetDraw'\n }\n};\n\nconst getBoxSize = (labelOpts, fontSize) => {\n let {boxHeight = fontSize, boxWidth = fontSize} = labelOpts;\n if (labelOpts.usePointStyle) {\n boxHeight = Math.min(boxHeight, fontSize);\n boxWidth = labelOpts.pointStyleWidth || Math.min(boxWidth, fontSize);\n }\n return {\n boxWidth,\n boxHeight,\n itemHeight: Math.max(fontSize, boxHeight)\n };\n};\nconst itemsEqual = (a, b) => a !== null && b !== null && a.datasetIndex === b.datasetIndex && a.index === b.index;\nclass Legend extends Element {\n constructor(config) {\n super();\n this._added = false;\n this.legendHitBoxes = [];\n this._hoveredItem = null;\n this.doughnutMode = false;\n this.chart = config.chart;\n this.options = config.options;\n this.ctx = config.ctx;\n this.legendItems = undefined;\n this.columnSizes = undefined;\n this.lineWidths = undefined;\n this.maxHeight = undefined;\n this.maxWidth = undefined;\n this.top = undefined;\n this.bottom = undefined;\n this.left = undefined;\n this.right = undefined;\n this.height = undefined;\n this.width = undefined;\n this._margins = undefined;\n this.position = undefined;\n this.weight = undefined;\n this.fullSize = undefined;\n }\n update(maxWidth, maxHeight, margins) {\n this.maxWidth = maxWidth;\n this.maxHeight = maxHeight;\n this._margins = margins;\n this.setDimensions();\n this.buildLabels();\n this.fit();\n }\n setDimensions() {\n if (this.isHorizontal()) {\n this.width = this.maxWidth;\n this.left = this._margins.left;\n this.right = this.width;\n } else {\n this.height = this.maxHeight;\n this.top = this._margins.top;\n this.bottom = this.height;\n }\n }\n buildLabels() {\n const labelOpts = this.options.labels || {};\n let legendItems = callback(labelOpts.generateLabels, [this.chart], this) || [];\n if (labelOpts.filter) {\n legendItems = legendItems.filter((item) => labelOpts.filter(item, this.chart.data));\n }\n if (labelOpts.sort) {\n legendItems = legendItems.sort((a, b) => labelOpts.sort(a, b, this.chart.data));\n }\n if (this.options.reverse) {\n legendItems.reverse();\n }\n this.legendItems = legendItems;\n }\n fit() {\n const {options, ctx} = this;\n if (!options.display) {\n this.width = this.height = 0;\n return;\n }\n const labelOpts = options.labels;\n const labelFont = toFont(labelOpts.font);\n const fontSize = labelFont.size;\n const titleHeight = this._computeTitleHeight();\n const {boxWidth, itemHeight} = getBoxSize(labelOpts, fontSize);\n let width, height;\n ctx.font = labelFont.string;\n if (this.isHorizontal()) {\n width = this.maxWidth;\n height = this._fitRows(titleHeight, fontSize, boxWidth, itemHeight) + 10;\n } else {\n height = this.maxHeight;\n width = this._fitCols(titleHeight, fontSize, boxWidth, itemHeight) + 10;\n }\n this.width = Math.min(width, options.maxWidth || this.maxWidth);\n this.height = Math.min(height, options.maxHeight || this.maxHeight);\n }\n _fitRows(titleHeight, fontSize, boxWidth, itemHeight) {\n const {ctx, maxWidth, options: {labels: {padding}}} = this;\n const hitboxes = this.legendHitBoxes = [];\n const lineWidths = this.lineWidths = [0];\n const lineHeight = itemHeight + padding;\n let totalHeight = titleHeight;\n ctx.textAlign = 'left';\n ctx.textBaseline = 'middle';\n let row = -1;\n let top = -lineHeight;\n this.legendItems.forEach((legendItem, i) => {\n const itemWidth = boxWidth + (fontSize / 2) + ctx.measureText(legendItem.text).width;\n if (i === 0 || lineWidths[lineWidths.length - 1] + itemWidth + 2 * padding > maxWidth) {\n totalHeight += lineHeight;\n lineWidths[lineWidths.length - (i > 0 ? 0 : 1)] = 0;\n top += lineHeight;\n row++;\n }\n hitboxes[i] = {left: 0, top, row, width: itemWidth, height: itemHeight};\n lineWidths[lineWidths.length - 1] += itemWidth + padding;\n });\n return totalHeight;\n }\n _fitCols(titleHeight, fontSize, boxWidth, itemHeight) {\n const {ctx, maxHeight, options: {labels: {padding}}} = this;\n const hitboxes = this.legendHitBoxes = [];\n const columnSizes = this.columnSizes = [];\n const heightLimit = maxHeight - titleHeight;\n let totalWidth = padding;\n let currentColWidth = 0;\n let currentColHeight = 0;\n let left = 0;\n let col = 0;\n this.legendItems.forEach((legendItem, i) => {\n const itemWidth = boxWidth + (fontSize / 2) + ctx.measureText(legendItem.text).width;\n if (i > 0 && currentColHeight + itemHeight + 2 * padding > heightLimit) {\n totalWidth += currentColWidth + padding;\n columnSizes.push({width: currentColWidth, height: currentColHeight});\n left += currentColWidth + padding;\n col++;\n currentColWidth = currentColHeight = 0;\n }\n hitboxes[i] = {left, top: currentColHeight, col, width: itemWidth, height: itemHeight};\n currentColWidth = Math.max(currentColWidth, itemWidth);\n currentColHeight += itemHeight + padding;\n });\n totalWidth += currentColWidth;\n columnSizes.push({width: currentColWidth, height: currentColHeight});\n return totalWidth;\n }\n adjustHitBoxes() {\n if (!this.options.display) {\n return;\n }\n const titleHeight = this._computeTitleHeight();\n const {legendHitBoxes: hitboxes, options: {align, labels: {padding}, rtl}} = this;\n const rtlHelper = getRtlAdapter(rtl, this.left, this.width);\n if (this.isHorizontal()) {\n let row = 0;\n let left = _alignStartEnd(align, this.left + padding, this.right - this.lineWidths[row]);\n for (const hitbox of hitboxes) {\n if (row !== hitbox.row) {\n row = hitbox.row;\n left = _alignStartEnd(align, this.left + padding, this.right - this.lineWidths[row]);\n }\n hitbox.top += this.top + titleHeight + padding;\n hitbox.left = rtlHelper.leftForLtr(rtlHelper.x(left), hitbox.width);\n left += hitbox.width + padding;\n }\n } else {\n let col = 0;\n let top = _alignStartEnd(align, this.top + titleHeight + padding, this.bottom - this.columnSizes[col].height);\n for (const hitbox of hitboxes) {\n if (hitbox.col !== col) {\n col = hitbox.col;\n top = _alignStartEnd(align, this.top + titleHeight + padding, this.bottom - this.columnSizes[col].height);\n }\n hitbox.top = top;\n hitbox.left += this.left + padding;\n hitbox.left = rtlHelper.leftForLtr(rtlHelper.x(hitbox.left), hitbox.width);\n top += hitbox.height + padding;\n }\n }\n }\n isHorizontal() {\n return this.options.position === 'top' || this.options.position === 'bottom';\n }\n draw() {\n if (this.options.display) {\n const ctx = this.ctx;\n clipArea(ctx, this);\n this._draw();\n unclipArea(ctx);\n }\n }\n _draw() {\n const {options: opts, columnSizes, lineWidths, ctx} = this;\n const {align, labels: labelOpts} = opts;\n const defaultColor = defaults.color;\n const rtlHelper = getRtlAdapter(opts.rtl, this.left, this.width);\n const labelFont = toFont(labelOpts.font);\n const {color: fontColor, padding} = labelOpts;\n const fontSize = labelFont.size;\n const halfFontSize = fontSize / 2;\n let cursor;\n this.drawTitle();\n ctx.textAlign = rtlHelper.textAlign('left');\n ctx.textBaseline = 'middle';\n ctx.lineWidth = 0.5;\n ctx.font = labelFont.string;\n const {boxWidth, boxHeight, itemHeight} = getBoxSize(labelOpts, fontSize);\n const drawLegendBox = function(x, y, legendItem) {\n if (isNaN(boxWidth) || boxWidth <= 0 || isNaN(boxHeight) || boxHeight < 0) {\n return;\n }\n ctx.save();\n const lineWidth = valueOrDefault(legendItem.lineWidth, 1);\n ctx.fillStyle = valueOrDefault(legendItem.fillStyle, defaultColor);\n ctx.lineCap = valueOrDefault(legendItem.lineCap, 'butt');\n ctx.lineDashOffset = valueOrDefault(legendItem.lineDashOffset, 0);\n ctx.lineJoin = valueOrDefault(legendItem.lineJoin, 'miter');\n ctx.lineWidth = lineWidth;\n ctx.strokeStyle = valueOrDefault(legendItem.strokeStyle, defaultColor);\n ctx.setLineDash(valueOrDefault(legendItem.lineDash, []));\n if (labelOpts.usePointStyle) {\n const drawOptions = {\n radius: boxHeight * Math.SQRT2 / 2,\n pointStyle: legendItem.pointStyle,\n rotation: legendItem.rotation,\n borderWidth: lineWidth\n };\n const centerX = rtlHelper.xPlus(x, boxWidth / 2);\n const centerY = y + halfFontSize;\n drawPointLegend(ctx, drawOptions, centerX, centerY, labelOpts.pointStyleWidth && boxWidth);\n } else {\n const yBoxTop = y + Math.max((fontSize - boxHeight) / 2, 0);\n const xBoxLeft = rtlHelper.leftForLtr(x, boxWidth);\n const borderRadius = toTRBLCorners(legendItem.borderRadius);\n ctx.beginPath();\n if (Object.values(borderRadius).some(v => v !== 0)) {\n addRoundedRectPath(ctx, {\n x: xBoxLeft,\n y: yBoxTop,\n w: boxWidth,\n h: boxHeight,\n radius: borderRadius,\n });\n } else {\n ctx.rect(xBoxLeft, yBoxTop, boxWidth, boxHeight);\n }\n ctx.fill();\n if (lineWidth !== 0) {\n ctx.stroke();\n }\n }\n ctx.restore();\n };\n const fillText = function(x, y, legendItem) {\n renderText(ctx, legendItem.text, x, y + (itemHeight / 2), labelFont, {\n strikethrough: legendItem.hidden,\n textAlign: rtlHelper.textAlign(legendItem.textAlign)\n });\n };\n const isHorizontal = this.isHorizontal();\n const titleHeight = this._computeTitleHeight();\n if (isHorizontal) {\n cursor = {\n x: _alignStartEnd(align, this.left + padding, this.right - lineWidths[0]),\n y: this.top + padding + titleHeight,\n line: 0\n };\n } else {\n cursor = {\n x: this.left + padding,\n y: _alignStartEnd(align, this.top + titleHeight + padding, this.bottom - columnSizes[0].height),\n line: 0\n };\n }\n overrideTextDirection(this.ctx, opts.textDirection);\n const lineHeight = itemHeight + padding;\n this.legendItems.forEach((legendItem, i) => {\n ctx.strokeStyle = legendItem.fontColor || fontColor;\n ctx.fillStyle = legendItem.fontColor || fontColor;\n const textWidth = ctx.measureText(legendItem.text).width;\n const textAlign = rtlHelper.textAlign(legendItem.textAlign || (legendItem.textAlign = labelOpts.textAlign));\n const width = boxWidth + halfFontSize + textWidth;\n let x = cursor.x;\n let y = cursor.y;\n rtlHelper.setWidth(this.width);\n if (isHorizontal) {\n if (i > 0 && x + width + padding > this.right) {\n y = cursor.y += lineHeight;\n cursor.line++;\n x = cursor.x = _alignStartEnd(align, this.left + padding, this.right - lineWidths[cursor.line]);\n }\n } else if (i > 0 && y + lineHeight > this.bottom) {\n x = cursor.x = x + columnSizes[cursor.line].width + padding;\n cursor.line++;\n y = cursor.y = _alignStartEnd(align, this.top + titleHeight + padding, this.bottom - columnSizes[cursor.line].height);\n }\n const realX = rtlHelper.x(x);\n drawLegendBox(realX, y, legendItem);\n x = _textX(textAlign, x + boxWidth + halfFontSize, isHorizontal ? x + width : this.right, opts.rtl);\n fillText(rtlHelper.x(x), y, legendItem);\n if (isHorizontal) {\n cursor.x += width + padding;\n } else {\n cursor.y += lineHeight;\n }\n });\n restoreTextDirection(this.ctx, opts.textDirection);\n }\n drawTitle() {\n const opts = this.options;\n const titleOpts = opts.title;\n const titleFont = toFont(titleOpts.font);\n const titlePadding = toPadding(titleOpts.padding);\n if (!titleOpts.display) {\n return;\n }\n const rtlHelper = getRtlAdapter(opts.rtl, this.left, this.width);\n const ctx = this.ctx;\n const position = titleOpts.position;\n const halfFontSize = titleFont.size / 2;\n const topPaddingPlusHalfFontSize = titlePadding.top + halfFontSize;\n let y;\n let left = this.left;\n let maxWidth = this.width;\n if (this.isHorizontal()) {\n maxWidth = Math.max(...this.lineWidths);\n y = this.top + topPaddingPlusHalfFontSize;\n left = _alignStartEnd(opts.align, left, this.right - maxWidth);\n } else {\n const maxHeight = this.columnSizes.reduce((acc, size) => Math.max(acc, size.height), 0);\n y = topPaddingPlusHalfFontSize + _alignStartEnd(opts.align, this.top, this.bottom - maxHeight - opts.labels.padding - this._computeTitleHeight());\n }\n const x = _alignStartEnd(position, left, left + maxWidth);\n ctx.textAlign = rtlHelper.textAlign(_toLeftRightCenter(position));\n ctx.textBaseline = 'middle';\n ctx.strokeStyle = titleOpts.color;\n ctx.fillStyle = titleOpts.color;\n ctx.font = titleFont.string;\n renderText(ctx, titleOpts.text, x, y, titleFont);\n }\n _computeTitleHeight() {\n const titleOpts = this.options.title;\n const titleFont = toFont(titleOpts.font);\n const titlePadding = toPadding(titleOpts.padding);\n return titleOpts.display ? titleFont.lineHeight + titlePadding.height : 0;\n }\n _getLegendItemAt(x, y) {\n let i, hitBox, lh;\n if (_isBetween(x, this.left, this.right)\n && _isBetween(y, this.top, this.bottom)) {\n lh = this.legendHitBoxes;\n for (i = 0; i < lh.length; ++i) {\n hitBox = lh[i];\n if (_isBetween(x, hitBox.left, hitBox.left + hitBox.width)\n && _isBetween(y, hitBox.top, hitBox.top + hitBox.height)) {\n return this.legendItems[i];\n }\n }\n }\n return null;\n }\n handleEvent(e) {\n const opts = this.options;\n if (!isListened(e.type, opts)) {\n return;\n }\n const hoveredItem = this._getLegendItemAt(e.x, e.y);\n if (e.type === 'mousemove' || e.type === 'mouseout') {\n const previous = this._hoveredItem;\n const sameItem = itemsEqual(previous, hoveredItem);\n if (previous && !sameItem) {\n callback(opts.onLeave, [e, previous, this], this);\n }\n this._hoveredItem = hoveredItem;\n if (hoveredItem && !sameItem) {\n callback(opts.onHover, [e, hoveredItem, this], this);\n }\n } else if (hoveredItem) {\n callback(opts.onClick, [e, hoveredItem, this], this);\n }\n }\n}\nfunction isListened(type, opts) {\n if ((type === 'mousemove' || type === 'mouseout') && (opts.onHover || opts.onLeave)) {\n return true;\n }\n if (opts.onClick && (type === 'click' || type === 'mouseup')) {\n return true;\n }\n return false;\n}\nvar plugin_legend = {\n id: 'legend',\n _element: Legend,\n start(chart, _args, options) {\n const legend = chart.legend = new Legend({ctx: chart.ctx, options, chart});\n layouts.configure(chart, legend, options);\n layouts.addBox(chart, legend);\n },\n stop(chart) {\n layouts.removeBox(chart, chart.legend);\n delete chart.legend;\n },\n beforeUpdate(chart, _args, options) {\n const legend = chart.legend;\n layouts.configure(chart, legend, options);\n legend.options = options;\n },\n afterUpdate(chart) {\n const legend = chart.legend;\n legend.buildLabels();\n legend.adjustHitBoxes();\n },\n afterEvent(chart, args) {\n if (!args.replay) {\n chart.legend.handleEvent(args.event);\n }\n },\n defaults: {\n display: true,\n position: 'top',\n align: 'center',\n fullSize: true,\n reverse: false,\n weight: 1000,\n onClick(e, legendItem, legend) {\n const index = legendItem.datasetIndex;\n const ci = legend.chart;\n if (ci.isDatasetVisible(index)) {\n ci.hide(index);\n legendItem.hidden = true;\n } else {\n ci.show(index);\n legendItem.hidden = false;\n }\n },\n onHover: null,\n onLeave: null,\n labels: {\n color: (ctx) => ctx.chart.options.color,\n boxWidth: 40,\n padding: 10,\n generateLabels(chart) {\n const datasets = chart.data.datasets;\n const {labels: {usePointStyle, pointStyle, textAlign, color}} = chart.legend.options;\n return chart._getSortedDatasetMetas().map((meta) => {\n const style = meta.controller.getStyle(usePointStyle ? 0 : undefined);\n const borderWidth = toPadding(style.borderWidth);\n return {\n text: datasets[meta.index].label,\n fillStyle: style.backgroundColor,\n fontColor: color,\n hidden: !meta.visible,\n lineCap: style.borderCapStyle,\n lineDash: style.borderDash,\n lineDashOffset: style.borderDashOffset,\n lineJoin: style.borderJoinStyle,\n lineWidth: (borderWidth.width + borderWidth.height) / 4,\n strokeStyle: style.borderColor,\n pointStyle: pointStyle || style.pointStyle,\n rotation: style.rotation,\n textAlign: textAlign || style.textAlign,\n borderRadius: 0,\n datasetIndex: meta.index\n };\n }, this);\n }\n },\n title: {\n color: (ctx) => ctx.chart.options.color,\n display: false,\n position: 'center',\n text: '',\n }\n },\n descriptors: {\n _scriptable: (name) => !name.startsWith('on'),\n labels: {\n _scriptable: (name) => !['generateLabels', 'filter', 'sort'].includes(name),\n }\n },\n};\n\nclass Title extends Element {\n constructor(config) {\n super();\n this.chart = config.chart;\n this.options = config.options;\n this.ctx = config.ctx;\n this._padding = undefined;\n this.top = undefined;\n this.bottom = undefined;\n this.left = undefined;\n this.right = undefined;\n this.width = undefined;\n this.height = undefined;\n this.position = undefined;\n this.weight = undefined;\n this.fullSize = undefined;\n }\n update(maxWidth, maxHeight) {\n const opts = this.options;\n this.left = 0;\n this.top = 0;\n if (!opts.display) {\n this.width = this.height = this.right = this.bottom = 0;\n return;\n }\n this.width = this.right = maxWidth;\n this.height = this.bottom = maxHeight;\n const lineCount = isArray(opts.text) ? opts.text.length : 1;\n this._padding = toPadding(opts.padding);\n const textSize = lineCount * toFont(opts.font).lineHeight + this._padding.height;\n if (this.isHorizontal()) {\n this.height = textSize;\n } else {\n this.width = textSize;\n }\n }\n isHorizontal() {\n const pos = this.options.position;\n return pos === 'top' || pos === 'bottom';\n }\n _drawArgs(offset) {\n const {top, left, bottom, right, options} = this;\n const align = options.align;\n let rotation = 0;\n let maxWidth, titleX, titleY;\n if (this.isHorizontal()) {\n titleX = _alignStartEnd(align, left, right);\n titleY = top + offset;\n maxWidth = right - left;\n } else {\n if (options.position === 'left') {\n titleX = left + offset;\n titleY = _alignStartEnd(align, bottom, top);\n rotation = PI * -0.5;\n } else {\n titleX = right - offset;\n titleY = _alignStartEnd(align, top, bottom);\n rotation = PI * 0.5;\n }\n maxWidth = bottom - top;\n }\n return {titleX, titleY, maxWidth, rotation};\n }\n draw() {\n const ctx = this.ctx;\n const opts = this.options;\n if (!opts.display) {\n return;\n }\n const fontOpts = toFont(opts.font);\n const lineHeight = fontOpts.lineHeight;\n const offset = lineHeight / 2 + this._padding.top;\n const {titleX, titleY, maxWidth, rotation} = this._drawArgs(offset);\n renderText(ctx, opts.text, 0, 0, fontOpts, {\n color: opts.color,\n maxWidth,\n rotation,\n textAlign: _toLeftRightCenter(opts.align),\n textBaseline: 'middle',\n translation: [titleX, titleY],\n });\n }\n}\nfunction createTitle(chart, titleOpts) {\n const title = new Title({\n ctx: chart.ctx,\n options: titleOpts,\n chart\n });\n layouts.configure(chart, title, titleOpts);\n layouts.addBox(chart, title);\n chart.titleBlock = title;\n}\nvar plugin_title = {\n id: 'title',\n _element: Title,\n start(chart, _args, options) {\n createTitle(chart, options);\n },\n stop(chart) {\n const titleBlock = chart.titleBlock;\n layouts.removeBox(chart, titleBlock);\n delete chart.titleBlock;\n },\n beforeUpdate(chart, _args, options) {\n const title = chart.titleBlock;\n layouts.configure(chart, title, options);\n title.options = options;\n },\n defaults: {\n align: 'center',\n display: false,\n font: {\n weight: 'bold',\n },\n fullSize: true,\n padding: 10,\n position: 'top',\n text: '',\n weight: 2000\n },\n defaultRoutes: {\n color: 'color'\n },\n descriptors: {\n _scriptable: true,\n _indexable: false,\n },\n};\n\nconst map = new WeakMap();\nvar plugin_subtitle = {\n id: 'subtitle',\n start(chart, _args, options) {\n const title = new Title({\n ctx: chart.ctx,\n options,\n chart\n });\n layouts.configure(chart, title, options);\n layouts.addBox(chart, title);\n map.set(chart, title);\n },\n stop(chart) {\n layouts.removeBox(chart, map.get(chart));\n map.delete(chart);\n },\n beforeUpdate(chart, _args, options) {\n const title = map.get(chart);\n layouts.configure(chart, title, options);\n title.options = options;\n },\n defaults: {\n align: 'center',\n display: false,\n font: {\n weight: 'normal',\n },\n fullSize: true,\n padding: 0,\n position: 'top',\n text: '',\n weight: 1500\n },\n defaultRoutes: {\n color: 'color'\n },\n descriptors: {\n _scriptable: true,\n _indexable: false,\n },\n};\n\nconst positioners = {\n average(items) {\n if (!items.length) {\n return false;\n }\n let i, len;\n let x = 0;\n let y = 0;\n let count = 0;\n for (i = 0, len = items.length; i < len; ++i) {\n const el = items[i].element;\n if (el && el.hasValue()) {\n const pos = el.tooltipPosition();\n x += pos.x;\n y += pos.y;\n ++count;\n }\n }\n return {\n x: x / count,\n y: y / count\n };\n },\n nearest(items, eventPosition) {\n if (!items.length) {\n return false;\n }\n let x = eventPosition.x;\n let y = eventPosition.y;\n let minDistance = Number.POSITIVE_INFINITY;\n let i, len, nearestElement;\n for (i = 0, len = items.length; i < len; ++i) {\n const el = items[i].element;\n if (el && el.hasValue()) {\n const center = el.getCenterPoint();\n const d = distanceBetweenPoints(eventPosition, center);\n if (d < minDistance) {\n minDistance = d;\n nearestElement = el;\n }\n }\n }\n if (nearestElement) {\n const tp = nearestElement.tooltipPosition();\n x = tp.x;\n y = tp.y;\n }\n return {\n x,\n y\n };\n }\n};\nfunction pushOrConcat(base, toPush) {\n if (toPush) {\n if (isArray(toPush)) {\n Array.prototype.push.apply(base, toPush);\n } else {\n base.push(toPush);\n }\n }\n return base;\n}\nfunction splitNewlines(str) {\n if ((typeof str === 'string' || str instanceof String) && str.indexOf('\\n') > -1) {\n return str.split('\\n');\n }\n return str;\n}\nfunction createTooltipItem(chart, item) {\n const {element, datasetIndex, index} = item;\n const controller = chart.getDatasetMeta(datasetIndex).controller;\n const {label, value} = controller.getLabelAndValue(index);\n return {\n chart,\n label,\n parsed: controller.getParsed(index),\n raw: chart.data.datasets[datasetIndex].data[index],\n formattedValue: value,\n dataset: controller.getDataset(),\n dataIndex: index,\n datasetIndex,\n element\n };\n}\nfunction getTooltipSize(tooltip, options) {\n const ctx = tooltip.chart.ctx;\n const {body, footer, title} = tooltip;\n const {boxWidth, boxHeight} = options;\n const bodyFont = toFont(options.bodyFont);\n const titleFont = toFont(options.titleFont);\n const footerFont = toFont(options.footerFont);\n const titleLineCount = title.length;\n const footerLineCount = footer.length;\n const bodyLineItemCount = body.length;\n const padding = toPadding(options.padding);\n let height = padding.height;\n let width = 0;\n let combinedBodyLength = body.reduce((count, bodyItem) => count + bodyItem.before.length + bodyItem.lines.length + bodyItem.after.length, 0);\n combinedBodyLength += tooltip.beforeBody.length + tooltip.afterBody.length;\n if (titleLineCount) {\n height += titleLineCount * titleFont.lineHeight\n\t\t\t+ (titleLineCount - 1) * options.titleSpacing\n\t\t\t+ options.titleMarginBottom;\n }\n if (combinedBodyLength) {\n const bodyLineHeight = options.displayColors ? Math.max(boxHeight, bodyFont.lineHeight) : bodyFont.lineHeight;\n height += bodyLineItemCount * bodyLineHeight\n\t\t\t+ (combinedBodyLength - bodyLineItemCount) * bodyFont.lineHeight\n\t\t\t+ (combinedBodyLength - 1) * options.bodySpacing;\n }\n if (footerLineCount) {\n height += options.footerMarginTop\n\t\t\t+ footerLineCount * footerFont.lineHeight\n\t\t\t+ (footerLineCount - 1) * options.footerSpacing;\n }\n let widthPadding = 0;\n const maxLineWidth = function(line) {\n width = Math.max(width, ctx.measureText(line).width + widthPadding);\n };\n ctx.save();\n ctx.font = titleFont.string;\n each(tooltip.title, maxLineWidth);\n ctx.font = bodyFont.string;\n each(tooltip.beforeBody.concat(tooltip.afterBody), maxLineWidth);\n widthPadding = options.displayColors ? (boxWidth + 2 + options.boxPadding) : 0;\n each(body, (bodyItem) => {\n each(bodyItem.before, maxLineWidth);\n each(bodyItem.lines, maxLineWidth);\n each(bodyItem.after, maxLineWidth);\n });\n widthPadding = 0;\n ctx.font = footerFont.string;\n each(tooltip.footer, maxLineWidth);\n ctx.restore();\n width += padding.width;\n return {width, height};\n}\nfunction determineYAlign(chart, size) {\n const {y, height} = size;\n if (y < height / 2) {\n return 'top';\n } else if (y > (chart.height - height / 2)) {\n return 'bottom';\n }\n return 'center';\n}\nfunction doesNotFitWithAlign(xAlign, chart, options, size) {\n const {x, width} = size;\n const caret = options.caretSize + options.caretPadding;\n if (xAlign === 'left' && x + width + caret > chart.width) {\n return true;\n }\n if (xAlign === 'right' && x - width - caret < 0) {\n return true;\n }\n}\nfunction determineXAlign(chart, options, size, yAlign) {\n const {x, width} = size;\n const {width: chartWidth, chartArea: {left, right}} = chart;\n let xAlign = 'center';\n if (yAlign === 'center') {\n xAlign = x <= (left + right) / 2 ? 'left' : 'right';\n } else if (x <= width / 2) {\n xAlign = 'left';\n } else if (x >= chartWidth - width / 2) {\n xAlign = 'right';\n }\n if (doesNotFitWithAlign(xAlign, chart, options, size)) {\n xAlign = 'center';\n }\n return xAlign;\n}\nfunction determineAlignment(chart, options, size) {\n const yAlign = size.yAlign || options.yAlign || determineYAlign(chart, size);\n return {\n xAlign: size.xAlign || options.xAlign || determineXAlign(chart, options, size, yAlign),\n yAlign\n };\n}\nfunction alignX(size, xAlign) {\n let {x, width} = size;\n if (xAlign === 'right') {\n x -= width;\n } else if (xAlign === 'center') {\n x -= (width / 2);\n }\n return x;\n}\nfunction alignY(size, yAlign, paddingAndSize) {\n let {y, height} = size;\n if (yAlign === 'top') {\n y += paddingAndSize;\n } else if (yAlign === 'bottom') {\n y -= height + paddingAndSize;\n } else {\n y -= (height / 2);\n }\n return y;\n}\nfunction getBackgroundPoint(options, size, alignment, chart) {\n const {caretSize, caretPadding, cornerRadius} = options;\n const {xAlign, yAlign} = alignment;\n const paddingAndSize = caretSize + caretPadding;\n const {topLeft, topRight, bottomLeft, bottomRight} = toTRBLCorners(cornerRadius);\n let x = alignX(size, xAlign);\n const y = alignY(size, yAlign, paddingAndSize);\n if (yAlign === 'center') {\n if (xAlign === 'left') {\n x += paddingAndSize;\n } else if (xAlign === 'right') {\n x -= paddingAndSize;\n }\n } else if (xAlign === 'left') {\n x -= Math.max(topLeft, bottomLeft) + caretSize;\n } else if (xAlign === 'right') {\n x += Math.max(topRight, bottomRight) + caretSize;\n }\n return {\n x: _limitValue(x, 0, chart.width - size.width),\n y: _limitValue(y, 0, chart.height - size.height)\n };\n}\nfunction getAlignedX(tooltip, align, options) {\n const padding = toPadding(options.padding);\n return align === 'center'\n ? tooltip.x + tooltip.width / 2\n : align === 'right'\n ? tooltip.x + tooltip.width - padding.right\n : tooltip.x + padding.left;\n}\nfunction getBeforeAfterBodyLines(callback) {\n return pushOrConcat([], splitNewlines(callback));\n}\nfunction createTooltipContext(parent, tooltip, tooltipItems) {\n return createContext(parent, {\n tooltip,\n tooltipItems,\n type: 'tooltip'\n });\n}\nfunction overrideCallbacks(callbacks, context) {\n const override = context && context.dataset && context.dataset.tooltip && context.dataset.tooltip.callbacks;\n return override ? callbacks.override(override) : callbacks;\n}\nclass Tooltip extends Element {\n constructor(config) {\n super();\n this.opacity = 0;\n this._active = [];\n this._eventPosition = undefined;\n this._size = undefined;\n this._cachedAnimations = undefined;\n this._tooltipItems = [];\n this.$animations = undefined;\n this.$context = undefined;\n this.chart = config.chart || config._chart;\n this._chart = this.chart;\n this.options = config.options;\n this.dataPoints = undefined;\n this.title = undefined;\n this.beforeBody = undefined;\n this.body = undefined;\n this.afterBody = undefined;\n this.footer = undefined;\n this.xAlign = undefined;\n this.yAlign = undefined;\n this.x = undefined;\n this.y = undefined;\n this.height = undefined;\n this.width = undefined;\n this.caretX = undefined;\n this.caretY = undefined;\n this.labelColors = undefined;\n this.labelPointStyles = undefined;\n this.labelTextColors = undefined;\n }\n initialize(options) {\n this.options = options;\n this._cachedAnimations = undefined;\n this.$context = undefined;\n }\n _resolveAnimations() {\n const cached = this._cachedAnimations;\n if (cached) {\n return cached;\n }\n const chart = this.chart;\n const options = this.options.setContext(this.getContext());\n const opts = options.enabled && chart.options.animation && options.animations;\n const animations = new Animations(this.chart, opts);\n if (opts._cacheable) {\n this._cachedAnimations = Object.freeze(animations);\n }\n return animations;\n }\n getContext() {\n return this.$context ||\n\t\t\t(this.$context = createTooltipContext(this.chart.getContext(), this, this._tooltipItems));\n }\n getTitle(context, options) {\n const {callbacks} = options;\n const beforeTitle = callbacks.beforeTitle.apply(this, [context]);\n const title = callbacks.title.apply(this, [context]);\n const afterTitle = callbacks.afterTitle.apply(this, [context]);\n let lines = [];\n lines = pushOrConcat(lines, splitNewlines(beforeTitle));\n lines = pushOrConcat(lines, splitNewlines(title));\n lines = pushOrConcat(lines, splitNewlines(afterTitle));\n return lines;\n }\n getBeforeBody(tooltipItems, options) {\n return getBeforeAfterBodyLines(options.callbacks.beforeBody.apply(this, [tooltipItems]));\n }\n getBody(tooltipItems, options) {\n const {callbacks} = options;\n const bodyItems = [];\n each(tooltipItems, (context) => {\n const bodyItem = {\n before: [],\n lines: [],\n after: []\n };\n const scoped = overrideCallbacks(callbacks, context);\n pushOrConcat(bodyItem.before, splitNewlines(scoped.beforeLabel.call(this, context)));\n pushOrConcat(bodyItem.lines, scoped.label.call(this, context));\n pushOrConcat(bodyItem.after, splitNewlines(scoped.afterLabel.call(this, context)));\n bodyItems.push(bodyItem);\n });\n return bodyItems;\n }\n getAfterBody(tooltipItems, options) {\n return getBeforeAfterBodyLines(options.callbacks.afterBody.apply(this, [tooltipItems]));\n }\n getFooter(tooltipItems, options) {\n const {callbacks} = options;\n const beforeFooter = callbacks.beforeFooter.apply(this, [tooltipItems]);\n const footer = callbacks.footer.apply(this, [tooltipItems]);\n const afterFooter = callbacks.afterFooter.apply(this, [tooltipItems]);\n let lines = [];\n lines = pushOrConcat(lines, splitNewlines(beforeFooter));\n lines = pushOrConcat(lines, splitNewlines(footer));\n lines = pushOrConcat(lines, splitNewlines(afterFooter));\n return lines;\n }\n _createItems(options) {\n const active = this._active;\n const data = this.chart.data;\n const labelColors = [];\n const labelPointStyles = [];\n const labelTextColors = [];\n let tooltipItems = [];\n let i, len;\n for (i = 0, len = active.length; i < len; ++i) {\n tooltipItems.push(createTooltipItem(this.chart, active[i]));\n }\n if (options.filter) {\n tooltipItems = tooltipItems.filter((element, index, array) => options.filter(element, index, array, data));\n }\n if (options.itemSort) {\n tooltipItems = tooltipItems.sort((a, b) => options.itemSort(a, b, data));\n }\n each(tooltipItems, (context) => {\n const scoped = overrideCallbacks(options.callbacks, context);\n labelColors.push(scoped.labelColor.call(this, context));\n labelPointStyles.push(scoped.labelPointStyle.call(this, context));\n labelTextColors.push(scoped.labelTextColor.call(this, context));\n });\n this.labelColors = labelColors;\n this.labelPointStyles = labelPointStyles;\n this.labelTextColors = labelTextColors;\n this.dataPoints = tooltipItems;\n return tooltipItems;\n }\n update(changed, replay) {\n const options = this.options.setContext(this.getContext());\n const active = this._active;\n let properties;\n let tooltipItems = [];\n if (!active.length) {\n if (this.opacity !== 0) {\n properties = {\n opacity: 0\n };\n }\n } else {\n const position = positioners[options.position].call(this, active, this._eventPosition);\n tooltipItems = this._createItems(options);\n this.title = this.getTitle(tooltipItems, options);\n this.beforeBody = this.getBeforeBody(tooltipItems, options);\n this.body = this.getBody(tooltipItems, options);\n this.afterBody = this.getAfterBody(tooltipItems, options);\n this.footer = this.getFooter(tooltipItems, options);\n const size = this._size = getTooltipSize(this, options);\n const positionAndSize = Object.assign({}, position, size);\n const alignment = determineAlignment(this.chart, options, positionAndSize);\n const backgroundPoint = getBackgroundPoint(options, positionAndSize, alignment, this.chart);\n this.xAlign = alignment.xAlign;\n this.yAlign = alignment.yAlign;\n properties = {\n opacity: 1,\n x: backgroundPoint.x,\n y: backgroundPoint.y,\n width: size.width,\n height: size.height,\n caretX: position.x,\n caretY: position.y\n };\n }\n this._tooltipItems = tooltipItems;\n this.$context = undefined;\n if (properties) {\n this._resolveAnimations().update(this, properties);\n }\n if (changed && options.external) {\n options.external.call(this, {chart: this.chart, tooltip: this, replay});\n }\n }\n drawCaret(tooltipPoint, ctx, size, options) {\n const caretPosition = this.getCaretPosition(tooltipPoint, size, options);\n ctx.lineTo(caretPosition.x1, caretPosition.y1);\n ctx.lineTo(caretPosition.x2, caretPosition.y2);\n ctx.lineTo(caretPosition.x3, caretPosition.y3);\n }\n getCaretPosition(tooltipPoint, size, options) {\n const {xAlign, yAlign} = this;\n const {caretSize, cornerRadius} = options;\n const {topLeft, topRight, bottomLeft, bottomRight} = toTRBLCorners(cornerRadius);\n const {x: ptX, y: ptY} = tooltipPoint;\n const {width, height} = size;\n let x1, x2, x3, y1, y2, y3;\n if (yAlign === 'center') {\n y2 = ptY + (height / 2);\n if (xAlign === 'left') {\n x1 = ptX;\n x2 = x1 - caretSize;\n y1 = y2 + caretSize;\n y3 = y2 - caretSize;\n } else {\n x1 = ptX + width;\n x2 = x1 + caretSize;\n y1 = y2 - caretSize;\n y3 = y2 + caretSize;\n }\n x3 = x1;\n } else {\n if (xAlign === 'left') {\n x2 = ptX + Math.max(topLeft, bottomLeft) + (caretSize);\n } else if (xAlign === 'right') {\n x2 = ptX + width - Math.max(topRight, bottomRight) - caretSize;\n } else {\n x2 = this.caretX;\n }\n if (yAlign === 'top') {\n y1 = ptY;\n y2 = y1 - caretSize;\n x1 = x2 - caretSize;\n x3 = x2 + caretSize;\n } else {\n y1 = ptY + height;\n y2 = y1 + caretSize;\n x1 = x2 + caretSize;\n x3 = x2 - caretSize;\n }\n y3 = y1;\n }\n return {x1, x2, x3, y1, y2, y3};\n }\n drawTitle(pt, ctx, options) {\n const title = this.title;\n const length = title.length;\n let titleFont, titleSpacing, i;\n if (length) {\n const rtlHelper = getRtlAdapter(options.rtl, this.x, this.width);\n pt.x = getAlignedX(this, options.titleAlign, options);\n ctx.textAlign = rtlHelper.textAlign(options.titleAlign);\n ctx.textBaseline = 'middle';\n titleFont = toFont(options.titleFont);\n titleSpacing = options.titleSpacing;\n ctx.fillStyle = options.titleColor;\n ctx.font = titleFont.string;\n for (i = 0; i < length; ++i) {\n ctx.fillText(title[i], rtlHelper.x(pt.x), pt.y + titleFont.lineHeight / 2);\n pt.y += titleFont.lineHeight + titleSpacing;\n if (i + 1 === length) {\n pt.y += options.titleMarginBottom - titleSpacing;\n }\n }\n }\n }\n _drawColorBox(ctx, pt, i, rtlHelper, options) {\n const labelColors = this.labelColors[i];\n const labelPointStyle = this.labelPointStyles[i];\n const {boxHeight, boxWidth, boxPadding} = options;\n const bodyFont = toFont(options.bodyFont);\n const colorX = getAlignedX(this, 'left', options);\n const rtlColorX = rtlHelper.x(colorX);\n const yOffSet = boxHeight < bodyFont.lineHeight ? (bodyFont.lineHeight - boxHeight) / 2 : 0;\n const colorY = pt.y + yOffSet;\n if (options.usePointStyle) {\n const drawOptions = {\n radius: Math.min(boxWidth, boxHeight) / 2,\n pointStyle: labelPointStyle.pointStyle,\n rotation: labelPointStyle.rotation,\n borderWidth: 1\n };\n const centerX = rtlHelper.leftForLtr(rtlColorX, boxWidth) + boxWidth / 2;\n const centerY = colorY + boxHeight / 2;\n ctx.strokeStyle = options.multiKeyBackground;\n ctx.fillStyle = options.multiKeyBackground;\n drawPoint(ctx, drawOptions, centerX, centerY);\n ctx.strokeStyle = labelColors.borderColor;\n ctx.fillStyle = labelColors.backgroundColor;\n drawPoint(ctx, drawOptions, centerX, centerY);\n } else {\n ctx.lineWidth = isObject(labelColors.borderWidth) ? Math.max(...Object.values(labelColors.borderWidth)) : (labelColors.borderWidth || 1);\n ctx.strokeStyle = labelColors.borderColor;\n ctx.setLineDash(labelColors.borderDash || []);\n ctx.lineDashOffset = labelColors.borderDashOffset || 0;\n const outerX = rtlHelper.leftForLtr(rtlColorX, boxWidth - boxPadding);\n const innerX = rtlHelper.leftForLtr(rtlHelper.xPlus(rtlColorX, 1), boxWidth - boxPadding - 2);\n const borderRadius = toTRBLCorners(labelColors.borderRadius);\n if (Object.values(borderRadius).some(v => v !== 0)) {\n ctx.beginPath();\n ctx.fillStyle = options.multiKeyBackground;\n addRoundedRectPath(ctx, {\n x: outerX,\n y: colorY,\n w: boxWidth,\n h: boxHeight,\n radius: borderRadius,\n });\n ctx.fill();\n ctx.stroke();\n ctx.fillStyle = labelColors.backgroundColor;\n ctx.beginPath();\n addRoundedRectPath(ctx, {\n x: innerX,\n y: colorY + 1,\n w: boxWidth - 2,\n h: boxHeight - 2,\n radius: borderRadius,\n });\n ctx.fill();\n } else {\n ctx.fillStyle = options.multiKeyBackground;\n ctx.fillRect(outerX, colorY, boxWidth, boxHeight);\n ctx.strokeRect(outerX, colorY, boxWidth, boxHeight);\n ctx.fillStyle = labelColors.backgroundColor;\n ctx.fillRect(innerX, colorY + 1, boxWidth - 2, boxHeight - 2);\n }\n }\n ctx.fillStyle = this.labelTextColors[i];\n }\n drawBody(pt, ctx, options) {\n const {body} = this;\n const {bodySpacing, bodyAlign, displayColors, boxHeight, boxWidth, boxPadding} = options;\n const bodyFont = toFont(options.bodyFont);\n let bodyLineHeight = bodyFont.lineHeight;\n let xLinePadding = 0;\n const rtlHelper = getRtlAdapter(options.rtl, this.x, this.width);\n const fillLineOfText = function(line) {\n ctx.fillText(line, rtlHelper.x(pt.x + xLinePadding), pt.y + bodyLineHeight / 2);\n pt.y += bodyLineHeight + bodySpacing;\n };\n const bodyAlignForCalculation = rtlHelper.textAlign(bodyAlign);\n let bodyItem, textColor, lines, i, j, ilen, jlen;\n ctx.textAlign = bodyAlign;\n ctx.textBaseline = 'middle';\n ctx.font = bodyFont.string;\n pt.x = getAlignedX(this, bodyAlignForCalculation, options);\n ctx.fillStyle = options.bodyColor;\n each(this.beforeBody, fillLineOfText);\n xLinePadding = displayColors && bodyAlignForCalculation !== 'right'\n ? bodyAlign === 'center' ? (boxWidth / 2 + boxPadding) : (boxWidth + 2 + boxPadding)\n : 0;\n for (i = 0, ilen = body.length; i < ilen; ++i) {\n bodyItem = body[i];\n textColor = this.labelTextColors[i];\n ctx.fillStyle = textColor;\n each(bodyItem.before, fillLineOfText);\n lines = bodyItem.lines;\n if (displayColors && lines.length) {\n this._drawColorBox(ctx, pt, i, rtlHelper, options);\n bodyLineHeight = Math.max(bodyFont.lineHeight, boxHeight);\n }\n for (j = 0, jlen = lines.length; j < jlen; ++j) {\n fillLineOfText(lines[j]);\n bodyLineHeight = bodyFont.lineHeight;\n }\n each(bodyItem.after, fillLineOfText);\n }\n xLinePadding = 0;\n bodyLineHeight = bodyFont.lineHeight;\n each(this.afterBody, fillLineOfText);\n pt.y -= bodySpacing;\n }\n drawFooter(pt, ctx, options) {\n const footer = this.footer;\n const length = footer.length;\n let footerFont, i;\n if (length) {\n const rtlHelper = getRtlAdapter(options.rtl, this.x, this.width);\n pt.x = getAlignedX(this, options.footerAlign, options);\n pt.y += options.footerMarginTop;\n ctx.textAlign = rtlHelper.textAlign(options.footerAlign);\n ctx.textBaseline = 'middle';\n footerFont = toFont(options.footerFont);\n ctx.fillStyle = options.footerColor;\n ctx.font = footerFont.string;\n for (i = 0; i < length; ++i) {\n ctx.fillText(footer[i], rtlHelper.x(pt.x), pt.y + footerFont.lineHeight / 2);\n pt.y += footerFont.lineHeight + options.footerSpacing;\n }\n }\n }\n drawBackground(pt, ctx, tooltipSize, options) {\n const {xAlign, yAlign} = this;\n const {x, y} = pt;\n const {width, height} = tooltipSize;\n const {topLeft, topRight, bottomLeft, bottomRight} = toTRBLCorners(options.cornerRadius);\n ctx.fillStyle = options.backgroundColor;\n ctx.strokeStyle = options.borderColor;\n ctx.lineWidth = options.borderWidth;\n ctx.beginPath();\n ctx.moveTo(x + topLeft, y);\n if (yAlign === 'top') {\n this.drawCaret(pt, ctx, tooltipSize, options);\n }\n ctx.lineTo(x + width - topRight, y);\n ctx.quadraticCurveTo(x + width, y, x + width, y + topRight);\n if (yAlign === 'center' && xAlign === 'right') {\n this.drawCaret(pt, ctx, tooltipSize, options);\n }\n ctx.lineTo(x + width, y + height - bottomRight);\n ctx.quadraticCurveTo(x + width, y + height, x + width - bottomRight, y + height);\n if (yAlign === 'bottom') {\n this.drawCaret(pt, ctx, tooltipSize, options);\n }\n ctx.lineTo(x + bottomLeft, y + height);\n ctx.quadraticCurveTo(x, y + height, x, y + height - bottomLeft);\n if (yAlign === 'center' && xAlign === 'left') {\n this.drawCaret(pt, ctx, tooltipSize, options);\n }\n ctx.lineTo(x, y + topLeft);\n ctx.quadraticCurveTo(x, y, x + topLeft, y);\n ctx.closePath();\n ctx.fill();\n if (options.borderWidth > 0) {\n ctx.stroke();\n }\n }\n _updateAnimationTarget(options) {\n const chart = this.chart;\n const anims = this.$animations;\n const animX = anims && anims.x;\n const animY = anims && anims.y;\n if (animX || animY) {\n const position = positioners[options.position].call(this, this._active, this._eventPosition);\n if (!position) {\n return;\n }\n const size = this._size = getTooltipSize(this, options);\n const positionAndSize = Object.assign({}, position, this._size);\n const alignment = determineAlignment(chart, options, positionAndSize);\n const point = getBackgroundPoint(options, positionAndSize, alignment, chart);\n if (animX._to !== point.x || animY._to !== point.y) {\n this.xAlign = alignment.xAlign;\n this.yAlign = alignment.yAlign;\n this.width = size.width;\n this.height = size.height;\n this.caretX = position.x;\n this.caretY = position.y;\n this._resolveAnimations().update(this, point);\n }\n }\n }\n _willRender() {\n return !!this.opacity;\n }\n draw(ctx) {\n const options = this.options.setContext(this.getContext());\n let opacity = this.opacity;\n if (!opacity) {\n return;\n }\n this._updateAnimationTarget(options);\n const tooltipSize = {\n width: this.width,\n height: this.height\n };\n const pt = {\n x: this.x,\n y: this.y\n };\n opacity = Math.abs(opacity) < 1e-3 ? 0 : opacity;\n const padding = toPadding(options.padding);\n const hasTooltipContent = this.title.length || this.beforeBody.length || this.body.length || this.afterBody.length || this.footer.length;\n if (options.enabled && hasTooltipContent) {\n ctx.save();\n ctx.globalAlpha = opacity;\n this.drawBackground(pt, ctx, tooltipSize, options);\n overrideTextDirection(ctx, options.textDirection);\n pt.y += padding.top;\n this.drawTitle(pt, ctx, options);\n this.drawBody(pt, ctx, options);\n this.drawFooter(pt, ctx, options);\n restoreTextDirection(ctx, options.textDirection);\n ctx.restore();\n }\n }\n getActiveElements() {\n return this._active || [];\n }\n setActiveElements(activeElements, eventPosition) {\n const lastActive = this._active;\n const active = activeElements.map(({datasetIndex, index}) => {\n const meta = this.chart.getDatasetMeta(datasetIndex);\n if (!meta) {\n throw new Error('Cannot find a dataset at index ' + datasetIndex);\n }\n return {\n datasetIndex,\n element: meta.data[index],\n index,\n };\n });\n const changed = !_elementsEqual(lastActive, active);\n const positionChanged = this._positionChanged(active, eventPosition);\n if (changed || positionChanged) {\n this._active = active;\n this._eventPosition = eventPosition;\n this._ignoreReplayEvents = true;\n this.update(true);\n }\n }\n handleEvent(e, replay, inChartArea = true) {\n if (replay && this._ignoreReplayEvents) {\n return false;\n }\n this._ignoreReplayEvents = false;\n const options = this.options;\n const lastActive = this._active || [];\n const active = this._getActiveElements(e, lastActive, replay, inChartArea);\n const positionChanged = this._positionChanged(active, e);\n const changed = replay || !_elementsEqual(active, lastActive) || positionChanged;\n if (changed) {\n this._active = active;\n if (options.enabled || options.external) {\n this._eventPosition = {\n x: e.x,\n y: e.y\n };\n this.update(true, replay);\n }\n }\n return changed;\n }\n _getActiveElements(e, lastActive, replay, inChartArea) {\n const options = this.options;\n if (e.type === 'mouseout') {\n return [];\n }\n if (!inChartArea) {\n return lastActive;\n }\n const active = this.chart.getElementsAtEventForMode(e, options.mode, options, replay);\n if (options.reverse) {\n active.reverse();\n }\n return active;\n }\n _positionChanged(active, e) {\n const {caretX, caretY, options} = this;\n const position = positioners[options.position].call(this, active, e);\n return position !== false && (caretX !== position.x || caretY !== position.y);\n }\n}\nTooltip.positioners = positioners;\nvar plugin_tooltip = {\n id: 'tooltip',\n _element: Tooltip,\n positioners,\n afterInit(chart, _args, options) {\n if (options) {\n chart.tooltip = new Tooltip({chart, options});\n }\n },\n beforeUpdate(chart, _args, options) {\n if (chart.tooltip) {\n chart.tooltip.initialize(options);\n }\n },\n reset(chart, _args, options) {\n if (chart.tooltip) {\n chart.tooltip.initialize(options);\n }\n },\n afterDraw(chart) {\n const tooltip = chart.tooltip;\n if (tooltip && tooltip._willRender()) {\n const args = {\n tooltip\n };\n if (chart.notifyPlugins('beforeTooltipDraw', args) === false) {\n return;\n }\n tooltip.draw(chart.ctx);\n chart.notifyPlugins('afterTooltipDraw', args);\n }\n },\n afterEvent(chart, args) {\n if (chart.tooltip) {\n const useFinalPosition = args.replay;\n if (chart.tooltip.handleEvent(args.event, useFinalPosition, args.inChartArea)) {\n args.changed = true;\n }\n }\n },\n defaults: {\n enabled: true,\n external: null,\n position: 'average',\n backgroundColor: 'rgba(0,0,0,0.8)',\n titleColor: '#fff',\n titleFont: {\n weight: 'bold',\n },\n titleSpacing: 2,\n titleMarginBottom: 6,\n titleAlign: 'left',\n bodyColor: '#fff',\n bodySpacing: 2,\n bodyFont: {\n },\n bodyAlign: 'left',\n footerColor: '#fff',\n footerSpacing: 2,\n footerMarginTop: 6,\n footerFont: {\n weight: 'bold',\n },\n footerAlign: 'left',\n padding: 6,\n caretPadding: 2,\n caretSize: 5,\n cornerRadius: 6,\n boxHeight: (ctx, opts) => opts.bodyFont.size,\n boxWidth: (ctx, opts) => opts.bodyFont.size,\n multiKeyBackground: '#fff',\n displayColors: true,\n boxPadding: 0,\n borderColor: 'rgba(0,0,0,0)',\n borderWidth: 0,\n animation: {\n duration: 400,\n easing: 'easeOutQuart',\n },\n animations: {\n numbers: {\n type: 'number',\n properties: ['x', 'y', 'width', 'height', 'caretX', 'caretY'],\n },\n opacity: {\n easing: 'linear',\n duration: 200\n }\n },\n callbacks: {\n beforeTitle: noop,\n title(tooltipItems) {\n if (tooltipItems.length > 0) {\n const item = tooltipItems[0];\n const labels = item.chart.data.labels;\n const labelCount = labels ? labels.length : 0;\n if (this && this.options && this.options.mode === 'dataset') {\n return item.dataset.label || '';\n } else if (item.label) {\n return item.label;\n } else if (labelCount > 0 && item.dataIndex < labelCount) {\n return labels[item.dataIndex];\n }\n }\n return '';\n },\n afterTitle: noop,\n beforeBody: noop,\n beforeLabel: noop,\n label(tooltipItem) {\n if (this && this.options && this.options.mode === 'dataset') {\n return tooltipItem.label + ': ' + tooltipItem.formattedValue || tooltipItem.formattedValue;\n }\n let label = tooltipItem.dataset.label || '';\n if (label) {\n label += ': ';\n }\n const value = tooltipItem.formattedValue;\n if (!isNullOrUndef(value)) {\n label += value;\n }\n return label;\n },\n labelColor(tooltipItem) {\n const meta = tooltipItem.chart.getDatasetMeta(tooltipItem.datasetIndex);\n const options = meta.controller.getStyle(tooltipItem.dataIndex);\n return {\n borderColor: options.borderColor,\n backgroundColor: options.backgroundColor,\n borderWidth: options.borderWidth,\n borderDash: options.borderDash,\n borderDashOffset: options.borderDashOffset,\n borderRadius: 0,\n };\n },\n labelTextColor() {\n return this.options.bodyColor;\n },\n labelPointStyle(tooltipItem) {\n const meta = tooltipItem.chart.getDatasetMeta(tooltipItem.datasetIndex);\n const options = meta.controller.getStyle(tooltipItem.dataIndex);\n return {\n pointStyle: options.pointStyle,\n rotation: options.rotation,\n };\n },\n afterLabel: noop,\n afterBody: noop,\n beforeFooter: noop,\n footer: noop,\n afterFooter: noop\n }\n },\n defaultRoutes: {\n bodyFont: 'font',\n footerFont: 'font',\n titleFont: 'font'\n },\n descriptors: {\n _scriptable: (name) => name !== 'filter' && name !== 'itemSort' && name !== 'external',\n _indexable: false,\n callbacks: {\n _scriptable: false,\n _indexable: false,\n },\n animation: {\n _fallback: false\n },\n animations: {\n _fallback: 'animation'\n }\n },\n additionalOptionScopes: ['interaction']\n};\n\nvar plugins = /*#__PURE__*/Object.freeze({\n__proto__: null,\nDecimation: plugin_decimation,\nFiller: index,\nLegend: plugin_legend,\nSubTitle: plugin_subtitle,\nTitle: plugin_title,\nTooltip: plugin_tooltip\n});\n\nconst addIfString = (labels, raw, index, addedLabels) => {\n if (typeof raw === 'string') {\n index = labels.push(raw) - 1;\n addedLabels.unshift({index, label: raw});\n } else if (isNaN(raw)) {\n index = null;\n }\n return index;\n};\nfunction findOrAddLabel(labels, raw, index, addedLabels) {\n const first = labels.indexOf(raw);\n if (first === -1) {\n return addIfString(labels, raw, index, addedLabels);\n }\n const last = labels.lastIndexOf(raw);\n return first !== last ? index : first;\n}\nconst validIndex = (index, max) => index === null ? null : _limitValue(Math.round(index), 0, max);\nclass CategoryScale extends Scale {\n constructor(cfg) {\n super(cfg);\n this._startValue = undefined;\n this._valueRange = 0;\n this._addedLabels = [];\n }\n init(scaleOptions) {\n const added = this._addedLabels;\n if (added.length) {\n const labels = this.getLabels();\n for (const {index, label} of added) {\n if (labels[index] === label) {\n labels.splice(index, 1);\n }\n }\n this._addedLabels = [];\n }\n super.init(scaleOptions);\n }\n parse(raw, index) {\n if (isNullOrUndef(raw)) {\n return null;\n }\n const labels = this.getLabels();\n index = isFinite(index) && labels[index] === raw ? index\n : findOrAddLabel(labels, raw, valueOrDefault(index, raw), this._addedLabels);\n return validIndex(index, labels.length - 1);\n }\n determineDataLimits() {\n const {minDefined, maxDefined} = this.getUserBounds();\n let {min, max} = this.getMinMax(true);\n if (this.options.bounds === 'ticks') {\n if (!minDefined) {\n min = 0;\n }\n if (!maxDefined) {\n max = this.getLabels().length - 1;\n }\n }\n this.min = min;\n this.max = max;\n }\n buildTicks() {\n const min = this.min;\n const max = this.max;\n const offset = this.options.offset;\n const ticks = [];\n let labels = this.getLabels();\n labels = (min === 0 && max === labels.length - 1) ? labels : labels.slice(min, max + 1);\n this._valueRange = Math.max(labels.length - (offset ? 0 : 1), 1);\n this._startValue = this.min - (offset ? 0.5 : 0);\n for (let value = min; value <= max; value++) {\n ticks.push({value});\n }\n return ticks;\n }\n getLabelForValue(value) {\n const labels = this.getLabels();\n if (value >= 0 && value < labels.length) {\n return labels[value];\n }\n return value;\n }\n configure() {\n super.configure();\n if (!this.isHorizontal()) {\n this._reversePixels = !this._reversePixels;\n }\n }\n getPixelForValue(value) {\n if (typeof value !== 'number') {\n value = this.parse(value);\n }\n return value === null ? NaN : this.getPixelForDecimal((value - this._startValue) / this._valueRange);\n }\n getPixelForTick(index) {\n const ticks = this.ticks;\n if (index < 0 || index > ticks.length - 1) {\n return null;\n }\n return this.getPixelForValue(ticks[index].value);\n }\n getValueForPixel(pixel) {\n return Math.round(this._startValue + this.getDecimalForPixel(pixel) * this._valueRange);\n }\n getBasePixel() {\n return this.bottom;\n }\n}\nCategoryScale.id = 'category';\nCategoryScale.defaults = {\n ticks: {\n callback: CategoryScale.prototype.getLabelForValue\n }\n};\n\nfunction generateTicks$1(generationOptions, dataRange) {\n const ticks = [];\n const MIN_SPACING = 1e-14;\n const {bounds, step, min, max, precision, count, maxTicks, maxDigits, includeBounds} = generationOptions;\n const unit = step || 1;\n const maxSpaces = maxTicks - 1;\n const {min: rmin, max: rmax} = dataRange;\n const minDefined = !isNullOrUndef(min);\n const maxDefined = !isNullOrUndef(max);\n const countDefined = !isNullOrUndef(count);\n const minSpacing = (rmax - rmin) / (maxDigits + 1);\n let spacing = niceNum((rmax - rmin) / maxSpaces / unit) * unit;\n let factor, niceMin, niceMax, numSpaces;\n if (spacing < MIN_SPACING && !minDefined && !maxDefined) {\n return [{value: rmin}, {value: rmax}];\n }\n numSpaces = Math.ceil(rmax / spacing) - Math.floor(rmin / spacing);\n if (numSpaces > maxSpaces) {\n spacing = niceNum(numSpaces * spacing / maxSpaces / unit) * unit;\n }\n if (!isNullOrUndef(precision)) {\n factor = Math.pow(10, precision);\n spacing = Math.ceil(spacing * factor) / factor;\n }\n if (bounds === 'ticks') {\n niceMin = Math.floor(rmin / spacing) * spacing;\n niceMax = Math.ceil(rmax / spacing) * spacing;\n } else {\n niceMin = rmin;\n niceMax = rmax;\n }\n if (minDefined && maxDefined && step && almostWhole((max - min) / step, spacing / 1000)) {\n numSpaces = Math.round(Math.min((max - min) / spacing, maxTicks));\n spacing = (max - min) / numSpaces;\n niceMin = min;\n niceMax = max;\n } else if (countDefined) {\n niceMin = minDefined ? min : niceMin;\n niceMax = maxDefined ? max : niceMax;\n numSpaces = count - 1;\n spacing = (niceMax - niceMin) / numSpaces;\n } else {\n numSpaces = (niceMax - niceMin) / spacing;\n if (almostEquals(numSpaces, Math.round(numSpaces), spacing / 1000)) {\n numSpaces = Math.round(numSpaces);\n } else {\n numSpaces = Math.ceil(numSpaces);\n }\n }\n const decimalPlaces = Math.max(\n _decimalPlaces(spacing),\n _decimalPlaces(niceMin)\n );\n factor = Math.pow(10, isNullOrUndef(precision) ? decimalPlaces : precision);\n niceMin = Math.round(niceMin * factor) / factor;\n niceMax = Math.round(niceMax * factor) / factor;\n let j = 0;\n if (minDefined) {\n if (includeBounds && niceMin !== min) {\n ticks.push({value: min});\n if (niceMin < min) {\n j++;\n }\n if (almostEquals(Math.round((niceMin + j * spacing) * factor) / factor, min, relativeLabelSize(min, minSpacing, generationOptions))) {\n j++;\n }\n } else if (niceMin < min) {\n j++;\n }\n }\n for (; j < numSpaces; ++j) {\n ticks.push({value: Math.round((niceMin + j * spacing) * factor) / factor});\n }\n if (maxDefined && includeBounds && niceMax !== max) {\n if (ticks.length && almostEquals(ticks[ticks.length - 1].value, max, relativeLabelSize(max, minSpacing, generationOptions))) {\n ticks[ticks.length - 1].value = max;\n } else {\n ticks.push({value: max});\n }\n } else if (!maxDefined || niceMax === max) {\n ticks.push({value: niceMax});\n }\n return ticks;\n}\nfunction relativeLabelSize(value, minSpacing, {horizontal, minRotation}) {\n const rad = toRadians(minRotation);\n const ratio = (horizontal ? Math.sin(rad) : Math.cos(rad)) || 0.001;\n const length = 0.75 * minSpacing * ('' + value).length;\n return Math.min(minSpacing / ratio, length);\n}\nclass LinearScaleBase extends Scale {\n constructor(cfg) {\n super(cfg);\n this.start = undefined;\n this.end = undefined;\n this._startValue = undefined;\n this._endValue = undefined;\n this._valueRange = 0;\n }\n parse(raw, index) {\n if (isNullOrUndef(raw)) {\n return null;\n }\n if ((typeof raw === 'number' || raw instanceof Number) && !isFinite(+raw)) {\n return null;\n }\n return +raw;\n }\n handleTickRangeOptions() {\n const {beginAtZero} = this.options;\n const {minDefined, maxDefined} = this.getUserBounds();\n let {min, max} = this;\n const setMin = v => (min = minDefined ? min : v);\n const setMax = v => (max = maxDefined ? max : v);\n if (beginAtZero) {\n const minSign = sign(min);\n const maxSign = sign(max);\n if (minSign < 0 && maxSign < 0) {\n setMax(0);\n } else if (minSign > 0 && maxSign > 0) {\n setMin(0);\n }\n }\n if (min === max) {\n let offset = 1;\n if (max >= Number.MAX_SAFE_INTEGER || min <= Number.MIN_SAFE_INTEGER) {\n offset = Math.abs(max * 0.05);\n }\n setMax(max + offset);\n if (!beginAtZero) {\n setMin(min - offset);\n }\n }\n this.min = min;\n this.max = max;\n }\n getTickLimit() {\n const tickOpts = this.options.ticks;\n let {maxTicksLimit, stepSize} = tickOpts;\n let maxTicks;\n if (stepSize) {\n maxTicks = Math.ceil(this.max / stepSize) - Math.floor(this.min / stepSize) + 1;\n if (maxTicks > 1000) {\n console.warn(`scales.${this.id}.ticks.stepSize: ${stepSize} would result generating up to ${maxTicks} ticks. Limiting to 1000.`);\n maxTicks = 1000;\n }\n } else {\n maxTicks = this.computeTickLimit();\n maxTicksLimit = maxTicksLimit || 11;\n }\n if (maxTicksLimit) {\n maxTicks = Math.min(maxTicksLimit, maxTicks);\n }\n return maxTicks;\n }\n computeTickLimit() {\n return Number.POSITIVE_INFINITY;\n }\n buildTicks() {\n const opts = this.options;\n const tickOpts = opts.ticks;\n let maxTicks = this.getTickLimit();\n maxTicks = Math.max(2, maxTicks);\n const numericGeneratorOptions = {\n maxTicks,\n bounds: opts.bounds,\n min: opts.min,\n max: opts.max,\n precision: tickOpts.precision,\n step: tickOpts.stepSize,\n count: tickOpts.count,\n maxDigits: this._maxDigits(),\n horizontal: this.isHorizontal(),\n minRotation: tickOpts.minRotation || 0,\n includeBounds: tickOpts.includeBounds !== false\n };\n const dataRange = this._range || this;\n const ticks = generateTicks$1(numericGeneratorOptions, dataRange);\n if (opts.bounds === 'ticks') {\n _setMinAndMaxByKey(ticks, this, 'value');\n }\n if (opts.reverse) {\n ticks.reverse();\n this.start = this.max;\n this.end = this.min;\n } else {\n this.start = this.min;\n this.end = this.max;\n }\n return ticks;\n }\n configure() {\n const ticks = this.ticks;\n let start = this.min;\n let end = this.max;\n super.configure();\n if (this.options.offset && ticks.length) {\n const offset = (end - start) / Math.max(ticks.length - 1, 1) / 2;\n start -= offset;\n end += offset;\n }\n this._startValue = start;\n this._endValue = end;\n this._valueRange = end - start;\n }\n getLabelForValue(value) {\n return formatNumber(value, this.chart.options.locale, this.options.ticks.format);\n }\n}\n\nclass LinearScale extends LinearScaleBase {\n determineDataLimits() {\n const {min, max} = this.getMinMax(true);\n this.min = isNumberFinite(min) ? min : 0;\n this.max = isNumberFinite(max) ? max : 1;\n this.handleTickRangeOptions();\n }\n computeTickLimit() {\n const horizontal = this.isHorizontal();\n const length = horizontal ? this.width : this.height;\n const minRotation = toRadians(this.options.ticks.minRotation);\n const ratio = (horizontal ? Math.sin(minRotation) : Math.cos(minRotation)) || 0.001;\n const tickFont = this._resolveTickFontOptions(0);\n return Math.ceil(length / Math.min(40, tickFont.lineHeight / ratio));\n }\n getPixelForValue(value) {\n return value === null ? NaN : this.getPixelForDecimal((value - this._startValue) / this._valueRange);\n }\n getValueForPixel(pixel) {\n return this._startValue + this.getDecimalForPixel(pixel) * this._valueRange;\n }\n}\nLinearScale.id = 'linear';\nLinearScale.defaults = {\n ticks: {\n callback: Ticks.formatters.numeric\n }\n};\n\nfunction isMajor(tickVal) {\n const remain = tickVal / (Math.pow(10, Math.floor(log10(tickVal))));\n return remain === 1;\n}\nfunction generateTicks(generationOptions, dataRange) {\n const endExp = Math.floor(log10(dataRange.max));\n const endSignificand = Math.ceil(dataRange.max / Math.pow(10, endExp));\n const ticks = [];\n let tickVal = finiteOrDefault(generationOptions.min, Math.pow(10, Math.floor(log10(dataRange.min))));\n let exp = Math.floor(log10(tickVal));\n let significand = Math.floor(tickVal / Math.pow(10, exp));\n let precision = exp < 0 ? Math.pow(10, Math.abs(exp)) : 1;\n do {\n ticks.push({value: tickVal, major: isMajor(tickVal)});\n ++significand;\n if (significand === 10) {\n significand = 1;\n ++exp;\n precision = exp >= 0 ? 1 : precision;\n }\n tickVal = Math.round(significand * Math.pow(10, exp) * precision) / precision;\n } while (exp < endExp || (exp === endExp && significand < endSignificand));\n const lastTick = finiteOrDefault(generationOptions.max, tickVal);\n ticks.push({value: lastTick, major: isMajor(tickVal)});\n return ticks;\n}\nclass LogarithmicScale extends Scale {\n constructor(cfg) {\n super(cfg);\n this.start = undefined;\n this.end = undefined;\n this._startValue = undefined;\n this._valueRange = 0;\n }\n parse(raw, index) {\n const value = LinearScaleBase.prototype.parse.apply(this, [raw, index]);\n if (value === 0) {\n this._zero = true;\n return undefined;\n }\n return isNumberFinite(value) && value > 0 ? value : null;\n }\n determineDataLimits() {\n const {min, max} = this.getMinMax(true);\n this.min = isNumberFinite(min) ? Math.max(0, min) : null;\n this.max = isNumberFinite(max) ? Math.max(0, max) : null;\n if (this.options.beginAtZero) {\n this._zero = true;\n }\n this.handleTickRangeOptions();\n }\n handleTickRangeOptions() {\n const {minDefined, maxDefined} = this.getUserBounds();\n let min = this.min;\n let max = this.max;\n const setMin = v => (min = minDefined ? min : v);\n const setMax = v => (max = maxDefined ? max : v);\n const exp = (v, m) => Math.pow(10, Math.floor(log10(v)) + m);\n if (min === max) {\n if (min <= 0) {\n setMin(1);\n setMax(10);\n } else {\n setMin(exp(min, -1));\n setMax(exp(max, +1));\n }\n }\n if (min <= 0) {\n setMin(exp(max, -1));\n }\n if (max <= 0) {\n setMax(exp(min, +1));\n }\n if (this._zero && this.min !== this._suggestedMin && min === exp(this.min, 0)) {\n setMin(exp(min, -1));\n }\n this.min = min;\n this.max = max;\n }\n buildTicks() {\n const opts = this.options;\n const generationOptions = {\n min: this._userMin,\n max: this._userMax\n };\n const ticks = generateTicks(generationOptions, this);\n if (opts.bounds === 'ticks') {\n _setMinAndMaxByKey(ticks, this, 'value');\n }\n if (opts.reverse) {\n ticks.reverse();\n this.start = this.max;\n this.end = this.min;\n } else {\n this.start = this.min;\n this.end = this.max;\n }\n return ticks;\n }\n getLabelForValue(value) {\n return value === undefined\n ? '0'\n : formatNumber(value, this.chart.options.locale, this.options.ticks.format);\n }\n configure() {\n const start = this.min;\n super.configure();\n this._startValue = log10(start);\n this._valueRange = log10(this.max) - log10(start);\n }\n getPixelForValue(value) {\n if (value === undefined || value === 0) {\n value = this.min;\n }\n if (value === null || isNaN(value)) {\n return NaN;\n }\n return this.getPixelForDecimal(value === this.min\n ? 0\n : (log10(value) - this._startValue) / this._valueRange);\n }\n getValueForPixel(pixel) {\n const decimal = this.getDecimalForPixel(pixel);\n return Math.pow(10, this._startValue + decimal * this._valueRange);\n }\n}\nLogarithmicScale.id = 'logarithmic';\nLogarithmicScale.defaults = {\n ticks: {\n callback: Ticks.formatters.logarithmic,\n major: {\n enabled: true\n }\n }\n};\n\nfunction getTickBackdropHeight(opts) {\n const tickOpts = opts.ticks;\n if (tickOpts.display && opts.display) {\n const padding = toPadding(tickOpts.backdropPadding);\n return valueOrDefault(tickOpts.font && tickOpts.font.size, defaults.font.size) + padding.height;\n }\n return 0;\n}\nfunction measureLabelSize(ctx, font, label) {\n label = isArray(label) ? label : [label];\n return {\n w: _longestText(ctx, font.string, label),\n h: label.length * font.lineHeight\n };\n}\nfunction determineLimits(angle, pos, size, min, max) {\n if (angle === min || angle === max) {\n return {\n start: pos - (size / 2),\n end: pos + (size / 2)\n };\n } else if (angle < min || angle > max) {\n return {\n start: pos - size,\n end: pos\n };\n }\n return {\n start: pos,\n end: pos + size\n };\n}\nfunction fitWithPointLabels(scale) {\n const orig = {\n l: scale.left + scale._padding.left,\n r: scale.right - scale._padding.right,\n t: scale.top + scale._padding.top,\n b: scale.bottom - scale._padding.bottom\n };\n const limits = Object.assign({}, orig);\n const labelSizes = [];\n const padding = [];\n const valueCount = scale._pointLabels.length;\n const pointLabelOpts = scale.options.pointLabels;\n const additionalAngle = pointLabelOpts.centerPointLabels ? PI / valueCount : 0;\n for (let i = 0; i < valueCount; i++) {\n const opts = pointLabelOpts.setContext(scale.getPointLabelContext(i));\n padding[i] = opts.padding;\n const pointPosition = scale.getPointPosition(i, scale.drawingArea + padding[i], additionalAngle);\n const plFont = toFont(opts.font);\n const textSize = measureLabelSize(scale.ctx, plFont, scale._pointLabels[i]);\n labelSizes[i] = textSize;\n const angleRadians = _normalizeAngle(scale.getIndexAngle(i) + additionalAngle);\n const angle = Math.round(toDegrees(angleRadians));\n const hLimits = determineLimits(angle, pointPosition.x, textSize.w, 0, 180);\n const vLimits = determineLimits(angle, pointPosition.y, textSize.h, 90, 270);\n updateLimits(limits, orig, angleRadians, hLimits, vLimits);\n }\n scale.setCenterPoint(\n orig.l - limits.l,\n limits.r - orig.r,\n orig.t - limits.t,\n limits.b - orig.b\n );\n scale._pointLabelItems = buildPointLabelItems(scale, labelSizes, padding);\n}\nfunction updateLimits(limits, orig, angle, hLimits, vLimits) {\n const sin = Math.abs(Math.sin(angle));\n const cos = Math.abs(Math.cos(angle));\n let x = 0;\n let y = 0;\n if (hLimits.start < orig.l) {\n x = (orig.l - hLimits.start) / sin;\n limits.l = Math.min(limits.l, orig.l - x);\n } else if (hLimits.end > orig.r) {\n x = (hLimits.end - orig.r) / sin;\n limits.r = Math.max(limits.r, orig.r + x);\n }\n if (vLimits.start < orig.t) {\n y = (orig.t - vLimits.start) / cos;\n limits.t = Math.min(limits.t, orig.t - y);\n } else if (vLimits.end > orig.b) {\n y = (vLimits.end - orig.b) / cos;\n limits.b = Math.max(limits.b, orig.b + y);\n }\n}\nfunction buildPointLabelItems(scale, labelSizes, padding) {\n const items = [];\n const valueCount = scale._pointLabels.length;\n const opts = scale.options;\n const extra = getTickBackdropHeight(opts) / 2;\n const outerDistance = scale.drawingArea;\n const additionalAngle = opts.pointLabels.centerPointLabels ? PI / valueCount : 0;\n for (let i = 0; i < valueCount; i++) {\n const pointLabelPosition = scale.getPointPosition(i, outerDistance + extra + padding[i], additionalAngle);\n const angle = Math.round(toDegrees(_normalizeAngle(pointLabelPosition.angle + HALF_PI)));\n const size = labelSizes[i];\n const y = yForAngle(pointLabelPosition.y, size.h, angle);\n const textAlign = getTextAlignForAngle(angle);\n const left = leftForTextAlign(pointLabelPosition.x, size.w, textAlign);\n items.push({\n x: pointLabelPosition.x,\n y,\n textAlign,\n left,\n top: y,\n right: left + size.w,\n bottom: y + size.h\n });\n }\n return items;\n}\nfunction getTextAlignForAngle(angle) {\n if (angle === 0 || angle === 180) {\n return 'center';\n } else if (angle < 180) {\n return 'left';\n }\n return 'right';\n}\nfunction leftForTextAlign(x, w, align) {\n if (align === 'right') {\n x -= w;\n } else if (align === 'center') {\n x -= (w / 2);\n }\n return x;\n}\nfunction yForAngle(y, h, angle) {\n if (angle === 90 || angle === 270) {\n y -= (h / 2);\n } else if (angle > 270 || angle < 90) {\n y -= h;\n }\n return y;\n}\nfunction drawPointLabels(scale, labelCount) {\n const {ctx, options: {pointLabels}} = scale;\n for (let i = labelCount - 1; i >= 0; i--) {\n const optsAtIndex = pointLabels.setContext(scale.getPointLabelContext(i));\n const plFont = toFont(optsAtIndex.font);\n const {x, y, textAlign, left, top, right, bottom} = scale._pointLabelItems[i];\n const {backdropColor} = optsAtIndex;\n if (!isNullOrUndef(backdropColor)) {\n const borderRadius = toTRBLCorners(optsAtIndex.borderRadius);\n const padding = toPadding(optsAtIndex.backdropPadding);\n ctx.fillStyle = backdropColor;\n const backdropLeft = left - padding.left;\n const backdropTop = top - padding.top;\n const backdropWidth = right - left + padding.width;\n const backdropHeight = bottom - top + padding.height;\n if (Object.values(borderRadius).some(v => v !== 0)) {\n ctx.beginPath();\n addRoundedRectPath(ctx, {\n x: backdropLeft,\n y: backdropTop,\n w: backdropWidth,\n h: backdropHeight,\n radius: borderRadius,\n });\n ctx.fill();\n } else {\n ctx.fillRect(backdropLeft, backdropTop, backdropWidth, backdropHeight);\n }\n }\n renderText(\n ctx,\n scale._pointLabels[i],\n x,\n y + (plFont.lineHeight / 2),\n plFont,\n {\n color: optsAtIndex.color,\n textAlign: textAlign,\n textBaseline: 'middle'\n }\n );\n }\n}\nfunction pathRadiusLine(scale, radius, circular, labelCount) {\n const {ctx} = scale;\n if (circular) {\n ctx.arc(scale.xCenter, scale.yCenter, radius, 0, TAU);\n } else {\n let pointPosition = scale.getPointPosition(0, radius);\n ctx.moveTo(pointPosition.x, pointPosition.y);\n for (let i = 1; i < labelCount; i++) {\n pointPosition = scale.getPointPosition(i, radius);\n ctx.lineTo(pointPosition.x, pointPosition.y);\n }\n }\n}\nfunction drawRadiusLine(scale, gridLineOpts, radius, labelCount) {\n const ctx = scale.ctx;\n const circular = gridLineOpts.circular;\n const {color, lineWidth} = gridLineOpts;\n if ((!circular && !labelCount) || !color || !lineWidth || radius < 0) {\n return;\n }\n ctx.save();\n ctx.strokeStyle = color;\n ctx.lineWidth = lineWidth;\n ctx.setLineDash(gridLineOpts.borderDash);\n ctx.lineDashOffset = gridLineOpts.borderDashOffset;\n ctx.beginPath();\n pathRadiusLine(scale, radius, circular, labelCount);\n ctx.closePath();\n ctx.stroke();\n ctx.restore();\n}\nfunction createPointLabelContext(parent, index, label) {\n return createContext(parent, {\n label,\n index,\n type: 'pointLabel'\n });\n}\nclass RadialLinearScale extends LinearScaleBase {\n constructor(cfg) {\n super(cfg);\n this.xCenter = undefined;\n this.yCenter = undefined;\n this.drawingArea = undefined;\n this._pointLabels = [];\n this._pointLabelItems = [];\n }\n setDimensions() {\n const padding = this._padding = toPadding(getTickBackdropHeight(this.options) / 2);\n const w = this.width = this.maxWidth - padding.width;\n const h = this.height = this.maxHeight - padding.height;\n this.xCenter = Math.floor(this.left + w / 2 + padding.left);\n this.yCenter = Math.floor(this.top + h / 2 + padding.top);\n this.drawingArea = Math.floor(Math.min(w, h) / 2);\n }\n determineDataLimits() {\n const {min, max} = this.getMinMax(false);\n this.min = isNumberFinite(min) && !isNaN(min) ? min : 0;\n this.max = isNumberFinite(max) && !isNaN(max) ? max : 0;\n this.handleTickRangeOptions();\n }\n computeTickLimit() {\n return Math.ceil(this.drawingArea / getTickBackdropHeight(this.options));\n }\n generateTickLabels(ticks) {\n LinearScaleBase.prototype.generateTickLabels.call(this, ticks);\n this._pointLabels = this.getLabels()\n .map((value, index) => {\n const label = callback(this.options.pointLabels.callback, [value, index], this);\n return label || label === 0 ? label : '';\n })\n .filter((v, i) => this.chart.getDataVisibility(i));\n }\n fit() {\n const opts = this.options;\n if (opts.display && opts.pointLabels.display) {\n fitWithPointLabels(this);\n } else {\n this.setCenterPoint(0, 0, 0, 0);\n }\n }\n setCenterPoint(leftMovement, rightMovement, topMovement, bottomMovement) {\n this.xCenter += Math.floor((leftMovement - rightMovement) / 2);\n this.yCenter += Math.floor((topMovement - bottomMovement) / 2);\n this.drawingArea -= Math.min(this.drawingArea / 2, Math.max(leftMovement, rightMovement, topMovement, bottomMovement));\n }\n getIndexAngle(index) {\n const angleMultiplier = TAU / (this._pointLabels.length || 1);\n const startAngle = this.options.startAngle || 0;\n return _normalizeAngle(index * angleMultiplier + toRadians(startAngle));\n }\n getDistanceFromCenterForValue(value) {\n if (isNullOrUndef(value)) {\n return NaN;\n }\n const scalingFactor = this.drawingArea / (this.max - this.min);\n if (this.options.reverse) {\n return (this.max - value) * scalingFactor;\n }\n return (value - this.min) * scalingFactor;\n }\n getValueForDistanceFromCenter(distance) {\n if (isNullOrUndef(distance)) {\n return NaN;\n }\n const scaledDistance = distance / (this.drawingArea / (this.max - this.min));\n return this.options.reverse ? this.max - scaledDistance : this.min + scaledDistance;\n }\n getPointLabelContext(index) {\n const pointLabels = this._pointLabels || [];\n if (index >= 0 && index < pointLabels.length) {\n const pointLabel = pointLabels[index];\n return createPointLabelContext(this.getContext(), index, pointLabel);\n }\n }\n getPointPosition(index, distanceFromCenter, additionalAngle = 0) {\n const angle = this.getIndexAngle(index) - HALF_PI + additionalAngle;\n return {\n x: Math.cos(angle) * distanceFromCenter + this.xCenter,\n y: Math.sin(angle) * distanceFromCenter + this.yCenter,\n angle\n };\n }\n getPointPositionForValue(index, value) {\n return this.getPointPosition(index, this.getDistanceFromCenterForValue(value));\n }\n getBasePosition(index) {\n return this.getPointPositionForValue(index || 0, this.getBaseValue());\n }\n getPointLabelPosition(index) {\n const {left, top, right, bottom} = this._pointLabelItems[index];\n return {\n left,\n top,\n right,\n bottom,\n };\n }\n drawBackground() {\n const {backgroundColor, grid: {circular}} = this.options;\n if (backgroundColor) {\n const ctx = this.ctx;\n ctx.save();\n ctx.beginPath();\n pathRadiusLine(this, this.getDistanceFromCenterForValue(this._endValue), circular, this._pointLabels.length);\n ctx.closePath();\n ctx.fillStyle = backgroundColor;\n ctx.fill();\n ctx.restore();\n }\n }\n drawGrid() {\n const ctx = this.ctx;\n const opts = this.options;\n const {angleLines, grid} = opts;\n const labelCount = this._pointLabels.length;\n let i, offset, position;\n if (opts.pointLabels.display) {\n drawPointLabels(this, labelCount);\n }\n if (grid.display) {\n this.ticks.forEach((tick, index) => {\n if (index !== 0) {\n offset = this.getDistanceFromCenterForValue(tick.value);\n const optsAtIndex = grid.setContext(this.getContext(index - 1));\n drawRadiusLine(this, optsAtIndex, offset, labelCount);\n }\n });\n }\n if (angleLines.display) {\n ctx.save();\n for (i = labelCount - 1; i >= 0; i--) {\n const optsAtIndex = angleLines.setContext(this.getPointLabelContext(i));\n const {color, lineWidth} = optsAtIndex;\n if (!lineWidth || !color) {\n continue;\n }\n ctx.lineWidth = lineWidth;\n ctx.strokeStyle = color;\n ctx.setLineDash(optsAtIndex.borderDash);\n ctx.lineDashOffset = optsAtIndex.borderDashOffset;\n offset = this.getDistanceFromCenterForValue(opts.ticks.reverse ? this.min : this.max);\n position = this.getPointPosition(i, offset);\n ctx.beginPath();\n ctx.moveTo(this.xCenter, this.yCenter);\n ctx.lineTo(position.x, position.y);\n ctx.stroke();\n }\n ctx.restore();\n }\n }\n drawBorder() {}\n drawLabels() {\n const ctx = this.ctx;\n const opts = this.options;\n const tickOpts = opts.ticks;\n if (!tickOpts.display) {\n return;\n }\n const startAngle = this.getIndexAngle(0);\n let offset, width;\n ctx.save();\n ctx.translate(this.xCenter, this.yCenter);\n ctx.rotate(startAngle);\n ctx.textAlign = 'center';\n ctx.textBaseline = 'middle';\n this.ticks.forEach((tick, index) => {\n if (index === 0 && !opts.reverse) {\n return;\n }\n const optsAtIndex = tickOpts.setContext(this.getContext(index));\n const tickFont = toFont(optsAtIndex.font);\n offset = this.getDistanceFromCenterForValue(this.ticks[index].value);\n if (optsAtIndex.showLabelBackdrop) {\n ctx.font = tickFont.string;\n width = ctx.measureText(tick.label).width;\n ctx.fillStyle = optsAtIndex.backdropColor;\n const padding = toPadding(optsAtIndex.backdropPadding);\n ctx.fillRect(\n -width / 2 - padding.left,\n -offset - tickFont.size / 2 - padding.top,\n width + padding.width,\n tickFont.size + padding.height\n );\n }\n renderText(ctx, tick.label, 0, -offset, tickFont, {\n color: optsAtIndex.color,\n });\n });\n ctx.restore();\n }\n drawTitle() {}\n}\nRadialLinearScale.id = 'radialLinear';\nRadialLinearScale.defaults = {\n display: true,\n animate: true,\n position: 'chartArea',\n angleLines: {\n display: true,\n lineWidth: 1,\n borderDash: [],\n borderDashOffset: 0.0\n },\n grid: {\n circular: false\n },\n startAngle: 0,\n ticks: {\n showLabelBackdrop: true,\n callback: Ticks.formatters.numeric\n },\n pointLabels: {\n backdropColor: undefined,\n backdropPadding: 2,\n display: true,\n font: {\n size: 10\n },\n callback(label) {\n return label;\n },\n padding: 5,\n centerPointLabels: false\n }\n};\nRadialLinearScale.defaultRoutes = {\n 'angleLines.color': 'borderColor',\n 'pointLabels.color': 'color',\n 'ticks.color': 'color'\n};\nRadialLinearScale.descriptors = {\n angleLines: {\n _fallback: 'grid'\n }\n};\n\nconst INTERVALS = {\n millisecond: {common: true, size: 1, steps: 1000},\n second: {common: true, size: 1000, steps: 60},\n minute: {common: true, size: 60000, steps: 60},\n hour: {common: true, size: 3600000, steps: 24},\n day: {common: true, size: 86400000, steps: 30},\n week: {common: false, size: 604800000, steps: 4},\n month: {common: true, size: 2.628e9, steps: 12},\n quarter: {common: false, size: 7.884e9, steps: 4},\n year: {common: true, size: 3.154e10}\n};\nconst UNITS = (Object.keys(INTERVALS));\nfunction sorter(a, b) {\n return a - b;\n}\nfunction parse(scale, input) {\n if (isNullOrUndef(input)) {\n return null;\n }\n const adapter = scale._adapter;\n const {parser, round, isoWeekday} = scale._parseOpts;\n let value = input;\n if (typeof parser === 'function') {\n value = parser(value);\n }\n if (!isNumberFinite(value)) {\n value = typeof parser === 'string'\n ? adapter.parse(value, parser)\n : adapter.parse(value);\n }\n if (value === null) {\n return null;\n }\n if (round) {\n value = round === 'week' && (isNumber(isoWeekday) || isoWeekday === true)\n ? adapter.startOf(value, 'isoWeek', isoWeekday)\n : adapter.startOf(value, round);\n }\n return +value;\n}\nfunction determineUnitForAutoTicks(minUnit, min, max, capacity) {\n const ilen = UNITS.length;\n for (let i = UNITS.indexOf(minUnit); i < ilen - 1; ++i) {\n const interval = INTERVALS[UNITS[i]];\n const factor = interval.steps ? interval.steps : Number.MAX_SAFE_INTEGER;\n if (interval.common && Math.ceil((max - min) / (factor * interval.size)) <= capacity) {\n return UNITS[i];\n }\n }\n return UNITS[ilen - 1];\n}\nfunction determineUnitForFormatting(scale, numTicks, minUnit, min, max) {\n for (let i = UNITS.length - 1; i >= UNITS.indexOf(minUnit); i--) {\n const unit = UNITS[i];\n if (INTERVALS[unit].common && scale._adapter.diff(max, min, unit) >= numTicks - 1) {\n return unit;\n }\n }\n return UNITS[minUnit ? UNITS.indexOf(minUnit) : 0];\n}\nfunction determineMajorUnit(unit) {\n for (let i = UNITS.indexOf(unit) + 1, ilen = UNITS.length; i < ilen; ++i) {\n if (INTERVALS[UNITS[i]].common) {\n return UNITS[i];\n }\n }\n}\nfunction addTick(ticks, time, timestamps) {\n if (!timestamps) {\n ticks[time] = true;\n } else if (timestamps.length) {\n const {lo, hi} = _lookup(timestamps, time);\n const timestamp = timestamps[lo] >= time ? timestamps[lo] : timestamps[hi];\n ticks[timestamp] = true;\n }\n}\nfunction setMajorTicks(scale, ticks, map, majorUnit) {\n const adapter = scale._adapter;\n const first = +adapter.startOf(ticks[0].value, majorUnit);\n const last = ticks[ticks.length - 1].value;\n let major, index;\n for (major = first; major <= last; major = +adapter.add(major, 1, majorUnit)) {\n index = map[major];\n if (index >= 0) {\n ticks[index].major = true;\n }\n }\n return ticks;\n}\nfunction ticksFromTimestamps(scale, values, majorUnit) {\n const ticks = [];\n const map = {};\n const ilen = values.length;\n let i, value;\n for (i = 0; i < ilen; ++i) {\n value = values[i];\n map[value] = i;\n ticks.push({\n value,\n major: false\n });\n }\n return (ilen === 0 || !majorUnit) ? ticks : setMajorTicks(scale, ticks, map, majorUnit);\n}\nclass TimeScale extends Scale {\n constructor(props) {\n super(props);\n this._cache = {\n data: [],\n labels: [],\n all: []\n };\n this._unit = 'day';\n this._majorUnit = undefined;\n this._offsets = {};\n this._normalized = false;\n this._parseOpts = undefined;\n }\n init(scaleOpts, opts) {\n const time = scaleOpts.time || (scaleOpts.time = {});\n const adapter = this._adapter = new adapters._date(scaleOpts.adapters.date);\n adapter.init(opts);\n mergeIf(time.displayFormats, adapter.formats());\n this._parseOpts = {\n parser: time.parser,\n round: time.round,\n isoWeekday: time.isoWeekday\n };\n super.init(scaleOpts);\n this._normalized = opts.normalized;\n }\n parse(raw, index) {\n if (raw === undefined) {\n return null;\n }\n return parse(this, raw);\n }\n beforeLayout() {\n super.beforeLayout();\n this._cache = {\n data: [],\n labels: [],\n all: []\n };\n }\n determineDataLimits() {\n const options = this.options;\n const adapter = this._adapter;\n const unit = options.time.unit || 'day';\n let {min, max, minDefined, maxDefined} = this.getUserBounds();\n function _applyBounds(bounds) {\n if (!minDefined && !isNaN(bounds.min)) {\n min = Math.min(min, bounds.min);\n }\n if (!maxDefined && !isNaN(bounds.max)) {\n max = Math.max(max, bounds.max);\n }\n }\n if (!minDefined || !maxDefined) {\n _applyBounds(this._getLabelBounds());\n if (options.bounds !== 'ticks' || options.ticks.source !== 'labels') {\n _applyBounds(this.getMinMax(false));\n }\n }\n min = isNumberFinite(min) && !isNaN(min) ? min : +adapter.startOf(Date.now(), unit);\n max = isNumberFinite(max) && !isNaN(max) ? max : +adapter.endOf(Date.now(), unit) + 1;\n this.min = Math.min(min, max - 1);\n this.max = Math.max(min + 1, max);\n }\n _getLabelBounds() {\n const arr = this.getLabelTimestamps();\n let min = Number.POSITIVE_INFINITY;\n let max = Number.NEGATIVE_INFINITY;\n if (arr.length) {\n min = arr[0];\n max = arr[arr.length - 1];\n }\n return {min, max};\n }\n buildTicks() {\n const options = this.options;\n const timeOpts = options.time;\n const tickOpts = options.ticks;\n const timestamps = tickOpts.source === 'labels' ? this.getLabelTimestamps() : this._generate();\n if (options.bounds === 'ticks' && timestamps.length) {\n this.min = this._userMin || timestamps[0];\n this.max = this._userMax || timestamps[timestamps.length - 1];\n }\n const min = this.min;\n const max = this.max;\n const ticks = _filterBetween(timestamps, min, max);\n this._unit = timeOpts.unit || (tickOpts.autoSkip\n ? determineUnitForAutoTicks(timeOpts.minUnit, this.min, this.max, this._getLabelCapacity(min))\n : determineUnitForFormatting(this, ticks.length, timeOpts.minUnit, this.min, this.max));\n this._majorUnit = !tickOpts.major.enabled || this._unit === 'year' ? undefined\n : determineMajorUnit(this._unit);\n this.initOffsets(timestamps);\n if (options.reverse) {\n ticks.reverse();\n }\n return ticksFromTimestamps(this, ticks, this._majorUnit);\n }\n afterAutoSkip() {\n if (this.options.offsetAfterAutoskip) {\n this.initOffsets(this.ticks.map(tick => +tick.value));\n }\n }\n initOffsets(timestamps) {\n let start = 0;\n let end = 0;\n let first, last;\n if (this.options.offset && timestamps.length) {\n first = this.getDecimalForValue(timestamps[0]);\n if (timestamps.length === 1) {\n start = 1 - first;\n } else {\n start = (this.getDecimalForValue(timestamps[1]) - first) / 2;\n }\n last = this.getDecimalForValue(timestamps[timestamps.length - 1]);\n if (timestamps.length === 1) {\n end = last;\n } else {\n end = (last - this.getDecimalForValue(timestamps[timestamps.length - 2])) / 2;\n }\n }\n const limit = timestamps.length < 3 ? 0.5 : 0.25;\n start = _limitValue(start, 0, limit);\n end = _limitValue(end, 0, limit);\n this._offsets = {start, end, factor: 1 / (start + 1 + end)};\n }\n _generate() {\n const adapter = this._adapter;\n const min = this.min;\n const max = this.max;\n const options = this.options;\n const timeOpts = options.time;\n const minor = timeOpts.unit || determineUnitForAutoTicks(timeOpts.minUnit, min, max, this._getLabelCapacity(min));\n const stepSize = valueOrDefault(timeOpts.stepSize, 1);\n const weekday = minor === 'week' ? timeOpts.isoWeekday : false;\n const hasWeekday = isNumber(weekday) || weekday === true;\n const ticks = {};\n let first = min;\n let time, count;\n if (hasWeekday) {\n first = +adapter.startOf(first, 'isoWeek', weekday);\n }\n first = +adapter.startOf(first, hasWeekday ? 'day' : minor);\n if (adapter.diff(max, min, minor) > 100000 * stepSize) {\n throw new Error(min + ' and ' + max + ' are too far apart with stepSize of ' + stepSize + ' ' + minor);\n }\n const timestamps = options.ticks.source === 'data' && this.getDataTimestamps();\n for (time = first, count = 0; time < max; time = +adapter.add(time, stepSize, minor), count++) {\n addTick(ticks, time, timestamps);\n }\n if (time === max || options.bounds === 'ticks' || count === 1) {\n addTick(ticks, time, timestamps);\n }\n return Object.keys(ticks).sort((a, b) => a - b).map(x => +x);\n }\n getLabelForValue(value) {\n const adapter = this._adapter;\n const timeOpts = this.options.time;\n if (timeOpts.tooltipFormat) {\n return adapter.format(value, timeOpts.tooltipFormat);\n }\n return adapter.format(value, timeOpts.displayFormats.datetime);\n }\n _tickFormatFunction(time, index, ticks, format) {\n const options = this.options;\n const formats = options.time.displayFormats;\n const unit = this._unit;\n const majorUnit = this._majorUnit;\n const minorFormat = unit && formats[unit];\n const majorFormat = majorUnit && formats[majorUnit];\n const tick = ticks[index];\n const major = majorUnit && majorFormat && tick && tick.major;\n const label = this._adapter.format(time, format || (major ? majorFormat : minorFormat));\n const formatter = options.ticks.callback;\n return formatter ? callback(formatter, [label, index, ticks], this) : label;\n }\n generateTickLabels(ticks) {\n let i, ilen, tick;\n for (i = 0, ilen = ticks.length; i < ilen; ++i) {\n tick = ticks[i];\n tick.label = this._tickFormatFunction(tick.value, i, ticks);\n }\n }\n getDecimalForValue(value) {\n return value === null ? NaN : (value - this.min) / (this.max - this.min);\n }\n getPixelForValue(value) {\n const offsets = this._offsets;\n const pos = this.getDecimalForValue(value);\n return this.getPixelForDecimal((offsets.start + pos) * offsets.factor);\n }\n getValueForPixel(pixel) {\n const offsets = this._offsets;\n const pos = this.getDecimalForPixel(pixel) / offsets.factor - offsets.end;\n return this.min + pos * (this.max - this.min);\n }\n _getLabelSize(label) {\n const ticksOpts = this.options.ticks;\n const tickLabelWidth = this.ctx.measureText(label).width;\n const angle = toRadians(this.isHorizontal() ? ticksOpts.maxRotation : ticksOpts.minRotation);\n const cosRotation = Math.cos(angle);\n const sinRotation = Math.sin(angle);\n const tickFontSize = this._resolveTickFontOptions(0).size;\n return {\n w: (tickLabelWidth * cosRotation) + (tickFontSize * sinRotation),\n h: (tickLabelWidth * sinRotation) + (tickFontSize * cosRotation)\n };\n }\n _getLabelCapacity(exampleTime) {\n const timeOpts = this.options.time;\n const displayFormats = timeOpts.displayFormats;\n const format = displayFormats[timeOpts.unit] || displayFormats.millisecond;\n const exampleLabel = this._tickFormatFunction(exampleTime, 0, ticksFromTimestamps(this, [exampleTime], this._majorUnit), format);\n const size = this._getLabelSize(exampleLabel);\n const capacity = Math.floor(this.isHorizontal() ? this.width / size.w : this.height / size.h) - 1;\n return capacity > 0 ? capacity : 1;\n }\n getDataTimestamps() {\n let timestamps = this._cache.data || [];\n let i, ilen;\n if (timestamps.length) {\n return timestamps;\n }\n const metas = this.getMatchingVisibleMetas();\n if (this._normalized && metas.length) {\n return (this._cache.data = metas[0].controller.getAllParsedValues(this));\n }\n for (i = 0, ilen = metas.length; i < ilen; ++i) {\n timestamps = timestamps.concat(metas[i].controller.getAllParsedValues(this));\n }\n return (this._cache.data = this.normalize(timestamps));\n }\n getLabelTimestamps() {\n const timestamps = this._cache.labels || [];\n let i, ilen;\n if (timestamps.length) {\n return timestamps;\n }\n const labels = this.getLabels();\n for (i = 0, ilen = labels.length; i < ilen; ++i) {\n timestamps.push(parse(this, labels[i]));\n }\n return (this._cache.labels = this._normalized ? timestamps : this.normalize(timestamps));\n }\n normalize(values) {\n return _arrayUnique(values.sort(sorter));\n }\n}\nTimeScale.id = 'time';\nTimeScale.defaults = {\n bounds: 'data',\n adapters: {},\n time: {\n parser: false,\n unit: false,\n round: false,\n isoWeekday: false,\n minUnit: 'millisecond',\n displayFormats: {}\n },\n ticks: {\n source: 'auto',\n major: {\n enabled: false\n }\n }\n};\n\nfunction interpolate(table, val, reverse) {\n let lo = 0;\n let hi = table.length - 1;\n let prevSource, nextSource, prevTarget, nextTarget;\n if (reverse) {\n if (val >= table[lo].pos && val <= table[hi].pos) {\n ({lo, hi} = _lookupByKey(table, 'pos', val));\n }\n ({pos: prevSource, time: prevTarget} = table[lo]);\n ({pos: nextSource, time: nextTarget} = table[hi]);\n } else {\n if (val >= table[lo].time && val <= table[hi].time) {\n ({lo, hi} = _lookupByKey(table, 'time', val));\n }\n ({time: prevSource, pos: prevTarget} = table[lo]);\n ({time: nextSource, pos: nextTarget} = table[hi]);\n }\n const span = nextSource - prevSource;\n return span ? prevTarget + (nextTarget - prevTarget) * (val - prevSource) / span : prevTarget;\n}\nclass TimeSeriesScale extends TimeScale {\n constructor(props) {\n super(props);\n this._table = [];\n this._minPos = undefined;\n this._tableRange = undefined;\n }\n initOffsets() {\n const timestamps = this._getTimestampsForTable();\n const table = this._table = this.buildLookupTable(timestamps);\n this._minPos = interpolate(table, this.min);\n this._tableRange = interpolate(table, this.max) - this._minPos;\n super.initOffsets(timestamps);\n }\n buildLookupTable(timestamps) {\n const {min, max} = this;\n const items = [];\n const table = [];\n let i, ilen, prev, curr, next;\n for (i = 0, ilen = timestamps.length; i < ilen; ++i) {\n curr = timestamps[i];\n if (curr >= min && curr <= max) {\n items.push(curr);\n }\n }\n if (items.length < 2) {\n return [\n {time: min, pos: 0},\n {time: max, pos: 1}\n ];\n }\n for (i = 0, ilen = items.length; i < ilen; ++i) {\n next = items[i + 1];\n prev = items[i - 1];\n curr = items[i];\n if (Math.round((next + prev) / 2) !== curr) {\n table.push({time: curr, pos: i / (ilen - 1)});\n }\n }\n return table;\n }\n _getTimestampsForTable() {\n let timestamps = this._cache.all || [];\n if (timestamps.length) {\n return timestamps;\n }\n const data = this.getDataTimestamps();\n const label = this.getLabelTimestamps();\n if (data.length && label.length) {\n timestamps = this.normalize(data.concat(label));\n } else {\n timestamps = data.length ? data : label;\n }\n timestamps = this._cache.all = timestamps;\n return timestamps;\n }\n getDecimalForValue(value) {\n return (interpolate(this._table, value) - this._minPos) / this._tableRange;\n }\n getValueForPixel(pixel) {\n const offsets = this._offsets;\n const decimal = this.getDecimalForPixel(pixel) / offsets.factor - offsets.end;\n return interpolate(this._table, decimal * this._tableRange + this._minPos, true);\n }\n}\nTimeSeriesScale.id = 'timeseries';\nTimeSeriesScale.defaults = TimeScale.defaults;\n\nvar scales = /*#__PURE__*/Object.freeze({\n__proto__: null,\nCategoryScale: CategoryScale,\nLinearScale: LinearScale,\nLogarithmicScale: LogarithmicScale,\nRadialLinearScale: RadialLinearScale,\nTimeScale: TimeScale,\nTimeSeriesScale: TimeSeriesScale\n});\n\nconst registerables = [\n controllers,\n elements,\n plugins,\n scales,\n];\n\nexport { Animation, Animations, ArcElement, BarController, BarElement, BasePlatform, BasicPlatform, BubbleController, CategoryScale, Chart, DatasetController, plugin_decimation as Decimation, DomPlatform, DoughnutController, Element, index as Filler, Interaction, plugin_legend as Legend, LineController, LineElement, LinearScale, LogarithmicScale, PieController, PointElement, PolarAreaController, RadarController, RadialLinearScale, Scale, ScatterController, plugin_subtitle as SubTitle, Ticks, TimeScale, TimeSeriesScale, plugin_title as Title, plugin_tooltip as Tooltip, adapters as _adapters, _detectPlatform, animator, controllers, elements, layouts, plugins, registerables, registry, scales };\n","import {Chart, registerables} from '../dist/chart.mjs';\n\nChart.register(...registerables);\n\nexport default Chart;\n","import moment from 'moment';\r\n\r\nconst getPrevMonths = (numOfMonths) => {\r\n // Return an array of abbreviated month strings for the past 6 months (current month first)\r\n let months = [];\r\n for (let i = 0; i < numOfMonths; i++) {\r\n if (i === 0) {\r\n months.push(moment().format('MMM'));\r\n } else {\r\n months.push(moment().subtract(i, 'months').format('MMM'));\r\n }\r\n }\r\n return months.reverse();\r\n};\r\n\r\nexport default getPrevMonths;\r\n","import {useEffect, useCallback} from 'react';\r\nimport {useMediaQuery} from '@mui/material';\r\nimport {colors} from '../../../options/colors';\r\nimport {fullMonths} from '../../../options/months';\r\nimport Chart from 'chart.js/auto';\r\nimport SectionSpinner from '../../Loading/SectionSpinner/SectionSpinner';\r\nimport NoResultsText from '../../Typography/NoResultsText/NoResultsText';\r\n\r\n// Helpers\r\nimport getPrevMonths from '../../../utils/helpers/getPrevMonths';\r\n\r\nconst RevenueChart = ({loading, data}) => {\r\n // Dynamically display chart based on breakpoint\r\n const matches = useMediaQuery((theme) => theme.breakpoints.up('sm'));\r\n\r\n const createChart = useCallback((chartData, isMobile) => {\r\n // Get canvas by ID - allows rendering different chart for desktop and mobiles to set different font sizes\r\n const id = 'revenueChart';\r\n const ctx = document.getElementById(id).getContext('2d');\r\n\r\n // Create gradient background under line\r\n let width, height, gradient;\r\n const getGradient = (ctx, chartArea) => {\r\n const chartWidth = chartArea.right - chartArea.left;\r\n const chartHeight = chartArea.bottom - chartArea.top;\r\n if (!gradient || width !== chartWidth || height !== chartHeight) {\r\n // Create the gradient because this is either the first render or the size of the chart has changed\r\n width = chartWidth;\r\n height = chartHeight;\r\n gradient = ctx.createLinearGradient(0, chartArea.top, 0, chartArea.bottom);\r\n gradient.addColorStop(0, 'rgba(242, 175, 0, 0.2)');\r\n gradient.addColorStop(1, 'rgba(242, 175, 0, 0)');\r\n }\r\n return gradient;\r\n };\r\n\r\n // Create hover annotation line and outer border and box-radius effect on active point\r\n const drawHoverItems = {\r\n id: 'hoverItems',\r\n beforeDraw: chart => {\r\n // Only trigger action when hovering over a point\r\n if (chart.tooltip._active && chart.tooltip._active.length) {\r\n // Save chart context and get active point\r\n const chartCtx = chart.ctx;\r\n chartCtx.save();\r\n const activePoint = chart.tooltip._active[0];\r\n\r\n // Draw annotation line\r\n chartCtx.beginPath();\r\n chartCtx.setLineDash([1 , 3]);\r\n chartCtx.moveTo(activePoint.element.x, chart.chartArea.top);\r\n chartCtx.lineTo(activePoint.element.x, chart.chartArea.bottom);\r\n chartCtx.lineWidth = 1;\r\n chartCtx.strokeStyle = colors.primaryGreen;\r\n chartCtx.stroke();\r\n chartCtx.restore();\r\n\r\n // Draw solid border circle\r\n chartCtx.beginPath();\r\n chartCtx.arc(activePoint.element.x, activePoint.element.y, 6, 0, 2 * Math.PI);\r\n chartCtx.lineWidth = 2;\r\n chartCtx.strokeStyle = colors.secondaryOrange;\r\n chartCtx.stroke();\r\n chartCtx.restore();\r\n\r\n // Draw box shadow effect circle\r\n chartCtx.beginPath();\r\n chartCtx.arc(activePoint.element.x, activePoint.element.y, 9, 0, 2 * Math.PI);\r\n chartCtx.lineWidth = 6;\r\n chartCtx.strokeStyle = 'rgba(242, 175, 0, 0.4)';\r\n chartCtx.stroke();\r\n chartCtx.restore();\r\n }\r\n },\r\n };\r\n\r\n // Create array of past 6 months (abbreviated), ending with current month\r\n const months = getPrevMonths(6);\r\n\r\n // Create data object for chart config\r\n const data = {\r\n // Get array of last 6 months for labels\r\n labels: months,\r\n datasets: [{\r\n label: '',\r\n data: chartData,\r\n }],\r\n };\r\n\r\n // Create chart config object\r\n const config = {\r\n type: 'line',\r\n data,\r\n options: {\r\n plugins: {\r\n // Hide legend\r\n legend: {\r\n display: false,\r\n },\r\n // Customise hover tooltip\r\n tooltip: {\r\n yAlign: 'bottom',\r\n xAlign: 'center',\r\n backgroundColor: colors.white,\r\n padding: isMobile ? 5 : 13,\r\n cornerRadius: 5,\r\n caretPadding: 22,\r\n displayColors: false,\r\n titleColor: colors.chartTooltipBlack,\r\n titleFont: {\r\n family: 'GraphikMedium, sans-serif',\r\n size: isMobile ? 13 : 24,\r\n },\r\n titleAlign: 'center',\r\n titleMarginBottom: 2,\r\n bodyColor: colors.secondaryGrey,\r\n bodyFont: {\r\n family: 'GraphikRegular, sans-serif',\r\n size: isMobile ? 11 : 16,\r\n },\r\n bodyAlign: 'center',\r\n bodySpacing: 0,\r\n callbacks: {\r\n // Show amount as title and full month name as label\r\n title: context => `£${chartData[context[0].dataIndex].toLocaleString()}`,\r\n label: context => fullMonths[context.label],\r\n },\r\n },\r\n },\r\n // Customise line tension\r\n tension: 0.2,\r\n // Add gradient below chart line\r\n fill: true,\r\n backgroundColor: context => {\r\n const chart = context.chart;\r\n const {ctx, chartArea} = chart;\r\n\r\n if (!chartArea) {\r\n // This case happens on initial chart load\r\n return;\r\n }\r\n return getGradient(ctx, chartArea);\r\n },\r\n // Customise line and points properties\r\n borderColor: colors.secondaryOrange,\r\n borderWidth: 3,\r\n pointRadius: 1,\r\n pointBorderColor: 'transparent',\r\n pointHitRadius: 7,\r\n pointHoverBorderWidth: 1,\r\n pointHoverRadius: 5,\r\n pointHoverBorderColor: 'transparent',\r\n pointHoverBackgroundColor: colors.chartPointHoverBlack,\r\n borderJoinStyle: 'round',\r\n // Customise x and y axes, including ticks\r\n scales: {\r\n x: {\r\n position: 'right',\r\n grid: {\r\n color: 'transparent',\r\n borderColor: colors.primaryGrey,\r\n tickColor: colors.primaryGrey,\r\n },\r\n ticks: {\r\n color: colors.primaryGrey,\r\n padding: isMobile ? 5 : 10,\r\n font: {\r\n family: 'RobotoRegular, sans-serif',\r\n size: isMobile ? 10 : 13,\r\n },\r\n },\r\n },\r\n y: {\r\n position: 'right',\r\n beginAtZero: true,\r\n max: Math.round(chartData[(chartData.length -1)] / 1000)*1000 + 2000,\r\n grid: {\r\n color: colors.chartGridGrey,\r\n borderColor: 'transparent',\r\n tickColor: 'transparent',\r\n },\r\n ticks: {\r\n color: colors.primaryGrey,\r\n padding: isMobile ? 5 : 10,\r\n font: {\r\n family: 'RobotoRegular, sans-serif',\r\n size: isMobile ? 10 : 13,\r\n },\r\n // Format axis labels to add currency symbol and add comma separators to value\r\n callback: value => `£${value.toLocaleString()}`,\r\n },\r\n },\r\n },\r\n },\r\n plugins: [drawHoverItems],\r\n };\r\n\r\n // Instantiate chart with config object\r\n new Chart(ctx, config);\r\n }, []);\r\n\r\n useEffect(() => {\r\n if (!loading && data && data.length > 0) {\r\n // Render charts for desktop and mobile - both need to be rendered on page initialisation to prevent errors\r\n // Remove existing canvas before re-drawing to resolve error when parent re-renders\r\n const canvas = '