primereact/treetable/treetable.js

PrimeReact is an open source UI library for React featuring a rich set of 90+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with Prime

this.primereact = this.primereact || {};
this.primereact.treetable = (function (exports, React, PrimeReact, componentbase, utils, hooks, arrowdown, arrowup, spinner, paginator, check, tooltip, chevrondown, chevronright, minus, ripple, overlayservice, sortalt, sortamountdown, sortamountupalt, inputtext) {
  'use strict';

  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

  function _interopNamespace(e) {
    if (e && e.__esModule) return e;
    var n = Object.create(null);
    if (e) {
      Object.keys(e).forEach(function (k) {
        if (k !== 'default') {
          var d = Object.getOwnPropertyDescriptor(e, k);
          Object.defineProperty(n, k, d.get ? d : {
            enumerable: true,
            get: function () { return e[k]; }
          });
        }
      });
    }
    n["default"] = e;
    return Object.freeze(n);
  }

  var React__namespace = /*#__PURE__*/_interopNamespace(React);
  var PrimeReact__default = /*#__PURE__*/_interopDefaultLegacy(PrimeReact);

  function _extends() {
    return _extends = Object.assign ? Object.assign.bind() : function (n) {
      for (var e = 1; e < arguments.length; e++) {
        var t = arguments[e];
        for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
      }
      return n;
    }, _extends.apply(null, arguments);
  }

  function _typeof(o) {
    "@babel/helpers - typeof";

    return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) {
      return typeof o;
    } : function (o) {
      return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o;
    }, _typeof(o);
  }

  function toPrimitive(t, r) {
    if ("object" != _typeof(t) || !t) return t;
    var e = t[Symbol.toPrimitive];
    if (void 0 !== e) {
      var i = e.call(t, r || "default");
      if ("object" != _typeof(i)) return i;
      throw new TypeError("@@toPrimitive must return a primitive value.");
    }
    return ("string" === r ? String : Number)(t);
  }

  function toPropertyKey(t) {
    var i = toPrimitive(t, "string");
    return "symbol" == _typeof(i) ? i : i + "";
  }

  function _defineProperty(e, r, t) {
    return (r = toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
      value: t,
      enumerable: !0,
      configurable: !0,
      writable: !0
    }) : e[r] = t, e;
  }

  function _arrayLikeToArray$4(r, a) {
    (null == a || a > r.length) && (a = r.length);
    for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e];
    return n;
  }

  function _arrayWithoutHoles(r) {
    if (Array.isArray(r)) return _arrayLikeToArray$4(r);
  }

  function _iterableToArray(r) {
    if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r);
  }

  function _unsupportedIterableToArray$4(r, a) {
    if (r) {
      if ("string" == typeof r) return _arrayLikeToArray$4(r, a);
      var t = {}.toString.call(r).slice(8, -1);
      return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray$4(r, a) : void 0;
    }
  }

  function _nonIterableSpread() {
    throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
  }

  function _toConsumableArray(r) {
    return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray$4(r) || _nonIterableSpread();
  }

  function _arrayWithHoles(r) {
    if (Array.isArray(r)) return r;
  }

  function _iterableToArrayLimit(r, l) {
    var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
    if (null != t) {
      var e,
        n,
        i,
        u,
        a = [],
        f = !0,
        o = !1;
      try {
        if (i = (t = t.call(r)).next, 0 === l) {
          if (Object(t) !== t) return;
          f = !1;
        } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0);
      } catch (r) {
        o = !0, n = r;
      } finally {
        try {
          if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return;
        } finally {
          if (o) throw n;
        }
      }
      return a;
    }
  }

  function _nonIterableRest() {
    throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
  }

  function _slicedToArray(r, e) {
    return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray$4(r, e) || _nonIterableRest();
  }

  var getStorage = function getStorage(stateStorageProp) {
    switch (stateStorageProp) {
      case 'local':
        return window.localStorage;
      case 'session':
        return window.sessionStorage;
      case 'custom':
        return null;
      default:
        throw new Error(stateStorageProp + ' is not a valid value for the state storage, supported values are "local", "session" and "custom".');
    }
  };

  var ColumnBase = componentbase.ComponentBase.extend({
    defaultProps: {
      __TYPE: 'Column',
      align: null,
      alignFrozen: 'left',
      alignHeader: null,
      body: null,
      bodyClassName: null,
      bodyStyle: null,
      cellEditValidateOnClose: false,
      cellEditValidator: null,
      cellEditValidatorEvent: 'click',
      className: null,
      colSpan: null,
      columnKey: null,
      dataType: 'text',
      editor: null,
      excludeGlobalFilter: false,
      expander: false,
      exportField: null,
      exportable: true,
      field: null,
      filter: false,
      filterApply: null,
      filterClear: null,
      filterElement: null,
      filterField: null,
      filterFooter: null,
      filterFunction: null,
      filterHeader: null,
      filterHeaderClassName: null,
      filterHeaderStyle: null,
      filterMatchMode: null,
      filterMatchModeOptions: null,
      filterMaxLength: null,
      filterMenuClassName: null,
      filterMenuStyle: null,
      filterPlaceholder: null,
      filterType: 'text',
      footer: null,
      footerClassName: null,
      footerStyle: null,
      frozen: false,
      header: null,
      headerClassName: null,
      headerStyle: null,
      headerTooltip: null,
      headerTooltipOptions: null,
      hidden: false,
      maxConstraints: 2,
      onBeforeCellEditHide: null,
      onBeforeCellEditShow: null,
      onCellEditCancel: null,
      onCellEditComplete: null,
      onCellEditInit: null,
      onFilterApplyClick: null,
      onFilterClear: null,
      onFilterConstraintAdd: null,
      onFilterConstraintRemove: null,
      onFilterMatchModeChange: null,
      onFilterOperatorChange: null,
      reorderable: true,
      resizeable: true,
      rowEditor: false,
      rowReorder: false,
      rowReorderIcon: null,
      rowSpan: null,
      selectionMode: null,
      showAddButton: true,
      showApplyButton: true,
      showClearButton: true,
      showFilterMatchModes: true,
      showFilterMenu: true,
      showFilterMenuOptions: true,
      showFilterOperator: true,
      sortField: null,
      sortFunction: null,
      sortable: false,
      sortableDisabled: false,
      style: null,
      children: undefined
    },
    getCProp: function getCProp(column, name) {
      return utils.ObjectUtils.getComponentProp(column, name, ColumnBase.defaultProps);
    },
    getCProps: function getCProps(column) {
      return utils.ObjectUtils.getComponentProps(column, ColumnBase.defaultProps);
    },
    getCOtherProps: function getCOtherProps(column) {
      return utils.ObjectUtils.getComponentDiffProps(column, ColumnBase.defaultProps);
    }
  });

  var styles = "\n@layer primereact {\n    .p-treetable {\n        position: relative;\n    }\n    .p-treetable > .p-treetable-wrapper {\n        overflow: auto;\n    }\n    .p-treetable table {\n        border-collapse: collapse;\n        width: 100%;\n        table-layout: fixed;\n    }\n    .p-treetable .p-sortable-column {\n        cursor: pointer;\n        user-select: none;\n    }\n    .p-treetable-selectable .p-treetable-tbody > tr {\n        cursor: pointer;\n    }\n    .p-treetable-toggler {\n        cursor: pointer;\n        user-select: none;\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n        flex-shrink: 0;\n        vertical-align: middle;\n        overflow: hidden;\n        position: relative;\n    }\n    .p-treetable-toggler + .p-checkbox {\n        vertical-align: middle;\n    }\n    .p-treetable-toggler + .p-checkbox + span {\n        vertical-align: middle;\n    }\n    /* Resizable */\n    .p-treetable-resizable > .p-treetable-wrapper {\n        overflow-x: auto;\n    }\n    .p-treetable-resizable .p-treetable-thead > tr > th,\n    .p-treetable-resizable .p-treetable-tfoot > tr > td,\n    .p-treetable-resizable .p-treetable-tbody > tr > td {\n        overflow: hidden;\n    }\n    .p-treetable-resizable .p-resizable-column {\n        background-clip: padding-box;\n        position: relative;\n    }\n    .p-treetable-resizable-fit .p-resizable-column:last-child .p-column-resizer {\n        display: none;\n    }\n    .p-treetable .p-column-resizer {\n        display: block;\n        position: absolute;\n        top: 0;\n        right: 0;\n        margin: 0;\n        width: 0.5rem;\n        height: 100%;\n        padding: 0px;\n        cursor: col-resize;\n        border: 1px solid transparent;\n    }\n    .p-treetable .p-column-resizer-helper {\n        width: 1px;\n        position: absolute;\n        z-index: 10;\n        display: none;\n    }\n    /* Scrollable */\n    .p-treetable-scrollable-wrapper {\n        position: relative;\n    }\n    .p-treetable-scrollable-header,\n    .p-treetable-scrollable-footer {\n        overflow: hidden;\n        border: 0 none;\n    }\n    .p-treetable-scrollable-body {\n        overflow: auto;\n        position: relative;\n    }\n    .p-treetable-virtual-table {\n        position: absolute;\n    }\n    /* Frozen Columns */\n    .p-treetable-frozen-view .p-treetable-scrollable-body {\n        overflow: hidden;\n    }\n    .p-treetable-unfrozen-view {\n        position: absolute;\n        top: 0px;\n        left: 0px;\n    }\n    /* Reorder */\n    .p-treetable-reorder-indicator-up,\n    .p-treetable-reorder-indicator-down {\n        position: absolute;\n        display: none;\n    }\n    /* Loader */\n    .p-treetable .p-treetable-loading-overlay {\n        position: absolute;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        z-index: 2;\n    }\n    /* Alignment */\n    .p-treetable .p-treetable-thead > tr > th.p-align-left > .p-column-header-content,\n    .p-treetable .p-treetable-tbody > tr > td.p-align-left,\n    .p-treetable .p-treetable-tfoot > tr > td.p-align-left {\n        text-align: left;\n        justify-content: flex-start;\n    }\n    .p-treetable .p-treetable-thead > tr > th.p-align-right > .p-column-header-content,\n    .p-treetable .p-treetable-tbody > tr > td.p-align-right,\n    .p-treetable .p-treetable-tfoot > tr > td.p-align-right {\n        text-align: right;\n        justify-content: flex-end;\n    }\n    .p-treetable .p-treetable-thead > tr > th.p-align-center > .p-column-header-content,\n    .p-treetable .p-treetable-tbody > tr > td.p-align-center,\n    .p-treetable .p-treetable-tfoot > tr > td.p-align-center {\n        text-align: center;\n        justify-content: center;\n    }\n}\n";
  var classes$1 = {
    root: function root(_ref) {
      var props = _ref.props,
        isRowSelectionMode = _ref.isRowSelectionMode;
      return utils.classNames('p-treetable p-component', {
        'p-treetable-hoverable-rows': props.rowHover,
        'p-treetable-selectable': isRowSelectionMode(),
        'p-treetable-resizable': props.resizableColumns,
        'p-treetable-resizable-fit': props.resizableColumns && props.columnResizeMode === 'fit',
        'p-treetable-striped': props.stripedRows,
        'p-treetable-gridlines': props.showGridlines
      });
    },
    loadingIcon: 'p-treetable-loading-icon',
    loadingWrapper: 'p-treetable-loading',
    loadingOverlay: 'p-treetable-loading-overlay p-component-overlay',
    header: 'p-treetable-header',
    checkIcon: 'p-checkbox-icon',
    footer: 'p-treetable-footer',
    resizeHelper: 'p-column-resizer-helper',
    reorderIndicatorUp: 'p-treetable-reorder-indicator-up',
    reorderIndicatorDown: 'p-treetable-reorder-indicator-down',
    wrapper: 'p-treetable-wrapper',
    table: function table(_ref2) {
      var props = _ref2.props;
      return utils.classNames('p-treetable-table', {
        'p-treetable-scrollable-table': props.scrollable,
        'p-treetable-resizable-table': props.resizableColumns,
        'p-treetable-resizable-table-fit': props.resizableColumns && props.columnResizeMode === 'fit'
      });
    },
    scrollableWrapper: 'p-treetable-wrapper p-treetable-scrollable-wrapper',
    thead: 'p-treetable-thead',
    tbody: 'p-treetable-tbody',
    tfoot: 'p-treetable-tfoot',
    emptyMessage: 'p-treetable-emptymessage',
    bodyCell: function bodyCell(_ref3) {
      var props = _ref3.bodyProps,
        editingState = _ref3.editingState,
        align = _ref3.align;
      return utils.classNames(_defineProperty({
        'p-editable-column': props.editor,
        'p-cell-editing': props.editor ? editingState : false
      }, "p-align-".concat(align), !!align));
    },
    sortBadge: 'p-sortable-column-badge',
    headerTitle: 'p-column-title',
    headerContent: 'p-column-header-content',
    headerCell: function headerCell(_ref4) {
      var props = _ref4.headerProps,
        frozen = _ref4.frozen,
        column = _ref4.column,
        options = _ref4.options,
        getColumnProp = _ref4.getColumnProp,
        sorted = _ref4.sorted,
        align = _ref4.align;
      return options.filterOnly ? utils.classNames('p-filter-column', {
        'p-frozen-column': frozen
      }) : utils.classNames(_defineProperty({
        'p-sortable-column': getColumnProp(column, 'sortable'),
        'p-highlight': sorted,
        'p-frozen-column': frozen,
        'p-resizable-column': props.resizableColumns && getColumnProp(column, 'resizeable'),
        'p-reorderable-column': props.reorderableColumns && getColumnProp(column, 'reorderable') && !frozen
      }, "p-align-".concat(align), !!align));
    },
    columnResizer: 'p-column-resizer p-clickable',
    sortIcon: 'p-sortable-column-icon',
    row: function row(_ref5) {
      var isSelected = _ref5.isSelected,
        props = _ref5.rowProps;
      return {
        'p-highlight': isSelected(),
        'p-highlight-contextmenu': props.contextMenuSelectionKey && props.contextMenuSelectionKey === props.node.key,
        'p-row-odd': parseInt(String(props.rowIndex).split('_').pop(), 10) % 2 !== 0
      };
    },
    rowCheckbox: function rowCheckbox(_ref6) {
      var partialChecked = _ref6.partialChecked;
      return utils.classNames('p-treetable-checkbox', {
        'p-indeterminate': partialChecked
      });
    },
    rowToggler: 'p-treetable-toggler p-link p-unselectable-text',
    rowTogglerIcon: 'p-treetable-toggler-icon',
    scrollableBody: 'p-treetable-scrollable-body',
    scrollableHeaderTable: 'p-treetable-scrollable-header-table',
    scrollableHeaderBox: 'p-treetable-scrollable-header-box',
    scrollableHeader: 'p-treetable-scrollable-header',
    scrollableBodyTable: 'p-treetable-scrollable-body-table',
    scrollableFooter: 'p-treetable-scrollable-footer',
    scrollableFooterBox: 'p-treetable-scrollable-footer-box',
    scrollableFooterTable: 'p-treetable-scrollable-footer-table',
    scrollable: function scrollable(_ref7) {
      var props = _ref7.scrolaableProps;
      return utils.classNames('p-treetable-scrollable-view', {
        'p-treetable-frozen-view': props.frozen,
        'p-treetable-unfrozen-view': !props.frozen && props.frozenWidth
      });
    },
    scrollableColgroup: 'p-treetable-scrollable-colgroup'
  };
  var TreeTableBase = componentbase.ComponentBase.extend({
    defaultProps: {
      __TYPE: 'TreeTable',
      alwaysShowPaginator: true,
      checkboxIcon: null,
      className: null,
      columnResizeMode: 'fit',
      contextMenuSelectionKey: null,
      currentPageReportTemplate: '({currentPage} of {totalPages})',
      customRestoreState: null,
      customSaveState: null,
      defaultSortOrder: 1,
      emptyMessage: null,
      expandedKeys: null,
      filterDelay: 300,
      filterLocale: undefined,
      filterMode: 'lenient',
      filters: null,
      first: null,
      footer: null,
      footerColumnGroup: null,
      frozenFooterColumnGroup: null,
      frozenHeaderColumnGroup: null,
      frozenWidth: null,
      globalFilter: null,
      globalFilterMatchMode: PrimeReact.FilterMatchMode.CONTAINS,
      header: null,
      headerColumnGroup: null,
      id: null,
      lazy: false,
      loading: false,
      loadingIcon: null,
      metaKeySelection: false,
      multiSortMeta: null,
      onColReorder: null,
      onCollapse: null,
      onColumnResizeEnd: null,
      onContextMenu: null,
      onContextMenuSelectionChange: null,
      onExpand: null,
      onFilter: null,
      onPage: null,
      onRowClick: null,
      onRowMouseEnter: null,
      onRowMouseLeave: null,
      onSelect: null,
      onSelectionChange: null,
      onSort: null,
      onStateRestore: null,
      onStateSave: null,
      onToggle: null,
      onUnselect: null,
      onValueChange: null,
      pageLinkSize: 5,
      paginator: false,
      paginatorClassName: null,
      paginatorDropdownAppendTo: null,
      paginatorLeft: null,
      paginatorPosition: 'bottom',
      paginatorRight: null,
      paginatorTemplate: 'FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink RowsPerPageDropdown',
      propagateSelectionDown: true,
      propagateSelectionUp: true,
      removableSort: false,
      reorderIndicatorDownIcon: null,
      reorderIndicatorUpIcon: null,
      reorderableColumns: false,
      resizableColumns: false,
      rowClassName: null,
      rowHover: false,
      rows: null,
      rowsPerPageOptions: null,
      scrollHeight: null,
      scrollable: false,
      selectOnEdit: true,
      selectionKeys: null,
      selectionMode: null,
      showGridlines: false,
      sortField: null,
      sortIcon: null,
      sortMode: 'single',
      sortOrder: null,
      stateKey: null,
      stateStorage: null,
      stripedRows: false,
      style: null,
      tabIndex: 0,
      tableClassName: null,
      tableStyle: null,
      totalRecords: null,
      value: null,
      children: undefined,
      togglerTemplate: null
    },
    css: {
      classes: classes$1,
      styles: styles
    }
  });

  var classes = {
    box: 'p-checkbox-box',
    input: 'p-checkbox-input',
    icon: 'p-checkbox-icon',
    root: function root(_ref) {
      var props = _ref.props,
        checked = _ref.checked,
        context = _ref.context;
      return utils.classNames('p-checkbox p-component', {
        'p-highlight': checked,
        'p-disabled': props.disabled,
        'p-invalid': props.invalid,
        'p-variant-filled': props.variant ? props.variant === 'filled' : context && context.inputStyle === 'filled'
      });
    }
  };
  var CheckboxBase = componentbase.ComponentBase.extend({
    defaultProps: {
      __TYPE: 'Checkbox',
      autoFocus: false,
      checked: false,
      className: null,
      disabled: false,
      falseValue: false,
      icon: null,
      id: null,
      inputId: null,
      inputRef: null,
      invalid: false,
      variant: null,
      name: null,
      onChange: null,
      onContextMenu: null,
      onMouseDown: null,
      readOnly: false,
      required: false,
      style: null,
      tabIndex: null,
      tooltip: null,
      tooltipOptions: null,
      trueValue: true,
      value: null,
      children: undefined
    },
    css: {
      classes: classes
    }
  });

  function ownKeys$6(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
  function _objectSpread$6(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$6(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$6(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
  var Checkbox = /*#__PURE__*/React__namespace.memo(/*#__PURE__*/React__namespace.forwardRef(function (inProps, ref) {
    var mergeProps = hooks.useMergeProps();
    var context = React__namespace.useContext(PrimeReact.PrimeReactContext);
    var props = CheckboxBase.getProps(inProps, context);
    var _React$useState = React__namespace.useState(false),
      _React$useState2 = _slicedToArray(_React$useState, 2),
      focusedState = _React$useState2[0],
      setFocusedState = _React$useState2[1];
    var _CheckboxBase$setMeta = CheckboxBase.setMetaData({
        props: props,
        state: {
          focused: focusedState
        },
        context: {
          checked: props.checked === props.trueValue,
          disabled: props.disabled
        }
      }),
      ptm = _CheckboxBase$setMeta.ptm,
      cx = _CheckboxBase$setMeta.cx,
      isUnstyled = _CheckboxBase$setMeta.isUnstyled;
    componentbase.useHandleStyle(CheckboxBase.css.styles, isUnstyled, {
      name: 'checkbox'
    });
    var elementRef = React__namespace.useRef(null);
    var inputRef = React__namespace.useRef(props.inputRef);
    var isChecked = function isChecked() {
      return props.checked === props.trueValue;
    };
    var _onChange = function onChange(event) {
      if (props.disabled || props.readOnly) {
        return;
      }
      if (props.onChange) {
        var _props$onChange;
        var _checked = isChecked();
        var value = _checked ? props.falseValue : props.trueValue;
        var eventData = {
          originalEvent: event,
          value: props.value,
          checked: value,
          stopPropagation: function stopPropagation() {
            event === null || event === void 0 || event.stopPropagation();
          },
          preventDefault: function preventDefault() {
            event === null || event === void 0 || event.preventDefault();
          },
          target: {
            type: 'checkbox',
            name: props.name,
            id: props.id,
            value: props.value,
            checked: value
          }
        };
        props === null || props === void 0 || (_props$onChange = props.onChange) === null || _props$onChange === void 0 || _props$onChange.call(props, eventData);

        // do not continue if the user defined click wants to prevent
        if (event.defaultPrevented) {
          return;
        }
        utils.DomHandler.focus(inputRef.current);
      }
    };
    var _onFocus = function onFocus(event) {
      var _props$onFocus;
      setFocusedState(true);
      props === null || props === void 0 || (_props$onFocus = props.onFocus) === null || _props$onFocus === void 0 || _props$onFocus.call(props, event);
    };
    var _onBlur = function onBlur(event) {
      var _props$onBlur;
      setFocusedState(false);
      props === null || props === void 0 || (_props$onBlur = props.onBlur) === null || _props$onBlur === void 0 || _props$onBlur.call(props, event);
    };
    React__namespace.useImperativeHandle(ref, function () {
      return {
        props: props,
        focus: function focus() {
          return utils.DomHandler.focus(inputRef.current);
        },
        getElement: function getElement() {
          return elementRef.current;
        },
        getInput: function getInput() {
          return inputRef.current;
        }
      };
    });
    React__namespace.useEffect(function () {
      utils.ObjectUtils.combinedRefs(inputRef, props.inputRef);
    }, [inputRef, props.inputRef]);
    hooks.useUpdateEffect(function () {
      inputRef.current.checked = isChecked();
    }, [props.checked, props.trueValue]);
    hooks.useMountEffect(function () {
      if (props.autoFocus) {
        utils.DomHandler.focus(inputRef.current, props.autoFocus);
      }
    });
    var checked = isChecked();
    var hasTooltip = utils.ObjectUtils.isNotEmpty(props.tooltip);
    var otherProps = CheckboxBase.getOtherProps(props);
    var rootProps = mergeProps({
      id: props.id,
      className: utils.classNames(props.className, cx('root', {
        checked: checked,
        context: context
      })),
      style: props.style,
      'data-p-highlight': checked,
      'data-p-disabled': props.disabled,
      onContextMenu: props.onContextMenu,
      onMouseDown: props.onMouseDown
    }, otherProps, ptm('root'));
    var createInputElement = function createInputElement() {
      var ariaProps = utils.ObjectUtils.reduceKeys(otherProps, utils.DomHandler.ARIA_PROPS);
      var inputProps = mergeProps(_objectSpread$6({
        id: props.inputId,
        type: 'checkbox',
        className: cx('input'),
        name: props.name,
        tabIndex: props.tabIndex,
        onFocus: function onFocus(e) {
          return _onFocus(e);
        },
        onBlur: function onBlur(e) {
          return _onBlur(e);
        },
        onChange: function onChange(e) {
          return _onChange(e);
        },
        disabled: props.disabled,
        readOnly: props.readOnly,
        required: props.required,
        'aria-invalid': props.invalid,
        checked: checked
      }, ariaProps), ptm('input'));
      return /*#__PURE__*/React__namespace.createElement("input", _extends({
        ref: inputRef
      }, inputProps));
    };
    var createBoxElement = function createBoxElement() {
      var iconProps = mergeProps({
        className: cx('icon')
      }, ptm('icon'));
      var boxProps = mergeProps({
        className: cx('box', {
          checked: checked
        }),
        'data-p-highlight': checked,
        'data-p-disabled': props.disabled
      }, ptm('box'));
      var icon = checked ? props.icon || /*#__PURE__*/React__namespace.createElement(check.CheckIcon, iconProps) : null;
      var checkboxIcon = utils.IconUtils.getJSXIcon(icon, _objectSpread$6({}, iconProps), {
        props: props,
        checked: checked
      });
      return /*#__PURE__*/React__namespace.createElement("div", boxProps, checkboxIcon);
    };
    return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("div", _extends({
      ref: elementRef
    }, rootProps), createInputElement(), createBoxElement()), hasTooltip && /*#__PURE__*/React__namespace.createElement(tooltip.Tooltip, _extends({
      target: elementRef,
      content: props.tooltip,
      pt: ptm('tooltip')
    }, props.tooltipOptions)));
  }));
  Checkbox.displayName = 'Checkbox';

  function ownKeys$5(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
  function _objectSpread$5(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$5(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$5(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
  var TreeTableBodyCell = function TreeTableBodyCell(props) {
    var _React$useState = React__namespace.useState(false),
      _React$useState2 = _slicedToArray(_React$useState, 2),
      editingState = _React$useState2[0],
      setEditingState = _React$useState2[1];
    var elementRef = React__namespace.useRef(null);
    var keyHelperRef = React__namespace.useRef(null);
    var selfClick = React__namespace.useRef(false);
    var overlayEventListener = React__namespace.useRef(null);
    var tabIndexTimeout = React__namespace.useRef(null);
    var mergeProps = hooks.useMergeProps();
    var getColumnProp = function getColumnProp(name) {
      return ColumnBase.getCProp(props.column, name);
    };
    var getColumnProps = function getColumnProps(column) {
      return ColumnBase.getCProps(column);
    };
    var _props$ptCallbacks = props.ptCallbacks,
      ptm = _props$ptCallbacks.ptm,
      ptmo = _props$ptCallbacks.ptmo,
      cx = _props$ptCallbacks.cx;
    var getColumnPTOptions = function getColumnPTOptions(key) {
      var isSingleSelectionMode = props.metaData.props.selectionMode === 'single';
      var isMultipleSelectionMode = props.metaData.props.selectionMode === 'multiple';
      var cProps = getColumnProps(props.column);
      var columnMetadata = {
        props: cProps,
        parent: props.metaData,
        hostName: props.hostName,
        state: {
          editing: editingState
        },
        context: {
          index: props.index,
          selectable: isSingleSelectionMode || isMultipleSelectionMode,
          selected: props.selected,
          scrollable: props.metaData.props.scrollable,
          frozen: getColumnProp('frozen'),
          showGridlines: props.metaData.props.showGridlines
        }
      };
      return mergeProps(ptm("column.".concat(key), {
        column: columnMetadata
      }), ptm("column.".concat(key), columnMetadata), ptmo(cProps, key, columnMetadata));
    };
    var field = getColumnProp('field') || "field_".concat(props.index);
    var getCellParams = function getCellParams() {
      return {
        value: resolveFieldData(),
        field: field,
        rowData: props.rowData,
        rowIndex: props.rowIndex,
        cellIndex: props.index,
        selected: isSelected(),
        column: props.column,
        props: props
      };
    };
    var getCellCallbackParams = function getCellCallbackParams(event) {
      var params = getCellParams();
      return _objectSpread$5({
        originalEvent: event
      }, params);
    };
    var resolveFieldData = function resolveFieldData(data) {
      return utils.ObjectUtils.resolveFieldData(data || props.node.data, field);
    };
    var _useEventListener = hooks.useEventListener({
        type: 'click',
        listener: function listener(e) {
          if (!selfClick.current && isOutsideClicked(e.target)) {
            switchCellToViewMode(e);
          }
          selfClick.current = false;
        },
        when: getColumnProp('editor')
      }),
      _useEventListener2 = _slicedToArray(_useEventListener, 2),
      bindDocumentClickListener = _useEventListener2[0],
      unbindDocumentClickListener = _useEventListener2[1];
    var _onClick = function onClick(event) {
      if (getColumnProp('editor') && !editingState && (props.selectOnEdit || !props.selectOnEdit && props.selected)) {
        selfClick.current = true;
        var params = getCellCallbackParams(event);
        var onBeforeCellEditShow = getColumnProp('onBeforeCellEditShow');
        if (onBeforeCellEditShow) {
          // if user returns false do not show the editor
          if (onBeforeCellEditShow(params) === false) {
            return;
          }

          // if user prevents default stop the editor
          if (event && event.defaultPrevented) {
            return;
          }
        }
        setEditingState(true);
        var onCellEditInit = getColumnProp('onCellEditInit');
        if (onCellEditInit) {
          if (onCellEditInit(params) === false) {
            return;
          }

          // if user prevents default stop the editor
          if (event && event.defaultPrevented) {
            return;
          }
        }
        bindDocumentClickListener();
        overlayEventListener.current = function (e) {
          if (!isOutsideClicked(e.target)) {
            selfClick.current = true;
          }
        };
        overlayservice.OverlayService.on('overlay-click', overlayEventListener.current);
      }
    };
    var _onKeyDown = function onKeyDown(event) {
      if (event.which === 13 || event.which === 9) {
        switchCellToViewMode(event);
      }
    };
    var isOutsideClicked = function isOutsideClicked(target) {
      return elementRef.current && !(elementRef.current.isSameNode(target) || elementRef.current.contains(target));
    };
    var closeCell = function closeCell() {
      /* When using the 'tab' key, the focus event of the next cell is not called in IE. */
      setTimeout(function () {
        setEditingState(false);
        unbindDocumentClickListener();
        overlayservice.OverlayService.off('overlay-click', overlayEventListener.current);
        overlayEventListener.current = null;
      }, 1);
    };
    var onEditorFocus = function onEditorFocus(event) {
      _onClick(event);
    };
    var switchCellToViewMode = function switchCellToViewMode(event) {
      if (props.cellEditValidator) {
        var valid = props.cellEditValidator({
          originalEvent: event,
          columnProps: props
        });
        if (valid) {
          closeCell();
        }
      } else {
        closeCell();
      }
    };
    var isSelected = function isSelected() {
      return props.selection ? props.selection instanceof Array ? findIndex(props.selection) > -1 : equals(props.selection) : false;
    };
    React__namespace.useEffect(function () {
      if (elementRef.current && getColumnProp('editor')) {
        clearTimeout(tabIndexTimeout.current);
        if (editingState) {
          var focusable = utils.DomHandler.findSingle(elementRef.current, 'input');
          if (focusable && document.activeElement !== focusable && !focusable.hasAttribute('data-isCellEditing')) {
            focusable.setAttribute('data-isCellEditing', true);
            focusable.focus();
          }
          keyHelperRef.current.tabIndex = -1;
        } else {
          tabIndexTimeout.current = setTimeout(function () {
            if (keyHelperRef.current) {
              keyHelperRef.current.setAttribute('tabindex', 0);
            }
          }, 50);
        }
      }
    });
    hooks.useUnmountEffect(function () {
      if (overlayEventListener.current) {
        overlayservice.OverlayService.off('overlay-click', overlayEventListener.current);
        overlayEventListener.current = null;
      }
    });
    var bodyClassName = utils.ObjectUtils.getPropValue(props.bodyClassName, props.node.data, {
      field: props.field,
      rowIndex: props.rowIndex,
      props: props
    });
    var style = props.bodyStyle || props.style;
    var columnEditor = getColumnProp('editor');
    var content;
    if (editingState) {
      if (columnEditor) {
        content = utils.ObjectUtils.getJSXElement(columnEditor, {
          node: props.node,
          rowData: props.rowData,
          value: utils.ObjectUtils.resolveFieldData(props.node.data, props.field),
          field: props.field,
          rowIndex: props.rowIndex,
          props: props
        });
      } else {
        throw new Error('Editor is not found on column.');
      }
    } else if (props.body) {
      content = utils.ObjectUtils.getJSXElement(props.body, props.node, {
        field: props.field,
        rowIndex: props.rowIndex,
        props: props
      });
    } else {
      content = utils.ObjectUtils.resolveFieldData(props.node.data, props.field);
    }
    var editorKeyHelperProps = mergeProps({
      tabIndex: 0,
      ref: keyHelperRef,
      className: 'p-cell-editor-key-helper p-hidden-accessible',
      onFocus: function onFocus(e) {
        return onEditorFocus(e);
      }
    }, getColumnPTOptions('editorKeyHelperLabel'));
    var editorKeyHelperLabelProps = mergeProps(getColumnPTOptions('editorKeyHelper'));
    /* eslint-disable */
    var editorKeyHelper = columnEditor && /*#__PURE__*/React__namespace.createElement("a", editorKeyHelperProps, /*#__PURE__*/React__namespace.createElement("span", editorKeyHelperLabelProps));
    var align = getColumnProp('align');
    /* eslint-enable */
    var bodyCellProps = mergeProps({
      role: 'cell',
      className: utils.classNames(bodyClassName || props.className, cx('bodyCell', {
        bodyProps: props,
        editingState: editingState,
        align: align
      })),
      style: style,
      onClick: function onClick(e) {
        return _onClick(e);
      },
      onKeyDown: function onKeyDown(e) {
        return _onKeyDown(e);
      }
    }, getColumnPTOptions('root'), getColumnPTOptions('bodyCell'));
    return /*#__PURE__*/React__namespace.createElement("td", _extends({
      ref: elementRef
    }, bodyCellProps), props.children, editorKeyHelper, content);
  };
  TreeTableBodyCell.displayName = 'TreeTableBodyCell';

  function _createForOfIteratorHelper$3(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray$3(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t["return"] || t["return"](); } finally { if (u) throw o; } } }; }
  function _unsupportedIterableToArray$3(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray$3(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray$3(r, a) : void 0; } }
  function _arrayLikeToArray$3(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
  function ownKeys$4(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
  function _objectSpread$4(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$4(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$4(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
  var TreeTableRow = /*#__PURE__*/React__namespace.memo(function (props) {
    var elementRef = React__namespace.useRef(null);
    var nodeTouched = React__namespace.useRef(false);
    var mergeProps = hooks.useMergeProps();
    var expanded = props.expandedKeys ? props.expandedKeys[props.node.key] !== undefined : false;
    var getColumnProp = function getColumnProp(column, name) {
      return ColumnBase.getCProp(column, name);
    };
    var getColumnProps = function getColumnProps(column) {
      return ColumnBase.getCProps(column);
    };
    var _props$ptCallbacks = props.ptCallbacks,
      ptm = _props$ptCallbacks.ptm,
      ptmo = _props$ptCallbacks.ptmo,
      cx = _props$ptCallbacks.cx,
      isUnstyled = _props$ptCallbacks.isUnstyled;
    var getColumnPTOptions = function getColumnPTOptions(column, key) {
      var cProps = getColumnProps(column);
      var columnMetadata = {
        props: cProps,
        parent: props.metaData,
        hostName: props.hostName,
        context: {
          index: props.rowIndex,
          selectable: props.node.selectable !== false,
          selected: isSelected(),
          frozen: getColumnProp(column, 'frozen'),
          scrollable: props.metaData.props.scrollable
        }
      };
      return mergeProps(ptm("column.".concat(key), {
        column: columnMetadata
      }), ptm("column.".concat(key), columnMetadata), ptmo(cProps, key, columnMetadata));
    };
    var getColumnCheckboxPTOptions = function getColumnCheckboxPTOptions(column, key) {
      var cProps = getColumnProps(column);
      var columnMetadata = {
        props: cProps,
        parent: props.metaData,
        hostName: props.hostName,
        context: {
          checked: isChecked(),
          partialChecked: isPartialChecked()
        }
      };
      return mergeProps(ptm("column.".concat(key), {
        column: columnMetadata
      }), ptm("column.".concat(key), columnMetadata), ptmo(cProps, key, columnMetadata));
    };
    var getRowPTOptions = function getRowPTOptions(key) {
      var rowMetadata = {
        hostName: props.hostName,
        context: {
          index: props.index,
          selected: isSelected(),
          selectable: props.node.selectable !== false,
          frozen: getColumnProp('frozen'),
          scrollable: props.metaData.props.scrollable,
          showGridlines: props.metaData.props.showGridlines
        }
      };
      return ptm(key, rowMetadata);
    };
    var onTogglerClick = function onTogglerClick(event) {
      expanded ? collapse(event) : expand(event);
      event.preventDefault();
      event.stopPropagation();
    };
    var expand = function expand(event) {
      var navigateFocusToChild = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
      var expandedKeys = props.expandedKeys ? _objectSpread$4({}, props.expandedKeys) : {};
      expandedKeys[props.node.key] = true;
      props.onToggle({
        originalEvent: event,
        value: expandedKeys,
        navigateFocusToChild: navigateFocusToChild
      });
      invokeToggleEvents(event, true);
    };
    var collapse = function collapse(event) {
      var expandedKeys = _objectSpread$4({}, props.expandedKeys);
      delete expandedKeys[props.node.key];
      props.onToggle({
        originalEvent: event,
        value: expandedKeys
      });
      invokeToggleEvents(event, false);
    };
    var invokeToggleEvents = function invokeToggleEvents(event, expanded) {
      if (expanded) {
        if (props.onExpand) {
          props.onExpand({
            originalEvent: event,
            node: props.node
          });
        }
      } else if (props.onCollapse) {
        props.onCollapse({
          originalEvent: event,
          node: props.node
        });
      }
    };
    var _onClick = function onClick(event) {
      if (props.onRowClick) {
        props.onRowClick(event, props.node);
      }
      nodeTouched.current = false;
    };
    var _onTouchEnd = function onTouchEnd() {
      nodeTouched.current = true;
    };
    var _onMouseEnter = function onMouseEnter(event) {
      if (props.onRowMouseEnter) {
        props.onRowMouseEnter({
          originalEvent: event,
          node: props.node,
          index: props.rowIndex
        });
      }
    };
    var _onMouseLeave = function onMouseLeave(event) {
      if (props.onRowMouseLeave) {
        props.onRowMouseLeave({
          originalEvent: event,
          node: props.node,
          index: props.rowIndex
        });
      }
    };
    var onCheckboxChange = function onCheckboxChange(event) {
      var checked = isChecked();
      var selectionKeys = props.selectionKeys ? _objectSpread$4({}, props.selectionKeys) : {};
      if (checked) {
        if (props.propagateSelectionDown) {
          _propagateDown(props.node, false, selectionKeys);
        } else {
          delete selectionKeys[props.node.key];
        }
        if (props.propagateSelectionUp && props.onPropagateUp) {
          props.onPropagateUp({
            originalEvent: event,
            check: false,
            selectionKeys: selectionKeys
          });
        }
        if (props.onUnselect) {
          props.onUnselect({
            originalEvent: event,
            node: props.node
          });
        }
      } else {
        if (props.propagateSelectionDown) {
          _propagateDown(props.node, true, selectionKeys);
        } else {
          selectionKeys[props.node.key] = {
            checked: true
          };
        }
        if (props.propagateSelectionUp && props.onPropagateUp) {
          props.onPropagateUp({
            originalEvent: event,
            check: true,
            selectionKeys: selectionKeys
          });
        }
        if (props.onSelect) {
          props.onSelect({
            originalEvent: event,
            node: props.node
          });
        }
      }
      if (props.onSelectionChange) {
        props.onSelectionChange({
          originalEvent: event,
          value: selectionKeys
        });
      }
      utils.DomHandler.clearSelection();
    };
    var propagateUp = function propagateUp(event) {
      var check = event.check;
      var selectionKeys = event.selectionKeys;
      var checkedChildCount = 0;
      var _iterator = _createForOfIteratorHelper$3(props.node.children),
        _step;
      try {
        for (_iterator.s(); !(_step = _iterator.n()).done;) {
          var child = _step.value;
          if (selectionKeys[child.key] && selectionKeys[child.key].checked) {
            checkedChildCount++;
          }
        }
      } catch (err) {
        _iterator.e(err);
      } finally {
        _iterator.f();
      }
      var parentKey = props.node.key;
      var children = utils.ObjectUtils.findChildrenByKey(props.originalOptions, parentKey);
      var isParentPartiallyChecked = children.some(function (ele) {
        return ele.key in selectionKeys;
      });
      var isCompletelyChecked = children.every(function (ele) {
        return ele.key in selectionKeys && selectionKeys[ele.key].checked;
      });
      if (isParentPartiallyChecked && !isCompletelyChecked) {
        selectionKeys[parentKey] = {
          checked: false,
          partialChecked: true
        };
      } else if (isCompletelyChecked) {
        selectionKeys[parentKey] = {
          checked: true,
          partialChecked: false
        };
      } else if (check) {
        selectionKeys[parentKey] = {
          checked: false,
          partialChecked: false
        };
      } else {
        delete selectionKeys[parentKey];
      }
      if (props.propagateSelectionUp && props.onPropagateUp) {
        props.onPropagateUp(event);
      }
    };
    var _propagateDown = function propagateDown(node, check, selectionKeys) {
      if (check) {
        selectionKeys[node.key] = {
          checked: true,
          partialChecked: false
        };
      } else {
        delete selectionKeys[node.key];
      }
      if (node.children && node.children.length) {
        for (var i = 0; i < node.children.length; i++) {
          _propagateDown(node.children[i], check, selectionKeys);
        }
      }
    };
    var onRightClick = function onRightClick(event) {
      utils.DomHandler.clearSelection();
      if (props.onContextMenuSelectionChange) {
        props.onContextMenuSelectionChange({
          originalEvent: event,
          value: props.node.key
        });
      }
      if (props.onContextMenu) {
        props.onContextMenu({
          originalEvent: event,
          node: props.node
        });
      }
    };
    var _onKeyDown = function onKeyDown(event, item) {
      switch (event.code) {
        case 'ArrowDown':
          onArrowDownKey(event);
          break;
        case 'ArrowUp':
          onArrowUpKey(event);
          break;
        case 'ArrowLeft':
          onArrowLeftKey(event);
          break;
        case 'ArrowRight':
          onArrowRightKey(event);
          break;
        case 'Home':
          onHomeKey(event);
          break;
        case 'End':
          onEndKey(event);
          break;
        case 'Enter':
        case 'NumpadEnter':
        case 'Space':
          if (!utils.DomHandler.isClickable(event.target)) {
            onEnterKey(event);
          }
          break;
        case 'Tab':
          onTabKey();
          break;
      }
    };
    var onArrowDownKey = function onArrowDownKey(event) {
      var nextElementSibling = event.currentTarget.nextElementSibling;
      nextElementSibling && focusRowChange(event.currentTarget, nextElementSibling);
      event.preventDefault();
    };
    var onArrowUpKey = function onArrowUpKey(event) {
      var previousElementSibling = event.currentTarget.previousElementSibling;
      previousElementSibling && focusRowChange(event.currentTarget, previousElementSibling);
      event.preventDefault();
    };
    var onArrowRightKey = function onArrowRightKey(event) {
      var ishiddenIcon = utils.DomHandler.findSingle(event.currentTarget, 'button').style.visibility === 'hidden';
      utils.DomHandler.findSingle(elementRef.current, '[data-pc-section="rowtoggler"]');
      if (ishiddenIcon) {
        return;
      }
      !expanded && expand(event, true);
      event.preventDefault();
    };
    var onArrowLeftKey = function onArrowLeftKey(event) {
      if (props.level === 0 && !expanded) {
        return;
      }
      var currentTarget = event.currentTarget;
      var ishiddenIcon = utils.DomHandler.findSingle(currentTarget, 'button').style.visibility === 'hidden';
      util