@carbon/react 1.16.0 → 1.17.0-rc.1

package/es/components/Tile/index.js

@@ -1,19 +0,0 @@
-/**
- * Copyright IBM Corp. 2016, 2022
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-import * as FeatureFlags from '@carbon/feature-flags';
-import { Tile as Tile$1, ClickableTile as ClickableTile$1, SelectableTile as SelectableTile$1, ExpandableTile as ExpandableTile$1, TileAboveTheFoldContent as TileAboveTheFoldContent$1, TileBelowTheFoldContent as TileBelowTheFoldContent$1 } from './next/Tile.js';
-import { Tile as Tile$2, ClickableTile as ClickableTile$2, SelectableTile as SelectableTile$2, ExpandableTile as ExpandableTile$2, TileAboveTheFoldContent as TileAboveTheFoldContent$2, TileBelowTheFoldContent as TileBelowTheFoldContent$2 } from './Tile.js';
-
-var Tile = FeatureFlags.enabled('enable-v11-release') ? Tile$1 : Tile$2;
-var ClickableTile = FeatureFlags.enabled('enable-v11-release') ? ClickableTile$1 : ClickableTile$2;
-var SelectableTile = FeatureFlags.enabled('enable-v11-release') ? SelectableTile$1 : SelectableTile$2;
-var ExpandableTile = FeatureFlags.enabled('enable-v11-release') ? ExpandableTile$1 : ExpandableTile$2;
-var TileAboveTheFoldContent = FeatureFlags.enabled('enable-v11-release') ? TileAboveTheFoldContent$1 : TileAboveTheFoldContent$2;
-var TileBelowTheFoldContent = FeatureFlags.enabled('enable-v11-release') ? TileBelowTheFoldContent$1 : TileBelowTheFoldContent$2;
-
-export { ClickableTile, ExpandableTile, SelectableTile, Tile, TileAboveTheFoldContent, TileBelowTheFoldContent };

package/es/components/Tile/next/Tile.js

@@ -1,604 +0,0 @@
-/**
- * Copyright IBM Corp. 2016, 2022
- *
- * This source code is licensed under the Apache-2.0 license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-import { objectWithoutProperties as _objectWithoutProperties, defineProperty as _defineProperty, extends as _extends, slicedToArray as _slicedToArray } from '../../../_virtual/_rollupPluginBabelHelpers.js';
-import React__default, { useState, useRef, useEffect } from 'react';
-import PropTypes from 'prop-types';
-import cx from 'classnames';
-import { CheckboxCheckedFilled, Checkbox, ChevronDown } from '@carbon/icons-react';
-import Link from '../../Link/Link.js';
-import deprecate from '../../../prop-types/deprecate.js';
-import { composeEventHandlers } from '../../../tools/events.js';
-import { usePrefix } from '../../../internal/usePrefix.js';
-import useIsomorphicEffect from '../../../internal/useIsomorphicEffect.js';
-import { getInteractiveContent } from '../../../internal/useNoInteractiveChildren.js';
-import { matches } from '../../../internal/keyboard/match.js';
-import { Enter, Space } from '../../../internal/keyboard/keys.js';
-
-var _CheckboxCheckedFille, _Checkbox, _ChevronDown, _ChevronDown2;
-
-var _excluded = ["children", "className", "light"],
-    _excluded2 = ["children", "className", "clicked", "href", "light", "onClick", "onKeyDown"],
-    _excluded3 = ["children", "className", "disabled", "id", "light", "name", "onClick", "onChange", "onKeyDown", "selected", "tabIndex", "title", "value"],
-    _excluded4 = ["tabIndex", "className", "children", "expanded", "tileMaxHeight", "tilePadding", "onClick", "onKeyUp", "tileCollapsedIconText", "tileExpandedIconText", "tileCollapsedLabel", "tileExpandedLabel", "light"];
-var Tile = /*#__PURE__*/React__default.forwardRef(function Tile(_ref, ref) {
-  var children = _ref.children,
-      className = _ref.className,
-      _ref$light = _ref.light,
-      light = _ref$light === void 0 ? false : _ref$light,
-      rest = _objectWithoutProperties(_ref, _excluded);
-
-  var prefix = usePrefix();
-  var tileClasses = cx("".concat(prefix, "--tile"), _defineProperty({}, "".concat(prefix, "--tile--light"), light), className);
-  return /*#__PURE__*/React__default.createElement("div", _extends({
-    className: tileClasses,
-    ref: ref
-  }, rest), children);
-});
-Tile.displayName = 'Tile';
-Tile.propTypes = {
-  /**
-   * The child nodes.
-   */
-  children: PropTypes.node,
-
-  /**
-   * The CSS class names.
-   */
-  className: PropTypes.string,
-
-  /**
-   * `true` to use the light version. For use on $ui-01 backgrounds only.
-   * Don't use this to make tile background color same as container background color.
-   */
-  light: deprecate(PropTypes.bool, 'The `light` prop for `Tile` is no longer needed and has been deprecated. It will be removed in the next major release. Use the Layer component instead.')
-};
-var ClickableTile = /*#__PURE__*/React__default.forwardRef(function ClickableTile(_ref2, ref) {
-  var _cx2;
-
-  var children = _ref2.children,
-      className = _ref2.className,
-      _ref2$clicked = _ref2.clicked,
-      clicked = _ref2$clicked === void 0 ? false : _ref2$clicked,
-      href = _ref2.href,
-      light = _ref2.light,
-      _ref2$onClick = _ref2.onClick,
-      onClick = _ref2$onClick === void 0 ? function () {} : _ref2$onClick,
-      _ref2$onKeyDown = _ref2.onKeyDown,
-      onKeyDown = _ref2$onKeyDown === void 0 ? function () {} : _ref2$onKeyDown,
-      rest = _objectWithoutProperties(_ref2, _excluded2);
-
-  var prefix = usePrefix();
-  var classes = cx("".concat(prefix, "--tile"), "".concat(prefix, "--tile--clickable"), (_cx2 = {}, _defineProperty(_cx2, "".concat(prefix, "--tile--is-clicked"), clicked), _defineProperty(_cx2, "".concat(prefix, "--tile--light"), light), _cx2), className);
-
-  var _useState = useState(clicked),
-      _useState2 = _slicedToArray(_useState, 2),
-      isSelected = _useState2[0],
-      setIsSelected = _useState2[1];
-
-  function handleOnClick(evt) {
-    evt.persist();
-    setIsSelected(!isSelected);
-    onClick(evt);
-  }
-
-  function handleOnKeyDown(evt) {
-    evt.persist();
-
-    if (matches(evt, [Enter, Space])) {
-      evt.preventDefault();
-      setIsSelected(!isSelected);
-      onKeyDown(evt);
-    }
-
-    onKeyDown(evt);
-  }
-
-  return /*#__PURE__*/React__default.createElement(Link, _extends({
-    className: classes,
-    href: href,
-    onClick: handleOnClick,
-    onKeyDown: handleOnKeyDown,
-    ref: ref
-  }, rest), children);
-});
-ClickableTile.displayName = 'ClickableTile';
-ClickableTile.propTypes = {
-  /**
-   * The child nodes.
-   */
-  children: PropTypes.node,
-
-  /**
-   * The CSS class names.
-   */
-  className: PropTypes.string,
-
-  /**
-   * Boolean for whether a tile has been clicked.
-   */
-  clicked: PropTypes.bool,
-
-  /**
-   * The href for the link.
-   */
-  href: PropTypes.string,
-
-  /**
-   * `true` to use the light version. For use on $ui-01 backgrounds only.
-   * Don't use this to make tile background color same as container background color.
-   */
-  light: deprecate(PropTypes.bool, 'The `light` prop for `ClickableTile` is no longer needed and has been deprecated. It will be removed in the next major release. Use the Layer component instead.'),
-
-  /**
-   * Specify the function to run when the ClickableTile is clicked
-   */
-  onClick: PropTypes.func,
-
-  /**
-   * Specify the function to run when the ClickableTile is interacted with via a keyboard
-   */
-  onKeyDown: PropTypes.func,
-
-  /**
-   * The rel property for the link.
-   */
-  rel: PropTypes.string
-};
-var SelectableTile = /*#__PURE__*/React__default.forwardRef(function SelectableTile(_ref3, ref) {
-  var _cx3;
-
-  var children = _ref3.children,
-      className = _ref3.className,
-      disabled = _ref3.disabled,
-      id = _ref3.id,
-      light = _ref3.light,
-      name = _ref3.name,
-      _ref3$onClick = _ref3.onClick,
-      onClick = _ref3$onClick === void 0 ? function () {} : _ref3$onClick,
-      _ref3$onChange = _ref3.onChange,
-      onChange = _ref3$onChange === void 0 ? function () {} : _ref3$onChange,
-      _ref3$onKeyDown = _ref3.onKeyDown,
-      onKeyDown = _ref3$onKeyDown === void 0 ? function () {} : _ref3$onKeyDown,
-      _ref3$selected = _ref3.selected,
-      selected = _ref3$selected === void 0 ? false : _ref3$selected,
-      _ref3$tabIndex = _ref3.tabIndex,
-      tabIndex = _ref3$tabIndex === void 0 ? 0 : _ref3$tabIndex,
-      _ref3$title = _ref3.title,
-      title = _ref3$title === void 0 ? 'title' : _ref3$title,
-      _ref3$value = _ref3.value,
-      value = _ref3$value === void 0 ? 'value' : _ref3$value,
-      rest = _objectWithoutProperties(_ref3, _excluded3);
-
-  var prefix = usePrefix();
-  var clickHandler = onClick;
-  var keyDownHandler = onKeyDown;
-
-  var _useState3 = useState(selected),
-      _useState4 = _slicedToArray(_useState3, 2),
-      isSelected = _useState4[0],
-      setIsSelected = _useState4[1];
-
-  var _useState5 = useState(selected),
-      _useState6 = _slicedToArray(_useState5, 2),
-      prevSelected = _useState6[0],
-      setPrevSelected = _useState6[1];
-
-  var classes = cx("".concat(prefix, "--tile"), "".concat(prefix, "--tile--selectable"), (_cx3 = {}, _defineProperty(_cx3, "".concat(prefix, "--tile--is-selected"), isSelected), _defineProperty(_cx3, "".concat(prefix, "--tile--light"), light), _defineProperty(_cx3, "".concat(prefix, "--tile--disabled"), disabled), _cx3), className); // TODO: rename to handleClick when handleClick prop is deprecated
-
-  function handleOnClick(evt) {
-    evt.preventDefault();
-    evt.persist();
-    setIsSelected(!isSelected);
-    clickHandler(evt);
-    onChange(evt);
-  } // TODO: rename to handleKeyDown when handleKeyDown prop is deprecated
-
-
-  function handleOnKeyDown(evt) {
-    evt.persist();
-
-    if (matches(evt, [Enter, Space])) {
-      evt.preventDefault();
-      setIsSelected(!isSelected);
-      onChange(evt);
-    }
-
-    keyDownHandler(evt);
-  }
-
-  function handleChange(event) {
-    setIsSelected(event.target.checked);
-    onChange(event);
-  }
-
-  if (selected !== prevSelected) {
-    setIsSelected(selected);
-    setPrevSelected(selected);
-  }
-
-  return /*#__PURE__*/React__default.createElement("div", _extends({
-    className: classes,
-    onClick: !disabled ? handleOnClick : null,
-    role: "checkbox",
-    "aria-checked": isSelected,
-    disabled: disabled,
-    onKeyDown: !disabled ? handleOnKeyDown : null // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
-    ,
-    tabIndex: !disabled ? tabIndex : null,
-    value: value,
-    name: name,
-    ref: ref,
-    id: id,
-    onChange: !disabled ? handleChange : null,
-    title: title
-  }, rest), /*#__PURE__*/React__default.createElement("span", {
-    className: "".concat(prefix, "--tile__checkmark ").concat(prefix, "--tile__checkmark--persistent")
-  }, isSelected ? _CheckboxCheckedFille || (_CheckboxCheckedFille = /*#__PURE__*/React__default.createElement(CheckboxCheckedFilled, null)) : _Checkbox || (_Checkbox = /*#__PURE__*/React__default.createElement(Checkbox, null))), /*#__PURE__*/React__default.createElement("label", {
-    htmlFor: id,
-    className: "".concat(prefix, "--tile-content")
-  }, children));
-});
-SelectableTile.displayName = 'SelectableTile';
-SelectableTile.propTypes = {
-  /**
-   * The child nodes.
-   */
-  children: PropTypes.node,
-
-  /**
-   * The CSS class names.
-   */
-  className: PropTypes.string,
-
-  /**
-   * Specify whether the SelectableTile should be disabled
-   */
-  disabled: PropTypes.bool,
-
-  /**
-   * The ID of the `<input>`.
-   */
-  id: PropTypes.string,
-
-  /**
-   * `true` to use the light version. For use on $ui-01 backgrounds only.
-   * Don't use this to make tile background color same as container background color.
-   */
-  light: deprecate(PropTypes.bool, 'The `light` prop for `SelectableTile` is no longer needed and has been deprecated. It will be removed in the next major release. Use the Layer component instead.'),
-
-  /**
-   * The `name` of the `<input>`.
-   */
-  name: PropTypes.string,
-
-  /**
-   * The empty handler of the `<input>`.
-   */
-  onChange: PropTypes.func,
-
-  /**
-   * Specify the function to run when the SelectableTile is clicked
-   */
-  onClick: PropTypes.func,
-
-  /**
-   * Specify the function to run when the SelectableTile is interacted with via a keyboard
-   */
-  onKeyDown: PropTypes.func,
-
-  /**
-   * `true` to select this tile.
-   */
-  selected: PropTypes.bool,
-
-  /**
-   * Specify the tab index of the wrapper element
-   */
-  tabIndex: PropTypes.number,
-
-  /**
-   * The `title` of the `<input>`.
-   */
-  title: PropTypes.string,
-
-  /**
-   * The value of the `<input>`.
-   */
-  value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired
-};
-function ExpandableTile(_ref4) {
-  var _cx4, _cx5;
-
-  var tabIndex = _ref4.tabIndex,
-      className = _ref4.className,
-      children = _ref4.children,
-      expanded = _ref4.expanded,
-      tileMaxHeight = _ref4.tileMaxHeight,
-      tilePadding = _ref4.tilePadding,
-      onClick = _ref4.onClick,
-      onKeyUp = _ref4.onKeyUp,
-      tileCollapsedIconText = _ref4.tileCollapsedIconText,
-      tileExpandedIconText = _ref4.tileExpandedIconText,
-      tileCollapsedLabel = _ref4.tileCollapsedLabel,
-      tileExpandedLabel = _ref4.tileExpandedLabel,
-      light = _ref4.light,
-      rest = _objectWithoutProperties(_ref4, _excluded4);
-
-  var _useState7 = useState(tileMaxHeight),
-      _useState8 = _slicedToArray(_useState7, 2),
-      isTileMaxHeight = _useState8[0],
-      setIsTileMaxHeight = _useState8[1];
-
-  var _useState9 = useState(tilePadding),
-      _useState10 = _slicedToArray(_useState9, 2),
-      isTilePadding = _useState10[0],
-      setIsTilePadding = _useState10[1];
-
-  var _useState11 = useState(expanded),
-      _useState12 = _slicedToArray(_useState11, 2),
-      prevExpanded = _useState12[0],
-      setPrevExpanded = _useState12[1];
-
-  var _useState13 = useState(tileMaxHeight),
-      _useState14 = _slicedToArray(_useState13, 2),
-      prevTileMaxHeight = _useState14[0],
-      setPrevTileMaxHeight = _useState14[1];
-
-  var _useState15 = useState(tilePadding),
-      _useState16 = _slicedToArray(_useState15, 2),
-      prevTilePadding = _useState16[0],
-      setPrevTilePadding = _useState16[1];
-
-  var _useState17 = useState(expanded),
-      _useState18 = _slicedToArray(_useState17, 2),
-      isExpanded = _useState18[0],
-      setIsExpanded = _useState18[1];
-
-  var _useState19 = useState(false),
-      _useState20 = _slicedToArray(_useState19, 2),
-      interactive = _useState20[0],
-      setInteractive = _useState20[1];
-
-  var aboveTheFold = useRef(null);
-  var belowTheFold = useRef(null);
-  var tileContent = useRef(null);
-  var tile = useRef(null);
-  var prefix = usePrefix();
-
-  if (expanded !== prevExpanded) {
-    setIsExpanded(expanded);
-    setPrevExpanded(expanded);
-    setMaxHeight();
-  }
-
-  if (tileMaxHeight !== prevTileMaxHeight) {
-    setIsTileMaxHeight(tileMaxHeight);
-    setPrevTileMaxHeight(tileMaxHeight);
-  }
-
-  if (tilePadding !== prevTilePadding) {
-    setIsTilePadding(tilePadding);
-    setPrevTilePadding(tilePadding);
-  }
-
-  function setMaxHeight() {
-    if (isExpanded) {
-      setIsTileMaxHeight(tileContent.current.getBoundingClientRect().height);
-    }
-
-    setIsTileMaxHeight(aboveTheFold.current.getBoundingClientRect().height);
-  }
-
-  function handleClick(evt) {
-    evt.persist();
-    setIsExpanded(!isExpanded);
-    setMaxHeight();
-
-    if (onClick) {
-      onClick(evt);
-    }
-  }
-
-  function handleKeyUp(evt) {
-    if (evt.target !== tile.current) {
-      if (matches(evt, [Enter, Space])) {
-        evt.preventDefault();
-      }
-    }
-  }
-
-  function getChildren() {
-    return React__default.Children.toArray(children);
-  }
-
-  var classNames = cx("".concat(prefix, "--tile"), "".concat(prefix, "--tile--expandable"), (_cx4 = {}, _defineProperty(_cx4, "".concat(prefix, "--tile--is-expanded"), isExpanded), _defineProperty(_cx4, "".concat(prefix, "--tile--light"), light), _cx4), className);
-  var interactiveClassNames = cx("".concat(prefix, "--tile"), "".concat(prefix, "--tile--expandable"), "".concat(prefix, "--tile--expandable--interactive"), (_cx5 = {}, _defineProperty(_cx5, "".concat(prefix, "--tile--is-expanded"), isExpanded), _defineProperty(_cx5, "".concat(prefix, "--tile--light"), light), _cx5), className);
-  var chevronInteractiveClassNames = cx("".concat(prefix, "--tile__chevron"), "".concat(prefix, "--tile__chevron--interactive"));
-  var tileStyle = {
-    maxHeight: isExpanded ? null : isTileMaxHeight + isTilePadding
-  };
-  var childrenAsArray = getChildren();
-  useIsomorphicEffect(function () {
-    var getStyle = window.getComputedStyle(tile.current, null);
-    var node = aboveTheFold.current;
-
-    var _node$getBoundingClie = node.getBoundingClientRect(),
-        height = _node$getBoundingClie.height;
-
-    var paddingTop = parseInt(getStyle.getPropertyValue('padding-top'), 10);
-    var paddingBottom = parseInt(getStyle.getPropertyValue('padding-bottom'), 10);
-    setIsTileMaxHeight(height);
-    setIsTilePadding(paddingTop + paddingBottom);
-  }, []);
-  useIsomorphicEffect(function () {
-    if (getInteractiveContent(belowTheFold.current)) {
-      setInteractive(true);
-      return;
-    } else if (getInteractiveContent(aboveTheFold.current)) {
-      setInteractive(true);
-    }
-  }, []);
-  useEffect(function () {
-    var resizeObserver = new ResizeObserver(function (entries) {
-      var _entries = _slicedToArray(entries, 1),
-          aboveTheFold = _entries[0];
-
-      setIsTileMaxHeight(aboveTheFold.contentRect.height);
-    });
-    resizeObserver.observe(aboveTheFold.current);
-    return function () {
-      return resizeObserver.disconnect();
-    };
-  }, []);
-  return interactive ? /*#__PURE__*/React__default.createElement("div", _extends({
-    ref: tile,
-    style: tileStyle,
-    className: interactiveClassNames,
-    "aria-expanded": isExpanded
-  }, rest), /*#__PURE__*/React__default.createElement("div", {
-    ref: tileContent
-  }, /*#__PURE__*/React__default.createElement("div", {
-    ref: aboveTheFold,
-    className: "".concat(prefix, "--tile-content")
-  }, childrenAsArray[0]), /*#__PURE__*/React__default.createElement("button", {
-    type: "button",
-    "aria-expanded": isExpanded,
-    onKeyUp: composeEventHandlers([onKeyUp, handleKeyUp]),
-    onClick: composeEventHandlers([onClick, handleClick]),
-    "aria-label": isExpanded ? tileExpandedIconText : tileCollapsedIconText,
-    className: chevronInteractiveClassNames
-  }, _ChevronDown || (_ChevronDown = /*#__PURE__*/React__default.createElement(ChevronDown, null))), /*#__PURE__*/React__default.createElement("div", {
-    ref: belowTheFold,
-    className: "".concat(prefix, "--tile-content")
-  }, childrenAsArray[1]))) : /*#__PURE__*/React__default.createElement("button", _extends({
-    type: "button",
-    ref: tile,
-    style: tileStyle,
-    className: classNames,
-    "aria-expanded": isExpanded,
-    title: isExpanded ? tileExpandedIconText : tileCollapsedIconText
-  }, rest, {
-    onKeyUp: composeEventHandlers([onKeyUp, handleKeyUp]),
-    onClick: composeEventHandlers([onClick, handleClick]),
-    tabIndex: tabIndex
-  }), /*#__PURE__*/React__default.createElement("div", {
-    ref: tileContent
-  }, /*#__PURE__*/React__default.createElement("div", {
-    ref: aboveTheFold,
-    className: "".concat(prefix, "--tile-content")
-  }, childrenAsArray[0]), /*#__PURE__*/React__default.createElement("div", {
-    className: "".concat(prefix, "--tile__chevron")
-  }, /*#__PURE__*/React__default.createElement("span", null, isExpanded ? tileExpandedLabel : tileCollapsedLabel), _ChevronDown2 || (_ChevronDown2 = /*#__PURE__*/React__default.createElement(ChevronDown, null))), /*#__PURE__*/React__default.createElement("div", {
-    ref: belowTheFold,
-    className: "".concat(prefix, "--tile-content")
-  }, childrenAsArray[1])));
-}
-ExpandableTile.propTypes = {
-  /**
-   * The child nodes.
-   */
-  children: PropTypes.node,
-
-  /**
-   * The CSS class names.
-   */
-  className: PropTypes.string,
-
-  /**
-   * `true` if the tile is expanded.
-   */
-  expanded: PropTypes.bool,
-
-  /**
-   * An ID that can be provided to aria-labelledby
-   */
-  id: PropTypes.string,
-
-  /**
-   * `true` to use the light version. For use on $ui-01 backgrounds only.
-   * Don't use this to make tile background color same as container background color.
-   */
-  light: deprecate(PropTypes.bool, 'The `light` prop for `ExpandableTile` is no longer needed and has been deprecated. It will be removed in the next major release. Use the Layer component instead.'),
-
-  /**
-   * Specify the function to run when the ExpandableTile is clicked
-   */
-  onClick: PropTypes.func,
-
-  /**
-   * optional handler to trigger a function when a key is pressed
-   */
-  onKeyUp: PropTypes.func,
-
-  /**
-   * The `tabindex` attribute.
-   */
-  tabIndex: PropTypes.number,
-
-  /**
-   * The description of the "collapsed" icon that can be read by screen readers.
-   */
-  tileCollapsedIconText: PropTypes.string,
-
-  /**
-   * When "collapsed", a label to appear next to the chevron (e.g., "View more").
-   */
-  tileCollapsedLabel: PropTypes.string,
-
-  /**
-   * The description of the "expanded" icon that can be read by screen readers.
-   */
-  tileExpandedIconText: PropTypes.string,
-
-  /**
-   * When "expanded", a label to appear next to the chevron (e.g., "View less").
-   */
-  tileExpandedLabel: PropTypes.string
-};
-ExpandableTile.defaultProps = {
-  tabIndex: 0,
-  expanded: false,
-  tileMaxHeight: 0,
-  tilePadding: 0,
-  onClick: function onClick() {},
-  tileCollapsedIconText: 'Interact to expand Tile',
-  tileExpandedIconText: 'Interact to collapse Tile'
-};
-ExpandableTile.displayName = 'ExpandableTile';
-var TileAboveTheFoldContent = /*#__PURE__*/React__default.forwardRef(function TilAboveTheFoldContent(_ref5, ref) {
-  var children = _ref5.children;
-  var prefix = usePrefix();
-  return /*#__PURE__*/React__default.createElement("span", {
-    ref: ref,
-    className: "".concat(prefix, "--tile-content__above-the-fold")
-  }, children);
-});
-TileAboveTheFoldContent.propTypes = {
-  /**
-   * The child nodes.
-   */
-  children: PropTypes.node
-};
-TileAboveTheFoldContent.displayName = 'TileAboveTheFoldContent';
-var TileBelowTheFoldContent = /*#__PURE__*/React__default.forwardRef(function TileBelowTheFoldContent(_ref6, ref) {
-  var children = _ref6.children;
-  var prefix = usePrefix();
-  return /*#__PURE__*/React__default.createElement("span", {
-    ref: ref,
-    className: "".concat(prefix, "--tile-content__below-the-fold")
-  }, children);
-});
-TileBelowTheFoldContent.propTypes = {
-  /**
-   * The child nodes.
-   */
-  children: PropTypes.node
-};
-TileBelowTheFoldContent.displayName = 'TileBelowTheFoldContent';
-
-export { ClickableTile, ExpandableTile, SelectableTile, Tile, TileAboveTheFoldContent, TileBelowTheFoldContent };