@up42/up-components 5.10.2 → 5.12.0-date-pickers.0

package/dist/cjs/types/components/FormDatePickers/FormDatePicker/FormDatePicker.d.ts

@@ -2,8 +2,8 @@ import { DatePickerProps as MuiDatePickerProps } from '@mui/x-date-pickers-pro';
 import { Dayjs } from 'dayjs';
 import React from 'react';
 import { type DatePickerWrapperProps } from '../FormDatePickerWrapper';
-export type DatePickerDateType = Dayjs | null | undefined;
-type NonGenericMuiDatePickerProps = MuiDatePickerProps<DatePickerDateType>;
+export type FormDatePickerDateType = Date | Dayjs | null | undefined;
+type NonGenericMuiDatePickerProps = MuiDatePickerProps<FormDatePickerDateType>;
 export type FormDatePickerProps = NonGenericMuiDatePickerProps & DatePickerWrapperProps;
 export declare const FormDatePicker: React.ForwardRefExoticComponent<NonGenericMuiDatePickerProps & DatePickerWrapperProps & React.RefAttributes<HTMLDivElement>>;
 export {};

package/dist/cjs/types/components/FormDatePickers/FormDateRangePicker/FormDateRangePicker.d.ts

@@ -1,23 +1,34 @@
-import { DatePickerProps as MuiDatePickerProps } from '@mui/x-date-pickers-pro';
 import React from 'react';
-import type { MUIGlobalOmit } from '@global/utils/types';
-import { DatePickerDateType, FormDatePickerProps } from '../FormDatePicker/FormDatePicker';
-type NonGenericMuiDatePickerProps = MuiDatePickerProps<DatePickerDateType>;
-export type FormDateRangePickerProps = Omit<MUIGlobalOmit<NonGenericMuiDatePickerProps>, 'value' | 'onChange'> & {
-    start: DatePickerDateType;
-    onStartChange: (date: DatePickerDateType) => void;
-    end: DatePickerDateType;
-    onEndChange: (date: DatePickerDateType) => void;
-    label?: string;
-    startPickerProps?: {
-        slotProps: FormDatePickerProps['slotProps'];
-    };
-    endPickerProps?: {
-        slotProps: FormDatePickerProps['slotProps'];
-    };
+import { DateRangePickerProps } from '@mui/x-date-pickers-pro/DateRangePicker';
+import { type DatePickerWrapperProps } from '../FormDatePickerWrapper';
+import { FormDatePickerDateType } from '../FormDatePicker/FormDatePicker';
+export type DateRange = {
+    start: FormDatePickerDateType;
+    end: FormDatePickerDateType;
 };
+export type FormDateRangePickerProps = {
+    startLabel?: string;
+    startPlaceholder?: string;
+    endLabel?: string;
+    endPlaceholder?: string;
+    value: DateRange | null;
+    onChange?: (value: DateRange | null) => void;
+    disabled?: boolean;
+    /**
+     * Defines whether or not the user can input values and navigate in the calendars using the keyboard.
+     */
+    allowKeyboard?: boolean;
+    /**
+     * Defines the minimum number of days after the "start date" that the "end date" can be selected.
+     */
+    minEndDateOffset?: number;
+    /**
+     * Defines the maximum number of days after the "start date" that the "end date" can be selected.
+     */
+    maxEndDateOffset?: number;
+} & DatePickerWrapperProps & Omit<DateRangePickerProps<FormDatePickerDateType | Date>, 'value' | 'onChange'>;
 /**
- * Documentation: https://up-components.up42.com/?path=/docs/patterns-form-formdaterangepicker--docs
+ * FormDateRangePicker allows users to choose two dates (start and end) using calendar view.
+ * Documentation: https://up-components.up42.com/?path=/docs-patterns-form-formdaterangepicker--docs
  */
-export declare const FormDateRangePicker: ({ start, onStartChange, end, onEndChange, label, minDate, maxDate, startPickerProps, endPickerProps, ...props }: FormDateRangePickerProps) => React.JSX.Element;
-export {};
+export declare const FormDateRangePicker: ({ value, onChange, label, helperText, error, startLabel, endLabel, disabled, minEndDateOffset, maxEndDateOffset, allowKeyboard, startPlaceholder, endPlaceholder, ...props }: FormDateRangePickerProps) => React.JSX.Element;

package/dist/cjs/types/components/FormDatePickers/FormDateRangePickerList/FormDateRangePickerList.d.ts

@@ -1,36 +1,17 @@
 import React from 'react';
-import { DateRangePickerProps } from '@mui/x-date-pickers-pro/DateRangePicker';
 import { type DatePickerWrapperProps } from '../FormDatePickerWrapper';
-import { DatePickerDateType } from '../FormDatePicker/FormDatePicker';
-export type DateRange = {
-    start: DatePickerDateType | Date;
-    end: DatePickerDateType | Date;
-};
+import { FormDateRangePickerProps, DateRange } from '../FormDateRangePicker/FormDateRangePicker';
 export type FormDateRangePickerListProps = {
-    startLabel?: string;
-    endLabel?: string;
     value: DateRange[];
     onChange?: (value: DateRange[]) => void;
     disabled?: boolean;
-    /**
-     * Defines whether or not the user can input values and navigate in the calendars using the keyboard.
-     */
-    allowKeyboard?: boolean;
-    /**
-     * Defines the minimum number of days after the "start date" that the "end date" can be selected.
-     */
-    minEndDateOffset?: number;
-    /**
-     * Defines the maximum number of days after the "start date" that the "end date" can be selected.
-     */
-    maxEndDateOffset?: number;
     /**
      * Defines the text to display in the action button to add a new Date Range.
      * It defaults to "Add new date".
      */
     addButtonText?: string;
-} & DatePickerWrapperProps & Omit<DateRangePickerProps<DatePickerDateType | Date>, 'value' | 'onChange'>;
+} & DatePickerWrapperProps & Omit<FormDateRangePickerProps, 'value' | 'onChange'>;
 /**
  * Documentation: https://up-components.up42.com/?path=/docs/patterns-form-formdaterangepickerlist--docs
  */
-export declare const FormDateRangePickerList: ({ value, onChange, label, helperText, error, startLabel, endLabel, disabled, minEndDateOffset, maxEndDateOffset, allowKeyboard, addButtonText, ...props }: FormDateRangePickerListProps) => React.JSX.Element;
+export declare const FormDateRangePickerList: ({ value, onChange, label, helperText, error, disabled, addButtonText, ...props }: FormDateRangePickerListProps) => React.JSX.Element;

package/dist/cjs/types/components/PageHeader/PageHeader.d.ts

@@ -18,5 +18,6 @@ export type PageHeaderProps = {
 };
 /**
  * Documentation: https://up-components.up42.com/?path=/docs/patterns-pageheader--docs
+ * @deprecated use PageHeaderV2 instead
  */
 export declare const PageHeader: ({ title, description, divider, action, secondaryAction, onSubmitTitle, }: PageHeaderProps) => React.JSX.Element;

package/dist/cjs/types/components/PageHeaderV2/PageHeaderV2.d.ts

@@ -0,0 +1,29 @@
+import { SxProps, Theme } from '@mui/material';
+import React from 'react';
+export type PageHeaderV2Props = {
+    title: string;
+    divider?: boolean;
+    description?: React.ReactNode;
+    /**
+     * Sets the size and spacing of the header
+     */
+    variant?: 'default' | 'compact';
+    /**
+     * Back link configuration
+     */
+    backLink?: {
+        label: string;
+        href?: string;
+        onClick?: () => void;
+        'data-testid'?: string;
+    };
+    /**
+     * Action buttons to display on the right side
+     */
+    action?: React.ReactNode;
+    sx?: SxProps<Theme>;
+};
+/**
+ * Documentation: https://up-components.up42.com/?path=/docs/patterns-pageheaderv2--docs
+ */
+export declare const PageHeaderV2: ({ title, description, divider, variant, backLink, action, sx, }: PageHeaderV2Props) => React.JSX.Element;

package/dist/cjs/types/components/PageHeaderV2/PageHeaderV2.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/cjs/types/components/Popover/Popover.d.ts

@@ -111,7 +111,7 @@ export declare const Popover: React.ForwardRefExoticComponent<Omit<Omit<MUIPopov
     /**
      * Alternative icon to display as the built in button's icon (only applicable if isIconAnchor is true)
      */
-    icon?: "AccessTime" | "Add" | "AddCircleFilled" | "AddPlusCircle" | "AlarmBell" | "AlertCircleFilled" | "AlertTriangle" | "Angle" | "AppWindowCode" | "ArrowBack" | "ArrowBackIos" | "ArrowDownLeft" | "ArrowDownRight" | "ArrowDownward" | "ArrowForward" | "ArrowTopLeft" | "ArrowTopRight" | "ArrowUpward" | "Attachment" | "AutoStoriesOutlined" | "Balance" | "Bin" | "Block" | "Blocked" | "Boxes" | "BoxesGrid" | "Brightness1" | "Calendar" | "CalendarAdd" | "CalendarCheck" | "CalendarDate" | "CalendarEdit" | "CalendarRemove" | "CalendarSearchDate" | "CampaignOutlined" | "CaretCircleFilledDown" | "CaretCircleFilledLeft" | "CaretCircleFilledRight" | "CaretCircleFilledUp" | "Catalog" | "CheckCircle" | "CheckCircleFilled" | "CheckList" | "CheckMark" | "ChevronCircleFilledDown" | "ChevronCircleFilledLeft" | "ChevronCircleFilledRight" | "ChevronCircleFilledUp" | "Close" | "CloseCircle" | "CloseCircleFilled" | "Cloud" | "CloudCheck" | "CloudDownload" | "CloudOff" | "CloudRemove" | "CloudSearch" | "CloudSync" | "CloudUpload" | "CloudWarning" | "Coin" | "CoinEuro" | "Compass" | "ContactSupportOutlined" | "ContentCut" | "ContentPaste" | "Copy" | "Credit" | "Dashboard" | "DataTransferVertical" | "Delivery" | "DollarCoinCircleFilled" | "DottedLines" | "Download" | "DownloadCircle" | "EditPencil" | "EuroCoinCircleFilled" | "ExitLeaveBack" | "ExternalLink" | "EyeCircleFilled" | "FlagQuestion" | "FolderEmpty" | "Footprint" | "HeadphonesQuestion" | "Heart" | "HeartCircleFilled" | "Hyperlink" | "ImageResolution" | "Invoice" | "KeyboardArrowDown" | "KeyboardArrowLeft" | "KeyboardArrowRight" | "KeyboardArrowUp" | "Layers" | "Library" | "Lightbulb" | "LightbulbOutlined" | "LocalOfferOutlined" | "Lock" | "LockCircleFilled" | "LockShield" | "Logo" | "LogoKSA" | "Map" | "MapPin" | "MapSearch" | "Marketplace" | "MarketplaceExternal" | "MenuCircleFilledHorizontal" | "MenuCircleFilledVertical" | "MenuOpenHorizontal" | "MenuOpenVertical" | "MinusCircleFilled" | "Module" | "Module2" | "ModuleThree" | "MoreHoriz" | "MultipleUsers" | "NotificationError" | "NotificationInfo" | "NotificationSuccess" | "NotificationWarning" | "PenCircleFilled" | "Pencil" | "PercentCircle" | "Person" | "Pin" | "Polygon" | "Projects" | "QuestionBubble" | "QuestionCircle" | "QuestionCircleFilled" | "QuestionMark" | "Rectangle" | "RectangleAOI" | "Redo" | "Remove" | "Resolution" | "Satellite" | "Save" | "Scissors" | "Search" | "SelectedIndicator" | "ServerCheck" | "ServerDeny" | "ServerDownload" | "ServerEdit" | "ServerError" | "ServerLock" | "ServerMinus" | "ServerQuestion" | "ServerRefresh" | "ServerSearch" | "ServerSync" | "ServerUpload" | "ServerWarning" | "SettingsCog" | "SettingsCog2" | "SettingsSliderHorizontal" | "SettingsVertical" | "Share" | "ShareNetwork" | "Shield" | "ShieldWithLock" | "ShoppingCartCheck" | "ShoppingCartClose" | "ShoppingCartMinus" | "ShoppingCartOutlined" | "ShoppingCartPlus" | "Storage" | "Support" | "SupportClear" | "SupportHeadphones" | "System" | "Tag" | "TagAlert" | "TagCheck" | "TagDouble" | "TagEdit" | "TagMinus" | "TagPlus" | "TagSearch" | "TagX" | "Target" | "Transaction" | "TrashBin" | "Undo" | "Unlock" | "UpgradeShield" | "Upload" | "UploadCircle" | "User" | "VisibilityOffOutlined" | "VisibilityOutlined" | "WeatherCloud" | "Webhooks" | "Workflow" | "WorkflowPencil" | "ZoomIn" | "ZoomOut" | undefined;
+    icon?: "AccessTime" | "Add" | "AddCircleFilled" | "AddPlusCircle" | "AlarmBell" | "AlertCircleFilled" | "AlertTriangle" | "Angle" | "AppWindowCode" | "ArrowBack" | "ArrowBackIos" | "ArrowDownLeft" | "ArrowDownRight" | "ArrowDownward" | "ArrowForward" | "ArrowTopLeft" | "ArrowTopRight" | "ArrowUpward" | "Attachment" | "AutoStoriesOutlined" | "Balance" | "Bin" | "Block" | "Blocked" | "Boxes" | "BoxesGrid" | "Brightness1" | "Calendar" | "CalendarAdd" | "CalendarCheck" | "CalendarDate" | "CalendarEdit" | "CalendarRemove" | "CalendarSearchDate" | "CampaignOutlined" | "CaretCircleFilledDown" | "CaretCircleFilledLeft" | "CaretCircleFilledRight" | "CaretCircleFilledUp" | "Catalog" | "CheckCircle" | "CheckCircleFilled" | "CheckList" | "CheckMark" | "ChevronCircleFilledDown" | "ChevronCircleFilledLeft" | "ChevronCircleFilledRight" | "ChevronCircleFilledUp" | "Close" | "CloseCircle" | "CloseCircleFilled" | "Cloud" | "CloudCheck" | "CloudDownload" | "CloudOff" | "CloudRemove" | "CloudSearch" | "CloudSync" | "CloudUpload" | "CloudWarning" | "Coin" | "CoinEuro" | "Compass" | "ContactSupportOutlined" | "ContentCut" | "ContentPaste" | "Copy" | "Credit" | "Dashboard" | "DataTransferVertical" | "Delivery" | "DollarCoinCircleFilled" | "DottedLines" | "Download" | "DownloadCircle" | "EditPencil" | "EuroCoinCircleFilled" | "ExitLeaveBack" | "ExternalLink" | "EyeCircleFilled" | "FlagQuestion" | "FolderEmpty" | "Footprint" | "HeadphonesQuestion" | "Heart" | "HeartCircleFilled" | "Hyperlink" | "ImageResolution" | "Invoice" | "KeyboardArrowDown" | "KeyboardArrowLeft" | "KeyboardArrowRight" | "KeyboardArrowUp" | "Layers" | "Library" | "Lightbulb" | "LightbulbOutlined" | "LocalOfferOutlined" | "Lock" | "LockCircleFilled" | "LockShield" | "Logo" | "LogoKSA" | "Map" | "MapPin" | "MapSearch" | "Marketplace" | "MarketplaceExternal" | "MenuCircleFilledHorizontal" | "MenuCircleFilledVertical" | "MenuOpenHorizontal" | "MenuOpenVertical" | "MinusCircleFilled" | "Module" | "Module2" | "ModuleThree" | "MoreHoriz" | "MultipleUsers" | "NotificationError" | "NotificationInfo" | "NotificationSuccess" | "NotificationWarning" | "PenCircleFilled" | "Pencil" | "PercentCircle" | "Person" | "Pin" | "Polygon" | "Projects" | "QuestionBubble" | "QuestionCircle" | "QuestionCircleFilled" | "QuestionMark" | "Rectangle" | "RectangleAOI" | "Redo" | "Remove" | "Resolution" | "Satellite" | "Save" | "Scissors" | "Search" | "SelectedIndicator" | "SelectedIndicatorWide" | "ServerCheck" | "ServerDeny" | "ServerDownload" | "ServerEdit" | "ServerError" | "ServerLock" | "ServerMinus" | "ServerQuestion" | "ServerRefresh" | "ServerSearch" | "ServerSync" | "ServerUpload" | "ServerWarning" | "SettingsCog" | "SettingsCog2" | "SettingsSliderHorizontal" | "SettingsVertical" | "Share" | "ShareNetwork" | "Shield" | "ShieldWithLock" | "ShoppingCartCheck" | "ShoppingCartClose" | "ShoppingCartMinus" | "ShoppingCartOutlined" | "ShoppingCartPlus" | "Storage" | "Support" | "SupportClear" | "SupportHeadphones" | "System" | "Tag" | "TagAlert" | "TagCheck" | "TagDouble" | "TagEdit" | "TagMinus" | "TagPlus" | "TagSearch" | "TagX" | "Target" | "Transaction" | "TrashBin" | "Undo" | "Unlock" | "UpgradeShield" | "Upload" | "UploadCircle" | "User" | "VisibilityOffOutlined" | "VisibilityOutlined" | "WeatherCloud" | "Webhooks" | "Workflow" | "WorkflowPencil" | "ZoomIn" | "ZoomOut" | undefined;
     /**
      * Custom styles for the icon anchor button (only applicable if isIconAnchor is true)
      */

package/dist/cjs/types/global/icons/index.d.ts

@@ -141,6 +141,7 @@ export { default as Save } from './Save.svg';
 export { default as Scissors } from './Scissors.svg';
 export { default as Search } from './Search.svg';
 export { default as SelectedIndicator } from './SelectedIndicator.svg';
+export { default as SelectedIndicatorWide } from './SelectedIndicatorWide.svg';
 export { default as ServerCheck } from './ServerCheck.svg';
 export { default as ServerDeny } from './ServerDeny.svg';
 export { default as ServerDownload } from './ServerDownload.svg';

package/dist/cjs/types/index.d.ts

@@ -10,10 +10,10 @@ export { GridContainer, type GridContainerProps, GridItem, type GridItemProps }
 export { PageContainer, type PageContainerProps } from './components/PageContainer/PageContainer';
 export { Checkbox, type CheckboxProps } from './components/Checkbox/Checkbox';
 export { FormCheckbox, type FormCheckboxProps } from './components/FormCheckbox/FormCheckbox';
-export { FormDatePicker, type FormDatePickerProps, type DatePickerDateType, } from './components/FormDatePickers/FormDatePicker/FormDatePicker';
-export { FormDateRangePicker, type FormDateRangePickerProps, } from './components/FormDatePickers/FormDateRangePicker/FormDateRangePicker';
+export { FormDatePicker, type FormDatePickerProps, type FormDatePickerDateType, } from './components/FormDatePickers/FormDatePicker/FormDatePicker';
+export { FormDateRangePicker, type FormDateRangePickerProps, type DateRange, } from './components/FormDatePickers/FormDateRangePicker/FormDateRangePicker';
 export { FormDateTimePicker, type FormDateTimePickerProps, } from './components/FormDatePickers/FormDateTimePicker/FormDateTimePicker';
-export { FormDateRangePickerList, type FormDateRangePickerListProps, type DateRange, } from './components/FormDatePickers/FormDateRangePickerList/FormDateRangePickerList';
+export { FormDateRangePickerList, type FormDateRangePickerListProps, } from './components/FormDatePickers/FormDateRangePickerList/FormDateRangePickerList';
 export { Radio, type RadioProps } from './components/Radio/Radio';
 export { FormRadio, type FormRadioProps } from './components/FormRadio/FormRadio';
 export { Switch, type SwitchProps } from './components/Switch/Switch';
@@ -37,6 +37,7 @@ export { CopyButton, type CopyButtonProps } from './components/CopyButton/CopyBu
 export { InfoPopover, type InfoPopoverProps } from './components/InfoPopover/InfoPopover';
 export { Popover, type PopoverProps } from './components/Popover/Popover';
 export { PageHeader, type PageHeaderProps } from './components/PageHeader/PageHeader';
+export { PageHeaderV2, type PageHeaderV2Props } from './components/PageHeaderV2/PageHeaderV2';
 export { NotFound, type NotFoundProps } from './components/NotFound/NotFound';
 export { Loading, type LoadingProps } from './components/Loading/Loading';
 export { Icon, type IconProps } from './components/Icon/Icon';