@imposium-hub/components 1.44.4 → 1.45.0

package/dist/esm/components/story-previewer/StoryPreviewer.js

@@ -0,0 +1,488 @@
+import * as React from 'react';
+import { VARIABLE_TYPES, BOOLEAN_DEFAULT_OPTIONS } from '../../constants/variables';
+import { OUTPUT_TYPES } from '../../constants/previewer';
+import TextField from '../text-field/TextField';
+import Button from '../button/Button';
+import Spinner from '../spinner/Spinner';
+import NumberField from '../number-field/NumberField';
+import SelectField from '../select-field/SelectField';
+import ButtonGroupField from '../button-group-field/ButtonGroupField';
+import FieldWrapper from '../field-wrapper/FieldWrapper';
+import HRule from '../h-rule/HRule';
+import VideoPlayer from '../players/VideoPlayer';
+import ImagePlayer from '../players/ImagePlayer';
+import MediaVariableField from '../media-variable-field/MediaVariableField';
+import ReactResizeDetector from 'react-resize-detector';
+import { previewer as copy } from '../../constants/copy';
+import { formattedTime } from '../../Util';
+import Timer from '../../services/Timer';
+import LogViewer from '../log-viewer/LogViewer';
+import { connect } from 'react-redux';
+class StoryPreviewer extends React.PureComponent {
+    timer;
+    evtHandlers;
+    TIMEOUT = '02:00';
+    constructor(props) {
+        super(props);
+        const inventory = this.getInventoryDefaults();
+        const inventoryOptions = this.getInventoryOptions();
+        this.state = {
+            inventory,
+            inventoryOptions,
+            experienceId: null,
+            jobId: null,
+            experience: null,
+            timeElapsed: 0,
+            activeOutput: '',
+            rendering: false,
+            isTimeOut: false,
+        };
+        this.timer = new Timer({
+            interval: 1000,
+            onUpdate: (t) => {
+                this.setState({ timeElapsed: t });
+            }
+        });
+        this.evtHandlers = {
+            toggleOutput: (e) => this.toggleActiveOutput(e),
+            createExp: () => this.createExperience(),
+            gotExperience: null
+        };
+    }
+    componentWillUnmount() {
+        const { api, onError } = this.props;
+        const { experienceId } = this.state;
+        this.timer.stop();
+        this.evtHandlers.gotExperience = null;
+        api.cancelExperiencePolling();
+    }
+    getInventoryOptions() {
+        const { variables } = this.props;
+        const options = {};
+        for (const i in variables) {
+            if (variables.hasOwnProperty(i)) {
+                const inv = variables[i];
+                if (inv.defaultItem && inv.defaultItem.type) {
+                    if (inv.defaultItem.type.toLowerCase() === VARIABLE_TYPES.ENUM) {
+                        options[inv.id] = inv.defaultItem.options;
+                    }
+                }
+            }
+        }
+        return options;
+    }
+    getInventoryDefaults() {
+        const { variables } = this.props;
+        const newInv = {};
+        for (const i in variables) {
+            if (variables.hasOwnProperty(i)) {
+                const inv = variables[i];
+                newInv[inv.id] = this.getVariableValue(inv.previewItem);
+            }
+        }
+        return newInv;
+    }
+    checkInventoryDefaults(prevVariables) {
+        const { variables } = this.props;
+        const newInv = { ...this.state.inventory };
+        for (const i in variables) {
+            if (variables.hasOwnProperty(i)) {
+                const newVar = variables[i];
+                const prevVar = prevVariables[i];
+                if (prevVar) {
+                    const prevValue = this.getVariableValue(prevVar.previewItem);
+                    const newValue = this.getVariableValue(newVar.previewItem);
+                    if (newVar.type !== prevVar.type || prevValue !== newValue) {
+                        newInv[i] = newValue;
+                    }
+                }
+            }
+        }
+        return newInv;
+    }
+    getVariableValue(previewItem) {
+        if (previewItem && previewItem.type) {
+            const type = previewItem.type.toLowerCase();
+            if (type === VARIABLE_TYPES.IMAGE || type === VARIABLE_TYPES.VIDEO || type === VARIABLE_TYPES.AUDIO) {
+                return previewItem.url;
+            }
+            else {
+                return previewItem.src;
+            }
+        }
+        else {
+            return undefined;
+        }
+    }
+    componentDidMount() {
+        // if the experience ID is set when the previewer is mounted, get that experience
+        const { experienceId, jobId } = this.props;
+        if (experienceId && jobId) {
+            this.setState({
+                jobId
+            }, () => {
+                this.getExperience(experienceId);
+            });
+        }
+    }
+    componentDidUpdate(prevProps, prevState) {
+        if (prevProps.storyId !== this.props.storyId) {
+            this.evtHandlers.gotExperience = null;
+        }
+        if (prevProps.variables !== this.props.variables) {
+            let inventory;
+            const inventoryOptions = this.getInventoryOptions();
+            if (prevProps.storyId === this.props.storyId) {
+                inventory = this.checkInventoryDefaults(prevProps.variables);
+            }
+            else {
+                inventory = this.getInventoryDefaults();
+            }
+            this.setState({
+                inventoryOptions,
+                inventory
+            });
+        }
+        if (this.props.notifications) {
+            if (this.props.notifications[0]) {
+                if (this.props.notifications[0]['type'] === 'error') {
+                    this.setState({ isTimeOut: true });
+                }
+                if (this.props.notifications[0]['type'] === 'info') {
+                    this.setState({ isTimeOut: false });
+                }
+            }
+        }
+        if (prevState.timeElapsed !== this.state.timeElapsed) {
+            if (formattedTime(this.state.timeElapsed) === this.TIMEOUT && !this.state.experience) {
+                const { onError, api } = this.props;
+                const { experienceId } = this.state;
+                api.cancelExperiencePolling()
+                    .then(() => {
+                    onError(copy.runExpError.replace('[expId]', experienceId));
+                    this.resetState(true, () => {
+                        this.setState({ isTimeOut: true });
+                    });
+                });
+            }
+        }
+    }
+    variableInputChanged(key, value) {
+        const inventory = { ...this.state.inventory };
+        inventory[key] = value;
+        this.setState({
+            inventory
+        });
+    }
+    getViewerOptions() {
+        const opts = [];
+        const { experience: { output }, jobId } = this.state;
+        const videos = output.videos;
+        const images = output.images;
+        if (videos) {
+            for (const key in videos) {
+                if (videos.hasOwnProperty(key)) {
+                    const v = {
+                        label: `Video: ${key}`,
+                        value: `${OUTPUT_TYPES.VIDEO}.${key}`
+                    };
+                    opts.push(v);
+                }
+            }
+        }
+        if (images) {
+            for (const key in images) {
+                if (images.hasOwnProperty(key)) {
+                    const i = {
+                        label: `Image: ${key}`,
+                        value: `${OUTPUT_TYPES.IMAGE}.${key}`
+                    };
+                    opts.push(i);
+                }
+            }
+        }
+        if (jobId) {
+            opts.push({
+                label: copy.btnLog,
+                value: `${OUTPUT_TYPES.LOG}.${jobId}`
+            });
+        }
+        return opts;
+    }
+    renderVariableFields() {
+        const { inventory, inventoryOptions } = this.state;
+        const storyInventory = this.props.variables;
+        const fields = [];
+        for (const i in storyInventory) {
+            if (storyInventory.hasOwnProperty(i)) {
+                const inv = storyInventory[i];
+                switch (inv.type.toLowerCase()) {
+                    case VARIABLE_TYPES.TEXT:
+                        fields.push(React.createElement(TextField, { label: inv.name, key: inv.id, value: inventory[inv.id], onChange: (v) => this.variableInputChanged(inv.id, v) }));
+                        break;
+                    case VARIABLE_TYPES.NUMBER:
+                        fields.push(React.createElement(NumberField, { label: inv.name, key: inv.id, value: inventory[inv.id], onChange: (v) => this.variableInputChanged(inv.id, v) }));
+                        break;
+                    case VARIABLE_TYPES.ENUM:
+                        fields.push(React.createElement(SelectField, { label: inv.name, key: inv.id, value: inventory[inv.id], options: inventoryOptions[inv.id], onChange: (v) => this.variableInputChanged(inv.id, v) }));
+                        break;
+                    case VARIABLE_TYPES.BOOLEAN:
+                        fields.push(React.createElement(ButtonGroupField, { label: inv.name, key: inv.id, value: inventory[inv.id], options: BOOLEAN_DEFAULT_OPTIONS, onChange: (v) => this.variableInputChanged(inv.id, v) }));
+                        break;
+                    case VARIABLE_TYPES.IMAGE:
+                        fields.push(React.createElement(FieldWrapper, { label: inv.name, key: inv.id },
+                            React.createElement(MediaVariableField, { value: inventory[inv.id], type: inv.type, onChange: (v) => this.variableInputChanged(inv.id, v) })));
+                        break;
+                    case VARIABLE_TYPES.VIDEO:
+                        fields.push(React.createElement(FieldWrapper, { label: inv.name, key: inv.id },
+                            React.createElement(MediaVariableField, { type: inv.type, value: inventory[inv.id], onChange: (v) => this.variableInputChanged(inv.id, v) })));
+                        break;
+                    case VARIABLE_TYPES.AUDIO:
+                        fields.push(React.createElement(FieldWrapper, { label: inv.name, key: inv.id },
+                            React.createElement(MediaVariableField, { type: inv.type, value: inventory[inv.id], onChange: (v) => this.variableInputChanged(inv.id, v) })));
+                        break;
+                }
+            }
+        }
+        return fields;
+    }
+    getFirstOutput(experience) {
+        const videos = experience.output.videos;
+        const images = experience.output.images;
+        if (videos) {
+            for (const key in videos) {
+                if (videos.hasOwnProperty(key)) {
+                    return `${OUTPUT_TYPES.VIDEO}.${key}`;
+                }
+            }
+        }
+        else if (images) {
+            for (const key in images) {
+                if (images.hasOwnProperty(key)) {
+                    return `${OUTPUT_TYPES.IMAGE}.${key}`;
+                }
+            }
+        }
+        else {
+            return null;
+        }
+    }
+    getExperience(experienceId, triggerJob = false, compositionId, useWorkingCopy) {
+        if (!this.timer.running) {
+            this.timer.start();
+        }
+        const { api, onError, onExperenceLoaded, onJobCreated } = this.props;
+        this.setState({
+            rendering: true
+        }, () => {
+            this.setState({
+                experienceId
+            }, () => {
+                if (triggerJob) {
+                    api.triggerEvent(experienceId, compositionId, useWorkingCopy).then((resTrigger) => {
+                        this.setState({
+                            jobId: resTrigger.job_id
+                        }, () => {
+                            if (onJobCreated) {
+                                onJobCreated(experienceId, resTrigger.job_id);
+                            }
+                            this.evtHandlers.gotExperience = (resVideo) => {
+                                this.timer.stop();
+                                if (onExperenceLoaded) {
+                                    onExperenceLoaded(resVideo);
+                                }
+                                this.setState({
+                                    rendering: false,
+                                    activeOutput: this.getFirstOutput(resVideo),
+                                    experience: resVideo,
+                                });
+                            };
+                            const pollingPromise = api.getExperience(experienceId, true).then((resVideo) => {
+                                if (this.evtHandlers.gotExperience) {
+                                    this.evtHandlers.gotExperience(resVideo);
+                                }
+                            }).catch((e) => {
+                                this.resetState();
+                                if (onError) {
+                                    if (e.error) {
+                                        onError(e.error);
+                                    }
+                                    else {
+                                        onError(copy.runExpError.replace('[expId]', experienceId));
+                                    }
+                                }
+                            });
+                        });
+                    }).catch((e) => {
+                        this.resetState();
+                        if (onError) {
+                            onError(copy.triggerExpError.replace('[expId]', experienceId));
+                        }
+                    });
+                }
+                else {
+                    this.evtHandlers.gotExperience = (resVideo) => {
+                        this.timer.stop();
+                        if (onExperenceLoaded) {
+                            onExperenceLoaded(resVideo);
+                        }
+                        this.setState({
+                            rendering: false,
+                            activeOutput: this.getFirstOutput(resVideo),
+                            experience: resVideo
+                        });
+                    };
+                    api.getExperience(experienceId, true).then((resVideo) => {
+                        if (this.evtHandlers.gotExperience) {
+                            this.evtHandlers.gotExperience(resVideo);
+                        }
+                    }).catch((e) => {
+                        this.resetState();
+                        if (onError) {
+                            if (e.error) {
+                                onError(e.error);
+                            }
+                            else {
+                                onError(copy.runExpError.replace('[expId]', experienceId));
+                            }
+                        }
+                    });
+                }
+            });
+        });
+    }
+    createExperience() {
+        const { storyId, onNotification, onError, api, onExperienceCreated, compositionId, useWorkingCopy } = this.props;
+        this.resetState(false, () => {
+            this.setState({
+                rendering: true,
+                isTimeOut: false,
+            }, () => {
+                this.timer.start();
+                if (onNotification) {
+                    onNotification(copy.runExpStart);
+                }
+                api.createExperience(storyId, this.state.inventory, compositionId, useWorkingCopy).then((resExp) => {
+                    if (onNotification) {
+                        onNotification(copy.expId.replace('[expId]', resExp.id));
+                    }
+                    if (onExperienceCreated) {
+                        onExperienceCreated(resExp);
+                    }
+                    this.getExperience(resExp.id, true, compositionId, useWorkingCopy);
+                }).catch((e) => {
+                    this.resetState();
+                    const { data, status } = e.response;
+                    if (onError) {
+                        if (data && data.error) {
+                            onError(`${copy.createExpError}: ${data.error}`);
+                        }
+                        else {
+                            onError(`${copy.createExpError}: ${e}`);
+                        }
+                    }
+                });
+            });
+        });
+    }
+    resetState(isTimeOut, callback) {
+        this.timer.stop();
+        this.setState({
+            rendering: false,
+            experienceId: null,
+            experience: null,
+            jobId: null,
+            timeElapsed: !isTimeOut ? 0 : this.state.timeElapsed,
+            activeOutput: null,
+            isTimeOut: false,
+        }, () => {
+            if (callback) {
+                callback();
+            }
+        });
+    }
+    renderViewerContent() {
+        const { rendering, experience, timeElapsed, activeOutput, isTimeOut } = this.state;
+        const { api, onError } = this.props;
+        if (rendering) {
+            return React.createElement("div", { className: 'running-prompt' },
+                React.createElement(Spinner, null),
+                React.createElement("br", null),
+                React.createElement("h1", null,
+                    "\u00A0 ",
+                    copy.expRunning),
+                React.createElement("p", null,
+                    copy.time,
+                    "\u00A0",
+                    formattedTime(timeElapsed)));
+        }
+        else if (isTimeOut || isTimeOut === undefined) {
+            return (React.createElement("div", { className: 'running-prompt error-wrapper' },
+                React.createElement("h1", null,
+                    "\u00A0 ",
+                    copy.runExpErrorDes),
+                React.createElement("p", null,
+                    copy.time,
+                    "\u00A0",
+                    formattedTime(timeElapsed))));
+        }
+        else if (experience && activeOutput) {
+            let player;
+            let url;
+            const outputArr = activeOutput.split('.');
+            const type = outputArr[0];
+            const key = outputArr[1];
+            if (type === OUTPUT_TYPES.IMAGE) {
+                url = experience.output.images[key];
+                player = React.createElement(ImagePlayer, { url: url, active: true });
+            }
+            else if (type === OUTPUT_TYPES.VIDEO) {
+                const output = experience.output.videos[key];
+                const mWidth = (output.width !== undefined) ? parseInt(output.width, 10) : null;
+                const mHeight = (output.height !== undefined) ? parseInt(output.height, 10) : null;
+                url = output.url;
+                player = React.createElement(VideoPlayer, { url: url, active: true, maxWidth: mWidth, allowManualScale: true, maxHeight: mHeight });
+            }
+            else if (type === OUTPUT_TYPES.LOG) {
+                player = React.createElement("div", { className: 'log' },
+                    React.createElement(LogViewer, { api: api, onError: onError, jobId: key }));
+            }
+            return React.createElement(ReactResizeDetector, { handleWidth: true, handleHeight: true }, player);
+        }
+        return null;
+    }
+    toggleActiveOutput(e) {
+        this.setState({
+            activeOutput: e
+        });
+    }
+    render() {
+        const { rendering, experience, activeOutput } = this.state;
+        const renderCopy = (experience) ? copy.btnReRender : copy.btnRender;
+        const btnRender = (!rendering) ?
+            React.createElement(Button, { size: 'large', onClick: this.evtHandlers.createExp, color: 'primary', style: 'bold' }, renderCopy) : null;
+        let viewerButtons;
+        let expIdField;
+        if (experience) {
+            const viewerOpts = this.getViewerOptions();
+            viewerButtons = React.createElement(SelectField, { width: '130px', options: viewerOpts, value: activeOutput, onChange: this.evtHandlers.toggleOutput });
+            expIdField = React.createElement(TextField, { readOnly: true, width: '360px', label: copy.expIdField, showCopy: true, value: experience.id });
+        }
+        return React.createElement("div", { className: 'story-viewer viewer' },
+            React.createElement("div", { className: 'variables' },
+                React.createElement("h2", null, copy.previewVars),
+                React.createElement(HRule, null),
+                this.renderVariableFields()),
+            React.createElement("div", { className: 'viewer-content' },
+                React.createElement("div", { className: 'content-header' },
+                    btnRender,
+                    React.createElement("div", { className: 'output' }, viewerButtons),
+                    React.createElement("div", { className: 'right-interface' }, expIdField)),
+                React.createElement("div", { className: 'content-wrapper' }, this.renderViewerContent())));
+    }
+}
+const mapStateToProps = (state) => {
+    return { notifications: state.notifications };
+};
+export default connect(mapStateToProps, {})(StoryPreviewer);
+//# sourceMappingURL=StoryPreviewer.js.map

package/dist/esm/components/story-previewer/StoryPreviewer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StoryPreviewer.js","sourceRoot":"","sources":["../../../../src/components/story-previewer/StoryPreviewer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,cAAc,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;AACpF,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,SAAS,MAAM,yBAAyB,CAAC;AAChD,OAAO,MAAM,MAAM,kBAAkB,CAAC;AACtC,OAAO,OAAO,MAAM,oBAAoB,CAAC;AACzC,OAAO,WAAW,MAAM,6BAA6B,CAAC;AACtD,OAAO,WAAW,MAAM,6BAA6B,CAAC;AACtD,OAAO,gBAAgB,MAAM,wCAAwC,CAAC;AACtE,OAAO,YAAY,MAAM,+BAA+B,CAAC;AACzD,OAAO,KAAK,MAAM,iBAAiB,CAAC;AACpC,OAAO,WAAW,MAAM,wBAAwB,CAAC;AACjD,OAAO,WAAW,MAAM,wBAAwB,CAAC;AAEjD,OAAO,kBAAkB,MAAM,4CAA4C,CAAC;AAE5E,OAAO,mBAAmB,MAAM,uBAAuB,CAAC;AACxD,OAAO,EAAE,SAAS,IAAI,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAEzD,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAC3C,OAAO,KAAK,MAAM,sBAAsB,CAAC;AACzC,OAAO,SAAS,MAAM,yBAAyB,CAAC;AAChD,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AA8BtC,MAAM,cAAe,SAAQ,KAAK,CAAC,aAAyD;IAEhF,KAAK,CAAS;IACd,WAAW,CAAO;IAClB,OAAO,GAAY,OAAO,CAAC;IACnC,YAAY,KAAK;QAEb,KAAK,CAAC,KAAK,CAAC,CAAC;QAEb,MAAM,SAAS,GAAG,IAAI,CAAC,oBAAoB,EAAE,CAAC;QAC9C,MAAM,gBAAgB,GAAG,IAAI,CAAC,mBAAmB,EAAE,CAAC;QAEpD,IAAI,CAAC,KAAK,GAAG;YACT,SAAS;YACT,gBAAgB;YAChB,YAAY,EAAE,IAAI;YAClB,KAAK,EAAE,IAAI;YACX,UAAU,EAAE,IAAI;YAChB,WAAW,EAAE,CAAC;YACd,YAAY,EAAE,EAAE;YAChB,SAAS,EAAE,KAAK;YAChB,SAAS,EAAE,KAAK;SACnB,CAAC;QAEF,IAAI,CAAC,KAAK,GAAG,IAAI,KAAK,CAAC;YACnB,QAAQ,EAAE,IAAI;YACd,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE;gBACZ,IAAI,CAAC,QAAQ,CAAC,EAAC,WAAW,EAAE,CAAC,EAAC,CAAC,CAAC;YACpC,CAAC;SACJ,CAAC,CAAC;QAEH,IAAI,CAAC,WAAW,GAAG;YACf,YAAY,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC,CAAC;YAC/C,SAAS,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,gBAAgB,EAAE;YACxC,aAAa,EAAE,IAAI;SACtB,CAAC;IACN,CAAC;IAEM,oBAAoB;QACvB,MAAM,EAAC,GAAG,EAAE,OAAO,EAAC,GAAG,IAAI,CAAC,KAAK,CAAC;QAClC,MAAM,EAAC,YAAY,EAAC,GAAG,IAAI,CAAC,KAAK,CAAC;QAElC,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;QAElB,IAAI,CAAC,WAAW,CAAC,aAAa,GAAG,IAAI,CAAC;QACtC,GAAG,CAAC,uBAAuB,EAAE,CAAC;IAClC,CAAC;IAEO,mBAAmB;QAEvB,MAAM,EAAC,SAAS,EAAC,GAAG,IAAI,CAAC,KAAK,CAAC;QAC/B,MAAM,OAAO,GAAG,EAAE,CAAC;QAEnB,KAAK,MAAM,CAAC,IAAI,SAAS,EAAE;YACvB,IAAI,SAAS,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE;gBAC7B,MAAM,GAAG,GAAG,SAAS,CAAC,CAAC,CAAC,CAAC;gBACzB,IAAI,GAAG,CAAC,WAAW,IAAI,GAAG,CAAC,WAAW,CAAC,IAAI,EAAE;oBACzC,IAAI,GAAG,CAAC,WAAW,CAAC,IAAI,CAAC,WAAW,EAAE,KAAK,cAAc,CAAC,IAAI,EAAE;wBAC5D,OAAO,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,GAAG,CAAC,WAAW,CAAC,OAAO,CAAC;qBAC7C;iBACJ;aACJ;SACJ;QAED,OAAO,OAAO,CAAC;IACnB,CAAC;IAEO,oBAAoB;QAExB,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QACjC,MAAM,MAAM,GAAG,EAAE,CAAC;QAElB,KAAK,MAAM,CAAC,IAAI,SAAS,EAAE;YACvB,IAAI,SAAS,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE;gBAC7B,MAAM,GAAG,GAAG,SAAS,CAAC,CAAC,CAAC,CAAC;gBACzB,MAAM,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,gBAAgB,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;aAC3D;SACJ;QAED,OAAO,MAAM,CAAC;IAClB,CAAC;IAEO,sBAAsB,CAAC,aAAa;QAExC,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QACjC,MAAM,MAAM,GAAG,EAAC,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,EAAC,CAAC;QAEzC,KAAK,MAAM,CAAC,IAAI,SAAS,EAAE;YACvB,IAAI,SAAS,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE;gBAE7B,MAAM,MAAM,GAAG,SAAS,CAAC,CAAC,CAAC,CAAC;gBAC5B,MAAM,OAAO,GAAG,aAAa,CAAC,CAAC,CAAC,CAAC;gBAEjC,IAAI,OAAO,EAAE;oBAET,MAAM,SAAS,GAAG,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC,WAAW,CAAC,CAAC;oBAC7D,MAAM,QAAQ,GAAG,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC;oBAE3D,IAAI,MAAM,CAAC,IAAI,KAAK,OAAO,CAAC,IAAI,IAAI,SAAS,KAAK,QAAQ,EAAE;wBACxD,MAAM,CAAC,CAAC,CAAC,GAAG,QAAQ,CAAC;qBACxB;iBACJ;aACJ;SACJ;QAED,OAAO,MAAM,CAAC;IAClB,CAAC;IAEO,gBAAgB,CAAC,WAAW;QAEhC,IAAI,WAAW,IAAI,WAAW,CAAC,IAAI,EAAE;YAEjC,MAAM,IAAI,GAAG,WAAW,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC;YAE5C,IAAI,IAAI,KAAK,cAAc,CAAC,KAAK,IAAI,IAAI,KAAK,cAAc,CAAC,KAAK,IAAI,IAAI,KAAK,cAAc,CAAC,KAAK,EAAE;gBACjG,OAAO,WAAW,CAAC,GAAG,CAAC;aAC1B;iBAAM;gBACH,OAAO,WAAW,CAAC,GAAG,CAAC;aAC1B;SACJ;aAAM;YACH,OAAO,SAAS,CAAC;SACpB;IACL,CAAC;IAEM,iBAAiB;QAEpB,iFAAiF;QACjF,MAAM,EAAE,YAAY,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QAC3C,IAAI,YAAY,IAAI,KAAK,EAAE;YAEvB,IAAI,CAAC,QAAQ,CAAC;gBACV,KAAK;aACR,EAAE,GAAG,EAAE;gBACJ,IAAI,CAAC,aAAa,CAAC,YAAY,CAAC,CAAC;YACrC,CAAC,CAAC,CAAC;SACN;IACL,CAAC;IAEM,kBAAkB,CAAC,SAAS,EAAE,SAAS;QAE1C,IAAI,SAAS,CAAC,OAAO,KAAK,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE;YAC1C,IAAI,CAAC,WAAW,CAAC,aAAa,GAAG,IAAI,CAAC;SACzC;QAED,IAAI,SAAS,CAAC,SAAS,KAAK,IAAI,CAAC,KAAK,CAAC,SAAS,EAAE;YAE9C,IAAI,SAAS,CAAC;YACd,MAAM,gBAAgB,GAAG,IAAI,CAAC,mBAAmB,EAAE,CAAC;YAEpD,IAAI,SAAS,CAAC,OAAO,KAAK,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE;gBAC1C,SAAS,GAAG,IAAI,CAAC,sBAAsB,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC;aAChE;iBAAM;gBACH,SAAS,GAAG,IAAI,CAAC,oBAAoB,EAAE,CAAC;aAC3C;YAED,IAAI,CAAC,QAAQ,CAAC;gBACV,gBAAgB;gBAChB,SAAS;aACZ,CAAC,CAAC;SACN;QAED,IAAI,IAAI,CAAC,KAAK,CAAC,aAAa,EAAE;YAC1B,IAAI,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,EAAE;gBAC7B,IAAI,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,OAAO,EAAE;oBACjD,IAAI,CAAC,QAAQ,CAAC,EAAC,SAAS,EAAE,IAAI,EAAC,CAAC,CAAC;iBACpC;gBAED,IAAI,IAAI,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,MAAM,EAAE;oBAChD,IAAI,CAAC,QAAQ,CAAC,EAAC,SAAS,EAAE,KAAK,EAAC,CAAC,CAAC;iBACrC;aACJ;SACJ;QAED,IAAI,SAAS,CAAC,WAAW,KAAK,IAAI,CAAC,KAAK,CAAC,WAAW,EAAE;YAClD,IAAI,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE;gBAElF,MAAM,EAAC,OAAO,EAAE,GAAG,EAAC,GAAG,IAAI,CAAC,KAAK,CAAC;gBAClC,MAAM,EAAC,YAAY,EAAC,GAAG,IAAI,CAAC,KAAK,CAAC;gBAElC,GAAG,CAAC,uBAAuB,EAAE;qBACxB,IAAI,CAAC,GAAG,EAAE;oBAEP,OAAO,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,SAAS,EAAE,YAAY,CAAC,CAAC,CAAC;oBAE3D,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,GAAG,EAAE;wBACvB,IAAI,CAAC,QAAQ,CAAC,EAAC,SAAS,EAAE,IAAI,EAAC,CAAC,CAAC;oBACrC,CAAC,CAAC,CAAC;gBAEP,CAAC,CAAC,CAAC;aACV;SACJ;IACL,CAAC;IAEO,oBAAoB,CAAC,GAAG,EAAE,KAAK;QAEnC,MAAM,SAAS,GAAG,EAAC,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,EAAC,CAAC;QAC5C,SAAS,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;QAEvB,IAAI,CAAC,QAAQ,CAAC;YACV,SAAS;SACZ,CAAC,CAAC;IACP,CAAC;IAEO,gBAAgB;QAEpB,MAAM,IAAI,GAAG,EAAE,CAAC;QAEhB,MAAM,EAAC,UAAU,EAAE,EAAC,MAAM,EAAC,EAAE,KAAK,EAAC,GAAG,IAAI,CAAC,KAAK,CAAC;QACjD,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC;QAC7B,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC;QAE7B,IAAI,MAAM,EAAE;YACR,KAAK,MAAM,GAAG,IAAI,MAAM,EAAE;gBACtB,IAAI,MAAM,CAAC,cAAc,CAAC,GAAG,CAAC,EAAE;oBAE5B,MAAM,CAAC,GAAG;wBACN,KAAK,EAAE,UAAU,GAAG,EAAE;wBACtB,KAAK,EAAE,GAAG,YAAY,CAAC,KAAK,IAAI,GAAG,EAAE;qBACxC,CAAC;oBACF,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;iBAChB;aACJ;SACJ;QAED,IAAI,MAAM,EAAE;YACR,KAAK,MAAM,GAAG,IAAI,MAAM,EAAE;gBACtB,IAAI,MAAM,CAAC,cAAc,CAAC,GAAG,CAAC,EAAE;oBAE5B,MAAM,CAAC,GAAG;wBACN,KAAK,EAAE,UAAU,GAAG,EAAE;wBACtB,KAAK,EAAE,GAAG,YAAY,CAAC,KAAK,IAAI,GAAG,EAAE;qBACxC,CAAC;oBACF,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;iBAChB;aACJ;SACJ;QAED,IAAI,KAAK,EAAE;YAEP,IAAI,CAAC,IAAI,CAAC;gBACN,KAAK,EAAE,IAAI,CAAC,MAAM;gBAClB,KAAK,EAAE,GAAG,YAAY,CAAC,GAAG,IAAI,KAAK,EAAE;aACxC,CAAC,CAAC;SACN;QAED,OAAO,IAAI,CAAC;IAChB,CAAC;IAEO,oBAAoB;QAExB,MAAM,EAAE,SAAS,EAAE,gBAAgB,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QACnD,MAAM,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC;QAC5C,MAAM,MAAM,GAAG,EAAE,CAAC;QAElB,KAAK,MAAM,CAAC,IAAI,cAAc,EAAE;YAC5B,IAAI,cAAc,CAAC,cAAc,CAAC,CAAC,CAAC,EAAE;gBAClC,MAAM,GAAG,GAAG,cAAc,CAAC,CAAC,CAAC,CAAC;gBAE9B,QAAQ,GAAG,CAAC,IAAI,CAAC,WAAW,EAAE,EAAE;oBAE5B,KAAK,cAAc,CAAC,IAAI;wBACpB,MAAM,CAAC,IAAI,CAAC,oBAAC,SAAS,IAClB,KAAK,EAAI,GAAG,CAAC,IAAI,EACjB,GAAG,EAAI,GAAG,CAAC,EAAE,EACb,KAAK,EAAI,SAAS,CAAC,GAAG,CAAC,EAAE,CAAC,EAC1B,QAAQ,EAAI,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,oBAAoB,CAAC,GAAG,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC;wBAChE,MAAM;oBACV,KAAK,cAAc,CAAC,MAAM;wBACtB,MAAM,CAAC,IAAI,CAAC,oBAAC,WAAW,IACpB,KAAK,EAAI,GAAG,CAAC,IAAI,EACjB,GAAG,EAAI,GAAG,CAAC,EAAE,EACb,KAAK,EAAI,SAAS,CAAC,GAAG,CAAC,EAAE,CAAC,EAC1B,QAAQ,EAAI,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,oBAAoB,CAAC,GAAG,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC;wBAChE,MAAM;oBACV,KAAK,cAAc,CAAC,IAAI;wBACpB,MAAM,CAAC,IAAI,CAAC,oBAAC,WAAW,IACpB,KAAK,EAAI,GAAG,CAAC,IAAI,EACjB,GAAG,EAAI,GAAG,CAAC,EAAE,EACb,KAAK,EAAI,SAAS,CAAC,GAAG,CAAC,EAAE,CAAC,EAC1B,OAAO,EAAI,gBAAgB,CAAC,GAAG,CAAC,EAAE,CAAC,EACnC,QAAQ,EAAI,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,oBAAoB,CAAC,GAAG,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC;wBAChE,MAAM;oBACV,KAAK,cAAc,CAAC,OAAO;wBACvB,MAAM,CAAC,IAAI,CAAC,oBAAC,gBAAgB,IACzB,KAAK,EAAI,GAAG,CAAC,IAAI,EACjB,GAAG,EAAI,GAAG,CAAC,EAAE,EACb,KAAK,EAAI,SAAS,CAAC,GAAG,CAAC,EAAE,CAAC,EAC1B,OAAO,EAAK,uBAAuB,EACnC,QAAQ,EAAI,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,oBAAoB,CAAC,GAAG,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC;wBAChE,MAAM;oBACV,KAAK,cAAc,CAAC,KAAK;wBACrB,MAAM,CAAC,IAAI,CAAC,oBAAC,YAAY,IAAC,KAAK,EAAI,GAAG,CAAC,IAAI,EAAE,GAAG,EAAI,GAAG,CAAC,EAAE;4BACtD,oBAAC,kBAAkB,IACf,KAAK,EAAI,SAAS,CAAC,GAAG,CAAC,EAAE,CAAC,EAC1B,IAAI,EAAI,GAAG,CAAC,IAAI,EAChB,QAAQ,EAAI,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,oBAAoB,CAAC,GAAG,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAC/C,CAAC,CAAC;wBACrB,MAAM;oBACV,KAAK,cAAc,CAAC,KAAK;wBACrB,MAAM,CAAC,IAAI,CAAC,oBAAC,YAAY,IAAC,KAAK,EAAI,GAAG,CAAC,IAAI,EAAE,GAAG,EAAI,GAAG,CAAC,EAAE;4BACtD,oBAAC,kBAAkB,IACf,IAAI,EAAI,GAAG,CAAC,IAAI,EAChB,KAAK,EAAI,SAAS,CAAC,GAAG,CAAC,EAAE,CAAC,EAC1B,QAAQ,EAAI,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,oBAAoB,CAAC,GAAG,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAC/C,CAAC,CAAC;wBACrB,MAAM;oBACV,KAAK,cAAc,CAAC,KAAK;wBACrB,MAAM,CAAC,IAAI,CAAC,oBAAC,YAAY,IAAC,KAAK,EAAI,GAAG,CAAC,IAAI,EAAE,GAAG,EAAI,GAAG,CAAC,EAAE;4BACtD,oBAAC,kBAAkB,IACf,IAAI,EAAI,GAAG,CAAC,IAAI,EAChB,KAAK,EAAI,SAAS,CAAC,GAAG,CAAC,EAAE,CAAC,EAC1B,QAAQ,EAAI,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,oBAAoB,CAAC,GAAG,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAC/C,CAAC,CAAC;wBACrB,MAAM;iBACb;aACJ;SACJ;QAED,OAAO,MAAM,CAAC;IAClB,CAAC;IAEO,cAAc,CAAC,UAAwB;QAE3C,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC,MAAM,CAAC;QACxC,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC,MAAM,CAAC;QACxC,IAAI,MAAM,EAAE;YACR,KAAK,MAAM,GAAG,IAAI,MAAM,EAAE;gBACtB,IAAI,MAAM,CAAC,cAAc,CAAC,GAAG,CAAC,EAAE;oBAC5B,OAAO,GAAG,YAAY,CAAC,KAAK,IAAI,GAAG,EAAE,CAAC;iBACzC;aACJ;SACJ;aAAM,IAAI,MAAM,EAAE;YACf,KAAK,MAAM,GAAG,IAAI,MAAM,EAAE;gBACtB,IAAI,MAAM,CAAC,cAAc,CAAC,GAAG,CAAC,EAAE;oBAC5B,OAAO,GAAG,YAAY,CAAC,KAAK,IAAI,GAAG,EAAE,CAAC;iBACzC;aACJ;SACJ;aAAM;YACH,OAAO,IAAI,CAAC;SACf;IACL,CAAC;IAEO,aAAa,CAAC,YAAY,EAAE,UAAU,GAAG,KAAK,EAAE,aAAwB,EAAE,cAAyB;QAEvG,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE;YACrB,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;SACtB;QAED,MAAM,EAAE,GAAG,EAAE,OAAO,EAAE,iBAAiB,EAAE,YAAY,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QACrE,IAAI,CAAC,QAAQ,CAAC;YACV,SAAS,EAAE,IAAI;SAClB,EAAE,GAAG,EAAE;YAEJ,IAAI,CAAC,QAAQ,CAAC;gBACV,YAAY;aACf,EAAE,GAAG,EAAE;gBAEJ,IAAI,UAAU,EAAE;oBACZ,GAAG,CAAC,YAAY,CAAC,YAAY,EAAE,aAAa,EAAE,cAAc,CAAC,CAAC,IAAI,CAAC,CAAC,UAAU,EAAE,EAAE;wBAElF,IAAI,CAAC,QAAQ,CAAC;4BACV,KAAK,EAAE,UAAU,CAAC,MAAM;yBAC3B,EAAE,GAAG,EAAE;4BAEJ,IAAI,YAAY,EAAE;gCACd,YAAY,CAAC,YAAY,EAAE,UAAU,CAAC,MAAM,CAAC,CAAC;6BACjD;4BAED,IAAI,CAAC,WAAW,CAAC,aAAa,GAAG,CAAC,QAAQ,EAAE,EAAE;gCAE1C,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;gCAElB,IAAI,iBAAiB,EAAE;oCACnB,iBAAiB,CAAC,QAAQ,CAAC,CAAC;iCAC/B;gCAED,IAAI,CAAC,QAAQ,CAAC;oCACV,SAAS,EAAE,KAAK;oCAChB,YAAY,EAAE,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC;oCAC3C,UAAU,EAAE,QAAQ;iCACvB,CAAC,CAAC;4BACP,CAAC,CAAC;4BAEF,MAAM,cAAc,GAAG,GAAG,CAAC,aAAa,CAAC,YAAY,EAAE,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,QAAQ,EAAE,EAAE;gCAE3E,IAAI,IAAI,CAAC,WAAW,CAAC,aAAa,EAAE;oCAChC,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;iCAC5C;4BAEL,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,EAAE;gCACX,IAAI,CAAC,UAAU,EAAE,CAAC;gCAClB,IAAI,OAAO,EAAE;oCACT,IAAI,CAAC,CAAC,KAAK,EAAE;wCACX,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;qCAClB;yCAAM;wCACH,OAAO,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,SAAS,EAAE,YAAY,CAAC,CAAC,CAAC;qCAC9D;iCACJ;4BACL,CAAC,CAAC,CAAC;wBAEP,CAAC,CAAC,CAAC;oBACP,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,EAAE;wBACX,IAAI,CAAC,UAAU,EAAE,CAAC;wBAClB,IAAI,OAAO,EAAE;4BACT,OAAO,CAAC,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,SAAS,EAAE,YAAY,CAAC,CAAC,CAAC;yBAClE;oBACL,CAAC,CAAC,CAAC;iBACF;qBAAM;oBAEH,IAAI,CAAC,WAAW,CAAC,aAAa,GAAG,CAAC,QAAQ,EAAE,EAAE;wBAC1C,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;wBAElB,IAAI,iBAAiB,EAAE;4BACnB,iBAAiB,CAAC,QAAQ,CAAC,CAAC;yBAC/B;wBAED,IAAI,CAAC,QAAQ,CAAC;4BACV,SAAS,EAAE,KAAK;4BAChB,YAAY,EAAE,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC;4BAC3C,UAAU,EAAE,QAAQ;yBACvB,CAAC,CAAC;oBACP,CAAC,CAAC;oBAEF,GAAG,CAAC,aAAa,CAAC,YAAY,EAAE,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,QAAQ,EAAE,EAAE;wBACpD,IAAI,IAAI,CAAC,WAAW,CAAC,aAAa,EAAE;4BAChC,IAAI,CAAC,WAAW,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;yBAC5C;oBAEL,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,EAAE;wBACX,IAAI,CAAC,UAAU,EAAE,CAAC;wBAClB,IAAI,OAAO,EAAE;4BACX,IAAI,CAAC,CAAC,KAAK,EAAE;gCACX,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC;6BAClB;iCAAM;gCACH,OAAO,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,SAAS,EAAE,YAAY,CAAC,CAAC,CAAC;6BAC9D;yBACF;oBACL,CAAC,CAAC,CAAC;iBACN;YACL,CAAC,CAAC,CAAC;QACP,CAAC,CAAC,CAAC;IACP,CAAC;IAEO,gBAAgB;QAEpB,MAAM,EAAC,OAAO,EAAE,cAAc,EAAE,OAAO,EAAE,GAAG,EAAE,mBAAmB,EAAE,aAAa,EAAE,cAAc,EAAC,GAAG,IAAI,CAAC,KAAK,CAAC;QAE/G,IAAI,CAAC,UAAU,CAAC,KAAK,EAAE,GAAG,EAAE;YACxB,IAAI,CAAC,QAAQ,CAAC;gBACV,SAAS,EAAE,IAAI;gBACf,SAAS,EAAE,KAAK;aACnB,EAAE,GAAG,EAAE;gBAEJ,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAC;gBACnB,IAAI,cAAc,EAAE;oBAChB,cAAc,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;iBACpC;gBACD,GAAG,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,EAAE,aAAa,EAAE,cAAc,CAAC,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE;oBAE/F,IAAI,cAAc,EAAE;wBAChB,cAAc,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,SAAS,EAAE,MAAM,CAAC,EAAE,CAAC,CAAC,CAAC;qBAC5D;oBAED,IAAI,mBAAmB,EAAE;wBACrB,mBAAmB,CAAC,MAAM,CAAC,CAAC;qBAC/B;oBAED,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,EAAE,EAAE,IAAI,EAAE,aAAa,EAAE,cAAc,CAAC,CAAC;gBAEvE,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,EAAE;oBACX,IAAI,CAAC,UAAU,EAAE,CAAC;oBAClB,MAAM,EAAC,IAAI,EAAE,MAAM,EAAC,GAAG,CAAC,CAAC,QAAQ,CAAC;oBAClC,IAAI,OAAO,EAAE;wBACT,IAAI,IAAI,IAAI,IAAI,CAAC,KAAK,EAAE;4BACpB,OAAO,CAAC,GAAG,IAAI,CAAC,cAAc,KAAK,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC;yBACpD;6BAAM;4BACH,OAAO,CAAC,GAAG,IAAI,CAAC,cAAc,KAAK,CAAC,EAAE,CAAC,CAAC;yBAC3C;qBACJ;gBACL,CAAC,CAAC,CAAC;YACP,CAAC,CAAC,CAAC;QACP,CAAC,CAAC,CAAC;IACP,CAAC;IAEO,UAAU,CAAC,SAAoB,EAAE,QAAS;QAC9C,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;QAClB,IAAI,CAAC,QAAQ,CAAC;YACV,SAAS,EAAE,KAAK;YAChB,YAAY,EAAE,IAAI;YAClB,UAAU,EAAE,IAAI;YAChB,KAAK,EAAE,IAAI;YACX,WAAW,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW;YACpD,YAAY,EAAE,IAAI;YAClB,SAAS,EAAE,KAAK;SACnB,EAAE,GAAG,EAAE;YACJ,IAAI,QAAQ,EAAE;gBACV,QAAQ,EAAE,CAAC;aACd;QACL,CAAC,CAAC,CAAC;IACP,CAAC;IAEO,mBAAmB;QAEvB,MAAM,EAAC,SAAS,EAAE,UAAU,EAAE,WAAW,EAAE,YAAY,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QAElF,MAAM,EAAE,GAAG,EAAE,OAAO,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QAEpC,IAAI,SAAS,EAAE;YACX,OAAO,6BAAK,SAAS,EAAG,gBAAgB;gBACpC,oBAAC,OAAO,OAAE;gBAAA,+BAAK;gBACf;;oBAAY,IAAI,CAAC,UAAU,CAAO;gBAClC;oBAAI,IAAI,CAAC,IAAI;;oBAAQ,aAAa,CAAC,WAAW,CAAC,CAAK,CAClD,CAAC;SACV;aAAM,IAAI,SAAS,IAAI,SAAS,KAAK,SAAS,EAAE;YAC7C,OAAQ,CACJ,6BAAK,SAAS,EAAG,8BAA8B;gBAC3C;;oBAAY,IAAI,CAAC,cAAc,CAAM;gBACrC;oBAAI,IAAI,CAAC,IAAI;;oBAAQ,aAAa,CAAC,WAAW,CAAC,CAAK,CAClD,CACT,CAAC;SACL;aAAM,IAAI,UAAU,IAAI,YAAY,EAAE;YAEnC,IAAI,MAAM,CAAC;YACX,IAAI,GAAG,CAAC;YACR,MAAM,SAAS,GAAG,YAAY,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;YAC1C,MAAM,IAAI,GAAG,SAAS,CAAC,CAAC,CAAC,CAAC;YAC1B,MAAM,GAAG,GAAG,SAAS,CAAC,CAAC,CAAC,CAAC;YAEzB,IAAI,IAAI,KAAK,YAAY,CAAC,KAAK,EAAE;gBAC7B,GAAG,GAAG,UAAU,CAAC,MAAM,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC;gBACpC,MAAM,GAAG,oBAAC,WAAW,IAAC,GAAG,EAAI,GAAG,EAAE,MAAM,EAAI,IAAI,GAAG,CAAC;aACvD;iBAAM,IAAI,IAAI,KAAK,YAAY,CAAC,KAAK,EAAE;gBACpC,MAAM,MAAM,GAAS,UAAU,CAAC,MAAM,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC;gBACnD,MAAM,MAAM,GAAG,CAAC,MAAM,CAAC,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,MAAM,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;gBAChF,MAAM,OAAO,GAAG,CAAC,MAAM,CAAC,MAAM,KAAK,SAAS,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;gBACnF,GAAG,GAAG,MAAM,CAAC,GAAG,CAAC;gBAEjB,MAAM,GAAG,oBAAC,WAAW,IACjB,GAAG,EAAI,GAAG,EACV,MAAM,EAAI,IAAI,EACd,QAAQ,EAAI,MAAM,EAClB,gBAAgB,EAAI,IAAI,EACxB,SAAS,EAAI,OAAO,GAAI,CAAC;aAChC;iBAAM,IAAI,IAAI,KAAK,YAAY,CAAC,GAAG,EAAE;gBAClC,MAAM,GAAG,6BAAK,SAAS,EAAG,KAAK;oBAAC,oBAAC,SAAS,IACtC,GAAG,EAAK,GAAG,EACX,OAAO,EAAI,OAAO,EAClB,KAAK,EAAI,GAAG,GAAG,CACb,CAAC;aACV;YAED,OAAO,oBAAC,mBAAmB,IAAC,WAAW,QAAC,YAAY,UAC/C,MAAM,CACW,CAAC;SAC1B;QAED,OAAO,IAAI,CAAC;IAChB,CAAC;IAEO,kBAAkB,CAAC,CAAC;QAExB,IAAI,CAAC,QAAQ,CAAC;YACV,YAAY,EAAE,CAAC;SAClB,CAAC,CAAC;IACP,CAAC;IAEM,MAAM;QAET,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,YAAY,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QAC3D,MAAM,UAAU,GAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC;QACrE,MAAM,SAAS,GAAG,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC;YAC5B,oBAAC,MAAM,IACH,IAAI,EAAG,OAAO,EACd,OAAO,EAAI,IAAI,CAAC,WAAW,CAAC,SAAS,EACrC,KAAK,EAAG,SAAS,EACjB,KAAK,EAAI,MAAM,IAAE,UAAU,CACtB,CAAC,CAAC,CAAC,IAAI,CAAC;QAErB,IAAI,aAAa,CAAC;QAClB,IAAI,UAAU,CAAC;QAEf,IAAI,UAAU,EAAE;YACZ,MAAM,UAAU,GAAG,IAAI,CAAC,gBAAgB,EAAE,CAAC;YAC3C,aAAa,GAAG,oBAAC,WAAW,IACxB,KAAK,EAAG,OAAO,EACf,OAAO,EAAI,UAAU,EACrB,KAAK,EAAI,YAAY,EACrB,QAAQ,EAAI,IAAI,CAAC,WAAW,CAAC,YAAY,GAAG,CAAC;YACjD,UAAU,GAAG,oBAAC,SAAS,IACnB,QAAQ,EAAI,IAAI,EAChB,KAAK,EAAG,OAAO,EACf,KAAK,EAAI,IAAI,CAAC,UAAU,EACxB,QAAQ,EAAI,IAAI,EAChB,KAAK,EAAI,UAAU,CAAC,EAAE,GAAG,CAAC;SACjC;QAED,OAAO,6BAAK,SAAS,EAAG,qBAAqB;YACzC,6BAAK,SAAS,EAAG,WAAW;gBACxB,gCAAK,IAAI,CAAC,WAAW,CAAM;gBAC3B,oBAAC,KAAK,OAAE;gBACP,IAAI,CAAC,oBAAoB,EAAE,CAC1B;YACN,6BAAK,SAAS,EAAG,gBAAgB;gBAC7B,6BAAK,SAAS,EAAG,gBAAgB;oBAC5B,SAAS;oBACV,6BAAK,SAAS,EAAG,QAAQ,IACpB,aAAa,CACZ;oBACN,6BAAK,SAAS,EAAG,iBAAiB,IAC7B,UAAU,CACT,CACJ;gBACN,6BAAK,SAAS,EAAG,iBAAiB,IAC7B,IAAI,CAAC,mBAAmB,EAAE,CACzB,CACJ,CACJ,CAAC;IACX,CAAC;CACJ;AACD,MAAM,eAAe,GAAG,CAAC,KAAK,EAAQ,EAAE;IACpC,OAAO,EAAC,aAAa,EAAG,KAAK,CAAC,aAAa,EAAC,CAAC;AACjD,CAAC,CAAC;AAEF,eAAe,OAAO,CAAC,eAAe,EAAE,EAAE,CAAC,CAAC,cAAc,CAAC,CAAC"}

package/dist/esm/components/tabs/Tabs.d.ts

@@ -0,0 +1,13 @@
+import * as React from 'react';
+export interface ITab {
+    content?: any;
+    key?: string;
+    canClose?: boolean;
+    resize?: boolean;
+    label: any;
+    menuButtons?: JSX.Element;
+}
+declare const _default: React.ForwardRefExoticComponent<Pick<Omit<Omit<Omit<any, "targetRef"> & {
+    targetRef?: any;
+}, "width">, "height">, string | number | symbol> & React.RefAttributes<HTMLElement>>;
+export default _default;

package/dist/esm/components/tabs/Tabs.js

@@ -0,0 +1,131 @@
+import * as React from 'react';
+import { withResizeDetector } from 'react-resize-detector';
+import ButtonMenu from '../button-menu/ButtonMenu';
+import ButtonMenuItem from '../button-menu/ButtonMenuItem';
+import Button from '../button/Button';
+import { ICON_TIMES, ICON_BARS } from '../../constants/icons';
+class Tabs extends React.PureComponent {
+    headerRef;
+    constructor(props) {
+        super(props);
+        this.headerRef = React.createRef();
+        this.state = {
+            allowableTabsInView: 0,
+            isMenuOpen: false,
+        };
+    }
+    componentDidMount() {
+        // Count how many tabs fit into parent element and round down
+        const allowableTabsInView = Math.floor(this.allowableNumOfTabs());
+        this.setState({ allowableTabsInView });
+    }
+    componentDidUpdate(prevprops) {
+        // Count how many tabs fit into parent element and round down
+        const allowableTabsInView = Math.floor(this.allowableNumOfTabs());
+        this.setState({ allowableTabsInView });
+    }
+    // Calculate number of tabs to allow before moving them to the burger menu
+    allowableNumOfTabs() {
+        const { options, tabPadding } = this.props;
+        let totalTabWidths = 0;
+        const container = this.headerRef.current;
+        if (container) {
+            const contentWidth = container.offsetWidth;
+            for (let i = 0; i < options.length; i++) {
+                const option = options[i];
+                const buttonWidth = option.canClose || option.menuButtons ? 20 : 0;
+                let div = document.createElement('div');
+                div.className = 'tab-header-option';
+                div.innerHTML = option.label;
+                container.appendChild(div);
+                totalTabWidths += div.offsetWidth + buttonWidth;
+                container.removeChild(div);
+                div = null;
+                if (totalTabWidths >= contentWidth - tabPadding - 25) {
+                    return i;
+                }
+            }
+            return options.length;
+        }
+    }
+    renderContent() {
+        const { options, activeTab, keepMounted, width, height } = this.props;
+        if (keepMounted) {
+            const contentArray = [];
+            for (const option of options) {
+                const active = (option.key === activeTab);
+                const content = React.cloneElement(option.content, {
+                    active,
+                    width,
+                    height
+                });
+                contentArray.push(content);
+            }
+            if (contentArray.length > 0) {
+                return contentArray;
+            }
+            else {
+                return null;
+            }
+        }
+        else {
+            for (const option of options) {
+                if (option.key === activeTab || !activeTab) {
+                    return option.content;
+                }
+            }
+            return null;
+        }
+    }
+    renderHeader() {
+        const { options, activeTab } = this.props;
+        const headerOptions = [];
+        const menuOptions = [];
+        let activeTabInMenu = false;
+        for (let i = 0; i < options.length; i++) {
+            const { canClose, key, label, menuButtons } = options[i];
+            const btnClose = (canClose) ?
+                React.createElement(Button, { style: 'subtle', size: 'small', onClick: (e) => {
+                        e.preventDefault();
+                        e.stopPropagation();
+                        this.props.onClose(key);
+                    } }, ICON_TIMES) : null;
+            const buttonMenus = menuButtons ?
+                menuButtons
+                :
+                    null;
+            const activeClass = (key === activeTab) ? 'active' : '';
+            if (i < this.state.allowableTabsInView) {
+                headerOptions.push(React.createElement("div", { className: `tab-header-option ${activeClass}`, onClick: () => this.props.onChange(key), key: key },
+                    label,
+                    btnClose,
+                    buttonMenus));
+            }
+            else {
+                if (activeTab === key && !activeTabInMenu) {
+                    activeTabInMenu = true;
+                }
+                menuOptions.push(React.createElement(ButtonMenuItem, { key: key, label: React.createElement("span", null,
+                        label,
+                        btnClose,
+                        buttonMenus), onClick: (e) => {
+                        this.props.onChange(key);
+                    }, active: activeTab === key }));
+            }
+        }
+        const btnOpenMenu = React.createElement(Button, { size: 'large', style: 'subtle', color: activeTabInMenu ? 'primary' : null }, ICON_BARS);
+        return (React.createElement(React.Fragment, null,
+            headerOptions,
+            menuOptions.length > 0 ? (React.createElement("span", { className: 'tab-header-menu' },
+                React.createElement(ButtonMenu, { position: 'left', items: menuOptions, onClick: (open) => {
+                        this.setState({ isMenuOpen: open });
+                    }, isOpen: this.state.isMenuOpen, button: btnOpenMenu }))) : null));
+    }
+    render() {
+        return (React.createElement("div", { className: 'tabs' },
+            React.createElement("div", { ref: this.headerRef, className: 'tab-header' }, this.renderHeader()),
+            React.createElement("div", { className: 'tab-content' }, this.renderContent())));
+    }
+}
+export default withResizeDetector(Tabs);
+//# sourceMappingURL=Tabs.js.map