labsense-ui-kit 1.1.22 → 1.1.24

package/dist/index.d.ts

@@ -14,7 +14,7 @@ import { ProgressBar } from './ProgressBar';
 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 { darkColorVariables, themes } from './Themes/Colors';
 import { convertToEpoch, formatDate, formatTimestamp, formatCalendarDateTime, timeAgo, formatEpochToIST, convertEpochToDateString, convertEpochToOnlyDate, getSystemTimezoneAbbreviation, timeStringToSeconds } from './Utils/Date&Time';
 export { Badge };
 export { Breadcrumbs, BreadcrumbDetail };
@@ -32,5 +32,7 @@ export { ProgressBar };
 export { Sidebar, logoDetails, SidebarItems };
 export { TableCell, Table, TableRow, TableProps };
 export { InternalTabs, Tabs, TabContentProps };
-export { colorVariables, darkColorVariables, themes };
+export { darkColorVariables, themes };
 export { convertToEpoch, formatDate, formatTimestamp, formatCalendarDateTime, timeAgo, formatEpochToIST, convertEpochToDateString, convertEpochToOnlyDate, getSystemTimezoneAbbreviation, timeStringToSeconds };
+export { injectCSSVariables } from './Themes/injectColors';
+export { colorVariables } from './Themes/rawColor';

package/dist/index.js

@@ -6465,6 +6465,104 @@ var InternalTabs = function InternalTabs(_ref) {
   }));
 };
 
+var injectCSSVariables = function injectCSSVariables(theme) {
+  var themeVars = theme === 'dark' ? darkColorVariables : colorVariables;
+  var flatVars = _flattenVariables(themeVars);
+  var root = document.body;
+  for (var _i = 0, _Object$entries = Object.entries(flatVars); _i < _Object$entries.length; _i++) {
+    var _Object$entries$_i = _Object$entries[_i],
+      key = _Object$entries$_i[0],
+      value = _Object$entries$_i[1];
+    root.style.setProperty("--" + key, value);
+  }
+};
+var _flattenVariables = function flattenVariables(obj, prefix) {
+  if (prefix === void 0) {
+    prefix = '';
+  }
+  var result = {};
+  for (var key in obj) {
+    if (!Object.prototype.hasOwnProperty.call(obj, key)) continue;
+    var value = obj[key];
+    var fullKey = prefix ? prefix + "-" + key : key;
+    if (typeof value === 'object') {
+      var nested = _flattenVariables(value, fullKey);
+      Object.assign(result, nested);
+    } else {
+      result[fullKey] = value;
+    }
+  }
+  return result;
+};
+
+var colorVariables$1 = {
+  brand: {
+    primary: 'var(--brand-primary)',
+    secondary: 'var(--brand-secondary)',
+    light: 'var(--brand-light)'
+  },
+  accent: {
+    light: 'var(--accent-light)',
+    extraLight: 'var(--accent-extraLight)',
+    softBlue: 'var(--accent-softBlue)',
+    extraSoftBlue: 'var(--accent-extraSoftBlue)',
+    boldTransparent: 'var(--accent-boldTransparent)',
+    transparent: 'var(--accent-transparent)',
+    lightTransparent: 'var(--accent-lightTransparent)'
+  },
+  "default": {
+    primary: 'var(--default-primary)',
+    secondary: 'var(--default-secondary)',
+    tertiary: 'var(--default-tertiary)',
+    error: 'var(--default-error)',
+    success: 'var(--default-success)',
+    warning: 'var(--default-warning)',
+    info: 'var(--default-info)'
+  },
+  disabled: {
+    primary: 'var(--disabled-primary)',
+    secondary: 'var(--disabled-secondary)',
+    error: 'var(--disabled-error)',
+    success: 'var(--disabled-success)',
+    warning: 'var(--disabled-warning)',
+    info: 'var(--disabled-info)'
+  },
+  hover: {
+    primary: 'var(--hover-primary)',
+    secondary: 'var(--hover-secondary)',
+    tertiary: 'var(--hover-tertiary)',
+    error: 'var(--hover-error)',
+    success: 'var(--hover-success)',
+    warning: 'var(--hover-warning)',
+    info: 'var(--hover-info)'
+  },
+  border: {
+    extraBold: 'var(--border-extraBold)',
+    bold: 'var(--border-bold)',
+    medium: 'var(--border-medium)',
+    light: 'var(--border-light)',
+    extraLight: 'var(--border-extraLight)'
+  },
+  text: {
+    dark: 'var(--text-dark)',
+    medium: 'var(--text-medium)',
+    light: 'var(--text-light)',
+    white: 'var(--text-white)',
+    success: 'var(--text-success)',
+    error: 'var(--text-error)',
+    info: 'var(--text-info)',
+    warning: 'var(--text-warning)'
+  },
+  badge: {
+    lavender: 'var(--badge-lavender)',
+    papayaWhip: 'var(--badge-papayaWhip)',
+    water: 'var(--badge-water)',
+    paleBlue: 'var(--badge-paleBlue)',
+    teaGreen: 'var(--badge-teaGreen)',
+    lightBlue: 'var(--badge-lightBlue)'
+  }
+};
+
 exports.Badge = Badge;
 exports.Breadcrumbs = Breadcrumbs;
 exports.Button = ButtonComponent;
@@ -6494,7 +6592,7 @@ exports.Tabs = Tabs;
 exports.TextArea = TextArea;
 exports.TextField = TextField;
 exports.TextFieldWithDropdown = TextFieldWithDropdown;
-exports.colorVariables = colorVariables;
+exports.colorVariables = colorVariables$1;
 exports.convertEpochToDateString = convertEpochToDateString;
 exports.convertEpochToOnlyDate = convertEpochToOnlyDate;
 exports.convertToEpoch = convertToEpoch;
@@ -6504,6 +6602,7 @@ exports.formatDate = formatDate;
 exports.formatEpochToIST = formatEpochToIST;
 exports.formatTimestamp = formatTimestamp;
 exports.getSystemTimezoneAbbreviation = getSystemTimezoneAbbreviation;
+exports.injectCSSVariables = injectCSSVariables;
 exports.themes = themes;
 exports.timeAgo = timeAgo;
 exports.timeStringToSeconds = timeStringToSeconds;