allaw-ui 1.0.36 → 1.0.38

package/dist/components/atoms/tags/OtherStatusTag.css

@@ -77,3 +77,30 @@
   justify-content: center;
   align-items: center;
 }
+
+/* Styles pour le mode compact */
+.other-status-tag.compact {
+  height: 22px;
+  padding: 6px 8px;
+  gap: 8px;
+  font-size: 12px;
+  min-height: 34px;
+}
+
+.other-status-tag.compact.editable {
+  height: 30px;
+  padding: 6px;
+}
+
+.other-status-tag.compact.information {
+  height: 22px;
+  padding: 6px;
+  font-size: 11px;
+}
+
+.other-status-tag.compact .icon {
+  width: 14px;
+  height: 14px;
+  padding: 2.833px;
+  font-size: 10px;
+}

package/dist/components/atoms/tags/OtherStatusTag.d.ts

@@ -6,6 +6,7 @@ export interface OtherStatusTagProps {
     startIcon?: boolean;
     startIconName?: string;
     labelLimit?: number;
+    style?: "normal" | "compact";
 }
 declare const OtherStatusTag: React.FC<OtherStatusTagProps>;
 export default OtherStatusTag;

package/dist/components/atoms/tags/OtherStatusTag.js

@@ -1,13 +1,13 @@
 import React from "react";
 import "./OtherStatusTag.css";
 var OtherStatusTag = function (_a) {
-    var _b = _a.label, label = _b === void 0 ? "Tags" : _b, _c = _a.type, type = _c === void 0 ? "readonly" : _c, _d = _a.startIcon, startIcon = _d === void 0 ? false : _d, _e = _a.startIconName, startIconName = _e === void 0 ? "allaw-icon-pmr" : _e, labelLimit = _a.labelLimit;
+    var _b = _a.label, label = _b === void 0 ? "Tags" : _b, _c = _a.type, type = _c === void 0 ? "readonly" : _c, _d = _a.startIcon, startIcon = _d === void 0 ? false : _d, _e = _a.startIconName, startIconName = _e === void 0 ? "allaw-icon-pmr" : _e, labelLimit = _a.labelLimit, _f = _a.style, style = _f === void 0 ? "normal" : _f;
     var truncateText = function (text, limit) {
         if (!limit || text.length <= limit)
             return text;
         return "".concat(text.slice(0, limit), "...");
     };
-    return (React.createElement("div", { className: "other-status-tag ".concat(type) },
+    return (React.createElement("div", { className: "other-status-tag ".concat(type, " ").concat(style) },
         type === "information" && startIcon && (React.createElement("span", { className: "icon ".concat(startIconName) })),
         React.createElement("span", { className: "other-status-tag-label", title: label }, truncateText(label, labelLimit)),
         type === "editable" && React.createElement("span", { className: "icon allaw-icon-close" })));

package/dist/components/molecules/appointmentSlot/AppointmentSlot.css

@@ -364,3 +364,42 @@
   align-items: center;
   gap: 8px;
 }
+
+/* Styles compacts */
+.appointment-slot.compact .appointment-time {
+  font-size: 14px;
+}
+
+.appointment-slot.compact .client-name {
+  font-size: 12px;
+}
+
+.appointment-slot.compact .appointment-content {
+  font-size: 14px;
+}
+
+.appointment-slot.compact .make-unavailable-text {
+  font-size: 12px;
+}
+
+.appointment-slot.compact .document-count,
+.appointment-slot.compact .note-count {
+  font-size: 12px;
+}
+
+/* Styles compacts pour le mode summary */
+.appointment-slot-summary.compact .summary-date {
+  font-size: 14px;
+}
+
+.appointment-slot-summary.compact .summary-time {
+  font-size: 14px;
+}
+
+.appointment-slot-summary.compact .appointment-content {
+  font-size: 14px;
+}
+
+.appointment-slot-summary.compact .client-name {
+  font-size: 12px;
+}

package/dist/components/molecules/appointmentSlot/AppointmentSlot.d.ts

@@ -20,6 +20,7 @@ export interface AppointmentSlotProps {
     };
     isEditable?: boolean;
     appointmentDetails?: string;
+    style?: "compact" | "big";
 }
 declare const AppointmentSlot: React.FC<AppointmentSlotProps>;
 export default AppointmentSlot;

package/dist/components/molecules/appointmentSlot/AppointmentSlot.js

@@ -5,8 +5,8 @@ import OtherStatusTag from "../../atoms/tags/OtherStatusTag";
 import ActionCircleButton from "../../atoms/buttons/ActionCircleButton";
 import IconButton from "../../atoms/buttons/IconButton";
 var AppointmentSlot = function (_a) {
-    var status = _a.status, startTime = _a.startTime, endTime = _a.endTime, date = _a.date, clientName = _a.clientName, appointmentContent = _a.appointmentContent, tags = _a.tags, noteCount = _a.noteCount, documentCount = _a.documentCount, actions = _a.actions;
-    var _b = useState(false), isActive = _b[0], setIsActive = _b[1];
+    var status = _a.status, startTime = _a.startTime, endTime = _a.endTime, date = _a.date, clientName = _a.clientName, appointmentContent = _a.appointmentContent, tags = _a.tags, noteCount = _a.noteCount, documentCount = _a.documentCount, actions = _a.actions, _b = _a.style, style = _b === void 0 ? "compact" : _b;
+    var _c = useState(false), isActive = _c[0], setIsActive = _c[1];
     // Handlers
     var handleApprove = useCallback(function () {
         var _a;
@@ -39,7 +39,7 @@ var AppointmentSlot = function (_a) {
     // Render functions
     var renderHeader = function () { return (React.createElement("div", { className: "appointment-header" },
         React.createElement("span", { className: "appointment-time" }, "".concat(startTime, " - ").concat(endTime)),
-        status !== "summary" && (React.createElement(AppointementStatusTag, { status: status })))); };
+        status !== "summary" && (React.createElement(AppointementStatusTag, { status: status, variant: style === "compact" ? "small" : "default" })))); };
     var renderFooter = function () {
         if (status === "available") {
             return renderAvailableFooter();
@@ -64,7 +64,7 @@ var AppointmentSlot = function (_a) {
             renderTags()),
         renderActionButtons())); };
     var renderTags = function () {
-        return tags && (React.createElement("div", { className: "tags-container" }, tags.map(function (tag, index) { return (React.createElement(OtherStatusTag, { key: index, label: tag })); })));
+        return tags && (React.createElement("div", { className: "tags-container" }, tags.map(function (tag, index) { return (React.createElement(OtherStatusTag, { key: index, label: tag, style: style === "compact" ? "compact" : "normal" })); })));
     };
     var renderActionButtons = function () {
         switch (status) {
@@ -72,21 +72,22 @@ var AppointmentSlot = function (_a) {
                 return (React.createElement("div", { className: "action-button-container" },
                     React.createElement(ActionCircleButton, { status: "dual", onApprove: handleApprove, onReject: handleReject })));
             case "confirmed":
-                return (React.createElement("div", { className: "document-actions" },
+                return documentCount && parseInt(documentCount) > 0 ? (React.createElement("div", { className: "document-actions" },
                     React.createElement(IconButton, { style: "smallFilled", iconName: "allaw-icon-document", onClick: actions === null || actions === void 0 ? void 0 : actions.onViewDocument }),
-                    documentCount && (React.createElement("span", { className: "document-count" }, documentCount))));
+                    React.createElement("span", { className: "document-count" }, documentCount))) : null;
             case "passed":
                 return (React.createElement("div", { className: "document-actions" },
                     React.createElement(IconButton, { style: "smallFilled", iconName: "allaw-icon-edit-2", onClick: actions === null || actions === void 0 ? void 0 : actions.onEdit }),
                     noteCount && React.createElement("span", { className: "note-count" }, noteCount),
-                    React.createElement(IconButton, { style: "smallFilled", iconName: "allaw-icon-document", onClick: actions === null || actions === void 0 ? void 0 : actions.onViewDocument }),
-                    documentCount && (React.createElement("span", { className: "document-count" }, documentCount))));
+                    documentCount && parseInt(documentCount) > 0 && (React.createElement(React.Fragment, null,
+                        React.createElement(IconButton, { style: "smallFilled", iconName: "allaw-icon-document", onClick: actions === null || actions === void 0 ? void 0 : actions.onViewDocument }),
+                        React.createElement("span", { className: "document-count" }, documentCount)))));
             default:
                 return null;
         }
     };
     if (status === "summary") {
-        return (React.createElement("div", { className: "appointment-slot-summary" },
+        return (React.createElement("div", { className: "appointment-slot-summary ".concat(style) },
             React.createElement("div", { className: "appointment-header" },
                 React.createElement("div", { className: "date-time-container" },
                     React.createElement("span", { className: "summary-date" }, date),
@@ -97,12 +98,11 @@ var AppointmentSlot = function (_a) {
                     React.createElement("div", { className: "client-name" }, clientName),
                     React.createElement("div", { className: "appointment-content" }, appointmentContent),
                     renderTags()),
-                React.createElement("div", { className: "document-actions-container" },
-                    React.createElement("div", { className: "document-actions" },
-                        React.createElement(IconButton, { style: "smallFilled", iconName: "allaw-icon-document", onClick: actions === null || actions === void 0 ? void 0 : actions.onViewDocument }),
-                        documentCount && (React.createElement("span", { className: "document-count" }, documentCount)))))));
+                React.createElement("div", { className: "document-actions-container" }, documentCount && parseInt(documentCount) > 0 && (React.createElement("div", { className: "document-actions" },
+                    React.createElement(IconButton, { style: "smallFilled", iconName: "allaw-icon-document", onClick: actions === null || actions === void 0 ? void 0 : actions.onViewDocument }),
+                    React.createElement("span", { className: "document-count" }, documentCount)))))));
     }
-    return (React.createElement("div", { className: "appointment-slot ".concat(status, " ").concat(isActive ? "active" : ""), onMouseDown: handleMouseDown, onMouseUp: handleMouseUp, onMouseLeave: handleMouseUp, onClick: handleClick },
+    return (React.createElement("div", { className: "appointment-slot ".concat(status, " ").concat(isActive ? "active" : "", " ").concat(style), onMouseDown: handleMouseDown, onMouseUp: handleMouseUp, onMouseLeave: handleMouseUp, onClick: handleClick },
         renderHeader(),
         renderFooter()));
 };

package/dist/components/molecules/pagination/pagination.css

@@ -60,9 +60,9 @@
   background-color: var(--grey-venom, #e6edf5);
 }
 
-.pagination-nav-button:hover:not(:disabled) {
+/* .pagination-nav-button:hover:not(:disabled) {
   color: var(--primary-blue);
-}
+} */
 
 .pagination-nav-button:disabled {
   opacity: 0.5;

package/package.json

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