@squiz/resource-browser 1.32.1-alpha.12

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

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

package/lib/Icons/MatrixResources/GenericFile.js

@@ -0,0 +1,28 @@
+"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 GenericFile icon
+ * @param {React.SVGProps<SVGSVGElement>} props - The props for the GenericFile component
+ * @returns {JSX.Element} - The GenericFile component
+ * @example
+ * <GenericFile />
+ * @example
+ * <GenericFile height={24} width={24} />
+ * @example
+ * <GenericFile className="custom-class" />
+ */
+function GenericFile({ isDecorative, ...props }) {
+    return (react_1.default.createElement("svg", { fill: "none", height: "24", viewBox: "0 0 24 24", width: "24", xmlns: "http://www.w3.org/2000/svg", ...props },
+        react_1.default.createElement("path", { d: "m15.9393 3.23223-.3515.35154.3515-.35154c-.4688-.46884-1.1047-.73223-1.7677-.73223h-8.1716c-.82843 0-1.5.67157-1.5 1.5v16c0 .8284.67157 1.5 1.5 1.5h12c.8284 0 1.5-.6716 1.5-1.5v-12.17157c0-.66304-.2634-1.29893-.7322-1.76777z", fill: "#fff", stroke: "#74b1e6" }),
+        react_1.default.createElement("path", { d: "m14.5 3v3.5c0 .55228.4477 1 1 1h3.5", stroke: "#74b1e6" }),
+        react_1.default.createElement("path", { d: "m14.5 7.5v-5l5 5z", fill: "#cce2f6" }),
+        react_1.default.createElement("g", { stroke: "#74b1e6" },
+            react_1.default.createElement("path", { d: "m15.9393 3.23223-.3515.35154.3515-.35154c-.4688-.46884-1.1047-.73223-1.7677-.73223h-8.1716c-.82843 0-1.5.67157-1.5 1.5v16c0 .8284.67157 1.5 1.5 1.5h12c.8284 0 1.5-.6716 1.5-1.5v-12.17157c0-.66304-.2634-1.29893-.7322-1.76777z" }),
+            react_1.default.createElement("path", { d: "m14.5 3v3.5c0 .55228.4477 1 1 1h3.5" })),
+        !isDecorative && react_1.default.createElement("title", null, "generic file icon")));
+}
+exports.default = GenericFile;

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

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

package/lib/Icons/MatrixResources/Image.js

@@ -0,0 +1,26 @@
+"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 Image icon
+ * @param {React.SVGProps<SVGSVGElement>} props - The props for the Image component
+ * @returns {JSX.Element} - The Image component
+ * @example
+ * <Image />
+ * @example
+ * <Image height={24} width={24} />
+ * @example
+ * <Image className="custom-class" />
+ */
+function Image({ isDecorative, ...props }) {
+    return (react_1.default.createElement("svg", { fill: "none", height: "24", viewBox: "0 0 24 24", width: "24", xmlns: "http://www.w3.org/2000/svg", ...props },
+        react_1.default.createElement("path", { d: "m21 17.5h.5v-.5-13c0-.82843-.6716-1.5-1.5-1.5h-16c-.82843 0-1.5.67157-1.5 1.5v13 .5h.5z", fill: "#cce2f6", stroke: "#74b1e6" }),
+        react_1.default.createElement("circle", { cx: "15.5", cy: "8.5", fill: "#fbefd2", r: "3", stroke: "#f0c14f" }),
+        react_1.default.createElement("path", { d: "m21.3749 16.0025.1251.1418v.189 3.6667c0 .8284-.6716 1.5-1.5 1.5h-8.5-1.1506l.7851-.8412 6.2481-6.6944c.6044-.6476 1.6353-.6331 2.2214.031z", fill: "#cee9d8", stroke: "#79c292" }),
+        react_1.default.createElement("path", { d: "m2.62777 13.6262-.12777.1424v.1914 6.04c0 .8284.67157 1.5 1.5 1.5h13 1.0974l-.7201-.8281-9.25697-10.6455c-.59189-.68068-1.64634-.68877-2.2486-.0173z", fill: "#79c292", stroke: "#098934" }),
+        !isDecorative && react_1.default.createElement("title", null, "image icon")));
+}
+exports.default = Image;

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

@@ -0,0 +1,15 @@
+import { Audio, Excel, Folder, GenericFile, Image, Page, Pdf, Powerpoint, Site, Video, Word } from '.';
+declare const MatrixResourceMap: {
+    audio: typeof Audio;
+    excel: typeof Excel;
+    folder: typeof Folder;
+    generic_file: typeof GenericFile;
+    image: typeof Image;
+    page_standard: typeof Page;
+    pdf: typeof Pdf;
+    powerpoint: typeof Powerpoint;
+    site: typeof Site;
+    video: typeof Video;
+    word: typeof Word;
+};
+export default MatrixResourceMap;

package/lib/Icons/MatrixResources/MatrixResourceMap.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const _1 = require(".");
+// Define our map of matrix types to icons
+const MatrixResourceMap = {
+    audio: _1.Audio,
+    excel: _1.Excel,
+    folder: _1.Folder,
+    generic_file: _1.GenericFile,
+    image: _1.Image,
+    page_standard: _1.Page,
+    pdf: _1.Pdf,
+    powerpoint: _1.Powerpoint,
+    site: _1.Site,
+    video: _1.Video,
+    word: _1.Word,
+};
+// Export our map
+exports.default = MatrixResourceMap;

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

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

package/lib/Icons/MatrixResources/Page.js

@@ -0,0 +1,30 @@
+"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 icon
+ * @param {React.SVGProps<SVGSVGElement>} props - The props for the Page component
+ * @returns {JSX.Element} - The Page component
+ * @example
+ * <Page />
+ * @example
+ * <Page height={24} width={24} />
+ * @example
+ * <Page className="custom-class" />
+ */
+function Page({ isDecorative, ...props }) {
+    return (react_1.default.createElement("svg", { fill: "none", height: "24", viewBox: "0 0 24 24", width: "24", xmlns: "http://www.w3.org/2000/svg", ...props },
+        react_1.default.createElement("path", { d: "m4 1.5c-.82843 0-1.5.67157-1.5 1.5v18c0 .8284.67157 1.5 1.5 1.5h16c.8284 0 1.5-.6716 1.5-1.5v-18c0-.82843-.6716-1.5-1.5-1.5z", fill: "#cee9d8", stroke: "#79c292" }),
+        react_1.default.createElement("g", { fill: "#098934" },
+            react_1.default.createElement("rect", { height: "1", rx: ".5", width: "6", x: "6", y: "8" }),
+            react_1.default.createElement("rect", { height: "1", rx: ".5", width: "6", x: "6", y: "10" }),
+            react_1.default.createElement("rect", { height: "1", rx: ".5", width: "12", x: "6", y: "12" }),
+            react_1.default.createElement("rect", { height: "1", rx: ".5", width: "12", x: "6", y: "14" }),
+            react_1.default.createElement("rect", { height: "1", rx: ".5", width: "12", x: "6", y: "16" }),
+            react_1.default.createElement("rect", { height: "1", rx: ".5", width: "12", x: "6", y: "18" })),
+        !isDecorative && react_1.default.createElement("title", null, "page standard icon")));
+}
+exports.default = Page;

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

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

package/lib/Icons/MatrixResources/Pdf.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 Pdf icon
+ * @param {React.SVGProps<SVGSVGElement>} props - The props for the Pdf component
+ * @returns {JSX.Element} - The Pdf component
+ * @example
+ * <Pdf />
+ * @example
+ * <Pdf height={24} width={24} />
+ * @example
+ * <Pdf className="custom-class" />
+ */
+function Pdf({ isDecorative, ...props }) {
+    return (react_1.default.createElement("svg", { fill: "none", height: "24", viewBox: "0 0 24 24", width: "24", xmlns: "http://www.w3.org/2000/svg", ...props },
+        react_1.default.createElement("path", { d: "m15.9393 3.23223-.3515.35154.3515-.35154c-.4688-.46884-1.1047-.73223-1.7677-.73223h-8.1716c-.82843 0-1.5.67157-1.5 1.5v16c0 .8284.67157 1.5 1.5 1.5h12c.8284 0 1.5-.6716 1.5-1.5v-12.17157c0-.66304-.2634-1.29893-.7322-1.76777z", fill: "#f6d2d1", stroke: "#e88483" }),
+        react_1.default.createElement("path", { d: "m14.5 3v3.5c0 .55228.4477 1 1 1h3.5", stroke: "#e88483" }),
+        react_1.default.createElement("rect", { fill: "#d72321", height: "9", rx: "2", width: "17", y: "11" }),
+        react_1.default.createElement("rect", { fill: "#d72321", height: "7", rx: "1", width: "13", x: "2", y: "12" }),
+        react_1.default.createElement("g", { stroke: "#fff", strokeLinecap: "round" },
+            react_1.default.createElement("path", { d: "m3.5 17.5v-2m0 0v-1.8c0-.1105.08954-.2.2-.2h1c.55228 0 1 .4477 1 1 0 .5523-.44772 1-1 1z" }),
+            react_1.default.createElement("path", { d: "m7.5 17.3v-3.6c0-.1105.08954-.2.2-.2h.3c.82843 0 1.5.6716 1.5 1.5v1c0 .8284-.67157 1.5-1.5 1.5h-.3c-.11046 0-.2-.0895-.2-.2z" }),
+            react_1.default.createElement("path", { d: "m11.5 17.5v-3.8c0-.1105.0895-.2.2-.2h1.8" }),
+            react_1.default.createElement("path", { d: "m11.5 15.5h1" })),
+        !isDecorative && react_1.default.createElement("title", null, "pdf icon")));
+}
+exports.default = Pdf;

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

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

package/lib/Icons/MatrixResources/Powerpoint.js

@@ -0,0 +1,28 @@
+"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 Powerpoint icon
+ * @param {React.SVGProps<SVGSVGElement>} props - The props for the Powerpoint component
+ * @returns {JSX.Element} - The Powerpoint component
+ * @example
+ * <Powerpoint />
+ * @example
+ * <Powerpoint height={24} width={24} />
+ * @example
+ * <Powerpoint className="custom-class" />
+ */
+function Powerpoint({ isDecorative, ...props }) {
+    return (react_1.default.createElement("svg", { fill: "none", height: "24", viewBox: "0 0 24 24", width: "24", xmlns: "http://www.w3.org/2000/svg", ...props },
+        react_1.default.createElement("path", { d: "m15.9393 3.23223-.3515.35154.3515-.35154c-.4688-.46884-1.1047-.73223-1.7677-.73223h-8.1716c-.82843 0-1.5.67157-1.5 1.5v16c0 .8284.67157 1.5 1.5 1.5h12c.8284 0 1.5-.6716 1.5-1.5v-12.17157c0-.66304-.2634-1.29893-.7322-1.76777z", fill: "#e7e7e7", stroke: "#bcbcbc" }),
+        react_1.default.createElement("path", { d: "m14.5 3v3.5c0 .55228.4477 1 1 1h3.5", stroke: "#bcbcbc" }),
+        react_1.default.createElement("rect", { fill: "#e96900", height: "12", rx: "2", width: "12", y: "8" }),
+        react_1.default.createElement("g", { stroke: "#fff", strokeLinecap: "round" },
+            react_1.default.createElement("path", { d: "m3.5 11.5v5" }),
+            react_1.default.createElement("path", { d: "m3.5 11.5h3.5c.33333 0 1.5 0 1.5 1.5s-1.16667 1.5-1.5 1.5h-3" })),
+        !isDecorative && react_1.default.createElement("title", null, "powerpoint icon")));
+}
+exports.default = Powerpoint;

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

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

package/lib/Icons/MatrixResources/Site.js

@@ -0,0 +1,30 @@
+"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 Site icon
+ * @param {React.SVGProps<SVGSVGElement>} props - The props for the Site component
+ * @returns {JSX.Element} - The Site component
+ * @example
+ * <Site />
+ * @example
+ * <Site height={24} width={24} />
+ * @example
+ * <Site className="custom-class" />
+ */
+function Site({ isDecorative, ...props }) {
+    return (react_1.default.createElement("svg", { fill: "none", height: "24", viewBox: "0 0 24 24", width: "24", xmlns: "http://www.w3.org/2000/svg", ...props },
+        react_1.default.createElement("circle", { cx: "12", cy: "12", fill: "#cce2f5", r: "10.5", stroke: "#7db4e3" }),
+        react_1.default.createElement("path", { d: "m19.5 12c0 2.9434-.8684 5.5878-2.2475 7.4841-1.3795 1.8968-3.2427 3.0159-5.2525 3.0159-2.00976 0-3.87299-1.1191-5.25249-3.0159-1.37913-1.8963-2.24751-4.5407-2.24751-7.4841 0-2.94337.86838-5.58777 2.24751-7.48409 1.3795-1.8968 3.24273-3.01591 5.25249-3.01591 2.0098 0 3.873 1.11911 5.2525 3.01591 1.3791 1.89632 2.2475 4.54072 2.2475 7.48409z", fill: "#cce2f5", stroke: "#7db4e3" }),
+        react_1.default.createElement("path", { d: "m14.5 12c0 3.0063-.3329 5.7099-.8611 7.6466-.265.9719-.5718 1.7223-.8914 2.218-.334.5181-.5981.6354-.7475.6354s-.4135-.1173-.7475-.6354c-.3196-.4957-.6264-1.2461-.8914-2.218-.52822-1.9367-.8611-4.6403-.8611-7.6466 0-3.00626.33288-5.70993.8611-7.64662.265-.97192.5718-1.72231.8914-2.21799.334-.51806.5981-.63539.7475-.63539s.4135.11733.7475.63539c.3196.49568.6264 1.24607.8914 2.21799.5282 1.93669.8611 4.64036.8611 7.64662z", fill: "#cce2f5", stroke: "#7db4e3" }),
+        react_1.default.createElement("g", { fill: "#7db4e3" },
+            react_1.default.createElement("path", { d: "m2 14h20v1h-20z" }),
+            react_1.default.createElement("path", { d: "m2 9h20v1h-20z" }),
+            react_1.default.createElement("path", { d: "m5 4 2.5-1-.5 1h10l-.5-1 2.5 1 .5 1h-15z" }),
+            react_1.default.createElement("path", { d: "m4 19h16l-.5 1-3 1 .5-1h-10l.5 1-3-1z" })),
+        !isDecorative && react_1.default.createElement("title", null, "site icon")));
+}
+exports.default = Site;

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

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

package/lib/Icons/MatrixResources/Video.js

@@ -0,0 +1,24 @@
+"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 Video icon
+ * @param {React.SVGProps<SVGSVGElement>} props - The props for the Video component
+ * @returns {JSX.Element} - The Video component
+ * @example
+ * <Video />
+ * @example
+ * <Video height={24} width={24} />
+ * @example
+ * <Video className="custom-class" />
+ */
+function Video({ isDecorative, ...props }) {
+    return (react_1.default.createElement("svg", { fill: "none", height: "24", viewBox: "0 0 24 24", width: "24", xmlns: "http://www.w3.org/2000/svg", ...props },
+        react_1.default.createElement("rect", { fill: "#e0d9ef", height: "15", rx: "1.5", stroke: "#ac98d5", width: "21", x: "1.5", y: "4.5" }),
+        react_1.default.createElement("path", { d: "m9.5 15.2516v-6.50318c0-.38671.42019-.62704.7535-.43097l5.5277 3.25155c.3287.1934.3287.6686 0 .862l-5.5277 3.2516c-.33331.196-.7535-.0443-.7535-.431z", fill: "#ac98d5", stroke: "#6b47b4", strokeLinecap: "round" }),
+        !isDecorative && react_1.default.createElement("title", null, "video icon")));
+}
+exports.default = Video;

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

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

package/lib/Icons/MatrixResources/Word.js

@@ -0,0 +1,28 @@
+"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 Word icon
+ * @param {React.SVGProps<SVGSVGElement>} props - The props for the Word component
+ * @returns {JSX.Element} - The Word component
+ * @example
+ * <Word />
+ * @example
+ * <Word isDecorative={false} />
+ * @example
+ * <Word height={24} width={24} />
+ * @example
+ * <Word className="custom-class" />
+ */
+function Word({ isDecorative, ...props }) {
+    return (react_1.default.createElement("svg", { fill: "none", height: "24", viewBox: "0 0 24 24", width: "24", xmlns: "http://www.w3.org/2000/svg", ...props },
+        react_1.default.createElement("path", { d: "m15.9393 3.23223-.3515.35154.3515-.35154c-.4688-.46884-1.1047-.73223-1.7677-.73223h-8.1716c-.82843 0-1.5.67157-1.5 1.5v16c0 .8284.67157 1.5 1.5 1.5h12c.8284 0 1.5-.6716 1.5-1.5v-12.17157c0-.66304-.2634-1.29893-.7322-1.76777z", fill: "#e7e7e7", stroke: "#bcbcbc" }),
+        react_1.default.createElement("path", { d: "m14.5 3v3.5c0 .55228.4477 1 1 1h3.5", stroke: "#bcbcbc" }),
+        react_1.default.createElement("rect", { fill: "#0774d2", height: "12", rx: "2", width: "12", y: "8" }),
+        react_1.default.createElement("path", { d: "m2.5 11.5 1.5 5 2-5 2 5 1.5-5", stroke: "#fff", strokeLinecap: "round", strokeLinejoin: "round" }),
+        !isDecorative && react_1.default.createElement("title", null, "word icon")));
+}
+exports.default = Word;

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

@@ -0,0 +1,11 @@
+export { default as Audio } from './Audio';
+export { default as Excel } from './Excel';
+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 Pdf } from './Pdf';
+export { default as Powerpoint } from './Powerpoint';
+export { default as Site } from './Site';
+export { default as Video } from './Video';
+export { default as Word } from './Word';

package/lib/Icons/MatrixResources/index.js

@@ -0,0 +1,29 @@
+"use strict";
+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;
+// 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; } });
+var Excel_1 = require("./Excel");
+Object.defineProperty(exports, "Excel", { enumerable: true, get: function () { return __importDefault(Excel_1).default; } });
+var Folder_1 = require("./Folder");
+Object.defineProperty(exports, "Folder", { enumerable: true, get: function () { return __importDefault(Folder_1).default; } });
+var GenericFile_1 = require("./GenericFile");
+Object.defineProperty(exports, "GenericFile", { enumerable: true, get: function () { return __importDefault(GenericFile_1).default; } });
+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 Pdf_1 = require("./Pdf");
+Object.defineProperty(exports, "Pdf", { enumerable: true, get: function () { return __importDefault(Pdf_1).default; } });
+var Powerpoint_1 = require("./Powerpoint");
+Object.defineProperty(exports, "Powerpoint", { enumerable: true, get: function () { return __importDefault(Powerpoint_1).default; } });
+var Site_1 = require("./Site");
+Object.defineProperty(exports, "Site", { enumerable: true, get: function () { return __importDefault(Site_1).default; } });
+var Video_1 = require("./Video");
+Object.defineProperty(exports, "Video", { enumerable: true, get: function () { return __importDefault(Video_1).default; } });
+var Word_1 = require("./Word");
+Object.defineProperty(exports, "Word", { enumerable: true, get: function () { return __importDefault(Word_1).default; } });

package/lib/Modal/Modal.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { OverlayTriggerState } from 'react-stately';
+import { DOMAttributes, FocusableElement } from '@react-types/shared';
+export type ModalProps = {
+    isDismissable?: boolean;
+    state: OverlayTriggerState;
+    overlayProps: DOMAttributes<FocusableElement>;
+    children: (titleProps: DOMAttributes<FocusableElement>) => React.ReactElement;
+};
+declare function Modal({ isDismissable, state, overlayProps, children, ...props }: ModalProps): JSX.Element;
+export default Modal;

package/lib/Modal/Modal.js

@@ -0,0 +1,46 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importStar(require("react"));
+const react_aria_1 = require("react-aria");
+/*
+  This has to be a separate element otherwise the focus trap fails. Assuming this is because it needs
+  to fit inside the 'Overlay' as a form of context.
+*/
+function ModalContent({ children, ...props }) {
+    const ref = (0, react_1.useRef)(null);
+    const { dialogProps, titleProps } = (0, react_aria_1.useDialog)(props, ref);
+    return (react_1.default.createElement("div", { ...dialogProps, ref: ref, className: "z-50 relative bg-white rounded-lg h-screen lg:h-[calc(100vh-3.5rem)] w-screen max-w-screen-lg" }, children(titleProps)));
+}
+function Modal({ isDismissable, state, overlayProps, children, ...props }) {
+    const ref = (0, react_1.useRef)(null);
+    const { modalProps, underlayProps } = (0, react_aria_1.useModalOverlay)({ isDismissable, ...props }, state, ref);
+    return (react_1.default.createElement(react_aria_1.Overlay, null,
+        react_1.default.createElement("div", { className: "squiz-rb-scope" },
+            react_1.default.createElement("div", { ...underlayProps, className: "h-full z-[9999] fixed inset-0 before:z-40 before:fixed before:inset-0 before:bg-black before:bg-opacity-25" },
+                react_1.default.createElement("div", { ...modalProps, ref: ref, className: "h-full flex items-center justify-center" },
+                    react_1.default.createElement(ModalContent, { ...overlayProps }, (titleProps) => children(titleProps)))))));
+}
+exports.default = Modal;

package/lib/Modal/ModalOpeningButton.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { AriaButtonProps } from 'react-aria';
+interface ModalOpeningButtonProps extends AriaButtonProps<'button'> {
+    className?: string;
+    children?: React.ReactNode;
+    isDisabled?: boolean;
+    title?: string;
+}
+export default function ModalOpeningButton({ className, children, title, ...props }: ModalOpeningButtonProps): JSX.Element;
+export {};

package/lib/Modal/ModalOpeningButton.js

@@ -0,0 +1,13 @@
+"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"));
+const react_aria_1 = require("react-aria");
+function ModalOpeningButton({ className, children, title, ...props }) {
+    const ref = react_1.default.useRef(null);
+    const { buttonProps } = (0, react_aria_1.useButton)(props, ref);
+    return (react_1.default.createElement("button", { ...buttonProps, ref: ref, className: className, title: title }, children));
+}
+exports.default = ModalOpeningButton;

package/lib/Modal/ModalTrigger.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { DOMAttributes, FocusableElement } from '@react-types/shared';
+declare function ModalTrigger({ label, showLabel, icon, children, ...props }: {
+    label: string;
+    showLabel?: boolean;
+    icon?: React.ReactNode;
+    children: (onClose: () => void, titleProps: DOMAttributes<FocusableElement>) => React.ReactElement;
+}): JSX.Element;
+export default ModalTrigger;

package/lib/Modal/ModalTrigger.js

@@ -0,0 +1,24 @@
+"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"));
+const react_aria_1 = require("react-aria");
+const react_stately_1 = require("react-stately");
+const Modal_1 = __importDefault(require("./Modal"));
+const ModalOpeningButton_1 = __importDefault(require("./ModalOpeningButton"));
+function ModalTrigger({ label, showLabel, icon, children, ...props }) {
+    const state = (0, react_stately_1.useOverlayTriggerState)(props);
+    const { triggerProps, overlayProps } = (0, react_aria_1.useOverlayTrigger)({ type: 'dialog' }, state);
+    let ariaAttr = {};
+    if (!showLabel) {
+        ariaAttr = { ...ariaAttr, 'aria-label': label };
+    }
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(ModalOpeningButton_1.default, { type: "button", ...triggerProps, ...ariaAttr },
+            showLabel && label,
+            icon),
+        state.isOpen && (react_1.default.createElement(Modal_1.default, { isDismissable: true, state: state, overlayProps: overlayProps }, (titleProps) => children(state.close, titleProps)))));
+}
+exports.default = ModalTrigger;

package/lib/PreviewPanel/PreviewModal.d.ts

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