@royaloperahouse/chord 0.2.6-a → 0.3.3-RD-7154-font-setup-changes

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 (41) hide show
  1. package/CHANGELOG.md +15 -0
  2. package/README.md +75 -44
  3. package/dist/chord.cjs.development.js +927 -393
  4. package/dist/chord.cjs.development.js.map +1 -1
  5. package/dist/chord.cjs.production.min.js +1 -1
  6. package/dist/chord.cjs.production.min.js.map +1 -1
  7. package/dist/chord.esm.js +922 -394
  8. package/dist/chord.esm.js.map +1 -1
  9. package/dist/components/atoms/Progress/Progress.d.ts +4 -0
  10. package/dist/components/atoms/Progress/Progress.styles.d.ts +4 -0
  11. package/dist/components/atoms/Progress/index.d.ts +2 -0
  12. package/dist/components/atoms/TabLink/TabLink.d.ts +4 -0
  13. package/dist/components/atoms/TabLink/TabLink.style.d.ts +3 -0
  14. package/dist/components/atoms/TabLink/index.d.ts +2 -0
  15. package/dist/components/atoms/index.d.ts +3 -1
  16. package/dist/components/index.d.ts +4 -4
  17. package/dist/components/molecules/Accordion/Accordion.d.ts +4 -0
  18. package/dist/components/molecules/Accordion/Accordion.style.d.ts +5 -0
  19. package/dist/components/molecules/Accordion/index.d.ts +2 -0
  20. package/dist/components/molecules/Accordions/Accordions.d.ts +4 -0
  21. package/dist/components/molecules/Accordions/Accordions.style.d.ts +1 -0
  22. package/dist/components/molecules/Accordions/index.d.ts +2 -0
  23. package/dist/components/molecules/Card/Card.d.ts +4 -0
  24. package/dist/components/molecules/Card/Card.style.d.ts +8 -0
  25. package/dist/components/molecules/Card/index.d.ts +2 -0
  26. package/dist/components/molecules/Cards/Cards.d.ts +3 -0
  27. package/dist/components/molecules/Cards/Cards.style.d.ts +2 -0
  28. package/dist/components/molecules/Cards/index.d.ts +2 -0
  29. package/dist/components/molecules/index.d.ts +5 -1
  30. package/dist/components/organisms/AnchorTapBar/AnchorTapBar.d.ts +4 -0
  31. package/dist/components/organisms/AnchorTapBar/AnchorTapBar.style.d.ts +13 -0
  32. package/dist/components/organisms/AnchorTapBar/index.d.ts +2 -0
  33. package/dist/components/organisms/index.d.ts +2 -1
  34. package/dist/index.d.ts +2 -2
  35. package/dist/styles/themes.d.ts +72 -0
  36. package/dist/types/card.d.ts +45 -0
  37. package/dist/types/navigation.d.ts +87 -3
  38. package/dist/types/types.d.ts +30 -1
  39. package/package.json +4 -4
  40. package/README.GIT +0 -91
  41. package/dist/components/atoms/Image/Image.d.ts +0 -38
package/CHANGELOG.md ADDED
@@ -0,0 +1,15 @@
1
+ # CHANGELOG
2
+
3
+ ## [0.3.3 - BEING PREPARED]
4
+ - Added AnchorTapBar Component
5
+ - Added Accordion Component
6
+ - Added Card Component
7
+
8
+ ## [0.3.0]
9
+ - Design system project renamed and moved to chord
10
+
11
+ ## [0.2.0]
12
+ - public NPM Library
13
+
14
+ ## [0.1.0]
15
+ - Initial version
package/README.md CHANGED
@@ -1,68 +1,99 @@
1
- # Royal Opera House - chord
1
+ # Royal Opera House - Front End Design System
2
2
 
3
- Welcome to the Royal Opera House library components `@royaloperahouse/chord`.
3
+ Welcome to the Royal Opera House Front End Design System, `@royaloperahouse/chord`.
4
4
 
5
5
  This package is a library of UI components intended to be used in the ROH website.
6
6
 
7
+ It uses React, TypeScript, TSDX and Storybook.
7
8
 
8
- ## Install
9
+ ## Commands
10
+
11
+ The required package dependencies need to be insalled using `yarn`. Once ready you can issue the following:
12
+
13
+ To run Lint on the package use:
9
14
 
10
15
  ```bash
11
- npm i --save @royaloperahouse/chord
16
+ yarn lint # you can also use the --fix option to perform automatic fixes
12
17
  ```
18
+
19
+ To run the unit tests (using Jest) use:
20
+
13
21
  ```bash
14
- yarn add @royaloperahouse/chord
22
+ yarn test # you can also use the -u option to update snapshots if needed
23
+ ```
24
+
25
+ To run the unit tests (using Jest) and store them for display in storybook use:
26
+
27
+ ```bash
28
+ yarn test-storybook # you can also use the -u option to update snapshots if needed
29
+ ```
30
+
31
+ To run storybook use:
32
+
33
+ ```bash
34
+ yarn storybook
35
+ ```
36
+
37
+ To build a static version of storybook use:
38
+
39
+ ```bash
40
+ yarn build-storybook
15
41
  ```
16
42
 
17
- ## Usage
43
+ This will create a static copy in `./storybook-static`, and there is an index.html page inside the core directory. This allows the site to be previewed directly in the git repository via serving pages (it needs to be configured for that branch).
18
44
 
19
- ```javascript
20
- import {
21
- Footer, GlobalStyles, ThemeProvider, ThemeType,
22
- } from '@royaloperahouse/chord';
45
+ To build the package use:
23
46
 
47
+ ```bash
48
+ yarn build
24
49
  ```
25
- ## Sample
26
-
27
- ```javascript
28
-
29
- import {
30
- Footer, GlobalStyles, ThemeProvider, ThemeType,
31
- } from '@royaloperahouse/chord';
32
-
33
-
34
- const App = ({ children }: InnerProps): React.ReactElement => (
35
- <ErrorBoundary>
36
- <ThemeProvider theme={ThemeType.Core}>
37
- <GlobalStyles />
38
- <Wrapper>
39
- <Header />
40
- <GlobalStyle />
41
- <HealthBanner />
42
- <ErrorBoundary>
43
- <Content>
44
- {children}
45
- </Content>
46
- </ErrorBoundary>
47
- <LiveChat />
48
- </Wrapper>
49
- <Footer data={footerData} />
50
- </ThemeProvider>
51
- </ErrorBoundary>
52
- );
53
50
 
51
+ To release a new version.
52
+
53
+ Release will be published in npm (NPM_TOKEN will be required)
54
+ Storybook will be pushed to bitbucket. *** Push will be done Ensure you don't have things pendint to push
55
+
56
+ ```bash
57
+ NPM_ROH_TOKEN={NPM_TOKEN} RELEASE_VERSION={RELEASE_VERSION} yarn publish-release
54
58
  ```
55
59
 
56
- ## Components
57
60
 
58
- Editorial, Footer, GlobalStyles, Grid, GridItem, Heading, Icon, Navigation, PeopleListing, PrimaryButton, PromoWithTitle, SecondaryButton, SectionSplitter, SectionTitle, Sponsorship, TertiaryButton, TextOnly, ThemeProvider, TypeTags
61
+ MORE INFO TO FOLLOW - PARTICULARLY FOR THE CI SETUP AND HOW PACKAGES ARE PUSHED.
62
+
63
+ # Recommended Use of Package
64
+
65
+ The package is deployed to NPM, and can be installed using yarn or npm:
66
+
67
+ ```bash
68
+ npm i --save @royaloperahouse/chord
69
+ ```
70
+ ```bash
71
+ yarn add @royaloperahouse/chord
72
+ ```
73
+
74
+ # Processes to follow prior to commits
75
+
76
+ Before a commit is made you need to do the following:
77
+
78
+ - Make sure that you are in your own work branch (properly named, including the JIRA ticket number and a short description)
79
+ - `yarn lint` - ensure that you are not introducing errors
80
+ - `yarn test` - ensure that tests are running as expected
81
+ - `yarn test-storybook` - Save the test results to for the static site
82
+ - `yarn build-storybook` - Update the static site
83
+ - Commit your changes in your branch locally
59
84
 
85
+ Next, if you are ready to merge into the main development branch then:
60
86
 
61
- ## Types
87
+ - _*ensure that you pull the latest changes from that branch into your new branch, resolving any merge conflicts that may arise*_
88
+ - Commit any merge changes locally
89
+ - Push your branch changes to the origin repo
90
+ - Raise a Pull Request to merge back into the main development branch, AND ensure that the required reviewers are assigned.
91
+ - The reviewers may raise issues, and once resolved, they will be responsible for performing the merge.
62
92
 
63
- ThemeType
93
+ ### Example
64
94
 
95
+ There is an example implementation in the example folder. Alternatively there are also integration examples in storybook. Make sure to keep these updated so as to showcase the current components available.
65
96
 
66
- ## Documentation
97
+ ### Bundle analysis
67
98
 
68
- See Storybook as a reference
99
+ Calculates the real cost of your library using [size-limit](https://github.com/ai/size-limit) with `yarn size` and visulize it with `yarn analyze`.