Skip to content

Commit

Permalink
Storybook: Update to v8.
Browse files Browse the repository at this point in the history
  • Loading branch information
filiphsps committed Mar 15, 2024
1 parent aec9889 commit b912188
Showing 34 changed files with 179 additions and 214 deletions.
2 changes: 1 addition & 1 deletion .gitattributes
Original file line number Diff line number Diff line change
@@ -1,2 +1,2 @@
*.lockb binary diff=lockb
* text=auto eol=lf
*.lockb binary diff=lockb
2 changes: 1 addition & 1 deletion .husky/pre-commit
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
#!/usr/bin/env sh
. "$(dirname "$0")/_/husky.sh"

npx lint-staged --allow-empty
bunx lint-staged --allow-empty
1 change: 1 addition & 0 deletions .vscode/settings.json
Original file line number Diff line number Diff line change
@@ -42,6 +42,7 @@
"Brandly",
"compat",
"Filiph",
"lockb",
"Nordcom",
"nordstar",
"postbuild",
Binary file modified bun.lockb
Binary file not shown.
4 changes: 2 additions & 2 deletions docs/package.json
Original file line number Diff line number Diff line change
@@ -14,9 +14,9 @@
"scripts": {
"build": "next build",
"dev": "next dev",
"clean": "rimraf -g dist coverage .turbo .next .tsbuildinfo",
"clean": "rimraf -g dist coverage storybook-static .turbo .next .tsbuildinfo *.log",
"start": "next start -p $PORT",
"lint": "concurrently -i --raw bun:lint:*",
"lint": "concurrently -i bun:lint:*",
"lint:next": "next lint",
"lint:prettier": "prettier src/**/*.* --check"
},
24 changes: 11 additions & 13 deletions package.json
Original file line number Diff line number Diff line change
@@ -6,7 +6,6 @@
"description": "An opinionated component library for building human-centric user interfaces.",
"private": true,
"main": "index.js",
"packageManager": "[email protected]",
"engines": {
"node": ">=18 <=21"
},
@@ -19,7 +18,7 @@
],
"scripts": {
"prepare": "husky install",
"dev": "concurrently -i --raw bun:dev:*",
"dev": "concurrently -i bun:dev:*",
"dev:docs": "turbo dev --filter=@nordcom/nordstar-docs",
"dev:storybook": "turbo dev --filter=@nordcom/nordstar-storybook",
"build": "turbo build",
@@ -28,14 +27,14 @@
"build:storybook": "turbo build --filter=@nordcom/nordstar-storybook",
"typecheck": "turbo typecheck",
"lint": "eslint **/*.{ts,tsx}",
"fix:lint": "eslint **/*.{ts,tsx}",
"fix": "concurrently -i bun:fix:*",
"fix:lint": "eslint **/*.{ts,tsx} --fix",
"prettier": "prettier **/src/**/*.* --write",
"fix:prettier": "prettier **/src/**/*.* --fix",
"fix": "concurrently -i --raw bun:fix:*",
"test": "concurrently --raw bun:test:*",
"fix:prettier": "prettier **/src/**/*.* --write",
"test": "concurrently -i bun:test:*",
"test:packages": "vitest run --coverage --passWithNoTests",
"clean": "concurrently --raw bun:clean:*",
"clean:repo": "rimraf -g dist coverage .turbo .next .tsbuildinfo",
"clean": "concurrently -i bun:clean:*",
"clean:repo": "rimraf -g dist coverage storybook-static .turbo .next .tsbuildinfo *.log",
"clean:packages": "turbo clean --filter=!@nordcom/nordstar-docs --filter=!@nordcom/nordstar-storybook",
"clean:docs": "turbo clean --filter=@nordcom/nordstar-docs",
"clean:storybook": "turbo clean --filter=@nordcom/nordstar-storybook",
@@ -77,14 +76,13 @@
"@changesets/cli": "2.27.1",
"@changesets/types": "6.0.0",
"@nordcom/prettier": "0.1.1",
"@storybook/react": "7.6.17",
"@testing-library/dom": "9.3.4",
"@testing-library/jest-dom": "6.4.2",
"@testing-library/react": "14.2.1",
"@testing-library/user-event": "14.5.2",
"@types/node": "20.10.3",
"@types/react": "18.2.66",
"@types/node": "20.11.27",
"@types/react-dom": "18.2.22",
"@types/react": "18.2.66",
"@typescript-eslint/eslint-plugin": "7.2.0",
"@typescript-eslint/parser": "7.2.0",
"@vitejs/plugin-react-swc": "3.6.0",
@@ -112,7 +110,6 @@
"react-dom": "18.2.0",
"rimraf": "5.0.5",
"sass": "1.72.0",
"strip-ansi": "7.1.0",
"turbo": "1.12.5",
"typescript": "5.4.2",
"vite": "5.1.6",
@@ -122,6 +119,7 @@
"vitest": "1.3.1"
},
"overrides": {
"@typescript-eslint/typescript-estree": "7.2.0"
"@typescript-eslint/typescript-estree": "7.2.0",
"esbuild": "0.20.2"
}
}
2 changes: 1 addition & 1 deletion packages/components/accented/package.json
Original file line number Diff line number Diff line change
@@ -45,7 +45,7 @@
"scripts": {
"build": "tsc && vite build",
"dev": "vite build --watch",
"clean": "rimraf -g dist coverage .turbo .next .tsbuildinfo",
"clean": "rimraf -g dist coverage storybook-static .turbo .next .tsbuildinfo *.log",
"typecheck": "tsc --noEmit"
},
"keywords": [
20 changes: 7 additions & 13 deletions packages/components/accented/src/accented.stories.tsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import type { Meta } from '@storybook/react';
import type { AccentedProps } from '../src';
import { Accented } from '../src';
import type { AccentedProps } from '@nordcom/nordstar-accented';
import { Accented } from '@nordcom/nordstar-accented';
import type { Meta, StoryObj } from '@storybook/react';

const story: Meta<typeof Accented> = {
title: 'System/Typography/Accented',
@@ -12,24 +12,18 @@ const story: Meta<typeof Accented> = {
}
};

export default story;
type Story = StoryObj<typeof Accented>;

const Template = (args: AccentedProps) => (
<p>
This text is using the regular body color <Accented {...args}>while this is accented</Accented>, neat.
</p>
);

export const Primary = {
export const Standard: Story = {
render: Template,
args: {
secondary: false
}
};

export const Secondary = {
render: Template,
args: {
secondary: true
}
};

export default story;
2 changes: 1 addition & 1 deletion packages/components/button/package.json
Original file line number Diff line number Diff line change
@@ -42,7 +42,7 @@
"scripts": {
"build": "tsc && vite build",
"dev": "vite build --watch",
"clean": "rimraf -g dist coverage .turbo .next .tsbuildinfo",
"clean": "rimraf -g dist coverage storybook-static .turbo .next .tsbuildinfo *.log",
"typecheck": "tsc --noEmit"
},
"keywords": [
5 changes: 2 additions & 3 deletions packages/components/button/src/button.stories.tsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import type { ButtonProps } from '@nordcom/nordstar-button';
import { Button } from '@nordcom/nordstar-button';
import type { Meta, StoryObj } from '@storybook/react';
import React from 'react';
import type { ButtonProps } from '../src';
import { Button } from '../src';

const story: Meta<typeof Button> = {
title: 'System/Components/Button',
2 changes: 1 addition & 1 deletion packages/components/card/package.json
Original file line number Diff line number Diff line change
@@ -42,7 +42,7 @@
"scripts": {
"build": "tsc && vite build",
"dev": "vite build --watch",
"clean": "rimraf -g dist coverage .turbo .next .tsbuildinfo",
"clean": "rimraf -g dist coverage storybook-static .turbo .next .tsbuildinfo *.log",
"typecheck": "tsc --noEmit"
},
"keywords": [
8 changes: 4 additions & 4 deletions packages/components/card/src/card.stories.tsx
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import { Card } from '../src';

import type { CardProps } from '@nordcom/nordstar-card';
import { Card } from '@nordcom/nordstar-card';
import type { Meta, StoryObj } from '@storybook/react';
import type { CardProps } from '../src';

const story: Meta<typeof Card> = {
title: 'System/Components/Card',
@@ -59,7 +58,8 @@ export const Solid: Story = {
render: Template,
args: {
variant: 'solid',
color: 'primary'
color: 'primary',
borderless: false
}
};

2 changes: 1 addition & 1 deletion packages/components/header/package.json
Original file line number Diff line number Diff line change
@@ -41,7 +41,7 @@
"scripts": {
"build": "tsc && vite build",
"dev": "vite build --watch",
"clean": "rimraf -g dist coverage .turbo .next .tsbuildinfo",
"clean": "rimraf -g dist coverage storybook-static .turbo .next .tsbuildinfo *.log",
"typecheck": "tsc --noEmit"
},
"keywords": [
16 changes: 8 additions & 8 deletions packages/components/header/src/header.stories.tsx
Original file line number Diff line number Diff line change
@@ -1,14 +1,16 @@
import type { Meta } from '@storybook/react';
import React from 'react';
import type { HeaderProps } from '../src';
import { Header } from '../src';
import type { HeaderProps } from '@nordcom/nordstar-header';
import { Header } from '@nordcom/nordstar-header';
import type { Meta, StoryObj } from '@storybook/react';

const story: Meta<typeof Header> = {
title: 'System/Layout/Header',
component: Header,
argTypes: {}
};

export default story;
type Story = StoryObj<typeof Header>;

const Template = ({ title, ...args }: HeaderProps & { title: string }) => (
<>
{[
@@ -24,11 +26,9 @@ const Template = ({ title, ...args }: HeaderProps & { title: string }) => (
</>
);

export const Default = {
render: Template,
export const Standard: Story = {
render: Template as any,
args: {
title: 'Nordstar'
}
};

export default story;
2 changes: 1 addition & 1 deletion packages/components/heading/package.json
Original file line number Diff line number Diff line change
@@ -42,7 +42,7 @@
"scripts": {
"build": "tsc && vite build",
"dev": "vite build --watch",
"clean": "rimraf -g dist coverage .turbo .next .tsbuildinfo",
"clean": "rimraf -g dist coverage storybook-static .turbo .next .tsbuildinfo *.log",
"typecheck": "tsc --noEmit"
},
"keywords": [
58 changes: 26 additions & 32 deletions packages/components/heading/src/heading.stories.tsx
Original file line number Diff line number Diff line change
@@ -1,47 +1,41 @@
import type { Meta } from '@storybook/react';
import React from 'react';
import type { HeadingProps } from '../src';
import { Heading } from '../src';
import type { HeadingProps } from '@nordcom/nordstar-heading';
import { Heading } from '@nordcom/nordstar-heading';
import type { Meta, StoryObj } from '@storybook/react';

const story: Meta<typeof Heading> = {
title: 'System/Typography/Heading',
component: Heading,
argTypes: {
level: {
options: ['h1', 'h2', 'h3', 'h4'],
control: { type: 'radio' }
control: { type: 'inline-radio' }
}
}
};

const Template = (args: HeadingProps) => <Heading {...args}>A compelling page-title</Heading>;

export const h1 = {
render: Template,
args: {
level: 'h1'
}
};

export const h2 = {
render: Template,
args: {
level: 'h2'
}
};
export default story;
type Story = StoryObj<typeof Heading>;

export const h3 = {
render: Template,
args: {
level: 'h3'
}
};
const Template = (args: HeadingProps) => (
<>
{[
<Heading key="h1" level="h1" {...args}>
1. A bold expressive heading
</Heading>,
<Heading key="h2" level="h2" {...args}>
2. Subheading used to provide context
</Heading>,
<Heading key="h3" level="h3" {...args}>
3. Heading used for section headers
</Heading>,
<Heading key="h4" level="h4" {...args}>
4. Heading used for subsection headers
</Heading>
]}
</>
);

export const h4 = {
export const Standard: Story = {
render: Template,
args: {
level: 'h4'
}
args: {}
};

export default story;
2 changes: 1 addition & 1 deletion packages/components/input/package.json
Original file line number Diff line number Diff line change
@@ -41,7 +41,7 @@
"scripts": {
"build": "tsc && vite build",
"dev": "vite build --watch",
"clean": "rimraf -g dist coverage .turbo .next .tsbuildinfo",
"clean": "rimraf -g dist coverage storybook-static .turbo .next .tsbuildinfo *.log",
"typecheck": "tsc --noEmit"
},
"keywords": [
22 changes: 21 additions & 1 deletion packages/components/input/src/input.module.scss
Original file line number Diff line number Diff line change
@@ -16,10 +16,10 @@
150ms ease-in-out border-color,
150ms ease-in-out color;
border-radius: var(--border-radius);
border-style: solid;

&:is([data-variant='outline'], :not([data-variant])) {
border-width: var(--border-width-small);
border-style: solid;

&:not(:is([data-color='primary'], [data-color='secondary'])) {
&[data-color='default'] {
@@ -82,6 +82,26 @@
}
}

&:is([data-variant='solid'], :not([data-variant])) {
--background: var(--color-foreground);
--foreground: var(--color-background);

&[data-color='primary'] {
--background: var(--color-accent-primary);
--foreground: var(--color-accent-primary-foreground);
}
&[data-color='secondary'] {
--background: var(--color-accent-secondary);
--foreground: var(--color-accent-secondary-foreground);
}

border-width: var(--border-width-small);
border-color: var(--background);

color: var(--foreground);
background: var(--background);
}

.label {
font-size: 0.65em;
font-weight: 700;
Loading

0 comments on commit b912188

Please sign in to comment.