antd-shadcn-tanstack-table/dist/index.mjs

performant table with ant design , tanstack/react-table with shadcn data table

import * as React21 from 'react';
import React21__default, { forwardRef, Fragment, useState, useRef, useImperativeHandle, memo, useEffect, useCallback, useMemo } from 'react';
import { clsx } from 'clsx';
import { twMerge } from 'tailwind-merge';
import * as chrono from 'chrono-node';
import { flexRender, useReactTable, getFacetedMinMaxValues, getFacetedUniqueValues, getFacetedRowModel, getExpandedRowModel, getGroupedRowModel, getSortedRowModel, getFilteredRowModel, getPaginationRowModel, getCoreRowModel, createColumnHelper } from '@tanstack/react-table';
import { useRequest, useSafeState, useUpdateEffect } from 'ahooks';
import { theme, Flex, Select, Input, Tabs, Radio, Space, InputNumber, Skeleton as Skeleton$1, Typography, Button, Popover, Checkbox, Tooltip, Image, Divider, ConfigProvider, DatePicker, Spin } from 'antd';
import { createStyles } from 'antd-style';
import { ProForm, ProFormText, ProFormDigit, IndexColumn, ProFormDateRangePicker, ProFormDatePicker, ProFormCheckbox } from '@ant-design/pro-components';
import { Icon } from '@iconify/react';
import { IconCurrencyRupee, IconZoomExclamation, IconMail, IconMapPinCode, IconWorldLatitude, IconWorldLongitude } from '@tabler/icons-react';
import { SearchOutlined, ReloadOutlined, SettingOutlined, VerticalAlignMiddleOutlined, VerticalAlignBottomOutlined, VerticalAlignTopOutlined, CaretUpOutlined, CaretDownOutlined, FilterOutlined, InfoCircleOutlined } from '@ant-design/icons';
import dayjs2 from 'dayjs';
import { DEFAULT_DATE_FORMAT, FullColumnWIdth, DEFAULT_BACKEND_DATE_FORMAT } from 'constants';
import { useSortable } from '@dnd-kit/sortable';
import _, { isArray } from 'lodash';
import { useHotkeys } from 'react-hotkeys-hook';
import Link from 'antd/es/typography/Link';
import { useForm } from 'antd/es/form/Form';
import isBetween from 'dayjs/plugin/isBetween';

// src/components/customIntegration/ui/table.tsx
function cn(...inputs) {
  return twMerge(clsx(inputs));
}
var formatter = new Intl.NumberFormat("en-IN", {
  style: "decimal",
  minimumFractionDigits: 0,
  maximumFractionDigits: 2
});
var amountFormatter = (value) => {
  if (value || value === 0) {
    return formatter.format(value);
  }
  return "";
};
var parseDateTime = (str) => {
  if (str instanceof Date) return str;
  return chrono.parseDate(str);
};
var formatDateTime = (datetime) => {
  return new Date(datetime).toLocaleTimeString("en-US", {
    month: "short",
    day: "numeric",
    year: "numeric",
    hour: "numeric",
    minute: "numeric",
    hour12: true
  });
};

// src/components/customIntegration/ui/table.tsx
var ShadcnTable = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React21.createElement("div", { ref, className: "relative w-full max-h-[500px] overflow-y-auto" }, /* @__PURE__ */ React21.createElement(
  "table",
  {
    className: cn("w-full caption-bottom text-sm ", className),
    ...props
  }
)));
ShadcnTable.displayName = "Table";
var ShadcnTableHeader = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React21.createElement(
  "thead",
  {
    ref,
    className: cn(
      "[&_tr]:brder-b sticky top-0 z-10 bg-winterWhisper rounded-s-3xl",
      className
    ),
    ...props
  }
));
ShadcnTableHeader.displayName = "TableHeader";
var ShadcnTableBody = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React21.createElement(
  "tbody",
  {
    ref,
    className: cn("[&_tr:last-child]:border-0", className),
    ...props
  }
));
ShadcnTableBody.displayName = "TableBody";
var ShadcnTableFooter = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React21.createElement(
  "tfoot",
  {
    ref,
    className: cn(
      "border-t  font-medium [&>tr]:last:border-b-0 bottom-0 sticky bg-winterWhisper rounded-s-3xl z-20",
      className
    ),
    ...props
  }
));
ShadcnTableFooter.displayName = "TableFooter";
var ShadcnTableRow = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React21.createElement(
  "tr",
  {
    ref,
    className: cn(
      "border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted w-full",
      className
    ),
    ...props
  }
));
ShadcnTableRow.displayName = "TableRow";
var ShadcnTableHead = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React21.createElement(
  "th",
  {
    ref,
    className: cn(
      "h-12 text-left align-middle  text-muted-foreground [&:has([role=checkbox])]:pr-0  text-black relative  cursor-pointer border px-3  font-bold",
      className
    ),
    ...props
  }
));
ShadcnTableHead.displayName = "TableHead";
var ShadcnTableCell = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React21.createElement(
  "td",
  {
    ref,
    className: cn("p-4 align-middle [&:has([role=checkbox])]:pr-0", className),
    ...props
  }
));
ShadcnTableCell.displayName = "TableCell";
var ShadcnTableCaption = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React21.createElement(
  "caption",
  {
    ref,
    className: cn("mt-4 text-sm text-muted-foreground", className),
    ...props
  }
));
ShadcnTableCaption.displayName = "TableCaption";
function Skeleton({
  className,
  ...props
}) {
  return /* @__PURE__ */ React21__default.createElement(
    "div",
    {
      className: cn("animate-pulse rounded-md bg-muted", className),
      ...props
    }
  );
}
var MOBILE_BREAKPOINT = 768;
function useIsMobile() {
  const [isMobile, setIsMobile] = React21.useState(void 0);
  React21.useEffect(() => {
    const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
    const onChange = () => {
      setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
    };
    mql.addEventListener("change", onChange);
    setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
    return () => mql.removeEventListener("change", onChange);
  }, []);
  return !!isMobile;
}
var { defaultAlgorithm, darkAlgorithm, useToken } = theme;
var useAppTheme = () => {
  const { token } = useToken();
  return token;
};

// src/components/common/Button/style.tsx
var useStyles = ({ buttonVariant, size }) => {
  const token = useAppTheme();
  const backgroundColor = {
    default: token.neutral3,
    transparent: "transparent",
    primary: token.primary1,
    success: token.success1,
    error: token.error1,
    warning: token.warning1,
    info: token.info1,
    blue: "#2341D8"
  };
  const backgroundHoverColor = {
    blue: "#2341D8",
    default: token.neutral4,
    transparent: "transparent",
    primary: token.primary2,
    success: token.success2,
    error: token.error2,
    warning: token.warning2,
    info: token.info2
  };
  const color = {
    default: token.neutral7,
    transparent: token.neutral7,
    primary: token.primary8,
    success: token.success7,
    error: token.error7,
    warning: token.warning7,
    blue: "#FEFE",
    info: token.info7
  };
  const colorHover = {
    default: token.neutral6,
    transparent: token.neutral6,
    primary: token.primary4,
    success: token.success4,
    error: token.error4,
    warning: token.warning4,
    info: token.info4,
    blue: "#FEFE"
  };
  const fontSize = {
    small: "22px !important",
    middle: "36px !important",
    large: "46px !important",
    extraLarge: "54px !important"
  };
  return createStyles((_3, { buttonVariant: buttonVariant2, size: size2 }) => ({
    button: {
      backgroundColor: `${backgroundColor[buttonVariant2]} !important`,
      color: `${color[buttonVariant2]} !important`,
      display: "flex",
      alignItems: "center",
      justifyContent: "center",
      width: fontSize[size2 || "small"],
      minWidth: fontSize[size2 || "small"],
      height: fontSize[size2 || "small"],
      ":hover": {
        border: `1px solid ${colorHover[buttonVariant2]} !important`,
        backgroundColor: `${backgroundHoverColor[buttonVariant2]} !important`
      }
    }
  }))({ buttonVariant, size });
};
var useENoobButtonStyles = ({
  buttonVariant,
  size,
  wantHoverEffect
}) => {
  const token = useAppTheme();
  const backgroundColor = {
    default: token.neutral3,
    transparent: "transparent",
    primary: token.primary2,
    success: token.success2,
    error: token.error2,
    warning: token.warning2,
    info: token.info2,
    blue: "#2341D8"
  };
  const backgroundHoverColor = {
    default: token.neutral4,
    transparent: "transparent",
    primary: token.primary2,
    success: token.success2,
    error: token.error2,
    warning: token.warning2,
    info: token.info2,
    blue: "#2341D8"
  };
  const color = {
    default: token.neutral8,
    transparent: token.neutral8,
    primary: token.primary8,
    success: token.success8,
    error: token.error8,
    warning: token.warning8,
    info: token.info8,
    blue: "#FEFE"
  };
  const colorHover = {
    default: token.neutral6,
    transparent: token.neutral6,
    primary: token.primary4,
    success: token.success4,
    error: token.error4,
    warning: token.warning4,
    info: token.info6,
    blue: "#FEFE"
  };
  return createStyles((_3, { buttonVariant: buttonVariant2 }) => ({
    button: {
      backgroundColor: `${backgroundColor[buttonVariant2]} !important`,
      color: `${color[buttonVariant2]} !important`,
      display: "flex",
      alignItems: "center",
      justifyContent: "center",
      ":hover": {
        border: wantHoverEffect ? `1px solid ${colorHover[buttonVariant2]} !important` : "none !important",
        backgroundColor: wantHoverEffect ? `${backgroundHoverColor[buttonVariant2]} !important` : "none !important"
      }
    }
  }))({ buttonVariant, size });
};
var useButtonGroupStyles = () => {
  const token = useAppTheme();
  return createStyles(() => ({
    button: {
      fontWeight: "500",
      "&.ant-btn-default": {
        color: token.neutral7,
        backgroundColor: token.colorWhite
      }
    }
  }))();
};
var EButton = ({ ref, ...props }) => {
  return (
    // Note: Render Button component with styles from props and additional props passed down
    /* @__PURE__ */ React21__default.createElement(
      Button,
      {
        ...props,
        style: {
          display: "flex",
          alignItems: "center",
          justifyContent: "center",
          ...props == null ? void 0 : props.style
        }
      }
    )
  );
};
var EIconButtonIcon = ({
  eIconButtonVariant = "default",
  shape = "round",
  size = "small",
  ...props
}) => {
  const { styles } = useStyles({ buttonVariant: eIconButtonVariant, size });
  return /* @__PURE__ */ React21__default.createElement(EButton, { size, shape, className: styles.button, ...props });
};
var ENoobButton = ({
  buttonVariant = "default",
  shape = "default",
  size = "small",
  wantHoverEffect = false,
  ...props
}) => {
  const { styles } = useENoobButtonStyles({
    buttonVariant,
    size,
    wantHoverEffect
  });
  return /* @__PURE__ */ React21__default.createElement(EButton, { shape, className: styles.button, ...props });
};
var EButtonGroup = ({
  options,
  value,
  onChange = () => null,
  size,
  ...rest
}) => {
  var _a;
  const [selected, setSelected] = useState(value || ((_a = options == null ? void 0 : options[0]) == null ? void 0 : _a.value));
  const { styles, cx } = useButtonGroupStyles();
  return (
    // Note: Render a compact Space component to create space between buttons
    /* @__PURE__ */ React21__default.createElement(Space.Compact, null, options == null ? void 0 : options.map((item, key) => /* @__PURE__ */ React21__default.createElement(
      Button,
      {
        ...rest,
        className: cx(rest.className, styles.button),
        key,
        type: selected === (item == null ? void 0 : item.value) ? "primary" : "default",
        value: item == null ? void 0 : item.value,
        onClick: () => {
          setSelected(item == null ? void 0 : item.value);
          onChange(item == null ? void 0 : item.value);
        }
      },
      item == null ? void 0 : item.label
    )))
  );
};
var EIconButton = ({
  icon,
  title,
  ...rest
}) => {
  return /* @__PURE__ */ React21__default.createElement(EButton, { ...rest }, /* @__PURE__ */ React21__default.createElement(
    EIcon,
    {
      fontSize: 18,
      style: { marginRight: "4px" },
      icon
    }
  ), title);
};
var EButtonTransparent = ({
  ref,
  ...props
}) => {
  const token = useAppTheme();
  return (
    // Note: Render Button component with styles from props and additional props passed down
    /* @__PURE__ */ React21__default.createElement(
      Button,
      {
        style: {
          display: "flex",
          alignItems: "center",
          justifyContent: "center",
          backgroundColor: "#fff",
          border: `1px solid ${token.lightBorderWinterWhisper}`,
          ...props == null ? void 0 : props.style
        },
        ...props
      }
    )
  );
};
var TableDeleteButton = ({
  indicator,
  ...rest
}) => {
  return /* @__PURE__ */ React21__default.createElement(EButton, { type: "primary", danger: true, size: "middle", ...rest }, /* @__PURE__ */ React21__default.createElement(EIcon, { icon: "ic:baseline-delete", style: { marginRight: 4 } }), "Delete (", indicator, ")");
};
var TableClearButton = ({
  indicator,
  ...rest
}) => {
  return /* @__PURE__ */ React21__default.createElement(
    EButton,
    {
      type: "link",
      style: { fontWeight: "500", display: "flex", alignItems: "center" },
      ...rest
    },
    "Clear(",
    indicator,
    ")"
  );
};
var EThirdPartyLogInButtonProps = ({
  children,
  ...rest
}) => {
  const token = useAppTheme();
  return /* @__PURE__ */ React21__default.createElement(
    EButton,
    {
      style: {
        width: "100%",
        color: token.neutral8,
        fontWeight: "500",
        marginBottom: 14
      },
      ...rest
    },
    children
  );
};
var showShakeEffectConfig = (node, { component }) => {
  if (component !== "Button") {
    return;
  }
  const seq = [0, -15, 15, -5, 5, 0];
  const itv = 10;
  let steps = 0;
  function loop() {
    cancelAnimationFrame(node.effectTimeout);
    node.effectTimeout = requestAnimationFrame(() => {
      const currentStep = Math.floor(steps / itv);
      const current = seq[currentStep];
      const next = seq[currentStep + 1];
      if (!next) {
        node.style.transform = "";
        node.style.transition = "";
        return;
      }
      const angle = current + (next - current) / itv * (steps % itv);
      node.style.transform = `rotate(${angle}deg)`;
      node.style.transition = "none";
      steps += 1;
      loop();
    });
  }
  loop();
};
var ShakeButtonWrapper = ({
  showShakeEffect = true,
  showEffect = showShakeEffectConfig,
  children,
  ...wave
}) => {
  return /* @__PURE__ */ React21__default.createElement(
    ConfigProvider,
    {
      wave: {
        showEffect: showShakeEffect ? showEffect : void 0,
        ...wave
      }
    },
    children
  );
};
var ShakeButton = ({
  showShakeEffect = true,
  showEffect = showShakeEffectConfig,
  children,
  buttonProps,
  ...wave
}) => {
  return /* @__PURE__ */ React21__default.createElement(ShakeButtonWrapper, { showShakeEffect, ...wave }, /* @__PURE__ */ React21__default.createElement(EButton, { type: "primary", ...buttonProps }, children));
};
var ECheckbox = ({
  label,
  error,
  ...rest
}) => {
  return /* @__PURE__ */ React21__default.createElement(ProFormCheckbox, { ...rest }, label);
};
var EHeading = ({
  children,
  fontWeight = "400",
  textAlign = "left",
  color,
  ...rest
}) => {
  const renderTypography = () => {
    return /* @__PURE__ */ React21__default.createElement(
      Typography.Title,
      {
        ...rest,
        style: { color, fontWeight, textAlign, ...rest.style }
      },
      children
    );
  };
  return /* @__PURE__ */ React21__default.createElement(React21__default.Fragment, null, renderTypography());
};
var EParagraph = ({
  children,
  fontWeight = "400",
  textAlign = "left",
  color,
  ...rest
}) => {
  const renderTypography = () => {
    return /* @__PURE__ */ React21__default.createElement(
      Typography.Paragraph,
      {
        ...rest,
        style: { color, fontWeight, textAlign, ...rest.style }
      },
      children
    );
  };
  return /* @__PURE__ */ React21__default.createElement(React21__default.Fragment, null, renderTypography());
};
var EText = ({
  children,
  fontWeight = "400",
  textAlign = "left",
  fontSize = "14px",
  color,
  ...rest
}) => {
  const renderTypography = () => {
    return /* @__PURE__ */ React21__default.createElement(
      Typography.Text,
      {
        ...rest,
        style: {
          color,
          fontWeight,
          textAlign,
          fontSize,
          ...rest == null ? void 0 : rest.style
        }
      },
      children
    );
  };
  return /* @__PURE__ */ React21__default.createElement(React21__default.Fragment, null, renderTypography());
};
var ETextForSearchFilterDropDown = ({
  children,
  fontWeight = "500",
  textAlign,
  fontSize = "12px",
  color,
  ...rest
}) => {
  const token = useAppTheme();
  const renderTypography = () => {
    return /* @__PURE__ */ React21__default.createElement(
      Typography.Text,
      {
        style: {
          color: token.neutral6,
          fontWeight,
          textAlign,
          fontSize,
          ...rest == null ? void 0 : rest.style
        },
        ...rest
      },
      children
    );
  };
  return /* @__PURE__ */ React21__default.createElement(React21__default.Fragment, null, renderTypography());
};
var ETextForSearchFilterLabel = ({
  children,
  fontWeight = "500",
  fontSize = "13px",
  color,
  marginLeft = "2px",
  ...rest
}) => {
  const token = useAppTheme();
  const renderTypography = () => {
    return /* @__PURE__ */ React21__default.createElement(
      Typography.Text,
      {
        style: {
          color: token.neutral7,
          fontWeight,
          fontSize,
          marginLeft,
          ...rest == null ? void 0 : rest.style
        },
        ...rest
      },
      children
    );
  };
  return /* @__PURE__ */ React21__default.createElement(React21__default.Fragment, null, renderTypography());
};
var VerticalText = ({
  heading,
  desc,
  vertical = true,
  divider = true,
  colon = false,
  align = "center",
  styles,
  headingProps
}) => {
  const token = useAppTheme();
  const colonMark = colon ? ":" : void 0;
  return /* @__PURE__ */ React21__default.createElement(Flex, null, /* @__PURE__ */ React21__default.createElement(
    Flex,
    {
      vertical,
      gap: vertical ? 0 : 14,
      justify: vertical ? "center" : "flex-start",
      align: "center",
      flex: 1,
      style: {
        textAlign: align
      }
    },
    /* @__PURE__ */ React21__default.createElement(
      EText,
      {
        color: token.neutral7,
        fontSize: "12px",
        style: styles == null ? void 0 : styles.heading,
        ...headingProps
      },
      heading,
      " ",
      colonMark
    ),
    typeof desc === "string" ? /* @__PURE__ */ React21__default.createElement(
      EParagraph,
      {
        ellipsis: {
          rows: 2,
          tooltip: desc
        },
        style: {
          fontSize: "14px",
          fontWeight: "500",
          ...styles == null ? void 0 : styles.desc
        },
        color: token.neutral9
      },
      desc
    ) : desc
  ), divider && /* @__PURE__ */ React21__default.createElement(
    EDividerWithNoStyle,
    {
      type: "vertical",
      orientation: "right",
      style: {
        height: "36px",
        fontWeight: 800,
        ...styles == null ? void 0 : styles.divider
      }
    }
  ));
};
var TextWithIcon = ({
  img,
  text,
  infoText,
  ellipsisRows = 1,
  textMaxWidth = 120,
  styles,
  imgProps
}) => {
  const token = useAppTheme();
  return /* @__PURE__ */ React21__default.createElement(Flex, { gap: 4, align: "center", justify: "flex-start" }, /* @__PURE__ */ React21__default.createElement(ETooltip, { title: infoText }, typeof img === "string" ? /* @__PURE__ */ React21__default.createElement(
    Image,
    {
      preview: false,
      src: img,
      wrapperStyle: {
        ...imgProps == null ? void 0 : imgProps.wrapperStyle,
        display: "inline-flex"
      },
      style: styles == null ? void 0 : styles.img,
      height: 16,
      ...imgProps,
      loading: "lazy"
    }
  ) : img), typeof text === "string" ? /* @__PURE__ */ React21__default.createElement(
    EParagraph,
    {
      style: {
        height: "100%",
        marginBottom: 0,
        maxWidth: textMaxWidth,
        fontSize: 14,
        color: token.neutral9,
        fontWeight: "500"
      },
      ellipsis: {
        rows: ellipsisRows,
        tooltip: text
      }
    },
    text
  ) : text);
};
var Header = ({
  heading,
  subHeading,
  extra
}) => {
  const token = useAppTheme();
  return /* @__PURE__ */ React21__default.createElement(Flex, { justify: "space-between" }, /* @__PURE__ */ React21__default.createElement(Flex, { vertical: true, gap: 4 }, /* @__PURE__ */ React21__default.createElement(EText, { fontWeight: "600" }, heading), /* @__PURE__ */ React21__default.createElement(
    EParagraph,
    {
      style: {
        maxWidth: 900
      },
      ellipsis: {
        rows: 2
      },
      fontWeight: "500",
      color: token.neutral7
    },
    subHeading
  )), extra && extra);
};
var EDivider = ({
  marginTop = 24,
  marginBottom = 24,
  children,
  ...rest
}) => {
  return /* @__PURE__ */ React21__default.createElement(Divider, { style: { marginTop, marginBottom, ...rest == null ? void 0 : rest.style }, ...rest }, children);
};
var EFullDivider = ({
  children,
  ...rest
}) => {
  return /* @__PURE__ */ React21__default.createElement("div", null, /* @__PURE__ */ React21__default.createElement(
    Divider,
    {
      ...rest,
      style: {
        marginInline: "-24px",
        marginTop: "0",
        width: "calc(100% + 48px)"
      }
    },
    children
  ));
};
var EDividerWithNoStyle = ({
  marginTop = 6,
  marginBottom = 6,
  children,
  ...rest
}) => {
  return /* @__PURE__ */ React21__default.createElement(Divider, { style: { marginTop, marginBottom, ...rest == null ? void 0 : rest.style }, ...rest }, children);
};
var EDividerWithText = ({
  dividerProps,
  textProps,
  styles,
  ghost = false,
  children
}) => {
  var _a;
  const token = useAppTheme();
  return /* @__PURE__ */ React21__default.createElement(
    EDivider,
    {
      orientation: "left",
      style: {
        borderColor: token.neutral5,
        fontWeight: "500",
        margin: ghost ? 0 : (_a = styles == null ? void 0 : styles.dividerStyles) == null ? void 0 : _a.margin,
        ...styles == null ? void 0 : styles.dividerStyles
      },
      ...dividerProps
    },
    children && /* @__PURE__ */ React21__default.createElement(
      EText,
      {
        fontWeight: "500",
        color: token.neutral6,
        style: {
          ...styles == null ? void 0 : styles.textStyles
        },
        ...textProps
      },
      children
    )
  );
};
var ETooltip = ({ ...rest }) => {
  return /* @__PURE__ */ React21__default.createElement("div", null, /* @__PURE__ */ React21__default.createElement(Tooltip, { ...rest }));
};
var EPopover = ({ ...rest }) => {
  return /* @__PURE__ */ React21__default.createElement("div", null, /* @__PURE__ */ React21__default.createElement(Popover, { ...rest }));
};
var useStyles2 = () => {
  return createStyles((_3) => ({
    tabWrapper: {
      "& .ant-tabs-tab-btn": {
        fontWeight: 500
      }
    }
  }))();
};

// src/components/common/Tab/Tab.tsx
var ETab = ({ ...rest }) => {
  const { styles } = useStyles2();
  return /* @__PURE__ */ React21__default.createElement(React21__default.Fragment, null, /* @__PURE__ */ React21__default.createElement(Tabs, { className: styles.tabWrapper, ...rest }));
};
var EDatePicker = ({ ...rest }) => {
  return /* @__PURE__ */ React21__default.createElement("div", null, /* @__PURE__ */ React21__default.createElement(DatePicker, { ...rest }));
};
var EIcon = ({ ...rest }) => {
  return /* @__PURE__ */ React21__default.createElement(Icon, { ...rest });
};
var EPrimaryIcon = ({
  child = false,
  isActive = false,
  ...rest
}) => {
  const token = useAppTheme();
  return /* @__PURE__ */ React21__default.createElement(
    Icon,
    {
      color: isActive ? token.primary7 : token.neutral7,
      fontSize: 16,
      ...rest,
      style: { ...rest == null ? void 0 : rest.style }
    }
  );
};

// src/assets/images/noDataImg.svg
var noDataImg_default = "./noDataImg-AM4J6UAZ.svg";

// src/assets/index.tsx
var assets = {
  noDataImg: noDataImg_default};

// src/components/common/NoData/NoData.tsx
var NoData = ({
  width = "100%",
  height = "100%",
  style
}) => {
  const token = useAppTheme();
  return /* @__PURE__ */ React21__default.createElement(
    Flex,
    {
      justify: "center",
      align: "center",
      gap: 41,
      vertical: true,
      style: { minHeight: 243, width, height, ...style }
    },
    /* @__PURE__ */ React21__default.createElement(
      Image,
      {
        src: assets.noDataImg,
        preview: false,
        style: { width: 110, height: 110 }
      }
    ),
    /* @__PURE__ */ React21__default.createElement(
      EHeading,
      {
        level: 3,
        fontWeight: "500",
        color: token.neutral7,
        style: { marginLeft: 20 }
      },
      "No data found"
    )
  );
};

// src/constants.ts
var gstRegex = /^\d{2}[A-Z]{5}\d{4}[A-Z]{1}[A-Z\d]{1}[Z]{1}[A-Z\d]{1}$/;
var panRegex = /(^([a-zA-Z]{5})([0-9]{4})([a-zA-Z]{1})$)/;
var emailRegex = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9\s]+\.)+[a-zA-Z]{2,}))$/;
var REQUIRED_ERROR_MESSAGE = "Required!";
var INVALID_ERROR_MESSAGE = "Invalid input!";

// src/components/common/CustomInputFields/Fields.tsx
var EAmount = ({
  fieldProps,
  ...rest
}) => {
  const token = useAppTheme();
  const amountFormatter2 = (value) => {
    if (value) {
      return value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
    }
    return "";
  };
  return /* @__PURE__ */ React21__default.createElement(
    ProFormDigit,
    {
      fieldProps: {
        prefix: /* @__PURE__ */ React21__default.createElement(IconCurrencyRupee, { color: token.neutral6, size: 18 }),
        controls: false,
        formatter: amountFormatter2,
        ...fieldProps
      },
      ...rest,
      style: { width: "100%", ...rest == null ? void 0 : rest.style }
    }
  );
};
var EEmail = ({
  fieldProps,
  required = false,
  ...rest
}) => {
  const token = useAppTheme();
  return /* @__PURE__ */ React21__default.createElement(
    ProFormText,
    {
      placeholder: "Enter Email address",
      fieldProps: {
        prefix: /* @__PURE__ */ React21__default.createElement(IconMail, { color: token.neutral6, size: 19 }),
        ...fieldProps
      },
      required: true,
      ...rest,
      style: { ...rest == null ? void 0 : rest.style },
      rules: [
        {
          validator(_3, value, callback) {
            if (!value) {
              if (required) {
                callback(REQUIRED_ERROR_MESSAGE);
                return;
              }
              return callback();
            }
            if (!emailRegex.test(value)) {
              callback(INVALID_ERROR_MESSAGE);
            } else {
              callback();
            }
          }
        }
      ]
    }
  );
};
var EPan = ({
  fieldProps,
  required = true,
  rules,
  ...rest
}) => {
  const handlePanInput = (e) => {
    var _a, _b;
    e.target.value = (_b = (_a = e == null ? void 0 : e.target) == null ? void 0 : _a.value) == null ? void 0 : _b.toUpperCase();
  };
  return /* @__PURE__ */ React21__default.createElement(
    ProFormText,
    {
      placeholder: "Enter Pan Number",
      required: true,
      fieldProps: {
        onInput: handlePanInput,
        maxLength: 10,
        ...fieldProps
      },
      ...rest,
      style: { ...rest == null ? void 0 : rest.style },
      rules: [
        {
          validator(_3, value, callback) {
            if (!value) {
              if (required) {
                callback(REQUIRED_ERROR_MESSAGE);
                return;
              }
              return callback();
            }
            if (!panRegex.test(value)) {
              callback(INVALID_ERROR_MESSAGE);
            } else {
              callback();
            }
          }
        }
      ]
    }
  );
};
var EGstNo = ({
  fieldProps,
  required = true,
  ...rest
}) => {
  const handlePanInput = (e) => {
    var _a, _b;
    e.target.value = (_b = (_a = e == null ? void 0 : e.target) == null ? void 0 : _a.value) == null ? void 0 : _b.toUpperCase();
  };
  return /* @__PURE__ */ React21__default.createElement(
    ProFormText,
    {
      placeholder: "Enter GST Number",
      fieldProps: {
        onInput: handlePanInput,
        maxLength: 15,
        ...fieldProps
      },
      required: true,
      ...rest,
      style: { ...rest == null ? void 0 : rest.style },
      rules: [
        {
          validator(_3, value, callback) {
            if (!value) {
              if (required) {
                callback(REQUIRED_ERROR_MESSAGE);
                return;
              }
              return callback();
            }
            if (!gstRegex.test(value)) {
              callback(INVALID_ERROR_MESSAGE);
            } else {
              callback();
            }
          }
        }
      ]
    }
  );
};
var EPinCode = ({
  fieldProps,
  ...rest
}) => {
  const token = useAppTheme();
  return /* @__PURE__ */ React21__default.createElement(
    ProFormDigit,
    {
      fieldProps: {
        prefix: /* @__PURE__ */ React21__default.createElement(IconMapPinCode, { color: token.neutral6, size: 17 }),
        maxLength: 6,
        controls: false,
        formatter(value) {
          if (value) {
            return value.toString().replace(",", "");
          }
          return "";
        },
        ...fieldProps
      },
      ...rest,
      style: { width: "100%", ...rest == null ? void 0 : rest.style }
    }
  );
};
var ELatitude = ({
  fieldProps,
  type = "latitude",
  ...rest
}) => {
  const token = useAppTheme();
  return /* @__PURE__ */ React21__default.createElement(
    ProFormDigit,
    {
      fieldProps: {
        precision: 6,
        maxLength: 11,
        controls: false,
        prefix: type === "latitude" ? /* @__PURE__ */ React21__default.createElement(IconWorldLatitude, { color: token.neutral6, size: 16 }) : /* @__PURE__ */ React21__default.createElement(IconWorldLongitude, { color: token.neutral6, size: 16 }),
        ...fieldProps
      },
      placeholder: type,
      ...rest,
      style: { width: "100%", ...rest == null ? void 0 : rest.style }
    }
  );
};
var ProDigitNumber = ({
  fieldProps,
  ...rest
}) => {
  return /* @__PURE__ */ React21__default.createElement(
    ProFormDigit,
    {
      fieldProps: {
        precision: 2,
        formatter: (value) => `${value}`.replace(/,/g, ""),
        ...fieldProps
      },
      ...rest
    }
  );
};
var ProWeightNumber = ({
  fieldProps,
  ...rest
}) => {
  return /* @__PURE__ */ React21__default.createElement(
    ProFormDigit,
    {
      fieldProps: {
        precision: 3,
        ...fieldProps
      },
      ...rest
    }
  );
};
var ProAmount = ({
  fieldProps,
  ...rest
}) => {
  const token = useAppTheme();
  const amountFormatter2 = (value) => {
    if (value) {
      return value.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
    }
    return "";
  };
  return /* @__PURE__ */ React21__default.createElement(
    ProFormDigit,
    {
      fieldProps: {
        precision: 2,
        prefix: /* @__PURE__ */ React21__default.createElement(IconCurrencyRupee, { color: token.neutral6, size: 18 }),
        controls: false,
        formatter: amountFormatter2,
        ...fieldProps
      },
      ...rest,
      style: { width: "100%", ...rest == null ? void 0 : rest.style }
    }
  );
};
var ProAmountField = ({
  amount,
  iconColor,
  textProps,
  info,
  suffix,
  infoTitle,
  popoverProps
}) => {
  const token = useAppTheme();
  iconColor = iconColor || token.neutral7;
  return /* @__PURE__ */ React21__default.createElement(Flex, { align: "center", gap: 4 }, /* @__PURE__ */ React21__default.createElement(Flex, { flex: 1, align: "center" }, /* @__PURE__ */ React21__default.createElement(IconCurrencyRupee, { size: 16, color: iconColor }), /* @__PURE__ */ React21__default.createElement(EText, { ...textProps }, amountFormatter(amount)), typeof suffix === "string" ? /* @__PURE__ */ React21__default.createElement(EText, { ...textProps, color: token.neutral7 }, "\xA0", suffix) : suffix), info && /* @__PURE__ */ React21__default.createElement(
    EPopover,
    {
      title: infoTitle,
      showArrow: true,
      content: info,
      trigger: ["hover"],
      ...popoverProps
    },
    /* @__PURE__ */ React21__default.createElement(InfoCircleOutlined, { color: token.neutral8 })
  ));
};
var ProDatePicker = ({
  name,
  width = FullColumnWIdth,
  fieldProps,
  ...rest
}) => {
  const [date, setDate] = useSafeState(void 0);
  const handleInputChange = (e) => {
    var _a;
    const input = (_a = e == null ? void 0 : e.target) == null ? void 0 : _a.value;
    setDate(input);
  };
  return /* @__PURE__ */ React21__default.createElement(
    ProFormDatePicker,
    {
      name,
      width,
      fieldProps: {
        ...fieldProps,
        format: DEFAULT_DATE_FORMAT,
        picker: "date",
        value: date,
        onChange: handleInputChange,
        onBlur: (e) => {
          if (e.target.value.length > 0) {
            const parsedDateTime = parseDateTime(e.target.value);
            if (parsedDateTime) {
              e.target.value = formatDateTime(parsedDateTime);
              setDate(formatDateTime(parsedDateTime));
            }
          }
        }
      },
      transform: () => {
        if (date) {
          const isDateValid = dayjs2(date, DEFAULT_DATE_FORMAT, true).isValid();
          const formatValue = isDateValid ? date : dayjs2(date).format(DEFAULT_DATE_FORMAT);
          return {
            [name]: dayjs2(formatValue, DEFAULT_DATE_FORMAT).format(
              DEFAULT_BACKEND_DATE_FORMAT
            )
          };
        } else {
          return "";
        }
      },
      ...rest
    }
  );
};
var ELoader = ({
  width = "100%",
  height = "100%",
  ...rest
}) => {
  return (
    // Note: Render a Flex container with centered content and specified width and height
    /* @__PURE__ */ React21__default.createElement(
      Flex,
      {
        justify: "center",
        align: "center",
        vertical: true,
        flex: 1,
        style: { width, height }
      },
      /* @__PURE__ */ React21__default.createElement(
        Spin,
        {
          size: "large",
          tip: null,
          spinning: true,
          ...rest,
          style: { zIndex: 2e3, ...rest == null ? void 0 : rest.style }
        }
      )
    )
  );
};
var MainLoader = () => {
  return /* @__PURE__ */ React21__default.createElement(Flex, { justify: "center", align: "center", flex: 1, style: { height: "100vh" } }, /* @__PURE__ */ React21__default.createElement(Spin, { size: "large", tip: null, spinning: true, style: { zIndex: 2e3 } }));
};
var PageLoader = () => {
  return /* @__PURE__ */ React21__default.createElement(
    Flex,
    {
      style: {
        height: "60vh"
      },
      justify: "center",
      align: "center",
      flex: 1
    },
    /* @__PURE__ */ React21__default.createElement(Spin, null)
  );
};
var TableInput = ({
  type = "text",
  ...rest
}) => {
  switch (type) {
    case "digit":
      return /* @__PURE__ */ React21__default.createElement(
        ProFormDigit,
        {
          ...rest,
          style: { width: "100%" }
        }
      );
    case "amount":
      return /* @__PURE__ */ React21__default.createElement(ProAmount, { ...rest, noStyle: false });
    default:
      return (
        // NOTE: Default Input component with themed styles
        /* @__PURE__ */ React21__default.createElement(ProFormText, { ...rest })
      );
  }
};
var useTanstackTable = () => {
  const columnHelper = createColumnHelper();
  const rowSelectionColumn = columnHelper.display({
    id: "rowSelection",
    enablePinning: false,
    enableHiding: false,
    header: ({ table }) => {
      var _a, _b, _c, _d, _e, _f, _g, _h, _i;
      const isArray3 = Array.isArray(
        (_c = (_b = (_a = table.options) == null ? void 0 : _a.meta) == null ? void 0 : _b.rowSelection) == null ? void 0 : _c.selections
      );
      return ((_f = (_e = (_d = table.options) == null ? void 0 : _d.meta) == null ? void 0 : _e.rowSelection) == null ? void 0 : _f.selectionType) !== "radio" ? /* @__PURE__ */ React21__default.createElement(Flex, { justify: "flex-start", align: "center" }, /* @__PURE__ */ React21__default.createElement(
        IndeterminateCheckbox,
        {
          ...{
            checked: table.getIsAllPageRowsSelected(),
            indeterminate: table.getIsSomePageRowsSelected(),
            onChange: table.getToggleAllPageRowsSelectedHandler()
          }
        }
      ), isArray3 || ((_i = (_h = (_g = table.options) == null ? void 0 : _g.meta) == null ? void 0 : _h.rowSelection) == null ? void 0 : _i.selections) ? /* @__PURE__ */ React21__default.createElement(
        EButton,
        {
          type: "text",
          icon: /* @__PURE__ */ React21__default.createElement(EIcon, { icon: "material-symbols:add-rounded" })
        }
      ) : void 0) : void 0;
    },
    cell: ({ row, getValue }) => {
      return row.getCanMultiSelect() ? /* @__PURE__ */ React21__default.createElement("div", { className: "text-start" }, /* @__PURE__ */ React21__default.createElement(
        IndeterminateCheckbox,
        {
          ...{
            checked: row.getIsSelected(),
            disabled: !row.getCanSelect(),
            indeterminate: row.getIsSomeSelected(),
            onChange: row.getToggleSelectedHandler()
          }
        }
      ), getValue()) : /* @__PURE__ */ React21__default.createElement("div", { className: " text-center" }, /* @__PURE__ */ React21__default.createElement(
        Radio,
        {
          style: {
            marginInlineEnd: 0
          },
          checked: row.getIsSelected(),
          disabled: !row.getCanSelect(),
          onChange: row.getToggleSelectedHandler(),
          onClick: (e) => e.stopPropagation()
        }
      ));
    },
    size: 8
  });
  const expandableColumn = columnHelper.display({
    id: "expandable",
    enablePinning: false,
    enableHiding: false,
    header: "",
    size: 20,
    cell: ({ row }) => row.getCanExpand() ? /* @__PURE__ */ React21__default.createElement(
      "button",
      {
        className: "ml-8",
        ...{
          onClick: row.getToggleExpandedHandler(),
          style: { cursor: "pointer" }
        }
      },
      row.getIsExpanded() ? "\u{1F447}" : "\u{1F449}"
    ) : "\u{1F535}"
  });
  const indexColumn = columnHelper.display({
    id: "index",
    enablePinning: false,
    enableHiding: false,
    header: "",
    size: 10,
    cell: ({ table, row }) => {
      const allRows = table.getFilteredRowModel().rows;
      const visualIndex = allRows.findIndex((r) => r.id === row.id) + 1;
      return /* @__PURE__ */ React21__default.createElement(IndexColumn, { border: true }, visualIndex);
    }
  });
  const token = useAppTheme();
  const getFilterColumn = (threeDot) => {
    return columnHelper.display({
      id: "filter",
      size: 40,
      header: "",
      cell: (info) => /* @__PURE__ */ React21__default.createElement("a", { onClick: (event) => event.stopPropagation() }, /* @__PURE__ */ React21__default.createElement(EIcon, { icon: "bi:three-dots-vertical", color: token.neutral7 }))
    });
  };
  const [rowSelectionState, setRowSelectionState] = useState(
    {}
  );
  const [selectedRowKeys, setSelectedRowKeys] = useState([]);
  return {
    rowSelectionState,
    setRowSelectionState,
    columnHelper,
    rowSelectionColumn,
    getFilterColumn,
    expandableColumn,
    selectedRowKeys,
    setSelectedRowKeys,
    indexColumn
  };
};

// src/components/customIntegration/Tanstack/tableUtils.tsx
var getHiddenColumns = (columns) => {
  const hiddenColumns = columns.reduce((acc, column) => {
    var _a;
    return {
      ...acc,
      [column.id || column.accessorKey]: !((_a = column == null ? void 0 : column.meta) == null ? void 0 : _a.hidden)
    };
  }, {});
  return hiddenColumns;
};
var getRowIds = (table) => {
  var _a;
  return _.keys(_.pickBy((_a = table == null ? void 0 : table.getState()) == null ? void 0 : _a.rowSelection, _.identity));
};
var getSelectedRowModel = (table) => {
  var _a, _b;
  return (_b = (_a = table == null ? void 0 : table.getSelectedRowModel()) == null ? void 0 : _a.flatRows) == null ? void 0 : _b.map((row) => row.original);
};
var getCellSize = (type) => {
  switch (type) {
    case "small":
      return "py-2";
    case "middle":
      return "py-4";
    case "large":
      return "py-6";
    default:
      return "py-2";
  }
};
var getBordered = (bordered) => {
  return bordered ? "border" : "";
};
var handlePinColumn = (columnId, pinType, table) => {
  var _a, _b, _c;
  const currentPinned = table.getState().columnPinning;
  const newPinned = { ...currentPinned };
  if (pinType === "right") {
    newPinned.left = ((_a = newPinned.left) == null ? void 0 : _a.filter((id) => id !== columnId)) || [];
    newPinned.right = ((_b = newPinned.right) == null ? void 0 : _b.filter((id) => id !== columnId)) || [];
    const filterIndex = newPinned.right.findIndex((id) => id === "filter");
    if (filterIndex !== -1) {
      newPinned.right.splice(filterIndex, 0, columnId);
    } else {
      newPinned.right.push(columnId);
    }
  } else if (pinType === "left") {
    newPinned.right = ((_c = newPinned.right) == null ? void 0 : _c.filter((id) => id !== columnId)) || [];
    newPinned.left = [...newPinned.left || [], columnId];
  }
  table.setColumnPinning(newPinned);
};
var getExtraColumns = ({
  rowSelection,
  rowExpandable
}) => {
  const { rowSelectionColumn, expandableColumn } = useTanstackTable();
  const allExtraColumns = {
    rowSelection: rowSelectionColumn,
    rowExpandable: expandableColumn
  };
  return Object.values(
    _.pickBy(allExtraColumns, (_3, key) => {
      return rowSelection && key === "rowSelection" || rowExpandable && key === "rowExpandable";
    })
  );
};
var isIndeterminate = (selected, allOptions) => {
  return (selected == null ? void 0 : selected.length) > 0 ? selected == null ? void 0 : selected.some((item) => allOptions == null ? void 0 : allOptions.includes(item)) : false;
};
var isCheckAll = (selected, allOptions) => (selected == null ? void 0 : selected.length) === (allOptions == null ? void 0 : allOptions.length) && (allOptions == null ? void 0 : allOptions.length) > 0;
var getColumnAggregation = (rows, accessor) => {
  const values = rows.map((row) => row[accessor]).filter(Boolean);
  return {
    sum: values.reduce((a, b) => a + (Number(b) || 0), 0),
    avg: values.length ? values.reduce((a, b) => a + (Number(b) || 0), 0) / values.length : 0,
    min: Math.min(...values.map((v) => Number(v) || 0)),
    max: Math.max(...values.map((v) => Number(v) || 0)),
    count: values.length
  };
};

// src/components/customIntegration/Tanstack/tableConstant.tsx
var PAGINATION_PAGE_SIZE_OPTIONS = [
  { value: "10", label: "10 / Page" },
  { value: "20", label: "20 / Page" },
  { value: "50", label: "50 / Page" },
  { value: "100", label: "100 / Page" }
];
var FilterDropDown = ({ column }) => {
  var _a, _b, _c, _d;
  const { filterVariant = "search", valueEnum } = (_a = column.columnDef.meta) != null ? _a : {};
  const token = useAppTheme();
  const [value, setValue] = useSafeState(void 0);
  const searchInputRef = useRef(null);
  const [isDropdownVisible, setIsDropdownVisible] = useState(false);
  const sortedUniqueValues = useMemo(
    () => filterVariant === "range" ? [] : (
      // eslint-disable-next-line @typescript-eslint/require-array-sort-compare
      Array.from(column.getFacetedUniqueValues().keys()).sort().slice(0, 5e3).filter((item) => item)
    ),
    [column.getFacetedUniqueValues(), filterVariant, isDropdownVisible]
  );
  const items = [
    {
      key: "search",
      label: /* @__PURE__ */ React21__default.createElement(
        Input,
        {
          ref: searchInputRef,
          width: "sm",
          type: "text",
          onFocusCapture: (e) => {
            var _a2;
            if (e.target.value) {
              (_a2 = searchInputRef.current) == null ? void 0 : _a2.select();
            }
          },
          value,
          onChange: (e) => {
            var _a2;
            setValue((_a2 = e == null ? void 0 : e.target) == null ? void 0 : _a2.value);
            _.debounce(() => column == null ? void 0 : column.setFilterValue(e.target.value), 300)();
          },
          placeholder: `Search...`,
          onClick: (e) => e.stopPropagation()
        }
      ),
      disabled: filterVariant !== "search"
    },
    {
      key: "date",
      label: /* @__PURE__ */ React21__default.createElement(
        ProDatePicker,
        {
          ref: searchInputRef,
          width: "sm",
          fieldProps: {
            open: isDropdownVisible,
            size: "middle",
            value,
            onClick: (e) => e.stopPropagation(),
            onChange: (e) => {
              if (e) {
                setValue(e);
                column == null ? void 0 : column.setFilterValue(
                  dayjs2(dayjs2(e).toISOString()).format("YYYY-MM-DD")
                );
              } else {
                setValue(void 0);
                column == null ? void 0 : column.setFilterValue(void 0);
              }
            },
            placeholder: "Select date"
          }
        }
      ),
      disabled: filterVariant !== "date"
    },
    {
      key: "date-range",
      label: /* @__PURE__ */ React21__default.createElement(
        ProFormDateRangePicker,
        {
          fieldProps: {
            showNow: true,
            value,
            onClick: (e) => {
              e.stopPropagation();
              setIsDropdownVisible(true);
            },
            onChange: (e) => {
              if (e) {
                setValue(e);
                column == null ? void 0 : column.setFilterValue([
                  dayjs2(dayjs2(e[0]).toISOString()).format("YYYY-MM-DD"),
                  dayjs2(dayjs2(e[1]).toISOString()).format("YYYY-MM-DD")
                ]);
                setIsDropdownVisible(false);
              } else {
                setValue(void 0);
                column == null ? void 0 : column.setFilterValue(void 0);
                setIsDropdownVisible(false);
              }
            }
          }
        }
      ),
      disabled: filterVariant !== "date-range"
    },
    {
      key: "multi-select",
      onMouseEnter: () => {
        var _a2;
        (_a2 = searchInputRef.current) == null ? void 0 : _a2.focus();
      },
      label: /* @__PURE__ */ React21__default.createElement(
        "div",
        {
          onClick: (e) => {
            e.stopPropagation();
          },
          style: { width: "100%", padding: "4px" }
        },
        /* @__PURE__ */ React21__default.createElement(
          Checkbox,
          {
            className: "mb-3",
            indeterminate: isArray(column == null ? void 0 : column.getFilterValue()) ? isIndeterminate(
              column == null ? void 0 : column.getFilterValue(),
              sortedUniqueValues
            ) && !isCheckAll(
              column == null ? void 0 : column.getFilterValue(),
              sortedUniqueValues
            ) : false,
            checked: isCheckAll(
              column == null ? void 0 : column.getFilterValue(),
              sortedUniqueValues
            ),
            onChange: (e) => {
              if (e.target.checked) {
                column == null ? void 0 : column.setFilterValue(sortedUniqueValues);
              } else {
                column == null ? void 0 : column.setFilterValue(void 0);
              }
            }
          },
          "Select all items"
        ),
        /* @__PURE__ */ React21__default.createElement("div", { className: "mb-2" }, sortedUniqueValues == null ? void 0 : sortedUniqueValues.map((item) => {
          var _a2;
          return /* @__PURE__ */ React21__default.createElement("div", { className: "pl-5", key: item }, /* @__PURE__ */ React21__default.createElement(
            Checkbox,
            {
              className: "mb-1 hover:bg-gray-100 w-full rounded-sm",
              style: {
                color: token.neutral9
              },
              name: item,
              checked: (_a2 = column == null ? void 0 : column.getFilterValue()) == null ? void 0 : _a2.includes(
                item
              ),
              onChange: (e) => {
                e.stopPropagation();
                column == null ? void 0 : column.setFilterValue((prev) => {
                  if (prev == null ? void 0 : prev.includes(item)) {
                    return prev == null ? void 0 : prev.filter((i) => i !== item);
                  } else {
                    return [...prev != null ? prev : [], item];
                  }
                });
              }
            },
            item
          ));
        })),
        /* @__PURE__ */ React21__default.createElement(
          EDividerWithNoStyle,
          {
            style: {
              marginInline: "-18px",
              marginTop: "0",
              marginBottom: 4,
              width: "calc(100% + 34px)"
            }
          }
        ),
        /* @__PURE__ */ React21__default.createElement(
          Link,
          {
            disabled: isArray(column.getFilterValue()) ? ((_b =