@geotab/zenith 2.0.0-beta.2 → 3.0.0-beta.0

package/dist/dataGrid/withSelectableRows/withSelectableRows.d.ts

@@ -1,7 +1,6 @@
 import { ComponentType, RefObject } from "react";
 import { IDataGrid } from "../dataGrid";
 import { IEntityWithId } from "../../commonHelpers/entity";
-import { ITranslatable } from "../../commonHelpers/translatable";
 import { IListColumn } from "../listColumn";
 interface ICheckboxSettings<T> {
     /**
@@ -24,17 +23,19 @@ export interface ISelectableRowsListSelections {
     selected: string[];
     turnOffSelectAll?: boolean;
 }
-export interface ISelectableRowsList<T, N = T> extends ITranslatable {
+export interface ISelectableRowsList<T, N = T> {
     selectMode: boolean;
     selection: ISelectableRowsListSelections | undefined;
-    popupTriggerRef?: RefObject<HTMLElement>;
+    popupTriggerRef?: RefObject<HTMLElement | null>;
     columns: IListColumn<T, N>[];
     options: ISelectableRowsListOptions<T>;
     onSelect: (selection: ISelectableRowsListSelections) => void;
+    ref?: RefObject<HTMLElement | null>;
 }
 export declare const getSelections: (selections: ISelectableRowsListSelections | undefined) => Set<string>;
-export declare const withSelectableRows: {
-    <T extends IEntityWithId, P extends IDataGrid<T, T>>(DataGridComponent: ComponentType<P>): import("react").ForwardRefExoticComponent<import("react").PropsWithoutRef<ISelectableRowsList<T, T> & P> & import("react").RefAttributes<HTMLElement>>;
+export declare const withSelectableRows: <T extends IEntityWithId, P extends IDataGrid<T, T>>(DataGridComponent: ComponentType<P>) => {
+    (props: ISelectableRowsList<T, T> & P): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
     translations: string[];
 };
 export {};

package/dist/dataGrid/withSelectableRows/withSelectableRows.js

@@ -53,179 +53,181 @@ const calculateSelectionState = (entities, selections, allSelected, options) =>
 // T - type of entity
 // P - props of wrapped component
 // eslint-disable-next-line @typescript-eslint/naming-convention
-const withSelectableRows = (DataGridComponent) => (0, react_1.forwardRef)(
-// eslint-disable-next-line @typescript-eslint/naming-convention
-function InnerList(props, ref) {
-    const { selectMode, selection, columns, entities, options, onSelect, translate: _1 } = props;
-    const { translate } = (0, useLanguage_1.useLanguage)();
-    const [isOpen, setIsOpen] = (0, react_1.useState)(false);
-    const selectId = (0, react_1.useId)();
-    const selectMenuRef = (0, react_1.useRef)(null);
-    const selections = (0, exports.getSelections)(selection);
-    const allSelected = selection !== undefined && selection.allSelected;
-    const wrapper = (0, react_1.useMemo)(() => selectMode ? new selectableRowsColumnWrapper_1.SelectableRowsColumnWrapper(selections, {
-        createTitle: options.createTitle,
-        headerTitle: options.headerTitle,
-        condition: options.condition || options.checkboxVisible,
-        disabled: options.checkboxDisabled
-            ? options.checkboxDisabled
-            : (entity) => options.selectionLimit !== undefined
-                ? (!selections.has(entity.id) && selections.size >= options.selectionLimit)
-                : false,
-        header: (options.selectionLimit === undefined
-            && options.checkboxDisabled === undefined
-            && options.checkboxVisible === undefined
-            && options.condition === undefined) || (options.checkboxInHeader === true && !options.selectionLimit)
-    }, selectMenuRef) : null, [
-        selectMode,
-        selections,
-        options.createTitle,
-        options.headerTitle,
-        options.condition,
-        options.checkboxVisible,
-        options.checkboxDisabled,
-        options.selectionLimit,
-        options.checkboxInHeader
-    ]);
-    if (wrapper) {
-        wrapper.selectionState = calculateSelectionState(entities, selections, allSelected, options);
-    }
-    const selectAll = (0, react_1.useCallback)((checked) => {
-        const newSelections = new Set(selections);
-        entities.forEach(entity => {
-            if (checked) {
-                const isVisible = options.condition
-                    ? options.condition(entity)
-                    : options.checkboxVisible
-                        ? options.checkboxVisible(entity)
-                        : true;
-                const isEnabled = !options.checkboxDisabled || !options.checkboxDisabled(entity);
-                if (isVisible && isEnabled) {
-                    newSelections.add(entity.id);
+const withSelectableRows = (DataGridComponent) => {
+    const WithSelectableRowsInner = (props) => {
+        const { selectMode, selection, columns, entities, options, onSelect } = props;
+        const { translate } = (0, useLanguage_1.useLanguage)();
+        const [isOpen, setIsOpen] = (0, react_1.useState)(false);
+        const selectId = (0, react_1.useId)();
+        const selectMenuRef = (0, react_1.useRef)(null);
+        const selections = (0, exports.getSelections)(selection);
+        const allSelected = selection !== undefined && selection.allSelected;
+        const wrapper = (0, react_1.useMemo)(() => selectMode ? new selectableRowsColumnWrapper_1.SelectableRowsColumnWrapper(selections, {
+            createTitle: options.createTitle,
+            headerTitle: options.headerTitle,
+            condition: options.condition || options.checkboxVisible,
+            disabled: options.checkboxDisabled
+                ? options.checkboxDisabled
+                : (entity) => options.selectionLimit !== undefined
+                    ? (!selections.has(entity.id) && selections.size >= options.selectionLimit)
+                    : false,
+            header: (options.selectionLimit === undefined
+                && options.checkboxDisabled === undefined
+                && options.checkboxVisible === undefined
+                && options.condition === undefined) || (options.checkboxInHeader === true && !options.selectionLimit)
+        }, selectMenuRef) : null, [
+            selectMode,
+            selections,
+            options.createTitle,
+            options.headerTitle,
+            options.condition,
+            options.checkboxVisible,
+            options.checkboxDisabled,
+            options.selectionLimit,
+            options.checkboxInHeader
+        ]);
+        if (wrapper) {
+            wrapper.selectionState = calculateSelectionState(entities, selections, allSelected, options);
+        }
+        const selectAll = (0, react_1.useCallback)((checked) => {
+            const newSelections = new Set(selections);
+            entities.forEach(entity => {
+                if (checked) {
+                    const isVisible = options.condition
+                        ? options.condition(entity)
+                        : options.checkboxVisible
+                            ? options.checkboxVisible(entity)
+                            : true;
+                    const isEnabled = !options.checkboxDisabled || !options.checkboxDisabled(entity);
+                    if (isVisible && isEnabled) {
+                        newSelections.add(entity.id);
+                    }
+                    return;
                 }
-                return;
-            }
-            newSelections.delete(entity.id);
-        });
-        const newState = calculateSelectionState(entities, newSelections, false, options);
-        onSelect({
-            selected: [...newSelections],
-            allSelected: newState === checkboxColumnWrapper_1.SelectionState.All,
-            turnOffSelectAll: selection === null || selection === void 0 ? void 0 : selection.turnOffSelectAll
-        });
-    }, [selections, entities, options, onSelect, selection === null || selection === void 0 ? void 0 : selection.turnOffSelectAll]);
-    const onSelectListener = (0, react_1.useCallback)(([id, checked]) => {
-        if (allSelected) {
-            const newSelection = new Set(entities.map(entity => entity.id));
-            newSelection.delete(id);
+                newSelections.delete(entity.id);
+            });
+            const newState = calculateSelectionState(entities, newSelections, false, options);
             onSelect({
-                selected: [...newSelection],
-                allSelected: false,
-                turnOffSelectAll: selection.turnOffSelectAll
+                selected: [...newSelections],
+                allSelected: newState === checkboxColumnWrapper_1.SelectionState.All,
+                turnOffSelectAll: selection === null || selection === void 0 ? void 0 : selection.turnOffSelectAll
             });
-            return;
-        }
-        if (checked) {
-            selections.add(id);
-        }
-        else {
-            selections.delete(id);
-        }
-        const newState = calculateSelectionState(entities, selections, allSelected, options);
-        onSelect({
-            selected: [...selections],
-            allSelected: newState === checkboxColumnWrapper_1.SelectionState.All,
-            turnOffSelectAll: selection === null || selection === void 0 ? void 0 : selection.turnOffSelectAll
-        });
-    }, [entities, selections, allSelected, options, onSelect, selection === null || selection === void 0 ? void 0 : selection.turnOffSelectAll]);
-    const onSelectAll = (0, react_1.useCallback)(([checked]) => {
-        if (checked && ((selection === null || selection === void 0 ? void 0 : selection.turnOffSelectAll) || options.turnOffSelectAll)) {
-            selectAll(true);
-            return;
-        }
-        onSelect({
-            selected: [],
-            allSelected: checked,
-            turnOffSelectAll: selection === null || selection === void 0 ? void 0 : selection.turnOffSelectAll
-        });
-    }, [onSelect, selection === null || selection === void 0 ? void 0 : selection.turnOffSelectAll, options.turnOffSelectAll, selectAll]);
-    const onTriggerClick = (0, react_1.useCallback)(() => {
-        setIsOpen(!isOpen);
-    }, [isOpen]);
-    const onSelectMenuChange = (0, react_1.useCallback)((state) => {
-        var _a, _b;
-        const selectedId = (_a = [...state].find(([_, v]) => v === checkboxState_1.CheckboxState.On)) === null || _a === void 0 ? void 0 : _a[0];
-        const value = selectedId && ((_b = selectionOptions.find(o => o.id === selectedId)) === null || _b === void 0 ? void 0 : _b.value);
-        if (value === undefined) {
-            return;
-        }
-        setIsOpen(false);
-        if (value === checkboxColumnWrapper_1.SelectionState.All) {
+        }, [selections, entities, options, onSelect, selection === null || selection === void 0 ? void 0 : selection.turnOffSelectAll]);
+        const onSelectListener = (0, react_1.useCallback)(([id, checked]) => {
+            if (allSelected) {
+                const newSelection = new Set(entities.map(entity => entity.id));
+                newSelection.delete(id);
+                onSelect({
+                    selected: [...newSelection],
+                    allSelected: false,
+                    turnOffSelectAll: selection.turnOffSelectAll
+                });
+                return;
+            }
+            if (checked) {
+                selections.add(id);
+            }
+            else {
+                selections.delete(id);
+            }
+            const newState = calculateSelectionState(entities, selections, allSelected, options);
             onSelect({
-                selected: [],
-                allSelected: true,
+                selected: [...selections],
+                allSelected: newState === checkboxColumnWrapper_1.SelectionState.All,
                 turnOffSelectAll: selection === null || selection === void 0 ? void 0 : selection.turnOffSelectAll
             });
-            return;
-        }
-        if (value === checkboxColumnWrapper_1.SelectionState.None) {
+        }, [entities, selections, allSelected, options, onSelect, selection === null || selection === void 0 ? void 0 : selection.turnOffSelectAll]);
+        const onSelectAll = (0, react_1.useCallback)(([checked]) => {
+            if (checked && ((selection === null || selection === void 0 ? void 0 : selection.turnOffSelectAll) || options.turnOffSelectAll)) {
+                selectAll(true);
+                return;
+            }
             onSelect({
                 selected: [],
-                allSelected: false,
+                allSelected: checked,
                 turnOffSelectAll: selection === null || selection === void 0 ? void 0 : selection.turnOffSelectAll
             });
-            return;
-        }
-        selectAll(true);
-    }, [onSelect, selectAll, selection === null || selection === void 0 ? void 0 : selection.turnOffSelectAll]);
-    (0, react_1.useEffect)(() => {
-        if (!wrapper) {
-            return () => { };
-        }
-        wrapper.detach();
-        wrapper.attach("change", onSelectListener);
-        wrapper.attach("change-all", onSelectAll);
-        wrapper.attach("toggle", onTriggerClick);
-        return () => {
+        }, [onSelect, selection === null || selection === void 0 ? void 0 : selection.turnOffSelectAll, options.turnOffSelectAll, selectAll]);
+        const onTriggerClick = (0, react_1.useCallback)(() => {
+            setIsOpen(!isOpen);
+        }, [isOpen]);
+        const onSelectMenuChange = (0, react_1.useCallback)((state) => {
+            var _a, _b;
+            const selectedId = (_a = [...state].find(([_, v]) => v === checkboxState_1.CheckboxState.On)) === null || _a === void 0 ? void 0 : _a[0];
+            const value = selectedId && ((_b = selectionOptions.find(o => o.id === selectedId)) === null || _b === void 0 ? void 0 : _b.value);
+            if (value === undefined) {
+                return;
+            }
+            setIsOpen(false);
+            if (value === checkboxColumnWrapper_1.SelectionState.All) {
+                onSelect({
+                    selected: [],
+                    allSelected: true,
+                    turnOffSelectAll: selection === null || selection === void 0 ? void 0 : selection.turnOffSelectAll
+                });
+                return;
+            }
+            if (value === checkboxColumnWrapper_1.SelectionState.None) {
+                onSelect({
+                    selected: [],
+                    allSelected: false,
+                    turnOffSelectAll: selection === null || selection === void 0 ? void 0 : selection.turnOffSelectAll
+                });
+                return;
+            }
+            selectAll(true);
+        }, [onSelect, selectAll, selection === null || selection === void 0 ? void 0 : selection.turnOffSelectAll]);
+        (0, react_1.useEffect)(() => {
+            if (!wrapper) {
+                return () => { };
+            }
             wrapper.detach();
-        };
-    }, [wrapper, onSelectListener, onSelectAll, onTriggerClick]);
-    const listColumns = (0, react_1.useMemo)(() => {
-        const newColumns = columns.map(c => (Object.assign({}, c)));
-        // Remove CheckboxColumnWrappers from wrappers list
-        newColumns.forEach(c => {
-            if (c.wrappers) {
-                c.wrappers = c.wrappers.filter(w => !(w instanceof selectableRowsColumnWrapper_1.SelectableRowsColumnWrapper));
+            wrapper.attach("change", onSelectListener);
+            wrapper.attach("change-all", onSelectAll);
+            wrapper.attach("toggle", onTriggerClick);
+            return () => {
+                wrapper.detach();
+            };
+        }, [wrapper, onSelectListener, onSelectAll, onTriggerClick]);
+        const listColumns = (0, react_1.useMemo)(() => {
+            const newColumns = columns.map(c => (Object.assign({}, c)));
+            // Remove CheckboxColumnWrappers from wrappers list
+            newColumns.forEach(c => {
+                if (c.wrappers) {
+                    c.wrappers = c.wrappers.filter(w => !(w instanceof selectableRowsColumnWrapper_1.SelectableRowsColumnWrapper));
+                }
+            });
+            // Add new CheckboxColumnWrapper to wrappers list of the first column
+            const firstColumn = newColumns.find(c => c.id === options.firstColumnId);
+            if (firstColumn && wrapper) {
+                firstColumn.wrappers = [...firstColumn.wrappers || [], wrapper];
             }
-        });
-        // Add new CheckboxColumnWrapper to wrappers list of the first column
-        const firstColumn = newColumns.find(c => c.id === options.firstColumnId);
-        if (firstColumn && wrapper) {
-            firstColumn.wrappers = [...firstColumn.wrappers || [], wrapper];
-        }
-        return newColumns;
-    }, [columns, options.firstColumnId, wrapper]);
-    const listItems = (0, react_1.useMemo)(() => selectionOptions
-        .filter(option => (!(selection === null || selection === void 0 ? void 0 : selection.turnOffSelectAll) && !options.turnOffSelectAll) || option.value !== checkboxColumnWrapper_1.SelectionState.All)
-        .map(option => ({
-        id: option.id,
-        value: option.value,
-        label: translate(option.label),
-        children: translate(option.label)
-    })).filter(option => option.value !== calculateSelectionState(entities, selections, allSelected, options)), [selection === null || selection === void 0 ? void 0 : selection.turnOffSelectAll, translate, entities, selections, allSelected, options]);
-    const listValue = (0, react_1.useMemo)(() => listItems.reduce((res, item) => {
-        res.set(item.id, checkboxState_1.CheckboxState.Off);
-        return res;
-    }, new Map()), [listItems]);
-    return (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [columns.length > 0
-                ? (0, jsx_runtime_1.jsx)(controlledPopup_1.ControlledPopup, { triggerRef: selectMenuRef, isOpen: isOpen, onOpenChange: setIsOpen, alignment: "bottom-left", children: (0, jsx_runtime_1.jsx)(selectList_1.SelectList, { id: selectId, title: translate("Select menu"), items: listItems, value: listValue, selectItemOnFocus: false, onChange: onSelectMenuChange }) })
-                : null, (0, jsx_runtime_1.jsx)(DataGridComponent, Object.assign({}, props, { columns: listColumns, ref: ref }))] });
-});
+            return newColumns;
+        }, [columns, options.firstColumnId, wrapper]);
+        const listItems = (0, react_1.useMemo)(() => selectionOptions
+            .filter(option => (!(selection === null || selection === void 0 ? void 0 : selection.turnOffSelectAll) && !options.turnOffSelectAll) || option.value !== checkboxColumnWrapper_1.SelectionState.All)
+            .map(option => ({
+            id: option.id,
+            value: option.value,
+            label: translate(option.label),
+            children: translate(option.label)
+        })).filter(option => option.value !== calculateSelectionState(entities, selections, allSelected, options)), [selection === null || selection === void 0 ? void 0 : selection.turnOffSelectAll, translate, entities, selections, allSelected, options]);
+        const listValue = (0, react_1.useMemo)(() => listItems.reduce((res, item) => {
+            res.set(item.id, checkboxState_1.CheckboxState.Off);
+            return res;
+        }, new Map()), [listItems]);
+        return (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [columns.length > 0
+                    ? (0, jsx_runtime_1.jsx)(controlledPopup_1.ControlledPopup, { triggerRef: selectMenuRef, isOpen: isOpen, onOpenChange: setIsOpen, alignment: "bottom-left", children: (0, jsx_runtime_1.jsx)(selectList_1.SelectList, { id: selectId, title: translate("Select menu"), items: listItems, value: listValue, selectItemOnFocus: false, onChange: onSelectMenuChange }) })
+                    : null, (0, jsx_runtime_1.jsx)(DataGridComponent, Object.assign({}, props, { columns: listColumns, ref: props.ref }))] });
+    };
+    WithSelectableRowsInner.displayName = `withSelectableRows(${DataGridComponent.displayName || DataGridComponent.name})`;
+    WithSelectableRowsInner.translations = [
+        "Select menu",
+        "Select all",
+        "Select current page",
+        "Deselect all",
+        ...checkboxColumnWrapper_1.CheckboxColumnWrapper.translations
+    ];
+    return WithSelectableRowsInner;
+};
 exports.withSelectableRows = withSelectableRows;
-exports.withSelectableRows.translations = [
-    "Select menu",
-    "Select all",
-    "Select current page",
-    "Deselect all",
-    ...checkboxColumnWrapper_1.CheckboxColumnWrapper.translations
-];

package/dist/dataGrid/withSortableColumns/columns/sortableColumnWrapper.d.ts

@@ -9,11 +9,6 @@ interface ISortableColumnOptions {
     isSortedBy: boolean;
     sortDirection: ColumnSortDirection;
     initialSortDirection?: ColumnSortDirectionTable;
-    /**
-    * @deprecated
-    * @param translate - will be removed in the next major release
-    */
-    translate?: (s: string) => string;
 }
 interface ISortableHeaderCellProps {
     columnName: string;

package/dist/dataGrid/withSortableColumns/withSortableColumns.d.ts

@@ -11,18 +11,14 @@ interface ISortableColumnsSettingsOptions {
     sortOptions?: ISortableColumnSettings;
 }
 export interface ISortableColumnsListProps<T> {
-    popupTriggerRef?: RefObject<HTMLElement>;
+    popupTriggerRef?: RefObject<HTMLElement | null>;
     columns: ISortableColumn<T>[];
     options: ISortableColumnsSettingsOptions;
     onSortChange: (newSortSettings: ISortableColumnSettings) => void;
-    /**
-    * @deprecated
-    * @param translate - will be removed in the next major release
-    */
-    translate?: (s: string) => string;
+    ref: RefObject<HTMLElement | null>;
 }
 export declare const withSortableColumns: {
-    <T extends IEntityWithId, P extends IDataGrid<T, T>>(DataGridComponent: ComponentType<P>): import("react").ForwardRefExoticComponent<import("react").PropsWithoutRef<ISortableColumnsListProps<T> & P> & import("react").RefAttributes<HTMLElement>>;
+    <T extends IEntityWithId, P extends IDataGrid<T, T>>(DataGridComponent: ComponentType<P>): (props: ISortableColumnsListProps<T> & P) => import("react/jsx-runtime").JSX.Element;
     translations: string[];
 };
 export {};

package/dist/dataGrid/withSortableColumns/withSortableColumns.js

@@ -11,9 +11,9 @@ const columnSortDirection_1 = require("./columns/columnSortDirection");
 // T - type of entity
 // P - props of wrapped component
 // eslint-disable-next-line @typescript-eslint/naming-convention
-const withSortableColumns = (DataGridComponent) => (0, react_1.forwardRef)(
+const withSortableColumns = (DataGridComponent) => (
 // eslint-disable-next-line @typescript-eslint/naming-convention
-function InnerColumnsList(props, ref) {
+function InnerColumnsList(props) {
     var _a, _b;
     const { columns, options, onSortChange } = props;
     const settingsStore = (0, react_1.useMemo)(() => { var _a, _b; return new sortableColumnsStorage_1.SortableColumnsStorage(((_a = options.columnsSettingsStorage) === null || _a === void 0 ? void 0 : _a.pageName) || "", (_b = options.columnsSettingsStorage) === null || _b === void 0 ? void 0 : _b.storage); }, [(_a = options.columnsSettingsStorage) === null || _a === void 0 ? void 0 : _a.pageName, (_b = options.columnsSettingsStorage) === null || _b === void 0 ? void 0 : _b.storage]);
@@ -52,7 +52,7 @@ function InnerColumnsList(props, ref) {
                 }, column.title, onSort)
             ] }));
     }), [allColumns, sortSettings, onSort]);
-    return (0, jsx_runtime_1.jsx)(DataGridComponent, Object.assign({}, props, { columns: [...sortedColumns], ref: ref }), "grid");
+    return (0, jsx_runtime_1.jsx)(DataGridComponent, Object.assign({}, props, { columns: [...sortedColumns], ref: props.ref }), "grid");
 });
 exports.withSortableColumns = withSortableColumns;
 exports.withSortableColumns.translations = [

package/dist/dateInput/dateInput.d.ts

@@ -7,10 +7,6 @@ export interface IDateInput extends IZenComponentProps {
     onChange: (value: string | undefined) => void;
     className?: string;
     classNamePopup?: string;
-    /**
-        @deprecated - this prop is deprecated and will be removed in the next major version.
-    */
-    hasApplyButton?: boolean;
     disabled?: boolean;
     dropDownTitle?: string;
     id?: string;

package/dist/dateInputInner/dateInputInner.d.ts

@@ -11,11 +11,6 @@ interface IDateInputInner extends IZenComponentProps {
     dateDeformatter: TDateDeformatter;
     dateFormat: string;
     onChange: (value: ICalendarRange) => void;
-    /**
-    * @deprecated
-    * @param translate - will be removed in the next major release
-    */
-    translate?: (key: string) => string;
     dateRangeMode?: boolean;
     selectTime?: boolean;
     disableFutureDates?: boolean;

package/dist/dateInputInner/dateInputInnerControlBlock.d.ts

@@ -1,7 +1,6 @@
-import { ChangeEvent } from "react";
+import { ChangeEvent, RefObject } from "react";
 import { IZenComponentProps } from "../commonHelpers/zenComponent";
 import "../formField/formField.less";
-import React from "react";
 export type TDateFormatter = (date: Date | string) => string;
 export type TDateDeformatter = (date: string) => Date;
 interface IDateInputInnerControlBlock extends IZenComponentProps {
@@ -19,7 +18,8 @@ interface IDateInputInnerControlBlock extends IZenComponentProps {
     isActiveField: boolean;
     assistiveText?: string;
     isSelected?: boolean;
+    ref?: RefObject<HTMLInputElement | null>;
 }
-export declare const DateInputInnerControlBlock: React.ForwardRefExoticComponent<IDateInputInnerControlBlock & React.RefAttributes<HTMLInputElement>>;
+export declare const DateInputInnerControlBlock: (props: IDateInputInnerControlBlock) => import("react/jsx-runtime").JSX.Element;
 export declare const TRANSLATIONS: string[];
 export {};

package/dist/dateInputInner/dateInputInnerControlBlock.js

@@ -1,7 +1,4 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.TRANSLATIONS = exports.DateInputInnerControlBlock = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
@@ -11,11 +8,9 @@ const timePicker_1 = require("../timePicker/timePicker");
 const useLanguage_1 = require("../utils/localization/useLanguage");
 const classNames_1 = require("../commonHelpers/classNames/classNames");
 const formFieldError_1 = require("../formFieldError/formFieldError");
-const react_2 = __importDefault(require("react"));
 const useDriveClassName_1 = require("../utils/theme/useDriveClassName");
-// eslint-disable-next-line @typescript-eslint/naming-convention
-exports.DateInputInnerControlBlock = react_2.default.forwardRef(function InnerDateInputControlBlock(props, ref) {
-    const { className, title, id, dateText, timePickerValue, placeholder, handleSetDateText, onBlurDateChangeHandler, requireSelection, selectTime, timeChangeHandler, isMobileView, isActiveField, assistiveText } = props;
+const DateInputInnerControlBlock = (props) => {
+    const { className, title, id, dateText, timePickerValue, placeholder, handleSetDateText, onBlurDateChangeHandler, requireSelection, selectTime, timeChangeHandler, isMobileView, isActiveField, assistiveText, ref } = props;
     const { translate } = (0, useLanguage_1.useLanguage)();
     const driveAssistiveClass = (0, useDriveClassName_1.useDriveClassName)("zen-form-field__text");
     const isHasDateError = requireSelection && !dateText;
@@ -28,7 +23,8 @@ exports.DateInputInnerControlBlock = react_2.default.forwardRef(function InnerDa
     return (0, jsx_runtime_1.jsxs)("div", { className: (0, classNames_1.classNames)(["zen-date-input-inner__control-block", className || ""]), children: [title
                 ? (0, jsx_runtime_1.jsx)("label", { htmlFor: id, className: "zen-date-input-inner__label", children: title })
                 : null, (0, jsx_runtime_1.jsxs)("div", { className: "zen-date-input-inner__inputs-block", children: [(0, jsx_runtime_1.jsxs)("div", { className: "zen-date-input-inner__inputs-block-item", children: [memoizedDateInput, isHasDateError ? (0, jsx_runtime_1.jsx)(formFieldError_1.FormFieldError, { error: translate("The date must be set") }) : null] }), memoizedTimeSelect] }), assistiveText ? (0, jsx_runtime_1.jsx)("div", { className: (0, classNames_1.classNames)(["zen-date-input-inner__assistive-text", "zen-form-field__text", driveAssistiveClass || ""]), children: assistiveText }) : null] });
-});
+};
+exports.DateInputInnerControlBlock = DateInputInnerControlBlock;
 exports.TRANSLATIONS = [
     "The date must be set",
     "The time must be set"

package/dist/dateSelectionWrapper/dateSelectionWrapper.d.ts

@@ -2,11 +2,6 @@
 import "./dateSelectionWrapper.less";
 import { IZenComponentProps } from "../commonHelpers/zenComponent";
 export interface IDateSelectionWrapper extends IZenComponentProps {
-    /**
-    * @deprecated
-    * @param translate - will be removed in the next major release
-    */
-    translate?: (s: string) => string;
     onCancel?: () => void;
     onClear?: () => void;
     onReset?: () => void;

package/dist/dialog/dialogContent.js

@@ -30,7 +30,7 @@ const DialogContent = ({ onClose, className, title, hasCloseButton, body, footer
     };
     const getFooterButton = (side, btn, ind) => {
         const buttonArgs = Object.assign(Object.assign({}, btn), { className: (0, classNames_1.classNames)(["zen-dialog-content__footer-item", btn.className || ""]) });
-        return (0, react_1.createElement)(button_1.Button, Object.assign({}, buttonArgs, { key: `${side}-${ind}`, ref: side === "right" ? getButtonRef(ind) : null }));
+        return (0, react_1.createElement)(button_1.Button, Object.assign({}, buttonArgs, { key: `${side}-${ind}`, ref: side === "right" ? getButtonRef(ind) : undefined }));
     };
     function subscriptionCondition(trigger) {
         return trigger.current !== null;

package/dist/dropdown/dropdown.d.ts

@@ -24,11 +24,6 @@ interface IFetchState<T> {
 export interface IFetchDropdownState extends IFetchState<IDropdownItem[]> {
 }
 interface IDropdownBase extends IChipsParent {
-    /**
-    * @deprecated
-    * @param translate - will be removed in the next major release
-    */
-    translate?: (s: string) => string;
     className?: string;
     dataItems?: IDropdownItem[];
     getData?: (signal?: AbortSignal, searchValue?: string) => Promise<IDropdownItem[]>;

package/dist/dropdown/dropdownList.d.ts

@@ -12,11 +12,6 @@ export interface IDropdownList extends IZenComponentProps {
     onChange: (value: IChangeCheckbox) => void;
     onSelect: (id: string) => void;
     onSingleSelect: (reset: boolean, selected?: string) => void;
-    /**
-    * @deprecated
-    * @param translate - will be removed in the next major release
-    */
-    translate?: (s: string) => string;
     backButtonName?: string;
     isAllSelected: boolean;
     listData: ICheckboxListWithActionOption[] | ISelectListItem[];
@@ -38,7 +33,7 @@ export interface IDropdownList extends IZenComponentProps {
     checkboxLabel?: string;
     isChecked?: boolean;
 }
-interface IDropdownEmptyList extends Pick<IDropdownList, "translate" | "className" | "width" | "onClearClick" | "onApplyClick" | "onCancelClick" | "hasApplyButton" | "isApplyDisabled" | "isClearButtonDisabled" | "isWithFooter"> {
+interface IDropdownEmptyList extends Pick<IDropdownList, "className" | "width" | "onClearClick" | "onApplyClick" | "onCancelClick" | "hasApplyButton" | "isApplyDisabled" | "isClearButtonDisabled" | "isWithFooter"> {
     hasError: boolean;
 }
 export declare const EmptyList: React.FC<IDropdownEmptyList>;

package/dist/dropdown/dropdownPopup.d.ts

@@ -1,9 +1,9 @@
-/// <reference types="react" />
+import { RefObject } from "react";
 import { TAlignment } from "../absolute/absolute";
 import { IZenComponentProps } from "../commonHelpers/zenComponent";
 export interface IDropdownPopup extends IZenComponentProps {
     alignment?: TAlignment;
-    triggerRef: React.RefObject<HTMLElement>;
+    triggerRef: RefObject<HTMLElement | null>;
     classNamePopup?: string;
     isMobile: boolean;
     dialogAriaLabel?: string;
@@ -22,8 +22,8 @@ export interface IDropdownPopup extends IZenComponentProps {
     handleClearClick: () => void;
     handleTriggerClick: (newVal: boolean) => void;
     onInputChange: (newValue?: string) => void;
-    inputRef: React.MutableRefObject<HTMLInputElement>;
-    contentRef: React.RefObject<HTMLDivElement>;
+    inputRef: RefObject<HTMLInputElement | null>;
+    contentRef: RefObject<HTMLDivElement | null>;
     onReadyForFocus?: (isCurrentOpen: boolean) => void;
     handleCheckboxChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
     checkboxLabel?: string;