poc-react-shared-components 1.0.1 → 1.0.4
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.
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
.card {
|
|
2
|
+
display: flex;
|
|
3
|
+
border: solid 1px;
|
|
4
|
+
width: 70%;
|
|
5
|
+
padding: 10px;
|
|
6
|
+
margin: 10px auto;
|
|
7
|
+
}
|
|
8
|
+
button {
|
|
9
|
+
margin: 0px 20px;
|
|
10
|
+
background: limegreen;
|
|
11
|
+
border: none;
|
|
12
|
+
border-radius: 4px;
|
|
13
|
+
padding: 5px 10px;
|
|
14
|
+
color: #ffff;
|
|
15
|
+
font-weight: 600;
|
|
16
|
+
height: 30px;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
.card p {
|
|
20
|
+
flex: 1;
|
|
21
|
+
text-align: start;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
@media (width < 770px) {
|
|
25
|
+
.card {
|
|
26
|
+
display: block;
|
|
27
|
+
}
|
|
28
|
+
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import './employeeCard';
|
|
1
|
+
import './employeeCard.css';
|
|
2
2
|
type Employee = {
|
|
3
3
|
id: number;
|
|
4
4
|
name: string;
|
|
@@ -8,6 +8,7 @@ type Props = {
|
|
|
8
8
|
employee: Employee;
|
|
9
9
|
onEdit?: (employee: Employee) => void;
|
|
10
10
|
onDelete?: (id: number) => void;
|
|
11
|
+
cardClass: String;
|
|
11
12
|
};
|
|
12
|
-
declare function EmployeeCard({ employee, onEdit, onDelete }: Props): JSX.Element;
|
|
13
|
+
declare function EmployeeCard({ employee, onEdit, onDelete, cardClass }: Props): JSX.Element;
|
|
13
14
|
export default EmployeeCard;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import './employeeCard';
|
|
3
|
-
function EmployeeCard({ employee, onEdit, onDelete }) {
|
|
4
|
-
return (_jsxs("div", { className:
|
|
2
|
+
import './employeeCard.css';
|
|
3
|
+
function EmployeeCard({ employee, onEdit, onDelete, cardClass }) {
|
|
4
|
+
return (_jsxs("div", { className: `card ${cardClass}`, children: [_jsxs("p", { children: [_jsx("strong", { children: "Name:" }), " ", employee.name] }), _jsxs("p", { children: [_jsx("strong", { children: "Email:" }), " ", employee.email] }), _jsx("button", { onClick: () => onEdit === null || onEdit === void 0 ? void 0 : onEdit(employee), children: "Edit" }), _jsx("button", { style: { backgroundColor: "red" }, onClick: () => onDelete === null || onDelete === void 0 ? void 0 : onDelete(employee.id), children: "Delete" })] }));
|
|
5
5
|
}
|
|
6
6
|
export default EmployeeCard;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "poc-react-shared-components",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.4",
|
|
4
4
|
"description": "Reusable shared React components",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
@@ -8,7 +8,8 @@
|
|
|
8
8
|
"dist"
|
|
9
9
|
],
|
|
10
10
|
"scripts": {
|
|
11
|
-
"build": "tsc"
|
|
11
|
+
"build": "tsc && npm run copy-css",
|
|
12
|
+
"copy-css": "copyfiles -u 1 src/**/*.css dist/"
|
|
12
13
|
},
|
|
13
14
|
"keywords": [
|
|
14
15
|
"react",
|
|
@@ -23,8 +24,9 @@
|
|
|
23
24
|
"react-dom": "^18 || ^19"
|
|
24
25
|
},
|
|
25
26
|
"devDependencies": {
|
|
26
|
-
"typescript": "^5",
|
|
27
27
|
"@types/react": "^18 || ^19",
|
|
28
|
-
"@types/react-dom": "^18 || ^19"
|
|
28
|
+
"@types/react-dom": "^18 || ^19",
|
|
29
|
+
"copyfiles": "^2.4.1",
|
|
30
|
+
"typescript": "^5"
|
|
29
31
|
}
|
|
30
32
|
}
|