@reapit/elements 2.3.1 → 2.4.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@reapit/elements",
-  "version": "2.3.1",
+  "version": "2.4.0",
   "description": "A collection of React components and utilities for building apps for Reapit Marketplace",
   "homepage": "https://github.com/reapit/foundations#readme",
   "bugs": {
@@ -24,12 +24,13 @@
     "build": "yarn build:dist && yarn build:storybook && yarn build:v3",
     "build:storybook": "cross-env NODE_ENV=production && build-storybook -o public/dist",
     "build:dist": "cross-env NODE_ENV=production && rimraf public/dist && rollup -c",
-    "build:v3": "cross-env NODE_ENV=production && rimraf ./v3 && yarn workspace @reapit/elements run build:dist && cd ../elements && move-file dist/cjs ../elements-legacy/v3/ && cp dist/index.css ../elements-legacy/v3/index.css",
-    "commit": "concurrently \"yarn test --coverage --no-cache --silent --forceExit --detectOpenHandles --runInBand --watch=false && jest-coverage-badges --input src/tests/coverage/coverage-summary.json --output src/tests/badges\" \"yarn lint\"",
+    "build:v3": "cd ./node_modules/@reapit/elements && move-file dist/cjs ../../../v3/ && cp dist/index.css ../../../v3/index.css",
     "conf": "yarn config-manager --namespace cloud --entity elements-legacy --name local --mode fetch",
     "lint": "eslint --cache --ext=ts,tsx,js src --fix",
-    "publis": "yarn npm publish --access public",
-    "release": "serverless deploy",
+    "check": "tsc --noEmit --skipLibCheck",
+    "publish": "yarn npm publish --access public --tag legacy",
+    "release-dev": "serverless deploy",
+    "release": "serverless deploy --stage prod",
     "start": "start-storybook -p 6006",
     "test": "cross-env TZ=UTC jest --watch --colors --silent"
   },
@@ -41,92 +42,113 @@
   "dependencies": {
     "@linaria/core": "^3.0.0-beta.15",
     "@linaria/react": "^3.0.0-beta.15",
-    "bulma": "^0.9.3",
+    "@reapit/elements": "latest",
+    "bulma": "^0.9.4",
     "file-saver": "^2.0.5",
     "formik": "^2.2.9",
     "hardtack": "^4.1.2",
     "himalaya": "^1.1.0",
     "jsonwebtoken": "^8.5.1",
     "move-file-cli": "^2.0.0",
-    "papaparse": "^5.3.1",
+    "papaparse": "^5.3.2",
     "pell": "^1.0.6",
-    "rc-dialog": "^8.6.0",
-    "rc-notification": "^4.5.7",
+    "rc-dialog": "^8.9.0",
+    "rc-notification": "^4.6.0",
     "rc-select": "^10.5.1",
     "rc-tooltip": "^4.2.3",
-    "react-datasheet": "^1.4.9",
+    "react-datasheet": "^1.4.12",
     "react-datepicker": "^2.16.0",
     "react-docgen-typescript-loader": "^3.7.2",
     "react-google-map": "^3.1.1",
     "react-google-maps-loader": "4.3.0",
     "react-icons": "^3.11.0",
     "react-image-crop": "8.6.12",
-    "react-table": "^7.7.0",
+    "react-table": "^7.8.0",
     "react-transition-group": "^4.4.2",
-    "snyk": "^1.793.0"
+    "snyk": "^1.980.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.16.5",
-    "@babel/plugin-transform-runtime": "7.16.5",
-    "@babel/runtime": "7.16.5",
     "@linaria/babel-preset": "^3.0.0-beta.15",
+    "@linaria/rollup": "^3.0.0-beta.15",
     "@linaria/shaker": "^3.0.0-beta.15",
     "@linaria/webpack-loader": "^3.0.0-beta.16",
     "@mdx-js/react": "^1.6.22",
-    "@reapit/config-manager": "workspace:packages/config-manager",
-    "@reapit/foundations-ts-definitions": "workspace:packages/foundations-ts-definitions",
+    "@reapit/config-manager": "latest",
+    "@reapit/foundations-ts-definitions": "latest",
     "@reapit/storybook-addon-html": "^5.0.1",
-    "@reapit/ts-scripts": "workspace:packages/ts-scripts",
-    "@reapit/ts-types": "workspace:packages/ts-types",
-    "@rollup/plugin-babel": "^5.3.0",
-    "@rollup/plugin-typescript": "^8.3.0",
-    "@storybook/addon-actions": "^6.4.9",
-    "@storybook/addon-docs": "^6.4.9",
-    "@storybook/addon-essentials": "^6.4.9",
-    "@storybook/addon-links": "^6.4.9",
-    "@storybook/addon-postcss": "^2.0.0",
-    "@storybook/addon-storysource": "^6.4.9",
-    "@storybook/addons": "^6.4.9",
-    "@storybook/builder-webpack5": "^6.4.9",
-    "@storybook/cli": "^6.4.9",
-    "@storybook/csf": "^0.0.2-alpha.0",
-    "@storybook/manager-webpack5": "^6.4.9",
-    "@storybook/react": "^6.4.9",
-    "@storybook/theming": "^6.4.9",
-    "@svgr/rollup": "^6.1.2",
-    "@svgr/webpack": "^6.1.2",
-    "@typescript-eslint/eslint-plugin": "^5.7.0",
-    "@typescript-eslint/parser": "^5.7.0",
-    "babel-jest": "^27.4.5",
-    "babel-loader": "^8.2.3",
-    "concurrently": "^6.4.0",
+    "@rollup/plugin-babel": "^5.3.1",
+    "@rollup/plugin-commonjs": "^23.0.0",
+    "@rollup/plugin-node-resolve": "^15.0.0",
+    "@rollup/plugin-typescript": "^8.3.3",
+    "@storybook/addon-actions": "6.5.9",
+    "@storybook/addon-docs": "6.5.9",
+    "@storybook/addon-essentials": "6.5.9",
+    "@storybook/addon-links": "6.5.9",
+    "@storybook/addon-postcss": "2.0.0",
+    "@storybook/addon-storysource": "6.5.9",
+    "@storybook/addons": "6.5.9",
+    "@storybook/builder-webpack5": "6.5.9",
+    "@storybook/cli": "6.5.9",
+    "@storybook/csf": "0.0.1",
+    "@storybook/manager-webpack5": "6.5.9",
+    "@storybook/react": "6.5.9",
+    "@storybook/react-docgen-typescript-plugin": "1.0.1",
+    "@storybook/theming": "6.5.9",
+    "@svgr/rollup": "^6.2.1",
+    "@svgr/webpack": "^6.2.1",
+    "@testing-library/react": "^13.4.0",
+    "@types/jest": "^29.1.2",
+    "@types/node": "14",
+    "@typescript-eslint/eslint-plugin": "^5.36.1",
+    "@typescript-eslint/parser": "^5.36.1",
+    "babel-jest": "^28.1.3",
+    "babel-loader": "^8.2.5",
+    "babel-plugin-module-resolver": "^4.1.0",
+    "concurrently": "^6.5.1",
     "cross-env": "^7.0.3",
     "dashify": "2.0.0",
-    "eslint": "8.4.1",
-    "eslint-plugin-prettier": "^4.0.0",
+    "dayjs": "^1.11.5",
+    "esbuild-loader": "^2.20.0",
+    "eslint": "8.23.0",
+    "eslint-config-prettier": "^8.5.0",
+    "eslint-plugin-prettier": "^4.2.1",
+    "eslint-plugin-react": "^7.31.10",
+    "eslint-plugin-react-hooks": "^4.6.0",
     "fs-extra": "^9.1.0",
-    "jest": "^27.4.5",
+    "jest": "^28.1.3",
     "jest-coverage-badges": "^1.1.2",
+    "jest-environment-jsdom": "^29.1.2",
+    "jest-fetch-mock": "^3.0.3",
+    "mini-css-extract-plugin": "^2.6.1",
+    "mockdate": "^3.0.5",
     "node-polyfill-webpack-plugin": "^1.1.4",
-    "postcss": "^8.4.5",
+    "postcss": "^8.4.14",
     "prettier": "2.2.1",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
     "react-is": "^17.0.2",
+    "react-router": "^5.1.2",
+    "react-router-dom": "^5.1.2",
     "rimraf": "^3.0.2",
-    "rollup": "2.61.1",
+    "rollup": "2.78.0",
     "rollup-plugin-css-only": "^3.1.0",
     "rollup-plugin-scss": "^3.0.0",
-    "serverless": "^2.69.1",
+    "rollup-plugin-terser": "^7.0.2",
+    "sass": "^1.55.0",
+    "sass-loader": "^13.1.0",
+    "serverless": "^2.72.3",
+    "serverless-deployment-bucket": "^1.6.0",
     "serverless-s3-deploy": "^0.10.1",
     "serverless-s3-remover": "^0.6.0",
     "serverless-single-page-app-plugin": "^1.0.4",
-    "tslib": "^2.3.1",
-    "typescript": "^4.3.5",
-    "webpack": "^5.65.0"
+    "tslib": "^2.4.0",
+    "typescript": "4.3.5",
+    "webpack": "^5.74.0"
   },
   "peerDependencies": {
     "dayjs": "^1.8.19",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
+    "react": ">=17.0.2",
+    "react-dom": ">=17.0.2",
     "react-router": "^5.1.2",
     "react-router-dom": "^5.1.2"
   },

package/src/tests/badges/badge-branches.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="170" height="20" role="img" aria-label="Coverage:branches: 80.59%"><title>Coverage:branches: 80.59%</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="170" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="117" height="20" fill="#555"/><rect x="117" width="53" height="20" fill="#dfb317"/><rect width="170" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="595" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="1070">Coverage:branches</text><text x="595" y="140" transform="scale(.1)" fill="#fff" textLength="1070">Coverage:branches</text><text aria-hidden="true" x="1425" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="430">80.59%</text><text x="1425" y="140" transform="scale(.1)" fill="#fff" textLength="430">80.59%</text></g></svg>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="170" height="20" role="img" aria-label="Coverage:branches: 79.77%"><title>Coverage:branches: 79.77%</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="170" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="117" height="20" fill="#555"/><rect x="117" width="53" height="20" fill="#e05d44"/><rect width="170" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="595" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="1070">Coverage:branches</text><text x="595" y="140" transform="scale(.1)" fill="#fff" textLength="1070">Coverage:branches</text><text aria-hidden="true" x="1425" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="430">79.77%</text><text x="1425" y="140" transform="scale(.1)" fill="#fff" textLength="430">79.77%</text></g></svg>

package/src/tests/badges/badge-functions.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="170" height="20" role="img" aria-label="Coverage:functions: 92.36%"><title>Coverage:functions: 92.36%</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="170" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="117" height="20" fill="#555"/><rect x="117" width="53" height="20" fill="#4c1"/><rect width="170" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="595" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="1070">Coverage:functions</text><text x="595" y="140" transform="scale(.1)" fill="#fff" textLength="1070">Coverage:functions</text><text aria-hidden="true" x="1425" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="430">92.36%</text><text x="1425" y="140" transform="scale(.1)" fill="#fff" textLength="430">92.36%</text></g></svg>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="170" height="20" role="img" aria-label="Coverage:functions: 87.26%"><title>Coverage:functions: 87.26%</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="170" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="117" height="20" fill="#555"/><rect x="117" width="53" height="20" fill="#dfb317"/><rect width="170" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="595" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="1070">Coverage:functions</text><text x="595" y="140" transform="scale(.1)" fill="#fff" textLength="1070">Coverage:functions</text><text aria-hidden="true" x="1425" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="430">87.26%</text><text x="1425" y="140" transform="scale(.1)" fill="#fff" textLength="430">87.26%</text></g></svg>

package/src/tests/badges/badge-lines.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="146" height="20" role="img" aria-label="Coverage:lines: 91.16%"><title>Coverage:lines: 91.16%</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="146" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="93" height="20" fill="#555"/><rect x="93" width="53" height="20" fill="#4c1"/><rect width="146" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="475" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="830">Coverage:lines</text><text x="475" y="140" transform="scale(.1)" fill="#fff" textLength="830">Coverage:lines</text><text aria-hidden="true" x="1185" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="430">91.16%</text><text x="1185" y="140" transform="scale(.1)" fill="#fff" textLength="430">91.16%</text></g></svg>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="146" height="20" role="img" aria-label="Coverage:lines: 87.22%"><title>Coverage:lines: 87.22%</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="146" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="93" height="20" fill="#555"/><rect x="93" width="53" height="20" fill="#dfb317"/><rect width="146" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="475" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="830">Coverage:lines</text><text x="475" y="140" transform="scale(.1)" fill="#fff" textLength="830">Coverage:lines</text><text aria-hidden="true" x="1185" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="430">87.22%</text><text x="1185" y="140" transform="scale(.1)" fill="#fff" textLength="430">87.22%</text></g></svg>

package/src/tests/badges/badge-statements.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="182" height="20" role="img" aria-label="Coverage:statements: 90.94%"><title>Coverage:statements: 90.94%</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="182" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="129" height="20" fill="#555"/><rect x="129" width="53" height="20" fill="#4c1"/><rect width="182" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="655" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="1190">Coverage:statements</text><text x="655" y="140" transform="scale(.1)" fill="#fff" textLength="1190">Coverage:statements</text><text aria-hidden="true" x="1545" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="430">90.94%</text><text x="1545" y="140" transform="scale(.1)" fill="#fff" textLength="430">90.94%</text></g></svg>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="182" height="20" role="img" aria-label="Coverage:statements: 87.26%"><title>Coverage:statements: 87.26%</title><linearGradient id="s" x2="0" y2="100%"><stop offset="0" stop-color="#bbb" stop-opacity=".1"/><stop offset="1" stop-opacity=".1"/></linearGradient><clipPath id="r"><rect width="182" height="20" rx="3" fill="#fff"/></clipPath><g clip-path="url(#r)"><rect width="129" height="20" fill="#555"/><rect x="129" width="53" height="20" fill="#dfb317"/><rect width="182" height="20" fill="url(#s)"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text aria-hidden="true" x="655" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="1190">Coverage:statements</text><text x="655" y="140" transform="scale(.1)" fill="#fff" textLength="1190">Coverage:statements</text><text aria-hidden="true" x="1545" y="150" fill="#010101" fill-opacity=".3" transform="scale(.1)" textLength="430">87.26%</text><text x="1545" y="140" transform="scale(.1)" fill="#fff" textLength="430">87.26%</text></g></svg>

package/v3/components/button/__styles__/index.d.ts

@@ -6,6 +6,7 @@ export declare const elFloatingButton: import("@linaria/core").LinariaClassName;
 export declare const elButtonGroupAlignLeft: import("@linaria/core").LinariaClassName;
 export declare const elButtonGroupAlignRight: import("@linaria/core").LinariaClassName;
 export declare const elButtonGroupAlignCenter: import("@linaria/core").LinariaClassName;
+export declare const elButtonFixedWidth: import("@linaria/core").LinariaClassName;
 export declare const ElButton: import("@linaria/core").StyledMeta & import("react").FunctionComponent<import("react").ClassAttributes<HTMLButtonElement> & import("react").ButtonHTMLAttributes<HTMLButtonElement> & {
     as?: import("react").ElementType<any> | undefined;
 }>;

package/v3/components/button/button.d.ts

@@ -10,6 +10,7 @@ export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
     chevronRight?: boolean;
     fullWidth?: boolean;
     className?: string;
+    fixedWidth?: boolean;
     /** Deprecated - remains part of API to avoid a breaking change but no longer part of style guide */
     size?: ButtonSizeType;
 }

package/v3/components/card/card-components.d.ts

@@ -1,9 +1,9 @@
-import { Dispatch, FC, HTMLAttributes, SetStateAction } from 'react';
+import { Dispatch, FC, HTMLAttributes, SetStateAction, MouseEvent, ReactNode } from 'react';
 import { IconNames } from '../icon';
 import { Intent } from '../../helpers/intent';
 export interface CardListItemProps {
-    listCardItemHeading?: string;
-    listCardItemSubHeading?: string;
+    listCardItemHeading?: ReactNode;
+    listCardItemSubHeading?: ReactNode;
     listCardItemIcon?: IconNames;
     onClick?: () => void;
 }
@@ -17,22 +17,23 @@ export interface CardContextMenuProps extends HTMLAttributes<HTMLDivElement> {
 }
 export interface CardProps extends HTMLAttributes<HTMLDivElement> {
     hasMainCard?: boolean;
-    mainCardHeading?: string;
-    mainCardSubHeading?: string;
-    mainCardSubHeadingAdditional?: string;
-    mainCardBody?: string;
-    mainCardImgUrl?: string;
+    mainCardHeading?: ReactNode;
+    mainCardSubHeading?: ReactNode;
+    mainCardSubHeadingAdditional?: ReactNode;
+    mainCardBody?: ReactNode;
+    mainCardImgUrl?: ReactNode;
     mainContextMenuItems?: ContextMenuItem[];
     hasListCard?: boolean;
-    listCardHeading?: string;
-    listCardSubHeading?: string;
+    listCardHeading?: ReactNode;
+    listCardSubHeading?: ReactNode;
     listCardItems?: CardListItemProps[];
     listContextMenuItems?: ContextMenuItem[];
     isSelected?: boolean;
 }
-export declare const handleToggleContextMenu: (contextMenuOpen: boolean, setContextMenuOpen: Dispatch<SetStateAction<boolean>>) => () => void;
-export declare const handleToggleMainMobileOpen: (mainMobileOpen: boolean, setMainMobileOpen: Dispatch<SetStateAction<boolean>>) => () => void;
-export declare const handleToggleListMobileOpen: (listMobileOpen: boolean, setListMobileOpen: Dispatch<SetStateAction<boolean>>) => () => void;
-export declare const handleToggleBothMobileOpen: (mainMobileOpen: boolean, setMainMobileOpen: Dispatch<SetStateAction<boolean>>, listMobileOpen: boolean, setListMobileOpen: Dispatch<SetStateAction<boolean>>) => () => void;
+export declare const handleToggleContextMenu: (contextMenuOpen: boolean, setContextMenuOpen: Dispatch<SetStateAction<boolean>>) => (event: MouseEvent) => void;
+export declare const handleToggleMainMobileOpen: (mainMobileOpen: boolean, setMainMobileOpen: Dispatch<SetStateAction<boolean>>) => (event: MouseEvent) => void;
+export declare const handleToggleListMobileOpen: (listMobileOpen: boolean, setListMobileOpen: Dispatch<SetStateAction<boolean>>) => (event: MouseEvent) => void;
+export declare const handleToggleBothMobileOpen: (mainMobileOpen: boolean, setMainMobileOpen: Dispatch<SetStateAction<boolean>>, listMobileOpen: boolean, setListMobileOpen: Dispatch<SetStateAction<boolean>>) => (event: MouseEvent) => void;
+export declare const handleMouseHover: (hoverIndex: number | null, setHoverIndex: Dispatch<SetStateAction<number | null>>) => () => void;
 export declare const CardContextMenu: FC<CardContextMenuProps>;
 export declare const Card: FC<CardProps>;

package/v3/components/file-input/__styles__/index.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+export declare const ElFileInput: import("@linaria/core").StyledMeta & import("react").FunctionComponent<import("react").ClassAttributes<HTMLInputElement> & import("react").InputHTMLAttributes<HTMLInputElement> & {
+    as?: import("react").ElementType<any> | undefined;
+}>;
+export declare const ElFileInputWrap: import("@linaria/core").StyledMeta & import("react").FunctionComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
+    as?: import("react").ElementType<any> | undefined;
+}>;
+export declare const ElFileInputIconContainer: import("@linaria/core").StyledMeta & import("react").FunctionComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
+    as?: import("react").ElementType<any> | undefined;
+}>;
+export declare const ElFileInputHidden: import("@linaria/core").StyledMeta & import("react").FunctionComponent<import("react").ClassAttributes<HTMLInputElement> & import("react").InputHTMLAttributes<HTMLInputElement> & {
+    as?: import("react").ElementType<any> | undefined;
+}>;

package/v3/components/file-input/file-input.d.ts

@@ -0,0 +1,21 @@
+import React, { ChangeEvent, Dispatch, SetStateAction, MouseEvent } from 'react';
+export interface FileInputProps extends React.InputHTMLAttributes<HTMLInputElement> {
+    onFileUpload?: (uploadImageModel: CreateImageUploadModel) => Promise<any | ImageUploadModel>;
+    onFileView?: (base64: string) => void;
+    placeholderText?: string;
+    defaultValue?: string;
+    label?: string;
+    fileName?: string;
+}
+export declare type FileInputWrapped = React.ForwardRefExoticComponent<FileInputProps & React.RefAttributes<React.InputHTMLAttributes<HTMLInputElement>>>;
+export interface CreateImageUploadModel {
+    name?: string;
+    imageData?: string;
+}
+export interface ImageUploadModel {
+    Url: string;
+}
+export declare const handleFileChange: (setFileName: Dispatch<SetStateAction<string>>, fileName: string, onFileUpload?: ((uploadImageModel: CreateImageUploadModel) => Promise<string | ImageUploadModel>) | undefined) => (event: ChangeEvent<HTMLInputElement>) => FileReader | undefined;
+export declare const handleFileClear: (setFileName: Dispatch<SetStateAction<string>>) => (event: MouseEvent<HTMLSpanElement>) => void;
+export declare const handleFileView: (onFileView: (fileUrl: string) => void, fileUrl: string) => (event: MouseEvent<HTMLSpanElement>) => void;
+export declare const FileInput: FileInputWrapped;

package/v3/components/file-input/index.d.ts

@@ -0,0 +1,2 @@
+export * from './__styles__';
+export * from './file-input';

package/v3/components/form-layout/__styles__/index.d.ts

@@ -1,4 +1,5 @@
 /// <reference types="react" />
+export declare const elFormLayoutHasMargin: import("@linaria/core").LinariaClassName;
 export declare const ElFormLayout: import("@linaria/core").StyledMeta & import("react").FunctionComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
     as?: import("react").ElementType<any> | undefined;
 }>;

package/v3/components/form-layout/form-layout.d.ts

@@ -1,5 +1,7 @@
 import React, { FC, HTMLAttributes } from 'react';
-export declare type FormLayoutProps = HTMLAttributes<HTMLDivElement>;
+export declare type FormLayoutProps = HTMLAttributes<HTMLDivElement> & {
+    hasMargin?: boolean;
+};
 export declare const FormLayout: FC<FormLayoutProps>;
 export declare const InputWrap: React.ForwardRefExoticComponent<FormLayoutProps & React.RefAttributes<HTMLDivElement>>;
 export declare const InputWrapMed: FC<FormLayoutProps>;

package/v3/components/icon/icons/index.d.ts

@@ -130,4 +130,28 @@ export declare const iconSet: {
     newCustomerInfographic: import("react").MemoExoticComponent<() => JSX.Element>;
     propTechInfographic: import("react").MemoExoticComponent<() => JSX.Element>;
     webDeveloperInfographic: import("react").MemoExoticComponent<() => JSX.Element>;
+    authenticatedInfographic: import("react").MemoExoticComponent<() => JSX.Element>;
+    reapitConnectInfographic: import("react").MemoExoticComponent<() => JSX.Element>;
+    reapitLogoInfographic: import("react").MemoExoticComponent<() => JSX.Element>;
+    sharedEntitiesInfographic: import("react").MemoExoticComponent<() => JSX.Element>;
+    welcomeInfographic: import("react").MemoExoticComponent<() => JSX.Element>;
+    platformApiInfographic: import("react").MemoExoticComponent<() => JSX.Element>;
+    appMarketInfographic: import("react").MemoExoticComponent<() => JSX.Element>;
+    editAppInfographic: import("react").MemoExoticComponent<() => JSX.Element>;
+    lockedInfographic: import("react").MemoExoticComponent<() => JSX.Element>;
+    poundSystem: import("react").MemoExoticComponent<() => JSX.Element>;
+    bulletListSystem: import("react").MemoExoticComponent<() => JSX.Element>;
+    dollarSystem: import("react").MemoExoticComponent<() => JSX.Element>;
+    euroSystem: import("react").MemoExoticComponent<() => JSX.Element>;
+    appCategoryInfographic: import("react").MemoExoticComponent<() => JSX.Element>;
+    appTypeInfographic: import("react").MemoExoticComponent<() => JSX.Element>;
+    developerAppsInfographic: import("react").MemoExoticComponent<() => JSX.Element>;
+    codeInfographic: import("react").MemoExoticComponent<() => JSX.Element>;
+    listInfographic: import("react").MemoExoticComponent<() => JSX.Element>;
+    mailInfographic: import("react").MemoExoticComponent<() => JSX.Element>;
+    phoneInfographic: import("react").MemoExoticComponent<() => JSX.Element>;
+    shieldInfographic: import("react").MemoExoticComponent<() => JSX.Element>;
+    webInfographic: import("react").MemoExoticComponent<() => JSX.Element>;
+    supportMenu: import("react").MemoExoticComponent<() => JSX.Element>;
+    videoSystem: import("react").MemoExoticComponent<() => JSX.Element>;
 };

package/v3/components/icon/icons/infographic-icons/appCategoryInfographic.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: React.MemoExoticComponent<() => JSX.Element>;
+export default _default;

package/v3/components/icon/icons/infographic-icons/appMarketInfographic.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: React.MemoExoticComponent<() => JSX.Element>;
+export default _default;

package/v3/components/icon/icons/infographic-icons/appTypeInfographic.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: React.MemoExoticComponent<() => JSX.Element>;
+export default _default;

package/v3/components/icon/icons/infographic-icons/authenticatedInfographic.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: React.MemoExoticComponent<() => JSX.Element>;
+export default _default;

package/v3/components/icon/icons/infographic-icons/codeInfographic.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: React.MemoExoticComponent<() => JSX.Element>;
+export default _default;

package/v3/components/icon/icons/infographic-icons/developerAppsInfographic.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: React.MemoExoticComponent<() => JSX.Element>;
+export default _default;

package/v3/components/icon/icons/infographic-icons/editAppInfographic.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: React.MemoExoticComponent<() => JSX.Element>;
+export default _default;

package/v3/components/icon/icons/infographic-icons/listInfographic.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: React.MemoExoticComponent<() => JSX.Element>;
+export default _default;

package/v3/components/icon/icons/infographic-icons/lockedInfographic.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: React.MemoExoticComponent<() => JSX.Element>;
+export default _default;

package/v3/components/icon/icons/infographic-icons/mailInfographic.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: React.MemoExoticComponent<() => JSX.Element>;
+export default _default;

package/v3/components/icon/icons/infographic-icons/phoneInfographic.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: React.MemoExoticComponent<() => JSX.Element>;
+export default _default;

package/v3/components/icon/icons/infographic-icons/platformApiInfographic.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: React.MemoExoticComponent<() => JSX.Element>;
+export default _default;

package/v3/components/icon/icons/infographic-icons/reapitConnectInfographic.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: React.MemoExoticComponent<() => JSX.Element>;
+export default _default;

package/v3/components/icon/icons/infographic-icons/reapitLogoInfographic.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: React.MemoExoticComponent<() => JSX.Element>;
+export default _default;

package/v3/components/icon/icons/infographic-icons/sharedEntitiesInfographic.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: React.MemoExoticComponent<() => JSX.Element>;
+export default _default;

package/v3/components/icon/icons/infographic-icons/shieldInfographic.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: React.MemoExoticComponent<() => JSX.Element>;
+export default _default;

package/v3/components/icon/icons/infographic-icons/webInfographic.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: React.MemoExoticComponent<() => JSX.Element>;
+export default _default;

package/v3/components/icon/icons/infographic-icons/welcomeInfographic.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: React.MemoExoticComponent<() => JSX.Element>;
+export default _default;

package/v3/components/icon/icons/menu-icons/supportMenu.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: React.MemoExoticComponent<() => JSX.Element>;
+export default _default;

package/v3/components/icon/icons/system-icons/bulletListSystem.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: React.MemoExoticComponent<() => JSX.Element>;
+export default _default;

package/v3/components/icon/icons/system-icons/dollarSystem.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: React.MemoExoticComponent<() => JSX.Element>;
+export default _default;

package/v3/components/icon/icons/system-icons/euroSystem.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: React.MemoExoticComponent<() => JSX.Element>;
+export default _default;

package/v3/components/icon/icons/system-icons/poundSystem.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: React.MemoExoticComponent<() => JSX.Element>;
+export default _default;

package/v3/components/icon/icons/system-icons/videoSystem.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: React.MemoExoticComponent<() => JSX.Element>;
+export default _default;

package/v3/components/input-group/input-group.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import { IconNames } from '../icon';
 import { Intent } from '../../helpers/intent';
 export interface InputGroupProps extends React.InputHTMLAttributes<HTMLInputElement> {
-    icon?: IconNames;
+    icon?: IconNames | null;
     label?: string;
     inputAddOnText?: string;
     /**

package/v3/components/multi-select/multi-select.d.ts

@@ -12,7 +12,7 @@ export interface MultiSelectInputProps extends InputHTMLAttributes<HTMLInputElem
     noneSelectedLabel?: string;
 }
 export declare type MultiSelectInputWrapped = React.ForwardRefExoticComponent<MultiSelectInputProps & RefAttributes<InputHTMLAttributes<HTMLInputElement>>>;
-export interface MultiSelectChipProps extends HTMLAttributes<HTMLInputElement> {
+export interface MultiSelectChipProps extends InputHTMLAttributes<HTMLInputElement> {
 }
 export declare const handleSetNativeInput: (id: string, selectedOptionValues: string[], testFunc?: ((value: string[]) => void) | undefined) => () => void;
 export declare const handleResetDefaultValues: (setSelectedOptionValues: Dispatch<SetStateAction<string[]>>, setSelectedDefaultValues: Dispatch<SetStateAction<string[]>>, defaultValues?: string[] | undefined, selectedDefaultValues?: string[] | undefined) => () => void;

package/v3/components/nav/__styles__/index.d.ts

@@ -1,5 +1,4 @@
 /// <reference types="react" />
-export declare const elNavIsDesktop: import("@linaria/core").LinariaClassName;
 export declare const ElNavContainer: import("@linaria/core").StyledMeta & import("react").FunctionComponent<import("react").ClassAttributes<HTMLElement> & import("react").HTMLAttributes<HTMLElement> & {
     as?: import("react").ElementType<any> | undefined;
 }>;
@@ -19,3 +18,4 @@ export declare const ElNavSubItem: import("@linaria/core").StyledMeta & import("
 export declare const elNavSubItemExpanded: import("@linaria/core").LinariaClassName;
 export declare const elNavSubItemActive: import("@linaria/core").LinariaClassName;
 export declare const elNavItemSecondary: import("@linaria/core").LinariaClassName;
+export declare const elNavIsDesktop: import("@linaria/core").LinariaClassName;

package/v3/components/nav/use-nav.stories.d.ts

@@ -1,2 +1,3 @@
+export declare const customTheme: import("@linaria/core").LinariaClassName;
 export declare const UseNavStory: () => JSX.Element;
 export declare const UseNavMobileSubMenuStory: () => JSX.Element;

package/v3/components/pagination/__styles__/index.d.ts

@@ -5,6 +5,9 @@ export declare const ElPaginationWrap: import("@linaria/core").StyledMeta & impo
 export declare const ElPaginationText: import("@linaria/core").StyledMeta & import("react").FunctionComponent<import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
     as?: import("react").ElementType<any> | undefined;
 }>;
+export declare const ElPaginationInput: import("@linaria/core").StyledMeta & import("react").FunctionComponent<import("react").ClassAttributes<HTMLInputElement> & import("react").InputHTMLAttributes<HTMLInputElement> & {
+    as?: import("react").ElementType<any> | undefined;
+}>;
 export declare const ElPaginationButton: import("@linaria/core").StyledMeta & import("react").FunctionComponent<import("react").ClassAttributes<HTMLButtonElement> & import("react").ButtonHTMLAttributes<HTMLButtonElement> & {
     as?: import("react").ElementType<any> | undefined;
 }>;

package/v3/components/pagination/pagination.d.ts

@@ -1,4 +1,4 @@
-import { FC, HTMLAttributes } from 'react';
+import { ChangeEvent, Dispatch, FC, HTMLAttributes, InputHTMLAttributes, SetStateAction } from 'react';
 export interface PaginationProps extends HTMLAttributes<HTMLDivElement> {
     callback: (nextPage: number) => void;
     currentPage: number;
@@ -8,10 +8,15 @@ export interface PaginationWrapProps extends HTMLAttributes<HTMLDivElement> {
 }
 export interface PaginationTextProps extends HTMLAttributes<HTMLDivElement> {
 }
+export interface PaginationInputProps extends InputHTMLAttributes<HTMLInputElement> {
+}
 export interface PaginationButtonProps extends HTMLAttributes<HTMLButtonElement> {
 }
-export declare const handlePageChange: (nextPage: number | null, callback: (page: number) => void) => () => void;
+export declare const handlePageChange: (nextPage: number | null, callback: (page: number) => void, setInputValue: Dispatch<SetStateAction<string>>) => () => void;
+export declare const handlePageInputChange: (numberPages: number, currentPage: number, inputValue: string, callback: (page: number) => void) => () => void;
+export declare const handlePageInput: (setInputValue: Dispatch<SetStateAction<string>>) => (event: ChangeEvent<HTMLInputElement>) => void;
 export declare const PaginationWrap: FC<PaginationWrapProps>;
 export declare const PaginationText: FC<PaginationTextProps>;
+export declare const PaginationInput: FC<PaginationInputProps>;
 export declare const PaginationButton: FC<PaginationButtonProps>;
 export declare const Pagination: FC<PaginationProps>;