@quintype/native-components 2.20.11 → 2.20.13

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 (13) hide show
  1. package/CHANGELOG.md +9 -0
  2. package/package.json +1 -1
  3. package/src/components/StoryImage/styles.js +1 -1
  4. package/src/components/StoryText/styles.js +2 -2
  5. package/src/components/TagsRow/styles.js +2 -1
  6. package/src/components/TextBigFact/styles.js +3 -3
  7. package/src/components/TextBlockQuote/styles.js +3 -3
  8. package/src/components/TextBlurb/styles.js +2 -2
  9. package/src/components/TextQuote/styles.js +3 -3
  10. package/src/components/TextSummary/styles.js +2 -2
  11. package/src/constants/component-constants/general-constants/constants.js +22 -25
  12. package/src/utils/index.js +1 -0
  13. package/src/utils/rtlUtil.js +3 -0
package/CHANGELOG.md CHANGED
@@ -2,6 +2,15 @@
2
2
 
3
3
  All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
4
4
 
5
+ ### [2.20.13](https://github.com/quintype/native-components/compare/v2.20.12...v2.20.13) (2023-09-26)
6
+
7
+
8
+ ### Bug Fixes
9
+
10
+ * **story-image:** Fix attribution color :hammer: ([#212](https://github.com/quintype/native-components/issues/212)) ([5c22da3](https://github.com/quintype/native-components/commit/5c22da35327731192f9d3fa15f5a5266acf8f2ff))
11
+
12
+ ### [2.20.12](https://github.com/quintype/native-components/compare/v2.20.11...v2.20.12) (2023-09-06)
13
+
5
14
  ### [2.20.11](https://github.com/quintype/native-components/compare/v2.20.10...v2.20.11) (2023-08-10)
6
15
 
7
16
  ### [2.20.10](https://github.com/quintype/native-components/compare/v2.20.9...v2.20.10) (2023-08-08)
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@quintype/native-components",
3
- "version": "2.20.11",
3
+ "version": "2.20.13",
4
4
  "description": "",
5
5
  "main": "src/index.js",
6
6
  "scripts": {
package/src/components/StoryImage/styles.js CHANGED
@@ -25,7 +25,7 @@ export const storyImageStyles = ({ COLORS, FONT_SIZE }, metadata = {}) => {
25
25
  attributionText: {
26
26
  fontSize: FONT_SIZE.h5,
27
27
  lineHeight: FONT_SIZE.h5 * 1.3,
28
- color: COLORS.IMAGE_LIGHTGREY,
28
+ color: COLORS.BRAND_BLACK,
29
29
  marginBottom: 5,
30
30
  },
31
31
  imageMeta: {
package/src/components/StoryText/styles.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { StyleSheet } from 'react-native';
2
- import { COMP_GENERAL_CONSTANTS } from '../../constants/component-constants/general-constants/constants';
2
+ import { isRTLEnabled } from '../../utils';
3
3
 
4
4
  export const storyTextStyles = (COLORS, FONT_SIZE) => StyleSheet.create({
5
5
  container: {
@@ -9,6 +9,6 @@ export const storyTextStyles = (COLORS, FONT_SIZE) => StyleSheet.create({
9
9
  fontSize: FONT_SIZE.h2,
10
10
  lineHeight: FONT_SIZE.h2 * 1.5,
11
11
  color: COLORS.BRAND_8,
12
- textAlign: COMP_GENERAL_CONSTANTS.textAlignment,
12
+ textAlign: isRTLEnabled() ? 'left' : 'auto',
13
13
  },
14
14
  });
package/src/components/TagsRow/styles.js CHANGED
@@ -22,6 +22,7 @@ export const styles = ({ COLORS, FONT_SIZE }) => StyleSheet.create({
22
22
  },
23
23
  tagsText: {
24
24
  textTransform: 'capitalize',
25
- color: COLORS.BRAND_BLACK
25
+ color: COLORS.BRAND_BLACK,
26
+ fontSize: FONT_SIZE.h3,
26
27
  },
27
28
  });
package/src/components/TextBigFact/styles.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { StyleSheet } from 'react-native';
2
- import { COMP_GENERAL_CONSTANTS } from '../../constants/component-constants/general-constants/constants';
2
+ import { isRTLEnabled } from '../../utils';
3
3
 
4
4
  export const bigTextStyles = (COLORS, FONT_SIZE, DARK_MODE) => StyleSheet.create({
5
5
  container: {
@@ -12,12 +12,12 @@ export const bigTextStyles = (COLORS, FONT_SIZE, DARK_MODE) => StyleSheet.create
12
12
  color: DARK_MODE ? COLORS.BRAND_BLACK : COLORS.BRAND_WHITE,
13
13
  lineHeight: FONT_SIZE.h1 * 1.3,
14
14
  marginVertical: 10,
15
- textAlign: COMP_GENERAL_CONSTANTS.textAlignment,
15
+ textAlign: isRTLEnabled() ? 'left' : 'auto',
16
16
  },
17
17
  authorText: {
18
18
  fontSize: FONT_SIZE.h5,
19
19
  color: DARK_MODE ? COLORS.BRAND_BLACK : COLORS.BRAND_WHITE,
20
20
  lineHeight: FONT_SIZE.h5 * 1.3,
21
- textAlign: COMP_GENERAL_CONSTANTS.textAlignment,
21
+ textAlign: isRTLEnabled() ? 'left' : 'auto',
22
22
  },
23
23
  });
package/src/components/TextBlockQuote/styles.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { StyleSheet } from 'react-native';
2
- import { COMP_GENERAL_CONSTANTS } from '../../constants/component-constants/general-constants/constants';
2
+ import { isRTLEnabled } from '../../utils';
3
3
 
4
4
  export const blockQuoteTextStyles = (FONT_SIZE, COLORS, DARK_MODE) => StyleSheet.create({
5
5
  container: {
@@ -12,13 +12,13 @@ export const blockQuoteTextStyles = (FONT_SIZE, COLORS, DARK_MODE) => StyleSheet
12
12
  color: DARK_MODE ? COLORS.BRAND_BLACK : COLORS.BRAND_WHITE,
13
13
  lineHeight: FONT_SIZE.h1 * 1.3,
14
14
  marginVertical: 10,
15
- textAlign: COMP_GENERAL_CONSTANTS.textAlignment,
15
+ textAlign: isRTLEnabled() ? 'left' : 'auto',
16
16
  },
17
17
  authorText: {
18
18
  fontSize: FONT_SIZE.h5,
19
19
  color: DARK_MODE ? COLORS.BRAND_BLACK : COLORS.BRAND_WHITE,
20
20
  lineHeight: FONT_SIZE.h5 * 1.3,
21
- textAlign: COMP_GENERAL_CONSTANTS.textAlignment,
21
+ textAlign: isRTLEnabled() ? 'left' : 'auto',
22
22
  },
23
23
  topBorderContainer: {
24
24
  alignItems: 'center',
package/src/components/TextBlurb/styles.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { StyleSheet } from 'react-native';
2
- import { COMP_GENERAL_CONSTANTS } from '../../constants/component-constants/general-constants/constants'
2
+ import { isRTLEnabled } from '../../utils';
3
3
 
4
4
  export const textBlurbStyles = (FONT_SIZE) => StyleSheet.create({
5
5
  container: {
@@ -10,6 +10,6 @@ export const textBlurbStyles = (FONT_SIZE) => StyleSheet.create({
10
10
  blurbText: {
11
11
  fontSize: FONT_SIZE.h3,
12
12
  lineHeight: FONT_SIZE.h3 * 1.3,
13
- textAlign : COMP_GENERAL_CONSTANTS.textAlignment
13
+ textAlign: isRTLEnabled() ? 'left' : 'auto',
14
14
  },
15
15
  });
package/src/components/TextQuote/styles.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { StyleSheet } from 'react-native';
2
- import { COMP_GENERAL_CONSTANTS } from '../../constants/component-constants/general-constants/constants';
2
+ import { isRTLEnabled } from '../../utils';
3
3
 
4
4
  export const textQuoteStyles = (COLORS, FONT_SIZE) => StyleSheet.create({
5
5
  container: {
@@ -21,14 +21,14 @@ export const textQuoteStyles = (COLORS, FONT_SIZE) => StyleSheet.create({
21
21
  lineHeight: FONT_SIZE.h1 * 1.3,
22
22
  color: COLORS.BRAND_BLACK,
23
23
  opacity: 0.9,
24
- textAlign: COMP_GENERAL_CONSTANTS.textAlignment,
24
+ textAlign: isRTLEnabled() ? 'left' : 'auto',
25
25
  },
26
26
  attributionText: {
27
27
  fontSize: FONT_SIZE.h3,
28
28
  lineHeight: FONT_SIZE.h3 * 1.3,
29
29
  color: COLORS.BRAND_BLACK,
30
30
  alignItems: 'flex-end',
31
- textAlign: COMP_GENERAL_CONSTANTS.textAlignment,
31
+ textAlign: isRTLEnabled() ? 'left' : 'auto',
32
32
  },
33
33
  quoteTopBorder: {
34
34
  backgroundColor: COLORS.BRAND_1,
package/src/components/TextSummary/styles.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { StyleSheet } from 'react-native';
2
- import { COMP_GENERAL_CONSTANTS } from '../../constants/component-constants/general-constants/constants'
2
+ import { isRTLEnabled } from '../../utils';
3
3
 
4
4
  export const textSummaryStyles = (FONT_SIZE, COLORS) => StyleSheet.create({
5
5
  container: {
@@ -15,7 +15,7 @@ export const textSummaryStyles = (FONT_SIZE, COLORS) => StyleSheet.create({
15
15
  color: COLORS.BRAND_6,
16
16
  fontSize: FONT_SIZE.h2,
17
17
  lineHeight: FONT_SIZE.h2 * 1.3,
18
- textAlign: COMP_GENERAL_CONSTANTS.textAlignment
18
+ textAlign: isRTLEnabled() ? 'left' : 'auto',
19
19
  },
20
20
  summaryText: {
21
21
  color: COLORS.BRAND_1,
package/src/constants/component-constants/general-constants/constants.js CHANGED
@@ -1,27 +1,24 @@
1
- import { I18nManager } from 'react-native';
2
-
3
1
  export const COMP_GENERAL_CONSTANTS = {
4
- secondaryStoryCard: "COMP_GENERAL_SECONDARY_STORY",
5
- primaryStoryCard: "COMP_GENERAL_PRIMARY_STORY",
6
- secondaryStoryAuthor: "COMP_GENERAL_SECONDARY_STORY_AUTHOR",
7
- secondaryStoryPubishedAt: "COMP_GENERAL_SECONDARY_STORY_PUBLISHEDATE",
8
- primaryStoryAuthor: "COMP_GENERAL_PRIMARY_STORY_AUTHOR",
9
- primaryStoryPubishedAt: "COMP_GENERAL_PRIMARY_STORY_PUBLISHEDATE",
10
- secondaryStoryHeadline: "COMP_GENERAL_SECONDARY_STORY_HEADLINE",
11
- primaryStoryHeadline: "COMP_GENERAL_PRIMARY_STORY_HEADLINE",
12
- iconTextTouch: "COMP_GENERAL_ICON_TEXT_TOUCH",
13
- iconTextLabel: "COMP_GENERAL_ICON_TEXT_LABEL",
14
- collectionTitleTouch: "COMP_GENERAL_COLLECTION_TITLE",
15
- collectionTitleText: "COMP_GENERAL_COLLECTION_TITLE_TEXT",
16
- backNavigatorText: "COMP_GENERAL_BACK_NAVIGATOR_TEXT",
17
- backNavigatorTouch: "COMP_GENERAL_BACK_NAVIGATOR_TOUCH",
18
- customSwitch: "COMP_GENERAL_CUSTOM_SWITCH",
19
- primaryStoryReadTime: "COMP_GENERAL_PRIMARY_STORY_READTIME",
20
- secondaryStoryReadTime: "COMP_GENERAL_SECONDARY_STORY_READTIME",
21
- actionTextTouch: "COMP_GENERAL_ACTION_TEXT_TOUCH",
22
- buttonTouch: "COMP_GENERAL_BUTTON_TOUCH",
23
- headerLogoTouch: "COMP_GENERAL_HEADER_LOGO_TOUCH",
24
- radioButtonTouch: "COMP_GENERAL_RADIO",
25
- shareButtonTouch: "COMP_GENERAL_SHARE",
26
- textAlignment: I18nManager.isRTL ? "left" : "auto",
2
+ secondaryStoryCard: 'COMP_GENERAL_SECONDARY_STORY',
3
+ primaryStoryCard: 'COMP_GENERAL_PRIMARY_STORY',
4
+ secondaryStoryAuthor: 'COMP_GENERAL_SECONDARY_STORY_AUTHOR',
5
+ secondaryStoryPubishedAt: 'COMP_GENERAL_SECONDARY_STORY_PUBLISHEDATE',
6
+ primaryStoryAuthor: 'COMP_GENERAL_PRIMARY_STORY_AUTHOR',
7
+ primaryStoryPubishedAt: 'COMP_GENERAL_PRIMARY_STORY_PUBLISHEDATE',
8
+ secondaryStoryHeadline: 'COMP_GENERAL_SECONDARY_STORY_HEADLINE',
9
+ primaryStoryHeadline: 'COMP_GENERAL_PRIMARY_STORY_HEADLINE',
10
+ iconTextTouch: 'COMP_GENERAL_ICON_TEXT_TOUCH',
11
+ iconTextLabel: 'COMP_GENERAL_ICON_TEXT_LABEL',
12
+ collectionTitleTouch: 'COMP_GENERAL_COLLECTION_TITLE',
13
+ collectionTitleText: 'COMP_GENERAL_COLLECTION_TITLE_TEXT',
14
+ backNavigatorText: 'COMP_GENERAL_BACK_NAVIGATOR_TEXT',
15
+ backNavigatorTouch: 'COMP_GENERAL_BACK_NAVIGATOR_TOUCH',
16
+ customSwitch: 'COMP_GENERAL_CUSTOM_SWITCH',
17
+ primaryStoryReadTime: 'COMP_GENERAL_PRIMARY_STORY_READTIME',
18
+ secondaryStoryReadTime: 'COMP_GENERAL_SECONDARY_STORY_READTIME',
19
+ actionTextTouch: 'COMP_GENERAL_ACTION_TEXT_TOUCH',
20
+ buttonTouch: 'COMP_GENERAL_BUTTON_TOUCH',
21
+ headerLogoTouch: 'COMP_GENERAL_HEADER_LOGO_TOUCH',
22
+ radioButtonTouch: 'COMP_GENERAL_RADIO',
23
+ shareButtonTouch: 'COMP_GENERAL_SHARE',
27
24
  };
package/src/utils/index.js CHANGED
@@ -5,3 +5,4 @@ export * from './story-types';
5
5
  export * from './context';
6
6
  export * from './textUtils';
7
7
  export * from './testUtils';
8
+ export * from './rtlUtil';
package/src/utils/rtlUtil.js ADDED
@@ -0,0 +1,3 @@
1
+ import { I18nManager } from 'react-native';
2
+
3
+ export const isRTLEnabled = () => I18nManager.isRTL;