@julseb-lib/react 1.1.0 → 1.1.1

package/dist/index.d.cts

@@ -2,18 +2,18 @@ import { c as LibColorsHover, ag as CssTextAlign, L as LibColors, a as LibColors
 export { aw as designTokens } from './global-DrPydXbS.cjs';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { ClassNameValue } from 'tailwind-merge';
-import { MarkdownToJSX } from 'markdown-to-jsx';
 import { LibMdEditorOptions } from './types/components-items-props.cjs';
+import { Components } from 'react-markdown';
 export { addDay, addMonth, addYear, calculateAverage, calculateTotalSum, capitalize, convertDate, convertDateShort, convertPrice, convertTime, convertToEmail, convertYoutube, decrypt, deleteDuplicates, emailRegex, encrypt, filterObject, formatDate, formatHour, generateNumbers, getFirstName, getInitials, getLastName, getNextDay, getPercentage, getRandom, getRandomAvatar, getRandomDate, getRandomNumber, getRandomString, getRandomTime, getTimeNow, getToday, getTomorrow, getYesterday, hexToRgb, passwordRegex, rgbToHex, slugify, sortByFrequency, stringifyPx, toCamelCase, toConstantCase, toDotCase, toKebabCase, toPascalCase, toPathCase, toSentenceCase, toSnakeCase, toTitleCase, unslugify, uuid } from '@julseb-lib/utils';
 import * as react from 'react';
 import { RefObject, ChangeEvent, RefCallback, Ref, FC as FC$1 } from 'react';
-import { ILibText, ILibWrapper, ILibMain, ILibAside, ILibSection, ILibGrid, ILibFlexbox, ILibKey, ILibHighlight, ILibLinkify, ILibHr, ILibSkeleton, ILibSkeletonCard, ILibTooltip, ILibImage, ILibMasonry, ILibBadge, ILibAvatar, ILibLoader, ILibBurger, ILibButton, ILibButtonIcon, ILibButtonGroup, ILibTag, ILibInputContainer, ILibInput, ILibInputImage, ILibInputCheck, ILibInputPhone, ILibInputCounter, ILibInputSlider, ILibSelect, ILibAutocomplete, ILibRating, ILibInputPin, ILibFieldset, ILibForm, ILibListGroup, ILibListGroupTitle, ILibListGroupItem, ILibBreadcrumbs, ILibAccordion, ILibAccordionItem, ILibDropdown, ILibDropdownItem, ILibToast, ILibAlert, ILibModal, ILibDragList, ILibDragListItem, ILibPagination, ILibPaginationButton, ILibPaginator, ILibProgressBar, ILibProgressCircle, ILibTabs, ILibTabsContainer, ILibTabsButtonsContainer, ILibTabsButton, ILibTabContent, ILibSlideshow, ILibCover, ILibTable, ILibPageLoading, ILibSticky, ILibMarkdownEditor, ILibMarkdownContainer, ILibFade, ILibBackToTop, ILibDrawer, ILibHeader, ILibFooter, ILibMeta, ILibPageLayout, ILibSrOnly, ILibCodeContainer, ILibCarousel, ILibLazyImage } from './types/components-props.cjs';
+import { ILibText, ILibWrapper, ILibMain, ILibAside, ILibSection, ILibGrid, ILibFlexbox, ILibKey, ILibHighlight, ILibLinkify, ILibHr, ILibSkeleton, ILibSkeletonCard, ILibTooltip, ILibImage, ILibLazyImage, ILibMasonry, ILibBadge, ILibAvatar, ILibLoader, ILibBurger, ILibButton, ILibButtonIcon, ILibButtonGroup, ILibTag, ILibInputContainer, ILibInput, ILibInputImage, ILibInputCheck, ILibInputPhone, ILibInputCounter, ILibInputSlider, ILibSelect, ILibAutocomplete, ILibRating, ILibInputPin, ILibFieldset, ILibForm, ILibListGroup, ILibListGroupTitle, ILibListGroupItem, ILibBreadcrumbs, ILibAccordion, ILibAccordionItem, ILibDropdown, ILibDropdownItem, ILibToast, ILibAlert, ILibModal, ILibDragList, ILibDragListItem, ILibPagination, ILibPaginationButton, ILibPaginator, ILibProgressBar, ILibProgressCircle, ILibTabs, ILibTabsContainer, ILibTabsButtonsContainer, ILibTabsButton, ILibTabContent, ILibSlideshow, ILibCarousel, ILibCover, ILibTable, ILibPageLoading, ILibSticky, ILibMarkdownEditor, ILibMarkdownContainer, ILibCodeContainer, ILibFade, ILibBackToTop, ILibDrawer, ILibHeader, ILibFooter, ILibMeta, ILibPageLayout, ILibSrOnly } from './types/components-props.cjs';
 import * as react_toastify from 'react-toastify';
 import { ToastContainerProps, ToastOptions } from 'react-toastify';
 import 'csstype';
 import 'fuse.js';
-import './types/require-at-least-one.cjs';
 import 'prism-react-renderer';
+import './types/require-at-least-one.cjs';
 
 declare const URL_REGEX: RegExp;
 declare const linkifyText: (text: string, blank?: boolean) => (string | react_jsx_runtime.JSX.Element)[];
@@ -66,7 +66,7 @@ declare const genBoxShadow: Record<LibShadows, string>;
 
 declare const genVAlign: Record<CssVerticalAlign, string>;
 
-declare const libOptionsMarkdown: MarkdownToJSX.Options;
+declare const markdownComponents: Components;
 declare const libMarkdownEditorOptions: LibMdEditorOptions;
 
 declare const genRingColor: Record<LibColorsHover, string>;
@@ -1227,6 +1227,34 @@ declare const Tooltip: FC$1<ILibTooltip>;
  */
 declare const Image: FC$1<ILibImage>;
 
+/**
+ * LazyImage component for lazy-loading images with a skeleton placeholder.
+ *
+ * @component
+ *
+ * @example
+ * <LazyImage
+ *   src="https://example.com/image.jpg"
+ *   alt="Example image"
+ *   skeletonClasses="h-48"
+ *   skeletonAnimation="pulse"
+ *   className="rounded"
+ * />
+ *
+ * @extends HTMLImageElement
+ *
+ * @prop {string} [props.className] - Additional CSS classes to apply to the image.
+ * @prop {React.Ref<HTMLImageElement>} [props.ref] - Ref to the image element.
+ * @prop {string} [props.skeletonClasses] - Additional CSS classes for the skeleton placeholder.
+ * @prop {"pulse" | "shine" | "none"} [props.skeletonAnimation="shine"] - Animation style for the skeleton placeholder.
+ * @prop {object} [props.rest] - Additional props spread to the image element.
+ *
+ * @returns {JSX.Element} The rendered LazyImage component with a skeleton fallback while loading.
+ *
+ * @see https://doc-julseb-lib-react.vercel.app/components/lazy-image
+ */
+declare const LazyImage: FC$1<ILibLazyImage>;
+
 /**
  * Masonry component for displaying content in a responsive masonry grid layout.
  *
@@ -2867,6 +2895,39 @@ declare const TabsContent: FC$1<ILibTabContent>;
  */
 declare const Slideshow: FC$1<ILibSlideshow>;
 
+/**
+ * A carousel component that displays a continuous scrolling animation of items (images or custom content).
+ *
+ * @component
+ *
+ * @example
+ * // Basic image carousel
+ * <Carousel items={["image1.jpg", "image2.jpg", "image3.jpg"]} showItems={3} />
+ *
+ * // Carousel with custom content
+ * <Carousel
+ *   items={[<div>Custom content 1</div>, <div>Custom content 2</div>]}
+ *   stopOnHover
+ *   speed={15}
+ * />
+ *
+ * @extends ILibCarousel
+ *
+ * @prop {string} [props.className] - Additional CSS classes to apply to the component
+ * @prop {keyof JSX.IntrinsicElements} [props.element="div"] - HTML element type to render as the root element
+ * @prop {Ref<HTMLDivElement>} [props.ref] - React ref for the root element
+ * @prop {Array<string> | Array<ReactChildren>} props.items - Array of image URLs (strings) or custom React elements to display in the carousel
+ * @prop {boolean} [props.stopOnHover] - Whether to pause the animation when hovering over the carousel
+ * @prop {2 | 3 | 4 | 5 | 6} [props.showItems=4] - Number of items to show simultaneously in the carousel viewport
+ * @prop {"cover" | "contain"} [props.imgFit="cover"] - CSS object-fit property for images (only applies when items are strings)
+ * @prop {number} [props.speed=20] - Animation duration in seconds for one complete scroll cycle
+ *
+ * @returns A carousel component with continuous scrolling animation and optional gradient overlays
+ *
+ * @see https://doc-julseb-lib-react.vercel.app/components/carousel
+ */
+declare const Carousel: FC$1<ILibCarousel>;
+
 /**
  * Cover component for creating full-screen layouts with background images, overlays, and content positioning.
  *
@@ -3038,6 +3099,10 @@ declare const MarkdownEditor: FC$1<ILibMarkdownEditor>;
 /**
  * MarkdownContainer component for rendering markdown content with customizable parsing options and styling.
  *
+ * Renders Markdown using the `react-markdown` library, allowing you to override default Markdown elements
+ * with custom React components via the `components` prop. Supports additional configuration such as
+ * filtering elements and transforming URLs.
+ *
  * @component
  *
  * @example
@@ -3048,10 +3113,13 @@ declare const MarkdownEditor: FC$1<ILibMarkdownEditor>;
  *
  * @extends HTMLDivElement
  *
- * @prop {string} [props.className] - Additional CSS classes to apply to the markdown container.
- * @prop {React.Ref<HTMLDivElement>} [props.ref] - Ref to the markdown container element.
- * @prop {string} [props.children] - Markdown content to parse and render.
- * @prop {object} [props.options=libOptionsMarkdown] - Markdown parsing options and configurations.
+ * @prop {string} [className] - Additional CSS classes to apply to the markdown container.
+ * @prop {React.Ref<HTMLDivElement>} [ref] - Ref to the markdown container element.
+ * @prop {string} [children] - Markdown content to parse and render.
+ * @prop {object} [components=markdownComponents] - Custom React components to override default Markdown rendering.
+ * @prop {(element: React.ElementType, props: any) => boolean} [allowElement] - Function to filter which elements are allowed.
+ * @prop {(url: string, key: string, node: any) => string} [urlTransform] - Function to transform URLs in Markdown.
+ * @prop {object} [rest] - Additional props spread to the underlying Markdown component.
  *
  * @returns {JSX.Element} The rendered MarkdownContainer component.
  *
@@ -3059,6 +3127,30 @@ declare const MarkdownEditor: FC$1<ILibMarkdownEditor>;
  */
 declare const MarkdownContainer: FC$1<ILibMarkdownContainer>;
 
+/**
+ * A container component for displaying syntax-highlighted code blocks with copy-to-clipboard functionality.
+ *
+ * @component
+ *
+ * @example
+ * <CodeContainer language="tsx" theme={themes.oneDark}>
+ *   {`const foo = "bar"`}
+ * </CodeContainer>
+ *
+ * @extends {Omit<HighlightProps, "children" | "code" | "language">}
+ *
+ * @prop {string} [props.children] - The code string to be highlighted and displayed. If starting with "$ ", it will be removed before copying. Default: undefined.
+ * @prop {boolean} [props.showNumbers] Possible values: true, false. Default: false. - If true, shows the line numbers in the code block.
+ * @prop {string} [props.language] Possible values: any valid Prism language string (e.g., "tsx", "js", "shell"). Default: "tsx". - The language for syntax highlighting.
+ * @prop {string} [props.className] - Additional CSS classes to apply to the container.
+ * @prop {...HighlightProps} [props.<other>] - All other props from HighlightProps except "children" and "code".
+ *
+ * @returns {JSX.Element} The rendered code block with syntax highlighting and a copy button.
+ *
+ * @see https://doc-julseb-lib-react.vercel.app/components/code-container
+ */
+declare const CodeContainer: FC$1<ILibCodeContainer>;
+
 /**
  * Fade component for creating smooth fade-in animations when elements enter the viewport.
  *
@@ -3337,89 +3429,4 @@ declare const PageLayout: FC$1<ILibPageLayout>;
  */
 declare const SrOnly: FC$1<ILibSrOnly>;
 
-/**
- * A container component for displaying syntax-highlighted code blocks with copy-to-clipboard functionality.
- *
- * @component
- *
- * @example
- * <CodeContainer language="tsx" theme={themes.oneDark}>
- *   {`const foo = "bar"`}
- * </CodeContainer>
- *
- * @extends {Omit<HighlightProps, "children" | "code" | "language">}
- *
- * @prop {string} [props.children] - The code string to be highlighted and displayed. If starting with "$ ", it will be removed before copying. Default: undefined.
- * @prop {boolean} [props.showNumbers] Possible values: true, false. Default: false. - If true, shows the line numbers in the code block.
- * @prop {string} [props.language] Possible values: any valid Prism language string (e.g., "tsx", "js", "shell"). Default: "tsx". - The language for syntax highlighting.
- * @prop {string} [props.className] - Additional CSS classes to apply to the container.
- * @prop {...HighlightProps} [props.<other>] - All other props from HighlightProps except "children" and "code".
- *
- * @returns {JSX.Element} The rendered code block with syntax highlighting and a copy button.
- *
- * @see https://doc-julseb-lib-react.vercel.app/components/code-container
- */
-declare const CodeContainer: FC$1<ILibCodeContainer>;
-
-/**
- * A carousel component that displays a continuous scrolling animation of items (images or custom content).
- *
- * @component
- *
- * @example
- * // Basic image carousel
- * <Carousel items={["image1.jpg", "image2.jpg", "image3.jpg"]} showItems={3} />
- *
- * // Carousel with custom content
- * <Carousel
- *   items={[<div>Custom content 1</div>, <div>Custom content 2</div>]}
- *   stopOnHover
- *   speed={15}
- * />
- *
- * @extends ILibCarousel
- *
- * @prop {string} [props.className] - Additional CSS classes to apply to the component
- * @prop {keyof JSX.IntrinsicElements} [props.element="div"] - HTML element type to render as the root element
- * @prop {Ref<HTMLDivElement>} [props.ref] - React ref for the root element
- * @prop {Array<string> | Array<ReactChildren>} props.items - Array of image URLs (strings) or custom React elements to display in the carousel
- * @prop {boolean} [props.stopOnHover] - Whether to pause the animation when hovering over the carousel
- * @prop {2 | 3 | 4 | 5 | 6} [props.showItems=4] - Number of items to show simultaneously in the carousel viewport
- * @prop {"cover" | "contain"} [props.imgFit="cover"] - CSS object-fit property for images (only applies when items are strings)
- * @prop {number} [props.speed=20] - Animation duration in seconds for one complete scroll cycle
- *
- * @returns A carousel component with continuous scrolling animation and optional gradient overlays
- *
- * @see https://doc-julseb-lib-react.vercel.app/components/carousel
- */
-declare const Carousel: FC$1<ILibCarousel>;
-
-/**
- * LazyImage component for lazy-loading images with a skeleton placeholder.
- *
- * @component
- *
- * @example
- * <LazyImage
- *   src="https://example.com/image.jpg"
- *   alt="Example image"
- *   skeletonClasses="h-48"
- *   skeletonAnimation="pulse"
- *   className="rounded"
- * />
- *
- * @extends HTMLImageElement
- *
- * @prop {string} [props.className] - Additional CSS classes to apply to the image.
- * @prop {React.Ref<HTMLImageElement>} [props.ref] - Ref to the image element.
- * @prop {string} [props.skeletonClasses] - Additional CSS classes for the skeleton placeholder.
- * @prop {"pulse" | "shine" | "none"} [props.skeletonAnimation="shine"] - Animation style for the skeleton placeholder.
- * @prop {object} [props.rest] - Additional props spread to the image element.
- *
- * @returns {JSX.Element} The rendered LazyImage component with a skeleton fallback while loading.
- *
- * @see https://doc-julseb-lib-react.vercel.app/components/lazy-image
- */
-declare const LazyImage: FC$1<ILibLazyImage>;
-
-export { Accordion, AccordionItem, Alert, Aside, Autocomplete, Avatar, BackToTop, Badge, Breadcrumbs, Burger, Button, ButtonGroup, ButtonIcon, COLORS, Carousel, CodeContainer, Cover, DROP_SHADOWS, DragList, DragListItem, Drawer, Dropdown, DropdownItem, FONT_FAMILIES, FONT_SIZES, FONT_WEIGHTS, Fade, Fieldset, Flexbox, Footer, Form, Grid, Header, Highlight, Hr, ICON_MULTIPLIER, INPUT_HEIGHT, INSET_SHADOWS, Image, Input, InputCheck, InputContainer, InputCounter, InputImage, InputPhone, InputPin, InputSlider, Key, LAYOUTS, LINE_HEIGHTS, LazyImage, Linkify, ListGroup, ListGroupItem, ListGroupTitle, Loader, MEDIA, Main, MarkdownContainer, MarkdownEditor, Masonry, Meta, Modal, OVERLAYS, PageLayout, PageLoading, Pagination, PaginationButton, Paginator, ProgressBar, ProgressCircle, RADIUSES, Rating, SHADOWS, SPACERS, Section, Select, Skeleton, SkeletonCard, Slideshow, SrOnly, Sticky, TEXT_BASE_CLASSES, TEXT_SHADOWS, TRANSITIONS, Table, Tabs, TabsButton, TabsButtonsContainer, TabsContainer, TabsContent, Tag, Text, ThemeProviderWrapper, Toast, ToastContainer, Tooltip, URL_REGEX, Wrapper, clsx, countries, detectLanguage, disableScroll, enableScroll, genAlignContent, genAlignItems, genBgAllColors, genBgAllColorsAndOverlays, genBgColor, genBgColor50, genBgColorGhostHover, genBgColorHover, genBgColorShort, genBgOverlay, genBorderAllColors, genBorderColor, genBorderColorHover, genBorderColorShort, genBorderRadius, genBoxShadow, genButtonColor, genButtonDisabled, genColGap, genGap, genJustifyContent, genJustifyItems, genLinkColor, genMaxWidth, genObjectFit, genRingColor, genRingColorChildren, genRowGap, genTextAlign, genTextAllColor, genTextColor, genTextColorHover, genTextColorShort, genVAlign, libMarkdownEditorOptions, libOptionsMarkdown, linkifyText, scrollToTop, toast, useClickOutside, useCopyToClipboard, useDebounce, useExportData, useFetch, useForm, useIsOverflow, useKeyPress, useLibTheme, useMaxWidth, useMergeRefs, useMinWidth, usePaginatedData, usePagination, useTextLineCount, useTouchScreen, useTranslation };
+export { Accordion, AccordionItem, Alert, Aside, Autocomplete, Avatar, BackToTop, Badge, Breadcrumbs, Burger, Button, ButtonGroup, ButtonIcon, COLORS, Carousel, CodeContainer, Cover, DROP_SHADOWS, DragList, DragListItem, Drawer, Dropdown, DropdownItem, FONT_FAMILIES, FONT_SIZES, FONT_WEIGHTS, Fade, Fieldset, Flexbox, Footer, Form, Grid, Header, Highlight, Hr, ICON_MULTIPLIER, INPUT_HEIGHT, INSET_SHADOWS, Image, Input, InputCheck, InputContainer, InputCounter, InputImage, InputPhone, InputPin, InputSlider, Key, LAYOUTS, LINE_HEIGHTS, LazyImage, Linkify, ListGroup, ListGroupItem, ListGroupTitle, Loader, MEDIA, Main, MarkdownContainer, MarkdownEditor, Masonry, Meta, Modal, OVERLAYS, PageLayout, PageLoading, Pagination, PaginationButton, Paginator, ProgressBar, ProgressCircle, RADIUSES, Rating, SHADOWS, SPACERS, Section, Select, Skeleton, SkeletonCard, Slideshow, SrOnly, Sticky, TEXT_BASE_CLASSES, TEXT_SHADOWS, TRANSITIONS, Table, Tabs, TabsButton, TabsButtonsContainer, TabsContainer, TabsContent, Tag, Text, ThemeProviderWrapper, Toast, ToastContainer, Tooltip, URL_REGEX, Wrapper, clsx, countries, detectLanguage, disableScroll, enableScroll, genAlignContent, genAlignItems, genBgAllColors, genBgAllColorsAndOverlays, genBgColor, genBgColor50, genBgColorGhostHover, genBgColorHover, genBgColorShort, genBgOverlay, genBorderAllColors, genBorderColor, genBorderColorHover, genBorderColorShort, genBorderRadius, genBoxShadow, genButtonColor, genButtonDisabled, genColGap, genGap, genJustifyContent, genJustifyItems, genLinkColor, genMaxWidth, genObjectFit, genRingColor, genRingColorChildren, genRowGap, genTextAlign, genTextAllColor, genTextColor, genTextColorHover, genTextColorShort, genVAlign, libMarkdownEditorOptions, linkifyText, markdownComponents, scrollToTop, toast, useClickOutside, useCopyToClipboard, useDebounce, useExportData, useFetch, useForm, useIsOverflow, useKeyPress, useLibTheme, useMaxWidth, useMergeRefs, useMinWidth, usePaginatedData, usePagination, useTextLineCount, useTouchScreen, useTranslation };

package/dist/index.d.ts

@@ -2,18 +2,18 @@ import { c as LibColorsHover, ag as CssTextAlign, L as LibColors, a as LibColors
 export { aw as designTokens } from './global-DrPydXbS.js';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { ClassNameValue } from 'tailwind-merge';
-import { MarkdownToJSX } from 'markdown-to-jsx';
 import { LibMdEditorOptions } from './types/components-items-props.js';
+import { Components } from 'react-markdown';
 export { addDay, addMonth, addYear, calculateAverage, calculateTotalSum, capitalize, convertDate, convertDateShort, convertPrice, convertTime, convertToEmail, convertYoutube, decrypt, deleteDuplicates, emailRegex, encrypt, filterObject, formatDate, formatHour, generateNumbers, getFirstName, getInitials, getLastName, getNextDay, getPercentage, getRandom, getRandomAvatar, getRandomDate, getRandomNumber, getRandomString, getRandomTime, getTimeNow, getToday, getTomorrow, getYesterday, hexToRgb, passwordRegex, rgbToHex, slugify, sortByFrequency, stringifyPx, toCamelCase, toConstantCase, toDotCase, toKebabCase, toPascalCase, toPathCase, toSentenceCase, toSnakeCase, toTitleCase, unslugify, uuid } from '@julseb-lib/utils';
 import * as react from 'react';
 import { RefObject, ChangeEvent, RefCallback, Ref, FC as FC$1 } from 'react';
-import { ILibText, ILibWrapper, ILibMain, ILibAside, ILibSection, ILibGrid, ILibFlexbox, ILibKey, ILibHighlight, ILibLinkify, ILibHr, ILibSkeleton, ILibSkeletonCard, ILibTooltip, ILibImage, ILibMasonry, ILibBadge, ILibAvatar, ILibLoader, ILibBurger, ILibButton, ILibButtonIcon, ILibButtonGroup, ILibTag, ILibInputContainer, ILibInput, ILibInputImage, ILibInputCheck, ILibInputPhone, ILibInputCounter, ILibInputSlider, ILibSelect, ILibAutocomplete, ILibRating, ILibInputPin, ILibFieldset, ILibForm, ILibListGroup, ILibListGroupTitle, ILibListGroupItem, ILibBreadcrumbs, ILibAccordion, ILibAccordionItem, ILibDropdown, ILibDropdownItem, ILibToast, ILibAlert, ILibModal, ILibDragList, ILibDragListItem, ILibPagination, ILibPaginationButton, ILibPaginator, ILibProgressBar, ILibProgressCircle, ILibTabs, ILibTabsContainer, ILibTabsButtonsContainer, ILibTabsButton, ILibTabContent, ILibSlideshow, ILibCover, ILibTable, ILibPageLoading, ILibSticky, ILibMarkdownEditor, ILibMarkdownContainer, ILibFade, ILibBackToTop, ILibDrawer, ILibHeader, ILibFooter, ILibMeta, ILibPageLayout, ILibSrOnly, ILibCodeContainer, ILibCarousel, ILibLazyImage } from './types/components-props.js';
+import { ILibText, ILibWrapper, ILibMain, ILibAside, ILibSection, ILibGrid, ILibFlexbox, ILibKey, ILibHighlight, ILibLinkify, ILibHr, ILibSkeleton, ILibSkeletonCard, ILibTooltip, ILibImage, ILibLazyImage, ILibMasonry, ILibBadge, ILibAvatar, ILibLoader, ILibBurger, ILibButton, ILibButtonIcon, ILibButtonGroup, ILibTag, ILibInputContainer, ILibInput, ILibInputImage, ILibInputCheck, ILibInputPhone, ILibInputCounter, ILibInputSlider, ILibSelect, ILibAutocomplete, ILibRating, ILibInputPin, ILibFieldset, ILibForm, ILibListGroup, ILibListGroupTitle, ILibListGroupItem, ILibBreadcrumbs, ILibAccordion, ILibAccordionItem, ILibDropdown, ILibDropdownItem, ILibToast, ILibAlert, ILibModal, ILibDragList, ILibDragListItem, ILibPagination, ILibPaginationButton, ILibPaginator, ILibProgressBar, ILibProgressCircle, ILibTabs, ILibTabsContainer, ILibTabsButtonsContainer, ILibTabsButton, ILibTabContent, ILibSlideshow, ILibCarousel, ILibCover, ILibTable, ILibPageLoading, ILibSticky, ILibMarkdownEditor, ILibMarkdownContainer, ILibCodeContainer, ILibFade, ILibBackToTop, ILibDrawer, ILibHeader, ILibFooter, ILibMeta, ILibPageLayout, ILibSrOnly } from './types/components-props.js';
 import * as react_toastify from 'react-toastify';
 import { ToastContainerProps, ToastOptions } from 'react-toastify';
 import 'csstype';
 import 'fuse.js';
-import './types/require-at-least-one.js';
 import 'prism-react-renderer';
+import './types/require-at-least-one.js';
 
 declare const URL_REGEX: RegExp;
 declare const linkifyText: (text: string, blank?: boolean) => (string | react_jsx_runtime.JSX.Element)[];
@@ -66,7 +66,7 @@ declare const genBoxShadow: Record<LibShadows, string>;
 
 declare const genVAlign: Record<CssVerticalAlign, string>;
 
-declare const libOptionsMarkdown: MarkdownToJSX.Options;
+declare const markdownComponents: Components;
 declare const libMarkdownEditorOptions: LibMdEditorOptions;
 
 declare const genRingColor: Record<LibColorsHover, string>;
@@ -1227,6 +1227,34 @@ declare const Tooltip: FC$1<ILibTooltip>;
  */
 declare const Image: FC$1<ILibImage>;
 
+/**
+ * LazyImage component for lazy-loading images with a skeleton placeholder.
+ *
+ * @component
+ *
+ * @example
+ * <LazyImage
+ *   src="https://example.com/image.jpg"
+ *   alt="Example image"
+ *   skeletonClasses="h-48"
+ *   skeletonAnimation="pulse"
+ *   className="rounded"
+ * />
+ *
+ * @extends HTMLImageElement
+ *
+ * @prop {string} [props.className] - Additional CSS classes to apply to the image.
+ * @prop {React.Ref<HTMLImageElement>} [props.ref] - Ref to the image element.
+ * @prop {string} [props.skeletonClasses] - Additional CSS classes for the skeleton placeholder.
+ * @prop {"pulse" | "shine" | "none"} [props.skeletonAnimation="shine"] - Animation style for the skeleton placeholder.
+ * @prop {object} [props.rest] - Additional props spread to the image element.
+ *
+ * @returns {JSX.Element} The rendered LazyImage component with a skeleton fallback while loading.
+ *
+ * @see https://doc-julseb-lib-react.vercel.app/components/lazy-image
+ */
+declare const LazyImage: FC$1<ILibLazyImage>;
+
 /**
  * Masonry component for displaying content in a responsive masonry grid layout.
  *
@@ -2867,6 +2895,39 @@ declare const TabsContent: FC$1<ILibTabContent>;
  */
 declare const Slideshow: FC$1<ILibSlideshow>;
 
+/**
+ * A carousel component that displays a continuous scrolling animation of items (images or custom content).
+ *
+ * @component
+ *
+ * @example
+ * // Basic image carousel
+ * <Carousel items={["image1.jpg", "image2.jpg", "image3.jpg"]} showItems={3} />
+ *
+ * // Carousel with custom content
+ * <Carousel
+ *   items={[<div>Custom content 1</div>, <div>Custom content 2</div>]}
+ *   stopOnHover
+ *   speed={15}
+ * />
+ *
+ * @extends ILibCarousel
+ *
+ * @prop {string} [props.className] - Additional CSS classes to apply to the component
+ * @prop {keyof JSX.IntrinsicElements} [props.element="div"] - HTML element type to render as the root element
+ * @prop {Ref<HTMLDivElement>} [props.ref] - React ref for the root element
+ * @prop {Array<string> | Array<ReactChildren>} props.items - Array of image URLs (strings) or custom React elements to display in the carousel
+ * @prop {boolean} [props.stopOnHover] - Whether to pause the animation when hovering over the carousel
+ * @prop {2 | 3 | 4 | 5 | 6} [props.showItems=4] - Number of items to show simultaneously in the carousel viewport
+ * @prop {"cover" | "contain"} [props.imgFit="cover"] - CSS object-fit property for images (only applies when items are strings)
+ * @prop {number} [props.speed=20] - Animation duration in seconds for one complete scroll cycle
+ *
+ * @returns A carousel component with continuous scrolling animation and optional gradient overlays
+ *
+ * @see https://doc-julseb-lib-react.vercel.app/components/carousel
+ */
+declare const Carousel: FC$1<ILibCarousel>;
+
 /**
  * Cover component for creating full-screen layouts with background images, overlays, and content positioning.
  *
@@ -3038,6 +3099,10 @@ declare const MarkdownEditor: FC$1<ILibMarkdownEditor>;
 /**
  * MarkdownContainer component for rendering markdown content with customizable parsing options and styling.
  *
+ * Renders Markdown using the `react-markdown` library, allowing you to override default Markdown elements
+ * with custom React components via the `components` prop. Supports additional configuration such as
+ * filtering elements and transforming URLs.
+ *
  * @component
  *
  * @example
@@ -3048,10 +3113,13 @@ declare const MarkdownEditor: FC$1<ILibMarkdownEditor>;
  *
  * @extends HTMLDivElement
  *
- * @prop {string} [props.className] - Additional CSS classes to apply to the markdown container.
- * @prop {React.Ref<HTMLDivElement>} [props.ref] - Ref to the markdown container element.
- * @prop {string} [props.children] - Markdown content to parse and render.
- * @prop {object} [props.options=libOptionsMarkdown] - Markdown parsing options and configurations.
+ * @prop {string} [className] - Additional CSS classes to apply to the markdown container.
+ * @prop {React.Ref<HTMLDivElement>} [ref] - Ref to the markdown container element.
+ * @prop {string} [children] - Markdown content to parse and render.
+ * @prop {object} [components=markdownComponents] - Custom React components to override default Markdown rendering.
+ * @prop {(element: React.ElementType, props: any) => boolean} [allowElement] - Function to filter which elements are allowed.
+ * @prop {(url: string, key: string, node: any) => string} [urlTransform] - Function to transform URLs in Markdown.
+ * @prop {object} [rest] - Additional props spread to the underlying Markdown component.
  *
  * @returns {JSX.Element} The rendered MarkdownContainer component.
  *
@@ -3059,6 +3127,30 @@ declare const MarkdownEditor: FC$1<ILibMarkdownEditor>;
  */
 declare const MarkdownContainer: FC$1<ILibMarkdownContainer>;
 
+/**
+ * A container component for displaying syntax-highlighted code blocks with copy-to-clipboard functionality.
+ *
+ * @component
+ *
+ * @example
+ * <CodeContainer language="tsx" theme={themes.oneDark}>
+ *   {`const foo = "bar"`}
+ * </CodeContainer>
+ *
+ * @extends {Omit<HighlightProps, "children" | "code" | "language">}
+ *
+ * @prop {string} [props.children] - The code string to be highlighted and displayed. If starting with "$ ", it will be removed before copying. Default: undefined.
+ * @prop {boolean} [props.showNumbers] Possible values: true, false. Default: false. - If true, shows the line numbers in the code block.
+ * @prop {string} [props.language] Possible values: any valid Prism language string (e.g., "tsx", "js", "shell"). Default: "tsx". - The language for syntax highlighting.
+ * @prop {string} [props.className] - Additional CSS classes to apply to the container.
+ * @prop {...HighlightProps} [props.<other>] - All other props from HighlightProps except "children" and "code".
+ *
+ * @returns {JSX.Element} The rendered code block with syntax highlighting and a copy button.
+ *
+ * @see https://doc-julseb-lib-react.vercel.app/components/code-container
+ */
+declare const CodeContainer: FC$1<ILibCodeContainer>;
+
 /**
  * Fade component for creating smooth fade-in animations when elements enter the viewport.
  *
@@ -3337,89 +3429,4 @@ declare const PageLayout: FC$1<ILibPageLayout>;
  */
 declare const SrOnly: FC$1<ILibSrOnly>;
 
-/**
- * A container component for displaying syntax-highlighted code blocks with copy-to-clipboard functionality.
- *
- * @component
- *
- * @example
- * <CodeContainer language="tsx" theme={themes.oneDark}>
- *   {`const foo = "bar"`}
- * </CodeContainer>
- *
- * @extends {Omit<HighlightProps, "children" | "code" | "language">}
- *
- * @prop {string} [props.children] - The code string to be highlighted and displayed. If starting with "$ ", it will be removed before copying. Default: undefined.
- * @prop {boolean} [props.showNumbers] Possible values: true, false. Default: false. - If true, shows the line numbers in the code block.
- * @prop {string} [props.language] Possible values: any valid Prism language string (e.g., "tsx", "js", "shell"). Default: "tsx". - The language for syntax highlighting.
- * @prop {string} [props.className] - Additional CSS classes to apply to the container.
- * @prop {...HighlightProps} [props.<other>] - All other props from HighlightProps except "children" and "code".
- *
- * @returns {JSX.Element} The rendered code block with syntax highlighting and a copy button.
- *
- * @see https://doc-julseb-lib-react.vercel.app/components/code-container
- */
-declare const CodeContainer: FC$1<ILibCodeContainer>;
-
-/**
- * A carousel component that displays a continuous scrolling animation of items (images or custom content).
- *
- * @component
- *
- * @example
- * // Basic image carousel
- * <Carousel items={["image1.jpg", "image2.jpg", "image3.jpg"]} showItems={3} />
- *
- * // Carousel with custom content
- * <Carousel
- *   items={[<div>Custom content 1</div>, <div>Custom content 2</div>]}
- *   stopOnHover
- *   speed={15}
- * />
- *
- * @extends ILibCarousel
- *
- * @prop {string} [props.className] - Additional CSS classes to apply to the component
- * @prop {keyof JSX.IntrinsicElements} [props.element="div"] - HTML element type to render as the root element
- * @prop {Ref<HTMLDivElement>} [props.ref] - React ref for the root element
- * @prop {Array<string> | Array<ReactChildren>} props.items - Array of image URLs (strings) or custom React elements to display in the carousel
- * @prop {boolean} [props.stopOnHover] - Whether to pause the animation when hovering over the carousel
- * @prop {2 | 3 | 4 | 5 | 6} [props.showItems=4] - Number of items to show simultaneously in the carousel viewport
- * @prop {"cover" | "contain"} [props.imgFit="cover"] - CSS object-fit property for images (only applies when items are strings)
- * @prop {number} [props.speed=20] - Animation duration in seconds for one complete scroll cycle
- *
- * @returns A carousel component with continuous scrolling animation and optional gradient overlays
- *
- * @see https://doc-julseb-lib-react.vercel.app/components/carousel
- */
-declare const Carousel: FC$1<ILibCarousel>;
-
-/**
- * LazyImage component for lazy-loading images with a skeleton placeholder.
- *
- * @component
- *
- * @example
- * <LazyImage
- *   src="https://example.com/image.jpg"
- *   alt="Example image"
- *   skeletonClasses="h-48"
- *   skeletonAnimation="pulse"
- *   className="rounded"
- * />
- *
- * @extends HTMLImageElement
- *
- * @prop {string} [props.className] - Additional CSS classes to apply to the image.
- * @prop {React.Ref<HTMLImageElement>} [props.ref] - Ref to the image element.
- * @prop {string} [props.skeletonClasses] - Additional CSS classes for the skeleton placeholder.
- * @prop {"pulse" | "shine" | "none"} [props.skeletonAnimation="shine"] - Animation style for the skeleton placeholder.
- * @prop {object} [props.rest] - Additional props spread to the image element.
- *
- * @returns {JSX.Element} The rendered LazyImage component with a skeleton fallback while loading.
- *
- * @see https://doc-julseb-lib-react.vercel.app/components/lazy-image
- */
-declare const LazyImage: FC$1<ILibLazyImage>;
-
-export { Accordion, AccordionItem, Alert, Aside, Autocomplete, Avatar, BackToTop, Badge, Breadcrumbs, Burger, Button, ButtonGroup, ButtonIcon, COLORS, Carousel, CodeContainer, Cover, DROP_SHADOWS, DragList, DragListItem, Drawer, Dropdown, DropdownItem, FONT_FAMILIES, FONT_SIZES, FONT_WEIGHTS, Fade, Fieldset, Flexbox, Footer, Form, Grid, Header, Highlight, Hr, ICON_MULTIPLIER, INPUT_HEIGHT, INSET_SHADOWS, Image, Input, InputCheck, InputContainer, InputCounter, InputImage, InputPhone, InputPin, InputSlider, Key, LAYOUTS, LINE_HEIGHTS, LazyImage, Linkify, ListGroup, ListGroupItem, ListGroupTitle, Loader, MEDIA, Main, MarkdownContainer, MarkdownEditor, Masonry, Meta, Modal, OVERLAYS, PageLayout, PageLoading, Pagination, PaginationButton, Paginator, ProgressBar, ProgressCircle, RADIUSES, Rating, SHADOWS, SPACERS, Section, Select, Skeleton, SkeletonCard, Slideshow, SrOnly, Sticky, TEXT_BASE_CLASSES, TEXT_SHADOWS, TRANSITIONS, Table, Tabs, TabsButton, TabsButtonsContainer, TabsContainer, TabsContent, Tag, Text, ThemeProviderWrapper, Toast, ToastContainer, Tooltip, URL_REGEX, Wrapper, clsx, countries, detectLanguage, disableScroll, enableScroll, genAlignContent, genAlignItems, genBgAllColors, genBgAllColorsAndOverlays, genBgColor, genBgColor50, genBgColorGhostHover, genBgColorHover, genBgColorShort, genBgOverlay, genBorderAllColors, genBorderColor, genBorderColorHover, genBorderColorShort, genBorderRadius, genBoxShadow, genButtonColor, genButtonDisabled, genColGap, genGap, genJustifyContent, genJustifyItems, genLinkColor, genMaxWidth, genObjectFit, genRingColor, genRingColorChildren, genRowGap, genTextAlign, genTextAllColor, genTextColor, genTextColorHover, genTextColorShort, genVAlign, libMarkdownEditorOptions, libOptionsMarkdown, linkifyText, scrollToTop, toast, useClickOutside, useCopyToClipboard, useDebounce, useExportData, useFetch, useForm, useIsOverflow, useKeyPress, useLibTheme, useMaxWidth, useMergeRefs, useMinWidth, usePaginatedData, usePagination, useTextLineCount, useTouchScreen, useTranslation };
+export { Accordion, AccordionItem, Alert, Aside, Autocomplete, Avatar, BackToTop, Badge, Breadcrumbs, Burger, Button, ButtonGroup, ButtonIcon, COLORS, Carousel, CodeContainer, Cover, DROP_SHADOWS, DragList, DragListItem, Drawer, Dropdown, DropdownItem, FONT_FAMILIES, FONT_SIZES, FONT_WEIGHTS, Fade, Fieldset, Flexbox, Footer, Form, Grid, Header, Highlight, Hr, ICON_MULTIPLIER, INPUT_HEIGHT, INSET_SHADOWS, Image, Input, InputCheck, InputContainer, InputCounter, InputImage, InputPhone, InputPin, InputSlider, Key, LAYOUTS, LINE_HEIGHTS, LazyImage, Linkify, ListGroup, ListGroupItem, ListGroupTitle, Loader, MEDIA, Main, MarkdownContainer, MarkdownEditor, Masonry, Meta, Modal, OVERLAYS, PageLayout, PageLoading, Pagination, PaginationButton, Paginator, ProgressBar, ProgressCircle, RADIUSES, Rating, SHADOWS, SPACERS, Section, Select, Skeleton, SkeletonCard, Slideshow, SrOnly, Sticky, TEXT_BASE_CLASSES, TEXT_SHADOWS, TRANSITIONS, Table, Tabs, TabsButton, TabsButtonsContainer, TabsContainer, TabsContent, Tag, Text, ThemeProviderWrapper, Toast, ToastContainer, Tooltip, URL_REGEX, Wrapper, clsx, countries, detectLanguage, disableScroll, enableScroll, genAlignContent, genAlignItems, genBgAllColors, genBgAllColorsAndOverlays, genBgColor, genBgColor50, genBgColorGhostHover, genBgColorHover, genBgColorShort, genBgOverlay, genBorderAllColors, genBorderColor, genBorderColorHover, genBorderColorShort, genBorderRadius, genBoxShadow, genButtonColor, genButtonDisabled, genColGap, genGap, genJustifyContent, genJustifyItems, genLinkColor, genMaxWidth, genObjectFit, genRingColor, genRingColorChildren, genRowGap, genTextAlign, genTextAllColor, genTextColor, genTextColorHover, genTextColorShort, genVAlign, libMarkdownEditorOptions, linkifyText, markdownComponents, scrollToTop, toast, useClickOutside, useCopyToClipboard, useDebounce, useExportData, useFetch, useForm, useIsOverflow, useKeyPress, useLibTheme, useMaxWidth, useMergeRefs, useMinWidth, usePaginatedData, usePagination, useTextLineCount, useTouchScreen, useTranslation };