@hitachivantara/uikit-react-core 5.95.1 → 5.96.0

package/dist/cjs/ListContainer/ListItem/ListItem.cjs

@@ -6,21 +6,6 @@ const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const ListItem_styles = require("./ListItem.styles.cjs");
 const ListContext = require("../ListContext/ListContext.cjs");
 const Focus = require("../../Focus/Focus.cjs");
-const applyClassNameAndStateToElement = (element, selected, disabled, onClick, className) => {
-  if (element == null) return null;
-  return React.cloneElement(element, {
-    className,
-    checked: !!selected,
-    disabled,
-    onChange: onClick
-  });
-};
-const applyClassNameToElement = (element, className) => {
-  if (element == null) return null;
-  return React.cloneElement(element, {
-    className
-  });
-};
 const HvListItem = React.forwardRef(function HvListItem2(props, ref) {
   const {
     classes: classesProp,
@@ -59,39 +44,34 @@ const HvListItem = React.forwardRef(function HvListItem2(props, ref) {
     },
     [disabled, onClick]
   );
-  const clonedStartAdornment = React.useMemo(
-    () => applyClassNameAndStateToElement(
-      startAdornment,
-      selected,
+  const clonedStartAdornment = React.useMemo(() => {
+    if (!React.isValidElement(startAdornment)) return startAdornment;
+    return React.cloneElement(startAdornment, {
+      className: cx(classes.startAdornment, startAdornment.props.className, {
+        // TODO: remove 👇 props below
+        [classes.disabled]: disabled
+      }),
+      checked: !!selected,
       disabled,
-      handleClick,
-      cx(
-        classes.startAdornment,
-        { [classes.disabled]: disabled },
-        React.isValidElement(startAdornment) ? startAdornment.props.className : void 0
-      )
-    ),
-    [
-      cx,
-      classes?.startAdornment,
-      classes?.disabled,
-      disabled,
-      handleClick,
-      selected,
-      startAdornment
-    ]
-  );
-  const clonedEndAdornment = React.useMemo(
-    () => applyClassNameToElement(
-      endAdornment,
-      cx(
-        classes.endAdornment,
-        { [classes.disabled]: disabled },
-        React.isValidElement(endAdornment) ? endAdornment.props.className : void 0
-      )
-    ),
-    [cx, classes?.endAdornment, classes?.disabled, disabled, endAdornment]
-  );
+      onChange: handleClick
+    });
+  }, [
+    cx,
+    classes?.startAdornment,
+    classes?.disabled,
+    disabled,
+    handleClick,
+    selected,
+    startAdornment
+  ]);
+  const clonedEndAdornment = React.useMemo(() => {
+    if (!React.isValidElement(endAdornment)) return endAdornment;
+    return React.cloneElement(endAdornment, {
+      className: cx(classes.endAdornment, endAdornment.props.className, {
+        [classes.disabled]: disabled
+      })
+    });
+  }, [cx, classes?.endAdornment, classes?.disabled, disabled, endAdornment]);
   const roleOptionAriaProps = role === "option" || role === "menuitem" ? {
     "aria-disabled": disabled || void 0,
     "aria-selected": selected

package/dist/cjs/ListContainer/ListItem/ListItem.styles.cjs

@@ -29,14 +29,12 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvListItem"
     }
   },
   focus: { backgroundColor: uikitStyles.theme.colors.bgPageSecondary, zIndex: 2 },
-  startAdornment: {},
-  endAdornment: {},
   gutters: {
     padding: `0 ${uikitStyles.theme.space.xs}`,
-    "&$withStartAdornment": {
+    ":has($startAdornment)": {
       paddingLeft: 0
     },
-    "&$withEndAdornment": {
+    ":has($endAdornment)": {
       paddingRight: 0
     }
   },
@@ -55,22 +53,16 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvListItem"
     color: uikitStyles.theme.colors.textDisabled,
     backgroundColor: uikitStyles.theme.colors.bgDisabled
   },
-  withStartAdornment: {
-    "& > div": {
-      float: "left"
-    },
-    "& svg": {
-      boxShadow: "none !important",
-      outline: "none !important"
-    }
+  startAdornment: {
+    float: "left"
   },
-  withEndAdornment: {
-    "& > div": { float: "right" },
-    "& svg": {
-      boxShadow: "none !important",
-      outline: "none !important"
-    }
-  }
+  endAdornment: {
+    float: "right"
+  },
+  /** @deprecated use `:has($startAdornment)` instead */
+  withStartAdornment: {},
+  /** @deprecated use `:has($endAdornment)` instead */
+  withEndAdornment: {}
 });
 exports.staticClasses = staticClasses;
 exports.useClasses = useClasses;

package/dist/cjs/Typography/Typography.cjs

@@ -13,9 +13,9 @@ const HvTypographyMap = {
   title4: "h4",
   body: "p",
   label: "span",
-  captionLabel: "p",
-  caption1: "p",
-  caption2: "p",
+  captionLabel: "div",
+  caption1: "div",
+  caption2: "div",
   // LEGACY
   "5xlTitle": "h1",
   "4xlTitle": "h1",

package/dist/cjs/index.cjs

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const uikitStyles = require("@hitachivantara/uikit-styles");
 const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
+const index = require("./themes/index.cjs");
 const FormElement = require("./FormElement/FormElement.cjs");
 const useClickOutside = require("./hooks/useClickOutside.cjs");
 const useComputation = require("./hooks/useComputation.cjs");
@@ -29,6 +30,9 @@ const sizes = require("./utils/sizes.cjs");
 const theme = require("./utils/theme.cjs");
 const useSavedState = require("./utils/useSavedState.cjs");
 const helpers = require("./utils/helpers.cjs");
+const ds3 = require("./themes/ds3.cjs");
+const ds5 = require("./themes/ds5.cjs");
+const pentahoPlus = require("./themes/pentahoPlus.cjs");
 const utils = require("./Typography/utils.cjs");
 const Typography_styles = require("./Typography/Typography.styles.cjs");
 const Typography = require("./Typography/Typography.cjs");
@@ -307,26 +311,10 @@ const IconContainer = require("./IconContainer/IconContainer.cjs");
 const Skeleton_styles = require("./Skeleton/Skeleton.styles.cjs");
 const Skeleton = require("./Skeleton/Skeleton.cjs");
 const uikitReactShared = require("@hitachivantara/uikit-react-shared");
-Object.defineProperty(exports, "ds3", {
-  enumerable: true,
-  get: () => uikitStyles.ds3
-});
-Object.defineProperty(exports, "ds5", {
-  enumerable: true,
-  get: () => uikitStyles.ds5
-});
-Object.defineProperty(exports, "pentahoPlus", {
-  enumerable: true,
-  get: () => uikitStyles.pentahoPlus
-});
 Object.defineProperty(exports, "theme", {
   enumerable: true,
   get: () => uikitStyles.theme
 });
-Object.defineProperty(exports, "themes", {
-  enumerable: true,
-  get: () => uikitStyles.themes
-});
 Object.defineProperty(exports, "createClasses", {
   enumerable: true,
   get: () => uikitReactUtils.createClasses
@@ -343,6 +331,7 @@ Object.defineProperty(exports, "useTheme", {
   enumerable: true,
   get: () => uikitReactUtils.useTheme
 });
+exports.themes = index.themes;
 exports.HvFormElement = FormElement.HvFormElement;
 exports.useClickOutside = useClickOutside.useClickOutside;
 exports.useComputation = useComputation.useComputation;
@@ -379,6 +368,9 @@ exports.processThemes = theme.processThemes;
 exports.setElementAttrs = theme.setElementAttrs;
 exports.useSavedState = useSavedState.useSavedState;
 exports.uniqueId = helpers.uniqueId;
+exports.ds3 = ds3.ds3;
+exports.ds5 = ds5.ds5;
+exports.pentahoPlus = pentahoPlus.pentahoPlus;
 exports.typographyVariants = utils.typographyVariants;
 exports.typographyClasses = Typography_styles.staticClasses;
 exports.HvTypography = Typography.HvTypography;