diff --git a/.circleci/config.yml b/.circleci/config.yml index 4934881984..4aeb995872 100644 --- a/.circleci/config.yml +++ b/.circleci/config.yml @@ -7,7 +7,7 @@ orbs: parameters: cache_version: type: string - default: v5 + default: v6 nodejs_base_image: type: string default: 'cimg/node:20.17.0' @@ -39,16 +39,17 @@ jobs: executor: nodejs steps: - *checkout + - *restore_node_modules - run: name: Run yarn install and save node modules command: yarn install - - *restore_node_modules - save_cache: key: << pipeline.parameters.cache_version >>-yarn-{{ checksum "/home/circleci/welcome-ui/yarn.lock" }} paths: - ~/.cache/yarn - ~/welcome-ui/node_modules - ~/welcome-ui/website/node_modules + - ~/welcome-ui/lib/node_modules vulnerabilities_yarn: <<: *default @@ -60,25 +61,21 @@ jobs: - attach_workspace: at: ~/welcome-ui - run: - name: Critical vulnerabilities (yarn audit), lib versions and missing deps - command: yarn check:audit && yarn check:deps + name: Critical vulnerabilities (yarn audit) + command: yarn check:audit build: <<: *default executor: nodejs - resource_class: xlarge + resource_class: medium steps: - *checkout - *restore_node_modules - - run: yarn icons:build - run: yarn build - persist_to_workspace: root: ~/welcome-ui paths: - - packages/**/dist - - packages/Themes/**/dist - - icons/dist - - packages/IconFont/fonts + - lib/dist lint: <<: *default @@ -99,9 +96,9 @@ jobs: - *restore_node_modules - attach_workspace: at: ~/welcome-ui - - run: yarn jest --detectOpenHandles $(circleci tests glob "./packages/**/*.test.{ts,js,tsx}" | circleci tests split | xargs) + - run: cd lib && yarn jest --detectOpenHandles $(circleci tests glob "./**/*.test.{ts,js,tsx}" | circleci tests split | xargs) - build_and_release_icon_font: + release_icon_font: <<: *default executor: nodejs steps: @@ -109,25 +106,22 @@ jobs: - *restore_node_modules - attach_workspace: at: ~/welcome-ui - - run: yarn icons:collect --force - - run: yarn webfont:build - run: name: Prepare font hash command: | - echo "export ICON_FONT_HASH=$(sha1sum packages/IconFont/fonts/welcome-icon-font.woff2 | awk '{ print $1 }')" >> $BASH_ENV + echo "export ICON_FONT_HASH=$(sha1sum lib/src/components/IconsFont/fonts/welcome-icon-font.woff2 | awk '{ print $1 }')" >> $BASH_ENV source $BASH_ENV - yarn build:core - aws-cli/setup: aws_access_key_id: AWS_ACCESS_KEY_ID aws_secret_access_key: AWS_SECRET_ACCESS_KEY region: ${AWS_REGION} - aws-s3/sync: - from: packages/IconFont/fonts + from: lib/src/components/IconsFont/fonts to: s3://welcome-ui/public/fonts/icon-font/$ICON_FONT_HASH arguments: | --cache-control "public, max-age=31536000" --exclude "*" --include "welcome-icon-font.woff" --include "welcome-icon-font.woff2" --metadata GitCommit=$CIRCLE_SHA1 --delete - aws-s3/sync: - from: packages/IconFont/fonts + from: lib/src/components/IconsFont/fonts to: s3://wttj-production/fonts/icon-font/$ICON_FONT_HASH arguments: | --cache-control "public, max-age=31536000" --exclude "*" --include "welcome-icon-font.woff" --include "welcome-icon-font.woff2" --metadata GitCommit=$CIRCLE_SHA1 --delete @@ -141,7 +135,7 @@ jobs: - *restore_node_modules - attach_workspace: at: ~/welcome-ui - - run: yarn website:build + - run: yarn build:website - persist_to_workspace: root: ~/welcome-ui paths: @@ -198,7 +192,7 @@ jobs: at: ~/welcome-ui - run: name: build w/ prefix - command: VERSION=$CIRCLE_BRANCH yarn website:build + command: VERSION=$CIRCLE_BRANCH yarn build:website - aws-cli/setup: aws_access_key_id: AWS_ACCESS_KEY_ID aws_secret_access_key: AWS_SECRET_ACCESS_KEY @@ -210,34 +204,43 @@ jobs: --metadata GitCommit=$CIRCLE_SHA1 --delete release: - <<: *default executor: nodejs steps: - *checkout - - *restore_node_modules - attach_workspace: at: ~/welcome-ui - run: name: Login to registry command: echo "//registry.npmjs.org/:_authToken=$NPM_TOKEN" > ~/.npmrc - run: - name: Release to npm - command: yarn lerna publish from-git --yes --no-verify-access + name: publish + command: cd /home/circleci/welcome-ui/lib && npm publish --registry https://registry.npmjs.org - prerelease: - <<: *default + alpha_release: executor: nodejs steps: - *checkout - - *restore_node_modules - attach_workspace: at: ~/welcome-ui - run: name: Login to registry command: echo "//registry.npmjs.org/:_authToken=$NPM_TOKEN" > ~/.npmrc - run: - name: Release to npm - command: yarn lerna publish from-git --yes --no-verify-access --dist-tag next + name: publish + command: cd /home/circleci/welcome-ui/lib && npm publish --tag beta --registry https://registry.npmjs.org + + dev_release: + executor: nodejs + steps: + - *checkout + - attach_workspace: + at: ~/welcome-ui + - run: + name: Login to registry + command: echo "//registry.npmjs.org/:_authToken=$NPM_TOKEN" > ~/.npmrc + - run: + name: publish + command: node /home/circleci/welcome-ui/.dev-releases/publish.mjs workflows: btd: @@ -263,77 +266,100 @@ workflows: tags: only: /.*/ requires: - - build + - checkout - test: filters: tags: only: /.*/ requires: - - build - - build_and_release_icon_font: + - checkout + - release_icon_font: filters: tags: only: /.*/ context: - aws requires: - - lint - - test + - checkout - website_build: filters: tags: only: /.*/ requires: - - build + - checkout - website_deploy_preview: context: - aws - welcome-ui requires: + - lint + - test - website_build - - build_and_release_icon_font + - release_icon_font - website_deploy_prod: filters: branches: ignore: /.*/ tags: - only: /v6.(\d\d|\d).(\d\d|\d)/ + only: /v7.(\d\d|\d).(\d\d|\d)/ context: - aws - welcome-ui requires: + - lint + - test - website_build - - build_and_release_icon_font + - release_icon_font - previous_website_versions_build_deploy_prod: filters: # should add branches here to keep previous doc version of future majors branches: - only: /v3|v4|v5/ + only: /v3|v4|v5|v6/ context: - aws - welcome-ui requires: - - build - - build_and_release_icon_font + - lint + - test + - website_build + - release_icon_font - release: context: - welcome-ui requires: - build - - build_and_release_icon_font + - lint + - test + - website_build + - release_icon_font filters: branches: ignore: /.*/ tags: only: /v\d.(\d\d|\d).(\d\d|\d)/ - - prerelease: + - alpha_release: context: - welcome-ui requires: - build - - build_and_release_icon_font + - lint + - test + - release_icon_font filters: branches: ignore: /.*/ tags: only: /v\d.(\d\d|\d).(\d\d|\d)-.*/ + - dev_release: + context: + - welcome-ui + requires: + - build + - lint + - test + - release_icon_font + filters: + branches: + ignore: /.*/ + tags: + only: /0.0.0-dev...*/ diff --git a/.depcheckrc.json b/.depcheckrc.json deleted file mode 100644 index 8d9887a338..0000000000 --- a/.depcheckrc.json +++ /dev/null @@ -1,4 +0,0 @@ -{ - "ignores": ["@testing-library/*"], - "ignorePatterns": ["docs/*"] -} diff --git a/.dev-releases/publish.mjs b/.dev-releases/publish.mjs new file mode 100644 index 0000000000..00fc5e5213 --- /dev/null +++ b/.dev-releases/publish.mjs @@ -0,0 +1,27 @@ +import { execSync } from 'child_process' +import { readFileSync, writeFileSync } from 'fs' +import { dirname, join } from 'path' + +const __dirname = dirname(new URL(import.meta.url).pathname) +const packageJSONPath = join(dirname(__dirname), 'lib', 'package.json') + +const packageJSON = JSON.parse(readFileSync(packageJSONPath, { encoding: 'utf-8' })) + +const versionToPublish = process.env.CIRCLE_TAG + +console.info(`Found latest tag ${versionToPublish}`) + +packageJSON.version = versionToPublish.trim() + +console.info('Writing version to package.json...') + +writeFileSync(packageJSONPath, JSON.stringify(packageJSON, null, 2)) + +console.info('Done !') +console.info('Publishing ...') + +execSync( + 'cd /home/circleci/welcome-ui/lib && npm publish --tag dev --registry https://registry.npmjs.org' +) + +console.info('Done !') diff --git a/.dev-releases/version.mjs b/.dev-releases/version.mjs new file mode 100644 index 0000000000..30ea948c99 --- /dev/null +++ b/.dev-releases/version.mjs @@ -0,0 +1,19 @@ +import { execSync } from 'child_process' + +const date = new Date() + +const newVersion = `0.0.0-dev.${date.getTime()}` + +console.info(`Tag ${newVersion}...`) + +execSync(`cd lib && git tag ${newVersion}`) + +console.info('Done !') +console.info('Pushing tags...') + +execSync(`git push origin ${newVersion}`) + +console.info('Done !') +console.info( + 'Visit https://app.circleci.com/pipelines/github/WTTJ/welcome-ui to see your release progress' +) diff --git a/.eslintignore b/.eslintignore index cb3fd15fc3..b947077876 100644 --- a/.eslintignore +++ b/.eslintignore @@ -1,2 +1,2 @@ -**/node_modules/** -**/dist/** +node_modules/ +dist/ diff --git a/.github/CODEOWNERS b/.github/CODEOWNERS index ae9a988bf8..a738df6294 100644 --- a/.github/CODEOWNERS +++ b/.github/CODEOWNERS @@ -1,2 +1,2 @@ * @WTTJ/welcome-ui-tech-core -packages/ @WTTJ/welcome-ui-tech +lib @WTTJ/welcome-ui-tech diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml deleted file mode 100644 index 97593ed0ea..0000000000 --- a/.github/workflows/release.yml +++ /dev/null @@ -1,27 +0,0 @@ -name: Github release - -on: - push: - tags: - - 'v*.*.*' - -jobs: - publish: - name: Create new github release - runs-on: ubuntu-latest - env: - GITHUB_AUTH: ${{ secrets.GITHUB_TOKEN }} - GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} - permissions: - contents: write - steps: - - name: Checkout - uses: actions/checkout@v3 - - name: Get - id: get - run: npx lerna-changelog > RELEASE.md - - name: Release - uses: ncipollo/release-action@v1 - if: contains(github.ref, '-') == false - with: - bodyFile: 'RELEASE.md' diff --git a/.gitignore b/.gitignore index 708459d200..5a32f35d27 100644 --- a/.gitignore +++ b/.gitignore @@ -1,16 +1,15 @@ -.env -dist/ website/out website/.next -.cache/ node_modules/ .DS_Store .size-snapshot.json yarn-error.log -lerna-debug.log # Output of 'npm pack' *.tgz # Fonts -packages/IconFont/fonts/ +dist/ + +# vite +vite.config.mjs.* diff --git a/.husky/pre-push b/.husky/pre-push index 24f8bb194c..4f3315afe1 100755 --- a/.husky/pre-push +++ b/.husky/pre-push @@ -1 +1 @@ -yarn icons:collect && yarn lint && yarn lint:website && yarn test && yarn check:deps +yarn lint && yarn test diff --git a/.npmignore b/.npmignore deleted file mode 100644 index 604327b89c..0000000000 --- a/.npmignore +++ /dev/null @@ -1,4 +0,0 @@ -/* -!/dist/*.js -*.test.js -/website diff --git a/.stylelintrc.json b/.stylelintrc.json new file mode 100644 index 0000000000..6b29a85e17 --- /dev/null +++ b/.stylelintrc.json @@ -0,0 +1,8 @@ +{ + "extends": ["./node_modules/wttj-config/lib/stylelint"], + "customSyntax": "postcss-styled-syntax", + "rules": { + "selector-type-no-unknown": [true, { "ignoreTypes": ["/-styled-mixin/", "$dummyValue"] }], + "no-empty-source": null + } +} diff --git a/CHANGELOG.md b/CHANGELOG.md index 68331857f9..7b8cc2705f 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,198 +1,114 @@ # Change Log -All notable changes to this project will be documented in this file. -See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. ## [6.7.1](https://github.com/WTTJ/welcome-ui/compare/v6.7.0...v6.7.1) (2024-12-17) - ### Bug Fixes -* component AssetDrawer header margin ([#2636](https://github.com/WTTJ/welcome-ui/issues/2636)) ([2905e43](https://github.com/WTTJ/welcome-ui/commit/2905e43900fc04ddd50f7b58fec82c9d43927a52)) - - - - +- component AssetDrawer header margin ([#2636](https://github.com/WTTJ/welcome-ui/issues/2636)) ([2905e43](https://github.com/WTTJ/welcome-ui/commit/2905e43900fc04ddd50f7b58fec82c9d43927a52)) # [6.7.0](https://github.com/WTTJ/welcome-ui/compare/v6.6.0...v6.7.0) (2024-12-16) - ### Features -* add AssetDrawer sub component ([#2635](https://github.com/WTTJ/welcome-ui/issues/2635)) ([b76cd4d](https://github.com/WTTJ/welcome-ui/commit/b76cd4d3e8220fe880d5f576932bcd73230c26ae)) - - - - +- add AssetDrawer sub component ([#2635](https://github.com/WTTJ/welcome-ui/issues/2635)) ([b76cd4d](https://github.com/WTTJ/welcome-ui/commit/b76cd4d3e8220fe880d5f576932bcd73230c26ae)) # [6.5.0](https://github.com/WTTJ/welcome-ui/compare/v6.4.2...v6.5.0) (2024-12-03) - ### Features -* add Extend icon ([#2632](https://github.com/WTTJ/welcome-ui/issues/2632)) ([4d49b40](https://github.com/WTTJ/welcome-ui/commit/4d49b4028f837ff4c756d152e99a9109af89e73d)) - - - - +- add Extend icon ([#2632](https://github.com/WTTJ/welcome-ui/issues/2632)) ([4d49b40](https://github.com/WTTJ/welcome-ui/commit/4d49b4028f837ff4c756d152e99a9109af89e73d)) ## [6.4.2](https://github.com/WTTJ/welcome-ui/compare/v6.4.1...v6.4.2) (2024-11-26) - ### Bug Fixes -* **alert:** icon centered on medium size ([#2631](https://github.com/WTTJ/welcome-ui/issues/2631)) ([1a4d933](https://github.com/WTTJ/welcome-ui/commit/1a4d933edd3ac85bd9349262d81e7f6ba36816b4)) - - - - +- **alert:** icon centered on medium size ([#2631](https://github.com/WTTJ/welcome-ui/issues/2631)) ([1a4d933](https://github.com/WTTJ/welcome-ui/commit/1a4d933edd3ac85bd9349262d81e7f6ba36816b4)) ## [6.4.1](https://github.com/WTTJ/welcome-ui/compare/v6.4.0...v6.4.1) (2024-11-26) - ### Bug Fixes -* **alert:** crash when return null as child on cta property ([#2630](https://github.com/WTTJ/welcome-ui/issues/2630)) ([34f76f1](https://github.com/WTTJ/welcome-ui/commit/34f76f120913390319b698b7f0c7599a61629b6d)) - - - - +- **alert:** crash when return null as child on cta property ([#2630](https://github.com/WTTJ/welcome-ui/issues/2630)) ([34f76f1](https://github.com/WTTJ/welcome-ui/commit/34f76f120913390319b698b7f0c7599a61629b6d)) # [6.4.0](https://github.com/WTTJ/welcome-ui/compare/v6.3.1...v6.4.0) (2024-11-26) - ### Features -* add new components WelcomeLoader ([#2624](https://github.com/WTTJ/welcome-ui/issues/2624)) ([af966a7](https://github.com/WTTJ/welcome-ui/commit/af966a73c51320befdaad505f6bcbd7005d353be)) -* **Icon:** add TemporaryProfile Icon ([#2626](https://github.com/WTTJ/welcome-ui/issues/2626)) ([031f5d8](https://github.com/WTTJ/welcome-ui/commit/031f5d87282ad694580a6fd6b1ce0b167de6779c)) -* rework hover on fields ([#2625](https://github.com/WTTJ/welcome-ui/issues/2625)) ([14fcd0e](https://github.com/WTTJ/welcome-ui/commit/14fcd0ec1e109e58873b6c02dd498ae1f8ca0679)) - - - - +- add new components WelcomeLoader ([#2624](https://github.com/WTTJ/welcome-ui/issues/2624)) ([af966a7](https://github.com/WTTJ/welcome-ui/commit/af966a73c51320befdaad505f6bcbd7005d353be)) +- **Icon:** add TemporaryProfile Icon ([#2626](https://github.com/WTTJ/welcome-ui/issues/2626)) ([031f5d8](https://github.com/WTTJ/welcome-ui/commit/031f5d87282ad694580a6fd6b1ce0b167de6779c)) +- rework hover on fields ([#2625](https://github.com/WTTJ/welcome-ui/issues/2625)) ([14fcd0e](https://github.com/WTTJ/welcome-ui/commit/14fcd0ec1e109e58873b6c02dd498ae1f8ca0679)) ## [6.3.1](https://github.com/WTTJ/welcome-ui/compare/v6.3.0...v6.3.1) (2024-11-25) - ### Bug Fixes -* wrong margin when alert have no icon ([#2623](https://github.com/WTTJ/welcome-ui/issues/2623)) ([d92755f](https://github.com/WTTJ/welcome-ui/commit/d92755f50ea90896ced3f905a818b33b8c3051df)) - - - - +- wrong margin when alert have no icon ([#2623](https://github.com/WTTJ/welcome-ui/issues/2623)) ([d92755f](https://github.com/WTTJ/welcome-ui/commit/d92755f50ea90896ced3f905a818b33b8c3051df)) ## [6.1.1-alpha.1](https://github.com/WTTJ/welcome-ui/compare/v6.1.0...v6.1.1-alpha.1) (2024-11-08) **Note:** Version bump only for package main - - - - # [6.1.0](https://github.com/WTTJ/welcome-ui/compare/v6.0.1...v6.1.0) (2024-11-07) - ### Features -* **badge:** add possibility to add component from react-intl on children ([#2602](https://github.com/WTTJ/welcome-ui/issues/2602)) ([1451b4c](https://github.com/WTTJ/welcome-ui/commit/1451b4c277f5282501d9b32f82ac64d66c03cc26)) -* update alert component ([#2591](https://github.com/WTTJ/welcome-ui/issues/2591)) ([ab30a7f](https://github.com/WTTJ/welcome-ui/commit/ab30a7f3e1abe3f8bcdce2ba80a131a4fbdb9fb9)) -* upgrade colors on Alert and Toast components ([#2598](https://github.com/WTTJ/welcome-ui/issues/2598)) ([c37a6cb](https://github.com/WTTJ/welcome-ui/commit/c37a6cbe5e6155d22c1709626edba78c0f392b8a)) - - - - +- **badge:** add possibility to add component from react-intl on children ([#2602](https://github.com/WTTJ/welcome-ui/issues/2602)) ([1451b4c](https://github.com/WTTJ/welcome-ui/commit/1451b4c277f5282501d9b32f82ac64d66c03cc26)) +- update alert component ([#2591](https://github.com/WTTJ/welcome-ui/issues/2591)) ([ab30a7f](https://github.com/WTTJ/welcome-ui/commit/ab30a7f3e1abe3f8bcdce2ba80a131a4fbdb9fb9)) +- upgrade colors on Alert and Toast components ([#2598](https://github.com/WTTJ/welcome-ui/issues/2598)) ([c37a6cb](https://github.com/WTTJ/welcome-ui/commit/c37a6cbe5e6155d22c1709626edba78c0f392b8a)) ## [5.22.2](https://github.com/WTTJ/welcome-ui/compare/v5.22.1...v5.22.2) (2024-10-28) - ### Bug Fixes -* avoid welcome-font cut letters ([#2561](https://github.com/WTTJ/welcome-ui/issues/2561)) ([6e48d8b](https://github.com/WTTJ/welcome-ui/commit/6e48d8b2c92ef31e7c368188be29a45e2c17b3dc)) -* **Tabs:** update gap small size ([#2567](https://github.com/WTTJ/welcome-ui/issues/2567)) ([4ac0e24](https://github.com/WTTJ/welcome-ui/commit/4ac0e245a8fa5272ef230f60dbc78b05f6eabc56)) - - - - +- avoid welcome-font cut letters ([#2561](https://github.com/WTTJ/welcome-ui/issues/2561)) ([6e48d8b](https://github.com/WTTJ/welcome-ui/commit/6e48d8b2c92ef31e7c368188be29a45e2c17b3dc)) +- **Tabs:** update gap small size ([#2567](https://github.com/WTTJ/welcome-ui/issues/2567)) ([4ac0e24](https://github.com/WTTJ/welcome-ui/commit/4ac0e245a8fa5272ef230f60dbc78b05f6eabc56)) ## [5.22.1](https://github.com/WTTJ/welcome-ui/compare/v5.22.0...v5.22.1) (2024-10-15) **Note:** Version bump only for package main - - - - ## [5.21.2](https://github.com/WTTJ/welcome-ui/compare/v5.21.1...v5.21.2) (2024-09-30) - ### Bug Fixes -* swiper item width when there is less than x items ([#2535](https://github.com/WTTJ/welcome-ui/issues/2535)) ([4508a9c](https://github.com/WTTJ/welcome-ui/commit/4508a9c734f91332308d13d460e4232a11f3a2b6)) - - - - +- swiper item width when there is less than x items ([#2535](https://github.com/WTTJ/welcome-ui/issues/2535)) ([4508a9c](https://github.com/WTTJ/welcome-ui/commit/4508a9c734f91332308d13d460e4232a11f3a2b6)) ## [5.21.1](https://github.com/WTTJ/welcome-ui/compare/v5.21.0...v5.21.1) (2024-09-24) - ### Bug Fixes -* crash text component when variant is set to null ([#2544](https://github.com/WTTJ/welcome-ui/issues/2544)) ([0db5c22](https://github.com/WTTJ/welcome-ui/commit/0db5c22efc899c65a7102b49b8a48e2e68c8e7c3)) - - - - +- crash text component when variant is set to null ([#2544](https://github.com/WTTJ/welcome-ui/issues/2544)) ([0db5c22](https://github.com/WTTJ/welcome-ui/commit/0db5c22efc899c65a7102b49b8a48e2e68c8e7c3)) # [5.21.0](https://github.com/WTTJ/welcome-ui/compare/v5.20.0...v5.21.0) (2024-09-17) - ### Features -* add arrow line down icon ([3144150](https://github.com/WTTJ/welcome-ui/commit/314415048c915764cec55851b28bbc97cfc28c5a)) -* add arrow line left icon ([1d28895](https://github.com/WTTJ/welcome-ui/commit/1d28895cdf6fde933f51d2ef3c3a62df80b173d7)) -* add arrow line right icon ([7725c10](https://github.com/WTTJ/welcome-ui/commit/7725c10c3386f18d5cc4dd76affdfc8cebc2e0f5)) -* add arrow line up icon ([82b024d](https://github.com/WTTJ/welcome-ui/commit/82b024da0c66ac4dc368e9284be25d6332d4a48b)) -* generate changelog on release ([#2526](https://github.com/WTTJ/welcome-ui/issues/2526)) ([bfe647b](https://github.com/WTTJ/welcome-ui/commit/bfe647bbb8e8b86211da321af409a87a2b3f74ca)) - - - - +- add arrow line down icon ([3144150](https://github.com/WTTJ/welcome-ui/commit/314415048c915764cec55851b28bbc97cfc28c5a)) +- add arrow line left icon ([1d28895](https://github.com/WTTJ/welcome-ui/commit/1d28895cdf6fde933f51d2ef3c3a62df80b173d7)) +- add arrow line right icon ([7725c10](https://github.com/WTTJ/welcome-ui/commit/7725c10c3386f18d5cc4dd76affdfc8cebc2e0f5)) +- add arrow line up icon ([82b024d](https://github.com/WTTJ/welcome-ui/commit/82b024da0c66ac4dc368e9284be25d6332d4a48b)) +- generate changelog on release ([#2526](https://github.com/WTTJ/welcome-ui/issues/2526)) ([bfe647b](https://github.com/WTTJ/welcome-ui/commit/bfe647bbb8e8b86211da321af409a87a2b3f74ca)) # [5.19.0](https://github.com/WTTJ/welcome-ui/compare/v5.18.1...v5.19.0) (2024-08-19) - ### Features -* allow to display custom file name in the preview of a FileDrop ([#2513](https://github.com/WTTJ/welcome-ui/issues/2513)) ([b4c67d9](https://github.com/WTTJ/welcome-ui/commit/b4c67d9e50311a71e340f506bb4814a7b964382c)) - - - - +- allow to display custom file name in the preview of a FileDrop ([#2513](https://github.com/WTTJ/welcome-ui/issues/2513)) ([b4c67d9](https://github.com/WTTJ/welcome-ui/commit/b4c67d9e50311a71e340f506bb4814a7b964382c)) ## [5.18.1](https://github.com/WTTJ/welcome-ui/compare/v5.18.0...v5.18.1) (2024-08-07) - ### Bug Fixes -* **toast:** update notifications to use react portal ([#2510](https://github.com/WTTJ/welcome-ui/issues/2510)) ([d52ce74](https://github.com/WTTJ/welcome-ui/commit/d52ce74a3449849ba9b7bb2d0806f7d543e42af5)) - - - - +- **toast:** update notifications to use react portal ([#2510](https://github.com/WTTJ/welcome-ui/issues/2510)) ([d52ce74](https://github.com/WTTJ/welcome-ui/commit/d52ce74a3449849ba9b7bb2d0806f7d543e42af5)) # [5.18.0](https://github.com/WTTJ/welcome-ui/compare/v5.17.3...v5.18.0) (2024-08-05) - ### Features -* add exports for typescript FuleUpload ([#2506](https://github.com/WTTJ/welcome-ui/issues/2506)) ([dcf7931](https://github.com/WTTJ/welcome-ui/commit/dcf7931ead5a1c9b4f98cdfaa15033f380e468db)) -* add withDash property on Text headings ([#2507](https://github.com/WTTJ/welcome-ui/issues/2507)) ([6ff0337](https://github.com/WTTJ/welcome-ui/commit/6ff033733f6ce26add95e8ac0b4354ffa1960370)) - - - - +- add exports for typescript FuleUpload ([#2506](https://github.com/WTTJ/welcome-ui/issues/2506)) ([dcf7931](https://github.com/WTTJ/welcome-ui/commit/dcf7931ead5a1c9b4f98cdfaa15033f380e468db)) +- add withDash property on Text headings ([#2507](https://github.com/WTTJ/welcome-ui/issues/2507)) ([6ff0337](https://github.com/WTTJ/welcome-ui/commit/6ff033733f6ce26add95e8ac0b4354ffa1960370)) ## [5.17.2](https://github.com/WTTJ/welcome-ui/compare/v5.17.1...v5.17.2) (2024-08-02) diff --git a/LICENSE b/LICENSE index 26c9fd2f09..4886ff3111 100644 --- a/LICENSE +++ b/LICENSE @@ -1,21 +1,9 @@ The MIT License -Copyright (c) 2019-2022 CORUSCANT (welcome to the jungle) - https://www.welcometothejungle.com +Copyright (c) 2019-2025 CORUSCANT (welcome to the jungle) - https://www.welcometothejungle.com -Permission is hereby granted, free of charge, to any person obtaining a copy -of this software and associated documentation files (the "Software"), to deal -in the Software without restriction, including without limitation the rights -to use, copy, modify, merge, publish, distribute, sublicense, and/or sell -copies of the Software, and to permit persons to whom the Software is -furnished to do so, subject to the following conditions: +Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: -The above copyright notice and this permission notice shall be included in -all copies or substantial portions of the Software. +The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. -THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, -OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN -THE SOFTWARE. +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. diff --git a/README.md b/README.md index cba4e8f3d0..38f2ac55eb 100644 --- a/README.md +++ b/README.md @@ -16,16 +16,10 @@ Here you'll find all the core components you need to create a delightful webapp. ## Installation -1 - Install the **peer dependencies** listed below: +1 - Install the `welcome-ui` package and **peer dependencies** listed below: ```bash -yarn add @xstyled/styled-components react styled-components -``` - -2 - Install the the **core** component and any other components you need for your webapp e.g. if you need just a button… - -```bash -yarn add @welcome-ui/core @welcome-ui/button +yarn add welcome-ui @xstyled/styled-components@^3.7.3 react@^18.0.0 styled-components@^5.3.9 ``` ## Import library & Theme @@ -34,8 +28,9 @@ Getting started ```js import React from 'react' -import { createTheme, WuiProvider } from '@welcome-ui/core' -import { Button } from '@welcome-ui/button' +import { createTheme } from 'welcome-ui/theme' +import { WuiProvider } from 'welcome-ui/WuiProvider' +import { Button } from 'welcome-ui/Button' // Add theme options (if you want) const options = { @@ -71,73 +66,63 @@ export default function Root() { ## Develop on local -1. First install and build the packages _(only the first time)_ +1. Install ```bash -yarn first:install +yarn ``` -2. Start documentation website +2. Start a watch on all packages to rebuild them easily ```bash yarn start ``` -3. Start a watch on all packages to rebuild them easily +3. Start documentation website ```bash -yarn watch +yarn website ``` 4. and go to http://localhost:3020 ## How to release -The release of the packages is automated by the CI, you just need to bump package version and push git tags to initiate the process. +The release of the library is automated by the CI, you just need to bump package version and push git tags to initiate the process. -### Initiating the release process from your environment +### Release process -**The commands listed below will only prompt for packages to bump**. Then they will modify packages versions, commit changes and create the git tag to finally push everything to github. **No further actions are required once you have validated the packages to bump.** +**The commands listed below will only prompt for library to bump**. Then they will modify package version, commit changes and create the git tag to finally push everything to github. **No further actions are required once you have validated the packages to bump.** -#### If you just need to bump one version without switching from a prerelease to stable release, run: +#### How to release -```bash -yarn release -``` +##### Production -#### To create a new prerelease, run: - -This is only used for the **first** prerelease. If you already published a v5.0.0-alpha.0 then you just need to run the first command. +(ex: **7.1.0**): ```bash -yarn dev:prerelease +yarn release ``` -NB: you can replace alpha with any other keyword (beta, rc, ...) +##### Alpha -#### Force publish a package +(ex: **7.1.0-alpha.0**) -In addition to the options shown above, you can use the --force-publish option to force bumping some packages. +Generate an alpha release for broader team testing: -#### Troubleshooting - -##### How to release when the publish process failed having published some packages - -Re-run the failed job with ssh, then ssh into the machine and run this command: - -`cd welcome-ui/packages && find . -maxdepth 1 -type d \( ! -name . \) -exec bash -c "cd '{}' && npm publish" \;` - -This will publish each packages, those who are already published will fail and be ignored by the script. - -##### How to rollback a release that has been stopped before publish to npm +```bash +yarn release:alpha +``` -Revert the last commit (which should be the commit that bumps package versions): +##### Development -`git revert HEAD^` +(ex: **dev.1738060597**) -Remove the tag on github and locally. +Create a development release based on the current timestamp for quick testing of pre-release features: -Then apply your fixes and re-run your release command. +```bash +yarn release:dev +``` ### About the CI diff --git a/icons/CHANGELOG.md b/icons/CHANGELOG.md deleted file mode 100644 index d8e5515fff..0000000000 --- a/icons/CHANGELOG.md +++ /dev/null @@ -1,637 +0,0 @@ -# Change Log - -All notable changes to this project will be documented in this file. -See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. - -# [6.5.0](https://github.com/WTTJ/welcome-ui/compare/v6.4.2...v6.5.0) (2024-12-03) - - -### Features - -* add Extend icon ([#2632](https://github.com/WTTJ/welcome-ui/issues/2632)) ([4d49b40](https://github.com/WTTJ/welcome-ui/commit/4d49b4028f837ff4c756d152e99a9109af89e73d)) - - - - - -# [6.4.0](https://github.com/WTTJ/welcome-ui/compare/v6.3.1...v6.4.0) (2024-11-26) - - -### Features - -* **Icon:** add TemporaryProfile Icon ([#2626](https://github.com/WTTJ/welcome-ui/issues/2626)) ([031f5d8](https://github.com/WTTJ/welcome-ui/commit/031f5d87282ad694580a6fd6b1ce0b167de6779c)) - - - - - -## [5.22.1](https://github.com/WTTJ/welcome-ui/compare/v5.22.0...v5.22.1) (2024-10-15) - -**Note:** Version bump only for package @welcome-ui/icons - - - - - -# [5.21.0](https://github.com/WTTJ/welcome-ui/compare/v5.20.0...v5.21.0) (2024-09-17) - - -### Features - -* add arrow line down icon ([3144150](https://github.com/WTTJ/welcome-ui/commit/314415048c915764cec55851b28bbc97cfc28c5a)) -* add arrow line left icon ([1d28895](https://github.com/WTTJ/welcome-ui/commit/1d28895cdf6fde933f51d2ef3c3a62df80b173d7)) -* add arrow line right icon ([7725c10](https://github.com/WTTJ/welcome-ui/commit/7725c10c3386f18d5cc4dd76affdfc8cebc2e0f5)) -* add arrow line up icon ([82b024d](https://github.com/WTTJ/welcome-ui/commit/82b024da0c66ac4dc368e9284be25d6332d4a48b)) - - - - - -# [5.6.0](https://github.com/WTTJ/welcome-ui/compare/v5.5.1...v5.6.0) (2023-10-31) - - -### Features - -* update drag and drop icon ([08d900b](https://github.com/WTTJ/welcome-ui/commit/08d900b6729513166063e4f55a99e8dac7b99fb2)) - - - - - -# [5.4.0](https://github.com/WTTJ/welcome-ui/compare/v5.3.2...v5.4.0) (2023-10-10) - - -### Features - -* add X icon ([#2329](https://github.com/WTTJ/welcome-ui/issues/2329)) ([2211ba0](https://github.com/WTTJ/welcome-ui/commit/2211ba06e595f8f1077d04b63ffac96205bfa7b7)) - - - - - -# [5.0.0](https://github.com/WTTJ/welcome-ui/compare/v5.0.0-alpha.52...v5.0.0) (2023-08-31) - - -### Bug Fixes - -* peer dependency react must be >=18.0.0 ([#2222](https://github.com/WTTJ/welcome-ui/issues/2222)) ([75a2e57](https://github.com/WTTJ/welcome-ui/commit/75a2e57010a5ee2392749fb04eeaab62a60d83ea)) - - - - - -# [5.0.0-alpha.44](https://github.com/WTTJ/welcome-ui/compare/v5.0.0-alpha.43...v5.0.0-alpha.44) (2023-08-03) - - -### Features - -* migrate from reakit to ariakit ([#2101](https://github.com/WTTJ/welcome-ui/issues/2101)) ([9d506d8](https://github.com/WTTJ/welcome-ui/commit/9d506d872e9f34380b8727a82b7569aafd0ee5f9)) - - - - - -# [5.0.0-alpha.41](https://github.com/WTTJ/welcome-ui/compare/v5.0.0-alpha.40...v5.0.0-alpha.41) (2023-07-17) - - -### Features - -* add new Salary icon ([#2124](https://github.com/WTTJ/welcome-ui/issues/2124)) ([1c4a849](https://github.com/WTTJ/welcome-ui/commit/1c4a849c3957c2ba20b779a0fceaa9fb58076e9d)) - - - - - -# [5.0.0-alpha.40](https://github.com/WTTJ/welcome-ui/compare/v5.0.0-alpha.39...v5.0.0-alpha.40) (2023-06-15) - -**Note:** Version bump only for package @welcome-ui/icons - - - - - -# [5.0.0-alpha.37](https://github.com/WTTJ/welcome-ui/compare/v5.0.0-alpha.36...v5.0.0-alpha.37) (2023-05-30) - -**Note:** Version bump only for package @welcome-ui/icons - - - - - -# [5.0.0-alpha.32](https://github.com/WTTJ/welcome-ui/compare/v5.0.0-alpha.31...v5.0.0-alpha.32) (2023-03-22) - -**Note:** Version bump only for package @welcome-ui/icons - - - - - -# [5.0.0-alpha.31](https://github.com/WTTJ/welcome-ui/compare/v5.0.0-alpha.30...v5.0.0-alpha.31) (2023-03-22) - -**Note:** Version bump only for package @welcome-ui/icons - - - - - -# [5.0.0-alpha.29](https://github.com/WTTJ/welcome-ui/compare/v5.0.0-alpha.28...v5.0.0-alpha.29) (2023-03-21) - - -### Reverts - -* Revert "v5.0.0-alpha.29" ([7e73102](https://github.com/WTTJ/welcome-ui/commit/7e731020daa04dd7701d7729dee857dfa6f0876f)) - - - - - -# [5.0.0-alpha.28](https://github.com/WTTJ/welcome-ui/compare/v5.0.0-alpha.27...v5.0.0-alpha.28) (2023-03-14) - - -### Features - -* add us flag icon ([#2003](https://github.com/WTTJ/welcome-ui/issues/2003)) ([25d8f67](https://github.com/WTTJ/welcome-ui/commit/25d8f67fe15b72749f621de80eb3dbdf172f3b1d)) - - - - - -# [5.0.0-alpha.22](https://github.com/WTTJ/welcome-ui/compare/v5.0.0-alpha.21...v5.0.0-alpha.22) (2023-02-21) - - -### Features - -* add tiktok icon ([#1956](https://github.com/WTTJ/welcome-ui/issues/1956)) ([7eb22d6](https://github.com/WTTJ/welcome-ui/commit/7eb22d6d2bbd0cc0234ee14c5e35f13cbd130502)) - - - - - -# [5.0.0-alpha.21](https://github.com/WTTJ/welcome-ui/compare/v5.0.0-alpha.20...v5.0.0-alpha.21) (2023-02-16) - - -### Features - -* add move icon & fix collect script ([#1944](https://github.com/WTTJ/welcome-ui/issues/1944)) ([b1f7747](https://github.com/WTTJ/welcome-ui/commit/b1f77476af40c180a537a7f5e02fafcc1273aac5)) - - - - - -# [5.0.0-alpha.16](https://github.com/WTTJ/welcome-ui/compare/v5.0.0-alpha.15...v5.0.0-alpha.16) (2023-02-02) - -**Note:** Version bump only for package @welcome-ui/icons - - - - - -# [4.5.0](https://github.com/WTTJ/welcome-ui/compare/v4.4.1...v4.5.0) (2022-09-14) - - -### Features - -* add thumb down icon ([#1570](https://github.com/WTTJ/welcome-ui/issues/1570)) ([dfb382e](https://github.com/WTTJ/welcome-ui/commit/dfb382e3a02ab2f8ecc68cc4d8d0164042b58a9c)) - - - - - -## [4.3.2](https://github.com/WTTJ/welcome-ui/compare/v4.3.1...v4.3.2) (2022-07-13) - - -### Bug Fixes - -* add missing `fill` attribute to some icons ([#1414](https://github.com/WTTJ/welcome-ui/issues/1414)) ([1620e56](https://github.com/WTTJ/welcome-ui/commit/1620e56949c7d1708f8d5d3b2da66a0698c7f56b)) - - - - - -# [4.2.0](https://github.com/WTTJ/welcome-ui/compare/v4.1.2...v4.2.0) (2022-05-30) - - -### Bug Fixes - -* remove react-dom in peerDependecies ([36fdb35](https://github.com/WTTJ/welcome-ui/commit/36fdb356016a6d71dce4d0254da2562ec6c9d973)) - - -### Features - -* react v18 ([4719389](https://github.com/WTTJ/welcome-ui/commit/4719389b2e02179479079f120afaf15099c36aa7)) - - - - - -## [4.1.2](https://github.com/WTTJ/welcome-ui/compare/v4.1.1...v4.1.2) (2022-05-25) - -**Note:** Version bump only for package @welcome-ui/icons - - - - - -## [4.1.1](https://github.com/WTTJ/welcome-ui/compare/v4.1.0...v4.1.1) (2022-05-16) - -**Note:** Version bump only for package @welcome-ui/icons - - - - - -# [4.1.0](https://github.com/WTTJ/welcome-ui/compare/v4.0.6...v4.1.0) (2022-05-16) - -**Note:** Version bump only for package @welcome-ui/icons - - - - - -## [4.0.5](https://github.com/WTTJ/welcome-ui/compare/v4.0.4...v4.0.5) (2022-04-27) - -**Note:** Version bump only for package @welcome-ui/icons - - - - - -## [4.0.1](https://github.com/WTTJ/welcome-ui/compare/v4.0.0...v4.0.1) (2022-03-24) - -**Note:** Version bump only for package @welcome-ui/icons - - - - - -## [3.13.1](https://github.com/WTTJ/welcome-ui/compare/v3.13.0...v3.13.1) (2021-11-16) - - -### Bug Fixes - -* spelling mistake on masonry ([#957](https://github.com/WTTJ/welcome-ui/issues/957)) ([823e559](https://github.com/WTTJ/welcome-ui/commit/823e5594b3c62fe52a22efab2d29a33b45078f46)) - - - - - -# [3.9.0](https://github.com/WTTJ/welcome-ui/compare/v3.8.4...v3.9.0) (2021-10-13) - - -### Bug Fixes - -* wttj icon viewbox ([#875](https://github.com/WTTJ/welcome-ui/issues/875)) ([8f6acae](https://github.com/WTTJ/welcome-ui/commit/8f6acae26bfb27c2d5acfc933f30beac875acf91)) - - -### Features - -* add google icon ([#936](https://github.com/WTTJ/welcome-ui/issues/936)) ([3c37371](https://github.com/WTTJ/welcome-ui/commit/3c37371c14b2b6b1fbeb0f72db4615b13959cd34)) - - - - - -# [3.8.0](https://github.com/WTTJ/welcome-ui/compare/v3.7.0...v3.8.0) (2021-08-25) - - -### Features - -* add user & user_outline icons ([#853](https://github.com/WTTJ/welcome-ui/issues/853)) ([a60d78a](https://github.com/WTTJ/welcome-ui/commit/a60d78a2ba4a8a94c5b532708d5be02fdbb031b7)) - - - - - -# [3.7.0](https://github.com/WTTJ/welcome-ui/compare/v3.6.0...v3.7.0) (2021-05-18) - - -### Features - -* add fullscreen_off and fullscreen_on icons ([#850](https://github.com/WTTJ/welcome-ui/issues/850)) ([b30da2a](https://github.com/WTTJ/welcome-ui/commit/b30da2a9cdf6d6aa0aaf6e5fd120f67a098bffd9)) - - - - - -# [3.6.0](https://github.com/WTTJ/welcome-ui/compare/v3.5.0...v3.6.0) (2021-05-17) - - -### Bug Fixes - -* icons optimize script, readme, and new sound on icon ([#849](https://github.com/WTTJ/welcome-ui/issues/849)) ([8c0428e](https://github.com/WTTJ/welcome-ui/commit/8c0428e560569bb48ee98b4547c91814cd8324bc)) - - - - - -# [3.4.0](https://github.com/WTTJ/welcome-ui/compare/v3.3.0...v3.4.0) (2021-04-19) - - -### Features - -* new webfont workflow ([#820](https://github.com/WTTJ/welcome-ui/issues/820)) ([e2d5c35](https://github.com/WTTJ/welcome-ui/commit/e2d5c35c89aa855e815437bcf258eee1db56e3b8)) - - - - - -# [3.3.0](https://github.com/WTTJ/welcome-ui/compare/v3.2.0...v3.3.0) (2021-04-19) - - -### Features - -* add wttj icon ([#843](https://github.com/WTTJ/welcome-ui/issues/843)) ([021de66](https://github.com/WTTJ/welcome-ui/commit/021de66c386201f276ed9ccf42f12467ff6da938)) - - - - - -## [2.15.3](https://github.com/WTTJ/welcome-ui/compare/v2.15.2...v2.15.3) (2021-02-04) - -**Note:** Version bump only for package @welcome-ui/icons - - - - - -# [2.15.0](https://github.com/WTTJ/welcome-ui/compare/v2.14.1...v2.15.0) (2021-01-07) - - -### Features - -* add table-merge-cells new icon ([#812](https://github.com/WTTJ/welcome-ui/issues/812)) ([64874c5](https://github.com/WTTJ/welcome-ui/commit/64874c593ef8f2cfb18a171793d53b22005f7dac)) - - - - - -## [2.14.1](https://github.com/WTTJ/welcome-ui/compare/v2.14.0...v2.14.1) (2021-01-06) - - -### Bug Fixes - -* add currentColor value on fill attribute of new svg pictos ([#811](https://github.com/WTTJ/welcome-ui/issues/811)) ([1568db4](https://github.com/WTTJ/welcome-ui/commit/1568db4f4af1c549e11c358d4ad91bbf848920cc)) - - - - - -# [2.14.0](https://github.com/WTTJ/welcome-ui/compare/v2.13.0...v2.14.0) (2021-01-06) - - -### Features - -* add new table icons and a readme to know how to ([#810](https://github.com/WTTJ/welcome-ui/issues/810)) ([965ade2](https://github.com/WTTJ/welcome-ui/commit/965ade26268ceee5c318e40a4047fc932ff81caf)) - - - - - -# [2.13.0](https://github.com/WTTJ/welcome-ui/compare/v2.12.0...v2.13.0) (2020-11-25) - - -### Features - -* **icons:** add new icon CodeBlock ([#807](https://github.com/WTTJ/welcome-ui/issues/807)) ([ae1c8e4](https://github.com/WTTJ/welcome-ui/commit/ae1c8e4126c8a02602300202e694d15eda0e9b5a)) - - - - - -# [2.12.0](https://github.com/WTTJ/welcome-ui/compare/v2.11.0...v2.12.0) (2020-11-17) - - -### Features - -* **icons:** add new icons for markdown ([#806](https://github.com/WTTJ/welcome-ui/issues/806)) ([9a619ce](https://github.com/WTTJ/welcome-ui/commit/9a619ce2f76b02858e9d267ad58b57a11900fb22)) - - - - - -# [2.11.0](https://github.com/WTTJ/welcome-ui/compare/v2.10.0...v2.11.0) (2020-11-16) - - -### Features - -* **icons:** add 24 new icons ([#805](https://github.com/WTTJ/welcome-ui/issues/805)) ([a5801af](https://github.com/WTTJ/welcome-ui/commit/a5801afdf9cea5811061206ef579aea5919e4198)) - - - - - -# [2.6.0](https://github.com/WTTJ/welcome-ui/compare/v2.5.2...v2.6.0) (2020-10-12) - - -### Features - -* add in progress & new candidate icon ([#787](https://github.com/WTTJ/welcome-ui/issues/787)) ([954c72d](https://github.com/WTTJ/welcome-ui/commit/954c72d7ca3fee8f393e3479e2ea83ff4e2563dd)) -* burn icon ([#786](https://github.com/WTTJ/welcome-ui/issues/786)) ([9dd207e](https://github.com/WTTJ/welcome-ui/commit/9dd207e96c7d620d0826584e251bdf8fd4434522)) - - - - - -# [2.5.0](https://github.com/WTTJ/welcome-ui/compare/v2.4.1...v2.5.0) (2020-09-24) - - -### Features - -* **icons:** add ppt icon ([#782](https://github.com/WTTJ/welcome-ui/issues/782)) ([577f662](https://github.com/WTTJ/welcome-ui/commit/577f6626c6546b4fdf8b207b55a06f9f5e91a4da)) - - - - - -# [2.3.0](https://github.com/WTTJ/welcome-ui/compare/v2.2.0...v2.3.0) (2020-09-08) - - -### Features - -* **icons:** add new attachements icon ([#776](https://github.com/WTTJ/welcome-ui/issues/776)) ([64b8157](https://github.com/WTTJ/welcome-ui/commit/64b8157441b7541780df410893733938c637857d)) - - - - - -## [2.1.4](https://github.com/WTTJ/welcome-ui/compare/v2.1.3...v2.1.4) (2020-09-02) - -**Note:** Version bump only for package @welcome-ui/icons - - - - - -## [2.1.1](https://github.com/WTTJ/welcome-ui/compare/v2.1.0...v2.1.1) (2020-08-07) - - -### Bug Fixes - -* missing icon remove ([#766](https://github.com/WTTJ/welcome-ui/issues/766)) ([fac1f6d](https://github.com/WTTJ/welcome-ui/commit/fac1f6d13db021ed58ced06e2e4306ab75507865)) - - - - - -# [2.1.0](https://github.com/WTTJ/welcome-ui/compare/v2.0.2...v2.1.0) (2020-08-06) - - -### Features - -* add new icons ([#761](https://github.com/WTTJ/welcome-ui/issues/761)) ([92e41a6](https://github.com/WTTJ/welcome-ui/commit/92e41a611085b6f0b5b23feae489dcde17ff1e50)) - - - - - -## [2.0.2](https://github.com/WTTJ/welcome-ui/compare/v2.0.1...v2.0.2) (2020-08-04) - - -### Bug Fixes - -* https for all links ([#755](https://github.com/WTTJ/welcome-ui/issues/755)) ([6b8e0ea](https://github.com/WTTJ/welcome-ui/commit/6b8e0ea7807486510169437bb909cb65038ff6f5)) - - - - - -# [1.29.0](https://github.com/WTTJ/welcome-ui/compare/v1.28.0...v1.29.0) (2020-05-27) - - -### Features - -* update en flag ([#640](https://github.com/WTTJ/welcome-ui/issues/640)) ([3fe6ca2](https://github.com/WTTJ/welcome-ui/commit/3fe6ca2b45a6e4a080231038f345f37593079aa3)) - - - - - -# [1.27.0](https://github.com/WTTJ/welcome-ui/compare/v1.26.4...v1.27.0) (2020-05-25) - - -### Bug Fixes - -* make french flag match other flags ([#627](https://github.com/WTTJ/welcome-ui/issues/627)) ([8d03db4](https://github.com/WTTJ/welcome-ui/commit/8d03db4b2cf31eac52f39b15af0e3e47e3ce2fd7)) - - - - - -# [1.22.0](https://github.com/WTTJ/welcome-ui/compare/v1.21.2...v1.22.0) (2020-04-10) - - -### Features - -* add new icon for Markdown ([#594](https://github.com/WTTJ/welcome-ui/issues/594)) ([c640894](https://github.com/WTTJ/welcome-ui/commit/c6408943a0a5323ffdddf228e0dc37fb91602742)) -* automate icon font ([#583](https://github.com/WTTJ/welcome-ui/issues/583)) ([e0e92c6](https://github.com/WTTJ/welcome-ui/commit/e0e92c6f7a37d7eccb4a31817811be84c50ec5fb)) - - - - - -# [1.20.0](https://github.com/WTTJ/welcome-ui/compare/v1.19.2...v1.20.0) (2020-04-06) - -**Note:** Version bump only for package @welcome-ui/icons - - - - - -# [1.19.0](https://github.com/WTTJ/welcome-ui/compare/v1.18.1...v1.19.0) (2020-04-02) - -**Note:** Version bump only for package @welcome-ui/icons - - - - - -## [1.15.3](https://github.com/WTTJ/welcome-ui/compare/v1.14.1...v1.15.3) (2020-03-23) - - -### Bug Fixes - -* esm in icons cjs build ([#558](https://github.com/WTTJ/welcome-ui/issues/558)) ([40f91c4](https://github.com/WTTJ/welcome-ui/commit/40f91c420070d57621b13b3f87d9a1e39fd13372)) - - - - - -## [1.14.1](https://github.com/WTTJ/welcome-ui/compare/v1.13.0...v1.14.1) (2020-03-20) - -**Note:** Version bump only for package @welcome-ui/icons - - - - - -# [1.13.0](https://github.com/WTTJ/welcome-ui/compare/v1.12.0...v1.13.0) (2020-03-20) - - -### Features - -* flag icons ([#555](https://github.com/WTTJ/welcome-ui/issues/555)) ([ed96bbe](https://github.com/WTTJ/welcome-ui/commit/ed96bbe0ebec43ef2aab09c8889c4d7472267348)) - - - - - -# [1.10.0](https://github.com/WTTJ/welcome-ui/compare/v1.9.3...v1.10.0) (2020-02-17) - - -### Features - -* add Upload and Get icons ([#539](https://github.com/WTTJ/welcome-ui/issues/539)) ([cbc0b81](https://github.com/WTTJ/welcome-ui/commit/cbc0b81dc84f0cbad4182a1e8afb844d0dfee9c0)) - - - - - -## [1.9.2](https://github.com/WTTJ/welcome-ui/compare/v1.9.1...v1.9.2) (2020-02-12) - - -### Bug Fixes - -* remove for now Download icon ([#534](https://github.com/WTTJ/welcome-ui/issues/534)) ([9940176](https://github.com/WTTJ/welcome-ui/commit/99401768878932d648adfcb12cf402b22e098bed)) - - - - - -## [1.9.1](https://github.com/WTTJ/welcome-ui/compare/v1.9.0...v1.9.1) (2020-02-12) - - -### Bug Fixes - -* wrong icon name invalid on npm ([#532](https://github.com/WTTJ/welcome-ui/issues/532)) ([ddbb288](https://github.com/WTTJ/welcome-ui/commit/ddbb2888f0473865410eb89d7cc02b8109463142)) - - - - - -# [1.9.0](https://github.com/WTTJ/welcome-ui/compare/v1.8.0...v1.9.0) (2020-02-12) - - -### Bug Fixes - -* first package version for icons ([#531](https://github.com/WTTJ/welcome-ui/issues/531)) ([56a38d0](https://github.com/WTTJ/welcome-ui/commit/56a38d0bb2db2a5bc0e0eac30801aa8ca5bd2704)) - - -### Features - -* add new icons ([#530](https://github.com/WTTJ/welcome-ui/issues/530)) ([0708873](https://github.com/WTTJ/welcome-ui/commit/0708873527e8b6cade49f6248ca9276cbb1c2803)) - - - - - -# [1.7.0](https://github.com/WTTJ/welcome-ui/compare/v1.6.3...v1.7.0) (2020-02-04) - -**Note:** Version bump only for package @welcome-ui/icons - - - - - -## [1.1.4](https://github.com/WTTJ/welcome-ui/compare/v1.1.3...v1.1.4) (2020-01-08) - -**Note:** Version bump only for package @welcome-ui/icons diff --git a/icons/package.json b/icons/package.json deleted file mode 100644 index 923b477c71..0000000000 --- a/icons/package.json +++ /dev/null @@ -1,54 +0,0 @@ -{ - "name": "@welcome-ui/icons", - "version": "6.5.0", - "description": "Customizable design system with react • styled-components • styled-system and ariakit.", - "main": "dist/index.js", - "module": "dist/index.mjs", - "types": "dist/types/index.d.ts", - "exports": { - ".": { - "types": "./dist/types/index.d.ts", - "import": "./dist/index.mjs", - "require": "./dist/index.js" - }, - "./package.json": "./package.json" - }, - "scripts": { - "build": "node ../scripts/build.js", - "types": "mkdir -p dist/types && cp src/index.d.ts dist/types/index.d.ts" - }, - "publishConfig": { - "access": "public" - }, - "repository": { - "type": "git", - "url": "git+https://github.com/WTTJ/welcome-ui.git" - }, - "keywords": [ - "design-system", - "react", - "ariakit", - "styled-components", - "styled-system", - "ui-library", - "ui", - "ux", - "jungle", - "welcome", - "WTTJ" - ], - "author": "WTTJ ", - "license": "MIT", - "bugs": { - "url": "https://github.com/WTTJ/welcome-ui/issues" - }, - "peerDependencies": { - "react": "^18.0.0" - }, - "gitHead": "974e7bfd71f8cfe846cbffd678c3860a8952f9e9", - "homepage": "https://welcome-ui.com/components/icons", - "component": "Icons", - "dependencies": { - "@welcome-ui/icon": "^6.1.1" - } -} diff --git a/icons/src/Actions/index.tsx b/icons/src/Actions/index.tsx deleted file mode 100644 index 647bdd61d9..0000000000 --- a/icons/src/Actions/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ActionsIcon: React.FC = props => { - return -} diff --git a/icons/src/Activity/index.tsx b/icons/src/Activity/index.tsx deleted file mode 100644 index 2a78ca7929..0000000000 --- a/icons/src/Activity/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ActivityIcon: React.FC = props => { - return -} diff --git a/icons/src/Add/index.tsx b/icons/src/Add/index.tsx deleted file mode 100644 index f4be07aa0d..0000000000 --- a/icons/src/Add/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const AddIcon: React.FC = props => { - return -} diff --git a/icons/src/Address/index.tsx b/icons/src/Address/index.tsx deleted file mode 100644 index 518d53e6cd..0000000000 --- a/icons/src/Address/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const AddressIcon: React.FC = props => { - return -} diff --git a/icons/src/Airplay/index.tsx b/icons/src/Airplay/index.tsx deleted file mode 100644 index fa5360c2f0..0000000000 --- a/icons/src/Airplay/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const AirplayIcon: React.FC = props => { - return -} diff --git a/icons/src/Alert/index.tsx b/icons/src/Alert/index.tsx deleted file mode 100644 index f080e0a458..0000000000 --- a/icons/src/Alert/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const AlertIcon: React.FC = props => { - return -} diff --git a/icons/src/AlertOutline/index.tsx b/icons/src/AlertOutline/index.tsx deleted file mode 100644 index a62709af18..0000000000 --- a/icons/src/AlertOutline/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const AlertOutlineIcon: React.FC = props => { - return -} diff --git a/icons/src/Analytics/index.tsx b/icons/src/Analytics/index.tsx deleted file mode 100644 index 167d8cad79..0000000000 --- a/icons/src/Analytics/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const AnalyticsIcon: React.FC = props => { - return -} diff --git a/icons/src/Anniversary/index.tsx b/icons/src/Anniversary/index.tsx deleted file mode 100644 index eb6aaa818d..0000000000 --- a/icons/src/Anniversary/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const AnniversaryIcon: React.FC = props => { - return -} diff --git a/icons/src/Archive/index.tsx b/icons/src/Archive/index.tsx deleted file mode 100644 index f1605acb3e..0000000000 --- a/icons/src/Archive/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ArchiveIcon: React.FC = props => { - return -} diff --git a/icons/src/ArrowDown/index.tsx b/icons/src/ArrowDown/index.tsx deleted file mode 100644 index 118ac0b3b3..0000000000 --- a/icons/src/ArrowDown/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ArrowDownIcon: React.FC = props => { - return -} diff --git a/icons/src/ArrowLeft/index.tsx b/icons/src/ArrowLeft/index.tsx deleted file mode 100644 index f343b4d413..0000000000 --- a/icons/src/ArrowLeft/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ArrowLeftIcon: React.FC = props => { - return -} diff --git a/icons/src/ArrowLineDown/index.tsx b/icons/src/ArrowLineDown/index.tsx deleted file mode 100644 index 21a2c4d173..0000000000 --- a/icons/src/ArrowLineDown/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ArrowLineDownIcon: React.FC = props => { - return -} diff --git a/icons/src/ArrowLineLeft/index.tsx b/icons/src/ArrowLineLeft/index.tsx deleted file mode 100644 index 45d420adad..0000000000 --- a/icons/src/ArrowLineLeft/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ArrowLineLeftIcon: React.FC = props => { - return -} diff --git a/icons/src/ArrowLineRight/index.tsx b/icons/src/ArrowLineRight/index.tsx deleted file mode 100644 index 9bdbbb123b..0000000000 --- a/icons/src/ArrowLineRight/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ArrowLineRightIcon: React.FC = props => { - return -} diff --git a/icons/src/ArrowLineUp/index.tsx b/icons/src/ArrowLineUp/index.tsx deleted file mode 100644 index a5464ed18b..0000000000 --- a/icons/src/ArrowLineUp/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ArrowLineUpIcon: React.FC = props => { - return -} diff --git a/icons/src/ArrowRight/index.tsx b/icons/src/ArrowRight/index.tsx deleted file mode 100644 index 24de6471ba..0000000000 --- a/icons/src/ArrowRight/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ArrowRightIcon: React.FC = props => { - return -} diff --git a/icons/src/ArrowUp/index.tsx b/icons/src/ArrowUp/index.tsx deleted file mode 100644 index 5fa631d288..0000000000 --- a/icons/src/ArrowUp/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ArrowUpIcon: React.FC = props => { - return -} diff --git a/icons/src/AspectRatioFill/index.tsx b/icons/src/AspectRatioFill/index.tsx deleted file mode 100644 index c7680cb89e..0000000000 --- a/icons/src/AspectRatioFill/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const AspectRatioFillIcon: React.FC = props => { - return -} diff --git a/icons/src/AspectRatioFit/index.tsx b/icons/src/AspectRatioFit/index.tsx deleted file mode 100644 index b6a40ec4f8..0000000000 --- a/icons/src/AspectRatioFit/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const AspectRatioFitIcon: React.FC = props => { - return -} diff --git a/icons/src/Attachment/index.tsx b/icons/src/Attachment/index.tsx deleted file mode 100644 index efbfe6e79e..0000000000 --- a/icons/src/Attachment/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const AttachmentIcon: React.FC = props => { - return -} diff --git a/icons/src/Avatar/index.tsx b/icons/src/Avatar/index.tsx deleted file mode 100644 index 1c11152399..0000000000 --- a/icons/src/Avatar/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const AvatarIcon: React.FC = props => { - return -} diff --git a/icons/src/AvatarAccessory/index.tsx b/icons/src/AvatarAccessory/index.tsx deleted file mode 100644 index 5a7fd7c3f2..0000000000 --- a/icons/src/AvatarAccessory/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const AvatarAccessoryIcon: React.FC = props => { - return -} diff --git a/icons/src/AvatarBody/index.tsx b/icons/src/AvatarBody/index.tsx deleted file mode 100644 index 45ce72231d..0000000000 --- a/icons/src/AvatarBody/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const AvatarBodyIcon: React.FC = props => { - return -} diff --git a/icons/src/AvatarBottom/index.tsx b/icons/src/AvatarBottom/index.tsx deleted file mode 100644 index 8a303e64c4..0000000000 --- a/icons/src/AvatarBottom/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const AvatarBottomIcon: React.FC = props => { - return -} diff --git a/icons/src/AvatarCostume/index.tsx b/icons/src/AvatarCostume/index.tsx deleted file mode 100644 index afb3b45f7a..0000000000 --- a/icons/src/AvatarCostume/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const AvatarCostumeIcon: React.FC = props => { - return -} diff --git a/icons/src/AvatarHead/index.tsx b/icons/src/AvatarHead/index.tsx deleted file mode 100644 index 50b7cd489c..0000000000 --- a/icons/src/AvatarHead/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const AvatarHeadIcon: React.FC = props => { - return -} diff --git a/icons/src/AvatarTop/index.tsx b/icons/src/AvatarTop/index.tsx deleted file mode 100644 index 474ab6861d..0000000000 --- a/icons/src/AvatarTop/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const AvatarTopIcon: React.FC = props => { - return -} diff --git a/icons/src/BarChart/index.tsx b/icons/src/BarChart/index.tsx deleted file mode 100644 index 5ff04f4233..0000000000 --- a/icons/src/BarChart/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const BarChartIcon: React.FC = props => { - return -} diff --git a/icons/src/Basketball/index.tsx b/icons/src/Basketball/index.tsx deleted file mode 100644 index d0be6111b1..0000000000 --- a/icons/src/Basketball/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const BasketballIcon: React.FC = props => { - return -} diff --git a/icons/src/Behance/index.tsx b/icons/src/Behance/index.tsx deleted file mode 100644 index 31d9b9b101..0000000000 --- a/icons/src/Behance/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const BehanceIcon: React.FC = props => { - return -} diff --git a/icons/src/Birthday/index.tsx b/icons/src/Birthday/index.tsx deleted file mode 100644 index 5b8302c3a3..0000000000 --- a/icons/src/Birthday/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const BirthdayIcon: React.FC = props => { - return -} diff --git a/icons/src/Bold/index.tsx b/icons/src/Bold/index.tsx deleted file mode 100644 index 380c1bdd71..0000000000 --- a/icons/src/Bold/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const BoldIcon: React.FC = props => { - return -} diff --git a/icons/src/Book/index.tsx b/icons/src/Book/index.tsx deleted file mode 100644 index 12e12e7ea9..0000000000 --- a/icons/src/Book/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const BookIcon: React.FC = props => { - return -} diff --git a/icons/src/Book2/index.tsx b/icons/src/Book2/index.tsx deleted file mode 100644 index b952a8bcff..0000000000 --- a/icons/src/Book2/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const Book2Icon: React.FC = props => { - return -} diff --git a/icons/src/Bookmark/index.tsx b/icons/src/Bookmark/index.tsx deleted file mode 100644 index 5c72f4fe9e..0000000000 --- a/icons/src/Bookmark/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const BookmarkIcon: React.FC = props => { - return -} diff --git a/icons/src/BookmarkOutline/index.tsx b/icons/src/BookmarkOutline/index.tsx deleted file mode 100644 index 27d1822e62..0000000000 --- a/icons/src/BookmarkOutline/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const BookmarkOutlineIcon: React.FC = props => { - return -} diff --git a/icons/src/Bulb/index.tsx b/icons/src/Bulb/index.tsx deleted file mode 100644 index 53ef9a6669..0000000000 --- a/icons/src/Bulb/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const BulbIcon: React.FC = props => { - return -} diff --git a/icons/src/Bulk/index.tsx b/icons/src/Bulk/index.tsx deleted file mode 100644 index 9c3591eea7..0000000000 --- a/icons/src/Bulk/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const BulkIcon: React.FC = props => { - return -} diff --git a/icons/src/Buoy/index.tsx b/icons/src/Buoy/index.tsx deleted file mode 100644 index de4f380bc3..0000000000 --- a/icons/src/Buoy/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const BuoyIcon: React.FC = props => { - return -} diff --git a/icons/src/Burn/index.tsx b/icons/src/Burn/index.tsx deleted file mode 100644 index c36c36cd07..0000000000 --- a/icons/src/Burn/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const BurnIcon: React.FC = props => { - return -} diff --git a/icons/src/Caddy/index.tsx b/icons/src/Caddy/index.tsx deleted file mode 100644 index ac819878dd..0000000000 --- a/icons/src/Caddy/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CaddyIcon: React.FC = props => { - return -} diff --git a/icons/src/Calcul/index.tsx b/icons/src/Calcul/index.tsx deleted file mode 100644 index b93580eeea..0000000000 --- a/icons/src/Calcul/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CalculIcon: React.FC = props => { - return -} diff --git a/icons/src/Camera/index.tsx b/icons/src/Camera/index.tsx deleted file mode 100644 index 332c735212..0000000000 --- a/icons/src/Camera/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CameraIcon: React.FC = props => { - return -} diff --git a/icons/src/CameraOff/index.tsx b/icons/src/CameraOff/index.tsx deleted file mode 100644 index c5b49fdca2..0000000000 --- a/icons/src/CameraOff/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CameraOffIcon: React.FC = props => { - return -} diff --git a/icons/src/CameraOn/index.tsx b/icons/src/CameraOn/index.tsx deleted file mode 100644 index e7ce7a8f2c..0000000000 --- a/icons/src/CameraOn/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CameraOnIcon: React.FC = props => { - return -} diff --git a/icons/src/CandidateStatus/index.tsx b/icons/src/CandidateStatus/index.tsx deleted file mode 100644 index 3b9e184e5b..0000000000 --- a/icons/src/CandidateStatus/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CandidateStatusIcon: React.FC = props => { - return -} diff --git a/icons/src/CardView/index.tsx b/icons/src/CardView/index.tsx deleted file mode 100644 index bb9d4de176..0000000000 --- a/icons/src/CardView/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CardViewIcon: React.FC = props => { - return -} diff --git a/icons/src/Cast/index.tsx b/icons/src/Cast/index.tsx deleted file mode 100644 index 18da111c57..0000000000 --- a/icons/src/Cast/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CastIcon: React.FC = props => { - return -} diff --git a/icons/src/CastConnected/index.tsx b/icons/src/CastConnected/index.tsx deleted file mode 100644 index 91138e726f..0000000000 --- a/icons/src/CastConnected/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CastConnectedIcon: React.FC = props => { - return -} diff --git a/icons/src/CastUnavailable/index.tsx b/icons/src/CastUnavailable/index.tsx deleted file mode 100644 index 40c0416891..0000000000 --- a/icons/src/CastUnavailable/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CastUnavailableIcon: React.FC = props => { - return -} diff --git a/icons/src/Celebrate/index.tsx b/icons/src/Celebrate/index.tsx deleted file mode 100644 index d8de496608..0000000000 --- a/icons/src/Celebrate/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CelebrateIcon: React.FC = props => { - return -} diff --git a/icons/src/Certified/index.tsx b/icons/src/Certified/index.tsx deleted file mode 100644 index 2287bef645..0000000000 --- a/icons/src/Certified/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CertifiedIcon: React.FC = props => { - return -} diff --git a/icons/src/Check/index.tsx b/icons/src/Check/index.tsx deleted file mode 100644 index 209ffe0d14..0000000000 --- a/icons/src/Check/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CheckIcon: React.FC = props => { - return -} diff --git a/icons/src/Clipboard/index.tsx b/icons/src/Clipboard/index.tsx deleted file mode 100644 index a2110bdc9c..0000000000 --- a/icons/src/Clipboard/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ClipboardIcon: React.FC = props => { - return -} diff --git a/icons/src/Clock/index.tsx b/icons/src/Clock/index.tsx deleted file mode 100644 index 5685001f4e..0000000000 --- a/icons/src/Clock/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ClockIcon: React.FC = props => { - return -} diff --git a/icons/src/Code/index.tsx b/icons/src/Code/index.tsx deleted file mode 100644 index 84c3a302f1..0000000000 --- a/icons/src/Code/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CodeIcon: React.FC = props => { - return -} diff --git a/icons/src/CodeBlock/index.tsx b/icons/src/CodeBlock/index.tsx deleted file mode 100644 index 4c1cc6015b..0000000000 --- a/icons/src/CodeBlock/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CodeBlockIcon: React.FC = props => { - return -} diff --git a/icons/src/Coffee/index.tsx b/icons/src/Coffee/index.tsx deleted file mode 100644 index 80ea823fc4..0000000000 --- a/icons/src/Coffee/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CoffeeIcon: React.FC = props => { - return -} diff --git a/icons/src/Collapse/index.tsx b/icons/src/Collapse/index.tsx deleted file mode 100644 index e3ab41249a..0000000000 --- a/icons/src/Collapse/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CollapseIcon: React.FC = props => { - return -} diff --git a/icons/src/Comment/index.tsx b/icons/src/Comment/index.tsx deleted file mode 100644 index 6774cb3b82..0000000000 --- a/icons/src/Comment/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CommentIcon: React.FC = props => { - return -} diff --git a/icons/src/CommentOutline/index.tsx b/icons/src/CommentOutline/index.tsx deleted file mode 100644 index 368b2e20ab..0000000000 --- a/icons/src/CommentOutline/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CommentOutlineIcon: React.FC = props => { - return -} diff --git a/icons/src/CommonArea/index.tsx b/icons/src/CommonArea/index.tsx deleted file mode 100644 index ceb6d5bce8..0000000000 --- a/icons/src/CommonArea/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CommonAreaIcon: React.FC = props => { - return -} diff --git a/icons/src/Compass/index.tsx b/icons/src/Compass/index.tsx deleted file mode 100644 index 822bbd35a9..0000000000 --- a/icons/src/Compass/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CompassIcon: React.FC = props => { - return -} diff --git a/icons/src/Computer/index.tsx b/icons/src/Computer/index.tsx deleted file mode 100644 index 815c25d316..0000000000 --- a/icons/src/Computer/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ComputerIcon: React.FC = props => { - return -} diff --git a/icons/src/Connection/index.tsx b/icons/src/Connection/index.tsx deleted file mode 100644 index bd64dce219..0000000000 --- a/icons/src/Connection/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ConnectionIcon: React.FC = props => { - return -} diff --git a/icons/src/Contract/index.tsx b/icons/src/Contract/index.tsx deleted file mode 100644 index fd26c416f6..0000000000 --- a/icons/src/Contract/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ContractIcon: React.FC = props => { - return -} diff --git a/icons/src/ControlBackward/index.tsx b/icons/src/ControlBackward/index.tsx deleted file mode 100644 index a622e6285c..0000000000 --- a/icons/src/ControlBackward/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ControlBackwardIcon: React.FC = props => { - return -} diff --git a/icons/src/ControlForward/index.tsx b/icons/src/ControlForward/index.tsx deleted file mode 100644 index 505f61fd38..0000000000 --- a/icons/src/ControlForward/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ControlForwardIcon: React.FC = props => { - return -} diff --git a/icons/src/ControlPause/index.tsx b/icons/src/ControlPause/index.tsx deleted file mode 100644 index e16aecaf61..0000000000 --- a/icons/src/ControlPause/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ControlPauseIcon: React.FC = props => { - return -} diff --git a/icons/src/ControlStop/index.tsx b/icons/src/ControlStop/index.tsx deleted file mode 100644 index 7b1f1037fb..0000000000 --- a/icons/src/ControlStop/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ControlStopIcon: React.FC = props => { - return -} diff --git a/icons/src/Copy/index.tsx b/icons/src/Copy/index.tsx deleted file mode 100644 index 174f830873..0000000000 --- a/icons/src/Copy/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CopyIcon: React.FC = props => { - return -} diff --git a/icons/src/CoverLetter/index.tsx b/icons/src/CoverLetter/index.tsx deleted file mode 100644 index f572d65ead..0000000000 --- a/icons/src/CoverLetter/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CoverLetterIcon: React.FC = props => { - return -} diff --git a/icons/src/Create/index.tsx b/icons/src/Create/index.tsx deleted file mode 100644 index 205fdb145e..0000000000 --- a/icons/src/Create/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CreateIcon: React.FC = props => { - return -} diff --git a/icons/src/CreditCard/index.tsx b/icons/src/CreditCard/index.tsx deleted file mode 100644 index c2af0f05c5..0000000000 --- a/icons/src/CreditCard/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CreditCardIcon: React.FC = props => { - return -} diff --git a/icons/src/CrescentMoon/index.tsx b/icons/src/CrescentMoon/index.tsx deleted file mode 100644 index 71814b0d08..0000000000 --- a/icons/src/CrescentMoon/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CrescentMoonIcon: React.FC = props => { - return -} diff --git a/icons/src/CrescentMoonOutline/index.tsx b/icons/src/CrescentMoonOutline/index.tsx deleted file mode 100644 index 6b9bbe1615..0000000000 --- a/icons/src/CrescentMoonOutline/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CrescentMoonOutlineIcon: React.FC = props => { - return -} diff --git a/icons/src/Cross/index.tsx b/icons/src/Cross/index.tsx deleted file mode 100644 index e205c5cdb3..0000000000 --- a/icons/src/Cross/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CrossIcon: React.FC = props => { - return -} diff --git a/icons/src/CrossTarget/index.tsx b/icons/src/CrossTarget/index.tsx deleted file mode 100644 index 2d12443ab5..0000000000 --- a/icons/src/CrossTarget/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CrossTargetIcon: React.FC = props => { - return -} diff --git a/icons/src/Crown/index.tsx b/icons/src/Crown/index.tsx deleted file mode 100644 index ed8c20c309..0000000000 --- a/icons/src/Crown/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CrownIcon: React.FC = props => { - return -} diff --git a/icons/src/Csv/index.tsx b/icons/src/Csv/index.tsx deleted file mode 100644 index af1d5f4ac9..0000000000 --- a/icons/src/Csv/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const CsvIcon: React.FC = props => { - return -} diff --git a/icons/src/Date/index.tsx b/icons/src/Date/index.tsx deleted file mode 100644 index 645a1168f8..0000000000 --- a/icons/src/Date/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const DateIcon: React.FC = props => { - return -} diff --git a/icons/src/Department/index.tsx b/icons/src/Department/index.tsx deleted file mode 100644 index 132c11f5ab..0000000000 --- a/icons/src/Department/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const DepartmentIcon: React.FC = props => { - return -} diff --git a/icons/src/Details/index.tsx b/icons/src/Details/index.tsx deleted file mode 100644 index 8b32903d8d..0000000000 --- a/icons/src/Details/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const DetailsIcon: React.FC = props => { - return -} diff --git a/icons/src/Diamond/index.tsx b/icons/src/Diamond/index.tsx deleted file mode 100644 index fb96404d06..0000000000 --- a/icons/src/Diamond/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const DiamondIcon: React.FC = props => { - return -} diff --git a/icons/src/Dish/index.tsx b/icons/src/Dish/index.tsx deleted file mode 100644 index 9123b18055..0000000000 --- a/icons/src/Dish/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const DishIcon: React.FC = props => { - return -} diff --git a/icons/src/Doc/index.tsx b/icons/src/Doc/index.tsx deleted file mode 100644 index e2d9722ff5..0000000000 --- a/icons/src/Doc/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const DocIcon: React.FC = props => { - return -} diff --git a/icons/src/Docx/index.tsx b/icons/src/Docx/index.tsx deleted file mode 100644 index d16f4f8c72..0000000000 --- a/icons/src/Docx/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const DocxIcon: React.FC = props => { - return -} diff --git a/icons/src/Down/index.tsx b/icons/src/Down/index.tsx deleted file mode 100644 index 75a9d0076e..0000000000 --- a/icons/src/Down/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const DownIcon: React.FC = props => { - return -} diff --git a/icons/src/Download/index.tsx b/icons/src/Download/index.tsx deleted file mode 100644 index 7df912993e..0000000000 --- a/icons/src/Download/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const DownloadIcon: React.FC = props => { - return -} diff --git a/icons/src/DragAndDrop/index.tsx b/icons/src/DragAndDrop/index.tsx deleted file mode 100644 index 4053484036..0000000000 --- a/icons/src/DragAndDrop/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const DragAndDropIcon: React.FC = props => { - return -} diff --git a/icons/src/Dribbble/index.tsx b/icons/src/Dribbble/index.tsx deleted file mode 100644 index 8c2c72daa3..0000000000 --- a/icons/src/Dribbble/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const DribbbleIcon: React.FC = props => { - return -} diff --git a/icons/src/Earth/index.tsx b/icons/src/Earth/index.tsx deleted file mode 100644 index 637797e9c7..0000000000 --- a/icons/src/Earth/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const EarthIcon: React.FC = props => { - return -} diff --git a/icons/src/Edit/index.tsx b/icons/src/Edit/index.tsx deleted file mode 100644 index b0c7c1ffa5..0000000000 --- a/icons/src/Edit/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const EditIcon: React.FC = props => { - return -} diff --git a/icons/src/EducationLevel/index.tsx b/icons/src/EducationLevel/index.tsx deleted file mode 100644 index 87e11ac256..0000000000 --- a/icons/src/EducationLevel/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const EducationLevelIcon: React.FC = props => { - return -} diff --git a/icons/src/Email/index.tsx b/icons/src/Email/index.tsx deleted file mode 100644 index a5dcadd09b..0000000000 --- a/icons/src/Email/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const EmailIcon: React.FC = props => { - return -} diff --git a/icons/src/EmailOutline/index.tsx b/icons/src/EmailOutline/index.tsx deleted file mode 100644 index f5168e2f1a..0000000000 --- a/icons/src/EmailOutline/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const EmailOutlineIcon: React.FC = props => { - return -} diff --git a/icons/src/Eot/index.tsx b/icons/src/Eot/index.tsx deleted file mode 100644 index 19bb11cada..0000000000 --- a/icons/src/Eot/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const EotIcon: React.FC = props => { - return -} diff --git a/icons/src/Equal/index.tsx b/icons/src/Equal/index.tsx deleted file mode 100644 index ff16a9e291..0000000000 --- a/icons/src/Equal/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const EqualIcon: React.FC = props => { - return -} diff --git a/icons/src/EuroCurrency/index.tsx b/icons/src/EuroCurrency/index.tsx deleted file mode 100644 index f30c31e25d..0000000000 --- a/icons/src/EuroCurrency/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const EuroCurrencyIcon: React.FC = props => { - return -} diff --git a/icons/src/Expand/index.tsx b/icons/src/Expand/index.tsx deleted file mode 100644 index 41804e03ff..0000000000 --- a/icons/src/Expand/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ExpandIcon: React.FC = props => { - return -} diff --git a/icons/src/ExpandText/index.tsx b/icons/src/ExpandText/index.tsx deleted file mode 100644 index 2e73e34644..0000000000 --- a/icons/src/ExpandText/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ExpandTextIcon: React.FC = props => { - return -} diff --git a/icons/src/Extend/index.tsx b/icons/src/Extend/index.tsx deleted file mode 100644 index 5a20c24146..0000000000 --- a/icons/src/Extend/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ExtendIcon: React.FC = props => { - return -} diff --git a/icons/src/ExternalLink/index.tsx b/icons/src/ExternalLink/index.tsx deleted file mode 100644 index b8595d3c6e..0000000000 --- a/icons/src/ExternalLink/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ExternalLinkIcon: React.FC = props => { - return -} diff --git a/icons/src/Facebook/index.tsx b/icons/src/Facebook/index.tsx deleted file mode 100644 index 099bfe1a9f..0000000000 --- a/icons/src/Facebook/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const FacebookIcon: React.FC = props => { - return -} diff --git a/icons/src/Factory/index.tsx b/icons/src/Factory/index.tsx deleted file mode 100644 index 85f87de7ab..0000000000 --- a/icons/src/Factory/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const FactoryIcon: React.FC = props => { - return -} diff --git a/icons/src/Female/index.tsx b/icons/src/Female/index.tsx deleted file mode 100644 index d50ee5aa13..0000000000 --- a/icons/src/Female/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const FemaleIcon: React.FC = props => { - return -} diff --git a/icons/src/Filters/index.tsx b/icons/src/Filters/index.tsx deleted file mode 100644 index e2b33b6522..0000000000 --- a/icons/src/Filters/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const FiltersIcon: React.FC = props => { - return -} diff --git a/icons/src/Fingerprint/index.tsx b/icons/src/Fingerprint/index.tsx deleted file mode 100644 index c218e91c97..0000000000 --- a/icons/src/Fingerprint/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const FingerprintIcon: React.FC = props => { - return -} diff --git a/icons/src/Flag/index.tsx b/icons/src/Flag/index.tsx deleted file mode 100644 index bc016f87b3..0000000000 --- a/icons/src/Flag/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const FlagIcon: React.FC = props => { - return -} diff --git a/icons/src/FlagCs/index.tsx b/icons/src/FlagCs/index.tsx deleted file mode 100644 index b9fae2f96d..0000000000 --- a/icons/src/FlagCs/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const FlagCsIcon: React.FC = props => { - return -} diff --git a/icons/src/FlagEn/index.tsx b/icons/src/FlagEn/index.tsx deleted file mode 100644 index c628034752..0000000000 --- a/icons/src/FlagEn/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const FlagEnIcon: React.FC = props => { - return -} diff --git a/icons/src/FlagEs/index.tsx b/icons/src/FlagEs/index.tsx deleted file mode 100644 index 14545b87b8..0000000000 --- a/icons/src/FlagEs/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const FlagEsIcon: React.FC = props => { - return -} diff --git a/icons/src/FlagFr/index.tsx b/icons/src/FlagFr/index.tsx deleted file mode 100644 index 07a8a51b8d..0000000000 --- a/icons/src/FlagFr/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const FlagFrIcon: React.FC = props => { - return -} diff --git a/icons/src/FlagOutline/index.tsx b/icons/src/FlagOutline/index.tsx deleted file mode 100644 index fce86ce165..0000000000 --- a/icons/src/FlagOutline/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const FlagOutlineIcon: React.FC = props => { - return -} diff --git a/icons/src/FlagPointed/index.tsx b/icons/src/FlagPointed/index.tsx deleted file mode 100644 index d71c57469e..0000000000 --- a/icons/src/FlagPointed/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const FlagPointedIcon: React.FC = props => { - return -} diff --git a/icons/src/FlagSk/index.tsx b/icons/src/FlagSk/index.tsx deleted file mode 100644 index 91d891a87e..0000000000 --- a/icons/src/FlagSk/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const FlagSkIcon: React.FC = props => { - return -} diff --git a/icons/src/FlagUs/index.tsx b/icons/src/FlagUs/index.tsx deleted file mode 100644 index 79c253ae4b..0000000000 --- a/icons/src/FlagUs/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const FlagUsIcon: React.FC = props => { - return -} diff --git a/icons/src/Folder/index.tsx b/icons/src/Folder/index.tsx deleted file mode 100644 index c233a723bc..0000000000 --- a/icons/src/Folder/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const FolderIcon: React.FC = props => { - return -} diff --git a/icons/src/FullscreenOff/index.tsx b/icons/src/FullscreenOff/index.tsx deleted file mode 100644 index 89b0b6d08a..0000000000 --- a/icons/src/FullscreenOff/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const FullscreenOffIcon: React.FC = props => { - return -} diff --git a/icons/src/FullscreenOn/index.tsx b/icons/src/FullscreenOn/index.tsx deleted file mode 100644 index e56537416a..0000000000 --- a/icons/src/FullscreenOn/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const FullscreenOnIcon: React.FC = props => { - return -} diff --git a/icons/src/Gear/index.tsx b/icons/src/Gear/index.tsx deleted file mode 100644 index 0ab969b52a..0000000000 --- a/icons/src/Gear/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const GearIcon: React.FC = props => { - return -} diff --git a/icons/src/Gif/index.tsx b/icons/src/Gif/index.tsx deleted file mode 100644 index 85aa653af3..0000000000 --- a/icons/src/Gif/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const GifIcon: React.FC = props => { - return -} diff --git a/icons/src/Github/index.tsx b/icons/src/Github/index.tsx deleted file mode 100644 index 14236da5b7..0000000000 --- a/icons/src/Github/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const GithubIcon: React.FC = props => { - return -} diff --git a/icons/src/Google/index.tsx b/icons/src/Google/index.tsx deleted file mode 100644 index 65bcc2d6d0..0000000000 --- a/icons/src/Google/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const GoogleIcon: React.FC = props => { - return -} diff --git a/icons/src/Handshake/index.tsx b/icons/src/Handshake/index.tsx deleted file mode 100644 index 9159b1f52f..0000000000 --- a/icons/src/Handshake/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const HandshakeIcon: React.FC = props => { - return -} diff --git a/icons/src/HardHat/index.tsx b/icons/src/HardHat/index.tsx deleted file mode 100644 index 3ec1ec9da6..0000000000 --- a/icons/src/HardHat/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const HardHatIcon: React.FC = props => { - return -} diff --git a/icons/src/Hashtag/index.tsx b/icons/src/Hashtag/index.tsx deleted file mode 100644 index c014670096..0000000000 --- a/icons/src/Hashtag/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const HashtagIcon: React.FC = props => { - return -} diff --git a/icons/src/Heading/index.tsx b/icons/src/Heading/index.tsx deleted file mode 100644 index e4ddab6d76..0000000000 --- a/icons/src/Heading/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const HeadingIcon: React.FC = props => { - return -} diff --git a/icons/src/Heading1/index.tsx b/icons/src/Heading1/index.tsx deleted file mode 100644 index 1ec1122725..0000000000 --- a/icons/src/Heading1/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const Heading1Icon: React.FC = props => { - return -} diff --git a/icons/src/Heading2/index.tsx b/icons/src/Heading2/index.tsx deleted file mode 100644 index 77042d05e8..0000000000 --- a/icons/src/Heading2/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const Heading2Icon: React.FC = props => { - return -} diff --git a/icons/src/Heading3/index.tsx b/icons/src/Heading3/index.tsx deleted file mode 100644 index 90f59a73f4..0000000000 --- a/icons/src/Heading3/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const Heading3Icon: React.FC = props => { - return -} diff --git a/icons/src/Heading4/index.tsx b/icons/src/Heading4/index.tsx deleted file mode 100644 index 580a0683cc..0000000000 --- a/icons/src/Heading4/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const Heading4Icon: React.FC = props => { - return -} diff --git a/icons/src/Heading5/index.tsx b/icons/src/Heading5/index.tsx deleted file mode 100644 index 1843908616..0000000000 --- a/icons/src/Heading5/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const Heading5Icon: React.FC = props => { - return -} diff --git a/icons/src/Heading6/index.tsx b/icons/src/Heading6/index.tsx deleted file mode 100644 index 2c7c29a6fc..0000000000 --- a/icons/src/Heading6/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const Heading6Icon: React.FC = props => { - return -} diff --git a/icons/src/Headset/index.tsx b/icons/src/Headset/index.tsx deleted file mode 100644 index 6b964638c6..0000000000 --- a/icons/src/Headset/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const HeadsetIcon: React.FC = props => { - return -} diff --git a/icons/src/Heart/index.tsx b/icons/src/Heart/index.tsx deleted file mode 100644 index 0a047ae1ab..0000000000 --- a/icons/src/Heart/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const HeartIcon: React.FC = props => { - return -} diff --git a/icons/src/HeartOutline/index.tsx b/icons/src/HeartOutline/index.tsx deleted file mode 100644 index 41680b53d5..0000000000 --- a/icons/src/HeartOutline/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const HeartOutlineIcon: React.FC = props => { - return -} diff --git a/icons/src/HeartShiny/index.tsx b/icons/src/HeartShiny/index.tsx deleted file mode 100644 index 864a1f1899..0000000000 --- a/icons/src/HeartShiny/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const HeartShinyIcon: React.FC = props => { - return -} diff --git a/icons/src/Hide/index.tsx b/icons/src/Hide/index.tsx deleted file mode 100644 index 49000c1193..0000000000 --- a/icons/src/Hide/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const HideIcon: React.FC = props => { - return -} diff --git a/icons/src/Home/index.tsx b/icons/src/Home/index.tsx deleted file mode 100644 index 33c17d1c6a..0000000000 --- a/icons/src/Home/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const HomeIcon: React.FC = props => { - return -} diff --git a/icons/src/House/index.tsx b/icons/src/House/index.tsx deleted file mode 100644 index 2e1bf2e336..0000000000 --- a/icons/src/House/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const HouseIcon: React.FC = props => { - return -} diff --git a/icons/src/InProgressCandidate/index.tsx b/icons/src/InProgressCandidate/index.tsx deleted file mode 100644 index 8a9c1d170a..0000000000 --- a/icons/src/InProgressCandidate/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const InProgressCandidateIcon: React.FC = props => { - return -} diff --git a/icons/src/Information/index.tsx b/icons/src/Information/index.tsx deleted file mode 100644 index ed3deeaf76..0000000000 --- a/icons/src/Information/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const InformationIcon: React.FC = props => { - return -} diff --git a/icons/src/InformationOutline/index.tsx b/icons/src/InformationOutline/index.tsx deleted file mode 100644 index 361397ac72..0000000000 --- a/icons/src/InformationOutline/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const InformationOutlineIcon: React.FC = props => { - return -} diff --git a/icons/src/Instagram/index.tsx b/icons/src/Instagram/index.tsx deleted file mode 100644 index d253fd751c..0000000000 --- a/icons/src/Instagram/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const InstagramIcon: React.FC = props => { - return -} diff --git a/icons/src/Italic/index.tsx b/icons/src/Italic/index.tsx deleted file mode 100644 index c3d1b11b09..0000000000 --- a/icons/src/Italic/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ItalicIcon: React.FC = props => { - return -} diff --git a/icons/src/Jpeg/index.tsx b/icons/src/Jpeg/index.tsx deleted file mode 100644 index 8fcae12d82..0000000000 --- a/icons/src/Jpeg/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const JpegIcon: React.FC = props => { - return -} diff --git a/icons/src/Jpg/index.tsx b/icons/src/Jpg/index.tsx deleted file mode 100644 index a207153c4f..0000000000 --- a/icons/src/Jpg/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const JpgIcon: React.FC = props => { - return -} diff --git a/icons/src/JusticeHammer/index.tsx b/icons/src/JusticeHammer/index.tsx deleted file mode 100644 index 387683882e..0000000000 --- a/icons/src/JusticeHammer/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const JusticeHammerIcon: React.FC = props => { - return -} diff --git a/icons/src/Kanban/index.tsx b/icons/src/Kanban/index.tsx deleted file mode 100644 index 56b2e3979f..0000000000 --- a/icons/src/Kanban/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const KanbanIcon: React.FC = props => { - return -} diff --git a/icons/src/Key/index.tsx b/icons/src/Key/index.tsx deleted file mode 100644 index 8209309bf8..0000000000 --- a/icons/src/Key/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const KeyIcon: React.FC = props => { - return -} diff --git a/icons/src/Language/index.tsx b/icons/src/Language/index.tsx deleted file mode 100644 index f08978cfd5..0000000000 --- a/icons/src/Language/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const LanguageIcon: React.FC = props => { - return -} diff --git a/icons/src/Leaf/index.tsx b/icons/src/Leaf/index.tsx deleted file mode 100644 index f0725f22d2..0000000000 --- a/icons/src/Leaf/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const LeafIcon: React.FC = props => { - return -} diff --git a/icons/src/Left/index.tsx b/icons/src/Left/index.tsx deleted file mode 100644 index e626d0435d..0000000000 --- a/icons/src/Left/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const LeftIcon: React.FC = props => { - return -} diff --git a/icons/src/LineChart/index.tsx b/icons/src/LineChart/index.tsx deleted file mode 100644 index 97de066b76..0000000000 --- a/icons/src/LineChart/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const LineChartIcon: React.FC = props => { - return -} diff --git a/icons/src/Link/index.tsx b/icons/src/Link/index.tsx deleted file mode 100644 index 9c39b9d029..0000000000 --- a/icons/src/Link/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const LinkIcon: React.FC = props => { - return -} diff --git a/icons/src/Linkedin/index.tsx b/icons/src/Linkedin/index.tsx deleted file mode 100644 index b5b458a647..0000000000 --- a/icons/src/Linkedin/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const LinkedinIcon: React.FC = props => { - return -} diff --git a/icons/src/Location/index.tsx b/icons/src/Location/index.tsx deleted file mode 100644 index c17f213e61..0000000000 --- a/icons/src/Location/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const LocationIcon: React.FC = props => { - return -} diff --git a/icons/src/Lock/index.tsx b/icons/src/Lock/index.tsx deleted file mode 100644 index 0a7bbd585b..0000000000 --- a/icons/src/Lock/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const LockIcon: React.FC = props => { - return -} diff --git a/icons/src/LockRounded/index.tsx b/icons/src/LockRounded/index.tsx deleted file mode 100644 index 02e369bc99..0000000000 --- a/icons/src/LockRounded/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const LockRoundedIcon: React.FC = props => { - return -} diff --git a/icons/src/LogOut/index.tsx b/icons/src/LogOut/index.tsx deleted file mode 100644 index 51b745a367..0000000000 --- a/icons/src/LogOut/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const LogOutIcon: React.FC = props => { - return -} diff --git a/icons/src/Male/index.tsx b/icons/src/Male/index.tsx deleted file mode 100644 index 5cba07f740..0000000000 --- a/icons/src/Male/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const MaleIcon: React.FC = props => { - return -} diff --git a/icons/src/Map/index.tsx b/icons/src/Map/index.tsx deleted file mode 100644 index 397b37981f..0000000000 --- a/icons/src/Map/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const MapIcon: React.FC = props => { - return -} diff --git a/icons/src/Masonry/index.tsx b/icons/src/Masonry/index.tsx deleted file mode 100644 index 22c4d84380..0000000000 --- a/icons/src/Masonry/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const MasonryIcon: React.FC = props => { - return -} diff --git a/icons/src/Masonry2/index.tsx b/icons/src/Masonry2/index.tsx deleted file mode 100644 index 888cf883ed..0000000000 --- a/icons/src/Masonry2/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const Masonry2Icon: React.FC = props => { - return -} diff --git a/icons/src/MeetingRoom/index.tsx b/icons/src/MeetingRoom/index.tsx deleted file mode 100644 index edf90f9c60..0000000000 --- a/icons/src/MeetingRoom/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const MeetingRoomIcon: React.FC = props => { - return -} diff --git a/icons/src/Megaphone/index.tsx b/icons/src/Megaphone/index.tsx deleted file mode 100644 index 372134545a..0000000000 --- a/icons/src/Megaphone/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const MegaphoneIcon: React.FC = props => { - return -} diff --git a/icons/src/Mention/index.tsx b/icons/src/Mention/index.tsx deleted file mode 100644 index 3ec135e0cc..0000000000 --- a/icons/src/Mention/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const MentionIcon: React.FC = props => { - return -} diff --git a/icons/src/Menu/index.tsx b/icons/src/Menu/index.tsx deleted file mode 100644 index 8130311bf3..0000000000 --- a/icons/src/Menu/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const MenuIcon: React.FC = props => { - return -} diff --git a/icons/src/Mic/index.tsx b/icons/src/Mic/index.tsx deleted file mode 100644 index 67430b1b24..0000000000 --- a/icons/src/Mic/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const MicIcon: React.FC = props => { - return -} diff --git a/icons/src/MicrophoneOff/index.tsx b/icons/src/MicrophoneOff/index.tsx deleted file mode 100644 index ee0d1970e9..0000000000 --- a/icons/src/MicrophoneOff/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const MicrophoneOffIcon: React.FC = props => { - return -} diff --git a/icons/src/MicrophoneOn/index.tsx b/icons/src/MicrophoneOn/index.tsx deleted file mode 100644 index 00db00dc47..0000000000 --- a/icons/src/MicrophoneOn/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const MicrophoneOnIcon: React.FC = props => { - return -} diff --git a/icons/src/Microship/index.tsx b/icons/src/Microship/index.tsx deleted file mode 100644 index 67bb67bf69..0000000000 --- a/icons/src/Microship/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const MicroshipIcon: React.FC = props => { - return -} diff --git a/icons/src/Mobile/index.tsx b/icons/src/Mobile/index.tsx deleted file mode 100644 index 955d8d564b..0000000000 --- a/icons/src/Mobile/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const MobileIcon: React.FC = props => { - return -} diff --git a/icons/src/Money/index.tsx b/icons/src/Money/index.tsx deleted file mode 100644 index d2445666db..0000000000 --- a/icons/src/Money/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const MoneyIcon: React.FC = props => { - return -} diff --git a/icons/src/More/index.tsx b/icons/src/More/index.tsx deleted file mode 100644 index 21db4da5f9..0000000000 --- a/icons/src/More/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const MoreIcon: React.FC = props => { - return -} diff --git a/icons/src/MoreAndroid/index.tsx b/icons/src/MoreAndroid/index.tsx deleted file mode 100644 index 82011e010b..0000000000 --- a/icons/src/MoreAndroid/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const MoreAndroidIcon: React.FC = props => { - return -} diff --git a/icons/src/Mountain/index.tsx b/icons/src/Mountain/index.tsx deleted file mode 100644 index 6443fe83b4..0000000000 --- a/icons/src/Mountain/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const MountainIcon: React.FC = props => { - return -} diff --git a/icons/src/Move/index.tsx b/icons/src/Move/index.tsx deleted file mode 100644 index bb409dda4f..0000000000 --- a/icons/src/Move/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const MoveIcon: React.FC = props => { - return -} diff --git a/icons/src/Music/index.tsx b/icons/src/Music/index.tsx deleted file mode 100644 index 5ec6d45436..0000000000 --- a/icons/src/Music/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const MusicIcon: React.FC = props => { - return -} diff --git a/icons/src/Negative/index.tsx b/icons/src/Negative/index.tsx deleted file mode 100644 index 572b004c46..0000000000 --- a/icons/src/Negative/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const NegativeIcon: React.FC = props => { - return -} diff --git a/icons/src/NegativeOutline/index.tsx b/icons/src/NegativeOutline/index.tsx deleted file mode 100644 index 27d8fefe86..0000000000 --- a/icons/src/NegativeOutline/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const NegativeOutlineIcon: React.FC = props => { - return -} diff --git a/icons/src/NegativeStraight/index.tsx b/icons/src/NegativeStraight/index.tsx deleted file mode 100644 index 348bd285bc..0000000000 --- a/icons/src/NegativeStraight/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const NegativeStraightIcon: React.FC = props => { - return -} diff --git a/icons/src/NewCandidate/index.tsx b/icons/src/NewCandidate/index.tsx deleted file mode 100644 index b1c9feacf9..0000000000 --- a/icons/src/NewCandidate/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const NewCandidateIcon: React.FC = props => { - return -} diff --git a/icons/src/Notification/index.tsx b/icons/src/Notification/index.tsx deleted file mode 100644 index cca473e6f8..0000000000 --- a/icons/src/Notification/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const NotificationIcon: React.FC = props => { - return -} diff --git a/icons/src/Npm/index.tsx b/icons/src/Npm/index.tsx deleted file mode 100644 index 499375b3a7..0000000000 --- a/icons/src/Npm/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const NpmIcon: React.FC = props => { - return -} diff --git a/icons/src/OfferStatus/index.tsx b/icons/src/OfferStatus/index.tsx deleted file mode 100644 index 55b8799062..0000000000 --- a/icons/src/OfferStatus/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const OfferStatusIcon: React.FC = props => { - return -} diff --git a/icons/src/Office/index.tsx b/icons/src/Office/index.tsx deleted file mode 100644 index fa73c75e45..0000000000 --- a/icons/src/Office/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const OfficeIcon: React.FC = props => { - return -} diff --git a/icons/src/OrderedList/index.tsx b/icons/src/OrderedList/index.tsx deleted file mode 100644 index 322355806e..0000000000 --- a/icons/src/OrderedList/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const OrderedListIcon: React.FC = props => { - return -} diff --git a/icons/src/Origine/index.tsx b/icons/src/Origine/index.tsx deleted file mode 100644 index b2d03c44f6..0000000000 --- a/icons/src/Origine/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const OrigineIcon: React.FC = props => { - return -} diff --git a/icons/src/Paperplane/index.tsx b/icons/src/Paperplane/index.tsx deleted file mode 100644 index cbb6748f33..0000000000 --- a/icons/src/Paperplane/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const PaperplaneIcon: React.FC = props => { - return -} diff --git a/icons/src/Pdf/index.tsx b/icons/src/Pdf/index.tsx deleted file mode 100644 index ca3795486f..0000000000 --- a/icons/src/Pdf/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const PdfIcon: React.FC = props => { - return -} diff --git a/icons/src/Pencil/index.tsx b/icons/src/Pencil/index.tsx deleted file mode 100644 index de7e246706..0000000000 --- a/icons/src/Pencil/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const PencilIcon: React.FC = props => { - return -} diff --git a/icons/src/Phone/index.tsx b/icons/src/Phone/index.tsx deleted file mode 100644 index 0813d9e4ed..0000000000 --- a/icons/src/Phone/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const PhoneIcon: React.FC = props => { - return -} diff --git a/icons/src/PhoneOutline/index.tsx b/icons/src/PhoneOutline/index.tsx deleted file mode 100644 index de050dff53..0000000000 --- a/icons/src/PhoneOutline/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const PhoneOutlineIcon: React.FC = props => { - return -} diff --git a/icons/src/Pictures/index.tsx b/icons/src/Pictures/index.tsx deleted file mode 100644 index f77e028ad5..0000000000 --- a/icons/src/Pictures/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const PicturesIcon: React.FC = props => { - return -} diff --git a/icons/src/Piechart/index.tsx b/icons/src/Piechart/index.tsx deleted file mode 100644 index bdc1ca71cf..0000000000 --- a/icons/src/Piechart/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const PiechartIcon: React.FC = props => { - return -} diff --git a/icons/src/Pin/index.tsx b/icons/src/Pin/index.tsx deleted file mode 100644 index fb00cd3070..0000000000 --- a/icons/src/Pin/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const PinIcon: React.FC = props => { - return -} diff --git a/icons/src/Pinterest/index.tsx b/icons/src/Pinterest/index.tsx deleted file mode 100644 index 0247fd92eb..0000000000 --- a/icons/src/Pinterest/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const PinterestIcon: React.FC = props => { - return -} diff --git a/icons/src/Pizza/index.tsx b/icons/src/Pizza/index.tsx deleted file mode 100644 index 98fc42ce82..0000000000 --- a/icons/src/Pizza/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const PizzaIcon: React.FC = props => { - return -} diff --git a/icons/src/Play/index.tsx b/icons/src/Play/index.tsx deleted file mode 100644 index d514790b43..0000000000 --- a/icons/src/Play/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const PlayIcon: React.FC = props => { - return -} diff --git a/icons/src/PlayOutline/index.tsx b/icons/src/PlayOutline/index.tsx deleted file mode 100644 index a5056d9732..0000000000 --- a/icons/src/PlayOutline/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const PlayOutlineIcon: React.FC = props => { - return -} diff --git a/icons/src/Playlist/index.tsx b/icons/src/Playlist/index.tsx deleted file mode 100644 index d2885b74ce..0000000000 --- a/icons/src/Playlist/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const PlaylistIcon: React.FC = props => { - return -} diff --git a/icons/src/Png/index.tsx b/icons/src/Png/index.tsx deleted file mode 100644 index e335637955..0000000000 --- a/icons/src/Png/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const PngIcon: React.FC = props => { - return -} diff --git a/icons/src/Podcast/index.tsx b/icons/src/Podcast/index.tsx deleted file mode 100644 index 4e85fa815d..0000000000 --- a/icons/src/Podcast/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const PodcastIcon: React.FC = props => { - return -} diff --git a/icons/src/Positive/index.tsx b/icons/src/Positive/index.tsx deleted file mode 100644 index a3725f3214..0000000000 --- a/icons/src/Positive/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const PositiveIcon: React.FC = props => { - return -} diff --git a/icons/src/PositiveOutline/index.tsx b/icons/src/PositiveOutline/index.tsx deleted file mode 100644 index 1e68c3f94a..0000000000 --- a/icons/src/PositiveOutline/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const PositiveOutlineIcon: React.FC = props => { - return -} diff --git a/icons/src/PositiveStraight/index.tsx b/icons/src/PositiveStraight/index.tsx deleted file mode 100644 index 44c5214cf6..0000000000 --- a/icons/src/PositiveStraight/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const PositiveStraightIcon: React.FC = props => { - return -} diff --git a/icons/src/Ppt/index.tsx b/icons/src/Ppt/index.tsx deleted file mode 100644 index fd4264374b..0000000000 --- a/icons/src/Ppt/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const PptIcon: React.FC = props => { - return -} diff --git a/icons/src/Print/index.tsx b/icons/src/Print/index.tsx deleted file mode 100644 index b1a4b4bb91..0000000000 --- a/icons/src/Print/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const PrintIcon: React.FC = props => { - return -} diff --git a/icons/src/Promote/index.tsx b/icons/src/Promote/index.tsx deleted file mode 100644 index cecda9a406..0000000000 --- a/icons/src/Promote/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const PromoteIcon: React.FC = props => { - return -} diff --git a/icons/src/Puzzle/index.tsx b/icons/src/Puzzle/index.tsx deleted file mode 100644 index 630319c604..0000000000 --- a/icons/src/Puzzle/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const PuzzleIcon: React.FC = props => { - return -} diff --git a/icons/src/PuzzleOutline/index.tsx b/icons/src/PuzzleOutline/index.tsx deleted file mode 100644 index a28977b862..0000000000 --- a/icons/src/PuzzleOutline/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const PuzzleOutlineIcon: React.FC = props => { - return -} diff --git a/icons/src/Question/index.tsx b/icons/src/Question/index.tsx deleted file mode 100644 index dade6c66bb..0000000000 --- a/icons/src/Question/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const QuestionIcon: React.FC = props => { - return -} diff --git a/icons/src/Questions/index.tsx b/icons/src/Questions/index.tsx deleted file mode 100644 index 5c54bdcf2d..0000000000 --- a/icons/src/Questions/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const QuestionsIcon: React.FC = props => { - return -} diff --git a/icons/src/Quote/index.tsx b/icons/src/Quote/index.tsx deleted file mode 100644 index 349a2cf2aa..0000000000 --- a/icons/src/Quote/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const QuoteIcon: React.FC = props => { - return -} diff --git a/icons/src/Refresh/index.tsx b/icons/src/Refresh/index.tsx deleted file mode 100644 index 4c7e973f29..0000000000 --- a/icons/src/Refresh/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const RefreshIcon: React.FC = props => { - return -} diff --git a/icons/src/RefuseCandidate/index.tsx b/icons/src/RefuseCandidate/index.tsx deleted file mode 100644 index d67aabea34..0000000000 --- a/icons/src/RefuseCandidate/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const RefuseCandidateIcon: React.FC = props => { - return -} diff --git a/icons/src/Remote/index.tsx b/icons/src/Remote/index.tsx deleted file mode 100644 index 7a4850f124..0000000000 --- a/icons/src/Remote/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const RemoteIcon: React.FC = props => { - return -} diff --git a/icons/src/Remove/index.tsx b/icons/src/Remove/index.tsx deleted file mode 100644 index 6594426cef..0000000000 --- a/icons/src/Remove/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const RemoveIcon: React.FC = props => { - return -} diff --git a/icons/src/Reset/index.tsx b/icons/src/Reset/index.tsx deleted file mode 100644 index 18f290bfb7..0000000000 --- a/icons/src/Reset/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ResetIcon: React.FC = props => { - return -} diff --git a/icons/src/Resume/index.tsx b/icons/src/Resume/index.tsx deleted file mode 100644 index 730eee5225..0000000000 --- a/icons/src/Resume/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ResumeIcon: React.FC = props => { - return -} diff --git a/icons/src/Review/index.tsx b/icons/src/Review/index.tsx deleted file mode 100644 index 5e7b51a6bb..0000000000 --- a/icons/src/Review/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ReviewIcon: React.FC = props => { - return -} diff --git a/icons/src/ReviewOutline/index.tsx b/icons/src/ReviewOutline/index.tsx deleted file mode 100644 index 14e1567bf4..0000000000 --- a/icons/src/ReviewOutline/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ReviewOutlineIcon: React.FC = props => { - return -} diff --git a/icons/src/Right/index.tsx b/icons/src/Right/index.tsx deleted file mode 100644 index c991fdfbe6..0000000000 --- a/icons/src/Right/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const RightIcon: React.FC = props => { - return -} diff --git a/icons/src/Salary/index.tsx b/icons/src/Salary/index.tsx deleted file mode 100644 index 43d8aaab8d..0000000000 --- a/icons/src/Salary/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const SalaryIcon: React.FC = props => { - return -} diff --git a/icons/src/Save/index.tsx b/icons/src/Save/index.tsx deleted file mode 100644 index 57804d75b5..0000000000 --- a/icons/src/Save/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const SaveIcon: React.FC = props => { - return -} diff --git a/icons/src/ScreenshareOff/index.tsx b/icons/src/ScreenshareOff/index.tsx deleted file mode 100644 index dbe02dc2b4..0000000000 --- a/icons/src/ScreenshareOff/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ScreenshareOffIcon: React.FC = props => { - return -} diff --git a/icons/src/ScreenshareOn/index.tsx b/icons/src/ScreenshareOn/index.tsx deleted file mode 100644 index d6bbfff273..0000000000 --- a/icons/src/ScreenshareOn/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ScreenshareOnIcon: React.FC = props => { - return -} diff --git a/icons/src/Search/index.tsx b/icons/src/Search/index.tsx deleted file mode 100644 index ffa434e649..0000000000 --- a/icons/src/Search/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const SearchIcon: React.FC = props => { - return -} diff --git a/icons/src/SearchPeople/index.tsx b/icons/src/SearchPeople/index.tsx deleted file mode 100644 index 2d4df42fc1..0000000000 --- a/icons/src/SearchPeople/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const SearchPeopleIcon: React.FC = props => { - return -} diff --git a/icons/src/Settings/index.tsx b/icons/src/Settings/index.tsx deleted file mode 100644 index 1b82544d04..0000000000 --- a/icons/src/Settings/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const SettingsIcon: React.FC = props => { - return -} diff --git a/icons/src/Share1/index.tsx b/icons/src/Share1/index.tsx deleted file mode 100644 index 43ddea9d10..0000000000 --- a/icons/src/Share1/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const Share1Icon: React.FC = props => { - return -} diff --git a/icons/src/Share2/index.tsx b/icons/src/Share2/index.tsx deleted file mode 100644 index 658443616a..0000000000 --- a/icons/src/Share2/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const Share2Icon: React.FC = props => { - return -} diff --git a/icons/src/Shield/index.tsx b/icons/src/Shield/index.tsx deleted file mode 100644 index 0572d728f0..0000000000 --- a/icons/src/Shield/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ShieldIcon: React.FC = props => { - return -} diff --git a/icons/src/Show/index.tsx b/icons/src/Show/index.tsx deleted file mode 100644 index 21f4f3c17a..0000000000 --- a/icons/src/Show/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ShowIcon: React.FC = props => { - return -} diff --git a/icons/src/Slack/index.tsx b/icons/src/Slack/index.tsx deleted file mode 100644 index 14baa84a58..0000000000 --- a/icons/src/Slack/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const SlackIcon: React.FC = props => { - return -} diff --git a/icons/src/SoundOff/index.tsx b/icons/src/SoundOff/index.tsx deleted file mode 100644 index c229d8c194..0000000000 --- a/icons/src/SoundOff/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const SoundOffIcon: React.FC = props => { - return -} diff --git a/icons/src/SoundOn/index.tsx b/icons/src/SoundOn/index.tsx deleted file mode 100644 index a7059b0db6..0000000000 --- a/icons/src/SoundOn/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const SoundOnIcon: React.FC = props => { - return -} diff --git a/icons/src/Source/index.tsx b/icons/src/Source/index.tsx deleted file mode 100644 index 9b2d5ff8cc..0000000000 --- a/icons/src/Source/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const SourceIcon: React.FC = props => { - return -} diff --git a/icons/src/Spanner/index.tsx b/icons/src/Spanner/index.tsx deleted file mode 100644 index c4245d8c70..0000000000 --- a/icons/src/Spanner/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const SpannerIcon: React.FC = props => { - return -} diff --git a/icons/src/Sparkles/index.tsx b/icons/src/Sparkles/index.tsx deleted file mode 100644 index 83995dfd06..0000000000 --- a/icons/src/Sparkles/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const SparklesIcon: React.FC = props => { - return -} diff --git a/icons/src/SquareAlert/index.tsx b/icons/src/SquareAlert/index.tsx deleted file mode 100644 index 0e5bfe9c58..0000000000 --- a/icons/src/SquareAlert/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const SquareAlertIcon: React.FC = props => { - return -} diff --git a/icons/src/Stackoverflow/index.tsx b/icons/src/Stackoverflow/index.tsx deleted file mode 100644 index f33b123bb0..0000000000 --- a/icons/src/Stackoverflow/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const StackoverflowIcon: React.FC = props => { - return -} diff --git a/icons/src/Stackserver/index.tsx b/icons/src/Stackserver/index.tsx deleted file mode 100644 index 2a5250c7ea..0000000000 --- a/icons/src/Stackserver/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const StackserverIcon: React.FC = props => { - return -} diff --git a/icons/src/Star/index.tsx b/icons/src/Star/index.tsx deleted file mode 100644 index 366f663227..0000000000 --- a/icons/src/Star/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const StarIcon: React.FC = props => { - return -} diff --git a/icons/src/StarOutline/index.tsx b/icons/src/StarOutline/index.tsx deleted file mode 100644 index 19a1ea7ca7..0000000000 --- a/icons/src/StarOutline/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const StarOutlineIcon: React.FC = props => { - return -} diff --git a/icons/src/Strikethrough/index.tsx b/icons/src/Strikethrough/index.tsx deleted file mode 100644 index 5da78d81ee..0000000000 --- a/icons/src/Strikethrough/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const StrikethroughIcon: React.FC = props => { - return -} diff --git a/icons/src/Subtitle/index.tsx b/icons/src/Subtitle/index.tsx deleted file mode 100644 index 676bccb35d..0000000000 --- a/icons/src/Subtitle/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const SubtitleIcon: React.FC = props => { - return -} diff --git a/icons/src/Success/index.tsx b/icons/src/Success/index.tsx deleted file mode 100644 index 7340989965..0000000000 --- a/icons/src/Success/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const SuccessIcon: React.FC = props => { - return -} diff --git a/icons/src/Suitcase/index.tsx b/icons/src/Suitcase/index.tsx deleted file mode 100644 index 3a21d1aaaf..0000000000 --- a/icons/src/Suitcase/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const SuitcaseIcon: React.FC = props => { - return -} diff --git a/icons/src/Sun/index.tsx b/icons/src/Sun/index.tsx deleted file mode 100644 index fadd003af2..0000000000 --- a/icons/src/Sun/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const SunIcon: React.FC = props => { - return -} diff --git a/icons/src/Svg/index.tsx b/icons/src/Svg/index.tsx deleted file mode 100644 index 1c5b3100f2..0000000000 --- a/icons/src/Svg/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const SvgIcon: React.FC = props => { - return -} diff --git a/icons/src/Symbol/index.tsx b/icons/src/Symbol/index.tsx deleted file mode 100644 index c9e1461a4e..0000000000 --- a/icons/src/Symbol/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const SymbolIcon: React.FC = props => { - return -} diff --git a/icons/src/Table/index.tsx b/icons/src/Table/index.tsx deleted file mode 100644 index 5441125d4f..0000000000 --- a/icons/src/Table/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const TableIcon: React.FC = props => { - return -} diff --git a/icons/src/TableColumnAddAfter/index.tsx b/icons/src/TableColumnAddAfter/index.tsx deleted file mode 100644 index 738e4bf46b..0000000000 --- a/icons/src/TableColumnAddAfter/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const TableColumnAddAfterIcon: React.FC = props => { - return -} diff --git a/icons/src/TableColumnAddBefore/index.tsx b/icons/src/TableColumnAddBefore/index.tsx deleted file mode 100644 index d281eb6e22..0000000000 --- a/icons/src/TableColumnAddBefore/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const TableColumnAddBeforeIcon: React.FC = props => { - return -} diff --git a/icons/src/TableColumnRemove/index.tsx b/icons/src/TableColumnRemove/index.tsx deleted file mode 100644 index f58c6b8ac4..0000000000 --- a/icons/src/TableColumnRemove/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const TableColumnRemoveIcon: React.FC = props => { - return -} diff --git a/icons/src/TableDelete/index.tsx b/icons/src/TableDelete/index.tsx deleted file mode 100644 index b49d743c8a..0000000000 --- a/icons/src/TableDelete/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const TableDeleteIcon: React.FC = props => { - return -} diff --git a/icons/src/TableDivide/index.tsx b/icons/src/TableDivide/index.tsx deleted file mode 100644 index 9cb9f1d366..0000000000 --- a/icons/src/TableDivide/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const TableDivideIcon: React.FC = props => { - return -} diff --git a/icons/src/TableMergeCells/index.tsx b/icons/src/TableMergeCells/index.tsx deleted file mode 100644 index 88b412ec2e..0000000000 --- a/icons/src/TableMergeCells/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const TableMergeCellsIcon: React.FC = props => { - return -} diff --git a/icons/src/TableRowAddAbove/index.tsx b/icons/src/TableRowAddAbove/index.tsx deleted file mode 100644 index 1d69e681eb..0000000000 --- a/icons/src/TableRowAddAbove/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const TableRowAddAboveIcon: React.FC = props => { - return -} diff --git a/icons/src/TableRowAddBelow/index.tsx b/icons/src/TableRowAddBelow/index.tsx deleted file mode 100644 index b5eba81e4b..0000000000 --- a/icons/src/TableRowAddBelow/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const TableRowAddBelowIcon: React.FC = props => { - return -} diff --git a/icons/src/TableRowRemove/index.tsx b/icons/src/TableRowRemove/index.tsx deleted file mode 100644 index f4b99952f3..0000000000 --- a/icons/src/TableRowRemove/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const TableRowRemoveIcon: React.FC = props => { - return -} diff --git a/icons/src/Tablet/index.tsx b/icons/src/Tablet/index.tsx deleted file mode 100644 index 969fcba622..0000000000 --- a/icons/src/Tablet/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const TabletIcon: React.FC = props => { - return -} diff --git a/icons/src/Tag/index.tsx b/icons/src/Tag/index.tsx deleted file mode 100644 index 60c142179b..0000000000 --- a/icons/src/Tag/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const TagIcon: React.FC = props => { - return -} diff --git a/icons/src/Target/index.tsx b/icons/src/Target/index.tsx deleted file mode 100644 index 357f6b0c25..0000000000 --- a/icons/src/Target/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const TargetIcon: React.FC = props => { - return -} diff --git a/icons/src/Teepee/index.tsx b/icons/src/Teepee/index.tsx deleted file mode 100644 index 68f452882e..0000000000 --- a/icons/src/Teepee/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const TeepeeIcon: React.FC = props => { - return -} diff --git a/icons/src/ThumbDown/index.tsx b/icons/src/ThumbDown/index.tsx deleted file mode 100644 index 79f60d2bf0..0000000000 --- a/icons/src/ThumbDown/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ThumbDownIcon: React.FC = props => { - return -} diff --git a/icons/src/ThumbUp/index.tsx b/icons/src/ThumbUp/index.tsx deleted file mode 100644 index b7685a5054..0000000000 --- a/icons/src/ThumbUp/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ThumbUpIcon: React.FC = props => { - return -} diff --git a/icons/src/Thunderclock/index.tsx b/icons/src/Thunderclock/index.tsx deleted file mode 100644 index acea1c05c5..0000000000 --- a/icons/src/Thunderclock/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ThunderclockIcon: React.FC = props => { - return -} diff --git a/icons/src/Tiktok/index.tsx b/icons/src/Tiktok/index.tsx deleted file mode 100644 index 04159d2b98..0000000000 --- a/icons/src/Tiktok/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const TiktokIcon: React.FC = props => { - return -} diff --git a/icons/src/Trash/index.tsx b/icons/src/Trash/index.tsx deleted file mode 100644 index 359e4ac839..0000000000 --- a/icons/src/Trash/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const TrashIcon: React.FC = props => { - return -} diff --git a/icons/src/Tree/index.tsx b/icons/src/Tree/index.tsx deleted file mode 100644 index 633c78ea57..0000000000 --- a/icons/src/Tree/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const TreeIcon: React.FC = props => { - return -} diff --git a/icons/src/Trophy/index.tsx b/icons/src/Trophy/index.tsx deleted file mode 100644 index 432e6a73a7..0000000000 --- a/icons/src/Trophy/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const TrophyIcon: React.FC = props => { - return -} diff --git a/icons/src/Ttf/index.tsx b/icons/src/Ttf/index.tsx deleted file mode 100644 index 88b1eb3956..0000000000 --- a/icons/src/Ttf/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const TtfIcon: React.FC = props => { - return -} diff --git a/icons/src/Twitch/index.tsx b/icons/src/Twitch/index.tsx deleted file mode 100644 index 56f5f4ddce..0000000000 --- a/icons/src/Twitch/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const TwitchIcon: React.FC = props => { - return -} diff --git a/icons/src/Twitter/index.tsx b/icons/src/Twitter/index.tsx deleted file mode 100644 index ffefde3943..0000000000 --- a/icons/src/Twitter/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const TwitterIcon: React.FC = props => { - return -} diff --git a/icons/src/Txt/index.tsx b/icons/src/Txt/index.tsx deleted file mode 100644 index f4ecd474ac..0000000000 --- a/icons/src/Txt/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const TxtIcon: React.FC = props => { - return -} diff --git a/icons/src/Type/index.tsx b/icons/src/Type/index.tsx deleted file mode 100644 index 31856f4b12..0000000000 --- a/icons/src/Type/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const TypeIcon: React.FC = props => { - return -} diff --git a/icons/src/Unavailable/index.tsx b/icons/src/Unavailable/index.tsx deleted file mode 100644 index 9851f87e06..0000000000 --- a/icons/src/Unavailable/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const UnavailableIcon: React.FC = props => { - return -} diff --git a/icons/src/Underline/index.tsx b/icons/src/Underline/index.tsx deleted file mode 100644 index 27402efb92..0000000000 --- a/icons/src/Underline/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const UnderlineIcon: React.FC = props => { - return -} diff --git a/icons/src/UnorderedList/index.tsx b/icons/src/UnorderedList/index.tsx deleted file mode 100644 index 544826ab02..0000000000 --- a/icons/src/UnorderedList/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const UnorderedListIcon: React.FC = props => { - return -} diff --git a/icons/src/Up/index.tsx b/icons/src/Up/index.tsx deleted file mode 100644 index 602a0aede5..0000000000 --- a/icons/src/Up/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const UpIcon: React.FC = props => { - return -} diff --git a/icons/src/Update/index.tsx b/icons/src/Update/index.tsx deleted file mode 100644 index be5d0468da..0000000000 --- a/icons/src/Update/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const UpdateIcon: React.FC = props => { - return -} diff --git a/icons/src/Upload/index.tsx b/icons/src/Upload/index.tsx deleted file mode 100644 index a97401b36e..0000000000 --- a/icons/src/Upload/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const UploadIcon: React.FC = props => { - return -} diff --git a/icons/src/User/index.tsx b/icons/src/User/index.tsx deleted file mode 100644 index fb3713c17b..0000000000 --- a/icons/src/User/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const UserIcon: React.FC = props => { - return -} diff --git a/icons/src/UserOutline/index.tsx b/icons/src/UserOutline/index.tsx deleted file mode 100644 index f7902211dd..0000000000 --- a/icons/src/UserOutline/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const UserOutlineIcon: React.FC = props => { - return -} diff --git a/icons/src/Video/index.tsx b/icons/src/Video/index.tsx deleted file mode 100644 index 36304c1f3a..0000000000 --- a/icons/src/Video/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const VideoIcon: React.FC = props => { - return -} diff --git a/icons/src/VideoCamera/index.tsx b/icons/src/VideoCamera/index.tsx deleted file mode 100644 index 97f2c10ffa..0000000000 --- a/icons/src/VideoCamera/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const VideoCameraIcon: React.FC = props => { - return -} diff --git a/icons/src/VideoCamera2/index.tsx b/icons/src/VideoCamera2/index.tsx deleted file mode 100644 index 1e4b3e9451..0000000000 --- a/icons/src/VideoCamera2/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const VideoCamera2Icon: React.FC = props => { - return -} diff --git a/icons/src/WatchLater/index.tsx b/icons/src/WatchLater/index.tsx deleted file mode 100644 index a0f8541598..0000000000 --- a/icons/src/WatchLater/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const WatchLaterIcon: React.FC = props => { - return -} diff --git a/icons/src/Woff/index.tsx b/icons/src/Woff/index.tsx deleted file mode 100644 index 122d591bfe..0000000000 --- a/icons/src/Woff/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const WoffIcon: React.FC = props => { - return -} diff --git a/icons/src/Woff2/index.tsx b/icons/src/Woff2/index.tsx deleted file mode 100644 index 0a8a52dc06..0000000000 --- a/icons/src/Woff2/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const Woff2Icon: React.FC = props => { - return -} diff --git a/icons/src/Write/index.tsx b/icons/src/Write/index.tsx deleted file mode 100644 index 3d57a7a61b..0000000000 --- a/icons/src/Write/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const WriteIcon: React.FC = props => { - return -} diff --git a/icons/src/Wttj/index.tsx b/icons/src/Wttj/index.tsx deleted file mode 100644 index 9fa119e589..0000000000 --- a/icons/src/Wttj/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const WttjIcon: React.FC = props => { - return -} diff --git a/icons/src/X/index.tsx b/icons/src/X/index.tsx deleted file mode 100644 index f3f54e412f..0000000000 --- a/icons/src/X/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const XIcon: React.FC = props => { - return -} diff --git a/icons/src/Xing/index.tsx b/icons/src/Xing/index.tsx deleted file mode 100644 index ab773385c3..0000000000 --- a/icons/src/Xing/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const XingIcon: React.FC = props => { - return -} diff --git a/icons/src/Xls/index.tsx b/icons/src/Xls/index.tsx deleted file mode 100644 index 7d98da93c4..0000000000 --- a/icons/src/Xls/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const XlsIcon: React.FC = props => { - return -} diff --git a/icons/src/Xlsx/index.tsx b/icons/src/Xlsx/index.tsx deleted file mode 100644 index d3958083a0..0000000000 --- a/icons/src/Xlsx/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const XlsxIcon: React.FC = props => { - return -} diff --git a/icons/src/Youtube/index.tsx b/icons/src/Youtube/index.tsx deleted file mode 100644 index 3bdcd1e5a4..0000000000 --- a/icons/src/Youtube/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const YoutubeIcon: React.FC = props => { - return -} diff --git a/icons/src/Zapier/index.tsx b/icons/src/Zapier/index.tsx deleted file mode 100644 index 7fe2e1bce4..0000000000 --- a/icons/src/Zapier/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ZapierIcon: React.FC = props => { - return -} diff --git a/icons/src/Zip/index.tsx b/icons/src/Zip/index.tsx deleted file mode 100644 index 503fd8924d..0000000000 --- a/icons/src/Zip/index.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import React from 'react' -import { Icon, IconProps } from '@welcome-ui/icon' - -import content from './content.json' - -export const ZipIcon: React.FC = props => { - return -} diff --git a/icons/src/index.d.ts b/icons/src/index.d.ts deleted file mode 100644 index da429da126..0000000000 --- a/icons/src/index.d.ts +++ /dev/null @@ -1,306 +0,0 @@ -import React from 'react' -import { IconProps } from '@welcome-ui/icon' -export declare const ActionsIcon: React.FC -export declare const ActivityIcon: React.FC -export declare const AddIcon: React.FC -export declare const AddressIcon: React.FC -export declare const AirplayIcon: React.FC -export declare const AlertIcon: React.FC -export declare const AlertOutlineIcon: React.FC -export declare const AnalyticsIcon: React.FC -export declare const AnniversaryIcon: React.FC -export declare const ArchiveIcon: React.FC -export declare const ArrowDownIcon: React.FC -export declare const ArrowLeftIcon: React.FC -export declare const ArrowLineDownIcon: React.FC -export declare const ArrowLineLeftIcon: React.FC -export declare const ArrowLineRightIcon: React.FC -export declare const ArrowLineUpIcon: React.FC -export declare const ArrowRightIcon: React.FC -export declare const ArrowUpIcon: React.FC -export declare const AspectRatioFillIcon: React.FC -export declare const AspectRatioFitIcon: React.FC -export declare const AttachmentIcon: React.FC -export declare const AvatarIcon: React.FC -export declare const AvatarAccessoryIcon: React.FC -export declare const AvatarBodyIcon: React.FC -export declare const AvatarBottomIcon: React.FC -export declare const AvatarCostumeIcon: React.FC -export declare const AvatarHeadIcon: React.FC -export declare const AvatarTopIcon: React.FC -export declare const BarChartIcon: React.FC -export declare const BasketballIcon: React.FC -export declare const BehanceIcon: React.FC -export declare const BirthdayIcon: React.FC -export declare const BoldIcon: React.FC -export declare const BookIcon: React.FC -export declare const Book2Icon: React.FC -export declare const BookmarkIcon: React.FC -export declare const BookmarkOutlineIcon: React.FC -export declare const BulbIcon: React.FC -export declare const BulkIcon: React.FC -export declare const BuoyIcon: React.FC -export declare const BurnIcon: React.FC -export declare const CaddyIcon: React.FC -export declare const CalculIcon: React.FC -export declare const CameraIcon: React.FC -export declare const CameraOffIcon: React.FC -export declare const CameraOnIcon: React.FC -export declare const CandidateStatusIcon: React.FC -export declare const CardViewIcon: React.FC -export declare const CastIcon: React.FC -export declare const CastConnectedIcon: React.FC -export declare const CastUnavailableIcon: React.FC -export declare const CelebrateIcon: React.FC -export declare const CertifiedIcon: React.FC -export declare const CheckIcon: React.FC -export declare const ClipboardIcon: React.FC -export declare const ClockIcon: React.FC -export declare const CodeIcon: React.FC -export declare const CodeBlockIcon: React.FC -export declare const CoffeeIcon: React.FC -export declare const CollapseIcon: React.FC -export declare const CommentIcon: React.FC -export declare const CommentOutlineIcon: React.FC -export declare const CommonAreaIcon: React.FC -export declare const CompassIcon: React.FC -export declare const ComputerIcon: React.FC -export declare const ConnectionIcon: React.FC -export declare const ContractIcon: React.FC -export declare const ControlBackwardIcon: React.FC -export declare const ControlForwardIcon: React.FC -export declare const ControlPauseIcon: React.FC -export declare const ControlStopIcon: React.FC -export declare const CopyIcon: React.FC -export declare const CoverLetterIcon: React.FC -export declare const CreateIcon: React.FC -export declare const CreditCardIcon: React.FC -export declare const CrescentMoonIcon: React.FC -export declare const CrescentMoonOutlineIcon: React.FC -export declare const CrossIcon: React.FC -export declare const CrossTargetIcon: React.FC -export declare const CrownIcon: React.FC -export declare const CsvIcon: React.FC -export declare const DateIcon: React.FC -export declare const DepartmentIcon: React.FC -export declare const DetailsIcon: React.FC -export declare const DiamondIcon: React.FC -export declare const DishIcon: React.FC -export declare const DocIcon: React.FC -export declare const DocxIcon: React.FC -export declare const DownIcon: React.FC -export declare const DownloadIcon: React.FC -export declare const DragAndDropIcon: React.FC -export declare const DribbbleIcon: React.FC -export declare const EarthIcon: React.FC -export declare const EditIcon: React.FC -export declare const EducationLevelIcon: React.FC -export declare const EmailIcon: React.FC -export declare const EmailOutlineIcon: React.FC -export declare const EotIcon: React.FC -export declare const EqualIcon: React.FC -export declare const EuroCurrencyIcon: React.FC -export declare const ExpandIcon: React.FC -export declare const ExpandTextIcon: React.FC -export declare const ExtendIcon: React.FC -export declare const ExternalLinkIcon: React.FC -export declare const FacebookIcon: React.FC -export declare const FactoryIcon: React.FC -export declare const FemaleIcon: React.FC -export declare const FiltersIcon: React.FC -export declare const FingerprintIcon: React.FC -export declare const FlagIcon: React.FC -export declare const FlagCsIcon: React.FC -export declare const FlagEnIcon: React.FC -export declare const FlagEsIcon: React.FC -export declare const FlagFrIcon: React.FC -export declare const FlagOutlineIcon: React.FC -export declare const FlagPointedIcon: React.FC -export declare const FlagSkIcon: React.FC -export declare const FlagUsIcon: React.FC -export declare const FolderIcon: React.FC -export declare const FullscreenOffIcon: React.FC -export declare const FullscreenOnIcon: React.FC -export declare const GearIcon: React.FC -export declare const GifIcon: React.FC -export declare const GithubIcon: React.FC -export declare const GoogleIcon: React.FC -export declare const HandshakeIcon: React.FC -export declare const HardHatIcon: React.FC -export declare const HashtagIcon: React.FC -export declare const HeadingIcon: React.FC -export declare const Heading1Icon: React.FC -export declare const Heading2Icon: React.FC -export declare const Heading3Icon: React.FC -export declare const Heading4Icon: React.FC -export declare const Heading5Icon: React.FC -export declare const Heading6Icon: React.FC -export declare const HeadsetIcon: React.FC -export declare const HeartIcon: React.FC -export declare const HeartOutlineIcon: React.FC -export declare const HeartShinyIcon: React.FC -export declare const HideIcon: React.FC -export declare const HomeIcon: React.FC -export declare const HouseIcon: React.FC -export declare const InProgressCandidateIcon: React.FC -export declare const InformationIcon: React.FC -export declare const InformationOutlineIcon: React.FC -export declare const InstagramIcon: React.FC -export declare const ItalicIcon: React.FC -export declare const JpegIcon: React.FC -export declare const JpgIcon: React.FC -export declare const JusticeHammerIcon: React.FC -export declare const KanbanIcon: React.FC -export declare const KeyIcon: React.FC -export declare const LanguageIcon: React.FC -export declare const LeafIcon: React.FC -export declare const LeftIcon: React.FC -export declare const LineChartIcon: React.FC -export declare const LinkIcon: React.FC -export declare const LinkedinIcon: React.FC -export declare const LocationIcon: React.FC -export declare const LockIcon: React.FC -export declare const LockRoundedIcon: React.FC -export declare const LogOutIcon: React.FC -export declare const MaleIcon: React.FC -export declare const MapIcon: React.FC -export declare const MasonryIcon: React.FC -export declare const Masonry2Icon: React.FC -export declare const MeetingRoomIcon: React.FC -export declare const MegaphoneIcon: React.FC -export declare const MentionIcon: React.FC -export declare const MenuIcon: React.FC -export declare const MicIcon: React.FC -export declare const MicrophoneOffIcon: React.FC -export declare const MicrophoneOnIcon: React.FC -export declare const MicroshipIcon: React.FC -export declare const MobileIcon: React.FC -export declare const MoneyIcon: React.FC -export declare const MoreIcon: React.FC -export declare const MoreAndroidIcon: React.FC -export declare const MountainIcon: React.FC -export declare const MoveIcon: React.FC -export declare const MusicIcon: React.FC -export declare const NegativeIcon: React.FC -export declare const NegativeOutlineIcon: React.FC -export declare const NegativeStraightIcon: React.FC -export declare const NewCandidateIcon: React.FC -export declare const NotificationIcon: React.FC -export declare const NpmIcon: React.FC -export declare const OfferStatusIcon: React.FC -export declare const OfficeIcon: React.FC -export declare const OrderedListIcon: React.FC -export declare const OrigineIcon: React.FC -export declare const PaperplaneIcon: React.FC -export declare const PdfIcon: React.FC -export declare const PencilIcon: React.FC -export declare const PhoneIcon: React.FC -export declare const PhoneOutlineIcon: React.FC -export declare const PicturesIcon: React.FC -export declare const PiechartIcon: React.FC -export declare const PinIcon: React.FC -export declare const PinterestIcon: React.FC -export declare const PizzaIcon: React.FC -export declare const PlayIcon: React.FC -export declare const PlayOutlineIcon: React.FC -export declare const PlaylistIcon: React.FC -export declare const PngIcon: React.FC -export declare const PodcastIcon: React.FC -export declare const PositiveIcon: React.FC -export declare const PositiveOutlineIcon: React.FC -export declare const PositiveStraightIcon: React.FC -export declare const PptIcon: React.FC -export declare const PrintIcon: React.FC -export declare const PromoteIcon: React.FC -export declare const PuzzleIcon: React.FC -export declare const PuzzleOutlineIcon: React.FC -export declare const QuestionIcon: React.FC -export declare const QuestionsIcon: React.FC -export declare const QuoteIcon: React.FC -export declare const RefreshIcon: React.FC -export declare const RefuseCandidateIcon: React.FC -export declare const RemoteIcon: React.FC -export declare const RemoveIcon: React.FC -export declare const ResetIcon: React.FC -export declare const ResumeIcon: React.FC -export declare const ReviewIcon: React.FC -export declare const ReviewOutlineIcon: React.FC -export declare const RightIcon: React.FC -export declare const SalaryIcon: React.FC -export declare const SaveIcon: React.FC -export declare const ScreenshareOffIcon: React.FC -export declare const ScreenshareOnIcon: React.FC -export declare const SearchIcon: React.FC -export declare const SearchPeopleIcon: React.FC -export declare const SettingsIcon: React.FC -export declare const Share1Icon: React.FC -export declare const Share2Icon: React.FC -export declare const ShieldIcon: React.FC -export declare const ShowIcon: React.FC -export declare const SlackIcon: React.FC -export declare const SoundOffIcon: React.FC -export declare const SoundOnIcon: React.FC -export declare const SourceIcon: React.FC -export declare const SpannerIcon: React.FC -export declare const SparklesIcon: React.FC -export declare const SquareAlertIcon: React.FC -export declare const StackoverflowIcon: React.FC -export declare const StackserverIcon: React.FC -export declare const StarIcon: React.FC -export declare const StarOutlineIcon: React.FC -export declare const StrikethroughIcon: React.FC -export declare const SubtitleIcon: React.FC -export declare const SuccessIcon: React.FC -export declare const SuitcaseIcon: React.FC -export declare const SunIcon: React.FC -export declare const SvgIcon: React.FC -export declare const SymbolIcon: React.FC -export declare const TableIcon: React.FC -export declare const TableColumnAddAfterIcon: React.FC -export declare const TableColumnAddBeforeIcon: React.FC -export declare const TableColumnRemoveIcon: React.FC -export declare const TableDeleteIcon: React.FC -export declare const TableDivideIcon: React.FC -export declare const TableMergeCellsIcon: React.FC -export declare const TableRowAddAboveIcon: React.FC -export declare const TableRowAddBelowIcon: React.FC -export declare const TableRowRemoveIcon: React.FC -export declare const TabletIcon: React.FC -export declare const TagIcon: React.FC -export declare const TargetIcon: React.FC -export declare const TeepeeIcon: React.FC -export declare const ThumbDownIcon: React.FC -export declare const ThumbUpIcon: React.FC -export declare const ThunderclockIcon: React.FC -export declare const TiktokIcon: React.FC -export declare const TrashIcon: React.FC -export declare const TreeIcon: React.FC -export declare const TrophyIcon: React.FC -export declare const TtfIcon: React.FC -export declare const TwitchIcon: React.FC -export declare const TwitterIcon: React.FC -export declare const TxtIcon: React.FC -export declare const TypeIcon: React.FC -export declare const UnavailableIcon: React.FC -export declare const UnderlineIcon: React.FC -export declare const UnorderedListIcon: React.FC -export declare const UpIcon: React.FC -export declare const UpdateIcon: React.FC -export declare const UploadIcon: React.FC -export declare const UserIcon: React.FC -export declare const UserOutlineIcon: React.FC -export declare const VideoIcon: React.FC -export declare const VideoCameraIcon: React.FC -export declare const VideoCamera2Icon: React.FC -export declare const WatchLaterIcon: React.FC -export declare const WoffIcon: React.FC -export declare const Woff2Icon: React.FC -export declare const WriteIcon: React.FC -export declare const WttjIcon: React.FC -export declare const XIcon: React.FC -export declare const XingIcon: React.FC -export declare const XlsIcon: React.FC -export declare const XlsxIcon: React.FC -export declare const YoutubeIcon: React.FC -export declare const ZapierIcon: React.FC -export declare const ZipIcon: React.FC diff --git a/jest.config.js b/jest.config.js deleted file mode 100644 index 8d0d4c58be..0000000000 --- a/jest.config.js +++ /dev/null @@ -1,11 +0,0 @@ -module.exports = { - moduleNameMapper: { - '\\.(css|less)$': '/mocks/styleMock.js', - }, - transform: { - '^.+\\.(ts|tsx|js|jsx)?$': '@swc/jest', - }, - setupFilesAfterEnv: ['/mocks/setup.js'], - modulePaths: ['/node_modules'], - testEnvironment: 'jsdom', -} diff --git a/lerna.json b/lerna.json deleted file mode 100644 index 49b108e04b..0000000000 --- a/lerna.json +++ /dev/null @@ -1,12 +0,0 @@ -{ - "packages": [ - "packages/**", - "icons" - ], - "ignore": [ - "website" - ], - "version": "6.7.1", - "npmClient": "yarn", - "useNx": false -} \ No newline at end of file diff --git a/lib/.release-it.json b/lib/.release-it.json new file mode 100644 index 0000000000..60d262cf08 --- /dev/null +++ b/lib/.release-it.json @@ -0,0 +1,13 @@ +{ + "npm": { + "publish": false, + "skipChecks": true + }, + "git": { + "commitMessage": "chore: release v${version}", + "tagName": "v${version}" + }, + "github": { + "release": true + } +} diff --git a/babel.config.js b/lib/babel.config.js similarity index 75% rename from babel.config.js rename to lib/babel.config.js index 09de302ba0..591e26f532 100644 --- a/babel.config.js +++ b/lib/babel.config.js @@ -5,9 +5,16 @@ module.exports = { }, }, presets: [ - ['@babel/preset-env', { modules: false, loose: true }], - '@babel/preset-typescript', + ['@babel/preset-env', { targets: { node: 'current' } }], '@babel/preset-react', + [ + 'babel-preset-vite', + { + env: true, + glob: false, + }, + ], + '@babel/preset-typescript', ], plugins: [ '@babel/plugin-proposal-optional-chaining', diff --git a/lib/jest.config.js b/lib/jest.config.js new file mode 100644 index 0000000000..f2ab2d0407 --- /dev/null +++ b/lib/jest.config.js @@ -0,0 +1,15 @@ +module.exports = { + moduleNameMapper: { + '\\.(css|less)$': '/tests/styleMock.ts', + '^@/theme$': '/src/theme', + '^@/utils$': '/src/utils', + '^@/fonts/(.*)$': '/src/components/IconsFont/fonts/$1', + '^@/(.*)$': '/src/components/$1', + }, + transform: { + '^.+\\.(ts|tsx|js|jsx)?$': 'babel-jest', + }, + setupFilesAfterEnv: ['/tests/setup.ts'], + modulePaths: ['/node_modules'], + testEnvironment: 'jest-environment-jsdom', +} diff --git a/lib/package.json b/lib/package.json new file mode 100644 index 0000000000..7b62c6a575 --- /dev/null +++ b/lib/package.json @@ -0,0 +1,118 @@ +{ + "name": "welcome-ui", + "version": "7.0.0-alpha.9", + "description": "Customizable design system with react • styled-components • styled-system and ariakit.", + "files": [ + "dist" + ], + "exports": { + "./fonts/*": "./dist/fonts/*", + "./theme": { + "types": "./dist/types/theme/index.d.ts", + "import": "./dist/theme.mjs", + "require": "./dist/theme.js" + }, + "./utils": { + "types": "./dist/types/utils/index.d.ts", + "import": "./dist/utils.mjs", + "require": "./dist/utils.js" + }, + "./*": { + "types": "./dist/types/components/*/index.d.ts", + "import": "./dist/*.mjs", + "require": "./dist/*.js" + } + }, + "scripts": { + "start": "vite build --watch", + "build": "vite build", + "test": "yarn jest" + }, + "repository": { + "type": "git", + "url": "git+https://github.com/WTTJ/welcome-ui.git" + }, + "keywords": [ + "design-system", + "react", + "ariakit", + "styled-components", + "styled-system", + "ui-library", + "ui", + "ux", + "welcome", + "WTTJ" + ], + "author": "WTTJ ", + "license": "MIT", + "bugs": { + "url": "https://github.com/WTTJ/welcome-ui/issues" + }, + "dependencies": { + "@ariakit/react": "0.4.15", + "@juggle/resize-observer": "^3.4.0", + "copy-to-clipboard": "^3.3.3", + "date-fns": "^4.1.0", + "downshift": "^7.4.1", + "lodash.capitalize": "^4.2.1", + "lodash.debounce": "^4.0.8", + "lodash.range": "^3.2.0", + "lottie-light-react": "^2.4.0", + "match-sorter": "^8.0.0", + "react-datepicker": "^4.16.0", + "react-dropzone": "^14.3.5", + "react-flatten-children": "^1.0.0", + "react-hot-toast": "^2.4.1" + }, + "devDependencies": { + "@babel/cli": "7.25.9", + "@babel/core": "7.25.2", + "@babel/eslint-parser": "^7.25.1", + "@babel/plugin-proposal-class-properties": "7.18.6", + "@babel/plugin-proposal-optional-chaining": "7.21.0", + "@babel/plugin-transform-modules-commonjs": "7.25.9", + "@babel/plugin-transform-runtime": "^7.25.4", + "@babel/preset-env": "^7.26.0", + "@babel/preset-react": "^7.26.3", + "@babel/preset-typescript": "^7.22.11", + "@testing-library/dom": "^10.4.0", + "@testing-library/jest-dom": "^6.6.3", + "@testing-library/react": "^16.0.1", + "@testing-library/user-event": "^14.5.2", + "@types/jest": "^29.5.13", + "@types/lodash.capitalize": "^4.2.9", + "@types/lodash.debounce": "^4.0.6", + "@types/lodash.range": "^3.2.9", + "@types/node": "22.9.0", + "@types/react": "18.0.25", + "@types/react-datepicker": "^4.15.0", + "@types/react-dom": "18.0.11", + "@xstyled/styled-components": "^3.7.3", + "babel-jest": "^29.7.0", + "babel-plugin-annotate-pure-calls": "^0.4.0", + "babel-plugin-transform-async-to-promises": "^0.8.18", + "babel-preset-vite": "^1.1.3", + "jest": "29.7.0", + "jest-environment-jsdom": "^29.7.0", + "jest-styled-components": "7.2.0", + "react": "^18.0.0", + "release-it": "^18.1.2", + "rollup-preserve-directives": "^1.1.3", + "styled-components": "^5.3.9", + "typescript": "^5.6.3", + "vite": "^5.4.10", + "vite-plugin-dts": "^4.3.0", + "vite-plugin-static-copy": "^2.2.0", + "wttj-config": "^3.0.1" + }, + "peerDependencies": { + "@xstyled/styled-components": "^3.7.3", + "react": "^18.0.0", + "styled-components": "^5.3.9" + }, + "resolutions": { + "@babel/traverse": ">=7.23.2" + }, + "homepage": "https://welcome-ui.com" +} diff --git a/lib/scripts/get-lib-entries.ts b/lib/scripts/get-lib-entries.ts new file mode 100644 index 0000000000..b7720187b0 --- /dev/null +++ b/lib/scripts/get-lib-entries.ts @@ -0,0 +1,34 @@ +import { resolve } from 'path' +import fs from 'fs' + +const getComponentsEntries = () => { + const componentsDir = resolve(__dirname, '../src/components') + + // Read all directories in the components folder + const componentDirs = fs + .readdirSync(componentsDir, { withFileTypes: true }) + .filter(dirent => dirent.isDirectory()) + .map(dirent => dirent.name) + + // Create entry object dynamically + const entries = componentDirs.reduce>((acc, componentName) => { + const entryPathTsx = resolve(componentsDir, componentName, 'index.tsx') + const entryPathTs = resolve(componentsDir, componentName, 'index.ts') + const entryPath = fs.existsSync(entryPathTsx) ? entryPathTsx : entryPathTs + + // Only add to entries if the index.tsx file exists + if (fs.existsSync(entryPath)) { + acc[componentName] = entryPath + } + + return acc + }, {}) + + return entries +} + +export const getLibEntries = () => ({ + ...getComponentsEntries(), + theme: resolve(__dirname, '../src/theme/index.ts'), + utils: resolve(__dirname, '../src/utils/index.ts'), +}) diff --git a/packages/Accordion/docs/examples/avatar.tsx b/lib/src/components/Accordion/docs/examples/avatar.tsx similarity index 78% rename from packages/Accordion/docs/examples/avatar.tsx rename to lib/src/components/Accordion/docs/examples/avatar.tsx index f2b6221c4e..04931a44d1 100644 --- a/packages/Accordion/docs/examples/avatar.tsx +++ b/lib/src/components/Accordion/docs/examples/avatar.tsx @@ -1,8 +1,9 @@ import * as React from 'react' -import { Flex } from '@welcome-ui/flex' -import { Avatar } from '@welcome-ui/avatar' -import { Text } from '@welcome-ui/text' -import { Accordion, useAccordion } from '@welcome-ui/accordion' + +import { Flex } from '@/Flex' +import { Avatar } from '@/Avatar' +import { Text } from '@/Text' +import { Accordion, useAccordion } from '@/Accordion' const Example = () => { const accordion = useAccordion() diff --git a/packages/Accordion/docs/examples/open-at-start.tsx b/lib/src/components/Accordion/docs/examples/open-at-start.tsx similarity index 88% rename from packages/Accordion/docs/examples/open-at-start.tsx rename to lib/src/components/Accordion/docs/examples/open-at-start.tsx index 7fc6557494..ceae72fd51 100644 --- a/packages/Accordion/docs/examples/open-at-start.tsx +++ b/lib/src/components/Accordion/docs/examples/open-at-start.tsx @@ -1,5 +1,6 @@ import * as React from 'react' -import { Accordion, useAccordion } from '@welcome-ui/accordion' + +import { Accordion, useAccordion } from '@/Accordion' const Example = () => { const accordion = useAccordion({ defaultOpen: true }) diff --git a/lib/src/components/Accordion/docs/examples/overview.tsx b/lib/src/components/Accordion/docs/examples/overview.tsx new file mode 100644 index 0000000000..6edd1c13e5 --- /dev/null +++ b/lib/src/components/Accordion/docs/examples/overview.tsx @@ -0,0 +1,17 @@ +import * as React from 'react' + +import { Accordion, useAccordion } from '@/Accordion' + +const Example = () => { + const accordion = useAccordion() + + return ( + + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut + labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco + laboris nisi ut aliquip ex ea commodo consequat. + + ) +} + +export default Example diff --git a/packages/Accordion/docs/examples/with-custom-icon.tsx b/lib/src/components/Accordion/docs/examples/with-custom-icon.tsx similarity index 81% rename from packages/Accordion/docs/examples/with-custom-icon.tsx rename to lib/src/components/Accordion/docs/examples/with-custom-icon.tsx index 98d9e617f8..617a78971c 100644 --- a/packages/Accordion/docs/examples/with-custom-icon.tsx +++ b/lib/src/components/Accordion/docs/examples/with-custom-icon.tsx @@ -1,6 +1,7 @@ import * as React from 'react' -import { Accordion, useAccordion } from '@welcome-ui/accordion' -import { PlayIcon } from '@welcome-ui/icons' + +import { Accordion, useAccordion } from '@/Accordion' +import { PlayIcon } from '@/Icons' const Example = () => { const accordion = useAccordion() diff --git a/packages/Accordion/docs/index.mdx b/lib/src/components/Accordion/docs/index.mdx similarity index 100% rename from packages/Accordion/docs/index.mdx rename to lib/src/components/Accordion/docs/index.mdx diff --git a/lib/src/components/Accordion/docs/properties.json b/lib/src/components/Accordion/docs/properties.json new file mode 100644 index 0000000000..d98542b295 --- /dev/null +++ b/lib/src/components/Accordion/docs/properties.json @@ -0,0 +1,199 @@ +{ + "useAccordion": { + "props": { + "animated": { + "defaultValue": null, + "description": "Determines whether the content should animate when it is shown or hidden.\n- If `true`, the `animating` state will be `true` when the content is shown\n or hidden and it will wait for a CSS animation/transition to end before\n becoming `false`.\n- If it's set to a number, the `animating` state will be `true` when the\n content is shown or hidden and it will wait for the number of\n milliseconds to pass before becoming `false`.\n@deprecated Manually setting the `animated` prop is no longer necessary.\nThis will be removed in a future release.", + "name": "animated", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "number | boolean", + "value": [ + { + "value": "number" + }, + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "defaultOpen": { + "defaultValue": { + "value": "false" + }, + "description": "Whether the content should be visible by default.", + "name": "defaultOpen", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "disclosure": { + "defaultValue": null, + "description": "A reference to another disclosure store that controls another disclosure\ncomponent to keep them in sync. Element states like `contentElement` and\n`disclosureElement` won't be synced. For that, use the\n[`store`](https://ariakit.org/reference/disclosure-provider#store) prop\ninstead.\n\nLive examples:\n- [Command Menu](https://ariakit.org/examples/dialog-combobox-command-menu)", + "name": "disclosure", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + } + ], + "required": false, + "type": { + "name": "DisclosureStore" + } + }, + "setMounted": { + "defaultValue": null, + "description": "A callback that gets called when the `mounted` state changes.\n@example const [mounted, setMounted] = useState(false);\nconst disclosure = useDisclosureStore({ setMounted });", + "name": "setMounted", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + } + ], + "required": false, + "type": { + "name": "(mounted: boolean) => void" + } + }, + "setOpen": { + "defaultValue": null, + "description": "A callback that gets called when the\n[`open`](https://ariakit.org/reference/disclosure-provider#open) state\nchanges.\n@example const [open, setOpen] = useState(false);\nconst disclosure = useDisclosureStore({ open, setOpen });", + "name": "setOpen", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + } + ], + "required": false, + "type": { + "name": "(open: boolean) => void" + } + } + } + }, + "Accordion": { + "props": { + "icon": { + "defaultValue": { + "value": "" + }, + "description": "", + "name": "icon", + "parent": { + "fileName": "welcome-ui/lib/src/components/Accordion/index.tsx", + "name": "AccordionOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Accordion/index.tsx", + "name": "AccordionOptions" + } + ], + "required": false, + "type": { + "name": "Element" + } + }, + "store": { + "defaultValue": null, + "description": "store from useAccordion()", + "name": "store", + "parent": { + "fileName": "welcome-ui/lib/src/components/Accordion/index.tsx", + "name": "AccordionOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Accordion/index.tsx", + "name": "AccordionOptions" + } + ], + "required": true, + "type": { + "name": "DisclosureStore" + } + }, + "title": { + "defaultValue": null, + "description": "", + "name": "title", + "parent": { + "fileName": "welcome-ui/lib/src/components/Accordion/index.tsx", + "name": "AccordionOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Accordion/index.tsx", + "name": "AccordionOptions" + } + ], + "required": true, + "type": { + "name": "enum", + "raw": "string | Element", + "value": [ + { + "value": "string" + }, + { + "value": "Element", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + } + } + } +} \ No newline at end of file diff --git a/lib/src/components/Accordion/index.tsx b/lib/src/components/Accordion/index.tsx new file mode 100644 index 0000000000..86353ceb9e --- /dev/null +++ b/lib/src/components/Accordion/index.tsx @@ -0,0 +1,46 @@ +import React, { cloneElement } from 'react' +import * as Ariakit from '@ariakit/react' + +import * as S from './styles' + +import { RightIcon } from '@/Icons' +import { CreateWuiProps, forwardRef } from '@/System' + +export interface AccordionOptions { + icon?: JSX.Element + /** + * store from useAccordion() + */ + store: UseAccordion + title: string | JSX.Element +} + +export type AccordionProps = CreateWuiProps<'div', AccordionOptions> + +export const Accordion = forwardRef<'div', AccordionProps>( + ({ children, dataTestId, icon = , store, title, ...rest }, ref) => { + return ( + + + {title} + {cloneElement(icon, { size: 'sm' })} + + +
+ {children} +
+ + + ) + } +) + +export type UseAccordion = Ariakit.DisclosureStore +export type UseAccordionProps = Ariakit.DisclosureStoreProps +export type UseAccordionState = Ariakit.DisclosureStoreState + +export function useAccordion(options?: UseAccordionProps): UseAccordion { + const accordion = Ariakit.useDisclosureStore({ animated: true, ...options }) + + return accordion +} diff --git a/lib/src/components/Accordion/styles.ts b/lib/src/components/Accordion/styles.ts new file mode 100644 index 0000000000..2e492001f0 --- /dev/null +++ b/lib/src/components/Accordion/styles.ts @@ -0,0 +1,85 @@ +import styled, { system, th } from '@xstyled/styled-components' +import * as Ariakit from '@ariakit/react' + +export const Accordion = styled.div` + ${th('accordions.wrapper')}; + ${system}; + transition: medium; + + &:hover { + border-color: neutral-50; + } +` + +export const Icon = styled.divBox` + flex-shrink: 0; + ${th('accordions.icon')}; + transform: rotate3d(0); + transition: medium; + width: 24; + height: 24; + color: inherit; + display: flex; + border-radius: 12; + + & *:first-child { + margin: auto; + } +` + +export const Disclosure = styled(Ariakit.Disclosure)` + ${th('accordions.title')}; + width: 100%; + padding: ${th('accordions.padding')}; + background-color: transparent; + border: 0; + display: flex; + justify-content: space-between; + align-items: center; + gap: xxl; + + &[aria-expanded='true'] { + ${Icon} { + transform: rotate3d(0, 0, 1, 90deg); + } + } + + &:focus, + &:hover { + cursor: pointer; + ${Icon} { + background-color: neutral-30; + } + } + + &:focus { + outline: 0; + ${Icon} { + color: inherit; + } + } +` +export const Content = styled(Ariakit.DisclosureContent)` + display: grid; + grid-template-rows: 0fr; + transition-property: grid-template-rows; + transition-timing-function: linear; + transition-duration: 200ms; + animation-duration: 200ms; + + > * { + overflow: hidden; + padding: 0; + } + + &[data-enter] { + grid-template-rows: 1fr; + } +` + +export const ContentChild = styled.div` + ${th('accordions.content')}; + padding: ${th('accordions.padding')}; + padding-top: 0; + color: neutral-70; +` diff --git a/lib/src/components/Accordion/tests/index.test.tsx b/lib/src/components/Accordion/tests/index.test.tsx new file mode 100644 index 0000000000..226f2a94c8 --- /dev/null +++ b/lib/src/components/Accordion/tests/index.test.tsx @@ -0,0 +1,53 @@ +import React from 'react' +import { act, renderHook, screen } from '@testing-library/react' + +import { render } from '../../../../tests' +import { Accordion, useAccordion } from '../' + +const content = 'content' +const title = 'title' + +describe('', () => { + it('should have correct attribute on click on element', async () => { + const { + result: { current: store }, + } = renderHook(() => useAccordion()) + + const { user } = render( + + {content} + + ) + + const button = screen.getByTestId('accordion-title') + const children = screen.getByTestId('accordion-content') + + expect(button).toHaveTextContent(title) + expect(button).toHaveAttribute('aria-expanded', 'false') + expect(children).toHaveTextContent(content) + expect(children).toHaveAttribute('hidden') + + await act(() => user.click(button)) + + expect(button).toHaveAttribute('aria-expanded', 'true') + expect(children).not.toHaveAttribute('hidden') + }) + + it('should have correct attribute on open at start', () => { + const { + result: { current: store }, + } = renderHook(() => useAccordion({ defaultOpen: true })) + + render( + + {content} + + ) + + const button = screen.getByTestId('accordion-title') + const children = screen.getByTestId('accordion-content') + + expect(button).toHaveAttribute('aria-expanded', 'true') + expect(children).not.toHaveAttribute('hidden') + }) +}) diff --git a/lib/src/components/Accordion/theme.ts b/lib/src/components/Accordion/theme.ts new file mode 100644 index 0000000000..a6244a9e75 --- /dev/null +++ b/lib/src/components/Accordion/theme.ts @@ -0,0 +1,32 @@ +import { CSSObject } from '@xstyled/styled-components' + +import { ThemeValues } from '@/theme' + +export type ThemeAccordions = { + content: CSSObject + icon: CSSObject + padding: string + title: CSSObject + wrapper: CSSObject +} + +export const getAccordions = (theme: ThemeValues): ThemeAccordions => { + const { borderWidths, colors, fontSizes, radii, space, texts, transitions } = theme + + return { + padding: space.lg, + wrapper: { + backgroundColor: colors['neutral-10'], + transition: transitions.medium, + border: `${borderWidths.sm} solid ${colors['neutral-30']}`, + borderRadius: radii.md, + }, + icon: { + color: colors['neutral-90'], + }, + content: { + fontSize: fontSizes.sm, + }, + title: texts.h5, + } +} diff --git a/lib/src/components/Alert/Title.tsx b/lib/src/components/Alert/Title.tsx new file mode 100644 index 0000000000..a22aa40ceb --- /dev/null +++ b/lib/src/components/Alert/Title.tsx @@ -0,0 +1,18 @@ +import React from 'react' + +import * as S from './styles' + +import { TextProps } from '@/Text' + +export type AlertTitleProps = Pick + +/** + * @name Alert.Title + */ +export const Title: React.FC = ({ children, dataTestId, variant }) => { + return ( + + {children} + + ) +} diff --git a/lib/src/components/Alert/docs/examples/close-button.tsx b/lib/src/components/Alert/docs/examples/close-button.tsx new file mode 100644 index 0000000000..5386989e9c --- /dev/null +++ b/lib/src/components/Alert/docs/examples/close-button.tsx @@ -0,0 +1,19 @@ +import * as React from 'react' + +import { Alert } from '@/Alert' + +const Example = () => { + const [hideAlert, setHideAlert] = React.useState(false) + + return hideAlert ? ( + It’s hidden! + ) : ( + setHideAlert(true)}> + Welcome to the jungle + Nunc laoreet egestas nulla, et dapibus sem malesuada in. Suspendisse eleifend accumsan + ultrices. Phasellus iaculis nisi sed dui ornare commodo. Nullam dapibus varius nibh a ornare. + + ) +} + +export default Example diff --git a/packages/Alert/docs/examples/cta.tsx b/lib/src/components/Alert/docs/examples/cta.tsx similarity index 93% rename from packages/Alert/docs/examples/cta.tsx rename to lib/src/components/Alert/docs/examples/cta.tsx index d6b76e0cf7..6d9b3bf8d0 100644 --- a/packages/Alert/docs/examples/cta.tsx +++ b/lib/src/components/Alert/docs/examples/cta.tsx @@ -1,5 +1,6 @@ import * as React from 'react' -import { Alert } from '@welcome-ui/alert' + +import { Alert } from '@/Alert' const Example = () => { return ( diff --git a/packages/Alert/docs/examples/is-full-width.tsx b/lib/src/components/Alert/docs/examples/is-full-width.tsx similarity index 90% rename from packages/Alert/docs/examples/is-full-width.tsx rename to lib/src/components/Alert/docs/examples/is-full-width.tsx index ad57ecc5d3..46d1c08499 100644 --- a/packages/Alert/docs/examples/is-full-width.tsx +++ b/lib/src/components/Alert/docs/examples/is-full-width.tsx @@ -1,5 +1,6 @@ import * as React from 'react' -import { Alert } from '@welcome-ui/alert' + +import { Alert } from '@/Alert' const Example = () => { return ( diff --git a/lib/src/components/Alert/docs/examples/overview.tsx b/lib/src/components/Alert/docs/examples/overview.tsx new file mode 100644 index 0000000000..e09c6cfbdd --- /dev/null +++ b/lib/src/components/Alert/docs/examples/overview.tsx @@ -0,0 +1,14 @@ +import * as React from 'react' + +import { Alert } from '@/Alert' + +const Example = () => { + return ( + + Nunc laoreet egestas nulla, et dapibus sem malesuada in. Suspendisse eleifend accumsan + ultrices. Phasellus iaculis nisi sed dui ornare commodo. Nullam dapibus varius nibh a ornare. + + ) +} + +export default Example diff --git a/lib/src/components/Alert/docs/examples/sizes.tsx b/lib/src/components/Alert/docs/examples/sizes.tsx new file mode 100644 index 0000000000..8f308d3037 --- /dev/null +++ b/lib/src/components/Alert/docs/examples/sizes.tsx @@ -0,0 +1,25 @@ +import * as React from 'react' + +import { Alert } from '@/Alert' +import { Stack } from '@/Stack' + +const Example = () => { + return ( + + Button}> + Default size + Nunc laoreet egestas nulla, et dapibus sem malesuada in. Suspendisse eleifend accumsan + ultrices. Phasellus iaculis nisi sed dui ornare commodo. Nullam dapibus varius nibh a + ornare. + + Button} size="md"> + Medium size + Nunc laoreet egestas nulla, et dapibus sem malesuada in. Suspendisse eleifend accumsan + ultrices. Phasellus iaculis nisi sed dui ornare commodo. Nullam dapibus varius nibh a + ornare. + + + ) +} + +export default Example diff --git a/lib/src/components/Alert/docs/examples/title.tsx b/lib/src/components/Alert/docs/examples/title.tsx new file mode 100644 index 0000000000..59eeee77fd --- /dev/null +++ b/lib/src/components/Alert/docs/examples/title.tsx @@ -0,0 +1,15 @@ +import * as React from 'react' + +import { Alert } from '@/Alert' + +const Example = () => { + return ( + + Title + Nunc laoreet egestas nulla, et dapibus sem malesuada in. Suspendisse eleifend accumsan + ultrices. Phasellus iaculis nisi sed dui ornare commodo. Nullam dapibus varius nibh a ornare. + + ) +} + +export default Example diff --git a/lib/src/components/Alert/docs/examples/variants.tsx b/lib/src/components/Alert/docs/examples/variants.tsx new file mode 100644 index 0000000000..0aec659b78 --- /dev/null +++ b/lib/src/components/Alert/docs/examples/variants.tsx @@ -0,0 +1,49 @@ +import * as React from 'react' + +import { Alert } from '@/Alert' +import { Stack } from '@/Stack' + +const Example = () => { + return ( + + + Default variant + Nunc laoreet egestas nulla, et dapibus sem malesuada in. Suspendisse eleifend accumsan + ultrices. Phasellus iaculis nisi sed dui ornare commodo. Nullam dapibus varius nibh a + ornare. + + + Beige variant + Nunc laoreet egestas nulla, et dapibus sem malesuada in. Suspendisse eleifend accumsan + ultrices. Phasellus iaculis nisi sed dui ornare commodo. Nullam dapibus varius nibh a + ornare. + + + Danger variant + Nunc laoreet egestas nulla, et dapibus sem malesuada in. Suspendisse eleifend accumsan + ultrices. Phasellus iaculis nisi sed dui ornare commodo. Nullam dapibus varius nibh a + ornare. + + + Warning variant + Nunc laoreet egestas nulla, et dapibus sem malesuada in. Suspendisse eleifend accumsan + ultrices. Phasellus iaculis nisi sed dui ornare commodo. Nullam dapibus varius nibh a + ornare. + + + Success variant + Nunc laoreet egestas nulla, et dapibus sem malesuada in. Suspendisse eleifend accumsan + ultrices. Phasellus iaculis nisi sed dui ornare commodo. Nullam dapibus varius nibh a + ornare. + + + Info variant + Nunc laoreet egestas nulla, et dapibus sem malesuada in. Suspendisse eleifend accumsan + ultrices. Phasellus iaculis nisi sed dui ornare commodo. Nullam dapibus varius nibh a + ornare. + + + ) +} + +export default Example diff --git a/packages/Alert/docs/index.mdx b/lib/src/components/Alert/docs/index.mdx similarity index 100% rename from packages/Alert/docs/index.mdx rename to lib/src/components/Alert/docs/index.mdx diff --git a/lib/src/components/Alert/docs/properties.json b/lib/src/components/Alert/docs/properties.json new file mode 100644 index 0000000000..514e53c5b5 --- /dev/null +++ b/lib/src/components/Alert/docs/properties.json @@ -0,0 +1,182 @@ +{ + "Alert": { + "props": { + "closeButtonDataTestId": { + "defaultValue": null, + "description": "", + "name": "closeButtonDataTestId", + "parent": { + "fileName": "welcome-ui/lib/src/components/Alert/index.tsx", + "name": "AlertOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Alert/index.tsx", + "name": "AlertOptions" + } + ], + "required": false, + "type": { + "name": "string" + } + }, + "cta": { + "defaultValue": null, + "description": "", + "name": "cta", + "parent": { + "fileName": "welcome-ui/lib/src/components/Alert/index.tsx", + "name": "AlertOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Alert/index.tsx", + "name": "AlertOptions" + } + ], + "required": false, + "type": { + "name": "Element" + } + }, + "handleClose": { + "defaultValue": null, + "description": "@description add a close button with an onclick handleClose function", + "name": "handleClose", + "parent": { + "fileName": "welcome-ui/lib/src/components/Alert/index.tsx", + "name": "AlertOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Alert/index.tsx", + "name": "AlertOptions" + } + ], + "required": false, + "type": { + "name": "() => void" + } + }, + "icon": { + "defaultValue": null, + "description": "", + "name": "icon", + "parent": { + "fileName": "welcome-ui/lib/src/components/Alert/index.tsx", + "name": "AlertOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Alert/index.tsx", + "name": "AlertOptions" + } + ], + "required": false, + "type": { + "name": "Element" + } + }, + "isFullWidth": { + "defaultValue": null, + "description": "", + "name": "isFullWidth", + "parent": { + "fileName": "welcome-ui/lib/src/components/Alert/index.tsx", + "name": "AlertOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Alert/index.tsx", + "name": "AlertOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "size": { + "defaultValue": { + "value": "sm" + }, + "description": "", + "name": "size", + "parent": { + "fileName": "welcome-ui/lib/src/components/Alert/index.tsx", + "name": "AlertOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Alert/index.tsx", + "name": "AlertOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "Size", + "value": [ + { + "value": "\"sm\"" + }, + { + "value": "\"md\"" + } + ] + } + }, + "variant": { + "defaultValue": { + "value": "default" + }, + "description": "", + "name": "variant", + "parent": { + "fileName": "welcome-ui/lib/src/components/Alert/index.tsx", + "name": "AlertOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Alert/index.tsx", + "name": "AlertOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "Variant", + "value": [ + { + "value": "\"danger\"" + }, + { + "value": "\"success\"" + }, + { + "value": "\"warning\"" + }, + { + "value": "\"info\"" + }, + { + "value": "\"default\"" + }, + { + "value": "\"beige\"" + } + ] + } + } + } + } +} \ No newline at end of file diff --git a/lib/src/components/Alert/index.tsx b/lib/src/components/Alert/index.tsx new file mode 100644 index 0000000000..2e088e5c1f --- /dev/null +++ b/lib/src/components/Alert/index.tsx @@ -0,0 +1,133 @@ +import React, { Children, cloneElement } from 'react' + +import { Title } from './Title' +import * as S from './styles' + +import { CloseButton } from '@/CloseButton' +import { Button, ButtonProps } from '@/Button' +import { CreateWuiProps, forwardRef } from '@/System' +import { Box } from '@/Box' + +type Size = 'sm' | 'md' +type Variant = 'danger' | 'success' | 'warning' | 'info' | 'default' | 'beige' +export interface AlertOptions { + closeButtonDataTestId?: string + cta?: JSX.Element + /** + * @description add a close button with an onclick handleClose function + */ + handleClose?: () => void + icon?: JSX.Element | null + isFullWidth?: boolean + size?: Size + variant?: Variant +} + +export type AlertProps = CreateWuiProps<'div', AlertOptions> + +type CloneActionsReturns = React.ReactElement< + AlertProps, + string | React.JSXElementConstructor +> + +const AlertComponent = forwardRef<'div', AlertProps>( + ( + { + children, + cta, + dataTestId, + handleClose, + icon, + isFullWidth, + size = 'sm', + variant = 'default', + ...rest + }, + ref + ) => { + const closeButtonDataTestId = dataTestId ? `${dataTestId}-close-button` : undefined + const defaultVariantIcon = variant === 'beige' ? 'default' : variant + + const content = Children.toArray(children).map((child: React.ReactElement) => { + if (child.type === Title) return cloneElement(child, { variant: size }) + + return child + }) + + // Handle clone actions recursively in case of multiple buttons + const cloneActions = (child: React.ReactElement): CloneActionsReturns => { + if (child) { + if (child.type === AlertButton) return cloneElement(child, { size }) + if (child.type === AlertSecondaryButton) return cloneElement(child, { size }) + + if (child.props?.children) { + return cloneElement(child, { + ...child.props, + children: Children.map(child.props.children, (nestedChild: React.ReactElement) => + cloneActions(nestedChild) + ), + }) + } + } + + return child + } + + const actions = React.isValidElement(cta) ? cloneActions(cta) : cta + + return ( + + {!!handleClose && ( + + )} + {icon !== null && } + + + {content} + {!!actions && ( + + {actions} + + )} + + + + ) + } +) + +// We need this component to check its existence in and to allow users to add Button in content +const AlertButton = forwardRef<'button', Omit>((props, ref) => ( + +} + +export default Example diff --git a/packages/Button/docs/examples/icons.tsx b/lib/src/components/Button/docs/examples/icons.tsx similarity index 84% rename from packages/Button/docs/examples/icons.tsx rename to lib/src/components/Button/docs/examples/icons.tsx index f59a714bf0..83e6f9fb68 100644 --- a/packages/Button/docs/examples/icons.tsx +++ b/lib/src/components/Button/docs/examples/icons.tsx @@ -1,6 +1,7 @@ import * as React from 'react' -import { Button } from '@welcome-ui/button' -import { WttjIcon } from '@welcome-ui/icons' + +import { Button } from '@/Button' +import { WttjIcon } from '@/Icons' const Example = () => { return ( diff --git a/packages/Button/docs/examples/is-loading.tsx b/lib/src/components/Button/docs/examples/is-loading.tsx similarity index 88% rename from packages/Button/docs/examples/is-loading.tsx rename to lib/src/components/Button/docs/examples/is-loading.tsx index 2aceb7d507..70268459b3 100644 --- a/packages/Button/docs/examples/is-loading.tsx +++ b/lib/src/components/Button/docs/examples/is-loading.tsx @@ -1,5 +1,6 @@ import * as React from 'react' -import { Button } from '@welcome-ui/button' + +import { Button } from '@/Button' const Example = () => { const [isLoading, setIsLoading] = React.useState(false) diff --git a/packages/Button/docs/examples/link.tsx b/lib/src/components/Button/docs/examples/link.tsx similarity index 76% rename from packages/Button/docs/examples/link.tsx rename to lib/src/components/Button/docs/examples/link.tsx index 3455825265..a0a85fe8cb 100644 --- a/packages/Button/docs/examples/link.tsx +++ b/lib/src/components/Button/docs/examples/link.tsx @@ -1,6 +1,7 @@ import * as React from 'react' -import { Button } from '@welcome-ui/button' -import { WttjIcon } from '@welcome-ui/icons' + +import { Button } from '@/Button' +import { WttjIcon } from '@/Icons' const Example = () => { return ( diff --git a/lib/src/components/Button/docs/examples/overview.tsx b/lib/src/components/Button/docs/examples/overview.tsx new file mode 100644 index 0000000000..160670eb3f --- /dev/null +++ b/lib/src/components/Button/docs/examples/overview.tsx @@ -0,0 +1,9 @@ +import * as React from 'react' + +import { Button } from '@/Button' + +const Example = () => { + return +} + +export default Example diff --git a/lib/src/components/Button/docs/examples/shapes.tsx b/lib/src/components/Button/docs/examples/shapes.tsx new file mode 100644 index 0000000000..c1ab46cdc0 --- /dev/null +++ b/lib/src/components/Button/docs/examples/shapes.tsx @@ -0,0 +1,37 @@ +import * as React from 'react' + +import { Button } from '@/Button' +import { WttjIcon } from '@/Icons' + +const Example = () => { + return ( + <> + + + + + + + + + + ) +} + +export default Example diff --git a/lib/src/components/Button/docs/examples/sizes.tsx b/lib/src/components/Button/docs/examples/sizes.tsx new file mode 100644 index 0000000000..455f864c2e --- /dev/null +++ b/lib/src/components/Button/docs/examples/sizes.tsx @@ -0,0 +1,16 @@ +import * as React from 'react' + +import { Button } from '@/Button' + +const Example = () => { + return ( + <> + + + + + + ) +} + +export default Example diff --git a/lib/src/components/Button/docs/examples/variants.tsx b/lib/src/components/Button/docs/examples/variants.tsx new file mode 100644 index 0000000000..1239fac77b --- /dev/null +++ b/lib/src/components/Button/docs/examples/variants.tsx @@ -0,0 +1,16 @@ +import * as React from 'react' + +import { Button } from '@/Button' + +const Example = () => { + return ( + <> + + + + + + ) +} + +export default Example diff --git a/packages/Button/docs/index.mdx b/lib/src/components/Button/docs/index.mdx similarity index 100% rename from packages/Button/docs/index.mdx rename to lib/src/components/Button/docs/index.mdx diff --git a/lib/src/components/Button/docs/properties.json b/lib/src/components/Button/docs/properties.json new file mode 100644 index 0000000000..2ea1204ee4 --- /dev/null +++ b/lib/src/components/Button/docs/properties.json @@ -0,0 +1,194 @@ +{ + "Button": { + "tag": "button", + "props": { + "danger": { + "defaultValue": null, + "description": "Danger button with 3 variants: primary / tertiary / ghost", + "name": "danger", + "parent": { + "fileName": "welcome-ui/lib/src/components/Button/index.tsx", + "name": "ButtonOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Button/index.tsx", + "name": "ButtonOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "disabled": { + "defaultValue": null, + "description": "", + "name": "disabled", + "parent": { + "fileName": "welcome-ui/lib/src/components/Button/index.tsx", + "name": "ButtonOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Button/index.tsx", + "name": "ButtonOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "isLoading": { + "defaultValue": null, + "description": "", + "name": "isLoading", + "parent": { + "fileName": "welcome-ui/lib/src/components/Button/index.tsx", + "name": "ButtonOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Button/index.tsx", + "name": "ButtonOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "shape": { + "defaultValue": null, + "description": "", + "name": "shape", + "parent": { + "fileName": "welcome-ui/lib/src/components/Button/index.tsx", + "name": "ButtonOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Button/index.tsx", + "name": "ButtonOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "Shape", + "value": [ + { + "value": "\"circle\"" + }, + { + "value": "\"square\"" + } + ] + } + }, + "size": { + "defaultValue": { + "value": "md" + }, + "description": "", + "name": "size", + "parent": { + "fileName": "welcome-ui/lib/src/components/Button/index.tsx", + "name": "ButtonOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Button/index.tsx", + "name": "ButtonOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "Size", + "value": [ + { + "value": "\"xs\"" + }, + { + "value": "\"sm\"" + }, + { + "value": "\"md\"" + }, + { + "value": "\"lg\"" + } + ] + } + }, + "variant": { + "defaultValue": { + "value": "primary" + }, + "description": "", + "name": "variant", + "parent": { + "fileName": "welcome-ui/lib/src/components/Button/index.tsx", + "name": "ButtonOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Button/index.tsx", + "name": "ButtonOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "Variant", + "value": [ + { + "value": "\"disabled\"" + }, + { + "value": "\"primary\"" + }, + { + "value": "\"secondary\"" + }, + { + "value": "\"tertiary\"" + }, + { + "value": "\"ghost\"" + } + ] + } + } + } + } +} \ No newline at end of file diff --git a/lib/src/components/Button/index.tsx b/lib/src/components/Button/index.tsx new file mode 100644 index 0000000000..ed0368a241 --- /dev/null +++ b/lib/src/components/Button/index.tsx @@ -0,0 +1,81 @@ +import React from 'react' + +import * as S from './styles' + +import { Loader } from '@/Loader' +import { CreateWuiProps, forwardRef } from '@/System' +import { Box } from '@/Box' + +type Shape = 'circle' | 'square' +type Size = 'xs' | 'sm' | 'md' | 'lg' +type Variant = 'primary' | 'secondary' | 'tertiary' | 'ghost' | 'disabled' + +export interface ButtonOptions { + /** Danger button with 3 variants: primary / tertiary / ghost */ + danger?: boolean + disabled?: boolean + isLoading?: boolean + shape?: Shape + size?: Size + variant?: Variant +} + +export type ButtonProps = CreateWuiProps<'button', ButtonOptions> + +/** + * @tag button + */ +export const Button = forwardRef<'button', ButtonProps>( + ( + { + children, + danger, + dataTestId, + disabled, + isLoading, + size = 'md', + variant = 'primary', + ...rest + }, + ref + ) => { + const isDisabled = disabled || isLoading + + return ( + + {isLoading && ( +
+ + + + {children} +
+ )} + {!isLoading && children} + + ) + } +) + +Button.displayName = 'Button' + +export const StyledButton = S.Button diff --git a/lib/src/components/Button/styles.ts b/lib/src/components/Button/styles.ts new file mode 100644 index 0000000000..aae5c60fa6 --- /dev/null +++ b/lib/src/components/Button/styles.ts @@ -0,0 +1,97 @@ +import styled, { css, system, th } from '@xstyled/styled-components' +import { Button as AriakitButton } from '@ariakit/react' + +import { hideFocusRingsDataAttribute } from '../../utils/hide-focus-rings-root' + +import { ButtonOptions } from './index' + +import { shouldForwardProp } from '@/System' + +const shapeStyles = (size: ButtonOptions['size'], shape: ButtonOptions['shape'] = 'square') => css` + width: ${th(`buttons.sizes.${size}.height`)}; + padding: 0; + ${shape === 'circle' && + css` + border-radius: ${th(`buttons.sizes.${size}.height`)}; + `}; +` + +export const Button = styled(AriakitButton).withConfig({ shouldForwardProp })( + ({ danger, disabled, shape, size = 'md', variant = 'primary' }) => css` + ${th(`buttons.${variant}`)}; + ${danger && + css` + ${th(`buttons.danger.${variant}`)}; + `} + position: relative; + display: inline-flex; + align-items: center; + justify-content: center; + width: auto; + ${th(`buttons.sizes.${size}`)}; + text-decoration: none; + text-align: center; + white-space: nowrap; + cursor: pointer; + outline: none !important; /* important for firefox */ + border-width: sm; + border-style: solid; + appearance: none; + overflow: hidden; + transition: medium; + ${shape && shapeStyles(size, shape)}; + ${system}; + + & > svg.wui-icon, + & > i.wui-icon-font { + font-weight: initial; + + &:only-child { + width: ${th(`buttons.icon.only.${size}`)}; + height: ${th(`buttons.icon.only.${size}`)}; + font-size: ${th(`buttons.icon.only.${size}`)}; + } + &:not(:only-child) { + width: ${th(`buttons.icon.default.${size}`)}; + height: ${th(`buttons.icon.default.${size}`)}; + font-size: ${th(`buttons.icon.default.${size}`)}; + } + } + + & > *:not(:only-child):not(:last-child) { + margin-right: sm; + } + + ${!disabled && + css` + [${hideFocusRingsDataAttribute}] &:focus { + box-shadow: none; + } + &:focus { + ${th(`buttons.focus.${variant}`)}; + ${danger && + css` + ${th(`buttons.focus.danger.${variant}`)}; + `} + } + &:hover { + ${th(`buttons.hover.${variant}`)}; + ${danger && + css` + ${th(`buttons.hover.danger.${variant}`)}; + `} + } + &:active { + ${th(`buttons.active.${variant}`)}; + ${danger && + css` + ${th(`buttons.active.danger.${variant}`)}; + `} + } + `}; + + &[disabled] { + cursor: not-allowed; + } + ` +) diff --git a/lib/src/components/Button/tests/index.test.tsx b/lib/src/components/Button/tests/index.test.tsx new file mode 100644 index 0000000000..2ad0c1235a --- /dev/null +++ b/lib/src/components/Button/tests/index.test.tsx @@ -0,0 +1,250 @@ +import React from 'react' +import { act, screen } from '@testing-library/react' + +import { SunIcon } from '../../Icons' +import { Link } from '../../Link' +import { IconsFont } from '../../IconsFont' +import { Button } from '../' +import { render } from '../../../../tests' +import { createTheme } from '../../../theme' + +const content = 'Jungle' + +describe(') + + const button = screen.getByTestId('button') + + expect(button).toHaveTextContent(content) + expect(button).not.toBeDisabled() + expect(button).toHaveStyleRule('background-color', theme.colors['primary-40']) + expect(button).toHaveStyleRule('height', theme.buttons.sizes.md.height) + }) + + it('should render a danger button', () => { + const theme = createTheme() + + render( + + ) + + const button = screen.getByTestId('button') + + expect(button).toHaveTextContent(content) + expect(button).not.toBeDisabled() + expect(button).toHaveStyleRule('background-color', theme.colors['red-70']) + }) + + it('should call onClick property', async () => { + const onClick = jest.fn() + + const { user } = render( + + ) + + const eventElement = screen.getByText(content) + + await act(() => user.click(eventElement)) + + expect(onClick).toHaveBeenCalledTimes(1) + }) + + it('should look like a square', () => { + const theme = createTheme() + + render( + + ) + const button = screen.getByTestId('button') + + expect(button).toHaveStyleRule('width', theme.buttons.sizes.sm.height) + expect(button).toHaveStyleRule('height', theme.buttons.sizes.sm.height) + }) + + it('should have correct size', () => { + const theme = createTheme() + + render( + + ) + const button = screen.getByTestId('button') + + expect(button).toHaveStyleRule('height', theme.buttons.sizes.sm.height) + }) + + describe('disabled', () => { + it('should not call onClick property', async () => { + const onClick = jest.fn() + + render( + + ) + + const eventElement = screen.getByText(content) + + expect(eventElement).toBeDisabled() + }) + + it('should have disabled attribute', () => { + const theme = createTheme() + + render( + + ) + + const button = screen.getByTestId('button') + + expect(button).toBeDisabled() + expect(button).toHaveStyleRule('background-color', theme.colors['beige-40']) + expect(button).toHaveStyleRule('border-color', theme.colors['beige-40']) + }) + }) + + it('should forward as div', () => { + render( + + ) + + const button = screen.getByTestId('button') + + expect(button.tagName.toLowerCase()).toBe('div') + }) + + it('should forward as a', () => { + render( + + ) + + const button = screen.getByTestId('button') + + expect(button.tagName.toLowerCase()).toBe('a') + expect(button).toHaveAttribute('href', content) + }) + + it('should forward as Link', () => { + render( + + ) + + const button = screen.getByTestId('button') + + expect(button.tagName.toLowerCase()).toBe('a') + expect(button).toHaveClass('wui-test') + expect(button).toHaveAttribute('rel', 'noopener noreferrer') // added by target="_blank" on Link + }) + + it('should have correct Icon size with Icon and text', () => { + const theme = createTheme() + + render( + + ) + + const button = screen.getByTestId('button') + const icon = screen.getByTestId('icon-sun') + + expect(button).toHaveStyleRule('height', theme.buttons.sizes.sm.height) + expect(icon).toHaveStyle({ + width: theme.buttons.icon.default.sm, + height: theme.buttons.icon.default.sm, + 'font-size': theme.buttons.icon.default.sm, + }) + }) + + it('should have correct Icon size with Icon only', () => { + const theme = createTheme() + + render( + + ) + + const button = screen.getByTestId('button') + const icon = screen.getByTestId('icon-sun') + + expect(button).toHaveStyleRule('height', theme.buttons.sizes.md.height) + expect(icon).toHaveStyle({ + width: theme.buttons.icon.only.md, + height: theme.buttons.icon.only.md, + 'font-size': theme.buttons.icon.only.md, + }) + }) + + it('should have correct IconsFont size with IconsFont and text', () => { + const theme = createTheme() + + render( + + ) + + const button = screen.getByTestId('button') + const icon = screen.getByTestId('icon-font-sun') + + expect(button).toHaveStyleRule('height', theme.buttons.sizes.sm.height) + expect(icon).toHaveStyle({ + width: theme.buttons.icon.default.sm, + height: theme.buttons.icon.default.sm, + 'font-size': theme.buttons.icon.default.sm, + }) + }) + + it('should have correct IconsFont size with IconsFont only', () => { + const theme = createTheme() + + render( + + ) + + const button = screen.getByTestId('button') + const icon = screen.getByTestId('icon-font-sun') + + expect(button).toHaveStyleRule('height', theme.buttons.sizes.md.height) + expect(icon).toHaveStyle({ + width: theme.buttons.icon.only.md, + height: theme.buttons.icon.only.md, + 'font-size': theme.buttons.icon.only.md, + }) + }) + + it('should have data-loading attribute', () => { + render( + + ) + + const button = screen.getByTestId('button') + + expect(button).toHaveAttribute('data-loading', 'true') + }) +}) diff --git a/lib/src/components/Button/theme.ts b/lib/src/components/Button/theme.ts new file mode 100644 index 0000000000..223901c170 --- /dev/null +++ b/lib/src/components/Button/theme.ts @@ -0,0 +1,186 @@ +import { CSSObject } from '@xstyled/styled-components' + +import { ThemeFocus } from '../../theme/focus' +import { hexToRGBA } from '../../utils/hex-to-rgba' + +import { ThemeValues } from '@/theme' + +type CommonAttributesButton = CSSObject + +type SizeAttributesButton = CSSObject + +type Variant = 'primary' | 'secondary' | 'tertiary' | 'ghost' +type Size = 'xs' | 'sm' | 'md' | 'lg' +type Icon = 'only' | 'default' + +export type ThemeButtons = Record & + Record<'hover', Record> & + Record<'focus', Record> & + Record<'active', Record> & + Record<'disabled', CommonAttributesButton & { '&:focus': ReturnType }> & + Record<'sizes', Record> & + Record<'icon', Record>> + +export const getButtons = (theme: ThemeValues): ThemeButtons => { + const { colors, focus, fontWeights, radii, space, texts, toRem } = theme + const defaults = { + ...texts.xs, + color: colors['neutral-10'], + fontWeight: fontWeights.bold, + letterSpacing: 0, + borderRadius: radii.md, + } + + return { + primary: { + ...defaults, + color: theme.colors['neutral-90'], + backgroundColor: colors['primary-40'], + borderColor: colors['primary-40'], + }, + secondary: { + ...defaults, + backgroundColor: colors['neutral-90'], + borderColor: colors['neutral-90'], + }, + tertiary: { + ...defaults, + color: colors['neutral-90'], + backgroundColor: 'transparent', + borderColor: colors['neutral-90'], + }, + ghost: { + ...defaults, + color: colors['neutral-90'], + backgroundColor: 'transparent', + borderColor: 'transparent', + }, + danger: { + primary: { + color: colors['neutral-10'], + backgroundColor: colors['red-70'], + borderColor: colors['red-70'], + }, + tertiary: { + backgroundColor: 'transparent', + color: colors['red-80'], + borderColor: colors['red-80'], + }, + ghost: { + color: colors['red-80'], + backgroundColor: 'transparent', + borderColor: 'transparent', + }, + }, + hover: { + primary: { + backgroundColor: colors['primary-30'], + borderColor: colors['primary-30'], + }, + secondary: { + backgroundColor: colors['neutral-70'], + borderColor: 'transparent', + }, + tertiary: { + backgroundColor: hexToRGBA(colors['neutral-90'], 0.1), + }, + ghost: { + backgroundColor: hexToRGBA(colors['neutral-90'], 0.1), + }, + danger: { + primary: { + backgroundColor: colors['red-60'], + borderColor: colors['red-60'], + }, + tertiary: { + backgroundColor: colors['red-10'], + }, + ghost: { + backgroundColor: colors['red-10'], + }, + }, + }, + focus: { + primary: { ...focus(colors['primary-20']) }, + secondary: { ...focus(colors['neutral-40']) }, + tertiary: { ...focus(colors['neutral-40']) }, + ghost: { ...focus(colors['neutral-40']) }, + danger: { + primary: { ...focus(colors['red-40']) }, + tertiary: { ...focus(colors['red-40']) }, + ghost: { ...focus(colors['red-40']) }, + }, + }, + active: { + primary: { + backgroundColor: colors['primary-10'], + borderColor: colors['primary-10'], + }, + secondary: { + backgroundColor: colors['neutral-50'], + borderColor: colors['neutral-50'], + }, + tertiary: { + backgroundColor: hexToRGBA(colors['neutral-90'], 0.4), + }, + ghost: { + backgroundColor: hexToRGBA(colors['neutral-90'], 0.4), + }, + danger: { + primary: { + backgroundColor: colors['red-50'], + borderColor: colors['red-50'], + }, + tertiary: { + backgroundColor: colors['red-20'], + }, + ghost: { + backgroundColor: colors['red-20'], + }, + }, + }, + disabled: { + ...defaults, + color: colors['beige-70'], + backgroundColor: colors['beige-40'], + borderColor: colors['beige-40'], + '&:focus': { ...focus(colors['beige-10']) }, + }, + sizes: { + xs: { + height: toRem(24), + padding: `${space.xs} ${space.sm}`, + }, + sm: { + height: toRem(32), + padding: `${space.sm} ${space.md}`, + }, + md: { + ...texts.sm, + fontWeight: fontWeights.bold, + height: toRem(40), + padding: `${space.sm} ${space.lg}`, + }, + lg: { + ...texts.sm, + fontWeight: fontWeights.bold, + height: toRem(48), + padding: `${space.md} ${space.xl}`, + }, + }, + icon: { + only: { + xs: toRem(16), + sm: toRem(16), + md: toRem(16), + lg: toRem(24), + }, + default: { + xs: toRem(12), + sm: toRem(16), + md: toRem(16), + lg: toRem(16), + }, + }, + } +} diff --git a/packages/ButtonGroup/docs/examples/overload.tsx b/lib/src/components/ButtonGroup/docs/examples/overload.tsx similarity index 77% rename from packages/ButtonGroup/docs/examples/overload.tsx rename to lib/src/components/ButtonGroup/docs/examples/overload.tsx index 63291896b5..05fdf36253 100644 --- a/packages/ButtonGroup/docs/examples/overload.tsx +++ b/lib/src/components/ButtonGroup/docs/examples/overload.tsx @@ -1,7 +1,8 @@ -import { Button } from '@welcome-ui/button' -import { ButtonGroup } from '@welcome-ui/button-group' import * as React from 'react' +import { Button } from '@/Button' +import { ButtonGroup } from '@/ButtonGroup' + const Example = () => { return ( diff --git a/lib/src/components/ButtonGroup/docs/examples/overview.tsx b/lib/src/components/ButtonGroup/docs/examples/overview.tsx new file mode 100644 index 0000000000..b0678d5854 --- /dev/null +++ b/lib/src/components/ButtonGroup/docs/examples/overview.tsx @@ -0,0 +1,17 @@ +import * as React from 'react' + +import { Button } from '@/Button' +import { ButtonGroup } from '@/ButtonGroup' + +const Example = () => { + return ( + + + + + + + ) +} + +export default Example diff --git a/packages/ButtonGroup/docs/index.mdx b/lib/src/components/ButtonGroup/docs/index.mdx similarity index 100% rename from packages/ButtonGroup/docs/index.mdx rename to lib/src/components/ButtonGroup/docs/index.mdx diff --git a/lib/src/components/ButtonGroup/docs/properties.json b/lib/src/components/ButtonGroup/docs/properties.json new file mode 100644 index 0000000000..c940d26d0e --- /dev/null +++ b/lib/src/components/ButtonGroup/docs/properties.json @@ -0,0 +1,105 @@ +{ + "ButtonGroup": { + "props": { + "disabled": { + "defaultValue": null, + "description": "Disable all your buttons components", + "name": "disabled", + "parent": { + "fileName": "welcome-ui/lib/src/components/ButtonGroup/index.tsx", + "name": "ButtonGroupOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/ButtonGroup/index.tsx", + "name": "ButtonGroupOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "size": { + "defaultValue": null, + "description": "", + "name": "size", + "parent": { + "fileName": "welcome-ui/lib/src/components/ButtonGroup/index.tsx", + "name": "ButtonGroupOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/ButtonGroup/index.tsx", + "name": "ButtonGroupOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "Size", + "value": [ + { + "value": "\"xs\"" + }, + { + "value": "\"sm\"" + }, + { + "value": "\"md\"" + }, + { + "value": "\"lg\"" + } + ] + } + }, + "variant": { + "defaultValue": null, + "description": "", + "name": "variant", + "parent": { + "fileName": "welcome-ui/lib/src/components/ButtonGroup/index.tsx", + "name": "ButtonGroupOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/ButtonGroup/index.tsx", + "name": "ButtonGroupOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "Variant", + "value": [ + { + "value": "\"disabled\"" + }, + { + "value": "\"primary\"" + }, + { + "value": "\"secondary\"" + }, + { + "value": "\"tertiary\"" + }, + { + "value": "\"ghost\"" + } + ] + } + } + } + } +} \ No newline at end of file diff --git a/lib/src/components/ButtonGroup/index.tsx b/lib/src/components/ButtonGroup/index.tsx new file mode 100644 index 0000000000..389943284f --- /dev/null +++ b/lib/src/components/ButtonGroup/index.tsx @@ -0,0 +1,42 @@ +import React, { Children, cloneElement } from 'react' + +import * as S from './styles' + +import { CreateWuiProps, forwardRef } from '@/System' +import { Button, ButtonProps } from '@/Button' + +type ChildType = React.ReactElement | null | undefined | boolean +type ChildrenProps = ChildType | ChildType[] + +export interface ButtonGroupOptions { + children: ChildrenProps + /** Disable all your buttons components */ + disabled?: boolean + size?: ButtonProps['size'] + variant?: ButtonProps['variant'] +} + +export type ButtonGroupProps = CreateWuiProps<'div', ButtonGroupOptions> + +export const ButtonGroup = forwardRef<'div', ButtonGroupProps>( + ({ children, dataTestId, disabled, size, variant }, ref) => { + function setGlobalProps(children: ChildrenProps) { + return Children.toArray(children) + .filter(Boolean) + .map((child: React.ReactElement) => { + return cloneElement(child, { + ...child.props, + disabled: disabled || child.props.disabled, + size: size || child.props.size, + variant: variant || child.props.variant, + }) + }) + } + + return ( + + {setGlobalProps(children)} + + ) + } +) diff --git a/packages/ButtonGroup/src/styles.ts b/lib/src/components/ButtonGroup/styles.ts similarity index 100% rename from packages/ButtonGroup/src/styles.ts rename to lib/src/components/ButtonGroup/styles.ts diff --git a/lib/src/components/ButtonGroup/tests/index.test.tsx b/lib/src/components/ButtonGroup/tests/index.test.tsx new file mode 100644 index 0000000000..87ad431481 --- /dev/null +++ b/lib/src/components/ButtonGroup/tests/index.test.tsx @@ -0,0 +1,23 @@ +import React from 'react' + +import { Button } from '../../Button' +import { ButtonGroup } from '../' +import { render } from '../../../../tests' + +describe('', () => { + it('should render correctly', () => { + const { getByTestId } = render( + + + {null} + + {false} + + {undefined} + + ) + const group = getByTestId('group') + + expect(group).toHaveTextContent('OneTwoTree') + }) +}) diff --git a/packages/Card/src/Cover.styles.ts b/lib/src/components/Card/Cover.styles.ts similarity index 77% rename from packages/Card/src/Cover.styles.ts rename to lib/src/components/Card/Cover.styles.ts index bcd682b98c..427f2523d2 100644 --- a/packages/Card/src/Cover.styles.ts +++ b/lib/src/components/Card/Cover.styles.ts @@ -1,5 +1,6 @@ import styled, { system, th } from '@xstyled/styled-components' -import { Shape } from '@welcome-ui/shape' + +import { Shape } from '@/Shape' export const Cover = styled(Shape)` ${th('cards.cover')}; diff --git a/packages/Card/src/Cover.tsx b/lib/src/components/Card/Cover.tsx similarity index 87% rename from packages/Card/src/Cover.tsx rename to lib/src/components/Card/Cover.tsx index 81b22d520d..0fd719a760 100644 --- a/packages/Card/src/Cover.tsx +++ b/lib/src/components/Card/Cover.tsx @@ -1,8 +1,9 @@ import React from 'react' -import { ShapeProps } from '@welcome-ui/shape' import * as S from './Cover.styles' +import { ShapeProps } from '@/Shape' + export interface CoverOptions { src: string } diff --git a/packages/Card/docs/examples/content.tsx b/lib/src/components/Card/docs/examples/content.tsx similarity index 89% rename from packages/Card/docs/examples/content.tsx rename to lib/src/components/Card/docs/examples/content.tsx index f5da335b5f..a570989c7f 100644 --- a/packages/Card/docs/examples/content.tsx +++ b/lib/src/components/Card/docs/examples/content.tsx @@ -1,6 +1,7 @@ import * as React from 'react' -import { Card } from '@welcome-ui/card' -import { Text } from '@welcome-ui/text' + +import { Card } from '@/Card' +import { Text } from '@/Text' const Example = () => { return ( diff --git a/lib/src/components/Card/docs/examples/overview.tsx b/lib/src/components/Card/docs/examples/overview.tsx new file mode 100644 index 0000000000..f140df169f --- /dev/null +++ b/lib/src/components/Card/docs/examples/overview.tsx @@ -0,0 +1,17 @@ +import * as React from 'react' + +import { Card } from '@/Card' + +const Example = () => { + return ( + + + A card doesn’t have padding by default. To add padding to a card, you should wrap your + content in a Card.Body which has default padding of{' '} + lg. + + + ) +} + +export default Example diff --git a/packages/Card/docs/examples/picture.tsx b/lib/src/components/Card/docs/examples/picture.tsx similarity index 84% rename from packages/Card/docs/examples/picture.tsx rename to lib/src/components/Card/docs/examples/picture.tsx index 248135408e..56d7f2286f 100644 --- a/packages/Card/docs/examples/picture.tsx +++ b/lib/src/components/Card/docs/examples/picture.tsx @@ -1,7 +1,8 @@ import * as React from 'react' -import { Card } from '@welcome-ui/card' -import { Box } from '@welcome-ui/box' -import { Text } from '@welcome-ui/text' + +import { Card } from '@/Card' +import { Box } from '@/Box' +import { Text } from '@/Text' const Example = () => { return ( diff --git a/packages/Card/docs/index.mdx b/lib/src/components/Card/docs/index.mdx similarity index 100% rename from packages/Card/docs/index.mdx rename to lib/src/components/Card/docs/index.mdx diff --git a/lib/src/components/Card/docs/properties.json b/lib/src/components/Card/docs/properties.json new file mode 100644 index 0000000000..c2045b2a4d --- /dev/null +++ b/lib/src/components/Card/docs/properties.json @@ -0,0 +1,53 @@ +{ + "Card.Cover": { + "props": { + "shape": { + "defaultValue": null, + "description": "", + "name": "shape", + "parent": { + "fileName": "welcome-ui/lib/src/components/Shape/index.tsx", + "name": "ShapeOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Shape/index.tsx", + "name": "ShapeOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "\"circle\" | \"square\"", + "value": [ + { + "value": "\"circle\"" + }, + { + "value": "\"square\"" + } + ] + } + }, + "src": { + "defaultValue": null, + "description": "", + "name": "src", + "parent": { + "fileName": "welcome-ui/lib/src/components/Card/Cover.tsx", + "name": "CoverOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Card/Cover.tsx", + "name": "CoverOptions" + } + ], + "required": true, + "type": { + "name": "string" + } + } + } + } +} \ No newline at end of file diff --git a/lib/src/components/Card/index.tsx b/lib/src/components/Card/index.tsx new file mode 100644 index 0000000000..37c5323817 --- /dev/null +++ b/lib/src/components/Card/index.tsx @@ -0,0 +1,21 @@ +import React from 'react' + +import { Cover } from './Cover' +import * as S from './styles' + +import { CreateWuiProps, forwardRef } from '@/System' + +export type CardProps = CreateWuiProps<'div'> + +export const CardComponent = forwardRef<'div', CardProps>(({ children, ...rest }, ref) => { + return ( + + {children} + + ) +}) + +export const Card = Object.assign(CardComponent, { + Body: S.Body, + Cover, +}) diff --git a/lib/src/components/Card/styles.ts b/lib/src/components/Card/styles.ts new file mode 100644 index 0000000000..bb498432e8 --- /dev/null +++ b/lib/src/components/Card/styles.ts @@ -0,0 +1,17 @@ +import styled, { system, th } from '@xstyled/styled-components' + +export const Card = styled.divBox` + overflow: 'hidden'; + border-radius: md; + ${th('cards.default')}; + background-size: cover; + background-position: center; + + ${system}; +` + +export const Body = styled.divBox` + padding: lg; + + ${system}; +` diff --git a/lib/src/components/Card/tests/index.test.tsx b/lib/src/components/Card/tests/index.test.tsx new file mode 100644 index 0000000000..28be7ae73e --- /dev/null +++ b/lib/src/components/Card/tests/index.test.tsx @@ -0,0 +1,14 @@ +import React from 'react' + +import { Card } from '../' +import { render } from '../../../../tests' + +const content = 'Jungle' + +describe('', () => { + it('should render correctly', () => { + const { container } = render({content}) + + expect(container).toHaveTextContent(content) + }) +}) diff --git a/lib/src/components/Card/theme.ts b/lib/src/components/Card/theme.ts new file mode 100644 index 0000000000..d3c1e3414d --- /dev/null +++ b/lib/src/components/Card/theme.ts @@ -0,0 +1,20 @@ +import { CSSObject } from '@xstyled/styled-components' + +import { ThemeValues } from '@/theme' + +export type ThemeCards = { + default: CSSObject +} + +export const getCards = (theme: ThemeValues): ThemeCards => { + const { borderWidths, colors } = theme + + return { + default: { + backgroundColor: colors['neutral-10'], + borderStyle: 'solid', + borderWidth: borderWidths.sm, + borderColor: colors['neutral-30'], + }, + } +} diff --git a/lib/src/components/Checkbox/docs/examples/hint.tsx b/lib/src/components/Checkbox/docs/examples/hint.tsx new file mode 100644 index 0000000000..c378b68fcc --- /dev/null +++ b/lib/src/components/Checkbox/docs/examples/hint.tsx @@ -0,0 +1,16 @@ +import * as React from 'react' + +import { Checkbox } from '@/Checkbox' +import { Field } from '@/Field' + +const Example = () => { + const [checkbox, setCheckbox] = React.useState(false) + + return ( + + setCheckbox(!checkbox)} /> + + ) +} + +export default Example diff --git a/packages/Checkbox/docs/examples/labels.tsx b/lib/src/components/Checkbox/docs/examples/labels.tsx similarity index 86% rename from packages/Checkbox/docs/examples/labels.tsx rename to lib/src/components/Checkbox/docs/examples/labels.tsx index c31c4c287e..8b67bbec2b 100644 --- a/packages/Checkbox/docs/examples/labels.tsx +++ b/lib/src/components/Checkbox/docs/examples/labels.tsx @@ -1,7 +1,8 @@ import * as React from 'react' -import { Checkbox } from '@welcome-ui/checkbox' -import { Field } from '@welcome-ui/field' -import { Stack } from '@welcome-ui/stack' + +import { Checkbox } from '@/Checkbox' +import { Field } from '@/Field' +import { Stack } from '@/Stack' const Example = () => { const [checkbox, setCheckbox] = React.useState(false) diff --git a/packages/Checkbox/docs/examples/nested.tsx b/lib/src/components/Checkbox/docs/examples/nested.tsx similarity index 87% rename from packages/Checkbox/docs/examples/nested.tsx rename to lib/src/components/Checkbox/docs/examples/nested.tsx index 94416ecb3f..14897c1018 100644 --- a/packages/Checkbox/docs/examples/nested.tsx +++ b/lib/src/components/Checkbox/docs/examples/nested.tsx @@ -1,7 +1,8 @@ import * as React from 'react' -import { Checkbox } from '@welcome-ui/checkbox' -import { Field } from '@welcome-ui/field' -import { Stack } from '@welcome-ui/stack' + +import { Checkbox } from '@/Checkbox' +import { Field } from '@/Field' +import { Stack } from '@/Stack' const Example = () => { const [checkboxA, setCheckboxA] = React.useState(false) diff --git a/lib/src/components/Checkbox/docs/examples/overview.tsx b/lib/src/components/Checkbox/docs/examples/overview.tsx new file mode 100644 index 0000000000..298be48f85 --- /dev/null +++ b/lib/src/components/Checkbox/docs/examples/overview.tsx @@ -0,0 +1,30 @@ +import * as React from 'react' + +import { Checkbox } from '@/Checkbox' + +const Example = () => { + const [checkbox, setCheckbox] = React.useState(false) + const [checkboxChecked, setCheckboxChecked] = React.useState(true) + const [checkboxIndeterminate, setCheckboxIndeterminate] = React.useState(false) + + return ( + <> + setCheckbox(!checkbox)} /> + setCheckboxChecked(!checkboxChecked)} + /> + setCheckboxIndeterminate(!checkboxIndeterminate)} + /> + + + + ) +} + +export default Example diff --git a/lib/src/components/Checkbox/docs/examples/variants.tsx b/lib/src/components/Checkbox/docs/examples/variants.tsx new file mode 100644 index 0000000000..5d21b039d5 --- /dev/null +++ b/lib/src/components/Checkbox/docs/examples/variants.tsx @@ -0,0 +1,37 @@ +import * as React from 'react' + +import { Checkbox } from '@/Checkbox' +import { Field } from '@/Field' +import { Stack } from '@/Stack' + +const Example = () => { + const [checkbox, setCheckbox] = React.useState(false) + + return ( + + + setCheckbox(!checkbox)} + /> + + + setCheckbox(!checkbox)} + /> + + + setCheckbox(!checkbox)} + /> + + + ) +} + +export default Example diff --git a/packages/Checkbox/docs/index.mdx b/lib/src/components/Checkbox/docs/index.mdx similarity index 100% rename from packages/Checkbox/docs/index.mdx rename to lib/src/components/Checkbox/docs/index.mdx diff --git a/lib/src/components/Checkbox/docs/properties.json b/lib/src/components/Checkbox/docs/properties.json new file mode 100644 index 0000000000..2ceb507ae6 --- /dev/null +++ b/lib/src/components/Checkbox/docs/properties.json @@ -0,0 +1,693 @@ +{ + "Checkbox": { + "props": { + "Component": { + "defaultValue": { + "value": "S.Checkbox" + }, + "description": "", + "name": "Component", + "parent": { + "fileName": "welcome-ui/lib/src/components/Checkbox/index.tsx", + "name": "CheckboxOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Checkbox/index.tsx", + "name": "CheckboxOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "ElementType", + "value": [ + { + "value": "\"symbol\"" + }, + { + "value": "\"object\"" + }, + { + "value": "\"a\"" + }, + { + "value": "\"abbr\"" + }, + { + "value": "\"address\"" + }, + { + "value": "\"area\"" + }, + { + "value": "\"article\"" + }, + { + "value": "\"aside\"" + }, + { + "value": "\"audio\"" + }, + { + "value": "\"b\"" + }, + { + "value": "\"base\"" + }, + { + "value": "\"bdi\"" + }, + { + "value": "\"bdo\"" + }, + { + "value": "\"big\"" + }, + { + "value": "\"blockquote\"" + }, + { + "value": "\"body\"" + }, + { + "value": "\"br\"" + }, + { + "value": "\"button\"" + }, + { + "value": "\"canvas\"" + }, + { + "value": "\"caption\"" + }, + { + "value": "\"cite\"" + }, + { + "value": "\"code\"" + }, + { + "value": "\"col\"" + }, + { + "value": "\"colgroup\"" + }, + { + "value": "\"data\"" + }, + { + "value": "\"datalist\"" + }, + { + "value": "\"dd\"" + }, + { + "value": "\"del\"" + }, + { + "value": "\"details\"" + }, + { + "value": "\"dfn\"" + }, + { + "value": "\"dialog\"" + }, + { + "value": "\"div\"" + }, + { + "value": "\"dl\"" + }, + { + "value": "\"dt\"" + }, + { + "value": "\"em\"" + }, + { + "value": "\"embed\"" + }, + { + "value": "\"fieldset\"" + }, + { + "value": "\"figcaption\"" + }, + { + "value": "\"figure\"" + }, + { + "value": "\"footer\"" + }, + { + "value": "\"form\"" + }, + { + "value": "\"h1\"" + }, + { + "value": "\"h2\"" + }, + { + "value": "\"h3\"" + }, + { + "value": "\"h4\"" + }, + { + "value": "\"h5\"" + }, + { + "value": "\"h6\"" + }, + { + "value": "\"head\"" + }, + { + "value": "\"header\"" + }, + { + "value": "\"hgroup\"" + }, + { + "value": "\"hr\"" + }, + { + "value": "\"html\"" + }, + { + "value": "\"i\"" + }, + { + "value": "\"iframe\"" + }, + { + "value": "\"img\"" + }, + { + "value": "\"input\"" + }, + { + "value": "\"ins\"" + }, + { + "value": "\"kbd\"" + }, + { + "value": "\"keygen\"" + }, + { + "value": "\"label\"" + }, + { + "value": "\"legend\"" + }, + { + "value": "\"li\"" + }, + { + "value": "\"link\"" + }, + { + "value": "\"main\"" + }, + { + "value": "\"map\"" + }, + { + "value": "\"mark\"" + }, + { + "value": "\"menu\"" + }, + { + "value": "\"menuitem\"" + }, + { + "value": "\"meta\"" + }, + { + "value": "\"meter\"" + }, + { + "value": "\"nav\"" + }, + { + "value": "\"noindex\"" + }, + { + "value": "\"noscript\"" + }, + { + "value": "\"ol\"" + }, + { + "value": "\"optgroup\"" + }, + { + "value": "\"option\"" + }, + { + "value": "\"output\"" + }, + { + "value": "\"p\"" + }, + { + "value": "\"param\"" + }, + { + "value": "\"picture\"" + }, + { + "value": "\"pre\"" + }, + { + "value": "\"progress\"" + }, + { + "value": "\"q\"" + }, + { + "value": "\"rp\"" + }, + { + "value": "\"rt\"" + }, + { + "value": "\"ruby\"" + }, + { + "value": "\"s\"" + }, + { + "value": "\"samp\"" + }, + { + "value": "\"slot\"" + }, + { + "value": "\"script\"" + }, + { + "value": "\"section\"" + }, + { + "value": "\"select\"" + }, + { + "value": "\"small\"" + }, + { + "value": "\"source\"" + }, + { + "value": "\"span\"" + }, + { + "value": "\"strong\"" + }, + { + "value": "\"style\"" + }, + { + "value": "\"sub\"" + }, + { + "value": "\"summary\"" + }, + { + "value": "\"sup\"" + }, + { + "value": "\"table\"" + }, + { + "value": "\"template\"" + }, + { + "value": "\"tbody\"" + }, + { + "value": "\"td\"" + }, + { + "value": "\"textarea\"" + }, + { + "value": "\"tfoot\"" + }, + { + "value": "\"th\"" + }, + { + "value": "\"thead\"" + }, + { + "value": "\"time\"" + }, + { + "value": "\"title\"" + }, + { + "value": "\"tr\"" + }, + { + "value": "\"track\"" + }, + { + "value": "\"u\"" + }, + { + "value": "\"ul\"" + }, + { + "value": "\"var\"" + }, + { + "value": "\"video\"" + }, + { + "value": "\"wbr\"" + }, + { + "value": "\"webview\"" + }, + { + "value": "\"svg\"" + }, + { + "value": "\"animate\"" + }, + { + "value": "\"animateMotion\"" + }, + { + "value": "\"animateTransform\"" + }, + { + "value": "\"circle\"" + }, + { + "value": "\"clipPath\"" + }, + { + "value": "\"defs\"" + }, + { + "value": "\"desc\"" + }, + { + "value": "\"ellipse\"" + }, + { + "value": "\"feBlend\"" + }, + { + "value": "\"feColorMatrix\"" + }, + { + "value": "\"feComponentTransfer\"" + }, + { + "value": "\"feComposite\"" + }, + { + "value": "\"feConvolveMatrix\"" + }, + { + "value": "\"feDiffuseLighting\"" + }, + { + "value": "\"feDisplacementMap\"" + }, + { + "value": "\"feDistantLight\"" + }, + { + "value": "\"feDropShadow\"" + }, + { + "value": "\"feFlood\"" + }, + { + "value": "\"feFuncA\"" + }, + { + "value": "\"feFuncB\"" + }, + { + "value": "\"feFuncG\"" + }, + { + "value": "\"feFuncR\"" + }, + { + "value": "\"feGaussianBlur\"" + }, + { + "value": "\"feImage\"" + }, + { + "value": "\"feMerge\"" + }, + { + "value": "\"feMergeNode\"" + }, + { + "value": "\"feMorphology\"" + }, + { + "value": "\"feOffset\"" + }, + { + "value": "\"fePointLight\"" + }, + { + "value": "\"feSpecularLighting\"" + }, + { + "value": "\"feSpotLight\"" + }, + { + "value": "\"feTile\"" + }, + { + "value": "\"feTurbulence\"" + }, + { + "value": "\"filter\"" + }, + { + "value": "\"foreignObject\"" + }, + { + "value": "\"g\"" + }, + { + "value": "\"image\"" + }, + { + "value": "\"line\"" + }, + { + "value": "\"linearGradient\"" + }, + { + "value": "\"marker\"" + }, + { + "value": "\"mask\"" + }, + { + "value": "\"metadata\"" + }, + { + "value": "\"mpath\"" + }, + { + "value": "\"path\"" + }, + { + "value": "\"pattern\"" + }, + { + "value": "\"polygon\"" + }, + { + "value": "\"polyline\"" + }, + { + "value": "\"radialGradient\"" + }, + { + "value": "\"rect\"" + }, + { + "value": "\"stop\"" + }, + { + "value": "\"switch\"" + }, + { + "value": "\"text\"" + }, + { + "value": "\"textPath\"" + }, + { + "value": "\"tspan\"" + }, + { + "value": "\"use\"" + }, + { + "value": "\"view\"" + }, + { + "value": "ComponentClass", + "description": "", + "fullComment": "", + "tags": {} + }, + { + "value": "FunctionComponent", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "checked": { + "defaultValue": { + "value": false + }, + "description": "", + "name": "checked", + "parent": { + "fileName": "welcome-ui/lib/src/components/Checkbox/index.tsx", + "name": "CheckboxOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Checkbox/index.tsx", + "name": "CheckboxOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "disabled": { + "defaultValue": null, + "description": "", + "name": "disabled", + "parent": { + "fileName": "welcome-ui/lib/src/components/Checkbox/index.tsx", + "name": "CheckboxOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Checkbox/index.tsx", + "name": "CheckboxOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "indeterminate": { + "defaultValue": { + "value": false + }, + "description": "", + "name": "indeterminate", + "parent": { + "fileName": "welcome-ui/lib/src/components/Checkbox/index.tsx", + "name": "CheckboxOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Checkbox/index.tsx", + "name": "CheckboxOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "name": { + "defaultValue": null, + "description": "", + "name": "name", + "parent": { + "fileName": "welcome-ui/lib/src/components/Checkbox/index.tsx", + "name": "CheckboxOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Checkbox/index.tsx", + "name": "CheckboxOptions" + } + ], + "required": false, + "type": { + "name": "string" + } + }, + "onChange": { + "defaultValue": null, + "description": "", + "name": "onChange", + "parent": { + "fileName": "welcome-ui/lib/src/components/Checkbox/index.tsx", + "name": "CheckboxOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Checkbox/index.tsx", + "name": "CheckboxOptions" + } + ], + "required": false, + "type": { + "name": "(event: ChangeEvent) => void" + } + } + } + } +} \ No newline at end of file diff --git a/lib/src/components/Checkbox/index.tsx b/lib/src/components/Checkbox/index.tsx new file mode 100644 index 0000000000..64d8fcb6e2 --- /dev/null +++ b/lib/src/components/Checkbox/index.tsx @@ -0,0 +1,57 @@ +import React from 'react' + +import { DefaultFieldStylesProps } from '../../utils/field-styles' + +import * as S from './styles' + +import { CreateWuiProps, forwardRef } from '@/System' + +export interface CheckboxOptions extends DefaultFieldStylesProps { + Component?: React.ElementType + checked?: boolean + disabled?: boolean + indeterminate?: boolean + name?: string + onChange?: (event: React.ChangeEvent) => void +} + +export type CheckboxProps = CreateWuiProps<'input', CheckboxOptions> + +export const Checkbox = forwardRef<'input', CheckboxProps>( + ( + { + checked = false, + Component = S.Checkbox, + dataTestId, + disabled, + indeterminate = false, + name, + onChange, + size, + ...rest + }, + ref + ) => { + const handleChange = (e: React.ChangeEvent) => { + e.target.checked = !e.target.checked + onChange && onChange(e) + } + + return ( + + ) + } +) + +Checkbox.displayName = 'Checkbox' diff --git a/lib/src/components/Checkbox/styles.ts b/lib/src/components/Checkbox/styles.ts new file mode 100644 index 0000000000..d4f4a542b8 --- /dev/null +++ b/lib/src/components/Checkbox/styles.ts @@ -0,0 +1,73 @@ +import styled, { css, system, th } from '@xstyled/styled-components' +import * as Ariakit from '@ariakit/react' + +import { defaultFieldStyles } from '../../utils/field-styles' + +import { CheckboxProps } from './index' + +import { shouldForwardProp } from '@/System' + +/* /!\ WARNING /!\ Don't add style after pseudo selector, it won't apply because of the dynamic color injected in the fill of the content */ + +export const Checkbox = styled(Ariakit.Checkbox).withConfig({ + shouldForwardProp, +})( + ({ indeterminate, order = '-1', size, theme, variant }) => css` + ${defaultFieldStyles({ size, variant })}; + ${th('checkboxes.default')} + position: relative; + padding: 0; + order: ${order}; + cursor: pointer; + transition: medium; + overflow: hidden; + ${system}; + + &[aria-checked='true'] { + &:not([disabled]) { + ${th('checkboxes.checked')}; + } + + &:not([indeterminate]) { + &::after { + content: url(${`'data:image/svg+xml; utf8, '`}); + position: absolute; + top: -2; + right: 0; + bottom: 0; + left: 0; + width: 10; + margin: auto; + text-align: center; + } + } + } + + ${indeterminate && + css` + &:not([disabled]) { + ${th('checkboxes.checked')}; + } + + /* stylelint-disable string-no-newline */ + &::after { + content: url("data:image/svg+xml,%3Csvg width='10' height='4' viewBox='0 0 10 4' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M1.3973 1.76919C0.953776 1.81988 0.634816 2.04775 0.685235 2.49156C0.732149 2.90436 1.08212 3.03624 1.48789 3.03624L8.6029 2.23086C9.04669 2.18017 9.36538 1.9523 9.31469 1.50849C9.26427 1.06468 8.86389 0.917163 8.41956 0.969201C4.90971 1.38026 4.90828 1.36792 1.3973 1.76919Z' fill='${theme + .defaultFields.checkableField.checked.color}'/%3E%3C/svg%3E"); + position: absolute; + top: -3.5; + right: 0; + bottom: 0; + left: 2; + margin: auto; + } + `} + + &[disabled] { + ${th('checkboxes.disabled')} + + &::after { + opacity: ${theme.defaultFields.checkableField.disabled.opacity}; + } + } + ` +) diff --git a/lib/src/components/Checkbox/tests/index.test.tsx b/lib/src/components/Checkbox/tests/index.test.tsx new file mode 100644 index 0000000000..9d7f243a7e --- /dev/null +++ b/lib/src/components/Checkbox/tests/index.test.tsx @@ -0,0 +1,50 @@ +import React, { useState } from 'react' +import { act, screen } from '@testing-library/react' + +import { Checkbox, CheckboxOptions } from '../' +import { render } from '../../../../tests' + +const CheckboxWrapper = (props: CheckboxOptions) => { + const [value, setValue] = useState(false) + + const handleChange = () => { + setValue(!value) + } + + return ( + + ) +} + +describe('', () => { + test('should toggle checked attribute on click', async () => { + const { user } = render() + + const checkbox = screen.getByTestId('checkbox') + + expect(checkbox.getAttribute('aria-checked')).toBe('false') + + await act(() => user.click(checkbox)) + + expect(checkbox.getAttribute('aria-checked')).toBe('true') + + await act(() => user.click(checkbox)) + + expect(checkbox.getAttribute('aria-checked')).toBe('false') + }) + + test('should do nothing on click on disabled checkbox', async () => { + render() + + const checkbox = screen.getByTestId('checkbox') + + expect(checkbox.getAttribute('aria-checked')).toBe('false') + expect(checkbox).toBeDisabled() + }) +}) diff --git a/lib/src/components/Checkbox/theme.ts b/lib/src/components/Checkbox/theme.ts new file mode 100644 index 0000000000..063f3d9094 --- /dev/null +++ b/lib/src/components/Checkbox/theme.ts @@ -0,0 +1,29 @@ +import { CSSObject } from '@xstyled/styled-components' + +import { ThemeValues } from '@/theme' + +export type ThemeCheckboxes = { + checked: CSSObject + default: CSSObject + disabled: CSSObject +} + +export const getCheckboxes = (theme: ThemeValues): ThemeCheckboxes => { + const { colors, radii, toRem } = theme + return { + default: { + width: toRem(16), + height: toRem(16), + flexShrink: 0, + borderRadius: radii.sm, + }, + disabled: { + borderColor: colors['beige-60'], + }, + checked: { + color: colors['neutral-90'], + backgroundColor: colors['primary-40'], + borderColor: colors['primary-40'], + }, + } +} diff --git a/lib/src/components/ClearButton/index.tsx b/lib/src/components/ClearButton/index.tsx new file mode 100644 index 0000000000..405721435b --- /dev/null +++ b/lib/src/components/ClearButton/index.tsx @@ -0,0 +1,23 @@ +import React from 'react' + +import * as S from './styles' + +import { CrossIcon } from '@/Icons' +import { ButtonOptions } from '@/Button' +import { CreateWuiProps, forwardRef } from '@/System' + +export type ClearButtonProps = CreateWuiProps< + 'button', + Omit +> + +export const ClearButton = forwardRef<'button', ClearButtonProps>( + ({ size = 'xs', ...rest }, ref) => ( + + + + ) +) + +// Nested exports +export const StyledClearButton = S.ClearButton diff --git a/lib/src/components/ClearButton/styles.ts b/lib/src/components/ClearButton/styles.ts new file mode 100644 index 0000000000..baf1809b0c --- /dev/null +++ b/lib/src/components/ClearButton/styles.ts @@ -0,0 +1,22 @@ +import styled, { css, keyframes, th } from '@xstyled/styled-components' + +import { Button } from '@/Button' + +const fade = keyframes` + from { + opacity: 0; + } + to { + opacity: 1; + } +` + +const fadeRule = css` + ${fade} +` + +export const ClearButton = styled(Button)` + pointer-events: auto; + animation: ${th('transitions.medium')}; + animation-name: ${fadeRule}; +` diff --git a/lib/src/components/CloseButton/index.tsx b/lib/src/components/CloseButton/index.tsx new file mode 100644 index 0000000000..fc861c1561 --- /dev/null +++ b/lib/src/components/CloseButton/index.tsx @@ -0,0 +1,15 @@ +import React from 'react' + +import * as S from './styles' + +import { CrossIcon } from '@/Icons' +import { ButtonProps } from '@/Button' +import { forwardRef } from '@/System' + +export type CloseButtonProps = ButtonProps + +export const CloseButton = forwardRef<'button', CloseButtonProps>((props, ref) => ( + + + +)) diff --git a/lib/src/components/CloseButton/styles.ts b/lib/src/components/CloseButton/styles.ts new file mode 100644 index 0000000000..9376777f24 --- /dev/null +++ b/lib/src/components/CloseButton/styles.ts @@ -0,0 +1,10 @@ +import styled, { th } from '@xstyled/styled-components' + +import { Button } from '@/Button' + +export const CloseButton = styled(Button)` + & > svg:only-child { + width: ${th('space.md')}; + height: ${th('space.md')}; + } +` diff --git a/lib/src/components/DatePicker/docs/examples/icon.tsx b/lib/src/components/DatePicker/docs/examples/icon.tsx new file mode 100644 index 0000000000..0c7fb24544 --- /dev/null +++ b/lib/src/components/DatePicker/docs/examples/icon.tsx @@ -0,0 +1,15 @@ +import * as React from 'react' + +import { DatePicker } from '@/DatePicker' +import { WttjIcon } from '@/Icons' + +const Example = () => { + return ( + <> + } name="welcome" value={new Date()} /> + } iconPlacement="right" name="welcome" value={new Date()} /> + + ) +} + +export default Example diff --git a/packages/DatePicker/docs/examples/months.tsx b/lib/src/components/DatePicker/docs/examples/months.tsx similarity index 77% rename from packages/DatePicker/docs/examples/months.tsx rename to lib/src/components/DatePicker/docs/examples/months.tsx index 61188053fe..de0adf2d08 100644 --- a/packages/DatePicker/docs/examples/months.tsx +++ b/lib/src/components/DatePicker/docs/examples/months.tsx @@ -1,5 +1,6 @@ import * as React from 'react' -import { DatePicker } from '@welcome-ui/date-picker' + +import { DatePicker } from '@/DatePicker' const Example = () => { return diff --git a/lib/src/components/DatePicker/docs/examples/overview.tsx b/lib/src/components/DatePicker/docs/examples/overview.tsx new file mode 100644 index 0000000000..70c88066db --- /dev/null +++ b/lib/src/components/DatePicker/docs/examples/overview.tsx @@ -0,0 +1,9 @@ +import * as React from 'react' + +import { DatePicker } from '@/DatePicker' + +const Example = () => { + return +} + +export default Example diff --git a/lib/src/components/DatePicker/docs/examples/react-date-picker.tsx b/lib/src/components/DatePicker/docs/examples/react-date-picker.tsx new file mode 100644 index 0000000000..87a99e2c53 --- /dev/null +++ b/lib/src/components/DatePicker/docs/examples/react-date-picker.tsx @@ -0,0 +1,18 @@ +import * as React from 'react' + +import { DatePicker } from '@/DatePicker' + +const Example = () => { + return ( + + ) +} + +export default Example diff --git a/lib/src/components/DatePicker/docs/examples/sizes.tsx b/lib/src/components/DatePicker/docs/examples/sizes.tsx new file mode 100644 index 0000000000..9481c732dc --- /dev/null +++ b/lib/src/components/DatePicker/docs/examples/sizes.tsx @@ -0,0 +1,23 @@ +import * as React from 'react' + +import { DatePicker } from '@/DatePicker' +import { WttjIcon } from '@/Icons' +import { Stack } from '@/Stack' + +const Example = () => { + return ( + + + + + + Example with icon + } name="welcome" size="xs" value={new Date()} /> + } name="welcome" size="sm" value={new Date()} /> + } name="welcome" value={new Date()} /> + } name="welcome" size="lg" value={new Date()} /> + + ) +} + +export default Example diff --git a/lib/src/components/DatePicker/docs/examples/transparent.tsx b/lib/src/components/DatePicker/docs/examples/transparent.tsx new file mode 100644 index 0000000000..cea499c49c --- /dev/null +++ b/lib/src/components/DatePicker/docs/examples/transparent.tsx @@ -0,0 +1,9 @@ +import * as React from 'react' + +import { DatePicker } from '@/DatePicker' + +const Example = () => { + return +} + +export default Example diff --git a/lib/src/components/DatePicker/docs/index.mdx b/lib/src/components/DatePicker/docs/index.mdx new file mode 100644 index 0000000000..3b59691183 --- /dev/null +++ b/lib/src/components/DatePicker/docs/index.mdx @@ -0,0 +1,58 @@ +--- +category: forms +description: The Datepicker component is a user interface element that enables users to select dates from a calendar interface. It provides an intuitive way to input dates, offering a dropdown or popup calendar for selecting days, months, and years. Datepickers are essential for forms and applications requiring date inputs, ensuring accurate and user-friendly date selection. +packageName: date-picker +title: DatePicker +peerDependencies: 'date-fns react-datepicker' +--- + +### react-datepicker + +It is based on the [react-datepicker](https://github.com/Hacker0x01/react-datepicker) library. + +_Note_: Pass a value of `null` if you don't want the default value of `Date.now()`. + +
+ +### Give an Icon + +Add an icon with the `icon` property + +
+ +### Sizes + +Use size propety with option: + +- `xs` (24px) +- `sm` (32px) +- `md` (40px - default) +- `lg` (48px) + +
+ +### Locales + +You can change your locale by pass locale property from date-fns. + +```jsx +import dateFR from 'date-fns/locale/fr' + +function () { + return ( + + ) +} +``` + +### Transparent + +Pass `transparent` to remove background-color and border-color + +
+ +### Only display months + +Pass `showMonthYearPicker` to only display months, without days + +
diff --git a/lib/src/components/DatePicker/docs/properties.json b/lib/src/components/DatePicker/docs/properties.json new file mode 100644 index 0000000000..b50f1b5c75 --- /dev/null +++ b/lib/src/components/DatePicker/docs/properties.json @@ -0,0 +1,362 @@ +{ + "DatePicker": { + "props": { + "endYear": { + "defaultValue": { + "value": "DEFAULT_DATE.getFullYear()" + }, + "description": "", + "name": "endYear", + "parent": { + "fileName": "welcome-ui/lib/src/components/DateTimePickerCommon/CustomHeader.tsx", + "name": "CustomHeaderOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/DateTimePickerCommon/CustomHeader.tsx", + "name": "CustomHeaderOptions" + } + ], + "required": false, + "type": { + "name": "number" + } + }, + "icon": { + "defaultValue": null, + "description": "", + "name": "icon", + "parent": { + "fileName": "welcome-ui/node_modules/@types/react-datepicker/index.d.ts", + "name": "ReactDatePickerProps" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@types/react-datepicker/index.d.ts", + "name": "ReactDatePickerProps" + }, + { + "fileName": "welcome-ui/lib/src/components/DateTimePickerCommon/CustomInput.tsx", + "name": "CustomInputOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "(string | ReactElement>) & Element", + "value": [ + { + "value": "string & Element" + }, + { + "value": "ReactElement> & Element" + } + ] + } + }, + "iconPlacement": { + "defaultValue": { + "value": "left" + }, + "description": "", + "name": "iconPlacement", + "parent": { + "fileName": "welcome-ui/lib/src/components/DateTimePickerCommon/CustomInput.tsx", + "name": "CustomInputOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/DateTimePickerCommon/CustomInput.tsx", + "name": "CustomInputOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "IconPlacement", + "value": [ + { + "value": "\"right\"" + }, + { + "value": "\"left\"" + } + ] + } + }, + "locale": { + "defaultValue": null, + "description": "", + "name": "locale", + "parent": { + "fileName": "welcome-ui/lib/src/components/DateTimePickerCommon/CustomHeader.tsx", + "name": "CustomHeaderOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/DateTimePickerCommon/CustomHeader.tsx", + "name": "CustomHeaderOptions" + } + ], + "required": false, + "type": { + "name": "Locale" + } + }, + "onBlur": { + "defaultValue": null, + "description": "", + "name": "onBlur", + "parent": { + "fileName": "welcome-ui/lib/src/components/DatePicker/index.tsx", + "name": "DatePickerOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/DatePicker/index.tsx", + "name": "DatePickerOptions" + } + ], + "required": false, + "type": { + "name": "(event: FocusEvent) => void" + } + }, + "onChange": { + "defaultValue": null, + "description": "", + "name": "onChange", + "parent": { + "fileName": "welcome-ui/lib/src/components/DatePicker/index.tsx", + "name": "DatePickerOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/DatePicker/index.tsx", + "name": "DatePickerOptions" + } + ], + "required": false, + "type": { + "name": "(date?: Date) => void" + } + }, + "onFocus": { + "defaultValue": null, + "description": "", + "name": "onFocus", + "parent": { + "fileName": "welcome-ui/lib/src/components/DatePicker/index.tsx", + "name": "DatePickerOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/DatePicker/index.tsx", + "name": "DatePickerOptions" + } + ], + "required": false, + "type": { + "name": "(event: FocusEvent) => void" + } + }, + "placeholder": { + "defaultValue": null, + "description": "", + "name": "placeholder", + "parent": { + "fileName": "welcome-ui/lib/src/components/DatePicker/index.tsx", + "name": "DatePickerOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/DatePicker/index.tsx", + "name": "DatePickerOptions" + } + ], + "required": false, + "type": { + "name": "string" + } + }, + "preventVirtualKeyboard": { + "defaultValue": { + "value": false + }, + "description": "", + "name": "preventVirtualKeyboard", + "parent": { + "fileName": "welcome-ui/lib/src/components/DatePicker/index.tsx", + "name": "DatePickerOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/DatePicker/index.tsx", + "name": "DatePickerOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "size": { + "defaultValue": { + "value": "md" + }, + "description": "", + "name": "size", + "parent": { + "fileName": "welcome-ui/lib/src/components/DateTimePickerCommon/CustomInput.tsx", + "name": "CustomInputOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/DateTimePickerCommon/CustomInput.tsx", + "name": "CustomInputOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "Size", + "value": [ + { + "value": "\"xs\"" + }, + { + "value": "\"sm\"" + }, + { + "value": "\"md\"" + }, + { + "value": "\"lg\"" + } + ] + } + }, + "startYear": { + "defaultValue": { + "value": 1900 + }, + "description": "", + "name": "startYear", + "parent": { + "fileName": "welcome-ui/lib/src/components/DateTimePickerCommon/CustomHeader.tsx", + "name": "CustomHeaderOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/DateTimePickerCommon/CustomHeader.tsx", + "name": "CustomHeaderOptions" + } + ], + "required": false, + "type": { + "name": "number" + } + }, + "transparent": { + "defaultValue": null, + "description": "", + "name": "transparent", + "parent": { + "fileName": "welcome-ui/lib/src/components/DatePicker/index.tsx", + "name": "DatePickerOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/DatePicker/index.tsx", + "name": "DatePickerOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "useWeekdaysShort": { + "defaultValue": { + "value": true + }, + "description": "", + "name": "useWeekdaysShort", + "parent": { + "fileName": "welcome-ui/lib/src/components/DatePicker/index.tsx", + "name": "DatePickerOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/DatePicker/index.tsx", + "name": "DatePickerOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "value": { + "defaultValue": { + "value": "new Date()" + }, + "description": "", + "name": "value", + "parent": { + "fileName": "welcome-ui/lib/src/components/DatePicker/index.tsx", + "name": "DatePickerOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/DatePicker/index.tsx", + "name": "DatePickerOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "string | Date", + "value": [ + { + "value": "string" + }, + { + "value": "Date", + "description": "Enables basic storage and retrieval of dates and times.", + "fullComment": "Enables basic storage and retrieval of dates and times.", + "tags": {} + } + ] + } + } + } + } +} \ No newline at end of file diff --git a/lib/src/components/DatePicker/index.tsx b/lib/src/components/DatePicker/index.tsx new file mode 100644 index 0000000000..e947160468 --- /dev/null +++ b/lib/src/components/DatePicker/index.tsx @@ -0,0 +1,185 @@ +import React, { useEffect, useRef, useState } from 'react' +import { ReactDatePickerProps } from 'react-datepicker' + +import { CreateWuiProps, forwardRef } from '@/System' +import { + CustomHeader, + CustomHeaderOptions, + CustomHeaderProps, + CustomInput, + CustomInputOptions, + CustomPopper, + DEFAULT_DATE, + Focused, + getDate, + StyledDatePicker, +} from '@/DateTimePickerCommon' + +export interface DatePickerOptions { + onBlur?: CustomInputOptions['handleBlur'] + onChange?: (date?: Date) => void + onFocus?: CustomInputOptions['handleFocus'] + placeholder?: ReactDatePickerProps['placeholderText'] + preventVirtualKeyboard?: boolean + transparent?: boolean + useWeekdaysShort?: boolean + value: string | Date +} + +export type DatePickerProps = CreateWuiProps< + typeof StyledDatePicker, + Omit & + Partial> & + Pick & + Omit & + DatePickerOptions +> + +export const DatePicker = forwardRef<'input', DatePickerProps>( + ( + { + autoFocus, + dataTestId, + dateFormat = 'dd/MM/yyyy', + disabled, + endYear = DEFAULT_DATE.getFullYear(), + icon, + iconPlacement = 'left', + locale, + onBlur, + onChange, + onFocus, + placeholder, + popperProps, + preventVirtualKeyboard = false, + showMonthYearPicker, + size = 'md', + startYear = 1900, + transparent, + useWeekdaysShort = true, + value = DEFAULT_DATE, + ...rest + }, + ref + ) => { + const timeIntervals = rest?.timeIntervals + const formatDate = (date: string | number | Date) => getDate(date, timeIntervals) + + const placeholderText = placeholder || rest.placeholderText + + const [focused, setFocused] = useState((autoFocus && 'date') || null) + const [date, setDate] = useState(formatDate(value)) + const inputRef = useRef() + + // format date at component mount + useEffect(() => { + onChange && onChange(formatDate(value)) + //eslint-disable-next-line + }, []) + + // Ensure values are controlled by parent + useEffect(() => { + const formattedDate = formatDate(value) + const valueToParse = typeof value === 'object' ? value?.toISOString() : value + if ( + new Date(Date.parse(valueToParse))?.getTime() - formattedDate?.getTime() !== 0 && + onChange + ) { + onChange(formattedDate) + } + setDate(formattedDate) + //eslint-disable-next-line + }, [value]) + + const blur = () => inputRef.current?.blur() + + const handleFocus: CustomInputOptions['handleFocus'] = e => { + setFocused('date') + onFocus && onFocus(e) + } + + const handleBlur: CustomInputOptions['handleBlur'] = e => { + setFocused(null) + onBlur && onBlur(e) + } + + const handleKeyDown = (e: React.KeyboardEvent) => { + if (['Escape', 'Enter'].includes(e.key)) { + blur() + } + } + + const handleReset: CustomInputOptions['onReset'] = e => { + e.preventDefault() + blur() + setDate(null) + onChange && onChange(null) + } + + const handleChange = (newDate: Date) => { + if (!newDate) return + const date = formatDate(newDate) + + newDate.setHours(date.getHours(), date.getMinutes()) + setDate(newDate) + onChange && onChange(new Date(newDate)) + } + + return ( + handleBlur(e)} + handleFocus={e => handleFocus(e)} + icon={icon} + iconPlacement={iconPlacement} + inputMode={preventVirtualKeyboard ? 'none' : 'text'} + onReset={handleReset} + ref={instance => { + // for internal use only + inputRef.current = instance + // for external use + if (typeof ref === 'function') { + ref(instance) + } else { + ref.current = instance + } + }} + size={size} + /> + } + dateFormat={dateFormat} + disabled={disabled} + iconPlacement={!!icon && iconPlacement} + locale={locale} + onChange={handleChange} + onKeyDown={handleKeyDown} + placeholderText={placeholderText} + popperContainer={CustomPopper} + popperProps={popperProps} + renderCustomHeader={(props: CustomHeaderProps) => ( + + )} + selected={date} + showMonthYearPicker={showMonthYearPicker} + size={size} + transparent={transparent} + useWeekdaysShort={useWeekdaysShort} + {...rest} + /> + ) + } +) + +DatePicker.displayName = 'DatePicker' diff --git a/lib/src/components/DateTimePicker/docs/examples/childs.tsx b/lib/src/components/DateTimePicker/docs/examples/childs.tsx new file mode 100644 index 0000000000..fc1874d0a0 --- /dev/null +++ b/lib/src/components/DateTimePicker/docs/examples/childs.tsx @@ -0,0 +1,17 @@ +import * as React from 'react' + +import { DateTimePicker } from '@/DateTimePicker' +import { DatePicker } from '@/DatePicker' +import { TimePicker } from '@/TimePicker' +import { WttjIcon } from '@/Icons' + +const Example = () => { + return ( + + } iconPlacement="right" value={new Date()} /> + + + ) +} + +export default Example diff --git a/lib/src/components/DateTimePicker/docs/examples/overview.tsx b/lib/src/components/DateTimePicker/docs/examples/overview.tsx new file mode 100644 index 0000000000..3d6671fc0c --- /dev/null +++ b/lib/src/components/DateTimePicker/docs/examples/overview.tsx @@ -0,0 +1,9 @@ +import * as React from 'react' + +import { DateTimePicker } from '@/DateTimePicker' + +const Example = () => { + return +} + +export default Example diff --git a/lib/src/components/DateTimePicker/docs/examples/sizes.tsx b/lib/src/components/DateTimePicker/docs/examples/sizes.tsx new file mode 100644 index 0000000000..de0d40cbb5 --- /dev/null +++ b/lib/src/components/DateTimePicker/docs/examples/sizes.tsx @@ -0,0 +1,17 @@ +import * as React from 'react' + +import { DateTimePicker } from '@/DateTimePicker' +import { Stack } from '@/Stack' + +const Example = () => { + return ( + + + + + + + ) +} + +export default Example diff --git a/lib/src/components/DateTimePicker/docs/examples/transparent.tsx b/lib/src/components/DateTimePicker/docs/examples/transparent.tsx new file mode 100644 index 0000000000..1499a7867c --- /dev/null +++ b/lib/src/components/DateTimePicker/docs/examples/transparent.tsx @@ -0,0 +1,9 @@ +import * as React from 'react' + +import { DateTimePicker } from '@/DateTimePicker' + +const Example = () => { + return +} + +export default Example diff --git a/lib/src/components/DateTimePicker/docs/index.mdx b/lib/src/components/DateTimePicker/docs/index.mdx new file mode 100644 index 0000000000..6620ad74bf --- /dev/null +++ b/lib/src/components/DateTimePicker/docs/index.mdx @@ -0,0 +1,36 @@ +--- +category: forms +description: The DateTimePicker component is a user interface element that allows users to select both dates and times from a single interface. It provides a calendar view for selecting dates and a dropdown or input fields for specifying times. This component is essential for applications that require precise scheduling or event management, offering a seamless way to input both date and time information. +packageName: date-time-picker +title: DateTimePicker +peerDependencies: 'date-fns react-datepicker' +--- + +### react-datepicker + +It is based on the [react-datepicker](https://github.com/Hacker0x01/react-datepicker) library. + +_Note_: Pass a value of `null` if you don't want the default value of `Date.now()`. + +### Pass props to childs + +If you want to pass props to DatePicker or TimePicker you need to see example below + +
+ +### Sizes + +Use size propety with option: + +- `xs` (24px) +- `sm` (32px) +- `md` (40px - default) +- `lg` (48px) + +
+ +### Transparent + +Pass `transparent` to remove background-color and border-color + +
diff --git a/lib/src/components/DateTimePicker/docs/properties.json b/lib/src/components/DateTimePicker/docs/properties.json new file mode 100644 index 0000000000..9b1af9756a --- /dev/null +++ b/lib/src/components/DateTimePicker/docs/properties.json @@ -0,0 +1,173 @@ +{ + "DateTimePicker": { + "props": { + "locale": { + "defaultValue": null, + "description": "", + "name": "locale", + "parent": { + "fileName": "welcome-ui/lib/src/components/DateTimePickerCommon/CustomHeader.tsx", + "name": "CustomHeaderOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/DateTimePickerCommon/CustomHeader.tsx", + "name": "CustomHeaderOptions" + }, + { + "fileName": "welcome-ui/node_modules/@types/react-datepicker/index.d.ts", + "name": "ReactDatePickerProps" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "Locale | (Locale & string)", + "value": [ + { + "value": "Locale", + "description": "", + "fullComment": "", + "tags": {} + }, + { + "value": "Locale & string" + } + ] + } + }, + "onChange": { + "defaultValue": null, + "description": "", + "name": "onChange", + "parent": { + "fileName": "welcome-ui/lib/src/components/DatePicker/index.tsx", + "name": "DatePickerOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/DatePicker/index.tsx", + "name": "DatePickerOptions" + }, + { + "fileName": "welcome-ui/lib/src/components/TimePicker/index.tsx", + "name": "TimePickerOptions" + } + ], + "required": false, + "type": { + "name": "((date?: Date) => void) & ((date?: Date) => void)" + } + }, + "size": { + "defaultValue": { + "value": "md" + }, + "description": "", + "name": "size", + "parent": { + "fileName": "welcome-ui/lib/src/components/DateTimePickerCommon/CustomInput.tsx", + "name": "CustomInputOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/DateTimePickerCommon/CustomInput.tsx", + "name": "CustomInputOptions" + }, + { + "fileName": "welcome-ui/lib/src/components/DateTimePickerCommon/CustomInput.tsx", + "name": "CustomInputOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "Size", + "value": [ + { + "value": "\"xs\"" + }, + { + "value": "\"sm\"" + }, + { + "value": "\"md\"" + }, + { + "value": "\"lg\"" + } + ] + } + }, + "transparent": { + "defaultValue": null, + "description": "", + "name": "transparent", + "parent": { + "fileName": "welcome-ui/lib/src/components/DatePicker/index.tsx", + "name": "DatePickerOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/DatePicker/index.tsx", + "name": "DatePickerOptions" + }, + { + "fileName": "welcome-ui/lib/src/components/TimePicker/index.tsx", + "name": "TimePickerOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "value": { + "defaultValue": { + "value": "new Date()" + }, + "description": "", + "name": "value", + "parent": { + "fileName": "welcome-ui/lib/src/components/DatePicker/index.tsx", + "name": "DatePickerOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/DatePicker/index.tsx", + "name": "DatePickerOptions" + }, + { + "fileName": "welcome-ui/lib/src/components/TimePicker/index.tsx", + "name": "TimePickerOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "string | Date", + "value": [ + { + "value": "string" + }, + { + "value": "Date", + "description": "Enables basic storage and retrieval of dates and times.", + "fullComment": "Enables basic storage and retrieval of dates and times.", + "tags": {} + } + ] + } + } + } + } +} \ No newline at end of file diff --git a/lib/src/components/DateTimePicker/index.tsx b/lib/src/components/DateTimePicker/index.tsx new file mode 100644 index 0000000000..3a78d436d6 --- /dev/null +++ b/lib/src/components/DateTimePicker/index.tsx @@ -0,0 +1,109 @@ +import React, { Children, cloneElement, useEffect, useState } from 'react' + +import * as S from './styles' + +import { DatePicker, DatePickerProps } from '@/DatePicker' +import { TimePicker, TimePickerProps } from '@/TimePicker' +import { DEFAULT_DATE, getDate } from '@/DateTimePickerCommon' +import { CreateWuiProps, forwardRef } from '@/System' + +export type DateTimePickerProps = CreateWuiProps< + 'input', + Pick & + Pick +> + +export const DateTimePicker = forwardRef<'input', DateTimePickerProps>( + ( + { + children, + dataTestId, + disabled, + locale, + onChange, + size = 'md', + transparent, + value = DEFAULT_DATE, + }, + ref + ) => { + const TimePickerNode = + Children.count(children) > 1 && + Children.toArray(children).find( + (child: JSX.Element): boolean => child.type.displayName === 'TimePicker' + ) + const timeIntervals = React.isValidElement(TimePickerNode) + ? TimePickerNode.props.timeIntervals + : undefined + + const formatDate: (date: DateTimePickerProps['value']) => ReturnType = date => + getDate(date, timeIntervals) + + const [date, setDate] = useState(formatDate(value)) + + const handleChange: DateTimePickerProps['onChange'] = newDate => { + setDate(newDate || null) + onChange && onChange(newDate && new Date(newDate)) + } + + // format date at component mount + useEffect(() => { + onChange && handleChange(formatDate(value)) + //eslint-disable-next-line + }, []) + + // Ensure values are controlled by parent + useEffect(() => { + const formattedDate = formatDate(value) + if (new Date(value)?.getTime() - formattedDate?.getTime() !== 0 && onChange) { + handleChange(formattedDate) + } + setDate(formattedDate) + //eslint-disable-next-line + }, [value]) + + return ( + + {children && + Children.map(children, (child: React.ReactElement, i) => + cloneElement(child, { + // eslint-disable-next-line react/no-array-index-key + key: i, + onChange: handleChange, + // give ref only to the first child + inputRef: i < 1 ? ref : null, + locale: locale, + timeIntervals, + value: date, + transparent, + }) + )} + {!children && ( + <> + + + + )} + + ) + } +) + +DateTimePicker.displayName = 'DateTimePicker' diff --git a/lib/src/components/DateTimePicker/styles.ts b/lib/src/components/DateTimePicker/styles.ts new file mode 100644 index 0000000000..fb26a6148f --- /dev/null +++ b/lib/src/components/DateTimePicker/styles.ts @@ -0,0 +1,44 @@ +import styled, { css, system } from '@xstyled/styled-components' + +import { StyledDatePicker, StyledTimePicker } from '@/DateTimePickerCommon' + +const focusStyles = css` + &:focus { + position: relative; + z-index: 1; + } +` + +export const DateTimePicker = styled.divBox` + position: relative; + display: inline-flex; + flex-wrap: nowrap; + + .react-datepicker-wrapper { + flex-grow: 1; + ${StyledDatePicker} { + ${focusStyles}; + border-top-right-radius: 0; + border-bottom-right-radius: 0; + } + ${StyledTimePicker} { + ${focusStyles}; + border-top-left-radius: 0; + border-bottom-left-radius: 0; + } + } + + .react-datepicker-wrapper:first-child:not(:only-child) { + margin-right: -1px; + } + + .react-datepicker__input-container { + display: block; + } + + .react-datepicker { + font-family: inherit; + } + + ${system}; +` diff --git a/lib/src/components/DateTimePicker/tests/index.test.tsx b/lib/src/components/DateTimePicker/tests/index.test.tsx new file mode 100644 index 0000000000..b46c5a6736 --- /dev/null +++ b/lib/src/components/DateTimePicker/tests/index.test.tsx @@ -0,0 +1,226 @@ +import React from 'react' +import { act, screen } from '@testing-library/react' + +import { DatePicker } from '../../DatePicker' +import { TimePicker } from '../../TimePicker' +import { DateTimePicker } from '../' +import { render } from '../../../../tests' + +// jest.mock('popper.js', () => { +// const PopperJS = jest.requireActual('popper.js') + +// return class { +// static placements = PopperJS.placements + +// constructor() { +// return { +// destroy: () => { +// return {} +// }, +// scheduleUpdate: () => { +// return {} +// }, +// } +// } +// } +// }) + +describe('', () => { + test(' renders correctly', () => { + render() + + const dateTimePicker = screen.getByTestId('dateTimePicker') + const datePicker = dateTimePicker.querySelector('.date-picker') + const timePicker = dateTimePicker.querySelector('.time-picker') + + expect(datePicker).toBeInTheDocument() + expect(timePicker).toBeInTheDocument() + }) + + test(' renders correctly with invalid date', () => { + render() + + const dateTimePicker = screen.getByTestId('dateTimePicker') + const datePicker = dateTimePicker.querySelector('.date-picker') + const timePicker = dateTimePicker.querySelector('.time-picker') + + expect(datePicker).toBeInTheDocument() + expect(timePicker).toBeInTheDocument() + }) + + test('can render and opens the datePicker on click', async () => { + const { baseElement, user } = render( + + ) + + const datePicker = screen.getByTestId('dateTimePicker-datePicker') + + await act(() => user.click(datePicker)) + + const datePickerPopper = baseElement.querySelector('.date-picker-popper') + const timePickerPopper = baseElement.querySelector('.time-picker-popper') + + expect(datePickerPopper).toBeInTheDocument() + expect(timePickerPopper).not.toBeInTheDocument() + }) + + test('can render and opens the timePicker on click', async () => { + const { baseElement, user } = render( + + ) + + const timePicker = screen.getByTestId('dateTimePicker-timePicker') + + await act(() => user.click(timePicker)) + + const datePickerPopper = baseElement.querySelector('.date-picker-popper') + const timePickerPopper = baseElement.querySelector('.time-picker-popper') + + expect(datePickerPopper).not.toBeInTheDocument() + expect(timePickerPopper).toBeInTheDocument() + }) + + test(' renders month select', async () => { + const { user } = render( + + ) + + const datePicker = screen.getByTestId('dateTimePicker-datePicker') + + expect(datePicker).toHaveValue('11/09/2001') + + await act(() => user.click(datePicker)) + + const [monthSelect, yearSelect] = screen.getAllByRole('combobox') + + expect(monthSelect).toHaveTextContent('September') + expect(yearSelect).toHaveTextContent('2001') + }) + + test(' can proceed through next/prev months', async () => { + const { user } = render( + + ) + + const datePicker = screen.getByTestId('dateTimePicker-datePicker') + + await act(() => user.click(datePicker)) + + const decreaseMonth = screen.getByTitle('Previous month') + const increaseMonth = screen.getByTitle('Next month') + const [monthSelect, yearSelect] = screen.getAllByRole('combobox') + + expect(monthSelect).toHaveTextContent('September') + expect(yearSelect).toHaveTextContent('2001') + + await act(() => user.click(decreaseMonth)) + + expect(monthSelect).toHaveTextContent('August') + expect(yearSelect).toHaveTextContent('2001') + + await act(() => { + user.click(increaseMonth) + return user.click(increaseMonth) + }) + + expect(monthSelect).toHaveTextContent('October') + expect(yearSelect).toHaveTextContent('2001') + + await act(() => { + user.click(increaseMonth) + user.click(increaseMonth) + return user.click(increaseMonth) + }) + + expect(monthSelect).toHaveTextContent('January') + expect(yearSelect).toHaveTextContent('2002') + + await act(() => user.click(decreaseMonth)) + + expect(monthSelect).toHaveTextContent('December') + expect(yearSelect).toHaveTextContent('2001') + }) + + test(' updating text updates selects', async () => { + const { user } = render( + + ) + + const datePicker = screen.getByTestId('dateTimePicker-datePicker') + + await act(() => { + user.clear(datePicker) + return user.type(datePicker, '20/06/2018') + }) + + await act(() => user.click(datePicker)) + + const [monthSelect, yearSelect] = screen.getAllByRole('combobox') + + expect(monthSelect).toHaveTextContent('June') + expect(yearSelect).toHaveTextContent('2018') + }) + + test(' timeIntervals prop defaults to 15', async () => { + const { baseElement, user } = render( + + ) + + const datePicker = screen.getByTestId('dateTimePicker-datePicker') + const timePicker = screen.getByTestId('dateTimePicker-timePicker') + + expect(datePicker).toHaveValue('23/11/1987') + expect(timePicker).toHaveValue('00:00') + + await act(() => user.click(timePicker)) + + const timePickerPopperItems = baseElement.querySelectorAll('.react-datepicker__time-list-item') + const firstTimeValueEl = timePickerPopperItems[0] + const secondTimeValueEl = timePickerPopperItems[1] + + expect(firstTimeValueEl).toHaveTextContent('12:00 AM') + expect(secondTimeValueEl).toHaveTextContent('12:15 AM') + }) + + test(' timeIntervals works properly', async () => { + const { baseElement, user } = render( + + + + + ) + + const datePicker = screen.getByTestId('datePicker') + const timePicker = screen.getByTestId('timePicker') + + expect(datePicker).toHaveValue('23/11/1987') + expect(timePicker).toHaveValue('00:00') + + await act(() => user.click(timePicker)) + + const timePickerPopperItems = baseElement.querySelectorAll('.react-datepicker__time-list-item') + const firstTimeValueEl = timePickerPopperItems[0] + const secondTimeValueEl = timePickerPopperItems[1] + + expect(firstTimeValueEl).toHaveTextContent('12:00 AM') + expect(secondTimeValueEl).toHaveTextContent('12:05 AM') + + await act(() => user.click(secondTimeValueEl)) + + expect(timePicker).toHaveValue('00:05') + }) + + test(' can be cleared and has no `ClearButton` when no value', async () => { + const { user } = render( + + ) + + const datePicker = screen.getByTestId('dateTimePicker-datePicker') + const [clearButton] = screen.getAllByRole('button') + + await act(() => user.click(clearButton)) + + expect(datePicker).toHaveValue('') + expect(clearButton).not.toBeInTheDocument() + }) +}) diff --git a/packages/DateTimePickerCommon/src/CustomHeader.tsx b/lib/src/components/DateTimePickerCommon/CustomHeader.tsx similarity index 93% rename from packages/DateTimePickerCommon/src/CustomHeader.tsx rename to lib/src/components/DateTimePickerCommon/CustomHeader.tsx index 08a8f86fb1..a1704ebd27 100644 --- a/packages/DateTimePickerCommon/src/CustomHeader.tsx +++ b/lib/src/components/DateTimePickerCommon/CustomHeader.tsx @@ -1,13 +1,14 @@ import React, { useEffect, useMemo, useState } from 'react' -import { Button } from '@welcome-ui/button' -import { LeftIcon, RightIcon } from '@welcome-ui/icons' -import { Select } from '@welcome-ui/select' import { Locale } from 'date-fns' -import { CreateWuiProps } from '@welcome-ui/system' import * as S from './styles' import { getMonths, getYears } from './utils' +import { LeftIcon, RightIcon } from '@/Icons' +import { Select } from '@/Select' +import { Button } from '@/Button' +import { CreateWuiProps } from '@/System' + export interface CustomHeaderOptions { changeMonth: () => void changeYear: () => void diff --git a/packages/DateTimePickerCommon/src/CustomInput.tsx b/lib/src/components/DateTimePickerCommon/CustomInput.tsx similarity index 89% rename from packages/DateTimePickerCommon/src/CustomInput.tsx rename to lib/src/components/DateTimePickerCommon/CustomInput.tsx index 6db685eece..4637281eff 100644 --- a/packages/DateTimePickerCommon/src/CustomInput.tsx +++ b/lib/src/components/DateTimePickerCommon/CustomInput.tsx @@ -1,10 +1,12 @@ import React, { forwardRef } from 'react' -import { IconGroupWrapper, IconWrapper } from '@welcome-ui/field' -import { ClearButton } from '@welcome-ui/clear-button' -import { DefaultFieldStylesProps, FIELD_ICON_SIZE } from '@welcome-ui/utils' + +import { DefaultFieldStylesProps, FIELD_ICON_SIZE } from '../../utils/field-styles' import * as S from './styles' +import { IconGroupWrapper, IconWrapper } from '@/Field' +import { ClearButton } from '@/ClearButton' + export type Focused = 'date' | 'time' | null export type Icon = JSX.Element export type IconPlacement = 'right' | 'left' diff --git a/packages/DateTimePickerCommon/src/CustomPopper.tsx b/lib/src/components/DateTimePickerCommon/CustomPopper.tsx similarity index 98% rename from packages/DateTimePickerCommon/src/CustomPopper.tsx rename to lib/src/components/DateTimePickerCommon/CustomPopper.tsx index 006230ce0c..0db05c7fa4 100644 --- a/packages/DateTimePickerCommon/src/CustomPopper.tsx +++ b/lib/src/components/DateTimePickerCommon/CustomPopper.tsx @@ -1,6 +1,5 @@ import React from 'react' import styled, { css, CSSObject, th } from '@xstyled/styled-components' -import { cardStyles } from '@welcome-ui/utils' import { datePickerStyles } from './datePickerStyles' import { fixAriaMessageStyle } from './styles' @@ -29,7 +28,7 @@ const StyledCustomPopper = styled.divBox( .react-datepicker { padding: lg; font-family: inherit; - ${cardStyles}; + ${th('cards.default')}; &--time-only { padding: 0; diff --git a/packages/DateTimePickerCommon/src/datePickerStyles.ts b/lib/src/components/DateTimePickerCommon/datePickerStyles.ts similarity index 100% rename from packages/DateTimePickerCommon/src/datePickerStyles.ts rename to lib/src/components/DateTimePickerCommon/datePickerStyles.ts diff --git a/packages/DateTimePickerCommon/src/index.tsx b/lib/src/components/DateTimePickerCommon/index.tsx similarity index 100% rename from packages/DateTimePickerCommon/src/index.tsx rename to lib/src/components/DateTimePickerCommon/index.tsx diff --git a/lib/src/components/DateTimePickerCommon/styles.ts b/lib/src/components/DateTimePickerCommon/styles.ts new file mode 100644 index 0000000000..af101da060 --- /dev/null +++ b/lib/src/components/DateTimePickerCommon/styles.ts @@ -0,0 +1,92 @@ +import styled, { css, system } from '@xstyled/styled-components' +import ReactDatePicker, { ReactDatePickerProps } from 'react-datepicker' + +import { defaultFieldStyles, DefaultFieldStylesProps } from '../../utils/field-styles' + +import { Focused } from './CustomInput' + +import { StyledIcon } from '@/Icon' +import { IconGroupWrapper, IconWrapper } from '@/Field' +import { StyledSelect } from '@/Select' +import { StyledButton } from '@/Button' +import { shouldForwardProp } from '@/System' + +// Workaround to this issue: https://github.com/Hacker0x01/react-datepicker/issues/3834 +// eslint-disable-next-line @typescript-eslint/ban-ts-comment +// @ts-ignore +export const StyledDatePicker = styled(ReactDatePicker.default || ReactDatePicker)< + DefaultFieldStylesProps & ReactDatePickerProps +>( + ({ iconPlacement, size, transparent, variant }) => css` + ${defaultFieldStyles({ size, variant, transparent, isClearable: true, iconPlacement })}; + ${system}; + ` +) + +export const StyledTimePicker = styled( + // Workaround to this issue: https://github.com/Hacker0x01/react-datepicker/issues/3834 + // eslint-disable-next-line @typescript-eslint/ban-ts-comment + // @ts-ignore + ReactDatePicker.default || ReactDatePicker +)( + ({ iconPlacement, size, transparent, variant }) => css` + ${defaultFieldStyles({ size, variant, transparent, isClearable: true, iconPlacement })}; + text-align: center; + ${system}; + ` +) + +export const CustomInput = styled('div').withConfig({ shouldForwardProp })( + ({ focused }: { focused: Focused }) => { + return css` + position: relative; + + ${IconGroupWrapper} { + z-index: ${focused ? 1 : null}; + } + + ${IconWrapper} { + z-index: ${focused ? 1 : null}; + } + ` + } +) + +export const CustomHeader = styled.div` + display: flex; + align-items: center; + justify-content: space-between; + margin-bottom: lg; + text-align: left; + + ${StyledButton} { + width: 25; + height: 25; + + ${StyledIcon} { + width: 10; + height: 10; + } + } +` + +export const Selects = styled.div` + display: flex; + ${/* sc-selector */ StyledSelect}:first-child:not(:last-child) { + margin-right: sm; + } +` + +export const fixAriaMessageStyle = css` + .react-datepicker__aria-live { + position: absolute; + clip-path: circle(0); + border: 0; + height: 1px; + margin: -1px; + overflow: hidden; + padding: 0; + width: 1px; + white-space: nowrap; + } +` diff --git a/lib/src/components/DateTimePickerCommon/tests/utils.test.ts b/lib/src/components/DateTimePickerCommon/tests/utils.test.ts new file mode 100644 index 0000000000..8fb155f2e9 --- /dev/null +++ b/lib/src/components/DateTimePickerCommon/tests/utils.test.ts @@ -0,0 +1,38 @@ +import { getDate, getYears } from '../' + +test('date between 2 intervals should return next interval date', () => { + const timeInterval = 15 + const date = new Date().setHours(12, 16, 0, 0) + const expectedDate = new Date().setHours(12, 30, 0, 0) + expect(getDate(new Date(date), timeInterval)).toStrictEqual(new Date(expectedDate)) +}) + +test('a date with minutes being a multiple of the interval should return interval date', () => { + const timeInterval = 15 + const date = new Date().setHours(12, 30, 0, 0) + const expectedDate = new Date().setHours(12, 30, 0, 0) + expect(getDate(new Date(date), timeInterval)).toStrictEqual(new Date(expectedDate)) +}) + +test('a date with minutes being a multiple of the interval should return interval date (seconds and milliseconds reset)', () => { + const timeInterval = 15 + const date = new Date().setHours(12, 30, 59, 999) + const expectedDate = new Date().setHours(12, 30, 0, 0) + expect(getDate(new Date(date), timeInterval)).toStrictEqual(new Date(expectedDate)) +}) + +test('getYears(1990, 2000) should be an array of options (reversed) between 1990 and 2000 incremented by 1', () => { + expect(getYears(1990, 2000)).toStrictEqual([ + { label: '2000', value: 2000 }, + { label: '1999', value: 1999 }, + { label: '1998', value: 1998 }, + { label: '1997', value: 1997 }, + { label: '1996', value: 1996 }, + { label: '1995', value: 1995 }, + { label: '1994', value: 1994 }, + { label: '1993', value: 1993 }, + { label: '1992', value: 1992 }, + { label: '1991', value: 1991 }, + { label: '1990', value: 1990 }, + ]) +}) diff --git a/lib/src/components/DateTimePickerCommon/theme.ts b/lib/src/components/DateTimePickerCommon/theme.ts new file mode 100644 index 0000000000..83bafad09b --- /dev/null +++ b/lib/src/components/DateTimePickerCommon/theme.ts @@ -0,0 +1,29 @@ +import { CSSObject } from '@xstyled/styled-components' + +import { ThemeValues } from '@/theme' + +export type ThemeDateTimePickerCommon = { + item: { + selected: CSSObject + today: CSSObject + } +} + +export const getDateTimePickerCommon = (theme: ThemeValues): ThemeDateTimePickerCommon => { + const { colors, fontWeights } = theme + + return { + item: { + selected: { + color: colors['neutral-90'], + fontWeight: fontWeights.bold, + backgroundColor: colors['primary-40'], + outline: 'none', + }, + today: { + color: colors['neutral-90'], + fontWeight: fontWeights.bold, + }, + }, + } +} diff --git a/lib/src/components/DateTimePickerCommon/utils.ts b/lib/src/components/DateTimePickerCommon/utils.ts new file mode 100644 index 0000000000..201a4c1ac8 --- /dev/null +++ b/lib/src/components/DateTimePickerCommon/utils.ts @@ -0,0 +1,57 @@ +import range from 'lodash.range' +import { Locale } from 'date-fns' + +import { SelectOption, SelectOptions } from '@/Select' + +const MONTHS = [ + { value: 0, label: 'January' }, + { value: 1, label: 'February' }, + { value: 2, label: 'March' }, + { value: 3, label: 'April' }, + { value: 4, label: 'May' }, + { value: 5, label: 'June' }, + { value: 6, label: 'July' }, + { value: 7, label: 'August' }, + { value: 8, label: 'September' }, + { value: 9, label: 'October' }, + { value: 10, label: 'November' }, + { value: 11, label: 'December' }, +] + +export const DEFAULT_DATE = new Date() + +export const getDate = (date: string | number | Date, interval = 15): Date => { + if (!date) { + return null + } + + // If invalid date, use today + let newDate = new Date(date) + if (isNaN(newDate.getTime())) { + newDate = new Date() + } + + // Round to nearest interval + const nextInterval = Math.ceil(newDate.getMinutes() / interval) * interval + // Set minutes to nearest interval + return new Date(newDate.setMinutes(nextInterval, 0, 0)) +} + +export const getMonths = (locale: Locale): SelectOptions['options'] => { + if (!locale) { + return MONTHS + } + + return MONTHS.map((item, index) => ({ + ...item, + label: locale.localize.month(index), + })) +} + +export const getYears = (startYear: number, endYear: number): SelectOption[] => + range(startYear, endYear + 1) + .map(year => ({ + label: year.toString(), + value: year, + })) + .reverse() diff --git a/lib/src/components/Drawer/AssetDrawer/Header.tsx b/lib/src/components/Drawer/AssetDrawer/Header.tsx new file mode 100644 index 0000000000..b1dc43cab1 --- /dev/null +++ b/lib/src/components/Drawer/AssetDrawer/Header.tsx @@ -0,0 +1,91 @@ +import React from 'react' + +import { ArrowLeftIcon } from '../../Icons' +import { Button } from '../../Button' +import { Text } from '../../Text' + +import * as S from './styles' + +import type { IconProps } from '@/Icon' +import { Box } from '@/Box' + +type HeaderProps = { + /** + * Show on right a block, for example an HeaderAction + */ + action?: React.ReactNode + /** + * Icon from Icon component on the gray square + */ + icon?: React.FC + /** + * Add a back icon on header and call function on click + */ + onBackButtonClick?: (props?: unknown) => void + /** + * List of tags + */ + subtitle?: React.ReactNode + /** + * Title of asset + */ + title: React.ReactNode +} + +export const Header: React.FC = ({ + action, + icon, + onBackButtonClick, + subtitle, + title, +}) => { + return ( + + + {!!onBackButtonClick && ( + + )} + {!!icon && } + + + {title} + + {subtitle} + + + {action && ( + + {action} + + )} + + ) +} + +export type IconBlockProps = { + icon: React.FC + size?: 'sm' | 'md' +} + +export const IconBlock: React.FC = ({ icon: Icon, size = 'md' }) => { + return ( + + + + ) +} diff --git a/lib/src/components/Drawer/AssetDrawer/index.tsx b/lib/src/components/Drawer/AssetDrawer/index.tsx new file mode 100644 index 0000000000..88c1328a5d --- /dev/null +++ b/lib/src/components/Drawer/AssetDrawer/index.tsx @@ -0,0 +1,40 @@ +import React from 'react' +import * as Ariakit from '@ariakit/react' +import { useTheme } from '@xstyled/styled-components' + +import { Drawer } from '..' + +import * as S from './styles' + +import { Box } from '@/Box' +import { CreateWuiProps, forwardRef } from '@/System' + +export type AssetDrawerProps = CreateWuiProps<'div', Ariakit.DialogOptions> + +export const AssetDrawerComponent = forwardRef<'div', AssetDrawerProps>( + ({ children, maxWidth = 820, store, ...rest }, ref) => { + const theme = useTheme() + + return ( + + + {children} + + + ) + } +) diff --git a/packages/Drawer/src/AssetDrawer/styles.ts b/lib/src/components/Drawer/AssetDrawer/styles.ts similarity index 100% rename from packages/Drawer/src/AssetDrawer/styles.ts rename to lib/src/components/Drawer/AssetDrawer/styles.ts diff --git a/lib/src/components/Drawer/Close.tsx b/lib/src/components/Drawer/Close.tsx new file mode 100644 index 0000000000..512c89bdac --- /dev/null +++ b/lib/src/components/Drawer/Close.tsx @@ -0,0 +1,31 @@ +import React from 'react' +import * as Ariakit from '@ariakit/react' +import { useTheme } from '@xstyled/styled-components' + +import * as S from './styles' + +import { CloseButtonProps } from '@/CloseButton' +import { Box } from '@/Box' + +export type CloseProps = Ariakit.DialogDismissProps & CloseButtonProps + +export const Close: React.FC = ({ zIndex = '2', ...props }) => { + const theme = useTheme() + + return ( + + + } + /> + + ) +} diff --git a/lib/src/components/Drawer/Content.tsx b/lib/src/components/Drawer/Content.tsx new file mode 100644 index 0000000000..496be0a96b --- /dev/null +++ b/lib/src/components/Drawer/Content.tsx @@ -0,0 +1,11 @@ +import React from 'react' + +import * as S from './styles' + +import { CreateWuiProps, forwardRef } from '@/System' + +type ContentProps = CreateWuiProps<'div'> + +export const Content = forwardRef<'div', ContentProps>((props, ref) => { + return +}) diff --git a/lib/src/components/Drawer/Footer.tsx b/lib/src/components/Drawer/Footer.tsx new file mode 100644 index 0000000000..ca422f64bb --- /dev/null +++ b/lib/src/components/Drawer/Footer.tsx @@ -0,0 +1,19 @@ +import React from 'react' + +import * as S from './styles' + +import { CreateWuiProps, forwardRef } from '@/System' + +type FooterProps = CreateWuiProps<'div'> + +export const Footer = forwardRef<'div', FooterProps>((props, ref) => { + return ( + + ) +}) diff --git a/lib/src/components/Drawer/Title.tsx b/lib/src/components/Drawer/Title.tsx new file mode 100644 index 0000000000..840d41dda8 --- /dev/null +++ b/lib/src/components/Drawer/Title.tsx @@ -0,0 +1,24 @@ +import React from 'react' + +import * as S from './styles' + +import { Text, TextProps } from '@/Text' + +export const Title: React.FC = ({ children, zIndex = '1', ...props }) => { + return ( + + + {children} + + + ) +} diff --git a/packages/Drawer/docs/examples/asset.tsx b/lib/src/components/Drawer/docs/examples/asset.tsx similarity index 97% rename from packages/Drawer/docs/examples/asset.tsx rename to lib/src/components/Drawer/docs/examples/asset.tsx index 0b98b05e00..9af2d044c3 100644 --- a/packages/Drawer/docs/examples/asset.tsx +++ b/lib/src/components/Drawer/docs/examples/asset.tsx @@ -1,7 +1,8 @@ import * as React from 'react' -import { AssetDrawer, Drawer, useDrawer } from '@welcome-ui/drawer' -import { Button } from '@welcome-ui/button' -import { UserIcon } from '@welcome-ui/icons' + +import { AssetDrawer, Drawer, useDrawer } from '@/Drawer' +import { Button } from '@/Button' +import { UserIcon } from '@/Icons' const Example = () => { const drawer = useDrawer() diff --git a/packages/Drawer/docs/examples/backdrop.tsx b/lib/src/components/Drawer/docs/examples/backdrop.tsx similarity index 84% rename from packages/Drawer/docs/examples/backdrop.tsx rename to lib/src/components/Drawer/docs/examples/backdrop.tsx index 264d602525..b91b6502ce 100644 --- a/packages/Drawer/docs/examples/backdrop.tsx +++ b/lib/src/components/Drawer/docs/examples/backdrop.tsx @@ -1,6 +1,7 @@ import * as React from 'react' -import { Drawer, useDrawer } from '@welcome-ui/drawer' -import { Button } from '@welcome-ui/button' + +import { Drawer, useDrawer } from '@/Drawer' +import { Button } from '@/Button' const Example = () => { const drawer = useDrawer() diff --git a/packages/Drawer/docs/examples/layout.tsx b/lib/src/components/Drawer/docs/examples/layout.tsx similarity index 88% rename from packages/Drawer/docs/examples/layout.tsx rename to lib/src/components/Drawer/docs/examples/layout.tsx index 657886ef52..266fda2add 100644 --- a/packages/Drawer/docs/examples/layout.tsx +++ b/lib/src/components/Drawer/docs/examples/layout.tsx @@ -1,6 +1,7 @@ import * as React from 'react' -import { Drawer, useDrawer } from '@welcome-ui/drawer' -import { Button } from '@welcome-ui/button' + +import { Drawer, useDrawer } from '@/Drawer' +import { Button } from '@/Button' const Example = () => { const drawer = useDrawer() diff --git a/lib/src/components/Drawer/docs/examples/overview.tsx b/lib/src/components/Drawer/docs/examples/overview.tsx new file mode 100644 index 0000000000..1827fa5699 --- /dev/null +++ b/lib/src/components/Drawer/docs/examples/overview.tsx @@ -0,0 +1,22 @@ +import * as React from 'react' + +import { Drawer, useDrawer } from '@/Drawer' +import { Button } from '@/Button' + +const Example = () => { + const drawer = useDrawer() + + return ( + <> + + Open Drawer + + + Praesent sit amet quam ac velit faucibus dapibus. Quisque sapien ligula, rutrum quis aliquam + nec, convallis sit amet erat. Mauris auctor blandit porta. + + + ) +} + +export default Example diff --git a/lib/src/components/Drawer/docs/examples/placement.tsx b/lib/src/components/Drawer/docs/examples/placement.tsx new file mode 100644 index 0000000000..3838c9cd04 --- /dev/null +++ b/lib/src/components/Drawer/docs/examples/placement.tsx @@ -0,0 +1,35 @@ +import * as React from 'react' + +import { Drawer, DrawerProps, useDrawer } from '@/Drawer' +import { Button } from '@/Button' +import { Flex } from '@/Flex' + +const Example = () => { + const drawer = useDrawer() + const [placement, setPlacement] = React.useState() + + return ( + <> + + setPlacement('top')} store={drawer}> + Top + + setPlacement('right')} store={drawer}> + Right + + setPlacement('bottom')} store={drawer}> + Bottom + + setPlacement('left')} store={drawer}> + Left + + + + Praesent sit amet quam ac velit faucibus dapibus. Quisque sapien ligula, rutrum quis aliquam + nec, convallis sit amet erat. Mauris auctor blandit porta. + + + ) +} + +export default Example diff --git a/lib/src/components/Drawer/docs/examples/sizes.tsx b/lib/src/components/Drawer/docs/examples/sizes.tsx new file mode 100644 index 0000000000..138b50dee9 --- /dev/null +++ b/lib/src/components/Drawer/docs/examples/sizes.tsx @@ -0,0 +1,35 @@ +import * as React from 'react' + +import { Drawer, DrawerProps, useDrawer } from '@/Drawer' +import { Button } from '@/Button' +import { Flex } from '@/Flex' + +const Example = () => { + const drawer = useDrawer() + const [size, setSize] = React.useState() + + return ( + <> + + setSize('sm')} store={drawer}> + sm + + setSize('md')} store={drawer}> + md + + setSize('lg')} store={drawer}> + lg + + setSize('50%')} store={drawer}> + 50% + + + + Praesent sit amet quam ac velit faucibus dapibus. Quisque sapien ligula, rutrum quis aliquam + nec, convallis sit amet erat. Mauris auctor blandit porta. + + + ) +} + +export default Example diff --git a/packages/Drawer/docs/examples/styling.tsx b/lib/src/components/Drawer/docs/examples/styling.tsx similarity index 89% rename from packages/Drawer/docs/examples/styling.tsx rename to lib/src/components/Drawer/docs/examples/styling.tsx index cbde7290cb..044f2106a6 100644 --- a/packages/Drawer/docs/examples/styling.tsx +++ b/lib/src/components/Drawer/docs/examples/styling.tsx @@ -1,7 +1,8 @@ import * as React from 'react' -import { Drawer, useDrawer } from '@welcome-ui/drawer' -import { Button } from '@welcome-ui/button' -import { Stack } from '@welcome-ui/stack' + +import { Drawer, useDrawer } from '@/Drawer' +import { Button } from '@/Button' +import { Stack } from '@/Stack' const Example = () => { const drawer = useDrawer() diff --git a/packages/Drawer/docs/index.mdx b/lib/src/components/Drawer/docs/index.mdx similarity index 100% rename from packages/Drawer/docs/index.mdx rename to lib/src/components/Drawer/docs/index.mdx diff --git a/lib/src/components/Drawer/docs/properties.json b/lib/src/components/Drawer/docs/properties.json new file mode 100644 index 0000000000..d8a708221e --- /dev/null +++ b/lib/src/components/Drawer/docs/properties.json @@ -0,0 +1,2286 @@ +{ + "useDrawer": { + "props": { + "animated": { + "defaultValue": null, + "description": "Determines whether the content should animate when it is shown or hidden.\n- If `true`, the `animating` state will be `true` when the content is shown\n or hidden and it will wait for a CSS animation/transition to end before\n becoming `false`.\n- If it's set to a number, the `animating` state will be `true` when the\n content is shown or hidden and it will wait for the number of\n milliseconds to pass before becoming `false`.\n@deprecated Manually setting the `animated` prop is no longer necessary.\nThis will be removed in a future release.", + "name": "animated", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "number | boolean", + "value": [ + { + "value": "number" + }, + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "defaultOpen": { + "defaultValue": { + "value": "false" + }, + "description": "Whether the content should be visible by default.", + "name": "defaultOpen", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "disclosure": { + "defaultValue": null, + "description": "A reference to another disclosure store that controls another disclosure\ncomponent to keep them in sync. Element states like `contentElement` and\n`disclosureElement` won't be synced. For that, use the\n[`store`](https://ariakit.org/reference/disclosure-provider#store) prop\ninstead.\n\nLive examples:\n- [Command Menu](https://ariakit.org/examples/dialog-combobox-command-menu)", + "name": "disclosure", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + } + ], + "required": false, + "type": { + "name": "DisclosureStore" + } + }, + "setMounted": { + "defaultValue": null, + "description": "A callback that gets called when the `mounted` state changes.\n@example const [mounted, setMounted] = useState(false);\nconst disclosure = useDisclosureStore({ setMounted });", + "name": "setMounted", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + } + ], + "required": false, + "type": { + "name": "(mounted: boolean) => void" + } + }, + "setOpen": { + "defaultValue": null, + "description": "A callback that gets called when the\n[`open`](https://ariakit.org/reference/disclosure-provider#open) state\nchanges.\n@example const [open, setOpen] = useState(false);\nconst disclosure = useDisclosureStore({ open, setOpen });", + "name": "setOpen", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + } + ], + "required": false, + "type": { + "name": "(open: boolean) => void" + } + } + } + }, + "Drawer.Backdrop": { + "props": { + "hideOnInteractOutside": { + "defaultValue": { + "value": true + }, + "description": "", + "name": "hideOnInteractOutside", + "parent": { + "fileName": "welcome-ui/lib/src/components/Drawer/index.tsx", + "name": "DrawerBackdropOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Drawer/index.tsx", + "name": "DrawerBackdropOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + } + } + }, + "Trigger": { + "props": {} + }, + "Drawer": { + "props": { + "accessibleWhenDisabled": { + "defaultValue": null, + "description": "Indicates whether the element should be focusable even when it is\n[`disabled`](https://ariakit.org/reference/focusable#disabled).\n\nThis is important when discoverability is a concern. For example:\n\n> A toolbar in an editor contains a set of special smart paste functions\nthat are disabled when the clipboard is empty or when the function is not\napplicable to the current content of the clipboard. It could be helpful to\nkeep the disabled buttons focusable if the ability to discover their\nfunctionality is primarily via their presence on the toolbar.\n\nLearn more on [Focusability of disabled\ncontrols](https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#focusabilityofdisabledcontrols).\n\nLive examples:\n- [Combobox with Tabs](https://ariakit.org/examples/combobox-tabs)", + "name": "accessibleWhenDisabled", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/focusable/focusable.d.ts", + "name": "FocusableOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/focusable/focusable.d.ts", + "name": "FocusableOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "alwaysVisible": { + "defaultValue": { + "value": "false" + }, + "description": "Determines whether the content element should remain visible even when the\n[`open`](https://ariakit.org/reference/disclosure-provider#open) state is\n`false`. If this prop is set to `true`, the `hidden` prop and the `display:\nnone` style will not be applied, unless explicitly set otherwise.\n\nThis prop is particularly useful when using third-party animation libraries\nsuch as Framer Motion or React Spring, where the element needs to be\nvisible for exit animations to work.\n\nLive examples:\n- [Dialog with Framer\n Motion](https://ariakit.org/examples/dialog-framer-motion)\n- [Menu with Framer\n Motion](https://ariakit.org/examples/menu-framer-motion)\n- [Tooltip with Framer\n Motion](https://ariakit.org/examples/tooltip-framer-motion)\n- [Dialog with details &\n summary](https://ariakit.org/examples/dialog-details)", + "name": "alwaysVisible", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-content.d.ts", + "name": "DisclosureContentOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-content.d.ts", + "name": "DisclosureContentOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "autoFocus": { + "defaultValue": { + "value": "false" + }, + "description": "Automatically focuses the element upon mounting, similar to the native\n`autoFocus` prop. This addresses an issue where the element with the native\n`autoFocus` attribute might receive focus before React effects are\nexecuted.\n\nThe `autoFocus` prop can also be used with\n[Focusable](https://ariakit.org/components/focusable) elements within a\n[Dialog](https://ariakit.org/components/dialog) component, establishing the\ninitial focus as the dialog opens.\n\n**Note**: For this prop to work, the\n[`focusable`](https://ariakit.org/reference/command#focusable) prop must be\nset to `true`, if it's not set by default.\n\nLive examples:\n- [Warning on Dialog\n hide](https://ariakit.org/examples/dialog-hide-warning)\n- [Dialog with React\n Router](https://ariakit.org/examples/dialog-react-router)\n- [Nested Dialog](https://ariakit.org/examples/dialog-nested)", + "name": "autoFocus", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/focusable/focusable.d.ts", + "name": "FocusableOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/focusable/focusable.d.ts", + "name": "FocusableOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "autoFocusOnHide": { + "defaultValue": { + "value": "true" + }, + "description": "Determines whether an element outside of the dialog will be focused when\nthe dialog is hidden if another element hasn't been focused in the action\nof hiding the dialog (for example, by clicking or tabbing into another\ntabbable element outside of the dialog).\n\nBy default, this is usually the disclosure element. The\n[`finalFocus`](https://ariakit.org/reference/dialog#finalfocus) prop can be\nused to define a different element to be focused.\n\nLive examples:\n- [Dialog with Next.js App\n Router](https://ariakit.org/examples/dialog-next-router)\n- [Sliding menu](https://ariakit.org/examples/menu-slide)", + "name": "autoFocusOnHide", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "BooleanOrCallback", + "value": [ + { + "value": "false" + }, + { + "value": "true" + }, + { + "value": "(arg: HTMLElement) => boolean", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "autoFocusOnShow": { + "defaultValue": { + "value": "true" + }, + "description": "Determines whether an element inside the dialog will receive focus when the\ndialog is shown. By default, this is usually the first tabbable element in\nthe dialog or the dialog itself. The\n[`initialFocus`](https://ariakit.org/reference/dialog#initialfocus) prop\ncan be used to set a different element to receive focus.\n\nLive examples:\n- [Warning on Dialog\n hide](https://ariakit.org/examples/dialog-hide-warning)\n- [Sliding Menu](https://ariakit.org/examples/menu-slide)\n- [Selection Popover](https://ariakit.org/examples/popover-selection)", + "name": "autoFocusOnShow", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "BooleanOrCallback", + "value": [ + { + "value": "false" + }, + { + "value": "true" + }, + { + "value": "(arg: HTMLElement) => boolean", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "backdrop": { + "defaultValue": null, + "description": "Determines whether there will be a backdrop behind the dialog. On modal\ndialogs, this is `true` by default. Besides a `boolean`, this prop can also\nbe a React component or JSX element that will be rendered as the backdrop.\n\n**Note**: If a custom component is used, it must [accept ref and spread all\nprops to its underlying DOM\nelement](https://ariakit.org/guide/composition#custom-components-must-be-open-for-extension),\nthe same way a native element would.\n\nLive examples:\n- [Animated Dialog](https://ariakit.org/examples/dialog-animated)\n- [Dialog with scrollable\n backdrop](https://ariakit.org/examples/dialog-backdrop-scrollable)\n- [Dialog with Framer\n Motion](https://ariakit.org/examples/dialog-framer-motion)\n- [Dialog with Menu](https://ariakit.org/examples/dialog-menu)\n- [Nested Dialog](https://ariakit.org/examples/dialog-nested)\n- [Dialog with Next.js App\n Router](https://ariakit.org/examples/dialog-next-router)\n@example ```jsx\n} />\n```", + "name": "backdrop", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean | ReactElement, HTMLDivElement>, \"key\" | keyof HTMLAttributes<...>> & { ...; }, string | JSXElementConstructor<...>> | ElementType<...>", + "value": [ + { + "value": "false" + }, + { + "value": "true" + }, + { + "value": "\"abbr\"" + }, + { + "value": "\"address\"" + }, + { + "value": "\"article\"" + }, + { + "value": "\"aside\"" + }, + { + "value": "\"b\"" + }, + { + "value": "\"bdi\"" + }, + { + "value": "\"bdo\"" + }, + { + "value": "\"big\"" + }, + { + "value": "\"caption\"" + }, + { + "value": "\"cite\"" + }, + { + "value": "\"code\"" + }, + { + "value": "\"dd\"" + }, + { + "value": "\"dfn\"" + }, + { + "value": "\"div\"" + }, + { + "value": "\"dt\"" + }, + { + "value": "\"em\"" + }, + { + "value": "\"figcaption\"" + }, + { + "value": "\"figure\"" + }, + { + "value": "\"footer\"" + }, + { + "value": "\"h1\"" + }, + { + "value": "\"h2\"" + }, + { + "value": "\"h3\"" + }, + { + "value": "\"h4\"" + }, + { + "value": "\"h5\"" + }, + { + "value": "\"h6\"" + }, + { + "value": "\"head\"" + }, + { + "value": "\"header\"" + }, + { + "value": "\"hgroup\"" + }, + { + "value": "\"i\"" + }, + { + "value": "\"kbd\"" + }, + { + "value": "\"keygen\"" + }, + { + "value": "\"main\"" + }, + { + "value": "\"mark\"" + }, + { + "value": "\"menu\"" + }, + { + "value": "\"menuitem\"" + }, + { + "value": "\"nav\"" + }, + { + "value": "\"noindex\"" + }, + { + "value": "\"noscript\"" + }, + { + "value": "\"p\"" + }, + { + "value": "\"picture\"" + }, + { + "value": "\"rp\"" + }, + { + "value": "\"rt\"" + }, + { + "value": "\"ruby\"" + }, + { + "value": "\"s\"" + }, + { + "value": "\"samp\"" + }, + { + "value": "\"section\"" + }, + { + "value": "\"small\"" + }, + { + "value": "\"span\"" + }, + { + "value": "\"strong\"" + }, + { + "value": "\"sub\"" + }, + { + "value": "\"summary\"" + }, + { + "value": "\"sup\"" + }, + { + "value": "\"u\"" + }, + { + "value": "\"var\"" + }, + { + "value": "\"wbr\"" + }, + { + "value": "\"webview\"" + }, + { + "value": "ReactElement, HTMLDivElement>, \"key\" | keyof HTMLAttributes> & { ...; }, string | JSXElementConstructor<...>>", + "description": "", + "fullComment": "", + "tags": {} + }, + { + "value": "ComponentClass, HTMLDivElement>, \"key\" | keyof HTMLAttributes> & { ...; }, any>", + "description": "", + "fullComment": "", + "tags": {} + }, + { + "value": "FunctionComponent, HTMLDivElement>, \"key\" | keyof HTMLAttributes> & { ...; }>", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "disabled": { + "defaultValue": { + "value": "false" + }, + "description": "Determines if the element is disabled. This sets the `aria-disabled`\nattribute accordingly, enabling support for all elements, including those\nthat don't support the native `disabled` attribute.\n\nThis feature can be combined with the\n[`accessibleWhenDisabled`](https://ariakit.org/reference/focusable#accessiblewhendisabled)\nprop to make disabled elements still accessible via keyboard.\n\n**Note**: For this prop to work, the\n[`focusable`](https://ariakit.org/reference/command#focusable) prop must be\nset to `true`, if it's not set by default.\n\nLive examples:\n- [Submenu](https://ariakit.org/examples/menu-nested)\n- [Combobox with Tabs](https://ariakit.org/examples/combobox-tabs)\n- [Context Menu](https://ariakit.org/examples/menu-context-menu)", + "name": "disabled", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/focusable/focusable.d.ts", + "name": "FocusableOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/focusable/focusable.d.ts", + "name": "FocusableOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "finalFocus": { + "defaultValue": null, + "description": "Determines the element that will receive focus once the dialog is closed,\nprovided that no other element has been focused while the dialog was being\nhidden (e.g., by clicking or tabbing into another tabbable element outside\nof the dialog).\n- If\n [`autoFocusOnHide`](https://ariakit.org/reference/dialog#autofocusonhide)\n is set to `false`, this prop will have no effect.\n- If left unset, the element that was focused before the dialog was opened\n will be focused again.", + "name": "finalFocus", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "HTMLElement | RefObject", + "value": [ + { + "value": "HTMLElement", + "description": "Any HTML element. Some elements directly implement this interface, while others implement it via an interface that inherits it.", + "fullComment": "Any HTML element. Some elements directly implement this interface, while others implement it via an interface that inherits it.", + "tags": {} + }, + { + "value": "RefObject", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "focusable": { + "defaultValue": { + "value": "true" + }, + "description": "Determines if [Focusable](https://ariakit.org/components/focusable)\nfeatures should be active on non-native focusable elements.\n\n**Note**: This prop only turns off the additional features provided by the\n[`Focusable`](https://ariakit.org/reference/focusable) component.\nNon-native focusable elements will lose their focusability entirely.\nHowever, native focusable elements will retain their inherent focusability,\nbut without added features such as improved\n[`autoFocus`](https://ariakit.org/reference/focusable#autofocus),\n[`accessibleWhenDisabled`](https://ariakit.org/reference/focusable#accessiblewhendisabled),\n[`onFocusVisible`](https://ariakit.org/reference/focusable#onfocusvisible),\netc.", + "name": "focusable", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/focusable/focusable.d.ts", + "name": "FocusableOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/focusable/focusable.d.ts", + "name": "FocusableOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "getPersistentElements": { + "defaultValue": null, + "description": "When a dialog is open, the elements outside of it are disabled to prevent\ninteraction if the dialog is\n[`modal`](https://ariakit.org/reference/dialog#modal). For non-modal\ndialogs, interacting with elements outside the dialog prompts it to close.\n\nThis function allows you to return an iterable collection of elements that\nwill be considered as part of the dialog, thus excluding them from this\nbehavior.\n\n**Note**: The elements returned by this function must exist in the DOM when\nthe dialog opens.\n\nLive examples:\n- [Dialog with\n React-Toastify](https://ariakit.org/examples/dialog-react-toastify)", + "name": "getPersistentElements", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "() => Iterable" + } + }, + "hideOnEscape": { + "defaultValue": { + "value": "true" + }, + "description": "Determines if the dialog will hide when the user presses the Escape key.\n\nThis prop can be either a boolean or a function that accepts an event as an\nargument and returns a boolean. The event object represents the keydown\nevent that initiated the hide action, which could be either a native\nkeyboard event or a React synthetic event.\n\n**Note**: When placing Ariakit dialogs inside third-party dialogs, using\n`event.stopPropagation()` within this function will stop the event from\nreaching the third-party dialog, closing only the Ariakit dialog.", + "name": "hideOnEscape", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "BooleanOrCallback>", + "value": [ + { + "value": "false" + }, + { + "value": "true" + }, + { + "value": "(arg: KeyboardEvent | React.KeyboardEvent) => boolean", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "hideOnInteractOutside": { + "defaultValue": { + "value": true + }, + "description": "Determines if the dialog should hide when the user clicks or focuses on an\nelement outside the dialog.\n\nThis prop can be either a boolean or a function that takes an event as an\nargument and returns a boolean. The event object represents the event that\ntriggered the action, which could be a native event or a React synthetic\nevent of various types.\n\nLive examples:\n- [Selection Popover](https://ariakit.org/examples/popover-selection)", + "name": "hideOnInteractOutside", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "BooleanOrCallback>", + "value": [ + { + "value": "false" + }, + { + "value": "true" + }, + { + "value": "(arg: Event | SyntheticEvent) => boolean", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "initialFocus": { + "defaultValue": null, + "description": "Specifies the element that will receive focus when the dialog is first\nopened. It can be an `HTMLElement` or a `React.RefObject` with an\n`HTMLElement`.\n\nIf\n[`autoFocusOnShow`](https://ariakit.org/reference/dialog#autofocusonshow)\nis set to `false`, this prop will have no effect. If left unset, the dialog\nwill attempt to determine the initial focus element in the following order:\n1. A [Focusable](https://ariakit.org/components/focusable) element with an\n [`autoFocus`](https://ariakit.org/reference/focusable#autofocus) prop.\n2. The first tabbable element inside the dialog.\n3. The first focusable element inside the dialog.\n4. The dialog element itself.", + "name": "initialFocus", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "HTMLElement | RefObject", + "value": [ + { + "value": "HTMLElement", + "description": "Any HTML element. Some elements directly implement this interface, while others implement it via an interface that inherits it.", + "fullComment": "Any HTML element. Some elements directly implement this interface, while others implement it via an interface that inherits it.", + "tags": {} + }, + { + "value": "RefObject", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "modal": { + "defaultValue": { + "value": "true" + }, + "description": "Determines whether the dialog is modal. Modal dialogs have distinct states\nand behaviors:\n- The [`portal`](https://ariakit.org/reference/dialog#portal) and\n [`preventBodyScroll`](https://ariakit.org/reference/dialog#preventbodyscroll)\n props are set to `true`. They can still be manually set to `false`.\n- When using the [`Heading`](https://ariakit.org/reference/heading) or\n [`DialogHeading`](https://ariakit.org/reference/dialog-heading)\n components within the dialog, their level will be reset so they start\n with `h1`.\n- A visually hidden dismiss button will be rendered if the\n [`DialogDismiss`](https://ariakit.org/reference/dialog-dismiss) component\n hasn't been used. This allows screen reader users to close the dialog.\n- When the dialog is open, element tree outside it will be inert.\n\nLive examples:\n- [Combobox with Tabs](https://ariakit.org/examples/combobox-tabs)\n- [Dialog with details &\n summary](https://ariakit.org/examples/dialog-details)\n- [Form with Select](https://ariakit.org/examples/form-select)\n- [Context menu](https://ariakit.org/examples/menu-context-menu)\n- [Responsive Popover](https://ariakit.org/examples/popover-responsive)", + "name": "modal", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "onClose": { + "defaultValue": null, + "description": "This is an event handler prop triggered when the dialog's `close` event is\ndispatched. The `close` event is similar to the native dialog\n[`close`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLDialogElement/close_event)\nevent. The only difference is that this event can be canceled with\n`event.preventDefault()`, which will prevent the dialog from hiding.\n\nIt's important to note that this event only fires when the dialog store's\n[`open`](https://ariakit.org/reference/use-dialog-store#open) state is set\nto `false`. If the controlled\n[`open`](https://ariakit.org/reference/dialog#open) prop value changes, or\nif the dialog's visibility is altered in any other way (such as unmounting\nthe dialog without adjusting the open state), this event won't be\ntriggered.\n\nLive examples:\n- [Dialog with scrollable\n backdrop](https://ariakit.org/examples/dialog-backdrop-scrollable)\n- [Dialog with details &\n summary](https://ariakit.org/examples/dialog-details)\n- [Warning on Dialog\n hide](https://ariakit.org/examples/dialog-hide-warning)\n- [Dialog with Menu](https://ariakit.org/examples/dialog-menu)", + "name": "onClose", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "(event: Event) => void" + } + }, + "onFocusVisible": { + "defaultValue": null, + "description": "Custom event handler invoked when the element gains focus through keyboard\ninteraction or a key press occurs while the element is in focus. This is\nthe programmatic equivalent of the\n[`data-focus-visible`](https://ariakit.org/guide/styling#data-focus-visible)\nattribute.\n\n**Note**: For this prop to work, the\n[`focusable`](https://ariakit.org/reference/command#focusable) prop must be\nset to `true`, if it's not set by default.\n\nLive examples:\n- [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)\n- [Custom Checkbox](https://ariakit.org/examples/checkbox-custom)", + "name": "onFocusVisible", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/focusable/focusable.d.ts", + "name": "FocusableOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/focusable/focusable.d.ts", + "name": "FocusableOptions" + } + ], + "required": false, + "type": { + "name": "BivariantCallback<(event: SyntheticEvent) => void>" + } + }, + "open": { + "defaultValue": null, + "description": "Controls the open state of the dialog. This is similar to the\n[`open`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLDialogElement/open)\nattribute on native dialog elements.\n\nLive examples:\n- [Dialog with scrollable\n backdrop](https://ariakit.org/examples/dialog-backdrop-scrollable)\n- [Dialog with details &\n summary](https://ariakit.org/examples/dialog-details)\n- [Warning on Dialog\n hide](https://ariakit.org/examples/dialog-hide-warning)\n- [Dialog with Menu](https://ariakit.org/examples/dialog-menu)", + "name": "open", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "placement": { + "defaultValue": { + "value": "right" + }, + "description": "", + "name": "placement", + "parent": { + "fileName": "welcome-ui/lib/src/components/Drawer/index.tsx", + "name": "DrawerOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Drawer/index.tsx", + "name": "DrawerOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "Placement", + "value": [ + { + "value": "\"top\"" + }, + { + "value": "\"right\"" + }, + { + "value": "\"bottom\"" + }, + { + "value": "\"left\"" + } + ] + } + }, + "portal": { + "defaultValue": { + "value": "true" + }, + "description": "Determines whether the element should be rendered as a React Portal.\n\nLive examples:\n- [Combobox with integrated\n filter](https://ariakit.org/examples/combobox-filtering-integrated)\n- [Dialog with Menu](https://ariakit.org/examples/dialog-menu)\n- [Hovercard with keyboard\n support](https://ariakit.org/examples/hovercard-disclosure)\n- [Menubar](https://ariakit.org/components/menubar)\n- [Standalone Popover](https://ariakit.org/examples/popover-standalone)\n- [Animated Select](https://ariakit.org/examples/select-animated)", + "name": "portal", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "portalElement": { + "defaultValue": null, + "description": "An HTML element or a memoized callback function that returns an HTML\nelement to be used as the portal element. By default, the portal element\nwill be a `div` element appended to the `document.body`.\n\nLive examples:\n- [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)\n@example ```jsx\nconst [portal, setPortal] = useState(null);\n\n\n
\n```\n@example ```jsx\nconst getPortalElement = useCallback(() => {\n const div = document.createElement(\"div\");\n const portalRoot = document.getElementById(\"portal-root\");\n portalRoot.appendChild(div);\n return div;\n}, []);\n\n\n```", + "name": "portalElement", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "HTMLElement | ((element: HTMLElement) => HTMLElement)", + "value": [ + { + "value": "HTMLElement", + "description": "Any HTML element. Some elements directly implement this interface, while others implement it via an interface that inherits it.", + "fullComment": "Any HTML element. Some elements directly implement this interface, while others implement it via an interface that inherits it.", + "tags": {} + }, + { + "value": "(element: HTMLElement) => HTMLElement", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "portalRef": { + "defaultValue": null, + "description": "`portalRef` is similar to `ref` but is scoped to the portal node. It's\nuseful when you need to be informed when the portal element is appended to\nthe DOM or removed from the DOM.\n\nLive examples:\n- [Form with Select](https://ariakit.org/examples/form-select)\n@example ```jsx\nconst [portalElement, setPortalElement] = useState(null);\n\n\n```", + "name": "portalRef", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "RefCallback | MutableRefObject", + "value": [ + { + "value": "RefCallback", + "description": "", + "fullComment": "", + "tags": {} + }, + { + "value": "MutableRefObject", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "preserveTabOrder": { + "defaultValue": { + "value": "false" + }, + "description": "When enabled, `preserveTabOrder` will keep the DOM element's tab order the\nsame as the order in which the underlying\n[`Portal`](https://ariakit.org/reference/portal) component was mounted in\nthe React tree.\n\nIf the\n[`preserveTabOrderAnchor`](https://ariakit.org/reference/portal#preservetaborderanchor)\nprop is provided, the tab order will be preserved relative to that element.", + "name": "preserveTabOrder", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "preserveTabOrderAnchor": { + "defaultValue": null, + "description": "An anchor element for maintaining the tab order when\n[`preserveTabOrder`](https://ariakit.org/reference/portal#preservetaborder)\nprop is enabled. The tab order will be kept relative to this element.\n\nBy default, the tab order is kept relative to the original location in the\nReact tree where the underlying\n[`Portal`](https://ariakit.org/reference/portal) component was mounted.\n@example ```jsx {18-20}\nconst [anchor, setAnchor] = useState(null);\n\n\n\n\n// Rendered at the end of the document.\n\n \n\n\n// Rendered at the end of the document, but the tab order is preserved.\n\n \n\n\n// Rendered at the end of the document, but the tab order is preserved\n// relative to the anchor element.\n\n \n\n\n\n```", + "name": "preserveTabOrderAnchor", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + } + ], + "required": false, + "type": { + "name": "Element" + } + }, + "preventBodyScroll": { + "defaultValue": null, + "description": "Determines whether the body scrolling will be prevented when the dialog is\nshown. This is automatically set to `true` when the dialog is\n[`modal`](https://ariakit.org/reference/dialog#modal). You can disable this\nprop if you want to implement your own logic.", + "name": "preventBodyScroll", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "render": { + "defaultValue": null, + "description": "Allows the component to be rendered as a different HTML element or React\ncomponent. The value can be a React element or a function that takes in the\noriginal component props and gives back a React element with the props\nmerged.\n\nCheck out the [Composition](https://ariakit.org/guide/composition) guide\nfor more details.", + "name": "render", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/utils/types.d.ts", + "name": "Options" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/utils/types.d.ts", + "name": "Options" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "ReactElement> | RenderProp & { ref?: Ref; }>", + "value": [ + { + "value": "ReactElement>", + "description": "", + "fullComment": "", + "tags": {} + }, + { + "value": "RenderProp & { ref?: Ref; }>", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "size": { + "defaultValue": { + "value": "lg" + }, + "description": "", + "name": "size", + "parent": { + "fileName": "welcome-ui/lib/src/components/Drawer/index.tsx", + "name": "DrawerOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Drawer/index.tsx", + "name": "DrawerOptions" + } + ], + "required": false, + "type": { + "name": "string" + } + }, + "store": { + "defaultValue": null, + "description": "Object returned by the\n[`useDialogStore`](https://ariakit.org/reference/use-dialog-store) hook. If\nnot provided, the closest\n[`DialogProvider`](https://ariakit.org/reference/dialog-provider)\ncomponent's context will be used. Otherwise, an internal store will be\ncreated.", + "name": "store", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "DialogStore" + } + }, + "unmountOnHide": { + "defaultValue": { + "value": "false" + }, + "description": "When set to `true`, the content element will be unmounted and removed from\nthe DOM when it's hidden.\n\nLive examples:\n- [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)\n- [Combobox with integrated\n filter](https://ariakit.org/examples/combobox-filtering-integrated)\n- [Textarea with inline\n Combobox](https://ariakit.org/examples/combobox-textarea)\n- [Standalone Popover](https://ariakit.org/examples/popover-standalone)\n- [Animated Select](https://ariakit.org/examples/select-animated)\n- [Multi-Select](https://ariakit.org/examples/select-multiple)", + "name": "unmountOnHide", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-content.d.ts", + "name": "DisclosureContentOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-content.d.ts", + "name": "DisclosureContentOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "unstable_treeSnapshotKey": { + "defaultValue": null, + "description": "@private", + "name": "unstable_treeSnapshotKey", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "string | number | boolean", + "value": [ + { + "value": "string" + }, + { + "value": "number" + }, + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "withBackdrop": { + "defaultValue": { + "value": false + }, + "description": "", + "name": "withBackdrop", + "parent": { + "fileName": "welcome-ui/lib/src/components/Drawer/index.tsx", + "name": "DrawerOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Drawer/index.tsx", + "name": "DrawerOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "withCloseButton": { + "defaultValue": { + "value": true + }, + "description": "", + "name": "withCloseButton", + "parent": { + "fileName": "welcome-ui/lib/src/components/Drawer/index.tsx", + "name": "DrawerOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Drawer/index.tsx", + "name": "DrawerOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "wrapElement": { + "defaultValue": null, + "description": "", + "name": "wrapElement", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/utils/types.d.ts", + "name": "Options" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/utils/types.d.ts", + "name": "Options" + } + ], + "required": false, + "type": { + "name": "WrapElement" + } + } + } + }, + "AssetDrawer": { + "props": { + "accessibleWhenDisabled": { + "defaultValue": null, + "description": "Indicates whether the element should be focusable even when it is\n[`disabled`](https://ariakit.org/reference/focusable#disabled).\n\nThis is important when discoverability is a concern. For example:\n\n> A toolbar in an editor contains a set of special smart paste functions\nthat are disabled when the clipboard is empty or when the function is not\napplicable to the current content of the clipboard. It could be helpful to\nkeep the disabled buttons focusable if the ability to discover their\nfunctionality is primarily via their presence on the toolbar.\n\nLearn more on [Focusability of disabled\ncontrols](https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#focusabilityofdisabledcontrols).\n\nLive examples:\n- [Combobox with Tabs](https://ariakit.org/examples/combobox-tabs)", + "name": "accessibleWhenDisabled", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/focusable/focusable.d.ts", + "name": "FocusableOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/focusable/focusable.d.ts", + "name": "FocusableOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "alwaysVisible": { + "defaultValue": { + "value": "false" + }, + "description": "Determines whether the content element should remain visible even when the\n[`open`](https://ariakit.org/reference/disclosure-provider#open) state is\n`false`. If this prop is set to `true`, the `hidden` prop and the `display:\nnone` style will not be applied, unless explicitly set otherwise.\n\nThis prop is particularly useful when using third-party animation libraries\nsuch as Framer Motion or React Spring, where the element needs to be\nvisible for exit animations to work.\n\nLive examples:\n- [Dialog with Framer\n Motion](https://ariakit.org/examples/dialog-framer-motion)\n- [Menu with Framer\n Motion](https://ariakit.org/examples/menu-framer-motion)\n- [Tooltip with Framer\n Motion](https://ariakit.org/examples/tooltip-framer-motion)\n- [Dialog with details &\n summary](https://ariakit.org/examples/dialog-details)", + "name": "alwaysVisible", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-content.d.ts", + "name": "DisclosureContentOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-content.d.ts", + "name": "DisclosureContentOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "autoFocus": { + "defaultValue": { + "value": "false" + }, + "description": "Automatically focuses the element upon mounting, similar to the native\n`autoFocus` prop. This addresses an issue where the element with the native\n`autoFocus` attribute might receive focus before React effects are\nexecuted.\n\nThe `autoFocus` prop can also be used with\n[Focusable](https://ariakit.org/components/focusable) elements within a\n[Dialog](https://ariakit.org/components/dialog) component, establishing the\ninitial focus as the dialog opens.\n\n**Note**: For this prop to work, the\n[`focusable`](https://ariakit.org/reference/command#focusable) prop must be\nset to `true`, if it's not set by default.\n\nLive examples:\n- [Warning on Dialog\n hide](https://ariakit.org/examples/dialog-hide-warning)\n- [Dialog with React\n Router](https://ariakit.org/examples/dialog-react-router)\n- [Nested Dialog](https://ariakit.org/examples/dialog-nested)", + "name": "autoFocus", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/focusable/focusable.d.ts", + "name": "FocusableOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/focusable/focusable.d.ts", + "name": "FocusableOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "autoFocusOnHide": { + "defaultValue": { + "value": "true" + }, + "description": "Determines whether an element outside of the dialog will be focused when\nthe dialog is hidden if another element hasn't been focused in the action\nof hiding the dialog (for example, by clicking or tabbing into another\ntabbable element outside of the dialog).\n\nBy default, this is usually the disclosure element. The\n[`finalFocus`](https://ariakit.org/reference/dialog#finalfocus) prop can be\nused to define a different element to be focused.\n\nLive examples:\n- [Dialog with Next.js App\n Router](https://ariakit.org/examples/dialog-next-router)\n- [Sliding menu](https://ariakit.org/examples/menu-slide)", + "name": "autoFocusOnHide", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "BooleanOrCallback", + "value": [ + { + "value": "false" + }, + { + "value": "true" + }, + { + "value": "(arg: HTMLElement) => boolean", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "autoFocusOnShow": { + "defaultValue": { + "value": "true" + }, + "description": "Determines whether an element inside the dialog will receive focus when the\ndialog is shown. By default, this is usually the first tabbable element in\nthe dialog or the dialog itself. The\n[`initialFocus`](https://ariakit.org/reference/dialog#initialfocus) prop\ncan be used to set a different element to receive focus.\n\nLive examples:\n- [Warning on Dialog\n hide](https://ariakit.org/examples/dialog-hide-warning)\n- [Sliding Menu](https://ariakit.org/examples/menu-slide)\n- [Selection Popover](https://ariakit.org/examples/popover-selection)", + "name": "autoFocusOnShow", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "BooleanOrCallback", + "value": [ + { + "value": "false" + }, + { + "value": "true" + }, + { + "value": "(arg: HTMLElement) => boolean", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "backdrop": { + "defaultValue": null, + "description": "Determines whether there will be a backdrop behind the dialog. On modal\ndialogs, this is `true` by default. Besides a `boolean`, this prop can also\nbe a React component or JSX element that will be rendered as the backdrop.\n\n**Note**: If a custom component is used, it must [accept ref and spread all\nprops to its underlying DOM\nelement](https://ariakit.org/guide/composition#custom-components-must-be-open-for-extension),\nthe same way a native element would.\n\nLive examples:\n- [Animated Dialog](https://ariakit.org/examples/dialog-animated)\n- [Dialog with scrollable\n backdrop](https://ariakit.org/examples/dialog-backdrop-scrollable)\n- [Dialog with Framer\n Motion](https://ariakit.org/examples/dialog-framer-motion)\n- [Dialog with Menu](https://ariakit.org/examples/dialog-menu)\n- [Nested Dialog](https://ariakit.org/examples/dialog-nested)\n- [Dialog with Next.js App\n Router](https://ariakit.org/examples/dialog-next-router)\n@example ```jsx\n} />\n```", + "name": "backdrop", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean | ReactElement, HTMLDivElement>, \"key\" | keyof HTMLAttributes<...>> & { ...; }, string | JSXElementConstructor<...>> | ElementType<...>", + "value": [ + { + "value": "false" + }, + { + "value": "true" + }, + { + "value": "\"abbr\"" + }, + { + "value": "\"address\"" + }, + { + "value": "\"article\"" + }, + { + "value": "\"aside\"" + }, + { + "value": "\"b\"" + }, + { + "value": "\"bdi\"" + }, + { + "value": "\"bdo\"" + }, + { + "value": "\"big\"" + }, + { + "value": "\"caption\"" + }, + { + "value": "\"cite\"" + }, + { + "value": "\"code\"" + }, + { + "value": "\"dd\"" + }, + { + "value": "\"dfn\"" + }, + { + "value": "\"div\"" + }, + { + "value": "\"dt\"" + }, + { + "value": "\"em\"" + }, + { + "value": "\"figcaption\"" + }, + { + "value": "\"figure\"" + }, + { + "value": "\"footer\"" + }, + { + "value": "\"h1\"" + }, + { + "value": "\"h2\"" + }, + { + "value": "\"h3\"" + }, + { + "value": "\"h4\"" + }, + { + "value": "\"h5\"" + }, + { + "value": "\"h6\"" + }, + { + "value": "\"head\"" + }, + { + "value": "\"header\"" + }, + { + "value": "\"hgroup\"" + }, + { + "value": "\"i\"" + }, + { + "value": "\"kbd\"" + }, + { + "value": "\"keygen\"" + }, + { + "value": "\"main\"" + }, + { + "value": "\"mark\"" + }, + { + "value": "\"menu\"" + }, + { + "value": "\"menuitem\"" + }, + { + "value": "\"nav\"" + }, + { + "value": "\"noindex\"" + }, + { + "value": "\"noscript\"" + }, + { + "value": "\"p\"" + }, + { + "value": "\"picture\"" + }, + { + "value": "\"rp\"" + }, + { + "value": "\"rt\"" + }, + { + "value": "\"ruby\"" + }, + { + "value": "\"s\"" + }, + { + "value": "\"samp\"" + }, + { + "value": "\"section\"" + }, + { + "value": "\"small\"" + }, + { + "value": "\"span\"" + }, + { + "value": "\"strong\"" + }, + { + "value": "\"sub\"" + }, + { + "value": "\"summary\"" + }, + { + "value": "\"sup\"" + }, + { + "value": "\"u\"" + }, + { + "value": "\"var\"" + }, + { + "value": "\"wbr\"" + }, + { + "value": "\"webview\"" + }, + { + "value": "ReactElement, HTMLDivElement>, \"key\" | keyof HTMLAttributes> & { ...; }, string | JSXElementConstructor<...>>", + "description": "", + "fullComment": "", + "tags": {} + }, + { + "value": "ComponentClass, HTMLDivElement>, \"key\" | keyof HTMLAttributes> & { ...; }, any>", + "description": "", + "fullComment": "", + "tags": {} + }, + { + "value": "FunctionComponent, HTMLDivElement>, \"key\" | keyof HTMLAttributes> & { ...; }>", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "disabled": { + "defaultValue": { + "value": "false" + }, + "description": "Determines if the element is disabled. This sets the `aria-disabled`\nattribute accordingly, enabling support for all elements, including those\nthat don't support the native `disabled` attribute.\n\nThis feature can be combined with the\n[`accessibleWhenDisabled`](https://ariakit.org/reference/focusable#accessiblewhendisabled)\nprop to make disabled elements still accessible via keyboard.\n\n**Note**: For this prop to work, the\n[`focusable`](https://ariakit.org/reference/command#focusable) prop must be\nset to `true`, if it's not set by default.\n\nLive examples:\n- [Submenu](https://ariakit.org/examples/menu-nested)\n- [Combobox with Tabs](https://ariakit.org/examples/combobox-tabs)\n- [Context Menu](https://ariakit.org/examples/menu-context-menu)", + "name": "disabled", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/focusable/focusable.d.ts", + "name": "FocusableOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/focusable/focusable.d.ts", + "name": "FocusableOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "finalFocus": { + "defaultValue": null, + "description": "Determines the element that will receive focus once the dialog is closed,\nprovided that no other element has been focused while the dialog was being\nhidden (e.g., by clicking or tabbing into another tabbable element outside\nof the dialog).\n- If\n [`autoFocusOnHide`](https://ariakit.org/reference/dialog#autofocusonhide)\n is set to `false`, this prop will have no effect.\n- If left unset, the element that was focused before the dialog was opened\n will be focused again.", + "name": "finalFocus", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "HTMLElement | RefObject", + "value": [ + { + "value": "HTMLElement", + "description": "Any HTML element. Some elements directly implement this interface, while others implement it via an interface that inherits it.", + "fullComment": "Any HTML element. Some elements directly implement this interface, while others implement it via an interface that inherits it.", + "tags": {} + }, + { + "value": "RefObject", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "focusable": { + "defaultValue": { + "value": "true" + }, + "description": "Determines if [Focusable](https://ariakit.org/components/focusable)\nfeatures should be active on non-native focusable elements.\n\n**Note**: This prop only turns off the additional features provided by the\n[`Focusable`](https://ariakit.org/reference/focusable) component.\nNon-native focusable elements will lose their focusability entirely.\nHowever, native focusable elements will retain their inherent focusability,\nbut without added features such as improved\n[`autoFocus`](https://ariakit.org/reference/focusable#autofocus),\n[`accessibleWhenDisabled`](https://ariakit.org/reference/focusable#accessiblewhendisabled),\n[`onFocusVisible`](https://ariakit.org/reference/focusable#onfocusvisible),\netc.", + "name": "focusable", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/focusable/focusable.d.ts", + "name": "FocusableOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/focusable/focusable.d.ts", + "name": "FocusableOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "getPersistentElements": { + "defaultValue": null, + "description": "When a dialog is open, the elements outside of it are disabled to prevent\ninteraction if the dialog is\n[`modal`](https://ariakit.org/reference/dialog#modal). For non-modal\ndialogs, interacting with elements outside the dialog prompts it to close.\n\nThis function allows you to return an iterable collection of elements that\nwill be considered as part of the dialog, thus excluding them from this\nbehavior.\n\n**Note**: The elements returned by this function must exist in the DOM when\nthe dialog opens.\n\nLive examples:\n- [Dialog with\n React-Toastify](https://ariakit.org/examples/dialog-react-toastify)", + "name": "getPersistentElements", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "() => Iterable" + } + }, + "hideOnEscape": { + "defaultValue": { + "value": "true" + }, + "description": "Determines if the dialog will hide when the user presses the Escape key.\n\nThis prop can be either a boolean or a function that accepts an event as an\nargument and returns a boolean. The event object represents the keydown\nevent that initiated the hide action, which could be either a native\nkeyboard event or a React synthetic event.\n\n**Note**: When placing Ariakit dialogs inside third-party dialogs, using\n`event.stopPropagation()` within this function will stop the event from\nreaching the third-party dialog, closing only the Ariakit dialog.", + "name": "hideOnEscape", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "BooleanOrCallback>", + "value": [ + { + "value": "false" + }, + { + "value": "true" + }, + { + "value": "(arg: KeyboardEvent | React.KeyboardEvent) => boolean", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "hideOnInteractOutside": { + "defaultValue": { + "value": true + }, + "description": "Determines if the dialog should hide when the user clicks or focuses on an\nelement outside the dialog.\n\nThis prop can be either a boolean or a function that takes an event as an\nargument and returns a boolean. The event object represents the event that\ntriggered the action, which could be a native event or a React synthetic\nevent of various types.\n\nLive examples:\n- [Selection Popover](https://ariakit.org/examples/popover-selection)", + "name": "hideOnInteractOutside", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "BooleanOrCallback>", + "value": [ + { + "value": "false" + }, + { + "value": "true" + }, + { + "value": "(arg: Event | SyntheticEvent) => boolean", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "initialFocus": { + "defaultValue": null, + "description": "Specifies the element that will receive focus when the dialog is first\nopened. It can be an `HTMLElement` or a `React.RefObject` with an\n`HTMLElement`.\n\nIf\n[`autoFocusOnShow`](https://ariakit.org/reference/dialog#autofocusonshow)\nis set to `false`, this prop will have no effect. If left unset, the dialog\nwill attempt to determine the initial focus element in the following order:\n1. A [Focusable](https://ariakit.org/components/focusable) element with an\n [`autoFocus`](https://ariakit.org/reference/focusable#autofocus) prop.\n2. The first tabbable element inside the dialog.\n3. The first focusable element inside the dialog.\n4. The dialog element itself.", + "name": "initialFocus", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "HTMLElement | RefObject", + "value": [ + { + "value": "HTMLElement", + "description": "Any HTML element. Some elements directly implement this interface, while others implement it via an interface that inherits it.", + "fullComment": "Any HTML element. Some elements directly implement this interface, while others implement it via an interface that inherits it.", + "tags": {} + }, + { + "value": "RefObject", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "modal": { + "defaultValue": { + "value": "true" + }, + "description": "Determines whether the dialog is modal. Modal dialogs have distinct states\nand behaviors:\n- The [`portal`](https://ariakit.org/reference/dialog#portal) and\n [`preventBodyScroll`](https://ariakit.org/reference/dialog#preventbodyscroll)\n props are set to `true`. They can still be manually set to `false`.\n- When using the [`Heading`](https://ariakit.org/reference/heading) or\n [`DialogHeading`](https://ariakit.org/reference/dialog-heading)\n components within the dialog, their level will be reset so they start\n with `h1`.\n- A visually hidden dismiss button will be rendered if the\n [`DialogDismiss`](https://ariakit.org/reference/dialog-dismiss) component\n hasn't been used. This allows screen reader users to close the dialog.\n- When the dialog is open, element tree outside it will be inert.\n\nLive examples:\n- [Combobox with Tabs](https://ariakit.org/examples/combobox-tabs)\n- [Dialog with details &\n summary](https://ariakit.org/examples/dialog-details)\n- [Form with Select](https://ariakit.org/examples/form-select)\n- [Context menu](https://ariakit.org/examples/menu-context-menu)\n- [Responsive Popover](https://ariakit.org/examples/popover-responsive)", + "name": "modal", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "onClose": { + "defaultValue": null, + "description": "This is an event handler prop triggered when the dialog's `close` event is\ndispatched. The `close` event is similar to the native dialog\n[`close`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLDialogElement/close_event)\nevent. The only difference is that this event can be canceled with\n`event.preventDefault()`, which will prevent the dialog from hiding.\n\nIt's important to note that this event only fires when the dialog store's\n[`open`](https://ariakit.org/reference/use-dialog-store#open) state is set\nto `false`. If the controlled\n[`open`](https://ariakit.org/reference/dialog#open) prop value changes, or\nif the dialog's visibility is altered in any other way (such as unmounting\nthe dialog without adjusting the open state), this event won't be\ntriggered.\n\nLive examples:\n- [Dialog with scrollable\n backdrop](https://ariakit.org/examples/dialog-backdrop-scrollable)\n- [Dialog with details &\n summary](https://ariakit.org/examples/dialog-details)\n- [Warning on Dialog\n hide](https://ariakit.org/examples/dialog-hide-warning)\n- [Dialog with Menu](https://ariakit.org/examples/dialog-menu)", + "name": "onClose", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "(event: Event) => void" + } + }, + "onFocusVisible": { + "defaultValue": null, + "description": "Custom event handler invoked when the element gains focus through keyboard\ninteraction or a key press occurs while the element is in focus. This is\nthe programmatic equivalent of the\n[`data-focus-visible`](https://ariakit.org/guide/styling#data-focus-visible)\nattribute.\n\n**Note**: For this prop to work, the\n[`focusable`](https://ariakit.org/reference/command#focusable) prop must be\nset to `true`, if it's not set by default.\n\nLive examples:\n- [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)\n- [Custom Checkbox](https://ariakit.org/examples/checkbox-custom)", + "name": "onFocusVisible", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/focusable/focusable.d.ts", + "name": "FocusableOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/focusable/focusable.d.ts", + "name": "FocusableOptions" + } + ], + "required": false, + "type": { + "name": "BivariantCallback<(event: SyntheticEvent) => void>" + } + }, + "open": { + "defaultValue": null, + "description": "Controls the open state of the dialog. This is similar to the\n[`open`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLDialogElement/open)\nattribute on native dialog elements.\n\nLive examples:\n- [Dialog with scrollable\n backdrop](https://ariakit.org/examples/dialog-backdrop-scrollable)\n- [Dialog with details &\n summary](https://ariakit.org/examples/dialog-details)\n- [Warning on Dialog\n hide](https://ariakit.org/examples/dialog-hide-warning)\n- [Dialog with Menu](https://ariakit.org/examples/dialog-menu)", + "name": "open", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "portal": { + "defaultValue": { + "value": "true" + }, + "description": "Determines whether the element should be rendered as a React Portal.\n\nLive examples:\n- [Combobox with integrated\n filter](https://ariakit.org/examples/combobox-filtering-integrated)\n- [Dialog with Menu](https://ariakit.org/examples/dialog-menu)\n- [Hovercard with keyboard\n support](https://ariakit.org/examples/hovercard-disclosure)\n- [Menubar](https://ariakit.org/components/menubar)\n- [Standalone Popover](https://ariakit.org/examples/popover-standalone)\n- [Animated Select](https://ariakit.org/examples/select-animated)", + "name": "portal", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "portalElement": { + "defaultValue": null, + "description": "An HTML element or a memoized callback function that returns an HTML\nelement to be used as the portal element. By default, the portal element\nwill be a `div` element appended to the `document.body`.\n\nLive examples:\n- [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)\n@example ```jsx\nconst [portal, setPortal] = useState(null);\n\n\n
\n```\n@example ```jsx\nconst getPortalElement = useCallback(() => {\n const div = document.createElement(\"div\");\n const portalRoot = document.getElementById(\"portal-root\");\n portalRoot.appendChild(div);\n return div;\n}, []);\n\n\n```", + "name": "portalElement", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "HTMLElement | ((element: HTMLElement) => HTMLElement)", + "value": [ + { + "value": "HTMLElement", + "description": "Any HTML element. Some elements directly implement this interface, while others implement it via an interface that inherits it.", + "fullComment": "Any HTML element. Some elements directly implement this interface, while others implement it via an interface that inherits it.", + "tags": {} + }, + { + "value": "(element: HTMLElement) => HTMLElement", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "portalRef": { + "defaultValue": null, + "description": "`portalRef` is similar to `ref` but is scoped to the portal node. It's\nuseful when you need to be informed when the portal element is appended to\nthe DOM or removed from the DOM.\n\nLive examples:\n- [Form with Select](https://ariakit.org/examples/form-select)\n@example ```jsx\nconst [portalElement, setPortalElement] = useState(null);\n\n\n```", + "name": "portalRef", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "RefCallback | MutableRefObject", + "value": [ + { + "value": "RefCallback", + "description": "", + "fullComment": "", + "tags": {} + }, + { + "value": "MutableRefObject", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "preserveTabOrder": { + "defaultValue": { + "value": "false" + }, + "description": "When enabled, `preserveTabOrder` will keep the DOM element's tab order the\nsame as the order in which the underlying\n[`Portal`](https://ariakit.org/reference/portal) component was mounted in\nthe React tree.\n\nIf the\n[`preserveTabOrderAnchor`](https://ariakit.org/reference/portal#preservetaborderanchor)\nprop is provided, the tab order will be preserved relative to that element.", + "name": "preserveTabOrder", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "preserveTabOrderAnchor": { + "defaultValue": null, + "description": "An anchor element for maintaining the tab order when\n[`preserveTabOrder`](https://ariakit.org/reference/portal#preservetaborder)\nprop is enabled. The tab order will be kept relative to this element.\n\nBy default, the tab order is kept relative to the original location in the\nReact tree where the underlying\n[`Portal`](https://ariakit.org/reference/portal) component was mounted.\n@example ```jsx {18-20}\nconst [anchor, setAnchor] = useState(null);\n\n\n\n\n// Rendered at the end of the document.\n\n \n\n\n// Rendered at the end of the document, but the tab order is preserved.\n\n \n\n\n// Rendered at the end of the document, but the tab order is preserved\n// relative to the anchor element.\n\n \n\n\n\n```", + "name": "preserveTabOrderAnchor", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + } + ], + "required": false, + "type": { + "name": "Element" + } + }, + "preventBodyScroll": { + "defaultValue": null, + "description": "Determines whether the body scrolling will be prevented when the dialog is\nshown. This is automatically set to `true` when the dialog is\n[`modal`](https://ariakit.org/reference/dialog#modal). You can disable this\nprop if you want to implement your own logic.", + "name": "preventBodyScroll", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "render": { + "defaultValue": null, + "description": "Allows the component to be rendered as a different HTML element or React\ncomponent. The value can be a React element or a function that takes in the\noriginal component props and gives back a React element with the props\nmerged.\n\nCheck out the [Composition](https://ariakit.org/guide/composition) guide\nfor more details.", + "name": "render", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/utils/types.d.ts", + "name": "Options" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/utils/types.d.ts", + "name": "Options" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "ReactElement> | RenderProp & { ref?: Ref; }>", + "value": [ + { + "value": "ReactElement>", + "description": "", + "fullComment": "", + "tags": {} + }, + { + "value": "RenderProp & { ref?: Ref; }>", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "store": { + "defaultValue": null, + "description": "Object returned by the\n[`useDialogStore`](https://ariakit.org/reference/use-dialog-store) hook. If\nnot provided, the closest\n[`DialogProvider`](https://ariakit.org/reference/dialog-provider)\ncomponent's context will be used. Otherwise, an internal store will be\ncreated.", + "name": "store", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "DialogStore" + } + }, + "unmountOnHide": { + "defaultValue": { + "value": "false" + }, + "description": "When set to `true`, the content element will be unmounted and removed from\nthe DOM when it's hidden.\n\nLive examples:\n- [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)\n- [Combobox with integrated\n filter](https://ariakit.org/examples/combobox-filtering-integrated)\n- [Textarea with inline\n Combobox](https://ariakit.org/examples/combobox-textarea)\n- [Standalone Popover](https://ariakit.org/examples/popover-standalone)\n- [Animated Select](https://ariakit.org/examples/select-animated)\n- [Multi-Select](https://ariakit.org/examples/select-multiple)", + "name": "unmountOnHide", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-content.d.ts", + "name": "DisclosureContentOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-content.d.ts", + "name": "DisclosureContentOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "unstable_treeSnapshotKey": { + "defaultValue": null, + "description": "@private", + "name": "unstable_treeSnapshotKey", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "string | number | boolean", + "value": [ + { + "value": "string" + }, + { + "value": "number" + }, + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "wrapElement": { + "defaultValue": null, + "description": "", + "name": "wrapElement", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/utils/types.d.ts", + "name": "Options" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/utils/types.d.ts", + "name": "Options" + } + ], + "required": false, + "type": { + "name": "WrapElement" + } + } + } + } +} \ No newline at end of file diff --git a/lib/src/components/Drawer/index.tsx b/lib/src/components/Drawer/index.tsx new file mode 100644 index 0000000000..520c9119af --- /dev/null +++ b/lib/src/components/Drawer/index.tsx @@ -0,0 +1,107 @@ +import React from 'react' +import * as Ariakit from '@ariakit/react' + +import { Close } from './Close' +import { Content } from './Content' +import { Footer } from './Footer' +import { Title } from './Title' +import * as S from './styles' +import { AssetDrawerComponent } from './AssetDrawer' +import { Header } from './AssetDrawer/Header' + +import { As, CreateWuiProps, forwardRef } from '@/System' + +type Placement = 'top' | 'right' | 'bottom' | 'left' +type Size = 'sm' | 'md' | 'lg' | 'auto' | string + +export interface DrawerOptions extends Ariakit.DialogOptions<'div'> { + placement?: Placement + size?: Size + withBackdrop?: boolean + withCloseButton?: boolean +} + +export type DrawerProps = CreateWuiProps<'div', DrawerOptions> + +const DrawerComponent = forwardRef<'div', DrawerProps>( + ( + { + children, + hideOnInteractOutside = true, + placement = 'right', + size = 'lg', + store, + withBackdrop = false, + withCloseButton = true, + ...rest + }, + ref + ) => { + return ( + : false + } + hideOnInteractOutside={hideOnInteractOutside} + modal={withBackdrop} + ref={ref} + render={} + store={store} + {...(rest as Ariakit.DialogProps<'div'>)} + > + <> + {withCloseButton && } + {children} + + + ) + } +) + +export type UseDrawer = Ariakit.DialogStore +export type UseDrawerProps = Ariakit.DialogStoreProps +export type UseDrawerState = Ariakit.DialogStoreState + +export function useDrawer(options: UseDrawerProps = {}): UseDrawer { + const dialog = Ariakit.useDialogStore({ animated: true, ...options }) + + return dialog +} + +export interface DrawerBackdropOptions { + hideOnInteractOutside?: boolean +} + +/** + * @name Drawer.Backdrop + */ +export const DrawerBackdrop: React.FC = ({ + hideOnInteractOutside = true, + ...props +}) => { + return +} + +type TriggerProps = { as?: As; children: React.ReactNode; store: Ariakit.DialogStore } + +export const Trigger = forwardRef<'button', TriggerProps>(({ as: As, store, ...rest }, ref) => { + return ( + : undefined} + store={store} + {...rest} + /> + ) +}) + +export const Drawer = Object.assign(DrawerComponent, { + Trigger, + Backdrop: DrawerBackdrop, + Close, + Title, + Content, + Footer, +}) + +export const AssetDrawer = Object.assign(AssetDrawerComponent, { Trigger, Header }) diff --git a/lib/src/components/Drawer/styles.ts b/lib/src/components/Drawer/styles.ts new file mode 100644 index 0000000000..2c6abd5c47 --- /dev/null +++ b/lib/src/components/Drawer/styles.ts @@ -0,0 +1,124 @@ +import styled, { css, system, th } from '@xstyled/styled-components' +import * as Ariakit from '@ariakit/react' + +import { DrawerOptions } from '.' + +import { CloseButton as WUICloseButton } from '@/CloseButton' + +const getPlacementStyle = (placement: DrawerOptions['placement']) => { + switch (placement) { + case 'top': + return { + top: '0 !important', + right: 0, + left: 0, + transform: 'translateY(-100%)', + } + case 'right': + return { + top: '0 !important', + right: 0, + bottom: 0, + transform: 'translateX(100%)', + } + case 'bottom': + return { + right: 0, + bottom: 0, + left: 0, + transform: 'translateY(100%)', + } + case 'left': + return { + top: '0 !important', + bottom: 0, + left: 0, + transform: 'translateX(-100%)', + } + } +} + +const SIZES = ['sm', 'md', 'lg'] + +const getSizeStyle = (size: DrawerOptions['size'], placement: DrawerOptions['placement']) => { + switch (placement) { + case 'top': + case 'bottom': + if (SIZES.includes(size)) { + return th(`drawers.sizes.vertical.${size}`) + } + return { + height: size, + } + case 'right': + case 'left': + if (SIZES.includes(size)) { + return th(`drawers.sizes.horizontal.${size}`) + } + return { + width: size, + } + } +} + +export const Drawer = styled.divBox>( + ({ placement, size }) => css` + ${th('cards.default')}; + ${th('drawers.default')}; + ${getPlacementStyle(placement)} + ${getSizeStyle(size, placement)} + position: fixed; + display: flex; + flex-direction: column; + overflow: auto; + opacity: 0; + transition: medium; + max-width: 100%; + + &[data-enter] { + opacity: 1; + transform: translate(0, 0); + } + ` +) + +export const Backdrop = styled.div.withConfig({ + shouldForwardProp: prop => !['hideOnInteractOutside'].includes(prop), +})<{ hideOnInteractOutside: Ariakit.DialogProps['hideOnInteractOutside'] }>( + ({ hideOnInteractOutside }) => css` + ${th('drawers.backdrop')}; + position: fixed; + top: 0; + right: 0; + left: 0; + bottom: 0; + opacity: 0; + transition: opacity 150ms ease-in-out; + ${system}; + + ${hideOnInteractOutside && + css` + cursor: pointer; + `} + + &[data-enter] { + opacity: 1; + } + ` +) + +export const Title = styled.divBox` + ${th('drawers.title')}; +` + +export const Content = styled.divBox` + ${th('drawers.content')}; +` + +export const CloseButton = styled(WUICloseButton)` + ${th('drawers.closeButton')}; +` + +export const Footer = styled.divBox` + ${th('drawers.footer')}; +` diff --git a/lib/src/components/Drawer/tests/index.test.tsx b/lib/src/components/Drawer/tests/index.test.tsx new file mode 100644 index 0000000000..6559b43df1 --- /dev/null +++ b/lib/src/components/Drawer/tests/index.test.tsx @@ -0,0 +1,103 @@ +import React from 'react' +import { act, screen } from '@testing-library/react' + +import { AssetDrawer, Drawer, useDrawer } from '..' +import { render } from '../../../../tests' + +describe('', () => { + it('should render correctly', async () => { + const Test = () => { + const drawer = useDrawer() + + return ( + <> + open + + test + + + ) + } + + const { user } = render() + + expect(screen.queryByRole('dialog')).toBeNull() + + await act(() => user.click(screen.getByText('open'))) + + expect(screen.queryByRole('dialog')).toHaveTextContent('test') + }) + + it('should render its size & placement correctly', async () => { + const Test = () => { + const drawer = useDrawer() + + return ( + <> + open + + test + + + ) + } + + const { user } = render() + + await act(() => user.click(screen.getByText('open'))) + + expect(screen.queryByRole('dialog')).toHaveStyleRule('height', '50%') + }) + + it('should render "as" correctly', async () => { + const Test = () => { + const drawer = useDrawer() + const onClick = jest.fn() + + return ( + <> + + open + + + test + + + ) + } + + const { user } = render() + + expect(screen.queryByRole('dialog')).toBeNull() + + await act(() => user.click(screen.getByText('open'))) + + expect(screen.queryByRole('dialog')).toHaveTextContent('test') + }) + + it('should render correctly AssetDrawer', async () => { + const Test = () => { + const drawer = useDrawer() + + return ( + <> + open + + + test + + + ) + } + + const { user } = render() + + expect(screen.queryByRole('dialog')).toBeNull() + + await act(() => user.click(screen.getByText('open'))) + + expect(screen.queryByRole('dialog')).toHaveTextContent('test') + + expect(screen.queryByRole('dialog')).toHaveTextContent('title') + }) +}) diff --git a/lib/src/components/Drawer/theme.ts b/lib/src/components/Drawer/theme.ts new file mode 100644 index 0000000000..8a8a2a6c8b --- /dev/null +++ b/lib/src/components/Drawer/theme.ts @@ -0,0 +1,56 @@ +import { CSSObject } from '@xstyled/styled-components' + +import { ThemeValues } from '@/theme' + +type Size = 'sm' | 'md' | 'lg' + +export type ThemeDrawers = { + backdrop: CSSObject + closeButton: CSSObject + content: CSSObject + default: CSSObject + footer: CSSObject + sizes: { + horizontal: Record> + vertical: Record> + } + title: CSSObject +} + +export const getDrawers = (theme: ThemeValues): ThemeDrawers => { + const { colors, space, toRem } = theme + return { + backdrop: { + backgroundColor: colors.overlay, + zIndex: 999, + }, + default: { + zIndex: 999, + }, + closeButton: {}, + title: { + margin: 0, + backgroundColor: colors['neutral-10'], + padding: `${space['xl']} ${space['5xl']} ${space['xl']} ${space['xl']}`, + }, + content: { + padding: `${space['xl']}`, + }, + footer: { + backgroundColor: colors['neutral-10'], + padding: `${space['xl']}`, + }, + sizes: { + horizontal: { + sm: { width: toRem(400) }, + md: { width: toRem(550) }, + lg: { width: toRem(680) }, + }, + vertical: { + sm: { height: toRem(400) }, + md: { height: toRem(550) }, + lg: { height: toRem(680) }, + }, + }, + } +} diff --git a/packages/DropdownMenu/src/Arrow.styled.ts b/lib/src/components/DropdownMenu/Arrow.styled.ts similarity index 100% rename from packages/DropdownMenu/src/Arrow.styled.ts rename to lib/src/components/DropdownMenu/Arrow.styled.ts diff --git a/packages/DropdownMenu/src/Arrow.tsx b/lib/src/components/DropdownMenu/Arrow.tsx similarity index 94% rename from packages/DropdownMenu/src/Arrow.tsx rename to lib/src/components/DropdownMenu/Arrow.tsx index 69c7debe3f..c988d3dd67 100644 --- a/packages/DropdownMenu/src/Arrow.tsx +++ b/lib/src/components/DropdownMenu/Arrow.tsx @@ -1,9 +1,10 @@ import React from 'react' import * as Ariakit from '@ariakit/react' -import { CreateWuiProps, forwardRef } from '@welcome-ui/system' import * as S from './Arrow.styled' +import { CreateWuiProps, forwardRef } from '@/System' + const transformMap: Record = { top: 'rotateZ(180deg)', right: 'rotateZ(-90deg)', diff --git a/packages/DropdownMenu/src/Item.styled.ts b/lib/src/components/DropdownMenu/Item.styled.ts similarity index 100% rename from packages/DropdownMenu/src/Item.styled.ts rename to lib/src/components/DropdownMenu/Item.styled.ts diff --git a/lib/src/components/DropdownMenu/Item.tsx b/lib/src/components/DropdownMenu/Item.tsx new file mode 100644 index 0000000000..9e462a7f2e --- /dev/null +++ b/lib/src/components/DropdownMenu/Item.tsx @@ -0,0 +1,14 @@ +import React from 'react' +import * as Ariakit from '@ariakit/react' + +import * as S from './Item.styled' + +import { CreateWuiProps, forwardRef } from '@/System' + +export type ItemProps = CreateWuiProps<'button', Omit> + +export const Item = forwardRef<'button', ItemProps>(({ as, ...rest }, ref) => { + return } /> +}) + +Item.displayName = 'Item' diff --git a/packages/DropdownMenu/src/Separator.styled.ts b/lib/src/components/DropdownMenu/Separator.styled.ts similarity index 100% rename from packages/DropdownMenu/src/Separator.styled.ts rename to lib/src/components/DropdownMenu/Separator.styled.ts diff --git a/packages/DropdownMenu/src/Separator.tsx b/lib/src/components/DropdownMenu/Separator.tsx similarity index 84% rename from packages/DropdownMenu/src/Separator.tsx rename to lib/src/components/DropdownMenu/Separator.tsx index 3eb5b50a6e..3bf722ca02 100644 --- a/packages/DropdownMenu/src/Separator.tsx +++ b/lib/src/components/DropdownMenu/Separator.tsx @@ -1,9 +1,10 @@ import React from 'react' import * as Ariakit from '@ariakit/react' -import { CreateWuiProps, forwardRef } from '@welcome-ui/system' import * as S from './Separator.styled' +import { CreateWuiProps, forwardRef } from '@/System' + export type SeparatorProps = CreateWuiProps<'div', Ariakit.MenuSeparatorProps> export const Separator = forwardRef<'div', SeparatorProps>((props, ref) => { diff --git a/packages/DropdownMenu/docs/examples/arrow.tsx b/lib/src/components/DropdownMenu/docs/examples/arrow.tsx similarity index 86% rename from packages/DropdownMenu/docs/examples/arrow.tsx rename to lib/src/components/DropdownMenu/docs/examples/arrow.tsx index 5e637eb3b2..2cd32bb132 100644 --- a/packages/DropdownMenu/docs/examples/arrow.tsx +++ b/lib/src/components/DropdownMenu/docs/examples/arrow.tsx @@ -1,6 +1,7 @@ import * as React from 'react' -import { DropdownMenu, useDropdownMenu } from '@welcome-ui/dropdown-menu' -import { Button } from '@welcome-ui/button' + +import { DropdownMenu, useDropdownMenu } from '@/DropdownMenu' +import { Button } from '@/Button' const Example = () => { const dropdownMenu = useDropdownMenu() diff --git a/lib/src/components/DropdownMenu/docs/examples/example.tsx b/lib/src/components/DropdownMenu/docs/examples/example.tsx new file mode 100644 index 0000000000..34688864ab --- /dev/null +++ b/lib/src/components/DropdownMenu/docs/examples/example.tsx @@ -0,0 +1,43 @@ +import * as React from 'react' + +import { AddIcon, AttachmentIcon, DownIcon, TrashIcon, UpIcon } from '@/Icons' +import { Box } from '@/Box' +import { Button } from '@/Button' +import { ButtonGroup } from '@/ButtonGroup' +import { DropdownMenu, useDropdownMenu } from '@/DropdownMenu' + +const Example = () => { + const dropdownMenu = useDropdownMenu({ placement: 'bottom-end' }) + + const isOpen = dropdownMenu.useState('open') + + const handleClick = () => { + // your code + } + + return ( + + + + + {isOpen ? : } + + + + + + Second Action + + + + Third Action + + + + ) +} + +export default Example diff --git a/packages/DropdownMenu/docs/examples/open.tsx b/lib/src/components/DropdownMenu/docs/examples/open.tsx similarity index 85% rename from packages/DropdownMenu/docs/examples/open.tsx rename to lib/src/components/DropdownMenu/docs/examples/open.tsx index a466dd9e79..a3cbc55328 100644 --- a/packages/DropdownMenu/docs/examples/open.tsx +++ b/lib/src/components/DropdownMenu/docs/examples/open.tsx @@ -1,6 +1,7 @@ import * as React from 'react' -import { DropdownMenu, useDropdownMenu } from '@welcome-ui/dropdown-menu' -import { Button } from '@welcome-ui/button' + +import { DropdownMenu, useDropdownMenu } from '@/DropdownMenu' +import { Button } from '@/Button' const Example = () => { const dropdownMenu = useDropdownMenu() diff --git a/lib/src/components/DropdownMenu/docs/examples/overview.tsx b/lib/src/components/DropdownMenu/docs/examples/overview.tsx new file mode 100644 index 0000000000..d8a65d87ae --- /dev/null +++ b/lib/src/components/DropdownMenu/docs/examples/overview.tsx @@ -0,0 +1,34 @@ +import * as React from 'react' + +import { DropdownMenu, useDropdownMenu } from '@/DropdownMenu' +import { Button } from '@/Button' + +const Example = () => { + const dropdownMenu = useDropdownMenu() + + const handleClick = () => { + // your code + } + + return ( + <> + + Dropdown Menu + + + + Facebook + + + Instagram + + + + Github + + + + ) +} + +export default Example diff --git a/packages/DropdownMenu/docs/index.mdx b/lib/src/components/DropdownMenu/docs/index.mdx similarity index 100% rename from packages/DropdownMenu/docs/index.mdx rename to lib/src/components/DropdownMenu/docs/index.mdx diff --git a/lib/src/components/DropdownMenu/docs/properties.json b/lib/src/components/DropdownMenu/docs/properties.json new file mode 100644 index 0000000000..d5b268068b --- /dev/null +++ b/lib/src/components/DropdownMenu/docs/properties.json @@ -0,0 +1,1872 @@ +{ + "useDropdownMenu": { + "props": { + "animated": { + "defaultValue": null, + "description": "Determines whether the content should animate when it is shown or hidden.\n- If `true`, the `animating` state will be `true` when the content is shown\n or hidden and it will wait for a CSS animation/transition to end before\n becoming `false`.\n- If it's set to a number, the `animating` state will be `true` when the\n content is shown or hidden and it will wait for the number of\n milliseconds to pass before becoming `false`.\n@deprecated Manually setting the `animated` prop is no longer necessary.\nThis will be removed in a future release.", + "name": "animated", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "number | boolean", + "value": [ + { + "value": "number" + }, + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "combobox": { + "defaultValue": null, + "description": "A reference to a [combobox\nstore](https://ariakit.org/reference/use-combobox-store). It's\nautomatically set when composing [Menu with\nCombobox](https://ariakit.org/examples/menu-combobox).", + "name": "combobox", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/menu/menu-store.d.ts", + "name": "MenuStoreOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/menu/menu-store.d.ts", + "name": "MenuStoreOptions" + } + ], + "required": false, + "type": { + "name": "ComboboxStore" + } + }, + "defaultActiveId": { + "defaultValue": null, + "description": "The composite item id that should be active by default when the composite\nwidget is rendered. If `null`, the composite element itself will have focus\nand users will be able to navigate to it using arrow keys. If `undefined`,\nthe first enabled item will be focused.", + "name": "defaultActiveId", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/core/cjs/composite/composite-store.d.ts", + "name": "CompositeStoreOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/core/cjs/composite/composite-store.d.ts", + "name": "CompositeStoreOptions" + } + ], + "required": false, + "type": { + "name": "string" + } + }, + "defaultItems": { + "defaultValue": { + "value": "[]" + }, + "description": "The defaut value for the\n[`items`](https://ariakit.org/reference/collection-provider#items) state.", + "name": "defaultItems", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/core/cjs/collection/collection-store.d.ts", + "name": "CollectionStoreOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/core/cjs/collection/collection-store.d.ts", + "name": "CollectionStoreOptions" + } + ], + "required": false, + "type": { + "name": "CompositeStoreItem[]" + } + }, + "defaultOpen": { + "defaultValue": { + "value": "false" + }, + "description": "Whether the content should be visible by default.", + "name": "defaultOpen", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "defaultValues": { + "defaultValue": { + "value": "{}" + }, + "description": "The default values for the\n[`values`](https://ariakit.org/reference/menu-provider#values) state.\n\nLive examples:\n- [MenuItemCheckbox](https://ariakit.org/examples/menu-item-checkbox)\n- [MenuItemRadio](https://ariakit.org/examples/menu-item-radio)", + "name": "defaultValues", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/core/cjs/menu/menu-store.d.ts", + "name": "MenuStoreOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/core/cjs/menu/menu-store.d.ts", + "name": "MenuStoreOptions" + } + ], + "required": false, + "type": { + "name": "MenuStoreValues" + } + }, + "disclosure": { + "defaultValue": null, + "description": "A reference to another disclosure store that controls another disclosure\ncomponent to keep them in sync. Element states like `contentElement` and\n`disclosureElement` won't be synced. For that, use the\n[`store`](https://ariakit.org/reference/disclosure-provider#store) prop\ninstead.\n\nLive examples:\n- [Command Menu](https://ariakit.org/examples/dialog-combobox-command-menu)", + "name": "disclosure", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + } + ], + "required": false, + "type": { + "name": "DisclosureStore" + } + }, + "menubar": { + "defaultValue": null, + "description": "A reference to a [menubar\nstore](https://ariakit.org/reference/use-menubar-store). It's automatically\nset when rendering menus inside a\n[`Menubar`](https://ariakit.org/reference/menubar) in the React tree.\n\nLive examples:\n- [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)", + "name": "menubar", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/menu/menu-store.d.ts", + "name": "MenuStoreOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/menu/menu-store.d.ts", + "name": "MenuStoreOptions" + } + ], + "required": false, + "type": { + "name": "MenubarStore" + } + }, + "parent": { + "defaultValue": null, + "description": "A reference to a parent menu store. It's automatically set when nesting\nmenus in the React tree. You should manually set this if menus aren't\nnested in the React tree.\n\nLive examples:\n- [Menubar](https://ariakit.org/components/menubar)\n- [Submenu](https://ariakit.org/examples/menu-nested)\n- [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)", + "name": "parent", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/menu/menu-store.d.ts", + "name": "MenuStoreOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/menu/menu-store.d.ts", + "name": "MenuStoreOptions" + } + ], + "required": false, + "type": { + "name": "MenuStore" + } + }, + "popover": { + "defaultValue": null, + "description": "A reference to another popover store that's controlling another popover to\nkeep them in sync.", + "name": "popover", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/core/cjs/popover/popover-store.d.ts", + "name": "PopoverStoreOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/core/cjs/popover/popover-store.d.ts", + "name": "PopoverStoreOptions" + } + ], + "required": false, + "type": { + "name": "PopoverStore" + } + }, + "setActiveId": { + "defaultValue": null, + "description": "A callback that gets called when the\n[`activeId`](https://ariakit.org/reference/composite-provider#activeid)\nstate changes.", + "name": "setActiveId", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/composite/composite-store.d.ts", + "name": "CompositeStoreOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/composite/composite-store.d.ts", + "name": "CompositeStoreOptions" + } + ], + "required": false, + "type": { + "name": "(activeId: string) => void" + } + }, + "setItems": { + "defaultValue": null, + "description": "A callback that gets called when the\n[`items`](https://ariakit.org/reference/collection-provider#items) state\nchanges.\n@example const [items, setItems] = useState([]);\nconst collection = useCollectionStore({ items, setItems });", + "name": "setItems", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/collection/collection-store.d.ts", + "name": "CollectionStoreOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/collection/collection-store.d.ts", + "name": "CollectionStoreOptions" + } + ], + "required": false, + "type": { + "name": "BivariantCallback<(items: CompositeStoreItem[]) => void>" + } + }, + "setMounted": { + "defaultValue": null, + "description": "A callback that gets called when the `mounted` state changes.\n@example const [mounted, setMounted] = useState(false);\nconst disclosure = useDisclosureStore({ setMounted });", + "name": "setMounted", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + } + ], + "required": false, + "type": { + "name": "(mounted: boolean) => void" + } + }, + "setOpen": { + "defaultValue": null, + "description": "A callback that gets called when the\n[`open`](https://ariakit.org/reference/disclosure-provider#open) state\nchanges.\n@example const [open, setOpen] = useState(false);\nconst disclosure = useDisclosureStore({ open, setOpen });", + "name": "setOpen", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-store.d.ts", + "name": "DisclosureStoreOptions" + } + ], + "required": false, + "type": { + "name": "(open: boolean) => void" + } + }, + "setValues": { + "defaultValue": null, + "description": "A callback that gets called when the\n[`values`](https://ariakit.org/reference/menu-provider#values) state\nchanges.\n\nLive examples:\n- [MenuItemCheckbox](https://ariakit.org/examples/menu-item-checkbox)\n- [Submenu with\n Combobox](https://ariakit.org/examples/menu-nested-combobox)", + "name": "setValues", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/menu/menu-store.d.ts", + "name": "MenuStoreOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/menu/menu-store.d.ts", + "name": "MenuStoreOptions" + } + ], + "required": false, + "type": { + "name": "BivariantCallback<(values: MenuStoreValues) => void>" + } + } + } + }, + "DropdownMenu": { + "props": { + "accessibleWhenDisabled": { + "defaultValue": null, + "description": "Indicates whether the element should be focusable even when it is\n[`disabled`](https://ariakit.org/reference/focusable#disabled).\n\nThis is important when discoverability is a concern. For example:\n\n> A toolbar in an editor contains a set of special smart paste functions\nthat are disabled when the clipboard is empty or when the function is not\napplicable to the current content of the clipboard. It could be helpful to\nkeep the disabled buttons focusable if the ability to discover their\nfunctionality is primarily via their presence on the toolbar.\n\nLearn more on [Focusability of disabled\ncontrols](https://www.w3.org/WAI/ARIA/apg/practices/keyboard-interface/#focusabilityofdisabledcontrols).\n\nLive examples:\n- [Combobox with Tabs](https://ariakit.org/examples/combobox-tabs)", + "name": "accessibleWhenDisabled", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/focusable/focusable.d.ts", + "name": "FocusableOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/focusable/focusable.d.ts", + "name": "FocusableOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "alwaysVisible": { + "defaultValue": { + "value": "false" + }, + "description": "Determines whether the content element should remain visible even when the\n[`open`](https://ariakit.org/reference/disclosure-provider#open) state is\n`false`. If this prop is set to `true`, the `hidden` prop and the `display:\nnone` style will not be applied, unless explicitly set otherwise.\n\nThis prop is particularly useful when using third-party animation libraries\nsuch as Framer Motion or React Spring, where the element needs to be\nvisible for exit animations to work.\n\nLive examples:\n- [Dialog with Framer\n Motion](https://ariakit.org/examples/dialog-framer-motion)\n- [Menu with Framer\n Motion](https://ariakit.org/examples/menu-framer-motion)\n- [Tooltip with Framer\n Motion](https://ariakit.org/examples/tooltip-framer-motion)\n- [Dialog with details &\n summary](https://ariakit.org/examples/dialog-details)", + "name": "alwaysVisible", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-content.d.ts", + "name": "DisclosureContentOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-content.d.ts", + "name": "DisclosureContentOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "arrowPadding": { + "defaultValue": { + "value": "4" + }, + "description": "The minimum padding between the arrow and the popover corner.", + "name": "arrowPadding", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/popover/popover.d.ts", + "name": "PopoverOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/popover/popover.d.ts", + "name": "PopoverOptions" + } + ], + "required": false, + "type": { + "name": "number" + } + }, + "autoFocus": { + "defaultValue": { + "value": "false" + }, + "description": "Automatically focuses the element upon mounting, similar to the native\n`autoFocus` prop. This addresses an issue where the element with the native\n`autoFocus` attribute might receive focus before React effects are\nexecuted.\n\nThe `autoFocus` prop can also be used with\n[Focusable](https://ariakit.org/components/focusable) elements within a\n[Dialog](https://ariakit.org/components/dialog) component, establishing the\ninitial focus as the dialog opens.\n\n**Note**: For this prop to work, the\n[`focusable`](https://ariakit.org/reference/command#focusable) prop must be\nset to `true`, if it's not set by default.\n\nLive examples:\n- [Warning on Dialog\n hide](https://ariakit.org/examples/dialog-hide-warning)\n- [Dialog with React\n Router](https://ariakit.org/examples/dialog-react-router)\n- [Nested Dialog](https://ariakit.org/examples/dialog-nested)", + "name": "autoFocus", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/focusable/focusable.d.ts", + "name": "FocusableOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/focusable/focusable.d.ts", + "name": "FocusableOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "autoFocusOnHide": { + "defaultValue": { + "value": "true" + }, + "description": "Determines whether an element outside of the dialog will be focused when\nthe dialog is hidden if another element hasn't been focused in the action\nof hiding the dialog (for example, by clicking or tabbing into another\ntabbable element outside of the dialog).\n\nBy default, this is usually the disclosure element. The\n[`finalFocus`](https://ariakit.org/reference/dialog#finalfocus) prop can be\nused to define a different element to be focused.\n\nLive examples:\n- [Dialog with Next.js App\n Router](https://ariakit.org/examples/dialog-next-router)\n- [Sliding menu](https://ariakit.org/examples/menu-slide)", + "name": "autoFocusOnHide", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "BooleanOrCallback", + "value": [ + { + "value": "false" + }, + { + "value": "true" + }, + { + "value": "(arg: HTMLElement) => boolean", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "autoFocusOnShow": { + "defaultValue": { + "value": "true" + }, + "description": "Determines whether an element inside the dialog will receive focus when the\ndialog is shown. By default, this is usually the first tabbable element in\nthe dialog or the dialog itself. The\n[`initialFocus`](https://ariakit.org/reference/dialog#initialfocus) prop\ncan be used to set a different element to receive focus.\n\nLive examples:\n- [Warning on Dialog\n hide](https://ariakit.org/examples/dialog-hide-warning)\n- [Sliding Menu](https://ariakit.org/examples/menu-slide)\n- [Selection Popover](https://ariakit.org/examples/popover-selection)", + "name": "autoFocusOnShow", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "BooleanOrCallback", + "value": [ + { + "value": "false" + }, + { + "value": "true" + }, + { + "value": "(arg: HTMLElement) => boolean", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "backdrop": { + "defaultValue": null, + "description": "Determines whether there will be a backdrop behind the dialog. On modal\ndialogs, this is `true` by default. Besides a `boolean`, this prop can also\nbe a React component or JSX element that will be rendered as the backdrop.\n\n**Note**: If a custom component is used, it must [accept ref and spread all\nprops to its underlying DOM\nelement](https://ariakit.org/guide/composition#custom-components-must-be-open-for-extension),\nthe same way a native element would.\n\nLive examples:\n- [Animated Dialog](https://ariakit.org/examples/dialog-animated)\n- [Dialog with scrollable\n backdrop](https://ariakit.org/examples/dialog-backdrop-scrollable)\n- [Dialog with Framer\n Motion](https://ariakit.org/examples/dialog-framer-motion)\n- [Dialog with Menu](https://ariakit.org/examples/dialog-menu)\n- [Nested Dialog](https://ariakit.org/examples/dialog-nested)\n- [Dialog with Next.js App\n Router](https://ariakit.org/examples/dialog-next-router)\n@example ```jsx\n} />\n```", + "name": "backdrop", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean | ReactElement, HTMLDivElement>, \"key\" | keyof HTMLAttributes<...>> & { ...; }, string | JSXElementConstructor<...>> | ElementType<...>", + "value": [ + { + "value": "false" + }, + { + "value": "true" + }, + { + "value": "\"abbr\"" + }, + { + "value": "\"address\"" + }, + { + "value": "\"article\"" + }, + { + "value": "\"aside\"" + }, + { + "value": "\"b\"" + }, + { + "value": "\"bdi\"" + }, + { + "value": "\"bdo\"" + }, + { + "value": "\"big\"" + }, + { + "value": "\"caption\"" + }, + { + "value": "\"cite\"" + }, + { + "value": "\"code\"" + }, + { + "value": "\"dd\"" + }, + { + "value": "\"dfn\"" + }, + { + "value": "\"div\"" + }, + { + "value": "\"dt\"" + }, + { + "value": "\"em\"" + }, + { + "value": "\"figcaption\"" + }, + { + "value": "\"figure\"" + }, + { + "value": "\"footer\"" + }, + { + "value": "\"h1\"" + }, + { + "value": "\"h2\"" + }, + { + "value": "\"h3\"" + }, + { + "value": "\"h4\"" + }, + { + "value": "\"h5\"" + }, + { + "value": "\"h6\"" + }, + { + "value": "\"head\"" + }, + { + "value": "\"header\"" + }, + { + "value": "\"hgroup\"" + }, + { + "value": "\"i\"" + }, + { + "value": "\"kbd\"" + }, + { + "value": "\"keygen\"" + }, + { + "value": "\"main\"" + }, + { + "value": "\"mark\"" + }, + { + "value": "\"menu\"" + }, + { + "value": "\"menuitem\"" + }, + { + "value": "\"nav\"" + }, + { + "value": "\"noindex\"" + }, + { + "value": "\"noscript\"" + }, + { + "value": "\"p\"" + }, + { + "value": "\"picture\"" + }, + { + "value": "\"rp\"" + }, + { + "value": "\"rt\"" + }, + { + "value": "\"ruby\"" + }, + { + "value": "\"s\"" + }, + { + "value": "\"samp\"" + }, + { + "value": "\"section\"" + }, + { + "value": "\"small\"" + }, + { + "value": "\"span\"" + }, + { + "value": "\"strong\"" + }, + { + "value": "\"sub\"" + }, + { + "value": "\"summary\"" + }, + { + "value": "\"sup\"" + }, + { + "value": "\"u\"" + }, + { + "value": "\"var\"" + }, + { + "value": "\"wbr\"" + }, + { + "value": "\"webview\"" + }, + { + "value": "ReactElement, HTMLDivElement>, \"key\" | keyof HTMLAttributes> & { ...; }, string | JSXElementConstructor<...>>", + "description": "", + "fullComment": "", + "tags": {} + }, + { + "value": "ComponentClass, HTMLDivElement>, \"key\" | keyof HTMLAttributes> & { ...; }, any>", + "description": "", + "fullComment": "", + "tags": {} + }, + { + "value": "FunctionComponent, HTMLDivElement>, \"key\" | keyof HTMLAttributes> & { ...; }>", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "composite": { + "defaultValue": { + "value": "true" + }, + "description": "Determines if the component should act as a composite widget. This prop\nneeds to be set to `false` when merging various composite widgets where\nonly one should function in that manner.\n\nIf disabled, this component will stop managing focus and keyboard\nnavigation for its items and itself. Additionally, composite ARIA\nattributes won't be applied. These responsibilities should be taken over by\nanother composite component.\n\n**Note**: In most cases, this prop doesn't need to be set manually. For\nexample, when composing [Menu with\nCombobox](https://ariakit.org/examples/menu-combobox) or [Select with\nCombobox](https://ariakit.org/examples/select-combobox), this prop will be\nset to `false` automatically on the\n[`Menu`](https://ariakit.org/reference/menu) and\n[`SelectPopover`](https://ariakit.org/reference/select-popover) components\nso the [`Combobox`](https://ariakit.org/reference/combobox) component can\ntake over the composite widget responsibilities.\n\nLive examples:\n- [Menu with Combobox](https://ariakit.org/examples/menu-combobox)\n- [Select with Combobox](https://ariakit.org/examples/select-combobox)", + "name": "composite", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/composite/composite.d.ts", + "name": "CompositeOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/composite/composite.d.ts", + "name": "CompositeOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "disablePointerEventsOnApproach": { + "defaultValue": { + "value": "true" + }, + "description": "Determines if the pointer events outside of the popover and its anchor\nelement should be disabled during _hover intent_, that is, when the mouse\nis moving toward the popover.\n\nThis is required as these external events may trigger focus on other\nelements and close the popover while the user is attempting to hover over\nit.\n\nThis can be either a boolean or a callback receiving the mouse event\nhappening during hover intent. The callback should return a boolean.", + "name": "disablePointerEventsOnApproach", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/hovercard/hovercard.d.ts", + "name": "HovercardOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/hovercard/hovercard.d.ts", + "name": "HovercardOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "BooleanOrCallback", + "value": [ + { + "value": "false" + }, + { + "value": "true" + }, + { + "value": "(arg: MouseEvent) => boolean", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "disabled": { + "defaultValue": { + "value": "false" + }, + "description": "Determines if the element is disabled. This sets the `aria-disabled`\nattribute accordingly, enabling support for all elements, including those\nthat don't support the native `disabled` attribute.\n\nThis feature can be combined with the\n[`accessibleWhenDisabled`](https://ariakit.org/reference/focusable#accessiblewhendisabled)\nprop to make disabled elements still accessible via keyboard.\n\n**Note**: For this prop to work, the\n[`focusable`](https://ariakit.org/reference/command#focusable) prop must be\nset to `true`, if it's not set by default.\n\nLive examples:\n- [Submenu](https://ariakit.org/examples/menu-nested)\n- [Combobox with Tabs](https://ariakit.org/examples/combobox-tabs)\n- [Context Menu](https://ariakit.org/examples/menu-context-menu)", + "name": "disabled", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/focusable/focusable.d.ts", + "name": "FocusableOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/focusable/focusable.d.ts", + "name": "FocusableOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "finalFocus": { + "defaultValue": null, + "description": "Determines the element that will receive focus once the dialog is closed,\nprovided that no other element has been focused while the dialog was being\nhidden (e.g., by clicking or tabbing into another tabbable element outside\nof the dialog).\n- If\n [`autoFocusOnHide`](https://ariakit.org/reference/dialog#autofocusonhide)\n is set to `false`, this prop will have no effect.\n- If left unset, the element that was focused before the dialog was opened\n will be focused again.", + "name": "finalFocus", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "HTMLElement | RefObject", + "value": [ + { + "value": "HTMLElement", + "description": "Any HTML element. Some elements directly implement this interface, while others implement it via an interface that inherits it.", + "fullComment": "Any HTML element. Some elements directly implement this interface, while others implement it via an interface that inherits it.", + "tags": {} + }, + { + "value": "RefObject", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "fitViewport": { + "defaultValue": { + "value": "false" + }, + "description": "Whether the popover should fit the viewport. If this is set to true, the\npopover wrapper will have `maxWidth` and `maxHeight` set to the viewport\nsize. This will be exposed to CSS as\n[`--popover-available-width`](https://ariakit.org/guide/styling#--popover-available-width)\nand\n[`--popover-available-height`](https://ariakit.org/guide/styling#--popover-available-height).\n\nLive examples:\n- [Textarea with inline\n Combobox](https://ariakit.org/examples/combobox-textarea)\n- [Menubar](https://ariakit.org/components/menubar)", + "name": "fitViewport", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/popover/popover.d.ts", + "name": "PopoverOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/popover/popover.d.ts", + "name": "PopoverOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "fixed": { + "defaultValue": { + "value": "false" + }, + "description": "Whether the popover has `position: fixed` or not.", + "name": "fixed", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/popover/popover.d.ts", + "name": "PopoverOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/popover/popover.d.ts", + "name": "PopoverOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "flip": { + "defaultValue": { + "value": "true" + }, + "description": "Controls the behavior of the popover when it overflows the viewport:\n- If a `boolean`, specifies whether the popover should flip to the opposite\n side when it overflows.\n- If a `string`, indicates the preferred fallback placements when it\n overflows. The placements must be spaced-delimited, e.g. \"top left\".\n\nLive examples:\n- [Sliding Menu](https://ariakit.org/examples/menu-slide)\n- [Menubar](https://ariakit.org/components/menubar)", + "name": "flip", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/popover/popover.d.ts", + "name": "PopoverOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/popover/popover.d.ts", + "name": "PopoverOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "string | boolean", + "value": [ + { + "value": "string" + }, + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "focusOnMove": { + "defaultValue": { + "value": "true" + }, + "description": "Determines if the active composite item should receive focus (or virtual\nfocus if the\n[`virtualFocus`](https://ariakit.org/reference/composite-provider#virtualfocus)\noption is enabled) when moving through items. This typically happens when\nnavigating through items with arrow keys, but it can also happen when\ncalling the\n[`move`](https://ariakit.org/reference/use-composite-store#move) method\ndirectly.\n\nUnlike the\n[`composite`](https://ariakit.org/reference/composite#composite-1) prop,\nthis option doesn't disable the entire composite widget behavior. It only\nstops this component from managing focus when navigating through items.\n\n**Note**: If you want to control the behavior only _when arrow keys are\npressed_, use the\n[`moveOnKeyPress`](https://ariakit.org/reference/composite#moveonkeypress)\nprop instead.", + "name": "focusOnMove", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/composite/composite.d.ts", + "name": "CompositeOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/composite/composite.d.ts", + "name": "CompositeOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "focusable": { + "defaultValue": null, + "description": "Determines if [Focusable](https://ariakit.org/components/focusable)\nfeatures should be active on non-native focusable elements.\n\n**Note**: This prop only turns off the additional features provided by the\n[`Focusable`](https://ariakit.org/reference/focusable) component.\nNon-native focusable elements will lose their focusability entirely.\nHowever, native focusable elements will retain their inherent focusability,\nbut without added features such as improved\n[`autoFocus`](https://ariakit.org/reference/focusable#autofocus),\n[`accessibleWhenDisabled`](https://ariakit.org/reference/focusable#accessiblewhendisabled),\n[`onFocusVisible`](https://ariakit.org/reference/focusable#onfocusvisible),\netc.\n@see https://ariakit.org/reference/focusable", + "name": "focusable", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/composite/composite.d.ts", + "name": "CompositeOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/composite/composite.d.ts", + "name": "CompositeOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "getAnchorRect": { + "defaultValue": null, + "description": "Function that returns the anchor element's DOMRect. If this is explicitly\npassed, it will override the anchor `getBoundingClientRect` method.\n\nLive examples:\n - [Textarea with inline combobox](https://ariakit.org/examples/combobox-textarea)\n - [Standalone Popover](https://ariakit.org/examples/popover-standalone)\n - [Context menu](https://ariakit.org/examples/menu-context-menu)\n - [Selection Popover](https://ariakit.org/examples/popover-selection)", + "name": "getAnchorRect", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/popover/popover.d.ts", + "name": "PopoverOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/popover/popover.d.ts", + "name": "PopoverOptions" + } + ], + "required": false, + "type": { + "name": "(anchor: HTMLElement) => AnchorRect" + } + }, + "getPersistentElements": { + "defaultValue": null, + "description": "When a dialog is open, the elements outside of it are disabled to prevent\ninteraction if the dialog is\n[`modal`](https://ariakit.org/reference/dialog#modal). For non-modal\ndialogs, interacting with elements outside the dialog prompts it to close.\n\nThis function allows you to return an iterable collection of elements that\nwill be considered as part of the dialog, thus excluding them from this\nbehavior.\n\n**Note**: The elements returned by this function must exist in the DOM when\nthe dialog opens.\n\nLive examples:\n- [Dialog with\n React-Toastify](https://ariakit.org/examples/dialog-react-toastify)", + "name": "getPersistentElements", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "() => Iterable" + } + }, + "gutter": { + "defaultValue": { + "value": "xs" + }, + "description": "default 4px (space.xs)", + "name": "gutter", + "parent": { + "fileName": "welcome-ui/lib/src/components/DropdownMenu/index.tsx", + "name": "DropdownMenuOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/DropdownMenu/index.tsx", + "name": "DropdownMenuOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "keyof ThemeSpace", + "value": [ + { + "value": "string" + }, + { + "value": "number" + } + ] + } + }, + "hideOnEscape": { + "defaultValue": { + "value": "true" + }, + "description": "Determines if the dialog will hide when the user presses the Escape key.\n\nThis prop can be either a boolean or a function that accepts an event as an\nargument and returns a boolean. The event object represents the keydown\nevent that initiated the hide action, which could be either a native\nkeyboard event or a React synthetic event.\n\n**Note**: When placing Ariakit dialogs inside third-party dialogs, using\n`event.stopPropagation()` within this function will stop the event from\nreaching the third-party dialog, closing only the Ariakit dialog.", + "name": "hideOnEscape", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "BooleanOrCallback>", + "value": [ + { + "value": "false" + }, + { + "value": "true" + }, + { + "value": "(arg: KeyboardEvent | React.KeyboardEvent) => boolean", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "hideOnHoverOutside": { + "defaultValue": { + "value": "true" + }, + "description": "Determines whether the popover should hide when the mouse leaves the\npopover or the anchor element and there's no _hover intent_, meaning, the\nmouse isn't moving toward the popover.\n\nThis can be either a boolean or a callback receiving the mouse move event\nthat initiated the behavior. The callback should return a boolean.\n\n**Note**: This behavior won't be triggered when the popover or any of its\ndescendants are in focus.", + "name": "hideOnHoverOutside", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/hovercard/hovercard.d.ts", + "name": "HovercardOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/hovercard/hovercard.d.ts", + "name": "HovercardOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "BooleanOrCallback", + "value": [ + { + "value": "false" + }, + { + "value": "true" + }, + { + "value": "(arg: MouseEvent) => boolean", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "hideOnInteractOutside": { + "defaultValue": { + "value": "true" + }, + "description": "Determines if the dialog should hide when the user clicks or focuses on an\nelement outside the dialog.\n\nThis prop can be either a boolean or a function that takes an event as an\nargument and returns a boolean. The event object represents the event that\ntriggered the action, which could be a native event or a React synthetic\nevent of various types.\n\nLive examples:\n- [Selection Popover](https://ariakit.org/examples/popover-selection)", + "name": "hideOnInteractOutside", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "BooleanOrCallback>", + "value": [ + { + "value": "false" + }, + { + "value": "true" + }, + { + "value": "(arg: Event | SyntheticEvent) => boolean", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "initialFocus": { + "defaultValue": null, + "description": "Specifies the element that will receive focus when the dialog is first\nopened. It can be an `HTMLElement` or a `React.RefObject` with an\n`HTMLElement`.\n\nIf\n[`autoFocusOnShow`](https://ariakit.org/reference/dialog#autofocusonshow)\nis set to `false`, this prop will have no effect. If left unset, the dialog\nwill attempt to determine the initial focus element in the following order:\n1. A [Focusable](https://ariakit.org/components/focusable) element with an\n [`autoFocus`](https://ariakit.org/reference/focusable#autofocus) prop.\n2. The first tabbable element inside the dialog.\n3. The first focusable element inside the dialog.\n4. The dialog element itself.", + "name": "initialFocus", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "HTMLElement | RefObject", + "value": [ + { + "value": "HTMLElement", + "description": "Any HTML element. Some elements directly implement this interface, while others implement it via an interface that inherits it.", + "fullComment": "Any HTML element. Some elements directly implement this interface, while others implement it via an interface that inherits it.", + "tags": {} + }, + { + "value": "RefObject", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "innerProps": { + "defaultValue": { + "value": "{}" + }, + "description": "add custom props from styled system on DropdownMenu inner", + "name": "innerProps", + "parent": { + "fileName": "welcome-ui/lib/src/components/DropdownMenu/index.tsx", + "name": "DropdownMenuOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/DropdownMenu/index.tsx", + "name": "DropdownMenuOptions" + } + ], + "required": false, + "type": { + "name": "WuiProps" + } + }, + "modal": { + "defaultValue": { + "value": "false" + }, + "description": "Determines whether the dialog is modal. Modal dialogs have distinct states\nand behaviors:\n- The [`portal`](https://ariakit.org/reference/dialog#portal) and\n [`preventBodyScroll`](https://ariakit.org/reference/dialog#preventbodyscroll)\n props are set to `true`. They can still be manually set to `false`.\n- When using the [`Heading`](https://ariakit.org/reference/heading) or\n [`DialogHeading`](https://ariakit.org/reference/dialog-heading)\n components within the dialog, their level will be reset so they start\n with `h1`.\n- A visually hidden dismiss button will be rendered if the\n [`DialogDismiss`](https://ariakit.org/reference/dialog-dismiss) component\n hasn't been used. This allows screen reader users to close the dialog.\n- When the dialog is open, element tree outside it will be inert.\n\nLive examples:\n- [Combobox with Tabs](https://ariakit.org/examples/combobox-tabs)\n- [Dialog with details &\n summary](https://ariakit.org/examples/dialog-details)\n- [Form with Select](https://ariakit.org/examples/form-select)\n- [Context menu](https://ariakit.org/examples/menu-context-menu)\n- [Responsive Popover](https://ariakit.org/examples/popover-responsive)", + "name": "modal", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/hovercard/hovercard.d.ts", + "name": "HovercardOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/hovercard/hovercard.d.ts", + "name": "HovercardOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "moveOnKeyPress": { + "defaultValue": { + "value": "true" + }, + "description": "Determines whether the composite widget should move focus to an item when\narrow keys are pressed, given that the composite element is focused and\nthere's no active item.\n\n**Note**: To entirely disable focus moving within a composite widget, you\ncan use the\n[`focusOnMove`](https://ariakit.org/reference/composite#focusonmove) prop\ninstead. If you want to control the behavior _only when arrow keys are\npressed_, where\n[`focusOnMove`](https://ariakit.org/reference/composite#focusonmove) may\nnot be applicable, this prop must be set on composite items as well.\n@example ```jsx\n\n \n \n\n```", + "name": "moveOnKeyPress", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/composite/composite.d.ts", + "name": "CompositeOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/composite/composite.d.ts", + "name": "CompositeOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "BooleanOrCallback>", + "value": [ + { + "value": "false" + }, + { + "value": "true" + }, + { + "value": "(arg: KeyboardEvent) => boolean", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "onClose": { + "defaultValue": null, + "description": "This is an event handler prop triggered when the dialog's `close` event is\ndispatched. The `close` event is similar to the native dialog\n[`close`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLDialogElement/close_event)\nevent. The only difference is that this event can be canceled with\n`event.preventDefault()`, which will prevent the dialog from hiding.\n\nIt's important to note that this event only fires when the dialog store's\n[`open`](https://ariakit.org/reference/use-dialog-store#open) state is set\nto `false`. If the controlled\n[`open`](https://ariakit.org/reference/dialog#open) prop value changes, or\nif the dialog's visibility is altered in any other way (such as unmounting\nthe dialog without adjusting the open state), this event won't be\ntriggered.\n\nLive examples:\n- [Dialog with scrollable\n backdrop](https://ariakit.org/examples/dialog-backdrop-scrollable)\n- [Dialog with details &\n summary](https://ariakit.org/examples/dialog-details)\n- [Warning on Dialog\n hide](https://ariakit.org/examples/dialog-hide-warning)\n- [Dialog with Menu](https://ariakit.org/examples/dialog-menu)", + "name": "onClose", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "(event: Event) => void" + } + }, + "onFocusVisible": { + "defaultValue": null, + "description": "Custom event handler invoked when the element gains focus through keyboard\ninteraction or a key press occurs while the element is in focus. This is\nthe programmatic equivalent of the\n[`data-focus-visible`](https://ariakit.org/guide/styling#data-focus-visible)\nattribute.\n\n**Note**: For this prop to work, the\n[`focusable`](https://ariakit.org/reference/command#focusable) prop must be\nset to `true`, if it's not set by default.\n\nLive examples:\n- [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)\n- [Custom Checkbox](https://ariakit.org/examples/checkbox-custom)", + "name": "onFocusVisible", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/focusable/focusable.d.ts", + "name": "FocusableOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/focusable/focusable.d.ts", + "name": "FocusableOptions" + } + ], + "required": false, + "type": { + "name": "BivariantCallback<(event: SyntheticEvent) => void>" + } + }, + "open": { + "defaultValue": null, + "description": "Controls the open state of the dialog. This is similar to the\n[`open`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLDialogElement/open)\nattribute on native dialog elements.\n\nLive examples:\n- [Dialog with scrollable\n backdrop](https://ariakit.org/examples/dialog-backdrop-scrollable)\n- [Dialog with details &\n summary](https://ariakit.org/examples/dialog-details)\n- [Warning on Dialog\n hide](https://ariakit.org/examples/dialog-hide-warning)\n- [Dialog with Menu](https://ariakit.org/examples/dialog-menu)", + "name": "open", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "overflowPadding": { + "defaultValue": { + "value": "8" + }, + "description": "The minimum padding between the popover and the viewport edge. This will be\nexposed to CSS as\n[`--popover-overflow-padding`](https://ariakit.org/guide/styling#--popover-overflow-padding).\n\nLive examples:\n- [Sliding Menu](https://ariakit.org/examples/menu-slide)", + "name": "overflowPadding", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/popover/popover.d.ts", + "name": "PopoverOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/popover/popover.d.ts", + "name": "PopoverOptions" + } + ], + "required": false, + "type": { + "name": "number" + } + }, + "overlap": { + "defaultValue": { + "value": "false" + }, + "description": "Whether the popover can overlap the anchor element when it overflows.\n\nLive examples:\n- [Menubar](https://ariakit.org/components/menubar)\n- [Submenu with\n Combobox](https://ariakit.org/examples/menu-nested-combobox)", + "name": "overlap", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/popover/popover.d.ts", + "name": "PopoverOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/popover/popover.d.ts", + "name": "PopoverOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "portal": { + "defaultValue": { + "value": "true" + }, + "description": "Determines whether the element should be rendered as a React Portal.\n\nLive examples:\n- [Combobox with integrated\n filter](https://ariakit.org/examples/combobox-filtering-integrated)\n- [Dialog with Menu](https://ariakit.org/examples/dialog-menu)\n- [Hovercard with keyboard\n support](https://ariakit.org/examples/hovercard-disclosure)\n- [Menubar](https://ariakit.org/components/menubar)\n- [Standalone Popover](https://ariakit.org/examples/popover-standalone)\n- [Animated Select](https://ariakit.org/examples/select-animated)", + "name": "portal", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "portalElement": { + "defaultValue": null, + "description": "An HTML element or a memoized callback function that returns an HTML\nelement to be used as the portal element. By default, the portal element\nwill be a `div` element appended to the `document.body`.\n\nLive examples:\n- [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)\n@example ```jsx\nconst [portal, setPortal] = useState(null);\n\n\n
\n```\n@example ```jsx\nconst getPortalElement = useCallback(() => {\n const div = document.createElement(\"div\");\n const portalRoot = document.getElementById(\"portal-root\");\n portalRoot.appendChild(div);\n return div;\n}, []);\n\n\n```", + "name": "portalElement", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "HTMLElement | ((element: HTMLElement) => HTMLElement)", + "value": [ + { + "value": "HTMLElement", + "description": "Any HTML element. Some elements directly implement this interface, while others implement it via an interface that inherits it.", + "fullComment": "Any HTML element. Some elements directly implement this interface, while others implement it via an interface that inherits it.", + "tags": {} + }, + { + "value": "(element: HTMLElement) => HTMLElement", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "portalRef": { + "defaultValue": null, + "description": "`portalRef` is similar to `ref` but is scoped to the portal node. It's\nuseful when you need to be informed when the portal element is appended to\nthe DOM or removed from the DOM.\n\nLive examples:\n- [Form with Select](https://ariakit.org/examples/form-select)\n@example ```jsx\nconst [portalElement, setPortalElement] = useState(null);\n\n\n```", + "name": "portalRef", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "RefCallback | MutableRefObject", + "value": [ + { + "value": "RefCallback", + "description": "", + "fullComment": "", + "tags": {} + }, + { + "value": "MutableRefObject", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "preserveTabOrder": { + "defaultValue": { + "value": "false" + }, + "description": "When enabled, `preserveTabOrder` will keep the DOM element's tab order the\nsame as the order in which the underlying\n[`Portal`](https://ariakit.org/reference/portal) component was mounted in\nthe React tree.\n\nIf the\n[`preserveTabOrderAnchor`](https://ariakit.org/reference/portal#preservetaborderanchor)\nprop is provided, the tab order will be preserved relative to that element.", + "name": "preserveTabOrder", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "preserveTabOrderAnchor": { + "defaultValue": null, + "description": "An anchor element for maintaining the tab order when\n[`preserveTabOrder`](https://ariakit.org/reference/portal#preservetaborder)\nprop is enabled. The tab order will be kept relative to this element.\n\nBy default, the tab order is kept relative to the original location in the\nReact tree where the underlying\n[`Portal`](https://ariakit.org/reference/portal) component was mounted.\n@example ```jsx {18-20}\nconst [anchor, setAnchor] = useState(null);\n\n\n\n\n// Rendered at the end of the document.\n\n \n\n\n// Rendered at the end of the document, but the tab order is preserved.\n\n \n\n\n// Rendered at the end of the document, but the tab order is preserved\n// relative to the anchor element.\n\n \n\n\n\n```", + "name": "preserveTabOrderAnchor", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/portal/portal.d.ts", + "name": "PortalOptions" + } + ], + "required": false, + "type": { + "name": "Element" + } + }, + "preventBodyScroll": { + "defaultValue": null, + "description": "Determines whether the body scrolling will be prevented when the dialog is\nshown. This is automatically set to `true` when the dialog is\n[`modal`](https://ariakit.org/reference/dialog#modal). You can disable this\nprop if you want to implement your own logic.", + "name": "preventBodyScroll", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "render": { + "defaultValue": null, + "description": "Allows the component to be rendered as a different HTML element or React\ncomponent. The value can be a React element or a function that takes in the\noriginal component props and gives back a React element with the props\nmerged.\n\nCheck out the [Composition](https://ariakit.org/guide/composition) guide\nfor more details.", + "name": "render", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/utils/types.d.ts", + "name": "Options" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/utils/types.d.ts", + "name": "Options" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "ReactElement> | RenderProp & { ref?: Ref; }>", + "value": [ + { + "value": "ReactElement>", + "description": "", + "fullComment": "", + "tags": {} + }, + { + "value": "RenderProp & { ref?: Ref; }>", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "sameWidth": { + "defaultValue": { + "value": "false" + }, + "description": "Whether the popover should have the same width as the anchor element. This\nwill be exposed to CSS as\n[`--popover-anchor-width`](https://ariakit.org/guide/styling#--popover-anchor-width).", + "name": "sameWidth", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/popover/popover.d.ts", + "name": "PopoverOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/popover/popover.d.ts", + "name": "PopoverOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "shift": { + "defaultValue": { + "value": "0" + }, + "description": "The skidding of the popover along the anchor element. Can be set to\nnegative values to make the popover shift to the opposite side.\n\nLive examples:\n- [Combobox with Tabs](https://ariakit.org/examples/combobox-tabs)\n- [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)\n- [Submenu](https://ariakit.org/examples/menu-nested)\n- [Menubar](https://ariakit.org/components/menubar)\n- [Select with Combobox and\n Tabs](https://ariakit.org/examples/select-combobox-tab)", + "name": "shift", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/popover/popover.d.ts", + "name": "PopoverOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/popover/popover.d.ts", + "name": "PopoverOptions" + } + ], + "required": false, + "type": { + "name": "number" + } + }, + "slide": { + "defaultValue": { + "value": "true" + }, + "description": "Whether the popover should slide when it overflows.", + "name": "slide", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/popover/popover.d.ts", + "name": "PopoverOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/popover/popover.d.ts", + "name": "PopoverOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "store": { + "defaultValue": null, + "description": "Object returned by the\n[`useMenuStore`](https://ariakit.org/reference/use-menu-store) hook. If not\nprovided, the closest\n[`MenuProvider`](https://ariakit.org/reference/menu-provider) component's\ncontext will be used.", + "name": "store", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/menu/menu-list.d.ts", + "name": "MenuListOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/menu/menu-list.d.ts", + "name": "MenuListOptions" + } + ], + "required": false, + "type": { + "name": "MenuStore" + } + }, + "typeahead": { + "defaultValue": { + "value": "true" + }, + "description": "When enabled, pressing printable character keys will move focus to the next\ncomposite item that starts with the entered characters.", + "name": "typeahead", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/composite/composite-typeahead.d.ts", + "name": "CompositeTypeaheadOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/composite/composite-typeahead.d.ts", + "name": "CompositeTypeaheadOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "unmountOnHide": { + "defaultValue": { + "value": "false" + }, + "description": "When set to `true`, the content element will be unmounted and removed from\nthe DOM when it's hidden.\n\nLive examples:\n- [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)\n- [Combobox with integrated\n filter](https://ariakit.org/examples/combobox-filtering-integrated)\n- [Textarea with inline\n Combobox](https://ariakit.org/examples/combobox-textarea)\n- [Standalone Popover](https://ariakit.org/examples/popover-standalone)\n- [Animated Select](https://ariakit.org/examples/select-animated)\n- [Multi-Select](https://ariakit.org/examples/select-multiple)", + "name": "unmountOnHide", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-content.d.ts", + "name": "DisclosureContentOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/disclosure/disclosure-content.d.ts", + "name": "DisclosureContentOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "unstable_treeSnapshotKey": { + "defaultValue": null, + "description": "@private", + "name": "unstable_treeSnapshotKey", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/dialog/dialog.d.ts", + "name": "DialogOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "string | number | boolean", + "value": [ + { + "value": "string" + }, + { + "value": "number" + }, + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "updatePosition": { + "defaultValue": null, + "description": "A callback that will be called when the popover needs to calculate its\nposition. This will override the internal `updatePosition` function. The\noriginal `updatePosition` function will be passed as an argument, so it can\nbe called inside the callback to apply the default behavior.\n\nLive examples:\n - [Responsive Popover](https://ariakit.org/examples/popover-responsive)", + "name": "updatePosition", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/popover/popover.d.ts", + "name": "PopoverOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/popover/popover.d.ts", + "name": "PopoverOptions" + } + ], + "required": false, + "type": { + "name": "(props: { updatePosition: () => Promise; }) => void | Promise" + } + }, + "wrapElement": { + "defaultValue": null, + "description": "", + "name": "wrapElement", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/utils/types.d.ts", + "name": "Options" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/utils/types.d.ts", + "name": "Options" + } + ], + "required": false, + "type": { + "name": "WrapElement" + } + }, + "wrapperProps": { + "defaultValue": null, + "description": "Props that will be passed to the popover wrapper element. This element will\nbe used to position the popover.\n\nLive examples:\n- [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)\n- [Sliding Menu](https://ariakit.org/examples/menu-slide)", + "name": "wrapperProps", + "parent": { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/popover/popover.d.ts", + "name": "PopoverOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/node_modules/@ariakit/react-core/cjs/popover/popover.d.ts", + "name": "PopoverOptions" + } + ], + "required": false, + "type": { + "name": "HTMLAttributes" + } + } + } + } +} \ No newline at end of file diff --git a/lib/src/components/DropdownMenu/index.tsx b/lib/src/components/DropdownMenu/index.tsx new file mode 100644 index 0000000000..bd619666b2 --- /dev/null +++ b/lib/src/components/DropdownMenu/index.tsx @@ -0,0 +1,87 @@ +import React from 'react' +import * as Ariakit from '@ariakit/react' +import { useTheme } from '@xstyled/styled-components' + +import { Arrow } from './Arrow' +import { Item } from './Item' +import { Separator } from './Separator' +import * as S from './styles' + +import { ThemeValues } from '@/theme' +import { CreateWuiProps, forwardRef, WuiProps } from '@/System' + +export interface DropdownMenuOptions extends Omit { + /** default 4px (space.xs) */ + gutter?: keyof ThemeValues['space'] | number + /** add custom props from styled system on DropdownMenu inner */ + innerProps?: WuiProps +} + +export type DropdownMenuProps = CreateWuiProps<'div', DropdownMenuOptions> + +const DropdownMenuComponent = forwardRef<'div', DropdownMenuProps>( + ({ children, dataTestId, gutter = 'xs', innerProps = {}, store, ...rest }, ref) => { + const theme = useTheme() + const arrowElement = store.useState('arrowElement') + + let parsedGutter = gutter + if (typeof parsedGutter === 'string') { + // The value from the theme is in rem, e.g: 1.5rem + // So we parse it to float and pass it to theme.toPx that will convert it to px, e.g: 24px + // Since we want a number we parse it to int + parsedGutter = parseInt(theme.toPx(parseFloat(theme.space[gutter])), 10) || 0 + } + if (arrowElement) { + parsedGutter = 0 + } + + return ( + } + store={store} + tabIndex={0} + {...rest} + > + {children} + + ) + } +) + +export type UseDropdownMenu = Ariakit.MenuStore +export type UseDropdownMenuProps = Ariakit.MenuStoreProps +export type UseDropdownMenuState = Ariakit.MenuStoreState + +export function useDropdownMenu(options: UseDropdownMenuProps = {}): UseDropdownMenu { + const dropdownMenu = Ariakit.useMenuStore({ + animated: true, + ...options, + }) + + return dropdownMenu +} + +type TriggerOptions = { store: UseDropdownMenu } +type TriggerProps = CreateWuiProps<'button', TriggerOptions> + +const Trigger = forwardRef<'button', TriggerProps>(({ as: As, store, ...rest }, ref) => { + return ( + : undefined} + store={store} + {...(rest as Ariakit.MenuButtonProps)} + /> + ) +}) + +export const DropdownMenu = Object.assign(DropdownMenuComponent, { + Trigger, + Item, + Separator, + Arrow, +}) diff --git a/lib/src/components/DropdownMenu/styles.ts b/lib/src/components/DropdownMenu/styles.ts new file mode 100644 index 0000000000..110129642a --- /dev/null +++ b/lib/src/components/DropdownMenu/styles.ts @@ -0,0 +1,16 @@ +import styled, { system, th } from '@xstyled/styled-components' + +import { Box } from '@/Box' + +export const Inner = styled(Box)` + ${th('cards.default')}; + ${th('dropdownMenu.inner')}; + z-index: 1; + opacity: 0; + transition: opacity 150ms ease-in-out; + ${system}; + + &[data-enter] { + opacity: 1; + } +` diff --git a/lib/src/components/DropdownMenu/tests/index.test.tsx b/lib/src/components/DropdownMenu/tests/index.test.tsx new file mode 100644 index 0000000000..32ab97070f --- /dev/null +++ b/lib/src/components/DropdownMenu/tests/index.test.tsx @@ -0,0 +1,116 @@ +import React, { useState } from 'react' +import { fireEvent, renderHook, screen, waitFor } from '@testing-library/react' + +import { DropdownMenu, type DropdownMenuProps, useDropdownMenu } from '../' +import { render } from '../../../../tests' + +const content = 'jungle' +const triggerDataTestId = 'trigger' +const dropdownDataTestId = 'menu' + +const options = [ + { value: 1, label: 'one' }, + { value: 2, label: 'two' }, + { value: 3, label: 'three' }, + { value: 4, label: 'four' }, + { value: 5, label: 'five' }, +] + +const DropdownRenderer: React.FC = () => { + const dropdownMenu = useDropdownMenu() + + const [selected, setSelected] = useState('one') + + const handleChange = (value: string) => { + setSelected(value) + } + + return ( + <> + + {selected} + + + {options.map(item => ( + handleChange(item.label)} + > + {item.label} + + ))} + + + ) +} + +describe('', () => { + test('should render correctly', () => { + const dataTestId = 'dropdownMenu' + const { + result: { current: dropdownMenu }, + } = renderHook(() => useDropdownMenu({ open: true })) + + render( + + {content} + + ) + + const dropdown = screen.getByTestId(dataTestId) + + expect(dropdown).toHaveTextContent(content) + }) + + test('should handle click item', async () => { + render() + + const trigger = screen.getByTestId(triggerDataTestId) + await fireEvent.click(trigger) + + const dropdownMenuItemToDropdown = screen.getByRole('menuitem', { name: 'four' }) + expect(dropdownMenuItemToDropdown).toBeInTheDocument() + + // Why fireEvent ? https://github.com/testing-library/user-event/discussions/1156 + await fireEvent.click(dropdownMenuItemToDropdown) + + expect(trigger).toHaveTextContent('four') + }) + + test.each([ + ['md', 12], + ['xxl', 32], + [10, 10], + ['not a space', 0], + ])('should render the gutter correctly - %s (%i)', async (gutter, expected) => { + const triggerDataTestId = 'trigger' + const dropdownDataTestId = 'menu' + const { + result: { current: dropdownMenu }, + } = renderHook(() => useDropdownMenu({ open: true })) + + render( + <> + + + {content} + + + ) + const trigger = screen.getByTestId(triggerDataTestId) + const dropdown = screen.getByTestId(dropdownDataTestId) + + fireEvent.click(trigger) + + await waitFor(() => { + const { transform } = getComputedStyle(dropdown.parentElement as HTMLElement) + + expect(transform).toBe(`translate3d(0px,${expected}px,0)`) + }) + }) +}) diff --git a/lib/src/components/DropdownMenu/theme.ts b/lib/src/components/DropdownMenu/theme.ts new file mode 100644 index 0000000000..22626c3772 --- /dev/null +++ b/lib/src/components/DropdownMenu/theme.ts @@ -0,0 +1,42 @@ +import { CSSObject } from '@xstyled/styled-components' + +import { ThemeValues } from '@/theme' + +export type ThemeDropdownMenu = { + inner: CSSObject + item: CSSObject + separator: CSSObject +} + +export const getDropdownMenu = (theme: ThemeValues): ThemeDropdownMenu => { + const { colors, fontSizes, radii, toRem } = theme + const borderColor = colors['beige-30'] + + return { + inner: { + fontSize: fontSizes.sm, + minWidth: toRem(130), + borderRadius: radii.md, + }, + item: { + backgroundColor: 'transparent', + color: colors['beige-70'], + '&:hover': { + backgroundColor: colors['beige-30'], + color: colors['neutral-90'], + }, + '&:focus': { + backgroundColor: colors['beige-30'], + color: colors['neutral-90'], + }, + '&[disabled]': { + backgroundColor: 'transparent', + color: colors['beige-40'], + cursor: 'not-allowed', + }, + }, + separator: { + backgroundColor: borderColor, + }, + } +} diff --git a/lib/src/components/Field/docs/examples/disabled.tsx b/lib/src/components/Field/docs/examples/disabled.tsx new file mode 100644 index 0000000000..35d8560792 --- /dev/null +++ b/lib/src/components/Field/docs/examples/disabled.tsx @@ -0,0 +1,20 @@ +import * as React from 'react' + +import { InputText } from '@/InputText' +import { Field } from '@/Field' +import { Checkbox } from '@/Checkbox' + +const Example = () => { + return ( + <> + + + + + + + + ) +} + +export default Example diff --git a/lib/src/components/Field/docs/examples/hint.tsx b/lib/src/components/Field/docs/examples/hint.tsx new file mode 100644 index 0000000000..ebaa8dd376 --- /dev/null +++ b/lib/src/components/Field/docs/examples/hint.tsx @@ -0,0 +1,20 @@ +import * as React from 'react' + +import { InputText } from '@/InputText' +import { Field } from '@/Field' +import { Checkbox } from '@/Checkbox' + +const Example = () => { + return ( + <> + + + + + + + + ) +} + +export default Example diff --git a/lib/src/components/Field/docs/examples/label.tsx b/lib/src/components/Field/docs/examples/label.tsx new file mode 100644 index 0000000000..bbd3d2f52e --- /dev/null +++ b/lib/src/components/Field/docs/examples/label.tsx @@ -0,0 +1,20 @@ +import * as React from 'react' + +import { InputText } from '@/InputText' +import { Field } from '@/Field' +import { Checkbox } from '@/Checkbox' + +const Example = () => { + return ( + <> + + + + + + + + ) +} + +export default Example diff --git a/lib/src/components/Field/docs/examples/overview.tsx b/lib/src/components/Field/docs/examples/overview.tsx new file mode 100644 index 0000000000..00afb29e1c --- /dev/null +++ b/lib/src/components/Field/docs/examples/overview.tsx @@ -0,0 +1,14 @@ +import * as React from 'react' + +import { InputText } from '@/InputText' +import { Field } from '@/Field' + +const Example = () => { + return ( + + + + ) +} + +export default Example diff --git a/packages/Field/docs/examples/refs.tsx b/lib/src/components/Field/docs/examples/refs.tsx similarity index 76% rename from packages/Field/docs/examples/refs.tsx rename to lib/src/components/Field/docs/examples/refs.tsx index 9e05bd12d8..7755779d75 100644 --- a/packages/Field/docs/examples/refs.tsx +++ b/lib/src/components/Field/docs/examples/refs.tsx @@ -1,7 +1,8 @@ import * as React from 'react' -import { InputText } from '@welcome-ui/input-text' -import { Field } from '@welcome-ui/field' -import { Button } from '@welcome-ui/button' + +import { InputText } from '@/InputText' +import { Field } from '@/Field' +import { Button } from '@/Button' const Example = () => { const inputRef = React.useRef(null) diff --git a/lib/src/components/Field/docs/examples/required.tsx b/lib/src/components/Field/docs/examples/required.tsx new file mode 100644 index 0000000000..49b5ce7ac5 --- /dev/null +++ b/lib/src/components/Field/docs/examples/required.tsx @@ -0,0 +1,20 @@ +import * as React from 'react' + +import { InputText } from '@/InputText' +import { Field } from '@/Field' +import { Checkbox } from '@/Checkbox' + +const Example = () => { + return ( + <> + + + + + + + + ) +} + +export default Example diff --git a/lib/src/components/Field/docs/examples/variants.tsx b/lib/src/components/Field/docs/examples/variants.tsx new file mode 100644 index 0000000000..04f90be047 --- /dev/null +++ b/lib/src/components/Field/docs/examples/variants.tsx @@ -0,0 +1,20 @@ +import * as React from 'react' + +import { InputText } from '@/InputText' +import { Field } from '@/Field' +import { Checkbox } from '@/Checkbox' + +const Example = () => { + return ( + <> + + + + + + + + ) +} + +export default Example diff --git a/packages/Field/docs/index.mdx b/lib/src/components/Field/docs/index.mdx similarity index 100% rename from packages/Field/docs/index.mdx rename to lib/src/components/Field/docs/index.mdx diff --git a/lib/src/components/Field/docs/properties.json b/lib/src/components/Field/docs/properties.json new file mode 100644 index 0000000000..fda4537ee0 --- /dev/null +++ b/lib/src/components/Field/docs/properties.json @@ -0,0 +1,171 @@ +{ + "Field": { + "props": { + "disabled": { + "defaultValue": null, + "description": "", + "name": "disabled", + "parent": { + "fileName": "welcome-ui/lib/src/components/Field/index.tsx", + "name": "FieldOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Field/index.tsx", + "name": "FieldOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "disabledIcon": { + "defaultValue": null, + "description": "", + "name": "disabledIcon", + "parent": { + "fileName": "welcome-ui/lib/src/components/Field/index.tsx", + "name": "FieldOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Field/index.tsx", + "name": "FieldOptions" + } + ], + "required": false, + "type": { + "name": "Element" + } + }, + "hint": { + "defaultValue": null, + "description": "", + "name": "hint", + "parent": { + "fileName": "welcome-ui/lib/src/components/Field/index.tsx", + "name": "FieldOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Field/index.tsx", + "name": "FieldOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "string | Element", + "value": [ + { + "value": "string" + }, + { + "value": "Element", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "label": { + "defaultValue": null, + "description": "", + "name": "label", + "parent": { + "fileName": "welcome-ui/lib/src/components/Field/index.tsx", + "name": "FieldOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Field/index.tsx", + "name": "FieldOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "string | Element", + "value": [ + { + "value": "string" + }, + { + "value": "Element", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "required": { + "defaultValue": null, + "description": "", + "name": "required", + "parent": { + "fileName": "welcome-ui/lib/src/components/Field/index.tsx", + "name": "FieldOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Field/index.tsx", + "name": "FieldOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "transparent": { + "defaultValue": null, + "description": "", + "name": "transparent", + "parent": { + "fileName": "welcome-ui/lib/src/components/Field/index.tsx", + "name": "FieldOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Field/index.tsx", + "name": "FieldOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + } + } + } +} \ No newline at end of file diff --git a/lib/src/components/Field/index.tsx b/lib/src/components/Field/index.tsx new file mode 100644 index 0000000000..0d029f4ff7 --- /dev/null +++ b/lib/src/components/Field/index.tsx @@ -0,0 +1,137 @@ +import React from 'react' + +import { useIsomorphicLayoutEffect } from '../../utils/use-isomorphic-layout-effect' + +import * as S from './styles' +import { forwardedProps, generateRandomId, getBaseType, getVariant } from './utils' + +import { VariantIcon } from '@/VariantIcon' +import { Hint } from '@/Hint' +import { Label } from '@/Label' +import { CreateWuiProps, forwardRef } from '@/System' + +type VariantProps = { + error?: string | JSX.Element + success?: string | JSX.Element + warning?: string | JSX.Element +} + +export interface FieldOptions extends VariantProps { + children: JSX.Element + disabled?: boolean + disabledIcon?: JSX.Element + hint?: string | JSX.Element + label?: string | JSX.Element + required?: boolean + transparent?: boolean +} + +export type FieldProps = CreateWuiProps<'div', FieldOptions> + +export const Field = forwardRef<'div', FieldProps>( + ( + { + children, + dataTestId, + disabled, + disabledIcon, + error, + flexDirection, + hint, + label, + required, + success, + transparent, + warning, + ...rest + }, + ref + ) => { + const baseType = getBaseType(children.props.type || children.type.displayName) + const isRadio = baseType === 'radio' + const isRadioGroup = baseType === 'RadioGroup' + const isFieldGroup = baseType === 'FieldGroup' + const isCheckbox = baseType === 'checkbox' + const isToggle = children.type.displayName === 'Toggle' + const isCheckable = isRadio || isCheckbox || isToggle + const layout = flexDirection || (isCheckable ? 'row' : 'column') + const isGroup = isFieldGroup || isRadioGroup + const variant = getVariant({ error, warning, success }) + const hintText = variant ? error || warning || success : hint + const withHintText = !!hintText + const htmlFor = children.props.id || children.props.name || generateRandomId() + + const child = React.cloneElement(React.Children.only(children), { + disabled, + id: htmlFor, + required, + variant, + transparent, + ...(isGroup ? { flexDirection: layout } : {}), + }) + + useIsomorphicLayoutEffect(() => { + Object.keys(children.props).forEach(prop => { + if (forwardedProps.includes(prop)) { + const element = document.getElementById(htmlFor) + // eslint-disable-next-line no-console + console.warn(`You must pass the "${prop}" prop to the instead of`, element) + } + }) + }, [children.props, children.type.displayName, htmlFor]) + return ( + + + {isCheckable && child} + + {label && ( + + )} + {/* for a checkable field we add a hint below label name */} + {isCheckable && hintText && ( + + {hintText} + + )} + + + {!isCheckable && child} + {!isCheckable && hintText && ( + + {hintText} + + )} + + ) + } +) + +Field.displayName = 'Field' + +export const IconWrapper = S.IconWrapper +export const IconGroupWrapper = S.IconGroupWrapper +export { getBaseType } diff --git a/lib/src/components/Field/styles.ts b/lib/src/components/Field/styles.ts new file mode 100644 index 0000000000..95781a64c1 --- /dev/null +++ b/lib/src/components/Field/styles.ts @@ -0,0 +1,113 @@ +import styled, { css, system, th } from '@xstyled/styled-components' + +import { FieldIconSize } from '../../utils/field-styles' + +import { StyledLabel } from '@/Label' +import { shouldForwardProp, WuiProps } from '@/System' + +const checkableFieldStyles = css` + ${th('defaultFields.checkablelabel.default')}; + align-items: flex-start; + overflow-wrap: break-word; +` + +type StyledFieldProps = { + checked?: boolean + flexDirection: WuiProps['flexDirection'] + isCheckable?: boolean + isRadioGroup?: boolean + withHintText?: boolean +} + +export const Field = styled('div').withConfig({ shouldForwardProp })( + ({ checked, isCheckable, isRadioGroup, withHintText }) => css` + ${isCheckable && + css` + input { + margin-top: xs; + } + `} + ${StyledLabel} { + ${isCheckable && checkableFieldStyles}; + ${isCheckable && withHintText && th('defaultFields.checkablelabel.default')} + ${checked && th('defaultFields.checkablelabel.checked')} + ${!isCheckable && + css` + margin-bottom: sm; + `} + ${isRadioGroup && + css` + margin-bottom: md; + `} + } + ${system}; + ` +) + +export const Label = styled.div` + display: flex; + align-items: flex-start; + gap: sm; +` + +export const LabelWithHint = styled.div` + display: flex; + flex-direction: column; +` + +type IconWrapperProps = { + iconPlacement: 'left' | 'right' + size?: FieldIconSize +} + +export const IconWrapper = styled.divBox( + ({ iconPlacement, size }) => css` + position: absolute; + top: 0; + left: ${iconPlacement === 'left' ? th(`defaultFields.iconPlacement.${size}.left`) : 'auto'}; + right: ${iconPlacement === 'right' ? th(`defaultFields.iconPlacement.${size}.right`) : 'auto'}; + bottom: 0; + display: flex; + justify-content: center; + align-items: center; + pointer-events: none; + transition: medium; + transition-timing-function: primary; + color: neutral-90; + ${system}; + + /* for button action */ + & > button { + pointer-events: auto; + } + + ${size === 'xs' && + css` + button { + height: ${th('buttons.sizes.xxs.height')}; + width: ${th('buttons.sizes.xxs.height')}; + } + `} + ` +) + +export const IconGroupWrapper = styled.divBox( + ({ size }: { size: FieldIconSize }) => css` + position: absolute; + padding: 0; + top: 0; + bottom: 0; + right: ${size === 'xs' ? 'sm' : 'md'}; + display: flex; + align-items: center; + gap: xs; + color: neutral-90; + ${size === 'xs' && + css` + button { + height: ${th('buttons.sizes.xxs.height')}; + width: ${th('buttons.sizes.xxs.height')}; + } + `} + ` +) diff --git a/lib/src/components/Field/tests/index.test.tsx b/lib/src/components/Field/tests/index.test.tsx new file mode 100644 index 0000000000..b21bde5a77 --- /dev/null +++ b/lib/src/components/Field/tests/index.test.tsx @@ -0,0 +1,201 @@ +import React, { HTMLInputTypeAttribute } from 'react' +import { screen } from '@testing-library/react' +import { act } from '@testing-library/react' + +import { Field } from '../' +import { render } from '../../../../tests' + +const Input = ({ + id, + name = 'hello', + type = 'text', + ...rest +}: { + id?: string + name?: string + type?: HTMLInputTypeAttribute +}) => { + return +} + +const labelText = 'Label' +const hintText = 'Hint' +const errorText = 'Error' + +describe('', () => { + it('should render', () => { + render( + + + + ) + + const field = screen.getByTestId('field') + expect(field).toBeInTheDocument() + + const input = screen.getByTestId('input') + expect(input).toBeInTheDocument() + + const label = field.querySelector('label') + expect(label).not.toBeInTheDocument() + + const hint = field.getElementsByTagName('div') + expect(hint.length).toBe(2) + }) + + it('should display label', () => { + render( + + + + ) + + const field = screen.getByTestId('field') + expect(field).toBeInTheDocument() + + const input = screen.getByTestId('input') + expect(input).toBeInTheDocument() + + const hint = screen.getByTestId('field-hint') + expect(hint).toHaveTextContent('hint') + + const label = screen.getByText('Label') + expect(label).toBeInTheDocument() + expect(label).toHaveTextContent(labelText) + }) + + it('should display hint', () => { + render( + + + + ) + + const field = screen.getByTestId('field') + expect(field).toBeInTheDocument() + + const input = screen.getByTestId('input') + expect(input).toBeInTheDocument() + + const hint = screen.getByText(hintText) + expect(hint).toBeInTheDocument() + expect(hint).toHaveTextContent(hintText) + }) + + it('should display error until hint', () => { + render( + + + + ) + + const field = screen.getByTestId('field') + expect(field).toBeInTheDocument() + + const hint = screen.getByText(errorText) + expect(hint).toBeInTheDocument() + expect(hint).toHaveTextContent(errorText) + + const input = screen.getByTestId('input') + expect(input).toBeInTheDocument() + expect(input).toHaveAttribute('variant', 'danger') + }) + + it('should display label before input', () => { + render( + + + + ) + + const field = screen.getByTestId('field') + expect(field).toBeInTheDocument() + + const input = screen.getByTestId('input') + expect(input).toBeInTheDocument() + + const label = screen.getByText('Label') + expect(label).toBeInTheDocument() + + expect(label.compareDocumentPosition(input)).toBe(4) + }) + + it('should display checkable input inside label', () => { + render( + + + + ) + + const field = screen.getByTestId('field') + expect(field).toBeInTheDocument() + + const input = screen.getByTestId('input') + expect(input).toBeInTheDocument() + + const label = screen.getByText('Label') + expect(label).toBeInTheDocument() + + expect(label.compareDocumentPosition(input)).toBe(2) + }) + + it('should focus input when click on label when using id on input', async () => { + const { user } = render( + + + + ) + + const field = screen.getByTestId('field') + const label = field.querySelector('label') + const input = screen.getByTestId('input') + + expect(label?.htmlFor).toBe('field') + expect(label?.htmlFor).toBe(input?.id) + + await act(() => user.click(label)) + + expect(input).toHaveFocus() + expect(document.activeElement).toBe(input) + }) + + it('should focus input when click on label when using name on input (the fallback value of the id is the name prop)', async () => { + const { user } = render( + + + + ) + + const field = screen.getByTestId('field') + const label = field.querySelector('label') + const input = screen.getByTestId('input') + + expect(label?.htmlFor).toBe('field') + expect(label?.htmlFor).toBe(input?.id) + + await act(() => user.click(label)) + + expect(input).toHaveFocus() + expect(document.activeElement).toBe(input) + }) + + it('should focus input when click on label when using neither name nor id on input (the fallback value of the id is created randomly)', async () => { + const { user } = render( + + + + ) + + const field = screen.getByTestId('field') + const label = field.querySelector('label') + const input = screen.getByTestId('input') + + expect(label?.htmlFor).toContain('wui-field-') + expect(label?.htmlFor).toBe(input?.id) + + await act(() => user.click(label)) + + expect(input).toHaveFocus() + expect(document.activeElement).toBe(input) + }) +}) diff --git a/lib/src/components/Field/utils.ts b/lib/src/components/Field/utils.ts new file mode 100644 index 0000000000..bd9a203d24 --- /dev/null +++ b/lib/src/components/Field/utils.ts @@ -0,0 +1,27 @@ +import { FieldOptions } from '.' + +const TYPES: { [key: string]: string } = { + Checkbox: 'checkbox', + Radio: 'radio', + InputText: 'text', + RadioTab: 'radio', + Select: 'text', + Toggle: 'checkbox', +} + +export const getBaseType = (type: string): string => TYPES[type] || type + +export const getVariant = ({ + error, + success, + warning, +}: Pick): 'danger' | 'warning' | 'success' => { + if (error) return 'danger' + if (warning) return 'warning' + if (success) return 'success' + return undefined +} + +export const generateRandomId = (): string => `wui-field-${Math.random().toString(36).slice(2)}` + +export const forwardedProps = ['disabled', 'required', 'variant'] diff --git a/lib/src/components/FieldGroup/index.tsx b/lib/src/components/FieldGroup/index.tsx new file mode 100644 index 0000000000..ba090c3cc0 --- /dev/null +++ b/lib/src/components/FieldGroup/index.tsx @@ -0,0 +1,32 @@ +import React from 'react' + +import * as S from './styles' + +import { Label, LabelOptions } from '@/Label' +import { CreateWuiProps, forwardRef } from '@/System' + +export interface FieldGroupOptions { + // specific to fieldset, we need to override children + children: React.ReactNode + label?: React.ReactElement + required?: LabelOptions['required'] +} + +export type FieldGroupProps = CreateWuiProps<'fieldset', FieldGroupOptions> + +export const FieldGroup = forwardRef<'fieldset', FieldGroupProps>( + ({ children, dataTestId, label, required }, ref) => ( + + {label && ( + + )} + {children} + + ) +) + +FieldGroup.displayName = 'FieldGroup' + +export const StyledFieldGroup = S.FieldGroup diff --git a/lib/src/components/FieldGroup/styles.ts b/lib/src/components/FieldGroup/styles.ts new file mode 100644 index 0000000000..f02faf1275 --- /dev/null +++ b/lib/src/components/FieldGroup/styles.ts @@ -0,0 +1,17 @@ +import styled, { system, th } from '@xstyled/styled-components' + +import { shouldForwardProp } from '@/System' + +export const FieldGroup = styled.fieldsetBox.withConfig({ shouldForwardProp })` + width: 100%; + min-width: 0; + min-height: 0; + margin: 0; + padding: 0; + ${th('defaultFields.fieldset')}; + ${system}; + + > * { + margin-bottom: md; + } +` diff --git a/packages/FileDrop/src/FilePreview.tsx b/lib/src/components/FileDrop/FilePreview.tsx similarity index 77% rename from packages/FileDrop/src/FilePreview.tsx rename to lib/src/components/FileDrop/FilePreview.tsx index 2809023479..fb4b31dec7 100644 --- a/packages/FileDrop/src/FilePreview.tsx +++ b/lib/src/components/FileDrop/FilePreview.tsx @@ -1,18 +1,19 @@ import React from 'react' -import { Button } from '@welcome-ui/button' -import { Text } from '@welcome-ui/text' -import { ExternalLinkIcon } from '@welcome-ui/icons' -import { ForceFileType, getFileIcon, getFileName, getFileSize } from '@welcome-ui/files' -import { FileType, WordingsType } from './index' +import { FileDropChildren } from './index' + +import { ExternalLinkIcon } from '@/Icons' +import { Text } from '@/Text' +import { ForceFileType, getFileIcon, getFileName, getFileSize } from '@/Files' +import { Button } from '@/Button' export interface MessageProps { - file: FileType + file: FileDropChildren['file'] fileName?: string forceFileType?: ForceFileType } -export const FilePreview: React.FC = ({ +export const FilePreview: React.FC = ({ file, fileName, forceFileType, diff --git a/lib/src/components/FileDrop/Message.tsx b/lib/src/components/FileDrop/Message.tsx new file mode 100644 index 0000000000..311b7d0a11 --- /dev/null +++ b/lib/src/components/FileDrop/Message.tsx @@ -0,0 +1,33 @@ +import React from 'react' + +import { FileDropChildren } from './index' + +import { Text } from '@/Text' +import { Button } from '@/Button' + +export interface MessageProps { + disabled?: boolean + openFile?: FileDropChildren['openFile'] +} + +export const Message: React.FC = ({ + disabled, + fileButtonText = 'Browse file', + hint = 'Drag & drop a file here or', + openFile, + title = 'Add file', +}) => { + return ( + <> + + {title} + + + {hint} + + + + ) +} diff --git a/lib/src/components/FileDrop/Preview.tsx b/lib/src/components/FileDrop/Preview.tsx new file mode 100644 index 0000000000..63d75ecf5f --- /dev/null +++ b/lib/src/components/FileDrop/Preview.tsx @@ -0,0 +1,40 @@ +import React from 'react' + +import { ImagePreview } from './styles' +import { Message } from './Message' +import { FilePreview } from './FilePreview' + +import { FileDropChildren } from './index' + +import { NegativeIcon, PositiveIcon } from '@/Icons' + +export const Preview: React.FC = ({ + disabled, + error, + file, + fileName, + fileUrl, + forceFileType, + isAnImage, + isHoverAccept, + isHoverReject, + openFile, + wordings, +}) => { + if (isHoverAccept) { + return + } else if (isHoverReject) { + return + } else if (error) { + return + } else if (fileUrl) { + if (isAnImage) { + return + } else { + return ( + + ) + } + } + return +} diff --git a/packages/FileDrop/docs/examples/custom-filename.tsx b/lib/src/components/FileDrop/docs/examples/custom-filename.tsx similarity index 89% rename from packages/FileDrop/docs/examples/custom-filename.tsx rename to lib/src/components/FileDrop/docs/examples/custom-filename.tsx index 35928905f1..114e7c5996 100644 --- a/packages/FileDrop/docs/examples/custom-filename.tsx +++ b/lib/src/components/FileDrop/docs/examples/custom-filename.tsx @@ -1,5 +1,6 @@ import * as React from 'react' -import { FileDrop } from '@welcome-ui/file-drop' + +import { FileDrop } from '@/FileDrop' const Example = () => { const handleChange = () => { diff --git a/lib/src/components/FileDrop/docs/examples/disabled.tsx b/lib/src/components/FileDrop/docs/examples/disabled.tsx new file mode 100644 index 0000000000..e39a6dd8e6 --- /dev/null +++ b/lib/src/components/FileDrop/docs/examples/disabled.tsx @@ -0,0 +1,9 @@ +import * as React from 'react' + +import { FileDrop } from '@/FileDrop' + +const Example = () => { + return +} + +export default Example diff --git a/packages/FileDrop/docs/examples/image.tsx b/lib/src/components/FileDrop/docs/examples/image.tsx similarity index 89% rename from packages/FileDrop/docs/examples/image.tsx rename to lib/src/components/FileDrop/docs/examples/image.tsx index ff911fb6f4..030718e779 100644 --- a/packages/FileDrop/docs/examples/image.tsx +++ b/lib/src/components/FileDrop/docs/examples/image.tsx @@ -1,5 +1,6 @@ import * as React from 'react' -import { FileDrop } from '@welcome-ui/file-drop' + +import { FileDrop } from '@/FileDrop' const Example = () => { const handleChange = () => { diff --git a/packages/FileDrop/docs/examples/no-type.tsx b/lib/src/components/FileDrop/docs/examples/no-type.tsx similarity index 95% rename from packages/FileDrop/docs/examples/no-type.tsx rename to lib/src/components/FileDrop/docs/examples/no-type.tsx index f0430b7bf0..2e80eb2987 100644 --- a/packages/FileDrop/docs/examples/no-type.tsx +++ b/lib/src/components/FileDrop/docs/examples/no-type.tsx @@ -1,5 +1,6 @@ import * as React from 'react' -import { FileDrop } from '@welcome-ui/file-drop' + +import { FileDrop } from '@/FileDrop' const Example = () => { const handleChange = () => { diff --git a/packages/FileDrop/docs/examples/others.tsx b/lib/src/components/FileDrop/docs/examples/others.tsx similarity index 91% rename from packages/FileDrop/docs/examples/others.tsx rename to lib/src/components/FileDrop/docs/examples/others.tsx index 072f97118c..4ed887a98b 100644 --- a/packages/FileDrop/docs/examples/others.tsx +++ b/lib/src/components/FileDrop/docs/examples/others.tsx @@ -1,5 +1,6 @@ import * as React from 'react' -import { FileDrop } from '@welcome-ui/file-drop' + +import { FileDrop } from '@/FileDrop' const Example = () => { const handleChange = () => { diff --git a/lib/src/components/FileDrop/docs/examples/overview.tsx b/lib/src/components/FileDrop/docs/examples/overview.tsx new file mode 100644 index 0000000000..16b50d560f --- /dev/null +++ b/lib/src/components/FileDrop/docs/examples/overview.tsx @@ -0,0 +1,22 @@ +import * as React from 'react' + +import { FileDrop } from '@/FileDrop' + +const Example = () => { + const handleChange = () => { + // your code + } + + return ( + + ) +} + +export default Example diff --git a/lib/src/components/FileDrop/docs/examples/preview.tsx b/lib/src/components/FileDrop/docs/examples/preview.tsx new file mode 100644 index 0000000000..21036e2a86 --- /dev/null +++ b/lib/src/components/FileDrop/docs/examples/preview.tsx @@ -0,0 +1,22 @@ +import * as React from 'react' + +import { FileDrop } from '@/FileDrop' + +const Example = () => { + const handleChange = () => { + // your code + } + + return ( + + ) +} + +export default Example diff --git a/packages/FileDrop/docs/examples/wordings.tsx b/lib/src/components/FileDrop/docs/examples/wordings.tsx similarity index 90% rename from packages/FileDrop/docs/examples/wordings.tsx rename to lib/src/components/FileDrop/docs/examples/wordings.tsx index e7a69b8520..14090b32b2 100644 --- a/packages/FileDrop/docs/examples/wordings.tsx +++ b/lib/src/components/FileDrop/docs/examples/wordings.tsx @@ -1,5 +1,6 @@ import * as React from 'react' -import { FileDrop } from '@welcome-ui/file-drop' + +import { FileDrop } from '@/FileDrop' const Example = () => { const handleChange = () => { diff --git a/lib/src/components/FileDrop/docs/index.mdx b/lib/src/components/FileDrop/docs/index.mdx new file mode 100644 index 0000000000..3c53d7357e --- /dev/null +++ b/lib/src/components/FileDrop/docs/index.mdx @@ -0,0 +1,63 @@ +--- +category: forms +description: The FileDrop component allows users to upload files by dragging and dropping them into a designated area or by clicking to select files from their device. It simplifies the file upload process with an intuitive, user-friendly interface, providing visual feedback and handling multiple files. This component is ideal for applications that require easy and efficient file uploads, improving overall user experience. +packageName: file-drop +title: FileDrop +peerDependencies: 'react-dropzone' +--- + +FileDrop uses render props to give you more flexibility on what to render at each state change: + +- `isDefault`: No file uploaded and no user interaction +- `isHoverAccept`: File is being dragged over and matches the `accept` string +- `isHoverReject`: File is being dragged over but does _not_ match the `accept` string + +You also have access to: + +- `openFile`: To open the native file chooser dialog box +- `fileUrl`: URL of file if one has been opened/dropped (to show a preview) + +By default, `accept`: is set to `{ "image/*": [] }`. See more about [showOpenFilePicker](https://developer.mozilla.org/en-US/docs/Web/API/window/showOpenFilePicker#examples) and [media type](https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Common_types). + +### Custom wordings + +By default: + +- `title`: is set to `"Add file"` +- `hint`: is set to `"Drag & drop a file here or"` +- `fileButtonText`: is set to `"Browse file"` +- `previewButtonText`: is set to `"Preview"` + +You can override translations with a `wordings` object. + +
+ +#### With preview + +
+ +### Preview + +#### Image + +
+ +#### Other + +
+ +### Without type + +Sometime in the url we don't have the type of the file, you can override with `forceFileType` set to `image`, `audio` or `video`. + +
+ +### With a custom filename + +By default, the filename is retrieved from the url. If you want to display a custom filename, you can use the `fileName` prop. + +
+ +### Disabled + +
diff --git a/lib/src/components/FileDrop/docs/properties.json b/lib/src/components/FileDrop/docs/properties.json new file mode 100644 index 0000000000..aae06c4a76 --- /dev/null +++ b/lib/src/components/FileDrop/docs/properties.json @@ -0,0 +1,305 @@ +{ + "FileDrop": { + "props": { + "accept": { + "defaultValue": { + "value": "{\n 'image/*': [],\n }" + }, + "description": "Pass a comma-separated string of file types e.g. \"image/png\" or \"image/png,image/jpeg\"", + "name": "accept", + "parent": { + "fileName": "welcome-ui/lib/src/components/FileDrop/index.tsx", + "name": "FileDropOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/FileDrop/index.tsx", + "name": "FileDropOptions" + }, + { + "fileName": "welcome-ui/node_modules/react-dropzone/typings/react-dropzone.d.ts", + "name": "TypeLiteral" + } + ], + "required": false, + "type": { + "name": "Accept" + } + }, + "fileName": { + "defaultValue": null, + "description": "", + "name": "fileName", + "parent": { + "fileName": "welcome-ui/lib/src/components/FileDrop/index.tsx", + "name": "FileDropOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/FileDrop/index.tsx", + "name": "FileDropOptions" + } + ], + "required": false, + "type": { + "name": "string" + } + }, + "forceFileType": { + "defaultValue": null, + "description": "", + "name": "forceFileType", + "parent": { + "fileName": "welcome-ui/lib/src/components/FileDrop/index.tsx", + "name": "FileDropOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/FileDrop/index.tsx", + "name": "FileDropOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "ForceFileType", + "value": [ + { + "value": "\"audio\"" + }, + { + "value": "\"video\"" + }, + { + "value": "\"image\"" + } + ] + } + }, + "handleAddFile": { + "defaultValue": null, + "description": "", + "name": "handleAddFile", + "parent": { + "fileName": "welcome-ui/lib/src/components/FileDrop/index.tsx", + "name": "FileDropOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/FileDrop/index.tsx", + "name": "FileDropOptions" + } + ], + "required": false, + "type": { + "name": "(event: DropEvent | CreateEvent) => void" + } + }, + "handleRemoveFile": { + "defaultValue": null, + "description": "", + "name": "handleRemoveFile", + "parent": { + "fileName": "welcome-ui/lib/src/components/FileDrop/index.tsx", + "name": "FileDropOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/FileDrop/index.tsx", + "name": "FileDropOptions" + } + ], + "required": false, + "type": { + "name": "(event: DropEvent | CreateEvent) => void" + } + }, + "isClearable": { + "defaultValue": null, + "description": "", + "name": "isClearable", + "parent": { + "fileName": "welcome-ui/lib/src/components/FileDrop/index.tsx", + "name": "FileDropOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/FileDrop/index.tsx", + "name": "FileDropOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "isEditable": { + "defaultValue": null, + "description": "", + "name": "isEditable", + "parent": { + "fileName": "welcome-ui/lib/src/components/FileDrop/index.tsx", + "name": "FileDropOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/FileDrop/index.tsx", + "name": "FileDropOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "name": { + "defaultValue": null, + "description": "", + "name": "name", + "parent": { + "fileName": "welcome-ui/lib/src/components/FileDrop/index.tsx", + "name": "FileDropOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/FileDrop/index.tsx", + "name": "FileDropOptions" + } + ], + "required": false, + "type": { + "name": "string" + } + }, + "onBlur": { + "defaultValue": null, + "description": "", + "name": "onBlur", + "parent": { + "fileName": "welcome-ui/lib/src/components/FileDrop/index.tsx", + "name": "FileDropOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/FileDrop/index.tsx", + "name": "FileDropOptions" + } + ], + "required": false, + "type": { + "name": "() => void" + } + }, + "onChange": { + "defaultValue": null, + "description": "", + "name": "onChange", + "parent": { + "fileName": "welcome-ui/lib/src/components/FileDrop/index.tsx", + "name": "FileDropOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/FileDrop/index.tsx", + "name": "FileDropOptions" + } + ], + "required": false, + "type": { + "name": "(event: DropEvent | CreateEvent) => void" + } + }, + "onError": { + "defaultValue": null, + "description": "", + "name": "onError", + "parent": { + "fileName": "welcome-ui/lib/src/components/FileDrop/index.tsx", + "name": "FileDropOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/FileDrop/index.tsx", + "name": "FileDropOptions" + }, + { + "fileName": "welcome-ui/node_modules/react-dropzone/typings/react-dropzone.d.ts", + "name": "TypeLiteral" + } + ], + "required": false, + "type": { + "name": "((event?: string) => void) & ((err: Error) => void)" + } + }, + "value": { + "defaultValue": null, + "description": "", + "name": "value", + "parent": { + "fileName": "welcome-ui/lib/src/components/FileDrop/index.tsx", + "name": "FileDropOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/FileDrop/index.tsx", + "name": "FileDropOptions" + } + ], + "required": true, + "type": { + "name": "enum", + "raw": "FileType", + "value": [ + { + "value": "string" + }, + { + "value": "FileWithPreview", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "wordings": { + "defaultValue": null, + "description": "Pass an object with optional fields title, hint, fileButtonText and/or previewButtonText (string or JSX.Element)", + "name": "wordings", + "parent": { + "fileName": "welcome-ui/lib/src/components/FileDrop/index.tsx", + "name": "FileDropOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/FileDrop/index.tsx", + "name": "FileDropOptions" + } + ], + "required": false, + "type": { + "name": "WordingsType" + } + } + } + } +} \ No newline at end of file diff --git a/lib/src/components/FileDrop/index.tsx b/lib/src/components/FileDrop/index.tsx new file mode 100644 index 0000000000..49dba03f4d --- /dev/null +++ b/lib/src/components/FileDrop/index.tsx @@ -0,0 +1,238 @@ +import React, { useEffect, useState } from 'react' +import { + Accept, + DropEvent, + DropzoneProps, + DropzoneState, + FileError, + FileRejection, +} from 'react-dropzone' +import * as reactDropzone from 'react-dropzone' + +// because of this issue: https://github.com/react-dropzone/react-dropzone/issues/1259 +// eslint-disable-next-line @typescript-eslint/ban-ts-comment +// @ts-ignore +const useDropzone = (reactDropzone.useDropzone || reactDropzone.default.useDropzone) as ( + o?: DropzoneProps +) => DropzoneState +import { createEvent, CreateEvent } from '../../utils/create-event' + +import * as S from './styles' +import { Preview } from './Preview' +import { getPreviewUrl, isAnImage } from './utils' + +import { EditIcon, TrashIcon } from '@/Icons' +import { Button } from '@/Button' +import { ForceFileType } from '@/Files' +import { CreateWuiProps, forwardRef } from '@/System' + +const DEFAULT_MAX_FILE_SIZE = 2000000 +const ERROR_INVALID_TYPE = 'ERROR_INVALID_TYPE' +const ERROR_INVALID_SIZE = 'ERROR_INVALID_SIZE' + +export interface FileWithPreview extends File { + preview?: string +} +type FileType = string | FileWithPreview +type FileUrlType = string | URL +type OpenType = DropzoneState['open'] +type WordingsType = { + fileButtonText?: string | JSX.Element + hint?: string | JSX.Element + previewButtonText?: string | JSX.Element + title?: string | JSX.Element +} +export type FileDropChildren = { + disabled?: boolean + error?: string + file?: FileType + fileName?: string + fileUrl?: FileUrlType + forceFileType?: ForceFileType + isAnImage?: boolean + isHoverAccept?: DropzoneState['isDragAccept'] + isHoverReject?: DropzoneState['isDragReject'] + openFile?: OpenType + wordings?: WordingsType +} + +export interface FileDropOptions { + /** Pass a comma-separated string of file types e.g. "image/png" or "image/png,image/jpeg" */ + accept?: Accept + children?: (state: FileDropChildren) => JSX.Element + fileName?: string + forceFileType?: ForceFileType + handleAddFile?: (event: DropEvent | React.ChangeEvent | CreateEvent) => void + handleRemoveFile?: (event: DropEvent | React.ChangeEvent | CreateEvent) => void + isClearable?: boolean + isEditable?: boolean + name?: string + onBlur?: () => void + onChange?: (event: DropEvent | React.ChangeEvent | CreateEvent) => void + onError?: (event?: string) => void + value: FileType + /** Pass an object with optional fields title, hint, fileButtonText and/or previewButtonText (string or JSX.Element) */ + wordings?: WordingsType +} + +export type FileDropProps = CreateWuiProps<'div', FileDropOptions> & Omit + +export const FileDrop = forwardRef<'div', FileDropProps>( + ( + { + accept = { + 'image/*': [], + }, + children = Preview, + dataTestId, + disabled, + fileName, + forceFileType, + handleAddFile, + handleRemoveFile, + isClearable, + isEditable, + maxSize = DEFAULT_MAX_FILE_SIZE, + multiple, + name, + onBlur, + onChange, + onError, + value, + wordings, + ...rest + }, + ref + ) => { + const [file, setFile] = useState(value) + const [error, setError] = useState(undefined) + + useEffect(() => { + setFile(value) + }, [value]) + + // Clean up URL + useEffect(() => { + return () => file && file instanceof File && URL.revokeObjectURL(file.preview) + }, [file]) + + const handleDropAccepted = (files: FileWithPreview[]) => { + const [file] = files + if (file instanceof File) { + file.preview = URL.createObjectURL(file) + } + setFile(file) + setError(null) + + const event = createEvent({ name, value: file }) + onChange && onChange(event) + handleAddFile && handleAddFile(event) + } + + const handleDropRejected = (fileRejections: FileRejection[], event: DropEvent) => { + let errorMessage: string + + fileRejections.map(({ errors }: FileRejection) => { + errors.map((error: FileError) => { + const { code, message } = error + if (code === 'file-invalid-type') { + errorMessage = ERROR_INVALID_TYPE + } else if (code === 'file-too-large') { + errorMessage = ERROR_INVALID_SIZE + } else { + errorMessage = message + } + }) + }) + + setFile(null) + setError(errorMessage) + + onError && onError(errorMessage) + onChange && onChange(event) + onBlur && onBlur() // Trigger field touch + } + + const handleRemoveClick = (e: React.MouseEvent) => { + e.preventDefault() + setFile(null) + setError(null) + + const event = createEvent({ name, value: null }) + onChange && onChange(event) + handleRemoveFile && handleRemoveFile(event) + } + + const { getInputProps, getRootProps, isDragAccept, isDragActive, isDragReject, open } = + useDropzone({ + accept, + disabled, + maxSize, + multiple, + noClick: true, + onDropAccepted: handleDropAccepted, + onDropRejected: handleDropRejected, + }) + + const inputPropsOnError: React.ReactEventHandler = ( + event?: React.SyntheticEvent + ) => onError(event as never as string) + + return ( + + + + {children({ + disabled, + error, + file, + fileName, + fileUrl: file && getPreviewUrl(file), + forceFileType, + isAnImage: forceFileType === 'image' || isAnImage(file), + isHoverAccept: isDragAccept, + isHoverReject: isDragReject, + openFile: open, + wordings, + })} + {!!file && (error || isEditable || isClearable) && ( + + {(error || isEditable) && ( + + )} + {isClearable && ( + + )} + + )} + + + ) + } +) + +FileDrop.displayName = 'FileDrop' + +// Export `ImagePreview` from styles +export const ImagePreview = S.ImagePreview diff --git a/lib/src/components/FileDrop/styles.ts b/lib/src/components/FileDrop/styles.ts new file mode 100644 index 0000000000..f97ff1e966 --- /dev/null +++ b/lib/src/components/FileDrop/styles.ts @@ -0,0 +1,62 @@ +import styled, { css, system, th } from '@xstyled/styled-components' + +import { shouldForwardProp } from '@/System' + +export interface StyledFileDropProps { + disabled?: boolean + isDragAccept?: boolean + isDragReject?: boolean +} + +export const FileDrop = styled('div').withConfig({ shouldForwardProp })( + ({ disabled, isDragAccept, isDragReject }) => css` + ${th('defaultFields.default')}; + ${th('fileDrops.default')}; + ${isDragAccept && th('fileDrops.dragAccept')}; + ${isDragReject && + css` + border-color: ${th('defaultFields.variants.danger.borderColor')}; + ${th('fileDrops.dragReject')} + `}; + position: relative; + display: flex; + justify-content: center; + align-items: center; + padding: md; + transition: medium; + ${system}; + + &:focus { + ${th('defaultFields.focused.default')}; + } + + ${disabled && + css` + ${th('defaultFields.disabled')}; + ${th('fileDrops.disabled')}; + `}; + ` +) + +export const FilePreview = styled.div` + width: 100%; + height: 100%; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; +` + +export const ImagePreview = styled.imgBox` + max-height: 100%; + max-width: 100%; + object-fit: contain; +` + +export const Actions = styled.div` + position: absolute; + top: ${th.space('md')}; + right: ${th.space('md')}; + display: flex; + gap: xs; +` diff --git a/lib/src/components/FileDrop/theme.ts b/lib/src/components/FileDrop/theme.ts new file mode 100644 index 0000000000..ba32c0810e --- /dev/null +++ b/lib/src/components/FileDrop/theme.ts @@ -0,0 +1,26 @@ +import { CSSObject } from '@xstyled/styled-components' + +import { ThemeValues } from '@/theme' + +export type ThemeFileDrops = { + default: CSSObject + disabled: CSSObject + dragAccept: Record + dragReject: Record +} + +export const getFileDrops = (theme: ThemeValues): ThemeFileDrops => { + const { colors, toRem } = theme + + return { + default: { + minHeight: toRem(200), + borderStyle: 'dashed', + }, + dragAccept: {}, + dragReject: {}, + disabled: { + backgroundColor: colors['beige-30'], + }, + } +} diff --git a/lib/src/components/FileDrop/utils.ts b/lib/src/components/FileDrop/utils.ts new file mode 100644 index 0000000000..1d1c06954a --- /dev/null +++ b/lib/src/components/FileDrop/utils.ts @@ -0,0 +1,38 @@ +import { FileDropChildren } from './index' + +import { getFileName } from '@/Files' + +const match = /\.(jpeg|jpg|gif|png|webp)$/ + +export const isAnImage = (file: FileDropChildren['file']): boolean => { + if (!file) return false + + if (typeof file === 'string') { + return !!getFileName(file).match(match) + } else { + return file.name ? !!file.name.match(match) : false + } +} + +export const getPreviewUrl = (file: FileDropChildren['file']): FileDropChildren['fileUrl'] => { + let url + if (file instanceof File) { + url = file.preview + } else { + url = file + } + + if (typeof url !== 'string' || url.startsWith('blob:')) { + return url + } + + if (typeof window !== 'undefined') { + try { + return new URL(url) + } catch (error) { + return undefined + } + } + + return undefined +} diff --git a/packages/FileUpload/docs/examples/customize-button.tsx b/lib/src/components/FileUpload/docs/examples/customize-button.tsx similarity index 75% rename from packages/FileUpload/docs/examples/customize-button.tsx rename to lib/src/components/FileUpload/docs/examples/customize-button.tsx index 9e62d33af6..5255716824 100644 --- a/packages/FileUpload/docs/examples/customize-button.tsx +++ b/lib/src/components/FileUpload/docs/examples/customize-button.tsx @@ -1,7 +1,8 @@ import * as React from 'react' -import { FileUpload } from '@welcome-ui/file-upload' -import { Button } from '@welcome-ui/button' -import { UploadIcon } from '@welcome-ui/icons' + +import { FileUpload } from '@/FileUpload' +import { Button } from '@/Button' +import { UploadIcon } from '@/Icons' const Example = () => { const handleChange = () => { diff --git a/packages/FileUpload/docs/examples/customize-preview-2.tsx b/lib/src/components/FileUpload/docs/examples/customize-preview-2.tsx similarity index 85% rename from packages/FileUpload/docs/examples/customize-preview-2.tsx rename to lib/src/components/FileUpload/docs/examples/customize-preview-2.tsx index 50b64d40bc..381e2d4bab 100644 --- a/packages/FileUpload/docs/examples/customize-preview-2.tsx +++ b/lib/src/components/FileUpload/docs/examples/customize-preview-2.tsx @@ -1,8 +1,9 @@ import * as React from 'react' -import { FileUpload } from '@welcome-ui/file-upload' -import { Button } from '@welcome-ui/button' -import { getFileIcon } from '@welcome-ui/files' -import { Stack } from '@welcome-ui/stack' + +import { FileUpload } from '@/FileUpload' +import { Button } from '@/Button' +import { getFileIcon } from '@/Files' +import { Stack } from '@/Stack' const Example = () => { const handleChange = () => { diff --git a/packages/FileUpload/docs/examples/customize-preview.tsx b/lib/src/components/FileUpload/docs/examples/customize-preview.tsx similarity index 76% rename from packages/FileUpload/docs/examples/customize-preview.tsx rename to lib/src/components/FileUpload/docs/examples/customize-preview.tsx index 4301cc47f4..a144107f52 100644 --- a/packages/FileUpload/docs/examples/customize-preview.tsx +++ b/lib/src/components/FileUpload/docs/examples/customize-preview.tsx @@ -1,17 +1,18 @@ import * as React from 'react' -import { FileUpload, PreviewProps } from '@welcome-ui/file-upload' -import { Button } from '@welcome-ui/button' -import { getFileIcon, getFileName, getFileSize } from '@welcome-ui/files' -import { CrossIcon } from '@welcome-ui/icons' -import { Tag } from '@welcome-ui/tag' -import { Box } from '@welcome-ui/box' + +import { FileUpload, FileUploadPreviewProps } from '@/FileUpload' +import { Button } from '@/Button' +import { getFileIcon, getFileName, getFileSize } from '@/Files' +import { CrossIcon } from '@/Icons' +import { Tag } from '@/Tag' +import { Box } from '@/Box' const Example = () => { const handleChange = () => { // your code } - const Preview = ({ file, onRemove }: PreviewProps) => + const Preview = ({ file, onRemove }: FileUploadPreviewProps) => React.useMemo(() => { const Icon = getFileIcon(file) const name = getFileName(file) diff --git a/lib/src/components/FileUpload/docs/examples/disabled.tsx b/lib/src/components/FileUpload/docs/examples/disabled.tsx new file mode 100644 index 0000000000..6af0768716 --- /dev/null +++ b/lib/src/components/FileUpload/docs/examples/disabled.tsx @@ -0,0 +1,18 @@ +import * as React from 'react' + +import { FileUpload } from '@/FileUpload' +import { Button } from '@/Button' + +const Example = () => { + return ( + + {({ disabled, openFile }) => ( + + )} + + ) +} + +export default Example diff --git a/lib/src/components/FileUpload/docs/examples/multiple.tsx b/lib/src/components/FileUpload/docs/examples/multiple.tsx new file mode 100644 index 0000000000..774b590339 --- /dev/null +++ b/lib/src/components/FileUpload/docs/examples/multiple.tsx @@ -0,0 +1,29 @@ +import * as React from 'react' + +import { FileUpload } from '@/FileUpload' +import { Button } from '@/Button' + +const Example = () => { + const handleChange = () => { + // your code + } + + return ( + + {({ disabled, openFile }) => ( + + )} + + ) +} + +export default Example diff --git a/lib/src/components/FileUpload/docs/examples/overview.tsx b/lib/src/components/FileUpload/docs/examples/overview.tsx new file mode 100644 index 0000000000..5caa63da20 --- /dev/null +++ b/lib/src/components/FileUpload/docs/examples/overview.tsx @@ -0,0 +1,30 @@ +import * as React from 'react' + +import { FileUpload } from '@/FileUpload' +import { Button } from '@/Button' +import { Field } from '@/Field' + +const Example = () => { + const handleChange = () => { + // your code + } + + return ( + + { + //error + }} + value="" + > + {({ openFile }) => } + + + ) +} + +export default Example diff --git a/lib/src/components/FileUpload/docs/examples/preview.tsx b/lib/src/components/FileUpload/docs/examples/preview.tsx new file mode 100644 index 0000000000..4e244e7d07 --- /dev/null +++ b/lib/src/components/FileUpload/docs/examples/preview.tsx @@ -0,0 +1,21 @@ +import * as React from 'react' + +import { FileUpload } from '@/FileUpload' + +const Example = () => { + const handleChange = () => { + // your code + } + + return ( + + ) +} + +export default Example diff --git a/packages/FileUpload/docs/index.mdx b/lib/src/components/FileUpload/docs/index.mdx similarity index 100% rename from packages/FileUpload/docs/index.mdx rename to lib/src/components/FileUpload/docs/index.mdx diff --git a/lib/src/components/FileUpload/docs/properties.json b/lib/src/components/FileUpload/docs/properties.json new file mode 100644 index 0000000000..1c8e544e2b --- /dev/null +++ b/lib/src/components/FileUpload/docs/properties.json @@ -0,0 +1,143 @@ +{ + "FileUpload": { + "props": { + "accept": { + "defaultValue": { + "value": "*/*" + }, + "description": "Pass a comma-separated string of file types e.g. \"image/png\" or \"image/png,image/jpeg\"", + "name": "accept", + "parent": { + "fileName": "welcome-ui/lib/src/components/FileUpload/index.tsx", + "name": "FileUploadOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/FileUpload/index.tsx", + "name": "FileUploadOptions" + } + ], + "required": false, + "type": { + "name": "string" + } + }, + "handleAddFile": { + "defaultValue": null, + "description": "", + "name": "handleAddFile", + "parent": { + "fileName": "welcome-ui/lib/src/components/FileUpload/index.tsx", + "name": "FileUploadOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/FileUpload/index.tsx", + "name": "FileUploadOptions" + } + ], + "required": false, + "type": { + "name": "(files: FileWithPreviewType | FileWithPreviewType[]) => void" + } + }, + "handleRemoveFile": { + "defaultValue": null, + "description": "", + "name": "handleRemoveFile", + "parent": { + "fileName": "welcome-ui/lib/src/components/FileUpload/index.tsx", + "name": "FileUploadOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/FileUpload/index.tsx", + "name": "FileUploadOptions" + } + ], + "required": false, + "type": { + "name": "HandleRemoveType" + } + }, + "maxSize": { + "defaultValue": { + "value": 2000000 + }, + "description": "", + "name": "maxSize", + "parent": { + "fileName": "welcome-ui/lib/src/components/FileUpload/index.tsx", + "name": "FileUploadOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/FileUpload/index.tsx", + "name": "FileUploadOptions" + } + ], + "required": false, + "type": { + "name": "number" + } + }, + "onBlur": { + "defaultValue": null, + "description": "", + "name": "onBlur", + "parent": { + "fileName": "welcome-ui/lib/src/components/FileUpload/index.tsx", + "name": "FileUploadOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/FileUpload/index.tsx", + "name": "FileUploadOptions" + } + ], + "required": false, + "type": { + "name": "() => void" + } + }, + "onChange": { + "defaultValue": null, + "description": "", + "name": "onChange", + "parent": { + "fileName": "welcome-ui/lib/src/components/FileUpload/index.tsx", + "name": "FileUploadOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/FileUpload/index.tsx", + "name": "FileUploadOptions" + } + ], + "required": false, + "type": { + "name": "(event: { preventDefault: () => void; target: Record; }) => void" + } + }, + "preview": { + "defaultValue": null, + "description": "", + "name": "preview", + "parent": { + "fileName": "welcome-ui/lib/src/components/FileUpload/index.tsx", + "name": "FileUploadOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/FileUpload/index.tsx", + "name": "FileUploadOptions" + } + ], + "required": false, + "type": { + "name": "FC" + } + } + } + } +} \ No newline at end of file diff --git a/lib/src/components/FileUpload/index.tsx b/lib/src/components/FileUpload/index.tsx new file mode 100644 index 0000000000..6aa4af1e49 --- /dev/null +++ b/lib/src/components/FileUpload/index.tsx @@ -0,0 +1,195 @@ +import React, { useEffect, useRef, useState } from 'react' + +import { createEvent } from '../../utils/create-event' + +import * as S from './styles' + +import { Button } from '@/Button' +import { CreateWuiProps, forwardRef } from '@/System' +import { FileType, getFileIcon, getFileName, getFileSize } from '@/Files' +import { Tag, TagProps } from '@/Tag' +import { Box } from '@/Box' + +const DEFAULT_MAX_FILE_SIZE = 2000000 +const DEFAULT_FILE_TYPES = '*/*' + +type FileWithPreview = File & { + name?: string + preview?: string +} +type FileWithPreviewType = FileWithPreview | string +type HandleRemoveType = (file: FileWithPreviewType) => void + +export type FileUploadPreviewProps = { + file: FileType + onRemove: TagProps['onRemove'] +} + +export interface FileUploadOptions { + /** Pass a comma-separated string of file types e.g. "image/png" or "image/png,image/jpeg" */ + accept?: string + children?: (props: { + disabled: boolean + files: FileWithPreviewType[] + onRemoveFile: HandleRemoveType + openFile: () => void + }) => React.ReactNode + handleAddFile?: (files: FileWithPreviewType[] | FileWithPreviewType) => void + handleRemoveFile?: HandleRemoveType + maxSize?: number + onBlur?: () => void + onChange?: (event: ReturnType) => void + preview?: typeof DefaultPreview +} + +export type FileUploadProps = CreateWuiProps<'input', FileUploadOptions> + +const ensureArray: (value: unknown[] | unknown) => FileWithPreviewType[] = value => { + if (Array.isArray(value)) { + return value + } else if (value) { + return [value] + } + return [] +} + +const DefaultPreview: React.FC = ({ file, onRemove }) => { + const Icon = getFileIcon(file) + const name = getFileName(file) + const size = getFileSize(file) + + return ( + + + {name} + {size && ({size})} + + ) +} + +export const FileUpload = forwardRef<'input', FileUploadProps>( + ( + { + accept = DEFAULT_FILE_TYPES, + children, + dataTestId, + disabled, + // eslint-disable-next-line @typescript-eslint/no-unused-vars + draggable, + handleAddFile, + handleRemoveFile, + maxSize = DEFAULT_MAX_FILE_SIZE, + multiple, + name, + onBlur, + onChange, + // eslint-disable-next-line @typescript-eslint/no-unused-vars + onError, + preview: Preview = DefaultPreview, + value = [], + ...rest + }, + ref + ) => { + // We always keep an array of files + const [files, setFiles] = useState(ensureArray(value)) + const inputRef = useRef() + + // Ensure component is controlled + useEffect(() => { + setFiles(ensureArray(value)) + }, [value]) + + // Clean up URL on unmount + useEffect(() => { + return () => { + files && + files.map(file => (file instanceof File ? URL.revokeObjectURL(file.preview) : file)) + } + }, [files]) + + const handleChange: React.ChangeEventHandler = e => { + let newFiles: FileWithPreview[] | FileWithPreview = Array.from(e.target.files).map( + (file: FileWithPreview) => { + file.preview = URL.createObjectURL(file) + return file + } + ) + setFiles(newFiles) + + if (newFiles.length === 1) { + newFiles = newFiles[0] + } + + const event = createEvent({ name, value: newFiles }) + onChange && onChange(event) + handleAddFile && handleAddFile(newFiles) + onBlur && onBlur() + } + + const handleRemove: FileUploadProps['handleRemoveFile'] = removedFile => { + const newFiles = files.filter(file => file !== removedFile) + const value = multiple ? newFiles : undefined + setFiles(newFiles) + + const event = createEvent({ name, value }) + onChange && onChange(event) + handleRemoveFile && handleRemoveFile(removedFile) + onBlur && onBlur() + } + + const handleClick = () => { + inputRef.current.click() + } + + // We need to add this key on the input[file] because we can't change it's value programmatically for security reasons + // Changing its key means that we can add a file, remove it & re-add it + const inputKey = files.map(file => (file instanceof File ? file.preview : undefined)).join('') + + return ( + <> + {children ? ( + children({ openFile: handleClick, disabled, files, onRemoveFile: handleRemove }) + ) : ( + + )} +
+ { + // for internal use only + inputRef.current = instance + // for external use + if (typeof ref === 'function') { + ref(instance) + } else if (ref?.current) { + ref.current = instance + } + }} + {...rest} + type="file" + /> + {Preview && + files.map(file => ( + handleRemove(file)} + /> + ))} + + ) + } +) + +FileUpload.displayName = 'FileUpload' diff --git a/lib/src/components/FileUpload/styles.ts b/lib/src/components/FileUpload/styles.ts new file mode 100644 index 0000000000..94730f37b8 --- /dev/null +++ b/lib/src/components/FileUpload/styles.ts @@ -0,0 +1,7 @@ +import styled from '@xstyled/styled-components' + +import { shouldForwardProp } from '@/System' + +export const Input = styled.inputBox.withConfig({ shouldForwardProp })` + display: none; +` diff --git a/lib/src/components/Files/index.ts b/lib/src/components/Files/index.ts new file mode 100644 index 0000000000..c2c6402f26 --- /dev/null +++ b/lib/src/components/Files/index.ts @@ -0,0 +1,94 @@ +import React from 'react' + +import { formatBytes } from '../../utils/format-bytes' + +import { types } from './types' + +import { + AttachmentIcon, + CameraIcon, + CsvIcon, + DocIcon, + DocxIcon, + MusicIcon, + PdfIcon, + PptIcon, + VideoIcon, + XlsIcon, + XlsxIcon, + ZipIcon, +} from '@/Icons' +import { IconProps } from '@/Icon' + +export type FileType = string | File +export type ForceFileType = 'image' | 'audio' | 'video' + +function removeQueryString(name: string): string { + return name.split('?')[0] +} + +export function getFileName(file: FileType): string { + if (typeof file === 'string') { + return removeQueryString(file).split('/').pop() + } else { + return file.name + } +} + +export function getMimeType(file: FileType): string { + if (typeof file === 'string') { + const fileName = getFileName(file).split('.').pop() + return types[fileName] || null + } else { + return file.type + } +} + +export function getFileSize(file: FileType): string { + return file instanceof File && file.size ? formatBytes(file.size, 0) : null +} + +export function getFileIcon(file: FileType, forceFileType?: ForceFileType): React.FC { + const mimeType = getMimeType(file) + + if (!forceFileType && !mimeType) { + return AttachmentIcon + } + + if (forceFileType === 'image' || (mimeType && mimeType.startsWith('image/'))) { + return CameraIcon + } + if (forceFileType === 'audio' || (mimeType && mimeType.startsWith('audio/'))) { + return MusicIcon + } + if (forceFileType === 'video' || (mimeType && mimeType.startsWith('video/'))) { + return VideoIcon + } + + switch (mimeType) { + case 'application/pdf': + return PdfIcon + case 'application/msword': + return DocIcon + case 'application/vnd.openxmlformats-officedocument.wordprocessingml.document': + return DocxIcon + case 'application/vnd.ms-excel': + return XlsIcon + case 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet': + return XlsxIcon + case 'application/vnd.ms-powerpoint': + case 'application/vnd.openxmlformats-officedocument.presentationml.presentation': + return PptIcon + case 'application/zip': + case 'application/x-bzip': + case 'application/x-bzip2': + case 'application/x-7z-compressed': + case 'application/gzip': + case 'application/vnd.rar': + return ZipIcon + case 'text/csv': + return CsvIcon + default: + return AttachmentIcon + } +} diff --git a/packages/Files/tests/index.test.ts b/lib/src/components/Files/tests/index.test.ts similarity index 97% rename from packages/Files/tests/index.test.ts rename to lib/src/components/Files/tests/index.test.ts index 2861cfba13..f8e05361c2 100644 --- a/packages/Files/tests/index.test.ts +++ b/lib/src/components/Files/tests/index.test.ts @@ -1,7 +1,6 @@ -import { CameraIcon, PdfIcon, PptIcon } from '@welcome-ui/icons' - -import { Type } from '../src/types' -import { getFileIcon, getFileName, getFileSize, getMimeType } from '../src' +import { CameraIcon, PdfIcon, PptIcon } from '../../Icons' +import { Type } from '../types' +import { getFileIcon, getFileName, getFileSize, getMimeType } from '../' function generateFile(name: string, type: Type) { const file = new File(['we-hire-at-welcome-to-the-jungle'], name, { type }) diff --git a/packages/Files/src/types.ts b/lib/src/components/Files/types.ts similarity index 100% rename from packages/Files/src/types.ts rename to lib/src/components/Files/types.ts diff --git a/lib/src/components/Flex/docs/examples/overview.tsx b/lib/src/components/Flex/docs/examples/overview.tsx new file mode 100644 index 0000000000..10ab6b2896 --- /dev/null +++ b/lib/src/components/Flex/docs/examples/overview.tsx @@ -0,0 +1,18 @@ +import * as React from 'react' + +import { Flex } from '@/Flex' +import { Box } from '@/Box' + +const Example = () => { + return ( + + + + + + + + ) +} + +export default Example diff --git a/packages/Flex/docs/index.mdx b/lib/src/components/Flex/docs/index.mdx similarity index 100% rename from packages/Flex/docs/index.mdx rename to lib/src/components/Flex/docs/index.mdx diff --git a/lib/src/components/Flex/docs/properties.json b/lib/src/components/Flex/docs/properties.json new file mode 100644 index 0000000000..54ad596623 --- /dev/null +++ b/lib/src/components/Flex/docs/properties.json @@ -0,0 +1,424 @@ +{ + "Flex": { + "props": { + "align": { + "defaultValue": null, + "description": "same as alignItems", + "name": "align", + "parent": { + "fileName": "welcome-ui/lib/src/components/Flex/index.tsx", + "name": "FlexOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Flex/index.tsx", + "name": "FlexOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "SystemProp", + "value": [ + { + "value": "\"-moz-initial\"" + }, + { + "value": "\"inherit\"" + }, + { + "value": "\"initial\"" + }, + { + "value": "\"revert\"" + }, + { + "value": "\"revert-layer\"" + }, + { + "value": "\"unset\"" + }, + { + "value": "\"center\"" + }, + { + "value": "\"end\"" + }, + { + "value": "\"flex-end\"" + }, + { + "value": "\"flex-start\"" + }, + { + "value": "\"self-end\"" + }, + { + "value": "\"self-start\"" + }, + { + "value": "\"start\"" + }, + { + "value": "\"baseline\"" + }, + { + "value": "\"normal\"" + }, + { + "value": "\"stretch\"" + }, + { + "value": "string & {}" + }, + { + "value": "ThemeProp", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "basis": { + "defaultValue": null, + "description": "same as flexBasis", + "name": "basis", + "parent": { + "fileName": "welcome-ui/lib/src/components/Flex/index.tsx", + "name": "FlexOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Flex/index.tsx", + "name": "FlexOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "SystemProp", + "value": [ + { + "value": "string" + }, + { + "value": "number" + }, + { + "value": "string & {}" + }, + { + "value": "ThemeProp", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "direction": { + "defaultValue": null, + "description": "same as flexDirection", + "name": "direction", + "parent": { + "fileName": "welcome-ui/lib/src/components/Flex/index.tsx", + "name": "FlexOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Flex/index.tsx", + "name": "FlexOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "SystemProp", + "value": [ + { + "value": "\"row\"" + }, + { + "value": "\"-moz-initial\"" + }, + { + "value": "\"inherit\"" + }, + { + "value": "\"initial\"" + }, + { + "value": "\"revert\"" + }, + { + "value": "\"revert-layer\"" + }, + { + "value": "\"unset\"" + }, + { + "value": "\"column\"" + }, + { + "value": "\"column-reverse\"" + }, + { + "value": "\"row-reverse\"" + }, + { + "value": "ThemeProp", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "grow": { + "defaultValue": null, + "description": "same as flexGrow", + "name": "grow", + "parent": { + "fileName": "welcome-ui/lib/src/components/Flex/index.tsx", + "name": "FlexOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Flex/index.tsx", + "name": "FlexOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "SystemProp", + "value": [ + { + "value": "\"-moz-initial\"" + }, + { + "value": "\"inherit\"" + }, + { + "value": "\"initial\"" + }, + { + "value": "\"revert\"" + }, + { + "value": "\"revert-layer\"" + }, + { + "value": "\"unset\"" + }, + { + "value": "string & {}" + }, + { + "value": "number & {}" + }, + { + "value": "ThemeProp", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "justify": { + "defaultValue": null, + "description": "same as justifyContent", + "name": "justify", + "parent": { + "fileName": "welcome-ui/lib/src/components/Flex/index.tsx", + "name": "FlexOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Flex/index.tsx", + "name": "FlexOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "SystemProp", + "value": [ + { + "value": "\"right\"" + }, + { + "value": "\"left\"" + }, + { + "value": "\"-moz-initial\"" + }, + { + "value": "\"inherit\"" + }, + { + "value": "\"initial\"" + }, + { + "value": "\"revert\"" + }, + { + "value": "\"revert-layer\"" + }, + { + "value": "\"unset\"" + }, + { + "value": "\"center\"" + }, + { + "value": "\"end\"" + }, + { + "value": "\"flex-end\"" + }, + { + "value": "\"flex-start\"" + }, + { + "value": "\"start\"" + }, + { + "value": "\"normal\"" + }, + { + "value": "\"stretch\"" + }, + { + "value": "string & {}" + }, + { + "value": "\"space-around\"" + }, + { + "value": "\"space-between\"" + }, + { + "value": "\"space-evenly\"" + }, + { + "value": "ThemeProp", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "shrink": { + "defaultValue": null, + "description": "same as flexShrink", + "name": "shrink", + "parent": { + "fileName": "welcome-ui/lib/src/components/Flex/index.tsx", + "name": "FlexOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Flex/index.tsx", + "name": "FlexOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "SystemProp", + "value": [ + { + "value": "\"-moz-initial\"" + }, + { + "value": "\"inherit\"" + }, + { + "value": "\"initial\"" + }, + { + "value": "\"revert\"" + }, + { + "value": "\"revert-layer\"" + }, + { + "value": "\"unset\"" + }, + { + "value": "string & {}" + }, + { + "value": "number & {}" + }, + { + "value": "ThemeProp", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "wrap": { + "defaultValue": null, + "description": "same as flexWrap", + "name": "wrap", + "parent": { + "fileName": "welcome-ui/lib/src/components/Flex/index.tsx", + "name": "FlexOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Flex/index.tsx", + "name": "FlexOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "SystemProp", + "value": [ + { + "value": "\"wrap\"" + }, + { + "value": "\"-moz-initial\"" + }, + { + "value": "\"inherit\"" + }, + { + "value": "\"initial\"" + }, + { + "value": "\"revert\"" + }, + { + "value": "\"revert-layer\"" + }, + { + "value": "\"unset\"" + }, + { + "value": "\"nowrap\"" + }, + { + "value": "\"wrap-reverse\"" + }, + { + "value": "ThemeProp", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + } + } + } +} \ No newline at end of file diff --git a/lib/src/components/Flex/index.tsx b/lib/src/components/Flex/index.tsx new file mode 100644 index 0000000000..1b4dea099c --- /dev/null +++ b/lib/src/components/Flex/index.tsx @@ -0,0 +1,45 @@ +import React from 'react' + +import { CreateWuiProps, forwardRef, WuiProps } from '@/System' +import { Box } from '@/Box' + +export interface FlexOptions { + /** same as alignItems */ + align?: WuiProps['alignItems'] + /** same as flexBasis */ + basis?: WuiProps['flexBasis'] + /** same as flexDirection */ + direction?: WuiProps['flexDirection'] + /** same as flexGrow */ + grow?: WuiProps['flexGrow'] + /** same as justifyContent */ + justify?: WuiProps['justifyContent'] + /** same as flexShrink */ + shrink?: WuiProps['flexShrink'] + /** same as flexWrap */ + wrap?: WuiProps['flexWrap'] +} + +export type FlexProps = CreateWuiProps<'div', FlexOptions> + +export const Flex = forwardRef<'div', FlexProps>( + ({ align, basis, dataTestId, direction, grow, justify, shrink, wrap, ...rest }, ref) => { + return ( + + ) + } +) + +Flex.displayName = 'Flex' diff --git a/lib/src/components/Flex/tests/index.test.tsx b/lib/src/components/Flex/tests/index.test.tsx new file mode 100644 index 0000000000..351f46cc47 --- /dev/null +++ b/lib/src/components/Flex/tests/index.test.tsx @@ -0,0 +1,20 @@ +import React from 'react' + +import { Flex } from '../' +import { render } from '../../../../tests' + +const content = 'Jungle' + +describe('', () => { + it('should render correctly', () => { + const { getByTestId } = render( + + {content} + + ) + const element = getByTestId('flex') + + expect(element).toHaveTextContent(content) + expect(element).toHaveStyleRule('display', 'flex') + }) +}) diff --git a/lib/src/components/Grid/Item.tsx b/lib/src/components/Grid/Item.tsx new file mode 100644 index 0000000000..1e8ee05b94 --- /dev/null +++ b/lib/src/components/Grid/Item.tsx @@ -0,0 +1,33 @@ +import React from 'react' + +import { Box } from '@/Box' +import { CreateWuiProps, forwardRef, WuiProps } from '@/System' + +export interface ItemOptions { + /** same as gridArea */ + area?: WuiProps['gridArea'] + /** same as gridColumn */ + column?: WuiProps['gridColumn'] + /** same as gridRow */ + row?: WuiProps['row'] +} + +export type ItemProps = CreateWuiProps<'div', ItemOptions> + +/** + * @name Grid.Item + */ +export const Item = forwardRef<'div', ItemProps>( + ({ area, column, dataTestId, row, ...rest }, ref) => { + return ( + + ) + } +) diff --git a/packages/Grid/docs/examples/item.tsx b/lib/src/components/Grid/docs/examples/item.tsx similarity index 92% rename from packages/Grid/docs/examples/item.tsx rename to lib/src/components/Grid/docs/examples/item.tsx index 503b024e63..ee0d2c543c 100644 --- a/packages/Grid/docs/examples/item.tsx +++ b/lib/src/components/Grid/docs/examples/item.tsx @@ -1,5 +1,6 @@ import * as React from 'react' -import { Grid } from '@welcome-ui/grid' + +import { Grid } from '@/Grid' const Example = () => { return ( diff --git a/lib/src/components/Grid/docs/examples/overview.tsx b/lib/src/components/Grid/docs/examples/overview.tsx new file mode 100644 index 0000000000..b676ff16aa --- /dev/null +++ b/lib/src/components/Grid/docs/examples/overview.tsx @@ -0,0 +1,18 @@ +import * as React from 'react' + +import { Grid } from '@/Grid' +import { Box } from '@/Box' + +const Example = () => { + return ( + + + + + + + + ) +} + +export default Example diff --git a/packages/Grid/docs/index.mdx b/lib/src/components/Grid/docs/index.mdx similarity index 100% rename from packages/Grid/docs/index.mdx rename to lib/src/components/Grid/docs/index.mdx diff --git a/lib/src/components/Grid/docs/properties.json b/lib/src/components/Grid/docs/properties.json new file mode 100644 index 0000000000..30f7f7b949 --- /dev/null +++ b/lib/src/components/Grid/docs/properties.json @@ -0,0 +1,648 @@ +{ + "Grid": { + "props": { + "area": { + "defaultValue": null, + "description": "same as gridArea", + "name": "area", + "parent": { + "fileName": "welcome-ui/lib/src/components/Grid/index.tsx", + "name": "GridOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Grid/index.tsx", + "name": "GridOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "SystemProp", + "value": [ + { + "value": "\"-moz-initial\"" + }, + { + "value": "\"inherit\"" + }, + { + "value": "\"initial\"" + }, + { + "value": "\"revert\"" + }, + { + "value": "\"revert-layer\"" + }, + { + "value": "\"unset\"" + }, + { + "value": "\"auto\"" + }, + { + "value": "string & {}" + }, + { + "value": "number & {}" + }, + { + "value": "ThemeProp", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "autoColumns": { + "defaultValue": null, + "description": "same as gridAutoColumns", + "name": "autoColumns", + "parent": { + "fileName": "welcome-ui/lib/src/components/Grid/index.tsx", + "name": "GridOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Grid/index.tsx", + "name": "GridOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "SystemProp, Theme>", + "value": [ + { + "value": "0" + }, + { + "value": "\"-moz-initial\"" + }, + { + "value": "\"inherit\"" + }, + { + "value": "\"initial\"" + }, + { + "value": "\"revert\"" + }, + { + "value": "\"revert-layer\"" + }, + { + "value": "\"unset\"" + }, + { + "value": "\"auto\"" + }, + { + "value": "string & {}" + }, + { + "value": "\"max-content\"" + }, + { + "value": "\"min-content\"" + }, + { + "value": "ThemeProp, Theme>", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "autoFlow": { + "defaultValue": null, + "description": "same as gridAutoFlow", + "name": "autoFlow", + "parent": { + "fileName": "welcome-ui/lib/src/components/Grid/index.tsx", + "name": "GridOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Grid/index.tsx", + "name": "GridOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "SystemProp", + "value": [ + { + "value": "\"row\"" + }, + { + "value": "\"column\"" + }, + { + "value": "\"-moz-initial\"" + }, + { + "value": "\"inherit\"" + }, + { + "value": "\"initial\"" + }, + { + "value": "\"revert\"" + }, + { + "value": "\"revert-layer\"" + }, + { + "value": "\"unset\"" + }, + { + "value": "string & {}" + }, + { + "value": "\"dense\"" + }, + { + "value": "ThemeProp", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "autoRows": { + "defaultValue": null, + "description": "same as gridAutoRows", + "name": "autoRows", + "parent": { + "fileName": "welcome-ui/lib/src/components/Grid/index.tsx", + "name": "GridOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Grid/index.tsx", + "name": "GridOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "SystemProp, Theme>", + "value": [ + { + "value": "0" + }, + { + "value": "\"-moz-initial\"" + }, + { + "value": "\"inherit\"" + }, + { + "value": "\"initial\"" + }, + { + "value": "\"revert\"" + }, + { + "value": "\"revert-layer\"" + }, + { + "value": "\"unset\"" + }, + { + "value": "\"auto\"" + }, + { + "value": "string & {}" + }, + { + "value": "\"max-content\"" + }, + { + "value": "\"min-content\"" + }, + { + "value": "ThemeProp, Theme>", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "column": { + "defaultValue": null, + "description": "same as gridColumn", + "name": "column", + "parent": { + "fileName": "welcome-ui/lib/src/components/Grid/index.tsx", + "name": "GridOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Grid/index.tsx", + "name": "GridOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "SystemProp", + "value": [ + { + "value": "\"-moz-initial\"" + }, + { + "value": "\"inherit\"" + }, + { + "value": "\"initial\"" + }, + { + "value": "\"revert\"" + }, + { + "value": "\"revert-layer\"" + }, + { + "value": "\"unset\"" + }, + { + "value": "\"auto\"" + }, + { + "value": "string & {}" + }, + { + "value": "number & {}" + }, + { + "value": "ThemeProp", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "columnGap": { + "defaultValue": null, + "description": "same as columnGap", + "name": "columnGap", + "parent": { + "fileName": "welcome-ui/lib/src/components/Grid/index.tsx", + "name": "GridOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Grid/index.tsx", + "name": "GridOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "SystemProp", + "value": [ + { + "value": "string" + }, + { + "value": "number" + }, + { + "value": "true" + }, + { + "value": "symbol" + }, + { + "value": "{}", + "description": "", + "fullComment": "", + "tags": {} + }, + { + "value": "string & {}" + }, + { + "value": "ThemeProp", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "gap": { + "defaultValue": null, + "description": "same as gridGap", + "name": "gap", + "parent": { + "fileName": "welcome-ui/lib/src/components/Grid/index.tsx", + "name": "GridOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Grid/index.tsx", + "name": "GridOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "SystemProp", + "value": [ + { + "value": "string" + }, + { + "value": "number" + }, + { + "value": "true" + }, + { + "value": "symbol" + }, + { + "value": "{}", + "description": "", + "fullComment": "", + "tags": {} + }, + { + "value": "string & {}" + }, + { + "value": "ThemeProp", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "row": { + "defaultValue": null, + "description": "same as gridRow", + "name": "row", + "parent": { + "fileName": "welcome-ui/lib/src/components/Grid/index.tsx", + "name": "GridOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Grid/index.tsx", + "name": "GridOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "SystemProp", + "value": [ + { + "value": "\"-moz-initial\"" + }, + { + "value": "\"inherit\"" + }, + { + "value": "\"initial\"" + }, + { + "value": "\"revert\"" + }, + { + "value": "\"revert-layer\"" + }, + { + "value": "\"unset\"" + }, + { + "value": "\"auto\"" + }, + { + "value": "string & {}" + }, + { + "value": "number & {}" + }, + { + "value": "ThemeProp", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "rowGap": { + "defaultValue": null, + "description": "same as gridRowGap", + "name": "rowGap", + "parent": { + "fileName": "welcome-ui/lib/src/components/Grid/index.tsx", + "name": "GridOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Grid/index.tsx", + "name": "GridOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "SystemProp", + "value": [ + { + "value": "string" + }, + { + "value": "number" + }, + { + "value": "true" + }, + { + "value": "symbol" + }, + { + "value": "{}", + "description": "", + "fullComment": "", + "tags": {} + }, + { + "value": "string & {}" + }, + { + "value": "ThemeProp", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "templateAreas": { + "defaultValue": null, + "description": "same as gridTemplateAreas", + "name": "templateAreas", + "parent": { + "fileName": "welcome-ui/lib/src/components/Grid/index.tsx", + "name": "GridOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Grid/index.tsx", + "name": "GridOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "SystemProp", + "value": [ + { + "value": "\"-moz-initial\"" + }, + { + "value": "\"inherit\"" + }, + { + "value": "\"initial\"" + }, + { + "value": "\"revert\"" + }, + { + "value": "\"revert-layer\"" + }, + { + "value": "\"unset\"" + }, + { + "value": "string & {}" + }, + { + "value": "\"none\"" + }, + { + "value": "ThemeProp", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "templateColumns": { + "defaultValue": null, + "description": "same as gridTemplateColumns", + "name": "templateColumns", + "parent": { + "fileName": "welcome-ui/lib/src/components/Grid/index.tsx", + "name": "GridOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Grid/index.tsx", + "name": "GridOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "SystemProp", + "value": [ + { + "value": "string" + }, + { + "value": "number" + }, + { + "value": "true" + }, + { + "value": "symbol" + }, + { + "value": "{}", + "description": "", + "fullComment": "", + "tags": {} + }, + { + "value": "string & {}" + }, + { + "value": "ThemeProp", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + }, + "templateRows": { + "defaultValue": null, + "description": "same as gridTemplateRows", + "name": "templateRows", + "parent": { + "fileName": "welcome-ui/lib/src/components/Grid/index.tsx", + "name": "GridOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Grid/index.tsx", + "name": "GridOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "SystemProp", + "value": [ + { + "value": "string" + }, + { + "value": "number" + }, + { + "value": "true" + }, + { + "value": "symbol" + }, + { + "value": "{}", + "description": "", + "fullComment": "", + "tags": {} + }, + { + "value": "string & {}" + }, + { + "value": "ThemeProp", + "description": "", + "fullComment": "", + "tags": {} + } + ] + } + } + } + } +} \ No newline at end of file diff --git a/lib/src/components/Grid/index.tsx b/lib/src/components/Grid/index.tsx new file mode 100644 index 0000000000..54858b54b6 --- /dev/null +++ b/lib/src/components/Grid/index.tsx @@ -0,0 +1,80 @@ +import React from 'react' + +import { Item } from './Item' + +import { Box } from '@/Box' +import { CreateWuiProps, forwardRef, WuiProps } from '@/System' + +export interface GridOptions { + /** same as gridArea */ + area?: WuiProps['gridArea'] + /** same as gridAutoColumns */ + autoColumns?: WuiProps['gridAutoColumns'] + /** same as gridAutoFlow */ + autoFlow?: WuiProps['gridAutoFlow'] + /** same as gridAutoRows */ + autoRows?: WuiProps['gridAutoRows'] + /** same as gridColumn */ + column?: WuiProps['gridColumn'] + /** same as columnGap */ + columnGap?: WuiProps['columnGap'] + /** same as gridGap */ + gap?: WuiProps['gap'] + /** same as gridRow */ + row?: WuiProps['gridRow'] + /** same as gridRowGap */ + rowGap?: WuiProps['rowGap'] + /** same as gridTemplateAreas */ + templateAreas?: WuiProps['gridTemplateAreas'] + /** same as gridTemplateColumns */ + templateColumns?: WuiProps['gridTemplateColumns'] + /** same as gridTemplateRows */ + templateRows?: WuiProps['gridTemplateRows'] +} + +export type GridProps = CreateWuiProps<'div', GridOptions> + +const GridComponent = forwardRef<'div', GridProps>( + ( + { + area, + autoColumns, + autoFlow, + autoRows, + column, + columnGap, + dataTestId, + gap, + row, + rowGap, + templateAreas, + templateColumns, + templateRows, + ...rest + }, + ref + ) => { + return ( + + ) + } +) + +export const Grid = Object.assign(GridComponent, { Item }) diff --git a/lib/src/components/Grid/tests/index.test.tsx b/lib/src/components/Grid/tests/index.test.tsx new file mode 100644 index 0000000000..2b054c34f1 --- /dev/null +++ b/lib/src/components/Grid/tests/index.test.tsx @@ -0,0 +1,16 @@ +import React from 'react' + +import { Grid } from '../' +import { render } from '../../../../tests' + +const content = 'Jungle' + +describe('', () => { + it('should render correctly', () => { + const { getByTestId } = render({content}) + const element = getByTestId('grid') + + expect(element).toHaveTextContent(content) + expect(element).toHaveStyleRule('display', 'grid') + }) +}) diff --git a/lib/src/components/Hint/docs/examples/overview.tsx b/lib/src/components/Hint/docs/examples/overview.tsx new file mode 100644 index 0000000000..31f1899ef7 --- /dev/null +++ b/lib/src/components/Hint/docs/examples/overview.tsx @@ -0,0 +1,9 @@ +import * as React from 'react' + +import { Hint } from '@/Hint' + +const Example = () => { + return default +} + +export default Example diff --git a/lib/src/components/Hint/docs/examples/variants.tsx b/lib/src/components/Hint/docs/examples/variants.tsx new file mode 100644 index 0000000000..e9bc0d4988 --- /dev/null +++ b/lib/src/components/Hint/docs/examples/variants.tsx @@ -0,0 +1,17 @@ +import * as React from 'react' + +import { Hint } from '@/Hint' +import { Stack } from '@/Stack' + +const Example = () => { + return ( + + default + warning + danger + success + + ) +} + +export default Example diff --git a/packages/Hint/docs/index.mdx b/lib/src/components/Hint/docs/index.mdx similarity index 100% rename from packages/Hint/docs/index.mdx rename to lib/src/components/Hint/docs/index.mdx diff --git a/lib/src/components/Hint/docs/properties.json b/lib/src/components/Hint/docs/properties.json new file mode 100644 index 0000000000..de4eeb54ca --- /dev/null +++ b/lib/src/components/Hint/docs/properties.json @@ -0,0 +1,65 @@ +{ + "Hint": { + "props": { + "checkableField": { + "defaultValue": null, + "description": "", + "name": "checkableField", + "parent": { + "fileName": "welcome-ui/lib/src/components/Hint/index.tsx", + "name": "HintOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Hint/index.tsx", + "name": "HintOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "variant": { + "defaultValue": null, + "description": "", + "name": "variant", + "parent": { + "fileName": "welcome-ui/lib/src/components/Hint/index.tsx", + "name": "HintOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Hint/index.tsx", + "name": "HintOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "\"danger\" | \"success\" | \"warning\"", + "value": [ + { + "value": "\"danger\"" + }, + { + "value": "\"success\"" + }, + { + "value": "\"warning\"" + } + ] + } + } + } + } +} \ No newline at end of file diff --git a/lib/src/components/Hint/index.tsx b/lib/src/components/Hint/index.tsx new file mode 100644 index 0000000000..8112bc4adb --- /dev/null +++ b/lib/src/components/Hint/index.tsx @@ -0,0 +1,26 @@ +import React from 'react' + +import * as S from './styles' + +import { CreateWuiProps, forwardRef } from '@/System' + +export interface HintOptions { + checkableField?: boolean + variant?: 'danger' | 'success' | 'warning' +} + +export type HintProps = CreateWuiProps<'div', HintOptions> + +export const Hint = forwardRef<'div', HintProps>( + ({ children, dataTestId, variant, ...rest }, ref) => { + return ( + + {children} + + ) + } +) + +Hint.displayName = 'Hint' + +export const StyledHint = S.Hint diff --git a/packages/Hint/src/styles.ts b/lib/src/components/Hint/styles.ts similarity index 100% rename from packages/Hint/src/styles.ts rename to lib/src/components/Hint/styles.ts diff --git a/lib/src/components/Hint/tests/index.test.tsx b/lib/src/components/Hint/tests/index.test.tsx new file mode 100644 index 0000000000..4271e40113 --- /dev/null +++ b/lib/src/components/Hint/tests/index.test.tsx @@ -0,0 +1,29 @@ +import React from 'react' + +import { Hint } from '../' +import { colors } from '../../../theme/colors' +import { render } from '../../../../tests' + +const content = 'Jungle' + +describe('', () => { + it('should render correctly', () => { + const { getByTestId } = render({content}) + const hint = getByTestId('hint') + + expect(hint).toHaveTextContent(content) + expect(hint).toHaveStyleRule('font-size', '0.75rem') + }) + + it('should render correctly with a state', () => { + const { getByTestId } = render( + + {content} + + ) + const hint = getByTestId('hint') + + expect(hint).toHaveTextContent(content) + expect(hint).toHaveStyleRule('color', colors['red-70']) + }) +}) diff --git a/lib/src/components/Hint/theme.ts b/lib/src/components/Hint/theme.ts new file mode 100644 index 0000000000..48b6f6204e --- /dev/null +++ b/lib/src/components/Hint/theme.ts @@ -0,0 +1,30 @@ +import { CSSObject } from '@xstyled/styled-components' + +import { ThemeValues } from '@/theme' + +export type ThemeHints = { + danger: CSSObject + default: CSSObject + success: CSSObject + warning: CSSObject +} + +export const getHints = (theme: ThemeValues): ThemeHints => { + const { colors, texts } = theme + + return { + default: { + ...texts.xs, + color: colors['neutral-60'], + }, + danger: { + color: colors['red-70'], + }, + success: { + color: colors['green-70'], + }, + warning: { + color: colors['orange-70'], + }, + } +} diff --git a/lib/src/components/Icon/docs/examples/color.tsx b/lib/src/components/Icon/docs/examples/color.tsx new file mode 100644 index 0000000000..74a9acbe94 --- /dev/null +++ b/lib/src/components/Icon/docs/examples/color.tsx @@ -0,0 +1,15 @@ +import * as React from 'react' + +import { PositiveStraightIcon } from '@/Icons' + +const Example = () => { + return ( + <> + + + + + ) +} + +export default Example diff --git a/lib/src/components/Icon/docs/examples/overview.tsx b/lib/src/components/Icon/docs/examples/overview.tsx new file mode 100644 index 0000000000..41ab784b79 --- /dev/null +++ b/lib/src/components/Icon/docs/examples/overview.tsx @@ -0,0 +1,9 @@ +import * as React from 'react' + +import { PositiveStraightIcon } from '@/Icons' + +const Example = () => { + return +} + +export default Example diff --git a/lib/src/components/Icon/docs/examples/sizes.tsx b/lib/src/components/Icon/docs/examples/sizes.tsx new file mode 100644 index 0000000000..058628739c --- /dev/null +++ b/lib/src/components/Icon/docs/examples/sizes.tsx @@ -0,0 +1,18 @@ +import * as React from 'react' + +import { PositiveStraightIcon } from '@/Icons' + +const Example = () => { + return ( + <> + + + + + + + + ) +} + +export default Example diff --git a/packages/Icon/docs/index.mdx b/lib/src/components/Icon/docs/index.mdx similarity index 100% rename from packages/Icon/docs/index.mdx rename to lib/src/components/Icon/docs/index.mdx diff --git a/lib/src/components/Icon/docs/properties.json b/lib/src/components/Icon/docs/properties.json new file mode 100644 index 0000000000..c0f90f3deb --- /dev/null +++ b/lib/src/components/Icon/docs/properties.json @@ -0,0 +1,112 @@ +{ + "Icon": { + "props": { + "content": { + "defaultValue": null, + "description": "", + "name": "content", + "parent": { + "fileName": "welcome-ui/lib/src/components/Icon/index.tsx", + "name": "IconOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Icon/index.tsx", + "name": "IconOptions" + } + ], + "required": false, + "type": { + "name": "IconContent" + } + }, + "name": { + "defaultValue": null, + "description": "", + "name": "name", + "parent": { + "fileName": "welcome-ui/lib/src/components/Icon/index.tsx", + "name": "IconOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Icon/index.tsx", + "name": "IconOptions" + } + ], + "required": false, + "type": { + "name": "string" + } + }, + "onClick": { + "defaultValue": null, + "description": "", + "name": "onClick", + "parent": { + "fileName": "welcome-ui/lib/src/components/Icon/index.tsx", + "name": "IconOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Icon/index.tsx", + "name": "IconOptions" + } + ], + "required": false, + "type": { + "name": "(event: MouseEvent) => void" + } + }, + "size": { + "defaultValue": { + "value": "md" + }, + "description": "", + "name": "size", + "parent": { + "fileName": "welcome-ui/lib/src/components/Icon/index.tsx", + "name": "IconOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Icon/index.tsx", + "name": "IconOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "Size", + "value": [ + { + "value": "string" + }, + { + "value": "number" + } + ] + } + }, + "title": { + "defaultValue": null, + "description": "", + "name": "title", + "parent": { + "fileName": "welcome-ui/lib/src/components/Icon/index.tsx", + "name": "IconOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Icon/index.tsx", + "name": "IconOptions" + } + ], + "required": false, + "type": { + "name": "string" + } + } + } + } +} \ No newline at end of file diff --git a/lib/src/components/Icon/index.tsx b/lib/src/components/Icon/index.tsx new file mode 100644 index 0000000000..59d469fb29 --- /dev/null +++ b/lib/src/components/Icon/index.tsx @@ -0,0 +1,56 @@ +import React from 'react' + +import * as S from './styles' + +import { CreateWuiProps, forwardRef } from '@/System' + +type IconContent = { + block?: string + height?: number + isFlag?: boolean + stroked?: boolean + viewBox?: string + width?: number +} + +type Size = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl' | number | string + +export interface IconOptions { + content?: IconContent + name?: string + onClick?: (event: React.MouseEvent) => void + size?: Size + title?: string +} + +export type IconProps = CreateWuiProps + +export const Icon = forwardRef<'svg', IconProps>( + ({ content, dataTestId, size = 'md', title, ...props }, ref) => { + const className = props.className || '' + if (!content) { + return null + } + + return ( + + ) + } +) + +Icon.displayName = 'Icon' + +export const StyledIcon = S.Icon diff --git a/lib/src/components/Icon/styles.ts b/lib/src/components/Icon/styles.ts new file mode 100644 index 0000000000..54c48c1d84 --- /dev/null +++ b/lib/src/components/Icon/styles.ts @@ -0,0 +1,35 @@ +import styled, { css, system, Theme } from '@xstyled/styled-components' + +import { IconOptions } from './index' + +import { WuiProps } from '@/System' + +const iconSvgStrokedStyles = css` + g, + path { + stroke: inherit; + fill: none; + } +` + +const iconSvgFilledStyles = css` + g, + path { + stroke: none; + } +` + +type StyledIconProps = Pick & + Pick & + WuiProps & + Partial<{ alt: string; title: string }> + +export const Icon = styled('svg')(({ isFlag, size = 'md', stroked, theme }) => { + const formattedSize = theme.icons[size as keyof Theme['icons']] || size + return css` + ${!isFlag && (stroked ? iconSvgStrokedStyles : iconSvgFilledStyles)}; + width: ${formattedSize}; + height: ${formattedSize}; + ${system}; + ` +}) diff --git a/lib/src/components/Icon/theme.ts b/lib/src/components/Icon/theme.ts new file mode 100644 index 0000000000..33321b5842 --- /dev/null +++ b/lib/src/components/Icon/theme.ts @@ -0,0 +1,19 @@ +import { ThemeValues } from '@/theme' + +export type ThemeIcons = { + lg: string + md: string + sm: string + xl: string + xs: string + xxl: string +} + +export const getIcons = ({ toRem }: ThemeValues): ThemeIcons => ({ + xs: toRem(12), + sm: toRem(16), + md: toRem(24), + lg: toRem(32), + xl: toRem(48), + xxl: toRem(64), +}) diff --git a/icons/src/Actions/content.json b/lib/src/components/Icons/Actions/content.json similarity index 100% rename from icons/src/Actions/content.json rename to lib/src/components/Icons/Actions/content.json diff --git a/lib/src/components/Icons/Actions/index.tsx b/lib/src/components/Icons/Actions/index.tsx new file mode 100644 index 0000000000..da829c2bcc --- /dev/null +++ b/lib/src/components/Icons/Actions/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ActionsIcon: React.FC = props => { + return +} diff --git a/icons/src/Activity/content.json b/lib/src/components/Icons/Activity/content.json similarity index 100% rename from icons/src/Activity/content.json rename to lib/src/components/Icons/Activity/content.json diff --git a/lib/src/components/Icons/Activity/index.tsx b/lib/src/components/Icons/Activity/index.tsx new file mode 100644 index 0000000000..38901409e8 --- /dev/null +++ b/lib/src/components/Icons/Activity/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ActivityIcon: React.FC = props => { + return +} diff --git a/icons/src/Add/content.json b/lib/src/components/Icons/Add/content.json similarity index 100% rename from icons/src/Add/content.json rename to lib/src/components/Icons/Add/content.json diff --git a/lib/src/components/Icons/Add/index.tsx b/lib/src/components/Icons/Add/index.tsx new file mode 100644 index 0000000000..5747a25406 --- /dev/null +++ b/lib/src/components/Icons/Add/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const AddIcon: React.FC = props => { + return +} diff --git a/icons/src/Address/content.json b/lib/src/components/Icons/Address/content.json similarity index 100% rename from icons/src/Address/content.json rename to lib/src/components/Icons/Address/content.json diff --git a/lib/src/components/Icons/Address/index.tsx b/lib/src/components/Icons/Address/index.tsx new file mode 100644 index 0000000000..426f78b607 --- /dev/null +++ b/lib/src/components/Icons/Address/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const AddressIcon: React.FC = props => { + return +} diff --git a/icons/src/Airplay/content.json b/lib/src/components/Icons/Airplay/content.json similarity index 100% rename from icons/src/Airplay/content.json rename to lib/src/components/Icons/Airplay/content.json diff --git a/lib/src/components/Icons/Airplay/index.tsx b/lib/src/components/Icons/Airplay/index.tsx new file mode 100644 index 0000000000..e1808dc110 --- /dev/null +++ b/lib/src/components/Icons/Airplay/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const AirplayIcon: React.FC = props => { + return +} diff --git a/icons/src/Alert/content.json b/lib/src/components/Icons/Alert/content.json similarity index 100% rename from icons/src/Alert/content.json rename to lib/src/components/Icons/Alert/content.json diff --git a/lib/src/components/Icons/Alert/index.tsx b/lib/src/components/Icons/Alert/index.tsx new file mode 100644 index 0000000000..24423b13e2 --- /dev/null +++ b/lib/src/components/Icons/Alert/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const AlertIcon: React.FC = props => { + return +} diff --git a/icons/src/AlertOutline/content.json b/lib/src/components/Icons/AlertOutline/content.json similarity index 100% rename from icons/src/AlertOutline/content.json rename to lib/src/components/Icons/AlertOutline/content.json diff --git a/lib/src/components/Icons/AlertOutline/index.tsx b/lib/src/components/Icons/AlertOutline/index.tsx new file mode 100644 index 0000000000..7e827e8173 --- /dev/null +++ b/lib/src/components/Icons/AlertOutline/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const AlertOutlineIcon: React.FC = props => { + return +} diff --git a/icons/src/Analytics/content.json b/lib/src/components/Icons/Analytics/content.json similarity index 100% rename from icons/src/Analytics/content.json rename to lib/src/components/Icons/Analytics/content.json diff --git a/lib/src/components/Icons/Analytics/index.tsx b/lib/src/components/Icons/Analytics/index.tsx new file mode 100644 index 0000000000..9503204d2c --- /dev/null +++ b/lib/src/components/Icons/Analytics/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const AnalyticsIcon: React.FC = props => { + return +} diff --git a/icons/src/Anniversary/content.json b/lib/src/components/Icons/Anniversary/content.json similarity index 100% rename from icons/src/Anniversary/content.json rename to lib/src/components/Icons/Anniversary/content.json diff --git a/lib/src/components/Icons/Anniversary/index.tsx b/lib/src/components/Icons/Anniversary/index.tsx new file mode 100644 index 0000000000..f5b5e16c8d --- /dev/null +++ b/lib/src/components/Icons/Anniversary/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const AnniversaryIcon: React.FC = props => { + return +} diff --git a/icons/src/Archive/content.json b/lib/src/components/Icons/Archive/content.json similarity index 100% rename from icons/src/Archive/content.json rename to lib/src/components/Icons/Archive/content.json diff --git a/lib/src/components/Icons/Archive/index.tsx b/lib/src/components/Icons/Archive/index.tsx new file mode 100644 index 0000000000..e4bcbcfa74 --- /dev/null +++ b/lib/src/components/Icons/Archive/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ArchiveIcon: React.FC = props => { + return +} diff --git a/icons/src/ArrowDown/content.json b/lib/src/components/Icons/ArrowDown/content.json similarity index 100% rename from icons/src/ArrowDown/content.json rename to lib/src/components/Icons/ArrowDown/content.json diff --git a/lib/src/components/Icons/ArrowDown/index.tsx b/lib/src/components/Icons/ArrowDown/index.tsx new file mode 100644 index 0000000000..3b25501803 --- /dev/null +++ b/lib/src/components/Icons/ArrowDown/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ArrowDownIcon: React.FC = props => { + return +} diff --git a/icons/src/ArrowLeft/content.json b/lib/src/components/Icons/ArrowLeft/content.json similarity index 100% rename from icons/src/ArrowLeft/content.json rename to lib/src/components/Icons/ArrowLeft/content.json diff --git a/lib/src/components/Icons/ArrowLeft/index.tsx b/lib/src/components/Icons/ArrowLeft/index.tsx new file mode 100644 index 0000000000..12d8fb2369 --- /dev/null +++ b/lib/src/components/Icons/ArrowLeft/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ArrowLeftIcon: React.FC = props => { + return +} diff --git a/icons/src/ArrowLineDown/content.json b/lib/src/components/Icons/ArrowLineDown/content.json similarity index 100% rename from icons/src/ArrowLineDown/content.json rename to lib/src/components/Icons/ArrowLineDown/content.json diff --git a/lib/src/components/Icons/ArrowLineDown/index.tsx b/lib/src/components/Icons/ArrowLineDown/index.tsx new file mode 100644 index 0000000000..7676ec8d73 --- /dev/null +++ b/lib/src/components/Icons/ArrowLineDown/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ArrowLineDownIcon: React.FC = props => { + return +} diff --git a/icons/src/ArrowLineLeft/content.json b/lib/src/components/Icons/ArrowLineLeft/content.json similarity index 100% rename from icons/src/ArrowLineLeft/content.json rename to lib/src/components/Icons/ArrowLineLeft/content.json diff --git a/lib/src/components/Icons/ArrowLineLeft/index.tsx b/lib/src/components/Icons/ArrowLineLeft/index.tsx new file mode 100644 index 0000000000..7dee6649d9 --- /dev/null +++ b/lib/src/components/Icons/ArrowLineLeft/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ArrowLineLeftIcon: React.FC = props => { + return +} diff --git a/icons/src/ArrowLineRight/content.json b/lib/src/components/Icons/ArrowLineRight/content.json similarity index 100% rename from icons/src/ArrowLineRight/content.json rename to lib/src/components/Icons/ArrowLineRight/content.json diff --git a/lib/src/components/Icons/ArrowLineRight/index.tsx b/lib/src/components/Icons/ArrowLineRight/index.tsx new file mode 100644 index 0000000000..0d61e4c076 --- /dev/null +++ b/lib/src/components/Icons/ArrowLineRight/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ArrowLineRightIcon: React.FC = props => { + return +} diff --git a/icons/src/ArrowLineUp/content.json b/lib/src/components/Icons/ArrowLineUp/content.json similarity index 100% rename from icons/src/ArrowLineUp/content.json rename to lib/src/components/Icons/ArrowLineUp/content.json diff --git a/lib/src/components/Icons/ArrowLineUp/index.tsx b/lib/src/components/Icons/ArrowLineUp/index.tsx new file mode 100644 index 0000000000..21a2a55331 --- /dev/null +++ b/lib/src/components/Icons/ArrowLineUp/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ArrowLineUpIcon: React.FC = props => { + return +} diff --git a/icons/src/ArrowRight/content.json b/lib/src/components/Icons/ArrowRight/content.json similarity index 100% rename from icons/src/ArrowRight/content.json rename to lib/src/components/Icons/ArrowRight/content.json diff --git a/lib/src/components/Icons/ArrowRight/index.tsx b/lib/src/components/Icons/ArrowRight/index.tsx new file mode 100644 index 0000000000..2cc621cca1 --- /dev/null +++ b/lib/src/components/Icons/ArrowRight/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ArrowRightIcon: React.FC = props => { + return +} diff --git a/icons/src/ArrowUp/content.json b/lib/src/components/Icons/ArrowUp/content.json similarity index 100% rename from icons/src/ArrowUp/content.json rename to lib/src/components/Icons/ArrowUp/content.json diff --git a/lib/src/components/Icons/ArrowUp/index.tsx b/lib/src/components/Icons/ArrowUp/index.tsx new file mode 100644 index 0000000000..3e3f544211 --- /dev/null +++ b/lib/src/components/Icons/ArrowUp/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ArrowUpIcon: React.FC = props => { + return +} diff --git a/icons/src/AspectRatioFill/content.json b/lib/src/components/Icons/AspectRatioFill/content.json similarity index 100% rename from icons/src/AspectRatioFill/content.json rename to lib/src/components/Icons/AspectRatioFill/content.json diff --git a/lib/src/components/Icons/AspectRatioFill/index.tsx b/lib/src/components/Icons/AspectRatioFill/index.tsx new file mode 100644 index 0000000000..25956d8a8f --- /dev/null +++ b/lib/src/components/Icons/AspectRatioFill/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const AspectRatioFillIcon: React.FC = props => { + return +} diff --git a/icons/src/AspectRatioFit/content.json b/lib/src/components/Icons/AspectRatioFit/content.json similarity index 100% rename from icons/src/AspectRatioFit/content.json rename to lib/src/components/Icons/AspectRatioFit/content.json diff --git a/lib/src/components/Icons/AspectRatioFit/index.tsx b/lib/src/components/Icons/AspectRatioFit/index.tsx new file mode 100644 index 0000000000..3def08aa63 --- /dev/null +++ b/lib/src/components/Icons/AspectRatioFit/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const AspectRatioFitIcon: React.FC = props => { + return +} diff --git a/icons/src/Attachment/content.json b/lib/src/components/Icons/Attachment/content.json similarity index 100% rename from icons/src/Attachment/content.json rename to lib/src/components/Icons/Attachment/content.json diff --git a/lib/src/components/Icons/Attachment/index.tsx b/lib/src/components/Icons/Attachment/index.tsx new file mode 100644 index 0000000000..938ada498b --- /dev/null +++ b/lib/src/components/Icons/Attachment/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const AttachmentIcon: React.FC = props => { + return +} diff --git a/icons/src/Avatar/content.json b/lib/src/components/Icons/Avatar/content.json similarity index 100% rename from icons/src/Avatar/content.json rename to lib/src/components/Icons/Avatar/content.json diff --git a/lib/src/components/Icons/Avatar/index.tsx b/lib/src/components/Icons/Avatar/index.tsx new file mode 100644 index 0000000000..9c28bdf936 --- /dev/null +++ b/lib/src/components/Icons/Avatar/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const AvatarIcon: React.FC = props => { + return +} diff --git a/icons/src/AvatarAccessory/content.json b/lib/src/components/Icons/AvatarAccessory/content.json similarity index 100% rename from icons/src/AvatarAccessory/content.json rename to lib/src/components/Icons/AvatarAccessory/content.json diff --git a/lib/src/components/Icons/AvatarAccessory/index.tsx b/lib/src/components/Icons/AvatarAccessory/index.tsx new file mode 100644 index 0000000000..1ad496beca --- /dev/null +++ b/lib/src/components/Icons/AvatarAccessory/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const AvatarAccessoryIcon: React.FC = props => { + return +} diff --git a/icons/src/AvatarBody/content.json b/lib/src/components/Icons/AvatarBody/content.json similarity index 100% rename from icons/src/AvatarBody/content.json rename to lib/src/components/Icons/AvatarBody/content.json diff --git a/lib/src/components/Icons/AvatarBody/index.tsx b/lib/src/components/Icons/AvatarBody/index.tsx new file mode 100644 index 0000000000..d69ea71c96 --- /dev/null +++ b/lib/src/components/Icons/AvatarBody/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const AvatarBodyIcon: React.FC = props => { + return +} diff --git a/icons/src/AvatarBottom/content.json b/lib/src/components/Icons/AvatarBottom/content.json similarity index 100% rename from icons/src/AvatarBottom/content.json rename to lib/src/components/Icons/AvatarBottom/content.json diff --git a/lib/src/components/Icons/AvatarBottom/index.tsx b/lib/src/components/Icons/AvatarBottom/index.tsx new file mode 100644 index 0000000000..88ad82007d --- /dev/null +++ b/lib/src/components/Icons/AvatarBottom/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const AvatarBottomIcon: React.FC = props => { + return +} diff --git a/icons/src/AvatarCostume/content.json b/lib/src/components/Icons/AvatarCostume/content.json similarity index 100% rename from icons/src/AvatarCostume/content.json rename to lib/src/components/Icons/AvatarCostume/content.json diff --git a/lib/src/components/Icons/AvatarCostume/index.tsx b/lib/src/components/Icons/AvatarCostume/index.tsx new file mode 100644 index 0000000000..3884e2d376 --- /dev/null +++ b/lib/src/components/Icons/AvatarCostume/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const AvatarCostumeIcon: React.FC = props => { + return +} diff --git a/icons/src/AvatarHead/content.json b/lib/src/components/Icons/AvatarHead/content.json similarity index 100% rename from icons/src/AvatarHead/content.json rename to lib/src/components/Icons/AvatarHead/content.json diff --git a/lib/src/components/Icons/AvatarHead/index.tsx b/lib/src/components/Icons/AvatarHead/index.tsx new file mode 100644 index 0000000000..aed6aaef44 --- /dev/null +++ b/lib/src/components/Icons/AvatarHead/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const AvatarHeadIcon: React.FC = props => { + return +} diff --git a/icons/src/AvatarTop/content.json b/lib/src/components/Icons/AvatarTop/content.json similarity index 100% rename from icons/src/AvatarTop/content.json rename to lib/src/components/Icons/AvatarTop/content.json diff --git a/lib/src/components/Icons/AvatarTop/index.tsx b/lib/src/components/Icons/AvatarTop/index.tsx new file mode 100644 index 0000000000..1df0111a3c --- /dev/null +++ b/lib/src/components/Icons/AvatarTop/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const AvatarTopIcon: React.FC = props => { + return +} diff --git a/icons/src/BarChart/content.json b/lib/src/components/Icons/BarChart/content.json similarity index 100% rename from icons/src/BarChart/content.json rename to lib/src/components/Icons/BarChart/content.json diff --git a/lib/src/components/Icons/BarChart/index.tsx b/lib/src/components/Icons/BarChart/index.tsx new file mode 100644 index 0000000000..906dfe67fe --- /dev/null +++ b/lib/src/components/Icons/BarChart/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const BarChartIcon: React.FC = props => { + return +} diff --git a/icons/src/Basketball/content.json b/lib/src/components/Icons/Basketball/content.json similarity index 100% rename from icons/src/Basketball/content.json rename to lib/src/components/Icons/Basketball/content.json diff --git a/lib/src/components/Icons/Basketball/index.tsx b/lib/src/components/Icons/Basketball/index.tsx new file mode 100644 index 0000000000..8903e58426 --- /dev/null +++ b/lib/src/components/Icons/Basketball/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const BasketballIcon: React.FC = props => { + return +} diff --git a/icons/src/Behance/content.json b/lib/src/components/Icons/Behance/content.json similarity index 100% rename from icons/src/Behance/content.json rename to lib/src/components/Icons/Behance/content.json diff --git a/lib/src/components/Icons/Behance/index.tsx b/lib/src/components/Icons/Behance/index.tsx new file mode 100644 index 0000000000..ef7a15a393 --- /dev/null +++ b/lib/src/components/Icons/Behance/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const BehanceIcon: React.FC = props => { + return +} diff --git a/icons/src/Birthday/content.json b/lib/src/components/Icons/Birthday/content.json similarity index 100% rename from icons/src/Birthday/content.json rename to lib/src/components/Icons/Birthday/content.json diff --git a/lib/src/components/Icons/Birthday/index.tsx b/lib/src/components/Icons/Birthday/index.tsx new file mode 100644 index 0000000000..dbc067b812 --- /dev/null +++ b/lib/src/components/Icons/Birthday/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const BirthdayIcon: React.FC = props => { + return +} diff --git a/icons/src/Bold/content.json b/lib/src/components/Icons/Bold/content.json similarity index 100% rename from icons/src/Bold/content.json rename to lib/src/components/Icons/Bold/content.json diff --git a/lib/src/components/Icons/Bold/index.tsx b/lib/src/components/Icons/Bold/index.tsx new file mode 100644 index 0000000000..e0bee915f4 --- /dev/null +++ b/lib/src/components/Icons/Bold/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const BoldIcon: React.FC = props => { + return +} diff --git a/icons/src/Book/content.json b/lib/src/components/Icons/Book/content.json similarity index 100% rename from icons/src/Book/content.json rename to lib/src/components/Icons/Book/content.json diff --git a/lib/src/components/Icons/Book/index.tsx b/lib/src/components/Icons/Book/index.tsx new file mode 100644 index 0000000000..3f07409b1f --- /dev/null +++ b/lib/src/components/Icons/Book/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const BookIcon: React.FC = props => { + return +} diff --git a/icons/src/Book2/content.json b/lib/src/components/Icons/Book2/content.json similarity index 100% rename from icons/src/Book2/content.json rename to lib/src/components/Icons/Book2/content.json diff --git a/lib/src/components/Icons/Book2/index.tsx b/lib/src/components/Icons/Book2/index.tsx new file mode 100644 index 0000000000..993d637357 --- /dev/null +++ b/lib/src/components/Icons/Book2/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const Book2Icon: React.FC = props => { + return +} diff --git a/icons/src/Bookmark/content.json b/lib/src/components/Icons/Bookmark/content.json similarity index 100% rename from icons/src/Bookmark/content.json rename to lib/src/components/Icons/Bookmark/content.json diff --git a/lib/src/components/Icons/Bookmark/index.tsx b/lib/src/components/Icons/Bookmark/index.tsx new file mode 100644 index 0000000000..a6b0e60612 --- /dev/null +++ b/lib/src/components/Icons/Bookmark/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const BookmarkIcon: React.FC = props => { + return +} diff --git a/icons/src/BookmarkOutline/content.json b/lib/src/components/Icons/BookmarkOutline/content.json similarity index 100% rename from icons/src/BookmarkOutline/content.json rename to lib/src/components/Icons/BookmarkOutline/content.json diff --git a/lib/src/components/Icons/BookmarkOutline/index.tsx b/lib/src/components/Icons/BookmarkOutline/index.tsx new file mode 100644 index 0000000000..504658ff6e --- /dev/null +++ b/lib/src/components/Icons/BookmarkOutline/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const BookmarkOutlineIcon: React.FC = props => { + return +} diff --git a/icons/src/Bulb/content.json b/lib/src/components/Icons/Bulb/content.json similarity index 100% rename from icons/src/Bulb/content.json rename to lib/src/components/Icons/Bulb/content.json diff --git a/lib/src/components/Icons/Bulb/index.tsx b/lib/src/components/Icons/Bulb/index.tsx new file mode 100644 index 0000000000..88fc651ef1 --- /dev/null +++ b/lib/src/components/Icons/Bulb/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const BulbIcon: React.FC = props => { + return +} diff --git a/icons/src/Bulk/content.json b/lib/src/components/Icons/Bulk/content.json similarity index 100% rename from icons/src/Bulk/content.json rename to lib/src/components/Icons/Bulk/content.json diff --git a/lib/src/components/Icons/Bulk/index.tsx b/lib/src/components/Icons/Bulk/index.tsx new file mode 100644 index 0000000000..aa525d7514 --- /dev/null +++ b/lib/src/components/Icons/Bulk/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const BulkIcon: React.FC = props => { + return +} diff --git a/icons/src/Buoy/content.json b/lib/src/components/Icons/Buoy/content.json similarity index 100% rename from icons/src/Buoy/content.json rename to lib/src/components/Icons/Buoy/content.json diff --git a/lib/src/components/Icons/Buoy/index.tsx b/lib/src/components/Icons/Buoy/index.tsx new file mode 100644 index 0000000000..ecf96a110f --- /dev/null +++ b/lib/src/components/Icons/Buoy/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const BuoyIcon: React.FC = props => { + return +} diff --git a/icons/src/Burn/content.json b/lib/src/components/Icons/Burn/content.json similarity index 100% rename from icons/src/Burn/content.json rename to lib/src/components/Icons/Burn/content.json diff --git a/lib/src/components/Icons/Burn/index.tsx b/lib/src/components/Icons/Burn/index.tsx new file mode 100644 index 0000000000..d8b232e282 --- /dev/null +++ b/lib/src/components/Icons/Burn/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const BurnIcon: React.FC = props => { + return +} diff --git a/icons/src/Caddy/content.json b/lib/src/components/Icons/Caddy/content.json similarity index 100% rename from icons/src/Caddy/content.json rename to lib/src/components/Icons/Caddy/content.json diff --git a/lib/src/components/Icons/Caddy/index.tsx b/lib/src/components/Icons/Caddy/index.tsx new file mode 100644 index 0000000000..664d4e8da3 --- /dev/null +++ b/lib/src/components/Icons/Caddy/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CaddyIcon: React.FC = props => { + return +} diff --git a/icons/src/Calcul/content.json b/lib/src/components/Icons/Calcul/content.json similarity index 100% rename from icons/src/Calcul/content.json rename to lib/src/components/Icons/Calcul/content.json diff --git a/lib/src/components/Icons/Calcul/index.tsx b/lib/src/components/Icons/Calcul/index.tsx new file mode 100644 index 0000000000..e73bc41964 --- /dev/null +++ b/lib/src/components/Icons/Calcul/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CalculIcon: React.FC = props => { + return +} diff --git a/icons/src/Camera/content.json b/lib/src/components/Icons/Camera/content.json similarity index 100% rename from icons/src/Camera/content.json rename to lib/src/components/Icons/Camera/content.json diff --git a/lib/src/components/Icons/Camera/index.tsx b/lib/src/components/Icons/Camera/index.tsx new file mode 100644 index 0000000000..cdb0a73931 --- /dev/null +++ b/lib/src/components/Icons/Camera/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CameraIcon: React.FC = props => { + return +} diff --git a/icons/src/CameraOff/content.json b/lib/src/components/Icons/CameraOff/content.json similarity index 100% rename from icons/src/CameraOff/content.json rename to lib/src/components/Icons/CameraOff/content.json diff --git a/lib/src/components/Icons/CameraOff/index.tsx b/lib/src/components/Icons/CameraOff/index.tsx new file mode 100644 index 0000000000..145e130b2d --- /dev/null +++ b/lib/src/components/Icons/CameraOff/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CameraOffIcon: React.FC = props => { + return +} diff --git a/icons/src/CameraOn/content.json b/lib/src/components/Icons/CameraOn/content.json similarity index 100% rename from icons/src/CameraOn/content.json rename to lib/src/components/Icons/CameraOn/content.json diff --git a/lib/src/components/Icons/CameraOn/index.tsx b/lib/src/components/Icons/CameraOn/index.tsx new file mode 100644 index 0000000000..6634ed24a9 --- /dev/null +++ b/lib/src/components/Icons/CameraOn/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CameraOnIcon: React.FC = props => { + return +} diff --git a/icons/src/CandidateStatus/content.json b/lib/src/components/Icons/CandidateStatus/content.json similarity index 100% rename from icons/src/CandidateStatus/content.json rename to lib/src/components/Icons/CandidateStatus/content.json diff --git a/lib/src/components/Icons/CandidateStatus/index.tsx b/lib/src/components/Icons/CandidateStatus/index.tsx new file mode 100644 index 0000000000..2c6cff3638 --- /dev/null +++ b/lib/src/components/Icons/CandidateStatus/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CandidateStatusIcon: React.FC = props => { + return +} diff --git a/icons/src/CardView/content.json b/lib/src/components/Icons/CardView/content.json similarity index 100% rename from icons/src/CardView/content.json rename to lib/src/components/Icons/CardView/content.json diff --git a/lib/src/components/Icons/CardView/index.tsx b/lib/src/components/Icons/CardView/index.tsx new file mode 100644 index 0000000000..f01d7e88a7 --- /dev/null +++ b/lib/src/components/Icons/CardView/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CardViewIcon: React.FC = props => { + return +} diff --git a/icons/src/Cast/content.json b/lib/src/components/Icons/Cast/content.json similarity index 100% rename from icons/src/Cast/content.json rename to lib/src/components/Icons/Cast/content.json diff --git a/lib/src/components/Icons/Cast/index.tsx b/lib/src/components/Icons/Cast/index.tsx new file mode 100644 index 0000000000..7b81dac233 --- /dev/null +++ b/lib/src/components/Icons/Cast/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CastIcon: React.FC = props => { + return +} diff --git a/icons/src/CastConnected/content.json b/lib/src/components/Icons/CastConnected/content.json similarity index 100% rename from icons/src/CastConnected/content.json rename to lib/src/components/Icons/CastConnected/content.json diff --git a/lib/src/components/Icons/CastConnected/index.tsx b/lib/src/components/Icons/CastConnected/index.tsx new file mode 100644 index 0000000000..58476328ba --- /dev/null +++ b/lib/src/components/Icons/CastConnected/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CastConnectedIcon: React.FC = props => { + return +} diff --git a/icons/src/CastUnavailable/content.json b/lib/src/components/Icons/CastUnavailable/content.json similarity index 100% rename from icons/src/CastUnavailable/content.json rename to lib/src/components/Icons/CastUnavailable/content.json diff --git a/lib/src/components/Icons/CastUnavailable/index.tsx b/lib/src/components/Icons/CastUnavailable/index.tsx new file mode 100644 index 0000000000..c40d7306b5 --- /dev/null +++ b/lib/src/components/Icons/CastUnavailable/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CastUnavailableIcon: React.FC = props => { + return +} diff --git a/icons/src/Celebrate/content.json b/lib/src/components/Icons/Celebrate/content.json similarity index 100% rename from icons/src/Celebrate/content.json rename to lib/src/components/Icons/Celebrate/content.json diff --git a/lib/src/components/Icons/Celebrate/index.tsx b/lib/src/components/Icons/Celebrate/index.tsx new file mode 100644 index 0000000000..b3a9bde66b --- /dev/null +++ b/lib/src/components/Icons/Celebrate/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CelebrateIcon: React.FC = props => { + return +} diff --git a/icons/src/Certified/content.json b/lib/src/components/Icons/Certified/content.json similarity index 100% rename from icons/src/Certified/content.json rename to lib/src/components/Icons/Certified/content.json diff --git a/lib/src/components/Icons/Certified/index.tsx b/lib/src/components/Icons/Certified/index.tsx new file mode 100644 index 0000000000..cb577bc864 --- /dev/null +++ b/lib/src/components/Icons/Certified/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CertifiedIcon: React.FC = props => { + return +} diff --git a/icons/src/Check/content.json b/lib/src/components/Icons/Check/content.json similarity index 100% rename from icons/src/Check/content.json rename to lib/src/components/Icons/Check/content.json diff --git a/lib/src/components/Icons/Check/index.tsx b/lib/src/components/Icons/Check/index.tsx new file mode 100644 index 0000000000..d8273011bf --- /dev/null +++ b/lib/src/components/Icons/Check/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CheckIcon: React.FC = props => { + return +} diff --git a/icons/src/Clipboard/content.json b/lib/src/components/Icons/Clipboard/content.json similarity index 100% rename from icons/src/Clipboard/content.json rename to lib/src/components/Icons/Clipboard/content.json diff --git a/lib/src/components/Icons/Clipboard/index.tsx b/lib/src/components/Icons/Clipboard/index.tsx new file mode 100644 index 0000000000..20b6f87805 --- /dev/null +++ b/lib/src/components/Icons/Clipboard/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ClipboardIcon: React.FC = props => { + return +} diff --git a/icons/src/Clock/content.json b/lib/src/components/Icons/Clock/content.json similarity index 100% rename from icons/src/Clock/content.json rename to lib/src/components/Icons/Clock/content.json diff --git a/lib/src/components/Icons/Clock/index.tsx b/lib/src/components/Icons/Clock/index.tsx new file mode 100644 index 0000000000..078c0b9123 --- /dev/null +++ b/lib/src/components/Icons/Clock/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ClockIcon: React.FC = props => { + return +} diff --git a/icons/src/Code/content.json b/lib/src/components/Icons/Code/content.json similarity index 100% rename from icons/src/Code/content.json rename to lib/src/components/Icons/Code/content.json diff --git a/lib/src/components/Icons/Code/index.tsx b/lib/src/components/Icons/Code/index.tsx new file mode 100644 index 0000000000..0a7f9f3307 --- /dev/null +++ b/lib/src/components/Icons/Code/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CodeIcon: React.FC = props => { + return +} diff --git a/icons/src/CodeBlock/content.json b/lib/src/components/Icons/CodeBlock/content.json similarity index 100% rename from icons/src/CodeBlock/content.json rename to lib/src/components/Icons/CodeBlock/content.json diff --git a/lib/src/components/Icons/CodeBlock/index.tsx b/lib/src/components/Icons/CodeBlock/index.tsx new file mode 100644 index 0000000000..f4288d256d --- /dev/null +++ b/lib/src/components/Icons/CodeBlock/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CodeBlockIcon: React.FC = props => { + return +} diff --git a/icons/src/Coffee/content.json b/lib/src/components/Icons/Coffee/content.json similarity index 100% rename from icons/src/Coffee/content.json rename to lib/src/components/Icons/Coffee/content.json diff --git a/lib/src/components/Icons/Coffee/index.tsx b/lib/src/components/Icons/Coffee/index.tsx new file mode 100644 index 0000000000..f4e8f81da2 --- /dev/null +++ b/lib/src/components/Icons/Coffee/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CoffeeIcon: React.FC = props => { + return +} diff --git a/icons/src/Collapse/content.json b/lib/src/components/Icons/Collapse/content.json similarity index 100% rename from icons/src/Collapse/content.json rename to lib/src/components/Icons/Collapse/content.json diff --git a/lib/src/components/Icons/Collapse/index.tsx b/lib/src/components/Icons/Collapse/index.tsx new file mode 100644 index 0000000000..e101b605a3 --- /dev/null +++ b/lib/src/components/Icons/Collapse/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CollapseIcon: React.FC = props => { + return +} diff --git a/icons/src/Comment/content.json b/lib/src/components/Icons/Comment/content.json similarity index 100% rename from icons/src/Comment/content.json rename to lib/src/components/Icons/Comment/content.json diff --git a/lib/src/components/Icons/Comment/index.tsx b/lib/src/components/Icons/Comment/index.tsx new file mode 100644 index 0000000000..8aa781a14b --- /dev/null +++ b/lib/src/components/Icons/Comment/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CommentIcon: React.FC = props => { + return +} diff --git a/icons/src/CommentOutline/content.json b/lib/src/components/Icons/CommentOutline/content.json similarity index 100% rename from icons/src/CommentOutline/content.json rename to lib/src/components/Icons/CommentOutline/content.json diff --git a/lib/src/components/Icons/CommentOutline/index.tsx b/lib/src/components/Icons/CommentOutline/index.tsx new file mode 100644 index 0000000000..9680001fe9 --- /dev/null +++ b/lib/src/components/Icons/CommentOutline/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CommentOutlineIcon: React.FC = props => { + return +} diff --git a/icons/src/CommonArea/content.json b/lib/src/components/Icons/CommonArea/content.json similarity index 100% rename from icons/src/CommonArea/content.json rename to lib/src/components/Icons/CommonArea/content.json diff --git a/lib/src/components/Icons/CommonArea/index.tsx b/lib/src/components/Icons/CommonArea/index.tsx new file mode 100644 index 0000000000..061f9b9067 --- /dev/null +++ b/lib/src/components/Icons/CommonArea/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CommonAreaIcon: React.FC = props => { + return +} diff --git a/icons/src/Compass/content.json b/lib/src/components/Icons/Compass/content.json similarity index 100% rename from icons/src/Compass/content.json rename to lib/src/components/Icons/Compass/content.json diff --git a/lib/src/components/Icons/Compass/index.tsx b/lib/src/components/Icons/Compass/index.tsx new file mode 100644 index 0000000000..0713c52e94 --- /dev/null +++ b/lib/src/components/Icons/Compass/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CompassIcon: React.FC = props => { + return +} diff --git a/icons/src/Computer/content.json b/lib/src/components/Icons/Computer/content.json similarity index 100% rename from icons/src/Computer/content.json rename to lib/src/components/Icons/Computer/content.json diff --git a/lib/src/components/Icons/Computer/index.tsx b/lib/src/components/Icons/Computer/index.tsx new file mode 100644 index 0000000000..b2ff0da418 --- /dev/null +++ b/lib/src/components/Icons/Computer/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ComputerIcon: React.FC = props => { + return +} diff --git a/icons/src/Connection/content.json b/lib/src/components/Icons/Connection/content.json similarity index 100% rename from icons/src/Connection/content.json rename to lib/src/components/Icons/Connection/content.json diff --git a/lib/src/components/Icons/Connection/index.tsx b/lib/src/components/Icons/Connection/index.tsx new file mode 100644 index 0000000000..3a6371f442 --- /dev/null +++ b/lib/src/components/Icons/Connection/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ConnectionIcon: React.FC = props => { + return +} diff --git a/icons/src/Contract/content.json b/lib/src/components/Icons/Contract/content.json similarity index 100% rename from icons/src/Contract/content.json rename to lib/src/components/Icons/Contract/content.json diff --git a/lib/src/components/Icons/Contract/index.tsx b/lib/src/components/Icons/Contract/index.tsx new file mode 100644 index 0000000000..d4df8f02cc --- /dev/null +++ b/lib/src/components/Icons/Contract/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ContractIcon: React.FC = props => { + return +} diff --git a/icons/src/ControlBackward/content.json b/lib/src/components/Icons/ControlBackward/content.json similarity index 100% rename from icons/src/ControlBackward/content.json rename to lib/src/components/Icons/ControlBackward/content.json diff --git a/lib/src/components/Icons/ControlBackward/index.tsx b/lib/src/components/Icons/ControlBackward/index.tsx new file mode 100644 index 0000000000..2bf167a2d4 --- /dev/null +++ b/lib/src/components/Icons/ControlBackward/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ControlBackwardIcon: React.FC = props => { + return +} diff --git a/icons/src/ControlForward/content.json b/lib/src/components/Icons/ControlForward/content.json similarity index 100% rename from icons/src/ControlForward/content.json rename to lib/src/components/Icons/ControlForward/content.json diff --git a/lib/src/components/Icons/ControlForward/index.tsx b/lib/src/components/Icons/ControlForward/index.tsx new file mode 100644 index 0000000000..35a2794e3e --- /dev/null +++ b/lib/src/components/Icons/ControlForward/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ControlForwardIcon: React.FC = props => { + return +} diff --git a/icons/src/ControlPause/content.json b/lib/src/components/Icons/ControlPause/content.json similarity index 100% rename from icons/src/ControlPause/content.json rename to lib/src/components/Icons/ControlPause/content.json diff --git a/lib/src/components/Icons/ControlPause/index.tsx b/lib/src/components/Icons/ControlPause/index.tsx new file mode 100644 index 0000000000..6afb5bf1c7 --- /dev/null +++ b/lib/src/components/Icons/ControlPause/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ControlPauseIcon: React.FC = props => { + return +} diff --git a/icons/src/ControlStop/content.json b/lib/src/components/Icons/ControlStop/content.json similarity index 100% rename from icons/src/ControlStop/content.json rename to lib/src/components/Icons/ControlStop/content.json diff --git a/lib/src/components/Icons/ControlStop/index.tsx b/lib/src/components/Icons/ControlStop/index.tsx new file mode 100644 index 0000000000..63f2de714d --- /dev/null +++ b/lib/src/components/Icons/ControlStop/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ControlStopIcon: React.FC = props => { + return +} diff --git a/icons/src/Copy/content.json b/lib/src/components/Icons/Copy/content.json similarity index 100% rename from icons/src/Copy/content.json rename to lib/src/components/Icons/Copy/content.json diff --git a/lib/src/components/Icons/Copy/index.tsx b/lib/src/components/Icons/Copy/index.tsx new file mode 100644 index 0000000000..34f58c4788 --- /dev/null +++ b/lib/src/components/Icons/Copy/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CopyIcon: React.FC = props => { + return +} diff --git a/icons/src/CoverLetter/content.json b/lib/src/components/Icons/CoverLetter/content.json similarity index 100% rename from icons/src/CoverLetter/content.json rename to lib/src/components/Icons/CoverLetter/content.json diff --git a/lib/src/components/Icons/CoverLetter/index.tsx b/lib/src/components/Icons/CoverLetter/index.tsx new file mode 100644 index 0000000000..c93143deff --- /dev/null +++ b/lib/src/components/Icons/CoverLetter/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CoverLetterIcon: React.FC = props => { + return +} diff --git a/icons/src/Create/content.json b/lib/src/components/Icons/Create/content.json similarity index 100% rename from icons/src/Create/content.json rename to lib/src/components/Icons/Create/content.json diff --git a/lib/src/components/Icons/Create/index.tsx b/lib/src/components/Icons/Create/index.tsx new file mode 100644 index 0000000000..24bae06f31 --- /dev/null +++ b/lib/src/components/Icons/Create/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CreateIcon: React.FC = props => { + return +} diff --git a/icons/src/CreditCard/content.json b/lib/src/components/Icons/CreditCard/content.json similarity index 100% rename from icons/src/CreditCard/content.json rename to lib/src/components/Icons/CreditCard/content.json diff --git a/lib/src/components/Icons/CreditCard/index.tsx b/lib/src/components/Icons/CreditCard/index.tsx new file mode 100644 index 0000000000..397ee04e66 --- /dev/null +++ b/lib/src/components/Icons/CreditCard/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CreditCardIcon: React.FC = props => { + return +} diff --git a/icons/src/CrescentMoon/content.json b/lib/src/components/Icons/CrescentMoon/content.json similarity index 100% rename from icons/src/CrescentMoon/content.json rename to lib/src/components/Icons/CrescentMoon/content.json diff --git a/lib/src/components/Icons/CrescentMoon/index.tsx b/lib/src/components/Icons/CrescentMoon/index.tsx new file mode 100644 index 0000000000..c43990a038 --- /dev/null +++ b/lib/src/components/Icons/CrescentMoon/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CrescentMoonIcon: React.FC = props => { + return +} diff --git a/icons/src/CrescentMoonOutline/content.json b/lib/src/components/Icons/CrescentMoonOutline/content.json similarity index 100% rename from icons/src/CrescentMoonOutline/content.json rename to lib/src/components/Icons/CrescentMoonOutline/content.json diff --git a/lib/src/components/Icons/CrescentMoonOutline/index.tsx b/lib/src/components/Icons/CrescentMoonOutline/index.tsx new file mode 100644 index 0000000000..2f719a9ef2 --- /dev/null +++ b/lib/src/components/Icons/CrescentMoonOutline/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CrescentMoonOutlineIcon: React.FC = props => { + return +} diff --git a/icons/src/Cross/content.json b/lib/src/components/Icons/Cross/content.json similarity index 100% rename from icons/src/Cross/content.json rename to lib/src/components/Icons/Cross/content.json diff --git a/lib/src/components/Icons/Cross/index.tsx b/lib/src/components/Icons/Cross/index.tsx new file mode 100644 index 0000000000..854fe07e27 --- /dev/null +++ b/lib/src/components/Icons/Cross/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CrossIcon: React.FC = props => { + return +} diff --git a/icons/src/CrossTarget/content.json b/lib/src/components/Icons/CrossTarget/content.json similarity index 100% rename from icons/src/CrossTarget/content.json rename to lib/src/components/Icons/CrossTarget/content.json diff --git a/lib/src/components/Icons/CrossTarget/index.tsx b/lib/src/components/Icons/CrossTarget/index.tsx new file mode 100644 index 0000000000..0e61e72445 --- /dev/null +++ b/lib/src/components/Icons/CrossTarget/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CrossTargetIcon: React.FC = props => { + return +} diff --git a/icons/src/Crown/content.json b/lib/src/components/Icons/Crown/content.json similarity index 100% rename from icons/src/Crown/content.json rename to lib/src/components/Icons/Crown/content.json diff --git a/lib/src/components/Icons/Crown/index.tsx b/lib/src/components/Icons/Crown/index.tsx new file mode 100644 index 0000000000..433fd587f7 --- /dev/null +++ b/lib/src/components/Icons/Crown/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CrownIcon: React.FC = props => { + return +} diff --git a/icons/src/Csv/content.json b/lib/src/components/Icons/Csv/content.json similarity index 100% rename from icons/src/Csv/content.json rename to lib/src/components/Icons/Csv/content.json diff --git a/lib/src/components/Icons/Csv/index.tsx b/lib/src/components/Icons/Csv/index.tsx new file mode 100644 index 0000000000..742a881946 --- /dev/null +++ b/lib/src/components/Icons/Csv/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const CsvIcon: React.FC = props => { + return +} diff --git a/icons/src/Date/content.json b/lib/src/components/Icons/Date/content.json similarity index 100% rename from icons/src/Date/content.json rename to lib/src/components/Icons/Date/content.json diff --git a/lib/src/components/Icons/Date/index.tsx b/lib/src/components/Icons/Date/index.tsx new file mode 100644 index 0000000000..a5ad1fdf50 --- /dev/null +++ b/lib/src/components/Icons/Date/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const DateIcon: React.FC = props => { + return +} diff --git a/icons/src/Department/content.json b/lib/src/components/Icons/Department/content.json similarity index 100% rename from icons/src/Department/content.json rename to lib/src/components/Icons/Department/content.json diff --git a/lib/src/components/Icons/Department/index.tsx b/lib/src/components/Icons/Department/index.tsx new file mode 100644 index 0000000000..053e94bd8d --- /dev/null +++ b/lib/src/components/Icons/Department/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const DepartmentIcon: React.FC = props => { + return +} diff --git a/icons/src/Details/content.json b/lib/src/components/Icons/Details/content.json similarity index 100% rename from icons/src/Details/content.json rename to lib/src/components/Icons/Details/content.json diff --git a/lib/src/components/Icons/Details/index.tsx b/lib/src/components/Icons/Details/index.tsx new file mode 100644 index 0000000000..05d0155ee5 --- /dev/null +++ b/lib/src/components/Icons/Details/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const DetailsIcon: React.FC = props => { + return +} diff --git a/icons/src/Diamond/content.json b/lib/src/components/Icons/Diamond/content.json similarity index 100% rename from icons/src/Diamond/content.json rename to lib/src/components/Icons/Diamond/content.json diff --git a/lib/src/components/Icons/Diamond/index.tsx b/lib/src/components/Icons/Diamond/index.tsx new file mode 100644 index 0000000000..d927faec61 --- /dev/null +++ b/lib/src/components/Icons/Diamond/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const DiamondIcon: React.FC = props => { + return +} diff --git a/icons/src/Dish/content.json b/lib/src/components/Icons/Dish/content.json similarity index 100% rename from icons/src/Dish/content.json rename to lib/src/components/Icons/Dish/content.json diff --git a/lib/src/components/Icons/Dish/index.tsx b/lib/src/components/Icons/Dish/index.tsx new file mode 100644 index 0000000000..a8712392d4 --- /dev/null +++ b/lib/src/components/Icons/Dish/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const DishIcon: React.FC = props => { + return +} diff --git a/icons/src/Doc/content.json b/lib/src/components/Icons/Doc/content.json similarity index 100% rename from icons/src/Doc/content.json rename to lib/src/components/Icons/Doc/content.json diff --git a/lib/src/components/Icons/Doc/index.tsx b/lib/src/components/Icons/Doc/index.tsx new file mode 100644 index 0000000000..010515bf26 --- /dev/null +++ b/lib/src/components/Icons/Doc/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const DocIcon: React.FC = props => { + return +} diff --git a/icons/src/Docx/content.json b/lib/src/components/Icons/Docx/content.json similarity index 100% rename from icons/src/Docx/content.json rename to lib/src/components/Icons/Docx/content.json diff --git a/lib/src/components/Icons/Docx/index.tsx b/lib/src/components/Icons/Docx/index.tsx new file mode 100644 index 0000000000..ae0fb1e796 --- /dev/null +++ b/lib/src/components/Icons/Docx/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const DocxIcon: React.FC = props => { + return +} diff --git a/icons/src/Down/content.json b/lib/src/components/Icons/Down/content.json similarity index 100% rename from icons/src/Down/content.json rename to lib/src/components/Icons/Down/content.json diff --git a/lib/src/components/Icons/Down/index.tsx b/lib/src/components/Icons/Down/index.tsx new file mode 100644 index 0000000000..879e4d1f14 --- /dev/null +++ b/lib/src/components/Icons/Down/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const DownIcon: React.FC = props => { + return +} diff --git a/icons/src/Download/content.json b/lib/src/components/Icons/Download/content.json similarity index 100% rename from icons/src/Download/content.json rename to lib/src/components/Icons/Download/content.json diff --git a/lib/src/components/Icons/Download/index.tsx b/lib/src/components/Icons/Download/index.tsx new file mode 100644 index 0000000000..37e9360e7e --- /dev/null +++ b/lib/src/components/Icons/Download/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const DownloadIcon: React.FC = props => { + return +} diff --git a/icons/src/DragAndDrop/content.json b/lib/src/components/Icons/DragAndDrop/content.json similarity index 100% rename from icons/src/DragAndDrop/content.json rename to lib/src/components/Icons/DragAndDrop/content.json diff --git a/lib/src/components/Icons/DragAndDrop/index.tsx b/lib/src/components/Icons/DragAndDrop/index.tsx new file mode 100644 index 0000000000..0c75083a6d --- /dev/null +++ b/lib/src/components/Icons/DragAndDrop/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const DragAndDropIcon: React.FC = props => { + return +} diff --git a/icons/src/Dribbble/content.json b/lib/src/components/Icons/Dribbble/content.json similarity index 100% rename from icons/src/Dribbble/content.json rename to lib/src/components/Icons/Dribbble/content.json diff --git a/lib/src/components/Icons/Dribbble/index.tsx b/lib/src/components/Icons/Dribbble/index.tsx new file mode 100644 index 0000000000..219d21cb66 --- /dev/null +++ b/lib/src/components/Icons/Dribbble/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const DribbbleIcon: React.FC = props => { + return +} diff --git a/icons/src/Earth/content.json b/lib/src/components/Icons/Earth/content.json similarity index 100% rename from icons/src/Earth/content.json rename to lib/src/components/Icons/Earth/content.json diff --git a/lib/src/components/Icons/Earth/index.tsx b/lib/src/components/Icons/Earth/index.tsx new file mode 100644 index 0000000000..3d3da1500d --- /dev/null +++ b/lib/src/components/Icons/Earth/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const EarthIcon: React.FC = props => { + return +} diff --git a/icons/src/Edit/content.json b/lib/src/components/Icons/Edit/content.json similarity index 100% rename from icons/src/Edit/content.json rename to lib/src/components/Icons/Edit/content.json diff --git a/lib/src/components/Icons/Edit/index.tsx b/lib/src/components/Icons/Edit/index.tsx new file mode 100644 index 0000000000..18ae820550 --- /dev/null +++ b/lib/src/components/Icons/Edit/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const EditIcon: React.FC = props => { + return +} diff --git a/icons/src/EducationLevel/content.json b/lib/src/components/Icons/EducationLevel/content.json similarity index 100% rename from icons/src/EducationLevel/content.json rename to lib/src/components/Icons/EducationLevel/content.json diff --git a/lib/src/components/Icons/EducationLevel/index.tsx b/lib/src/components/Icons/EducationLevel/index.tsx new file mode 100644 index 0000000000..50465437d1 --- /dev/null +++ b/lib/src/components/Icons/EducationLevel/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const EducationLevelIcon: React.FC = props => { + return +} diff --git a/icons/src/Email/content.json b/lib/src/components/Icons/Email/content.json similarity index 100% rename from icons/src/Email/content.json rename to lib/src/components/Icons/Email/content.json diff --git a/lib/src/components/Icons/Email/index.tsx b/lib/src/components/Icons/Email/index.tsx new file mode 100644 index 0000000000..f2e04e81cd --- /dev/null +++ b/lib/src/components/Icons/Email/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const EmailIcon: React.FC = props => { + return +} diff --git a/icons/src/EmailOutline/content.json b/lib/src/components/Icons/EmailOutline/content.json similarity index 100% rename from icons/src/EmailOutline/content.json rename to lib/src/components/Icons/EmailOutline/content.json diff --git a/lib/src/components/Icons/EmailOutline/index.tsx b/lib/src/components/Icons/EmailOutline/index.tsx new file mode 100644 index 0000000000..395d602472 --- /dev/null +++ b/lib/src/components/Icons/EmailOutline/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const EmailOutlineIcon: React.FC = props => { + return +} diff --git a/icons/src/Eot/content.json b/lib/src/components/Icons/Eot/content.json similarity index 100% rename from icons/src/Eot/content.json rename to lib/src/components/Icons/Eot/content.json diff --git a/lib/src/components/Icons/Eot/index.tsx b/lib/src/components/Icons/Eot/index.tsx new file mode 100644 index 0000000000..ef63ee42ac --- /dev/null +++ b/lib/src/components/Icons/Eot/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const EotIcon: React.FC = props => { + return +} diff --git a/icons/src/Equal/content.json b/lib/src/components/Icons/Equal/content.json similarity index 100% rename from icons/src/Equal/content.json rename to lib/src/components/Icons/Equal/content.json diff --git a/lib/src/components/Icons/Equal/index.tsx b/lib/src/components/Icons/Equal/index.tsx new file mode 100644 index 0000000000..e9f308b6e2 --- /dev/null +++ b/lib/src/components/Icons/Equal/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const EqualIcon: React.FC = props => { + return +} diff --git a/icons/src/EuroCurrency/content.json b/lib/src/components/Icons/EuroCurrency/content.json similarity index 100% rename from icons/src/EuroCurrency/content.json rename to lib/src/components/Icons/EuroCurrency/content.json diff --git a/lib/src/components/Icons/EuroCurrency/index.tsx b/lib/src/components/Icons/EuroCurrency/index.tsx new file mode 100644 index 0000000000..e6a9cb0208 --- /dev/null +++ b/lib/src/components/Icons/EuroCurrency/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const EuroCurrencyIcon: React.FC = props => { + return +} diff --git a/icons/src/Expand/content.json b/lib/src/components/Icons/Expand/content.json similarity index 100% rename from icons/src/Expand/content.json rename to lib/src/components/Icons/Expand/content.json diff --git a/lib/src/components/Icons/Expand/index.tsx b/lib/src/components/Icons/Expand/index.tsx new file mode 100644 index 0000000000..86d730f86b --- /dev/null +++ b/lib/src/components/Icons/Expand/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ExpandIcon: React.FC = props => { + return +} diff --git a/icons/src/ExpandText/content.json b/lib/src/components/Icons/ExpandText/content.json similarity index 100% rename from icons/src/ExpandText/content.json rename to lib/src/components/Icons/ExpandText/content.json diff --git a/lib/src/components/Icons/ExpandText/index.tsx b/lib/src/components/Icons/ExpandText/index.tsx new file mode 100644 index 0000000000..60a231ae43 --- /dev/null +++ b/lib/src/components/Icons/ExpandText/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ExpandTextIcon: React.FC = props => { + return +} diff --git a/icons/src/Extend/content.json b/lib/src/components/Icons/Extend/content.json similarity index 100% rename from icons/src/Extend/content.json rename to lib/src/components/Icons/Extend/content.json diff --git a/lib/src/components/Icons/Extend/index.tsx b/lib/src/components/Icons/Extend/index.tsx new file mode 100644 index 0000000000..2270a7b1cc --- /dev/null +++ b/lib/src/components/Icons/Extend/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ExtendIcon: React.FC = props => { + return +} diff --git a/icons/src/ExternalLink/content.json b/lib/src/components/Icons/ExternalLink/content.json similarity index 100% rename from icons/src/ExternalLink/content.json rename to lib/src/components/Icons/ExternalLink/content.json diff --git a/lib/src/components/Icons/ExternalLink/index.tsx b/lib/src/components/Icons/ExternalLink/index.tsx new file mode 100644 index 0000000000..ffc7c77285 --- /dev/null +++ b/lib/src/components/Icons/ExternalLink/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ExternalLinkIcon: React.FC = props => { + return +} diff --git a/icons/src/Facebook/content.json b/lib/src/components/Icons/Facebook/content.json similarity index 100% rename from icons/src/Facebook/content.json rename to lib/src/components/Icons/Facebook/content.json diff --git a/lib/src/components/Icons/Facebook/index.tsx b/lib/src/components/Icons/Facebook/index.tsx new file mode 100644 index 0000000000..09abf03ad7 --- /dev/null +++ b/lib/src/components/Icons/Facebook/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const FacebookIcon: React.FC = props => { + return +} diff --git a/icons/src/Factory/content.json b/lib/src/components/Icons/Factory/content.json similarity index 100% rename from icons/src/Factory/content.json rename to lib/src/components/Icons/Factory/content.json diff --git a/lib/src/components/Icons/Factory/index.tsx b/lib/src/components/Icons/Factory/index.tsx new file mode 100644 index 0000000000..301368e34b --- /dev/null +++ b/lib/src/components/Icons/Factory/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const FactoryIcon: React.FC = props => { + return +} diff --git a/icons/src/Female/content.json b/lib/src/components/Icons/Female/content.json similarity index 100% rename from icons/src/Female/content.json rename to lib/src/components/Icons/Female/content.json diff --git a/lib/src/components/Icons/Female/index.tsx b/lib/src/components/Icons/Female/index.tsx new file mode 100644 index 0000000000..9c5f17ef94 --- /dev/null +++ b/lib/src/components/Icons/Female/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const FemaleIcon: React.FC = props => { + return +} diff --git a/icons/src/Filters/content.json b/lib/src/components/Icons/Filters/content.json similarity index 100% rename from icons/src/Filters/content.json rename to lib/src/components/Icons/Filters/content.json diff --git a/lib/src/components/Icons/Filters/index.tsx b/lib/src/components/Icons/Filters/index.tsx new file mode 100644 index 0000000000..1a8bb2c0b8 --- /dev/null +++ b/lib/src/components/Icons/Filters/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const FiltersIcon: React.FC = props => { + return +} diff --git a/icons/src/Fingerprint/content.json b/lib/src/components/Icons/Fingerprint/content.json similarity index 100% rename from icons/src/Fingerprint/content.json rename to lib/src/components/Icons/Fingerprint/content.json diff --git a/lib/src/components/Icons/Fingerprint/index.tsx b/lib/src/components/Icons/Fingerprint/index.tsx new file mode 100644 index 0000000000..c6e61efb1b --- /dev/null +++ b/lib/src/components/Icons/Fingerprint/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const FingerprintIcon: React.FC = props => { + return +} diff --git a/icons/src/Flag/content.json b/lib/src/components/Icons/Flag/content.json similarity index 100% rename from icons/src/Flag/content.json rename to lib/src/components/Icons/Flag/content.json diff --git a/lib/src/components/Icons/Flag/index.tsx b/lib/src/components/Icons/Flag/index.tsx new file mode 100644 index 0000000000..fbea9a6489 --- /dev/null +++ b/lib/src/components/Icons/Flag/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const FlagIcon: React.FC = props => { + return +} diff --git a/icons/src/FlagCs/content.json b/lib/src/components/Icons/FlagCs/content.json similarity index 100% rename from icons/src/FlagCs/content.json rename to lib/src/components/Icons/FlagCs/content.json diff --git a/lib/src/components/Icons/FlagCs/index.tsx b/lib/src/components/Icons/FlagCs/index.tsx new file mode 100644 index 0000000000..ccc78cc71b --- /dev/null +++ b/lib/src/components/Icons/FlagCs/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const FlagCsIcon: React.FC = props => { + return +} diff --git a/icons/src/FlagEn/content.json b/lib/src/components/Icons/FlagEn/content.json similarity index 100% rename from icons/src/FlagEn/content.json rename to lib/src/components/Icons/FlagEn/content.json diff --git a/lib/src/components/Icons/FlagEn/index.tsx b/lib/src/components/Icons/FlagEn/index.tsx new file mode 100644 index 0000000000..8c9dc985ba --- /dev/null +++ b/lib/src/components/Icons/FlagEn/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const FlagEnIcon: React.FC = props => { + return +} diff --git a/icons/src/FlagEs/content.json b/lib/src/components/Icons/FlagEs/content.json similarity index 100% rename from icons/src/FlagEs/content.json rename to lib/src/components/Icons/FlagEs/content.json diff --git a/lib/src/components/Icons/FlagEs/index.tsx b/lib/src/components/Icons/FlagEs/index.tsx new file mode 100644 index 0000000000..d8de9f1724 --- /dev/null +++ b/lib/src/components/Icons/FlagEs/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const FlagEsIcon: React.FC = props => { + return +} diff --git a/icons/src/FlagFr/content.json b/lib/src/components/Icons/FlagFr/content.json similarity index 100% rename from icons/src/FlagFr/content.json rename to lib/src/components/Icons/FlagFr/content.json diff --git a/lib/src/components/Icons/FlagFr/index.tsx b/lib/src/components/Icons/FlagFr/index.tsx new file mode 100644 index 0000000000..687b4a5bf6 --- /dev/null +++ b/lib/src/components/Icons/FlagFr/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const FlagFrIcon: React.FC = props => { + return +} diff --git a/icons/src/FlagOutline/content.json b/lib/src/components/Icons/FlagOutline/content.json similarity index 100% rename from icons/src/FlagOutline/content.json rename to lib/src/components/Icons/FlagOutline/content.json diff --git a/lib/src/components/Icons/FlagOutline/index.tsx b/lib/src/components/Icons/FlagOutline/index.tsx new file mode 100644 index 0000000000..c5bf141ebd --- /dev/null +++ b/lib/src/components/Icons/FlagOutline/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const FlagOutlineIcon: React.FC = props => { + return +} diff --git a/icons/src/FlagPointed/content.json b/lib/src/components/Icons/FlagPointed/content.json similarity index 100% rename from icons/src/FlagPointed/content.json rename to lib/src/components/Icons/FlagPointed/content.json diff --git a/lib/src/components/Icons/FlagPointed/index.tsx b/lib/src/components/Icons/FlagPointed/index.tsx new file mode 100644 index 0000000000..05ed31944a --- /dev/null +++ b/lib/src/components/Icons/FlagPointed/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const FlagPointedIcon: React.FC = props => { + return +} diff --git a/icons/src/FlagSk/content.json b/lib/src/components/Icons/FlagSk/content.json similarity index 100% rename from icons/src/FlagSk/content.json rename to lib/src/components/Icons/FlagSk/content.json diff --git a/lib/src/components/Icons/FlagSk/index.tsx b/lib/src/components/Icons/FlagSk/index.tsx new file mode 100644 index 0000000000..c9ac09f83e --- /dev/null +++ b/lib/src/components/Icons/FlagSk/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const FlagSkIcon: React.FC = props => { + return +} diff --git a/icons/src/FlagUs/content.json b/lib/src/components/Icons/FlagUs/content.json similarity index 100% rename from icons/src/FlagUs/content.json rename to lib/src/components/Icons/FlagUs/content.json diff --git a/lib/src/components/Icons/FlagUs/index.tsx b/lib/src/components/Icons/FlagUs/index.tsx new file mode 100644 index 0000000000..c7459c9d21 --- /dev/null +++ b/lib/src/components/Icons/FlagUs/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const FlagUsIcon: React.FC = props => { + return +} diff --git a/icons/src/Folder/content.json b/lib/src/components/Icons/Folder/content.json similarity index 100% rename from icons/src/Folder/content.json rename to lib/src/components/Icons/Folder/content.json diff --git a/lib/src/components/Icons/Folder/index.tsx b/lib/src/components/Icons/Folder/index.tsx new file mode 100644 index 0000000000..275f6d420f --- /dev/null +++ b/lib/src/components/Icons/Folder/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const FolderIcon: React.FC = props => { + return +} diff --git a/icons/src/FullscreenOff/content.json b/lib/src/components/Icons/FullscreenOff/content.json similarity index 100% rename from icons/src/FullscreenOff/content.json rename to lib/src/components/Icons/FullscreenOff/content.json diff --git a/lib/src/components/Icons/FullscreenOff/index.tsx b/lib/src/components/Icons/FullscreenOff/index.tsx new file mode 100644 index 0000000000..0b54fc1628 --- /dev/null +++ b/lib/src/components/Icons/FullscreenOff/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const FullscreenOffIcon: React.FC = props => { + return +} diff --git a/icons/src/FullscreenOn/content.json b/lib/src/components/Icons/FullscreenOn/content.json similarity index 100% rename from icons/src/FullscreenOn/content.json rename to lib/src/components/Icons/FullscreenOn/content.json diff --git a/lib/src/components/Icons/FullscreenOn/index.tsx b/lib/src/components/Icons/FullscreenOn/index.tsx new file mode 100644 index 0000000000..c64e901e22 --- /dev/null +++ b/lib/src/components/Icons/FullscreenOn/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const FullscreenOnIcon: React.FC = props => { + return +} diff --git a/icons/src/Gear/content.json b/lib/src/components/Icons/Gear/content.json similarity index 100% rename from icons/src/Gear/content.json rename to lib/src/components/Icons/Gear/content.json diff --git a/lib/src/components/Icons/Gear/index.tsx b/lib/src/components/Icons/Gear/index.tsx new file mode 100644 index 0000000000..144a07674a --- /dev/null +++ b/lib/src/components/Icons/Gear/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const GearIcon: React.FC = props => { + return +} diff --git a/icons/src/Gif/content.json b/lib/src/components/Icons/Gif/content.json similarity index 100% rename from icons/src/Gif/content.json rename to lib/src/components/Icons/Gif/content.json diff --git a/lib/src/components/Icons/Gif/index.tsx b/lib/src/components/Icons/Gif/index.tsx new file mode 100644 index 0000000000..e639af1a61 --- /dev/null +++ b/lib/src/components/Icons/Gif/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const GifIcon: React.FC = props => { + return +} diff --git a/icons/src/Github/content.json b/lib/src/components/Icons/Github/content.json similarity index 100% rename from icons/src/Github/content.json rename to lib/src/components/Icons/Github/content.json diff --git a/lib/src/components/Icons/Github/index.tsx b/lib/src/components/Icons/Github/index.tsx new file mode 100644 index 0000000000..d28ebd05e4 --- /dev/null +++ b/lib/src/components/Icons/Github/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const GithubIcon: React.FC = props => { + return +} diff --git a/icons/src/Google/content.json b/lib/src/components/Icons/Google/content.json similarity index 100% rename from icons/src/Google/content.json rename to lib/src/components/Icons/Google/content.json diff --git a/lib/src/components/Icons/Google/index.tsx b/lib/src/components/Icons/Google/index.tsx new file mode 100644 index 0000000000..98ee51fb20 --- /dev/null +++ b/lib/src/components/Icons/Google/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const GoogleIcon: React.FC = props => { + return +} diff --git a/icons/src/Handshake/content.json b/lib/src/components/Icons/Handshake/content.json similarity index 100% rename from icons/src/Handshake/content.json rename to lib/src/components/Icons/Handshake/content.json diff --git a/lib/src/components/Icons/Handshake/index.tsx b/lib/src/components/Icons/Handshake/index.tsx new file mode 100644 index 0000000000..fb6951a40e --- /dev/null +++ b/lib/src/components/Icons/Handshake/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const HandshakeIcon: React.FC = props => { + return +} diff --git a/icons/src/HardHat/content.json b/lib/src/components/Icons/HardHat/content.json similarity index 100% rename from icons/src/HardHat/content.json rename to lib/src/components/Icons/HardHat/content.json diff --git a/lib/src/components/Icons/HardHat/index.tsx b/lib/src/components/Icons/HardHat/index.tsx new file mode 100644 index 0000000000..dd70779920 --- /dev/null +++ b/lib/src/components/Icons/HardHat/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const HardHatIcon: React.FC = props => { + return +} diff --git a/icons/src/Hashtag/content.json b/lib/src/components/Icons/Hashtag/content.json similarity index 100% rename from icons/src/Hashtag/content.json rename to lib/src/components/Icons/Hashtag/content.json diff --git a/lib/src/components/Icons/Hashtag/index.tsx b/lib/src/components/Icons/Hashtag/index.tsx new file mode 100644 index 0000000000..f625b2f85e --- /dev/null +++ b/lib/src/components/Icons/Hashtag/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const HashtagIcon: React.FC = props => { + return +} diff --git a/icons/src/Heading/content.json b/lib/src/components/Icons/Heading/content.json similarity index 100% rename from icons/src/Heading/content.json rename to lib/src/components/Icons/Heading/content.json diff --git a/lib/src/components/Icons/Heading/index.tsx b/lib/src/components/Icons/Heading/index.tsx new file mode 100644 index 0000000000..fc0cfb605e --- /dev/null +++ b/lib/src/components/Icons/Heading/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const HeadingIcon: React.FC = props => { + return +} diff --git a/icons/src/Heading1/content.json b/lib/src/components/Icons/Heading1/content.json similarity index 100% rename from icons/src/Heading1/content.json rename to lib/src/components/Icons/Heading1/content.json diff --git a/lib/src/components/Icons/Heading1/index.tsx b/lib/src/components/Icons/Heading1/index.tsx new file mode 100644 index 0000000000..f4affbbd0b --- /dev/null +++ b/lib/src/components/Icons/Heading1/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const Heading1Icon: React.FC = props => { + return +} diff --git a/icons/src/Heading2/content.json b/lib/src/components/Icons/Heading2/content.json similarity index 100% rename from icons/src/Heading2/content.json rename to lib/src/components/Icons/Heading2/content.json diff --git a/lib/src/components/Icons/Heading2/index.tsx b/lib/src/components/Icons/Heading2/index.tsx new file mode 100644 index 0000000000..7a3a71c368 --- /dev/null +++ b/lib/src/components/Icons/Heading2/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const Heading2Icon: React.FC = props => { + return +} diff --git a/icons/src/Heading3/content.json b/lib/src/components/Icons/Heading3/content.json similarity index 100% rename from icons/src/Heading3/content.json rename to lib/src/components/Icons/Heading3/content.json diff --git a/lib/src/components/Icons/Heading3/index.tsx b/lib/src/components/Icons/Heading3/index.tsx new file mode 100644 index 0000000000..ee7a612d5e --- /dev/null +++ b/lib/src/components/Icons/Heading3/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const Heading3Icon: React.FC = props => { + return +} diff --git a/icons/src/Heading4/content.json b/lib/src/components/Icons/Heading4/content.json similarity index 100% rename from icons/src/Heading4/content.json rename to lib/src/components/Icons/Heading4/content.json diff --git a/lib/src/components/Icons/Heading4/index.tsx b/lib/src/components/Icons/Heading4/index.tsx new file mode 100644 index 0000000000..0c51022bae --- /dev/null +++ b/lib/src/components/Icons/Heading4/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const Heading4Icon: React.FC = props => { + return +} diff --git a/icons/src/Heading5/content.json b/lib/src/components/Icons/Heading5/content.json similarity index 100% rename from icons/src/Heading5/content.json rename to lib/src/components/Icons/Heading5/content.json diff --git a/lib/src/components/Icons/Heading5/index.tsx b/lib/src/components/Icons/Heading5/index.tsx new file mode 100644 index 0000000000..f60998b17b --- /dev/null +++ b/lib/src/components/Icons/Heading5/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const Heading5Icon: React.FC = props => { + return +} diff --git a/icons/src/Heading6/content.json b/lib/src/components/Icons/Heading6/content.json similarity index 100% rename from icons/src/Heading6/content.json rename to lib/src/components/Icons/Heading6/content.json diff --git a/lib/src/components/Icons/Heading6/index.tsx b/lib/src/components/Icons/Heading6/index.tsx new file mode 100644 index 0000000000..65fad9dd51 --- /dev/null +++ b/lib/src/components/Icons/Heading6/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const Heading6Icon: React.FC = props => { + return +} diff --git a/icons/src/Headset/content.json b/lib/src/components/Icons/Headset/content.json similarity index 100% rename from icons/src/Headset/content.json rename to lib/src/components/Icons/Headset/content.json diff --git a/lib/src/components/Icons/Headset/index.tsx b/lib/src/components/Icons/Headset/index.tsx new file mode 100644 index 0000000000..462afff314 --- /dev/null +++ b/lib/src/components/Icons/Headset/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const HeadsetIcon: React.FC = props => { + return +} diff --git a/icons/src/Heart/content.json b/lib/src/components/Icons/Heart/content.json similarity index 100% rename from icons/src/Heart/content.json rename to lib/src/components/Icons/Heart/content.json diff --git a/lib/src/components/Icons/Heart/index.tsx b/lib/src/components/Icons/Heart/index.tsx new file mode 100644 index 0000000000..d4ae088580 --- /dev/null +++ b/lib/src/components/Icons/Heart/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const HeartIcon: React.FC = props => { + return +} diff --git a/icons/src/HeartOutline/content.json b/lib/src/components/Icons/HeartOutline/content.json similarity index 100% rename from icons/src/HeartOutline/content.json rename to lib/src/components/Icons/HeartOutline/content.json diff --git a/lib/src/components/Icons/HeartOutline/index.tsx b/lib/src/components/Icons/HeartOutline/index.tsx new file mode 100644 index 0000000000..086a1cb00e --- /dev/null +++ b/lib/src/components/Icons/HeartOutline/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const HeartOutlineIcon: React.FC = props => { + return +} diff --git a/icons/src/HeartShiny/content.json b/lib/src/components/Icons/HeartShiny/content.json similarity index 100% rename from icons/src/HeartShiny/content.json rename to lib/src/components/Icons/HeartShiny/content.json diff --git a/lib/src/components/Icons/HeartShiny/index.tsx b/lib/src/components/Icons/HeartShiny/index.tsx new file mode 100644 index 0000000000..b7d498c88d --- /dev/null +++ b/lib/src/components/Icons/HeartShiny/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const HeartShinyIcon: React.FC = props => { + return +} diff --git a/icons/src/Hide/content.json b/lib/src/components/Icons/Hide/content.json similarity index 100% rename from icons/src/Hide/content.json rename to lib/src/components/Icons/Hide/content.json diff --git a/lib/src/components/Icons/Hide/index.tsx b/lib/src/components/Icons/Hide/index.tsx new file mode 100644 index 0000000000..ddd06c5353 --- /dev/null +++ b/lib/src/components/Icons/Hide/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const HideIcon: React.FC = props => { + return +} diff --git a/icons/src/Home/content.json b/lib/src/components/Icons/Home/content.json similarity index 100% rename from icons/src/Home/content.json rename to lib/src/components/Icons/Home/content.json diff --git a/lib/src/components/Icons/Home/index.tsx b/lib/src/components/Icons/Home/index.tsx new file mode 100644 index 0000000000..484cac21fd --- /dev/null +++ b/lib/src/components/Icons/Home/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const HomeIcon: React.FC = props => { + return +} diff --git a/icons/src/House/content.json b/lib/src/components/Icons/House/content.json similarity index 100% rename from icons/src/House/content.json rename to lib/src/components/Icons/House/content.json diff --git a/lib/src/components/Icons/House/index.tsx b/lib/src/components/Icons/House/index.tsx new file mode 100644 index 0000000000..4b5e964b48 --- /dev/null +++ b/lib/src/components/Icons/House/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const HouseIcon: React.FC = props => { + return +} diff --git a/icons/src/InProgressCandidate/content.json b/lib/src/components/Icons/InProgressCandidate/content.json similarity index 100% rename from icons/src/InProgressCandidate/content.json rename to lib/src/components/Icons/InProgressCandidate/content.json diff --git a/lib/src/components/Icons/InProgressCandidate/index.tsx b/lib/src/components/Icons/InProgressCandidate/index.tsx new file mode 100644 index 0000000000..f4b4ba07a0 --- /dev/null +++ b/lib/src/components/Icons/InProgressCandidate/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const InProgressCandidateIcon: React.FC = props => { + return +} diff --git a/icons/src/Information/content.json b/lib/src/components/Icons/Information/content.json similarity index 100% rename from icons/src/Information/content.json rename to lib/src/components/Icons/Information/content.json diff --git a/lib/src/components/Icons/Information/index.tsx b/lib/src/components/Icons/Information/index.tsx new file mode 100644 index 0000000000..06e307d756 --- /dev/null +++ b/lib/src/components/Icons/Information/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const InformationIcon: React.FC = props => { + return +} diff --git a/icons/src/InformationOutline/content.json b/lib/src/components/Icons/InformationOutline/content.json similarity index 100% rename from icons/src/InformationOutline/content.json rename to lib/src/components/Icons/InformationOutline/content.json diff --git a/lib/src/components/Icons/InformationOutline/index.tsx b/lib/src/components/Icons/InformationOutline/index.tsx new file mode 100644 index 0000000000..2820c66b68 --- /dev/null +++ b/lib/src/components/Icons/InformationOutline/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const InformationOutlineIcon: React.FC = props => { + return +} diff --git a/icons/src/Instagram/content.json b/lib/src/components/Icons/Instagram/content.json similarity index 100% rename from icons/src/Instagram/content.json rename to lib/src/components/Icons/Instagram/content.json diff --git a/lib/src/components/Icons/Instagram/index.tsx b/lib/src/components/Icons/Instagram/index.tsx new file mode 100644 index 0000000000..af346d9ae8 --- /dev/null +++ b/lib/src/components/Icons/Instagram/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const InstagramIcon: React.FC = props => { + return +} diff --git a/icons/src/Italic/content.json b/lib/src/components/Icons/Italic/content.json similarity index 100% rename from icons/src/Italic/content.json rename to lib/src/components/Icons/Italic/content.json diff --git a/lib/src/components/Icons/Italic/index.tsx b/lib/src/components/Icons/Italic/index.tsx new file mode 100644 index 0000000000..49d966c3ad --- /dev/null +++ b/lib/src/components/Icons/Italic/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ItalicIcon: React.FC = props => { + return +} diff --git a/icons/src/Jpeg/content.json b/lib/src/components/Icons/Jpeg/content.json similarity index 100% rename from icons/src/Jpeg/content.json rename to lib/src/components/Icons/Jpeg/content.json diff --git a/lib/src/components/Icons/Jpeg/index.tsx b/lib/src/components/Icons/Jpeg/index.tsx new file mode 100644 index 0000000000..96cfdc8398 --- /dev/null +++ b/lib/src/components/Icons/Jpeg/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const JpegIcon: React.FC = props => { + return +} diff --git a/icons/src/Jpg/content.json b/lib/src/components/Icons/Jpg/content.json similarity index 100% rename from icons/src/Jpg/content.json rename to lib/src/components/Icons/Jpg/content.json diff --git a/lib/src/components/Icons/Jpg/index.tsx b/lib/src/components/Icons/Jpg/index.tsx new file mode 100644 index 0000000000..44e1631c7f --- /dev/null +++ b/lib/src/components/Icons/Jpg/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const JpgIcon: React.FC = props => { + return +} diff --git a/icons/src/JusticeHammer/content.json b/lib/src/components/Icons/JusticeHammer/content.json similarity index 100% rename from icons/src/JusticeHammer/content.json rename to lib/src/components/Icons/JusticeHammer/content.json diff --git a/lib/src/components/Icons/JusticeHammer/index.tsx b/lib/src/components/Icons/JusticeHammer/index.tsx new file mode 100644 index 0000000000..f6a84d33d1 --- /dev/null +++ b/lib/src/components/Icons/JusticeHammer/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const JusticeHammerIcon: React.FC = props => { + return +} diff --git a/icons/src/Kanban/content.json b/lib/src/components/Icons/Kanban/content.json similarity index 100% rename from icons/src/Kanban/content.json rename to lib/src/components/Icons/Kanban/content.json diff --git a/lib/src/components/Icons/Kanban/index.tsx b/lib/src/components/Icons/Kanban/index.tsx new file mode 100644 index 0000000000..8599f23e5f --- /dev/null +++ b/lib/src/components/Icons/Kanban/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const KanbanIcon: React.FC = props => { + return +} diff --git a/icons/src/Key/content.json b/lib/src/components/Icons/Key/content.json similarity index 100% rename from icons/src/Key/content.json rename to lib/src/components/Icons/Key/content.json diff --git a/lib/src/components/Icons/Key/index.tsx b/lib/src/components/Icons/Key/index.tsx new file mode 100644 index 0000000000..a88492d491 --- /dev/null +++ b/lib/src/components/Icons/Key/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const KeyIcon: React.FC = props => { + return +} diff --git a/icons/src/Language/content.json b/lib/src/components/Icons/Language/content.json similarity index 100% rename from icons/src/Language/content.json rename to lib/src/components/Icons/Language/content.json diff --git a/lib/src/components/Icons/Language/index.tsx b/lib/src/components/Icons/Language/index.tsx new file mode 100644 index 0000000000..c59f812c02 --- /dev/null +++ b/lib/src/components/Icons/Language/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const LanguageIcon: React.FC = props => { + return +} diff --git a/icons/src/Leaf/content.json b/lib/src/components/Icons/Leaf/content.json similarity index 100% rename from icons/src/Leaf/content.json rename to lib/src/components/Icons/Leaf/content.json diff --git a/lib/src/components/Icons/Leaf/index.tsx b/lib/src/components/Icons/Leaf/index.tsx new file mode 100644 index 0000000000..06b9360f74 --- /dev/null +++ b/lib/src/components/Icons/Leaf/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const LeafIcon: React.FC = props => { + return +} diff --git a/icons/src/Left/content.json b/lib/src/components/Icons/Left/content.json similarity index 100% rename from icons/src/Left/content.json rename to lib/src/components/Icons/Left/content.json diff --git a/lib/src/components/Icons/Left/index.tsx b/lib/src/components/Icons/Left/index.tsx new file mode 100644 index 0000000000..a7887e230d --- /dev/null +++ b/lib/src/components/Icons/Left/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const LeftIcon: React.FC = props => { + return +} diff --git a/icons/src/LineChart/content.json b/lib/src/components/Icons/LineChart/content.json similarity index 100% rename from icons/src/LineChart/content.json rename to lib/src/components/Icons/LineChart/content.json diff --git a/lib/src/components/Icons/LineChart/index.tsx b/lib/src/components/Icons/LineChart/index.tsx new file mode 100644 index 0000000000..b9bb466191 --- /dev/null +++ b/lib/src/components/Icons/LineChart/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const LineChartIcon: React.FC = props => { + return +} diff --git a/icons/src/Link/content.json b/lib/src/components/Icons/Link/content.json similarity index 100% rename from icons/src/Link/content.json rename to lib/src/components/Icons/Link/content.json diff --git a/lib/src/components/Icons/Link/index.tsx b/lib/src/components/Icons/Link/index.tsx new file mode 100644 index 0000000000..973724beee --- /dev/null +++ b/lib/src/components/Icons/Link/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const LinkIcon: React.FC = props => { + return +} diff --git a/icons/src/Linkedin/content.json b/lib/src/components/Icons/Linkedin/content.json similarity index 100% rename from icons/src/Linkedin/content.json rename to lib/src/components/Icons/Linkedin/content.json diff --git a/lib/src/components/Icons/Linkedin/index.tsx b/lib/src/components/Icons/Linkedin/index.tsx new file mode 100644 index 0000000000..458793ef40 --- /dev/null +++ b/lib/src/components/Icons/Linkedin/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const LinkedinIcon: React.FC = props => { + return +} diff --git a/icons/src/Location/content.json b/lib/src/components/Icons/Location/content.json similarity index 100% rename from icons/src/Location/content.json rename to lib/src/components/Icons/Location/content.json diff --git a/lib/src/components/Icons/Location/index.tsx b/lib/src/components/Icons/Location/index.tsx new file mode 100644 index 0000000000..52fb637303 --- /dev/null +++ b/lib/src/components/Icons/Location/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const LocationIcon: React.FC = props => { + return +} diff --git a/icons/src/Lock/content.json b/lib/src/components/Icons/Lock/content.json similarity index 100% rename from icons/src/Lock/content.json rename to lib/src/components/Icons/Lock/content.json diff --git a/lib/src/components/Icons/Lock/index.tsx b/lib/src/components/Icons/Lock/index.tsx new file mode 100644 index 0000000000..ff510e8d79 --- /dev/null +++ b/lib/src/components/Icons/Lock/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const LockIcon: React.FC = props => { + return +} diff --git a/icons/src/LockRounded/content.json b/lib/src/components/Icons/LockRounded/content.json similarity index 100% rename from icons/src/LockRounded/content.json rename to lib/src/components/Icons/LockRounded/content.json diff --git a/lib/src/components/Icons/LockRounded/index.tsx b/lib/src/components/Icons/LockRounded/index.tsx new file mode 100644 index 0000000000..0e66905d0d --- /dev/null +++ b/lib/src/components/Icons/LockRounded/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const LockRoundedIcon: React.FC = props => { + return +} diff --git a/icons/src/LogOut/content.json b/lib/src/components/Icons/LogOut/content.json similarity index 100% rename from icons/src/LogOut/content.json rename to lib/src/components/Icons/LogOut/content.json diff --git a/lib/src/components/Icons/LogOut/index.tsx b/lib/src/components/Icons/LogOut/index.tsx new file mode 100644 index 0000000000..f9aaa46a49 --- /dev/null +++ b/lib/src/components/Icons/LogOut/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const LogOutIcon: React.FC = props => { + return +} diff --git a/icons/src/Male/content.json b/lib/src/components/Icons/Male/content.json similarity index 100% rename from icons/src/Male/content.json rename to lib/src/components/Icons/Male/content.json diff --git a/lib/src/components/Icons/Male/index.tsx b/lib/src/components/Icons/Male/index.tsx new file mode 100644 index 0000000000..b23b5620ba --- /dev/null +++ b/lib/src/components/Icons/Male/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const MaleIcon: React.FC = props => { + return +} diff --git a/icons/src/Map/content.json b/lib/src/components/Icons/Map/content.json similarity index 100% rename from icons/src/Map/content.json rename to lib/src/components/Icons/Map/content.json diff --git a/lib/src/components/Icons/Map/index.tsx b/lib/src/components/Icons/Map/index.tsx new file mode 100644 index 0000000000..70b87b527a --- /dev/null +++ b/lib/src/components/Icons/Map/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const MapIcon: React.FC = props => { + return +} diff --git a/icons/src/Masonry/content.json b/lib/src/components/Icons/Masonry/content.json similarity index 100% rename from icons/src/Masonry/content.json rename to lib/src/components/Icons/Masonry/content.json diff --git a/lib/src/components/Icons/Masonry/index.tsx b/lib/src/components/Icons/Masonry/index.tsx new file mode 100644 index 0000000000..6203dd49ff --- /dev/null +++ b/lib/src/components/Icons/Masonry/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const MasonryIcon: React.FC = props => { + return +} diff --git a/icons/src/Masonry2/content.json b/lib/src/components/Icons/Masonry2/content.json similarity index 100% rename from icons/src/Masonry2/content.json rename to lib/src/components/Icons/Masonry2/content.json diff --git a/lib/src/components/Icons/Masonry2/index.tsx b/lib/src/components/Icons/Masonry2/index.tsx new file mode 100644 index 0000000000..22b934c555 --- /dev/null +++ b/lib/src/components/Icons/Masonry2/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const Masonry2Icon: React.FC = props => { + return +} diff --git a/icons/src/MeetingRoom/content.json b/lib/src/components/Icons/MeetingRoom/content.json similarity index 100% rename from icons/src/MeetingRoom/content.json rename to lib/src/components/Icons/MeetingRoom/content.json diff --git a/lib/src/components/Icons/MeetingRoom/index.tsx b/lib/src/components/Icons/MeetingRoom/index.tsx new file mode 100644 index 0000000000..f27f88769f --- /dev/null +++ b/lib/src/components/Icons/MeetingRoom/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const MeetingRoomIcon: React.FC = props => { + return +} diff --git a/icons/src/Megaphone/content.json b/lib/src/components/Icons/Megaphone/content.json similarity index 100% rename from icons/src/Megaphone/content.json rename to lib/src/components/Icons/Megaphone/content.json diff --git a/lib/src/components/Icons/Megaphone/index.tsx b/lib/src/components/Icons/Megaphone/index.tsx new file mode 100644 index 0000000000..1672d88687 --- /dev/null +++ b/lib/src/components/Icons/Megaphone/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const MegaphoneIcon: React.FC = props => { + return +} diff --git a/icons/src/Mention/content.json b/lib/src/components/Icons/Mention/content.json similarity index 100% rename from icons/src/Mention/content.json rename to lib/src/components/Icons/Mention/content.json diff --git a/lib/src/components/Icons/Mention/index.tsx b/lib/src/components/Icons/Mention/index.tsx new file mode 100644 index 0000000000..576360c04c --- /dev/null +++ b/lib/src/components/Icons/Mention/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const MentionIcon: React.FC = props => { + return +} diff --git a/icons/src/Menu/content.json b/lib/src/components/Icons/Menu/content.json similarity index 100% rename from icons/src/Menu/content.json rename to lib/src/components/Icons/Menu/content.json diff --git a/lib/src/components/Icons/Menu/index.tsx b/lib/src/components/Icons/Menu/index.tsx new file mode 100644 index 0000000000..cf45c1bb71 --- /dev/null +++ b/lib/src/components/Icons/Menu/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const MenuIcon: React.FC = props => { + return +} diff --git a/icons/src/Mic/content.json b/lib/src/components/Icons/Mic/content.json similarity index 100% rename from icons/src/Mic/content.json rename to lib/src/components/Icons/Mic/content.json diff --git a/lib/src/components/Icons/Mic/index.tsx b/lib/src/components/Icons/Mic/index.tsx new file mode 100644 index 0000000000..723b7aca15 --- /dev/null +++ b/lib/src/components/Icons/Mic/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const MicIcon: React.FC = props => { + return +} diff --git a/icons/src/MicrophoneOff/content.json b/lib/src/components/Icons/MicrophoneOff/content.json similarity index 100% rename from icons/src/MicrophoneOff/content.json rename to lib/src/components/Icons/MicrophoneOff/content.json diff --git a/lib/src/components/Icons/MicrophoneOff/index.tsx b/lib/src/components/Icons/MicrophoneOff/index.tsx new file mode 100644 index 0000000000..393a219049 --- /dev/null +++ b/lib/src/components/Icons/MicrophoneOff/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const MicrophoneOffIcon: React.FC = props => { + return +} diff --git a/icons/src/MicrophoneOn/content.json b/lib/src/components/Icons/MicrophoneOn/content.json similarity index 100% rename from icons/src/MicrophoneOn/content.json rename to lib/src/components/Icons/MicrophoneOn/content.json diff --git a/lib/src/components/Icons/MicrophoneOn/index.tsx b/lib/src/components/Icons/MicrophoneOn/index.tsx new file mode 100644 index 0000000000..10dbbaf54d --- /dev/null +++ b/lib/src/components/Icons/MicrophoneOn/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const MicrophoneOnIcon: React.FC = props => { + return +} diff --git a/icons/src/Microship/content.json b/lib/src/components/Icons/Microship/content.json similarity index 100% rename from icons/src/Microship/content.json rename to lib/src/components/Icons/Microship/content.json diff --git a/lib/src/components/Icons/Microship/index.tsx b/lib/src/components/Icons/Microship/index.tsx new file mode 100644 index 0000000000..95ad673165 --- /dev/null +++ b/lib/src/components/Icons/Microship/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const MicroshipIcon: React.FC = props => { + return +} diff --git a/icons/src/Mobile/content.json b/lib/src/components/Icons/Mobile/content.json similarity index 100% rename from icons/src/Mobile/content.json rename to lib/src/components/Icons/Mobile/content.json diff --git a/lib/src/components/Icons/Mobile/index.tsx b/lib/src/components/Icons/Mobile/index.tsx new file mode 100644 index 0000000000..6b67ef9ab0 --- /dev/null +++ b/lib/src/components/Icons/Mobile/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const MobileIcon: React.FC = props => { + return +} diff --git a/icons/src/Money/content.json b/lib/src/components/Icons/Money/content.json similarity index 100% rename from icons/src/Money/content.json rename to lib/src/components/Icons/Money/content.json diff --git a/lib/src/components/Icons/Money/index.tsx b/lib/src/components/Icons/Money/index.tsx new file mode 100644 index 0000000000..7149fce4c2 --- /dev/null +++ b/lib/src/components/Icons/Money/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const MoneyIcon: React.FC = props => { + return +} diff --git a/icons/src/More/content.json b/lib/src/components/Icons/More/content.json similarity index 100% rename from icons/src/More/content.json rename to lib/src/components/Icons/More/content.json diff --git a/lib/src/components/Icons/More/index.tsx b/lib/src/components/Icons/More/index.tsx new file mode 100644 index 0000000000..a41f2eac02 --- /dev/null +++ b/lib/src/components/Icons/More/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const MoreIcon: React.FC = props => { + return +} diff --git a/icons/src/MoreAndroid/content.json b/lib/src/components/Icons/MoreAndroid/content.json similarity index 100% rename from icons/src/MoreAndroid/content.json rename to lib/src/components/Icons/MoreAndroid/content.json diff --git a/lib/src/components/Icons/MoreAndroid/index.tsx b/lib/src/components/Icons/MoreAndroid/index.tsx new file mode 100644 index 0000000000..74ca25e6e2 --- /dev/null +++ b/lib/src/components/Icons/MoreAndroid/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const MoreAndroidIcon: React.FC = props => { + return +} diff --git a/icons/src/Mountain/content.json b/lib/src/components/Icons/Mountain/content.json similarity index 100% rename from icons/src/Mountain/content.json rename to lib/src/components/Icons/Mountain/content.json diff --git a/lib/src/components/Icons/Mountain/index.tsx b/lib/src/components/Icons/Mountain/index.tsx new file mode 100644 index 0000000000..b93df34228 --- /dev/null +++ b/lib/src/components/Icons/Mountain/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const MountainIcon: React.FC = props => { + return +} diff --git a/icons/src/Move/content.json b/lib/src/components/Icons/Move/content.json similarity index 100% rename from icons/src/Move/content.json rename to lib/src/components/Icons/Move/content.json diff --git a/lib/src/components/Icons/Move/index.tsx b/lib/src/components/Icons/Move/index.tsx new file mode 100644 index 0000000000..b2ec8d15cb --- /dev/null +++ b/lib/src/components/Icons/Move/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const MoveIcon: React.FC = props => { + return +} diff --git a/icons/src/Music/content.json b/lib/src/components/Icons/Music/content.json similarity index 100% rename from icons/src/Music/content.json rename to lib/src/components/Icons/Music/content.json diff --git a/lib/src/components/Icons/Music/index.tsx b/lib/src/components/Icons/Music/index.tsx new file mode 100644 index 0000000000..085eece1e5 --- /dev/null +++ b/lib/src/components/Icons/Music/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const MusicIcon: React.FC = props => { + return +} diff --git a/icons/src/Negative/content.json b/lib/src/components/Icons/Negative/content.json similarity index 100% rename from icons/src/Negative/content.json rename to lib/src/components/Icons/Negative/content.json diff --git a/lib/src/components/Icons/Negative/index.tsx b/lib/src/components/Icons/Negative/index.tsx new file mode 100644 index 0000000000..cbacfd7dfe --- /dev/null +++ b/lib/src/components/Icons/Negative/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const NegativeIcon: React.FC = props => { + return +} diff --git a/icons/src/NegativeOutline/content.json b/lib/src/components/Icons/NegativeOutline/content.json similarity index 100% rename from icons/src/NegativeOutline/content.json rename to lib/src/components/Icons/NegativeOutline/content.json diff --git a/lib/src/components/Icons/NegativeOutline/index.tsx b/lib/src/components/Icons/NegativeOutline/index.tsx new file mode 100644 index 0000000000..dedde509f9 --- /dev/null +++ b/lib/src/components/Icons/NegativeOutline/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const NegativeOutlineIcon: React.FC = props => { + return +} diff --git a/icons/src/NegativeStraight/content.json b/lib/src/components/Icons/NegativeStraight/content.json similarity index 100% rename from icons/src/NegativeStraight/content.json rename to lib/src/components/Icons/NegativeStraight/content.json diff --git a/lib/src/components/Icons/NegativeStraight/index.tsx b/lib/src/components/Icons/NegativeStraight/index.tsx new file mode 100644 index 0000000000..06c9b2f097 --- /dev/null +++ b/lib/src/components/Icons/NegativeStraight/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const NegativeStraightIcon: React.FC = props => { + return +} diff --git a/icons/src/NewCandidate/content.json b/lib/src/components/Icons/NewCandidate/content.json similarity index 100% rename from icons/src/NewCandidate/content.json rename to lib/src/components/Icons/NewCandidate/content.json diff --git a/lib/src/components/Icons/NewCandidate/index.tsx b/lib/src/components/Icons/NewCandidate/index.tsx new file mode 100644 index 0000000000..be0377343e --- /dev/null +++ b/lib/src/components/Icons/NewCandidate/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const NewCandidateIcon: React.FC = props => { + return +} diff --git a/icons/src/Notification/content.json b/lib/src/components/Icons/Notification/content.json similarity index 100% rename from icons/src/Notification/content.json rename to lib/src/components/Icons/Notification/content.json diff --git a/lib/src/components/Icons/Notification/index.tsx b/lib/src/components/Icons/Notification/index.tsx new file mode 100644 index 0000000000..248f05f4d8 --- /dev/null +++ b/lib/src/components/Icons/Notification/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const NotificationIcon: React.FC = props => { + return +} diff --git a/icons/src/Npm/content.json b/lib/src/components/Icons/Npm/content.json similarity index 100% rename from icons/src/Npm/content.json rename to lib/src/components/Icons/Npm/content.json diff --git a/lib/src/components/Icons/Npm/index.tsx b/lib/src/components/Icons/Npm/index.tsx new file mode 100644 index 0000000000..0d8de7d453 --- /dev/null +++ b/lib/src/components/Icons/Npm/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const NpmIcon: React.FC = props => { + return +} diff --git a/icons/src/OfferStatus/content.json b/lib/src/components/Icons/OfferStatus/content.json similarity index 100% rename from icons/src/OfferStatus/content.json rename to lib/src/components/Icons/OfferStatus/content.json diff --git a/lib/src/components/Icons/OfferStatus/index.tsx b/lib/src/components/Icons/OfferStatus/index.tsx new file mode 100644 index 0000000000..e3df0b5539 --- /dev/null +++ b/lib/src/components/Icons/OfferStatus/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const OfferStatusIcon: React.FC = props => { + return +} diff --git a/icons/src/Office/content.json b/lib/src/components/Icons/Office/content.json similarity index 100% rename from icons/src/Office/content.json rename to lib/src/components/Icons/Office/content.json diff --git a/lib/src/components/Icons/Office/index.tsx b/lib/src/components/Icons/Office/index.tsx new file mode 100644 index 0000000000..dda709664e --- /dev/null +++ b/lib/src/components/Icons/Office/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const OfficeIcon: React.FC = props => { + return +} diff --git a/icons/src/OrderedList/content.json b/lib/src/components/Icons/OrderedList/content.json similarity index 100% rename from icons/src/OrderedList/content.json rename to lib/src/components/Icons/OrderedList/content.json diff --git a/lib/src/components/Icons/OrderedList/index.tsx b/lib/src/components/Icons/OrderedList/index.tsx new file mode 100644 index 0000000000..56a0200e00 --- /dev/null +++ b/lib/src/components/Icons/OrderedList/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const OrderedListIcon: React.FC = props => { + return +} diff --git a/icons/src/Origine/content.json b/lib/src/components/Icons/Origine/content.json similarity index 100% rename from icons/src/Origine/content.json rename to lib/src/components/Icons/Origine/content.json diff --git a/lib/src/components/Icons/Origine/index.tsx b/lib/src/components/Icons/Origine/index.tsx new file mode 100644 index 0000000000..faf5176a13 --- /dev/null +++ b/lib/src/components/Icons/Origine/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const OrigineIcon: React.FC = props => { + return +} diff --git a/icons/src/Paperplane/content.json b/lib/src/components/Icons/Paperplane/content.json similarity index 100% rename from icons/src/Paperplane/content.json rename to lib/src/components/Icons/Paperplane/content.json diff --git a/lib/src/components/Icons/Paperplane/index.tsx b/lib/src/components/Icons/Paperplane/index.tsx new file mode 100644 index 0000000000..90cad75644 --- /dev/null +++ b/lib/src/components/Icons/Paperplane/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const PaperplaneIcon: React.FC = props => { + return +} diff --git a/icons/src/Pdf/content.json b/lib/src/components/Icons/Pdf/content.json similarity index 100% rename from icons/src/Pdf/content.json rename to lib/src/components/Icons/Pdf/content.json diff --git a/lib/src/components/Icons/Pdf/index.tsx b/lib/src/components/Icons/Pdf/index.tsx new file mode 100644 index 0000000000..22f7b4bf43 --- /dev/null +++ b/lib/src/components/Icons/Pdf/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const PdfIcon: React.FC = props => { + return +} diff --git a/icons/src/Pencil/content.json b/lib/src/components/Icons/Pencil/content.json similarity index 100% rename from icons/src/Pencil/content.json rename to lib/src/components/Icons/Pencil/content.json diff --git a/lib/src/components/Icons/Pencil/index.tsx b/lib/src/components/Icons/Pencil/index.tsx new file mode 100644 index 0000000000..7fe6fcbec1 --- /dev/null +++ b/lib/src/components/Icons/Pencil/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const PencilIcon: React.FC = props => { + return +} diff --git a/icons/src/Phone/content.json b/lib/src/components/Icons/Phone/content.json similarity index 100% rename from icons/src/Phone/content.json rename to lib/src/components/Icons/Phone/content.json diff --git a/lib/src/components/Icons/Phone/index.tsx b/lib/src/components/Icons/Phone/index.tsx new file mode 100644 index 0000000000..6054a5cd9a --- /dev/null +++ b/lib/src/components/Icons/Phone/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const PhoneIcon: React.FC = props => { + return +} diff --git a/icons/src/PhoneOutline/content.json b/lib/src/components/Icons/PhoneOutline/content.json similarity index 100% rename from icons/src/PhoneOutline/content.json rename to lib/src/components/Icons/PhoneOutline/content.json diff --git a/lib/src/components/Icons/PhoneOutline/index.tsx b/lib/src/components/Icons/PhoneOutline/index.tsx new file mode 100644 index 0000000000..2dc4231d47 --- /dev/null +++ b/lib/src/components/Icons/PhoneOutline/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const PhoneOutlineIcon: React.FC = props => { + return +} diff --git a/icons/src/Pictures/content.json b/lib/src/components/Icons/Pictures/content.json similarity index 100% rename from icons/src/Pictures/content.json rename to lib/src/components/Icons/Pictures/content.json diff --git a/lib/src/components/Icons/Pictures/index.tsx b/lib/src/components/Icons/Pictures/index.tsx new file mode 100644 index 0000000000..c2852d90ea --- /dev/null +++ b/lib/src/components/Icons/Pictures/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const PicturesIcon: React.FC = props => { + return +} diff --git a/icons/src/Piechart/content.json b/lib/src/components/Icons/Piechart/content.json similarity index 100% rename from icons/src/Piechart/content.json rename to lib/src/components/Icons/Piechart/content.json diff --git a/lib/src/components/Icons/Piechart/index.tsx b/lib/src/components/Icons/Piechart/index.tsx new file mode 100644 index 0000000000..97e89a3976 --- /dev/null +++ b/lib/src/components/Icons/Piechart/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const PiechartIcon: React.FC = props => { + return +} diff --git a/icons/src/Pin/content.json b/lib/src/components/Icons/Pin/content.json similarity index 100% rename from icons/src/Pin/content.json rename to lib/src/components/Icons/Pin/content.json diff --git a/lib/src/components/Icons/Pin/index.tsx b/lib/src/components/Icons/Pin/index.tsx new file mode 100644 index 0000000000..8212acacbc --- /dev/null +++ b/lib/src/components/Icons/Pin/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const PinIcon: React.FC = props => { + return +} diff --git a/icons/src/Pinterest/content.json b/lib/src/components/Icons/Pinterest/content.json similarity index 100% rename from icons/src/Pinterest/content.json rename to lib/src/components/Icons/Pinterest/content.json diff --git a/lib/src/components/Icons/Pinterest/index.tsx b/lib/src/components/Icons/Pinterest/index.tsx new file mode 100644 index 0000000000..5621be27ed --- /dev/null +++ b/lib/src/components/Icons/Pinterest/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const PinterestIcon: React.FC = props => { + return +} diff --git a/icons/src/Pizza/content.json b/lib/src/components/Icons/Pizza/content.json similarity index 100% rename from icons/src/Pizza/content.json rename to lib/src/components/Icons/Pizza/content.json diff --git a/lib/src/components/Icons/Pizza/index.tsx b/lib/src/components/Icons/Pizza/index.tsx new file mode 100644 index 0000000000..862974a06f --- /dev/null +++ b/lib/src/components/Icons/Pizza/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const PizzaIcon: React.FC = props => { + return +} diff --git a/icons/src/Play/content.json b/lib/src/components/Icons/Play/content.json similarity index 100% rename from icons/src/Play/content.json rename to lib/src/components/Icons/Play/content.json diff --git a/lib/src/components/Icons/Play/index.tsx b/lib/src/components/Icons/Play/index.tsx new file mode 100644 index 0000000000..474104fa5c --- /dev/null +++ b/lib/src/components/Icons/Play/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const PlayIcon: React.FC = props => { + return +} diff --git a/icons/src/PlayOutline/content.json b/lib/src/components/Icons/PlayOutline/content.json similarity index 100% rename from icons/src/PlayOutline/content.json rename to lib/src/components/Icons/PlayOutline/content.json diff --git a/lib/src/components/Icons/PlayOutline/index.tsx b/lib/src/components/Icons/PlayOutline/index.tsx new file mode 100644 index 0000000000..58507dbe40 --- /dev/null +++ b/lib/src/components/Icons/PlayOutline/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const PlayOutlineIcon: React.FC = props => { + return +} diff --git a/icons/src/Playlist/content.json b/lib/src/components/Icons/Playlist/content.json similarity index 100% rename from icons/src/Playlist/content.json rename to lib/src/components/Icons/Playlist/content.json diff --git a/lib/src/components/Icons/Playlist/index.tsx b/lib/src/components/Icons/Playlist/index.tsx new file mode 100644 index 0000000000..a4383ab664 --- /dev/null +++ b/lib/src/components/Icons/Playlist/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const PlaylistIcon: React.FC = props => { + return +} diff --git a/icons/src/Png/content.json b/lib/src/components/Icons/Png/content.json similarity index 100% rename from icons/src/Png/content.json rename to lib/src/components/Icons/Png/content.json diff --git a/lib/src/components/Icons/Png/index.tsx b/lib/src/components/Icons/Png/index.tsx new file mode 100644 index 0000000000..f191cd145e --- /dev/null +++ b/lib/src/components/Icons/Png/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const PngIcon: React.FC = props => { + return +} diff --git a/icons/src/Podcast/content.json b/lib/src/components/Icons/Podcast/content.json similarity index 100% rename from icons/src/Podcast/content.json rename to lib/src/components/Icons/Podcast/content.json diff --git a/lib/src/components/Icons/Podcast/index.tsx b/lib/src/components/Icons/Podcast/index.tsx new file mode 100644 index 0000000000..b0c0e36000 --- /dev/null +++ b/lib/src/components/Icons/Podcast/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const PodcastIcon: React.FC = props => { + return +} diff --git a/icons/src/Positive/content.json b/lib/src/components/Icons/Positive/content.json similarity index 100% rename from icons/src/Positive/content.json rename to lib/src/components/Icons/Positive/content.json diff --git a/lib/src/components/Icons/Positive/index.tsx b/lib/src/components/Icons/Positive/index.tsx new file mode 100644 index 0000000000..cfd147d311 --- /dev/null +++ b/lib/src/components/Icons/Positive/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const PositiveIcon: React.FC = props => { + return +} diff --git a/icons/src/PositiveOutline/content.json b/lib/src/components/Icons/PositiveOutline/content.json similarity index 100% rename from icons/src/PositiveOutline/content.json rename to lib/src/components/Icons/PositiveOutline/content.json diff --git a/lib/src/components/Icons/PositiveOutline/index.tsx b/lib/src/components/Icons/PositiveOutline/index.tsx new file mode 100644 index 0000000000..04bd800a8b --- /dev/null +++ b/lib/src/components/Icons/PositiveOutline/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const PositiveOutlineIcon: React.FC = props => { + return +} diff --git a/icons/src/PositiveStraight/content.json b/lib/src/components/Icons/PositiveStraight/content.json similarity index 100% rename from icons/src/PositiveStraight/content.json rename to lib/src/components/Icons/PositiveStraight/content.json diff --git a/lib/src/components/Icons/PositiveStraight/index.tsx b/lib/src/components/Icons/PositiveStraight/index.tsx new file mode 100644 index 0000000000..b913d0164f --- /dev/null +++ b/lib/src/components/Icons/PositiveStraight/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const PositiveStraightIcon: React.FC = props => { + return +} diff --git a/icons/src/Ppt/content.json b/lib/src/components/Icons/Ppt/content.json similarity index 100% rename from icons/src/Ppt/content.json rename to lib/src/components/Icons/Ppt/content.json diff --git a/lib/src/components/Icons/Ppt/index.tsx b/lib/src/components/Icons/Ppt/index.tsx new file mode 100644 index 0000000000..07534c3d50 --- /dev/null +++ b/lib/src/components/Icons/Ppt/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const PptIcon: React.FC = props => { + return +} diff --git a/icons/src/Print/content.json b/lib/src/components/Icons/Print/content.json similarity index 100% rename from icons/src/Print/content.json rename to lib/src/components/Icons/Print/content.json diff --git a/lib/src/components/Icons/Print/index.tsx b/lib/src/components/Icons/Print/index.tsx new file mode 100644 index 0000000000..b6668bbc82 --- /dev/null +++ b/lib/src/components/Icons/Print/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const PrintIcon: React.FC = props => { + return +} diff --git a/icons/src/Promote/content.json b/lib/src/components/Icons/Promote/content.json similarity index 100% rename from icons/src/Promote/content.json rename to lib/src/components/Icons/Promote/content.json diff --git a/lib/src/components/Icons/Promote/index.tsx b/lib/src/components/Icons/Promote/index.tsx new file mode 100644 index 0000000000..ecfad0bdf9 --- /dev/null +++ b/lib/src/components/Icons/Promote/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const PromoteIcon: React.FC = props => { + return +} diff --git a/icons/src/Puzzle/content.json b/lib/src/components/Icons/Puzzle/content.json similarity index 100% rename from icons/src/Puzzle/content.json rename to lib/src/components/Icons/Puzzle/content.json diff --git a/lib/src/components/Icons/Puzzle/index.tsx b/lib/src/components/Icons/Puzzle/index.tsx new file mode 100644 index 0000000000..b31b4c7ccc --- /dev/null +++ b/lib/src/components/Icons/Puzzle/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const PuzzleIcon: React.FC = props => { + return +} diff --git a/icons/src/PuzzleOutline/content.json b/lib/src/components/Icons/PuzzleOutline/content.json similarity index 100% rename from icons/src/PuzzleOutline/content.json rename to lib/src/components/Icons/PuzzleOutline/content.json diff --git a/lib/src/components/Icons/PuzzleOutline/index.tsx b/lib/src/components/Icons/PuzzleOutline/index.tsx new file mode 100644 index 0000000000..b4d43bee6f --- /dev/null +++ b/lib/src/components/Icons/PuzzleOutline/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const PuzzleOutlineIcon: React.FC = props => { + return +} diff --git a/icons/src/Question/content.json b/lib/src/components/Icons/Question/content.json similarity index 100% rename from icons/src/Question/content.json rename to lib/src/components/Icons/Question/content.json diff --git a/lib/src/components/Icons/Question/index.tsx b/lib/src/components/Icons/Question/index.tsx new file mode 100644 index 0000000000..1c8033ab4e --- /dev/null +++ b/lib/src/components/Icons/Question/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const QuestionIcon: React.FC = props => { + return +} diff --git a/icons/src/Questions/content.json b/lib/src/components/Icons/Questions/content.json similarity index 100% rename from icons/src/Questions/content.json rename to lib/src/components/Icons/Questions/content.json diff --git a/lib/src/components/Icons/Questions/index.tsx b/lib/src/components/Icons/Questions/index.tsx new file mode 100644 index 0000000000..aef0a88551 --- /dev/null +++ b/lib/src/components/Icons/Questions/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const QuestionsIcon: React.FC = props => { + return +} diff --git a/icons/src/Quote/content.json b/lib/src/components/Icons/Quote/content.json similarity index 100% rename from icons/src/Quote/content.json rename to lib/src/components/Icons/Quote/content.json diff --git a/lib/src/components/Icons/Quote/index.tsx b/lib/src/components/Icons/Quote/index.tsx new file mode 100644 index 0000000000..c729d93aed --- /dev/null +++ b/lib/src/components/Icons/Quote/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const QuoteIcon: React.FC = props => { + return +} diff --git a/icons/src/Refresh/content.json b/lib/src/components/Icons/Refresh/content.json similarity index 100% rename from icons/src/Refresh/content.json rename to lib/src/components/Icons/Refresh/content.json diff --git a/lib/src/components/Icons/Refresh/index.tsx b/lib/src/components/Icons/Refresh/index.tsx new file mode 100644 index 0000000000..1804f31682 --- /dev/null +++ b/lib/src/components/Icons/Refresh/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const RefreshIcon: React.FC = props => { + return +} diff --git a/icons/src/RefuseCandidate/content.json b/lib/src/components/Icons/RefuseCandidate/content.json similarity index 100% rename from icons/src/RefuseCandidate/content.json rename to lib/src/components/Icons/RefuseCandidate/content.json diff --git a/lib/src/components/Icons/RefuseCandidate/index.tsx b/lib/src/components/Icons/RefuseCandidate/index.tsx new file mode 100644 index 0000000000..5c0d37929c --- /dev/null +++ b/lib/src/components/Icons/RefuseCandidate/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const RefuseCandidateIcon: React.FC = props => { + return +} diff --git a/icons/src/Remote/content.json b/lib/src/components/Icons/Remote/content.json similarity index 100% rename from icons/src/Remote/content.json rename to lib/src/components/Icons/Remote/content.json diff --git a/lib/src/components/Icons/Remote/index.tsx b/lib/src/components/Icons/Remote/index.tsx new file mode 100644 index 0000000000..10c35a1079 --- /dev/null +++ b/lib/src/components/Icons/Remote/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const RemoteIcon: React.FC = props => { + return +} diff --git a/icons/src/Remove/content.json b/lib/src/components/Icons/Remove/content.json similarity index 100% rename from icons/src/Remove/content.json rename to lib/src/components/Icons/Remove/content.json diff --git a/lib/src/components/Icons/Remove/index.tsx b/lib/src/components/Icons/Remove/index.tsx new file mode 100644 index 0000000000..d4a215122e --- /dev/null +++ b/lib/src/components/Icons/Remove/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const RemoveIcon: React.FC = props => { + return +} diff --git a/icons/src/Reset/content.json b/lib/src/components/Icons/Reset/content.json similarity index 100% rename from icons/src/Reset/content.json rename to lib/src/components/Icons/Reset/content.json diff --git a/lib/src/components/Icons/Reset/index.tsx b/lib/src/components/Icons/Reset/index.tsx new file mode 100644 index 0000000000..b36d5a981a --- /dev/null +++ b/lib/src/components/Icons/Reset/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ResetIcon: React.FC = props => { + return +} diff --git a/icons/src/Resume/content.json b/lib/src/components/Icons/Resume/content.json similarity index 100% rename from icons/src/Resume/content.json rename to lib/src/components/Icons/Resume/content.json diff --git a/lib/src/components/Icons/Resume/index.tsx b/lib/src/components/Icons/Resume/index.tsx new file mode 100644 index 0000000000..b42fbd1435 --- /dev/null +++ b/lib/src/components/Icons/Resume/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ResumeIcon: React.FC = props => { + return +} diff --git a/icons/src/Review/content.json b/lib/src/components/Icons/Review/content.json similarity index 100% rename from icons/src/Review/content.json rename to lib/src/components/Icons/Review/content.json diff --git a/lib/src/components/Icons/Review/index.tsx b/lib/src/components/Icons/Review/index.tsx new file mode 100644 index 0000000000..b0e04da499 --- /dev/null +++ b/lib/src/components/Icons/Review/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ReviewIcon: React.FC = props => { + return +} diff --git a/icons/src/ReviewOutline/content.json b/lib/src/components/Icons/ReviewOutline/content.json similarity index 100% rename from icons/src/ReviewOutline/content.json rename to lib/src/components/Icons/ReviewOutline/content.json diff --git a/lib/src/components/Icons/ReviewOutline/index.tsx b/lib/src/components/Icons/ReviewOutline/index.tsx new file mode 100644 index 0000000000..2588cb1249 --- /dev/null +++ b/lib/src/components/Icons/ReviewOutline/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ReviewOutlineIcon: React.FC = props => { + return +} diff --git a/icons/src/Right/content.json b/lib/src/components/Icons/Right/content.json similarity index 100% rename from icons/src/Right/content.json rename to lib/src/components/Icons/Right/content.json diff --git a/lib/src/components/Icons/Right/index.tsx b/lib/src/components/Icons/Right/index.tsx new file mode 100644 index 0000000000..d2ad5bdaa2 --- /dev/null +++ b/lib/src/components/Icons/Right/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const RightIcon: React.FC = props => { + return +} diff --git a/icons/src/Salary/content.json b/lib/src/components/Icons/Salary/content.json similarity index 100% rename from icons/src/Salary/content.json rename to lib/src/components/Icons/Salary/content.json diff --git a/lib/src/components/Icons/Salary/index.tsx b/lib/src/components/Icons/Salary/index.tsx new file mode 100644 index 0000000000..49605aa39c --- /dev/null +++ b/lib/src/components/Icons/Salary/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const SalaryIcon: React.FC = props => { + return +} diff --git a/icons/src/Save/content.json b/lib/src/components/Icons/Save/content.json similarity index 100% rename from icons/src/Save/content.json rename to lib/src/components/Icons/Save/content.json diff --git a/lib/src/components/Icons/Save/index.tsx b/lib/src/components/Icons/Save/index.tsx new file mode 100644 index 0000000000..3dbeedb466 --- /dev/null +++ b/lib/src/components/Icons/Save/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const SaveIcon: React.FC = props => { + return +} diff --git a/icons/src/ScreenshareOff/content.json b/lib/src/components/Icons/ScreenshareOff/content.json similarity index 100% rename from icons/src/ScreenshareOff/content.json rename to lib/src/components/Icons/ScreenshareOff/content.json diff --git a/lib/src/components/Icons/ScreenshareOff/index.tsx b/lib/src/components/Icons/ScreenshareOff/index.tsx new file mode 100644 index 0000000000..1ab0784e0b --- /dev/null +++ b/lib/src/components/Icons/ScreenshareOff/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ScreenshareOffIcon: React.FC = props => { + return +} diff --git a/icons/src/ScreenshareOn/content.json b/lib/src/components/Icons/ScreenshareOn/content.json similarity index 100% rename from icons/src/ScreenshareOn/content.json rename to lib/src/components/Icons/ScreenshareOn/content.json diff --git a/lib/src/components/Icons/ScreenshareOn/index.tsx b/lib/src/components/Icons/ScreenshareOn/index.tsx new file mode 100644 index 0000000000..32da9eca69 --- /dev/null +++ b/lib/src/components/Icons/ScreenshareOn/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ScreenshareOnIcon: React.FC = props => { + return +} diff --git a/icons/src/Search/content.json b/lib/src/components/Icons/Search/content.json similarity index 100% rename from icons/src/Search/content.json rename to lib/src/components/Icons/Search/content.json diff --git a/lib/src/components/Icons/Search/index.tsx b/lib/src/components/Icons/Search/index.tsx new file mode 100644 index 0000000000..b506e02e2c --- /dev/null +++ b/lib/src/components/Icons/Search/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const SearchIcon: React.FC = props => { + return +} diff --git a/icons/src/SearchPeople/content.json b/lib/src/components/Icons/SearchPeople/content.json similarity index 100% rename from icons/src/SearchPeople/content.json rename to lib/src/components/Icons/SearchPeople/content.json diff --git a/lib/src/components/Icons/SearchPeople/index.tsx b/lib/src/components/Icons/SearchPeople/index.tsx new file mode 100644 index 0000000000..ffe2f4438d --- /dev/null +++ b/lib/src/components/Icons/SearchPeople/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const SearchPeopleIcon: React.FC = props => { + return +} diff --git a/icons/src/Settings/content.json b/lib/src/components/Icons/Settings/content.json similarity index 100% rename from icons/src/Settings/content.json rename to lib/src/components/Icons/Settings/content.json diff --git a/lib/src/components/Icons/Settings/index.tsx b/lib/src/components/Icons/Settings/index.tsx new file mode 100644 index 0000000000..f0e0d13a7d --- /dev/null +++ b/lib/src/components/Icons/Settings/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const SettingsIcon: React.FC = props => { + return +} diff --git a/icons/src/Share1/content.json b/lib/src/components/Icons/Share1/content.json similarity index 100% rename from icons/src/Share1/content.json rename to lib/src/components/Icons/Share1/content.json diff --git a/lib/src/components/Icons/Share1/index.tsx b/lib/src/components/Icons/Share1/index.tsx new file mode 100644 index 0000000000..544711e421 --- /dev/null +++ b/lib/src/components/Icons/Share1/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const Share1Icon: React.FC = props => { + return +} diff --git a/icons/src/Share2/content.json b/lib/src/components/Icons/Share2/content.json similarity index 100% rename from icons/src/Share2/content.json rename to lib/src/components/Icons/Share2/content.json diff --git a/lib/src/components/Icons/Share2/index.tsx b/lib/src/components/Icons/Share2/index.tsx new file mode 100644 index 0000000000..31e2b5945a --- /dev/null +++ b/lib/src/components/Icons/Share2/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const Share2Icon: React.FC = props => { + return +} diff --git a/icons/src/Shield/content.json b/lib/src/components/Icons/Shield/content.json similarity index 100% rename from icons/src/Shield/content.json rename to lib/src/components/Icons/Shield/content.json diff --git a/lib/src/components/Icons/Shield/index.tsx b/lib/src/components/Icons/Shield/index.tsx new file mode 100644 index 0000000000..0876ec2e9e --- /dev/null +++ b/lib/src/components/Icons/Shield/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ShieldIcon: React.FC = props => { + return +} diff --git a/icons/src/Show/content.json b/lib/src/components/Icons/Show/content.json similarity index 100% rename from icons/src/Show/content.json rename to lib/src/components/Icons/Show/content.json diff --git a/lib/src/components/Icons/Show/index.tsx b/lib/src/components/Icons/Show/index.tsx new file mode 100644 index 0000000000..3b34506db2 --- /dev/null +++ b/lib/src/components/Icons/Show/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ShowIcon: React.FC = props => { + return +} diff --git a/icons/src/Slack/content.json b/lib/src/components/Icons/Slack/content.json similarity index 100% rename from icons/src/Slack/content.json rename to lib/src/components/Icons/Slack/content.json diff --git a/lib/src/components/Icons/Slack/index.tsx b/lib/src/components/Icons/Slack/index.tsx new file mode 100644 index 0000000000..3f6ad56ccd --- /dev/null +++ b/lib/src/components/Icons/Slack/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const SlackIcon: React.FC = props => { + return +} diff --git a/icons/src/SoundOff/content.json b/lib/src/components/Icons/SoundOff/content.json similarity index 100% rename from icons/src/SoundOff/content.json rename to lib/src/components/Icons/SoundOff/content.json diff --git a/lib/src/components/Icons/SoundOff/index.tsx b/lib/src/components/Icons/SoundOff/index.tsx new file mode 100644 index 0000000000..06f21e9ea5 --- /dev/null +++ b/lib/src/components/Icons/SoundOff/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const SoundOffIcon: React.FC = props => { + return +} diff --git a/icons/src/SoundOn/content.json b/lib/src/components/Icons/SoundOn/content.json similarity index 100% rename from icons/src/SoundOn/content.json rename to lib/src/components/Icons/SoundOn/content.json diff --git a/lib/src/components/Icons/SoundOn/index.tsx b/lib/src/components/Icons/SoundOn/index.tsx new file mode 100644 index 0000000000..ef3ad1c61e --- /dev/null +++ b/lib/src/components/Icons/SoundOn/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const SoundOnIcon: React.FC = props => { + return +} diff --git a/icons/src/Source/content.json b/lib/src/components/Icons/Source/content.json similarity index 100% rename from icons/src/Source/content.json rename to lib/src/components/Icons/Source/content.json diff --git a/lib/src/components/Icons/Source/index.tsx b/lib/src/components/Icons/Source/index.tsx new file mode 100644 index 0000000000..b7c4588caa --- /dev/null +++ b/lib/src/components/Icons/Source/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const SourceIcon: React.FC = props => { + return +} diff --git a/icons/src/Spanner/content.json b/lib/src/components/Icons/Spanner/content.json similarity index 100% rename from icons/src/Spanner/content.json rename to lib/src/components/Icons/Spanner/content.json diff --git a/lib/src/components/Icons/Spanner/index.tsx b/lib/src/components/Icons/Spanner/index.tsx new file mode 100644 index 0000000000..acc739b74f --- /dev/null +++ b/lib/src/components/Icons/Spanner/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const SpannerIcon: React.FC = props => { + return +} diff --git a/icons/src/Sparkles/content.json b/lib/src/components/Icons/Sparkles/content.json similarity index 100% rename from icons/src/Sparkles/content.json rename to lib/src/components/Icons/Sparkles/content.json diff --git a/lib/src/components/Icons/Sparkles/index.tsx b/lib/src/components/Icons/Sparkles/index.tsx new file mode 100644 index 0000000000..232a2dbeac --- /dev/null +++ b/lib/src/components/Icons/Sparkles/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const SparklesIcon: React.FC = props => { + return +} diff --git a/icons/src/SquareAlert/content.json b/lib/src/components/Icons/SquareAlert/content.json similarity index 100% rename from icons/src/SquareAlert/content.json rename to lib/src/components/Icons/SquareAlert/content.json diff --git a/lib/src/components/Icons/SquareAlert/index.tsx b/lib/src/components/Icons/SquareAlert/index.tsx new file mode 100644 index 0000000000..4eef8a5593 --- /dev/null +++ b/lib/src/components/Icons/SquareAlert/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const SquareAlertIcon: React.FC = props => { + return +} diff --git a/icons/src/Stackoverflow/content.json b/lib/src/components/Icons/Stackoverflow/content.json similarity index 100% rename from icons/src/Stackoverflow/content.json rename to lib/src/components/Icons/Stackoverflow/content.json diff --git a/lib/src/components/Icons/Stackoverflow/index.tsx b/lib/src/components/Icons/Stackoverflow/index.tsx new file mode 100644 index 0000000000..fb700153ed --- /dev/null +++ b/lib/src/components/Icons/Stackoverflow/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const StackoverflowIcon: React.FC = props => { + return +} diff --git a/icons/src/Stackserver/content.json b/lib/src/components/Icons/Stackserver/content.json similarity index 100% rename from icons/src/Stackserver/content.json rename to lib/src/components/Icons/Stackserver/content.json diff --git a/lib/src/components/Icons/Stackserver/index.tsx b/lib/src/components/Icons/Stackserver/index.tsx new file mode 100644 index 0000000000..12fd2043d6 --- /dev/null +++ b/lib/src/components/Icons/Stackserver/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const StackserverIcon: React.FC = props => { + return +} diff --git a/icons/src/Star/content.json b/lib/src/components/Icons/Star/content.json similarity index 100% rename from icons/src/Star/content.json rename to lib/src/components/Icons/Star/content.json diff --git a/lib/src/components/Icons/Star/index.tsx b/lib/src/components/Icons/Star/index.tsx new file mode 100644 index 0000000000..5128b3cbf5 --- /dev/null +++ b/lib/src/components/Icons/Star/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const StarIcon: React.FC = props => { + return +} diff --git a/icons/src/StarOutline/content.json b/lib/src/components/Icons/StarOutline/content.json similarity index 100% rename from icons/src/StarOutline/content.json rename to lib/src/components/Icons/StarOutline/content.json diff --git a/lib/src/components/Icons/StarOutline/index.tsx b/lib/src/components/Icons/StarOutline/index.tsx new file mode 100644 index 0000000000..da9729345e --- /dev/null +++ b/lib/src/components/Icons/StarOutline/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const StarOutlineIcon: React.FC = props => { + return +} diff --git a/icons/src/Strikethrough/content.json b/lib/src/components/Icons/Strikethrough/content.json similarity index 100% rename from icons/src/Strikethrough/content.json rename to lib/src/components/Icons/Strikethrough/content.json diff --git a/lib/src/components/Icons/Strikethrough/index.tsx b/lib/src/components/Icons/Strikethrough/index.tsx new file mode 100644 index 0000000000..69c5f9169d --- /dev/null +++ b/lib/src/components/Icons/Strikethrough/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const StrikethroughIcon: React.FC = props => { + return +} diff --git a/icons/src/Subtitle/content.json b/lib/src/components/Icons/Subtitle/content.json similarity index 100% rename from icons/src/Subtitle/content.json rename to lib/src/components/Icons/Subtitle/content.json diff --git a/lib/src/components/Icons/Subtitle/index.tsx b/lib/src/components/Icons/Subtitle/index.tsx new file mode 100644 index 0000000000..4256889995 --- /dev/null +++ b/lib/src/components/Icons/Subtitle/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const SubtitleIcon: React.FC = props => { + return +} diff --git a/icons/src/Success/content.json b/lib/src/components/Icons/Success/content.json similarity index 100% rename from icons/src/Success/content.json rename to lib/src/components/Icons/Success/content.json diff --git a/lib/src/components/Icons/Success/index.tsx b/lib/src/components/Icons/Success/index.tsx new file mode 100644 index 0000000000..b137f1c54f --- /dev/null +++ b/lib/src/components/Icons/Success/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const SuccessIcon: React.FC = props => { + return +} diff --git a/icons/src/Suitcase/content.json b/lib/src/components/Icons/Suitcase/content.json similarity index 100% rename from icons/src/Suitcase/content.json rename to lib/src/components/Icons/Suitcase/content.json diff --git a/lib/src/components/Icons/Suitcase/index.tsx b/lib/src/components/Icons/Suitcase/index.tsx new file mode 100644 index 0000000000..047397696d --- /dev/null +++ b/lib/src/components/Icons/Suitcase/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const SuitcaseIcon: React.FC = props => { + return +} diff --git a/icons/src/Sun/content.json b/lib/src/components/Icons/Sun/content.json similarity index 100% rename from icons/src/Sun/content.json rename to lib/src/components/Icons/Sun/content.json diff --git a/lib/src/components/Icons/Sun/index.tsx b/lib/src/components/Icons/Sun/index.tsx new file mode 100644 index 0000000000..ab8ae5aa9e --- /dev/null +++ b/lib/src/components/Icons/Sun/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const SunIcon: React.FC = props => { + return +} diff --git a/icons/src/Svg/content.json b/lib/src/components/Icons/Svg/content.json similarity index 100% rename from icons/src/Svg/content.json rename to lib/src/components/Icons/Svg/content.json diff --git a/lib/src/components/Icons/Svg/index.tsx b/lib/src/components/Icons/Svg/index.tsx new file mode 100644 index 0000000000..a3a2b9ff77 --- /dev/null +++ b/lib/src/components/Icons/Svg/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const SvgIcon: React.FC = props => { + return +} diff --git a/icons/src/Symbol/content.json b/lib/src/components/Icons/Symbol/content.json similarity index 100% rename from icons/src/Symbol/content.json rename to lib/src/components/Icons/Symbol/content.json diff --git a/lib/src/components/Icons/Symbol/index.tsx b/lib/src/components/Icons/Symbol/index.tsx new file mode 100644 index 0000000000..9801ee4ef4 --- /dev/null +++ b/lib/src/components/Icons/Symbol/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const SymbolIcon: React.FC = props => { + return +} diff --git a/icons/src/Table/content.json b/lib/src/components/Icons/Table/content.json similarity index 100% rename from icons/src/Table/content.json rename to lib/src/components/Icons/Table/content.json diff --git a/lib/src/components/Icons/Table/index.tsx b/lib/src/components/Icons/Table/index.tsx new file mode 100644 index 0000000000..8b1e38df5b --- /dev/null +++ b/lib/src/components/Icons/Table/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const TableIcon: React.FC = props => { + return +} diff --git a/icons/src/TableColumnAddAfter/content.json b/lib/src/components/Icons/TableColumnAddAfter/content.json similarity index 100% rename from icons/src/TableColumnAddAfter/content.json rename to lib/src/components/Icons/TableColumnAddAfter/content.json diff --git a/lib/src/components/Icons/TableColumnAddAfter/index.tsx b/lib/src/components/Icons/TableColumnAddAfter/index.tsx new file mode 100644 index 0000000000..a7409b77b8 --- /dev/null +++ b/lib/src/components/Icons/TableColumnAddAfter/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const TableColumnAddAfterIcon: React.FC = props => { + return +} diff --git a/icons/src/TableColumnAddBefore/content.json b/lib/src/components/Icons/TableColumnAddBefore/content.json similarity index 100% rename from icons/src/TableColumnAddBefore/content.json rename to lib/src/components/Icons/TableColumnAddBefore/content.json diff --git a/lib/src/components/Icons/TableColumnAddBefore/index.tsx b/lib/src/components/Icons/TableColumnAddBefore/index.tsx new file mode 100644 index 0000000000..372bf506ca --- /dev/null +++ b/lib/src/components/Icons/TableColumnAddBefore/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const TableColumnAddBeforeIcon: React.FC = props => { + return +} diff --git a/icons/src/TableColumnRemove/content.json b/lib/src/components/Icons/TableColumnRemove/content.json similarity index 100% rename from icons/src/TableColumnRemove/content.json rename to lib/src/components/Icons/TableColumnRemove/content.json diff --git a/lib/src/components/Icons/TableColumnRemove/index.tsx b/lib/src/components/Icons/TableColumnRemove/index.tsx new file mode 100644 index 0000000000..fa7e881362 --- /dev/null +++ b/lib/src/components/Icons/TableColumnRemove/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const TableColumnRemoveIcon: React.FC = props => { + return +} diff --git a/icons/src/TableDelete/content.json b/lib/src/components/Icons/TableDelete/content.json similarity index 100% rename from icons/src/TableDelete/content.json rename to lib/src/components/Icons/TableDelete/content.json diff --git a/lib/src/components/Icons/TableDelete/index.tsx b/lib/src/components/Icons/TableDelete/index.tsx new file mode 100644 index 0000000000..7840f4abec --- /dev/null +++ b/lib/src/components/Icons/TableDelete/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const TableDeleteIcon: React.FC = props => { + return +} diff --git a/icons/src/TableDivide/content.json b/lib/src/components/Icons/TableDivide/content.json similarity index 100% rename from icons/src/TableDivide/content.json rename to lib/src/components/Icons/TableDivide/content.json diff --git a/lib/src/components/Icons/TableDivide/index.tsx b/lib/src/components/Icons/TableDivide/index.tsx new file mode 100644 index 0000000000..9db5359953 --- /dev/null +++ b/lib/src/components/Icons/TableDivide/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const TableDivideIcon: React.FC = props => { + return +} diff --git a/icons/src/TableMergeCells/content.json b/lib/src/components/Icons/TableMergeCells/content.json similarity index 100% rename from icons/src/TableMergeCells/content.json rename to lib/src/components/Icons/TableMergeCells/content.json diff --git a/lib/src/components/Icons/TableMergeCells/index.tsx b/lib/src/components/Icons/TableMergeCells/index.tsx new file mode 100644 index 0000000000..caf000c3dc --- /dev/null +++ b/lib/src/components/Icons/TableMergeCells/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const TableMergeCellsIcon: React.FC = props => { + return +} diff --git a/icons/src/TableRowAddAbove/content.json b/lib/src/components/Icons/TableRowAddAbove/content.json similarity index 100% rename from icons/src/TableRowAddAbove/content.json rename to lib/src/components/Icons/TableRowAddAbove/content.json diff --git a/lib/src/components/Icons/TableRowAddAbove/index.tsx b/lib/src/components/Icons/TableRowAddAbove/index.tsx new file mode 100644 index 0000000000..1b1a842974 --- /dev/null +++ b/lib/src/components/Icons/TableRowAddAbove/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const TableRowAddAboveIcon: React.FC = props => { + return +} diff --git a/icons/src/TableRowAddBelow/content.json b/lib/src/components/Icons/TableRowAddBelow/content.json similarity index 100% rename from icons/src/TableRowAddBelow/content.json rename to lib/src/components/Icons/TableRowAddBelow/content.json diff --git a/lib/src/components/Icons/TableRowAddBelow/index.tsx b/lib/src/components/Icons/TableRowAddBelow/index.tsx new file mode 100644 index 0000000000..53eb0923c8 --- /dev/null +++ b/lib/src/components/Icons/TableRowAddBelow/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const TableRowAddBelowIcon: React.FC = props => { + return +} diff --git a/icons/src/TableRowRemove/content.json b/lib/src/components/Icons/TableRowRemove/content.json similarity index 100% rename from icons/src/TableRowRemove/content.json rename to lib/src/components/Icons/TableRowRemove/content.json diff --git a/lib/src/components/Icons/TableRowRemove/index.tsx b/lib/src/components/Icons/TableRowRemove/index.tsx new file mode 100644 index 0000000000..7df28a510f --- /dev/null +++ b/lib/src/components/Icons/TableRowRemove/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const TableRowRemoveIcon: React.FC = props => { + return +} diff --git a/icons/src/Tablet/content.json b/lib/src/components/Icons/Tablet/content.json similarity index 100% rename from icons/src/Tablet/content.json rename to lib/src/components/Icons/Tablet/content.json diff --git a/lib/src/components/Icons/Tablet/index.tsx b/lib/src/components/Icons/Tablet/index.tsx new file mode 100644 index 0000000000..4b516a9c5a --- /dev/null +++ b/lib/src/components/Icons/Tablet/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const TabletIcon: React.FC = props => { + return +} diff --git a/icons/src/Tag/content.json b/lib/src/components/Icons/Tag/content.json similarity index 100% rename from icons/src/Tag/content.json rename to lib/src/components/Icons/Tag/content.json diff --git a/lib/src/components/Icons/Tag/index.tsx b/lib/src/components/Icons/Tag/index.tsx new file mode 100644 index 0000000000..98b2868edc --- /dev/null +++ b/lib/src/components/Icons/Tag/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const TagIcon: React.FC = props => { + return +} diff --git a/icons/src/Target/content.json b/lib/src/components/Icons/Target/content.json similarity index 100% rename from icons/src/Target/content.json rename to lib/src/components/Icons/Target/content.json diff --git a/lib/src/components/Icons/Target/index.tsx b/lib/src/components/Icons/Target/index.tsx new file mode 100644 index 0000000000..946847d7c0 --- /dev/null +++ b/lib/src/components/Icons/Target/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const TargetIcon: React.FC = props => { + return +} diff --git a/icons/src/Teepee/content.json b/lib/src/components/Icons/Teepee/content.json similarity index 100% rename from icons/src/Teepee/content.json rename to lib/src/components/Icons/Teepee/content.json diff --git a/lib/src/components/Icons/Teepee/index.tsx b/lib/src/components/Icons/Teepee/index.tsx new file mode 100644 index 0000000000..f67cfd223d --- /dev/null +++ b/lib/src/components/Icons/Teepee/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const TeepeeIcon: React.FC = props => { + return +} diff --git a/icons/src/ThumbDown/content.json b/lib/src/components/Icons/ThumbDown/content.json similarity index 100% rename from icons/src/ThumbDown/content.json rename to lib/src/components/Icons/ThumbDown/content.json diff --git a/lib/src/components/Icons/ThumbDown/index.tsx b/lib/src/components/Icons/ThumbDown/index.tsx new file mode 100644 index 0000000000..224c97aad6 --- /dev/null +++ b/lib/src/components/Icons/ThumbDown/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ThumbDownIcon: React.FC = props => { + return +} diff --git a/icons/src/ThumbUp/content.json b/lib/src/components/Icons/ThumbUp/content.json similarity index 100% rename from icons/src/ThumbUp/content.json rename to lib/src/components/Icons/ThumbUp/content.json diff --git a/lib/src/components/Icons/ThumbUp/index.tsx b/lib/src/components/Icons/ThumbUp/index.tsx new file mode 100644 index 0000000000..05eae50947 --- /dev/null +++ b/lib/src/components/Icons/ThumbUp/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ThumbUpIcon: React.FC = props => { + return +} diff --git a/icons/src/Thunderclock/content.json b/lib/src/components/Icons/Thunderclock/content.json similarity index 100% rename from icons/src/Thunderclock/content.json rename to lib/src/components/Icons/Thunderclock/content.json diff --git a/lib/src/components/Icons/Thunderclock/index.tsx b/lib/src/components/Icons/Thunderclock/index.tsx new file mode 100644 index 0000000000..643ed8163e --- /dev/null +++ b/lib/src/components/Icons/Thunderclock/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ThunderclockIcon: React.FC = props => { + return +} diff --git a/icons/src/Tiktok/content.json b/lib/src/components/Icons/Tiktok/content.json similarity index 100% rename from icons/src/Tiktok/content.json rename to lib/src/components/Icons/Tiktok/content.json diff --git a/lib/src/components/Icons/Tiktok/index.tsx b/lib/src/components/Icons/Tiktok/index.tsx new file mode 100644 index 0000000000..86efb65f0d --- /dev/null +++ b/lib/src/components/Icons/Tiktok/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const TiktokIcon: React.FC = props => { + return +} diff --git a/icons/src/Trash/content.json b/lib/src/components/Icons/Trash/content.json similarity index 100% rename from icons/src/Trash/content.json rename to lib/src/components/Icons/Trash/content.json diff --git a/lib/src/components/Icons/Trash/index.tsx b/lib/src/components/Icons/Trash/index.tsx new file mode 100644 index 0000000000..a38bdbab6f --- /dev/null +++ b/lib/src/components/Icons/Trash/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const TrashIcon: React.FC = props => { + return +} diff --git a/icons/src/Tree/content.json b/lib/src/components/Icons/Tree/content.json similarity index 100% rename from icons/src/Tree/content.json rename to lib/src/components/Icons/Tree/content.json diff --git a/lib/src/components/Icons/Tree/index.tsx b/lib/src/components/Icons/Tree/index.tsx new file mode 100644 index 0000000000..5327fd0cd2 --- /dev/null +++ b/lib/src/components/Icons/Tree/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const TreeIcon: React.FC = props => { + return +} diff --git a/icons/src/Trophy/content.json b/lib/src/components/Icons/Trophy/content.json similarity index 100% rename from icons/src/Trophy/content.json rename to lib/src/components/Icons/Trophy/content.json diff --git a/lib/src/components/Icons/Trophy/index.tsx b/lib/src/components/Icons/Trophy/index.tsx new file mode 100644 index 0000000000..512650ba7c --- /dev/null +++ b/lib/src/components/Icons/Trophy/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const TrophyIcon: React.FC = props => { + return +} diff --git a/icons/src/Ttf/content.json b/lib/src/components/Icons/Ttf/content.json similarity index 100% rename from icons/src/Ttf/content.json rename to lib/src/components/Icons/Ttf/content.json diff --git a/lib/src/components/Icons/Ttf/index.tsx b/lib/src/components/Icons/Ttf/index.tsx new file mode 100644 index 0000000000..6a2244ca61 --- /dev/null +++ b/lib/src/components/Icons/Ttf/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const TtfIcon: React.FC = props => { + return +} diff --git a/icons/src/Twitch/content.json b/lib/src/components/Icons/Twitch/content.json similarity index 100% rename from icons/src/Twitch/content.json rename to lib/src/components/Icons/Twitch/content.json diff --git a/lib/src/components/Icons/Twitch/index.tsx b/lib/src/components/Icons/Twitch/index.tsx new file mode 100644 index 0000000000..dc231446bf --- /dev/null +++ b/lib/src/components/Icons/Twitch/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const TwitchIcon: React.FC = props => { + return +} diff --git a/icons/src/Twitter/content.json b/lib/src/components/Icons/Twitter/content.json similarity index 100% rename from icons/src/Twitter/content.json rename to lib/src/components/Icons/Twitter/content.json diff --git a/lib/src/components/Icons/Twitter/index.tsx b/lib/src/components/Icons/Twitter/index.tsx new file mode 100644 index 0000000000..27b742aa50 --- /dev/null +++ b/lib/src/components/Icons/Twitter/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const TwitterIcon: React.FC = props => { + return +} diff --git a/icons/src/Txt/content.json b/lib/src/components/Icons/Txt/content.json similarity index 100% rename from icons/src/Txt/content.json rename to lib/src/components/Icons/Txt/content.json diff --git a/lib/src/components/Icons/Txt/index.tsx b/lib/src/components/Icons/Txt/index.tsx new file mode 100644 index 0000000000..c554fe44ba --- /dev/null +++ b/lib/src/components/Icons/Txt/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const TxtIcon: React.FC = props => { + return +} diff --git a/icons/src/Type/content.json b/lib/src/components/Icons/Type/content.json similarity index 100% rename from icons/src/Type/content.json rename to lib/src/components/Icons/Type/content.json diff --git a/lib/src/components/Icons/Type/index.tsx b/lib/src/components/Icons/Type/index.tsx new file mode 100644 index 0000000000..f5cf519d6a --- /dev/null +++ b/lib/src/components/Icons/Type/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const TypeIcon: React.FC = props => { + return +} diff --git a/icons/src/Unavailable/content.json b/lib/src/components/Icons/Unavailable/content.json similarity index 100% rename from icons/src/Unavailable/content.json rename to lib/src/components/Icons/Unavailable/content.json diff --git a/lib/src/components/Icons/Unavailable/index.tsx b/lib/src/components/Icons/Unavailable/index.tsx new file mode 100644 index 0000000000..9dc3253a9b --- /dev/null +++ b/lib/src/components/Icons/Unavailable/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const UnavailableIcon: React.FC = props => { + return +} diff --git a/icons/src/Underline/content.json b/lib/src/components/Icons/Underline/content.json similarity index 100% rename from icons/src/Underline/content.json rename to lib/src/components/Icons/Underline/content.json diff --git a/lib/src/components/Icons/Underline/index.tsx b/lib/src/components/Icons/Underline/index.tsx new file mode 100644 index 0000000000..aa38af90eb --- /dev/null +++ b/lib/src/components/Icons/Underline/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const UnderlineIcon: React.FC = props => { + return +} diff --git a/icons/src/UnorderedList/content.json b/lib/src/components/Icons/UnorderedList/content.json similarity index 100% rename from icons/src/UnorderedList/content.json rename to lib/src/components/Icons/UnorderedList/content.json diff --git a/lib/src/components/Icons/UnorderedList/index.tsx b/lib/src/components/Icons/UnorderedList/index.tsx new file mode 100644 index 0000000000..d59d5c0fa9 --- /dev/null +++ b/lib/src/components/Icons/UnorderedList/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const UnorderedListIcon: React.FC = props => { + return +} diff --git a/icons/src/Up/content.json b/lib/src/components/Icons/Up/content.json similarity index 100% rename from icons/src/Up/content.json rename to lib/src/components/Icons/Up/content.json diff --git a/lib/src/components/Icons/Up/index.tsx b/lib/src/components/Icons/Up/index.tsx new file mode 100644 index 0000000000..3d478d33a7 --- /dev/null +++ b/lib/src/components/Icons/Up/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const UpIcon: React.FC = props => { + return +} diff --git a/icons/src/Update/content.json b/lib/src/components/Icons/Update/content.json similarity index 100% rename from icons/src/Update/content.json rename to lib/src/components/Icons/Update/content.json diff --git a/lib/src/components/Icons/Update/index.tsx b/lib/src/components/Icons/Update/index.tsx new file mode 100644 index 0000000000..ad2e5a9f6a --- /dev/null +++ b/lib/src/components/Icons/Update/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const UpdateIcon: React.FC = props => { + return +} diff --git a/icons/src/Upload/content.json b/lib/src/components/Icons/Upload/content.json similarity index 100% rename from icons/src/Upload/content.json rename to lib/src/components/Icons/Upload/content.json diff --git a/lib/src/components/Icons/Upload/index.tsx b/lib/src/components/Icons/Upload/index.tsx new file mode 100644 index 0000000000..26d1d46496 --- /dev/null +++ b/lib/src/components/Icons/Upload/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const UploadIcon: React.FC = props => { + return +} diff --git a/icons/src/User/content.json b/lib/src/components/Icons/User/content.json similarity index 100% rename from icons/src/User/content.json rename to lib/src/components/Icons/User/content.json diff --git a/lib/src/components/Icons/User/index.tsx b/lib/src/components/Icons/User/index.tsx new file mode 100644 index 0000000000..3cd479af3a --- /dev/null +++ b/lib/src/components/Icons/User/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const UserIcon: React.FC = props => { + return +} diff --git a/icons/src/UserOutline/content.json b/lib/src/components/Icons/UserOutline/content.json similarity index 100% rename from icons/src/UserOutline/content.json rename to lib/src/components/Icons/UserOutline/content.json diff --git a/lib/src/components/Icons/UserOutline/index.tsx b/lib/src/components/Icons/UserOutline/index.tsx new file mode 100644 index 0000000000..823a0b2868 --- /dev/null +++ b/lib/src/components/Icons/UserOutline/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const UserOutlineIcon: React.FC = props => { + return +} diff --git a/icons/src/Video/content.json b/lib/src/components/Icons/Video/content.json similarity index 100% rename from icons/src/Video/content.json rename to lib/src/components/Icons/Video/content.json diff --git a/lib/src/components/Icons/Video/index.tsx b/lib/src/components/Icons/Video/index.tsx new file mode 100644 index 0000000000..e8999fd5cd --- /dev/null +++ b/lib/src/components/Icons/Video/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const VideoIcon: React.FC = props => { + return +} diff --git a/icons/src/VideoCamera/content.json b/lib/src/components/Icons/VideoCamera/content.json similarity index 100% rename from icons/src/VideoCamera/content.json rename to lib/src/components/Icons/VideoCamera/content.json diff --git a/lib/src/components/Icons/VideoCamera/index.tsx b/lib/src/components/Icons/VideoCamera/index.tsx new file mode 100644 index 0000000000..1564fcb337 --- /dev/null +++ b/lib/src/components/Icons/VideoCamera/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const VideoCameraIcon: React.FC = props => { + return +} diff --git a/icons/src/VideoCamera2/content.json b/lib/src/components/Icons/VideoCamera2/content.json similarity index 100% rename from icons/src/VideoCamera2/content.json rename to lib/src/components/Icons/VideoCamera2/content.json diff --git a/lib/src/components/Icons/VideoCamera2/index.tsx b/lib/src/components/Icons/VideoCamera2/index.tsx new file mode 100644 index 0000000000..2314cc3714 --- /dev/null +++ b/lib/src/components/Icons/VideoCamera2/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const VideoCamera2Icon: React.FC = props => { + return +} diff --git a/icons/src/WatchLater/content.json b/lib/src/components/Icons/WatchLater/content.json similarity index 100% rename from icons/src/WatchLater/content.json rename to lib/src/components/Icons/WatchLater/content.json diff --git a/lib/src/components/Icons/WatchLater/index.tsx b/lib/src/components/Icons/WatchLater/index.tsx new file mode 100644 index 0000000000..96d52621e3 --- /dev/null +++ b/lib/src/components/Icons/WatchLater/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const WatchLaterIcon: React.FC = props => { + return +} diff --git a/icons/src/Woff/content.json b/lib/src/components/Icons/Woff/content.json similarity index 100% rename from icons/src/Woff/content.json rename to lib/src/components/Icons/Woff/content.json diff --git a/lib/src/components/Icons/Woff/index.tsx b/lib/src/components/Icons/Woff/index.tsx new file mode 100644 index 0000000000..f69099ed5e --- /dev/null +++ b/lib/src/components/Icons/Woff/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const WoffIcon: React.FC = props => { + return +} diff --git a/icons/src/Woff2/content.json b/lib/src/components/Icons/Woff2/content.json similarity index 100% rename from icons/src/Woff2/content.json rename to lib/src/components/Icons/Woff2/content.json diff --git a/lib/src/components/Icons/Woff2/index.tsx b/lib/src/components/Icons/Woff2/index.tsx new file mode 100644 index 0000000000..b9cd99c176 --- /dev/null +++ b/lib/src/components/Icons/Woff2/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const Woff2Icon: React.FC = props => { + return +} diff --git a/icons/src/Write/content.json b/lib/src/components/Icons/Write/content.json similarity index 100% rename from icons/src/Write/content.json rename to lib/src/components/Icons/Write/content.json diff --git a/lib/src/components/Icons/Write/index.tsx b/lib/src/components/Icons/Write/index.tsx new file mode 100644 index 0000000000..67c9e21cdc --- /dev/null +++ b/lib/src/components/Icons/Write/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const WriteIcon: React.FC = props => { + return +} diff --git a/icons/src/Wttj/content.json b/lib/src/components/Icons/Wttj/content.json similarity index 100% rename from icons/src/Wttj/content.json rename to lib/src/components/Icons/Wttj/content.json diff --git a/lib/src/components/Icons/Wttj/index.tsx b/lib/src/components/Icons/Wttj/index.tsx new file mode 100644 index 0000000000..b294a2983b --- /dev/null +++ b/lib/src/components/Icons/Wttj/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const WttjIcon: React.FC = props => { + return +} diff --git a/icons/src/X/content.json b/lib/src/components/Icons/X/content.json similarity index 100% rename from icons/src/X/content.json rename to lib/src/components/Icons/X/content.json diff --git a/lib/src/components/Icons/X/index.tsx b/lib/src/components/Icons/X/index.tsx new file mode 100644 index 0000000000..c738e8eb13 --- /dev/null +++ b/lib/src/components/Icons/X/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const XIcon: React.FC = props => { + return +} diff --git a/icons/src/Xing/content.json b/lib/src/components/Icons/Xing/content.json similarity index 100% rename from icons/src/Xing/content.json rename to lib/src/components/Icons/Xing/content.json diff --git a/lib/src/components/Icons/Xing/index.tsx b/lib/src/components/Icons/Xing/index.tsx new file mode 100644 index 0000000000..7005fb2d0f --- /dev/null +++ b/lib/src/components/Icons/Xing/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const XingIcon: React.FC = props => { + return +} diff --git a/icons/src/Xls/content.json b/lib/src/components/Icons/Xls/content.json similarity index 100% rename from icons/src/Xls/content.json rename to lib/src/components/Icons/Xls/content.json diff --git a/lib/src/components/Icons/Xls/index.tsx b/lib/src/components/Icons/Xls/index.tsx new file mode 100644 index 0000000000..42c0079d89 --- /dev/null +++ b/lib/src/components/Icons/Xls/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const XlsIcon: React.FC = props => { + return +} diff --git a/icons/src/Xlsx/content.json b/lib/src/components/Icons/Xlsx/content.json similarity index 100% rename from icons/src/Xlsx/content.json rename to lib/src/components/Icons/Xlsx/content.json diff --git a/lib/src/components/Icons/Xlsx/index.tsx b/lib/src/components/Icons/Xlsx/index.tsx new file mode 100644 index 0000000000..f89d0adde9 --- /dev/null +++ b/lib/src/components/Icons/Xlsx/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const XlsxIcon: React.FC = props => { + return +} diff --git a/icons/src/Youtube/content.json b/lib/src/components/Icons/Youtube/content.json similarity index 100% rename from icons/src/Youtube/content.json rename to lib/src/components/Icons/Youtube/content.json diff --git a/lib/src/components/Icons/Youtube/index.tsx b/lib/src/components/Icons/Youtube/index.tsx new file mode 100644 index 0000000000..2eeff7bf26 --- /dev/null +++ b/lib/src/components/Icons/Youtube/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const YoutubeIcon: React.FC = props => { + return +} diff --git a/icons/src/Zapier/content.json b/lib/src/components/Icons/Zapier/content.json similarity index 100% rename from icons/src/Zapier/content.json rename to lib/src/components/Icons/Zapier/content.json diff --git a/lib/src/components/Icons/Zapier/index.tsx b/lib/src/components/Icons/Zapier/index.tsx new file mode 100644 index 0000000000..20fb7b2cce --- /dev/null +++ b/lib/src/components/Icons/Zapier/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ZapierIcon: React.FC = props => { + return +} diff --git a/icons/src/Zip/content.json b/lib/src/components/Icons/Zip/content.json similarity index 100% rename from icons/src/Zip/content.json rename to lib/src/components/Icons/Zip/content.json diff --git a/lib/src/components/Icons/Zip/index.tsx b/lib/src/components/Icons/Zip/index.tsx new file mode 100644 index 0000000000..fb854eecf2 --- /dev/null +++ b/lib/src/components/Icons/Zip/index.tsx @@ -0,0 +1,9 @@ +import React from 'react' + +import content from './content.json' + +import { Icon, IconProps } from '@/Icon' + +export const ZipIcon: React.FC = props => { + return +} diff --git a/icons/_assets/actions.svg b/lib/src/components/Icons/_assets/actions.svg similarity index 100% rename from icons/_assets/actions.svg rename to lib/src/components/Icons/_assets/actions.svg diff --git a/icons/_assets/activity.svg b/lib/src/components/Icons/_assets/activity.svg similarity index 100% rename from icons/_assets/activity.svg rename to lib/src/components/Icons/_assets/activity.svg diff --git a/icons/_assets/add.svg b/lib/src/components/Icons/_assets/add.svg similarity index 100% rename from icons/_assets/add.svg rename to lib/src/components/Icons/_assets/add.svg diff --git a/icons/_assets/address.svg b/lib/src/components/Icons/_assets/address.svg similarity index 100% rename from icons/_assets/address.svg rename to lib/src/components/Icons/_assets/address.svg diff --git a/icons/_assets/airplay.svg b/lib/src/components/Icons/_assets/airplay.svg similarity index 100% rename from icons/_assets/airplay.svg rename to lib/src/components/Icons/_assets/airplay.svg diff --git a/icons/_assets/alert.svg b/lib/src/components/Icons/_assets/alert.svg similarity index 100% rename from icons/_assets/alert.svg rename to lib/src/components/Icons/_assets/alert.svg diff --git a/icons/_assets/alert_outline.svg b/lib/src/components/Icons/_assets/alert_outline.svg similarity index 100% rename from icons/_assets/alert_outline.svg rename to lib/src/components/Icons/_assets/alert_outline.svg diff --git a/icons/_assets/analytics.svg b/lib/src/components/Icons/_assets/analytics.svg similarity index 100% rename from icons/_assets/analytics.svg rename to lib/src/components/Icons/_assets/analytics.svg diff --git a/icons/_assets/anniversary.svg b/lib/src/components/Icons/_assets/anniversary.svg similarity index 100% rename from icons/_assets/anniversary.svg rename to lib/src/components/Icons/_assets/anniversary.svg diff --git a/icons/_assets/archive.svg b/lib/src/components/Icons/_assets/archive.svg similarity index 100% rename from icons/_assets/archive.svg rename to lib/src/components/Icons/_assets/archive.svg diff --git a/icons/_assets/arrow_down.svg b/lib/src/components/Icons/_assets/arrow_down.svg similarity index 100% rename from icons/_assets/arrow_down.svg rename to lib/src/components/Icons/_assets/arrow_down.svg diff --git a/icons/_assets/arrow_left.svg b/lib/src/components/Icons/_assets/arrow_left.svg similarity index 100% rename from icons/_assets/arrow_left.svg rename to lib/src/components/Icons/_assets/arrow_left.svg diff --git a/icons/_assets/arrow_line_down.svg b/lib/src/components/Icons/_assets/arrow_line_down.svg similarity index 100% rename from icons/_assets/arrow_line_down.svg rename to lib/src/components/Icons/_assets/arrow_line_down.svg diff --git a/icons/_assets/arrow_line_left.svg b/lib/src/components/Icons/_assets/arrow_line_left.svg similarity index 100% rename from icons/_assets/arrow_line_left.svg rename to lib/src/components/Icons/_assets/arrow_line_left.svg diff --git a/icons/_assets/arrow_line_right.svg b/lib/src/components/Icons/_assets/arrow_line_right.svg similarity index 100% rename from icons/_assets/arrow_line_right.svg rename to lib/src/components/Icons/_assets/arrow_line_right.svg diff --git a/icons/_assets/arrow_line_up.svg b/lib/src/components/Icons/_assets/arrow_line_up.svg similarity index 100% rename from icons/_assets/arrow_line_up.svg rename to lib/src/components/Icons/_assets/arrow_line_up.svg diff --git a/icons/_assets/arrow_right.svg b/lib/src/components/Icons/_assets/arrow_right.svg similarity index 100% rename from icons/_assets/arrow_right.svg rename to lib/src/components/Icons/_assets/arrow_right.svg diff --git a/icons/_assets/arrow_up.svg b/lib/src/components/Icons/_assets/arrow_up.svg similarity index 100% rename from icons/_assets/arrow_up.svg rename to lib/src/components/Icons/_assets/arrow_up.svg diff --git a/icons/_assets/aspect_ratio_fill.svg b/lib/src/components/Icons/_assets/aspect_ratio_fill.svg similarity index 100% rename from icons/_assets/aspect_ratio_fill.svg rename to lib/src/components/Icons/_assets/aspect_ratio_fill.svg diff --git a/icons/_assets/aspect_ratio_fit.svg b/lib/src/components/Icons/_assets/aspect_ratio_fit.svg similarity index 100% rename from icons/_assets/aspect_ratio_fit.svg rename to lib/src/components/Icons/_assets/aspect_ratio_fit.svg diff --git a/icons/_assets/attachment.svg b/lib/src/components/Icons/_assets/attachment.svg similarity index 100% rename from icons/_assets/attachment.svg rename to lib/src/components/Icons/_assets/attachment.svg diff --git a/icons/_assets/avatar.svg b/lib/src/components/Icons/_assets/avatar.svg similarity index 100% rename from icons/_assets/avatar.svg rename to lib/src/components/Icons/_assets/avatar.svg diff --git a/icons/_assets/avatar_accessory.svg b/lib/src/components/Icons/_assets/avatar_accessory.svg similarity index 100% rename from icons/_assets/avatar_accessory.svg rename to lib/src/components/Icons/_assets/avatar_accessory.svg diff --git a/icons/_assets/avatar_body.svg b/lib/src/components/Icons/_assets/avatar_body.svg similarity index 100% rename from icons/_assets/avatar_body.svg rename to lib/src/components/Icons/_assets/avatar_body.svg diff --git a/icons/_assets/avatar_bottom.svg b/lib/src/components/Icons/_assets/avatar_bottom.svg similarity index 100% rename from icons/_assets/avatar_bottom.svg rename to lib/src/components/Icons/_assets/avatar_bottom.svg diff --git a/icons/_assets/avatar_costume.svg b/lib/src/components/Icons/_assets/avatar_costume.svg similarity index 100% rename from icons/_assets/avatar_costume.svg rename to lib/src/components/Icons/_assets/avatar_costume.svg diff --git a/icons/_assets/avatar_head.svg b/lib/src/components/Icons/_assets/avatar_head.svg similarity index 100% rename from icons/_assets/avatar_head.svg rename to lib/src/components/Icons/_assets/avatar_head.svg diff --git a/icons/_assets/avatar_top.svg b/lib/src/components/Icons/_assets/avatar_top.svg similarity index 100% rename from icons/_assets/avatar_top.svg rename to lib/src/components/Icons/_assets/avatar_top.svg diff --git a/icons/_assets/bar_chart.svg b/lib/src/components/Icons/_assets/bar_chart.svg similarity index 100% rename from icons/_assets/bar_chart.svg rename to lib/src/components/Icons/_assets/bar_chart.svg diff --git a/icons/_assets/basketball.svg b/lib/src/components/Icons/_assets/basketball.svg similarity index 100% rename from icons/_assets/basketball.svg rename to lib/src/components/Icons/_assets/basketball.svg diff --git a/icons/_assets/behance.svg b/lib/src/components/Icons/_assets/behance.svg similarity index 100% rename from icons/_assets/behance.svg rename to lib/src/components/Icons/_assets/behance.svg diff --git a/icons/_assets/birthday.svg b/lib/src/components/Icons/_assets/birthday.svg similarity index 100% rename from icons/_assets/birthday.svg rename to lib/src/components/Icons/_assets/birthday.svg diff --git a/icons/_assets/bold.svg b/lib/src/components/Icons/_assets/bold.svg similarity index 100% rename from icons/_assets/bold.svg rename to lib/src/components/Icons/_assets/bold.svg diff --git a/icons/_assets/book.svg b/lib/src/components/Icons/_assets/book.svg similarity index 100% rename from icons/_assets/book.svg rename to lib/src/components/Icons/_assets/book.svg diff --git a/icons/_assets/book_2.svg b/lib/src/components/Icons/_assets/book_2.svg similarity index 100% rename from icons/_assets/book_2.svg rename to lib/src/components/Icons/_assets/book_2.svg diff --git a/icons/_assets/bookmark.svg b/lib/src/components/Icons/_assets/bookmark.svg similarity index 100% rename from icons/_assets/bookmark.svg rename to lib/src/components/Icons/_assets/bookmark.svg diff --git a/icons/_assets/bookmark_outline.svg b/lib/src/components/Icons/_assets/bookmark_outline.svg similarity index 100% rename from icons/_assets/bookmark_outline.svg rename to lib/src/components/Icons/_assets/bookmark_outline.svg diff --git a/icons/_assets/bulb.svg b/lib/src/components/Icons/_assets/bulb.svg similarity index 100% rename from icons/_assets/bulb.svg rename to lib/src/components/Icons/_assets/bulb.svg diff --git a/icons/_assets/bulk.svg b/lib/src/components/Icons/_assets/bulk.svg similarity index 100% rename from icons/_assets/bulk.svg rename to lib/src/components/Icons/_assets/bulk.svg diff --git a/icons/_assets/buoy.svg b/lib/src/components/Icons/_assets/buoy.svg similarity index 100% rename from icons/_assets/buoy.svg rename to lib/src/components/Icons/_assets/buoy.svg diff --git a/icons/_assets/burn.svg b/lib/src/components/Icons/_assets/burn.svg similarity index 100% rename from icons/_assets/burn.svg rename to lib/src/components/Icons/_assets/burn.svg diff --git a/icons/_assets/caddy.svg b/lib/src/components/Icons/_assets/caddy.svg similarity index 100% rename from icons/_assets/caddy.svg rename to lib/src/components/Icons/_assets/caddy.svg diff --git a/icons/_assets/calcul.svg b/lib/src/components/Icons/_assets/calcul.svg similarity index 100% rename from icons/_assets/calcul.svg rename to lib/src/components/Icons/_assets/calcul.svg diff --git a/icons/_assets/camera.svg b/lib/src/components/Icons/_assets/camera.svg similarity index 100% rename from icons/_assets/camera.svg rename to lib/src/components/Icons/_assets/camera.svg diff --git a/icons/_assets/camera_off.svg b/lib/src/components/Icons/_assets/camera_off.svg similarity index 100% rename from icons/_assets/camera_off.svg rename to lib/src/components/Icons/_assets/camera_off.svg diff --git a/icons/_assets/camera_on.svg b/lib/src/components/Icons/_assets/camera_on.svg similarity index 100% rename from icons/_assets/camera_on.svg rename to lib/src/components/Icons/_assets/camera_on.svg diff --git a/icons/_assets/candidate_status.svg b/lib/src/components/Icons/_assets/candidate_status.svg similarity index 100% rename from icons/_assets/candidate_status.svg rename to lib/src/components/Icons/_assets/candidate_status.svg diff --git a/icons/_assets/card_view.svg b/lib/src/components/Icons/_assets/card_view.svg similarity index 100% rename from icons/_assets/card_view.svg rename to lib/src/components/Icons/_assets/card_view.svg diff --git a/icons/_assets/cast.svg b/lib/src/components/Icons/_assets/cast.svg similarity index 100% rename from icons/_assets/cast.svg rename to lib/src/components/Icons/_assets/cast.svg diff --git a/icons/_assets/cast_connected.svg b/lib/src/components/Icons/_assets/cast_connected.svg similarity index 100% rename from icons/_assets/cast_connected.svg rename to lib/src/components/Icons/_assets/cast_connected.svg diff --git a/icons/_assets/cast_unavailable.svg b/lib/src/components/Icons/_assets/cast_unavailable.svg similarity index 100% rename from icons/_assets/cast_unavailable.svg rename to lib/src/components/Icons/_assets/cast_unavailable.svg diff --git a/icons/_assets/celebrate.svg b/lib/src/components/Icons/_assets/celebrate.svg similarity index 100% rename from icons/_assets/celebrate.svg rename to lib/src/components/Icons/_assets/celebrate.svg diff --git a/icons/_assets/certified.svg b/lib/src/components/Icons/_assets/certified.svg similarity index 100% rename from icons/_assets/certified.svg rename to lib/src/components/Icons/_assets/certified.svg diff --git a/icons/_assets/check.svg b/lib/src/components/Icons/_assets/check.svg similarity index 100% rename from icons/_assets/check.svg rename to lib/src/components/Icons/_assets/check.svg diff --git a/icons/_assets/clipboard.svg b/lib/src/components/Icons/_assets/clipboard.svg similarity index 100% rename from icons/_assets/clipboard.svg rename to lib/src/components/Icons/_assets/clipboard.svg diff --git a/icons/_assets/clock.svg b/lib/src/components/Icons/_assets/clock.svg similarity index 100% rename from icons/_assets/clock.svg rename to lib/src/components/Icons/_assets/clock.svg diff --git a/icons/_assets/code.svg b/lib/src/components/Icons/_assets/code.svg similarity index 100% rename from icons/_assets/code.svg rename to lib/src/components/Icons/_assets/code.svg diff --git a/icons/_assets/code_block.svg b/lib/src/components/Icons/_assets/code_block.svg similarity index 100% rename from icons/_assets/code_block.svg rename to lib/src/components/Icons/_assets/code_block.svg diff --git a/icons/_assets/coffee.svg b/lib/src/components/Icons/_assets/coffee.svg similarity index 100% rename from icons/_assets/coffee.svg rename to lib/src/components/Icons/_assets/coffee.svg diff --git a/icons/_assets/collapse.svg b/lib/src/components/Icons/_assets/collapse.svg similarity index 100% rename from icons/_assets/collapse.svg rename to lib/src/components/Icons/_assets/collapse.svg diff --git a/icons/_assets/comment.svg b/lib/src/components/Icons/_assets/comment.svg similarity index 100% rename from icons/_assets/comment.svg rename to lib/src/components/Icons/_assets/comment.svg diff --git a/icons/_assets/comment_outline.svg b/lib/src/components/Icons/_assets/comment_outline.svg similarity index 100% rename from icons/_assets/comment_outline.svg rename to lib/src/components/Icons/_assets/comment_outline.svg diff --git a/icons/_assets/common_area.svg b/lib/src/components/Icons/_assets/common_area.svg similarity index 100% rename from icons/_assets/common_area.svg rename to lib/src/components/Icons/_assets/common_area.svg diff --git a/icons/_assets/compass.svg b/lib/src/components/Icons/_assets/compass.svg similarity index 100% rename from icons/_assets/compass.svg rename to lib/src/components/Icons/_assets/compass.svg diff --git a/icons/_assets/computer.svg b/lib/src/components/Icons/_assets/computer.svg similarity index 100% rename from icons/_assets/computer.svg rename to lib/src/components/Icons/_assets/computer.svg diff --git a/icons/_assets/connection.svg b/lib/src/components/Icons/_assets/connection.svg similarity index 100% rename from icons/_assets/connection.svg rename to lib/src/components/Icons/_assets/connection.svg diff --git a/icons/_assets/contract.svg b/lib/src/components/Icons/_assets/contract.svg similarity index 100% rename from icons/_assets/contract.svg rename to lib/src/components/Icons/_assets/contract.svg diff --git a/icons/_assets/control_backward.svg b/lib/src/components/Icons/_assets/control_backward.svg similarity index 100% rename from icons/_assets/control_backward.svg rename to lib/src/components/Icons/_assets/control_backward.svg diff --git a/icons/_assets/control_forward.svg b/lib/src/components/Icons/_assets/control_forward.svg similarity index 100% rename from icons/_assets/control_forward.svg rename to lib/src/components/Icons/_assets/control_forward.svg diff --git a/icons/_assets/control_pause.svg b/lib/src/components/Icons/_assets/control_pause.svg similarity index 100% rename from icons/_assets/control_pause.svg rename to lib/src/components/Icons/_assets/control_pause.svg diff --git a/icons/_assets/control_stop.svg b/lib/src/components/Icons/_assets/control_stop.svg similarity index 100% rename from icons/_assets/control_stop.svg rename to lib/src/components/Icons/_assets/control_stop.svg diff --git a/icons/_assets/copy.svg b/lib/src/components/Icons/_assets/copy.svg similarity index 100% rename from icons/_assets/copy.svg rename to lib/src/components/Icons/_assets/copy.svg diff --git a/icons/_assets/cover_letter.svg b/lib/src/components/Icons/_assets/cover_letter.svg similarity index 100% rename from icons/_assets/cover_letter.svg rename to lib/src/components/Icons/_assets/cover_letter.svg diff --git a/icons/_assets/create.svg b/lib/src/components/Icons/_assets/create.svg similarity index 100% rename from icons/_assets/create.svg rename to lib/src/components/Icons/_assets/create.svg diff --git a/icons/_assets/credit_card.svg b/lib/src/components/Icons/_assets/credit_card.svg similarity index 100% rename from icons/_assets/credit_card.svg rename to lib/src/components/Icons/_assets/credit_card.svg diff --git a/icons/_assets/crescent_moon.svg b/lib/src/components/Icons/_assets/crescent_moon.svg similarity index 100% rename from icons/_assets/crescent_moon.svg rename to lib/src/components/Icons/_assets/crescent_moon.svg diff --git a/icons/_assets/crescent_moon_outline.svg b/lib/src/components/Icons/_assets/crescent_moon_outline.svg similarity index 100% rename from icons/_assets/crescent_moon_outline.svg rename to lib/src/components/Icons/_assets/crescent_moon_outline.svg diff --git a/icons/_assets/cross.svg b/lib/src/components/Icons/_assets/cross.svg similarity index 100% rename from icons/_assets/cross.svg rename to lib/src/components/Icons/_assets/cross.svg diff --git a/icons/_assets/cross_target.svg b/lib/src/components/Icons/_assets/cross_target.svg similarity index 100% rename from icons/_assets/cross_target.svg rename to lib/src/components/Icons/_assets/cross_target.svg diff --git a/icons/_assets/crown.svg b/lib/src/components/Icons/_assets/crown.svg similarity index 100% rename from icons/_assets/crown.svg rename to lib/src/components/Icons/_assets/crown.svg diff --git a/icons/_assets/csv.svg b/lib/src/components/Icons/_assets/csv.svg similarity index 100% rename from icons/_assets/csv.svg rename to lib/src/components/Icons/_assets/csv.svg diff --git a/icons/_assets/date.svg b/lib/src/components/Icons/_assets/date.svg similarity index 100% rename from icons/_assets/date.svg rename to lib/src/components/Icons/_assets/date.svg diff --git a/icons/_assets/department.svg b/lib/src/components/Icons/_assets/department.svg similarity index 100% rename from icons/_assets/department.svg rename to lib/src/components/Icons/_assets/department.svg diff --git a/icons/_assets/details.svg b/lib/src/components/Icons/_assets/details.svg similarity index 100% rename from icons/_assets/details.svg rename to lib/src/components/Icons/_assets/details.svg diff --git a/icons/_assets/diamond.svg b/lib/src/components/Icons/_assets/diamond.svg similarity index 100% rename from icons/_assets/diamond.svg rename to lib/src/components/Icons/_assets/diamond.svg diff --git a/icons/_assets/dish.svg b/lib/src/components/Icons/_assets/dish.svg similarity index 100% rename from icons/_assets/dish.svg rename to lib/src/components/Icons/_assets/dish.svg diff --git a/icons/_assets/doc.svg b/lib/src/components/Icons/_assets/doc.svg similarity index 100% rename from icons/_assets/doc.svg rename to lib/src/components/Icons/_assets/doc.svg diff --git a/icons/_assets/docx.svg b/lib/src/components/Icons/_assets/docx.svg similarity index 100% rename from icons/_assets/docx.svg rename to lib/src/components/Icons/_assets/docx.svg diff --git a/icons/_assets/down.svg b/lib/src/components/Icons/_assets/down.svg similarity index 100% rename from icons/_assets/down.svg rename to lib/src/components/Icons/_assets/down.svg diff --git a/icons/_assets/download.svg b/lib/src/components/Icons/_assets/download.svg similarity index 100% rename from icons/_assets/download.svg rename to lib/src/components/Icons/_assets/download.svg diff --git a/icons/_assets/drag_and_drop.svg b/lib/src/components/Icons/_assets/drag_and_drop.svg similarity index 100% rename from icons/_assets/drag_and_drop.svg rename to lib/src/components/Icons/_assets/drag_and_drop.svg diff --git a/icons/_assets/dribbble.svg b/lib/src/components/Icons/_assets/dribbble.svg similarity index 100% rename from icons/_assets/dribbble.svg rename to lib/src/components/Icons/_assets/dribbble.svg diff --git a/icons/_assets/earth.svg b/lib/src/components/Icons/_assets/earth.svg similarity index 100% rename from icons/_assets/earth.svg rename to lib/src/components/Icons/_assets/earth.svg diff --git a/icons/_assets/edit.svg b/lib/src/components/Icons/_assets/edit.svg similarity index 100% rename from icons/_assets/edit.svg rename to lib/src/components/Icons/_assets/edit.svg diff --git a/icons/_assets/education_level.svg b/lib/src/components/Icons/_assets/education_level.svg similarity index 100% rename from icons/_assets/education_level.svg rename to lib/src/components/Icons/_assets/education_level.svg diff --git a/icons/_assets/email.svg b/lib/src/components/Icons/_assets/email.svg similarity index 100% rename from icons/_assets/email.svg rename to lib/src/components/Icons/_assets/email.svg diff --git a/icons/_assets/email_outline.svg b/lib/src/components/Icons/_assets/email_outline.svg similarity index 100% rename from icons/_assets/email_outline.svg rename to lib/src/components/Icons/_assets/email_outline.svg diff --git a/icons/_assets/eot.svg b/lib/src/components/Icons/_assets/eot.svg similarity index 100% rename from icons/_assets/eot.svg rename to lib/src/components/Icons/_assets/eot.svg diff --git a/icons/_assets/equal.svg b/lib/src/components/Icons/_assets/equal.svg similarity index 100% rename from icons/_assets/equal.svg rename to lib/src/components/Icons/_assets/equal.svg diff --git a/icons/_assets/euro_currency.svg b/lib/src/components/Icons/_assets/euro_currency.svg similarity index 100% rename from icons/_assets/euro_currency.svg rename to lib/src/components/Icons/_assets/euro_currency.svg diff --git a/icons/_assets/expand.svg b/lib/src/components/Icons/_assets/expand.svg similarity index 100% rename from icons/_assets/expand.svg rename to lib/src/components/Icons/_assets/expand.svg diff --git a/icons/_assets/expand_text.svg b/lib/src/components/Icons/_assets/expand_text.svg similarity index 100% rename from icons/_assets/expand_text.svg rename to lib/src/components/Icons/_assets/expand_text.svg diff --git a/icons/_assets/extend.svg b/lib/src/components/Icons/_assets/extend.svg similarity index 100% rename from icons/_assets/extend.svg rename to lib/src/components/Icons/_assets/extend.svg diff --git a/icons/_assets/external_link.svg b/lib/src/components/Icons/_assets/external_link.svg similarity index 100% rename from icons/_assets/external_link.svg rename to lib/src/components/Icons/_assets/external_link.svg diff --git a/icons/_assets/facebook.svg b/lib/src/components/Icons/_assets/facebook.svg similarity index 100% rename from icons/_assets/facebook.svg rename to lib/src/components/Icons/_assets/facebook.svg diff --git a/icons/_assets/factory.svg b/lib/src/components/Icons/_assets/factory.svg similarity index 100% rename from icons/_assets/factory.svg rename to lib/src/components/Icons/_assets/factory.svg diff --git a/icons/_assets/female.svg b/lib/src/components/Icons/_assets/female.svg similarity index 100% rename from icons/_assets/female.svg rename to lib/src/components/Icons/_assets/female.svg diff --git a/icons/_assets/filters.svg b/lib/src/components/Icons/_assets/filters.svg similarity index 100% rename from icons/_assets/filters.svg rename to lib/src/components/Icons/_assets/filters.svg diff --git a/icons/_assets/fingerprint.svg b/lib/src/components/Icons/_assets/fingerprint.svg similarity index 100% rename from icons/_assets/fingerprint.svg rename to lib/src/components/Icons/_assets/fingerprint.svg diff --git a/icons/_assets/flag.svg b/lib/src/components/Icons/_assets/flag.svg similarity index 100% rename from icons/_assets/flag.svg rename to lib/src/components/Icons/_assets/flag.svg diff --git a/icons/_assets/flag_cs.svg b/lib/src/components/Icons/_assets/flag_cs.svg similarity index 100% rename from icons/_assets/flag_cs.svg rename to lib/src/components/Icons/_assets/flag_cs.svg diff --git a/icons/_assets/flag_en.svg b/lib/src/components/Icons/_assets/flag_en.svg similarity index 100% rename from icons/_assets/flag_en.svg rename to lib/src/components/Icons/_assets/flag_en.svg diff --git a/icons/_assets/flag_es.svg b/lib/src/components/Icons/_assets/flag_es.svg similarity index 100% rename from icons/_assets/flag_es.svg rename to lib/src/components/Icons/_assets/flag_es.svg diff --git a/icons/_assets/flag_fr.svg b/lib/src/components/Icons/_assets/flag_fr.svg similarity index 100% rename from icons/_assets/flag_fr.svg rename to lib/src/components/Icons/_assets/flag_fr.svg diff --git a/icons/_assets/flag_outline.svg b/lib/src/components/Icons/_assets/flag_outline.svg similarity index 100% rename from icons/_assets/flag_outline.svg rename to lib/src/components/Icons/_assets/flag_outline.svg diff --git a/icons/_assets/flag_pointed.svg b/lib/src/components/Icons/_assets/flag_pointed.svg similarity index 100% rename from icons/_assets/flag_pointed.svg rename to lib/src/components/Icons/_assets/flag_pointed.svg diff --git a/icons/_assets/flag_sk.svg b/lib/src/components/Icons/_assets/flag_sk.svg similarity index 100% rename from icons/_assets/flag_sk.svg rename to lib/src/components/Icons/_assets/flag_sk.svg diff --git a/icons/_assets/flag_us.svg b/lib/src/components/Icons/_assets/flag_us.svg similarity index 100% rename from icons/_assets/flag_us.svg rename to lib/src/components/Icons/_assets/flag_us.svg diff --git a/icons/_assets/folder.svg b/lib/src/components/Icons/_assets/folder.svg similarity index 100% rename from icons/_assets/folder.svg rename to lib/src/components/Icons/_assets/folder.svg diff --git a/icons/_assets/fullscreen_off.svg b/lib/src/components/Icons/_assets/fullscreen_off.svg similarity index 100% rename from icons/_assets/fullscreen_off.svg rename to lib/src/components/Icons/_assets/fullscreen_off.svg diff --git a/icons/_assets/fullscreen_on.svg b/lib/src/components/Icons/_assets/fullscreen_on.svg similarity index 100% rename from icons/_assets/fullscreen_on.svg rename to lib/src/components/Icons/_assets/fullscreen_on.svg diff --git a/icons/_assets/gear.svg b/lib/src/components/Icons/_assets/gear.svg similarity index 100% rename from icons/_assets/gear.svg rename to lib/src/components/Icons/_assets/gear.svg diff --git a/icons/_assets/gif.svg b/lib/src/components/Icons/_assets/gif.svg similarity index 100% rename from icons/_assets/gif.svg rename to lib/src/components/Icons/_assets/gif.svg diff --git a/icons/_assets/github.svg b/lib/src/components/Icons/_assets/github.svg similarity index 100% rename from icons/_assets/github.svg rename to lib/src/components/Icons/_assets/github.svg diff --git a/icons/_assets/google.svg b/lib/src/components/Icons/_assets/google.svg similarity index 100% rename from icons/_assets/google.svg rename to lib/src/components/Icons/_assets/google.svg diff --git a/icons/_assets/handshake.svg b/lib/src/components/Icons/_assets/handshake.svg similarity index 100% rename from icons/_assets/handshake.svg rename to lib/src/components/Icons/_assets/handshake.svg diff --git a/icons/_assets/hard_hat.svg b/lib/src/components/Icons/_assets/hard_hat.svg similarity index 100% rename from icons/_assets/hard_hat.svg rename to lib/src/components/Icons/_assets/hard_hat.svg diff --git a/icons/_assets/hashtag.svg b/lib/src/components/Icons/_assets/hashtag.svg similarity index 100% rename from icons/_assets/hashtag.svg rename to lib/src/components/Icons/_assets/hashtag.svg diff --git a/icons/_assets/heading.svg b/lib/src/components/Icons/_assets/heading.svg similarity index 100% rename from icons/_assets/heading.svg rename to lib/src/components/Icons/_assets/heading.svg diff --git a/icons/_assets/heading_1.svg b/lib/src/components/Icons/_assets/heading_1.svg similarity index 100% rename from icons/_assets/heading_1.svg rename to lib/src/components/Icons/_assets/heading_1.svg diff --git a/icons/_assets/heading_2.svg b/lib/src/components/Icons/_assets/heading_2.svg similarity index 100% rename from icons/_assets/heading_2.svg rename to lib/src/components/Icons/_assets/heading_2.svg diff --git a/icons/_assets/heading_3.svg b/lib/src/components/Icons/_assets/heading_3.svg similarity index 100% rename from icons/_assets/heading_3.svg rename to lib/src/components/Icons/_assets/heading_3.svg diff --git a/icons/_assets/heading_4.svg b/lib/src/components/Icons/_assets/heading_4.svg similarity index 100% rename from icons/_assets/heading_4.svg rename to lib/src/components/Icons/_assets/heading_4.svg diff --git a/icons/_assets/heading_5.svg b/lib/src/components/Icons/_assets/heading_5.svg similarity index 100% rename from icons/_assets/heading_5.svg rename to lib/src/components/Icons/_assets/heading_5.svg diff --git a/icons/_assets/heading_6.svg b/lib/src/components/Icons/_assets/heading_6.svg similarity index 100% rename from icons/_assets/heading_6.svg rename to lib/src/components/Icons/_assets/heading_6.svg diff --git a/icons/_assets/headset.svg b/lib/src/components/Icons/_assets/headset.svg similarity index 100% rename from icons/_assets/headset.svg rename to lib/src/components/Icons/_assets/headset.svg diff --git a/icons/_assets/heart.svg b/lib/src/components/Icons/_assets/heart.svg similarity index 100% rename from icons/_assets/heart.svg rename to lib/src/components/Icons/_assets/heart.svg diff --git a/icons/_assets/heart_outline.svg b/lib/src/components/Icons/_assets/heart_outline.svg similarity index 100% rename from icons/_assets/heart_outline.svg rename to lib/src/components/Icons/_assets/heart_outline.svg diff --git a/icons/_assets/heart_shiny.svg b/lib/src/components/Icons/_assets/heart_shiny.svg similarity index 100% rename from icons/_assets/heart_shiny.svg rename to lib/src/components/Icons/_assets/heart_shiny.svg diff --git a/icons/_assets/hide.svg b/lib/src/components/Icons/_assets/hide.svg similarity index 100% rename from icons/_assets/hide.svg rename to lib/src/components/Icons/_assets/hide.svg diff --git a/icons/_assets/home.svg b/lib/src/components/Icons/_assets/home.svg similarity index 100% rename from icons/_assets/home.svg rename to lib/src/components/Icons/_assets/home.svg diff --git a/icons/_assets/house.svg b/lib/src/components/Icons/_assets/house.svg similarity index 100% rename from icons/_assets/house.svg rename to lib/src/components/Icons/_assets/house.svg diff --git a/icons/_assets/in_progress_candidate.svg b/lib/src/components/Icons/_assets/in_progress_candidate.svg similarity index 100% rename from icons/_assets/in_progress_candidate.svg rename to lib/src/components/Icons/_assets/in_progress_candidate.svg diff --git a/icons/_assets/information.svg b/lib/src/components/Icons/_assets/information.svg similarity index 100% rename from icons/_assets/information.svg rename to lib/src/components/Icons/_assets/information.svg diff --git a/icons/_assets/information_outline.svg b/lib/src/components/Icons/_assets/information_outline.svg similarity index 100% rename from icons/_assets/information_outline.svg rename to lib/src/components/Icons/_assets/information_outline.svg diff --git a/icons/_assets/instagram.svg b/lib/src/components/Icons/_assets/instagram.svg similarity index 100% rename from icons/_assets/instagram.svg rename to lib/src/components/Icons/_assets/instagram.svg diff --git a/icons/_assets/italic.svg b/lib/src/components/Icons/_assets/italic.svg similarity index 100% rename from icons/_assets/italic.svg rename to lib/src/components/Icons/_assets/italic.svg diff --git a/icons/_assets/jpeg.svg b/lib/src/components/Icons/_assets/jpeg.svg similarity index 100% rename from icons/_assets/jpeg.svg rename to lib/src/components/Icons/_assets/jpeg.svg diff --git a/icons/_assets/jpg.svg b/lib/src/components/Icons/_assets/jpg.svg similarity index 100% rename from icons/_assets/jpg.svg rename to lib/src/components/Icons/_assets/jpg.svg diff --git a/icons/_assets/justice_hammer.svg b/lib/src/components/Icons/_assets/justice_hammer.svg similarity index 100% rename from icons/_assets/justice_hammer.svg rename to lib/src/components/Icons/_assets/justice_hammer.svg diff --git a/icons/_assets/kanban.svg b/lib/src/components/Icons/_assets/kanban.svg similarity index 100% rename from icons/_assets/kanban.svg rename to lib/src/components/Icons/_assets/kanban.svg diff --git a/icons/_assets/key.svg b/lib/src/components/Icons/_assets/key.svg similarity index 100% rename from icons/_assets/key.svg rename to lib/src/components/Icons/_assets/key.svg diff --git a/icons/_assets/language.svg b/lib/src/components/Icons/_assets/language.svg similarity index 100% rename from icons/_assets/language.svg rename to lib/src/components/Icons/_assets/language.svg diff --git a/icons/_assets/leaf.svg b/lib/src/components/Icons/_assets/leaf.svg similarity index 100% rename from icons/_assets/leaf.svg rename to lib/src/components/Icons/_assets/leaf.svg diff --git a/icons/_assets/left.svg b/lib/src/components/Icons/_assets/left.svg similarity index 100% rename from icons/_assets/left.svg rename to lib/src/components/Icons/_assets/left.svg diff --git a/icons/_assets/line_chart.svg b/lib/src/components/Icons/_assets/line_chart.svg similarity index 100% rename from icons/_assets/line_chart.svg rename to lib/src/components/Icons/_assets/line_chart.svg diff --git a/icons/_assets/link.svg b/lib/src/components/Icons/_assets/link.svg similarity index 100% rename from icons/_assets/link.svg rename to lib/src/components/Icons/_assets/link.svg diff --git a/icons/_assets/linkedin.svg b/lib/src/components/Icons/_assets/linkedin.svg similarity index 100% rename from icons/_assets/linkedin.svg rename to lib/src/components/Icons/_assets/linkedin.svg diff --git a/icons/_assets/location.svg b/lib/src/components/Icons/_assets/location.svg similarity index 100% rename from icons/_assets/location.svg rename to lib/src/components/Icons/_assets/location.svg diff --git a/icons/_assets/lock.svg b/lib/src/components/Icons/_assets/lock.svg similarity index 100% rename from icons/_assets/lock.svg rename to lib/src/components/Icons/_assets/lock.svg diff --git a/icons/_assets/lock_rounded.svg b/lib/src/components/Icons/_assets/lock_rounded.svg similarity index 100% rename from icons/_assets/lock_rounded.svg rename to lib/src/components/Icons/_assets/lock_rounded.svg diff --git a/icons/_assets/log_out.svg b/lib/src/components/Icons/_assets/log_out.svg similarity index 100% rename from icons/_assets/log_out.svg rename to lib/src/components/Icons/_assets/log_out.svg diff --git a/icons/_assets/male.svg b/lib/src/components/Icons/_assets/male.svg similarity index 100% rename from icons/_assets/male.svg rename to lib/src/components/Icons/_assets/male.svg diff --git a/icons/_assets/map.svg b/lib/src/components/Icons/_assets/map.svg similarity index 100% rename from icons/_assets/map.svg rename to lib/src/components/Icons/_assets/map.svg diff --git a/icons/_assets/masonry.svg b/lib/src/components/Icons/_assets/masonry.svg similarity index 100% rename from icons/_assets/masonry.svg rename to lib/src/components/Icons/_assets/masonry.svg diff --git a/icons/_assets/masonry_2.svg b/lib/src/components/Icons/_assets/masonry_2.svg similarity index 100% rename from icons/_assets/masonry_2.svg rename to lib/src/components/Icons/_assets/masonry_2.svg diff --git a/icons/_assets/meeting_room.svg b/lib/src/components/Icons/_assets/meeting_room.svg similarity index 100% rename from icons/_assets/meeting_room.svg rename to lib/src/components/Icons/_assets/meeting_room.svg diff --git a/icons/_assets/megaphone.svg b/lib/src/components/Icons/_assets/megaphone.svg similarity index 100% rename from icons/_assets/megaphone.svg rename to lib/src/components/Icons/_assets/megaphone.svg diff --git a/icons/_assets/mention.svg b/lib/src/components/Icons/_assets/mention.svg similarity index 100% rename from icons/_assets/mention.svg rename to lib/src/components/Icons/_assets/mention.svg diff --git a/icons/_assets/menu.svg b/lib/src/components/Icons/_assets/menu.svg similarity index 100% rename from icons/_assets/menu.svg rename to lib/src/components/Icons/_assets/menu.svg diff --git a/icons/_assets/mic.svg b/lib/src/components/Icons/_assets/mic.svg similarity index 100% rename from icons/_assets/mic.svg rename to lib/src/components/Icons/_assets/mic.svg diff --git a/icons/_assets/microphone_off.svg b/lib/src/components/Icons/_assets/microphone_off.svg similarity index 100% rename from icons/_assets/microphone_off.svg rename to lib/src/components/Icons/_assets/microphone_off.svg diff --git a/icons/_assets/microphone_on.svg b/lib/src/components/Icons/_assets/microphone_on.svg similarity index 100% rename from icons/_assets/microphone_on.svg rename to lib/src/components/Icons/_assets/microphone_on.svg diff --git a/icons/_assets/microship.svg b/lib/src/components/Icons/_assets/microship.svg similarity index 100% rename from icons/_assets/microship.svg rename to lib/src/components/Icons/_assets/microship.svg diff --git a/icons/_assets/mobile.svg b/lib/src/components/Icons/_assets/mobile.svg similarity index 100% rename from icons/_assets/mobile.svg rename to lib/src/components/Icons/_assets/mobile.svg diff --git a/icons/_assets/money.svg b/lib/src/components/Icons/_assets/money.svg similarity index 100% rename from icons/_assets/money.svg rename to lib/src/components/Icons/_assets/money.svg diff --git a/icons/_assets/more.svg b/lib/src/components/Icons/_assets/more.svg similarity index 100% rename from icons/_assets/more.svg rename to lib/src/components/Icons/_assets/more.svg diff --git a/icons/_assets/more_android.svg b/lib/src/components/Icons/_assets/more_android.svg similarity index 100% rename from icons/_assets/more_android.svg rename to lib/src/components/Icons/_assets/more_android.svg diff --git a/icons/_assets/mountain.svg b/lib/src/components/Icons/_assets/mountain.svg similarity index 100% rename from icons/_assets/mountain.svg rename to lib/src/components/Icons/_assets/mountain.svg diff --git a/icons/_assets/move.svg b/lib/src/components/Icons/_assets/move.svg similarity index 100% rename from icons/_assets/move.svg rename to lib/src/components/Icons/_assets/move.svg diff --git a/icons/_assets/music.svg b/lib/src/components/Icons/_assets/music.svg similarity index 100% rename from icons/_assets/music.svg rename to lib/src/components/Icons/_assets/music.svg diff --git a/icons/_assets/negative.svg b/lib/src/components/Icons/_assets/negative.svg similarity index 100% rename from icons/_assets/negative.svg rename to lib/src/components/Icons/_assets/negative.svg diff --git a/icons/_assets/negative_outline.svg b/lib/src/components/Icons/_assets/negative_outline.svg similarity index 100% rename from icons/_assets/negative_outline.svg rename to lib/src/components/Icons/_assets/negative_outline.svg diff --git a/icons/_assets/negative_straight.svg b/lib/src/components/Icons/_assets/negative_straight.svg similarity index 100% rename from icons/_assets/negative_straight.svg rename to lib/src/components/Icons/_assets/negative_straight.svg diff --git a/icons/_assets/new_candidate.svg b/lib/src/components/Icons/_assets/new_candidate.svg similarity index 100% rename from icons/_assets/new_candidate.svg rename to lib/src/components/Icons/_assets/new_candidate.svg diff --git a/icons/_assets/notification.svg b/lib/src/components/Icons/_assets/notification.svg similarity index 100% rename from icons/_assets/notification.svg rename to lib/src/components/Icons/_assets/notification.svg diff --git a/icons/_assets/npm.svg b/lib/src/components/Icons/_assets/npm.svg similarity index 100% rename from icons/_assets/npm.svg rename to lib/src/components/Icons/_assets/npm.svg diff --git a/icons/_assets/offer_status.svg b/lib/src/components/Icons/_assets/offer_status.svg similarity index 100% rename from icons/_assets/offer_status.svg rename to lib/src/components/Icons/_assets/offer_status.svg diff --git a/icons/_assets/office.svg b/lib/src/components/Icons/_assets/office.svg similarity index 100% rename from icons/_assets/office.svg rename to lib/src/components/Icons/_assets/office.svg diff --git a/icons/_assets/ordered_list.svg b/lib/src/components/Icons/_assets/ordered_list.svg similarity index 100% rename from icons/_assets/ordered_list.svg rename to lib/src/components/Icons/_assets/ordered_list.svg diff --git a/icons/_assets/origine.svg b/lib/src/components/Icons/_assets/origine.svg similarity index 100% rename from icons/_assets/origine.svg rename to lib/src/components/Icons/_assets/origine.svg diff --git a/icons/_assets/paperplane.svg b/lib/src/components/Icons/_assets/paperplane.svg similarity index 100% rename from icons/_assets/paperplane.svg rename to lib/src/components/Icons/_assets/paperplane.svg diff --git a/icons/_assets/pdf.svg b/lib/src/components/Icons/_assets/pdf.svg similarity index 100% rename from icons/_assets/pdf.svg rename to lib/src/components/Icons/_assets/pdf.svg diff --git a/icons/_assets/pencil.svg b/lib/src/components/Icons/_assets/pencil.svg similarity index 100% rename from icons/_assets/pencil.svg rename to lib/src/components/Icons/_assets/pencil.svg diff --git a/icons/_assets/phone.svg b/lib/src/components/Icons/_assets/phone.svg similarity index 100% rename from icons/_assets/phone.svg rename to lib/src/components/Icons/_assets/phone.svg diff --git a/icons/_assets/phone_outline.svg b/lib/src/components/Icons/_assets/phone_outline.svg similarity index 100% rename from icons/_assets/phone_outline.svg rename to lib/src/components/Icons/_assets/phone_outline.svg diff --git a/icons/_assets/pictures.svg b/lib/src/components/Icons/_assets/pictures.svg similarity index 100% rename from icons/_assets/pictures.svg rename to lib/src/components/Icons/_assets/pictures.svg diff --git a/icons/_assets/piechart.svg b/lib/src/components/Icons/_assets/piechart.svg similarity index 100% rename from icons/_assets/piechart.svg rename to lib/src/components/Icons/_assets/piechart.svg diff --git a/icons/_assets/pin.svg b/lib/src/components/Icons/_assets/pin.svg similarity index 100% rename from icons/_assets/pin.svg rename to lib/src/components/Icons/_assets/pin.svg diff --git a/icons/_assets/pinterest.svg b/lib/src/components/Icons/_assets/pinterest.svg similarity index 100% rename from icons/_assets/pinterest.svg rename to lib/src/components/Icons/_assets/pinterest.svg diff --git a/icons/_assets/pizza.svg b/lib/src/components/Icons/_assets/pizza.svg similarity index 100% rename from icons/_assets/pizza.svg rename to lib/src/components/Icons/_assets/pizza.svg diff --git a/icons/_assets/play.svg b/lib/src/components/Icons/_assets/play.svg similarity index 100% rename from icons/_assets/play.svg rename to lib/src/components/Icons/_assets/play.svg diff --git a/icons/_assets/play_outline.svg b/lib/src/components/Icons/_assets/play_outline.svg similarity index 100% rename from icons/_assets/play_outline.svg rename to lib/src/components/Icons/_assets/play_outline.svg diff --git a/icons/_assets/playlist.svg b/lib/src/components/Icons/_assets/playlist.svg similarity index 100% rename from icons/_assets/playlist.svg rename to lib/src/components/Icons/_assets/playlist.svg diff --git a/icons/_assets/png.svg b/lib/src/components/Icons/_assets/png.svg similarity index 100% rename from icons/_assets/png.svg rename to lib/src/components/Icons/_assets/png.svg diff --git a/icons/_assets/podcast.svg b/lib/src/components/Icons/_assets/podcast.svg similarity index 100% rename from icons/_assets/podcast.svg rename to lib/src/components/Icons/_assets/podcast.svg diff --git a/icons/_assets/positive.svg b/lib/src/components/Icons/_assets/positive.svg similarity index 100% rename from icons/_assets/positive.svg rename to lib/src/components/Icons/_assets/positive.svg diff --git a/icons/_assets/positive_outline.svg b/lib/src/components/Icons/_assets/positive_outline.svg similarity index 100% rename from icons/_assets/positive_outline.svg rename to lib/src/components/Icons/_assets/positive_outline.svg diff --git a/icons/_assets/positive_straight.svg b/lib/src/components/Icons/_assets/positive_straight.svg similarity index 100% rename from icons/_assets/positive_straight.svg rename to lib/src/components/Icons/_assets/positive_straight.svg diff --git a/icons/_assets/ppt.svg b/lib/src/components/Icons/_assets/ppt.svg similarity index 100% rename from icons/_assets/ppt.svg rename to lib/src/components/Icons/_assets/ppt.svg diff --git a/icons/_assets/print.svg b/lib/src/components/Icons/_assets/print.svg similarity index 100% rename from icons/_assets/print.svg rename to lib/src/components/Icons/_assets/print.svg diff --git a/icons/_assets/promote.svg b/lib/src/components/Icons/_assets/promote.svg similarity index 100% rename from icons/_assets/promote.svg rename to lib/src/components/Icons/_assets/promote.svg diff --git a/icons/_assets/puzzle.svg b/lib/src/components/Icons/_assets/puzzle.svg similarity index 100% rename from icons/_assets/puzzle.svg rename to lib/src/components/Icons/_assets/puzzle.svg diff --git a/icons/_assets/puzzle_outline.svg b/lib/src/components/Icons/_assets/puzzle_outline.svg similarity index 100% rename from icons/_assets/puzzle_outline.svg rename to lib/src/components/Icons/_assets/puzzle_outline.svg diff --git a/icons/_assets/question.svg b/lib/src/components/Icons/_assets/question.svg similarity index 100% rename from icons/_assets/question.svg rename to lib/src/components/Icons/_assets/question.svg diff --git a/icons/_assets/questions.svg b/lib/src/components/Icons/_assets/questions.svg similarity index 100% rename from icons/_assets/questions.svg rename to lib/src/components/Icons/_assets/questions.svg diff --git a/icons/_assets/quote.svg b/lib/src/components/Icons/_assets/quote.svg similarity index 100% rename from icons/_assets/quote.svg rename to lib/src/components/Icons/_assets/quote.svg diff --git a/icons/_assets/refresh.svg b/lib/src/components/Icons/_assets/refresh.svg similarity index 100% rename from icons/_assets/refresh.svg rename to lib/src/components/Icons/_assets/refresh.svg diff --git a/icons/_assets/refuse_candidate.svg b/lib/src/components/Icons/_assets/refuse_candidate.svg similarity index 100% rename from icons/_assets/refuse_candidate.svg rename to lib/src/components/Icons/_assets/refuse_candidate.svg diff --git a/icons/_assets/remote.svg b/lib/src/components/Icons/_assets/remote.svg similarity index 100% rename from icons/_assets/remote.svg rename to lib/src/components/Icons/_assets/remote.svg diff --git a/icons/_assets/remove.svg b/lib/src/components/Icons/_assets/remove.svg similarity index 100% rename from icons/_assets/remove.svg rename to lib/src/components/Icons/_assets/remove.svg diff --git a/icons/_assets/reset.svg b/lib/src/components/Icons/_assets/reset.svg similarity index 100% rename from icons/_assets/reset.svg rename to lib/src/components/Icons/_assets/reset.svg diff --git a/icons/_assets/resume.svg b/lib/src/components/Icons/_assets/resume.svg similarity index 100% rename from icons/_assets/resume.svg rename to lib/src/components/Icons/_assets/resume.svg diff --git a/icons/_assets/review.svg b/lib/src/components/Icons/_assets/review.svg similarity index 100% rename from icons/_assets/review.svg rename to lib/src/components/Icons/_assets/review.svg diff --git a/icons/_assets/review_outline.svg b/lib/src/components/Icons/_assets/review_outline.svg similarity index 100% rename from icons/_assets/review_outline.svg rename to lib/src/components/Icons/_assets/review_outline.svg diff --git a/icons/_assets/right.svg b/lib/src/components/Icons/_assets/right.svg similarity index 100% rename from icons/_assets/right.svg rename to lib/src/components/Icons/_assets/right.svg diff --git a/icons/_assets/salary.svg b/lib/src/components/Icons/_assets/salary.svg similarity index 100% rename from icons/_assets/salary.svg rename to lib/src/components/Icons/_assets/salary.svg diff --git a/icons/_assets/save.svg b/lib/src/components/Icons/_assets/save.svg similarity index 100% rename from icons/_assets/save.svg rename to lib/src/components/Icons/_assets/save.svg diff --git a/icons/_assets/screenshare_off.svg b/lib/src/components/Icons/_assets/screenshare_off.svg similarity index 100% rename from icons/_assets/screenshare_off.svg rename to lib/src/components/Icons/_assets/screenshare_off.svg diff --git a/icons/_assets/screenshare_on.svg b/lib/src/components/Icons/_assets/screenshare_on.svg similarity index 100% rename from icons/_assets/screenshare_on.svg rename to lib/src/components/Icons/_assets/screenshare_on.svg diff --git a/icons/_assets/search.svg b/lib/src/components/Icons/_assets/search.svg similarity index 100% rename from icons/_assets/search.svg rename to lib/src/components/Icons/_assets/search.svg diff --git a/icons/_assets/search_people.svg b/lib/src/components/Icons/_assets/search_people.svg similarity index 100% rename from icons/_assets/search_people.svg rename to lib/src/components/Icons/_assets/search_people.svg diff --git a/icons/_assets/settings.svg b/lib/src/components/Icons/_assets/settings.svg similarity index 100% rename from icons/_assets/settings.svg rename to lib/src/components/Icons/_assets/settings.svg diff --git a/icons/_assets/share1.svg b/lib/src/components/Icons/_assets/share1.svg similarity index 100% rename from icons/_assets/share1.svg rename to lib/src/components/Icons/_assets/share1.svg diff --git a/icons/_assets/share2.svg b/lib/src/components/Icons/_assets/share2.svg similarity index 100% rename from icons/_assets/share2.svg rename to lib/src/components/Icons/_assets/share2.svg diff --git a/icons/_assets/shield.svg b/lib/src/components/Icons/_assets/shield.svg similarity index 100% rename from icons/_assets/shield.svg rename to lib/src/components/Icons/_assets/shield.svg diff --git a/icons/_assets/show.svg b/lib/src/components/Icons/_assets/show.svg similarity index 100% rename from icons/_assets/show.svg rename to lib/src/components/Icons/_assets/show.svg diff --git a/icons/_assets/slack.svg b/lib/src/components/Icons/_assets/slack.svg similarity index 100% rename from icons/_assets/slack.svg rename to lib/src/components/Icons/_assets/slack.svg diff --git a/icons/_assets/sound_off.svg b/lib/src/components/Icons/_assets/sound_off.svg similarity index 100% rename from icons/_assets/sound_off.svg rename to lib/src/components/Icons/_assets/sound_off.svg diff --git a/icons/_assets/sound_on.svg b/lib/src/components/Icons/_assets/sound_on.svg similarity index 100% rename from icons/_assets/sound_on.svg rename to lib/src/components/Icons/_assets/sound_on.svg diff --git a/icons/_assets/source.svg b/lib/src/components/Icons/_assets/source.svg similarity index 100% rename from icons/_assets/source.svg rename to lib/src/components/Icons/_assets/source.svg diff --git a/icons/_assets/spanner.svg b/lib/src/components/Icons/_assets/spanner.svg similarity index 100% rename from icons/_assets/spanner.svg rename to lib/src/components/Icons/_assets/spanner.svg diff --git a/icons/_assets/sparkles.svg b/lib/src/components/Icons/_assets/sparkles.svg similarity index 100% rename from icons/_assets/sparkles.svg rename to lib/src/components/Icons/_assets/sparkles.svg diff --git a/icons/_assets/square_alert.svg b/lib/src/components/Icons/_assets/square_alert.svg similarity index 100% rename from icons/_assets/square_alert.svg rename to lib/src/components/Icons/_assets/square_alert.svg diff --git a/icons/_assets/stackoverflow.svg b/lib/src/components/Icons/_assets/stackoverflow.svg similarity index 100% rename from icons/_assets/stackoverflow.svg rename to lib/src/components/Icons/_assets/stackoverflow.svg diff --git a/icons/_assets/stackserver.svg b/lib/src/components/Icons/_assets/stackserver.svg similarity index 100% rename from icons/_assets/stackserver.svg rename to lib/src/components/Icons/_assets/stackserver.svg diff --git a/icons/_assets/star.svg b/lib/src/components/Icons/_assets/star.svg similarity index 100% rename from icons/_assets/star.svg rename to lib/src/components/Icons/_assets/star.svg diff --git a/icons/_assets/star_outline.svg b/lib/src/components/Icons/_assets/star_outline.svg similarity index 100% rename from icons/_assets/star_outline.svg rename to lib/src/components/Icons/_assets/star_outline.svg diff --git a/icons/_assets/strikethrough.svg b/lib/src/components/Icons/_assets/strikethrough.svg similarity index 100% rename from icons/_assets/strikethrough.svg rename to lib/src/components/Icons/_assets/strikethrough.svg diff --git a/icons/_assets/subtitle.svg b/lib/src/components/Icons/_assets/subtitle.svg similarity index 100% rename from icons/_assets/subtitle.svg rename to lib/src/components/Icons/_assets/subtitle.svg diff --git a/icons/_assets/success.svg b/lib/src/components/Icons/_assets/success.svg similarity index 100% rename from icons/_assets/success.svg rename to lib/src/components/Icons/_assets/success.svg diff --git a/icons/_assets/suitcase.svg b/lib/src/components/Icons/_assets/suitcase.svg similarity index 100% rename from icons/_assets/suitcase.svg rename to lib/src/components/Icons/_assets/suitcase.svg diff --git a/icons/_assets/sun.svg b/lib/src/components/Icons/_assets/sun.svg similarity index 100% rename from icons/_assets/sun.svg rename to lib/src/components/Icons/_assets/sun.svg diff --git a/icons/_assets/svg.svg b/lib/src/components/Icons/_assets/svg.svg similarity index 100% rename from icons/_assets/svg.svg rename to lib/src/components/Icons/_assets/svg.svg diff --git a/icons/_assets/symbol.svg b/lib/src/components/Icons/_assets/symbol.svg similarity index 100% rename from icons/_assets/symbol.svg rename to lib/src/components/Icons/_assets/symbol.svg diff --git a/icons/_assets/table.svg b/lib/src/components/Icons/_assets/table.svg similarity index 100% rename from icons/_assets/table.svg rename to lib/src/components/Icons/_assets/table.svg diff --git a/icons/_assets/table_column_add_after.svg b/lib/src/components/Icons/_assets/table_column_add_after.svg similarity index 100% rename from icons/_assets/table_column_add_after.svg rename to lib/src/components/Icons/_assets/table_column_add_after.svg diff --git a/icons/_assets/table_column_add_before.svg b/lib/src/components/Icons/_assets/table_column_add_before.svg similarity index 100% rename from icons/_assets/table_column_add_before.svg rename to lib/src/components/Icons/_assets/table_column_add_before.svg diff --git a/icons/_assets/table_column_remove.svg b/lib/src/components/Icons/_assets/table_column_remove.svg similarity index 100% rename from icons/_assets/table_column_remove.svg rename to lib/src/components/Icons/_assets/table_column_remove.svg diff --git a/icons/_assets/table_delete.svg b/lib/src/components/Icons/_assets/table_delete.svg similarity index 100% rename from icons/_assets/table_delete.svg rename to lib/src/components/Icons/_assets/table_delete.svg diff --git a/icons/_assets/table_divide.svg b/lib/src/components/Icons/_assets/table_divide.svg similarity index 100% rename from icons/_assets/table_divide.svg rename to lib/src/components/Icons/_assets/table_divide.svg diff --git a/icons/_assets/table_merge_cells.svg b/lib/src/components/Icons/_assets/table_merge_cells.svg similarity index 100% rename from icons/_assets/table_merge_cells.svg rename to lib/src/components/Icons/_assets/table_merge_cells.svg diff --git a/icons/_assets/table_row_add_above.svg b/lib/src/components/Icons/_assets/table_row_add_above.svg similarity index 100% rename from icons/_assets/table_row_add_above.svg rename to lib/src/components/Icons/_assets/table_row_add_above.svg diff --git a/icons/_assets/table_row_add_below.svg b/lib/src/components/Icons/_assets/table_row_add_below.svg similarity index 100% rename from icons/_assets/table_row_add_below.svg rename to lib/src/components/Icons/_assets/table_row_add_below.svg diff --git a/icons/_assets/table_row_remove.svg b/lib/src/components/Icons/_assets/table_row_remove.svg similarity index 100% rename from icons/_assets/table_row_remove.svg rename to lib/src/components/Icons/_assets/table_row_remove.svg diff --git a/icons/_assets/tablet.svg b/lib/src/components/Icons/_assets/tablet.svg similarity index 100% rename from icons/_assets/tablet.svg rename to lib/src/components/Icons/_assets/tablet.svg diff --git a/icons/_assets/tag.svg b/lib/src/components/Icons/_assets/tag.svg similarity index 100% rename from icons/_assets/tag.svg rename to lib/src/components/Icons/_assets/tag.svg diff --git a/icons/_assets/target.svg b/lib/src/components/Icons/_assets/target.svg similarity index 100% rename from icons/_assets/target.svg rename to lib/src/components/Icons/_assets/target.svg diff --git a/icons/_assets/teepee.svg b/lib/src/components/Icons/_assets/teepee.svg similarity index 100% rename from icons/_assets/teepee.svg rename to lib/src/components/Icons/_assets/teepee.svg diff --git a/icons/_assets/thumb_down.svg b/lib/src/components/Icons/_assets/thumb_down.svg similarity index 100% rename from icons/_assets/thumb_down.svg rename to lib/src/components/Icons/_assets/thumb_down.svg diff --git a/icons/_assets/thumb_up.svg b/lib/src/components/Icons/_assets/thumb_up.svg similarity index 100% rename from icons/_assets/thumb_up.svg rename to lib/src/components/Icons/_assets/thumb_up.svg diff --git a/icons/_assets/thunderclock.svg b/lib/src/components/Icons/_assets/thunderclock.svg similarity index 100% rename from icons/_assets/thunderclock.svg rename to lib/src/components/Icons/_assets/thunderclock.svg diff --git a/icons/_assets/tiktok.svg b/lib/src/components/Icons/_assets/tiktok.svg similarity index 100% rename from icons/_assets/tiktok.svg rename to lib/src/components/Icons/_assets/tiktok.svg diff --git a/icons/_assets/trash.svg b/lib/src/components/Icons/_assets/trash.svg similarity index 100% rename from icons/_assets/trash.svg rename to lib/src/components/Icons/_assets/trash.svg diff --git a/icons/_assets/tree.svg b/lib/src/components/Icons/_assets/tree.svg similarity index 100% rename from icons/_assets/tree.svg rename to lib/src/components/Icons/_assets/tree.svg diff --git a/icons/_assets/trophy.svg b/lib/src/components/Icons/_assets/trophy.svg similarity index 100% rename from icons/_assets/trophy.svg rename to lib/src/components/Icons/_assets/trophy.svg diff --git a/icons/_assets/ttf.svg b/lib/src/components/Icons/_assets/ttf.svg similarity index 100% rename from icons/_assets/ttf.svg rename to lib/src/components/Icons/_assets/ttf.svg diff --git a/icons/_assets/twitch.svg b/lib/src/components/Icons/_assets/twitch.svg similarity index 100% rename from icons/_assets/twitch.svg rename to lib/src/components/Icons/_assets/twitch.svg diff --git a/icons/_assets/twitter.svg b/lib/src/components/Icons/_assets/twitter.svg similarity index 100% rename from icons/_assets/twitter.svg rename to lib/src/components/Icons/_assets/twitter.svg diff --git a/icons/_assets/txt.svg b/lib/src/components/Icons/_assets/txt.svg similarity index 100% rename from icons/_assets/txt.svg rename to lib/src/components/Icons/_assets/txt.svg diff --git a/icons/_assets/type.svg b/lib/src/components/Icons/_assets/type.svg similarity index 100% rename from icons/_assets/type.svg rename to lib/src/components/Icons/_assets/type.svg diff --git a/icons/_assets/unavailable.svg b/lib/src/components/Icons/_assets/unavailable.svg similarity index 100% rename from icons/_assets/unavailable.svg rename to lib/src/components/Icons/_assets/unavailable.svg diff --git a/icons/_assets/underline.svg b/lib/src/components/Icons/_assets/underline.svg similarity index 100% rename from icons/_assets/underline.svg rename to lib/src/components/Icons/_assets/underline.svg diff --git a/icons/_assets/unordered_list.svg b/lib/src/components/Icons/_assets/unordered_list.svg similarity index 100% rename from icons/_assets/unordered_list.svg rename to lib/src/components/Icons/_assets/unordered_list.svg diff --git a/icons/_assets/up.svg b/lib/src/components/Icons/_assets/up.svg similarity index 100% rename from icons/_assets/up.svg rename to lib/src/components/Icons/_assets/up.svg diff --git a/icons/_assets/update.svg b/lib/src/components/Icons/_assets/update.svg similarity index 100% rename from icons/_assets/update.svg rename to lib/src/components/Icons/_assets/update.svg diff --git a/icons/_assets/upload.svg b/lib/src/components/Icons/_assets/upload.svg similarity index 100% rename from icons/_assets/upload.svg rename to lib/src/components/Icons/_assets/upload.svg diff --git a/icons/_assets/user.svg b/lib/src/components/Icons/_assets/user.svg similarity index 100% rename from icons/_assets/user.svg rename to lib/src/components/Icons/_assets/user.svg diff --git a/icons/_assets/user_outline.svg b/lib/src/components/Icons/_assets/user_outline.svg similarity index 100% rename from icons/_assets/user_outline.svg rename to lib/src/components/Icons/_assets/user_outline.svg diff --git a/icons/_assets/video.svg b/lib/src/components/Icons/_assets/video.svg similarity index 100% rename from icons/_assets/video.svg rename to lib/src/components/Icons/_assets/video.svg diff --git a/icons/_assets/video_camera.svg b/lib/src/components/Icons/_assets/video_camera.svg similarity index 100% rename from icons/_assets/video_camera.svg rename to lib/src/components/Icons/_assets/video_camera.svg diff --git a/icons/_assets/video_camera_2.svg b/lib/src/components/Icons/_assets/video_camera_2.svg similarity index 100% rename from icons/_assets/video_camera_2.svg rename to lib/src/components/Icons/_assets/video_camera_2.svg diff --git a/icons/_assets/watch_later.svg b/lib/src/components/Icons/_assets/watch_later.svg similarity index 100% rename from icons/_assets/watch_later.svg rename to lib/src/components/Icons/_assets/watch_later.svg diff --git a/icons/_assets/woff.svg b/lib/src/components/Icons/_assets/woff.svg similarity index 100% rename from icons/_assets/woff.svg rename to lib/src/components/Icons/_assets/woff.svg diff --git a/icons/_assets/woff2.svg b/lib/src/components/Icons/_assets/woff2.svg similarity index 100% rename from icons/_assets/woff2.svg rename to lib/src/components/Icons/_assets/woff2.svg diff --git a/icons/_assets/write.svg b/lib/src/components/Icons/_assets/write.svg similarity index 100% rename from icons/_assets/write.svg rename to lib/src/components/Icons/_assets/write.svg diff --git a/icons/_assets/wttj.svg b/lib/src/components/Icons/_assets/wttj.svg similarity index 100% rename from icons/_assets/wttj.svg rename to lib/src/components/Icons/_assets/wttj.svg diff --git a/icons/_assets/x.svg b/lib/src/components/Icons/_assets/x.svg similarity index 100% rename from icons/_assets/x.svg rename to lib/src/components/Icons/_assets/x.svg diff --git a/icons/_assets/xing.svg b/lib/src/components/Icons/_assets/xing.svg similarity index 100% rename from icons/_assets/xing.svg rename to lib/src/components/Icons/_assets/xing.svg diff --git a/icons/_assets/xls.svg b/lib/src/components/Icons/_assets/xls.svg similarity index 100% rename from icons/_assets/xls.svg rename to lib/src/components/Icons/_assets/xls.svg diff --git a/icons/_assets/xlsx.svg b/lib/src/components/Icons/_assets/xlsx.svg similarity index 100% rename from icons/_assets/xlsx.svg rename to lib/src/components/Icons/_assets/xlsx.svg diff --git a/icons/_assets/youtube.svg b/lib/src/components/Icons/_assets/youtube.svg similarity index 100% rename from icons/_assets/youtube.svg rename to lib/src/components/Icons/_assets/youtube.svg diff --git a/icons/_assets/zapier.svg b/lib/src/components/Icons/_assets/zapier.svg similarity index 100% rename from icons/_assets/zapier.svg rename to lib/src/components/Icons/_assets/zapier.svg diff --git a/icons/_assets/zip.svg b/lib/src/components/Icons/_assets/zip.svg similarity index 100% rename from icons/_assets/zip.svg rename to lib/src/components/Icons/_assets/zip.svg diff --git a/icons/src/index.ts b/lib/src/components/Icons/index.tsx similarity index 100% rename from icons/src/index.ts rename to lib/src/components/Icons/index.tsx diff --git a/lib/src/components/IconsFont/_hash.ts b/lib/src/components/IconsFont/_hash.ts new file mode 100644 index 0000000000..ea744a13d1 --- /dev/null +++ b/lib/src/components/IconsFont/_hash.ts @@ -0,0 +1 @@ +export const FONT_HASH = 'f19d0de47a5f6f7446d37111f075c0901835bf12' diff --git a/lib/src/components/IconsFont/docs/examples/color.tsx b/lib/src/components/IconsFont/docs/examples/color.tsx new file mode 100644 index 0000000000..11d8c15f76 --- /dev/null +++ b/lib/src/components/IconsFont/docs/examples/color.tsx @@ -0,0 +1,15 @@ +import * as React from 'react' + +import { IconsFont } from '@/IconsFont' + +const Example = () => { + return ( + <> + + + + + ) +} + +export default Example diff --git a/lib/src/components/IconsFont/docs/examples/css.tsx b/lib/src/components/IconsFont/docs/examples/css.tsx new file mode 100644 index 0000000000..10a92bb092 --- /dev/null +++ b/lib/src/components/IconsFont/docs/examples/css.tsx @@ -0,0 +1,8 @@ +import * as React from 'react' +import '@/fonts/welcome-icon-font.css' + +const Example = () => { + return +} + +export default Example diff --git a/lib/src/components/IconsFont/docs/examples/overview.tsx b/lib/src/components/IconsFont/docs/examples/overview.tsx new file mode 100644 index 0000000000..5c133f9419 --- /dev/null +++ b/lib/src/components/IconsFont/docs/examples/overview.tsx @@ -0,0 +1,9 @@ +import * as React from 'react' + +import { IconsFont } from '@/IconsFont' + +const Example = () => { + return +} + +export default Example diff --git a/lib/src/components/IconsFont/docs/examples/sizes.tsx b/lib/src/components/IconsFont/docs/examples/sizes.tsx new file mode 100644 index 0000000000..16ec47650f --- /dev/null +++ b/lib/src/components/IconsFont/docs/examples/sizes.tsx @@ -0,0 +1,18 @@ +import * as React from 'react' + +import { IconsFont } from '@/IconsFont' + +const Example = () => { + return ( + <> + + + + + + + + ) +} + +export default Example diff --git a/lib/src/components/IconsFont/docs/index.mdx b/lib/src/components/IconsFont/docs/index.mdx new file mode 100644 index 0000000000..042c2a1218 --- /dev/null +++ b/lib/src/components/IconsFont/docs/index.mdx @@ -0,0 +1,77 @@ +--- +category: icons-&-logo +description: The IconsFont component uses a font-based approach to display scalable icons. It provides a collection of icons that can be styled with CSS, just like text, ensuring consistency and flexibility in size, color, and other properties. This component is ideal for adding visually appealing and responsive icons to your application, enhancing user interface and experience. +packageName: icons.font +title: IconsFont +usage: Icons +--- + +### Size + +Use size property with `xs`, `sm`, `md`, `lg` `xl` or `xxl`. + +
+ +### Color + +Icons inherit the color from their parent. + +
+ +### CSS import + +To import IconsFont css stylesheet, you should use this import path: + +```jsx +import 'welcome-ui/fonts/welcome-icon-font.css' +``` + +Here is an example on how to use css class to display icons: + +
+ +## Icons + +### Arrows + +
+ +### Actions + +
+ +### Miscellaneous + +
+ +### WTF + +
+ +### Files + +
+ +### Player + +
+ +### Avatar + +
+ +### Markdown + +
+ +### Table + +
+ +### Brands + +
+ +### Welcome + +
diff --git a/packages/Icon/docs/properties.json b/lib/src/components/IconsFont/docs/properties.json similarity index 100% rename from packages/Icon/docs/properties.json rename to lib/src/components/IconsFont/docs/properties.json diff --git a/lib/src/components/IconsFont/fonts/welcome-icon-font.css b/lib/src/components/IconsFont/fonts/welcome-icon-font.css new file mode 100644 index 0000000000..7836eb0171 --- /dev/null +++ b/lib/src/components/IconsFont/fonts/welcome-icon-font.css @@ -0,0 +1,915 @@ +@font-face { + font-family: "welcome-icon-font"; + font-display: block; + src: url("welcome-icon-font.woff2?a4ef92da9209c39a02364de1d84300e0") format("woff2"), +url("welcome-icon-font.woff?a4ef92da9209c39a02364de1d84300e0") format("woff"); +} + +i { + line-height: 1; +} + +i:before { + font-family: welcome-icon-font !important; + font-style: normal; + font-weight: normal !important; + vertical-align: top; +} + +.wui-icon-actions:before { + content: "\F101"; +} +.wui-icon-activity:before { + content: "\F102"; +} +.wui-icon-add:before { + content: "\F103"; +} +.wui-icon-address:before { + content: "\F104"; +} +.wui-icon-airplay:before { + content: "\F105"; +} +.wui-icon-alert:before { + content: "\F106"; +} +.wui-icon-alert_outline:before { + content: "\F107"; +} +.wui-icon-analytics:before { + content: "\F108"; +} +.wui-icon-anniversary:before { + content: "\F109"; +} +.wui-icon-archive:before { + content: "\F10A"; +} +.wui-icon-arrow_down:before { + content: "\F10B"; +} +.wui-icon-arrow_left:before { + content: "\F10C"; +} +.wui-icon-arrow_right:before { + content: "\F10D"; +} +.wui-icon-arrow_up:before { + content: "\F10E"; +} +.wui-icon-aspect_ratio_fill:before { + content: "\F10F"; +} +.wui-icon-aspect_ratio_fit:before { + content: "\F110"; +} +.wui-icon-attachment:before { + content: "\F111"; +} +.wui-icon-avatar:before { + content: "\F112"; +} +.wui-icon-avatar_accessory:before { + content: "\F113"; +} +.wui-icon-avatar_body:before { + content: "\F114"; +} +.wui-icon-avatar_bottom:before { + content: "\F115"; +} +.wui-icon-avatar_costume:before { + content: "\F116"; +} +.wui-icon-avatar_head:before { + content: "\F117"; +} +.wui-icon-avatar_top:before { + content: "\F118"; +} +.wui-icon-bar_chart:before { + content: "\F119"; +} +.wui-icon-basketball:before { + content: "\F11A"; +} +.wui-icon-behance:before { + content: "\F11B"; +} +.wui-icon-birthday:before { + content: "\F11C"; +} +.wui-icon-bold:before { + content: "\F11D"; +} +.wui-icon-book:before { + content: "\F11E"; +} +.wui-icon-book_2:before { + content: "\F11F"; +} +.wui-icon-bookmark:before { + content: "\F120"; +} +.wui-icon-bookmark_outline:before { + content: "\F121"; +} +.wui-icon-bulb:before { + content: "\F122"; +} +.wui-icon-bulk:before { + content: "\F123"; +} +.wui-icon-buoy:before { + content: "\F124"; +} +.wui-icon-burn:before { + content: "\F125"; +} +.wui-icon-caddy:before { + content: "\F126"; +} +.wui-icon-calcul:before { + content: "\F127"; +} +.wui-icon-camera:before { + content: "\F128"; +} +.wui-icon-camera_off:before { + content: "\F129"; +} +.wui-icon-camera_on:before { + content: "\F12A"; +} +.wui-icon-candidate_status:before { + content: "\F12B"; +} +.wui-icon-card_view:before { + content: "\F12C"; +} +.wui-icon-cast:before { + content: "\F12D"; +} +.wui-icon-cast_connected:before { + content: "\F12E"; +} +.wui-icon-cast_unavailable:before { + content: "\F12F"; +} +.wui-icon-celebrate:before { + content: "\F130"; +} +.wui-icon-check:before { + content: "\F131"; +} +.wui-icon-clipboard:before { + content: "\F132"; +} +.wui-icon-clock:before { + content: "\F133"; +} +.wui-icon-code:before { + content: "\F134"; +} +.wui-icon-code_block:before { + content: "\F135"; +} +.wui-icon-coffee:before { + content: "\F136"; +} +.wui-icon-collapse:before { + content: "\F137"; +} +.wui-icon-comment:before { + content: "\F138"; +} +.wui-icon-comment_outline:before { + content: "\F139"; +} +.wui-icon-common_area:before { + content: "\F13A"; +} +.wui-icon-compass:before { + content: "\F13B"; +} +.wui-icon-computer:before { + content: "\F13C"; +} +.wui-icon-contract:before { + content: "\F13D"; +} +.wui-icon-control_backward:before { + content: "\F13E"; +} +.wui-icon-control_forward:before { + content: "\F13F"; +} +.wui-icon-control_pause:before { + content: "\F140"; +} +.wui-icon-control_stop:before { + content: "\F141"; +} +.wui-icon-copy:before { + content: "\F142"; +} +.wui-icon-cover_letter:before { + content: "\F143"; +} +.wui-icon-create:before { + content: "\F144"; +} +.wui-icon-credit_card:before { + content: "\F145"; +} +.wui-icon-crescent_moon:before { + content: "\F146"; +} +.wui-icon-crescent_moon_outline:before { + content: "\F147"; +} +.wui-icon-cross:before { + content: "\F148"; +} +.wui-icon-cross_target:before { + content: "\F149"; +} +.wui-icon-crown:before { + content: "\F14A"; +} +.wui-icon-csv:before { + content: "\F14B"; +} +.wui-icon-date:before { + content: "\F14C"; +} +.wui-icon-department:before { + content: "\F14D"; +} +.wui-icon-details:before { + content: "\F14E"; +} +.wui-icon-diamond:before { + content: "\F14F"; +} +.wui-icon-dish:before { + content: "\F150"; +} +.wui-icon-doc:before { + content: "\F151"; +} +.wui-icon-docx:before { + content: "\F152"; +} +.wui-icon-down:before { + content: "\F153"; +} +.wui-icon-download:before { + content: "\F154"; +} +.wui-icon-drag_and_drop:before { + content: "\F155"; +} +.wui-icon-dribbble:before { + content: "\F156"; +} +.wui-icon-earth:before { + content: "\F157"; +} +.wui-icon-edit:before { + content: "\F158"; +} +.wui-icon-education_level:before { + content: "\F159"; +} +.wui-icon-email:before { + content: "\F15A"; +} +.wui-icon-email_outline:before { + content: "\F15B"; +} +.wui-icon-eot:before { + content: "\F15C"; +} +.wui-icon-equal:before { + content: "\F15D"; +} +.wui-icon-expand:before { + content: "\F15E"; +} +.wui-icon-expand_text:before { + content: "\F15F"; +} +.wui-icon-external_link:before { + content: "\F160"; +} +.wui-icon-facebook:before { + content: "\F161"; +} +.wui-icon-factory:before { + content: "\F162"; +} +.wui-icon-female:before { + content: "\F163"; +} +.wui-icon-filters:before { + content: "\F164"; +} +.wui-icon-fingerprint:before { + content: "\F165"; +} +.wui-icon-flag:before { + content: "\F166"; +} +.wui-icon-flag_outline:before { + content: "\F167"; +} +.wui-icon-flag_pointed:before { + content: "\F168"; +} +.wui-icon-folder:before { + content: "\F169"; +} +.wui-icon-fullscreen_off:before { + content: "\F16A"; +} +.wui-icon-fullscreen_on:before { + content: "\F16B"; +} +.wui-icon-gear:before { + content: "\F16C"; +} +.wui-icon-gif:before { + content: "\F16D"; +} +.wui-icon-github:before { + content: "\F16E"; +} +.wui-icon-google:before { + content: "\F16F"; +} +.wui-icon-handshake:before { + content: "\F170"; +} +.wui-icon-hard_hat:before { + content: "\F171"; +} +.wui-icon-hashtag:before { + content: "\F172"; +} +.wui-icon-heading:before { + content: "\F173"; +} +.wui-icon-heading_1:before { + content: "\F174"; +} +.wui-icon-heading_2:before { + content: "\F175"; +} +.wui-icon-heading_3:before { + content: "\F176"; +} +.wui-icon-heading_4:before { + content: "\F177"; +} +.wui-icon-heading_5:before { + content: "\F178"; +} +.wui-icon-heading_6:before { + content: "\F179"; +} +.wui-icon-headset:before { + content: "\F17A"; +} +.wui-icon-heart:before { + content: "\F17B"; +} +.wui-icon-heart_outline:before { + content: "\F17C"; +} +.wui-icon-heart_shiny:before { + content: "\F17D"; +} +.wui-icon-hide:before { + content: "\F17E"; +} +.wui-icon-home:before { + content: "\F17F"; +} +.wui-icon-house:before { + content: "\F180"; +} +.wui-icon-in_progress_candidate:before { + content: "\F181"; +} +.wui-icon-information:before { + content: "\F182"; +} +.wui-icon-information_outline:before { + content: "\F183"; +} +.wui-icon-instagram:before { + content: "\F184"; +} +.wui-icon-italic:before { + content: "\F185"; +} +.wui-icon-jpeg:before { + content: "\F186"; +} +.wui-icon-jpg:before { + content: "\F187"; +} +.wui-icon-justice_hammer:before { + content: "\F188"; +} +.wui-icon-kanban:before { + content: "\F189"; +} +.wui-icon-key:before { + content: "\F18A"; +} +.wui-icon-language:before { + content: "\F18B"; +} +.wui-icon-leaf:before { + content: "\F18C"; +} +.wui-icon-left:before { + content: "\F18D"; +} +.wui-icon-line_chart:before { + content: "\F18E"; +} +.wui-icon-link:before { + content: "\F18F"; +} +.wui-icon-linkedin:before { + content: "\F190"; +} +.wui-icon-location:before { + content: "\F191"; +} +.wui-icon-lock:before { + content: "\F192"; +} +.wui-icon-lock_rounded:before { + content: "\F193"; +} +.wui-icon-log_out:before { + content: "\F194"; +} +.wui-icon-male:before { + content: "\F195"; +} +.wui-icon-map:before { + content: "\F196"; +} +.wui-icon-masonry:before { + content: "\F197"; +} +.wui-icon-meeting_room:before { + content: "\F198"; +} +.wui-icon-megaphone:before { + content: "\F199"; +} +.wui-icon-mention:before { + content: "\F19A"; +} +.wui-icon-menu:before { + content: "\F19B"; +} +.wui-icon-mic:before { + content: "\F19C"; +} +.wui-icon-microphone_off:before { + content: "\F19D"; +} +.wui-icon-microphone_on:before { + content: "\F19E"; +} +.wui-icon-microship:before { + content: "\F19F"; +} +.wui-icon-money:before { + content: "\F1A0"; +} +.wui-icon-more:before { + content: "\F1A1"; +} +.wui-icon-more_android:before { + content: "\F1A2"; +} +.wui-icon-mountain:before { + content: "\F1A3"; +} +.wui-icon-music:before { + content: "\F1A4"; +} +.wui-icon-negative:before { + content: "\F1A5"; +} +.wui-icon-negative_outline:before { + content: "\F1A6"; +} +.wui-icon-negative_straight:before { + content: "\F1A7"; +} +.wui-icon-new_candidate:before { + content: "\F1A8"; +} +.wui-icon-notification:before { + content: "\F1A9"; +} +.wui-icon-npm:before { + content: "\F1AA"; +} +.wui-icon-offer_status:before { + content: "\F1AB"; +} +.wui-icon-office:before { + content: "\F1AC"; +} +.wui-icon-ordered_list:before { + content: "\F1AD"; +} +.wui-icon-origine:before { + content: "\F1AE"; +} +.wui-icon-paperplane:before { + content: "\F1AF"; +} +.wui-icon-pdf:before { + content: "\F1B0"; +} +.wui-icon-pencil:before { + content: "\F1B1"; +} +.wui-icon-phone:before { + content: "\F1B2"; +} +.wui-icon-phone_outline:before { + content: "\F1B3"; +} +.wui-icon-pictures:before { + content: "\F1B4"; +} +.wui-icon-piechart:before { + content: "\F1B5"; +} +.wui-icon-pin:before { + content: "\F1B6"; +} +.wui-icon-pinterest:before { + content: "\F1B7"; +} +.wui-icon-pizza:before { + content: "\F1B8"; +} +.wui-icon-play:before { + content: "\F1B9"; +} +.wui-icon-play_outline:before { + content: "\F1BA"; +} +.wui-icon-playlist:before { + content: "\F1BB"; +} +.wui-icon-png:before { + content: "\F1BC"; +} +.wui-icon-podcast:before { + content: "\F1BD"; +} +.wui-icon-positive:before { + content: "\F1BE"; +} +.wui-icon-positive_outline:before { + content: "\F1BF"; +} +.wui-icon-positive_straight:before { + content: "\F1C0"; +} +.wui-icon-ppt:before { + content: "\F1C1"; +} +.wui-icon-print:before { + content: "\F1C2"; +} +.wui-icon-promote:before { + content: "\F1C3"; +} +.wui-icon-puzzle:before { + content: "\F1C4"; +} +.wui-icon-puzzle_outline:before { + content: "\F1C5"; +} +.wui-icon-question:before { + content: "\F1C6"; +} +.wui-icon-questions:before { + content: "\F1C7"; +} +.wui-icon-quote:before { + content: "\F1C8"; +} +.wui-icon-refresh:before { + content: "\F1C9"; +} +.wui-icon-refuse_candidate:before { + content: "\F1CA"; +} +.wui-icon-remote:before { + content: "\F1CB"; +} +.wui-icon-remove:before { + content: "\F1CC"; +} +.wui-icon-reset:before { + content: "\F1CD"; +} +.wui-icon-resume:before { + content: "\F1CE"; +} +.wui-icon-review:before { + content: "\F1CF"; +} +.wui-icon-review_outline:before { + content: "\F1D0"; +} +.wui-icon-right:before { + content: "\F1D1"; +} +.wui-icon-salary:before { + content: "\F1D2"; +} +.wui-icon-save:before { + content: "\F1D3"; +} +.wui-icon-screenshare_off:before { + content: "\F1D4"; +} +.wui-icon-screenshare_on:before { + content: "\F1D5"; +} +.wui-icon-search:before { + content: "\F1D6"; +} +.wui-icon-search_people:before { + content: "\F1D7"; +} +.wui-icon-settings:before { + content: "\F1D8"; +} +.wui-icon-share1:before { + content: "\F1D9"; +} +.wui-icon-share2:before { + content: "\F1DA"; +} +.wui-icon-shield:before { + content: "\F1DB"; +} +.wui-icon-show:before { + content: "\F1DC"; +} +.wui-icon-slack:before { + content: "\F1DD"; +} +.wui-icon-sound_off:before { + content: "\F1DE"; +} +.wui-icon-sound_on:before { + content: "\F1DF"; +} +.wui-icon-source:before { + content: "\F1E0"; +} +.wui-icon-spanner:before { + content: "\F1E1"; +} +.wui-icon-square_alert:before { + content: "\F1E2"; +} +.wui-icon-stackoverflow:before { + content: "\F1E3"; +} +.wui-icon-stackserver:before { + content: "\F1E4"; +} +.wui-icon-star:before { + content: "\F1E5"; +} +.wui-icon-star_outline:before { + content: "\F1E6"; +} +.wui-icon-strikethrough:before { + content: "\F1E7"; +} +.wui-icon-subtitle:before { + content: "\F1E8"; +} +.wui-icon-success:before { + content: "\F1E9"; +} +.wui-icon-suitcase:before { + content: "\F1EA"; +} +.wui-icon-sun:before { + content: "\F1EB"; +} +.wui-icon-svg:before { + content: "\F1EC"; +} +.wui-icon-table:before { + content: "\F1ED"; +} +.wui-icon-table_column_add_after:before { + content: "\F1EE"; +} +.wui-icon-table_column_add_before:before { + content: "\F1EF"; +} +.wui-icon-table_column_remove:before { + content: "\F1F0"; +} +.wui-icon-table_delete:before { + content: "\F1F1"; +} +.wui-icon-table_divide:before { + content: "\F1F2"; +} +.wui-icon-table_merge_cells:before { + content: "\F1F3"; +} +.wui-icon-table_row_add_above:before { + content: "\F1F4"; +} +.wui-icon-table_row_add_below:before { + content: "\F1F5"; +} +.wui-icon-table_row_remove:before { + content: "\F1F6"; +} +.wui-icon-tag:before { + content: "\F1F7"; +} +.wui-icon-target:before { + content: "\F1F8"; +} +.wui-icon-teepee:before { + content: "\F1F9"; +} +.wui-icon-thumb_down:before { + content: "\F1FA"; +} +.wui-icon-thumb_up:before { + content: "\F1FB"; +} +.wui-icon-trash:before { + content: "\F1FC"; +} +.wui-icon-tree:before { + content: "\F1FD"; +} +.wui-icon-trophy:before { + content: "\F1FE"; +} +.wui-icon-ttf:before { + content: "\F1FF"; +} +.wui-icon-twitch:before { + content: "\F200"; +} +.wui-icon-twitter:before { + content: "\F201"; +} +.wui-icon-txt:before { + content: "\F202"; +} +.wui-icon-type:before { + content: "\F203"; +} +.wui-icon-unavailable:before { + content: "\F204"; +} +.wui-icon-underline:before { + content: "\F205"; +} +.wui-icon-unordered_list:before { + content: "\F206"; +} +.wui-icon-up:before { + content: "\F207"; +} +.wui-icon-update:before { + content: "\F208"; +} +.wui-icon-upload:before { + content: "\F209"; +} +.wui-icon-user:before { + content: "\F20A"; +} +.wui-icon-user_outline:before { + content: "\F20B"; +} +.wui-icon-video:before { + content: "\F20C"; +} +.wui-icon-video_camera:before { + content: "\F20D"; +} +.wui-icon-video_camera_2:before { + content: "\F20E"; +} +.wui-icon-watch_later:before { + content: "\F20F"; +} +.wui-icon-woff:before { + content: "\F210"; +} +.wui-icon-woff2:before { + content: "\F211"; +} +.wui-icon-write:before { + content: "\F212"; +} +.wui-icon-wttj:before { + content: "\F213"; +} +.wui-icon-xing:before { + content: "\F214"; +} +.wui-icon-xls:before { + content: "\F215"; +} +.wui-icon-xlsx:before { + content: "\F216"; +} +.wui-icon-youtube:before { + content: "\F217"; +} +.wui-icon-zapier:before { + content: "\F218"; +} +.wui-icon-zip:before { + content: "\F219"; +} +.wui-icon-move:before { + content: "\F21A"; +} +.wui-icon-tiktok:before { + content: "\F21B"; +} +.wui-icon-flag_us:before { + content: "\F21C"; +} +.wui-icon-euro_currency:before { + content: "\F21D"; +} +.wui-icon-x:before { + content: "\F21E"; +} +.wui-icon-sparkles:before { + content: "\F21F"; +} +.wui-icon-mobile:before { + content: "\F220"; +} +.wui-icon-tablet:before { + content: "\F221"; +} +.wui-icon-certified:before { + content: "\F222"; +} +.wui-icon-masonry_2:before { + content: "\F223"; +} +.wui-icon-connection:before { + content: "\F224"; +} +.wui-icon-arrow_line_left:before { + content: "\F226"; +} +.wui-icon-arrow_line_right:before { + content: "\F227"; +} +.wui-icon-arrow_line_down:before { + content: "\F228"; +} +.wui-icon-arrow_line_up:before { + content: "\F229"; +} +.wui-icon-symbol:before { + content: "\F22A"; +} +.wui-icon-thunderclock:before { + content: "\F22B"; +} +.wui-icon-extend:before { + content: "\F22C"; +} diff --git a/lib/src/components/IconsFont/fonts/welcome-icon-font.svg b/lib/src/components/IconsFont/fonts/welcome-icon-font.svg new file mode 100644 index 0000000000..4d61bcf537 --- /dev/null +++ b/lib/src/components/IconsFont/fonts/welcome-icon-font.svg @@ -0,0 +1,1806 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/lib/src/components/IconsFont/fonts/welcome-icon-font.ttf b/lib/src/components/IconsFont/fonts/welcome-icon-font.ttf new file mode 100644 index 0000000000..2d549341e6 Binary files /dev/null and b/lib/src/components/IconsFont/fonts/welcome-icon-font.ttf differ diff --git a/lib/src/components/IconsFont/fonts/welcome-icon-font.woff b/lib/src/components/IconsFont/fonts/welcome-icon-font.woff new file mode 100644 index 0000000000..67e5cc9a89 Binary files /dev/null and b/lib/src/components/IconsFont/fonts/welcome-icon-font.woff differ diff --git a/lib/src/components/IconsFont/fonts/welcome-icon-font.woff2 b/lib/src/components/IconsFont/fonts/welcome-icon-font.woff2 new file mode 100644 index 0000000000..6fdbabc189 Binary files /dev/null and b/lib/src/components/IconsFont/fonts/welcome-icon-font.woff2 differ diff --git a/lib/src/components/IconsFont/index.tsx b/lib/src/components/IconsFont/index.tsx new file mode 100644 index 0000000000..7674ed8905 --- /dev/null +++ b/lib/src/components/IconsFont/index.tsx @@ -0,0 +1,47 @@ +import React from 'react' + +import { Icon, StyledIconProps } from './styles' +import unicodeJson from './unicode.json' + +import { IconProps } from '@/Icon' + +export type IconsFontProps = StyledIconProps +export const IconsFontStyled = Icon + +type FormatIconJSX = S extends `${infer F}${infer R}` + ? F extends '_' + ? FormatIconJSX> + : `${F}${FormatIconJSX}` + : '' + +// this is usefull to add the keys on the declaration file +const unicodeMap = { ...unicodeJson } + +export type IconKey = keyof typeof unicodeMap +export type IconKeyFormatted = FormatIconJSX> +export type IconsType = Record JSX.Element> + +const toPascalCase = (str: string) => { + const camelCase = str.replace(/_(\w)/g, ($, $1) => $1.toUpperCase()) + return `${camelCase.charAt(0).toUpperCase()}${camelCase.substr(1)}` +} + +const iconsKeys = Object.keys(unicodeMap) as IconKey[] + +export const IconsFont = iconsKeys.reduce((prev, name) => { + const key = toPascalCase(name) as IconKeyFormatted + + prev[key] = (props: IconProps) => { + const className = props.className || '' + return ( + + ) + } + + return prev +}, {} as IconsType) diff --git a/lib/src/components/IconsFont/styles.ts b/lib/src/components/IconsFont/styles.ts new file mode 100644 index 0000000000..09badf951d --- /dev/null +++ b/lib/src/components/IconsFont/styles.ts @@ -0,0 +1,38 @@ +import styled, { css, system, th } from '@xstyled/styled-components' + +import unicodeMap from './unicode.json' + +import { IconOptions } from '@/Icon' + +export type StyledIconProps = { + name: keyof typeof unicodeMap + size: IconOptions['size'] +} + +function getIconContentByName(name: StyledIconProps['name']) { + const content = unicodeMap[name] + if (content) return content.replace('0x', '\\') + // eslint-disable-next-line no-console + console.warn(`Invalid icon name '${name}'`) + return null +} + +export const Icon = styled.i( + ({ name, size = 'md' }) => css` + display: inline-block; + /* stylelint-disable-next-line font-family-no-missing-generic-family-keyword */ + font-family: icons; + font-size: ${th(`icons.${size}`)}; + ${system}; + &::before { + content: '${getIconContentByName(name)}'; + display: block; + font-style: normal; + font-variant: normal; + text-transform: none; + line-height: 1; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + } + ` +) diff --git a/lib/src/components/IconsFont/tests/index.test.tsx b/lib/src/components/IconsFont/tests/index.test.tsx new file mode 100644 index 0000000000..1c43c56878 --- /dev/null +++ b/lib/src/components/IconsFont/tests/index.test.tsx @@ -0,0 +1,15 @@ +import React from 'react' + +import { render } from '../../../../tests' +import { IconsFont } from '../' + +describe('', () => { + it('should render correctly with existing icon name', () => { + const consoleWarnMock = jest.spyOn(console, 'warn').mockImplementation() + const { container } = render() + expect(container).toBeTruthy() + // eslint-disable-next-line no-console + expect(console.warn).not.toBeCalled() + consoleWarnMock.mockRestore() + }) +}) diff --git a/packages/IconFont/src/unicode.json b/lib/src/components/IconsFont/unicode.json similarity index 100% rename from packages/IconFont/src/unicode.json rename to lib/src/components/IconsFont/unicode.json diff --git a/lib/src/components/InputText/docs/examples/clearable.tsx b/lib/src/components/InputText/docs/examples/clearable.tsx new file mode 100644 index 0000000000..5879e16583 --- /dev/null +++ b/lib/src/components/InputText/docs/examples/clearable.tsx @@ -0,0 +1,9 @@ +import * as React from 'react' + +import { InputText } from '@/InputText' + +const Example = () => { + return +} + +export default Example diff --git a/lib/src/components/InputText/docs/examples/disabled.tsx b/lib/src/components/InputText/docs/examples/disabled.tsx new file mode 100644 index 0000000000..53e6fee1d7 --- /dev/null +++ b/lib/src/components/InputText/docs/examples/disabled.tsx @@ -0,0 +1,9 @@ +import * as React from 'react' + +import { InputText } from '@/InputText' + +const Example = () => { + return +} + +export default Example diff --git a/lib/src/components/InputText/docs/examples/hint.tsx b/lib/src/components/InputText/docs/examples/hint.tsx new file mode 100644 index 0000000000..7b9f0ba80f --- /dev/null +++ b/lib/src/components/InputText/docs/examples/hint.tsx @@ -0,0 +1,14 @@ +import * as React from 'react' + +import { InputText } from '@/InputText' +import { Field } from '@/Field' + +const Example = () => { + return ( + + + + ) +} + +export default Example diff --git a/lib/src/components/InputText/docs/examples/icon.tsx b/lib/src/components/InputText/docs/examples/icon.tsx new file mode 100644 index 0000000000..efdd3e4116 --- /dev/null +++ b/lib/src/components/InputText/docs/examples/icon.tsx @@ -0,0 +1,22 @@ +import * as React from 'react' + +import { InputText } from '@/InputText' +import { AvatarIcon } from '@/Icons' + +const Example = () => { + return ( + <> + } placeholder="Welcome" /> + } iconPlacement="right" placeholder="Welcome" /> + } + iconPlacement="right" + isClearable + placeholder="Welcome" + size="xs" + /> + + ) +} + +export default Example diff --git a/lib/src/components/InputText/docs/examples/label.tsx b/lib/src/components/InputText/docs/examples/label.tsx new file mode 100644 index 0000000000..6cf7ab5b2d --- /dev/null +++ b/lib/src/components/InputText/docs/examples/label.tsx @@ -0,0 +1,14 @@ +import * as React from 'react' + +import { InputText } from '@/InputText' +import { Field } from '@/Field' + +const Example = () => { + return ( + + + + ) +} + +export default Example diff --git a/lib/src/components/InputText/docs/examples/overview.tsx b/lib/src/components/InputText/docs/examples/overview.tsx new file mode 100644 index 0000000000..b761e911a1 --- /dev/null +++ b/lib/src/components/InputText/docs/examples/overview.tsx @@ -0,0 +1,9 @@ +import * as React from 'react' + +import { InputText } from '@/InputText' + +const Example = () => { + return +} + +export default Example diff --git a/lib/src/components/InputText/docs/examples/required.tsx b/lib/src/components/InputText/docs/examples/required.tsx new file mode 100644 index 0000000000..f5c55d93d8 --- /dev/null +++ b/lib/src/components/InputText/docs/examples/required.tsx @@ -0,0 +1,14 @@ +import * as React from 'react' + +import { InputText } from '@/InputText' +import { Field } from '@/Field' + +const Example = () => { + return ( + + + + ) +} + +export default Example diff --git a/lib/src/components/InputText/docs/examples/sizes.tsx b/lib/src/components/InputText/docs/examples/sizes.tsx new file mode 100644 index 0000000000..ce70cc9cc5 --- /dev/null +++ b/lib/src/components/InputText/docs/examples/sizes.tsx @@ -0,0 +1,17 @@ +import * as React from 'react' + +import { InputText } from '@/InputText' +import { AvatarIcon } from '@/Icons' + +const Example = () => { + return ( + <> + } placeholder="Welcome" size="xs" /> + } placeholder="Welcome" size="sm" /> + } placeholder="Welcome" /> + } placeholder="Welcome" size="lg" /> + + ) +} + +export default Example diff --git a/lib/src/components/InputText/docs/examples/transparent.tsx b/lib/src/components/InputText/docs/examples/transparent.tsx new file mode 100644 index 0000000000..bc51de9c87 --- /dev/null +++ b/lib/src/components/InputText/docs/examples/transparent.tsx @@ -0,0 +1,10 @@ +import * as React from 'react' + +import { InputText } from '@/InputText' +import { AvatarIcon } from '@/Icons' + +const Example = () => { + return } placeholder="Welcome" transparent /> +} + +export default Example diff --git a/lib/src/components/InputText/docs/examples/variants.tsx b/lib/src/components/InputText/docs/examples/variants.tsx new file mode 100644 index 0000000000..11914d4164 --- /dev/null +++ b/lib/src/components/InputText/docs/examples/variants.tsx @@ -0,0 +1,25 @@ +import * as React from 'react' + +import { InputText } from '@/InputText' +import { Field } from '@/Field' + +const Example = () => { + return ( + <> + + + + + + + + + + + + + + ) +} + +export default Example diff --git a/packages/InputText/docs/index.mdx b/lib/src/components/InputText/docs/index.mdx similarity index 100% rename from packages/InputText/docs/index.mdx rename to lib/src/components/InputText/docs/index.mdx diff --git a/lib/src/components/InputText/docs/properties.json b/lib/src/components/InputText/docs/properties.json new file mode 100644 index 0000000000..8bc34d666c --- /dev/null +++ b/lib/src/components/InputText/docs/properties.json @@ -0,0 +1,321 @@ +{ + "InputText": { + "props": { + "autoFocus": { + "defaultValue": null, + "description": "", + "name": "autoFocus", + "parent": { + "fileName": "welcome-ui/lib/src/components/InputText/index.tsx", + "name": "InputTextOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/InputText/index.tsx", + "name": "InputTextOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "disabled": { + "defaultValue": null, + "description": "", + "name": "disabled", + "parent": { + "fileName": "welcome-ui/lib/src/components/InputText/index.tsx", + "name": "InputTextOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/InputText/index.tsx", + "name": "InputTextOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "icon": { + "defaultValue": null, + "description": "", + "name": "icon", + "parent": { + "fileName": "welcome-ui/lib/src/components/InputText/index.tsx", + "name": "InputTextOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/InputText/index.tsx", + "name": "InputTextOptions" + } + ], + "required": false, + "type": { + "name": "Element" + } + }, + "iconPlacement": { + "defaultValue": { + "value": "left" + }, + "description": "", + "name": "iconPlacement", + "parent": { + "fileName": "welcome-ui/lib/src/components/InputText/index.tsx", + "name": "InputTextOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/InputText/index.tsx", + "name": "InputTextOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "\"right\" | \"left\"", + "value": [ + { + "value": "\"right\"" + }, + { + "value": "\"left\"" + } + ] + } + }, + "isClearable": { + "defaultValue": null, + "description": "", + "name": "isClearable", + "parent": { + "fileName": "welcome-ui/lib/src/components/InputText/index.tsx", + "name": "InputTextOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/InputText/index.tsx", + "name": "InputTextOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "name": { + "defaultValue": null, + "description": "", + "name": "name", + "parent": { + "fileName": "welcome-ui/lib/src/components/InputText/index.tsx", + "name": "InputTextOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/InputText/index.tsx", + "name": "InputTextOptions" + } + ], + "required": false, + "type": { + "name": "string" + } + }, + "onBlur": { + "defaultValue": null, + "description": "", + "name": "onBlur", + "parent": { + "fileName": "welcome-ui/lib/src/components/InputText/index.tsx", + "name": "InputTextOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/InputText/index.tsx", + "name": "InputTextOptions" + } + ], + "required": false, + "type": { + "name": "(event: FocusEvent) => void" + } + }, + "onChange": { + "defaultValue": null, + "description": "", + "name": "onChange", + "parent": { + "fileName": "welcome-ui/lib/src/components/InputText/index.tsx", + "name": "InputTextOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/InputText/index.tsx", + "name": "InputTextOptions" + } + ], + "required": false, + "type": { + "name": "(event: ChangeEvent) => void" + } + }, + "onFocus": { + "defaultValue": null, + "description": "", + "name": "onFocus", + "parent": { + "fileName": "welcome-ui/lib/src/components/InputText/index.tsx", + "name": "InputTextOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/InputText/index.tsx", + "name": "InputTextOptions" + } + ], + "required": false, + "type": { + "name": "(event: FocusEvent) => void" + } + }, + "onKeyDown": { + "defaultValue": null, + "description": "", + "name": "onKeyDown", + "parent": { + "fileName": "welcome-ui/lib/src/components/InputText/index.tsx", + "name": "InputTextOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/InputText/index.tsx", + "name": "InputTextOptions" + } + ], + "required": false, + "type": { + "name": "(event: KeyboardEvent) => void" + } + }, + "placeholder": { + "defaultValue": null, + "description": "", + "name": "placeholder", + "parent": { + "fileName": "welcome-ui/lib/src/components/InputText/index.tsx", + "name": "InputTextOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/InputText/index.tsx", + "name": "InputTextOptions" + } + ], + "required": false, + "type": { + "name": "string" + } + }, + "transparent": { + "defaultValue": null, + "description": "", + "name": "transparent", + "parent": { + "fileName": "welcome-ui/lib/src/components/InputText/index.tsx", + "name": "InputTextOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/InputText/index.tsx", + "name": "InputTextOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "type": { + "defaultValue": { + "value": "text" + }, + "description": "", + "name": "type", + "parent": { + "fileName": "welcome-ui/lib/src/components/InputText/index.tsx", + "name": "InputTextOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/InputText/index.tsx", + "name": "InputTextOptions" + } + ], + "required": false, + "type": { + "name": "string" + } + }, + "value": { + "defaultValue": null, + "description": "", + "name": "value", + "parent": { + "fileName": "welcome-ui/lib/src/components/InputText/index.tsx", + "name": "InputTextOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/InputText/index.tsx", + "name": "InputTextOptions" + } + ], + "required": false, + "type": { + "name": "string" + } + } + } + } +} \ No newline at end of file diff --git a/lib/src/components/InputText/index.tsx b/lib/src/components/InputText/index.tsx new file mode 100644 index 0000000000..e3c40a6a23 --- /dev/null +++ b/lib/src/components/InputText/index.tsx @@ -0,0 +1,107 @@ +import React from 'react' + +import { DefaultFieldStylesProps, FIELD_ICON_SIZE } from '../../utils/field-styles' +import { createEvent } from '../../utils/create-event' + +import * as S from './styles' + +import { CreateWuiProps, forwardRef } from '@/System' +import { ClearButton } from '@/ClearButton' +import { IconGroupWrapper, IconWrapper } from '@/Field' + +export interface InputTextOptions extends DefaultFieldStylesProps { + autoFocus?: boolean + disabled?: boolean + icon?: JSX.Element + iconPlacement?: 'left' | 'right' + isClearable?: boolean + name?: string + onBlur?: (event: React.FocusEvent) => void + onChange?: (event: React.ChangeEvent) => void + onFocus?: (event: React.FocusEvent) => void + onKeyDown?: (event: React.KeyboardEvent) => void + placeholder?: string + transparent?: boolean + type?: string + value?: string +} + +export type InputTextProps = CreateWuiProps<'input', InputTextOptions> + +export const InputText = forwardRef<'input', InputTextProps>( + ( + { + autoFocus, + dataTestId, + disabled, + icon, + iconPlacement = 'left', + isClearable, + name, + onBlur, + onChange, + onFocus, + onKeyDown, + placeholder, + size = 'md', + transparent, + type = 'text', + value, + variant, + ...rest + }, + ref + ) => { + const hasClearButtonAndRightIcon = isClearable && iconPlacement === 'right' + const hasIcon = icon && iconPlacement + const iconSize = FIELD_ICON_SIZE[size] + + const handleReset = () => { + const event = createEvent({ + name, + value: '', + }) as unknown as React.ChangeEvent + onChange && onChange(event) + } + + return ( + + + {hasIcon && !hasClearButtonAndRightIcon && ( + + {React.cloneElement(icon, { ...icon.props, size: iconSize })} + + )} + {isClearable && ( + + {value && } + {iconPlacement === 'right' && + React.cloneElement(icon, { ...icon.props, size: iconSize })} + + )} + + ) + } +) + +InputText.displayName = 'InputText' diff --git a/lib/src/components/InputText/styles.ts b/lib/src/components/InputText/styles.ts new file mode 100644 index 0000000000..3e39fd2dae --- /dev/null +++ b/lib/src/components/InputText/styles.ts @@ -0,0 +1,28 @@ +import styled, { css, system } from '@xstyled/styled-components' + +import { defaultFieldStyles } from '../../utils/field-styles' + +import { InputTextOptions } from './index' + +import { shouldForwardProp } from '@/System' + +export const InputText = styled('input').withConfig({ shouldForwardProp })< + Pick +>( + ({ iconPlacement, isClearable, size, transparent, variant }) => css` + ${defaultFieldStyles({ + size, + variant, + transparent, + isClearable, + iconPlacement, + })}; + text-overflow: ellipsis; + + ${system}; + ` +) + +export const Wrapper = styled.div` + position: relative; +` diff --git a/lib/src/components/InputText/tests/index.test.tsx b/lib/src/components/InputText/tests/index.test.tsx new file mode 100644 index 0000000000..055715f49d --- /dev/null +++ b/lib/src/components/InputText/tests/index.test.tsx @@ -0,0 +1,49 @@ +import React, { useState } from 'react' +import { act, screen } from '@testing-library/react' + +import { InputText, InputTextOptions } from '../' +import { render } from '../../../../tests' + +const InputTextWrapper: React.FC = props => { + const [value, setValue] = useState('test') + + const handleChange = (event: React.ChangeEvent) => { + setValue(event.target.value) + } + + return ( + + ) +} + +test(' displays given value', () => { + const { getByTestId } = render() + + const input = getByTestId('input') as HTMLInputElement + expect(input.value).toBe('test') +}) + +test(" can't remove value", () => { + const { getByTestId, queryByRole } = render() + + const input = getByTestId('input') as HTMLInputElement + + // Use `queryByTitle` to expect no close button + const clearButton = queryByRole('button') + expect(clearButton).toBeNull() + + expect(input.value).toBe('test') +}) + +test(' can remove value', async () => { + const { user } = render() + + const input = screen.getByTestId('input') as HTMLInputElement + expect(input.value).toBe('test') + + const clearButton = screen.getByRole('button') + + await act(() => user.click(clearButton)) + + expect(input.value).toBe('') +}) diff --git a/lib/src/components/Label/docs/examples/disabled.tsx b/lib/src/components/Label/docs/examples/disabled.tsx new file mode 100644 index 0000000000..f15db47277 --- /dev/null +++ b/lib/src/components/Label/docs/examples/disabled.tsx @@ -0,0 +1,17 @@ +import * as React from 'react' + +import { Label } from '@/Label' +import { Stack } from '@/Stack' + +const Example = () => { + return ( + + + + + ) +} + +export default Example diff --git a/lib/src/components/Label/docs/examples/example.tsx b/lib/src/components/Label/docs/examples/example.tsx new file mode 100644 index 0000000000..3e89cfba3e --- /dev/null +++ b/lib/src/components/Label/docs/examples/example.tsx @@ -0,0 +1,24 @@ +import * as React from 'react' + +import { Label } from '@/Label' +import { Checkbox } from '@/Checkbox' +import { Link } from '@/Link' + +const Example = () => { + const [checked, setChecked] = React.useState(false) + + const handleToggle = () => setChecked(!checked) + + return ( + + ) +} + +export default Example diff --git a/lib/src/components/Label/docs/examples/overview.tsx b/lib/src/components/Label/docs/examples/overview.tsx new file mode 100644 index 0000000000..ef98a0d16e --- /dev/null +++ b/lib/src/components/Label/docs/examples/overview.tsx @@ -0,0 +1,9 @@ +import * as React from 'react' + +import { Label } from '@/Label' + +const Example = () => { + return +} + +export default Example diff --git a/lib/src/components/Label/docs/examples/required.tsx b/lib/src/components/Label/docs/examples/required.tsx new file mode 100644 index 0000000000..21546d30e4 --- /dev/null +++ b/lib/src/components/Label/docs/examples/required.tsx @@ -0,0 +1,9 @@ +import * as React from 'react' + +import { Label } from '@/Label' + +const Example = () => { + return +} + +export default Example diff --git a/lib/src/components/Label/docs/examples/variants.tsx b/lib/src/components/Label/docs/examples/variants.tsx new file mode 100644 index 0000000000..3025ef826b --- /dev/null +++ b/lib/src/components/Label/docs/examples/variants.tsx @@ -0,0 +1,16 @@ +import * as React from 'react' + +import { Label } from '@/Label' +import { Stack } from '@/Stack' + +const Example = () => { + return ( + + + + + + ) +} + +export default Example diff --git a/packages/Label/docs/index.mdx b/lib/src/components/Label/docs/index.mdx similarity index 100% rename from packages/Label/docs/index.mdx rename to lib/src/components/Label/docs/index.mdx diff --git a/lib/src/components/Label/docs/properties.json b/lib/src/components/Label/docs/properties.json new file mode 100644 index 0000000000..e12a8388a4 --- /dev/null +++ b/lib/src/components/Label/docs/properties.json @@ -0,0 +1,208 @@ +{ + "Label": { + "props": { + "checkableField": { + "defaultValue": null, + "description": "", + "name": "checkableField", + "parent": { + "fileName": "welcome-ui/lib/src/components/Label/index.tsx", + "name": "LabelOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Label/index.tsx", + "name": "LabelOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "disabled": { + "defaultValue": null, + "description": "", + "name": "disabled", + "parent": { + "fileName": "welcome-ui/lib/src/components/Label/index.tsx", + "name": "LabelOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Label/index.tsx", + "name": "LabelOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "disabledIcon": { + "defaultValue": null, + "description": "", + "name": "disabledIcon", + "parent": { + "fileName": "welcome-ui/lib/src/components/Label/index.tsx", + "name": "LabelOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Label/index.tsx", + "name": "LabelOptions" + } + ], + "required": false, + "type": { + "name": "Element" + } + }, + "htmlFor": { + "defaultValue": null, + "description": "", + "name": "htmlFor", + "parent": { + "fileName": "welcome-ui/lib/src/components/Label/index.tsx", + "name": "LabelOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Label/index.tsx", + "name": "LabelOptions" + } + ], + "required": false, + "type": { + "name": "string" + } + }, + "icon": { + "defaultValue": null, + "description": "", + "name": "icon", + "parent": { + "fileName": "welcome-ui/lib/src/components/Label/index.tsx", + "name": "LabelOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Label/index.tsx", + "name": "LabelOptions" + } + ], + "required": false, + "type": { + "name": "Element" + } + }, + "required": { + "defaultValue": null, + "description": "", + "name": "required", + "parent": { + "fileName": "welcome-ui/lib/src/components/Label/index.tsx", + "name": "LabelOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Label/index.tsx", + "name": "LabelOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + }, + "variant": { + "defaultValue": null, + "description": "", + "name": "variant", + "parent": { + "fileName": "welcome-ui/lib/src/components/Label/index.tsx", + "name": "LabelOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Label/index.tsx", + "name": "LabelOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "\"success\" | \"danger\" | \"warning\"", + "value": [ + { + "value": "\"success\"" + }, + { + "value": "\"danger\"" + }, + { + "value": "\"warning\"" + } + ] + } + }, + "withDisabledIcon": { + "defaultValue": { + "value": true + }, + "description": "", + "name": "withDisabledIcon", + "parent": { + "fileName": "welcome-ui/lib/src/components/Label/index.tsx", + "name": "LabelOptions" + }, + "declarations": [ + { + "fileName": "welcome-ui/lib/src/components/Label/index.tsx", + "name": "LabelOptions" + } + ], + "required": false, + "type": { + "name": "enum", + "raw": "boolean", + "value": [ + { + "value": "false" + }, + { + "value": "true" + } + ] + } + } + } + } +} \ No newline at end of file diff --git a/lib/src/components/Label/index.tsx b/lib/src/components/Label/index.tsx new file mode 100644 index 0000000000..a0a19b3607 --- /dev/null +++ b/lib/src/components/Label/index.tsx @@ -0,0 +1,63 @@ +import React from 'react' + +import { wrapChildren } from '../../utils/wrap-children' + +import * as S from './styles' + +import { LockIcon } from '@/Icons' +import { VariantIcon } from '@/VariantIcon' +import { CreateWuiProps, forwardRef } from '@/System' + +export interface LabelOptions { + checkableField?: boolean + disabled?: boolean + disabledIcon?: JSX.Element + htmlFor?: string + icon?: JSX.Element + required?: boolean + variant?: 'success' | 'danger' | 'warning' + withDisabledIcon?: boolean +} + +export type LabelProps = CreateWuiProps<'label', LabelOptions> + +export const Label = forwardRef<'label', LabelProps>( + ( + { + checkableField, + children, + dataTestId, + disabled, + disabledIcon, + icon, + variant, + withDisabledIcon = true, + ...rest + }, + ref + ) => { + // Wrap strings in span to allow for required asterisk + const content = wrapChildren(children as JSX.Element) + + return ( + + {!checkableField && } + {disabled && withDisabledIcon && ( + {disabledIcon || } + )} + {content} + + ) + } +) + +Label.displayName = 'Label' + +export const StyledLabel = S.Label diff --git a/lib/src/components/Label/styles.ts b/lib/src/components/Label/styles.ts new file mode 100644 index 0000000000..5ac77a2020 --- /dev/null +++ b/lib/src/components/Label/styles.ts @@ -0,0 +1,47 @@ +import styled, { css, system, th } from '@xstyled/styled-components' + +import { shouldForwardProp } from '@/System' + +export const Label = styled('label').withConfig({ shouldForwardProp })<{ + required: boolean +}>( + ({ required }) => css` + position: relative; + display: flex; + flex-shrink: 0; + max-width: 100%; + align-items: center; + line-height: lg; + ${th('labels')}; + ${system}; + user-select: none; + + > * { + &:not(:last-child) { + margin-right: sm; + } + + :last-child { + ${required && requiredStyles}; + } + } + ` +) + +export const requiredStyles = css` + &::after { + content: '*'; + margin-left: xs; + /* It prevents the element to shift the layout and it allows us to put it properly on top with super */ + line-height: 0; + vertical-align: super; + font-size: subtitle-sm; + font-weight: bold; + color: primary-40; + } +` + +export const Disabled = styled.div` + display: inline-flex; + margin-right: xs; +` diff --git a/lib/src/components/Label/tests/index.test.tsx b/lib/src/components/Label/tests/index.test.tsx new file mode 100644 index 0000000000..61e6e29f70 --- /dev/null +++ b/lib/src/components/Label/tests/index.test.tsx @@ -0,0 +1,59 @@ +import React from 'react' + +import { Label } from '../' +import { render } from '../../../../tests' + +const content = 'Jungle' + +describe('