@cloudflare/component-toggle 4.2.39 → 4.2.43

package/CHANGELOG.md

@@ -3,6 +3,38 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [4.2.43](http://stash.cfops.it:7999/fe/stratus/compare/@cloudflare/component-toggle@4.2.42...@cloudflare/component-toggle@4.2.43) (2021-12-22)
+
+**Note:** Version bump only for package @cloudflare/component-toggle
+
+
+
+
+
+## [4.2.42](http://stash.cfops.it:7999/fe/stratus/compare/@cloudflare/component-toggle@4.2.40...@cloudflare/component-toggle@4.2.42) (2021-12-21)
+
+**Note:** Version bump only for package @cloudflare/component-toggle
+
+
+
+
+
+## [4.2.41](http://stash.cfops.it:7999/fe/stratus/compare/@cloudflare/component-toggle@4.2.40...@cloudflare/component-toggle@4.2.41) (2021-12-21)
+
+**Note:** Version bump only for package @cloudflare/component-toggle
+
+
+
+
+
+## [4.2.40](http://stash.cfops.it:7999/fe/stratus/compare/@cloudflare/component-toggle@4.2.39...@cloudflare/component-toggle@4.2.40) (2021-12-09)
+
+**Note:** Version bump only for package @cloudflare/component-toggle
+
+
+
+
+
 ## [4.2.39](http://stash.cfops.it:7999/fe/stratus/compare/@cloudflare/component-toggle@4.2.38...@cloudflare/component-toggle@4.2.39) (2021-12-07)
 
 **Note:** Version bump only for package @cloudflare/component-toggle

package/dist/Toggle.d.ts

@@ -335,6 +335,7 @@ declare type ToggleProps = Omit<ComponentProps<typeof Container>, 'value' | 'typ
     color?: string;
     borderColor?: string;
     testId?: string;
+    describedBy?: string;
 };
 export declare const toggleProperties: string[];
 declare const Toggle: React.FC<ToggleProps>;

package/es/Toggle.js

@@ -102,12 +102,13 @@ const ToggleIcon = createComponent(({
   }
 }));
 // Used by LabelledToggle
-export const toggleProperties = ['value', 'onChange', 'labelledBy', 'invalid', 'height', 'color', 'testId'];
+export const toggleProperties = ['value', 'onChange', 'labelledBy', 'invalid', 'height', 'color', 'testId', 'describedBy'];
 
 const Toggle = (_ref) => {
   let id = _ref.id,
       value = _ref.value,
       labelledBy = _ref.labelledBy,
+      describedBy = _ref.describedBy,
       disabled = _ref.disabled,
       onChange = _ref.onChange,
       testId = _ref.testId,
@@ -117,7 +118,7 @@ const Toggle = (_ref) => {
       name = _ref.name,
       _ref$height = _ref.height,
       height = _ref$height === void 0 ? 24 : _ref$height,
-      rest = _objectWithoutProperties(_ref, ["id", "value", "labelledBy", "disabled", "onChange", "testId", "color", "borderColor", "invalid", "name", "height"]);
+      rest = _objectWithoutProperties(_ref, ["id", "value", "labelledBy", "describedBy", "disabled", "onChange", "testId", "color", "borderColor", "invalid", "name", "height"]);
 
   const controlSize = height - 4;
   return /*#__PURE__*/React.createElement(Container, _extends({}, rest, {
@@ -134,6 +135,7 @@ const Toggle = (_ref) => {
     name: name,
     onChange: disabled || !onChange ? undefined : e => onChange(e.target.checked),
     "aria-labelledby": labelledBy,
+    "aria-describedby": describedBy,
     disabled: disabled,
     "data-testid": testId
   }), /*#__PURE__*/React.createElement(ToggleIcon, {

package/lib/Toggle.js

@@ -119,13 +119,14 @@ var ToggleIcon = (0, _styleContainer.createComponent)(function (_ref2) {
   };
 });
 // Used by LabelledToggle
-var toggleProperties = ['value', 'onChange', 'labelledBy', 'invalid', 'height', 'color', 'testId'];
+var toggleProperties = ['value', 'onChange', 'labelledBy', 'invalid', 'height', 'color', 'testId', 'describedBy'];
 exports.toggleProperties = toggleProperties;
 
 var Toggle = function Toggle(_ref3) {
   var id = _ref3.id,
       value = _ref3.value,
       labelledBy = _ref3.labelledBy,
+      describedBy = _ref3.describedBy,
       disabled = _ref3.disabled,
       onChange = _ref3.onChange,
       testId = _ref3.testId,
@@ -135,7 +136,7 @@ var Toggle = function Toggle(_ref3) {
       name = _ref3.name,
       _ref3$height = _ref3.height,
       height = _ref3$height === void 0 ? 24 : _ref3$height,
-      rest = _objectWithoutProperties(_ref3, ["id", "value", "labelledBy", "disabled", "onChange", "testId", "color", "borderColor", "invalid", "name", "height"]);
+      rest = _objectWithoutProperties(_ref3, ["id", "value", "labelledBy", "describedBy", "disabled", "onChange", "testId", "color", "borderColor", "invalid", "name", "height"]);
 
   var controlSize = height - 4;
   return /*#__PURE__*/_react.default.createElement(Container, _extends({}, rest, {
@@ -154,6 +155,7 @@ var Toggle = function Toggle(_ref3) {
       return onChange(e.target.checked);
     },
     "aria-labelledby": labelledBy,
+    "aria-describedby": describedBy,
     disabled: disabled,
     "data-testid": testId
   }), /*#__PURE__*/_react.default.createElement(ToggleIcon, {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@cloudflare/component-toggle",
   "description": "Cloudflare Toggle Component",
-  "version": "4.2.39",
+  "version": "4.2.43",
   "main": "lib/index.js",
   "module": "es/index.js",
   "author": "James Kyle <jkyle@cloudflare.com>",
@@ -11,12 +11,12 @@
     "access": "public"
   },
   "dependencies": {
-    "@cloudflare/component-icon": "^6.6.2",
-    "@cloudflare/elements": "^1.11.34",
-    "@cloudflare/intl-react": "^1.9.20",
-    "@cloudflare/style-const": "^5.1.17",
-    "@cloudflare/style-container": "^7.5.23",
-    "@cloudflare/types": "^6.11.15",
+    "@cloudflare/component-icon": "^6.6.6",
+    "@cloudflare/elements": "^1.11.37",
+    "@cloudflare/intl-react": "^1.9.23",
+    "@cloudflare/style-const": "^5.1.20",
+    "@cloudflare/style-container": "^7.5.26",
+    "@cloudflare/types": "^6.11.18",
     "prop-types": "^15.6.0"
   },
   "peerDependencies": {
@@ -33,5 +33,5 @@
     "test-coverage": "stratus test --coverage",
     "test-watch": "stratus test --watch"
   },
-  "gitHead": "66ddc7cf6a020d19ae83d950f5d0f8030b17527a"
+  "gitHead": "97022ab0ef7b3baa3a3efe830c7776b7c340dd2f"
 }