@telus-uds/components-base 0.0.2-prerelease.7 → 0.0.2-prerelease.8

package/lib/InputSupports/propTypes.js

@@ -1,36 +1,46 @@
-import PropTypes from 'prop-types';
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 const inputSupportProps = {
   types: {
     /**
      * The input label.
      */
-    label: PropTypes.string,
+    label: _propTypes.default.string,
 
     /**
      * A short description of the expected input.
      */
-    hint: PropTypes.string,
+    hint: _propTypes.default.string,
 
     /**
      * Position of the hint relative to label. Use `below` to display a larger hint below the label.
      */
-    hintPosition: PropTypes.oneOf(['inline', 'below']),
+    hintPosition: _propTypes.default.oneOf(['inline', 'below']),
 
     /**
      * A detailed description of validation error/success or additional instructions.
      * Visual variant is determined based on the `validation` prop.
      */
-    feedback: PropTypes.string,
+    feedback: _propTypes.default.string,
 
     /**
      * Content of an optional `Tooltip`. If set, a tooltip button will be shown next to the label.
      */
-    tooltip: PropTypes.string,
+    tooltip: _propTypes.default.string,
 
     /**
      * Use to visually mark an input as valid or invalid.
      */
-    validation: PropTypes.oneOf(['error', 'success'])
+    validation: _propTypes.default.oneOf(['error', 'success'])
   },
   select: ({
     label,
@@ -52,4 +62,5 @@ const inputSupportProps = {
     rest
   })
 };
-export default inputSupportProps;
+var _default = inputSupportProps;
+exports.default = _default;

package/lib/InputSupports/useInputSupports.js

@@ -0,0 +1,41 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _useUniqueId = _interopRequireDefault(require("../utils/useUniqueId"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const joinDefined = array => array.filter(item => item !== undefined).join(' ');
+
+const useInputSupports = ({
+  label,
+  feedback,
+  validation,
+  hint
+}) => {
+  const hasValidationError = validation === 'error';
+  const inputId = (0, _useUniqueId.default)('input');
+  const hintId = (0, _useUniqueId.default)('input-hint');
+  const feedbackId = (0, _useUniqueId.default)('input-feedback');
+  const a11yProps = {
+    accessibilityLabel: label,
+    accessibilityHint: joinDefined([!hasValidationError && feedback, hint]),
+    // native only -> replaced with describedBy on web
+    accessibilityDescribedBy: joinDefined([!hasValidationError && feedback && feedbackId, // feedback receives a11yRole=alert on error, so there's no need to include it here
+    hint && hintId]),
+    accessibilityInvalid: hasValidationError
+  };
+  return {
+    inputId,
+    hintId,
+    feedbackId,
+    a11yProps
+  };
+};
+
+var _default = useInputSupports;
+exports.default = _default;

package/lib/Link/ChevronLink.js

@@ -1,15 +1,30 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { useThemeTokensCallback } from '../ThemeProvider';
-import { selectTokens, getTokensPropType } from '../utils';
-import LinkBase from './LinkBase';
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _ThemeProvider = require("../ThemeProvider");
+
+var _utils = require("../utils");
+
+var _LinkBase = _interopRequireDefault(require("./LinkBase"));
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 /**
  * `ChevronLink` is a convenience wrapper around the `Link` component to enable "directional" links.
  * It effectively pre-binds left and right icons, and a directional translation of the icon on hover.
  *
  * ChevronLink is not intended to be deeply themable; variants passed to ChevronLink are forwarded to Link.
  */
-
 const ChevronLink = ({
   direction = 'right',
   children,
@@ -17,7 +32,7 @@ const ChevronLink = ({
   variant,
   ...linkProps
 }) => {
-  const getChevronTokens = useThemeTokensCallback('ChevronLink', tokens, variant);
+  const getChevronTokens = (0, _ThemeProvider.useThemeTokensCallback)('ChevronLink', tokens, variant);
 
   const applyChevronTokens = linkState => {
     const {
@@ -26,21 +41,23 @@ const ChevronLink = ({
       iconDisplace,
       ...otherTokens
     } = getChevronTokens(linkState);
-    return { ...selectTokens('Link', otherTokens),
+    return { ...(0, _utils.selectTokens)('Link', otherTokens),
       icon: direction === 'right' ? rightIcon : leftIcon,
       iconTranslateX: iconDisplace * (direction === 'right' ? 1 : -1) || 0
     };
   };
 
-  const getTokens = useThemeTokensCallback('Link', applyChevronTokens, variant);
-  return /*#__PURE__*/React.createElement(LinkBase, Object.assign({}, linkProps, {
+  const getTokens = (0, _ThemeProvider.useThemeTokensCallback)('Link', applyChevronTokens, variant);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_LinkBase.default, { ...linkProps,
     iconPosition: direction,
-    tokens: getTokens
-  }), children);
+    tokens: getTokens,
+    children: children
+  });
 };
 
-ChevronLink.propTypes = { ...LinkBase.propTypes,
-  tokens: getTokensPropType('ChevronLink', 'Link'),
-  direction: PropTypes.oneOf(['left', 'right'])
+ChevronLink.propTypes = { ..._LinkBase.default.propTypes,
+  tokens: (0, _utils.getTokensPropType)('ChevronLink', 'Link'),
+  direction: _propTypes.default.oneOf(['left', 'right'])
 };
-export default ChevronLink;
+var _default = ChevronLink;
+exports.default = _default;

package/lib/Link/InlinePressable.js

@@ -0,0 +1,50 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _Pressable = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Pressable"));
+
+var _StyleSheet = _interopRequireDefault(require("react-native-web/dist/cjs/exports/StyleSheet"));
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+/**
+ * @typedef {import('react-native').PressableProps} PressableProps
+ */
+
+/**
+ * InlinePressable is an alternative to React Native's Pressable that works better when nested
+ * inline inside Text. It accepts the same props as React Native's Pressable.
+ *
+ * On Web it simply passes its props to Pressable and defaults to `inline-flex` instead of `flex`.
+ *
+ * @param {PressableProps} PressableProps
+ */
+// React Native exports prop Types but not propTypes, use JSDoc types here rather than duplicate RN
+// eslint-disable-next-line react/prop-types
+const InlinePressable = ({
+  children,
+  style,
+  ...props
+}) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_Pressable.default, {
+  style: pressState => [staticStyles.inline, typeof style === 'function' ? style(pressState) : style],
+  ...props,
+  children: pressState => typeof children === 'function' ? children(pressState) : children
+});
+
+const staticStyles = _StyleSheet.default.create({
+  inline: {
+    // Stop Pressable defaulting to (block) flex
+    display: 'inline-flex'
+  }
+});
+
+var _default = InlinePressable;
+exports.default = _default;

package/lib/Link/InlinePressable.native.js

@@ -1,11 +1,30 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _Text = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Text"));
+
+var _TouchableWithoutFeedback = _interopRequireDefault(require("react-native-web/dist/cjs/exports/TouchableWithoutFeedback"));
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 /* eslint-disable camelcase */
-import React, { useState } from 'react';
-import { Text, TouchableWithoutFeedback } from 'react-native';
+
 /**
  * @typedef {import('react-native').PressableProps} PressableProps
  */
 // TouchableWithoutFeedback and Pressable have similar but not identical props APIs
-
 const pressablePropsToTouchable = ({
   unstable_pressDelay,
   android_disableSound,
@@ -44,13 +63,13 @@ const InlinePressable = ({
   style,
   ...rest
 }) => {
-  const [isFocused, setIsFocused] = useState(false);
+  const [isFocused, setIsFocused] = (0, _react.useState)(false);
 
   const handleFocus = () => setIsFocused(true);
 
   const handleBlur = () => setIsFocused(false);
 
-  const [isPressed, setIsPressed] = useState(false);
+  const [isPressed, setIsPressed] = (0, _react.useState)(false);
 
   const handlePressIn = () => setIsPressed(true);
 
@@ -64,15 +83,19 @@ const InlinePressable = ({
 
   };
   const currentStyle = typeof style === 'function' ? style(pressState) : style;
-  return /*#__PURE__*/React.createElement(TouchableWithoutFeedback, Object.assign({
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_TouchableWithoutFeedback.default, {
     onPress: onPress,
     onPressIn: handlePressIn,
     onPressOut: handlePressOut,
     onFocus: handleFocus,
-    onBlur: handleBlur
-  }, pressablePropsToTouchable(rest)), /*#__PURE__*/React.createElement(Text, {
-    style: currentStyle
-  }, typeof children === 'function' ? children(pressState) : children));
+    onBlur: handleBlur,
+    ...pressablePropsToTouchable(rest),
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.default, {
+      style: currentStyle,
+      children: typeof children === 'function' ? children(pressState) : children
+    })
+  });
 };
 
-export default InlinePressable;
+var _default = InlinePressable;
+exports.default = _default;

package/lib/Link/Link.js

@@ -1,6 +1,19 @@
-import React from 'react';
-import { useThemeTokensCallback } from '../ThemeProvider';
-import LinkBase from './LinkBase';
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _ThemeProvider = require("../ThemeProvider");
+
+var _LinkBase = _interopRequireDefault(require("./LinkBase"));
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const Link = ({
   href,
@@ -10,13 +23,16 @@ const Link = ({
   tokens,
   ...linkProps
 }) => {
-  const getTokens = useThemeTokensCallback('Link', tokens, variant);
-  return /*#__PURE__*/React.createElement(LinkBase, Object.assign({
+  const getTokens = (0, _ThemeProvider.useThemeTokensCallback)('Link', tokens, variant);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_LinkBase.default, {
     href: href,
     accessibilityRole: accessibilityRole,
-    tokens: getTokens
-  }, linkProps), children);
+    tokens: getTokens,
+    ...linkProps,
+    children: children
+  });
 };
 
-Link.propTypes = LinkBase.propTypes;
-export default Link;
+Link.propTypes = _LinkBase.default.propTypes;
+var _default = Link;
+exports.default = _default;

package/lib/Link/LinkBase.js

@@ -1,28 +1,51 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { Text, Platform, StyleSheet } from 'react-native';
-import { a11yProps, hrefAttrsProp, variantProp, linkProps, getTokensPropType } from '../utils/propTypes';
-import { resolvePressableTokens } from '../utils/pressability';
-import InlinePressable from './InlinePressable';
-import { applyTextStyles } from '../ThemeProvider';
-import { IconText, iconComponentPropTypes } from '../Icon';
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _Text = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Text"));
+
+var _Platform = _interopRequireDefault(require("react-native-web/dist/cjs/exports/Platform"));
+
+var _StyleSheet = _interopRequireDefault(require("react-native-web/dist/cjs/exports/StyleSheet"));
+
+var _propTypes2 = require("../utils/propTypes");
+
+var _pressability = require("../utils/pressability");
+
+var _InlinePressable = _interopRequireDefault(require("./InlinePressable"));
+
+var _ThemeProvider = require("../ThemeProvider");
+
+var _Icon = require("../Icon");
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const selectOuterBorderStyles = ({
   outerBorderColor,
   outerBorderWidth,
   outerBorderGap,
-  outerBorderRadius,
+  borderRadius,
   outerBorderOutline
 }) => // A view wrapper with a border on native messes up inline text alignment
 // so for now make focus styles strictly web-only
-Platform.OS === 'web' ? {
-  margin: -1 * (outerBorderGap + outerBorderWidth) || 0,
-  padding: outerBorderGap,
+_Platform.default.OS === 'web' ? {
   // Allow theme to define outline, or, turn off outline and use border if rounded corners required
   outline: outerBorderOutline,
-  borderWidth: outerBorderWidth,
-  borderColor: outerBorderColor,
-  borderRadius: outerBorderRadius,
+  ...(0, _ThemeProvider.applyOuterBorder)({
+    outerBorderColor,
+    outerBorderWidth,
+    outerBorderGap,
+    borderRadius
+  }),
   // Stops focus ring stretching horizontally if parent has display: block
   // width: fit-content isn't supported on Firefox; can't cascade props like CSS `width: fit-content; width: --moz-fit-content;`
   display: 'inline-flex'
@@ -36,7 +59,7 @@ const selectTextStyles = ({
   color,
   textDecorationLine: textLine,
   textDecorationStyle: textLineStyle,
-  ...Platform.select({
+  ..._Platform.default.select({
     web: {
       // TODO: https://github.com/telus/universal-design-system/issues/487
       transition: 'color 200ms'
@@ -49,7 +72,7 @@ const selectBlockStyles = ({
   blockFontSize,
   blockLineHeight,
   blockFontName
-}) => applyTextStyles({
+}) => (0, _ThemeProvider.applyTextStyles)({
   fontWeight: blockFontWeight,
   fontSize: blockFontSize,
   lineHeight: blockLineHeight,
@@ -106,83 +129,88 @@ const LinkBase = ({
   const {
     hrefAttrs,
     rest
-  } = hrefAttrsProp.bundle(props);
-  const linkPropSet = linkProps.select({
+  } = _propTypes2.hrefAttrsProp.bundle(props);
+
+  const linkPropSet = _propTypes2.linkProps.select({
     accessibilityRole,
     href,
-    onPress: linkProps.handleHref({
+    onPress: _propTypes2.linkProps.handleHref({
       href,
       onPress
     }),
-    ...hrefAttrsProp.spread(hrefAttrs),
+    hrefAttrs,
     ...rest
   });
 
-  const resolveTokens = pressState => resolvePressableTokens(tokens, pressState, {
+  const resolveLinkTokens = pressState => (0, _pressability.resolvePressableTokens)(tokens, pressState, {
     iconPosition
   }); // On web, this makes focus rings wrap only the link, not the entire block
 
 
-  const blockLeftStyle = Platform.OS === 'web' && staticStyles.blockLeft;
-  return /*#__PURE__*/React.createElement(InlinePressable, Object.assign({}, linkPropSet, {
+  const blockLeftStyle = _Platform.default.OS === 'web' && staticStyles.blockLeft;
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_InlinePressable.default, { ...linkPropSet,
     style: linkState => {
-      const themeTokens = resolveTokens(linkState);
+      const themeTokens = resolveLinkTokens(linkState);
       const outerBorderStyles = selectOuterBorderStyles(themeTokens);
       const hasIcon = Boolean(icon || themeTokens.icon);
       return [outerBorderStyles, blockLeftStyle, hasIcon && staticStyles.rowContainer];
+    },
+    children: linkState => {
+      const themeTokens = resolveLinkTokens(linkState);
+      const textStyles = selectTextStyles(themeTokens);
+      const iconTokens = selectIconTokens(themeTokens); // TODO: may need to apply some smarter text inheritance here if inline to avoid native
+      // issues like double-application of line heights breaking align-items: baseline
+
+      const blockTextStyles = selectBlockStyles(themeTokens);
+      const IconComponent = icon || themeTokens.icon;
+      const {
+        iconSpace
+      } = themeTokens;
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Icon.IconText, {
+        icon: IconComponent,
+        iconPosition: iconPosition,
+        space: iconSpace,
+        iconProps: { ...iconProps,
+          tokens: iconTokens
+        },
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Text.default, {
+          style: [textStyles, blockTextStyles, staticStyles.baseline],
+          children: children
+        })
+      });
     }
-  }), linkState => {
-    const themeTokens = resolveTokens(linkState);
-    const textStyles = selectTextStyles(themeTokens);
-    const iconTokens = selectIconTokens(themeTokens); // TODO: may need to apply some smarter text inheritance here if inline to avoid native
-    // issues like double-application of line heights breaking align-items: baseline
-
-    const blockTextStyles = selectBlockStyles(themeTokens);
-    const IconComponent = icon || themeTokens.icon;
-    const {
-      iconSpace
-    } = themeTokens;
-    return /*#__PURE__*/React.createElement(IconText, {
-      icon: IconComponent,
-      iconPosition: iconPosition,
-      space: iconSpace,
-      iconProps: { ...iconProps,
-        tokens: iconTokens
-      }
-    }, /*#__PURE__*/React.createElement(Text, {
-      style: [textStyles, blockTextStyles, staticStyles.baseline]
-    }, children));
   });
 };
 
-LinkBase.propTypes = { ...a11yProps.types,
-  ...linkProps.types,
-  tokens: getTokensPropType('Link'),
-  variant: variantProp.propType,
+LinkBase.propTypes = { ..._propTypes2.a11yProps.types,
+  ..._propTypes2.linkProps.types,
+  tokens: (0, _propTypes2.getTokensPropType)('Link'),
+  variant: _propTypes2.variantProp.propType,
 
   /**
    * Optional variant that may be passed down to the link's icon if there is one
    */
-  iconProps: PropTypes.exact(iconComponentPropTypes),
+  iconProps: _propTypes.default.exact(_Icon.iconComponentPropTypes),
 
   /**
    * A function component for an SVG icon to render inside the link. Inherits size and color from
    * the link and any Typography the link is nested inside.
    */
-  icon: PropTypes.func,
+  icon: _propTypes.default.func,
 
   /**
    * When `icon` is provided, use `iconPosition` to place the Icon to the left or right side of Link.
    */
-  iconPosition: PropTypes.oneOf(['left', 'right']),
+  iconPosition: _propTypes.default.oneOf(['left', 'right']),
 
   /**
    * On Web if href is passed, React Native Web maps this object's props to
-   * `rel`, `target` and (>= RNW 0.15.0) `download` attrs.
+   * `rel`, `target` and `download` attrs.
    */
-  hrefAttrs: PropTypes.shape(hrefAttrsProp.types)
+  hrefAttrs: _propTypes.default.shape(_propTypes2.hrefAttrsProp.types)
 };
-const staticStyles = StyleSheet.create({
+
+const staticStyles = _StyleSheet.default.create({
   blockLeft: {
     alignSelf: 'flex-start'
   },
@@ -195,4 +223,6 @@ const staticStyles = StyleSheet.create({
     alignSelf: 'baseline'
   }
 });
-export default LinkBase;
+
+var _default = LinkBase;
+exports.default = _default;

package/lib/Link/TextButton.js

@@ -1,13 +1,29 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { useThemeTokensCallback } from '../ThemeProvider';
-import LinkBase from './LinkBase';
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _ThemeProvider = require("../ThemeProvider");
+
+var _LinkBase = _interopRequireDefault(require("./LinkBase"));
+
+var _jsxRuntime = require("react/jsx-runtime");
+
+var _TextButton$propTypes;
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 /**
  * `TextButton` is a button that looks like a Link. It uses the same theming and variants as
  * Link but has the accessibility role of a `Button`. It should be used for actions that
  * take place on the current page, or for navigation within an app.
  */
-
 const TextButton = ({
   onPress,
   children,
@@ -18,20 +34,23 @@ const TextButton = ({
   accessibilityRole = 'button',
   ...linkProps
 }) => {
-  const getTokens = useThemeTokensCallback('Link', tokens, variant);
-  return /*#__PURE__*/React.createElement(LinkBase, Object.assign({
+  const getTokens = (0, _ThemeProvider.useThemeTokensCallback)('Link', tokens, variant);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_LinkBase.default, {
     onPress: onPress,
     accessibilityRole: accessibilityRole,
-    tokens: getTokens
-  }, linkProps), children);
+    tokens: getTokens,
+    ...linkProps,
+    children: children
+  });
 };
 
-TextButton.propTypes = { ...LinkBase.propTypes,
-  onPress: PropTypes.func.isRequired
+TextButton.propTypes = { ..._LinkBase.default.propTypes,
+  onPress: _propTypes.default.func.isRequired
 }; // Remove incompatible Link prop (if this build includes propTypes)
 // TODO: test if this works with web navigation in omniplatform React Navigation
 // https://github.com/telus/universal-design-system/issues/665
 // eslint-disable-next-line react/forbid-foreign-prop-types
 
-if (TextButton.propTypes?.href) delete TextButton.propTypes.href;
-export default TextButton;
+if ((_TextButton$propTypes = TextButton.propTypes) !== null && _TextButton$propTypes !== void 0 && _TextButton$propTypes.href) delete TextButton.propTypes.href;
+var _default = TextButton;
+exports.default = _default;