@festo-ui/react 7.0.0-dev.368 → 7.0.0-dev.371

package/lib/forms/checkbox/Checkbox.js

@@ -52,6 +52,7 @@ function Checkbox(_ref) {
       type: "checkbox",
       id: id,
       disabled: disabled,
+      required: required,
       onChange: e => handleChange(e),
       ...props,
       checked: isChecked

package/lib/forms/switch/Switch.d.ts

@@ -4,10 +4,11 @@ export interface SwitchProps extends ClassNameProps {
     labelPosition?: 'before' | 'after' | 'below';
     large?: boolean;
     title: string;
-    value: boolean;
+    value?: boolean;
+    defaultValue?: boolean;
     disabled?: boolean;
     onChange?: (value: boolean) => void;
     id?: string;
 }
-declare function Switch({ labelPosition, large, title, value, disabled, onChange, className, id: idProps, }: SwitchProps): JSX.Element;
+declare function Switch({ labelPosition, large, title, value, defaultValue, disabled, onChange, className, id: idProps, }: SwitchProps): JSX.Element;
 export default Switch;

package/lib/forms/switch/Switch.js

@@ -1,5 +1,5 @@
-import { useState, useEffect } from 'react';
 import classNames from 'classnames';
+import useControlled from '../../helper/useControlled';
 import useId from '../../helper/useId';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -9,6 +9,7 @@ function Switch(_ref) {
     large = false,
     title,
     value,
+    defaultValue,
     disabled = false,
     onChange,
     className,
@@ -20,10 +21,10 @@ function Switch(_ref) {
   }, {
     'fwe-switch-lg': large
   }, className);
-  const [currentValue, setCurrentValue] = useState(value);
-  useEffect(() => {
-    setCurrentValue(value);
-  }, [value]);
+  const [currentValue, setCurrentValue] = useControlled({
+    controlled: value,
+    default: defaultValue
+  });
   const handleChange = () => {
     const newValue = !currentValue;
     setCurrentValue(newValue);

package/node/lib/forms/checkbox/Checkbox.js

@@ -58,6 +58,7 @@ function Checkbox(_ref) {
       type: "checkbox",
       id: id,
       disabled: disabled,
+      required: required,
       onChange: e => handleChange(e),
       ...props,
       checked: isChecked

package/node/lib/forms/switch/Switch.js

@@ -4,8 +4,8 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = require("react");
 var _classnames = _interopRequireDefault(require("classnames"));
+var _useControlled = _interopRequireDefault(require("../../helper/useControlled"));
 var _useId = _interopRequireDefault(require("../../helper/useId"));
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -15,6 +15,7 @@ function Switch(_ref) {
     large = false,
     title,
     value,
+    defaultValue,
     disabled = false,
     onChange,
     className,
@@ -26,10 +27,10 @@ function Switch(_ref) {
   }, {
     'fwe-switch-lg': large
   }, className);
-  const [currentValue, setCurrentValue] = (0, _react.useState)(value);
-  (0, _react.useEffect)(() => {
-    setCurrentValue(value);
-  }, [value]);
+  const [currentValue, setCurrentValue] = (0, _useControlled.default)({
+    controlled: value,
+    default: defaultValue
+  });
   const handleChange = () => {
     const newValue = !currentValue;
     setCurrentValue(newValue);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@festo-ui/react",
-  "version": "7.0.0-dev.368",
+  "version": "7.0.0-dev.371",
   "author": "Festo UI (styleguide@festo.com)",
   "license": "apache-2.0",
   "exports": {