@ainias42/react-bootstrap-mobile 0.1.15 → 0.1.17

package/dist/src/Components/Clickable/Clickable.d.ts

@@ -1,14 +1,18 @@
 import { RbmComponentProps } from '../RbmComponentProps';
 import { OptionalListener } from '../Hooks/useListener';
+import { MouseEvent as ReactMouseEvent, MouseEvent } from 'react';
 type OnClickListener<Data> = OptionalListener<'onClick', Data>;
 type OnMouseDownListener<Data> = OptionalListener<'onMouseDown', Data>;
 type OnMouseUpListener<Data> = OptionalListener<'onMouseUp', Data>;
 type OnMouseMoveListener<Data> = OptionalListener<'onMouseMove', Data>;
-export type ClickableProps<OnClickData, OnMouseDownData, OnMouseMoveData, OnMouseUpData, OnClickCaptureData, HrefType extends string | undefined> = RbmComponentProps<{
+type OnDropListener<Data> = OptionalListener<'onDrop', Data>;
+type OnDragOverListener<Data> = OptionalListener<'onDragOver', Data>;
+export type ClickableProps<OnClickData, OnMouseDownData, OnMouseMoveData, OnMouseUpData, OnClickCaptureData, OnDropData, OnDragOverData, OnMouseEnterData, OnMouseLeaveData, OnDoubleClickData, HrefType extends string | undefined> = RbmComponentProps<{
     interactable?: boolean;
     href?: HrefType;
     preventDefault?: boolean;
     stopPropagation?: boolean;
-} & OnClickListener<OnClickData> & OnMouseDownListener<OnMouseDownData> & OnMouseMoveListener<OnMouseMoveData> & OnMouseUpListener<OnMouseUpData> & OptionalListener<'onClickCapture', OnClickCaptureData>>;
-declare const ClickableMemo: import("../../helper/withForwardRef").RefComponent<ClickableProps<unknown, unknown, unknown, unknown, unknown, string | undefined>, HTMLAnchorElement | HTMLSpanElement>;
+    useReactOnMouseLeave?: boolean;
+} & OnClickListener<OnClickData> & OnMouseDownListener<OnMouseDownData> & OnMouseMoveListener<OnMouseMoveData> & OnMouseUpListener<OnMouseUpData> & OnDropListener<OnDropData> & OnDragOverListener<OnDragOverData> & OptionalListener<'onClickCapture', OnClickCaptureData> & OptionalListener<'onMouseEnter', OnMouseEnterData> & OptionalListener<'onMouseLeave', OnMouseLeaveData, MouseEvent | ReactMouseEvent> & OptionalListener<'onDoubleClick', OnDoubleClickData>>;
+declare const ClickableMemo: import("../../helper/withForwardRef").RefComponent<ClickableProps<unknown, unknown, unknown, unknown, unknown, unknown, unknown, unknown, unknown, unknown, string | undefined>, HTMLAnchorElement | HTMLSpanElement>;
 export { ClickableMemo as Clickable };

package/dist/src/Components/Dialog/DialogBackground.d.ts

@@ -1,7 +1,6 @@
 import * as React from 'react';
 import { RbmComponentProps } from '../RbmComponentProps';
-import { EmptyProps } from '../../helper/EmptyProps';
-export type DialogBackgroundProps = RbmComponentProps<EmptyProps>;
-declare function DialogBackground({ children, className, style }: DialogBackgroundProps): React.JSX.Element;
-declare const DialogBackgroundMemo: typeof DialogBackground;
-export { DialogBackgroundMemo as DialogBackground };
+export type DialogBackgroundProps = RbmComponentProps<{
+    title?: string;
+}>;
+export declare const DialogBackground: ({ children, className, style, title }: DialogBackgroundProps) => React.JSX.Element;

package/dist/src/Components/Dialog/DialogContainer.d.ts

@@ -1,7 +1,11 @@
 import * as React from 'react';
 import { PropsWithChildren } from 'react';
+import { ShowDialog } from './DialogContext';
 import { EmptyProps } from '../../helper/EmptyProps';
 export type DialogContainerProps = PropsWithChildren<EmptyProps>;
-declare function DialogContainer({ children }: DialogContainerProps): React.JSX.Element;
-declare const DialogContainerMemo: typeof DialogContainer;
-export { DialogContainerMemo as DialogContainer };
+export type DialogContainerRef = {
+    showDialog: ShowDialog;
+};
+export declare const DialogContainer: import("../../helper/withForwardRef").RefComponent<{
+    children?: React.ReactNode;
+}, DialogContainerRef>;

package/dist/src/Components/DragAndDrop/DragItem.d.ts

@@ -2,6 +2,6 @@ import * as React from 'react';
 import { RbmComponentProps, WithNoStringAndChildrenProps } from '../RbmComponentProps';
 import { DraggableProps } from 'react-beautiful-dnd';
 export type DragItemProps = RbmComponentProps<Omit<DraggableProps, 'children'>, WithNoStringAndChildrenProps>;
-declare function DragItem({ children, ...dragProps }: DragItemProps): React.JSX.Element;
+declare function DragItem({ children, className, ...dragProps }: DragItemProps): React.JSX.Element;
 declare const DragItemMemo: typeof DragItem;
 export { DragItemMemo as DragItem };

package/dist/src/Components/Flavor.d.ts

@@ -0,0 +1,4 @@
+export declare enum Flavor {
+    Accent = "flavor-accent",
+    Basic = "flavor-basic"
+}

package/dist/src/Components/FormElements/Button/Button.d.ts

@@ -3,7 +3,11 @@ import { Override } from '@ainias42/js-helper';
 import { OptionalListener } from '../../Hooks/useListener';
 import { HTMLAttributes } from 'react';
 import { RbmComponentProps } from '../../RbmComponentProps';
-export type ButtonProps<ClickData> = RbmComponentProps<Override<HTMLAttributes<HTMLButtonElement>, OptionalListener<'onClick', ClickData>>>;
-declare function Button<ClickData>({ children, className, ...props }: ButtonProps<ClickData>): React.JSX.Element;
-declare const ButtonMemo: typeof Button;
-export { ButtonMemo as Button };
+import { ButtonType } from "./ButtonType";
+import { Flavor } from "../../Flavor";
+export type ButtonProps<ClickData> = RbmComponentProps<Override<HTMLAttributes<HTMLButtonElement>, {
+    type?: ButtonType;
+    disabled?: boolean;
+    flavor?: Flavor;
+} & OptionalListener<'onClick', ClickData>>>;
+export declare const Button: <ClickData>({ children, className, disabled, flavor, type, ...props }: ButtonProps<ClickData>) => React.JSX.Element;

package/dist/src/Components/FormElements/Button/ButtonType.d.ts

@@ -0,0 +1,4 @@
+export declare enum ButtonType {
+    Primary = "primary",
+    Secondary = "secondary"
+}

package/dist/src/Components/FormElements/Input/FileInput/FileInput.d.ts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+import { RbmComponentProps } from '../../../RbmComponentProps';
+import { Override } from '../../../../TypeHelpers';
+import { Listener } from '../../../Hooks/useListener';
+import { FileType } from "./FileType";
+import { MultipleFileInputProps } from "./MultipleFileInput";
+export type FileInputProps<OnChangeFileData> = RbmComponentProps<Override<Omit<MultipleFileInputProps<unknown>, "onChangeFiles" | "maxFiles" | "onChangeFilesData" | "mimeTypes" | "showDeleteButton">, {
+    value?: FileType;
+    mimeType?: string;
+    required?: boolean;
+} & Listener<'onChangeFile', OnChangeFileData, FileType | undefined>>>;
+export declare const FileInput: <OnChangeData>({ value, mimeType, required, ...otherProps }: FileInputProps<OnChangeData>) => React.JSX.Element;

package/dist/src/Components/FormElements/Input/FileInput/FileType.d.ts

@@ -0,0 +1,7 @@
+export type FileType = {
+    name: string;
+    data: string;
+    mimeType: string;
+    uploaded?: boolean;
+    blob?: Blob;
+};

package/dist/src/Components/FormElements/Input/FileInput/MultipleFileInput.d.ts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import { RbmComponentProps } from '../../../RbmComponentProps';
+import { Override } from '../../../../TypeHelpers';
+import { InputHTMLAttributes } from 'react';
+import { Listener } from '../../../Hooks/useListener';
+import { FileType } from "./FileType";
+export type MultipleFileInputProps<OnChangeFilesData> = RbmComponentProps<Override<Omit<InputHTMLAttributes<HTMLInputElement>, 'defaultValue' | 'onChange' | 'value'>, {
+    value: FileType[];
+    label?: string;
+    mimeTypes?: string[];
+    maxFiles?: number;
+    maxSizePerFile?: number;
+    onError?: (error: string) => void;
+    allowOverride?: boolean;
+    showDeleteButton?: boolean;
+} & Listener<'onChangeFiles', OnChangeFilesData, FileType[]>>>;
+export declare const MultipleFileInput: <OnChangeData>({ className, style, value, label, mimeTypes, maxFiles, maxSizePerFile, allowOverride, onError, showDeleteButton, ...otherProps }: MultipleFileInputProps<OnChangeData>) => React.JSX.Element;

package/dist/src/Components/FormElements/Select/Select.d.ts

@@ -13,5 +13,6 @@ export type SelectProps<OnChangeData> = RbmComponentProps<Override<SelectHTMLAtt
     options: SelectOption[];
     onChangeValue?: (newValue: string) => void;
     inline?: boolean;
+    small?: boolean;
 } & OptionalListener<'onChange', OnChangeData>>>;
-export declare const Select: <OnChangeData>({ label, options, className, style, onChangeValue, inline, ...otherProps }: SelectProps<OnChangeData>) => React.JSX.Element;
+export declare const Select: <OnChangeData>({ label, options, className, style, onChangeValue, inline, small, ...otherProps }: SelectProps<OnChangeData>) => React.JSX.Element;

package/dist/src/Components/FormElements/Switch/Switch.d.ts

@@ -2,12 +2,12 @@ import * as React from 'react';
 import { InputHTMLAttributes } from 'react';
 import { RbmComponentProps } from '../../RbmComponentProps';
 import { Override } from '../../../TypeHelpers';
-export type SwitchProps = RbmComponentProps<Override<InputHTMLAttributes<HTMLInputElement>, {
+import { OptionalListener } from "../../Hooks/useListener";
+export type SwitchProps<OnChangeCheckedData> = RbmComponentProps<Override<InputHTMLAttributes<HTMLInputElement>, {
     preLabel?: string;
     label?: string;
     children?: string;
     isLabelBeforeSwitch?: boolean;
     isDual?: boolean;
-    onChangeChecked?(isChecked: boolean): void;
-}>>;
-export declare const Switch: ({ children, label, preLabel, isLabelBeforeSwitch, isDual, id, className, style, onChange, onChangeChecked, ...props }: SwitchProps) => React.JSX.Element;
+} & OptionalListener<"onChangeChecked", OnChangeCheckedData, boolean>>>;
+export declare const Switch: <OnChangeCheckedData>({ children, label, preLabel, isLabelBeforeSwitch, isDual, id, className, style, onChange, ...props }: SwitchProps<OnChangeCheckedData>) => React.JSX.Element;

package/dist/src/Components/Hooks/useMousePosition.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+export declare function useMousePosition(): import("react").MutableRefObject<{
+    x: number;
+    y: number;
+}>;

package/dist/src/Components/Hooks/useWindowDimensions.d.ts

@@ -0,0 +1,4 @@
+export declare function useWindowDimensions(): {
+    x: number;
+    y: number;
+};

package/dist/src/Components/Icon/Icon.d.ts

@@ -6,9 +6,8 @@ import { IconProp } from '@fortawesome/fontawesome-svg-core';
 import { IconDefinition } from '@fortawesome/free-regular-svg-icons';
 export type IconSource = IconProp | string | IconDefinition;
 export type IconProps = RbmComponentProps<Override<FontAwesomeIconProps, {
+    noMargin?: boolean;
     icon: IconSource;
     alt?: string;
 }>>;
-declare function Icon({ icon, alt, className, style, title, ...props }: IconProps): React.JSX.Element;
-declare const IconMemo: typeof Icon;
-export { IconMemo as Icon };
+export declare const Icon: ({ icon, alt, className, noMargin, style, title, ...props }: IconProps) => React.JSX.Element;

package/dist/src/Components/Layout/Grid/Grid.d.ts

@@ -3,7 +3,8 @@ import { RbmComponentProps } from '../../RbmComponentProps';
 export type GridProps = RbmComponentProps<{
     columns?: number;
     rows?: number;
+    useContainerWidth?: boolean;
 }>;
-declare function Grid({ style, children, columns, rows, className, __allowChildren }: GridProps): React.JSX.Element;
+declare function Grid({ style, children, columns, rows, useContainerWidth, className, __allowChildren }: GridProps): React.JSX.Element;
 declare const GridMemo: typeof Grid;
 export { GridMemo as Grid };

package/dist/src/Components/Layout/Grid/GridItem.d.ts

@@ -2,12 +2,14 @@ import * as React from 'react';
 import { RbmComponentProps } from '../../RbmComponentProps';
 export type GridItemProps = RbmComponentProps<{
     size: number;
+    xs?: number;
     sm?: number;
     md?: number;
     lg?: number;
     xl?: number;
     xxl?: number;
     print?: number;
+    startXxs?: number;
     startXs?: number;
     startSm?: number;
     startMd?: number;
@@ -15,6 +17,7 @@ export type GridItemProps = RbmComponentProps<{
     startXl?: number;
     startXxl?: number;
     startPrint?: number;
+    orderXxs?: number;
     orderXs?: number;
     orderSm?: number;
     orderMd?: number;
@@ -23,6 +26,6 @@ export type GridItemProps = RbmComponentProps<{
     orderXxl?: number;
     orderPrint?: number;
 }>;
-declare function GridItem({ style, children, className, __allowChildren, size, sm, md, lg, xl, xxl, print, startXs, startMd, startSm, startLg, startXl, startXxl, startPrint, orderXs, orderSm, orderMd, orderLg, orderXxl, orderXl, orderPrint, }: GridItemProps): React.JSX.Element;
+declare function GridItem({ style, children, className, __allowChildren, size, xs, sm, md, lg, xl, xxl, print, startXxs, startXs, startMd, startSm, startLg, startXl, startXxl, startPrint, orderXxs, orderXs, orderSm, orderMd, orderLg, orderXxl, orderXl, orderPrint, }: GridItemProps): React.JSX.Element;
 declare const GridItemMemo: typeof GridItem;
 export { GridItemMemo as GridItem };

package/dist/src/Components/Menu/HoverMenu.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import { RbmChildWithoutString, RbmComponentProps, WithNoStringAndChildrenProps } from "../RbmComponentProps";
+export type HoverMenuProps = RbmComponentProps<{
+    items: RbmChildWithoutString;
+    openToSide?: boolean;
+    onClick?: () => void;
+    onClose?: () => void;
+}, WithNoStringAndChildrenProps>;
+export declare const HoverMenu: ({ children, items, className, style, onClick, onClose, openToSide }: HoverMenuProps) => React.JSX.Element;

package/dist/src/Components/Menu/Menu.d.ts

@@ -1,17 +1,26 @@
 import * as React from 'react';
-import { RbmComponentProps, WithNoChildren } from '../RbmComponentProps';
+import { RbmComponentProps } from '../RbmComponentProps';
 import { IconSource } from '../Icon/Icon';
-export type MenuItem = {
+export type MenuItemType = {
     label: string;
-    callback: () => void;
-    icon?: IconSource;
+    icon?: IconSource | {
+        icon: IconSource;
+        color: string;
+    };
     key: string;
+    className?: string;
+    callback: () => void;
+    onMouseEnter?: () => void;
+    onMouseLeave?: () => void;
 };
 export type MenuProps = RbmComponentProps<{
-    items: MenuItem[];
+    items?: MenuItemType[];
     x: number;
     y: number;
     isOpen: boolean;
     onClose: () => void;
-}, WithNoChildren>;
-export declare const Menu: ({ className, style, items, y, x, isOpen, onClose }: MenuProps) => React.JSX.Element | null;
+    offsetX?: number;
+    offsetY?: number;
+}>;
+export declare const MENU_CONTAINER_CLASS = "rbm-menu-container";
+export declare const Menu: ({ className, style, items, y, x, isOpen, onClose, children, offsetY, offsetX, }: MenuProps) => React.JSX.Element | null;

package/dist/src/Components/Menu/MenuCloseContext.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+export declare const MenuCloseContextProvider: React.Provider<() => void>;
+export declare function useMenuClose(): () => void;

package/dist/src/Components/Menu/MenuDivider.d.ts

@@ -0,0 +1,2 @@
+import React from "react";
+export declare const MenuDivider: () => React.JSX.Element;

package/dist/src/Components/Menu/MenuItem.d.ts

@@ -0,0 +1,23 @@
+import { IconSource } from "../Icon/Icon";
+import React, { ReactNode } from "react";
+import { RbmComponentProps, WithChildren } from "../RbmComponentProps";
+import Element = React.JSX.Element;
+export type MenuItemProps<Item = undefined> = RbmComponentProps<{
+    icon?: IconSource;
+    iconColor?: string;
+    className?: string;
+    children: string | ReactNode;
+    disabled?: boolean;
+    active?: boolean;
+} & ({
+    onClick: (item: Item) => void;
+    onMouseEnter?: (item: Item) => void;
+    onMouseLeave?: (item: Item) => void;
+    item?: undefined;
+} | {
+    onClick: (item: Item) => void;
+    onMouseEnter?: (item: Item) => void;
+    onMouseLeave?: (item: Item) => void;
+    item: Item;
+}), WithChildren>;
+export declare const MenuItem: <Item>({ children, icon, iconColor, className, onClick, onMouseEnter, onMouseLeave, active, item, disabled, ...props }: MenuItemProps<Item>) => Element;

package/dist/src/Components/Menu/Submenu.d.ts

@@ -0,0 +1,12 @@
+import { RbmComponentProps, WithNoStringAndChildrenProps } from "../RbmComponentProps";
+import { IconSource } from "../Icon/Icon";
+import React from "react";
+export type SubmenuProps = RbmComponentProps<{
+    label: string;
+    icon?: IconSource;
+    iconColor?: string;
+    disabled?: boolean;
+    onMouseEnter?: () => void;
+    onMouseLeave?: () => void;
+}, WithNoStringAndChildrenProps>;
+export declare const Submenu: ({ children, label, icon, iconColor, className, style, disabled, onMouseEnter, onMouseLeave, }: SubmenuProps) => React.JSX.Element;

package/dist/src/Components/Menu/useMenu.d.ts

@@ -1,3 +1,3 @@
 import { MouseEvent } from 'react';
 import { MenuProps } from './Menu';
-export declare function useMenu(): readonly [(e: MouseEvent) => void, Omit<MenuProps, "items">];
+export declare function useMenu(): readonly [(e: MouseEvent) => void, Omit<MenuProps, "children" | "items">];

package/dist/src/Components/RbmComponentProps.d.ts

@@ -18,6 +18,10 @@ export type WithNoStringAndChildrenProps = {
 export type WithStringProps = {
     children?: Recursive<string>;
 };
+export type WithChildren = {
+    children: ReactNode;
+    __allowChildren?: "text" | "all" | "html";
+};
 export type WithStringAndChildrenProps = {
     children: Recursive<string>;
 };

package/dist/src/Components/Text/Text.d.ts

@@ -4,6 +4,7 @@ import { ViewProps } from '../Layout/View';
 export declare const TEXT_PRIO: {
     primary: string;
     secondary: string;
+    tertiary: string;
     heading: string;
 };
 export declare const TEXT_SIZE: {

package/dist/src/ListRow/ListRow.d.ts

@@ -0,0 +1 @@
+export declare const ListRow: () => null;

package/package.json

@@ -1,13 +1,14 @@
 {
   "name": "@ainias42/react-bootstrap-mobile",
-  "version": "0.1.15",
+  "version": "0.1.17",
   "description": "Mobile React Components using Bootstrap",
   "main": "dist/bootstrapReactMobile",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
     "build": "node bin/build.js && webpack",
     "build:production": "node bin/build.js && webpack --env production",
-    "update packages": "node bin/updateCopies.js"
+    "update packages": "node bin/updateCopies.js",
+    "typecheck": "tsc --no-emit"
   },
   "repository": {
     "type": "git",
@@ -28,10 +29,10 @@
   },
   "homepage": "https://github.com/Ainias/Bootstrap-React-Mobile#readme",
   "peerDependencies": {
-    "@fortawesome/fontawesome-svg-core": "^1.3.0",
-    "@fortawesome/free-regular-svg-icons": "^5.15.4",
-    "@fortawesome/free-solid-svg-icons": "^5.15.4",
-    "@fortawesome/react-fontawesome": "^0.1.16",
+    "@fortawesome/fontawesome-svg-core": "^6.4.0",
+    "@fortawesome/free-regular-svg-icons": "^6.4.0",
+    "@fortawesome/free-solid-svg-icons": "^6.4.0",
+    "@fortawesome/react-fontawesome": "^0.2.0",
     "react": ">=17.0.0",
     "react-beautiful-dnd": "^13.1.1"
   },
@@ -81,7 +82,7 @@
     "@types/react-virtualized-auto-sizer": "^1.0.1",
     "classnames": "^2.3.1",
     "isomorphic-style-loader": "^5.3.2",
-    "@ainias42/js-helper": ">=0.8.1",
+    "@ainias42/js-helper": ">=0.8.9",
     "react-color": "^2.19.3",
     "react-table": "^7.7.0",
     "react-virtualized-auto-sizer": "^1.0.7",