ticketmelon-ui "2.3.0",

Made with create-react-library

Description

ticketmelon-ui is a Material-UI (MUI) library created to expedite the process of designing React applications. It includes a collection of pre-styled components that adhere to the Material Design guidelines.

Install

To install ticketmelon-ui library in your project, you can use npm (node package manager) by running the following command in your terminal:

npm i ticketmelon-ui

Components

-MelonInput 🔗

-MelonInputPhone 🔗

-MelonButton 🔗

Deployment

The library is published to npm by Bitbucket Pipelines (bitbucket-pipelines.yml). Don't publish from your machine: the pipeline builds from a clean checkout, so nothing local or uncommitted ends up in the package.

Release a version

1. Bump "version" in package.json through a PR, e.g. 2.13.65.

2. After it's merged, tag that commit with the same version and push the tag:

   git tag release.2.13.65
   git push origin release.2.13.65

3. The pipeline builds the package and stages it on npm. Nothing is public yet.

4. A maintainer of ticketmelon-ui approves it with 2FA: npmjs.com → Staged Packages → review → Approve (or npm stage approve <stage-id>). The version is then published as latest. To drop a staged version instead, reject it there.

The pipeline stops before staging if the tag doesn't match package.json, if that version is already on npm, if yarn.lock is out of date, or if the built package is missing its entry points. It posts the result to Slack.

Releases go through staged publishing because npm is removing direct publishing with bypass-2FA tokens in January 2027.

Test before releasing

Publishing doesn't change any app by itself, so test the build in an app first:

yarn build
npm pack   # → ticketmelon-ui-<version>.tgz

Install that file in the app (yarn add /path/to/ticketmelon-ui-<version>.tgz) and run it locally. For buyer remotes, test in buyer-main-container too: it shares ticketmelon-ui as an eager singleton, so the host's version is the one the remotes get.

After releasing

Each app gets the new version only when it upgrades ticketmelon-ui in its own yarn.lock and deploys through dev → pre → prod as usual.

Pipeline setup

In the Bitbucket repo settings: Pipelines enabled, and in the Production deployment environment:

• NPM_TOKEN (secured): an npm granular access token created from the ticketmelon-dev account, with Read and write (stage only) on ticketmelon-ui only, no organization access, and without "Bypass two-factor authentication". It can stage but not publish, so a leaked token can't release anything without a maintainer's 2FA. It still expires: create a new one and replace this value before then; an expired token fails the stage step.
• SLACK_WEBHOOK (secured, optional): skipped when unset; may come from workspace variables.

Usage

import MyComponent from 'ticketmelon-ui'

License

MIT © SakdinonPiakatAtTicketmelon