@sme.up/ketchup 9.6.3 → 9.6.5

package/dist/components/kup-manager.js

@@ -1,5 +1,6 @@
-import { g as getDefaultExportFromCjs, K as KupDatesFormats, a as KupDatesNormalize, c as commonjsGlobal, b as KupDates, d as KupDatesLocales } from './kup-dates.js';
+import { g as getDefaultExportFromCjs, c as commonjsGlobal } from './_commonjsHelpers.js';
 import { getAssetPath, setAssetPath } from '@stencil/core/internal/client';
+import { K as KupDatesFormats, a as KupDatesNormalize, b as KupDates, c as KupDatesLocales } from './kup-dates.js';
 
 /**
  * Props of the kup-card component.
@@ -3533,7 +3534,7 @@ const octane = {
 		"--kup-primary-color-70": "#006574",
 		"--kup-primary-color-80": "#005160",
 		"--kup-primary-color-90": "#02292f",
-		"--kup-secondary-color-2": "#003C49",
+		"--kup-secondary-color": "#003C49",
 		"--kup-gray-color-0": "#ffffff",
 		"--kup-gray-color-10": "#F4F4F4",
 		"--kup-gray-color-20": "#E0E0E0",
@@ -3544,7 +3545,6 @@ const octane = {
 		"--kup-gray-color-70": "#525252",
 		"--kup-gray-color-80": "#393939",
 		"--kup-gray-color-90": "#262626",
-		"--kup-gray-color-100": "#161616",
 		"--kup-danger-color-50": "#fa4d56",
 		"--kup-danger-color-60": "#da1e28",
 		"--kup-danger-color-70": "#ba1b23",
@@ -3554,18 +3554,16 @@ const octane = {
 		"--kup-info-color-50": "#4589ff",
 		"--kup-info-color-70": "#0043ce",
 		"--kup-warning-color-40": "#f1c21b",
-		"--kup-secondary-color": "#f4a22e",
 		"--kup-background-color": "#ffffff",
-		"--kup-navbar-background-color": "#068a9c",
-		"--kup-navbar-color": "#ffffff",
-		"--kup-drawer-background-color": "#ffffff",
+		"--kup-navbar-background-color": "#161616",
+		"--kup-drawer-background-color": "#f4f4f4",
 		"--kup-drawer-color": "#535353",
 		"--kup-navbar-height": "64px",
 		"--kup-drawer-width": "300px",
 		"--kup-font-family": "IBM Plex Sans, sans-serif",
-		"--kup-font-family-monospace": "IBM Plex Sans, sans-serif",
+		"--kup-font-family-monospace": "IBM Plex Mono, monospace",
 		"--kup-font-size": "14px",
-		"--kup-text-color": "#474747",
+		"--kup-text-color": "#525252",
 		"--kup-text-on-primary-color": "#e8e8e8",
 		"--kup-text-on-secondary-color": "#312c2c",
 		"--kup-disabled-background-color": "#d1d1d1",
@@ -3574,13 +3572,9 @@ const octane = {
 		"--kup-hover-color": "#303030",
 		"--kup-title-background-color": "#068a9c",
 		"--kup-title-color": "#fff",
-		"--kup-icon-color": "#e8e8e8",
+		"--kup-icon-color": "#636363",
 		"--kup-border-color": "#d8d8d8",
 		"--kup-box-shadow": "0px 0px 7.5px 0px rgba(128, 128, 128, 0.5)",
-		"--kup-info-color": "#2592df",
-		"--kup-success-color": "#a4ba4c",
-		"--kup-warning-color": "#de8906",
-		"--kup-danger-color": "#a6192e",
 		"--kup-spinner-color": "#fddc69",
 		"--kup-chart-color-1": "#60c3fc",
 		"--kup-chart-color-2": "#e268d8",
@@ -3605,6 +3599,7 @@ const octane = {
 		"--kup-space-12": "96px",
 		"--kup-space-13": "160px",
 		"--kup-radius-00": "0px",
+		"--kup-radius-01": "2px",
 		"--kup-radius-100": "100px"
 	},
 	icons: {
@@ -3625,10 +3620,22 @@ const octane = {
 	customStyles: {
 	}
 };
-const bubbles = {
+const octaneGrey = {
 	cssVariables: {
-		"--kup-gray-color-0": "#ffffff",
-		"--kup-gray-color-10": "#F4F4F4",
+		"--kup-primary-color": "#068a9c",
+		"--kup-primary-color-0": "#ffffff",
+		"--kup-primary-color-10": "#A5E6F0",
+		"--kup-primary-color-20": "#83CBD8",
+		"--kup-primary-color-30": "#5CB0C0",
+		"--kup-primary-color-40": "#3E9EAF",
+		"--kup-primary-color-50": "#068A9C",
+		"--kup-primary-color-60": "#007A8B",
+		"--kup-primary-color-70": "#006574",
+		"--kup-primary-color-80": "#005160",
+		"--kup-primary-color-90": "#02292f",
+		"--kup-secondary-color": "#003C49",
+		"--kup-gray-color-0": "#F4F4F4",
+		"--kup-gray-color-10": "#ffffff",
 		"--kup-gray-color-20": "#E0E0E0",
 		"--kup-gray-color-30": "#C6C6C6",
 		"--kup-gray-color-40": "#A8A8A8",
@@ -3637,18 +3644,333 @@ const bubbles = {
 		"--kup-gray-color-70": "#525252",
 		"--kup-gray-color-80": "#393939",
 		"--kup-gray-color-90": "#262626",
-		"--kup-gray-color-100": "#161616",
+		"--kup-info-color-50": "#4589ff",
+		"--kup-info-color-70": "#0043ce",
+		"--kup-warning-color-40": "#f1c21b",
+		"--kup-accent-red-color": "#A6192E",
+		"--kup-accent-orange-color": "#DE8906",
+		"--kup-accent-yellow-color": "#FDDC69",
+		"--kup-accent-green-color": "#A4BA4C",
+		"--kup-accent-white-color": "#FFFFFF",
+		"--kup-background-color": "#F4F4F4",
+		"--kup-navbar-background-color": "#161616",
+		"--kup-drawer-background-color": "#ffffff",
+		"--kup-drawer-color": "#535353",
+		"--kup-navbar-height": "64px",
+		"--kup-drawer-width": "300px",
+		"--kup-font-family": "IBM Plex Sans, sans-serif",
+		"--kup-font-family-monospace": "IBM Plex Mono, monospace",
+		"--kup-font-size": "14px",
+		"--kup-text-color": "#292929",
+		"--kup-text-on-primary-color": "#e8e8e8",
+		"--kup-text-on-secondary-color": "#312c2c",
+		"--kup-disabled-background-color": "#d1d1d1",
+		"--kup-disabled-color": "#636363",
+		"--kup-hover-background-color": "#e8e8e8",
+		"--kup-hover-color": "#303030",
+		"--kup-title-background-color": "#068a9c",
+		"--kup-title-color": "#fff",
+		"--kup-icon-color": "#636363",
+		"--kup-border-color": "#d8d8d8",
+		"--kup-box-shadow": "0px 0px 7.5px 0px rgba(128, 128, 128, 0.5)",
+		"--kup-info-color": "#2592df",
+		"--kup-success-color-40": "#42be65",
+		"--kup-success-color-60": "#198038",
+		"--kup-rating-color": "#ffa000",
+		"--kup-warning-color": "#de8906",
+		"--kup-danger-color-50": "#fa4d56",
+		"--kup-danger-color-60": "#da1e28",
+		"--kup-danger-color-70": "#ba1b23",
+		"--kup-danger-color-80": "#750e13",
+		"--kup-spinner-color": "#fddc69",
+		"--kup-chart-color-1": "#60c3fc",
+		"--kup-chart-color-2": "#e268d8",
+		"--kup-chart-color-3": "#860bb5",
+		"--kup-chart-color-4": "#1a83e4",
+		"--kup-obj-cursor": "inherit",
+		"--kup-card-zindex": "900",
+		"--kup-drawer-zindex": "900",
+		"--kup-navbar-zindex": "900",
+		"--kup-space-00": "0px",
+		"--kup-space-01": "2px",
+		"--kup-space-02": "4px",
+		"--kup-space-03": "8px",
+		"--kup-space-04": "12px",
+		"--kup-space-05": "16px",
+		"--kup-space-06": "24px",
+		"--kup-space-07": "32px",
+		"--kup-space-08": "40px",
+		"--kup-space-09": "48px",
+		"--kup-space-10": "64px",
+		"--kup-space-11": "80px",
+		"--kup-space-12": "96px",
+		"--kup-space-13": "160px",
+		"--kup-radius-00": "0px",
+		"--kup-radius-01": "2px",
+		"--kup-radius-100": "100px"
+	},
+	icons: {
+		"--kup-ascending-icon": "arrow_drop_up",
+		"--kup-descending-icon": "arrow_drop_down",
+		"--kup-expanded-icon": "arrow_drop_down",
+		"--kup-collapsed-icon": "menu-right",
+		"--kup-dropdown-icon": "arrow_drop_down",
+		"--kup-clear-icon": "cancel",
+		"--kup-filter-remove-icon": "filter-remove",
+		"--kup-key-icon": "key-variant",
+		"--kup-search-icon": "search"
+	},
+	imports: [
+		"url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700')",
+		"url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700')"
+	],
+	customStyles: {
+	}
+};
+const darkOctane = {
+	cssVariables: {
+		"--kup-primary-color": "#068a9c",
+		"--kup-primary-color-0": "#ffffff",
+		"--kup-primary-color-10": "#A5E6F0",
+		"--kup-primary-color-20": "#83CBD8",
+		"--kup-primary-color-30": "#5CB0C0",
+		"--kup-primary-color-40": "#3E9EAF",
+		"--kup-primary-color-50": "#068A9C",
+		"--kup-primary-color-60": "#007A8B",
+		"--kup-primary-color-70": "#006574",
+		"--kup-primary-color-80": "#005160",
+		"--kup-primary-color-90": "#02292f",
+		"--kup-secondary-color": "#003C49",
+		"--kup-gray-color-0": "#161616",
+		"--kup-gray-color-10": "#262626",
+		"--kup-gray-color-20": "#393939",
+		"--kup-gray-color-30": "#525252",
+		"--kup-gray-color-40": "#6f6f6f",
+		"--kup-gray-color-50": "#8d8d8d",
+		"--kup-gray-color-60": "#A8A8A8",
+		"--kup-gray-color-70": "#C6C6C6",
+		"--kup-gray-color-80": "#E0E0E0",
+		"--kup-gray-color-90": "#f4f4f4",
+		"--kup-accent-red-color": "#A6192E",
+		"--kup-accent-orange-color": "#DE8906",
+		"--kup-accent-yellow-color": "#FDDC69",
+		"--kup-accent-green-color": "#A4BA4C",
+		"--kup-accent-white-color": "#FFFFFF",
+		"--kup-background-color": "#161616",
+		"--kup-navbar-background-color": "#161616",
+		"--kup-drawer-background-color": "#ffffff",
+		"--kup-drawer-color": "#535353",
+		"--kup-navbar-height": "64px",
+		"--kup-drawer-width": "300px",
+		"--kup-font-family": "IBM Plex Sans, sans-serif",
+		"--kup-font-family-monospace": "IBM Plex Mono, monospace",
+		"--kup-font-size": "14px",
+		"--kup-text-color": "#e8e8e8",
+		"--kup-text-on-primary-color": "#e8e8e8",
+		"--kup-text-on-secondary-color": "#312c2c",
+		"--kup-disabled-background-color": "#d1d1d1",
+		"--kup-disabled-color": "#636363",
+		"--kup-hover-background-color": "#e8e8e8",
+		"--kup-hover-color": "#303030",
+		"--kup-title-background-color": "#068a9c",
+		"--kup-title-color": "#fff",
+		"--kup-icon-color": "#636363",
+		"--kup-border-color": "#d8d8d8",
+		"--kup-box-shadow": "0px 0px 7.5px 0px rgba(128, 128, 128, 0.5)",
+		"--kup-info-color": "#2592df",
+		"--kup-success-color-60": "#42be65",
+		"--kup-success-color-40": "#198038",
+		"--kup-rating-color": "#ffa000",
+		"--kup-warning-color": "#de8906",
+		"--kup-danger-color-50": "#fa4d56",
+		"--kup-danger-color-60": "#da1e28",
+		"--kup-danger-color-70": "#ba1b23",
+		"--kup-danger-color-80": "#750e13",
+		"--kup-info-color-50": "#4589ff",
+		"--kup-info-color-70": "#0043ce",
+		"--kup-warning-color-40": "#f1c21b",
+		"--kup-spinner-color": "#fddc69",
+		"--kup-chart-color-1": "#60c3fc",
+		"--kup-chart-color-2": "#e268d8",
+		"--kup-chart-color-3": "#860bb5",
+		"--kup-chart-color-4": "#1a83e4",
+		"--kup-obj-cursor": "inherit",
+		"--kup-card-zindex": "900",
+		"--kup-drawer-zindex": "900",
+		"--kup-navbar-zindex": "900",
+		"--kup-space-00": "0px",
+		"--kup-space-01": "2px",
+		"--kup-space-02": "4px",
+		"--kup-space-03": "8px",
+		"--kup-space-04": "12px",
+		"--kup-space-05": "16px",
+		"--kup-space-06": "24px",
+		"--kup-space-07": "32px",
+		"--kup-space-08": "40px",
+		"--kup-space-09": "48px",
+		"--kup-space-10": "64px",
+		"--kup-space-11": "80px",
+		"--kup-space-12": "96px",
+		"--kup-space-13": "160px",
+		"--kup-radius-00": "0px",
+		"--kup-radius-01": "2px",
+		"--kup-radius-100": "100px"
+	},
+	icons: {
+		"--kup-ascending-icon": "arrow_drop_up",
+		"--kup-descending-icon": "arrow_drop_down",
+		"--kup-expanded-icon": "arrow_drop_down",
+		"--kup-collapsed-icon": "menu-right",
+		"--kup-dropdown-icon": "arrow_drop_down",
+		"--kup-clear-icon": "cancel",
+		"--kup-filter-remove-icon": "filter-remove",
+		"--kup-key-icon": "key-variant",
+		"--kup-search-icon": "search"
+	},
+	imports: [
+		"url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700')",
+		"url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700')"
+	],
+	customStyles: {
+	}
+};
+const darkOctaneGray = {
+	cssVariables: {
+		"--kup-primary-color": "#068a9c",
+		"--kup-primary-color-0": "#ffffff",
+		"--kup-primary-color-10": "#A5E6F0",
+		"--kup-primary-color-20": "#83CBD8",
+		"--kup-primary-color-30": "#5CB0C0",
+		"--kup-primary-color-40": "#3E9EAF",
+		"--kup-primary-color-50": "#068A9C",
+		"--kup-primary-color-60": "#007A8B",
+		"--kup-primary-color-70": "#006574",
+		"--kup-primary-color-80": "#005160",
+		"--kup-primary-color-90": "#02292f",
+		"--kup-secondary-color": "#003C49",
+		"--kup-gray-color-0": "#262626",
+		"--kup-gray-color-10": "#393939",
+		"--kup-gray-color-20": "#525252",
+		"--kup-gray-color-30": "#6f6f6f",
+		"--kup-gray-color-40": "#8d8d8d",
+		"--kup-gray-color-50": "#A8A8A8",
+		"--kup-gray-color-60": "#C6C6C6",
+		"--kup-gray-color-70": "#E0E0E0",
+		"--kup-gray-color-80": "#f4f4f4",
+		"--kup-gray-color-90": "#ffffff",
+		"--kup-accent-red-color": "#da1e28",
+		"--kup-accent-orange-color": "#DE8906",
+		"--kup-accent-yellow-color": "#FDDC69",
+		"--kup-accent-green-color": "#A4BA4C",
+		"--kup-accent-white-color": "#FFFFFF",
+		"--kup-background-color": "#262626",
+		"--kup-navbar-background-color": "#161616",
+		"--kup-drawer-background-color": "#161616",
+		"--kup-drawer-color": "#535353",
+		"--kup-navbar-height": "64px",
+		"--kup-drawer-width": "300px",
+		"--kup-font-family": "IBM Plex Sans, sans-serif",
+		"--kup-font-family-monospace": "IBM Plex Mono, monospace",
+		"--kup-font-size": "14px",
+		"--kup-text-color": "#e8e8e8",
+		"--kup-text-on-primary-color": "#e8e8e8",
+		"--kup-text-on-secondary-color": "#312c2c",
+		"--kup-disabled-background-color": "#d1d1d1",
+		"--kup-disabled-color": "#636363",
+		"--kup-hover-background-color": "#e8e8e8",
+		"--kup-hover-color": "#303030",
+		"--kup-title-background-color": "#068a9c",
+		"--kup-title-color": "#fff",
+		"--kup-icon-color": "#636363",
+		"--kup-border-color": "#d8d8d8",
+		"--kup-box-shadow": "0px 0px 7.5px 0px rgba(128, 128, 128, 0.5)",
+		"--kup-info-color": "#2592df",
+		"--kup-success-color-60": "#42be65",
+		"--kup-success-color-40": "#198038",
+		"--kup-rating-color": "#ffa000",
+		"--kup-warning-color": "#de8906",
 		"--kup-danger-color-50": "#fa4d56",
 		"--kup-danger-color-60": "#da1e28",
 		"--kup-danger-color-70": "#ba1b23",
 		"--kup-danger-color-80": "#750e13",
-		"--kup-success-color-40": "#42be65",
-		"--kup-success-color-60": "#198038",
 		"--kup-info-color-50": "#4589ff",
 		"--kup-info-color-70": "#0043ce",
 		"--kup-warning-color-40": "#f1c21b",
+		"--kup-spinner-color": "#fddc69",
+		"--kup-chart-color-1": "#60c3fc",
+		"--kup-chart-color-2": "#e268d8",
+		"--kup-chart-color-3": "#860bb5",
+		"--kup-chart-color-4": "#1a83e4",
+		"--kup-obj-cursor": "inherit",
+		"--kup-card-zindex": "900",
+		"--kup-drawer-zindex": "900",
+		"--kup-navbar-zindex": "900",
+		"--kup-space-00": "0px",
+		"--kup-space-01": "2px",
+		"--kup-space-02": "4px",
+		"--kup-space-03": "8px",
+		"--kup-space-04": "12px",
+		"--kup-space-05": "16px",
+		"--kup-space-06": "24px",
+		"--kup-space-07": "32px",
+		"--kup-space-08": "40px",
+		"--kup-space-09": "48px",
+		"--kup-space-10": "64px",
+		"--kup-space-11": "80px",
+		"--kup-space-12": "96px",
+		"--kup-space-13": "160px",
+		"--kup-radius-00": "0px",
+		"--kup-radius-01": "2px",
+		"--kup-radius-100": "100px"
+	},
+	icons: {
+		"--kup-ascending-icon": "arrow_drop_up",
+		"--kup-descending-icon": "arrow_drop_down",
+		"--kup-expanded-icon": "arrow_drop_down",
+		"--kup-collapsed-icon": "menu-right",
+		"--kup-dropdown-icon": "arrow_drop_down",
+		"--kup-clear-icon": "cancel",
+		"--kup-filter-remove-icon": "filter-remove",
+		"--kup-key-icon": "key-variant",
+		"--kup-search-icon": "search"
+	},
+	imports: [
+		"url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700')",
+		"url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700')"
+	],
+	customStyles: {
+	}
+};
+const bubbles = {
+	cssVariables: {
 		"--kup-primary-color": "#c18f00",
+		"--kup-primary-color-0": "#ffffff",
+		"--kup-primary-color-5": "#e0c780",
+		"--kup-primary-color-10": "#dabc66",
+		"--kup-primary-color-20": "#d4b14d",
+		"--kup-primary-color-30": "#cda533",
+		"--kup-primary-color-40": "#c79a1a",
+		"--kup-primary-color-50": "#c18f00",
+		"--kup-primary-color-60": "#9a7200",
+		"--kup-primary-color-70": "#876400",
+		"--kup-primary-color-80": "#614800",
+		"--kup-primary-color-90": "#3a2b00",
 		"--kup-secondary-color": "#1d1d1d",
+		"--kup-gray-color-0": "#ffffff",
+		"--kup-gray-color-10": "#F4F4F4",
+		"--kup-gray-color-20": "#E0E0E0",
+		"--kup-gray-color-30": "#C6C6C6",
+		"--kup-gray-color-40": "#A8A8A8",
+		"--kup-gray-color-50": "#8d8d8d",
+		"--kup-gray-color-60": "#6f6f6f",
+		"--kup-gray-color-70": "#525252",
+		"--kup-gray-color-80": "#393939",
+		"--kup-gray-color-90": "#262626",
+		"--kup-accent-red-color": "#A6192E",
+		"--kup-accent-orange-color": "#DE8906",
+		"--kup-accent-yellow-color": "#FDDC69",
+		"--kup-accent-green-color": "#A4BA4C",
+		"--kup-accent-white-color": "#FFFFFF",
 		"--kup-background-color": "#ffffff",
 		"--kup-navbar-background-color": "#beb08d",
 		"--kup-navbar-color": "#ffffff",
@@ -3668,13 +3990,19 @@ const bubbles = {
 		"--kup-hover-color": "#545454",
 		"--kup-title-background-color": "#f1f3f4",
 		"--kup-title-color": "#2e2e2e",
-		"--kup-icon-color": "#505050",
+		"--kup-icon-color": "#636363",
 		"--kup-border-color": "#e0e0e0",
 		"--kup-box-shadow": "rgba(0, 0, 0, 0.2) 0px 5px 5px -3px, rgba(0, 0, 0, 0.14) 0px 8px 10px 1px, rgba(0, 0, 0, 0.12) 0px 3px 14px 2px",
 		"--kup-info-color": "#2592df",
 		"--kup-success-color": "#4d9f02",
 		"--kup-warning-color": "#ffc107",
-		"--kup-danger-color": "#d91e18",
+		"--kup-danger-color-50": "#fa4d56",
+		"--kup-danger-color-60": "#da1e28",
+		"--kup-danger-color-70": "#ba1b23",
+		"--kup-danger-color-80": "#750e13",
+		"--kup-info-color-50": "#4589ff",
+		"--kup-info-color-70": "#0043ce",
+		"--kup-warning-color-40": "#f1c21b",
 		"--kup-spinner-color": "#1D1D1B",
 		"--kup-chart-color-1": "#ff5959",
 		"--kup-chart-color-2": "#e0a0a0",
@@ -3699,6 +4027,7 @@ const bubbles = {
 		"--kup-space-12": "96px",
 		"--kup-space-13": "160px",
 		"--kup-radius-00": "0px",
+		"--kup-radius-01": "2px",
 		"--kup-radius-100": "100px"
 	},
 	icons: {
@@ -3720,6 +4049,19 @@ const bubbles = {
 };
 const cobalt = {
 	cssVariables: {
+		"--kup-primary-color": "#248aff",
+		"--kup-primary-color-0": "#ffffff",
+		"--kup-primary-color-5": "#92c5ff",
+		"--kup-primary-color-10": "#7cb9ff",
+		"--kup-primary-color-20": "#66adff",
+		"--kup-primary-color-30": "#50a1ff",
+		"--kup-primary-color-40": "#3a96ff",
+		"--kup-primary-color-50": "#248aff",
+		"--kup-primary-color-60": "#1d6ecc",
+		"--kup-primary-color-70": "#1961b3",
+		"--kup-primary-color-80": "#124580",
+		"--kup-primary-color-90": "#0b294c",
+		"--kup-secondary-color": "#65cbe9",
 		"--kup-gray-color-0": "#161616",
 		"--kup-gray-color-10": "#262626",
 		"--kup-gray-color-20": "#393939",
@@ -3730,18 +4072,15 @@ const cobalt = {
 		"--kup-gray-color-70": "#C6C6C6",
 		"--kup-gray-color-80": "#E0E0E0",
 		"--kup-gray-color-90": "#f4f4f4",
-		"--kup-gray-color-100": "#ffffff",
 		"--kup-danger-color-50": "#fa4d56",
 		"--kup-danger-color-60": "#da1e28",
 		"--kup-danger-color-70": "#ba1b23",
 		"--kup-danger-color-80": "#750e13",
-		"--kup-success-color-40": "#42be65",
-		"--kup-success-color-60": "#198038",
-		"--kup-info-color-50": "#4589ff",
-		"--kup-info-color-70": "#0043ce",
-		"--kup-warning-color-40": "#f1c21b",
-		"--kup-primary-color": "#248aff",
-		"--kup-secondary-color": "#65cbe9",
+		"--kup-accent-red-color": "#A6192E",
+		"--kup-accent-orange-color": "#DE8906",
+		"--kup-accent-yellow-color": "#FDDC69",
+		"--kup-accent-green-color": "#A4BA4C",
+		"--kup-accent-white-color": "#FFFFFF",
 		"--kup-background-color": "#222222",
 		"--kup-navbar-background-color": "#131313",
 		"--kup-navbar-color": "#65cbe9",
@@ -3761,13 +4100,16 @@ const cobalt = {
 		"--kup-hover-color": "#96e7ff",
 		"--kup-title-background-color": "#2e2e2e",
 		"--kup-title-color": "#f5f5f5",
-		"--kup-icon-color": "#65cbe9",
+		"--kup-icon-color": "#636363",
 		"--kup-border-color": "#535353",
 		"--kup-box-shadow": "0px 0px 7.5px 0px rgba(128, 128, 128, 0.5)",
 		"--kup-info-color": "#2592df",
 		"--kup-success-color": "#4d9f02",
 		"--kup-warning-color": "#ffc107",
 		"--kup-danger-color": "#d91e18",
+		"--kup-info-color-50": "#4589ff",
+		"--kup-info-color-70": "#0043ce",
+		"--kup-warning-color-40": "#f1c21b",
 		"--kup-spinner-color": "#a4d9f7",
 		"--kup-chart-color-1": "#308aff",
 		"--kup-chart-color-2": "#5eb6d1",
@@ -3792,6 +4134,7 @@ const cobalt = {
 		"--kup-space-12": "96px",
 		"--kup-space-13": "160px",
 		"--kup-radius-00": "0px",
+		"--kup-radius-01": "2px",
 		"--kup-radius-100": "100px"
 	},
 	icons: {
@@ -3811,6 +4154,19 @@ const cobalt = {
 };
 const dark = {
 	cssVariables: {
+		"--kup-primary-color": "#82f0e2",
+		"--kup-primary-color-0": "#ffffff",
+		"--kup-primary-color-5": "#dafbf6",
+		"--kup-primary-color-10": "#cdf9f3",
+		"--kup-primary-color-20": "#c1f8f1",
+		"--kup-primary-color-30": "#b4f6ee",
+		"--kup-primary-color-40": "#9bf3e8",
+		"--kup-primary-color-50": "#82f0e2",
+		"--kup-primary-color-60": "#68c0b5",
+		"--kup-primary-color-70": "#5ba89e",
+		"--kup-primary-color-80": "#417871",
+		"--kup-primary-color-90": "#274844",
+		"--kup-secondary-color": "#f9ff00",
 		"--kup-gray-color-0": "#161616",
 		"--kup-gray-color-10": "#262626",
 		"--kup-gray-color-20": "#393939",
@@ -3821,18 +4177,18 @@ const dark = {
 		"--kup-gray-color-70": "#C6C6C6",
 		"--kup-gray-color-80": "#E0E0E0",
 		"--kup-gray-color-90": "#f4f4f4",
-		"--kup-gray-color-100": "#ffffff",
 		"--kup-danger-color-50": "#fa4d56",
 		"--kup-danger-color-60": "#da1e28",
 		"--kup-danger-color-70": "#ba1b23",
 		"--kup-danger-color-80": "#750e13",
-		"--kup-success-color-40": "#42be65",
-		"--kup-success-color-60": "#198038",
 		"--kup-info-color-50": "#4589ff",
 		"--kup-info-color-70": "#0043ce",
 		"--kup-warning-color-40": "#f1c21b",
-		"--kup-primary-color": "#82f0e2",
-		"--kup-secondary-color": "#f9ff00",
+		"--kup-accent-red-color": "#A6192E",
+		"--kup-accent-orange-color": "#DE8906",
+		"--kup-accent-yellow-color": "#FDDC69",
+		"--kup-accent-green-color": "#A4BA4C",
+		"--kup-accent-white-color": "#FFFFFF",
 		"--kup-background-color": "#2d2d2d",
 		"--kup-navbar-background-color": "#2d2d2d",
 		"--kup-navbar-color": "#ffffff",
@@ -3852,7 +4208,7 @@ const dark = {
 		"--kup-hover-color": "#dddddd",
 		"--kup-title-background-color": "#111111",
 		"--kup-title-color": "#f5f5f5",
-		"--kup-icon-color": "#e0e0e0",
+		"--kup-icon-color": "#636363",
 		"--kup-border-color": "#535353",
 		"--kup-box-shadow": "0px 0px 7.5px 0px rgba(128, 128, 128, 0.5)",
 		"--kup-info-color": "#2592df",
@@ -3883,6 +4239,7 @@ const dark = {
 		"--kup-space-12": "96px",
 		"--kup-space-13": "160px",
 		"--kup-radius-00": "0px",
+		"--kup-radius-01": "2px",
 		"--kup-radius-100": "100px"
 	},
 	icons: {
@@ -3902,6 +4259,19 @@ const dark = {
 };
 const flamingo = {
 	cssVariables: {
+		"--kup-primary-color": "#e88aab",
+		"--kup-primary-color-0": "#ffffff",
+		"--kup-primary-color-5": "#f8dce6",
+		"--kup-primary-color-10": "#f4c5d5",
+		"--kup-primary-color-20": "#f1b9cd",
+		"--kup-primary-color-30": "#efadc4",
+		"--kup-primary-color-40": "#eda1bc",
+		"--kup-primary-color-50": "#e88aab",
+		"--kup-primary-color-60": "#ba6e89",
+		"--kup-primary-color-70": "#a26178",
+		"--kup-primary-color-80": "#744556",
+		"--kup-primary-color-90": "#462933",
+		"--kup-secondary-color": "#7f00e7",
 		"--kup-gray-color-0": "#161616",
 		"--kup-gray-color-10": "#262626",
 		"--kup-gray-color-20": "#393939",
@@ -3912,18 +4282,18 @@ const flamingo = {
 		"--kup-gray-color-70": "#C6C6C6",
 		"--kup-gray-color-80": "#E0E0E0",
 		"--kup-gray-color-90": "#f4f4f4",
-		"--kup-gray-color-100": "#ffffff",
 		"--kup-danger-color-50": "#fa4d56",
 		"--kup-danger-color-60": "#da1e28",
 		"--kup-danger-color-70": "#ba1b23",
 		"--kup-danger-color-80": "#750e13",
-		"--kup-success-color-40": "#42be65",
-		"--kup-success-color-60": "#198038",
 		"--kup-info-color-50": "#4589ff",
 		"--kup-info-color-70": "#0043ce",
 		"--kup-warning-color-40": "#f1c21b",
-		"--kup-primary-color": "#e88aab",
-		"--kup-secondary-color": "#7f00e7",
+		"--kup-accent-red-color": "#A6192E",
+		"--kup-accent-orange-color": "#DE8906",
+		"--kup-accent-yellow-color": "#FDDC69",
+		"--kup-accent-green-color": "#A4BA4C",
+		"--kup-accent-white-color": "#FFFFFF",
 		"--kup-background-color": "#222222",
 		"--kup-navbar-background-color": "#2d2d2d",
 		"--kup-navbar-color": "#ffffff",
@@ -3943,7 +4313,7 @@ const flamingo = {
 		"--kup-hover-color": "#dddddd",
 		"--kup-title-background-color": "#111111",
 		"--kup-title-color": "#f5f5f5",
-		"--kup-icon-color": "#e0e0e0",
+		"--kup-icon-color": "#636363",
 		"--kup-border-color": "#535353",
 		"--kup-box-shadow": "0px 0px 7.5px 0px rgba(128, 128, 128, 0.5)",
 		"--kup-info-color": "#2592df",
@@ -3974,6 +4344,7 @@ const flamingo = {
 		"--kup-space-12": "96px",
 		"--kup-space-13": "160px",
 		"--kup-radius-00": "0px",
+		"--kup-radius-01": "2px",
 		"--kup-radius-100": "100px"
 	},
 	icons: {
@@ -3993,6 +4364,19 @@ const flamingo = {
 };
 const graphite = {
 	cssVariables: {
+		"--kup-primary-color": "#888888",
+		"--kup-primary-color-0": "#ffffff",
+		"--kup-primary-color-5": "#e7e7e7",
+		"--kup-primary-color-10": "#cfcfcf",
+		"--kup-primary-color-20": "#b8b8b8",
+		"--kup-primary-color-30": "#a0a0a0",
+		"--kup-primary-color-40": "#949494",
+		"--kup-primary-color-50": "#888888",
+		"--kup-primary-color-60": "#6d6d6d",
+		"--kup-primary-color-70": "#5f5f5f",
+		"--kup-primary-color-80": "#444444",
+		"--kup-primary-color-90": "#292929",
+		"--kup-secondary-color": "#d91e18",
 		"--kup-gray-color-0": "#ffffff",
 		"--kup-gray-color-10": "#F4F4F4",
 		"--kup-gray-color-20": "#E0E0E0",
@@ -4003,18 +4387,18 @@ const graphite = {
 		"--kup-gray-color-70": "#525252",
 		"--kup-gray-color-80": "#393939",
 		"--kup-gray-color-90": "#262626",
-		"--kup-gray-color-100": "#161616",
 		"--kup-danger-color-50": "#fa4d56",
 		"--kup-danger-color-60": "#da1e28",
 		"--kup-danger-color-70": "#ba1b23",
 		"--kup-danger-color-80": "#750e13",
-		"--kup-success-color-40": "#42be65",
-		"--kup-success-color-60": "#198038",
 		"--kup-info-color-50": "#4589ff",
 		"--kup-info-color-70": "#0043ce",
 		"--kup-warning-color-40": "#f1c21b",
-		"--kup-primary-color": "#888888",
-		"--kup-secondary-color": "#d91e18",
+		"--kup-accent-red-color": "#A6192E",
+		"--kup-accent-orange-color": "#DE8906",
+		"--kup-accent-yellow-color": "#FDDC69",
+		"--kup-accent-green-color": "#A4BA4C",
+		"--kup-accent-white-color": "#FFFFFF",
 		"--kup-background-color": "#ffffff",
 		"--kup-navbar-background-color": "#535353",
 		"--kup-navbar-color": "#ffffff",
@@ -4024,7 +4408,7 @@ const graphite = {
 		"--kup-drawer-width": "300px",
 		"--kup-font-family": "Roboto, sans-serif",
 		"--kup-font-family-monospace": "Roboto Mono, consolas, monospace",
-		"--kup-font-size": "13px",
+		"--kup-font-size": "14px",
 		"--kup-text-color": "#545454",
 		"--kup-text-on-primary-color": "#ffffff",
 		"--kup-text-on-secondary-color": "#ffffff",
@@ -4034,7 +4418,7 @@ const graphite = {
 		"--kup-hover-color": "#545454",
 		"--kup-title-background-color": "#f0f0f0",
 		"--kup-title-color": "#545454",
-		"--kup-icon-color": "#808080",
+		"--kup-icon-color": "#636363",
 		"--kup-border-color": "#e0e0e0",
 		"--kup-box-shadow": "0px 0px 7.5px 0px rgba(128, 128, 128, 0.5)",
 		"--kup-info-color": "#2592df",
@@ -4071,6 +4455,7 @@ const graphite = {
 		"--kup-space-12": "96px",
 		"--kup-space-13": "160px",
 		"--kup-radius-00": "0px",
+		"--kup-radius-01": "2px",
 		"--kup-radius-100": "100px"
 	},
 	customStyles: {
@@ -4090,6 +4475,19 @@ const graphite = {
 };
 const ketchup = {
 	cssVariables: {
+		"--kup-primary-color": "#d64325",
+		"--kup-primary-color-0": "#ffffff",
+		"--kup-primary-color-5": "#e68e7c",
+		"--kup-primary-color-10": "#e68e7c",
+		"--kup-primary-color-20": "#e27b66",
+		"--kup-primary-color-30": "#de6951",
+		"--kup-primary-color-40": "#da563b",
+		"--kup-primary-color-50": "#d64325",
+		"--kup-primary-color-60": "#ab361e",
+		"--kup-primary-color-70": "#962f1a",
+		"--kup-primary-color-80": "#6b2213",
+		"--kup-primary-color-90": "#40140b",
+		"--kup-secondary-color": "#a6192e",
 		"--kup-gray-color-0": "#ffffff",
 		"--kup-gray-color-10": "#F4F4F4",
 		"--kup-gray-color-20": "#E0E0E0",
@@ -4100,18 +4498,18 @@ const ketchup = {
 		"--kup-gray-color-70": "#525252",
 		"--kup-gray-color-80": "#393939",
 		"--kup-gray-color-90": "#262626",
-		"--kup-gray-color-100": "#161616",
 		"--kup-danger-color-50": "#fa4d56",
 		"--kup-danger-color-60": "#da1e28",
 		"--kup-danger-color-70": "#ba1b23",
 		"--kup-danger-color-80": "#750e13",
-		"--kup-success-color-40": "#42be65",
-		"--kup-success-color-60": "#198038",
 		"--kup-info-color-50": "#4589ff",
 		"--kup-info-color-70": "#0043ce",
 		"--kup-warning-color-40": "#f1c21b",
-		"--kup-primary-color": "#d64325",
-		"--kup-secondary-color": "#a6192e",
+		"--kup-accent-red-color": "#A6192E",
+		"--kup-accent-orange-color": "#DE8906",
+		"--kup-accent-yellow-color": "#FDDC69",
+		"--kup-accent-green-color": "#A4BA4C",
+		"--kup-accent-white-color": "#FFFFFF",
 		"--kup-background-color": "#ffffff",
 		"--kup-navbar-background-color": "#2e2e2e",
 		"--kup-navbar-color": "#ffffff",
@@ -4131,7 +4529,7 @@ const ketchup = {
 		"--kup-hover-color": "#545454",
 		"--kup-title-background-color": "#f1f3f4",
 		"--kup-title-color": "#2e2e2e",
-		"--kup-icon-color": "#505050",
+		"--kup-icon-color": "#636363",
 		"--kup-border-color": "#e0e0e0",
 		"--kup-box-shadow": "rgba(0, 0, 0, 0.2) 0px 5px 5px -3px, rgba(0, 0, 0, 0.14) 0px 8px 10px 1px, rgba(0, 0, 0, 0.12) 0px 3px 14px 2px",
 		"--kup-info-color": "#2592df",
@@ -4162,6 +4560,7 @@ const ketchup = {
 		"--kup-space-12": "96px",
 		"--kup-space-13": "160px",
 		"--kup-radius-00": "0px",
+		"--kup-radius-01": "2px",
 		"--kup-radius-100": "100px"
 	},
 	icons: {
@@ -4181,6 +4580,19 @@ const ketchup = {
 };
 const obsidian = {
 	cssVariables: {
+		"--kup-primary-color": "#a6192e",
+		"--kup-primary-color-0": "#ffffff",
+		"--kup-primary-color-5": "#dba3ab",
+		"--kup-primary-color-10": "#ca7582",
+		"--kup-primary-color-20": "#c15e6d",
+		"--kup-primary-color-30": "#b84758",
+		"--kup-primary-color-40": "#af3043",
+		"--kup-primary-color-50": "#a6192e",
+		"--kup-primary-color-60": "#851425",
+		"--kup-primary-color-70": "#741220",
+		"--kup-primary-color-80": "#530d17",
+		"--kup-primary-color-90": "#32070e",
+		"--kup-secondary-color": "#f5f4f4",
 		"--kup-gray-color-0": "#ffffff",
 		"--kup-gray-color-10": "#F4F4F4",
 		"--kup-gray-color-20": "#E0E0E0",
@@ -4191,18 +4603,18 @@ const obsidian = {
 		"--kup-gray-color-70": "#525252",
 		"--kup-gray-color-80": "#393939",
 		"--kup-gray-color-90": "#262626",
-		"--kup-gray-color-100": "#161616",
 		"--kup-danger-color-50": "#fa4d56",
 		"--kup-danger-color-60": "#da1e28",
 		"--kup-danger-color-70": "#ba1b23",
 		"--kup-danger-color-80": "#750e13",
-		"--kup-success-color-40": "#42be65",
-		"--kup-success-color-60": "#198038",
 		"--kup-info-color-50": "#4589ff",
 		"--kup-info-color-70": "#0043ce",
 		"--kup-warning-color-40": "#f1c21b",
-		"--kup-primary-color": "#a6192e",
-		"--kup-secondary-color": "#f5f4f4",
+		"--kup-accent-red-color": "#A6192E",
+		"--kup-accent-orange-color": "#DE8906",
+		"--kup-accent-yellow-color": "#FDDC69",
+		"--kup-accent-green-color": "#A4BA4C",
+		"--kup-accent-white-color": "#FFFFFF",
 		"--kup-background-color": "#ffffff",
 		"--kup-navbar-background-color": "#000000",
 		"--kup-navbar-color": "#ffffff",
@@ -4212,7 +4624,7 @@ const obsidian = {
 		"--kup-drawer-width": "300px",
 		"--kup-font-family": "Open Sans, arial, helvatica",
 		"--kup-font-family-monospace": "Courier New, Courier, monospace",
-		"--kup-font-size": "13px",
+		"--kup-font-size": "14px",
 		"--kup-text-color": "#4c4c4d",
 		"--kup-text-on-primary-color": "#ffffff",
 		"--kup-text-on-secondary-color": "#a6192e",
@@ -4222,7 +4634,7 @@ const obsidian = {
 		"--kup-hover-color": "#000000",
 		"--kup-title-background-color": "#068a9c",
 		"--kup-title-color": "#ffffff",
-		"--kup-icon-color": "#9d9d9d",
+		"--kup-icon-color": "#636363",
 		"--kup-border-color": "#ededed",
 		"--kup-box-shadow": "rgba(0, 0, 0, 0.2) 0px 5px 5px -3px, rgba(0, 0, 0, 0.14) 0px 8px 10px 1px, rgba(0, 0, 0, 0.12) 0px 3px 14px 2px",
 		"--kup-info-color": "#2592df",
@@ -4259,6 +4671,7 @@ const obsidian = {
 		"--kup-space-12": "96px",
 		"--kup-space-13": "160px",
 		"--kup-radius-00": "0px",
+		"--kup-radius-01": "2px",
 		"--kup-radius-100": "100px"
 	},
 	icons: {
@@ -4278,6 +4691,19 @@ const obsidian = {
 };
 const ocean = {
 	cssVariables: {
+		"--kup-primary-color": "#0081c5",
+		"--kup-primary-color-0": "#ffffff",
+		"--kup-primary-color-5": "#99cde8",
+		"--kup-primary-color-10": "#66b3dc",
+		"--kup-primary-color-20": "#4da7d6",
+		"--kup-primary-color-30": "#339ad1",
+		"--kup-primary-color-40": "#1a8ecb",
+		"--kup-primary-color-50": "#0081c5",
+		"--kup-primary-color-60": "#00679e",
+		"--kup-primary-color-70": "#005a8a",
+		"--kup-primary-color-80": "#004163",
+		"--kup-primary-color-90": "#00273b",
+		"--kup-secondary-color": "#3a8ede",
 		"--kup-gray-color-0": "#ffffff",
 		"--kup-gray-color-10": "#F4F4F4",
 		"--kup-gray-color-20": "#E0E0E0",
@@ -4288,18 +4714,18 @@ const ocean = {
 		"--kup-gray-color-70": "#525252",
 		"--kup-gray-color-80": "#393939",
 		"--kup-gray-color-90": "#262626",
-		"--kup-gray-color-100": "#161616",
 		"--kup-danger-color-50": "#fa4d56",
 		"--kup-danger-color-60": "#da1e28",
 		"--kup-danger-color-70": "#ba1b23",
 		"--kup-danger-color-80": "#750e13",
-		"--kup-success-color-40": "#42be65",
-		"--kup-success-color-60": "#198038",
 		"--kup-info-color-50": "#4589ff",
 		"--kup-info-color-70": "#0043ce",
 		"--kup-warning-color-40": "#f1c21b",
-		"--kup-primary-color": "#0081c5",
-		"--kup-secondary-color": "#3a8ede",
+		"--kup-accent-red-color": "#A6192E",
+		"--kup-accent-orange-color": "#DE8906",
+		"--kup-accent-yellow-color": "#FDDC69",
+		"--kup-accent-green-color": "#A4BA4C",
+		"--kup-accent-white-color": "#FFFFFF",
 		"--kup-background-color": "#ffffff",
 		"--kup-navbar-background-color": "#001d3e",
 		"--kup-navbar-color": "#ffffff",
@@ -4309,7 +4735,7 @@ const ocean = {
 		"--kup-drawer-width": "300px",
 		"--kup-font-family": "Open Sans Condensed, sans-serif",
 		"--kup-font-family-monospace": "Roboto Mono, consolas, monospace",
-		"--kup-font-size": "16px",
+		"--kup-font-size": "14px",
 		"--kup-text-color": "#1b1b1b",
 		"--kup-text-on-primary-color": "#ffffff",
 		"--kup-text-on-secondary-color": "#ffffff",
@@ -4319,7 +4745,7 @@ const ocean = {
 		"--kup-hover-color": "#545454",
 		"--kup-title-background-color": "#f1f3f4",
 		"--kup-title-color": "#1b1b1b",
-		"--kup-icon-color": "#505050",
+		"--kup-icon-color": "#636363",
 		"--kup-border-color": "#e0e0e0",
 		"--kup-box-shadow": "0px 0px 7.5px 0px rgba(128, 128, 128, 0.5)",
 		"--kup-info-color": "#2592df",
@@ -4350,6 +4776,7 @@ const ocean = {
 		"--kup-space-12": "96px",
 		"--kup-space-13": "160px",
 		"--kup-radius-00": "0px",
+		"--kup-radius-01": "2px",
 		"--kup-radius-100": "100px"
 	},
 	icons: {
@@ -4369,6 +4796,19 @@ const ocean = {
 };
 const print = {
 	cssVariables: {
+		"--kup-primary-color": "#000000",
+		"--kup-primary-color-0": "#ffffff",
+		"--kup-primary-color-5": "#000000",
+		"--kup-primary-color-10": "#000000",
+		"--kup-primary-color-20": "#000000",
+		"--kup-primary-color-30": "#000000",
+		"--kup-primary-color-40": "#000000",
+		"--kup-primary-color-50": "#000000",
+		"--kup-primary-color-60": "#000000",
+		"--kup-primary-color-70": "#000000",
+		"--kup-primary-color-80": "#000000",
+		"--kup-primary-color-90": "#000000",
+		"--kup-secondary-color": "#cccccc",
 		"--kup-gray-color-0": "#ffffff",
 		"--kup-gray-color-10": "#F4F4F4",
 		"--kup-gray-color-20": "#E0E0E0",
@@ -4379,18 +4819,18 @@ const print = {
 		"--kup-gray-color-70": "#525252",
 		"--kup-gray-color-80": "#393939",
 		"--kup-gray-color-90": "#262626",
-		"--kup-gray-color-100": "#161616",
 		"--kup-danger-color-50": "#fa4d56",
 		"--kup-danger-color-60": "#da1e28",
 		"--kup-danger-color-70": "#ba1b23",
 		"--kup-danger-color-80": "#750e13",
-		"--kup-success-color-40": "#42be65",
-		"--kup-success-color-60": "#198038",
 		"--kup-info-color-50": "#4589ff",
 		"--kup-info-color-70": "#0043ce",
 		"--kup-warning-color-40": "#f1c21b",
-		"--kup-primary-color": "#000000",
-		"--kup-secondary-color": "#cccccc",
+		"--kup-accent-red-color": "#A6192E",
+		"--kup-accent-orange-color": "#DE8906",
+		"--kup-accent-yellow-color": "#FDDC69",
+		"--kup-accent-green-color": "#A4BA4C",
+		"--kup-accent-white-color": "#FFFFFF",
 		"--kup-background-color": "#ffffff",
 		"--kup-navbar-background-color": "#000000",
 		"--kup-navbar-color": "#ffffff",
@@ -4400,7 +4840,7 @@ const print = {
 		"--kup-drawer-width": "300px",
 		"--kup-font-family": "Arial, Helvetica, sans-serif",
 		"--kup-font-family-monospace": "Courier New, Courier, monospace",
-		"--kup-font-size": "13px",
+		"--kup-font-size": "14px",
 		"--kup-text-color": "#000000",
 		"--kup-text-on-primary-color": "#ffffff",
 		"--kup-text-on-secondary-color": "#000000",
@@ -4410,7 +4850,7 @@ const print = {
 		"--kup-hover-color": "#000000",
 		"--kup-title-background-color": "#f1f1f1",
 		"--kup-title-color": "#000000",
-		"--kup-icon-color": "#9d9d9d",
+		"--kup-icon-color": "#636363",
 		"--kup-border-color": "#ededed",
 		"--kup-box-shadow": "rgba(0, 0, 0, 0.2) 0px 5px 5px -3px, rgba(0, 0, 0, 0.14) 0px 8px 10px 1px, rgba(0, 0, 0, 0.12) 0px 3px 14px 2px",
 		"--kup-info-color": "#2592df",
@@ -4447,6 +4887,7 @@ const print = {
 		"--kup-space-12": "96px",
 		"--kup-space-13": "160px",
 		"--kup-radius-00": "0px",
+		"--kup-radius-01": "2px",
 		"--kup-radius-100": "100px"
 	},
 	customStyles: {
@@ -4473,6 +4914,19 @@ const print = {
 };
 const raj = {
 	cssVariables: {
+		"--kup-primary-color": "rgb(187, 198, 5)",
+		"--kup-primary-color-0": "#ffffff",
+		"--kup-primary-color-5": "#ebeeb4",
+		"--kup-primary-color-10": "#e4e89b",
+		"--kup-primary-color-20": "#dde382",
+		"--kup-primary-color-30": "#d6dd69",
+		"--kup-primary-color-40": "#c9d137",
+		"--kup-primary-color-50": "#bbc605",
+		"--kup-primary-color-60": "#969e04",
+		"--kup-primary-color-70": "#707703",
+		"--kup-primary-color-80": "#4b4f02",
+		"--kup-primary-color-90": "#252801",
+		"--kup-secondary-color": "#ffe600",
 		"--kup-gray-color-0": "#161616",
 		"--kup-gray-color-10": "#262626",
 		"--kup-gray-color-20": "#393939",
@@ -4483,18 +4937,18 @@ const raj = {
 		"--kup-gray-color-70": "#C6C6C6",
 		"--kup-gray-color-80": "#E0E0E0",
 		"--kup-gray-color-90": "#f4f4f4",
-		"--kup-gray-color-100": "#ffffff",
 		"--kup-danger-color-50": "#fa4d56",
 		"--kup-danger-color-60": "#da1e28",
 		"--kup-danger-color-70": "#ba1b23",
 		"--kup-danger-color-80": "#750e13",
-		"--kup-success-color-40": "#42be65",
-		"--kup-success-color-60": "#198038",
 		"--kup-info-color-50": "#4589ff",
 		"--kup-info-color-70": "#0043ce",
 		"--kup-warning-color-40": "#f1c21b",
-		"--kup-primary-color": "rgb(187, 198, 5)",
-		"--kup-secondary-color": "#ffe600",
+		"--kup-accent-red-color": "#A6192E",
+		"--kup-accent-orange-color": "#DE8906",
+		"--kup-accent-yellow-color": "#FDDC69",
+		"--kup-accent-green-color": "#A4BA4C",
+		"--kup-accent-white-color": "#FFFFFF",
 		"--kup-background-color": "#000000",
 		"--kup-navbar-background-color": "#000000",
 		"--kup-navbar-color": "#ffffff",
@@ -4504,7 +4958,7 @@ const raj = {
 		"--kup-drawer-width": "300px",
 		"--kup-font-family": "'Rajdhani', sans-serif",
 		"--kup-font-family-monospace": "Roboto Mono, consolas, monospace",
-		"--kup-font-size": "15px",
+		"--kup-font-size": "14px",
 		"--kup-text-color": "#ffffff",
 		"--kup-text-on-primary-color": "#000000",
 		"--kup-text-on-secondary-color": "#000000",
@@ -4514,7 +4968,7 @@ const raj = {
 		"--kup-hover-color": "#ffffff",
 		"--kup-title-background-color": "#ffe600",
 		"--kup-title-color": "#000000",
-		"--kup-icon-color": "#9d9d9d",
+		"--kup-icon-color": "#636363",
 		"--kup-border-color": "#9d9d9d",
 		"--kup-box-shadow": "0px 0px 7.5px 0px rgba(128, 128, 128, 0.5)",
 		"--kup-info-color": "#2592df",
@@ -4545,6 +4999,7 @@ const raj = {
 		"--kup-space-12": "96px",
 		"--kup-space-13": "160px",
 		"--kup-radius-00": "0px",
+		"--kup-radius-01": "2px",
 		"--kup-radius-100": "100px"
 	},
 	icons: {
@@ -4564,6 +5019,19 @@ const raj = {
 };
 const red = {
 	cssVariables: {
+		"--kup-primary-color": "#a6192e",
+		"--kup-primary-color-0": "#ffffff",
+		"--kup-primary-color-5": "#e4bac0",
+		"--kup-primary-color-10": "#dba3ab",
+		"--kup-primary-color-20": "#d38c97",
+		"--kup-primary-color-30": "#c15e6d",
+		"--kup-primary-color-40": "#b84758",
+		"--kup-primary-color-50": "#a6192e",
+		"--kup-primary-color-60": "#851425",
+		"--kup-primary-color-70": "#640f1c",
+		"--kup-primary-color-80": "#420a12",
+		"--kup-primary-color-90": "#32070e",
+		"--kup-secondary-color": "#ffc107",
 		"--kup-gray-color-0": "#ffffff",
 		"--kup-gray-color-10": "#F4F4F4",
 		"--kup-gray-color-20": "#E0E0E0",
@@ -4574,18 +5042,18 @@ const red = {
 		"--kup-gray-color-70": "#525252",
 		"--kup-gray-color-80": "#393939",
 		"--kup-gray-color-90": "#262626",
-		"--kup-gray-color-100": "#161616",
 		"--kup-danger-color-50": "#fa4d56",
 		"--kup-danger-color-60": "#da1e28",
 		"--kup-danger-color-70": "#ba1b23",
 		"--kup-danger-color-80": "#750e13",
-		"--kup-success-color-40": "#42be65",
-		"--kup-success-color-60": "#198038",
 		"--kup-info-color-50": "#4589ff",
 		"--kup-info-color-70": "#0043ce",
 		"--kup-warning-color-40": "#f1c21b",
-		"--kup-primary-color": "#a6192e",
-		"--kup-secondary-color": "#ffc107",
+		"--kup-accent-red-color": "#A6192E",
+		"--kup-accent-orange-color": "#DE8906",
+		"--kup-accent-yellow-color": "#FDDC69",
+		"--kup-accent-green-color": "#A4BA4C",
+		"--kup-accent-white-color": "#FFFFFF",
 		"--kup-background-color": "#ffffff",
 		"--kup-navbar-background-color": "#a6192e",
 		"--kup-navbar-color": "#ffffff",
@@ -4595,7 +5063,7 @@ const red = {
 		"--kup-drawer-width": "300px",
 		"--kup-font-family": "Open Sans, arial, helvatica",
 		"--kup-font-family-monospace": "Roboto Mono, consolas, monospace",
-		"--kup-font-size": "13px",
+		"--kup-font-size": "14px",
 		"--kup-text-color": "#000000",
 		"--kup-text-on-primary-color": "#ffffff",
 		"--kup-text-on-secondary-color": "#ffffff",
@@ -4605,7 +5073,7 @@ const red = {
 		"--kup-hover-color": "#000000",
 		"--kup-title-background-color": "#f1f3f4",
 		"--kup-title-color": "#2e2e2e",
-		"--kup-icon-color": "#808080",
+		"--kup-icon-color": "#636363",
 		"--kup-border-color": "#ededed",
 		"--kup-box-shadow": "rgba(0, 0, 0, 0.2) 0px 5px 5px -3px, rgba(0, 0, 0, 0.14) 0px 8px 10px 1px, rgba(0, 0, 0, 0.12) 0px 3px 14px 2px",
 		"--kup-info-color": "#2592df",
@@ -4642,6 +5110,7 @@ const red = {
 		"--kup-space-12": "96px",
 		"--kup-space-13": "160px",
 		"--kup-radius-00": "0px",
+		"--kup-radius-01": "2px",
 		"--kup-radius-100": "100px"
 	},
 	icons: {
@@ -4663,6 +5132,19 @@ const red = {
 };
 const sapphire = {
 	cssVariables: {
+		"--kup-primary-color": "#003b77",
+		"--kup-primary-color-0": "#ffffff",
+		"--kup-primary-color-5": "#b3c4d6",
+		"--kup-primary-color-10": "#809dbb",
+		"--kup-primary-color-20": "#6689ad",
+		"--kup-primary-color-30": "#336292",
+		"--kup-primary-color-40": "#1a4f85",
+		"--kup-primary-color-50": "#003b77",
+		"--kup-primary-color-60": "#002f5f",
+		"--kup-primary-color-70": "#002347",
+		"--kup-primary-color-80": "#001830",
+		"--kup-primary-color-90": "#001224",
+		"--kup-secondary-color": "#ff1414",
 		"--kup-gray-color-0": "#ffffff",
 		"--kup-gray-color-10": "#F4F4F4",
 		"--kup-gray-color-20": "#E0E0E0",
@@ -4673,18 +5155,18 @@ const sapphire = {
 		"--kup-gray-color-70": "#525252",
 		"--kup-gray-color-80": "#393939",
 		"--kup-gray-color-90": "#262626",
-		"--kup-gray-color-100": "#161616",
 		"--kup-danger-color-50": "#fa4d56",
 		"--kup-danger-color-60": "#da1e28",
 		"--kup-danger-color-70": "#ba1b23",
 		"--kup-danger-color-80": "#750e13",
-		"--kup-success-color-40": "#42be65",
-		"--kup-success-color-60": "#198038",
 		"--kup-info-color-50": "#4589ff",
 		"--kup-info-color-70": "#0043ce",
 		"--kup-warning-color-40": "#f1c21b",
-		"--kup-primary-color": "#003b77",
-		"--kup-secondary-color": "#ff1414",
+		"--kup-accent-red-color": "#A6192E",
+		"--kup-accent-orange-color": "#DE8906",
+		"--kup-accent-yellow-color": "#FDDC69",
+		"--kup-accent-green-color": "#A4BA4C",
+		"--kup-accent-white-color": "#FFFFFF",
 		"--kup-background-color": "#ffffff",
 		"--kup-navbar-background-color": "#003b77",
 		"--kup-navbar-color": "#ffffff",
@@ -4692,9 +5174,9 @@ const sapphire = {
 		"--kup-drawer-color": "#ffffff",
 		"--kup-navbar-height": "64px",
 		"--kup-drawer-width": "20em",
-		"--kup-font-family": "Arial",
-		"--kup-font-family-monospace": "Arial",
-		"--kup-font-size": "13px",
+		"--kup-font-family": "IBM Plex Sans, sans-serif",
+		"--kup-font-family-monospace": "IBM Plex Mono, monospace",
+		"--kup-font-size": "14px",
 		"--kup-text-color": "#333333",
 		"--kup-text-on-primary-color": "#fafafa",
 		"--kup-text-on-secondary-color": "#ffffff",
@@ -4704,7 +5186,7 @@ const sapphire = {
 		"--kup-hover-color": "#333333",
 		"--kup-title-background-color": "#003b77",
 		"--kup-title-color": "#ffffff",
-		"--kup-icon-color": "#808080",
+		"--kup-icon-color": "#636363",
 		"--kup-border-color": "#93c4ec",
 		"--kup-box-shadow": "rgba(0, 0, 0, 0.2) 0px 5px 5px -3px, rgba(0, 0, 0, 0.14) 0px 8px 10px 1px, rgba(0, 0, 0, 0.12) 0px 3px 14px 2px",
 		"--kup-info-color": "#2592df",
@@ -4741,6 +5223,7 @@ const sapphire = {
 		"--kup-space-12": "96px",
 		"--kup-space-13": "160px",
 		"--kup-radius-00": "0px",
+		"--kup-radius-01": "2px",
 		"--kup-radius-100": "100px"
 	},
 	icons: {
@@ -4760,6 +5243,19 @@ const sapphire = {
 };
 const silver = {
 	cssVariables: {
+		"--kup-primary-color": "#c0c0c0",
+		"--kup-primary-color-0": "#ffffff",
+		"--kup-primary-color-5": "#f2f2f2",
+		"--kup-primary-color-10": "#ececec",
+		"--kup-primary-color-20": "#e6e6e6",
+		"--kup-primary-color-30": "#d9d9d9",
+		"--kup-primary-color-40": "#cdcdcd",
+		"--kup-primary-color-50": "#c0c0c0",
+		"--kup-primary-color-60": "#9a9a9a",
+		"--kup-primary-color-70": "#737373",
+		"--kup-primary-color-80": "#4d4d4d",
+		"--kup-primary-color-90": "#262626",
+		"--kup-secondary-color": "#c0c0c0",
 		"--kup-gray-color-0": "#161616",
 		"--kup-gray-color-10": "#262626",
 		"--kup-gray-color-20": "#393939",
@@ -4770,18 +5266,18 @@ const silver = {
 		"--kup-gray-color-70": "#C6C6C6",
 		"--kup-gray-color-80": "#E0E0E0",
 		"--kup-gray-color-90": "#f4f4f4",
-		"--kup-gray-color-100": "#ffffff",
 		"--kup-danger-color-50": "#fa4d56",
 		"--kup-danger-color-60": "#da1e28",
 		"--kup-danger-color-70": "#ba1b23",
 		"--kup-danger-color-80": "#750e13",
-		"--kup-success-color-40": "#42be65",
-		"--kup-success-color-60": "#198038",
 		"--kup-info-color-50": "#4589ff",
 		"--kup-info-color-70": "#0043ce",
 		"--kup-warning-color-40": "#f1c21b",
-		"--kup-primary-color": "#c0c0c0",
-		"--kup-secondary-color": "#c0c0c0",
+		"--kup-accent-red-color": "#A6192E",
+		"--kup-accent-orange-color": "#DE8906",
+		"--kup-accent-yellow-color": "#FDDC69",
+		"--kup-accent-green-color": "#A4BA4C",
+		"--kup-accent-white-color": "#FFFFFF",
 		"--kup-background-color": "#000000",
 		"--kup-navbar-background-color": "#ffffff",
 		"--kup-navbar-color": "#000000",
@@ -4791,7 +5287,7 @@ const silver = {
 		"--kup-drawer-width": "320px",
 		"--kup-font-family": "Oswald, sans-serif",
 		"--kup-font-family-monospace": "Xanh Mono, monospace",
-		"--kup-font-size": "16px",
+		"--kup-font-size": "14px",
 		"--kup-text-color": "#fefefe",
 		"--kup-text-on-primary-color": "#4a4a4a",
 		"--kup-text-on-secondary-color": "#4a4a4a",
@@ -4801,7 +5297,7 @@ const silver = {
 		"--kup-hover-color": "#dddddd",
 		"--kup-title-background-color": "#151515",
 		"--kup-title-color": "#d9d9d9",
-		"--kup-icon-color": "#c0c0c0",
+		"--kup-icon-color": "#636363",
 		"--kup-border-color": "#c0c0c0",
 		"--kup-box-shadow": "0px 0px 7.5px 0px rgba(128, 128, 128, 0.5)",
 		"--kup-info-color": "#2592df",
@@ -4835,6 +5331,7 @@ const silver = {
 		"--kup-space-12": "96px",
 		"--kup-space-13": "160px",
 		"--kup-radius-00": "0px",
+		"--kup-radius-01": "2px",
 		"--kup-radius-100": "100px"
 	},
 	icons: {
@@ -4856,6 +5353,19 @@ const silver = {
 };
 const teal = {
 	cssVariables: {
+		"--kup-primary-color": "#068A9C",
+		"--kup-primary-color-0": "#ffffff",
+		"--kup-primary-color-5": "#cde8eb",
+		"--kup-primary-color-10": "#b4dce1",
+		"--kup-primary-color-20": "#9bd0d7",
+		"--kup-primary-color-30": "#6ab9c4",
+		"--kup-primary-color-40": "#38a1b0",
+		"--kup-primary-color-50": "#068A9C",
+		"--kup-primary-color-60": "#056e7d",
+		"--kup-primary-color-70": "#04535e",
+		"--kup-primary-color-80": "#02373e",
+		"--kup-primary-color-90": "#011c1f",
+		"--kup-secondary-color": "#ffc107",
 		"--kup-gray-color-0": "#ffffff",
 		"--kup-gray-color-10": "#F4F4F4",
 		"--kup-gray-color-20": "#E0E0E0",
@@ -4866,18 +5376,18 @@ const teal = {
 		"--kup-gray-color-70": "#525252",
 		"--kup-gray-color-80": "#393939",
 		"--kup-gray-color-90": "#262626",
-		"--kup-gray-color-100": "#161616",
 		"--kup-danger-color-50": "#fa4d56",
 		"--kup-danger-color-60": "#da1e28",
 		"--kup-danger-color-70": "#ba1b23",
 		"--kup-danger-color-80": "#750e13",
-		"--kup-success-color-40": "#42be65",
-		"--kup-success-color-60": "#198038",
 		"--kup-info-color-50": "#4589ff",
 		"--kup-info-color-70": "#0043ce",
 		"--kup-warning-color-40": "#f1c21b",
-		"--kup-primary-color": "#068A9C",
-		"--kup-secondary-color": "#ffc107",
+		"--kup-accent-red-color": "#A6192E",
+		"--kup-accent-orange-color": "#DE8906",
+		"--kup-accent-yellow-color": "#FDDC69",
+		"--kup-accent-green-color": "#A4BA4C",
+		"--kup-accent-white-color": "#FFFFFF",
 		"--kup-background-color": "#ffffff",
 		"--kup-navbar-background-color": "#068A9C",
 		"--kup-navbar-color": "#ffffff",
@@ -4887,7 +5397,7 @@ const teal = {
 		"--kup-drawer-width": "300px",
 		"--kup-font-family": "Roboto, sans-serif",
 		"--kup-font-family-monospace": "Roboto Mono, consolas, monospace",
-		"--kup-font-size": "13px",
+		"--kup-font-size": "14px",
 		"--kup-text-color": "#000000",
 		"--kup-text-on-primary-color": "#ffffff",
 		"--kup-text-on-secondary-color": "#ffffff",
@@ -4897,7 +5407,7 @@ const teal = {
 		"--kup-hover-color": "#000000",
 		"--kup-title-background-color": "#f1f3f4",
 		"--kup-title-color": "#2e2e2e",
-		"--kup-icon-color": "#808080",
+		"--kup-icon-color": "#636363",
 		"--kup-border-color": "#ededed",
 		"--kup-box-shadow": "rgba(0, 0, 0, 0.2) 0px 5px 5px -3px, rgba(0, 0, 0, 0.14) 0px 8px 10px 1px, rgba(0, 0, 0, 0.12) 0px 3px 14px 2px",
 		"--kup-info-color": "#2592df",
@@ -4934,6 +5444,7 @@ const teal = {
 		"--kup-space-12": "96px",
 		"--kup-space-13": "160px",
 		"--kup-radius-00": "0px",
+		"--kup-radius-01": "2px",
 		"--kup-radius-100": "100px"
 	},
 	icons: {
@@ -4950,6 +5461,19 @@ const teal = {
 };
 const wildlife = {
 	cssVariables: {
+		"--kup-primary-color": "#0fa918",
+		"--kup-primary-color-0": "#ffffff",
+		"--kup-primary-color-5": "#cfeed1",
+		"--kup-primary-color-10": "#b7e5ba",
+		"--kup-primary-color-20": "#9fdda3",
+		"--kup-primary-color-30": "#6fcb74",
+		"--kup-primary-color-40": "#3fba46",
+		"--kup-primary-color-50": "#0fa918",
+		"--kup-primary-color-60": "#0c8713",
+		"--kup-primary-color-70": "#09650e",
+		"--kup-primary-color-80": "#06440a",
+		"--kup-primary-color-90": "#032205",
+		"--kup-secondary-color": "#739f5a",
 		"--kup-gray-color-0": "#ffffff",
 		"--kup-gray-color-10": "#F4F4F4",
 		"--kup-gray-color-20": "#E0E0E0",
@@ -4960,18 +5484,18 @@ const wildlife = {
 		"--kup-gray-color-70": "#525252",
 		"--kup-gray-color-80": "#393939",
 		"--kup-gray-color-90": "#262626",
-		"--kup-gray-color-100": "#161616",
 		"--kup-danger-color-50": "#fa4d56",
 		"--kup-danger-color-60": "#da1e28",
 		"--kup-danger-color-70": "#ba1b23",
 		"--kup-danger-color-80": "#750e13",
-		"--kup-success-color-40": "#42be65",
-		"--kup-success-color-60": "#198038",
 		"--kup-info-color-50": "#4589ff",
 		"--kup-info-color-70": "#0043ce",
 		"--kup-warning-color-40": "#f1c21b",
-		"--kup-primary-color": "#0fa918",
-		"--kup-secondary-color": "#739f5a",
+		"--kup-accent-red-color": "#A6192E",
+		"--kup-accent-orange-color": "#DE8906",
+		"--kup-accent-yellow-color": "#FDDC69",
+		"--kup-accent-green-color": "#A4BA4C",
+		"--kup-accent-white-color": "#FFFFFF",
 		"--kup-background-color": "#ffffff",
 		"--kup-navbar-background-color": "#095a1f",
 		"--kup-navbar-color": "#ffffff",
@@ -4981,7 +5505,7 @@ const wildlife = {
 		"--kup-drawer-width": "300px",
 		"--kup-font-family": "Abel, sans-serif",
 		"--kup-font-family-monospace": "Roboto Mono, consolas, monospace",
-		"--kup-font-size": "16px",
+		"--kup-font-size": "14px",
 		"--kup-text-color": "#000000",
 		"--kup-text-on-primary-color": "#ffffff",
 		"--kup-text-on-secondary-color": "#ffffff",
@@ -4991,7 +5515,7 @@ const wildlife = {
 		"--kup-hover-color": "#ffffff",
 		"--kup-title-background-color": "#f1f3f4",
 		"--kup-title-color": "#000000",
-		"--kup-icon-color": "#333333",
+		"--kup-icon-color": "#636363",
 		"--kup-border-color": "#e0e0e0",
 		"--kup-box-shadow": "0px 0px 7.5px 0px rgba(128, 128, 128, 0.5)",
 		"--kup-info-color": "#2592df",
@@ -5022,6 +5546,7 @@ const wildlife = {
 		"--kup-space-12": "96px",
 		"--kup-space-13": "160px",
 		"--kup-radius-00": "0px",
+		"--kup-radius-01": "2px",
 		"--kup-radius-100": "100px"
 	},
 	icons: {
@@ -5041,6 +5566,9 @@ const wildlife = {
 };
 const themes = {
 	octane: octane,
+	octaneGrey: octaneGrey,
+	darkOctane: darkOctane,
+	darkOctaneGray: darkOctaneGray,
 	bubbles: bubbles,
 	cobalt: cobalt,
 	dark: dark,
@@ -5133,6 +5661,7 @@ var KupTagNames;
     KupTagNames["IFRAME"] = "KUP-IFRAME";
     KupTagNames["IMAGE"] = "KUP-IMAGE";
     KupTagNames["IMAGE_LIST"] = "KUP-IMAGE-LIST";
+    KupTagNames["INPUT_PANEL"] = "KUP-INPUT-PANEL";
     KupTagNames["LAZY"] = "KUP-LAZY";
     KupTagNames["LIST"] = "KUP-LIST";
     KupTagNames["MAGIC_BOX"] = "KUP-MAGIC-BOX";
@@ -5172,6 +5701,7 @@ const fButtonUsers = [
     KupTagNames.DROPDOWN_BUTTON,
     KupTagNames.FAMILY_TREE,
     KupTagNames.FORM,
+    KupTagNames.INPUT_PANEL,
     KupTagNames.IMAGE_LIST,
     KupTagNames.SNACKBAR,
 ];
@@ -5184,6 +5714,7 @@ const fCellUsers = [
     KupTagNames.CELL,
     KupTagNames.DATA_TABLE,
     KupTagNames.FORM,
+    KupTagNames.INPUT_PANEL,
     KupTagNames.TREE,
 ];
 /**
@@ -5196,6 +5727,7 @@ const fCheckboxUsers = [
     KupTagNames.DASHBOARD,
     KupTagNames.DATA_TABLE,
     KupTagNames.FORM,
+    KupTagNames.INPUT_PANEL,
     KupTagNames.LIST,
     KupTagNames.TREE,
 ];
@@ -5209,6 +5741,7 @@ const fChipUsers = [
     KupTagNames.CHIP,
     KupTagNames.DATA_TABLE,
     KupTagNames.FORM,
+    KupTagNames.INPUT_PANEL,
     KupTagNames.TREE,
 ];
 /**
@@ -5261,6 +5794,7 @@ const fRadioUsers = [
     KupTagNames.CELL,
     KupTagNames.DATA_TABLE,
     KupTagNames.FORM,
+    KupTagNames.INPUT_PANEL,
     KupTagNames.RADIO,
     KupTagNames.TREE,
 ];
@@ -5283,6 +5817,7 @@ const fSwitchUsers = [
     KupTagNames.CELL,
     KupTagNames.DATA_TABLE,
     KupTagNames.FORM,
+    KupTagNames.INPUT_PANEL,
     KupTagNames.SWITCH,
     KupTagNames.TREE,
 ];
@@ -5299,6 +5834,7 @@ const fTextFieldUsers = [
     KupTagNames.DATA_TABLE,
     KupTagNames.DATE_PICKER,
     KupTagNames.FORM,
+    KupTagNames.INPUT_PANEL,
     KupTagNames.NUMERIC_PICKER,
     KupTagNames.PLANNER,
     KupTagNames.TEXT_FIELD,
@@ -18762,4 +19298,4 @@ function kupManagerInstance() {
     return dom.ketchup;
 }
 
-export { LoadMoreMode as $, KupObjects as A, formatToNumber as B, Filters as C, FilterInterval as D, getValueForDisplay as E, FCellTypes as F, getValueForDisplay2 as G, KupData as H, compareCell as I, GroupLabelDisplayMode as J, KupManager as K, SelectionMode as L, KupDynamicPositionPlacement as M, KupLanguageGrouping as N, KupLanguageCheckbox as O, KupDebugCategory as P, KupLanguageSearch as Q, KupLanguagePage as R, SortMode as S, TotalMode as T, addColumnValueFromRow as U, KupGlobalFilterMode as V, TotalLabel as W, KupPointerEventTypes as X, kupDynamicPositionAttribute as Y, KupCardFamily as Z, identify as _, KupThemeColorValues as a, PaginatorPos as a0, ShowGrid as a1, kupDraggableColumnAttr as a2, kupDragActiveAttr as a3, KupDragEffect as a4, kupDraggableCellAttr as a5, KupDropEventTypes as a6, FixedCellsClasses as a7, FixedCellsCSSVarsBase as a8, KupLanguageFontsize as a9, KupLanguageDensity as aa, KupLanguageGrid as ab, KupDataTableProps as ac, iconColumn as ad, keyColumn as ae, fieldColumn as af, KupCardProps as ag, kupDraggableAttr as ah, KupLanguageDashboard as ai, kupDropEvent as aj, kupDraggableRowAttr as ak, KupThemeIconValues as b, KupLanguageGeneric as c, kupTypes as d, editableTypes as e, KupTagNames as f, getProps as g, FCellShapes as h, fullWidthFieldsComps as i, FCellClasses as j, kupManagerInstance as k, autoCenterComps as l, getCellValueForDisplay as m, FCellEvents as n, FCellPadding as o, fillString as p, KupCardBuiltInClockElements as q, KupCardCSSClasses as r, setProps as s, KupLanguageTotals as t, KupLanguageColumn as u, KupDataNewColumnTypes as v, KupCardSubEvents as w, KupCardIds as x, KupLanguageRow as y, getColumnByName as z };
+export { LoadMoreMode as $, getColumnByName as A, KupObjects as B, formatToNumber as C, Filters as D, FilterInterval as E, FCellTypes as F, getValueForDisplay as G, getValueForDisplay2 as H, KupData as I, compareCell as J, KupManager as K, GroupLabelDisplayMode as L, SelectionMode as M, KupDynamicPositionPlacement as N, KupLanguageGrouping as O, KupLanguageCheckbox as P, KupLanguageSearch as Q, KupLanguagePage as R, SortMode as S, TotalMode as T, addColumnValueFromRow as U, KupGlobalFilterMode as V, TotalLabel as W, KupPointerEventTypes as X, kupDynamicPositionAttribute as Y, KupCardFamily as Z, identify as _, KupThemeColorValues as a, PaginatorPos as a0, ShowGrid as a1, kupDraggableColumnAttr as a2, kupDragActiveAttr as a3, KupDragEffect as a4, kupDraggableCellAttr as a5, KupDropEventTypes as a6, FixedCellsClasses as a7, FixedCellsCSSVarsBase as a8, KupLanguageFontsize as a9, KupLanguageDensity as aa, KupLanguageGrid as ab, KupDataTableProps as ac, iconColumn as ad, keyColumn as ae, fieldColumn as af, KupCardProps as ag, kupDraggableAttr as ah, KupLanguageDashboard as ai, kupDropEvent as aj, kupDraggableRowAttr as ak, KupThemeIconValues as b, KupLanguageGeneric as c, kupTypes as d, editableTypes as e, KupTagNames as f, getProps as g, FCellShapes as h, fullWidthFieldsComps as i, FCellClasses as j, kupManagerInstance as k, autoCenterComps as l, getCellValueForDisplay as m, FCellEvents as n, KupDebugCategory as o, FCellPadding as p, fillString as q, KupCardBuiltInClockElements as r, setProps as s, KupCardCSSClasses as t, KupLanguageTotals as u, KupLanguageColumn as v, KupDataNewColumnTypes as w, KupCardSubEvents as x, KupCardIds as y, KupLanguageRow as z };