synapse-react-client 4.0.40 → 4.0.42

package/dist/components/QueryBuilder/QueryBuilderControls.js

@@ -3,22 +3,25 @@ import { useQueryContext as t } from "../QueryContext/QueryContext.js";
 import "../QueryContext/index.js";
 import { useQueryVisualizationContext as n } from "../QueryVisualizationWrapper/QueryVisualizationContext.js";
 import "../QueryVisualizationWrapper/index.js";
-import { QueryBuilderInternalContextProvider as r } from "./QueryBuilderInternalContext.js";
-import { addChildGroup as i, addConditionToGroup as a, clearGroup as o, defaultQBGroup as s, removeNode as c, updateCondition as l, updateGroup as u } from "./queryBuilderOperations.js";
-import { FilterGroupNode as d } from "./FilterGroupNode.js";
-import { qbNodeToApiFilter as f } from "./queryBuilderTranslation.js";
-import { qbTreeToReadable as p } from "./qbTreeToReadable.js";
-import m from "./QueryBuilderControls.module.js";
-import { useQBCombinedSql as h } from "./useQBCombinedSql.js";
-import { useQBFacetSourceMetadata as g } from "./useQBFacetSourceMetadata.js";
-import { useCallback as _, useMemo as v, useState as y } from "react";
-import { Button as b, ToggleButton as x, ToggleButtonGroup as S } from "@mui/material";
-import { jsx as C, jsxs as w } from "react/jsx-runtime";
+import { addChildGroup as r, addConditionToGroup as i, clearGroup as a, defaultQBGroup as o, removeNode as s, updateCondition as c, updateGroup as l } from "./queryBuilderOperations.js";
+import { qbNodeToApiFilter as u } from "./queryBuilderTranslation.js";
+import { useQueryBuilderDrag as d } from "./queryBuilderDnd.js";
+import { useQBCombinedSql as f } from "./useQBCombinedSql.js";
+import { useQBFacetSourceMetadata as p } from "./useQBFacetSourceMetadata.js";
+import { useQBValueDisplayName as m } from "./useQBValueDisplayName.js";
+import { QueryBuilderInternalContextProvider as h } from "./QueryBuilderInternalContext.js";
+import { FilterGroupNode as g } from "./FilterGroupNode.js";
+import { qbTreeToReadable as _ } from "./qbTreeToReadable.js";
+import v from "./QueryBuilderControls.module.js";
+import { useCallback as y, useMemo as b, useState as x } from "react";
+import { Button as S, ToggleButton as C, ToggleButtonGroup as w } from "@mui/material";
+import { jsx as T, jsxs as E } from "react/jsx-runtime";
+import { DragDropProvider as D } from "@dnd-kit/react";
 //#region src/components/QueryBuilder/QueryBuilderControls.tsx
-function T(T) {
-	let { tree: E, onTreeChange: D, onlyFacetedColumns: O = !1 } = T, { columnModels: k, facetResults: A } = g(), { executeQueryRequest: j } = t(), M = E ?? s(), N = _(() => {
-		let t = f(M);
-		j((n) => {
+function O(O) {
+	let { tree: k, onTreeChange: A, onlyFacetedColumns: j = !1 } = O, { columnModels: M, facetResults: N } = p(), { executeQueryRequest: P } = t(), F = k ?? o(), I = y(() => {
+		let t = u(F);
+		P((n) => {
 			let r = (n.query.additionalFilters ?? []).filter((t) => !e(t)), i = t ? [...r, t] : r;
 			return {
 				...n,
@@ -28,111 +31,120 @@ function T(T) {
 				}
 			};
 		});
-	}, [M, j]), { getColumnDisplayName: P } = n(), [F, I] = y("plain-english"), L = _((e) => {
-		D(a(M, e, null, null));
-	}, [M, D]), R = _((e) => {
-		D(i(M, e));
-	}, [M, D]), z = _((e) => {
-		D(o(M, e));
-	}, [M, D]), B = _((e, t) => {
-		D(u(M, e, t));
-	}, [M, D]), V = _((e) => {
-		D(c(M, e));
-	}, [M, D]), H = _((e, t) => {
-		D(l(M, e, t));
-	}, [M, D]), U = _((e) => {
-		D(c(M, e));
-	}, [M, D]), W = v(() => ({
-		columnModels: k,
-		facetResults: A,
-		onlyFacetedColumns: O,
-		getColumnDisplayName: P,
-		addConditionAt: L,
-		addChildGroupAt: R,
-		clearGroupAt: z,
-		updateGroupAt: B,
-		removeGroupAt: V,
-		updateConditionAt: H,
-		removeConditionAt: U
+	}, [F, P]), { getColumnDisplayName: L } = n(), R = m(M, N), [z, B] = x("plain-english"), V = y((e) => {
+		A(i(F, e, null, null));
+	}, [F, A]), H = y((e) => {
+		A(r(F, e));
+	}, [F, A]), U = y((e) => {
+		A(a(F, e));
+	}, [F, A]), W = y((e, t) => {
+		A(l(F, e, t));
+	}, [F, A]), G = y((e) => {
+		A(s(F, e));
+	}, [F, A]), K = y((e, t) => {
+		A(c(F, e, t));
+	}, [F, A]), q = y((e) => {
+		A(s(F, e));
+	}, [F, A]), J = d(F, A), Y = b(() => ({
+		columnModels: M,
+		facetResults: N,
+		onlyFacetedColumns: j,
+		getColumnDisplayName: L,
+		getValueDisplayName: R,
+		addConditionAt: V,
+		addChildGroupAt: H,
+		clearGroupAt: U,
+		updateGroupAt: W,
+		removeGroupAt: G,
+		updateConditionAt: K,
+		removeConditionAt: q
 	}), [
-		k,
-		A,
-		O,
-		P,
+		M,
+		N,
+		j,
 		L,
 		R,
-		z,
-		B,
 		V,
 		H,
-		U
-	]), G = v(() => p(M, P), [M, P]), { data: K, isPending: q, error: J } = h(F === "sql" ? M : null);
-	return /* @__PURE__ */ C(r, {
-		value: W,
-		children: /* @__PURE__ */ w("div", {
-			className: m.root,
-			children: [
-				/* @__PURE__ */ w("div", {
-					className: m.summaryBar,
-					children: [/* @__PURE__ */ w("div", {
-						className: m.summaryHeader,
-						children: [/* @__PURE__ */ C("span", {
-							className: m.summaryLabel,
-							children: "Query Summary"
-						}), /* @__PURE__ */ w(S, {
-							className: m.summaryModeToggle,
-							size: "small",
-							exclusive: !0,
-							value: F,
-							onChange: (e, t) => {
-								t != null && I(t);
-							},
-							"aria-label": "Query summary display mode",
-							children: [/* @__PURE__ */ C(x, {
-								value: "plain-english",
-								"aria-label": "Show summary",
-								children: "Summary"
-							}), /* @__PURE__ */ C(x, {
-								value: "sql",
-								"aria-label": "Show SQL",
-								children: "SQL"
+		U,
+		W,
+		G,
+		K,
+		q
+	]), X = b(() => _(F, L, R), [
+		F,
+		L,
+		R
+	]), { data: Z, isPending: Q, error: $ } = f(z === "sql" ? F : null);
+	return /* @__PURE__ */ T(h, {
+		value: Y,
+		children: /* @__PURE__ */ T(D, {
+			...J,
+			children: /* @__PURE__ */ E("div", {
+				className: v.root,
+				children: [
+					/* @__PURE__ */ E("div", {
+						className: v.summaryBar,
+						children: [/* @__PURE__ */ E("div", {
+							className: v.summaryHeader,
+							children: [/* @__PURE__ */ T("span", {
+								className: v.summaryLabel,
+								children: "Query Summary"
+							}), /* @__PURE__ */ E(w, {
+								className: v.summaryModeToggle,
+								size: "small",
+								exclusive: !0,
+								value: z,
+								onChange: (e, t) => {
+									t != null && B(t);
+								},
+								"aria-label": "Query summary display mode",
+								children: [/* @__PURE__ */ T(C, {
+									value: "plain-english",
+									"aria-label": "Show summary",
+									children: "Summary"
+								}), /* @__PURE__ */ T(C, {
+									value: "sql",
+									"aria-label": "Show SQL",
+									children: "SQL"
+								})]
 							})]
+						}), /* @__PURE__ */ T("div", {
+							className: v.summaryContent,
+							"aria-live": "polite",
+							"aria-atomic": "true",
+							children: z === "plain-english" ? X : $ ? /* @__PURE__ */ E("span", {
+								className: v.sqlError,
+								children: ["Could not load SQL preview: ", $.message]
+							}) : Q ? /* @__PURE__ */ T("span", {
+								className: v.sqlPlaceholder,
+								children: "Loading SQL…"
+							}) : /* @__PURE__ */ T("code", {
+								className: v.sqlText,
+								children: Z
+							})
 						})]
-					}), /* @__PURE__ */ C("div", {
-						className: m.summaryContent,
-						"aria-live": "polite",
-						"aria-atomic": "true",
-						children: F === "plain-english" ? G : J ? /* @__PURE__ */ w("span", {
-							className: m.sqlError,
-							children: ["Could not load SQL preview: ", J.message]
-						}) : q ? /* @__PURE__ */ C("span", {
-							className: m.sqlPlaceholder,
-							children: "Loading SQL…"
-						}) : /* @__PURE__ */ C("code", {
-							className: m.sqlText,
-							children: K
+					}),
+					/* @__PURE__ */ T(g, {
+						group: F,
+						isRoot: !0
+					}),
+					/* @__PURE__ */ T("div", {
+						className: v.applyRow,
+						children: /* @__PURE__ */ T(S, {
+							variant: "contained",
+							color: "primary",
+							onClick: I,
+							className: v.applyButton,
+							children: "Update Results"
 						})
-					})]
-				}),
-				/* @__PURE__ */ C(d, {
-					group: M,
-					isRoot: !0
-				}),
-				/* @__PURE__ */ C("div", {
-					className: m.applyRow,
-					children: /* @__PURE__ */ C(b, {
-						variant: "contained",
-						color: "primary",
-						onClick: N,
-						className: m.applyButton,
-						children: "Update Results"
 					})
-				})
-			]
+				]
+			})
 		})
 	});
 }
 //#endregion
-export { T as QueryBuilderControls };
+export { O as QueryBuilderControls };
 
 //# sourceMappingURL=QueryBuilderControls.js.map

package/dist/components/QueryBuilder/QueryBuilderControls.js.map

@@ -1 +1 @@
-{"version":3,"file":"QueryBuilderControls.js","names":[],"sources":["../../../src/components/QueryBuilder/QueryBuilderControls.tsx"],"sourcesContent":["import { Button, ToggleButton, ToggleButtonGroup } from '@mui/material'\nimport { useCallback, useMemo, useState } from 'react'\nimport { isFilterGroup } from '../../utils/types/IsType'\nimport { useQueryContext } from '../QueryContext'\nimport { useQueryVisualizationContext } from '../QueryVisualizationWrapper'\nimport { FilterGroupNode } from './FilterGroupNode'\nimport { qbNodeToApiFilter } from './queryBuilderTranslation'\nimport { qbTreeToReadable } from './qbTreeToReadable'\nimport { QueryBuilderInternalContextProvider } from './QueryBuilderInternalContext'\nimport styles from './QueryBuilderControls.module.scss'\nimport {\n  addChildGroup,\n  addConditionToGroup,\n  clearGroup,\n  defaultQBGroup,\n  removeNode,\n  updateCondition,\n  updateGroup,\n} from './queryBuilderOperations'\nimport { QBCondition, QBGroup } from './QueryBuilderTypes'\nimport { useQBCombinedSql } from './useQBCombinedSql'\nimport { useQBFacetSourceMetadata } from './useQBFacetSourceMetadata'\n\nexport type QueryBuilderControlsProps = {\n  /** The QB tree. When null, an empty default tree is rendered. */\n  tree: QBGroup | null\n  /** Called with the next tree after any dispatched edit. */\n  onTreeChange: (next: QBGroup) => void\n  /**\n   * When true, the property picker only offers columns that have facet\n   * metadata (Cohort Builder mode). Defaults to false.\n   */\n  onlyFacetedColumns?: boolean\n}\n\ntype SummaryMode = 'plain-english' | 'sql'\n\n/**\n * Top-level Query Builder panel. Uses `useQBFacetSourceMetadata()` — must be\n * rendered inside the Suspense boundary that already wraps\n * `QueryVisualizationWrapper` in `QueryWrapperPlotNav`. Facet metadata is\n * pulled from a companion query that strips the QB's own `FilterGroup` out\n * of `additionalFilters` so pill values remain stable while the user builds.\n */\nexport function QueryBuilderControls(props: QueryBuilderControlsProps) {\n  const { tree, onTreeChange, onlyFacetedColumns = false } = props\n  const { columnModels, facetResults } = useQBFacetSourceMetadata()\n  const { executeQueryRequest } = useQueryContext()\n\n  const activeTree = tree ?? defaultQBGroup()\n\n  const onApply = useCallback(() => {\n    const filterGroup = qbNodeToApiFilter(activeTree)\n    executeQueryRequest(prev => {\n      // Preserve any non-QB additionalFilters (e.g. lockedColumn constraints\n      // introduced by portal detail pages) — Update Results only owns the\n      // FilterGroup slot.\n      const preserved = (prev.query.additionalFilters ?? []).filter(\n        f => !isFilterGroup(f),\n      )\n      const next = filterGroup ? [...preserved, filterGroup] : preserved\n      return {\n        ...prev,\n        query: {\n          ...prev.query,\n          additionalFilters: next.length > 0 ? next : undefined,\n        },\n      }\n    })\n  }, [activeTree, executeQueryRequest])\n\n  const { getColumnDisplayName } = useQueryVisualizationContext()\n\n  const [summaryMode, setSummaryMode] = useState<SummaryMode>('plain-english')\n\n  const addConditionAt = useCallback(\n    (groupId: string) => {\n      onTreeChange(addConditionToGroup(activeTree, groupId, null, null))\n    },\n    [activeTree, onTreeChange],\n  )\n  const addChildGroupAt = useCallback(\n    (groupId: string) => {\n      onTreeChange(addChildGroup(activeTree, groupId))\n    },\n    [activeTree, onTreeChange],\n  )\n  const clearGroupAt = useCallback(\n    (groupId: string) => {\n      onTreeChange(clearGroup(activeTree, groupId))\n    },\n    [activeTree, onTreeChange],\n  )\n  const updateGroupAt = useCallback(\n    (\n      groupId: string,\n      patch: Partial<Omit<QBGroup, 'kind' | 'id' | 'children'>>,\n    ) => {\n      onTreeChange(updateGroup(activeTree, groupId, patch))\n    },\n    [activeTree, onTreeChange],\n  )\n  const removeGroupAt = useCallback(\n    (groupId: string) => {\n      onTreeChange(removeNode(activeTree, groupId))\n    },\n    [activeTree, onTreeChange],\n  )\n  const updateConditionAt = useCallback(\n    (conditionId: string, patch: Partial<Omit<QBCondition, 'kind' | 'id'>>) => {\n      onTreeChange(updateCondition(activeTree, conditionId, patch))\n    },\n    [activeTree, onTreeChange],\n  )\n  const removeConditionAt = useCallback(\n    (conditionId: string) => {\n      onTreeChange(removeNode(activeTree, conditionId))\n    },\n    [activeTree, onTreeChange],\n  )\n\n  const contextValue = useMemo(\n    () => ({\n      columnModels,\n      facetResults,\n      onlyFacetedColumns,\n      getColumnDisplayName,\n      addConditionAt,\n      addChildGroupAt,\n      clearGroupAt,\n      updateGroupAt,\n      removeGroupAt,\n      updateConditionAt,\n      removeConditionAt,\n    }),\n    [\n      columnModels,\n      facetResults,\n      onlyFacetedColumns,\n      getColumnDisplayName,\n      addConditionAt,\n      addChildGroupAt,\n      clearGroupAt,\n      updateGroupAt,\n      removeGroupAt,\n      updateConditionAt,\n      removeConditionAt,\n    ],\n  )\n\n  const readable = useMemo(\n    () => qbTreeToReadable(activeTree, getColumnDisplayName),\n    [activeTree, getColumnDisplayName],\n  )\n\n  const {\n    data: combinedSql,\n    isPending: isSqlPending,\n    error: sqlError,\n  } = useQBCombinedSql(summaryMode === 'sql' ? activeTree : null)\n\n  return (\n    <QueryBuilderInternalContextProvider value={contextValue}>\n      <div className={styles.root}>\n        <div className={styles.summaryBar}>\n          <div className={styles.summaryHeader}>\n            <span className={styles.summaryLabel}>Query Summary</span>\n            <ToggleButtonGroup\n              className={styles.summaryModeToggle}\n              size=\"small\"\n              exclusive\n              value={summaryMode}\n              onChange={(_event, next: SummaryMode | null) => {\n                if (next != null) setSummaryMode(next)\n              }}\n              aria-label=\"Query summary display mode\"\n            >\n              <ToggleButton value=\"plain-english\" aria-label=\"Show summary\">\n                Summary\n              </ToggleButton>\n              <ToggleButton value=\"sql\" aria-label=\"Show SQL\">\n                SQL\n              </ToggleButton>\n            </ToggleButtonGroup>\n          </div>\n          <div\n            className={styles.summaryContent}\n            aria-live=\"polite\"\n            aria-atomic=\"true\"\n          >\n            {summaryMode === 'plain-english' ? (\n              readable\n            ) : sqlError ? (\n              <span className={styles.sqlError}>\n                Could not load SQL preview: {sqlError.message}\n              </span>\n            ) : isSqlPending ? (\n              <span className={styles.sqlPlaceholder}>Loading SQL…</span>\n            ) : (\n              <code className={styles.sqlText}>{combinedSql}</code>\n            )}\n          </div>\n        </div>\n\n        <FilterGroupNode group={activeTree} isRoot />\n\n        <div className={styles.applyRow}>\n          <Button\n            variant=\"contained\"\n            color=\"primary\"\n            onClick={onApply}\n            className={styles.applyButton}\n          >\n            Update Results\n          </Button>\n        </div>\n      </div>\n    </QueryBuilderInternalContextProvider>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"QueryBuilderControls.js","names":[],"sources":["../../../src/components/QueryBuilder/QueryBuilderControls.tsx"],"sourcesContent":["import { Button, ToggleButton, ToggleButtonGroup } from '@mui/material'\nimport { DragDropProvider } from '@dnd-kit/react'\nimport { useCallback, useMemo, useState } from 'react'\nimport { isFilterGroup } from '../../utils/types/IsType'\nimport { useQueryContext } from '../QueryContext'\nimport { useQueryVisualizationContext } from '../QueryVisualizationWrapper'\nimport { FilterGroupNode } from './FilterGroupNode'\nimport { useQueryBuilderDrag } from './queryBuilderDnd'\nimport { qbNodeToApiFilter } from './queryBuilderTranslation'\nimport { qbTreeToReadable } from './qbTreeToReadable'\nimport { QueryBuilderInternalContextProvider } from './QueryBuilderInternalContext'\nimport styles from './QueryBuilderControls.module.scss'\nimport {\n  addChildGroup,\n  addConditionToGroup,\n  clearGroup,\n  defaultQBGroup,\n  removeNode,\n  updateCondition,\n  updateGroup,\n} from './queryBuilderOperations'\nimport { QBCondition, QBGroup } from './QueryBuilderTypes'\nimport { useQBCombinedSql } from './useQBCombinedSql'\nimport { useQBFacetSourceMetadata } from './useQBFacetSourceMetadata'\nimport { useQBValueDisplayName } from './useQBValueDisplayName'\n\nexport type QueryBuilderControlsProps = {\n  /** The QB tree. When null, an empty default tree is rendered. */\n  tree: QBGroup | null\n  /** Called with the next tree after any dispatched edit. */\n  onTreeChange: (next: QBGroup) => void\n  /**\n   * When true, the property picker only offers columns that have facet\n   * metadata (Cohort Builder mode). Defaults to false.\n   */\n  onlyFacetedColumns?: boolean\n}\n\ntype SummaryMode = 'plain-english' | 'sql'\n\n/**\n * Top-level Query Builder panel. Uses `useQBFacetSourceMetadata()` — must be\n * rendered inside the Suspense boundary that already wraps\n * `QueryVisualizationWrapper` in `QueryWrapperPlotNav`. Facet metadata is\n * pulled from a companion query that strips the QB's own `FilterGroup` out\n * of `additionalFilters` so pill values remain stable while the user builds.\n */\nexport function QueryBuilderControls(props: QueryBuilderControlsProps) {\n  const { tree, onTreeChange, onlyFacetedColumns = false } = props\n  const { columnModels, facetResults } = useQBFacetSourceMetadata()\n  const { executeQueryRequest } = useQueryContext()\n\n  const activeTree = tree ?? defaultQBGroup()\n\n  const onApply = useCallback(() => {\n    const filterGroup = qbNodeToApiFilter(activeTree)\n    executeQueryRequest(prev => {\n      // Preserve any non-QB additionalFilters (e.g. lockedColumn constraints\n      // introduced by portal detail pages) — Update Results only owns the\n      // FilterGroup slot.\n      const preserved = (prev.query.additionalFilters ?? []).filter(\n        f => !isFilterGroup(f),\n      )\n      const next = filterGroup ? [...preserved, filterGroup] : preserved\n      return {\n        ...prev,\n        query: {\n          ...prev.query,\n          additionalFilters: next.length > 0 ? next : undefined,\n        },\n      }\n    })\n  }, [activeTree, executeQueryRequest])\n\n  const { getColumnDisplayName } = useQueryVisualizationContext()\n  const getValueDisplayName = useQBValueDisplayName(columnModels, facetResults)\n\n  const [summaryMode, setSummaryMode] = useState<SummaryMode>('plain-english')\n\n  const addConditionAt = useCallback(\n    (groupId: string) => {\n      onTreeChange(addConditionToGroup(activeTree, groupId, null, null))\n    },\n    [activeTree, onTreeChange],\n  )\n  const addChildGroupAt = useCallback(\n    (groupId: string) => {\n      onTreeChange(addChildGroup(activeTree, groupId))\n    },\n    [activeTree, onTreeChange],\n  )\n  const clearGroupAt = useCallback(\n    (groupId: string) => {\n      onTreeChange(clearGroup(activeTree, groupId))\n    },\n    [activeTree, onTreeChange],\n  )\n  const updateGroupAt = useCallback(\n    (\n      groupId: string,\n      patch: Partial<Omit<QBGroup, 'kind' | 'id' | 'children'>>,\n    ) => {\n      onTreeChange(updateGroup(activeTree, groupId, patch))\n    },\n    [activeTree, onTreeChange],\n  )\n  const removeGroupAt = useCallback(\n    (groupId: string) => {\n      onTreeChange(removeNode(activeTree, groupId))\n    },\n    [activeTree, onTreeChange],\n  )\n  const updateConditionAt = useCallback(\n    (conditionId: string, patch: Partial<Omit<QBCondition, 'kind' | 'id'>>) => {\n      onTreeChange(updateCondition(activeTree, conditionId, patch))\n    },\n    [activeTree, onTreeChange],\n  )\n  const removeConditionAt = useCallback(\n    (conditionId: string) => {\n      onTreeChange(removeNode(activeTree, conditionId))\n    },\n    [activeTree, onTreeChange],\n  )\n  const dragHandlers = useQueryBuilderDrag(activeTree, onTreeChange)\n\n  const contextValue = useMemo(\n    () => ({\n      columnModels,\n      facetResults,\n      onlyFacetedColumns,\n      getColumnDisplayName,\n      getValueDisplayName,\n      addConditionAt,\n      addChildGroupAt,\n      clearGroupAt,\n      updateGroupAt,\n      removeGroupAt,\n      updateConditionAt,\n      removeConditionAt,\n    }),\n    [\n      columnModels,\n      facetResults,\n      onlyFacetedColumns,\n      getColumnDisplayName,\n      getValueDisplayName,\n      addConditionAt,\n      addChildGroupAt,\n      clearGroupAt,\n      updateGroupAt,\n      removeGroupAt,\n      updateConditionAt,\n      removeConditionAt,\n    ],\n  )\n\n  const readable = useMemo(\n    () =>\n      qbTreeToReadable(activeTree, getColumnDisplayName, getValueDisplayName),\n    [activeTree, getColumnDisplayName, getValueDisplayName],\n  )\n\n  const {\n    data: combinedSql,\n    isPending: isSqlPending,\n    error: sqlError,\n  } = useQBCombinedSql(summaryMode === 'sql' ? activeTree : null)\n\n  return (\n    <QueryBuilderInternalContextProvider value={contextValue}>\n      <DragDropProvider {...dragHandlers}>\n        <div className={styles.root}>\n          <div className={styles.summaryBar}>\n            <div className={styles.summaryHeader}>\n              <span className={styles.summaryLabel}>Query Summary</span>\n              <ToggleButtonGroup\n                className={styles.summaryModeToggle}\n                size=\"small\"\n                exclusive\n                value={summaryMode}\n                onChange={(_event, next: SummaryMode | null) => {\n                  if (next != null) setSummaryMode(next)\n                }}\n                aria-label=\"Query summary display mode\"\n              >\n                <ToggleButton value=\"plain-english\" aria-label=\"Show summary\">\n                  Summary\n                </ToggleButton>\n                <ToggleButton value=\"sql\" aria-label=\"Show SQL\">\n                  SQL\n                </ToggleButton>\n              </ToggleButtonGroup>\n            </div>\n            <div\n              className={styles.summaryContent}\n              aria-live=\"polite\"\n              aria-atomic=\"true\"\n            >\n              {summaryMode === 'plain-english' ? (\n                readable\n              ) : sqlError ? (\n                <span className={styles.sqlError}>\n                  Could not load SQL preview: {sqlError.message}\n                </span>\n              ) : isSqlPending ? (\n                <span className={styles.sqlPlaceholder}>Loading SQL…</span>\n              ) : (\n                <code className={styles.sqlText}>{combinedSql}</code>\n              )}\n            </div>\n          </div>\n\n          <FilterGroupNode group={activeTree} isRoot />\n\n          <div className={styles.applyRow}>\n            <Button\n              variant=\"contained\"\n              color=\"primary\"\n              onClick={onApply}\n              className={styles.applyButton}\n            >\n              Update Results\n            </Button>\n          </div>\n        </div>\n      </DragDropProvider>\n    </QueryBuilderInternalContextProvider>\n  )\n}\n"],"mappings":"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"}

package/dist/components/QueryBuilder/QueryBuilderInternalContext.d.ts

@@ -1,6 +1,7 @@
 import { ColumnModel, FacetColumnResult } from '@sage-bionetworks/synapse-types';
 import { PropsWithChildren } from 'react';
 import { QBCondition, QBGroup } from './QueryBuilderTypes';
+import { QBValueDisplayNameFn } from './useQBValueDisplayName';
 /**
  * Internal-only context shared between `QueryBuilderControls`,
  * `FilterGroupNode`, and `FilterConditionRow`. Exposes the dispatch surface
@@ -23,6 +24,12 @@ export type QueryBuilderInternalContextType = {
      * `QueryVisualizationContext.getColumnDisplayName` when available.
      */
     getColumnDisplayName: (columnName: string) => string;
+    /**
+     * Returns the user-facing label for a value of the given column — resolves
+     * Synapse IDs to entity/user/evaluation names, and the backend's
+     * `VALUE_NOT_SET` sentinel to `Not Assigned`.
+     */
+    getValueDisplayName: QBValueDisplayNameFn;
     addConditionAt: (groupId: string) => void;
     addChildGroupAt: (groupId: string) => void;
     clearGroupAt: (groupId: string) => void;

package/dist/components/QueryBuilder/QueryBuilderInternalContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"QueryBuilderInternalContext.d.ts","sourceRoot":"","sources":["../../../src/components/QueryBuilder/QueryBuilderInternalContext.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAA;AAChF,OAAO,EAAiB,iBAAiB,EAAc,MAAM,OAAO,CAAA;AACpE,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAA;AAE1D;;;;;GAKG;AACH,MAAM,MAAM,+BAA+B,GAAG;IAC5C,mEAAmE;IACnE,YAAY,EAAE,WAAW,EAAE,CAAA;IAC3B,0EAA0E;IAC1E,YAAY,EAAE,SAAS,iBAAiB,EAAE,CAAA;IAC1C;;;OAGG;IACH,kBAAkB,EAAE,OAAO,CAAA;IAC3B;;;;OAIG;IACH,oBAAoB,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,MAAM,CAAA;IAGpD,cAAc,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAA;IACzC,eAAe,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAA;IAC1C,YAAY,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAA;IACvC,aAAa,EAAE,CACb,OAAO,EAAE,MAAM,EACf,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI,GAAG,UAAU,CAAC,CAAC,KACtD,IAAI,CAAA;IACT,aAAa,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAA;IAGxC,iBAAiB,EAAE,CACjB,WAAW,EAAE,MAAM,EACnB,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC,CAAC,KAC7C,IAAI,CAAA;IACT,iBAAiB,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAA;CACjD,CAAA;AAKD,MAAM,MAAM,wCAAwC,GAAG,iBAAiB,CAAC;IACvE,KAAK,EAAE,+BAA+B,CAAA;CACvC,CAAC,CAAA;AAEF,wBAAgB,mCAAmC,CACjD,KAAK,EAAE,wCAAwC,2CAOhD;AAED,wBAAgB,8BAA8B,IAAI,+BAA+B,CAQhF"}
+{"version":3,"file":"QueryBuilderInternalContext.d.ts","sourceRoot":"","sources":["../../../src/components/QueryBuilder/QueryBuilderInternalContext.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAA;AAChF,OAAO,EAAiB,iBAAiB,EAAc,MAAM,OAAO,CAAA;AACpE,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAA;AAC1D,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAA;AAE9D;;;;;GAKG;AACH,MAAM,MAAM,+BAA+B,GAAG;IAC5C,mEAAmE;IACnE,YAAY,EAAE,WAAW,EAAE,CAAA;IAC3B,0EAA0E;IAC1E,YAAY,EAAE,SAAS,iBAAiB,EAAE,CAAA;IAC1C;;;OAGG;IACH,kBAAkB,EAAE,OAAO,CAAA;IAC3B;;;;OAIG;IACH,oBAAoB,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,MAAM,CAAA;IACpD;;;;OAIG;IACH,mBAAmB,EAAE,oBAAoB,CAAA;IAGzC,cAAc,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAA;IACzC,eAAe,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAA;IAC1C,YAAY,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAA;IACvC,aAAa,EAAE,CACb,OAAO,EAAE,MAAM,EACf,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI,GAAG,UAAU,CAAC,CAAC,KACtD,IAAI,CAAA;IACT,aAAa,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAA;IAGxC,iBAAiB,EAAE,CACjB,WAAW,EAAE,MAAM,EACnB,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC,CAAC,KAC7C,IAAI,CAAA;IACT,iBAAiB,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAA;CACjD,CAAA;AAKD,MAAM,MAAM,wCAAwC,GAAG,iBAAiB,CAAC;IACvE,KAAK,EAAE,+BAA+B,CAAA;CACvC,CAAC,CAAA;AAEF,wBAAgB,mCAAmC,CACjD,KAAK,EAAE,wCAAwC,2CAOhD;AAED,wBAAgB,8BAA8B,IAAI,+BAA+B,CAQhF"}

package/dist/components/QueryBuilder/QueryBuilderInternalContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"QueryBuilderInternalContext.js","names":[],"sources":["../../../src/components/QueryBuilder/QueryBuilderInternalContext.tsx"],"sourcesContent":["import { ColumnModel, FacetColumnResult } from '@sage-bionetworks/synapse-types'\nimport { createContext, PropsWithChildren, useContext } from 'react'\nimport { QBCondition, QBGroup } from './QueryBuilderTypes'\n\n/**\n * Internal-only context shared between `QueryBuilderControls`,\n * `FilterGroupNode`, and `FilterConditionRow`. Exposes the dispatch surface\n * for tree edits + the query metadata each row needs (column models, facet\n * results, and the Cohort Builder `onlyFacetedColumns` toggle).\n */\nexport type QueryBuilderInternalContextType = {\n  /** All columns available in the query (unfiltered by faceting). */\n  columnModels: ColumnModel[]\n  /** Facet results keyed by column name (used to populate pill choices). */\n  facetResults: readonly FacetColumnResult[]\n  /**\n   * When true, the property picker only offers columns that have facet\n   * metadata. Cohort Builder sets this true.\n   */\n  onlyFacetedColumns: boolean\n  /**\n   * Returns the user-facing label for a column — resolves `columnAliases`\n   * first, then falls back to `unCamelCase(name)`. Wired from\n   * `QueryVisualizationContext.getColumnDisplayName` when available.\n   */\n  getColumnDisplayName: (columnName: string) => string\n\n  // -- Group operations --\n  addConditionAt: (groupId: string) => void\n  addChildGroupAt: (groupId: string) => void\n  clearGroupAt: (groupId: string) => void\n  updateGroupAt: (\n    groupId: string,\n    patch: Partial<Omit<QBGroup, 'kind' | 'id' | 'children'>>,\n  ) => void\n  removeGroupAt: (groupId: string) => void\n\n  // -- Condition operations --\n  updateConditionAt: (\n    conditionId: string,\n    patch: Partial<Omit<QBCondition, 'kind' | 'id'>>,\n  ) => void\n  removeConditionAt: (conditionId: string) => void\n}\n\nconst QueryBuilderInternalContext =\n  createContext<QueryBuilderInternalContextType | null>(null)\n\nexport type QueryBuilderInternalContextProviderProps = PropsWithChildren<{\n  value: QueryBuilderInternalContextType\n}>\n\nexport function QueryBuilderInternalContextProvider(\n  props: QueryBuilderInternalContextProviderProps,\n) {\n  return (\n    <QueryBuilderInternalContext.Provider value={props.value}>\n      {props.children}\n    </QueryBuilderInternalContext.Provider>\n  )\n}\n\nexport function useQueryBuilderInternalContext(): QueryBuilderInternalContextType {\n  const context = useContext(QueryBuilderInternalContext)\n  if (context == null) {\n    throw new Error(\n      'QueryBuilderInternalContext missing — must be rendered inside QueryBuilderControls',\n    )\n  }\n  return context\n}\n"],"mappings":";;;AA6CA,IAAM,IACJ,EAAsD,IAAI;AAM5D,SAAgB,EACd,GACA;CACA,OACE,kBAAC,EAA4B,UAA7B;EAAsC,OAAO,EAAM;YAChD,EAAM;CAC6B,CAAA;AAE1C;AAEA,SAAgB,IAAkE;CAChF,IAAM,IAAU,EAAW,CAA2B;CACtD,IAAI,KAAW,MACb,MAAU,MACR,oFACF;CAEF,OAAO;AACT"}
+{"version":3,"file":"QueryBuilderInternalContext.js","names":[],"sources":["../../../src/components/QueryBuilder/QueryBuilderInternalContext.tsx"],"sourcesContent":["import { ColumnModel, FacetColumnResult } from '@sage-bionetworks/synapse-types'\nimport { createContext, PropsWithChildren, useContext } from 'react'\nimport { QBCondition, QBGroup } from './QueryBuilderTypes'\nimport { QBValueDisplayNameFn } from './useQBValueDisplayName'\n\n/**\n * Internal-only context shared between `QueryBuilderControls`,\n * `FilterGroupNode`, and `FilterConditionRow`. Exposes the dispatch surface\n * for tree edits + the query metadata each row needs (column models, facet\n * results, and the Cohort Builder `onlyFacetedColumns` toggle).\n */\nexport type QueryBuilderInternalContextType = {\n  /** All columns available in the query (unfiltered by faceting). */\n  columnModels: ColumnModel[]\n  /** Facet results keyed by column name (used to populate pill choices). */\n  facetResults: readonly FacetColumnResult[]\n  /**\n   * When true, the property picker only offers columns that have facet\n   * metadata. Cohort Builder sets this true.\n   */\n  onlyFacetedColumns: boolean\n  /**\n   * Returns the user-facing label for a column — resolves `columnAliases`\n   * first, then falls back to `unCamelCase(name)`. Wired from\n   * `QueryVisualizationContext.getColumnDisplayName` when available.\n   */\n  getColumnDisplayName: (columnName: string) => string\n  /**\n   * Returns the user-facing label for a value of the given column — resolves\n   * Synapse IDs to entity/user/evaluation names, and the backend's\n   * `VALUE_NOT_SET` sentinel to `Not Assigned`.\n   */\n  getValueDisplayName: QBValueDisplayNameFn\n\n  // -- Group operations --\n  addConditionAt: (groupId: string) => void\n  addChildGroupAt: (groupId: string) => void\n  clearGroupAt: (groupId: string) => void\n  updateGroupAt: (\n    groupId: string,\n    patch: Partial<Omit<QBGroup, 'kind' | 'id' | 'children'>>,\n  ) => void\n  removeGroupAt: (groupId: string) => void\n\n  // -- Condition operations --\n  updateConditionAt: (\n    conditionId: string,\n    patch: Partial<Omit<QBCondition, 'kind' | 'id'>>,\n  ) => void\n  removeConditionAt: (conditionId: string) => void\n}\n\nconst QueryBuilderInternalContext =\n  createContext<QueryBuilderInternalContextType | null>(null)\n\nexport type QueryBuilderInternalContextProviderProps = PropsWithChildren<{\n  value: QueryBuilderInternalContextType\n}>\n\nexport function QueryBuilderInternalContextProvider(\n  props: QueryBuilderInternalContextProviderProps,\n) {\n  return (\n    <QueryBuilderInternalContext.Provider value={props.value}>\n      {props.children}\n    </QueryBuilderInternalContext.Provider>\n  )\n}\n\nexport function useQueryBuilderInternalContext(): QueryBuilderInternalContextType {\n  const context = useContext(QueryBuilderInternalContext)\n  if (context == null) {\n    throw new Error(\n      'QueryBuilderInternalContext missing — must be rendered inside QueryBuilderControls',\n    )\n  }\n  return context\n}\n"],"mappings":";;;AAoDA,IAAM,IACJ,EAAsD,IAAI;AAM5D,SAAgB,EACd,GACA;CACA,OACE,kBAAC,EAA4B,UAA7B;EAAsC,OAAO,EAAM;YAChD,EAAM;CAC6B,CAAA;AAE1C;AAEA,SAAgB,IAAkE;CAChF,IAAM,IAAU,EAAW,CAA2B;CACtD,IAAI,KAAW,MACb,MAAU,MACR,oFACF;CAEF,OAAO;AACT"}

package/dist/components/QueryBuilder/qbTreeToReadable.d.ts

@@ -1,5 +1,6 @@
 import { ReactNode } from 'react';
 import { QBGroup } from './QueryBuilderTypes';
+import { QBValueDisplayNameFn } from './useQBValueDisplayName';
 /**
  * Render a QB tree as a plain-English React node with the AND / OR / NOT
  * connectives styled inline. Used by the QB's Reads-As summary bar.
@@ -10,5 +11,5 @@ import { QBGroup } from './QueryBuilderTypes';
  * - Excluded (NOT) groups are always parenthesized and prefixed with NOT.
  * - Incomplete conditions render as `(unset)`.
  */
-export declare function qbTreeToReadable(root: QBGroup, getColumnDisplayName?: (columnName: string) => string): ReactNode;
+export declare function qbTreeToReadable(root: QBGroup, getColumnDisplayName?: (columnName: string) => string, getValueDisplayName?: QBValueDisplayNameFn): ReactNode;
 //# sourceMappingURL=qbTreeToReadable.d.ts.map

package/dist/components/QueryBuilder/qbTreeToReadable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"qbTreeToReadable.d.ts","sourceRoot":"","sources":["../../../src/components/QueryBuilder/qbTreeToReadable.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACjC,OAAO,EAA0B,OAAO,EAAU,MAAM,qBAAqB,CAAA;AAG7E;;;;;;;;;GASG;AACH,wBAAgB,gBAAgB,CAC9B,IAAI,EAAE,OAAO,EACb,oBAAoB,GAAE,CAAC,UAAU,EAAE,MAAM,KAAK,MAAqB,GAClE,SAAS,CAIX"}
+{"version":3,"file":"qbTreeToReadable.d.ts","sourceRoot":"","sources":["../../../src/components/QueryBuilder/qbTreeToReadable.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACjC,OAAO,EAA0B,OAAO,EAAU,MAAM,qBAAqB,CAAA;AAE7E,OAAO,EACL,oBAAoB,EAErB,MAAM,yBAAyB,CAAA;AAEhC;;;;;;;;;GASG;AACH,wBAAgB,gBAAgB,CAC9B,IAAI,EAAE,OAAO,EACb,oBAAoB,GAAE,CAAC,UAAU,EAAE,MAAM,KAAK,MAAqB,EACnE,mBAAmB,GAAE,oBAA4C,GAChE,SAAS,CAKX"}

package/dist/components/QueryBuilder/qbTreeToReadable.js

@@ -1,12 +1,16 @@
-import { labelForFacetValue as e, labelForOp as t } from "./queryBuilderMetadata.js";
-import { isQBGroup as n } from "./QueryBuilderTypes.js";
+import { isQBGroup as e } from "./QueryBuilderTypes.js";
+import { labelForOp as t } from "./queryBuilderMetadata.js";
+import { rawQBValueDisplayName as n } from "./useQBValueDisplayName.js";
 import { Fragment as r, jsx as i, jsxs as a } from "react/jsx-runtime";
 //#region src/components/QueryBuilder/qbTreeToReadable.tsx
-function o(e, t = (e) => e) {
-	return s(e, !0, t) ?? /* @__PURE__ */ i("span", { children: "(no filters)" });
+function o(e, t = (e) => e, r = n) {
+	return s(e, !0, {
+		getColumnDisplayName: t,
+		getValueDisplayName: r
+	}) ?? /* @__PURE__ */ i("span", { children: "(no filters)" });
 }
-function s(e, t, r) {
-	return n(e) ? c(e, t, r) : l(e, r);
+function s(t, n, r) {
+	return e(t) ? c(t, n, r) : l(t, r);
 }
 function c(e, t, n) {
 	let o = e.children.map((e, t) => ({
@@ -32,35 +36,35 @@ function c(e, t, n) {
 	] });
 }
 function l(e, n) {
-	let r = u(e);
-	if (e.columnName == null && r == null) return null;
-	let o = e.columnName ? n(e.columnName) : "(unset)";
-	return r == null ? /* @__PURE__ */ a("span", { children: [/* @__PURE__ */ i("strong", { children: o }), " (unset)"] }) : /* @__PURE__ */ a("span", { children: [
-		/* @__PURE__ */ i("strong", { children: o }),
+	let { getColumnDisplayName: r, getValueDisplayName: o } = n, s = u(e, o);
+	if (e.columnName == null && s == null) return null;
+	let c = e.columnName ? r(e.columnName) : "(unset)";
+	return s == null ? /* @__PURE__ */ a("span", { children: [/* @__PURE__ */ i("strong", { children: c }), " (unset)"] }) : /* @__PURE__ */ a("span", { children: [
+		/* @__PURE__ */ i("strong", { children: c }),
 		" ",
 		t(e.op),
 		" ",
-		r
+		s
 	] });
 }
-function u(t) {
-	let { op: n, values: r, rangeMin: i, rangeMax: a, text: o } = t;
-	switch (n) {
+function u(e, t) {
+	let { columnName: n, op: r, values: i, rangeMin: a, rangeMax: o, text: s } = e, c = (e) => t(n, e);
+	switch (r) {
 		case "has_value":
 		case "no_value": return "";
 		case "is_any_of":
-		case "is_all_of": return r.length === 0 ? null : r.map(e).join(", ");
+		case "is_all_of": return i.length === 0 ? null : i.map(c).join(", ");
 		case "equal":
-		case "not_equal": return r.length === 0 ? null : e(r[0]);
-		case "between": return !i || !a ? null : `${i} and ${a}`;
+		case "not_equal": return i.length === 0 ? null : c(i[0]);
+		case "between": return !a || !o ? null : `${a} and ${o}`;
 		case "gt":
-		case "gte": return i || null;
+		case "gte": return a || null;
 		case "lt":
-		case "lte": return a || null;
+		case "lte": return o || null;
 		case "contains":
 		case "starts_with":
 		case "ends_with":
-		case "is_exactly": return o ? `"${o}"` : null;
+		case "is_exactly": return s ? `"${s}"` : null;
 		default: return null;
 	}
 }

package/dist/components/QueryBuilder/qbTreeToReadable.js.map

@@ -1 +1 @@
-{"version":3,"file":"qbTreeToReadable.js","names":[],"sources":["../../../src/components/QueryBuilder/qbTreeToReadable.tsx"],"sourcesContent":["import { ReactNode } from 'react'\nimport { isQBGroup, QBCondition, QBGroup, QBNode } from './QueryBuilderTypes'\nimport { labelForFacetValue, labelForOp } from './queryBuilderMetadata'\n\n/**\n * Render a QB tree as a plain-English React node with the AND / OR / NOT\n * connectives styled inline. Used by the QB's Reads-As summary bar.\n *\n * Rules (per the design's plain-English summary spec):\n * - The root group reads without outer parentheses.\n * - Nested groups retain parentheses.\n * - Excluded (NOT) groups are always parenthesized and prefixed with NOT.\n * - Incomplete conditions render as `(unset)`.\n */\nexport function qbTreeToReadable(\n  root: QBGroup,\n  getColumnDisplayName: (columnName: string) => string = name => name,\n): ReactNode {\n  const rendered = renderNode(root, true, getColumnDisplayName)\n  if (rendered == null) return <span>(no filters)</span>\n  return rendered\n}\n\nfunction renderNode(\n  node: QBNode,\n  isRoot: boolean,\n  getColumnDisplayName: (columnName: string) => string,\n): ReactNode | null {\n  if (isQBGroup(node)) return renderGroup(node, isRoot, getColumnDisplayName)\n  return renderCondition(node, getColumnDisplayName)\n}\n\nfunction renderGroup(\n  group: QBGroup,\n  isRoot: boolean,\n  getColumnDisplayName: (columnName: string) => string,\n): ReactNode | null {\n  const parts = group.children\n    .map((child, index) => ({\n      key: child.id,\n      node: renderNode(child, false, getColumnDisplayName),\n      index,\n    }))\n    .filter(part => part.node != null)\n\n  if (parts.length === 0) return null\n\n  const combinator = group.combinator\n  const inner = parts.map((part, index) => (\n    <span key={part.key}>\n      {index > 0 && (\n        <>\n          {' '}\n          <ConnectiveSpan combinator={combinator} />{' '}\n        </>\n      )}\n      {part.node}\n    </span>\n  ))\n\n  const body = <span>{inner}</span>\n\n  if (group.not) {\n    return (\n      <span>\n        <NotSpan /> ({body})\n      </span>\n    )\n  }\n  if (isRoot) return body\n  return <span>({body})</span>\n}\n\nfunction renderCondition(\n  condition: QBCondition,\n  getColumnDisplayName: (columnName: string) => string,\n): ReactNode | null {\n  const valueSummary = summarizeConditionValue(condition)\n  // Skip fully-blank rows so they don't clutter the summary bar. A row is\n  // fully blank when the user hasn't picked a column AND hasn't entered any\n  // value yet — that's an in-progress row we don't want to narrate.\n  if (condition.columnName == null && valueSummary == null) return null\n  const columnName = condition.columnName\n    ? getColumnDisplayName(condition.columnName)\n    : '(unset)'\n  if (valueSummary == null) {\n    return (\n      <span>\n        <strong>{columnName}</strong> (unset)\n      </span>\n    )\n  }\n  return (\n    <span>\n      <strong>{columnName}</strong> {labelForOp(condition.op)} {valueSummary}\n    </span>\n  )\n}\n\nfunction summarizeConditionValue(condition: QBCondition): string | null {\n  const { op, values, rangeMin, rangeMax, text } = condition\n  switch (op) {\n    case 'has_value':\n    case 'no_value':\n      return ''\n    case 'is_any_of':\n    case 'is_all_of':\n      return values.length === 0\n        ? null\n        : values.map(labelForFacetValue).join(', ')\n    case 'equal':\n    case 'not_equal':\n      return values.length === 0 ? null : labelForFacetValue(values[0])\n    case 'between':\n      if (!rangeMin || !rangeMax) return null\n      return `${rangeMin} and ${rangeMax}`\n    case 'gt':\n    case 'gte':\n      return rangeMin ? rangeMin : null\n    case 'lt':\n    case 'lte':\n      return rangeMax ? rangeMax : null\n    case 'contains':\n    case 'starts_with':\n    case 'ends_with':\n    case 'is_exactly':\n      return text ? `\"${text}\"` : null\n    default:\n      op satisfies never\n      return null\n  }\n}\n\nfunction ConnectiveSpan({ combinator }: { combinator: 'AND' | 'OR' }) {\n  const color =\n    combinator === 'OR'\n      ? 'var(--synapse-warning)'\n      : 'var(--synapse-primary-action-color)'\n  return (\n    <span style={{ color, fontWeight: 700 }} aria-hidden=\"false\">\n      {combinator}\n    </span>\n  )\n}\n\nfunction NotSpan() {\n  return (\n    <span style={{ color: 'var(--synapse-error)', fontWeight: 700 }}>NOT</span>\n  )\n}\n"],"mappings":";;;;AAcA,SAAgB,EACd,GACA,KAAuD,MAAQ,GACpD;CAGX,OAFiB,EAAW,GAAM,IAAM,CACpC,KAAyB,kBAAC,QAAD,EAAA,UAAM,eAAkB,CAAA;AAEvD;AAEA,SAAS,EACP,GACA,GACA,GACkB;CAElB,OADI,EAAU,CAAI,IAAU,EAAY,GAAM,GAAQ,CAAoB,IACnE,EAAgB,GAAM,CAAoB;AACnD;AAEA,SAAS,EACP,GACA,GACA,GACkB;CAClB,IAAM,IAAQ,EAAM,SACjB,KAAK,GAAO,OAAW;EACtB,KAAK,EAAM;EACX,MAAM,EAAW,GAAO,IAAO,CAAoB;EACnD;CACF,EAAE,EACD,QAAO,MAAQ,EAAK,QAAQ,IAAI;CAEnC,IAAI,EAAM,WAAW,GAAG,OAAO;CAE/B,IAAM,IAAa,EAAM,YAanB,IAAO,kBAAC,QAAD,EAAA,UAZC,EAAM,KAAK,GAAM,MAC7B,kBAAC,QAAD,EAAA,UAAA,CACG,IAAQ,KACP,kBAAA,GAAA,EAAA,UAAA;EACG;EACD,kBAAC,GAAD,EAA4B,cAAa,CAAA;EAAE;CAC3C,EAAA,CAAA,GAEH,EAAK,IACF,EAAA,GARK,EAAK,GAQV,CAGY,EAAY,CAAA;CAUhC,OARI,EAAM,MAEN,kBAAC,QAAD,EAAA,UAAA;EACE,kBAAC,GAAD,CAAU,CAAA;EAAC;EAAG;EAAK;CACf,EAAA,CAAA,IAGN,IAAe,IACZ,kBAAC,QAAD,EAAA,UAAA;EAAM;EAAE;EAAK;CAAO,EAAA,CAAA;AAC7B;AAEA,SAAS,EACP,GACA,GACkB;CAClB,IAAM,IAAe,EAAwB,CAAS;CAItD,IAAI,EAAU,cAAc,QAAQ,KAAgB,MAAM,OAAO;CACjE,IAAM,IAAa,EAAU,aACzB,EAAqB,EAAU,UAAU,IACzC;CAQJ,OAPI,KAAgB,OAEhB,kBAAC,QAAD,EAAA,UAAA,CACE,kBAAC,UAAD,EAAA,UAAS,EAAmB,CAAA,GAAC,UACzB,EAAA,CAAA,IAIR,kBAAC,QAAD,EAAA,UAAA;EACE,kBAAC,UAAD,EAAA,UAAS,EAAmB,CAAA;EAAC;EAAE,EAAW,EAAU,EAAE;EAAE;EAAE;CACtD,EAAA,CAAA;AAEV;AAEA,SAAS,EAAwB,GAAuC;CACtE,IAAM,EAAE,OAAI,WAAQ,aAAU,aAAU,YAAS;CACjD,QAAQ,GAAR;EACE,KAAK;EACL,KAAK,YACH,OAAO;EACT,KAAK;EACL,KAAK,aACH,OAAO,EAAO,WAAW,IACrB,OACA,EAAO,IAAI,CAAkB,EAAE,KAAK,IAAI;EAC9C,KAAK;EACL,KAAK,aACH,OAAO,EAAO,WAAW,IAAI,OAAO,EAAmB,EAAO,EAAE;EAClE,KAAK,WAEH,OADI,CAAC,KAAY,CAAC,IAAiB,OAC5B,GAAG,EAAS,OAAO;EAC5B,KAAK;EACL,KAAK,OACH,OAAO,KAAsB;EAC/B,KAAK;EACL,KAAK,OACH,OAAO,KAAsB;EAC/B,KAAK;EACL,KAAK;EACL,KAAK;EACL,KAAK,cACH,OAAO,IAAO,IAAI,EAAK,KAAK;EAC9B,SAEE,OAAO;CACX;AACF;AAEA,SAAS,EAAe,EAAE,iBAA4C;CAKpE,OACE,kBAAC,QAAD;EAAM,OAAO;GAAE,OAJf,MAAe,OACX,2BACA;GAEkB,YAAY;EAAI;EAAG,eAAY;YAClD;CACG,CAAA;AAEV;AAEA,SAAS,IAAU;CACjB,OACE,kBAAC,QAAD;EAAM,OAAO;GAAE,OAAO;GAAwB,YAAY;EAAI;YAAG;CAAS,CAAA;AAE9E"}
+{"version":3,"file":"qbTreeToReadable.js","names":[],"sources":["../../../src/components/QueryBuilder/qbTreeToReadable.tsx"],"sourcesContent":["import { ReactNode } from 'react'\nimport { isQBGroup, QBCondition, QBGroup, QBNode } from './QueryBuilderTypes'\nimport { labelForOp } from './queryBuilderMetadata'\nimport {\n  QBValueDisplayNameFn,\n  rawQBValueDisplayName,\n} from './useQBValueDisplayName'\n\n/**\n * Render a QB tree as a plain-English React node with the AND / OR / NOT\n * connectives styled inline. Used by the QB's Reads-As summary bar.\n *\n * Rules (per the design's plain-English summary spec):\n * - The root group reads without outer parentheses.\n * - Nested groups retain parentheses.\n * - Excluded (NOT) groups are always parenthesized and prefixed with NOT.\n * - Incomplete conditions render as `(unset)`.\n */\nexport function qbTreeToReadable(\n  root: QBGroup,\n  getColumnDisplayName: (columnName: string) => string = name => name,\n  getValueDisplayName: QBValueDisplayNameFn = rawQBValueDisplayName,\n): ReactNode {\n  const displayNames = { getColumnDisplayName, getValueDisplayName }\n  const rendered = renderNode(root, true, displayNames)\n  if (rendered == null) return <span>(no filters)</span>\n  return rendered\n}\n\ntype DisplayNames = {\n  getColumnDisplayName: (columnName: string) => string\n  getValueDisplayName: QBValueDisplayNameFn\n}\n\nfunction renderNode(\n  node: QBNode,\n  isRoot: boolean,\n  displayNames: DisplayNames,\n): ReactNode | null {\n  if (isQBGroup(node)) return renderGroup(node, isRoot, displayNames)\n  return renderCondition(node, displayNames)\n}\n\nfunction renderGroup(\n  group: QBGroup,\n  isRoot: boolean,\n  displayNames: DisplayNames,\n): ReactNode | null {\n  const parts = group.children\n    .map((child, index) => ({\n      key: child.id,\n      node: renderNode(child, false, displayNames),\n      index,\n    }))\n    .filter(part => part.node != null)\n\n  if (parts.length === 0) return null\n\n  const combinator = group.combinator\n  const inner = parts.map((part, index) => (\n    <span key={part.key}>\n      {index > 0 && (\n        <>\n          {' '}\n          <ConnectiveSpan combinator={combinator} />{' '}\n        </>\n      )}\n      {part.node}\n    </span>\n  ))\n\n  const body = <span>{inner}</span>\n\n  if (group.not) {\n    return (\n      <span>\n        <NotSpan /> ({body})\n      </span>\n    )\n  }\n  if (isRoot) return body\n  return <span>({body})</span>\n}\n\nfunction renderCondition(\n  condition: QBCondition,\n  displayNames: DisplayNames,\n): ReactNode | null {\n  const { getColumnDisplayName, getValueDisplayName } = displayNames\n  const valueSummary = summarizeConditionValue(condition, getValueDisplayName)\n  // Skip fully-blank rows so they don't clutter the summary bar. A row is\n  // fully blank when the user hasn't picked a column AND hasn't entered any\n  // value yet — that's an in-progress row we don't want to narrate.\n  if (condition.columnName == null && valueSummary == null) return null\n  const columnName = condition.columnName\n    ? getColumnDisplayName(condition.columnName)\n    : '(unset)'\n  if (valueSummary == null) {\n    return (\n      <span>\n        <strong>{columnName}</strong> (unset)\n      </span>\n    )\n  }\n  return (\n    <span>\n      <strong>{columnName}</strong> {labelForOp(condition.op)} {valueSummary}\n    </span>\n  )\n}\n\nfunction summarizeConditionValue(\n  condition: QBCondition,\n  getValueDisplayName: QBValueDisplayNameFn,\n): string | null {\n  const { columnName, op, values, rangeMin, rangeMax, text } = condition\n  const labelForValue = (value: string) =>\n    getValueDisplayName(columnName, value)\n  switch (op) {\n    case 'has_value':\n    case 'no_value':\n      return ''\n    case 'is_any_of':\n    case 'is_all_of':\n      return values.length === 0 ? null : values.map(labelForValue).join(', ')\n    case 'equal':\n    case 'not_equal':\n      return values.length === 0 ? null : labelForValue(values[0])\n    case 'between':\n      if (!rangeMin || !rangeMax) return null\n      return `${rangeMin} and ${rangeMax}`\n    case 'gt':\n    case 'gte':\n      return rangeMin ? rangeMin : null\n    case 'lt':\n    case 'lte':\n      return rangeMax ? rangeMax : null\n    case 'contains':\n    case 'starts_with':\n    case 'ends_with':\n    case 'is_exactly':\n      return text ? `\"${text}\"` : null\n    default:\n      op satisfies never\n      return null\n  }\n}\n\nfunction ConnectiveSpan({ combinator }: { combinator: 'AND' | 'OR' }) {\n  const color =\n    combinator === 'OR'\n      ? 'var(--synapse-warning)'\n      : 'var(--synapse-primary-action-color)'\n  return (\n    <span style={{ color, fontWeight: 700 }} aria-hidden=\"false\">\n      {combinator}\n    </span>\n  )\n}\n\nfunction NotSpan() {\n  return (\n    <span style={{ color: 'var(--synapse-error)', fontWeight: 700 }}>NOT</span>\n  )\n}\n"],"mappings":"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"}

package/dist/components/QueryBuilder/queryBuilderDnd.d.ts

@@ -0,0 +1,27 @@
+import { DragEndEvent, DragOverEvent } from '@dnd-kit/react';
+import { QBGroup } from './QueryBuilderTypes';
+/** Droppable id for a group's drop zone, kept distinct from the group's own id. */
+export declare function groupDropZoneId(groupId: string): string;
+/** `data` a group's drop zone carries so a drop can name its destination. */
+export declare function groupDropZoneData(groupId: string): {
+    groupId: string;
+};
+/**
+ * The group a drop zone belongs to, or null when the drop landed on a
+ * droppable that is not one — nothing else in the tree registers a zone, so
+ * that is the signal to leave the tree alone.
+ */
+export declare function readGroupDropZoneTarget(data: unknown): string | null;
+export type QueryBuilderDragHandlers = {
+    onDragStart: () => void;
+    onDragOver: (event: DragOverEvent) => void;
+    onDragEnd: (event: DragEndEvent) => void;
+};
+/**
+ * Drag-and-drop for the Query Builder tree, as handlers for `DragDropProvider`.
+ *
+ * Every drag means "put this node in that group": groups register the only
+ * drop zones, and a dropped node joins the group it was released over.
+ */
+export declare function useQueryBuilderDrag(tree: QBGroup, onTreeChange: (next: QBGroup) => void): QueryBuilderDragHandlers;
+//# sourceMappingURL=queryBuilderDnd.d.ts.map

package/dist/components/QueryBuilder/queryBuilderDnd.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"queryBuilderDnd.d.ts","sourceRoot":"","sources":["../../../src/components/QueryBuilder/queryBuilderDnd.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAA;AAG5D,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAA;AAE7C,mFAAmF;AACnF,wBAAgB,eAAe,CAAC,OAAO,EAAE,MAAM,GAAG,MAAM,CAEvD;AAID,6EAA6E;AAC7E,wBAAgB,iBAAiB,CAAC,OAAO,EAAE,MAAM;;EAEhD;AAED;;;;GAIG;AACH,wBAAgB,uBAAuB,CAAC,IAAI,EAAE,OAAO,GAAG,MAAM,GAAG,IAAI,CAIpE;AAED,MAAM,MAAM,wBAAwB,GAAG;IACrC,WAAW,EAAE,MAAM,IAAI,CAAA;IACvB,UAAU,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,IAAI,CAAA;IAC1C,SAAS,EAAE,CAAC,KAAK,EAAE,YAAY,KAAK,IAAI,CAAA;CACzC,CAAA;AAED;;;;;GAKG;AACH,wBAAgB,mBAAmB,CACjC,IAAI,EAAE,OAAO,EACb,YAAY,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,GACpC,wBAAwB,CA+C1B"}

package/dist/components/QueryBuilder/queryBuilderDnd.js

@@ -0,0 +1,41 @@
+import { moveNodeIntoGroup as e } from "./queryBuilderOperations.js";
+import { useCallback as t, useMemo as n, useRef as r } from "react";
+//#region src/components/QueryBuilder/queryBuilderDnd.ts
+function i(e) {
+	return `${e}::dropzone`;
+}
+var a = "groupId";
+function o(e) {
+	return { [a]: e };
+}
+function s(e) {
+	if (typeof e != "object" || !e) return null;
+	let t = e[a];
+	return typeof t == "string" ? t : null;
+}
+function c(i, a) {
+	let o = t((t) => {
+		let { source: n, target: r } = t;
+		if (n == null || r == null) return;
+		let o = s(r.data);
+		o != null && a(e(i, String(n.id), o));
+	}, [i, a]), c = r(null), l = t(() => {
+		c.current = i;
+	}, [i]), u = t((e) => o(e.operation), [o]), d = t((e) => {
+		let t = c.current;
+		c.current = null, e.operation.canceled && t != null && a(t);
+	}, [a]);
+	return n(() => ({
+		onDragStart: l,
+		onDragOver: u,
+		onDragEnd: d
+	}), [
+		l,
+		u,
+		d
+	]);
+}
+//#endregion
+export { o as groupDropZoneData, i as groupDropZoneId, s as readGroupDropZoneTarget, c as useQueryBuilderDrag };
+
+//# sourceMappingURL=queryBuilderDnd.js.map

package/dist/components/QueryBuilder/queryBuilderDnd.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"queryBuilderDnd.js","names":[],"sources":["../../../src/components/QueryBuilder/queryBuilderDnd.ts"],"sourcesContent":["import { DragEndEvent, DragOverEvent } from '@dnd-kit/react'\nimport { useCallback, useMemo, useRef } from 'react'\nimport { moveNodeIntoGroup } from './queryBuilderOperations'\nimport { QBGroup } from './QueryBuilderTypes'\n\n/** Droppable id for a group's drop zone, kept distinct from the group's own id. */\nexport function groupDropZoneId(groupId: string): string {\n  return `${groupId}::dropzone`\n}\n\nconst GROUP_ID_KEY = 'groupId'\n\n/** `data` a group's drop zone carries so a drop can name its destination. */\nexport function groupDropZoneData(groupId: string) {\n  return { [GROUP_ID_KEY]: groupId }\n}\n\n/**\n * The group a drop zone belongs to, or null when the drop landed on a\n * droppable that is not one — nothing else in the tree registers a zone, so\n * that is the signal to leave the tree alone.\n */\nexport function readGroupDropZoneTarget(data: unknown): string | null {\n  if (data == null || typeof data !== 'object') return null\n  const groupId: unknown = (data as Record<string, unknown>)[GROUP_ID_KEY]\n  return typeof groupId === 'string' ? groupId : null\n}\n\nexport type QueryBuilderDragHandlers = {\n  onDragStart: () => void\n  onDragOver: (event: DragOverEvent) => void\n  onDragEnd: (event: DragEndEvent) => void\n}\n\n/**\n * Drag-and-drop for the Query Builder tree, as handlers for `DragDropProvider`.\n *\n * Every drag means \"put this node in that group\": groups register the only\n * drop zones, and a dropped node joins the group it was released over.\n */\nexport function useQueryBuilderDrag(\n  tree: QBGroup,\n  onTreeChange: (next: QBGroup) => void,\n): QueryBuilderDragHandlers {\n  const dropIntoHoveredGroup = useCallback(\n    (operation: DragOverEvent['operation']) => {\n      const { source, target } = operation\n      if (source == null || target == null) return\n      const groupId = readGroupDropZoneTarget(target.data)\n      if (groupId == null) return\n      onTreeChange(moveNodeIntoGroup(tree, String(source.id), groupId))\n    },\n    [tree, onTreeChange],\n  )\n\n  // The tree as it stood before the in-flight drag. `onDragOver` rewrites the\n  // tree as the pointer moves, so this snapshot is the only way back if the\n  // gesture is canceled — dnd-kit reverts its own state, never ours.\n  const treeBeforeDrag = useRef<QBGroup | null>(null)\n\n  const onDragStart = useCallback(() => {\n    treeBeforeDrag.current = tree\n  }, [tree])\n\n  // Moving the node as the pointer crosses into a group is what keeps React\n  // state and the DOM in step within the gesture, which is the contract\n  // dnd-kit's sortables expect: rows animate to their new positions, and any\n  // optimistic sorting stands down on seeing the indices already updated\n  // rather than reordering the DOM behind React's back.\n  const onDragOver = useCallback(\n    (event: DragOverEvent) => dropIntoHoveredGroup(event.operation),\n    [dropIntoHoveredGroup],\n  )\n\n  // The destination depends only on which group is under the pointer, and\n  // `dragover` already fired for that group, so a release has nothing left to\n  // apply — the tree already shows the result.\n  const onDragEnd = useCallback(\n    (event: DragEndEvent) => {\n      const snapshot = treeBeforeDrag.current\n      treeBeforeDrag.current = null\n      if (event.operation.canceled && snapshot != null) onTreeChange(snapshot)\n    },\n    [onTreeChange],\n  )\n\n  return useMemo(\n    () => ({ onDragStart, onDragOver, onDragEnd }),\n    [onDragStart, onDragOver, onDragEnd],\n  )\n}\n"],"mappings":";;;AAMA,SAAgB,EAAgB,GAAyB;CACvD,OAAO,GAAG,EAAQ;AACpB;AAEA,IAAM,IAAe;AAGrB,SAAgB,EAAkB,GAAiB;CACjD,OAAO,GAAG,IAAe,EAAQ;AACnC;AAOA,SAAgB,EAAwB,GAA8B;CACpE,IAAoB,OAAO,KAAS,aAAhC,GAA0C,OAAO;CACrD,IAAM,IAAoB,EAAiC;CAC3D,OAAO,OAAO,KAAY,WAAW,IAAU;AACjD;AAcA,SAAgB,EACd,GACA,GAC0B;CAC1B,IAAM,IAAuB,GAC1B,MAA0C;EACzC,IAAM,EAAE,WAAQ,cAAW;EAC3B,IAAI,KAAU,QAAQ,KAAU,MAAM;EACtC,IAAM,IAAU,EAAwB,EAAO,IAAI;EAC/C,KAAW,QACf,EAAa,EAAkB,GAAM,OAAO,EAAO,EAAE,GAAG,CAAO,CAAC;CAClE,GACA,CAAC,GAAM,CAAY,CACrB,GAKM,IAAiB,EAAuB,IAAI,GAE5C,IAAc,QAAkB;EACpC,EAAe,UAAU;CAC3B,GAAG,CAAC,CAAI,CAAC,GAOH,IAAa,GAChB,MAAyB,EAAqB,EAAM,SAAS,GAC9D,CAAC,CAAoB,CACvB,GAKM,IAAY,GACf,MAAwB;EACvB,IAAM,IAAW,EAAe;EAEhC,AADA,EAAe,UAAU,MACrB,EAAM,UAAU,YAAY,KAAY,QAAM,EAAa,CAAQ;CACzE,GACA,CAAC,CAAY,CACf;CAEA,OAAO,SACE;EAAE;EAAa;EAAY;CAAU,IAC5C;EAAC;EAAa;EAAY;CAAS,CACrC;AACF"}

package/dist/components/QueryBuilder/queryBuilderDrag.css

@@ -0,0 +1 @@
+._dragHandle_p23fj_1{cursor:grab;color:var(--synapse-gray-deemphasized)}._dragSource_p23fj_6{opacity:var(--synapse-drag-source-opacity)}

package/dist/components/QueryBuilder/queryBuilderDrag.module.js

@@ -0,0 +1,8 @@
+import './queryBuilderDrag.css';var e = {
+	dragHandle: "_dragHandle_p23fj_1",
+	dragSource: "_dragSource_p23fj_6"
+};
+//#endregion
+export { e as default };
+
+//# sourceMappingURL=queryBuilderDrag.module.js.map

package/dist/components/QueryBuilder/queryBuilderDrag.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"queryBuilderDrag.module.js","names":[],"sources":["../../../src/components/QueryBuilder/queryBuilderDrag.module.scss"],"sourcesContent":["// Styles shared by both draggable node types in the tree.\n\n.dragHandle {\n  cursor: grab;\n  color: var(--synapse-gray-deemphasized);\n}\n\n// The node the pointer is carrying. It stays in the tree and moves between\n// groups as the drag goes, so it is dimmed to read as in-flight.\n.dragSource {\n  opacity: var(--synapse-drag-source-opacity);\n}\n"],"mappings":""}

package/dist/components/QueryBuilder/queryBuilderDrag.module.scss

@@ -0,0 +1,12 @@
+// Styles shared by both draggable node types in the tree.
+
+.dragHandle {
+  cursor: grab;
+  color: var(--synapse-gray-deemphasized);
+}
+
+// The node the pointer is carrying. It stays in the tree and moves between
+// groups as the drag goes, so it is dimmed to read as in-flight.
+.dragSource {
+  opacity: var(--synapse-drag-source-opacity);
+}