How to use the dash-table/tooltips/props.TooltipSyntax.Text function in dash-table

To help you get started, we’ve selected a few dash-table examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github plotly / dash-table / src / dash-table / components / Tooltip / index.tsx View on Github external
render() {
        const { arrow, className } = this.props;
        const { type, value } = this.props.tooltip;
        const { md } = this.state;

        if (!type || !value) {
            return null;
        }

        const props = type === TooltipSyntax.Text ?
            { children: value } :
            { dangerouslySetInnerHTML: { __html: md.render(value) } };

        const { display } = this.state;

        return (<div style="{{" data-attr-anchor="{arrow}">
            <div>
        </div>);
    }</div>
github plotly / dash-table / src / dash-table / derived / table / tooltip.ts View on Github external
virtualized
    );

    let delay = convertDelay(defaultDelay) as number;
    let duration = convertDuration(defaultDuration) as number;

    let type: TooltipSyntax = TooltipSyntax.Text;
    let value: string | undefined;

    if (selectedTooltip) {
        if (typeof selectedTooltip === 'string') {
            value = selectedTooltip;
        } else {
            delay = getDelay(selectedTooltip.delay, delay);
            duration = getDuration(selectedTooltip.duration, duration);
            type = selectedTooltip.type || TooltipSyntax.Text;
            value = selectedTooltip.value;
        }
    }

    return { delay, duration, type, value };
});
github plotly / dash-table / demo / AppMode.ts View on Github external
function getTooltipsState() {
    const state = getDefaultState();

    state.tableProps.tooltip_delay = 250;
    state.tableProps.tooltip_duration = 1000;
    state.tableProps.tooltip_data = [
        { ccc: { type: TooltipSyntax.Markdown, value: `### Go Proverb\nThe enemy's key point is yours` } },
        { ccc: { type: TooltipSyntax.Markdown, value: `### Go Proverb\nPlay on the point of symmetry` } },
        { ccc: { type: TooltipSyntax.Markdown, value: `### Go Proverb\nSente gains nothing` } },
        { ccc: { type: TooltipSyntax.Text, value: `Beware of going back to patch up` } },
        { ccc: { type: TooltipSyntax.Text, value: `When in doubt, Tenuki` } },
        { ccc: `People in glass houses should not throw stones` }
    ];
    state.tableProps.tooltip = {
        ccc: { type: TooltipSyntax.Text, value: `There is death in the hane` },
        ddd: { type: TooltipSyntax.Markdown, value: `Hane, Cut, Placement` },
        rows: `Learn the eyestealing tesuji`
    };
    state.tableProps.tooltip_conditional = [{
        if: {
            column_id: 'aaa-readonly',
            filter_query: `{aaa} is prime`
        },
        type: TooltipSyntax.Markdown,
        value: `### Go Proverbs\nCapture three to get an eye`
    }, {
github plotly / dash-table / demo / AppMode.ts View on Github external
function getTooltipsState() {
    const state = getDefaultState();

    state.tableProps.tooltip_delay = 250;
    state.tableProps.tooltip_duration = 1000;
    state.tableProps.tooltip_data = [
        { ccc: { type: TooltipSyntax.Markdown, value: `### Go Proverb\nThe enemy's key point is yours` } },
        { ccc: { type: TooltipSyntax.Markdown, value: `### Go Proverb\nPlay on the point of symmetry` } },
        { ccc: { type: TooltipSyntax.Markdown, value: `### Go Proverb\nSente gains nothing` } },
        { ccc: { type: TooltipSyntax.Text, value: `Beware of going back to patch up` } },
        { ccc: { type: TooltipSyntax.Text, value: `When in doubt, Tenuki` } },
        { ccc: `People in glass houses should not throw stones` }
    ];
    state.tableProps.tooltip = {
        ccc: { type: TooltipSyntax.Text, value: `There is death in the hane` },
        ddd: { type: TooltipSyntax.Markdown, value: `Hane, Cut, Placement` },
        rows: `Learn the eyestealing tesuji`
    };
    state.tableProps.tooltip_conditional = [{
        if: {
            column_id: 'aaa-readonly',
            filter_query: `{aaa} is prime`
        },
        type: TooltipSyntax.Markdown,
        value: `### Go Proverbs\nCapture three to get an eye`
    }, {
        if: {
github plotly / dash-table / src / dash-table / derived / table / tooltip.ts View on Github external
virtualized: IVirtualizedDerivedData,
    defaultDelay: number | null,
    defaultDuration: number | null
) => {
    const selectedTooltip = getSelectedTooltip(
        currentTooltip,
        tooltip_data,
        tooltip_conditional,
        tooltip_static,
        virtualized
    );

    let delay = convertDelay(defaultDelay) as number;
    let duration = convertDuration(defaultDuration) as number;

    let type: TooltipSyntax = TooltipSyntax.Text;
    let value: string | undefined;

    if (selectedTooltip) {
        if (typeof selectedTooltip === 'string') {
            value = selectedTooltip;
        } else {
            delay = getDelay(selectedTooltip.delay, delay);
            duration = getDuration(selectedTooltip.duration, duration);
            type = selectedTooltip.type || TooltipSyntax.Text;
            value = selectedTooltip.value;
        }
    }

    return { delay, duration, type, value };
});