@paperless/core 2.0.1-beta.2 → 2.0.1-beta.21

package/dist/collection/components/organisms/table/table.component.js

@@ -2,1637 +2,1769 @@ import { h, Host, } from "@stencil/core";
 import { tableColumSizesOptions } from "../../../types/constants";
 import { formatTranslation, getLocaleComponentStrings, isMobile, } from "../../../utils";
 import { defaultSize, defaultSizeOptions, } from "../../molecules/page-size-select/constants";
+import { cn } from "../../../utils/cn";
 export class Table {
-  constructor() {
-    this._rowActionsFloatingAll = [];
-    this._ctrlDown = false;
-    this._hasCustomFilterSlot = false;
-    this._hasCustomActionsSlot = false;
-    this._floatingMenuShown = false;
-    this.items = undefined;
-    this.loading = false;
-    this.headerLoading = false;
-    this.footerLoading = false;
-    this.amountOfLoadingRows = 6;
-    this.enableRowSelection = true;
-    this.rowSelectionLimit = undefined;
-    this.enableRowClick = true;
-    this.selectedRows = [];
-    this.enableFloatingMenu = true;
-    this.floatingMenuAmountSelectedTemplate = (amount) => {
-      var _a, _b, _c;
-      return formatTranslation((_c = (amount === 1
-        ? (_a = this._locales.floating_menu) === null || _a === void 0 ? void 0 : _a.amount_selected
-        : (_b = this._locales.floating_menu) === null || _b === void 0 ? void 0 : _b.amount_selected_plural)) === null || _c === void 0 ? void 0 : _c.replace('{{amount}}', amount));
-    };
-    this.selectionKey = undefined;
-    this.canSelectKey = undefined;
-    this.enableHeader = true;
-    this.quickFilters = [];
-    this.activeQuickFilterIdentifier = undefined;
-    this.enableSearch = true;
-    this.query = undefined;
-    this.enableFilter = true;
-    this.enableFilterDesktop = true;
-    this.selectedFiltersAmount = undefined;
-    this.filterButtonTemplate = undefined;
-    this.enableAction = false;
-    this.actionButtonLoading = false;
-    this.actionButtonEnabled = false;
-    this.actionButtonIcon = 'pencil';
-    this.actionButtonText = undefined;
-    this.actionButtonTemplate = undefined;
-    this.enableFooter = true;
-    this.enablePageSize = true;
-    this.enablePagination = true;
-    this.enableExport = true;
-    this.page = 1;
-    this.total = undefined;
-    this.pageSize = defaultSize;
-    this.pageSizeOptions = defaultSizeOptions;
-    this.hideOnSinglePage = true;
-    this.emptyStateHeader = () => { var _a; return formatTranslation((_a = this._locales.empty_state) === null || _a === void 0 ? void 0 : _a.no_filter.header); };
-    this.emptyStateContent = () => { var _a; return formatTranslation((_a = this._locales.empty_state) === null || _a === void 0 ? void 0 : _a.no_filter.content); };
-    this.emptyStateAction = () => { var _a; return formatTranslation((_a = this._locales.empty_state) === null || _a === void 0 ? void 0 : _a.no_filter.action); };
-    this.enableEmptyStateAction = true;
-    this.emptyStateFilteredHeader = () => formatTranslation(this._locales.empty_state.filtered.header);
-    this.emptyStateFilteredContent = () => formatTranslation(this._locales.empty_state.filtered.content);
-    this.shadow = true;
-    this._locales = {};
-    this._columns = [];
-    this._items = [];
-    this._enableRowSelection = this.enableRowSelection;
-    this._rowSelectionLimit = undefined;
-    this._rowActionsFloating = [];
-    this._rowActionsRow = [];
-  }
-  componentWillLoad() {
-    this._hasCustomFilterSlot = !!this._el.querySelector(':scope > [slot="custom-filter"]');
-    this._hasCustomActionsSlot = !!this._el.querySelector(':scope > [slot="custom-actions"]');
-    this._setRowSelectionData();
-    this._setLocales();
-    this._parseItems(this.items);
-    this._generateColumns();
-  }
-  componentDidRender() {
-    this.hasRendered.emit();
-  }
-  render() {
-    var _a, _b, _c, _d, _e, _f, _g;
-    return (h(Host, { class: 'p-table' }, h("p-table-container", { shadow: this.shadow }, this.enableHeader && (h("p-table-header", {
-      // quick filters
-      quickFilters: this.quickFilters, activeQuickFilterIdentifier: this.activeQuickFilterIdentifier, onQuickFilter: ({ detail }) => this.quickFilter.emit(detail),
-      // search
-      enableSearch: this.enableSearch, query: this.query, onQueryChange: ({ detail }) => this.queryChange.emit(detail),
-      // filter button
-      enableFilter: this.enableFilter, enableFilterDesktop: this.enableFilterDesktop, selectedFiltersAmount: this.selectedFiltersAmount, filterButtonTemplate: this.filterButtonTemplate, onFilter: () => this.filter.emit(),
-      // action button
-      enableAction: this.enableAction, actionIcon: this.actionButtonIcon, actionText: this.actionButtonText, actionLoading: this.actionButtonLoading, canUseAction: this.actionButtonEnabled, actionButtonTemplate: this.actionButtonTemplate, onAction: () => this.action.emit(), itemsSelectedAmount: (_a = this.selectedRows) === null || _a === void 0 ? void 0 : _a.length,
-      //loading
-      loading: this.headerLoading
-    }, this._hasCustomFilterSlot && (h("slot", { name: 'custom-filter', slot: 'custom-filter' })), this._hasCustomActionsSlot && (h("slot", { name: 'custom-actions', slot: 'custom-actions' })))), this._getHeader(), h("div", { class: 'flex flex-1 flex-col' }, this._getRows()), this.enableFooter && (h("p-table-footer", {
-      // overall
-      hideOnSinglePage: this.hideOnSinglePage,
-      // page size select
-      enablePageSize: this.enablePageSize, pageSize: this.pageSize, pageSizeOptions: this.pageSizeOptions, onPageSizeChange: ({ detail }) => this.pageSizeChange.emit(detail),
-      // pagination
-      enablePagination: this.enablePagination, page: this.page, total: this.total, onPageChange: ({ detail }) => this.pageChange.emit(detail),
-      // export
-      enableExport: this.enableExport, onExport: () => this.export.emit(),
-      //loading
-      loading: this.footerLoading
-    })), this.enableFloatingMenu && this._enableRowSelection ? (h("p-floating-menu-container", { usedInTable: true, class: `${((_b = this.selectedRows) === null || _b === void 0 ? void 0 : _b.length) ? '' : 'inactive'} ${this._floatingMenuShown ? 'shown' : ''}` }, h("p-floating-menu-item", { hover: false, slot: 'floating-menu-item', class: ((_c = this._rowActionsFloating) === null || _c === void 0 ? void 0 : _c.length) ? 'hidden tablet:flex' : '' }, this.floatingMenuAmountSelectedTemplate((_d = this.selectedRows) === null || _d === void 0 ? void 0 : _d.length)), h("p-divider", { class: `mx-0 text-storm ${((_e = this._rowActionsFloating) === null || _e === void 0 ? void 0 : _e.length) ? 'hidden tablet:flex' : ''}`, variant: 'vertical', slot: 'floating-menu-item' }), ((_f = this._rowActionsFloating) === null || _f === void 0 ? void 0 : _f.length) &&
-      this._rowActionsFloating.map(a => (h("p-floating-menu-item", { slot: 'floating-menu-item', disabled: a.disabled, onClick: () => !a.disabled &&
-          !a.loading &&
-          !!a.action &&
-          a.type === 'single'
-          ? a.action(this.selectedRows[0], false)
-          : a.action(this.selectedRows, true) }, a.label, ' ', a.loading ? (h("p-loader", null)) : (h("p-icon", { variant: a.icon, rotate: a.iconRotate, flip: a.iconFlip }))))), ((_g = this._rowActionsFloating) === null || _g === void 0 ? void 0 : _g.length) && (h("p-divider", { class: 'mx-0 text-storm', variant: 'vertical', slot: 'floating-menu-item' })), h("p-floating-menu-item", { slot: 'floating-menu-item', onClick: () => this._selectAllChange(null, false) }, h("p-icon", { variant: 'negative' })))) : (''))));
-  }
-  async _setLocales() {
-    this._locales = await getLocaleComponentStrings(this._el);
-  }
-  onTableDefinitionUpdated() {
-    this._generateColumns();
-  }
-  keyDown({ key }) {
-    if (key !== 'Control' || this._ctrlDown === true) {
-      return;
+    constructor() {
+        this.items = undefined;
+        this.loading = false;
+        this.headerLoading = false;
+        this.footerLoading = false;
+        this.amountOfLoadingRows = 6;
+        this.enableRowSelection = true;
+        this.rowSelectionLimit = undefined;
+        this.enableRowClick = true;
+        this.selectedRows = [];
+        this.enableFloatingMenu = true;
+        this.floatingMenuAmountSelectedTemplate = (amount) => formatTranslation((amount === 1
+            ? this._locales.floating_menu?.amount_selected
+            : this._locales.floating_menu?.amount_selected_plural)?.replace('{{amount}}', amount));
+        this.selectionKey = undefined;
+        this.canSelectKey = undefined;
+        this.enableHeader = true;
+        this.quickFilters = [];
+        this.activeQuickFilterIdentifier = undefined;
+        this.enableSearch = true;
+        this.query = undefined;
+        this.enableFilter = true;
+        this.enableFilterDesktop = true;
+        this.selectedFiltersAmount = undefined;
+        this.filterButtonTemplate = undefined;
+        this.enableAction = false;
+        this.actionButtonLoading = false;
+        this.actionButtonEnabled = false;
+        this.actionButtonIcon = 'pencil';
+        this.actionButtonText = undefined;
+        this.actionButtonTemplate = undefined;
+        this.enableFooter = true;
+        this.enablePageSize = true;
+        this.enablePagination = true;
+        this.enableExport = true;
+        this.page = 1;
+        this.total = undefined;
+        this.pageSize = defaultSize;
+        this.pageSizeOptions = defaultSizeOptions;
+        this.hideOnSinglePage = true;
+        this.emptyStateHeader = () => formatTranslation(this._locales.empty_state?.no_filter.header);
+        this.emptyStateContent = () => formatTranslation(this._locales.empty_state?.no_filter.content);
+        this.emptyStateAction = () => formatTranslation(this._locales.empty_state?.no_filter.action);
+        this.enableEmptyStateAction = true;
+        this.emptyStateFilteredHeader = () => formatTranslation(this._locales.empty_state.filtered.header);
+        this.emptyStateFilteredContent = () => formatTranslation(this._locales.empty_state.filtered.content);
+        this.shadow = true;
+        this._locales = {};
+        this._columns = [];
+        this._items = [];
+        this._enableRowSelection = this.enableRowSelection;
+        this._rowSelectionLimit = undefined;
+        this._rowActionsFloating = [];
+        this._rowActionsRow = [];
     }
-    this._ctrlDown = true;
-  }
-  keyUp({ key }) {
-    if (key !== 'Control' || this._ctrlDown === false) {
-      return;
+    /**
+     * Event whenever the current selection changes
+     */
+    selectedRowsChange;
+    /**
+     * Event whenever a row is clicked
+     */
+    rowClick;
+    /**
+     * Event whenever a row is selected
+     */
+    rowSelected;
+    /**
+     * Event whenever a row is deselected
+     */
+    rowDeselected;
+    /**
+     * Event when the table has rendered
+     */
+    hasRendered;
+    /**
+     * Event when one of the quick filters is clicked
+     */
+    quickFilter;
+    /**
+     * Event when the query changes
+     */
+    queryChange;
+    /**
+     * Event when the filter button is clicked
+     */
+    filter;
+    /**
+     * Event when the action button is clicked
+     */
+    action;
+    /**
+     * Event whenever the page changes
+     */
+    pageChange;
+    /**
+     * Event whenever the page changes
+     */
+    pageSizeChange;
+    /**
+     * Event whenever the page changes
+     */
+    export;
+    /**
+     * Event whenever the empty state is clicked
+     */
+    emptyStateActionClick;
+    /* Empty state end */
+    /**
+     * The host element
+     */
+    _el;
+    _rowActionsFloatingAll = [];
+    _ctrlDown = false;
+    _hasCustomFilterSlot = false;
+    _hasCustomActionsSlot = false;
+    _floatingMenuShown = false;
+    _resizeTimeout;
+    componentWillLoad() {
+        this._hasCustomFilterSlot = !!this._el.querySelector(':scope > [slot="custom-filter"]');
+        this._hasCustomActionsSlot = !!this._el.querySelector(':scope > [slot="custom-actions"]');
+        this._setRowSelectionData();
+        this._setLocales();
+        this._parseItems(this.items);
+        this._generateColumns();
     }
-    this._ctrlDown = false;
-  }
-  visibilityChange() {
-    if (document.visibilityState !== 'hidden' || this._ctrlDown === false) {
-      return;
+    componentDidRender() {
+        this.hasRendered.emit();
     }
-    this._ctrlDown = false;
-  }
-  _parseItems(items) {
-    if (!items) {
-      this._items = [];
-      return;
+    render() {
+        return (h(Host, { key: 'd40d58b13bd7201a022eca5a39b780d1aa39379f', class: 'p-table' }, h("p-table-container", { key: '755a91d9f2d41e2f0327eb22f06689aecb3a7a48', shadow: this.shadow }, this.enableHeader && (h("p-table-header", { key: '433541f4c489ac6622ff70d9a7d862ecee36f6fb',
+            // quick filters
+            quickFilters: this.quickFilters, activeQuickFilterIdentifier: this.activeQuickFilterIdentifier, onQuickFilter: ({ detail }) => this.quickFilter.emit(detail),
+            // search
+            enableSearch: this.enableSearch, query: this.query, onQueryChange: ({ detail }) => this.queryChange.emit(detail),
+            // filter button
+            enableFilter: this.enableFilter, enableFilterDesktop: this.enableFilterDesktop, selectedFiltersAmount: this.selectedFiltersAmount, filterButtonTemplate: this.filterButtonTemplate, onFilter: () => this.filter.emit(),
+            // action button
+            enableAction: this.enableAction, actionIcon: this.actionButtonIcon, actionText: this.actionButtonText, actionLoading: this.actionButtonLoading, canUseAction: this.actionButtonEnabled, actionButtonTemplate: this.actionButtonTemplate, onAction: () => this.action.emit(), itemsSelectedAmount: this.selectedRows?.length,
+            //loading
+            loading: this.headerLoading }, this._hasCustomFilterSlot && (h("slot", { key: '3626d7f3684aa9c2832bea5053487f968f799a5f', name: 'custom-filter', slot: 'custom-filter' })), this._hasCustomActionsSlot && (h("slot", { key: '0456a6eef1c022ffa2e03a931c2aa35c70eade25', name: 'custom-actions', slot: 'custom-actions' })))), this._getHeader(), h("div", { key: '5782f47ed68f71c4cc78067cb339e57c60c3ab01', class: 'flex flex-1 flex-col' }, this._getRows()), this.enableFooter && (h("p-table-footer", { key: '3b468981fb52f8d57f1e49845ba4680a4c7cbc36',
+            // overall
+            hideOnSinglePage: this.hideOnSinglePage,
+            // page size select
+            enablePageSize: this.enablePageSize, pageSize: this.pageSize, pageSizeOptions: this.pageSizeOptions, onPageSizeChange: ({ detail }) => this.pageSizeChange.emit(detail),
+            // pagination
+            enablePagination: this.enablePagination, page: this.page, total: this.total, onPageChange: ({ detail }) => this.pageChange.emit(detail),
+            // export
+            enableExport: this.enableExport, onExport: () => this.export.emit(),
+            //loading
+            loading: this.footerLoading })), this.enableFloatingMenu && this._enableRowSelection ? (h("p-floating-menu-container", { usedInTable: true, class: `${this.selectedRows?.length ? '' : 'inactive'} ${this._floatingMenuShown ? 'shown' : ''}` }, h("p-floating-menu-item", { hover: false, slot: 'floating-menu-item', class: this._rowActionsFloating?.length ? 'hidden tablet:flex' : '' }, this.floatingMenuAmountSelectedTemplate(this.selectedRows?.length)), h("p-divider", { class: `mx-0 text-storm ${this._rowActionsFloating?.length ? 'hidden tablet:flex' : ''}`, variant: 'vertical', slot: 'floating-menu-item' }), this._rowActionsFloating?.length &&
+            this._rowActionsFloating.map(a => (h("p-floating-menu-item", { slot: 'floating-menu-item', disabled: a.disabled, onClick: () => !a.disabled &&
+                    !a.loading &&
+                    !!a.action &&
+                    a.type === 'single'
+                    ? a.action(this.selectedRows[0], false)
+                    : a.action(this.selectedRows, true) }, a.label, ' ', a.loading ? (h("p-loader", null)) : (h("p-icon", { variant: a.icon, rotate: a.iconRotate, flip: a.iconFlip }))))), this._rowActionsFloating?.length && (h("p-divider", { class: 'mx-0 text-storm', variant: 'vertical', slot: 'floating-menu-item' })), h("p-floating-menu-item", { slot: 'floating-menu-item', onClick: () => this._selectAllChange(null, false) }, h("p-icon", { variant: 'negative' })))) : (''))));
     }
-    if (Array.isArray(items)) {
-      this._items = items;
-      return;
+    async _setLocales() {
+        this._locales = await getLocaleComponentStrings(this._el);
     }
-    this._items = JSON.parse(items);
-  }
-  _setRowSelectionData() {
-    if (this._resizeTimeout) {
-      clearTimeout(this._resizeTimeout);
+    onTableDefinitionUpdated() {
+        this._generateColumns();
     }
-    // We add a timeout here because it's a lot easier on the machine to do these when someone is done
-    // resizing and playing around with their browser
-    this._resizeTimeout = setTimeout(() => {
-      var _a, _b;
-      const mobile = isMobile();
-      // we hack this to any[] to make it work..
-      const actions = Array.from(this._el.querySelectorAll(':scope > p-table-row-action'));
-      this._rowActionsRow = actions.filter(a => a.type === 'both' || a.type === 'single');
-      this._rowActionsFloatingAll = actions
-        .filter(a => (this.enableRowSelection &&
-        (a.type === 'both' || a.type === 'multi')) ||
-        (mobile && a.type === 'single'))
-        .map(a => {
-        var _a;
-        if (a.type === 'single') {
-          a.disabled = ((_a = this.selectedRows) === null || _a === void 0 ? void 0 : _a.length) > 1;
+    keyDown({ key }) {
+        if (key !== 'Control' || this._ctrlDown === true) {
+            return;
         }
-        return a;
-      });
-      let rowSelectionLimit = this.rowSelectionLimit;
-      if (mobile && // we're mobile
-        ((_a = this._rowActionsFloatingAll) === null || _a === void 0 ? void 0 : _a.length) && // we have atleast 1 item in _rowActionsFloating
-        ((rowSelectionLimit !== undefined && this.enableRowSelection) ||
-          !this.enableRowSelection)) {
-        rowSelectionLimit = 1;
-      }
-      this._rowSelectionLimit = rowSelectionLimit;
-      let enableRowSelection = this.enableRowSelection;
-      if (mobile && // we're mobile
-        ((_b = this._rowActionsFloatingAll) === null || _b === void 0 ? void 0 : _b.length) && // we have atleast 1 item in _rowActionsFloating
-        !enableRowSelection) {
-        enableRowSelection = true;
-      }
-      this._enableRowSelection = enableRowSelection;
-      if (this._floatingMenuShown) {
-        this._showFloatingMenu();
-      }
-    }, 200);
-  }
-  _generateColumns() {
-    const definitions = this._el.querySelectorAll('p-table-column');
-    let definitionsArray = Array.from(definitions);
-    definitionsArray = this._parseDefinitions(definitionsArray);
-    this._columns = definitionsArray;
-  }
-  _getHeader() {
-    return (h("p-table-row", { variant: 'header' }, this._columns.map((col, index) => (h("p-table-cell", { definition: col, value: col.name, variant: 'header', checkbox: index === 0 || col.hasCheckbox
-        ? this._getCheckbox(null, this.loading ? 'loading' : 'header')
-        : null, index: index })))));
-  }
-  _getRows() {
-    if (this.loading) {
-      return Array.from({
-        length: this.amountOfLoadingRows,
-      }, (_, i) => (h("p-table-row", { enableHover: this._enableRowSelection || this.enableRowClick }, this._getLoadingColumns(i))));
+        this._ctrlDown = true;
     }
-    if (!this._items.length) {
-      return this._getEmptyState();
-    }
-    return this._items.map((item, index) => (h("p-table-row", { enableHover: this._enableRowSelection || this.enableRowClick, onClick: ev => this._rowClick(ev, index) }, this._getRowColumns(item, index))));
-  }
-  _getRowColumns(item, index) {
-    const actions = this._rowActionsRow.filter(a => a.showFunction ? a.showFunction(item) : true);
-    const columns = this._columns.map((col, colIndex) => {
-      return (h("p-table-cell", { definition: col, item: item, checkbox: colIndex === 0 || col.hasCheckbox ? this._getCheckbox(index) : null, index: colIndex, rowIndex: index, tableHasActions: !!actions.length && !isMobile() }));
-    });
-    if ((actions === null || actions === void 0 ? void 0 : actions.length) && !isMobile()) {
-      const def = this._parseRowActionsRowDefinition();
-      if (!actions.length) {
-        return columns;
-      }
-      columns.push(h("p-table-cell", { variant: 'actions', definition: def, item: item, index: this._columns.length - 1, rowIndex: index, tableHasActions: true }, h("div", { slot: 'actions', class: 'ml-auto flex items-center gap-2' }, actions.map(a => (h("p-tooltip", { content: a.label }, h("p-button", { "data-is-action": true, variant: 'secondary', slot: 'trigger', icon: a.icon, iconRotate: a.iconRotate, iconFlip: a.iconFlip, iconOnly: true, size: 'sm', onClick: () => { var _a; return typeof a.action === 'function' && ((_a = a.action) === null || _a === void 0 ? void 0 : _a.call(a, item, false)); } })))))));
-    }
-    return columns;
-  }
-  _getLoadingColumns(index) {
-    return this._columns.map((col, colIndex) => {
-      return (h("p-table-cell", { definition: col, variant: 'loading', checkbox: colIndex === 0 || col.hasCheckbox
-          ? this._getCheckbox(index, 'loading')
-          : null, index: colIndex, rowIndex: index }));
-    });
-  }
-  _getCheckbox(rowIndex, variant = 'default') {
-    var _a;
-    if (!this._enableRowSelection ||
-      (!this.selectionKey && !((_a = this._rowActionsFloating) === null || _a === void 0 ? void 0 : _a.length))) {
-      return;
-    }
-    if (variant === 'loading') {
-      return (h("p-loader", { variant: 'ghost', class: 'h-6 w-6 rounded' }));
-    }
-    if (variant === 'header') {
-      return (h("input", { class: `p-input ${this._rowSelectionLimit !== undefined && 'opacity-0'}`, type: 'checkbox', onChange: ev => this._selectAllChange(ev), checked: this._selectionContainsAll(), indeterminate: this._selectionIndeterminate(), disabled: this._rowSelectionLimit !== undefined }));
-    }
-    const item = this._items[rowIndex];
-    const selectionContains = this._selectionContains(rowIndex);
-    return (h("input", { class: 'p-input', type: 'checkbox', onChange: ev => this._checkboxChange(ev === null || ev === void 0 ? void 0 : ev.target, rowIndex), disabled: (this.canSelectKey && !item[this.canSelectKey]) ||
-        (this._rowSelectionLimit !== undefined &&
-          !selectionContains &&
-          this.selectedRows.length === this._rowSelectionLimit), checked: selectionContains }));
-  }
-  _getEmptyState() {
-    var _a;
-    if (((_a = this.query) === null || _a === void 0 ? void 0 : _a.length) || this.selectedFiltersAmount) {
-      return (h("div", { class: 'flex max-w-[20rem] flex-col items-center self-center py-24 text-center' }, h("p-illustration", { variant: 'empty-state-search', class: 'mb-6' }), h("p", { class: 'text-storm-default font-semibold' }, this.emptyStateFilteredHeader()), h("p", { class: 'mb-14 text-sm text-storm-medium' }, this.emptyStateFilteredContent())));
-    }
-    return (h("div", { class: `flex max-w-[20rem] flex-col items-center self-center py-24 text-center ${this.enableEmptyStateAction && 'cursor-pointer'}`, onClick: () => this.enableEmptyStateAction && this.emptyStateActionClick.emit(null) }, h("p-illustration", { variant: 'empty-state-add', class: 'mb-6' }), h("p", { class: 'text-storm-default font-semibold' }, this.emptyStateHeader()), h("p", { class: 'mb-6 text-sm text-storm-medium' }, this.emptyStateContent()), this.enableEmptyStateAction && (h("p-button", { variant: 'secondary', icon: 'plus', size: 'sm' }, this.emptyStateAction()))));
-  }
-  _selectAllChange($event, forceValue) {
-    if (!this._enableRowSelection) {
-      return;
+    keyUp({ key }) {
+        if (key !== 'Control' || this._ctrlDown === false) {
+            return;
+        }
+        this._ctrlDown = false;
     }
-    const value = forceValue === undefined
-      ? this._getCheckedValue($event.target)
-      : forceValue;
-    if (value) {
-      const toAdd = [];
-      for (let i = 0; i < this._items.length; i++) {
-        const row = this._items[i];
-        if (this.canSelectKey && !row[this.canSelectKey]) {
-          continue;
+    visibilityChange() {
+        if (document.visibilityState !== 'hidden' || this._ctrlDown === false) {
+            return;
         }
-        if (this._selectionContains(i)) {
-          continue;
+        this._ctrlDown = false;
+    }
+    _parseItems(items) {
+        if (!items) {
+            this._items = [];
+            return;
         }
-        toAdd.push(row);
-        this.rowSelected.emit(row);
-        if (this._rowSelectionLimit !== undefined &&
-          this.selectedRows.length + toAdd.length === this._rowSelectionLimit) {
-          break;
+        if (Array.isArray(items)) {
+            this._items = items;
+            return;
         }
-      }
-      this.selectedRows = [...this.selectedRows, ...toAdd];
-      this.selectedRowsChange.emit(this.selectedRows);
-      if (this.enableFloatingMenu && !this._floatingMenuShown) {
-        this._showFloatingMenu();
-      }
-      return;
-    }
-    for (let i = 0; i < this.selectedRows.length; i++) {
-      const value = this.selectedRows[i];
-      const row = this._items.find(d => this._getSelectionValue(d, i) === this._getSelectionValue(value, i));
-      if (!row) {
-        continue;
-      }
-      this.rowDeselected.emit(row);
-    }
-    this.selectedRows = [];
-    this.selectedRowsChange.emit(this.selectedRows);
-  }
-  _checkboxChange(target, index) {
-    if (!this._enableRowSelection) {
-      return;
-    }
-    const value = this._getCheckedValue(target);
-    if (value &&
-      this._rowSelectionLimit !== undefined &&
-      this.selectedRows.length >= this._rowSelectionLimit) {
-      target.checked = false;
-      return;
-    }
-    const row = this._items[index];
-    if (this.canSelectKey && !row[this.canSelectKey]) {
-      target.checked = false;
-      return;
-    }
-    if (value) {
-      this.selectedRows = [
-        ...this.selectedRows,
-        Object.assign(Object.assign({}, row), { index }),
-      ];
-      this.selectedRowsChange.emit(this.selectedRows);
-      this.rowSelected.emit(row);
-      if (this.enableFloatingMenu && !this._floatingMenuShown) {
-        this._showFloatingMenu();
-      }
-      return;
-    }
-    const indexOfToRemove = this._selectionContains(index, true);
-    // we need to do this, because splice does not trigger the selection setter.
-    const selection = [...this.selectedRows];
-    selection.splice(indexOfToRemove, 1);
-    this.selectedRows = selection;
-    this.selectedRowsChange.emit(this.selectedRows);
-    this.rowDeselected.emit(row);
-  }
-  _getCheckedValue(target) {
-    return target === null || target === void 0 ? void 0 : target.checked;
-  }
-  _getSelectionValue(row, index) {
-    return this.selectionKey ? (row === null || row === void 0 ? void 0 : row[this.selectionKey]) || index : index;
-  }
-  _selectionContains(index, returnIndex = false) {
-    const returnValue = this.selectedRows.findIndex(item => item.index === index);
-    return !returnIndex ? returnValue >= 0 : returnValue;
-  }
-  _selectionContainsAll() {
-    var _a, _b;
-    let returnValue = true;
-    if (!((_a = this._items) === null || _a === void 0 ? void 0 : _a.length)) {
-      return false;
-    }
-    if (this._rowSelectionLimit !== undefined &&
-      this.selectedRows.length === this._rowSelectionLimit) {
-      return true;
-    }
-    for (let i = 0; i < ((_b = this._items) === null || _b === void 0 ? void 0 : _b.length); i++) {
-      const contains = this._selectionContains(i);
-      if (!contains) {
-        returnValue = false;
-        break;
-      }
-    }
-    return returnValue;
-  }
-  _selectionIndeterminate() {
-    var _a, _b, _c;
-    if (!((_a = this._items) === null || _a === void 0 ? void 0 : _a.length) || !((_b = this.selectedRows) === null || _b === void 0 ? void 0 : _b.length)) {
-      return false;
-    }
-    if (this._rowSelectionLimit !== undefined &&
-      this.selectedRows.length === this._rowSelectionLimit) {
-      return false;
-    }
-    let containsCount = 0;
-    for (let i = 0; i < ((_c = this._items) === null || _c === void 0 ? void 0 : _c.length); i++) {
-      const contains = this._selectionContains(i);
-      if (contains) {
-        containsCount++;
-      }
+        this._items = JSON.parse(items);
     }
-    return containsCount > 0 && containsCount !== this._items.length;
-  }
-  _rowClick($event, index) {
-    const target = $event.target;
-    if (target.tagName.toLowerCase() === 'input' ||
-      target.type === 'checkbox') {
-      return;
-    }
-    const row = this._findRow($event.target);
-    const action = this._findRowAction($event.target);
-    if (action) {
-      return;
-    }
-    if (this.enableRowClick) {
-      const item = this._items[index];
-      this.rowClick.emit({
-        item,
-        ctrlDown: this._ctrlDown,
-      });
-      return;
-    }
-    if (!this._enableRowSelection) {
-      return;
-    }
-    const checkbox = row === null || row === void 0 ? void 0 : row.querySelector('input[type="checkbox"]');
-    if (!checkbox) {
-      return;
-    }
-    checkbox.checked = !checkbox.checked;
-    this._checkboxChange(checkbox, index);
-  }
-  _findRow(el) {
-    var _a;
-    if (!el) {
-      return el;
+    _setRowSelectionData() {
+        if (this._resizeTimeout) {
+            clearTimeout(this._resizeTimeout);
+        }
+        // We add a timeout here because it's a lot easier on the machine to do these when someone is done
+        // resizing and playing around with their browser
+        this._resizeTimeout = setTimeout(() => {
+            const mobile = isMobile();
+            // we hack this to any[] to make it work..
+            const actions = Array.from(this._el.querySelectorAll(':scope > p-table-row-action'));
+            this._rowActionsRow = actions.filter(a => a.type === 'both' || a.type === 'single');
+            this._rowActionsFloatingAll = actions
+                .filter(a => (this.enableRowSelection &&
+                (a.type === 'both' || a.type === 'multi')) ||
+                (mobile && a.type === 'single'))
+                .map(a => {
+                if (a.type === 'single') {
+                    a.disabled = this.selectedRows?.length > 1;
+                }
+                return a;
+            });
+            let rowSelectionLimit = this.rowSelectionLimit;
+            if (mobile && // we're mobile
+                this._rowActionsFloatingAll?.length && // we have atleast 1 item in _rowActionsFloating
+                ((rowSelectionLimit !== undefined && this.enableRowSelection) ||
+                    !this.enableRowSelection)) {
+                rowSelectionLimit = 1;
+            }
+            this._rowSelectionLimit = rowSelectionLimit;
+            let enableRowSelection = this.enableRowSelection;
+            if (mobile && // we're mobile
+                this._rowActionsFloatingAll?.length && // we have atleast 1 item in _rowActionsFloating
+                !enableRowSelection) {
+                enableRowSelection = true;
+            }
+            this._enableRowSelection = enableRowSelection;
+            if (this._floatingMenuShown) {
+                this._showFloatingMenu();
+            }
+        }, 200);
     }
-    if (((_a = el === null || el === void 0 ? void 0 : el.tagName) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === 'p-table-row') {
-      return el;
+    _generateColumns() {
+        const definitions = this._el.querySelectorAll('p-table-column');
+        let definitionsArray = Array.from(definitions);
+        definitionsArray = this._parseDefinitions(definitionsArray);
+        this._columns = definitionsArray;
     }
-    return this._findRow(el === null || el === void 0 ? void 0 : el.parentElement);
-  }
-  _findRowAction(el) {
-    var _a;
-    if (!el) {
-      return null;
+    _getHeader() {
+        return (h("p-table-row", { variant: 'header' }, this._columns.map((col, index) => (h("p-table-cell", { definition: col, value: col.name, variant: 'header', checkbox: index === 0 || col.hasCheckbox
+                ? this._getCheckbox(null, this.loading ? 'loading' : 'header')
+                : null, index: index })))));
     }
-    if (el.getAttribute('data-is-action') !== null &&
-      el.getAttribute('data-is-action') !== 'false') {
-      return el;
+    _getRows() {
+        if (this.loading) {
+            return Array.from({
+                length: this.amountOfLoadingRows,
+            }, (_, i) => (h("p-table-row", { enableHover: this._enableRowSelection || this.enableRowClick }, this._getLoadingColumns(i))));
+        }
+        if (!this._items.length) {
+            return this._getEmptyState();
+        }
+        return this._items.map((item, index) => (h("p-table-row", { enableHover: this._enableRowSelection || this.enableRowClick, onClick: ev => this._rowClick(ev, index) }, this._getRowColumns(item, index))));
     }
-    if (((_a = el === null || el === void 0 ? void 0 : el.tagName) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === 'p-table-row') {
-      return null;
+    _getRowColumns(item, index) {
+        const actions = this._rowActionsRow.filter(a => a.showFunction ? a.showFunction(item) : true);
+        const columns = this._columns.map((col, colIndex) => {
+            return (h("p-table-cell", { definition: col, item: item, checkbox: colIndex === 0 || col.hasCheckbox ? this._getCheckbox(index) : null, index: colIndex, rowIndex: index, tableHasActions: !!actions.length && !isMobile() }));
+        });
+        if (actions?.length && !isMobile()) {
+            const def = this._parseRowActionsRowDefinition();
+            if (!actions.length) {
+                return columns;
+            }
+            columns.push(h("p-table-cell", { variant: 'actions', definition: def, item: item, index: this._columns.length - 1, rowIndex: index, tableHasActions: true }, h("div", { slot: 'actions', class: 'ml-auto flex items-center gap-2' }, actions.map(a => (h("p-tooltip", { content: a.label }, h("p-button", { "data-is-action": true, variant: 'secondary', slot: 'trigger', icon: a.icon, iconRotate: a.iconRotate, iconFlip: a.iconFlip, iconOnly: true, size: 'sm', onClick: () => typeof a.action === 'function' && a.action?.(item, false) })))))));
+        }
+        return columns;
     }
-    return this._findRowAction(el === null || el === void 0 ? void 0 : el.parentElement);
-  }
-  _showFloatingMenu() {
-    let actions = this._rowActionsFloatingAll;
-    if (this.rowSelectionLimit === 1 &&
-      actions.findIndex(a => (a.type === 'single' || a.type === 'both') && a.showFunction) >= 0) {
-      actions = actions.filter(a => a.type === 'multi' ||
-        !a.showFunction ||
-        a.showFunction(this.selectedRows[0]));
+    _getLoadingColumns(index) {
+        return this._columns.map((col, colIndex) => {
+            return (h("p-table-cell", { definition: col, variant: 'loading', checkbox: colIndex === 0 || col.hasCheckbox
+                    ? this._getCheckbox(index, 'loading')
+                    : null, index: colIndex, rowIndex: index }));
+        });
     }
-    this._rowActionsFloating = actions;
-    this._floatingMenuShown = true;
-  }
-  _parseDefinitions(definitionsArray) {
-    const definitions = definitionsArray.map(definition => {
-      definition = this._parseDefinitionSizes(definition);
-      definition.isLast = {};
-      return definition;
-    });
-    const matchedIsLast = tableColumSizesOptions.reduce((data, size) => {
-      data[size] = false;
-      return data;
-    }, {});
-    for (let i = definitions.length - 1; i >= 0; i--) {
-      const definition = definitions[i];
-      for (const size of tableColumSizesOptions) {
-        if (matchedIsLast[size]) {
-          definition.isLast[size] = false;
-          continue;
+    _getCheckbox(rowIndex, variant = 'default') {
+        if (!this._enableRowSelection ||
+            (!this.selectionKey && !this._rowActionsFloating?.length)) {
+            return;
         }
-        if (definition.parsedSizes[size] === 'hidden') {
-          definition.isLast[size] = false;
-          continue;
+        if (variant === 'loading') {
+            return (h("p-loader", { variant: 'ghost', class: 'h-6 w-6 rounded' }));
         }
-        const isLastAtSizeFound = this._findLastDefinitionBySize(definitions, size);
-        if (isLastAtSizeFound) {
-          definition.isLast[size] = false;
-          continue;
+        if (variant === 'header') {
+            return (h("p-checkbox", { class: cn({
+                    'opacity-0': this._rowSelectionLimit !== undefined,
+                }), checked: this._selectionContainsAll(), indeterminate: this._selectionIndeterminate(), disabled: this._rowSelectionLimit !== undefined, onCheckedChange: ev => this._selectAllChange(ev) }));
         }
-        definition.isLast[size] = true;
-      }
-    }
-    return definitions;
-  }
-  _findLastDefinitionBySize(definitions, size) {
-    return definitions
-      .slice()
-      .reverse()
-      .find(d => d.isLast[size] === true);
-  }
-  _parseDefinitionSizes(definition) {
-    var _a;
-    const definitionAny = definition;
-    let parsedSizes = { default: 'full' };
-    if (typeof definition.sizes === 'string' &&
-      !['auto', 'hidden', 'full'].includes(definition.sizes)) {
-      definition.sizes = JSON.parse(definition.sizes);
-    }
-    for (const [index, size] of tableColumSizesOptions.entries()) {
-      if (definitionAny.sizes === 'auto' ||
-        definitionAny.sizes === 'hidden' ||
-        definitionAny.sizes === 'full' ||
-        typeof definitionAny.sizes === 'number') {
-        parsedSizes[size] =
-          definitionAny.sizes === 'auto' ? 'full' : definitionAny.sizes;
-        continue;
-      }
-      parsedSizes[size] =
-        (_a = definitionAny.sizes[size]) !== null && _a !== void 0 ? _a : parsedSizes[tableColumSizesOptions[index - 1]];
+        const item = this._items[rowIndex];
+        const selectionContains = this._selectionContains(rowIndex);
+        return (h("p-checkbox", { disabled: (this.canSelectKey && !item[this.canSelectKey]) ||
+                (this._rowSelectionLimit !== undefined &&
+                    !selectionContains &&
+                    this.selectedRows.length === this._rowSelectionLimit), checked: selectionContains, onCheckedChange: ev => this._checkboxChange(ev, rowIndex) }));
     }
-    definition.parsedSizes = parsedSizes;
-    return definition;
-  }
-  _parseRowActionsRowDefinition() {
-    const isLast = tableColumSizesOptions.reduce((data, size) => {
-      data[size] = true;
-      return data;
-    }, {});
-    const sizes = { default: 0 };
-    for (const size of tableColumSizesOptions) {
-      const lastColumn = this._findLastDefinitionBySize(this._columns, size);
-      sizes[size] = lastColumn.parsedSizes[size];
+    _getEmptyState() {
+        if (this.query?.length || this.selectedFiltersAmount) {
+            return (h("div", { class: 'flex max-w-[20rem] flex-col items-center self-center py-24 text-center' }, h("p-illustration", { variant: 'empty-state-search', class: 'mb-6' }), h("p", { class: 'text-storm-default font-semibold' }, this.emptyStateFilteredHeader()), h("p", { class: 'mb-14 text-sm text-storm-medium' }, this.emptyStateFilteredContent())));
+        }
+        return (h("div", { class: `flex max-w-[20rem] flex-col items-center self-center py-24 text-center ${this.enableEmptyStateAction && 'cursor-pointer'}`, onClick: () => this.enableEmptyStateAction && this.emptyStateActionClick.emit(null) }, h("p-illustration", { variant: 'empty-state-add', class: 'mb-6' }), h("p", { class: 'text-storm-default font-semibold' }, this.emptyStateHeader()), h("p", { class: 'mb-6 text-sm text-storm-medium' }, this.emptyStateContent()), this.enableEmptyStateAction && (h("p-button", { variant: 'secondary', icon: 'plus', size: 'sm' }, this.emptyStateAction()))));
     }
-    return {
-      isLast,
-      sizes,
-      parsedSizes: sizes,
-      align: 'end',
-      type: 'td',
-      path: null,
-    };
-  }
-  static get is() { return "p-table"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["table.component.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["table.component.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "items": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The items to be fed to the table"
-        },
-        "attribute": "items",
-        "reflect": false
-      },
-      "loading": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Wether data is loading"
-        },
-        "attribute": "loading",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "headerLoading": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Wether the header should show loading state"
-        },
-        "attribute": "header-loading",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "footerLoading": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Wether the footer should show loading state"
-        },
-        "attribute": "footer-loading",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "amountOfLoadingRows": {
-        "type": "number",
-        "mutable": false,
-        "complexType": {
-          "original": "number",
-          "resolved": "number",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The amount of loading rows to show"
-        },
-        "attribute": "amount-of-loading-rows",
-        "reflect": false,
-        "defaultValue": "6"
-      },
-      "enableRowSelection": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Wether to enable selection"
-        },
-        "attribute": "enable-row-selection",
-        "reflect": false,
-        "defaultValue": "true"
-      },
-      "rowSelectionLimit": {
-        "type": "number",
-        "mutable": false,
-        "complexType": {
-          "original": "number | undefined",
-          "resolved": "number",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "A limit to the amount of rows that can be selected"
-        },
-        "attribute": "row-selection-limit",
-        "reflect": false
-      },
-      "enableRowClick": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Wether to enable row clicking"
-        },
-        "attribute": "enable-row-click",
-        "reflect": false,
-        "defaultValue": "true"
-      },
-      "selectedRows": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "any[]",
-          "resolved": "any[]",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The current selection of items"
-        },
-        "defaultValue": "[]"
-      },
-      "enableFloatingMenu": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Wether to enable the floating menu"
-        },
-        "attribute": "enable-floating-menu",
-        "reflect": false,
-        "defaultValue": "true"
-      },
-      "floatingMenuAmountSelectedTemplate": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "amountSelectedTemplateFunc",
-          "resolved": "(amount: number) => string",
-          "references": {
-            "amountSelectedTemplateFunc": {
-              "location": "local",
-              "path": "/home/runner/work/Paperless/Paperless/packages/core/src/components/organisms/table/table.component.tsx",
-              "id": "src/components/organisms/table/table.component.tsx::amountSelectedTemplateFunc"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The template for amount selected item in the floating menu"
-        },
-        "defaultValue": "(\n\t\tamount: number\n\t) =>\n\t\tformatTranslation(\n\t\t\t(amount === 1\n\t\t\t\t? this._locales.floating_menu?.amount_selected\n\t\t\t\t: this._locales.floating_menu?.amount_selected_plural\n\t\t\t)?.replace('{{amount}}', amount)\n\t\t)"
-      },
-      "selectionKey": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The key to determine if a row is selected"
-        },
-        "attribute": "selection-key",
-        "reflect": false
-      },
-      "canSelectKey": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "A key to determine if a row can be selected"
-        },
-        "attribute": "can-select-key",
-        "reflect": false
-      },
-      "enableHeader": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Wether to show the header"
-        },
-        "attribute": "enable-header",
-        "reflect": false,
-        "defaultValue": "true"
-      },
-      "quickFilters": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "QuickFilter[]",
-          "resolved": "QuickFilter[]",
-          "references": {
-            "QuickFilter": {
-              "location": "import",
-              "path": "../../../types/table",
-              "id": "src/types/table.ts::QuickFilter"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Quick filters to show"
-        },
-        "defaultValue": "[]"
-      },
-      "activeQuickFilterIdentifier": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Active quick filter identifier"
-        },
-        "attribute": "active-quick-filter-identifier",
-        "reflect": false
-      },
-      "enableSearch": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Wether to show the search input"
-        },
-        "attribute": "enable-search",
-        "reflect": false,
-        "defaultValue": "true"
-      },
-      "query": {
-        "type": "string",
-        "mutable": true,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The query to show in the search bar"
-        },
-        "attribute": "query",
-        "reflect": false
-      },
-      "enableFilter": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Wether to show the filter button"
-        },
-        "attribute": "enable-filter",
-        "reflect": false,
-        "defaultValue": "true"
-      },
-      "enableFilterDesktop": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Wether to show the filter button on desktop"
-        },
-        "attribute": "enable-filter-desktop",
-        "reflect": false,
-        "defaultValue": "true"
-      },
-      "selectedFiltersAmount": {
-        "type": "number",
-        "mutable": false,
-        "complexType": {
-          "original": "number",
-          "resolved": "number",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The amount of filters being selected"
-        },
-        "attribute": "selected-filters-amount",
-        "reflect": false
-      },
-      "filterButtonTemplate": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "templateFunc",
-          "resolved": "() => string",
-          "references": {
-            "templateFunc": {
-              "location": "local",
-              "path": "/home/runner/work/Paperless/Paperless/packages/core/src/components/organisms/table/table.component.tsx",
-              "id": "src/components/organisms/table/table.component.tsx::templateFunc"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The template for the filter button text"
+    _selectAllChange({ detail: checked }, forceValue) {
+        if (!this._enableRowSelection) {
+            return;
         }
-      },
-      "enableAction": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Wether to show the action button"
-        },
-        "attribute": "enable-action",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "actionButtonLoading": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Wether the action button is loading"
-        },
-        "attribute": "action-button-loading",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "actionButtonEnabled": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Wether the action button is enabled"
-        },
-        "attribute": "action-button-enabled",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "actionButtonIcon": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "IconVariant",
-          "resolved": "\"caret\" | \"double-caret\" | \"arrow\" | \"double-arrow\" | \"bell\" | \"chat\" | \"check-circle\" | \"cross-circle\" | \"error-circle\" | \"info-circle\" | \"phone\" | \"question-circle\" | \"headset\" | \"warning\" | \"attachment\" | \"description\" | \"document\" | \"folder\" | \"pdf\" | \"xls\" | \"bank\" | \"bread\" | \"cake\" | \"calculator\" | \"camera\" | \"car\" | \"certified\" | \"chair\" | \"checkmark\" | \"city\" | \"companies\" | \"company\" | \"credit-card\" | \"cutlery\" | \"department\" | \"diamond\" | \"docter\" | \"download\" | \"envelope\" | \"euro\" | \"exam\" | \"filter\" | \"flower\" | \"globe\" | \"globe-2\" | \"hash\" | \"hat\" | \"home\" | \"integration\" | \"language\" | \"laptop\" | \"location\" | \"mail\" | \"medal\" | \"menu\" | \"menu-arrow\" | \"minus\" | \"more\" | \"negative\" | \"other\" | \"pay\" | \"pencil\" | \"percent\" | \"pie-chart\" | \"placeholder\" | \"plus\" | \"power\" | \"receipt\" | \"reset\" | \"search\" | \"send\" | \"settings\" | \"shuffle\" | \"sick\" | \"signature\" | \"sparkle\" | \"star\" | \"stroller\" | \"tag\" | \"tasks\" | \"tools\" | \"tooth\" | \"train\" | \"trash\" | \"upload\" | \"wave\" | \"zipcode\" | \"eye\" | \"eye-closed\" | \"key\" | \"lock\" | \"unlocked\" | \"alarm\" | \"calendar\" | \"calendar-multi\" | \"calendar-free\" | \"calendar-not-free\" | \"clock\" | \"female\" | \"id\" | \"id-two\" | \"male\" | \"user\" | \"users\"",
-          "references": {
-            "IconVariant": {
-              "location": "import",
-              "path": "../../../components",
-              "id": "src/components.d.ts::IconVariant"
+        const value = forceValue === undefined ? checked : forceValue;
+        if (value) {
+            const toAdd = [];
+            for (let i = 0; i < this._items.length; i++) {
+                const row = this._items[i];
+                if (this.canSelectKey && !row[this.canSelectKey]) {
+                    continue;
+                }
+                if (this._selectionContains(i)) {
+                    continue;
+                }
+                toAdd.push(row);
+                this.rowSelected.emit(row);
+                if (this._rowSelectionLimit !== undefined &&
+                    this.selectedRows.length + toAdd.length === this._rowSelectionLimit) {
+                    break;
+                }
             }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The action button icon"
-        },
-        "attribute": "action-button-icon",
-        "reflect": false,
-        "defaultValue": "'pencil'"
-      },
-      "actionButtonText": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The action button text if changed"
-        },
-        "attribute": "action-button-text",
-        "reflect": false
-      },
-      "actionButtonTemplate": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "buttonTemplateFunc",
-          "resolved": "(amount: number) => string",
-          "references": {
-            "buttonTemplateFunc": {
-              "location": "import",
-              "path": "../../molecules/table-header/table-header.component",
-              "id": "src/components/molecules/table-header/table-header.component.tsx::buttonTemplateFunc"
+            this.selectedRows = [...this.selectedRows, ...toAdd];
+            this.selectedRowsChange.emit(this.selectedRows);
+            if (this.enableFloatingMenu && !this._floatingMenuShown) {
+                this._showFloatingMenu();
             }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The template for the action button text"
+            return;
         }
-      },
-      "enableFooter": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Wether to show the header"
-        },
-        "attribute": "enable-footer",
-        "reflect": false,
-        "defaultValue": "true"
-      },
-      "enablePageSize": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Wether to enable page size select"
-        },
-        "attribute": "enable-page-size",
-        "reflect": false,
-        "defaultValue": "true"
-      },
-      "enablePagination": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Wether to enable pagination"
-        },
-        "attribute": "enable-pagination",
-        "reflect": false,
-        "defaultValue": "true"
-      },
-      "enableExport": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Wether to enable export"
-        },
-        "attribute": "enable-export",
-        "reflect": false,
-        "defaultValue": "true"
-      },
-      "page": {
-        "type": "number",
-        "mutable": true,
-        "complexType": {
-          "original": "number",
-          "resolved": "number",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The current page"
-        },
-        "attribute": "page",
-        "reflect": true,
-        "defaultValue": "1"
-      },
-      "total": {
-        "type": "number",
-        "mutable": false,
-        "complexType": {
-          "original": "number",
-          "resolved": "number",
-          "references": {}
-        },
-        "required": true,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The total amount of items"
-        },
-        "attribute": "total",
-        "reflect": false
-      },
-      "pageSize": {
-        "type": "number",
-        "mutable": false,
-        "complexType": {
-          "original": "number",
-          "resolved": "number",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The amount of items per page"
-        },
-        "attribute": "page-size",
-        "reflect": false,
-        "defaultValue": "defaultSize"
-      },
-      "pageSizeOptions": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "number[]",
-          "resolved": "number[]",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The options for the page size"
-        },
-        "defaultValue": "defaultSizeOptions"
-      },
-      "hideOnSinglePage": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Wether to hide when there is only 1 page available"
-        },
-        "attribute": "hide-on-single-page",
-        "reflect": false,
-        "defaultValue": "true"
-      },
-      "emptyStateHeader": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "templateFunc",
-          "resolved": "() => string",
-          "references": {
-            "templateFunc": {
-              "location": "local",
-              "path": "/home/runner/work/Paperless/Paperless/packages/core/src/components/organisms/table/table.component.tsx",
-              "id": "src/components/organisms/table/table.component.tsx::templateFunc"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "defaultValue": "() =>\n\t\tformatTranslation(this._locales.empty_state?.no_filter.header)"
-      },
-      "emptyStateContent": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "templateFunc",
-          "resolved": "() => string",
-          "references": {
-            "templateFunc": {
-              "location": "local",
-              "path": "/home/runner/work/Paperless/Paperless/packages/core/src/components/organisms/table/table.component.tsx",
-              "id": "src/components/organisms/table/table.component.tsx::templateFunc"
+        for (let i = 0; i < this.selectedRows.length; i++) {
+            const value = this.selectedRows[i];
+            const row = this._items.find(d => this._getSelectionValue(d, i) === this._getSelectionValue(value, i));
+            if (!row) {
+                continue;
             }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "defaultValue": "() =>\n\t\tformatTranslation(this._locales.empty_state?.no_filter.content)"
-      },
-      "emptyStateAction": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "templateFunc",
-          "resolved": "() => string",
-          "references": {
-            "templateFunc": {
-              "location": "local",
-              "path": "/home/runner/work/Paperless/Paperless/packages/core/src/components/organisms/table/table.component.tsx",
-              "id": "src/components/organisms/table/table.component.tsx::templateFunc"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "defaultValue": "() =>\n\t\tformatTranslation(this._locales.empty_state?.no_filter.action)"
-      },
-      "enableEmptyStateAction": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Wether to enable empty state action"
-        },
-        "attribute": "enable-empty-state-action",
-        "reflect": false,
-        "defaultValue": "true"
-      },
-      "emptyStateFilteredHeader": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "templateFunc",
-          "resolved": "() => string",
-          "references": {
-            "templateFunc": {
-              "location": "local",
-              "path": "/home/runner/work/Paperless/Paperless/packages/core/src/components/organisms/table/table.component.tsx",
-              "id": "src/components/organisms/table/table.component.tsx::templateFunc"
+            this.rowDeselected.emit(row);
+        }
+        this.selectedRows = [];
+        this.selectedRowsChange.emit(this.selectedRows);
+    }
+    _checkboxChange({ detail: checked, target }, index) {
+        if (!this._enableRowSelection) {
+            return;
+        }
+        if (checked &&
+            this._rowSelectionLimit !== undefined &&
+            this.selectedRows.length >= this._rowSelectionLimit) {
+            target.checked = false;
+            return;
+        }
+        const row = this._items[index];
+        if (this.canSelectKey && !row[this.canSelectKey]) {
+            target.checked = false;
+            return;
+        }
+        if (checked) {
+            this.selectedRows = [
+                ...this.selectedRows,
+                {
+                    ...row,
+                    index,
+                },
+            ];
+            this.selectedRowsChange.emit(this.selectedRows);
+            this.rowSelected.emit(row);
+            if (this.enableFloatingMenu && !this._floatingMenuShown) {
+                this._showFloatingMenu();
             }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "defaultValue": "() =>\n\t\tformatTranslation(this._locales.empty_state.filtered.header)"
-      },
-      "emptyStateFilteredContent": {
-        "type": "unknown",
-        "mutable": false,
-        "complexType": {
-          "original": "templateFunc",
-          "resolved": "() => string",
-          "references": {
-            "templateFunc": {
-              "location": "local",
-              "path": "/home/runner/work/Paperless/Paperless/packages/core/src/components/organisms/table/table.component.tsx",
-              "id": "src/components/organisms/table/table.component.tsx::templateFunc"
+            return;
+        }
+        const indexOfToRemove = this._selectionContains(index, true);
+        // we need to do this, because splice does not trigger the selection setter.
+        const selection = [...this.selectedRows];
+        selection.splice(indexOfToRemove, 1);
+        this.selectedRows = selection;
+        this.selectedRowsChange.emit(this.selectedRows);
+        this.rowDeselected.emit(row);
+    }
+    _getSelectionValue(row, index) {
+        return this.selectionKey ? row?.[this.selectionKey] || index : index;
+    }
+    _selectionContains(index, returnIndex = false) {
+        const returnValue = this.selectedRows.findIndex(item => item.index === index);
+        return !returnIndex ? returnValue >= 0 : returnValue;
+    }
+    _selectionContainsAll() {
+        let returnValue = true;
+        if (!this._items?.length) {
+            return false;
+        }
+        if (this._rowSelectionLimit !== undefined &&
+            this.selectedRows.length === this._rowSelectionLimit) {
+            return true;
+        }
+        for (let i = 0; i < this._items?.length; i++) {
+            const contains = this._selectionContains(i);
+            if (!contains) {
+                returnValue = false;
+                break;
             }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "defaultValue": "() =>\n\t\tformatTranslation(this._locales.empty_state.filtered.content)"
-      },
-      "shadow": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "shadow",
-        "reflect": false,
-        "defaultValue": "true"
-      }
-    };
-  }
-  static get states() {
-    return {
-      "_locales": {},
-      "_columns": {},
-      "_items": {},
-      "_enableRowSelection": {},
-      "_rowSelectionLimit": {},
-      "_rowActionsFloating": {},
-      "_rowActionsRow": {}
-    };
-  }
-  static get events() {
-    return [{
-        "method": "selectedRowsChange",
-        "name": "selectedRowsChange",
-        "bubbles": false,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Event whenever the current selection changes"
-        },
-        "complexType": {
-          "original": "any",
-          "resolved": "any",
-          "references": {}
         }
-      }, {
-        "method": "rowClick",
-        "name": "rowClick",
-        "bubbles": false,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Event whenever a row is clicked"
-        },
-        "complexType": {
-          "original": "RowClickEvent",
-          "resolved": "RowClickEvent",
-          "references": {
-            "RowClickEvent": {
-              "location": "import",
-              "path": "../../../types/table",
-              "id": "src/types/table.ts::RowClickEvent"
+        return returnValue;
+    }
+    _selectionIndeterminate() {
+        if (!this._items?.length || !this.selectedRows?.length) {
+            return false;
+        }
+        if (this._rowSelectionLimit !== undefined &&
+            this.selectedRows.length === this._rowSelectionLimit) {
+            return false;
+        }
+        let containsCount = 0;
+        for (let i = 0; i < this._items?.length; i++) {
+            const contains = this._selectionContains(i);
+            if (contains) {
+                containsCount++;
             }
-          }
         }
-      }, {
-        "method": "rowSelected",
-        "name": "rowSelected",
-        "bubbles": false,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Event whenever a row is selected"
-        },
-        "complexType": {
-          "original": "any",
-          "resolved": "any",
-          "references": {}
+        return containsCount > 0 && containsCount !== this._items.length;
+    }
+    _rowClick($event, index) {
+        const target = $event.target;
+        if (target.tagName.toLowerCase() === 'input' ||
+            target.type === 'checkbox') {
+            return;
         }
-      }, {
-        "method": "rowDeselected",
-        "name": "rowDeselected",
-        "bubbles": false,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Event whenever a row is deselected"
-        },
-        "complexType": {
-          "original": "any",
-          "resolved": "any",
-          "references": {}
+        const row = this._findRow($event.target);
+        const action = this._findRowAction($event.target);
+        if (action) {
+            return;
         }
-      }, {
-        "method": "hasRendered",
-        "name": "hasRendered",
-        "bubbles": false,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Event when the table has rendered"
-        },
-        "complexType": {
-          "original": "number",
-          "resolved": "number",
-          "references": {}
+        if (this.enableRowClick) {
+            const item = this._items[index];
+            this.rowClick.emit({
+                item,
+                ctrlDown: this._ctrlDown,
+            });
+            return;
         }
-      }, {
-        "method": "quickFilter",
-        "name": "quickFilter",
-        "bubbles": false,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Event when one of the quick filters is clicked"
-        },
-        "complexType": {
-          "original": "QuickFilter",
-          "resolved": "QuickFilter",
-          "references": {
-            "QuickFilter": {
-              "location": "import",
-              "path": "../../../types/table",
-              "id": "src/types/table.ts::QuickFilter"
-            }
-          }
+        if (!this._enableRowSelection) {
+            return;
+        }
+        const checkbox = row?.querySelector('input[type="checkbox"]');
+        if (!checkbox) {
+            return;
         }
-      }, {
-        "method": "queryChange",
-        "name": "queryChange",
-        "bubbles": false,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Event when the query changes"
-        },
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
+        checkbox.checked = !checkbox.checked;
+        this._checkboxChange(checkbox, index);
+    }
+    _findRow(el) {
+        if (!el) {
+            return el;
         }
-      }, {
-        "method": "filter",
-        "name": "filter",
-        "bubbles": false,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Event when the filter button is clicked"
-        },
-        "complexType": {
-          "original": "null",
-          "resolved": "null",
-          "references": {}
+        if (el?.tagName?.toLowerCase() === 'p-table-row') {
+            return el;
         }
-      }, {
-        "method": "action",
-        "name": "action",
-        "bubbles": false,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Event when the action button is clicked"
-        },
-        "complexType": {
-          "original": "null",
-          "resolved": "null",
-          "references": {}
+        return this._findRow(el?.parentElement);
+    }
+    _findRowAction(el) {
+        if (!el) {
+            return null;
         }
-      }, {
-        "method": "pageChange",
-        "name": "pageChange",
-        "bubbles": false,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Event whenever the page changes"
-        },
-        "complexType": {
-          "original": "number",
-          "resolved": "number",
-          "references": {}
+        if (el.getAttribute('data-is-action') !== null &&
+            el.getAttribute('data-is-action') !== 'false') {
+            return el;
         }
-      }, {
-        "method": "pageSizeChange",
-        "name": "pageSizeChange",
-        "bubbles": false,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Event whenever the page changes"
-        },
-        "complexType": {
-          "original": "number",
-          "resolved": "number",
-          "references": {}
+        if (el?.tagName?.toLowerCase() === 'p-table-row') {
+            return null;
         }
-      }, {
-        "method": "export",
-        "name": "export",
-        "bubbles": false,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Event whenever the page changes"
-        },
-        "complexType": {
-          "original": "number",
-          "resolved": "number",
-          "references": {}
+        return this._findRowAction(el?.parentElement);
+    }
+    _showFloatingMenu() {
+        let actions = this._rowActionsFloatingAll;
+        if (this.rowSelectionLimit === 1 &&
+            actions.findIndex(a => (a.type === 'single' || a.type === 'both') && a.showFunction) >= 0) {
+            actions = actions.filter(a => a.type === 'multi' ||
+                !a.showFunction ||
+                a.showFunction(this.selectedRows[0]));
         }
-      }, {
-        "method": "emptyStateActionClick",
-        "name": "emptyStateActionClick",
-        "bubbles": false,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "Event whenever the empty state is clicked"
-        },
-        "complexType": {
-          "original": "null",
-          "resolved": "null",
-          "references": {}
+        this._rowActionsFloating = actions;
+        this._floatingMenuShown = true;
+    }
+    _parseDefinitions(definitionsArray) {
+        const definitions = definitionsArray.map(definition => {
+            definition = this._parseDefinitionSizes(definition);
+            definition.isLast = {};
+            return definition;
+        });
+        const matchedIsLast = tableColumSizesOptions.reduce((data, size) => {
+            data[size] = false;
+            return data;
+        }, {});
+        for (let i = definitions.length - 1; i >= 0; i--) {
+            const definition = definitions[i];
+            for (const size of tableColumSizesOptions) {
+                if (matchedIsLast[size]) {
+                    definition.isLast[size] = false;
+                    continue;
+                }
+                if (definition.parsedSizes[size] === 'hidden') {
+                    definition.isLast[size] = false;
+                    continue;
+                }
+                const isLastAtSizeFound = this._findLastDefinitionBySize(definitions, size);
+                if (isLastAtSizeFound) {
+                    definition.isLast[size] = false;
+                    continue;
+                }
+                definition.isLast[size] = true;
+            }
         }
-      }];
-  }
-  static get elementRef() { return "_el"; }
-  static get watchers() {
-    return [{
-        "propName": "items",
-        "methodName": "_parseItems"
-      }, {
-        "propName": "enableRowSelection",
-        "methodName": "_setRowSelectionData"
-      }, {
-        "propName": "rowSelectionLimit",
-        "methodName": "_setRowSelectionData"
-      }, {
-        "propName": "selectedRows",
-        "methodName": "_setRowSelectionData"
-      }];
-  }
-  static get listeners() {
-    return [{
-        "name": "localeChanged",
-        "method": "_setLocales",
-        "target": "body",
-        "capture": false,
-        "passive": false
-      }, {
-        "name": "tableDefinitionChanged",
-        "method": "onTableDefinitionUpdated",
-        "target": "body",
-        "capture": false,
-        "passive": false
-      }, {
-        "name": "keydown",
-        "method": "keyDown",
-        "target": "document",
-        "capture": false,
-        "passive": false
-      }, {
-        "name": "keyup",
-        "method": "keyUp",
-        "target": "document",
-        "capture": false,
-        "passive": false
-      }, {
-        "name": "visibilitychange",
-        "method": "visibilityChange",
-        "target": "document",
-        "capture": false,
-        "passive": false
-      }, {
-        "name": "resize",
-        "method": "_setRowSelectionData",
-        "target": "window",
-        "capture": false,
-        "passive": true
-      }];
-  }
+        return definitions;
+    }
+    _findLastDefinitionBySize(definitions, size) {
+        return definitions
+            .slice()
+            .reverse()
+            .find(d => d.isLast[size] === true);
+    }
+    _parseDefinitionSizes(definition) {
+        const definitionAny = definition;
+        let parsedSizes = { default: 'full' };
+        if (typeof definition.sizes === 'string' &&
+            !['auto', 'hidden', 'full'].includes(definition.sizes)) {
+            definition.sizes = JSON.parse(definition.sizes);
+        }
+        for (const [index, size] of tableColumSizesOptions.entries()) {
+            if (definitionAny.sizes === 'auto' ||
+                definitionAny.sizes === 'hidden' ||
+                definitionAny.sizes === 'full' ||
+                typeof definitionAny.sizes === 'number') {
+                parsedSizes[size] =
+                    definitionAny.sizes === 'auto' ? 'full' : definitionAny.sizes;
+                continue;
+            }
+            parsedSizes[size] =
+                definitionAny.sizes[size] ??
+                    parsedSizes[tableColumSizesOptions[index - 1]];
+        }
+        definition.parsedSizes = parsedSizes;
+        return definition;
+    }
+    _parseRowActionsRowDefinition() {
+        const isLast = tableColumSizesOptions.reduce((data, size) => {
+            data[size] = true;
+            return data;
+        }, {});
+        const sizes = { default: 0 };
+        for (const size of tableColumSizesOptions) {
+            const lastColumn = this._findLastDefinitionBySize(this._columns, size);
+            sizes[size] = lastColumn.parsedSizes[size];
+        }
+        return {
+            isLast,
+            sizes,
+            parsedSizes: sizes,
+            align: 'end',
+            type: 'td',
+            path: null,
+        };
+    }
+    static get is() { return "p-table"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["table.component.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["table.component.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "items": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The items to be fed to the table"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "items",
+                "reflect": false
+            },
+            "loading": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Wether data is loading"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "loading",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "headerLoading": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Wether the header should show loading state"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "header-loading",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "footerLoading": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Wether the footer should show loading state"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "footer-loading",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "amountOfLoadingRows": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The amount of loading rows to show"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "amount-of-loading-rows",
+                "reflect": false,
+                "defaultValue": "6"
+            },
+            "enableRowSelection": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Wether to enable selection"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "enable-row-selection",
+                "reflect": false,
+                "defaultValue": "true"
+            },
+            "rowSelectionLimit": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number | undefined",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "A limit to the amount of rows that can be selected"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "row-selection-limit",
+                "reflect": false
+            },
+            "enableRowClick": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Wether to enable row clicking"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "enable-row-click",
+                "reflect": false,
+                "defaultValue": "true"
+            },
+            "selectedRows": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "any[]",
+                    "resolved": "any[]",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The current selection of items"
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "[]"
+            },
+            "enableFloatingMenu": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Wether to enable the floating menu"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "enable-floating-menu",
+                "reflect": false,
+                "defaultValue": "true"
+            },
+            "floatingMenuAmountSelectedTemplate": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "amountSelectedTemplateFunc",
+                    "resolved": "(amount: number) => string",
+                    "references": {
+                        "amountSelectedTemplateFunc": {
+                            "location": "local",
+                            "path": "/home/runner/work/Paperless/Paperless/packages/core/src/components/organisms/table/table.component.tsx",
+                            "id": "src/components/organisms/table/table.component.tsx::amountSelectedTemplateFunc"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The template for amount selected item in the floating menu"
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "(\n\t\tamount: number\n\t) =>\n\t\tformatTranslation(\n\t\t\t(amount === 1\n\t\t\t\t? this._locales.floating_menu?.amount_selected\n\t\t\t\t: this._locales.floating_menu?.amount_selected_plural\n\t\t\t)?.replace('{{amount}}', amount)\n\t\t)"
+            },
+            "selectionKey": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The key to determine if a row is selected"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "selection-key",
+                "reflect": false
+            },
+            "canSelectKey": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "A key to determine if a row can be selected"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "can-select-key",
+                "reflect": false
+            },
+            "enableHeader": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Wether to show the header"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "enable-header",
+                "reflect": false,
+                "defaultValue": "true"
+            },
+            "quickFilters": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "QuickFilter[]",
+                    "resolved": "QuickFilter[]",
+                    "references": {
+                        "QuickFilter": {
+                            "location": "import",
+                            "path": "../../../types/table",
+                            "id": "src/types/table.ts::QuickFilter"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Quick filters to show"
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "[]"
+            },
+            "activeQuickFilterIdentifier": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Active quick filter identifier"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "active-quick-filter-identifier",
+                "reflect": false
+            },
+            "enableSearch": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Wether to show the search input"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "enable-search",
+                "reflect": false,
+                "defaultValue": "true"
+            },
+            "query": {
+                "type": "string",
+                "mutable": true,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The query to show in the search bar"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "query",
+                "reflect": false
+            },
+            "enableFilter": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Wether to show the filter button"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "enable-filter",
+                "reflect": false,
+                "defaultValue": "true"
+            },
+            "enableFilterDesktop": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Wether to show the filter button on desktop"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "enable-filter-desktop",
+                "reflect": false,
+                "defaultValue": "true"
+            },
+            "selectedFiltersAmount": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The amount of filters being selected"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "selected-filters-amount",
+                "reflect": false
+            },
+            "filterButtonTemplate": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "templateFunc",
+                    "resolved": "() => string",
+                    "references": {
+                        "templateFunc": {
+                            "location": "local",
+                            "path": "/home/runner/work/Paperless/Paperless/packages/core/src/components/organisms/table/table.component.tsx",
+                            "id": "src/components/organisms/table/table.component.tsx::templateFunc"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The template for the filter button text"
+                },
+                "getter": false,
+                "setter": false
+            },
+            "enableAction": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Wether to show the action button"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "enable-action",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "actionButtonLoading": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Wether the action button is loading"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "action-button-loading",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "actionButtonEnabled": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Wether the action button is enabled"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "action-button-enabled",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "actionButtonIcon": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "IconVariant",
+                    "resolved": "\"caret\" | \"double-caret\" | \"arrow\" | \"double-arrow\" | \"bell\" | \"chat\" | \"check-circle\" | \"cross-circle\" | \"error-circle\" | \"info-circle\" | \"phone\" | \"question-circle\" | \"headset\" | \"warning\" | \"attachment\" | \"description\" | \"document\" | \"folder\" | \"pdf\" | \"xls\" | \"bank\" | \"bread\" | \"cake\" | \"calculator\" | \"camera\" | \"car\" | \"certified\" | \"chair\" | \"checkmark\" | \"city\" | \"companies\" | \"company\" | \"credit-card\" | \"cutlery\" | \"department\" | \"diamond\" | \"docter\" | \"download\" | \"envelope\" | \"euro\" | \"exam\" | \"filter\" | \"flower\" | \"globe\" | \"globe-2\" | \"hash\" | \"hat\" | \"home\" | \"integration\" | \"language\" | \"laptop\" | \"location\" | \"mail\" | \"medal\" | \"menu\" | \"menu-arrow\" | \"minus\" | \"more\" | \"negative\" | \"other\" | \"pay\" | \"pencil\" | \"percent\" | \"pie-chart\" | \"placeholder\" | \"plus\" | \"power\" | \"receipt\" | \"reset\" | \"search\" | \"send\" | \"settings\" | \"shuffle\" | \"sick\" | \"signature\" | \"sparkle\" | \"star\" | \"stroller\" | \"tag\" | \"tasks\" | \"tools\" | \"tooth\" | \"train\" | \"trash\" | \"upload\" | \"wave\" | \"zipcode\" | \"eye\" | \"eye-closed\" | \"key\" | \"lock\" | \"unlocked\" | \"alarm\" | \"calendar\" | \"calendar-multi\" | \"calendar-free\" | \"calendar-not-free\" | \"clock\" | \"female\" | \"id\" | \"id-two\" | \"male\" | \"user\" | \"users\"",
+                    "references": {
+                        "IconVariant": {
+                            "location": "import",
+                            "path": "../../../components",
+                            "id": "src/components.d.ts::IconVariant"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The action button icon"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "action-button-icon",
+                "reflect": false,
+                "defaultValue": "'pencil'"
+            },
+            "actionButtonText": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The action button text if changed"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "action-button-text",
+                "reflect": false
+            },
+            "actionButtonTemplate": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "buttonTemplateFunc",
+                    "resolved": "(amount: number) => string",
+                    "references": {
+                        "buttonTemplateFunc": {
+                            "location": "import",
+                            "path": "../../molecules/table-header/table-header.component",
+                            "id": "src/components/molecules/table-header/table-header.component.tsx::buttonTemplateFunc"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The template for the action button text"
+                },
+                "getter": false,
+                "setter": false
+            },
+            "enableFooter": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Wether to show the header"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "enable-footer",
+                "reflect": false,
+                "defaultValue": "true"
+            },
+            "enablePageSize": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Wether to enable page size select"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "enable-page-size",
+                "reflect": false,
+                "defaultValue": "true"
+            },
+            "enablePagination": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Wether to enable pagination"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "enable-pagination",
+                "reflect": false,
+                "defaultValue": "true"
+            },
+            "enableExport": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Wether to enable export"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "enable-export",
+                "reflect": false,
+                "defaultValue": "true"
+            },
+            "page": {
+                "type": "number",
+                "mutable": true,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The current page"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "page",
+                "reflect": true,
+                "defaultValue": "1"
+            },
+            "total": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": true,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The total amount of items"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "total",
+                "reflect": false
+            },
+            "pageSize": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The amount of items per page"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "page-size",
+                "reflect": false,
+                "defaultValue": "defaultSize"
+            },
+            "pageSizeOptions": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "number[]",
+                    "resolved": "number[]",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The options for the page size"
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "defaultSizeOptions"
+            },
+            "hideOnSinglePage": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Wether to hide when there is only 1 page available"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "hide-on-single-page",
+                "reflect": false,
+                "defaultValue": "true"
+            },
+            "emptyStateHeader": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "templateFunc",
+                    "resolved": "() => string",
+                    "references": {
+                        "templateFunc": {
+                            "location": "local",
+                            "path": "/home/runner/work/Paperless/Paperless/packages/core/src/components/organisms/table/table.component.tsx",
+                            "id": "src/components/organisms/table/table.component.tsx::templateFunc"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "() =>\n\t\tformatTranslation(this._locales.empty_state?.no_filter.header)"
+            },
+            "emptyStateContent": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "templateFunc",
+                    "resolved": "() => string",
+                    "references": {
+                        "templateFunc": {
+                            "location": "local",
+                            "path": "/home/runner/work/Paperless/Paperless/packages/core/src/components/organisms/table/table.component.tsx",
+                            "id": "src/components/organisms/table/table.component.tsx::templateFunc"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "() =>\n\t\tformatTranslation(this._locales.empty_state?.no_filter.content)"
+            },
+            "emptyStateAction": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "templateFunc",
+                    "resolved": "() => string",
+                    "references": {
+                        "templateFunc": {
+                            "location": "local",
+                            "path": "/home/runner/work/Paperless/Paperless/packages/core/src/components/organisms/table/table.component.tsx",
+                            "id": "src/components/organisms/table/table.component.tsx::templateFunc"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "() =>\n\t\tformatTranslation(this._locales.empty_state?.no_filter.action)"
+            },
+            "enableEmptyStateAction": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Wether to enable empty state action"
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "enable-empty-state-action",
+                "reflect": false,
+                "defaultValue": "true"
+            },
+            "emptyStateFilteredHeader": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "templateFunc",
+                    "resolved": "() => string",
+                    "references": {
+                        "templateFunc": {
+                            "location": "local",
+                            "path": "/home/runner/work/Paperless/Paperless/packages/core/src/components/organisms/table/table.component.tsx",
+                            "id": "src/components/organisms/table/table.component.tsx::templateFunc"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "() =>\n\t\tformatTranslation(this._locales.empty_state.filtered.header)"
+            },
+            "emptyStateFilteredContent": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "templateFunc",
+                    "resolved": "() => string",
+                    "references": {
+                        "templateFunc": {
+                            "location": "local",
+                            "path": "/home/runner/work/Paperless/Paperless/packages/core/src/components/organisms/table/table.component.tsx",
+                            "id": "src/components/organisms/table/table.component.tsx::templateFunc"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "() =>\n\t\tformatTranslation(this._locales.empty_state.filtered.content)"
+            },
+            "shadow": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "attribute": "shadow",
+                "reflect": false,
+                "defaultValue": "true"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "_locales": {},
+            "_columns": {},
+            "_items": {},
+            "_enableRowSelection": {},
+            "_rowSelectionLimit": {},
+            "_rowActionsFloating": {},
+            "_rowActionsRow": {}
+        };
+    }
+    static get events() {
+        return [{
+                "method": "selectedRowsChange",
+                "name": "selectedRowsChange",
+                "bubbles": false,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event whenever the current selection changes"
+                },
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                }
+            }, {
+                "method": "rowClick",
+                "name": "rowClick",
+                "bubbles": false,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event whenever a row is clicked"
+                },
+                "complexType": {
+                    "original": "RowClickEvent",
+                    "resolved": "RowClickEvent",
+                    "references": {
+                        "RowClickEvent": {
+                            "location": "import",
+                            "path": "../../../types/table",
+                            "id": "src/types/table.ts::RowClickEvent"
+                        }
+                    }
+                }
+            }, {
+                "method": "rowSelected",
+                "name": "rowSelected",
+                "bubbles": false,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event whenever a row is selected"
+                },
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                }
+            }, {
+                "method": "rowDeselected",
+                "name": "rowDeselected",
+                "bubbles": false,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event whenever a row is deselected"
+                },
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                }
+            }, {
+                "method": "hasRendered",
+                "name": "hasRendered",
+                "bubbles": false,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event when the table has rendered"
+                },
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                }
+            }, {
+                "method": "quickFilter",
+                "name": "quickFilter",
+                "bubbles": false,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event when one of the quick filters is clicked"
+                },
+                "complexType": {
+                    "original": "QuickFilter",
+                    "resolved": "QuickFilter",
+                    "references": {
+                        "QuickFilter": {
+                            "location": "import",
+                            "path": "../../../types/table",
+                            "id": "src/types/table.ts::QuickFilter"
+                        }
+                    }
+                }
+            }, {
+                "method": "queryChange",
+                "name": "queryChange",
+                "bubbles": false,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event when the query changes"
+                },
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                }
+            }, {
+                "method": "filter",
+                "name": "filter",
+                "bubbles": false,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event when the filter button is clicked"
+                },
+                "complexType": {
+                    "original": "null",
+                    "resolved": "null",
+                    "references": {}
+                }
+            }, {
+                "method": "action",
+                "name": "action",
+                "bubbles": false,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event when the action button is clicked"
+                },
+                "complexType": {
+                    "original": "null",
+                    "resolved": "null",
+                    "references": {}
+                }
+            }, {
+                "method": "pageChange",
+                "name": "pageChange",
+                "bubbles": false,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event whenever the page changes"
+                },
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                }
+            }, {
+                "method": "pageSizeChange",
+                "name": "pageSizeChange",
+                "bubbles": false,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event whenever the page changes"
+                },
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                }
+            }, {
+                "method": "export",
+                "name": "export",
+                "bubbles": false,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event whenever the page changes"
+                },
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                }
+            }, {
+                "method": "emptyStateActionClick",
+                "name": "emptyStateActionClick",
+                "bubbles": false,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Event whenever the empty state is clicked"
+                },
+                "complexType": {
+                    "original": "null",
+                    "resolved": "null",
+                    "references": {}
+                }
+            }];
+    }
+    static get elementRef() { return "_el"; }
+    static get watchers() {
+        return [{
+                "propName": "items",
+                "methodName": "_parseItems"
+            }, {
+                "propName": "enableRowSelection",
+                "methodName": "_setRowSelectionData"
+            }, {
+                "propName": "rowSelectionLimit",
+                "methodName": "_setRowSelectionData"
+            }, {
+                "propName": "selectedRows",
+                "methodName": "_setRowSelectionData"
+            }];
+    }
+    static get listeners() {
+        return [{
+                "name": "localeChanged",
+                "method": "_setLocales",
+                "target": "body",
+                "capture": false,
+                "passive": false
+            }, {
+                "name": "tableDefinitionChanged",
+                "method": "onTableDefinitionUpdated",
+                "target": "body",
+                "capture": false,
+                "passive": false
+            }, {
+                "name": "keydown",
+                "method": "keyDown",
+                "target": "document",
+                "capture": false,
+                "passive": false
+            }, {
+                "name": "keyup",
+                "method": "keyUp",
+                "target": "document",
+                "capture": false,
+                "passive": false
+            }, {
+                "name": "visibilitychange",
+                "method": "visibilityChange",
+                "target": "document",
+                "capture": false,
+                "passive": false
+            }, {
+                "name": "resize",
+                "method": "_setRowSelectionData",
+                "target": "window",
+                "capture": false,
+                "passive": true
+            }];
+    }
 }
 //# sourceMappingURL=table.component.js.map