allaw-ui 3.1.9 → 3.2.1

package/dist/components/atoms/selects/ComboBox.css

@@ -15,6 +15,18 @@
   color: var(--dark-grey, #456073);
 }
 
+.combo-box-title-medium {
+  font-weight: 400;
+}
+
+.combo-box-title-semiBold {
+  font-weight: 600;
+}
+
+.combo-box-title-bold {
+  font-weight: 700;
+}
+
 .combo-box-input-container {
   display: flex;
   align-items: center;

package/dist/components/atoms/selects/ComboBox.d.ts

@@ -17,6 +17,7 @@ export interface ComboBoxProps {
     onError?: (error: string) => void;
     openOnMount?: boolean;
     title?: string;
+    titleStyle?: "medium" | "semiBold" | "bold";
 }
 export interface ComboBoxRef {
     validate: () => boolean;

package/dist/components/atoms/selects/ComboBox.js

@@ -5,24 +5,24 @@ import TinyInfo from "../typography/TinyInfo";
 import Paragraph from "../typography/Paragraph";
 import { createPortal } from "react-dom";
 function ComboBox(_a, ref) {
-    var items = _a.items, selectedItem = _a.selectedItem, _b = _a.placeholder, placeholder = _b === void 0 ? "Sélectionner..." : _b, _c = _a.isRequired, isRequired = _c === void 0 ? false : _c, _d = _a.showError, showError = _d === void 0 ? false : _d, _e = _a.width, width = _e === void 0 ? 100 : _e, onSelect = _a.onSelect, onChange = _a.onChange, onError = _a.onError, _f = _a.openOnMount, openOnMount = _f === void 0 ? true : _f, title = _a.title;
-    var _g = useState(openOnMount), isOpen = _g[0], setIsOpen = _g[1];
-    var _h = useState(""), inputValue = _h[0], setInputValue = _h[1];
-    var _j = useState(items), filteredItems = _j[0], setFilteredItems = _j[1];
-    var _k = useState(""), error = _k[0], setError = _k[1];
-    var _l = useState(false), isHovered = _l[0], setIsHovered = _l[1];
-    var _m = useState(-1), selectedIndex = _m[0], setSelectedIndex = _m[1];
+    var items = _a.items, selectedItem = _a.selectedItem, _b = _a.placeholder, placeholder = _b === void 0 ? "Sélectionner..." : _b, _c = _a.isRequired, isRequired = _c === void 0 ? false : _c, _d = _a.showError, showError = _d === void 0 ? false : _d, _e = _a.width, width = _e === void 0 ? 100 : _e, onSelect = _a.onSelect, onChange = _a.onChange, onError = _a.onError, _f = _a.openOnMount, openOnMount = _f === void 0 ? true : _f, title = _a.title, _g = _a.titleStyle, titleStyle = _g === void 0 ? "semiBold" : _g;
+    var _h = useState(openOnMount), isOpen = _h[0], setIsOpen = _h[1];
+    var _j = useState(""), inputValue = _j[0], setInputValue = _j[1];
+    var _k = useState(items), filteredItems = _k[0], setFilteredItems = _k[1];
+    var _l = useState(""), error = _l[0], setError = _l[1];
+    var _m = useState(false), isHovered = _m[0], setIsHovered = _m[1];
+    var _o = useState(-1), selectedIndex = _o[0], setSelectedIndex = _o[1];
     var comboBoxRef = useRef(null);
     var inputContainerRef = useRef(null);
     var listRef = useRef(null);
     var inputRef = useRef(null);
     var chevronRef = useRef(null);
-    var _o = useState(true), isInputValid = _o[0], setIsInputValid = _o[1];
-    var _p = useState({
+    var _p = useState(true), isInputValid = _p[0], setIsInputValid = _p[1];
+    var _q = useState({
         top: 0,
         left: 0,
         width: 0,
-    }), listPosition = _p[0], setListPosition = _p[1];
+    }), listPosition = _q[0], setListPosition = _q[1];
     useEffect(function () {
         if (selectedItem) {
             var selectedItemData = items.find(function (item) { return item.value === selectedItem; });
@@ -150,7 +150,7 @@ function ComboBox(_a, ref) {
     }, [isOpen, filteredItems, selectedIndex]);
     return (React.createElement("div", { ref: comboBoxRef, className: "combo-box-container ".concat(isOpen ? "combo-box-pressed" : "", " ").concat(isHovered ? "combo-box-hovered" : ""), style: { width: "".concat(width, "%") }, onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave },
         title && (React.createElement("div", { className: "combo-box-title-container" },
-            React.createElement(Paragraph, { variant: "semiBold", color: "noir", text: title }),
+            React.createElement(Paragraph, { variant: titleStyle, color: "noir", text: title }),
             isRequired && (React.createElement("span", { className: "combo-box-required" },
                 "\u00A0",
                 "*")))),

package/dist/components/atoms/selects/ComboBox.stories.d.ts

@@ -61,6 +61,26 @@ declare namespace _default {
             export { control_6 as control };
         }
         export { title_1 as title };
+        export namespace titleStyle {
+            export let options: string[];
+            export namespace control_7 {
+                let type_7: string;
+                export { type_7 as type };
+            }
+            export { control_7 as control };
+            export let description: string;
+            export namespace table_1 {
+                export namespace type_8 {
+                    let summary: string;
+                }
+                export { type_8 as type };
+                export namespace defaultValue {
+                    let summary_1: string;
+                    export { summary_1 as summary };
+                }
+            }
+            export { table_1 as table };
+        }
     }
     export namespace parameters {
         namespace backgrounds {
@@ -91,4 +111,6 @@ export const Pressed: any;
 export const Required: any;
 export const CustomWidth: any;
 export const OpenOnMount: any;
+export const TitleMedium: any;
+export const TitleBold: any;
 import ComboBox from "./ComboBox";

package/dist/components/atoms/selects/ComboBox.stories.js

@@ -63,6 +63,15 @@ export default {
                 type: "text",
             },
         },
+        titleStyle: {
+            options: ["medium", "semiBold", "bold"],
+            control: { type: "select" },
+            description: "Style du titre (graisse de police)",
+            table: {
+                type: { summary: "string" },
+                defaultValue: { summary: "semiBold" },
+            },
+        },
     },
     parameters: {
         backgrounds: {
@@ -111,6 +120,7 @@ Default.args = {
     width: 100,
     openOnMount: true,
     title: "Sélectionnez une date",
+    titleStyle: "semiBold",
 };
 export var Pressed = Template.bind({});
 Pressed.args = __assign(__assign({}, Default.args), { selectedItem: "lundi-12-aout" });
@@ -120,3 +130,7 @@ export var CustomWidth = Template.bind({});
 CustomWidth.args = __assign(__assign({}, Default.args), { width: 50 });
 export var OpenOnMount = Template.bind({});
 OpenOnMount.args = __assign(__assign({}, Default.args), { openOnMount: true });
+export var TitleMedium = Template.bind({});
+TitleMedium.args = __assign(__assign({}, Default.args), { titleStyle: "medium" });
+export var TitleBold = Template.bind({});
+TitleBold.args = __assign(__assign({}, Default.args), { titleStyle: "bold" });

package/dist/components/molecules/billingCount/BillingCount.d.ts

@@ -5,6 +5,7 @@ export type BillingCountProps = {
     setIsStarted?: (value: boolean) => void;
     resetTimer?: boolean;
     pauseTimer?: boolean;
+    responsiveSize?: number;
 };
-declare const BillingCount: ({ onEnd, setIsStarted, resetTimer, pauseTimer, }: BillingCountProps) => React.JSX.Element;
+declare const BillingCount: ({ onEnd, setIsStarted, resetTimer, pauseTimer, responsiveSize, }: BillingCountProps) => React.JSX.Element;
 export default BillingCount;

package/dist/components/molecules/billingCount/BillingCount.js

@@ -7,10 +7,11 @@ var LOCAL_STORAGE_KEYS = {
     HAS_STARTED_BEFORE: "hasStartedBefore",
 };
 var BillingCount = function (_a) {
-    var onEnd = _a.onEnd, setIsStarted = _a.setIsStarted, resetTimer = _a.resetTimer, pauseTimer = _a.pauseTimer;
+    var onEnd = _a.onEnd, setIsStarted = _a.setIsStarted, resetTimer = _a.resetTimer, pauseTimer = _a.pauseTimer, responsiveSize = _a.responsiveSize;
     var _b = useState(0), elapsedSeconds = _b[0], setElapsedSeconds = _b[1];
     var _c = useState(false), isRunning = _c[0], setIsRunning = _c[1];
     var intervalRef = useRef(null);
+    var _d = useState(true), isVisible = _d[0], setIsVisible = _d[1];
     // --- Au premier render, on relit le localStorage
     useEffect(function () {
         var savedAccumulated = getAccumulatedTime();
@@ -69,6 +70,17 @@ var BillingCount = function (_a) {
             }
         }
     }, [resetTimer, pauseTimer]);
+    useEffect(function () {
+        var handleResize = function () {
+            if (responsiveSize !== undefined) {
+                var width = window.innerWidth;
+                setIsVisible(width >= responsiveSize);
+            }
+        };
+        handleResize();
+        window.addEventListener("resize", handleResize);
+        return function () { return window.removeEventListener("resize", handleResize); };
+    }, [responsiveSize]);
     // --- Fonctions utilitaires ---
     // Calcule la différence en s'appuyant sur:
     //   accumulatedTime (secondes) + (Date.now() - startTime) / 1000
@@ -151,7 +163,7 @@ var BillingCount = function (_a) {
     };
     return (React.createElement("button", { onClick: handleButtonClick, className: "billing-button-wrapper ".concat(isRunning ? "isRunning" : "") },
         React.createElement("i", { className: "allaw-icon-clock" }),
-        React.createElement("span", { className: "billing-time" }, formatTime(elapsedSeconds)),
+        isVisible && (React.createElement("span", { className: "billing-time" }, formatTime(elapsedSeconds))),
         React.createElement("i", { className: isRunning ? "allaw-icon-pause" : "allaw-icon-play", style: { fontSize: "12px", color: "#25BEEB", fontWeight: 800 } })));
 };
 export default BillingCount;

package/dist/components/molecules/billingCount/BillingCount.stories.d.ts

@@ -17,5 +17,6 @@ export namespace WithStartedState {
         }
     }
 }
+export const WithResponsiveSize: any;
 import BillingCount from "./BillingCount";
 import React from "react";

package/dist/components/molecules/billingCount/BillingCount.stories.js

@@ -42,3 +42,8 @@ WithStartedState.story = {
         },
     },
 };
+export var WithResponsiveSize = Template.bind({});
+WithResponsiveSize.args = {
+    onEnd: onEnd,
+    responsiveSize: 600,
+};

package/package.json

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