@spaced-out/ui-design-system 0.0.2-beta.1 → 0.0.2

package/lib/components/Toast/Toast.js.flow

@@ -168,9 +168,10 @@ export const Toast = ({
   const {floating, context} = useFloating();
 
   const getComp = (comp: string) => {
-    if (children instanceof Array) {
+    const childrenArray = React.Children.toArray(children);
+    if (childrenArray.length) {
       const nodes: React.Node[] = [];
-      for (const child of children) {
+      for (const child of childrenArray) {
         if (child?.type?.name === comp) {
           nodes.push(child);
         }
@@ -203,7 +204,7 @@ export const Toast = ({
           </div>
           {footerWithClose}
         </div>
-        <CloseIcon onClick={onClose} />
+        <CloseIcon className={css.closeIcon} onClick={onClose} />
       </div>
     </FloatingFocusManager>
   );

package/lib/components/Toast/Toast.module.css

@@ -50,3 +50,7 @@
   align-items: flex-start;
   gap: spaceSmall;
 }
+
+.closeIcon {
+  margin-left: auto;
+}

package/lib/components/Toggle/Toggle.module.css

@@ -84,8 +84,6 @@
 }
 
 .toggle::before {
-  box-shadow: shadowBoxShadow1X shadowBoxShadow1Y shadowBoxShadow1Blur
-    shadowBoxShadow1Spread shadowBoxShadow1Color;
   position: absolute;
   content: '';
   height: size10;

package/lib/components/Truncate/Truncate.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.Truncate = void 0;
+exports.Truncate = exports.BaseTruncate = void 0;
 var React = _interopRequireWildcard(require("react"));
 var _classify = require("../../utils/classify");
 var _TruncateModule = _interopRequireDefault(require("./Truncate.module.css"));
@@ -11,7 +11,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-const Truncate = _ref => {
+const BaseTruncate = _ref => {
   let {
     children,
     line = 1
@@ -23,4 +23,30 @@ const Truncate = _ref => {
     }
   }, children);
 };
+exports.BaseTruncate = BaseTruncate;
+const Truncate = _ref2 => {
+  let {
+    children,
+    line = 1
+  } = _ref2;
+  const arrayChildren = React.Children.toArray(children);
+  if (arrayChildren.length) {
+    const child = arrayChildren[0];
+    if ( /*#__PURE__*/React.isValidElement(child)) {
+      const {
+        className
+      } = child.props;
+      return /*#__PURE__*/React.cloneElement(child, {
+        className: (0, _classify.classify)(_TruncateModule.default.truncateLineClamp, className),
+        style: {
+          WebkitLineClamp: `${line}`
+        }
+      });
+    }
+    return /*#__PURE__*/React.createElement(BaseTruncate, {
+      line: line
+    }, children);
+  }
+  return null;
+};
 exports.Truncate = Truncate;

package/lib/components/Truncate/Truncate.js.flow

@@ -12,7 +12,10 @@ export type TruncateProps = {
   line?: number,
 };
 
-export const Truncate = ({children, line = 1}: TruncateProps): React.Node => (
+export const BaseTruncate = ({
+  children,
+  line = 1,
+}: TruncateProps): React.Node => (
   <span
     className={classify(css.truncateLineClamp)}
     style={{WebkitLineClamp: `${line}`}}
@@ -20,3 +23,20 @@ export const Truncate = ({children, line = 1}: TruncateProps): React.Node => (
     {children}
   </span>
 );
+
+export const Truncate = ({children, line = 1}: TruncateProps): React.Node => {
+  const arrayChildren = React.Children.toArray(children);
+  if (arrayChildren.length) {
+    const child = arrayChildren[0];
+    if (React.isValidElement(child)) {
+      const {className} = child.props;
+
+      return React.cloneElement(child, {
+        className: classify(css.truncateLineClamp, className),
+        style: {WebkitLineClamp: `${line}`},
+      });
+    }
+    return <BaseTruncate line={line}>{children}</BaseTruncate>;
+  }
+  return null;
+};

package/lib/components/Truncate/Truncate.module.css

@@ -2,5 +2,4 @@
   display: -webkit-box;
   -webkit-box-orient: vertical;
   overflow: hidden;
-  font: inherit;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@spaced-out/ui-design-system",
-  "version": "0.0.2-beta.1",
+  "version": "0.0.2",
   "main": "index.js",
   "description": "Sense UI components library",
   "author": {