@finsemble/finsemble-ui 7.3.10 → 7.3.11

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/ContextMenu.stories.d.ts

@@ -0,0 +1,38 @@
+import React from "react";
+import { ContextMenuProps } from "../ContextMenu";
+import "../../../assets/css/finsemble.css";
+import "../css/styles.css";
+import { ContextMenuAction } from "../../notifications/types";
+declare const _default: {
+    title: string;
+    component: React.FunctionComponent<ContextMenuProps>;
+};
+export default _default;
+export declare const BasicContextMenuToggle: import("@storybook/react").Story<{
+    menuActions: {
+        [key: string]: ContextMenuAction;
+    };
+    message: null;
+    isMuteFilterApplied: boolean;
+}>;
+export declare const ContextMenuToggleBottom: import("@storybook/react").Story<{
+    menuActions: {
+        [key: string]: ContextMenuAction;
+    };
+    message: null;
+    isMuteFilterApplied: boolean;
+}>;
+export declare const ContextMenuToggleRight: import("@storybook/react").Story<{
+    menuActions: {
+        [key: string]: ContextMenuAction;
+    };
+    message: null;
+    isMuteFilterApplied: boolean;
+}>;
+export declare const ContextMenuToggleBottomRight: import("@storybook/react").Story<{
+    menuActions: {
+        [key: string]: ContextMenuAction;
+    };
+    message: null;
+    isMuteFilterApplied: boolean;
+}>;

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

@@ -0,0 +1,70 @@
+import React from "react";
+import ContextMenuToggle from "../ContextMenu";
+import { createStory } from "../helpers";
+import "../../../assets/css/finsemble.css";
+import "../css/styles.css";
+import SnoozeIcon from "../../notifications/icons/SnoozeIcon";
+import EnvelopeCloseIcon from "../../notifications/icons/EnvelopeClose";
+import EnvelopeOpenIcon from "../../notifications/icons/EnvelopeOpen";
+export default {
+    title: "Common/ContextMenu",
+    component: ContextMenuToggle,
+};
+const contextMenuActions = {
+    MARK_AS_UNREAD: {
+        name: "MARK_AS_UNREAD",
+        icon: React.createElement(EnvelopeCloseIcon, null),
+        label: "Mark Unread",
+        action: () => {
+            console.log("Marked as unread");
+        },
+        display: true,
+    },
+    MARK_AS_READ: {
+        name: "MARK_AS_READ",
+        icon: React.createElement(EnvelopeOpenIcon, null),
+        label: "Mark Read",
+        action: () => {
+            console.log("Marked as read");
+        },
+        display: true,
+    },
+    TEST: {
+        name: "TEST",
+        icon: React.createElement(SnoozeIcon, null),
+        label: "Test",
+        action: () => {
+            console.log("Hello World");
+        },
+        display: true,
+    },
+};
+const overFlowActions = Object.assign({}, contextMenuActions);
+export const BasicContextMenuToggle = createStory(ContextMenuToggle, {
+    menuActions: overFlowActions,
+    message: null,
+    isMuteFilterApplied: false,
+});
+BasicContextMenuToggle.decorators = [
+    (Story) => (React.createElement("div", { style: { position: "absolute", left: "1%" } },
+        React.createElement(Story, null))),
+];
+export const ContextMenuToggleBottom = BasicContextMenuToggle.bind({});
+ContextMenuToggleBottom.args = { menuActions: overFlowActions, message: null, isMuteFilterApplied: false };
+ContextMenuToggleBottom.decorators = [
+    (Story) => (React.createElement("div", { style: { position: "absolute", bottom: "10%" } },
+        React.createElement(Story, null))),
+];
+export const ContextMenuToggleRight = BasicContextMenuToggle.bind({});
+ContextMenuToggleRight.args = { menuActions: overFlowActions, message: null, isMuteFilterApplied: false };
+ContextMenuToggleRight.decorators = [
+    (Story) => (React.createElement("div", { style: { position: "absolute", right: "5%" } },
+        React.createElement(Story, null))),
+];
+export const ContextMenuToggleBottomRight = BasicContextMenuToggle.bind({});
+ContextMenuToggleBottomRight.args = { menuActions: overFlowActions, message: null, isMuteFilterApplied: false };
+ContextMenuToggleBottomRight.decorators = [
+    (Story) => (React.createElement("div", { style: { position: "absolute", right: "5%", bottom: "10%" } },
+        React.createElement(Story, null))),
+];
+//# sourceMappingURL=ContextMenu.stories.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ContextMenu.stories.js","sourceRoot":"","sources":["../../../../src/components/common/stories/ContextMenu.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from \"react\";\nimport ContextMenuToggle, { ContextMenuProps } from \"../ContextMenu\";\nimport { createStory } from \"../helpers\";\nimport \"../../../assets/css/finsemble.css\";\nimport \"../css/styles.css\";\nimport SnoozeIcon from \"../../notifications/icons/SnoozeIcon\";\nimport EnvelopeCloseIcon from \"../../notifications/icons/EnvelopeClose\";\nimport EnvelopeOpenIcon from \"../../notifications/icons/EnvelopeOpen\";\nimport { ContextMenuAction } from \"../../notifications/types\";\n\nexport default {\n\ttitle: \"Common/ContextMenu\",\n\tcomponent: ContextMenuToggle,\n};\nconst contextMenuActions: { [key: string]: ContextMenuAction } = {\n\tMARK_AS_UNREAD: {\n\t\tname: \"MARK_AS_UNREAD\",\n\t\ticon: <EnvelopeCloseIcon />,\n\t\tlabel: \"Mark Unread\",\n\t\taction: () => {\n\t\t\tconsole.log(\"Marked as unread\");\n\t\t},\n\t\tdisplay: true,\n\t},\n\tMARK_AS_READ: {\n\t\tname: \"MARK_AS_READ\",\n\t\ticon: <EnvelopeOpenIcon />,\n\t\tlabel: \"Mark Read\",\n\t\taction: () => {\n\t\t\tconsole.log(\"Marked as read\");\n\t\t},\n\t\tdisplay: true,\n\t},\n\tTEST: {\n\t\tname: \"TEST\",\n\t\ticon: <SnoozeIcon />,\n\t\tlabel: \"Test\",\n\t\taction: () => {\n\t\t\tconsole.log(\"Hello World\");\n\t\t},\n\t\tdisplay: true,\n\t},\n};\n\nconst overFlowActions = Object.assign({}, contextMenuActions);\n\nexport const BasicContextMenuToggle = createStory(ContextMenuToggle, {\n\tmenuActions: overFlowActions,\n\tmessage: null,\n\tisMuteFilterApplied: false,\n});\nBasicContextMenuToggle.decorators = [\n\t(Story) => (\n\t\t<div style={{ position: \"absolute\", left: \"1%\" }}>\n\t\t\t<Story />\n\t\t</div>\n\t),\n];\n\nexport const ContextMenuToggleBottom = BasicContextMenuToggle.bind({});\nContextMenuToggleBottom.args = { menuActions: overFlowActions, message: null, isMuteFilterApplied: false };\nContextMenuToggleBottom.decorators = [\n\t(Story) => (\n\t\t<div style={{ position: \"absolute\", bottom: \"10%\" }}>\n\t\t\t<Story />\n\t\t</div>\n\t),\n];\n\nexport const ContextMenuToggleRight = BasicContextMenuToggle.bind({});\nContextMenuToggleRight.args = { menuActions: overFlowActions, message: null, isMuteFilterApplied: false };\nContextMenuToggleRight.decorators = [\n\t(Story) => (\n\t\t<div style={{ position: \"absolute\", right: \"5%\" }}>\n\t\t\t<Story />\n\t\t</div>\n\t),\n];\n\nexport const ContextMenuToggleBottomRight = BasicContextMenuToggle.bind({});\nContextMenuToggleBottomRight.args = { menuActions: overFlowActions, message: null, isMuteFilterApplied: false };\nContextMenuToggleBottomRight.decorators = [\n\t(Story) => (\n\t\t<div style={{ position: \"absolute\", right: \"5%\", bottom: \"10%\" }}>\n\t\t\t<Story />\n\t\t</div>\n\t),\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>;

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

@@ -0,0 +1,16 @@
+import React from "react";
+import { DropZone } from "../DropZone";
+import "../../../assets/css/finsemble.css";
+import "../css/styles.css";
+import { action } from "@storybook/addon-actions";
+export default {
+    title: "Common/DropZone",
+    component: DropZone,
+};
+const Template = (args) => React.createElement(DropZone, Object.assign({}, args));
+export const Default = Template.bind({});
+Default.args = {
+    children: React.createElement("div", null, "This is a test"),
+    processFile: action("update"),
+};
+//# sourceMappingURL=DropZone.stories.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"DropZone.stories.js","sourceRoot":"","sources":["../../../../src/components/common/stories/DropZone.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;AAE3B,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAElD,eAAe;IACd,KAAK,EAAE,iBAAiB;IACxB,SAAS,EAAE,QAAQ;CACnB,CAAC;AAEF,MAAM,QAAQ,GAAyB,CAAC,IAAmB,EAAE,EAAE,CAAC,oBAAC,QAAQ,oBAAK,IAAI,EAAI,CAAC;AAEvF,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzC,OAAO,CAAC,IAAI,GAAG;IACd,QAAQ,EAAE,kDAAyB;IACnC,WAAW,EAAE,MAAM,CAAC,QAAQ,CAAC;CAC7B,CAAC","sourcesContent":["import React from \"react\";\nimport { DropZone, DropZoneProps } from \"../DropZone\";\nimport \"../../../assets/css/finsemble.css\";\nimport \"../css/styles.css\";\nimport { Story } from \"@storybook/react/types-6-0\";\nimport { action } from \"@storybook/addon-actions\";\n\nexport default {\n\ttitle: \"Common/DropZone\",\n\tcomponent: DropZone,\n};\n\nconst Template: Story<DropZoneProps> = (args: DropZoneProps) => <DropZone {...args} />;\n\nexport const Default = Template.bind({});\nDefault.args = {\n\tchildren: <div>This is a test</div>,\n\tprocessFile: action(\"update\"),\n};\n"]}

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

@@ -0,0 +1,33 @@
+import "../../../assets/css/finsemble.css";
+import "../css/styles.css";
+import React from "react";
+declare const _default: {
+    title: string;
+    component: React.FunctionComponent<import("../DropdownButton").IFinsembleDropdownActionButtonProps>;
+};
+export default _default;
+export declare const DropdownButtonElement: import("@storybook/react").Story<{
+    buttonLabel: string;
+    buttonOptions: {
+        buttonLabel: string;
+    }[];
+}>;
+export declare const DefaultDropdownButtonElement: import("@storybook/react").Story<{
+    buttonLabel: string;
+    buttonOptions: {
+        optionLabel: string;
+    }[];
+    caretLocation: string;
+    classNames: string;
+}>;
+export declare const DefaultDropdownButtonWithDefaultElement: import("@storybook/react").Story<{
+    buttonLabel: string;
+    buttonOptions: {
+        optionLabel: string;
+    }[];
+    caretLocation: string;
+    classNames: string;
+    defaultSelection: {
+        optionLabel: string;
+    };
+}>;