@ainias42/react-bootstrap-mobile 0.1.30 → 0.1.32
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/.eslintrc.json +1 -1
- package/bootstrapReactMobile.ts +1 -0
- package/dist/bootstrapReactMobile.d.ts +1 -0
- package/dist/bootstrapReactMobile.js +1473 -1049
- package/dist/bootstrapReactMobile.js.map +1 -1
- package/dist/src/Components/DragAndDrop/DropArea.d.ts +1 -3
- package/dist/src/Components/Hooks/useClientLayoutEffect.d.ts +2 -0
- package/dist/src/Components/Hooks/useDelayed.d.ts +1 -1
- package/dist/src/Components/Layout/Block.d.ts +1 -1
- package/dist/src/Components/Layout/Flex.d.ts +1 -1
- package/dist/src/Components/Layout/Inline.d.ts +1 -1
- package/dist/src/Components/Layout/InlineBlock.d.ts +1 -1
- package/dist/src/Components/Layout/View.d.ts +2 -3
- package/dist/src/Components/Layout/ViewWithoutListeners.d.ts +2 -3
- package/package.json +64 -53
- package/src/Components/Card/Card.tsx +0 -1
- package/src/Components/Dialog/DialogContainer.tsx +0 -1
- package/src/Components/DragAndDrop/DropArea.tsx +2 -6
- package/src/Components/FormElements/Button/Button.tsx +1 -1
- package/src/Components/FormElements/ColorInput/ColorInput.tsx +3 -2
- package/src/Components/FormElements/Input/FileInput/FileInput.tsx +1 -1
- package/src/Components/FormElements/Input/FileInput/MultipleFileInput.tsx +1 -3
- package/src/Components/FormElements/Input/HiddenInput.tsx +0 -1
- package/src/Components/FormElements/Input/Input.tsx +68 -19
- package/src/Components/FormElements/Select/Select.tsx +1 -1
- package/src/Components/FullScreen/FullScreen.tsx +1 -1
- package/src/Components/Hooks/useClientLayoutEffect.ts +8 -0
- package/src/Components/Hooks/useDelayed.ts +1 -1
- package/src/Components/Hooks/useMousePosition.ts +3 -2
- package/src/Components/Layout/Grid/GridItem.tsx +0 -1
- package/src/Components/Layout/Grow.tsx +2 -4
- package/src/Components/Layout/View.tsx +6 -10
- package/src/Components/Layout/ViewWithoutListeners.tsx +5 -9
- package/src/Components/Menu/Menu.tsx +9 -9
- package/src/Components/RbmComponentProps.ts +0 -1
- package/src/Components/SpoilerList/Spoiler/Spoiler.tsx +1 -3
- package/src/Components/Toast/Toast.tsx +2 -1
- package/src/Components/Toast/toast.scss +2 -0
- package/src/helper/withRenderBrowserOnly.tsx +2 -2
- package/webpack.config.js +1 -0
|
@@ -2,6 +2,4 @@ import * as React from 'react';
|
|
|
2
2
|
import { RbmComponentProps, WithNoStringAndChildrenProps } from '../RbmComponentProps';
|
|
3
3
|
import { DroppableProps } from 'react-beautiful-dnd';
|
|
4
4
|
export type DropAreaProps = RbmComponentProps<Omit<DroppableProps, 'children'>, WithNoStringAndChildrenProps>;
|
|
5
|
-
declare
|
|
6
|
-
declare const DropAreaMemo: typeof DropArea;
|
|
7
|
-
export { DropAreaMemo as DropArea };
|
|
5
|
+
export declare const DropArea: ({ children, style, className, ...dropProps }: DropAreaProps) => React.JSX.Element | null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare function useDelayed<Args extends any[]>(callback: (...args: Args) => void | Promise<void>, dependencies: any[], delay?: number, maxDelay?: number): (...newArgs: Args) => void;
|
|
1
|
+
export declare function useDelayed<Args extends any[]>(callback: (...args: Args) => void | Promise<void>, dependencies: any[], delay?: number, maxDelay?: number | undefined): (...newArgs: Args) => void;
|
|
@@ -3,5 +3,5 @@
|
|
|
3
3
|
import { RbmComponentProps } from '../RbmComponentProps';
|
|
4
4
|
import { ViewWithoutListenersProps } from './ViewWithoutListeners';
|
|
5
5
|
export type BlockProps<AsType extends keyof JSX.IntrinsicElements> = RbmComponentProps<ViewWithoutListenersProps<AsType>>;
|
|
6
|
-
declare const BlockMemo: import("../../helper/withForwardRef").RefComponent<BlockProps<keyof JSX.IntrinsicElements>, SVGSymbolElement | SVGElement | HTMLObjectElement | HTMLElement | HTMLHtmlElement | SVGTextElement | HTMLTitleElement |
|
|
6
|
+
declare const BlockMemo: import("../../helper/withForwardRef").RefComponent<BlockProps<keyof JSX.IntrinsicElements>, SVGSymbolElement | SVGElement | HTMLObjectElement | HTMLElement | HTMLHtmlElement | SVGTextElement | HTMLTitleElement | HTMLLinkElement | HTMLInputElement | HTMLAnchorElement | HTMLAreaElement | HTMLAudioElement | HTMLBaseElement | HTMLQuoteElement | HTMLBodyElement | HTMLBRElement | HTMLButtonElement | HTMLCanvasElement | HTMLTableColElement | HTMLDataElement | HTMLDataListElement | HTMLModElement | HTMLDetailsElement | HTMLDialogElement | HTMLDivElement | HTMLDListElement | HTMLEmbedElement | HTMLFieldSetElement | HTMLFormElement | HTMLHeadingElement | HTMLHeadElement | HTMLHRElement | HTMLIFrameElement | HTMLImageElement | HTMLLabelElement | HTMLLegendElement | HTMLLIElement | HTMLMapElement | HTMLMetaElement | HTMLMeterElement | HTMLOListElement | HTMLOptGroupElement | HTMLOptionElement | HTMLOutputElement | HTMLParagraphElement | HTMLParamElement | HTMLPreElement | HTMLProgressElement | HTMLSlotElement | HTMLScriptElement | HTMLSelectElement | HTMLSourceElement | HTMLSpanElement | HTMLStyleElement | HTMLTableElement | HTMLTemplateElement | HTMLTableSectionElement | HTMLTableDataCellElement | HTMLTextAreaElement | HTMLTableHeaderCellElement | HTMLTimeElement | HTMLTableRowElement | HTMLTrackElement | HTMLUListElement | HTMLVideoElement | HTMLWebViewElement | SVGCircleElement | SVGClipPathElement | SVGDefsElement | SVGDescElement | SVGEllipseElement | SVGFEBlendElement | SVGFEColorMatrixElement | SVGFEComponentTransferElement | SVGFECompositeElement | SVGFEConvolveMatrixElement | SVGFEDiffuseLightingElement | SVGFEDisplacementMapElement | SVGFEDistantLightElement | SVGFEDropShadowElement | SVGFEFloodElement | SVGFEFuncAElement | SVGFEFuncBElement | SVGFEFuncGElement | SVGFEFuncRElement | SVGFEGaussianBlurElement | SVGFEImageElement | SVGFEMergeElement | SVGFEMergeNodeElement | SVGFEMorphologyElement | SVGFEOffsetElement | SVGFEPointLightElement | SVGFESpecularLightingElement | SVGFESpotLightElement | SVGFETileElement | SVGFETurbulenceElement | SVGFilterElement | SVGForeignObjectElement | SVGGElement | SVGImageElement | SVGLineElement | SVGLinearGradientElement | SVGMarkerElement | SVGMaskElement | SVGMetadataElement | SVGPathElement | SVGPatternElement | SVGPolygonElement | SVGPolylineElement | SVGRadialGradientElement | SVGRectElement | SVGStopElement | SVGSVGElement | SVGSwitchElement | SVGTextPathElement | SVGTSpanElement | SVGUseElement | SVGViewElement | SVGSetElement>;
|
|
7
7
|
export { BlockMemo as Block };
|
|
@@ -6,5 +6,5 @@ export type FlexProps<AsType extends keyof JSX.IntrinsicElements> = RbmComponent
|
|
|
6
6
|
horizontal?: boolean;
|
|
7
7
|
grow?: boolean;
|
|
8
8
|
}>;
|
|
9
|
-
declare const tmp: import("../../helper/withForwardRef").RefComponent<FlexProps<keyof JSX.IntrinsicElements>, SVGSymbolElement | SVGElement | HTMLObjectElement | HTMLElement | HTMLHtmlElement | SVGTextElement | HTMLTitleElement |
|
|
9
|
+
declare const tmp: import("../../helper/withForwardRef").RefComponent<FlexProps<keyof JSX.IntrinsicElements>, SVGSymbolElement | SVGElement | HTMLObjectElement | HTMLElement | HTMLHtmlElement | SVGTextElement | HTMLTitleElement | HTMLLinkElement | HTMLInputElement | HTMLAnchorElement | HTMLAreaElement | HTMLAudioElement | HTMLBaseElement | HTMLQuoteElement | HTMLBodyElement | HTMLBRElement | HTMLButtonElement | HTMLCanvasElement | HTMLTableColElement | HTMLDataElement | HTMLDataListElement | HTMLModElement | HTMLDetailsElement | HTMLDialogElement | HTMLDivElement | HTMLDListElement | HTMLEmbedElement | HTMLFieldSetElement | HTMLFormElement | HTMLHeadingElement | HTMLHeadElement | HTMLHRElement | HTMLIFrameElement | HTMLImageElement | HTMLLabelElement | HTMLLegendElement | HTMLLIElement | HTMLMapElement | HTMLMetaElement | HTMLMeterElement | HTMLOListElement | HTMLOptGroupElement | HTMLOptionElement | HTMLOutputElement | HTMLParagraphElement | HTMLParamElement | HTMLPreElement | HTMLProgressElement | HTMLSlotElement | HTMLScriptElement | HTMLSelectElement | HTMLSourceElement | HTMLSpanElement | HTMLStyleElement | HTMLTableElement | HTMLTemplateElement | HTMLTableSectionElement | HTMLTableDataCellElement | HTMLTextAreaElement | HTMLTableHeaderCellElement | HTMLTimeElement | HTMLTableRowElement | HTMLTrackElement | HTMLUListElement | HTMLVideoElement | HTMLWebViewElement | SVGCircleElement | SVGClipPathElement | SVGDefsElement | SVGDescElement | SVGEllipseElement | SVGFEBlendElement | SVGFEColorMatrixElement | SVGFEComponentTransferElement | SVGFECompositeElement | SVGFEConvolveMatrixElement | SVGFEDiffuseLightingElement | SVGFEDisplacementMapElement | SVGFEDistantLightElement | SVGFEDropShadowElement | SVGFEFloodElement | SVGFEFuncAElement | SVGFEFuncBElement | SVGFEFuncGElement | SVGFEFuncRElement | SVGFEGaussianBlurElement | SVGFEImageElement | SVGFEMergeElement | SVGFEMergeNodeElement | SVGFEMorphologyElement | SVGFEOffsetElement | SVGFEPointLightElement | SVGFESpecularLightingElement | SVGFESpotLightElement | SVGFETileElement | SVGFETurbulenceElement | SVGFilterElement | SVGForeignObjectElement | SVGGElement | SVGImageElement | SVGLineElement | SVGLinearGradientElement | SVGMarkerElement | SVGMaskElement | SVGMetadataElement | SVGPathElement | SVGPatternElement | SVGPolygonElement | SVGPolylineElement | SVGRadialGradientElement | SVGRectElement | SVGStopElement | SVGSVGElement | SVGSwitchElement | SVGTextPathElement | SVGTSpanElement | SVGUseElement | SVGViewElement | SVGSetElement>;
|
|
10
10
|
export { tmp as Flex };
|
|
@@ -3,5 +3,5 @@
|
|
|
3
3
|
import { RbmComponentProps } from '../RbmComponentProps';
|
|
4
4
|
import { ViewWithoutListenersProps } from './ViewWithoutListeners';
|
|
5
5
|
export type InlineProps<AsType extends keyof JSX.IntrinsicElements> = RbmComponentProps<ViewWithoutListenersProps<AsType>>;
|
|
6
|
-
declare const InlineMemo: import("../../helper/withForwardRef").RefComponent<InlineProps<keyof JSX.IntrinsicElements>, SVGSymbolElement | SVGElement | HTMLObjectElement | HTMLElement | HTMLHtmlElement | SVGTextElement | HTMLTitleElement |
|
|
6
|
+
declare const InlineMemo: import("../../helper/withForwardRef").RefComponent<InlineProps<keyof JSX.IntrinsicElements>, SVGSymbolElement | SVGElement | HTMLObjectElement | HTMLElement | HTMLHtmlElement | SVGTextElement | HTMLTitleElement | HTMLLinkElement | HTMLInputElement | HTMLAnchorElement | HTMLAreaElement | HTMLAudioElement | HTMLBaseElement | HTMLQuoteElement | HTMLBodyElement | HTMLBRElement | HTMLButtonElement | HTMLCanvasElement | HTMLTableColElement | HTMLDataElement | HTMLDataListElement | HTMLModElement | HTMLDetailsElement | HTMLDialogElement | HTMLDivElement | HTMLDListElement | HTMLEmbedElement | HTMLFieldSetElement | HTMLFormElement | HTMLHeadingElement | HTMLHeadElement | HTMLHRElement | HTMLIFrameElement | HTMLImageElement | HTMLLabelElement | HTMLLegendElement | HTMLLIElement | HTMLMapElement | HTMLMetaElement | HTMLMeterElement | HTMLOListElement | HTMLOptGroupElement | HTMLOptionElement | HTMLOutputElement | HTMLParagraphElement | HTMLParamElement | HTMLPreElement | HTMLProgressElement | HTMLSlotElement | HTMLScriptElement | HTMLSelectElement | HTMLSourceElement | HTMLSpanElement | HTMLStyleElement | HTMLTableElement | HTMLTemplateElement | HTMLTableSectionElement | HTMLTableDataCellElement | HTMLTextAreaElement | HTMLTableHeaderCellElement | HTMLTimeElement | HTMLTableRowElement | HTMLTrackElement | HTMLUListElement | HTMLVideoElement | HTMLWebViewElement | SVGCircleElement | SVGClipPathElement | SVGDefsElement | SVGDescElement | SVGEllipseElement | SVGFEBlendElement | SVGFEColorMatrixElement | SVGFEComponentTransferElement | SVGFECompositeElement | SVGFEConvolveMatrixElement | SVGFEDiffuseLightingElement | SVGFEDisplacementMapElement | SVGFEDistantLightElement | SVGFEDropShadowElement | SVGFEFloodElement | SVGFEFuncAElement | SVGFEFuncBElement | SVGFEFuncGElement | SVGFEFuncRElement | SVGFEGaussianBlurElement | SVGFEImageElement | SVGFEMergeElement | SVGFEMergeNodeElement | SVGFEMorphologyElement | SVGFEOffsetElement | SVGFEPointLightElement | SVGFESpecularLightingElement | SVGFESpotLightElement | SVGFETileElement | SVGFETurbulenceElement | SVGFilterElement | SVGForeignObjectElement | SVGGElement | SVGImageElement | SVGLineElement | SVGLinearGradientElement | SVGMarkerElement | SVGMaskElement | SVGMetadataElement | SVGPathElement | SVGPatternElement | SVGPolygonElement | SVGPolylineElement | SVGRadialGradientElement | SVGRectElement | SVGStopElement | SVGSVGElement | SVGSwitchElement | SVGTextPathElement | SVGTSpanElement | SVGUseElement | SVGViewElement | SVGSetElement>;
|
|
7
7
|
export { InlineMemo as Inline };
|
|
@@ -6,5 +6,5 @@ export type InlineBlockProps<AsType extends keyof JSX.IntrinsicElements> = RbmCo
|
|
|
6
6
|
id?: string;
|
|
7
7
|
title?: string;
|
|
8
8
|
}>;
|
|
9
|
-
declare const InlineBlockMemo: import("../../helper/withForwardRef").RefComponent<InlineBlockProps<keyof JSX.IntrinsicElements>, SVGSymbolElement | SVGElement | HTMLObjectElement | HTMLElement | HTMLHtmlElement | SVGTextElement | HTMLTitleElement |
|
|
9
|
+
declare const InlineBlockMemo: import("../../helper/withForwardRef").RefComponent<InlineBlockProps<keyof JSX.IntrinsicElements>, SVGSymbolElement | SVGElement | HTMLObjectElement | HTMLElement | HTMLHtmlElement | SVGTextElement | HTMLTitleElement | HTMLLinkElement | HTMLInputElement | HTMLAnchorElement | HTMLAreaElement | HTMLAudioElement | HTMLBaseElement | HTMLQuoteElement | HTMLBodyElement | HTMLBRElement | HTMLButtonElement | HTMLCanvasElement | HTMLTableColElement | HTMLDataElement | HTMLDataListElement | HTMLModElement | HTMLDetailsElement | HTMLDialogElement | HTMLDivElement | HTMLDListElement | HTMLEmbedElement | HTMLFieldSetElement | HTMLFormElement | HTMLHeadingElement | HTMLHeadElement | HTMLHRElement | HTMLIFrameElement | HTMLImageElement | HTMLLabelElement | HTMLLegendElement | HTMLLIElement | HTMLMapElement | HTMLMetaElement | HTMLMeterElement | HTMLOListElement | HTMLOptGroupElement | HTMLOptionElement | HTMLOutputElement | HTMLParagraphElement | HTMLParamElement | HTMLPreElement | HTMLProgressElement | HTMLSlotElement | HTMLScriptElement | HTMLSelectElement | HTMLSourceElement | HTMLSpanElement | HTMLStyleElement | HTMLTableElement | HTMLTemplateElement | HTMLTableSectionElement | HTMLTableDataCellElement | HTMLTextAreaElement | HTMLTableHeaderCellElement | HTMLTimeElement | HTMLTableRowElement | HTMLTrackElement | HTMLUListElement | HTMLVideoElement | HTMLWebViewElement | SVGCircleElement | SVGClipPathElement | SVGDefsElement | SVGDescElement | SVGEllipseElement | SVGFEBlendElement | SVGFEColorMatrixElement | SVGFEComponentTransferElement | SVGFECompositeElement | SVGFEConvolveMatrixElement | SVGFEDiffuseLightingElement | SVGFEDisplacementMapElement | SVGFEDistantLightElement | SVGFEDropShadowElement | SVGFEFloodElement | SVGFEFuncAElement | SVGFEFuncBElement | SVGFEFuncGElement | SVGFEFuncRElement | SVGFEGaussianBlurElement | SVGFEImageElement | SVGFEMergeElement | SVGFEMergeNodeElement | SVGFEMorphologyElement | SVGFEOffsetElement | SVGFEPointLightElement | SVGFESpecularLightingElement | SVGFESpotLightElement | SVGFETileElement | SVGFETurbulenceElement | SVGFilterElement | SVGForeignObjectElement | SVGGElement | SVGImageElement | SVGLineElement | SVGLinearGradientElement | SVGMarkerElement | SVGMaskElement | SVGMetadataElement | SVGPathElement | SVGPatternElement | SVGPolygonElement | SVGPolylineElement | SVGRadialGradientElement | SVGRectElement | SVGStopElement | SVGSVGElement | SVGSwitchElement | SVGTextPathElement | SVGTSpanElement | SVGUseElement | SVGViewElement | SVGSetElement>;
|
|
10
10
|
export { InlineBlockMemo as InlineBlock };
|
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { PropsWithChildren } from 'react';
|
|
3
3
|
import { Override } from '../../TypeHelpers';
|
|
4
4
|
export type ViewProps<AsType extends keyof JSX.IntrinsicElements> = PropsWithChildren<Override<React.ComponentPropsWithoutRef<AsType>, {
|
|
5
5
|
as?: AsType;
|
|
6
6
|
children?: React.ReactNode;
|
|
7
7
|
}>>;
|
|
8
|
-
declare const
|
|
9
|
-
export { ViewMemo as View };
|
|
8
|
+
export declare const View: import("../../helper/withForwardRef").RefComponent<ViewProps<keyof JSX.IntrinsicElements>, SVGSymbolElement | SVGElement | HTMLObjectElement | HTMLElement | HTMLHtmlElement | SVGTextElement | HTMLTitleElement | HTMLLinkElement | HTMLInputElement | HTMLAnchorElement | HTMLAreaElement | HTMLAudioElement | HTMLBaseElement | HTMLQuoteElement | HTMLBodyElement | HTMLBRElement | HTMLButtonElement | HTMLCanvasElement | HTMLTableColElement | HTMLDataElement | HTMLDataListElement | HTMLModElement | HTMLDetailsElement | HTMLDialogElement | HTMLDivElement | HTMLDListElement | HTMLEmbedElement | HTMLFieldSetElement | HTMLFormElement | HTMLHeadingElement | HTMLHeadElement | HTMLHRElement | HTMLIFrameElement | HTMLImageElement | HTMLLabelElement | HTMLLegendElement | HTMLLIElement | HTMLMapElement | HTMLMetaElement | HTMLMeterElement | HTMLOListElement | HTMLOptGroupElement | HTMLOptionElement | HTMLOutputElement | HTMLParagraphElement | HTMLParamElement | HTMLPreElement | HTMLProgressElement | HTMLSlotElement | HTMLScriptElement | HTMLSelectElement | HTMLSourceElement | HTMLSpanElement | HTMLStyleElement | HTMLTableElement | HTMLTemplateElement | HTMLTableSectionElement | HTMLTableDataCellElement | HTMLTextAreaElement | HTMLTableHeaderCellElement | HTMLTimeElement | HTMLTableRowElement | HTMLTrackElement | HTMLUListElement | HTMLVideoElement | HTMLWebViewElement | SVGCircleElement | SVGClipPathElement | SVGDefsElement | SVGDescElement | SVGEllipseElement | SVGFEBlendElement | SVGFEColorMatrixElement | SVGFEComponentTransferElement | SVGFECompositeElement | SVGFEConvolveMatrixElement | SVGFEDiffuseLightingElement | SVGFEDisplacementMapElement | SVGFEDistantLightElement | SVGFEDropShadowElement | SVGFEFloodElement | SVGFEFuncAElement | SVGFEFuncBElement | SVGFEFuncGElement | SVGFEFuncRElement | SVGFEGaussianBlurElement | SVGFEImageElement | SVGFEMergeElement | SVGFEMergeNodeElement | SVGFEMorphologyElement | SVGFEOffsetElement | SVGFEPointLightElement | SVGFESpecularLightingElement | SVGFESpotLightElement | SVGFETileElement | SVGFETurbulenceElement | SVGFilterElement | SVGForeignObjectElement | SVGGElement | SVGImageElement | SVGLineElement | SVGLinearGradientElement | SVGMarkerElement | SVGMaskElement | SVGMetadataElement | SVGPathElement | SVGPatternElement | SVGPolygonElement | SVGPolylineElement | SVGRadialGradientElement | SVGRectElement | SVGStopElement | SVGSVGElement | SVGSwitchElement | SVGTextPathElement | SVGTSpanElement | SVGUseElement | SVGViewElement | SVGSetElement>;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { DOMAttributes } from 'react';
|
|
3
3
|
import { ViewProps } from './View';
|
|
4
4
|
export type ViewWithoutListenersProps<AsType extends keyof JSX.IntrinsicElements> = Omit<ViewProps<AsType>, keyof DOMAttributes<AsType>> & {
|
|
5
5
|
children?: React.ReactNode;
|
|
@@ -7,5 +7,4 @@ export type ViewWithoutListenersProps<AsType extends keyof JSX.IntrinsicElements
|
|
|
7
7
|
__html: string | TrustedHTML;
|
|
8
8
|
} | undefined;
|
|
9
9
|
};
|
|
10
|
-
declare const
|
|
11
|
-
export { ViewWithoutListenersMemo as ViewWithoutListeners };
|
|
10
|
+
export declare const ViewWithoutListeners: import("../../helper/withForwardRef").RefComponent<ViewWithoutListenersProps<keyof JSX.IntrinsicElements>, SVGSymbolElement | SVGElement | HTMLObjectElement | HTMLElement | HTMLHtmlElement | SVGTextElement | HTMLTitleElement | HTMLLinkElement | HTMLInputElement | HTMLAnchorElement | HTMLAreaElement | HTMLAudioElement | HTMLBaseElement | HTMLQuoteElement | HTMLBodyElement | HTMLBRElement | HTMLButtonElement | HTMLCanvasElement | HTMLTableColElement | HTMLDataElement | HTMLDataListElement | HTMLModElement | HTMLDetailsElement | HTMLDialogElement | HTMLDivElement | HTMLDListElement | HTMLEmbedElement | HTMLFieldSetElement | HTMLFormElement | HTMLHeadingElement | HTMLHeadElement | HTMLHRElement | HTMLIFrameElement | HTMLImageElement | HTMLLabelElement | HTMLLegendElement | HTMLLIElement | HTMLMapElement | HTMLMetaElement | HTMLMeterElement | HTMLOListElement | HTMLOptGroupElement | HTMLOptionElement | HTMLOutputElement | HTMLParagraphElement | HTMLParamElement | HTMLPreElement | HTMLProgressElement | HTMLSlotElement | HTMLScriptElement | HTMLSelectElement | HTMLSourceElement | HTMLSpanElement | HTMLStyleElement | HTMLTableElement | HTMLTemplateElement | HTMLTableSectionElement | HTMLTableDataCellElement | HTMLTextAreaElement | HTMLTableHeaderCellElement | HTMLTimeElement | HTMLTableRowElement | HTMLTrackElement | HTMLUListElement | HTMLVideoElement | HTMLWebViewElement | SVGCircleElement | SVGClipPathElement | SVGDefsElement | SVGDescElement | SVGEllipseElement | SVGFEBlendElement | SVGFEColorMatrixElement | SVGFEComponentTransferElement | SVGFECompositeElement | SVGFEConvolveMatrixElement | SVGFEDiffuseLightingElement | SVGFEDisplacementMapElement | SVGFEDistantLightElement | SVGFEDropShadowElement | SVGFEFloodElement | SVGFEFuncAElement | SVGFEFuncBElement | SVGFEFuncGElement | SVGFEFuncRElement | SVGFEGaussianBlurElement | SVGFEImageElement | SVGFEMergeElement | SVGFEMergeNodeElement | SVGFEMorphologyElement | SVGFEOffsetElement | SVGFEPointLightElement | SVGFESpecularLightingElement | SVGFESpotLightElement | SVGFETileElement | SVGFETurbulenceElement | SVGFilterElement | SVGForeignObjectElement | SVGGElement | SVGImageElement | SVGLineElement | SVGLinearGradientElement | SVGMarkerElement | SVGMaskElement | SVGMetadataElement | SVGPathElement | SVGPatternElement | SVGPolygonElement | SVGPolylineElement | SVGRadialGradientElement | SVGRectElement | SVGStopElement | SVGSVGElement | SVGSwitchElement | SVGTextPathElement | SVGTSpanElement | SVGUseElement | SVGViewElement | SVGSetElement>;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ainias42/react-bootstrap-mobile",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.32",
|
|
4
4
|
"description": "Mobile React Components using Bootstrap",
|
|
5
5
|
"main": "dist/bootstrapReactMobile",
|
|
6
6
|
"scripts": {
|
|
@@ -8,7 +8,10 @@
|
|
|
8
8
|
"build": "node bin/build.js && webpack",
|
|
9
9
|
"build:production": "node bin/build.js && webpack --env production",
|
|
10
10
|
"update packages": "node bin/updateCopies.js",
|
|
11
|
-
"typecheck": "tsc --noEmit"
|
|
11
|
+
"typecheck": "tsc --noEmit",
|
|
12
|
+
"lint:noCache": "eslint \"src/{**/*,*}.{js,jsx,tsx,ts}\" --max-warnings 0",
|
|
13
|
+
"lint": "npm run lint:noCache -- --cache",
|
|
14
|
+
"lint:fix": "npm run lint -- --fix"
|
|
12
15
|
},
|
|
13
16
|
"repository": {
|
|
14
17
|
"type": "git",
|
|
@@ -29,64 +32,72 @@
|
|
|
29
32
|
},
|
|
30
33
|
"homepage": "https://github.com/Ainias/Bootstrap-React-Mobile#readme",
|
|
31
34
|
"peerDependencies": {
|
|
32
|
-
"@fortawesome/fontawesome-svg-core": "^6.
|
|
33
|
-
"@fortawesome/free-regular-svg-icons": "^6.
|
|
34
|
-
"@fortawesome/free-solid-svg-icons": "^6.
|
|
35
|
-
"@fortawesome/react-fontawesome": "^0.2.
|
|
36
|
-
"
|
|
35
|
+
"@fortawesome/fontawesome-svg-core": "^6.5.2",
|
|
36
|
+
"@fortawesome/free-regular-svg-icons": "^6.5.2",
|
|
37
|
+
"@fortawesome/free-solid-svg-icons": "^6.5.2",
|
|
38
|
+
"@fortawesome/react-fontawesome": "^0.2.2",
|
|
39
|
+
"bootstrap": "^5.3.3",
|
|
40
|
+
"react": ">=18.0.0",
|
|
37
41
|
"react-beautiful-dnd": "^13.1.1"
|
|
38
42
|
},
|
|
39
43
|
"devDependencies": {
|
|
40
|
-
"
|
|
41
|
-
"
|
|
42
|
-
"
|
|
43
|
-
"
|
|
44
|
-
"
|
|
45
|
-
"@babel/
|
|
46
|
-
"@
|
|
47
|
-
"@
|
|
48
|
-
"@
|
|
49
|
-
"@
|
|
50
|
-
"@
|
|
51
|
-
"@
|
|
52
|
-
"@
|
|
53
|
-
"@
|
|
54
|
-
"@
|
|
55
|
-
"@
|
|
56
|
-
"
|
|
57
|
-
"
|
|
58
|
-
"
|
|
59
|
-
"
|
|
60
|
-
"
|
|
61
|
-
"
|
|
62
|
-
"eslint-
|
|
63
|
-
"eslint
|
|
64
|
-
"
|
|
65
|
-
"
|
|
66
|
-
"
|
|
44
|
+
"ajv": "^8.14.0",
|
|
45
|
+
"bootstrap": "^5.3.3",
|
|
46
|
+
"react": ">=18.0.0",
|
|
47
|
+
"react-dom": ">=18.3.1",
|
|
48
|
+
"react-beautiful-dnd": "^13.1.1",
|
|
49
|
+
"@babel/core": "^7.24.6",
|
|
50
|
+
"@babel/plugin-proposal-class-properties": "^7.18.6",
|
|
51
|
+
"@babel/plugin-transform-typescript": "^7.24.6",
|
|
52
|
+
"@babel/preset-env": "^7.24.6",
|
|
53
|
+
"@babel/preset-react": "^7.24.6",
|
|
54
|
+
"@babel/preset-typescript": "^7.24.6",
|
|
55
|
+
"@fortawesome/fontawesome-svg-core": "^6.5.2",
|
|
56
|
+
"@fortawesome/free-regular-svg-icons": "^6.5.2",
|
|
57
|
+
"@fortawesome/free-solid-svg-icons": "^6.5.2",
|
|
58
|
+
"@fortawesome/react-fontawesome": "^0.2.2",
|
|
59
|
+
"@types/react": ">=18.0.0",
|
|
60
|
+
"@types/react-beautiful-dnd": "^13.1.8",
|
|
61
|
+
"@types/react-color": "^3.0.12",
|
|
62
|
+
"@types/react-dom": ">=18.0.0",
|
|
63
|
+
"@types/react-table": "^7.7.20",
|
|
64
|
+
"@types/react-window": "^1.8.8",
|
|
65
|
+
"@types/react-window-infinite-loader": "^1.0.9",
|
|
66
|
+
"@typescript-eslint/eslint-plugin": "^7.11.0",
|
|
67
|
+
"@typescript-eslint/parser": "^7.11.0",
|
|
68
|
+
"babel-loader": "^9.1.3",
|
|
69
|
+
"css-loader": "^7.1.2",
|
|
70
|
+
"eslint": "^8.57.0",
|
|
71
|
+
"eslint-config-airbnb": "^19.0.4",
|
|
72
|
+
"eslint-config-airbnb-typescript": "^18.0.0",
|
|
73
|
+
"eslint-config-prettier": "^9.1.0",
|
|
74
|
+
"eslint-import-resolver-typescript": "^3.6.1",
|
|
75
|
+
"eslint-plugin-import": "^2.29.1",
|
|
76
|
+
"eslint-plugin-jsx-a11y": "^6.8.0",
|
|
77
|
+
"eslint-plugin-react": "^7.34.2",
|
|
78
|
+
"eslint-plugin-react-hooks": "^4.6.2",
|
|
79
|
+
"html-webpack-plugin": "^5.6.0",
|
|
67
80
|
"loader-utils": "3.2.1",
|
|
68
|
-
"mini-css-extract-plugin": "^2.
|
|
69
|
-
"prettier": "^
|
|
70
|
-
"sass": "^1.
|
|
71
|
-
"sass-loader": "^
|
|
72
|
-
"
|
|
73
|
-
"
|
|
74
|
-
"
|
|
75
|
-
"
|
|
76
|
-
"webpack": "^5.
|
|
77
|
-
"webpack-
|
|
78
|
-
"webpack-dev-server": "^4.8.1"
|
|
81
|
+
"mini-css-extract-plugin": "^2.9.0",
|
|
82
|
+
"prettier": "^3.2.5",
|
|
83
|
+
"sass": "^1.77.2",
|
|
84
|
+
"sass-loader": "^14.2.1",
|
|
85
|
+
"terser-webpack-plugin": "^5.3.10",
|
|
86
|
+
"ts-loader": "^9.5.1",
|
|
87
|
+
"typescript": "^5.4.5",
|
|
88
|
+
"webpack": "^5.91.0",
|
|
89
|
+
"webpack-cli": "^5.1.4",
|
|
90
|
+
"webpack-dev-server": "^5.0.4"
|
|
79
91
|
},
|
|
80
92
|
"dependencies": {
|
|
81
|
-
"@
|
|
82
|
-
"
|
|
93
|
+
"@ainias42/js-helper": ">=0.8.14",
|
|
94
|
+
"@types/react-virtualized-auto-sizer": "^1.0.4",
|
|
95
|
+
"classnames": "^2.5.1",
|
|
83
96
|
"isomorphic-style-loader": "^5.3.2",
|
|
84
|
-
"@ainias42/js-helper": ">=0.8.10",
|
|
85
97
|
"react-color": "^2.19.3",
|
|
86
|
-
"react-table": "^7.
|
|
87
|
-
"react-virtualized-auto-sizer": "^1.0.
|
|
88
|
-
"react-window": "^1.8.
|
|
89
|
-
"react-window-infinite-loader": "^1.0.
|
|
90
|
-
"styled-jsx": "^5.0.2"
|
|
98
|
+
"react-table": "^7.8.0",
|
|
99
|
+
"react-virtualized-auto-sizer": "^1.0.24",
|
|
100
|
+
"react-window": "^1.8.10",
|
|
101
|
+
"react-window-infinite-loader": "^1.0.9"
|
|
91
102
|
}
|
|
92
103
|
}
|
|
@@ -3,7 +3,6 @@ import {ComponentType, ForwardedRef, PropsWithChildren, useCallback, useImperati
|
|
|
3
3
|
import { PromiseWithHandlers } from '@ainias42/js-helper';
|
|
4
4
|
import { DialogProvider, ShowDialog } from './DialogContext';
|
|
5
5
|
import { Dialog } from './Dialog';
|
|
6
|
-
import { EmptyProps } from '../../helper/EmptyProps';
|
|
7
6
|
import {withForwardRef} from "../../helper/withForwardRef";
|
|
8
7
|
import { Block } from "../Layout/Block";
|
|
9
8
|
|
|
@@ -6,7 +6,7 @@ import { useStrictEnabled } from './useStrictEnabled';
|
|
|
6
6
|
|
|
7
7
|
export type DropAreaProps = RbmComponentProps<Omit<DroppableProps, 'children'>, WithNoStringAndChildrenProps>;
|
|
8
8
|
|
|
9
|
-
function DropArea({ children, style, className, ...dropProps }: DropAreaProps) {
|
|
9
|
+
export const DropArea = withMemo(function DropArea({ children, style, className, ...dropProps }: DropAreaProps) {
|
|
10
10
|
// Variables
|
|
11
11
|
|
|
12
12
|
// Refs
|
|
@@ -37,8 +37,4 @@ function DropArea({ children, style, className, ...dropProps }: DropAreaProps) {
|
|
|
37
37
|
)}
|
|
38
38
|
</Droppable>
|
|
39
39
|
);
|
|
40
|
-
}
|
|
41
|
-
|
|
42
|
-
// Need DropAreaMemo for autocompletion of phpstorm
|
|
43
|
-
const DropAreaMemo = withMemo(DropArea);
|
|
44
|
-
export { DropAreaMemo as DropArea };
|
|
40
|
+
});
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import {Override} from '@ainias42/js-helper';
|
|
3
|
-
import {OptionalListener,
|
|
3
|
+
import {OptionalListener, useListenerWithExtractedProps} from '../../Hooks/useListener';
|
|
4
4
|
|
|
5
5
|
import styles from './button.scss';
|
|
6
6
|
import classNames from 'classnames';
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import {useCallback, useRef, useState, MouseEvent
|
|
2
|
+
import {useCallback, useRef, useState, MouseEvent} from 'react';
|
|
3
3
|
import {Color, ColorChangeHandler, ColorResult, SketchPicker} from 'react-color';
|
|
4
4
|
import {OptionalListener, useListener} from '../../Hooks/useListener';
|
|
5
5
|
import {withMemo} from '../../../helper/withMemo';
|
|
@@ -7,6 +7,7 @@ import {withMemo} from '../../../helper/withMemo';
|
|
|
7
7
|
import styles from './colorInput.scss';
|
|
8
8
|
import {useSharedSelectedColor} from './sharedSelectedColor';
|
|
9
9
|
import {Menu} from "../../Menu/Menu";
|
|
10
|
+
import { useClientLayoutEffect } from "../../Hooks/useClientLayoutEffect";
|
|
10
11
|
|
|
11
12
|
export type ColorInputProps<OnChangeData> = {
|
|
12
13
|
defaultValue?: string;
|
|
@@ -112,7 +113,7 @@ function ColorInput<OnChangeData>({
|
|
|
112
113
|
);
|
|
113
114
|
|
|
114
115
|
// Effects
|
|
115
|
-
|
|
116
|
+
useClientLayoutEffect(() => {
|
|
116
117
|
if (!modalRef.current) {
|
|
117
118
|
return;
|
|
118
119
|
}
|
|
@@ -48,7 +48,7 @@ export const FileInput = withMemo(function FileInput<OnChangeData>({
|
|
|
48
48
|
|
|
49
49
|
// Other
|
|
50
50
|
|
|
51
|
-
//
|
|
51
|
+
// Render Functions
|
|
52
52
|
return <MultipleFileInput maxFiles={1} value={innerValue} onChangeFiles={onChangeFiles}
|
|
53
53
|
mimeTypes={mimeTypes} showDeleteButton={!required} {...multipleFileInputProps}/>;
|
|
54
54
|
|
|
@@ -187,7 +187,6 @@ export const MultipleFileInput = withMemo(function MultipleImageInput<OnChangeDa
|
|
|
187
187
|
}
|
|
188
188
|
|
|
189
189
|
indexRef.current = index;
|
|
190
|
-
console.log("LOG-d inputRef dispatch", inputRef.current);
|
|
191
190
|
inputRef.current.dispatchEvent(new MouseEvent("click"));
|
|
192
191
|
}, [allowOverride]);
|
|
193
192
|
|
|
@@ -236,7 +235,6 @@ export const MultipleFileInput = withMemo(function MultipleImageInput<OnChangeDa
|
|
|
236
235
|
</Flex>
|
|
237
236
|
<Flex horizontal={true} className={styles.previewContainer}>
|
|
238
237
|
{value?.map((file, index) => {
|
|
239
|
-
console.log("LOG-d file", file);
|
|
240
238
|
return <Grow className={styles.preview} center={true} key={file.data}>
|
|
241
239
|
<Clickable
|
|
242
240
|
onDrop={onDrop}
|
|
@@ -252,7 +250,7 @@ export const MultipleFileInput = withMemo(function MultipleImageInput<OnChangeDa
|
|
|
252
250
|
<Icon icon={faTimesCircle}/>
|
|
253
251
|
</Clickable>}
|
|
254
252
|
</Clickable>
|
|
255
|
-
</Grow
|
|
253
|
+
</Grow>;
|
|
256
254
|
})}
|
|
257
255
|
<Grow className={classNames(styles.addFile, {[styles.hidden]: value.length >= maxFiles})} center={true}>
|
|
258
256
|
<Clickable
|
|
@@ -1,12 +1,11 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import {
|
|
3
|
-
|
|
3
|
+
ChangeEvent,
|
|
4
4
|
InputHTMLAttributes,
|
|
5
5
|
KeyboardEvent,
|
|
6
6
|
MutableRefObject,
|
|
7
|
-
useCallback,
|
|
8
|
-
useRef,
|
|
9
|
-
useState
|
|
7
|
+
useCallback, useEffect,
|
|
8
|
+
useMemo, useRef,
|
|
10
9
|
} from 'react';
|
|
11
10
|
import { RbmComponentProps } from '../../RbmComponentProps';
|
|
12
11
|
import { Override } from '../../../TypeHelpers';
|
|
@@ -40,6 +39,7 @@ export const Input = withForwardRef(function Input<OnChangeData, OnBlurData, OnC
|
|
|
40
39
|
onKeyDown,
|
|
41
40
|
inline = false,
|
|
42
41
|
value,
|
|
42
|
+
onChangeText,
|
|
43
43
|
...otherProps
|
|
44
44
|
}: InputProps<OnChangeData, OnBlurData, OnChangeDoneData>,
|
|
45
45
|
ref: MutableRefObject<HTMLInputElement> | null
|
|
@@ -48,20 +48,34 @@ export const Input = withForwardRef(function Input<OnChangeData, OnBlurData, OnC
|
|
|
48
48
|
|
|
49
49
|
// States
|
|
50
50
|
const usedValue = useMemo(() => {
|
|
51
|
-
if (otherProps.type !== "number" || typeof value === "number"){
|
|
51
|
+
if (otherProps.type !== "number" || typeof value === "number") {
|
|
52
52
|
return value;
|
|
53
53
|
}
|
|
54
|
-
if (typeof value === "string"){
|
|
55
|
-
if (
|
|
54
|
+
if (typeof value === "string") {
|
|
55
|
+
if (value === "-") {
|
|
56
|
+
return value;
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
const numberValue = parseFloat(value);
|
|
60
|
+
if (!Number.isNaN(numberValue) && Number.isFinite(numberValue)) {
|
|
61
|
+
if (otherProps.max !== undefined && numberValue > Number(otherProps.max)) {
|
|
62
|
+
return otherProps.max;
|
|
63
|
+
}
|
|
64
|
+
if (otherProps.min !== undefined && numberValue < Number(otherProps.min)) {
|
|
65
|
+
return otherProps.min;
|
|
66
|
+
}
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
if (!Number.isNaN(Number(value))) {
|
|
56
70
|
// Do not parse to allow ., and so on
|
|
57
71
|
return value;
|
|
58
72
|
}
|
|
59
|
-
if (!Number.isNaN(
|
|
73
|
+
if (!Number.isNaN(numberValue)) {
|
|
60
74
|
return parseFloat(value);
|
|
61
75
|
}
|
|
62
76
|
}
|
|
63
77
|
return "";
|
|
64
|
-
}, [value])
|
|
78
|
+
}, [value, otherProps.max, otherProps.min, otherProps.type]);
|
|
65
79
|
// Refs
|
|
66
80
|
const innerRef = useComposedRef(ref);
|
|
67
81
|
|
|
@@ -70,19 +84,24 @@ export const Input = withForwardRef(function Input<OnChangeData, OnBlurData, OnC
|
|
|
70
84
|
'onChange',
|
|
71
85
|
otherProps
|
|
72
86
|
);
|
|
73
|
-
const onChange = useCallback
|
|
74
|
-
(e) => {
|
|
75
|
-
if (
|
|
87
|
+
const onChange = useCallback(
|
|
88
|
+
(e: ChangeEvent<HTMLInputElement> | KeyboardEvent<HTMLInputElement>) => {
|
|
89
|
+
if (onChangeText) {
|
|
76
90
|
if (otherProps.type === "number") {
|
|
77
|
-
|
|
78
|
-
|
|
91
|
+
if (e.currentTarget.value === "-") {
|
|
92
|
+
onChangeText(e.currentTarget.value);
|
|
93
|
+
return;
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
const val = !Number.isNaN(Number(e.currentTarget.value)) ? e.currentTarget.value : !Number.isNaN(parseFloat(e.currentTarget.value)) ? String(parseFloat(e.currentTarget.value)) : "";
|
|
97
|
+
onChangeText(val);
|
|
79
98
|
} else {
|
|
80
|
-
|
|
99
|
+
onChangeText(e.currentTarget.value);
|
|
81
100
|
}
|
|
82
101
|
}
|
|
83
102
|
onChangeWithData(e);
|
|
84
103
|
},
|
|
85
|
-
[onChangeWithData,
|
|
104
|
+
[onChangeWithData, onChangeText, otherProps.type]
|
|
86
105
|
);
|
|
87
106
|
|
|
88
107
|
const [onBlur, otherPropsWithoutBlur] = useListenerWithExtractedProps<'onBlur', OnBlurData>(
|
|
@@ -102,25 +121,55 @@ export const Input = withForwardRef(function Input<OnChangeData, OnBlurData, OnC
|
|
|
102
121
|
if (otherProps.type === "number") {
|
|
103
122
|
const stringValue = (e.target as HTMLInputElement).value;
|
|
104
123
|
const val = !Number.isNaN(Number(stringValue)) ? stringValue : !Number.isNaN(parseFloat(stringValue)) ? String(parseFloat(stringValue)) : "";
|
|
105
|
-
otherProps.onEnter(val)
|
|
124
|
+
otherProps.onEnter(val);
|
|
106
125
|
} else {
|
|
107
126
|
otherProps.onEnter((e.target as HTMLInputElement).value);
|
|
108
127
|
}
|
|
128
|
+
}
|
|
109
129
|
|
|
130
|
+
if (otherProps.type === "number") {
|
|
131
|
+
const step = otherProps.step ? Number(otherProps.step) : 1;
|
|
132
|
+
if (e.key === "ArrowUp") {
|
|
133
|
+
let newValue = (parseFloat(e.currentTarget.value) || 0) + step;
|
|
134
|
+
if (otherProps.max !== undefined && newValue > Number(otherProps.max)) {
|
|
135
|
+
newValue = Number(otherProps.max);
|
|
136
|
+
}
|
|
137
|
+
e.currentTarget.value = newValue.toString();
|
|
138
|
+
onChange(e);
|
|
139
|
+
} else if (e.key === "ArrowDown") {
|
|
140
|
+
let newValue = (parseFloat(e.currentTarget.value) || 0) - step;
|
|
141
|
+
if (otherProps.min !== undefined && newValue < Number(otherProps.min)) {
|
|
142
|
+
newValue = Number(otherProps.min);
|
|
143
|
+
}
|
|
144
|
+
e.currentTarget.value = newValue.toString();
|
|
145
|
+
onChange(e);
|
|
146
|
+
}
|
|
110
147
|
}
|
|
111
148
|
},
|
|
112
|
-
[
|
|
149
|
+
[onKeyDown, onChange, otherProps]
|
|
113
150
|
);
|
|
114
151
|
|
|
115
152
|
// Effects
|
|
116
153
|
useOnChangeDone(onChangeDone, innerRef);
|
|
117
154
|
|
|
155
|
+
useEffect(() => {
|
|
156
|
+
// Add the onChangeDone for numbers
|
|
157
|
+
if (otherProps.type === "number") {
|
|
158
|
+
const elem = innerRef.current;
|
|
159
|
+
elem?.addEventListener('blur', onChangeDone);
|
|
160
|
+
return () => {
|
|
161
|
+
elem?.removeEventListener('blur', onChangeDone);
|
|
162
|
+
};
|
|
163
|
+
}
|
|
164
|
+
return undefined;
|
|
165
|
+
}, [ref, onChangeDone, innerRef, otherProps.type]);
|
|
166
|
+
|
|
167
|
+
|
|
118
168
|
// Other
|
|
119
169
|
|
|
120
170
|
// Render Functions
|
|
121
171
|
|
|
122
172
|
return (
|
|
123
|
-
// eslint-disable-next-line jsx-a11y/label-has-associated-control
|
|
124
173
|
<label className={classNames(styles.input, {[styles.inline]: inline}, className)} style={style}>
|
|
125
174
|
{label ? <span className={styles.label}>{label}</span> : null}
|
|
126
175
|
<input
|
|
@@ -2,7 +2,7 @@ import * as React from 'react';
|
|
|
2
2
|
import { RbmComponentProps } from '../../RbmComponentProps';
|
|
3
3
|
import { Override } from '../../../TypeHelpers';
|
|
4
4
|
import { ChangeEventHandler, SelectHTMLAttributes, useCallback } from 'react';
|
|
5
|
-
import {OptionalListener,
|
|
5
|
+
import {OptionalListener, useListenerWithExtractedProps} from '../../Hooks/useListener';
|
|
6
6
|
|
|
7
7
|
import styles from './select.scss';
|
|
8
8
|
import { withMemo } from '../../../helper/withMemo';
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { useLayoutEffect } from "react";
|
|
2
|
+
|
|
3
|
+
export function useClientLayoutEffect(...params: Parameters<typeof useLayoutEffect>) {
|
|
4
|
+
if (typeof window !== 'undefined') {
|
|
5
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps,react-hooks/rules-of-hooks
|
|
6
|
+
useLayoutEffect(...params);
|
|
7
|
+
}
|
|
8
|
+
}
|
|
@@ -4,7 +4,7 @@ export function useDelayed<Args extends any[]>(
|
|
|
4
4
|
callback: (...args: Args) => void | Promise<void>,
|
|
5
5
|
dependencies: any[],
|
|
6
6
|
delay = 100,
|
|
7
|
-
maxDelay
|
|
7
|
+
maxDelay: number|undefined = undefined
|
|
8
8
|
) {
|
|
9
9
|
const argsRef = useRef<Args | undefined>(undefined);
|
|
10
10
|
const timeoutRef = useRef<any>(undefined);
|
|
@@ -1,8 +1,9 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import {useRef} from "react";
|
|
2
|
+
import { useClientLayoutEffect } from "./useClientLayoutEffect";
|
|
2
3
|
|
|
3
4
|
export function useMousePosition() {
|
|
4
5
|
const position = useRef({ x: 0, y: 0 });
|
|
5
|
-
|
|
6
|
+
useClientLayoutEffect(() => {
|
|
6
7
|
const setFromEvent = (e: MouseEvent) => {
|
|
7
8
|
position.current = { x: e.clientX, y: e.clientY };
|
|
8
9
|
};
|