@gooddata/sdk-ui-metric-component 0.0.0-stage → 11.65.0-alpha.10

package/esm/shared/Form/useFormDefaults.js

@@ -0,0 +1,7 @@
+// (C) 2022-2026 GoodData Corporation
+import { useContext } from "react";
+import { FormContext } from "./FormContext.js";
+export function useFormDefaults() {
+    const { defaultValues } = useContext(FormContext);
+    return defaultValues;
+}

package/esm/shared/Form/useFormDirty.d.ts

@@ -0,0 +1,2 @@
+export declare function useFormDirty<T>(field?: keyof T): boolean;
+//# sourceMappingURL=useFormDirty.d.ts.map

package/esm/shared/Form/useFormDirty.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFormDirty.d.ts","sourceRoot":"","sources":["../../../src/shared/Form/useFormDirty.ts"],"names":[],"mappings":"AAMA,wBAAgB,YAAY,CAAC,CAAC,EAAE,KAAK,CAAC,EAAE,MAAM,CAAC,GAAG,OAAO,CAYxD"}

package/esm/shared/Form/useFormDirty.js

@@ -0,0 +1,13 @@
+// (C) 2022-2026 GoodData Corporation
+import { useContext, useMemo } from "react";
+import { FormContext } from "./FormContext.js";
+export function useFormDirty(field) {
+    const { currentValues, defaultValues, formStatus } = useContext(FormContext);
+    const { isDirty = false } = formStatus || {};
+    return useMemo(() => {
+        if (field) {
+            return currentValues[field] !== defaultValues[field];
+        }
+        return isDirty;
+    }, [currentValues, defaultValues, field, isDirty]);
+}

package/esm/shared/Form/useFormErrors.d.ts

@@ -0,0 +1,3 @@
+import { type ValidationError } from "yup";
+export declare function useFormErrors<T>(field?: keyof T): ValidationError[];
+//# sourceMappingURL=useFormErrors.d.ts.map

package/esm/shared/Form/useFormErrors.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFormErrors.d.ts","sourceRoot":"","sources":["../../../src/shared/Form/useFormErrors.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,KAAK,CAAC;AAI3C,wBAAgB,aAAa,CAAC,CAAC,EAAE,KAAK,CAAC,EAAE,MAAM,CAAC,GAAG,eAAe,EAAE,CAkBnE"}

package/esm/shared/Form/useFormErrors.js

@@ -0,0 +1,18 @@
+// (C) 2022-2026 GoodData Corporation
+import { useContext, useMemo } from "react";
+import { FormContext } from "./FormContext.js";
+export function useFormErrors(field) {
+    const { formStatus, changedValues, touchedValues } = useContext(FormContext);
+    const { validation } = formStatus || {};
+    const { errors } = validation || {};
+    // Touched as well as changed: leaving a field the user never typed in still has to show
+    // why it is invalid, without marking it edited.
+    const seen = (field && (touchedValues[field] || changedValues[field])) || false;
+    return useMemo(() => {
+        const errs = errors || [];
+        if (field) {
+            return seen ? errs.filter((err) => err.path === field.toString()) : [];
+        }
+        return errs.slice();
+    }, [errors, field, seen]);
+}

package/esm/shared/Form/useFormField.d.ts

@@ -0,0 +1,24 @@
+import { type ChangeEvent, type RefObject } from "react";
+import { type ValidationError } from "yup";
+export type FieldStatus<T, V> = {
+    element: RefObject<HTMLElement | null>;
+    field: keyof T;
+    error: ValidationError | null;
+    errors: ValidationError[];
+    valid: boolean;
+    value: V;
+    dirty: boolean;
+    changed: boolean;
+    onFocus: (e?: FocusEvent) => void;
+    onBlur: (e?: FocusEvent) => void;
+    onChange: (value: V, e?: ChangeEvent) => void;
+    setValue: (value: V) => void;
+};
+export type FieldProps<V> = {
+    defaultValue?: V;
+    onFocus?: (e?: FocusEvent) => void;
+    onBlur?: (e?: FocusEvent) => void;
+    onChange?: (value: V, e?: ChangeEvent) => void;
+};
+export declare function useFormField<V, T>(field: keyof T, { onBlur, onChange, onFocus, defaultValue }?: FieldProps<V>): FieldStatus<T, V>;
+//# sourceMappingURL=useFormField.d.ts.map

package/esm/shared/Form/useFormField.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFormField.d.ts","sourceRoot":"","sources":["../../../src/shared/Form/useFormField.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,WAAW,EAAgB,KAAK,SAAS,EAA2B,MAAM,OAAO,CAAC;AAEhG,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,KAAK,CAAC;AAS3C,MAAM,MAAM,WAAW,CAAC,CAAC,EAAE,CAAC,IAAI;IAC5B,OAAO,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IACvC,KAAK,EAAE,MAAM,CAAC,CAAC;IACf,KAAK,EAAE,eAAe,GAAG,IAAI,CAAC;IAC9B,MAAM,EAAE,eAAe,EAAE,CAAC;IAC1B,KAAK,EAAE,OAAO,CAAC;IACf,KAAK,EAAE,CAAC,CAAC;IACT,KAAK,EAAE,OAAO,CAAC;IACf,OAAO,EAAE,OAAO,CAAC;IAEjB,OAAO,EAAE,CAAC,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IAClC,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IACjC,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,WAAW,KAAK,IAAI,CAAC;IAC9C,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;CAChC,CAAC;AAEF,MAAM,MAAM,UAAU,CAAC,CAAC,IAAI;IACxB,YAAY,CAAC,EAAE,CAAC,CAAC;IACjB,OAAO,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IACnC,MAAM,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IAClC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,WAAW,KAAK,IAAI,CAAC;CAClD,CAAC;AAEF,wBAAgB,YAAY,CAAC,CAAC,EAAE,CAAC,EAC7B,KAAK,EAAE,MAAM,CAAC,EACd,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,YAAY,EAAE,GAAE,UAAU,CAAC,CAAC,CAAM,GAChE,WAAW,CAAC,CAAC,EAAE,CAAC,CAAC,CAmEnB"}

package/esm/shared/Form/useFormField.js

@@ -0,0 +1,60 @@
+// (C) 2022-2026 GoodData Corporation
+import { useCallback, useContext } from "react";
+import { FormContext } from "./FormContext.js";
+import { useFormChanged } from "./useFormChanged.js";
+import { useFormDirty } from "./useFormDirty.js";
+import { useFormErrors } from "./useFormErrors.js";
+import { useFormFieldElementRef } from "./useFormFieldElementRef.js";
+import { useFormValues } from "./useFormValues.js";
+export function useFormField(field, { onBlur, onChange, onFocus, defaultValue } = {}) {
+    const { setValues, setChanged, setTouched, setActive, setBlur } = useContext(FormContext);
+    const errors = useFormErrors(field);
+    const values = useFormValues();
+    const dirty = useFormDirty(field);
+    const changed = useFormChanged(field);
+    const element = useFormFieldElementRef(field);
+    const onBlurHandler = useCallback((e) => {
+        setTouched({ [field]: true });
+        setActive(null);
+        setBlur(field);
+        if (onBlur) {
+            onBlur(e);
+        }
+    }, [field, onBlur, setActive, setTouched, setBlur]);
+    const onFocusHandler = useCallback((e) => {
+        setActive(field);
+        if (onFocus) {
+            onFocus(e);
+        }
+    }, [field, onFocus, setActive]);
+    const onChangeHandler = useCallback((value, e) => {
+        setValues({ [field]: value });
+        setChanged({ [field]: true });
+        if (onChange) {
+            onChange(value, e);
+        }
+    }, [field, onChange, setChanged, setValues]);
+    const setValueHandler = useCallback((value) => {
+        setValues({
+            [field]: value,
+        });
+        if (onChange) {
+            onChange(value);
+        }
+    }, [field, onChange, setValues]);
+    return {
+        field,
+        errors,
+        dirty,
+        changed,
+        element,
+        error: errors[0] || null,
+        valid: errors.length === 0,
+        value: (values[field] ?? defaultValue),
+        //handlers
+        onFocus: onFocusHandler,
+        onBlur: onBlurHandler,
+        onChange: onChangeHandler,
+        setValue: setValueHandler,
+    };
+}

package/esm/shared/Form/useFormFieldElementRef.d.ts

@@ -0,0 +1,3 @@
+import { type RefObject } from "react";
+export declare function useFormFieldElementRef<T>(field: keyof T): RefObject<HTMLElement | null>;
+//# sourceMappingURL=useFormFieldElementRef.d.ts.map

package/esm/shared/Form/useFormFieldElementRef.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFormFieldElementRef.d.ts","sourceRoot":"","sources":["../../../src/shared/Form/useFormFieldElementRef.ts"],"names":[],"mappings":"AAEA,OAAO,EAAgB,KAAK,SAAS,EAAyB,MAAM,OAAO,CAAC;AAI5E,wBAAgB,sBAAsB,CAAC,CAAC,EAAE,KAAK,EAAE,MAAM,CAAC,GAAG,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAGvF"}

package/esm/shared/Form/useFormFieldElementRef.js

@@ -0,0 +1,10 @@
+// (C) 2022-2026 GoodData Corporation
+import { createRef, useContext } from "react";
+import { FormContext } from "./FormContext.js";
+export function useFormFieldElementRef(field) {
+    const { elements } = useContext(FormContext);
+    return createOrGetElement(elements, field);
+}
+function createOrGetElement(elements, field) {
+    return elements[field] || (elements[field] = createRef());
+}

package/esm/shared/Form/useFormHandlers.d.ts

@@ -0,0 +1,8 @@
+export type FormHandlers<T> = {
+    onForceSave: (data?: Partial<T>) => Promise<void>;
+    onSave: () => Promise<void>;
+    onSaveAs: () => Promise<void>;
+    onClose: () => void;
+};
+export declare function useFormHandlers<T>(): FormHandlers<T>;
+//# sourceMappingURL=useFormHandlers.d.ts.map

package/esm/shared/Form/useFormHandlers.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFormHandlers.d.ts","sourceRoot":"","sources":["../../../src/shared/Form/useFormHandlers.ts"],"names":[],"mappings":"AAOA,MAAM,MAAM,YAAY,CAAC,CAAC,IAAI;IAC1B,WAAW,EAAE,CAAC,IAAI,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAClD,MAAM,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAC5B,QAAQ,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IAC9B,OAAO,EAAE,MAAM,IAAI,CAAC;CACvB,CAAC;AAEF,wBAAgB,eAAe,CAAC,CAAC,KAAK,YAAY,CAAC,CAAC,CAAC,CAgEpD"}

package/esm/shared/Form/useFormHandlers.js

@@ -0,0 +1,45 @@
+// (C) 2022-2026 GoodData Corporation
+import { useCallback, useContext } from "react";
+import { FormContext } from "./FormContext.js";
+import { useInvalidFocusField } from "./hooks/useInvalidFocusField.js";
+export function useFormHandlers() {
+    const { formHandlers, formStatus, currentValues, getFormState, setFocus, setSaving } = useContext(FormContext);
+    const { onSave, onSaveAs, onClose, transformer, invalidFocus } = formHandlers;
+    const { isValid = false, isSaveDisabled = true, isSaveAsDisabled = true, isEditable = false, isWriteable = false, } = formStatus || {};
+    const canSave = !isSaveDisabled && isEditable;
+    const canSaveAs = !isSaveAsDisabled && isWriteable;
+    const invalidFocusField = useInvalidFocusField(invalidFocus);
+    const onSaveHandler = useCallback(() => {
+        const currentValues = getFormState().currentValues;
+        setSaving(true);
+        return trySave(canSave, isValid, () => onSave(transformer(currentValues), false), () => setFocus(invalidFocusField)).then(() => setSaving(false));
+    }, [canSave, invalidFocusField, isValid, getFormState, onSave, setFocus, setSaving, transformer]);
+    const onForceSaveHandler = useCallback((data = {}) => {
+        const currentValues = getFormState().currentValues;
+        setSaving(true);
+        return trySave(canSave, isValid, () => onSave(transformer({ ...currentValues, ...data }), true), () => setFocus(invalidFocusField)).then(() => setSaving(false));
+    }, [canSave, invalidFocusField, isValid, getFormState, onSave, setFocus, setSaving, transformer]);
+    const onSaveAsHandler = useCallback(() => {
+        const currentValues = getFormState().currentValues;
+        setSaving(true);
+        return trySave(canSaveAs, isValid, () => onSaveAs(transformer(currentValues)), () => setFocus(invalidFocusField)).then(() => setSaving(false));
+    }, [canSaveAs, invalidFocusField, isValid, getFormState, onSaveAs, setFocus, setSaving, transformer]);
+    const onCloseHandler = useCallback(() => {
+        onClose(transformer(currentValues), isValid);
+    }, [currentValues, isValid, onClose, transformer]);
+    return {
+        onForceSave: onForceSaveHandler,
+        onSave: onSaveHandler,
+        onSaveAs: onSaveAsHandler,
+        onClose: onCloseHandler,
+    };
+}
+function trySave(canSave, isValid, onSave, onInvalid) {
+    const promise = canSave && isValid ? onSave() : Promise.resolve();
+    promise.then(() => {
+        if (!isValid) {
+            onInvalid();
+        }
+    });
+    return promise;
+}

package/esm/shared/Form/useFormStatus.d.ts

@@ -0,0 +1,3 @@
+import { type FormStatus } from "./hooks/useFormStatusInternal.js";
+export declare function useFormStatus<T, S>(): FormStatus<T, S>;
+//# sourceMappingURL=useFormStatus.d.ts.map

package/esm/shared/Form/useFormStatus.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFormStatus.d.ts","sourceRoot":"","sources":["../../../src/shared/Form/useFormStatus.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,KAAK,UAAU,EAAE,MAAM,kCAAkC,CAAC;AAEnE,wBAAgB,aAAa,CAAC,CAAC,EAAE,CAAC,KAAK,UAAU,CAAC,CAAC,EAAE,CAAC,CAAC,CAQtD"}

package/esm/shared/Form/useFormStatus.js

@@ -0,0 +1,10 @@
+// (C) 2022-2026 GoodData Corporation
+import { useContext } from "react";
+import { FormContext } from "./FormContext.js";
+export function useFormStatus() {
+    const { formStatus } = useContext(FormContext);
+    if (!formStatus) {
+        throw new Error(`Can not use form status without status set.`);
+    }
+    return formStatus;
+}

package/esm/shared/Form/useFormValues.d.ts

@@ -0,0 +1,3 @@
+export declare function useFormValues<T>(): T;
+export declare function useFormValuesGetter<T>(): () => T;
+//# sourceMappingURL=useFormValues.d.ts.map

package/esm/shared/Form/useFormValues.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFormValues.d.ts","sourceRoot":"","sources":["../../../src/shared/Form/useFormValues.ts"],"names":[],"mappings":"AAMA,wBAAgB,aAAa,CAAC,CAAC,KAAK,CAAC,CAGpC;AAED,wBAAgB,mBAAmB,CAAC,CAAC,KAAK,MAAM,CAAC,CAGhD"}

package/esm/shared/Form/useFormValues.js

@@ -0,0 +1,11 @@
+// (C) 2022-2026 GoodData Corporation
+import { useCallback, useContext } from "react";
+import { FormContext } from "./FormContext.js";
+export function useFormValues() {
+    const { currentValues } = useContext(FormContext);
+    return currentValues;
+}
+export function useFormValuesGetter() {
+    const { getFormState } = useContext(FormContext);
+    return useCallback(() => getFormState().currentValues, [getFormState]);
+}

package/esm/shared/Form/utils.d.ts

@@ -0,0 +1,2 @@
+export declare function isChanged<T>(defaultValues: T, currentValues: T, transformer: (data: T) => T): boolean;
+//# sourceMappingURL=utils.d.ts.map

package/esm/shared/Form/utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/shared/Form/utils.ts"],"names":[],"mappings":"AAIA,wBAAgB,SAAS,CAAC,CAAC,EAAE,aAAa,EAAE,CAAC,EAAE,aAAa,EAAE,CAAC,EAAE,WAAW,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC,GAAG,OAAO,CAErG"}

package/esm/shared/Form/utils.js

@@ -0,0 +1,5 @@
+// (C) 2022-2026 GoodData Corporation
+import { isEqual } from "lodash-es";
+export function isChanged(defaultValues, currentValues, transformer) {
+    return !isEqual(transformer(defaultValues), transformer(currentValues));
+}

package/esm/shared/GlobalLoading/GlobalLoading.d.ts

@@ -0,0 +1,5 @@
+/**
+ * @internal
+ */
+export declare function GlobalLoading(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=GlobalLoading.d.ts.map

package/esm/shared/GlobalLoading/GlobalLoading.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GlobalLoading.d.ts","sourceRoot":"","sources":["../../../src/shared/GlobalLoading/GlobalLoading.tsx"],"names":[],"mappings":"AAcA;;GAEG;AACH,wBAAgB,aAAa,4CAG5B"}

package/esm/shared/GlobalLoading/GlobalLoading.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+// (C) 2020-2026 GoodData Corporation
+import { LoadingSpinner } from "@gooddata/sdk-ui-kit";
+import { makeStyles } from "../theme/index.js";
+const useStyles = makeStyles()(() => ({
+    root: {
+        position: "fixed",
+        top: "50%",
+        left: "50%",
+    },
+}));
+/**
+ * @internal
+ */
+export function GlobalLoading() {
+    const { classes, cx } = useStyles();
+    return _jsx(LoadingSpinner, { className: cx(classes.root, "large") });
+}

package/esm/shared/MaqlPreview/MaqlPreview.d.ts

@@ -0,0 +1,22 @@
+import { type ObjRef } from "@gooddata/sdk-model";
+import { type IExpressionToken } from "./backend/measureExpressionTokens.js";
+export interface IMaqlPreviewProps {
+    metricRef: ObjRef;
+    expressionFallback: string;
+    maqlFragmentCommonProps: IMaqlFragmentCommonProps;
+}
+export declare function MaqlPreview({ metricRef, expressionFallback, maqlFragmentCommonProps }: IMaqlPreviewProps): import("react/jsx-runtime").JSX.Element;
+export interface IMaqlPreviewRendererProps {
+    tokens: IExpressionToken[];
+    maqlFragmentCommonProps: IMaqlFragmentCommonProps;
+}
+export declare function MaqlPreviewRenderer({ tokens, maqlFragmentCommonProps }: IMaqlPreviewRendererProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * @internal
+ */
+export interface IMaqlFragmentCommonProps {
+    links?: NonNullable<IExpressionToken["category"]>[];
+    onClick?: (token: IExpressionToken) => void;
+    getLink?: (token: IExpressionToken) => string;
+}
+//# sourceMappingURL=MaqlPreview.d.ts.map

package/esm/shared/MaqlPreview/MaqlPreview.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MaqlPreview.d.ts","sourceRoot":"","sources":["../../../src/shared/MaqlPreview/MaqlPreview.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,KAAK,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAIlD,OAAO,EAAE,KAAK,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AA4C7E,MAAM,WAAW,iBAAiB;IAC9B,SAAS,EAAE,MAAM,CAAC;IAClB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,uBAAuB,EAAE,wBAAwB,CAAC;CACrD;AAED,wBAAgB,WAAW,CAAC,EAAE,SAAS,EAAE,kBAAkB,EAAE,uBAAuB,EAAE,EAAE,iBAAiB,2CAQxG;AAED,MAAM,WAAW,yBAAyB;IACtC,MAAM,EAAE,gBAAgB,EAAE,CAAC;IAC3B,uBAAuB,EAAE,wBAAwB,CAAC;CACrD;AAED,wBAAgB,mBAAmB,CAAC,EAAE,MAAM,EAAE,uBAAuB,EAAE,EAAE,yBAAyB,2CAoBjG;AAED;;GAEG;AACH,MAAM,WAAW,wBAAwB;IACrC,KAAK,CAAC,EAAE,WAAW,CAAC,gBAAgB,CAAC,UAAU,CAAC,CAAC,EAAE,CAAC;IACpD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAC5C,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,gBAAgB,KAAK,MAAM,CAAC;CACjD"}

package/esm/shared/MaqlPreview/MaqlPreview.js

@@ -0,0 +1,107 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { FormattedMessage, useIntl } from "react-intl";
+import { makeStyles } from "../theme/index.js";
+import { useMetricTokens } from "./hooks/useMetricTokens.js";
+const useStyles = makeStyles()((theme) => ({
+    fact: {
+        color: `${theme.globals.colors.fact} !important`,
+        fontWeight: "bold",
+    },
+    metric: {
+        color: `${theme.globals.colors.metric} !important`,
+        fontWeight: "bold !important",
+    },
+    attribute: {
+        color: `${theme.globals.colors.attribute} !important`,
+        fontWeight: "bold",
+    },
+    dataset: {
+        color: `${theme.globals.colors.dataset} !important`,
+        fontWeight: "bold",
+    },
+    parameter: {
+        color: `${theme.globals.colors.parameter} !important`,
+        fontWeight: "bold",
+    },
+    keyword: {
+        color: `${theme.globals.colors.maqlKeyword} !important`,
+        fontWeight: "normal",
+    },
+    value: {
+        color: `${theme.globals.colors.value} !important`,
+        fontWeight: "normal",
+    },
+    bracket: {
+        color: `black !important`,
+        fontWeight: "normal",
+    },
+    comment: {
+        color: `${theme.globals.colors.comment} !important`,
+        fontWeight: "normal",
+        fontStyle: "normal",
+        display: "none",
+    },
+}));
+export function MaqlPreview({ metricRef, expressionFallback, maqlFragmentCommonProps }) {
+    const { loading, result } = useMetricTokens(metricRef, expressionFallback);
+    if (loading) {
+        return _jsx(FormattedMessage, { id: "loading" });
+    }
+    return _jsx(MaqlPreviewRenderer, { tokens: result, maqlFragmentCommonProps: maqlFragmentCommonProps });
+}
+export function MaqlPreviewRenderer({ tokens, maqlFragmentCommonProps }) {
+    const intl = useIntl();
+    const { classes } = useStyles();
+    return (_jsx("div", { children: tokens.map((expression, idx) => {
+            return (_jsx(MaqlFragment, { classes: classes, expression: expression, ...maqlFragmentCommonProps, children: getTitle(expression, intl) }, idx));
+        }) }));
+}
+function MaqlFragment({ expression, classes, links = [], onClick, getLink, children, }) {
+    const { category } = expression;
+    if (category && links.indexOf(category) >= 0) {
+        return (_jsx("a", { target: "_blank", rel: "noreferrer", className: getClassName(classes, category), href: getLink?.(expression), onClick: () => onClick?.(expression), children: children }));
+    }
+    return (_jsx("span", { className: getClassName(classes, category), onClick: () => onClick?.(expression), children: children }));
+}
+function getClassName(classes, category) {
+    switch (category) {
+        case "fact": {
+            return classes.fact;
+        }
+        case "attribute": {
+            return classes.attribute;
+        }
+        case "dataSet": {
+            return classes.dataset;
+        }
+        case "comment": {
+            return classes.comment;
+        }
+        case "number":
+        case "quoted_text": {
+            return classes.value;
+        }
+        case "bracket": {
+            return classes.bracket;
+        }
+        case "measure":
+        case "metric": {
+            return classes.metric;
+        }
+        case "parameter": {
+            return classes.parameter;
+        }
+        default: {
+            return classes.keyword;
+        }
+    }
+}
+function getTitle(expression, intl) {
+    if (expression.deleted) {
+        return `(${intl.formatMessage({ id: "metricList.tooltip.deleted_value" })})`;
+    }
+    if (expression.empty) {
+        return `(${intl.formatMessage({ id: "metricList.tooltip.empty_value" })})`;
+    }
+    return expression.title;
+}

package/esm/shared/MaqlPreview/backend/measureExpressionTokens.d.ts

@@ -0,0 +1,23 @@
+import { type IAnalyticalBackend, type IMeasureExpressionToken } from "@gooddata/sdk-backend-spi";
+import { type ObjRef } from "@gooddata/sdk-model";
+/**
+ * @internal
+ */
+export declare const TypeMapping: {
+    readonly measure: "metric";
+    readonly label: "attribute";
+};
+/**
+ * @internal
+ */
+export interface IExpressionToken {
+    id?: string;
+    ref?: ObjRef;
+    title: string;
+    deleted?: boolean;
+    empty?: boolean;
+    category?: (typeof TypeMapping)[keyof typeof TypeMapping] | IMeasureExpressionToken["type"];
+}
+export declare function getMeasureExpressionTokens(backend: IAnalyticalBackend, projectId: string, ref: ObjRef): Promise<ReadonlyArray<IExpressionToken>>;
+export declare function transformTokensForMaqlRenderer(tokens: IMeasureExpressionToken[]): IExpressionToken[];
+//# sourceMappingURL=measureExpressionTokens.d.ts.map

package/esm/shared/MaqlPreview/backend/measureExpressionTokens.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"measureExpressionTokens.d.ts","sourceRoot":"","sources":["../../../../src/shared/MaqlPreview/backend/measureExpressionTokens.ts"],"names":[],"mappings":"AAEA,OAAO,EACH,KAAK,kBAAkB,EAIvB,KAAK,uBAAuB,EAG/B,MAAM,2BAA2B,CAAC;AACnC,OAAO,EAAE,KAAK,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAElD;;GAEG;AACH,eAAO,MAAM,WAAW;aACpB,OAAO,EAAE,QAAQ;aACjB,KAAK,EAAE,WAAW;CACZ,CAAC;AAEX;;GAEG;AACH,MAAM,WAAW,gBAAgB;IAC7B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,OAAO,WAAW,CAAC,GAAG,uBAAuB,CAAC,MAAM,CAAC,CAAC;CAC/F;AAED,wBAAsB,0BAA0B,CAC5C,OAAO,EAAE,kBAAkB,EAC3B,SAAS,EAAE,MAAM,EACjB,GAAG,EAAE,MAAM,GACZ,OAAO,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAAC,CAG1C;AAED,wBAAgB,8BAA8B,CAAC,MAAM,EAAE,uBAAuB,EAAE,GAAG,gBAAgB,EAAE,CAEpG"}

package/esm/shared/MaqlPreview/backend/measureExpressionTokens.js

@@ -0,0 +1,86 @@
+// (C) 2007-2026 GoodData Corporation
+/**
+ * @internal
+ */
+export const TypeMapping = {
+    measure: "metric",
+    label: "attribute",
+};
+export async function getMeasureExpressionTokens(backend, projectId, ref) {
+    const tokens = await backend.workspace(projectId).measures().getMeasureExpressionTokens(ref);
+    return tokens.map(mapToken);
+}
+export function transformTokensForMaqlRenderer(tokens) {
+    return tokens.map(mapToken);
+}
+function mapToken(token) {
+    switch (token.type) {
+        case "attributeElement":
+            return createAttribute(token);
+        case "attributeHierarchy":
+        case "user":
+        case "userGroup":
+        case "dateHierarchyTemplate":
+        case "dateAttributeHierarchy":
+        case "variable":
+        case "measure":
+        case "filterContext":
+        case "displayForm":
+        case "tag":
+        case "insight":
+        case "dashboardPlugin":
+        case "attribute":
+        case "computedAttribute":
+        case "analyticalDashboard":
+        case "dataSet":
+        case "fact":
+        case "theme":
+        case "colorPalette":
+        case "workspaceTheme":
+        case "workspaceColorPalette":
+        case "exportDefinition":
+        case "automation":
+        case "filterView":
+        case "workspaceDataFilter":
+        case "workspaceDataFilterSetting":
+        case "notificationChannel":
+        case "memoryItem":
+        case "userDataFilter":
+        case "parameter":
+        case "reportPageLayout":
+        case "reportTemplate":
+        case "report":
+        case "document":
+        case "documentTemplate":
+        case "pageTemplate":
+            return createObject(token);
+        case "text":
+        case "number":
+        case "quoted_text":
+        case "bracket":
+        case "comment":
+            return createText(token);
+    }
+}
+function createAttribute(token) {
+    return {
+        deleted: token.deleted,
+        empty: Boolean(token.value),
+        title: token.value || "",
+        category: token.type,
+    };
+}
+function createText(token) {
+    return {
+        title: token.value,
+        category: token.type,
+    };
+}
+function createObject(token) {
+    return {
+        title: token.value,
+        category: TypeMapping[token.type] || token.type,
+        id: token.id,
+        ref: token.ref,
+    };
+}

package/esm/shared/MaqlPreview/hooks/useMetricTokens.d.ts

@@ -0,0 +1,8 @@
+import { type ObjRef } from "@gooddata/sdk-model";
+import { type IExpressionToken } from "../backend/measureExpressionTokens.js";
+export type UseMetricTokensStat = {
+    result: IExpressionToken[];
+    loading: boolean;
+};
+export declare function useMetricTokens(ref: ObjRef, expressionFallback: string): UseMetricTokensStat;
+//# sourceMappingURL=useMetricTokens.d.ts.map

package/esm/shared/MaqlPreview/hooks/useMetricTokens.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMetricTokens.d.ts","sourceRoot":"","sources":["../../../../src/shared/MaqlPreview/hooks/useMetricTokens.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAGlD,OAAO,EAAE,KAAK,gBAAgB,EAA8B,MAAM,uCAAuC,CAAC;AAE1G,MAAM,MAAM,mBAAmB,GAAG;IAC9B,MAAM,EAAE,gBAAgB,EAAE,CAAC;IAC3B,OAAO,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,wBAAgB,eAAe,CAAC,GAAG,EAAE,MAAM,EAAE,kBAAkB,EAAE,MAAM,GAAG,mBAAmB,CAe5F"}

package/esm/shared/MaqlPreview/hooks/useMetricTokens.js

@@ -0,0 +1,14 @@
+// (C) 2007-2026 GoodData Corporation
+import { useBackendStrict, useCancelablePromise, useWorkspaceStrict } from "@gooddata/sdk-ui";
+import { getMeasureExpressionTokens } from "../backend/measureExpressionTokens.js";
+export function useMetricTokens(ref, expressionFallback) {
+    const workspaceId = useWorkspaceStrict();
+    const backend = useBackendStrict();
+    const { status, result } = useCancelablePromise({
+        promise: () => getMeasureExpressionTokens(backend, workspaceId, ref),
+    }, []);
+    return {
+        result: (result || [{ category: "text", title: expressionFallback }]),
+        loading: status === "loading" || status === "pending",
+    };
+}

package/esm/shared/MetricTooltip/MetricTooltip.d.ts

@@ -0,0 +1,20 @@
+import { type IMeasureMetadataObject, type ISeparators } from "@gooddata/sdk-model";
+import { type IMetricTooltipContentProps } from "./MetricTooltipContent.js";
+/**
+ * @internal
+ */
+export interface IMetricTooltipProps {
+    active?: boolean;
+    className?: string;
+    iconClassName?: string;
+    metric: IMeasureMetadataObject;
+    previewOptions?: IMetricTooltipContentProps["previewOptions"];
+    onTooltipOpen?: (open: boolean) => void;
+    useReferences?: boolean;
+    separators?: ISeparators;
+}
+/**
+ * @internal
+ */
+export declare function MetricTooltip({ metric, className, iconClassName, active, onTooltipOpen, previewOptions, useReferences, separators, }: IMetricTooltipProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=MetricTooltip.d.ts.map

package/esm/shared/MetricTooltip/MetricTooltip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MetricTooltip.d.ts","sourceRoot":"","sources":["../../../src/shared/MetricTooltip/MetricTooltip.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,KAAK,sBAAsB,EAAE,KAAK,WAAW,EAAE,MAAM,qBAAqB,CAAC;AASpF,OAAO,EAAE,KAAK,0BAA0B,EAAwB,MAAM,2BAA2B,CAAC;AAUlG;;GAEG;AACH,MAAM,WAAW,mBAAmB;IAChC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,MAAM,EAAE,sBAAsB,CAAC;IAC/B,cAAc,CAAC,EAAE,0BAA0B,CAAC,gBAAgB,CAAC,CAAC;IAC9D,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACxC,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,UAAU,CAAC,EAAE,WAAW,CAAC;CAC5B;AAQD;;GAEG;AACH,wBAAgB,aAAa,CAAC,EAC1B,MAAM,EACN,SAAS,EACT,aAAa,EACb,MAAc,EACd,aAAa,EACb,cAAmB,EACnB,aAAa,EACb,UAAU,GACb,EAAE,mBAAmB,2CAoCrB"}

package/esm/shared/MetricTooltip/MetricTooltip.events.d.ts

@@ -0,0 +1,9 @@
+import { type IEvent } from "../eventing/EventContext.js";
+declare function metricTooltipDisplayedEvent(): IEvent;
+declare function userClickOnMetricInTooltipEvent(): IEvent;
+export declare const events: {
+    metricTooltipDisplayedEvent: typeof metricTooltipDisplayedEvent;
+    userClickOnMetricInTooltipEvent: typeof userClickOnMetricInTooltipEvent;
+};
+export {};
+//# sourceMappingURL=MetricTooltip.events.d.ts.map

package/esm/shared/MetricTooltip/MetricTooltip.events.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MetricTooltip.events.d.ts","sourceRoot":"","sources":["../../../src/shared/MetricTooltip/MetricTooltip.events.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,MAAM,EAAE,MAAM,6BAA6B,CAAC;AAG1D,iBAAS,2BAA2B,IAAI,MAAM,CAK7C;AAED,iBAAS,+BAA+B,IAAI,MAAM,CAKjD;AAED,eAAO,MAAM,MAAM;;;CAGlB,CAAC"}