@instructure/ui-link 8.18.0 → 8.18.1-snapshot.2

package/LICENSE.md

@@ -0,0 +1,27 @@
+---
+title: The MIT License (MIT)
+category: Getting Started
+order: 9
+---
+
+# The MIT License (MIT)
+
+Copyright (c) 2015 Instructure, Inc.
+
+**Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions.**
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/es/Link/index.js

@@ -108,11 +108,15 @@ let Link = (_dec = withStyle(generateStyle, generateComponentTheme), _dec2 = tes
   }
 
   componentDidMount() {
-    this.props.makeStyles?.(this.makeStyleProps());
+    var _this$props$makeStyle, _this$props;
+
+    (_this$props$makeStyle = (_this$props = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props, this.makeStyleProps());
   }
 
   componentDidUpdate() {
-    this.props.makeStyles?.(this.makeStyleProps());
+    var _this$props$makeStyle2, _this$props2;
+
+    (_this$props$makeStyle2 = (_this$props2 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props2, this.makeStyleProps());
   }
 
   get containsTruncateText() {
@@ -169,24 +173,28 @@ let Link = (_dec = withStyle(generateStyle, generateComponentTheme), _dec2 = tes
   }
 
   renderIcon() {
+    var _this$props$styles;
+
     warn( // if display prop is used, warn about icon or TruncateText
     this.props.display === void 0, '[Link] Using the display property with an icon may cause layout issues.');
     return jsx("span", {
-      css: this.props.styles?.icon
+      css: (_this$props$styles = this.props.styles) === null || _this$props$styles === void 0 ? void 0 : _this$props$styles.icon
     }, callRenderProp(this.props.renderIcon));
   }
 
   render() {
-    const _this$props = this.props,
-          children = _this$props.children,
-          onClick = _this$props.onClick,
-          color = _this$props.color,
-          href = _this$props.href,
-          margin = _this$props.margin,
-          renderIcon = _this$props.renderIcon,
-          iconPlacement = _this$props.iconPlacement,
-          isWithinText = _this$props.isWithinText,
-          props = _objectWithoutProperties(_this$props, _excluded);
+    var _this$props$styles2;
+
+    const _this$props3 = this.props,
+          children = _this$props3.children,
+          onClick = _this$props3.onClick,
+          color = _this$props3.color,
+          href = _this$props3.href,
+          margin = _this$props3.margin,
+          renderIcon = _this$props3.renderIcon,
+          iconPlacement = _this$props3.iconPlacement,
+          isWithinText = _this$props3.isWithinText,
+          props = _objectWithoutProperties(_this$props3, _excluded);
 
     const interaction = this.interaction;
     const isDisabled = interaction === 'disabled';
@@ -206,7 +214,7 @@ let Link = (_dec = withStyle(generateStyle, generateComponentTheme), _dec2 = tes
       role: role,
       type: type,
       tabIndex: tabIndex,
-      css: this.props.styles?.link
+      css: (_this$props$styles2 = this.props.styles) === null || _this$props$styles2 === void 0 ? void 0 : _this$props$styles2.link
     }), renderIcon && iconPlacement === 'start' && this.renderIcon(), children, renderIcon && iconPlacement === 'end' && this.renderIcon());
   }
 

package/es/Link/theme.js

@@ -49,23 +49,23 @@ const generateComponentTheme = theme => {
   }; // maps the theme variables to component specific style variables
 
   const componentVariables = {
-    fontFamily: typography?.fontFamily,
-    fontWeight: typography?.fontWeightNormal,
-    color: colors?.textLink,
+    fontFamily: typography === null || typography === void 0 ? void 0 : typography.fontFamily,
+    fontWeight: typography === null || typography === void 0 ? void 0 : typography.fontWeightNormal,
+    color: colors === null || colors === void 0 ? void 0 : colors.textLink,
     textDecorationWithinText: 'underline',
     hoverTextDecorationWithinText: 'none',
     textDecorationOutsideText: 'none',
     hoverTextDecorationOutsideText: 'underline',
-    focusOutlineWidth: borders?.widthMedium,
-    focusOutlineColor: colors?.borderBrand,
-    focusOutlineStyle: borders?.style,
-    hoverColor: darken(colors?.textLink, 10),
-    colorInverse: colors?.textLight,
-    focusInverseOutlineColor: colors?.borderLightest,
-    focusInverseIconOutlineColor: colors?.borderLightest,
+    focusOutlineWidth: borders === null || borders === void 0 ? void 0 : borders.widthMedium,
+    focusOutlineColor: colors === null || colors === void 0 ? void 0 : colors.borderBrand,
+    focusOutlineStyle: borders === null || borders === void 0 ? void 0 : borders.style,
+    hoverColor: darken(colors === null || colors === void 0 ? void 0 : colors.textLink, 10),
+    colorInverse: colors === null || colors === void 0 ? void 0 : colors.textLight,
+    focusInverseOutlineColor: colors === null || colors === void 0 ? void 0 : colors.borderLightest,
+    focusInverseIconOutlineColor: colors === null || colors === void 0 ? void 0 : colors.borderLightest,
     iconSize: '1.125em',
     // make icon slightly larger than inherited font-size,
-    iconPlusTextMargin: spacing?.xxSmall
+    iconPlusTextMargin: spacing === null || spacing === void 0 ? void 0 : spacing.xxSmall
   };
   return { ...componentVariables,
     ...themeSpecificStyle[themeName]

package/lib/Link/index.js

@@ -115,11 +115,15 @@ let Link = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _de
   }
 
   componentDidMount() {
-    this.props.makeStyles?.(this.makeStyleProps());
+    var _this$props$makeStyle, _this$props;
+
+    (_this$props$makeStyle = (_this$props = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props, this.makeStyleProps());
   }
 
   componentDidUpdate() {
-    this.props.makeStyles?.(this.makeStyleProps());
+    var _this$props$makeStyle2, _this$props2;
+
+    (_this$props$makeStyle2 = (_this$props2 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props2, this.makeStyleProps());
   }
 
   get containsTruncateText() {
@@ -178,24 +182,28 @@ let Link = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _de
   }
 
   renderIcon() {
+    var _this$props$styles;
+
     (0, _console.logWarn)( // if display prop is used, warn about icon or TruncateText
     this.props.display === void 0, '[Link] Using the display property with an icon may cause layout issues.');
     return (0, _emotion.jsx)("span", {
-      css: this.props.styles?.icon
+      css: (_this$props$styles = this.props.styles) === null || _this$props$styles === void 0 ? void 0 : _this$props$styles.icon
     }, (0, _callRenderProp.callRenderProp)(this.props.renderIcon));
   }
 
   render() {
-    const _this$props = this.props,
-          children = _this$props.children,
-          onClick = _this$props.onClick,
-          color = _this$props.color,
-          href = _this$props.href,
-          margin = _this$props.margin,
-          renderIcon = _this$props.renderIcon,
-          iconPlacement = _this$props.iconPlacement,
-          isWithinText = _this$props.isWithinText,
-          props = (0, _objectWithoutProperties2.default)(_this$props, _excluded);
+    var _this$props$styles2;
+
+    const _this$props3 = this.props,
+          children = _this$props3.children,
+          onClick = _this$props3.onClick,
+          color = _this$props3.color,
+          href = _this$props3.href,
+          margin = _this$props3.margin,
+          renderIcon = _this$props3.renderIcon,
+          iconPlacement = _this$props3.iconPlacement,
+          isWithinText = _this$props3.isWithinText,
+          props = (0, _objectWithoutProperties2.default)(_this$props3, _excluded);
     const interaction = this.interaction;
     const isDisabled = interaction === 'disabled';
     const role = onClick && this.element !== 'button' ? 'button' : void 0;
@@ -214,7 +222,7 @@ let Link = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _de
       role: role,
       type: type,
       tabIndex: tabIndex,
-      css: this.props.styles?.link
+      css: (_this$props$styles2 = this.props.styles) === null || _this$props$styles2 === void 0 ? void 0 : _this$props$styles2.link
     }), renderIcon && iconPlacement === 'start' && this.renderIcon(), children, renderIcon && iconPlacement === 'end' && this.renderIcon());
   }
 

package/lib/Link/theme.js

@@ -57,23 +57,23 @@ const generateComponentTheme = theme => {
   }; // maps the theme variables to component specific style variables
 
   const componentVariables = {
-    fontFamily: typography?.fontFamily,
-    fontWeight: typography?.fontWeightNormal,
-    color: colors?.textLink,
+    fontFamily: typography === null || typography === void 0 ? void 0 : typography.fontFamily,
+    fontWeight: typography === null || typography === void 0 ? void 0 : typography.fontWeightNormal,
+    color: colors === null || colors === void 0 ? void 0 : colors.textLink,
     textDecorationWithinText: 'underline',
     hoverTextDecorationWithinText: 'none',
     textDecorationOutsideText: 'none',
     hoverTextDecorationOutsideText: 'underline',
-    focusOutlineWidth: borders?.widthMedium,
-    focusOutlineColor: colors?.borderBrand,
-    focusOutlineStyle: borders?.style,
-    hoverColor: (0, _darken.darken)(colors?.textLink, 10),
-    colorInverse: colors?.textLight,
-    focusInverseOutlineColor: colors?.borderLightest,
-    focusInverseIconOutlineColor: colors?.borderLightest,
+    focusOutlineWidth: borders === null || borders === void 0 ? void 0 : borders.widthMedium,
+    focusOutlineColor: colors === null || colors === void 0 ? void 0 : colors.borderBrand,
+    focusOutlineStyle: borders === null || borders === void 0 ? void 0 : borders.style,
+    hoverColor: (0, _darken.darken)(colors === null || colors === void 0 ? void 0 : colors.textLink, 10),
+    colorInverse: colors === null || colors === void 0 ? void 0 : colors.textLight,
+    focusInverseOutlineColor: colors === null || colors === void 0 ? void 0 : colors.borderLightest,
+    focusInverseIconOutlineColor: colors === null || colors === void 0 ? void 0 : colors.borderLightest,
     iconSize: '1.125em',
     // make icon slightly larger than inherited font-size,
-    iconPlusTextMargin: spacing?.xxSmall
+    iconPlusTextMargin: spacing === null || spacing === void 0 ? void 0 : spacing.xxSmall
   };
   return { ...componentVariables,
     ...themeSpecificStyle[themeName]

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@instructure/ui-link",
-  "version": "8.18.0",
+  "version": "8.18.1-snapshot.2+ca4c1ff9d",
   "description": "A component for creating links",
   "author": "Instructure, Inc. Engineering and Product Design",
   "module": "./es/index.js",
@@ -24,25 +24,25 @@
   "license": "MIT",
   "dependencies": {
     "@babel/runtime": "^7.13.10",
-    "@instructure/console": "8.18.0",
-    "@instructure/emotion": "8.18.0",
-    "@instructure/shared-types": "8.18.0",
-    "@instructure/ui-a11y-utils": "8.18.0",
-    "@instructure/ui-color-utils": "8.18.0",
-    "@instructure/ui-dom-utils": "8.18.0",
-    "@instructure/ui-icons": "8.18.0",
-    "@instructure/ui-prop-types": "8.18.0",
-    "@instructure/ui-react-utils": "8.18.0",
-    "@instructure/ui-testable": "8.18.0",
-    "@instructure/ui-view": "8.18.0",
+    "@instructure/console": "8.18.1-snapshot.2+ca4c1ff9d",
+    "@instructure/emotion": "8.18.1-snapshot.2+ca4c1ff9d",
+    "@instructure/shared-types": "8.18.1-snapshot.2+ca4c1ff9d",
+    "@instructure/ui-a11y-utils": "8.18.1-snapshot.2+ca4c1ff9d",
+    "@instructure/ui-color-utils": "8.18.1-snapshot.2+ca4c1ff9d",
+    "@instructure/ui-dom-utils": "8.18.1-snapshot.2+ca4c1ff9d",
+    "@instructure/ui-icons": "8.18.1-snapshot.2+ca4c1ff9d",
+    "@instructure/ui-prop-types": "8.18.1-snapshot.2+ca4c1ff9d",
+    "@instructure/ui-react-utils": "8.18.1-snapshot.2+ca4c1ff9d",
+    "@instructure/ui-testable": "8.18.1-snapshot.2+ca4c1ff9d",
+    "@instructure/ui-view": "8.18.1-snapshot.2+ca4c1ff9d",
     "prop-types": "^15"
   },
   "devDependencies": {
-    "@instructure/ui-babel-preset": "8.18.0",
-    "@instructure/ui-test-locator": "8.18.0",
-    "@instructure/ui-test-queries": "8.18.0",
-    "@instructure/ui-test-utils": "8.18.0",
-    "@instructure/ui-themes": "8.18.0"
+    "@instructure/ui-babel-preset": "8.18.1-snapshot.2+ca4c1ff9d",
+    "@instructure/ui-test-locator": "8.18.1-snapshot.2+ca4c1ff9d",
+    "@instructure/ui-test-queries": "8.18.1-snapshot.2+ca4c1ff9d",
+    "@instructure/ui-test-utils": "8.18.1-snapshot.2+ca4c1ff9d",
+    "@instructure/ui-themes": "8.18.1-snapshot.2+ca4c1ff9d"
   },
   "peerDependencies": {
     "react": ">=16.8 <=17"
@@ -50,5 +50,6 @@
   "publishConfig": {
     "access": "public"
   },
-  "sideEffects": false
+  "sideEffects": false,
+  "gitHead": "ca4c1ff9d3985151ae0758fb596de41652dbb58b"
 }