diff --git a/.eslintrc.js b/.eslintrc.js index 434239460d..15a28bc7b6 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -105,6 +105,7 @@ module.exports = { indent: ['error', 2, { SwitchCase: 1, MemberExpression: 1, + offsetTernaryExpressions: true, }], 'max-len': [ 'warn', diff --git a/integration/jest_puppeteer.config.js b/integration/jest_puppeteer.config.js index 0fe709eb03..fdb35f5111 100644 --- a/integration/jest_puppeteer.config.js +++ b/integration/jest_puppeteer.config.js @@ -43,30 +43,30 @@ const sharedConfig = { const customConfig = { ...(isDebug ? { - launch: { - dumpio: false, - headless: false, - slowMo: 500, - devtools: true, - ...sharedConfig, - }, - } + launch: { + dumpio: false, + headless: false, + slowMo: 500, + devtools: true, + ...sharedConfig, + }, + } : { // https://github.com/gidztech/jest-puppeteer-docker/issues/24 - chromiumFlags: [], // for docker chromium options - connect: { - ...sharedConfig, - }, - }), + chromiumFlags: [], // for docker chromium options + connect: { + ...sharedConfig, + }, + }), server: useLocalStorybook ? null : { - command: `yarn start --port=${port} --quiet`, - port, - usedPortAction: 'error', - launchTimeout: 120000, - debug: true, - }, + command: `yarn start --port=${port} --quiet`, + port, + usedPortAction: 'error', + launchTimeout: 120000, + debug: true, + }, ...baseConfig, }; diff --git a/src/chart_types/goal_chart/renderer/canvas/canvas_renderers.ts b/src/chart_types/goal_chart/renderer/canvas/canvas_renderers.ts index ce722ae78f..d166e27529 100644 --- a/src/chart_types/goal_chart/renderer/canvas/canvas_renderers.ts +++ b/src/chart_types/goal_chart/renderer/canvas/canvas_renderers.ts @@ -96,9 +96,9 @@ export function renderCanvas2d( ...Object.assign({}, ...ticks.map(({ value, text }, i) => ({ [`tick_${i}`]: { value, text } }))), ...(circular ? { - centralMajor: { value: 0, text: centralMajor }, - centralMinor: { value: 0, text: centralMinor }, - } + centralMajor: { value: 0, text: centralMajor }, + centralMinor: { value: 0, text: centralMinor }, + } : {}), }; @@ -194,29 +194,29 @@ export function renderCanvas2d( }, ...(circular ? [ - { - order: 6, - landmarks: { at: 'centralMajor' }, - aes: { - shape: 'text', - textAlign: 'center', - textBaseline: 'bottom', - fillColor: 'black', - fontShape: { fontStyle: 'normal', fontVariant: 'normal', fontWeight: '900', fontFamily: 'sans-serif' }, + { + order: 6, + landmarks: { at: 'centralMajor' }, + aes: { + shape: 'text', + textAlign: 'center', + textBaseline: 'bottom', + fillColor: 'black', + fontShape: { fontStyle: 'normal', fontVariant: 'normal', fontWeight: '900', fontFamily: 'sans-serif' }, + }, }, - }, - { - order: 6, - landmarks: { at: 'centralMinor' }, - aes: { - shape: 'text', - textAlign: 'center', - textBaseline: 'top', - fillColor: 'black', - fontShape: { fontStyle: 'normal', fontVariant: 'normal', fontWeight: '300', fontFamily: 'sans-serif' }, + { + order: 6, + landmarks: { at: 'centralMinor' }, + aes: { + shape: 'text', + textAlign: 'center', + textBaseline: 'top', + fillColor: 'black', + fontShape: { fontStyle: 'normal', fontVariant: 'normal', fontWeight: '300', fontFamily: 'sans-serif' }, + }, }, - }, - ] + ] : []), ]; diff --git a/src/chart_types/partition_chart/layout/utils/calcs.ts b/src/chart_types/partition_chart/layout/utils/calcs.ts index ba51ad0465..4a400dba6c 100644 --- a/src/chart_types/partition_chart/layout/utils/calcs.ts +++ b/src/chart_types/partition_chart/layout/utils/calcs.ts @@ -64,8 +64,8 @@ export function getTextColor(shapeFillColor: Color, textColor: Color, textInvert const inverseForContrast = textInvertible && specifiedTextColorIsDark === backgroundIsDark; return inverseForContrast ? to === undefined - ? `rgb(${255 - tr}, ${255 - tg}, ${255 - tb})` - : `rgba(${255 - tr}, ${255 - tg}, ${255 - tb}, ${to})` + ? `rgb(${255 - tr}, ${255 - tg}, ${255 - tb})` + : `rgba(${255 - tr}, ${255 - tg}, ${255 - tb}, ${to})` : textColor; } diff --git a/src/chart_types/partition_chart/layout/viewmodel/fill_text_layout.ts b/src/chart_types/partition_chart/layout/viewmodel/fill_text_layout.ts index c37e9909a7..bf013f1452 100644 --- a/src/chart_types/partition_chart/layout/viewmodel/fill_text_layout.ts +++ b/src/chart_types/partition_chart/layout/viewmodel/fill_text_layout.ts @@ -119,11 +119,11 @@ export function ringSectorConstruction(config: Config, innerRadius: Radius, ring const rectangleCirclines = outerRadiusFromRectangleWidth === Infinity && outerRadiusFromRectanglHeight === Infinity ? [] : [ - { x: INFINITY_RADIUS - outerRadiusFromRectangleWidth, y: 0, r: INFINITY_RADIUS, inside: true }, - { x: -INFINITY_RADIUS + outerRadiusFromRectangleWidth, y: 0, r: INFINITY_RADIUS, inside: true }, - { x: 0, y: INFINITY_RADIUS - outerRadiusFromRectanglHeight, r: INFINITY_RADIUS, inside: true }, - { x: 0, y: -INFINITY_RADIUS + outerRadiusFromRectanglHeight, r: INFINITY_RADIUS, inside: true }, - ]; + { x: INFINITY_RADIUS - outerRadiusFromRectangleWidth, y: 0, r: INFINITY_RADIUS, inside: true }, + { x: -INFINITY_RADIUS + outerRadiusFromRectangleWidth, y: 0, r: INFINITY_RADIUS, inside: true }, + { x: 0, y: INFINITY_RADIUS - outerRadiusFromRectanglHeight, r: INFINITY_RADIUS, inside: true }, + { x: 0, y: -INFINITY_RADIUS + outerRadiusFromRectanglHeight, r: INFINITY_RADIUS, inside: true }, + ]; return [...sectorCirclines, ...rectangleCirclines]; }; } @@ -216,9 +216,9 @@ export const getRectangleRowGeometry: GetShapeRowGeometry const { top, right, bottom, left } = typeof padding === 'number' ? { top: padding, right: padding, bottom: padding, left: padding } : { - ...{ top: defaultPad, right: defaultPad, bottom: defaultPad, left: defaultPad }, - ...padding, - }; + ...{ top: defaultPad, right: defaultPad, bottom: defaultPad, left: defaultPad }, + ...padding, + }; const overhang = 0.05; const topPaddingAdjustment = fontSize < 6 ? 0 : Math.max(1, Math.min(2, fontSize / 16)); @@ -332,8 +332,8 @@ function fill( const verticalAlignment = middleAlign ? VerticalAlignments.middle : (node.depth < layers.length - ? VerticalAlignments.bottom - : VerticalAlignments.top); + ? VerticalAlignments.bottom + : VerticalAlignments.top); const fontSizes = allFontSizes[Math.min(node.depth, allFontSizes.length) - 1]; const { textColor, textInvertible, fontStyle, fontVariant, fontFamily, fontWeight, valueFormatter, padding } = { fontFamily: configFontFamily, diff --git a/src/chart_types/partition_chart/layout/viewmodel/link_text_layout.ts b/src/chart_types/partition_chart/layout/viewmodel/link_text_layout.ts index 7b1fc2de68..c84bf7f70d 100644 --- a/src/chart_types/partition_chart/layout/viewmodel/link_text_layout.ts +++ b/src/chart_types/partition_chart/layout/viewmodel/link_text_layout.ts @@ -109,9 +109,9 @@ export function linkTextLayout( ); const { text, width, verticalOffset } = linkLabel.fontSize / 2 <= cy + diskCenter.y && cy + diskCenter.y <= rectHeight - linkLabel.fontSize / 2 ? fitText(measure, labelText, allottedLabelWidth, linkLabel.fontSize, { - ...labelFontSpec, - text: labelText, - }) + ...labelFontSpec, + text: labelText, + }) : { text: '', width: 0, verticalOffset: 0 }; const link: PointTuples = [ [x0, y0], diff --git a/src/chart_types/partition_chart/layout/viewmodel/viewmodel.ts b/src/chart_types/partition_chart/layout/viewmodel/viewmodel.ts index 173167405a..1299bf0981 100644 --- a/src/chart_types/partition_chart/layout/viewmodel/viewmodel.ts +++ b/src/chart_types/partition_chart/layout/viewmodel/viewmodel.ts @@ -167,17 +167,17 @@ function rectangleConstruction(treeHeight: number, topGroove: number) { return function(node: ShapeTreeNode): RectangleConstruction { return node.depth < treeHeight ? { - x0: node.x0, - y0: node.y0px, - x1: node.x1, - y1: node.y0px + getTopPadding(topGroove, node.y1px - node.y0px), - } + x0: node.x0, + y0: node.y0px, + x1: node.x1, + y1: node.y0px + getTopPadding(topGroove, node.y1px - node.y0px), + } : { - x0: node.x0, - y0: node.y0px, - x1: node.x1, - y1: node.y1px, - }; + x0: node.x0, + y0: node.y0px, + x1: node.x1, + y1: node.y1px, + }; }; } @@ -232,11 +232,11 @@ export function shapeViewModel( const rawChildNodes: Array = treemapLayout ? treemap(tree, treemapAreaAccessor, topGrooveAccessor(topGroove), grooveAccessor, { - x0: -width / 2, - y0: -height / 2, - width, - height, - }) + x0: -width / 2, + y0: -height / 2, + width, + height, + }) : sunburst(tree, sunburstAreaAccessor, { x0: 0, y0: -1 }, clockwiseSectors, specialFirstInnermostSector); const shownChildNodes = rawChildNodes.filter((n: Part) => { @@ -331,10 +331,10 @@ export function shapeViewModel( treemapLayout ? ({ x0, y0, x1, y1 }) => x0 <= x && x <= x1 && y0 <= y && y <= y1 : ({ x0, y0px, x1, y1px }) => { - const angleX = (Math.atan2(y, x) + TAU / 4 + TAU) % TAU; - const yPx = Math.sqrt(x * x + y * y); - return x0 <= angleX && angleX <= x1 && y0px <= yPx && yPx <= y1px; - }, + const angleX = (Math.atan2(y, x) + TAU / 4 + TAU) % TAU; + const yPx = Math.sqrt(x * x + y * y); + return x0 <= angleX && angleX <= x1 && y0px <= yPx && yPx <= y1px; + }, ); // combined viewModel diff --git a/src/chart_types/xy_chart/annotations/line/dimensions.ts b/src/chart_types/xy_chart/annotations/line/dimensions.ts index bafd9c5d43..51959b781c 100644 --- a/src/chart_types/xy_chart/annotations/line/dimensions.ts +++ b/src/chart_types/xy_chart/annotations/line/dimensions.ts @@ -134,11 +134,11 @@ function computeYDomainLineAnnotationDimensions( const annotationMarker: AnnotationMarker | undefined = marker ? { - icon: marker, - color: lineColor, - dimension: markerDimension, - position: markerPosition, - } + icon: marker, + color: lineColor, + dimension: markerDimension, + position: markerPosition, + } : undefined; const lineProp: AnnotationLineProps = { anchor, @@ -279,11 +279,11 @@ function computeXDomainLineAnnotationDimensions( const annotationMarker: AnnotationMarker | undefined = marker ? { - icon: marker, - color: lineColor, - dimension: markerDimension, - position: markerPosition, - } + icon: marker, + color: lineColor, + dimension: markerDimension, + position: markerPosition, + } : undefined; const lineProp: AnnotationLineProps = { anchor, diff --git a/src/chart_types/xy_chart/rendering/rendering.ts b/src/chart_types/xy_chart/rendering/rendering.ts index 745b215814..c8aa8a245d 100644 --- a/src/chart_types/xy_chart/rendering/rendering.ts +++ b/src/chart_types/xy_chart/rendering/rendering.ts @@ -128,9 +128,9 @@ export function getRadiusFn(data: DataSeriesDatum[], lineWidth: number, markSize mark === null ? acc : { - min: Math.min(acc.min, mark / 2), - max: Math.max(acc.max, mark / 2), - }, + min: Math.min(acc.min, mark / 2), + max: Math.max(acc.max, mark / 2), + }, { min: Infinity, max: -Infinity }, ); const adjustedMarkSizeRatio = Math.min(Math.max(markSizeRatio, 0), 100); @@ -332,8 +332,8 @@ export function renderBars( // only show displayValue for even bars if showOverlappingValue const displayValueText = displayValueSettings && displayValueSettings.isAlternatingValueLabel ? barGeometries.length % 2 === 0 - ? formattedDisplayValue - : undefined + ? formattedDisplayValue + : undefined : formattedDisplayValue; const computedDisplayValueWidth = bboxCalculator.compute(displayValueText || '', padding, fontSize, fontFamily) @@ -344,12 +344,12 @@ export function renderBars( const displayValue = displayValueSettings && displayValueSettings.showValueLabel ? { - text: displayValueText, - width: displayValueWidth, - height: fontSize, - hideClippedValue, - isValueContainedInElement: displayValueSettings.isValueContainedInElement, - } + text: displayValueText, + width: displayValueWidth, + height: fontSize, + hideClippedValue, + isValueContainedInElement: displayValueSettings.isValueContainedInElement, + } : undefined; const seriesIdentifier: XYChartSeriesIdentifier = { diff --git a/src/chart_types/xy_chart/state/utils.ts b/src/chart_types/xy_chart/state/utils.ts index 525ab2085b..8094a247ed 100644 --- a/src/chart_types/xy_chart/state/utils.ts +++ b/src/chart_types/xy_chart/state/utils.ts @@ -552,9 +552,9 @@ function renderGeometries( const displayValueSettings = spec.displayValueSettings ? { - valueFormatter, - ...spec.displayValueSettings, - } + valueFormatter, + ...spec.displayValueSettings, + } : undefined; const renderedBars = renderBars( diff --git a/src/components/legend/legend_item.tsx b/src/components/legend/legend_item.tsx index 3e11029d23..35877cf4ba 100644 --- a/src/components/legend/legend_item.tsx +++ b/src/components/legend/legend_item.tsx @@ -120,9 +120,9 @@ export class LegendListItem extends Component handleColorClick = (changable: boolean): MouseEventHandler | undefined => changable ? (event) => { - event.stopPropagation(); - this.toggleIsOpen(); - } + event.stopPropagation(); + this.toggleIsOpen(); + } : undefined; toggleIsOpen = () => { @@ -207,8 +207,8 @@ export class LegendListItem extends Component const extra = getExtra(extraValues, item, totalItems); const style = item.depth ? { - marginLeft: LEGEND_HIERARCHY_MARGIN * (item.depth ?? 0), - } + marginLeft: LEGEND_HIERARCHY_MARGIN * (item.depth ?? 0), + } : undefined; return ( <> diff --git a/src/scales/scale_continuous.ts b/src/scales/scale_continuous.ts index 950a3f170d..fe889d3503 100644 --- a/src/scales/scale_continuous.ts +++ b/src/scales/scale_continuous.ts @@ -247,9 +247,9 @@ export class ScaleContinuous implements Scale { // This is forcing a return type of number[] but is really (number|Date)[] return integersOnly ? (this.d3Scale as D3ScaleNonTime) - .ticks(ticks) - .filter((item: number) => typeof item === 'number' && item % 1 === 0) - .map((item: number) => parseInt(item.toFixed(0), 10)) + .ticks(ticks) + .filter((item: number) => typeof item === 'number' && item % 1 === 0) + .map((item: number) => parseInt(item.toFixed(0), 10)) : (this.d3Scale as D3ScaleNonTime).ticks(ticks); } diff --git a/src/state/reducers/interactions.ts b/src/state/reducers/interactions.ts index e2c4a490b8..175d60192e 100644 --- a/src/state/reducers/interactions.ts +++ b/src/state/reducers/interactions.ts @@ -75,28 +75,28 @@ export function interactionsReducer( lastDrag: state.pointer.down && state.pointer.dragging ? { - start: { - position: { - ...state.pointer.down.position, + start: { + position: { + ...state.pointer.down.position, + }, + time: state.pointer.down.time, }, - time: state.pointer.down.time, - }, - end: { - position: { - ...state.pointer.current.position, + end: { + position: { + ...state.pointer.current.position, + }, + time: action.time, }, - time: action.time, - }, - } + } : null, lastClick: state.pointer.down && !state.pointer.dragging ? { - position: { - ...action.position, - }, - time: action.time, - } + position: { + ...action.position, + }, + time: action.time, + } : null, dragging: false, down: null, diff --git a/stories/bar/26_single_data_linear.tsx b/stories/bar/26_single_data_linear.tsx index 36f72f4e45..efa197b6c4 100644 --- a/stories/bar/26_single_data_linear.tsx +++ b/stories/bar/26_single_data_linear.tsx @@ -27,8 +27,8 @@ export const Example = () => { const hasCustomDomain = boolean('has custom domain', false); const xDomain = hasCustomDomain ? { - min: 0, - } + min: 0, + } : undefined; const theme = {