0.0.46 • Published 10 months ago
@sayaww/nomi-mono v0.0.46
Installation
pnpm i @sayaww/nomi-mono"
Usage
Set up styles and fonts in your root file:
import '@sayaww/nomi-mono/style';
import '@fontsource/inter/400.css'; // optional
import '@fontsource/inter/500.css'; // optional
import '@fontsource/inter/700.css'; // optional
Import components:
import { Button } from '@sayaww/nomi-mono';
With storybook
import '../src/style.css';
import '@fontsource/inter/400.css';
import '@fontsource/inter/500.css';
import '@fontsource/inter/700.css';
Development
turbo dev
#http://localhost:6006
Import themes
- In Tokens Studio in Figma, select
light
theme - Export from Figma, choose Tools > Export > single file
- Uncheck
all token set
- check
include parent key
- save as
Light.json
and put intofigma-output
folder, then repeat for dark theme - put all files into figma-output folder
- run
turbo build-token
- Access theme in
src/themes/tokens.json
- Migrate tokens manually to
tailwind.config.cjs
- See
/tokens/tokens-transformed-[dark | light].json
- See
Developing UI
Adding a new component
Use shadcn/ui to add components you want.
Or
- Duplicate from "Template" folder in
src/components
with the component name. - Add the component name to
src/components/index.tsx
.
Working on UI + your own project
If you are developing UI and other preoject at the same time, you'll need to let Tailwind knows when to compile your new class names.
tailwind.config
content: [
"./index.html",
"./*.mdx",
"./src/components/*.{js,ts,jsx,tsx,mdx}",
"./src/components/**/*.{js,ts,jsx,tsx,mdx}",
"./src/components/**/*.{js,ts,jsx,tsx,mdx}",
"../perp-onboarding/app/**/*.{js,ts,jsx,tsx,mdx}",
"../otc-maker-ui/app/**/*.{js,ts,jsx,tsx,mdx}",
// add new files to watch here
],
package.json
"dev": "tsup src/components/index.tsx --format esm,cjs --dts --watch src --watch ../perp-onboarding/app --watch <your path> & storybook dev -p 6006",
Publish
turbo ship
Publish storybook to Chromatic
turbo chromatic
Embed Story in website
Get url
from the top right corner of a story.
0.0.46
10 months ago
0.0.40
11 months ago
0.0.41
11 months ago
0.0.42
11 months ago
0.0.43
11 months ago
0.0.44
11 months ago
0.0.45
11 months ago
0.0.37
11 months ago
0.0.38
11 months ago
0.0.39
11 months ago
0.0.30
1 year ago
0.0.31
1 year ago
0.0.33
12 months ago
0.0.34
12 months ago
0.0.35
11 months ago
0.0.27
1 year ago
0.0.28
1 year ago
0.0.26
1 year ago
0.0.25
1 year ago
0.0.24
1 year ago
0.0.23
1 year ago
0.0.21
1 year ago
0.0.20
1 year ago
0.0.19
1 year ago
0.0.18
1 year ago
0.0.16
1 year ago
0.0.11
1 year ago
0.0.10
1 year ago
0.0.9
1 year ago
0.0.8
1 year ago
0.0.7
1 year ago
0.0.6
1 year ago
0.0.5
1 year ago
0.0.4
1 year ago
0.0.3
1 year ago
0.0.1
1 year ago