repo: move UIKit to packages/ui

This commit is contained in:
vchikalkin 2022-12-20 11:33:18 +03:00
parent 7b9dbdaeb5
commit eff67858dc
30 changed files with 127 additions and 44 deletions

View File

@ -4,7 +4,7 @@ import { toJS } from 'mobx';
import { observer } from 'mobx-react-lite';
import { useStore } from 'stores/hooks';
import styled from 'styled-components';
import { Flex } from 'UIKit/grid';
import { Flex } from 'ui/grid';
import { columns } from './config';
const Grid = styled(Flex)`

View File

@ -3,7 +3,7 @@ import Table from 'elements/Table';
import { observer } from 'mobx-react-lite';
import { useStore } from 'stores/hooks';
import styled from 'styled-components';
import { Flex } from 'UIKit/grid';
import { Flex } from 'ui/grid';
import { columns } from './config';
const Grid = styled(Flex)`

View File

@ -1,4 +1,4 @@
import { Flex } from 'UIKit/grid';
import { Flex } from 'ui/grid';
import renderFormRows from '../../lib/render-rows';
import { id, rows, title } from './config';
import FinGAPTable from './FinGAPTable';

View File

@ -1,6 +1,6 @@
import { observer } from 'mobx-react-lite';
import { useStore } from 'stores/hooks';
import { Flex } from 'UIKit/grid';
import { Flex } from 'ui/grid';
import elementsRender from '../../config/elements-render';
import { elements } from './config';

View File

@ -4,8 +4,8 @@ import { computed } from 'mobx';
import { observer } from 'mobx-react-lite';
import { useStore } from 'stores/hooks';
import styled from 'styled-components';
import { Box, Flex } from 'UIKit/grid';
import { min } from 'UIKit/mq';
import { Box, Flex } from 'ui/grid';
import { min } from 'ui/mq';
import { columns } from './config';
const Grid = styled(Flex)`

View File

@ -1,4 +1,4 @@
import { Box, Flex } from 'UIKit/grid';
import { Box, Flex } from 'ui/grid';
import elementsRender from '../../config/elements-render';
import { id, title } from './config';
import PaymentsParams from './PaymentsParams';

View File

@ -1,7 +1,7 @@
import Background from 'elements/layout/Background';
import Tabs from 'elements/layout/Tabs';
import styled from 'styled-components';
import { min } from 'UIKit/mq';
import { min } from 'ui/mq';
import AddProduct from './AddProduct';
import CreateKP from './CreateKP';
import Insurance from './Insurance';

View File

@ -1,6 +1,6 @@
import Background from 'elements/layout/Background';
import styled from 'styled-components';
import { min } from 'UIKit/mq';
import { min } from 'ui/mq';
import renderFormRows from '../lib/render-rows';
import { rows } from './config';

View File

@ -1,7 +1,7 @@
/* eslint-disable react/no-array-index-key */
import Divider from 'elements/layout/Divider';
import type { BoxProps } from 'UIKit/grid';
import { Box } from 'UIKit/grid';
import type { BoxProps } from 'ui/grid';
import { Box } from 'ui/grid';
import elementsRender from '../config/elements-render';
import type { Elements as ActionElements } from '../config/map/actions';
import type { Elements as ValuesElements } from '../config/map/values';

View File

@ -1,8 +1,8 @@
import { useQuery } from '@tanstack/react-query';
import { getUser } from 'api/user/query';
import styled from 'styled-components';
import { Flex } from 'UIKit/grid';
import { min } from 'UIKit/mq';
import { Flex } from 'ui/grid';
import { min } from 'ui/mq';
const UserText = styled.span`
margin: 0;

View File

@ -1,7 +1,7 @@
import type { ReactNode } from 'react';
import styled from 'styled-components';
import { Flex } from 'UIKit/grid';
import { min } from 'UIKit/mq';
import { Flex } from 'ui/grid';
import { min } from 'ui/mq';
const ElementTitle = styled.label`
color: rgba(0, 0, 0, 0.75);

View File

@ -1,7 +1,7 @@
/* eslint-disable import/no-unresolved */
import styled from 'styled-components';
import { Flex } from 'UIKit/grid';
import { min } from 'UIKit/mq';
import { Flex } from 'ui/grid';
import { min } from 'ui/mq';
import Auth from './Auth';
import Logo from './Logo';

View File

@ -1,8 +1,8 @@
import Image from 'next/image';
import logo from 'public/assets/images/logo-primary.svg';
import styled from 'styled-components';
import { Flex } from 'UIKit/grid';
import { min } from 'UIKit/mq';
import { Flex } from 'ui/grid';
import { min } from 'ui/mq';
const ImageWrapper = styled.div`
width: 100px;

View File

@ -1,6 +1,6 @@
/* eslint-disable react/prop-types */
/* eslint-disable import/no-unresolved */
import { Flex } from 'UIKit/grid';
import { Flex } from 'ui/grid';
import Header from './Header';
export default function Layout({ children }) {

View File

@ -4,8 +4,8 @@ import { toJS } from 'mobx';
import { observer } from 'mobx-react-lite';
import { useStore } from 'stores/hooks';
import styled from 'styled-components';
import { Box } from 'UIKit/grid';
import { min } from 'UIKit/mq';
import { Box } from 'ui/grid';
import { min } from 'ui/mq';
import { formatters, id, title, titles } from './config';
const Grid = styled(Box)`

View File

@ -2,7 +2,7 @@ import Alert from 'elements/Alert';
import { observer } from 'mobx-react-lite';
import { useStore } from 'stores/hooks';
import styled from 'styled-components';
import { Box, Flex } from 'UIKit/grid';
import { Box, Flex } from 'ui/grid';
const Bold = styled.span`
font-weight: bold;

View File

@ -1,7 +1,7 @@
import Background from 'elements/layout/Background';
import Tabs from 'elements/layout/Tabs';
import styled from 'styled-components';
import { min } from 'UIKit/mq';
import { min } from 'ui/mq';
import PaymentsTable from './PaymentsTable';
import Results from './Results';
import Validation from './Validation';

View File

@ -1,7 +0,0 @@
import { mediaQuery } from './mq';
const theme = {
...mediaQuery,
};
export default theme;

View File

@ -44,10 +44,10 @@
"radash": "^8.0.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"rebass": "^4.0.7",
"sharp": "^0.30.4",
"styled-components": "^5.3.5",
"superjson": "^1.11.0",
"ui": "*",
"use-debounce": "^8.0.1",
"zod": "^3.19.1"
},
@ -61,7 +61,6 @@
"@types/node": "18.7.18",
"@types/react": "18.0.20",
"@types/react-dom": "18.0.6",
"@types/rebass": "^4.0.10",
"@types/styled-components": "^5.1.25",
"@typescript-eslint/eslint-plugin": "^5.37.0",
"@typescript-eslint/parser": "^5.37.0",

View File

@ -1,6 +1,6 @@
import styled from 'styled-components';
import { Box } from 'UIKit/grid';
import { min } from 'UIKit/mq';
import { Box } from 'ui/grid';
import { min } from 'ui/mq';
const Background = styled(Box)`
background: #fff;

View File

@ -6,11 +6,14 @@
"license": "MIT",
"devDependencies": {
"@types/react": "18.0.20",
"@types/styled-components": "^5",
"react": "^18.2.0",
"typescript": "^4.9.4"
},
"dependencies": {
"antd": "^4.24.5",
"styled-components": "^5.3.6",
"ui": "*",
"use-debounce": "^9.0.2"
}
}

View File

@ -15,6 +15,4 @@ export function max(breakpoint: keyof typeof screens) {
return `@media (max-width: calc(${screens[breakpoint]}px))`;
}
export const mediaQuery = {
breakpoints: Object.values(screens).map((value) => `${value + threshold}px`),
};
export const breakpoints = Object.values(screens).map((value) => `${value + threshold}px`);

16
packages/ui/package.json Normal file
View File

@ -0,0 +1,16 @@
{
"name": "ui",
"version": "0.0.0",
"main": "./index.tsx",
"types": "./index.tsx",
"license": "MIT",
"devDependencies": {
"@types/rebass": "^4.0.10",
"@types/styled-components": "^5",
"typescript": "^4.9.4"
},
"dependencies": {
"rebass": "^4.0.7",
"styled-components": "^5.3.6"
}
}

7
packages/ui/theme.js Normal file
View File

@ -0,0 +1,7 @@
import { breakpoints } from './mq';
const theme = {
breakpoints,
};
export default theme;

20
packages/ui/tsconfig.json Normal file
View File

@ -0,0 +1,20 @@
{
"$schema": "https://json.schemastore.org/tsconfig",
"display": "Default",
"compilerOptions": {
"composite": false,
"declaration": true,
"declarationMap": true,
"esModuleInterop": true,
"forceConsistentCasingInFileNames": true,
"inlineSources": false,
"isolatedModules": true,
"moduleResolution": "node",
"noUnusedLocals": false,
"noUnusedParameters": false,
"preserveWatchOutput": true,
"skipLibCheck": true,
"strict": true
},
"exclude": ["node_modules"]
}

View File

@ -10,8 +10,8 @@ import { useMemo } from 'react';
import StoreProvider from 'stores/Provider';
import { ThemeProvider } from 'styled-components';
import { trpcClient } from 'trpc/client';
import { GlobalStyle } from 'UIKit/colors';
import theme from 'UIKit/theme';
import { GlobalStyle } from 'ui/colors';
import theme from 'ui/theme';
import '../styles/fonts.css';
import '../styles/globals.css';

View File

@ -8,8 +8,8 @@ import Head from 'next/head';
import { getOwnerData, useInsuranceData, useMainData } from 'process/init/get-data';
import { useReactions } from 'process/init/inject-reactions/hooks';
import styled from 'styled-components';
import { Box } from 'UIKit/grid';
import { min } from 'UIKit/mq';
import { Box } from 'ui/grid';
import { min } from 'ui/mq';
const Grid = styled(Box)`
display: flex;

View File

@ -3287,6 +3287,17 @@ __metadata:
languageName: node
linkType: hard
"@types/styled-components@npm:^5":
version: 5.1.26
resolution: "@types/styled-components@npm:5.1.26"
dependencies:
"@types/hoist-non-react-statics": "*"
"@types/react": "*"
csstype: ^3.0.2
checksum: 84f53b3101739b20d1731554fb7735bc2f3f5d050a8b392e9845403c8c8bbd729737d033978649f9195a97b557875b010d46e35a4538564a2d0dbcce661dbf76
languageName: node
linkType: hard
"@types/styled-system@npm:*":
version: 5.1.15
resolution: "@types/styled-system@npm:5.1.15"
@ -5881,9 +5892,12 @@ __metadata:
resolution: "elements@workspace:packages/elements"
dependencies:
"@types/react": 18.0.20
"@types/styled-components": ^5
antd: ^4.24.5
react: ^18.2.0
styled-components: ^5.3.6
typescript: ^4.9.4
ui: "*"
use-debounce: ^9.0.2
languageName: unknown
linkType: soft
@ -6554,7 +6568,6 @@ __metadata:
"@types/node": 18.7.18
"@types/react": 18.0.20
"@types/react-dom": 18.0.6
"@types/rebass": ^4.0.10
"@types/styled-components": ^5.1.25
"@typescript-eslint/eslint-plugin": ^5.37.0
"@typescript-eslint/parser": ^5.37.0
@ -6588,13 +6601,13 @@ __metadata:
radash: ^8.0.0
react: ^18.2.0
react-dom: ^18.2.0
rebass: ^4.0.7
sharp: ^0.30.4
styled-components: ^5.3.5
superjson: ^1.11.0
ts-jest: ^29.0.1
turbo: ^1.6.3
typescript: 4.8.3
ui: "*"
use-debounce: ^8.0.1
zod: ^3.19.1
languageName: unknown
@ -12913,6 +12926,28 @@ __metadata:
languageName: node
linkType: hard
"styled-components@npm:^5.3.6":
version: 5.3.6
resolution: "styled-components@npm:5.3.6"
dependencies:
"@babel/helper-module-imports": ^7.0.0
"@babel/traverse": ^7.4.5
"@emotion/is-prop-valid": ^1.1.0
"@emotion/stylis": ^0.8.4
"@emotion/unitless": ^0.7.4
babel-plugin-styled-components: ">= 1.12.0"
css-to-react-native: ^3.0.0
hoist-non-react-statics: ^3.0.0
shallowequal: ^1.1.0
supports-color: ^5.5.0
peerDependencies:
react: ">= 16.8.0"
react-dom: ">= 16.8.0"
react-is: ">= 16.8.0"
checksum: 68eac1e451be81d66739cf86de8ec9e72f46e7584aa359271761a2437468210bd7cf0a864281fc97dab08c32b35e6bf7513dc8b4104ed6b196cf8d65674dd289
languageName: node
linkType: hard
"styled-jsx@npm:5.0.6":
version: 5.0.6
resolution: "styled-jsx@npm:5.0.6"
@ -13580,6 +13615,18 @@ __metadata:
languageName: node
linkType: hard
"ui@*, ui@workspace:packages/ui":
version: 0.0.0-use.local
resolution: "ui@workspace:packages/ui"
dependencies:
"@types/rebass": ^4.0.10
"@types/styled-components": ^5
rebass: ^4.0.7
styled-components: ^5.3.6
typescript: ^4.9.4
languageName: unknown
linkType: soft
"unbox-primitive@npm:^1.0.1":
version: 1.0.1
resolution: "unbox-primitive@npm:1.0.1"