@julseb-lib/react 1.0.5 → 1.0.7

package/dist/index.d.cts

@@ -3056,26 +3056,28 @@ declare const Drawer: FC$1<ILibDrawer>;
  *   </nav>
  * </Header>
  *
- * @extends HTMLDivElement
+ * @extends ILibHeader
  *
  * @prop {string} [props.className] - Additional CSS classes to apply to the header container.
- * @prop {React.ElementType} [props.element="header"] - HTML element type to render as the container.
+ * @prop {React.ElementType} [props.element="header"] - HTML element type to render as the container. Default: "header".
  * @prop {React.Ref<HTMLDivElement>} [props.ref] - Ref to the header element.
- * @prop {React.ReactNode} [props.logo] - Logo content to display in the header.
- * @prop {"left" | "right"} [props.burgerPosition="right"] - Position of the burger menu button.
- * @prop {LibColorsHover | object} [props.burgerColor="white"] - Color for the burger menu button, can be a single color or object with open/closed states.
  * @prop {React.ReactNode} [props.children] - Content to display in the navigation area.
- * @prop {"left" | "right"} [props.navDesktopPosition="right"] - Position of the navigation on desktop screens.
- * @prop {"drawer" | "fullscreen"} [props.navMobileVariant="drawer"] - Variant for mobile navigation display.
+ * @prop {React.ReactNode} [props.logo] - Logo content to display in the header.
+ * @prop {"left" | "right"} [props.burgerPosition="right"] - Position of the burger menu button. Possible values: "left", "right". Default: "right".
+ * @prop {LibColorsHover | { open: LibColorsHover; closed: LibColorsHover }} [props.burgerColor="white"] - Color for the burger menu button, can be a single color or object with open/closed states. Default: "white".
+ * @prop {"left" | "right"} [props.navDesktopPosition="right"] - Position of the navigation on desktop screens. Possible values: "left", "right". Default: "right".
+ * @prop {"drawer" | "full" | "top"} [props.navMobileVariant="drawer"] - Variant for mobile navigation display. Possible values: "drawer", "full", "top". Default: "drawer".
  * @prop {boolean} [props.enableScrollingOpen] - Whether to allow page scrolling when mobile menu is open.
  * @prop {React.ReactNode} [props.search] - Search component to display in the header.
- * @prop {"relative" | "absolute" | "fixed"} [props.position="relative"] - CSS position property for the header.
+ * @prop {"relative" | "absolute" | "fixed"} [props.position="relative"] - CSS position property for the header. Possible values: "relative", "absolute", "fixed". Default: "relative".
  * @prop {boolean | number} [props.hideOnScroll] - Whether to hide header on scroll, or scroll threshold in pixels.
  * @prop {Array<React.ReactNode>} [props.links] - Array of link elements for navigation.
  * @prop {React.ReactNode} [props.nav] - Navigation content to display.
- * @prop {LibAllColors} [props.backgroundColor="primary"] - Background color for the header.
- * @prop {LibAllColors} [props.textColor="white"] - Text color for header content.
- * @prop {LibColorsHover} [props.linksColor="white"] - Color for navigation links.
+ * @prop {LibAllColors} [props.backgroundColor="primary"] - Background color for the header. Default: "primary".
+ * @prop {LibAllColors} [props.navMobileBackground=backgroundColor] - Background color for mobile navigation. Default: backgroundColor value.
+ * @prop {LibAllColors} [props.textColor="white"] - Text color for header content. Default: "white".
+ * @prop {LibColorsHover} [props.linksColor="white"] - Color for navigation links. Default: "white".
+ * @prop {LibAllColors} [props.headerOpenMobileBackground=backgroundColor] - Background color when mobile menu is open. Default: backgroundColor value.
  *
  * @returns {JSX.Element} The rendered Header component.
  *
@@ -3137,6 +3139,8 @@ declare const Footer: FC$1<ILibFooter>;
  *   url="https://mywebsite.com"
  * />
  *
+ * @extends ILibMeta
+ *
  * @prop {React.ReactNode} [props.children] - Additional meta tags or head elements to include.
  * @prop {string} [props.title] - Page title for the document and social media.
  * @prop {string} [props.favicon] - URL path to the favicon icon file.
@@ -3146,7 +3150,7 @@ declare const Footer: FC$1<ILibFooter>;
  * @prop {string} [props.author] - Author name for the page content.
  * @prop {string} [props.authorUrl] - URL to the author's profile or website.
  * @prop {string} [props.publisher] - Publisher name for the content.
- * @prop {string} [props.type] - Open Graph type (e.g., "website", "article").
+ * @prop {string} [props.type="website"] - Open Graph type. Possible values: "website", "article". Default: "website".
  * @prop {string} [props.cover] - URL to the cover image for social media sharing.
  * @prop {string} [props.siteName] - Name of the website or application.
  * @prop {string} [props.language] - Language locale code (e.g., "en-US").
@@ -3155,7 +3159,9 @@ declare const Footer: FC$1<ILibFooter>;
  * @prop {string} [props.creator] - Creator name for the content.
  * @prop {string} [props.manifest] - URL path to the web app manifest file.
  * @prop {string} [props.category] - Category classification for the content.
- * @prop {string} [props.twitterCard] - Twitter Card type (e.g., "summary", "summary_large_image").
+ * @prop {string} [props.twitterCard="summary"] - Twitter Card type. Possible values: "summary", "summary_large_image". Default: "summary".
+ * @prop {string} [props.appleTouchIcon] - URL path to the Apple touch icon file.
+ * @prop {string} [props.themeColor] - Theme color for the browser interface.
  *
  * @returns {JSX.Element} The rendered Meta component with HTML head elements.
  *

package/dist/index.d.ts

@@ -3056,26 +3056,28 @@ declare const Drawer: FC$1<ILibDrawer>;
  *   </nav>
  * </Header>
  *
- * @extends HTMLDivElement
+ * @extends ILibHeader
  *
  * @prop {string} [props.className] - Additional CSS classes to apply to the header container.
- * @prop {React.ElementType} [props.element="header"] - HTML element type to render as the container.
+ * @prop {React.ElementType} [props.element="header"] - HTML element type to render as the container. Default: "header".
  * @prop {React.Ref<HTMLDivElement>} [props.ref] - Ref to the header element.
- * @prop {React.ReactNode} [props.logo] - Logo content to display in the header.
- * @prop {"left" | "right"} [props.burgerPosition="right"] - Position of the burger menu button.
- * @prop {LibColorsHover | object} [props.burgerColor="white"] - Color for the burger menu button, can be a single color or object with open/closed states.
  * @prop {React.ReactNode} [props.children] - Content to display in the navigation area.
- * @prop {"left" | "right"} [props.navDesktopPosition="right"] - Position of the navigation on desktop screens.
- * @prop {"drawer" | "fullscreen"} [props.navMobileVariant="drawer"] - Variant for mobile navigation display.
+ * @prop {React.ReactNode} [props.logo] - Logo content to display in the header.
+ * @prop {"left" | "right"} [props.burgerPosition="right"] - Position of the burger menu button. Possible values: "left", "right". Default: "right".
+ * @prop {LibColorsHover | { open: LibColorsHover; closed: LibColorsHover }} [props.burgerColor="white"] - Color for the burger menu button, can be a single color or object with open/closed states. Default: "white".
+ * @prop {"left" | "right"} [props.navDesktopPosition="right"] - Position of the navigation on desktop screens. Possible values: "left", "right". Default: "right".
+ * @prop {"drawer" | "full" | "top"} [props.navMobileVariant="drawer"] - Variant for mobile navigation display. Possible values: "drawer", "full", "top". Default: "drawer".
  * @prop {boolean} [props.enableScrollingOpen] - Whether to allow page scrolling when mobile menu is open.
  * @prop {React.ReactNode} [props.search] - Search component to display in the header.
- * @prop {"relative" | "absolute" | "fixed"} [props.position="relative"] - CSS position property for the header.
+ * @prop {"relative" | "absolute" | "fixed"} [props.position="relative"] - CSS position property for the header. Possible values: "relative", "absolute", "fixed". Default: "relative".
  * @prop {boolean | number} [props.hideOnScroll] - Whether to hide header on scroll, or scroll threshold in pixels.
  * @prop {Array<React.ReactNode>} [props.links] - Array of link elements for navigation.
  * @prop {React.ReactNode} [props.nav] - Navigation content to display.
- * @prop {LibAllColors} [props.backgroundColor="primary"] - Background color for the header.
- * @prop {LibAllColors} [props.textColor="white"] - Text color for header content.
- * @prop {LibColorsHover} [props.linksColor="white"] - Color for navigation links.
+ * @prop {LibAllColors} [props.backgroundColor="primary"] - Background color for the header. Default: "primary".
+ * @prop {LibAllColors} [props.navMobileBackground=backgroundColor] - Background color for mobile navigation. Default: backgroundColor value.
+ * @prop {LibAllColors} [props.textColor="white"] - Text color for header content. Default: "white".
+ * @prop {LibColorsHover} [props.linksColor="white"] - Color for navigation links. Default: "white".
+ * @prop {LibAllColors} [props.headerOpenMobileBackground=backgroundColor] - Background color when mobile menu is open. Default: backgroundColor value.
  *
  * @returns {JSX.Element} The rendered Header component.
  *
@@ -3137,6 +3139,8 @@ declare const Footer: FC$1<ILibFooter>;
  *   url="https://mywebsite.com"
  * />
  *
+ * @extends ILibMeta
+ *
  * @prop {React.ReactNode} [props.children] - Additional meta tags or head elements to include.
  * @prop {string} [props.title] - Page title for the document and social media.
  * @prop {string} [props.favicon] - URL path to the favicon icon file.
@@ -3146,7 +3150,7 @@ declare const Footer: FC$1<ILibFooter>;
  * @prop {string} [props.author] - Author name for the page content.
  * @prop {string} [props.authorUrl] - URL to the author's profile or website.
  * @prop {string} [props.publisher] - Publisher name for the content.
- * @prop {string} [props.type] - Open Graph type (e.g., "website", "article").
+ * @prop {string} [props.type="website"] - Open Graph type. Possible values: "website", "article". Default: "website".
  * @prop {string} [props.cover] - URL to the cover image for social media sharing.
  * @prop {string} [props.siteName] - Name of the website or application.
  * @prop {string} [props.language] - Language locale code (e.g., "en-US").
@@ -3155,7 +3159,9 @@ declare const Footer: FC$1<ILibFooter>;
  * @prop {string} [props.creator] - Creator name for the content.
  * @prop {string} [props.manifest] - URL path to the web app manifest file.
  * @prop {string} [props.category] - Category classification for the content.
- * @prop {string} [props.twitterCard] - Twitter Card type (e.g., "summary", "summary_large_image").
+ * @prop {string} [props.twitterCard="summary"] - Twitter Card type. Possible values: "summary", "summary_large_image". Default: "summary".
+ * @prop {string} [props.appleTouchIcon] - URL path to the Apple touch icon file.
+ * @prop {string} [props.themeColor] - Theme color for the browser interface.
  *
  * @returns {JSX.Element} The rendered Meta component with HTML head elements.
  *

package/dist/index.js

@@ -69413,7 +69413,7 @@ var Header = ({
   links,
   nav,
   backgroundColor = "primary",
-  navMobileBackground,
+  navMobileBackground = backgroundColor,
   textColor = "white",
   linksColor = "white",
   headerOpenMobileBackground = backgroundColor,
@@ -69462,14 +69462,15 @@ var Header = ({
       isMobile && /* @__PURE__ */ jsx366(HeaderSearch, { ...searchProps })
     ] }),
     className: clsx(
-      "z-999 flex gap-2 [&>a]:outline-none transition-all duration-200 ease-in-out",
+      "z-999 flex gap-2 [&>a]:outline-none w-fit transition-all duration-200 ease-in-out",
       "fixed md:relative",
       "flex-col md:flex-row px-[5%] md:px-0",
       genRingColorChildren[linksColor],
       `${genBgAllColors[navMobileBackground ?? "primary-500"]} md:bg-transparent`,
       navDesktopPosition === "left" && "grow",
       navMobileVariant === "drawer" && [
-        "top-[56px] md:top-[unset] w-[70%] md:w-fit h-[calc(100svh-56px)] md:h-[unset]",
+        "top-[56px] md:top-[unset] h-[calc(100svh-56px)] md:h-[unset]",
+        "w-[70%] md:w-fit",
         navDesktopPosition === "left" ? isOpen ? "left-0 md:left-[unset]" : "left-[-70%] md:left-[unset]" : isOpen ? "right-0 md:right-[unset]" : "right-[-70%] md:right-[unset]"
       ],
       navMobileVariant === "full" && [