react-better-html 1.1.121 → 1.1.123

package/dist/index.d.mts

@@ -647,6 +647,11 @@ declare const ColorThemeSwitch: typeof ColorThemeSwitchComponent & {
 };
 
 type FilterPreset = "today" | "yesterday" | "tomorrow" | "thisWeek" | "thisMonth" | "thisYear" | "lastWeek" | "lastMonth" | "lastYear" | "nextWeek" | "nextMonth" | "nextYear";
+type ListFilterValue = {
+    label?: string;
+    value: string;
+    count: number;
+};
 type TableFilterData = {
     type: "number";
     min?: number;
@@ -694,7 +699,7 @@ type DateFilter<DataItem> = {
 type ListFilter<DataItem> = {
     filter?: "list";
     withTotalNumber?: boolean;
-    getValueForList?: (item: DataItem) => string;
+    getValueForList?: (item: DataItem) => OmitProps<ListFilterValue, "count">;
 };
 type TableColumn<DataItem> = {
     label?: string;
@@ -769,11 +774,14 @@ type TooltipComponent = {
 declare const TooltipComponent: TooltipComponent;
 type TooltipItemProps<Value = unknown> = {
     icon?: IconName | AnyOtherString;
+    iconColor?: string;
     text?: string;
+    textColor?: string;
     description?: string;
     isActive?: boolean;
     value?: Value;
     id?: string;
+    disabled?: boolean;
     onClick?: () => void;
     onClickWithValue?: (value: Value) => void;
 };

package/dist/index.d.ts

@@ -647,6 +647,11 @@ declare const ColorThemeSwitch: typeof ColorThemeSwitchComponent & {
 };
 
 type FilterPreset = "today" | "yesterday" | "tomorrow" | "thisWeek" | "thisMonth" | "thisYear" | "lastWeek" | "lastMonth" | "lastYear" | "nextWeek" | "nextMonth" | "nextYear";
+type ListFilterValue = {
+    label?: string;
+    value: string;
+    count: number;
+};
 type TableFilterData = {
     type: "number";
     min?: number;
@@ -694,7 +699,7 @@ type DateFilter<DataItem> = {
 type ListFilter<DataItem> = {
     filter?: "list";
     withTotalNumber?: boolean;
-    getValueForList?: (item: DataItem) => string;
+    getValueForList?: (item: DataItem) => OmitProps<ListFilterValue, "count">;
 };
 type TableColumn<DataItem> = {
     label?: string;
@@ -769,11 +774,14 @@ type TooltipComponent = {
 declare const TooltipComponent: TooltipComponent;
 type TooltipItemProps<Value = unknown> = {
     icon?: IconName | AnyOtherString;
+    iconColor?: string;
     text?: string;
+    textColor?: string;
     description?: string;
     isActive?: boolean;
     value?: Value;
     id?: string;
+    disabled?: boolean;
     onClick?: () => void;
     onClickWithValue?: (value: Value) => void;
 };

package/dist/index.js

@@ -7291,7 +7291,7 @@ var TableComponent = (0, import_react23.forwardRef)(function Table({
           if (filter.min !== void 0 && minDate && itemValue < minDate) return false;
           if (filter.max !== void 0 && maxDate && itemValue > maxDate) return false;
         } else if (column.filter === "list" && filter.type === "list") {
-          const itemValue = column.getValueForList?.(item) ?? (column.type === "text" && column.keyName ? String(item[column.keyName]) : "");
+          const itemValue = column.getValueForList?.(item).value ?? (column.type === "text" && column.keyName ? String(item[column.keyName]) : "");
           if (!filter.list?.includes(itemValue)) return false;
         }
         return true;
@@ -7311,27 +7311,26 @@ var TableComponent = (0, import_react23.forwardRef)(function Table({
   }, [data, checkedItems]);
   const possibleFilterListValues = (0, import_react23.useMemo)(() => {
     if (!openedFilterColumn) return [];
-    return data.reduce(
-      (previousValue, currentValue) => {
-        const value = openedFilterColumn.type === "text" && openedFilterColumn.keyName ? String(currentValue[openedFilterColumn.keyName]) : void 0;
-        if (value !== void 0) {
-          if (previousValue.some((item) => item.value === value)) {
-            previousValue = previousValue.map(
-              (item) => item.value === value ? {
-                ...item,
-                count: item.count + 1
-              } : item
-            );
-          } else
-            previousValue.push({
-              value,
-              count: 1
-            });
-        }
-        return previousValue;
-      },
-      []
-    );
+    return data.reduce((previousValue, currentValue) => {
+      const valueFromList = openedFilterColumn.filter === "list" && openedFilterColumn.getValueForList ? openedFilterColumn.getValueForList(currentValue) : void 0;
+      const value = valueFromList ? valueFromList.value : openedFilterColumn.type === "text" && openedFilterColumn.keyName ? String(currentValue[openedFilterColumn.keyName]) : void 0;
+      if (value !== void 0) {
+        if (previousValue.some((item) => item.value === value)) {
+          previousValue = previousValue.map(
+            (item) => item.value === value ? {
+              ...item,
+              count: item.count + 1
+            } : item
+          );
+        } else
+          previousValue.push({
+            label: valueFromList ? valueFromList.label : value,
+            value,
+            count: 1
+          });
+      }
+      return previousValue;
+    }, []);
   }, [data, openedFilterColumn]);
   const pageCountInternal = pageCount ?? (pageSize !== void 0 ? Math.ceil(dataAfterFilter.length / pageSize) : 1);
   const paginationItems = (0, import_react23.useMemo)(() => {
@@ -7638,7 +7637,7 @@ var TableComponent = (0, import_react23.forwardRef)(function Table({
                     value: value.value,
                     onClickWithValue: onClickFilterListItem,
                     children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(Div_default.row, { alignItems: "center", gap: theme2.styles.gap / 2, children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Text_default, { children: value.value }),
+                      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(Text_default, { children: value.label ?? value.value }),
                       openedFilterColumn.withTotalNumber && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
                         Text_default,
                         {
@@ -7972,7 +7971,19 @@ var TooltipComponent = (0, import_react24.forwardRef)(function Tooltip({
     }
   );
 });
-TooltipComponent.item = (0, import_react24.forwardRef)(function Item({ icon, text, description, isActive, value, id, onClick, onClickWithValue }, ref) {
+TooltipComponent.item = (0, import_react24.forwardRef)(function Item({
+  icon,
+  iconColor,
+  text,
+  textColor,
+  description,
+  isActive,
+  value,
+  id,
+  disabled,
+  onClick,
+  onClickWithValue
+}, ref) {
   const theme2 = useTheme();
   return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
     Div_default.row,
@@ -7980,20 +7991,21 @@ TooltipComponent.item = (0, import_react24.forwardRef)(function Item({ icon, tex
       alignItems: "center",
       gap: theme2.styles.space,
       backgroundColor: theme2.colors.backgroundContent,
-      filterHover: "brightness(0.9)",
+      filterHover: !disabled ? "brightness(0.9)" : "brightness(0.94)",
       paddingBlock: theme2.styles.gap,
       paddingInline: theme2.styles.space,
-      cursor: "pointer",
+      cursor: disabled ? "not-allowed" : "pointer",
       isTabAccessed: true,
       id,
+      opacity: disabled ? 0.4 : void 0,
       value,
-      onClick,
-      onClickWithValue,
+      onClick: !disabled ? onClick : void 0,
+      onClickWithValue: !disabled ? onClickWithValue : void 0,
       ref,
       children: [
-        icon && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Icon_default, { name: icon, color: !isActive ? theme2.colors.textSecondary : void 0 }),
+        icon && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Icon_default, { name: icon, color: iconColor ?? (!isActive ? theme2.colors.textSecondary : void 0) }),
         /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(Div_default.column, { flex: 1, gap: theme2.styles.gap / 2, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Text_default, { fontWeight: isActive ? 700 : void 0, children: text }),
+          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Text_default, { fontWeight: isActive ? 700 : void 0, color: textColor ?? theme2.colors.textPrimary, children: text }),
           description && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Text_default, { fontSize: 14, color: theme2.colors.textSecondary, children: description })
         ] })
       ]