@carbon/ibm-products 1.0.0-rc.0 → 1.0.1

package/es/components/ExampleComponent/ExampleComponent.js

@@ -0,0 +1,160 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["borderColor", "boxedBorder", "className", "disabled", "onPrimaryClick", "onSecondaryClick", "primaryButtonLabel", "primaryKind", "secondaryButtonLabel", "secondaryKind", "size", "style"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+/**
+ * Copyright IBM Corp. 2020, 2021
+ *
+ * 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 portions of React that are needed.
+import React from 'react'; // Other standard imports.
+
+import PropTypes from 'prop-types';
+import cx from 'classnames';
+import { pkg } from '../../settings'; // Carbon and package components we use.
+
+import { Button, ButtonSet } from 'carbon-components-react'; // The block part of our conventional BEM class names (blockClass__E--M).
+
+var blockClass = "".concat(pkg.prefix, "--example-component");
+var componentName = 'ExampleComponent'; // NOTE: the component SCSS is not imported here: it is rolled up separately.
+
+/**
+ * This is an example component to show relevant conventions and usage.
+ */
+
+export var ExampleComponent = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
+  var borderColor = _ref.borderColor,
+      boxedBorder = _ref.boxedBorder,
+      className = _ref.className,
+      disabled = _ref.disabled,
+      onPrimaryClick = _ref.onPrimaryClick,
+      onSecondaryClick = _ref.onSecondaryClick,
+      primaryButtonLabel = _ref.primaryButtonLabel,
+      primaryKind = _ref.primaryKind,
+      secondaryButtonLabel = _ref.secondaryButtonLabel,
+      secondaryKind = _ref.secondaryKind,
+      size = _ref.size,
+      style = _ref.style,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  var modeClass = boxedBorder ? "".concat(blockClass, "--boxed-set") : "".concat(blockClass, "--shadow-set");
+
+  var handlePrimaryClick = function handlePrimaryClick(e) {
+    if (onPrimaryClick) {
+      onPrimaryClick(e);
+    }
+  };
+
+  var handleSecondaryClick = function handleSecondaryClick(e) {
+    if (onSecondaryClick) {
+      onSecondaryClick(e);
+    }
+  };
+
+  return /*#__PURE__*/React.createElement(ButtonSet, _extends({}, rest, {
+    className: cx(blockClass, // Apply the block class to the main HTML element
+    className, // Apply any supplied class names to the main HTML element.
+    "".concat(blockClass, "--").concat(size), modeClass),
+    ref: ref,
+    role: "main",
+    style: _objectSpread(_objectSpread({}, style), {}, _defineProperty({}, "--".concat(blockClass, "--border-color"), borderColor))
+  }), /*#__PURE__*/React.createElement(Button, {
+    className: "".concat(blockClass, "__secondary-button"),
+    kind: secondaryKind,
+    onClick: handleSecondaryClick,
+    disabled: disabled,
+    size: size
+  }, secondaryButtonLabel), /*#__PURE__*/React.createElement(Button, {
+    className: "".concat(blockClass, "__primary-button"),
+    kind: primaryKind,
+    onClick: handlePrimaryClick,
+    disabled: disabled,
+    size: size
+  }, primaryButtonLabel));
+}); // Return a placeholder if not released and not enabled by feature flag.
+
+ExampleComponent = pkg.checkComponentEnabled(ExampleComponent, componentName); // The display name of the component, used by React. Note that displayName
+// is used in preference to relying on function.name.
+
+ExampleComponent.displayName = componentName; // The types and DocGen commentary for the component props,
+// in alphabetical order (for consistency).
+// See https://www.npmjs.com/package/prop-types#usage.
+
+ExampleComponent.propTypes = {
+  /**
+   * What border color (HTML color value) to use.
+   */
+  borderColor: PropTypes.string,
+
+  /**
+   * If true, the border is a box, otherwise it is a shadow.
+   */
+  boxedBorder: PropTypes.bool,
+
+  /**
+   * Provide an optional class to be applied to the containing node.
+   */
+  className: PropTypes.string,
+
+  /**
+   * If true, the buttons are disabled, otherwise they can be used.
+   */
+  disabled: PropTypes.bool,
+
+  /**
+   * An optional primary button click handler.
+   */
+  onPrimaryClick: PropTypes.func,
+
+  /**
+   * An optional secondary button click handler.
+   */
+  onSecondaryClick: PropTypes.func,
+
+  /**
+   * The primary button label.
+   */
+  primaryButtonLabel: PropTypes.string.isRequired,
+
+  /**
+   * The kind of button for the primary button ('primary' or 'danger').
+   */
+  primaryKind: PropTypes.oneOf(['primary', 'danger']),
+
+  /**
+   * The secondary button label.
+   */
+  secondaryButtonLabel: PropTypes.string.isRequired,
+
+  /**
+   * The kind of button for the secondary button ('secondary' or 'tertiary').
+   */
+  secondaryKind: PropTypes.oneOf(['secondary', 'tertiary']),
+
+  /**
+   * The size for the buttons ('default', 'small' or 'field').
+   */
+  size: PropTypes.oneOf(['default', 'small', 'field']),
+
+  /**
+   * Optional style settings for the containing node.
+   */
+  style: PropTypes.object
+}; // Default values for component props. Default values are not required for
+// props that are required, nor for props where the component can apply
+// 'undefined' values reasonably. Default values should be provided when the
+// component needs to make a choice or assumption when a prop is not supplied.
+
+ExampleComponent.defaultProps = {
+  boxedBorder: false,
+  primaryKind: 'primary',
+  secondaryKind: 'secondary',
+  size: 'default'
+};

package/es/components/ExampleComponent/index.js

@@ -0,0 +1,7 @@
+/**
+ * Copyright IBM Corp. 2020, 2021
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+export { ExampleComponent } from './ExampleComponent';

package/es/components/ExportModal/ExportModal.js

@@ -0,0 +1,276 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["body", "className", "error", "errorMessage", "filename", "inputLabel", "invalidInputText", "loading", "loadingMessage", "onClose", "onRequestSubmit", "open", "preformattedExtensions", "preformattedExtensionsLabel", "primaryButtonText", "secondaryButtonText", "successMessage", "successful", "title", "validExtensions"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+//
+// Copyright IBM Corp. 2020, 2021
+//
+// 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 React, { useState, useRef, forwardRef } from 'react';
+import { Button, ComposedModal, ModalHeader, ModalFooter, ModalBody, TextInput, RadioButton, RadioButtonGroup, FormGroup, Loading } from 'carbon-components-react';
+import cx from 'classnames';
+import { ErrorFilled16, CheckmarkFilled16 } from '@carbon/icons-react';
+import PropTypes from 'prop-types';
+import { getDevtoolsProps } from '../../global/js/utils/devtools';
+import uuidv4 from '../../global/js/utils/uuidv4';
+import { pkg } from '../../settings';
+var componentName = 'ExportModal';
+export var ExportModal = /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var _preformattedExtensio;
+
+  var body = _ref.body,
+      className = _ref.className,
+      error = _ref.error,
+      errorMessage = _ref.errorMessage,
+      filename = _ref.filename,
+      inputLabel = _ref.inputLabel,
+      invalidInputText = _ref.invalidInputText,
+      loading = _ref.loading,
+      loadingMessage = _ref.loadingMessage,
+      onClose = _ref.onClose,
+      onRequestSubmit = _ref.onRequestSubmit,
+      open = _ref.open,
+      preformattedExtensions = _ref.preformattedExtensions,
+      preformattedExtensionsLabel = _ref.preformattedExtensionsLabel,
+      primaryButtonText = _ref.primaryButtonText,
+      secondaryButtonText = _ref.secondaryButtonText,
+      successMessage = _ref.successMessage,
+      successful = _ref.successful,
+      title = _ref.title,
+      validExtensions = _ref.validExtensions,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  var _useState = useState(filename),
+      _useState2 = _slicedToArray(_useState, 2),
+      name = _useState2[0],
+      setName = _useState2[1];
+
+  var _useState3 = useState(false),
+      _useState4 = _slicedToArray(_useState3, 2),
+      dirtyInput = _useState4[0],
+      setDirtyInput = _useState4[1]; // by default (if it exists) use the first extension in the extension array
+
+
+  var _useState5 = useState(preformattedExtensions === null || preformattedExtensions === void 0 ? void 0 : (_preformattedExtensio = preformattedExtensions[0]) === null || _preformattedExtensio === void 0 ? void 0 : _preformattedExtensio.extension),
+      _useState6 = _slicedToArray(_useState5, 2),
+      extension = _useState6[0],
+      setExtension = _useState6[1];
+
+  var onNameChangeHandler = function onNameChangeHandler(evt) {
+    setName(evt.target.value);
+  };
+
+  var onExtensionChangeHandler = function onExtensionChangeHandler(value) {
+    setExtension(value);
+  };
+
+  var onBlurHandler = function onBlurHandler() {
+    setDirtyInput(true);
+  };
+
+  var onSubmitHandler = function onSubmitHandler() {
+    var returnName = extension ? "".concat(filename, ".").concat(extension.toLocaleLowerCase()) : name;
+    onRequestSubmit(returnName);
+  };
+
+  var hasInvalidExtension = function hasInvalidExtension() {
+    if (!dirtyInput || !validExtensions || !validExtensions.length) {
+      return false;
+    }
+
+    if (!name.includes('.')) {
+      return true;
+    }
+
+    var ext = name.split('.').pop();
+
+    if (!validExtensions.includes(ext)) {
+      return true;
+    }
+
+    return false;
+  };
+
+  var blockClass = "".concat(pkg.prefix, "--export-modal");
+  var internalId = useRef(uuidv4());
+  var primaryButtonDisabled = loading || !name || hasInvalidExtension();
+  var submitted = loading || error || successful;
+  return /*#__PURE__*/React.createElement(ComposedModal, _extends({}, rest, {
+    className: cx(blockClass, className),
+    "aria-label": title,
+    size: "sm",
+    preventCloseOnClickOutside: true
+  }, _objectSpread({
+    open: open,
+    ref: ref,
+    onClose: onClose
+  }, getDevtoolsProps(componentName))), /*#__PURE__*/React.createElement(ModalHeader, {
+    className: "".concat(blockClass, "__header"),
+    title: title
+  }), /*#__PURE__*/React.createElement(ModalBody, {
+    className: "".concat(blockClass, "__body-container")
+  }, !submitted && /*#__PURE__*/React.createElement(React.Fragment, null, body && /*#__PURE__*/React.createElement("p", {
+    className: "".concat(blockClass, "__body")
+  }, body), preformattedExtensions.length ? /*#__PURE__*/React.createElement(FormGroup, {
+    legendText: preformattedExtensionsLabel
+  }, /*#__PURE__*/React.createElement(RadioButtonGroup, {
+    orientation: "vertical",
+    onChange: onExtensionChangeHandler,
+    valueSelected: extension,
+    name: "extensions"
+  }, preformattedExtensions.map(function (o) {
+    return /*#__PURE__*/React.createElement(RadioButton, {
+      key: o.extension,
+      id: o.extension,
+      value: o.extension,
+      labelText: "".concat(o.extension, " (").concat(o.description, ")")
+    });
+  }))) : /*#__PURE__*/React.createElement(TextInput, {
+    id: "text-input--".concat(internalId.current),
+    value: name,
+    onChange: onNameChangeHandler,
+    labelText: inputLabel,
+    invalid: hasInvalidExtension(),
+    invalidText: invalidInputText,
+    onBlur: onBlurHandler
+  })), /*#__PURE__*/React.createElement("div", {
+    className: "".concat(blockClass, "__messaging")
+  }, loading && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Loading, {
+    small: true,
+    withOverlay: false
+  }), /*#__PURE__*/React.createElement("p", null, loadingMessage)), successful && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(CheckmarkFilled16, {
+    className: "".concat(blockClass, "__checkmark-icon")
+  }), /*#__PURE__*/React.createElement("p", null, successMessage)), error && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ErrorFilled16, {
+    className: "".concat(blockClass, "__error-icon")
+  }), /*#__PURE__*/React.createElement("p", null, errorMessage)))), !submitted && /*#__PURE__*/React.createElement(ModalFooter, {
+    className: "".concat(blockClass, "__footer")
+  }, /*#__PURE__*/React.createElement(Button, {
+    type: "button",
+    kind: "secondary",
+    onClick: onClose
+  }, secondaryButtonText), /*#__PURE__*/React.createElement(Button, {
+    type: "submit",
+    kind: "primary",
+    onClick: onSubmitHandler,
+    disabled: primaryButtonDisabled
+  }, primaryButtonText)));
+}); // Return a placeholder if not released and not enabled by feature flag
+
+ExportModal = pkg.checkComponentEnabled(ExportModal, componentName);
+ExportModal.propTypes = {
+  /**
+   * Body content for the modal
+   */
+  body: PropTypes.string,
+
+  /**
+   * Optional class name
+   */
+  className: PropTypes.string,
+
+  /**
+   * specify if an error occurred
+   */
+  error: PropTypes.bool,
+
+  /**
+   * messaging to display in the event of an error
+   */
+  errorMessage: PropTypes.string,
+
+  /**
+   * name of the file being exported
+   */
+  filename: PropTypes.string.isRequired,
+
+  /**
+   * label for the text input
+   */
+  inputLabel: PropTypes.string,
+
+  /**
+   * text for an invalid input
+   */
+  invalidInputText: PropTypes.string,
+
+  /**
+   * specify if the modal is in a loading state
+   */
+  loading: PropTypes.bool,
+
+  /**
+   * message to display during the loading state
+   */
+  loadingMessage: PropTypes.string,
+
+  /**
+   * Specify a handler for closing modal
+   */
+  onClose: PropTypes.func,
+
+  /**
+   * Specify a handler for "submitting" modal. Returns the file name
+   */
+  onRequestSubmit: PropTypes.func,
+
+  /**
+   * Specify whether the Modal is currently open
+   */
+  open: PropTypes.bool,
+
+  /**
+   * Array of extensions to display as radio buttons
+   */
+  preformattedExtensions: PropTypes.arrayOf(PropTypes.shape({
+    extension: PropTypes.string,
+    description: PropTypes.string
+  })),
+
+  /**
+   * Label for the preformatted label form group
+   */
+  preformattedExtensionsLabel: PropTypes.string,
+
+  /**
+   * Specify the text for the primary button
+   */
+  primaryButtonText: PropTypes.string.isRequired,
+
+  /**
+   * Specify the text for the secondary button
+   */
+  secondaryButtonText: PropTypes.string.isRequired,
+
+  /**
+   * messaging to display if the export was successful
+   */
+  successMessage: PropTypes.string,
+
+  /**
+   * specify if the export was successful
+   */
+  successful: PropTypes.bool,
+
+  /**
+   * The text displayed at the top of the modal
+   */
+  title: PropTypes.string.isRequired,
+
+  /**
+   * array of valid extensions the file can have
+   */
+  validExtensions: PropTypes.array
+};
+ExportModal.defaultProps = {
+  preformattedExtensions: [],
+  validExtensions: []
+};
+ExportModal.displayName = componentName;

package/es/components/ExportModal/index.js

@@ -0,0 +1,7 @@
+//
+// Copyright IBM Corp. 2020, 2021
+//
+// This source code is licensed under the Apache-2.0 license found in the
+// LICENSE file in the root directory of this source tree.
+//
+export { ExportModal } from './ExportModal';

package/es/components/ExpressiveCard/ExpressiveCard.js

@@ -0,0 +1,138 @@
+import _extends from "@babel/runtime/helpers/extends";
+//
+// Copyright IBM Corp. 2020, 2021
+//
+// 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 React, { forwardRef } from 'react';
+import PropTypes from 'prop-types';
+import { Card } from '../Card';
+import { getDevtoolsProps } from '../../global/js/utils/devtools';
+import { prepareProps } from '../../global/js/utils/props-helper';
+import { pkg } from '../../settings';
+var componentName = 'ExpressiveCard';
+export var ExpressiveCard = /*#__PURE__*/forwardRef(function (props, ref) {
+  var validProps = prepareProps(props, ['actionIconsPosition', 'overflowActions', 'productive', 'titleSize']);
+  return /*#__PURE__*/React.createElement(Card, _extends({
+    ref: ref
+  }, validProps, getDevtoolsProps(componentName)));
+}); // Return a placeholder if not released and not enabled by feature flag
+
+ExpressiveCard = pkg.checkComponentEnabled(ExpressiveCard, componentName);
+ExpressiveCard.propTypes = {
+  /**
+   * Icons that are displayed on card. Refer to design documentation for implementation guidelines
+   */
+  actionIcons: PropTypes.arrayOf(PropTypes.shape({
+    id: PropTypes.string,
+    icon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+    onKeyDown: PropTypes.func,
+    onClick: PropTypes.func,
+    iconDescription: PropTypes.string
+  })),
+
+  /**
+   * Content that shows in the body of the card
+   */
+  children: PropTypes.node,
+
+  /**
+   * Optional user provided class
+   */
+  className: PropTypes.string,
+
+  /**
+   * Optional header description
+   */
+  description: PropTypes.string,
+
+  /**
+   * Optional label for the top of the card
+   */
+  label: PropTypes.string,
+
+  /**
+   * Optional media content like an image to be placed in the card
+   */
+  media: PropTypes.node,
+
+  /**
+   * Establishes the position of the media in the card
+   */
+  mediaPosition: PropTypes.oneOf(['top', 'left']),
+
+  /**
+   * Provides the callback for a clickable card
+   */
+  onClick: PropTypes.func,
+
+  /**
+   * Function that's called from the primary button or action icon
+   */
+  onPrimaryButtonClick: PropTypes.func,
+
+  /**
+   * Function that's called from the secondary button
+   */
+  onSecondaryButtonClick: PropTypes.func,
+
+  /**
+   * Provides the icon that's displayed at the top of the card
+   */
+  pictogram: PropTypes.object,
+
+  /**
+   * Optionally specify an href for your Button to become an <a> element
+   */
+  primaryButtonHref: PropTypes.string,
+
+  /**
+   * Optional prop to allow overriding the icon rendering. Can be a React component class
+   */
+  primaryButtonIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+
+  /**
+   * Establishes the kind of button displayed for the primary button
+   */
+  primaryButtonKind: PropTypes.oneOf(['primary', 'ghost']),
+
+  /**
+   * The text that's displayed in the primary button
+   */
+  primaryButtonText: PropTypes.string,
+
+  /**
+   * Optionally specify an href for your Button to become an <a> element
+   */
+  secondaryButtonHref: PropTypes.string,
+
+  /**
+   * Optional prop to allow overriding the icon rendering. Can be a React component class
+   */
+  secondaryButtonIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
+
+  /**
+   * Establishes the kind of button displayed for the secondary button
+   */
+  secondaryButtonKind: PropTypes.oneOf(['secondary', 'ghost']),
+
+  /**
+   * The text that's displayed in the secondary button
+   */
+  secondaryButtonText: PropTypes.string,
+
+  /**
+   * Title that's displayed at the top of the card
+   */
+  title: PropTypes.string
+};
+ExpressiveCard.defaultProps = {
+  actionIcons: [],
+  actionIconsPosition: 'bottom',
+  mediaPosition: 'top',
+  overflowActions: [],
+  primaryButtonKind: 'primary',
+  secondaryButtonKind: 'secondary'
+};
+ExpressiveCard.displayName = componentName;

package/es/components/ExpressiveCard/index.js

@@ -0,0 +1,7 @@
+//
+// Copyright IBM Corp. 2020, 2021
+//
+// This source code is licensed under the Apache-2.0 license found in the
+// LICENSE file in the root directory of this source tree.
+//
+export { ExpressiveCard } from './ExpressiveCard';

package/es/components/HTTPErrors/HTTPError403/HTTPError403.js

@@ -0,0 +1,87 @@
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["className", "description", "errorCodeLabel", "links", "title"];
+
+/**
+ * Copyright IBM Corp. 2021, 2021
+ *
+ * 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 portions of React that are needed.
+import React from 'react'; // Other standard imports.
+
+import cx from 'classnames';
+import { arrayOf, shape, string } from 'prop-types';
+import { HTTPErrorSvg403 } from '../assets/HTTPErrorSvg403';
+import { HTTPErrorContent } from '../HTTPErrorContent';
+import { getDevtoolsProps } from '../../../global/js/utils/devtools';
+import { pkg } from '../../../settings'; // The block part of our conventional BEM class names (blockClass__E--M).
+
+var blockClass = "".concat(pkg.prefix, "--http-errors");
+var componentName = 'HTTPError403';
+export var HTTPError403 = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
+  var className = _ref.className,
+      description = _ref.description,
+      errorCodeLabel = _ref.errorCodeLabel,
+      links = _ref.links,
+      title = _ref.title,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  return /*#__PURE__*/React.createElement("div", _extends({}, rest, {
+    className: cx(blockClass, className),
+    ref: ref
+  }, getDevtoolsProps(componentName)), /*#__PURE__*/React.createElement(HTTPErrorContent, {
+    description: description,
+    errorCodeLabel: errorCodeLabel,
+    title: title,
+    links: links
+  }), /*#__PURE__*/React.createElement(HTTPErrorSvg403, {
+    className: "".concat(blockClass, "__image")
+  }));
+}); // Return a placeholder if not released and not enabled by feature flag
+
+HTTPError403 = pkg.checkComponentEnabled(HTTPError403, componentName); // The display name of the component, used by React. Note that displayName
+// is used in preference to relying on function.name.
+
+HTTPError403.displayName = componentName; // displayName is used in preference to function.name by React
+// The types and DocGen commentary for the component props,
+// in alphabetical order (for consistency).
+// See https://www.npmjs.com/package/prop-types#usage.
+
+HTTPError403.propTypes = {
+  /**
+   * Provide an optional class to be applied to the containing node
+   */
+  className: string,
+
+  /**
+   * String that will provide the description for the HTTP error code
+   */
+  description: string.isRequired,
+
+  /**
+   * String that will describe the error that occurred
+   */
+  errorCodeLabel: string.isRequired,
+
+  /**
+   * Links that will display for extra context when receiving particular errors
+   */
+  links: arrayOf(shape({
+    /**
+     * The text to display for the link
+     */
+    text: string.isRequired,
+
+    /**
+     * The link's destination
+     */
+    href: string.isRequired
+  })),
+
+  /**
+   * This will be for the main title of the HTTP error component
+   */
+  title: string.isRequired
+};