@carbon/react 1.27.0-rc.0 → 1.28.0-rc.0

package/lib/components/SkeletonIcon/SkeletonIcon.js

@@ -21,16 +21,16 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
-var _excluded = ["className"];
-
-var SkeletonIcon = function SkeletonIcon(_ref) {
-  var _classNames;
-
-  var className = _ref.className,
-      other = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-
-  var prefix = usePrefix.usePrefix();
-  var skeletonIconClasses = cx__default["default"]((_classNames = {}, _rollupPluginBabelHelpers.defineProperty(_classNames, "".concat(prefix, "--icon--skeleton"), true), _rollupPluginBabelHelpers.defineProperty(_classNames, className, className), _classNames));
+const SkeletonIcon = _ref => {
+  let {
+    className,
+    ...other
+  } = _ref;
+  const prefix = usePrefix.usePrefix();
+  const skeletonIconClasses = cx__default["default"]({
+    [`${prefix}--icon--skeleton`]: true,
+    [className]: className
+  });
   return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({
     className: skeletonIconClasses
   }, other));

package/lib/components/SkeletonPlaceholder/SkeletonPlaceholder.js

@@ -21,16 +21,16 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
-var _excluded = ["className"];
-
-var SkeletonPlaceholder = function SkeletonPlaceholder(_ref) {
-  var _classNames;
-
-  var className = _ref.className,
-      other = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-
-  var prefix = usePrefix.usePrefix();
-  var skeletonPlaceholderClasses = cx__default["default"]((_classNames = {}, _rollupPluginBabelHelpers.defineProperty(_classNames, "".concat(prefix, "--skeleton__placeholder"), true), _rollupPluginBabelHelpers.defineProperty(_classNames, className, className), _classNames));
+const SkeletonPlaceholder = _ref => {
+  let {
+    className,
+    ...other
+  } = _ref;
+  const prefix = usePrefix.usePrefix();
+  const skeletonPlaceholderClasses = cx__default["default"]({
+    [`${prefix}--skeleton__placeholder`]: true,
+    [className]: className
+  });
   return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({
     className: skeletonPlaceholderClasses
   }, other));

package/lib/components/SkeletonText/SkeletonText.js

@@ -22,29 +22,31 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
-var _excluded = ["paragraph", "lineCount", "width", "heading", "className"];
-var randoms = [0.973051493507435, 0.15334737213558558, 0.5671034553053769];
+const randoms = [0.973051493507435, 0.15334737213558558, 0.5671034553053769];
 
 function getRandomInt(min, max, n) {
   return Math.floor(randoms[n % 3] * (max - min + 1)) + min;
 }
 
-var SkeletonText = function SkeletonText(_ref) {
-  var _classNames;
-
-  var paragraph = _ref.paragraph,
-      lineCount = _ref.lineCount,
-      width = _ref.width,
-      heading = _ref.heading,
-      className = _ref.className,
-      other = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-
-  var prefix = usePrefix.usePrefix();
-  var skeletonTextClasses = cx__default["default"]((_classNames = {}, _rollupPluginBabelHelpers.defineProperty(_classNames, "".concat(prefix, "--skeleton__text"), true), _rollupPluginBabelHelpers.defineProperty(_classNames, "".concat(prefix, "--skeleton__heading"), heading), _rollupPluginBabelHelpers.defineProperty(_classNames, className, className), _classNames));
-  var widthNum = parseInt(width, 10);
-  var widthPx = width.includes('px');
-  var widthPercent = width.includes('%');
-  var lineCountNumber;
+const SkeletonText = _ref => {
+  let {
+    paragraph,
+    lineCount,
+    width,
+    heading,
+    className,
+    ...other
+  } = _ref;
+  const prefix = usePrefix.usePrefix();
+  const skeletonTextClasses = cx__default["default"]({
+    [`${prefix}--skeleton__text`]: true,
+    [`${prefix}--skeleton__heading`]: heading,
+    [className]: className
+  });
+  const widthNum = parseInt(width, 10);
+  const widthPx = width.includes('px');
+  const widthPercent = width.includes('%');
+  let lineCountNumber;
 
   if (!paragraph) {
     lineCountNumber = '1';
@@ -52,15 +54,15 @@ var SkeletonText = function SkeletonText(_ref) {
     lineCountNumber = lineCount;
   }
 
-  var refs = React.useRef([]);
-  useIsomorphicEffect["default"](function () {
-    refs.current.map(function (item, j) {
-      var randomPercentWidth = getRandomInt(0, 75, j) + 'px';
-      var randomPxWidth = getRandomInt(Math.max(widthNum - 75, 0), widthNum, j) + 'px';
+  const refs = React.useRef([]);
+  useIsomorphicEffect["default"](() => {
+    refs.current.map((item, j) => {
+      const randomPercentWidth = getRandomInt(0, 75, j) + 'px';
+      const randomPxWidth = getRandomInt(Math.max(widthNum - 75, 0), widthNum, j) + 'px';
 
       if (item) {
         if (widthPercent && paragraph) {
-          item.style.width = "calc(".concat(width, " - ").concat(randomPercentWidth, ")");
+          item.style.width = `calc(${width} - ${randomPercentWidth})`;
         } else if (widthPx && paragraph) {
           item.style.width = randomPxWidth;
         } else {
@@ -69,15 +71,13 @@ var SkeletonText = function SkeletonText(_ref) {
       }
     });
   }, [lineCountNumber, paragraph, refs, width, widthNum, widthPercent, widthPx]);
-  var lines = [];
+  const lines = [];
 
   for (var i = 0; i < lineCountNumber; i++) {
     lines.push( /*#__PURE__*/React__default["default"].createElement("p", _rollupPluginBabelHelpers["extends"]({
       className: skeletonTextClasses,
       key: i,
-      ref: function ref(el) {
-        return refs.current = [].concat(_rollupPluginBabelHelpers.toConsumableArray(refs.current), [el]);
-      }
+      ref: el => refs.current = [...refs.current, el]
     }, other)));
   }
 

package/lib/components/Slider/Slider.Skeleton.js

@@ -21,32 +21,31 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 
-var _excluded = ["hideLabel", "className"];
-
-var SliderSkeleton = function SliderSkeleton(_ref) {
-  var hideLabel = _ref.hideLabel,
-      className = _ref.className,
-      rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
-
-  var prefix = usePrefix.usePrefix();
+const SliderSkeleton = _ref => {
+  let {
+    hideLabel,
+    className,
+    ...rest
+  } = _ref;
+  const prefix = usePrefix.usePrefix();
   return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({
-    className: cx__default["default"]("".concat(prefix, "--form-item"), className)
+    className: cx__default["default"](`${prefix}--form-item`, className)
   }, rest), !hideLabel && /*#__PURE__*/React__default["default"].createElement("span", {
-    className: "".concat(prefix, "--label ").concat(prefix, "--skeleton")
+    className: `${prefix}--label ${prefix}--skeleton`
   }), /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "".concat(prefix, "--slider-container ").concat(prefix, "--skeleton")
+    className: `${prefix}--slider-container ${prefix}--skeleton`
   }, /*#__PURE__*/React__default["default"].createElement("span", {
-    className: "".concat(prefix, "--slider__range-label")
+    className: `${prefix}--slider__range-label`
   }), /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "".concat(prefix, "--slider")
+    className: `${prefix}--slider`
   }, /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "".concat(prefix, "--slider__track")
+    className: `${prefix}--slider__track`
   }), /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "".concat(prefix, "--slider__filled-track")
+    className: `${prefix}--slider__filled-track`
   }), /*#__PURE__*/React__default["default"].createElement("div", {
-    className: "".concat(prefix, "--slider__thumb")
+    className: `${prefix}--slider__thumb`
   })), /*#__PURE__*/React__default["default"].createElement("span", {
-    className: "".concat(prefix, "--slider__range-label")
+    className: `${prefix}--slider__range-label`
   })));
 };