import { useUID } from '@pega/cosmos-react-core';
import { Expression } from '@pega/cosmos-react-build';
import useMockExpression from './useMockExpression';
import { additionalContentInfo } from './Expression.mocks';
export default {
    title: 'Build/Expression',
    component: Expression
};
export const ExpressionDemo = (args) => {
    const { inputValue, showExpBuilderModal, openExpBuilderModal, errors, handle, inLineErrors, expressionRef } = useMockExpression({
        inLineError: args.inLineError,
        showExpressionBuilderErrorBanner: args.showExpressionBuilderErrorBanner,
        expShowErrors: args.showErrors
    });
    const { fetchSuggestions: inputFetchSuggestions, loading: inputLoading } = useMockExpression({
        inLineError: args.inLineError,
        showExpressionBuilderErrorBanner: args.showExpressionBuilderErrorBanner,
        expShowErrors: args.showErrors
    });
    return (<Expression value={inputValue} label={args.label} editorInput={{
            fetchSuggestions: inputFetchSuggestions,
            loading: inputLoading,
            handle,
            inLineErrors
        }} showExpressionBuilder={showExpBuilderModal} onExpBuilderShowHandler={openExpBuilderModal} readOnly={args.readOnly} ref={expressionRef} disabled={args.disabled} status={args?.showErrors ? 'error' : undefined} required={args.required} info={args?.showErrors ? errors : args.info} additionalInfo={args.showAdditionalInfo
            ? {
                content: additionalContentInfo
            }
            : undefined} labelHidden={args.labelHidden} placeholder={args.placeholder} id={useUID()}/>);
};
ExpressionDemo.args = {
    showErrors: false,
    readOnly: false,
    disabled: false,
    inLineError: 'single',
    showExpressionBuilderErrorBanner: false,
    showAdditionalInfo: false,
    info: 'Type in the value',
    required: false,
    labelHidden: false,
    label: 'Expression',
    placeholder: 'Writing expressions'
};
ExpressionDemo.argTypes = {
    showErrors: { control: { type: 'boolean' } },
    readOnly: { control: { type: 'boolean' } },
    disabled: { control: { type: 'boolean' } },
    showExpressionBuilderErrorBanner: { control: { type: 'boolean' } },
    inLineError: { options: ['single', 'multiple'], control: { type: 'select' } },
    showAdditionalInfo: { control: { type: 'boolean' } },
    labelHidden: { control: { type: 'boolean' } },
    info: { control: { type: 'text' } },
    required: { control: { type: 'boolean' } },
    label: { control: { type: 'text' } },
    placeholder: { control: { type: 'text' } }
};
//# sourceMappingURL=Expression.stories.jsx.map