@airtable/blocks 0.0.0-experimental-e5ab33b68-20250905 → 0.0.0-experimental-e625869e5-20251002

package/dist/cjs/base/ui/baymax_utils.js

@@ -1,461 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.baymax = baymax;
-var _emotion = require("emotion");
-var _private_utils = require("../../shared/private_utils");
-var _error_utils = require("../../shared/error_utils");
-const bounceIn = (0, _emotion.keyframes)`
-    from, 50%, to {
-        -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
-        animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
-    }
-    0% {
-        opacity: 0.9;
-        -webkit-transform: scale3d(.98, .98, .98);
-        transform: scale3d(.98, .98, .98);
-    }
-    70% {
-        opacity: 1;
-        -webkit-transform: scale3d(1.01, 1.01, 1.01);
-        transform: scale3d(1.01, 1.01, 1.01);
-    }
-    to {
-        -webkit-transform: scale3d(1, 1, 1);
-        transform: scale3d(1, 1, 1);
-    }
-`;
-const spinScale = (0, _emotion.keyframes)`
-    0% {
-        transform: rotate(0) scale(1);
-    }
-    50% {
-        transform: rotate(360deg) scale(0.9);
-    }
-    100% {
-        transform: rotate(720deg) scale(1);
-    }
-`;
-
-// TODO (stephen): import values from theme object?
-const emotionClassNameByBaymaxClassName = {
-  absolute: (0, _emotion.css)`
-        position: absolute;
-    `,
-  'align-top': (0, _emotion.css)`
-        vertical-align: top;
-    `,
-  'all-0': (0, _emotion.css)`
-        top: 0;
-        left: 0;
-        right: 0;
-        bottom: 0;
-    `,
-  animate: (0, _emotion.css)`
-        transition: 0.085s all ease-in;
-    `,
-  'animate-bounce-in': (0, _emotion.css)`
-        animation-name: ${bounceIn};
-        animation-duration: 240ms;
-    `,
-  'animate-infinite': (0, _emotion.css)`
-        animation-iteration-count: infinite;
-    `,
-  'animate-spin-scale': (0, _emotion.css)`
-        animation-name: ${spinScale};
-        animation-duration: 1800ms;
-        animation-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);
-    `,
-  appFontColorLight: (0, _emotion.css)`
-        color: hsl(0, 0%, 33%);
-    `,
-  'background-center': (0, _emotion.css)`
-        background-position: center center;
-    `,
-  'background-cover': (0, _emotion.css)`
-        background-size: cover;
-    `,
-  'background-transparent': (0, _emotion.css)`
-        background-color: transparent;
-    `,
-  big: (0, _emotion.css)`
-        font-size: 0.9rem;
-    `,
-  block: (0, _emotion.css)`
-        display: block;
-    `,
-  blue: (0, _emotion.css)`
-        background-color: rgb(45, 127, 249);
-    `,
-  'border-box': (0, _emotion.css)`
-        box-sizing: border-box;
-    `,
-  'bottom-0': (0, _emotion.css)`
-        bottom: 0;
-    `,
-  caps: (0, _emotion.css)`
-        text-transform: uppercase;
-        letter-spacing: 0.1em;
-    `,
-  cardBoxShadow: (0, _emotion.css)`
-        box-shadow: 0 0 0 2px hsla(0, 0%, 0%, 0.1);
-        transition-property: box-shadow;
-        -webkit-transition-property: box-shadow;
-        -moz-transition-property: box-shadow;
-        transition-duration: 0.15s;
-        -webkit-transition-duration: 0.15s;
-        -moz-transition-duration: 0.15s;
-        transition-timing-function: ease-out;
-        -webkit-transition-timing-function: ease-out;
-        -moz-transition-timing-function: ease-out;
-        &:hover {
-            box-shadow: 0 0 0 2px hsla(0, 0%, 0%, 0.25);
-        }
-    `,
-  center: (0, _emotion.css)`
-        text-align: center;
-    `,
-  circle: (0, _emotion.css)`
-        border-radius: 50%;
-    `,
-  dark: (0, _emotion.css)`
-        background-color: hsl(0, 0%, 20%);
-    `,
-  darken1: (0, _emotion.css)`
-        background-color: hsla(0, 0%, 0%, 0.05);
-    `,
-  'darken1-focus': (0, _emotion.css)`
-        &:focus {
-            background-color: hsla(0, 0%, 0%, 0.05);
-        }
-    `,
-  'darken1-hover': (0, _emotion.css)`
-        &:hover {
-            background-color: hsla(0, 0%, 0%, 0.05);
-        }
-    `,
-  darken2: (0, _emotion.css)`
-        background-color: hsla(0, 0%, 0%, 0.1);
-    `,
-  darken3: (0, _emotion.css)`
-        background-color: hsla(0, 0%, 0%, 0.25);
-    `,
-  darken4: (0, _emotion.css)`
-        background-color: hsla(0, 0%, 0%, 0.5);
-    `,
-  fixed: (0, _emotion.css)`
-        position: fixed;
-    `,
-  flex: (0, _emotion.css)`
-        display: -webkit-box;
-        display: -webkit-flex;
-        display: -ms-flexbox;
-        display: flex;
-    `,
-  'flex-auto': (0, _emotion.css)`
-        -webkit-box-flex: 1;
-        -webkit-flex: 1 1 auto;
-        -ms-flex: 1 1 auto;
-        flex: 1 1 auto;
-        min-width: 0;
-        min-height: 0;
-    `,
-  'flex-inline': (0, _emotion.css)`
-        display: -webkit-inline-flex;
-        display: -ms-inline-flexbox;
-        display: inline-flex;
-    `,
-  'flex-none': (0, _emotion.css)`
-        -webkit-box-flex: 0;
-        -webkit-flex: none;
-        -ms-flex: none;
-        flex: none;
-    `,
-  'flex-reverse': (0, _emotion.css)`
-        -webkit-flex-direction: row-reverse;
-        flex-direction: row-reverse;
-    `,
-  'flex-wrap': (0, _emotion.css)`
-        -webkit-flex-wrap: wrap;
-        -ms-flex-wrap: wrap;
-        flex-wrap: wrap;
-    `,
-  focusable: (0, _emotion.css)`
-        &:focus {
-            outline: 0;
-            box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.1);
-        }
-    `,
-  gray: (0, _emotion.css)`
-        background-color: rgb(102, 102, 102);
-    `,
-  grayLight2: (0, _emotion.css)`
-        background-color: rgb(238, 238, 238);
-    `,
-  green: (0, _emotion.css)`
-        background-color: rgb(32, 201, 51);
-    `,
-  'height-full': (0, _emotion.css)`
-        height: 100%;
-    `,
-  inline: (0, _emotion.css)`
-        display: inline;
-    `,
-  'inline-block': (0, _emotion.css)`
-        display: inline-block;
-    `,
-  'items-center': (0, _emotion.css)`
-        -webkit-box-align: center;
-        -webkit-align-items: center;
-        -ms-flex-align: center;
-        -ms-grid-row-align: center;
-        align-items: center;
-    `,
-  'justify-center': (0, _emotion.css)`
-        -webkit-box-pack: center;
-        -webkit-justify-content: center;
-        -ms-flex-pack: center;
-        justify-content: center;
-    `,
-  'justify-end': (0, _emotion.css)`
-        -webkit-box-pack: end;
-        -webkit-justify-content: flex-end;
-        -ms-flex-pack: end;
-        justify-content: flex-end;
-    `,
-  'justify-start': (0, _emotion.css)`
-        -webkit-box-pack: start;
-        -webkit-justify-content: flex-start;
-        -ms-flex-pack: start;
-        justify-content: flex-start;
-    `,
-  'left-0': (0, _emotion.css)`
-        left: 0;
-    `,
-  'light-scrollbar': (0, _emotion.css)`
-        &::-webkit-scrollbar {
-            width: 12px;
-            height: 12px;
-            position: absolute;
-            top: 0;
-            left: 0;
-            right: 0;
-            bottom: 0;
-        }
-        &::-webkit-scrollbar-button {
-            display: none;
-            height: 0;
-            width: 0;
-        }
-        &::-webkit-scrollbar-thumb {
-            background-color: hsla(0, 0%, 0%, 0.35);
-            background-clip: padding-box;
-            border: 3px solid rgba(0, 0, 0, 0);
-            border-radius: 6px;
-            min-height: 36px;
-        }
-        &::-webkit-scrollbar-thumb:hover {
-            background-color: hsla(0, 0%, 0%, 0.4);
-        }
-    `,
-  'line-height-4': (0, _emotion.css)`
-        line-height: 1.5;
-    `,
-  'link-quiet': (0, _emotion.css)`
-        &:hover {
-            opacity: 0.85;
-        }
-    `,
-  'link-unquiet': (0, _emotion.css)`
-        &:hover {
-            opacity: 1;
-        }
-    `,
-  'link-unquiet-focusable': (0, _emotion.css)`
-        &:hover {
-            opacity: 1;
-        }
-        &:focus {
-            opacity: 1;
-        }
-    `,
-  m0: (0, _emotion.css)`
-        margin: 0;
-    `,
-  m2: (0, _emotion.css)`
-        margin: 1rem;
-    `,
-  mb1: (0, _emotion.css)`
-        margin-bottom: 0.5rem;
-    `,
-  ml1: (0, _emotion.css)`
-        margin-left: 0.5rem;
-    `,
-  'mr-half': (0, _emotion.css)`
-        margin-right: 0.25rem;
-    `,
-  mr1: (0, _emotion.css)`
-        margin-right: 0.5rem;
-    `,
-  mt0: (0, _emotion.css)`
-        margin-top: 0;
-    `,
-  mt1: (0, _emotion.css)`
-        margin-top: 0.5rem;
-    `,
-  mt2: (0, _emotion.css)`
-        margin-top: 1rem;
-    `,
-  'no-outline': (0, _emotion.css)`
-        outline: 0;
-    `,
-  'no-user-select': (0, _emotion.css)`
-        user-select: none;
-        -webkit-user-select: none;
-    `,
-  noevents: (0, _emotion.css)`
-        pointer-events: none;
-    `,
-  normal: (0, _emotion.css)`
-        font-size: 0.8rem;
-    `,
-  nowrap: (0, _emotion.css)`
-        white-space: nowrap;
-    `,
-  'overflow-auto': (0, _emotion.css)`
-        overflow: auto;
-    `,
-  'overflow-hidden': (0, _emotion.css)`
-        overflow: hidden;
-    `,
-  'p-half': (0, _emotion.css)`
-        padding: 0.25rem;
-    `,
-  p1: (0, _emotion.css)`
-        padding: 0.5rem;
-    `,
-  p2: (0, _emotion.css)`
-        padding: 1rem;
-    `,
-  pill: (0, _emotion.css)`
-        border-radius: 9999px;
-    `,
-  pointer: (0, _emotion.css)`
-        cursor: pointer;
-    `,
-  pr1: (0, _emotion.css)`
-        padding-right: 0.5rem;
-    `,
-  'print-color-exact': (0, _emotion.css)`
-        -webkit-print-color-adjust: exact;
-    `,
-  px1: (0, _emotion.css)`
-        padding-left: 0.5rem;
-        padding-right: 0.5rem;
-    `,
-  quiet: (0, _emotion.css)`
-        opacity: 0.75;
-    `,
-  quieter: (0, _emotion.css)`
-        opacity: 0.5;
-    `,
-  red: (0, _emotion.css)`
-        background-color: rgb(248, 43, 96);
-    `,
-  relative: (0, _emotion.css)`
-        position: relative;
-    `,
-  'right-0': (0, _emotion.css)`
-        right: 0;
-    `,
-  rounded: (0, _emotion.css)`
-        border-radius: 3px;
-    `,
-  'rounded-big': (0, _emotion.css)`
-        border-radius: 6px;
-    `,
-  'self-end': (0, _emotion.css)`
-        -webkit-align-self: flex-end;
-        -ms-flex-item-align: end;
-        align-self: flex-end;
-    `,
-  small: (0, _emotion.css)`
-        font-size: 11px;
-    `,
-  stroked1: (0, _emotion.css)`
-        box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.1);
-    `,
-  strong: (0, _emotion.css)`
-        font-weight: 500;
-    `,
-  'styled-input': (0, _emotion.css)`
-        -webkit-appearance: none;
-        -moz-appearance: none;
-        appearance: none;
-        border-style: solid;
-        border-width: 2px;
-        border-color: transparent;
-        outline: none;
-        &:active {
-            border-color: hsla(0, 0%, 0%, 0.25);
-        }
-        &:focus {
-            border-color: hsla(0, 0%, 0%, 0.25);
-        }
-    `,
-  'text-blue': (0, _emotion.css)`
-        color: rgb(45, 127, 249);
-        fill: rgb(45, 127, 249);
-    `,
-  'text-blue-focus': (0, _emotion.css)`
-        &:focus {
-            color: rgb(45, 127, 249);
-            fill: rgb(45, 127, 249);
-        }
-    `,
-  'text-dark': (0, _emotion.css)`
-        color: hsl(0, 0%, 20%);
-        fill: hsl(0, 0%, 20%);
-    `,
-  'text-white': (0, _emotion.css)`
-        color: hsl(0, 0%, 100%);
-        fill: hsl(0, 0%, 100%);
-    `,
-  'top-0': (0, _emotion.css)`
-        top: 0;
-    `,
-  truncate: (0, _emotion.css)`
-        max-width: 100%;
-        overflow: hidden;
-        text-overflow: ellipsis;
-        white-space: nowrap;
-    `,
-  understroke: (0, _emotion.css)`
-        padding-bottom: 0.14rem;
-        border-bottom: 2px solid hsla(0, 0%, 0%, 0.1);
-    `,
-  white: (0, _emotion.css)`
-        background-color: hsl(0, 0%, 100%);
-    `,
-  'width-full': (0, _emotion.css)`
-        width: 100%;
-    `,
-  yellow: (0, _emotion.css)`
-        background-color: rgb(252, 180, 0);
-    `
-};
-
-/**
- * @internal
- */
-function baymax(baymaxClassNames) {
-  return baymaxClassNames.split(/\s+/).filter(Boolean).map(baymaxClassName => {
-    if ((0, _private_utils.has)(emotionClassNameByBaymaxClassName, baymaxClassName)) {
-      return emotionClassNameByBaymaxClassName[baymaxClassName];
-    } else {
-      throw (0, _error_utils.spawnError)('Baymax class not found: %s. If required, add the definition to baymax_utils.js.`', baymaxClassName);
-    }
-  }).join(' ');
-}

package/dist/cjs/base/ui/block_wrapper.js

@@ -1,118 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var React = _interopRequireWildcard(require("react"));
-var _error_utils = require("../../shared/error_utils");
-var _with_hooks = _interopRequireDefault(require("../../shared/ui/with_hooks"));
-var _use_watchable = _interopRequireDefault(require("../../shared/ui/use_watchable"));
-var _sdk_context = require("../../shared/ui/sdk_context");
-var _baymax_utils = require("./baymax_utils");
-var _modal = _interopRequireDefault(require("./modal"));
-var _loader = _interopRequireDefault(require("./loader"));
-var _ui = require("./ui");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-/** @hidden */ /** */
-
-class BlockWrapper extends React.Component {
-  /** @internal */
-  _minSizeBeforeRender = null;
-  /** @hidden */
-  constructor(props) {
-    super(props);
-
-    // We watch globalAlert in constructor, instead of using createDataContainer,
-    // because createDataContainer starts watching after the component is mounted.
-    // If we used createDataContainer and some child component in its constructor or
-    // componentDidMount called globalAlert.showReloadPrompt, this component
-    // would not update.
-    // TODO(kasra): maybe change createDataContainer to handle this case
-    // without having to special case it.
-    _ui.globalAlert.watch('__alertInfo', () => this.forceUpdate());
-  }
-  /** @hidden */
-  UNSAFE_componentWillMount() {
-    this._snapshotMinSizeBeforeRender();
-  }
-  /** @hidden */
-  componentDidMount() {
-    this._checkMinSizeConstraintUnchangedAfterRender();
-  }
-  /** @hidden */
-  UNSAFE_componentWillUpdate() {
-    this._snapshotMinSizeBeforeRender();
-  }
-  /** @hidden */
-  componentDidUpdate() {
-    this._checkMinSizeConstraintUnchangedAfterRender();
-  }
-  // usually createDataContainer handles re-rendering when watchable values
-  // change. As minSize can be changed by child components though, it can
-  // change before createDataContainer has a chance to set up watches. To get
-  // around this, we take a snapshot of the minSize before render and call
-  // .forceUpdate() if its changed after render
-  /** @internal */
-  _snapshotMinSizeBeforeRender() {
-    this._minSizeBeforeRender = this.props.sdk.viewport.minSize;
-  }
-  /** @internal */
-  _checkMinSizeConstraintUnchangedAfterRender() {
-    const prevMinSize = this._minSizeBeforeRender;
-    (0, _error_utils.invariant)(prevMinSize, 'prevMinSize must be set');
-    const currentMinSize = this.props.sdk.viewport.minSize;
-    if (currentMinSize.width !== prevMinSize.width || currentMinSize.height !== prevMinSize.height) {
-      this.forceUpdate();
-    }
-  }
-  /** @hidden */
-  render() {
-    const {
-      viewport
-    } = this.props.sdk;
-    const globalAlertInfo = _ui.globalAlert.__alertInfo;
-    if (globalAlertInfo) {
-      return /*#__PURE__*/React.createElement(_sdk_context.SdkContext.Provider, {
-        value: this.props.sdk
-      }, /*#__PURE__*/React.createElement(_modal.default, {
-        className: (0, _baymax_utils.baymax)('absolute all-0 flex items-center justify-center p2'),
-        style: {
-          animation: 'none',
-          maxWidth: undefined,
-          maxHeight: undefined,
-          borderRadius: 0,
-          boxShadow: 'none'
-        }
-      }, globalAlertInfo.content));
-    }
-    return /*#__PURE__*/React.createElement(_sdk_context.SdkContext.Provider, {
-      value: this.props.sdk
-    }, /*#__PURE__*/React.createElement(React.Suspense, {
-      fallback: /*#__PURE__*/React.createElement("div", {
-        className: (0, _baymax_utils.baymax)('absolute all-0 flex items-center justify-center')
-      }, /*#__PURE__*/React.createElement(_loader.default, null))
-    }, /*#__PURE__*/React.createElement("div", {
-      className: viewport.isSmallerThanMinSize ? (0, _baymax_utils.baymax)('absolute all-0 overflow-hidden') : ''
-    }, this.props.children)), viewport.isSmallerThanMinSize && /*#__PURE__*/React.createElement("div", {
-      className: (0, _baymax_utils.baymax)('absolute all-0 flex items-center justify-center p2 white'),
-      style: {
-        zIndex: 2147483647 // largest 32-bit signed integer (maximum z-index)
-      }
-    }, /*#__PURE__*/React.createElement("span", {
-      className: (0, _baymax_utils.baymax)('center line-height-4 quiet strong')
-    }, /*#__PURE__*/React.createElement("span", null, "Please make this extension bigger or "), /*#__PURE__*/React.createElement("span", {
-      className: (0, _baymax_utils.baymax)('pointer understroke link-unquiet'),
-      onClick: () => viewport.enterFullscreenIfPossible()
-    }, "fullscreen"))));
-  }
-}
-var _default = exports.default = (0, _with_hooks.default)(BlockWrapper, _ref => {
-  let {
-    sdk
-  } = _ref;
-  (0, _use_watchable.default)(sdk.viewport, ['size', 'minSize']);
-  return {};
-});

package/dist/cjs/base/ui/box.js

@@ -1,84 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var React = _interopRequireWildcard(require("react"));
-var _emotion = require("emotion");
-var _use_styled_system = _interopRequireDefault(require("./use_styled_system"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); } /** @module @airtable/blocks/ui: Box */ /** */
-/**
- * Props for the Box component. Also accepts:
- * * {@link AllStylesProps}
- * * {@link AriaProps}
- *
- * @docsPath UI/components/Box
- * @noInheritDoc
- */
-
-/**
- * A box component for creating layouts.
- *
- * [[ Story id="box--example" title="Box example" ]]
- *
- * @component
- * @docsPath UI/components/Box
- */
-const Box = (props, ref) => {
-  const {
-    as: Component = 'div',
-    id,
-    children,
-    className,
-    style,
-    tabIndex,
-    role,
-    onClick,
-    onMouseEnter,
-    onMouseLeave,
-    // This hasOnClick prop is set by the Tooltip wrapper. Destructure it here just to get it out of `props`.
-    // See 7a80fefd0a0bc871c31e0c063662c6100b0ca77d
-    // TODO(stephen): clean this up.
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    hasOnClick,
-    dataAttributes = {},
-    'aria-label': ariaLabel,
-    'aria-labelledby': ariaLabelledBy,
-    'aria-describedby': ariaDescribedBy,
-    'aria-controls': ariaControls,
-    'aria-expanded': ariaExpanded,
-    'aria-haspopup': ariaHasPopup,
-    'aria-hidden': ariaHidden,
-    'aria-live': ariaLive,
-    ...styleProps
-  } = props;
-  const classNameForStyleProps = (0, _use_styled_system.default)(styleProps);
-  return /*#__PURE__*/React.createElement(Component, _extends({
-    ref: ref,
-    id: id,
-    className: (0, _emotion.cx)(classNameForStyleProps, className),
-    style: style,
-    tabIndex: tabIndex,
-    role: role
-    // TODO (stephen): remove tooltip anchor props
-    ,
-    onMouseEnter: onMouseEnter,
-    onMouseLeave: onMouseLeave,
-    onClick: onClick,
-    "aria-label": ariaLabel,
-    "aria-labelledby": ariaLabelledBy,
-    "aria-describedby": ariaDescribedBy,
-    "aria-controls": ariaControls,
-    "aria-expanded": ariaExpanded,
-    "aria-haspopup": ariaHasPopup,
-    "aria-hidden": ariaHidden,
-    "aria-live": ariaLive
-  }, dataAttributes), children);
-};
-const ForwardedRefBox = /*#__PURE__*/React.forwardRef(Box);
-ForwardedRefBox.displayName = 'Box';
-var _default = exports.default = ForwardedRefBox;