react-better-html 1.1.276 → 1.1.277
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 +42 -3
- package/dist/index.d.ts +42 -3
- package/dist/index.js +721 -574
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +397 -251
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
|
@@ -5,6 +5,14 @@ import { ComponentProps, ReactNode } from 'react';
|
|
|
5
5
|
import { WebTarget } from 'styled-components';
|
|
6
6
|
import { Location, useNavigate, useLocation, useInRouterContext, useSearchParams, createSearchParams } from 'react-router-dom';
|
|
7
7
|
|
|
8
|
+
type Language = string;
|
|
9
|
+
type LanguageData<Words> = {
|
|
10
|
+
name: string;
|
|
11
|
+
code: Language;
|
|
12
|
+
words: Words;
|
|
13
|
+
flagCode: string;
|
|
14
|
+
};
|
|
15
|
+
|
|
8
16
|
type PluginName = "alerts" | "react-router-dom" | "localStorage";
|
|
9
17
|
type BetterHtmlPluginConstructor<T extends object = object> = (config?: T) => BetterHtmlPlugin<T>;
|
|
10
18
|
type BetterHtmlPlugin<T = object> = {
|
|
@@ -322,6 +330,8 @@ type DropdownProps<Value = unknown, Data = unknown> = {
|
|
|
322
330
|
debounceIsLoading?: boolean;
|
|
323
331
|
debounceMinimumSymbolsRequired?: number;
|
|
324
332
|
/** @default false */
|
|
333
|
+
withoutArrow?: boolean;
|
|
334
|
+
/** @default false */
|
|
325
335
|
withoutClearButton?: boolean;
|
|
326
336
|
/** @default false */
|
|
327
337
|
withoutRenderingOptionsWhenClosed?: boolean;
|
|
@@ -341,11 +351,15 @@ type DropdownProps<Value = unknown, Data = unknown> = {
|
|
|
341
351
|
});
|
|
342
352
|
type DropdownComponentType = {
|
|
343
353
|
<Value, Data>(props: ComponentPropWithRef<HTMLDivElement, DropdownProps<Value, Data>>): React.ReactElement;
|
|
344
|
-
countries: (props: ComponentPropWithRef<HTMLDivElement, OmitProps<DropdownProps<
|
|
354
|
+
countries: (props: ComponentPropWithRef<HTMLDivElement, OmitProps<DropdownProps<Country["code"], Country>, "options">>) => React.ReactElement;
|
|
355
|
+
language: (props: ComponentPropWithRef<HTMLDivElement, OmitProps<DropdownProps<Language, LanguageData<object>> & {
|
|
356
|
+
isSmall?: boolean;
|
|
357
|
+
}, "options">>) => React.ReactElement;
|
|
345
358
|
};
|
|
346
359
|
declare const DropdownComponent: DropdownComponentType;
|
|
347
360
|
declare const Dropdown: typeof DropdownComponent & {
|
|
348
361
|
countries: typeof DropdownComponent.countries;
|
|
362
|
+
language: typeof DropdownComponent.language;
|
|
349
363
|
};
|
|
350
364
|
|
|
351
365
|
type ToggleInputRef = {};
|
|
@@ -457,6 +471,7 @@ type BetterHtmlConfig = {
|
|
|
457
471
|
app: AppConfig;
|
|
458
472
|
sideMenuIsCollapsed: boolean;
|
|
459
473
|
sideMenuIsOpenMobile: boolean;
|
|
474
|
+
language: Language | undefined;
|
|
460
475
|
components: {
|
|
461
476
|
button?: {
|
|
462
477
|
style?: ComponentStyleConfig<ButtonProps, "default" | "secondary" | "destructive" | "icon" | "upload">;
|
|
@@ -466,7 +481,7 @@ type BetterHtmlConfig = {
|
|
|
466
481
|
style?: ComponentStyleConfig<InputFieldProps, "default" | "multiline" | "email" | "password" | "search" | "phoneNumber" | "date" | "dateTime" | "time" | "color">;
|
|
467
482
|
};
|
|
468
483
|
dropdown?: {
|
|
469
|
-
style?: ComponentStyleConfig<DropdownProps, "default" | "countries">;
|
|
484
|
+
style?: ComponentStyleConfig<DropdownProps, "default" | "countries" | "language">;
|
|
470
485
|
};
|
|
471
486
|
toggleInput?: {
|
|
472
487
|
style?: ComponentStyleConfig<ToggleInputProps, "checkbox" | "radiobutton" | "switch">;
|
|
@@ -655,6 +670,30 @@ declare function generateLocalStorage<LocalStorage extends object>(): {
|
|
|
655
670
|
}) => void;
|
|
656
671
|
};
|
|
657
672
|
|
|
673
|
+
declare function generateI18n<Words extends object & {
|
|
674
|
+
templates: Record<string, string>;
|
|
675
|
+
}>(config: {
|
|
676
|
+
defaultLanguage: Language;
|
|
677
|
+
languages: Record<Language, LanguageData<Words>>;
|
|
678
|
+
}): {
|
|
679
|
+
defaultLanguage: Language;
|
|
680
|
+
languages: Record<Language, LanguageData<Words>>;
|
|
681
|
+
t: {
|
|
682
|
+
<T extends Record<string, (text: string, index: number) => React.ReactNode>>(getString: (path: (typeof config.languages)[Language]["words"]) => string, template: T): React.ReactNode;
|
|
683
|
+
(getString: (path: (typeof config.languages)[Language]["words"]) => string): string;
|
|
684
|
+
};
|
|
685
|
+
language: string;
|
|
686
|
+
setLanguage: (language: Language) => void;
|
|
687
|
+
useI18n: () => {
|
|
688
|
+
t: {
|
|
689
|
+
<T extends Record<string, (text: string, index: number) => React.ReactNode>>(getString: (path: (typeof config.languages)[Language]["words"]) => string, template: T): React.ReactNode;
|
|
690
|
+
(getString: (path: (typeof config.languages)[Language]["words"]) => string): string;
|
|
691
|
+
};
|
|
692
|
+
language: string;
|
|
693
|
+
setLanguage: (language: Language) => void;
|
|
694
|
+
};
|
|
695
|
+
};
|
|
696
|
+
|
|
658
697
|
type LoaderProps = {
|
|
659
698
|
/** @default textPrimary */
|
|
660
699
|
color?: Color;
|
|
@@ -1202,4 +1241,4 @@ type LocalStoragePluginOptions = {
|
|
|
1202
1241
|
declare const defaultLocalStoragePluginOptions: Required<LocalStoragePluginOptions>;
|
|
1203
1242
|
declare const localStoragePlugin: BetterHtmlPluginConstructor<LocalStoragePluginOptions>;
|
|
1204
1243
|
|
|
1205
|
-
export { type Alert, type AlertDisplay, type AlertDuration, type AlertType, type AlertsPluginOptions, type AppConfig, type BetterHtmlConfig, type BetterHtmlPlugin, _default$1 as BetterHtmlProvider, type BetterHtmlProviderConfig, type BrowserName, type BurgerButtonProps, Button, type ButtonProps, Chip, type ChipProps, ColorThemeSwitch, type ColorThemeSwitchProps, type ComponentHoverStyle, type ComponentMarginProps, type ComponentPaddingProps, Div, type DivProps, _default$4 as Divider, Dropdown, type DropdownOption, type DropdownProps, Foldable, type FoldableProps, type FoldableRef, Form, type FormProps, FormRow, type FormRowProps, type HorizontalDividerProps, _default as Icon, type IconProps, _default$2 as Image, type ImageProps, InputField, type InputFieldProps, _default$3 as Label, type LabelProps, Loader, type LoaderProps, type LocalStoragePluginOptions, Modal, type ModalProps, type ModalRef, PageHeader, type PageHeaderProps, PageHolder, type PageHolderProps, Pagination, type PluginName, type ReactRouterDomPluginOptions, SideMenu, type SideMenuItem, type SideMenuProps, type Tab, type TabGroup, Table, type TableColumn, type TableFilterData, type TableListFilterListItem, type TableProps, type TableRef, Tabs, type TabsProps, type TabsRef, Text, type TextAs, type TextProps, type TextareaFieldProps, _default$5 as ToggleInput, type ToggleInputProps, type ToggleInputRef, Tooltip, type TooltipProps, type TooltipRef, type VerticalDividerProps, alertControls, alertsPlugin, defaultAlertsPluginOptions, defaultLocalStoragePluginOptions, defaultReactRouterDomPluginOptions, filterHover, generateLocalStorage, getBrowser, getFormErrorObject, isMobileDevice, localStoragePlugin, reactRouterDomPlugin, sideMenuControls, useAlertControls, useBetterHtmlContext, useForm, useMediaQuery, usePageResize, usePageScroll, useUrlQuery };
|
|
1244
|
+
export { type Alert, type AlertDisplay, type AlertDuration, type AlertType, type AlertsPluginOptions, type AppConfig, type BetterHtmlConfig, type BetterHtmlPlugin, _default$1 as BetterHtmlProvider, type BetterHtmlProviderConfig, type BrowserName, type BurgerButtonProps, Button, type ButtonProps, Chip, type ChipProps, ColorThemeSwitch, type ColorThemeSwitchProps, type ComponentHoverStyle, type ComponentMarginProps, type ComponentPaddingProps, Div, type DivProps, _default$4 as Divider, Dropdown, type DropdownOption, type DropdownProps, Foldable, type FoldableProps, type FoldableRef, Form, type FormProps, FormRow, type FormRowProps, type HorizontalDividerProps, _default as Icon, type IconProps, _default$2 as Image, type ImageProps, InputField, type InputFieldProps, _default$3 as Label, type LabelProps, Loader, type LoaderProps, type LocalStoragePluginOptions, Modal, type ModalProps, type ModalRef, PageHeader, type PageHeaderProps, PageHolder, type PageHolderProps, Pagination, type PluginName, type ReactRouterDomPluginOptions, SideMenu, type SideMenuItem, type SideMenuProps, type Tab, type TabGroup, Table, type TableColumn, type TableFilterData, type TableListFilterListItem, type TableProps, type TableRef, Tabs, type TabsProps, type TabsRef, Text, type TextAs, type TextProps, type TextareaFieldProps, _default$5 as ToggleInput, type ToggleInputProps, type ToggleInputRef, Tooltip, type TooltipProps, type TooltipRef, type VerticalDividerProps, alertControls, alertsPlugin, defaultAlertsPluginOptions, defaultLocalStoragePluginOptions, defaultReactRouterDomPluginOptions, filterHover, generateI18n, generateLocalStorage, getBrowser, getFormErrorObject, isMobileDevice, localStoragePlugin, reactRouterDomPlugin, sideMenuControls, useAlertControls, useBetterHtmlContext, useForm, useMediaQuery, usePageResize, usePageScroll, useUrlQuery };
|
package/dist/index.d.ts
CHANGED
|
@@ -5,6 +5,14 @@ import { ComponentProps, ReactNode } from 'react';
|
|
|
5
5
|
import { WebTarget } from 'styled-components';
|
|
6
6
|
import { Location, useNavigate, useLocation, useInRouterContext, useSearchParams, createSearchParams } from 'react-router-dom';
|
|
7
7
|
|
|
8
|
+
type Language = string;
|
|
9
|
+
type LanguageData<Words> = {
|
|
10
|
+
name: string;
|
|
11
|
+
code: Language;
|
|
12
|
+
words: Words;
|
|
13
|
+
flagCode: string;
|
|
14
|
+
};
|
|
15
|
+
|
|
8
16
|
type PluginName = "alerts" | "react-router-dom" | "localStorage";
|
|
9
17
|
type BetterHtmlPluginConstructor<T extends object = object> = (config?: T) => BetterHtmlPlugin<T>;
|
|
10
18
|
type BetterHtmlPlugin<T = object> = {
|
|
@@ -322,6 +330,8 @@ type DropdownProps<Value = unknown, Data = unknown> = {
|
|
|
322
330
|
debounceIsLoading?: boolean;
|
|
323
331
|
debounceMinimumSymbolsRequired?: number;
|
|
324
332
|
/** @default false */
|
|
333
|
+
withoutArrow?: boolean;
|
|
334
|
+
/** @default false */
|
|
325
335
|
withoutClearButton?: boolean;
|
|
326
336
|
/** @default false */
|
|
327
337
|
withoutRenderingOptionsWhenClosed?: boolean;
|
|
@@ -341,11 +351,15 @@ type DropdownProps<Value = unknown, Data = unknown> = {
|
|
|
341
351
|
});
|
|
342
352
|
type DropdownComponentType = {
|
|
343
353
|
<Value, Data>(props: ComponentPropWithRef<HTMLDivElement, DropdownProps<Value, Data>>): React.ReactElement;
|
|
344
|
-
countries: (props: ComponentPropWithRef<HTMLDivElement, OmitProps<DropdownProps<
|
|
354
|
+
countries: (props: ComponentPropWithRef<HTMLDivElement, OmitProps<DropdownProps<Country["code"], Country>, "options">>) => React.ReactElement;
|
|
355
|
+
language: (props: ComponentPropWithRef<HTMLDivElement, OmitProps<DropdownProps<Language, LanguageData<object>> & {
|
|
356
|
+
isSmall?: boolean;
|
|
357
|
+
}, "options">>) => React.ReactElement;
|
|
345
358
|
};
|
|
346
359
|
declare const DropdownComponent: DropdownComponentType;
|
|
347
360
|
declare const Dropdown: typeof DropdownComponent & {
|
|
348
361
|
countries: typeof DropdownComponent.countries;
|
|
362
|
+
language: typeof DropdownComponent.language;
|
|
349
363
|
};
|
|
350
364
|
|
|
351
365
|
type ToggleInputRef = {};
|
|
@@ -457,6 +471,7 @@ type BetterHtmlConfig = {
|
|
|
457
471
|
app: AppConfig;
|
|
458
472
|
sideMenuIsCollapsed: boolean;
|
|
459
473
|
sideMenuIsOpenMobile: boolean;
|
|
474
|
+
language: Language | undefined;
|
|
460
475
|
components: {
|
|
461
476
|
button?: {
|
|
462
477
|
style?: ComponentStyleConfig<ButtonProps, "default" | "secondary" | "destructive" | "icon" | "upload">;
|
|
@@ -466,7 +481,7 @@ type BetterHtmlConfig = {
|
|
|
466
481
|
style?: ComponentStyleConfig<InputFieldProps, "default" | "multiline" | "email" | "password" | "search" | "phoneNumber" | "date" | "dateTime" | "time" | "color">;
|
|
467
482
|
};
|
|
468
483
|
dropdown?: {
|
|
469
|
-
style?: ComponentStyleConfig<DropdownProps, "default" | "countries">;
|
|
484
|
+
style?: ComponentStyleConfig<DropdownProps, "default" | "countries" | "language">;
|
|
470
485
|
};
|
|
471
486
|
toggleInput?: {
|
|
472
487
|
style?: ComponentStyleConfig<ToggleInputProps, "checkbox" | "radiobutton" | "switch">;
|
|
@@ -655,6 +670,30 @@ declare function generateLocalStorage<LocalStorage extends object>(): {
|
|
|
655
670
|
}) => void;
|
|
656
671
|
};
|
|
657
672
|
|
|
673
|
+
declare function generateI18n<Words extends object & {
|
|
674
|
+
templates: Record<string, string>;
|
|
675
|
+
}>(config: {
|
|
676
|
+
defaultLanguage: Language;
|
|
677
|
+
languages: Record<Language, LanguageData<Words>>;
|
|
678
|
+
}): {
|
|
679
|
+
defaultLanguage: Language;
|
|
680
|
+
languages: Record<Language, LanguageData<Words>>;
|
|
681
|
+
t: {
|
|
682
|
+
<T extends Record<string, (text: string, index: number) => React.ReactNode>>(getString: (path: (typeof config.languages)[Language]["words"]) => string, template: T): React.ReactNode;
|
|
683
|
+
(getString: (path: (typeof config.languages)[Language]["words"]) => string): string;
|
|
684
|
+
};
|
|
685
|
+
language: string;
|
|
686
|
+
setLanguage: (language: Language) => void;
|
|
687
|
+
useI18n: () => {
|
|
688
|
+
t: {
|
|
689
|
+
<T extends Record<string, (text: string, index: number) => React.ReactNode>>(getString: (path: (typeof config.languages)[Language]["words"]) => string, template: T): React.ReactNode;
|
|
690
|
+
(getString: (path: (typeof config.languages)[Language]["words"]) => string): string;
|
|
691
|
+
};
|
|
692
|
+
language: string;
|
|
693
|
+
setLanguage: (language: Language) => void;
|
|
694
|
+
};
|
|
695
|
+
};
|
|
696
|
+
|
|
658
697
|
type LoaderProps = {
|
|
659
698
|
/** @default textPrimary */
|
|
660
699
|
color?: Color;
|
|
@@ -1202,4 +1241,4 @@ type LocalStoragePluginOptions = {
|
|
|
1202
1241
|
declare const defaultLocalStoragePluginOptions: Required<LocalStoragePluginOptions>;
|
|
1203
1242
|
declare const localStoragePlugin: BetterHtmlPluginConstructor<LocalStoragePluginOptions>;
|
|
1204
1243
|
|
|
1205
|
-
export { type Alert, type AlertDisplay, type AlertDuration, type AlertType, type AlertsPluginOptions, type AppConfig, type BetterHtmlConfig, type BetterHtmlPlugin, _default$1 as BetterHtmlProvider, type BetterHtmlProviderConfig, type BrowserName, type BurgerButtonProps, Button, type ButtonProps, Chip, type ChipProps, ColorThemeSwitch, type ColorThemeSwitchProps, type ComponentHoverStyle, type ComponentMarginProps, type ComponentPaddingProps, Div, type DivProps, _default$4 as Divider, Dropdown, type DropdownOption, type DropdownProps, Foldable, type FoldableProps, type FoldableRef, Form, type FormProps, FormRow, type FormRowProps, type HorizontalDividerProps, _default as Icon, type IconProps, _default$2 as Image, type ImageProps, InputField, type InputFieldProps, _default$3 as Label, type LabelProps, Loader, type LoaderProps, type LocalStoragePluginOptions, Modal, type ModalProps, type ModalRef, PageHeader, type PageHeaderProps, PageHolder, type PageHolderProps, Pagination, type PluginName, type ReactRouterDomPluginOptions, SideMenu, type SideMenuItem, type SideMenuProps, type Tab, type TabGroup, Table, type TableColumn, type TableFilterData, type TableListFilterListItem, type TableProps, type TableRef, Tabs, type TabsProps, type TabsRef, Text, type TextAs, type TextProps, type TextareaFieldProps, _default$5 as ToggleInput, type ToggleInputProps, type ToggleInputRef, Tooltip, type TooltipProps, type TooltipRef, type VerticalDividerProps, alertControls, alertsPlugin, defaultAlertsPluginOptions, defaultLocalStoragePluginOptions, defaultReactRouterDomPluginOptions, filterHover, generateLocalStorage, getBrowser, getFormErrorObject, isMobileDevice, localStoragePlugin, reactRouterDomPlugin, sideMenuControls, useAlertControls, useBetterHtmlContext, useForm, useMediaQuery, usePageResize, usePageScroll, useUrlQuery };
|
|
1244
|
+
export { type Alert, type AlertDisplay, type AlertDuration, type AlertType, type AlertsPluginOptions, type AppConfig, type BetterHtmlConfig, type BetterHtmlPlugin, _default$1 as BetterHtmlProvider, type BetterHtmlProviderConfig, type BrowserName, type BurgerButtonProps, Button, type ButtonProps, Chip, type ChipProps, ColorThemeSwitch, type ColorThemeSwitchProps, type ComponentHoverStyle, type ComponentMarginProps, type ComponentPaddingProps, Div, type DivProps, _default$4 as Divider, Dropdown, type DropdownOption, type DropdownProps, Foldable, type FoldableProps, type FoldableRef, Form, type FormProps, FormRow, type FormRowProps, type HorizontalDividerProps, _default as Icon, type IconProps, _default$2 as Image, type ImageProps, InputField, type InputFieldProps, _default$3 as Label, type LabelProps, Loader, type LoaderProps, type LocalStoragePluginOptions, Modal, type ModalProps, type ModalRef, PageHeader, type PageHeaderProps, PageHolder, type PageHolderProps, Pagination, type PluginName, type ReactRouterDomPluginOptions, SideMenu, type SideMenuItem, type SideMenuProps, type Tab, type TabGroup, Table, type TableColumn, type TableFilterData, type TableListFilterListItem, type TableProps, type TableRef, Tabs, type TabsProps, type TabsRef, Text, type TextAs, type TextProps, type TextareaFieldProps, _default$5 as ToggleInput, type ToggleInputProps, type ToggleInputRef, Tooltip, type TooltipProps, type TooltipRef, type VerticalDividerProps, alertControls, alertsPlugin, defaultAlertsPluginOptions, defaultLocalStoragePluginOptions, defaultReactRouterDomPluginOptions, filterHover, generateI18n, generateLocalStorage, getBrowser, getFormErrorObject, isMobileDevice, localStoragePlugin, reactRouterDomPlugin, sideMenuControls, useAlertControls, useBetterHtmlContext, useForm, useMediaQuery, usePageResize, usePageScroll, useUrlQuery };
|