@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.
Files changed (40) hide show
  1. package/.eslintrc.json +1 -1
  2. package/bootstrapReactMobile.ts +1 -0
  3. package/dist/bootstrapReactMobile.d.ts +1 -0
  4. package/dist/bootstrapReactMobile.js +1473 -1049
  5. package/dist/bootstrapReactMobile.js.map +1 -1
  6. package/dist/src/Components/DragAndDrop/DropArea.d.ts +1 -3
  7. package/dist/src/Components/Hooks/useClientLayoutEffect.d.ts +2 -0
  8. package/dist/src/Components/Hooks/useDelayed.d.ts +1 -1
  9. package/dist/src/Components/Layout/Block.d.ts +1 -1
  10. package/dist/src/Components/Layout/Flex.d.ts +1 -1
  11. package/dist/src/Components/Layout/Inline.d.ts +1 -1
  12. package/dist/src/Components/Layout/InlineBlock.d.ts +1 -1
  13. package/dist/src/Components/Layout/View.d.ts +2 -3
  14. package/dist/src/Components/Layout/ViewWithoutListeners.d.ts +2 -3
  15. package/package.json +64 -53
  16. package/src/Components/Card/Card.tsx +0 -1
  17. package/src/Components/Dialog/DialogContainer.tsx +0 -1
  18. package/src/Components/DragAndDrop/DropArea.tsx +2 -6
  19. package/src/Components/FormElements/Button/Button.tsx +1 -1
  20. package/src/Components/FormElements/ColorInput/ColorInput.tsx +3 -2
  21. package/src/Components/FormElements/Input/FileInput/FileInput.tsx +1 -1
  22. package/src/Components/FormElements/Input/FileInput/MultipleFileInput.tsx +1 -3
  23. package/src/Components/FormElements/Input/HiddenInput.tsx +0 -1
  24. package/src/Components/FormElements/Input/Input.tsx +68 -19
  25. package/src/Components/FormElements/Select/Select.tsx +1 -1
  26. package/src/Components/FullScreen/FullScreen.tsx +1 -1
  27. package/src/Components/Hooks/useClientLayoutEffect.ts +8 -0
  28. package/src/Components/Hooks/useDelayed.ts +1 -1
  29. package/src/Components/Hooks/useMousePosition.ts +3 -2
  30. package/src/Components/Layout/Grid/GridItem.tsx +0 -1
  31. package/src/Components/Layout/Grow.tsx +2 -4
  32. package/src/Components/Layout/View.tsx +6 -10
  33. package/src/Components/Layout/ViewWithoutListeners.tsx +5 -9
  34. package/src/Components/Menu/Menu.tsx +9 -9
  35. package/src/Components/RbmComponentProps.ts +0 -1
  36. package/src/Components/SpoilerList/Spoiler/Spoiler.tsx +1 -3
  37. package/src/Components/Toast/Toast.tsx +2 -1
  38. package/src/Components/Toast/toast.scss +2 -0
  39. package/src/helper/withRenderBrowserOnly.tsx +2 -2
  40. 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 function DropArea({ children, style, className, ...dropProps }: DropAreaProps): React.JSX.Element | null;
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;
@@ -0,0 +1,2 @@
1
+ import { useLayoutEffect } from "react";
2
+ export declare function useClientLayoutEffect(...params: Parameters<typeof useLayoutEffect>): void;
@@ -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 | HTMLStyleElement | 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 | HTMLInputElement | HTMLLabelElement | HTMLLegendElement | HTMLLIElement | HTMLLinkElement | HTMLMapElement | HTMLMetaElement | HTMLMeterElement | HTMLOListElement | HTMLOptGroupElement | HTMLOptionElement | HTMLOutputElement | HTMLParagraphElement | HTMLParamElement | HTMLPreElement | HTMLProgressElement | HTMLSlotElement | HTMLScriptElement | HTMLSelectElement | HTMLSourceElement | HTMLSpanElement | HTMLTableElement | HTMLTemplateElement | HTMLTableSectionElement | HTMLTableDataCellElement | HTMLTextAreaElement | HTMLTableHeaderCellElement | HTMLTimeElement | HTMLTableRowElement | HTMLTrackElement | HTMLUListElement | HTMLVideoElement | HTMLWebViewElement | SVGSVGElement | 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 | SVGSwitchElement | SVGTextPathElement | SVGTSpanElement | SVGUseElement | SVGViewElement>;
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 | HTMLStyleElement | 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 | HTMLInputElement | HTMLLabelElement | HTMLLegendElement | HTMLLIElement | HTMLLinkElement | HTMLMapElement | HTMLMetaElement | HTMLMeterElement | HTMLOListElement | HTMLOptGroupElement | HTMLOptionElement | HTMLOutputElement | HTMLParagraphElement | HTMLParamElement | HTMLPreElement | HTMLProgressElement | HTMLSlotElement | HTMLScriptElement | HTMLSelectElement | HTMLSourceElement | HTMLSpanElement | HTMLTableElement | HTMLTemplateElement | HTMLTableSectionElement | HTMLTableDataCellElement | HTMLTextAreaElement | HTMLTableHeaderCellElement | HTMLTimeElement | HTMLTableRowElement | HTMLTrackElement | HTMLUListElement | HTMLVideoElement | HTMLWebViewElement | SVGSVGElement | 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 | SVGSwitchElement | SVGTextPathElement | SVGTSpanElement | SVGUseElement | SVGViewElement>;
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 | HTMLStyleElement | 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 | HTMLInputElement | HTMLLabelElement | HTMLLegendElement | HTMLLIElement | HTMLLinkElement | HTMLMapElement | HTMLMetaElement | HTMLMeterElement | HTMLOListElement | HTMLOptGroupElement | HTMLOptionElement | HTMLOutputElement | HTMLParagraphElement | HTMLParamElement | HTMLPreElement | HTMLProgressElement | HTMLSlotElement | HTMLScriptElement | HTMLSelectElement | HTMLSourceElement | HTMLSpanElement | HTMLTableElement | HTMLTemplateElement | HTMLTableSectionElement | HTMLTableDataCellElement | HTMLTextAreaElement | HTMLTableHeaderCellElement | HTMLTimeElement | HTMLTableRowElement | HTMLTrackElement | HTMLUListElement | HTMLVideoElement | HTMLWebViewElement | SVGSVGElement | 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 | SVGSwitchElement | SVGTextPathElement | SVGTSpanElement | SVGUseElement | SVGViewElement>;
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 | HTMLStyleElement | 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 | HTMLInputElement | HTMLLabelElement | HTMLLegendElement | HTMLLIElement | HTMLLinkElement | HTMLMapElement | HTMLMetaElement | HTMLMeterElement | HTMLOListElement | HTMLOptGroupElement | HTMLOptionElement | HTMLOutputElement | HTMLParagraphElement | HTMLParamElement | HTMLPreElement | HTMLProgressElement | HTMLSlotElement | HTMLScriptElement | HTMLSelectElement | HTMLSourceElement | HTMLSpanElement | HTMLTableElement | HTMLTemplateElement | HTMLTableSectionElement | HTMLTableDataCellElement | HTMLTextAreaElement | HTMLTableHeaderCellElement | HTMLTimeElement | HTMLTableRowElement | HTMLTrackElement | HTMLUListElement | HTMLVideoElement | HTMLWebViewElement | SVGSVGElement | 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 | SVGSwitchElement | SVGTextPathElement | SVGTSpanElement | SVGUseElement | SVGViewElement>;
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 { ComponentRef, PropsWithChildren, ReactNode, RefAttributes } from 'react';
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 ViewMemo: <AsType extends keyof JSX.IntrinsicElements>(props: ViewProps<AsType> & RefAttributes<ComponentRef<AsType>>) => ReactNode | null;
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 { ComponentRef, DOMAttributes, ReactNode, RefAttributes } from 'react';
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 ViewWithoutListenersMemo: <AsType extends keyof JSX.IntrinsicElements>(props: ViewWithoutListenersProps<AsType> & RefAttributes<ComponentRef<AsType>>) => ReactNode;
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.30",
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.4.0",
33
- "@fortawesome/free-regular-svg-icons": "^6.4.0",
34
- "@fortawesome/free-solid-svg-icons": "^6.4.0",
35
- "@fortawesome/react-fontawesome": "^0.2.0",
36
- "react": ">=17.0.0",
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
- "@babel/core": "^7.15.0",
41
- "@babel/plugin-proposal-class-properties": "^7.16.7",
42
- "@babel/plugin-transform-typescript": "^7.16.8",
43
- "@babel/preset-env": "^7.17.10",
44
- "@babel/preset-react": "^7.16.7",
45
- "@babel/preset-typescript": "^7.16.7",
46
- "@types/react": ">=17.0.0",
47
- "@types/react-beautiful-dnd": "^13.1.3",
48
- "@types/react-color": "^3.0.6",
49
- "@types/react-dom": ">=17.0.0",
50
- "@types/react-redux": "^7.1.18",
51
- "@types/react-table": "^7.7.9",
52
- "@types/react-window": "^1.8.5",
53
- "@types/react-window-infinite-loader": "^1.0.6",
54
- "@typescript-eslint/eslint-plugin": "^4.30.0",
55
- "@typescript-eslint/parser": "^4.30.0",
56
- "babel-loader": "^8.2.5",
57
- "bootstrap": "^5.1.0",
58
- "css-loader": "^6.7.1",
59
- "eslint": "^7.32.0",
60
- "eslint-config-airbnb": "^18.2.1",
61
- "eslint-config-airbnb-typescript": "^14.0.0",
62
- "eslint-config-prettier": "^8.3.0",
63
- "eslint-import-resolver-typescript": "^2.4.0",
64
- "eslint-plugin-import": "^2.26.0",
65
- "eslint-plugin-react": "^7.25.1",
66
- "html-webpack-plugin": "^5.5.0",
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.6.0",
69
- "prettier": "^2.3.2",
70
- "sass": "^1.53.0",
71
- "sass-loader": "^12.6.0",
72
- "style-loader": "^3.3.1",
73
- "terser-webpack-plugin": "^5.3.1",
74
- "ts-loader": "^9.2.9",
75
- "typescript": "^5.2.2",
76
- "webpack": "^5.72.0",
77
- "webpack-cli": "^4.9.2",
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
- "@types/react-virtualized-auto-sizer": "^1.0.1",
82
- "classnames": "^2.3.1",
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.7.0",
87
- "react-virtualized-auto-sizer": "^1.0.7",
88
- "react-window": "^1.8.8",
89
- "react-window-infinite-loader": "^1.0.8",
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
  }
@@ -1,6 +1,5 @@
1
1
  import * as React from 'react';
2
2
  import { RbmComponentProps } from '../RbmComponentProps';
3
-
4
3
  import styles from './card.scss';
5
4
  import { withMemo } from '../../helper/withMemo';
6
5
  import classNames from 'classnames';
@@ -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, useListener, useListenerWithExtractedProps} from '../../Hooks/useListener';
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, useEffect, useLayoutEffect} from 'react';
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
- useLayoutEffect(() => {
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
- // Render Functions
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,7 +1,6 @@
1
1
  import * as React from 'react';
2
2
  import { Input, InputProps } from './Input';
3
3
  import { withMemo } from '../../../helper/withMemo';
4
-
5
4
  import styles from './input.scss';
6
5
  import classNames from 'classnames';
7
6
 
@@ -1,12 +1,11 @@
1
1
  import * as React from 'react';
2
2
  import {
3
- ChangeEventHandler,
3
+ ChangeEvent,
4
4
  InputHTMLAttributes,
5
5
  KeyboardEvent,
6
6
  MutableRefObject,
7
- useCallback, useMemo,
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 (!Number.isNaN(Number(value))){
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(parseFloat(value))){
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<ChangeEventHandler<HTMLInputElement>>(
74
- (e) => {
75
- if (otherProps.onChangeText) {
87
+ const onChange = useCallback(
88
+ (e: ChangeEvent<HTMLInputElement> | KeyboardEvent<HTMLInputElement>) => {
89
+ if (onChangeText) {
76
90
  if (otherProps.type === "number") {
77
- const val = !Number.isNaN(Number(e.target.value)) ? e.target.value : !Number.isNaN(parseFloat(e.target.value)) ? String(parseFloat(e.target.value)) : "";
78
- otherProps.onChangeText(val);
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
- otherProps.onChangeText(e.target.value);
99
+ onChangeText(e.currentTarget.value);
81
100
  }
82
101
  }
83
102
  onChangeWithData(e);
84
103
  },
85
- [onChangeWithData, otherProps.onChangeText, otherProps.type]
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
- [otherProps.onEnter, onKeyDown, otherProps.type]
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, useListener, useListenerWithExtractedProps} from '../../Hooks/useListener';
5
+ import {OptionalListener, useListenerWithExtractedProps} from '../../Hooks/useListener';
6
6
 
7
7
  import styles from './select.scss';
8
8
  import { withMemo } from '../../../helper/withMemo';
@@ -77,5 +77,5 @@ export const FullScreen = withMemo(function FullScreen<AsTag extends keyof JSX.I
77
77
  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
78
78
  // @ts-ignore
79
79
  return React.createElement(element, props, children);
80
- })
80
+ });
81
81
 
@@ -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?: number
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 {useLayoutEffect, useRef} from "react";
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
- useLayoutEffect(() => {
6
+ useClientLayoutEffect(() => {
6
7
  const setFromEvent = (e: MouseEvent) => {
7
8
  position.current = { x: e.clientX, y: e.clientY };
8
9
  };
@@ -151,7 +151,6 @@ function GridItem({
151
151
  // Other
152
152
 
153
153
  // Render Functions
154
-
155
154
  return (
156
155
  <InlineBlock
157
156
  style={style}