@elliemae/ds-imagelibrarymodal 3.0.0-next.4 → 3.0.0-next.40
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/DSImageLibraryModal.js +3 -2
- package/dist/cjs/DSImageLibraryModal.js.map +2 -2
- package/dist/cjs/components/ImageLibraryModalImpl.js.map +1 -1
- package/dist/cjs/index.js +1 -0
- package/dist/cjs/index.js.map +2 -2
- package/dist/esm/DSImageLibraryModal.js +2 -1
- package/dist/esm/DSImageLibraryModal.js.map +2 -2
- package/dist/esm/components/ImageLibraryModalImpl.js.map +1 -1
- package/dist/esm/index.js +2 -1
- package/dist/esm/index.js.map +1 -1
- package/package.json +7 -7
|
@@ -53,13 +53,14 @@ var __toCommonJS = /* @__PURE__ */ ((cache) => {
|
|
|
53
53
|
})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
|
|
54
54
|
var DSImageLibraryModal_exports = {};
|
|
55
55
|
__export(DSImageLibraryModal_exports, {
|
|
56
|
+
DSImageLibraryModal: () => DSImageLibraryModal,
|
|
56
57
|
default: () => DSImageLibraryModal_default
|
|
57
58
|
});
|
|
58
59
|
var React = __toESM(require("react"));
|
|
59
60
|
var import_react = __toESM(require("react"));
|
|
60
61
|
var import_prop_types = __toESM(require("prop-types"));
|
|
61
62
|
var import_ds_modal = require("@elliemae/ds-modal");
|
|
62
|
-
var
|
|
63
|
+
var import_ds_shared = require("@elliemae/ds-shared");
|
|
63
64
|
var import_ImageLibraryModalImpl = __toESM(require("./components/ImageLibraryModalImpl"));
|
|
64
65
|
const modalTypes = Object.values(import_ds_modal.MODAL_TYPE);
|
|
65
66
|
const DSImageLibraryModal = (_a) => {
|
|
@@ -72,7 +73,7 @@ const DSImageLibraryModal = (_a) => {
|
|
|
72
73
|
modalType = modalTypes[2],
|
|
73
74
|
rejectLabel = "Cancel",
|
|
74
75
|
shouldCloseOnOverlayClick = true,
|
|
75
|
-
size =
|
|
76
|
+
size = import_ds_shared.sizeOptions[3],
|
|
76
77
|
imagesData = [
|
|
77
78
|
{
|
|
78
79
|
url: "https://www.freeiconspng.com/minicovers/no-image-icon-6.png",
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/DSImageLibraryModal.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { MODAL_TYPE } from '@elliemae/ds-modal';\nimport { sizeOptions } from '@elliemae/ds-shared
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,wBAAsB;AACtB,sBAA2B;AAC3B,uBAA4B;AAC5B,mCAAkC;AAElC,MAAM,aAAa,OAAO,OAAO;
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { MODAL_TYPE } from '@elliemae/ds-modal';\nimport { sizeOptions } from '@elliemae/ds-shared';\nimport ImageLibraryModalImpl from './components/ImageLibraryModalImpl';\n\nconst modalTypes = Object.values(MODAL_TYPE);\n\nconst DSImageLibraryModal = ({\n containerProps = {},\n confirmLabel = 'Add',\n disableDoubleClick = false,\n isOpen = true,\n modalTitle = 'Add Image',\n modalType = modalTypes[2],\n rejectLabel = 'Cancel',\n shouldCloseOnOverlayClick = true,\n size = sizeOptions[3],\n imagesData = [\n {\n url: 'https://www.freeiconspng.com/minicovers/no-image-icon-6.png',\n name: 'no image',\n createdBy: 'user:John Doe',\n createdDate: '0000-01-01 00:00 AM UTC',\n },\n ],\n onSelect = () => null,\n ...rest\n}) => (\n <ImageLibraryModalImpl\n confirmLabel={confirmLabel}\n containerProps={containerProps}\n disableDoubleClick={disableDoubleClick}\n imagesData={imagesData}\n isOpen={isOpen}\n modalTitle={modalTitle}\n modalType={modalType}\n onSelect={onSelect}\n rejectLabel={rejectLabel}\n shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n size={size}\n {...rest}\n />\n);\n\n/** Inherits DSModal props */\nDSImageLibraryModal.propTypes = {\n containerProps: PropTypes.shape({}),\n /** List of images src */\n imagesData: PropTypes.arrayOf(\n PropTypes.shape({\n url: PropTypes.string,\n name: PropTypes.string,\n }),\n ),\n /** Handler when user selects an image */\n onSelect: PropTypes.func,\n};\n\nexport { DSImageLibraryModal };\nexport default DSImageLibraryModal;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,wBAAsB;AACtB,sBAA2B;AAC3B,uBAA4B;AAC5B,mCAAkC;AAElC,MAAM,aAAa,OAAO,OAAO,0BAAU;AAE3C,MAAM,sBAAsB,CAAC,OAoB1B;AApB0B,eAC3B;AAAA,qBAAiB,CAAC;AAAA,IAClB,eAAe;AAAA,IACf,qBAAqB;AAAA,IACrB,SAAS;AAAA,IACT,aAAa;AAAA,IACb,YAAY,WAAW;AAAA,IACvB,cAAc;AAAA,IACd,4BAA4B;AAAA,IAC5B,OAAO,6BAAY;AAAA,IACnB,aAAa;AAAA,MACX;AAAA,QACE,KAAK;AAAA,QACL,MAAM;AAAA,QACN,WAAW;AAAA,QACX,aAAa;AAAA,MACf;AAAA,IACF;AAAA,IACA,WAAW,MAAM;AAAA,MAlBU,IAmBxB,iBAnBwB,IAmBxB;AAAA,IAlBH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IAQA;AAAA;AAGA,4DAAC;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,KACI,KACN;AAAA;AAIF,oBAAoB,YAAY;AAAA,EAC9B,gBAAgB,0BAAU,MAAM,CAAC,CAAC;AAAA,EAElC,YAAY,0BAAU,QACpB,0BAAU,MAAM;AAAA,IACd,KAAK,0BAAU;AAAA,IACf,MAAM,0BAAU;AAAA,EAClB,CAAC,CACH;AAAA,EAEA,UAAU,0BAAU;AACtB;AAGA,IAAO,8BAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/ImageLibraryModalImpl.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable max-lines */\nimport React from 'react';\nimport DSModal from '@elliemae/ds-modal';\nimport DSSpinner from '@elliemae/ds-spinner';\nimport { DSIconSizes as ICONS_SIZES, DSIconColors as ICONS_COLORS } from '@elliemae/ds-icon';\nimport { includes } from 'lodash';\nimport ImageLoader from 'react-loading-image';\nimport { ImageMissing } from '@elliemae/ds-icons';\n\nconst elementClassName = 'imglibmodal-element';\n\nexport default class ImageLibraryModalImpl extends React.PureComponent {\n constructor(props) {\n super(props);\n this.state = {\n selected: undefined,\n user: undefined,\n };\n this.preventSpacebarScroll();\n }\n\n componentDidMount() {\n const { imagesData } = this.props;\n if (imagesData) {\n this.handleElementClick({}, imagesData[0]);\n this.focusFirst = true;\n }\n }\n\n getDerivedStateFromProps(nextProps) {\n const { imagesData } = this.props;\n if (!imagesData && nextProps.imagesData) {\n this.setState({ selected: imagesData[0] });\n }\n }\n\n onReject = () => {\n const { onReject, onClose } = this.props;\n if (onReject) {\n onReject();\n } else {\n onClose();\n }\n };\n\n getUser(selected) {\n if (!selected) {\n return '';\n }\n const index = selected.createdBy.lastIndexOf('user:');\n if (index === -1) {\n return selected.createdBy;\n }\n return selected.createdBy.substring(index + 5);\n }\n\n handleElementClick = (e, image) => {\n if (e.key && e.key !== ' ') {\n return;\n }\n const { selected } = this.state;\n const { disableDoubleClick, onConfirm, onSelect } = this.props;\n if (image === selected && onConfirm && !disableDoubleClick) {\n onConfirm();\n return;\n }\n this.setState({\n selected: image,\n user: this.getUser(image),\n });\n if (onSelect) {\n onSelect(image);\n }\n };\n\n preventSpacebarScroll() {\n document.onkeypress = function (e) {\n if (!includes(e.target.className, elementClassName)) {\n return true;\n }\n e = e || window.event;\n const charCode = e.keyCode || e.which;\n if (charCode === 32) {\n e.preventDefault();\n return false;\n }\n return true;\n };\n }\n\n drawDiv(className, content) {\n return <div className={className}>{content}</div>;\n }\n\n drawLabel(className, label, value) {\n return (\n <div className={className}>\n <span className=\"label\">{label}</span>\n <span className=\"value\">{value}</span>\n </div>\n );\n }\n\n renderElements = () => {\n const { imagesData } = this.props;\n if (!imagesData) {\n return 'Empty';\n }\n const { selected } = this.state;\n return imagesData.map((image, idx) => {\n const extras = {};\n const { name, id } = image;\n if (this.focusFirst && idx === 0) {\n extras.ref = (element) => element && element.focus();\n this.focusFirst = undefined;\n } else if (selected && name === selected.name) {\n extras.ref = (element) => element && element.focus();\n }\n return (\n <div\n key={id || `${name}_${idx}`}\n className={elementClassName}\n onClick={(e) => this.handleElementClick(e, image)}\n onKeyUp={(e) => this.handleElementClick(e, image)}\n role=\"button\"\n tabIndex={0}\n {...extras}\n >\n <div className=\"content\">{name}</div>\n </div>\n );\n });\n };\n\n renderSpinner = () => <DSSpinner message=\"Loading...\" size=\"m\" />;\n\n renderError = () => <ImageMissing color={ICONS_COLORS.NEUTRAL} size={ICONS_SIZES.M} />;\n\n render() {\n const { selected, user } = this.state;\n const { containerProps, imagesData, onSelect, disableDoubleClick, ...modalProps } = this.props;\n return (\n <DSModal\n containerProps={containerProps}\n {...modalProps}\n className=\"em-ds-modal-image-library\"\n onReject={this.onReject}\n >\n <div className=\"wrapper\">\n <div className=\"col-1\">\n {this.drawDiv('title', 'Company Images')}\n {this.renderElements()}\n </div>\n <div className=\"col-2\">\n {this.drawDiv('title', selected ? selected.name : '')}\n <ImageLoader\n className=\"image-loader\"\n error={this.renderError}\n loading={this.renderSpinner}\n src={selected ? selected.url : ''}\n />\n {selected && (\n <div className=\"info\">\n {this.drawLabel('info-element', 'Created Date:', selected.createdDate)}\n {this.drawLabel('info-element', 'Created By:', user)}\n </div>\n )}\n </div>\n </div>\n </DSModal>\n );\n }\n}\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAkB;AAClB,sBAAoB;AACpB,wBAAsB;AACtB,qBAAyE;AACzE,oBAAyB;AACzB,iCAAwB;AACxB,sBAA6B;AAE7B,MAAM,mBAAmB;AAEzB,
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/index.js
CHANGED
|
@@ -27,6 +27,7 @@ var __toCommonJS = /* @__PURE__ */ ((cache) => {
|
|
|
27
27
|
})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
|
|
28
28
|
var src_exports = {};
|
|
29
29
|
__export(src_exports, {
|
|
30
|
+
DSImageLibraryModal: () => import_DSImageLibraryModal.DSImageLibraryModal,
|
|
30
31
|
default: () => import_DSImageLibraryModal.default
|
|
31
32
|
});
|
|
32
33
|
var React = __toESM(require("react"));
|
package/dist/cjs/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/index.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["export { default } from './DSImageLibraryModal';\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,
|
|
4
|
+
"sourcesContent": ["export { default, DSImageLibraryModal } from './DSImageLibraryModal';\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,iCAA6C;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -30,7 +30,7 @@ import * as React from "react";
|
|
|
30
30
|
import React2 from "react";
|
|
31
31
|
import PropTypes from "prop-types";
|
|
32
32
|
import { MODAL_TYPE } from "@elliemae/ds-modal";
|
|
33
|
-
import { sizeOptions } from "@elliemae/ds-shared
|
|
33
|
+
import { sizeOptions } from "@elliemae/ds-shared";
|
|
34
34
|
import ImageLibraryModalImpl from "./components/ImageLibraryModalImpl";
|
|
35
35
|
const modalTypes = Object.values(MODAL_TYPE);
|
|
36
36
|
const DSImageLibraryModal = (_a) => {
|
|
@@ -90,6 +90,7 @@ DSImageLibraryModal.propTypes = {
|
|
|
90
90
|
};
|
|
91
91
|
var DSImageLibraryModal_default = DSImageLibraryModal;
|
|
92
92
|
export {
|
|
93
|
+
DSImageLibraryModal,
|
|
93
94
|
DSImageLibraryModal_default as default
|
|
94
95
|
};
|
|
95
96
|
//# sourceMappingURL=DSImageLibraryModal.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DSImageLibraryModal.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport PropTypes from 'prop-types';\nimport { MODAL_TYPE } from '@elliemae/ds-modal';\nimport { sizeOptions } from '@elliemae/ds-shared
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;ACAA;AACA;AACA;AACA;AACA;AAEA,MAAM,aAAa,OAAO,OAAO;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport PropTypes from 'prop-types';\nimport { MODAL_TYPE } from '@elliemae/ds-modal';\nimport { sizeOptions } from '@elliemae/ds-shared';\nimport ImageLibraryModalImpl from './components/ImageLibraryModalImpl';\n\nconst modalTypes = Object.values(MODAL_TYPE);\n\nconst DSImageLibraryModal = ({\n containerProps = {},\n confirmLabel = 'Add',\n disableDoubleClick = false,\n isOpen = true,\n modalTitle = 'Add Image',\n modalType = modalTypes[2],\n rejectLabel = 'Cancel',\n shouldCloseOnOverlayClick = true,\n size = sizeOptions[3],\n imagesData = [\n {\n url: 'https://www.freeiconspng.com/minicovers/no-image-icon-6.png',\n name: 'no image',\n createdBy: 'user:John Doe',\n createdDate: '0000-01-01 00:00 AM UTC',\n },\n ],\n onSelect = () => null,\n ...rest\n}) => (\n <ImageLibraryModalImpl\n confirmLabel={confirmLabel}\n containerProps={containerProps}\n disableDoubleClick={disableDoubleClick}\n imagesData={imagesData}\n isOpen={isOpen}\n modalTitle={modalTitle}\n modalType={modalType}\n onSelect={onSelect}\n rejectLabel={rejectLabel}\n shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}\n size={size}\n {...rest}\n />\n);\n\n/** Inherits DSModal props */\nDSImageLibraryModal.propTypes = {\n containerProps: PropTypes.shape({}),\n /** List of images src */\n imagesData: PropTypes.arrayOf(\n PropTypes.shape({\n url: PropTypes.string,\n name: PropTypes.string,\n }),\n ),\n /** Handler when user selects an image */\n onSelect: PropTypes.func,\n};\n\nexport { DSImageLibraryModal };\nexport default DSImageLibraryModal;\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;ACAA;AACA;AACA;AACA;AACA;AAEA,MAAM,aAAa,OAAO,OAAO,UAAU;AAE3C,MAAM,sBAAsB,CAAC,OAoB1B;AApB0B,eAC3B;AAAA,qBAAiB,CAAC;AAAA,IAClB,eAAe;AAAA,IACf,qBAAqB;AAAA,IACrB,SAAS;AAAA,IACT,aAAa;AAAA,IACb,YAAY,WAAW;AAAA,IACvB,cAAc;AAAA,IACd,4BAA4B;AAAA,IAC5B,OAAO,YAAY;AAAA,IACnB,aAAa;AAAA,MACX;AAAA,QACE,KAAK;AAAA,QACL,MAAM;AAAA,QACN,WAAW;AAAA,QACX,aAAa;AAAA,MACf;AAAA,IACF;AAAA,IACA,WAAW,MAAM;AAAA,MAlBU,IAmBxB,iBAnBwB,IAmBxB;AAAA,IAlBH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IAQA;AAAA;AAGA,8CAAC;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,KACI,KACN;AAAA;AAIF,oBAAoB,YAAY;AAAA,EAC9B,gBAAgB,UAAU,MAAM,CAAC,CAAC;AAAA,EAElC,YAAY,UAAU,QACpB,UAAU,MAAM;AAAA,IACd,KAAK,UAAU;AAAA,IACf,MAAM,UAAU;AAAA,EAClB,CAAC,CACH;AAAA,EAEA,UAAU,UAAU;AACtB;AAGA,IAAO,8BAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/components/ImageLibraryModalImpl.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React from 'react';\nimport DSModal from '@elliemae/ds-modal';\nimport DSSpinner from '@elliemae/ds-spinner';\nimport { DSIconSizes as ICONS_SIZES, DSIconColors as ICONS_COLORS } from '@elliemae/ds-icon';\nimport { includes } from 'lodash';\nimport ImageLoader from 'react-loading-image';\nimport { ImageMissing } from '@elliemae/ds-icons';\n\nconst elementClassName = 'imglibmodal-element';\n\nexport default class ImageLibraryModalImpl extends React.PureComponent {\n constructor(props) {\n super(props);\n this.state = {\n selected: undefined,\n user: undefined,\n };\n this.preventSpacebarScroll();\n }\n\n componentDidMount() {\n const { imagesData } = this.props;\n if (imagesData) {\n this.handleElementClick({}, imagesData[0]);\n this.focusFirst = true;\n }\n }\n\n getDerivedStateFromProps(nextProps) {\n const { imagesData } = this.props;\n if (!imagesData && nextProps.imagesData) {\n this.setState({ selected: imagesData[0] });\n }\n }\n\n onReject = () => {\n const { onReject, onClose } = this.props;\n if (onReject) {\n onReject();\n } else {\n onClose();\n }\n };\n\n getUser(selected) {\n if (!selected) {\n return '';\n }\n const index = selected.createdBy.lastIndexOf('user:');\n if (index === -1) {\n return selected.createdBy;\n }\n return selected.createdBy.substring(index + 5);\n }\n\n handleElementClick = (e, image) => {\n if (e.key && e.key !== ' ') {\n return;\n }\n const { selected } = this.state;\n const { disableDoubleClick, onConfirm, onSelect } = this.props;\n if (image === selected && onConfirm && !disableDoubleClick) {\n onConfirm();\n return;\n }\n this.setState({\n selected: image,\n user: this.getUser(image),\n });\n if (onSelect) {\n onSelect(image);\n }\n };\n\n preventSpacebarScroll() {\n document.onkeypress = function (e) {\n if (!includes(e.target.className, elementClassName)) {\n return true;\n }\n e = e || window.event;\n const charCode = e.keyCode || e.which;\n if (charCode === 32) {\n e.preventDefault();\n return false;\n }\n return true;\n };\n }\n\n drawDiv(className, content) {\n return <div className={className}>{content}</div>;\n }\n\n drawLabel(className, label, value) {\n return (\n <div className={className}>\n <span className=\"label\">{label}</span>\n <span className=\"value\">{value}</span>\n </div>\n );\n }\n\n renderElements = () => {\n const { imagesData } = this.props;\n if (!imagesData) {\n return 'Empty';\n }\n const { selected } = this.state;\n return imagesData.map((image, idx) => {\n const extras = {};\n const { name, id } = image;\n if (this.focusFirst && idx === 0) {\n extras.ref = (element) => element && element.focus();\n this.focusFirst = undefined;\n } else if (selected && name === selected.name) {\n extras.ref = (element) => element && element.focus();\n }\n return (\n <div\n key={id || `${name}_${idx}`}\n className={elementClassName}\n onClick={(e) => this.handleElementClick(e, image)}\n onKeyUp={(e) => this.handleElementClick(e, image)}\n role=\"button\"\n tabIndex={0}\n {...extras}\n >\n <div className=\"content\">{name}</div>\n </div>\n );\n });\n };\n\n renderSpinner = () => <DSSpinner message=\"Loading...\" size=\"m\" />;\n\n renderError = () => <ImageMissing color={ICONS_COLORS.NEUTRAL} size={ICONS_SIZES.M} />;\n\n render() {\n const { selected, user } = this.state;\n const { containerProps, imagesData, onSelect, disableDoubleClick, ...modalProps } = this.props;\n return (\n <DSModal\n containerProps={containerProps}\n {...modalProps}\n className=\"em-ds-modal-image-library\"\n onReject={this.onReject}\n >\n <div className=\"wrapper\">\n <div className=\"col-1\">\n {this.drawDiv('title', 'Company Images')}\n {this.renderElements()}\n </div>\n <div className=\"col-2\">\n {this.drawDiv('title', selected ? selected.name : '')}\n <ImageLoader\n className=\"image-loader\"\n error={this.renderError}\n loading={this.renderSpinner}\n src={selected ? selected.url : ''}\n />\n {selected && (\n <div className=\"info\">\n {this.drawLabel('info-element', 'Created Date:', selected.createdDate)}\n {this.drawLabel('info-element', 'Created By:', user)}\n </div>\n )}\n </div>\n </div>\n </DSModal>\n );\n }\n}\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;ACCA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA,MAAM,mBAAmB;AAEzB,
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/index.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
import { default as default2 } from "./DSImageLibraryModal";
|
|
2
|
+
import { default as default2, DSImageLibraryModal } from "./DSImageLibraryModal";
|
|
3
3
|
export {
|
|
4
|
+
DSImageLibraryModal,
|
|
4
5
|
default2 as default
|
|
5
6
|
};
|
|
6
7
|
//# sourceMappingURL=index.js.map
|
package/dist/esm/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { default } from './DSImageLibraryModal';\n"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export { default, DSImageLibraryModal } from './DSImageLibraryModal';\n"],
|
|
5
5
|
"mappings": "AAAA;ACAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-imagelibrarymodal",
|
|
3
|
-
"version": "3.0.0-next.
|
|
3
|
+
"version": "3.0.0-next.40",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Image Library Modal",
|
|
6
6
|
"files": [
|
|
@@ -43,12 +43,12 @@
|
|
|
43
43
|
"indent": 4
|
|
44
44
|
},
|
|
45
45
|
"dependencies": {
|
|
46
|
-
"@elliemae/ds-icon": "3.0.0-next.
|
|
47
|
-
"@elliemae/ds-icons": "3.0.0-next.
|
|
48
|
-
"@elliemae/ds-modal": "3.0.0-next.
|
|
49
|
-
"@elliemae/ds-shared": "3.0.0-next.
|
|
50
|
-
"@elliemae/ds-spinner": "3.0.0-next.
|
|
51
|
-
"prop-types": "~15.
|
|
46
|
+
"@elliemae/ds-icon": "3.0.0-next.40",
|
|
47
|
+
"@elliemae/ds-icons": "3.0.0-next.40",
|
|
48
|
+
"@elliemae/ds-modal": "3.0.0-next.40",
|
|
49
|
+
"@elliemae/ds-shared": "3.0.0-next.40",
|
|
50
|
+
"@elliemae/ds-spinner": "3.0.0-next.40",
|
|
51
|
+
"prop-types": "~15.8.1",
|
|
52
52
|
"react-loading-image": "~0.5.0"
|
|
53
53
|
},
|
|
54
54
|
"peerDependencies": {
|