@julseb-lib/react 1.1.0 → 1.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.cts CHANGED
@@ -2,18 +2,18 @@ import { c as LibColorsHover, ag as CssTextAlign, L as LibColors, a as LibColors
2
2
  export { aw as designTokens } from './global-DrPydXbS.cjs';
3
3
  import * as react_jsx_runtime from 'react/jsx-runtime';
4
4
  import { ClassNameValue } from 'tailwind-merge';
5
- import { MarkdownToJSX } from 'markdown-to-jsx';
6
5
  import { LibMdEditorOptions } from './types/components-items-props.cjs';
6
+ import { Components } from 'react-markdown';
7
7
  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';
8
8
  import * as react from 'react';
9
9
  import { RefObject, ChangeEvent, RefCallback, Ref, FC as FC$1 } from 'react';
10
- 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';
10
+ 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';
11
11
  import * as react_toastify from 'react-toastify';
12
12
  import { ToastContainerProps, ToastOptions } from 'react-toastify';
13
13
  import 'csstype';
14
14
  import 'fuse.js';
15
- import './types/require-at-least-one.cjs';
16
15
  import 'prism-react-renderer';
16
+ import './types/require-at-least-one.cjs';
17
17
 
18
18
  declare const URL_REGEX: RegExp;
19
19
  declare const linkifyText: (text: string, blank?: boolean) => (string | react_jsx_runtime.JSX.Element)[];
@@ -66,7 +66,7 @@ declare const genBoxShadow: Record<LibShadows, string>;
66
66
 
67
67
  declare const genVAlign: Record<CssVerticalAlign, string>;
68
68
 
69
- declare const libOptionsMarkdown: MarkdownToJSX.Options;
69
+ declare const libMarkdownComponents: Components;
70
70
  declare const libMarkdownEditorOptions: LibMdEditorOptions;
71
71
 
72
72
  declare const genRingColor: Record<LibColorsHover, string>;
@@ -1227,6 +1227,34 @@ declare const Tooltip: FC$1<ILibTooltip>;
1227
1227
  */
1228
1228
  declare const Image: FC$1<ILibImage>;
1229
1229
 
1230
+ /**
1231
+ * LazyImage component for lazy-loading images with a skeleton placeholder.
1232
+ *
1233
+ * @component
1234
+ *
1235
+ * @example
1236
+ * <LazyImage
1237
+ * src="https://example.com/image.jpg"
1238
+ * alt="Example image"
1239
+ * skeletonClasses="h-48"
1240
+ * skeletonAnimation="pulse"
1241
+ * className="rounded"
1242
+ * />
1243
+ *
1244
+ * @extends HTMLImageElement
1245
+ *
1246
+ * @prop {string} [props.className] - Additional CSS classes to apply to the image.
1247
+ * @prop {React.Ref<HTMLImageElement>} [props.ref] - Ref to the image element.
1248
+ * @prop {string} [props.skeletonClasses] - Additional CSS classes for the skeleton placeholder.
1249
+ * @prop {"pulse" | "shine" | "none"} [props.skeletonAnimation="shine"] - Animation style for the skeleton placeholder.
1250
+ * @prop {object} [props.rest] - Additional props spread to the image element.
1251
+ *
1252
+ * @returns {JSX.Element} The rendered LazyImage component with a skeleton fallback while loading.
1253
+ *
1254
+ * @see https://doc-julseb-lib-react.vercel.app/components/lazy-image
1255
+ */
1256
+ declare const LazyImage: FC$1<ILibLazyImage>;
1257
+
1230
1258
  /**
1231
1259
  * Masonry component for displaying content in a responsive masonry grid layout.
1232
1260
  *
@@ -2867,6 +2895,39 @@ declare const TabsContent: FC$1<ILibTabContent>;
2867
2895
  */
2868
2896
  declare const Slideshow: FC$1<ILibSlideshow>;
2869
2897
 
2898
+ /**
2899
+ * A carousel component that displays a continuous scrolling animation of items (images or custom content).
2900
+ *
2901
+ * @component
2902
+ *
2903
+ * @example
2904
+ * // Basic image carousel
2905
+ * <Carousel items={["image1.jpg", "image2.jpg", "image3.jpg"]} showItems={3} />
2906
+ *
2907
+ * // Carousel with custom content
2908
+ * <Carousel
2909
+ * items={[<div>Custom content 1</div>, <div>Custom content 2</div>]}
2910
+ * stopOnHover
2911
+ * speed={15}
2912
+ * />
2913
+ *
2914
+ * @extends ILibCarousel
2915
+ *
2916
+ * @prop {string} [props.className] - Additional CSS classes to apply to the component
2917
+ * @prop {keyof JSX.IntrinsicElements} [props.element="div"] - HTML element type to render as the root element
2918
+ * @prop {Ref<HTMLDivElement>} [props.ref] - React ref for the root element
2919
+ * @prop {Array<string> | Array<ReactChildren>} props.items - Array of image URLs (strings) or custom React elements to display in the carousel
2920
+ * @prop {boolean} [props.stopOnHover] - Whether to pause the animation when hovering over the carousel
2921
+ * @prop {2 | 3 | 4 | 5 | 6} [props.showItems=4] - Number of items to show simultaneously in the carousel viewport
2922
+ * @prop {"cover" | "contain"} [props.imgFit="cover"] - CSS object-fit property for images (only applies when items are strings)
2923
+ * @prop {number} [props.speed=20] - Animation duration in seconds for one complete scroll cycle
2924
+ *
2925
+ * @returns A carousel component with continuous scrolling animation and optional gradient overlays
2926
+ *
2927
+ * @see https://doc-julseb-lib-react.vercel.app/components/carousel
2928
+ */
2929
+ declare const Carousel: FC$1<ILibCarousel>;
2930
+
2870
2931
  /**
2871
2932
  * Cover component for creating full-screen layouts with background images, overlays, and content positioning.
2872
2933
  *
@@ -3038,6 +3099,10 @@ declare const MarkdownEditor: FC$1<ILibMarkdownEditor>;
3038
3099
  /**
3039
3100
  * MarkdownContainer component for rendering markdown content with customizable parsing options and styling.
3040
3101
  *
3102
+ * Renders Markdown using the `react-markdown` library, allowing you to override default Markdown elements
3103
+ * with custom React components via the `components` prop. Supports additional configuration such as
3104
+ * filtering elements and transforming URLs.
3105
+ *
3041
3106
  * @component
3042
3107
  *
3043
3108
  * @example
@@ -3048,10 +3113,11 @@ declare const MarkdownEditor: FC$1<ILibMarkdownEditor>;
3048
3113
  *
3049
3114
  * @extends HTMLDivElement
3050
3115
  *
3051
- * @prop {string} [props.className] - Additional CSS classes to apply to the markdown container.
3052
- * @prop {React.Ref<HTMLDivElement>} [props.ref] - Ref to the markdown container element.
3053
- * @prop {string} [props.children] - Markdown content to parse and render.
3054
- * @prop {object} [props.options=libOptionsMarkdown] - Markdown parsing options and configurations.
3116
+ * @prop {string} [children] - Markdown content to parse and render.
3117
+ * @prop {object} [components=markdownComponents] - Custom React components to override default Markdown rendering.
3118
+ * @prop {(element: React.ElementType, props: any) => boolean} [allowElement] - Function to filter which elements are allowed.
3119
+ * @prop {(url: string, key: string, node: any) => string} [urlTransform] - Function to transform URLs in Markdown.
3120
+ * @prop {object} [rest] - Additional props spread to the underlying Markdown component.
3055
3121
  *
3056
3122
  * @returns {JSX.Element} The rendered MarkdownContainer component.
3057
3123
  *
@@ -3059,6 +3125,30 @@ declare const MarkdownEditor: FC$1<ILibMarkdownEditor>;
3059
3125
  */
3060
3126
  declare const MarkdownContainer: FC$1<ILibMarkdownContainer>;
3061
3127
 
3128
+ /**
3129
+ * A container component for displaying syntax-highlighted code blocks with copy-to-clipboard functionality.
3130
+ *
3131
+ * @component
3132
+ *
3133
+ * @example
3134
+ * <CodeContainer language="tsx" theme={themes.oneDark}>
3135
+ * {`const foo = "bar"`}
3136
+ * </CodeContainer>
3137
+ *
3138
+ * @extends {Omit<HighlightProps, "children" | "code" | "language">}
3139
+ *
3140
+ * @prop {string} [props.children] - The code string to be highlighted and displayed. If starting with "$ ", it will be removed before copying. Default: undefined.
3141
+ * @prop {boolean} [props.showNumbers] Possible values: true, false. Default: false. - If true, shows the line numbers in the code block.
3142
+ * @prop {string} [props.language] Possible values: any valid Prism language string (e.g., "tsx", "js", "shell"). Default: "tsx". - The language for syntax highlighting.
3143
+ * @prop {string} [props.className] - Additional CSS classes to apply to the container.
3144
+ * @prop {...HighlightProps} [props.<other>] - All other props from HighlightProps except "children" and "code".
3145
+ *
3146
+ * @returns {JSX.Element} The rendered code block with syntax highlighting and a copy button.
3147
+ *
3148
+ * @see https://doc-julseb-lib-react.vercel.app/components/code-container
3149
+ */
3150
+ declare const CodeContainer: FC$1<ILibCodeContainer>;
3151
+
3062
3152
  /**
3063
3153
  * Fade component for creating smooth fade-in animations when elements enter the viewport.
3064
3154
  *
@@ -3337,89 +3427,4 @@ declare const PageLayout: FC$1<ILibPageLayout>;
3337
3427
  */
3338
3428
  declare const SrOnly: FC$1<ILibSrOnly>;
3339
3429
 
3340
- /**
3341
- * A container component for displaying syntax-highlighted code blocks with copy-to-clipboard functionality.
3342
- *
3343
- * @component
3344
- *
3345
- * @example
3346
- * <CodeContainer language="tsx" theme={themes.oneDark}>
3347
- * {`const foo = "bar"`}
3348
- * </CodeContainer>
3349
- *
3350
- * @extends {Omit<HighlightProps, "children" | "code" | "language">}
3351
- *
3352
- * @prop {string} [props.children] - The code string to be highlighted and displayed. If starting with "$ ", it will be removed before copying. Default: undefined.
3353
- * @prop {boolean} [props.showNumbers] Possible values: true, false. Default: false. - If true, shows the line numbers in the code block.
3354
- * @prop {string} [props.language] Possible values: any valid Prism language string (e.g., "tsx", "js", "shell"). Default: "tsx". - The language for syntax highlighting.
3355
- * @prop {string} [props.className] - Additional CSS classes to apply to the container.
3356
- * @prop {...HighlightProps} [props.<other>] - All other props from HighlightProps except "children" and "code".
3357
- *
3358
- * @returns {JSX.Element} The rendered code block with syntax highlighting and a copy button.
3359
- *
3360
- * @see https://doc-julseb-lib-react.vercel.app/components/code-container
3361
- */
3362
- declare const CodeContainer: FC$1<ILibCodeContainer>;
3363
-
3364
- /**
3365
- * A carousel component that displays a continuous scrolling animation of items (images or custom content).
3366
- *
3367
- * @component
3368
- *
3369
- * @example
3370
- * // Basic image carousel
3371
- * <Carousel items={["image1.jpg", "image2.jpg", "image3.jpg"]} showItems={3} />
3372
- *
3373
- * // Carousel with custom content
3374
- * <Carousel
3375
- * items={[<div>Custom content 1</div>, <div>Custom content 2</div>]}
3376
- * stopOnHover
3377
- * speed={15}
3378
- * />
3379
- *
3380
- * @extends ILibCarousel
3381
- *
3382
- * @prop {string} [props.className] - Additional CSS classes to apply to the component
3383
- * @prop {keyof JSX.IntrinsicElements} [props.element="div"] - HTML element type to render as the root element
3384
- * @prop {Ref<HTMLDivElement>} [props.ref] - React ref for the root element
3385
- * @prop {Array<string> | Array<ReactChildren>} props.items - Array of image URLs (strings) or custom React elements to display in the carousel
3386
- * @prop {boolean} [props.stopOnHover] - Whether to pause the animation when hovering over the carousel
3387
- * @prop {2 | 3 | 4 | 5 | 6} [props.showItems=4] - Number of items to show simultaneously in the carousel viewport
3388
- * @prop {"cover" | "contain"} [props.imgFit="cover"] - CSS object-fit property for images (only applies when items are strings)
3389
- * @prop {number} [props.speed=20] - Animation duration in seconds for one complete scroll cycle
3390
- *
3391
- * @returns A carousel component with continuous scrolling animation and optional gradient overlays
3392
- *
3393
- * @see https://doc-julseb-lib-react.vercel.app/components/carousel
3394
- */
3395
- declare const Carousel: FC$1<ILibCarousel>;
3396
-
3397
- /**
3398
- * LazyImage component for lazy-loading images with a skeleton placeholder.
3399
- *
3400
- * @component
3401
- *
3402
- * @example
3403
- * <LazyImage
3404
- * src="https://example.com/image.jpg"
3405
- * alt="Example image"
3406
- * skeletonClasses="h-48"
3407
- * skeletonAnimation="pulse"
3408
- * className="rounded"
3409
- * />
3410
- *
3411
- * @extends HTMLImageElement
3412
- *
3413
- * @prop {string} [props.className] - Additional CSS classes to apply to the image.
3414
- * @prop {React.Ref<HTMLImageElement>} [props.ref] - Ref to the image element.
3415
- * @prop {string} [props.skeletonClasses] - Additional CSS classes for the skeleton placeholder.
3416
- * @prop {"pulse" | "shine" | "none"} [props.skeletonAnimation="shine"] - Animation style for the skeleton placeholder.
3417
- * @prop {object} [props.rest] - Additional props spread to the image element.
3418
- *
3419
- * @returns {JSX.Element} The rendered LazyImage component with a skeleton fallback while loading.
3420
- *
3421
- * @see https://doc-julseb-lib-react.vercel.app/components/lazy-image
3422
- */
3423
- declare const LazyImage: FC$1<ILibLazyImage>;
3424
-
3425
- 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 };
3430
+ 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, libMarkdownComponents, libMarkdownEditorOptions, linkifyText, scrollToTop, toast, useClickOutside, useCopyToClipboard, useDebounce, useExportData, useFetch, useForm, useIsOverflow, useKeyPress, useLibTheme, useMaxWidth, useMergeRefs, useMinWidth, usePaginatedData, usePagination, useTextLineCount, useTouchScreen, useTranslation };
package/dist/index.d.ts CHANGED
@@ -2,18 +2,18 @@ import { c as LibColorsHover, ag as CssTextAlign, L as LibColors, a as LibColors
2
2
  export { aw as designTokens } from './global-DrPydXbS.js';
3
3
  import * as react_jsx_runtime from 'react/jsx-runtime';
4
4
  import { ClassNameValue } from 'tailwind-merge';
5
- import { MarkdownToJSX } from 'markdown-to-jsx';
6
5
  import { LibMdEditorOptions } from './types/components-items-props.js';
6
+ import { Components } from 'react-markdown';
7
7
  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';
8
8
  import * as react from 'react';
9
9
  import { RefObject, ChangeEvent, RefCallback, Ref, FC as FC$1 } from 'react';
10
- 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';
10
+ 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';
11
11
  import * as react_toastify from 'react-toastify';
12
12
  import { ToastContainerProps, ToastOptions } from 'react-toastify';
13
13
  import 'csstype';
14
14
  import 'fuse.js';
15
- import './types/require-at-least-one.js';
16
15
  import 'prism-react-renderer';
16
+ import './types/require-at-least-one.js';
17
17
 
18
18
  declare const URL_REGEX: RegExp;
19
19
  declare const linkifyText: (text: string, blank?: boolean) => (string | react_jsx_runtime.JSX.Element)[];
@@ -66,7 +66,7 @@ declare const genBoxShadow: Record<LibShadows, string>;
66
66
 
67
67
  declare const genVAlign: Record<CssVerticalAlign, string>;
68
68
 
69
- declare const libOptionsMarkdown: MarkdownToJSX.Options;
69
+ declare const libMarkdownComponents: Components;
70
70
  declare const libMarkdownEditorOptions: LibMdEditorOptions;
71
71
 
72
72
  declare const genRingColor: Record<LibColorsHover, string>;
@@ -1227,6 +1227,34 @@ declare const Tooltip: FC$1<ILibTooltip>;
1227
1227
  */
1228
1228
  declare const Image: FC$1<ILibImage>;
1229
1229
 
1230
+ /**
1231
+ * LazyImage component for lazy-loading images with a skeleton placeholder.
1232
+ *
1233
+ * @component
1234
+ *
1235
+ * @example
1236
+ * <LazyImage
1237
+ * src="https://example.com/image.jpg"
1238
+ * alt="Example image"
1239
+ * skeletonClasses="h-48"
1240
+ * skeletonAnimation="pulse"
1241
+ * className="rounded"
1242
+ * />
1243
+ *
1244
+ * @extends HTMLImageElement
1245
+ *
1246
+ * @prop {string} [props.className] - Additional CSS classes to apply to the image.
1247
+ * @prop {React.Ref<HTMLImageElement>} [props.ref] - Ref to the image element.
1248
+ * @prop {string} [props.skeletonClasses] - Additional CSS classes for the skeleton placeholder.
1249
+ * @prop {"pulse" | "shine" | "none"} [props.skeletonAnimation="shine"] - Animation style for the skeleton placeholder.
1250
+ * @prop {object} [props.rest] - Additional props spread to the image element.
1251
+ *
1252
+ * @returns {JSX.Element} The rendered LazyImage component with a skeleton fallback while loading.
1253
+ *
1254
+ * @see https://doc-julseb-lib-react.vercel.app/components/lazy-image
1255
+ */
1256
+ declare const LazyImage: FC$1<ILibLazyImage>;
1257
+
1230
1258
  /**
1231
1259
  * Masonry component for displaying content in a responsive masonry grid layout.
1232
1260
  *
@@ -2867,6 +2895,39 @@ declare const TabsContent: FC$1<ILibTabContent>;
2867
2895
  */
2868
2896
  declare const Slideshow: FC$1<ILibSlideshow>;
2869
2897
 
2898
+ /**
2899
+ * A carousel component that displays a continuous scrolling animation of items (images or custom content).
2900
+ *
2901
+ * @component
2902
+ *
2903
+ * @example
2904
+ * // Basic image carousel
2905
+ * <Carousel items={["image1.jpg", "image2.jpg", "image3.jpg"]} showItems={3} />
2906
+ *
2907
+ * // Carousel with custom content
2908
+ * <Carousel
2909
+ * items={[<div>Custom content 1</div>, <div>Custom content 2</div>]}
2910
+ * stopOnHover
2911
+ * speed={15}
2912
+ * />
2913
+ *
2914
+ * @extends ILibCarousel
2915
+ *
2916
+ * @prop {string} [props.className] - Additional CSS classes to apply to the component
2917
+ * @prop {keyof JSX.IntrinsicElements} [props.element="div"] - HTML element type to render as the root element
2918
+ * @prop {Ref<HTMLDivElement>} [props.ref] - React ref for the root element
2919
+ * @prop {Array<string> | Array<ReactChildren>} props.items - Array of image URLs (strings) or custom React elements to display in the carousel
2920
+ * @prop {boolean} [props.stopOnHover] - Whether to pause the animation when hovering over the carousel
2921
+ * @prop {2 | 3 | 4 | 5 | 6} [props.showItems=4] - Number of items to show simultaneously in the carousel viewport
2922
+ * @prop {"cover" | "contain"} [props.imgFit="cover"] - CSS object-fit property for images (only applies when items are strings)
2923
+ * @prop {number} [props.speed=20] - Animation duration in seconds for one complete scroll cycle
2924
+ *
2925
+ * @returns A carousel component with continuous scrolling animation and optional gradient overlays
2926
+ *
2927
+ * @see https://doc-julseb-lib-react.vercel.app/components/carousel
2928
+ */
2929
+ declare const Carousel: FC$1<ILibCarousel>;
2930
+
2870
2931
  /**
2871
2932
  * Cover component for creating full-screen layouts with background images, overlays, and content positioning.
2872
2933
  *
@@ -3038,6 +3099,10 @@ declare const MarkdownEditor: FC$1<ILibMarkdownEditor>;
3038
3099
  /**
3039
3100
  * MarkdownContainer component for rendering markdown content with customizable parsing options and styling.
3040
3101
  *
3102
+ * Renders Markdown using the `react-markdown` library, allowing you to override default Markdown elements
3103
+ * with custom React components via the `components` prop. Supports additional configuration such as
3104
+ * filtering elements and transforming URLs.
3105
+ *
3041
3106
  * @component
3042
3107
  *
3043
3108
  * @example
@@ -3048,10 +3113,11 @@ declare const MarkdownEditor: FC$1<ILibMarkdownEditor>;
3048
3113
  *
3049
3114
  * @extends HTMLDivElement
3050
3115
  *
3051
- * @prop {string} [props.className] - Additional CSS classes to apply to the markdown container.
3052
- * @prop {React.Ref<HTMLDivElement>} [props.ref] - Ref to the markdown container element.
3053
- * @prop {string} [props.children] - Markdown content to parse and render.
3054
- * @prop {object} [props.options=libOptionsMarkdown] - Markdown parsing options and configurations.
3116
+ * @prop {string} [children] - Markdown content to parse and render.
3117
+ * @prop {object} [components=markdownComponents] - Custom React components to override default Markdown rendering.
3118
+ * @prop {(element: React.ElementType, props: any) => boolean} [allowElement] - Function to filter which elements are allowed.
3119
+ * @prop {(url: string, key: string, node: any) => string} [urlTransform] - Function to transform URLs in Markdown.
3120
+ * @prop {object} [rest] - Additional props spread to the underlying Markdown component.
3055
3121
  *
3056
3122
  * @returns {JSX.Element} The rendered MarkdownContainer component.
3057
3123
  *
@@ -3059,6 +3125,30 @@ declare const MarkdownEditor: FC$1<ILibMarkdownEditor>;
3059
3125
  */
3060
3126
  declare const MarkdownContainer: FC$1<ILibMarkdownContainer>;
3061
3127
 
3128
+ /**
3129
+ * A container component for displaying syntax-highlighted code blocks with copy-to-clipboard functionality.
3130
+ *
3131
+ * @component
3132
+ *
3133
+ * @example
3134
+ * <CodeContainer language="tsx" theme={themes.oneDark}>
3135
+ * {`const foo = "bar"`}
3136
+ * </CodeContainer>
3137
+ *
3138
+ * @extends {Omit<HighlightProps, "children" | "code" | "language">}
3139
+ *
3140
+ * @prop {string} [props.children] - The code string to be highlighted and displayed. If starting with "$ ", it will be removed before copying. Default: undefined.
3141
+ * @prop {boolean} [props.showNumbers] Possible values: true, false. Default: false. - If true, shows the line numbers in the code block.
3142
+ * @prop {string} [props.language] Possible values: any valid Prism language string (e.g., "tsx", "js", "shell"). Default: "tsx". - The language for syntax highlighting.
3143
+ * @prop {string} [props.className] - Additional CSS classes to apply to the container.
3144
+ * @prop {...HighlightProps} [props.<other>] - All other props from HighlightProps except "children" and "code".
3145
+ *
3146
+ * @returns {JSX.Element} The rendered code block with syntax highlighting and a copy button.
3147
+ *
3148
+ * @see https://doc-julseb-lib-react.vercel.app/components/code-container
3149
+ */
3150
+ declare const CodeContainer: FC$1<ILibCodeContainer>;
3151
+
3062
3152
  /**
3063
3153
  * Fade component for creating smooth fade-in animations when elements enter the viewport.
3064
3154
  *
@@ -3337,89 +3427,4 @@ declare const PageLayout: FC$1<ILibPageLayout>;
3337
3427
  */
3338
3428
  declare const SrOnly: FC$1<ILibSrOnly>;
3339
3429
 
3340
- /**
3341
- * A container component for displaying syntax-highlighted code blocks with copy-to-clipboard functionality.
3342
- *
3343
- * @component
3344
- *
3345
- * @example
3346
- * <CodeContainer language="tsx" theme={themes.oneDark}>
3347
- * {`const foo = "bar"`}
3348
- * </CodeContainer>
3349
- *
3350
- * @extends {Omit<HighlightProps, "children" | "code" | "language">}
3351
- *
3352
- * @prop {string} [props.children] - The code string to be highlighted and displayed. If starting with "$ ", it will be removed before copying. Default: undefined.
3353
- * @prop {boolean} [props.showNumbers] Possible values: true, false. Default: false. - If true, shows the line numbers in the code block.
3354
- * @prop {string} [props.language] Possible values: any valid Prism language string (e.g., "tsx", "js", "shell"). Default: "tsx". - The language for syntax highlighting.
3355
- * @prop {string} [props.className] - Additional CSS classes to apply to the container.
3356
- * @prop {...HighlightProps} [props.<other>] - All other props from HighlightProps except "children" and "code".
3357
- *
3358
- * @returns {JSX.Element} The rendered code block with syntax highlighting and a copy button.
3359
- *
3360
- * @see https://doc-julseb-lib-react.vercel.app/components/code-container
3361
- */
3362
- declare const CodeContainer: FC$1<ILibCodeContainer>;
3363
-
3364
- /**
3365
- * A carousel component that displays a continuous scrolling animation of items (images or custom content).
3366
- *
3367
- * @component
3368
- *
3369
- * @example
3370
- * // Basic image carousel
3371
- * <Carousel items={["image1.jpg", "image2.jpg", "image3.jpg"]} showItems={3} />
3372
- *
3373
- * // Carousel with custom content
3374
- * <Carousel
3375
- * items={[<div>Custom content 1</div>, <div>Custom content 2</div>]}
3376
- * stopOnHover
3377
- * speed={15}
3378
- * />
3379
- *
3380
- * @extends ILibCarousel
3381
- *
3382
- * @prop {string} [props.className] - Additional CSS classes to apply to the component
3383
- * @prop {keyof JSX.IntrinsicElements} [props.element="div"] - HTML element type to render as the root element
3384
- * @prop {Ref<HTMLDivElement>} [props.ref] - React ref for the root element
3385
- * @prop {Array<string> | Array<ReactChildren>} props.items - Array of image URLs (strings) or custom React elements to display in the carousel
3386
- * @prop {boolean} [props.stopOnHover] - Whether to pause the animation when hovering over the carousel
3387
- * @prop {2 | 3 | 4 | 5 | 6} [props.showItems=4] - Number of items to show simultaneously in the carousel viewport
3388
- * @prop {"cover" | "contain"} [props.imgFit="cover"] - CSS object-fit property for images (only applies when items are strings)
3389
- * @prop {number} [props.speed=20] - Animation duration in seconds for one complete scroll cycle
3390
- *
3391
- * @returns A carousel component with continuous scrolling animation and optional gradient overlays
3392
- *
3393
- * @see https://doc-julseb-lib-react.vercel.app/components/carousel
3394
- */
3395
- declare const Carousel: FC$1<ILibCarousel>;
3396
-
3397
- /**
3398
- * LazyImage component for lazy-loading images with a skeleton placeholder.
3399
- *
3400
- * @component
3401
- *
3402
- * @example
3403
- * <LazyImage
3404
- * src="https://example.com/image.jpg"
3405
- * alt="Example image"
3406
- * skeletonClasses="h-48"
3407
- * skeletonAnimation="pulse"
3408
- * className="rounded"
3409
- * />
3410
- *
3411
- * @extends HTMLImageElement
3412
- *
3413
- * @prop {string} [props.className] - Additional CSS classes to apply to the image.
3414
- * @prop {React.Ref<HTMLImageElement>} [props.ref] - Ref to the image element.
3415
- * @prop {string} [props.skeletonClasses] - Additional CSS classes for the skeleton placeholder.
3416
- * @prop {"pulse" | "shine" | "none"} [props.skeletonAnimation="shine"] - Animation style for the skeleton placeholder.
3417
- * @prop {object} [props.rest] - Additional props spread to the image element.
3418
- *
3419
- * @returns {JSX.Element} The rendered LazyImage component with a skeleton fallback while loading.
3420
- *
3421
- * @see https://doc-julseb-lib-react.vercel.app/components/lazy-image
3422
- */
3423
- declare const LazyImage: FC$1<ILibLazyImage>;
3424
-
3425
- 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 };
3430
+ 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, libMarkdownComponents, libMarkdownEditorOptions, linkifyText, scrollToTop, toast, useClickOutside, useCopyToClipboard, useDebounce, useExportData, useFetch, useForm, useIsOverflow, useKeyPress, useLibTheme, useMaxWidth, useMergeRefs, useMinWidth, usePaginatedData, usePagination, useTextLineCount, useTouchScreen, useTranslation };