@ssa-ui-kit/core 2.1.1 → 2.2.1

package/LICENSE

@@ -1,21 +1,21 @@
-MIT License
-
-Copyright (c) 2023 SSA Group
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
+MIT License
+
+Copyright (c) 2023 SSA Group
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/components/DatePicker/hooks/useDatePicker.d.ts

@@ -16,6 +16,9 @@ export declare const useDatePicker: ({ dateMin, dateMax, name, defaultValue, for
     calendarViewDateTime: DateTime<boolean> | undefined;
     maskInputRef: import("react").MutableRefObject<HTMLInputElement>;
     calendarType: CalendarType;
+    lastChangedDate: Date | undefined;
+    luxonFormat: string;
+    safeOnChange: (newDateTime?: DateTime) => void;
     setCalendarType: import("react").Dispatch<import("react").SetStateAction<CalendarType>>;
     setCalendarViewDateTime: import("react").Dispatch<import("react").SetStateAction<DateTime<boolean> | undefined>>;
     setDateTime: import("react").Dispatch<import("react").SetStateAction<DateTime<boolean> | undefined>>;

package/dist/components/DatePicker/styles.d.ts

@@ -10,16 +10,25 @@ export declare const DaysViewCell: import("@emotion/styled").StyledComponent<{
 } & {
     isCalendarDateNow: boolean;
     isCalendarDateSelected: boolean;
+    isCalendarFirstDateSelected?: boolean;
+    isCalendarSecondDateSelected?: boolean;
+    isHighlighted: boolean;
 }, {}, {}>;
 export declare const YearsViewCell: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
 } & {
     isCalendarYear: boolean;
+    isCalendarFirstDateSelected?: boolean;
+    isCalendarSecondDateSelected?: boolean;
+    isHighlighted: boolean;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const MonthsViewCell: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
 } & {
     isCalendarMonth: boolean;
+    isCalendarFirstDateSelected?: boolean;
+    isCalendarSecondDateSelected?: boolean;
+    isHighlighted: boolean;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;

package/dist/components/DatePicker/types.d.ts

@@ -6,15 +6,24 @@ export type DatePickerProps = {
     name: string;
     label?: string;
     format?: 'mm/dd/yyyy' | 'dd/mm/yyyy';
+    isOpenToggle?: boolean;
     maskOptions?: Parameters<typeof useMask>[0];
     openCalendarMode?: 'icon' | 'input' | 'both';
-    inputProps?: InputProps['inputProps'];
+    inputProps?: Partial<InputProps>;
     value?: string;
     defaultValue?: string;
     dateMin?: string;
     dateMax?: string;
     disabled?: boolean;
     helperText?: string;
+    showCalendarIcon?: boolean;
+    lastChangedDate?: Date;
+    highlightDates?: {
+        enabled: boolean;
+        mode: 'dateFrom' | 'dateTo';
+        otherDate: Date | null;
+    };
+    safeOnChange?: (date?: DateTime) => void;
     onChange?: (date?: Date) => void;
     onOpen?: () => void;
     onClose?: () => void;

package/dist/components/DateRangePicker/DateRangePicker.d.ts

@@ -0,0 +1,2 @@
+import { DateRangePickerProps } from './types';
+export declare const DateRangePicker: ({ format, openCalendarMode, name, label, value, defaultValue, ...rest }: DateRangePickerProps) => import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/components/DateRangePicker/constants.d.ts

@@ -0,0 +1,7 @@
+export declare const DEFAULT_MASK_FORMAT = "mm/dd/yyyy";
+export declare const DEFAULT_MASK = "__/__/____";
+export declare const MONTHS: string[];
+export declare const DATE_MIN = "01/01/1900";
+export declare const DATE_MAX = "01/01/2150";
+export declare const OUT_OF_RANGE = "The date is out of the defined range";
+export declare const INVALID_DATE = "Invalid date";

package/dist/components/DateRangePicker/index.d.ts

@@ -0,0 +1 @@
+export * from './DateRangePicker';

package/dist/components/DateRangePicker/types.d.ts

@@ -0,0 +1,41 @@
+import { Dispatch, SetStateAction } from 'react';
+import { DateTime } from 'luxon';
+import { DatePickerProps } from '../DatePicker/types';
+import { FieldContextValue } from '../Field/FieldProvider';
+export type LastFocusedElement = 'from' | 'to';
+export type DateRangePickerProps = Omit<DatePickerProps, 'isOpenToggle' | 'value' | 'defaultValue' | 'onChange'> & {
+    value?: [string | undefined, string | undefined];
+    defaultValue?: [string, string];
+    status?: FieldContextValue['status'];
+    onChange?: (dates?: [Date | null, Date | null]) => void;
+    onOpen?: () => void;
+    onClose?: () => void;
+    onError?: (date: unknown, error?: string | null) => void;
+    onMonthChange?: (date: Date) => void;
+    onYearChange?: (date: Date) => void;
+    onBlur?: React.FocusEventHandler<HTMLInputElement>;
+};
+export type DateRangePickerContextProps = Omit<DateRangePickerProps, 'dateMin' | 'dateMax'> & {
+    inputFromRef?: React.ForwardedRef<HTMLInputElement | null>;
+    isOpen: boolean;
+    calendarType: CalendarType;
+    inputValue?: string;
+    dateTime?: DateTime;
+    calendarViewDateTime?: DateTime;
+    dateMinParts: number[];
+    dateMaxParts: number[];
+    dateMinDT: DateTime;
+    dateMaxDT: DateTime;
+    formatIndexes: {
+        day: number;
+        month: number;
+        year: number;
+    };
+    lastFocusedElement: LastFocusedElement;
+    setLastFocusedElement: Dispatch<SetStateAction<LastFocusedElement>>;
+    setCalendarViewDateTime: Dispatch<SetStateAction<DateTime | undefined>>;
+    setDateTime: Dispatch<SetStateAction<DateTime<boolean> | undefined>>;
+    setIsOpen: Dispatch<SetStateAction<boolean>>;
+    setCalendarType: Dispatch<SetStateAction<CalendarType>>;
+};
+export type CalendarType = 'days' | 'months' | 'years';

package/dist/components/Drawer/DrawerCloseButton.d.ts

@@ -0,0 +1,5 @@
+import { ButtonProps } from '../Button/types';
+export interface DrawerCloseButtonProps extends ButtonProps {
+    children?: React.ReactNode;
+}
+export declare const DrawerCloseButton: import("react").ForwardRefExoticComponent<DrawerCloseButtonProps & import("react").RefAttributes<HTMLButtonElement>>;

package/dist/components/Drawer/DrawerContent.d.ts

@@ -0,0 +1,3 @@
+export declare const DrawerContent: import("react").ForwardRefExoticComponent<{
+    children: React.ReactNode;
+} & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/Drawer/DrawerHeader.d.ts

@@ -0,0 +1,4 @@
+export interface DrawerHeaderProps extends React.HTMLAttributes<HTMLDivElement> {
+    children?: React.ReactNode;
+}
+export declare const DrawerHeader: import("react").ForwardRefExoticComponent<DrawerHeaderProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/Drawer/DrawerOverlay.d.ts

@@ -0,0 +1,4 @@
+import { FloatingOverlayProps } from '@floating-ui/react';
+export declare const DrawerOverlay: ({ children, ...props }: {
+    children?: React.ReactNode;
+} & FloatingOverlayProps) => import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/components/Drawer/DrawerPortal.d.ts

@@ -0,0 +1,2 @@
+import { FloatingPortal } from '@floating-ui/react';
+export declare const DrawerPortal: ({ children, ...props }: React.ComponentProps<typeof FloatingPortal>) => import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/components/Drawer/DrawerProvider.d.ts

@@ -0,0 +1,8 @@
+import { UseDrawerStore } from './useDrawer';
+export interface DrawerContextValue {
+    store: UseDrawerStore;
+}
+export declare const DrawerProvider: ({ children, value, }: {
+    value: DrawerContextValue;
+    children: React.ReactNode;
+}) => import("react").FunctionComponentElement<import("react").ProviderProps<DrawerContextValue | null>>, useDrawerContext: () => DrawerContextValue;

package/dist/components/Drawer/DrawerRoot.d.ts

@@ -0,0 +1,6 @@
+import { UseDrawerStore, UseDrawerOptions } from './useDrawer';
+export interface DrawerProps extends UseDrawerOptions {
+    children?: React.ReactElement;
+    store?: UseDrawerStore;
+}
+export declare const Drawer: ({ children, store: controlledStore, ...drawerProps }: DrawerProps) => import("@emotion/react/jsx-runtime").JSX.Element | null;

package/dist/components/Drawer/DrawerTitle.d.ts

@@ -0,0 +1,4 @@
+export interface DrawerTitleProps extends React.HTMLAttributes<HTMLHeadingElement> {
+    children?: React.ReactNode;
+}
+export declare const DrawerTitle: import("react").ForwardRefExoticComponent<DrawerTitleProps & import("react").RefAttributes<HTMLHeadingElement>>;

package/dist/components/Drawer/index.d.ts

@@ -0,0 +1,2 @@
+export * as Drawer from './index.parts';
+export { useDrawer, UseDrawerOptions } from './useDrawer';

package/dist/components/Drawer/index.parts.d.ts

@@ -0,0 +1,7 @@
+export { Drawer as Root } from './DrawerRoot';
+export { DrawerOverlay as Overlay } from './DrawerOverlay';
+export { DrawerPortal as Portal } from './DrawerPortal';
+export { DrawerContent as Content } from './DrawerContent';
+export { DrawerHeader as Header } from './DrawerHeader';
+export { DrawerTitle as Title } from './DrawerTitle';
+export { DrawerCloseButton as CloseButton } from './DrawerCloseButton';

package/dist/components/Drawer/useDrawer.d.ts

@@ -0,0 +1,48 @@
+import { OpenChangeReason } from '@floating-ui/react';
+export type Position = 'left' | 'right' | 'top' | 'bottom';
+export type UseDrawerOptions = {
+    opened?: boolean;
+    duration?: number;
+    defaultOpened?: boolean;
+    dismissable?: boolean;
+    position?: Position;
+    title?: string;
+    withCloseButton?: boolean;
+    onOpenChange?: (open: boolean, event?: Event, reason?: OpenChangeReason) => void;
+};
+export declare const useDrawer: ({ opened, duration, defaultOpened, dismissable, position, title, withCloseButton, onOpenChange, }?: UseDrawerOptions) => {
+    opened: boolean;
+    dismissable: boolean;
+    position: Position;
+    duration: number;
+    floatingContext: {
+        x: number;
+        y: number;
+        placement: import("@floating-ui/react").Placement;
+        strategy: import("@floating-ui/react").Strategy;
+        middlewareData: import("@floating-ui/react").MiddlewareData;
+        isPositioned: boolean;
+        update: () => void;
+        floatingStyles: React.CSSProperties;
+        open: boolean;
+        onOpenChange: (open: boolean, event?: Event, reason?: OpenChangeReason) => void;
+        events: import("@floating-ui/react").FloatingEvents;
+        dataRef: React.MutableRefObject<import("@floating-ui/react").ContextData>;
+        nodeId: string | undefined;
+        floatingId: string | undefined;
+        refs: import("@floating-ui/react").ExtendedRefs<import("@floating-ui/react").ReferenceType>;
+        elements: import("@floating-ui/react").ExtendedElements<import("@floating-ui/react").ReferenceType>;
+    };
+    interactions: import("@floating-ui/react").UseInteractionsReturn;
+    transition: {
+        isMounted: boolean;
+        status: "initial" | "open" | "close" | "unmounted";
+    };
+    title: string | undefined;
+    withCloseButton: boolean;
+    portalNode: HTMLElement | null;
+    setFloating: ((node: HTMLElement | null) => void) & ((node: HTMLElement | null) => void);
+    setPortalNode: import("react").Dispatch<import("react").SetStateAction<HTMLElement | null>>;
+    toggle: (open?: boolean) => void;
+};
+export type UseDrawerStore = ReturnType<typeof useDrawer>;

package/dist/components/Field/FieldProvider.d.ts

@@ -8,9 +8,5 @@ export interface FieldContextValue {
 }
 export declare const FieldProvider: ({ children, value, }: {
     value: FieldContextValue;
-    children: React.
-    /**
-     * If true, ReactElement children will be focused if FieldControl is clicked.
-     */
-    ReactNode;
+    children: React.ReactNode;
 }) => import("react").FunctionComponentElement<import("react").ProviderProps<FieldContextValue | null>>, useFieldContext: () => FieldContextValue;

package/dist/components/Field/FieldRoot.d.ts

@@ -1,6 +1,7 @@
 import { type HTMLAttributes } from 'react';
 import { FieldContextValue } from './FieldProvider';
 export interface FieldRootProps extends Partial<FieldContextValue>, HTMLAttributes<HTMLDivElement> {
+    asChild?: boolean;
     children: React.ReactNode;
 }
 export declare const FieldRoot: ({ children, ...props }: FieldRootProps) => import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/components/Field/index.d.ts

@@ -1,4 +1,4 @@
-export * as default from './index.parts';
+export * as Field from './index.parts';
 export { type FieldRootProps as FieldProps } from './FieldRoot';
 export { type FieldLabelProps } from './FieldLabel';
 export { type FieldControlProps } from './FieldControl';

package/dist/components/FiltersMultiSelect/FiltersMultiSelect.d.ts

@@ -1,6 +1,6 @@
 import { UseFormReturn } from 'react-hook-form';
+import { FieldProps } from '../index';
 import { InputProps } from '../Input/types';
-import { FieldProps } from '../Field';
 import { SelectedFilter, UseFiltersMultiSelectStore } from './useFiltersMultiSelect';
 export interface FiltersMultiSelectProps extends Pick<FieldProps, 'status' | 'disabled'> {
     children: React.ReactNode;
@@ -9,6 +9,7 @@ export interface FiltersMultiSelectProps extends Pick<FieldProps, 'status' | 'di
     error?: string;
     icon?: React.ReactNode;
     inputProps?: InputProps['inputProps'];
+    fieldProps?: FieldProps;
     label?: string;
     placeholder?: string;
     searchable?: boolean;
@@ -21,4 +22,4 @@ export interface FiltersMultiSelectProps extends Pick<FieldProps, 'status' | 'di
     onChange?: (value: SelectedFilter[]) => void;
     register?: UseFormReturn['register'];
 }
-export declare const FiltersMultiSelect: ({ children, description, disabled, emptyNode: controlledEmptyNode, error, icon, inputProps, label, placeholder, searchable, selectedFilters: controlledSelectedFilters, status, store: controlledStore, success, badgeClassName, inputClassName, wrapperClassName, onChange, register, }: FiltersMultiSelectProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const FiltersMultiSelect: ({ children, description, disabled, emptyNode: controlledEmptyNode, error, icon, fieldProps, inputProps, label, placeholder, searchable, selectedFilters: controlledSelectedFilters, status, store: controlledStore, success, badgeClassName, inputClassName, wrapperClassName, onChange, register, }: FiltersMultiSelectProps) => import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/components/FormHelperText/types.d.ts

@@ -2,6 +2,6 @@ import { CommonProps } from '../../types/emotion';
 export interface FormHelperTextProps extends CommonProps {
     children: React.ReactNode;
     role?: string;
-    status?: string;
+    status?: 'error' | 'success' | 'basic' | 'custom';
     disabled?: boolean;
 }

package/dist/components/Input/InputBase.d.ts

@@ -1,4 +1,6 @@
 export declare const InputBase: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
+} & {
+    showBorders: boolean;
 }, import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, {}>;

package/dist/components/Input/types.d.ts

@@ -22,6 +22,8 @@ export interface InputProps extends Partial<Pick<UseFormReturn, 'register' | 'co
     errorTooltip?: string;
     successTooltip?: string;
     showHelperText?: boolean;
+    showStatusIcon?: boolean;
+    showBorders?: boolean;
     helperText?: string;
     maxLength?: number;
     errors?: FieldError;

package/dist/components/NestedTable/WithNestedTableRow.d.ts

@@ -1,4 +1,3 @@
-import { NestedTableRowChildren } from './types';
 export declare const WithNestedTableRow: ({ children, }: {
-    children: NestedTableRowChildren | NestedTableRowChildren[];
-}) => import("@emotion/react/jsx-runtime").JSX.Element[];
+    children: React.ReactNode | React.ReactNode[];
+}) => import("@emotion/react/jsx-runtime").JSX.Element[] | null | undefined;

package/dist/components/NestedTable/types.d.ts

@@ -1,6 +1,3 @@
-export type NestedTableRowChildren = React.ReactElement<React.PropsWithChildren<{
-    isCollapsed?: boolean;
-}>>;
 export type NestedTableRowContextType = {
     isCollapsed: boolean;
     isSubHeader: boolean;

package/dist/components/Typeahead/Typeahead.context.d.ts

@@ -20,7 +20,7 @@ export declare const TypeaheadContext: React.Context<{
     inputName: string;
     inputValue: string;
     validationSchema: Record<string, unknown> | undefined;
-    status: "error" | "basic" | "success";
+    status: "error" | "success" | "basic";
     placeholder: string | null | undefined;
     options: React.ReactElement<any, string | React.JSXElementConstructor<any>>[] | undefined;
     useFormResult: UseFormReturn<FieldValues, any, undefined>;

package/dist/components/Typeahead/useTypeahead.d.ts

@@ -19,7 +19,7 @@ export declare const useTypeahead: ({ name, isOpen: isInitOpen, initialSelectedI
     inputName: string;
     inputValue: string;
     validationSchema: Record<string, unknown> | undefined;
-    status: "error" | "basic" | "success";
+    status: "error" | "success" | "basic";
     placeholder: string | null | undefined;
     options: React.ReactElement<any, string | React.JSXElementConstructor<any>>[] | undefined;
     useFormResult: import("react-hook-form").UseFormReturn<import("react-hook-form").FieldValues, any, undefined>;

package/dist/components/index.d.ts

@@ -71,6 +71,8 @@ export * from './CardList';
 export * from './Checkbox';
 export * from './CollapsibleNavBar';
 export * from './DatePicker';
+export * from './DateRangePicker';
+export * from './Drawer';
 export * from './Field';
 export * from './Filters';
 export * from './FiltersMultiSelect';

package/dist/contexts/Translation/TranslationContext.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { JSONObject } from '@global-types/json';
+import { JSONObject } from '../../types/json';
 import { TranslationContextContent } from './types';
 export declare const TranslationContext: import("react").Context<TranslationContextContent>;
 export declare const TranslationProvider: ({ children, defaultTranslations, }: {

package/dist/contexts/Translation/types.d.ts

@@ -1,5 +1,5 @@
 import { Dispatch, SetStateAction } from 'react';
-import { JSONObject } from '@global-types/json';
+import { JSONObject } from '../../types/json';
 export type TranslationContextContent = {
     language: string;
     t: (translationKey: string) => string;