mautourco-components 0.2.42 → 0.2.44

package/dist/components/molecules/ActionDropdown/ActionDropdown.js

@@ -17,7 +17,7 @@ import './ActionDropdown.css';
 export function ActionDropdown(props) {
     var data = props.data, children = props.children, _a = props.maxWidth, maxWidth = _a === void 0 ? '153px' : _a;
     var _b = useState(false), open = _b[0], setOpen = _b[1];
-    return (_jsxs(Popover, { open: open, onOpenChange: setOpen, children: [_jsx(PopoverTrigger, { children: children !== null && children !== void 0 ? children : (_jsx("button", { className: "action-dropdown-trigger", children: _jsx(Icon, { name: "more-vertical" }) })) }), _jsx(PopoverContent, { className: "action-dropdown", style: { '--max-width': maxWidth }, align: "end", side: "bottom", avoidCollisions: false, children: data.map(function (item, index) {
+    return (_jsxs(Popover, { open: open, onOpenChange: setOpen, children: [_jsx(PopoverTrigger, { asChild: true, children: children !== null && children !== void 0 ? children : (_jsx("button", { className: "action-dropdown-trigger", children: _jsx(Icon, { name: "more-vertical" }) })) }), _jsx(PopoverContent, { className: "action-dropdown", style: { '--max-width': maxWidth }, align: "end", side: "bottom", avoidCollisions: false, children: data.map(function (item, index) {
                     var defaultButton = (_jsx("button", { onClick: function () {
                             var _a;
                             if (item.disabled) {

package/dist/components/organisms/QuoteHeader/QuoteHeader.d.ts

@@ -1,4 +1,5 @@
 import './QuoteHeader.css';
+export type FilterType = 'date' | 'clientType' | 'fileStatus' | 'search';
 export interface QuoteHeaderProps {
     /** Current tab */
     current: 'quotation' | 'booking';
@@ -6,6 +7,7 @@ export interface QuoteHeaderProps {
     onNavigate: (tab: 'quotation' | 'booking') => void;
     /** Callback to create a new quote */
     onNewQuote: () => void;
-    onFilterChange?: (filter: 'date' | 'clientType' | 'fileStatus', value: string) => void;
+    onFilterChange?: (filter: FilterType, value: string) => void;
+    currentFilter: Record<FilterType, string>;
 }
 export declare function QuoteHeader(props: QuoteHeaderProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/organisms/QuoteHeader/QuoteHeader.js

@@ -9,8 +9,19 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState } from 'react';
+import { useEffect, useState } from 'react';
 import Button from '../../atoms/Button/Button';
 import DropdownInput from '../../atoms/Inputs/DropdownInput/DropdownInput';
 import Input from '../../atoms/Inputs/Input/Input';
@@ -32,9 +43,26 @@ var filterConfig = {
     },
 };
 export function QuoteHeader(props) {
-    var _a = props.current, current = _a === void 0 ? 'quotation' : _a, onNavigate = props.onNavigate, onNewQuote = props.onNewQuote, onFilterChange = props.onFilterChange;
-    var _b = useState({}), currentValue = _b[0], setCurrentValue = _b[1];
-    return (_jsxs("div", { className: "quote-header", children: [_jsx(Heading, { level: 4, as: "h1", className: "quote-header__title", color: "accent", children: "Quotation & Booking" }), _jsxs("div", { className: "flex gap-4", children: [_jsx(Button, { variant: current === 'quotation' ? 'primary' : 'outline-primary', className: "quote-header__button", onClick: function () { return onNavigate('quotation'); }, children: "Quotation" }), _jsx(Button, { variant: current === 'booking' ? 'primary' : 'outline-primary', className: "quote-header__button", onClick: function () { return onNavigate('booking'); }, children: "Booking" })] }), _jsxs("div", { className: "quote-header__search-container", children: [_jsx(Input, { placeholder: "Search", icon: "search", iconPosition: "leading", className: "quote-header__search" }), _jsx(Button, { variant: "primary", leadingIcon: "plus-circle", iconSize: "md", size: "sm", onClick: onNewQuote, children: "New quote" })] }), _jsx("div", { className: "quote-header__filters", children: Object.entries(filterConfig).map(function (_a) {
+    var _a;
+    var _b = props.current, current = _b === void 0 ? 'quotation' : _b, currentFilter = props.currentFilter, onNavigate = props.onNavigate, onNewQuote = props.onNewQuote, onFilterChange = props.onFilterChange;
+    var _c = useState(currentFilter !== null && currentFilter !== void 0 ? currentFilter : {}), currentValue = _c[0], setCurrentValue = _c[1];
+    var _d = useState((_a = currentFilter === null || currentFilter === void 0 ? void 0 : currentFilter.search) !== null && _a !== void 0 ? _a : ''), searchValue = _d[0], setSearchValue = _d[1];
+    useEffect(function () {
+        if (Object.keys(currentFilter !== null && currentFilter !== void 0 ? currentFilter : {}).length > 0) {
+            var search = currentFilter.search, rest = __rest(currentFilter, ["search"]);
+            setCurrentValue(rest);
+            setSearchValue(search);
+        }
+        else {
+            setCurrentValue({});
+            setSearchValue('');
+        }
+    }, [currentFilter]);
+    return (_jsxs("div", { className: "quote-header", children: [_jsx(Heading, { level: 4, as: "h1", className: "quote-header__title", color: "accent", children: "Quotation & Booking" }), _jsxs("div", { className: "flex gap-4", children: [_jsx(Button, { variant: current === 'quotation' ? 'primary' : 'outline-primary', className: "quote-header__button", onClick: function () { return onNavigate('quotation'); }, children: "Quotation" }), _jsx(Button, { variant: current === 'booking' ? 'primary' : 'outline-primary', className: "quote-header__button", onClick: function () { return onNavigate('booking'); }, children: "Booking" })] }), _jsxs("div", { className: "quote-header__search-container", children: [_jsx(Input, { placeholder: "Search", icon: "search", iconPosition: "leading", className: "quote-header__search", value: searchValue, onChange: function (e) {
+                            onFilterChange === null || onFilterChange === void 0 ? void 0 : onFilterChange('search', e.target.value);
+                            setCurrentValue(__assign(__assign({}, currentValue), { search: e.target.value }));
+                            setSearchValue(e.target.value);
+                        } }), _jsx(Button, { variant: "primary", leadingIcon: "plus-circle", iconSize: "md", size: "sm", onClick: onNewQuote, children: "New quote" })] }), _jsx("div", { className: "quote-header__filters", children: Object.entries(filterConfig).map(function (_a) {
                     var key = _a[0], value = _a[1];
                     return (_jsx(DropdownInput, { placeholder: value.placeholder, options: value.options, value: currentValue[key], onSelect: function (value) {
                             var _a;

package/dist/index.d.ts

@@ -119,7 +119,7 @@ export type { ComparisonData, DialogComparisonProps, MultiComparisonData, } from
 export type { DialogDeleteConfirmProps } from './components/organisms/DialogDeleteConfirm/DialogDeleteConfirm';
 export type { DialogQuoteRenameProps } from './components/organisms/DialogQuoteRename/DialogQuoteRename';
 export type { SelectedQuote } from './components/organisms/DialogSendingMail/DialogSendingMailMultiple/DialogSendingMailMultiple';
-export type { QuoteHeaderProps } from './components/organisms/QuoteHeader/QuoteHeader';
+export type { FilterType, QuoteHeaderProps, } from './components/organisms/QuoteHeader/QuoteHeader';
 export type { TimelineProps, TimelineServices, } from './components/organisms/Timeline/Timeline';
 export type { AccomodationDocket as AccomodationDocketType, ExcursionDocket as ExcursionDocketType, OtherServiceDocket as OtherServiceDocketType, ServiceDocket as ServiceDocketType, TransferDocket as TransferDocketType, } from './types/docket/services.types';
 export * from './types/table';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mautourco-components",
-  "version": "0.2.42",
+  "version": "0.2.44",
   "private": false,
   "description": "Bibliothèque de composants Motorco pour le redesign",
   "main": "dist/index.js",

package/src/components/molecules/ActionDropdown/ActionDropdown.tsx

@@ -40,7 +40,7 @@ export function ActionDropdown(props: ActionDropdownProps) {
 
   return (
     <Popover open={open} onOpenChange={setOpen}>
-      <PopoverTrigger>
+      <PopoverTrigger asChild>
         {children ?? (
           <button className="action-dropdown-trigger">
             <Icon name="more-vertical" />

package/src/components/organisms/QuoteHeader/QuoteHeader.tsx

@@ -1,4 +1,4 @@
-import { useState } from 'react';
+import { useEffect, useState } from 'react';
 import Button from '../../atoms/Button/Button';
 import DropdownInput from '../../atoms/Inputs/DropdownInput/DropdownInput';
 import Input from '../../atoms/Inputs/Input/Input';
@@ -10,6 +10,8 @@ import {
 } from './constant';
 import './QuoteHeader.css';
 
+export type FilterType = 'date' | 'clientType' | 'fileStatus' | 'search';
+
 export interface QuoteHeaderProps {
   /** Current tab */
   current: 'quotation' | 'booking';
@@ -20,7 +22,9 @@ export interface QuoteHeaderProps {
   /** Callback to create a new quote */
   onNewQuote: () => void;
 
-  onFilterChange?: (filter: 'date' | 'clientType' | 'fileStatus', value: string) => void;
+  onFilterChange?: (filter: FilterType, value: string) => void;
+
+  currentFilter: Record<FilterType, string>;
 }
 
 const filterConfig = {
@@ -39,8 +43,28 @@ const filterConfig = {
 };
 
 export function QuoteHeader(props: QuoteHeaderProps) {
-  const { current = 'quotation', onNavigate, onNewQuote, onFilterChange } = props;
-  const [currentValue, setCurrentValue] = useState<Record<string, string>>({});
+  const {
+    current = 'quotation',
+    currentFilter,
+    onNavigate,
+    onNewQuote,
+    onFilterChange,
+  } = props;
+  const [currentValue, setCurrentValue] = useState<Record<FilterType, string>>(
+    currentFilter ?? {}
+  );
+  const [searchValue, setSearchValue] = useState<string>(currentFilter?.search ?? '');
+
+  useEffect(() => {
+    if (Object.keys(currentFilter ?? {}).length > 0) {
+      const { search, ...rest } = currentFilter;
+      setCurrentValue(rest as Record<FilterType, string>);
+      setSearchValue(search);
+    } else {
+      setCurrentValue({} as Record<FilterType, string>);
+      setSearchValue('');
+    }
+  }, [currentFilter]);
 
   return (
     <div className="quote-header">
@@ -67,6 +91,12 @@ export function QuoteHeader(props: QuoteHeaderProps) {
           icon="search"
           iconPosition="leading"
           className="quote-header__search"
+          value={searchValue}
+          onChange={(e) => {
+            onFilterChange?.('search', e.target.value);
+            setCurrentValue({ ...currentValue, search: e.target.value });
+            setSearchValue(e.target.value);
+          }}
         />
         <Button
           variant="primary"
@@ -83,9 +113,9 @@ export function QuoteHeader(props: QuoteHeaderProps) {
             key={key}
             placeholder={value.placeholder}
             options={value.options}
-            value={currentValue[key]}
+            value={currentValue[key as FilterType]}
             onSelect={(value) => {
-              onFilterChange?.(key as 'date' | 'clientType' | 'fileStatus', value);
+              onFilterChange?.(key as FilterType, value);
               setCurrentValue({ ...currentValue, [key]: value });
             }}
           />