@wix/design-system/dist/cjs/CodeSnippet/CodeSnippet.js

@wix/design-system

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports.default = void 0;
var _react = _interopRequireDefault(require("react"));
var _CodeSnippetSt = require("./CodeSnippet.st.css.js");
var _CodeSnippet = require("./CodeSnippet.constants");
var _useId = require("../utils/useId");
var _CopyButton = _interopRequireDefault(require("./components/CopyButton"));
var _InlineVariant = _interopRequireDefault(require("./components/InlineVariant"));
var _jsxFileName = "/home/builduser/work/57e038ea7326c1ec/packages/wix-design-system/dist/cjs/CodeSnippet/CodeSnippet.tsx";
var CodeSnippet = _ref => {
  var _ref$variant = _ref.variant,
    variant = _ref$variant === void 0 ? _CodeSnippet.VARIANT.singleline : _ref$variant,
    size = _ref.size,
    code = _ref.code,
    copyText = _ref.copyText,
    _ref$disableCopy = _ref.disableCopy,
    disableCopy = _ref$disableCopy === void 0 ? false : _ref$disableCopy,
    copyTooltipText = _ref.copyTooltipText,
    copiedTooltipText = _ref.copiedTooltipText,
    tooltipProps = _ref.tooltipProps,
    onCopy = _ref.onCopy,
    ariaLabel = _ref.ariaLabel,
    _ref$wrapText = _ref.wrapText,
    wrapText = _ref$wrapText === void 0 ? false : _ref$wrapText,
    dataHook = _ref.dataHook,
    className = _ref.className;
  // Associates the copy button with the code block so screen readers announce
  // the snippet content as the button's description on focus.
  var codeId = (0, _useId.useId)('code-snippet-');
  if (variant === _CodeSnippet.VARIANT.inline) {
    return /*#__PURE__*/_react.default.createElement(_InlineVariant.default, {
      code: code,
      size: size,
      copyText: copyText,
      disableCopy: disableCopy,
      copyTooltipText: copyTooltipText,
      copiedTooltipText: copiedTooltipText,
      tooltipProps: tooltipProps,
      onCopy: onCopy,
      ariaLabel: ariaLabel,
      dataHook: dataHook,
      className: className,
      __self: void 0,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 35,
        columnNumber: 7
      }
    });
  }
  var valueToCopy = copyText !== null && copyText !== void 0 ? copyText : code;
  var blockSize = size !== null && size !== void 0 ? size : _CodeSnippet.SIZE.small;
  var buttonSize = variant === _CodeSnippet.VARIANT.singleline && blockSize !== _CodeSnippet.SIZE.medium ? _CodeSnippet.COPY_BUTTON_SIZE.small : _CodeSnippet.COPY_BUTTON_SIZE.medium;
  return /*#__PURE__*/_react.default.createElement("div", {
    "data-hook": dataHook,
    className: (0, _CodeSnippetSt.st)(_CodeSnippetSt.classes.root, {
      variant,
      size: blockSize,
      wrapText: variant === _CodeSnippet.VARIANT.multiline && wrapText,
      disableCopy
    }, className),
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 59,
      columnNumber: 5
    }
  }, /*#__PURE__*/_react.default.createElement("pre", {
    id: codeId,
    "data-hook": _CodeSnippet.DATA_HOOKS.code,
    "aria-label": ariaLabel,
    className: _CodeSnippetSt.classes.code,
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 72,
      columnNumber: 7
    }
  }, /*#__PURE__*/_react.default.createElement("code", {
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 78,
      columnNumber: 9
    }
  }, code)), !disableCopy && /*#__PURE__*/_react.default.createElement("div", {
    className: _CodeSnippetSt.classes.copyButtonSlot,
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 82,
      columnNumber: 9
    }
  }, /*#__PURE__*/_react.default.createElement(_CopyButton.default, {
    variant: variant,
    size: buttonSize,
    value: valueToCopy,
    copyTooltipText: copyTooltipText,
    copiedTooltipText: copiedTooltipText,
    tooltipProps: tooltipProps,
    onCopy: onCopy,
    describedById: codeId,
    dataHook: _CodeSnippet.DATA_HOOKS.copyButton,
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 83,
      columnNumber: 11
    }
  })));
};
CodeSnippet.displayName = 'CodeSnippet';
var _default = exports.default = CodeSnippet;
//# sourceMappingURL=CodeSnippet.js.map