Skip to content

Version tweaks #285

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
akademy merged 1 commit into from
Sep 2, 2026
Merged

Version tweaks #285

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion changelog.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
# SciReactUI Changelog

## [v0.6.3] - 2026-09-01
## [v0.7.0] - 2026-09-02

### Added

Expand Down
2 changes: 1 addition & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@diamondlightsource/sci-react-ui",
"version": "0.6.2",
"version": "0.7.0",
"publishConfig": {
"access": "public"
},
Expand Down
17 changes: 6 additions & 11 deletions readme.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,20 +22,18 @@ Install as usual.

### Usage

First use the ThemeProvider and supply a theme.
First use the ThemeProvider and wrap your App.

```js
import { ThemeProvider, DiamondTheme } from "@diamondlightsource/sci-react-ui";
import { ThemeProvider } from "@diamondlightsource/sci-react-ui";

root.render(
<ThemeProvider theme={DiamondTheme}>
<ThemeProvider>
<App />
</ThemeProvider>,
);
```

There are currently two themes, `GenericTheme` or `DiamondTheme`, but you can also create/adapt your own.

Navigation components support either static links (with href) or the use of a routing library (with linkComponent and to).
For NavLink and FooterLink, if both linkComponent and to are provided, it will use linkComponent. If not, it falls back to using href.

Expand All @@ -49,7 +47,7 @@ An example with static links
</Navbar>
```

An example using react-router:
and an example using react-router:

```js
import { NavLink } from "react-router-dom";
Expand Down Expand Up @@ -84,13 +82,10 @@ Next, use the BrowserRouter which can be used at the top level:

```js
import { BrowserRouter } from "react-router-dom";
import {
ThemeProvider,
DiamondTheme
} from "@diamondlightsource/sci-react-ui";
import { ThemeProvider } from "@diamondlightsource/sci-react-ui";

root.render(
<ThemeProvider theme={DiamondTheme}>
<ThemeProvider>
<BrowserRouter>
<App />
</BrowserRouter>
Expand Down
9 changes: 3 additions & 6 deletions src/storybook/Installation.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -46,19 +46,16 @@ Use this page to install SciReactUI, configure the Diamond Design System theme,
Use the provided `DiamondDSTheme` with the ThemeProvider or create your own (see below). The theme controls colour via semantic surface tokens.

```tsx filename="main.tsx"
import {
ThemeProvider,
DiamondDSTheme
} from "@diamondlightsource/sci-react-ui";
import { ThemeProvider } from "@diamondlightsource/sci-react-ui";

root.render(
<ThemeProvider theme={DiamondDSTheme}>
<ThemeProvider>
<App />
</ThemeProvider>
)
```

The design sytem theme consists of two parts:
The design system theme consists of two parts:
- Theme configuration (DiamondDSTheme.ts)
- Semantic role tokens (diamond-ds-roles.css)

Expand Down
Loading