labsense-ui-kit 1.1.0 → 1.1.2

package/dist/Breadcrums/Breadcrums.d.ts

@@ -1,12 +1,12 @@
 import React from 'react';
-export interface Breadcrumb {
+export interface BreadcrumbDetail {
     navigateLink?: string;
     text: string;
 }
 interface BreadcrumbsProps {
     backLink?: boolean;
     disabled?: boolean;
-    breadcrumbs: Breadcrumb[];
+    breadcrumbs: BreadcrumbDetail[];
     onBackClick?: () => void;
 }
 declare const Breadcrumbs: React.FC<BreadcrumbsProps>;

package/dist/Breadcrums/index.d.ts

@@ -1,2 +1,2 @@
-import Breadcrumbs from './Breadcrums';
-export { Breadcrumbs };
+import Breadcrumbs, { BreadcrumbDetail } from './Breadcrums';
+export { Breadcrumbs, BreadcrumbDetail };

package/dist/Dropdown/index.d.ts

@@ -1,5 +1,5 @@
 import MultiSelectDropdown from './MultiSelectDropdown';
 import OptionComponent from './OptionComponent';
 import SelectedOption from './SelectedOption';
-import SelectOption from './SelectOption';
-export { MultiSelectDropdown, OptionComponent, SelectedOption, SelectOption };
+import SelectOption, { DropdownMenu, Options } from './SelectOption';
+export { MultiSelectDropdown, OptionComponent, SelectedOption, SelectOption, DropdownMenu, Options };

package/dist/Sidebar/index.d.ts

@@ -1,2 +1,2 @@
-import Sidebar from './Sidebar';
-export { Sidebar };
+import Sidebar, { logoDetails, SidebarItems } from './Sidebar';
+export { Sidebar, logoDetails, SidebarItems };

package/dist/Tabs/Tabs.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { IconNames } from '../Icons';
-export interface tabContent {
+export interface TabContentProps {
     title: string;
     icon?: IconNames;
     iconSize?: number;
@@ -10,12 +10,12 @@ export interface tabContent {
     content?: React.ReactNode;
 }
 interface TabProps {
-    tabItems: tabContent[];
+    tabItems: TabContentProps[];
     disabled?: boolean;
     headerHeight?: string;
     headerPadding?: string;
     activeTab: string;
     border?: string;
 }
-declare const Tab: React.FC<TabProps>;
-export default Tab;
+declare const Tabs: React.FC<TabProps>;
+export default Tabs;

package/dist/Tabs/index.d.ts

@@ -1,3 +1,4 @@
-import Tabs from './Tabs';
+import Tabs, { TabContentProps } from './Tabs';
 import InternalTabs from './InternalTabs';
 export { Tabs, InternalTabs };
+export { TabContentProps };

package/dist/index.d.ts

@@ -1,36 +1,36 @@
 import { Badge } from './Badge';
-import { Breadcrumbs } from './Breadcrums';
+import { Breadcrumbs, BreadcrumbDetail } from './Breadcrums';
 import { Button, ButtonProps, ButtonLoaderProps } from './Buttons';
 import { ButtonCarousel } from './Carousel';
 import { Container, Span } from './Container&Span/StyledComponents';
 import { DatePicker } from './Date-Time';
-import { MultiSelectDropdown, OptionComponent, SelectedOption, SelectOption } from './Dropdown';
-import { useClickOutside, useCustomModal } from './hooks';
+import { MultiSelectDropdown, OptionComponent, SelectedOption, SelectOption, DropdownMenu, Options } from './Dropdown';
+import { useClickOutside, useCustomModal, useNotification } from './hooks';
 import { Icon, IconNames } from './Icons';
 import { SearchBox, TextArea, TextField, TextFieldWithDropdown } from './Inputs';
 import { CircularLoader, Loader } from './Loader';
 import { Pagination } from './Pagination';
 import { ProgressBar } from './ProgressBar';
-import { Sidebar } from './Sidebar';
-import { Table, TableCell, TableRow } from './Table';
-import { InternalTabs, Tabs } from './Tabs';
+import { Sidebar, logoDetails, SidebarItems } from './Sidebar';
+import { Table, TableCell, TableRow, TableProps } from './Table';
+import { InternalTabs, Tabs, TabContentProps } from './Tabs';
 import { colorVariables, darkColorVariables, themes } from './Themes/Colors';
 import { convertToEpoch, formatDate, formatTimestamp, formatCalendarDateTime, timeAgo, formatEpochToIST, convertEpochToDateString, convertEpochToOnlyDate, getSystemTimezoneAbbreviation, timeStringToSeconds } from './Utils/Date&Time';
 export { Badge };
-export { Breadcrumbs };
+export { Breadcrumbs, BreadcrumbDetail };
 export { Button, ButtonProps, ButtonLoaderProps };
 export { ButtonCarousel };
 export { Container, Span };
 export { DatePicker };
-export { MultiSelectDropdown, OptionComponent, SelectedOption, SelectOption };
-export { useClickOutside, useCustomModal };
+export { MultiSelectDropdown, OptionComponent, SelectedOption, SelectOption, DropdownMenu, Options };
+export { useClickOutside, useCustomModal, useNotification };
 export { Icon, IconNames };
 export { SearchBox, TextArea, TextField, TextFieldWithDropdown };
 export { CircularLoader, Loader };
 export { Pagination };
 export { ProgressBar };
-export { Sidebar };
-export { TableCell, Table, TableRow };
-export { InternalTabs, Tabs };
+export { Sidebar, logoDetails, SidebarItems };
+export { TableCell, Table, TableRow, TableProps };
+export { InternalTabs, Tabs, TabContentProps };
 export { colorVariables, darkColorVariables, themes };
 export { convertToEpoch, formatDate, formatTimestamp, formatCalendarDateTime, timeAgo, formatEpochToIST, convertEpochToDateString, convertEpochToOnlyDate, getSystemTimezoneAbbreviation, timeStringToSeconds };

package/dist/index.js

@@ -3089,28 +3089,28 @@ var GlobalFonts = {
 var _templateObject$5, _templateObject2$3, _templateObject3$1, _templateObject4, _templateObject5, _templateObject6;
 var spin = styled.keyframes(_templateObject$5 || (_templateObject$5 = _taggedTemplateLiteralLoose(["\n  to {\n    transform: rotate(360deg);\n  }\n"])));
 var Spinner = styled__default.div(_templateObject2$3 || (_templateObject2$3 = _taggedTemplateLiteralLoose(["\n  width: ", "px;\n  height: ", "px;\n  border: ", "px solid #ddd;\n  border-top-color: ", ";\n  border-radius: 50%;\n  animation: fadeIn 0.3s ease-in-out forwards, ", " 1s linear infinite;\n"])), function (_ref) {
-  var size = _ref.size;
-  return size;
+  var $size = _ref.$size;
+  return $size;
 }, function (_ref2) {
-  var size = _ref2.size;
-  return size;
+  var $size = _ref2.$size;
+  return $size;
 }, function (_ref3) {
-  var size = _ref3.size;
-  return size / 4;
+  var $size = _ref3.$size;
+  return $size / 4;
 }, function (_ref4) {
-  var color = _ref4.color;
-  return color;
+  var $color = _ref4.$color;
+  return $color;
 }, spin);
 var LoaderWrapper = styled__default.div(_templateObject3$1 || (_templateObject3$1 = _taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  margin-left: ", ";\n  margin-right: ", ";\n  transition: opacity 0.3s ease-in-out;\n"])), function (_ref5) {
-  var loaderPosition = _ref5.loaderPosition;
-  return loaderPosition === 'right' ? '4px' : '0';
+  var $loaderPosition = _ref5.$loaderPosition;
+  return $loaderPosition === 'right' ? '4px' : '0';
 }, function (_ref6) {
-  var loaderPosition = _ref6.loaderPosition;
-  return loaderPosition === 'left' ? '4px' : '0';
+  var $loaderPosition = _ref6.$loaderPosition;
+  return $loaderPosition === 'left' ? '4px' : '0';
 });
 var Container$1 = styled__default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: ", ";\n  gap: ", ";\n  svg {\n    cursor: ", ";\n  }\n"])), function (_ref7) {
-  var iconPosition = _ref7.iconPosition;
-  return iconPosition === 'right' ? 'row-reverse' : 'row';
+  var $iconPosition = _ref7.$iconPosition;
+  return $iconPosition === 'right' ? 'row-reverse' : 'row';
 }, function (_ref8) {
   var gap = _ref8.gap;
   return gap || '4px';
@@ -3164,20 +3164,20 @@ var StyledButton = styled__default.button(_templateObject5 || (_templateObject5
   return color;
 });
 var ButtonText = styled__default.span(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n  font-family: ", ";\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n  white-space: nowrap;\n"])), function (_ref16) {
-  var fontFamily = _ref16.fontFamily;
-  return fontFamily ? fontFamily : GlobalFonts.bold;
+  var $fontFamily = _ref16.$fontFamily;
+  return $fontFamily ? $fontFamily : GlobalFonts.bold;
 }, function (_ref17) {
-  var size = _ref17.size,
-    fontSize = _ref17.fontSize;
-  return size === 'small' ? '14px' : size === 'medium' ? '16px' : size === 'large' ? '18px' : size === 'custom' ? fontSize : '16px';
+  var $size = _ref17.$size,
+    $fontSize = _ref17.$fontSize;
+  return $size === 'small' ? '14px' : $size === 'medium' ? '16px' : $size === 'large' ? '18px' : $size === 'custom' ? $fontSize : '16px';
 }, function (_ref18) {
-  var fontWeight = _ref18.fontWeight,
-    size = _ref18.size;
-  return size === 'custom' && fontWeight || '500';
+  var $fontWeight = _ref18.$fontWeight,
+    $size = _ref18.$size;
+  return $size === 'custom' && $fontWeight || '500';
 }, function (_ref19) {
-  var size = _ref19.size,
-    fontSize = _ref19.fontSize;
-  return size === 'small' ? '14px' : size === 'medium' ? '16px' : size === 'large' ? '18px' : size === 'custom' ? fontSize : '16px';
+  var $size = _ref19.$size,
+    $fontSize = _ref19.$fontSize;
+  return $size === 'small' ? '14px' : $size === 'medium' ? '16px' : $size === 'large' ? '18px' : $size === 'custom' ? $fontSize : '16px';
 });
 var ButtonComponent = function ButtonComponent(_ref20) {
   var onClick = _ref20.onClick,
@@ -3235,7 +3235,7 @@ var ButtonComponent = function ButtonComponent(_ref20) {
       return setIsHovered(false);
     }
   }, React__default.createElement(Container$1, {
-    iconPosition: iconPos,
+    "$iconPosition": iconPos,
     gap: gap,
     cursor: !disabled && typeof onClick === 'function' ? 'pointer' : 'default'
   }, icon && React__default.createElement(Icon, {
@@ -3250,15 +3250,15 @@ var ButtonComponent = function ButtonComponent(_ref20) {
     },
     color: variant === 'tertiary' && isHovered ? colorVariables.hover.primary : variant === 'tertiary' && disabled ? colorVariables.disabled.primary : variant === 'tertiary' ? colorVariables["default"].primary : variant === 'outline-primary' && isHovered ? colorVariables.text.white : variant === 'outline-primary' && disabled ? colorVariables.disabled.primary : variant === 'outline-primary' ? colorVariables["default"].primary : variant === 'outline-secondary' && isHovered ? colorVariables.text.white : variant === 'outline-secondary' && disabled ? colorVariables.disabled.secondary : variant === 'outline-secondary' ? colorVariables["default"].secondary : variant === 'outline-error' && isHovered ? colorVariables.text.white : variant === 'outline-error' && disabled ? colorVariables.disabled.error : variant === 'outline-error' ? colorVariables["default"].error : isHovered ? hoverColor : color ? color : colorVariables.text.white
   }), text && React__default.createElement(ButtonText, {
-    size: size,
-    fontFamily: fontFamily,
-    fontSize: fontSize,
-    fontWeight: fontWeight
+    "$size": size,
+    "$fontFamily": fontFamily,
+    "$fontSize": fontSize,
+    "$fontWeight": fontWeight
   }, text)), loaderProps.loading && React__default.createElement(LoaderWrapper, {
-    loaderPosition: loaderPos
+    "$loaderPosition": loaderPos
   }, React__default.createElement(Spinner, {
-    size: size === 'small' ? 12 : size === 'medium' ? 16 : 18,
-    color: loaderProps.loaderColor || 'color'
+    "$size": size === 'small' ? 12 : size === 'medium' ? 16 : 18,
+    "$color": loaderProps.loaderColor || 'color'
   })));
 };
 
@@ -6046,26 +6046,29 @@ var Table = function Table(_ref) {
 };
 
 var _templateObject$o, _templateObject2$j, _templateObject3$e, _templateObject4$b, _templateObject5$9;
-var Container$5 = styled__default.div(_templateObject$o || (_templateObject$o = _taggedTemplateLiteralLoose(["\n  \n"])));
-var FirstContainer = styled__default.div(_templateObject2$j || (_templateObject2$j = _taggedTemplateLiteralLoose(["\n  width: 100%;\n  display: flex;\n  font-family: NotoSans, sans-serif;\n  font-size: 16px;\n  gap: 24px;\n  border-bottom: 1px solid ", ";\n  padding: ", ";\n"])), colorVariables.border.light, function (_ref) {
-  var $headerPadding = _ref.$headerPadding;
+var Container$5 = styled__default.div(_templateObject$o || (_templateObject$o = _taggedTemplateLiteralLoose(["\n  width: 100%;\n  height: 100%;   \n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  gap: 24px;\n  border: ", ";\n  border-radius: 8px;\n"])), function (_ref) {
+  var $border = _ref.$border;
+  return $border;
+});
+var FirstContainer = styled__default.div(_templateObject2$j || (_templateObject2$j = _taggedTemplateLiteralLoose(["\n  width: 100%;\n  display: flex;\n  font-family: NotoSans, sans-serif;\n  font-size: 16px;\n  gap: 24px;\n  border-bottom: 1px solid ", ";\n  padding: ", ";\n"])), colorVariables.border.light, function (_ref2) {
+  var $headerPadding = _ref2.$headerPadding;
   return $headerPadding ? $headerPadding : '0px';
 });
-var TabContainer = styled__default.div(_templateObject3$e || (_templateObject3$e = _taggedTemplateLiteralLoose(["\n  width: auto;\n  display: flex;\n  align-items: center;\n  cursor: ", ";\n  opacity: ", ";\n  gap: 8px;\n  font-family: NotoSans, sans-serif;\n  font-size: 14px;\n  font-weight: 500;\n  color: ", ";\n  height: ", ";\n\n  svg {\n    cursor: ", ";\n  }\n\n"])), function (_ref2) {
-  var $disabled = _ref2.$disabled;
-  return $disabled ? 'not-allowed' : 'pointer';
-}, function (_ref3) {
+var TabContainer = styled__default.div(_templateObject3$e || (_templateObject3$e = _taggedTemplateLiteralLoose(["\n  width: auto;\n  display: flex;\n  align-items: center;\n  cursor: ", ";\n  opacity: ", ";\n  gap: 8px;\n  font-family: NotoSans, sans-serif;\n  font-size: 14px;\n  font-weight: 500;\n  color: ", ";\n  height: ", ";\n\n  svg {\n    cursor: ", ";\n  }\n\n"])), function (_ref3) {
   var $disabled = _ref3.$disabled;
+  return $disabled ? 'not-allowed' : 'pointer';
+}, function (_ref4) {
+  var $disabled = _ref4.$disabled;
   return $disabled ? '0.6' : '1';
-}, colorVariables.text.medium, function (_ref4) {
-  var $headerHeight = _ref4.$headerHeight;
+}, colorVariables.text.medium, function (_ref5) {
+  var $headerHeight = _ref5.$headerHeight;
   return $headerHeight ? $headerHeight : '34px';
-}, function (_ref5) {
-  var $disabled = _ref5.$disabled;
+}, function (_ref6) {
+  var $disabled = _ref6.$disabled;
   return $disabled ? 'not-allowed' : 'pointer';
 });
-var TabItemContainer = styled__default.div(_templateObject4$b || (_templateObject4$b = _taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  position: relative;\n  gap: 8px;\n  height: 100%;\n  max-height: ", ";\n\n  &:after {\n    content: \"\";\n    display: ", ";\n    width: 100%;\n    height: 3px;\n    background: ", ";\n    position: absolute;\n    bottom: -1px;\n    left: 0px;\n  }\n"])), function (_ref6) {
-  var $headerHeight = _ref6.$headerHeight;
+var TabItemContainer = styled__default.div(_templateObject4$b || (_templateObject4$b = _taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  position: relative;\n  gap: 8px;\n  height: 100%;\n  max-height: ", ";\n\n  &:after {\n    content: \"\";\n    display: ", ";\n    width: 100%;\n    height: 3px;\n    background: ", ";\n    position: absolute;\n    bottom: -1px;\n    left: 0px;\n  }\n"])), function (_ref7) {
+  var $headerHeight = _ref7.$headerHeight;
   return $headerHeight ? $headerHeight : '34px';
 }, function (props) {
   return props.$active ? 'block' : 'none';
@@ -6073,14 +6076,14 @@ var TabItemContainer = styled__default.div(_templateObject4$b || (_templateObjec
 var DetailsFirstContainer = styled__default.div(_templateObject5$9 || (_templateObject5$9 = _taggedTemplateLiteralLoose(["\n  text-align: center;\n  font-size: 14px;\n  line-height: 18px;\n  font-weight: 500;\n  font-family: NotoSans, sans-serif;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  color: ", ";\n"])), function (props) {
   return props.$active ? colorVariables["default"].primary : colorVariables.text.medium;
 });
-var Tab = function Tab(_ref7) {
-  var tabItems = _ref7.tabItems,
-    _ref7$disabled = _ref7.disabled,
-    disabled = _ref7$disabled === void 0 ? false : _ref7$disabled,
-    headerHeight = _ref7.headerHeight,
-    headerPadding = _ref7.headerPadding,
-    activeTab = _ref7.activeTab,
-    border = _ref7.border;
+var Tabs = function Tabs(_ref8) {
+  var tabItems = _ref8.tabItems,
+    _ref8$disabled = _ref8.disabled,
+    disabled = _ref8$disabled === void 0 ? false : _ref8$disabled,
+    headerHeight = _ref8.headerHeight,
+    headerPadding = _ref8.headerPadding,
+    activeTab = _ref8.activeTab,
+    border = _ref8.border;
   return React__default.createElement(Container$5, {
     "$border": border
   }, React__default.createElement(FirstContainer, {
@@ -6153,11 +6156,13 @@ exports.ButtonCarousel = ButtonCarousel;
 exports.CircularLoader = CircularLoader;
 exports.Container = Container;
 exports.DatePicker = DatePicker;
+exports.DropdownMenu = DropdownMenu$1;
 exports.Icon = Icon;
 exports.InternalTabs = InternalTabs;
 exports.Loader = Loader;
 exports.MultiSelectDropdown = MultiSelectDropdown;
 exports.OptionComponent = OptionComponent;
+exports.Options = Options;
 exports.Pagination = Pagination;
 exports.ProgressBar = ProgressBar;
 exports.SearchBox = SearchBox;
@@ -6168,7 +6173,7 @@ exports.Span = Span;
 exports.Table = Table;
 exports.TableCell = TableCell;
 exports.TableRow = TableRow;
-exports.Tabs = Tab;
+exports.Tabs = Tabs;
 exports.TextArea = TextArea;
 exports.TextField = InputField;
 exports.TextFieldWithDropdown = TextFieldWithDropdown;
@@ -6187,4 +6192,5 @@ exports.timeAgo = timeAgo;
 exports.timeStringToSeconds = timeStringToSeconds;
 exports.useClickOutside = useClickOutside;
 exports.useCustomModal = useCustomModal;
+exports.useNotification = useNotification;
 //# sourceMappingURL=index.js.map