superdesk-ui-framework 3.0.65 → 3.0.67

package/react/examples/pages/playgrounds/react-playgrounds/Multiedit.js

@@ -0,0 +1,200 @@
+"use strict";
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+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 __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Editor = exports.Multiedit = void 0;
+var React = __importStar(require("react"));
+var index_1 = require("../../../../app-typescript/index");
+var Layout = __importStar(require("../../../../app-typescript/components/Layouts"));
+var Form = __importStar(require("../../../../app-typescript/components/Form"));
+var Nav = __importStar(require("../../../../app-typescript/components/Navigation"));
+var Lists_1 = require("../../../../app-typescript/components/Lists");
+var Spacer_1 = require("../../../../app-typescript/components/Spacer");
+var Multiedit = /** @class */ (function (_super) {
+    __extends(Multiedit, _super);
+    function Multiedit(props) {
+        var _this = _super.call(this, props) || this;
+        _this.state = {
+            theme: 'light',
+            itemType: 'itemtype01',
+            dropDownState: '',
+            itemSelected1: false,
+            itemSelected2: false,
+            itemSelected3: false,
+            value1: false,
+            value2: false,
+            value3: false,
+            leftPanelOpen: false,
+            rightPanelOpen: false,
+            rightPanelPinned: false,
+            sideOverlayOpen: false,
+            sideBarOpen: false,
+            arr: [React.createElement(Editor, null), React.createElement(Editor, null)],
+        };
+        _this.handleTheme = _this.handleTheme.bind(_this);
+        return _this;
+    }
+    Multiedit.prototype.handleTheme = function (newTheme) {
+        this.setState({
+            theme: newTheme
+        });
+    };
+    Multiedit.prototype.changeStatus = function (item, status) {
+        if (item.status.includes(status)) {
+            item.status.splice(item.status.indexOf(status), 1);
+        }
+        else {
+            item.status.push(status);
+        }
+    };
+    Multiedit.prototype.render = function () {
+        var _this = this;
+        return (React.createElement(index_1.Modal, { className: 'p-dialog-flex', onHide: function () { return false; }, maximized: true, contentPadding: "none", headerTemplate: "Multiedit", visible: true },
+            React.createElement(Spacer_1.Spacer, { children: this.state.arr, gap: '0' }),
+            React.createElement("div", { style: {
+                    padding: '0 20px',
+                    display: 'flex',
+                    alignItems: 'center'
+                } },
+                React.createElement(index_1.Dropdown, { append: true, items: [
+                        { label: 'Action 1', onSelect: function () { return _this.setState({ arr: __spreadArray(__spreadArray([], _this.state.arr, true), [React.createElement(Editor, null)], false) }); } },
+                    ] },
+                    React.createElement(index_1.Button, { type: "primary", icon: "plus-large", text: "Add article", style: "filled", size: "large", shape: "round", iconOnly: true, onClick: function () { return false; } })))));
+    };
+    return Multiedit;
+}(React.Component));
+exports.Multiedit = Multiedit;
+var Editor = /** @class */ (function (_super) {
+    __extends(Editor, _super);
+    function Editor(props) {
+        var _this = _super.call(this, props) || this;
+        _this.state = {
+            sideBarOpen: false,
+            activeTab: '1',
+        };
+        return _this;
+    }
+    Editor.prototype.render = function () {
+        var _this = this;
+        return (React.createElement("div", { style: { borderRight: '4px solid grey' } },
+            React.createElement(Layout.AuthoringFrame, { header: (React.createElement(index_1.SubNav, { zIndex: 2 },
+                    React.createElement(index_1.ButtonGroup, { align: 'end' },
+                        React.createElement(index_1.ButtonGroup, { subgroup: true, spaces: "no-space" },
+                            React.createElement(index_1.Tooltip, { text: 'More actions', flow: 'left' },
+                                React.createElement(index_1.NavButton, { type: 'default', icon: 'dots-vertical', text: 'More actions', onClick: function () { return false; } })),
+                            React.createElement(index_1.Tooltip, { text: 'Send to / Publish', flow: 'left' },
+                                React.createElement(index_1.NavButton, { type: 'highlight', icon: 'send-to', iconSize: 'big', text: 'Send to / Publish', onClick: function () { return false; } })),
+                            React.createElement(index_1.Tooltip, { text: 'Send to / Publish', flow: 'left' },
+                                React.createElement(index_1.NavButton, { type: 'darker', icon: this.state.sideBarOpen ? 'forward-thin' : 'backward-thin', text: 'More actions', onClick: function () { return _this.setState({ sideBarOpen: !_this.state.sideBarOpen }); } })))))), main: (React.createElement(Layout.AuthoringMain, { headerPadding: 'medium', toolBar: (React.createElement(React.Fragment, null,
+                        React.createElement("div", { className: "sd-editor-toolbar__content" },
+                            React.createElement("dl", null,
+                                React.createElement("dt", null, "Created"),
+                                React.createElement("dd", null,
+                                    React.createElement("time", { title: "July 29, 2021 3:58 PM" }, "07/29")),
+                                React.createElement("dt", null, "by"),
+                                React.createElement("dt", null, "Nareg Asmarian")),
+                            React.createElement("dl", null,
+                                React.createElement("dt", null, "Modified"),
+                                React.createElement("dd", null,
+                                    React.createElement("time", { title: "July 29, 2021 3:58 PM" }, "07/29")))),
+                        React.createElement(index_1.ButtonGroup, { align: 'end' },
+                            React.createElement(index_1.IconButton, { icon: "preview-mode", toolTipAppend: true, ariaValue: "Print preview", onClick: function () { return false; } }),
+                            React.createElement(index_1.IconButton, { icon: "adjust", ariaValue: "Toogle theme", onClick: function () { return false; } }),
+                            React.createElement(index_1.IconButton, { icon: "switches", ariaValue: "Theme settings", onClick: function () { return false; } })))), authoringHeader: (React.createElement(React.Fragment, null,
+                        React.createElement(Form.FormGroup, { inlineLabel: true },
+                            React.createElement(Form.FormItem, null,
+                                React.createElement(index_1.Input, { type: 'text', label: 'Slugline', value: 'This is some value', maxLength: 30, info: 'This is some hint message', required: false, disabled: false, onChange: function () { return false; } })),
+                            React.createElement(Form.FormItem, null,
+                                React.createElement(index_1.Input, { type: 'text', label: 'Slugline', value: 'This is some value', maxLength: 30, info: 'This is some hint message', required: false, disabled: false, onChange: function () { return false; } }))),
+                        React.createElement(Form.FormGroup, { inlineLabel: true },
+                            React.createElement(Form.FormItem, null,
+                                React.createElement(index_1.Input, { type: 'text', label: 'Genre', value: 'This is some value', maxLength: 30, info: 'This is some hint message', required: false, disabled: false, onChange: function () { return false; } }))),
+                        React.createElement(Form.FormGroup, { marginBottom: '0', inlineLabel: true },
+                            React.createElement(Form.FormItem, null,
+                                React.createElement(index_1.Input, { type: 'text', label: 'Subject', value: 'This is some value', maxLength: 30, info: 'This is some hint message', required: true, disabled: false, onChange: function () { return false; } })),
+                            React.createElement(Form.FormItem, { autoWidth: true },
+                                React.createElement(Form.FormText, null, "Just testing:")),
+                            React.createElement(Form.FormItem, null,
+                                React.createElement(index_1.Select, { label: 'Categories', labelHidden: true, value: 'This is some value', info: 'This is some hint message', required: true, disabled: false, onChange: function () { return false; } },
+                                    React.createElement(index_1.Option, null, "Option 1"),
+                                    React.createElement(index_1.Option, null, "Option 2"))),
+                            React.createElement(Form.FormItem, { autoWidth: true },
+                                React.createElement(index_1.ButtonGroup, null,
+                                    React.createElement(index_1.IconButton, { ariaValue: "Submit", icon: "picture", onClick: function () { return false; } }),
+                                    React.createElement(index_1.Button, { text: "Cancel", onClick: function () { return false; }, type: "default", style: "hollow" }),
+                                    React.createElement(index_1.Button, { text: "Submit", onClick: function () { return false; }, type: "primary" })))))) })), sidePanel: (React.createElement(Layout.Panel, { side: 'right', background: 'grey', open: false, size: 'x-small' },
+                    React.createElement(Layout.PanelHeader, { title: 'Pinned content', onClose: function () { return false; } }),
+                    React.createElement(Layout.PanelContent, null,
+                        React.createElement(Layout.PanelContentBlock, null,
+                            React.createElement(Lists_1.BoxedList, { density: 'comfortable' },
+                                React.createElement(Lists_1.BoxedListItem, { type: "success", clickable: true, media: (React.createElement(index_1.Icon, { name: 'slideshow' })), actions: (React.createElement(index_1.IconButton, { icon: "dots-vertical", ariaValue: "More actions", onClick: function () { return false; } })) },
+                                    React.createElement(Lists_1.BoxedListContentRow, null, "Maecenas sed diam eget risus varius blandit sit amet non magna. Vestibulum id ligula porta felis euismod semper."),
+                                    React.createElement(Lists_1.BoxedListContentRow, null, "Praesent commodo cursus magna, vel scelerisque nisl consectetur et.")),
+                                React.createElement(Lists_1.BoxedListItem, { type: "warning", media: (React.createElement(index_1.AvatarWrapper, { size: "medium" },
+                                        React.createElement(index_1.AvatarContentText, { text: "JL", tooltipText: "Jeffrey Lebowski" }))), footer: (React.createElement(index_1.ButtonGroup, { align: "end" },
+                                        React.createElement(index_1.Button, { text: "cancel", size: "small", style: "hollow", onClick: function () { return false; } }),
+                                        React.createElement(index_1.Button, { text: "yes", size: "small", style: "hollow", type: "primary", onClick: function () { return false; } }))), actions: (React.createElement(index_1.IconButton, { icon: "dots-vertical", ariaValue: "More actions", onClick: function () { return false; } })) },
+                                    React.createElement(Lists_1.BoxedListContentRow, null, "Maecenas sed diam eget risus varius blandit sit amet magna.")),
+                                React.createElement(Lists_1.BoxedListItem, { selected: true, actions: (React.createElement(index_1.IconButton, { icon: "dots-vertical", ariaValue: "More actions", onClick: function () { return false; } })) },
+                                    React.createElement(Lists_1.BoxedListContentRow, null, "Maecenas sed diam eget risus varius blandit sit amet magna. Vestibulum id ligula porta felis euismod semper."))))))), sideBarClosed: this.state.sideBarOpen, sideBar: (React.createElement(Nav.SideBarTabs, { items: [
+                        { icon: 'info', size: 'big', tooltip: 'Info', id: '1' },
+                        { icon: 'chat', size: 'big', tooltip: 'Comments', id: '2' },
+                        { icon: 'history', size: 'big', tooltip: 'History', id: '3' },
+                        { icon: 'package', size: 'big', tooltip: 'Packages', id: '4' },
+                        { icon: 'attachment', size: 'big', tooltip: 'Attachments', id: '5' },
+                        { icon: 'comments', size: 'big', tooltip: 'Inline Comments', id: '6' },
+                        { icon: 'suggestion', size: 'big', tooltip: 'Suggestions', id: '7' }
+                    ], activeTab: this.state.activeTab, onActiveTabChange: function (val) {
+                        _this.setState({
+                            activeTab: val,
+                        });
+                    } })) })));
+    };
+    return Editor;
+}(React.Component));
+exports.Editor = Editor;

package/react/examples/pages/playgrounds/react-playgrounds/PageLayoutTest.d.ts

@@ -0,0 +1,22 @@
+import * as React from 'react';
+interface IProps {
+    children?: React.ReactNode;
+}
+interface IState {
+    theme: 'dark' | 'light' | string;
+    itemType: string;
+    dropDownState: string;
+    itemSelected1: boolean;
+    itemSelected2: boolean;
+    itemSelected3: boolean;
+    value1: boolean;
+    leftPanelOpen: boolean;
+    rightPanelOpen: boolean;
+}
+export declare class PageLayoutTest extends React.Component<IProps, IState> {
+    constructor(props: IProps);
+    handleTheme(newTheme: string): void;
+    changeStatus(item: any, status: string): void;
+    render(): JSX.Element;
+}
+export {};

package/react/examples/pages/playgrounds/react-playgrounds/PageLayoutTest.js

@@ -0,0 +1,134 @@
+"use strict";
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+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.PageLayoutTest = void 0;
+var React = __importStar(require("react"));
+var index_1 = require("../../../../app-typescript/index");
+var GridElements = __importStar(require("../../../../app-typescript/components/GridItem"));
+var Layout = __importStar(require("../../../../app-typescript/components/Layouts"));
+var items_1 = __importDefault(require("../dummy-data/items"));
+var PageLayoutTest = /** @class */ (function (_super) {
+    __extends(PageLayoutTest, _super);
+    function PageLayoutTest(props) {
+        var _this = _super.call(this, props) || this;
+        _this.state = {
+            theme: 'light',
+            itemType: 'itemtype01',
+            dropDownState: '',
+            itemSelected1: false,
+            itemSelected2: false,
+            itemSelected3: false,
+            value1: false,
+            leftPanelOpen: false,
+            rightPanelOpen: false,
+        };
+        _this.handleTheme = _this.handleTheme.bind(_this);
+        return _this;
+    }
+    PageLayoutTest.prototype.handleTheme = function (newTheme) {
+        this.setState({
+            theme: newTheme
+        });
+    };
+    PageLayoutTest.prototype.changeStatus = function (item, status) {
+        if (item.status.includes(status)) {
+            item.status.splice(item.status.indexOf(status), 1);
+        }
+        else {
+            item.status.push(status);
+        }
+    };
+    PageLayoutTest.prototype.render = function () {
+        var _this = this;
+        return (React.createElement(Layout.PageLayout, { header: (React.createElement(index_1.SubNav, { zIndex: 2 },
+                React.createElement(index_1.ButtonGroup, { align: "start", padded: true },
+                    React.createElement(index_1.Button, { text: "Open left panel", style: "hollow", onClick: function () { return _this.setState({ 'leftPanelOpen': !_this.state.leftPanelOpen }); } })),
+                React.createElement(index_1.ButtonGroup, { align: 'end' },
+                    React.createElement(index_1.Button, { text: "Open right panel", style: "hollow", onClick: function () { return _this.setState({ 'rightPanelOpen': !_this.state.rightPanelOpen }); } }),
+                    React.createElement(index_1.Divider, { size: "mini" }),
+                    React.createElement(index_1.ButtonGroup, { subgroup: true, spaces: "no-space" },
+                        React.createElement(index_1.Dropdown, { items: [
+                                {
+                                    type: 'group', label: 'Chose a theme', items: [
+                                        'divider',
+                                        { label: 'Light', onSelect: function () { return _this.handleTheme('light-ui'); } },
+                                        { label: 'Dark', onSelect: function () { return _this.handleTheme('dark-ui'); } },
+                                    ]
+                                },
+                            ] },
+                            React.createElement(index_1.NavButton, { type: 'default', icon: 'adjust', onClick: function () { return false; } })))))), leftPanelOpen: this.state.leftPanelOpen, leftPanel: (React.createElement(Layout.Panel, { side: 'left', background: 'light', open: this.state.leftPanelOpen, size: 'x-large' },
+                React.createElement(Layout.PanelHeader, { title: 'This is the title for the Panel', onClose: function () { return _this.setState({ 'leftPanelOpen': false }); } }),
+                React.createElement(Layout.PanelContent, null,
+                    React.createElement(Layout.PanelContentBlock, null,
+                        React.createElement("p", null, "Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas faucibus mollis interdum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Aenean lacinia bibendum nulla sed consectetur. Lorem ipsum dolor sit amet, consectetur adipiscing elit."),
+                        React.createElement("p", null, "Aenean lacinia bibendum nulla sed consectetur. Etiam porta sem malesuada magna mollis euismod. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam quis risus eget urna mollis ornare vel eu leo. Curabitur blandit tempus porttitor. Aenean lacinia bibendum nulla sed consectetur. Morbi leo risus, porta ac consectetur ac, vestibulum at eros."))))), rightPanelOpen: this.state.rightPanelOpen, rightPanel: (React.createElement(Layout.Panel, { side: 'right', background: 'grey', open: this.state.rightPanelOpen, size: 'small' },
+                React.createElement(Layout.PanelHeader, { color: 'blueGreyDarker', title: 'Right Panel Title', onClose: function () { return _this.setState({ 'rightPanelOpen': false }); } }),
+                React.createElement(Layout.PanelContent, null,
+                    React.createElement(Layout.PanelContentBlock, null,
+                        React.createElement("p", null, "Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas faucibus mollis interdum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Aenean lacinia bibendum nulla sed consectetur. Lorem ipsum dolor sit amet, consectetur adipiscing elit."),
+                        React.createElement("p", null, "Aenean lacinia bibendum nulla sed consectetur. Etiam porta sem malesuada magna mollis euismod. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam quis risus eget urna mollis ornare vel eu leo. Curabitur blandit tempus porttitor. Aenean lacinia bibendum nulla sed consectetur. Morbi leo risus, porta ac consectetur ac, vestibulum at eros."))))), main: (React.createElement(index_1.GridList, { size: "small", gap: "medium", margin: "3" }, items_1.default.map(function (item, index) {
+                return React.createElement(GridElements.GridItem, { locked: item.locked, status: item.status, itemtype: item.type, key: index },
+                    React.createElement(GridElements.GridItemCheckWrapper, null,
+                        React.createElement(index_1.Checkbox, { checked: item.selected, label: { text: '' }, onChange: function (value) {
+                                item.selected = value;
+                                _this.changeStatus(item, 'selected');
+                            } })),
+                    React.createElement(GridElements.GridItemTopActions, null,
+                        React.createElement(index_1.IconButton, { icon: 'fullscreen', ariaValue: 'More actions', onClick: function () { return false; } })),
+                    React.createElement(GridElements.GridItemMedia, null, item.image ? React.createElement("img", { src: item.image, alt: item.imageAlt }) : null),
+                    React.createElement(GridElements.GridItemContent, null,
+                        React.createElement(GridElements.GridItemTime, { time: item.date }),
+                        React.createElement(GridElements.GridItemTitle, null, item.title),
+                        React.createElement(GridElements.GridItemText, null, item.description)),
+                    React.createElement(GridElements.GridItemFooter, null,
+                        React.createElement(GridElements.GridItemFooterBlock, { align: 'left' },
+                            React.createElement(index_1.Icon, { name: item.type, className: 'sd-grid-item__type-icn' }),
+                            React.createElement(index_1.Badge, { text: item.urgency, color: item.urgencyColor }),
+                            React.createElement(index_1.Badge, { text: item.priority, shape: 'square', color: item.priorityColor })),
+                        React.createElement(GridElements.GridItemFooterActions, null,
+                            React.createElement(index_1.IconButton, { icon: 'dots-vertical', ariaValue: 'More actions', onClick: function () { return _this.changeStatus(item, 'archived'); } }))));
+            }))) }));
+    };
+    return PageLayoutTest;
+}(React.Component));
+exports.PageLayoutTest = PageLayoutTest;

package/react/examples/pages/playgrounds/react-playgrounds/PersonalProfile.d.ts

@@ -0,0 +1,40 @@
+import * as React from 'react';
+interface IProps {
+    children?: React.ReactNode;
+}
+interface IState {
+    theme: 'dark' | 'light' | string;
+    itemType: string;
+    dropDownState: string;
+    openPreview: boolean;
+    openFilter: boolean;
+    itemSelected1: boolean;
+    itemSelected2: boolean;
+    itemSelected3: boolean;
+    value1: boolean;
+    value2: boolean;
+    value3: boolean;
+    value4: boolean;
+    value5: boolean;
+    value6: boolean;
+    value7: boolean;
+    value8: boolean;
+    value9: boolean;
+    value10: boolean;
+    value11: boolean;
+    value12: boolean;
+    radioValue1: string;
+    radioValue2: string;
+    radioValue3: string;
+    indexValue: number;
+}
+export declare class PersonalProfile extends React.Component<IProps, IState> {
+    constructor(props: IProps);
+    handleFilter(): void;
+    handlePreview(): void;
+    handleTheme(newTheme: string): void;
+    changeStatus(item: any, status: string): void;
+    handleClick: (number: number) => void;
+    render(): JSX.Element;
+}
+export {};