@react-spectrum/switch - npm Package Compare versions

Comparing version 3.0.0-rc.1 to 3.0.0-rc.2

dist/main.js

 require("./main.css");
 
-var _babelRuntimeHelpersEsmExtends = $parcel$interopDefault(require("@babel/runtime/helpers/esm/extends"));
+var _babelRuntimeHelpersExtends = $parcel$interopDefault(require("@babel/runtime/helpers/extends"));
 
-var _babelRuntimeHelpersEsmObjectWithoutProperties = $parcel$interopDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
+var _babelRuntimeHelpersObjectWithoutProperties = $parcel$interopDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 
@@ -36,9 +36,9 @@ var _temp = require("@react-spectrum/utils");
 $cda9ba0aff7b7f1a47519e47bc81$exports = {
-  "spectrum-ToggleSwitch": "_spectrum-ToggleSwitch_9406c",
-  "spectrum-ToggleSwitch-input": "_spectrum-ToggleSwitch-input_9406c",
-  "spectrum-ToggleSwitch-switch": "_spectrum-ToggleSwitch-switch_9406c",
-  "spectrum-ToggleSwitch-label": "_spectrum-ToggleSwitch-label_9406c",
-  "spectrum-ToggleSwitch--quiet": "_spectrum-ToggleSwitch--quiet_9406c",
-  "focus-ring": "_focus-ring_9406c",
-  "spectrum-ToggleSwitch--ab": "_spectrum-ToggleSwitch--ab_9406c"
+  "spectrum-ToggleSwitch": "_spectrum-ToggleSwitch_62955",
+  "spectrum-ToggleSwitch-input": "_spectrum-ToggleSwitch-input_62955",
+  "spectrum-ToggleSwitch-switch": "_spectrum-ToggleSwitch-switch_62955",
+  "spectrum-ToggleSwitch-label": "_spectrum-ToggleSwitch-label_62955",
+  "spectrum-ToggleSwitch--quiet": "_spectrum-ToggleSwitch--quiet_62955",
+  "focus-ring": "_focus-ring_62955",
+  "spectrum-ToggleSwitch--ab": "_spectrum-ToggleSwitch--ab_62955"
 };
@@ -57,3 +57,3 @@ var $cda9ba0aff7b7f1a47519e47bc81$$interop$default = $parcel$interopDefault($cda9ba0aff7b7f1a47519e47bc81$exports);
       children = _props.children,
-      otherProps = _babelRuntimeHelpersEsmObjectWithoutProperties(_props, ["isEmphasized", "isDisabled", "autoFocus", "children"]);
+      otherProps = _babelRuntimeHelpersObjectWithoutProperties(_props, ["isEmphasized", "isDisabled", "autoFocus", "children"]);
 
@@ -63,31 +63,37 @@ var _useStyleProps = useStyleProps(otherProps),
 
+  var inputRef = useRef(null);
+  var domRef = useFocusableRef(ref, inputRef);
   var state = useToggleState(props);
 
-  var _useSwitch = useSwitch(props, state),
+  var _useSwitch = useSwitch(props, state, inputRef),
       inputProps = _useSwitch.inputProps;
 
-  var inputRef = useRef(null);
-  var domRef = useFocusableRef(ref, inputRef);
-  return _react.createElement("label", _babelRuntimeHelpersEsmExtends({}, filterDOMProps(otherProps, {
-    'aria-label': false
-  }), styleProps, {
-    ref: domRef,
-    className: classNames($cda9ba0aff7b7f1a47519e47bc81$$interop$default, 'spectrum-ToggleSwitch', {
-      'spectrum-ToggleSwitch--quiet': !isEmphasized,
-      'is-disabled': isDisabled
-    }, styleProps.className)
-  }), _react.createElement(FocusRing, {
-    focusRingClass: classNames($cda9ba0aff7b7f1a47519e47bc81$$interop$default, 'focus-ring'),
-    autoFocus: autoFocus
-  }, _react.createElement("input", _babelRuntimeHelpersEsmExtends({}, inputProps, {
-    ref: inputRef,
-    className: classNames($cda9ba0aff7b7f1a47519e47bc81$$interop$default, 'spectrum-ToggleSwitch-input')
-  }))), _react.createElement("span", {
-    className: classNames($cda9ba0aff7b7f1a47519e47bc81$$interop$default, 'spectrum-ToggleSwitch-switch')
-  }), children && _react.createElement("span", {
-    className: classNames($cda9ba0aff7b7f1a47519e47bc81$$interop$default, 'spectrum-ToggleSwitch-label')
-  }, children));
+  return (/*#__PURE__*/_react.createElement("label", _babelRuntimeHelpersExtends({}, filterDOMProps(otherProps, {
+      'aria-label': false
+    }), styleProps, {
+      ref: domRef,
+      className: classNames($cda9ba0aff7b7f1a47519e47bc81$$interop$default, 'spectrum-ToggleSwitch', {
+        'spectrum-ToggleSwitch--quiet': !isEmphasized,
+        'is-disabled': isDisabled
+      }, styleProps.className)
+    }), /*#__PURE__*/_react.createElement(FocusRing, {
+      focusRingClass: classNames($cda9ba0aff7b7f1a47519e47bc81$$interop$default, 'focus-ring'),
+      autoFocus: autoFocus
+    }, /*#__PURE__*/_react.createElement("input", _babelRuntimeHelpersExtends({}, inputProps, {
+      ref: inputRef,
+      className: classNames($cda9ba0aff7b7f1a47519e47bc81$$interop$default, 'spectrum-ToggleSwitch-input')
+    }))), /*#__PURE__*/_react.createElement("span", {
+      className: classNames($cda9ba0aff7b7f1a47519e47bc81$$interop$default, 'spectrum-ToggleSwitch-switch')
+    }), children && /*#__PURE__*/_react.createElement("span", {
+      className: classNames($cda9ba0aff7b7f1a47519e47bc81$$interop$default, 'spectrum-ToggleSwitch-label')
+    }, children))
+  );
 }
+/**
+ * Switches allow users to turn an individual option on or off.
+ * They are usually used to activate or deactivate a specific setting.
+ */
 
+
 var Switch = forwardRef($cfd98b4ef790c685c76d4e97c355e9$var$Switch);
 exports.Switch = Switch;

dist/module.js

@@ -18,9 +18,9 @@ import "./main.css";
 $ab7fbdc8aa292e42d8b888345e2c9755$exports = {
-  "spectrum-ToggleSwitch": "_spectrum-ToggleSwitch_9406c",
-  "spectrum-ToggleSwitch-input": "_spectrum-ToggleSwitch-input_9406c",
-  "spectrum-ToggleSwitch-switch": "_spectrum-ToggleSwitch-switch_9406c",
-  "spectrum-ToggleSwitch-label": "_spectrum-ToggleSwitch-label_9406c",
-  "spectrum-ToggleSwitch--quiet": "_spectrum-ToggleSwitch--quiet_9406c",
-  "focus-ring": "_focus-ring_9406c",
-  "spectrum-ToggleSwitch--ab": "_spectrum-ToggleSwitch--ab_9406c"
+  "spectrum-ToggleSwitch": "_spectrum-ToggleSwitch_62955",
+  "spectrum-ToggleSwitch-input": "_spectrum-ToggleSwitch-input_62955",
+  "spectrum-ToggleSwitch-switch": "_spectrum-ToggleSwitch-switch_62955",
+  "spectrum-ToggleSwitch-label": "_spectrum-ToggleSwitch-label_62955",
+  "spectrum-ToggleSwitch--quiet": "_spectrum-ToggleSwitch--quiet_62955",
+  "focus-ring": "_focus-ring_62955",
+  "spectrum-ToggleSwitch--ab": "_spectrum-ToggleSwitch--ab_62955"
 };
@@ -43,29 +43,35 @@ var $ab7fbdc8aa292e42d8b888345e2c9755$$interop$default = $parcel$interopDefault($ab7fbdc8aa292e42d8b888345e2c9755$exports);
   } = useStyleProps(otherProps);
+  let inputRef = useRef(null);
+  let domRef = useFocusableRef(ref, inputRef);
   let state = useToggleState(props);
   let {
     inputProps
-  } = useSwitch(props, state);
-  let inputRef = useRef(null);
-  let domRef = useFocusableRef(ref, inputRef);
-  return _react.createElement("label", _babelRuntimeHelpersEsmExtends({}, filterDOMProps(otherProps, {
-    'aria-label': false
-  }), styleProps, {
-    ref: domRef,
-    className: classNames($ab7fbdc8aa292e42d8b888345e2c9755$$interop$default, 'spectrum-ToggleSwitch', {
-      'spectrum-ToggleSwitch--quiet': !isEmphasized,
-      'is-disabled': isDisabled
-    }, styleProps.className)
-  }), _react.createElement(FocusRing, {
-    focusRingClass: classNames($ab7fbdc8aa292e42d8b888345e2c9755$$interop$default, 'focus-ring'),
-    autoFocus: autoFocus
-  }, _react.createElement("input", _babelRuntimeHelpersEsmExtends({}, inputProps, {
-    ref: inputRef,
-    className: classNames($ab7fbdc8aa292e42d8b888345e2c9755$$interop$default, 'spectrum-ToggleSwitch-input')
-  }))), _react.createElement("span", {
-    className: classNames($ab7fbdc8aa292e42d8b888345e2c9755$$interop$default, 'spectrum-ToggleSwitch-switch')
-  }), children && _react.createElement("span", {
-    className: classNames($ab7fbdc8aa292e42d8b888345e2c9755$$interop$default, 'spectrum-ToggleSwitch-label')
-  }, children));
+  } = useSwitch(props, state, inputRef);
+  return (/*#__PURE__*/_react.createElement("label", _babelRuntimeHelpersEsmExtends({}, filterDOMProps(otherProps, {
+      'aria-label': false
+    }), styleProps, {
+      ref: domRef,
+      className: classNames($ab7fbdc8aa292e42d8b888345e2c9755$$interop$default, 'spectrum-ToggleSwitch', {
+        'spectrum-ToggleSwitch--quiet': !isEmphasized,
+        'is-disabled': isDisabled
+      }, styleProps.className)
+    }), /*#__PURE__*/_react.createElement(FocusRing, {
+      focusRingClass: classNames($ab7fbdc8aa292e42d8b888345e2c9755$$interop$default, 'focus-ring'),
+      autoFocus: autoFocus
+    }, /*#__PURE__*/_react.createElement("input", _babelRuntimeHelpersEsmExtends({}, inputProps, {
+      ref: inputRef,
+      className: classNames($ab7fbdc8aa292e42d8b888345e2c9755$$interop$default, 'spectrum-ToggleSwitch-input')
+    }))), /*#__PURE__*/_react.createElement("span", {
+      className: classNames($ab7fbdc8aa292e42d8b888345e2c9755$$interop$default, 'spectrum-ToggleSwitch-switch')
+    }), children && /*#__PURE__*/_react.createElement("span", {
+      className: classNames($ab7fbdc8aa292e42d8b888345e2c9755$$interop$default, 'spectrum-ToggleSwitch-label')
+    }, children))
+  );
 }
+/**
+ * Switches allow users to turn an individual option on or off.
+ * They are usually used to activate or deactivate a specific setting.
+ */
 
+
 export const Switch = forwardRef($b91dce6275a3bae543434fec58592dc$var$Switch);

dist/types.d.ts

 import { SpectrumSwitchProps } from "@react-types/switch";
+/**
+ * Switches allow users to turn an individual option on or off.
+ * They are usually used to activate or deactivate a specific setting.
+ */
 export const Switch: React.ForwardRefExoticComponent<SpectrumSwitchProps & React.RefAttributes<import("@react-types/shared").FocusableRefValue<HTMLLabelElement, HTMLLabelElement>>>;
 
 //# sourceMappingURL=types.d.ts.map

package.json

 {
   "name": "@react-spectrum/switch",
-  "version": "3.0.0-rc.1",
+  "version": "3.0.0-rc.2",
   "description": "Spectrum UI components in React",
@@ -32,18 +32,17 @@ "license": "Apache-2.0",
     "@babel/runtime": "^7.6.2",
-    "@react-aria/focus": "^3.0.0-rc.1",
-    "@react-aria/switch": "^3.0.0-rc.1",
-    "@react-aria/utils": "^3.0.0-rc.1",
-    "@react-spectrum/provider": "^3.0.0-rc.1",
-    "@react-spectrum/utils": "^3.0.0-rc.1",
-    "@react-stately/toggle": "^3.0.0-rc.1",
-    "@react-types/shared": "^3.0.0-rc.1",
-    "@react-types/switch": "^3.0.0-rc.1",
-    "@spectrum-icons/ui": "^3.0.0-rc.1"
+    "@react-aria/focus": "^3.0.0-rc.2",
+    "@react-aria/switch": "^3.0.0-rc.2",
+    "@react-aria/utils": "^3.0.0-rc.2",
+    "@react-spectrum/utils": "^3.0.0-rc.2",
+    "@react-stately/toggle": "^3.0.0-rc.2",
+    "@react-types/shared": "^3.0.0-rc.2",
+    "@react-types/switch": "^3.0.0-rc.2",
+    "@spectrum-icons/ui": "^3.0.0-rc.2"
   },
   "devDependencies": {
-    "@adobe/spectrum-css-temp": "^3.0.0-alpha.2"
+    "@adobe/spectrum-css-temp": "^3.0.0-alpha.1"
   },
   "peerDependencies": {
-    "react": "^16.8.0",
-    "react-dom": "^16.8.0"
+    "@react-spectrum/provider": "^3.0.0-rc.1",
+    "react": "^16.8.0"
   },
@@ -53,3 +52,3 @@ "publishConfig": {
   },
-  "gitHead": "9332df14cb224daa16524acb1174e5921e136528"
+  "gitHead": "207e6ee9076905c96638a7f81a367758872e1410"
 }

No alert changes

Improved metrics

Total package byte prevSize

36488

increased by48.8%

Dependency count

11

decreased by-8.33%

Number of package files

8

increased by14.29%

Lines of code

462

increased by3.13%

Dependency changes

• + Addedreact@19.0.0(transitive)

• + Addedreact-dom@19.0.0(transitive)

• + Addedscheduler@0.25.0(transitive)

• - Removed@react-spectrum/provider@^3.0.0-rc.1

• - Removedreact-dom@16.14.0(transitive)

• - Removedscheduler@0.19.1(transitive)

• Updated@react-aria/focus@^3.0.0-rc.2

• Updated@react-aria/switch@^3.0.0-rc.2

• Updated@react-aria/utils@^3.0.0-rc.2

• Updated@react-spectrum/utils@^3.0.0-rc.2

• Updated@react-stately/toggle@^3.0.0-rc.2

• Updated@react-types/shared@^3.0.0-rc.2

• Updated@react-types/switch@^3.0.0-rc.2

• Updated@spectrum-icons/ui@^3.0.0-rc.2