@finsemble/finsemble-ui 1.0.0-beta-1

package/react/components/common/helpers.js

@@ -0,0 +1,127 @@
+import React from "react";
+import { Provider } from "react-redux";
+import { createStore } from "../../store";
+export const uploadFunction = (fileObject) => new Promise((resolve) => {
+    resolve({
+        err: "",
+        path: fileObject.name,
+    });
+});
+export const initFSBL = (windowObject) => {
+    // Poor man's global that can take any appendage
+    const globalAsAny = global;
+    if (!windowObject) {
+        windowObject = globalAsAny.window = {};
+    }
+    else {
+        windowObject = window;
+        setTimeout(() => {
+            const event = window.document.createEvent("Event");
+            event === null || event === void 0 ? void 0 : event.initEvent("FSBLReady", true, true);
+            window.dispatchEvent(event);
+        });
+    }
+    globalAsAny.FSBL = windowObject.FSBL = {
+        addEventListener: (name, callback) => {
+            callback();
+        },
+        getFSBLInfo: () => new Promise((resolve) => {
+            resolve({
+                FSBLVersion: "1.0.0",
+            });
+        }),
+        Clients: {
+            TmpSmartDesktopClient: {
+                checkValidURL(url) {
+                    if (url.length === 0) {
+                        return true;
+                    }
+                    return /^https?:\/\/[^\s]+$/.test(url);
+                },
+                checkValidProjectName(name) {
+                    return /^[a-zA-Z0-9 \-_.]{1,}$/.test(name) && /[a-zA-Z0-9]{1,}/.test(name);
+                },
+            },
+            ConfigClient: {
+                setPreference: () => { },
+                getValues: () => { },
+                getPreferences: () => { },
+            },
+            DialogManager: {
+                spawnDialog: (obj1) => {
+                    console.table(obj1);
+                },
+                registerDialogCallback: () => { },
+                respondToOpener: () => { },
+            },
+            LauncherClient: {
+                showWindow: () => { },
+            },
+            Logger: {
+                log: () => { },
+                error: () => { },
+                system: {
+                    debug: () => { },
+                    log: () => { },
+                    error: () => { },
+                    verbose: () => { },
+                    deprecated: () => { },
+                },
+            },
+            RouterClient: {
+                transmit: () => { },
+                addListener: () => { },
+                subscribe: () => { },
+            },
+            SearchClient: {
+                invokeItemAction: () => { },
+            },
+            StorageClient: {
+                save: () => { },
+                clearCache: () => { },
+            },
+            WindowClient: {
+                fitToDOM: () => { },
+            },
+            WorkspaceClient: {
+                addEventListener: () => { },
+                bringWindowsToFront: () => { },
+                autoArrange: () => { },
+                minimizeAll: () => { },
+                activeWorkspace: {
+                    name: " ",
+                },
+                getWorkspaceDefinition: (obj, cb) => {
+                    cb(null, null);
+                },
+            },
+        },
+        onShutdown: () => { },
+        System: {
+            getSDServerInfo: () => new Promise((resolve) => {
+                resolve({});
+            }),
+        },
+        SystemManagerClient: {
+            publishCheckpointState: () => { },
+        },
+    };
+    globalAsAny.FSBL.Clients = Object.assign(Object.assign({}, globalAsAny.FSBL.Clients), { WindowClient: {
+            fitToDOM: () => { },
+        } });
+    globalAsAny.finsembleWindow = windowObject.finsembleWindow = {
+        setAlwaysOnTop: () => { },
+        addEventListener: () => { },
+        removeEventListener: () => { },
+    };
+};
+export function createStory(Component, args) {
+    const template = (props) => {
+        initFSBL(window);
+        return (React.createElement(Provider, { store: createStore() },
+            React.createElement(Component, Object.assign({}, Object.assign(Object.assign({}, args), props)))));
+    };
+    template.args = args;
+    return template;
+}
+//# sourceMappingURL=helpers.js.map

package/react/components/common/helpers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.js","sourceRoot":"","sources":["../../../src/components/common/helpers.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from \"react\";\nimport { FileInputUploadCb } from \"./FileInput\";\nimport { Story } from \"@storybook/react/types-6-0\";\n\nimport { SDServerInfo } from \"../../types/smartDesktopDesignerTypes\";\nimport { Provider } from \"react-redux\";\nimport { createStore } from \"../../store\";\n\nexport const uploadFunction: FileInputUploadCb = (fileObject: File) =>\n\tnew Promise((resolve) => {\n\t\tresolve({\n\t\t\terr: \"\",\n\t\t\tpath: fileObject.name,\n\t\t});\n\t});\n\nexport const initFSBL = (windowObject?: any) => {\n\t// Poor man's global that can take any appendage\n\tconst globalAsAny: any = global;\n\n\tif (!windowObject) {\n\t\twindowObject = globalAsAny.window = {} as any;\n\t} else {\n\t\twindowObject = window;\n\n\t\tsetTimeout(() => {\n\t\t\tconst event = window.document.createEvent(\"Event\");\n\n\t\t\tevent?.initEvent(\"FSBLReady\", true, true);\n\n\t\t\twindow.dispatchEvent(event);\n\t\t});\n\t}\n\n\tglobalAsAny.FSBL = windowObject.FSBL = {\n\t\taddEventListener: (name: String, callback: () => void) => {\n\t\t\tcallback();\n\t\t},\n\t\tgetFSBLInfo: () =>\n\t\t\tnew Promise((resolve) => {\n\t\t\t\tresolve({\n\t\t\t\t\tFSBLVersion: \"1.0.0\",\n\t\t\t\t});\n\t\t\t}),\n\t\tClients: {\n\t\t\tTmpSmartDesktopClient: {\n\t\t\t\tcheckValidURL(url: string) {\n\t\t\t\t\tif (url.length === 0) {\n\t\t\t\t\t\treturn true;\n\t\t\t\t\t}\n\t\t\t\t\treturn /^https?:\\/\\/[^\\s]+$/.test(url);\n\t\t\t\t},\n\t\t\t\tcheckValidProjectName(name: string) {\n\t\t\t\t\treturn /^[a-zA-Z0-9 \\-_.]{1,}$/.test(name) && /[a-zA-Z0-9]{1,}/.test(name);\n\t\t\t\t},\n\t\t\t} as unknown,\n\t\t\tConfigClient: {\n\t\t\t\tsetPreference: () => {},\n\t\t\t\tgetValues: () => {},\n\t\t\t\tgetPreferences: () => {},\n\t\t\t},\n\t\t\tDialogManager: {\n\t\t\t\tspawnDialog: (obj1: any) => {\n\t\t\t\t\tconsole.table(obj1);\n\t\t\t\t},\n\t\t\t\tregisterDialogCallback: () => {},\n\t\t\t\trespondToOpener: () => {},\n\t\t\t},\n\t\t\tLauncherClient: {\n\t\t\t\tshowWindow: () => {},\n\t\t\t},\n\t\t\tLogger: {\n\t\t\t\tlog: () => {},\n\t\t\t\terror: () => {},\n\t\t\t\tsystem: {\n\t\t\t\t\tdebug: () => {},\n\t\t\t\t\tlog: () => {},\n\t\t\t\t\terror: () => {},\n\t\t\t\t\tverbose: () => {},\n\t\t\t\t\tdeprecated: () => {},\n\t\t\t\t},\n\t\t\t},\n\t\t\tRouterClient: {\n\t\t\t\ttransmit: () => {},\n\t\t\t\taddListener: () => {},\n\t\t\t\tsubscribe: () => {},\n\t\t\t},\n\t\t\tSearchClient: {\n\t\t\t\tinvokeItemAction: () => {},\n\t\t\t},\n\t\t\tStorageClient: {\n\t\t\t\tsave: () => {},\n\t\t\t\tclearCache: () => {},\n\t\t\t},\n\t\t\tWindowClient: {\n\t\t\t\tfitToDOM: () => {},\n\t\t\t},\n\t\t\tWorkspaceClient: {\n\t\t\t\taddEventListener: () => {},\n\t\t\t\tbringWindowsToFront: () => {},\n\t\t\t\tautoArrange: () => {},\n\t\t\t\tminimizeAll: () => {},\n\t\t\t\tactiveWorkspace: {\n\t\t\t\t\tname: \" \",\n\t\t\t\t},\n\t\t\t\tgetWorkspaceDefinition: (obj: Object, cb: Function) => {\n\t\t\t\t\tcb(null, null);\n\t\t\t\t},\n\t\t\t},\n\t\t},\n\t\tonShutdown: () => {},\n\t\tSystem: {\n\t\t\tgetSDServerInfo: () =>\n\t\t\t\tnew Promise((resolve) => {\n\t\t\t\t\tresolve({} as SDServerInfo);\n\t\t\t\t}),\n\t\t},\n\t\tSystemManagerClient: {\n\t\t\tpublishCheckpointState: () => {},\n\t\t},\n\t} as any;\n\n\tglobalAsAny.FSBL.Clients = {\n\t\t...globalAsAny.FSBL.Clients,\n\t\tWindowClient: {\n\t\t\tfitToDOM: () => {},\n\t\t} as any,\n\t};\n\n\tglobalAsAny.finsembleWindow = windowObject.finsembleWindow = {\n\t\tsetAlwaysOnTop: () => {},\n\t\taddEventListener: () => {},\n\t\tremoveEventListener: () => {},\n\t};\n};\n\nexport function createStory<T>(Component: Function, args: T) {\n\tconst template: Story<T> = (props: T) => {\n\t\tinitFSBL(window);\n\n\t\treturn (\n\t\t\t<Provider store={createStore()}>\n\t\t\t\t<Component {...{ ...args, ...props }} />\n\t\t\t</Provider>\n\t\t);\n\t};\n\n\ttemplate.args = args;\n\n\treturn template;\n}\n"]}

package/react/components/common/stories/Accordion.stories.d.ts

@@ -0,0 +1,14 @@
+import React from "react";
+import { AccordionProps } from "../Accordion";
+import { Story } from "@storybook/react/types-6-0";
+import "../../../assets/css/finsemble.css";
+declare const _default: {
+    title: string;
+    component: React.FunctionComponent<AccordionProps>;
+};
+export default _default;
+export declare const BasicAccordion: Story<AccordionProps>;
+export declare const BasicAccordionWithSummary: Story<AccordionProps>;
+export declare const BasicAccordionMedium: Story<AccordionProps>;
+export declare const BasicAccordionOpen: Story<AccordionProps>;
+export declare const NestedAccordion: Story<AccordionProps>;

package/react/components/common/stories/Accordion.stories.js

@@ -0,0 +1,42 @@
+import React from "react";
+import { Accordion } from "../Accordion";
+import "../../../assets/css/finsemble.css";
+export default {
+    title: "common/Accordion",
+    component: Accordion,
+};
+const BasicTemplate = (args) => (React.createElement(Accordion, Object.assign({}, args), "Accordion Content"));
+const NestedTemplate = (args) => (React.createElement(Accordion, Object.assign({}, args),
+    React.createElement(Accordion, { id: "accordion-2", label: "Nested Accordion", summary: "Summary 1" }, "Nested Accordion Content"),
+    React.createElement(Accordion, { id: "accordion-3", label: "Nested Accordion 2" }, "Nested Accordion 2 Content")));
+export const BasicAccordion = BasicTemplate.bind({});
+BasicAccordion.args = {
+    id: "accordion-1",
+    label: "Accordion Label",
+};
+export const BasicAccordionWithSummary = BasicTemplate.bind({});
+BasicAccordionWithSummary.args = {
+    id: "accordion-1",
+    label: "Accordion Label",
+    summary: "A summary of what the accordion contains",
+};
+export const BasicAccordionMedium = BasicTemplate.bind({});
+BasicAccordionMedium.args = {
+    id: "accordion-1",
+    label: "Accordion Label",
+    size: "medium",
+};
+export const BasicAccordionOpen = BasicTemplate.bind({});
+BasicAccordionOpen.args = {
+    id: "accordion-1",
+    label: "Accordion Label",
+    startOpen: true,
+};
+export const NestedAccordion = NestedTemplate.bind({});
+NestedAccordion.args = {
+    id: "accordion-1",
+    label: "Accordion Label",
+    summary: "Accordion Summary",
+    size: "medium",
+};
+//# sourceMappingURL=Accordion.stories.js.map

package/react/components/common/stories/Accordion.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Accordion.stories.js","sourceRoot":"","sources":["../../../../src/components/common/stories/Accordion.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAkB,MAAM,cAAc,CAAC;AAGzD,OAAO,mCAAmC,CAAC;AAE3C,eAAe;IACd,KAAK,EAAE,kBAAkB;IACzB,SAAS,EAAE,SAAS;CACpB,CAAC;AAEF,MAAM,aAAa,GAA0B,CAAC,IAAoB,EAAE,EAAE,CAAC,CACtE,oBAAC,SAAS,oBAAK,IAAI,uBAA+B,CAClD,CAAC;AAEF,MAAM,cAAc,GAA0B,CAAC,IAAoB,EAAE,EAAE,CAAC,CACvE,oBAAC,SAAS,oBAAK,IAAI;IAClB,oBAAC,SAAS,IAAC,EAAE,EAAC,aAAa,EAAC,KAAK,EAAC,kBAAkB,EAAC,OAAO,EAAC,WAAW,+BAE5D;IACZ,oBAAC,SAAS,IAAC,EAAE,EAAC,aAAa,EAAC,KAAK,EAAC,oBAAoB,iCAE1C,CACD,CACZ,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACrD,cAAc,CAAC,IAAI,GAAG;IACrB,EAAE,EAAE,aAAa;IACjB,KAAK,EAAE,iBAAiB;CACxB,CAAC;AAEF,MAAM,CAAC,MAAM,yBAAyB,GAAG,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAChE,yBAAyB,CAAC,IAAI,GAAG;IAChC,EAAE,EAAE,aAAa;IACjB,KAAK,EAAE,iBAAiB;IACxB,OAAO,EAAE,0CAA0C;CACnD,CAAC;AAEF,MAAM,CAAC,MAAM,oBAAoB,GAAG,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC3D,oBAAoB,CAAC,IAAI,GAAG;IAC3B,EAAE,EAAE,aAAa;IACjB,KAAK,EAAE,iBAAiB;IACxB,IAAI,EAAE,QAAQ;CACd,CAAC;AAEF,MAAM,CAAC,MAAM,kBAAkB,GAAG,aAAa,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzD,kBAAkB,CAAC,IAAI,GAAG;IACzB,EAAE,EAAE,aAAa;IACjB,KAAK,EAAE,iBAAiB;IACxB,SAAS,EAAE,IAAI;CACf,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG,cAAc,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACvD,eAAe,CAAC,IAAI,GAAG;IACtB,EAAE,EAAE,aAAa;IACjB,KAAK,EAAE,iBAAiB;IACxB,OAAO,EAAE,mBAAmB;IAC5B,IAAI,EAAE,QAAQ;CACd,CAAC","sourcesContent":["import React from \"react\";\nimport { Accordion, AccordionProps } from \"../Accordion\";\nimport { Story } from \"@storybook/react/types-6-0\";\nimport { action } from \"@storybook/addon-actions\";\nimport \"../../../assets/css/finsemble.css\";\n\nexport default {\n\ttitle: \"common/Accordion\",\n\tcomponent: Accordion,\n};\n\nconst BasicTemplate: Story<AccordionProps> = (args: AccordionProps) => (\n\t<Accordion {...args}>Accordion Content</Accordion>\n);\n\nconst NestedTemplate: Story<AccordionProps> = (args: AccordionProps) => (\n\t<Accordion {...args}>\n\t\t<Accordion id=\"accordion-2\" label=\"Nested Accordion\" summary=\"Summary 1\">\n\t\t\tNested Accordion Content\n\t\t</Accordion>\n\t\t<Accordion id=\"accordion-3\" label=\"Nested Accordion 2\">\n\t\t\tNested Accordion 2 Content\n\t\t</Accordion>\n\t</Accordion>\n);\n\nexport const BasicAccordion = BasicTemplate.bind({});\nBasicAccordion.args = {\n\tid: \"accordion-1\",\n\tlabel: \"Accordion Label\",\n};\n\nexport const BasicAccordionWithSummary = BasicTemplate.bind({});\nBasicAccordionWithSummary.args = {\n\tid: \"accordion-1\",\n\tlabel: \"Accordion Label\",\n\tsummary: \"A summary of what the accordion contains\",\n};\n\nexport const BasicAccordionMedium = BasicTemplate.bind({});\nBasicAccordionMedium.args = {\n\tid: \"accordion-1\",\n\tlabel: \"Accordion Label\",\n\tsize: \"medium\",\n};\n\nexport const BasicAccordionOpen = BasicTemplate.bind({});\nBasicAccordionOpen.args = {\n\tid: \"accordion-1\",\n\tlabel: \"Accordion Label\",\n\tstartOpen: true,\n};\n\nexport const NestedAccordion = NestedTemplate.bind({});\nNestedAccordion.args = {\n\tid: \"accordion-1\",\n\tlabel: \"Accordion Label\",\n\tsummary: \"Accordion Summary\",\n\tsize: \"medium\",\n};\n"]}

package/react/components/common/stories/Button.stories.d.ts

@@ -0,0 +1,22 @@
+import React from "react";
+import { ButtonProps } from "../Button";
+import "../../../assets/css/finsemble.css";
+import "../css/styles.css";
+import { Story } from "@storybook/react/types-6-0";
+declare const _default: {
+    title: string;
+    component: React.FC<ButtonProps>;
+};
+export default _default;
+export declare const PrimaryButton: Story<ButtonProps>;
+export declare const PrimaryButtonDisabled: Story<ButtonProps>;
+export declare const PrimaryButtonBack: Story<ButtonProps>;
+export declare const PrimaryButtonForward: Story<ButtonProps>;
+export declare const PrimaryButtonThemeLight: Story<ButtonProps>;
+export declare const PrimaryButtonThemeDark: Story<ButtonProps>;
+export declare const PrimaryButtonAdd: Story<ButtonProps>;
+export declare const SecondaryButton: Story<ButtonProps>;
+export declare const SecondaryButtonDisabled: Story<ButtonProps>;
+export declare const SecondaryButtonNegative: Story<ButtonProps>;
+export declare const GhostButton: Story<ButtonProps>;
+export declare const GhostButtonNegative: Story<ButtonProps>;

package/react/components/common/stories/Button.stories.js

@@ -0,0 +1,77 @@
+import React from "react";
+import { Button } from "../Button";
+import "../../../assets/css/finsemble.css";
+import "../css/styles.css";
+export default {
+    title: "Common/Button/Text",
+    component: Button,
+};
+const Template = (args) => React.createElement(Button, Object.assign({}, args));
+export const PrimaryButton = Template.bind({});
+PrimaryButton.args = {
+    fashion: "primary",
+    text: "Jagged",
+};
+export const PrimaryButtonDisabled = Template.bind({});
+PrimaryButtonDisabled.args = {
+    disabled: true,
+    fashion: "primary",
+    text: "Jagged",
+};
+export const PrimaryButtonBack = Template.bind({});
+PrimaryButtonBack.args = {
+    fashion: "primary",
+    iconBefore: "chevron-left",
+    text: "Back",
+};
+export const PrimaryButtonForward = Template.bind({});
+PrimaryButtonForward.args = {
+    fashion: "primary",
+    iconAfter: "chevron-right",
+    text: "Forward",
+};
+export const PrimaryButtonThemeLight = Template.bind({});
+PrimaryButtonThemeLight.args = {
+    fashion: "primary",
+    iconBefore: "sun",
+    text: "Light theme",
+};
+export const PrimaryButtonThemeDark = Template.bind({});
+PrimaryButtonThemeDark.args = {
+    fashion: "primary",
+    iconBefore: "moon",
+    text: "Dark theme",
+};
+export const PrimaryButtonAdd = Template.bind({});
+PrimaryButtonAdd.args = {
+    fashion: "primary",
+    iconBefore: "plus",
+    text: "Add",
+};
+export const SecondaryButton = Template.bind({});
+SecondaryButton.args = {
+    fashion: "secondary",
+    text: "Next",
+};
+export const SecondaryButtonDisabled = Template.bind({});
+SecondaryButtonDisabled.args = {
+    fashion: "secondary",
+    text: "Next",
+    disabled: true,
+};
+export const SecondaryButtonNegative = Template.bind({});
+SecondaryButtonNegative.args = {
+    fashion: "danger",
+    text: "Remove app",
+};
+export const GhostButton = Template.bind({});
+GhostButton.args = {
+    fashion: "ghost",
+    text: "Cancel",
+};
+export const GhostButtonNegative = Template.bind({});
+GhostButtonNegative.args = {
+    fashion: "danger ghost",
+    text: "Reset project",
+};
+//# sourceMappingURL=Button.stories.js.map

package/react/components/common/stories/Button.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.stories.js","sourceRoot":"","sources":["../../../../src/components/common/stories/Button.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from \"react\";\nimport { Button, ButtonProps } from \"../Button\";\nimport \"../../../assets/css/finsemble.css\";\nimport \"../css/styles.css\";\nimport { Story } from \"@storybook/react/types-6-0\";\n\nexport default {\n\ttitle: \"Common/Button/Text\",\n\tcomponent: Button,\n};\n\nconst Template: Story<ButtonProps> = (args: ButtonProps) => <Button {...args} />;\n\nexport const PrimaryButton = Template.bind({});\nPrimaryButton.args = {\n\tfashion: \"primary\",\n\ttext: \"Jagged\",\n};\nexport const PrimaryButtonDisabled = Template.bind({});\nPrimaryButtonDisabled.args = {\n\tdisabled: true,\n\tfashion: \"primary\",\n\ttext: \"Jagged\",\n};\nexport const PrimaryButtonBack = Template.bind({});\nPrimaryButtonBack.args = {\n\tfashion: \"primary\",\n\ticonBefore: \"chevron-left\",\n\ttext: \"Back\",\n};\nexport const PrimaryButtonForward = Template.bind({});\nPrimaryButtonForward.args = {\n\tfashion: \"primary\",\n\ticonAfter: \"chevron-right\",\n\ttext: \"Forward\",\n};\nexport const PrimaryButtonThemeLight = Template.bind({});\nPrimaryButtonThemeLight.args = {\n\tfashion: \"primary\",\n\ticonBefore: \"sun\",\n\ttext: \"Light theme\",\n};\nexport const PrimaryButtonThemeDark = Template.bind({});\nPrimaryButtonThemeDark.args = {\n\tfashion: \"primary\",\n\ticonBefore: \"moon\",\n\ttext: \"Dark theme\",\n};\nexport const PrimaryButtonAdd = Template.bind({});\nPrimaryButtonAdd.args = {\n\tfashion: \"primary\",\n\ticonBefore: \"plus\",\n\ttext: \"Add\",\n};\n\nexport const SecondaryButton = Template.bind({});\nSecondaryButton.args = {\n\tfashion: \"secondary\",\n\ttext: \"Next\",\n};\nexport const SecondaryButtonDisabled = Template.bind({});\nSecondaryButtonDisabled.args = {\n\tfashion: \"secondary\",\n\ttext: \"Next\",\n\tdisabled: true,\n};\nexport const SecondaryButtonNegative = Template.bind({});\nSecondaryButtonNegative.args = {\n\tfashion: \"danger\",\n\ttext: \"Remove app\",\n};\nexport const GhostButton = Template.bind({});\nGhostButton.args = {\n\tfashion: \"ghost\",\n\ttext: \"Cancel\",\n};\nexport const GhostButtonNegative = Template.bind({});\nGhostButtonNegative.args = {\n\tfashion: \"danger ghost\",\n\ttext: \"Reset project\",\n};\n"]}

package/react/components/common/stories/ButtonIcon.stories.d.ts

@@ -0,0 +1,15 @@
+import React from "react";
+import "../../../assets/css/finsemble.css";
+import "../css/styles.css";
+import { Story } from "@storybook/react/types-6-0";
+import { AdvancedButtonProps } from "../Button";
+declare const _default: {
+    title: string;
+    component: React.FC<AdvancedButtonProps>;
+};
+export default _default;
+export declare const DeleteIcon: Story<AdvancedButtonProps>;
+export declare const CopyIcon: Story<AdvancedButtonProps>;
+export declare const HelpIcon: Story<AdvancedButtonProps>;
+export declare const ConfirmIcon: Story<AdvancedButtonProps>;
+export declare const CancelIcon: Story<AdvancedButtonProps>;

package/react/components/common/stories/ButtonIcon.stories.js

@@ -0,0 +1,35 @@
+import React from "react";
+import { ButtonIcon } from "../ButtonIcon";
+import "../../../assets/css/finsemble.css";
+import "../css/styles.css";
+export default {
+    title: "Common/Button/Icon",
+    component: ButtonIcon,
+};
+const Template = (args) => React.createElement(ButtonIcon, Object.assign({}, args));
+export const DeleteIcon = Template.bind({});
+DeleteIcon.args = {
+    text: "Delete",
+    icon: "trash",
+};
+export const CopyIcon = Template.bind({});
+CopyIcon.args = {
+    text: "Copy",
+    icon: "copy",
+};
+export const HelpIcon = Template.bind({});
+HelpIcon.args = {
+    text: "Help",
+    icon: "life-ring",
+};
+export const ConfirmIcon = Template.bind({});
+ConfirmIcon.args = {
+    text: "Confirm",
+    icon: "check",
+};
+export const CancelIcon = Template.bind({});
+CancelIcon.args = {
+    text: "Cancel",
+    icon: "times",
+};
+//# sourceMappingURL=ButtonIcon.stories.js.map

package/react/components/common/stories/ButtonIcon.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonIcon.stories.js","sourceRoot":"","sources":["../../../../src/components/common/stories/ButtonIcon.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,mCAAmC,CAAC;AAC3C,OAAO,mBAAmB,CAAC;AAI3B,eAAe;IACd,KAAK,EAAE,oBAAoB;IAC3B,SAAS,EAAE,UAAU;CACrB,CAAC;AAEF,MAAM,QAAQ,GAA+B,CAAC,IAAyB,EAAE,EAAE,CAAC,oBAAC,UAAU,oBAAK,IAAI,EAAI,CAAC;AAErG,MAAM,CAAC,MAAM,UAAU,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC5C,UAAU,CAAC,IAAI,GAAG;IACjB,IAAI,EAAE,QAAQ;IACd,IAAI,EAAE,OAAO;CACb,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC1C,QAAQ,CAAC,IAAI,GAAG;IACf,IAAI,EAAE,MAAM;IACZ,IAAI,EAAE,MAAM;CACZ,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC1C,QAAQ,CAAC,IAAI,GAAG;IACf,IAAI,EAAE,MAAM;IACZ,IAAI,EAAE,WAAW;CACjB,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC7C,WAAW,CAAC,IAAI,GAAG;IAClB,IAAI,EAAE,SAAS;IACf,IAAI,EAAE,OAAO;CACb,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC5C,UAAU,CAAC,IAAI,GAAG;IACjB,IAAI,EAAE,QAAQ;IACd,IAAI,EAAE,OAAO;CACb,CAAC","sourcesContent":["import React from \"react\";\nimport { ButtonIcon } from \"../ButtonIcon\";\nimport \"../../../assets/css/finsemble.css\";\nimport \"../css/styles.css\";\nimport { Story } from \"@storybook/react/types-6-0\";\nimport { AdvancedButtonProps } from \"../Button\";\n\nexport default {\n\ttitle: \"Common/Button/Icon\",\n\tcomponent: ButtonIcon,\n};\n\nconst Template: Story<AdvancedButtonProps> = (args: AdvancedButtonProps) => <ButtonIcon {...args} />;\n\nexport const DeleteIcon = Template.bind({});\nDeleteIcon.args = {\n\ttext: \"Delete\",\n\ticon: \"trash\",\n};\n\nexport const CopyIcon = Template.bind({});\nCopyIcon.args = {\n\ttext: \"Copy\",\n\ticon: \"copy\",\n};\n\nexport const HelpIcon = Template.bind({});\nHelpIcon.args = {\n\ttext: \"Help\",\n\ticon: \"life-ring\",\n};\n\nexport const ConfirmIcon = Template.bind({});\nConfirmIcon.args = {\n\ttext: \"Confirm\",\n\ticon: \"check\",\n};\n\nexport const CancelIcon = Template.bind({});\nCancelIcon.args = {\n\ttext: \"Cancel\",\n\ticon: \"times\",\n};\n"]}

package/react/components/common/stories/ButtonRow.stories.d.ts

@@ -0,0 +1,14 @@
+import React from "react";
+import { ButtonRowProps } from "../ButtonRow";
+import "../../../assets/css/finsemble.css";
+import "../css/styles.css";
+import { Story } from "@storybook/react/types-6-0";
+declare const _default: {
+    title: string;
+    component: React.FC<ButtonRowProps>;
+    decorators: ((StoryDisplay: any) => JSX.Element)[];
+};
+export default _default;
+export declare const Default: Story<ButtonRowProps>;
+export declare const WithImage: Story<ButtonRowProps>;
+export declare const ImageError: Story<ButtonRowProps>;

package/react/components/common/stories/ButtonRow.stories.js

@@ -0,0 +1,39 @@
+import React from "react";
+import ButtonRow from "../ButtonRow";
+import "../../../assets/css/finsemble.css";
+import "../css/styles.css";
+export default {
+    title: "Common/Button/Row",
+    component: ButtonRow,
+    decorators: [
+        (StoryDisplay) => (React.createElement("div", { className: "row-section", style: { width: 300, height: 40 } },
+            React.createElement(StoryDisplay, null))),
+    ],
+};
+const Template = (args) => React.createElement(ButtonRow, Object.assign({}, args));
+export const Default = Template.bind({});
+Default.args = {
+    label: "Notification sources",
+    onClick: () => { },
+    iconClass: "ff-caret-up rotate-90",
+    disabled: false,
+};
+export const WithImage = Template.bind({});
+WithImage.args = {
+    label: "ChartIQ",
+    onClick: () => { },
+    iconClass: "ff-caret-up rotate-90",
+    disabled: false,
+    img: "https://documentation.chartiq.com/img/CIQ_logo_negative.png",
+    showDefaultIcon: false,
+};
+export const ImageError = Template.bind({});
+ImageError.args = {
+    label: "Finsemble",
+    onClick: () => { },
+    iconClass: "ff-caret-up rotate-90",
+    disabled: false,
+    img: "https://thiswillresultinanerrorbutdontworrythatswhatwewant",
+    showDefaultIcon: false,
+};
+//# sourceMappingURL=ButtonRow.stories.js.map

package/react/components/common/stories/ButtonRow.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonRow.stories.js","sourceRoot":"","sources":["../../../../src/components/common/stories/ButtonRow.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,SAA6B,MAAM,cAAc,CAAC;AACzD,OAAO,mCAAmC,CAAC;AAC3C,OAAO,mBAAmB,CAAC;AAG3B,eAAe;IACd,KAAK,EAAE,mBAAmB;IAC1B,SAAS,EAAE,SAAS;IACpB,UAAU,EAAE;QACX,CAAC,YAAiB,EAAE,EAAE,CAAC,CACtB,6BAAK,SAAS,EAAC,aAAa,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,EAAE,EAAE;YAC7D,oBAAC,YAAY,OAAG,CACX,CACN;KACD;CACD,CAAC;AAEF,MAAM,QAAQ,GAA0B,CAAC,IAAoB,EAAE,EAAE,CAAC,oBAAC,SAAS,oBAAK,IAAI,EAAI,CAAC;AAE1F,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzC,OAAO,CAAC,IAAI,GAAG;IACd,KAAK,EAAE,sBAAsB;IAC7B,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;IACjB,SAAS,EAAE,uBAAuB;IAClC,QAAQ,EAAE,KAAK;CACf,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC3C,SAAS,CAAC,IAAI,GAAG;IAChB,KAAK,EAAE,SAAS;IAChB,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;IACjB,SAAS,EAAE,uBAAuB;IAClC,QAAQ,EAAE,KAAK;IACf,GAAG,EAAE,6DAA6D;IAClE,eAAe,EAAE,KAAK;CACtB,CAAC;AACF,MAAM,CAAC,MAAM,UAAU,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC5C,UAAU,CAAC,IAAI,GAAG;IACjB,KAAK,EAAE,WAAW;IAClB,OAAO,EAAE,GAAG,EAAE,GAAE,CAAC;IACjB,SAAS,EAAE,uBAAuB;IAClC,QAAQ,EAAE,KAAK;IACf,GAAG,EAAE,4DAA4D;IACjE,eAAe,EAAE,KAAK;CACtB,CAAC","sourcesContent":["import React from \"react\";\nimport ButtonRow, { ButtonRowProps } from \"../ButtonRow\";\nimport \"../../../assets/css/finsemble.css\";\nimport \"../css/styles.css\";\nimport { Story } from \"@storybook/react/types-6-0\";\n\nexport default {\n\ttitle: \"Common/Button/Row\",\n\tcomponent: ButtonRow,\n\tdecorators: [\n\t\t(StoryDisplay: any) => (\n\t\t\t<div className=\"row-section\" style={{ width: 300, height: 40 }}>\n\t\t\t\t<StoryDisplay />\n\t\t\t</div>\n\t\t),\n\t],\n};\n\nconst Template: Story<ButtonRowProps> = (args: ButtonRowProps) => <ButtonRow {...args} />;\n\nexport const Default = Template.bind({});\nDefault.args = {\n\tlabel: \"Notification sources\",\n\tonClick: () => {},\n\ticonClass: \"ff-caret-up rotate-90\",\n\tdisabled: false,\n};\n\nexport const WithImage = Template.bind({});\nWithImage.args = {\n\tlabel: \"ChartIQ\",\n\tonClick: () => {},\n\ticonClass: \"ff-caret-up rotate-90\",\n\tdisabled: false,\n\timg: \"https://documentation.chartiq.com/img/CIQ_logo_negative.png\",\n\tshowDefaultIcon: false,\n};\nexport const ImageError = Template.bind({});\nImageError.args = {\n\tlabel: \"Finsemble\",\n\tonClick: () => {},\n\ticonClass: \"ff-caret-up rotate-90\",\n\tdisabled: false,\n\timg: \"https://thiswillresultinanerrorbutdontworrythatswhatwewant\",\n\tshowDefaultIcon: false,\n};\n"]}

package/react/components/common/stories/ButtonTile.stories.d.ts

@@ -0,0 +1,17 @@
+import React from "react";
+import { AdvancedButtonProps } from "../Button";
+import "../../../assets/css/finsemble.css";
+import "../css/styles.css";
+import { Story } from "@storybook/react/types-6-0";
+declare const _default: {
+    title: string;
+    component: React.FC<AdvancedButtonProps>;
+};
+export default _default;
+export declare const AddApplications: Story<AdvancedButtonProps>;
+export declare const EditTheme: Story<AdvancedButtonProps>;
+export declare const PublishDesktop: Story<AdvancedButtonProps>;
+export declare const ApplicationWizard: Story<AdvancedButtonProps>;
+export declare const ManualSetup: Story<AdvancedButtonProps>;
+export declare const WebApplication: Story<AdvancedButtonProps>;
+export declare const NativeApplication: Story<AdvancedButtonProps>;

package/react/components/common/stories/ButtonTile.stories.js

@@ -0,0 +1,45 @@
+import React from "react";
+import { ButtonTile } from "../ButtonTile";
+import "../../../assets/css/finsemble.css";
+import "../css/styles.css";
+export default {
+    title: "Common/Button/Tile",
+    component: ButtonTile,
+};
+const Template = (args) => React.createElement(ButtonTile, Object.assign({}, args));
+export const AddApplications = Template.bind({});
+AddApplications.args = {
+    icon: "window",
+    text: "Add apps",
+};
+export const EditTheme = Template.bind({});
+EditTheme.args = {
+    icon: "paint-roller",
+    text: "Edit theme",
+};
+export const PublishDesktop = Template.bind({});
+PublishDesktop.args = {
+    icon: "upload",
+    text: "Publish desktop",
+};
+export const ApplicationWizard = Template.bind({});
+ApplicationWizard.args = {
+    icon: "magic",
+    text: "App wizard",
+};
+export const ManualSetup = Template.bind({});
+ManualSetup.args = {
+    icon: "tools",
+    text: "Manual setup (advanced)",
+};
+export const WebApplication = Template.bind({});
+WebApplication.args = {
+    icon: "globe",
+    text: "Web app",
+};
+export const NativeApplication = Template.bind({});
+NativeApplication.args = {
+    icon: "hdd",
+    text: "Native app",
+};
+//# sourceMappingURL=ButtonTile.stories.js.map

package/react/components/common/stories/ButtonTile.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonTile.stories.js","sourceRoot":"","sources":["../../../../src/components/common/stories/ButtonTile.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAE3C,OAAO,mCAAmC,CAAC;AAC3C,OAAO,mBAAmB,CAAC;AAG3B,eAAe;IACd,KAAK,EAAE,oBAAoB;IAC3B,SAAS,EAAE,UAAU;CACrB,CAAC;AAEF,MAAM,QAAQ,GAA+B,CAAC,IAAyB,EAAE,EAAE,CAAC,oBAAC,UAAU,oBAAK,IAAI,EAAI,CAAC;AAErG,MAAM,CAAC,MAAM,eAAe,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACjD,eAAe,CAAC,IAAI,GAAG;IACtB,IAAI,EAAE,QAAQ;IACd,IAAI,EAAE,UAAU;CAChB,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC3C,SAAS,CAAC,IAAI,GAAG;IAChB,IAAI,EAAE,cAAc;IACpB,IAAI,EAAE,YAAY;CAClB,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAChD,cAAc,CAAC,IAAI,GAAG;IACrB,IAAI,EAAE,QAAQ;IACd,IAAI,EAAE,iBAAiB;CACvB,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACnD,iBAAiB,CAAC,IAAI,GAAG;IACxB,IAAI,EAAE,OAAO;IACb,IAAI,EAAE,YAAY;CAClB,CAAC;AAEF,MAAM,CAAC,MAAM,WAAW,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC7C,WAAW,CAAC,IAAI,GAAG;IAClB,IAAI,EAAE,OAAO;IACb,IAAI,EAAE,yBAAyB;CAC/B,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAChD,cAAc,CAAC,IAAI,GAAG;IACrB,IAAI,EAAE,OAAO;IACb,IAAI,EAAE,SAAS;CACf,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACnD,iBAAiB,CAAC,IAAI,GAAG;IACxB,IAAI,EAAE,KAAK;IACX,IAAI,EAAE,YAAY;CAClB,CAAC","sourcesContent":["import React from \"react\";\nimport { ButtonTile } from \"../ButtonTile\";\nimport { AdvancedButtonProps } from \"../Button\";\nimport \"../../../assets/css/finsemble.css\";\nimport \"../css/styles.css\";\nimport { Story } from \"@storybook/react/types-6-0\";\n\nexport default {\n\ttitle: \"Common/Button/Tile\",\n\tcomponent: ButtonTile,\n};\n\nconst Template: Story<AdvancedButtonProps> = (args: AdvancedButtonProps) => <ButtonTile {...args} />;\n\nexport const AddApplications = Template.bind({});\nAddApplications.args = {\n\ticon: \"window\",\n\ttext: \"Add apps\",\n};\n\nexport const EditTheme = Template.bind({});\nEditTheme.args = {\n\ticon: \"paint-roller\",\n\ttext: \"Edit theme\",\n};\n\nexport const PublishDesktop = Template.bind({});\nPublishDesktop.args = {\n\ticon: \"upload\",\n\ttext: \"Publish desktop\",\n};\n\nexport const ApplicationWizard = Template.bind({});\nApplicationWizard.args = {\n\ticon: \"magic\",\n\ttext: \"App wizard\",\n};\n\nexport const ManualSetup = Template.bind({});\nManualSetup.args = {\n\ticon: \"tools\",\n\ttext: \"Manual setup (advanced)\",\n};\n\nexport const WebApplication = Template.bind({});\nWebApplication.args = {\n\ticon: \"globe\",\n\ttext: \"Web app\",\n};\n\nexport const NativeApplication = Template.bind({});\nNativeApplication.args = {\n\ticon: \"hdd\",\n\ttext: \"Native app\",\n};\n"]}

package/react/components/common/stories/Checkbox.stories.d.ts

@@ -0,0 +1,13 @@
+import React from "react";
+import { CheckboxProps } from "../Checkbox";
+import "../../../assets/css/finsemble.css";
+import "../css/styles.css";
+import { Story } from "@storybook/react/types-6-0";
+declare const _default: {
+    title: string;
+    component: React.FC<CheckboxProps>;
+};
+export default _default;
+export declare const Unchecked: Story<CheckboxProps>;
+export declare const Checked: Story<CheckboxProps>;
+export declare const Disabled: Story<CheckboxProps>;

package/react/components/common/stories/Checkbox.stories.js

@@ -0,0 +1,29 @@
+import React from "react";
+import { Checkbox } from "../Checkbox";
+import "../../../assets/css/finsemble.css";
+import "../css/styles.css";
+export default {
+    title: "Common/Checkbox",
+    component: Checkbox,
+};
+const Template = (args) => {
+    const [toggle, setToggle] = React.useState(args.checked);
+    return React.createElement(Checkbox, Object.assign({}, args, { onClick: () => setToggle((t) => !t), checked: toggle }));
+};
+export const Unchecked = Template.bind({});
+Unchecked.args = {
+    checked: false,
+    label: "Label",
+};
+export const Checked = Template.bind({});
+Checked.args = {
+    checked: true,
+    label: "Label",
+};
+export const Disabled = Template.bind({});
+Disabled.args = {
+    checked: false,
+    label: "Label",
+    disabled: true,
+};
+//# sourceMappingURL=Checkbox.stories.js.map

package/react/components/common/stories/Checkbox.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.stories.js","sourceRoot":"","sources":["../../../../src/components/common/stories/Checkbox.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAiB,MAAM,aAAa,CAAC;AACtD,OAAO,mCAAmC,CAAC;AAC3C,OAAO,mBAAmB,CAAC;AAG3B,eAAe;IACd,KAAK,EAAE,iBAAiB;IACxB,SAAS,EAAE,QAAQ;CACnB,CAAC;AAEF,MAAM,QAAQ,GAAyB,CAAC,IAAmB,EAAE,EAAE;IAC9D,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IAEzD,OAAO,oBAAC,QAAQ,oBAAK,IAAI,IAAE,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,OAAO,EAAE,MAAM,IAAI,CAAC;AACrF,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC3C,SAAS,CAAC,IAAI,GAAG;IAChB,OAAO,EAAE,KAAK;IACd,KAAK,EAAE,OAAO;CACd,CAAC;AACF,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzC,OAAO,CAAC,IAAI,GAAG;IACd,OAAO,EAAE,IAAI;IACb,KAAK,EAAE,OAAO;CACd,CAAC;AACF,MAAM,CAAC,MAAM,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC1C,QAAQ,CAAC,IAAI,GAAG;IACf,OAAO,EAAE,KAAK;IACd,KAAK,EAAE,OAAO;IACd,QAAQ,EAAE,IAAI;CACd,CAAC","sourcesContent":["import React from \"react\";\nimport { Checkbox, CheckboxProps } from \"../Checkbox\";\nimport \"../../../assets/css/finsemble.css\";\nimport \"../css/styles.css\";\nimport { Story } from \"@storybook/react/types-6-0\";\n\nexport default {\n\ttitle: \"Common/Checkbox\",\n\tcomponent: Checkbox,\n};\n\nconst Template: Story<CheckboxProps> = (args: CheckboxProps) => {\n\tconst [toggle, setToggle] = React.useState(args.checked);\n\n\treturn <Checkbox {...args} onClick={() => setToggle((t) => !t)} checked={toggle} />;\n};\n\nexport const Unchecked = Template.bind({});\nUnchecked.args = {\n\tchecked: false,\n\tlabel: \"Label\",\n};\nexport const Checked = Template.bind({});\nChecked.args = {\n\tchecked: true,\n\tlabel: \"Label\",\n};\nexport const Disabled = Template.bind({});\nDisabled.args = {\n\tchecked: false,\n\tlabel: \"Label\",\n\tdisabled: true,\n};\n"]}

package/react/components/common/stories/ColorPicker.stories.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import { ColorPickerProps } from "../ColorPicker";
+import "../../../assets/css/finsemble.css";
+import "../css/styles.css";
+import { Story } from "@storybook/react/types-6-0";
+declare const _default: {
+    title: string;
+    component: ({ id, startColor, updateColor }: ColorPickerProps) => JSX.Element;
+};
+export default _default;
+export declare const EmptyField: Story<ColorPickerProps>;
+export declare const ValidColor: Story<ColorPickerProps>;
+export declare const InvalidColor: Story<ColorPickerProps>;

package/react/components/common/stories/ColorPicker.stories.js

@@ -0,0 +1,29 @@
+import React, { useState } from "react";
+import { ColorPicker } from "../ColorPicker";
+import "../../../assets/css/finsemble.css";
+import "../css/styles.css";
+export default {
+    title: "Common/ColorPicker",
+    component: ColorPicker,
+};
+const Template = (args) => {
+    var _a;
+    // The colorpicker was changed to not update its internal state
+    // but only fire the event and instead rely on props, so for the purpose of unit testing
+    // and storybook, let's define a mock component that synchonizes them
+    const [startColor, setColor] = useState(args.startColor);
+    return React.createElement(ColorPicker, { id: args.id, startColor: startColor, updateColor: (_a = args.updateColor) !== null && _a !== void 0 ? _a : setColor });
+};
+export const EmptyField = Template.bind({});
+EmptyField.args = {
+    startColor: "",
+};
+export const ValidColor = Template.bind({});
+ValidColor.args = {
+    startColor: "#FF0000",
+};
+export const InvalidColor = Template.bind({});
+InvalidColor.args = {
+    startColor: "#ZZZZZZ",
+};
+//# sourceMappingURL=ColorPicker.stories.js.map

package/react/components/common/stories/ColorPicker.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorPicker.stories.js","sourceRoot":"","sources":["../../../../src/components/common/stories/ColorPicker.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,EAAE,WAAW,EAAoB,MAAM,gBAAgB,CAAC;AAC/D,OAAO,mCAAmC,CAAC;AAC3C,OAAO,mBAAmB,CAAC;AAG3B,eAAe;IACd,KAAK,EAAE,oBAAoB;IAC3B,SAAS,EAAE,WAAW;CACtB,CAAC;AAEF,MAAM,QAAQ,GAA4B,CAAC,IAAsB,EAAE,EAAE;;IACpE,+DAA+D;IAC/D,wFAAwF;IACxF,qEAAqE;IACrE,MAAM,CAAC,UAAU,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;IACzD,OAAO,oBAAC,WAAW,IAAC,EAAE,EAAE,IAAI,CAAC,EAAE,EAAE,UAAU,EAAE,UAAU,EAAE,WAAW,EAAE,MAAA,IAAI,CAAC,WAAW,mCAAI,QAAQ,GAAI,CAAC;AACxG,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC5C,UAAU,CAAC,IAAI,GAAG;IACjB,UAAU,EAAE,EAAE;CACd,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC5C,UAAU,CAAC,IAAI,GAAG;IACjB,UAAU,EAAE,SAAS;CACrB,CAAC;AAEF,MAAM,CAAC,MAAM,YAAY,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AAC9C,YAAY,CAAC,IAAI,GAAG;IACnB,UAAU,EAAE,SAAS;CACrB,CAAC","sourcesContent":["import React, { useState } from \"react\";\nimport { ColorPicker, ColorPickerProps } from \"../ColorPicker\";\nimport \"../../../assets/css/finsemble.css\";\nimport \"../css/styles.css\";\nimport { Story } from \"@storybook/react/types-6-0\";\n\nexport default {\n\ttitle: \"Common/ColorPicker\",\n\tcomponent: ColorPicker,\n};\n\nconst Template: Story<ColorPickerProps> = (args: ColorPickerProps) => {\n\t// The colorpicker was changed to not update its internal state\n\t// but only fire the event and instead rely on props, so for the purpose of unit testing\n\t// and storybook, let's define a mock component that synchonizes them\n\tconst [startColor, setColor] = useState(args.startColor);\n\treturn <ColorPicker id={args.id} startColor={startColor} updateColor={args.updateColor ?? setColor} />;\n};\n\nexport const EmptyField = Template.bind({});\nEmptyField.args = {\n\tstartColor: \"\",\n};\n\nexport const ValidColor = Template.bind({});\nValidColor.args = {\n\tstartColor: \"#FF0000\",\n};\n\nexport const InvalidColor = Template.bind({});\nInvalidColor.args = {\n\tstartColor: \"#ZZZZZZ\",\n};\n"]}

package/react/components/common/stories/DropZone.stories.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import { DropZoneProps } from "../DropZone";
+import "../../../assets/css/finsemble.css";
+import "../css/styles.css";
+import { Story } from "@storybook/react/types-6-0";
+declare const _default: {
+    title: string;
+    component: ({ processFile, children, suppress }: DropZoneProps) => JSX.Element;
+};
+export default _default;
+export declare const Default: Story<DropZoneProps>;