Skip to content

Commit

Permalink
feat(web-components): update web-components storybook to v7.6.7
Browse files Browse the repository at this point in the history 
Storybook-static folder is now being served on a http-server to interact with Loki, update MDX files
from MDX1 to MDX2. Prettier fixes to files.

. #977
  • Loading branch information
@zxh722 @ad9242
zxh722 authored and ad9242 committed Jan 25, 2024
1 parent 423eaac commit b4607b2
Show file tree
Hide file tree
Showing 19 changed files with 11,544 additions and 14,005 deletions.
Binary file modified ...oki/reference/chrome_iphone7_Web_Components_Typography_All_prop_text_styles.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified ...-components/.loki/reference/chrome_iphone7_Web_Components_Typography_Italic.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified ...loki/reference/chrome_laptop_Web_Components_Typography_All_prop_text_styles.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified ...b-components/.loki/reference/chrome_laptop_Web_Components_Typography_Italic.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
16 changes: 13 additions & 3 deletions packages/web-components/.storybook/main.js
View file
Original file line number Diff line number Diff line change
@@ -1,17 +1,27 @@
module.exports = {
"core": {
builder: "webpack5",
disableTelemetry: true,
disableTelemetry: true
},

"stories": [
"../src/**/*.stories.mdx",
"../src/**/*.stories.@(js|jsx|ts|tsx)"
],

"addons": [
"@storybook/addon-links",
"@storybook/addon-essentials",
"@storybook/addon-postcss",
"@storybook/addon-a11y",
"@storybook/addon-mdx-gfm"
],
"framework": "@storybook/web-components"

"framework": {
name: "@storybook/web-components-webpack5",
options: {}
},

docs: {
autodocs: true
}
}
25,100 changes: 11,296 additions & 13,804 deletions packages/web-components/package-lock.json
View file

Large diffs are not rendered by default.

31 changes: 17 additions & 14 deletions packages/web-components/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,16 +35,18 @@
"test-a11y": "jest",
"create-component": "stencil generate",
"storybook": "npm-run-all --parallel build:watch start-storybook",
"start-storybook": "start-storybook -p 6006 -s dist --no-manager-cache",
"build-storybook": "rimraf /storybook-static && build-storybook",
"start-storybook": "storybook dev -p 6006 -s dist",
"build-storybook": "rimraf /storybook-static && storybook build -s public",
"prettier": "prettier --config ../../.prettierrc.json --ignore-path ../../.prettierignore src --check",
"prettier:fix": "prettier --config ../../.prettierrc.json --ignore-path ../../.prettierignore src --write",
"lint": "remark src && echo '*** Linting CSS ***' && stylelint --config ../../.stylelintrc.json src/**/*.css && echo '*** Linting standard files ***' && eslint --config ../../.eslintrc.js src",
"lint:fix": "echo '*** Linting CSS ***' && stylelint --config ../../.stylelintrc.json src/**/*.css --fix && echo '*** Linting standard files ***' && eslint --config ../../.eslintrc.js src --fix",
"test-visual": "loki --requireReference --reactUri file:./storybook-static --chromeTolerance=1",
"test-visual:ci": "loki --requireReference --reactUri file:./storybook-static --chromeFlags=\"--no-sandbox --headless --hide-scrollbars --disable-gpu\" --chromeTolerance=1",
"test-visual:update": "npm run build-storybook && loki update --reactUri file:./storybook-static",
"audit": "echo 'Audit for: @ukic/web-components' && audit-ci -m --config ../../audit-ci.json"
"start": "npx http-server storybook-static -s",
"kill": "npx kill-port 8080",
"test-visual": "npm start & loki --requireReference --port 8080 --chromeTolerance=1 && npm run kill",
"test-visual:ci": "npm start & loki --requireReference --port 8080 --chromeFlags=\"--no-sandbox --headless --hide-scrollbars --disable-gpu\" --chromeTolerance=1 && npm run kill",
"test-visual:update": "npm run build-storybook && npm start & loki update --port 8080 --chromeTolerance=1 && npm run kill",
"audit": "echo 'Audit for: @ukic/web-components' & audit-ci -m --config ../../audit-ci.json"
},
"dependencies": {
"@popperjs/core": "^2.11.2",
Expand All @@ -60,14 +62,14 @@
"@open-wc/testing-helpers": "^2.0.2",
"@stencil/postcss": "^2.1.0",
"@stencil/react-output-target": "^0.5.3",
"@storybook/addon-a11y": "^6.4.8",
"@storybook/addon-actions": "^6.4.3",
"@storybook/addon-essentials": "^6.4.3",
"@storybook/addon-links": "^6.4.3",
"@storybook/addon-a11y": "^7.6.7",
"@storybook/addon-actions": "^7.6.7",
"@storybook/addon-essentials": "^7.6.7",
"@storybook/addon-links": "^7.6.7",
"@storybook/addon-mdx-gfm": "^7.6.7",
"@storybook/addon-postcss": "^2.0.0",
"@storybook/builder-webpack5": "^6.5.14",
"@storybook/manager-webpack5": "^6.5.14",
"@storybook/web-components": "^6.4.3",
"@storybook/web-components": "^7.6.7",
"@storybook/web-components-webpack5": "^7.6.7",
"@types/autoprefixer": "^10.2.0",
"@types/jest": "^26.0.24",
"@types/jest-axe": "^3.5.3",
Expand All @@ -77,12 +79,13 @@
"jest-axe": "^5.0.1",
"jest-cli": "^26.6.3",
"lit": "^2.0.2",
"loki": "^0.31.1",
"loki": "^0.33.1",
"npm-run-all": "^4.1.5",
"puppeteer": "^13.1.3",
"react": "^17.0.0",
"react-dom": "^17.0.0",
"stencil-inline-svg": "^1.1.0",
"storybook": "^7.6.7",
"ts-jest": "^26.5.6",
"webpack": "^5.76.0"
},
Expand Down
Binary file added packages/web-components/public/favicon.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
24 changes: 24 additions & 0 deletions packages/web-components/public/favicon.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
184 changes: 93 additions & 91 deletions ...b-components/src/components/ic-breadcrumb-group/ic-breadcrumb-group.stories.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -151,93 +151,8 @@ import BreadcrumbReadme from "../ic-breadcrumb/readme.md";
### Appearance

<Canvas>
<Story name="Appearance">{html`<ic-breadcrumb-group>
<ic-breadcrumb page-title="Breadcrumb 1" href="/breadcrumb-1">
<svg
slot="icon"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M12 6.19L17 10.69V18.5H15V12.5H9V18.5H7V10.69L12 6.19ZM12 3.5L2 12.5H5V20.5H11V14.5H13V20.5H19V12.5H22L12 3.5Z"
fill="currentColor"
></path>
</svg>
</ic-breadcrumb>
<ic-breadcrumb page-title="Breadcrumb 2" current="true" href="/">
<svg
slot="icon"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M12 6.19L17 10.69V18.5H15V12.5H9V18.5H7V10.69L12 6.19ZM12 3.5L2 12.5H5V20.5H11V14.5H13V20.5H19V12.5H22L12 3.5Z"
fill="currentColor"
></path>
</svg>
</ic-breadcrumb>
</ic-breadcrumb-group>
<ic-breadcrumb-group back-breadcrumb-only="true">
<ic-breadcrumb
page-title="Breadcrumb 1"
href="/breadcrumb-1"
></ic-breadcrumb>
<ic-breadcrumb
current="true"
page-title="Breadcrumb 2"
href="/breadcrumb-2"
></ic-breadcrumb> </ic-breadcrumb-group
><ic-breadcrumb-group appearance="dark">
<ic-breadcrumb page-title="Breadcrumb 1" href="/breadcrumb-1">
<svg
slot="icon"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M12 6.19L17 10.69V18.5H15V12.5H9V18.5H7V10.69L12 6.19ZM12 3.5L2 12.5H5V20.5H11V14.5H13V20.5H19V12.5H22L12 3.5Z"
fill="currentColor"
></path>
</svg>
</ic-breadcrumb>
<ic-breadcrumb page-title="Breadcrumb 2" current="true" href="/">
<svg
slot="icon"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M12 6.19L17 10.69V18.5H15V12.5H9V18.5H7V10.69L12 6.19ZM12 3.5L2 12.5H5V20.5H11V14.5H13V20.5H19V12.5H22L12 3.5Z"
fill="currentColor"
></path>
</svg>
</ic-breadcrumb>
</ic-breadcrumb-group>
<ic-breadcrumb-group appearance="dark" back-breadcrumb-only="true">
<ic-breadcrumb
page-title="Breadcrumb 1"
href="/breadcrumb-1"
></ic-breadcrumb>
<ic-breadcrumb
current="true"
page-title="Breadcrumb 2"
href="/breadcrumb-2"
></ic-breadcrumb>
</ic-breadcrumb-group>
<div style="background-color: black; width: fit-content;">
<ic-breadcrumb-group appearance="light">
<Story name="Appearance">
{html`<ic-breadcrumb-group>
<ic-breadcrumb page-title="Breadcrumb 1" href="/breadcrumb-1">
<svg
slot="icon"
Expand Down Expand Up @@ -269,9 +184,49 @@ import BreadcrumbReadme from "../ic-breadcrumb/readme.md";
</svg>
</ic-breadcrumb>
</ic-breadcrumb-group>
</div>
<div style="background-color: black; width: fit-content;">
<ic-breadcrumb-group appearance="light" back-breadcrumb-only="true">
<ic-breadcrumb-group back-breadcrumb-only="true">
<ic-breadcrumb
page-title="Breadcrumb 1"
href="/breadcrumb-1"
></ic-breadcrumb>
<ic-breadcrumb
current="true"
page-title="Breadcrumb 2"
href="/breadcrumb-2"
></ic-breadcrumb> </ic-breadcrumb-group
><ic-breadcrumb-group appearance="dark">
<ic-breadcrumb page-title="Breadcrumb 1" href="/breadcrumb-1">
<svg
slot="icon"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M12 6.19L17 10.69V18.5H15V12.5H9V18.5H7V10.69L12 6.19ZM12 3.5L2 12.5H5V20.5H11V14.5H13V20.5H19V12.5H22L12 3.5Z"
fill="currentColor"
></path>
</svg>
</ic-breadcrumb>
<ic-breadcrumb page-title="Breadcrumb 2" current="true" href="/">
<svg
slot="icon"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M12 6.19L17 10.69V18.5H15V12.5H9V18.5H7V10.69L12 6.19ZM12 3.5L2 12.5H5V20.5H11V14.5H13V20.5H19V12.5H22L12 3.5Z"
fill="currentColor"
></path>
</svg>
</ic-breadcrumb>
</ic-breadcrumb-group>
<ic-breadcrumb-group appearance="dark" back-breadcrumb-only="true">
<ic-breadcrumb
page-title="Breadcrumb 1"
href="/breadcrumb-1"
Expand All @@ -282,7 +237,54 @@ import BreadcrumbReadme from "../ic-breadcrumb/readme.md";
href="/breadcrumb-2"
></ic-breadcrumb>
</ic-breadcrumb-group>
</div>`}</Story>
<div style="background-color: black; width: fit-content;">
<ic-breadcrumb-group appearance="light">
<ic-breadcrumb page-title="Breadcrumb 1" href="/breadcrumb-1">
<svg
slot="icon"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M12 6.19L17 10.69V18.5H15V12.5H9V18.5H7V10.69L12 6.19ZM12 3.5L2 12.5H5V20.5H11V14.5H13V20.5H19V12.5H22L12 3.5Z"
fill="currentColor"
></path>
</svg>
</ic-breadcrumb>
<ic-breadcrumb page-title="Breadcrumb 2" current="true" href="/">
<svg
slot="icon"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M12 6.19L17 10.69V18.5H15V12.5H9V18.5H7V10.69L12 6.19ZM12 3.5L2 12.5H5V20.5H11V14.5H13V20.5H19V12.5H22L12 3.5Z"
fill="currentColor"
></path>
</svg>
</ic-breadcrumb>
</ic-breadcrumb-group>
</div>
<div style="background-color: black; width: fit-content;">
<ic-breadcrumb-group appearance="light" back-breadcrumb-only="true">
<ic-breadcrumb
page-title="Breadcrumb 1"
href="/breadcrumb-1"
></ic-breadcrumb>
<ic-breadcrumb
current="true"
page-title="Breadcrumb 2"
href="/breadcrumb-2"
></ic-breadcrumb>
</ic-breadcrumb-group>
</div>`}
</Story>
</Canvas>

### Icon
Expand Down
8 changes: 2 additions & 6 deletions packages/web-components/src/components/ic-button/ic-button.stories.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,8 @@ export const defaultArgs = {
disabled: false,
loading: false,
appearance: "default",
size: "default",
variant: "secondary",
};

### Primary
Expand Down Expand Up @@ -1157,17 +1159,14 @@ export const defaultArgs = {
args={defaultArgs}
argTypes={{
variant: {
defaultValue: "secondary",
options: ["primary", "secondary", "tertiary", "destructive"],
control: { type: "select" },
},
size: {
defaultValue: "default",
options: ["default", "large", "small"],
control: { type: "inline-radio" },
},
appearance: {
defaultValue: "default",
options: ["default", "dark", "light"],
control: { type: "inline-radio" },
},
Expand All @@ -1194,17 +1193,14 @@ export const defaultArgs = {
args={{ ...defaultArgs }}
argTypes={{
variant: {
defaultValue: "secondary",
options: ["primary", "secondary", "tertiary", "destructive"],
control: { type: "select" },
},
size: {
defaultValue: "default",
options: ["default", "large", "small"],
control: { type: "inline-radio" },
},
appearance: {
defaultValue: "default",
options: ["default", "dark", "light"],
control: { type: "inline-radio" },
},
Expand Down
Loading

0 comments on commit b4607b2

Please sign in to comment.