@radui/ui 0.0.4 → 0.0.5

package/README.md

@@ -0,0 +1,70 @@
+[![codecov](https://codecov.io/gh/rad-ui/ui/graph/badge.svg?token=Z74MUHF5TN)](https://codecov.io/gh/rad-ui/ui)
+
+# RAD UI
+
+![RAD UI](./assets/images/rad-ui-poster.jpg)
+
+## Introduction to Rad UI
+
+Rad UI is a React UI library designed to simplify and enhance the process of building user interfaces. With a focus on ease of use and flexibility, Rad UI empowers developers to create engaging and efficient user experiences. Whether you're starting a new project or improving an existing one, Rad UI provides a collection of components and utilities to streamline development.
+
+## Installation
+
+To install Rad UI, run the following command from the root of your project's directory:
+
+```bash
+npm install @radui/ui
+```
+
+Description: Rad UI is a React UI library that simplifies UI development, offering a collection of components and utilities to enhance the user experience. It addresses common challenges in building interfaces, making it easier for developers to create intuitive and visually appealing applications.
+
+Technology stack: React
+Status: Beta
+Please note that Rad UI is under development and will receive a full official release soon in 2024 once significant production-ready components are readily available.
+What sets this apart: Rad UI stands out with its focus on simplicity, flexibility, and ease of integration into React projects.
+<!-- 
+
+## Dependencies
+
+Describe any dependencies that must be installed for this software to work.
+This includes programming languages, databases or other storage mechanisms, build tools, frameworks, and so forth.
+If specific versions of other software are required, or known not to work, call that out.
+
+## Usage
+
+Show users how to use the software.
+Be specific.
+Use appropriate formatting when showing code snippets.
+
+## How to test the software
+
+If the software includes automated tests, detail how to run those tests.
+
+## Known issues
+
+Document any known significant shortcomings with the software.
+
+## Getting help
+
+Instruct users how to get help with this software; this might include links to an issue tracker, wiki, mailing list, etc.
+
+**Example**
+
+If you have questions, concerns, bug reports, etc, please file an issue in this repository's Issue Tracker. -->
+
+## Getting involved
+
+We encourage interested developers in getting involved in building a better future for the web.
+For more details you can read [CONTRIBUTING](CONTRIBUTING.md).
+
+## Open source licensing info
+
+For Licensing info you can check out [LICENSE](LICENSE).
+
+## Credits and references
+
+1. Project heavily inspired by RadixUI, Floating UI, shadcn/ui and many other libraries that defined the modern web that we know today
+
+
+This project is tested with BrowserStack
+

package/dist/components/Accordion.js

@@ -1,26 +1,81 @@
 'use client';
 import React, { useState } from 'react';
 
-const Accordion = _ref => {
-  let {
-    items
-  } = _ref;
-  const [activeIndex, setActiveIndex] = useState(null);
-  const handleClick = index => {
+function _iterableToArrayLimit(r, l) {
+  var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
+  if (null != t) {
+    var e,
+      n,
+      i,
+      u,
+      a = [],
+      f = !0,
+      o = !1;
+    try {
+      if (i = (t = t.call(r)).next, 0 === l) {
+        if (Object(t) !== t) return;
+        f = !1;
+      } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0);
+    } catch (r) {
+      o = !0, n = r;
+    } finally {
+      try {
+        if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return;
+      } finally {
+        if (o) throw n;
+      }
+    }
+    return a;
+  }
+}
+function _slicedToArray(arr, i) {
+  return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
+}
+function _arrayWithHoles(arr) {
+  if (Array.isArray(arr)) return arr;
+}
+function _unsupportedIterableToArray(o, minLen) {
+  if (!o) return;
+  if (typeof o === "string") return _arrayLikeToArray(o, minLen);
+  var n = Object.prototype.toString.call(o).slice(8, -1);
+  if (n === "Object" && o.constructor) n = o.constructor.name;
+  if (n === "Map" || n === "Set") return Array.from(o);
+  if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
+}
+function _arrayLikeToArray(arr, len) {
+  if (len == null || len > arr.length) len = arr.length;
+  for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
+  return arr2;
+}
+function _nonIterableRest() {
+  throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+
+var Accordion = function Accordion(_ref) {
+  var items = _ref.items;
+  var _useState = useState(null),
+    _useState2 = _slicedToArray(_useState, 2),
+    activeIndex = _useState2[0],
+    setActiveIndex = _useState2[1];
+  var handleClick = function handleClick(index) {
     setActiveIndex(activeIndex === index ? null : index);
   };
-  return /*#__PURE__*/React.createElement("div", null, items.map((item, index) => /*#__PURE__*/React.createElement("div", {
-    key: index
-  }, /*#__PURE__*/React.createElement("button", {
-    onClick: () => handleClick(index),
-    "aria-expanded": activeIndex === index,
-    "aria-controls": `content-${index}`
-  }, item.title), /*#__PURE__*/React.createElement("div", {
-    id: `content-${index}`,
-    role: "region",
-    "aria-labelledby": `section-${index}`,
-    hidden: activeIndex !== index
-  }, /*#__PURE__*/React.createElement("p", null, item.content)))));
+  return /*#__PURE__*/React.createElement("div", null, items.map(function (item, index) {
+    return /*#__PURE__*/React.createElement("div", {
+      key: index
+    }, /*#__PURE__*/React.createElement("button", {
+      onClick: function onClick() {
+        return handleClick(index);
+      },
+      "aria-expanded": activeIndex === index,
+      "aria-controls": "content-".concat(index)
+    }, item.title), /*#__PURE__*/React.createElement("div", {
+      id: "content-".concat(index),
+      role: "region",
+      "aria-labelledby": "section-".concat(index),
+      hidden: activeIndex !== index
+    }, /*#__PURE__*/React.createElement("p", null, item.content)));
+  }));
 };
 
 export { Accordion as default };

package/dist/components/Avatar.js

@@ -1,5 +1,6 @@
 'use client';
-import React from 'react';
+import React, { useState, useEffect } from 'react';
+import { customClassSwitcher } from '@/core';
 
 function _extends() {
   _extends = Object.assign ? Object.assign.bind() : function (target) {
@@ -15,53 +16,138 @@ function _extends() {
   };
   return _extends.apply(this, arguments);
 }
+function _objectWithoutPropertiesLoose(source, excluded) {
+  if (source == null) return {};
+  var target = {};
+  var sourceKeys = Object.keys(source);
+  var key, i;
+  for (i = 0; i < sourceKeys.length; i++) {
+    key = sourceKeys[i];
+    if (excluded.indexOf(key) >= 0) continue;
+    target[key] = source[key];
+  }
+  return target;
+}
+function _objectWithoutProperties(source, excluded) {
+  if (source == null) return {};
+  var target = _objectWithoutPropertiesLoose(source, excluded);
+  var key, i;
+  if (Object.getOwnPropertySymbols) {
+    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
+    for (i = 0; i < sourceSymbolKeys.length; i++) {
+      key = sourceSymbolKeys[i];
+      if (excluded.indexOf(key) >= 0) continue;
+      if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
+      target[key] = source[key];
+    }
+  }
+  return target;
+}
 
-const RAD_UI_CLASS_PREFIX = 'rad-ui';
-const customClassSwitcher = function (customRootClass) {
-  let componentName = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
-  // applies a custom root class the user provides, else applies the default rad-ui classes to the component
-  // rad ui's classes are based on this logic
+var Root = function (_a) {
+    var children = _a.children, _b = _a.customRootClass, customRootClass = _b === void 0 ? '' : _b;
+    var rootClass = customClassSwitcher(customRootClass, 'Avatar');
+    return (React.createElement("span", { className: "".concat(rootClass, "-root") }, children));
+};
 
-  // add dashes between capitalized words
-  const componentClassName = componentName.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();
-  if (customRootClass) return customRootClass;
-  if (componentName) return `${RAD_UI_CLASS_PREFIX}-${componentClassName}`;
-  return '';
+/******************************************************************************
+Copyright (c) Microsoft Corporation.
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+PERFORMANCE OF THIS SOFTWARE.
+***************************************************************************** */
+/* global Reflect, Promise, SuppressedError, Symbol */
+
+
+var __assign = function() {
+    __assign = Object.assign || function __assign(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+
+function __rest(s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+}
+
+typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
+    var e = new Error(message);
+    return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
 };
 
-const COMPONENT_NAME = 'Avatar';
-const TextRenderer = _ref => {
-  let {
-    rootClass,
-    fallback
-  } = _ref;
-  return /*#__PURE__*/React.createElement("div", {
-    className: `${rootClass} ${rootClass}-fallback`
-  }, fallback);
+var AvatarImage = function (_a) {
+    var _b = _a.src, src = _b === void 0 ? 'src' : _b, _c = _a.alt, alt = _c === void 0 ? '' : _c, _d = _a.customRootClass, customRootClass = _d === void 0 ? '' : _d, _e = _a.className, className = _e === void 0 ? '' : _e, props = __rest(_a, ["src", "alt", "customRootClass", "className"]);
+    var rootClass = customClassSwitcher(customRootClass, 'Avatar');
+    var _f = useState(false), isBrokenImage = _f[0], setIsBrokenImage = _f[1];
+    var handleImageLoaded = function () {
+        setIsBrokenImage(false);
+    };
+    var handleImageError = function () {
+        setIsBrokenImage(true);
+    };
+    useEffect(function () {
+    }, [isBrokenImage]);
+    if (isBrokenImage) {
+        return null;
+    }
+    return (React.createElement("img", __assign({ src: src, alt: alt, onError: handleImageError, onLoad: handleImageLoaded, className: "".concat(rootClass, " ").concat(className) }, props)));
 };
-const Avatar = _ref2 => {
-  let {
-    children,
-    customRootClass = '',
-    fallback = '',
-    className = '',
-    src,
-    alt,
-    ...rest
-  } = _ref2;
-  const rootClass = customClassSwitcher(customRootClass, COMPONENT_NAME);
-  if (!src) {
-    return /*#__PURE__*/React.createElement(TextRenderer, {
-      fallback: fallback,
-      rootClass: rootClass
-    });
-  }
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("img", _extends({
+
+var AvatarFallback = function (_a) {
+    var _b = _a.fallback, fallback = _b === void 0 ? '' : _b, _c = _a.customRootClass, customRootClass = _c === void 0 ? '' : _c, props = __rest(_a, ["fallback", "customRootClass"]);
+    var rootClass = customClassSwitcher(customRootClass, 'Avatar');
+    return (React.createElement("span", __assign({ className: "".concat(rootClass, "-fallback") }, props), fallback));
+};
+
+var _excluded = ["children", "customRootClass", "fallback", "className", "src", "alt"];
+var COMPONENT_NAME = 'Avatar';
+var Avatar = function Avatar(_ref) {
+  _ref.children;
+    var _ref$customRootClass = _ref.customRootClass,
+    customRootClass = _ref$customRootClass === void 0 ? '' : _ref$customRootClass,
+    _ref$fallback = _ref.fallback,
+    fallback = _ref$fallback === void 0 ? '' : _ref$fallback,
+    _ref$className = _ref.className,
+    className = _ref$className === void 0 ? '' : _ref$className,
+    _ref$src = _ref.src,
+    src = _ref$src === void 0 ? '' : _ref$src,
+    alt = _ref.alt,
+    props = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React.createElement(Root, {
+    customRootClass: customRootClass
+  }, /*#__PURE__*/React.createElement(AvatarImage, _extends({
     src: src,
     alt: alt,
-    className: `${rootClass} ${className}`
-  }, rest)));
+    className: className,
+    customRootClass: customRootClass
+  }, props)), /*#__PURE__*/React.createElement(AvatarFallback, {
+    customRootClass: customRootClass,
+    fallback: fallback
+  }));
 };
 Avatar.displayName = COMPONENT_NAME;
+Avatar.Root = Root;
+Avatar.Image = AvatarImage;
+Avatar.Fallback = AvatarFallback;
 
 export { Avatar as default };

package/dist/components/AvatarFallback.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+type AvatarFallbackProps = {
+    fallback: string;
+    customRootClass: string;
+};
+declare const AvatarFallback: React.FC<AvatarFallbackProps>;
+export default AvatarFallback;
+//# sourceMappingURL=AvatarFallback.d.ts.map

package/dist/components/AvatarFallback.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AvatarFallback.d.ts","sourceRoot":"","sources":["../src/components/ui/Avatar/shards/AvatarFallback.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,KAAK,mBAAmB,GAAG;IACvB,QAAQ,EAAE,MAAM,CAAC;IACjB,eAAe,EAAE,MAAM,CAAC;CAC3B,CAAC;AAEF,QAAA,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAOjD,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/dist/components/AvatarImage.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+type AvatarImageProps = {
+    src: string;
+    alt: string;
+    className: string;
+    customRootClass: string;
+};
+declare const AvatarImage: React.FC<AvatarImageProps>;
+export default AvatarImage;
+//# sourceMappingURL=AvatarImage.d.ts.map

package/dist/components/AvatarImage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AvatarImage.d.ts","sourceRoot":"","sources":["../src/components/ui/Avatar/shards/AvatarImage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAIjD,KAAK,gBAAgB,GAAG;IACpB,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,EAAE,MAAM,CAAC;IACZ,SAAS,EAAE,MAAM,CAAC;IAClB,eAAe,EAAE,MAAM,CAAC;CAC3B,CAAC;AAEF,QAAA,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAuB3C,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/dist/components/AvatarRoot.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+type AvatarRootProps = {
+    children: React.ReactNode;
+    customRootClass: string;
+};
+declare const Root: React.FC<AvatarRootProps>;
+export default Root;
+//# sourceMappingURL=AvatarRoot.d.ts.map

package/dist/components/AvatarRoot.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AvatarRoot.d.ts","sourceRoot":"","sources":["../src/components/ui/Avatar/shards/AvatarRoot.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,KAAK,eAAe,GAAG;IACrB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,eAAe,EAAC,MAAM,CAAA;CACvB,CAAC;AAEF,QAAA,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAOnC,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/dist/components/Badge.js

@@ -15,35 +15,64 @@ function _extends() {
   };
   return _extends.apply(this, arguments);
 }
+function _objectWithoutPropertiesLoose(source, excluded) {
+  if (source == null) return {};
+  var target = {};
+  var sourceKeys = Object.keys(source);
+  var key, i;
+  for (i = 0; i < sourceKeys.length; i++) {
+    key = sourceKeys[i];
+    if (excluded.indexOf(key) >= 0) continue;
+    target[key] = source[key];
+  }
+  return target;
+}
+function _objectWithoutProperties(source, excluded) {
+  if (source == null) return {};
+  var target = _objectWithoutPropertiesLoose(source, excluded);
+  var key, i;
+  if (Object.getOwnPropertySymbols) {
+    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
+    for (i = 0; i < sourceSymbolKeys.length; i++) {
+      key = sourceSymbolKeys[i];
+      if (excluded.indexOf(key) >= 0) continue;
+      if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
+      target[key] = source[key];
+    }
+  }
+  return target;
+}
 
-const RAD_UI_CLASS_PREFIX = 'rad-ui';
-const customClassSwitcher = function (customRootClass) {
-  let componentName = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
+var RAD_UI_CLASS_PREFIX = 'rad-ui';
+var customClassSwitcher = function customClassSwitcher(customRootClass) {
+  var componentName = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
   // applies a custom root class the user provides, else applies the default rad-ui classes to the component
   // rad ui's classes are based on this logic
 
   // add dashes between capitalized words
-  const componentClassName = componentName.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();
+  var componentClassName = componentName.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();
   if (customRootClass) return customRootClass;
-  if (componentName) return `${RAD_UI_CLASS_PREFIX}-${componentClassName}`;
+  if (componentName) return "".concat(RAD_UI_CLASS_PREFIX, "-").concat(componentClassName);
   return '';
 };
 
-const COMPONENT_NAME = 'Badge';
-const Badge = _ref => {
-  let {
-    children,
-    customRootClass = '',
-    className = '',
-    color = undefined,
-    ...props
-  } = _ref;
-  const rootClass = customClassSwitcher(customRootClass, COMPONENT_NAME);
+var _excluded = ["children", "customRootClass", "className", "color"];
+var COMPONENT_NAME = 'Badge';
+var Badge = function Badge(_ref) {
+  var children = _ref.children,
+    _ref$customRootClass = _ref.customRootClass,
+    customRootClass = _ref$customRootClass === void 0 ? '' : _ref$customRootClass,
+    _ref$className = _ref.className,
+    className = _ref$className === void 0 ? '' : _ref$className,
+    _ref$color = _ref.color,
+    color = _ref$color === void 0 ? undefined : _ref$color,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var rootClass = customClassSwitcher(customRootClass, COMPONENT_NAME);
   if (color) {
     props['data-accent-color'] = color;
   }
   return /*#__PURE__*/React.createElement("span", _extends({
-    className: `${rootClass} ${className}`
+    className: "".concat(rootClass, " ").concat(className)
   }, props), children);
 };
 Badge.displayName = COMPONENT_NAME;

package/dist/components/BlockQuote.js

@@ -15,31 +15,59 @@ function _extends() {
   };
   return _extends.apply(this, arguments);
 }
+function _objectWithoutPropertiesLoose(source, excluded) {
+  if (source == null) return {};
+  var target = {};
+  var sourceKeys = Object.keys(source);
+  var key, i;
+  for (i = 0; i < sourceKeys.length; i++) {
+    key = sourceKeys[i];
+    if (excluded.indexOf(key) >= 0) continue;
+    target[key] = source[key];
+  }
+  return target;
+}
+function _objectWithoutProperties(source, excluded) {
+  if (source == null) return {};
+  var target = _objectWithoutPropertiesLoose(source, excluded);
+  var key, i;
+  if (Object.getOwnPropertySymbols) {
+    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
+    for (i = 0; i < sourceSymbolKeys.length; i++) {
+      key = sourceSymbolKeys[i];
+      if (excluded.indexOf(key) >= 0) continue;
+      if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
+      target[key] = source[key];
+    }
+  }
+  return target;
+}
 
-const RAD_UI_CLASS_PREFIX = 'rad-ui';
-const customClassSwitcher = function (customRootClass) {
-  let componentName = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
+var RAD_UI_CLASS_PREFIX = 'rad-ui';
+var customClassSwitcher = function customClassSwitcher(customRootClass) {
+  var componentName = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
   // applies a custom root class the user provides, else applies the default rad-ui classes to the component
   // rad ui's classes are based on this logic
 
   // add dashes between capitalized words
-  const componentClassName = componentName.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();
+  var componentClassName = componentName.replace(/([a-z0-9])([A-Z])/g, '$1-$2').toLowerCase();
   if (customRootClass) return customRootClass;
-  if (componentName) return `${RAD_UI_CLASS_PREFIX}-${componentClassName}`;
+  if (componentName) return "".concat(RAD_UI_CLASS_PREFIX, "-").concat(componentClassName);
   return '';
 };
 
-const COMPONENT_NAME = 'BlockQuote';
-const BlockQuote = _ref => {
-  let {
-    children,
-    customRootClass = '',
-    className = '',
-    ...props
-  } = _ref;
-  const rootClass = customClassSwitcher(customRootClass, COMPONENT_NAME);
+var _excluded = ["children", "customRootClass", "className"];
+var COMPONENT_NAME = 'BlockQuote';
+var BlockQuote = function BlockQuote(_ref) {
+  var children = _ref.children,
+    _ref$customRootClass = _ref.customRootClass,
+    customRootClass = _ref$customRootClass === void 0 ? '' : _ref$customRootClass,
+    _ref$className = _ref.className,
+    className = _ref$className === void 0 ? '' : _ref$className,
+    props = _objectWithoutProperties(_ref, _excluded);
+  var rootClass = customClassSwitcher(customRootClass, COMPONENT_NAME);
   return /*#__PURE__*/React.createElement("blockquote", _extends({
-    className: `${rootClass} ${className}`
+    className: "".concat(rootClass, " ").concat(className)
   }, props), children);
 };
 BlockQuote.displayName = COMPONENT_NAME;

package/dist/components/Button.js

@@ -15,17 +15,46 @@ function _extends() {
   };
   return _extends.apply(this, arguments);
 }
+function _objectWithoutPropertiesLoose(source, excluded) {
+  if (source == null) return {};
+  var target = {};
+  var sourceKeys = Object.keys(source);
+  var key, i;
+  for (i = 0; i < sourceKeys.length; i++) {
+    key = sourceKeys[i];
+    if (excluded.indexOf(key) >= 0) continue;
+    target[key] = source[key];
+  }
+  return target;
+}
+function _objectWithoutProperties(source, excluded) {
+  if (source == null) return {};
+  var target = _objectWithoutPropertiesLoose(source, excluded);
+  var key, i;
+  if (Object.getOwnPropertySymbols) {
+    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
+    for (i = 0; i < sourceSymbolKeys.length; i++) {
+      key = sourceSymbolKeys[i];
+      if (excluded.indexOf(key) >= 0) continue;
+      if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
+      target[key] = source[key];
+    }
+  }
+  return target;
+}
 
+var _excluded = ["children", "type", "color", "className", "variant"];
 // make the color prop default accent color
-const Button = _ref => {
-  let {
-    children,
-    type = 'button',
-    color = undefined,
-    className = '',
-    variant = 'solid',
-    ...props
-  } = _ref;
+var Button = function Button(_ref) {
+  var children = _ref.children;
+    _ref.type;
+    var _ref$color = _ref.color,
+    color = _ref$color === void 0 ? undefined : _ref$color,
+    _ref$className = _ref.className,
+    className = _ref$className === void 0 ? '' : _ref$className,
+    _ref$variant = _ref.variant,
+    variant = _ref$variant === void 0 ? 'solid' : _ref$variant,
+    props = _objectWithoutProperties(_ref, _excluded);
   // apply data attribute for accent color
   // apply attribute only if color is present
   if (color) {
@@ -33,7 +62,7 @@ const Button = _ref => {
   }
   return /*#__PURE__*/React.createElement("button", _extends({
     type: "button",
-    className: `rad-ui-button button-${variant} ${className}`
+    className: "rad-ui-button button-".concat(variant, " ").concat(className)
   }, props), children);
 };