@gravity-ui/chartkit 0.9.0 → 0.10.0

package/build/plugins/highcharts/renderer/helpers/tooltip/helpers.js

@@ -0,0 +1,5 @@
+export const escapeHTML = (html = '') => {
+    const elem = document.createElement('span');
+    elem.innerText = html;
+    return elem.innerHTML;
+};

package/build/plugins/highcharts/renderer/helpers/tooltip/index.d.ts

@@ -0,0 +1,13 @@
+import type { Highcharts } from '../../../types';
+import type { TooltipData } from './types';
+import './tooltip.css';
+export declare const SERIES_NAME_DATA_ATTRIBUTE = "data-series-name";
+export declare const SERIES_IDX_DATA_ATTRIBUTE = "data-series-idx";
+export declare const TOOLTIP_CONTAINER_CLASS_NAME = "_tooltip";
+export declare const TOOLTIP_ROW_NAME_CLASS_NANE = "_tooltip-rows__name-td";
+export declare const TOOLTIP_ROW_CLASS_NAME = "_tooltip-row";
+export declare const TOOLTIP_HEADER_CLASS_NAME = "_tooltip-header";
+export declare const TOOLTIP_LIST_CLASS_NAME = "_tooltip-list";
+export declare const TOOLTIP_FOOTER_CLASS_NAME = "_tooltip-footer";
+export declare const formatTooltip: (data: TooltipData, tooltip: Highcharts.Tooltip, isMobile?: boolean | undefined) => string;
+export default formatTooltip;

package/build/plugins/highcharts/renderer/helpers/tooltip/index.js

@@ -0,0 +1,253 @@
+/* eslint-disable complexity */
+import { escape as _escape, orderBy as _orderBy } from 'lodash';
+import { i18n } from '../../../../../i18n';
+import { renderShapeIcon } from './render-shape-icon';
+import { escapeHTML } from './helpers';
+import './tooltip.css';
+export const SERIES_NAME_DATA_ATTRIBUTE = 'data-series-name';
+export const SERIES_IDX_DATA_ATTRIBUTE = 'data-series-idx';
+export const TOOLTIP_CONTAINER_CLASS_NAME = '_tooltip';
+export const TOOLTIP_ROW_NAME_CLASS_NANE = '_tooltip-rows__name-td';
+export const TOOLTIP_ROW_CLASS_NAME = '_tooltip-row';
+export const TOOLTIP_HEADER_CLASS_NAME = '_tooltip-header';
+export const TOOLTIP_LIST_CLASS_NAME = '_tooltip-list';
+export const TOOLTIP_FOOTER_CLASS_NAME = '_tooltip-footer';
+const renderEmptyCell = () => '<td />';
+const renderColorCell = (line) => `<td class="_tooltip-rows__bubble-td">
+        <div class="_tooltip-rows__bubble-div" style="background-color:${line.seriesColor};"></div>
+    </td>`;
+const renderLineShapeCell = (line) => `<td class="_tooltip-rows__shape-td">
+        <div class="_tooltip-rows__shape-div"
+            style="color:${line.seriesColor};">
+           ${renderShapeIcon({ type: line.seriesShape })}
+        </div>
+    </td>`;
+const renderNameCell = (line) => `<td class="${TOOLTIP_ROW_NAME_CLASS_NANE}">
+        ${line.hideSeriesName ? '' : escapeHTML(line.seriesName)}
+    </td>`;
+const renderPercentCell = (line) => `<td class="_tooltip-rows__percent-td">
+        ${line.percentValue ? line.percentValue + '%' : ''}
+    </td>`;
+const renderValueCell = (line) => `<td class="_tooltip-rows__value-td">
+        ${line.value}
+    </td>`;
+const renderDiffCell = (line) => `<td class="_tooltip-rows__diff-td">
+        ${line.diff ? ` (${line.diff})` : ''}
+    </td>`;
+const renderAdditionalSection = (data, splitTooltip = false, colspanNumber = 1) => {
+    return `<td class="_tooltip-right__td ${splitTooltip ? '_tooltip-right__td_with-split-tooltip' : ''}" colspan="${colspanNumber || 1}">
+             ${data.holiday
+        ? `<div class="_tooltip-right__holiday-div">
+                    <div class="_tooltip-right__holiday-emoji">🎈</div>
+                    <div>
+                        ${data.holidayText}
+                        ${data.region
+            ? `<span class="_tooltip-right__holiday-region">[${data.region}]</span>`
+            : ''}
+                    </div>
+                </div>`
+        : ''}
+
+            ${data.commentDateText
+        ? `<div class="${data.xComments ? '_tooltip-right__margin-bot' : ''}">${data.commentDateText}</div>`
+        : ''}
+
+            ${data.xComments
+        ? data.xComments
+            .map((comment) => `<div class="_tooltip-right__traf-div ${splitTooltip
+            ? '_tooltip-right__traf-div_for-split-tooltip'
+            : ''}" style="border-color: ${comment.color};">${comment.text}</div>`)
+            .join('')
+        : ''}
+        </td>`;
+};
+const renderRow = (line, { isSelectedLine, cellsRenderers, isSingleLine, allowComment, withDarkBackground, rowIndex, }) => {
+    const hasComment = line.commentText || line.xyCommentText;
+    const needRenderComment = allowComment && hasComment;
+    const fullCellsRenderers = cellsRenderers.slice();
+    const rowKey = `${String(rowIndex) || ''}-${String(escapeHTML(line.seriesName))
+        .slice(0, 20)
+        .replace(/(\r\n|\n|\r)/gm, '')}`;
+    if (line.insertCellAt) {
+        (Object.keys(line.insertCellAt) || []).forEach((index) => {
+            fullCellsRenderers.splice(Number(index), 0, renderEmptyCell);
+        });
+    }
+    if (line.customRender) {
+        return `<tr class="${TOOLTIP_ROW_CLASS_NAME}${isSelectedLine ? ' _tooltip-selected-row' : ''}${isSingleLine ? ' _tooltip-uniq-row' : ''}${withDarkBackground ? ' _tooltip-row-dark-bg' : ''}" ${SERIES_NAME_DATA_ATTRIBUTE}="${rowKey}" ${line.seriesIdx ? `${SERIES_IDX_DATA_ATTRIBUTE}="${line.seriesIdx}"` : ''}>
+            ${line.customRender.trim().indexOf('<td') === 0
+            ? line.customRender
+            : `<td colspan="${cellsRenderers.length}">${line.customRender}</td>`}
+        </tr>
+        ${needRenderComment
+            ? `<tr class="_tooltip-comment-row${isSelectedLine ? ' _tooltip-selected-row' : ''}${withDarkBackground ? ' _tooltip-row-dark-bg' : ''}">
+                    <td>
+                        ${line.commentText
+                ? `<div class="_tooltip-rows__comment-div">${line.commentText}</div>`
+                : ''}
+                        ${line.xyCommentText
+                ? `<div class="_tooltip-rows__comment-div">${line.xyCommentText}</div>`
+                : ''}
+                    </td>
+                </tr>`
+            : ''}`;
+    }
+    return `<tr class="${TOOLTIP_ROW_CLASS_NAME}${isSelectedLine ? ' _tooltip-selected-row' : ''}${isSingleLine ? ' _tooltip-uniq-row' : ''}${withDarkBackground ? ' _tooltip-row-dark-bg' : ''}" ${SERIES_NAME_DATA_ATTRIBUTE}="${rowKey}" ${line.seriesIdx ? `${SERIES_IDX_DATA_ATTRIBUTE}="${line.seriesIdx}"` : ''}>
+            ${fullCellsRenderers
+        .map((render, index) => {
+        if (line.replaceCellAt && line.replaceCellAt[index]) {
+            return typeof line.replaceCellAt[index] === 'string'
+                ? line.replaceCellAt[index]
+                : line.replaceCellAt[index](line);
+        }
+        else if (line.insertCellAt && line.insertCellAt[index]) {
+            return typeof line.insertCellAt[index] === 'string'
+                ? line.insertCellAt[index]
+                : line.insertCellAt[index](line);
+        }
+        else {
+            return render(line);
+        }
+    })
+        .join('')}
+        </tr>
+
+        ${needRenderComment
+        ? `<tr class="_tooltip-comment-row${isSelectedLine ? ' _tooltip-selected-row' : ''}${withDarkBackground ? ' _tooltip-row-dark-bg' : ''}">
+                    <td colspan="4">
+                        ${line.commentText
+            ? `<div class="_tooltip-rows__comment-div">${line.commentText}</div>`
+            : ''}
+                        ${line.xyCommentText
+            ? `<div class="_tooltip-rows__comment-div">${line.xyCommentText}</div>`
+            : ''}
+                    </td>
+                </tr>`
+        : ''}`;
+};
+export const formatTooltip = (data, tooltip, isMobile) => {
+    var _a, _b, _c;
+    const { splitTooltip, activeRowAlwaysFirstInTooltip } = data;
+    const selectedLineIndex = data.lines.findIndex(({ selectedSeries }) => selectedSeries);
+    const selectedLine = data.lines[selectedLineIndex];
+    const lines = data.lines.slice(0, (tooltip.lastVisibleRowIndex || data.lines.length) + 1);
+    const sortedLines = _orderBy(lines, ['originalValue'], ['desc']);
+    const withShapes = lines.every((line) => line.seriesShape);
+    const unsafe = data.unsafe;
+    const tooltipHeaderRaw = (_a = data.tooltipHeader) === null || _a === void 0 ? void 0 : _a.trim();
+    const tooltipHeaderEscaped = escapeHTML(tooltipHeaderRaw);
+    const cellsRenderers = [];
+    if (withShapes) {
+        cellsRenderers.push(renderLineShapeCell);
+    }
+    else {
+        cellsRenderers.push(renderColorCell);
+    }
+    if (data.shared) {
+        cellsRenderers.push(renderNameCell);
+    }
+    if (data.withPercent) {
+        cellsRenderers.push(renderPercentCell);
+    }
+    cellsRenderers.push(renderValueCell);
+    if (data.useCompareFrom) {
+        cellsRenderers.push(renderDiffCell);
+    }
+    const rowRenderingConfig = {
+        isSingleLine: lines.length === 1,
+        cellsRenderers,
+    };
+    const rowRenderingConfigForSelectedLine = {
+        cellsRenderers,
+        useCompareFrom: data.useCompareFrom,
+        isSelectedLine: true,
+        allowComment: selectedLineIndex > tooltip.lastVisibleRowIndex,
+    };
+    // @ts-ignore
+    const windowHeight = document.body.clientHeight / ((window.visualViewport && window.visualViewport.scale) || 1);
+    const tooltipMaxHeight = isMobile && window.innerHeight > window.innerWidth
+        ? windowHeight - ((_b = tooltip.chart) === null || _b === void 0 ? void 0 : _b.plotSizeY) ||
+            ((_c = tooltip.yagrChart) === null || _c === void 0 ? void 0 : _c.height) ||
+            windowHeight / 2
+        : windowHeight - (tooltip.options.padding || 0) * 4;
+    function getRowRenderConfig(index) {
+        return Object.assign(Object.assign({}, rowRenderingConfig), { rowIndex: index, isSelectedLine: lines.length > 1 && index === selectedLineIndex, withDarkBackground: lines.length > 2 && Boolean(index % 2), allowComment: index !== selectedLineIndex || !rowRenderingConfigForSelectedLine.allowComment });
+    }
+    let tooltipContainerClassNames = TOOLTIP_CONTAINER_CLASS_NAME;
+    if (splitTooltip) {
+        tooltipContainerClassNames += ` ${TOOLTIP_CONTAINER_CLASS_NAME}_split-tooltip`;
+    }
+    return `
+<div class="${tooltipContainerClassNames}" style="${tooltip.preFixationHeight ? `height: ${tooltip.preFixationHeight}px; ` : ''}max-height: ${splitTooltip ? 'auto' : `${tooltipMaxHeight}px`}">
+    ${tooltipHeaderRaw
+        ? `<div title="${unsafe ? '' : _escape(tooltipHeaderEscaped)}" class="_tooltip-date">
+                ${unsafe ? tooltipHeaderRaw : tooltipHeaderEscaped}
+            </div>`
+        : ''}
+    ${splitTooltip &&
+        (data.holiday || data.commentDateText || (data.xComments && data.xComments.length))
+        ? `<table border="0" cellpadding="0" cellspacing="0">
+                <tbody>
+                    <tr>
+                        ${renderAdditionalSection(data, true, cellsRenderers.length)}
+                    </tr>
+                </tbody>
+            </table>`
+        : ''}
+    <table border="0" cellpadding="0" cellspacing="0">
+        <tr>
+            <td class="_tooltip-left__td">
+                <table class="_tooltip-rows__table">
+                    ${splitTooltip
+        ? ''
+        : `<thead class=${TOOLTIP_HEADER_CLASS_NAME}>
+                                ${selectedLine &&
+            (activeRowAlwaysFirstInTooltip ||
+                (tooltip.lastVisibleRowIndex &&
+                    selectedLineIndex > tooltip.lastVisibleRowIndex))
+            ? renderRow(selectedLine, rowRenderingConfigForSelectedLine)
+            : ''}
+                                <tr class="_tooltip-fake-row">${Array(cellsRenderers.length)
+            .fill('<td></td>')
+            .join('')}</tr>
+                            </thead>`}
+                    <tbody class="${TOOLTIP_LIST_CLASS_NAME}">
+                        ${sortedLines
+        .map((line, index) => renderRow(line, getRowRenderConfig(index)))
+        .join('')}
+                    </tbody>
+                    ${splitTooltip
+        ? ''
+        : `<tbody class="${TOOLTIP_FOOTER_CLASS_NAME}">
+                                ${tooltip.lastVisibleRowIndex && data.hiddenRowsNumber > 0
+            ? `<tr class="${TOOLTIP_ROW_CLASS_NAME} _hidden-rows-sum${lines.length % 2 ? ' _hidden-rows-sum-dark-bg' : ''}">
+                                            <td colspan="${cellsRenderers.length - 1}" class="_hidden-rows-number">
+                                                ${i18n('chartkit', 'tooltip-rest')} ${data.hiddenRowsNumber}
+                                            </td>
+                                            <td class="_hidden-rows-value">${data.hiddenRowsSum}</td>
+                                        </tr>`
+            : ''}
+                                <tr class="_tooltip-fake-row">${Array(cellsRenderers.length)
+            .fill('<td></td>')
+            .join('')}</tr>
+                                ${data.sum
+            ? `<tr class="_tooltip-rows__summ-tr">
+                                            <td class="_tooltip-rows__summ-td" colspan="${cellsRenderers.length - 1}">${i18n('chartkit', 'tooltip-sum')}</td>
+                                            <td class="_tooltip-rows__summ-td _tooltip-rows__summ-td-value">
+                                                ${data.sum}
+                                            </td>
+                                        </tr>`
+            : ''}
+                            </tbody>`}
+                </table>
+            </td>
+
+            ${!splitTooltip &&
+        (data.holiday || data.commentDateText || (data.xComments && data.xComments.length))
+        ? renderAdditionalSection(data)
+        : ''}
+        </tr>
+    </table>
+</div>`;
+};
+export default formatTooltip;

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/index.d.ts

@@ -0,0 +1,6 @@
+import { LineShapeType } from '../constants';
+export declare const renderShapeIcon: (args: {
+    type?: LineShapeType;
+    width?: string;
+    height?: string;
+}) => string;

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/index.js

@@ -0,0 +1,22 @@
+import { LineShapeType } from '../constants';
+import { DashDotLineIcon, DashLineIcon, DotLineIcon, LongDashDotDotLineIcon, LongDashDotLineIcon, LongDashLineIcon, ShortDashDotDotLineIcon, ShortDashDotLineIcon, ShortDashLineIcon, ShortDotLineIcon, SolidLineIcon, } from './template-icons';
+const DEFAULT_ICON_WIDTH = '38px';
+const DEFAULT_ICON_HEIGHT = '2px';
+const TEMPLATE_ICONS = {
+    [LineShapeType.DashDot]: DashDotLineIcon,
+    [LineShapeType.Dash]: DashLineIcon,
+    [LineShapeType.Dot]: DotLineIcon,
+    [LineShapeType.LongDashDotDot]: LongDashDotDotLineIcon,
+    [LineShapeType.LongDashDot]: LongDashDotLineIcon,
+    [LineShapeType.LongDash]: LongDashLineIcon,
+    [LineShapeType.ShortDashDotDot]: ShortDashDotDotLineIcon,
+    [LineShapeType.ShortDashDot]: ShortDashDotLineIcon,
+    [LineShapeType.ShortDash]: ShortDashLineIcon,
+    [LineShapeType.ShortDot]: ShortDotLineIcon,
+    [LineShapeType.Solid]: SolidLineIcon,
+};
+export const renderShapeIcon = (args) => {
+    const { type, width = DEFAULT_ICON_WIDTH, height = DEFAULT_ICON_HEIGHT } = args;
+    const templateIcon = type && TEMPLATE_ICONS[type];
+    return templateIcon ? templateIcon({ width, height }) : '';
+};

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/template-icons/DashDotLineIcon.d.ts

@@ -0,0 +1,2 @@
+import type { CommonIconProps } from '../types';
+export declare const DashDotLineIcon: ({ height, width }: CommonIconProps) => string;

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/template-icons/DashDotLineIcon.js

@@ -0,0 +1,20 @@
+import { getParsedRect } from '../utils';
+export const DashDotLineIcon = ({ height, width }) => {
+    const { parsedWidth, parsedHeight } = getParsedRect({ width, height });
+    return `
+    <svg
+        width="${width}"
+        height="${height}"
+        fill="none"
+        viewBox="0 0 ${parsedWidth} ${parsedHeight}"
+        xmlns="http://www.w3.org/2000/svg"
+    >
+        <path
+            fillRule="evenodd"
+            clipRule="evenodd"
+            d="M30 2h8V0h-8v2zM8 2h8V0H8v2zM22 2h2V0h-2v2zM0 2h2V0H0v2z"
+            fill="currentColor"
+        />
+    </svg>
+`;
+};

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/template-icons/DashLineIcon.d.ts

@@ -0,0 +1,2 @@
+import type { CommonIconProps } from '../types';
+export declare const DashLineIcon: ({ height, width }: CommonIconProps) => string;

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/template-icons/DashLineIcon.js

@@ -0,0 +1,25 @@
+import { getParsedRect } from '../utils';
+export const DashLineIcon = ({ height, width }) => {
+    const { parsedWidth, parsedHeight } = getParsedRect({ width, height });
+    return `<svg
+        width="${width}"
+        height="${height}"
+        fill="none"
+        viewBox="0 0 ${parsedWidth} ${parsedHeight}"
+        xmlns="http://www.w3.org/2000/svg"
+    >
+        <g clipPath="url(#a)">
+            <path
+                fillRule="evenodd"
+                clipRule="evenodd"
+                d="M-5 2h-4V0h4v2zM9 2H1V0h8v2zm14 0h-8V0h8v2zm14 0h-8V0h8v2zm14 0h-8V0h8v2zm14 0h-8V0h8v2zm14 0h-8V0h8v2zm14 0h-8V0h8v2zm14 0h-8V0h8v2zm14 0h-8V0h8v2zm14 0h-8V0h8v2zm14 0h-8V0h8v2zm14 0h-8V0h8v2zm14 0h-8V0h8v2zm14 0h-8V0h8v2zm14 0h-8V0h8v2zm14 0h-8V0h8v2zm14 0h-8V0h8v2zm14 0h-8V0h8v2zm14 0h-8V0h8v2zm10 0h-4V0h4v2z"
+                fill="currentColor"
+            />
+        </g>
+        <defs>
+            <clipPath id="a">
+                <path fill="#fff" d="M0 0h260v2H0z" />
+            </clipPath>
+        </defs>
+    </svg>`;
+};

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/template-icons/DotLineIcon.d.ts

@@ -0,0 +1,2 @@
+import type { CommonIconProps } from '../types';
+export declare const DotLineIcon: ({ height, width }: CommonIconProps) => string;

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/template-icons/DotLineIcon.js

@@ -0,0 +1,20 @@
+import { getParsedRect } from '../utils';
+export const DotLineIcon = ({ height, width }) => {
+    const { parsedWidth, parsedHeight } = getParsedRect({ width, height });
+    return `<svg
+        width="${width}"
+        height="${height}"
+        fill="none"
+        viewBox="0 0 ${parsedWidth} ${parsedHeight}"
+        xmlns="http://www.w3.org/2000/svg"
+    >
+        <g clipPath="url(#a)" fill="currentColor">
+            <path d="M0 0h2v2H0zM8 0h2v2H8zM16 0h2v2h-2zM24 0h2v2h-2zM32 0h2v2h-2z" />
+        </g>
+        <defs>
+            <clipPath id="a">
+                <path fill="#fff" d="M0 0h259v2H0z" />
+            </clipPath>
+        </defs>
+    </svg>`;
+};

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/template-icons/LongDashDotDotLineIcon.d.ts

@@ -0,0 +1,2 @@
+import type { CommonIconProps } from '../types';
+export declare const LongDashDotDotLineIcon: ({ width, height }: CommonIconProps) => string;

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/template-icons/LongDashDotDotLineIcon.js

@@ -0,0 +1,18 @@
+import { getParsedRect } from '../utils';
+export const LongDashDotDotLineIcon = ({ width, height }) => {
+    const { parsedWidth, parsedHeight } = getParsedRect({ width, height });
+    return `<svg
+        width="${width}"
+        height="${height}"
+        fill="none"
+        viewBox="0 0 ${parsedWidth} ${parsedHeight}"
+        xmlns="http://www.w3.org/2000/svg"
+    >
+        <path
+            fillRule="evenodd"
+            clipRule="evenodd"
+            d="M30 2h16V0H30v2zM-8 2H8V0H-8v2zM22 2h2V0h-2v2zM14 2h2V0h-2v2z"
+            fill="currentColor"
+        />
+    </svg>`;
+};

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/template-icons/LongDashDotLineIcon.d.ts

@@ -0,0 +1,2 @@
+import type { CommonIconProps } from '../types';
+export declare const LongDashDotLineIcon: ({ height, width }: CommonIconProps) => string;

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/template-icons/LongDashDotLineIcon.js

@@ -0,0 +1,18 @@
+import { getParsedRect } from '../utils';
+export const LongDashDotLineIcon = ({ height, width }) => {
+    const { parsedWidth, parsedHeight } = getParsedRect({ width, height });
+    return `<svg
+        width="${width}"
+        height="${height}"
+        fill="none"
+        viewBox="0 0 ${parsedWidth} ${parsedHeight}"
+        xmlns="http://www.w3.org/2000/svg"
+    >
+        <path
+            fillRule="evenodd"
+            clipRule="evenodd"
+            d="M26 2h16V0H26v2zM-4 2h16V0H-4v2zM18 2h2V0h-2v2z"
+            fill="currentColor"
+        />
+    </svg>`;
+};

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/template-icons/LongDashLineIcon.d.ts

@@ -0,0 +1,2 @@
+import type { CommonIconProps } from '../types';
+export declare const LongDashLineIcon: ({ height, width }: CommonIconProps) => string;

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/template-icons/LongDashLineIcon.js

@@ -0,0 +1,15 @@
+import { getParsedRect } from '../utils';
+export const LongDashLineIcon = ({ height, width }) => {
+    const { parsedWidth, parsedHeight } = getParsedRect({ width, height });
+    return `<svg
+        width="${width}"
+        height="${height}"
+        fill="none"
+        viewBox="2 2 ${parsedWidth} ${parsedHeight}"
+        xmlns="http://www.w3.org/2000/svg"
+    >
+        <g fill="currentColor">
+            <path d="M0 2h16v2H0zM24 2h16v2H24z" />
+        </g>
+    </svg>`;
+};

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/template-icons/ShortDashDotDotLineIcon.d.ts

@@ -0,0 +1,2 @@
+import type { CommonIconProps } from '../types';
+export declare const ShortDashDotDotLineIcon: ({ height, width }: CommonIconProps) => string;

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/template-icons/ShortDashDotDotLineIcon.js

@@ -0,0 +1,18 @@
+import { getParsedRect } from '../utils';
+export const ShortDashDotDotLineIcon = ({ height, width }) => {
+    const { parsedWidth, parsedHeight } = getParsedRect({ width, height });
+    return `<svg
+        width="${width}"
+        height="${height}"
+        fill="none"
+        viewBox="0 0 ${parsedWidth} ${parsedHeight}"
+        xmlns="http://www.w3.org/2000/svg"
+    >
+        <path
+            fillRule="evenodd"
+            clipRule="evenodd"
+            d="M32 2h6V0h-6v2zM16 2h6V0h-6v2zM28 2h2V0h-2v2zM24 2h2V0h-2v2zM0 2h6V0H0v2zM12 2h2V0h-2v2zM8 2h2V0H8v2z"
+            fill="currentColor"
+        />
+    </svg>`;
+};

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/template-icons/ShortDashDotLineIcon.d.ts

@@ -0,0 +1,2 @@
+import type { CommonIconProps } from '../types';
+export declare const ShortDashDotLineIcon: ({ height, width }: CommonIconProps) => string;

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/template-icons/ShortDashDotLineIcon.js

@@ -0,0 +1,18 @@
+import { getParsedRect } from '../utils';
+export const ShortDashDotLineIcon = ({ height, width }) => {
+    const { parsedWidth, parsedHeight } = getParsedRect({ width, height });
+    return `<svg
+        width="${width}"
+        height="${height}"
+        fill="none"
+        viewBox="0 0 ${parsedWidth} ${parsedHeight}"
+        xmlns="http://www.w3.org/2000/svg"
+    >
+        <path
+            fillRule="evenodd"
+            clipRule="evenodd"
+            d="M34 2h6V0h-6v2zM22 2h6V0h-6v2zM30 2h2V0h-2v2zM10 2h6V0h-6v2zM18 2h2V0h-2v2zM-2 2h6V0h-6v2zM6 2h2V0H6v2z"
+            fill="currentColor"
+        />
+    </svg>`;
+};

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/template-icons/ShortDashLineIcon.d.ts

@@ -0,0 +1,2 @@
+import type { CommonIconProps } from '../types';
+export declare const ShortDashLineIcon: ({ height, width }: CommonIconProps) => string;

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/template-icons/ShortDashLineIcon.js

@@ -0,0 +1,18 @@
+import { getParsedRect } from '../utils';
+export const ShortDashLineIcon = ({ height, width }) => {
+    const { parsedWidth, parsedHeight } = getParsedRect({ width, height });
+    return `<svg
+        width="${width}"
+        height="${height}"
+        fill="none"
+        viewBox="-2 2 ${parsedWidth} ${parsedHeight}"
+        xmlns="http://www.w3.org/2000/svg"
+    >
+        <path
+            fillRule="evenodd"
+            clipRule="evenodd"
+            d="M-4 4h-3V2h3v2zm8 0h-6V2h6v2zm8 0H6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm8 0h-6V2h6v2zm5 0h-3V2h3v2z"
+            fill="currentColor"
+        />
+    </svg>`;
+};

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/template-icons/ShortDotLineIcon.d.ts

@@ -0,0 +1,2 @@
+import type { CommonIconProps } from '../types';
+export declare const ShortDotLineIcon: ({ height, width }: CommonIconProps) => string;

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/template-icons/ShortDotLineIcon.js

@@ -0,0 +1,20 @@
+import { getParsedRect } from '../utils';
+export const ShortDotLineIcon = ({ height, width }) => {
+    const { parsedWidth, parsedHeight } = getParsedRect({ width, height });
+    return `
+    <svg
+        width="${width}"
+        height="${height}"
+        fill="none"
+        viewBox="0 2 ${parsedWidth} ${parsedHeight}"
+        xmlns="http://www.w3.org/2000/svg"
+    >
+        <path
+            fillRule="evenodd"
+            clipRule="evenodd"
+            d="M-2 4h-1V2h1v2zm4 0H0V2h2v2zm4 0H4V2h2v2zm4 0H8V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm4 0h-2V2h2v2zm3 0h-1V2h1v2z"
+            fill="currentColor"
+        />
+    </svg>
+`;
+};

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/template-icons/SolidLineIcon.d.ts

@@ -0,0 +1,2 @@
+import type { CommonIconProps } from '../types';
+export declare const SolidLineIcon: ({ width, height }: CommonIconProps) => string;

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/template-icons/SolidLineIcon.js

@@ -0,0 +1,13 @@
+import { getParsedRect } from '../utils';
+export const SolidLineIcon = ({ width, height }) => {
+    const { parsedWidth, parsedHeight } = getParsedRect({ width, height });
+    return `<svg
+        width="${width}"
+        height="${height}"
+        fill="none"
+        viewBox="0 2 ${parsedWidth} ${parsedHeight}"
+        xmlns="http://www.w3.org/2000/svg"
+    >
+        <path fillRule="evenodd" clipRule="evenodd" d="M38 4H0V2h38v2z" fill="currentColor" />
+    </svg>`;
+};

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/template-icons/index.d.ts

@@ -0,0 +1,11 @@
+export { DashDotLineIcon } from './DashDotLineIcon';
+export { DashLineIcon } from './DashLineIcon';
+export { DotLineIcon } from './DotLineIcon';
+export { LongDashDotDotLineIcon } from './LongDashDotDotLineIcon';
+export { LongDashDotLineIcon } from './LongDashDotLineIcon';
+export { LongDashLineIcon } from './LongDashLineIcon';
+export { ShortDashDotDotLineIcon } from './ShortDashDotDotLineIcon';
+export { ShortDashDotLineIcon } from './ShortDashDotLineIcon';
+export { ShortDashLineIcon } from './ShortDashLineIcon';
+export { ShortDotLineIcon } from './ShortDotLineIcon';
+export { SolidLineIcon } from './SolidLineIcon';

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/template-icons/index.js

@@ -0,0 +1,11 @@
+export { DashDotLineIcon } from './DashDotLineIcon';
+export { DashLineIcon } from './DashLineIcon';
+export { DotLineIcon } from './DotLineIcon';
+export { LongDashDotDotLineIcon } from './LongDashDotDotLineIcon';
+export { LongDashDotLineIcon } from './LongDashDotLineIcon';
+export { LongDashLineIcon } from './LongDashLineIcon';
+export { ShortDashDotDotLineIcon } from './ShortDashDotDotLineIcon';
+export { ShortDashDotLineIcon } from './ShortDashDotLineIcon';
+export { ShortDashLineIcon } from './ShortDashLineIcon';
+export { ShortDotLineIcon } from './ShortDotLineIcon';
+export { SolidLineIcon } from './SolidLineIcon';

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/types.d.ts

@@ -0,0 +1,4 @@
+export declare type CommonIconProps = {
+    width: string;
+    height: string;
+};

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/types.js

@@ -0,0 +1 @@
+export {};

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/utils.d.ts

@@ -0,0 +1,7 @@
+export declare const getParsedRect: ({ width, height }: {
+    width?: string | undefined;
+    height?: string | undefined;
+}) => {
+    parsedWidth: number | undefined;
+    parsedHeight: number | undefined;
+};

package/build/plugins/highcharts/renderer/helpers/tooltip/render-shape-icon/utils.js

@@ -0,0 +1,5 @@
+export const getParsedRect = ({ width, height }) => {
+    const parsedWidth = typeof width === 'string' ? Number.parseInt(width, 10) : width;
+    const parsedHeight = typeof height === 'string' ? Number.parseInt(height, 10) : height;
+    return { parsedWidth, parsedHeight };
+};