@indico-data/design-system 3.0.8 → 3.0.10

package/lib/components/floatUI/FloatUI.d.ts

@@ -1,2 +1,2 @@
 import { FloatUIProps } from './types';
-export declare function FloatUI({ children, ariaLabel, isOpen: controlledIsOpen, setIsOpen: controlledSetIsOpen, isPortal, portalOptions, floatingOptions, }: FloatUIProps): import("react/jsx-runtime").JSX.Element;
+export declare function FloatUI({ children, ariaLabel, isOpen: controlledIsOpen, setIsOpen: controlledSetIsOpen, isPortal, portalOptions, floatingOptions, className, }: FloatUIProps): import("react/jsx-runtime").JSX.Element;

package/lib/components/floatUI/types.d.ts

@@ -5,6 +5,7 @@ export type FloatUIProps = {
     ariaLabel: string;
     floatingOptions?: UseFloatingOptions;
     isOpen?: boolean;
+    className?: string;
     isPortal?: boolean;
     portalOptions?: {
         rootId?: string;

package/lib/components/forms/date/datePicker/types.d.ts

@@ -1,5 +1,6 @@
 import { CustomComponents, DateRange, DayEventHandler, Formatters, Matcher, Mode, MonthChangeEventHandler, OnSelectHandler } from 'react-day-picker';
 export interface DatePickerProps {
+    ref?: React.LegacyRef<HTMLInputElement>;
     selected?: Date | DateRange | undefined;
     onSelect?: OnSelectHandler<Date> | OnSelectHandler<DateRange>;
     mode?: Mode;
@@ -27,6 +28,9 @@ export interface DatePickerProps {
     onNextClick?: MonthChangeEventHandler;
     onPrevClick?: MonthChangeEventHandler;
     onDayClick?: DayEventHandler<React.MouseEvent>;
+    isReadOnly?: boolean;
+    timeTabIndex?: number;
+    dateTabIndex?: number;
 }
 export interface CommonProps {
     className?: string;
@@ -49,3 +53,6 @@ export interface CommonProps {
     onPrevClick?: MonthChangeEventHandler;
     onDayClick?: DayEventHandler<React.MouseEvent>;
 }
+export interface PortalOptions {
+    rootId?: string;
+}

package/lib/components/forms/date/iconTriggerDatePicker/IconTriggerDatePicker.d.ts

@@ -1,5 +1,7 @@
 import { DateRange, Mode } from 'react-day-picker';
 import { IconName, IconSizes } from '../../../icons/types';
+import { UseFloatingOptions } from '@floating-ui/react-dom';
+import { PortalOptions } from '../datePicker/types';
 interface Props {
     mode?: Mode;
     ariaLabel: string;
@@ -17,6 +19,9 @@ interface Props {
     className?: string;
     initialMonth?: Date;
     'data-testid'?: string;
+    portalOptions?: PortalOptions;
+    isPortal?: boolean;
+    floatingOptions?: UseFloatingOptions;
 }
 export declare const IconTriggerDatePicker: (props: Props) => import("react/jsx-runtime").JSX.Element;
 export {};

package/lib/components/forms/date/inputDatePicker/SingleInputDatePicker.d.ts

@@ -1,4 +1,6 @@
 import type { IconName } from '../../../icons/types';
+import { UseFloatingOptions } from '@floating-ui/react-dom';
+import { PortalOptions } from '../datePicker/types';
 export interface SingleInputDatePickerProps {
     ariaLabel: string;
     disableBeforeDate?: Date;
@@ -19,5 +21,11 @@ export interface SingleInputDatePickerProps {
     errorMessage?: string | undefined;
     hasHiddenLabel?: boolean;
     'data-testid'?: string;
+    ref?: React.LegacyRef<HTMLInputElement>;
+    isReadOnly?: boolean;
+    tabIndex?: number;
+    portalOptions?: PortalOptions;
+    floatingOptions?: UseFloatingOptions;
+    isPortal?: boolean;
 }
 export declare function SingleInputDatePicker(props: SingleInputDatePickerProps): import("react/jsx-runtime").JSX.Element;

package/lib/components/forms/date/inputDateRangePicker/InputDateRangePicker.d.ts

@@ -1,5 +1,7 @@
 import { IconName } from '../../../icons/types';
 import { DateRange } from 'react-day-picker';
+import { UseFloatingOptions } from '@floating-ui/react-dom';
+import { PortalOptions } from '../datePicker/types';
 interface InputDateRangePickerProps {
     ariaLabel: string;
     disableBeforeDate?: Date;
@@ -24,6 +26,14 @@ interface InputDateRangePickerProps {
     closeOnSelect?: boolean;
     clearOnClose?: boolean;
     hasHiddenLabel?: boolean;
+    ref?: React.LegacyRef<HTMLInputElement>;
+    isFromReadOnly?: boolean;
+    isToReadOnly?: boolean;
+    toTabIndex?: number;
+    fromTabIndex?: number;
+    portalOptions?: PortalOptions;
+    floatingOptions?: UseFloatingOptions;
+    isPortal?: boolean;
 }
 export declare function InputDateRangePicker(props: InputDateRangePickerProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/lib/components/forms/date/inputDateTimePicker/SingleInputDateTimePicker.d.ts

@@ -1,4 +1,6 @@
 import type { IconName } from '../../../icons/types';
+import { UseFloatingOptions } from '@floating-ui/react-dom';
+import { PortalOptions } from '../datePicker/types';
 export interface SingleInputDateTimePickerProps {
     ariaLabel: string;
     disableBeforeDate?: Date;
@@ -21,5 +23,13 @@ export interface SingleInputDateTimePickerProps {
     hasHiddenLabel?: boolean;
     timeValue?: string;
     onTimeChange?: (time: string) => void;
+    isReadOnly?: boolean;
+    ref?: React.LegacyRef<HTMLInputElement>;
+    timePickerRef?: React.LegacyRef<HTMLInputElement>;
+    dateTabIndex?: number;
+    timeTabIndex?: number;
+    portalOptions?: PortalOptions;
+    floatingOptions?: UseFloatingOptions;
+    isPortal?: boolean;
 }
 export declare function SingleInputDateTimePicker(props: SingleInputDateTimePickerProps): import("react/jsx-runtime").JSX.Element;

package/lib/components/forms/input/Input.d.ts

@@ -17,6 +17,7 @@ export interface BaseInputProps {
     isClearable?: boolean;
     className?: string;
     defaultValue?: string;
+    tabIndex?: number;
 }
 export interface InputProps extends BaseInputProps, LabelProps {
 }

package/lib/components/forms/textarea/Textarea.d.ts

@@ -17,6 +17,7 @@ export interface TextareaProps extends LabelProps {
     maxLength?: number;
     autofocus?: boolean;
     defaultValue?: string;
+    tabIndex?: number;
 }
 declare const LabeledTextarea: React.ForwardRefExoticComponent<Omit<Omit<TextareaProps, "ref"> & React.RefAttributes<HTMLTextAreaElement> & LabelProps, "ref"> & React.RefAttributes<any>>;
 export { LabeledTextarea as Textarea };

package/lib/components/forms/timePicker/TimePicker.d.ts

@@ -1,9 +1,15 @@
 interface TimePickerProps {
+    ref?: React.LegacyRef<HTMLInputElement>;
     timeValue?: string;
     label?: string;
     name?: string;
     hasHiddenLabel?: boolean;
     onTimeChange?: (time: string) => void;
+    className?: string;
+    isReadOnly?: boolean;
+    isDisabled?: boolean;
+    tabIndex?: number;
+    [key: string]: unknown;
 }
-export declare const TimePicker: ({ timeValue, label, name, hasHiddenLabel, onTimeChange, }: TimePickerProps) => import("react/jsx-runtime").JSX.Element;
+export declare const TimePicker: ({ ref, timeValue, label, name, hasHiddenLabel, onTimeChange, className, isDisabled, isReadOnly, tabIndex, ...rest }: TimePickerProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/lib/index.css

@@ -2235,6 +2235,16 @@ body div[class*=select__single-value] {
   width: 348px;
 }
 
+.time-validation-error {
+  background-color: var(--pf-tooltip-background-color);
+  color: var(--pf-tooltip-font-color);
+  padding: var(--pf-padding-2);
+  border-radius: var(--pf-rounded);
+  width: 200px;
+  box-shadow: var(--pf-dropshadow);
+  font-size: var(--pf-font-size-overline);
+}
+
 :root [data-theme=light] {
   --pf-badge-background-color: var(--pf-page-background-color);
   --pf-badge-font-color: var(--pf-font-color);

package/lib/index.d.ts

@@ -284,6 +284,7 @@ interface BaseInputProps {
     isClearable?: boolean;
     className?: string;
     defaultValue?: string;
+    tabIndex?: number;
 }
 interface InputProps extends BaseInputProps, LabelProps {
 }
@@ -345,6 +346,7 @@ interface TextareaProps extends LabelProps {
     maxLength?: number;
     autofocus?: boolean;
     defaultValue?: string;
+    tabIndex?: number;
 }
 declare const LabeledTextarea: React$1.ForwardRefExoticComponent<Omit<Omit<TextareaProps, "ref"> & React$1.RefAttributes<HTMLTextAreaElement> & LabelProps, "ref"> & React$1.RefAttributes<any>>;
 
@@ -372,6 +374,7 @@ interface SelectProps<OptionType extends SelectOption> extends Props$4<OptionTyp
 declare const LabeledSelect: React$1.ForwardRefExoticComponent<SelectProps<SelectOption> & LabelProps & React$1.RefAttributes<any>>;
 
 interface DatePickerProps {
+    ref?: React.LegacyRef<HTMLInputElement>;
     selected?: Date | DateRange | undefined;
     onSelect?: OnSelectHandler<Date> | OnSelectHandler<DateRange>;
     mode?: Mode;
@@ -399,18 +402,30 @@ interface DatePickerProps {
     onNextClick?: MonthChangeEventHandler;
     onPrevClick?: MonthChangeEventHandler;
     onDayClick?: DayEventHandler<React.MouseEvent>;
+    isReadOnly?: boolean;
+    timeTabIndex?: number;
+    dateTabIndex?: number;
+}
+interface PortalOptions {
+    rootId?: string;
 }
 
 declare const DatePicker: (props: DatePickerProps) => react_jsx_runtime.JSX.Element;
 
 interface TimePickerProps {
+    ref?: React.LegacyRef<HTMLInputElement>;
     timeValue?: string;
     label?: string;
     name?: string;
     hasHiddenLabel?: boolean;
     onTimeChange?: (time: string) => void;
+    className?: string;
+    isReadOnly?: boolean;
+    isDisabled?: boolean;
+    tabIndex?: number;
+    [key: string]: unknown;
 }
-declare const TimePicker: ({ timeValue, label, name, hasHiddenLabel, onTimeChange, }: TimePickerProps) => react_jsx_runtime.JSX.Element;
+declare const TimePicker: ({ ref, timeValue, label, name, hasHiddenLabel, onTimeChange, className, isDisabled, isReadOnly, tabIndex, ...rest }: TimePickerProps) => react_jsx_runtime.JSX.Element;
 
 interface Props$3 {
     mode?: Mode;
@@ -429,6 +444,9 @@ interface Props$3 {
     className?: string;
     initialMonth?: Date;
     'data-testid'?: string;
+    portalOptions?: PortalOptions;
+    isPortal?: boolean;
+    floatingOptions?: UseFloatingOptions;
 }
 declare const IconTriggerDatePicker: (props: Props$3) => react_jsx_runtime.JSX.Element;
 
@@ -452,6 +470,12 @@ interface SingleInputDatePickerProps {
     errorMessage?: string | undefined;
     hasHiddenLabel?: boolean;
     'data-testid'?: string;
+    ref?: React.LegacyRef<HTMLInputElement>;
+    isReadOnly?: boolean;
+    tabIndex?: number;
+    portalOptions?: PortalOptions;
+    floatingOptions?: UseFloatingOptions;
+    isPortal?: boolean;
 }
 declare function SingleInputDatePicker(props: SingleInputDatePickerProps): react_jsx_runtime.JSX.Element;
 
@@ -479,6 +503,14 @@ interface InputDateRangePickerProps {
     closeOnSelect?: boolean;
     clearOnClose?: boolean;
     hasHiddenLabel?: boolean;
+    ref?: React.LegacyRef<HTMLInputElement>;
+    isFromReadOnly?: boolean;
+    isToReadOnly?: boolean;
+    toTabIndex?: number;
+    fromTabIndex?: number;
+    portalOptions?: PortalOptions;
+    floatingOptions?: UseFloatingOptions;
+    isPortal?: boolean;
 }
 declare function InputDateRangePicker(props: InputDateRangePickerProps): react_jsx_runtime.JSX.Element;
 
@@ -504,6 +536,14 @@ interface SingleInputDateTimePickerProps {
     hasHiddenLabel?: boolean;
     timeValue?: string;
     onTimeChange?: (time: string) => void;
+    isReadOnly?: boolean;
+    ref?: React.LegacyRef<HTMLInputElement>;
+    timePickerRef?: React.LegacyRef<HTMLInputElement>;
+    dateTabIndex?: number;
+    timeTabIndex?: number;
+    portalOptions?: PortalOptions;
+    floatingOptions?: UseFloatingOptions;
+    isPortal?: boolean;
 }
 declare function SingleInputDateTimePicker(props: SingleInputDateTimePickerProps): react_jsx_runtime.JSX.Element;
 
@@ -544,6 +584,7 @@ type FloatUIProps = {
     ariaLabel: string;
     floatingOptions?: UseFloatingOptions;
     isOpen?: boolean;
+    className?: string;
     isPortal?: boolean;
     portalOptions?: {
         rootId?: string;
@@ -551,7 +592,7 @@ type FloatUIProps = {
     setIsOpen?: React.Dispatch<React.SetStateAction<boolean>>;
 };
 
-declare function FloatUI({ children, ariaLabel, isOpen: controlledIsOpen, setIsOpen: controlledSetIsOpen, isPortal, portalOptions, floatingOptions, }: FloatUIProps): react_jsx_runtime.JSX.Element;
+declare function FloatUI({ children, ariaLabel, isOpen: controlledIsOpen, setIsOpen: controlledSetIsOpen, isPortal, portalOptions, floatingOptions, className, }: FloatUIProps): react_jsx_runtime.JSX.Element;
 
 type MenuProps = {
     children: React$1.ReactNode;

package/lib/index.esm.css

@@ -2235,6 +2235,16 @@ body div[class*=select__single-value] {
   width: 348px;
 }
 
+.time-validation-error {
+  background-color: var(--pf-tooltip-background-color);
+  color: var(--pf-tooltip-font-color);
+  padding: var(--pf-padding-2);
+  border-radius: var(--pf-rounded);
+  width: 200px;
+  box-shadow: var(--pf-dropshadow);
+  font-size: var(--pf-font-size-overline);
+}
+
 :root [data-theme=light] {
   --pf-badge-background-color: var(--pf-page-background-color);
   --pf-badge-font-color: var(--pf-font-color);