@1024pix/pix-ui 11.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (196) hide show
  1. package/.buildpacks +2 -0
  2. package/.circleci/config.yml +22 -0
  3. package/.gitattributes +7 -0
  4. package/.github/workflows/auto-merge.yml +26 -0
  5. package/.github/workflows/deploy-storybook.yml +21 -0
  6. package/.github/workflows/npm-publish.yml +23 -0
  7. package/.github/workflows/on-dev-merge.yml +33 -0
  8. package/.nvmrc +1 -0
  9. package/.prettierignore +1 -0
  10. package/.prettierrc.json +12 -0
  11. package/.storybook/fonts.css +1 -0
  12. package/.storybook/main.js +10 -0
  13. package/.storybook/manager.js +6 -0
  14. package/.storybook/preview.js +37 -0
  15. package/.storybook/storybook-custom-theme.js +37 -0
  16. package/CHANGELOG.md +469 -0
  17. package/CNAME +1 -0
  18. package/LICENSE.md +9 -0
  19. package/README.md +58 -0
  20. package/addon/components/pix-background-header.hbs +7 -0
  21. package/addon/components/pix-background-header.js +5 -0
  22. package/addon/components/pix-banner.hbs +16 -0
  23. package/addon/components/pix-banner.js +43 -0
  24. package/addon/components/pix-block.hbs +5 -0
  25. package/addon/components/pix-block.js +11 -0
  26. package/addon/components/pix-button-base.js +27 -0
  27. package/addon/components/pix-button-link.hbs +16 -0
  28. package/addon/components/pix-button-link.js +10 -0
  29. package/addon/components/pix-button-upload.hbs +11 -0
  30. package/addon/components/pix-button-upload.js +20 -0
  31. package/addon/components/pix-button.hbs +43 -0
  32. package/addon/components/pix-button.js +54 -0
  33. package/addon/components/pix-collapsible.hbs +29 -0
  34. package/addon/components/pix-collapsible.js +27 -0
  35. package/addon/components/pix-filter-banner.hbs +28 -0
  36. package/addon/components/pix-filter-banner.js +13 -0
  37. package/addon/components/pix-icon-button.hbs +11 -0
  38. package/addon/components/pix-icon-button.js +33 -0
  39. package/addon/components/pix-input-code.hbs +24 -0
  40. package/addon/components/pix-input-code.js +133 -0
  41. package/addon/components/pix-input-password.hbs +43 -0
  42. package/addon/components/pix-input-password.js +34 -0
  43. package/addon/components/pix-input.hbs +30 -0
  44. package/addon/components/pix-input.js +26 -0
  45. package/addon/components/pix-message.hbs +8 -0
  46. package/addon/components/pix-message.js +30 -0
  47. package/addon/components/pix-multi-select.hbs +70 -0
  48. package/addon/components/pix-multi-select.js +162 -0
  49. package/addon/components/pix-progress-gauge.hbs +19 -0
  50. package/addon/components/pix-progress-gauge.js +29 -0
  51. package/addon/components/pix-radio-button.hbs +12 -0
  52. package/addon/components/pix-radio-button.js +5 -0
  53. package/addon/components/pix-return-to.hbs +15 -0
  54. package/addon/components/pix-return-to.js +20 -0
  55. package/addon/components/pix-select.hbs +55 -0
  56. package/addon/components/pix-select.js +58 -0
  57. package/addon/components/pix-selectable-tag.hbs +10 -0
  58. package/addon/components/pix-selectable-tag.js +13 -0
  59. package/addon/components/pix-stars.hbs +16 -0
  60. package/addon/components/pix-stars.js +27 -0
  61. package/addon/components/pix-tag.hbs +3 -0
  62. package/addon/components/pix-tag.js +11 -0
  63. package/addon/components/pix-textarea.hbs +21 -0
  64. package/addon/components/pix-textarea.js +17 -0
  65. package/addon/components/pix-tooltip-deprecated.hbs +18 -0
  66. package/addon/components/pix-tooltip-deprecated.js +26 -0
  67. package/addon/components/pix-tooltip.hbs +18 -0
  68. package/addon/components/pix-tooltip.js +17 -0
  69. package/addon/styles/_breakpoints.scss +17 -0
  70. package/addon/styles/_colors.scss +87 -0
  71. package/addon/styles/_fonts.scss +10 -0
  72. package/addon/styles/_form.scss +68 -0
  73. package/addon/styles/_pix-background-header.scss +20 -0
  74. package/addon/styles/_pix-banner.scss +67 -0
  75. package/addon/styles/_pix-block.scss +29 -0
  76. package/addon/styles/_pix-button-base.scss +137 -0
  77. package/addon/styles/_pix-button-link.scss +4 -0
  78. package/addon/styles/_pix-button-upload.scss +5 -0
  79. package/addon/styles/_pix-button.scss +40 -0
  80. package/addon/styles/_pix-collapsible.scss +82 -0
  81. package/addon/styles/_pix-filter-banner.scss +74 -0
  82. package/addon/styles/_pix-icon-button.scss +60 -0
  83. package/addon/styles/_pix-input-code.scss +71 -0
  84. package/addon/styles/_pix-input-password.scss +68 -0
  85. package/addon/styles/_pix-input.scss +93 -0
  86. package/addon/styles/_pix-message.scss +35 -0
  87. package/addon/styles/_pix-multi-select.scss +182 -0
  88. package/addon/styles/_pix-progress-gauge.scss +119 -0
  89. package/addon/styles/_pix-radio-button.scss +72 -0
  90. package/addon/styles/_pix-return-to.scss +64 -0
  91. package/addon/styles/_pix-select.scss +71 -0
  92. package/addon/styles/_pix-selectable-tag.scss +86 -0
  93. package/addon/styles/_pix-stars.scss +43 -0
  94. package/addon/styles/_pix-tag.scss +69 -0
  95. package/addon/styles/_pix-textarea.scss +39 -0
  96. package/addon/styles/_pix-tooltip.scss +196 -0
  97. package/addon/styles/_reset-css.scss +36 -0
  98. package/addon/styles/_spacing.scss +9 -0
  99. package/addon/styles/addon.scss +41 -0
  100. package/app/components/pix-background-header.js +1 -0
  101. package/app/components/pix-banner.js +1 -0
  102. package/app/components/pix-block.js +1 -0
  103. package/app/components/pix-button-link.js +1 -0
  104. package/app/components/pix-button-upload.js +1 -0
  105. package/app/components/pix-button.js +1 -0
  106. package/app/components/pix-collapsible.js +1 -0
  107. package/app/components/pix-filter-banner.js +1 -0
  108. package/app/components/pix-icon-button.js +1 -0
  109. package/app/components/pix-input-code.js +1 -0
  110. package/app/components/pix-input-password.js +1 -0
  111. package/app/components/pix-input.js +1 -0
  112. package/app/components/pix-message.js +1 -0
  113. package/app/components/pix-multi-select.js +1 -0
  114. package/app/components/pix-progress-gauge.js +1 -0
  115. package/app/components/pix-radio-button.js +1 -0
  116. package/app/components/pix-return-to.js +1 -0
  117. package/app/components/pix-select.js +1 -0
  118. package/app/components/pix-selectable-tag.js +1 -0
  119. package/app/components/pix-stars.js +1 -0
  120. package/app/components/pix-tag.js +1 -0
  121. package/app/components/pix-textarea.js +1 -0
  122. package/app/components/pix-tooltip-deprecated.js +1 -0
  123. package/app/components/pix-tooltip.js +1 -0
  124. package/app/stories/form.stories.js +91 -0
  125. package/app/stories/form.stories.mdx +16 -0
  126. package/app/stories/pix-background-header.stories.js +19 -0
  127. package/app/stories/pix-background-header.stories.mdx +36 -0
  128. package/app/stories/pix-banner.stories.js +89 -0
  129. package/app/stories/pix-banner.stories.mdx +107 -0
  130. package/app/stories/pix-block.stories.js +20 -0
  131. package/app/stories/pix-block.stories.mdx +44 -0
  132. package/app/stories/pix-button-link.stories.js +125 -0
  133. package/app/stories/pix-button-link.stories.mdx +57 -0
  134. package/app/stories/pix-button-upload.stories.js +85 -0
  135. package/app/stories/pix-button-upload.stories.mdx +39 -0
  136. package/app/stories/pix-button.stories.js +253 -0
  137. package/app/stories/pix-button.stories.mdx +99 -0
  138. package/app/stories/pix-collapsible.stories.js +56 -0
  139. package/app/stories/pix-collapsible.stories.mdx +39 -0
  140. package/app/stories/pix-filter-banner.stories.js +51 -0
  141. package/app/stories/pix-filter-banner.stories.mdx +33 -0
  142. package/app/stories/pix-icon-button.stories.js +95 -0
  143. package/app/stories/pix-icon-button.stories.mdx +90 -0
  144. package/app/stories/pix-input-code.stories.js +74 -0
  145. package/app/stories/pix-input-code.stories.mdx +46 -0
  146. package/app/stories/pix-input-password.stories.js +89 -0
  147. package/app/stories/pix-input-password.stories.mdx +69 -0
  148. package/app/stories/pix-input.stories.js +94 -0
  149. package/app/stories/pix-input.stories.mdx +57 -0
  150. package/app/stories/pix-message.stories.js +57 -0
  151. package/app/stories/pix-message.stories.mdx +71 -0
  152. package/app/stories/pix-multi-select.stories.js +199 -0
  153. package/app/stories/pix-multi-select.stories.mdx +55 -0
  154. package/app/stories/pix-progress-gauge.stories.js +78 -0
  155. package/app/stories/pix-progress-gauge.stories.mdx +43 -0
  156. package/app/stories/pix-radio-button.stories.js +71 -0
  157. package/app/stories/pix-radio-button.stories.mdx +49 -0
  158. package/app/stories/pix-return-to.stories.js +45 -0
  159. package/app/stories/pix-return-to.stories.mdx +41 -0
  160. package/app/stories/pix-select.stories.js +140 -0
  161. package/app/stories/pix-select.stories.mdx +57 -0
  162. package/app/stories/pix-selectable-tag.stories.js +91 -0
  163. package/app/stories/pix-selectable-tag.stories.mdx +55 -0
  164. package/app/stories/pix-stars.stories.js +43 -0
  165. package/app/stories/pix-stars.stories.mdx +35 -0
  166. package/app/stories/pix-tag.stories.js +56 -0
  167. package/app/stories/pix-tag.stories.mdx +46 -0
  168. package/app/stories/pix-textarea.stories.js +59 -0
  169. package/app/stories/pix-textarea.stories.mdx +36 -0
  170. package/app/stories/pix-tooltip-deprecated.stories.js +136 -0
  171. package/app/stories/pix-tooltip-deprecated.stories.mdx +143 -0
  172. package/app/stories/pix-tooltip.stories.js +157 -0
  173. package/app/stories/pix-tooltip.stories.mdx +183 -0
  174. package/app/styles/app.scss +0 -0
  175. package/config/environment.js +5 -0
  176. package/docs/architecture.stories.mdx +106 -0
  177. package/docs/assets/accessibility-storybook.png +0 -0
  178. package/docs/assets/screen-pix-storybook.png +0 -0
  179. package/docs/breaking-changes.stories.mdx +90 -0
  180. package/docs/changelog.stories.mdx +6 -0
  181. package/docs/create-component.stories.mdx +118 -0
  182. package/docs/design-system.stories.mdx +20 -0
  183. package/docs/good-practices-a11y.stories.mdx +48 -0
  184. package/docs/good-practices-design.stories.mdx +71 -0
  185. package/docs/good-practices-responsive.stories.mdx +51 -0
  186. package/docs/good-practices-style-css.stories.mdx +40 -0
  187. package/docs/good-practices-tests.stories.mdx +9 -0
  188. package/docs/make-a-release.stories.mdx +66 -0
  189. package/docs/pull_request_template.md +14 -0
  190. package/docs/storybook.stories.mdx +44 -0
  191. package/docs/use-component.stories.mdx +89 -0
  192. package/docs/use-install.stories.mdx +37 -0
  193. package/index.js +5 -0
  194. package/package.json +121 -0
  195. package/scalingo.json +17 -0
  196. package/servers.conf.erb +30 -0
package/.buildpacks ADDED
@@ -0,0 +1,2 @@
1
+ https://github.com/Scalingo/nodejs-buildpack
2
+ https://github.com/Scalingo/nginx-buildpack
@@ -0,0 +1,22 @@
1
+ version: 2.1
2
+
3
+ workflows:
4
+ version: 2
5
+ build-and-test:
6
+ jobs:
7
+ - build-and-test:
8
+ filters:
9
+ branches:
10
+ ignore:
11
+ - gh-pages
12
+
13
+ jobs:
14
+ build-and-test:
15
+ docker:
16
+ - image: circleci/node:12.14.0-browsers
17
+ steps:
18
+ - checkout
19
+ - run: npm ci
20
+ - run: npm run lint:js
21
+ - run: npm run lint:hbs
22
+ - run: npm test
package/.gitattributes ADDED
@@ -0,0 +1,7 @@
1
+ .circleci export-ignore
2
+ .gitattribute export-ignore
3
+ .github export-ignore
4
+ .editorconfig export-ignore
5
+ .gitattributes export-ignore
6
+ .gitignore export-ignore
7
+
@@ -0,0 +1,26 @@
1
+ name: automerge check
2
+
3
+ on:
4
+ pull_request:
5
+ types:
6
+ - labeled
7
+ check_suite:
8
+ types:
9
+ - completed
10
+
11
+ permissions: write-all
12
+
13
+ jobs:
14
+ automerge:
15
+ runs-on: ubuntu-latest
16
+ steps:
17
+ - name: automerge
18
+ uses: "pascalgn/automerge-action@v0.14.3"
19
+ env:
20
+ GITHUB_TOKEN: "${{ github.token }}"
21
+ MERGE_LABELS: ":rocket: Ready to Merge"
22
+ MERGE_COMMIT_MESSAGE: "pull-request-title"
23
+ UPDATE_LABELS: ":rocket: Ready to Merge"
24
+ UPDATE_METHOD: "rebase"
25
+ MERGE_FORKS: "false"
26
+ LOG: "TRACE"
@@ -0,0 +1,21 @@
1
+ name: Deploy Pix UI Storybook
2
+
3
+ on:
4
+ workflow_dispatch:
5
+ push:
6
+ tags:
7
+ - '*'
8
+
9
+ jobs:
10
+ deploy:
11
+ runs-on: ubuntu-latest
12
+ steps:
13
+ - uses: actions/checkout@v2
14
+ - uses: actions/setup-node@v1
15
+ with:
16
+ node-version: 14
17
+ - run: npm ci
18
+ - name: Deploy storybook to Github Pages
19
+ run: npm run deploy-storybook -- --ci
20
+ env:
21
+ GH_TOKEN: 1024pix:${{ secrets.GITHUB_TOKEN }}
@@ -0,0 +1,23 @@
1
+ # This workflow will run tests using node and then publish a package to GitHub Packages when a release is created
2
+ # For more information see: https://help.github.com/actions/language-and-framework-guides/publishing-nodejs-packages
3
+
4
+ name: Node.js Package
5
+
6
+ on:
7
+ push:
8
+ tags:
9
+ - '*'
10
+
11
+ jobs:
12
+ publish-npm:
13
+ runs-on: ubuntu-latest
14
+ steps:
15
+ - uses: actions/checkout@v2
16
+ - uses: actions/setup-node@v2
17
+ with:
18
+ node-version: '16'
19
+ check-latest: true
20
+ registry-url: https://registry.npmjs.org/
21
+ - run: npm publish --access public
22
+ env:
23
+ NODE_AUTH_TOKEN: ${{secrets.NPM_PUBLISH_ACCESS_TOKEN}}
@@ -0,0 +1,33 @@
1
+ name: Merge on Dev
2
+ on:
3
+ push:
4
+ branches:
5
+ - dev
6
+ jobs:
7
+ transition-issue:
8
+ name: Transition Issue
9
+ runs-on: ubuntu-latest
10
+ steps:
11
+ - name: Checkout
12
+ uses: actions/checkout@master
13
+
14
+ - name: Login
15
+ uses: atlassian/gajira-login@master
16
+ env:
17
+ JIRA_BASE_URL: ${{ secrets.JIRA_BASE_URL }}
18
+ JIRA_USER_EMAIL: ${{ secrets.JIRA_USER_EMAIL }}
19
+ JIRA_API_TOKEN: ${{ secrets.JIRA_API_TOKEN }}
20
+
21
+ - name: Find Issue Key
22
+ id: find
23
+ uses: atlassian/gajira-find-issue-key@master
24
+ continue-on-error: true
25
+ with:
26
+ from: commits
27
+
28
+ - name: Transition issue
29
+ uses: atlassian/gajira-transition@master
30
+ if: ${{ steps.find.outputs.issue }}
31
+ with:
32
+ issue: ${{ steps.find.outputs.issue }}
33
+ transition: "Move to 'Deployed in Integration'"
package/.nvmrc ADDED
@@ -0,0 +1 @@
1
+ 16.13.0
@@ -0,0 +1 @@
1
+ /blueprints/**
@@ -0,0 +1,12 @@
1
+ {
2
+ "printWidth": 100,
3
+ "singleQuote": true,
4
+ "overrides": [
5
+ {
6
+ "files": "*.hbs",
7
+ "options": {
8
+ "singleQuote": false
9
+ }
10
+ }
11
+ ]
12
+ }
@@ -0,0 +1 @@
1
+ @import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600;700&family=Roboto:wght@300;400;500;700;900&display=swap');
@@ -0,0 +1,10 @@
1
+ module.exports = {
2
+ addons: [
3
+ '@storybook/addon-essentials',
4
+ '@storybook/addon-a11y',
5
+ ],
6
+ stories: [
7
+ '../docs/**/*.stories.@(mdx)',
8
+ '../app/**/*.stories.@(js|mdx)',
9
+ ],
10
+ };
@@ -0,0 +1,6 @@
1
+ import addons from '@storybook/addons';
2
+ import storybookCustomTheme from './storybook-custom-theme';
3
+
4
+ addons.setConfig({
5
+ theme: storybookCustomTheme,
6
+ });
@@ -0,0 +1,37 @@
1
+ import './fonts.css';
2
+
3
+ export const parameters = {
4
+ a11y: {
5
+ element: '#root',
6
+ },
7
+ viewMode: 'docs',
8
+ docs: {
9
+ iframeHeight: 400,
10
+ transformSource: (src) => {
11
+ const match = /hbs`\s?([\s\S]*)`/g.exec(src);
12
+ return match ? match[1] : src;
13
+ },
14
+ },
15
+ controls: { expanded: true },
16
+ previewTabs: {
17
+ 'storybook/docs/panel': { index: -1 },
18
+ },
19
+ options: {
20
+ storySort: {
21
+ order: [
22
+ 'Utiliser Pix UI',
23
+ ['Installation', 'Utiliser un composant'],
24
+ 'Développement',
25
+ [
26
+ 'Design System',
27
+ 'Créer un composant',
28
+ 'Bonnes pratiques',
29
+ 'Breaking changes',
30
+ 'Faire une release',
31
+ 'Architecture',
32
+ 'Storybook'
33
+ ],
34
+ ],
35
+ },
36
+ },
37
+ };
@@ -0,0 +1,37 @@
1
+ import { create } from '@storybook/theming/create';
2
+
3
+ export default create({
4
+ base: 'light', // needed, this is not an optional parameter
5
+
6
+ colorPrimary: '#388AFF',
7
+ colorSecondary: '#388AFF',
8
+
9
+ // UI
10
+ appBg: '#F4F5F7', // background of the global app
11
+ appContentBg: 'white', // background of the component preview canvas
12
+ appBorderColor: 'white',
13
+ appBorderRadius: 4,
14
+
15
+ // Typography
16
+ fontBase: '"Open Sans", sans-serif',
17
+ fontCode: 'monospace',
18
+
19
+ // Text colors of the left menu
20
+ textColor: 'black',
21
+ textInverseColor: 'black',
22
+
23
+ // Toolbar default and active colors
24
+ barTextColor: 'white',
25
+ barSelectedColor: 'white', // Selected tab when multiple tabs
26
+ barBg: 'linear-gradient(135deg, #3D68FF 0%, #8845FF 100%)',
27
+
28
+ // Form colors
29
+ // inputBg: 'white',
30
+ // inputBorder: 'white',
31
+ // inputTextColor: 'white',
32
+ // inputBorderRadius: 4,
33
+
34
+ brandTitle: 'Pix',
35
+ brandUrl: 'https://pix.fr/',
36
+ brandImage: 'https://pix.fr/images/pix-logo.svg',
37
+ });