react-better-html 1.1.180 → 1.1.182

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/index.d.mts CHANGED
@@ -2,6 +2,7 @@ import { WebTarget } from 'styled-components';
2
2
  import * as react from 'react';
3
3
  import { ComponentProps, ReactNode } from 'react';
4
4
  import * as react_jsx_runtime from 'react/jsx-runtime';
5
+ import { useNavigate, useLocation, useInRouterContext, useSearchParams } from 'react-router-dom';
5
6
 
6
7
  type PluginName = "alerts" | "react-router-dom" | "localStorage";
7
8
  type BetterHtmlPluginConstructor<T extends object = object> = (config?: T) => BetterHtmlPlugin<T>;
@@ -586,7 +587,7 @@ declare function useForm<FormFields extends Record<string | number, string | num
586
587
  dropdownRefs: Record<keyof FormFields, HTMLDivElement | undefined>;
587
588
  toggleInputRefs: Record<keyof FormFields, ToggleInputRef | undefined>;
588
589
  validate: () => {};
589
- onSubmit: (event: React.FormEvent<HTMLFormElement>) => Promise<void>;
590
+ onSubmit: (event?: React.FormEvent<HTMLFormElement>) => Promise<void>;
590
591
  reset: () => void;
591
592
  requiredFields: (keyof FormFields)[] | undefined;
592
593
  isDirty: boolean;
@@ -700,7 +701,7 @@ declare const ColorThemeSwitch: typeof ColorThemeSwitchComponent & {
700
701
  type FilterPreset = "today" | "yesterday" | "tomorrow" | "thisWeek" | "thisMonth" | "thisYear" | "lastWeek" | "lastMonth" | "lastYear" | "nextWeek" | "nextMonth" | "nextYear";
701
702
  type ListFilterValue = {
702
703
  label?: string;
703
- value: string;
704
+ value: number | string;
704
705
  count: number;
705
706
  };
706
707
  type TableFilterData = {
@@ -713,7 +714,7 @@ type TableFilterData = {
713
714
  max?: string;
714
715
  } | {
715
716
  type: "list";
716
- list?: string[];
717
+ list?: ListFilterValue["value"][];
717
718
  };
718
719
  type TextColumn<DataItem> = {
719
720
  type: "text";
@@ -930,6 +931,34 @@ declare const Foldable: typeof FoldableComponent & {
930
931
  box: typeof FoldableComponent.box;
931
932
  };
932
933
 
934
+ type MenuItem = {
935
+ text: string;
936
+ iconName: IconName | AnyOtherString;
937
+ href?: string;
938
+ onClick?: (item: MenuItem) => void;
939
+ disabled?: boolean;
940
+ hidden?: boolean;
941
+ children?: MenuItem[];
942
+ };
943
+ type SideMenuProps = {
944
+ items: MenuItem[];
945
+ logoAssetName?: AssetName | AnyOtherString;
946
+ logoUrl?: string;
947
+ logoText?: string;
948
+ logoFontFamily?: string;
949
+ collapsable?: boolean;
950
+ widthMobileHandle?: boolean;
951
+ };
952
+ type SideMenuComponentType = {
953
+ (props: SideMenuProps): React.ReactElement;
954
+ pageHolder: (props: SideMenuPageHolderProps) => React.ReactElement;
955
+ };
956
+ declare const SideMenuComponent: SideMenuComponentType;
957
+ type SideMenuPageHolderProps = PageHolderProps & {};
958
+ declare const SideMenu: typeof SideMenuComponent & {
959
+ pageHolder: typeof SideMenuComponent.pageHolder;
960
+ };
961
+
933
962
  type AppConfig = {
934
963
  contentMaxWidth: number;
935
964
  };
@@ -951,6 +980,10 @@ type BetterHtmlConfig = {
951
980
  style?: ComponentStyleConfig<"default" | "secondary" | "destructive" | "icon" | "upload">;
952
981
  tagReplacement?: ComponentTagReplacementConfig<"buttonComponent" | "linkComponent">;
953
982
  };
983
+ sideMenu?: {
984
+ /** @default 300 */
985
+ width?: number;
986
+ };
954
987
  };
955
988
  };
956
989
 
@@ -1020,6 +1053,12 @@ declare const alertControls: {
1020
1053
  createAlert: (alert: OmitProps<Alert, "id">) => Alert;
1021
1054
  removeAlert: (alertId: string) => void;
1022
1055
  };
1056
+ declare const sideMenuControls: {
1057
+ expand: () => void;
1058
+ collapse: () => void;
1059
+ open: () => void;
1060
+ close: () => void;
1061
+ };
1023
1062
  declare const colorThemeControls: {
1024
1063
  toggleTheme: (theme?: ColorTheme) => void;
1025
1064
  };
@@ -1053,7 +1092,12 @@ type AlertsPluginOptions = {
1053
1092
  declare const defaultAlertsPluginOptions: Required<AlertsPluginOptions>;
1054
1093
  declare const alertsPlugin: BetterHtmlPluginConstructor<AlertsPluginOptions>;
1055
1094
 
1056
- type ReactRouterDomPluginOptions = {};
1095
+ type ReactRouterDomPluginOptions = {
1096
+ useNavigate: typeof useNavigate;
1097
+ useLocation: typeof useLocation;
1098
+ useInRouterContext: typeof useInRouterContext;
1099
+ useSearchParams: typeof useSearchParams;
1100
+ };
1057
1101
  declare const defaultReactRouterDomPluginOptions: Required<ReactRouterDomPluginOptions>;
1058
1102
  declare const reactRouterDomPlugin: BetterHtmlPluginConstructor<ReactRouterDomPluginOptions>;
1059
1103
 
@@ -1071,4 +1115,4 @@ type LocalStoragePluginOptions = {
1071
1115
  declare const defaultLocalStoragePluginOptions: Required<LocalStoragePluginOptions>;
1072
1116
  declare const localStoragePlugin: BetterHtmlPluginConstructor<LocalStoragePluginOptions>;
1073
1117
 
1074
- export { type Alert, type AlertType, type AlertsPluginOptions, type AppConfig, type AssetName, type AssetsConfig, type BetterHtmlConfig, type BetterHtmlPlugin, _default as BetterHtmlProvider, type BetterHtmlProviderConfig, type BrowserName, Button, type ButtonProps, Chip, type ChipProps, type Color, type ColorName, type ColorTheme, ColorThemeSwitch, type ColorThemeSwitchProps, type Colors, type ComponentHoverStyle, type ComponentMarginProps, type ComponentPaddingProps, type DeepPartialRecord, Div, type DivProps, _default$3 as Divider, Dropdown, type DropdownOption, type DropdownProps, type ExcludeOptions, Foldable, type FoldableProps, type FoldableRef, Form, type FormProps, FormRow, type FormRowProps, type HorizontalDividerProps, _default$5 as Icon, type IconName, type IconProps, type IconsConfig, _default$4 as Image, type ImageProps, InputField, type InputFieldProps, _default$1 as Label, type LabelProps, Loader, type LoaderConfig, type LoaderName, type LoaderProps, type LocalStoragePluginOptions, Modal, type ModalProps, type ModalRef, type OmitProps, PageHeader, type PageHeaderProps, PageHolder, type PageHolderProps, type PartialRecord, type PickAllRequired, type PickValue, type PluginName, type ReactRouterDomPluginOptions, type Styles, type TabGroup, Table, type TableColumn, type TableFilterData, type TableProps, type TableRef, Tabs, type TabsProps, type TabsRef, Text, type TextAs, type TextProps, type TextareaFieldProps, type Theme, type ThemeConfig, _default$2 as ToggleInput, type ToggleInputProps, type ToggleInputRef, Tooltip, type TooltipProps, type TooltipRef, type VerticalDividerProps, alertControls, alertsPlugin, colorThemeControls, countries, darkenColor, defaultAlertsPluginOptions, defaultLocalStoragePluginOptions, defaultReactRouterDomPluginOptions, desaturateColor, eventPreventDefault, eventPreventStop, eventStopPropagation, filterHover, formatPhoneNumber, generateLocalStorage, generateRandomString, getBrowser, getFormErrorObject, isMobileDevice, lightenColor, loaderControls, localStoragePlugin, reactRouterDomPlugin, saturateColor, useAlertControls, useBetterHtmlContext, useBooleanState, useDebounceState, useForm, useLoader, useLoaderControls, useMediaQuery, usePageResize, usePageScroll, useTheme, useUrlQuery };
1118
+ export { type Alert, type AlertType, type AlertsPluginOptions, type AppConfig, type AssetName, type AssetsConfig, type BetterHtmlConfig, type BetterHtmlPlugin, _default as BetterHtmlProvider, type BetterHtmlProviderConfig, type BrowserName, Button, type ButtonProps, Chip, type ChipProps, type Color, type ColorName, type ColorTheme, ColorThemeSwitch, type ColorThemeSwitchProps, type Colors, type ComponentHoverStyle, type ComponentMarginProps, type ComponentPaddingProps, type DeepPartialRecord, Div, type DivProps, _default$3 as Divider, Dropdown, type DropdownOption, type DropdownProps, type ExcludeOptions, Foldable, type FoldableProps, type FoldableRef, Form, type FormProps, FormRow, type FormRowProps, type HorizontalDividerProps, _default$5 as Icon, type IconName, type IconProps, type IconsConfig, _default$4 as Image, type ImageProps, InputField, type InputFieldProps, _default$1 as Label, type LabelProps, Loader, type LoaderConfig, type LoaderName, type LoaderProps, type LocalStoragePluginOptions, type MenuItem, Modal, type ModalProps, type ModalRef, type OmitProps, PageHeader, type PageHeaderProps, PageHolder, type PageHolderProps, type PartialRecord, type PickAllRequired, type PickValue, type PluginName, type ReactRouterDomPluginOptions, SideMenu, type Styles, type TabGroup, Table, type TableColumn, type TableFilterData, type TableProps, type TableRef, Tabs, type TabsProps, type TabsRef, Text, type TextAs, type TextProps, type TextareaFieldProps, type Theme, type ThemeConfig, _default$2 as ToggleInput, type ToggleInputProps, type ToggleInputRef, Tooltip, type TooltipProps, type TooltipRef, type VerticalDividerProps, alertControls, alertsPlugin, colorThemeControls, countries, darkenColor, defaultAlertsPluginOptions, defaultLocalStoragePluginOptions, defaultReactRouterDomPluginOptions, desaturateColor, eventPreventDefault, eventPreventStop, eventStopPropagation, filterHover, formatPhoneNumber, generateLocalStorage, generateRandomString, getBrowser, getFormErrorObject, isMobileDevice, lightenColor, loaderControls, localStoragePlugin, reactRouterDomPlugin, saturateColor, sideMenuControls, useAlertControls, useBetterHtmlContext, useBooleanState, useDebounceState, useForm, useLoader, useLoaderControls, useMediaQuery, usePageResize, usePageScroll, useTheme, useUrlQuery };
package/dist/index.d.ts CHANGED
@@ -2,6 +2,7 @@ import { WebTarget } from 'styled-components';
2
2
  import * as react from 'react';
3
3
  import { ComponentProps, ReactNode } from 'react';
4
4
  import * as react_jsx_runtime from 'react/jsx-runtime';
5
+ import { useNavigate, useLocation, useInRouterContext, useSearchParams } from 'react-router-dom';
5
6
 
6
7
  type PluginName = "alerts" | "react-router-dom" | "localStorage";
7
8
  type BetterHtmlPluginConstructor<T extends object = object> = (config?: T) => BetterHtmlPlugin<T>;
@@ -586,7 +587,7 @@ declare function useForm<FormFields extends Record<string | number, string | num
586
587
  dropdownRefs: Record<keyof FormFields, HTMLDivElement | undefined>;
587
588
  toggleInputRefs: Record<keyof FormFields, ToggleInputRef | undefined>;
588
589
  validate: () => {};
589
- onSubmit: (event: React.FormEvent<HTMLFormElement>) => Promise<void>;
590
+ onSubmit: (event?: React.FormEvent<HTMLFormElement>) => Promise<void>;
590
591
  reset: () => void;
591
592
  requiredFields: (keyof FormFields)[] | undefined;
592
593
  isDirty: boolean;
@@ -700,7 +701,7 @@ declare const ColorThemeSwitch: typeof ColorThemeSwitchComponent & {
700
701
  type FilterPreset = "today" | "yesterday" | "tomorrow" | "thisWeek" | "thisMonth" | "thisYear" | "lastWeek" | "lastMonth" | "lastYear" | "nextWeek" | "nextMonth" | "nextYear";
701
702
  type ListFilterValue = {
702
703
  label?: string;
703
- value: string;
704
+ value: number | string;
704
705
  count: number;
705
706
  };
706
707
  type TableFilterData = {
@@ -713,7 +714,7 @@ type TableFilterData = {
713
714
  max?: string;
714
715
  } | {
715
716
  type: "list";
716
- list?: string[];
717
+ list?: ListFilterValue["value"][];
717
718
  };
718
719
  type TextColumn<DataItem> = {
719
720
  type: "text";
@@ -930,6 +931,34 @@ declare const Foldable: typeof FoldableComponent & {
930
931
  box: typeof FoldableComponent.box;
931
932
  };
932
933
 
934
+ type MenuItem = {
935
+ text: string;
936
+ iconName: IconName | AnyOtherString;
937
+ href?: string;
938
+ onClick?: (item: MenuItem) => void;
939
+ disabled?: boolean;
940
+ hidden?: boolean;
941
+ children?: MenuItem[];
942
+ };
943
+ type SideMenuProps = {
944
+ items: MenuItem[];
945
+ logoAssetName?: AssetName | AnyOtherString;
946
+ logoUrl?: string;
947
+ logoText?: string;
948
+ logoFontFamily?: string;
949
+ collapsable?: boolean;
950
+ widthMobileHandle?: boolean;
951
+ };
952
+ type SideMenuComponentType = {
953
+ (props: SideMenuProps): React.ReactElement;
954
+ pageHolder: (props: SideMenuPageHolderProps) => React.ReactElement;
955
+ };
956
+ declare const SideMenuComponent: SideMenuComponentType;
957
+ type SideMenuPageHolderProps = PageHolderProps & {};
958
+ declare const SideMenu: typeof SideMenuComponent & {
959
+ pageHolder: typeof SideMenuComponent.pageHolder;
960
+ };
961
+
933
962
  type AppConfig = {
934
963
  contentMaxWidth: number;
935
964
  };
@@ -951,6 +980,10 @@ type BetterHtmlConfig = {
951
980
  style?: ComponentStyleConfig<"default" | "secondary" | "destructive" | "icon" | "upload">;
952
981
  tagReplacement?: ComponentTagReplacementConfig<"buttonComponent" | "linkComponent">;
953
982
  };
983
+ sideMenu?: {
984
+ /** @default 300 */
985
+ width?: number;
986
+ };
954
987
  };
955
988
  };
956
989
 
@@ -1020,6 +1053,12 @@ declare const alertControls: {
1020
1053
  createAlert: (alert: OmitProps<Alert, "id">) => Alert;
1021
1054
  removeAlert: (alertId: string) => void;
1022
1055
  };
1056
+ declare const sideMenuControls: {
1057
+ expand: () => void;
1058
+ collapse: () => void;
1059
+ open: () => void;
1060
+ close: () => void;
1061
+ };
1023
1062
  declare const colorThemeControls: {
1024
1063
  toggleTheme: (theme?: ColorTheme) => void;
1025
1064
  };
@@ -1053,7 +1092,12 @@ type AlertsPluginOptions = {
1053
1092
  declare const defaultAlertsPluginOptions: Required<AlertsPluginOptions>;
1054
1093
  declare const alertsPlugin: BetterHtmlPluginConstructor<AlertsPluginOptions>;
1055
1094
 
1056
- type ReactRouterDomPluginOptions = {};
1095
+ type ReactRouterDomPluginOptions = {
1096
+ useNavigate: typeof useNavigate;
1097
+ useLocation: typeof useLocation;
1098
+ useInRouterContext: typeof useInRouterContext;
1099
+ useSearchParams: typeof useSearchParams;
1100
+ };
1057
1101
  declare const defaultReactRouterDomPluginOptions: Required<ReactRouterDomPluginOptions>;
1058
1102
  declare const reactRouterDomPlugin: BetterHtmlPluginConstructor<ReactRouterDomPluginOptions>;
1059
1103
 
@@ -1071,4 +1115,4 @@ type LocalStoragePluginOptions = {
1071
1115
  declare const defaultLocalStoragePluginOptions: Required<LocalStoragePluginOptions>;
1072
1116
  declare const localStoragePlugin: BetterHtmlPluginConstructor<LocalStoragePluginOptions>;
1073
1117
 
1074
- export { type Alert, type AlertType, type AlertsPluginOptions, type AppConfig, type AssetName, type AssetsConfig, type BetterHtmlConfig, type BetterHtmlPlugin, _default as BetterHtmlProvider, type BetterHtmlProviderConfig, type BrowserName, Button, type ButtonProps, Chip, type ChipProps, type Color, type ColorName, type ColorTheme, ColorThemeSwitch, type ColorThemeSwitchProps, type Colors, type ComponentHoverStyle, type ComponentMarginProps, type ComponentPaddingProps, type DeepPartialRecord, Div, type DivProps, _default$3 as Divider, Dropdown, type DropdownOption, type DropdownProps, type ExcludeOptions, Foldable, type FoldableProps, type FoldableRef, Form, type FormProps, FormRow, type FormRowProps, type HorizontalDividerProps, _default$5 as Icon, type IconName, type IconProps, type IconsConfig, _default$4 as Image, type ImageProps, InputField, type InputFieldProps, _default$1 as Label, type LabelProps, Loader, type LoaderConfig, type LoaderName, type LoaderProps, type LocalStoragePluginOptions, Modal, type ModalProps, type ModalRef, type OmitProps, PageHeader, type PageHeaderProps, PageHolder, type PageHolderProps, type PartialRecord, type PickAllRequired, type PickValue, type PluginName, type ReactRouterDomPluginOptions, type Styles, type TabGroup, Table, type TableColumn, type TableFilterData, type TableProps, type TableRef, Tabs, type TabsProps, type TabsRef, Text, type TextAs, type TextProps, type TextareaFieldProps, type Theme, type ThemeConfig, _default$2 as ToggleInput, type ToggleInputProps, type ToggleInputRef, Tooltip, type TooltipProps, type TooltipRef, type VerticalDividerProps, alertControls, alertsPlugin, colorThemeControls, countries, darkenColor, defaultAlertsPluginOptions, defaultLocalStoragePluginOptions, defaultReactRouterDomPluginOptions, desaturateColor, eventPreventDefault, eventPreventStop, eventStopPropagation, filterHover, formatPhoneNumber, generateLocalStorage, generateRandomString, getBrowser, getFormErrorObject, isMobileDevice, lightenColor, loaderControls, localStoragePlugin, reactRouterDomPlugin, saturateColor, useAlertControls, useBetterHtmlContext, useBooleanState, useDebounceState, useForm, useLoader, useLoaderControls, useMediaQuery, usePageResize, usePageScroll, useTheme, useUrlQuery };
1118
+ export { type Alert, type AlertType, type AlertsPluginOptions, type AppConfig, type AssetName, type AssetsConfig, type BetterHtmlConfig, type BetterHtmlPlugin, _default as BetterHtmlProvider, type BetterHtmlProviderConfig, type BrowserName, Button, type ButtonProps, Chip, type ChipProps, type Color, type ColorName, type ColorTheme, ColorThemeSwitch, type ColorThemeSwitchProps, type Colors, type ComponentHoverStyle, type ComponentMarginProps, type ComponentPaddingProps, type DeepPartialRecord, Div, type DivProps, _default$3 as Divider, Dropdown, type DropdownOption, type DropdownProps, type ExcludeOptions, Foldable, type FoldableProps, type FoldableRef, Form, type FormProps, FormRow, type FormRowProps, type HorizontalDividerProps, _default$5 as Icon, type IconName, type IconProps, type IconsConfig, _default$4 as Image, type ImageProps, InputField, type InputFieldProps, _default$1 as Label, type LabelProps, Loader, type LoaderConfig, type LoaderName, type LoaderProps, type LocalStoragePluginOptions, type MenuItem, Modal, type ModalProps, type ModalRef, type OmitProps, PageHeader, type PageHeaderProps, PageHolder, type PageHolderProps, type PartialRecord, type PickAllRequired, type PickValue, type PluginName, type ReactRouterDomPluginOptions, SideMenu, type Styles, type TabGroup, Table, type TableColumn, type TableFilterData, type TableProps, type TableRef, Tabs, type TabsProps, type TabsRef, Text, type TextAs, type TextProps, type TextareaFieldProps, type Theme, type ThemeConfig, _default$2 as ToggleInput, type ToggleInputProps, type ToggleInputRef, Tooltip, type TooltipProps, type TooltipRef, type VerticalDividerProps, alertControls, alertsPlugin, colorThemeControls, countries, darkenColor, defaultAlertsPluginOptions, defaultLocalStoragePluginOptions, defaultReactRouterDomPluginOptions, desaturateColor, eventPreventDefault, eventPreventStop, eventStopPropagation, filterHover, formatPhoneNumber, generateLocalStorage, generateRandomString, getBrowser, getFormErrorObject, isMobileDevice, lightenColor, loaderControls, localStoragePlugin, reactRouterDomPlugin, saturateColor, sideMenuControls, useAlertControls, useBetterHtmlContext, useBooleanState, useDebounceState, useForm, useLoader, useLoaderControls, useMediaQuery, usePageResize, usePageScroll, useTheme, useUrlQuery };