@linzjs/lui 17.26.1-1 → 18.0.0

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "17.26.1-1",
+  "version": "18.0.0",
   "license": "MIT",
   "repository": {
     "type": "git",
@@ -33,9 +33,11 @@
     "prettier:fix-changed": "pretty-quick",
     "clear-cache": "jest --clearCache",
     "watch-storybook": "start-storybook --port=6006 --static-dir ./src/assets",
-    "generate-svgs": "echo 'CHECK THAT YOUR SVG HAS A VIEW BOX, otherwise it will not work'; node ./svg-generator"
+    "generate-svgs": "echo 'CHECK THAT YOUR SVG HAS A VIEW BOX, otherwise it will not work'; node ./svg-generator",
+    "install-react-17": "npm i react@^17 react-dom@^17 && npm i @testing-library/react@^12 @types/react@^17 framer-motion@^4.1"
   },
   "peerDependencies": {
+    "framer-motion": ">=4.1",
     "react": ">=16",
     "react-dom": ">=16"
   },
@@ -47,13 +49,12 @@
   "name": "@linzjs/lui",
   "module": "dist/lui.esm.js",
   "jest": {
+    "preset": "ts-jest",
+    "testEnvironment": "jsdom",
     "moduleNameMapper": {
       "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/src/__mocks__/fileMock.js",
       "\\.(css|less|scss)$": "<rootDir>/src/__mocks__/styleMock.js"
     },
-    "transform": {
-      "^.+\\.tsx?$": "esbuild-jest"
-    },
     "setupFilesAfterEnv": [
       "./setupTests.ts"
     ],
@@ -74,6 +75,7 @@
   "devDependencies": {
     "@geometricpanda/storybook-addon-badges": "^0.2.1",
     "@linzjs/style": "^3.9.0",
+    "@mdx-js/react": "^2.1.3",
     "@react-types/shared": "^3.14.0",
     "@rollup/plugin-commonjs": "^21.0.2",
     "@rollup/plugin-json": "^4.1.0",
@@ -82,46 +84,47 @@
     "@semantic-release/git": "^9.0.0",
     "@size-limit/preset-small-lib": "^7.0.8",
     "@storybook/addon-a11y": "^6.5.0",
-    "@storybook/addon-docs": "^6.5.0",
+    "@storybook/addon-docs": "^6.5.12",
     "@storybook/addon-essentials": "^6.5.0",
     "@storybook/addon-info": "^5.3.21",
     "@storybook/addon-links": "^6.5.0",
     "@storybook/addon-storysource": "6.4.19",
     "@storybook/addons": "^6.5.0",
+    "@storybook/mdx2-csf": "^0.0.3",
     "@storybook/preset-scss": "^1.0.3",
-    "@storybook/react": "^6.5.0",
+    "@storybook/react": "^6.5.12",
     "@storybook/theming": "^6.5.0",
     "@testing-library/jest-dom": "^5.8.0",
-    "@testing-library/react": "^10.0.4",
-    "@testing-library/user-event": "^10.4.0",
+    "@testing-library/react": "^13.0.0",
+    "@testing-library/user-event": "^14.0.0",
     "@types/camelcase": "^5.2.0",
-    "@types/jest": "^25.2.3",
+    "@types/jest": "^27.4.1",
     "@types/jest-axe": "^3.5.0",
-    "@types/react": "^16.9.55",
+    "@types/react": "^18.0.21",
     "@types/react-dom": "^16.9.9",
     "@types/react-helmet": "^6.1.2",
-    "@types/react-modal": "^3.10.5",
+    "@types/react-modal": "^3.13.1",
     "@types/sass": "^1.16.0",
     "@types/uuid": "^8.3.1",
     "@types/yup": "0.29.13",
     "chromatic": "^4.0.3",
     "conventional-changelog-conventionalcommits": "^4.6.1",
     "css-loader": "^3.6.0",
-    "esbuild": "^0.15.5",
-    "esbuild-jest": "^0.5.0",
     "eslint-config-prettier": "8.3.0",
     "eslint-config-react-app": "^7.0.0",
     "eslint-plugin-prettier": "4.0.0",
     "fetch-mock": "^9.11.0",
+    "framer-motion": "^7.5.2",
     "html-loader": "^1.1.0",
     "husky": "^4.3.0",
+    "jest": "^27.5.1",
     "jest-axe": "^3.5.0",
     "jest-canvas-mock": "2.3.1",
     "msw": "^0.22.2",
     "npm-run-all": "^4.1.5",
     "pretty-quick": "^3.1.1",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
     "react-helmet": "^6.1.0",
     "react-is": "^17.0.1",
     "rollup": "^2.56.3",
@@ -138,6 +141,7 @@
     "stylelint-config-standard": "^25.0.0",
     "stylelint-scss": "^4.1.0",
     "stylelint-suitcss": "^5.0.0",
+    "ts-jest": "^27.1.3",
     "typescript": "^4.7.4",
     "whatwg-fetch": "^3.4.1",
     "yup": "^0.29.0"
@@ -148,16 +152,13 @@
     "@react-aria/listbox": "^3.6.0",
     "@react-aria/utils": "^3.13.2",
     "@react-stately/list": "^3.5.2",
-    "@szhsin/react-menu": "^2.3.3",
-    "react-split-grid": "1.0.4",
+    "@szhsin/react-menu": "^3.1.2",
     "camelcase": "^6.0.0",
     "clsx": "^1.1.0",
     "container-query-polyfill": "0.1.2",
-    "formik": "^2.1.4",
-    "framer-motion": "4.1.17",
     "lottie-web": "^5.9.1",
     "react-loading-skeleton": "^3.1.0",
-    "react-modal": "^3.11.2",
+    "react-modal": "^3.15.1",
     "react-query": "2.26.3",
     "react-select": "^5.1.0",
     "resolve-url-loader": "^5.0.0",

package/dist/components/LuiBearingInput/LuiBearingInput.d.ts

@@ -1,23 +0,0 @@
-import React, { ReactNode } from 'react';
-import { LuiCommonInputProps } from '../LuiFormikForms/LuiFormikForm';
-interface LuiBearingInputProps {
-    name: string;
-    label?: string;
-    helperInfo?: ReactNode;
-    tooltip?: string;
-    value: string;
-    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
-    validationError?: string;
-    onValidate?: (error: string | null) => void;
-    /** If true, validationError prop takes precedence over the internalError value. */
-    preferValidationError?: boolean;
-}
-export declare const LuiBearingInput: React.FC<React.PropsWithChildren<LuiBearingInputProps & LuiCommonInputProps>>;
-interface LuiBearingFormikInputProps {
-    name: string;
-    label: string;
-    /** If true, validationError prop takes precedence over the LuiBearingInput internalError value. */
-    preferValidationError?: boolean;
-}
-export declare const LuiBearingFormikInput: React.FC<React.PropsWithChildren<LuiBearingFormikInputProps & LuiCommonInputProps>>;
-export {};

package/dist/components/LuiFormikForms/LuiFormikCheckbox/LuiFormikCheckbox.d.ts

@@ -1,9 +0,0 @@
-import { ReactNode } from 'react';
-import { LuiCommonInputProps } from '../LuiFormikForm';
-export declare function LuiFormikCheckbox(props: {
-    name: string;
-    value: string;
-    label: ReactNode;
-    htmlFor?: string;
-    className?: string;
-} & LuiCommonInputProps): JSX.Element;

package/dist/components/LuiFormikForms/LuiFormikForm.d.ts

@@ -1,10 +0,0 @@
-/// <reference types="react" />
-import { FormikConfig, FormikValues } from 'formik';
-export declare function LuiFormikForm<Values extends FormikValues = FormikValues, ExtraProps = {}>(props: FormikConfig<Values> & ExtraProps & {
-    className?: string;
-}): JSX.Element;
-export interface LuiCommonInputProps {
-    inputProps?: object;
-    required?: boolean;
-    disabled?: boolean;
-}

package/dist/components/LuiFormikForms/LuiFormikFormLabel/LuiFormikFormLabel.d.ts

@@ -1,8 +0,0 @@
-import React from 'react';
-export declare const LuiFormikFormLabel: React.FC<React.PropsWithChildren<{
-    for: string;
-    label: string;
-    className?: string;
-    required?: boolean;
-    tooltip?: string;
-}>>;

package/dist/components/LuiFormikForms/LuiFormikFormSubmitButton/LuiFormikFormSubmitButton.d.ts

@@ -1,6 +0,0 @@
-import React from 'react';
-export declare const LuiFormikFormSubmitButton: React.ComponentType<{
-    className?: string | undefined;
-    disabled?: boolean | undefined;
-    'data-testid'?: string | undefined;
-}>;

package/dist/components/LuiFormikForms/LuiFormikRadioButton/LuiFormikRadioButton.d.ts

@@ -1,8 +0,0 @@
-import React from 'react';
-import { LuiCommonInputProps } from '../LuiFormikForm';
-export declare const LuiFormikRadioButton: React.FC<React.PropsWithChildren<{
-    label: string;
-    className?: string;
-    value: string;
-    name: string;
-} & LuiCommonInputProps>>;

package/dist/components/LuiFormikForms/LuiFormikRadioGroup/LuiFormikRadioGroup.d.ts

@@ -1,7 +0,0 @@
-import React from 'react';
-export declare const LuiFormikRadioGroup: React.FC<React.PropsWithChildren<{
-    hint?: string;
-    legend: string;
-    name: string;
-    required?: boolean;
-}>>;

package/dist/components/LuiFormikForms/LuiFormikSelect/LuiFormikSelect.d.ts

@@ -1,11 +0,0 @@
-import React from 'react';
-import { LuiCommonInputProps } from '../LuiFormikForm';
-export declare const LuiFormikSelect: React.ComponentType<{
-    name: string;
-    label: string;
-    className?: string | undefined;
-    defaultValue?: string | undefined;
-    helperInfo?: (() => React.Component) | undefined;
-    tooltip?: string | undefined;
-    validate?: ((value: string) => string | undefined) | undefined;
-} & LuiCommonInputProps>;

package/dist/components/LuiFormikForms/LuiFormikTextInput/LuiFormikTextInput.d.ts

@@ -1,17 +0,0 @@
-import { FormikContextType } from 'formik';
-import React, { ReactNode } from 'react';
-import { LuiCommonInputProps } from '../LuiFormikForm';
-export declare const LuiFormikTextInput: React.ComponentType<{
-    name: string;
-    label?: string | undefined;
-    className?: string | undefined;
-    helperInfo?: ReactNode;
-    tooltip?: string | undefined;
-    validate?: ((value: string) => string | undefined) | undefined;
-    onValueChange?: ((newValue: {
-        value: string;
-        formik: FormikContextType<any>;
-    }) => void) | undefined;
-    validateOnChange?: boolean | undefined;
-    multiLine?: boolean | undefined;
-} & LuiCommonInputProps>;

package/dist/components/LuiResizableLayout/LuiResizableLayout.d.ts

@@ -1,21 +0,0 @@
-import React, { ReactNode, RefObject } from 'react';
-import { MinSizes } from 'split-grid';
-import './LuiResizableLayout.scss';
-export declare enum SplitPanelState {
-    OPEN = 0,
-    CLOSED_LEFT = 1,
-    CLOSED_RIGHT = 2
-}
-export declare const LuiResizableLayout: React.FC<{
-    givenLeftRef?: RefObject<HTMLDivElement>;
-    givenRightRef?: RefObject<HTMLDivElement>;
-    leftContentComponent?: ReactNode;
-    rightContentComponent?: ReactNode;
-    givenGridTemplateColumns?: string;
-    givenColumnMinSizes?: MinSizes;
-    givenColumnSnapOffset?: number;
-    callbackOnSplitStateChange?: (currentSplitState: SplitPanelState, leftWidth: number, rightWidth: number, gridTemplateColumns: string) => void;
-    splitStateChecker?: (leftWidth: number, rightWidth: number) => SplitPanelState;
-    callbackOnClickLeftArrowButton?: (leftWidth: number, rightWidth: number) => void;
-    callbackOnClickRightArrowButton?: (leftWidth: number, rightWidth: number) => void;
-}>;