oolib 2.110.1 → 2.111.0

package/dist/stories/InlineAlert.stories.d.ts

@@ -0,0 +1,62 @@
+declare namespace _default {
+    let title: string;
+    namespace args {
+        let type: string;
+        let text: string;
+        let linkBtn: boolean;
+        let link_text: string;
+        let link_URL: string;
+        let invert: boolean;
+    }
+    namespace argTypes {
+        export namespace type_1 {
+            let name: string;
+            let options: string[];
+            namespace control {
+                let type_2: string;
+                export { type_2 as type };
+            }
+            let defaultValue: string;
+        }
+        export { type_1 as type };
+        export namespace text_1 {
+            let name_1: string;
+            export { name_1 as name };
+        }
+        export { text_1 as text };
+        export namespace link_text_1 {
+            let name_2: string;
+            export { name_2 as name };
+            export namespace _if {
+                let arg: string;
+                let truthy: boolean;
+            }
+            export { _if as if };
+        }
+        export { link_text_1 as link_text };
+        export namespace link_URL_1 {
+            let name_3: string;
+            export { name_3 as name };
+            export namespace _if_1 {
+                let arg_1: string;
+                export { arg_1 as arg };
+                let truthy_1: boolean;
+                export { truthy_1 as truthy };
+            }
+            export { _if_1 as if };
+        }
+        export { link_URL_1 as link_URL };
+        export namespace linkBtn_1 {
+            let name_4: string;
+            export { name_4 as name };
+        }
+        export { linkBtn_1 as linkBtn };
+        export namespace invert_1 {
+            let name_5: string;
+            export { name_5 as name };
+        }
+        export { invert_1 as invert };
+    }
+}
+export default _default;
+export function InlineAlert(args: any): import("react").JSX.Element;

package/dist/stories/InlineAlert.stories.js

@@ -0,0 +1,62 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.InlineAlert = void 0;
+var InlineAlert_1 = require("../components/InlineAlert");
+var themes_1 = require("../themes");
+var greyColor100 = themes_1.colors.greyColor100;
+exports.default = {
+    title: "Components/InlineAlert",
+    args: {
+        type: "danger",
+        text: 'warning, something is wrong',
+        linkBtn: false,
+        link_text: '',
+        link_URL: '',
+        invert: false,
+    },
+    argTypes: {
+        type: {
+            name: "Alert Type",
+            options: ['danger', 'neutral', 'neutralInactive', 'success'],
+            control: { type: 'select' },
+            defaultValue: 'danger',
+        },
+        text: {
+            name: "Text Type"
+        },
+        link_text: {
+            name: "Link Button Text",
+            if: { arg: 'linkBtn', truthy: true },
+        },
+        link_URL: {
+            name: "Link Button URL",
+            if: { arg: 'linkBtn', truthy: true },
+        },
+        linkBtn: {
+            name: "Link Button"
+        },
+        invert: {
+            name: "Invert"
+        },
+    }
+};
+var InlineAlert = function (args) {
+    args.link = {
+        text: args.link_text,
+        url: args.link_URL
+    };
+    return (React.createElement("div", { style: { padding: 50, backgroundColor: args.invert ? greyColor100 : 'initial' } },
+        React.createElement(InlineAlert_1.InlineAlert, __assign({}, args))));
+};
+exports.InlineAlert = InlineAlert;

package/dist/stories/Layout.stories.d.ts

@@ -0,0 +1,161 @@
+/// <reference types="mdx" />
+declare namespace _default {
+    let title: string;
+    namespace parameters {
+        namespace docs {
+            export { LayoutDocs as page };
+        }
+    }
+}
+export default _default;
+export function Container({ fill, padding, enableContainerQuery }: {
+    fill: any;
+    padding: any;
+    enableContainerQuery: any;
+}): import("react").JSX.Element;
+export namespace Container {
+    export { ContainerArgTypes as argTypes };
+    export { ContainerArgs as args };
+}
+export function Section(args: any): import("react").JSX.Element;
+export namespace Section {
+    export { SectionArgTypes as argTypes };
+    export { SectionArgs as args };
+}
+export function Wrappers(args: any): import("react").JSX.Element;
+export namespace Wrappers {
+    export { WrapperArgTypes as argTypes };
+    export { WrapperArgs as args };
+}
+export function Playground(args: any): import("react").JSX.Element;
+export namespace Playground {
+    export { WrapperArgTypes as argTypes };
+    export { WrapperArgs as args };
+}
+export function Padding({ fill, padding, margin }: {
+    fill: any;
+    padding: any;
+    margin: any;
+}): import("react").JSX.Element;
+export namespace Padding {
+    export { PaddingArgTypes as argTypes };
+    export { PaddingArgs as args };
+}
+import LayoutDocs from './Layout.mdx';
+declare namespace ContainerArgTypes {
+    namespace fill {
+        namespace control {
+            let type: string;
+            let options: string[];
+        }
+    }
+    namespace padding {
+        export namespace control_1 {
+            let type_1: string;
+            export { type_1 as type };
+        }
+        export { control_1 as control };
+        let options_1: number[];
+        export { options_1 as options };
+    }
+}
+declare namespace ContainerArgs {
+    let fill_1: any;
+    export { fill_1 as fill };
+    let padding_1: string;
+    export { padding_1 as padding };
+    export let enableContainerQuery: boolean;
+}
+declare namespace SectionArgTypes {
+    export namespace border {
+        export namespace control_2 {
+            let type_2: string;
+            export { type_2 as type };
+            let options_2: string[];
+            export { options_2 as options };
+        }
+        export { control_2 as control };
+    }
+    export namespace fill_2 {
+        export namespace control_3 {
+            let type_3: string;
+            export { type_3 as type };
+            let options_3: string[];
+            export { options_3 as options };
+        }
+        export { control_3 as control };
+    }
+    export { fill_2 as fill };
+}
+declare namespace SectionArgs {
+    let border_1: any;
+    export { border_1 as border };
+    let fill_3: string;
+    export { fill_3 as fill };
+}
+declare namespace WrapperArgTypes {
+    namespace alignment {
+        let options_4: string[];
+        export { options_4 as options };
+        export namespace control_4 {
+            let type_4: string;
+            export { type_4 as type };
+        }
+        export { control_4 as control };
+    }
+    namespace maxWidth {
+        export namespace control_5 {
+            let type_5: string;
+            export { type_5 as type };
+        }
+        export { control_5 as control };
+        let options_5: string[];
+        export { options_5 as options };
+    }
+}
+declare namespace WrapperArgs {
+    let alignment_1: string;
+    export { alignment_1 as alignment };
+    let maxWidth_1: string;
+    export { maxWidth_1 as maxWidth };
+}
+declare namespace PaddingArgTypes {
+    export namespace fill_4 {
+        export namespace control_6 {
+            let type_6: string;
+            export { type_6 as type };
+            let options_6: string[];
+            export { options_6 as options };
+        }
+        export { control_6 as control };
+    }
+    export { fill_4 as fill };
+    export namespace padding_2 {
+        export namespace control_7 {
+            let type_7: string;
+            export { type_7 as type };
+            let options_7: number[];
+            export { options_7 as options };
+        }
+        export { control_7 as control };
+    }
+    export { padding_2 as padding };
+    export namespace margin {
+        export namespace control_8 {
+            let type_8: string;
+            export { type_8 as type };
+            let options_8: string[];
+            export { options_8 as options };
+        }
+        export { control_8 as control };
+        export let disabled: boolean;
+    }
+}
+declare namespace PaddingArgs {
+    let fill_5: string[];
+    export { fill_5 as fill };
+    let padding_3: number[];
+    export { padding_3 as padding };
+    let margin_1: string[];
+    export { margin_1 as margin };
+}

package/dist/stories/Layout.stories.js

@@ -0,0 +1,183 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+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;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Padding = exports.Playground = exports.Wrappers = exports.Section = exports.Container = void 0;
+var styled_components_1 = __importStar(require("styled-components"));
+var Container_1 = require("../components/Container");
+var Section_1 = require("../components/Section");
+var WrapperComps = __importStar(require("../components/Wrappers"));
+var themes_1 = require("../themes");
+var mixins_1 = require("../themes/mixins");
+var Layout_mdx_1 = __importDefault(require("./Layout.mdx"));
+var Paddings_1 = require("../components/Paddings");
+var Margins_1 = require("../components/Margins");
+var Typo_1 = require("../components/Typo");
+exports.default = {
+    title: "Components/Layout",
+    parameters: {
+        docs: {
+            page: Layout_mdx_1.default,
+        },
+    },
+};
+var WrapperStyle = { backgroundColor: themes_1.colors.lightBlue, height: '400px' };
+var WrapperArgTypes = {
+    alignment: {
+        options: ['center', 'left'],
+        control: { type: 'inline-radio' },
+    },
+    maxWidth: {
+        control: { type: 'select' },
+        options: ['650', '700', '820', '800', '900', '1000', '1120', '1500'],
+    },
+};
+var WrapperArgs = {
+    alignment: 'center',
+    maxWidth: '700'
+};
+var StyledContainerComp = (0, styled_components_1.default)(Container_1.Container)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: relative;\n  border: 1px solid ", "; \n  \n  height: max-content;\n\n"], ["\n  position: relative;\n  border: 1px solid ", "; \n  \n  height: max-content;\n\n"])), themes_1.colors.lightRed);
+var ContainerArgTypes = {
+    fill: {
+        control: { type: 'inline-check', options: ['PaddingTopBottom', 'PaddingTop', 'PaddingBottom'] },
+    },
+    padding: {
+        control: { type: 'select' },
+        options: Array.from({ length: 11 }, function (v, i) { return i * 5; }),
+    }
+};
+var ContainerArgs = {
+    fill: undefined,
+    padding: '10',
+    enableContainerQuery: false
+};
+var Container = function (_a) {
+    var fill = _a.fill, padding = _a.padding, enableContainerQuery = _a.enableContainerQuery;
+    return (React.createElement(StyledContainerComp, { style: { background: themes_1.colors.lightRed }, enableContainerQuery: enableContainerQuery },
+        React.createElement(Paddings_1.PaddingTopBottom, { paddingTop: (fill === null || fill === void 0 ? void 0 : fill.includes('PaddingTop')) ? padding : 0, paddingBottom: (fill === null || fill === void 0 ? void 0 : fill.includes('PaddingBottom')) ? padding : 0, padding: (fill === null || fill === void 0 ? void 0 : fill.includes('PaddingTopBottom')) ? padding : 0 },
+            React.createElement("h2", { style: { background: themes_1.colors.white } }, "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Consectetur voluptatibus inventore minima officia debitis accusamus sapiente sed natus soluta eos maxime, cum voluptatem sequi vero, quaerat nesciunt eveniet hic, delectus vel deserunt amet doloremque laudantium quam harum. Nemo vel, voluptatem consectetur ipsa iusto perspiciatis maxime at rem amet aliquid odio error dolor cupiditate hic vero adipisci, nam eligendi quas. Doloribus impedit totam minima magni assumenda inventore tenetur veniam fugit numquam maiores id eius culpa ut consectetur, aliquid repudiandae! Magnam earum accusamus quo recusandae tempore labore eius reiciendis quos illo ullam provident saepe quibusdam dolores, optio voluptas deserunt minus dolore harum nihil eum voluptatem fugiat similique porro. Modi possimus distinctio assumenda natus asperiores, laborum deleniti commodi impedit nesciunt quo ex rem consequatur sunt quasi vitae dicta? Reiciendis sed soluta reprehenderit, placeat culpa quam iste aliquid repellendus! Corrupti, placeat quasi nam ad ea dicta doloribus harum sunt quaerat debitis deleniti totam, culpa dolores dolor distinctio pariatur, hic accusantium itaque maxime architecto assumenda. Tempore enim sequi, quas similique labore earum, non pariatur quisquam obcaecati magnam nostrum. Doloribus iusto beatae totam error enim aliquid blanditiis, nostrum quos architecto officiis commodi tenetur distinctio facere quaerat, quis suscipit nemo. Incidunt itaque ea quod adipisci perferendis maxime sapiente iusto consectetur sit eius! Nostrum sint incidunt voluptas sunt quo, animi quia voluptatem molestias laborum tempora soluta iste, impedit accusamus repudiandae ut quod assumenda minus. Facere ratione voluptas, dolorem consectetur fuga vel maiores laborum explicabo. Voluptatum explicabo dolore, illo cupiditate dolorum nisi laborum laboriosam, praesentium sunt quaerat maiores eos natus sequi tenetur adipisci ex odit reprehenderit doloribus ipsa fugiat hic sapiente quae iure. Beatae dignissimos qui exercitationem odit ullam, molestias recusandae culpa iusto illum. Placeat ex quo magni atque illo amet accusantium vitae necessitatibus earum officia in corporis alias nihil, expedita blanditiis adipisci veritatis id a maiores aperiam? Nesciunt, a totam velit at et quos voluptatibus quia ea aliquid quis perferendis vel neque eum obcaecati deleniti. Sit, cum consequuntur molestias odit voluptates minima unde itaque non rem amet nemo, quasi facilis, repudiandae iure commodi corporis atque nostrum. Tempora aspernatur minus et, harum ut accusantium aperiam expedita dignissimos cum dolorem."))));
+};
+exports.Container = Container;
+exports.Container.argTypes = ContainerArgTypes;
+exports.Container.args = ContainerArgs;
+var SectionArgTypes = {
+    border: {
+        control: { type: 'inline-check', options: ['borderBottom', 'borderLeft', 'borderRight', 'borderTop'] },
+    },
+    fill: {
+        control: { type: 'select', options: Object.keys(themes_1.colors) },
+    }
+};
+var SectionArgs = {
+    border: undefined,
+    fill: 'lightYellow'
+};
+var Section = function (args) {
+    var props = {};
+    if (args.border) {
+        args.border.forEach(function (b) {
+            props[b] = true;
+        });
+    }
+    if (args.fill) {
+        props[args.fill] = true;
+    }
+    return (React.createElement(Section_1.Section, __assign({ style: { height: '400px' } }, props)));
+};
+exports.Section = Section;
+exports.Section.argTypes = SectionArgTypes;
+exports.Section.args = SectionArgs;
+var getWrapperComp = function (maxWidth) { return WrapperComps['Wrapper' + maxWidth]; };
+var getWrapperProps = function (alignment) { return alignment === 'left' ? { left: true } : {}; };
+var Wrappers = function (args) {
+    var Comp = getWrapperComp(args.maxWidth);
+    var props = getWrapperProps(args.alignment);
+    return (React.createElement(Comp, __assign({}, props, { style: WrapperStyle })));
+};
+exports.Wrappers = Wrappers;
+exports.Wrappers.argTypes = WrapperArgTypes;
+exports.Wrappers.args = WrapperArgs;
+var Playground = function (args) {
+    var WrapperComp = getWrapperComp(args.maxWidth);
+    var WrapperProps = getWrapperProps(args.alignment);
+    return (React.createElement(StyledContainerComp, { style: { background: themes_1.colors.lightRed } },
+        React.createElement("div", { style: { background: themes_1.colors.white } },
+            React.createElement(WrapperComp, __assign({}, WrapperProps, { style: WrapperStyle })))));
+};
+exports.Playground = Playground;
+exports.Playground.argTypes = WrapperArgTypes;
+exports.Playground.args = WrapperArgs;
+var StyledOuterDiv = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  border: 1px dashed #000;\n  background: ", ";\n"], ["\n  border: 1px dashed #000;\n  background: ", ";\n"])), themes_1.colors.black_opacity80);
+var StyledSection = styled_components_1.default.section(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  background-color: ", ";\n  width: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  height: calc(80vh - ", "px);\n"], ["\n  background-color: ", ";\n  width: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  height: calc(80vh - ", "px);\n"])), themes_1.colors.lightBlue, function (props) { return props.padding; });
+var PaddingArgTypes = {
+    fill: {
+        control: { type: 'inline-check', options: ['PaddingTopBottom', 'PaddingTop', 'PaddingBottom'] },
+    },
+    padding: {
+        control: { type: 'select', options: Array.from({ length: 11 }, function (v, i) { return i * 5; }), },
+    },
+    margin: {
+        control: { type: 'inline-check', options: ['margin'] },
+        disabled: true,
+    }
+};
+var PaddingArgs = {
+    fill: ['PaddingTopBottom'],
+    padding: [20],
+    margin: ['margin']
+};
+var Padding = function (_a) {
+    var fill = _a.fill, padding = _a.padding, margin = _a.margin;
+    return (React.createElement(StyledOuterDiv, { style: { height: "calc(80vh - ".concat(function (props) { return props.padding; }, "px)") } },
+        React.createElement(Paddings_1.PaddingTopBottom, { paddingTop: fill.includes('PaddingTop') ? padding : 0, paddingBottom: fill.includes('PaddingBottom') ? padding : 0, padding: fill.includes('PaddingTopBottom') ? padding : 0 },
+            React.createElement(StyledSection, { padding: padding }, (margin === null || margin === void 0 ? void 0 : margin.includes('margin')) && React.createElement(Margins_1.MarginLeftRightMinus20, null, fill.includes('PaddingTop') && fill.includes('PaddingBottom') || fill.includes('PaddingTopBottom') ? (React.createElement(Typo_1.SANS_4, null,
+                "Padding Top Bottom ",
+                padding)) : fill.includes('PaddingTop') ? (React.createElement(Typo_1.SANS_4, null,
+                "Padding Top ",
+                padding)) : fill.includes('PaddingBottom') ? (React.createElement(Typo_1.SANS_4, null,
+                "Padding Bottom ",
+                padding)) : (React.createElement(Typo_1.SANS_4, null, "No Padding applied")))))));
+};
+exports.Padding = Padding;
+exports.Padding.argTypes = PaddingArgTypes;
+exports.Padding.args = PaddingArgs;
+var templateObject_1, templateObject_2, templateObject_3;

package/dist/stories/LegendRadioList.stories.d.ts

@@ -0,0 +1,15 @@
+declare namespace _default {
+    let title: string;
+    namespace argTypes {
+        namespace handleChangeOn {
+            let name: string;
+            namespace control {
+                let type: string;
+            }
+            let options: string[];
+        }
+    }
+}
+export default _default;
+export function LegendRadioList_(args: any): import("react").JSX.Element;
+export function LegendCheckBoxList_(args: any): import("react").JSX.Element;

package/dist/stories/LegendRadioList.stories.js

@@ -0,0 +1,73 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.LegendCheckBoxList_ = exports.LegendRadioList_ = void 0;
+var react_1 = require("react");
+var LegendRadioList_1 = require("../components/LegendRadioCheckList/LegendRadioList");
+var LegendCheckboxList_1 = require("../components/LegendRadioCheckList/LegendCheckboxList");
+var themes_1 = require("../themes");
+var primaryColor100 = themes_1.colors.primaryColor100, greyColor100 = themes_1.colors.greyColor100, lightBlue = themes_1.colors.lightBlue, lightRed = themes_1.colors.lightRed, invertRed = themes_1.colors.invertRed;
+exports.default = {
+    title: "Components/LegendRadioList",
+    argTypes: {
+        handleChangeOn: {
+            name: "Handle Change On",
+            control: { type: 'inline-radio' },
+            options: ['hover', 'click'],
+        },
+    },
+};
+var legendOptions = [
+    {
+        "value": "option1",
+        "display": "Option 1",
+        "color": "".concat(lightRed),
+    },
+    {
+        "value": "option2",
+        "display": "Option 2",
+        "color": "".concat(invertRed),
+    },
+    {
+        "value": "option3",
+        "display": "Option 3",
+        "color": "".concat(lightBlue),
+    },
+    {
+        "value": "option4",
+        "display": "Option 4",
+        "color": "".concat(primaryColor100),
+    },
+    {
+        "value": "option5",
+        "display": "Option 5",
+        "color": "".concat(greyColor100),
+    }
+];
+var LegendRadioList_ = function (args) {
+    var _a = (0, react_1.useState)(legendOptions[0]), selectedValue = _a[0], setSelectedValue = _a[1];
+    console.log({ selectedValue: args });
+    return (React.createElement("div", { style: { width: "50svh", height: "50svh", display: "flex", alignItems: 'center', justifyContent: "center" } },
+        React.createElement(LegendRadioList_1.LegendRadioList, __assign({ options: legendOptions, onChange: function (k, v) { return setSelectedValue(v); }, value: selectedValue }, args))));
+};
+exports.LegendRadioList_ = LegendRadioList_;
+var LegendCheckBoxList_ = function (args) {
+    var _a = (0, react_1.useState)([]), selectedValue = _a[0], setSelectedValue = _a[1];
+    var handleCheckboxChange = function (id, updatedValue) {
+        setSelectedValue(updatedValue);
+    };
+    console.log({ selectedValue: selectedValue });
+    return (React.createElement("div", { style: { width: "50svh", height: "50svh", display: "flex", alignItems: 'center', justifyContent: "center" } },
+        React.createElement(LegendCheckboxList_1.LegendCheckboxList, __assign({ id: "Id", options: legendOptions, onChange: handleCheckboxChange, value: selectedValue }, args))));
+};
+exports.LegendCheckBoxList_ = LegendCheckBoxList_;

package/dist/stories/Loaders.stories.d.ts

@@ -0,0 +1,77 @@
+declare namespace _default {
+    let title: string;
+}
+export default _default;
+export function _LoaderCircle(args: any): import("react").JSX.Element;
+export namespace _LoaderCircle {
+    namespace argTypes {
+        namespace size {
+            let name: string;
+            let options: string[];
+            namespace mapping {
+                let Small: string;
+                let Medium: string;
+                let Large: string;
+            }
+            namespace control {
+                let type: string;
+            }
+            let defaultValue: string;
+        }
+        namespace text {
+            let name_1: string;
+            export { name_1 as name };
+        }
+        namespace isBlock {
+            let name_2: string;
+            export { name_2 as name };
+        }
+        namespace blockHeight {
+            let name_3: string;
+            export { name_3 as name };
+            export namespace control_1 {
+                let type_1: string;
+                export { type_1 as type };
+            }
+            export { control_1 as control };
+            export { sizeArray as options };
+        }
+        namespace invert {
+            let name_4: string;
+            export { name_4 as name };
+        }
+    }
+    namespace args {
+        let text_1: string;
+        export { text_1 as text };
+        let size_1: string;
+        export { size_1 as size };
+        let isBlock_1: boolean;
+        export { isBlock_1 as isBlock };
+        let blockHeight_1: string;
+        export { blockHeight_1 as blockHeight };
+        let invert_1: boolean;
+        export { invert_1 as invert };
+    }
+}
+export function _LoaderOverlay(args: any): import("react").JSX.Element;
+export namespace _LoaderOverlay {
+    export namespace args_1 {
+        let loaderText: string;
+    }
+    export { args_1 as args };
+    export namespace argTypes_1 {
+        export namespace loaderText_1 {
+            let name_5: string;
+            export { name_5 as name };
+            export namespace control_2 {
+                let type_2: string;
+                export { type_2 as type };
+            }
+            export { control_2 as control };
+        }
+        export { loaderText_1 as loaderText };
+    }
+    export { argTypes_1 as argTypes };
+}
+declare const sizeArray: string[];