@royaloperahouse/chord 0.3.6 → 0.3.7

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.
@@ -1,2 +1 @@
1
- export declare const TypeTag: import("styled-components").StyledComponent<"li", any, {}, never>;
2
1
  export declare const TypeTagsContainer: import("styled-components").StyledComponent<"ul", any, {}, never>;
@@ -0,0 +1,7 @@
1
+ import { IAltHeaderProps, IBodyTextProps, IHeaderProps, IOverlineProps, IStyledTag, ISubtitleProps } from '../../../types/typography';
2
+ export declare const StyledTag: ({ tag, typography, children, level }: IStyledTag) => JSX.Element;
3
+ export declare const AltHeader: ({ level, children }: IAltHeaderProps) => JSX.Element;
4
+ export declare const BodyText: ({ level, children, tag }: IBodyTextProps) => JSX.Element;
5
+ export declare const Header: ({ level, children }: IHeaderProps) => JSX.Element;
6
+ export declare const Overline: ({ level, children, tag }: IOverlineProps) => JSX.Element;
7
+ export declare const Subtitle: ({ level, children, tag }: ISubtitleProps) => JSX.Element;
@@ -0,0 +1,3 @@
1
+ import { ITypographyWrapperProps } from '../../../types/typography';
2
+ declare const Wrapper: import("styled-components").StyledComponent<"div", any, ITypographyWrapperProps, never>;
3
+ export default Wrapper;
@@ -0,0 +1,2 @@
1
+ import { AltHeader, BodyText, Header, Overline, Subtitle } from './Typography';
2
+ export { AltHeader, BodyText, Header, Overline, Subtitle };
@@ -3,7 +3,6 @@ import { Grid, GridItem } from './Grid';
3
3
  import { Icon } from './Icons';
4
4
  import { CinemaBadge, StreamBadge } from './Badge';
5
5
  import SecondaryLogo from './SecondaryLogo';
6
- import Heading from './Heading';
7
6
  import SponsorLogo from './SponsorLogo';
8
7
  import Sponsorship from './Sponsorship';
9
8
  import SectionSplitter from './SectionSplitter';
@@ -12,4 +11,5 @@ import Tab from './Tab';
12
11
  import TabLink from './TabLink';
13
12
  import TypeTags from './TypeTags';
14
13
  import RotatorButtons from './RotatorButtons';
15
- export { CinemaBadge, Grid, GridItem, Heading, Icon, ImageAspectRatioWrapper, PrimaryButton, RotatorButtons, SecondaryButton, SecondaryLogo, SectionSplitter, SponsorLogo, Sponsorship, StreamBadge, Tab, TabLink, TertiaryButton, TypeTags, };
14
+ import { AltHeader, BodyText, Header, Overline, Subtitle } from './Typography';
15
+ export { AltHeader, BodyText, CinemaBadge, Grid, GridItem, Header, Icon, ImageAspectRatioWrapper, Overline, PrimaryButton, RotatorButtons, SecondaryButton, SecondaryLogo, SectionSplitter, SponsorLogo, Sponsorship, StreamBadge, Subtitle, Tab, TabLink, TertiaryButton, TypeTags, };
@@ -1,6 +1,6 @@
1
- import { CinemaBadge, Grid, GridItem, Heading, Icon, Sponsorship, PrimaryButton, RotatorButtons, SecondaryButton, SecondaryLogo, TertiaryButton, SectionSplitter, StreamBadge, TabLink, TypeTags } from './atoms';
1
+ import { AltHeader, BodyText, CinemaBadge, Grid, GridItem, Header, Icon, Overline, PrimaryButton, RotatorButtons, SecondaryButton, SecondaryLogo, TertiaryButton, SectionSplitter, Sponsorship, StreamBadge, Subtitle, TabLink, TypeTags } from './atoms';
2
2
  import { AnchorTapBar, Footer, Navigation } from './organisms';
3
3
  import { Accordion, Accordions, Cards, Editorial, PageHeadingCinema, PageHeadingCore, PageHeadingImpact, PageHeadingStream, PeopleListing, PromoWithTitle, SectionTitle, Tabs, TextOnly } from './molecules';
4
4
  import ThemeProvider from '../styles/ThemeProvider';
5
5
  import GlobalStyles from '../styles/GlobalStyles';
6
- export { CinemaBadge, Accordion, Accordions, AnchorTapBar, Cards, Editorial, Footer, GlobalStyles, Grid, GridItem, Heading, Icon, Navigation, PageHeadingCinema, PageHeadingCore, PageHeadingImpact, PageHeadingStream, PeopleListing, PrimaryButton, PromoWithTitle, RotatorButtons, SecondaryButton, SecondaryLogo, SectionTitle, Sponsorship, StreamBadge, TertiaryButton, TextOnly, ThemeProvider, SectionSplitter, TabLink, Tabs, TypeTags, };
6
+ export { Accordion, Accordions, AltHeader, AnchorTapBar, BodyText, Cards, CinemaBadge, Editorial, Footer, GlobalStyles, Grid, GridItem, Header, Icon, Navigation, Overline, PageHeadingCinema, PageHeadingCore, PageHeadingImpact, PageHeadingStream, PeopleListing, PrimaryButton, PromoWithTitle, RotatorButtons, SecondaryButton, SecondaryLogo, SectionTitle, Sponsorship, StreamBadge, Subtitle, TertiaryButton, TextOnly, ThemeProvider, SectionSplitter, TabLink, Tabs, TypeTags, };
@@ -1,5 +1,5 @@
1
1
  export declare const AccordionContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
2
2
  export declare const LineContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
3
- export declare const RichtText: import("styled-components").StyledComponent<"div", any, {}, never>;
3
+ export declare const ChildrenContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
4
4
  export declare const TitleContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
5
- export declare const TextContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
5
+ export declare const ContentContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
package/dist/index.d.ts CHANGED
@@ -1,3 +1,4 @@
1
- import { CinemaBadge, Accordion, Accordions, AnchorTapBar, Cards, Editorial, Footer, GlobalStyles, Grid, GridItem, Heading, Icon, Navigation, PageHeadingCinema, PageHeadingCore, PageHeadingImpact, PageHeadingStream, PeopleListing, PrimaryButton, PromoWithTitle, RotatorButtons, SecondaryButton, SecondaryLogo, SectionSplitter, SectionTitle, Sponsorship, StreamBadge, TertiaryButton, TextOnly, ThemeProvider, TabLink, Tabs, TypeTags } from './components';
1
+ import { Accordion, Accordions, AltHeader, AnchorTapBar, BodyText, Cards, CinemaBadge, Editorial, Footer, GlobalStyles, Grid, GridItem, Header, Icon, Navigation, Overline, PageHeadingCinema, PageHeadingCore, PageHeadingImpact, PageHeadingStream, PeopleListing, PrimaryButton, PromoWithTitle, RotatorButtons, SecondaryButton, SecondaryLogo, SectionSplitter, SectionTitle, Sponsorship, StreamBadge, Subtitle, TertiaryButton, TextOnly, ThemeProvider, TabLink, Tabs, TypeTags } from './components';
2
+ import { devices } from './styles/viewports';
2
3
  import { ThemeType } from './types/types';
3
- export { CinemaBadge, Accordion, Accordions, AnchorTapBar, Cards, Editorial, Footer, GlobalStyles, Grid, GridItem, Icon, Heading, Navigation, PageHeadingCinema, PageHeadingCore, PageHeadingImpact, PageHeadingStream, PeopleListing, PrimaryButton, PromoWithTitle, RotatorButtons, SecondaryButton, SecondaryLogo, SectionSplitter, SectionTitle, Sponsorship, StreamBadge, TabLink, Tabs, TertiaryButton, TextOnly, ThemeProvider, ThemeType, TypeTags, };
4
+ export { Accordion, Accordions, AltHeader, AnchorTapBar, BodyText, Cards, CinemaBadge, devices, Editorial, Footer, GlobalStyles, Grid, GridItem, Icon, Header, Navigation, Overline, PageHeadingCinema, PageHeadingCore, PageHeadingImpact, PageHeadingStream, PeopleListing, PrimaryButton, PromoWithTitle, RotatorButtons, SecondaryButton, SecondaryLogo, SectionSplitter, SectionTitle, Sponsorship, StreamBadge, Subtitle, TabLink, Tabs, TertiaryButton, TextOnly, ThemeProvider, ThemeType, TypeTags, };
@@ -66,6 +66,9 @@ export declare const core: {
66
66
  6: string;
67
67
  };
68
68
  altHeaders: {
69
+ 3: string;
70
+ 4: string;
71
+ 5: string;
69
72
  6: string;
70
73
  };
71
74
  overline: {
@@ -141,6 +144,9 @@ export declare const core: {
141
144
  6: string;
142
145
  };
143
146
  altHeaders: {
147
+ 3: string;
148
+ 4: string;
149
+ 5: string;
144
150
  6: string;
145
151
  };
146
152
  buttons: string;
@@ -171,11 +177,17 @@ export declare const core: {
171
177
  headers: string;
172
178
  altHeaders: string;
173
179
  overline: string;
174
- subtitles1: string;
175
- subtitles2: string;
180
+ subtitles: string;
176
181
  body: string;
177
182
  navigation: string;
178
183
  };
184
+ wordBreak: {
185
+ headers: string;
186
+ altHeaders: string;
187
+ overline: string;
188
+ subtitles: string;
189
+ body: string;
190
+ };
179
191
  };
180
192
  mobile: {
181
193
  sizes: {
@@ -222,6 +234,9 @@ export declare const core: {
222
234
  6: string;
223
235
  };
224
236
  altHeaders: {
237
+ 3: string;
238
+ 4: string;
239
+ 5: string;
225
240
  6: string;
226
241
  };
227
242
  overline: {
@@ -295,6 +310,9 @@ export declare const core: {
295
310
  6: string;
296
311
  };
297
312
  altHeaders: {
313
+ 3: string;
314
+ 4: string;
315
+ 5: string;
298
316
  6: string;
299
317
  };
300
318
  buttons: string;
@@ -325,11 +343,17 @@ export declare const core: {
325
343
  headers: string;
326
344
  altHeaders: string;
327
345
  overline: string;
328
- subtitles1: string;
329
- subtitles2: string;
346
+ subtitles: string;
330
347
  body: string;
331
348
  navigation: string;
332
349
  };
350
+ wordBreak: {
351
+ headers: string;
352
+ altHeaders: string;
353
+ overline: string;
354
+ subtitles: string;
355
+ body: string;
356
+ };
333
357
  };
334
358
  };
335
359
  spacing: {
@@ -471,6 +495,9 @@ export declare const stream: {
471
495
  6: string;
472
496
  };
473
497
  altHeaders: {
498
+ 3: string;
499
+ 4: string;
500
+ 5: string;
474
501
  6: string;
475
502
  };
476
503
  overline: {
@@ -546,6 +573,9 @@ export declare const stream: {
546
573
  6: string;
547
574
  };
548
575
  altHeaders: {
576
+ 3: string;
577
+ 4: string;
578
+ 5: string;
549
579
  6: string;
550
580
  };
551
581
  buttons: string;
@@ -576,11 +606,17 @@ export declare const stream: {
576
606
  headers: string;
577
607
  altHeaders: string;
578
608
  overline: string;
579
- subtitles1: string;
580
- subtitles2: string;
609
+ subtitles: string;
581
610
  body: string;
582
611
  navigation: string;
583
612
  };
613
+ wordBreak: {
614
+ headers: string;
615
+ altHeaders: string;
616
+ overline: string;
617
+ subtitles: string;
618
+ body: string;
619
+ };
584
620
  };
585
621
  mobile: {
586
622
  sizes: {
@@ -627,6 +663,9 @@ export declare const stream: {
627
663
  6: string;
628
664
  };
629
665
  altHeaders: {
666
+ 3: string;
667
+ 4: string;
668
+ 5: string;
630
669
  6: string;
631
670
  };
632
671
  overline: {
@@ -700,6 +739,9 @@ export declare const stream: {
700
739
  6: string;
701
740
  };
702
741
  altHeaders: {
742
+ 3: string;
743
+ 4: string;
744
+ 5: string;
703
745
  6: string;
704
746
  };
705
747
  buttons: string;
@@ -730,11 +772,17 @@ export declare const stream: {
730
772
  headers: string;
731
773
  altHeaders: string;
732
774
  overline: string;
733
- subtitles1: string;
734
- subtitles2: string;
775
+ subtitles: string;
735
776
  body: string;
736
777
  navigation: string;
737
778
  };
779
+ wordBreak: {
780
+ headers: string;
781
+ altHeaders: string;
782
+ overline: string;
783
+ subtitles: string;
784
+ body: string;
785
+ };
738
786
  };
739
787
  };
740
788
  spacing: {
@@ -876,6 +924,9 @@ export declare const cinema: {
876
924
  6: string;
877
925
  };
878
926
  altHeaders: {
927
+ 3: string;
928
+ 4: string;
929
+ 5: string;
879
930
  6: string;
880
931
  };
881
932
  overline: {
@@ -951,6 +1002,9 @@ export declare const cinema: {
951
1002
  6: string;
952
1003
  };
953
1004
  altHeaders: {
1005
+ 3: string;
1006
+ 4: string;
1007
+ 5: string;
954
1008
  6: string;
955
1009
  };
956
1010
  buttons: string;
@@ -981,11 +1035,17 @@ export declare const cinema: {
981
1035
  headers: string;
982
1036
  altHeaders: string;
983
1037
  overline: string;
984
- subtitles1: string;
985
- subtitles2: string;
1038
+ subtitles: string;
986
1039
  body: string;
987
1040
  navigation: string;
988
1041
  };
1042
+ wordBreak: {
1043
+ headers: string;
1044
+ altHeaders: string;
1045
+ overline: string;
1046
+ subtitles: string;
1047
+ body: string;
1048
+ };
989
1049
  };
990
1050
  mobile: {
991
1051
  sizes: {
@@ -1032,6 +1092,9 @@ export declare const cinema: {
1032
1092
  6: string;
1033
1093
  };
1034
1094
  altHeaders: {
1095
+ 3: string;
1096
+ 4: string;
1097
+ 5: string;
1035
1098
  6: string;
1036
1099
  };
1037
1100
  overline: {
@@ -1105,6 +1168,9 @@ export declare const cinema: {
1105
1168
  6: string;
1106
1169
  };
1107
1170
  altHeaders: {
1171
+ 3: string;
1172
+ 4: string;
1173
+ 5: string;
1108
1174
  6: string;
1109
1175
  };
1110
1176
  buttons: string;
@@ -1135,11 +1201,17 @@ export declare const cinema: {
1135
1201
  headers: string;
1136
1202
  altHeaders: string;
1137
1203
  overline: string;
1138
- subtitles1: string;
1139
- subtitles2: string;
1204
+ subtitles: string;
1140
1205
  body: string;
1141
1206
  navigation: string;
1142
1207
  };
1208
+ wordBreak: {
1209
+ headers: string;
1210
+ altHeaders: string;
1211
+ overline: string;
1212
+ subtitles: string;
1213
+ body: string;
1214
+ };
1143
1215
  };
1144
1216
  };
1145
1217
  spacing: {
@@ -1282,6 +1354,9 @@ export declare const themes: {
1282
1354
  6: string;
1283
1355
  };
1284
1356
  altHeaders: {
1357
+ 3: string;
1358
+ 4: string;
1359
+ 5: string;
1285
1360
  6: string;
1286
1361
  };
1287
1362
  overline: {
@@ -1357,6 +1432,9 @@ export declare const themes: {
1357
1432
  6: string;
1358
1433
  };
1359
1434
  altHeaders: {
1435
+ 3: string;
1436
+ 4: string;
1437
+ 5: string;
1360
1438
  6: string;
1361
1439
  };
1362
1440
  buttons: string;
@@ -1387,11 +1465,17 @@ export declare const themes: {
1387
1465
  headers: string;
1388
1466
  altHeaders: string;
1389
1467
  overline: string;
1390
- subtitles1: string;
1391
- subtitles2: string;
1468
+ subtitles: string;
1392
1469
  body: string;
1393
1470
  navigation: string;
1394
1471
  };
1472
+ wordBreak: {
1473
+ headers: string;
1474
+ altHeaders: string;
1475
+ overline: string;
1476
+ subtitles: string;
1477
+ body: string;
1478
+ };
1395
1479
  };
1396
1480
  mobile: {
1397
1481
  sizes: {
@@ -1438,6 +1522,9 @@ export declare const themes: {
1438
1522
  6: string;
1439
1523
  };
1440
1524
  altHeaders: {
1525
+ 3: string;
1526
+ 4: string;
1527
+ 5: string;
1441
1528
  6: string;
1442
1529
  };
1443
1530
  overline: {
@@ -1511,6 +1598,9 @@ export declare const themes: {
1511
1598
  6: string;
1512
1599
  };
1513
1600
  altHeaders: {
1601
+ 3: string;
1602
+ 4: string;
1603
+ 5: string;
1514
1604
  6: string;
1515
1605
  };
1516
1606
  buttons: string;
@@ -1541,11 +1631,17 @@ export declare const themes: {
1541
1631
  headers: string;
1542
1632
  altHeaders: string;
1543
1633
  overline: string;
1544
- subtitles1: string;
1545
- subtitles2: string;
1634
+ subtitles: string;
1546
1635
  body: string;
1547
1636
  navigation: string;
1548
1637
  };
1638
+ wordBreak: {
1639
+ headers: string;
1640
+ altHeaders: string;
1641
+ overline: string;
1642
+ subtitles: string;
1643
+ body: string;
1644
+ };
1549
1645
  };
1550
1646
  };
1551
1647
  spacing: {
@@ -1687,6 +1783,9 @@ export declare const themes: {
1687
1783
  6: string;
1688
1784
  };
1689
1785
  altHeaders: {
1786
+ 3: string;
1787
+ 4: string;
1788
+ 5: string;
1690
1789
  6: string;
1691
1790
  };
1692
1791
  overline: {
@@ -1762,6 +1861,9 @@ export declare const themes: {
1762
1861
  6: string;
1763
1862
  };
1764
1863
  altHeaders: {
1864
+ 3: string;
1865
+ 4: string;
1866
+ 5: string;
1765
1867
  6: string;
1766
1868
  };
1767
1869
  buttons: string;
@@ -1792,11 +1894,17 @@ export declare const themes: {
1792
1894
  headers: string;
1793
1895
  altHeaders: string;
1794
1896
  overline: string;
1795
- subtitles1: string;
1796
- subtitles2: string;
1897
+ subtitles: string;
1797
1898
  body: string;
1798
1899
  navigation: string;
1799
1900
  };
1901
+ wordBreak: {
1902
+ headers: string;
1903
+ altHeaders: string;
1904
+ overline: string;
1905
+ subtitles: string;
1906
+ body: string;
1907
+ };
1800
1908
  };
1801
1909
  mobile: {
1802
1910
  sizes: {
@@ -1843,6 +1951,9 @@ export declare const themes: {
1843
1951
  6: string;
1844
1952
  };
1845
1953
  altHeaders: {
1954
+ 3: string;
1955
+ 4: string;
1956
+ 5: string;
1846
1957
  6: string;
1847
1958
  };
1848
1959
  overline: {
@@ -1916,6 +2027,9 @@ export declare const themes: {
1916
2027
  6: string;
1917
2028
  };
1918
2029
  altHeaders: {
2030
+ 3: string;
2031
+ 4: string;
2032
+ 5: string;
1919
2033
  6: string;
1920
2034
  };
1921
2035
  buttons: string;
@@ -1946,11 +2060,17 @@ export declare const themes: {
1946
2060
  headers: string;
1947
2061
  altHeaders: string;
1948
2062
  overline: string;
1949
- subtitles1: string;
1950
- subtitles2: string;
2063
+ subtitles: string;
1951
2064
  body: string;
1952
2065
  navigation: string;
1953
2066
  };
2067
+ wordBreak: {
2068
+ headers: string;
2069
+ altHeaders: string;
2070
+ overline: string;
2071
+ subtitles: string;
2072
+ body: string;
2073
+ };
1954
2074
  };
1955
2075
  };
1956
2076
  spacing: {
@@ -2092,6 +2212,9 @@ export declare const themes: {
2092
2212
  6: string;
2093
2213
  };
2094
2214
  altHeaders: {
2215
+ 3: string;
2216
+ 4: string;
2217
+ 5: string;
2095
2218
  6: string;
2096
2219
  };
2097
2220
  overline: {
@@ -2167,6 +2290,9 @@ export declare const themes: {
2167
2290
  6: string;
2168
2291
  };
2169
2292
  altHeaders: {
2293
+ 3: string;
2294
+ 4: string;
2295
+ 5: string;
2170
2296
  6: string;
2171
2297
  };
2172
2298
  buttons: string;
@@ -2197,11 +2323,17 @@ export declare const themes: {
2197
2323
  headers: string;
2198
2324
  altHeaders: string;
2199
2325
  overline: string;
2200
- subtitles1: string;
2201
- subtitles2: string;
2326
+ subtitles: string;
2202
2327
  body: string;
2203
2328
  navigation: string;
2204
2329
  };
2330
+ wordBreak: {
2331
+ headers: string;
2332
+ altHeaders: string;
2333
+ overline: string;
2334
+ subtitles: string;
2335
+ body: string;
2336
+ };
2205
2337
  };
2206
2338
  mobile: {
2207
2339
  sizes: {
@@ -2248,6 +2380,9 @@ export declare const themes: {
2248
2380
  6: string;
2249
2381
  };
2250
2382
  altHeaders: {
2383
+ 3: string;
2384
+ 4: string;
2385
+ 5: string;
2251
2386
  6: string;
2252
2387
  };
2253
2388
  overline: {
@@ -2321,6 +2456,9 @@ export declare const themes: {
2321
2456
  6: string;
2322
2457
  };
2323
2458
  altHeaders: {
2459
+ 3: string;
2460
+ 4: string;
2461
+ 5: string;
2324
2462
  6: string;
2325
2463
  };
2326
2464
  buttons: string;
@@ -2351,11 +2489,17 @@ export declare const themes: {
2351
2489
  headers: string;
2352
2490
  altHeaders: string;
2353
2491
  overline: string;
2354
- subtitles1: string;
2355
- subtitles2: string;
2492
+ subtitles: string;
2356
2493
  body: string;
2357
2494
  navigation: string;
2358
2495
  };
2496
+ wordBreak: {
2497
+ headers: string;
2498
+ altHeaders: string;
2499
+ overline: string;
2500
+ subtitles: string;
2501
+ body: string;
2502
+ };
2359
2503
  };
2360
2504
  };
2361
2505
  spacing: {
@@ -1,14 +1,6 @@
1
1
  import { ReactNode, AnchorHTMLAttributes, MouseEventHandler } from 'react';
2
2
  import { StyledProps } from 'styled-components';
3
3
  import { IconNameType, DirectionType } from './iconTypes';
4
- export declare enum HeadingLevel {
5
- H1 = 1,
6
- H2 = 2,
7
- H3 = 3,
8
- H4 = 4,
9
- H5 = 5,
10
- H6 = 6
11
- }
12
4
  export declare enum Colors {
13
5
  White = "white",
14
6
  Black = "black",
@@ -24,13 +16,6 @@ export declare enum Colors {
24
16
  Stream = "stream",
25
17
  Cinema = "cinema"
26
18
  }
27
- export interface IHeadingProps {
28
- level: HeadingLevel;
29
- children: ReactNode;
30
- }
31
- export interface IHeadingWrapperProps extends StyledProps<any> {
32
- level: HeadingLevel;
33
- }
34
19
  export declare enum ThemeType {
35
20
  Core = "core",
36
21
  Stream = "stream",
@@ -295,11 +280,11 @@ export interface IAccordionProps {
295
280
  /**
296
281
  * Title to display.
297
282
  */
298
- title: string;
283
+ title?: string;
299
284
  /**
300
- * Text to render when accordion is opened
285
+ * The component to be wrapped into the accordion
301
286
  */
302
- text: string;
287
+ children?: ReactNode;
303
288
  /**
304
289
  * Set if accordions are stacked
305
290
  */
@@ -0,0 +1,73 @@
1
+ import { ReactNode } from 'react';
2
+ import { StyledProps } from 'styled-components';
3
+ export declare type TypographyLevel = 1 | 2 | 3 | 4 | 5 | 6;
4
+ export declare type AltHeaderLevel = 3 | 4 | 5 | 6;
5
+ export declare type BodyLevel = 1 | 2 | 3;
6
+ export declare type SubtitleLevel = 1 | 2;
7
+ export declare type OverlineLevel = 1 | 2;
8
+ export declare type TypographyType = 'header' | 'altHeader' | 'body' | 'subtitle' | 'overline';
9
+ export interface ITypographyWrapperProps extends StyledProps<any> {
10
+ /**
11
+ * Typography level to use for generic Typography subcomponent.
12
+ */
13
+ level: TypographyLevel;
14
+ /**
15
+ * Typography type to use for generic Typography subcomponent.
16
+ */
17
+ typography: TypographyType;
18
+ }
19
+ interface IGenericTypography {
20
+ /**
21
+ * text or html block to wrap in styled tag.
22
+ */
23
+ children: ReactNode;
24
+ }
25
+ export interface IStyledTag extends ITypographyWrapperProps, IGenericTypography {
26
+ /**
27
+ * HTML tag to use to render component, by default div.
28
+ */
29
+ tag?: React.ElementType;
30
+ }
31
+ export interface IHeaderProps extends IGenericTypography {
32
+ /**
33
+ * Header level, 1, 2, 3, 4, 5 or 6.
34
+ */
35
+ level: TypographyLevel;
36
+ }
37
+ export interface IAltHeaderProps extends IGenericTypography {
38
+ /**
39
+ * AltHeader level, 3, 4, 5 or 6.
40
+ */
41
+ level: AltHeaderLevel;
42
+ }
43
+ export interface IBodyTextProps extends IGenericTypography {
44
+ /**
45
+ * BodyText level, 1, 2 or 3.
46
+ */
47
+ level: BodyLevel;
48
+ /**
49
+ * HTML tag to use to render BodyText, by default div.
50
+ */
51
+ tag?: React.ElementType;
52
+ }
53
+ export interface ISubtitleProps extends IGenericTypography {
54
+ /**
55
+ * Subtitle level, 1 or 2.
56
+ */
57
+ level: SubtitleLevel;
58
+ /**
59
+ * HTML tag to use to render Subtitle, by default div.
60
+ */
61
+ tag?: React.ElementType;
62
+ }
63
+ export interface IOverlineProps extends IGenericTypography {
64
+ /**
65
+ * Overline level, 1 or 2.
66
+ */
67
+ level: OverlineLevel;
68
+ /**
69
+ * HTML tag to use to render Overline, by default div.
70
+ */
71
+ tag?: React.ElementType;
72
+ }
73
+ export {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@royaloperahouse/chord",
3
- "version": "0.3.6",
3
+ "version": "0.3.7",
4
4
  "author": "Royal Opera House",
5
5
  "license": "MIT",
6
6
  "main": "dist/index.js",
@@ -1,3 +0,0 @@
1
- import { IHeadingProps } from '../../../types/types';
2
- declare const Heading: ({ level, children }: IHeadingProps) => JSX.Element;
3
- export default Heading;
@@ -1,3 +0,0 @@
1
- import { IHeadingWrapperProps } from '../../../types/types';
2
- declare const HeaderWrapper: import("styled-components").StyledComponent<"h1", any, IHeadingWrapperProps, never>;
3
- export default HeaderWrapper;
@@ -1,2 +0,0 @@
1
- import Heading from './Heading';
2
- export default Heading;