@mailstep/design-system 0.6.72-beta.0 → 0.6.72

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (34) hide show
  1. package/README.md +78 -78
  2. package/package.json +150 -150
  3. package/ui/Blocks/CommonGrid/types.d.ts +1 -0
  4. package/ui/Blocks/Header/index.d.ts +2 -4
  5. package/ui/Blocks/Header/index.js +2 -2
  6. package/ui/Blocks/Header/stories/Header.stories.d.ts +2 -5
  7. package/ui/Blocks/Header/stories/Header.stories.js +0 -1
  8. package/ui/Blocks/LoginPage/LoginPage.js +1 -1
  9. package/ui/Blocks/LoginPage/styles.d.ts +1 -1
  10. package/ui/Blocks/LoginPage/styles.js +1 -2
  11. package/ui/Elements/Card/Card.d.ts +4 -6
  12. package/ui/Elements/Card/Card.js +6 -44
  13. package/ui/Elements/Card/index.d.ts +2 -3
  14. package/ui/Elements/Card/index.js +2 -3
  15. package/ui/Elements/Card/stories/Card.stories.d.ts +4 -5
  16. package/ui/Elements/Card/stories/Card.stories.js +15 -24
  17. package/ui/Elements/Card/styles.d.ts +5 -12
  18. package/ui/Elements/Card/styles.js +12 -26
  19. package/ui/Elements/Card/types.d.ts +5 -17
  20. package/ui/Elements/Logo/assets/mailship/mailship-logo.svg +12 -12
  21. package/ui/Elements/Logo/assets/mailstep/mailstep_black.svg +17 -17
  22. package/ui/Elements/Logo/assets/mailstep/mailstep_white.svg +17 -17
  23. package/ui/Elements/Logo/assets/mailstock/mailstock.svg +12 -12
  24. package/ui/Elements/Logo/assets/mailwise/mailwiseLogo.svg +46 -46
  25. package/ui/Elements/Logo/assets/mailwise/mailwiseLogoSmall.svg +19 -19
  26. package/ui/Elements/Logo/assets/warehouse/manager.svg +5 -5
  27. package/ui/Elements/Logo/assets/warehouse/manager2.svg +5 -5
  28. package/ui/Elements/Logo/assets/warehouse/manager3.svg +4 -4
  29. package/ui/index.d.ts +0 -1
  30. package/ui/index.es.js +15734 -15282
  31. package/ui/index.js +0 -1
  32. package/ui/index.umd.js +629 -650
  33. package/ui/Elements/Card/stories/CardComponent.stories.d.ts +0 -12
  34. package/ui/Elements/Card/stories/CardComponent.stories.js +0 -27
package/README.md CHANGED
@@ -1,78 +1,78 @@
1
- # Mailstep Design-system
2
-
3
- Live demo here: https://mailstep.gitlab.io/mailwise/mw2/design-system/storybook
4
-
5
- Powered by chromatic: https://www.chromatic.com/library?appId=664c5032c1e55e80a74fcfd2&branch=master
6
-
7
- ## Peer dependencies
8
- - @xstyled/styled-components
9
- - styled-component
10
- - react-router
11
- - react-router-dom
12
-
13
- ### How to develoop
14
- ```
15
- yarn install
16
- yarn dev
17
- ```
18
-
19
- ### How to use
20
- ```
21
- yarn add @mailstep/design-system
22
- ```
23
- and add `import 'swiper/css'` somewhere to the root app.
24
-
25
-
26
- #### How to publish
27
- In root folder run
28
-
29
- ```
30
- npm run build
31
- npm run deploy
32
- ```
33
-
34
- ## Components
35
- There are Elements, Blocks and Forms components. Also you can use ThemeProvider and Utils package
36
-
37
- ### Elements
38
- | Component | Description | Info |
39
- |----------|:-------------:|------:|
40
- | Alert | TBD | [More info](ui/Elements/Alert/README.md) |
41
- | Avatar | TBD | [More info](ui/Elements/Avatar/README.md) |
42
- | Badge | TBD | [More info](ui/Elements/Badge/README.md) |
43
- | BorderedBox | TBD | [More info](ui/Elements/BorderedBox/README.md) |
44
- | Button | TBD | [More info](ui/Elements/Button/README.md) |
45
- | Card | TBD | [More info](ui/Elements/Card/README.md) |
46
- | DialogOverlay | TBD | [More info](ui/Elements/DialogOverlay/README.md) |
47
- | Dropdown | TBD | [More info](ui/Elements/Dropdown/README.md) |
48
- | ErrorMessage | TBD | [More info](ui/Elements/ErrorMessage/README.md) |
49
- | Icon | TBD | [More info](ui/Elements/Icon/README.md) |
50
- | Image | TBD | [More info](ui/Elements/Image/README.md) |
51
- | Label | TBD | [More info](ui/Elements/Label/README.md) |
52
- | Link | TBD | [More info](ui/Elements/Link/README.md) |
53
- | Logo | TBD | [More info](ui/Elements/Logo/README.md) |
54
- | Overlay | TBD | [More info](ui/Elements/Overlay/README.md) |
55
- | Pagination | TBD | [More info](ui/Elements/Pagination/README.md) |
56
- | Paragraph | TBD | [More info](ui/Elements/Paragraph/README.md) |
57
- | Spinner | TBD | [More info](ui/Elements/Spinner/README.md) |
58
-
59
- ### Blocks
60
- | Component | Description | Info |
61
- |----------|:-------------:|------:|
62
- | TBD | TBD | TBD |
63
-
64
- ### Forms
65
- | Component | Description | Info |
66
- |----------|:-------------:|------:|
67
- | TBD | TBD | TBD |
68
-
69
- ### System
70
- | Component | Description | Info |
71
- |----------|:-------------:|------:|
72
- | Fonts | Import adjusted fonts of inter | TBD |
73
-
74
- ### Theme Provider
75
- | Component | Description | Info |
76
- |----------|:-------------:|------:|
77
- | Theme Provider | TBD | [More info](ui/ThemeProvider/README.md) |
78
-
1
+ # Mailstep Design-system
2
+
3
+ Live demo here: https://mailstep.gitlab.io/mailwise/mw2/design-system/storybook
4
+
5
+ Powered by chromatic: https://www.chromatic.com/library?appId=664c5032c1e55e80a74fcfd2&branch=master
6
+
7
+ ## Peer dependencies
8
+ - @xstyled/styled-components
9
+ - styled-component
10
+ - react-router
11
+ - react-router-dom
12
+
13
+ ### How to develoop
14
+ ```
15
+ yarn install
16
+ yarn dev
17
+ ```
18
+
19
+ ### How to use
20
+ ```
21
+ yarn add @mailstep/design-system
22
+ ```
23
+ and add `import 'swiper/css'` somewhere to the root app.
24
+
25
+
26
+ #### How to publish
27
+ In root folder run
28
+
29
+ ```
30
+ npm run build
31
+ npm run deploy
32
+ ```
33
+
34
+ ## Components
35
+ There are Elements, Blocks and Forms components. Also you can use ThemeProvider and Utils package
36
+
37
+ ### Elements
38
+ | Component | Description | Info |
39
+ |----------|:-------------:|------:|
40
+ | Alert | TBD | [More info](ui/Elements/Alert/README.md) |
41
+ | Avatar | TBD | [More info](ui/Elements/Avatar/README.md) |
42
+ | Badge | TBD | [More info](ui/Elements/Badge/README.md) |
43
+ | BorderedBox | TBD | [More info](ui/Elements/BorderedBox/README.md) |
44
+ | Button | TBD | [More info](ui/Elements/Button/README.md) |
45
+ | Card | TBD | [More info](ui/Elements/Card/README.md) |
46
+ | DialogOverlay | TBD | [More info](ui/Elements/DialogOverlay/README.md) |
47
+ | Dropdown | TBD | [More info](ui/Elements/Dropdown/README.md) |
48
+ | ErrorMessage | TBD | [More info](ui/Elements/ErrorMessage/README.md) |
49
+ | Icon | TBD | [More info](ui/Elements/Icon/README.md) |
50
+ | Image | TBD | [More info](ui/Elements/Image/README.md) |
51
+ | Label | TBD | [More info](ui/Elements/Label/README.md) |
52
+ | Link | TBD | [More info](ui/Elements/Link/README.md) |
53
+ | Logo | TBD | [More info](ui/Elements/Logo/README.md) |
54
+ | Overlay | TBD | [More info](ui/Elements/Overlay/README.md) |
55
+ | Pagination | TBD | [More info](ui/Elements/Pagination/README.md) |
56
+ | Paragraph | TBD | [More info](ui/Elements/Paragraph/README.md) |
57
+ | Spinner | TBD | [More info](ui/Elements/Spinner/README.md) |
58
+
59
+ ### Blocks
60
+ | Component | Description | Info |
61
+ |----------|:-------------:|------:|
62
+ | TBD | TBD | TBD |
63
+
64
+ ### Forms
65
+ | Component | Description | Info |
66
+ |----------|:-------------:|------:|
67
+ | TBD | TBD | TBD |
68
+
69
+ ### System
70
+ | Component | Description | Info |
71
+ |----------|:-------------:|------:|
72
+ | Fonts | Import adjusted fonts of inter | TBD |
73
+
74
+ ### Theme Provider
75
+ | Component | Description | Info |
76
+ |----------|:-------------:|------:|
77
+ | Theme Provider | TBD | [More info](ui/ThemeProvider/README.md) |
78
+
package/package.json CHANGED
@@ -1,150 +1,150 @@
1
- {
2
- "name": "@mailstep/design-system",
3
- "version": "0.6.72-beta.0",
4
- "license": "ISC",
5
- "type": "module",
6
- "main": "./ui/index.js",
7
- "module": "./ui/index.es.js",
8
- "types": "./ui/index.d.ts",
9
- "files": [
10
- "ui",
11
- "assets"
12
- ],
13
- "scripts": {
14
- "storybook": "storybook dev -p 6006",
15
- "build": "rm -rf ./build && tsc && vite build && cp package.json build && cp README.md build",
16
- "build-storybook": "storybook build",
17
- "deploy": "npm run build && npm publish ./build",
18
- "dev": "yarn storybook",
19
- "test": "echo \"The tests are still waiting to be written, but it seems like they're really good at procrastinating!\"",
20
- "chromatic": "npx chromatic --project-token=chpt_cbebab21ab70358 --exit-zero-on-changes",
21
- "lint": "eslint src/**/*.{js,jsx,ts,tsx,json}"
22
- },
23
- "devDependencies": {
24
- "@babel/core": "^7.20.12",
25
- "@babel/preset-env": "^7.22.4",
26
- "@babel/preset-react": "^7.22.3",
27
- "@babel/preset-typescript": "^7.23.3",
28
- "@chromatic-com/storybook": "^1",
29
- "@fortawesome/fontawesome-svg-core": "^6.3.0",
30
- "@fortawesome/free-brands-svg-icons": "^6.1.1",
31
- "@fortawesome/pro-duotone-svg-icons": "^6.0.0",
32
- "@fortawesome/pro-light-svg-icons": "^6.0.0",
33
- "@fortawesome/pro-regular-svg-icons": "^6.0.0",
34
- "@fortawesome/pro-solid-svg-icons": "^6.3.0",
35
- "@fortawesome/react-fontawesome": "^0.2.0",
36
- "@lingui/core": "3.17.2",
37
- "@lingui/react": "3.17.2",
38
- "@popperjs/core": "^2.11.8",
39
- "@storybook/addon-controls": "^8.1.1",
40
- "@storybook/addon-designs": "^8.0.2",
41
- "@storybook/addon-essentials": "^8.1.1",
42
- "@storybook/addon-interactions": "^8.1.1",
43
- "@storybook/addon-links": "^8.1.1",
44
- "@storybook/blocks": "^8.1.1",
45
- "@storybook/react": "^8.1.1",
46
- "@storybook/react-webpack5": "^8.1.1",
47
- "@storybook/test": "^8.1.1",
48
- "@svgr/rollup": "^8.0.1",
49
- "@trivago/prettier-plugin-sort-imports": "^4.3.0",
50
- "@types/faker": "^4.1.11",
51
- "@types/luxon": "^3.4.2",
52
- "@types/node": "^20.1.7",
53
- "@types/react": "^18.2.6",
54
- "@types/react-beautiful-dnd": "^13.1.2",
55
- "@types/react-dom": "^18.2.4",
56
- "@types/react-helmet": "^6.1.11",
57
- "@types/react-router": "^5.1.20",
58
- "@types/react-router-dom": "^5.3.3",
59
- "@types/styled-components": "^5.1.26",
60
- "@typescript-eslint/eslint-plugin": "^5.59.6",
61
- "@typescript-eslint/parser": "^5.59.6",
62
- "@vitejs/plugin-react": "^4.2.1",
63
- "@xstyled/styled-components": "^3.8.0",
64
- "babel-loader": "^9.1.3",
65
- "babel-plugin-macros": "^3.1.0",
66
- "babel-plugin-named-exports-order": "^0.0.2",
67
- "chromatic": "^11.3.5",
68
- "eslint": "^8.41.0",
69
- "eslint-config-prettier": "^8.8.0",
70
- "eslint-config-standard-with-typescript": "^34.0.1",
71
- "eslint-plugin-import": "^2.29.1",
72
- "eslint-plugin-n": "^17.9.0",
73
- "eslint-plugin-prettier": "^4.2.1",
74
- "eslint-plugin-promise": "^6.6.0",
75
- "eslint-plugin-react": "^7.35.0",
76
- "eslint-plugin-react-hooks": "^4.6.2",
77
- "eslint-plugin-react-perf": "^3.3.2",
78
- "eslint-plugin-storybook": "^0.8.0",
79
- "faker": "^5.1.0",
80
- "immer": "9.0.7",
81
- "lodash": "^4.17.21",
82
- "luxon": "^3.4.4",
83
- "moment": "^2.30.1",
84
- "prettier": "2.8.8",
85
- "react": "^18.2.0",
86
- "react-beautiful-dnd": "^13.0.0",
87
- "react-dom": "^18.2.0",
88
- "react-helmet": "^6.1.0",
89
- "react-image": "^4.1.0",
90
- "react-onclickoutside": "^6.13.0",
91
- "react-popper": "^2.3.0",
92
- "react-redux": "*",
93
- "react-router": "^5.1.2",
94
- "react-router-dom": "^5.1.2",
95
- "react-script": "^2.0.5",
96
- "react-select": "^5.8.0",
97
- "react-use-draggable-scroll": "^0.4.7",
98
- "redux": ">=4.0.5",
99
- "reselect": "5.0.0-alpha.2",
100
- "storybook": "^8.1.1",
101
- "string-width": "6.1.0",
102
- "styled-components": "^5.3.10",
103
- "swiper": "^11.0.3",
104
- "tslib": "^2.6.2",
105
- "typescript": "^5.0.4",
106
- "vite": "^5.0.10",
107
- "vite-plugin-dts": "^3.6.4",
108
- "vite-plugin-static-copy": "^1.0.0",
109
- "webpack": "^5.82.1"
110
- },
111
- "peerDependencies": {
112
- "@fortawesome/fontawesome-svg-core": "^6.3.0",
113
- "@fortawesome/free-brands-svg-icons": "^6.1.1",
114
- "@fortawesome/pro-duotone-svg-icons": "^6.0.0",
115
- "@fortawesome/pro-light-svg-icons": "^6.0.0",
116
- "@fortawesome/pro-regular-svg-icons": "^6.0.0",
117
- "@fortawesome/pro-solid-svg-icons": "^6.3.0",
118
- "@fortawesome/react-fontawesome": "^0.2.0",
119
- "@lingui/core": "3.17.2",
120
- "@lingui/react": "3.17.2",
121
- "@popperjs/core": "^2.11.8",
122
- "@xstyled/styled-components": "^3.8.0",
123
- "babel-plugin-macros": "^3.1.0",
124
- "immer": "9.0.7",
125
- "lodash": "^4.17.21",
126
- "luxon": "^3.4.4",
127
- "moment": "^2.30.1",
128
- "react": "^18.2.0",
129
- "react-beautiful-dnd": "^13.0.0",
130
- "react-dom": "^18.2.0",
131
- "react-helmet": "^6.1.0",
132
- "react-image": "^4.1.0",
133
- "react-onclickoutside": "^6.13.0",
134
- "react-popper": "^2.3.0",
135
- "react-redux": ">=4.0.5",
136
- "react-router": "^5.1.2",
137
- "react-router-dom": "^5.1.2",
138
- "react-select": "^5.8.0",
139
- "react-use-draggable-scroll": "^0.4.7",
140
- "redux": ">=4.0.5",
141
- "reselect": "5.0.0-alpha.2",
142
- "styled-components": "^5.3.10",
143
- "swiper": "^11.0.3",
144
- "tslib": "^2.6.2",
145
- "typescript": "^5.0.4"
146
- },
147
- "resolutions": {
148
- "jackspeak": "2.1.1"
149
- }
150
- }
1
+ {
2
+ "name": "@mailstep/design-system",
3
+ "version": "0.6.72",
4
+ "license": "ISC",
5
+ "type": "module",
6
+ "main": "./ui/index.js",
7
+ "module": "./ui/index.es.js",
8
+ "types": "./ui/index.d.ts",
9
+ "files": [
10
+ "ui",
11
+ "assets"
12
+ ],
13
+ "scripts": {
14
+ "storybook": "storybook dev -p 6006",
15
+ "build": "tsc && vite build && copy package.json build && copy README.md build",
16
+ "build-storybook": "storybook build",
17
+ "deploy": "npm run build && npm publish ./build",
18
+ "dev": "yarn storybook",
19
+ "test": "echo \"The tests are still waiting to be written, but it seems like they're really good at procrastinating!\"",
20
+ "chromatic": "npx chromatic --project-token=chpt_cbebab21ab70358 --exit-zero-on-changes",
21
+ "lint": "eslint src/**/*.{js,jsx,ts,tsx,json}"
22
+ },
23
+ "devDependencies": {
24
+ "@babel/core": "^7.20.12",
25
+ "@babel/preset-env": "^7.22.4",
26
+ "@babel/preset-react": "^7.22.3",
27
+ "@babel/preset-typescript": "^7.23.3",
28
+ "@chromatic-com/storybook": "^1",
29
+ "@fortawesome/fontawesome-svg-core": "^6.3.0",
30
+ "@fortawesome/free-brands-svg-icons": "^6.1.1",
31
+ "@fortawesome/pro-duotone-svg-icons": "^6.0.0",
32
+ "@fortawesome/pro-light-svg-icons": "^6.0.0",
33
+ "@fortawesome/pro-regular-svg-icons": "^6.0.0",
34
+ "@fortawesome/pro-solid-svg-icons": "^6.3.0",
35
+ "@fortawesome/react-fontawesome": "^0.2.0",
36
+ "@lingui/core": "3.17.2",
37
+ "@lingui/react": "3.17.2",
38
+ "@popperjs/core": "^2.11.8",
39
+ "@storybook/addon-controls": "^8.1.1",
40
+ "@storybook/addon-designs": "^8.0.2",
41
+ "@storybook/addon-essentials": "^8.1.1",
42
+ "@storybook/addon-interactions": "^8.1.1",
43
+ "@storybook/addon-links": "^8.1.1",
44
+ "@storybook/blocks": "^8.1.1",
45
+ "@storybook/react": "^8.1.1",
46
+ "@storybook/react-webpack5": "^8.1.1",
47
+ "@storybook/test": "^8.1.1",
48
+ "@svgr/rollup": "^8.0.1",
49
+ "@trivago/prettier-plugin-sort-imports": "^4.3.0",
50
+ "@types/faker": "^4.1.11",
51
+ "@types/luxon": "^3.4.2",
52
+ "@types/node": "^20.1.7",
53
+ "@types/react": "^18.2.6",
54
+ "@types/react-beautiful-dnd": "^13.1.2",
55
+ "@types/react-dom": "^18.2.4",
56
+ "@types/react-helmet": "^6.1.11",
57
+ "@types/react-router": "^5.1.20",
58
+ "@types/react-router-dom": "^5.3.3",
59
+ "@types/styled-components": "^5.1.26",
60
+ "@typescript-eslint/eslint-plugin": "^5.59.6",
61
+ "@typescript-eslint/parser": "^5.59.6",
62
+ "@vitejs/plugin-react": "^4.2.1",
63
+ "@xstyled/styled-components": "^3.8.0",
64
+ "babel-loader": "^9.1.3",
65
+ "babel-plugin-macros": "^3.1.0",
66
+ "babel-plugin-named-exports-order": "^0.0.2",
67
+ "chromatic": "^11.3.5",
68
+ "eslint": "^8.41.0",
69
+ "eslint-config-prettier": "^8.8.0",
70
+ "eslint-config-standard-with-typescript": "^34.0.1",
71
+ "eslint-plugin-import": "^2.29.1",
72
+ "eslint-plugin-n": "^17.9.0",
73
+ "eslint-plugin-prettier": "^4.2.1",
74
+ "eslint-plugin-promise": "^6.6.0",
75
+ "eslint-plugin-react": "^7.35.0",
76
+ "eslint-plugin-react-hooks": "^4.6.2",
77
+ "eslint-plugin-react-perf": "^3.3.2",
78
+ "eslint-plugin-storybook": "^0.8.0",
79
+ "faker": "^5.1.0",
80
+ "immer": "9.0.7",
81
+ "lodash": "^4.17.21",
82
+ "luxon": "^3.4.4",
83
+ "moment": "^2.30.1",
84
+ "prettier": "2.8.8",
85
+ "react": "^18.2.0",
86
+ "react-beautiful-dnd": "^13.0.0",
87
+ "react-dom": "^18.2.0",
88
+ "react-helmet": "^6.1.0",
89
+ "react-image": "^4.1.0",
90
+ "react-onclickoutside": "^6.13.0",
91
+ "react-popper": "^2.3.0",
92
+ "react-redux": "*",
93
+ "react-router": "^5.1.2",
94
+ "react-router-dom": "^5.1.2",
95
+ "react-script": "^2.0.5",
96
+ "react-select": "^5.8.0",
97
+ "react-use-draggable-scroll": "^0.4.7",
98
+ "redux": ">=4.0.5",
99
+ "reselect": "5.0.0-alpha.2",
100
+ "storybook": "^8.1.1",
101
+ "string-width": "6.1.0",
102
+ "styled-components": "^5.3.10",
103
+ "swiper": "^11.0.3",
104
+ "tslib": "^2.6.2",
105
+ "typescript": "^5.0.4",
106
+ "vite": "^5.0.10",
107
+ "vite-plugin-dts": "^3.6.4",
108
+ "vite-plugin-static-copy": "^1.0.0",
109
+ "webpack": "^5.82.1"
110
+ },
111
+ "peerDependencies": {
112
+ "@fortawesome/fontawesome-svg-core": "^6.3.0",
113
+ "@fortawesome/free-brands-svg-icons": "^6.1.1",
114
+ "@fortawesome/pro-duotone-svg-icons": "^6.0.0",
115
+ "@fortawesome/pro-light-svg-icons": "^6.0.0",
116
+ "@fortawesome/pro-regular-svg-icons": "^6.0.0",
117
+ "@fortawesome/pro-solid-svg-icons": "^6.3.0",
118
+ "@fortawesome/react-fontawesome": "^0.2.0",
119
+ "@lingui/core": "3.17.2",
120
+ "@lingui/react": "3.17.2",
121
+ "@popperjs/core": "^2.11.8",
122
+ "@xstyled/styled-components": "^3.8.0",
123
+ "babel-plugin-macros": "^3.1.0",
124
+ "immer": "9.0.7",
125
+ "lodash": "^4.17.21",
126
+ "luxon": "^3.4.4",
127
+ "moment": "^2.30.1",
128
+ "react": "^18.2.0",
129
+ "react-beautiful-dnd": "^13.0.0",
130
+ "react-dom": "^18.2.0",
131
+ "react-helmet": "^6.1.0",
132
+ "react-image": "^4.1.0",
133
+ "react-onclickoutside": "^6.13.0",
134
+ "react-popper": "^2.3.0",
135
+ "react-redux": ">=4.0.5",
136
+ "react-router": "^5.1.2",
137
+ "react-router-dom": "^5.1.2",
138
+ "react-select": "^5.8.0",
139
+ "react-use-draggable-scroll": "^0.4.7",
140
+ "redux": ">=4.0.5",
141
+ "reselect": "5.0.0-alpha.2",
142
+ "styled-components": "^5.3.10",
143
+ "swiper": "^11.0.3",
144
+ "tslib": "^2.6.2",
145
+ "typescript": "^5.0.4"
146
+ },
147
+ "resolutions": {
148
+ "jackspeak": "2.1.1"
149
+ }
150
+ }
package/ui/Blocks/CommonGrid/types.d.ts CHANGED
@@ -303,6 +303,7 @@ export type GridProps = Omit<CommonGridProps, 'filters'> & {
303
303
  queryRowsParam?: number | string;
304
304
  customPaginationHandler?: (page: number, rows: number) => void;
305
305
  };
306
+ export type PageGridProps = Omit<GridProps, 'rowsData' | 'totalRowsCount' | 'columnsDefinitions' | 'actionColumnDefinition' | 'minColumnWidth' | 'columnLayout'>;
306
307
  export type Item = {
307
308
  title: string | JSX.Element;
308
309
  onClick: () => void;
package/ui/Blocks/Header/index.d.ts CHANGED
@@ -5,10 +5,8 @@ import type { User } from './types';
5
5
  type Props = {
6
6
  homeLink: string;
7
7
  isMobileMenuOpen?: boolean;
8
- logo?: Brand;
9
- logoVariant?: Variant;
10
- logoSrc?: string;
11
- logoSrcWidth?: string;
8
+ logo: Brand;
9
+ logoVariant: Variant;
12
10
  user?: User | null;
13
11
  currentLanguage?: string;
14
12
  hasUserMenu?: boolean;
package/ui/Blocks/Header/index.js CHANGED
@@ -9,7 +9,7 @@ import { useChangeLanguage } from './hooks/useChangeLanguage';
9
9
  import { languageItems } from './utils/languageItems';
10
10
  import { Container, LeftSide, RightSide, LanguageWrapper } from './styles';
11
11
  export var Header = function (_a) {
12
- var isMobileMenuOpen = _a.isMobileMenuOpen, homeLink = _a.homeLink, logo = _a.logo, logoVariant = _a.logoVariant, logoSrc = _a.logoSrc, logoSrcWidth = _a.logoSrcWidth, user = _a.user, currentLanguage = _a.currentLanguage, _b = _a.hasUserMenu, hasUserMenu = _b === void 0 ? false : _b, rightMenuItems = _a.rightMenuItems, onOpenMobileSideMenu = _a.onOpenMobileSideMenu, onChangeLanguage = _a.onChangeLanguage, onLogout = _a.onLogout;
12
+ var isMobileMenuOpen = _a.isMobileMenuOpen, homeLink = _a.homeLink, logo = _a.logo, logoVariant = _a.logoVariant, user = _a.user, currentLanguage = _a.currentLanguage, _b = _a.hasUserMenu, hasUserMenu = _b === void 0 ? false : _b, rightMenuItems = _a.rightMenuItems, onOpenMobileSideMenu = _a.onOpenMobileSideMenu, onChangeLanguage = _a.onChangeLanguage, onLogout = _a.onLogout;
13
13
  var handleChangeLanguage = useChangeLanguage({ onChangeLanguage: onChangeLanguage }).handleChangeLanguage;
14
- return (_jsxs(Container, { children: [_jsxs(LeftSide, { children: [_jsx(HamburgerMenuButton, { isLeftMenuOpen: isMobileMenuOpen, onClick: onOpenMobileSideMenu }), _jsx(Link, { to: homeLink, children: logoSrc ? _jsx("img", { src: logoSrc, alt: "logo", width: logoSrcWidth }) : _jsx(Logo, { brand: logo, variant: logoVariant, width: "145px" }) })] }), _jsxs(RightSide, { children: [Array.isArray(rightMenuItems) && (rightMenuItems === null || rightMenuItems === void 0 ? void 0 : rightMenuItems.length) > 0 && _jsx(MenuItems, { items: rightMenuItems }), _jsx(LanguageWrapper, { children: _jsx(LanguageSwitch, { languageItems: languageItems, onLanguageChange: handleChangeLanguage, activeLanguage: currentLanguage }) }), hasUserMenu && _jsx(UserMenu, { user: user, onLogout: onLogout })] })] }));
14
+ return (_jsxs(Container, { children: [_jsxs(LeftSide, { children: [_jsx(HamburgerMenuButton, { isLeftMenuOpen: isMobileMenuOpen, onClick: onOpenMobileSideMenu }), _jsx(Link, { to: homeLink, children: _jsx(Logo, { brand: logo, variant: logoVariant, width: "145px" }) })] }), _jsxs(RightSide, { children: [Array.isArray(rightMenuItems) && (rightMenuItems === null || rightMenuItems === void 0 ? void 0 : rightMenuItems.length) > 0 && _jsx(MenuItems, { items: rightMenuItems }), _jsx(LanguageWrapper, { children: _jsx(LanguageSwitch, { languageItems: languageItems, onLanguageChange: handleChangeLanguage, activeLanguage: currentLanguage }) }), hasUserMenu && _jsx(UserMenu, { user: user, onLogout: onLogout })] })] }));
15
15
  };
package/ui/Blocks/Header/stories/Header.stories.d.ts CHANGED
@@ -4,10 +4,8 @@ declare const meta: {
4
4
  component: import("react").FC<{
5
5
  homeLink: string;
6
6
  isMobileMenuOpen?: boolean | undefined;
7
- logo?: import("../../..").Brand | undefined;
8
- logoVariant?: import("../../..").Variant | undefined;
9
- logoSrc?: string | undefined;
10
- logoSrcWidth?: string | undefined;
7
+ logo: import("../../..").Brand;
8
+ logoVariant: import("../../..").Variant;
11
9
  user?: import("../types").User | null | undefined;
12
10
  currentLanguage?: string | undefined;
13
11
  hasUserMenu?: boolean | undefined;
@@ -24,5 +22,4 @@ export declare const HeaderBasic: () => JSX.Element;
24
22
  export declare const HeaderWithUser: () => JSX.Element;
25
23
  export declare const HeaderWithRightLinks: () => JSX.Element;
26
24
  export declare const HeaderWithLanguageSwitch: () => JSX.Element;
27
- export declare const HeaderWithCustomLogo: () => JSX.Element;
28
25
  export declare const HeaderWithAllItems: () => JSX.Element;
package/ui/Blocks/Header/stories/Header.stories.js CHANGED
@@ -35,7 +35,6 @@ export var HeaderBasic = function () { return (_jsx(LinguiContainer, { children:
35
35
  export var HeaderWithUser = function () { return (_jsx(LinguiContainer, { children: _jsx(Header, { homeLink: "/", logo: "mailstep", logoVariant: "black", hasUserMenu: true, user: user }) })); };
36
36
  export var HeaderWithRightLinks = function () { return (_jsx(LinguiContainer, { children: _jsx(Header, { homeLink: "/", logo: "mailstep", logoVariant: "black", rightMenuItems: menuItems }) })); };
37
37
  export var HeaderWithLanguageSwitch = function () { return (_jsx(LinguiContainer, { children: _jsx(Header, { homeLink: "/", logo: "mailstep", logoVariant: "black", currentLanguage: "cs" }) })); };
38
- export var HeaderWithCustomLogo = function () { return (_jsx(LinguiContainer, { children: _jsx(Header, { homeLink: "//google.com", logoSrc: "https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png", logoSrcWidth: "100px" }) })); };
39
38
  export var HeaderWithAllItems = function () {
40
39
  var _a = useState(false), isMobileMenuOpen = _a[0], setIsMobileMenuOpen = _a[1];
41
40
  return (_jsx(LinguiContainer, { children: _jsx(Header, { homeLink: "/", logo: "mailstep", logoVariant: "black", currentLanguage: "cs", rightMenuItems: menuItems, hasUserMenu: true, user: user, isMobileMenuOpen: isMobileMenuOpen, onOpenMobileSideMenu: function () { return setIsMobileMenuOpen(function (state) { return !state; }); } }) }));
package/ui/Blocks/LoginPage/LoginPage.js CHANGED
@@ -6,7 +6,7 @@ import { SocialLinks } from './components/SocialLinks';
6
6
  import { EMAIL_ADDRESS } from './utils/links';
7
7
  import { Trans } from '@lingui/react';
8
8
  import { x } from '@xstyled/styled-components';
9
- import { Wrapper, MailTo, LanguageBox, LogoWrapper, MainLogo, CardBodyWithLanguage, Version } from './styles';
9
+ import { Wrapper, MailTo, LanguageBox, LogoWrapper, MainLogo, Version, CardBodyWithLanguage } from './styles';
10
10
  var Login = function (_a) {
11
11
  var onSubmit = _a.onSubmit, activeLanguage = _a.activeLanguage, onLanguageChange = _a.onLanguageChange, children = _a.children, brand = _a.brand, brandVariant = _a.brandVariant, isSubmitting = _a.isSubmitting, isSubmitDisabled = _a.isSubmitDisabled, withDistributionCenterSelect = _a.withDistributionCenterSelect, distributionCenterOptions = _a.distributionCenterOptions, selectedDistributionCenter = _a.selectedDistributionCenter, onChangeDistributionCenter = _a.onChangeDistributionCenter, languageItems = _a.languageItems, version = _a.version, backgroundImage = _a.backgroundImage, _b = _a.hasSupport, hasSupport = _b === void 0 ? true : _b, _c = _a.hasSocialLinks, hasSocialLinks = _c === void 0 ? true : _c;
12
12
  return (_jsxs(Wrapper, { backgroundImage: backgroundImage, children: [_jsxs(CardBodyWithLanguage, { children: [_jsx(LogoWrapper, { children: _jsx(MainLogo, { brand: brand, variant: brandVariant }) }), _jsxs(LanguageBox, { children: [hasSupport && (_jsxs(x.div, { mr: 4, children: [_jsx(H6, { color: "gray1", variant: "bold", mt: "8px", mb: "8px", as: "h6", children: _jsx(Trans, { id: "form.heading.support", message: "Support:" }) }), _jsx(MailTo, { href: "mailto:mailstep@mailstep.cz", children: EMAIL_ADDRESS })] })), _jsx(LanguageSwitch, { activeLanguage: activeLanguage, onLanguageChange: onLanguageChange, languageItems: languageItems })] }), _jsx(LoginForm, { onSubmit: onSubmit, isSubmitDisabled: isSubmitDisabled, isSubmitting: isSubmitting, onChangeDistributionCenter: onChangeDistributionCenter, withDistributionCenterSelect: withDistributionCenterSelect, distributionCenterOptions: distributionCenterOptions, selectedDistributionCenter: selectedDistributionCenter })] }), children, version && _jsx(Version, { children: version }), hasSocialLinks && _jsx(SocialLinks, {})] }));
package/ui/Blocks/LoginPage/styles.d.ts CHANGED
@@ -3,7 +3,7 @@ export declare const Wrapper: import("styled-components").StyledComponent<"div",
3
3
  backgroundImage?: "mailship" | undefined;
4
4
  }, never>;
5
5
  export declare const LanguageBox: import("styled-components").StyledComponent<"div", import("@xstyled/system").Theme, {}, never>;
6
- export declare const CardBodyWithLanguage: import("styled-components").StyledComponent<({ children, ...rest }: import("../../Elements/Card/types").PropsBody) => JSX.Element, import("@xstyled/system").Theme, {}, never>;
6
+ export declare const CardBodyWithLanguage: import("styled-components").StyledComponent<"div", import("@xstyled/system").Theme, {}, never>;
7
7
  export declare const MailTo: import("styled-components").StyledComponent<"a", import("@xstyled/system").Theme, {}, never>;
8
8
  export declare const LogoWrapper: import("styled-components").StyledComponent<"div", import("@xstyled/system").Theme, {}, never>;
9
9
  export declare const MainLogo: import("styled-components").StyledComponent<({ brand, variant, size, width, height, ...rest }: import("../../Elements/Logo/types").LogoProps) => JSX.Element | null, import("@xstyled/system").Theme, {}, never>;
package/ui/Blocks/LoginPage/styles.js CHANGED
@@ -2,7 +2,6 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cook
2
2
  if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
3
3
  return cooked;
4
4
  };
5
- import { CardBody } from '../../Elements/Card/Card';
6
5
  import Logo from '../../Elements/Logo/Logo';
7
6
  import mailship from './assets/mailship.jpg';
8
7
  import styled, { th } from '@xstyled/styled-components';
@@ -14,7 +13,7 @@ export var Wrapper = styled.div(templateObject_1 || (templateObject_1 = __makeTe
14
13
  return "transparent ".concat(backgroundImage && "url(".concat(backgroundImageMap[backgroundImage], ")"), " 50% 0% no-repeat padding-box;");
15
14
  });
16
15
  export var LanguageBox = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n display: flex;\n margin: 15px 0;\n align-items: flex-end;\n justify-content: space-between;\n @media (min-width: 1024px) {\n justify-content: flex-end;\n margin: 40px 0;\n }\n"], ["\n display: flex;\n margin: 15px 0;\n align-items: flex-end;\n justify-content: space-between;\n @media (min-width: 1024px) {\n justify-content: flex-end;\n margin: 40px 0;\n }\n"])));
17
- export var CardBodyWithLanguage = styled(CardBody)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: flex;\n justify-content: start;\n padding: 0 32px 10px 32px;\n flex-grow: 1;\n margin: auto;\n width: 500px;\n @media (min-width: 1024px) {\n display: block;\n flex-grow: 0;\n }\n"], ["\n display: flex;\n justify-content: start;\n padding: 0 32px 10px 32px;\n flex-grow: 1;\n margin: auto;\n width: 500px;\n @media (min-width: 1024px) {\n display: block;\n flex-grow: 0;\n }\n"])));
16
+ export var CardBodyWithLanguage = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: flex;\n justify-content: start;\n padding: 0 32px 10px 32px;\n flex-grow: 1;\n margin: auto;\n width: 500px;\n @media (min-width: 1024px) {\n display: block;\n flex-grow: 0;\n }\n"], ["\n display: flex;\n justify-content: start;\n padding: 0 32px 10px 32px;\n flex-grow: 1;\n margin: auto;\n width: 500px;\n @media (min-width: 1024px) {\n display: block;\n flex-grow: 0;\n }\n"])));
18
17
  export var MailTo = styled.a(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n color: ", ";\n &:hover {\n color: ", ";\n }\n"], ["\n color: ", ";\n &:hover {\n color: ", ";\n }\n"])), th.color('typoPrimary'), th.color('red1'));
19
18
  export var LogoWrapper = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n display: flex;\n justify-content: center;\n margin-top: 30px;\n @media (min-width: 1024px) {\n display: block;\n margin-top: 0;\n }\n"], ["\n display: flex;\n justify-content: center;\n margin-top: 30px;\n @media (min-width: 1024px) {\n display: block;\n margin-top: 0;\n }\n"])));
20
19
  export var MainLogo = styled(Logo)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n width: 50%;\n height: auto;\n"], ["\n width: 50%;\n height: auto;\n"])));
package/ui/Elements/Card/Card.d.ts CHANGED
@@ -1,6 +1,4 @@
1
- import { CardComponentProps, CardProps, PropsBody, PropsCardImage } from './types';
2
- export declare const Card: ({ children, block, hasBorder, backgroundColor, ...rest }: CardProps) => JSX.Element;
3
- export declare const CardBody: ({ children, ...rest }: PropsBody) => JSX.Element;
4
- export declare const CardImage: ({ children, color, ...rest }: PropsCardImage) => JSX.Element;
5
- declare const CardComponent: ({ img, body, children, color }: CardComponentProps) => import("react/jsx-runtime").JSX.Element;
6
- export default CardComponent;
1
+ import { FC } from 'react';
2
+ import { CardProps } from './types';
3
+ declare const Card: FC<CardProps>;
4
+ export default Card;