@wordpress/block-editor/build/components/link-control/settings-drawer.js

Generic block editor.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _element = require("@wordpress/element");

var _components = require("@wordpress/components");

var _icons = require("@wordpress/icons");

var _compose = require("@wordpress/compose");

var _i18n = require("@wordpress/i18n");

/**
 * WordPress dependencies
 */
function LinkSettingsDrawer({
  children,
  settingsOpen,
  setSettingsOpen
}) {
  const prefersReducedMotion = (0, _compose.useReducedMotion)();
  const MaybeAnimatePresence = prefersReducedMotion ? _element.Fragment : _components.__unstableAnimatePresence;
  const MaybeMotionDiv = prefersReducedMotion ? 'div' : _components.__unstableMotion.div;
  const id = (0, _compose.useInstanceId)(LinkSettingsDrawer);
  const settingsDrawerId = `link-control-settings-drawer-${id}`;
  return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_components.Button, {
    className: "block-editor-link-control__drawer-toggle",
    "aria-expanded": settingsOpen,
    onClick: () => setSettingsOpen(!settingsOpen),
    icon: _icons.settings,
    label: (0, _i18n.__)('Link Settings'),
    "aria-controls": settingsDrawerId
  }), (0, _element.createElement)(MaybeAnimatePresence, null, settingsOpen && (0, _element.createElement)(MaybeMotionDiv, {
    className: "block-editor-link-control__drawer",
    hidden: !settingsOpen,
    id: settingsDrawerId,
    initial: "collapsed",
    animate: "open",
    exit: "collapsed",
    variants: {
      open: {
        opacity: 1,
        height: 'auto'
      },
      collapsed: {
        opacity: 0,
        height: 0
      }
    },
    transition: {
      duration: 0.1
    }
  }, (0, _element.createElement)("div", {
    className: "block-editor-link-control__drawer-inner"
  }, children))));
}

var _default = LinkSettingsDrawer;
exports.default = _default;
//# sourceMappingURL=settings-drawer.js.map