sag_components 2.0.0-beta323 → 2.0.0-beta324

package/dist/index.esm.js

@@ -1,4 +1,4 @@
-import React$1, { useState, useRef, useEffect, useMemo, useCallback, forwardRef, useImperativeHandle } from 'react';
+import React$1, { useState, useRef, useEffect, useMemo, useCallback, forwardRef, useImperativeHandle, useLayoutEffect } from 'react';
 import styled, { keyframes, css, styled as styled$1 } from 'styled-components';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { ResponsiveContainer, PieChart as PieChart$1, Pie, Cell, Tooltip as Tooltip$3, BarChart as BarChart$1, CartesianGrid, XAxis, YAxis, Bar, LabelList, ReferenceLine, LineChart, Line, AreaChart as AreaChart$1, Legend, Area, ScatterChart, ZAxis, Scatter, Brush, ComposedChart } from 'recharts';
@@ -10647,24 +10647,23 @@ const QuarterPopupPicker = ({
 };
 
 /* eslint-disable import/no-extraneous-dependencies */
-const QuarterPicker = _ref => {
-  let {
-    availableQuarters,
-    // ["Q1-2024"]
-    label,
-    onChange,
-    borderRadius,
-    required,
-    width,
-    height,
-    placeholder,
-    disabled,
-    borderColor,
-    borderColorFocus,
-    textColor,
-    selectedValue,
-    startYear
-  } = _ref;
+const QuarterPicker = ({
+  availableQuarters,
+  // ["Q1-2024"]
+  label,
+  onChange,
+  borderRadius,
+  required,
+  width,
+  height,
+  placeholder,
+  disabled,
+  borderColor,
+  borderColorFocus,
+  textColor,
+  selectedValue,
+  startYear
+}) => {
   const [isFocused, setIsFocused] = useState(false);
   const [isOpen, setIsOpen] = useState(false);
   const [value, setValue] = useState('');
@@ -11106,23 +11105,22 @@ const MonthPopupPicker = ({
 };
 
 /* eslint-disable import/no-extraneous-dependencies */
-const MonthPicker = _ref => {
-  let {
-    availableMonths,
-    label,
-    onChange,
-    borderRadius,
-    required,
-    width,
-    height,
-    placeholder,
-    disabled,
-    borderColor,
-    borderColorFocus,
-    textColor,
-    selectedValue,
-    startYear
-  } = _ref;
+const MonthPicker = ({
+  availableMonths,
+  label,
+  onChange,
+  borderRadius,
+  required,
+  width,
+  height,
+  placeholder,
+  disabled,
+  borderColor,
+  borderColorFocus,
+  textColor,
+  selectedValue,
+  startYear
+}) => {
   const [isFocused, setIsFocused] = useState(false);
   const [isOpen, setIsOpen] = useState(false);
   const [value, setValue] = useState('');
@@ -24239,24 +24237,23 @@ const DeleteIcon = styled.div`
   position: absolute;
 `;
 
-const QuickFilterDropdownSingle = _ref => {
-  let {
-    label,
-    hoverColor,
-    options,
-    selectedValue,
-    placeHolder,
-    optionHoverColor = '#edf6ff',
-    selectedOptionColor = "#C7E4FF",
-    onChange,
-    disabled,
-    width,
-    error,
-    errorMessage,
-    xIconShow,
-    labelColor,
-    showLabelOnTop
-  } = _ref;
+const QuickFilterDropdownSingle = ({
+  label,
+  hoverColor,
+  options,
+  selectedValue,
+  placeHolder,
+  optionHoverColor = '#edf6ff',
+  selectedOptionColor = "#C7E4FF",
+  onChange,
+  disabled,
+  width,
+  error,
+  errorMessage,
+  xIconShow,
+  labelColor,
+  showLabelOnTop
+}) => {
   const [isFocused, setIsFocused] = useState(false);
   const [showOptions, setShowOptions] = useState(false);
   const [inputValue, setInputValue] = useState("");
@@ -24714,27 +24711,26 @@ const IconContainer$2 = styled.div`
   cursor:  pointer;
 `;
 
-const QuickFilterDropdownMultiSelection = _ref => {
-  let {
-    label,
-    labelEmptyValue,
-    options,
-    selectedValue,
-    placeHolder,
-    onChange,
-    required,
-    disabled,
-    width,
-    height,
-    error,
-    errorMessage,
-    labelColor,
-    optionHoverColor = '#edf6ff',
-    xIconShow,
-    checkBoxColor,
-    showLabelOnTop,
-    dropdownHeight
-  } = _ref;
+const QuickFilterDropdownMultiSelection = ({
+  label,
+  labelEmptyValue,
+  options,
+  selectedValue,
+  placeHolder,
+  onChange,
+  required,
+  disabled,
+  width,
+  height,
+  error,
+  errorMessage,
+  labelColor,
+  optionHoverColor = '#edf6ff',
+  xIconShow,
+  checkBoxColor,
+  showLabelOnTop,
+  dropdownHeight
+}) => {
   const [isFocused, setIsFocused] = useState(false);
   const [showOptions, setShowOptions] = useState(false);
   const [inputValue, setInputValue] = useState('');
@@ -36280,9 +36276,9 @@ const ToggleSlider = styled.span`
   }
 `;
 
-/**
- * ToggleSwitch component for on/off states.
- * Supports small/large sizes and disabled state.
+/**
+ * ToggleSwitch component for on/off states.
+ * Supports small/large sizes and disabled state.
  */
 function ToggleSwitch(_ref) {
   let {
@@ -44088,1852 +44084,6 @@ TableBody.propTypes = {
 };
 TableBody.displayName = "TableBody";
 
-var nm$1 = "calendar_lottie";
-var ddd$1 = 0;
-var h$1 = 16;
-var w$1 = 16;
-var meta = {
-	a: "Sadjad",
-	k: "calendar icon",
-	d: "calendar icon for you designed, enjoy",
-	g: "LottieFiles AE 0.1.20"
-};
-var layers$1 = [
-	{
-		ty: 3,
-		nm: "Null 1",
-		sr: 1,
-		st: 0,
-		op: 241,
-		ip: 0,
-		hd: false,
-		ddd: 0,
-		bm: 0,
-		hasMask: false,
-		ao: 0,
-		ks: {
-			a: {
-				a: 0,
-				k: [
-					0,
-					50,
-					0
-				],
-				ix: 1
-			},
-			s: {
-				a: 1,
-				k: [
-					{
-						o: {
-							x: 0.89,
-							y: 0
-						},
-						i: {
-							x: 0.11,
-							y: 1
-						},
-						s: [
-							6.4,
-							6.4,
-							100
-						],
-						t: 8
-					},
-					{
-						o: {
-							x: 0.89,
-							y: 0
-						},
-						i: {
-							x: 0.11,
-							y: 1
-						},
-						s: [
-							5.12,
-							5.12,
-							100
-						],
-						t: 14
-					},
-					{
-						o: {
-							x: 0.89,
-							y: 0
-						},
-						i: {
-							x: 0.11,
-							y: 1
-						},
-						s: [
-							5.12,
-							5.12,
-							100
-						],
-						t: 31
-					},
-					{
-						s: [
-							6.4,
-							6.4,
-							100
-						],
-						t: 36
-					}
-				],
-				ix: 6
-			},
-			sk: {
-				a: 0,
-				k: 0
-			},
-			p: {
-				a: 0,
-				k: [
-					8,
-					11.2,
-					0
-				],
-				ix: 2
-			},
-			r: {
-				a: 0,
-				k: 0,
-				ix: 10
-			},
-			sa: {
-				a: 0,
-				k: 0
-			},
-			o: {
-				a: 0,
-				k: 0,
-				ix: 11
-			}
-		},
-		ef: [
-		],
-		ind: 1
-	},
-	{
-		ty: 4,
-		nm: "pin Outlines",
-		sr: 1,
-		st: 0,
-		op: 241,
-		ip: 0,
-		hd: false,
-		ddd: 0,
-		bm: 0,
-		hasMask: false,
-		ao: 0,
-		ks: {
-			a: {
-				a: 0,
-				k: [
-					39.833,
-					23.166,
-					0
-				],
-				ix: 1
-			},
-			s: {
-				a: 0,
-				k: [
-					100,
-					100,
-					100
-				],
-				ix: 6
-			},
-			sk: {
-				a: 0,
-				k: 0
-			},
-			p: {
-				a: 0,
-				k: [
-					0,
-					-66.667,
-					0
-				],
-				ix: 2
-			},
-			r: {
-				a: 0,
-				k: 0,
-				ix: 10
-			},
-			sa: {
-				a: 0,
-				k: 0
-			},
-			o: {
-				a: 0,
-				k: 100,
-				ix: 11
-			}
-		},
-		ef: [
-		],
-		shapes: [
-			{
-				ty: "gr",
-				bm: 0,
-				hd: false,
-				mn: "ADBE Vector Group",
-				nm: "Group 1",
-				ix: 1,
-				cix: 2,
-				np: 2,
-				it: [
-					{
-						ty: "sh",
-						bm: 0,
-						hd: false,
-						mn: "ADBE Vector Shape - Group",
-						nm: "Path 1",
-						ix: 1,
-						d: 1,
-						ks: {
-							a: 0,
-							k: {
-								c: false,
-								i: [
-									[
-										0,
-										0
-									],
-									[
-										0,
-										0
-									]
-								],
-								o: [
-									[
-										0,
-										0
-									],
-									[
-										0,
-										0
-									]
-								],
-								v: [
-									[
-										73.166,
-										6.5
-									],
-									[
-										73.166,
-										39.833
-									]
-								]
-							},
-							ix: 2
-						}
-					},
-					{
-						ty: "st",
-						bm: 0,
-						hd: false,
-						mn: "ADBE Vector Graphic - Stroke",
-						nm: "Stroke 1",
-						lc: 2,
-						lj: 2,
-						ml: 1,
-						o: {
-							a: 0,
-							k: 100,
-							ix: 4
-						},
-						w: {
-							a: 0,
-							k: 13,
-							ix: 5
-						},
-						c: {
-							a: 0,
-							k: [
-								0.0235,
-								0.4039,
-								0.4078
-							],
-							ix: 3
-						}
-					},
-					{
-						ty: "tr",
-						a: {
-							a: 0,
-							k: [
-								0,
-								0
-							],
-							ix: 1
-						},
-						s: {
-							a: 0,
-							k: [
-								100,
-								100
-							],
-							ix: 3
-						},
-						sk: {
-							a: 0,
-							k: 0,
-							ix: 4
-						},
-						p: {
-							a: 0,
-							k: [
-								0,
-								0
-							],
-							ix: 2
-						},
-						r: {
-							a: 0,
-							k: 0,
-							ix: 6
-						},
-						sa: {
-							a: 0,
-							k: 0,
-							ix: 5
-						},
-						o: {
-							a: 0,
-							k: 100,
-							ix: 7
-						}
-					}
-				]
-			},
-			{
-				ty: "gr",
-				bm: 0,
-				hd: false,
-				mn: "ADBE Vector Group",
-				nm: "Group 2",
-				ix: 2,
-				cix: 2,
-				np: 2,
-				it: [
-					{
-						ty: "sh",
-						bm: 0,
-						hd: false,
-						mn: "ADBE Vector Shape - Group",
-						nm: "Path 1",
-						ix: 1,
-						d: 1,
-						ks: {
-							a: 0,
-							k: {
-								c: false,
-								i: [
-									[
-										0,
-										0
-									],
-									[
-										0,
-										0
-									]
-								],
-								o: [
-									[
-										0,
-										0
-									],
-									[
-										0,
-										0
-									]
-								],
-								v: [
-									[
-										6.5,
-										6.5
-									],
-									[
-										6.5,
-										39.833
-									]
-								]
-							},
-							ix: 2
-						}
-					},
-					{
-						ty: "st",
-						bm: 0,
-						hd: false,
-						mn: "ADBE Vector Graphic - Stroke",
-						nm: "Stroke 1",
-						lc: 2,
-						lj: 2,
-						ml: 1,
-						o: {
-							a: 0,
-							k: 100,
-							ix: 4
-						},
-						w: {
-							a: 0,
-							k: 13,
-							ix: 5
-						},
-						c: {
-							a: 0,
-							k: [
-								0.0235,
-								0.4039,
-								0.4078
-							],
-							ix: 3
-						}
-					},
-					{
-						ty: "tr",
-						a: {
-							a: 0,
-							k: [
-								0,
-								0
-							],
-							ix: 1
-						},
-						s: {
-							a: 0,
-							k: [
-								100,
-								100
-							],
-							ix: 3
-						},
-						sk: {
-							a: 0,
-							k: 0,
-							ix: 4
-						},
-						p: {
-							a: 0,
-							k: [
-								0,
-								0
-							],
-							ix: 2
-						},
-						r: {
-							a: 0,
-							k: 0,
-							ix: 6
-						},
-						sa: {
-							a: 0,
-							k: 0,
-							ix: 5
-						},
-						o: {
-							a: 0,
-							k: 100,
-							ix: 7
-						}
-					}
-				]
-			}
-		],
-		ind: 2,
-		parent: 1
-	},
-	{
-		ty: 4,
-		nm: "line Outlines",
-		sr: 1,
-		st: 0,
-		op: 241,
-		ip: 0,
-		hd: false,
-		ddd: 0,
-		bm: 0,
-		hasMask: false,
-		ao: 0,
-		ks: {
-			a: {
-				a: 0,
-				k: [
-					81.5,
-					6.5,
-					0
-				],
-				ix: 1
-			},
-			s: {
-				a: 0,
-				k: [
-					100,
-					100,
-					100
-				],
-				ix: 6
-			},
-			sk: {
-				a: 0,
-				k: 0
-			},
-			p: {
-				a: 1,
-				k: [
-					{
-						o: {
-							x: 0.66,
-							y: 0
-						},
-						i: {
-							x: 0.34,
-							y: 1
-						},
-						s: [
-							0,
-							-16.667,
-							0
-						],
-						t: 8,
-						ti: [
-							0,
-							8.333,
-							0
-						],
-						to: [
-							0,
-							-14.667,
-							0
-						]
-					},
-					{
-						o: {
-							x: 0.66,
-							y: 0
-						},
-						i: {
-							x: 0.34,
-							y: 1
-						},
-						s: [
-							0,
-							-104.667,
-							0
-						],
-						t: 23,
-						ti: [
-							0,
-							-6.333,
-							0
-						],
-						to: [
-							0,
-							-8.333,
-							0
-						]
-					},
-					{
-						s: [
-							0,
-							-66.667,
-							0
-						],
-						t: 36
-					}
-				],
-				ix: 2
-			},
-			r: {
-				a: 0,
-				k: 0,
-				ix: 10
-			},
-			sa: {
-				a: 0,
-				k: 0
-			},
-			o: {
-				a: 0,
-				k: 100,
-				ix: 11
-			}
-		},
-		ef: [
-		],
-		shapes: [
-			{
-				ty: "gr",
-				bm: 0,
-				hd: false,
-				mn: "ADBE Vector Group",
-				nm: "Group 1",
-				ix: 1,
-				cix: 2,
-				np: 2,
-				it: [
-					{
-						ty: "sh",
-						bm: 0,
-						hd: false,
-						mn: "ADBE Vector Shape - Group",
-						nm: "Path 1",
-						ix: 1,
-						d: 1,
-						ks: {
-							a: 1,
-							k: [
-								{
-									o: {
-										x: 0.66,
-										y: 0
-									},
-									i: {
-										x: 0.34,
-										y: 1
-									},
-									s: [
-										{
-											c: false,
-											i: [
-												[
-													0,
-													0
-												],
-												[
-													0,
-													0
-												]
-											],
-											o: [
-												[
-													0,
-													0
-												],
-												[
-													0,
-													0
-												]
-											],
-											v: [
-												[
-													6.5,
-													6.5
-												],
-												[
-													156.5,
-													6.5
-												]
-											]
-										}
-									],
-									t: 8
-								},
-								{
-									o: {
-										x: 0.66,
-										y: 0
-									},
-									i: {
-										x: 0.34,
-										y: 1
-									},
-									s: [
-										{
-											c: false,
-											i: [
-												[
-													0,
-													0
-												],
-												[
-													0,
-													0
-												]
-											],
-											o: [
-												[
-													0,
-													0
-												],
-												[
-													0,
-													0
-												]
-											],
-											v: [
-												[
-													6.5,
-													6.5
-												],
-												[
-													156.5,
-													6.5
-												]
-											]
-										}
-									],
-									t: 30
-								},
-								{
-									s: [
-										{
-											c: false,
-											i: [
-												[
-													0,
-													0
-												],
-												[
-													0,
-													0
-												]
-											],
-											o: [
-												[
-													0,
-													0
-												],
-												[
-													0,
-													0
-												]
-											],
-											v: [
-												[
-													20.5,
-													6.583
-												],
-												[
-													141,
-													6.583
-												]
-											]
-										}
-									],
-									t: 36
-								}
-							],
-							ix: 2
-						}
-					},
-					{
-						ty: "st",
-						bm: 0,
-						hd: false,
-						mn: "ADBE Vector Graphic - Stroke",
-						nm: "Stroke 1",
-						lc: 2,
-						lj: 2,
-						ml: 1,
-						o: {
-							a: 0,
-							k: 100,
-							ix: 4
-						},
-						w: {
-							a: 0,
-							k: 13,
-							ix: 5
-						},
-						c: {
-							a: 0,
-							k: [
-								0.0235,
-								0.4039,
-								0.4078
-							],
-							ix: 3
-						}
-					},
-					{
-						ty: "tr",
-						a: {
-							a: 0,
-							k: [
-								0,
-								0
-							],
-							ix: 1
-						},
-						s: {
-							a: 0,
-							k: [
-								100,
-								100
-							],
-							ix: 3
-						},
-						sk: {
-							a: 0,
-							k: 0,
-							ix: 4
-						},
-						p: {
-							a: 0,
-							k: [
-								0,
-								0
-							],
-							ix: 2
-						},
-						r: {
-							a: 0,
-							k: 0,
-							ix: 6
-						},
-						sa: {
-							a: 0,
-							k: 0,
-							ix: 5
-						},
-						o: {
-							a: 0,
-							k: 100,
-							ix: 7
-						}
-					}
-				]
-			}
-		],
-		ind: 3,
-		parent: 1
-	},
-	{
-		ty: 4,
-		nm: "line Outlines 2",
-		sr: 1,
-		st: 0,
-		op: 241,
-		ip: 0,
-		hd: false,
-		ddd: 0,
-		bm: 0,
-		hasMask: false,
-		ao: 0,
-		ks: {
-			a: {
-				a: 0,
-				k: [
-					81.5,
-					6.5,
-					0
-				],
-				ix: 1
-			},
-			s: {
-				a: 0,
-				k: [
-					100,
-					100,
-					100
-				],
-				ix: 6
-			},
-			sk: {
-				a: 0,
-				k: 0
-			},
-			p: {
-				a: 0,
-				k: [
-					0,
-					-16.667,
-					0
-				],
-				ix: 2
-			},
-			r: {
-				a: 0,
-				k: 0,
-				ix: 10
-			},
-			sa: {
-				a: 0,
-				k: 0
-			},
-			o: {
-				a: 1,
-				k: [
-					{
-						o: {
-							x: 0.167,
-							y: 0.167
-						},
-						i: {
-							x: 0.833,
-							y: 0.833
-						},
-						s: [
-							0
-						],
-						t: 14
-					},
-					{
-						s: [
-							100
-						],
-						t: 15
-					}
-				],
-				ix: 11
-			}
-		},
-		ef: [
-		],
-		shapes: [
-			{
-				ty: "gr",
-				bm: 0,
-				hd: false,
-				mn: "ADBE Vector Group",
-				nm: "Group 1",
-				ix: 1,
-				cix: 2,
-				np: 2,
-				it: [
-					{
-						ty: "sh",
-						bm: 0,
-						hd: false,
-						mn: "ADBE Vector Shape - Group",
-						nm: "Path 1",
-						ix: 1,
-						d: 1,
-						ks: {
-							a: 0,
-							k: {
-								c: false,
-								i: [
-									[
-										0,
-										0
-									],
-									[
-										0,
-										0
-									]
-								],
-								o: [
-									[
-										0,
-										0
-									],
-									[
-										0,
-										0
-									]
-								],
-								v: [
-									[
-										6.5,
-										6.5
-									],
-									[
-										156.5,
-										6.5
-									]
-								]
-							},
-							ix: 2
-						}
-					},
-					{
-						ty: "st",
-						bm: 0,
-						hd: false,
-						mn: "ADBE Vector Graphic - Stroke",
-						nm: "Stroke 1",
-						lc: 2,
-						lj: 2,
-						ml: 1,
-						o: {
-							a: 0,
-							k: 100,
-							ix: 4
-						},
-						w: {
-							a: 0,
-							k: 13,
-							ix: 5
-						},
-						c: {
-							a: 0,
-							k: [
-								0.0235,
-								0.4039,
-								0.4078
-							],
-							ix: 3
-						}
-					},
-					{
-						ty: "tr",
-						a: {
-							a: 0,
-							k: [
-								0,
-								0
-							],
-							ix: 1
-						},
-						s: {
-							a: 0,
-							k: [
-								100,
-								100
-							],
-							ix: 3
-						},
-						sk: {
-							a: 0,
-							k: 0,
-							ix: 4
-						},
-						p: {
-							a: 0,
-							k: [
-								0,
-								0
-							],
-							ix: 2
-						},
-						r: {
-							a: 0,
-							k: 0,
-							ix: 6
-						},
-						sa: {
-							a: 0,
-							k: 0,
-							ix: 5
-						},
-						o: {
-							a: 0,
-							k: 100,
-							ix: 7
-						}
-					}
-				]
-			}
-		],
-		ind: 4,
-		parent: 1
-	},
-	{
-		ty: 4,
-		nm: "page02 Outlines",
-		sr: 1,
-		st: 0,
-		op: 70,
-		ip: 0,
-		hd: false,
-		ddd: 0,
-		bm: 0,
-		hasMask: false,
-		ao: 0,
-		ks: {
-			a: {
-				a: 0,
-				k: [
-					88,
-					13,
-					0
-				],
-				ix: 1
-			},
-			s: {
-				a: 0,
-				k: [
-					100,
-					100,
-					100
-				],
-				ix: 6
-			},
-			sk: {
-				a: 0,
-				k: 0
-			},
-			p: {
-				a: 0,
-				k: [
-					-0.001,
-					-66.667,
-					0
-				],
-				ix: 2
-			},
-			r: {
-				a: 0,
-				k: 180,
-				ix: 10
-			},
-			sa: {
-				a: 0,
-				k: 0
-			},
-			o: {
-				a: 0,
-				k: 100,
-				ix: 11
-			}
-		},
-		ef: [
-		],
-		shapes: [
-			{
-				ty: "gr",
-				bm: 0,
-				hd: false,
-				mn: "ADBE Vector Group",
-				nm: "Group 1",
-				ix: 1,
-				cix: 2,
-				np: 2,
-				it: [
-					{
-						ty: "sh",
-						bm: 0,
-						hd: false,
-						mn: "ADBE Vector Shape - Group",
-						nm: "Path 1",
-						ix: 1,
-						d: 1,
-						ks: {
-							a: 1,
-							k: [
-								{
-									o: {
-										x: 0.66,
-										y: 0
-									},
-									i: {
-										x: 0.34,
-										y: 1
-									},
-									s: [
-										{
-											c: true,
-											i: [
-												[
-													-9.205,
-													0
-												],
-												[
-													0,
-													0
-												],
-												[
-													0.499,
-													12.166
-												],
-												[
-													0,
-													0
-												],
-												[
-													9.205,
-													0
-												],
-												[
-													0,
-													0
-												],
-												[
-													-0.673,
-													-8
-												],
-												[
-													0,
-													0
-												]
-											],
-											o: [
-												[
-													0,
-													0
-												],
-												[
-													9.205,
-													0
-												],
-												[
-													0,
-													0
-												],
-												[
-													-0.673,
-													-6
-												],
-												[
-													0,
-													0
-												],
-												[
-													-9.205,
-													0
-												],
-												[
-													0,
-													0
-												],
-												[
-													-0.001,
-													13.166
-												]
-											],
-											v: [
-												[
-													-58.333,
-													-75
-												],
-												[
-													58.334,
-													-75
-												],
-												[
-													75.001,
-													-89.833
-												],
-												[
-													75.173,
-													-210.167
-												],
-												[
-													58.514,
-													-225
-												],
-												[
-													-58.32,
-													-225
-												],
-												[
-													-74.827,
-													-210.167
-												],
-												[
-													-74.999,
-													-92.833
-												]
-											]
-										}
-									],
-									t: 8
-								},
-								{
-									o: {
-										x: 0.66,
-										y: 0
-									},
-									i: {
-										x: 0.34,
-										y: 1
-									},
-									s: [
-										{
-											c: true,
-											i: [
-												[
-													-9.205,
-													0
-												],
-												[
-													0,
-													0
-												],
-												[
-													0,
-													-9.205
-												],
-												[
-													0,
-													0
-												],
-												[
-													9.205,
-													0
-												],
-												[
-													0,
-													0
-												],
-												[
-													0,
-													9.205
-												],
-												[
-													0,
-													0
-												]
-											],
-											o: [
-												[
-													0,
-													0
-												],
-												[
-													9.205,
-													0
-												],
-												[
-													0,
-													0
-												],
-												[
-													0,
-													9.205
-												],
-												[
-													0,
-													0
-												],
-												[
-													-9.205,
-													0
-												],
-												[
-													0,
-													0
-												],
-												[
-													0,
-													-9.205
-												]
-											],
-											v: [
-												[
-													-58.333,
-													-75
-												],
-												[
-													58.334,
-													-75
-												],
-												[
-													75,
-													-58.333
-												],
-												[
-													74.754,
-													-11.417
-												],
-												[
-													58.088,
-													5.25
-												],
-												[
-													-58.579,
-													5.25
-												],
-												[
-													-75.246,
-													-11.417
-												],
-												[
-													-75,
-													-58.333
-												]
-											]
-										}
-									],
-									t: 23
-								},
-								{
-									s: [
-										{
-											c: true,
-											i: [
-												[
-													-9.205,
-													0
-												],
-												[
-													0,
-													0
-												],
-												[
-													-1.001,
-													7.166
-												],
-												[
-													0,
-													0
-												],
-												[
-													11.663,
-													-0.292
-												],
-												[
-													0,
-													0
-												],
-												[
-													0.119,
-													14.876
-												],
-												[
-													0,
-													0
-												]
-											],
-											o: [
-												[
-													0,
-													0
-												],
-												[
-													8.29,
-													-0.667
-												],
-												[
-													0,
-													0
-												],
-												[
-													-0.003,
-													12.251
-												],
-												[
-													0,
-													0
-												],
-												[
-													-13.295,
-													-1.792
-												],
-												[
-													0,
-													0
-												],
-												[
-													0.996,
-													5.541
-												]
-											],
-											v: [
-												[
-													-58.333,
-													-75
-												],
-												[
-													58.334,
-													-75
-												],
-												[
-													73.876,
-													-88.333
-												],
-												[
-													74.503,
-													-91.667
-												],
-												[
-													57.837,
-													-75
-												],
-												[
-													-58.83,
-													-75
-												],
-												[
-													-75.494,
-													-96.167
-												],
-												[
-													-74.621,
-													-86.333
-												]
-											]
-										}
-									],
-									t: 36
-								}
-							],
-							ix: 2
-						}
-					},
-					{
-						ty: "st",
-						bm: 0,
-						hd: false,
-						mn: "ADBE Vector Graphic - Stroke",
-						nm: "Stroke 1",
-						lc: 2,
-						lj: 2,
-						ml: 1,
-						o: {
-							a: 0,
-							k: 100,
-							ix: 4
-						},
-						w: {
-							a: 0,
-							k: 13,
-							ix: 5
-						},
-						c: {
-							a: 0,
-							k: [
-								0.0235,
-								0.4039,
-								0.4078
-							],
-							ix: 3
-						}
-					},
-					{
-						ty: "tr",
-						a: {
-							a: 0,
-							k: [
-								0,
-								0
-							],
-							ix: 1
-						},
-						s: {
-							a: 0,
-							k: [
-								100,
-								100
-							],
-							ix: 3
-						},
-						sk: {
-							a: 0,
-							k: 0,
-							ix: 4
-						},
-						p: {
-							a: 0,
-							k: [
-								88,
-								88
-							],
-							ix: 2
-						},
-						r: {
-							a: 0,
-							k: 0,
-							ix: 6
-						},
-						sa: {
-							a: 0,
-							k: 0,
-							ix: 5
-						},
-						o: {
-							a: 0,
-							k: 100,
-							ix: 7
-						}
-					}
-				]
-			}
-		],
-		ind: 5,
-		parent: 1
-	},
-	{
-		ty: 4,
-		nm: "page01 Outlines",
-		sr: 1,
-		st: 0,
-		op: 241,
-		ip: 0,
-		hd: false,
-		ddd: 0,
-		bm: 0,
-		hasMask: false,
-		ao: 0,
-		ks: {
-			a: {
-				a: 0,
-				k: [
-					88,
-					88,
-					0
-				],
-				ix: 1
-			},
-			s: {
-				a: 0,
-				k: [
-					100,
-					100,
-					100
-				],
-				ix: 6
-			},
-			sk: {
-				a: 0,
-				k: 0
-			},
-			p: {
-				a: 0,
-				k: [
-					-0.001,
-					8.333,
-					0
-				],
-				ix: 2
-			},
-			r: {
-				a: 0,
-				k: 0,
-				ix: 10
-			},
-			sa: {
-				a: 0,
-				k: 0
-			},
-			o: {
-				a: 0,
-				k: 100,
-				ix: 11
-			}
-		},
-		ef: [
-		],
-		shapes: [
-			{
-				ty: "gr",
-				bm: 0,
-				hd: false,
-				mn: "ADBE Vector Group",
-				nm: "Group 1",
-				ix: 1,
-				cix: 2,
-				np: 2,
-				it: [
-					{
-						ty: "sh",
-						bm: 0,
-						hd: false,
-						mn: "ADBE Vector Shape - Group",
-						nm: "Path 1",
-						ix: 1,
-						d: 1,
-						ks: {
-							a: 0,
-							k: {
-								c: true,
-								i: [
-									[
-										-9.205,
-										0
-									],
-									[
-										0,
-										0
-									],
-									[
-										0,
-										-9.205
-									],
-									[
-										0,
-										0
-									],
-									[
-										9.205,
-										0
-									],
-									[
-										0,
-										0
-									],
-									[
-										0,
-										9.205
-									],
-									[
-										0,
-										0
-									]
-								],
-								o: [
-									[
-										0,
-										0
-									],
-									[
-										9.205,
-										0
-									],
-									[
-										0,
-										0
-									],
-									[
-										0,
-										9.205
-									],
-									[
-										0,
-										0
-									],
-									[
-										-9.205,
-										0
-									],
-									[
-										0,
-										0
-									],
-									[
-										0,
-										-9.205
-									]
-								],
-								v: [
-									[
-										-58.333,
-										-75
-									],
-									[
-										58.334,
-										-75
-									],
-									[
-										75,
-										-58.333
-									],
-									[
-										75,
-										58.333
-									],
-									[
-										58.334,
-										75
-									],
-									[
-										-58.333,
-										75
-									],
-									[
-										-75,
-										58.333
-									],
-									[
-										-75,
-										-58.333
-									]
-								]
-							},
-							ix: 2
-						}
-					},
-					{
-						ty: "st",
-						bm: 0,
-						hd: false,
-						mn: "ADBE Vector Graphic - Stroke",
-						nm: "Stroke 1",
-						lc: 2,
-						lj: 2,
-						ml: 1,
-						o: {
-							a: 0,
-							k: 100,
-							ix: 4
-						},
-						w: {
-							a: 0,
-							k: 13,
-							ix: 5
-						},
-						c: {
-							a: 0,
-							k: [
-								0.0235,
-								0.4039,
-								0.4078
-							],
-							ix: 3
-						}
-					},
-					{
-						ty: "tr",
-						a: {
-							a: 0,
-							k: [
-								0,
-								0
-							],
-							ix: 1
-						},
-						s: {
-							a: 0,
-							k: [
-								100,
-								100
-							],
-							ix: 3
-						},
-						sk: {
-							a: 0,
-							k: 0,
-							ix: 4
-						},
-						p: {
-							a: 0,
-							k: [
-								88,
-								88
-							],
-							ix: 2
-						},
-						r: {
-							a: 0,
-							k: 0,
-							ix: 6
-						},
-						sa: {
-							a: 0,
-							k: 0,
-							ix: 5
-						},
-						o: {
-							a: 0,
-							k: 100,
-							ix: 7
-						}
-					}
-				]
-			}
-		],
-		ind: 6,
-		parent: 1
-	}
-];
-var v$1 = "5.5.7";
-var fr$1 = 45;
-var op$1 = 41;
-var ip$1 = 0;
-var assets$1 = [
-];
-var LoadingAnimation = {
-	nm: nm$1,
-	ddd: ddd$1,
-	h: h$1,
-	w: w$1,
-	meta: meta,
-	layers: layers$1,
-	v: v$1,
-	fr: fr$1,
-	op: op$1,
-	ip: ip$1,
-	assets: assets$1
-};
-
 var lottie$1 = {exports: {}};
 
 lottie$1.exports;(function(module,exports){typeof document!=="undefined"&&typeof navigator!=="undefined"&&function(global,factory){module.exports=factory();}(commonjsGlobal,function(){var svgNS='http://www.w3.org/2000/svg';var locationHref='';var _useWebWorker=false;var initialDefaultFrame=-999999;var setWebWorker=function setWebWorker(flag){_useWebWorker=!!flag;};var getWebWorker=function getWebWorker(){return _useWebWorker;};var setLocationHref=function setLocationHref(value){locationHref=value;};var getLocationHref=function getLocationHref(){return locationHref;};function createTag(type){// return {appendChild:function(){},setAttribute:function(){},style:{}}
@@ -46825,433 +44975,2483 @@ var useLottie = function useLottie(props, style) {
     var _a;
     (_a = animationInstanceRef.current) === null || _a === void 0 ? void 0 : _a.setSubframe(useSubFrames);
   };
-  /**
-   * Get animation duration
-   * @param inFrames
-   */
-  var getDuration = function getDuration(inFrames) {
-    var _a;
-    return (_a = animationInstanceRef.current) === null || _a === void 0 ? void 0 : _a.getDuration(inFrames);
+  /**
+   * Get animation duration
+   * @param inFrames
+   */
+  var getDuration = function getDuration(inFrames) {
+    var _a;
+    return (_a = animationInstanceRef.current) === null || _a === void 0 ? void 0 : _a.getDuration(inFrames);
+  };
+  /**
+   * Destroy animation
+   */
+  var destroy = function destroy() {
+    var _a;
+    (_a = animationInstanceRef.current) === null || _a === void 0 ? void 0 : _a.destroy();
+    // Removing the reference to the animation so separate cleanups are skipped.
+    // Without it the internal `lottie-react` instance throws exceptions as it already cleared itself on destroy.
+    animationInstanceRef.current = undefined;
+  };
+  /*
+        ======================================
+            LOTTIE
+        ======================================
+     */
+  /**
+   * Load a new animation, and if it's the case, destroy the previous one
+   * @param {Object} forcedConfigs
+   */
+  var loadAnimation = function loadAnimation() {
+    var forcedConfigs = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    var _a;
+    // Return if the container ref is null
+    if (!animationContainer.current) {
+      return;
+    }
+    // Destroy any previous instance
+    (_a = animationInstanceRef.current) === null || _a === void 0 ? void 0 : _a.destroy();
+    // Build the animation configuration
+    var config = _objectSpread2(_objectSpread2(_objectSpread2({}, props), forcedConfigs), {}, {
+      container: animationContainer.current
+    });
+    // Save the animation instance
+    animationInstanceRef.current = lottie.loadAnimation(config);
+    setAnimationLoaded(!!animationInstanceRef.current);
+    // Return a function that will clean up
+    return function () {
+      var _a;
+      (_a = animationInstanceRef.current) === null || _a === void 0 ? void 0 : _a.destroy();
+      animationInstanceRef.current = undefined;
+    };
+  };
+  /**
+   * (Re)Initialize when animation data changed
+   */
+  useEffect(function () {
+    var onUnmount = loadAnimation();
+    // Clean up on unmount
+    return function () {
+      return onUnmount === null || onUnmount === void 0 ? void 0 : onUnmount();
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [animationData, loop]);
+  // Update the autoplay state
+  useEffect(function () {
+    if (!animationInstanceRef.current) {
+      return;
+    }
+    animationInstanceRef.current.autoplay = !!autoplay;
+  }, [autoplay]);
+  // Update the initial segment state
+  useEffect(function () {
+    if (!animationInstanceRef.current) {
+      return;
+    }
+    // When null should reset to default animation length
+    if (!initialSegment) {
+      animationInstanceRef.current.resetSegments(true);
+      return;
+    }
+    // If it's not a valid segment, do nothing
+    if (!Array.isArray(initialSegment) || !initialSegment.length) {
+      return;
+    }
+    // If the current position it's not in the new segment
+    // set the current position to start
+    if (animationInstanceRef.current.currentRawFrame < initialSegment[0] || animationInstanceRef.current.currentRawFrame > initialSegment[1]) {
+      animationInstanceRef.current.currentRawFrame = initialSegment[0];
+    }
+    // Update the segment
+    animationInstanceRef.current.setSegment(initialSegment[0], initialSegment[1]);
+  }, [initialSegment]);
+  /*
+        ======================================
+            EVENTS
+        ======================================
+     */
+  /**
+   * Reinitialize listener on change
+   */
+  useEffect(function () {
+    var partialListeners = [{
+      name: "complete",
+      handler: onComplete
+    }, {
+      name: "loopComplete",
+      handler: onLoopComplete
+    }, {
+      name: "enterFrame",
+      handler: onEnterFrame
+    }, {
+      name: "segmentStart",
+      handler: onSegmentStart
+    }, {
+      name: "config_ready",
+      handler: onConfigReady
+    }, {
+      name: "data_ready",
+      handler: onDataReady
+    }, {
+      name: "data_failed",
+      handler: onDataFailed
+    }, {
+      name: "loaded_images",
+      handler: onLoadedImages
+    }, {
+      name: "DOMLoaded",
+      handler: onDOMLoaded
+    }, {
+      name: "destroy",
+      handler: onDestroy
+    }];
+    var listeners = partialListeners.filter(function (listener) {
+      return listener.handler != null;
+    });
+    if (!listeners.length) {
+      return;
+    }
+    var deregisterList = listeners.map(
+    /**
+     * Handle the process of adding an event listener
+     * @param {Listener} listener
+     * @return {Function} Function that deregister the listener
+     */
+    function (listener) {
+      var _a;
+      (_a = animationInstanceRef.current) === null || _a === void 0 ? void 0 : _a.addEventListener(listener.name, listener.handler);
+      // Return a function to deregister this listener
+      return function () {
+        var _a;
+        (_a = animationInstanceRef.current) === null || _a === void 0 ? void 0 : _a.removeEventListener(listener.name, listener.handler);
+      };
+    });
+    // Deregister listeners on unmount
+    return function () {
+      deregisterList.forEach(function (deregister) {
+        return deregister();
+      });
+    };
+  }, [onComplete, onLoopComplete, onEnterFrame, onSegmentStart, onConfigReady, onDataReady, onDataFailed, onLoadedImages, onDOMLoaded, onDestroy]);
+  /**
+   * Build the animation view
+   */
+  var View = /*#__PURE__*/React$1.createElement("div", _objectSpread2({
+    style: style,
+    ref: animationContainer
+  }, rest));
+  return {
+    View: View,
+    play: play,
+    stop: stop,
+    pause: pause,
+    setSpeed: setSpeed,
+    goToAndStop: goToAndStop,
+    goToAndPlay: goToAndPlay,
+    setDirection: setDirection,
+    playSegments: playSegments,
+    setSubframe: setSubframe,
+    getDuration: getDuration,
+    destroy: destroy,
+    animationContainerRef: animationContainer,
+    animationLoaded: animationLoaded,
+    animationItem: animationInstanceRef.current
+  };
+};
+
+// helpers
+function getContainerVisibility(container) {
+  var _container$getBoundin = container.getBoundingClientRect(),
+    top = _container$getBoundin.top,
+    height = _container$getBoundin.height;
+  var current = window.innerHeight - top;
+  var max = window.innerHeight + height;
+  return current / max;
+}
+function getContainerCursorPosition(container, cursorX, cursorY) {
+  var _container$getBoundin2 = container.getBoundingClientRect(),
+    top = _container$getBoundin2.top,
+    left = _container$getBoundin2.left,
+    width = _container$getBoundin2.width,
+    height = _container$getBoundin2.height;
+  var x = (cursorX - left) / width;
+  var y = (cursorY - top) / height;
+  return {
+    x: x,
+    y: y
   };
+}
+var useInitInteractivity = function useInitInteractivity(_ref) {
+  var wrapperRef = _ref.wrapperRef,
+    animationItem = _ref.animationItem,
+    mode = _ref.mode,
+    actions = _ref.actions;
+  useEffect(function () {
+    var wrapper = wrapperRef.current;
+    if (!wrapper || !animationItem || !actions.length) {
+      return;
+    }
+    animationItem.stop();
+    var scrollModeHandler = function scrollModeHandler() {
+      var assignedSegment = null;
+      var scrollHandler = function scrollHandler() {
+        var currentPercent = getContainerVisibility(wrapper);
+        // Find the first action that satisfies the current position conditions
+        var action = actions.find(function (_ref2) {
+          var visibility = _ref2.visibility;
+          return visibility && currentPercent >= visibility[0] && currentPercent <= visibility[1];
+        });
+        // Skip if no matching action was found!
+        if (!action) {
+          return;
+        }
+        if (action.type === "seek" && action.visibility && action.frames.length === 2) {
+          // Seek: Go to a frame based on player scroll position action
+          var frameToGo = action.frames[0] + Math.ceil((currentPercent - action.visibility[0]) / (action.visibility[1] - action.visibility[0]) * action.frames[1]);
+          //! goToAndStop must be relative to the start of the current segment
+          animationItem.goToAndStop(frameToGo - animationItem.firstFrame - 1, true);
+        }
+        if (action.type === "loop") {
+          // Loop: Loop a given frames
+          if (assignedSegment === null) {
+            // if not playing any segments currently. play those segments and save to state
+            animationItem.playSegments(action.frames, true);
+            assignedSegment = action.frames;
+          } else {
+            // if playing any segments currently.
+            //check if segments in state are equal to the frames selected by action
+            if (assignedSegment !== action.frames) {
+              // if they are not equal. new segments are to be loaded
+              animationItem.playSegments(action.frames, true);
+              assignedSegment = action.frames;
+            } else if (animationItem.isPaused) {
+              // if they are equal the play method must be called only if lottie is paused
+              animationItem.playSegments(action.frames, true);
+              assignedSegment = action.frames;
+            }
+          }
+        }
+        if (action.type === "play" && animationItem.isPaused) {
+          // Play: Reset segments and continue playing full animation from current position
+          animationItem.resetSegments(true);
+          animationItem.play();
+        }
+        if (action.type === "stop") {
+          // Stop: Stop playback
+          animationItem.goToAndStop(action.frames[0] - animationItem.firstFrame - 1, true);
+        }
+      };
+      document.addEventListener("scroll", scrollHandler);
+      return function () {
+        document.removeEventListener("scroll", scrollHandler);
+      };
+    };
+    var cursorModeHandler = function cursorModeHandler() {
+      var handleCursor = function handleCursor(_x, _y) {
+        var x = _x;
+        var y = _y;
+        // Resolve cursor position if cursor is inside container
+        if (x !== -1 && y !== -1) {
+          // Get container cursor position
+          var pos = getContainerCursorPosition(wrapper, x, y);
+          // Use the resolved position
+          x = pos.x;
+          y = pos.y;
+        }
+        // Find the first action that satisfies the current position conditions
+        var action = actions.find(function (_ref3) {
+          var position = _ref3.position;
+          if (position && Array.isArray(position.x) && Array.isArray(position.y)) {
+            return x >= position.x[0] && x <= position.x[1] && y >= position.y[0] && y <= position.y[1];
+          }
+          if (position && !Number.isNaN(position.x) && !Number.isNaN(position.y)) {
+            return x === position.x && y === position.y;
+          }
+          return false;
+        });
+        // Skip if no matching action was found!
+        if (!action) {
+          return;
+        }
+        // Process action types:
+        if (action.type === "seek" && action.position && Array.isArray(action.position.x) && Array.isArray(action.position.y) && action.frames.length === 2) {
+          // Seek: Go to a frame based on player scroll position action
+          var xPercent = (x - action.position.x[0]) / (action.position.x[1] - action.position.x[0]);
+          var yPercent = (y - action.position.y[0]) / (action.position.y[1] - action.position.y[0]);
+          animationItem.playSegments(action.frames, true);
+          animationItem.goToAndStop(Math.ceil((xPercent + yPercent) / 2 * (action.frames[1] - action.frames[0])), true);
+        }
+        if (action.type === "loop") {
+          animationItem.playSegments(action.frames, true);
+        }
+        if (action.type === "play") {
+          // Play: Reset segments and continue playing full animation from current position
+          if (animationItem.isPaused) {
+            animationItem.resetSegments(false);
+          }
+          animationItem.playSegments(action.frames);
+        }
+        if (action.type === "stop") {
+          animationItem.goToAndStop(action.frames[0], true);
+        }
+      };
+      var mouseMoveHandler = function mouseMoveHandler(ev) {
+        handleCursor(ev.clientX, ev.clientY);
+      };
+      var mouseOutHandler = function mouseOutHandler() {
+        handleCursor(-1, -1);
+      };
+      wrapper.addEventListener("mousemove", mouseMoveHandler);
+      wrapper.addEventListener("mouseout", mouseOutHandler);
+      return function () {
+        wrapper.removeEventListener("mousemove", mouseMoveHandler);
+        wrapper.removeEventListener("mouseout", mouseOutHandler);
+      };
+    };
+    switch (mode) {
+      case "scroll":
+        return scrollModeHandler();
+      case "cursor":
+        return cursorModeHandler();
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [mode, animationItem]);
+};
+var useLottieInteractivity = function useLottieInteractivity(_ref4) {
+  var actions = _ref4.actions,
+    mode = _ref4.mode,
+    lottieObj = _ref4.lottieObj;
+  var animationItem = lottieObj.animationItem,
+    View = lottieObj.View,
+    animationContainerRef = lottieObj.animationContainerRef;
+  useInitInteractivity({
+    actions: actions,
+    animationItem: animationItem,
+    mode: mode,
+    wrapperRef: animationContainerRef
+  });
+  return View;
+};
+var _excluded = ["style", "interactivity"];
+var Lottie = function Lottie(props) {
+  var _a, _b, _c;
+  var style = props.style,
+    interactivity = props.interactivity,
+    lottieProps = _objectWithoutProperties(props, _excluded);
   /**
-   * Destroy animation
+   * Initialize the 'useLottie' hook
    */
-  var destroy = function destroy() {
-    var _a;
-    (_a = animationInstanceRef.current) === null || _a === void 0 ? void 0 : _a.destroy();
-    // Removing the reference to the animation so separate cleanups are skipped.
-    // Without it the internal `lottie-react` instance throws exceptions as it already cleared itself on destroy.
-    animationInstanceRef.current = undefined;
-  };
-  /*
-        ======================================
-            LOTTIE
-        ======================================
-     */
+  var _useLottie = useLottie(lottieProps, style),
+    View = _useLottie.View,
+    play = _useLottie.play,
+    stop = _useLottie.stop,
+    pause = _useLottie.pause,
+    setSpeed = _useLottie.setSpeed,
+    goToAndStop = _useLottie.goToAndStop,
+    goToAndPlay = _useLottie.goToAndPlay,
+    setDirection = _useLottie.setDirection,
+    playSegments = _useLottie.playSegments,
+    setSubframe = _useLottie.setSubframe,
+    getDuration = _useLottie.getDuration,
+    destroy = _useLottie.destroy,
+    animationContainerRef = _useLottie.animationContainerRef,
+    animationLoaded = _useLottie.animationLoaded,
+    animationItem = _useLottie.animationItem;
   /**
-   * Load a new animation, and if it's the case, destroy the previous one
-   * @param {Object} forcedConfigs
+   * Make the hook variables/methods available through the provided 'lottieRef'
    */
-  var loadAnimation = function loadAnimation() {
-    var forcedConfigs = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-    var _a;
-    // Return if the container ref is null
-    if (!animationContainer.current) {
-      return;
+  useEffect(function () {
+    if (props.lottieRef) {
+      props.lottieRef.current = {
+        play: play,
+        stop: stop,
+        pause: pause,
+        setSpeed: setSpeed,
+        goToAndPlay: goToAndPlay,
+        goToAndStop: goToAndStop,
+        setDirection: setDirection,
+        playSegments: playSegments,
+        setSubframe: setSubframe,
+        getDuration: getDuration,
+        destroy: destroy,
+        animationContainerRef: animationContainerRef,
+        animationLoaded: animationLoaded,
+        animationItem: animationItem
+      };
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [(_a = props.lottieRef) === null || _a === void 0 ? void 0 : _a.current]);
+  return useLottieInteractivity({
+    lottieObj: {
+      View: View,
+      play: play,
+      stop: stop,
+      pause: pause,
+      setSpeed: setSpeed,
+      goToAndStop: goToAndStop,
+      goToAndPlay: goToAndPlay,
+      setDirection: setDirection,
+      playSegments: playSegments,
+      setSubframe: setSubframe,
+      getDuration: getDuration,
+      destroy: destroy,
+      animationContainerRef: animationContainerRef,
+      animationLoaded: animationLoaded,
+      animationItem: animationItem
+    },
+    actions: (_b = interactivity === null || interactivity === void 0 ? void 0 : interactivity.actions) !== null && _b !== void 0 ? _b : [],
+    mode: (_c = interactivity === null || interactivity === void 0 ? void 0 : interactivity.mode) !== null && _c !== void 0 ? _c : "scroll"
+  });
+};
+
+var nm$1 = "calendar_lottie";
+var ddd$1 = 0;
+var h$1 = 16;
+var w$1 = 16;
+var meta = {
+	a: "Sadjad",
+	k: "calendar icon",
+	d: "calendar icon for you designed, enjoy",
+	g: "LottieFiles AE 0.1.20"
+};
+var layers$1 = [
+	{
+		ty: 3,
+		nm: "Null 1",
+		sr: 1,
+		st: 0,
+		op: 241,
+		ip: 0,
+		hd: false,
+		ddd: 0,
+		bm: 0,
+		hasMask: false,
+		ao: 0,
+		ks: {
+			a: {
+				a: 0,
+				k: [
+					0,
+					50,
+					0
+				],
+				ix: 1
+			},
+			s: {
+				a: 1,
+				k: [
+					{
+						o: {
+							x: 0.89,
+							y: 0
+						},
+						i: {
+							x: 0.11,
+							y: 1
+						},
+						s: [
+							6.4,
+							6.4,
+							100
+						],
+						t: 8
+					},
+					{
+						o: {
+							x: 0.89,
+							y: 0
+						},
+						i: {
+							x: 0.11,
+							y: 1
+						},
+						s: [
+							5.12,
+							5.12,
+							100
+						],
+						t: 14
+					},
+					{
+						o: {
+							x: 0.89,
+							y: 0
+						},
+						i: {
+							x: 0.11,
+							y: 1
+						},
+						s: [
+							5.12,
+							5.12,
+							100
+						],
+						t: 31
+					},
+					{
+						s: [
+							6.4,
+							6.4,
+							100
+						],
+						t: 36
+					}
+				],
+				ix: 6
+			},
+			sk: {
+				a: 0,
+				k: 0
+			},
+			p: {
+				a: 0,
+				k: [
+					8,
+					11.2,
+					0
+				],
+				ix: 2
+			},
+			r: {
+				a: 0,
+				k: 0,
+				ix: 10
+			},
+			sa: {
+				a: 0,
+				k: 0
+			},
+			o: {
+				a: 0,
+				k: 0,
+				ix: 11
+			}
+		},
+		ef: [
+		],
+		ind: 1
+	},
+	{
+		ty: 4,
+		nm: "pin Outlines",
+		sr: 1,
+		st: 0,
+		op: 241,
+		ip: 0,
+		hd: false,
+		ddd: 0,
+		bm: 0,
+		hasMask: false,
+		ao: 0,
+		ks: {
+			a: {
+				a: 0,
+				k: [
+					39.833,
+					23.166,
+					0
+				],
+				ix: 1
+			},
+			s: {
+				a: 0,
+				k: [
+					100,
+					100,
+					100
+				],
+				ix: 6
+			},
+			sk: {
+				a: 0,
+				k: 0
+			},
+			p: {
+				a: 0,
+				k: [
+					0,
+					-66.667,
+					0
+				],
+				ix: 2
+			},
+			r: {
+				a: 0,
+				k: 0,
+				ix: 10
+			},
+			sa: {
+				a: 0,
+				k: 0
+			},
+			o: {
+				a: 0,
+				k: 100,
+				ix: 11
+			}
+		},
+		ef: [
+		],
+		shapes: [
+			{
+				ty: "gr",
+				bm: 0,
+				hd: false,
+				mn: "ADBE Vector Group",
+				nm: "Group 1",
+				ix: 1,
+				cix: 2,
+				np: 2,
+				it: [
+					{
+						ty: "sh",
+						bm: 0,
+						hd: false,
+						mn: "ADBE Vector Shape - Group",
+						nm: "Path 1",
+						ix: 1,
+						d: 1,
+						ks: {
+							a: 0,
+							k: {
+								c: false,
+								i: [
+									[
+										0,
+										0
+									],
+									[
+										0,
+										0
+									]
+								],
+								o: [
+									[
+										0,
+										0
+									],
+									[
+										0,
+										0
+									]
+								],
+								v: [
+									[
+										73.166,
+										6.5
+									],
+									[
+										73.166,
+										39.833
+									]
+								]
+							},
+							ix: 2
+						}
+					},
+					{
+						ty: "st",
+						bm: 0,
+						hd: false,
+						mn: "ADBE Vector Graphic - Stroke",
+						nm: "Stroke 1",
+						lc: 2,
+						lj: 2,
+						ml: 1,
+						o: {
+							a: 0,
+							k: 100,
+							ix: 4
+						},
+						w: {
+							a: 0,
+							k: 13,
+							ix: 5
+						},
+						c: {
+							a: 0,
+							k: [
+								0.0235,
+								0.4039,
+								0.4078
+							],
+							ix: 3
+						}
+					},
+					{
+						ty: "tr",
+						a: {
+							a: 0,
+							k: [
+								0,
+								0
+							],
+							ix: 1
+						},
+						s: {
+							a: 0,
+							k: [
+								100,
+								100
+							],
+							ix: 3
+						},
+						sk: {
+							a: 0,
+							k: 0,
+							ix: 4
+						},
+						p: {
+							a: 0,
+							k: [
+								0,
+								0
+							],
+							ix: 2
+						},
+						r: {
+							a: 0,
+							k: 0,
+							ix: 6
+						},
+						sa: {
+							a: 0,
+							k: 0,
+							ix: 5
+						},
+						o: {
+							a: 0,
+							k: 100,
+							ix: 7
+						}
+					}
+				]
+			},
+			{
+				ty: "gr",
+				bm: 0,
+				hd: false,
+				mn: "ADBE Vector Group",
+				nm: "Group 2",
+				ix: 2,
+				cix: 2,
+				np: 2,
+				it: [
+					{
+						ty: "sh",
+						bm: 0,
+						hd: false,
+						mn: "ADBE Vector Shape - Group",
+						nm: "Path 1",
+						ix: 1,
+						d: 1,
+						ks: {
+							a: 0,
+							k: {
+								c: false,
+								i: [
+									[
+										0,
+										0
+									],
+									[
+										0,
+										0
+									]
+								],
+								o: [
+									[
+										0,
+										0
+									],
+									[
+										0,
+										0
+									]
+								],
+								v: [
+									[
+										6.5,
+										6.5
+									],
+									[
+										6.5,
+										39.833
+									]
+								]
+							},
+							ix: 2
+						}
+					},
+					{
+						ty: "st",
+						bm: 0,
+						hd: false,
+						mn: "ADBE Vector Graphic - Stroke",
+						nm: "Stroke 1",
+						lc: 2,
+						lj: 2,
+						ml: 1,
+						o: {
+							a: 0,
+							k: 100,
+							ix: 4
+						},
+						w: {
+							a: 0,
+							k: 13,
+							ix: 5
+						},
+						c: {
+							a: 0,
+							k: [
+								0.0235,
+								0.4039,
+								0.4078
+							],
+							ix: 3
+						}
+					},
+					{
+						ty: "tr",
+						a: {
+							a: 0,
+							k: [
+								0,
+								0
+							],
+							ix: 1
+						},
+						s: {
+							a: 0,
+							k: [
+								100,
+								100
+							],
+							ix: 3
+						},
+						sk: {
+							a: 0,
+							k: 0,
+							ix: 4
+						},
+						p: {
+							a: 0,
+							k: [
+								0,
+								0
+							],
+							ix: 2
+						},
+						r: {
+							a: 0,
+							k: 0,
+							ix: 6
+						},
+						sa: {
+							a: 0,
+							k: 0,
+							ix: 5
+						},
+						o: {
+							a: 0,
+							k: 100,
+							ix: 7
+						}
+					}
+				]
+			}
+		],
+		ind: 2,
+		parent: 1
+	},
+	{
+		ty: 4,
+		nm: "line Outlines",
+		sr: 1,
+		st: 0,
+		op: 241,
+		ip: 0,
+		hd: false,
+		ddd: 0,
+		bm: 0,
+		hasMask: false,
+		ao: 0,
+		ks: {
+			a: {
+				a: 0,
+				k: [
+					81.5,
+					6.5,
+					0
+				],
+				ix: 1
+			},
+			s: {
+				a: 0,
+				k: [
+					100,
+					100,
+					100
+				],
+				ix: 6
+			},
+			sk: {
+				a: 0,
+				k: 0
+			},
+			p: {
+				a: 1,
+				k: [
+					{
+						o: {
+							x: 0.66,
+							y: 0
+						},
+						i: {
+							x: 0.34,
+							y: 1
+						},
+						s: [
+							0,
+							-16.667,
+							0
+						],
+						t: 8,
+						ti: [
+							0,
+							8.333,
+							0
+						],
+						to: [
+							0,
+							-14.667,
+							0
+						]
+					},
+					{
+						o: {
+							x: 0.66,
+							y: 0
+						},
+						i: {
+							x: 0.34,
+							y: 1
+						},
+						s: [
+							0,
+							-104.667,
+							0
+						],
+						t: 23,
+						ti: [
+							0,
+							-6.333,
+							0
+						],
+						to: [
+							0,
+							-8.333,
+							0
+						]
+					},
+					{
+						s: [
+							0,
+							-66.667,
+							0
+						],
+						t: 36
+					}
+				],
+				ix: 2
+			},
+			r: {
+				a: 0,
+				k: 0,
+				ix: 10
+			},
+			sa: {
+				a: 0,
+				k: 0
+			},
+			o: {
+				a: 0,
+				k: 100,
+				ix: 11
+			}
+		},
+		ef: [
+		],
+		shapes: [
+			{
+				ty: "gr",
+				bm: 0,
+				hd: false,
+				mn: "ADBE Vector Group",
+				nm: "Group 1",
+				ix: 1,
+				cix: 2,
+				np: 2,
+				it: [
+					{
+						ty: "sh",
+						bm: 0,
+						hd: false,
+						mn: "ADBE Vector Shape - Group",
+						nm: "Path 1",
+						ix: 1,
+						d: 1,
+						ks: {
+							a: 1,
+							k: [
+								{
+									o: {
+										x: 0.66,
+										y: 0
+									},
+									i: {
+										x: 0.34,
+										y: 1
+									},
+									s: [
+										{
+											c: false,
+											i: [
+												[
+													0,
+													0
+												],
+												[
+													0,
+													0
+												]
+											],
+											o: [
+												[
+													0,
+													0
+												],
+												[
+													0,
+													0
+												]
+											],
+											v: [
+												[
+													6.5,
+													6.5
+												],
+												[
+													156.5,
+													6.5
+												]
+											]
+										}
+									],
+									t: 8
+								},
+								{
+									o: {
+										x: 0.66,
+										y: 0
+									},
+									i: {
+										x: 0.34,
+										y: 1
+									},
+									s: [
+										{
+											c: false,
+											i: [
+												[
+													0,
+													0
+												],
+												[
+													0,
+													0
+												]
+											],
+											o: [
+												[
+													0,
+													0
+												],
+												[
+													0,
+													0
+												]
+											],
+											v: [
+												[
+													6.5,
+													6.5
+												],
+												[
+													156.5,
+													6.5
+												]
+											]
+										}
+									],
+									t: 30
+								},
+								{
+									s: [
+										{
+											c: false,
+											i: [
+												[
+													0,
+													0
+												],
+												[
+													0,
+													0
+												]
+											],
+											o: [
+												[
+													0,
+													0
+												],
+												[
+													0,
+													0
+												]
+											],
+											v: [
+												[
+													20.5,
+													6.583
+												],
+												[
+													141,
+													6.583
+												]
+											]
+										}
+									],
+									t: 36
+								}
+							],
+							ix: 2
+						}
+					},
+					{
+						ty: "st",
+						bm: 0,
+						hd: false,
+						mn: "ADBE Vector Graphic - Stroke",
+						nm: "Stroke 1",
+						lc: 2,
+						lj: 2,
+						ml: 1,
+						o: {
+							a: 0,
+							k: 100,
+							ix: 4
+						},
+						w: {
+							a: 0,
+							k: 13,
+							ix: 5
+						},
+						c: {
+							a: 0,
+							k: [
+								0.0235,
+								0.4039,
+								0.4078
+							],
+							ix: 3
+						}
+					},
+					{
+						ty: "tr",
+						a: {
+							a: 0,
+							k: [
+								0,
+								0
+							],
+							ix: 1
+						},
+						s: {
+							a: 0,
+							k: [
+								100,
+								100
+							],
+							ix: 3
+						},
+						sk: {
+							a: 0,
+							k: 0,
+							ix: 4
+						},
+						p: {
+							a: 0,
+							k: [
+								0,
+								0
+							],
+							ix: 2
+						},
+						r: {
+							a: 0,
+							k: 0,
+							ix: 6
+						},
+						sa: {
+							a: 0,
+							k: 0,
+							ix: 5
+						},
+						o: {
+							a: 0,
+							k: 100,
+							ix: 7
+						}
+					}
+				]
+			}
+		],
+		ind: 3,
+		parent: 1
+	},
+	{
+		ty: 4,
+		nm: "line Outlines 2",
+		sr: 1,
+		st: 0,
+		op: 241,
+		ip: 0,
+		hd: false,
+		ddd: 0,
+		bm: 0,
+		hasMask: false,
+		ao: 0,
+		ks: {
+			a: {
+				a: 0,
+				k: [
+					81.5,
+					6.5,
+					0
+				],
+				ix: 1
+			},
+			s: {
+				a: 0,
+				k: [
+					100,
+					100,
+					100
+				],
+				ix: 6
+			},
+			sk: {
+				a: 0,
+				k: 0
+			},
+			p: {
+				a: 0,
+				k: [
+					0,
+					-16.667,
+					0
+				],
+				ix: 2
+			},
+			r: {
+				a: 0,
+				k: 0,
+				ix: 10
+			},
+			sa: {
+				a: 0,
+				k: 0
+			},
+			o: {
+				a: 1,
+				k: [
+					{
+						o: {
+							x: 0.167,
+							y: 0.167
+						},
+						i: {
+							x: 0.833,
+							y: 0.833
+						},
+						s: [
+							0
+						],
+						t: 14
+					},
+					{
+						s: [
+							100
+						],
+						t: 15
+					}
+				],
+				ix: 11
+			}
+		},
+		ef: [
+		],
+		shapes: [
+			{
+				ty: "gr",
+				bm: 0,
+				hd: false,
+				mn: "ADBE Vector Group",
+				nm: "Group 1",
+				ix: 1,
+				cix: 2,
+				np: 2,
+				it: [
+					{
+						ty: "sh",
+						bm: 0,
+						hd: false,
+						mn: "ADBE Vector Shape - Group",
+						nm: "Path 1",
+						ix: 1,
+						d: 1,
+						ks: {
+							a: 0,
+							k: {
+								c: false,
+								i: [
+									[
+										0,
+										0
+									],
+									[
+										0,
+										0
+									]
+								],
+								o: [
+									[
+										0,
+										0
+									],
+									[
+										0,
+										0
+									]
+								],
+								v: [
+									[
+										6.5,
+										6.5
+									],
+									[
+										156.5,
+										6.5
+									]
+								]
+							},
+							ix: 2
+						}
+					},
+					{
+						ty: "st",
+						bm: 0,
+						hd: false,
+						mn: "ADBE Vector Graphic - Stroke",
+						nm: "Stroke 1",
+						lc: 2,
+						lj: 2,
+						ml: 1,
+						o: {
+							a: 0,
+							k: 100,
+							ix: 4
+						},
+						w: {
+							a: 0,
+							k: 13,
+							ix: 5
+						},
+						c: {
+							a: 0,
+							k: [
+								0.0235,
+								0.4039,
+								0.4078
+							],
+							ix: 3
+						}
+					},
+					{
+						ty: "tr",
+						a: {
+							a: 0,
+							k: [
+								0,
+								0
+							],
+							ix: 1
+						},
+						s: {
+							a: 0,
+							k: [
+								100,
+								100
+							],
+							ix: 3
+						},
+						sk: {
+							a: 0,
+							k: 0,
+							ix: 4
+						},
+						p: {
+							a: 0,
+							k: [
+								0,
+								0
+							],
+							ix: 2
+						},
+						r: {
+							a: 0,
+							k: 0,
+							ix: 6
+						},
+						sa: {
+							a: 0,
+							k: 0,
+							ix: 5
+						},
+						o: {
+							a: 0,
+							k: 100,
+							ix: 7
+						}
+					}
+				]
+			}
+		],
+		ind: 4,
+		parent: 1
+	},
+	{
+		ty: 4,
+		nm: "page02 Outlines",
+		sr: 1,
+		st: 0,
+		op: 70,
+		ip: 0,
+		hd: false,
+		ddd: 0,
+		bm: 0,
+		hasMask: false,
+		ao: 0,
+		ks: {
+			a: {
+				a: 0,
+				k: [
+					88,
+					13,
+					0
+				],
+				ix: 1
+			},
+			s: {
+				a: 0,
+				k: [
+					100,
+					100,
+					100
+				],
+				ix: 6
+			},
+			sk: {
+				a: 0,
+				k: 0
+			},
+			p: {
+				a: 0,
+				k: [
+					-0.001,
+					-66.667,
+					0
+				],
+				ix: 2
+			},
+			r: {
+				a: 0,
+				k: 180,
+				ix: 10
+			},
+			sa: {
+				a: 0,
+				k: 0
+			},
+			o: {
+				a: 0,
+				k: 100,
+				ix: 11
+			}
+		},
+		ef: [
+		],
+		shapes: [
+			{
+				ty: "gr",
+				bm: 0,
+				hd: false,
+				mn: "ADBE Vector Group",
+				nm: "Group 1",
+				ix: 1,
+				cix: 2,
+				np: 2,
+				it: [
+					{
+						ty: "sh",
+						bm: 0,
+						hd: false,
+						mn: "ADBE Vector Shape - Group",
+						nm: "Path 1",
+						ix: 1,
+						d: 1,
+						ks: {
+							a: 1,
+							k: [
+								{
+									o: {
+										x: 0.66,
+										y: 0
+									},
+									i: {
+										x: 0.34,
+										y: 1
+									},
+									s: [
+										{
+											c: true,
+											i: [
+												[
+													-9.205,
+													0
+												],
+												[
+													0,
+													0
+												],
+												[
+													0.499,
+													12.166
+												],
+												[
+													0,
+													0
+												],
+												[
+													9.205,
+													0
+												],
+												[
+													0,
+													0
+												],
+												[
+													-0.673,
+													-8
+												],
+												[
+													0,
+													0
+												]
+											],
+											o: [
+												[
+													0,
+													0
+												],
+												[
+													9.205,
+													0
+												],
+												[
+													0,
+													0
+												],
+												[
+													-0.673,
+													-6
+												],
+												[
+													0,
+													0
+												],
+												[
+													-9.205,
+													0
+												],
+												[
+													0,
+													0
+												],
+												[
+													-0.001,
+													13.166
+												]
+											],
+											v: [
+												[
+													-58.333,
+													-75
+												],
+												[
+													58.334,
+													-75
+												],
+												[
+													75.001,
+													-89.833
+												],
+												[
+													75.173,
+													-210.167
+												],
+												[
+													58.514,
+													-225
+												],
+												[
+													-58.32,
+													-225
+												],
+												[
+													-74.827,
+													-210.167
+												],
+												[
+													-74.999,
+													-92.833
+												]
+											]
+										}
+									],
+									t: 8
+								},
+								{
+									o: {
+										x: 0.66,
+										y: 0
+									},
+									i: {
+										x: 0.34,
+										y: 1
+									},
+									s: [
+										{
+											c: true,
+											i: [
+												[
+													-9.205,
+													0
+												],
+												[
+													0,
+													0
+												],
+												[
+													0,
+													-9.205
+												],
+												[
+													0,
+													0
+												],
+												[
+													9.205,
+													0
+												],
+												[
+													0,
+													0
+												],
+												[
+													0,
+													9.205
+												],
+												[
+													0,
+													0
+												]
+											],
+											o: [
+												[
+													0,
+													0
+												],
+												[
+													9.205,
+													0
+												],
+												[
+													0,
+													0
+												],
+												[
+													0,
+													9.205
+												],
+												[
+													0,
+													0
+												],
+												[
+													-9.205,
+													0
+												],
+												[
+													0,
+													0
+												],
+												[
+													0,
+													-9.205
+												]
+											],
+											v: [
+												[
+													-58.333,
+													-75
+												],
+												[
+													58.334,
+													-75
+												],
+												[
+													75,
+													-58.333
+												],
+												[
+													74.754,
+													-11.417
+												],
+												[
+													58.088,
+													5.25
+												],
+												[
+													-58.579,
+													5.25
+												],
+												[
+													-75.246,
+													-11.417
+												],
+												[
+													-75,
+													-58.333
+												]
+											]
+										}
+									],
+									t: 23
+								},
+								{
+									s: [
+										{
+											c: true,
+											i: [
+												[
+													-9.205,
+													0
+												],
+												[
+													0,
+													0
+												],
+												[
+													-1.001,
+													7.166
+												],
+												[
+													0,
+													0
+												],
+												[
+													11.663,
+													-0.292
+												],
+												[
+													0,
+													0
+												],
+												[
+													0.119,
+													14.876
+												],
+												[
+													0,
+													0
+												]
+											],
+											o: [
+												[
+													0,
+													0
+												],
+												[
+													8.29,
+													-0.667
+												],
+												[
+													0,
+													0
+												],
+												[
+													-0.003,
+													12.251
+												],
+												[
+													0,
+													0
+												],
+												[
+													-13.295,
+													-1.792
+												],
+												[
+													0,
+													0
+												],
+												[
+													0.996,
+													5.541
+												]
+											],
+											v: [
+												[
+													-58.333,
+													-75
+												],
+												[
+													58.334,
+													-75
+												],
+												[
+													73.876,
+													-88.333
+												],
+												[
+													74.503,
+													-91.667
+												],
+												[
+													57.837,
+													-75
+												],
+												[
+													-58.83,
+													-75
+												],
+												[
+													-75.494,
+													-96.167
+												],
+												[
+													-74.621,
+													-86.333
+												]
+											]
+										}
+									],
+									t: 36
+								}
+							],
+							ix: 2
+						}
+					},
+					{
+						ty: "st",
+						bm: 0,
+						hd: false,
+						mn: "ADBE Vector Graphic - Stroke",
+						nm: "Stroke 1",
+						lc: 2,
+						lj: 2,
+						ml: 1,
+						o: {
+							a: 0,
+							k: 100,
+							ix: 4
+						},
+						w: {
+							a: 0,
+							k: 13,
+							ix: 5
+						},
+						c: {
+							a: 0,
+							k: [
+								0.0235,
+								0.4039,
+								0.4078
+							],
+							ix: 3
+						}
+					},
+					{
+						ty: "tr",
+						a: {
+							a: 0,
+							k: [
+								0,
+								0
+							],
+							ix: 1
+						},
+						s: {
+							a: 0,
+							k: [
+								100,
+								100
+							],
+							ix: 3
+						},
+						sk: {
+							a: 0,
+							k: 0,
+							ix: 4
+						},
+						p: {
+							a: 0,
+							k: [
+								88,
+								88
+							],
+							ix: 2
+						},
+						r: {
+							a: 0,
+							k: 0,
+							ix: 6
+						},
+						sa: {
+							a: 0,
+							k: 0,
+							ix: 5
+						},
+						o: {
+							a: 0,
+							k: 100,
+							ix: 7
+						}
+					}
+				]
+			}
+		],
+		ind: 5,
+		parent: 1
+	},
+	{
+		ty: 4,
+		nm: "page01 Outlines",
+		sr: 1,
+		st: 0,
+		op: 241,
+		ip: 0,
+		hd: false,
+		ddd: 0,
+		bm: 0,
+		hasMask: false,
+		ao: 0,
+		ks: {
+			a: {
+				a: 0,
+				k: [
+					88,
+					88,
+					0
+				],
+				ix: 1
+			},
+			s: {
+				a: 0,
+				k: [
+					100,
+					100,
+					100
+				],
+				ix: 6
+			},
+			sk: {
+				a: 0,
+				k: 0
+			},
+			p: {
+				a: 0,
+				k: [
+					-0.001,
+					8.333,
+					0
+				],
+				ix: 2
+			},
+			r: {
+				a: 0,
+				k: 0,
+				ix: 10
+			},
+			sa: {
+				a: 0,
+				k: 0
+			},
+			o: {
+				a: 0,
+				k: 100,
+				ix: 11
+			}
+		},
+		ef: [
+		],
+		shapes: [
+			{
+				ty: "gr",
+				bm: 0,
+				hd: false,
+				mn: "ADBE Vector Group",
+				nm: "Group 1",
+				ix: 1,
+				cix: 2,
+				np: 2,
+				it: [
+					{
+						ty: "sh",
+						bm: 0,
+						hd: false,
+						mn: "ADBE Vector Shape - Group",
+						nm: "Path 1",
+						ix: 1,
+						d: 1,
+						ks: {
+							a: 0,
+							k: {
+								c: true,
+								i: [
+									[
+										-9.205,
+										0
+									],
+									[
+										0,
+										0
+									],
+									[
+										0,
+										-9.205
+									],
+									[
+										0,
+										0
+									],
+									[
+										9.205,
+										0
+									],
+									[
+										0,
+										0
+									],
+									[
+										0,
+										9.205
+									],
+									[
+										0,
+										0
+									]
+								],
+								o: [
+									[
+										0,
+										0
+									],
+									[
+										9.205,
+										0
+									],
+									[
+										0,
+										0
+									],
+									[
+										0,
+										9.205
+									],
+									[
+										0,
+										0
+									],
+									[
+										-9.205,
+										0
+									],
+									[
+										0,
+										0
+									],
+									[
+										0,
+										-9.205
+									]
+								],
+								v: [
+									[
+										-58.333,
+										-75
+									],
+									[
+										58.334,
+										-75
+									],
+									[
+										75,
+										-58.333
+									],
+									[
+										75,
+										58.333
+									],
+									[
+										58.334,
+										75
+									],
+									[
+										-58.333,
+										75
+									],
+									[
+										-75,
+										58.333
+									],
+									[
+										-75,
+										-58.333
+									]
+								]
+							},
+							ix: 2
+						}
+					},
+					{
+						ty: "st",
+						bm: 0,
+						hd: false,
+						mn: "ADBE Vector Graphic - Stroke",
+						nm: "Stroke 1",
+						lc: 2,
+						lj: 2,
+						ml: 1,
+						o: {
+							a: 0,
+							k: 100,
+							ix: 4
+						},
+						w: {
+							a: 0,
+							k: 13,
+							ix: 5
+						},
+						c: {
+							a: 0,
+							k: [
+								0.0235,
+								0.4039,
+								0.4078
+							],
+							ix: 3
+						}
+					},
+					{
+						ty: "tr",
+						a: {
+							a: 0,
+							k: [
+								0,
+								0
+							],
+							ix: 1
+						},
+						s: {
+							a: 0,
+							k: [
+								100,
+								100
+							],
+							ix: 3
+						},
+						sk: {
+							a: 0,
+							k: 0,
+							ix: 4
+						},
+						p: {
+							a: 0,
+							k: [
+								88,
+								88
+							],
+							ix: 2
+						},
+						r: {
+							a: 0,
+							k: 0,
+							ix: 6
+						},
+						sa: {
+							a: 0,
+							k: 0,
+							ix: 5
+						},
+						o: {
+							a: 0,
+							k: 100,
+							ix: 7
+						}
+					}
+				]
+			}
+		],
+		ind: 6,
+		parent: 1
+	}
+];
+var v$1 = "5.5.7";
+var fr$1 = 45;
+var op$1 = 41;
+var ip$1 = 0;
+var assets$1 = [
+];
+var LoadingAnimation = {
+	nm: nm$1,
+	ddd: ddd$1,
+	h: h$1,
+	w: w$1,
+	meta: meta,
+	layers: layers$1,
+	v: v$1,
+	fr: fr$1,
+	op: op$1,
+	ip: ip$1,
+	assets: assets$1
+};
+
+// TableFooter.styles.js
+const FooterWrapper = styled.div`
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 15px 20px 15px 15px;
+    gap: 16px;
+`;
+const FooterLabel = styled.span`
+    font-size: 14px;
+    font-weight: 400;
+    color: #8B8989;
+    white-space: nowrap;
+    font-family: 'Poppins', sans-serif;
+`;
+const FooterLabelBold = styled.span`
+    font-size: 14px;
+    font-weight: 600;
+    color: #8B8989;
+    font-family: 'Poppins', sans-serif;
+`;
+const FooterLoadingGroup = styled.div`
+    display: flex;
+    align-items: center;
+    gap: 8px;
+`;
+const FooterLottieWrapper = styled.div`
+    width: 16px;
+    height: 16px;
+    display: flex;
+    align-items: center;
+`;
+const FooterProgressTrack = styled.div`
+    width: 160px;
+    height: 6px;
+    background-color: #F2F2F2;
+    border-radius: 12px;
+    flex-shrink: 0;
+`;
+const FooterProgressFill = styled.div`
+    height: 100%;
+    width: ${props => props.percent}%;
+    background: #066768;
+    border-radius: 12px;
+    transition: width 0.3s ease-in-out;
+`;
+
+// TableFooter.jsx
+const TableFooter = ({
+  visibleFirst,
+  visibleLast,
+  total,
+  rowLabel,
+  isLoading,
+  isLoadingText
+}) => {
+  if (total <= 0) return null;
+  return /*#__PURE__*/React$1.createElement(FooterWrapper, null, /*#__PURE__*/React$1.createElement(FooterLabel, null, "Rows ", /*#__PURE__*/React$1.createElement(FooterLabelBold, null, visibleFirst, "\u2013", visibleLast), " of ", /*#__PURE__*/React$1.createElement(FooterLabelBold, null, total), rowLabel ? ` ${rowLabel}` : ""), isLoading && /*#__PURE__*/React$1.createElement(FooterLoadingGroup, null, /*#__PURE__*/React$1.createElement(FooterLottieWrapper, null, /*#__PURE__*/React$1.createElement(Lottie, {
+    animationData: LoadingAnimation,
+    loop: true
+  })), /*#__PURE__*/React$1.createElement(FooterLabel, null, isLoadingText || "Loading...")), /*#__PURE__*/React$1.createElement(FooterProgressTrack, null, /*#__PURE__*/React$1.createElement(FooterProgressFill, {
+    percent: Math.round(visibleLast / total * 100)
+  })));
+};
+
+/**
+ * Return an array of <tr> DOM elements that represent *data rows* only.
+ *
+ * We intentionally cache the actual DOM nodes (not row IDs / not data objects),
+ * because the scroll-time work needs to measure row positions efficiently via
+ * getBoundingClientRect().
+ *
+ * Expanded content rows are excluded. In our table, an expanded row is a
+ * "detail-only" row rendered as a single <td colSpan="...">, and it should not
+ * be counted as a real data row for "visible rows" calculations.
+ */
+const buildDataRowsCache = scrollEl => {
+  const allRows = Array.from(scrollEl.querySelectorAll("tbody tr"));
+  return allRows.filter(row => !row.querySelector("td[colspan]"));
+};
+
+/**
+ * Given the cached data-row <tr> elements, compute which 1-based row indices
+ * overlap the scroll container’s visible viewport.
+ *
+ * This runs during scrolling, so it avoids DOM queries and only reads layout
+ * (getBoundingClientRect).
+ */
+const getVisibleRowRange = (scrollEl, cachedDataRows) => {
+  if (cachedDataRows.length === 0) return {
+    first: 1,
+    last: 0
+  };
+  const containerRect = scrollEl.getBoundingClientRect();
+  let first = null;
+  let last = null;
+  cachedDataRows.forEach((row, index) => {
+    const rect = row.getBoundingClientRect();
+
+    // "Visible" here means the row overlaps the container viewport.
+    if (rect.bottom > containerRect.top && rect.top < containerRect.bottom) {
+      if (first === null) first = index + 1; // 1-based row number
+      last = index + 1;
     }
-    // Destroy any previous instance
-    (_a = animationInstanceRef.current) === null || _a === void 0 ? void 0 : _a.destroy();
-    // Build the animation configuration
-    var config = _objectSpread2(_objectSpread2(_objectSpread2({}, props), forcedConfigs), {}, {
-      container: animationContainer.current
-    });
-    // Save the animation instance
-    animationInstanceRef.current = lottie.loadAnimation(config);
-    setAnimationLoaded(!!animationInstanceRef.current);
-    // Return a function that will clean up
-    return function () {
-      var _a;
-      (_a = animationInstanceRef.current) === null || _a === void 0 ? void 0 : _a.destroy();
-      animationInstanceRef.current = undefined;
-    };
+  });
+  return {
+    first: first !== null ? first : 1,
+    last: last !== null ? last : 0
   };
-  /**
-   * (Re)Initialize when animation data changed
+};
+const useVisibleRows = ({
+  scrollWrapperRef,
+  dataLength,
+  showFooter,
+  expandedRows
+}) => {
+  // 1-based indices for UI display, e.g. "Showing 21–40"
+  const [visibleFirst, setVisibleFirst] = useState(1);
+  const [visibleLast, setVisibleLast] = useState(0);
+
+  /**
+   * Cache of <tr> DOM elements for data rows only.
+   * This prevents repeated DOM querying during scroll.
    */
-  useEffect(function () {
-    var onUnmount = loadAnimation();
-    // Clean up on unmount
-    return function () {
-      return onUnmount === null || onUnmount === void 0 ? void 0 : onUnmount();
-    };
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [animationData, loop]);
-  // Update the autoplay state
-  useEffect(function () {
-    if (!animationInstanceRef.current) {
-      return;
-    }
-    animationInstanceRef.current.autoplay = !!autoplay;
-  }, [autoplay]);
-  // Update the initial segment state
-  useEffect(function () {
-    if (!animationInstanceRef.current) {
-      return;
-    }
-    // When null should reset to default animation length
-    if (!initialSegment) {
-      animationInstanceRef.current.resetSegments(true);
-      return;
-    }
-    // If it's not a valid segment, do nothing
-    if (!Array.isArray(initialSegment) || !initialSegment.length) {
+  const dataRowsRef = useRef([]);
+  const updateVisibleRows = el => {
+    // Keep footer state consistent when the table becomes empty.
+    if (dataLength === 0) {
+      setVisibleFirst(1);
+      setVisibleLast(0);
       return;
     }
-    // If the current position it's not in the new segment
-    // set the current position to start
-    if (animationInstanceRef.current.currentRawFrame < initialSegment[0] || animationInstanceRef.current.currentRawFrame > initialSegment[1]) {
-      animationInstanceRef.current.currentRawFrame = initialSegment[0];
-    }
-    // Update the segment
-    animationInstanceRef.current.setSegment(initialSegment[0], initialSegment[1]);
-  }, [initialSegment]);
-  /*
-        ======================================
-            EVENTS
-        ======================================
-     */
-  /**
-   * Reinitialize listener on change
+    const {
+      first,
+      last
+    } = getVisibleRowRange(el, dataRowsRef.current);
+    setVisibleFirst(first);
+    setVisibleLast(last);
+  };
+
+  /**
+   * Scroll listener: updates visible row range.
+   *
+   * We throttle to one update per animation frame using requestAnimationFrame,
+   * which keeps scrolling smooth.
+   *
+   * Note: expandedRows is NOT a dependency here. When expansion changes, we
+   * rebuild the cached rows in useLayoutEffect below, and the scroll handler
+   * always reads the latest cache from dataRowsRef.current.
    */
-  useEffect(function () {
-    var partialListeners = [{
-      name: "complete",
-      handler: onComplete
-    }, {
-      name: "loopComplete",
-      handler: onLoopComplete
-    }, {
-      name: "enterFrame",
-      handler: onEnterFrame
-    }, {
-      name: "segmentStart",
-      handler: onSegmentStart
-    }, {
-      name: "config_ready",
-      handler: onConfigReady
-    }, {
-      name: "data_ready",
-      handler: onDataReady
-    }, {
-      name: "data_failed",
-      handler: onDataFailed
-    }, {
-      name: "loaded_images",
-      handler: onLoadedImages
-    }, {
-      name: "DOMLoaded",
-      handler: onDOMLoaded
-    }, {
-      name: "destroy",
-      handler: onDestroy
-    }];
-    var listeners = partialListeners.filter(function (listener) {
-      return listener.handler != null;
-    });
-    if (!listeners.length) {
-      return;
-    }
-    var deregisterList = listeners.map(
-    /**
-     * Handle the process of adding an event listener
-     * @param {Listener} listener
-     * @return {Function} Function that deregister the listener
-     */
-    function (listener) {
-      var _a;
-      (_a = animationInstanceRef.current) === null || _a === void 0 ? void 0 : _a.addEventListener(listener.name, listener.handler);
-      // Return a function to deregister this listener
-      return function () {
-        var _a;
-        (_a = animationInstanceRef.current) === null || _a === void 0 ? void 0 : _a.removeEventListener(listener.name, listener.handler);
-      };
-    });
-    // Deregister listeners on unmount
-    return function () {
-      deregisterList.forEach(function (deregister) {
-        return deregister();
+  useEffect(() => {
+    if (!showFooter) return;
+    const scrollWrapper = scrollWrapperRef.current;
+    if (!scrollWrapper) return;
+    let rafId = null;
+    const handleScrollWithRAF = () => {
+      if (rafId) return;
+      rafId = requestAnimationFrame(() => {
+        // Use the same element we attached the listener to.
+        updateVisibleRows(scrollWrapper);
+        rafId = null;
       });
     };
-  }, [onComplete, onLoopComplete, onEnterFrame, onSegmentStart, onConfigReady, onDataReady, onDataFailed, onLoadedImages, onDOMLoaded, onDestroy]);
-  /**
-   * Build the animation view
+    scrollWrapper.addEventListener("scroll", handleScrollWithRAF);
+    return () => {
+      scrollWrapper.removeEventListener("scroll", handleScrollWithRAF);
+      if (rafId) cancelAnimationFrame(rafId);
+    };
+  }, [showFooter, dataLength]);
+
+  /**
+   * Rebuild the cached list of data-row <tr> elements whenever the table
+   * structure changes:
+   * - new data loaded
+   * - row expanded/collapsed
+   * - footer enabled/disabled
+   *
+   * useLayoutEffect runs after DOM updates but before paint, so our cached rows
+   * and the computed visible range stay in sync with the latest layout.
    */
-  var View = /*#__PURE__*/React$1.createElement("div", _objectSpread2({
-    style: style,
-    ref: animationContainer
-  }, rest));
-  return {
-    View: View,
-    play: play,
-    stop: stop,
-    pause: pause,
-    setSpeed: setSpeed,
-    goToAndStop: goToAndStop,
-    goToAndPlay: goToAndPlay,
-    setDirection: setDirection,
-    playSegments: playSegments,
-    setSubframe: setSubframe,
-    getDuration: getDuration,
-    destroy: destroy,
-    animationContainerRef: animationContainer,
-    animationLoaded: animationLoaded,
-    animationItem: animationInstanceRef.current
-  };
-};
-
-// helpers
-function getContainerVisibility(container) {
-  var _container$getBoundin = container.getBoundingClientRect(),
-    top = _container$getBoundin.top,
-    height = _container$getBoundin.height;
-  var current = window.innerHeight - top;
-  var max = window.innerHeight + height;
-  return current / max;
-}
-function getContainerCursorPosition(container, cursorX, cursorY) {
-  var _container$getBoundin2 = container.getBoundingClientRect(),
-    top = _container$getBoundin2.top,
-    left = _container$getBoundin2.left,
-    width = _container$getBoundin2.width,
-    height = _container$getBoundin2.height;
-  var x = (cursorX - left) / width;
-  var y = (cursorY - top) / height;
-  return {
-    x: x,
-    y: y
-  };
-}
-var useInitInteractivity = function useInitInteractivity(_ref) {
-  var wrapperRef = _ref.wrapperRef,
-    animationItem = _ref.animationItem,
-    mode = _ref.mode,
-    actions = _ref.actions;
-  useEffect(function () {
-    var wrapper = wrapperRef.current;
-    if (!wrapper || !animationItem || !actions.length) {
+  useLayoutEffect(() => {
+    const el = scrollWrapperRef.current;
+    if (!el || !showFooter) return;
+    if (dataLength === 0) {
+      // Ensure we drop references + reset UI when data disappears.
+      dataRowsRef.current = [];
+      setVisibleFirst(1);
+      setVisibleLast(0);
       return;
     }
-    animationItem.stop();
-    var scrollModeHandler = function scrollModeHandler() {
-      var assignedSegment = null;
-      var scrollHandler = function scrollHandler() {
-        var currentPercent = getContainerVisibility(wrapper);
-        // Find the first action that satisfies the current position conditions
-        var action = actions.find(function (_ref2) {
-          var visibility = _ref2.visibility;
-          return visibility && currentPercent >= visibility[0] && currentPercent <= visibility[1];
-        });
-        // Skip if no matching action was found!
-        if (!action) {
-          return;
-        }
-        if (action.type === "seek" && action.visibility && action.frames.length === 2) {
-          // Seek: Go to a frame based on player scroll position action
-          var frameToGo = action.frames[0] + Math.ceil((currentPercent - action.visibility[0]) / (action.visibility[1] - action.visibility[0]) * action.frames[1]);
-          //! goToAndStop must be relative to the start of the current segment
-          animationItem.goToAndStop(frameToGo - animationItem.firstFrame - 1, true);
-        }
-        if (action.type === "loop") {
-          // Loop: Loop a given frames
-          if (assignedSegment === null) {
-            // if not playing any segments currently. play those segments and save to state
-            animationItem.playSegments(action.frames, true);
-            assignedSegment = action.frames;
-          } else {
-            // if playing any segments currently.
-            //check if segments in state are equal to the frames selected by action
-            if (assignedSegment !== action.frames) {
-              // if they are not equal. new segments are to be loaded
-              animationItem.playSegments(action.frames, true);
-              assignedSegment = action.frames;
-            } else if (animationItem.isPaused) {
-              // if they are equal the play method must be called only if lottie is paused
-              animationItem.playSegments(action.frames, true);
-              assignedSegment = action.frames;
-            }
-          }
-        }
-        if (action.type === "play" && animationItem.isPaused) {
-          // Play: Reset segments and continue playing full animation from current position
-          animationItem.resetSegments(true);
-          animationItem.play();
-        }
-        if (action.type === "stop") {
-          // Stop: Stop playback
-          animationItem.goToAndStop(action.frames[0] - animationItem.firstFrame - 1, true);
-        }
-      };
-      document.addEventListener("scroll", scrollHandler);
-      return function () {
-        document.removeEventListener("scroll", scrollHandler);
-      };
-    };
-    var cursorModeHandler = function cursorModeHandler() {
-      var handleCursor = function handleCursor(_x, _y) {
-        var x = _x;
-        var y = _y;
-        // Resolve cursor position if cursor is inside container
-        if (x !== -1 && y !== -1) {
-          // Get container cursor position
-          var pos = getContainerCursorPosition(wrapper, x, y);
-          // Use the resolved position
-          x = pos.x;
-          y = pos.y;
-        }
-        // Find the first action that satisfies the current position conditions
-        var action = actions.find(function (_ref3) {
-          var position = _ref3.position;
-          if (position && Array.isArray(position.x) && Array.isArray(position.y)) {
-            return x >= position.x[0] && x <= position.x[1] && y >= position.y[0] && y <= position.y[1];
-          }
-          if (position && !Number.isNaN(position.x) && !Number.isNaN(position.y)) {
-            return x === position.x && y === position.y;
-          }
-          return false;
-        });
-        // Skip if no matching action was found!
-        if (!action) {
-          return;
-        }
-        // Process action types:
-        if (action.type === "seek" && action.position && Array.isArray(action.position.x) && Array.isArray(action.position.y) && action.frames.length === 2) {
-          // Seek: Go to a frame based on player scroll position action
-          var xPercent = (x - action.position.x[0]) / (action.position.x[1] - action.position.x[0]);
-          var yPercent = (y - action.position.y[0]) / (action.position.y[1] - action.position.y[0]);
-          animationItem.playSegments(action.frames, true);
-          animationItem.goToAndStop(Math.ceil((xPercent + yPercent) / 2 * (action.frames[1] - action.frames[0])), true);
-        }
-        if (action.type === "loop") {
-          animationItem.playSegments(action.frames, true);
-        }
-        if (action.type === "play") {
-          // Play: Reset segments and continue playing full animation from current position
-          if (animationItem.isPaused) {
-            animationItem.resetSegments(false);
-          }
-          animationItem.playSegments(action.frames);
-        }
-        if (action.type === "stop") {
-          animationItem.goToAndStop(action.frames[0], true);
-        }
-      };
-      var mouseMoveHandler = function mouseMoveHandler(ev) {
-        handleCursor(ev.clientX, ev.clientY);
-      };
-      var mouseOutHandler = function mouseOutHandler() {
-        handleCursor(-1, -1);
-      };
-      wrapper.addEventListener("mousemove", mouseMoveHandler);
-      wrapper.addEventListener("mouseout", mouseOutHandler);
-      return function () {
-        wrapper.removeEventListener("mousemove", mouseMoveHandler);
-        wrapper.removeEventListener("mouseout", mouseOutHandler);
-      };
+    dataRowsRef.current = buildDataRowsCache(el);
+    updateVisibleRows(el);
+
+    // Optional cleanup: explicitly drop DOM references on unmount/refresh.
+    return () => {
+      dataRowsRef.current = [];
     };
-    switch (mode) {
-      case "scroll":
-        return scrollModeHandler();
-      case "cursor":
-        return cursorModeHandler();
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [mode, animationItem]);
-};
-var useLottieInteractivity = function useLottieInteractivity(_ref4) {
-  var actions = _ref4.actions,
-    mode = _ref4.mode,
-    lottieObj = _ref4.lottieObj;
-  var animationItem = lottieObj.animationItem,
-    View = lottieObj.View,
-    animationContainerRef = lottieObj.animationContainerRef;
-  useInitInteractivity({
-    actions: actions,
-    animationItem: animationItem,
-    mode: mode,
-    wrapperRef: animationContainerRef
-  });
-  return View;
-};
-var _excluded = ["style", "interactivity"];
-var Lottie = function Lottie(props) {
-  var _a, _b, _c;
-  var style = props.style,
-    interactivity = props.interactivity,
-    lottieProps = _objectWithoutProperties(props, _excluded);
-  /**
-   * Initialize the 'useLottie' hook
-   */
-  var _useLottie = useLottie(lottieProps, style),
-    View = _useLottie.View,
-    play = _useLottie.play,
-    stop = _useLottie.stop,
-    pause = _useLottie.pause,
-    setSpeed = _useLottie.setSpeed,
-    goToAndStop = _useLottie.goToAndStop,
-    goToAndPlay = _useLottie.goToAndPlay,
-    setDirection = _useLottie.setDirection,
-    playSegments = _useLottie.playSegments,
-    setSubframe = _useLottie.setSubframe,
-    getDuration = _useLottie.getDuration,
-    destroy = _useLottie.destroy,
-    animationContainerRef = _useLottie.animationContainerRef,
-    animationLoaded = _useLottie.animationLoaded,
-    animationItem = _useLottie.animationItem;
-  /**
-   * Make the hook variables/methods available through the provided 'lottieRef'
-   */
-  useEffect(function () {
-    if (props.lottieRef) {
-      props.lottieRef.current = {
-        play: play,
-        stop: stop,
-        pause: pause,
-        setSpeed: setSpeed,
-        goToAndPlay: goToAndPlay,
-        goToAndStop: goToAndStop,
-        setDirection: setDirection,
-        playSegments: playSegments,
-        setSubframe: setSubframe,
-        getDuration: getDuration,
-        destroy: destroy,
-        animationContainerRef: animationContainerRef,
-        animationLoaded: animationLoaded,
-        animationItem: animationItem
-      };
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [(_a = props.lottieRef) === null || _a === void 0 ? void 0 : _a.current]);
-  return useLottieInteractivity({
-    lottieObj: {
-      View: View,
-      play: play,
-      stop: stop,
-      pause: pause,
-      setSpeed: setSpeed,
-      goToAndStop: goToAndStop,
-      goToAndPlay: goToAndPlay,
-      setDirection: setDirection,
-      playSegments: playSegments,
-      setSubframe: setSubframe,
-      getDuration: getDuration,
-      destroy: destroy,
-      animationContainerRef: animationContainerRef,
-      animationLoaded: animationLoaded,
-      animationItem: animationItem
-    },
-    actions: (_b = interactivity === null || interactivity === void 0 ? void 0 : interactivity.actions) !== null && _b !== void 0 ? _b : [],
-    mode: (_c = interactivity === null || interactivity === void 0 ? void 0 : interactivity.mode) !== null && _c !== void 0 ? _c : "scroll"
-  });
+  }, [dataLength, showFooter, expandedRows]);
+  return {
+    visibleFirst,
+    visibleLast
+  };
 };
 
 const NoSearchUpcIcon = ({
@@ -47460,12 +47660,25 @@ const Table = props => {
     initialSortColumn = null,
     initialSortValue = null,
     onFilterStateChange = null,
-    onSortStateChange = null
+    onSortStateChange = null,
+    // Footer props
+    showFooter = false,
+    total,
+    rowLabel = ""
   } = props;
   const scrollWrapperRef = useRef(null);
   const tableBodyRef = useRef(null);
   const tableContainerRef = useRef(null);
   const [hasTriggered, setHasTriggered] = useState(false);
+  const {
+    visibleFirst,
+    visibleLast
+  } = useVisibleRows({
+    scrollWrapperRef,
+    dataLength: data.length,
+    showFooter,
+    expandedRows
+  });
   const clearTableFocus = () => {
     if (tableBodyRef.current) {
       tableBodyRef.current.clearFocus();
@@ -47623,7 +47836,7 @@ const Table = props => {
     backgroundColor: buttonColor,
     hoverBackgroundColor: buttonHoverColor,
     onClick: onButtonClick
-  }))), isLoading && /*#__PURE__*/React$1.createElement(LoadingWrapper$1, null, /*#__PURE__*/React$1.createElement(Lottie, {
+  }))), isLoading && !showFooter && /*#__PURE__*/React$1.createElement(LoadingWrapper$1, null, /*#__PURE__*/React$1.createElement(Lottie, {
     style: {
       width: "24px",
       height: "24px"
@@ -47632,7 +47845,14 @@ const Table = props => {
     loop: true
   }), /*#__PURE__*/React$1.createElement(LoadingText$1, null, isLoadingText)), isLoadingSpinner && /*#__PURE__*/React$1.createElement(LoaderWrapper, {
     id: "LoaderWrapper"
-  }, /*#__PURE__*/React$1.createElement(Loader, null)))));
+  }, /*#__PURE__*/React$1.createElement(Loader, null)), showFooter && /*#__PURE__*/React$1.createElement(TableFooter, {
+    visibleFirst: visibleFirst,
+    visibleLast: visibleLast,
+    total: total,
+    rowLabel: rowLabel,
+    isLoading: isLoading,
+    isLoadingText: isLoadingText
+  }))));
 };
 Table.displayName = "Table";