@geotab/zenith 3.1.1-beta.6 → 3.2.0-beta.1

package/esm/toggleButtonRaw/toggleButtonRaw.js

@@ -1,3 +1,4 @@
+import { injectString } from "../utils/localization/translationsDictionary";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import React, { useCallback, useId } from "react";
 import { classNames } from "../commonHelpers/classNames/classNames";
@@ -7,21 +8,113 @@ 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] })] });
-};
+injectString("cs", "On", "Zapnout");
+injectString("da-DK", "On", "P\xE5");
+injectString("de", "On", "Ein");
+injectString("en", "On", "On");
+injectString("es", "On", "Activar");
+injectString("fi-FI", "On", "P\xE4\xE4lle");
+injectString("fr", "On", "Activ\xE9");
+injectString("fr-FR", "On", "On");
+injectString("hu-HU", "On", "Bekapcsolva");
+injectString("id", "On", "Aktif");
+injectString("it", "On", "On");
+injectString("ja", "On", "\u30AA\u30F3");
+injectString("ko-KR", "On", "~\uC5D0");
+injectString("ms", "On", "Hidup");
+injectString("nb-NO", "On", "P\xE5");
+injectString("nl", "On", "Aan");
+injectString("pl", "On", "W\u0142.");
+injectString("pt-BR", "On", "Ativado");
+injectString("sk-SK", "On", "Zapnut\xE9");
+injectString("sv", "On", "P\xE5");
+injectString("th", "On", "\u0E40\u0E1B\u0E34\u0E14");
+injectString("tr", "On", "A\xE7\u0131k");
+injectString("zh-Hans", "On", "\u5F00\u542F");
+injectString("zh-TW", "On", "\u958B\u555F");
+injectString("cs", "Off", "Vypnout");
+injectString("da-DK", "Off", "Slukket");
+injectString("de", "Off", "Aus");
+injectString("en", "Off", "Off");
+injectString("es", "Off", "Desactivar");
+injectString("fi-FI", "Off", "Pois");
+injectString("fr", "Off", "D\xE9sactiv\xE9");
+injectString("fr-FR", "Off", "Off");
+injectString("hu-HU", "Off", "Kikapcsolva");
+injectString("id", "Off", "Nonaktif");
+injectString("it", "Off", "Off");
+injectString("ja", "Off", "\u30AA\u30D5");
+injectString("ko-KR", "Off", "\uB044\uB2E4");
+injectString("ms", "Off", "Mati");
+injectString("nb-NO", "Off", "Av");
+injectString("nl", "Off", "Uit");
+injectString("pl", "Off", "Wy\u0142.");
+injectString("pt-BR", "Off", "Desativado");
+injectString("sk-SK", "Off", "Vypnut\xE9");
+injectString("sv", "Off", "Av");
+injectString("th", "Off", "\u0E1B\u0E34\u0E14");
+injectString("tr", "Off", "Kapal\u0131");
+injectString("zh-Hans", "Off", "\u5173\u95ED");
+injectString("zh-TW", "Off", "\u95DC\u9589");
+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]
+    })]
+  });
+};