@squiz/generic-browser-lib 1.63.1-alpha.7 → 1.65.0

package/CHANGELOG.md

@@ -0,0 +1,13 @@
+# @squiz/generic-browser-lib
+
+## 1.65.0
+
+### Minor Changes
+
+- 5032c38: Added content page asset icon.
+
+## 1.64.0
+
+### Minor Changes
+
+- e717e6e: Force publish of latest code as a non-alpha version

package/lib/Icons/Generics/ArrowDown.d.ts

@@ -12,4 +12,4 @@ import React from 'react';
  */
 export default function ArrowDown({ isDecorative, ...props }: {
     isDecorative: boolean;
-} & React.SVGProps<SVGSVGElement>): JSX.Element;
+} & React.SVGProps<SVGSVGElement>): React.JSX.Element;

package/lib/Icons/Generics/ArrowRight.d.ts

@@ -12,4 +12,4 @@ import React from 'react';
  */
 export default function ArrowRight({ isDecorative, ...props }: {
     isDecorative: boolean;
-} & React.SVGProps<SVGSVGElement>): JSX.Element;
+} & React.SVGProps<SVGSVGElement>): React.JSX.Element;

package/lib/Icons/Generics/Back.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 export default function Back({ isDecorative, ...props }: {
     isDecorative: boolean;
-} & React.SVGProps<SVGSVGElement>): JSX.Element;
+} & React.SVGProps<SVGSVGElement>): React.JSX.Element;

package/lib/Icons/Generics/Close.d.ts

@@ -12,4 +12,4 @@ import React from 'react';
  */
 export default function Close({ isDecorative, ...props }: {
     isDecorative: boolean;
-} & React.SVGProps<SVGSVGElement>): JSX.Element;
+} & React.SVGProps<SVGSVGElement>): React.JSX.Element;

package/lib/Icons/Generics/Empty.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 export default function Empty({ isDecorative, ...props }: {
     isDecorative: boolean;
-} & React.SVGProps<SVGSVGElement>): JSX.Element;
+} & React.SVGProps<SVGSVGElement>): React.JSX.Element;

package/lib/Icons/Generics/Error.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 export default function Error({ isDecorative, ...props }: {
     isDecorative: boolean;
-} & React.SVGProps<SVGSVGElement>): JSX.Element;
+} & React.SVGProps<SVGSVGElement>): React.JSX.Element;

package/lib/Icons/Generics/ResourceSelect.d.ts

@@ -12,4 +12,4 @@ import React from 'react';
  */
 export default function ResourceSelected({ isDecorative, ...props }: {
     isDecorative: boolean;
-} & React.SVGProps<SVGSVGElement>): JSX.Element;
+} & React.SVGProps<SVGSVGElement>): React.JSX.Element;

package/lib/Icons/Generics/Retry.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 export default function Retry({ isDecorative, ...props }: {
     isDecorative: boolean;
-} & React.SVGProps<SVGSVGElement>): JSX.Element;
+} & React.SVGProps<SVGSVGElement>): React.JSX.Element;

package/lib/Icons/Generics/Root.d.ts

@@ -12,4 +12,4 @@ import React from 'react';
  */
 export default function Root({ isDecorative, ...props }: {
     isDecorative: boolean;
-} & React.SVGProps<SVGSVGElement>): JSX.Element;
+} & React.SVGProps<SVGSVGElement>): React.JSX.Element;

package/lib/Icons/Generics/Selected.d.ts

@@ -12,4 +12,4 @@ import React from 'react';
  */
 export default function Selected({ isDecorative, ...props }: {
     isDecorative: boolean;
-} & React.SVGProps<SVGSVGElement>): JSX.Element;
+} & React.SVGProps<SVGSVGElement>): React.JSX.Element;

package/lib/Icons/Icon.d.ts

@@ -18,7 +18,22 @@ export declare const iconSources: {
         folder: typeof import("./MatrixResources").Folder;
         generic_file: typeof import("./MatrixResources").GenericFile;
         image: typeof import("./MatrixResources").Image;
-        page_standard: typeof import("./MatrixResources").Page;
+        page_content: typeof import("./MatrixResources").PageContent;
+        page_standard: typeof import("./MatrixResources").Page; /**
+         * Renders an icon based on the resource source and the icon name
+         * @param {{resourceSource?: ResourceSources; icon?: IconOptions; props: React.HTMLAttributes<HTMLOrSVGElement>}} props - The props for the Icon component
+         * @returns {React.FunctionComponent} - The icon component
+         * @example
+         * <Icon />
+         * @example
+         * <Icon resourceSource="generic" icon="generic_file" />
+         * @example
+         * <Icon resourceSource="matrix" icon="page" />
+         * @example
+         * <Icon resourceSource="matrix" icon="page" height={24} width={24} />
+         * @example
+         * <Icon resourceSource="matrix" icon="page" className="custom-class" />
+         */
         pdf_file: typeof import("./MatrixResources").Pdf;
         powerpoint_doc: typeof import("./MatrixResources").Powerpoint;
         site: typeof import("./MatrixResources").Site;
@@ -49,4 +64,4 @@ export declare function Icon({ resourceSource, icon, componentIcon, isDecorative
     resourceSource?: ResourceSources;
     isDecorative?: boolean;
     componentIcon?: React.ReactNode | undefined;
-} & React.HTMLAttributes<HTMLElement> & React.SVGAttributes<SVGElement>): JSX.Element;
+} & React.HTMLAttributes<HTMLElement> & React.SVGAttributes<SVGElement>): React.JSX.Element;

package/lib/Icons/MatrixResources/Audio.d.ts

@@ -12,4 +12,4 @@ import React from 'react';
  */
 export default function Audio({ isDecorative, ...props }: {
     isDecorative: boolean;
-} & React.SVGProps<SVGSVGElement>): JSX.Element;
+} & React.SVGProps<SVGSVGElement>): React.JSX.Element;

package/lib/Icons/MatrixResources/Excel.d.ts

@@ -12,4 +12,4 @@ import React from 'react';
  */
 export default function Excel({ isDecorative, ...props }: {
     isDecorative: boolean;
-} & React.SVGProps<SVGSVGElement>): JSX.Element;
+} & React.SVGProps<SVGSVGElement>): React.JSX.Element;

package/lib/Icons/MatrixResources/Folder.d.ts

@@ -12,4 +12,4 @@ import React from 'react';
  */
 export default function Folder({ isDecorative, ...props }: {
     isDecorative: boolean;
-} & React.SVGProps<SVGSVGElement>): JSX.Element;
+} & React.SVGProps<SVGSVGElement>): React.JSX.Element;

package/lib/Icons/MatrixResources/GenericFile.d.ts

@@ -12,4 +12,4 @@ import React from 'react';
  */
 export default function GenericFile({ isDecorative, ...props }: {
     isDecorative: boolean;
-} & React.SVGProps<SVGSVGElement>): JSX.Element;
+} & React.SVGProps<SVGSVGElement>): React.JSX.Element;

package/lib/Icons/MatrixResources/Image.d.ts

@@ -12,4 +12,4 @@ import React from 'react';
  */
 export default function Image({ isDecorative, ...props }: {
     isDecorative: boolean;
-} & React.SVGProps<SVGSVGElement>): JSX.Element;
+} & React.SVGProps<SVGSVGElement>): React.JSX.Element;

package/lib/Icons/MatrixResources/MatrixResourceMap.d.ts

@@ -1,10 +1,11 @@
-import { Audio, Excel, Folder, GenericFile, Image, Page, Pdf, Powerpoint, Site, Video, Word } from '.';
+import { Audio, Excel, Folder, GenericFile, Image, Page, PageContent, Pdf, Powerpoint, Site, Video, Word } from '.';
 declare const MatrixResourceMap: {
     audio_file: typeof Audio;
     excel_doc: typeof Excel;
     folder: typeof Folder;
     generic_file: typeof GenericFile;
     image: typeof Image;
+    page_content: typeof PageContent;
     page_standard: typeof Page;
     pdf_file: typeof Pdf;
     powerpoint_doc: typeof Powerpoint;

package/lib/Icons/MatrixResources/MatrixResourceMap.js

@@ -8,6 +8,7 @@ const MatrixResourceMap = {
     folder: _1.Folder,
     generic_file: _1.GenericFile,
     image: _1.Image,
+    page_content: _1.PageContent,
     page_standard: _1.Page,
     pdf_file: _1.Pdf,
     powerpoint_doc: _1.Powerpoint,

package/lib/Icons/MatrixResources/Page.d.ts

@@ -12,4 +12,4 @@ import React from 'react';
  */
 export default function Page({ isDecorative, ...props }: {
     isDecorative: boolean;
-} & React.SVGProps<SVGSVGElement>): JSX.Element;
+} & React.SVGProps<SVGSVGElement>): React.JSX.Element;

package/lib/Icons/MatrixResources/PageContent.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+/**
+ * Renders the Page Content icon
+ * @param {React.SVGProps<SVGSVGElement>} props - The props for the component
+ * @returns {JSX.Element} - The component
+ * @example
+ * <PageContent />
+ * @example
+ * <PageContent height={24} width={24} />
+ * @example
+ * <PageContent className="custom-class" />
+ */
+export default function PageContent({ isDecorative, ...props }: {
+    isDecorative: boolean;
+} & React.SVGProps<SVGSVGElement>): React.JSX.Element;

package/lib/Icons/MatrixResources/PageContent.js

@@ -0,0 +1,31 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+/**
+ * Renders the Page Content icon
+ * @param {React.SVGProps<SVGSVGElement>} props - The props for the component
+ * @returns {JSX.Element} - The component
+ * @example
+ * <PageContent />
+ * @example
+ * <PageContent height={24} width={24} />
+ * @example
+ * <PageContent className="custom-class" />
+ */
+function PageContent({ isDecorative, ...props }) {
+    return (react_1.default.createElement("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...props },
+        react_1.default.createElement("path", { d: "M20 1.5H4C3.17157 1.5 2.5 2.17157 2.5 3V21C2.5 21.8284 3.17157 22.5 4 22.5H20C20.8284 22.5 21.5 21.8284 21.5 21V3C21.5 2.17157 20.8284 1.5 20 1.5Z", fill: "#CCE9ED", stroke: "#73C0CB" }),
+        react_1.default.createElement("rect", { x: "5", y: "7", width: "3", height: "1", rx: "0.5", fill: "#057E91" }),
+        react_1.default.createElement("rect", { x: "9", y: "7", width: "10", height: "2", rx: "0.5", fill: "#057E91" }),
+        react_1.default.createElement("rect", { x: "9", y: "10", width: "10", height: "2", rx: "0.5", fill: "#057E91" }),
+        react_1.default.createElement("rect", { x: "9", y: "13", width: "10", height: "2", rx: "0.5", fill: "#057E91" }),
+        react_1.default.createElement("rect", { x: "9", y: "16", width: "10", height: "2", rx: "0.5", fill: "#057E91" }),
+        react_1.default.createElement("rect", { x: "5", y: "9", width: "3", height: "1", rx: "0.5", fill: "#057E91" }),
+        react_1.default.createElement("rect", { x: "5", y: "11", width: "3", height: "1", rx: "0.5", fill: "#057E91" }),
+        react_1.default.createElement("rect", { x: "5", y: "13", width: "3", height: "1", rx: "0.5", fill: "#057E91" }),
+        !isDecorative && react_1.default.createElement("title", null, "page content icon")));
+}
+exports.default = PageContent;

package/lib/Icons/MatrixResources/Pdf.d.ts

@@ -12,4 +12,4 @@ import React from 'react';
  */
 export default function Pdf({ isDecorative, ...props }: {
     isDecorative: boolean;
-} & React.SVGProps<SVGSVGElement>): JSX.Element;
+} & React.SVGProps<SVGSVGElement>): React.JSX.Element;

package/lib/Icons/MatrixResources/Powerpoint.d.ts

@@ -12,4 +12,4 @@ import React from 'react';
  */
 export default function Powerpoint({ isDecorative, ...props }: {
     isDecorative: boolean;
-} & React.SVGProps<SVGSVGElement>): JSX.Element;
+} & React.SVGProps<SVGSVGElement>): React.JSX.Element;

package/lib/Icons/MatrixResources/Site.d.ts

@@ -12,4 +12,4 @@ import React from 'react';
  */
 export default function Site({ isDecorative, ...props }: {
     isDecorative: boolean;
-} & React.SVGProps<SVGSVGElement>): JSX.Element;
+} & React.SVGProps<SVGSVGElement>): React.JSX.Element;

package/lib/Icons/MatrixResources/Video.d.ts

@@ -12,4 +12,4 @@ import React from 'react';
  */
 export default function Video({ isDecorative, ...props }: {
     isDecorative: boolean;
-} & React.SVGProps<SVGSVGElement>): JSX.Element;
+} & React.SVGProps<SVGSVGElement>): React.JSX.Element;

package/lib/Icons/MatrixResources/Word.d.ts

@@ -14,4 +14,4 @@ import React from 'react';
  */
 export default function Word({ isDecorative, ...props }: {
     isDecorative: boolean;
-} & React.SVGProps<SVGSVGElement>): JSX.Element;
+} & React.SVGProps<SVGSVGElement>): React.JSX.Element;

package/lib/Icons/MatrixResources/index.d.ts

@@ -4,6 +4,7 @@ export { default as Folder } from './Folder';
 export { default as GenericFile } from './GenericFile';
 export { default as Image } from './Image';
 export { default as Page } from './Page';
+export { default as PageContent } from './PageContent';
 export { default as Pdf } from './Pdf';
 export { default as Powerpoint } from './Powerpoint';
 export { default as Site } from './Site';

package/lib/Icons/MatrixResources/index.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Word = exports.Video = exports.Site = exports.Powerpoint = exports.Pdf = exports.Page = exports.Image = exports.GenericFile = exports.Folder = exports.Excel = exports.Audio = void 0;
+exports.Word = exports.Video = exports.Site = exports.Powerpoint = exports.Pdf = exports.PageContent = exports.Page = exports.Image = exports.GenericFile = exports.Folder = exports.Excel = exports.Audio = void 0;
 // Export all the icons from the MatrixResources folder
 var Audio_1 = require("./Audio");
 Object.defineProperty(exports, "Audio", { enumerable: true, get: function () { return __importDefault(Audio_1).default; } });
@@ -17,6 +17,8 @@ var Image_1 = require("./Image");
 Object.defineProperty(exports, "Image", { enumerable: true, get: function () { return __importDefault(Image_1).default; } });
 var Page_1 = require("./Page");
 Object.defineProperty(exports, "Page", { enumerable: true, get: function () { return __importDefault(Page_1).default; } });
+var PageContent_1 = require("./PageContent");
+Object.defineProperty(exports, "PageContent", { enumerable: true, get: function () { return __importDefault(PageContent_1).default; } });
 var Pdf_1 = require("./Pdf");
 Object.defineProperty(exports, "Pdf", { enumerable: true, get: function () { return __importDefault(Pdf_1).default; } });
 var Powerpoint_1 = require("./Powerpoint");

package/lib/Modal/Modal.d.ts

@@ -8,4 +8,4 @@ export type ModalProps = {
     children: (titleProps: DOMAttributes<FocusableElement>) => React.ReactElement;
     scope: 'squiz-gb-scope' | 'squiz-cb-scope' | 'squiz-rb-scope';
 };
-export declare function Modal({ isDismissable, state, overlayProps, children, scope, ...props }: ModalProps): JSX.Element;
+export declare function Modal({ isDismissable, state, overlayProps, children, scope, ...props }: ModalProps): React.JSX.Element;

package/lib/Modal/ModalOpeningButton.d.ts

@@ -6,5 +6,5 @@ interface ModalOpeningButtonProps extends AriaButtonProps<'button'> {
     isDisabled?: boolean;
     title?: string;
 }
-export declare function ModalOpeningButton({ className, children, title, ...props }: ModalOpeningButtonProps): JSX.Element;
+export declare function ModalOpeningButton({ className, children, title, ...props }: ModalOpeningButtonProps): React.JSX.Element;
 export {};

package/lib/Modal/ModalTrigger.d.ts

@@ -9,4 +9,4 @@ export declare function ModalTrigger({ label, labelClasses, showLabel, container
     isDisabled?: boolean;
     children: (onClose: () => void, titleProps: DOMAttributes<FocusableElement>) => React.ReactElement;
     scope: 'squiz-gb-scope' | 'squiz-cb-scope' | 'squiz-rb-scope';
-}): JSX.Element;
+}): React.JSX.Element;

package/lib/PreviewPanel/PreviewModal.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import React, { ReactNode } from 'react';
 import { OverlayTriggerState } from 'react-stately';
 import { DOMAttributes, FocusableElement } from '@react-types/shared';
 export type PreviewModalProps = {
@@ -7,5 +7,5 @@ export type PreviewModalProps = {
     children?: ReactNode;
     onClose: () => void;
 };
-declare function PreviewModal({ state, overlayProps, children, onClose, ...props }: PreviewModalProps): JSX.Element;
+declare function PreviewModal({ state, overlayProps, children, onClose, ...props }: PreviewModalProps): React.JSX.Element;
 export default PreviewModal;

package/lib/PreviewPanel/PreviewPanel.d.ts

@@ -11,4 +11,4 @@ export interface PreviewPanelProps {
     ResourceComponent?: React.ElementType;
     selectionCallback?: (param: any) => void;
 }
-export declare const PreviewPanel: ({ resource, previewModalOverlayProps, modalState, onSelect, onClose, ResourceComponent, selectionCallback, }: PreviewPanelProps) => JSX.Element;
+export declare const PreviewPanel: ({ resource, previewModalOverlayProps, modalState, onSelect, onClose, ResourceComponent, selectionCallback, }: PreviewPanelProps) => React.JSX.Element;

package/lib/ResetButton/ResetButton.d.ts

@@ -1,5 +1,6 @@
+import React from 'react';
 export type ResetButtonProps = {
     onClick: () => void;
     isDisabled?: boolean;
 };
-export declare const ResetButton: ({ onClick, isDisabled }: ResetButtonProps) => JSX.Element;
+export declare const ResetButton: ({ onClick, isDisabled }: ResetButtonProps) => React.JSX.Element;

package/lib/ResourceItem/ResourceItem.d.ts

@@ -1,4 +1,4 @@
-import { ReactElement } from 'react';
+import React, { ReactElement } from 'react';
 import { DOMAttributes, FocusableElement } from '@react-types/shared';
 import { OverlayTriggerState } from 'react-stately';
 import { ResourceSources } from '../Icons/Icon';
@@ -17,5 +17,5 @@ interface ResourceItem<T> {
     iconSource?: ResourceSources;
     showChevron?: boolean;
 }
-declare const ResourceItem: <T>({ item, selected, label, type, childCount, previewModalState, onSelect, onDrillDown, className, allowedTypes, componentIcon, iconSource, showChevron, }: ResourceItem<T>) => JSX.Element;
+declare const ResourceItem: <T>({ item, selected, label, type, childCount, previewModalState, onSelect, onDrillDown, className, allowedTypes, componentIcon, iconSource, showChevron, }: ResourceItem<T>) => React.JSX.Element;
 export { ResourceItem };

package/lib/ResourceState/ResourceState.d.ts

@@ -1,8 +1,9 @@
+import React from 'react';
 interface ResourceState {
     state: 'error' | 'empty';
     message?: string;
     handleReload?: () => void;
     showButton?: boolean;
 }
-declare const ResourceState: ({ state, message, handleReload, showButton }: ResourceState) => JSX.Element;
+declare const ResourceState: ({ state, message, handleReload, showButton }: ResourceState) => React.JSX.Element;
 export { ResourceState };

package/lib/Skeleton/List/SkeletonList.d.ts

@@ -1,6 +1,7 @@
+import React from 'react';
 export type SkeletonListProps = {
     itemCount: number;
     className?: string;
     ariaLabel?: string;
 };
-export declare const SkeletonList: ({ itemCount, className, ariaLabel }: SkeletonListProps) => JSX.Element;
+export declare const SkeletonList: ({ itemCount, className, ariaLabel }: SkeletonListProps) => React.JSX.Element;

package/lib/Skeleton/ListItem/SkeletonListItem.d.ts

@@ -1 +1,2 @@
-export declare const SkeletonListItem: () => JSX.Element;
+import React from 'react';
+export declare const SkeletonListItem: () => React.JSX.Element;

package/package.json

@@ -1,9 +1,13 @@
 {
   "name": "@squiz/generic-browser-lib",
-  "version": "1.63.1-alpha.7",
+  "version": "1.65.0",
   "description": "Package with reusable components used by resource/component browsers",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",
+  "private": false,
+  "publishConfig": {
+    "access": "public"
+  },
   "scripts": {
     "compile": "npm run clean && npm run compile:styles && npm run compile:code",
     "compile:code": "tsc",
@@ -33,8 +37,8 @@
     "@testing-library/react": "14.0.0",
     "@testing-library/user-event": "14.4.3",
     "@types/postcss-js": "4.0.0",
-    "@types/react": "18.0.26",
-    "@types/react-dom": "18.0.9",
+    "@types/react": "^18.2.45",
+    "@types/react-dom": "^18.2.18",
     "@vitejs/plugin-react-swc": "3.0.0",
     "autoprefixer": "10.4.14",
     "esbuild": "0.17.17",
@@ -71,6 +75,5 @@
   },
   "volta": {
     "node": "18.15.0"
-  },
-  "gitHead": "5ae8c433076d96683b0a98113f0e69f7c0dd0bff"
+  }
 }

package/src/Icons/Icon.stories.tsx

@@ -66,6 +66,12 @@ Page.args = {
   resourceSource: 'matrix',
 };
 
+export const PageContent = Template.bind({});
+PageContent.args = {
+  icon: 'page_content',
+  resourceSource: 'matrix',
+};
+
 export const Pdf = Template.bind({});
 Pdf.args = {
   icon: 'pdf_file',

package/src/Icons/MatrixResources/MatrixResourceMap.ts

@@ -1,4 +1,4 @@
-import { Audio, Excel, Folder, GenericFile, Image, Page, Pdf, Powerpoint, Site, Video, Word } from '.';
+import { Audio, Excel, Folder, GenericFile, Image, Page, PageContent, Pdf, Powerpoint, Site, Video, Word } from '.';
 
 // Define our map of matrix types to icons
 const MatrixResourceMap = {
@@ -7,6 +7,7 @@ const MatrixResourceMap = {
   folder: Folder,
   generic_file: GenericFile, // fallback when a type doesn't match.
   image: Image,
+  page_content: PageContent,
   page_standard: Page,
   pdf_file: Pdf,
   powerpoint_doc: Powerpoint,

package/src/Icons/MatrixResources/PageContent.tsx

@@ -0,0 +1,36 @@
+import React from 'react';
+
+/**
+ * Renders the Page Content icon
+ * @param {React.SVGProps<SVGSVGElement>} props - The props for the component
+ * @returns {JSX.Element} - The component
+ * @example
+ * <PageContent />
+ * @example
+ * <PageContent height={24} width={24} />
+ * @example
+ * <PageContent className="custom-class" />
+ */
+export default function PageContent({
+  isDecorative,
+  ...props
+}: { isDecorative: boolean } & React.SVGProps<SVGSVGElement>) {
+  return (
+    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+      <path
+        d="M20 1.5H4C3.17157 1.5 2.5 2.17157 2.5 3V21C2.5 21.8284 3.17157 22.5 4 22.5H20C20.8284 22.5 21.5 21.8284 21.5 21V3C21.5 2.17157 20.8284 1.5 20 1.5Z"
+        fill="#CCE9ED"
+        stroke="#73C0CB"
+      />
+      <rect x="5" y="7" width="3" height="1" rx="0.5" fill="#057E91" />
+      <rect x="9" y="7" width="10" height="2" rx="0.5" fill="#057E91" />
+      <rect x="9" y="10" width="10" height="2" rx="0.5" fill="#057E91" />
+      <rect x="9" y="13" width="10" height="2" rx="0.5" fill="#057E91" />
+      <rect x="9" y="16" width="10" height="2" rx="0.5" fill="#057E91" />
+      <rect x="5" y="9" width="3" height="1" rx="0.5" fill="#057E91" />
+      <rect x="5" y="11" width="3" height="1" rx="0.5" fill="#057E91" />
+      <rect x="5" y="13" width="3" height="1" rx="0.5" fill="#057E91" />
+      {!isDecorative && <title>page content icon</title>}
+    </svg>
+  );
+}

package/src/Icons/MatrixResources/index.tsx

@@ -5,6 +5,7 @@ export { default as Folder } from './Folder';
 export { default as GenericFile } from './GenericFile';
 export { default as Image } from './Image';
 export { default as Page } from './Page';
+export { default as PageContent } from './PageContent';
 export { default as Pdf } from './Pdf';
 export { default as Powerpoint } from './Powerpoint';
 export { default as Site } from './Site';