> ## Documentation Index
> Fetch the complete documentation index at: https://docs.graphy.dev/llms.txt
> Use this file to discover all available pages before exploring further.

# Internationalization

Graphy uses two separate locale systems:

| Type | Purpose | How to set |
| - | - | - |
| **Data Locale** | Parses dates and numbers in your dataset | `data._metadata.parsingLocale` |
| **UI Locale** | Renders text in the visualization and editor | `uiLocale` prop on `GraphProvider` |

These are independent — you can parse data in one format while displaying the UI in another language.

## Data Locale

The data locale controls how Graphy interprets dates and numbers in your dataset.

| Locale | Date format | Example |
| - | - | - |
| `en-US` (default) | MM/DD/YYYY | `03/15/2024` → 15th March |
| `en-GB` | DD/MM/YYYY | `15/03/2024` → 15th March |

Set it in your data configuration:

```tsx theme={null}
const config: GraphConfig = {
  data: {
    columns: [...],
    rows: [...],
    _metadata: {
      parsingLocale: 'en-GB'
    }
  }
};
```

## UI Locale

The UI locale controls all text displayed in the visualization and editor, including labels, tooltips, and menu items. It also determines the text direction (LTR or RTL).

### Available locales

| Locale | Language | Text Direction |
| - | - | - |
| `en-GB` | English (UK) | LTR |
| `en-US` | English (US) | LTR |
| `pt-PT` | Portuguese | LTR |
| `ar` | Arabic | RTL |

### Setting the UI locale

```tsx theme={null}
import { GraphProvider } from '@graphy/core';

<GraphProvider uiLocale="ar">
  <Graph config={config} />
</GraphProvider>;
```

### Example: Different data and UI locales

You might have data formatted for a UK audience but want to display the UI in Arabic:

```tsx theme={null}
const config: GraphConfig = {
  data: {
    columns: [...],
    rows: [...],
    _metadata: {
      parsingLocale: 'en-GB' // Parse dates as DD/MM/YYYY
    }
  }
};

{/* Display UI in Arabic (RTL) */}
<GraphProvider uiLocale="ar">
  <Graph config={config} />
</GraphProvider>
```

## Runtime overrides

The `i18nOverrides` prop on `GraphProvider` allows you to customize translations and text direction at runtime, without switching the entire locale.

### Overriding strings

Override any UI text by providing translation keys:

```tsx theme={null}
<GraphProvider
  i18nOverrides={{
    'editor.graphTypes.bar': 'Barra',
    'graph.axisLabels.placeholder': 'Añadir etiqueta',
  }}
>
  <Graph />
</GraphProvider>
```

Some strings accept parameters. Provide a function to handle dynamic values:

```tsx theme={null}
<GraphProvider
  i18nOverrides={{
    'graph.defaultPropertyLabels.columnNumber': ({ number }) => `Columna ${number}`,
    'common.confirmDelete': ({ item }) => `¿Eliminar ${item}?`,
  }}
>
  <Graph />
</GraphProvider>
```

### Overriding text direction (RTL support)

Text direction is automatically determined by the selected locale (e.g., Arabic uses RTL). You can override it manually using the `dir` property:

```tsx theme={null}
<GraphProvider
  i18nOverrides={{
    dir: 'rtl',
  }}
>
  <Graph config={config} />
</GraphProvider>
```

Valid values are `'ltr'` (left-to-right) and `'rtl'` (right-to-left).

This is useful when you want to:

* Force RTL layout while using an LTR locale's translations
* Force LTR layout while using an RTL locale's translations
* Test RTL behavior during development

### Combining overrides

You can combine string overrides with text direction in a single configuration:

```tsx theme={null}
<GraphProvider
  i18nOverrides={{
    dir: 'rtl',
    'graph.axisLabels.placeholder': 'إضافة تسمية',
    'editor.graphTypes.bar': 'شريط',
  }}
>
  <Graph config={config} />
</GraphProvider>
```

## String reference

### Common

| Key | Default | Parameters |
| - | - | - |
| `common.save` | "Save" | - |
| `common.cancel` | "Cancel" | - |
| `common.confirm` | "Confirm" | - |
| `common.delete` | "Delete" | - |
| `common.confirmDelete` | "Are you sure you want to delete \${item}?" | `{ item }` |
| `common.abbreviations.thousands` | "k" | - |
| `common.abbreviations.millions` | "m" | - |
| `common.abbreviations.billions` | "b" | - |

### Graph - General

| Key | Default | Parameters |
| - | - | - |
| `graph.loading` | "Loading" | - |
| `graph.error` | "Something went wrong" | - |
| `graph.axisLabels.placeholder` | "Add label" | - |
| `graph.waterfall.totalLabel` | "Total" | - |

### Graph - Default property labels

| Key | Default | Parameters |
| - | - | - |
| `graph.defaultPropertyLabels.date` | "Date" | - |
| `graph.defaultPropertyLabels.year` | "Year" | - |
| `graph.defaultPropertyLabels.quarter` | "Quarter" | - |
| `graph.defaultPropertyLabels.month` | "Month" | - |
| `graph.defaultPropertyLabels.week` | "Week" | - |
| `graph.defaultPropertyLabels.series` | "Series" | - |
| `graph.defaultPropertyLabels.category` | "Category" | - |
| `graph.defaultPropertyLabels.columnNumber` | "Column \${number}" | `{ number }` |
| `graph.defaultPropertyLabels.rowNumber` | "Row \${number}" | `{ number }` |
| `graph.defaultPropertyLabels.seriesNumber` | "Series \${number}" | `{ number }` |

### Graph - Trend comparisons

| Key | Default | Parameters |
| - | - | - |
| `graph.trendComparison.fromPrevious.long` | "\${value} vs previous" | `{ value }` |
| `graph.trendComparison.fromPrevious.short` | "\${value} vs prev" | `{ value }` |
| `graph.trendComparison.fromPreviousYear.long` | "\${value} vs previous year" | `{ value }` |
| `graph.trendComparison.fromPreviousYear.short` | "\${value} vs prev year" | `{ value }` |
| `graph.trendComparison.fromPreviousMonth.long` | "\${value} vs previous month" | `{ value }` |
| `graph.trendComparison.fromPreviousMonth.short` | "\${value} vs prev month" | `{ value }` |
| `graph.trendComparison.fromPreviousWeek.long` | "\${value} vs previous week" | `{ value }` |
| `graph.trendComparison.fromPreviousWeek.short` | "\${value} vs prev week" | `{ value }` |
| `graph.trendComparison.fromPreviousDay.long` | "\${value} vs previous day" | `{ value }` |
| `graph.trendComparison.fromPreviousDay.short` | "\${value} vs prev day" | `{ value }` |
| `graph.trendComparison.fromPreviousHour.long` | "\${value} vs previous hour" | `{ value }` |
| `graph.trendComparison.fromPreviousHour.short` | "\${value} vs prev hour" | `{ value }` |

### Graph - Headline metrics

| Key | Default | Parameters |
| - | - | - |
| `graph.headlineMetrics.averageLong` | "Average \${value}" | `{ value }` |
| `graph.headlineMetrics.averageShort` | "Avg. \${value}" | `{ value }` |
| `graph.headlineMetrics.total` | "Total \${value}" | `{ value }` |
| `graph.headlineMetrics.totalConversionRate` | "Total conversion rate \${value}" | `{ value }` |
| `graph.headlineMetrics.current` | "\${value}" | `{ value }` |

### Graph - Title editor

| Key | Default |
| - | - |
| `graph.titleEditor.titlePlaceholder` | "Untitled" |
| `graph.titleEditor.subtitlePlaceholder` | "Add a subtitle" |

### Graph - Text toolbar formatting

| Key | Default |
| - | - |
| `graph.toolbar.formatting.bold` | "Bold" |
| `graph.toolbar.formatting.italic` | "Italic" |
| `graph.toolbar.formatting.underline` | "Underline" |
| `graph.toolbar.formatting.link` | "Link" |

### Graph - Text toolbar link

| Key | Default |
| - | - |
| `graph.toolbar.link.ariaLabel` | "Create link" |
| `graph.toolbar.link.placeholder` | "Type or paste a link..." |
| `graph.toolbar.link.submit` | "Submit" |

### Graph - Text toolbar font

| Key | Default |
| - | - |
| `graph.toolbar.font.label` | "Font" |

### Graph - Text toolbar heading

| Key | Default |
| - | - |
| `graph.toolbar.heading.label` | "Heading level" |
| `graph.toolbar.heading.text` | "Text" |
| `graph.toolbar.heading.caption` | "Caption" |
| `graph.toolbar.heading.heading1` | "Heading 1" |
| `graph.toolbar.heading.heading2` | "Heading 2" |
| `graph.toolbar.heading.heading3` | "Heading 3" |

### Graph - Text toolbar alignment

| Key | Default |
| - | - |
| `graph.toolbar.textAlign.left` | "Align left" |
| `graph.toolbar.textAlign.center` | "Align center" |
| `graph.toolbar.textAlign.right` | "Align right" |

### Graph - Text toolbar color

| Key | Default |
| - | - |
| `graph.toolbar.color.label` | "Text color" |

### Graph - Color dropdown

| Key | Default |
| - | - |
| `graph.colorDropdown.colors` | "Colors" |
| `graph.colorDropdown.chartColors` | "Chart colors" |
| `graph.colorDropdown.custom` | "Custom" |
| `graph.colorDropdown.opacity` | "Opacity" |
| `graph.colorDropdown.transparent` | "Transparent" |

### Graph - Annotations base menu

| Key | Default | Parameters |
| - | - | - |
| `graph.annotations.baseMenu.pinNumber` | "Pin number" | - |
| `graph.annotations.baseMenu.annotate` | "Annotate" | - |
| `graph.annotations.baseMenu.highlight` | "Highlight" | - |
| `graph.annotations.baseMenu.highlightWithLabel` | "Highlight \${label}" | `{ label }` |
| `graph.annotations.baseMenu.removeHighlight` | "Remove highlight" | - |
| `graph.annotations.baseMenu.differenceArrow` | "Difference arrow" | - |
| `graph.annotations.baseMenu.addSticker` | "Add sticker" | - |

### Graph - Annotations text menu

| Key | Default |
| - | - |
| `graph.annotations.textMenu.title` | "Annotate" |
| `graph.annotations.textMenu.placeholder` | "Add a comment" |
| `graph.annotations.textMenu.addButton` | "Add" |

### Graph - Annotations highlights

| Key | Default |
| - | - |
| `graph.annotations.highlights.menuTitle` | "Highlight" |
| `graph.annotations.highlights.labels.bar` | "Bar" |
| `graph.annotations.highlights.labels.barGroup` | "Group" |
| `graph.annotations.highlights.labels.barStack` | "Stack" |
| `graph.annotations.highlights.labels.barSeries` | "Series" |
| `graph.annotations.highlights.labels.line` | "Line" |
| `graph.annotations.highlights.labels.linePoint` | "Point" |
| `graph.annotations.highlights.labels.lineSeries` | "Series" |
| `graph.annotations.highlights.labels.scatterPoint` | "Point" |
| `graph.annotations.highlights.labels.scatterSeries` | "Series" |
| `graph.annotations.highlights.labels.pieSlice` | "Slice" |
| `graph.annotations.highlights.labels.pointOrBar` | "Point / bar" |
| `graph.annotations.highlights.labels.lineOrSeries` | "Line / series" |

### Graph - Annotations sticker menu

| Key | Default |
| - | - |
| `graph.annotations.stickerMenu.title` | "Add sticker" |

### Graph - Annotations delete

| Key | Default |
| - | - |
| `graph.annotations.delete` | "Delete" |

### Graph - Annotations arrow

| Key | Default |
| - | - |
| `graph.annotations.arrow.thickness.label` | "Thickness" |
| `graph.annotations.arrow.thickness.thin` | "Thin" |
| `graph.annotations.arrow.thickness.medium` | "Medium" |
| `graph.annotations.arrow.thickness.thick` | "Thick" |
| `graph.annotations.arrow.arrowhead.startPoint` | "Start point" |
| `graph.annotations.arrow.arrowhead.endPoint` | "End point" |
| `graph.annotations.arrow.arrowhead.lineArrow` | "Line arrow" |
| `graph.annotations.arrow.arrowhead.none` | "None" |
| `graph.annotations.arrow.lineStyle.label` | "Line style" |
| `graph.annotations.arrow.lineStyle.solid` | "Solid" |
| `graph.annotations.arrow.lineStyle.dotted` | "Dotted" |
| `graph.annotations.arrow.stickerEffect` | "Sticker effect" |
| `graph.annotations.arrow.toolbarAriaLabel` | "Free-form arrow toolbar" |
| `graph.annotations.arrow.editorAriaLabel` | "Arrow editor" |

### Graph - Annotations difference arrow

| Key | Default | Parameters |
| - | - | - |
| `graph.annotations.differenceArrow.type.proportion` | "Proportion" | - |
| `graph.annotations.differenceArrow.type.difference` | "Difference (\${absoluteDifference})" | `{ absoluteDifference }` |
| `graph.annotations.differenceArrow.type.increase` | "Increase (\${absoluteDifference})" | `{ absoluteDifference }` |
| `graph.annotations.differenceArrow.type.decrease` | "Decrease (\${absoluteDifference})" | `{ absoluteDifference }` |
| `graph.annotations.differenceArrow.type.percentageChange` | "Percentage change (\${percentageChange})" | `{ percentageChange }` |
| `graph.annotations.differenceArrow.type.percentIncrease` | "Percent increase (\${percentageChange})" | `{ percentageChange }` |
| `graph.annotations.differenceArrow.type.percentDecrease` | "Percent decrease (\${percentageChange})" | `{ percentageChange }` |
| `graph.annotations.differenceArrow.size.label` | "Size" | - |
| `graph.annotations.differenceArrow.size.small` | "Small" | - |
| `graph.annotations.differenceArrow.size.medium` | "Medium" | - |
| `graph.annotations.differenceArrow.size.large` | "Large" | - |
| `graph.annotations.differenceArrow.flipArrow` | "Flip arrow" | - |
| `graph.annotations.differenceArrow.color` | "Color" | - |
| `graph.annotations.differenceArrow.toolbarAriaLabel` | "Difference arrow toolbar" | - |
| `graph.annotations.differenceArrow.editorAriaLabel` | "Difference arrow editor" | - |

### Graph - Annotations shape

| Key | Default | Parameters |
| - | - | - |
| `graph.annotations.shape.color` | "Color" | - |
| `graph.annotations.shape.border.label` | "Border" | - |
| `graph.annotations.shape.border.none` | "None" | - |
| `graph.annotations.shape.border.thin` | "Thin (\${value})" | `{ value }` |
| `graph.annotations.shape.border.medium` | "Medium (\${value})" | `{ value }` |
| `graph.annotations.shape.border.thick` | "Thick (\${value})" | `{ value }` |

### Editor - General

| Key | Default |
| - | - |
| `editor.title` | "Graphy Editor" |
| `editor.description` | "Edit your content here" |

### Editor - Graph types

| Key | Default |
| - | - |
| `editor.graphTypes.column` | "Column" |
| `editor.graphTypes.columnStacked` | "Stacked" |
| `editor.graphTypes.columnStackedFill` | "100% Stacked" |
| `editor.graphTypes.bar` | "Bar" |
| `editor.graphTypes.barStacked` | "Stacked" |
| `editor.graphTypes.barStackedFill` | "100% Stacked" |
| `editor.graphTypes.line` | "Line" |
| `editor.graphTypes.areaStacked` | "Stacked Area" |
| `editor.graphTypes.pie` | "Pie" |
| `editor.graphTypes.donut` | "Donut" |
| `editor.graphTypes.scatter` | "Scatter" |
| `editor.graphTypes.bubble` | "Bubble" |
| `editor.graphTypes.funnel` | "Funnel" |
| `editor.graphTypes.combo` | "Combo" |
| `editor.graphTypes.heatmap` | "Heatmap" |
| `editor.graphTypes.waterfall` | "Waterfall" |
| `editor.graphTypes.mekko` | "Mekko" |
| `editor.graphTypes.table` | "Table" |

### Editor - Size panel

| Key | Default | Parameters |
| - | - | - |
| `editor.sizePanel.toolbarButton` | "Size" | - |
| `editor.sizePanel.presetsSection.title` | "Presets" | - |
| `editor.sizePanel.customSizeSection.title` | "Custom size" | - |
| `editor.sizePanel.presets.googleSlides` | "Google Slides / PowerPoint" | - |
| `editor.sizePanel.presets.webEmail` | "Web / email" | - |
| `editor.sizePanel.presets.linkedIn` | "LinkedIn post" | - |
| `editor.sizePanel.presets.instagram` | "Instagram post" | - |
| `editor.sizePanel.presets.tiktok` | "TikTok / Instagram story" | - |
| `editor.sizePanel.presets.twitter` | "X (Twitter)" | - |
| `editor.sizePanel.presets.mobile` | "Mobile" | - |
| `editor.sizePanel.inputs.unitLabel` | "px" | - |
| `editor.sizePanel.validation.maxSizeError` | "≤ \${max}px" | `{ max }` |
| `editor.sizePanel.validation.minSizeError` | "≥ \${min}px" | `{ min }` |

### Editor - Graph panel

| Key | Default |
| - | - |
| `editor.graphPanel.toolbarButton` | "Graph" |
| `editor.graphPanel.graphTypeSection.title` | "Graph type" |
| `editor.graphPanel.graphOptionsSection.title` | "Graph options" |
| `editor.graphPanel.graphOptions.sortBars` | "Sort high → low" |
| `editor.graphPanel.graphOptions.gridLines` | "Grid lines" |
| `editor.graphPanel.graphOptions.showPoints` | "Show points" |
| `editor.graphPanel.graphOptions.smoothLines` | "Smooth lines" |
| `editor.graphPanel.graphOptions.stackTotals` | "Stack totals" |
| `editor.graphPanel.graphOptions.dataLabels` | "Data labels" |
| `editor.graphPanel.graphOptions.showPercentages` | "Show percentages" |
| `editor.graphPanel.graphOptions.categoryLabels` | "Category labels" |
| `editor.graphPanel.legendSection.title` | "Legend" |
| `editor.graphPanel.legendSection.right` | "Right" |
| `editor.graphPanel.legendSection.top` | "Top" |
| `editor.graphPanel.legendSection.none` | "None" |
| `editor.graphPanel.numberFormatSection.title` | "Number format" |
| `editor.graphPanel.numberFormat.abbreviationLabel` | "Abbreviation" |
| `editor.graphPanel.numberFormat.valueLabel` | "Value" |
| `editor.graphPanel.numberFormat.decimalPlacesLabel` | "Decimal places" |
| `editor.graphPanel.numberFormat.options.auto` | "Auto" |
| `editor.graphPanel.numberFormat.options.custom` | "Custom" |
| `editor.graphPanel.numberFormat.options.none` | "None" |
| `editor.graphPanel.headlineNumberSize.sizeLabel` | "Size" |
| `editor.graphPanel.headlineNumberSize.valueLabel` | "Value" |
| `editor.graphPanel.headlineNumberSize.sizes.small` | "S" |
| `editor.graphPanel.headlineNumberSize.sizes.medium` | "M" |
| `editor.graphPanel.headlineNumberSize.sizes.large` | "L" |
| `editor.graphPanel.lineThickness.label` | "Line thickness" |
| `editor.graphPanel.pointSize.label` | "Point size" |
| `editor.graphPanel.pointSize.options.auto` | "Auto" |
| `editor.graphPanel.pointSize.options.custom` | "Custom" |

### Editor - Headline number section

| Key | Default |
| - | - |
| `editor.graphPanel.headlineNumberSection.title` | "Headline number" |
| `editor.graphPanel.headlineNumberSection.toggle` | "Visible" |
| `editor.graphPanel.headlineNumberSection.metricLabel` | "Metric" |
| `editor.graphPanel.headlineNumberSection.compareWithLabel` | "Compare with" |
| `editor.graphPanel.headlineNumberSection.metrics.total` | "Total" |
| `editor.graphPanel.headlineNumberSection.metrics.average` | "Avg." |
| `editor.graphPanel.headlineNumberSection.metrics.current` | "Last" |
| `editor.graphPanel.headlineNumberSection.metrics.conversion` | "Conversion" |
| `editor.graphPanel.headlineNumberSection.metrics.left` | "Left" |
| `editor.graphPanel.headlineNumberSection.comparison.first` | "First" |
| `editor.graphPanel.headlineNumberSection.comparison.previous` | "Previous" |
| `editor.graphPanel.headlineNumberSection.pieTotalPosition.left` | "Left" |
| `editor.graphPanel.headlineNumberSection.pieTotalPosition.center` | "Center" |

### Editor - Treat empty values

| Key | Default |
| - | - |
| `editor.graphPanel.treatEmptyValues.leaveGap.label` | "Leave gap in chart" |
| `editor.graphPanel.treatEmptyValues.leaveGap.description` | "Leaves a visible break in the line where data is missing" |
| `editor.graphPanel.treatEmptyValues.fillZero.label` | "Fill with zero" |
| `editor.graphPanel.treatEmptyValues.fillZero.description` | "Displays missing data points as zero" |
| `editor.graphPanel.treatEmptyValues.connectGaps.label` | "Connect across gaps" |
| `editor.graphPanel.treatEmptyValues.connectGaps.description` | "Joins the line between available points, skipping the gap" |

### Editor - Combo chart appearance

| Key | Default |
| - | - |
| `editor.graphPanel.comboChartAppearance.title` | "Combo chart appearance" |
| `editor.graphPanel.comboChartAppearance.groupedBars` | "Grouped bars" |
| `editor.graphPanel.comboChartAppearance.stackedBars` | "Stacked bars" |
| `editor.graphPanel.comboChartAppearance.linesOnly` | "Lines only" |

### Editor - Column mapping

| Key | Default |
| - | - |
| `editor.columnMapping.title` | "Data" |
| `editor.columnMapping.xAxis` | "X-axis" |
| `editor.columnMapping.yAxis` | "Y-axis" |
| `editor.columnMapping.leftYAxis` | "Y-axis (left)" |
| `editor.columnMapping.rightYAxis` | "Y-axis (right)" |
| `editor.columnMapping.slices` | "Values (slices)" |
| `editor.columnMapping.labels` | "Labels" |
| `editor.columnMapping.size` | "Size" |
| `editor.columnMapping.shape` | "Shape" |
| `editor.columnMapping.reset` | "Reset to auto" |
| `editor.columnMapping.addSeries` | "Add series" |
| `editor.columnMapping.removeSeries` | "Remove series" |

### Editor - Axes panel

| Key | Default |
| - | - |
| `editor.axesPanel.toolbarButton` | "Axes" |
| `editor.axesPanel.mainAxisSection.yAxis` | "Y-axis" |
| `editor.axesPanel.mainAxisSection.xAxis` | "X-axis" |
| `editor.axesPanel.crossAxisSection.xAxis` | "X-axis" |
| `editor.axesPanel.crossAxisSection.yAxis` | "Y-axis" |
| `editor.axesPanel.controls.visible` | "Visible" |
| `editor.axesPanel.controls.labels` | "Labels" |
| `editor.axesPanel.controls.position` | "Position" |
| `editor.axesPanel.controls.scale` | "Scale" |
| `editor.axesPanel.controls.startFrom` | "Start from" |
| `editor.axesPanel.controls.endAt` | "End at" |
| `editor.axesPanel.controls.value` | "Value" |
| `editor.axesPanel.controls.numberOfAxes` | "Number of axes" |
| `editor.axesPanel.controls.reverse` | "Reverse" |
| `editor.axesPanel.labelMode.auto` | "Auto" |
| `editor.axesPanel.labelMode.edges` | "Edges" |
| `editor.axesPanel.scale.auto` | "Auto" |
| `editor.axesPanel.scale.log` | "Log" |
| `editor.axesPanel.startFrom.auto` | "Auto" |
| `editor.axesPanel.startFrom.zero` | "Zero" |
| `editor.axesPanel.startFrom.custom` | "Custom" |
| `editor.axesPanel.endAt.auto` | "Auto" |
| `editor.axesPanel.endAt.custom` | "Custom" |
| `editor.axesPanel.axisCount.single` | "Single" |
| `editor.axesPanel.axisCount.double` | "Double" |
| `editor.axesPanel.position.left` | "Left" |
| `editor.axesPanel.position.right` | "Right" |
| `editor.axesPanel.position.top` | "Top" |
| `editor.axesPanel.position.bottom` | "Bottom" |
| `editor.axesPanel.yesNo.yes` | "Yes" |
| `editor.axesPanel.yesNo.no` | "No" |

### Editor - Color panel

| Key | Default |
| - | - |
| `editor.colorPanel.toolbarButton` | "Color" |
| `editor.colorPanel.themeSection.title` | "Theme" |
| `editor.colorPanel.paletteSection.title` | "Palette" |
| `editor.colorPanel.paletteSection.colorScheme` | "Color scheme" |
| `editor.colorPanel.paletteSection.colors` | "Colors" |
| `editor.colorPanel.paletteSection.colorPalettes` | "Color palettes" |
| `editor.colorPanel.paletteMode.preset` | "Preset" |
| `editor.colorPanel.paletteMode.brand` | "Brand" |
| `editor.colorPanel.paletteMode.freestyle` | "Freestyle" |
| `editor.colorPanel.paletteThemes.colorful` | "Colorful" |
| `editor.colorPanel.paletteThemes.pastel` | "Pastel" |
| `editor.colorPanel.paletteThemes.neon` | "Neon" |
| `editor.colorPanel.backgroundSection.title` | "Background" |
| `editor.colorPanel.backgroundSection.black` | "Black" |
| `editor.colorPanel.backgroundSection.white` | "White" |
| `editor.colorPanel.backgroundSection.grey` | "Grey" |
| `editor.colorPanel.backgroundSection.tint` | "Tint" |
| `editor.colorPanel.backgroundSection.custom` | "Custom" |
| `editor.colorPanel.backgroundSection.none` | "None" |
| `editor.colorPanel.borderSection.title` | "Border" |
| `editor.colorPanel.borderSection.borderColor` | "Border color" |
| `editor.colorPanel.borderSection.thickness` | "Thickness" |
| `editor.colorPanel.borderSection.cornerRadius` | "Corner radius" |
| `editor.colorPanel.borderType.solid` | "Solid" |
| `editor.colorPanel.borderType.gradient` | "Gradient" |
| `editor.colorPanel.borderType.grey` | "Grey" |
| `editor.colorPanel.borderType.preset` | "Preset" |
| `editor.colorPanel.borderType.custom` | "Custom" |
| `editor.colorPanel.borderType.none` | "None" |
| `editor.colorPanel.presetGradients.lilac` | "Lilac" |
| `editor.colorPanel.presetGradients.neonPink` | "Neon Pink" |
| `editor.colorPanel.presetGradients.blackberry` | "Blackberry" |
| `editor.colorPanel.presetGradients.sun` | "Sun" |
| `editor.colorPanel.presetGradients.iceland` | "Iceland" |
| `editor.colorPanel.presetGradients.sunset` | "Sunset" |
| `editor.colorPanel.presetGradients.ultraviolet` | "Ultraviolet" |
| `editor.colorPanel.presetGradients.purple` | "Purple" |
| `editor.colorPanel.presetGradients.iceCream` | "Ice Cream" |
| `editor.colorPanel.presetGradients.mint` | "Mint" |
| `editor.colorPanel.presetGradients.cool` | "Cool" |
| `editor.colorPanel.presetGradients.fresh` | "Fresh" |

### Editor - Design panel

| Key | Default |
| - | - |
| `editor.designPanel.toolbarButton` | "Design" |
| `editor.designPanel.defaultExpanded` | "Palette" |

### Editor - Annotate panel

| Key | Default |
| - | - |
| `editor.annotatePanel.toolbarButton` | "Annotate" |
| `editor.annotatePanel.callOutSection.title` | "Call-out" |
| `editor.annotatePanel.callOutSection.text` | "Text" |
| `editor.annotatePanel.callOutSection.arrow` | "Arrow" |
| `editor.annotatePanel.callOutSection.box` | "Box" |
| `editor.annotatePanel.callOutSection.differenceArrows` | "Difference arrows" |
| `editor.annotatePanel.highlightSection.title` | "Highlight" |
| `editor.annotatePanel.highlightSection.button` | "Highlight" |
| `editor.annotatePanel.highlightSection.colorLabel` | "Highlight color" |

### Editor - Annotations panel

| Key | Default |
| - | - |
| `editor.annotationsPanel.toolbarButton` | "Annotate" |
| `editor.annotationsPanel.freeformSection.title` | "Freeform" |
| `editor.annotationsPanel.freeformSection.text` | "Text" |
| `editor.annotationsPanel.freeformSection.arrow` | "Arrow" |
| `editor.annotationsPanel.freeformSection.box` | "Box" |
| `editor.annotationsPanel.freeformSection.difference` | "Difference" |
| `editor.annotationsPanel.goalSection.title` | "Goal" |
| `editor.annotationsPanel.goalSection.labelControl` | "Label" |
| `editor.annotationsPanel.goalSection.labelPlaceholder` | "Goal" |
| `editor.annotationsPanel.goalSection.labelAriaLabel` | "Custom goal label" |
| `editor.annotationsPanel.goalSection.valueControl` | "Goal value" |
| `editor.annotationsPanel.goalSection.valueAriaLabel` | "Goal value" |
| `editor.annotationsPanel.goalSection.byDate` | "By date" |
| `editor.annotationsPanel.goalSection.xAxisValue` | "X-axis value" |
| `editor.annotationsPanel.goalSection.optional` | "(optional)" |
| `editor.annotationsPanel.trendsAndAveragesSection.title` | "Trends and Averages" |
| `editor.annotationsPanel.trendsAndAveragesSection.trend` | "Trend" |
| `editor.annotationsPanel.trendsAndAveragesSection.average` | "Average" |
| `editor.annotationsPanel.trendType.label` | "Trend type" |
| `editor.annotationsPanel.trendType.placeholder` | "Trend type" |
| `editor.annotationsPanel.trendType.options.linear` | "Linear" |
| `editor.annotationsPanel.trendType.options.exponential` | "Exponential" |
| `editor.annotationsPanel.trendType.options.quadratic` | "Quadratic" |
| `editor.annotationsPanel.trendType.options.polynomial` | "Polynomial" |
| `editor.annotationsPanel.trendType.options.logarithmic` | "Logarithmic" |
| `editor.annotationsPanel.trendType.options.power` | "Power" |
| `editor.annotationsPanel.trendType.options.loess` | "Loess" |
| `editor.annotationsPanel.averageLineSeries.label` | "Average line series" |
| `editor.annotationsPanel.averageLineSeries.placeholder` | "Select series" |
| `editor.annotationsPanel.averageLineSeries.ariaLabel` | "Series dropdown for average line" |
| `editor.annotationsPanel.highlightSection.title` | "Highlight" |
| `editor.annotationsPanel.highlightSection.button` | "Highlight" |
| `editor.annotationsPanel.highlightSection.fadeColorLabel` | "Fade color" |
| `editor.annotationsPanel.titleAndSubtitleSection.title` | "Title & Subtitle" |
| `editor.annotationsPanel.titleAndSubtitleSection.toggleTitle` | "Title" |
| `editor.annotationsPanel.titleAndSubtitleSection.subtitle` | "Subtitle" |
| `editor.annotationsPanel.captionAndSourceSection.title` | "Caption & Source" |
| `editor.annotationsPanel.captionAndSourceSection.caption` | "Caption" |
| `editor.annotationsPanel.captionAndSourceSection.source` | "Source" |
| `editor.annotationsPanel.captionAndSourceSection.url` | "URL" |
| `editor.annotationsPanel.captionAndSourceSection.name` | "Name" |

### Editor - Elements panel

| Key | Default | Parameters |
| - | - | - |
| `editor.elementsPanel.toolbarButton` | "Elements" | - |
| `editor.elementsPanel.headerSection.title` | "Header" | - |
| `editor.elementsPanel.headerSection.toggleTitle` | "Title" | - |
| `editor.elementsPanel.headerSection.subtitle` | "Subtitle" | - |
| `editor.elementsPanel.footerSection.title` | "Footer" | - |
| `editor.elementsPanel.footerSection.caption` | "Caption" | - |
| `editor.elementsPanel.footerSection.source` | "Source" | - |
| `editor.elementsPanel.footerSection.url` | "URL" | - |
| `editor.elementsPanel.footerSection.name` | "Name" | - |
| `editor.elementsPanel.textSizeSection.title` | "Text size" | - |
| `editor.elementsPanel.textSizeSection.scaleFormat` | "\${value}x" | `{ value }` |
| `editor.elementsPanel.fontSection.title` | "Font" | - |
| `editor.elementsPanel.sourceSection.title` | "Source" | - |
| `editor.elementsPanel.sourceSection.url` | "URL" | - |
| `editor.elementsPanel.sourceSection.name` | "Name" | - |

### Editor - Power-ups panel

| Key | Default |
| - | - |
| `editor.powerUpPanel.toolbarButton` | "Power-ups" |
| `editor.powerUpPanel.goalSection.title` | "Goal" |
| `editor.powerUpPanel.goalSection.toggle` | "Goal" |
| `editor.powerUpPanel.goalSection.labelControl` | "Label" |
| `editor.powerUpPanel.goalSection.labelPlaceholder` | "Goal" |
| `editor.powerUpPanel.goalSection.labelAriaLabel` | "Custom goal label" |
| `editor.powerUpPanel.goalSection.valueControl` | "Goal value" |
| `editor.powerUpPanel.goalSection.byDate` | "By date" |
| `editor.powerUpPanel.goalSection.xAxisValue` | "X-axis value" |
| `editor.powerUpPanel.goalSection.optional` | " (optional)" |
| `editor.powerUpPanel.goalSection.xAxisReferenceAriaLabel` | "X-axis reference value" |
| `editor.powerUpPanel.goalSection.anyXAxisValue` | "Any x-axis value" |
| `editor.powerUpPanel.goalSection.selectValuePlaceholder` | "Select value" |
| `editor.powerUpPanel.trendSection.title` | "Trend" |
| `editor.powerUpPanel.trendSection.toggle` | "Trend" |
| `editor.powerUpPanel.averageSection.title` | "Average" |
| `editor.powerUpPanel.averageSection.toggle` | "Average" |
| `editor.powerUpPanel.averageSection.seriesLabel` | "Average line series" |
| `editor.powerUpPanel.averageSection.seriesPlaceholder` | "Select series" |
| `editor.powerUpPanel.averageSection.seriesAriaLabel` | "Series dropdown for average line" |
| `editor.powerUpPanel.trendType.label` | "Trend type" |
| `editor.powerUpPanel.trendType.placeholder` | "Trend type" |
| `editor.powerUpPanel.trendType.options.linear` | "Linear" |
| `editor.powerUpPanel.trendType.options.exponential` | "Exponential" |
| `editor.powerUpPanel.trendType.options.quadratic` | "Quadratic" |
| `editor.powerUpPanel.trendType.options.polynomial` | "Polynomial" |
| `editor.powerUpPanel.trendType.options.logarithmic` | "Logarithmic" |
| `editor.powerUpPanel.trendType.options.power` | "Power" |
| `editor.powerUpPanel.trendType.options.loess` | "Loess" |
| `editor.powerUpPanel.valueInput.percentagePlaceholder` | "Percentage" |
| `editor.powerUpPanel.valueInput.numberPlaceholder` | "Number" |
| `editor.powerUpPanel.valueInput.percentageSymbol` | "%" |

### Editor - Highlighting

| Key | Default |
| - | - |
| `editor.highlighting.modeHelper.title` | "Highlight mode" |
| `editor.highlighting.modeHelper.hover` | "Hover" |
| `editor.highlighting.modeHelper.toHighlight` | "to highlight" |
| `editor.highlighting.modeHelper.anyElement` | "any element" |
| `editor.highlighting.modeHelper.escToExit` | "to exit" |
| `editor.highlighting.modeHelper.esc` | "ESC" |
| `editor.highlighting.emptyState` | "No highlight options available" |
| `editor.highlighting.deleteAriaLabel` | "Delete highlight" |
| `editor.highlighting.highlightStyle.tint` | "Tint" |
| `editor.highlighting.highlightStyle.gray` | "Grey" |

### Editor - Fine tune panel

| Key | Default |
| - | - |
| `editor.fineTunePanel.toolbarButton` | "Fine tune" |
| `editor.fineTunePanel.detailSection.title` | "Detail" |
| `editor.fineTunePanel.detailSection.missingValues` | "Missing values" |
| `editor.fineTunePanel.lineStyleSection.title` | "Line style" |
| `editor.fineTunePanel.lineStyleSection.lineCurve` | "Line curve" |
| `editor.fineTunePanel.lineStyleSection.sharp` | "Sharp" |
| `editor.fineTunePanel.lineStyleSection.smooth` | "Smooth" |

### Editor - Custom theme editor

| Key | Default |
| - | - |
| `editor.customThemeEditor.patternDropdownAriaLabel` | "Pattern dropdown for series" |
| `editor.customThemeEditor.patterns.solid` | "Solid" |
| `editor.customThemeEditor.patterns.pattern` | "Pattern" |
| `editor.customThemeEditor.patterns.dotted` | "Dotted" |
| `editor.customThemeEditor.patterns.dashed` | "Dashed" |
| `editor.customThemeEditor.patterns.hatched` | "Hatched" |
| `editor.customThemeEditor.heatmapColorLabel` | "Color" |

### Editor - Accessibility

| Key | Default | Parameters |
| - | - | - |
| `editor.accessibility.toggleSection` | "Toggle \${title} section" | `{ title }` |

### Editor - Graphy defaults

| Key | Default |
| - | - |
| `editor.graphyDefaults.themeOptions.light` | "Light" |
| `editor.graphyDefaults.themeOptions.dark` | "Dark" |


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.