@televet/kibble-ui 1.17.5 → 1.17.6-beta.43w39py.1

package/build/components/Feedback/Alert/alert.component.d.ts

@@ -1,11 +1,13 @@
-import React from 'react';
+import React, { ReactNode } from 'react';
 import { AlertProps as CAlertProps } from '@chakra-ui/react';
 import { IconProps } from 'components/MediaAndIcons';
 import { AlertVariant } from './alert.types';
 import { ButtonProps } from 'components/Forms/Button';
 import { TextProps } from 'components/Typography/Text';
 import { Status } from '../feedback.types';
+import { HeadingProps } from '../../Typography';
 export interface AlertProps extends CAlertProps {
+    children?: ReactNode;
     status?: AlertVariant | Status;
     showIcon?: boolean;
     iconProps?: IconProps;
@@ -13,10 +15,10 @@ export interface AlertProps extends CAlertProps {
     buttonProps?: ButtonProps;
     buttonTitle?: string;
     alertTitle: string;
-    titleProps?: TextProps;
+    titleProps?: HeadingProps;
     description?: string;
     descriptionProps?: TextProps;
     showCloseButton?: boolean;
     onClose?: React.MouseEventHandler<HTMLButtonElement>;
 }
-export declare const Alert: ({ status, showIcon, iconProps, showButton, buttonProps, buttonTitle, alertTitle, titleProps, description, descriptionProps, showCloseButton, onClose, ...rest }: AlertProps) => JSX.Element;
+export declare const Alert: ({ children, status, showIcon, iconProps, showButton, buttonProps, buttonTitle, alertTitle, titleProps, description, descriptionProps, showCloseButton, onClose, ...rest }: AlertProps) => JSX.Element;

package/build/components/Feedback/Alert/index.d.ts

@@ -1,5 +1,4 @@
 export { Alert as CAlert } from '@chakra-ui/react';
-export * from './components/AlertButton/alertButton.component';
 export * from './components/AlertIcon/alertIcon.component';
 export * from './alert.component';
 export * from './alert.types';

package/build/components/Feedback/feedback.model.d.ts

@@ -0,0 +1,3 @@
+import { Status } from './feedback.types';
+export declare const LightStatusVariantMap: Record<Status, string>;
+export declare const DarkStatusVariantMap: Record<Status, string>;

package/build/components/Feedback/index.d.ts

@@ -1,3 +1,5 @@
 export * from './Alert';
 export * from './Toast';
 export * from './Spinner';
+export * from './feedback.types';
+export * from './feedback.model';

package/build/hooks/index.d.ts

@@ -1,2 +1,4 @@
 export * from './useTheme';
 export * from './useDisclosure';
+export * from './useAdaptiveColor';
+export * from './useAdaptiveColorMap';

package/build/index.js

@@ -572,6 +572,10 @@ var TagConfig = {
 
 var useTheme = function () { return react.useTheme(); };
 
+var useAdaptiveColor = function (color) { return react.useColorModeValue(color.light, color.dark); };
+
+var useAdaptiveColorMap = function (map, token, darkMode) { return react.useColorModeValue(map[darkMode ? 'dark' : 'light'][token], map.dark[token]); };
+
 exports.NotificationCounterVariant = void 0;
 (function (NotificationCounterVariant) {
     NotificationCounterVariant["Red"] = "red";
@@ -1576,8 +1580,6 @@ var IconSizeMap$1 = {
     '2xl': 38,
 };
 
-var useAdaptiveColorMap = function (map, token, darkMode) { return react.useColorModeValue(map[darkMode ? 'dark' : 'light'][token], map.dark[token]); };
-
 var Icon = React.forwardRef(function (_a, ref) {
     var name = _a.name, _b = _a.size, size = _b === void 0 ? 'lg' : _b, _c = _a.color, color = _c === void 0 ? 'currentColor' : _c;
     var colors = useTheme().colors;
@@ -1588,7 +1590,32 @@ var Icon = React.forwardRef(function (_a, ref) {
 });
 Icon.displayName = 'Icon';
 
-var useAdaptiveColor = function (color) { return react.useColorModeValue(color.light, color.dark); };
+var AlertIconColorMap = {
+    info: 'active',
+    success: 'success',
+    error: 'error',
+    warning: 'warning',
+};
+var AlertIcon = function (_a) {
+    var status = _a.status, rest = __rest(_a, ["status"]);
+    var color = react.useColorModeValue(AlertIconColorMap[status], 'currentColor');
+    return React__default["default"].createElement(Icon, __assign({ color: color, size: "lg" }, rest));
+};
+
+exports.AlertVariant = void 0;
+(function (AlertVariant) {
+    AlertVariant["Error"] = "error";
+    AlertVariant["Warning"] = "warning";
+    AlertVariant["Success"] = "success";
+    AlertVariant["Info"] = "info";
+})(exports.AlertVariant || (exports.AlertVariant = {}));
+exports.AlertStatusIcon = void 0;
+(function (AlertStatusIcon) {
+    AlertStatusIcon["error"] = "warningSign";
+    AlertStatusIcon["warning"] = "warningSign";
+    AlertStatusIcon["success"] = "checkmark";
+    AlertStatusIcon["info"] = "infoCircleOutlined";
+})(exports.AlertStatusIcon || (exports.AlertStatusIcon = {}));
 
 var camelCaseToLabel = function (s) {
     return s.replace(/([A-Z])/g, ' $1').replace(/^\w/, function (c) { return c.toUpperCase(); });
@@ -3493,38 +3520,6 @@ var ButtonSizeConfig = {
     },
 };
 
-var AlertButton = function (_a) {
-    var alignment = _a.alignment, _b = _a.variant, variant = _b === void 0 ? 'secondary' : _b, _c = _a.size, size = _c === void 0 ? 'xs' : _c, _d = _a.pairedWithCloseButton, pairedWithCloseButton = _d === void 0 ? false : _d, rest = __rest(_a, ["alignment", "variant", "size", "pairedWithCloseButton"]);
-    return (React__default["default"].createElement(Button, __assign({ size: size, variant: variant }, rest, (alignment === 'bottom' && { mt: 2, mb: 1 }), (alignment === 'right' && pairedWithCloseButton && { mr: 2 })), rest.children));
-};
-
-var AlertIconColorMap = {
-    info: 'active',
-    success: 'success',
-    error: 'error',
-    warning: 'warning',
-};
-var AlertIcon = function (_a) {
-    var status = _a.status, rest = __rest(_a, ["status"]);
-    var color = react.useColorModeValue(AlertIconColorMap[status], 'currentColor');
-    return React__default["default"].createElement(Icon, __assign({ color: color, size: "lg" }, rest));
-};
-
-exports.AlertVariant = void 0;
-(function (AlertVariant) {
-    AlertVariant["Error"] = "error";
-    AlertVariant["Warning"] = "warning";
-    AlertVariant["Success"] = "success";
-    AlertVariant["Info"] = "info";
-})(exports.AlertVariant || (exports.AlertVariant = {}));
-exports.AlertStatusIcon = void 0;
-(function (AlertStatusIcon) {
-    AlertStatusIcon["error"] = "warningSign";
-    AlertStatusIcon["warning"] = "warningSign";
-    AlertStatusIcon["success"] = "checkmark";
-    AlertStatusIcon["info"] = "infoCircleOutlined";
-})(exports.AlertStatusIcon || (exports.AlertStatusIcon = {}));
-
 var Text = function (_a) {
     var children = _a.children, _b = _a.variant, variant = _b === void 0 ? 'regular' : _b, _c = _a.as, as = _c === void 0 ? 'span' : _c, color = _a.color, _d = _a.colorToken, colorToken = _d === void 0 ? 'default' : _d, _e = _a.darkMode, darkMode = _e === void 0 ? false : _e, rest = __rest(_a, ["children", "variant", "as", "color", "colorToken", "darkMode"]);
     var colors = useTheme().colors;
@@ -3585,70 +3580,161 @@ var TextConfig = {
     },
 };
 
-function useWindowSize() {
-    // Initialize state with undefined width/height so server and client renders match
-    // Learn more here: https://joshwcomeau.com/react/the-perils-of-rehydration/
-    var _a = __read(React.useState({
-        width: undefined,
-        height: undefined,
-    }), 2), windowSize = _a[0], setWindowSize = _a[1];
-    React.useEffect(function () {
-        // Handler to call on window resize
-        function handleResize() {
-            // Set window width/height to state
-            setWindowSize({
-                width: window.innerWidth,
-                height: window.innerHeight,
-            });
-        }
-        // Add event listener
-        window.addEventListener('resize', handleResize);
-        // Call handler right away so state gets updated with initial window size
-        handleResize();
-        // Remove event listener on cleanup
-        return function () { return window.removeEventListener('resize', handleResize); };
-    }, []); // Empty array ensures that effect is only run on mount
-    return windowSize;
-}
-
-var useOverflowingText = function (text, textRef) {
-    var size = useWindowSize();
-    var _a = __read(React.useState(false), 2), isTextOverFlowing = _a[0], setIsTextOverFlowing = _a[1];
+var Heading = function (_a) {
+    var children = _a.children, _b = _a.size, size = _b === void 0 ? 'lg' : _b, color = _a.color, _c = _a.colorToken, colorToken = _c === void 0 ? 'headline' : _c, _d = _a.darkMode, darkMode = _d === void 0 ? false : _d, rest = __rest(_a, ["children", "size", "color", "colorToken", "darkMode"]);
+    var _e = useTheme(), components = _e.components, colors = _e.colors;
+    var adaptiveColor = useAdaptiveColorMap(colors.text, colorToken, darkMode);
+    var variant = react.useBreakpointValue({ base: 'small', md: 'large' }) || 'small';
+    var sizes = components.Heading.variants[variant].sizes;
+    var sizeProps = !sizes ? undefined : sizes[size];
+    return (React__default["default"].createElement(react.Heading, __assign({ variant: variant }, sizeProps, { color: color || adaptiveColor }, rest), children));
+};
+
+var HeadingConfig = {
+    variants: {
+        large: {
+            sizes: {
+                xs: {
+                    fontSize: '14px',
+                    lineHeight: '120%',
+                    fontWeight: fontWeights.semibold,
+                },
+                sm: {
+                    fontSize: '16px',
+                    lineHeight: '120%',
+                    fontWeight: fontWeights.semibold,
+                },
+                md: {
+                    fontSize: '20px',
+                    lineHeight: '120%',
+                    fontWeight: fontWeights.semibold,
+                },
+                lg: {
+                    fontSize: '30px',
+                    lineHeight: '133%',
+                    fontWeight: fontWeights.semibold,
+                },
+                xl: {
+                    fontSize: '36px',
+                    lineHeight: '133%',
+                    fontWeight: fontWeights.semibold,
+                },
+                '2xl': {
+                    fontSize: '48px',
+                    lineHeight: '120%',
+                    fontWeight: fontWeights.semibold,
+                },
+                '3xl': {
+                    fontSize: '60px',
+                    lineHeight: '100%',
+                    fontWeight: fontWeights.semibold,
+                },
+                '4xl': {
+                    fontSize: '72px',
+                    lineHeight: '100%',
+                    fontWeight: fontWeights.semibold,
+                },
+            },
+        },
+        small: {
+            sizes: {
+                xs: {
+                    fontSize: '14px',
+                    lineHeight: '120%',
+                    fontWeight: fontWeights.semibold,
+                },
+                sm: {
+                    fontSize: '16px',
+                    lineHeight: '120%',
+                    fontWeight: fontWeights.semibold,
+                },
+                md: {
+                    fontSize: '20px',
+                    lineHeight: '120%',
+                    fontWeight: fontWeights.semibold,
+                },
+                lg: {
+                    fontSize: '24px',
+                    lineHeight: '133%',
+                    fontWeight: fontWeights.semibold,
+                },
+                xl: {
+                    fontSize: '30px',
+                    lineHeight: '133%',
+                    fontWeight: fontWeights.semibold,
+                },
+                '2xl': {
+                    fontSize: '36px',
+                    lineHeight: '120%',
+                    fontWeight: fontWeights.semibold,
+                },
+                '3xl': {
+                    fontSize: '48px',
+                    lineHeight: '100%',
+                    fontWeight: fontWeights.semibold,
+                },
+                '4xl': {
+                    fontSize: '60px',
+                    lineHeight: '100%',
+                    fontWeight: fontWeights.semibold,
+                },
+            },
+        },
+    },
+};
+
+var TruncatedText = function (_a) {
+    var _b = _a.noOfLines, noOfLines = _b === void 0 ? 1 : _b, textContent = _a.textContent, placement = _a.placement, titleCaseTooltipLabel = _a.titleCaseTooltipLabel, rest = __rest(_a, ["noOfLines", "textContent", "placement", "titleCaseTooltipLabel"]);
+    var _c = __read(React.useState(false), 2), isTextOverFlowing = _c[0], setIsTextOverFlowing = _c[1];
+    var containerRef = React.useRef(null);
     var onCheckTextOverFlowing = React.useCallback(function (containerRefValue) {
-        var _a;
+        var _a, _b;
         if (containerRefValue && containerRefValue.current) {
-            var lines = (_a = containerRefValue.current) === null || _a === void 0 ? void 0 : _a.children[0].getClientRects().length;
-            return lines > 1;
+            var textScrollHeight = ((_a = containerRefValue.current) === null || _a === void 0 ? void 0 : _a.children[0].scrollHeight) || 0;
+            var containerOffsetHeight = ((_b = containerRefValue.current) === null || _b === void 0 ? void 0 : _b.offsetHeight) || 0;
+            return textScrollHeight > containerOffsetHeight;
         }
         return false;
     }, []);
     React.useEffect(function () {
-        // if size of window changes, or if title length changes, check if text is overflowing
-        var isOverFlowing = onCheckTextOverFlowing(textRef);
-        setIsTextOverFlowing(isOverFlowing);
-    }, [size, text, onCheckTextOverFlowing, textRef]);
-    return isTextOverFlowing;
+        var checkValue = onCheckTextOverFlowing(containerRef);
+        setIsTextOverFlowing(checkValue);
+    }, [containerRef, onCheckTextOverFlowing]);
+    return (React__default["default"].createElement(react.Box, { ref: containerRef, className: "TruncatedText__Wrapper" },
+        React__default["default"].createElement(Tooltip, { className: "TruncatedText__Tooltip", label: textContent || '', isDisabled: !isTextOverFlowing, placement: placement, titleCaseLabel: titleCaseTooltipLabel },
+            React__default["default"].createElement(react.Text, __assign({ className: "TruncatedText__TextContent", noOfLines: noOfLines, as: "p" }, rest), textContent))));
+};
+
+var LightStatusVariantMap = {
+    info: 'info',
+    success: 'success',
+    warning: 'warning',
+    error: 'error',
+};
+var DarkStatusVariantMap = {
+    info: 'infoDark',
+    success: 'successDark',
+    warning: 'warningDark',
+    error: 'errorDark',
 };
 
 var Alert = function (_a) {
-    var _b = _a.status, status = _b === void 0 ? exports.AlertVariant.Success : _b, _c = _a.showIcon, showIcon = _c === void 0 ? true : _c, iconProps = _a.iconProps, _d = _a.showButton, showButton = _d === void 0 ? false : _d, buttonProps = _a.buttonProps, buttonTitle = _a.buttonTitle, alertTitle = _a.alertTitle, titleProps = _a.titleProps, description = _a.description, descriptionProps = _a.descriptionProps, _e = _a.showCloseButton, showCloseButton = _e === void 0 ? true : _e, onClose = _a.onClose, rest = __rest(_a, ["status", "showIcon", "iconProps", "showButton", "buttonProps", "buttonTitle", "alertTitle", "titleProps", "description", "descriptionProps", "showCloseButton", "onClose"]);
-    var titleRef = React.useRef(null);
-    var isTitleOverflowing = useOverflowingText(alertTitle, titleRef);
-    var showButtonInline = showButton && !description && !isTitleOverflowing;
-    var showButtonBottom = (showButton && description) || (showButton && !description && isTitleOverflowing);
-    return (React__default["default"].createElement(react.Alert, __assign({ justifyContent: "space-between", overflow: "visible", variant: status, pl: 3, pr: showCloseButton ? 2 : 3 }, rest),
-        React__default["default"].createElement(react.HStack, { justifyContent: "space-between", w: "100%" },
-            showIcon && (React__default["default"].createElement(react.Flex, { alignSelf: "flex-start" },
+    var children = _a.children, _b = _a.status, status = _b === void 0 ? exports.AlertVariant.Success : _b, _c = _a.showIcon, showIcon = _c === void 0 ? true : _c, iconProps = _a.iconProps, _d = _a.showButton, showButton = _d === void 0 ? false : _d, buttonProps = _a.buttonProps, buttonTitle = _a.buttonTitle, alertTitle = _a.alertTitle, titleProps = _a.titleProps, description = _a.description, descriptionProps = _a.descriptionProps, _e = _a.showCloseButton, showCloseButton = _e === void 0 ? true : _e, onClose = _a.onClose, rest = __rest(_a, ["children", "status", "showIcon", "iconProps", "showButton", "buttonProps", "buttonTitle", "alertTitle", "titleProps", "description", "descriptionProps", "showCloseButton", "onClose"]);
+    var variant = react.useColorModeValue(LightStatusVariantMap[status], DarkStatusVariantMap[status]);
+    return (React__default["default"].createElement(react.Alert, __assign({ justifyContent: "space-between", overflow: "visible", variant: variant, pl: 3, pr: showCloseButton ? 2 : 3 }, rest),
+        React__default["default"].createElement(react.Flex, { w: "100%" },
+            showIcon && (React__default["default"].createElement(react.Box, { mr: 2 },
                 React__default["default"].createElement(AlertIcon, __assign({ status: status, name: (iconProps === null || iconProps === void 0 ? void 0 : iconProps.name) || exports.AlertStatusIcon[status] }, iconProps)))),
-            React__default["default"].createElement(react.Flex, __assign({ width: "100%", flexDirection: "column" }, (showIcon && { ml: 2 })),
-                React__default["default"].createElement(react.Flex, { alignItems: "flex-start", w: "100%", justifyContent: "space-between" },
-                    React__default["default"].createElement(react.Box, { ref: titleRef, mr: showButtonInline || showCloseButton ? 2 : 0 },
-                        React__default["default"].createElement(Text, __assign({ size: "md", variant: "semibold" }, titleProps), alertTitle)),
-                    React__default["default"].createElement(react.Flex, { alignItems: "center" },
-                        showButtonInline && (React__default["default"].createElement(AlertButton, __assign({ alignment: "right" }, buttonProps, { pairedWithCloseButton: showCloseButton }), buttonTitle)),
-                        showCloseButton && React__default["default"].createElement(Button, { variant: "ghostNeutral", iconName: "close", size: "xs", onClick: onClose }))),
-                description && (React__default["default"].createElement(Text, __assign({ size: "md" }, descriptionProps), description)),
-                React__default["default"].createElement(react.Box, null, showButtonBottom && (React__default["default"].createElement(AlertButton, __assign({ alignment: "bottom" }, buttonProps), buttonTitle)))))));
+            React__default["default"].createElement(react.Flex, { flexGrow: 1 },
+                React__default["default"].createElement(react.Flex, { alignItems: "flex-start", flexDirection: description ? 'column' : 'row', flexWrap: "wrap", w: "100%", justify: "space-between", align: "center" },
+                    React__default["default"].createElement(react.Box, { pt: 0.5, pr: 1, flexGrow: 1 },
+                        React__default["default"].createElement(Heading, __assign({ size: "sm", colorToken: "default" }, titleProps), alertTitle)),
+                    description && (React__default["default"].createElement(react.Box, { flexGrow: 1, pb: 2 },
+                        React__default["default"].createElement(Text, __assign({ as: "p", size: "md" }, descriptionProps), description))),
+                    children,
+                    showButton && (React__default["default"].createElement(Button, __assign({ size: "xs", variant: "secondary" }, buttonProps), buttonTitle)))),
+            showCloseButton && (React__default["default"].createElement(react.Box, { ml: 2 },
+                React__default["default"].createElement(Button, { variant: "ghostNeutral", iconName: "close", size: "xs", onClick: onClose }))))));
 };
 
 var AlertConfig = {
@@ -14228,17 +14314,11 @@ function getToastPlacement(position, dir) {
     return (_a = logical === null || logical === void 0 ? void 0 : logical[dir]) !== null && _a !== void 0 ? _a : position;
 }
 
-var StatusVariantMap = {
-    info: 'infoDark',
-    success: 'successDark',
-    warning: 'warningDark',
-    error: 'errorDark',
-};
 var Toast = function (props) {
     var _a = props.status, status = _a === void 0 ? 'info' : _a, id = props.id, title = props.title, isClosable = props.isClosable, onClose = props.onClose, description = props.description, buttonTitle = props.buttonTitle, onButtonClick = props.onButtonClick, _b = props.hideIcon, hideIcon = _b === void 0 ? false : _b;
     var buttonProps = { onClick: onButtonClick };
     return (React__namespace.createElement(react.DarkMode, null,
-        React__namespace.createElement(Alert, { id: id, alertTitle: title, buttonTitle: buttonTitle, description: description, showIcon: !hideIcon, status: status, showCloseButton: isClosable, onClose: onClose, variant: StatusVariantMap[status], showButton: !!onButtonClick && !!buttonTitle, buttonProps: buttonProps })));
+        React__namespace.createElement(Alert, { id: id, alertTitle: title, buttonTitle: buttonTitle, description: description, showIcon: !hideIcon, status: status, showCloseButton: isClosable, onClose: onClose, variant: DarkStatusVariantMap[status], showButton: !!onButtonClick && !!buttonTitle, buttonProps: buttonProps })));
 };
 var defaults = {
     title: '',
@@ -14809,131 +14889,6 @@ var RatingDot = function (_a) {
         } }, number))) : (React__default["default"].createElement(react.Flex, { as: "div", bgColor: colors.background.brand, h: "40px", w: "40px", borderRadius: "20px", border: "2px solid ".concat(colors.background.brand), color: colors.text.dark.default, mr: 1, mb: 1, justifyContent: "center", alignItems: "center", fontSize: "lg", cursor: "default" }, number))));
 };
 
-var Heading = function (_a) {
-    var children = _a.children, _b = _a.size, size = _b === void 0 ? 'lg' : _b, color = _a.color, _c = _a.colorToken, colorToken = _c === void 0 ? 'headline' : _c, _d = _a.darkMode, darkMode = _d === void 0 ? false : _d, rest = __rest(_a, ["children", "size", "color", "colorToken", "darkMode"]);
-    var _e = useTheme(), components = _e.components, colors = _e.colors;
-    var adaptiveColor = useAdaptiveColorMap(colors.text, colorToken, darkMode);
-    var variant = react.useBreakpointValue({ base: 'small', md: 'large' }) || 'small';
-    var sizes = components.Heading.variants[variant].sizes;
-    var sizeProps = !sizes ? undefined : sizes[size];
-    return (React__default["default"].createElement(react.Heading, __assign({ variant: variant }, sizeProps, { color: color || adaptiveColor }, rest), children));
-};
-
-var HeadingConfig = {
-    variants: {
-        large: {
-            sizes: {
-                xs: {
-                    fontSize: '14px',
-                    lineHeight: '120%',
-                    fontWeight: fontWeights.semibold,
-                },
-                sm: {
-                    fontSize: '16px',
-                    lineHeight: '120%',
-                    fontWeight: fontWeights.semibold,
-                },
-                md: {
-                    fontSize: '20px',
-                    lineHeight: '120%',
-                    fontWeight: fontWeights.semibold,
-                },
-                lg: {
-                    fontSize: '30px',
-                    lineHeight: '133%',
-                    fontWeight: fontWeights.semibold,
-                },
-                xl: {
-                    fontSize: '36px',
-                    lineHeight: '133%',
-                    fontWeight: fontWeights.semibold,
-                },
-                '2xl': {
-                    fontSize: '48px',
-                    lineHeight: '120%',
-                    fontWeight: fontWeights.semibold,
-                },
-                '3xl': {
-                    fontSize: '60px',
-                    lineHeight: '100%',
-                    fontWeight: fontWeights.semibold,
-                },
-                '4xl': {
-                    fontSize: '72px',
-                    lineHeight: '100%',
-                    fontWeight: fontWeights.semibold,
-                },
-            },
-        },
-        small: {
-            sizes: {
-                xs: {
-                    fontSize: '14px',
-                    lineHeight: '120%',
-                    fontWeight: fontWeights.semibold,
-                },
-                sm: {
-                    fontSize: '16px',
-                    lineHeight: '120%',
-                    fontWeight: fontWeights.semibold,
-                },
-                md: {
-                    fontSize: '20px',
-                    lineHeight: '120%',
-                    fontWeight: fontWeights.semibold,
-                },
-                lg: {
-                    fontSize: '24px',
-                    lineHeight: '133%',
-                    fontWeight: fontWeights.semibold,
-                },
-                xl: {
-                    fontSize: '30px',
-                    lineHeight: '133%',
-                    fontWeight: fontWeights.semibold,
-                },
-                '2xl': {
-                    fontSize: '36px',
-                    lineHeight: '120%',
-                    fontWeight: fontWeights.semibold,
-                },
-                '3xl': {
-                    fontSize: '48px',
-                    lineHeight: '100%',
-                    fontWeight: fontWeights.semibold,
-                },
-                '4xl': {
-                    fontSize: '60px',
-                    lineHeight: '100%',
-                    fontWeight: fontWeights.semibold,
-                },
-            },
-        },
-    },
-};
-
-var TruncatedText = function (_a) {
-    var _b = _a.noOfLines, noOfLines = _b === void 0 ? 1 : _b, textContent = _a.textContent, placement = _a.placement, titleCaseTooltipLabel = _a.titleCaseTooltipLabel, rest = __rest(_a, ["noOfLines", "textContent", "placement", "titleCaseTooltipLabel"]);
-    var _c = __read(React.useState(false), 2), isTextOverFlowing = _c[0], setIsTextOverFlowing = _c[1];
-    var containerRef = React.useRef(null);
-    var onCheckTextOverFlowing = React.useCallback(function (containerRefValue) {
-        var _a, _b;
-        if (containerRefValue && containerRefValue.current) {
-            var textScrollHeight = ((_a = containerRefValue.current) === null || _a === void 0 ? void 0 : _a.children[0].scrollHeight) || 0;
-            var containerOffsetHeight = ((_b = containerRefValue.current) === null || _b === void 0 ? void 0 : _b.offsetHeight) || 0;
-            return textScrollHeight > containerOffsetHeight;
-        }
-        return false;
-    }, []);
-    React.useEffect(function () {
-        var checkValue = onCheckTextOverFlowing(containerRef);
-        setIsTextOverFlowing(checkValue);
-    }, [containerRef, onCheckTextOverFlowing]);
-    return (React__default["default"].createElement(react.Box, { ref: containerRef, className: "TruncatedText__Wrapper" },
-        React__default["default"].createElement(Tooltip, { className: "TruncatedText__Tooltip", label: textContent || '', isDisabled: !isTextOverFlowing, placement: placement, titleCaseLabel: titleCaseTooltipLabel },
-            React__default["default"].createElement(react.Text, __assign({ className: "TruncatedText__TextContent", noOfLines: noOfLines, as: "p" }, rest), textContent))));
-};
-
 var RatingDots = function (_a) {
     var minValue = _a.minValue, maxValue = _a.maxValue, minLabel = _a.minLabel, maxLabel = _a.maxLabel, centeredLabel = _a.centeredLabel, isDisabled = _a.isDisabled, isInteractive = _a.isInteractive, onClick = _a.onClick, selected = _a.selected;
     var _b = __read(React.useState(), 2), selectedValue = _b[0], setSelectedValue = _b[1];
@@ -24585,7 +24540,6 @@ Object.defineProperty(exports, 'useRadioGroup', {
     get: function () { return react.useRadioGroup; }
 });
 exports.Alert = Alert;
-exports.AlertButton = AlertButton;
 exports.AlertConfig = AlertConfig;
 exports.AlertIcon = AlertIcon;
 exports.Avatar = Avatar;
@@ -24599,6 +24553,7 @@ exports.ButtonVariantConfig = ButtonVariantConfig;
 exports.Checkbox = Checkbox;
 exports.CheckboxConfig = CheckboxConfig;
 exports.CheckboxGroup = WrappedCheckboxGroup;
+exports.DarkStatusVariantMap = DarkStatusVariantMap;
 exports.DatePicker = DatePicker;
 exports.DatePickerContext = DatePickerContext;
 exports.DrawerConfig = DrawerConfig;
@@ -24606,6 +24561,7 @@ exports.Heading = Heading;
 exports.HeadingConfig = HeadingConfig;
 exports.Icon = Icon;
 exports.KibbleThemeProvider = KibbleThemeProvider;
+exports.LightStatusVariantMap = LightStatusVariantMap;
 exports.Logo = Logo;
 exports.MenuConfig = MenuConfig;
 exports.MenuContext = MenuContext;
@@ -24652,6 +24608,8 @@ exports.TruncatedText = TruncatedText;
 exports.createStandaloneToast = createStandaloneToast;
 exports.defaultStandaloneParam = defaultStandaloneParam;
 exports.theme = theme;
+exports.useAdaptiveColor = useAdaptiveColor;
+exports.useAdaptiveColorMap = useAdaptiveColorMap;
 exports.useDatePickerContext = useDatePickerContext;
 exports.useMenuContext = useMenuContext;
 exports.useTheme = useTheme;