@addsign/moje-agenda-shared-lib 0.0.98 → 0.0.100
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/assets/tailwind.css +23 -2
- package/dist/components/Button.d.ts +1 -1
- package/dist/components/Button.js +1 -0
- package/dist/components/Button.js.map +1 -1
- package/dist/components/datatable/DataTable.js +1 -2
- package/dist/components/datatable/DataTable.js.map +1 -1
- package/dist/components/datatable/DataTableServer.d.ts +2 -1
- package/dist/components/datatable/DataTableServer.js +66 -57
- package/dist/components/datatable/DataTableServer.js.map +1 -1
- package/dist/components/datatable/DatatableSettings.js +1 -1
- package/dist/components/datatable/types.d.ts +1 -0
- package/dist/components/form/AutocompleteSearchBar.js +1 -2
- package/dist/components/form/AutocompleteSearchBar.js.map +1 -1
- package/dist/components/form/DateRangeField.js +2 -2
- package/dist/components/form/DateRangeField.js.map +1 -1
- package/dist/components/form/FileInput.js +1 -2
- package/dist/components/form/FileInput.js.map +1 -1
- package/dist/components/form/FormField.js +1 -2
- package/dist/components/form/FormField.js.map +1 -1
- package/dist/components/form/InputField.js +1 -1
- package/dist/components/form/PositionsSelectorSingle.js +1 -2
- package/dist/components/form/PositionsSelectorSingle.js.map +1 -1
- package/dist/components/form/RadioGroup.d.ts +8 -0
- package/dist/components/form/RadioGroup.js +59 -0
- package/dist/components/form/RadioGroup.js.map +1 -0
- package/dist/components/form/SelectField.js +1 -1
- package/dist/components/layout/IconInCircle.js +1 -1
- package/dist/{index-CxF6lTek.js → index-BMFehNPK.js} +13 -13
- package/dist/{index-CxF6lTek.js.map → index-BMFehNPK.js.map} +1 -1
- package/dist/main.d.ts +1 -1
- package/dist/main.js +18 -18
- package/package.json +1 -1
package/dist/assets/tailwind.css
CHANGED
|
@@ -931,8 +931,8 @@ video {
|
|
|
931
931
|
.min-w-\[100px\] {
|
|
932
932
|
min-width: 100px;
|
|
933
933
|
}
|
|
934
|
-
.
|
|
935
|
-
|
|
934
|
+
.min-w-\[180px\] {
|
|
935
|
+
min-width: 180px;
|
|
936
936
|
}
|
|
937
937
|
.max-w-full {
|
|
938
938
|
max-width: 100%;
|
|
@@ -1284,6 +1284,9 @@ video {
|
|
|
1284
1284
|
--tw-border-opacity: 1;
|
|
1285
1285
|
border-color: rgb(139 92 246 / var(--tw-border-opacity));
|
|
1286
1286
|
}
|
|
1287
|
+
.border-warning-border {
|
|
1288
|
+
border-color: var(--color-warning-border);
|
|
1289
|
+
}
|
|
1287
1290
|
.border-yellow-500 {
|
|
1288
1291
|
--tw-border-opacity: 1;
|
|
1289
1292
|
border-color: rgb(234 179 8 / var(--tw-border-opacity));
|
|
@@ -1303,6 +1306,9 @@ video {
|
|
|
1303
1306
|
.\!bg-transparent {
|
|
1304
1307
|
background-color: transparent !important;
|
|
1305
1308
|
}
|
|
1309
|
+
.\!bg-warning {
|
|
1310
|
+
background-color: var(--color-warning) !important;
|
|
1311
|
+
}
|
|
1306
1312
|
.bg-amber-100 {
|
|
1307
1313
|
--tw-bg-opacity: 1;
|
|
1308
1314
|
background-color: rgb(254 243 199 / var(--tw-bg-opacity));
|
|
@@ -1649,6 +1655,12 @@ video {
|
|
|
1649
1655
|
padding-top: 1px;
|
|
1650
1656
|
padding-bottom: 1px;
|
|
1651
1657
|
}
|
|
1658
|
+
.\!pl-\[8px\] {
|
|
1659
|
+
padding-left: 8px !important;
|
|
1660
|
+
}
|
|
1661
|
+
.\!pr-8 {
|
|
1662
|
+
padding-right: 2rem !important;
|
|
1663
|
+
}
|
|
1652
1664
|
.pb-0 {
|
|
1653
1665
|
padding-bottom: 0px;
|
|
1654
1666
|
}
|
|
@@ -2000,6 +2012,9 @@ video {
|
|
|
2000
2012
|
--tw-text-opacity: 1;
|
|
2001
2013
|
color: rgb(124 58 237 / var(--tw-text-opacity));
|
|
2002
2014
|
}
|
|
2015
|
+
.text-warning-text {
|
|
2016
|
+
color: var(--color-warning-text);
|
|
2017
|
+
}
|
|
2003
2018
|
.text-white {
|
|
2004
2019
|
--tw-text-opacity: 1;
|
|
2005
2020
|
color: rgb(255 255 255 / var(--tw-text-opacity));
|
|
@@ -2152,6 +2167,12 @@ video {
|
|
|
2152
2167
|
|
|
2153
2168
|
|
|
2154
2169
|
|
|
2170
|
+
.hover\:\!bg-warning-hover:hover {
|
|
2171
|
+
background-color: var(--color-warning-hover) !important;
|
|
2172
|
+
}
|
|
2173
|
+
|
|
2174
|
+
|
|
2175
|
+
|
|
2155
2176
|
.hover\:bg-amber-600:hover {
|
|
2156
2177
|
--tw-bg-opacity: 1;
|
|
2157
2178
|
background-color: rgb(217 119 6 / var(--tw-bg-opacity));
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
type ButtonVariant = "primary" | "secondary" | "transparent" | "success" | "danger" | "icon";
|
|
2
|
+
type ButtonVariant = "primary" | "secondary" | "transparent" | "success" | "danger" | "warning" | "icon";
|
|
3
3
|
interface IButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
4
4
|
variant?: ButtonVariant;
|
|
5
5
|
}
|
|
@@ -7,6 +7,7 @@ const buttonStyles = {
|
|
|
7
7
|
transparent: "!bg-transparent border border-transparent hover:bg-gray-100 hover:border-gray-200 ",
|
|
8
8
|
success: "!bg-success hover:!bg-success-hover text-success-text ",
|
|
9
9
|
danger: "!bg-danger hover:!bg-danger-hover text-danger-text ",
|
|
10
|
+
warning: "!bg-warning hover:!bg-warning-hover text-warning-text border border-warning-border",
|
|
10
11
|
icon: " !rounded-full text-center inline-flex items-center "
|
|
11
12
|
};
|
|
12
13
|
const Button = ({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.js","sources":["../../lib/components/Button.tsx"],"sourcesContent":["import * as React from \"react\";\r\nimport \"../css/tailwind.css\";\r\n\r\ntype ButtonVariant =\r\n | \"primary\"\r\n | \"secondary\"\r\n | \"transparent\"\r\n | \"success\"\r\n | \"danger\"\r\n | \"icon\";\r\n\r\ninterface IButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\r\n variant?: ButtonVariant;\r\n}\r\nconst commonStyles =\r\n \" py-1 px-4 leading-[32px] min-h-[32px] w-fit rounded-lg whitespace-nowrap font-medium disabled:opacity-50 \";\r\nconst buttonStyles: { [key in ButtonVariant]: string } = {\r\n primary: \"!bg-primary hover:!bg-primary-hover text-primary-text \",\r\n secondary:\r\n \"!bg-secondary hover:!bg-secondary-hover text-secondary-text border border-secondary-border \",\r\n transparent:\r\n \"!bg-transparent border border-transparent hover:bg-gray-100 hover:border-gray-200 \",\r\n success: \"!bg-success hover:!bg-success-hover text-success-text \",\r\n danger: \"!bg-danger hover:!bg-danger-hover text-danger-text \",\r\n\r\n icon: \" !rounded-full text-center inline-flex items-center \",\r\n};\r\nconst Button: React.FC<IButtonProps> = ({\r\n variant = \"primary\",\r\n children,\r\n onClick,\r\n className,\r\n ...props\r\n}) => {\r\n const classNames = commonStyles + buttonStyles[variant];\r\n return (\r\n <button\r\n className={classNames + \" \" + (className || \" sharedLibraryource \")}\r\n onClick={onClick}\r\n {...props}\r\n >\r\n {children}\r\n </button>\r\n );\r\n};\r\n\r\nexport default Button;\r\n"],"names":[],"mappings":";;
|
|
1
|
+
{"version":3,"file":"Button.js","sources":["../../lib/components/Button.tsx"],"sourcesContent":["import * as React from \"react\";\r\nimport \"../css/tailwind.css\";\r\n\r\ntype ButtonVariant =\r\n | \"primary\"\r\n | \"secondary\"\r\n | \"transparent\"\r\n | \"success\"\r\n | \"danger\"\r\n | \"warning\"\r\n | \"icon\";\r\n\r\ninterface IButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\r\n variant?: ButtonVariant;\r\n}\r\nconst commonStyles =\r\n \" py-1 px-4 leading-[32px] min-h-[32px] w-fit rounded-lg whitespace-nowrap font-medium disabled:opacity-50 \";\r\nconst buttonStyles: { [key in ButtonVariant]: string } = {\r\n primary: \"!bg-primary hover:!bg-primary-hover text-primary-text \",\r\n secondary:\r\n \"!bg-secondary hover:!bg-secondary-hover text-secondary-text border border-secondary-border \",\r\n transparent:\r\n \"!bg-transparent border border-transparent hover:bg-gray-100 hover:border-gray-200 \",\r\n success: \"!bg-success hover:!bg-success-hover text-success-text \",\r\n danger: \"!bg-danger hover:!bg-danger-hover text-danger-text \",\r\n warning:\r\n \"!bg-warning hover:!bg-warning-hover text-warning-text border border-warning-border\",\r\n icon: \" !rounded-full text-center inline-flex items-center \",\r\n};\r\nconst Button: React.FC<IButtonProps> = ({\r\n variant = \"primary\",\r\n children,\r\n onClick,\r\n className,\r\n ...props\r\n}) => {\r\n const classNames = commonStyles + buttonStyles[variant];\r\n return (\r\n <button\r\n className={classNames + \" \" + (className || \" sharedLibraryource \")}\r\n onClick={onClick}\r\n {...props}\r\n >\r\n {children}\r\n </button>\r\n );\r\n};\r\n\r\nexport default Button;\r\n"],"names":[],"mappings":";;AAeA,MAAM,eACJ;AACF,MAAM,eAAmD;AAAA,EACvD,SAAS;AAAA,EACT,WACE;AAAA,EACF,aACE;AAAA,EACF,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,SACE;AAAA,EACF,MAAM;AACR;AACA,MAAM,SAAiC,CAAC;AAAA,EACtC,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACE,QAAA,aAAa,eAAe,aAAa,OAAO;AAEpD,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,aAAa,OAAO,aAAa;AAAA,MAC5C;AAAA,MACC,GAAG;AAAA,MAEH;AAAA,IAAA;AAAA,EAAA;AAGP;"}
|
|
@@ -2,10 +2,9 @@ import { jsx, Fragment, jsxs } from "react/jsx-runtime";
|
|
|
2
2
|
import { useState, useEffect } from "react";
|
|
3
3
|
import '../../assets/tailwind.css';/* empty css */
|
|
4
4
|
import Button from "../Button.js";
|
|
5
|
-
import {
|
|
5
|
+
import { e as MdOutlineFilterAlt, f as MdOutlineFilterAltOff, g as MdSearch, d as MdClose, h as MdArrowBack, i as MdArrowForward, j as MdArrowUpward, k as MdArrowDownward } from "../../index-BMFehNPK.js";
|
|
6
6
|
import FormField from "../form/FormField.js";
|
|
7
7
|
import Spinner from "../Spinner.js";
|
|
8
|
-
import "../profiles/ProfileOverview.js";
|
|
9
8
|
import "../../index.esm-DjnEVdAW.js";
|
|
10
9
|
import "../../contexts/FederationContext.js";
|
|
11
10
|
function DataTable({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DataTable.js","sources":["../../../lib/components/datatable/DataTable.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\r\n\r\nimport { Button, FormField, Spinner } from \"../../main\";\r\nimport {\r\n MdArrowBack,\r\n MdArrowDownward,\r\n MdArrowForward,\r\n MdArrowUpward,\r\n MdClose,\r\n MdOutlineFilterAlt,\r\n MdOutlineFilterAltOff,\r\n MdSearch,\r\n} from \"react-icons/md\";\r\n\r\nexport interface DataTableColumn<T> {\r\n key: keyof T | \"actions\";\r\n header: string;\r\n render?: (item: T) => React.ReactNode;\r\n actions?: DataTableAction<T>[];\r\n filterType?: string;\r\n classes?: string;\r\n type?: \"string\" | \"number\" | \"date\";\r\n filterOperator?: \">=\" | \"<=\" | \"==\";\r\n}\r\nexport interface DataTableAction<T> {\r\n label: string;\r\n onClick: (item: T) => void;\r\n visible?: (item: T) => boolean;\r\n icon?: React.ReactNode;\r\n}\r\ninterface DataTableProps<T> {\r\n items: T[];\r\n columns: DataTableColumn<T | \"actions\">[];\r\n itemsPerPage?: number;\r\n title?: string;\r\n subtitle?: string;\r\n allowSearch?: boolean;\r\n isLoading?: boolean;\r\n}\r\n\r\ntype DataTableInternalItems = {\r\n _isHighlighted?: boolean;\r\n};\r\n\r\nfunction DataTable<T extends DataTableInternalItems>({\r\n items,\r\n columns,\r\n itemsPerPage = 10,\r\n title,\r\n subtitle,\r\n allowSearch = true,\r\n isLoading,\r\n}: DataTableProps<T>) {\r\n const [currentPage, setCurrentPage] = useState(0);\r\n const [fulltextSearch, setFulltextSearch] = useState(\"\");\r\n const [filterOptions, setFilterOptions] = useState<Record<string, any[]>>({});\r\n const [columnFilters, setColumnFilters] = useState<Record<string, string>>(\r\n {}\r\n );\r\n\r\n const [showColFilters, setShowColFilters] = useState(false);\r\n\r\n const [sortConfig, setSortConfig] = useState<{\r\n key: keyof T | \"actions\";\r\n direction: \"ascending\" | \"descending\" | null;\r\n } | null>(null);\r\n\r\n useEffect(() => {\r\n const newFilterOptions: Record<string, any[]> = {};\r\n\r\n columns.forEach((column) => {\r\n if (column.filterType && items.length > 0) {\r\n const uniqueOptions = new Set(\r\n items.map((item) => item[column.key as keyof T])\r\n );\r\n // Convert Set to an array of { value, label } objects\r\n let sortedOptions = Array.from(uniqueOptions).map((option) => ({\r\n value: option,\r\n label:\r\n column.type === \"date\"\r\n ? new Date(option as string)?.toLocaleDateString()\r\n : option,\r\n }));\r\n\r\n // Sort the options array by label in ascending alphabetical order\r\n if (column.type === \"date\") {\r\n // Convert labels to timestamps and sort accordingly\r\n sortedOptions = sortedOptions.sort((a, b) => {\r\n const timestampA = new Date(a.value as string).getTime();\r\n const timestampB = new Date(b.value as string).getTime();\r\n return timestampA - timestampB;\r\n });\r\n } else {\r\n // Sort alphabetically by label for non-date columns\r\n sortedOptions = sortedOptions.sort((a, b) =>\r\n (a.label as string)?.localeCompare(b.label as string)\r\n );\r\n }\r\n\r\n // Add a default option if needed\r\n newFilterOptions[column.key as string] = [\r\n { value: \"\", label: \"\" },\r\n ...sortedOptions,\r\n ];\r\n }\r\n });\r\n\r\n setFilterOptions(newFilterOptions);\r\n }, [items, columns]);\r\n\r\n const requestSort = (key: keyof T | \"actions\") => {\r\n if (sortConfig?.key === key && sortConfig.direction !== null) {\r\n setSortConfig({\r\n key,\r\n direction: sortConfig.direction === \"ascending\" ? \"descending\" : null,\r\n });\r\n } else {\r\n setSortConfig({ key, direction: \"ascending\" });\r\n }\r\n };\r\n\r\n const getSortIcon = (key: keyof T | \"actions\") => {\r\n if (sortConfig?.key === key) {\r\n return sortConfig.direction === \"ascending\" ? (\r\n <MdArrowUpward fontSize=\"small\" />\r\n ) : sortConfig.direction === \"descending\" ? (\r\n <MdArrowDownward fontSize=\"small\" />\r\n ) : (\r\n <MdArrowUpward\r\n fontSize=\"small\"\r\n className=\"text-gray-300 invisible group-hover:visible \"\r\n />\r\n );\r\n }\r\n return (\r\n <MdArrowUpward\r\n fontSize=\"small\"\r\n className=\"text-gray-300 invisible group-hover:visible \"\r\n />\r\n );\r\n };\r\n\r\n const sortedItems = sortConfig?.direction\r\n ? [...items].sort((a, b) => {\r\n const aValue = a[sortConfig.key as keyof T];\r\n const bValue = b[sortConfig.key as keyof T];\r\n\r\n // Check if values are Date objects\r\n if (aValue instanceof Date && bValue instanceof Date) {\r\n return sortConfig.direction === \"ascending\"\r\n ? aValue.getTime() - bValue.getTime()\r\n : bValue.getTime() - aValue.getTime();\r\n }\r\n if (typeof aValue === \"number\" && typeof bValue === \"number\") {\r\n return sortConfig.direction === \"ascending\"\r\n ? aValue - bValue\r\n : bValue - aValue;\r\n }\r\n return sortConfig.direction === \"ascending\"\r\n ? String(aValue).localeCompare(String(bValue))\r\n : String(bValue).localeCompare(String(aValue));\r\n })\r\n : items;\r\n\r\n // const searchableKeys = new Set(\r\n // columns.filter((col) => !col.actions).map((col) => col.key)\r\n // );\r\n\r\n const filteredItems = sortedItems.filter((item: any) => {\r\n const textSearchMatch = fulltextSearch\r\n ? columns.some((column) => {\r\n const value = item[column.key];\r\n return (\r\n (typeof value === \"string\" || typeof value === \"number\") &&\r\n value\r\n .toString()\r\n .toLowerCase()\r\n .includes(fulltextSearch.toLowerCase())\r\n );\r\n })\r\n : true;\r\n\r\n const columnFiltersMatch = columns.every((column) => {\r\n // debugger;\r\n const filterValue = columnFilters[column.key as string];\r\n if (!filterValue) return true; // Ignore filter if 'None' is selected\r\n\r\n const itemValue = item[column.key];\r\n if ((column.type || typeof itemValue) === \"string\") {\r\n if (column.filterOperator == \">=\") {\r\n return itemValue.toLowerCase() >= filterValue.toLowerCase();\r\n } else if (column.filterOperator == \"<=\") {\r\n return itemValue.toLowerCase() <= filterValue.toLowerCase();\r\n }\r\n if (column.filterType == \"text\") {\r\n return itemValue.toLowerCase().includes(filterValue.toLowerCase());\r\n } else {\r\n return itemValue.toLowerCase() == filterValue.toLowerCase();\r\n }\r\n } else {\r\n if (column.filterOperator == \">=\") {\r\n return itemValue >= filterValue;\r\n } else if (column.filterOperator == \"<=\") {\r\n return itemValue <= filterValue;\r\n } else {\r\n return itemValue == filterValue;\r\n }\r\n }\r\n });\r\n\r\n return textSearchMatch && columnFiltersMatch;\r\n });\r\n\r\n // Pagination logic\r\n const indexOfLastItem = (currentPage + 1) * itemsPerPage;\r\n const indexOfFirstItem = indexOfLastItem - itemsPerPage;\r\n const currentItems = filteredItems.slice(indexOfFirstItem, indexOfLastItem);\r\n\r\n const nextPage = () => {\r\n setCurrentPage(currentPage + 1);\r\n };\r\n\r\n const prevPage = () => {\r\n setCurrentPage(currentPage - 1);\r\n };\r\n const handleSearchChanged = (\r\n e: React.ChangeEvent<\r\n HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement\r\n >\r\n ) => {\r\n setFulltextSearch(e.target?.value);\r\n setCurrentPage(0);\r\n };\r\n\r\n const totalPages = Math.max(\r\n 1,\r\n Math.ceil(filteredItems.length / itemsPerPage)\r\n );\r\n\r\n // Pagination display logic\r\n const paginationDisplay = `Strana ${currentPage + 1} z ${totalPages}`;\r\n\r\n const filterHandler = (key: keyof T, value: string) => {\r\n setColumnFilters((prev) => ({ ...prev, [key]: value }));\r\n setCurrentPage(0);\r\n };\r\n\r\n if (isLoading) return <Spinner />;\r\n return (\r\n <>\r\n <div className=\"container shadow-lg border border-gray-200 rounded-xl overflow-hidden \">\r\n {(title || subtitle || allowSearch) && (\r\n <div className=\"p-5 leading-9 flex \">\r\n <div className=\"flex-grow\">\r\n {title && (\r\n <h1 className=\"font-semibold text-xl leading-[42px] \">\r\n {title}\r\n </h1>\r\n )}\r\n {subtitle && (\r\n <p className=\"font-normal text-gray-600\">{subtitle}</p>\r\n )}\r\n </div>\r\n <div\r\n className=\"flex items-center text-xl h-full p-3 mr-5 cursor-pointer text-gray-500 \"\r\n onClick={() => setShowColFilters(!showColFilters)}\r\n >\r\n {!showColFilters && <MdOutlineFilterAlt />}\r\n {showColFilters && <MdOutlineFilterAltOff />}\r\n </div>\r\n {allowSearch && (\r\n <div className=\"\">\r\n <FormField\r\n placeholder=\"Vyhledávání\"\r\n name=\"search\"\r\n onInputChange={handleSearchChanged}\r\n type=\"text\"\r\n value={fulltextSearch}\r\n >\r\n {\" \"}\r\n <div className=\" text-gray-500 leading-5 flex items-center h-full\">\r\n {!fulltextSearch && <MdSearch></MdSearch>}\r\n {fulltextSearch && (\r\n <MdClose onClick={() => setFulltextSearch(\"\")}></MdClose>\r\n )}\r\n </div>\r\n </FormField>\r\n </div>\r\n )}\r\n </div>\r\n )}\r\n <div className=\"overflow-x-auto\">\r\n <table className=\"w-full leading-normal\">\r\n <thead>\r\n {showColFilters &&\r\n columns.findIndex((it) => it.filterType) > -1 && (\r\n <tr>\r\n {columns.map(({ key, header, filterType }) => (\r\n <th\r\n key={String(key) + \"_filter\"}\r\n // className=\"cursor-pointer px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-sm font-medium text-gray-600 uppercase tracking-wider\"\r\n className={` font-medium cursor-pointer leading-9 text-xs text-left pl-5 pb-5 text-gray-600 ${\r\n !title && !subtitle ? \"border-t-0\" : \"\"\r\n }`}\r\n >\r\n {filterType && (\r\n <FormField\r\n label={header}\r\n name={String(key) + \"_filter\"}\r\n onInputChange={(e) =>\r\n filterHandler(key as keyof T, e.target.value)\r\n }\r\n type={filterType}\r\n options={filterOptions[String(key)] || []}\r\n value={columnFilters[String(key)]}\r\n clearable\r\n ></FormField>\r\n )}\r\n </th>\r\n ))}\r\n </tr>\r\n )}\r\n <tr>\r\n {columns.map(({ key, header, actions }) => (\r\n <th\r\n key={String(key)}\r\n // className=\"cursor-pointer px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-sm font-medium text-gray-600 uppercase tracking-wider\"\r\n className={`group font-medium cursor-pointer leading-9 text-xs text-left px-5 text-gray-600 bg bg-gray-50 border-t border-b border-gray-200 ${\r\n !title && !subtitle ? \"border-t-0\" : \"\"\r\n }`}\r\n onClick={() => requestSort(key)}\r\n >\r\n <span className=\"inline-flex items-center gap-2\">\r\n {header} {!actions ? getSortIcon(key) : \"\"}\r\n </span>\r\n </th>\r\n ))}\r\n </tr>\r\n </thead>\r\n\r\n <tbody>\r\n {currentItems.map((item, rowIndex) => (\r\n <tr\r\n key={rowIndex}\r\n className={`${\r\n item._isHighlighted ? \" bg-gray-200 \" : \" \"\r\n } hover:bg-gray-50 border-gray-200 border-b text-sm `}\r\n >\r\n {columns.map(({ render, actions, classes }, colIndex) => (\r\n <td\r\n key={`${rowIndex}-${colIndex}`}\r\n className={`px-5 py-2\r\n ${\r\n colIndex == 0\r\n ? \" font-medium text-gray-900\"\r\n : \" text-gray-700\"\r\n } ${classes}`}\r\n >\r\n {render ? render(item) : \"\"}\r\n {actions &&\r\n actions\r\n .filter((it) => {\r\n if (it.visible) {\r\n return it.visible(item);\r\n } else true;\r\n })\r\n .map((action, actionIndex) => (\r\n <div\r\n key={`${rowIndex}-${colIndex}-${actionIndex}`}\r\n className=\"inline-flex align-middle\"\r\n >\r\n {action.icon && (\r\n <Button\r\n variant=\"icon\"\r\n onClick={() => action.onClick(item)}\r\n >\r\n {\" \"}\r\n {action.icon}\r\n </Button>\r\n )}\r\n {!action.icon && (\r\n <Button\r\n variant=\"transparent\"\r\n onClick={() => action.onClick(item)}\r\n >\r\n {\" \"}\r\n {action.label}\r\n </Button>\r\n )}\r\n </div>\r\n ))}\r\n </td>\r\n ))}\r\n </tr>\r\n ))}\r\n {currentItems.length == 0 && (\r\n <tr key=\"tr-nodata \">\r\n <td\r\n key=\"td-nodata\"\r\n className=\"px-5 py-3 border-b border-gray-200 bg-white text-sm items-center justify-center align-middle\"\r\n colSpan={columns.length}\r\n >\r\n Žádná data\r\n </td>\r\n </tr>\r\n )}\r\n </tbody>\r\n </table>\r\n </div>\r\n <div className=\"w-full p-5 grid grid-cols-3\">\r\n <div className=\"text-left items-start justify-start\">\r\n {currentPage !== 0 && (\r\n <Button\r\n variant=\"secondary\"\r\n onClick={prevPage}\r\n className=\"flex items-center float-left\"\r\n >\r\n <MdArrowBack className=\"mr-1.5\" /> Předchozí\r\n </Button>\r\n )}\r\n </div>\r\n <div className=\" text-center text-xs text-gray-800\">\r\n {paginationDisplay} {/* Updated to use dynamic page numbers */}\r\n </div>\r\n <div className=\"text-right items-end justify-end\">\r\n {indexOfLastItem < filteredItems.length && (\r\n <Button\r\n variant=\"secondary\"\r\n onClick={nextPage}\r\n className=\"flex items-center float-right\"\r\n >\r\n Následující <MdArrowForward className=\"ml-2\" size={20} />\r\n </Button>\r\n )}\r\n </div>\r\n </div>\r\n </div>\r\n </>\r\n );\r\n}\r\n\r\nexport default DataTable;\r\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"DataTable.js","sources":["../../../lib/components/datatable/DataTable.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\r\n\r\nimport { Button, FormField, Spinner } from \"../../main\";\r\nimport {\r\n MdArrowBack,\r\n MdArrowDownward,\r\n MdArrowForward,\r\n MdArrowUpward,\r\n MdClose,\r\n MdOutlineFilterAlt,\r\n MdOutlineFilterAltOff,\r\n MdSearch,\r\n} from \"react-icons/md\";\r\n\r\nexport interface DataTableColumn<T> {\r\n key: keyof T | \"actions\";\r\n header: string;\r\n render?: (item: T) => React.ReactNode;\r\n actions?: DataTableAction<T>[];\r\n filterType?: string;\r\n classes?: string;\r\n type?: \"string\" | \"number\" | \"date\";\r\n filterOperator?: \">=\" | \"<=\" | \"==\";\r\n}\r\nexport interface DataTableAction<T> {\r\n label: string;\r\n onClick: (item: T) => void;\r\n visible?: (item: T) => boolean;\r\n icon?: React.ReactNode;\r\n}\r\ninterface DataTableProps<T> {\r\n items: T[];\r\n columns: DataTableColumn<T | \"actions\">[];\r\n itemsPerPage?: number;\r\n title?: string;\r\n subtitle?: string;\r\n allowSearch?: boolean;\r\n isLoading?: boolean;\r\n}\r\n\r\ntype DataTableInternalItems = {\r\n _isHighlighted?: boolean;\r\n};\r\n\r\nfunction DataTable<T extends DataTableInternalItems>({\r\n items,\r\n columns,\r\n itemsPerPage = 10,\r\n title,\r\n subtitle,\r\n allowSearch = true,\r\n isLoading,\r\n}: DataTableProps<T>) {\r\n const [currentPage, setCurrentPage] = useState(0);\r\n const [fulltextSearch, setFulltextSearch] = useState(\"\");\r\n const [filterOptions, setFilterOptions] = useState<Record<string, any[]>>({});\r\n const [columnFilters, setColumnFilters] = useState<Record<string, string>>(\r\n {}\r\n );\r\n\r\n const [showColFilters, setShowColFilters] = useState(false);\r\n\r\n const [sortConfig, setSortConfig] = useState<{\r\n key: keyof T | \"actions\";\r\n direction: \"ascending\" | \"descending\" | null;\r\n } | null>(null);\r\n\r\n useEffect(() => {\r\n const newFilterOptions: Record<string, any[]> = {};\r\n\r\n columns.forEach((column) => {\r\n if (column.filterType && items.length > 0) {\r\n const uniqueOptions = new Set(\r\n items.map((item) => item[column.key as keyof T])\r\n );\r\n // Convert Set to an array of { value, label } objects\r\n let sortedOptions = Array.from(uniqueOptions).map((option) => ({\r\n value: option,\r\n label:\r\n column.type === \"date\"\r\n ? new Date(option as string)?.toLocaleDateString()\r\n : option,\r\n }));\r\n\r\n // Sort the options array by label in ascending alphabetical order\r\n if (column.type === \"date\") {\r\n // Convert labels to timestamps and sort accordingly\r\n sortedOptions = sortedOptions.sort((a, b) => {\r\n const timestampA = new Date(a.value as string).getTime();\r\n const timestampB = new Date(b.value as string).getTime();\r\n return timestampA - timestampB;\r\n });\r\n } else {\r\n // Sort alphabetically by label for non-date columns\r\n sortedOptions = sortedOptions.sort((a, b) =>\r\n (a.label as string)?.localeCompare(b.label as string)\r\n );\r\n }\r\n\r\n // Add a default option if needed\r\n newFilterOptions[column.key as string] = [\r\n { value: \"\", label: \"\" },\r\n ...sortedOptions,\r\n ];\r\n }\r\n });\r\n\r\n setFilterOptions(newFilterOptions);\r\n }, [items, columns]);\r\n\r\n const requestSort = (key: keyof T | \"actions\") => {\r\n if (sortConfig?.key === key && sortConfig.direction !== null) {\r\n setSortConfig({\r\n key,\r\n direction: sortConfig.direction === \"ascending\" ? \"descending\" : null,\r\n });\r\n } else {\r\n setSortConfig({ key, direction: \"ascending\" });\r\n }\r\n };\r\n\r\n const getSortIcon = (key: keyof T | \"actions\") => {\r\n if (sortConfig?.key === key) {\r\n return sortConfig.direction === \"ascending\" ? (\r\n <MdArrowUpward fontSize=\"small\" />\r\n ) : sortConfig.direction === \"descending\" ? (\r\n <MdArrowDownward fontSize=\"small\" />\r\n ) : (\r\n <MdArrowUpward\r\n fontSize=\"small\"\r\n className=\"text-gray-300 invisible group-hover:visible \"\r\n />\r\n );\r\n }\r\n return (\r\n <MdArrowUpward\r\n fontSize=\"small\"\r\n className=\"text-gray-300 invisible group-hover:visible \"\r\n />\r\n );\r\n };\r\n\r\n const sortedItems = sortConfig?.direction\r\n ? [...items].sort((a, b) => {\r\n const aValue = a[sortConfig.key as keyof T];\r\n const bValue = b[sortConfig.key as keyof T];\r\n\r\n // Check if values are Date objects\r\n if (aValue instanceof Date && bValue instanceof Date) {\r\n return sortConfig.direction === \"ascending\"\r\n ? aValue.getTime() - bValue.getTime()\r\n : bValue.getTime() - aValue.getTime();\r\n }\r\n if (typeof aValue === \"number\" && typeof bValue === \"number\") {\r\n return sortConfig.direction === \"ascending\"\r\n ? aValue - bValue\r\n : bValue - aValue;\r\n }\r\n return sortConfig.direction === \"ascending\"\r\n ? String(aValue).localeCompare(String(bValue))\r\n : String(bValue).localeCompare(String(aValue));\r\n })\r\n : items;\r\n\r\n // const searchableKeys = new Set(\r\n // columns.filter((col) => !col.actions).map((col) => col.key)\r\n // );\r\n\r\n const filteredItems = sortedItems.filter((item: any) => {\r\n const textSearchMatch = fulltextSearch\r\n ? columns.some((column) => {\r\n const value = item[column.key];\r\n return (\r\n (typeof value === \"string\" || typeof value === \"number\") &&\r\n value\r\n .toString()\r\n .toLowerCase()\r\n .includes(fulltextSearch.toLowerCase())\r\n );\r\n })\r\n : true;\r\n\r\n const columnFiltersMatch = columns.every((column) => {\r\n // debugger;\r\n const filterValue = columnFilters[column.key as string];\r\n if (!filterValue) return true; // Ignore filter if 'None' is selected\r\n\r\n const itemValue = item[column.key];\r\n if ((column.type || typeof itemValue) === \"string\") {\r\n if (column.filterOperator == \">=\") {\r\n return itemValue.toLowerCase() >= filterValue.toLowerCase();\r\n } else if (column.filterOperator == \"<=\") {\r\n return itemValue.toLowerCase() <= filterValue.toLowerCase();\r\n }\r\n if (column.filterType == \"text\") {\r\n return itemValue.toLowerCase().includes(filterValue.toLowerCase());\r\n } else {\r\n return itemValue.toLowerCase() == filterValue.toLowerCase();\r\n }\r\n } else {\r\n if (column.filterOperator == \">=\") {\r\n return itemValue >= filterValue;\r\n } else if (column.filterOperator == \"<=\") {\r\n return itemValue <= filterValue;\r\n } else {\r\n return itemValue == filterValue;\r\n }\r\n }\r\n });\r\n\r\n return textSearchMatch && columnFiltersMatch;\r\n });\r\n\r\n // Pagination logic\r\n const indexOfLastItem = (currentPage + 1) * itemsPerPage;\r\n const indexOfFirstItem = indexOfLastItem - itemsPerPage;\r\n const currentItems = filteredItems.slice(indexOfFirstItem, indexOfLastItem);\r\n\r\n const nextPage = () => {\r\n setCurrentPage(currentPage + 1);\r\n };\r\n\r\n const prevPage = () => {\r\n setCurrentPage(currentPage - 1);\r\n };\r\n const handleSearchChanged = (\r\n e: React.ChangeEvent<\r\n HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement\r\n >\r\n ) => {\r\n setFulltextSearch(e.target?.value);\r\n setCurrentPage(0);\r\n };\r\n\r\n const totalPages = Math.max(\r\n 1,\r\n Math.ceil(filteredItems.length / itemsPerPage)\r\n );\r\n\r\n // Pagination display logic\r\n const paginationDisplay = `Strana ${currentPage + 1} z ${totalPages}`;\r\n\r\n const filterHandler = (key: keyof T, value: string) => {\r\n setColumnFilters((prev) => ({ ...prev, [key]: value }));\r\n setCurrentPage(0);\r\n };\r\n\r\n if (isLoading) return <Spinner />;\r\n return (\r\n <>\r\n <div className=\"container shadow-lg border border-gray-200 rounded-xl overflow-hidden \">\r\n {(title || subtitle || allowSearch) && (\r\n <div className=\"p-5 leading-9 flex \">\r\n <div className=\"flex-grow\">\r\n {title && (\r\n <h1 className=\"font-semibold text-xl leading-[42px] \">\r\n {title}\r\n </h1>\r\n )}\r\n {subtitle && (\r\n <p className=\"font-normal text-gray-600\">{subtitle}</p>\r\n )}\r\n </div>\r\n <div\r\n className=\"flex items-center text-xl h-full p-3 mr-5 cursor-pointer text-gray-500 \"\r\n onClick={() => setShowColFilters(!showColFilters)}\r\n >\r\n {!showColFilters && <MdOutlineFilterAlt />}\r\n {showColFilters && <MdOutlineFilterAltOff />}\r\n </div>\r\n {allowSearch && (\r\n <div className=\"\">\r\n <FormField\r\n placeholder=\"Vyhledávání\"\r\n name=\"search\"\r\n onInputChange={handleSearchChanged}\r\n type=\"text\"\r\n value={fulltextSearch}\r\n >\r\n {\" \"}\r\n <div className=\" text-gray-500 leading-5 flex items-center h-full\">\r\n {!fulltextSearch && <MdSearch></MdSearch>}\r\n {fulltextSearch && (\r\n <MdClose onClick={() => setFulltextSearch(\"\")}></MdClose>\r\n )}\r\n </div>\r\n </FormField>\r\n </div>\r\n )}\r\n </div>\r\n )}\r\n <div className=\"overflow-x-auto\">\r\n <table className=\"w-full leading-normal\">\r\n <thead>\r\n {showColFilters &&\r\n columns.findIndex((it) => it.filterType) > -1 && (\r\n <tr>\r\n {columns.map(({ key, header, filterType }) => (\r\n <th\r\n key={String(key) + \"_filter\"}\r\n // className=\"cursor-pointer px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-sm font-medium text-gray-600 uppercase tracking-wider\"\r\n className={` font-medium cursor-pointer leading-9 text-xs text-left pl-5 pb-5 text-gray-600 ${\r\n !title && !subtitle ? \"border-t-0\" : \"\"\r\n }`}\r\n >\r\n {filterType && (\r\n <FormField\r\n label={header}\r\n name={String(key) + \"_filter\"}\r\n onInputChange={(e) =>\r\n filterHandler(key as keyof T, e.target.value)\r\n }\r\n type={filterType}\r\n options={filterOptions[String(key)] || []}\r\n value={columnFilters[String(key)]}\r\n clearable\r\n ></FormField>\r\n )}\r\n </th>\r\n ))}\r\n </tr>\r\n )}\r\n <tr>\r\n {columns.map(({ key, header, actions }) => (\r\n <th\r\n key={String(key)}\r\n // className=\"cursor-pointer px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-left text-sm font-medium text-gray-600 uppercase tracking-wider\"\r\n className={`group font-medium cursor-pointer leading-9 text-xs text-left px-5 text-gray-600 bg bg-gray-50 border-t border-b border-gray-200 ${\r\n !title && !subtitle ? \"border-t-0\" : \"\"\r\n }`}\r\n onClick={() => requestSort(key)}\r\n >\r\n <span className=\"inline-flex items-center gap-2\">\r\n {header} {!actions ? getSortIcon(key) : \"\"}\r\n </span>\r\n </th>\r\n ))}\r\n </tr>\r\n </thead>\r\n\r\n <tbody>\r\n {currentItems.map((item, rowIndex) => (\r\n <tr\r\n key={rowIndex}\r\n className={`${\r\n item._isHighlighted ? \" bg-gray-200 \" : \" \"\r\n } hover:bg-gray-50 border-gray-200 border-b text-sm `}\r\n >\r\n {columns.map(({ render, actions, classes }, colIndex) => (\r\n <td\r\n key={`${rowIndex}-${colIndex}`}\r\n className={`px-5 py-2\r\n ${\r\n colIndex == 0\r\n ? \" font-medium text-gray-900\"\r\n : \" text-gray-700\"\r\n } ${classes}`}\r\n >\r\n {render ? render(item) : \"\"}\r\n {actions &&\r\n actions\r\n .filter((it) => {\r\n if (it.visible) {\r\n return it.visible(item);\r\n } else true;\r\n })\r\n .map((action, actionIndex) => (\r\n <div\r\n key={`${rowIndex}-${colIndex}-${actionIndex}`}\r\n className=\"inline-flex align-middle\"\r\n >\r\n {action.icon && (\r\n <Button\r\n variant=\"icon\"\r\n onClick={() => action.onClick(item)}\r\n >\r\n {\" \"}\r\n {action.icon}\r\n </Button>\r\n )}\r\n {!action.icon && (\r\n <Button\r\n variant=\"transparent\"\r\n onClick={() => action.onClick(item)}\r\n >\r\n {\" \"}\r\n {action.label}\r\n </Button>\r\n )}\r\n </div>\r\n ))}\r\n </td>\r\n ))}\r\n </tr>\r\n ))}\r\n {currentItems.length == 0 && (\r\n <tr key=\"tr-nodata \">\r\n <td\r\n key=\"td-nodata\"\r\n className=\"px-5 py-3 border-b border-gray-200 bg-white text-sm items-center justify-center align-middle\"\r\n colSpan={columns.length}\r\n >\r\n Žádná data\r\n </td>\r\n </tr>\r\n )}\r\n </tbody>\r\n </table>\r\n </div>\r\n <div className=\"w-full p-5 grid grid-cols-3\">\r\n <div className=\"text-left items-start justify-start\">\r\n {currentPage !== 0 && (\r\n <Button\r\n variant=\"secondary\"\r\n onClick={prevPage}\r\n className=\"flex items-center float-left\"\r\n >\r\n <MdArrowBack className=\"mr-1.5\" /> Předchozí\r\n </Button>\r\n )}\r\n </div>\r\n <div className=\" text-center text-xs text-gray-800\">\r\n {paginationDisplay} {/* Updated to use dynamic page numbers */}\r\n </div>\r\n <div className=\"text-right items-end justify-end\">\r\n {indexOfLastItem < filteredItems.length && (\r\n <Button\r\n variant=\"secondary\"\r\n onClick={nextPage}\r\n className=\"flex items-center float-right\"\r\n >\r\n Následující <MdArrowForward className=\"ml-2\" size={20} />\r\n </Button>\r\n )}\r\n </div>\r\n </div>\r\n </div>\r\n </>\r\n );\r\n}\r\n\r\nexport default DataTable;\r\n"],"names":[],"mappings":"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"}
|
|
@@ -16,11 +16,12 @@ interface DataTableServerProps<T> {
|
|
|
16
16
|
showHeader?: boolean;
|
|
17
17
|
rowAction?: (item: T) => void;
|
|
18
18
|
bulkActions?: BulkAction<T>[];
|
|
19
|
+
bulkAction?: (items: T[]) => JSX.Element;
|
|
19
20
|
filters?: object;
|
|
20
21
|
}
|
|
21
22
|
type DataTableInternalItems = {
|
|
22
23
|
_isHighlighted?: boolean;
|
|
23
24
|
id: string;
|
|
24
25
|
};
|
|
25
|
-
declare function DataTableServer<T extends DataTableInternalItems>({ id, url, columns, itemsPerPage, title, subtitle, allowSearch, showHeader, rowAction,
|
|
26
|
+
declare function DataTableServer<T extends DataTableInternalItems>({ id, url, columns, itemsPerPage, title, subtitle, allowSearch, showHeader, rowAction, bulkAction, filters, }: DataTableServerProps<T>): import("react/jsx-runtime").JSX.Element;
|
|
26
27
|
export default DataTableServer;
|
|
@@ -2,12 +2,12 @@ import { jsx, Fragment, jsxs } from "react/jsx-runtime";
|
|
|
2
2
|
import { useState, useEffect, useCallback } from "react";
|
|
3
3
|
import '../../assets/tailwind.css';/* empty css */
|
|
4
4
|
import Button from "../Button.js";
|
|
5
|
-
import {
|
|
5
|
+
import { e as MdOutlineFilterAlt, f as MdOutlineFilterAltOff, g as MdSearch, d as MdClose, h as MdArrowBack, i as MdArrowForward, j as MdArrowUpward, k as MdArrowDownward } from "../../index-BMFehNPK.js";
|
|
6
6
|
import FormField from "../form/FormField.js";
|
|
7
7
|
import InputField from "../form/InputField.js";
|
|
8
8
|
import SelectField from "../form/SelectField.js";
|
|
9
9
|
import Spinner from "../Spinner.js";
|
|
10
|
-
import "../
|
|
10
|
+
import DateRangeField from "../form/DateRangeField.js";
|
|
11
11
|
import "../../index.esm-DjnEVdAW.js";
|
|
12
12
|
import "../../contexts/FederationContext.js";
|
|
13
13
|
import { useFederationContext } from "../../contexts/useFederationContext.js";
|
|
@@ -21691,7 +21691,7 @@ function DataTableServer({
|
|
|
21691
21691
|
allowSearch = false,
|
|
21692
21692
|
showHeader = true,
|
|
21693
21693
|
rowAction,
|
|
21694
|
-
|
|
21694
|
+
bulkAction,
|
|
21695
21695
|
filters
|
|
21696
21696
|
}) {
|
|
21697
21697
|
var _a, _b;
|
|
@@ -21980,24 +21980,9 @@ function DataTableServer({
|
|
|
21980
21980
|
showHeader && /* @__PURE__ */ jsxs("div", { className: "p-5 leading-9 flex", children: [
|
|
21981
21981
|
/* @__PURE__ */ jsxs("div", { className: "flex-grow", children: [
|
|
21982
21982
|
title && /* @__PURE__ */ jsx("h1", { className: "font-semibold text-xl leading-[42px]", children: title }),
|
|
21983
|
-
subtitle && /* @__PURE__ */ jsx("p", { className: "font-normal text-gray-600", children: subtitle })
|
|
21984
|
-
] }),
|
|
21985
|
-
bulkActions && selectedItems.length > 0 && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end text-gray-800", children: [
|
|
21986
|
-
"Hromadná akce (",
|
|
21987
|
-
selectedItems.length,
|
|
21983
|
+
subtitle && /* @__PURE__ */ jsx("p", { className: "font-normal text-gray-600", children: subtitle }),
|
|
21988
21984
|
" ",
|
|
21989
|
-
selectedItems.length
|
|
21990
|
-
")",
|
|
21991
|
-
bulkActions.map((bulkAction) => /* @__PURE__ */ jsx(
|
|
21992
|
-
Button,
|
|
21993
|
-
{
|
|
21994
|
-
variant: "primary",
|
|
21995
|
-
className: "ml-2",
|
|
21996
|
-
onClick: () => bulkAction.action(selectedItems),
|
|
21997
|
-
children: bulkAction.name
|
|
21998
|
-
},
|
|
21999
|
-
bulkAction.name
|
|
22000
|
-
))
|
|
21985
|
+
bulkAction && selectedItems.length > 0 && /* @__PURE__ */ jsx("div", { className: "", children: bulkAction(selectedItems) })
|
|
22001
21986
|
] }),
|
|
22002
21987
|
/* @__PURE__ */ jsx(
|
|
22003
21988
|
DatatableSettings,
|
|
@@ -22040,54 +22025,78 @@ function DataTableServer({
|
|
|
22040
22025
|
/* @__PURE__ */ jsx("div", { className: "", children: /* @__PURE__ */ jsxs("table", { className: "w-full leading-normal ", children: [
|
|
22041
22026
|
/* @__PURE__ */ jsxs("thead", { children: [
|
|
22042
22027
|
showColFilters && columns.findIndex((it) => it.filterType) > -1 && /* @__PURE__ */ jsxs("tr", { children: [
|
|
22043
|
-
data &&
|
|
22028
|
+
data && bulkAction && /* @__PURE__ */ jsx("td", { children: " " }),
|
|
22044
22029
|
columns.map(
|
|
22045
|
-
({
|
|
22030
|
+
({
|
|
22031
|
+
key,
|
|
22032
|
+
header,
|
|
22033
|
+
filterType,
|
|
22034
|
+
filterParam,
|
|
22035
|
+
filterParam2,
|
|
22036
|
+
width
|
|
22037
|
+
}) => /* @__PURE__ */ jsx(
|
|
22046
22038
|
"th",
|
|
22047
22039
|
{
|
|
22048
22040
|
id: String(key) + "_filter",
|
|
22049
22041
|
className: `font-medium leading-9 text-xs text-left p-0 pb-1 text-gray-600 overflow-ellipsis whitespace-nowrap ${!title && !subtitle ? "border-t-0" : ""}`,
|
|
22050
22042
|
style: { width },
|
|
22051
|
-
children:
|
|
22052
|
-
|
|
22053
|
-
|
|
22054
|
-
|
|
22055
|
-
|
|
22056
|
-
|
|
22057
|
-
|
|
22058
|
-
|
|
22059
|
-
|
|
22060
|
-
|
|
22061
|
-
|
|
22062
|
-
|
|
22063
|
-
|
|
22064
|
-
|
|
22065
|
-
|
|
22066
|
-
|
|
22067
|
-
|
|
22068
|
-
|
|
22069
|
-
|
|
22070
|
-
|
|
22071
|
-
|
|
22072
|
-
|
|
22073
|
-
|
|
22074
|
-
|
|
22075
|
-
|
|
22076
|
-
|
|
22077
|
-
|
|
22078
|
-
|
|
22079
|
-
|
|
22080
|
-
|
|
22081
|
-
}
|
|
22082
|
-
|
|
22083
|
-
|
|
22043
|
+
children: filterType === "select" ? /* @__PURE__ */ jsx(
|
|
22044
|
+
SelectField,
|
|
22045
|
+
{
|
|
22046
|
+
label: header,
|
|
22047
|
+
name: String(key) + "_filter",
|
|
22048
|
+
onInputChange: (e) => filterHandler(
|
|
22049
|
+
filterParam,
|
|
22050
|
+
e.target.value
|
|
22051
|
+
),
|
|
22052
|
+
type: filterType,
|
|
22053
|
+
options: filterOptions[String(filterParam)] || [],
|
|
22054
|
+
value: (columnFilters == null ? void 0 : columnFilters[String(filterParam)]) || "",
|
|
22055
|
+
clearable: true,
|
|
22056
|
+
className: "px-1"
|
|
22057
|
+
}
|
|
22058
|
+
) : filterType === "dateRange" ? /* @__PURE__ */ jsx(
|
|
22059
|
+
DateRangeField,
|
|
22060
|
+
{
|
|
22061
|
+
label: header,
|
|
22062
|
+
name: String(filterParam),
|
|
22063
|
+
nameEnd: String(filterParam2),
|
|
22064
|
+
onInputChange: (e) => filterHandler(
|
|
22065
|
+
e.target.name,
|
|
22066
|
+
e.target.value
|
|
22067
|
+
),
|
|
22068
|
+
type: filterType,
|
|
22069
|
+
options: filterOptions[String(filterParam)] || [],
|
|
22070
|
+
value: {
|
|
22071
|
+
startDate: (columnFilters == null ? void 0 : columnFilters[String(filterParam)]) || "",
|
|
22072
|
+
endDate: (columnFilters == null ? void 0 : columnFilters[String(filterParam2)]) || ""
|
|
22073
|
+
},
|
|
22074
|
+
clearable: true,
|
|
22075
|
+
className: "px-1",
|
|
22076
|
+
placeholder: "Zvolte období"
|
|
22077
|
+
}
|
|
22078
|
+
) : /* @__PURE__ */ jsx(
|
|
22079
|
+
InputField,
|
|
22080
|
+
{
|
|
22081
|
+
label: header,
|
|
22082
|
+
name: String(key) + "_filter",
|
|
22083
|
+
onInputChange: (e) => filterHandler(
|
|
22084
|
+
filterParam,
|
|
22085
|
+
e.target.value
|
|
22086
|
+
),
|
|
22087
|
+
type: filterType,
|
|
22088
|
+
value: (columnFilters == null ? void 0 : columnFilters[String(filterParam)]) || "",
|
|
22089
|
+
clearable: true,
|
|
22090
|
+
className: " min-w-[100px] px-1"
|
|
22091
|
+
}
|
|
22092
|
+
)
|
|
22084
22093
|
},
|
|
22085
22094
|
String(key) + "_filter"
|
|
22086
22095
|
)
|
|
22087
22096
|
)
|
|
22088
22097
|
] }),
|
|
22089
22098
|
/* @__PURE__ */ jsxs("tr", { children: [
|
|
22090
|
-
data &&
|
|
22099
|
+
data && bulkAction && /* @__PURE__ */ jsx("th", { className: "w-[20px] h-10 hover:bg-gray-200 bg-gray-50 font-medium text-xs text-center text-gray-600 cursor-pointer border-t border-b border-gray-200", children: /* @__PURE__ */ jsx("label", { className: "w-full h-full flex items-center justify-center cursor-pointer px-2", children: /* @__PURE__ */ jsx(
|
|
22091
22100
|
"input",
|
|
22092
22101
|
{
|
|
22093
22102
|
id: "selectAll",
|
|
@@ -22139,7 +22148,7 @@ function DataTableServer({
|
|
|
22139
22148
|
{
|
|
22140
22149
|
className: `${item._isHighlighted ? "bg-gray-200" : ""} hover:bg-gray-100 border-gray-200 border-b text-sm`,
|
|
22141
22150
|
children: [
|
|
22142
|
-
|
|
22151
|
+
bulkAction && /* @__PURE__ */ jsx("td", { className: "w-[20px] h-[52px] hover:bg-gray-200 font-medium text-xs text-center text-gray-600 cursor-pointer", children: /* @__PURE__ */ jsx("label", { className: "w-full h-full flex items-center justify-center cursor-pointer px-2", children: /* @__PURE__ */ jsx(
|
|
22143
22152
|
"input",
|
|
22144
22153
|
{
|
|
22145
22154
|
type: "checkbox",
|