@julseb-lib/react 0.1.0 → 0.1.1

package/dist/index.cjs.js

@@ -1112,7 +1112,7 @@ React keys must be passed directly to JSX without using spread:
             ${h?`#${h}`:`.${H}`} {
             --avatar-size: ${m}px;
             }
-        `),console.log(z==null?void 0:z.fallbackBackgroundColor),t.jsxs(r4,{"data-testid":d&&l?`${l}.Avatar`:l,ref:d?void 0:e,as:d?"span":c,id:h,className:T(d&&a?"Avatar":a,C),$backgroundColor:i,$border:f,$borderRadius:r,$size:m,$contentColor:p,$fontSize:y,...u,children:[z&&t.jsx(D2,{"data-testid":l&&`${l}.Image`,className:a&&"Image",src:typeof z=="object"?z.src:z,alt:typeof z=="object"?z.alt:"Avatar",width:"100%",height:"100%",fit:"cover",imgFallback:typeof z=="object"?{text:z.fallback??"",fontSize:z.fallbackFontSize??y,background:z.fallbackBackgroundColor??i,textColor:z.fallbackFontColor??p}:void 0}),M&&M,v&&t.jsx(l2,{"data-testid":l&&`${l}.Icon`,className:a&&"Icon",icon:v,size:g,color:p,baseUrl:n})]})},$l=({"data-testid":l,as:c,ref:e,size:a=32,border:h,borderRadius:d="circle",badge:i,img:f,letter:r,icon:m,iconSize:p=h2(a),backgroundColor:z="danger",contentColor:M=z==="white"?"primary":z==="black"?"white":"background",className:v,containerStyle:g,role:n="img",...y})=>{var L,$;const u=typeof i=="object",C=u&&i.size?i.size:8,H={"data-testid":l,as:c,className:v,hasBadge:!!i,backgroundColor:z,border:h,borderRadius:d,size:a,contentColor:M,img:f,letter:r,icon:m,iconSize:p,ref:e,role:n,...y};return i?t.jsxs(i4,{"data-testid":l,ref:e,as:c,className:v,style:g,$backgroundColor:z,$border:h,$borderRadius:d,$size:a,$contentColor:M,children:[t.jsx(g3,{...H}),t.jsx(f4,{"data-testid":l&&`${l}.Badge`,className:T({Badge:v},`Position${w.capitalize(u&&i.position?i.position:"top")}`),size:C,number:u&&i.content?i.content:void 0,backgroundColor:u&&i.backgroundColor?i.backgroundColor:void 0,contentColor:u&&i.contentColor?i.contentColor:void 0,padding:u&&i.padding?i.padding:void 0,$width:C,$paddingLeftRight:u&&typeof i.padding=="object"&&((L=i.padding)!=null&&L.leftRight)?($=i.padding)==null?void 0:$.leftRight:"0px",$outline:u&&i.outline?i.outline:void 0})]}):t.jsx(g3,{...H})},z0=({$size:l})=>o.css`
+        `),t.jsxs(r4,{"data-testid":d&&l?`${l}.Avatar`:l,ref:d?void 0:e,as:d?"span":c,id:h,className:T(d&&a?"Avatar":a,C),$backgroundColor:i,$border:f,$borderRadius:r,$size:m,$contentColor:p,$fontSize:y,...u,children:[z&&t.jsx(D2,{"data-testid":l&&`${l}.Image`,className:a&&"Image",src:typeof z=="object"?z.src:z,alt:typeof z=="object"?z.alt:"Avatar",width:"100%",height:"100%",fit:"cover",imgFallback:typeof z=="object"?{text:z.fallback??"",fontSize:z.fallbackFontSize??y,background:z.fallbackBackgroundColor??i,textColor:z.fallbackFontColor??p}:void 0}),M&&M,v&&t.jsx(l2,{"data-testid":l&&`${l}.Icon`,className:a&&"Icon",icon:v,size:g,color:p,baseUrl:n})]})},$l=({"data-testid":l,as:c,ref:e,size:a=32,border:h,borderRadius:d="circle",badge:i,img:f,letter:r,icon:m,iconSize:p=h2(a),backgroundColor:z="primary",contentColor:M=z==="white"?"primary":z==="black"?"white":"background",className:v,containerStyle:g,role:n="img",...y})=>{var L,$;const u=typeof i=="object",C=u&&i.size?i.size:8,H={"data-testid":l,as:c,className:v,hasBadge:!!i,backgroundColor:z,border:h,borderRadius:d,size:a,contentColor:M,img:f,letter:r,icon:m,iconSize:p,ref:e,role:n,...y};return i?t.jsxs(i4,{"data-testid":l,ref:e,as:c,className:v,style:g,$backgroundColor:z,$border:h,$borderRadius:d,$size:a,$contentColor:M,children:[t.jsx(g3,{...H}),t.jsx(f4,{"data-testid":l&&`${l}.Badge`,className:T({Badge:v},`Position${w.capitalize(u&&i.position?i.position:"top")}`),size:C,number:u&&i.content?i.content:void 0,backgroundColor:u&&i.backgroundColor?i.backgroundColor:void 0,contentColor:u&&i.contentColor?i.contentColor:void 0,padding:u&&i.padding?i.padding:void 0,$width:C,$paddingLeftRight:u&&typeof i.padding=="object"&&((L=i.padding)!=null&&L.leftRight)?($=i.padding)==null?void 0:$.leftRight:"0px",$outline:u&&i.outline?i.outline:void 0})]}):t.jsx(g3,{...H})},z0=({$size:l})=>o.css`
     width: ${l&&w.stringifyPx(l)};
     height: ${l&&w.stringifyPx(l)};
     position: relative;

package/dist/index.es.js

@@ -7914,7 +7914,7 @@ const L3 = ({
             ${h ? `#${h}` : `.${u}`} {
             --avatar-size: ${m}px;
             }
-        `), console.log(z == null ? void 0 : z.fallbackBackgroundColor), /* @__PURE__ */ t.jsxs(
+        `), /* @__PURE__ */ t.jsxs(
     z4,
     {
       "data-testid": d && l ? `${l}.Avatar` : l,
@@ -7978,7 +7978,7 @@ const L3 = ({
   letter: f,
   icon: m,
   iconSize: o = r2(a),
-  backgroundColor: z = "danger",
+  backgroundColor: z = "primary",
   contentColor: n = z === "white" ? "primary" : z === "black" ? "white" : "background",
   className: p,
   containerStyle: M,

package/dist/index.umd.js

@@ -1112,7 +1112,7 @@ React keys must be passed directly to JSX without using spread:
             ${h?`#${h}`:`.${C}`} {
             --avatar-size: ${m}px;
             }
-        `),console.log(p==null?void 0:p.fallbackBackgroundColor),t.jsxs(P1,{"data-testid":d&&l?`${l}.Avatar`:l,ref:d?void 0:e,as:d?"span":c,id:h,className:G(d&&a?"Avatar":a,$),$backgroundColor:i,$border:r,$borderRadius:f,$size:m,$contentColor:z,$fontSize:y,...u,children:[p&&t.jsx(V2,{"data-testid":l&&`${l}.Image`,className:a&&"Image",src:typeof p=="object"?p.src:p,alt:typeof p=="object"?p.alt:"Avatar",width:"100%",height:"100%",fit:"cover",imgFallback:typeof p=="object"?{text:p.fallback??"",fontSize:p.fallbackFontSize??y,background:p.fallbackBackgroundColor??i,textColor:p.fallbackFontColor??z}:void 0}),M&&M,v&&t.jsx(l2,{"data-testid":l&&`${l}.Icon`,className:a&&"Icon",icon:v,size:g,color:z,baseUrl:n})]})},wl=({"data-testid":l,as:c,ref:e,size:a=32,border:h,borderRadius:d="circle",badge:i,img:r,letter:f,icon:m,iconSize:z=h2(a),backgroundColor:p="danger",contentColor:M=p==="white"?"primary":p==="black"?"white":"background",className:v,containerStyle:g,role:n="img",...y})=>{var R,A;const u=typeof i=="object",$=u&&i.size?i.size:8,C={"data-testid":l,as:c,className:v,hasBadge:!!i,backgroundColor:p,border:h,borderRadius:d,size:a,contentColor:M,img:r,letter:f,icon:m,iconSize:z,ref:e,role:n,...y};return i?t.jsxs(B1,{"data-testid":l,ref:e,as:c,className:v,style:g,$backgroundColor:p,$border:h,$borderRadius:d,$size:a,$contentColor:M,children:[t.jsx(U1,{...C}),t.jsx(Y1,{"data-testid":l&&`${l}.Badge`,className:G({Badge:v},`Position${x.capitalize(u&&i.position?i.position:"top")}`),size:$,number:u&&i.content?i.content:void 0,backgroundColor:u&&i.backgroundColor?i.backgroundColor:void 0,contentColor:u&&i.contentColor?i.contentColor:void 0,padding:u&&i.padding?i.padding:void 0,$width:$,$paddingLeftRight:u&&typeof i.padding=="object"&&((R=i.padding)!=null&&R.leftRight)?(A=i.padding)==null?void 0:A.leftRight:"0px",$outline:u&&i.outline?i.outline:void 0})]}):t.jsx(U1,{...C})},s0=({$size:l})=>s.css`
+        `),t.jsxs(P1,{"data-testid":d&&l?`${l}.Avatar`:l,ref:d?void 0:e,as:d?"span":c,id:h,className:G(d&&a?"Avatar":a,$),$backgroundColor:i,$border:r,$borderRadius:f,$size:m,$contentColor:z,$fontSize:y,...u,children:[p&&t.jsx(V2,{"data-testid":l&&`${l}.Image`,className:a&&"Image",src:typeof p=="object"?p.src:p,alt:typeof p=="object"?p.alt:"Avatar",width:"100%",height:"100%",fit:"cover",imgFallback:typeof p=="object"?{text:p.fallback??"",fontSize:p.fallbackFontSize??y,background:p.fallbackBackgroundColor??i,textColor:p.fallbackFontColor??z}:void 0}),M&&M,v&&t.jsx(l2,{"data-testid":l&&`${l}.Icon`,className:a&&"Icon",icon:v,size:g,color:z,baseUrl:n})]})},wl=({"data-testid":l,as:c,ref:e,size:a=32,border:h,borderRadius:d="circle",badge:i,img:r,letter:f,icon:m,iconSize:z=h2(a),backgroundColor:p="primary",contentColor:M=p==="white"?"primary":p==="black"?"white":"background",className:v,containerStyle:g,role:n="img",...y})=>{var R,A;const u=typeof i=="object",$=u&&i.size?i.size:8,C={"data-testid":l,as:c,className:v,hasBadge:!!i,backgroundColor:p,border:h,borderRadius:d,size:a,contentColor:M,img:r,letter:f,icon:m,iconSize:z,ref:e,role:n,...y};return i?t.jsxs(B1,{"data-testid":l,ref:e,as:c,className:v,style:g,$backgroundColor:p,$border:h,$borderRadius:d,$size:a,$contentColor:M,children:[t.jsx(U1,{...C}),t.jsx(Y1,{"data-testid":l&&`${l}.Badge`,className:G({Badge:v},`Position${x.capitalize(u&&i.position?i.position:"top")}`),size:$,number:u&&i.content?i.content:void 0,backgroundColor:u&&i.backgroundColor?i.backgroundColor:void 0,contentColor:u&&i.contentColor?i.contentColor:void 0,padding:u&&i.padding?i.padding:void 0,$width:$,$paddingLeftRight:u&&typeof i.padding=="object"&&((R=i.padding)!=null&&R.leftRight)?(A=i.padding)==null?void 0:A.leftRight:"0px",$outline:u&&i.outline?i.outline:void 0})]}):t.jsx(U1,{...C})},s0=({$size:l})=>s.css`
     width: ${l&&x.stringifyPx(l)};
     height: ${l&&x.stringifyPx(l)};
     position: relative;

package/dist/lib/components/Avatar/Avatar.tsx

@@ -46,7 +46,7 @@ export const Avatar: FC<ILibAvatar> = ({
 	letter,
 	icon,
 	iconSize = roundIconSize(size),
-	backgroundColor = "danger",
+	backgroundColor = "primary",
 	contentColor = backgroundColor === "white"
 		? "primary"
 		: backgroundColor === "black"

package/dist/lib/components/Avatar/AvatarFunction.tsx

@@ -59,9 +59,6 @@ export const AvatarFunction: FC<IAvatarFunction> = ({
             }
         `)
 
-	// @ts-ignore
-	console.log(img?.fallbackBackgroundColor)
-
 	return (
 		<StyledAvatar
 			data-testid={hasBadge && testid ? `${testid}.Avatar` : testid}

package/dist/lib/components/InputImage/InputImage.tsx

@@ -12,7 +12,7 @@ import type { ILibInputImage } from "./types"
  * @extends HTMLInputElement
  * @param {Object} props - InputImage props.
  * @param {string} [props.data-testid] - Test id for testing purposes.
- *  * @param {Ref<HTMLInputElement>} [props.ref] - Ref forwarded to the input element.
+ * @param {Ref<HTMLInputElement>} [props.ref] - Ref forwarded to the input element.
  * @param {string} props.id - Input id.
  * @param {string} props.value - Image source value.
  * @param {string|number} [props.width=64] - Width of the image/input.

package/dist/lib/types/component-items.ts

@@ -1,15 +1,15 @@
-import type { ReactNode, Ref } from "react"
+import type { ReactElement, ReactNode, Ref } from "react"
 import type {
-    LibButtonLinkBlank,
-    LibAllColors,
-    LibIcon,
-    LibButtonLinkBlankRequired,
-    LibSpacers,
-    LibToastStatus,
-    ReactChildren,
-    LibMessageType,
-    CssFontStyle,
-    LibColorsHover,
+	LibButtonLinkBlank,
+	LibAllColors,
+	LibIcon,
+	LibButtonLinkBlankRequired,
+	LibSpacers,
+	LibToastStatus,
+	ReactChildren,
+	LibMessageType,
+	CssFontStyle,
+	LibColorsHover,
 } from "./"
 
 /**
@@ -21,44 +21,44 @@ import type {
  * @prop ref?: ForwardedRef<T>
  */
 interface LibComponentItemBase<T> {
-    "data-testid"?: string
-    className?: string
-    id?: string
-    ref?: Ref<T>
+	"data-testid"?: string
+	className?: string
+	id?: string
+	ref?: Ref<T>
 }
 
 type ButtonGroupItemsBase = LibComponentItemBase<HTMLButtonElement> &
-    LibButtonLinkBlank & {
-        "aria-label"?: string
-        iconBaseUrl?: string
-    }
+	LibButtonLinkBlank & {
+		"aria-label"?: string
+		iconBaseUrl?: string
+	}
 
 type ButtonGroupItemText = ButtonGroupItemsBase & {
-    text: string
-    icons?: {
-        left?: LibIcon
-        right?: LibIcon
-        only?: never
-    }
-    iconSizes?: {
-        left?: number
-        right?: number
-        only?: never
-    }
+	text: string
+	icons?: {
+		left?: LibIcon
+		right?: LibIcon
+		only?: never
+	}
+	iconSizes?: {
+		left?: number
+		right?: number
+		only?: never
+	}
 }
 
 type ButtonGroupItemIcon = ButtonGroupItemsBase & {
-    text?: never
-    icons?: {
-        left?: never
-        right?: never
-        only?: LibIcon
-    }
-    iconSizes?: {
-        left?: never
-        right?: never
-        only?: number
-    }
+	text?: never
+	icons?: {
+		left?: never
+		right?: never
+		only?: LibIcon
+	}
+	iconSizes?: {
+		left?: never
+		right?: never
+		only?: number
+	}
 }
 
 /**
@@ -78,27 +78,27 @@ type ButtonGroupItemIcon = ButtonGroupItemsBase & {
 export type LibButtonGroupButtonItem = ButtonGroupItemText | ButtonGroupItemIcon
 
 interface LibButtonGroupToggleBase
-    extends LibComponentItemBase<HTMLInputElement> {
-    id: string
-    value: boolean
+	extends LibComponentItemBase<HTMLInputElement> {
+	id: string
+	value: boolean
 }
 
 interface ButtonGroupToggleWithIcon extends LibButtonGroupToggleBase {
-    icon: LibIcon
-    iconSize?: number
-    label?: string
-    tooltip?: string
-    showTooltip?: boolean
-    text?: never
+	icon: LibIcon
+	iconSize?: number
+	label?: string
+	tooltip?: string
+	showTooltip?: boolean
+	text?: never
 }
 
 interface ButtonGroupToggleWithText extends LibButtonGroupToggleBase {
-    icon?: never
-    iconSize?: never
-    label?: never
-    tooltip?: never
-    showTooltip?: never
-    text: string
+	icon?: never
+	iconSize?: never
+	label?: never
+	tooltip?: never
+	showTooltip?: never
+	text: string
 }
 
 /**
@@ -116,27 +116,27 @@ interface ButtonGroupToggleWithText extends LibButtonGroupToggleBase {
  * @prop showTooltip?: boolean => only if text is not defined
  */
 export type LibButtonGroupToggle =
-    | ButtonGroupToggleWithIcon
-    | ButtonGroupToggleWithText
+	| ButtonGroupToggleWithIcon
+	| ButtonGroupToggleWithText
 
 // ! DO NOT EXPORT
 
 type ListGroupItemBadgeColor = {
-    backgroundColor?: LibAllColors
-    contentColor?: LibAllColors
-    size?: number
+	backgroundColor?: LibAllColors
+	contentColor?: LibAllColors
+	size?: number
 }
 
 type ListGroupItemBadgeIcon = ListGroupItemBadgeColor & {
-    icon?: LibIcon
-    iconSize?: number
-    number?: never
+	icon?: LibIcon
+	iconSize?: number
+	number?: never
 }
 
 type ListGroupItemBadgeNumber = ListGroupItemBadgeColor & {
-    icon?: never
-    iconSize?: never
-    number?: number
+	icon?: never
+	iconSize?: never
+	number?: number
 }
 
 /**
@@ -148,25 +148,25 @@ type ListGroupItemBadgeNumber = ListGroupItemBadgeColor & {
  * @prop number?: number => only if icon is not defined
  */
 type ListGroupItemBadgeExtended =
-    | ListGroupItemBadgeIcon
-    | ListGroupItemBadgeNumber
+	| ListGroupItemBadgeIcon
+	| ListGroupItemBadgeNumber
 
 // ! END DO NOT EXPORT
 
 type ListGroupItemBase = LibButtonLinkBlank &
-    LibComponentItemBase<HTMLDivElement> & {
-        text: string
-        body?: string
-    }
+	LibComponentItemBase<HTMLDivElement> & {
+		text: string
+		body?: string
+	}
 
 type ListGroupItemWithBadge = ListGroupItemBase & {
-    badge?: boolean | ListGroupItemBadgeExtended
-    date?: never
+	badge?: boolean | ListGroupItemBadgeExtended
+	date?: never
 }
 
 type ListGroupItemWithDate = ListGroupItemBase & {
-    badge?: never
-    date?: string | Date
+	badge?: never
+	date?: string | Date
 }
 
 /**
@@ -194,9 +194,9 @@ export type LibListGroupItem = ListGroupItemWithBadge | ListGroupItemWithDate
  * @prop content?: ReactChildren
  */
 export interface LibAccordionItem extends LibComponentItemBase<HTMLDivElement> {
-    title: string
-    content?: ReactChildren
-    defaultOpen?: boolean
+	title: string
+	content?: ReactChildren
+	defaultOpen?: boolean
 }
 
 /**
@@ -212,12 +212,12 @@ export interface LibAccordionItem extends LibComponentItemBase<HTMLDivElement> {
  * @prop gap?: LibSpacers
  */
 export type LibDropdownItem = LibButtonLinkBlankRequired &
-    LibComponentItemBase<HTMLButtonElement & HTMLAnchorElement> & {
-        text: string
-        icon?: LibIcon
-        iconSize?: number
-        gap?: LibSpacers
-    }
+	LibComponentItemBase<HTMLButtonElement & HTMLAnchorElement> & {
+		text: string
+		icon?: LibIcon
+		iconSize?: number
+		gap?: LibSpacers
+	}
 
 /**
  * @description Props for Toaster component items: https://documentation-components-react.vercel.app/components/toast
@@ -235,21 +235,21 @@ export type LibDropdownItem = LibButtonLinkBlankRequired &
  * @prop timerBackgroundColor?: Any color from the library
  */
 export interface LibToastOptions extends LibComponentItemBase<HTMLDivElement> {
-    body?: string | ReactChildren
-    duration?: number
-    icons?: {
-        left?: LibIcon
-        close?: LibIcon
-    }
-    iconSizes?: {
-        left?: number
-        close?: number
-    }
-    iconLeftColor?: LibAllColors
-    iconsBaseUrl?: string
-    labelClose?: string
-    withTimer?: boolean
-    timerBackgroundColor?: LibAllColors
+	body?: string | ReactChildren
+	duration?: number
+	icons?: {
+		left?: LibIcon
+		close?: LibIcon
+	}
+	iconSizes?: {
+		left?: number
+		close?: number
+	}
+	iconLeftColor?: LibAllColors
+	iconsBaseUrl?: string
+	labelClose?: string
+	withTimer?: boolean
+	timerBackgroundColor?: LibAllColors
 }
 
 /**
@@ -278,10 +278,10 @@ export interface LibToastOptions extends LibComponentItemBase<HTMLDivElement> {
  * @prop timerBackgroundColor?: Any color from the library
  */
 export interface LibToast extends LibComponentItemBase<HTMLDivElement> {
-    title: string
-    id?: string
-    status?: LibToastStatus
-    options?: LibToastOptions
+	title: string
+	id?: string
+	status?: LibToastStatus
+	options?: LibToastOptions
 }
 
 /**
@@ -299,9 +299,9 @@ export interface LibToast extends LibComponentItemBase<HTMLDivElement> {
  * @prop blank?: boolean => only if to or href are defined
  */
 export type LibStep = LibButtonLinkBlank &
-    LibComponentItemBase<HTMLDivElement> & {
-        text: string
-    }
+	LibComponentItemBase<HTMLDivElement> & {
+		text: string
+	}
 
 /**
  * @description Props for Breadcrumbs component items: https://documentation-components-react.vercel.app/components/breadcrumbs
@@ -313,9 +313,9 @@ export type LibStep = LibButtonLinkBlank &
  * @prop text: string
  */
 export type LibBreadcrumbItem = LibButtonLinkBlank &
-    LibComponentItemBase<HTMLAnchorElement & HTMLSpanElement> & {
-        text: string | JSX.Element
-    }
+	LibComponentItemBase<HTMLAnchorElement & HTMLSpanElement> & {
+		text: string | ReactElement
+	}
 
 /**
  * @description Props for Tabs component items: https://documentation-components-react.vercel.app/components/tabs
@@ -327,9 +327,9 @@ export type LibBreadcrumbItem = LibButtonLinkBlank &
  * @prop content: ReactNode
  */
 export interface LibTabItem
-    extends LibComponentItemBase<HTMLDivElement & HTMLButtonElement> {
-    title: string
-    content: ReactNode
+	extends LibComponentItemBase<HTMLDivElement & HTMLButtonElement> {
+	title: string
+	content: ReactNode
 }
 
 /**
@@ -344,10 +344,10 @@ export interface LibTabItem
  * @prop time?: string
  */
 export interface LibMessage extends LibComponentItemBase<HTMLDivElement> {
-    type: LibMessageType
-    text: string
-    date?: Date | string
-    time?: string
+	type: LibMessageType
+	text: string
+	date?: Date | string
+	time?: string
 }
 
 /**
@@ -371,23 +371,23 @@ export interface LibMessage extends LibComponentItemBase<HTMLDivElement> {
  * @prop editorPreview?: boolean
  */
 export interface LibMarkdownEditorOptions {
-    titles?: boolean
-    bold?: boolean
-    italic?: boolean
-    strikethrough?: boolean
-    underline?: boolean
-    ul?: boolean
-    ol?: boolean
-    link?: boolean
-    quote?: boolean
-    hr?: boolean
-    code?: boolean
-    codeBlock?: boolean
-    comment?: boolean
-    image?: boolean
-    editorCode?: boolean
-    editorLive?: boolean
-    editorPreview?: boolean
+	titles?: boolean
+	bold?: boolean
+	italic?: boolean
+	strikethrough?: boolean
+	underline?: boolean
+	ul?: boolean
+	ol?: boolean
+	link?: boolean
+	quote?: boolean
+	hr?: boolean
+	code?: boolean
+	codeBlock?: boolean
+	comment?: boolean
+	image?: boolean
+	editorCode?: boolean
+	editorLive?: boolean
+	editorPreview?: boolean
 }
 
 /**
@@ -401,10 +401,10 @@ export interface LibMarkdownEditorOptions {
  * @prop end?: boolean => prop from react-router, to render the active class only if path is not further
  */
 export type LibHeaderLink = LibButtonLinkBlankRequired &
-    LibComponentItemBase<HTMLAnchorElement & HTMLButtonElement> & {
-        text: ReactChildren
-        end?: boolean
-    }
+	LibComponentItemBase<HTMLAnchorElement & HTMLButtonElement> & {
+		text: ReactChildren
+		end?: boolean
+	}
 
 /**
  * @description Props for Items in IconMenu component items: https://documentation-components-react.vercel.app/icon-menu
@@ -418,11 +418,11 @@ export type LibHeaderLink = LibButtonLinkBlankRequired &
  * @prop iconSize?: number
  */
 export type LibIconMenuItem = LibButtonLinkBlankRequired &
-    LibComponentItemBase<HTMLButtonElement & HTMLAnchorElement> & {
-        label: string
-        icon: LibIcon
-        iconSize?: number
-    }
+	LibComponentItemBase<HTMLButtonElement & HTMLAnchorElement> & {
+		label: string
+		icon: LibIcon
+		iconSize?: number
+	}
 
 /**
  * @description Props for links in Footer component items: https://documentation-components-react.vercel.app/components/footer
@@ -434,36 +434,36 @@ export type LibIconMenuItem = LibButtonLinkBlankRequired &
  * @prop text: ReactChildren
  */
 export type LibFooterLink = LibButtonLinkBlankRequired &
-    LibComponentItemBase<HTMLAnchorElement & HTMLButtonElement> & {
-        text: ReactChildren
-    }
+	LibComponentItemBase<HTMLAnchorElement & HTMLButtonElement> & {
+		text: ReactChildren
+	}
 
 type LibDragListItemBase = LibComponentItemBase<HTMLDivElement> & {
-    id: string
+	id: string
 }
 
 interface DragListItemWithContentAndBadge extends LibDragListItemBase {
-    title: string
-    body?: string
-    badge?: boolean | ListGroupItemBadgeExtended
-    date?: never
-    element?: never
+	title: string
+	body?: string
+	badge?: boolean | ListGroupItemBadgeExtended
+	date?: never
+	element?: never
 }
 
 interface DragListItemWithContentAndDate extends LibDragListItemBase {
-    title: string
-    body?: string
-    badge?: never
-    date?: string | Date
-    element?: never
+	title: string
+	body?: string
+	badge?: never
+	date?: string | Date
+	element?: never
 }
 
 interface DragListItemWithElement extends LibDragListItemBase {
-    title?: never
-    body?: never
-    badge?: never
-    date?: never
-    element?: JSX.Element
+	title?: never
+	body?: never
+	badge?: never
+	date?: never
+	element?: ReactElement
 }
 
 /**
@@ -479,33 +479,33 @@ interface DragListItemWithElement extends LibDragListItemBase {
  * @prop element?: JSX.ELement => only if title and other props are not defined
  */
 export type LibDragListItem =
-    | DragListItemWithContentAndBadge
-    | DragListItemWithContentAndDate
-    | DragListItemWithElement
+	| DragListItemWithContentAndBadge
+	| DragListItemWithContentAndDate
+	| DragListItemWithElement
 
 interface HelperBottomWithText {
-    text: string
-    textColor?: LibAllColors
-    fontStyle?: CssFontStyle
-    icon?: LibIcon
-    iconColor?: LibAllColors
-    iconSize?: number
-    element?: never
-    linkColor?: LibColorsHover
+	text: string
+	textColor?: LibAllColors
+	fontStyle?: CssFontStyle
+	icon?: LibIcon
+	iconColor?: LibAllColors
+	iconSize?: number
+	element?: never
+	linkColor?: LibColorsHover
 }
 
 interface HelperBottomWithElement {
-    text?: never
-    textColor?: never
-    fontStyle?: never
-    icon?: never
-    iconColor?: never
-    iconSize?: never
-    element: ReactChildren
-    linkColor?: LibColorsHover
+	text?: never
+	textColor?: never
+	fontStyle?: never
+	icon?: never
+	iconColor?: never
+	iconSize?: never
+	element: ReactChildren
+	linkColor?: LibColorsHover
 }
 
 export type LibHelperBottom =
-    | string
-    | HelperBottomWithText
-    | HelperBottomWithElement
+	| string
+	| HelperBottomWithText
+	| HelperBottomWithElement

package/package.json

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