@ex-grid/mantine 0.0.0-stage → 0.2.0-rc.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 AkiraMisawa
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,3 +1,43 @@
-# Temporary Holding Version
+# @ex-grid/mantine
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+ExGrid for Mantine: the design-system Wrapper that draws ExGrid for React's Chrome with Mantine's components and maps its Visual Tokens onto a Mantine theme.
+
+It is one of the packages of the ExGrid family: Excel-like grids, sheets, pivot tables and charts for reading
+money and risk numbers, published to npm under `@ex-grid` and to NuGet for Blazor, at one shared version.
+
+## Install
+
+```sh
+npm install @ex-grid/mantine @mantine/core @mantine/hooks react react-dom
+```
+
+`@mantine/core`, `@mantine/hooks`, `react` and `react-dom` are peer dependencies: your application provides them, at the versions `package.json` names.
+
+It depends on exactly the version of `@ex-grid/core` and `@ex-grid/react` it was built with, so upgrade the family's packages together.
+
+What it draws reads these stylesheets. Import them once in your application, after the design system's own:
+
+```ts
+import '@ex-grid/core/styles.css';
+import '@ex-grid/mantine/styles.css';
+```
+
+## Documentation
+
+[ExGrid on the documentation site](https://akiramisawa.github.io/ex-grid/exgrid), read for React with the switch at the top, and every
+version's [Release Notes](https://akiramisawa.github.io/ex-grid/release-notes).
+
+> **The API may still change.** While the version is `0.x`, it may change from one version to the next; each
+> version's Release Notes say what changed. A prerelease, a version with a suffix such as `-rc.1`, passed every
+> test layer in CI on the commit it was built from. A version without a suffix is published only once the
+> project's [Definition of Done](https://github.com/AkiraMisawa/ex-grid/blob/main/docs/definition-of-done.md) is
+> signed off on it.
+
+## Requirements
+
+- **Chrome or Edge.** They are the supported browsers; Safari and Firefox are out of scope.
+- **React 19.2.0 or a later 19.x.**
+
+## License
+
+MIT

package/dist/index.d.ts

@@ -0,0 +1,91 @@
+import { Context } from 'react';
+import { CSSProperties } from 'react';
+import { ExGridChrome } from '@ex-grid/react';
+import { ExGridProps } from '@ex-grid/react';
+import { GridDensity } from '@ex-grid/core';
+import { GridPresentationDefaults } from '@ex-grid/core';
+import { GridPresentationDefaultsOptions } from '@ex-grid/core';
+import { MantineRadius } from '@mantine/core';
+import { MantineShadow } from '@mantine/core';
+import { MantineSize } from '@mantine/core';
+import { ReactElement } from 'react';
+
+/** Every Chrome slot drawn in Mantine's components: what {@link MantineExGrid} hands its grid. A Consumer that frames
+ * an ExGrid itself spreads it into the grid's `chrome`, inside an element of the class `mantine-ex-grid` and a
+ * {@link MantineSizeContext}, as MantineExGrid draws them. */
+export declare const mantineChrome: ExGridChrome<unknown>;
+
+/** Mantine's default font stack (`-apple-system`, `BlinkMacSystemFont`, `Segoe UI`, `Roboto`, `Helvetica`,
+ * `Arial`, `sans-serif`) with the widest widths any face it resolves to was measured at: macOS's system face, Segoe UI,
+ * Roboto, Liberation Sans for Helvetica and Arial on Linux, and DejaVu Sans. What the cells are drawn in unless a
+ * font is given. */
+export declare const mantineDefaultFont: MantineExGridFont;
+
+/**
+ * An Excel-like grid drawn with Mantine: the Chrome slots a `chrome` prop leaves are Mantine's, the cells are in
+ * the font whose widths the grid judges `####` by, and the colours follow the theme and its scheme with no render.
+ * Needs Mantine's MantineProvider above it and `@ex-grid/mantine/styles.css` loaded after Mantine's styles.
+ */
+export declare function MantineExGrid<Row>(props: MantineExGridProps<Row>): ReactElement;
+
+/** A font for the grid's cells, with the widths measured for it (ADR-0027): `family` is written as
+ * `--ex-font-family` and `widths` are what `####` is judged by, in the same render. */
+export declare interface MantineExGridFont {
+    /** The CSS font family list, as `font-family` takes it. */
+    readonly family: string;
+    /** The widths measured for that family (`tests/GlyphWidths` measures one). */
+    readonly widths: MantineExGridFontWidths;
+}
+
+/** The widths a font is charged at, in the forms the grid takes: everything a Wrapper's presentation defaults hold
+ * but the Density, hover band and Row Stripes, which are the Wrapper's words. */
+export declare type MantineExGridFontWidths = Omit<GridPresentationDefaultsOptions, 'density' | 'highlightHoverRow' | 'stripeRows'>;
+
+/** A MantineExGrid's props: an ExGrid's, and the Paper's and Table's words Mantine draws a grid with. No
+ * `presentationDefaults`: the Wrapper's are its own, made from `font`, `striped` and `highlightOnHover`, so the
+ * widths `####` is judged by are always the font's the Paper writes (ADR-0027). */
+export declare type MantineExGridProps<Row> = Omit<ExGridProps<Row>, 'presentationDefaults'> & {
+    /** The Paper's border, Mantine's `withBorder`. */
+    readonly withBorder?: boolean;
+    /** The Paper's corner radius, a theme radius or a CSS length; `0` sets the grid square in its Paper. */
+    readonly radius?: MantineRadius;
+    /** The Paper's shadow. */
+    readonly shadow?: MantineShadow;
+    /** Row Stripes where the grid is given no `stripeRows`, Mantine's Table's `striped` (ADR-0038). */
+    readonly striped?: boolean;
+    /** The hover band where the grid is given no `highlightHoverRow`, Mantine's Table's `highlightOnHover` (ADR-0029). */
+    readonly highlightOnHover?: boolean;
+    /** A rule between columns, Mantine's Table's `withColumnBorders`. */
+    readonly withColumnBorders?: boolean;
+    /** The cells' font with its widths (ADR-0027); Mantine's default stack unless given. */
+    readonly font?: MantineExGridFont;
+    /** A class for the Paper. */
+    readonly className?: string;
+    /** A style for the Paper. */
+    readonly style?: CSSProperties;
+};
+
+/** What the Wrapper hands a grid: `font`'s widths, and the Density, hover band and Row Stripes its words map onto. A
+ * value the grid is given beats these, and these beat the preset (ADR-0028). */
+export declare function mantinePresentationDefaults(font: MantineExGridFont, words?: MantinePresentationWords): GridPresentationDefaults;
+
+/** What Mantine's own words are on the Wrapper: its Table's `striped` and `highlightOnHover`. */
+export declare interface MantinePresentationWords {
+    /** The preset the grid takes where it is given none. */
+    readonly density?: GridDensity;
+    /** Row Stripes, Mantine's Table's `striped` (ADR-0038). */
+    readonly striped?: boolean;
+    /** The hover band, Mantine's Table's `highlightOnHover` (ADR-0029). */
+    readonly highlightOnHover?: boolean;
+}
+
+/** The size Mantine's components are drawn at inside a grid: the one its density maps onto, handed down from
+ * MantineExGrid through React's context, which a portal keeps. A frame of the Consumer's own that draws
+ * {@link mantineChrome} gives it, as it gives the class `mantine-ex-grid` the Wrapper's stylesheet is scoped to. */
+export declare const MantineSizeContext: Context<MantineSize>;
+
+/** The size Mantine's components are drawn at in a grid of `density` (ADR-0390): Mantine has no word like Dense, so
+ * the preset picks a size, `xs` for the compact ones and `sm`, Mantine's own default, for Standard. */
+export declare function mantineSizeOf(density: GridDensity): MantineSize;
+
+export { }