@julseb-lib/react 0.0.3 → 0.0.5

package/dist/lib/components/Card/Card.tsx

@@ -2,7 +2,6 @@
 
 import { forwardRef } from "react"
 import { Link } from "react-router-dom"
-import { Flexbox } from "../../"
 import { StyledCard } from "./styles"
 import type { ILibCard } from "./types"
 
@@ -61,6 +60,16 @@ export const Card = forwardRef<HTMLDivElement, ILibCard>(
             to,
             blank,
             onClick,
+            inline,
+            flexDirection,
+            flexWrap,
+            justifyContent,
+            alignItems,
+            justifyItems,
+            alignContent,
+            gap,
+            columnGap,
+            rowGap,
             ...rest
         },
         ref
@@ -78,7 +87,7 @@ export const Card = forwardRef<HTMLDivElement, ILibCard>(
                         ? "a"
                         : onClick
                         ? "button"
-                        : Flexbox
+                        : "div"
                 }
                 to={to}
                 href={href}
@@ -105,6 +114,16 @@ export const Card = forwardRef<HTMLDivElement, ILibCard>(
                     }
                 }
                 $textAlign={textAlign}
+                $inline={inline}
+                $flexDirection={flexDirection}
+                $flexWrap={flexWrap}
+                $justifyContent={justifyContent}
+                $alignItems={alignItems}
+                $justifyItems={justifyItems}
+                $alignContent={alignContent}
+                $gap={gap}
+                $columnGap={columnGap}
+                $rowGap={rowGap}
                 {...rest}
             >
                 {children}

package/dist/lib/components/Card/styles.tsx

@@ -3,7 +3,7 @@
 import styled from "styled-components"
 import type { Property } from "csstype"
 import { stringifyPx } from "ts-utils-julseb"
-import { setDefaultTheme, Flexbox, Mixins } from "../../"
+import { setDefaultTheme, Mixins } from "../../"
 import type {
     CssCursor,
     LibAllColors,
@@ -12,9 +12,16 @@ import type {
     ILibPadding,
     ILibRadius,
     CssTextAlign,
+    CssAlignContent,
+    CssAlignItems,
+    CssFlexDirection,
+    CssFlexWrap,
+    CssJustifyContent,
+    CssJustifyItems,
+    LibSpacers,
 } from "../../types"
 
-const StyledCard = styled(Flexbox)<{
+const StyledCard = styled.div<{
     $border?: ILibBorder
     $borderRadius?: ILibRadius
     $padding?: ILibPadding
@@ -33,7 +40,18 @@ const StyledCard = styled(Flexbox)<{
         $size?: Property.BackgroundSize
     }
     $textAlign?: CssTextAlign
+    $inline?: boolean
+    $flexDirection?: CssFlexDirection
+    $flexWrap?: CssFlexWrap
+    $justifyContent?: CssJustifyContent
+    $alignItems?: CssAlignItems
+    $justifyItems?: CssJustifyItems
+    $alignContent?: CssAlignContent
+    $gap?: LibSpacers
+    $columnGap?: LibSpacers
+    $rowGap?: LibSpacers
 }>`
+    ${Mixins.Flexbox};
     text-decoration: none;
     overflow: hidden;
     position: relative;

package/dist/lib/components/Header/HeaderNav.tsx

@@ -36,8 +36,9 @@ export function HeaderNav({
 
     const searchHeight = isMobile && !!search ? 32 : 0
 
-    const linksHeight =
-        valueArr.length * 24 + ([...valueArr, searchHeight].length - 1) * 12
+    const linksHeight = links
+        ? links.length * 24 + ([...valueArr, searchHeight].length - 1) * 12
+        : 56
 
     const navHeight = searchHeight + linksHeight
 
@@ -61,15 +62,16 @@ export function HeaderNav({
                 />
             )}
 
-            {links &&
-                links.map(link => (
-                    <HeaderNavLink
-                        data-testid={testid}
-                        className={className}
-                        link={link}
-                        key={uuid()}
-                    />
-                ))}
+            {links
+                ? links.map(link => (
+                      <HeaderNavLink
+                          data-testid={testid}
+                          className={className}
+                          link={link}
+                          key={uuid()}
+                      />
+                  ))
+                : null}
 
             {children && children}
         </Nav>

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@julseb-lib/react",
-    "version": "0.0.3",
+    "version": "0.0.5",
     "type": "module",
     "license": "MIT",
     "scripts": {