allaw-ui 0.1.39 → 0.1.42

package/dist/components/atoms/buttons/IconButton.d.ts

@@ -4,6 +4,7 @@ import "../../../styles/global.css";
 export interface IconButtonProps {
     style: "smallFilled" | "largeFilled" | "mediumOutline" | "iconOnly";
     iconName: string;
+    color?: string;
     onClick?: () => void;
 }
 declare const IconButton: React.FC<IconButtonProps>;

package/dist/components/atoms/buttons/IconButton.js

@@ -2,8 +2,8 @@ import React from "react";
 import "./IconButton.css";
 import "../../../styles/global.css";
 var IconButton = function (_a) {
-    var style = _a.style, iconName = _a.iconName, onClick = _a.onClick;
-    return (React.createElement("button", { className: "icon-button ".concat(style), onClick: onClick },
+    var style = _a.style, iconName = _a.iconName, _b = _a.color, color = _b === void 0 ? "var(--secondary-light-grey, #f4f7fb)" : _b, onClick = _a.onClick;
+    return (React.createElement("button", { className: "icon-button ".concat(style), onClick: onClick, style: { backgroundColor: color } },
         React.createElement("i", { className: "icon ".concat(iconName) })));
 };
 IconButton.defaultProps = {

package/dist/components/molecules/caseLinkCard/CaseLinkCard.css

@@ -0,0 +1,54 @@
+@import "../../../styles/colors.css";
+
+.case-card-link {
+    display: flex;
+
+    align-items: flex-start;
+    align-self: stretch;
+    border-radius: 8px;
+    background: var(--Primary-Light-grey, #F4F7FB);
+    display: flex;
+    padding: 16px;
+    align-items: center;
+    gap: 16px;
+}
+
+.case-card-link-right {
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-end;
+    align-items: flex-start;
+    flex: 1 0 0;
+}
+
+.case-card-link-folder-icon {
+    border-radius: 8px;
+    background: rgba(255, 255, 255, 0.90);
+    display: flex;
+    padding: 12px 14px;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    align-self: stretch;
+}
+
+.case-card-link-info-row {
+    display: flex;
+    width: 100%;
+    flex-direction: row;
+    justify-content: space-between;
+}
+
+.case-card-link-info-row-bottom {
+    display: flex;
+    width: 100%;
+    flex-direction: row;
+    justify-content: space-between;
+    align-items: end;
+}
+
+.case-card-link-info-col {
+    display: flex;
+    flex-direction:column;
+    justify-content: space-between;
+}

package/dist/components/molecules/caseLinkCard/CaseLinkCard.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import "./CaseLinkCard.css";
+export type CaseLinkCardProps = {
+    proName: string;
+    caseName: string;
+    createdDate: Date;
+    onCaseCardClick?: () => any;
+};
+declare function CaseLinkCard({ proName, caseName, createdDate, onCaseCardClick }: CaseLinkCardProps): React.JSX.Element;
+export default CaseLinkCard;

package/dist/components/molecules/caseLinkCard/CaseLinkCard.js

@@ -0,0 +1,29 @@
+import React from "react";
+import "./CaseLinkCard.css";
+import { Paragraph, SmallTitle } from "../../atoms/typography";
+function CaseLinkCard(_a) {
+    var proName = _a.proName, caseName = _a.caseName, createdDate = _a.createdDate, onCaseCardClick = _a.onCaseCardClick;
+    var formatDate = function (date) {
+        return date.toLocaleDateString("fr-FR", {
+            day: "2-digit",
+            month: "2-digit",
+            year: "2-digit",
+        });
+    };
+    var formatProName = function (name) {
+        return "Ma\u00EEtre ".concat(name).toUpperCase();
+    };
+    return React.createElement("div", { className: "case-card-link", onClick: function () { return onCaseCardClick && onCaseCardClick(); }, style: { cursor: onCaseCardClick ? "pointer" : "default" } },
+        React.createElement("div", { className: "case-card-link-folder-icon" },
+            React.createElement("i", { className: "allaw-icon-folder", style: { fontSize: "20px" } })),
+        React.createElement("div", { className: "case-card-link-right" },
+            React.createElement("div", { className: "case-card-link-info-row" },
+                React.createElement(SmallTitle, { text: "DOSSIER", variant: "semiBold12", color: "dark-grey" }),
+                React.createElement(SmallTitle, { text: "Cr\u00E9\u00E9 le ".concat(formatDate(createdDate)), variant: "semiBold12", color: "dark-grey" })),
+            React.createElement("div", { className: "case-card-link-info-row-bottom" },
+                React.createElement("div", { className: "case-card-link-info-col" },
+                    React.createElement(Paragraph, { variant: "bold", size: "default", text: caseName, maxLines: 1 }),
+                    React.createElement(SmallTitle, { variant: "medium12", color: "mid-grey", text: formatProName(proName) })),
+                React.createElement("i", { className: "allaw-icon-arrow-right" }))));
+}
+export default CaseLinkCard;

package/dist/components/molecules/caseLinkCard/index.d.ts

@@ -0,0 +1,2 @@
+export { default as CaseCardLink } from "./CaseLinkCard";
+export type { CaseLinkCardProps } from "./CaseLinkCard";

package/dist/components/molecules/caseLinkCard/index.js

@@ -0,0 +1 @@
+export { default as CaseCardLink } from "./CaseLinkCard";

package/dist/components/molecules/clientLinkCard/ClientLinkCard.css

@@ -0,0 +1,39 @@
+@import "../../../styles/colors.css";
+
+.client-link-card {
+    width: 100%;
+    display: flex;
+    padding: 16px;
+    justify-content: space-between;
+    align-items: center;
+    border-radius: 16px;
+    border: 1px solid var(--Primary-Gris-de-fond, #E6EDF5);
+    background: var(--Primary-Blanc, #FFF);
+}
+.client-link-card-left {
+
+    display: flex;
+    flex-direction: column;
+    align-items: start;
+    justify-content: space-between;
+    gap: 8px;
+
+}
+.client-link-card-right {
+       display: flex;
+    flex-direction: column;
+    align-items: flex-end;
+    justify-content: center;
+    gap: 8px;
+
+}
+
+.client-link-card-office-tag {
+    font-size: 14px;
+    font-family: "Open Sans", sans-serif;
+    font-weight: 600;
+    padding: 8px 10px;
+    border-radius: 8px;
+    background-color: var(--Tags-Blanc-tag, #EEF5FC);
+    color: var(--Primary-Mid-black, #171E25);
+}

package/dist/components/molecules/clientLinkCard/ClientLinkCard.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+import "./ClientLinkCard.css";
+import "../../../styles/icons.css";
+export type ClientLinkCardProps = {
+    clientFirstName: string;
+    clientName: string;
+    clientMail: string;
+    company?: string;
+    onClientCardClick?: () => any;
+};
+declare function ClientLinkCard({ clientFirstName, clientName, clientMail, company, onClientCardClick }: ClientLinkCardProps): React.JSX.Element;
+export default ClientLinkCard;

package/dist/components/molecules/clientLinkCard/ClientLinkCard.js

@@ -0,0 +1,15 @@
+import React from "react";
+import { Paragraph, SmallTitle } from "../../atoms/typography";
+import "./ClientLinkCard.css";
+import "../../../styles/icons.css";
+function ClientLinkCard(_a) {
+    var clientFirstName = _a.clientFirstName, clientName = _a.clientName, clientMail = _a.clientMail, company = _a.company, onClientCardClick = _a.onClientCardClick;
+    return React.createElement("div", { className: "client-link-card", style: { cursor: onClientCardClick ? "pointer" : "default" }, onClick: function () { return onClientCardClick && onClientCardClick(); } },
+        React.createElement("div", { className: "client-link-card-left" },
+            React.createElement(Paragraph, { variant: "semiBold", text: "".concat(clientFirstName, " ").concat(clientName === null || clientName === void 0 ? void 0 : clientName.toUpperCase()), size: "default", maxLines: 1, color: "noir" }),
+            React.createElement(SmallTitle, { variant: "medium12", color: "mid-grey", text: clientMail === null || clientMail === void 0 ? void 0 : clientMail.toLowerCase() })),
+        React.createElement("div", { className: "client-link-card-right" },
+            company && React.createElement("span", { className: "client-link-card-office-tag" }, company),
+            React.createElement("i", { className: "allaw-icon-arrow-right" })));
+}
+export default ClientLinkCard;

package/dist/components/molecules/clientLinkCard/index.d.ts

@@ -0,0 +1,2 @@
+export { default as ClientLinkCard } from "./ClientLinkCard";
+export type { ClientLinkCardProps } from "./ClientLinkCard";

package/dist/components/molecules/clientLinkCard/index.js

@@ -0,0 +1 @@
+export { default as ClientLinkCard } from "./ClientLinkCard";

package/dist/index.d.ts

@@ -35,6 +35,8 @@ export { default as Strokes } from "./components/atoms/uiVariables/Strokes";
 export { default as AppointmentSlot } from "./components/molecules/appointmentSlot/AppointmentSlot";
 export { default as CaseCard } from "./components/molecules/caseCard/CaseCard";
 export { default as ContactCard } from "./components/molecules/contactCard/ContactCard";
+export { default as CaseCardLink } from "./components/molecules/caseLinkCard/CaseLinkCard";
+export { default as ClientLinkCard } from "./components/molecules/clientLinkCard/ClientLinkCard";
 export { default as DocumentCard } from "./components/molecules/documentCard/DocumentCard";
 export { default as EmployeeCard } from "./components/molecules/employeeCard/EmployeeCard";
 export { default as Stepper } from "./components/molecules/stepper/Stepper";

package/dist/index.js

@@ -47,6 +47,10 @@ export { default as AppointmentSlot } from "./components/molecules/appointmentSl
 export { default as CaseCard } from "./components/molecules/caseCard/CaseCard";
 // Contact Card
 export { default as ContactCard } from "./components/molecules/contactCard/ContactCard";
+// Case Link Card 
+export { default as CaseCardLink } from "./components/molecules/caseLinkCard/CaseLinkCard";
+// Case Link Card 
+export { default as ClientLinkCard } from "./components/molecules/clientLinkCard/ClientLinkCard";
 // Document Card
 export { default as DocumentCard } from "./components/molecules/documentCard/DocumentCard";
 // Employee Card

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "allaw-ui",
-  "version": "0.1.39",
+  "version": "0.1.42",
   "description": "Composants UI pour l'application Allaw",
   "main": "dist/index.js",
   "module": "dist/index.esm.js",