@geotab/zenith 3.1.1-beta.0 → 3.1.1-beta.2

package/esm/timePicker/timePicker.js

@@ -1,64 +1,24 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { classNames } from "../commonHelpers/classNames/classNames";
-import { FilterButton } from "../filterButton/filterButton";
-import { useEffect, useRef, useState } from "react";
-import { ButtonType } from "../button/buttonType";
-import { ControlledPopup } from "../controlledPopup/controlledPopup";
-import { TimeSelect } from "./components/timeSelect/timeSelect";
-import { Button } from "../button/button";
-import { getSelectItemsForTimePicker } from "./timePickerUtils";
-import { useLanguage } from "../utils/localization/useLanguage";
-import { FormFieldError } from "../formFieldError/formFieldError";
-const hours = getSelectItemsForTimePicker(23);
-const minutes = getSelectItemsForTimePicker(59);
-export const TimePicker = ({ className, disabled, fullWidth, value, onChange, isMobileView, dataTimeId, error }) => {
-    const { translate } = useLanguage();
-    const classes = classNames(["zen-time-picker", disabled ? "zen-time-picker--disabled" : "", className || ""]);
-    const innerTriggerRef = useRef(null);
-    const [isOpen, setIsOpen] = useState(false);
-    const hourValue = value ? value.getHours().toString().padStart(2, "0") : "";
-    const minutesValue = value ? value.getMinutes().toString().padStart(2, "0") : "";
-    const [timeValue, setTimeValue] = useState({ hour: hourValue, minutes: minutesValue });
-    const onCancelHandler = () => {
-        var _a;
-        setTimeValue({ hour: hourValue, minutes: minutesValue });
-        setIsOpen(false);
-        (_a = innerTriggerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-    };
-    const onApplyHandler = () => {
-        var _a, _b;
-        if (!timeValue.hour && !timeValue.minutes) {
-            setIsOpen(false);
-            (_a = innerTriggerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-            return;
+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]];
         }
-        setTimeValue(timeValue);
-        setIsOpen(false);
-        (_b = innerTriggerRef.current) === null || _b === void 0 ? void 0 : _b.focus();
-        const copyDate = value ? new Date(value) : new Date();
-        copyDate.setHours(parseInt(timeValue.hour || "00"));
-        copyDate.setMinutes(parseInt(timeValue.minutes || "00"));
-        onChange(copyDate);
-    };
-    useEffect(() => {
-        if (!isOpen) {
-            setTimeValue({ hour: hourValue, minutes: minutesValue });
-        }
-    }, [hourValue, isOpen, minutesValue]);
-    const triggerClassName = classNames(["zen-time-picker__trigger", error ? "zen-time-picker__trigger--error" : "", className || ""]);
-    return _jsxs("div", { className: classes, children: [_jsx(FilterButton, Object.assign({ ref: innerTriggerRef, className: triggerClassName, onClick: () => {
-                    setIsOpen(!isOpen);
-                }, disabled: disabled, isActive: isOpen, fullWidth: fullWidth }, (dataTimeId ? { "data-time": dataTimeId } : {}), { children: `${hourValue || "24"}:${minutesValue || "00"}` })), _jsx(FormFieldError, { error: error }), _jsx(ControlledPopup, { useTrapFocusWithTrigger: "on", alignment: "bottom", onOpenChange: setIsOpen, isOpen: isOpen, triggerRef: innerTriggerRef, recalculateOnScroll: true, className: classNames(["zen-time-picker__popup", isMobileView ? "zen-time-picker__popup--mobile" : ""]), children: _jsxs("div", { className: "zen-time-picker-select", children: [_jsxs("div", { className: "zen-time-picker-select__wrapper", children: [_jsx(TimeSelect, { title: translate("Select hour"), selected: timeValue.hour, items: hours, onSelect: (newHourValue) => {
-                                        setTimeValue(Object.assign(Object.assign({}, timeValue), { hour: newHourValue }));
-                                    } }), _jsx("div", { className: "zen-time-picker-select__separator" }), _jsx(TimeSelect, { title: translate("Select minutes"), selected: timeValue.minutes, items: minutes, onSelect: (newMinutesValue) => {
-                                        setTimeValue(Object.assign(Object.assign({}, timeValue), { minutes: newMinutesValue }));
-                                    } })] }), _jsxs("div", { className: "zen-time-picker-select__footer", children: [isMobileView ? _jsx(Button, { type: ButtonType.Primary, onClick: onApplyHandler, title: translate("Apply changes"), className: "zen-time-picker-select__footer-button", children: translate("Apply") }) : null, _jsx(Button, { type: ButtonType.Tertiary, onClick: onCancelHandler, title: translate("Cancel changes"), className: "zen-time-picker-select__footer-button", children: translate("Cancel") }), isMobileView ? null : _jsx(Button, { type: ButtonType.Primary, onClick: onApplyHandler, title: translate("Apply changes"), className: "zen-time-picker-select__footer-button", children: translate("Apply") })] })] }) })] });
+    return t;
+};
+import { jsx as _jsx } from "react/jsx-runtime";
+import { FormField } from "../formField/formField";
+import { TimePickerRaw } from "../timePickerRaw/timePickerRaw";
+import { TRANSLATIONS as TimePickerRawTranslations } from "../timePickerRaw/timePickerRaw";
+const TimePickerFormField = FormField(TimePickerRaw);
+// TODO: add tests
+export const TimePicker = (_a) => {
+    var props = __rest(_a, []);
+    return _jsx(TimePickerFormField, Object.assign({}, props));
 };
 export const TRANSLATIONS = [
-    "Select hour",
-    "Select minutes",
-    "Cancel",
-    "Apply",
-    "Cancel changes",
-    "Apply changes"
+    TimePickerRawTranslations
 ];

package/esm/timePickerRaw/timePickerRaw.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { IFormFieldComponent } from "../formField/formField";
+import { ITimePickerRawDefault, TTimePickerRaw } from "./types";
+import "./timePickerRaw.less";
+export interface ITimePickerRaw extends ITimePickerRawDefault {
+}
+export declare const TimePickerRaw: React.FC<TTimePickerRaw & {
+    dataTimeId?: string;
+} & IFormFieldComponent>;
+export declare const TRANSLATIONS: string[];

package/esm/timePickerRaw/timePickerRaw.js

@@ -0,0 +1,75 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { classNames } from "../commonHelpers/classNames/classNames";
+import { FilterButton } from "../filterButton/filterButton";
+import { useEffect, useRef, useState } from "react";
+import { ButtonType } from "../button/buttonType";
+import { ControlledPopup } from "../controlledPopup/controlledPopup";
+import { TimeSelect } from "./components/timeSelect/timeSelect";
+import { Button } from "../button/button";
+import { useLanguage } from "../utils/localization/useLanguage";
+import { ReviewTextControl } from "../formGroup/components/reviewTextControl";
+import { getSelectItemsForTimePicker } from "./timePickerUtils";
+import { useMobile } from "../commonHelpers/hooks/useMobile";
+import { getAriaAttributes } from "../commonHelpers/getAriaAttributes";
+import { useFormFieldValues } from "../commonHelpers/hooks/useFormFieldValues/useFormFieldValues";
+const hours = getSelectItemsForTimePicker(23);
+const minutes = getSelectItemsForTimePicker(59);
+export const TimePickerRaw = (props) => {
+    const { className, fullWidth, dataTimeId, isReadOnly, isError } = props;
+    const ariaAttributes = getAriaAttributes(props);
+    const { translate } = useLanguage();
+    const innerTriggerRef = useRef(null);
+    const [isOpen, setIsOpen] = useState(false);
+    const isMobile = useMobile();
+    const { value, disabled, onBlur, name, onChange } = useFormFieldValues(props.controller, props);
+    const classes = classNames(["zen-time-picker", disabled ? "zen-time-picker--disabled" : "", className || ""]);
+    const hourValue = value ? value.getHours().toString().padStart(2, "0") : "";
+    const minutesValue = value ? value.getMinutes().toString().padStart(2, "0") : "";
+    const [timeValue, setTimeValue] = useState({ hour: hourValue, minutes: minutesValue });
+    const onCancelHandler = () => {
+        var _a;
+        setTimeValue({ hour: hourValue, minutes: minutesValue });
+        setIsOpen(false);
+        (_a = innerTriggerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+    };
+    const onApplyHandler = () => {
+        var _a, _b;
+        if (!timeValue.hour && !timeValue.minutes) {
+            setIsOpen(false);
+            (_a = innerTriggerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+            return;
+        }
+        setTimeValue(timeValue);
+        setIsOpen(false);
+        (_b = innerTriggerRef.current) === null || _b === void 0 ? void 0 : _b.focus();
+        const copyDate = value ? new Date(value) : new Date();
+        copyDate.setHours(parseInt(timeValue.hour || "00"));
+        copyDate.setMinutes(parseInt(timeValue.minutes || "00"));
+        onChange === null || onChange === void 0 ? void 0 : onChange(copyDate);
+    };
+    useEffect(() => {
+        if (!isOpen) {
+            setTimeValue({ hour: hourValue, minutes: minutesValue });
+        }
+    }, [hourValue, isOpen, minutesValue]);
+    const triggerClassName = classNames(["zen-time-picker__trigger", fullWidth ? "zen-time-picker__trigger--full-width" : "", isError ? "zen-time-picker__trigger--error" : "", className || ""]);
+    const shownValue = `${hourValue || "24"}:${minutesValue || "00"}`;
+    if (isReadOnly) {
+        return _jsx(ReviewTextControl, { value: shownValue });
+    }
+    return _jsxs("div", { className: classes, children: [_jsx(FilterButton, Object.assign({ onBlur: onBlur, name: name, ref: innerTriggerRef, className: triggerClassName, onClick: () => {
+                    setIsOpen(!isOpen);
+                }, disabled: disabled, isActive: isOpen, fullWidth: fullWidth }, (dataTimeId ? { "data-time": dataTimeId } : {}), ariaAttributes, { children: shownValue })), _jsx(ControlledPopup, { useTrapFocusWithTrigger: "on", alignment: "bottom", onOpenChange: setIsOpen, isOpen: isOpen, triggerRef: innerTriggerRef, recalculateOnScroll: true, className: classNames(["zen-time-picker__popup", isMobile ? "zen-time-picker__popup--mobile" : ""]), children: _jsxs("div", { className: "zen-time-picker-select", children: [_jsxs("div", { className: "zen-time-picker-select__wrapper", children: [_jsx(TimeSelect, { title: translate("Select hour"), selected: timeValue.hour, items: hours, onSelect: (newHourValue) => {
+                                        setTimeValue(Object.assign(Object.assign({}, timeValue), { hour: newHourValue }));
+                                    } }), _jsx("div", { className: "zen-time-picker-select__separator" }), _jsx(TimeSelect, { title: translate("Select minutes"), selected: timeValue.minutes, items: minutes, onSelect: (newMinutesValue) => {
+                                        setTimeValue(Object.assign(Object.assign({}, timeValue), { minutes: newMinutesValue }));
+                                    } })] }), _jsxs("div", { className: "zen-time-picker-select__footer", children: [isMobile ? _jsx(Button, { type: ButtonType.Primary, onClick: onApplyHandler, title: translate("Apply changes"), className: "zen-time-picker-select__footer-button", children: translate("Apply") }) : null, _jsx(Button, { type: ButtonType.Tertiary, onClick: onCancelHandler, title: translate("Cancel changes"), className: "zen-time-picker-select__footer-button", children: translate("Cancel") }), isMobile ? null : _jsx(Button, { type: ButtonType.Primary, onClick: onApplyHandler, title: translate("Apply changes"), className: "zen-time-picker-select__footer-button", children: translate("Apply") })] })] }) })] });
+};
+export const TRANSLATIONS = [
+    "Select hour",
+    "Select minutes",
+    "Cancel",
+    "Apply",
+    "Cancel changes",
+    "Apply changes"
+];

package/esm/timePickerRaw/types.d.ts

@@ -0,0 +1,26 @@
+import { Exclusive } from "../commonHelpers/types/exclusive";
+import { IReactFormItemController, IZenComponentProps } from "../commonHelpers/zenComponent";
+export interface ITimePickerRawBase extends IZenComponentProps {
+    fullWidth?: boolean;
+    /**
+        * @deprecated
+        * @param translate - will be removed in the next major release
+        */
+    translate?: (key: string) => string;
+    /**
+        * @deprecated
+        * @param isMobileView - will be removed in the next major release
+    */
+    isMobileView?: boolean;
+}
+export interface ITimePickerRawDefault extends ITimePickerRawBase {
+    onChange: (date: Date) => void;
+    value?: Date;
+    onBlur?: () => void;
+    disabled?: boolean;
+    name?: string;
+    error?: string;
+}
+export interface ITimePickerRawForm extends ITimePickerRawBase, IReactFormItemController {
+}
+export type TTimePickerRaw = Exclusive<ITimePickerRawDefault, ITimePickerRawForm>;

package/esm/timePickerRaw/types.js

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

package/esm/toggleButton/toggleButton.d.ts

@@ -1,12 +1,10 @@
-/// <reference types="react" />
+import { FC } from "react";
+import { TFormFieldComponentProps } from "../formField/formField";
+import { IToggleButtonRaw, TToggleButtonRaw } from "../toggleButtonRaw/types";
 import "./toggleButton.less";
-import { IZenComponentProps } from "../commonHelpers/zenComponent";
-export interface IToggleButton extends IZenComponentProps {
-    id?: string;
-    checked?: boolean;
-    disabled?: boolean;
-    title?: string;
-    isReverted?: boolean;
-    onChange?: (checked: boolean) => void;
+export interface IToggleButton extends IToggleButtonRaw {
 }
-export declare const ToggleButton: React.FC<IToggleButton>;
+type TFormFieldToggleButton = TFormFieldComponentProps<TToggleButtonRaw>;
+export type TToggleButton = Omit<TFormFieldToggleButton, "counter" | "ref">;
+export declare const ToggleButton: FC<TToggleButton>;
+export {};

package/esm/toggleButton/toggleButton.js

@@ -1,13 +1,19 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback, useId } from "react";
-import { classNames } from "../commonHelpers/classNames/classNames";
-import { TriStateCheckbox } from "../triStateCheckbox/triStateCheckbox";
-import { useDriveClassName } from "../utils/theme/useDriveClassName";
-export const ToggleButton = ({ id, checked, disabled, className, title, children, onChange, isReverted }) => {
-    const driveClassesToggler = useDriveClassName("zen-toggler");
-    const driveClassesComponent = useDriveClassName("zen-toggler-component");
-    const generatedId = useId();
-    const checkBoxId = id || generatedId;
-    const onChangeHandler = useCallback((e) => onChange && onChange(e.target.checked), [onChange]);
-    return _jsxs("div", { className: classNames(["zen-toggler", driveClassesToggler || "", className || ""]), children: [_jsx(TriStateCheckbox, { className: "zen-toggler__input", id: checkBoxId, onChange: onChangeHandler, checked: checked, disabled: disabled }), _jsxs("label", { className: classNames(["zen-toggler__label", isReverted ? "zen-toggler__label--reverted" : ""]), htmlFor: checkBoxId, title: title, "aria-label": title, children: [_jsxs("div", { className: classNames(["zen-toggler-component", driveClassesComponent || ""]), children: [_jsx("div", { className: "zen-toggler-component__focus" }), _jsx("div", { className: "zen-toggler-component__runner" })] }), children ? _jsx("div", { className: "zen-toggler__label-text", children: children }) : null] })] });
+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 } from "react/jsx-runtime";
+import { FormField } from "../formField/formField";
+import { ToggleButtonRaw } from "../toggleButtonRaw/toggleButtonRaw";
+const ToggleButtonFormField = FormField(ToggleButtonRaw);
+export const ToggleButton = (_a) => {
+    var props = __rest(_a, []);
+    return _jsx(ToggleButtonFormField, Object.assign({}, props));
 };

package/esm/toggleButtonRaw/toggleButtonRaw.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+import { TToggleButtonRaw } from "./types";
+export declare const ToggleButtonRaw: React.FC<TToggleButtonRaw>;

package/esm/toggleButtonRaw/toggleButtonRaw.js

@@ -0,0 +1,27 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React, { useCallback, useId } from "react";
+import { classNames } from "../commonHelpers/classNames/classNames";
+import { useFormFieldValues } from "../commonHelpers/hooks/useFormFieldValues/useFormFieldValues";
+import { FormFieldBanner } from "../formField/components/formFieldBanner";
+import { TriStateCheckbox } from "../triStateCheckbox/triStateCheckbox";
+import { useDriveClassName } from "../utils/theme/useDriveClassName";
+import { ReviewTextControl } from "../formGroup/components/reviewTextControl";
+import { useLanguage } from "../utils/localization/useLanguage";
+export const ToggleButtonRaw = (props) => {
+    const { id, checked, className, title, children, isReverted, isReadOnly, value: valueProp } = props;
+    const driveClassesToggler = useDriveClassName("zen-toggler");
+    const driveClassesComponent = useDriveClassName("zen-toggler-component");
+    const generatedId = useId();
+    const checkBoxId = id || generatedId;
+    const { translate } = useLanguage();
+    const val = valueProp !== undefined ? valueProp : checked;
+    const { onChange, name, value, disabled } = useFormFieldValues(props.controller, Object.assign(Object.assign({}, props), { value: val }));
+    const onChangeHandler = useCallback((e) => onChange && onChange(e.target.checked), [onChange]);
+    const label = (children && React.Children.count(children) === 1 && children.type === FormFieldBanner) ?
+        null : children ?
+        _jsx("div", { className: "zen-toggler__label-text", children: children }) : null;
+    if (isReadOnly) {
+        return _jsx(ReviewTextControl, { value: value ? translate("On") : translate("Off") });
+    }
+    return _jsxs("div", { className: classNames(["zen-toggler", driveClassesToggler || "", className || ""]), children: [_jsx(TriStateCheckbox, { name: name, className: "zen-toggler__input", id: checkBoxId, onChange: onChangeHandler, checked: value, disabled: disabled }), _jsxs("label", { className: classNames(["zen-toggler__label", isReverted ? "zen-toggler__label--reverted" : ""]), htmlFor: checkBoxId, title: title, "aria-label": title, children: [_jsxs("div", { className: classNames(["zen-toggler-component", driveClassesComponent || ""]), children: [_jsx("div", { className: "zen-toggler-component__focus" }), _jsx("div", { className: "zen-toggler-component__runner" })] }), label] })] });
+};

package/esm/toggleButtonRaw/types.d.ts

@@ -0,0 +1,26 @@
+/// <reference types="react" />
+import { Exclusive } from "../commonHelpers/types/exclusive";
+import { IZenComponentProps, IReactFormItemController } from "../commonHelpers/zenComponent";
+interface IToggleButtonBaseRaw extends IZenComponentProps {
+    id?: string;
+    title?: string;
+    isReverted?: boolean;
+    isReadOnly?: boolean;
+}
+export interface IToggleButtonDefaultRaw extends IToggleButtonBaseRaw {
+    onChange?: (checked: boolean) => void;
+    value?: boolean;
+    /**
+     * @deprecated Will be removed in Major release. Use 'value' instead.
+     */
+    checked?: boolean;
+    disabled?: boolean;
+    name?: string;
+    onBlur?: React.FocusEventHandler<HTMLInputElement>;
+}
+export interface IToggleButtonRaw extends IZenComponentProps, IToggleButtonDefaultRaw {
+}
+export interface IToggleButtonRawForm extends IZenComponentProps, IToggleButtonBaseRaw, IReactFormItemController {
+}
+export type TToggleButtonRaw = Exclusive<IToggleButtonRawForm, IToggleButtonDefaultRaw>;
+export {};

package/esm/toggleButtonRaw/types.js

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

package/esm/tooltipInfo/tooltipInfo.d.ts

@@ -0,0 +1,7 @@
+import { FC } from "react";
+import "./tooltipInfo.less";
+export interface ITooltipInfo {
+    value?: React.ReactNode;
+    className?: string;
+}
+export declare const TooltipInfo: FC<ITooltipInfo>;

package/esm/tooltipInfo/tooltipInfo.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { IconInfoCircle } from "../icons/iconInfoCircle";
+import { Tooltip } from "../tooltip/tooltip";
+import { TextIconButton } from "../textIconButton/textIconButton";
+import { classNames } from "../commonHelpers/classNames/classNames";
+import { SvgIconSize } from "../svgIcon/svgIconSize";
+import { useDrive } from "../utils/theme/useDrive";
+export const TooltipInfo = ({ value, className = "" }) => {
+    const isDrive = useDrive();
+    return (value && _jsx(Tooltip, { alignment: "top", size: "auto", trigger: _jsx(TextIconButton, { className: classNames([className, "zen-tooltip-info", isDrive ? "zen-tooltip-info--drive" : ""]), icon: IconInfoCircle, iconSize: isDrive ? SvgIconSize.Huge : SvgIconSize.Large, "aria-label": value, htmlType: "button" }), children: value }));
+};

package/esm/utils/formatDate.d.ts

@@ -3,4 +3,4 @@ export declare const monthNamesShort: string[];
 export declare const dayNames: string[];
 export declare const dayNamesShort: string[];
 export declare const formatDate: (dateSource: Date, format: string, translate: (s: string) => string) => string;
-export declare const deformatDate: (dateSource: string, format: string, translate: (s: string) => string) => "" | Date;
+export declare const deformatDate: (dateSource: string, format: string, translate: (s: string) => string) => Date | "";

package/esm/utils/localization/translations/cs-json.d.ts

@@ -245,4 +245,7 @@ export declare const translations: {
     Category: string;
     "Select visible columns": string;
     Selected: string;
+    "This field is required.": string;
+    On: string;
+    Off: string;
 };

package/esm/utils/localization/translations/cs-json.js

@@ -244,5 +244,8 @@ export const translations = {
     "Column Settings": "Nastavení sloupců",
     "Category": "Kategorie",
     "Select visible columns": "Vyberte viditelné sloupce",
-    "Selected": "Vybráno"
+    "Selected": "Vybráno",
+    "This field is required.": "Toto pole je povinné.",
+    "On": "Zapnout",
+    "Off": "Vypnout"
 };

package/esm/utils/localization/translations/de-json.d.ts

@@ -245,4 +245,7 @@ export declare const translations: {
     Category: string;
     "Select visible columns": string;
     Selected: string;
+    "This field is required.": string;
+    On: string;
+    Off: string;
 };

package/esm/utils/localization/translations/de-json.js

@@ -244,5 +244,8 @@ export const translations = {
     "Column Settings": "Spalteneinstellungen",
     "Category": "Kategorie",
     "Select visible columns": "Sichtbare Spalten auswählen",
-    "Selected": "Ausgewählt"
+    "Selected": "Ausgewählt",
+    "This field is required.": "Dieses Feld ist erforderlich.",
+    "On": "Ein",
+    "Off": "Aus"
 };

package/esm/utils/localization/translations/en-json.d.ts

@@ -299,4 +299,16 @@ export declare const translations: {
     "Top results": string;
     "Open setting conditions popup": string;
     "Close setting conditions popup": string;
+    "This field is required.": string;
+    On: string;
+    Off: string;
+    "Sub-options are not active.": string;
+    Reload: string;
+    "Could not load field data": string;
+    "We couldn't load the data for this field. Try reloading it.": string;
+    "Failed to load section": string;
+    "Please reload this section to try again. If the issue persists, contact Support.": string;
+    "Failed to load page": string;
+    "Please refresh the page and try again. If the issue persists, contact Support.": string;
+    "Failed to load {0}": string;
 };

package/esm/utils/localization/translations/en-json.js

@@ -298,5 +298,17 @@ export const translations = {
     "Currently selected": "Currently selected",
     "Top results": "Top results",
     "Open setting conditions popup": "Open setting conditions popup",
-    "Close setting conditions popup": "Close setting conditions popup"
+    "Close setting conditions popup": "Close setting conditions popup",
+    "This field is required.": "This field is required.",
+    "On": "On",
+    "Off": "Off",
+    "Sub-options are not active.": "Sub-options are not active.",
+    "Reload": "Reload",
+    "Could not load field data": "Could not load field data",
+    "We couldn't load the data for this field. Try reloading it.": "We couldn't load the data for this field. Try reloading it.",
+    "Failed to load section": "Failed to load section",
+    "Please reload this section to try again. If the issue persists, contact Support.": "Please reload this section to try again. If the issue persists, contact Support.",
+    "Failed to load page": "Failed to load page",
+    "Please refresh the page and try again. If the issue persists, contact Support.": "Please refresh the page and try again. If the issue persists, contact Support.",
+    "Failed to load {0}": "Failed to load {0}"
 };

package/esm/utils/localization/translations/es-json.d.ts

@@ -245,4 +245,7 @@ export declare const translations: {
     Category: string;
     "Select visible columns": string;
     Selected: string;
+    "This field is required.": string;
+    On: string;
+    Off: string;
 };

package/esm/utils/localization/translations/es-json.js

@@ -244,5 +244,8 @@ export const translations = {
     "Column Settings": "Configuración de columnas",
     "Category": "Categoría",
     "Select visible columns": "Seleccionar columnas visibles",
-    "Selected": "Seleccionado"
+    "Selected": "Seleccionado",
+    "This field is required.": "Este campo es obligatorio.",
+    "On": "Activar",
+    "Off": "Desactivar"
 };

package/esm/utils/localization/translations/fr-FR-json.d.ts

@@ -244,4 +244,7 @@ export declare const translations: {
     Category: string;
     "Select visible columns": string;
     Selected: string;
+    "This field is required.": string;
+    On: string;
+    Off: string;
 };

package/esm/utils/localization/translations/fr-FR-json.js

@@ -243,5 +243,8 @@ export const translations = {
     "Column Settings": "Paramètres des colonnes",
     "Category": "Catégorie",
     "Select visible columns": "Sélectionner les colonnes visibles",
-    "Selected": "Sélectionné"
+    "Selected": "Sélectionné",
+    "This field is required.": "Ce champ est requis.",
+    "On": "On",
+    "Off": "Off"
 };

package/esm/utils/localization/translations/fr-json.d.ts

@@ -245,4 +245,7 @@ export declare const translations: {
     Category: string;
     "Select visible columns": string;
     Selected: string;
+    "This field is required.": string;
+    On: string;
+    Off: string;
 };

package/esm/utils/localization/translations/fr-json.js

@@ -244,5 +244,8 @@ export const translations = {
     "Column Settings": "Paramètres des colonnes",
     "Category": "Catégorie",
     "Select visible columns": "Sélectionner les colonnes visibles",
-    "Selected": "Sélectionné"
+    "Selected": "Sélectionné",
+    "This field is required.": "Ce champ est obligatoire.",
+    "On": "Activé",
+    "Off": "Désactivé"
 };

package/esm/utils/localization/translations/id-json.d.ts

@@ -246,4 +246,7 @@ export declare const translations: {
     Category: string;
     "Select visible columns": string;
     Selected: string;
+    "This field is required.": string;
+    On: string;
+    Off: string;
 };

package/esm/utils/localization/translations/id-json.js

@@ -245,5 +245,8 @@ export const translations = {
     "Column Settings": "Pengaturan Kolom",
     "Category": "Kategori",
     "Select visible columns": "Pilih kolom yang terlihat",
-    "Selected": "Dipilih"
+    "Selected": "Dipilih",
+    "This field is required.": "Bidang ini harus diisi.",
+    "On": "Aktif",
+    "Off": "Nonaktif"
 };

package/esm/utils/localization/translations/it-json.d.ts

@@ -245,4 +245,7 @@ export declare const translations: {
     Category: string;
     "Select visible columns": string;
     Selected: string;
+    "This field is required.": string;
+    On: string;
+    Off: string;
 };

package/esm/utils/localization/translations/it-json.js

@@ -244,5 +244,8 @@ export const translations = {
     "Column Settings": "Impostazioni colonna",
     "Category": "Categoria",
     "Select visible columns": "Selezionare colonne visibili",
-    "Selected": "Selezionato"
+    "Selected": "Selezionato",
+    "This field is required.": "Questo campo è obbligatorio.",
+    "On": "On",
+    "Off": "Off"
 };

package/esm/utils/localization/translations/ja-json.d.ts

@@ -245,4 +245,7 @@ export declare const translations: {
     Category: string;
     "Select visible columns": string;
     Selected: string;
+    "This field is required.": string;
+    On: string;
+    Off: string;
 };

package/esm/utils/localization/translations/ja-json.js

@@ -244,5 +244,8 @@ export const translations = {
     "Column Settings": "列の設定",
     "Category": "カテゴリ",
     "Select visible columns": "表示列を選択",
-    "Selected": "選択車両"
+    "Selected": "選択車両",
+    "This field is required.": "このフィールドは必須です。",
+    "On": "オン",
+    "Off": "オフ"
 };

package/esm/utils/localization/translations/ko-KR-json.d.ts

@@ -252,4 +252,7 @@ export declare const translations: {
     Category: string;
     "Select visible columns": string;
     Selected: string;
+    "This field is required.": string;
+    On: string;
+    Off: string;
 };

package/esm/utils/localization/translations/ko-KR-json.js

@@ -251,5 +251,8 @@ export const translations = {
     "Column Settings": "열 설정",
     "Category": "범주",
     "Select visible columns": "표시되는 열 선택",
-    "Selected": "선택됨"
+    "Selected": "선택됨",
+    "This field is required.": "이 필드는 필수입니다.",
+    "On": "~에",
+    "Off": "끄다"
 };

package/esm/utils/localization/translations/ms-json.d.ts

@@ -245,4 +245,7 @@ export declare const translations: {
     Category: string;
     "Select visible columns": string;
     Selected: string;
+    "This field is required.": string;
+    On: string;
+    Off: string;
 };

package/esm/utils/localization/translations/ms-json.js

@@ -244,5 +244,8 @@ export const translations = {
     "Column Settings": "Tetapan Lajur",
     "Category": "Kategori",
     "Select visible columns": "Pilih lajur yang boleh dilihat",
-    "Selected": "Dipilih"
+    "Selected": "Dipilih",
+    "This field is required.": "Medan ini diperlukan.",
+    "On": "Hidup",
+    "Off": "Mati"
 };

package/esm/utils/localization/translations/nl-json.d.ts

@@ -245,4 +245,7 @@ export declare const translations: {
     Category: string;
     "Select visible columns": string;
     Selected: string;
+    "This field is required.": string;
+    On: string;
+    Off: string;
 };

package/esm/utils/localization/translations/nl-json.js

@@ -244,5 +244,8 @@ export const translations = {
     "Column Settings": "Kolominstellingen",
     "Category": "Categorie",
     "Select visible columns": "Zichtbare kolommen selecteren",
-    "Selected": "Geselecteerd"
+    "Selected": "Geselecteerd",
+    "This field is required.": "Dit veld is verplicht.",
+    "On": "Aan",
+    "Off": "Uit"
 };