@carbon/ibm-products 2.25.0 → 2.27.0

package/lib/components/FullPageError/FullPageError.js

@@ -17,13 +17,14 @@ var react = require('@carbon/react');
 var ErrorGenericSVG = require('./assets/ErrorGenericSVG.js');
 var devtools = require('../../global/js/utils/devtools.js');
 var settings = require('../../settings.js');
+var Error404SVG = require('./assets/Error404SVG.js');
+var Error403SVG = require('./assets/Error403SVG.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-var _br;
-var _excluded = ["children", "className", "description", "errorLabel", "title"];
+var _excluded = ["children", "className", "description", "errorLabel", "kind", "title"];
 
 // Carbon and package components we use.
 /* TODO: @import(s) of carbon components and other package components. */
@@ -44,9 +45,9 @@ var componentName = 'FullPageError';
 // or assumption when a prop is not supplied.
 
 // Default values for props
-// const defaults = {
-//   /* TODO: add defaults for relevant props if needed */
-// };
+var defaults = {
+  kind: 'custom'
+};
 
 /**
  * TODO: A description of the component.
@@ -56,8 +57,33 @@ exports.FullPageError = /*#__PURE__*/React__default["default"].forwardRef(functi
     className = _ref.className,
     description = _ref.description,
     errorLabel = _ref.errorLabel,
+    _ref$kind = _ref.kind,
+    kind = _ref$kind === void 0 ? defaults.kind : _ref$kind,
     title = _ref.title,
     rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
+  var errorData = {
+    403: {
+      title: 'Access denied',
+      description: 'You are not authorized to access the requested page. Please verify that you are logged in to the hosting environment and your access permissions are correct.',
+      svg: /*#__PURE__*/React__default["default"].createElement(Error403SVG.Error403SVG, {
+        className: index["default"]("".concat(blockClass, "__error-svg"), "".concat(blockClass, "__error-403"))
+      })
+    },
+    404: {
+      title: 'Page not found',
+      description: 'The page you requested has moved or is unavailable, or the specified URL is not valid. Please check the URL or search the site for the requested content.',
+      svg: /*#__PURE__*/React__default["default"].createElement(Error404SVG.Error404SVG, {
+        className: index["default"]("".concat(blockClass, "__error-svg"), "".concat(blockClass, "__error-404"))
+      })
+    },
+    custom: {
+      title: title,
+      description: description,
+      svg: /*#__PURE__*/React__default["default"].createElement(ErrorGenericSVG.ErrorGenericSVG, {
+        className: index["default"]("".concat(blockClass, "__error-svg"), "".concat(blockClass, "__error-custom"))
+      })
+    }
+  };
   return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({}, rest, {
     className: index["default"](blockClass,
     // Apply the block class to the main HTML element
@@ -83,20 +109,15 @@ exports.FullPageError = /*#__PURE__*/React__default["default"].forwardRef(functi
     className: "".concat(blockClass, "__error-title")
   }, /*#__PURE__*/React__default["default"].createElement("span", {
     className: "".concat(blockClass, "__error-label")
-  }, "\u21B3 ", errorLabel), _br || (_br = /*#__PURE__*/React__default["default"].createElement("br", null)), /*#__PURE__*/React__default["default"].createElement("span", null, title)), /*#__PURE__*/React__default["default"].createElement("p", {
+  }, "\u21B3 ", kind === 'custom' ? errorLabel : "Error ".concat(kind)), /*#__PURE__*/React__default["default"].createElement("span", null, errorData[kind].title)), /*#__PURE__*/React__default["default"].createElement("p", {
     className: "".concat(blockClass, "__description")
-  }, description), children), /*#__PURE__*/React__default["default"].createElement(react.Column, {
+  }, description || errorData[kind].description), children), /*#__PURE__*/React__default["default"].createElement(react.Column, {
     sm: 4,
     md: 5,
     lg: 10
   }, /*#__PURE__*/React__default["default"].createElement("div", {
-    style: {
-      display: 'flex',
-      height: '100%'
-    }
-  }, /*#__PURE__*/React__default["default"].createElement(ErrorGenericSVG.ErrorGenericSVG, {
-    className: "".concat(blockClass, "__error-svg")
-  }))))));
+    className: "".concat(blockClass, "__error-svg-container")
+  }, errorData[kind].svg)))));
 });
 
 // Return a placeholder if not released and not enabled by feature flag
@@ -119,13 +140,18 @@ exports.FullPageError.propTypes = {
    */
   className: index$1["default"].string,
   /**
-   * String that will provide the description for the error code
+   * String that will provide the description for the error code. <br/>
+   * This is optional for 403 and 404 kinds, and passing this would override their default descriptions.
    */
   description: index$1["default"].string.isRequired,
   /**
    * String that will describe the error that occurred
    */
   errorLabel: index$1["default"].string.isRequired,
+  /**
+   * The kind of error page to be displayed, default is custom
+   */
+  kind: index$1["default"].oneOf(['custom', '403', '404']),
   /**
    * This will be for the main title of the FullPageError component
    */

package/lib/components/FullPageError/assets/Error403SVG.d.ts

@@ -0,0 +1,9 @@
+export function Error403SVG({ className }: {
+    className: any;
+}): import("react/jsx-runtime").JSX.Element;
+export namespace Error403SVG {
+    namespace propTypes {
+        export { string as className };
+    }
+}
+import { string } from 'prop-types';