Skip to content

feat!: add package to city-of-helsinki organisation scope #234

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
nikomakela merged 1 commit into from
Dec 30, 2025
Merged

feat!: add package to city-of-helsinki organisation scope #234

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
22 changes: 11 additions & 11 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@ data using [Helsinki Design System](https://github.com/City-of-Helsinki/helsinki

React Helsinki Headless CMS is a highly customized component library based on [HDS](https://github.com/City-of-Helsinki/helsinki-design-system). It is designed for City of Helsinki web applications using preconfigured WordPress Headless CMS environments. This library provides a set of unified visual components for Pages, Articles, and Article Archives.

[![NPM Version](https://img.shields.io/npm/v/react-helsinki-headless-cms.svg)](https://www.npmjs.com/package/react-helsinki-headless-cms)
[![NPM Version](https://img.shields.io/npm/v/@city-of-helsinki/react-helsinki-headless-cms.svg)](https://www.npmjs.com/package/@city-of-helsinki/react-helsinki-headless-cms)
[![License](https://img.shields.io/badge/License-MIT-blue.svg)](https://opensource.org/licenses/MIT)

It provides:
Expand All @@ -75,7 +75,7 @@ It provides:
## Installation

```bash
yarn add react-helsinki-headless-cms
yarn add @city-of-helsinki/react-helsinki-headless-cms
```

## Development
Expand Down Expand Up @@ -188,15 +188,15 @@ The `yarn dev` command will start `storybook` in port `6006`. When you make chan

This can handle data queries for you if you are using a supported library to fetch your data.

By importing data dependent components from `react-helsinki-headless-cms/apollo`, this library will request the data for you.
By importing data dependent components from `@city-of-helsinki/react-helsinki-headless-cms/apollo`, this library will request the data for you.

**Note:** An Apollo client linked to a graphql endpoint with a supported schema (headless CMS) must be provided in the `apolloClient` field of the `config` object.

**Simplified example**

```tsx
import { Page } from 'react-helsinki-headless-cms/apollo';
import { Navigation } from 'react-helsinki-headless-cms/apollo';
import { Page } from '@city-of-helsinki/react-helsinki-headless-cms/apollo';
import { Navigation } from '@city-of-helsinki/react-helsinki-headless-cms/apollo';

<ConfigProvider
config={{
Expand All @@ -216,7 +216,7 @@ import { Navigation } from 'react-helsinki-headless-cms/apollo';

### NextJS

We provide utilities for fetching headless data for NextJs in `react-helsinki-headless-cms/nextjs`. These can be used when generating static pages.
We provide utilities for fetching headless data for NextJs in `@city-of-helsinki/react-helsinki-headless-cms/nextjs`. These can be used when generating static pages.

### Build

Expand All @@ -243,7 +243,7 @@ The steps to use the local relative path as a dependency:
```
{
"dependencies": {
"react-helsinki-headless-cms": "file:../react-helsinki-headless-cms/dist"
"@city-of-helsinki/react-helsinki-headless-cms": "file:../react-helsinki-headless-cms/dist"
}
}
```
Expand All @@ -262,7 +262,7 @@ The steps to use the local tarball as a dependency:
```
{
"dependencies": {
"react-helsinki-headless-cms": "file:../react-helsinki-headless-cms-v2.1.0.tgz"
"@city-of-helsinki/react-helsinki-headless-cms": "file:../react-helsinki-headless-cms-v2.1.0.tgz"
}
}
```
Expand All @@ -279,14 +279,14 @@ The `portal:` protocol is specifically designed for linking local directories (o

**How to Use portal: for a Tarball**

1. Extract the Tarball: The portal: protocol requires a folder. You must first extract your `.tgz` archive (e.g., `react-helsinki-headless-cms-v2.1.0.tgz`) into a temporary staging folder (e.g., `./.hcrc-dev`). The temporary staging folder should be in same directory as the consuming app's `package.json` file, since the `portal:` protocol is relative to the `package.json` file.
1. Extract the Tarball: The portal: protocol requires a folder. You must first extract your `.tgz` archive (e.g., `city-of-helsinki-react-helsinki-headless-cms-v2.1.0.tgz`) into a temporary staging folder (e.g., `./.hcrc-dev`). The temporary staging folder should be in same directory as the consuming app's `package.json` file, since the `portal:` protocol is relative to the `package.json` file.
2. Update `package.json`: In the consuming app's `package.json`, reference the extracted folder using the portal: protocol:

**⚠️ Security Tip:** Don't forget to add /.hcrc-dev to your .gitignore so you don't accidentally commit the extracted library code to your repository.

```JSON
"dependencies": {
"react-helsinki-headless-cms": "portal:../../.hcrc-dev/package"
"@city-of-helsinki/react-helsinki-headless-cms": "portal:../../.hcrc-dev/package"
}
```

Expand Down Expand Up @@ -318,7 +318,7 @@ import {
PageContent,
ConfigProvider,
defaultConfig,
} from "react-helsinki-headless-cms";
} from "@city-of-helsinki/react-helsinki-headless-cms";

function App() {
const page = ...;
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,5 +1,5 @@
{
"name": "react-helsinki-headless-cms",
"name": "@city-of-helsinki/react-helsinki-headless-cms",
"version": "2.1.0",
"description": "React components for displaying Headless CMS content according to guidelines set by HDS",
"main": "cjs/index.js",
Expand Down