@instructure/ui-billboard 8.17.1-snapshot.82 → 8.18.1-snapshot.1

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.
package/CHANGELOG.md CHANGED
@@ -3,6 +3,10 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ # [8.18.0](https://github.com/instructure/instructure-ui/compare/v8.17.0...v8.18.0) (2022-02-23)
7
+
8
+ **Note:** Version bump only for package @instructure/ui-billboard
9
+
6
10
  # [8.17.0](https://github.com/instructure/instructure-ui/compare/v8.16.0...v8.17.0) (2022-02-07)
7
11
 
8
12
  ### Bug Fixes
@@ -69,21 +69,25 @@ let Billboard = (_dec = withStyle(generateStyle, generateComponentTheme), _dec(_
69
69
  }
70
70
 
71
71
  componentDidMount() {
72
- this.props.makeStyles?.();
72
+ var _this$props$makeStyle, _this$props2;
73
+
74
+ (_this$props$makeStyle = (_this$props2 = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props2);
73
75
  }
74
76
 
75
77
  componentDidUpdate() {
76
- this.props.makeStyles?.();
78
+ var _this$props$makeStyle2, _this$props3;
79
+
80
+ (_this$props$makeStyle2 = (_this$props3 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props3);
77
81
  }
78
82
 
79
83
  renderHeading() {
80
- const _this$props2 = this.props,
81
- headingLevel = _this$props2.headingLevel,
82
- headingAs = _this$props2.headingAs,
83
- heading = _this$props2.heading,
84
- styles = _this$props2.styles;
84
+ const _this$props4 = this.props,
85
+ headingLevel = _this$props4.headingLevel,
86
+ headingAs = _this$props4.headingAs,
87
+ heading = _this$props4.heading,
88
+ styles = _this$props4.styles;
85
89
  return jsx("span", {
86
- css: styles?.heading
90
+ css: styles === null || styles === void 0 ? void 0 : styles.heading
87
91
  }, jsx(Heading, {
88
92
  level: headingLevel,
89
93
  as: headingAs,
@@ -112,27 +116,27 @@ let Billboard = (_dec = withStyle(generateStyle, generateComponentTheme), _dec(_
112
116
  }
113
117
 
114
118
  renderContent() {
115
- const _this$props3 = this.props,
116
- heading = _this$props3.heading,
117
- message = _this$props3.message,
118
- hero = _this$props3.hero,
119
- styles = _this$props3.styles;
119
+ const _this$props5 = this.props,
120
+ heading = _this$props5.heading,
121
+ message = _this$props5.message,
122
+ hero = _this$props5.hero,
123
+ styles = _this$props5.styles;
120
124
  return jsx("span", {
121
- css: styles?.content
125
+ css: styles === null || styles === void 0 ? void 0 : styles.content
122
126
  }, hero && jsx("span", {
123
- css: styles?.hero
127
+ css: styles === null || styles === void 0 ? void 0 : styles.hero
124
128
  }, this.renderHero()), heading && this.renderHeading(), message && jsx("span", {
125
- css: styles?.message
129
+ css: styles === null || styles === void 0 ? void 0 : styles.message
126
130
  }, callRenderProp(message)));
127
131
  }
128
132
 
129
133
  render() {
130
- const _this$props4 = this.props,
131
- href = _this$props4.href,
132
- disabled = _this$props4.disabled,
133
- readOnly = _this$props4.readOnly,
134
- margin = _this$props4.margin,
135
- styles = _this$props4.styles;
134
+ const _this$props6 = this.props,
135
+ href = _this$props6.href,
136
+ disabled = _this$props6.disabled,
137
+ readOnly = _this$props6.readOnly,
138
+ margin = _this$props6.margin,
139
+ styles = _this$props6.styles;
136
140
  const Element = getElementType(Billboard, this.props);
137
141
  return jsx(View, {
138
142
  as: "div",
@@ -141,7 +145,7 @@ let Billboard = (_dec = withStyle(generateStyle, generateComponentTheme), _dec(_
141
145
  type: Element === 'button' ? 'button' : void 0,
142
146
  as: Element,
143
147
  elementRef: this.handleRef,
144
- css: styles?.billboard,
148
+ css: styles === null || styles === void 0 ? void 0 : styles.billboard,
145
149
  href: href,
146
150
  onClick: this.handleClick,
147
151
  disabled: disabled,
@@ -43,27 +43,27 @@ const generateComponentTheme = theme => {
43
43
  }
44
44
  };
45
45
  const componentVariables = {
46
- fontFamily: typography?.fontFamily,
47
- paddingSmall: spacing?.small,
48
- paddingMedium: spacing?.medium,
49
- paddingLarge: spacing?.medium,
50
- iconColor: colors?.textDark,
51
- mediumMargin: spacing?.small,
52
- largeMargin: spacing?.medium,
53
- iconHoverColor: colors?.textLink,
54
- backgroundColor: colors?.backgroundLightest,
55
- iconHoverColorInverse: colors?.textLightest,
56
- buttonBorderWidth: borders?.widthMedium,
57
- buttonBorderRadius: borders?.radiusLarge,
58
- messageColor: colors?.textDark,
59
- messageColorClickable: colors?.textLink,
60
- messageColorInverse: colors?.textLight,
61
- messageFontSizeSmall: typography?.fontSizeSmall,
62
- messageFontSizeMedium: typography?.fontSizeMedium,
63
- messageFontSizeLarge: typography?.fontSizeLarge,
64
- clickableActiveBg: colors?.backgroundBrand,
65
- clickableActiveText: colors?.textLightest,
66
- buttonBorderStyle: borders?.style,
46
+ fontFamily: typography === null || typography === void 0 ? void 0 : typography.fontFamily,
47
+ paddingSmall: spacing === null || spacing === void 0 ? void 0 : spacing.small,
48
+ paddingMedium: spacing === null || spacing === void 0 ? void 0 : spacing.medium,
49
+ paddingLarge: spacing === null || spacing === void 0 ? void 0 : spacing.medium,
50
+ iconColor: colors === null || colors === void 0 ? void 0 : colors.textDark,
51
+ mediumMargin: spacing === null || spacing === void 0 ? void 0 : spacing.small,
52
+ largeMargin: spacing === null || spacing === void 0 ? void 0 : spacing.medium,
53
+ iconHoverColor: colors === null || colors === void 0 ? void 0 : colors.textLink,
54
+ backgroundColor: colors === null || colors === void 0 ? void 0 : colors.backgroundLightest,
55
+ iconHoverColorInverse: colors === null || colors === void 0 ? void 0 : colors.textLightest,
56
+ buttonBorderWidth: borders === null || borders === void 0 ? void 0 : borders.widthMedium,
57
+ buttonBorderRadius: borders === null || borders === void 0 ? void 0 : borders.radiusLarge,
58
+ messageColor: colors === null || colors === void 0 ? void 0 : colors.textDark,
59
+ messageColorClickable: colors === null || colors === void 0 ? void 0 : colors.textLink,
60
+ messageColorInverse: colors === null || colors === void 0 ? void 0 : colors.textLight,
61
+ messageFontSizeSmall: typography === null || typography === void 0 ? void 0 : typography.fontSizeSmall,
62
+ messageFontSizeMedium: typography === null || typography === void 0 ? void 0 : typography.fontSizeMedium,
63
+ messageFontSizeLarge: typography === null || typography === void 0 ? void 0 : typography.fontSizeLarge,
64
+ clickableActiveBg: colors === null || colors === void 0 ? void 0 : colors.backgroundBrand,
65
+ clickableActiveText: colors === null || colors === void 0 ? void 0 : colors.textLightest,
66
+ buttonBorderStyle: borders === null || borders === void 0 ? void 0 : borders.style,
67
67
  buttonHoverBorderStyle: 'dashed'
68
68
  };
69
69
  return { ...componentVariables,
@@ -64,21 +64,25 @@ let Billboard = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default)
64
64
  }
65
65
 
66
66
  componentDidMount() {
67
- this.props.makeStyles?.();
67
+ var _this$props$makeStyle, _this$props2;
68
+
69
+ (_this$props$makeStyle = (_this$props2 = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props2);
68
70
  }
69
71
 
70
72
  componentDidUpdate() {
71
- this.props.makeStyles?.();
73
+ var _this$props$makeStyle2, _this$props3;
74
+
75
+ (_this$props$makeStyle2 = (_this$props3 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props3);
72
76
  }
73
77
 
74
78
  renderHeading() {
75
- const _this$props2 = this.props,
76
- headingLevel = _this$props2.headingLevel,
77
- headingAs = _this$props2.headingAs,
78
- heading = _this$props2.heading,
79
- styles = _this$props2.styles;
79
+ const _this$props4 = this.props,
80
+ headingLevel = _this$props4.headingLevel,
81
+ headingAs = _this$props4.headingAs,
82
+ heading = _this$props4.heading,
83
+ styles = _this$props4.styles;
80
84
  return (0, _emotion.jsx)("span", {
81
- css: styles?.heading
85
+ css: styles === null || styles === void 0 ? void 0 : styles.heading
82
86
  }, (0, _emotion.jsx)(_Heading.Heading, {
83
87
  level: headingLevel,
84
88
  as: headingAs,
@@ -107,27 +111,27 @@ let Billboard = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default)
107
111
  }
108
112
 
109
113
  renderContent() {
110
- const _this$props3 = this.props,
111
- heading = _this$props3.heading,
112
- message = _this$props3.message,
113
- hero = _this$props3.hero,
114
- styles = _this$props3.styles;
114
+ const _this$props5 = this.props,
115
+ heading = _this$props5.heading,
116
+ message = _this$props5.message,
117
+ hero = _this$props5.hero,
118
+ styles = _this$props5.styles;
115
119
  return (0, _emotion.jsx)("span", {
116
- css: styles?.content
120
+ css: styles === null || styles === void 0 ? void 0 : styles.content
117
121
  }, hero && (0, _emotion.jsx)("span", {
118
- css: styles?.hero
122
+ css: styles === null || styles === void 0 ? void 0 : styles.hero
119
123
  }, this.renderHero()), heading && this.renderHeading(), message && (0, _emotion.jsx)("span", {
120
- css: styles?.message
124
+ css: styles === null || styles === void 0 ? void 0 : styles.message
121
125
  }, (0, _callRenderProp.callRenderProp)(message)));
122
126
  }
123
127
 
124
128
  render() {
125
- const _this$props4 = this.props,
126
- href = _this$props4.href,
127
- disabled = _this$props4.disabled,
128
- readOnly = _this$props4.readOnly,
129
- margin = _this$props4.margin,
130
- styles = _this$props4.styles;
129
+ const _this$props6 = this.props,
130
+ href = _this$props6.href,
131
+ disabled = _this$props6.disabled,
132
+ readOnly = _this$props6.readOnly,
133
+ margin = _this$props6.margin,
134
+ styles = _this$props6.styles;
131
135
  const Element = (0, _getElementType.getElementType)(Billboard, this.props);
132
136
  return (0, _emotion.jsx)(_View.View, {
133
137
  as: "div",
@@ -136,7 +140,7 @@ let Billboard = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default)
136
140
  type: Element === 'button' ? 'button' : void 0,
137
141
  as: Element,
138
142
  elementRef: this.handleRef,
139
- css: styles?.billboard,
143
+ css: styles === null || styles === void 0 ? void 0 : styles.billboard,
140
144
  href: href,
141
145
  onClick: this.handleClick,
142
146
  disabled: disabled,
@@ -50,27 +50,27 @@ const generateComponentTheme = theme => {
50
50
  }
51
51
  };
52
52
  const componentVariables = {
53
- fontFamily: typography?.fontFamily,
54
- paddingSmall: spacing?.small,
55
- paddingMedium: spacing?.medium,
56
- paddingLarge: spacing?.medium,
57
- iconColor: colors?.textDark,
58
- mediumMargin: spacing?.small,
59
- largeMargin: spacing?.medium,
60
- iconHoverColor: colors?.textLink,
61
- backgroundColor: colors?.backgroundLightest,
62
- iconHoverColorInverse: colors?.textLightest,
63
- buttonBorderWidth: borders?.widthMedium,
64
- buttonBorderRadius: borders?.radiusLarge,
65
- messageColor: colors?.textDark,
66
- messageColorClickable: colors?.textLink,
67
- messageColorInverse: colors?.textLight,
68
- messageFontSizeSmall: typography?.fontSizeSmall,
69
- messageFontSizeMedium: typography?.fontSizeMedium,
70
- messageFontSizeLarge: typography?.fontSizeLarge,
71
- clickableActiveBg: colors?.backgroundBrand,
72
- clickableActiveText: colors?.textLightest,
73
- buttonBorderStyle: borders?.style,
53
+ fontFamily: typography === null || typography === void 0 ? void 0 : typography.fontFamily,
54
+ paddingSmall: spacing === null || spacing === void 0 ? void 0 : spacing.small,
55
+ paddingMedium: spacing === null || spacing === void 0 ? void 0 : spacing.medium,
56
+ paddingLarge: spacing === null || spacing === void 0 ? void 0 : spacing.medium,
57
+ iconColor: colors === null || colors === void 0 ? void 0 : colors.textDark,
58
+ mediumMargin: spacing === null || spacing === void 0 ? void 0 : spacing.small,
59
+ largeMargin: spacing === null || spacing === void 0 ? void 0 : spacing.medium,
60
+ iconHoverColor: colors === null || colors === void 0 ? void 0 : colors.textLink,
61
+ backgroundColor: colors === null || colors === void 0 ? void 0 : colors.backgroundLightest,
62
+ iconHoverColorInverse: colors === null || colors === void 0 ? void 0 : colors.textLightest,
63
+ buttonBorderWidth: borders === null || borders === void 0 ? void 0 : borders.widthMedium,
64
+ buttonBorderRadius: borders === null || borders === void 0 ? void 0 : borders.radiusLarge,
65
+ messageColor: colors === null || colors === void 0 ? void 0 : colors.textDark,
66
+ messageColorClickable: colors === null || colors === void 0 ? void 0 : colors.textLink,
67
+ messageColorInverse: colors === null || colors === void 0 ? void 0 : colors.textLight,
68
+ messageFontSizeSmall: typography === null || typography === void 0 ? void 0 : typography.fontSizeSmall,
69
+ messageFontSizeMedium: typography === null || typography === void 0 ? void 0 : typography.fontSizeMedium,
70
+ messageFontSizeLarge: typography === null || typography === void 0 ? void 0 : typography.fontSizeLarge,
71
+ clickableActiveBg: colors === null || colors === void 0 ? void 0 : colors.backgroundBrand,
72
+ clickableActiveText: colors === null || colors === void 0 ? void 0 : colors.textLightest,
73
+ buttonBorderStyle: borders === null || borders === void 0 ? void 0 : borders.style,
74
74
  buttonHoverBorderStyle: 'dashed'
75
75
  };
76
76
  return { ...componentVariables,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@instructure/ui-billboard",
3
- "version": "8.17.1-snapshot.82+96244a097",
3
+ "version": "8.18.1-snapshot.1+669aa5892",
4
4
  "description": "A UI component to display empty states, 404 pages, redirects, etc.",
5
5
  "author": "Instructure, Inc. Engineering and Product Design",
6
6
  "module": "./es/index.js",
@@ -23,20 +23,20 @@
23
23
  },
24
24
  "license": "MIT",
25
25
  "devDependencies": {
26
- "@instructure/ui-babel-preset": "8.17.1-snapshot.82+96244a097",
27
- "@instructure/ui-color-utils": "8.17.1-snapshot.82+96244a097",
28
- "@instructure/ui-icons": "8.17.1-snapshot.82+96244a097",
29
- "@instructure/ui-test-utils": "8.17.1-snapshot.82+96244a097",
30
- "@instructure/ui-themes": "8.17.1-snapshot.82+96244a097"
26
+ "@instructure/ui-babel-preset": "8.18.1-snapshot.1+669aa5892",
27
+ "@instructure/ui-color-utils": "8.18.1-snapshot.1+669aa5892",
28
+ "@instructure/ui-icons": "8.18.1-snapshot.1+669aa5892",
29
+ "@instructure/ui-test-utils": "8.18.1-snapshot.1+669aa5892",
30
+ "@instructure/ui-themes": "8.18.1-snapshot.1+669aa5892"
31
31
  },
32
32
  "dependencies": {
33
33
  "@babel/runtime": "^7.13.10",
34
- "@instructure/emotion": "8.17.1-snapshot.82+96244a097",
35
- "@instructure/shared-types": "8.17.1-snapshot.82+96244a097",
36
- "@instructure/ui-heading": "8.17.1-snapshot.82+96244a097",
37
- "@instructure/ui-img": "8.17.1-snapshot.82+96244a097",
38
- "@instructure/ui-react-utils": "8.17.1-snapshot.82+96244a097",
39
- "@instructure/ui-view": "8.17.1-snapshot.82+96244a097",
34
+ "@instructure/emotion": "8.18.1-snapshot.1+669aa5892",
35
+ "@instructure/shared-types": "8.18.1-snapshot.1+669aa5892",
36
+ "@instructure/ui-heading": "8.18.1-snapshot.1+669aa5892",
37
+ "@instructure/ui-img": "8.18.1-snapshot.1+669aa5892",
38
+ "@instructure/ui-react-utils": "8.18.1-snapshot.1+669aa5892",
39
+ "@instructure/ui-view": "8.18.1-snapshot.1+669aa5892",
40
40
  "prop-types": "^15"
41
41
  },
42
42
  "peerDependencies": {
@@ -46,5 +46,5 @@
46
46
  "access": "public"
47
47
  },
48
48
  "sideEffects": false,
49
- "gitHead": "96244a097dffef5f10bbe7979c580581c787083e"
49
+ "gitHead": "669aa58926b123028bcb9e39427d36910b78b0d1"
50
50
  }