@dynamic-framework/ui-react 2.0.0-dev.3 → 2.0.0-dev.4

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.js CHANGED
@@ -944,10 +944,10 @@ function DCardFooter({ className, style, children, }) {
944
944
  return (jsxRuntime.jsx("div", { className: classNames('card-footer', className), style: style, children: children }));
945
945
  }
946
946
 
947
- function DCard({ className, style, children, dataAttributes, }) {
947
+ function DCard$1({ className, style, children, dataAttributes, }) {
948
948
  return (jsxRuntime.jsx("div", Object.assign({ style: style, className: classNames('card', className) }, dataAttributes, { children: children })));
949
949
  }
950
- var DCard$1 = Object.assign(DCard, {
950
+ var DCard = Object.assign(DCard$1, {
951
951
  Header: DCardHeader,
952
952
  Body: DCardBody,
953
953
  Footer: DCardFooter,
@@ -958,7 +958,7 @@ function DCarouselSlide(_a) {
958
958
  return (jsxRuntime.jsx(reactSplide.SplideSlide, Object.assign({ className: classNames('d-carousel-slide', className) }, props)));
959
959
  }
960
960
 
961
- function DCarousel(_a, ref) {
961
+ function DCarousel$1(_a, ref) {
962
962
  var { children, className, style, options, dataAttributes } = _a, props = tslib.__rest(_a, ["children", "className", "style", "options", "dataAttributes"]);
963
963
  return (jsxRuntime.jsx(reactSplide.Splide, Object.assign({ className: classNames('d-carousel', className), style: style, ref: ref, options: Object.assign(Object.assign({}, options), { classes: {
964
964
  // Arrows
@@ -971,9 +971,9 @@ function DCarousel(_a, ref) {
971
971
  page: 'splide__pagination__page d-carousel-pagination-page',
972
972
  } }) }, dataAttributes, props, { children: children })));
973
973
  }
974
- const ForwardedDCarousel = React.forwardRef(DCarousel);
974
+ const ForwardedDCarousel = React.forwardRef(DCarousel$1);
975
975
  ForwardedDCarousel.displayName = 'DCarousel';
976
- var DCarousel$1 = Object.assign(ForwardedDCarousel, {
976
+ var DCarousel = Object.assign(ForwardedDCarousel, {
977
977
  Slide: DCarouselSlide,
978
978
  });
979
979
 
@@ -1167,7 +1167,7 @@ function DSelectPlaceholder(_a) {
1167
1167
  return (jsxRuntime.jsx(Select.components.Placeholder, Object.assign({ innerProps: innerProps, selectProps: selectProps }, props, { children: children })));
1168
1168
  }
1169
1169
 
1170
- function DSelect(_a) {
1170
+ function DSelect$1(_a) {
1171
1171
  var { id: idProp, className, style, label, hint, iconFamilyClass, iconFamilyPrefix, iconStart, iconStartFamilyClass, iconStartFamilyPrefix, iconStartAriaLabel, iconStartTabIndex, iconEnd, iconEndFamilyClass, iconEndFamilyPrefix, iconEndAriaLabel, iconEndTabIndex, invalid, valid, menuWithMaxContent = false, disabled, clearable, loading, floatingLabel = false, rtl, searchable, multi, components, defaultValue, placeholder, onIconStartClick, onIconEndClick, dataAttributes } = _a, props = tslib.__rest(_a, ["id", "className", "style", "label", "hint", "iconFamilyClass", "iconFamilyPrefix", "iconStart", "iconStartFamilyClass", "iconStartFamilyPrefix", "iconStartAriaLabel", "iconStartTabIndex", "iconEnd", "iconEndFamilyClass", "iconEndFamilyPrefix", "iconEndAriaLabel", "iconEndTabIndex", "invalid", "valid", "menuWithMaxContent", "disabled", "clearable", "loading", "floatingLabel", "rtl", "searchable", "multi", "components", "defaultValue", "placeholder", "onIconStartClick", "onIconEndClick", "dataAttributes"]);
1172
1172
  const innerId = React.useId();
1173
1173
  const id = React.useMemo(() => idProp || innerId, [idProp, innerId]);
@@ -1193,7 +1193,7 @@ function DSelect(_a) {
1193
1193
  'is-valid': valid,
1194
1194
  }), classNamePrefix: "d-select", isDisabled: disabled || loading, isClearable: clearable, isLoading: loading, isRtl: rtl, isSearchable: searchable, isMulti: multi, defaultValue: defaultValue, placeholder: floatingLabel ? '' : placeholder, unstyled: true, components: Object.assign({ Placeholder: DSelectPlaceholder, DropdownIndicator: DSelectDropdownIndicator, ClearIndicator: DSelectClearIndicator, MultiValueRemove: DSelectMultiValueRemove, LoadingIndicator: DSelectLoadingIndicator }, components) }, props)), (iconEnd && !loading) && (jsxRuntime.jsx("button", { type: "button", className: "input-group-text", id: `${id}End`, onClick: handleOnIconEndClick, disabled: disabled || loading, "aria-label": iconEndAriaLabel, tabIndex: iconEndTabIndex, children: iconEnd && (jsxRuntime.jsx(DIcon, { icon: iconEnd, familyClass: iconEndFamilyClass, familyPrefix: iconEndFamilyPrefix })) }))] }), hint && (jsxRuntime.jsx("div", { className: "form-text", id: `${id}Hint`, children: hint }))] })));
1195
1195
  }
1196
- var DSelect$1 = Object.assign(DSelect, {
1196
+ var DSelect = Object.assign(DSelect$1, {
1197
1197
  OptionCheck: DSelectOptionCheck,
1198
1198
  OptionIcon: DSelectOptionIcon,
1199
1199
  SingleValueIconText: DSelectSingleValueIconText,
@@ -1242,9 +1242,9 @@ function DDatePickerHeaderSelector({ date, changeYear, changeMonth, decreaseMont
1242
1242
  return (jsxRuntime.jsxs("div", { className: classNames('react-datepicker__header-selector react-datepicker__header-year-selector', className), style: style, children: [jsxRuntime.jsx(DButtonIcon, { icon: iconPrev || chevronLeft, size: iconSize, variant: "link", onClick: decreaseYear, disabled: prevYearButtonDisabled, ariaLabel: prevYearAriaLabel, className: "header-button" }), jsxRuntime.jsx("p", { children: `${startYear} - ${endYear}` }), jsxRuntime.jsx(DButtonIcon, { icon: iconNext || chevronRight, size: iconSize, variant: "link", onClick: increaseYear, disabled: nextYearButtonDisabled, ariaLabel: nextYearAriaLabel, className: "header-button" })] }));
1243
1243
  }
1244
1244
  if (pickerType === PickerType.Quarter || pickerType === PickerType.Month) {
1245
- return (jsxRuntime.jsxs("div", { className: classNames(`react-datepicker__header-selector react-datepicker__header-${pickerType}-selector`, className), style: style, children: [jsxRuntime.jsx(DButtonIcon, { icon: iconPrev || chevronLeft, size: iconSize, variant: "link", onClick: decreaseYear, disabled: prevMonthButtonDisabled, ariaLabel: prevMonthAriaLabel, className: "header-button", style: { visibility: customHeaderCount === 0 ? 'visible' : 'hidden' } }), jsxRuntime.jsx("div", { className: "d-flex justify-content-center flex-grow-1", children: showHeaderSelectors ? (jsxRuntime.jsx(DSelect$1, { options: years, value: defaultYear, defaultValue: defaultYear, onChange: (year) => changeYear(Number(year === null || year === void 0 ? void 0 : year.value)), searchable: false })) : (jsxRuntime.jsx("p", { children: defaultYear === null || defaultYear === void 0 ? void 0 : defaultYear.label })) }), jsxRuntime.jsx(DButtonIcon, { icon: iconNext || chevronRight, size: iconSize, variant: "link", onClick: increaseYear, disabled: nextMonthButtonDisabled, ariaLabel: nextMonthAriaLabel, className: "header-button", style: { visibility: customHeaderCount === monthsShown - 1 ? 'visible' : 'hidden' } })] }));
1245
+ return (jsxRuntime.jsxs("div", { className: classNames(`react-datepicker__header-selector react-datepicker__header-${pickerType}-selector`, className), style: style, children: [jsxRuntime.jsx(DButtonIcon, { icon: iconPrev || chevronLeft, size: iconSize, variant: "link", onClick: decreaseYear, disabled: prevMonthButtonDisabled, ariaLabel: prevMonthAriaLabel, className: "header-button", style: { visibility: customHeaderCount === 0 ? 'visible' : 'hidden' } }), jsxRuntime.jsx("div", { className: "d-flex justify-content-center flex-grow-1", children: showHeaderSelectors ? (jsxRuntime.jsx(DSelect, { options: years, value: defaultYear, defaultValue: defaultYear, onChange: (year) => changeYear(Number(year === null || year === void 0 ? void 0 : year.value)), searchable: false })) : (jsxRuntime.jsx("p", { children: defaultYear === null || defaultYear === void 0 ? void 0 : defaultYear.label })) }), jsxRuntime.jsx(DButtonIcon, { icon: iconNext || chevronRight, size: iconSize, variant: "link", onClick: increaseYear, disabled: nextMonthButtonDisabled, ariaLabel: nextMonthAriaLabel, className: "header-button", style: { visibility: customHeaderCount === monthsShown - 1 ? 'visible' : 'hidden' } })] }));
1246
1246
  }
1247
- return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: "datepicker-top-header", children: [showHeaderSelectors && (jsxRuntime.jsx("select", { value: defaultYear === null || defaultYear === void 0 ? void 0 : defaultYear.value, onChange: (e) => changeYear(Number(e.target.value)), className: "custom-year-selector", children: years.map((year) => (jsxRuntime.jsx("option", { value: year.value, children: year.label }, year.value))) })), jsxRuntime.jsx("h4", { className: "mb-0 fw-normal", children: dateFns.format(monthDate, 'LLLL, dd', { locale }) })] }), jsxRuntime.jsxs("div", { className: classNames('react-datepicker__header-selector react-datepicker__header-day-selector', className), style: style, children: [jsxRuntime.jsx(DButtonIcon, { icon: iconPrev || chevronLeft, size: iconSize, variant: "link", onClick: decreaseMonth, disabled: prevMonthButtonDisabled, ariaLabel: prevMonthAriaLabel, className: "header-button", style: { visibility: customHeaderCount === 0 ? 'visible' : 'hidden' } }), showHeaderSelectors ? (jsxRuntime.jsx(DSelect$1, { options: months, value: defaultMonth, defaultValue: defaultMonth, onChange: (month) => changeMonth((month === null || month === void 0 ? void 0 : month.value) || 0), searchable: false, className: "custom-month-selector" })) : (jsxRuntime.jsx("p", { children: `${defaultMonth.label} ${defaultYear === null || defaultYear === void 0 ? void 0 : defaultYear.label}` })), jsxRuntime.jsx(DButtonIcon, { icon: iconNext || chevronRight, size: iconSize, variant: "link", onClick: increaseMonth, disabled: nextMonthButtonDisabled, ariaLabel: nextMonthAriaLabel, className: "header-button", style: { visibility: customHeaderCount === monthsShown - 1 ? 'visible' : 'hidden' } })] })] }));
1247
+ return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: "datepicker-top-header", children: [showHeaderSelectors && (jsxRuntime.jsx("select", { value: defaultYear === null || defaultYear === void 0 ? void 0 : defaultYear.value, onChange: (e) => changeYear(Number(e.target.value)), className: "custom-year-selector", children: years.map((year) => (jsxRuntime.jsx("option", { value: year.value, children: year.label }, year.value))) })), jsxRuntime.jsx("h4", { className: "mb-0 fw-normal", children: dateFns.format(monthDate, 'LLLL, dd', { locale }) })] }), jsxRuntime.jsxs("div", { className: classNames('react-datepicker__header-selector react-datepicker__header-day-selector', className), style: style, children: [jsxRuntime.jsx(DButtonIcon, { icon: iconPrev || chevronLeft, size: iconSize, variant: "link", onClick: decreaseMonth, disabled: prevMonthButtonDisabled, ariaLabel: prevMonthAriaLabel, className: "header-button", style: { visibility: customHeaderCount === 0 ? 'visible' : 'hidden' } }), showHeaderSelectors ? (jsxRuntime.jsx(DSelect, { options: months, value: defaultMonth, defaultValue: defaultMonth, onChange: (month) => changeMonth((month === null || month === void 0 ? void 0 : month.value) || 0), searchable: false, className: "custom-month-selector" })) : (jsxRuntime.jsx("p", { children: `${defaultMonth.label} ${defaultYear === null || defaultYear === void 0 ? void 0 : defaultYear.label}` })), jsxRuntime.jsx(DButtonIcon, { icon: iconNext || chevronRight, size: iconSize, variant: "link", onClick: increaseMonth, disabled: nextMonthButtonDisabled, ariaLabel: nextMonthAriaLabel, className: "header-button", style: { visibility: customHeaderCount === monthsShown - 1 ? 'visible' : 'hidden' } })] })] }));
1248
1248
  }
1249
1249
 
1250
1250
  function DDatePicker(_a) {
@@ -1289,7 +1289,7 @@ function DLayoutPane({ className, style, children, cols, colsXs, colsSm, colsMd,
1289
1289
  return (jsxRuntime.jsx("div", Object.assign({ className: classNames(colsClass, colsXsClass, colsSmClass, colsMdClass, colsLgClass, colsXlClass, colsXxlClass, className), style: style }, dataAttributes, { children: children })));
1290
1290
  }
1291
1291
 
1292
- function DLayout({ className, style, children, gap, gapSm, gapMd, gapLg, gapXl, gapXxl, dataAttributes, }) {
1292
+ function DLayout$1({ className, style, children, gap, columns, gapSm, gapMd, gapLg, gapXl, gapXxl, dataAttributes, }) {
1293
1293
  const gapClasses = classNames({
1294
1294
  [`gap-${gap}`]: gap !== undefined,
1295
1295
  [`gap-sm-${gapSm}`]: gapSm !== undefined,
@@ -1298,9 +1298,10 @@ function DLayout({ className, style, children, gap, gapSm, gapMd, gapLg, gapXl,
1298
1298
  [`gap-xl-${gapXl}`]: gapXl !== undefined,
1299
1299
  [`gap-xxl-${gapXxl}`]: gapXxl !== undefined,
1300
1300
  });
1301
- return (jsxRuntime.jsx("div", Object.assign({ style: style, className: classNames('grid', gapClasses, className) }, dataAttributes, { children: children })));
1301
+ const styleWithColumns = Object.assign(Object.assign({}, style), { '--bs-columns': columns });
1302
+ return (jsxRuntime.jsx("div", Object.assign({ style: styleWithColumns, className: classNames('grid', gapClasses, className) }, dataAttributes, { children: children })));
1302
1303
  }
1303
- var DLayout$1 = Object.assign(DLayout, {
1304
+ var DLayout = Object.assign(DLayout$1, {
1304
1305
  Pane: DLayoutPane,
1305
1306
  });
1306
1307
 
@@ -1762,7 +1763,7 @@ function DListGroupItem({ as = 'li', action: actionProp, active, disabled, href,
1762
1763
  return (jsxRuntime.jsxs(Tag, Object.assign({ className: classNames(generateClasses, className), style: style }, Tag === 'a' && href && { href }, onClick && { onClick }, ariaAttributes, dataAttributes, Tag === 'button' && { type: 'button' }, { children: [iconStart && (jsxRuntime.jsx(DIcon, { icon: iconStart, familyClass: iconStartFamilyClass, familyPrefix: iconStartFamilyPrefix, materialStyle: iconStartMaterialStyle })), jsxRuntime.jsx("div", { className: "w-100", children: children }), iconEnd && (jsxRuntime.jsx(DIcon, { icon: iconEnd, familyClass: iconEndFamilyClass, familyPrefix: iconEndFamilyPrefix, materialStyle: iconEndMaterialStyle, className: "ms-auto" }))] })));
1763
1764
  }
1764
1765
 
1765
- function DListGroup({ as = 'ul', numbered, flush, horizontal, children, className, style, dataAttributes, }) {
1766
+ function DListGroup$1({ as = 'ul', numbered, flush, horizontal, children, className, style, dataAttributes, }) {
1766
1767
  const Tag = React.useMemo(() => {
1767
1768
  if (numbered) {
1768
1769
  return 'ol';
@@ -1782,7 +1783,7 @@ function DListGroup({ as = 'ul', numbered, flush, horizontal, children, classNam
1782
1783
  }, [flush, horizontal, numbered]);
1783
1784
  return (jsxRuntime.jsx(Tag, Object.assign({ className: classNames(generateClasses, className), style: style }, dataAttributes, { children: children })));
1784
1785
  }
1785
- var DListGroup$1 = Object.assign(DListGroup, {
1786
+ var DListGroup = Object.assign(DListGroup$1, {
1786
1787
  Item: DListGroupItem,
1787
1788
  });
1788
1789
 
@@ -1804,7 +1805,7 @@ function DModalFooter({ className, style, actionPlacement, children, }) {
1804
1805
  return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: "d-modal-separator" }), jsxRuntime.jsx("div", { className: classNames(generateClasses, className), style: style, children: children })] }));
1805
1806
  }
1806
1807
 
1807
- function DModal({ name, className, style, staticBackdrop, scrollable, centered, fullScreen, fullScreenFrom, size, children, dataAttributes, }) {
1808
+ function DModal$1({ name, className, style, staticBackdrop, scrollable, centered, fullScreen, fullScreenFrom, size, children, dataAttributes, }) {
1808
1809
  const fullScreenClass = React.useMemo(() => {
1809
1810
  if (fullScreen) {
1810
1811
  if (fullScreenFrom) {
@@ -1820,7 +1821,7 @@ function DModal({ name, className, style, staticBackdrop, scrollable, centered,
1820
1821
  [`data-${PREFIX_BS}keyboard`]: 'false',
1821
1822
  }), dataAttributes, { children: jsxRuntime.jsx("div", { className: classNames(generateModalDialogClasses), children: jsxRuntime.jsx("div", { className: "modal-content", children: children }) }) })));
1822
1823
  }
1823
- var DModal$1 = Object.assign(DModal, {
1824
+ var DModal = Object.assign(DModal$1, {
1824
1825
  Header: DModalHeader,
1825
1826
  Body: DModalBody,
1826
1827
  Footer: DModalFooter,
@@ -1844,7 +1845,7 @@ function DOffcanvasFooter({ actionPlacement, children, className, style, }) {
1844
1845
  return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: "d-offcanvas-separator" }), jsxRuntime.jsx("div", { className: classNames(generateClasses, className), style: style, children: children })] }));
1845
1846
  }
1846
1847
 
1847
- function DOffcanvas({ name, className, style, staticBackdrop, scrollable, openFrom = 'end', children, dataAttributes, }) {
1848
+ function DOffcanvas$1({ name, className, style, staticBackdrop, scrollable, openFrom = 'end', children, dataAttributes, }) {
1848
1849
  return (jsxRuntime.jsx("div", Object.assign({ className: classNames('offcanvas portal show', {
1849
1850
  [`offcanvas-${openFrom}`]: openFrom,
1850
1851
  }, className), style: style, id: name, tabIndex: -1, "aria-labelledby": `${name}Label`, "aria-hidden": "false" }, staticBackdrop && ({
@@ -1855,7 +1856,7 @@ function DOffcanvas({ name, className, style, staticBackdrop, scrollable, openFr
1855
1856
  [`data-${PREFIX_BS}keyboard`]: 'false',
1856
1857
  }), dataAttributes, { children: children })));
1857
1858
  }
1858
- var DOffcanvas$1 = Object.assign(DOffcanvas, {
1859
+ var DOffcanvas = Object.assign(DOffcanvas$1, {
1859
1860
  Header: DOffcanvasHeader,
1860
1861
  Body: DOffcanvasBody,
1861
1862
  Footer: DOffcanvasFooter,
@@ -2028,7 +2029,7 @@ function DTabContent({ tab, children, className, style, }) {
2028
2029
  return (jsxRuntime.jsx("div", { className: classNames('tab-pane fade show active', className), id: `${tab}Pane`, role: "tabpanel", tabIndex: 0, "aria-labelledby": `${tab}Tab`, style: style, children: children }));
2029
2030
  }
2030
2031
 
2031
- function DTabs({ children, defaultSelected, onChange, options, className, classNameTab, style, vertical, variant = 'underline', dataAttributes, }) {
2032
+ function DTabs$1({ children, defaultSelected, onChange, options, className, classNameTab, style, vertical, variant = 'underline', dataAttributes, }) {
2032
2033
  const [selected, setSelected] = React.useState(defaultSelected);
2033
2034
  const onSelect = React.useCallback((option) => {
2034
2035
  if (option.tab) {
@@ -2051,7 +2052,7 @@ function DTabs({ children, defaultSelected, onChange, options, className, classN
2051
2052
  active: option.tab === selected,
2052
2053
  }, classNameTab), type: "button", role: "tab", "aria-controls": `${option.tab}Pane`, "aria-selected": option.tab === selected, disabled: option.disabled, onClick: () => onSelect(option), children: option.label }, option.tab))) }), jsxRuntime.jsx("div", { className: "tab-content w-100", children: children })] })) }));
2053
2054
  }
2054
- var DTabs$1 = Object.assign(DTabs, {
2055
+ var DTabs = Object.assign(DTabs$1, {
2055
2056
  Tab: DTabContent,
2056
2057
  });
2057
2058
 
@@ -2063,10 +2064,10 @@ function DToastBody({ children, className, style }) {
2063
2064
  return (jsxRuntime.jsx("div", { className: classNames('toast-body', className), style: style, children: children }));
2064
2065
  }
2065
2066
 
2066
- function DToast({ children, className, style, dataAttributes, }) {
2067
+ function DToast$1({ children, className, style, dataAttributes, }) {
2067
2068
  return (jsxRuntime.jsx("div", Object.assign({ className: classNames('toast', className), role: "alert", "aria-live": "assertive", "aria-atomic": "true", style: style }, dataAttributes, { children: children })));
2068
2069
  }
2069
- var DToast$1 = Object.assign(DToast, {
2070
+ var DToast = Object.assign(DToast$1, {
2070
2071
  Header: DToastHeader,
2071
2072
  Body: DToastBody,
2072
2073
  });
@@ -2087,13 +2088,13 @@ function useDToast() {
2087
2088
  return null;
2088
2089
  }
2089
2090
  if (!description) {
2090
- return (jsxRuntime.jsx(DToast$1, { className: classNames({
2091
+ return (jsxRuntime.jsx(DToast, { className: classNames({
2091
2092
  [`toast-${color}`]: !!color,
2092
- }, 'show'), children: jsxRuntime.jsxs(DToast$1.Body, { children: [icon && (jsxRuntime.jsx(DIcon, { className: "toast-icon", icon: icon })), jsxRuntime.jsx("p", { className: "toast-title", children: title }), jsxRuntime.jsx("button", { type: "button", className: "d-close align-self-center", "aria-label": "Close", onClick: () => reactHotToast.toast.dismiss(id), children: jsxRuntime.jsx(DIcon, { icon: closeIcon || xLg }) })] }) }));
2093
+ }, 'show'), children: jsxRuntime.jsxs(DToast.Body, { children: [icon && (jsxRuntime.jsx(DIcon, { className: "toast-icon", icon: icon })), jsxRuntime.jsx("p", { className: "toast-title", children: title }), jsxRuntime.jsx("button", { type: "button", className: "d-close align-self-center", "aria-label": "Close", onClick: () => reactHotToast.toast.dismiss(id), children: jsxRuntime.jsx(DIcon, { icon: closeIcon || xLg }) })] }) }));
2093
2094
  }
2094
- return (jsxRuntime.jsxs(DToast$1, { className: classNames({
2095
+ return (jsxRuntime.jsxs(DToast, { className: classNames({
2095
2096
  [`toast-${color}`]: !!color,
2096
- }, 'show'), children: [jsxRuntime.jsxs(DToast$1.Header, { children: [icon && (jsxRuntime.jsx(DIcon, { className: "toast-icon", icon: icon })), jsxRuntime.jsx("p", { className: "toast-title", children: title }), timestamp && (jsxRuntime.jsx("small", { className: "toast-timestamp", children: timestamp })), jsxRuntime.jsx("button", { type: "button", className: "d-close align-self-center", "aria-label": "Close", onClick: () => reactHotToast.toast.dismiss(id), children: jsxRuntime.jsx(DIcon, { icon: closeIcon || xLg }) })] }), jsxRuntime.jsx(DToast$1.Body, { children: jsxRuntime.jsx("span", { children: description }) })] }));
2097
+ }, 'show'), children: [jsxRuntime.jsxs(DToast.Header, { children: [icon && (jsxRuntime.jsx(DIcon, { className: "toast-icon", icon: icon })), jsxRuntime.jsx("p", { className: "toast-title", children: title }), timestamp && (jsxRuntime.jsx("small", { className: "toast-timestamp", children: timestamp })), jsxRuntime.jsx("button", { type: "button", className: "d-close align-self-center", "aria-label": "Close", onClick: () => reactHotToast.toast.dismiss(id), children: jsxRuntime.jsx(DIcon, { icon: closeIcon || xLg }) })] }), jsxRuntime.jsx(DToast.Body, { children: jsxRuntime.jsx("span", { children: description }) })] }));
2097
2098
  }, toastProps);
2098
2099
  }, [xLg]);
2099
2100
  return {
@@ -2334,11 +2335,11 @@ exports.DBox = DBox;
2334
2335
  exports.DBoxFile = DBoxFile;
2335
2336
  exports.DButton = DButton;
2336
2337
  exports.DButtonIcon = DButtonIcon;
2337
- exports.DCard = DCard$1;
2338
+ exports.DCard = DCard;
2338
2339
  exports.DCardBody = DCardBody;
2339
2340
  exports.DCardFooter = DCardFooter;
2340
2341
  exports.DCardHeader = DCardHeader;
2341
- exports.DCarousel = DCarousel$1;
2342
+ exports.DCarousel = DCarousel;
2342
2343
  exports.DCarouselSlide = DCarouselSlide;
2343
2344
  exports.DChip = DChip;
2344
2345
  exports.DCollapse = DCollapse;
@@ -2361,30 +2362,30 @@ exports.DInputPin = DInputPin;
2361
2362
  exports.DInputRange = ForwardedDInputRange;
2362
2363
  exports.DInputSelect = DInputSelect;
2363
2364
  exports.DInputSwitch = DInputSwitch;
2364
- exports.DLayout = DLayout$1;
2365
+ exports.DLayout = DLayout;
2365
2366
  exports.DLayoutPane = DLayoutPane;
2366
- exports.DListGroup = DListGroup$1;
2367
+ exports.DListGroup = DListGroup;
2367
2368
  exports.DListGroupItem = DListGroupItem;
2368
- exports.DModal = DModal$1;
2369
+ exports.DModal = DModal;
2369
2370
  exports.DModalBody = DModalBody;
2370
2371
  exports.DModalFooter = DModalFooter;
2371
2372
  exports.DModalHeader = DModalHeader;
2372
- exports.DOffcanvas = DOffcanvas$1;
2373
+ exports.DOffcanvas = DOffcanvas;
2373
2374
  exports.DOffcanvasBody = DOffcanvasBody;
2374
2375
  exports.DOffcanvasFooter = DOffcanvasFooter;
2375
2376
  exports.DOffcanvasHeader = DOffcanvasHeader;
2376
2377
  exports.DPaginator = DPaginator;
2377
2378
  exports.DPopover = DPopover;
2378
2379
  exports.DProgress = DProgress;
2379
- exports.DSelect = DSelect$1;
2380
+ exports.DSelect = DSelect;
2380
2381
  exports.DStepper = DStepper;
2381
2382
  exports.DStepperDesktop = DStepper$2;
2382
2383
  exports.DStepperMobile = DStepper$1;
2383
2384
  exports.DTabContent = DTabContent;
2384
2385
  exports.DTableHead = DTableHead;
2385
- exports.DTabs = DTabs$1;
2386
+ exports.DTabs = DTabs;
2386
2387
  exports.DTimeline = DTimeline;
2387
- exports.DToast = DToast$1;
2388
+ exports.DToast = DToast;
2388
2389
  exports.DToastContainer = DToastContainer;
2389
2390
  exports.DTooltip = DTooltip;
2390
2391
  exports.changeQueryString = changeQueryString;