@imposium-hub/components 2.4.2-1 → 2.4.2-2

package/dist/esm/components/color-field/ColorField.d.ts

@@ -11,10 +11,13 @@ interface IColorFieldProps {
     presetColors?: any[];
     width?: string | number;
     onChange(e: any): void;
+    onVariable?: (e: any) => void;
     info?: string;
     labelPosition?: string;
     pickerPosition?: string;
     labelWidth?: string | number;
+    variableOptions?: any[];
+    colorOption?: string;
 }
 interface IColorFieldState {
     pickerOpen: boolean;
@@ -28,6 +31,7 @@ declare class ColorField extends React.PureComponent<IColorFieldProps, IColorFie
     componentWillUnmount(): void;
     private handleClickOutside;
     private handleChangeComplete;
-    render(): React.JSX.Element;
+    private isValidColor;
+    render(): any;
 }
 export default ColorField;

package/dist/esm/components/color-field/ColorField.js

@@ -1,6 +1,8 @@
 import * as React from 'react';
 import FieldWrapper from '../field-wrapper/FieldWrapper';
 import { SketchPicker } from '@imposium-hub/react-color';
+import SelectField from '../select-field/SelectField';
+import { formatColor } from '../../Util';
 class ColorField extends React.PureComponent {
     clickOutsideHandler;
     picker;
@@ -46,30 +48,49 @@ class ColorField extends React.PureComponent {
         });
     }
     handleChangeComplete(color, e) {
-        return this.props.onChange(color);
+        return this.props.onChange(formatColor(color));
+    }
+    isValidColor(color) {
+        const el = document.createElement('div');
+        el.style.backgroundColor = color;
+        if (el.style.backgroundColor) {
+            return true;
+        }
+        else {
+            this.props.onChange('rgba(0,0,0,1)');
+            return false;
+        }
     }
     render() {
-        const { label, width, buttons, tooltip, value, enableAlpha, presetColors, info, labelPosition, pickerPosition, labelWidth } = this.props;
-        const { pickerOpen } = this.state;
-        const disableAlpha = !enableAlpha;
-        const pickerPos = pickerPosition || 'left';
-        const picker = pickerOpen ? (React.createElement(SketchPicker, { color: value, disableAlpha: disableAlpha, presetColors: presetColors, onChangeComplete: (c, e) => this.handleChangeComplete(c, e) })) : null;
-        let swatchStyle;
-        if (value === 'transparent' || value === 'rgba(0,0,0,0)') {
-            swatchStyle = {
-                background: this.transparentBg,
-                border: '1px solid #1d1d1d',
-                boxSizing: 'border-box'
-            };
+        const { label, width, buttons, tooltip, value, enableAlpha, presetColors, info, labelPosition, pickerPosition, labelWidth, colorOption, variableOptions } = this.props;
+        let selection;
+        if (colorOption && colorOption === 'inventory_id') {
+            selection = (React.createElement(SelectField, { label: label, labelPosition: labelPosition, labelWidth: labelWidth, tooltip: tooltip, key: 'inventory-id-field', width: width, value: value.replace(/[{()}]/g, ''), options: variableOptions, onChange: (e) => this.props.onVariable(`{{${e}}}`) }));
         }
         else {
-            swatchStyle = {
-                backgroundColor: value
-            };
+            const { pickerOpen } = this.state;
+            const disableAlpha = !enableAlpha;
+            const pickerPos = pickerPosition || 'left';
+            const color = this.isValidColor(value) ? value : 'rgba(0,0,0,1)';
+            const picker = pickerOpen ? (React.createElement(SketchPicker, { color: color, disableAlpha: disableAlpha, presetColors: presetColors, onChangeComplete: (c, e) => this.handleChangeComplete(c, e) })) : null;
+            let swatchStyle;
+            if (value === 'transparent' || value === 'rgba(0,0,0,0)') {
+                swatchStyle = {
+                    background: this.transparentBg,
+                    border: '1px solid #1d1d1d',
+                    boxSizing: 'border-box'
+                };
+            }
+            else {
+                swatchStyle = {
+                    backgroundColor: color
+                };
+            }
+            selection = (React.createElement(FieldWrapper, { customClass: 'color-field', label: label, tooltip: tooltip, buttons: buttons, info: info, labelPosition: labelPosition, labelWidth: labelWidth, width: width },
+                React.createElement("div", { className: 'swatch', style: swatchStyle, onClick: (e) => this.togglePicker(e) }),
+                React.createElement("div", { className: `picker picker-${pickerPos}`, ref: this.picker }, picker)));
         }
-        return (React.createElement(FieldWrapper, { customClass: 'color-field', label: label, tooltip: tooltip, buttons: buttons, info: info, labelPosition: labelPosition, labelWidth: labelWidth, width: width },
-            React.createElement("div", { className: 'swatch', style: swatchStyle, onClick: (e) => this.togglePicker(e) }),
-            React.createElement("div", { className: `picker picker-${pickerPos}`, ref: this.picker }, picker)));
+        return selection;
     }
 }
 export default ColorField;

package/dist/esm/components/color-field/ColorField.js.map

@@ -1 +1 @@
-{"version":3,"file":"ColorField.js","sourceRoot":"","sources":["../../../../src/components/color-field/ColorField.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"ColorField.js","sourceRoot":"","sources":["../../../../src/components/color-field/ColorField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,YAAY,MAAM,+BAA+B,CAAC;AAEzD,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,WAAW,MAAM,6BAA6B,CAAC;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AA0BzC,MAAM,UAAW,SAAQ,KAAK,CAAC,aAAiD;IACpE,mBAAmB,CAAM;IAEzB,MAAM,CAAM;IAEZ,aAAa,GAAG,2MAA2M,CAAC;IAEpO,YAAY,KAAK;QACb,KAAK,CAAC,KAAK,CAAC,CAAC;QAEb,IAAI,CAAC,KAAK,GAAG;YACT,UAAU,EAAE,KAAK;SACpB,CAAC;QAEF,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC,SAAS,EAAE,CAAC;QAEhC,IAAI,CAAC,mBAAmB,GAAG,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC,CAAC,CAAC;IACjE,CAAC;IAEO,YAAY,CAAC,CAAC;QAClB,CAAC,CAAC,cAAc,EAAE,CAAC;QACnB,CAAC,CAAC,eAAe,EAAE,CAAC;QAEpB,MAAM,QAAQ,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC;QAExC,IAAI,CAAC,QAAQ,CACT;YACI,UAAU,EAAE,QAAQ;SACvB,EACD,GAAG,EAAE;YACD,IAAI,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,CAAC;gBACxB,QAAQ,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,mBAAmB,CAAC,CAAC;YACjE,CAAC;iBAAM,CAAC;gBACJ,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,mBAAmB,CAAC,CAAC;YACpE,CAAC;QACL,CAAC,CACJ,CAAC;IACN,CAAC;IAEM,oBAAoB;QACvB,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,mBAAmB,CAAC,CAAC;IACpE,CAAC;IAEO,kBAAkB,CAAC,CAAC;QACxB,IAAI,aAAa,GAAG,CAAC,CAAC,MAAM,CAAC;QAC7B,MAAM,GAAG,GAAG,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC;QAEhC,GAAG,CAAC;YACA,IAAI,aAAa,KAAK,GAAG,EAAE,CAAC;gBACxB,OAAO;YACX,CAAC;YACD,aAAa,GAAG,aAAa,CAAC,UAAU,CAAC;QAC7C,CAAC,QAAQ,aAAa,EAAE;QAExB,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,mBAAmB,CAAC,CAAC;QAEhE,IAAI,CAAC,QAAQ,CAAC;YACV,UAAU,EAAE,KAAK;SACpB,CAAC,CAAC;IACP,CAAC;IAEO,oBAAoB,CAAC,KAAK,EAAE,CAAC;QACjC,OAAO,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC;IACnD,CAAC;IAEO,YAAY,CAAC,KAAK;QACtB,MAAM,EAAE,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QACzC,EAAE,CAAC,KAAK,CAAC,eAAe,GAAG,KAAK,CAAC;QACjC,IAAI,EAAE,CAAC,KAAK,CAAC,eAAe,EAAE,CAAC;YAC3B,OAAO,IAAI,CAAC;QAChB,CAAC;aAAM,CAAC;YACJ,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,eAAe,CAAC,CAAC;YACrC,OAAO,KAAK,CAAC;QACjB,CAAC;IACL,CAAC;IAEM,MAAM;QACT,MAAM,EACF,KAAK,EACL,KAAK,EACL,OAAO,EACP,OAAO,EACP,KAAK,EACL,WAAW,EACX,YAAY,EACZ,IAAI,EACJ,aAAa,EACb,cAAc,EACd,UAAU,EACV,WAAW,EACX,eAAe,EAClB,GAAG,IAAI,CAAC,KAAK,CAAC;QAEf,IAAI,SAAS,CAAC;QAEd,IAAI,WAAW,IAAI,WAAW,KAAK,cAAc,EAAE,CAAC;YAChD,SAAS,GAAG,CACR,oBAAC,WAAW,IACR,KAAK,EAAE,KAAK,EACZ,aAAa,EAAE,aAAa,EAC5B,UAAU,EAAE,UAAU,EACtB,OAAO,EAAE,OAAO,EAChB,GAAG,EAAC,oBAAoB,EACxB,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,SAAS,EAAE,EAAE,CAAC,EACnC,OAAO,EAAE,eAAe,EACxB,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,KAAK,CAAC,IAAI,CAAC,GACpD,CACL,CAAC;QACN,CAAC;aAAM,CAAC;YACJ,MAAM,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;YAClC,MAAM,YAAY,GAAG,CAAC,WAAW,CAAC;YAClC,MAAM,SAAS,GAAG,cAAc,IAAI,MAAM,CAAC;YAC3C,MAAM,KAAK,GAAG,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,eAAe,CAAC;YACjE,MAAM,MAAM,GAAG,UAAU,CAAC,CAAC,CAAC,CACxB,oBAAC,YAAY,IACT,KAAK,EAAE,KAAK,EACZ,YAAY,EAAE,YAAY,EAC1B,YAAY,EAAE,YAAY,EAC1B,gBAAgB,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC,EAAE,CAAC,CAAC,GAC7D,CACL,CAAC,CAAC,CAAC,IAAI,CAAC;YAET,IAAI,WAAW,CAAC;YAChB,IAAI,KAAK,KAAK,aAAa,IAAI,KAAK,KAAK,eAAe,EAAE,CAAC;gBACvD,WAAW,GAAG;oBACV,UAAU,EAAE,IAAI,CAAC,aAAa;oBAC9B,MAAM,EAAE,mBAAmB;oBAC3B,SAAS,EAAE,YAAY;iBAC1B,CAAC;YACN,CAAC;iBAAM,CAAC;gBACJ,WAAW,GAAG;oBACV,eAAe,EAAE,KAAK;iBACzB,CAAC;YACN,CAAC;YAED,SAAS,GAAG,CACR,oBAAC,YAAY,IACT,WAAW,EAAC,aAAa,EACzB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,IAAI,EACV,aAAa,EAAE,aAAa,EAC5B,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,KAAK;gBACZ,6BACI,SAAS,EAAC,QAAQ,EAClB,KAAK,EAAE,WAAW,EAClB,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,GACtC;gBACF,6BACI,SAAS,EAAE,iBAAiB,SAAS,EAAE,EACvC,GAAG,EAAE,IAAI,CAAC,MAAM,IACf,MAAM,CACL,CACK,CAClB,CAAC;QACN,CAAC;QAED,OAAO,SAAS,CAAC;IACrB,CAAC;CACJ;AAED,eAAe,UAAU,CAAC"}

package/dist/esm/index.d.ts

@@ -91,7 +91,7 @@ import API, { IImposiumAPI } from './services/API';
 import LegacyAPI from './services/API-Legacy';
 import StorageService from './services/Storage';
 import Timer from './services/Timer';
-import { getFirstStoryInOrg, getLastModifiedStoryInOrg, string2HexCode, toFixed, padStart, parameterizeServiceUrl, scrapeEmail, fitToContainer, filterHotkeys, mimetypeConformsToOverlay, validateAssetMimetype, formatDateDefault, validateAccessLevel, formattedTime, getSMPTE, checkStoryId, IMAGE_EXTENSIONS } from './Util';
+import { getFirstStoryInOrg, getLastModifiedStoryInOrg, string2HexCode, toFixed, padStart, parameterizeServiceUrl, scrapeEmail, fitToContainer, filterHotkeys, mimetypeConformsToOverlay, validateAssetMimetype, formatDateDefault, validateAccessLevel, formattedTime, getSMPTE, checkStoryId, IMAGE_EXTENSIONS, formatColor } from './Util';
 import PublishStatusIndicator from './components/publish-wizard/publish/PublishStatusIndicator';
 import { getMediaPreviewStyle } from './utils/assets';
 import AdvancedNumberField from './components/advanced-number-field/AdvancedNumberField';
@@ -104,4 +104,4 @@ import ContextMenuItem from './components/context-menu/ContextMenuItem';
 import ContextMenuTrigger from './components/context-menu/ContextMenuTrigger';
 import CopyPropIdButton from './components/copy-prop-id-button/CopyPropIdButton';
 import Submenu from './components/context-menu/SubMenu';
-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, AssetsTableGlobalCell, AssetsTableStatusCell, AssetsTableNameFilter, AssetsTableNameCell, AssetsTableDurationCell, AssetsTableRateCell, AssetsTableTagsCell, AssetsTableTagsFilter, AssetsTableTagsPivot, AssetsTableComplexTagCell, AssetField, AssetsUploadMenu, FontAssetPreview, DroppableAssetRenderer, PreviewNotAvailable, IStaticComposition, auth, login, clearCachedAuth, access, setAccessData, storyAdded, storyNameMutated, orgNameMutated, storyDeleted, updateFilters, resetFilters, getAssets, deleteAssets, downloadAssets, addAssetTag, deleteAssetTag, updateAssetName, updateAssetData, doAssetTableHydration, uploadAssets, replaceAsset, 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, IMAGE_EXTENSIONS, toFixed, getSMPTE, padStart, formatDateDefault, ASSET_TYPES, publish, publishVersion, clearStoryPublishStatus, getStoryPublishStatus, PublishStatusIndicator, AnchorField, SMPTEField, getMediaPreviewStyle, HEADER_HEIGHT, decoupleAssets, deleteAssetsTags, updateAssetStory, FontPicker, cancelAssetUpload, getLastModifiedStoryInOrg, checkStoryId, renderTooltipProps, renderTooltip, ContextMenu, ContextMenuItem, ContextMenuTrigger, Submenu, CopyPropIdButton };
+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, AssetsTableGlobalCell, AssetsTableStatusCell, AssetsTableNameFilter, AssetsTableNameCell, AssetsTableDurationCell, AssetsTableRateCell, AssetsTableTagsCell, AssetsTableTagsFilter, AssetsTableTagsPivot, AssetsTableComplexTagCell, AssetField, AssetsUploadMenu, FontAssetPreview, DroppableAssetRenderer, PreviewNotAvailable, IStaticComposition, auth, login, clearCachedAuth, access, setAccessData, storyAdded, storyNameMutated, orgNameMutated, storyDeleted, updateFilters, resetFilters, getAssets, deleteAssets, downloadAssets, addAssetTag, deleteAssetTag, updateAssetName, updateAssetData, doAssetTableHydration, uploadAssets, replaceAsset, 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, IMAGE_EXTENSIONS, toFixed, getSMPTE, padStart, formatDateDefault, ASSET_TYPES, publish, publishVersion, clearStoryPublishStatus, getStoryPublishStatus, PublishStatusIndicator, AnchorField, SMPTEField, getMediaPreviewStyle, HEADER_HEIGHT, decoupleAssets, deleteAssetsTags, updateAssetStory, FontPicker, cancelAssetUpload, getLastModifiedStoryInOrg, checkStoryId, renderTooltipProps, renderTooltip, ContextMenu, ContextMenuItem, ContextMenuTrigger, Submenu, CopyPropIdButton, formatColor };

package/dist/esm/index.js

@@ -102,7 +102,7 @@ import Timer from './services/Timer';
 /*
     Utils
  */
-import { getFirstStoryInOrg, getLastModifiedStoryInOrg, string2HexCode, toFixed, padStart, parameterizeServiceUrl, scrapeEmail, fitToContainer, filterHotkeys, mimetypeConformsToOverlay, validateAssetMimetype, formatDateDefault, validateAccessLevel, formattedTime, getSMPTE, checkStoryId, IMAGE_EXTENSIONS } from './Util';
+import { getFirstStoryInOrg, getLastModifiedStoryInOrg, string2HexCode, toFixed, padStart, parameterizeServiceUrl, scrapeEmail, fitToContainer, filterHotkeys, mimetypeConformsToOverlay, validateAssetMimetype, formatDateDefault, validateAccessLevel, formattedTime, getSMPTE, checkStoryId, IMAGE_EXTENSIONS, formatColor } from './Util';
 import PublishStatusIndicator from './components/publish-wizard/publish/PublishStatusIndicator';
 import { getMediaPreviewStyle } from './utils/assets';
 import AdvancedNumberField from './components/advanced-number-field/AdvancedNumberField';
@@ -115,5 +115,5 @@ import ContextMenuItem from './components/context-menu/ContextMenuItem';
 import ContextMenuTrigger from './components/context-menu/ContextMenuTrigger';
 import CopyPropIdButton from './components/copy-prop-id-button/CopyPropIdButton';
 import Submenu from './components/context-menu/SubMenu';
-export { AppWrapper, AuthGate, ImposiumHeader, ImposiumDropdown, Button, ButtonGroupField, ButtonMenu, ButtonMenuItem, Card, CheckboxField, ControlledList, DataTable, DataTablePaginator, FieldWrapper, HRule, ListField, Modal, AdvancedNumberField, NumberField, SelectField, ColorField, Tabs, 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, AssetsTableGlobalCell, AssetsTableStatusCell, AssetsTableNameFilter, AssetsTableNameCell, AssetsTableDurationCell, AssetsTableRateCell, AssetsTableTagsCell, AssetsTableTagsFilter, AssetsTableTagsPivot, AssetsTableComplexTagCell, AssetField, AssetsUploadMenu, FontAssetPreview, DroppableAssetRenderer, PreviewNotAvailable, auth, login, clearCachedAuth, access, setAccessData, storyAdded, storyNameMutated, orgNameMutated, storyDeleted, updateFilters, resetFilters, getAssets, deleteAssets, downloadAssets, addAssetTag, deleteAssetTag, updateAssetName, updateAssetData, doAssetTableHydration, uploadAssets, replaceAsset, selectAsset, deselectAsset, resetSelection, assetFilters, assetList, assetUploads, selectedAssets, getAssetTagList, addAssetTagToList, assetTags, assetActions, activeBatch, batchActions, AuthService, SessionService, API, LegacyAPI, StorageService, Timer, validateAccessLevel, getFirstStoryInOrg, string2HexCode, parameterizeServiceUrl, scrapeEmail, fitToContainer, formattedTime, filterHotkeys, mimetypeConformsToOverlay, validateAssetMimetype, IMAGE_EXTENSIONS, toFixed, getSMPTE, padStart, formatDateDefault, ASSET_TYPES, publish, publishVersion, clearStoryPublishStatus, getStoryPublishStatus, PublishStatusIndicator, AnchorField, SMPTEField, getMediaPreviewStyle, HEADER_HEIGHT, decoupleAssets, deleteAssetsTags, updateAssetStory, FontPicker, cancelAssetUpload, getLastModifiedStoryInOrg, checkStoryId, renderTooltipProps, renderTooltip, ContextMenu, ContextMenuItem, ContextMenuTrigger, Submenu, CopyPropIdButton };
+export { AppWrapper, AuthGate, ImposiumHeader, ImposiumDropdown, Button, ButtonGroupField, ButtonMenu, ButtonMenuItem, Card, CheckboxField, ControlledList, DataTable, DataTablePaginator, FieldWrapper, HRule, ListField, Modal, AdvancedNumberField, NumberField, SelectField, ColorField, Tabs, 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, AssetsTableGlobalCell, AssetsTableStatusCell, AssetsTableNameFilter, AssetsTableNameCell, AssetsTableDurationCell, AssetsTableRateCell, AssetsTableTagsCell, AssetsTableTagsFilter, AssetsTableTagsPivot, AssetsTableComplexTagCell, AssetField, AssetsUploadMenu, FontAssetPreview, DroppableAssetRenderer, PreviewNotAvailable, auth, login, clearCachedAuth, access, setAccessData, storyAdded, storyNameMutated, orgNameMutated, storyDeleted, updateFilters, resetFilters, getAssets, deleteAssets, downloadAssets, addAssetTag, deleteAssetTag, updateAssetName, updateAssetData, doAssetTableHydration, uploadAssets, replaceAsset, selectAsset, deselectAsset, resetSelection, assetFilters, assetList, assetUploads, selectedAssets, getAssetTagList, addAssetTagToList, assetTags, assetActions, activeBatch, batchActions, AuthService, SessionService, API, LegacyAPI, StorageService, Timer, validateAccessLevel, getFirstStoryInOrg, string2HexCode, parameterizeServiceUrl, scrapeEmail, fitToContainer, formattedTime, filterHotkeys, mimetypeConformsToOverlay, validateAssetMimetype, IMAGE_EXTENSIONS, toFixed, getSMPTE, padStart, formatDateDefault, ASSET_TYPES, publish, publishVersion, clearStoryPublishStatus, getStoryPublishStatus, PublishStatusIndicator, AnchorField, SMPTEField, getMediaPreviewStyle, HEADER_HEIGHT, decoupleAssets, deleteAssetsTags, updateAssetStory, FontPicker, cancelAssetUpload, getLastModifiedStoryInOrg, checkStoryId, renderTooltipProps, renderTooltip, ContextMenu, ContextMenuItem, ContextMenuTrigger, Submenu, CopyPropIdButton, formatColor };
 //# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@imposium-hub/components",
-    "version": "2.4.2-1",
+    "version": "2.4.2-2",
     "description": "React & Typescript component / asset library for Imposium front-ends",
     "main": "./dist/cjs/index.js",
     "module": "./dist/esm/index.js",

package/src/Util.ts

@@ -433,3 +433,9 @@ export const getSMPTE = (frameRate, val) => {
 
     return duration;
 };
+
+export const formatColor = (color) => {
+    const { r, g, b, a } = color.rgb;
+    const alpha = color.source === 'hsv' ? 1 : a;
+    return `rgba(${r},${g},${b},${alpha})`;
+};

package/src/components/color-field/ColorField.tsx

@@ -2,6 +2,8 @@ import * as React from 'react';
 import FieldWrapper from '../field-wrapper/FieldWrapper';
 import { IToolTipConfig } from '../Tooltip';
 import { SketchPicker } from '@imposium-hub/react-color';
+import SelectField from '../select-field/SelectField';
+import { formatColor } from '../../Util';
 
 interface IColorFieldProps {
     buttons?: any;
@@ -14,10 +16,13 @@ interface IColorFieldProps {
     presetColors?: any[];
     width?: string | number;
     onChange(e): void;
+    onVariable?: (e) => void;
     info?: string;
     labelPosition?: string;
     pickerPosition?: string;
     labelWidth?: string | number;
+    variableOptions?: any[];
+    colorOption?: string;
 }
 
 interface IColorFieldState {
@@ -86,7 +91,18 @@ class ColorField extends React.PureComponent<IColorFieldProps, IColorFieldState>
     }
 
     private handleChangeComplete(color, e) {
-        return this.props.onChange(color);
+        return this.props.onChange(formatColor(color));
+    }
+
+    private isValidColor(color) {
+        const el = document.createElement('div');
+        el.style.backgroundColor = color;
+        if (el.style.backgroundColor) {
+            return true;
+        } else {
+            this.props.onChange('rgba(0,0,0,1)');
+            return false;
+        }
     }
 
     public render() {
@@ -101,56 +117,79 @@ class ColorField extends React.PureComponent<IColorFieldProps, IColorFieldState>
             info,
             labelPosition,
             pickerPosition,
-            labelWidth
+            labelWidth,
+            colorOption,
+            variableOptions
         } = this.props;
-        const { pickerOpen } = this.state;
-        const disableAlpha = !enableAlpha;
-        const pickerPos = pickerPosition || 'left';
-
-        const picker = pickerOpen ? (
-            <SketchPicker
-                color={value}
-                disableAlpha={disableAlpha}
-                presetColors={presetColors}
-                onChangeComplete={(c, e) => this.handleChangeComplete(c, e)}
-            />
-        ) : null;
-
-        let swatchStyle;
-        if (value === 'transparent' || value === 'rgba(0,0,0,0)') {
-            swatchStyle = {
-                background: this.transparentBg,
-                border: '1px solid #1d1d1d',
-                boxSizing: 'border-box'
-            };
+
+        let selection;
+
+        if (colorOption && colorOption === 'inventory_id') {
+            selection = (
+                <SelectField
+                    label={label}
+                    labelPosition={labelPosition}
+                    labelWidth={labelWidth}
+                    tooltip={tooltip}
+                    key='inventory-id-field'
+                    width={width}
+                    value={value.replace(/[{()}]/g, '')}
+                    options={variableOptions}
+                    onChange={(e) => this.props.onVariable(`{{${e}}}`)}
+                />
+            );
         } else {
-            swatchStyle = {
-                backgroundColor: value
-            };
+            const { pickerOpen } = this.state;
+            const disableAlpha = !enableAlpha;
+            const pickerPos = pickerPosition || 'left';
+            const color = this.isValidColor(value) ? value : 'rgba(0,0,0,1)';
+            const picker = pickerOpen ? (
+                <SketchPicker
+                    color={color}
+                    disableAlpha={disableAlpha}
+                    presetColors={presetColors}
+                    onChangeComplete={(c, e) => this.handleChangeComplete(c, e)}
+                />
+            ) : null;
+
+            let swatchStyle;
+            if (value === 'transparent' || value === 'rgba(0,0,0,0)') {
+                swatchStyle = {
+                    background: this.transparentBg,
+                    border: '1px solid #1d1d1d',
+                    boxSizing: 'border-box'
+                };
+            } else {
+                swatchStyle = {
+                    backgroundColor: color
+                };
+            }
+
+            selection = (
+                <FieldWrapper
+                    customClass='color-field'
+                    label={label}
+                    tooltip={tooltip}
+                    buttons={buttons}
+                    info={info}
+                    labelPosition={labelPosition}
+                    labelWidth={labelWidth}
+                    width={width}>
+                    <div
+                        className='swatch'
+                        style={swatchStyle}
+                        onClick={(e) => this.togglePicker(e)}
+                    />
+                    <div
+                        className={`picker picker-${pickerPos}`}
+                        ref={this.picker}>
+                        {picker}
+                    </div>
+                </FieldWrapper>
+            );
         }
 
-        return (
-            <FieldWrapper
-                customClass='color-field'
-                label={label}
-                tooltip={tooltip}
-                buttons={buttons}
-                info={info}
-                labelPosition={labelPosition}
-                labelWidth={labelWidth}
-                width={width}>
-                <div
-                    className='swatch'
-                    style={swatchStyle}
-                    onClick={(e) => this.togglePicker(e)}
-                />
-                <div
-                    className={`picker picker-${pickerPos}`}
-                    ref={this.picker}>
-                    {picker}
-                </div>
-            </FieldWrapper>
-        );
+        return selection;
     }
 }
 

package/src/index.ts

@@ -143,7 +143,8 @@ import {
     formattedTime,
     getSMPTE,
     checkStoryId,
-    IMAGE_EXTENSIONS
+    IMAGE_EXTENSIONS,
+    formatColor
 } from './Util';
 import PublishStatusIndicator from './components/publish-wizard/publish/PublishStatusIndicator';
 import { getMediaPreviewStyle } from './utils/assets';
@@ -309,5 +310,6 @@ export {
     ContextMenuItem,
     ContextMenuTrigger,
     Submenu,
-    CopyPropIdButton
+    CopyPropIdButton,
+    formatColor
 };