@hitachivantara/uikit-react-core 6.8.2 → 6.9.0

package/dist/QueryBuilder/Rule/Operator.js

@@ -1,61 +1,56 @@
-import { jsx } from "react/jsx-runtime";
-import { useMemo } from "react";
+import { HvDropdown } from "../../Dropdown/Dropdown.js";
 import { useQueryBuilderContext } from "../Context.js";
 import { isBigList } from "../utils/index.js";
-import { HvDropdown } from "../../Dropdown/Dropdown.js";
-const Operator = ({
-  id,
-  combinator,
-  attribute,
-  operator
-}) => {
-  const { dispatchAction, attributes, operators, labels, readOnly } = useQueryBuilderContext();
-  const value = operator ?? null;
-  const values = useMemo(() => {
-    const attributeSpec = attribute && attributes ? attributes[attribute] : null;
-    const options = attributeSpec ? operators[attributeSpec.type].filter(
-      (o) => o.combinators.includes(combinator)
-    ) ?? [] : [];
-    return options.map((key) => ({
-      id: key.operator,
-      label: key.label,
-      selected: key.operator === value
-    }));
-  }, [attribute, attributes, operators, combinator, value]);
-  return /* @__PURE__ */ jsx(
-    HvDropdown,
-    {
-      required: true,
-      status: "valid",
-      singleSelectionToggle: false,
-      label: labels.rule.operator.label,
-      placeholder: labels.rule.operator.placeholder,
-      values,
-      style: { gridArea: "operator" },
-      disabled: values.length === 0,
-      readOnly,
-      onChange: (selected) => {
-        if (selected?.id) {
-          dispatchAction({
-            type: "set-operator",
-            id,
-            operator: selected.id.toString(),
-            value: value === "range" || selected.id === "range" ? null : void 0
-          });
-        } else {
-          dispatchAction({
-            type: "set-operator",
-            id,
-            operator: null,
-            value: null
-          });
-        }
-      },
-      showSearch: isBigList(values),
-      ...isBigList(values) && { virtualized: true, height: 300 }
-    }
-  );
-};
-export {
-  Operator
+import { useMemo } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/QueryBuilder/Rule/Operator.tsx
+var Operator = ({ id, combinator, attribute, operator }) => {
+	const { dispatchAction, attributes, operators, labels, readOnly } = useQueryBuilderContext();
+	const value = operator ?? null;
+	const values = useMemo(() => {
+		const attributeSpec = attribute && attributes ? attributes[attribute] : null;
+		return (attributeSpec ? operators[attributeSpec.type].filter((o) => o.combinators.includes(combinator)) ?? [] : []).map((key) => ({
+			id: key.operator,
+			label: key.label,
+			selected: key.operator === value
+		}));
+	}, [
+		attribute,
+		attributes,
+		operators,
+		combinator,
+		value
+	]);
+	return /* @__PURE__ */ jsx(HvDropdown, {
+		required: true,
+		status: "valid",
+		singleSelectionToggle: false,
+		label: labels.rule.operator.label,
+		placeholder: labels.rule.operator.placeholder,
+		values,
+		style: { gridArea: "operator" },
+		disabled: values.length === 0,
+		readOnly,
+		onChange: (selected) => {
+			if (selected?.id) dispatchAction({
+				type: "set-operator",
+				id,
+				operator: selected.id.toString(),
+				value: value === "range" || selected.id === "range" ? null : void 0
+			});
+			else dispatchAction({
+				type: "set-operator",
+				id,
+				operator: null,
+				value: null
+			});
+		},
+		showSearch: isBigList(values),
+		...isBigList(values) && {
+			virtualized: true,
+			height: 300
+		}
+	});
 };
+//#endregion
+export { Operator };

package/dist/QueryBuilder/Rule/Rule.js

@@ -1,95 +1,77 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { useMemo } from "react";
-import { useTheme } from "@mui/material/styles";
-import useMediaQuery from "@mui/material/useMediaQuery";
-import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
 import { HvIcon } from "../../icons.js";
+import { HvIconButton } from "../../IconButton/IconButton.js";
 import { useQueryBuilderContext } from "../Context.js";
 import { Value } from "../Value/Value.js";
 import { Attribute } from "./Attribute.js";
 import { Operator } from "./Operator.js";
 import { useClasses } from "./Rule.styles.js";
-import { HvIconButton } from "../../IconButton/IconButton.js";
-const Rule = (props) => {
-  const {
-    id,
-    combinator,
-    attribute,
-    operator,
-    value,
-    disabled,
-    isInvalid,
-    classes: classesProp
-  } = useDefaultProps("HvQueryBuilderRule", props);
-  const { classes, cx } = useClasses(classesProp);
-  const {
-    askAction,
-    dispatchAction,
-    attributes,
-    operators,
-    labels,
-    readOnly,
-    disableConfirmation
-  } = useQueryBuilderContext();
-  const theme = useTheme();
-  const isMdDown = useMediaQuery(theme.breakpoints.down("md"));
-  const availableOperators = useMemo(() => {
-    const attributeSpec = attribute != null && attributes ? attributes[attribute] : null;
-    if (attributeSpec != null) {
-      const typeOperators = operators[attributeSpec.type];
-      if (typeOperators != null) {
-        return typeOperators.reduce(
-          (count, item) => count + (item.combinators.includes(combinator) ? 1 : 0),
-          0
-        );
-      }
-    }
-    return -1;
-  }, [attribute, attributes, combinator, operators]);
-  return /* @__PURE__ */ jsxs("div", { className: cx(classes.root, { [classes.isMdDown]: isMdDown }), children: [
-    /* @__PURE__ */ jsx(
-      Attribute,
-      {
-        attribute,
-        id,
-        disabled,
-        isInvalid
-      }
-    ),
-    attribute != null && availableOperators > 0 && /* @__PURE__ */ jsx(
-      Operator,
-      {
-        id,
-        combinator,
-        attribute,
-        operator
-      }
-    ),
-    attribute != null && (operator != null || availableOperators === 0) && /* @__PURE__ */ jsx("div", { style: { gridArea: "value" }, children: /* @__PURE__ */ jsx(
-      Value,
-      {
-        attribute,
-        id,
-        operator,
-        value
-      }
-    ) }),
-    /* @__PURE__ */ jsx(
-      HvIconButton,
-      {
-        placement: "bottom",
-        className: classes.actionsContainer,
-        title: labels.rule.delete.tooltip,
-        onClick: () => disableConfirmation ? dispatchAction({ type: "remove-node", id }) : askAction({
-          actions: [{ type: "remove-node", id }],
-          dialog: labels.rule.delete
-        }),
-        disabled: readOnly,
-        children: /* @__PURE__ */ jsx(HvIcon, { name: "Delete" })
-      }
-    )
-  ] });
-};
-export {
-  Rule
+import { useDefaultProps } from "@hitachivantara/uikit-react-utils";
+import { useMemo } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useTheme as useTheme$1 } from "@mui/material/styles";
+import useMediaQuery from "@mui/material/useMediaQuery";
+//#region src/QueryBuilder/Rule/Rule.tsx
+var Rule = (props) => {
+	const { id, combinator, attribute, operator, value, disabled, isInvalid, classes: classesProp } = useDefaultProps("HvQueryBuilderRule", props);
+	const { classes, cx } = useClasses(classesProp);
+	const { askAction, dispatchAction, attributes, operators, labels, readOnly, disableConfirmation } = useQueryBuilderContext();
+	const isMdDown = useMediaQuery(useTheme$1().breakpoints.down("md"));
+	const availableOperators = useMemo(() => {
+		const attributeSpec = attribute != null && attributes ? attributes[attribute] : null;
+		if (attributeSpec != null) {
+			const typeOperators = operators[attributeSpec.type];
+			if (typeOperators != null) return typeOperators.reduce((count, item) => count + (item.combinators.includes(combinator) ? 1 : 0), 0);
+		}
+		return -1;
+	}, [
+		attribute,
+		attributes,
+		combinator,
+		operators
+	]);
+	return /* @__PURE__ */ jsxs("div", {
+		className: cx(classes.root, { [classes.isMdDown]: isMdDown }),
+		children: [
+			/* @__PURE__ */ jsx(Attribute, {
+				attribute,
+				id,
+				disabled,
+				isInvalid
+			}),
+			attribute != null && availableOperators > 0 && /* @__PURE__ */ jsx(Operator, {
+				id,
+				combinator,
+				attribute,
+				operator
+			}),
+			attribute != null && (operator != null || availableOperators === 0) && /* @__PURE__ */ jsx("div", {
+				style: { gridArea: "value" },
+				children: /* @__PURE__ */ jsx(Value, {
+					attribute,
+					id,
+					operator,
+					value
+				})
+			}),
+			/* @__PURE__ */ jsx(HvIconButton, {
+				placement: "bottom",
+				className: classes.actionsContainer,
+				title: labels.rule.delete.tooltip,
+				onClick: () => disableConfirmation ? dispatchAction({
+					type: "remove-node",
+					id
+				}) : askAction({
+					actions: [{
+						type: "remove-node",
+						id
+					}],
+					dialog: labels.rule.delete
+				}),
+				disabled: readOnly,
+				children: /* @__PURE__ */ jsx(HvIcon, { name: "Delete" })
+			})
+		]
+	});
 };
+//#endregion
+export { Rule };

package/dist/QueryBuilder/Rule/Rule.styles.js

@@ -1,58 +1,51 @@
-import { createClasses } from "@hitachivantara/uikit-react-utils";
-import { theme } from "@hitachivantara/uikit-styles";
 import { staticClasses } from "../QueryBuilder.styles.js";
-const { useClasses } = createClasses("HvQueryBuilderRule", {
-  root: {
-    position: "relative",
-    marginTop: theme.space.xs,
-    minHeight: 94,
-    display: "grid",
-    gridTemplateColumns: "1fr 1fr 2fr 32px",
-    gridTemplateAreas: '"attribute operator value actions"',
-    gap: theme.space.md,
-    "&:>*": {
-      minWidth: 0
-    },
-    // hide required * as all fields are required
-    "& label>span[aria-hidden]": {
-      visibility: "hidden"
-    },
-    "&::before": {
-      content: '""',
-      position: "absolute",
-      zIndex: 2,
-      width: "17px",
-      height: "44px",
-      borderBottom: `1px solid ${theme.colors.border}`,
-      borderLeft: `1px solid ${theme.colors.border}`,
-      top: 0,
-      left: `calc(-1 * 17px)`
-    },
-    [`:not(.${staticClasses.topRulesContainer})>&:last-child::after`]: {
-      content: '""',
-      position: "absolute",
-      zIndex: 1,
-      width: "17px",
-      height: "100%",
-      borderLeft: `1px solid ${theme.colors.border}`,
-      top: 0,
-      left: `calc(-1 * 17px)`
-    }
-  },
-  actionsContainer: {
-    gridArea: "actions",
-    justifySelf: "end",
-    marginTop: "24px"
-  },
-  isMdDown: {
-    gridTemplateColumns: "1fr",
-    gridTemplateAreas: '"attribute" "operator" "value" "actions"',
-    gap: theme.space.xs,
-    "& $actionsContainer": {
-      marginTop: 0
-    }
-  }
+import { theme } from "@hitachivantara/uikit-styles";
+import { createClasses } from "@hitachivantara/uikit-react-utils";
+//#region src/QueryBuilder/Rule/Rule.styles.tsx
+var { useClasses } = createClasses("HvQueryBuilderRule", {
+	root: {
+		position: "relative",
+		marginTop: theme.space.xs,
+		minHeight: 94,
+		display: "grid",
+		gridTemplateColumns: "1fr 1fr 2fr 32px",
+		gridTemplateAreas: "\"attribute operator value actions\"",
+		gap: theme.space.md,
+		"&:>*": { minWidth: 0 },
+		"& label>span[aria-hidden]": { visibility: "hidden" },
+		"&::before": {
+			content: "\"\"",
+			position: "absolute",
+			zIndex: 2,
+			width: "17px",
+			height: "44px",
+			borderBottom: `1px solid ${theme.colors.border}`,
+			borderLeft: `1px solid ${theme.colors.border}`,
+			top: 0,
+			left: `calc(-1 * 17px)`
+		},
+		[`:not(.${staticClasses.topRulesContainer})>&:last-child::after`]: {
+			content: "\"\"",
+			position: "absolute",
+			zIndex: 1,
+			width: "17px",
+			height: "100%",
+			borderLeft: `1px solid ${theme.colors.border}`,
+			top: 0,
+			left: `calc(-1 * 17px)`
+		}
+	},
+	actionsContainer: {
+		gridArea: "actions",
+		justifySelf: "end",
+		marginTop: "24px"
+	},
+	isMdDown: {
+		gridTemplateColumns: "1fr",
+		gridTemplateAreas: "\"attribute\" \"operator\" \"value\" \"actions\"",
+		gap: theme.space.xs,
+		"& $actionsContainer": { marginTop: 0 }
+	}
 });
-export {
-  useClasses
-};
+//#endregion
+export { useClasses };