diff --git a/.eslintrc b/.eslintrc index b61d7f647..8c5e9d1e9 100644 --- a/.eslintrc +++ b/.eslintrc @@ -1,11 +1,4 @@ { - "settings": { - "import/resolver": { - "node": { - "paths": ["./src"] - } - } - }, "env": { "es6": true, "browser": true, @@ -14,6 +7,7 @@ "plugins": ["lodash"], "extends": ["@pancakeswap/eslint-config-pancake", "plugin:react/jsx-runtime", "plugin:@next/next/recommended"], "rules": { + "import/no-unresolved": 0, "no-console": ["warn", { "allow": ["info", "warn", "error", "debug"] }], "no-plusplus": 0, "prefer-destructuring": ["warn", { "object": true, "array": false }], diff --git a/.gitignore b/.gitignore index 9e81c50eb..9f8065225 100644 --- a/.gitignore +++ b/.gitignore @@ -1,7 +1,7 @@ # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. # dependencies -/node_modules +node_modules /.pnp .pnp.js @@ -12,12 +12,14 @@ cypress/screenshots cypress/fixtures/example.json # next.js -/.next/ -/out/ +.next/ +out/ .idea/ # production -/build +build +dist +storybook-static # misc .DS_Store @@ -35,8 +37,11 @@ yarn-debug.log* yarn-error.log* debug.log* -src/config/abi/types +**/config/abi/types # Sentry .sentryclirc + +# turbo +.turbo \ No newline at end of file diff --git a/jest.config.js b/jest.config.js index a88932fac..4271e31db 100644 --- a/jest.config.js +++ b/jest.config.js @@ -6,7 +6,10 @@ const createJestConfig = nextJest({ dir: './' }) // Any custom config you want to pass to Jest const customJestConfig = { - testPathIgnorePatterns: ['/cypress/', '/src/config/__tests__/'], + testPathIgnorePatterns: ['/cypress/', '/src/config/__tests__/', '/packages'], + moduleNameMapper: { + '^@pancakeswap/uikit': '/packages/uikit/src', + }, moduleDirectories: ['node_modules', 'src'], testTimeout: 20000, } diff --git a/lerna.json b/lerna.json new file mode 100644 index 000000000..0bf81fdb8 --- /dev/null +++ b/lerna.json @@ -0,0 +1,13 @@ +{ + "packages": ["packages/*"], + "version": "independent", + "npmClient": "yarn", + "workspaces": true, + "ignoreChanges": ["**/__tests__/**", "**/*.md", "**/.storybook/**"], + "command": { + "version": { + "conventionalCommits": true, + "message": "chore(release): Publish" + } + } +} diff --git a/package.json b/package.json index 3dba08edb..8348dce3a 100644 --- a/package.json +++ b/package.json @@ -2,6 +2,9 @@ "name": "pancake-frontend", "version": "0.1.0", "private": true, + "workspaces": [ + "packages/*" + ], "scripts": { "analyze": "ANALYZE=true yarn build", "dev": "next dev", @@ -45,7 +48,6 @@ "@ethersproject/units": "^5.5.0", "@next/bundle-analyzer": "^12.0.7", "@pancakeswap/sdk": "^2.4.0", - "@pancakeswap/uikit": "^0.63.1", "@reduxjs/toolkit": "^1.5.0", "@sentry/nextjs": "^6.17.9", "@snapshot-labs/snapshot.js": "^0.3.25", @@ -91,7 +93,6 @@ "@commitlint/cli": "^13.1.0", "@commitlint/config-conventional": "^13.1.0", "@next/eslint-plugin-next": "^12.0.10", - "@pancakeswap/eslint-config-pancake": "^1.1.0", "@testing-library/react-hooks": "^7.0.2", "@typechain/ethers-v5": "^8.0.5", "@types/canvas-confetti": "^1.4.2", @@ -114,11 +115,13 @@ "eslint-plugin-lodash": "^7.4.0", "husky": "^7.0.0", "jest": "^27.4.5", + "lerna": "^4.0.0", "prettier": "^2.3.0", "serve": "^12.0.0", "source-map-explorer": "^2.5.2", "start-server-and-test": "^1.14.0", "ts-node": "^9.1.1", + "turbo": "^1.1.4", "typechain": "^6.1.0" } } diff --git a/packages/.prettierrc b/packages/.prettierrc new file mode 100644 index 000000000..28c03d832 --- /dev/null +++ b/packages/.prettierrc @@ -0,0 +1,4 @@ +{ + "semi": true, + "printWidth": 120 +} diff --git a/packages/eslint-config/CHANGELOG.md b/packages/eslint-config/CHANGELOG.md new file mode 100644 index 000000000..ddbb02e45 --- /dev/null +++ b/packages/eslint-config/CHANGELOG.md @@ -0,0 +1,33 @@ +# Change Log + +All notable changes to this project will be documented in this file. +See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + +# [1.2.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/eslint-config-pancake/compare/@pancakeswap/eslint-config-pancake@1.1.0...@pancakeswap/eslint-config-pancake@1.2.0) (2021-07-09) + + +### Features + +* Migrate ad-hoc FE rules to eslint-config ([#187](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/eslint-config-pancake/issues/187)) ([75baf17](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/eslint-config-pancake/commit/75baf175c8316fdfc549bc99e2bc38d65b18c5b6)) + + + + + +# 1.1.0 (2021-05-07) + + +### Features + +* Add eslint package ([#7](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/eslint-config-pancake/issues/7)) ([0e0454e](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/eslint-config-pancake/commit/0e0454eb9a63e976934956dc5c66fbef2ce2017a)) + + + + + +## [1.0.1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/eslint-config-pancake/compare/@pancakeswap-libs/eslint-config-pancake@1.0.1...@pancakeswap-libs/eslint-config-pancake@1.0.1) (2021-03-19) + + +### Features + +* Add eslint package ([#7](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/eslint-config-pancake/issues/7)) ([0e0454e](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/eslint-config-pancake/commit/0e0454eb9a63e976934956dc5c66fbef2ce2017a)) diff --git a/packages/eslint-config/README.md b/packages/eslint-config/README.md new file mode 100644 index 000000000..f355b329c --- /dev/null +++ b/packages/eslint-config/README.md @@ -0,0 +1,15 @@ +# eslint-config-pancake + +Pancake Eslint config with: + +- Airbnb config +- Typescript +- Prettier + +## Usage + +``` +npx install-peerdeps --dev @pancakeswap/eslint-config-pancake +``` + +Add `"extends": "@pancakeswap/eslint-config-pancake"` to your eslint config file. diff --git a/packages/eslint-config/lib/index.js b/packages/eslint-config/lib/index.js new file mode 100644 index 000000000..980ff3019 --- /dev/null +++ b/packages/eslint-config/lib/index.js @@ -0,0 +1,58 @@ +module.exports = { + root: true, + parser: "@typescript-eslint/parser", + parserOptions: { + ecmaVersion: 2017, + ecmaFeatures: { + jsx: true, + }, + }, + env: { + es6: true, + browser: true, + }, + settings: { + "import/resolver": { + node: { + extensions: [".js", ".ts", ".jsx", ".tsx"], + }, + }, + "import/extensions": [".js", ".ts", ".jsx", ".tsx"], + }, + extends: [ + "airbnb", + "airbnb/hooks", + "prettier", + "prettier/react", + "prettier/@typescript-eslint", + "plugin:@typescript-eslint/recommended", + ], + rules: { + // Typescript + "@typescript-eslint/no-unused-vars": "warn", + "no-use-before-define": "off", + "@typescript-eslint/no-use-before-define": ["warn"], + "no-shadow": "off", + "@typescript-eslint/no-shadow": ["error"], + "no-console": ["warn", { allow: ["info", "warn", "error"] }], + "no-plusplus": 0, + "prefer-destructuring": ["warn", { object: true, array: false }], + "no-underscore-dangle": 0, + // React + "react/jsx-filename-extension": ["error", { extensions: [".tsx"] }], + "react/prop-types": 0, + "react/jsx-props-no-spreading": 0, + "react/no-multi-comp": 0, + "import/extensions": [ + "error", + "ignorePackages", + { + js: "never", + mjs: "never", + jsx: "never", + ts: "never", + tsx: "never", + }, + ], + }, +}; diff --git a/packages/eslint-config/package.json b/packages/eslint-config/package.json new file mode 100644 index 000000000..169c95541 --- /dev/null +++ b/packages/eslint-config/package.json @@ -0,0 +1,30 @@ +{ + "name": "@pancakeswap/eslint-config-pancake", + "version": "1.2.0", + "description": "Eslint config for PancakeSwap", + "main": "lib/index.js", + "files": [ + "lib" + ], + "repository": "https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/eslint-config-pancake", + "license": "MIT", + "author": "RabbitDoge", + "private": false, + "dependencies": { + "@typescript-eslint/eslint-plugin": "^4.7.0", + "@typescript-eslint/parser": "^4.7.0", + "eslint-config-airbnb": "^18.2.1", + "eslint-config-prettier": "^6.15.0", + "eslint-plugin-import": "^2.22.1", + "eslint-plugin-jsx-a11y": "^6.4.1", + "eslint-plugin-react": "^7.21.5", + "eslint-plugin-react-hooks": "^4.0.0" + }, + "peerDependencies": { + "eslint": "^7.2.0", + "prettier": "^2.1.2" + }, + "publishConfig": { + "access": "public" + } +} diff --git a/packages/uikit/.storybook/main.js b/packages/uikit/.storybook/main.js new file mode 100644 index 000000000..373272ef6 --- /dev/null +++ b/packages/uikit/.storybook/main.js @@ -0,0 +1,14 @@ +module.exports = { + stories: ["../src/**/*.stories.mdx", "../src/**/*.stories.@(js|jsx|ts|tsx)"], + addons: [ + { + name: "@storybook/addon-essentials", + options: { + backgrounds: false, + }, + }, + "@storybook/addon-links", + "@storybook/addon-a11y", + "themeprovider-storybook/register", + ], +}; diff --git a/packages/uikit/.storybook/preview-head.html b/packages/uikit/.storybook/preview-head.html new file mode 100644 index 000000000..7d3cf37cd --- /dev/null +++ b/packages/uikit/.storybook/preview-head.html @@ -0,0 +1 @@ + diff --git a/packages/uikit/.storybook/preview.js b/packages/uikit/.storybook/preview.js new file mode 100644 index 000000000..b02154891 --- /dev/null +++ b/packages/uikit/.storybook/preview.js @@ -0,0 +1,33 @@ +import React from "react"; +import { withThemesProvider } from "themeprovider-storybook"; +import light from "../src/theme/light"; +import dark from "../src/theme/dark"; +import ResetCSS from "../src/ResetCSS"; +import { ModalProvider } from "../src/widgets/Modal"; + +const globalDecorator = (StoryFn) => ( + + + + +); + +export const parameters = { + actions: { argTypesRegex: "^on[A-Z].*" }, + layout: "fullscreen", +}; + +const themes = [ + { + name: "Light", + backgroundColor: light.colors.background, + ...light, + }, + { + name: "Dark", + backgroundColor: dark.colors.background, + ...dark, + }, +]; + +export const decorators = [globalDecorator, withThemesProvider(themes)]; diff --git a/packages/uikit/CHANGELOG.md b/packages/uikit/CHANGELOG.md new file mode 100644 index 000000000..2298a9154 --- /dev/null +++ b/packages/uikit/CHANGELOG.md @@ -0,0 +1,1190 @@ +# Change Log + +All notable changes to this project will be documented in this file. +See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. + +## [0.63.1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.63.0...@pancakeswap/uikit@0.63.1) (2022-01-16) + + +### Bug Fixes + +* **uikit:** Types styled system missing with devdep ([#384](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/384)) ([078f101](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/078f101b67cdc09b5f62e4a4fc45655eaf15733a)) + + + + + +# [0.63.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.62.0...@pancakeswap/uikit@0.63.0) (2022-01-16) + + +### Bug Fixes + +* **uikit:** Chrome scrollbar layoutshift ([#377](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/377)) ([9c68d02](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/9c68d02c3b48388f8eed38f710b73120bb9aaa99)) +* **uikit:** IOS safari BottomNav position ([#378](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/378)) ([154d6f5](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/154d6f5e43fa0f00cff81ff69dca95a366d36067)) + + +### Features + +* **uikit:** footer-telegram icon's tooltip update ([#376](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/376)) ([68ac504](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/68ac50482dd991427bf064744c4ce985261f6281)) +* **uikit:** Support SSR ([#370](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/370)) ([7edd367](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/7edd367c45210e52bdc1523dbeff940c56e0719a)) +* **uikit:** Update Logo Icon ([#350](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/350)) ([c5fde4a](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/c5fde4ab695e5a16461cc21634eb4e8be11cc7c9)) + + + + + +# [0.62.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.61.0...@pancakeswap/uikit@0.62.0) (2021-12-30) + + +### Features + +* List DPT ([#363](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/363)) ([c2a5681](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/c2a56818f977891ad80af9d3eff83334c0d19cce)) + + +### Performance Improvements + +* **uikit:** Remove backdrop filter ([#367](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/367)) ([4d66e7e](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/4d66e7ed433c534bb403e4856ad0617834217cbd)) + + + + + +# [0.61.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.60.0...@pancakeswap/uikit@0.61.0) (2021-12-17) + + +### Bug Fixes + +* (bunnyslider): Remove visible box shadow on slider thumb in mobile safari ([#360](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/360)) ([c74da59](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/c74da59e3a0c4be9112b3d2d9cadcea4a892956a)) + + +### Features + +* **uikit:** Add MessageText for Message ([#361](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/361)) ([ccee124](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/ccee12441aa191610fec27bccfd27a78e8ea52c1)) +* **uikit:** Add SmartContract and Swap icon ([#359](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/359)) ([8cd5a68](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/8cd5a68245cf51f93206b47e7761bbe92ef29c74)) + + + + + +# [0.60.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.59.0...@pancakeswap/uikit@0.60.0) (2021-12-09) + + +### Bug Fixes + +* (bottomdrawer): Add tokenpocket padding to bottom drawer ([#354](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/354)) ([68fffca](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/68fffcabea4e3fab1b9e8dbb448b289a43ded3d1)) + + +### Features + +* **uikit:** Add ProgressBar for compose use ([#356](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/356)) ([0ba9872](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/0ba9872b32405e00c2e9612ba3d77fb38563208e)) + + + + + +# [0.59.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.58.1...@pancakeswap/uikit@0.59.0) (2021-12-01) + + +### Bug Fixes + +* **uikit:** Snapshot ([#349](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/349)) ([a669484](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/a66948484dcccbdc5980fc5a898c2dd310c7a9a0)) + + +### Features + +* **uikit:** Improve BottomDrawer and Overlay ([#345](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/345)) ([9fe7f9d](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/9fe7f9d9cbd0dafd738090d8d0c86385cb04464c)) + + + + + +## [0.58.1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.58.0...@pancakeswap/uikit@0.58.1) (2021-11-29) + + +### Bug Fixes + +* **uikit:** BottomNav clickoutside ([#344](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/344)) ([d8ba475](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/d8ba475b88c03a1ba64685818d77c55e3911f3c6)) + + + + + +# [0.58.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.57.0...@pancakeswap/uikit@0.58.0) (2021-11-24) + + +### Features + +* **uikit:** Add discord icon and link ([#341](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/341)) ([59a9394](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/59a9394f80666c83ae2b35829ebe6e8f84399e95)) + + + + + +# [0.57.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.56.3...@pancakeswap/uikit@0.57.0) (2021-11-24) + + +### Bug Fixes + +* **uikit:** UserMenu position incorrect ([#339](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/339)) ([924e1ca](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/924e1cad126ca919da437b45fa37a16574efe534)) + + +### Features + +* BottomDrawer ([#340](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/340)) ([7a7071e](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/7a7071e633007638d424ddb16d6d429cde75f998)) + + + + + +## [0.56.3](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.56.1...@pancakeswap/uikit@0.56.3) (2021-11-22) + + +### Bug Fixes + +* **uikit:** Menu position incorrect and link no response on touch device ([#336](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/336)) ([21853cd](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/21853cdcdf98de66e19579501a003538b8335f78)) +* **uikit:** Mobile overlay regression ([#332](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/332)) ([a8be97e](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/a8be97ec6dc6d88f3fb7561ce248103d6a8ac733)) +* **uikit:** Show active border on SubMenu when hover ([#333](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/333)) ([c2b4d51](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/c2b4d515a4a904563d497c59953d5d9d848567a8)) + + + + + +## [0.56.2](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.56.1...@pancakeswap/uikit@0.56.2) (2021-11-22) + + +### Bug Fixes + +* **uikit:** Menu position incorrect and link no response on touch device ([#336](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/336)) ([21853cd](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/21853cdcdf98de66e19579501a003538b8335f78)) +* **uikit:** Mobile overlay regression ([#332](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/332)) ([a8be97e](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/a8be97ec6dc6d88f3fb7561ce248103d6a8ac733)) +* **uikit:** Show active border on SubMenu when hover ([#333](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/333)) ([c2b4d51](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/c2b4d515a4a904563d497c59953d5d9d848567a8)) + + + + + +## [0.56.1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.57.0...@pancakeswap/uikit@0.56.1) (2021-11-16) + + +### Reverts + +* Revert "chore(release): Publish" ([3ba958f](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/3ba958f79d3dd8ab0fbdf55ee8addc328b2f6a6b)) + + + + + +# [0.56.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.55.0...@pancakeswap/uikit@0.56.0) (2021-10-28) + + +### Bug Fixes + +* **uikit:** Render menu without link as text in Footer ([#304](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/304)) ([c975470](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/c975470b0f561c4f95bdfac7bb119c7d6365e9af)) +* (menu): Main menu items on tablets causes navigation instead of drop down ([#301](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/301)) ([895ef24](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/895ef24fd054b28bff1eddd1a6df07f08955d512)) +* (menu): Menu item keys might be the same if label is the same ([#294](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/294)) ([871da8b](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/871da8bf43d2808b3f59a8bf578df20c01d2d35f)) +* Token pocket mobile navigation ([#297](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/297)) ([6b80d7e](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/6b80d7e81060ada8af69ece1e61dc275a96a5cfc)) + + +### Features + +* **icons:** Add expand and shrink icons ([#299](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/299)) ([4d4ecd3](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/4d4ecd303c603a6388f10ea9419d27561b26901c)) +* **menu:** Add mobile sub menu entry with icon ([#307](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/307)) ([817a6bd](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/817a6bdb463e931fad3652648e9d120b2957542c)) + + + + + +# [0.55.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.54.5...@pancakeswap/uikit@0.55.0) (2021-10-04) + + +### Features + +* **bottom nav:** Fix ios bottom nav issue on specifics browsers ([#293](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/293)) ([8beb5cc](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/8beb5ccd6581b4804f7f6bf1edae16d3278206cb)) + + + + + +## [0.54.5](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.54.4...@pancakeswap/uikit@0.54.5) (2021-09-28) + + +### Bug Fixes + +* **Menu:** Hide menu bar only when scrolled enough ([#292](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/292)) ([8cbab63](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/8cbab63addfd77d2ce5823d63571b8ec19aad042)) +* DarkMode flag and Stepper issue ([#291](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/291)) ([7c248b7](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/7c248b7031b8a0c6d8173e5eb64dac76df235226)) + + + + + +## [0.54.4](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.54.3...@pancakeswap/uikit@0.54.4) (2021-09-20) + + +### Bug Fixes + +* **menu:** Submenu types ([#288](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/288)) ([c16e0e3](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/c16e0e323e2309471728e158e39511174ab44931)) + + + + + +## [0.54.3](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.54.2...@pancakeswap/uikit@0.54.3) (2021-09-17) + + +### Bug Fixes + +* **uikit:** DropdownMenu ([#280](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/280)) ([f8f8b56](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/f8f8b56c42f53d66186e16bc8150de04c8c49d08)) + + + + + +## [0.54.2](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.54.1...@pancakeswap/uikit@0.54.2) (2021-09-17) + + +### Bug Fixes + +* User menu item on click action not triggered intermittently ([#281](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/281)) ([fc51464](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/fc5146454b6a9841101fc42ad1f0939b1de176c8)) +* **menu:** Apply margin to BodyWrapper ([#284](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/284)) ([651c856](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/651c856f4e5796620129ae0f94efee83f2e8db70)) +* **menu:** Increase timeout on touch devices ([#283](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/283)) ([2262017](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/2262017150a239c9632cf55f5758d6d381af7da5)) + + + + + +## [0.54.1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.54.0...@pancakeswap/uikit@0.54.1) (2021-09-16) + + +### Bug Fixes + +* **footer links:** Add rel attribute ([#278](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/278)) ([c35e027](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/c35e027d2cf22133b238a4d75039c2dedb6b498e)) +* **uikit:** BottomNav ([#279](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/279)) ([5d75877](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/5d7587739fa09d1745467ffe6807d7ade1dfc42d)) + + + + + +# [0.54.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.53.0...@pancakeswap/uikit@0.54.0) (2021-09-14) + + +### Bug Fixes + +* **missing export:** Export SubMenuItems ([#277](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/277)) ([da5ecb1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/da5ecb1b893d0654ad450c3a0dcac8aebdc0d8ce)) + + +### Features + +* **timeline:** Add timeline component ([#276](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/276)) ([a4346dd](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/a4346ddce39ed3d28e83ff05492194d53e7a321f)) + + + + + +# [0.53.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.52.0...@pancakeswap/uikit@0.53.0) (2021-09-14) + + +### Features + +* **menu rework:** Menu rework adjustments ([#275](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/275)) ([894a2d4](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/894a2d4f71a2d83493dc4dbe6f5706ef21eaaa44)) + + + + + +# [0.52.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.51.0...@pancakeswap/uikit@0.52.0) (2021-09-13) + + +### Features + +* **rework navigation:** Rework top and bottom navigation ([#263](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/263)) ([67b4e53](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/67b4e53d12d442cf596a969208b45097a0066534)), closes [#261](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/261) [#264](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/264) [#268](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/268) + + + + + +# [0.51.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.50.3...@pancakeswap/uikit@0.51.0) (2021-09-09) + + +### Features + +* Menu ([#271](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/271)) ([4227823](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/42278237b8a47e2144f7cf7f84e303fa86e792d2)) +* **uikit:** Button light variant ([#273](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/273)) ([ac063c1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/ac063c11f1825f32ee2666036ad097b6f5189c9b)) +* **uikit:** TextField ([#272](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/272)) ([8c68ce8](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/8c68ce8a7518039fdc8fba082018271b92ca08df)) + + + + + +## [0.50.3](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.50.2...@pancakeswap/uikit@0.50.3) (2021-09-06) + +**Note:** Version bump only for package @pancakeswap/uikit + + + + + +## [0.50.2](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.50.1...@pancakeswap/uikit@0.50.2) (2021-09-06) + + +### Bug Fixes + +* Link of cake price to swap page is broken ([#260](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/260)) ([3f8e089](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/3f8e0892a93975468b086758093e1a2ca5d6dd73)) + + + + + +## [0.50.1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.50.0...@pancakeswap/uikit@0.50.1) (2021-08-31) + +**Note:** Version bump only for package @pancakeswap/uikit + + + + + +# [0.50.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.49.2...@pancakeswap/uikit@0.50.0) (2021-08-31) + + +### Features + +* Translation support for connect and account modal ([#257](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/257)) ([6d97f2e](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/6d97f2eeba94d4373385f6a1ace6f9f837e8db31)) + + + + + +## [0.49.2](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.49.1...@pancakeswap/uikit@0.49.2) (2021-08-27) + +**Note:** Version bump only for package @pancakeswap/uikit + + + + + +## [0.49.1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.49.0...@pancakeswap/uikit@0.49.1) (2021-08-20) + + +### Bug Fixes + +* **uikit:** Menu breakpoint ([#247](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/247)) ([4352c38](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/4352c38731ea0101d7f16cccee9fed801c74af6f)) + + + + + +# [0.49.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.48.0...@pancakeswap/uikit@0.49.0) (2021-08-20) + + +### Features + +* **uikit:** Add breakpoint helpers ([#246](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/246)) ([ed34997](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/ed34997a91a88f069fc019f3aeecbb101a864ce6)) + + + + + +# [0.48.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.47.0...@pancakeswap/uikit@0.48.0) (2021-08-19) + + +### Features + +* **uikit:** New breakpoint ([#241](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/241)) ([2262df1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/2262df11cffca2218fb1524a1f219ddf3be417e5)) +* **uikit-tags:** Add typography props ([#245](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/245)) ([55ed86b](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/55ed86ba48061e52cebe9bd92bb10fc22efebf4e)) + + + + + +# [0.47.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.46.2...@pancakeswap/uikit@0.47.0) (2021-08-12) + + +### Features + +* **uikit:** Input Group ([#220](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/220)) ([109f3de](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/109f3de9c6167652bd84a1302ddae3008263498b)) + + + + + +## [0.46.2](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.46.1...@pancakeswap/uikit@0.46.2) (2021-08-11) + +**Note:** Version bump only for package @pancakeswap/uikit + + + + + +## [0.46.1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.46.0...@pancakeswap/uikit@0.46.1) (2021-08-09) + +**Note:** Version bump only for package @pancakeswap/uikit + + + + + +# [0.46.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.45.0...@pancakeswap/uikit@0.46.0) (2021-08-09) + + +### Bug Fixes + +* Auto-close SubMenu if clicked on another SubMenu ([#231](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/231)) ([895eb70](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/895eb700206b98a2220cbd6f46353a106e337988)) + + +### Features + +* Update Card component ([#232](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/232)) ([bf509c5](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/bf509c578533f8e1cc37dd9ef8e830ec7e43c999)) + + + + + +# [0.45.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.44.1...@pancakeswap/uikit@0.45.0) (2021-08-06) + + +### Features + +* **menu:** Add global settings to Menu Widget ([#224](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/224)) ([6ac2200](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/6ac220074777427d94e3cba78f09d2dadadce9f0)) +* **uikit:** Td & Th components ([#227](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/227)) ([c7f4283](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/c7f4283357532cdb03ae4a577253ed4a473e1eca)) + + + + + +## [0.44.1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.44.0...@pancakeswap/uikit@0.44.1) (2021-08-05) + +**Note:** Version bump only for package @pancakeswap/uikit + + + + + +# [0.44.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.43.0...@pancakeswap/uikit@0.44.0) (2021-08-03) + + +### Features + +* **uikit:** Table ([#221](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/221)) ([6289718](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/6289718e7980a5021c70fa016571c0fc36c46a4c)) + + + + + +# [0.43.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.42.1...@pancakeswap/uikit@0.43.0) (2021-08-02) + + +### Features + +* Add medal colors ([#217](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/217)) ([92d80f2](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/92d80f2ae1e8e9aa02d1a56542566205553ce9d2)) +* SubMenu component ([#219](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/219)) ([e3d6747](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/e3d6747987243640eedabc407d19142d2230de34)) + + + + + +## [0.42.1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.42.0...@pancakeswap/uikit@0.42.1) (2021-07-29) + +**Note:** Version bump only for package @pancakeswap/uikit + + + + + +# [0.42.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.41.0...@pancakeswap/uikit@0.42.0) (2021-07-28) + + +### Features + +* **uikit-buttonmenu:** Full width ([#212](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/212)) ([0fa2ff5](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/0fa2ff5f209843f489f0f65c3b885361beec5014)) + + + + + +# [0.41.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.40.4...@pancakeswap/uikit@0.41.0) (2021-07-21) + + +### Features + +* **uikit:** Wallet icons ([#206](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/206)) ([7bff4b5](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/7bff4b57a92ba6363187af429b26ef2dd2658830)) + + + + + +## [0.40.4](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.40.3...@pancakeswap/uikit@0.40.4) (2021-07-16) + +**Note:** Version bump only for package @pancakeswap/uikit + + + + + +## [0.40.3](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.40.2...@pancakeswap/uikit@0.40.3) (2021-07-15) + + +### Bug Fixes + +* Increase ifo stepper connector height in mobile ([#195](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/195)) ([5408d1c](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/5408d1ca6099154d5385b0aaecf5015fdf8b4d20)) + + + + + +## [0.40.2](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.40.1...@pancakeswap/uikit@0.40.2) (2021-07-09) + +**Note:** Version bump only for package @pancakeswap/uikit + + + + + +## [0.40.1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.40.0...@pancakeswap/uikit@0.40.1) (2021-07-09) + +**Note:** Version bump only for package @pancakeswap/uikit + + + + + +# [0.40.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.39.4...@pancakeswap/uikit@0.40.0) (2021-07-01) + + +### Features + +* Reactive modals ([#183](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/183)) ([7644124](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/7644124b0205379019eba9aebcab30d163144fae)) + + + + + +## [0.39.4](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.39.3...@pancakeswap/uikit@0.39.4) (2021-06-30) + +**Note:** Version bump only for package @pancakeswap/uikit + + + + + +## [0.39.3](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.39.2...@pancakeswap/uikit@0.39.3) (2021-06-21) + +**Note:** Version bump only for package @pancakeswap/uikit + + + + + +## [0.39.2](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.39.1...@pancakeswap/uikit@0.39.2) (2021-06-18) + +**Note:** Version bump only for package @pancakeswap/uikit + + + + + +## [0.39.1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.39.0...@pancakeswap/uikit@0.39.1) (2021-06-17) + + +### Bug Fixes + +* (userblock) Check Props properties seperately to not cause rerender each time ([#151](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/151)) ([e6f90d7](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/e6f90d7b41a1b3a1d373560dd29e06f10c324639)) + + + + + +# [0.39.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.38.0...@pancakeswap/uikit@0.39.0) (2021-06-14) + + +### Features + +* Menu variant without Connect button ([#155](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/155)) ([84b6f68](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/84b6f683693b426428c5445fc6891608e3943399)) + + + + + +# [0.38.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.37.1...@pancakeswap/uikit@0.38.0) (2021-06-11) + + +### Bug Fixes + +* (userblock) Rerender userblock when one of the props changes ([#148](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/148)) ([ba5e3ab](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/ba5e3ab25d558830a1af49e82943b53c5a5ab344)) + + +### Features + +* (connect) Change how to connect link with more accurate one ([#152](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/152)) ([bfbe506](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/bfbe506e63ef7a243d7425d07fb59c9da9d5a06b)) + + + + + +## [0.37.1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.37.0...@pancakeswap/uikit@0.37.1) (2021-06-09) + + +### Bug Fixes + +* (Menu) Footer is not visible completely when navigation bar is visible ([#138](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/138)) ([fa6fc66](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/fa6fc669091398de8c3cee156e3724006023a4a2)) +* Message component ([#150](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/150)) ([90387d4](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/90387d4cc5758763476d1d20c0a9b8d63588c689)) + + + + + +# [0.37.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.36.1...@pancakeswap/uikit@0.37.0) (2021-06-08) + + +### Features + +* (BalanceInput) Add decimal check support ([#142](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/142)) ([763e13f](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/763e13f836ac2cbb8a3b1132d98854e07a492ced)) + + + + + +## [0.36.1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.36.0...@pancakeswap/uikit@0.36.1) (2021-06-03) + +**Note:** Version bump only for package @pancakeswap/uikit + + + + + +# [0.36.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.35.0...@pancakeswap/uikit@0.36.0) (2021-05-31) + + +### Features + +* Add a grid primitive ([#122](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/122)) ([15e8aad](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/15e8aad6bd87ed204a7ffcd14d434a009a0051ef)) + + + + + +# [0.35.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.34.0...@pancakeswap/uikit@0.35.0) (2021-05-27) + + +### Features + +* Add text ellipsis ([#121](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/121)) ([17d1bfa](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/17d1bfadef5b8c78a2f7f8400e3942e5bb6a419a)) + + + + + +# [0.34.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.33.2...@pancakeswap/uikit@0.34.0) (2021-05-26) + + +### Features + +* Message component ([#120](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/120)) ([0584b7d](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/0584b7d59dd84273c36f81b19077a1eca1fd0bee)) + + + + + +## [0.33.2](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.33.1...@pancakeswap/uikit@0.33.2) (2021-05-26) + + +### Bug Fixes + +* Add border to button menu ([#117](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/117)) ([ddccc89](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/ddccc894873fc029e085df3fddc95adfc2cd4488)) +* Card radius ([#116](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/116)) ([beb881a](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/beb881a8829496a0949f1ae073e88759f131f801)) +* Change help link of connect modal to point connect ([#118](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/118)) ([486e7d3](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/486e7d375b8abaa9a4fabfc079c9872c2925c929)) + + + + + +## [0.33.1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.33.0...@pancakeswap/uikit@0.33.1) (2021-05-25) + + +### Bug Fixes + +* **menu:** Improved accessibility ([#109](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/109)) ([eda619d](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/eda619d18866f0cbd1958a16cdd2bede327bf485)) + + + + + +# [0.33.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.32.3...@pancakeswap/uikit@0.33.0) (2021-05-24) + + +### Bug Fixes + +* Bunny slider progress width is too small when is leftmost and too big when is rightmost side ([#103](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/103)) ([298fd8e](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/298fd8e9ed68d580183b4ea62710dd85867becfc)) + + +### Features + +* **uikit:** Bubblegum card header variant ([#114](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/114)) ([95ca7a0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/95ca7a071305a840cf8582df2a812b819624c8a7)) +* **uikit:** Proposal icon ([#108](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/108)) ([6ca7995](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/6ca7995c3e7acfaf9e7309e86b953a11b25305b8)) +* **uikit:** Vote icon ([#111](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/111)) ([1399814](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/1399814b123ea6232c16aff231965112b63f3fa0)) +* **uikit/tag:** Warning variant ([#110](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/110)) ([f4b9d87](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/f4b9d87100c4d493728277d566fdf581d0fca6bd)) + + + + + +## [0.32.3](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.32.2...@pancakeswap/uikit@0.32.3) (2021-05-11) + +**Note:** Version bump only for package @pancakeswap/uikit + + + + + +## [0.32.2](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.32.1...@pancakeswap/uikit@0.32.2) (2021-05-11) + + +### Bug Fixes + +* Dropdown colors ([#100](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/100)) ([5d66f62](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/5d66f62db5234bc8d59d836ba65713b79b5ecbbf)) + + + + + +## [0.32.1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.32.0...@pancakeswap/uikit@0.32.1) (2021-05-11) + +**Note:** Version bump only for package @pancakeswap/uikit + + + + + +# [0.32.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.31.0...@pancakeswap/uikit@0.32.0) (2021-05-11) + + +### Bug Fixes + +* Chrome blurs logo during scaling animation ([#98](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/98)) ([d3b79bc](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/d3b79bc67dab44e5f7b042f367211e902375b4eb)) + + +### Features + +* **text:** Add styled system { layout } style to Text ([#96](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/96)) ([2b619a1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/2b619a15f4806b1eb92d4cbd08a36984777038d1)) + + + + + +# [0.31.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap/uikit@0.30.0...@pancakeswap/uikit@0.31.0) (2021-05-10) + + +### Features + +* Add new icons ([04cbe90](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/04cbe90e893ef7ed834edc1abd6bdb2e0ff23be2)) + + + + + +# 0.30.0 (2021-05-07) + + +### Bug Fixes + +* :fire: UI updates: button click animation, menu closing fix, men… ([#63](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/63)) ([3d9ba48](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/3d9ba489f642939cfdf54d6939c0fdd7309ed86b)) +* Accordion menu not showing new result when children changed ([#77](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/77)) ([57ff149](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/57ff1493987c0928d7d9f3cf04fc013331f65ab5)) +* Accordion menu stuck at active state ([#57](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/57)) ([f9f5162](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/f9f5162f269a27b375943db4b87850c6d8998d3d)) +* Add missing ios support for balance input ([#75](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/75)) ([b648a77](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/b648a77c9b7d7f0f818153688779f2254060ee88)) +* Add z-index 10 to StyledTooltip ([#70](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/70)) ([24941ff](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/24941ff7234e4ad89a4fa0c10c85e2f73e8f72aa)) +* Button loading state ([#30](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/30)) ([7fff56d](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/7fff56d022e06a911525f6163de1e4b5adfab9c7)) +* Copy clipboard on mobile devices ([#2](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/2)) ([a64bfd8](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/a64bfd8b998f9ab9ee4daac9b42fa8c7a7eb53a7)) +* Included setupTests.js and updated snap tests ([#50](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/50)) ([b6ab0ee](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/b6ab0ee48e82c8ac88b288e1f790e1c91babb93d)) +* Make BalanceInputt a type="number" ([#74](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/74)) ([e6e6915](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/e6e69151a79c35f9c736b1fb996cebb99ce526fc)) +* Modal border inner color use theme value ([#37](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/37)) ([8e5c9c4](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/8e5c9c409b38059f70f6746bc769f4eced009660)) +* Put shadow under the bunny head of slider component ([#25](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/25)) ([92da5b5](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/92da5b5cf746c1a3e10d05c3e5344943a926d943)) +* React dom failure when passing unknown props to child component ([#49](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/49)) ([e3c0272](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/e3c02729bb5c1391d6179a7da6c38bdee6f741bf)) +* Set panel z index to 0 on desktop ([#45](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/45)) ([6cde36e](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/6cde36ee73b2075de85ef809bed3f959e46de6e2)) +* Slider step label position ([#36](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/36)) ([060b835](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/060b835c68d67d83575f3f8783c2610133798aea)) +* Stepper alignement ([#69](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/69)) ([25df26a](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/25df26a9c9e6668c4e0ccd8171df6f748b41dccf)) +* Stepper connector visibility ([#66](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/66)) ([629be7b](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/629be7b33cc3c7d95499ca67b7a175a29f3f7225)) +* Stepper layout ([#73](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/73)) ([6899561](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/6899561397a065e625b9ea2461f5d1a7b328fa3a)) +* Theme config key name ([#71](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/71)) ([d55e4bc](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/d55e4bc76486d9c04df62b7e1359b394a8b89dd8)) +* Tooltip on hover disappear immediately when mouse leaves target element ([#90](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/90)) ([97642eb](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/97642eb9f5b9d58a23107e692219362c83711917)) +* Visible Border and background in ios for bunny slider ([#93](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/93)) ([cbb93f7](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/cbb93f7c7655e072ded9857cdef08f6b36bfa301)) +* **card-ribbon:** Add z-index value to ribbon and spread props to improve flexibility of component ([#88](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/88)) ([2fb19f1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/2fb19f19ffef89a7abc73d1e77734b1a46a99d29)) +* Z index breaking language switcher ([#67](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/67)) ([7179eb1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/7179eb16d1125c517362cf953a04659d8d12dd1d)) +* **modal:** Change modal min width to 320px ([#60](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/60)) ([f09ade9](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/f09ade9f149d6793404c86829a728b4f1ba7b93a)) +* **tab-menu:** Fix scroll overflow and tighten padding on sm phones ([#62](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/62)) ([ef0cd3d](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/ef0cd3d8896b34968e3610c2a078842dfe7142bf)) +* **uikit:** Accept float values for Slider ([#4](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/4)) ([018d7e5](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/018d7e5276e06cf880b2ce8f15f6eaa10e47f236)) + + +### Features + +* **colors:** Add card gradients to colors theme ([#61](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/61)) ([4c7a8ac](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/4c7a8acfb328b80d203ba39eccac92dbf64ca674)) +* **menu:** Add support for top level tags on accordion ([#84](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/84)) ([a15257b](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/a15257ba0460d116bfeaa5ffdad1b9e2c20b4872)) +* **menu-status:** Add optional menu item 'status' property ([#29](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/29)) ([65f7e02](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/65f7e026345d145b61d43864699df3c1aa319446)) +* **modal-bg:** Add overflow hidden prop to Modal container and update storybook ([#82](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/82)) ([2233499](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/22334997bf9dde0dcfb551bc26e78a3a92c8e5db)) +* **progress:** Scale ([#79](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/79)) ([1adc8f2](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/1adc8f255af8b0d61ab3f847468de36667385af6)) +* **svgs:** Add latest icons to uiki ([#23](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/23)) ([f2c218e](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/f2c218e270ed8c351184fedf8ef5d7edd9439176)) +* **uikit:** Dropdown color ([#52](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/52)) ([52aae47](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/52aae470bc0067f5ac130df3bdb562c2911cb5cc)) +* **uikit:** Icons ([#40](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/40)) ([6aab674](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/6aab674e7f304439cc1f2fe3754aa8f697cc3efd)) +* **uikit:** Icons ([#41](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/41)) ([ff80fbe](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/ff80fbe940e0afd54ecb2be8a08a241109dde185)) +* **uikit:** Prediction icons ([#87](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/87)) ([25b03ce](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/25b03ce2eb2bab14fc48cd8d8b5de212e12e3ee4)) +* Add card header variants ([#34](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/34)) ([079e3f2](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/079e3f2cf5536aec5bb402af534c2a05723a3cb3)) +* Add expandable buttons ([#35](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/35)) ([0790f3e](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/0790f3ed241acbd0236c8c134579efaa8a5c457b)) +* Add left position for card ribbon ([#68](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/68)) ([0edaf8e](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/0edaf8e7a1dfa76be1fa858d3e534471a533b512)) +* Add minWidth and headerBackground props to Modal ([#26](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/26)) ([ba5d231](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/ba5d231ce8c9d9f39b507befa7dbbf731bac0b26)) +* Add Tune icon ([#54](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/54)) ([54702ac](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/54702ac31f6ff7ea0eeb7483363841eb0a2262d6)) +* Add VisibilityOn and VisibilityOff icons ([#81](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/81)) ([6635681](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/6635681402de7c43fa429808a46b733fb415ac5f)) +* Refresh icon ([#27](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/27)) ([60d9b34](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/60d9b34fbbd871d678c1836ff7ab924a4b301193)) +* Stepper ([#42](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/42)) ([8b1b72e](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/8b1b72e00bcf012df258becd1048770af2498221)) + + + + + +## [0.29.4](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.29.3...@pancakeswap-libs/uikit@0.29.4) (2021-05-06) + + +### Bug Fixes + +* Copy clipboard on mobile devices ([#2](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/2)) ([a64bfd8](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/a64bfd8b998f9ab9ee4daac9b42fa8c7a7eb53a7)) + + + + + +## [0.29.3](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.29.2...@pancakeswap-libs/uikit@0.29.3) (2021-05-03) + +**Note:** Version bump only for package @pancakeswap-libs/uikit + + + + + +## [0.29.2](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.29.1...@pancakeswap-libs/uikit@0.29.2) (2021-04-30) + + +### Bug Fixes + +* Tooltip on hover disappear immediately when mouse leaves target element ([#90](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/90)) ([97642eb](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/97642eb9f5b9d58a23107e692219362c83711917)) + + + + + +## [0.29.1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.29.0...@pancakeswap-libs/uikit@0.29.1) (2021-04-29) + + +### Bug Fixes + +* **card-ribbon:** Add z-index value to ribbon and spread props to improve flexibility of component ([#88](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/88)) ([2fb19f1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/2fb19f19ffef89a7abc73d1e77734b1a46a99d29)) + + + + + +# [0.29.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.28.1...@pancakeswap-libs/uikit@0.29.0) (2021-04-28) + + +### Features + +* **uikit:** Prediction icons ([#87](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/87)) ([25b03ce](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/25b03ce2eb2bab14fc48cd8d8b5de212e12e3ee4)) + + + + + +## [0.28.1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.28.0...@pancakeswap-libs/uikit@0.28.1) (2021-04-27) + +**Note:** Version bump only for package @pancakeswap-libs/uikit + + + + + +# [0.28.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.27.1...@pancakeswap-libs/uikit@0.28.0) (2021-04-23) + + +### Bug Fixes + +* Accordion menu not showing new result when children changed ([#77](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/77)) ([57ff149](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/57ff1493987c0928d7d9f3cf04fc013331f65ab5)) + + +### Features + +* **menu:** Add support for top level tags on accordion ([#84](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/84)) ([a15257b](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/a15257ba0460d116bfeaa5ffdad1b9e2c20b4872)) + + + + + +## [0.27.1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.27.0...@pancakeswap-libs/uikit@0.27.1) (2021-04-22) + +**Note:** Version bump only for package @pancakeswap-libs/uikit + + + + + +# [0.27.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.26.0...@pancakeswap-libs/uikit@0.27.0) (2021-04-22) + + +### Features + +* **modal-bg:** Add overflow hidden prop to Modal container and update storybook ([#82](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/82)) ([2233499](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/22334997bf9dde0dcfb551bc26e78a3a92c8e5db)) +* Add VisibilityOn and VisibilityOff icons ([#81](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/81)) ([6635681](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/6635681402de7c43fa429808a46b733fb415ac5f)) + + + + + +# [0.26.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.25.3...@pancakeswap-libs/uikit@0.26.0) (2021-04-20) + + +### Features + +* **progress:** Scale ([#79](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/79)) ([1adc8f2](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/1adc8f255af8b0d61ab3f847468de36667385af6)) + + + + + +## [0.25.3](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.25.2...@pancakeswap-libs/uikit@0.25.3) (2021-04-15) + + +### Bug Fixes + +* Make BalanceInputt a type="number" ([#74](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/74)) ([e6e6915](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/e6e69151a79c35f9c736b1fb996cebb99ce526fc)) + + + + + +## [0.25.2](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.25.1...@pancakeswap-libs/uikit@0.25.2) (2021-04-15) + + +### Bug Fixes + +* Stepper layout ([#73](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/73)) ([6899561](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/6899561397a065e625b9ea2461f5d1a7b328fa3a)) + + + + + +## [0.25.1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.25.0...@pancakeswap-libs/uikit@0.25.1) (2021-04-15) + +**Note:** Version bump only for package @pancakeswap-libs/uikit + + + + + +# [0.25.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.24.1...@pancakeswap-libs/uikit@0.25.0) (2021-04-14) + + +### Bug Fixes + +* Theme config key name ([#71](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/71)) ([d55e4bc](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/d55e4bc76486d9c04df62b7e1359b394a8b89dd8)) + + + + + +## [0.24.1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.24.0...@pancakeswap-libs/uikit@0.24.1) (2021-04-14) + + +### Bug Fixes + +* Add z-index 10 to StyledTooltip ([#70](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/70)) ([24941ff](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/24941ff7234e4ad89a4fa0c10c85e2f73e8f72aa)) + + + + + +# [0.24.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.23.2...@pancakeswap-libs/uikit@0.24.0) (2021-04-13) + + +### Bug Fixes + +* :fire: UI updates: button click animation, menu closing fix, men… ([#63](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/63)) ([3d9ba48](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/3d9ba489f642939cfdf54d6939c0fdd7309ed86b)) +* Z index breaking language switcher ([#67](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/67)) ([7179eb1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/7179eb16d1125c517362cf953a04659d8d12dd1d)) + + +### Features + +* **colors:** Add card gradients to colors theme ([#61](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/61)) ([4c7a8ac](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/4c7a8acfb328b80d203ba39eccac92dbf64ca674)) + + + + + +## [0.23.2](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.23.1...@pancakeswap-libs/uikit@0.23.2) (2021-04-12) + + +### Bug Fixes + +* Stepper alignement ([#69](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/69)) ([25df26a](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/25df26a9c9e6668c4e0ccd8171df6f748b41dccf)) + + + + + +## [0.23.1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.23.0...@pancakeswap-libs/uikit@0.23.1) (2021-04-12) + +**Note:** Version bump only for package @pancakeswap-libs/uikit + + + + + +# [0.23.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.22.2...@pancakeswap-libs/uikit@0.23.0) (2021-04-12) + + +### Bug Fixes + +* **tab-menu:** Fix scroll overflow and tighten padding on sm phones ([#62](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/62)) ([ef0cd3d](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/ef0cd3d8896b34968e3610c2a078842dfe7142bf)) + + +### Features + +* Add left position for card ribbon ([#68](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/68)) ([0edaf8e](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/0edaf8e7a1dfa76be1fa858d3e534471a533b512)) + + + + + +## [0.22.2](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.22.1...@pancakeswap-libs/uikit@0.22.2) (2021-04-11) + + +### Bug Fixes + +* Stepper connector visibility ([#66](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/66)) ([629be7b](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/629be7b33cc3c7d95499ca67b7a175a29f3f7225)) + + + + + +## [0.22.1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.22.0...@pancakeswap-libs/uikit@0.22.1) (2021-04-10) + + +### Bug Fixes + +* **modal:** Change modal min width to 320px ([#60](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/60)) ([f09ade9](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/f09ade9f149d6793404c86829a728b4f1ba7b93a)) +* Accordion menu stuck at active state ([#57](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/57)) ([f9f5162](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/f9f5162f269a27b375943db4b87850c6d8998d3d)) +* React dom failure when passing unknown props to child component ([#49](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/49)) ([e3c0272](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/e3c02729bb5c1391d6179a7da6c38bdee6f741bf)) + + + + + +# [0.22.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.21.0...@pancakeswap-libs/uikit@0.22.0) (2021-04-07) + + +### Features + +* Add Tune icon ([#54](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/54)) ([54702ac](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/54702ac31f6ff7ea0eeb7483363841eb0a2262d6)) + + + + + +# [0.21.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.20.1...@pancakeswap-libs/uikit@0.21.0) (2021-04-06) + + +### Bug Fixes + +* Included setupTests.js and updated snap tests ([#50](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/50)) ([b6ab0ee](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/b6ab0ee48e82c8ac88b288e1f790e1c91babb93d)) + + +### Features + +* **uikit:** Dropdown color ([#52](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/52)) ([52aae47](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/52aae470bc0067f5ac130df3bdb562c2911cb5cc)) + + + + + +## [0.20.1](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.20.0...@pancakeswap-libs/uikit@0.20.1) (2021-04-02) + +**Note:** Version bump only for package @pancakeswap-libs/uikit + + + + + +# [0.20.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.19.0...@pancakeswap-libs/uikit@0.20.0) (2021-04-02) + + +### Bug Fixes + +* Set panel z index to 0 on desktop ([#45](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/45)) ([6cde36e](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/6cde36ee73b2075de85ef809bed3f959e46de6e2)) + + +### Features + +* Stepper ([#42](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/42)) ([8b1b72e](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/8b1b72e00bcf012df258becd1048770af2498221)) + + + + + +# [0.19.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.18.0...@pancakeswap-libs/uikit@0.19.0) (2021-03-31) + + +### Bug Fixes + +* Modal border inner color use theme value ([#37](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/37)) ([8e5c9c4](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/8e5c9c409b38059f70f6746bc769f4eced009660)) + + +### Features + +* **uikit:** Icons ([#40](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/40)) ([6aab674](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/6aab674e7f304439cc1f2fe3754aa8f697cc3efd)) +* **uikit:** Icons ([#41](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/41)) ([ff80fbe](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/ff80fbe940e0afd54ecb2be8a08a241109dde185)) + + + + + +# [0.18.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.17.0...@pancakeswap-libs/uikit@0.18.0) (2021-03-30) + + +### Bug Fixes + +* Button loading state ([#30](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/30)) ([7fff56d](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/7fff56d022e06a911525f6163de1e4b5adfab9c7)) +* Put shadow under the bunny head of slider component ([#25](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/25)) ([92da5b5](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/92da5b5cf746c1a3e10d05c3e5344943a926d943)) +* Slider step label position ([#36](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/36)) ([060b835](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/060b835c68d67d83575f3f8783c2610133798aea)) + + +### Features + +* Add card header variants ([#34](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/34)) ([079e3f2](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/079e3f2cf5536aec5bb402af534c2a05723a3cb3)) +* Add expandable buttons ([#35](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/35)) ([0790f3e](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/0790f3ed241acbd0236c8c134579efaa8a5c457b)) +* **menu-status:** Add optional menu item 'status' property ([#29](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/29)) ([65f7e02](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/65f7e026345d145b61d43864699df3c1aa319446)) + + + + + +# [0.17.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.16.0...@pancakeswap-libs/uikit@0.17.0) (2021-03-24) + + +### Features + +* Add minWidth and headerBackground props to Modal ([#26](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/26)) ([ba5d231](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/ba5d231ce8c9d9f39b507befa7dbbf731bac0b26)) +* Refresh icon ([#27](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/27)) ([60d9b34](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/60d9b34fbbd871d678c1836ff7ab924a4b301193)) + + + + + +# [0.16.0](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.15.2...@pancakeswap-libs/uikit@0.16.0) (2021-03-22) + + +### Features + +* **svgs:** Add latest icons to uiki ([#23](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/23)) ([f2c218e](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/f2c218e270ed8c351184fedf8ef5d7edd9439176)) + + + + + +## [0.15.2](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/compare/@pancakeswap-libs/uikit@0.15.2...@pancakeswap-libs/uikit@0.15.2) (2021-03-19) + + +### Bug Fixes + +* **uikit:** Accept float values for Slider ([#4](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/issues/4)) ([018d7e5](https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit/commit/018d7e5276e06cf880b2ce8f15f6eaa10e47f236)) diff --git a/packages/uikit/README.md b/packages/uikit/README.md new file mode 100644 index 000000000..c19ce2704 --- /dev/null +++ b/packages/uikit/README.md @@ -0,0 +1,43 @@ +# 🥞 Pancake UIkit + +[![Version](https://img.shields.io/npm/v/@pancakeswap/uikit)](https://www.npmjs.com/package/@pancakeswap/uikit) [![Size](https://img.shields.io/bundlephobia/min/@pancakeswap/uikit)](https://www.npmjs.com/package/@pancakeswap/uikit) + +Pancake UIkit is a set of React components and hooks used to build pages on Pancake's apps. It also contains a theme file for dark and light mode. + +## Install + +`yarn add @pancakeswap/uikit` + +***Note**: In case you want to use the older version of the Pancake UIkit, you should install @pancakeswap-libs/uikit, instead, but we recommend using the latest version of the UIkit.* + + +## Setup + +### Theme + +Before using Pancake UIkit, you need to provide the theme file to styled-component. + +``` +import { ThemeProvider } from 'styled-components' +import { light, dark } from '@pancakeswap/uikit' +... +... +``` + +### Reset + +A reset CSS is available as a global styled component. + +``` +import { ResetCSS } from '@pancakeswap/uikit' +... + +``` + +### Types + +This project is built with Typescript and export all the relevant types. + +## How to use the UIkit + +If you want to use components from the UIkit, check the [Storybook documentation](https://pancakeswap.github.io/pancake-uikit/) diff --git a/packages/uikit/babel.config.js b/packages/uikit/babel.config.js new file mode 100644 index 000000000..d93a7a11e --- /dev/null +++ b/packages/uikit/babel.config.js @@ -0,0 +1,4 @@ +module.exports = { + presets: ["@babel/preset-env"], + plugins: ["styled-components"], +}; diff --git a/packages/uikit/jest.config.js b/packages/uikit/jest.config.js new file mode 100644 index 000000000..5c352bee2 --- /dev/null +++ b/packages/uikit/jest.config.js @@ -0,0 +1,9 @@ +module.exports = { + preset: "ts-jest", + testPathIgnorePatterns: ["/node_modules/", "/dist/", "/.storybook/"], + setupFilesAfterEnv: ["/src/setupTests.js"], + transform: { + "\\.(js|jsx)?$": "babel-jest", + "^.+\\.svg$": "/svgTransform.js", + }, +}; diff --git a/packages/uikit/package.json b/packages/uikit/package.json new file mode 100644 index 000000000..b637708c0 --- /dev/null +++ b/packages/uikit/package.json @@ -0,0 +1,74 @@ +{ + "name": "@pancakeswap/uikit", + "version": "0.63.1", + "description": "Set of UI components for pancake projects", + "main": "dist/index.cjs.js", + "module": "dist/index.esm.js", + "types": "dist/index.d.ts", + "files": [ + "dist" + ], + "repository": "https://github.com/pancakeswap/pancake-toolkit/tree/master/packages/pancake-uikit", + "license": "MIT", + "scripts": { + "start": "yarn storybook", + "build": "rm -rf ./dist && rollup -c && tsc -d --emitDeclarationOnly --declarationDir dist", + "watch": "rollup -c -w", + "lint": "eslint 'src/**/*.{js,jsx,ts,tsx}'", + "format:check": "prettier --check --loglevel error 'src/**/*.{js,jsx,ts,tsx}'", + "format:write": "prettier --write 'src/**/*.{js,jsx,ts,tsx}'", + "storybook": "start-storybook -p 6006", + "storybook:build": "build-storybook", + "test": "jest", + "prepublishOnly": "yarn build" + }, + "jest": { + "setupFilesAfterEnv": [ + "/src/setupTests.js" + ] + }, + "devDependencies": { + "@babel/core": "^7.14.3", + "@babel/preset-env": "^7.14.4", + "@testing-library/jest-dom": "^5.11.6", + "@testing-library/react": "^11.2.5", + "@types/lodash": "^4.14.168", + "@types/react-dom": "^17.0.5", + "jest-styled-components": "^7.0.3", + "react": "^17.0.1", + "react-dom": "^17.0.1", + "react-router-dom": "^5.2.0", + "styled-components": "^5.2.0", + "@rollup/plugin-json": "^4.1.0", + "@rollup/plugin-typescript": "^8.2.1", + "@rollup/plugin-url": "^6.0.0", + "@storybook/addon-a11y": "^6.3.6", + "@storybook/addon-actions": "^6.3.6", + "@storybook/addon-essentials": "^6.3.6", + "@storybook/addon-links": "^6.3.6", + "@storybook/react": "^6.3.6", + "@types/react-router-dom": "^5.1.7", + "babel-loader": "^8.2.2", + "babel-plugin-styled-components": "^1.12.0", + "rollup": "^2.47.0", + "themeprovider-storybook": "^1.7.2", + "ts-jest": "^26.5.6", + "tslib": "^2.2.0", + "react-is": "^17.0.2" + }, + "peerDependencies": { + "react": "^17.0.2", + "react-dom": "^17.0.2", + "styled-components": "^5.2.3" + }, + "dependencies": { + "@popperjs/core": "^2.9.2", + "@types/styled-system": "^5.1.10", + "lodash": "^4.17.20", + "react-popper": "^2.2.5", + "styled-system": "^5.1.5" + }, + "publishConfig": { + "access": "public" + } +} diff --git a/packages/uikit/rollup.config.js b/packages/uikit/rollup.config.js new file mode 100644 index 000000000..2d8e7c2dc --- /dev/null +++ b/packages/uikit/rollup.config.js @@ -0,0 +1,12 @@ +import typescript from "@rollup/plugin-typescript"; +import url from "@rollup/plugin-url"; +import pkg from "./package.json"; + +export default { + input: "src/index.ts", + output: [ + { file: pkg.main, format: "cjs" }, + { file: pkg.module, format: "es" }, + ], + plugins: [url(), typescript()], +}; diff --git a/packages/uikit/src/ResetCSS.tsx b/packages/uikit/src/ResetCSS.tsx new file mode 100644 index 000000000..34b736faf --- /dev/null +++ b/packages/uikit/src/ResetCSS.tsx @@ -0,0 +1,117 @@ +import { createGlobalStyle } from "styled-components"; + +const ResetCSS = createGlobalStyle` + /* prettier-ignore */ + html, body, div, span, applet, object, iframe, + h1, h2, h3, h4, h5, h6, p, blockquote, pre, + a, abbr, acronym, address, big, cite, code, + del, dfn, em, img, ins, kbd, q, s, samp, + small, strike, strong, sub, sup, tt, var, + b, u, i, center, + dl, dt, dd, ol, ul, li, + fieldset, form, label, legend, + table, caption, tbody, tfoot, thead, tr, th, td, + article, aside, canvas, details, embed, + figure, figcaption, footer, header, hgroup, + menu, nav, output, ruby, section, summary, + time, mark, audio, video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + vertical-align: baseline; + } + /* HTML5 display-role reset for older browsers */ + /* prettier-ignore */ + article, aside, details, figcaption, figure, + footer, header, hgroup, menu, nav, section { + display: block; + } + body { + line-height: 1; + font-size: 16px; + } + ol, + ul { + list-style: disc; + list-style-position: inside; + } + blockquote, + q { + quotes: none; + } + blockquote:before, + blockquote:after, + q:before, + q:after { + content: ""; + content: none; + } + table { + border-collapse: collapse; + border-spacing: 0; + } + a { + color: inherit; + text-decoration: none; + } + [role="button"] { + cursor: pointer; + } + *, + *::before, + *::after { + box-sizing: border-box; + } + * { + font-family: 'Kanit', sans-serif; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + } + + /* Number */ + input::-webkit-outer-spin-button, + input::-webkit-inner-spin-button { + -webkit-appearance: none; + margin: 0; + } + input[type=number] { + -moz-appearance: textfield; + } + + /* Scrollbar */ + ::-webkit-scrollbar { + width: 8px; + } + ::-webkit-scrollbar-thumb { + background: ${({ theme }) => theme.colors.textSubtle}; + border-radius: 8px; + } + ::-webkit-scrollbar-track { + box-shadow: inset 0 0 5px ${({ theme }) => theme.colors.input}; + border-radius: 10px; + } + + /* Slider */ + input[type=range] { + -webkit-appearance: none; /* Hides the slider so that custom slider can be made */ + width: 100%; /* Specific width is required for Firefox. */ + background: transparent; /* Otherwise white in Chrome */ + } + input[type=range]::-webkit-slider-thumb { + -webkit-appearance: none; + } + input[type=range]:focus { + outline: none; /* Removes the blue border. You should probably do some kind of focus styling for accessibility reasons though. */ + } + input[type=range]::-ms-track { + width: 100%; + cursor: pointer; + /* Hides the slider so custom styles can be added */ + background: transparent; + border-color: transparent; + color: transparent; + } +`; + +export default ResetCSS; diff --git a/packages/uikit/src/__tests__/components/alert.test.tsx b/packages/uikit/src/__tests__/components/alert.test.tsx new file mode 100644 index 000000000..437d3a263 --- /dev/null +++ b/packages/uikit/src/__tests__/components/alert.test.tsx @@ -0,0 +1,102 @@ +import React from "react"; +import { renderWithTheme } from "../../testHelpers"; +import { Alert } from "../../components/Alert"; + +it("renders correctly", () => { + const { asFragment } = renderWithTheme(Description); + + expect(asFragment()).toMatchInlineSnapshot(` + + .c3 { + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + fill: currentColor; + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; + } + + .c5 { + color: #280D5F; + font-size: 16px; + font-weight: 600; + line-height: 1.5; + } + + .c6 { + color: #280D5F; + font-size: 16px; + font-weight: 400; + line-height: 1.5; + } + + .c0 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + } + + .c2 { + background-color: #7645D9; + border-radius: 16px 0 0 16px; + color: #FFFFFF; + padding: 12px; + } + + .c4 { + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + padding-bottom: 12px; + padding-left: 12px; + padding-right: 12px; + padding-top: 12px; + } + + .c1 { + position: relative; + background-color: #FFFFFF; + border-radius: 16px; + box-shadow: 0px 20px 36px -8px rgba(14,14,44,0.1),0px 1px 1px rgba(0,0,0,0.05); + } + +
+
+ + + +
+
+
+ Alert title +
+

+ Description +

+
+
+ + `); +}); diff --git a/packages/uikit/src/__tests__/components/balanceinput.test.tsx b/packages/uikit/src/__tests__/components/balanceinput.test.tsx new file mode 100644 index 000000000..241cc04ec --- /dev/null +++ b/packages/uikit/src/__tests__/components/balanceinput.test.tsx @@ -0,0 +1,608 @@ +import React from "react"; +import { renderWithTheme } from "../../testHelpers"; +import BalanceInput from "../../components/BalanceInput/BalanceInput"; + +const handleChange = jest.fn(); + +it("renders correctly", () => { + const { asFragment } = renderWithTheme(); + expect(asFragment()).toMatchInlineSnapshot(` + + .c1 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; + } + + .c2 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + } + + .c5 { + color: #7A6EAA; + font-size: 12px; + font-weight: 400; + line-height: 1.5; + font-size: 12px; + text-align: right; + } + + .c3 { + background-color: #eeeaf4; + border: 0; + border-radius: 16px; + box-shadow: inset 0px 2px 2px -1px rgba(74,74,104,0.1); + color: #280D5F; + display: block; + font-size: 16px; + height: 40px; + outline: 0; + padding: 0 16px; + width: 100%; + border: 1px solid #d7caec; + } + + .c3::-webkit-input-placeholder { + color: #7A6EAA; + } + + .c3::-moz-placeholder { + color: #7A6EAA; + } + + .c3:-ms-input-placeholder { + color: #7A6EAA; + } + + .c3::placeholder { + color: #7A6EAA; + } + + .c3:disabled { + background-color: #E9EAEB; + box-shadow: none; + color: #BDC2C4; + cursor: not-allowed; + } + + .c3:focus:not(:disabled) { + box-shadow: 0px 0px 0px 1px #7645D9,0px 0px 0px 4px rgba(118,69,217,0.6); + } + + .c0 { + background-color: #eeeaf4; + border: 1px solid #d7caec; + border-radius: 16px; + box-shadow: inset 0px 2px 2px -1px rgba(74,74,104,0.1); + padding: 8px 16px; + } + + .c4 { + background: transparent; + border-radius: 0; + box-shadow: none; + padding-left: 0; + padding-right: 0; + text-align: right; + border: none; + } + + .c4::-webkit-input-placeholder { + color: #7A6EAA; + } + + .c4::-moz-placeholder { + color: #7A6EAA; + } + + .c4:-ms-input-placeholder { + color: #7A6EAA; + } + + .c4::placeholder { + color: #7A6EAA; + } + + .c4:focus:not(:disabled) { + box-shadow: none; + } + +
+
+
+
+ +
+
+ 15 USD +
+
+
+
+ + `); +}); + +it("renders correctly with unit prop", () => { + const { asFragment } = renderWithTheme( + + ); + expect(asFragment()).toMatchInlineSnapshot(` + + .c1 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; + } + + .c2 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + } + + .c5 { + color: #280D5F; + font-size: 16px; + font-weight: 400; + line-height: 1.5; + } + + .c7 { + color: #7A6EAA; + font-size: 12px; + font-weight: 400; + line-height: 1.5; + font-size: 12px; + text-align: right; + } + + .c3 { + background-color: #eeeaf4; + border: 0; + border-radius: 16px; + box-shadow: inset 0px 2px 2px -1px rgba(74,74,104,0.1); + color: #280D5F; + display: block; + font-size: 16px; + height: 40px; + outline: 0; + padding: 0 16px; + width: 100%; + border: 1px solid #d7caec; + } + + .c3::-webkit-input-placeholder { + color: #7A6EAA; + } + + .c3::-moz-placeholder { + color: #7A6EAA; + } + + .c3:-ms-input-placeholder { + color: #7A6EAA; + } + + .c3::placeholder { + color: #7A6EAA; + } + + .c3:disabled { + background-color: #E9EAEB; + box-shadow: none; + color: #BDC2C4; + cursor: not-allowed; + } + + .c3:focus:not(:disabled) { + box-shadow: 0px 0px 0px 1px #7645D9,0px 0px 0px 4px rgba(118,69,217,0.6); + } + + .c6 { + margin-left: 4px; + text-align: right; + color: #7A6EAA; + white-space: nowrap; + } + + .c0 { + background-color: #eeeaf4; + border: 1px solid #d7caec; + border-radius: 16px; + box-shadow: inset 0px 2px 2px -1px rgba(74,74,104,0.1); + padding: 8px 16px; + } + + .c4 { + background: transparent; + border-radius: 0; + box-shadow: none; + padding-left: 0; + padding-right: 0; + text-align: right; + border: none; + } + + .c4::-webkit-input-placeholder { + color: #7A6EAA; + } + + .c4::-moz-placeholder { + color: #7A6EAA; + } + + .c4:-ms-input-placeholder { + color: #7A6EAA; + } + + .c4::placeholder { + color: #7A6EAA; + } + + .c4:focus:not(:disabled) { + box-shadow: none; + } + +
+
+
+
+ +
+ CAKE +
+
+
+ 15 USD +
+
+
+
+ + `); +}); + +it("renders correctly with unit prop and switchEditingUnits", () => { + const { asFragment } = renderWithTheme( + + ); + expect(asFragment()).toMatchInlineSnapshot(` + + .c8 { + padding-left: 12px; + } + + .c1 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; + } + + .c2 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + } + + .c12 { + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + fill: #7A6EAA; + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; + } + + .c5 { + color: #280D5F; + font-size: 16px; + font-weight: 400; + line-height: 1.5; + } + + .c7 { + color: #7A6EAA; + font-size: 12px; + font-weight: 400; + line-height: 1.5; + font-size: 12px; + text-align: right; + } + + .c3 { + background-color: #eeeaf4; + border: 0; + border-radius: 16px; + box-shadow: inset 0px 2px 2px -1px rgba(74,74,104,0.1); + color: #280D5F; + display: block; + font-size: 16px; + height: 40px; + outline: 0; + padding: 0 16px; + width: 100%; + border: 1px solid #d7caec; + } + + .c3::-webkit-input-placeholder { + color: #7A6EAA; + } + + .c3::-moz-placeholder { + color: #7A6EAA; + } + + .c3:-ms-input-placeholder { + color: #7A6EAA; + } + + .c3::placeholder { + color: #7A6EAA; + } + + .c3:disabled { + background-color: #E9EAEB; + box-shadow: none; + color: #BDC2C4; + cursor: not-allowed; + } + + .c3:focus:not(:disabled) { + box-shadow: 0px 0px 0px 1px #7645D9,0px 0px 0px 4px rgba(118,69,217,0.6); + } + + .c9 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + border: 0; + border-radius: 16px; + box-shadow: 0px -1px 0px 0px rgba(14,14,44,0.4) inset; + cursor: pointer; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + font-family: inherit; + font-size: 16px; + font-weight: 600; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + -webkit-letter-spacing: 0.03em; + -moz-letter-spacing: 0.03em; + -ms-letter-spacing: 0.03em; + letter-spacing: 0.03em; + line-height: 1; + opacity: 1; + outline: 0; + -webkit-transition: background-color 0.2s,opacity 0.2s; + transition: background-color 0.2s,opacity 0.2s; + height: 32px; + padding: 0 16px; + background-color: transparent; + color: #1FC7D4; + box-shadow: none; + } + + .c9:hover:not(:disabled):not(.pancake-button--disabled):not(.pancake-button--disabled):not(:active) { + opacity: 0.65; + } + + .c9:active:not(:disabled):not(.pancake-button--disabled):not(.pancake-button--disabled) { + opacity: 0.85; + -webkit-transform: translateY(1px); + -ms-transform: translateY(1px); + transform: translateY(1px); + box-shadow: none; + } + + .c9:disabled, + .c9.pancake-button--disabled { + background-color: #E9EAEB; + border-color: #E9EAEB; + box-shadow: none; + color: #BDC2C4; + cursor: not-allowed; + } + + .c10 { + padding: 0; + width: 32px; + } + + .c11 { + width: 16px; + } + + .c6 { + margin-left: 4px; + text-align: right; + color: #7A6EAA; + white-space: nowrap; + } + + .c0 { + background-color: #eeeaf4; + border: 1px solid #d7caec; + border-radius: 16px; + box-shadow: inset 0px 2px 2px -1px rgba(74,74,104,0.1); + padding: 8px 16px; + } + + .c4 { + background: transparent; + border-radius: 0; + box-shadow: none; + padding-left: 0; + padding-right: 0; + text-align: right; + border: none; + } + + .c4::-webkit-input-placeholder { + color: #7A6EAA; + } + + .c4::-moz-placeholder { + color: #7A6EAA; + } + + .c4:-ms-input-placeholder { + color: #7A6EAA; + } + + .c4::placeholder { + color: #7A6EAA; + } + + .c4:focus:not(:disabled) { + box-shadow: none; + } + +
+
+
+
+ +
+ CAKE +
+
+
+ 15 USD +
+
+
+ +
+
+
+ + `); +}); diff --git a/packages/uikit/src/__tests__/components/breadcrumbs.test.tsx b/packages/uikit/src/__tests__/components/breadcrumbs.test.tsx new file mode 100644 index 000000000..718ecc73b --- /dev/null +++ b/packages/uikit/src/__tests__/components/breadcrumbs.test.tsx @@ -0,0 +1,37 @@ +import React from "react"; +import { renderWithTheme } from "../../testHelpers"; +import Breadcrumbs from "../../components/Breadcrumbs/Breadcrumbs"; + +it("renders correctly", () => { + const { asFragment } = renderWithTheme(Link); + expect(asFragment()).toMatchInlineSnapshot(` + + .c0 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + list-style-type: none; + } + + .c0 a { + color: #1FC7D4; + } + + .c0 a:hover { + color: #53DEE9; + } + +
    + + `); +}); diff --git a/packages/uikit/src/__tests__/components/button.test.tsx b/packages/uikit/src/__tests__/components/button.test.tsx new file mode 100644 index 000000000..ee28e9ff4 --- /dev/null +++ b/packages/uikit/src/__tests__/components/button.test.tsx @@ -0,0 +1,73 @@ +import React from "react"; +import { renderWithTheme } from "../../testHelpers"; +import Button from "../../components/Button/Button"; + +it("renders correctly", () => { + const { asFragment } = renderWithTheme(); + expect(asFragment()).toMatchInlineSnapshot(` + + .c0 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + border: 0; + border-radius: 16px; + box-shadow: 0px -1px 0px 0px rgba(14,14,44,0.4) inset; + cursor: pointer; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + font-family: inherit; + font-size: 16px; + font-weight: 600; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + -webkit-letter-spacing: 0.03em; + -moz-letter-spacing: 0.03em; + -ms-letter-spacing: 0.03em; + letter-spacing: 0.03em; + line-height: 1; + opacity: 1; + outline: 0; + -webkit-transition: background-color 0.2s,opacity 0.2s; + transition: background-color 0.2s,opacity 0.2s; + height: 48px; + padding: 0 24px; + background-color: #1FC7D4; + color: white; + } + + .c0:hover:not(:disabled):not(.pancake-button--disabled):not(.pancake-button--disabled):not(:active) { + opacity: 0.65; + } + + .c0:active:not(:disabled):not(.pancake-button--disabled):not(.pancake-button--disabled) { + opacity: 0.85; + -webkit-transform: translateY(1px); + -ms-transform: translateY(1px); + transform: translateY(1px); + box-shadow: none; + } + + .c0:disabled, + .c0.pancake-button--disabled { + background-color: #E9EAEB; + border-color: #E9EAEB; + box-shadow: none; + color: #BDC2C4; + cursor: not-allowed; + } + + + + `); +}); diff --git a/packages/uikit/src/__tests__/components/buttonmenu.test.tsx b/packages/uikit/src/__tests__/components/buttonmenu.test.tsx new file mode 100644 index 000000000..95f2f93d7 --- /dev/null +++ b/packages/uikit/src/__tests__/components/buttonmenu.test.tsx @@ -0,0 +1,128 @@ +import React from "react"; +import { renderWithTheme } from "../../testHelpers"; +import ButtonMenu from "../../components/ButtonMenu/ButtonMenu"; +import ButtonMenuItem from "../../components/ButtonMenu/ButtonMenuItem"; + +const handleClick = jest.fn(); + +it("renders correctly", () => { + const { asFragment } = renderWithTheme( + + Item 1 + Item 2 + + ); + expect(asFragment()).toMatchInlineSnapshot(` + + .c0 { + background-color: #EFF4F5; + border-radius: 16px; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + border: 1px solid #E9EAEB; + width: auto; + } + + .c0 > button, + .c0 > a { + -webkit-flex: auto; + -ms-flex: auto; + flex: auto; + } + + .c0 > button + button, + .c0 > a + a { + margin-left: 2px; + } + + .c0 > button, + .c0 a { + box-shadow: none; + } + + .c1 { + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + border: 0; + border-radius: 16px; + box-shadow: 0px -1px 0px 0px rgba(14,14,44,0.4) inset; + cursor: pointer; + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + font-family: inherit; + font-size: 16px; + font-weight: 600; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; + -webkit-letter-spacing: 0.03em; + -moz-letter-spacing: 0.03em; + -ms-letter-spacing: 0.03em; + letter-spacing: 0.03em; + line-height: 1; + opacity: 1; + outline: 0; + -webkit-transition: background-color 0.2s,opacity 0.2s; + transition: background-color 0.2s,opacity 0.2s; + height: 48px; + padding: 0 24px; + background-color: #1FC7D4; + color: white; + } + + .c1:hover:not(:disabled):not(.pancake-button--disabled):not(.pancake-button--disabled):not(:active) { + opacity: 0.65; + } + + .c1:active:not(:disabled):not(.pancake-button--disabled):not(.pancake-button--disabled) { + opacity: 0.85; + -webkit-transform: translateY(1px); + -ms-transform: translateY(1px); + transform: translateY(1px); + box-shadow: none; + } + + .c1:disabled, + .c1.pancake-button--disabled { + background-color: #E9EAEB; + border-color: #E9EAEB; + box-shadow: none; + color: #BDC2C4; + cursor: not-allowed; + } + + .c2 { + background-color: transparent; + color: #1FC7D4; + } + + .c2:hover:not(:disabled):not(:active) { + background-color: transparent; + } + +
    + + +
    +     + `); +}); diff --git a/packages/uikit/src/__tests__/components/card.test.tsx b/packages/uikit/src/__tests__/components/card.test.tsx new file mode 100644 index 000000000..f3cf81fe0 --- /dev/null +++ b/packages/uikit/src/__tests__/components/card.test.tsx @@ -0,0 +1,72 @@ +import React from "react"; +import { renderWithTheme } from "../../testHelpers"; +import { Card, CardBody, CardHeader, CardFooter } from "../../components/Card"; + +it("renders correctly", () => { + const { asFragment } = renderWithTheme( + + Header + Body + Footer + + ); + expect(asFragment()).toMatchInlineSnapshot(` + + .c0 { + background: #E7E3EB; + border-radius: 24px; + color: #280D5F; + overflow: hidden; + position: relative; + padding: 1px 1px 3px 1px; + } + + .c1 { + width: 100%; + height: 100%; + overflow: inherit; + background: #FFFFFF; + border-radius: 24px; + } + + .c3 { + padding: 24px; + } + + .c2 { + background: linear-gradient(111.68deg,#F2ECF2 0%,#E8F2F6 100%); + border-radius: 24px 24px 0 0; + padding: 24px; + } + + .c4 { + border-top: 1px solid #E7E3EB; + padding: 24px; + } + +
    +
    +
    + Header +
    +
    + Body +
    +
    + Footer +
    +
    +
    +     + `); +}); diff --git a/packages/uikit/src/__tests__/components/checkbox.test.tsx b/packages/uikit/src/__tests__/components/checkbox.test.tsx new file mode 100644 index 000000000..a6c6c8a98 --- /dev/null +++ b/packages/uikit/src/__tests__/components/checkbox.test.tsx @@ -0,0 +1,79 @@ +import React from "react"; +import { renderWithTheme } from "../../testHelpers"; +import Checkbox from "../../components/Checkbox/Checkbox"; + +const handleChange = jest.fn(); + +it("renders correctly", () => { + const { asFragment } = renderWithTheme(); + expect(asFragment()).toMatchInlineSnapshot(` + + .c0 { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + overflow: hidden; + cursor: pointer; + position: relative; + display: inline-block; + height: 32px; + width: 32px; + vertical-align: middle; + -webkit-transition: background-color 0.2s ease-in-out; + transition: background-color 0.2s ease-in-out; + border: 0; + border-radius: 8px; + background-color: #eeeaf4; + box-shadow: inset 0px 2px 2px -1px rgba(74,74,104,0.1); + } + + .c0:after { + content: ""; + position: absolute; + border-bottom: 2px solid; + border-left: 2px solid; + border-color: transparent; + top: 30%; + left: 0; + right: 0; + width: 50%; + height: 25%; + margin: auto; + -webkit-transform: rotate(-50deg); + -ms-transform: rotate(-50deg); + transform: rotate(-50deg); + -webkit-transition: border-color 0.2s ease-in-out; + transition: border-color 0.2s ease-in-out; + } + + .c0:hover:not(:disabled):not(:checked) { + box-shadow: 0px 0px 0px 1px #7645D9,0px 0px 0px 4px rgba(118,69,217,0.6); + } + + .c0:focus { + outline: none; + box-shadow: 0px 0px 0px 1px #7645D9,0px 0px 0px 4px rgba(118,69,217,0.6); + } + + .c0:checked { + background-color: #31D0AA; + } + + .c0:checked:after { + border-color: white; + } + + .c0:disabled { + cursor: default; + opacity: 0.6; + } + + + + `); +}); diff --git a/packages/uikit/src/__tests__/components/dropdown.test.tsx b/packages/uikit/src/__tests__/components/dropdown.test.tsx new file mode 100644 index 000000000..b8b6add9e --- /dev/null +++ b/packages/uikit/src/__tests__/components/dropdown.test.tsx @@ -0,0 +1,56 @@ +import React from "react"; +import { renderWithTheme } from "../../testHelpers"; +import Dropdown from "../../components/Dropdown/Dropdown"; + +it("renders correctly", () => { + const { asFragment } = renderWithTheme(target} />); + expect(asFragment()).toMatchInlineSnapshot(` + + .c2 { + width: -webkit-max-content; + width: -moz-max-content; + width: max-content; + display: none; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + position: absolute; + -webkit-transform: translate(-50%,0); + -ms-transform: translate(-50%,0); + transform: translate(-50%,0); + left: 50%; + bottom: auto; + background-color: #FFFFFF; + box-shadow: 0px 2px 12px -8px rgba(25,19,38,0.1),0px 1px 1px rgba(25,19,38,0.05); + padding: 16px; + max-height: 400px; + overflow-y: auto; + z-index: 10; + border-radius: 4px; + } + + .c0 { + position: relative; + } + + .c0:hover .c1, + .c0:focus-within .c1 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + } + +
    +
    + target +
    +
    +
    + + `); +}); diff --git a/packages/uikit/src/__tests__/components/fallingbunnies.test.tsx b/packages/uikit/src/__tests__/components/fallingbunnies.test.tsx new file mode 100644 index 000000000..344a82355 --- /dev/null +++ b/packages/uikit/src/__tests__/components/fallingbunnies.test.tsx @@ -0,0 +1,127 @@ +import React from "react"; +import { renderWithTheme } from "../../testHelpers"; +import FallingBunnies from "../../components/FallingBunnies/FallingBunnies"; + +beforeEach(() => { + jest.spyOn(global.Math, "random").mockReturnValue(0.5); +}); + +afterEach(() => { + jest.spyOn(global.Math, "random").mockRestore(); +}); + +it("renders correctly", () => { + const { asFragment } = renderWithTheme(); + expect(asFragment()).toMatchInlineSnapshot(` + + .c1 { + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + fill: #280D5F; + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; + } + + .c0 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + position: fixed; + top: 0; + left: 50vw; + -webkit-transform: translate3d(0,-100%,0); + -ms-transform: translate3d(0,-100%,0); + transform: translate3d(0,-100%,0); + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + pointer-events: none; + z-index: 99999; + -webkit-animation-name: dphWuA; + animation-name: dphWuA; + -webkit-animation-duration: 10s; + animation-duration: 10s; + -webkit-animation-timing-function: linear; + animation-timing-function: linear; + -webkit-animation-iteration-count: infinite; + animation-iteration-count: infinite; + -webkit-animation-play-state: running; + animation-play-state: running; + } + + .c0:nth-child(5n + 5) { + -webkit-animation-delay: 1.3s; + animation-delay: 1.3s; + } + + .c0:nth-child(3n + 2) { + -webkit-animation-delay: 1.5s; + animation-delay: 1.5s; + } + + .c0:nth-child(2n + 5) { + -webkit-animation-delay: 1.7s; + animation-delay: 1.7s; + } + + .c0:nth-child(3n + 10) { + -webkit-animation-delay: 2.7s; + animation-delay: 2.7s; + } + + .c0:nth-child(7n + 2) { + -webkit-animation-delay: 3.5s; + animation-delay: 3.5s; + } + + .c0:nth-child(4n + 5) { + -webkit-animation-delay: 5.5s; + animation-delay: 5.5s; + } + + .c0:nth-child(3n + 7) { + -webkit-animation-delay: 8s; + animation-delay: 8s; + } + +
    +
    + + + + + + +
    +
    +     + `); +}); diff --git a/packages/uikit/src/__tests__/components/flex.test.tsx b/packages/uikit/src/__tests__/components/flex.test.tsx new file mode 100644 index 000000000..1de21f9c1 --- /dev/null +++ b/packages/uikit/src/__tests__/components/flex.test.tsx @@ -0,0 +1,23 @@ +import React from "react"; +import { renderWithTheme } from "../../testHelpers"; +import Flex from "../../components/Box/Flex"; + +it("renders correctly", () => { + const { asFragment } = renderWithTheme(flex); + expect(asFragment()).toMatchInlineSnapshot(` + + .c0 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + } + +
    + flex +
    +     + `); +}); diff --git a/packages/uikit/src/__tests__/components/heading.test.tsx b/packages/uikit/src/__tests__/components/heading.test.tsx new file mode 100644 index 000000000..54802a564 --- /dev/null +++ b/packages/uikit/src/__tests__/components/heading.test.tsx @@ -0,0 +1,36 @@ +import React from "react"; +import { renderWithTheme } from "../../testHelpers"; +import Heading from "../../components/Heading/Heading"; + +it("renders correctly", () => { + const { asFragment } = renderWithTheme(Title); + expect(asFragment()).toMatchInlineSnapshot(` + + .c0 { + color: #280D5F; + font-size: 16px; + font-weight: 600; + line-height: 1.5; + } + + .c1 { + font-size: 20px; + font-weight: 600; + line-height: 1.1; + } + + @media screen and (min-width:968px) { + .c1 { + font-size: 20px; + } + } + +

    + Title +

    +     + `); +}); diff --git a/packages/uikit/src/__tests__/components/input.test.tsx b/packages/uikit/src/__tests__/components/input.test.tsx new file mode 100644 index 000000000..1cfd55e4f --- /dev/null +++ b/packages/uikit/src/__tests__/components/input.test.tsx @@ -0,0 +1,61 @@ +import React from "react"; +import { renderWithTheme } from "../../testHelpers"; +import Input from "../../components/Input/Input"; + +const handleChange = jest.fn(); + +it("renders correctly", () => { + const { asFragment } = renderWithTheme(); + expect(asFragment()).toMatchInlineSnapshot(` + + .c0 { + background-color: #eeeaf4; + border: 0; + border-radius: 16px; + box-shadow: inset 0px 2px 2px -1px rgba(74,74,104,0.1); + color: #280D5F; + display: block; + font-size: 16px; + height: 40px; + outline: 0; + padding: 0 16px; + width: 100%; + border: 1px solid #d7caec; + } + + .c0::-webkit-input-placeholder { + color: #7A6EAA; + } + + .c0::-moz-placeholder { + color: #7A6EAA; + } + + .c0:-ms-input-placeholder { + color: #7A6EAA; + } + + .c0::placeholder { + color: #7A6EAA; + } + + .c0:disabled { + background-color: #E9EAEB; + box-shadow: none; + color: #BDC2C4; + cursor: not-allowed; + } + + .c0:focus:not(:disabled) { + box-shadow: 0px 0px 0px 1px #7645D9,0px 0px 0px 4px rgba(118,69,217,0.6); + } + + + + `); +}); diff --git a/packages/uikit/src/__tests__/components/layouts.test.tsx b/packages/uikit/src/__tests__/components/layouts.test.tsx new file mode 100644 index 000000000..ff9002e58 --- /dev/null +++ b/packages/uikit/src/__tests__/components/layouts.test.tsx @@ -0,0 +1,99 @@ +import React from "react"; +import { renderWithTheme } from "../../testHelpers"; +import { BaseLayout, CardsLayout } from "../../components/Layouts"; + +it("renders base layout correctly", () => { + const { asFragment } = renderWithTheme(basic layout); + expect(asFragment()).toMatchInlineSnapshot(` + + .c0 { + display: grid; + } + + .c1 { + grid-template-columns: repeat(6,1fr); + grid-gap: 16px; + } + + @media screen and (min-width:576px) { + .c1 { + grid-template-columns: repeat(8,1fr); + grid-gap: 24px; + } + } + + @media screen and (min-width:852px) { + .c1 { + grid-template-columns: repeat(12,1fr); + grid-gap: 24px; + } + } + + @media screen and (min-width:968px) { + .c1 { + grid-template-columns: repeat(12,1fr); + grid-gap: 32px; + } + } + +
    + basic layout +
    +     + `); +}); + +it("renders card layout correctly", () => { + const { asFragment } = renderWithTheme(cards layout); + expect(asFragment()).toMatchInlineSnapshot(` + + .c0 { + display: grid; + } + + .c1 { + grid-template-columns: repeat(6,1fr); + grid-gap: 16px; + } + + .c2 > div { + grid-column: span 6; + } + + @media screen and (min-width:576px) { + .c1 { + grid-template-columns: repeat(8,1fr); + grid-gap: 24px; + } + } + + @media screen and (min-width:852px) { + .c1 { + grid-template-columns: repeat(12,1fr); + grid-gap: 24px; + } + } + + @media screen and (min-width:968px) { + .c1 { + grid-template-columns: repeat(12,1fr); + grid-gap: 32px; + } + } + + @media screen and (min-width:576px) { + .c2 > div { + grid-column: span 4; + } + } + +
    + cards layout +
    +     + `); +}); diff --git a/packages/uikit/src/__tests__/components/link.test.tsx b/packages/uikit/src/__tests__/components/link.test.tsx new file mode 100644 index 000000000..7ad6a94bb --- /dev/null +++ b/packages/uikit/src/__tests__/components/link.test.tsx @@ -0,0 +1,109 @@ +import React from "react"; +import { renderWithTheme } from "../../testHelpers"; +import { Link, LinkExternal } from "../../components/Link"; + +it("renders link correctly", () => { + const { asFragment } = renderWithTheme(Link); + expect(asFragment()).toMatchInlineSnapshot(` + + .c0 { + color: #1FC7D4; + font-size: 16px; + font-weight: 600; + line-height: 1.5; + } + + .c1 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + width: -webkit-fit-content; + width: -moz-fit-content; + width: fit-content; + } + + .c1:hover { + -webkit-text-decoration: underline; + text-decoration: underline; + } + + + Link + + + `); +}); + +it("renders link external link correctly", () => { + const { asFragment } = renderWithTheme(Link); + expect(asFragment()).toMatchInlineSnapshot(` + + .c0 { + color: #1FC7D4; + font-size: 16px; + font-weight: 600; + line-height: 1.5; + } + + .c1 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-align-items: center; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + width: -webkit-fit-content; + width: -moz-fit-content; + width: fit-content; + } + + .c1:hover { + -webkit-text-decoration: underline; + text-decoration: underline; + } + + .c2 { + -webkit-align-self: center; + -ms-flex-item-align: center; + align-self: center; + fill: #1FC7D4; + -webkit-flex-shrink: 0; + -ms-flex-negative: 0; + flex-shrink: 0; + margin-left: 4px; + } + + + Link + + + + + + `); +}); diff --git a/packages/uikit/src/__tests__/components/notificationdot.test.tsx b/packages/uikit/src/__tests__/components/notificationdot.test.tsx new file mode 100644 index 000000000..e4ff8b558 --- /dev/null +++ b/packages/uikit/src/__tests__/components/notificationdot.test.tsx @@ -0,0 +1,45 @@ +import React from "react"; +import { renderWithTheme } from "../../testHelpers"; +import NotificationDot from "../../components/NotificationDot/NotificationDot"; + +it("renders correctly", () => { + const { asFragment } = renderWithTheme( + +
    + + ); + expect(asFragment()).toMatchInlineSnapshot(` + + .c0 { + display: -webkit-inline-box; + display: -webkit-inline-flex; + display: -ms-inline-flexbox; + display: inline-flex; + position: relative; + } + + .c1 { + display: none; + position: absolute; + top: 0; + right: 0; + width: 10px; + height: 10px; + pointer-events: none; + border: 2px solid #FFFFFF; + border-radius: 50%; + background-color: #ED4B9E; + } + + +
    + + + + `); +}); diff --git a/packages/uikit/src/__tests__/components/overlay.test.tsx b/packages/uikit/src/__tests__/components/overlay.test.tsx new file mode 100644 index 000000000..81e4dc3e2 --- /dev/null +++ b/packages/uikit/src/__tests__/components/overlay.test.tsx @@ -0,0 +1,25 @@ +import React from "react"; +import { renderWithTheme } from "../../testHelpers"; +import { Overlay } from "../../components/Overlay"; + +it("renders correctly", () => { + const { asFragment } = renderWithTheme(); + expect(asFragment()).toMatchInlineSnapshot(` + + .c0 { + position: fixed; + top: 0px; + left: 0px; + width: 100%; + height: 100%; + background-color: #280D5F99; + z-index: 20; + } + +