@hitachivantara/uikit-react-pentaho 6.0.13 → 6.0.14

package/dist/Canvas/Toolbar/Toolbar.js

@@ -1,60 +1,53 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import { useDefaultProps, useLabels, HvIconButton, HvTypography } from "@hitachivantara/uikit-react-core";
-import { Previous } from "@hitachivantara/uikit-react-icons";
-import { mergeStyles } from "@hitachivantara/uikit-react-utils";
 import { useCanvasContext } from "../CanvasContext.js";
 import { useClasses } from "./Toolbar.styles.js";
-import { staticClasses } from "./Toolbar.styles.js";
-const DEFAULT_LABELS = {
-  back: "Back"
-};
-const HvCanvasToolbar = forwardRef(
-  function HvCanvasToolbar2(props, ref) {
-    const {
-      title: titleProp,
-      backButton,
-      labels: labelsProp,
-      className,
-      style,
-      children,
-      backButtonProps,
-      classes: classesProp,
-      ...others
-    } = useDefaultProps("HvCanvasToolbar", props);
-    const { classes, cx } = useClasses(classesProp);
-    const labels = useLabels(DEFAULT_LABELS, labelsProp);
-    const canvasContext = useCanvasContext();
-    const sidePanelWidth = canvasContext?.sidePanelWidth ?? 0;
-    const title = typeof titleProp === "string" ? /* @__PURE__ */ jsx(HvTypography, { variant: "title4", children: titleProp }) : titleProp;
-    return /* @__PURE__ */ jsxs(
-      "div",
-      {
-        ref,
-        className: cx(classes.root, className),
-        style: mergeStyles(style, {
-          "--sidepanel-width": `${sidePanelWidth}px`,
-          transition: canvasContext?.sidePanelDragging ? void 0 : "width 0.3s ease"
-        }),
-        ...others,
-        children: [
-          /* @__PURE__ */ jsx("div", { className: classes.back, children: backButton ?? /* @__PURE__ */ jsx(
-            HvIconButton,
-            {
-              title: labels.back,
-              variant: "primaryGhost",
-              ...backButtonProps,
-              children: /* @__PURE__ */ jsx(Previous, {})
-            }
-          ) }),
-          /* @__PURE__ */ jsx("div", { className: classes.title, children: title }),
-          children && /* @__PURE__ */ jsx("div", { className: classes.actions, children })
-        ]
-      }
-    );
-  }
-);
-export {
-  HvCanvasToolbar,
-  staticClasses as canvasToolbarClasses
-};
+import { forwardRef } from "react";
+import { HvIconButton, HvTypography, useDefaultProps, useLabels } from "@hitachivantara/uikit-react-core";
+import { mergeStyles } from "@hitachivantara/uikit-react-utils";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Previous } from "@hitachivantara/uikit-react-icons";
+//#region src/Canvas/Toolbar/Toolbar.tsx
+var DEFAULT_LABELS = { back: "Back" };
+/**
+* A toolbar component to use in a canvas context.
+*/
+var HvCanvasToolbar = forwardRef(function HvCanvasToolbar(props, ref) {
+	const { title: titleProp, backButton, labels: labelsProp, className, style, children, backButtonProps, classes: classesProp, ...others } = useDefaultProps("HvCanvasToolbar", props);
+	const { classes, cx } = useClasses(classesProp);
+	const labels = useLabels(DEFAULT_LABELS, labelsProp);
+	const canvasContext = useCanvasContext();
+	const sidePanelWidth = canvasContext?.sidePanelWidth ?? 0;
+	const title = typeof titleProp === "string" ? /* @__PURE__ */ jsx(HvTypography, {
+		variant: "title4",
+		children: titleProp
+	}) : titleProp;
+	return /* @__PURE__ */ jsxs("div", {
+		ref,
+		className: cx(classes.root, className),
+		style: mergeStyles(style, {
+			"--sidepanel-width": `${sidePanelWidth}px`,
+			transition: canvasContext?.sidePanelDragging ? void 0 : "width 0.3s ease"
+		}),
+		...others,
+		children: [
+			/* @__PURE__ */ jsx("div", {
+				className: classes.back,
+				children: backButton ?? /* @__PURE__ */ jsx(HvIconButton, {
+					title: labels.back,
+					variant: "primaryGhost",
+					...backButtonProps,
+					children: /* @__PURE__ */ jsx(Previous, {})
+				})
+			}),
+			/* @__PURE__ */ jsx("div", {
+				className: classes.title,
+				children: title
+			}),
+			children && /* @__PURE__ */ jsx("div", {
+				className: classes.actions,
+				children
+			})
+		]
+	});
+});
+//#endregion
+export { HvCanvasToolbar };

package/dist/Canvas/Toolbar/Toolbar.styles.js

@@ -1,40 +1,39 @@
 import { createClasses, theme } from "@hitachivantara/uikit-react-core";
-const { staticClasses, useClasses } = createClasses("HvCanvasToolbar", {
-  root: {
-    width: `calc(100% - var(--sidepanel-width) - 2 * ${theme.space.sm})`,
-    height: 54,
-    display: "flex",
-    alignItems: "center",
-    borderRadius: theme.radii.full,
-    backgroundColor: theme.colors.bgContainer,
-    position: "absolute",
-    right: theme.space.sm,
-    top: 0
-  },
-  back: {
-    borderRadius: `${theme.radii.full} 0 0 ${theme.radii.full}`,
-    minWidth: 68,
-    backgroundColor: theme.colors.bgHover,
-    height: "100%",
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "center"
-  },
-  title: {
-    display: "flex",
-    alignItems: "center",
-    padding: theme.spacing(0, "md"),
-    height: "100%",
-    flexGrow: 1
-  },
-  actions: {
-    display: "flex",
-    flexWrap: "nowrap",
-    overflow: "auto",
-    paddingRight: theme.space.md
-  }
+//#region src/Canvas/Toolbar/Toolbar.styles.tsx
+var { staticClasses, useClasses } = createClasses("HvCanvasToolbar", {
+	root: {
+		width: `calc(100% - var(--sidepanel-width) - 2 * ${theme.space.sm})`,
+		height: 54,
+		display: "flex",
+		alignItems: "center",
+		borderRadius: theme.radii.full,
+		backgroundColor: theme.colors.bgContainer,
+		position: "absolute",
+		right: theme.space.sm,
+		top: 0
+	},
+	back: {
+		borderRadius: `${theme.radii.full} 0 0 ${theme.radii.full}`,
+		minWidth: 68,
+		backgroundColor: theme.colors.bgHover,
+		height: "100%",
+		display: "flex",
+		alignItems: "center",
+		justifyContent: "center"
+	},
+	title: {
+		display: "flex",
+		alignItems: "center",
+		padding: theme.spacing(0, "md"),
+		height: "100%",
+		flexGrow: 1
+	},
+	actions: {
+		display: "flex",
+		flexWrap: "nowrap",
+		overflow: "auto",
+		paddingRight: theme.space.md
+	}
 });
-export {
-  staticClasses,
-  useClasses
-};
+//#endregion
+export { staticClasses, useClasses };

package/dist/Canvas/ToolbarTabs/ToolbarTabEditor.js

@@ -1,154 +1,129 @@
-import { jsxs, jsx } from "react/jsx-runtime";
 import { useRef, useState } from "react";
-import { useControlled, useEnhancedEffect, HvTypography, createClasses, theme, isKey } from "@hitachivantara/uikit-react-core";
+import { HvTypography, createClasses, isKey, theme, useControlled, useEnhancedEffect } from "@hitachivantara/uikit-react-core";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { Edit } from "@hitachivantara/uikit-react-icons";
-const { staticClasses, useClasses } = createClasses(
-  "HvCanvasToolbarTabsEditor",
-  {
-    root: {
-      position: "relative",
-      display: "flex",
-      width: "100%",
-      overflow: "hidden",
-      "&:has($label:hover:not($edit))": {
-        color: theme.colors.textSubtle,
-        "& $editIcon": { visibility: "visible" }
-      }
-    },
-    edit: {
-      color: theme.colors.textSubtle,
-      borderColor: "currentColor",
-      backgroundColor: theme.colors.bgContainer,
-      cursor: "text"
-    },
-    label: {
-      width: "100%",
-      boxSizing: "border-box",
-      border: "1px solid transparent",
-      borderRadius: theme.radii.base,
-      padding: theme.spacing(0, "sm", 0, "xs"),
-      textAlign: "start",
-      whiteSpace: "nowrap",
-      overflow: "hidden",
-      outline: "none",
-      "&:not($edit)": {
-        textOverflow: "ellipsis"
-      },
-      "&:hover:not($edit)": {
-        color: theme.colors.textSubtle,
-        borderColor: theme.colors.bgHover,
-        backgroundColor: theme.colors.bgHover
-      }
-    },
-    editIcon: {
-      position: "absolute",
-      right: theme.space.xxs,
-      top: 4,
-      width: 16,
-      height: 16,
-      visibility: "hidden",
-      pointerEvents: "none"
-    }
-  }
-);
-const sanitize = (value) => value.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#039;");
-const ToolbarTabEditor = ({
-  id,
-  className,
-  edit: editProp,
-  value: valueProp,
-  defaultValue: defaultValueProp = "",
-  classes: classesProp,
-  onInput: onInputProp,
-  onClick: onClickProp,
-  onBlur: onBlurProp,
-  onKeyDown: onKeyDownProp,
-  onChange: onChangeProp,
-  onEditChange: onEditChangeProp,
-  ...others
-}) => {
-  const { cx, classes } = useClasses(classesProp);
-  const contentEditableRef = useRef(null);
-  const [value, setValue] = useControlled(
-    valueProp ? sanitize(valueProp) : valueProp,
-    defaultValueProp ? sanitize(defaultValueProp) : defaultValueProp
-  );
-  const [cachedValue, setCachedValue] = useState(value);
-  const [isEditing, setIsEditing] = useControlled(editProp, false);
-  const moveCursorToEnd = () => {
-    if (!contentEditableRef.current) return;
-    const element = contentEditableRef.current;
-    const range = document.createRange();
-    const selection = window.getSelection();
-    range.selectNodeContents(element);
-    range.collapse(false);
-    selection?.removeAllRanges();
-    selection?.addRange(range);
-    element.scrollLeft = element.scrollWidth;
-  };
-  const scrollContentToStart = () => {
-    if (!contentEditableRef.current) return;
-    const element = contentEditableRef.current;
-    element.scrollLeft = 0;
-  };
-  const changeEdit = (edit) => {
-    setIsEditing(edit);
-    onEditChangeProp?.(edit);
-  };
-  useEnhancedEffect(() => {
-    if (isEditing) moveCursorToEnd();
-  }, [isEditing, value]);
-  const handleInput = (event) => {
-    const newValue = sanitize(event.target.textContent) || "";
-    setValue(newValue);
-    onInputProp?.(event);
-    onChangeProp?.(event, newValue);
-  };
-  const handleClick = (event) => {
-    setCachedValue(value);
-    changeEdit(true);
-    onClickProp?.(event);
-  };
-  const handleBlur = (event) => {
-    changeEdit(false);
-    scrollContentToStart();
-    const newValue = value.trim() || cachedValue;
-    setValue(newValue);
-    onBlurProp?.(event, newValue);
-  };
-  const handleKeyDown = (event) => {
-    if (isKey(event, "Enter")) {
-      handleBlur(event);
-    } else if (isKey(event, "Esc")) {
-      changeEdit(false);
-      setValue(cachedValue);
-      onChangeProp?.(event, cachedValue);
-    }
-    onKeyDownProp?.(event);
-  };
-  return /* @__PURE__ */ jsxs("div", { id, className: cx(classes.root, className), children: [
-    /* @__PURE__ */ jsx(
-      HvTypography,
-      {
-        ref: contentEditableRef,
-        contentEditable: isEditing,
-        className: cx(classes.label, { [classes.edit]: isEditing }),
-        variant: "label",
-        component: "span",
-        onInput: handleInput,
-        onClick: handleClick,
-        onBlur: handleBlur,
-        onKeyDown: handleKeyDown,
-        dangerouslySetInnerHTML: {
-          __html: value
-        },
-        ...others
-      }
-    ),
-    /* @__PURE__ */ jsx(Edit, { className: classes.editIcon, iconSize: "XS" })
-  ] });
-};
-export {
-  ToolbarTabEditor,
-  staticClasses as toolbarTabEditorClasses
+//#region src/Canvas/ToolbarTabs/ToolbarTabEditor.tsx
+var { staticClasses, useClasses } = createClasses("HvCanvasToolbarTabsEditor", {
+	root: {
+		position: "relative",
+		display: "flex",
+		width: "100%",
+		overflow: "hidden",
+		"&:has($label:hover:not($edit))": {
+			color: theme.colors.textSubtle,
+			"& $editIcon": { visibility: "visible" }
+		}
+	},
+	edit: {
+		color: theme.colors.textSubtle,
+		borderColor: "currentColor",
+		backgroundColor: theme.colors.bgContainer,
+		cursor: "text"
+	},
+	label: {
+		width: "100%",
+		boxSizing: "border-box",
+		border: "1px solid transparent",
+		borderRadius: theme.radii.base,
+		padding: theme.spacing(0, "sm", 0, "xs"),
+		textAlign: "start",
+		whiteSpace: "nowrap",
+		overflow: "hidden",
+		outline: "none",
+		"&:not($edit)": { textOverflow: "ellipsis" },
+		"&:hover:not($edit)": {
+			color: theme.colors.textSubtle,
+			borderColor: theme.colors.bgHover,
+			backgroundColor: theme.colors.bgHover
+		}
+	},
+	editIcon: {
+		position: "absolute",
+		right: theme.space.xxs,
+		top: 4,
+		width: 16,
+		height: 16,
+		visibility: "hidden",
+		pointerEvents: "none"
+	}
+});
+var sanitize = (value) => value.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#039;");
+var ToolbarTabEditor = ({ id, className, edit: editProp, value: valueProp, defaultValue: defaultValueProp = "", classes: classesProp, onInput: onInputProp, onClick: onClickProp, onBlur: onBlurProp, onKeyDown: onKeyDownProp, onChange: onChangeProp, onEditChange: onEditChangeProp, ...others }) => {
+	const { cx, classes } = useClasses(classesProp);
+	const contentEditableRef = useRef(null);
+	const [value, setValue] = useControlled(valueProp ? sanitize(valueProp) : valueProp, defaultValueProp ? sanitize(defaultValueProp) : defaultValueProp);
+	const [cachedValue, setCachedValue] = useState(value);
+	const [isEditing, setIsEditing] = useControlled(editProp, false);
+	const moveCursorToEnd = () => {
+		if (!contentEditableRef.current) return;
+		const element = contentEditableRef.current;
+		const range = document.createRange();
+		const selection = window.getSelection();
+		range.selectNodeContents(element);
+		range.collapse(false);
+		selection?.removeAllRanges();
+		selection?.addRange(range);
+		element.scrollLeft = element.scrollWidth;
+	};
+	const scrollContentToStart = () => {
+		if (!contentEditableRef.current) return;
+		const element = contentEditableRef.current;
+		element.scrollLeft = 0;
+	};
+	const changeEdit = (edit) => {
+		setIsEditing(edit);
+		onEditChangeProp?.(edit);
+	};
+	useEnhancedEffect(() => {
+		if (isEditing) moveCursorToEnd();
+	}, [isEditing, value]);
+	const handleInput = (event) => {
+		const newValue = sanitize(event.target.textContent) || "";
+		setValue(newValue);
+		onInputProp?.(event);
+		onChangeProp?.(event, newValue);
+	};
+	const handleClick = (event) => {
+		setCachedValue(value);
+		changeEdit(true);
+		onClickProp?.(event);
+	};
+	const handleBlur = (event) => {
+		changeEdit(false);
+		scrollContentToStart();
+		const newValue = value.trim() || cachedValue;
+		setValue(newValue);
+		onBlurProp?.(event, newValue);
+	};
+	const handleKeyDown = (event) => {
+		if (isKey(event, "Enter")) handleBlur(event);
+		else if (isKey(event, "Esc")) {
+			changeEdit(false);
+			setValue(cachedValue);
+			onChangeProp?.(event, cachedValue);
+		}
+		onKeyDownProp?.(event);
+	};
+	return /* @__PURE__ */ jsxs("div", {
+		id,
+		className: cx(classes.root, className),
+		children: [/* @__PURE__ */ jsx(HvTypography, {
+			ref: contentEditableRef,
+			contentEditable: isEditing,
+			className: cx(classes.label, { [classes.edit]: isEditing }),
+			variant: "label",
+			component: "span",
+			onInput: handleInput,
+			onClick: handleClick,
+			onBlur: handleBlur,
+			onKeyDown: handleKeyDown,
+			dangerouslySetInnerHTML: { __html: value },
+			...others
+		}), /* @__PURE__ */ jsx(Edit, {
+			className: classes.editIcon,
+			iconSize: "XS"
+		})]
+	});
 };
+//#endregion
+export { ToolbarTabEditor, staticClasses };