chore(deps): update all non-major dependencies by renovate[bot] · Pull Request #1039 · uid0/openmakersuite

renovate · 2026-09-01T11:10:01Z

ℹ️ Note

This PR body was truncated due to platform limits.

This PR contains the following updates:

Package	Change	Type	Update	Pending
@commitlint/cli (source)	`21.2.0` → `21.2.3`	devDependencies	patch
@commitlint/config-conventional (source)	`21.2.0` → `21.2.3`	devDependencies	patch
@hookform/resolvers (source)	`5.4.0` → `5.9.1`	dependencies	minor
@mantine/core (source)	`9.4.1` → `9.6.1`	dependencies	minor	`9.6.2`
@mantine/dates (source)	`9.4.1` → `9.6.1`	dependencies	minor	`9.6.2`
@mantine/dropzone (source)	`9.4.1` → `9.6.1`	dependencies	minor	`9.6.2`
@mantine/form (source)	`9.4.1` → `9.6.1`	dependencies	minor	`9.6.2`
@mantine/hooks (source)	`9.4.1` → `9.6.1`	dependencies	minor	`9.6.2`
@mantine/modals (source)	`9.4.1` → `9.6.1`	dependencies	minor	`9.6.2`
@mantine/notifications (source)	`9.4.1` → `9.6.1`	dependencies	minor	`9.6.2`
@playwright/test (source)	`1.61.1` → `1.63.0`	devDependencies	minor
@sentry/react (source)	`10.63.0` → `10.75.0`	dependencies	minor	`10.75.1`
@tabler/icons-react (source)	`3.44.0` → `3.47.0`	dependencies	minor
@testing-library/dom	`10.4.1` → `10.4.2`	devDependencies	patch
@testing-library/jest-dom	`7.0.0` → `7.0.1`	devDependencies	patch
@testing-library/react	`16.3.2` → `16.3.3`	devDependencies	patch
@testing-library/user-event	`14.6.1` → `14.6.7`	devDependencies	patch
@types/node (source)	`24.13.2` → `24.13.6`	devDependencies	patch
@types/react (source)	`19.2.17` → `19.3.0`	devDependencies	minor
@types/react-dom (source)	`19.2.3` → `19.3.0`	devDependencies	minor
@typescript-eslint/eslint-plugin (source)	`8.62.1` → `8.70.0`	devDependencies	minor	`8.70.1`
@typescript-eslint/parser (source)	`8.62.1` → `8.70.0`	devDependencies	minor	`8.70.1`
@vitejs/plugin-react (source)	`6.0.3` → `6.1.1`	devDependencies	minor
Django (changelog)	`==6.0.7` → `==6.1.1`		minor
PyJWT	`==2.13.0` → `==2.14.0`		minor
axios (source)	`1.18.1` → `1.20.0`	dependencies	minor
coverage	`==7.16.0` → `==7.16.1`		patch
dayjs (source)	`1.11.21` → `1.11.23`	dependencies	patch
django-anymail (changelog)	`==15.1` → `==15.2`		minor
django-imagekit	`==6.1.0` → `==6.1.1`		patch
django-stubs (changelog)	`==6.1.0` → `==6.1.1`		patch
djangorestframework (changelog)	`==3.18.0` → `==3.18.1`		patch
emqx/emqx-enterprise (source)	`6.2.3` → `6.3.1`		minor
eslint (source)	`10.6.0` → `10.11.0`	devDependencies	minor
faker (changelog)	`==40.37.0` → `==40.39.0`		minor
globals	`17.7.0` → `17.12.0`	devDependencies	minor
helm	`v4.2.4` → `v4.3.0`	uses-with	minor
jsdom	`30.0.0` → `30.1.0`	devDependencies	minor
matplotlib	`==3.11.1` → `==3.11.2`		patch
playwright (source)	`1.61.1` → `1.63.0`	devDependencies	minor
postcss (source)	`8.5.23` → `8.5.28`	overrides	patch
psycopg2-binary (source, changelog)	`==2.9.12` → `==2.9.13`		patch
pypdf (changelog)	`==6.16.2` → `==6.19.0`		minor
react (source)	`19.2.7` → `19.3.0`	dependencies	minor
react-dom (source)	`19.2.7` → `19.3.0`	dependencies	minor
react-grid-layout (source)	`2.2.3` → `2.2.4`	dependencies	patch
react-hook-form (source)	`7.80.0` → `7.88.0`	dependencies	minor
react-is (source)	`19.2.7` → `19.3.0`	dependencies	minor
react-router-dom (source)	`7.18.1` → `7.18.4`	dependencies	patch
recharts	`3.9.2` → `3.10.1`	dependencies	minor
sentry-sdk (changelog)	`==2.68.1` → `==2.69.2`		minor
serialize-javascript	`7.0.5` → `7.1.1`	overrides	minor
vite (source)	`8.1.3` → `8.3.0`	overrides	minor
vite (source)	`8.1.3` → `8.3.0`	devDependencies	minor
web-vitals	`6.0.0` → `6.2.2`	dependencies	minor
zod (source)	`4.4.3` → `4.6.5`	dependencies	minor

Release Notes

conventional-changelog/commitlint (@commitlint/cli)

`v21.2.3`

Compare Source

Bug Fixes

lint: trim trailing whitespace off the message handed to ignore matchers (#4960) (a6f279b)

`v21.2.2`

Compare Source

Note: Version bump only for package @commitlint/cli

`v21.2.1`

Compare Source

Note: Version bump only for package @commitlint/cli

conventional-changelog/commitlint (@commitlint/config-conventional)

`v21.2.3`

Compare Source

Bug Fixes

rules: report the case that matched in case rule failure messages (#4962) (9f5f7bc)

`v21.2.2`

Compare Source

Note: Version bump only for package @commitlint/config-conventional

react-hook-form/resolvers (@hookform/resolvers)

`v5.9.1`

Compare Source

`v5.9.0`

Compare Source

Features

update joi to v18 (#873) (c8159ae)

Features

support vine v4 (#867) (4cfba18)

`v5.6.0`

Compare Source

`v5.5.8`

Compare Source

Bug Fixes

Zod resolver drops validation errors for special root field names (#869) (2f28787)

`v5.5.7`

Compare Source

`v5.5.6`

Compare Source

`v5.5.5`

Compare Source

Bug Fixes

yup resolver overrides ref property in errors object with validation metadata when using checkbox input (#863) (0f70063)

`v5.5.4`

Compare Source

Bug Fixes

AJV Resolver - When ajv schema contains default for certain properties, getValues() returns the form data with properties overwritten (#862) (c4b6aab)

`v5.5.3`

Compare Source

Bug Fixes

Conditional/dynamic schema resolution no longer working (#861) (f8d6533)

`v5.5.2`

Compare Source

`v5.5.1`

Compare Source

Bug Fixes

[zod v4][zod resolver] error on nested discriminated unions (#858) (4d01d01)

`v5.5.0`

Compare Source

Features

typescript 6 & upgrade lib dev deps (#856) (9968959)

`v5.4.3`

Compare Source

Bug Fixes

Zod resolver does not respect union error (#855) (4e56b2b)

`v5.4.2`

Compare Source

Bug Fixes

preserve standard schema root errors (#853) (08f25e9)

`v5.4.1`

Compare Source

Bug Fixes

declare validation libraries as optional peerDependencies (#850) (d5e5134)

mantinedev/mantine (@mantine/core)

`v9.6.1`

Compare Source

[@mantine/ligtbox] Add option to render custom thumbnails for video
[@mantine/core] OverflowList: Fix ResizeObserver console warning (#9177)
[@mantine/core] Fix incorrect escape handling in Modal and Drawer stacks (#9188)
[@mantine/core] SegmentedControl: Fix indicator disappearing when data list is replaced with a list with the same length (#9175)
[@mantine/lightbox] Fix circular esm dependency (#9166)
[@mantine/core] Accordion: Fix incorrect border radius being applied to the contained items
[@mantine/schedule] Add event overlap mode support to WeekView and DayView
[@mantine/core] Menu: Fix incorrect withinPortal prop being available
[@mantine/core] Popover: Fix position not being updated when prop changes when the dropdown is opened (#9156)
[@mantine/schedule] Fix same-day events ending at exclusive midnight being dropped in WeekView and DayView components (#9157)
[@mantine/hooks] use-interval: Fix timer restarting when fn changes (#9158)
[@mantine/core] Textarea: Fix ResizeObserver loop error when autosize textarea width changes (#9162)
[@mantine/hooks] use-collapse: Fix incorrect transition state switching when used with Activity (#9160)

`v9.6.0`

Compare Source

View changelog with demos on mantine.dev website

Support Mantine development

You can now sponsor Mantine development with OpenCollective.
All funds are used to improve Mantine and create new features and components.

@mantine/lightbox package

New @mantine/lightbox package – a full-screen media lightbox with carousel navigation,
zoom, thumbnails, toolbar customization, and store-based API. Supports image, video, and custom slides:

import '@mantine/lightbox/styles.css';
import { useState } from 'react';
import { Image, SimpleGrid } from '@mantine/core';
import { Lightbox, LightboxSlideData } from '@mantine/lightbox';

const images = [
  'https://raw.githubusercontent.com/mantinedev/mantine/master/.demo/images/bg-1.png',
  'https://raw.githubusercontent.com/mantinedev/mantine/master/.demo/images/bg-2.png',
  'https://raw.githubusercontent.com/mantinedev/mantine/master/.demo/images/bg-3.png',
  'https://raw.githubusercontent.com/mantinedev/mantine/master/.demo/images/bg-4.png',
  'https://raw.githubusercontent.com/mantinedev/mantine/master/.demo/images/bg-5.png',
];

const slides: LightboxSlideData[] = images.map((src) => ({ src }));

function Demo() {
  const [opened, setOpened] = useState(false);
  const [index, setIndex] = useState(0);

  return (
    <>
      <Lightbox
        opened={opened}
        onClose={() => setOpened(false)}
        slides={slides}
        currentIndex={index}
        onIndexChange={setIndex}
      />

      <SimpleGrid cols={3}>
        {images.map((src, i) => (
          <Image
            key={src}
            src={src}
            radius="md"
            style={{ cursor: 'pointer' }}
            onClick={() => {
              setIndex(i);
              setOpened(true);
            }}
          />
        ))}
      </SimpleGrid>
    </>
  );
}

Key features:

Zoom – click to zoom on desktop, double-tap on mobile, scroll wheel and pinch gestures
Thumbnails – bottom thumbnail strip with active indicator
Store API – mount once, open from anywhere (same pattern as Spotlight and Notifications)
Video slides – native video player with auto-pause on navigation
Custom slides – render anything with custom thumbnails
Transitions – animated open and close with configurable transitionProps (same API as Modal)
Keyboard shortcuts – Escape, arrows, F/T/Z for fullscreen/thumbnails/zoom
Localization – every string is defined in the labels prop

Notifications custom rendering

Notifications now support renderNotification prop that allows you to completely
replace the default notification with custom content. All animations (enter, exit, drag dismiss)
are preserved for custom notifications:

import { Avatar, Button, Group, rem, Text } from '@mantine/core';
import { notifications } from '@mantine/notifications';

function Demo() {
  return (
    <Group justify="center">
      <Button
        onClick={() =>
          notifications.show({
            autoClose: false,
            renderNotification: (notification) => (
              <div
                style={{
                  display: 'flex',
                  alignItems: 'center',
                  gap: rem(12),
                  padding: rem(16),
                  borderRadius: rem(8),
                  backgroundColor: 'var(--mantine-color-body)',
                  border: '1px solid var(--mantine-color-default-border)',
                  boxShadow: 'var(--mantine-shadow-lg)',
                  userSelect: 'none',
                }}
              >
                <Avatar src={null} radius="xl" color="blue">
                  DM
                </Avatar>
                <div style={{ flex: 1, minWidth: 0 }}>
                  <Text size="sm" fw={600}>
                    Dan sent you a message
                  </Text>
                  <Text size="xs" c="dimmed" lineClamp={1}>
                    Hey, are you free for a quick call?
                  </Text>
                  <Group gap="xs" mt={8}>
                    <Button
                      size="compact-xs"
                      variant="filled"
                      onClick={() =>
                        notifications.hide(notification.id!)
                      }
                    >
                      Reply
                    </Button>
                    <Button
                      size="compact-xs"
                      variant="default"
                      onClick={() =>
                        notifications.hide(notification.id!)
                      }
                    >
                      Dismiss
                    </Button>
                  </Group>
                </div>
              </div>
            ),
            message: '',
          })
        }
      >
        Show custom notification
      </Button>
    </Group>
  );
}

Notifications stacked layout

Notifications now support layout="stacked" prop that displays notifications in a stacked
layout where only the latest notification is fully visible, and older notifications peek out behind it:

import { Button, Group } from '@mantine/core';
import { Notifications, notifications } from '@mantine/notifications';

function Demo() {
  return (
    <>
      {/* Replace your existing Notifications with layout="stacked" */}
      <Notifications layout="stacked" />
      <Group justify="center">
        <Button
          onClick={() => {
            notifications.show({
              title: 'New notification',
              message: 'This notification is part of a stacked layout',
            });
          }}
        >
          Show stacked notification
        </Button>
      </Group>
    </>
  );
}

ActionBar component

New ActionBar component – a fixed-position bottom bar
for bulk selection actions. Designed to be controlled by table or checkbox
selections, it provides a set of actions that can be performed on selected items.

import { useState } from 'react';
import { ActionBar, Button, Checkbox, Table, Text } from '@mantine/core';

const elements = [
  { position: 6, mass: 12.011, symbol: 'C', name: 'Carbon' },
  { position: 7, mass: 14.007, symbol: 'N', name: 'Nitrogen' },
  { position: 39, mass: 88.906, symbol: 'Y', name: 'Yttrium' },
  { position: 56, mass: 137.33, symbol: 'Ba', name: 'Barium' },
  { position: 58, mass: 140.12, symbol: 'Ce', name: 'Cerium' },
];

function Demo() {
  const [selection, setSelection] = useState<number[]>([]);

  const toggleRow = (position: number) =>
    setSelection((current) =>
      current.includes(position)
        ? current.filter((item) => item !== position)
        : [...current, position]
    );

  const toggleAll = () =>
    setSelection((current) =>
      current.length === elements.length ? [] : elements.map((element) => element.position)
    );

  const rows = elements.map((element) => (
    <Table.Tr
      key={element.position}
      bg={selection.includes(element.position) ? 'var(--mantine-color-blue-light)' : undefined}
    >
      <Table.Td>
        <Checkbox
          aria-label="Select row"
          checked={selection.includes(element.position)}
          onChange={() => toggleRow(element.position)}
        />
      </Table.Td>
      <Table.Td>{element.position}</Table.Td>
      <Table.Td>{element.name}</Table.Td>
      <Table.Td>{element.symbol}</Table.Td>
      <Table.Td>{element.mass}</Table.Td>
    </Table.Tr>
  ));

  return (
    <>
      <Table>
        <Table.Thead>
          <Table.Tr>
            <Table.Th>
              <Checkbox
                aria-label="Select all"
                checked={selection.length === elements.length}
                indeterminate={selection.length > 0 && selection.length !== elements.length}
                onChange={toggleAll}
              />
            </Table.Th>
            <Table.Th>Element position</Table.Th>
            <Table.Th>Element name</Table.Th>
            <Table.Th>Symbol</Table.Th>
            <Table.Th>Atomic mass</Table.Th>
          </Table.Tr>
        </Table.Thead>
        <Table.Tbody>{rows}</Table.Tbody>
      </Table>

      <ActionBar opened={selection.length > 0} onClose={() => setSelection([])} shadow="md">
        <Text size="sm">{selection.length} selected</Text>
        <ActionBar.Divider />
        <Button variant="default" size="compact-sm">
          Delete
        </Button>
        <Button variant="default" size="compact-sm">
          Move
        </Button>
        <Button variant="default" size="compact-sm">
          Archive
        </Button>
        <ActionBar.CloseButton />
      </ActionBar>
    </>
  );
}

RichTextEditor table controls

RichTextEditor now includes a set of controls for editing tables. Install and register the
Tiptap table extension (TableKit), then add
the controls to the toolbar. RichTextEditor.TableInsert opens a grid to pick the table size, and the
other controls add/remove rows and columns, toggle header row/column and merge/split cells. All table
controls are automatically disabled when the cursor is not inside a table:

import { TableKit } from '@tiptap/extension-table';
import { useEditor } from '@tiptap/react';
import StarterKit from '@tiptap/starter-kit';
import { RichTextEditor } from '@mantine/tiptap';

function Demo() {
  const editor = useEditor({
    extensions: [StarterKit, TableKit],
    content: `
      <table>
        <tbody>
          <tr><th><p>Framework</p></th><th><p>Language</p></th></tr>
          <tr><td><p>Mantine</p></td><td><p>TypeScript</p></td></tr>
          <tr><td><p>Tiptap</p></td><td><p>TypeScript</p></td></tr>
        </tbody>
      </table>
      <p></p>
`,
  });

  return (
    <RichTextEditor editor={editor}>
      <RichTextEditor.Toolbar sticky>
        <RichTextEditor.ControlsGroup>
          <RichTextEditor.TableInsert />
          <RichTextEditor.TableDelete />
        </RichTextEditor.ControlsGroup>

        <RichTextEditor.ControlsGroup>
          <RichTextEditor.TableColumnBefore />
          <RichTextEditor.TableColumnAfter />
          <RichTextEditor.TableColumnDelete />
        </RichTextEditor.ControlsGroup>

        <RichTextEditor.ControlsGroup>
          <RichTextEditor.TableRowBefore />
          <RichTextEditor.TableRowAfter />
          <RichTextEditor.TableRowDelete />
        </RichTextEditor.ControlsGroup>

        <RichTextEditor.ControlsGroup>
          <RichTextEditor.TableToggleHeaderRow />
          <RichTextEditor.TableToggleHeaderColumn />
          <RichTextEditor.TableMergeCells />
          <RichTextEditor.TableSplitCell />
        </RichTextEditor.ControlsGroup>
      </RichTextEditor.Toolbar>

      <RichTextEditor.Content />
    </RichTextEditor>
  );
}

RichTextEditor Details control

RichTextEditor now supports collapsible sections. Install and register the
Tiptap details extension (Details,
DetailsSummary and DetailsContent), then add RichTextEditor.Details to the toolbar. The control
wraps the current block in a collapsible details node, or removes it when the cursor is already inside
one:

import { Details, DetailsSummary, DetailsContent } from '@tiptap/extension-details';
import { useEditor } from '@tiptap/react';
import StarterKit from '@tiptap/starter-kit';
import { RichTextEditor } from '@mantine/tiptap';

function Demo() {
  const editor = useEditor({
    extensions: [StarterKit, Details, DetailsSummary, DetailsContent],
    content: `
      <details>
        <summary>Shipping and delivery</summary>
        <p>Orders are processed within 1–2 business days and delivered in 3–5 business days.</p>
      </details>
      <details>
        <summary>Returns and refunds</summary>
        <p>You can return any item within 30 days of delivery for a full refund.</p>
      </details>
      <p></p>
`,
  });

  return (
    <RichTextEditor editor={editor}>
      <RichTextEditor.Toolbar sticky>
        <RichTextEditor.ControlsGroup>
          <RichTextEditor.Bold />
          <RichTextEditor.Italic />
          <RichTextEditor.Underline />
        </RichTextEditor.ControlsGroup>

        <RichTextEditor.ControlsGroup>
          <RichTextEditor.Details />
        </RichTextEditor.ControlsGroup>
      </RichTextEditor.Toolbar>

      <RichTextEditor.Content />
    </RichTextEditor>
  );
}

To support the control, Typography now styles details and summary elements –
a border, padding and a custom disclosure triangle. This applies to all details elements inside
Typography, not just those created by the editor. All of the new selectors have zero specificity
(:where()), so they can be overridden without !important.

RichTextEditor InvisibleCharacters control

RichTextEditor can now display formatting marks. Install and register the
Tiptap invisible characters extension,
then add RichTextEditor.InvisibleCharacters to the toolbar. The control toggles the visibility of
spaces, paragraph breaks and hard breaks, and reflects the current visibility as its active state:

import InvisibleCharacters from '@tiptap/extension-invisible-characters';
import { useEditor } from '@tiptap/react';
import StarterKit from '@tiptap/starter-kit';
import { RichTextEditor } from '@mantine/tiptap';

function Demo() {
  const editor = useEditor({
    extensions: [StarterKit, InvisibleCharacters.configure({ visible: false })],
    content: `
      <p>Toggle the control to reveal spaces and paragraph breaks.</p>
      <p>Each space becomes a dot and every paragraph ends with a pilcrow.</p>
`,
  });

  return (
    <RichTextEditor editor={editor}>
      <RichTextEditor.Toolbar sticky>
        <RichTextEditor.ControlsGroup>
          <RichTextEditor.Bold />
          <RichTextEditor.Italic />
          <RichTextEditor.Underline />
        </RichTextEditor.ControlsGroup>

        <RichTextEditor.ControlsGroup>
          <RichTextEditor.InvisibleCharacters />
        </RichTextEditor.ControlsGroup>
      </RichTextEditor.Toolbar>

      <RichTextEditor.Content />
    </RichTextEditor>
  );
}

GaugeChart component

New GaugeChart component – a radial gauge chart for KPI and status display.
Supports threshold sections, target marker, custom labels, and configurable arc angles.

import { GaugeChart } from '@mantine/charts';

function Demo() {
  return <GaugeChart value={72} size={200} thickness={12} />;
}

WaffleChart component

New WaffleChart component – a part-to-whole grid chart with colored cells.
Simpler and more compact alternative to pie/donut charts for displaying percentages and proportions.

// Demo.tsx
import { WaffleChart } from '@mantine/charts';
import { data } from './data';

function Demo() {
  return <WaffleChart data={data} />;
}

// data.ts
import { WaffleChartCell } from '@mantine/charts';

export const data: WaffleChartCell[] = [
  { name: 'Chrome', value: 65, color: 'blue' },
  { name: 'Safari', value: 19, color: 'teal' },
  { name: 'Firefox', value: 10, color: 'orange' },
  { name: 'Other', value: 6, color: 'gray' },
];

MatrixChart component

New MatrixChart component – a generic x/y heatmap with categorical axes.
Each cell is colored based on a value, useful for visualizing patterns in two-dimensional categorical data.

// Demo.tsx
import { MatrixChart } from '@mantine/charts';
import { data } from './data';

function Demo() {
  return (
    <MatrixChart
      data={data}
      yLabels={['James', 'Mary', 'Robert', 'Linda', 'Michael', 'Sarah', 'David', 'Emma']}
      withYLabels
      withTooltip
      getTooltipLabel={({ x, y, value }) =>
        `${y}, Mar ${x}: ${value === null ? 'No contributions' : `${value} contribution${value > 1 ? 's' : ''}`}`
      }
    />
  );
}

// data.ts
import { MatrixChartCell } from '@mantine/charts';

export const data: MatrixChartCell[] = [
  { x: '1', y: 'James', value: 7 },
  { x: '2', y: 'James', value: 10 },
  { x: '3', y: 'James', value: 2 },
  { x: '4', y: 'James', value: 10 },
  { x: '5', y: 'James', value: 8 },
  { x: '6', y: 'James', value: null },
  { x: '7', y: 'James', value: null },
  { x: '8', y: 'James', value: 6 },
  { x: '9', y: 'James', value: 2 },
  { x: '10', y: 'James', value: 8 },
  { x: '11', y: 'James', value: 1 },
  { x: '12', y: 'James', value: 3 },
  { x: '13', y: 'James', value: 7 },
  { x: '14', y: 'James', value: null },
  { x: '15', y: 'James', value: 9 },
  { x: '16', y: 'James', value: 10 },
  { x: '17', y: 'James', value: null },
  { x: '18', y: 'James', value: 1 },
  { x: '19', y: 'James', value: 8 },
  { x: '20', y: 'James', value: null },
  { x: '21', y: 'James', value: null },
  { x: '22', y: 'James', value: 5 },
  { x: '23', y: 'James', value: 8 },
  { x: '24', y: 'James', value: 2 },
  { x: '25', y: 'James', value: 5 },
  { x: '26', y: 'James', value: 6 },
  { x: '27', y: 'James', value: null },
  { x: '28', y: 'James', value: null },
  { x: '29', y: 'James', value: 7 },
  { x: '30', y: 'James', value: 7 },
  { x: '31', y: 'James', value: 6 },
  { x: '1', y: 'Mary', value: 3 },
  { x: '2', y: 'Mary', value: 1 },
  // ... remaining data
];

CandlestickChart component

New CandlestickChart component – a financial OHLC chart that displays
open, high, low and close values as candles. Candles are colored based on their direction, the wick
shows the high–low range and the body shows the open–close range. Supports custom colors, data keys,
reference lines, axis labels, tooltip labels and value formatting.

// Demo.tsx
import { CandlestickChart } from '@mantine/charts';
import { data } from './data';

function Demo() {
  return <CandlestickChart h={300} data={data} dataKey="date"  tickLine="y" gridAxis="x" withXAxis={true} withYAxis={true} withTooltip={true} />;
}

// data.ts
export const data = [
  { date: 'Mar 01', open: 136, high: 142, low: 133, close: 140 },
  { date: 'Mar 02', open: 140, high: 145, low: 138, close: 139 },
  { date: 'Mar 03', open: 139, high: 141, low: 129, close: 131 },
  { date: 'Mar 04', open: 131, high: 134, low: 124, close: 125 },
  { date: 'Mar 05', open: 125, high: 133, low: 124, close: 132 },
  { date: 'Mar 06', open: 132, high: 138, low: 131, close: 137 },
  { date: 'Mar 07', open: 137, high: 137, low: 128, close: 129 },
  { date: 'Mar 08', open: 129, high: 135, low: 127, close: 134 },
  { date: 'Mar 09', open: 134, high: 148, low: 133, close: 146 },
  { date: 'Mar 10', open: 146, high: 152, low: 144, close: 151 },
  { date: 'Mar 11', open: 151, high: 154, low: 143, close: 145 },
  { date: 'Mar 12', open: 145, high: 149, low: 142, close: 148 },
  { date: 'Mar 13', open: 148, high: 156, low: 147, close: 155 },
  { date: 'Mar 14', open: 155, high: 158, low: 150, close: 152 },
  { date: 'Mar 15', open: 152, high: 153, low: 141, close: 143 },
  { date: 'Mar 16', open: 143, high: 147, low: 139, close: 146 },
  { date: 'Mar 17', open: 146, high: 160, low: 145, close: 159 },
  { date: 'Mar 18', open: 159, high: 164, low: 156, close: 157 },
  { date: 'Mar 19', open: 157, high: 162, low: 153, close: 161 },
  { date: 'Mar 20', open: 161, high: 168, low: 160, close: 166 },
];

Charts reference areas

AreaChart, BarChart, LineChart,
CompositeChart and ScatterChart now support the
referenceAreas prop that highlights a rectangular region of the plot – a weekend band, a target
range, a threshold zone and similar annotations. Each area is bounded by x1/x2 and/or y1/y2
data values (omit one pair to span the full opposite axis) and supports a theme color and a label.

// Demo.tsx
import { AreaChart } from '@m

> ❗ **Important**
> 
> ✂ PR body was truncated to here.


</details>

---

### Configuration

📅 **Schedule**: (in timezone America/Chicago)

- Branch creation
  - "after 4am and before 7am"
- Automerge
  - At any time (no schedule defined)

🚦 **Automerge**: Enabled.

♻ **Rebasing**: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox.

👻 **Immortal**: This PR will be recreated if closed unmerged. Get [config help](https://redirect.github.com/renovatebot/renovate/discussions) if that's undesired.

---

 - [ ] <!-- rebase-check -->If you want to rebase/retry this PR, check this box

---

This PR was generated by [Mend Renovate](https://mend.io/renovate/). View the [repository job log](https://developer.mend.io/github/uid0/openmakersuite).
<!--renovate-debug:eyJjcmVhdGVkSW5WZXIiOiI0NC40OS4wIiwidXBkYXRlZEluVmVyIjoiNDQuMTAzLjAiLCJ0YXJnZXRCcmFuY2giOiJtYWluIiwibGFiZWxzIjpbXX0=-->

renovate · 2026-09-01T11:10:05Z

⚠️ Artifact update problem

Renovate failed to update an artifact related to this branch. You probably do not want to merge this PR as-is.

♻ Renovate will retry this branch, including artifacts, only when one of the following happens:

any of the package files in this branch needs updating, or
the branch becomes conflicted, or
you click the rebase/retry checkbox if found above, or
you rename this PR's title to start with "rebase!" to trigger it manually

The artifact failure details are included below:

File name: frontend/package-lock.json

npm warn Unknown env config "store". This will error in a future major version of npm. See `npm help npmrc` for supported config options.
npm error code EOVERRIDE
npm error Override for postcss@8.5.28 conflicts with direct dependency
npm error A complete log of this run can be found in: /runner/cache/others/npm/_logs/2026-09-22T01_17_10_682Z-debug-0.log

renovate Bot enabled auto-merge (squash) September 1, 2026 11:10

renovate Bot force-pushed the renovate/renovate-rollup branch 17 times, most recently from f157a52 to 7219c84 Compare September 8, 2026 04:08

renovate Bot force-pushed the renovate/renovate-rollup branch 11 times, most recently from 4d8c528 to 0e4a80e Compare September 12, 2026 02:46

renovate Bot force-pushed the renovate/renovate-rollup branch 29 times, most recently from 9ae479a to 289e27f Compare September 14, 2026 07:51

chore(deps): update all non-major dependencies

f50c463

Navigation Menu

chore(deps): update all non-major dependencies - #1039

chore(deps): update all non-major dependencies#1039
renovate[bot] wants to merge 1 commit into
mainfrom
renovate/renovate-rollup

renovate Bot commented Sep 1, 2026 •

edited

Loading

Uh oh!

renovate Bot commented Sep 1, 2026 •

edited

Loading

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

0 participants

Conversation

renovate Bot commented Sep 1, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Release Notes

Bug Fixes

Bug Fixes

Features

Features

Bug Fixes

Bug Fixes

Bug Fixes

Bug Fixes

Bug Fixes

Features

Bug Fixes

Bug Fixes

Bug Fixes

Support Mantine development

@​mantine/lightbox package

Notifications custom rendering

Notifications stacked layout

ActionBar component

RichTextEditor table controls

RichTextEditor Details control

RichTextEditor InvisibleCharacters control

GaugeChart component

WaffleChart component

MatrixChart component

CandlestickChart component

Charts reference areas

Uh oh!

renovate Bot commented Sep 1, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

⚠️ Artifact update problem

File name: frontend/package-lock.json

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

0 participants

renovate Bot commented Sep 1, 2026 •

edited

Loading

@mantine/lightbox package

renovate Bot commented Sep 1, 2026 •

edited

Loading