@hitachivantara/uikit-react-core 5.95.1 → 5.96.0

package/dist/esm/themes/ds5.js

@@ -0,0 +1,142 @@
+import { mergeTheme, ds5 as ds5$1, theme } from "@hitachivantara/uikit-styles";
+const ds5 = mergeTheme(ds5$1, {
+  components: {
+    HvAvatar: {
+      classes: {
+        square: {
+          borderRadius: theme.radii.round
+        }
+      }
+    },
+    HvBannerContent: {
+      classes: {
+        root: {
+          borderRadius: 0
+        }
+      }
+    },
+    HvBaseDropdown: {
+      classes: {
+        headerOpen: {
+          "--r": theme.radii.round,
+          "&[data-popper-placement*='top']": {
+            borderRadius: "0 0 var(--r) var(--r)"
+          },
+          "&[data-popper-placement*='bottom']": {
+            borderRadius: "var(--r) var(--r) 0 0"
+          }
+        },
+        panel: {
+          "--r": theme.radii.round,
+          "&[data-popper-placement*='top']": {
+            top: 1,
+            borderRadius: "var(--r) var(--r) 0 0"
+          },
+          "&[data-popper-placement*='bottom']": {
+            top: -1,
+            borderRadius: "0 0 var(--r) var(--r)"
+          }
+        }
+      }
+    },
+    HvButton: {
+      radius: "round",
+      classes: {
+        root: {
+          ":where(:not(.HvButton-disabled,.HvButton-contained))": {
+            "&[data-color=warning]": { color: theme.colors.warning_140 }
+          }
+        },
+        contained: {
+          ":where([data-color=primary]:not(.HvButton-disabled))": {
+            ":hover, &:focus-visible": {
+              backgroundColor: theme.colors.primary_80,
+              borderColor: theme.colors.primary_80
+            }
+          },
+          ":where([data-color=positive]:not(.HvButton-disabled))": {
+            ":hover, &:focus-visible": {
+              backgroundColor: theme.colors.positive_80,
+              borderColor: theme.colors.positive_80
+            }
+          },
+          ":where([data-color=warning]:not(.HvButton-disabled))": {
+            backgroundColor: theme.colors.warning_120,
+            ":hover, &:focus-visible": {
+              backgroundColor: theme.colors.warning_140,
+              borderColor: theme.colors.warning_140
+            }
+          },
+          ":where([data-color=negative]:not(.HvButton-disabled))": {
+            ":hover, &:focus-visible": {
+              backgroundColor: theme.colors.negative_80,
+              borderColor: theme.colors.negative_80
+            }
+          }
+        }
+      }
+    },
+    HvDropdownButton: {
+      classes: {
+        open: {
+          "&[data-popper-placement*='top']": {
+            borderTopLeftRadius: 0,
+            borderTopRightRadius: 0
+          },
+          "&[data-popper-placement*='bottom']": {
+            borderBottomLeftRadius: 0,
+            borderBottomRightRadius: 0
+          }
+        }
+      }
+    },
+    HvMultiButton: {
+      classes: {
+        splitGroup: {
+          // NEXT5 subtle multi-buttons have a custom background
+          "& .HvButton-subtle": {
+            backgroundColor: theme.colors.atmo1
+          },
+          "&& .HvButton-disabled": {
+            backgroundColor: theme.colors.atmo3
+          }
+        }
+      }
+    },
+    HvSelect: {
+      classes: {
+        popper: {
+          "--r": theme.radii.round,
+          "&[data-popper-placement*='top'] .HvSelect-panel": {
+            borderRadius: "var(--r) var(--r) 0 0"
+          },
+          "&[data-popper-placement*='bottom'] .HvSelect-panel": {
+            borderRadius: "0 0 var(--r) var(--r)"
+          }
+        }
+      }
+    },
+    HvTab: {
+      classes: {
+        root: {
+          "&.HvTab-selected": {
+            color: theme.colors.secondary
+          }
+        }
+      }
+    },
+    HvTag: {
+      classes: {
+        root: {
+          "--tagColor": theme.colors.neutral_20
+        },
+        categorical: {
+          "--tagColor": theme.alpha("cat1", 0.2)
+        }
+      }
+    }
+  }
+});
+export {
+  ds5
+};

package/dist/esm/themes/index.js

@@ -0,0 +1,10 @@
+import { ds3 } from "./ds3.js";
+import { ds5 } from "./ds5.js";
+import { pentahoPlus } from "./pentahoPlus.js";
+const themes = { ds3, ds5, pentahoPlus };
+export {
+  ds3,
+  ds5,
+  pentahoPlus,
+  themes
+};