@imposium-hub/components 1.62.7 → 2.0.0

package/dist/cjs/components/assets/AssetsTablePreviewCell.js

@@ -82,8 +82,9 @@ var AssetsTablePreviewCell = /** @class */ (function (_super) {
         };
         return (React.createElement("div", { ref: this.iconRef, className: 'asset-type-cell', onClick: this.evtHandlers.onClick },
             React.createElement(index_1.AssetsTypeIcon, { type: cell.row.values.type }),
-            cell.row.values.type === index_1.ASSET_TYPES.IMAGE && (React.createElement(index_1.ImagePreview, { style: __assign({}, (0, index_1.getMediaPreviewStyle)(cell.row.original.width, cell.row.original.height, this.iconRef)), showMedia: showMedia, url: cell.row.original.url, onRequestClose: this.evtHandlers.onClose })),
-            cell.row.values.type === index_1.ASSET_TYPES.VIDEO && (React.createElement(index_1.VideoPreview, { playbackSettings: playbackSettings, style: (0, index_1.getMediaPreviewStyle)(cell.row.original.width, cell.row.original.height, this.iconRef), showMedia: showMedia, url: cell.row.original.url, onRequestClose: this.evtHandlers.onClose }))));
+            cell.row.values.type === index_1.ASSET_TYPES.IMAGE && showMedia && (React.createElement(index_1.ImagePreview, { style: __assign({}, (0, index_1.getMediaPreviewStyle)(cell.row.original.width, cell.row.original.height, this.iconRef)), url: cell.row.original.url, onRequestClose: this.evtHandlers.onClose })),
+            cell.row.values.type === index_1.ASSET_TYPES.VIDEO && showMedia && (React.createElement(index_1.VideoPreview, { playbackSettings: playbackSettings, style: (0, index_1.getMediaPreviewStyle)(cell.row.original.width, cell.row.original.height, this.iconRef), url: cell.row.original.url, onRequestClose: this.evtHandlers.onClose })),
+            cell.row.values.type === index_1.ASSET_TYPES.AUDIO && showMedia && (React.createElement(index_1.AudioPreview, { playbackSettings: playbackSettings, style: (0, index_1.getMediaPreviewStyle)(5, 1, this.iconRef), url: cell.row.original.url, onRequestClose: this.evtHandlers.onClose }))));
     };
     return AssetsTablePreviewCell;
 }(React.PureComponent));

package/dist/cjs/components/assets/AssetsTablePreviewCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"AssetsTablePreviewCell.js","sourceRoot":"","sources":["../../../../src/components/assets/AssetsTablePreviewCell.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA+B;AAC/B,qCAMqB;AASrB;IAAqC,0CAA4C;IAK7E,gCAAY,KAAK;QAAjB,YACI,kBAAM,KAAK,CAAC,SAKf;QAVO,aAAO,GAAQ,KAAK,CAAC,SAAS,EAAkB,CAAC;QAMrD,KAAI,CAAC,WAAW,GAAG;YACf,OAAO,EAAE,cAAM,OAAA,KAAI,CAAC,WAAW,EAAE,EAAlB,CAAkB;YACjC,OAAO,EAAE,cAAM,OAAA,KAAI,CAAC,kBAAkB,EAAE,EAAzB,CAAyB;SAC3C,CAAC;;IACN,CAAC;IAEO,4CAAW,GAAnB;QACY,IAAA,cAAc,GAAK,IAAI,CAAC,KAAK,eAAf,CAAgB;QACtC,cAAc,EAAE,CAAC;IACrB,CAAC;IAEO,mDAAkB,GAA1B;QACU,IAAA,KAAyB,IAAI,CAAC,KAAK,EAAjC,OAAO,aAAA,EAAE,SAAS,eAAe,CAAC;QAC1C,IAAI,CAAC,SAAS,EAAE;YACZ,OAAO,EAAE,CAAC;YACV,OAAO;SACV;QACD,OAAO;IACX,CAAC;IAEM,uCAAM,GAAb;QACU,IAAA,KAAsB,IAAI,CAAC,KAAK,EAA9B,IAAI,UAAA,EAAE,SAAS,eAAe,CAAC;QACvC,IAAM,gBAAgB,GAAG;YACrB,QAAQ,EAAE,IAAI;YACd,IAAI,EAAE,KAAK;SACd,CAAC;QAEF,OAAO,CACH,6BACI,GAAG,EAAE,IAAI,CAAC,OAAO,EACjB,SAAS,EAAC,iBAAiB,EAC3B,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,OAAO;YACjC,oBAAC,sBAAc,IAAC,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,GAAI;YAC7C,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,KAAK,mBAAW,CAAC,KAAK,IAAI,CAC3C,oBAAC,oBAAY,IACT,KAAK,eACE,IAAA,4BAAoB,EACnB,IAAI,CAAC,GAAG,CAAC,QAAQ,CAAC,KAAK,EACvB,IAAI,CAAC,GAAG,CAAC,QAAQ,CAAC,MAAM,EACxB,IAAI,CAAC,OAAO,CACf,GAEL,SAAS,EAAE,SAAS,EACpB,GAAG,EAAE,IAAI,CAAC,GAAG,CAAC,QAAQ,CAAC,GAAG,EAC1B,cAAc,EAAE,IAAI,CAAC,WAAW,CAAC,OAAO,GAC1C,CACL;YACA,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,KAAK,mBAAW,CAAC,KAAK,IAAI,CAC3C,oBAAC,oBAAY,IACT,gBAAgB,EAAE,gBAAgB,EAClC,KAAK,EAAE,IAAA,4BAAoB,EACvB,IAAI,CAAC,GAAG,CAAC,QAAQ,CAAC,KAAK,EACvB,IAAI,CAAC,GAAG,CAAC,QAAQ,CAAC,MAAM,EACxB,IAAI,CAAC,OAAO,CACf,EACD,SAAS,EAAE,SAAS,EACpB,GAAG,EAAE,IAAI,CAAC,GAAG,CAAC,QAAQ,CAAC,GAAG,EAC1B,cAAc,EAAE,IAAI,CAAC,WAAW,CAAC,OAAO,GAC1C,CACL,CACC,CACT,CAAC;IACN,CAAC;IACL,6BAAC;AAAD,CAAC,AAtED,CAAqC,KAAK,CAAC,aAAa,GAsEvD;AAED,IAAM,8BAA8B,GAAG,KAAK,CAAC,IAAI,CAAC,sBAAsB,CAAC,CAAC;AAC1E,kBAAe,8BAA8B,CAAC"}
+{"version":3,"file":"AssetsTablePreviewCell.js","sourceRoot":"","sources":["../../../../src/components/assets/AssetsTablePreviewCell.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/components/button/Button.stories.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 declare const _default: {
     title: string;
 };

package/dist/cjs/components/button-group-field/ButtonGroupField.stories.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import ButtonGroupField from './ButtonGroupField';
 declare const _default: {
     title: string;

package/dist/cjs/components/button-menu/ButtonMenu.stories.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import ButtonMenu from './ButtonMenu';
 declare const _default: {
     title: string;

package/dist/cjs/components/card/Card.stories.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import Card from './Card';
 declare const _default: {
     title: string;

package/dist/cjs/components/checkbox-field/CheckboxField.stories.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import CheckBoxField from './CheckboxField';
 declare const _default: {
     title: string;

package/dist/cjs/components/color-field/ColorFiled.stories.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import ColorField from './ColorField';
 declare const _default: {
     title: string;

package/dist/cjs/components/controlled-list/ControlledList.stories.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import ControlledList from './ControlledList';
 declare const _default: {
     title: string;

package/dist/cjs/components/error-message-preview/ErrorMessagePreview.d.ts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+interface IErrorMessagePreviewProps {
+    showMedia: boolean;
+    message: string;
+    style?: React.CSSProperties | any;
+    onRequestClose?(): void;
+}
+declare class ErrorMessagePreview extends React.PureComponent<IErrorMessagePreviewProps> {
+    private errorMsgNode;
+    private evtHandlers;
+    constructor(props: any);
+    private onClose;
+    render(): JSX.Element;
+}
+export default ErrorMessagePreview;

package/dist/cjs/components/error-message-preview/ErrorMessagePreview.js

@@ -0,0 +1,91 @@
+"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 __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 });
+var React = __importStar(require("react"));
+var Portal_1 = __importDefault(require("../portal/Portal"));
+var Button_1 = __importDefault(require("../button/Button"));
+var copy_1 = require("../../constants/copy");
+var icons_1 = require("../../constants/icons");
+var ErrorMessagePreview = /** @class */ (function (_super) {
+    __extends(ErrorMessagePreview, _super);
+    function ErrorMessagePreview(props) {
+        var _this = _super.call(this, props) || this;
+        _this.errorMsgNode = null;
+        _this.errorMsgNode = React.createRef();
+        _this.evtHandlers = {
+            onClose: function (e) { return _this.onClose(e); }
+        };
+        return _this;
+    }
+    ErrorMessagePreview.prototype.onClose = function (e) {
+        var onRequestClose = this.props.onRequestClose;
+        e.stopPropagation();
+        onRequestClose();
+    };
+    ErrorMessagePreview.prototype.render = function () {
+        var _a = this.props, showMedia = _a.showMedia, style = _a.style, message = _a.message;
+        if (showMedia) {
+            return (React.createElement(Portal_1.default, { id: 'portal-root' },
+                React.createElement("div", { style: __assign({}, style), className: 'close-icon-preview' },
+                    React.createElement(Button_1.default, { key: 'btn-filter', onClick: this.evtHandlers.onClose, size: 'large', style: 'subtle', tooltip: copy_1.assets.field.tooltipFilter }, icons_1.ICON_TIMES)),
+                React.createElement("p", { style: style, ref: this.errorMsgNode, className: 'asset-preview-background media-preview' }, message)));
+        }
+        else {
+            return null;
+        }
+    };
+    return ErrorMessagePreview;
+}(React.PureComponent));
+exports.default = ErrorMessagePreview;
+//# sourceMappingURL=ErrorMessagePreview.js.map

package/dist/cjs/components/error-message-preview/ErrorMessagePreview.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ErrorMessagePreview.js","sourceRoot":"","sources":["../../../../src/components/error-message-preview/ErrorMessagePreview.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA+B;AAC/B,4DAAsC;AACtC,4DAAsC;AACtC,6CAAsD;AACtD,+CAAmD;AASnD;IAAkC,uCAA8C;IAK5E,6BAAY,KAAK;QAAjB,YACI,kBAAM,KAAK,CAAC,SAKf;QAVO,kBAAY,GAAQ,IAAI,CAAC;QAM7B,KAAI,CAAC,YAAY,GAAG,KAAK,CAAC,SAAS,EAAE,CAAC;QACtC,KAAI,CAAC,WAAW,GAAG;YACf,OAAO,EAAE,UAAC,CAAC,IAAK,OAAA,KAAI,CAAC,OAAO,CAAC,CAAC,CAAC,EAAf,CAAe;SAClC,CAAC;;IACN,CAAC;IAEO,qCAAO,GAAf,UAAgB,CAAC;QACL,IAAA,cAAc,GAAK,IAAI,CAAC,KAAK,eAAf,CAAgB;QACtC,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,cAAc,EAAE,CAAC;IACrB,CAAC;IAEM,oCAAM,GAAb;QACU,IAAA,KAAgC,IAAI,CAAC,KAAK,EAAxC,SAAS,eAAA,EAAE,KAAK,WAAA,EAAE,OAAO,aAAe,CAAC;QACjD,IAAI,SAAS,EAAE;YACX,OAAO,CACH,oBAAC,gBAAM,IAAC,EAAE,EAAC,aAAa;gBACpB,6BACI,KAAK,eAAO,KAAK,GACjB,SAAS,EAAE,oBAAoB;oBAC/B,oBAAC,gBAAM,IACH,GAAG,EAAC,YAAY,EAChB,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,OAAO,EACjC,IAAI,EAAE,OAAO,EACb,KAAK,EAAC,QAAQ,EACd,OAAO,EAAE,aAAI,CAAC,KAAK,CAAC,aAAa,IAChC,kBAAU,CACN,CACP;gBACN,2BACI,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,IAAI,CAAC,YAAY,EACtB,SAAS,EAAC,wCAAwC,IACpD,OAAO,CAAK,CACT,CACZ,CAAC;SACL;aAAM;YACH,OAAO,IAAI,CAAC;SACf;IACL,CAAC;IACL,0BAAC;AAAD,CAAC,AA/CD,CAAkC,KAAK,CAAC,aAAa,GA+CpD;AAED,kBAAe,mBAAmB,CAAC"}

package/dist/cjs/components/field-wrapper/FieldWrapper.stories.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import FieldWrapper from './FieldWrapper';
 declare const _default: {
     title: string;

package/dist/cjs/components/h-rule/HRule.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 declare const HRule: (props: any) => JSX.Element;
 export default HRule;

package/dist/cjs/components/h-rule/HRule.stories.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 declare const _default: {
     title: string;
     component: (props: any) => JSX.Element;

package/dist/cjs/components/list-field/ListField.stories.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import ListField from './ListField';
 declare const _default: {
     title: string;

package/dist/cjs/components/modal/Modal.stories.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import Modal from './Modal';
 declare const _default: {
     title: string;

package/dist/cjs/components/number-field/NumberField.stories.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import NumberField from './NumberField';
 declare const _default: {
     title: string;

package/dist/cjs/components/players/AudioPreview.d.ts

@@ -0,0 +1,25 @@
+import * as React from 'react';
+interface IAudioPreviewProps {
+    url: string;
+    playbackSettings?: any;
+    style?: React.CSSProperties | any;
+    onRequestClose?(): void;
+}
+interface IAudioPreviewState {
+    error: boolean;
+    loaded: boolean;
+}
+declare class AudioPreview extends React.PureComponent<IAudioPreviewProps, IAudioPreviewState> {
+    private audioNode;
+    private audioRef;
+    private evtHandlers;
+    private clickHandler;
+    private clickOutsideTimeout;
+    constructor(props: any);
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    private detectOutsideClick;
+    private onClose;
+    render(): JSX.Element;
+}
+export default AudioPreview;

package/dist/cjs/components/players/AudioPreview.js

@@ -0,0 +1,114 @@
+"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 __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 });
+var React = __importStar(require("react"));
+var Portal_1 = __importDefault(require("../portal/Portal"));
+var Button_1 = __importDefault(require("../button/Button"));
+var copy_1 = require("../../constants/copy");
+var icons_1 = require("../../constants/icons");
+var AudioPreview = /** @class */ (function (_super) {
+    __extends(AudioPreview, _super);
+    function AudioPreview(props) {
+        var _this = _super.call(this, props) || this;
+        _this.audioNode = null;
+        _this.audioRef = null;
+        _this.clickHandler = function (e) { return _this.detectOutsideClick(e); };
+        _this.detectOutsideClick = function (e) {
+            var target = e.target;
+            var clickInside = _this.audioRef.current && _this.audioRef.current.contains(target) ? true : false;
+            if (!clickInside) {
+                _this.onClose(e);
+            }
+        };
+        _this.audioNode = React.createRef();
+        _this.audioRef = React.createRef();
+        _this.evtHandlers = {
+            onClose: function (e) { return _this.onClose(e); }
+        };
+        _this.state = {
+            error: false,
+            loaded: false
+        };
+        return _this;
+    }
+    AudioPreview.prototype.componentDidMount = function () {
+        var _this = this;
+        clearTimeout(this.clickOutsideTimeout);
+        this.clickOutsideTimeout = setTimeout(function () {
+            window.addEventListener('click', _this.clickHandler);
+        }, 25);
+    };
+    AudioPreview.prototype.componentWillUnmount = function () {
+        clearTimeout(this.clickOutsideTimeout);
+        window.removeEventListener('click', this.clickHandler);
+    };
+    AudioPreview.prototype.onClose = function (e) {
+        var onRequestClose = this.props.onRequestClose;
+        onRequestClose();
+    };
+    AudioPreview.prototype.render = function () {
+        var _this = this;
+        var _a = this.props, url = _a.url, playbackSettings = _a.playbackSettings, style = _a.style;
+        var error = this.state.error;
+        return (React.createElement(Portal_1.default, { id: 'portal-root' },
+            React.createElement("div", { ref: this.audioRef },
+                React.createElement("div", { style: __assign({}, style), className: 'close-icon-preview' },
+                    React.createElement(Button_1.default, { key: 'btn-filter', onClick: this.evtHandlers.onClose, size: 'large', style: 'subtle', tooltip: copy_1.assets.field.tooltipFilter }, icons_1.ICON_TIMES)),
+                React.createElement("audio", { style: style, onError: function () { return _this.setState({ loaded: true, error: true }); }, onCanPlayThrough: function () { return _this.setState({ loaded: true }); }, ref: this.audioNode, autoPlay: playbackSettings.autoPlay, loop: playbackSettings.loop, controls: true, src: url, className: 'asset-preview-background media-preview' }),
+                error ? (React.createElement("div", { className: 'error-preview audio', style: style }, "Audio not found")) : null)));
+    };
+    return AudioPreview;
+}(React.PureComponent));
+exports.default = AudioPreview;
+//# sourceMappingURL=AudioPreview.js.map

package/dist/cjs/components/players/AudioPreview.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AudioPreview.js","sourceRoot":"","sources":["../../../../src/components/players/AudioPreview.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA+B;AAC/B,4DAAsC;AACtC,4DAAsC;AACtC,6CAAsD;AACtD,+CAAmD;AAcnD;IAA2B,gCAA2D;IAWlF,sBAAY,KAAK;QAAjB,YACI,kBAAM,KAAK,CAAC,SAUf;QArBO,eAAS,GAAQ,IAAI,CAAC;QAEtB,cAAQ,GAAQ,IAAI,CAAC;QAIrB,kBAAY,GAAQ,UAAC,CAAC,IAAK,OAAA,KAAI,CAAC,kBAAkB,CAAC,CAAC,CAAC,EAA1B,CAA0B,CAAC;QA6BtD,wBAAkB,GAAG,UAAC,CAAM;YACxB,IAAA,MAAM,GAAK,CAAC,OAAN,CAAO;YAErB,IAAM,WAAW,GACb,KAAI,CAAC,QAAQ,CAAC,OAAO,IAAI,KAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC;YAEnF,IAAI,CAAC,WAAW,EAAE;gBACd,KAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;aACnB;QACL,CAAC,CAAC;QAhCE,KAAI,CAAC,SAAS,GAAG,KAAK,CAAC,SAAS,EAAE,CAAC;QACnC,KAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,SAAS,EAAE,CAAC;QAClC,KAAI,CAAC,WAAW,GAAG;YACf,OAAO,EAAE,UAAC,CAAC,IAAK,OAAA,KAAI,CAAC,OAAO,CAAC,CAAC,CAAC,EAAf,CAAe;SAClC,CAAC;QACF,KAAI,CAAC,KAAK,GAAG;YACT,KAAK,EAAE,KAAK;YACZ,MAAM,EAAE,KAAK;SAChB,CAAC;;IACN,CAAC;IAEM,wCAAiB,GAAxB;QAAA,iBAKC;QAJG,YAAY,CAAC,IAAI,CAAC,mBAAmB,CAAC,CAAC;QACvC,IAAI,CAAC,mBAAmB,GAAG,UAAU,CAAC;YAClC,MAAM,CAAC,gBAAgB,CAAC,OAAO,EAAE,KAAI,CAAC,YAAY,CAAC,CAAC;QACxD,CAAC,EAAE,EAAE,CAAC,CAAC;IACX,CAAC;IAEM,2CAAoB,GAA3B;QACI,YAAY,CAAC,IAAI,CAAC,mBAAmB,CAAC,CAAC;QACvC,MAAM,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,YAAY,CAAC,CAAC;IAC3D,CAAC;IAaO,8BAAO,GAAf,UAAgB,CAAC;QACL,IAAA,cAAc,GAAK,IAAI,CAAC,KAAK,eAAf,CAAgB;QACtC,cAAc,EAAE,CAAC;IACrB,CAAC;IAEM,6BAAM,GAAb;QAAA,iBAuCC;QAtCS,IAAA,KAAmC,IAAI,CAAC,KAAK,EAA3C,GAAG,SAAA,EAAE,gBAAgB,sBAAA,EAAE,KAAK,WAAe,CAAC;QAC5C,IAAA,KAAK,GAAK,IAAI,CAAC,KAAK,MAAf,CAAgB;QAC7B,OAAO,CACH,oBAAC,gBAAM,IAAC,EAAE,EAAC,aAAa;YACpB,6BAAK,GAAG,EAAE,IAAI,CAAC,QAAQ;gBACnB,6BACI,KAAK,eAAO,KAAK,GACjB,SAAS,EAAE,oBAAoB;oBAC/B,oBAAC,gBAAM,IACH,GAAG,EAAC,YAAY,EAChB,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,OAAO,EACjC,IAAI,EAAE,OAAO,EACb,KAAK,EAAC,QAAQ,EACd,OAAO,EAAE,aAAI,CAAC,KAAK,CAAC,aAAa,IAChC,kBAAU,CACN,CACP;gBACN,+BACI,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,cAAM,OAAA,KAAI,CAAC,QAAQ,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,EAA5C,CAA4C,EAC3D,gBAAgB,EAAE,cAAM,OAAA,KAAI,CAAC,QAAQ,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,CAAC,EAA/B,CAA+B,EACvD,GAAG,EAAE,IAAI,CAAC,SAAS,EACnB,QAAQ,EAAE,gBAAgB,CAAC,QAAQ,EACnC,IAAI,EAAE,gBAAgB,CAAC,IAAI,EAC3B,QAAQ,QACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAC,wCAAwC,GACpD;gBACD,KAAK,CAAC,CAAC,CAAC,CACL,6BACI,SAAS,EAAC,qBAAqB,EAC/B,KAAK,EAAE,KAAK,sBAEV,CACT,CAAC,CAAC,CAAC,IAAI,CACN,CACD,CACZ,CAAC;IACN,CAAC;IACL,mBAAC;AAAD,CAAC,AA5FD,CAA2B,KAAK,CAAC,aAAa,GA4F7C;AAED,kBAAe,YAAY,CAAC"}

package/dist/cjs/components/players/ImagePreview.d.ts

@@ -1,18 +1,24 @@
 import * as React from 'react';
 interface IImagePreviewProps {
-    showMedia: boolean;
     url: string;
     playbackSettings?: any;
     style?: React.CSSProperties | any;
     onRequestClose?(): void;
 }
 interface IImagePreviewState {
+    error: boolean;
     loaded: boolean;
 }
 declare class ImagePreview extends React.PureComponent<IImagePreviewProps, IImagePreviewState> {
     private imageNode;
+    private imageRef;
     private evtHandlers;
+    private clickHandler;
+    private clickOutsideTimeout;
     constructor(props: any);
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    private detectOutsideClick;
     private onClose;
     render(): JSX.Element;
 }

package/dist/cjs/components/players/ImagePreview.js

@@ -62,33 +62,51 @@ var ImagePreview = /** @class */ (function (_super) {
     function ImagePreview(props) {
         var _this = _super.call(this, props) || this;
         _this.imageNode = null;
+        _this.imageRef = null;
+        _this.clickHandler = function (e) { return _this.detectOutsideClick(e); };
+        _this.detectOutsideClick = function (e) {
+            var target = e.target;
+            var clickInside = _this.imageRef.current && _this.imageRef.current.contains(target) ? true : false;
+            if (!clickInside) {
+                _this.onClose(e);
+            }
+        };
         _this.imageNode = React.createRef();
+        _this.imageRef = React.createRef();
         _this.evtHandlers = {
             onClose: function (e) { return _this.onClose(e); }
         };
         _this.state = {
+            error: false,
             loaded: false
         };
         return _this;
     }
+    ImagePreview.prototype.componentDidMount = function () {
+        var _this = this;
+        clearTimeout(this.clickOutsideTimeout);
+        this.clickOutsideTimeout = setTimeout(function () {
+            window.addEventListener('click', _this.clickHandler);
+        }, 25);
+    };
+    ImagePreview.prototype.componentWillUnmount = function () {
+        clearTimeout(this.clickOutsideTimeout);
+        window.removeEventListener('click', this.clickHandler);
+    };
     ImagePreview.prototype.onClose = function (e) {
         var onRequestClose = this.props.onRequestClose;
-        e.stopPropagation();
         onRequestClose();
     };
     ImagePreview.prototype.render = function () {
         var _this = this;
-        var _a = this.props, showMedia = _a.showMedia, url = _a.url, style = _a.style;
-        var loaded = this.state.loaded;
-        if (showMedia) {
-            return (React.createElement(Portal_1.default, { id: 'portal-root' },
+        var _a = this.props, url = _a.url, style = _a.style;
+        var error = this.state.error;
+        return (React.createElement(Portal_1.default, { id: 'portal-root' },
+            React.createElement("div", { ref: this.imageRef },
                 React.createElement("div", { style: __assign({}, style), className: 'close-icon-preview' },
                     React.createElement(Button_1.default, { key: 'btn-filter', onClick: this.evtHandlers.onClose, size: 'large', style: 'subtle', tooltip: copy_1.assets.field.tooltipFilter }, icons_1.ICON_TIMES)),
-                React.createElement("img", { onLoad: function () { return _this.setState({ loaded: true }); }, src: url, ref: this.imageNode, className: "asset-preview-background media-preview ".concat(!loaded ? 'hidden' : ''), style: style })));
-        }
-        else {
-            return null;
-        }
+                React.createElement("img", { onError: function () { return _this.setState({ error: true, loaded: true }); }, onLoad: function () { return _this.setState({ loaded: true }); }, src: url, ref: this.imageNode, className: "asset-preview-background media-preview", style: style }),
+                error ? (React.createElement("div", { className: 'error-preview', style: style }, "Image not found")) : null)));
     };
     return ImagePreview;
 }(React.PureComponent));

package/dist/cjs/components/players/ImagePreview.js.map

@@ -1 +1 @@
-{"version":3,"file":"ImagePreview.js","sourceRoot":"","sources":["../../../../src/components/players/ImagePreview.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA+B;AAC/B,4DAAsC;AACtC,+CAAmD;AACnD,4DAAsC;AACtC,6CAAsD;AAatD;IAA2B,gCAA2D;IAKlF,sBAAY,KAAK;QAAjB,YACI,kBAAM,KAAK,CAAC,SAQf;QAbO,eAAS,GAAQ,IAAI,CAAC;QAM1B,KAAI,CAAC,SAAS,GAAG,KAAK,CAAC,SAAS,EAAE,CAAC;QACnC,KAAI,CAAC,WAAW,GAAG;YACf,OAAO,EAAE,UAAC,CAAC,IAAK,OAAA,KAAI,CAAC,OAAO,CAAC,CAAC,CAAC,EAAf,CAAe;SAClC,CAAC;QACF,KAAI,CAAC,KAAK,GAAG;YACT,MAAM,EAAE,KAAK;SAChB,CAAC;;IACN,CAAC;IAEO,8BAAO,GAAf,UAAgB,CAAC;QACL,IAAA,cAAc,GAAK,IAAI,CAAC,KAAK,eAAf,CAAgB;QACtC,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,cAAc,EAAE,CAAC;IACrB,CAAC;IAEM,6BAAM,GAAb;QAAA,iBAgCC;QA/BS,IAAA,KAA4B,IAAI,CAAC,KAAK,EAApC,SAAS,eAAA,EAAE,GAAG,SAAA,EAAE,KAAK,WAAe,CAAC;QACrC,IAAA,MAAM,GAAK,IAAI,CAAC,KAAK,OAAf,CAAgB;QAC9B,IAAI,SAAS,EAAE;YACX,OAAO,CACH,oBAAC,gBAAM,IAAC,EAAE,EAAC,aAAa;gBACpB,6BACI,KAAK,eAAO,KAAK,GACjB,SAAS,EAAE,oBAAoB;oBAC/B,oBAAC,gBAAM,IACH,GAAG,EAAC,YAAY,EAChB,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,OAAO,EACjC,IAAI,EAAE,OAAO,EACb,KAAK,EAAC,QAAQ,EACd,OAAO,EAAE,aAAI,CAAC,KAAK,CAAC,aAAa,IAChC,kBAAU,CACN,CACP;gBACN,6BACI,MAAM,EAAE,cAAM,OAAA,KAAI,CAAC,QAAQ,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,CAAC,EAA/B,CAA+B,EAC7C,GAAG,EAAE,GAAG,EACR,GAAG,EAAE,IAAI,CAAC,SAAS,EACnB,SAAS,EAAE,iDACP,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CACzB,EACF,KAAK,EAAE,KAAK,GACd,CACG,CACZ,CAAC;SACL;aAAM;YACH,OAAO,IAAI,CAAC;SACf;IACL,CAAC;IACL,mBAAC;AAAD,CAAC,AAvDD,CAA2B,KAAK,CAAC,aAAa,GAuD7C;AAED,kBAAe,YAAY,CAAC"}
+{"version":3,"file":"ImagePreview.js","sourceRoot":"","sources":["../../../../src/components/players/ImagePreview.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/components/players/VideoPreview.d.ts

@@ -1,15 +1,24 @@
 import * as React from 'react';
 interface IVideoPreviewProps {
-    showMedia: boolean;
     url: string;
     playbackSettings?: any;
     style?: React.CSSProperties | any;
     onRequestClose?(): void;
 }
-declare class VideoPreview extends React.PureComponent<IVideoPreviewProps> {
+interface IVideoPreviewState {
+    error: boolean;
+    loaded: boolean;
+}
+declare class VideoPreview extends React.PureComponent<IVideoPreviewProps, IVideoPreviewState> {
     private videoNode;
+    private videoRef;
     private evtHandlers;
+    private clickHandler;
+    private clickOutsideTimeout;
     constructor(props: any);
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    private detectOutsideClick;
     private onClose;
     render(): JSX.Element;
 }

package/dist/cjs/components/players/VideoPreview.js

@@ -62,28 +62,51 @@ var VideoPreview = /** @class */ (function (_super) {
     function VideoPreview(props) {
         var _this = _super.call(this, props) || this;
         _this.videoNode = null;
+        _this.videoRef = null;
+        _this.clickHandler = function (e) { return _this.detectOutsideClick(e); };
+        _this.detectOutsideClick = function (e) {
+            var target = e.target;
+            var clickInside = _this.videoRef.current && _this.videoRef.current.contains(target) ? true : false;
+            if (!clickInside) {
+                _this.onClose(e);
+            }
+        };
         _this.videoNode = React.createRef();
+        _this.videoRef = React.createRef();
         _this.evtHandlers = {
             onClose: function (e) { return _this.onClose(e); }
         };
+        _this.state = {
+            error: false,
+            loaded: false
+        };
         return _this;
     }
+    VideoPreview.prototype.componentDidMount = function () {
+        var _this = this;
+        clearTimeout(this.clickOutsideTimeout);
+        this.clickOutsideTimeout = setTimeout(function () {
+            window.addEventListener('click', _this.clickHandler);
+        }, 25);
+    };
+    VideoPreview.prototype.componentWillUnmount = function () {
+        clearTimeout(this.clickOutsideTimeout);
+        window.removeEventListener('click', this.clickHandler);
+    };
     VideoPreview.prototype.onClose = function (e) {
         var onRequestClose = this.props.onRequestClose;
-        e.stopPropagation();
         onRequestClose();
     };
     VideoPreview.prototype.render = function () {
-        var _a = this.props, showMedia = _a.showMedia, url = _a.url, playbackSettings = _a.playbackSettings, style = _a.style;
-        if (showMedia) {
-            return (React.createElement(Portal_1.default, { id: 'portal-root' },
+        var _this = this;
+        var _a = this.props, url = _a.url, playbackSettings = _a.playbackSettings, style = _a.style;
+        var error = this.state.error;
+        return (React.createElement(Portal_1.default, { id: 'portal-root' },
+            React.createElement("div", { ref: this.videoRef },
                 React.createElement("div", { style: __assign({}, style), className: 'close-icon-preview' },
                     React.createElement(Button_1.default, { key: 'btn-filter', onClick: this.evtHandlers.onClose, size: 'large', style: 'subtle', tooltip: copy_1.assets.field.tooltipFilter }, icons_1.ICON_TIMES)),
-                React.createElement("video", { style: style, muted: true, ref: this.videoNode, autoPlay: playbackSettings.autoPlay, loop: playbackSettings.loop, controls: true, preload: 'preload', playsInline: true, src: url, className: 'asset-preview-background media-preview' })));
-        }
-        else {
-            return null;
-        }
+                React.createElement("video", { onError: function () { return _this.setState({ error: true, loaded: true }); }, onCanPlayThrough: function () { return _this.setState({ loaded: true }); }, style: style, muted: true, ref: this.videoNode, autoPlay: playbackSettings.autoPlay, loop: playbackSettings.loop, controls: true, preload: 'preload', playsInline: true, src: url, className: 'asset-preview-background media-preview' }),
+                error ? (React.createElement("div", { className: 'error-preview', style: style }, "Video not found")) : null)));
     };
     return VideoPreview;
 }(React.PureComponent));

package/dist/cjs/components/players/VideoPreview.js.map

@@ -1 +1 @@
-{"version":3,"file":"VideoPreview.js","sourceRoot":"","sources":["../../../../src/components/players/VideoPreview.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2CAA+B;AAC/B,4DAAsC;AACtC,4DAAsC;AACtC,6CAAsD;AACtD,+CAAmD;AAUnD;IAA2B,gCAAuC;IAK9D,sBAAY,KAAK;QAAjB,YACI,kBAAM,KAAK,CAAC,SAKf;QAVO,eAAS,GAAQ,IAAI,CAAC;QAM1B,KAAI,CAAC,SAAS,GAAG,KAAK,CAAC,SAAS,EAAE,CAAC;QACnC,KAAI,CAAC,WAAW,GAAG;YACf,OAAO,EAAE,UAAC,CAAC,IAAK,OAAA,KAAI,CAAC,OAAO,CAAC,CAAC,CAAC,EAAf,CAAe;SAClC,CAAC;;IACN,CAAC;IAEO,8BAAO,GAAf,UAAgB,CAAC;QACL,IAAA,cAAc,GAAK,IAAI,CAAC,KAAK,eAAf,CAAgB;QACtC,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,cAAc,EAAE,CAAC;IACrB,CAAC;IAEM,6BAAM,GAAb;QACU,IAAA,KAA8C,IAAI,CAAC,KAAK,EAAtD,SAAS,eAAA,EAAE,GAAG,SAAA,EAAE,gBAAgB,sBAAA,EAAE,KAAK,WAAe,CAAC;QAC/D,IAAI,SAAS,EAAE;YACX,OAAO,CACH,oBAAC,gBAAM,IAAC,EAAE,EAAC,aAAa;gBACpB,6BACI,KAAK,eAAO,KAAK,GACjB,SAAS,EAAE,oBAAoB;oBAC/B,oBAAC,gBAAM,IACH,GAAG,EAAC,YAAY,EAChB,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,OAAO,EACjC,IAAI,EAAE,OAAO,EACb,KAAK,EAAC,QAAQ,EACd,OAAO,EAAE,aAAI,CAAC,KAAK,CAAC,aAAa,IAChC,kBAAU,CACN,CACP;gBACN,+BACI,KAAK,EAAE,KAAK,EACZ,KAAK,QACL,GAAG,EAAE,IAAI,CAAC,SAAS,EACnB,QAAQ,EAAE,gBAAgB,CAAC,QAAQ,EACnC,IAAI,EAAE,gBAAgB,CAAC,IAAI,EAC3B,QAAQ,QACR,OAAO,EAAC,SAAS,EACjB,WAAW,QACX,GAAG,EAAE,GAAG,EACR,SAAS,EAAC,wCAAwC,GACpD,CACG,CACZ,CAAC;SACL;aAAM;YACH,OAAO,IAAI,CAAC;SACf;IACL,CAAC;IACL,mBAAC;AAAD,CAAC,AAtDD,CAA2B,KAAK,CAAC,aAAa,GAsD7C;AAED,kBAAe,YAAY,CAAC"}
+{"version":3,"file":"VideoPreview.js","sourceRoot":"","sources":["../../../../src/components/players/VideoPreview.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/components/section/Section.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 declare const Section: (props: any) => JSX.Element;
 export default Section;

package/dist/cjs/components/section/Section.stories.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 declare const _default: {
     title: string;
     component: (props: any) => JSX.Element;

package/dist/cjs/components/select-field/SelectField.stories.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import SelectField from './SelectField';
 declare const _default: {
     title: string;

package/dist/cjs/components/slider-field/SliderField.stories.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import SliderField from './SliderField';
 declare const _default: {
     title: string;

package/dist/cjs/components/text-area-field/TextAreaField.stories.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import TextAreaField from './TextAreaField';
 declare const _default: {
     title: string;

package/dist/cjs/components/text-field/TextField.stories.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 import TextField from './TextField';
 declare const _default: {
     title: string;

package/dist/cjs/index.d.ts

@@ -95,4 +95,5 @@ import PublishStatusIndicator from './components/publish-wizard/publish/PublishS
 import { getMediaPreviewStyle } from './utils/assets';
 import AdvancedNumberField from './components/advanced-number-field/AdvancedNumberField';
 import FontPicker from './components/font-picker/FontPicker';
-export { AppWrapper, AuthGate, ImposiumHeader, ImposiumDropdown, Button, ButtonGroupField, ButtonMenu, ButtonMenuItem, Card, CheckboxField, ControlledList, DataTable, DataTablePaginator, FieldWrapper, HRule, ListField, Modal, AdvancedNumberField, NumberField, SelectField, ColorField, Tabs, ITab, Tag, TextField, TextAreaField, ToastService, SliderField, Section, DeterminateLoader, Spinner, NoAccess, ServiceIcon, LogViewer, StoryPreviewer, ShortcutMenu, Portal, AssetDetails, ImagePlayer, VideoPlayer, AudioPlayer, VideoPreview, ImagePreview, ImageSequencePlayer, AssetsTypeIcon, AssetsTableDateCell, AssetsTableDropzone, AssetsTablePreviewCell, AssetsTableSelectFilter, AssetsTableSelectCell, AssetsTableTypeFilter, AssetsTableTypeCell, AssetsTableStatusCell, AssetsTableNameFilter, AssetsTableNameCell, AssetsTableDurationCell, AssetsTableTagsCell, AssetsTableTagsFilter, AssetsTableTagsPivot, AssetsTableComplexTagCell, AssetField, AssetsUploadMenu, FontAssetPreview, DroppableAssetRenderer, PreviewNotAvailable, IStaticComposition, auth, login, clearCachedAuth, access, cacheAccessData, clearCachedAccessList, storyAdded, storyNameMutated, orgNameMutated, storyDeleted, updateFilters, getAssets, deleteAssets, addAssetTag, deleteAssetTag, updateAssetName, updateAssetData, doAssetTableHydration, toggleAutoTag, uploadAssets, selectAsset, deselectAsset, resetSelection, assetFilters, assetList, assetUploads, selectedAssets, getAssetTagList, addAssetTagToList, assetTags, assetActions, activeBatch, batchActions, AuthService, IIdentity, SessionService, IHubSession, API, IImposiumAPI, LegacyAPI, StorageService, Timer, validateAccessLevel, getFirstStoryInOrg, string2HexCode, parameterizeServiceUrl, scrapeEmail, fitToContainer, formattedTime, filterHotkeys, mimetypeConformsToOverlay, validateAssetMimetype, toFixed, getSMPTE, padStart, formatDateDefault, ASSET_TYPES, publish, publishVersion, clearStoryPublishStatus, getStoryPublishStatus, PublishStatusIndicator, AnchorField, SMPTEField, getMediaPreviewStyle, HEADER_HEIGHT, decoupleAssets, deleteAssetsTags, updateAssetStory, FontPicker, cancelAssetUpload };
+import AudioPreview from './components/players/AudioPreview';
+export { AppWrapper, AuthGate, ImposiumHeader, ImposiumDropdown, Button, ButtonGroupField, ButtonMenu, ButtonMenuItem, Card, CheckboxField, ControlledList, DataTable, DataTablePaginator, FieldWrapper, HRule, ListField, Modal, AdvancedNumberField, NumberField, SelectField, ColorField, Tabs, ITab, Tag, TextField, TextAreaField, ToastService, SliderField, Section, DeterminateLoader, Spinner, NoAccess, ServiceIcon, LogViewer, StoryPreviewer, ShortcutMenu, Portal, AssetDetails, ImagePlayer, VideoPlayer, AudioPlayer, VideoPreview, ImagePreview, AudioPreview, ImageSequencePlayer, AssetsTypeIcon, AssetsTableDateCell, AssetsTableDropzone, AssetsTablePreviewCell, AssetsTableSelectFilter, AssetsTableSelectCell, AssetsTableTypeFilter, AssetsTableTypeCell, AssetsTableStatusCell, AssetsTableNameFilter, AssetsTableNameCell, AssetsTableDurationCell, AssetsTableTagsCell, AssetsTableTagsFilter, AssetsTableTagsPivot, AssetsTableComplexTagCell, AssetField, AssetsUploadMenu, FontAssetPreview, DroppableAssetRenderer, PreviewNotAvailable, IStaticComposition, auth, login, clearCachedAuth, access, cacheAccessData, clearCachedAccessList, storyAdded, storyNameMutated, orgNameMutated, storyDeleted, updateFilters, getAssets, deleteAssets, addAssetTag, deleteAssetTag, updateAssetName, updateAssetData, doAssetTableHydration, toggleAutoTag, uploadAssets, selectAsset, deselectAsset, resetSelection, assetFilters, assetList, assetUploads, selectedAssets, getAssetTagList, addAssetTagToList, assetTags, assetActions, activeBatch, batchActions, AuthService, IIdentity, SessionService, IHubSession, API, IImposiumAPI, LegacyAPI, StorageService, Timer, validateAccessLevel, getFirstStoryInOrg, string2HexCode, parameterizeServiceUrl, scrapeEmail, fitToContainer, formattedTime, filterHotkeys, mimetypeConformsToOverlay, validateAssetMimetype, toFixed, getSMPTE, padStart, formatDateDefault, ASSET_TYPES, publish, publishVersion, clearStoryPublishStatus, getStoryPublishStatus, PublishStatusIndicator, AnchorField, SMPTEField, getMediaPreviewStyle, HEADER_HEIGHT, decoupleAssets, deleteAssetsTags, updateAssetStory, FontPicker, cancelAssetUpload };