cortex-react-ui 0.1.1 → 0.1.2
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.
- package/lib/cjs/index.js +14 -32604
- package/lib/cjs/index.js.map +1 -1
- package/lib/cjs/types/DatePicker/DatePicker.d.ts +7 -0
- package/lib/cjs/types/DatePicker/index.d.ts +1 -0
- package/lib/cjs/types/Popper/Popper.d.ts +1 -0
- package/lib/cjs/types/Spinner/Spinner.d.ts +7 -0
- package/lib/cjs/types/Spinner/index.d.ts +1 -0
- package/lib/cjs/types/Tooltip/Tooltip.d.ts +1 -0
- package/lib/cjs/types/Transition/CSSTransition.d.ts +17 -0
- package/lib/cjs/types/Transition/Fade.d.ts +13 -0
- package/lib/cjs/types/utils/classNames.d.ts +1 -0
- package/lib/index.d.ts +1 -0
- package/lib/styles/Popper/index.scss +24 -0
- package/lib/styles/Spinner/index.scss +43 -0
- package/lib/styles/Tooltip/index.scss +24 -0
- package/lib/styles/Transition/index.scss +43 -0
- package/lib/styles/global.scss +22 -0
- package/lib/styles/index.scss +25 -0
- package/package.json +33 -25
- package/lib/esm/index.js +0 -32603
- package/lib/esm/index.js.map +0 -1
- package/lib/esm/types/Button/Button.d.ts +0 -6
- package/lib/esm/types/Button/index.d.ts +0 -1
- package/lib/esm/types/DomContainer/DomContainer.d.ts +0 -7
- package/lib/esm/types/DomContainer/index.d.ts +0 -1
- package/lib/esm/types/Popper/Popper.d.ts +0 -30
- package/lib/esm/types/Popper/index.d.ts +0 -1
- package/lib/esm/types/Tooltip/Tooltip.d.ts +0 -10
- package/lib/esm/types/Tooltip/index.d.ts +0 -1
- package/lib/esm/types/index.d.ts +0 -2
- package/lib/esm/types/utils/setRef.d.ts +0 -1
- package/lib/esm/types/utils/useForkRef.d.ts +0 -2
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default as DatePicker } from './DatePicker';
|
|
@@ -20,6 +20,7 @@ declare type Props = {
|
|
|
20
20
|
open?: boolean;
|
|
21
21
|
role?: string;
|
|
22
22
|
children?: React.ReactNode;
|
|
23
|
+
className?: string;
|
|
23
24
|
onMouseEnter?: React.MouseEventHandler<HTMLDivElement>;
|
|
24
25
|
onMouseLeave?: React.MouseEventHandler<HTMLDivElement>;
|
|
25
26
|
onMouseMove?: React.MouseEventHandler<HTMLDivElement>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default as Spinner } from './Spinner';
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
declare type Props = {
|
|
3
|
+
trigger: boolean;
|
|
4
|
+
mode: 'appear' | 'disappear';
|
|
5
|
+
children?: React.ReactElement<any>;
|
|
6
|
+
enterTimeout?: number;
|
|
7
|
+
exitTimeout?: number;
|
|
8
|
+
className?: string;
|
|
9
|
+
onEnter?: () => void;
|
|
10
|
+
onEntering?: () => void;
|
|
11
|
+
onEntered?: () => void;
|
|
12
|
+
onExit?: () => void;
|
|
13
|
+
onExiting?: () => void;
|
|
14
|
+
onExited?: () => void;
|
|
15
|
+
};
|
|
16
|
+
declare const CSSTransition: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLElement>>;
|
|
17
|
+
export default CSSTransition;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
declare type Props = {
|
|
3
|
+
trigger: boolean;
|
|
4
|
+
children?: React.ReactElement<any>;
|
|
5
|
+
onEnter?: () => void;
|
|
6
|
+
onEntering?: () => void;
|
|
7
|
+
onEntered?: () => void;
|
|
8
|
+
onExit?: () => void;
|
|
9
|
+
onExiting?: () => void;
|
|
10
|
+
onExited?: () => void;
|
|
11
|
+
};
|
|
12
|
+
declare const Fade: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLElement>>;
|
|
13
|
+
export default Fade;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export default function classNames(...values: any[]): string;
|
package/lib/index.d.ts
CHANGED
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
@import "../global.scss";
|
|
2
|
+
|
|
3
|
+
@mixin popper($props: null, $options: null) {
|
|
4
|
+
$internal-options: $default-options;
|
|
5
|
+
|
|
6
|
+
$internal-props: (
|
|
7
|
+
bgColor: #212121,
|
|
8
|
+
fgColor: #fff,
|
|
9
|
+
);
|
|
10
|
+
|
|
11
|
+
$internal-props: safe-map-merge($internal-props, $props);
|
|
12
|
+
$internal-options: safe-map-merge($internal-options, $options);
|
|
13
|
+
|
|
14
|
+
// .ui-popper {
|
|
15
|
+
// @if get-map-deep($internal-options, "properties") == true {
|
|
16
|
+
// padding: 8px;
|
|
17
|
+
// border-radius: 4px;
|
|
18
|
+
// }
|
|
19
|
+
// @if get-map-deep($internal-options, "colors") == true {
|
|
20
|
+
// background-color: get-map-deep($internal-props, "bgColor");
|
|
21
|
+
// color: get-map-deep($internal-props, "fgColor");
|
|
22
|
+
// }
|
|
23
|
+
// }
|
|
24
|
+
}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
@import "../global.scss";
|
|
2
|
+
|
|
3
|
+
@mixin spinner($props: null, $options: null) {
|
|
4
|
+
$internal-options: $default-options;
|
|
5
|
+
|
|
6
|
+
$internal-props: (
|
|
7
|
+
color: blue,
|
|
8
|
+
);
|
|
9
|
+
|
|
10
|
+
$internal-props: safe-map-merge($internal-props, $props);
|
|
11
|
+
$internal-options: safe-map-merge($internal-options, $options);
|
|
12
|
+
|
|
13
|
+
@if get-map-deep($internal-options, "properties") == true {
|
|
14
|
+
@keyframes ui-spinner-anim {
|
|
15
|
+
to {
|
|
16
|
+
transform: rotate(360deg);
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
.ui-spinner {
|
|
22
|
+
@if get-map-deep($internal-options, "properties") == true {
|
|
23
|
+
display: inline-block;
|
|
24
|
+
width: 2rem;
|
|
25
|
+
height: 2rem;
|
|
26
|
+
vertical-align: text-bottom;
|
|
27
|
+
border: 0.25em solid;
|
|
28
|
+
border-right: 0.25em solid transparent;
|
|
29
|
+
border-radius: 50%;
|
|
30
|
+
text-indent: -9999em;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
@if get-map-deep($internal-options, "colors") == true {
|
|
34
|
+
border-left-color: get-map-deep($internal-props, "color");
|
|
35
|
+
border-top-color: get-map-deep($internal-props, "color");
|
|
36
|
+
border-bottom-color: get-map-deep($internal-props, "color");
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
.ui-spinner-indeterminate {
|
|
41
|
+
animation: ui-spinner-anim 0.75s linear infinite;
|
|
42
|
+
}
|
|
43
|
+
}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
@import "../global.scss";
|
|
2
|
+
|
|
3
|
+
@mixin tooltip($props: null, $options: null) {
|
|
4
|
+
$internal-options: $default-options;
|
|
5
|
+
|
|
6
|
+
$internal-props: (
|
|
7
|
+
bgColor: red,
|
|
8
|
+
fgColor: #fff,
|
|
9
|
+
);
|
|
10
|
+
|
|
11
|
+
$internal-props: safe-map-merge($internal-props, $props);
|
|
12
|
+
$internal-options: safe-map-merge($internal-options, $options);
|
|
13
|
+
|
|
14
|
+
.ui-tooltip-content {
|
|
15
|
+
@if get-map-deep($internal-options, "properties") == true {
|
|
16
|
+
padding: 8px;
|
|
17
|
+
border-radius: 4px;
|
|
18
|
+
}
|
|
19
|
+
@if get-map-deep($internal-options, "colors") == true {
|
|
20
|
+
background-color: get-map-deep($internal-props, "bgColor");
|
|
21
|
+
color: get-map-deep($internal-props, "fgColor");
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
@import "../global.scss";
|
|
2
|
+
|
|
3
|
+
@mixin spinner($props: null, $options: null) {
|
|
4
|
+
$internal-options: $default-options;
|
|
5
|
+
|
|
6
|
+
$internal-props: (
|
|
7
|
+
color: blue,
|
|
8
|
+
);
|
|
9
|
+
|
|
10
|
+
$internal-props: safe-map-merge($internal-props, $props);
|
|
11
|
+
$internal-options: safe-map-merge($internal-options, $options);
|
|
12
|
+
|
|
13
|
+
@if get-map-deep($internal-options, "properties") == true {
|
|
14
|
+
@keyframes ui-spinner-anim {
|
|
15
|
+
to {
|
|
16
|
+
transform: rotate(360deg);
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
.ui-spinner {
|
|
22
|
+
@if get-map-deep($internal-options, "properties") == true {
|
|
23
|
+
display: inline-block;
|
|
24
|
+
width: 2rem;
|
|
25
|
+
height: 2rem;
|
|
26
|
+
vertical-align: text-bottom;
|
|
27
|
+
border: 0.25em solid;
|
|
28
|
+
border-right: 0.25em solid transparent;
|
|
29
|
+
border-radius: 50%;
|
|
30
|
+
text-indent: -9999em;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
@if get-map-deep($internal-options, "colors") == true {
|
|
34
|
+
border-left-color: get-map-deep($internal-props, "color");
|
|
35
|
+
border-top-color: get-map-deep($internal-props, "color");
|
|
36
|
+
border-bottom-color: get-map-deep($internal-props, "color");
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
.ui-spinner-indeterminate {
|
|
41
|
+
animation: ui-spinner-anim 0.75s linear infinite;
|
|
42
|
+
}
|
|
43
|
+
}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
$default-options: (
|
|
2
|
+
properties: true,
|
|
3
|
+
colors: true,
|
|
4
|
+
);
|
|
5
|
+
|
|
6
|
+
@function get-map-deep($map, $keys...) {
|
|
7
|
+
@each $key in $keys {
|
|
8
|
+
$map: map-get($map, $key);
|
|
9
|
+
}
|
|
10
|
+
@return $map;
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
@function is-map($map) {
|
|
14
|
+
@return type-of($map) == "map";
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
@function safe-map-merge($map, $map2) {
|
|
18
|
+
@if is-map($map) == true and is-map($map2) == true {
|
|
19
|
+
@return map-merge($map, $map2);
|
|
20
|
+
}
|
|
21
|
+
@return $map;
|
|
22
|
+
}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
@import "Popper";
|
|
2
|
+
@import "Tooltip";
|
|
3
|
+
@import "Spinner";
|
|
4
|
+
@import "Transition";
|
|
5
|
+
|
|
6
|
+
@include popper();
|
|
7
|
+
@include tooltip();
|
|
8
|
+
@include spinner();
|
|
9
|
+
|
|
10
|
+
// @include popper();
|
|
11
|
+
// @include popper(
|
|
12
|
+
// (
|
|
13
|
+
// bgColor: red,
|
|
14
|
+
// fgColor: blue,
|
|
15
|
+
// )
|
|
16
|
+
// );
|
|
17
|
+
// @include popper(
|
|
18
|
+
// (
|
|
19
|
+
// bgColor: red,
|
|
20
|
+
// fgColor: blue,
|
|
21
|
+
// ),
|
|
22
|
+
// (
|
|
23
|
+
// properties: false
|
|
24
|
+
// )
|
|
25
|
+
// );
|
package/package.json
CHANGED
|
@@ -1,11 +1,14 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "cortex-react-ui",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.2",
|
|
4
4
|
"description": "React UI",
|
|
5
5
|
"author": "Anthony",
|
|
6
6
|
"license": "MIT",
|
|
7
7
|
"main": "lib/cjs/index.js",
|
|
8
8
|
"module": "lib/esm/index.js",
|
|
9
|
+
"publishConfig": {
|
|
10
|
+
"access": "public"
|
|
11
|
+
},
|
|
9
12
|
"files": [
|
|
10
13
|
"lib"
|
|
11
14
|
],
|
|
@@ -13,28 +16,12 @@
|
|
|
13
16
|
"scripts": {
|
|
14
17
|
"start": "yarn storybook",
|
|
15
18
|
"build": "rm -rf ./lib && yarn rollup",
|
|
16
|
-
"test": "
|
|
17
|
-
"eject": "react-scripts eject",
|
|
19
|
+
"test": "",
|
|
18
20
|
"prepare": "yarn build",
|
|
19
21
|
"storybook": "start-storybook -p 6006 -s public",
|
|
20
22
|
"build-storybook": "build-storybook -s public",
|
|
21
23
|
"rollup": "rollup -c"
|
|
22
24
|
},
|
|
23
|
-
"dependencies": {
|
|
24
|
-
"@dateam/ark": "^0.2.19",
|
|
25
|
-
"@testing-library/jest-dom": "^5.11.4",
|
|
26
|
-
"@testing-library/react": "^11.1.0",
|
|
27
|
-
"@testing-library/user-event": "^12.1.10",
|
|
28
|
-
"@types/jest": "^26.0.15",
|
|
29
|
-
"@types/node": "^12.0.0",
|
|
30
|
-
"@types/react": "^17.0.0",
|
|
31
|
-
"@types/react-dom": "^17.0.0",
|
|
32
|
-
"react": "^17.0.2",
|
|
33
|
-
"react-dom": "^17.0.2",
|
|
34
|
-
"react-scripts": "4.0.3",
|
|
35
|
-
"typescript": "^4.1.2",
|
|
36
|
-
"web-vitals": "^1.0.1"
|
|
37
|
-
},
|
|
38
25
|
"eslintConfig": {
|
|
39
26
|
"extends": [
|
|
40
27
|
"react-app",
|
|
@@ -63,27 +50,48 @@
|
|
|
63
50
|
"last 1 safari version"
|
|
64
51
|
]
|
|
65
52
|
},
|
|
53
|
+
"dependencies": {},
|
|
54
|
+
"peerDependencies": {
|
|
55
|
+
"@dateam/ark": "^0.2.19",
|
|
56
|
+
"react": "^17.0.2",
|
|
57
|
+
"react-dom": "^17.0.2"
|
|
58
|
+
},
|
|
66
59
|
"devDependencies": {
|
|
60
|
+
"@dateam/ark": "^0.2.19",
|
|
67
61
|
"@rollup/plugin-commonjs": "^21.0.1",
|
|
68
62
|
"@rollup/plugin-node-resolve": "^13.0.6",
|
|
69
63
|
"@rollup/plugin-typescript": "^8.3.0",
|
|
70
|
-
"@storybook/addon-actions": "^6.4.
|
|
71
|
-
"@storybook/addon-essentials": "^6.4.
|
|
72
|
-
"@storybook/addon-links": "^6.4.
|
|
73
|
-
"@storybook/node-logger": "^6.4.
|
|
64
|
+
"@storybook/addon-actions": "^6.4.9",
|
|
65
|
+
"@storybook/addon-essentials": "^6.4.9",
|
|
66
|
+
"@storybook/addon-links": "^6.4.9",
|
|
67
|
+
"@storybook/node-logger": "^6.4.9",
|
|
74
68
|
"@storybook/preset-create-react-app": "^3.2.0",
|
|
75
69
|
"@storybook/preset-scss": "^1.0.3",
|
|
76
|
-
"@storybook/react": "^6.4.
|
|
70
|
+
"@storybook/react": "^6.4.9",
|
|
71
|
+
"@testing-library/jest-dom": "^5.11.4",
|
|
72
|
+
"@testing-library/react": "^11.1.0",
|
|
73
|
+
"@testing-library/user-event": "^12.1.10",
|
|
74
|
+
"@types/jest": "^26.0.15",
|
|
75
|
+
"@types/node": "^12.0.0",
|
|
76
|
+
"@types/react": "^17.0.0",
|
|
77
|
+
"@types/react-dom": "^17.0.0",
|
|
77
78
|
"css-loader": "5.2.6",
|
|
78
79
|
"eslint-config-airbnb": "^18.2.1",
|
|
79
80
|
"eslint-plugin-import": "^2.25.2",
|
|
80
81
|
"eslint-plugin-json": "^3.1.0",
|
|
81
82
|
"eslint-plugin-jsx-a11y": "^6.4.1",
|
|
82
83
|
"eslint-plugin-react": "^7.26.1",
|
|
84
|
+
"react": "^17.0.2",
|
|
85
|
+
"react-dom": "^17.0.2",
|
|
86
|
+
"react-scripts": "^4.0.3",
|
|
83
87
|
"rollup": "^2.60.2",
|
|
88
|
+
"rollup-plugin-copy": "^3.4.0",
|
|
84
89
|
"rollup-plugin-dts": "^4.0.1",
|
|
90
|
+
"rollup-plugin-node-resolve": "^5.2.0",
|
|
91
|
+
"rollup-plugin-terser": "^7.0.2",
|
|
85
92
|
"sass": "^1.44.0",
|
|
86
93
|
"sass-loader": "10.1.1",
|
|
87
|
-
"style-loader": "2.0.0"
|
|
94
|
+
"style-loader": "2.0.0",
|
|
95
|
+
"typescript": "^4.1.2"
|
|
88
96
|
}
|
|
89
|
-
}
|
|
97
|
+
}
|