@ainias42/react-bootstrap-mobile 0.1.7

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

@@ -0,0 +1,10 @@
+import { CSSProperties, ReactElement, ReactNode } from 'react';
+import { RbmComponentProps } from '../RbmComponentProps';
+export type ListProps<ItemType> = RbmComponentProps<{
+    renderItem: (item: ItemType, style: CSSProperties, index: number) => ReactElement;
+    itemHeight?: number;
+    items: ItemType[];
+    renderBefore?: (item: ItemType, index: number) => ReactNode;
+    keyExtractor?: (item: ItemType, index: number) => string;
+}>;
+export declare const List: <ItemType>({ items, renderItem, itemHeight: initialItemHeight, className, style, }: ListProps<ItemType>) => JSX.Element;

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

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import { RbmComponentProps } from '../RbmComponentProps';
+export type LoadingAreaProps = RbmComponentProps<{
+    opacity?: number;
+    loading: boolean;
+    fullWidth?: boolean;
+    fullHeight?: boolean;
+    fullSize?: boolean;
+}>;
+declare function LoadingArea({ loading, fullWidth, fullSize, fullHeight, opacity, className, style, children, }: LoadingAreaProps): JSX.Element;
+declare const LoadingAreaMemo: typeof LoadingArea;
+export { LoadingAreaMemo as LoadingArea };

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

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { RbmComponentProps } from '../RbmComponentProps';
+export type LoadingCircleProps = RbmComponentProps<{
+    size?: number;
+}>;
+declare function LoadingCircle({ size, className, style }: LoadingCircleProps): JSX.Element;
+declare const LoadingCircleMemo: typeof LoadingCircle;
+export { LoadingCircleMemo as LoadingCircle };

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

@@ -0,0 +1,16 @@
+import { RbmComponentProps, WithNoChildren } from '../RbmComponentProps';
+import { IconSource } from '../Icon/Icon';
+export type MenuItem = {
+    label: string;
+    callback: () => void;
+    icon?: IconSource;
+    key: string;
+};
+export type MenuProps = RbmComponentProps<{
+    items: MenuItem[];
+    x: number;
+    y: number;
+    isOpen: boolean;
+    onClose: () => void;
+}, WithNoChildren>;
+export declare const Menu: ({ className, style, items, y, x, isOpen, onClose }: MenuProps) => JSX.Element | null;

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

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

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

@@ -0,0 +1,31 @@
+import { CSSProperties, ReactNode } from 'react';
+import { Recursive } from '../TypeHelpers';
+type Child = Recursive<JSX.Element | undefined | null | Child[]> | false;
+export type WithNoStringProps = {
+    children?: Child;
+    __allowChildren?: 'html';
+} | {
+    children?: ReactNode;
+    __allowChildren: 'text' | 'all';
+};
+export type WithNoStringAndChildrenProps = {
+    children: Child;
+    __allowChildren?: 'html';
+} | {
+    children: ReactNode;
+    __allowChildren: 'text' | 'all';
+};
+export type WithStringProps = {
+    children?: Recursive<string>;
+};
+export type WithStringAndChildrenProps = {
+    children: Recursive<string>;
+};
+export type WithNoChildren = {
+    children?: never;
+};
+export type RbmComponentProps<SpecialProps, ChildrenProps = WithNoStringProps> = ChildrenProps & {
+    className?: string;
+    style?: CSSProperties;
+} & SpecialProps;
+export {};

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

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { WithNoStringAndChildrenProps } from '../RbmComponentProps';
+export type SizeCalculatorProps = {
+    onSize: (width: number, height: number) => void;
+    absolute?: boolean;
+} & WithNoStringAndChildrenProps;
+declare function SizeCalculator({ onSize, children, absolute }: SizeCalculatorProps): JSX.Element;
+declare const SizeCalculatorMemo: typeof SizeCalculator;
+export { SizeCalculatorMemo as SizeCalculator };

package/dist/src/Components/SpoilerList/Spoiler/Spoiler.d.ts

@@ -0,0 +1,15 @@
+import { RbmComponentProps } from '../../RbmComponentProps';
+import { ReactChild } from 'react';
+import { OptionalListener } from '../../Hooks/useListener';
+import { IconProp } from '@fortawesome/fontawesome-svg-core';
+export type SpoilerProps<OnClickData> = RbmComponentProps<{
+    title: ReactChild;
+    initialOpen?: boolean;
+    open?: boolean;
+    noClosingAnimation?: boolean;
+    openIcon?: IconProp | null;
+    closeIcon?: IconProp | null;
+} & OptionalListener<'onClick', OnClickData>>;
+declare function Spoiler<OnClickData>({ title, children, initialOpen, noClosingAnimation, openIcon, closeIcon, className, style, open, ...listenerProps }: SpoilerProps<OnClickData>): JSX.Element;
+declare const SpoilerMemo: typeof Spoiler;
+export { SpoilerMemo as Spoiler };

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

@@ -0,0 +1,15 @@
+import { ReactElement } from 'react';
+import { RbmComponentProps, WithNoChildren } from '../RbmComponentProps';
+export type SpoilerItem<BodyData, TitleData = string> = {
+    title: TitleData;
+    body: BodyData;
+    key: number | string;
+};
+export type SpoilerListProps<BodyData, TitleData = string> = RbmComponentProps<{
+    data: SpoilerItem<BodyData, TitleData>[];
+    renderBody: (item: SpoilerItem<BodyData, TitleData>) => ReactElement;
+    renderTitle?: (item: SpoilerItem<BodyData, TitleData>) => ReactElement | string;
+}, WithNoChildren>;
+declare function SpoilerList<BodyData, TitleData = string>({ data, renderBody, renderTitle, className, style, }: SpoilerListProps<BodyData, TitleData>): JSX.Element;
+declare const SpoilerListMemo: typeof SpoilerList;
+export { SpoilerListMemo as SpoilerList };

package/dist/src/Components/SpoilerList/useSpoilerGroup.d.ts

@@ -0,0 +1,12 @@
+export type SpoilerGroupOptions = {
+    closeWithClick: boolean;
+    noClosingAnimation: boolean;
+};
+export declare function useSpoilerGroup(defaultKey?: number | string, options?: Partial<SpoilerGroupOptions>): readonly [(key: string | number) => {
+    onClick: (isOpen: boolean, key: string | number) => void;
+    onClickData: string | number;
+    key: string | number;
+    open: boolean;
+    noClosingAnimation: boolean;
+    closeIcon: null;
+}, string | number | undefined];

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

@@ -0,0 +1,30 @@
+import { RbmComponentProps } from '../RbmComponentProps';
+import { IconSource } from '../Icon/Icon';
+import { ComponentType } from 'react';
+export type TabBarComponentButtonType = {
+    component: ComponentType<Record<string, any>>;
+    key?: string;
+};
+export type TabBarTitleButtonType = {
+    title: string;
+    icon?: IconSource;
+    key?: string;
+};
+export type TabBarIconButtonType = {
+    title?: string;
+    icon: IconSource;
+    key?: string;
+};
+export type TabBarButtonType = TabBarComponentButtonType | TabBarTitleButtonType | TabBarIconButtonType;
+export type TabBarProps = RbmComponentProps<{
+    buttons: TabBarButtonType[];
+    startActiveTab?: number;
+    onTabChange: (newActiveTab: number) => void;
+    activeTab?: number;
+    transparent?: boolean;
+    drawBehind?: boolean;
+    underline?: boolean;
+}>;
+declare function TabBar({ buttons, startActiveTab, onTabChange, activeTab, transparent, underline, className, ...rbmProps }: TabBarProps): JSX.Element;
+declare const TabBarMemo: typeof TabBar;
+export { TabBarMemo as TabBar };

package/dist/src/Components/TabBar/TabBarButton.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { RbmComponentProps } from '../RbmComponentProps';
+import { Listener } from '../Hooks/useListener';
+export type TabBarButtonProps = RbmComponentProps<{
+    active: boolean;
+} & Listener<'onClick', number>>;
+declare function TabBarButton({ active, className, children, ...rbmProps }: TabBarButtonProps): JSX.Element;
+declare const TabBarButtonMemo: typeof TabBarButton;
+export { TabBarButtonMemo as TabBarButton };

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

@@ -0,0 +1,36 @@
+import * as React from 'react';
+import { Cell, Column as RTColumn, HeaderGroup, Row, UseSortByOptions } from 'react-table';
+import { RbmComponentProps } from '../RbmComponentProps';
+import { ReactNode } from 'react';
+export type ColumnCellData<DataType extends string | number | Record<string, unknown>> = {
+    value: DataType;
+    cell: {
+        column: {
+            id: string;
+        };
+        row: {
+            original: Record<string, DataType>;
+            index: number;
+            id: string;
+        };
+    };
+};
+export type Column<DataType extends string | number | Record<string, unknown>> = RTColumn<Record<string, DataType>> & {
+    Cell?: (cellData: ColumnCellData<DataType>) => ReactNode;
+};
+export type TableSortOptions<DataType extends string | number | Record<string, unknown>> = UseSortByOptions<Record<string, DataType>> & {
+    renderSortIndicator?: (column: HeaderGroup<Record<string, DataType>>) => ReactNode;
+};
+export type TableProps<DataType extends string | number | Record<string, unknown>> = RbmComponentProps<{
+    columns: Column<DataType>[];
+    data: Record<string, DataType>[];
+    cellRenderer?: ({ value }: {
+        value: DataType;
+    }) => ReactNode;
+    sortOptions?: TableSortOptions<DataType>;
+    getCellProperties?: (row: Cell<Record<string, DataType>>) => React.TdHTMLAttributes<HTMLTableDataCellElement>;
+    getRowProperties?: (row: Row<Record<string, DataType>>) => React.HTMLAttributes<HTMLTableRowElement>;
+}>;
+declare function Table<DataType extends string | number | Record<string, unknown>>({ columns, data, cellRenderer, sortOptions, className, style, getCellProperties, getRowProperties, }: TableProps<DataType>): JSX.Element;
+declare const tmp: typeof Table;
+export { tmp as Table };

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

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { RbmComponentProps, WithStringProps } from '../RbmComponentProps';
+import { EmptyProps } from '../../helper/EmptyProps';
+export type HeadingProps = RbmComponentProps<EmptyProps, WithStringProps>;
+declare function Heading({ children, className, style }: HeadingProps): JSX.Element;
+declare const HeadingMemo: typeof Heading;
+export { HeadingMemo as Heading };

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

@@ -0,0 +1,26 @@
+/// <reference types="react" />
+import { Recursive, ValueOf } from '../../TypeHelpers';
+import { ViewProps } from '../Layout/View';
+export declare const TEXT_PRIO: {
+    primary: string;
+    secondary: string;
+    heading: string;
+};
+export declare const TEXT_SIZE: {
+    xSmall: string;
+    small: string;
+    medium: string;
+    large: string;
+    xLarge: string;
+    xxLarge: string;
+};
+export type TextProps<AsType extends keyof JSX.IntrinsicElements> = {
+    block?: boolean;
+    prio?: ValueOf<typeof TEXT_PRIO>;
+    size?: ValueOf<typeof TEXT_SIZE>;
+    className?: string;
+    children: Recursive<string | undefined | null | number>;
+} & ViewProps<AsType>;
+declare function Text<AsType extends keyof JSX.IntrinsicElements = 'span'>({ className, children, block, prio, size, as, ...props }: TextProps<AsType>): JSX.Element;
+declare const tmp: typeof Text;
+export { tmp as Text };

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

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import { RbmComponentProps, WithNoStringAndChildrenProps } from '../RbmComponentProps';
+import { Listener, OptionalListener } from '../Hooks/useListener';
+type WithoutActionProps<DismissedData> = {
+    timeToShow?: number;
+} & OptionalListener<'onDismissed', DismissedData>;
+type WithActionProps<ActionData, DismissedData> = WithoutActionProps<DismissedData> & {
+    actionName: string;
+} & Listener<'onClick', ActionData>;
+export type ToastProps<ActionData, DismissedData> = RbmComponentProps<WithActionProps<ActionData, DismissedData> | WithoutActionProps<DismissedData>, WithNoStringAndChildrenProps>;
+declare function Toast<ActionData, DismissedData>({ className, timeToShow, children, style, ...otherProps }: ToastProps<ActionData, DismissedData>): JSX.Element | null;
+declare const ToastMemo: typeof Toast;
+export { ToastMemo as Toast };

package/dist/src/Components/Toast/ToastContainer.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { RbmComponentProps } from '../RbmComponentProps';
+import { EmptyProps } from '../../helper/EmptyProps';
+export type ToastContainerProps = RbmComponentProps<EmptyProps>;
+declare function ToastContainer({ className, children, style }: ToastContainerProps): JSX.Element;
+declare const ToastContainerMemo: typeof ToastContainer;
+export { ToastContainerMemo as ToastContainer };

package/dist/src/Components/TopBar/MoreButton.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { RbmComponentProps } from '../RbmComponentProps';
+export type MoreButtonProps = RbmComponentProps<{
+    disabled?: boolean;
+    onClick?: () => void;
+}>;
+declare function MoreButton({ onClick, disabled, className, style }: MoreButtonProps): JSX.Element;
+declare const MoreButtonMemo: typeof MoreButton;
+export { MoreButtonMemo as MoreButton };

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

@@ -0,0 +1,25 @@
+import { ComponentType } from 'react';
+import { RbmComponentProps } from '../RbmComponentProps';
+import { IconSource } from '../Icon/Icon';
+export type TopBarActionButtonType = {
+    title: string;
+    icon?: IconSource;
+    action: () => void;
+    disabled?: boolean;
+    key?: string;
+};
+export type TopBarComponentButtonType = Partial<TopBarActionButtonType> & {
+    component: ComponentType<Record<string, any>>;
+};
+export type TopBarButtonType = TopBarComponentButtonType | TopBarActionButtonType;
+export type TopBarProps = RbmComponentProps<{
+    title?: string;
+    leftButtons?: TopBarButtonType[];
+    rightButtons?: TopBarButtonType[];
+    hiddenButtons?: TopBarButtonType[];
+    transparent?: boolean;
+    drawBehind?: boolean;
+}>;
+declare function TopBar({ title, rightButtons, leftButtons, hiddenButtons, className, transparent, drawBehind, ...rbmProps }: TopBarProps): JSX.Element;
+declare const TopBarMemo: typeof TopBar;
+export { TopBarMemo as TopBar };

package/dist/src/Components/TopBar/TopBarButton.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { RbmComponentProps } from '../RbmComponentProps';
+export type TopBarButtonProps = RbmComponentProps<{
+    disabled?: boolean;
+    onClick?: () => void;
+}>;
+declare function TopBarButton({ disabled, onClick, className, children, ...rbmProps }: TopBarButtonProps): JSX.Element;
+declare const TopBarButtonMemo: typeof TopBarButton;
+export { TopBarButtonMemo as TopBarButton };

package/dist/src/StyleProvider.d.ts

@@ -0,0 +1,2 @@
+declare const provider: any;
+export { provider as StyleProvider };

package/dist/src/TypeHelpers.d.ts

@@ -0,0 +1,4 @@
+export type Override<T1, T2> = Omit<T1, keyof T2> & T2;
+export type Conditional<T1, T2> = Partial<T1> | (T1 & T2);
+export type ValueOf<T> = T[keyof T];
+export type Recursive<T> = T | T[] | Recursive<T>[];

package/dist/src/WindowContext/WindowContext.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+export declare const WindowContext: React.Context<Window | undefined>;
+export declare function useWindow(): Window | undefined;

package/dist/src/WrongChildError.d.ts

@@ -0,0 +1,4 @@
+export declare class WrongChildError extends Error {
+    childValue: any;
+    constructor(expectedType: string, gotType: string, child: any, component: string);
+}

package/dist/src/helper/Characters.d.ts

@@ -0,0 +1,5 @@
+export declare const Characters: {
+    NBSP: string;
+    PATH_DELIMITER: string;
+    MIDDLE_DOT: string;
+};

package/dist/src/helper/DistributiveOmit.d.ts

@@ -0,0 +1 @@
+export type DistributiveOmit<T, K extends keyof T> = T extends any ? Omit<T, K> : never;

package/dist/src/helper/EmptyProps.d.ts

@@ -0,0 +1 @@
+export type EmptyProps = {};

package/dist/src/helper/memoComparator.d.ts

@@ -0,0 +1 @@
+export declare function memoComparator(prevProps: Readonly<any>, nextProps: Readonly<any>): boolean;

package/dist/src/helper/nonEmptyString.d.ts

@@ -0,0 +1 @@
+export declare function nonEmptyString(str: string | undefined | null, other?: string): string;

package/dist/src/helper/withForwardRef.d.ts

@@ -0,0 +1,7 @@
+import { ForwardRefRenderFunction, PropsWithoutRef, ReactElement, RefAttributes } from 'react';
+import { RESTRICT_CHILDREN } from './withRestrictedChildren';
+export interface RefComponent<PropTypes, ForwardedRefType> {
+    (props: PropsWithoutRef<PropTypes> & RefAttributes<ForwardedRefType>): ReactElement | null;
+    displayName?: string | undefined;
+}
+export declare function withForwardRef<PropTypes, ForwardedRefType>(component: ForwardRefRenderFunction<ForwardedRefType, PropTypes>, styles?: any, defaultAllowChildren?: typeof RESTRICT_CHILDREN['allowChildren']): RefComponent<PropTypes, ForwardedRefType>;

package/dist/src/helper/withMemo.d.ts

@@ -0,0 +1,3 @@
+import { ComponentType } from 'react';
+import { RESTRICT_CHILDREN } from './withRestrictedChildren';
+export declare function withMemo<C extends ComponentType<any>>(component: C, styles?: any, defaultAllowChildren?: typeof RESTRICT_CHILDREN['allowChildren']): C;

package/dist/src/helper/withRenderBrowserOnly.d.ts

@@ -0,0 +1,2 @@
+import { ComponentType } from 'react';
+export declare function withRenderBrowserOnly<C extends ComponentType<any>>(Component: C): C;

package/dist/src/helper/withRestrictedChildren.d.ts

@@ -0,0 +1,6 @@
+import React, { ComponentType, ForwardedRef, ReactElement } from 'react';
+import { RbmComponentProps } from '../Components/RbmComponentProps';
+export declare const RESTRICT_CHILDREN: {
+    allowChildren: "html" | "text" | "all" | undefined;
+};
+export declare function withRestrictedChildren<C extends ComponentType<RbmComponentProps<Record<string, any>>>>(Component: C, defaultAllowChildren?: typeof RESTRICT_CHILDREN['allowChildren']): (props: React.ComponentProps<C>, ref: React.ForwardedRef<React.ComponentRef<C>>) => ReactElement;

package/package.json

@@ -0,0 +1,92 @@
+{
+  "name": "@ainias42/react-bootstrap-mobile",
+  "version": "0.1.7",
+  "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"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/Ainias/Bootstrap-React-Mobile.git"
+  },
+  "keywords": [
+    "bootstrap",
+    "react",
+    "mobile"
+  ],
+  "author": "Silas Günther",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/Ainias/Bootstrap-React-Mobile/issues"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "homepage": "https://github.com/Ainias/Bootstrap-React-Mobile#readme",
+  "peerDependencies": {
+    "@fortawesome/fontawesome-svg-core": "^1.2.36",
+    "@fortawesome/free-regular-svg-icons": "^5.15.4",
+    "@fortawesome/free-solid-svg-icons": "^5.15.4",
+    "@fortawesome/react-fontawesome": "^0.1.16",
+    "react": ">=17.0.0",
+    "react-beautiful-dnd": "^13.1.1"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.15.0",
+    "@babel/plugin-proposal-class-properties": "^7.16.7",
+    "@babel/plugin-transform-typescript": "^7.16.8",
+    "@babel/preset-env": "^7.17.10",
+    "@babel/preset-react": "^7.16.7",
+    "@babel/preset-typescript": "^7.16.7",
+    "@types/react": ">=17.0.0",
+    "@types/react-beautiful-dnd": "^13.1.3",
+    "@types/react-color": "^3.0.6",
+    "@types/react-dom": ">=17.0.0",
+    "@types/react-redux": "^7.1.18",
+    "@types/react-table": "^7.7.9",
+    "@types/react-window": "^1.8.5",
+    "@types/react-window-infinite-loader": "^1.0.6",
+    "@typescript-eslint/eslint-plugin": "^4.30.0",
+    "@typescript-eslint/parser": "^4.30.0",
+    "babel-loader": "^8.2.5",
+    "bootstrap": "^5.1.0",
+    "css-loader": "^6.7.1",
+    "eslint": "^7.32.0",
+    "eslint-config-airbnb": "^18.2.1",
+    "eslint-config-airbnb-typescript": "^14.0.0",
+    "eslint-config-prettier": "^8.3.0",
+    "eslint-import-resolver-typescript": "^2.4.0",
+    "eslint-plugin-import": "^2.26.0",
+    "eslint-plugin-react": "^7.25.1",
+    "html-webpack-plugin": "^5.5.0",
+    "loader-utils": "3.2.1",
+    "mini-css-extract-plugin": "^2.6.0",
+    "prettier": "^2.3.2",
+    "sass": "^1.53.0",
+    "sass-loader": "^12.6.0",
+    "style-loader": "^3.3.1",
+    "terser-webpack-plugin": "^5.3.1",
+    "ts-loader": "^9.2.9",
+    "tsc": "^2.0.4",
+    "typescript": "^4.5.2",
+    "webpack": "^5.72.0",
+    "webpack-cli": "^4.9.2",
+    "webpack-dev-server": "^4.8.1"
+  },
+  "dependencies": {
+    "@types/react-virtualized-auto-sizer": "^1.0.1",
+    "classnames": "^2.3.1",
+    "isomorphic-style-loader": "^5.3.2",
+    "@ainias42/js-helper": ">=0.7.12",
+    "react-color": "^2.19.3",
+    "react-table": "^7.7.0",
+    "react-virtualized-auto-sizer": "^1.0.7",
+    "react-window": "^1.8.8",
+    "react-window-infinite-loader": "^1.0.8",
+    "styled-jsx": "^5.0.2"
+  }
+}

package/react-bootstrap-mobile.scss

@@ -0,0 +1,6 @@
+@import "src/scss/variables";
+@import "src/scss/mobileMixin";
+@import "src/scss/default";
+@import "src/scss/animations";
+@import "src/scss/baseClasses";
+@import "src/scss/colors";

package/scripts/getPackageJson.js

@@ -0,0 +1,25 @@
+const fs = require('fs');
+const path = require('path');
+
+/**
+ * A module to get package informations from package.json
+ * @module getPackageJson
+ * @param {...string} keys from package.json if no arguments passed it returns package.json content as object
+ * @returns {object} with given keys or content of package.json as object
+ */
+
+/**
+ * Returns package info
+ */
+const getPackageJson = function (...args) {
+    const packageJSON = JSON.parse(fs.readFileSync(path.join(__dirname, '../package.json')));
+    if (!args.length) {
+        return packageJSON;
+    }
+    return args.reduce((out, key) => {
+        out[key] = packageJSON[key];
+        return out;
+    }, {});
+};
+
+module.exports = getPackageJson;

package/src/Components/ActionSheet/ActionSheet.tsx

@@ -0,0 +1,115 @@
+import * as React from 'react';
+import { RbmComponentProps } from '../RbmComponentProps';
+import { Ref, useCallback, useImperativeHandle, useState } from 'react';
+import { Clickable } from '../Clickable/Clickable';
+import { Container } from '../Layout/Container';
+import { faTimes } from '@fortawesome/free-solid-svg-icons';
+import { Icon, IconSource } from '../Icon/Icon';
+
+import styles from './actionSheet.scss';
+import { withForwardRef } from '../../helper/withForwardRef';
+import classNames from 'classnames';
+import { InlineBlock } from '../Layout/InlineBlock';
+import { Text } from '../Text/Text';
+import { Flex } from '../Layout/Flex';
+import { Block } from '../Layout/Block';
+
+export type ActionSheetAction<ActionData> = {
+    name: string;
+    icon?: IconSource;
+    action: (data?: ActionData) => void;
+    actionData?: ActionData;
+    isDeleteAction?: boolean;
+};
+
+export type ActionSheetProps = RbmComponentProps<{
+    title?: string;
+    actions: ActionSheetAction<any>[];
+    cancelText?: string;
+    onClose?: () => void;
+}>;
+
+export type ActionSheetHandle = {
+    show: () => void;
+    hide: () => void;
+};
+
+function ActionSheet(
+    { title, actions, cancelText = 'Cancel', className, onClose, style }: ActionSheetProps,
+    ref: Ref<ActionSheetHandle>
+) {
+    const [isOpen, setIsOpen] = useState(false);
+
+    // Variables
+
+    // States
+
+    // Refs
+
+    // Callbacks
+    const close = useCallback(() => {
+        setIsOpen(false);
+        if (onClose) {
+            onClose();
+        }
+    }, [setIsOpen, onClose]);
+    const onActionClick = useCallback(
+        (_: any, action?: ActionSheetAction<any>) => {
+            close();
+            action?.action(action.actionData);
+        },
+        [close]
+    );
+
+    useImperativeHandle(
+        ref,
+        () => ({
+            show: () => setIsOpen(true),
+            hide: close,
+        }),
+        [setIsOpen, close]
+    );
+
+    // Effects
+
+    // Other
+
+    const renderAction = (action: ActionSheetAction<any>) => (
+        <Clickable key={action.name} className={styles.action} onClick={onActionClick} onClickData={action}>
+            <InlineBlock className={styles.actionIcon}>{action.icon ? <Icon icon={action.icon} /> : null}</InlineBlock>
+            <Text>{action.name}</Text>
+        </Clickable>
+    );
+
+    return (
+        <Clickable
+            className={classNames(styles.actionSheet, { [styles.open]: actions.length > 0 && isOpen }, className)}
+            onClick={close}
+            style={style}
+        >
+            <Container fluid="xxl" className="full-height">
+                <Flex className={styles.content}>
+                    {title ? (
+                        <Block>
+                            <Text>{title}</Text>
+                        </Block>
+                    ) : null}
+                    {actions.map(renderAction)}
+                    <Clickable
+                        className={styles.cancel}
+                        onClick={() => console.log('Cancel clicked')}
+                        __allowChildren="all"
+                    >
+                        <InlineBlock className={styles.actionIcon}>
+                            <Icon icon={faTimes} />
+                        </InlineBlock>
+                        {cancelText}
+                    </Clickable>
+                </Flex>
+            </Container>
+        </Clickable>
+    );
+}
+
+const ActionSheetMemo = withForwardRef<ActionSheetProps, ActionSheetHandle>(ActionSheet, styles);
+export { ActionSheetMemo as ActionSheet };