@widergy/energy-ui 3.188.7 → 3.190.0

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.
Files changed (22) hide show
  1. package/CHANGELOG.md +25 -2
  2. package/dist/components/UTAttachmentList/index.js +1 -1
  3. package/dist/components/UTPanel/versions/V1/components/ControlAreaSection/index.js +1 -1
  4. package/dist/components/UTPanel/versions/V1/index.js +1 -1
  5. package/dist/components/UTPanel/versions/V1/styles.module.scss +44 -7
  6. package/dist/components/UTSelect/versions/V1/components/ListboxComponent/index.js +1 -1
  7. package/dist/components/UTSelect/versions/V1/components/ListboxComponent/styles.module.scss +8 -0
  8. package/dist/components/UTSelect/versions/V1/components/ListboxComponent/utils.js +1 -0
  9. package/dist/components/UTSelect/versions/V1/index.js +1 -1
  10. package/dist/components/UTSelect/versions/V1/types.js +1 -1
  11. package/dist/deprecated/UTAttachment/index.js +1 -1
  12. package/dist/esm/components/UTAttachmentList/index.js +1 -1
  13. package/dist/esm/components/UTPanel/versions/V1/components/ControlAreaSection/index.js +1 -1
  14. package/dist/esm/components/UTPanel/versions/V1/index.js +1 -1
  15. package/dist/esm/components/UTPanel/versions/V1/styles.module.scss +44 -7
  16. package/dist/esm/components/UTSelect/versions/V1/components/ListboxComponent/index.js +1 -1
  17. package/dist/esm/components/UTSelect/versions/V1/components/ListboxComponent/styles.module.scss +8 -0
  18. package/dist/esm/components/UTSelect/versions/V1/components/ListboxComponent/utils.js +1 -0
  19. package/dist/esm/components/UTSelect/versions/V1/index.js +1 -1
  20. package/dist/esm/components/UTSelect/versions/V1/types.js +1 -1
  21. package/dist/esm/deprecated/UTAttachment/index.js +1 -1
  22. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,9 +1,32 @@
1
- ## [3.188.7](https://github.com/widergy/energy-ui/compare/v3.188.6...v3.188.7) (2026-09-25)
1
+ # [3.190.0](https://github.com/widergy/energy-ui/compare/v3.189.0...v3.190.0) (2026-09-29)
2
2
 
3
3
 
4
4
  ### Bug Fixes
5
5
 
6
- * add test id support for UTRadioGroup V1 ([848b6da](https://github.com/widergy/energy-ui/commit/848b6daab70af10a2a0515992d79e3bdccf49f28))
6
+ * [AXAG-407] utpanel fixes ([#867](https://github.com/widergy/energy-ui/issues/867)) ([6e4f8f5](https://github.com/widergy/energy-ui/commit/6e4f8f51a8f26b128e4f12a5a5f332ed691639d7))
7
+
8
+
9
+ ### Features
10
+
11
+ * [EGIT-399] add menu help text to UTSelect ([#878](https://github.com/widergy/energy-ui/issues/878)) ([965b440](https://github.com/widergy/energy-ui/commit/965b440032e79bf899e0c7e973d5c729b6ebf815))
12
+ * [EGIT-400] Added max options in select ([#879](https://github.com/widergy/energy-ui/issues/879)) ([7262e6b](https://github.com/widergy/energy-ui/commit/7262e6b6be3ed8cb0e1f2346937fe9614112e7f2))
13
+
14
+ # [3.189.0](https://github.com/widergy/energy-ui/compare/v3.188.7...v3.189.0) (2026-09-28)
15
+
16
+ ### Novedades y Mejoras
17
+
18
+ * Los archivos adjuntos en formatos de imagen modernos ahora se convierten automáticamente a un formato compatible al ser cargados, sin interrumpir el flujo del usuario en caso de error durante la conversión. [#874](https://github.com/widergy/Energy-UI/pull/874) [CX-3046](https://widergy.atlassian.net/browse/CX-3046)
19
+
20
+ ### Correcciones
21
+
22
+ * Se corrigió un problema por el que, al adjuntar un archivo que no requería reducción de tamaño, el sistema descartaba silenciosamente la versión procesada del archivo y enviaba el original en su lugar. [#874](https://github.com/widergy/Energy-UI/pull/874) [CX-3046](https://widergy.atlassian.net/browse/CX-3046)
23
+ * Mejoras internas de la plataforma. [`2f31c22`](https://github.com/widergy/Energy-UI/commit/2f31c22)
24
+
25
+ ## [3.188.7](https://github.com/widergy/energy-ui/compare/v3.188.6...v3.188.7) (2026-09-25)
26
+
27
+ ### Correcciones
28
+
29
+ * Se corrigió un problema por el que los identificadores de prueba no se aplicaban correctamente sobre las opciones de los campos de selección tipo radio, lo que impedía su detección en pruebas automatizadas. [#871](https://github.com/widergy/Energy-UI/pull/871) [CX-3138](https://widergy.atlassian.net/browse/CX-3138)
7
30
 
8
31
  ## [3.188.6](https://github.com/widergy/energy-ui/compare/v3.188.5...v3.188.6) (2026-09-24)
9
32
 
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _react=_interopRequireWildcard(require("react")),_propTypes=require("prop-types"),_validate=require("@widergy/web-utils/lib/validate"),_image=require("@widergy/web-utils/lib/image"),_browser=require("@widergy/web-utils/lib/browser"),_isEmpty=_interopRequireDefault(require("lodash/isEmpty")),_buttonTypes=require("../../types/buttonTypes"),_WithTheme=_interopRequireDefault(require("../WithTheme")),_theme=require("./theme"),_constants=require("./constants"),_layout=_interopRequireDefault(require("./layout")),_utils=require("./utils");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var a=new WeakMap,r=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var i,s,n={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return n;if(i=t?r:a){if(i.has(e))return i.get(e);i.set(e,n)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((s=(i=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(s.get||s.set)?i(n,t,s):n[t]=e[t]);return n})(e,t)}const AttachmentListContainer=e=>{var t,a,r,i,s;let{acceptedFileTypes:n,actions:l,allowedPDFUploadSizes:o,classes:p,containerClassname:u,customValidation:d,dataTestId:_,deleteDataTestId:y,disabled:c,disableResize:f,errorClassname:T,field:v,fieldTypes:m=[],hideLabels:g,icon:h,input:b,loadingTextClassname:E,maxFileSize:R=99999999,onLoaded:w,notifyOnInitialLoad:I=!0,previewDataTestId:O,readOnly:A=!1,resizeConfig:C,sanitize:S,theme:z,titleVariant:D}=e;const{areaBackground:F,areaBorderColor:q}=(0,_utils.getUploadIconAreaColors)(z),P=null==v||null===(t=v.configuration)||void 0===t?void 0:t.help_text,x=(null==v||null===(a=v.configuration)||void 0===a?void 0:a.max_file_size)||R,L=(null==v||null===(r=v.configuration)||void 0===r?void 0:r.accepted_file_types)||n,M=(null==v||null===(i=v.configuration)||void 0===i?void 0:i.max_files)||_constants.DEFAULT_MAX_FILES,[W,V]=(0,_react.useState)([]),[j,B]=(0,_react.useState)(!1),[k,U]=(0,_react.useState)(_constants.FORMAT_ERROR_TEXT),X=(0,_react.useRef)(null),[N,Y]=(0,_react.useState)((null==b||null===(s=b.value)||void 0===s?void 0:s.files)||[]),G=(e,t)=>{B(!0),U(t?"".concat(e,"(").concat(t,")"):e)},H=async e=>{const t=e=>new Promise((t,a)=>{const r=new FileReader;r.onload=a=>{(0,_utils.hasPreview)(e)||(0,_utils.isDownloadable)(e)?t({src:a.target.result,file:e}):t({src:null,file:e})},r.onerror=e=>a(e),r.readAsDataURL(e)});try{const a=(await Promise.all(e.map(t))).map(e=>{let{src:t,file:a}=e;return((e,t)=>({...t,src:e}))(t,{type:a.type,name:a.name,size:(0,_utils.getSizeInMB)(a.size),onClick:()=>{return(e=a.name)&&V(t=>t.filter(t=>t.name!==e)),Y(t=>{const a=Object.values(t).filter(t=>t.name!==e);return b.onChange&&b.onChange((0,_isEmpty.default)(a)?null:{files:a}),a}),X.current&&(X.current.value=null),void B(!1);var e}})});V(e=>(0,_utils.getNotRepeatedFiles)([...(e||[]).filter(e=>"loading"!==e.type),...a]))}catch(e){V(e=>(e||[]).filter(e=>"loading"!==e.type)),G(null==e?void 0:e.message)}},Z=async function(){var e,t;let a=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0,r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:[];const i=Array.isArray(b.value)?b.value.length:1;if(a===i)return w&&w(),I&&b.onChange&&b.onChange({files:r}),Y(r),void H(r);const s=Array.isArray(b.value)?b.value.flatMap(e=>Object.values(e)[0]):b.value,n=Array.isArray(b.value)?(null===(e=b.value[a])||void 0===e?void 0:e.url)||(null===(t=s[a])||void 0===t?void 0:t.url):b.value;(0,_utils.getBlobFromUrl)(n,async e=>{if(e){var t,i;const n=Array.isArray(b.value)?(null===(t=b.value[a])||void 0===t?void 0:t.name)||(null===(i=s[a])||void 0===i?void 0:i.name):null,l=new File([e],n||(0,_utils.getDefaultAttachment)(e.type.substring(e.type.indexOf("/")+1),a+1),{type:e.type});Z(a+1,[...r,l])}else V(e=>{let t=!1;return e.map(e=>t||e.type!==_constants.PREVIEW_TYPES.LOADING?e:(t=!0,{...e,type:_constants.PREVIEW_TYPES.ERROR}))}),Z(a+1,r)})};return(0,_react.useEffect)(()=>{var e;if((0,_isEmpty.default)(N)?(0,_isEmpty.default)(null===(e=b.value)||void 0===e?void 0:e.files)||H(b.value.files):H(N),Array.isArray(b.value)&&!(0,_isEmpty.default)(b.value)||b.value&&"string"==typeof b.value){if((0,_isEmpty.default)(W)){const e=Array.isArray(b.value)?b.value.length:1;V(Array.from({length:e},()=>({type:_constants.PREVIEW_TYPES.LOADING})))}Z()}},[b]),_react.default.createElement(_layout.default,{actions:l,acceptedFileTypes:L,areaBackground:F,areaBorderColor:q,classes:p,containerClassname:u,disabled:c,dataTestId:_,deleteDataTestId:y,error:j,errorClassname:T,errorText:k,field:v,fieldTypes:m,fileInputRef:X,helpText:P,hideLabels:g,icon:h,loadingTextClassname:E,maxFiles:M,maxFileSize:(0,_utils.getSizeInMB)(x),onChange:async e=>{var t;const a=(null===(t=b.value)||void 0===t?void 0:t.files)||N,r=Object.values((0,_isEmpty.default)(a)?e.target.files:(0,_utils.getNotRepeatedFiles)([...a,...e.target.files])),i={formatError:_constants.FORMAT_ERROR_TEXT,sizeError:"".concat(_constants.SIZE_ERROR_TEXT," ").concat((0,_utils.getSizeInMB)(x),"MB."),aspectRatioError:"".concat(_constants.ASPECT_RATIO_ERROR_TEXT," ").concat(null==o?void 0:o.map(e=>e.name).join(" - "),")")};B(!1);const s=async e=>{if(e<r.length){if(M&&r.length>M)return void G(_constants.MAX_FILES_ERROR,M);let t=r[e];if(t){let a=!d||await d(t,G);if(a){if(a=await(0,_validate.fileSignatureValidation)(t,m,t.type),!a)return void G(i.formatError);if(S&&(t=await S(t)),a=(0,_validate.fileSizeValidation)(t,x),a&&(0,_utils.isPDF)(t)&&!(0,_isEmpty.default)(o)&&(a=await(0,_utils.pdfAspectRatioValidation)(t,o),!a))return void G(i.aspectRatioError);if(a||f||!(0,_utils.isImage)(t)||(0,_browser.isIE)()||(t=await(0,_image.resizeImage)(t,C),a=(0,_validate.fileSizeValidation)(t,x),r[e]=t),!a)return void G(i.sizeError)}}await s(e+1)}else b.onChange&&b.onChange({files:r}),Y(r),await H(r)};await s(0)},preview:W,previewDataTestId:O,readOnly:A,titleVariant:D})};AttachmentListContainer.propTypes={acceptedFileTypes:_propTypes.string,actions:(0,_propTypes.arrayOf)(_buttonTypes.buttonTypes),allowedPDFUploadSizes:(0,_propTypes.arrayOf)((0,_propTypes.shape)({name:_propTypes.string,heightInPt:_propTypes.number,widthInPt:_propTypes.number,tolerance:_propTypes.number})),classes:(0,_propTypes.objectOf)(_propTypes.string),containerClassname:_propTypes.string,customValidation:_propTypes.func,disabled:_propTypes.bool,dataTestId:_propTypes.string,deleteDataTestId:_propTypes.string,disableResize:_propTypes.bool,errorClassname:_propTypes.string,field:_propTypes.any,fieldTypes:(0,_propTypes.arrayOf)(_propTypes.string),hideLabels:_propTypes.bool,icon:_propTypes.node,input:(0,_propTypes.shape)({value:(0,_propTypes.oneOfType)([_propTypes.string,(0,_propTypes.shape)({name:_propTypes.string,type:_propTypes.string})])}),loadingTextClassname:_propTypes.string,maxFileSize:_propTypes.number,onLoaded:_propTypes.func,notifyOnInitialLoad:_propTypes.bool,previewDataTestId:_propTypes.string,readOnly:_propTypes.bool,resizeConfig:(0,_propTypes.shape)({type:_propTypes.string,maxWidth:_propTypes.number,maxHeight:_propTypes.number}),sanitize:_propTypes.func,theme:_propTypes.any,titleVariant:_propTypes.string};var _default=exports.default=(0,_WithTheme.default)(_theme.retrieveStyle)(AttachmentListContainer);
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _react=_interopRequireWildcard(require("react")),_propTypes=require("prop-types"),_validate=require("@widergy/web-utils/lib/validate"),_image=require("@widergy/web-utils/lib/image"),_browser=require("@widergy/web-utils/lib/browser"),_isEmpty=_interopRequireDefault(require("lodash/isEmpty")),_buttonTypes=require("../../types/buttonTypes"),_WithTheme=_interopRequireDefault(require("../WithTheme")),_theme=require("./theme"),_constants=require("./constants"),_layout=_interopRequireDefault(require("./layout")),_utils=require("./utils");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var a=new WeakMap,r=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var i,s,n={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return n;if(i=t?r:a){if(i.has(e))return i.get(e);i.set(e,n)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((s=(i=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(s.get||s.set)?i(n,t,s):n[t]=e[t]);return n})(e,t)}const AttachmentListContainer=e=>{var t,a,r,i,s;let{acceptedFileTypes:n,actions:l,allowedPDFUploadSizes:o,classes:p,containerClassname:u,customValidation:d,dataTestId:_,deleteDataTestId:y,disabled:c,disableResize:f,errorClassname:T,field:v,fieldTypes:m=[],hideLabels:g,icon:h,input:b,loadingTextClassname:E,maxFileSize:R=99999999,onLoaded:w,notifyOnInitialLoad:I=!0,previewDataTestId:O,readOnly:A=!1,resizeConfig:C,sanitize:S,theme:z,titleVariant:D}=e;const{areaBackground:F,areaBorderColor:q}=(0,_utils.getUploadIconAreaColors)(z),P=null==v||null===(t=v.configuration)||void 0===t?void 0:t.help_text,x=(null==v||null===(a=v.configuration)||void 0===a?void 0:a.max_file_size)||R,L=(null==v||null===(r=v.configuration)||void 0===r?void 0:r.accepted_file_types)||n,M=(null==v||null===(i=v.configuration)||void 0===i?void 0:i.max_files)||_constants.DEFAULT_MAX_FILES,[W,V]=(0,_react.useState)([]),[j,B]=(0,_react.useState)(!1),[k,U]=(0,_react.useState)(_constants.FORMAT_ERROR_TEXT),X=(0,_react.useRef)(null),[N,Y]=(0,_react.useState)((null==b||null===(s=b.value)||void 0===s?void 0:s.files)||[]),G=(e,t)=>{B(!0),U(t?"".concat(e,"(").concat(t,")"):e)},H=async e=>{const t=e=>new Promise((t,a)=>{const r=new FileReader;r.onload=a=>{(0,_utils.hasPreview)(e)||(0,_utils.isDownloadable)(e)?t({src:a.target.result,file:e}):t({src:null,file:e})},r.onerror=e=>a(e),r.readAsDataURL(e)});try{const a=(await Promise.all(e.map(t))).map(e=>{let{src:t,file:a}=e;return((e,t)=>({...t,src:e}))(t,{type:a.type,name:a.name,size:(0,_utils.getSizeInMB)(a.size),onClick:()=>{return(e=a.name)&&V(t=>t.filter(t=>t.name!==e)),Y(t=>{const a=Object.values(t).filter(t=>t.name!==e);return b.onChange&&b.onChange((0,_isEmpty.default)(a)?null:{files:a}),a}),X.current&&(X.current.value=null),void B(!1);var e}})});V(e=>(0,_utils.getNotRepeatedFiles)([...(e||[]).filter(e=>"loading"!==e.type),...a]))}catch(e){V(e=>(e||[]).filter(e=>"loading"!==e.type)),G(null==e?void 0:e.message)}},Z=async function(){var e,t;let a=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0,r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:[];const i=Array.isArray(b.value)?b.value.length:1;if(a===i)return w&&w(),I&&b.onChange&&b.onChange({files:r}),Y(r),void H(r);const s=Array.isArray(b.value)?b.value.flatMap(e=>Object.values(e)[0]):b.value,n=Array.isArray(b.value)?(null===(e=b.value[a])||void 0===e?void 0:e.url)||(null===(t=s[a])||void 0===t?void 0:t.url):b.value;(0,_utils.getBlobFromUrl)(n,async e=>{if(e){var t,i;const n=Array.isArray(b.value)?(null===(t=b.value[a])||void 0===t?void 0:t.name)||(null===(i=s[a])||void 0===i?void 0:i.name):null,l=new File([e],n||(0,_utils.getDefaultAttachment)(e.type.substring(e.type.indexOf("/")+1),a+1),{type:e.type});Z(a+1,[...r,l])}else V(e=>{let t=!1;return e.map(e=>t||e.type!==_constants.PREVIEW_TYPES.LOADING?e:(t=!0,{...e,type:_constants.PREVIEW_TYPES.ERROR}))}),Z(a+1,r)})};return(0,_react.useEffect)(()=>{var e;if((0,_isEmpty.default)(N)?(0,_isEmpty.default)(null===(e=b.value)||void 0===e?void 0:e.files)||H(b.value.files):H(N),Array.isArray(b.value)&&!(0,_isEmpty.default)(b.value)||b.value&&"string"==typeof b.value){if((0,_isEmpty.default)(W)){const e=Array.isArray(b.value)?b.value.length:1;V(Array.from({length:e},()=>({type:_constants.PREVIEW_TYPES.LOADING})))}Z()}},[b]),_react.default.createElement(_layout.default,{actions:l,acceptedFileTypes:L,areaBackground:F,areaBorderColor:q,classes:p,containerClassname:u,disabled:c,dataTestId:_,deleteDataTestId:y,error:j,errorClassname:T,errorText:k,field:v,fieldTypes:m,fileInputRef:X,helpText:P,hideLabels:g,icon:h,loadingTextClassname:E,maxFiles:M,maxFileSize:(0,_utils.getSizeInMB)(x),onChange:async e=>{var t;const a=(null===(t=b.value)||void 0===t?void 0:t.files)||N,r=Object.values((0,_isEmpty.default)(a)?e.target.files:(0,_utils.getNotRepeatedFiles)([...a,...e.target.files])),i={formatError:_constants.FORMAT_ERROR_TEXT,sizeError:"".concat(_constants.SIZE_ERROR_TEXT," ").concat((0,_utils.getSizeInMB)(x),"MB."),aspectRatioError:"".concat(_constants.ASPECT_RATIO_ERROR_TEXT," ").concat(null==o?void 0:o.map(e=>e.name).join(" - "),")")};B(!1);const s=async e=>{if(e<r.length){if(M&&r.length>M)return void G(_constants.MAX_FILES_ERROR,M);let t=r[e];if(t){let a=!d||await d(t,G);if(a){if(a=await(0,_validate.fileSignatureValidation)(t,m,t.type),!a)return void G(i.formatError);if(S)try{t=await S(t)}catch(e){return void G(i.formatError)}if(a=(0,_validate.fileSizeValidation)(t,x),a&&(0,_utils.isPDF)(t)&&!(0,_isEmpty.default)(o)&&(a=await(0,_utils.pdfAspectRatioValidation)(t,o),!a))return void G(i.aspectRatioError);if(a||f||!(0,_utils.isImage)(t)||(0,_browser.isIE)()||(t=await(0,_image.resizeImage)(t,C),a=(0,_validate.fileSizeValidation)(t,x)),r[e]=t,!a)return void G(i.sizeError)}}await s(e+1)}else b.onChange&&b.onChange({files:r}),Y(r),await H(r)};await s(0)},preview:W,previewDataTestId:O,readOnly:A,titleVariant:D})};AttachmentListContainer.propTypes={acceptedFileTypes:_propTypes.string,actions:(0,_propTypes.arrayOf)(_buttonTypes.buttonTypes),allowedPDFUploadSizes:(0,_propTypes.arrayOf)((0,_propTypes.shape)({name:_propTypes.string,heightInPt:_propTypes.number,widthInPt:_propTypes.number,tolerance:_propTypes.number})),classes:(0,_propTypes.objectOf)(_propTypes.string),containerClassname:_propTypes.string,customValidation:_propTypes.func,disabled:_propTypes.bool,dataTestId:_propTypes.string,deleteDataTestId:_propTypes.string,disableResize:_propTypes.bool,errorClassname:_propTypes.string,field:_propTypes.any,fieldTypes:(0,_propTypes.arrayOf)(_propTypes.string),hideLabels:_propTypes.bool,icon:_propTypes.node,input:(0,_propTypes.shape)({value:(0,_propTypes.oneOfType)([_propTypes.string,(0,_propTypes.shape)({name:_propTypes.string,type:_propTypes.string})])}),loadingTextClassname:_propTypes.string,maxFileSize:_propTypes.number,onLoaded:_propTypes.func,notifyOnInitialLoad:_propTypes.bool,previewDataTestId:_propTypes.string,readOnly:_propTypes.bool,resizeConfig:(0,_propTypes.shape)({type:_propTypes.string,maxWidth:_propTypes.number,maxHeight:_propTypes.number}),sanitize:_propTypes.func,theme:_propTypes.any,titleVariant:_propTypes.string};var _default=exports.default=(0,_WithTheme.default)(_theme.retrieveStyle)(AttachmentListContainer);
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _react=_interopRequireDefault(require("react")),_propTypes=require("prop-types"),_UTButton=_interopRequireDefault(require("../../../../../UTButton")),_UTLabel=_interopRequireDefault(require("../../../../../UTLabel")),_index=_interopRequireDefault(require("../../../../../UTProgressBar/index.js")),_testIds=require("../../../../../../constants/testIds"),_stylesModule=_interopRequireDefault(require("../../styles.module.scss"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var o=arguments[t];for(var a in o)({}).hasOwnProperty.call(o,a)&&(e[a]=o[a])}return e},_extends.apply(null,arguments)}const{panel:panel}=_testIds.TEST_IDS,ControlAreaSection=e=>{let{backButton:t,backButtonClass:o,backButtonDataTestId:a,classes:r,closeButtonClass:n,closeButtonDataTestId:s,currentPage:l,currentStep:p,hideCloseButton:u,iconBackClass:c,iconCloseClass:i,isWorkflow:d,nextButton:_,onClose:f,onGoBack:T,onOpen:y,open:b,panelIsCollapsible:B,showBackButton:C,showPagination:m,stepsCount:g,totalPages:I}=e;return C||m||!u||d||B?_react.default.createElement("div",{className:_stylesModule.default.controlAreaContainer},_react.default.createElement("div",{className:_stylesModule.default.controlAreaBar},_react.default.createElement("div",{className:_stylesModule.default.controlLeftArea},C&&_react.default.createElement("div",{className:_stylesModule.default.backButtonContainer},_react.default.createElement(_UTButton.default,{classNames:{icon:c,root:o},dataTestId:a,Icon:"IconArrowLeft",onClick:T,variant:"text"})),m&&_react.default.createElement("div",{className:_stylesModule.default.paginationContainer},_react.default.createElement(_UTLabel.default,{colorTheme:"gray"},"".concat(l," / ").concat(I)),_react.default.createElement(_UTButton.default,_extends({dataTestId:panel.paginationPrev,Icon:"IconChevronLeft",variant:"text"},t)),_react.default.createElement(_UTButton.default,_extends({dataTestId:panel.paginationNext,Icon:"IconChevronRight",variant:"text"},_)))),(B||!u)&&_react.default.createElement(_UTButton.default,{classNames:{icon:i,root:n},dataTestId:s,Icon:B?"IconLayoutSidebarRight":"IconX",onClick:B&&!b?y:f,variant:"text"})),d&&_react.default.createElement(_index.default,{classNames:{barColorPrimary:r.barColorPrimary,colorPrimary:r.colorPrimary,container:_stylesModule.default.progressBarContainer},value:100*p/g})):null};ControlAreaSection.propTypes={backButton:_propTypes.object,backButtonClass:_propTypes.string,backButtonDataTestId:_propTypes.string,classes:_propTypes.object,closeButtonClass:_propTypes.string,closeButtonDataTestId:_propTypes.string,currentPage:_propTypes.number,currentStep:_propTypes.number,hideCloseButton:_propTypes.bool,iconBackClass:_propTypes.string,iconCloseClass:_propTypes.string,isWorkflow:_propTypes.bool,nextButton:_propTypes.object,onClose:_propTypes.func,onGoBack:_propTypes.func,onOpen:_propTypes.func,open:_propTypes.bool,panelIsCollapsible:_propTypes.bool,showBackButton:_propTypes.bool,showPagination:_propTypes.bool,stepsCount:_propTypes.number,totalPages:_propTypes.number};var _default=exports.default=ControlAreaSection;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _react=_interopRequireDefault(require("react")),_propTypes=require("prop-types"),_UTButton=_interopRequireDefault(require("../../../../../UTButton")),_UTLabel=_interopRequireDefault(require("../../../../../UTLabel")),_index=_interopRequireDefault(require("../../../../../UTProgressBar/index.js")),_testIds=require("../../../../../../constants/testIds"),_stylesModule=_interopRequireDefault(require("../../styles.module.scss"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var o=arguments[t];for(var a in o)({}).hasOwnProperty.call(o,a)&&(e[a]=o[a])}return e},_extends.apply(null,arguments)}const{panel:panel}=_testIds.TEST_IDS,ControlAreaSection=e=>{let{backButton:t,backButtonClass:o,backButtonDataTestId:a,classes:r,closeButtonClass:n,closeButtonDataTestId:s,currentPage:l,currentStep:p,hideCloseButton:c,iconBackClass:u,iconCloseClass:i,isWorkflow:d,nextButton:_,onClose:f,onGoBack:T,onOpen:y,open:C,panelIsCollapsed:b,panelIsCollapsible:B,showBackButton:m,showPagination:I,stepsCount:g,totalPages:v}=e;return m||I||!c||d||B?_react.default.createElement("div",{className:_stylesModule.default.controlAreaContainer},_react.default.createElement("div",{className:_stylesModule.default.controlAreaBar},_react.default.createElement("div",{className:"".concat(_stylesModule.default.controlLeftArea," ").concat(b?_stylesModule.default.controlLeftAreaCollapsed:"")},m&&_react.default.createElement("div",{className:_stylesModule.default.backButtonContainer},_react.default.createElement(_UTButton.default,{classNames:{icon:u,root:o},dataTestId:a,Icon:"IconArrowLeft",onClick:T,variant:"text"})),I&&_react.default.createElement("div",{className:_stylesModule.default.paginationContainer},_react.default.createElement(_UTLabel.default,{colorTheme:"gray"},"".concat(l," / ").concat(v)),_react.default.createElement(_UTButton.default,_extends({dataTestId:panel.paginationPrev,Icon:"IconChevronLeft",variant:"text"},t)),_react.default.createElement(_UTButton.default,_extends({dataTestId:panel.paginationNext,Icon:"IconChevronRight",variant:"text"},_)))),(B||!c)&&_react.default.createElement(_UTButton.default,{classNames:{icon:i,root:n},dataTestId:s,Icon:B?"IconLayoutSidebarRight":"IconX",onClick:B&&!C?y:f,variant:"text"})),!b&&d&&_react.default.createElement(_index.default,{classNames:{barColorPrimary:r.barColorPrimary,colorPrimary:r.colorPrimary,container:_stylesModule.default.progressBarContainer},value:100*p/g})):null};ControlAreaSection.propTypes={backButton:_propTypes.object,backButtonClass:_propTypes.string,backButtonDataTestId:_propTypes.string,classes:_propTypes.object,closeButtonClass:_propTypes.string,closeButtonDataTestId:_propTypes.string,currentPage:_propTypes.number,currentStep:_propTypes.number,hideCloseButton:_propTypes.bool,iconBackClass:_propTypes.string,iconCloseClass:_propTypes.string,isWorkflow:_propTypes.bool,nextButton:_propTypes.object,onClose:_propTypes.func,onGoBack:_propTypes.func,onOpen:_propTypes.func,open:_propTypes.bool,panelIsCollapsed:_propTypes.bool,panelIsCollapsible:_propTypes.bool,showBackButton:_propTypes.bool,showPagination:_propTypes.bool,stepsCount:_propTypes.number,totalPages:_propTypes.number};var _default=exports.default=ControlAreaSection;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _react=_interopRequireWildcard(require("react")),_SwipeableDrawer=_interopRequireDefault(require("@material-ui/core/SwipeableDrawer")),_propTypes=require("prop-types"),_isEmpty=_interopRequireDefault(require("lodash/isEmpty")),_index=_interopRequireDefault(require("../../../WithTheme/index.js")),_testIds=require("../../../../constants/testIds.js"),_classesUtils=require("../../../../utils/classesUtils.js"),_AdditionalContentModule=_interopRequireDefault(require("./components/AdditionalContentModule")),_ControlAreaSection=_interopRequireDefault(require("./components/ControlAreaSection")),_HeaderSection=_interopRequireDefault(require("./components/HeaderSection")),_BodySection=_interopRequireDefault(require("./components/BodySection")),_stylesModule=_interopRequireDefault(require("./styles.module.scss")),_constants=require("./constants.js"),_theme=require("./theme");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var o=new WeakMap,n=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var s,p,a={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return a;if(s=t?n:o){if(s.has(e))return s.get(e);s.set(e,a)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((p=(s=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(p.get||p.set)?s(a,t,p):a[t]=e[t]);return a})(e,t)}function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var o=arguments[t];for(var n in o)({}).hasOwnProperty.call(o,n)&&(e[n]=o[n])}return e},_extends.apply(null,arguments)}const{panel:panel}=_testIds.TEST_IDS,UTPanel=e=>{var t;let{additionalContent:o,backButtonDataTestId:n=panel.backButton,BackdropProps:s={},children:p,classes:a,classNames:r,closeButtonDataTestId:l=panel.closeButton,collapsableHeader:i=!1,collapsablePanel:c=!1,currentStep:d=1,CustomHeaderComponent:u,disableScrollbar:_=!1,HeaderComponent:y,headerItems:T,headerMainActionButton:f={},headerSecondaryActionButton:b={},hideCloseButton:m=!1,hideHeader:C=!1,hideMainButton:h=!1,inline:g=!1,isWorkflow:B=!1,mainActionDataTestId:S=panel.mainAction,mainButton:P={},modalProps:M,onClose:k,onEndReachedCallback:I,onGoBack:w=()=>{},onOpen:q=()=>{},open:D,openAdditionalContentRequest:A,paginationProps:v={},panelSide:j,perfectScrollbarOptions:O,pretitleComponent:R,secondaryActionDataTestId:E=panel.secondaryAction,showBackButton:H=!1,showMainStatus:x=!1,showPagination:W=!1,showTag:N=!1,singleHeaderItemsColumn:U=!1,size:z="M",statusProps:G={},stepsCount:Z,subtitle:F="",tagProps:J={},title:K="",titleDataTestId:L=panel.title,titleProps:Q={},...V}=e;const X=(0,_react.useMemo)(()=>(0,_classesUtils.mergeClasses)(a,r),[r,a]),[Y,$]=(0,_react.useState)(null);(0,_react.useEffect)(()=>{var e;o&&o.length>0&&(null!==(e=o[0])&&void 0!==e&&e.collapse?$(null):$(o[0].id))},[o]),(0,_react.useEffect)(()=>{null!=A&&A.id&&$(A.id)},[A]);const ee=c&&g,te=ee&&!D,oe=!(0,_isEmpty.default)(o),{nextButton:ne={},backButton:se={},currentPage:pe=1,totalPages:ae=1}=v,{backButton:re,closeButton:le,iconBack:ie,iconClose:ce,perfectScrollbar:de,...ue}=X;return _react.default.createElement(_SwipeableDrawer.default,_extends({anchor:j,BackdropProps:{...s,classes:{root:ue.backdrop,...null==s?void 0:s.classes}},classes:{...ue,paper:"\n ".concat(_stylesModule.default.paper,"\n ").concat(ee&&D&&_stylesModule.default.collapsedPaper,"\n ").concat(ue.paper,"\n ").concat(_stylesModule.default[_constants.SIZES[z]],"\n ").concat(oe&&Y&&_stylesModule.default.withAdditionalContent,"\n ").concat(oe&&!Y&&_stylesModule.default.withAdditionalContentCollapsed,"\n "),root:ue.root,docked:"\n ".concat(_stylesModule.default[_constants.SIZES[z]],"\n ").concat(_stylesModule.default.docked,"\n ").concat(te&&_stylesModule.default.collapsed,"\n ").concat(!D&&!c&&_stylesModule.default.closedPersistentPanel,"\n ").concat(oe&&Y&&_stylesModule.default.withAdditionalContentDocked,"\n ").concat(oe&&!Y&&_stylesModule.default.withAdditionalContentCollapsedDocked,"\n ")},disablePortal:g,disableSwipeToOpen:!0,ModalProps:{...M},onClose:k,onOpen:q,open:ee||D,swipeAreaWidth:0,variant:g?c?"permanent":"persistent":"temporary"},V),!te&&_react.default.createElement("div",{className:_stylesModule.default.panelWrapper},_react.default.createElement(_ControlAreaSection.default,{backButton:se,backButtonClass:re,backButtonDataTestId:n,classes:X,closeButtonClass:le,closeButtonDataTestId:l,currentPage:pe,currentStep:d,hideCloseButton:m,iconBackClass:ie,iconCloseClass:ce,isWorkflow:B,nextButton:ne,onClose:k,onGoBack:w,onOpen:q,open:D,panelIsCollapsible:ee,showBackButton:H,showPagination:W,stepsCount:Z,totalPages:ae}),_react.default.createElement("div",{className:_stylesModule.default.contentRowContainer},_react.default.createElement("div",{className:_stylesModule.default.mainContentSection},_react.default.createElement(_HeaderSection.default,{classes:X,collapsableHeader:i,CustomHeaderComponent:u,HeaderComponent:y,headerItems:T,headerMainActionButton:f,headerSecondaryActionButton:b,hideHeader:C,mainActionDataTestId:S,pretitleComponent:R,secondaryActionDataTestId:E,showMainStatus:x,showTag:N,singleHeaderItemsColumn:U,statusProps:G,subtitle:F,tagProps:J,title:K,titleClass:X.title,titleDataTestId:L,titleProps:Q}),_react.default.createElement(_BodySection.default,{bodyContainerClass:"".concat(_stylesModule.default.bodyContainer," ").concat(null!==(t=null==X?void 0:X.bodyContainer)&&void 0!==t?t:""),disableScrollbar:_,hideMainButton:h,mainButton:P,onEndReachedCallback:I,perfectScrollbarClass:de,perfectScrollbarOptions:O},p)),oe&&_react.default.createElement(_AdditionalContentModule.default,{activeId:Y,additionalContent:o,onSelectItem:$}))))};UTPanel.propTypes={additionalContent:(0,_propTypes.arrayOf)((0,_propTypes.shape)({id:_propTypes.string.isRequired,Icon:_propTypes.string.isRequired,count:_propTypes.number,BodyComponent:_propTypes.elementType.isRequired,tooltipProps:_propTypes.object.isRequired})),backButtonDataTestId:_propTypes.string,BackdropProps:_propTypes.object,classes:(0,_propTypes.objectOf)(_propTypes.string),classNames:_propTypes.object,closeButtonDataTestId:_propTypes.string,collapsableHeader:_propTypes.bool,collapsablePanel:_propTypes.bool,currentStep:_propTypes.number,disableScrollbar:_propTypes.bool,CustomHeaderComponent:_propTypes.elementType,HeaderComponent:(0,_propTypes.oneOfType)([_propTypes.element,_propTypes.elementType]),headerItems:(0,_propTypes.arrayOf)((0,_propTypes.shape)({title:_propTypes.string,icon:_propTypes.string,value:_propTypes.string})),headerMainActionButton:(0,_propTypes.shape)({callBack:_propTypes.func,colorTheme:_propTypes.string,text:_propTypes.string,variant:_propTypes.string}),headerSecondaryActionButton:(0,_propTypes.shape)({callBack:_propTypes.func,colorTheme:_propTypes.string,text:_propTypes.string,variant:_propTypes.string}),hideCloseButton:_propTypes.bool,hideHeader:_propTypes.bool,hideMainButton:_propTypes.bool,inline:_propTypes.bool,isWorkflow:_propTypes.bool,mainActionDataTestId:_propTypes.string,mainButton:_propTypes.object,modalProps:_propTypes.object,onClose:_propTypes.func,onEndReachedCallback:_propTypes.func,onGoBack:_propTypes.func,onOpen:_propTypes.func,open:_propTypes.bool,openAdditionalContentRequest:_propTypes.object,panelSide:_propTypes.string,perfectScrollbarOptions:_propTypes.object,pretitleComponent:(0,_propTypes.oneOfType)([_propTypes.element,_propTypes.elementType]),secondaryActionDataTestId:_propTypes.string,singleHeaderItemsColumn:_propTypes.bool,size:(0,_propTypes.oneOf)(Object.keys(_constants.SIZES)),showBackButton:_propTypes.bool,showMainStatus:_propTypes.bool,showTag:_propTypes.bool,showPagination:_propTypes.bool,statusProps:_propTypes.object,stepsCount:_propTypes.number,currentPage:_propTypes.number,totalPages:_propTypes.number,subtitle:_propTypes.string,paginationProps:_propTypes.object,tagProps:(0,_propTypes.shape)({classes:(0,_propTypes.objectOf)(_propTypes.string),className:_propTypes.string,Icon:_propTypes.elementType,iconProps:_propTypes.object,labelDataTestId:_propTypes.string,size:_propTypes.string,title:_propTypes.string,type:_propTypes.string,variant:_propTypes.string,withoutIcon:_propTypes.bool}),title:_propTypes.string,titleDataTestId:_propTypes.string,titleProps:_propTypes.object};var _default=exports.default=(0,_index.default)(_theme.retrieveStyle)(UTPanel);
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _react=_interopRequireWildcard(require("react")),_SwipeableDrawer=_interopRequireDefault(require("@material-ui/core/SwipeableDrawer")),_propTypes=require("prop-types"),_isEmpty=_interopRequireDefault(require("lodash/isEmpty")),_index=_interopRequireDefault(require("../../../WithTheme/index.js")),_testIds=require("../../../../constants/testIds.js"),_classesUtils=require("../../../../utils/classesUtils.js"),_AdditionalContentModule=_interopRequireDefault(require("./components/AdditionalContentModule")),_ControlAreaSection=_interopRequireDefault(require("./components/ControlAreaSection")),_HeaderSection=_interopRequireDefault(require("./components/HeaderSection")),_BodySection=_interopRequireDefault(require("./components/BodySection")),_stylesModule=_interopRequireDefault(require("./styles.module.scss")),_constants=require("./constants.js"),_theme=require("./theme");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var o=new WeakMap,n=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var s,p,a={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return a;if(s=t?n:o){if(s.has(e))return s.get(e);s.set(e,a)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((p=(s=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(p.get||p.set)?s(a,t,p):a[t]=e[t]);return a})(e,t)}function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var o=arguments[t];for(var n in o)({}).hasOwnProperty.call(o,n)&&(e[n]=o[n])}return e},_extends.apply(null,arguments)}const{panel:panel}=_testIds.TEST_IDS,UTPanel=e=>{var t;let{additionalContent:o,backButtonDataTestId:n=panel.backButton,BackdropProps:s={},children:p,classes:a,classNames:r,closeButtonDataTestId:l=panel.closeButton,collapsableHeader:i=!1,collapsablePanel:c=!1,currentStep:d=1,CustomHeaderComponent:u,disableScrollbar:_=!1,HeaderComponent:y,headerItems:T,headerMainActionButton:f={},headerSecondaryActionButton:b={},hideCloseButton:m=!1,hideHeader:C=!1,hideMainButton:h=!1,inline:g=!1,isWorkflow:B=!1,mainActionDataTestId:S=panel.mainAction,mainButton:P={},modalProps:M,onClose:k,onEndReachedCallback:I,onGoBack:w=()=>{},onOpen:q=()=>{},open:D,openAdditionalContentRequest:A,paginationProps:v={},panelSide:j,perfectScrollbarOptions:O,pretitleComponent:R,secondaryActionDataTestId:E=panel.secondaryAction,showBackButton:H=!1,showMainStatus:x=!1,showPagination:W=!1,showTag:N=!1,singleHeaderItemsColumn:U=!1,size:z="M",statusProps:G={},stepsCount:Z,subtitle:F="",tagProps:J={},title:K="",titleDataTestId:L=panel.title,titleProps:Q={},...V}=e;const X=(0,_react.useMemo)(()=>(0,_classesUtils.mergeClasses)(a,r),[r,a]),[Y,$]=(0,_react.useState)(null);(0,_react.useEffect)(()=>{var e;o&&o.length>0&&(null!==(e=o[0])&&void 0!==e&&e.collapse?$(null):$(o[0].id))},[o]),(0,_react.useEffect)(()=>{null!=A&&A.id&&$(A.id)},[A]);const ee=c&&g,te=ee&&!D,oe=!(0,_isEmpty.default)(o),{nextButton:ne={},backButton:se={},currentPage:pe=1,totalPages:ae=1}=v,{backButton:re,closeButton:le,iconBack:ie,iconClose:ce,perfectScrollbar:de,...ue}=X;return _react.default.createElement(_SwipeableDrawer.default,_extends({anchor:j,BackdropProps:{...s,classes:{root:ue.backdrop,...null==s?void 0:s.classes}},classes:{...ue,paper:"\n ".concat(_stylesModule.default.paper,"\n ").concat(ee&&D&&_stylesModule.default.collapsedPaper,"\n ").concat(ue.paper,"\n ").concat(_stylesModule.default[_constants.SIZES[z]],"\n ").concat(oe&&Y&&_stylesModule.default.withAdditionalContent,"\n ").concat(oe&&!Y&&_stylesModule.default.withAdditionalContentCollapsed,"\n "),root:ue.root,docked:"\n ".concat(_stylesModule.default[_constants.SIZES[z]],"\n ").concat(_stylesModule.default.docked,"\n ").concat(te&&_stylesModule.default.collapsed,"\n ").concat(!D&&!c&&_stylesModule.default.closedPersistentPanel,"\n ").concat(oe&&Y&&_stylesModule.default.withAdditionalContentDocked,"\n ").concat(oe&&!Y&&_stylesModule.default.withAdditionalContentCollapsedDocked,"\n ")},disablePortal:g,disableSwipeToOpen:!0,ModalProps:{...M},onClose:k,onOpen:q,open:ee||D,swipeAreaWidth:0,variant:g?c?"permanent":"persistent":"temporary"},V),_react.default.createElement("div",{className:_stylesModule.default.panelWrapper},_react.default.createElement(_ControlAreaSection.default,{backButton:se,backButtonClass:re,backButtonDataTestId:n,classes:X,closeButtonClass:le,closeButtonDataTestId:l,currentPage:pe,currentStep:d,hideCloseButton:m,iconBackClass:ie,iconCloseClass:ce,isWorkflow:B,nextButton:ne,onClose:k,onGoBack:w,onOpen:q,open:D,panelIsCollapsed:te,panelIsCollapsible:ee,showBackButton:H,showPagination:W,stepsCount:Z,totalPages:ae}),!te&&_react.default.createElement("div",{className:_stylesModule.default.contentRowContainer},_react.default.createElement("div",{className:_stylesModule.default.mainContentSection},_react.default.createElement(_HeaderSection.default,{classes:X,collapsableHeader:i,CustomHeaderComponent:u,HeaderComponent:y,headerItems:T,headerMainActionButton:f,headerSecondaryActionButton:b,hideHeader:C,mainActionDataTestId:S,pretitleComponent:R,secondaryActionDataTestId:E,showMainStatus:x,showTag:N,singleHeaderItemsColumn:U,statusProps:G,subtitle:F,tagProps:J,title:K,titleClass:X.title,titleDataTestId:L,titleProps:Q}),_react.default.createElement(_BodySection.default,{bodyContainerClass:"".concat(_stylesModule.default.bodyContainer," ").concat(null!==(t=null==X?void 0:X.bodyContainer)&&void 0!==t?t:""),disableScrollbar:_,hideMainButton:h,mainButton:P,onEndReachedCallback:I,perfectScrollbarClass:de,perfectScrollbarOptions:O},p)),oe&&_react.default.createElement(_AdditionalContentModule.default,{activeId:Y,additionalContent:o,onSelectItem:$}))))};UTPanel.propTypes={additionalContent:(0,_propTypes.arrayOf)((0,_propTypes.shape)({id:_propTypes.string.isRequired,Icon:_propTypes.string.isRequired,count:_propTypes.number,BodyComponent:_propTypes.elementType.isRequired,tooltipProps:_propTypes.object.isRequired})),backButtonDataTestId:_propTypes.string,BackdropProps:_propTypes.object,classes:(0,_propTypes.objectOf)(_propTypes.string),classNames:_propTypes.object,closeButtonDataTestId:_propTypes.string,collapsableHeader:_propTypes.bool,collapsablePanel:_propTypes.bool,currentStep:_propTypes.number,disableScrollbar:_propTypes.bool,CustomHeaderComponent:_propTypes.elementType,HeaderComponent:(0,_propTypes.oneOfType)([_propTypes.element,_propTypes.elementType]),headerItems:(0,_propTypes.arrayOf)((0,_propTypes.shape)({title:_propTypes.string,icon:_propTypes.string,value:_propTypes.string})),headerMainActionButton:(0,_propTypes.shape)({callBack:_propTypes.func,colorTheme:_propTypes.string,text:_propTypes.string,variant:_propTypes.string}),headerSecondaryActionButton:(0,_propTypes.shape)({callBack:_propTypes.func,colorTheme:_propTypes.string,text:_propTypes.string,variant:_propTypes.string}),hideCloseButton:_propTypes.bool,hideHeader:_propTypes.bool,hideMainButton:_propTypes.bool,inline:_propTypes.bool,isWorkflow:_propTypes.bool,mainActionDataTestId:_propTypes.string,mainButton:_propTypes.object,modalProps:_propTypes.object,onClose:_propTypes.func,onEndReachedCallback:_propTypes.func,onGoBack:_propTypes.func,onOpen:_propTypes.func,open:_propTypes.bool,openAdditionalContentRequest:_propTypes.object,panelSide:_propTypes.string,perfectScrollbarOptions:_propTypes.object,pretitleComponent:(0,_propTypes.oneOfType)([_propTypes.element,_propTypes.elementType]),secondaryActionDataTestId:_propTypes.string,singleHeaderItemsColumn:_propTypes.bool,size:(0,_propTypes.oneOf)(Object.keys(_constants.SIZES)),showBackButton:_propTypes.bool,showMainStatus:_propTypes.bool,showTag:_propTypes.bool,showPagination:_propTypes.bool,statusProps:_propTypes.object,stepsCount:_propTypes.number,currentPage:_propTypes.number,totalPages:_propTypes.number,subtitle:_propTypes.string,paginationProps:_propTypes.object,tagProps:(0,_propTypes.shape)({classes:(0,_propTypes.objectOf)(_propTypes.string),className:_propTypes.string,Icon:_propTypes.elementType,iconProps:_propTypes.object,labelDataTestId:_propTypes.string,size:_propTypes.string,title:_propTypes.string,type:_propTypes.string,variant:_propTypes.string,withoutIcon:_propTypes.bool}),title:_propTypes.string,titleDataTestId:_propTypes.string,titleProps:_propTypes.object};var _default=exports.default=(0,_index.default)(_theme.retrieveStyle)(UTPanel);
@@ -1,5 +1,5 @@
1
1
  $body-component-width: 450px;
2
- $collapsed-panel-size: 58px;
2
+ $collapsed-panel-size: 54px;
3
3
  $large-panel-size: 600px;
4
4
  $medium-panel-size: 450px;
5
5
  $sidebar-width: 56px;
@@ -24,18 +24,27 @@ $additional-content-total: $body-component-width + $sidebar-width;
24
24
  display: flex;
25
25
  flex: 1;
26
26
  gap: var(--UT-panel-gap-sm, 8px);
27
+ opacity: 1;
28
+ overflow: hidden;
29
+ transition: flex-grow 0.3s ease, opacity 0.3s ease;
30
+ }
31
+
32
+ .controlLeftAreaCollapsed {
33
+ flex-grow: 0;
34
+ opacity: 0;
35
+ pointer-events: none;
27
36
  }
28
37
 
29
38
  .backButtonContainer {
30
39
  align-items: center;
31
40
  display: flex;
41
+ flex-shrink: 0;
32
42
  }
33
43
 
34
44
  .controlAreaBar {
35
45
  align-items: center;
36
46
  display: flex;
37
- gap: var(--UT-panel-gap-sm, 8px);
38
- justify-content: space-between;
47
+ justify-content: center;
39
48
  padding: var(--UT-panel-padding-xs, 8px);
40
49
  }
41
50
 
@@ -48,7 +57,9 @@ $additional-content-total: $body-component-width + $sidebar-width;
48
57
  .paginationContainer {
49
58
  align-items: center;
50
59
  display: flex;
60
+ flex-shrink: 0;
51
61
  grid-gap: var(--UT-panel-gap-lg, 16px);
62
+ white-space: nowrap;
52
63
  }
53
64
 
54
65
  .contentRowContainer {
@@ -148,6 +159,14 @@ $additional-content-total: $body-component-width + $sidebar-width;
148
159
  &.withAdditionalContentCollapsed {
149
160
  width: $small-panel-size + $sidebar-width;
150
161
  }
162
+
163
+ &.withAdditionalContentDocked {
164
+ width: $small-panel-size + $additional-content-total;
165
+ }
166
+
167
+ &.withAdditionalContentCollapsedDocked {
168
+ width: $small-panel-size + $sidebar-width;
169
+ }
151
170
  }
152
171
 
153
172
  .large {
@@ -160,6 +179,14 @@ $additional-content-total: $body-component-width + $sidebar-width;
160
179
  &.withAdditionalContentCollapsed {
161
180
  width: $large-panel-size + $sidebar-width;
162
181
  }
182
+
183
+ &.withAdditionalContentDocked {
184
+ width: $large-panel-size + $additional-content-total;
185
+ }
186
+
187
+ &.withAdditionalContentCollapsedDocked {
188
+ width: $large-panel-size + $sidebar-width;
189
+ }
163
190
  }
164
191
 
165
192
  .medium {
@@ -172,6 +199,14 @@ $additional-content-total: $body-component-width + $sidebar-width;
172
199
  &.withAdditionalContentCollapsed {
173
200
  width: $medium-panel-size + $sidebar-width;
174
201
  }
202
+
203
+ &.withAdditionalContentDocked {
204
+ width: $medium-panel-size + $additional-content-total;
205
+ }
206
+
207
+ &.withAdditionalContentCollapsedDocked {
208
+ width: $medium-panel-size + $sidebar-width;
209
+ }
175
210
  }
176
211
 
177
212
  .bodyContainer {
@@ -207,6 +242,7 @@ $additional-content-total: $body-component-width + $sidebar-width;
207
242
  .paper {
208
243
  overflow: hidden;
209
244
  position: relative;
245
+ transition: width 0.3s ease;
210
246
  z-index: 1;
211
247
  }
212
248
 
@@ -215,10 +251,6 @@ $additional-content-total: $body-component-width + $sidebar-width;
215
251
  }
216
252
  }
217
253
 
218
- .withAdditionalContentCollapsedDocked {
219
- transition: width 0.3s ease;
220
- }
221
-
222
254
  .closedPersistentPanel {
223
255
  width: 0;
224
256
  }
@@ -226,6 +258,11 @@ $additional-content-total: $body-component-width + $sidebar-width;
226
258
  .collapsed {
227
259
  width: $collapsed-panel-size;
228
260
 
261
+ &.withAdditionalContentDocked,
262
+ &.withAdditionalContentCollapsedDocked {
263
+ width: $collapsed-panel-size;
264
+ }
265
+
229
266
  .small,
230
267
  .medium,
231
268
  .large {
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _isEmpty=_interopRequireDefault(require("lodash/isEmpty")),_react=_interopRequireWildcard(require("react")),_reactPerfectScrollbar=_interopRequireDefault(require("react-perfect-scrollbar")),_propTypes=require("prop-types"),_isFinite=_interopRequireDefault(require("lodash/isFinite")),_UTLabel=_interopRequireDefault(require("../../../../../UTLabel")),_UTCheckList=_interopRequireDefault(require("../../../../../UTCheckList")),_constants=require("../../../../../UTCheckList/versions/V1/constants"),_stylesModule=_interopRequireDefault(require("./styles.module.scss")),_constants2=require("./constants");function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,a=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var n,s,o={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return o;if(n=t?a:r){if(n.has(e))return n.get(e);n.set(e,o)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((s=(n=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(s.get||s.set)?n(o,t,s):o[t]=e[t]);return o})(e,t)}function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var a in r)({}).hasOwnProperty.call(r,a)&&(e[a]=r[a])}return e},_extends.apply(null,arguments)}const ListboxComponent=e=>{let{CustomRow:t,dataTestId:r,filteredOptions:a,fixedBottomOption:n,handleSelectionChange:s,horizontalSpacing:o=_constants.SPACING.SMALL,itemDataTestId:p,maxHeight:i=_constants2.DEFAULT_MAX_HEIGHT,multiple:l,noMatchesText:u,value:_,verticalSpacing:c=_constants.SPACING.SMALL}=e;const f=(0,_react.useMemo)(()=>(0,_isEmpty.default)(a),[a]),d=(0,_react.useMemo)(()=>(0,_isFinite.default)(i)?i:_constants2.DEFAULT_MAX_HEIGHT,[i]),y=(0,_react.useRef)(null),[T,m]=(0,_react.useState)(0);(0,_react.useLayoutEffect)(()=>{y.current&&m(y.current.offsetHeight)},[n]);const g=d-T,h={CustomRow:t,horizontalSpacing:o,isSimple:!l,itemDataTestId:p,onChange:s,reversed:!0,showSelectAll:!1,value:l?_:[_],variant:"button",version:"V1",verticalSpacing:c};return _react.default.createElement("div",{className:_stylesModule.default.listbox},f?_react.default.createElement(_UTLabel.default,{colorTheme:"gray",className:_stylesModule.default.noOptionsLabel},u):_react.default.createElement(_reactPerfectScrollbar.default,{style:{maxHeight:g}},_react.default.createElement(_UTCheckList.default,_extends({},h,{dataTestId:r,options:a}))),n&&_react.default.createElement("div",{ref:y},_react.default.createElement("div",{className:_stylesModule.default.fixedOptionDivider}),_react.default.createElement(_UTCheckList.default,_extends({},h,{onChange:e=>{l||0!==e.length?s(e):s([n.value])},options:[n]}))))};ListboxComponent.propTypes={CustomRow:_propTypes.elementType,dataTestId:_propTypes.string,filteredOptions:(0,_propTypes.arrayOf)((0,_propTypes.shape)({name:_propTypes.string,value:(0,_propTypes.oneOfType)([_propTypes.string,_propTypes.number])})),fixedBottomOption:(0,_propTypes.shape)({name:_propTypes.string,value:(0,_propTypes.oneOfType)([_propTypes.string,_propTypes.number])}),handleSelectionChange:_propTypes.func,horizontalSpacing:_propTypes.string,itemDataTestId:_propTypes.string,maxHeight:_propTypes.number,multiple:_propTypes.bool,noMatchesText:_propTypes.string,value:(0,_propTypes.oneOfType)([(0,_propTypes.arrayOf)((0,_propTypes.oneOfType)([_propTypes.string,_propTypes.number])),_propTypes.string,_propTypes.number]),verticalSpacing:_propTypes.string};var _default=exports.default=ListboxComponent;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _isEmpty=_interopRequireDefault(require("lodash/isEmpty")),_react=_interopRequireWildcard(require("react")),_reactPerfectScrollbar=_interopRequireDefault(require("react-perfect-scrollbar")),_propTypes=require("prop-types"),_isFinite=_interopRequireDefault(require("lodash/isFinite")),_UTLabel=_interopRequireDefault(require("../../../../../UTLabel")),_UTCheckList=_interopRequireDefault(require("../../../../../UTCheckList")),_constants=require("../../../../../UTCheckList/versions/V1/constants"),_stylesModule=_interopRequireDefault(require("./styles.module.scss")),_constants2=require("./constants"),_utils=require("./utils");function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,a=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var s,n,p={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return p;if(s=t?a:r){if(s.has(e))return s.get(e);s.set(e,p)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((n=(s=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(n.get||n.set)?s(p,t,n):p[t]=e[t]);return p})(e,t)}function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var a in r)({}).hasOwnProperty.call(r,a)&&(e[a]=r[a])}return e},_extends.apply(null,arguments)}const ListboxComponent=e=>{let{CustomRow:t,dataTestId:r,filteredOptions:a,fixedBottomOption:s,handleSelectionChange:n,helpText:p,helpTextDataTestId:o,horizontalSpacing:l=_constants.SPACING.SMALL,itemDataTestId:i,maxHeight:u=_constants2.DEFAULT_MAX_HEIGHT,maxOptions:_,multiple:c,noMatchesText:d,value:f,verticalSpacing:T=_constants.SPACING.SMALL}=e;const y=(0,_react.useMemo)(()=>(0,_isEmpty.default)(a),[a]),m=(0,_react.useMemo)(()=>(0,_isFinite.default)(u)?u:_constants2.DEFAULT_MAX_HEIGHT,[u]),h=(0,_react.useRef)(null),[g,v]=(0,_react.useState)(0);(0,_react.useLayoutEffect)(()=>{h.current&&v(h.current.offsetHeight)},[s]);const b=m-g,x={CustomRow:t,horizontalSpacing:l,isSimple:!c,itemDataTestId:i,onChange:n,reversed:!0,showSelectAll:!1,value:c?f:[f],variant:"button",version:"V1",verticalSpacing:T},O=p&&_react.default.createElement("div",{className:_stylesModule.default.helpText,onMouseDown:e=>e.preventDefault(),role:"presentation"},_react.default.createElement(_UTLabel.default,{className:_stylesModule.default.helpTextLabel,colorTheme:"gray",dataTestId:o,shade:"04",variant:"small"},p));return _react.default.createElement("div",{className:_stylesModule.default.listbox},y?_react.default.createElement(_react.default.Fragment,null,O,_react.default.createElement(_UTLabel.default,{colorTheme:"gray",className:_stylesModule.default.noOptionsLabel},d)):_react.default.createElement(_reactPerfectScrollbar.default,{style:{maxHeight:b}},O,_react.default.createElement(_UTCheckList.default,_extends({},x,{dataTestId:r,options:(0,_utils.limitOptions)(a,f,_)}))),s&&_react.default.createElement("div",{ref:h},_react.default.createElement("div",{className:_stylesModule.default.fixedOptionDivider}),_react.default.createElement(_UTCheckList.default,_extends({},x,{onChange:e=>{c||0!==e.length?n(e):n([s.value])},options:(0,_utils.limitOptions)([s],f,_)}))))};ListboxComponent.propTypes={CustomRow:_propTypes.elementType,dataTestId:_propTypes.string,filteredOptions:(0,_propTypes.arrayOf)((0,_propTypes.shape)({name:_propTypes.string,value:(0,_propTypes.oneOfType)([_propTypes.string,_propTypes.number])})),fixedBottomOption:(0,_propTypes.shape)({name:_propTypes.string,value:(0,_propTypes.oneOfType)([_propTypes.string,_propTypes.number])}),handleSelectionChange:_propTypes.func,helpText:_propTypes.string,helpTextDataTestId:_propTypes.string,horizontalSpacing:_propTypes.string,itemDataTestId:_propTypes.string,maxHeight:_propTypes.number,maxOptions:_propTypes.number,multiple:_propTypes.bool,noMatchesText:_propTypes.string,value:(0,_propTypes.oneOfType)([(0,_propTypes.arrayOf)((0,_propTypes.oneOfType)([_propTypes.string,_propTypes.number])),_propTypes.string,_propTypes.number]),verticalSpacing:_propTypes.string};var _default=exports.default=ListboxComponent;
@@ -3,6 +3,14 @@
3
3
  flex-direction: column;
4
4
  }
5
5
 
6
+ .helpText {
7
+ padding: var(--padding-sm, 12px) 0;
8
+ }
9
+
10
+ .helpTextLabel {
11
+ font-style: italic;
12
+ }
13
+
6
14
  .noOptionsLabel {
7
15
  text-align: center;
8
16
  }
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.limitOptions=void 0;const limitOptions=(i,t,e)=>!e||!Array.isArray(t)||t.length<e?i:i.map(i=>({...i,disabled:i.disabled||!t.includes(i.value)}));exports.limitOptions=limitOptions;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _clone=_interopRequireDefault(require("lodash/clone")),_react=_interopRequireWildcard(require("react")),_lab=require("@material-ui/lab"),_Popper=_interopRequireDefault(require("@material-ui/core/Popper")),_UTFieldLabel=_interopRequireDefault(require("../../../UTFieldLabel")),_UTLabel=_interopRequireDefault(require("../../../UTLabel")),_UTPaper=_interopRequireDefault(require("../../../UTPaper")),_UTValidation=_interopRequireDefault(require("../../../UTValidation")),_utils=require("../../../UTValidation/utils"),_inputs=require("../../../../constants/inputs"),_InputComponent=_interopRequireDefault(require("./components/InputComponent")),_ListboxComponent=_interopRequireDefault(require("./components/ListboxComponent")),_types=require("./types"),_stylesModule=_interopRequireDefault(require("./styles.module.scss")),_constants=require("./constants"),_utils2=require("./utils");function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var a=new WeakMap,r=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var l,n,o={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return o;if(l=t?r:a){if(l.has(e))return l.get(e);l.set(e,o)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((n=(l=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(n.get||n.set)?l(o,t,n):o[t]=e[t]);return o})(e,t)}function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var r in a)({}).hasOwnProperty.call(a,r)&&(e[r]=a[r])}return e},_extends.apply(null,arguments)}const UTSelect=e=>{let{action:t,actions:a,alwaysShowPlaceholder:r=!0,autocompleteProps:l={},className:n,clearable:o=!0,CustomRow:s,dataTestId:i,disabled:u,disableFilterOptions:c=!1,error:p,errorDataTestId:d,fixedBottomOption:_,freeWidth:f=!1,hideSingleCategoryTitle:m=!1,paperClassName:y,helpText:T,icon:b,inputSize:h,itemDataTestId:g,listDataTestId:q,listProps:v={},menuWidth:C,multiple:x=!1,noMatchesText:O="No hay coincidencias con tu búsqueda",noOptionsText:R="No hay opciones disponibles",onChange:D=()=>{},onChangeSearchTerm:M=()=>{},options:L=[],placeholder:P,prefix:S,readOnly:w,required:U,suffix:E,title:I,titleVariant:A=_inputs.TITLE_VARIANTS.large,value:V=(x?[]:null),variant:N=_constants.VARIANTS.select,withAutoReset:W=!0}=e;const k=(0,_react.useMemo)(()=>{if(!L||0===L.length)return[];const e=(0,_clone.default)(L).map(e=>({...e,name:"".concat(e.name)})),t=new Map;e.forEach(e=>{t.has(e.category)||t.set(e.category,t.size)});const a=e.sort((e,a)=>t.get(e.category)-t.get(a.category));return m&&t.size<=1?a.map(e=>{let{category:t,...a}=e;return a}):a},[L,m]),j=(0,_react.useMemo)(()=>_?[...k,_]:k,[k,_]),[z,F]=(0,_react.useState)(!1),[B,G]=(0,_react.useState)((0,_utils2.getDisplayValue)(V,j,x)),[H,J]=(0,_react.useState)(!!B),[K,Q]=(0,_react.useState)(k),X=(0,_react.useRef)(null);(0,_react.useEffect)(()=>{const e=_&&(x?Array.isArray(V)&&V.includes(_.value):V===(null==_?void 0:_.value));W&&!e&&(0,_utils2.shouldReset)(V,k,x)&&(D(null),Q((0,_utils2.sortOptions)(k,null,x)))},[x,D,k,V,W,_]),(0,_react.useEffect)(()=>{if(!z){const e=(0,_utils2.getDisplayValue)(V,j,x);G(e),J(e)}},[V,j,x,z]),(0,_react.useEffect)(()=>{z&&Q((0,_utils2.sortOptions)(k,V,x))},[k]),(0,_react.useEffect)(()=>{Q((0,_utils2.sortOptions)(k,V,x))},[]),(0,_react.useEffect)(()=>{z&&Q((0,_utils2.sortOptions)(k,V,x))},[z]);const Y=(0,_react.useMemo)(()=>p&&(0,_utils.formatErrorToValidation)(p),[p]),Z=N===_constants.VARIANTS.picker,$=(0,_react.useMemo)(()=>{const e=c||Z?K:K.filter(e=>"".concat(e.name).toLowerCase().includes(B.toLowerCase()));return _?e.filter(e=>e.value!==_.value):e},[K,B,c,Z,_]),ee=(0,_react.useCallback)(e=>{null==M||M(e),G(e)},[M]),te=(0,_react.useCallback)(e=>{F(!1);const t=(0,_utils2.getDisplayValue)(e,j,x);ee(t),J(""!==t)},[_utils2.getDisplayValue,j,x,ee]),ae=e=>{const t=x?e:e.length>0?e[0]:"";var a;(D(t),x)||(null===(a=X.current)||void 0===a||a.blur(),te(t))},re=()=>{J(!1),ee(""),F(!0)},le=()=>{te(V)},ne=()=>{D(x?[]:null),ee(""),J(!1),F(!1)},oe=(0,_react.useMemo)(()=>(0,_utils2.getLeftAdornments)({error:p,multiple:x,value:V,prefix:S,icon:b}),[x,V,S,b]),se=(0,_react.useMemo)(()=>(0,_utils2.getRightAdornments)({action:t,clearable:o,disabled:u,handleClearSelection:ne,readOnly:w,showClearButton:H,suffix:E,variant:N}),[E,H,o,u,t,ne,N]),ie=(0,_react.useMemo)(()=>({CustomRow:s,dataTestId:q,filteredOptions:$,fixedBottomOption:_,handleSelectionChange:ae,itemDataTestId:g,multiple:x,noMatchesText:O,value:V,...v}),[s,$,_,ae,x,O,V,v]),ue=(0,_react.useRef)(C);ue.current=C;const ce=(0,_react.useCallback)(e=>{const t=ue.current;return _react.default.createElement(_Popper.default,_extends({},e,t?{placement:"bottom-start"}:{},{style:t?{...e.style,width:t}:e.style}))},[]),pe=_react.default.createElement(_UTLabel.default,{className:_stylesModule.default.noOptionsLabel,colorTheme:"gray"},R);return _react.default.createElement("div",{className:"".concat(_stylesModule.default.container," ").concat(n)},I&&_react.default.createElement(_UTFieldLabel.default,{actions:a,required:U,size:A},I),_react.default.createElement(_lab.Autocomplete,_extends({classes:{...f&&!C?{popper:_stylesModule.default.popper}:{},...y?{paper:y}:{}},PopperComponent:ce,disabled:u||w,getOptionLabel:e=>"".concat(e.name),ListboxComponent:_ListboxComponent.default,ListboxProps:ie,multiple:x,noOptionsText:pe,onClose:()=>F(!1),onOpen:()=>F(!0),open:z,options:k,PaperComponent:_UTPaper.default,renderInput:e=>_react.default.createElement(_InputComponent.default,{alwaysShowPlaceholder:r,dataTestId:i,disabled:u,error:p,inputRef:X,inputSize:h,leftAdornments:oe,onBlur:le,onChange:ee,onFocus:re,params:e,placeholder:P,readOnly:w,rightAdornments:se,value:B,variant:N})},l)),T&&_react.default.createElement(_UTLabel.default,{colorTheme:"gray",variant:"small"},T),Y&&_react.default.createElement(_UTValidation.default,{dataTestId:d,validationData:Y}))};UTSelect.propTypes=_types.utselectTypes;var _default=exports.default=UTSelect;
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _clone=_interopRequireDefault(require("lodash/clone")),_react=_interopRequireWildcard(require("react")),_lab=require("@material-ui/lab"),_Popper=_interopRequireDefault(require("@material-ui/core/Popper")),_UTFieldLabel=_interopRequireDefault(require("../../../UTFieldLabel")),_UTLabel=_interopRequireDefault(require("../../../UTLabel")),_UTPaper=_interopRequireDefault(require("../../../UTPaper")),_UTValidation=_interopRequireDefault(require("../../../UTValidation")),_utils=require("../../../UTValidation/utils"),_inputs=require("../../../../constants/inputs"),_InputComponent=_interopRequireDefault(require("./components/InputComponent")),_ListboxComponent=_interopRequireDefault(require("./components/ListboxComponent")),_types=require("./types"),_stylesModule=_interopRequireDefault(require("./styles.module.scss")),_constants=require("./constants"),_utils2=require("./utils");function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var a=new WeakMap,r=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var l,n,o={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return o;if(l=t?r:a){if(l.has(e))return l.get(e);l.set(e,o)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((n=(l=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(n.get||n.set)?l(o,t,n):o[t]=e[t]);return o})(e,t)}function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var r in a)({}).hasOwnProperty.call(a,r)&&(e[r]=a[r])}return e},_extends.apply(null,arguments)}const UTSelect=e=>{let{action:t,actions:a,alwaysShowPlaceholder:r=!0,autocompleteProps:l={},className:n,clearable:o=!0,CustomRow:s,dataTestId:i,disabled:u,disableFilterOptions:c=!1,error:p,errorDataTestId:d,fixedBottomOption:_,freeWidth:f=!1,hideSingleCategoryTitle:m=!1,paperClassName:T,helpText:y,icon:h,inputSize:b,itemDataTestId:g,listDataTestId:q,listProps:x={},maxOptions:v,menuHelpText:O,menuHelpTextDataTestId:C,menuWidth:R,multiple:D=!1,noMatchesText:M="No hay coincidencias con tu búsqueda",noOptionsText:I="No hay opciones disponibles",onChange:L=()=>{},onChangeSearchTerm:P=()=>{},options:S=[],placeholder:w,prefix:U,readOnly:E,required:A,suffix:V,title:N,titleVariant:W=_inputs.TITLE_VARIANTS.large,value:k=(D?[]:null),variant:j=_constants.VARIANTS.select,withAutoReset:z=!0}=e;const F=(0,_react.useMemo)(()=>{if(!S||0===S.length)return[];const e=(0,_clone.default)(S).map(e=>({...e,name:"".concat(e.name)})),t=new Map;e.forEach(e=>{t.has(e.category)||t.set(e.category,t.size)});const a=e.sort((e,a)=>t.get(e.category)-t.get(a.category));return m&&t.size<=1?a.map(e=>{let{category:t,...a}=e;return a}):a},[S,m]),B=(0,_react.useMemo)(()=>_?[...F,_]:F,[F,_]),[H,G]=(0,_react.useState)(!1),[J,K]=(0,_react.useState)((0,_utils2.getDisplayValue)(k,B,D)),[Q,X]=(0,_react.useState)(!!J),[Y,Z]=(0,_react.useState)(F),$=(0,_react.useRef)(null);(0,_react.useEffect)(()=>{const e=_&&(D?Array.isArray(k)&&k.includes(_.value):k===(null==_?void 0:_.value));z&&!e&&(0,_utils2.shouldReset)(k,F,D)&&(L(null),Z((0,_utils2.sortOptions)(F,null,D)))},[D,L,F,k,z,_]),(0,_react.useEffect)(()=>{if(!H){const e=(0,_utils2.getDisplayValue)(k,B,D);K(e),X(e)}},[k,B,D,H]),(0,_react.useEffect)(()=>{H&&Z((0,_utils2.sortOptions)(F,k,D))},[F]),(0,_react.useEffect)(()=>{Z((0,_utils2.sortOptions)(F,k,D))},[]),(0,_react.useEffect)(()=>{H&&Z((0,_utils2.sortOptions)(F,k,D))},[H]);const ee=(0,_react.useMemo)(()=>p&&(0,_utils.formatErrorToValidation)(p),[p]),te=j===_constants.VARIANTS.picker,ae=(0,_react.useMemo)(()=>{const e=c||te?Y:Y.filter(e=>"".concat(e.name).toLowerCase().includes(J.toLowerCase()));return _?e.filter(e=>e.value!==_.value):e},[Y,J,c,te,_]),re=(0,_react.useCallback)(e=>{null==P||P(e),K(e)},[P]),le=(0,_react.useCallback)(e=>{G(!1);const t=(0,_utils2.getDisplayValue)(e,B,D);re(t),X(""!==t)},[_utils2.getDisplayValue,B,D,re]),ne=e=>{const t=D?e:e.length>0?e[0]:"";var a;(L(t),D)||(null===(a=$.current)||void 0===a||a.blur(),le(t))},oe=()=>{X(!1),re(""),G(!0)},se=()=>{le(k)},ie=()=>{L(D?[]:null),re(""),X(!1),G(!1)},ue=(0,_react.useMemo)(()=>(0,_utils2.getLeftAdornments)({error:p,multiple:D,value:k,prefix:U,icon:h}),[D,k,U,h]),ce=(0,_react.useMemo)(()=>(0,_utils2.getRightAdornments)({action:t,clearable:o,disabled:u,handleClearSelection:ie,readOnly:E,showClearButton:Q,suffix:V,variant:j}),[V,Q,o,u,t,ie,j]),pe=(0,_react.useMemo)(()=>({CustomRow:s,dataTestId:q,filteredOptions:ae,fixedBottomOption:_,handleSelectionChange:ne,helpText:O,helpTextDataTestId:C,itemDataTestId:g,maxOptions:v,multiple:D,noMatchesText:M,value:k,...x}),[s,ae,_,ne,v,O,C,D,M,k,x]),de=(0,_react.useRef)(R);de.current=R;const _e=(0,_react.useCallback)(e=>{const t=de.current;return _react.default.createElement(_Popper.default,_extends({},e,t?{placement:"bottom-start"}:{},{style:t?{...e.style,width:t}:e.style}))},[]),fe=_react.default.createElement(_UTLabel.default,{className:_stylesModule.default.noOptionsLabel,colorTheme:"gray"},I);return _react.default.createElement("div",{className:"".concat(_stylesModule.default.container," ").concat(n)},N&&_react.default.createElement(_UTFieldLabel.default,{actions:a,required:A,size:W},N),_react.default.createElement(_lab.Autocomplete,_extends({classes:{...f&&!R?{popper:_stylesModule.default.popper}:{},...T?{paper:T}:{}},PopperComponent:_e,disabled:u||E,getOptionLabel:e=>"".concat(e.name),ListboxComponent:_ListboxComponent.default,ListboxProps:pe,multiple:D,noOptionsText:fe,onClose:()=>G(!1),onOpen:()=>G(!0),open:H,options:F,PaperComponent:_UTPaper.default,renderInput:e=>_react.default.createElement(_InputComponent.default,{alwaysShowPlaceholder:r,dataTestId:i,disabled:u,error:p,inputRef:$,inputSize:b,leftAdornments:ue,onBlur:se,onChange:re,onFocus:oe,params:e,placeholder:w,readOnly:E,rightAdornments:ce,value:J,variant:j})},l)),y&&_react.default.createElement(_UTLabel.default,{colorTheme:"gray",variant:"small"},y),ee&&_react.default.createElement(_UTValidation.default,{dataTestId:d,validationData:ee}))};UTSelect.propTypes=_types.utselectTypes;var _default=exports.default=UTSelect;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.utselectTypes=void 0;var _propTypes=require("prop-types"),_buttonTypes=require("../../../../types/buttonTypes"),_constants=require("./constants");const utselectTypes=exports.utselectTypes={action:(0,_propTypes.shape)({Icon:_propTypes.string,onClick:_propTypes.func,size:_propTypes.string}),actions:(0,_propTypes.arrayOf)(_buttonTypes.buttonTypes),alwaysShowPlaceholder:_propTypes.bool,autocompleteProps:_propTypes.object,className:_propTypes.string,clearable:_propTypes.bool,CustomRow:_propTypes.elementType,dataTestId:_propTypes.string,disabled:_propTypes.bool,disableFilterOptions:_propTypes.bool,error:_propTypes.string,errorDataTestId:_propTypes.string,fixedBottomOption:(0,_propTypes.shape)({name:_propTypes.string,value:(0,_propTypes.oneOfType)([_propTypes.string,_propTypes.number])}),freeWidth:_propTypes.bool,hideSingleCategoryTitle:_propTypes.bool,paperClassName:_propTypes.string,helpText:_propTypes.string,icon:_propTypes.string,inputSize:_propTypes.string,itemDataTestId:_propTypes.string,listDataTestId:_propTypes.string,listProps:_propTypes.object,menuWidth:_propTypes.string,multiple:_propTypes.bool,noMatchesText:_propTypes.string,noOptionsText:_propTypes.string,onChange:_propTypes.func,onChangeSearchTerm:_propTypes.func,options:(0,_propTypes.arrayOf)((0,_propTypes.shape)({name:_propTypes.string,value:(0,_propTypes.oneOfType)([_propTypes.string,_propTypes.number])})),placeholder:_propTypes.string,prefix:_propTypes.string,readOnly:_propTypes.bool,required:_propTypes.bool,suffix:_propTypes.string,title:_propTypes.string,titleVariant:_propTypes.string,value:(0,_propTypes.oneOfType)([_propTypes.string,(0,_propTypes.arrayOf)((0,_propTypes.oneOfType)([_propTypes.string,_propTypes.number]))]),variant:(0,_propTypes.oneOf)(Object.values(_constants.VARIANTS)),withAutoReset:_propTypes.bool};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.utselectTypes=void 0;var _propTypes=require("prop-types"),_buttonTypes=require("../../../../types/buttonTypes"),_constants=require("./constants");const utselectTypes=exports.utselectTypes={action:(0,_propTypes.shape)({Icon:_propTypes.string,onClick:_propTypes.func,size:_propTypes.string}),actions:(0,_propTypes.arrayOf)(_buttonTypes.buttonTypes),alwaysShowPlaceholder:_propTypes.bool,autocompleteProps:_propTypes.object,className:_propTypes.string,clearable:_propTypes.bool,CustomRow:_propTypes.elementType,dataTestId:_propTypes.string,disabled:_propTypes.bool,disableFilterOptions:_propTypes.bool,error:_propTypes.string,errorDataTestId:_propTypes.string,fixedBottomOption:(0,_propTypes.shape)({name:_propTypes.string,value:(0,_propTypes.oneOfType)([_propTypes.string,_propTypes.number])}),freeWidth:_propTypes.bool,hideSingleCategoryTitle:_propTypes.bool,paperClassName:_propTypes.string,helpText:_propTypes.string,icon:_propTypes.string,inputSize:_propTypes.string,itemDataTestId:_propTypes.string,listDataTestId:_propTypes.string,listProps:_propTypes.object,maxOptions:_propTypes.number,menuHelpText:_propTypes.string,menuHelpTextDataTestId:_propTypes.string,menuWidth:_propTypes.string,multiple:_propTypes.bool,noMatchesText:_propTypes.string,noOptionsText:_propTypes.string,onChange:_propTypes.func,onChangeSearchTerm:_propTypes.func,options:(0,_propTypes.arrayOf)((0,_propTypes.shape)({name:_propTypes.string,value:(0,_propTypes.oneOfType)([_propTypes.string,_propTypes.number])})),placeholder:_propTypes.string,prefix:_propTypes.string,readOnly:_propTypes.bool,required:_propTypes.bool,suffix:_propTypes.string,title:_propTypes.string,titleVariant:_propTypes.string,value:(0,_propTypes.oneOfType)([_propTypes.string,(0,_propTypes.arrayOf)((0,_propTypes.oneOfType)([_propTypes.string,_propTypes.number]))]),variant:(0,_propTypes.oneOf)(Object.values(_constants.VARIANTS)),withAutoReset:_propTypes.bool};
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _react=_interopRequireWildcard(require("react")),_propTypes=require("prop-types"),_validate=require("@widergy/web-utils/lib/validate"),_image=require("@widergy/web-utils/lib/image"),_browser=require("@widergy/web-utils/lib/browser"),_array=require("@widergy/web-utils/lib/array"),_WithTheme=_interopRequireDefault(require("../../components/WithTheme")),_buttonTypes=require("../../types/buttonTypes"),_theme=require("./theme"),_constants=require("./constants"),_layout=_interopRequireDefault(require("./layout")),_utils=require("./utils");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var i=new WeakMap,r=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var a,s,o={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return o;if(a=t?r:i){if(a.has(e))return a.get(e);a.set(e,o)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((s=(a=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(s.get||s.set)?a(o,t,s):o[t]=e[t]);return o})(e,t)}function _defineProperty(e,t,i){return(t=_toPropertyKey(t))in e?Object.defineProperty(e,t,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[t]=i,e}function _toPropertyKey(e){var t=_toPrimitive(e,"string");return"symbol"==typeof t?t:t+""}function _toPrimitive(e,t){if("object"!=typeof e||!e)return e;var i=e[Symbol.toPrimitive];if(void 0!==i){var r=i.call(e,t||"default");if("object"!=typeof r)return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}class AttachmentContainer extends _react.Component{constructor(e){super(e),_defineProperty(this,"loadElement",()=>{const{input:e,onLoaded:t}=this.props;(0,_utils.getBlobFromUrl)(e.value,i=>{if(null!=i&&i.type){const t=i.type.substring(i.type.indexOf("/")+1);this.setState({name:this.getDefaultAttachment(e.value,t)}),(0,_utils.hasPreview)(i)&&this.buildPreview(i)}else this.setState({name:this.getDefaultAttachment(e.value)});t&&t()})}),_defineProperty(this,"loadDefaultValues",()=>{const{input:e}=this.props;this.hasDefaultValueToLoad()?this.loadElement():this.hasDefaultFileObjectToLoad()&&this.setFile(e.value.file)}),_defineProperty(this,"getDefaultAttachment",(e,t)=>e&&"string"==typeof e&&_react.default.createElement("a",{href:e,target:"_blank",rel:"noopener noreferrer"},_constants.DEFAULT_ATTACHMENT_NAME,t&&".".concat(t))||""),_defineProperty(this,"hasDefaultValueToLoad",()=>this.props.input.value&&"string"==typeof this.props.input.value),_defineProperty(this,"hasDefaultFileObjectToLoad",()=>{const{input:e}=this.props;return e.value&&"object"==typeof e.value&&(0,_utils.isValidFile)(e.value.file)}),_defineProperty(this,"onChange",async e=>{var t;let i=e.target.files[0];const{resizeConfig:r,disableResize:a}=this.props,s={formatError:_constants.FORMAT_ERROR_TEXT,sizeError:"".concat(_constants.SIZE_ERROR_TEXT," ").concat(Math.round(this.props.maxFileSize/1048576),"MB."),aspectRatioError:"".concat(_constants.ASPECT_RATIO_ERROR_TEXT," ").concat(null===(t=this.props.allowedPDFUploadSizes)||void 0===t?void 0:t.map(e=>e.name).join(" - "),")")};if(this.setState({error:!1}),i){let e=!this.props.customValidation||await this.props.customValidation(i,this.onFailValidation);if(e){if(e=await(0,_validate.fileSignatureValidation)(i,this.props.fieldTypes,i.type),e)return this.props.sanitize&&(i=await this.props.sanitize(i)),e=(0,_validate.fileSizeValidation)(i,this.props.maxFileSize),e&&(0,_utils.isPDF)(i)&&!(0,_array.isEmpty)(this.props.allowedPDFUploadSizes)?(e=await(0,_utils.pdfAspectRatioValidation)(i,this.props.allowedPDFUploadSizes),e?this.setFile(i):this.onFailValidation(s.aspectRatioError)):(e||a||!(0,_utils.isImage)(i)||(0,_browser.isIE)()||(i=await(0,_image.resizeImage)(i,r),e=(0,_validate.fileSizeValidation)(i,this.props.maxFileSize)),e?this.setFile(i):this.onFailValidation(s.sizeError));this.onFailValidation(s.formatError)}}}),_defineProperty(this,"onFailValidation",e=>this.setState({error:!0,errorText:e})),_defineProperty(this,"setFile",async e=>{const{onChange:t,onLoaded:i}=this.props;this.setState({loading:!0,name:e.name}),(0,_utils.hasPreview)(e)&&this.buildPreview(e),t&&t({file:e}),this.setState({loading:!1}),i&&i()}),_defineProperty(this,"buildPreview",e=>{const t=new FileReader;t.onload=t=>this.setState({preview:{src:t.target.result,type:e.type}}),t.readAsDataURL(e)}),_defineProperty(this,"removeValue",()=>{this.setState({loading:!1,name:"",preview:{}}),this.props.onChange&&this.props.onChange("")}),this.state={loading:!1,name:"",preview:{},error:!1,errorText:_constants.FORMAT_ERROR_TEXT}}componentDidMount(){this.loadDefaultValues()}componentDidUpdate(e){var t;const{fieldTypes:i,input:r}=this.props;(null===(t=e.fieldTypes)||void 0===t?void 0:t[0])!==(null==i?void 0:i[0])?this.removeValue():(0,_utils.isNewFile)(e.input.value,r.value)&&this.loadDefaultValues()}render(){const{acceptedFileTypes:e,actions:t,classes:i,containerClassname:r,dataTestId:a,deleteDataTestId:s,disabled:o,errorClassname:p,field:n,fieldTypes:l,hideLabels:u,icon:d,input:_,loadingTextClassname:y,previewClassname:c,previewDataTestId:h,previewProps:f,RemoveIcon:T,removeFileClassname:m,titleVariant:v}=this.props,{name:g,preview:b,loading:w,error:P,errorText:F}=this.state,D=this.hasDefaultValueToLoad()&&!g;return _react.default.createElement(_layout.default,{acceptedFileTypes:e,actions:t,classes:i,containerClassname:r,dataTestId:a,deleteDataTestId:s,disabled:o,error:P,errorClassname:p,errorText:F,field:n,fieldTypes:l,hideLabels:u,icon:d,loading:w||D,loadingTextClassname:y,name:g||this.getDefaultAttachment(_.value),onChange:this.onChange,onClick:this.removeValue,preview:b,previewClassname:c,previewDataTestId:h,previewProps:f,removeFileClassname:m,RemoveIcon:T,titleVariant:v,uploadingText:D?_constants.DEFAULT_UPLOADING_TEXT:""})}}AttachmentContainer.propTypes={acceptedFileTypes:_propTypes.string,actions:(0,_propTypes.arrayOf)(_buttonTypes.buttonTypes),allowedPDFUploadSizes:(0,_propTypes.arrayOf)((0,_propTypes.shape)({name:_propTypes.string,heightInPt:_propTypes.number,widthInPt:_propTypes.number,tolerance:_propTypes.number})),classes:(0,_propTypes.objectOf)(_propTypes.string),containerClassname:_propTypes.string,customValidation:_propTypes.func,dataTestId:_propTypes.string,deleteDataTestId:_propTypes.string,disableResize:_propTypes.bool,disabled:_propTypes.bool,errorClassname:_propTypes.string,field:_propTypes.object,fieldTypes:(0,_propTypes.arrayOf)(_propTypes.string),hideLabels:_propTypes.string,icon:_propTypes.node,input:(0,_propTypes.shape)({value:(0,_propTypes.oneOfType)([_propTypes.string,(0,_propTypes.shape)({name:_propTypes.string,type:_propTypes.string})])}),loadingTextClassname:_propTypes.string,maxFileSize:_propTypes.number,onChange:_propTypes.func,onLoaded:_propTypes.func,previewClassname:_propTypes.string,previewDataTestId:_propTypes.string,previewProps:_constants.previewPropType,removeFileClassname:_propTypes.string,RemoveIcon:_propTypes.elementType,resizeConfig:(0,_propTypes.shape)({type:_propTypes.string,maxWidth:_propTypes.number,maxHeight:_propTypes.number}),sanitize:_propTypes.func,titleVariant:_propTypes.string},AttachmentContainer.defaultProps={maxFileSize:99999999};var _default=exports.default=(0,_WithTheme.default)(_theme.retrieveStyle)(AttachmentContainer);
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _react=_interopRequireWildcard(require("react")),_propTypes=require("prop-types"),_validate=require("@widergy/web-utils/lib/validate"),_image=require("@widergy/web-utils/lib/image"),_browser=require("@widergy/web-utils/lib/browser"),_array=require("@widergy/web-utils/lib/array"),_WithTheme=_interopRequireDefault(require("../../components/WithTheme")),_buttonTypes=require("../../types/buttonTypes"),_theme=require("./theme"),_constants=require("./constants"),_layout=_interopRequireDefault(require("./layout")),_utils=require("./utils");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var i=new WeakMap,r=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var a,s,o={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return o;if(a=t?r:i){if(a.has(e))return a.get(e);a.set(e,o)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((s=(a=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(s.get||s.set)?a(o,t,s):o[t]=e[t]);return o})(e,t)}function _defineProperty(e,t,i){return(t=_toPropertyKey(t))in e?Object.defineProperty(e,t,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[t]=i,e}function _toPropertyKey(e){var t=_toPrimitive(e,"string");return"symbol"==typeof t?t:t+""}function _toPrimitive(e,t){if("object"!=typeof e||!e)return e;var i=e[Symbol.toPrimitive];if(void 0!==i){var r=i.call(e,t||"default");if("object"!=typeof r)return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}class AttachmentContainer extends _react.Component{constructor(e){super(e),_defineProperty(this,"loadElement",()=>{const{input:e,onLoaded:t}=this.props;(0,_utils.getBlobFromUrl)(e.value,i=>{if(null!=i&&i.type){const t=i.type.substring(i.type.indexOf("/")+1);this.setState({name:this.getDefaultAttachment(e.value,t)}),(0,_utils.hasPreview)(i)&&this.buildPreview(i)}else this.setState({name:this.getDefaultAttachment(e.value)});t&&t()})}),_defineProperty(this,"loadDefaultValues",()=>{const{input:e}=this.props;this.hasDefaultValueToLoad()?this.loadElement():this.hasDefaultFileObjectToLoad()&&this.setFile(e.value.file)}),_defineProperty(this,"getDefaultAttachment",(e,t)=>e&&"string"==typeof e&&_react.default.createElement("a",{href:e,target:"_blank",rel:"noopener noreferrer"},_constants.DEFAULT_ATTACHMENT_NAME,t&&".".concat(t))||""),_defineProperty(this,"hasDefaultValueToLoad",()=>this.props.input.value&&"string"==typeof this.props.input.value),_defineProperty(this,"hasDefaultFileObjectToLoad",()=>{const{input:e}=this.props;return e.value&&"object"==typeof e.value&&(0,_utils.isValidFile)(e.value.file)}),_defineProperty(this,"onChange",async e=>{var t;let i=e.target.files[0];const{resizeConfig:r,disableResize:a}=this.props,s={formatError:_constants.FORMAT_ERROR_TEXT,sizeError:"".concat(_constants.SIZE_ERROR_TEXT," ").concat(Math.round(this.props.maxFileSize/1048576),"MB."),aspectRatioError:"".concat(_constants.ASPECT_RATIO_ERROR_TEXT," ").concat(null===(t=this.props.allowedPDFUploadSizes)||void 0===t?void 0:t.map(e=>e.name).join(" - "),")")};if(this.setState({error:!1}),i){let e=!this.props.customValidation||await this.props.customValidation(i,this.onFailValidation);if(e){if(e=await(0,_validate.fileSignatureValidation)(i,this.props.fieldTypes,i.type),e){if(this.props.sanitize)try{i=await this.props.sanitize(i)}catch(e){return this.onFailValidation(s.formatError)}return e=(0,_validate.fileSizeValidation)(i,this.props.maxFileSize),e&&(0,_utils.isPDF)(i)&&!(0,_array.isEmpty)(this.props.allowedPDFUploadSizes)?(e=await(0,_utils.pdfAspectRatioValidation)(i,this.props.allowedPDFUploadSizes),e?this.setFile(i):this.onFailValidation(s.aspectRatioError)):(e||a||!(0,_utils.isImage)(i)||(0,_browser.isIE)()||(i=await(0,_image.resizeImage)(i,r),e=(0,_validate.fileSizeValidation)(i,this.props.maxFileSize)),e?this.setFile(i):this.onFailValidation(s.sizeError))}this.onFailValidation(s.formatError)}}}),_defineProperty(this,"onFailValidation",e=>this.setState({error:!0,errorText:e})),_defineProperty(this,"setFile",async e=>{const{onChange:t,onLoaded:i}=this.props;this.setState({loading:!0,name:e.name}),(0,_utils.hasPreview)(e)&&this.buildPreview(e),t&&t({file:e}),this.setState({loading:!1}),i&&i()}),_defineProperty(this,"buildPreview",e=>{const t=new FileReader;t.onload=t=>this.setState({preview:{src:t.target.result,type:e.type}}),t.readAsDataURL(e)}),_defineProperty(this,"removeValue",()=>{this.setState({loading:!1,name:"",preview:{}}),this.props.onChange&&this.props.onChange("")}),this.state={loading:!1,name:"",preview:{},error:!1,errorText:_constants.FORMAT_ERROR_TEXT}}componentDidMount(){this.loadDefaultValues()}componentDidUpdate(e){var t;const{fieldTypes:i,input:r}=this.props;(null===(t=e.fieldTypes)||void 0===t?void 0:t[0])!==(null==i?void 0:i[0])?this.removeValue():(0,_utils.isNewFile)(e.input.value,r.value)&&this.loadDefaultValues()}render(){const{acceptedFileTypes:e,actions:t,classes:i,containerClassname:r,dataTestId:a,deleteDataTestId:s,disabled:o,errorClassname:p,field:n,fieldTypes:l,hideLabels:u,icon:d,input:_,loadingTextClassname:y,previewClassname:c,previewDataTestId:h,previewProps:f,RemoveIcon:T,removeFileClassname:m,titleVariant:v}=this.props,{name:g,preview:b,loading:w,error:P,errorText:F}=this.state,D=this.hasDefaultValueToLoad()&&!g;return _react.default.createElement(_layout.default,{acceptedFileTypes:e,actions:t,classes:i,containerClassname:r,dataTestId:a,deleteDataTestId:s,disabled:o,error:P,errorClassname:p,errorText:F,field:n,fieldTypes:l,hideLabels:u,icon:d,loading:w||D,loadingTextClassname:y,name:g||this.getDefaultAttachment(_.value),onChange:this.onChange,onClick:this.removeValue,preview:b,previewClassname:c,previewDataTestId:h,previewProps:f,removeFileClassname:m,RemoveIcon:T,titleVariant:v,uploadingText:D?_constants.DEFAULT_UPLOADING_TEXT:""})}}AttachmentContainer.propTypes={acceptedFileTypes:_propTypes.string,actions:(0,_propTypes.arrayOf)(_buttonTypes.buttonTypes),allowedPDFUploadSizes:(0,_propTypes.arrayOf)((0,_propTypes.shape)({name:_propTypes.string,heightInPt:_propTypes.number,widthInPt:_propTypes.number,tolerance:_propTypes.number})),classes:(0,_propTypes.objectOf)(_propTypes.string),containerClassname:_propTypes.string,customValidation:_propTypes.func,dataTestId:_propTypes.string,deleteDataTestId:_propTypes.string,disableResize:_propTypes.bool,disabled:_propTypes.bool,errorClassname:_propTypes.string,field:_propTypes.object,fieldTypes:(0,_propTypes.arrayOf)(_propTypes.string),hideLabels:_propTypes.string,icon:_propTypes.node,input:(0,_propTypes.shape)({value:(0,_propTypes.oneOfType)([_propTypes.string,(0,_propTypes.shape)({name:_propTypes.string,type:_propTypes.string})])}),loadingTextClassname:_propTypes.string,maxFileSize:_propTypes.number,onChange:_propTypes.func,onLoaded:_propTypes.func,previewClassname:_propTypes.string,previewDataTestId:_propTypes.string,previewProps:_constants.previewPropType,removeFileClassname:_propTypes.string,RemoveIcon:_propTypes.elementType,resizeConfig:(0,_propTypes.shape)({type:_propTypes.string,maxWidth:_propTypes.number,maxHeight:_propTypes.number}),sanitize:_propTypes.func,titleVariant:_propTypes.string},AttachmentContainer.defaultProps={maxFileSize:99999999};var _default=exports.default=(0,_WithTheme.default)(_theme.retrieveStyle)(AttachmentContainer);
@@ -1 +1 @@
1
- import React,{useEffect,useRef,useState}from"react";import{func,arrayOf,string,shape,number,node,bool,objectOf,oneOfType,any}from"prop-types";import{fileSignatureValidation,fileSizeValidation}from"@widergy/web-utils/lib/validate";import{resizeImage}from"@widergy/web-utils/lib/image";import{isIE}from"@widergy/web-utils/lib/browser";import isEmpty from"lodash/isEmpty";import{buttonTypes}from"../../types/buttonTypes";import WithTheme from"../WithTheme";import{retrieveStyle}from"./theme";import{FORMAT_ERROR_TEXT,SIZE_ERROR_TEXT,ASPECT_RATIO_ERROR_TEXT,MAX_FILES_ERROR,DEFAULT_MAX_FILES,PREVIEW_TYPES}from"./constants";import Attachment from"./layout";import{pdfAspectRatioValidation,isImage,isPDF,getSizeInMB,hasPreview,isDownloadable,getNotRepeatedFiles,getBlobFromUrl,getDefaultAttachment,getUploadIconAreaColors}from"./utils";const AttachmentListContainer=e=>{var t,a,i,r,n;let{acceptedFileTypes:l,actions:o,allowedPDFUploadSizes:s,classes:d,containerClassname:u,customValidation:m,dataTestId:c,deleteDataTestId:f,disabled:p,disableResize:y,errorClassname:g,field:v,fieldTypes:E=[],hideLabels:T,icon:R,input:h,loadingTextClassname:b,maxFileSize:A=99999999,onLoaded:I,notifyOnInitialLoad:O=!0,previewDataTestId:_,readOnly:S=!1,resizeConfig:w,sanitize:C,theme:F,titleVariant:z}=e;const{areaBackground:P,areaBorderColor:D}=getUploadIconAreaColors(F),L=null==v||null===(t=v.configuration)||void 0===t?void 0:t.help_text,x=(null==v||null===(a=v.configuration)||void 0===a?void 0:a.max_file_size)||A,V=(null==v||null===(i=v.configuration)||void 0===i?void 0:i.accepted_file_types)||l,M=(null==v||null===(r=v.configuration)||void 0===r?void 0:r.max_files)||DEFAULT_MAX_FILES,[B,X]=useState([]),[U,W]=useState(!1),[j,N]=useState(FORMAT_ERROR_TEXT),Y=useRef(null),[k,G]=useState((null==h||null===(n=h.value)||void 0===n?void 0:n.files)||[]),Z=(e,t)=>{W(!0),N(t?"".concat(e,"(").concat(t,")"):e)},H=async e=>{const t=e=>new Promise((t,a)=>{const i=new FileReader;i.onload=a=>{hasPreview(e)||isDownloadable(e)?t({src:a.target.result,file:e}):t({src:null,file:e})},i.onerror=e=>a(e),i.readAsDataURL(e)});try{const a=(await Promise.all(e.map(t))).map(e=>{let{src:t,file:a}=e;return((e,t)=>({...t,src:e}))(t,{type:a.type,name:a.name,size:getSizeInMB(a.size),onClick:()=>{return(e=a.name)&&X(t=>t.filter(t=>t.name!==e)),G(t=>{const a=Object.values(t).filter(t=>t.name!==e);return h.onChange&&h.onChange(isEmpty(a)?null:{files:a}),a}),Y.current&&(Y.current.value=null),void W(!1);var e}})});X(e=>getNotRepeatedFiles([...(e||[]).filter(e=>"loading"!==e.type),...a]))}catch(e){X(e=>(e||[]).filter(e=>"loading"!==e.type)),Z(null==e?void 0:e.message)}},q=async function(){var e,t;let a=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0,i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:[];const r=Array.isArray(h.value)?h.value.length:1;if(a===r)return I&&I(),O&&h.onChange&&h.onChange({files:i}),G(i),void H(i);const n=Array.isArray(h.value)?h.value.flatMap(e=>Object.values(e)[0]):h.value,l=Array.isArray(h.value)?(null===(e=h.value[a])||void 0===e?void 0:e.url)||(null===(t=n[a])||void 0===t?void 0:t.url):h.value;getBlobFromUrl(l,async e=>{if(e){var t,r;const l=Array.isArray(h.value)?(null===(t=h.value[a])||void 0===t?void 0:t.name)||(null===(r=n[a])||void 0===r?void 0:r.name):null,o=new File([e],l||getDefaultAttachment(e.type.substring(e.type.indexOf("/")+1),a+1),{type:e.type});q(a+1,[...i,o])}else X(e=>{let t=!1;return e.map(e=>t||e.type!==PREVIEW_TYPES.LOADING?e:(t=!0,{...e,type:PREVIEW_TYPES.ERROR}))}),q(a+1,i)})};return useEffect(()=>{var e;if(isEmpty(k)?isEmpty(null===(e=h.value)||void 0===e?void 0:e.files)||H(h.value.files):H(k),Array.isArray(h.value)&&!isEmpty(h.value)||h.value&&"string"==typeof h.value){if(isEmpty(B)){const e=Array.isArray(h.value)?h.value.length:1;X(Array.from({length:e},()=>({type:PREVIEW_TYPES.LOADING})))}q()}},[h]),React.createElement(Attachment,{actions:o,acceptedFileTypes:V,areaBackground:P,areaBorderColor:D,classes:d,containerClassname:u,disabled:p,dataTestId:c,deleteDataTestId:f,error:U,errorClassname:g,errorText:j,field:v,fieldTypes:E,fileInputRef:Y,helpText:L,hideLabels:T,icon:R,loadingTextClassname:b,maxFiles:M,maxFileSize:getSizeInMB(x),onChange:async e=>{var t;const a=(null===(t=h.value)||void 0===t?void 0:t.files)||k,i=Object.values(isEmpty(a)?e.target.files:getNotRepeatedFiles([...a,...e.target.files])),r={formatError:FORMAT_ERROR_TEXT,sizeError:"".concat(SIZE_ERROR_TEXT," ").concat(getSizeInMB(x),"MB."),aspectRatioError:"".concat(ASPECT_RATIO_ERROR_TEXT," ").concat(null==s?void 0:s.map(e=>e.name).join(" - "),")")};W(!1);const n=async e=>{if(e<i.length){if(M&&i.length>M)return void Z(MAX_FILES_ERROR,M);let t=i[e];if(t){let a=!m||await m(t,Z);if(a){if(a=await fileSignatureValidation(t,E,t.type),!a)return void Z(r.formatError);if(C&&(t=await C(t)),a=fileSizeValidation(t,x),a&&isPDF(t)&&!isEmpty(s)&&(a=await pdfAspectRatioValidation(t,s),!a))return void Z(r.aspectRatioError);if(a||y||!isImage(t)||isIE()||(t=await resizeImage(t,w),a=fileSizeValidation(t,x),i[e]=t),!a)return void Z(r.sizeError)}}await n(e+1)}else h.onChange&&h.onChange({files:i}),G(i),await H(i)};await n(0)},preview:B,previewDataTestId:_,readOnly:S,titleVariant:z})};AttachmentListContainer.propTypes={acceptedFileTypes:string,actions:arrayOf(buttonTypes),allowedPDFUploadSizes:arrayOf(shape({name:string,heightInPt:number,widthInPt:number,tolerance:number})),classes:objectOf(string),containerClassname:string,customValidation:func,disabled:bool,dataTestId:string,deleteDataTestId:string,disableResize:bool,errorClassname:string,field:any,fieldTypes:arrayOf(string),hideLabels:bool,icon:node,input:shape({value:oneOfType([string,shape({name:string,type:string})])}),loadingTextClassname:string,maxFileSize:number,onLoaded:func,notifyOnInitialLoad:bool,previewDataTestId:string,readOnly:bool,resizeConfig:shape({type:string,maxWidth:number,maxHeight:number}),sanitize:func,theme:any,titleVariant:string};export default WithTheme(retrieveStyle)(AttachmentListContainer);
1
+ import React,{useEffect,useRef,useState}from"react";import{func,arrayOf,string,shape,number,node,bool,objectOf,oneOfType,any}from"prop-types";import{fileSignatureValidation,fileSizeValidation}from"@widergy/web-utils/lib/validate";import{resizeImage}from"@widergy/web-utils/lib/image";import{isIE}from"@widergy/web-utils/lib/browser";import isEmpty from"lodash/isEmpty";import{buttonTypes}from"../../types/buttonTypes";import WithTheme from"../WithTheme";import{retrieveStyle}from"./theme";import{FORMAT_ERROR_TEXT,SIZE_ERROR_TEXT,ASPECT_RATIO_ERROR_TEXT,MAX_FILES_ERROR,DEFAULT_MAX_FILES,PREVIEW_TYPES}from"./constants";import Attachment from"./layout";import{pdfAspectRatioValidation,isImage,isPDF,getSizeInMB,hasPreview,isDownloadable,getNotRepeatedFiles,getBlobFromUrl,getDefaultAttachment,getUploadIconAreaColors}from"./utils";const AttachmentListContainer=e=>{var t,a,i,r,n;let{acceptedFileTypes:l,actions:o,allowedPDFUploadSizes:s,classes:d,containerClassname:u,customValidation:m,dataTestId:c,deleteDataTestId:f,disabled:p,disableResize:y,errorClassname:g,field:v,fieldTypes:E=[],hideLabels:T,icon:R,input:h,loadingTextClassname:b,maxFileSize:A=99999999,onLoaded:I,notifyOnInitialLoad:O=!0,previewDataTestId:_,readOnly:S=!1,resizeConfig:w,sanitize:C,theme:F,titleVariant:z}=e;const{areaBackground:P,areaBorderColor:D}=getUploadIconAreaColors(F),L=null==v||null===(t=v.configuration)||void 0===t?void 0:t.help_text,x=(null==v||null===(a=v.configuration)||void 0===a?void 0:a.max_file_size)||A,V=(null==v||null===(i=v.configuration)||void 0===i?void 0:i.accepted_file_types)||l,M=(null==v||null===(r=v.configuration)||void 0===r?void 0:r.max_files)||DEFAULT_MAX_FILES,[B,X]=useState([]),[U,W]=useState(!1),[j,N]=useState(FORMAT_ERROR_TEXT),Y=useRef(null),[k,G]=useState((null==h||null===(n=h.value)||void 0===n?void 0:n.files)||[]),Z=(e,t)=>{W(!0),N(t?"".concat(e,"(").concat(t,")"):e)},H=async e=>{const t=e=>new Promise((t,a)=>{const i=new FileReader;i.onload=a=>{hasPreview(e)||isDownloadable(e)?t({src:a.target.result,file:e}):t({src:null,file:e})},i.onerror=e=>a(e),i.readAsDataURL(e)});try{const a=(await Promise.all(e.map(t))).map(e=>{let{src:t,file:a}=e;return((e,t)=>({...t,src:e}))(t,{type:a.type,name:a.name,size:getSizeInMB(a.size),onClick:()=>{return(e=a.name)&&X(t=>t.filter(t=>t.name!==e)),G(t=>{const a=Object.values(t).filter(t=>t.name!==e);return h.onChange&&h.onChange(isEmpty(a)?null:{files:a}),a}),Y.current&&(Y.current.value=null),void W(!1);var e}})});X(e=>getNotRepeatedFiles([...(e||[]).filter(e=>"loading"!==e.type),...a]))}catch(e){X(e=>(e||[]).filter(e=>"loading"!==e.type)),Z(null==e?void 0:e.message)}},q=async function(){var e,t;let a=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0,i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:[];const r=Array.isArray(h.value)?h.value.length:1;if(a===r)return I&&I(),O&&h.onChange&&h.onChange({files:i}),G(i),void H(i);const n=Array.isArray(h.value)?h.value.flatMap(e=>Object.values(e)[0]):h.value,l=Array.isArray(h.value)?(null===(e=h.value[a])||void 0===e?void 0:e.url)||(null===(t=n[a])||void 0===t?void 0:t.url):h.value;getBlobFromUrl(l,async e=>{if(e){var t,r;const l=Array.isArray(h.value)?(null===(t=h.value[a])||void 0===t?void 0:t.name)||(null===(r=n[a])||void 0===r?void 0:r.name):null,o=new File([e],l||getDefaultAttachment(e.type.substring(e.type.indexOf("/")+1),a+1),{type:e.type});q(a+1,[...i,o])}else X(e=>{let t=!1;return e.map(e=>t||e.type!==PREVIEW_TYPES.LOADING?e:(t=!0,{...e,type:PREVIEW_TYPES.ERROR}))}),q(a+1,i)})};return useEffect(()=>{var e;if(isEmpty(k)?isEmpty(null===(e=h.value)||void 0===e?void 0:e.files)||H(h.value.files):H(k),Array.isArray(h.value)&&!isEmpty(h.value)||h.value&&"string"==typeof h.value){if(isEmpty(B)){const e=Array.isArray(h.value)?h.value.length:1;X(Array.from({length:e},()=>({type:PREVIEW_TYPES.LOADING})))}q()}},[h]),React.createElement(Attachment,{actions:o,acceptedFileTypes:V,areaBackground:P,areaBorderColor:D,classes:d,containerClassname:u,disabled:p,dataTestId:c,deleteDataTestId:f,error:U,errorClassname:g,errorText:j,field:v,fieldTypes:E,fileInputRef:Y,helpText:L,hideLabels:T,icon:R,loadingTextClassname:b,maxFiles:M,maxFileSize:getSizeInMB(x),onChange:async e=>{var t;const a=(null===(t=h.value)||void 0===t?void 0:t.files)||k,i=Object.values(isEmpty(a)?e.target.files:getNotRepeatedFiles([...a,...e.target.files])),r={formatError:FORMAT_ERROR_TEXT,sizeError:"".concat(SIZE_ERROR_TEXT," ").concat(getSizeInMB(x),"MB."),aspectRatioError:"".concat(ASPECT_RATIO_ERROR_TEXT," ").concat(null==s?void 0:s.map(e=>e.name).join(" - "),")")};W(!1);const n=async e=>{if(e<i.length){if(M&&i.length>M)return void Z(MAX_FILES_ERROR,M);let t=i[e];if(t){let a=!m||await m(t,Z);if(a){if(a=await fileSignatureValidation(t,E,t.type),!a)return void Z(r.formatError);if(C)try{t=await C(t)}catch(e){return void Z(r.formatError)}if(a=fileSizeValidation(t,x),a&&isPDF(t)&&!isEmpty(s)&&(a=await pdfAspectRatioValidation(t,s),!a))return void Z(r.aspectRatioError);if(a||y||!isImage(t)||isIE()||(t=await resizeImage(t,w),a=fileSizeValidation(t,x)),i[e]=t,!a)return void Z(r.sizeError)}}await n(e+1)}else h.onChange&&h.onChange({files:i}),G(i),await H(i)};await n(0)},preview:B,previewDataTestId:_,readOnly:S,titleVariant:z})};AttachmentListContainer.propTypes={acceptedFileTypes:string,actions:arrayOf(buttonTypes),allowedPDFUploadSizes:arrayOf(shape({name:string,heightInPt:number,widthInPt:number,tolerance:number})),classes:objectOf(string),containerClassname:string,customValidation:func,disabled:bool,dataTestId:string,deleteDataTestId:string,disableResize:bool,errorClassname:string,field:any,fieldTypes:arrayOf(string),hideLabels:bool,icon:node,input:shape({value:oneOfType([string,shape({name:string,type:string})])}),loadingTextClassname:string,maxFileSize:number,onLoaded:func,notifyOnInitialLoad:bool,previewDataTestId:string,readOnly:bool,resizeConfig:shape({type:string,maxWidth:number,maxHeight:number}),sanitize:func,theme:any,titleVariant:string};export default WithTheme(retrieveStyle)(AttachmentListContainer);
@@ -1 +1 @@
1
- function _extends(){return _extends=Object.assign?Object.assign.bind():function(t){for(var e=1;e<arguments.length;e++){var o=arguments[e];for(var a in o)({}).hasOwnProperty.call(o,a)&&(t[a]=o[a])}return t},_extends.apply(null,arguments)}import React from"react";import{bool,func,number,string,object}from"prop-types";import UTButton from"../../../../../UTButton";import UTLabel from"../../../../../UTLabel";import UTProgressBar from"../../../../../UTProgressBar/index.js";import{TEST_IDS}from"../../../../../../constants/testIds";import styles from"../../styles.module.scss";const{panel:panel}=TEST_IDS,ControlAreaSection=t=>{let{backButton:e,backButtonClass:o,backButtonDataTestId:a,classes:n,closeButtonClass:s,closeButtonDataTestId:r,currentPage:c,currentStep:l,hideCloseButton:i,iconBackClass:u,iconCloseClass:m,isWorkflow:p,nextButton:b,onClose:B,onGoBack:C,onOpen:d,open:g,panelIsCollapsible:T,showBackButton:I,showPagination:f,stepsCount:y,totalPages:k}=t;return I||f||!i||p||T?React.createElement("div",{className:styles.controlAreaContainer},React.createElement("div",{className:styles.controlAreaBar},React.createElement("div",{className:styles.controlLeftArea},I&&React.createElement("div",{className:styles.backButtonContainer},React.createElement(UTButton,{classNames:{icon:u,root:o},dataTestId:a,Icon:"IconArrowLeft",onClick:C,variant:"text"})),f&&React.createElement("div",{className:styles.paginationContainer},React.createElement(UTLabel,{colorTheme:"gray"},"".concat(c," / ").concat(k)),React.createElement(UTButton,_extends({dataTestId:panel.paginationPrev,Icon:"IconChevronLeft",variant:"text"},e)),React.createElement(UTButton,_extends({dataTestId:panel.paginationNext,Icon:"IconChevronRight",variant:"text"},b)))),(T||!i)&&React.createElement(UTButton,{classNames:{icon:m,root:s},dataTestId:r,Icon:T?"IconLayoutSidebarRight":"IconX",onClick:T&&!g?d:B,variant:"text"})),p&&React.createElement(UTProgressBar,{classNames:{barColorPrimary:n.barColorPrimary,colorPrimary:n.colorPrimary,container:styles.progressBarContainer},value:100*l/y})):null};ControlAreaSection.propTypes={backButton:object,backButtonClass:string,backButtonDataTestId:string,classes:object,closeButtonClass:string,closeButtonDataTestId:string,currentPage:number,currentStep:number,hideCloseButton:bool,iconBackClass:string,iconCloseClass:string,isWorkflow:bool,nextButton:object,onClose:func,onGoBack:func,onOpen:func,open:bool,panelIsCollapsible:bool,showBackButton:bool,showPagination:bool,stepsCount:number,totalPages:number};export default ControlAreaSection;
1
+ function _extends(){return _extends=Object.assign?Object.assign.bind():function(t){for(var e=1;e<arguments.length;e++){var o=arguments[e];for(var a in o)({}).hasOwnProperty.call(o,a)&&(t[a]=o[a])}return t},_extends.apply(null,arguments)}import React from"react";import{bool,func,number,string,object}from"prop-types";import UTButton from"../../../../../UTButton";import UTLabel from"../../../../../UTLabel";import UTProgressBar from"../../../../../UTProgressBar/index.js";import{TEST_IDS}from"../../../../../../constants/testIds";import styles from"../../styles.module.scss";const{panel:panel}=TEST_IDS,ControlAreaSection=t=>{let{backButton:e,backButtonClass:o,backButtonDataTestId:a,classes:n,closeButtonClass:s,closeButtonDataTestId:r,currentPage:l,currentStep:c,hideCloseButton:i,iconBackClass:u,iconCloseClass:m,isWorkflow:p,nextButton:b,onClose:B,onGoBack:C,onOpen:d,open:g,panelIsCollapsed:T,panelIsCollapsible:I,showBackButton:f,showPagination:y,stepsCount:k,totalPages:v}=t;return f||y||!i||p||I?React.createElement("div",{className:styles.controlAreaContainer},React.createElement("div",{className:styles.controlAreaBar},React.createElement("div",{className:"".concat(styles.controlLeftArea," ").concat(T?styles.controlLeftAreaCollapsed:"")},f&&React.createElement("div",{className:styles.backButtonContainer},React.createElement(UTButton,{classNames:{icon:u,root:o},dataTestId:a,Icon:"IconArrowLeft",onClick:C,variant:"text"})),y&&React.createElement("div",{className:styles.paginationContainer},React.createElement(UTLabel,{colorTheme:"gray"},"".concat(l," / ").concat(v)),React.createElement(UTButton,_extends({dataTestId:panel.paginationPrev,Icon:"IconChevronLeft",variant:"text"},e)),React.createElement(UTButton,_extends({dataTestId:panel.paginationNext,Icon:"IconChevronRight",variant:"text"},b)))),(I||!i)&&React.createElement(UTButton,{classNames:{icon:m,root:s},dataTestId:r,Icon:I?"IconLayoutSidebarRight":"IconX",onClick:I&&!g?d:B,variant:"text"})),!T&&p&&React.createElement(UTProgressBar,{classNames:{barColorPrimary:n.barColorPrimary,colorPrimary:n.colorPrimary,container:styles.progressBarContainer},value:100*c/k})):null};ControlAreaSection.propTypes={backButton:object,backButtonClass:string,backButtonDataTestId:string,classes:object,closeButtonClass:string,closeButtonDataTestId:string,currentPage:number,currentStep:number,hideCloseButton:bool,iconBackClass:string,iconCloseClass:string,isWorkflow:bool,nextButton:object,onClose:func,onGoBack:func,onOpen:func,open:bool,panelIsCollapsed:bool,panelIsCollapsible:bool,showBackButton:bool,showPagination:bool,stepsCount:number,totalPages:number};export default ControlAreaSection;
@@ -1 +1 @@
1
- function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var o=arguments[t];for(var n in o)({}).hasOwnProperty.call(o,n)&&(e[n]=o[n])}return e},_extends.apply(null,arguments)}import React,{useMemo,useState,useEffect}from"react";import SwipeableDrawer from"@material-ui/core/SwipeableDrawer";import{arrayOf,bool,element,elementType,func,number,object,objectOf,oneOf,oneOfType,shape,string}from"prop-types";import isEmpty from"lodash/isEmpty";import WithTheme from"../../../WithTheme/index.js";import{TEST_IDS}from"../../../../constants/testIds.js";import{mergeClasses}from"../../../../utils/classesUtils.js";import AdditionalContentModule from"./components/AdditionalContentModule";import ControlAreaSection from"./components/ControlAreaSection";import HeaderSection from"./components/HeaderSection";import BodySection from"./components/BodySection";import styles from"./styles.module.scss";import{SIZES}from"./constants.js";import{retrieveStyle}from"./theme";const{panel:panel}=TEST_IDS,UTPanel=e=>{var t;let{additionalContent:o,backButtonDataTestId:n=panel.backButton,BackdropProps:a={},children:s,classes:l,classNames:r,closeButtonDataTestId:i=panel.closeButton,collapsableHeader:c=!1,collapsablePanel:d=!1,currentStep:p=1,CustomHeaderComponent:m,disableScrollbar:u=!1,HeaderComponent:b,headerItems:C,headerMainActionButton:h={},headerSecondaryActionButton:y={},hideCloseButton:g=!1,hideHeader:f=!1,hideMainButton:B=!1,inline:S=!1,isWorkflow:T=!1,mainActionDataTestId:P=panel.mainAction,mainButton:I={},modalProps:k,onClose:w,onEndReachedCallback:A,onGoBack:D=()=>{},onOpen:E=()=>{},open:O,openAdditionalContentRequest:j,paginationProps:v={},panelSide:R,perfectScrollbarOptions:H,pretitleComponent:M,secondaryActionDataTestId:x=panel.secondaryAction,showBackButton:W=!1,showMainStatus:q=!1,showPagination:N=!1,showTag:_=!1,singleHeaderItemsColumn:U=!1,size:Z="M",statusProps:z={},stepsCount:G,subtitle:F="",tagProps:J={},title:K="",titleDataTestId:L=panel.title,titleProps:Q={},...V}=e;const X=useMemo(()=>mergeClasses(l,r),[r,l]),[Y,$]=useState(null);useEffect(()=>{var e;o&&o.length>0&&(null!==(e=o[0])&&void 0!==e&&e.collapse?$(null):$(o[0].id))},[o]),useEffect(()=>{null!=j&&j.id&&$(j.id)},[j]);const ee=d&&S,te=ee&&!O,oe=!isEmpty(o),{nextButton:ne={},backButton:ae={},currentPage:se=1,totalPages:le=1}=v,{backButton:re,closeButton:ie,iconBack:ce,iconClose:de,perfectScrollbar:pe,...me}=X;return React.createElement(SwipeableDrawer,_extends({anchor:R,BackdropProps:{...a,classes:{root:me.backdrop,...null==a?void 0:a.classes}},classes:{...me,paper:"\n ".concat(styles.paper,"\n ").concat(ee&&O&&styles.collapsedPaper,"\n ").concat(me.paper,"\n ").concat(styles[SIZES[Z]],"\n ").concat(oe&&Y&&styles.withAdditionalContent,"\n ").concat(oe&&!Y&&styles.withAdditionalContentCollapsed,"\n "),root:me.root,docked:"\n ".concat(styles[SIZES[Z]],"\n ").concat(styles.docked,"\n ").concat(te&&styles.collapsed,"\n ").concat(!O&&!d&&styles.closedPersistentPanel,"\n ").concat(oe&&Y&&styles.withAdditionalContentDocked,"\n ").concat(oe&&!Y&&styles.withAdditionalContentCollapsedDocked,"\n ")},disablePortal:S,disableSwipeToOpen:!0,ModalProps:{...k},onClose:w,onOpen:E,open:ee||O,swipeAreaWidth:0,variant:S?d?"permanent":"persistent":"temporary"},V),!te&&React.createElement("div",{className:styles.panelWrapper},React.createElement(ControlAreaSection,{backButton:ae,backButtonClass:re,backButtonDataTestId:n,classes:X,closeButtonClass:ie,closeButtonDataTestId:i,currentPage:se,currentStep:p,hideCloseButton:g,iconBackClass:ce,iconCloseClass:de,isWorkflow:T,nextButton:ne,onClose:w,onGoBack:D,onOpen:E,open:O,panelIsCollapsible:ee,showBackButton:W,showPagination:N,stepsCount:G,totalPages:le}),React.createElement("div",{className:styles.contentRowContainer},React.createElement("div",{className:styles.mainContentSection},React.createElement(HeaderSection,{classes:X,collapsableHeader:c,CustomHeaderComponent:m,HeaderComponent:b,headerItems:C,headerMainActionButton:h,headerSecondaryActionButton:y,hideHeader:f,mainActionDataTestId:P,pretitleComponent:M,secondaryActionDataTestId:x,showMainStatus:q,showTag:_,singleHeaderItemsColumn:U,statusProps:z,subtitle:F,tagProps:J,title:K,titleClass:X.title,titleDataTestId:L,titleProps:Q}),React.createElement(BodySection,{bodyContainerClass:"".concat(styles.bodyContainer," ").concat(null!==(t=null==X?void 0:X.bodyContainer)&&void 0!==t?t:""),disableScrollbar:u,hideMainButton:B,mainButton:I,onEndReachedCallback:A,perfectScrollbarClass:pe,perfectScrollbarOptions:H},s)),oe&&React.createElement(AdditionalContentModule,{activeId:Y,additionalContent:o,onSelectItem:$}))))};UTPanel.propTypes={additionalContent:arrayOf(shape({id:string.isRequired,Icon:string.isRequired,count:number,BodyComponent:elementType.isRequired,tooltipProps:object.isRequired})),backButtonDataTestId:string,BackdropProps:object,classes:objectOf(string),classNames:object,closeButtonDataTestId:string,collapsableHeader:bool,collapsablePanel:bool,currentStep:number,disableScrollbar:bool,CustomHeaderComponent:elementType,HeaderComponent:oneOfType([element,elementType]),headerItems:arrayOf(shape({title:string,icon:string,value:string})),headerMainActionButton:shape({callBack:func,colorTheme:string,text:string,variant:string}),headerSecondaryActionButton:shape({callBack:func,colorTheme:string,text:string,variant:string}),hideCloseButton:bool,hideHeader:bool,hideMainButton:bool,inline:bool,isWorkflow:bool,mainActionDataTestId:string,mainButton:object,modalProps:object,onClose:func,onEndReachedCallback:func,onGoBack:func,onOpen:func,open:bool,openAdditionalContentRequest:object,panelSide:string,perfectScrollbarOptions:object,pretitleComponent:oneOfType([element,elementType]),secondaryActionDataTestId:string,singleHeaderItemsColumn:bool,size:oneOf(Object.keys(SIZES)),showBackButton:bool,showMainStatus:bool,showTag:bool,showPagination:bool,statusProps:object,stepsCount:number,currentPage:number,totalPages:number,subtitle:string,paginationProps:object,tagProps:shape({classes:objectOf(string),className:string,Icon:elementType,iconProps:object,labelDataTestId:string,size:string,title:string,type:string,variant:string,withoutIcon:bool}),title:string,titleDataTestId:string,titleProps:object};export default WithTheme(retrieveStyle)(UTPanel);
1
+ function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var o=arguments[t];for(var n in o)({}).hasOwnProperty.call(o,n)&&(e[n]=o[n])}return e},_extends.apply(null,arguments)}import React,{useMemo,useState,useEffect}from"react";import SwipeableDrawer from"@material-ui/core/SwipeableDrawer";import{arrayOf,bool,element,elementType,func,number,object,objectOf,oneOf,oneOfType,shape,string}from"prop-types";import isEmpty from"lodash/isEmpty";import WithTheme from"../../../WithTheme/index.js";import{TEST_IDS}from"../../../../constants/testIds.js";import{mergeClasses}from"../../../../utils/classesUtils.js";import AdditionalContentModule from"./components/AdditionalContentModule";import ControlAreaSection from"./components/ControlAreaSection";import HeaderSection from"./components/HeaderSection";import BodySection from"./components/BodySection";import styles from"./styles.module.scss";import{SIZES}from"./constants.js";import{retrieveStyle}from"./theme";const{panel:panel}=TEST_IDS,UTPanel=e=>{var t;let{additionalContent:o,backButtonDataTestId:n=panel.backButton,BackdropProps:a={},children:s,classes:l,classNames:r,closeButtonDataTestId:i=panel.closeButton,collapsableHeader:c=!1,collapsablePanel:d=!1,currentStep:p=1,CustomHeaderComponent:m,disableScrollbar:u=!1,HeaderComponent:b,headerItems:C,headerMainActionButton:h={},headerSecondaryActionButton:y={},hideCloseButton:g=!1,hideHeader:f=!1,hideMainButton:B=!1,inline:S=!1,isWorkflow:T=!1,mainActionDataTestId:P=panel.mainAction,mainButton:I={},modalProps:k,onClose:w,onEndReachedCallback:A,onGoBack:D=()=>{},onOpen:E=()=>{},open:O,openAdditionalContentRequest:j,paginationProps:v={},panelSide:R,perfectScrollbarOptions:H,pretitleComponent:M,secondaryActionDataTestId:x=panel.secondaryAction,showBackButton:W=!1,showMainStatus:q=!1,showPagination:N=!1,showTag:_=!1,singleHeaderItemsColumn:U=!1,size:Z="M",statusProps:z={},stepsCount:G,subtitle:F="",tagProps:J={},title:K="",titleDataTestId:L=panel.title,titleProps:Q={},...V}=e;const X=useMemo(()=>mergeClasses(l,r),[r,l]),[Y,$]=useState(null);useEffect(()=>{var e;o&&o.length>0&&(null!==(e=o[0])&&void 0!==e&&e.collapse?$(null):$(o[0].id))},[o]),useEffect(()=>{null!=j&&j.id&&$(j.id)},[j]);const ee=d&&S,te=ee&&!O,oe=!isEmpty(o),{nextButton:ne={},backButton:ae={},currentPage:se=1,totalPages:le=1}=v,{backButton:re,closeButton:ie,iconBack:ce,iconClose:de,perfectScrollbar:pe,...me}=X;return React.createElement(SwipeableDrawer,_extends({anchor:R,BackdropProps:{...a,classes:{root:me.backdrop,...null==a?void 0:a.classes}},classes:{...me,paper:"\n ".concat(styles.paper,"\n ").concat(ee&&O&&styles.collapsedPaper,"\n ").concat(me.paper,"\n ").concat(styles[SIZES[Z]],"\n ").concat(oe&&Y&&styles.withAdditionalContent,"\n ").concat(oe&&!Y&&styles.withAdditionalContentCollapsed,"\n "),root:me.root,docked:"\n ".concat(styles[SIZES[Z]],"\n ").concat(styles.docked,"\n ").concat(te&&styles.collapsed,"\n ").concat(!O&&!d&&styles.closedPersistentPanel,"\n ").concat(oe&&Y&&styles.withAdditionalContentDocked,"\n ").concat(oe&&!Y&&styles.withAdditionalContentCollapsedDocked,"\n ")},disablePortal:S,disableSwipeToOpen:!0,ModalProps:{...k},onClose:w,onOpen:E,open:ee||O,swipeAreaWidth:0,variant:S?d?"permanent":"persistent":"temporary"},V),React.createElement("div",{className:styles.panelWrapper},React.createElement(ControlAreaSection,{backButton:ae,backButtonClass:re,backButtonDataTestId:n,classes:X,closeButtonClass:ie,closeButtonDataTestId:i,currentPage:se,currentStep:p,hideCloseButton:g,iconBackClass:ce,iconCloseClass:de,isWorkflow:T,nextButton:ne,onClose:w,onGoBack:D,onOpen:E,open:O,panelIsCollapsed:te,panelIsCollapsible:ee,showBackButton:W,showPagination:N,stepsCount:G,totalPages:le}),!te&&React.createElement("div",{className:styles.contentRowContainer},React.createElement("div",{className:styles.mainContentSection},React.createElement(HeaderSection,{classes:X,collapsableHeader:c,CustomHeaderComponent:m,HeaderComponent:b,headerItems:C,headerMainActionButton:h,headerSecondaryActionButton:y,hideHeader:f,mainActionDataTestId:P,pretitleComponent:M,secondaryActionDataTestId:x,showMainStatus:q,showTag:_,singleHeaderItemsColumn:U,statusProps:z,subtitle:F,tagProps:J,title:K,titleClass:X.title,titleDataTestId:L,titleProps:Q}),React.createElement(BodySection,{bodyContainerClass:"".concat(styles.bodyContainer," ").concat(null!==(t=null==X?void 0:X.bodyContainer)&&void 0!==t?t:""),disableScrollbar:u,hideMainButton:B,mainButton:I,onEndReachedCallback:A,perfectScrollbarClass:pe,perfectScrollbarOptions:H},s)),oe&&React.createElement(AdditionalContentModule,{activeId:Y,additionalContent:o,onSelectItem:$}))))};UTPanel.propTypes={additionalContent:arrayOf(shape({id:string.isRequired,Icon:string.isRequired,count:number,BodyComponent:elementType.isRequired,tooltipProps:object.isRequired})),backButtonDataTestId:string,BackdropProps:object,classes:objectOf(string),classNames:object,closeButtonDataTestId:string,collapsableHeader:bool,collapsablePanel:bool,currentStep:number,disableScrollbar:bool,CustomHeaderComponent:elementType,HeaderComponent:oneOfType([element,elementType]),headerItems:arrayOf(shape({title:string,icon:string,value:string})),headerMainActionButton:shape({callBack:func,colorTheme:string,text:string,variant:string}),headerSecondaryActionButton:shape({callBack:func,colorTheme:string,text:string,variant:string}),hideCloseButton:bool,hideHeader:bool,hideMainButton:bool,inline:bool,isWorkflow:bool,mainActionDataTestId:string,mainButton:object,modalProps:object,onClose:func,onEndReachedCallback:func,onGoBack:func,onOpen:func,open:bool,openAdditionalContentRequest:object,panelSide:string,perfectScrollbarOptions:object,pretitleComponent:oneOfType([element,elementType]),secondaryActionDataTestId:string,singleHeaderItemsColumn:bool,size:oneOf(Object.keys(SIZES)),showBackButton:bool,showMainStatus:bool,showTag:bool,showPagination:bool,statusProps:object,stepsCount:number,currentPage:number,totalPages:number,subtitle:string,paginationProps:object,tagProps:shape({classes:objectOf(string),className:string,Icon:elementType,iconProps:object,labelDataTestId:string,size:string,title:string,type:string,variant:string,withoutIcon:bool}),title:string,titleDataTestId:string,titleProps:object};export default WithTheme(retrieveStyle)(UTPanel);
@@ -1,5 +1,5 @@
1
1
  $body-component-width: 450px;
2
- $collapsed-panel-size: 58px;
2
+ $collapsed-panel-size: 54px;
3
3
  $large-panel-size: 600px;
4
4
  $medium-panel-size: 450px;
5
5
  $sidebar-width: 56px;
@@ -24,18 +24,27 @@ $additional-content-total: $body-component-width + $sidebar-width;
24
24
  display: flex;
25
25
  flex: 1;
26
26
  gap: var(--UT-panel-gap-sm, 8px);
27
+ opacity: 1;
28
+ overflow: hidden;
29
+ transition: flex-grow 0.3s ease, opacity 0.3s ease;
30
+ }
31
+
32
+ .controlLeftAreaCollapsed {
33
+ flex-grow: 0;
34
+ opacity: 0;
35
+ pointer-events: none;
27
36
  }
28
37
 
29
38
  .backButtonContainer {
30
39
  align-items: center;
31
40
  display: flex;
41
+ flex-shrink: 0;
32
42
  }
33
43
 
34
44
  .controlAreaBar {
35
45
  align-items: center;
36
46
  display: flex;
37
- gap: var(--UT-panel-gap-sm, 8px);
38
- justify-content: space-between;
47
+ justify-content: center;
39
48
  padding: var(--UT-panel-padding-xs, 8px);
40
49
  }
41
50
 
@@ -48,7 +57,9 @@ $additional-content-total: $body-component-width + $sidebar-width;
48
57
  .paginationContainer {
49
58
  align-items: center;
50
59
  display: flex;
60
+ flex-shrink: 0;
51
61
  grid-gap: var(--UT-panel-gap-lg, 16px);
62
+ white-space: nowrap;
52
63
  }
53
64
 
54
65
  .contentRowContainer {
@@ -148,6 +159,14 @@ $additional-content-total: $body-component-width + $sidebar-width;
148
159
  &.withAdditionalContentCollapsed {
149
160
  width: $small-panel-size + $sidebar-width;
150
161
  }
162
+
163
+ &.withAdditionalContentDocked {
164
+ width: $small-panel-size + $additional-content-total;
165
+ }
166
+
167
+ &.withAdditionalContentCollapsedDocked {
168
+ width: $small-panel-size + $sidebar-width;
169
+ }
151
170
  }
152
171
 
153
172
  .large {
@@ -160,6 +179,14 @@ $additional-content-total: $body-component-width + $sidebar-width;
160
179
  &.withAdditionalContentCollapsed {
161
180
  width: $large-panel-size + $sidebar-width;
162
181
  }
182
+
183
+ &.withAdditionalContentDocked {
184
+ width: $large-panel-size + $additional-content-total;
185
+ }
186
+
187
+ &.withAdditionalContentCollapsedDocked {
188
+ width: $large-panel-size + $sidebar-width;
189
+ }
163
190
  }
164
191
 
165
192
  .medium {
@@ -172,6 +199,14 @@ $additional-content-total: $body-component-width + $sidebar-width;
172
199
  &.withAdditionalContentCollapsed {
173
200
  width: $medium-panel-size + $sidebar-width;
174
201
  }
202
+
203
+ &.withAdditionalContentDocked {
204
+ width: $medium-panel-size + $additional-content-total;
205
+ }
206
+
207
+ &.withAdditionalContentCollapsedDocked {
208
+ width: $medium-panel-size + $sidebar-width;
209
+ }
175
210
  }
176
211
 
177
212
  .bodyContainer {
@@ -207,6 +242,7 @@ $additional-content-total: $body-component-width + $sidebar-width;
207
242
  .paper {
208
243
  overflow: hidden;
209
244
  position: relative;
245
+ transition: width 0.3s ease;
210
246
  z-index: 1;
211
247
  }
212
248
 
@@ -215,10 +251,6 @@ $additional-content-total: $body-component-width + $sidebar-width;
215
251
  }
216
252
  }
217
253
 
218
- .withAdditionalContentCollapsedDocked {
219
- transition: width 0.3s ease;
220
- }
221
-
222
254
  .closedPersistentPanel {
223
255
  width: 0;
224
256
  }
@@ -226,6 +258,11 @@ $additional-content-total: $body-component-width + $sidebar-width;
226
258
  .collapsed {
227
259
  width: $collapsed-panel-size;
228
260
 
261
+ &.withAdditionalContentDocked,
262
+ &.withAdditionalContentCollapsedDocked {
263
+ width: $collapsed-panel-size;
264
+ }
265
+
229
266
  .small,
230
267
  .medium,
231
268
  .large {
@@ -1 +1 @@
1
- function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var s in n)({}).hasOwnProperty.call(n,s)&&(e[s]=n[s])}return e},_extends.apply(null,arguments)}import isEmpty from"lodash/isEmpty";import React,{useLayoutEffect,useMemo,useRef,useState}from"react";import ScrollBar from"react-perfect-scrollbar";import{arrayOf,bool,elementType,func,oneOfType,shape,string,number}from"prop-types";import isFinite from"lodash/isFinite";import UTLabel from"../../../../../UTLabel";import UTCheckList from"../../../../../UTCheckList";import{SPACING}from"../../../../../UTCheckList/versions/V1/constants";import styles from"./styles.module.scss";import{DEFAULT_MAX_HEIGHT}from"./constants";const ListboxComponent=e=>{let{CustomRow:t,dataTestId:n,filteredOptions:s,fixedBottomOption:o,handleSelectionChange:a,horizontalSpacing:r=SPACING.SMALL,itemDataTestId:i,maxHeight:l=DEFAULT_MAX_HEIGHT,multiple:m,noMatchesText:c,value:p,verticalSpacing:u=SPACING.SMALL}=e;const f=useMemo(()=>isEmpty(s),[s]),d=useMemo(()=>isFinite(l)?l:DEFAULT_MAX_HEIGHT,[l]),g=useRef(null),[T,h]=useState(0);useLayoutEffect(()=>{g.current&&h(g.current.offsetHeight)},[o]);const y=d-T,b={CustomRow:t,horizontalSpacing:r,isSimple:!m,itemDataTestId:i,onChange:a,reversed:!0,showSelectAll:!1,value:m?p:[p],variant:"button",version:"V1",verticalSpacing:u};return React.createElement("div",{className:styles.listbox},f?React.createElement(UTLabel,{colorTheme:"gray",className:styles.noOptionsLabel},c):React.createElement(ScrollBar,{style:{maxHeight:y}},React.createElement(UTCheckList,_extends({},b,{dataTestId:n,options:s}))),o&&React.createElement("div",{ref:g},React.createElement("div",{className:styles.fixedOptionDivider}),React.createElement(UTCheckList,_extends({},b,{onChange:e=>{m||0!==e.length?a(e):a([o.value])},options:[o]}))))};ListboxComponent.propTypes={CustomRow:elementType,dataTestId:string,filteredOptions:arrayOf(shape({name:string,value:oneOfType([string,number])})),fixedBottomOption:shape({name:string,value:oneOfType([string,number])}),handleSelectionChange:func,horizontalSpacing:string,itemDataTestId:string,maxHeight:number,multiple:bool,noMatchesText:string,value:oneOfType([arrayOf(oneOfType([string,number])),string,number]),verticalSpacing:string};export default ListboxComponent;
1
+ function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var n in a)({}).hasOwnProperty.call(a,n)&&(e[n]=a[n])}return e},_extends.apply(null,arguments)}import isEmpty from"lodash/isEmpty";import React,{useLayoutEffect,useMemo,useRef,useState}from"react";import ScrollBar from"react-perfect-scrollbar";import{arrayOf,bool,elementType,func,oneOfType,shape,string,number}from"prop-types";import isFinite from"lodash/isFinite";import UTLabel from"../../../../../UTLabel";import UTCheckList from"../../../../../UTCheckList";import{SPACING}from"../../../../../UTCheckList/versions/V1/constants";import styles from"./styles.module.scss";import{DEFAULT_MAX_HEIGHT}from"./constants";import{limitOptions}from"./utils";const ListboxComponent=e=>{let{CustomRow:t,dataTestId:a,filteredOptions:n,fixedBottomOption:s,handleSelectionChange:o,helpText:i,helpTextDataTestId:r,horizontalSpacing:l=SPACING.SMALL,itemDataTestId:m,maxHeight:c=DEFAULT_MAX_HEIGHT,maxOptions:p,multiple:u,noMatchesText:f,value:T,verticalSpacing:h=SPACING.SMALL}=e;const d=useMemo(()=>isEmpty(n),[n]),g=useMemo(()=>isFinite(c)?c:DEFAULT_MAX_HEIGHT,[c]),y=useRef(null),[x,b]=useState(0);useLayoutEffect(()=>{y.current&&b(y.current.offsetHeight)},[s]);const v=g-x,L={CustomRow:t,horizontalSpacing:l,isSimple:!u,itemDataTestId:m,onChange:o,reversed:!0,showSelectAll:!1,value:u?T:[T],variant:"button",version:"V1",verticalSpacing:h},O=i&&React.createElement("div",{className:styles.helpText,onMouseDown:e=>e.preventDefault(),role:"presentation"},React.createElement(UTLabel,{className:styles.helpTextLabel,colorTheme:"gray",dataTestId:r,shade:"04",variant:"small"},i));return React.createElement("div",{className:styles.listbox},d?React.createElement(React.Fragment,null,O,React.createElement(UTLabel,{colorTheme:"gray",className:styles.noOptionsLabel},f)):React.createElement(ScrollBar,{style:{maxHeight:v}},O,React.createElement(UTCheckList,_extends({},L,{dataTestId:a,options:limitOptions(n,T,p)}))),s&&React.createElement("div",{ref:y},React.createElement("div",{className:styles.fixedOptionDivider}),React.createElement(UTCheckList,_extends({},L,{onChange:e=>{u||0!==e.length?o(e):o([s.value])},options:limitOptions([s],T,p)}))))};ListboxComponent.propTypes={CustomRow:elementType,dataTestId:string,filteredOptions:arrayOf(shape({name:string,value:oneOfType([string,number])})),fixedBottomOption:shape({name:string,value:oneOfType([string,number])}),handleSelectionChange:func,helpText:string,helpTextDataTestId:string,horizontalSpacing:string,itemDataTestId:string,maxHeight:number,maxOptions:number,multiple:bool,noMatchesText:string,value:oneOfType([arrayOf(oneOfType([string,number])),string,number]),verticalSpacing:string};export default ListboxComponent;
@@ -3,6 +3,14 @@
3
3
  flex-direction: column;
4
4
  }
5
5
 
6
+ .helpText {
7
+ padding: var(--padding-sm, 12px) 0;
8
+ }
9
+
10
+ .helpTextLabel {
11
+ font-style: italic;
12
+ }
13
+
6
14
  .noOptionsLabel {
7
15
  text-align: center;
8
16
  }
@@ -0,0 +1 @@
1
+ export const limitOptions=(i,a,e)=>!e||!Array.isArray(a)||a.length<e?i:i.map(i=>({...i,disabled:i.disabled||!a.includes(i.value)}));
@@ -1 +1 @@
1
- function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var o=arguments[t];for(var a in o)({}).hasOwnProperty.call(o,a)&&(e[a]=o[a])}return e},_extends.apply(null,arguments)}import clone from"lodash/clone";import React,{useMemo,useState,useRef,useCallback,useEffect}from"react";import{Autocomplete}from"@material-ui/lab";import Popper from"@material-ui/core/Popper";import UTFieldLabel from"../../../UTFieldLabel";import UTLabel from"../../../UTLabel";import UTPaper from"../../../UTPaper";import UTValidation from"../../../UTValidation";import{formatErrorToValidation}from"../../../UTValidation/utils";import{TITLE_VARIANTS}from"../../../../constants/inputs";import InputComponent from"./components/InputComponent";import ListboxComponent from"./components/ListboxComponent";import{utselectTypes}from"./types";import styles from"./styles.module.scss";import{VARIANTS}from"./constants";import{getLeftAdornments,getRightAdornments,shouldReset,getDisplayValue,sortOptions}from"./utils";const UTSelect=e=>{let{action:t,actions:o,alwaysShowPlaceholder:a=!0,autocompleteProps:n={},className:s,clearable:r=!0,CustomRow:l,dataTestId:i,disabled:c,disableFilterOptions:p=!1,error:u,errorDataTestId:m,fixedBottomOption:d,freeWidth:f=!1,hideSingleCategoryTitle:T=!1,paperClassName:h,helpText:y,icon:g,inputSize:b,itemDataTestId:C,listDataTestId:R,listProps:x={},menuWidth:A,multiple:S=!1,noMatchesText:v="No hay coincidencias con tu búsqueda",noOptionsText:L="No hay opciones disponibles",onChange:O=()=>{},onChangeSearchTerm:E=()=>{},options:I=[],placeholder:U,prefix:V,readOnly:P,required:w,suffix:M,title:N,titleVariant:D=TITLE_VARIANTS.large,value:_=(S?[]:null),variant:k=VARIANTS.select,withAutoReset:z=!0}=e;const F=useMemo(()=>{if(!I||0===I.length)return[];const e=clone(I).map(e=>({...e,name:"".concat(e.name)})),t=new Map;e.forEach(e=>{t.has(e.category)||t.set(e.category,t.size)});const o=e.sort((e,o)=>t.get(e.category)-t.get(o.category));return T&&t.size<=1?o.map(e=>{let{category:t,...o}=e;return o}):o},[I,T]),B=useMemo(()=>d?[...F,d]:F,[F,d]),[q,j]=useState(!1),[W,G]=useState(getDisplayValue(_,B,S)),[H,J]=useState(!!W),[K,Q]=useState(F),X=useRef(null);useEffect(()=>{const e=d&&(S?Array.isArray(_)&&_.includes(d.value):_===(null==d?void 0:d.value));z&&!e&&shouldReset(_,F,S)&&(O(null),Q(sortOptions(F,null,S)))},[S,O,F,_,z,d]),useEffect(()=>{if(!q){const e=getDisplayValue(_,B,S);G(e),J(e)}},[_,B,S,q]),useEffect(()=>{q&&Q(sortOptions(F,_,S))},[F]),useEffect(()=>{Q(sortOptions(F,_,S))},[]),useEffect(()=>{q&&Q(sortOptions(F,_,S))},[q]);const Y=useMemo(()=>u&&formatErrorToValidation(u),[u]),Z=k===VARIANTS.picker,$=useMemo(()=>{const e=p||Z?K:K.filter(e=>"".concat(e.name).toLowerCase().includes(W.toLowerCase()));return d?e.filter(e=>e.value!==d.value):e},[K,W,p,Z,d]),ee=useCallback(e=>{null==E||E(e),G(e)},[E]),te=useCallback(e=>{j(!1);const t=getDisplayValue(e,B,S);ee(t),J(""!==t)},[getDisplayValue,B,S,ee]),oe=e=>{const t=S?e:e.length>0?e[0]:"";var o;(O(t),S)||(null===(o=X.current)||void 0===o||o.blur(),te(t))},ae=()=>{J(!1),ee(""),j(!0)},ne=()=>{te(_)},se=()=>{O(S?[]:null),ee(""),J(!1),j(!1)},re=useMemo(()=>getLeftAdornments({error:u,multiple:S,value:_,prefix:V,icon:g}),[S,_,V,g]),le=useMemo(()=>getRightAdornments({action:t,clearable:r,disabled:c,handleClearSelection:se,readOnly:P,showClearButton:H,suffix:M,variant:k}),[M,H,r,c,t,se,k]),ie=useMemo(()=>({CustomRow:l,dataTestId:R,filteredOptions:$,fixedBottomOption:d,handleSelectionChange:oe,itemDataTestId:C,multiple:S,noMatchesText:v,value:_,...x}),[l,$,d,oe,S,v,_,x]),ce=useRef(A);ce.current=A;const pe=useCallback(e=>{const t=ce.current;return React.createElement(Popper,_extends({},e,t?{placement:"bottom-start"}:{},{style:t?{...e.style,width:t}:e.style}))},[]),ue=React.createElement(UTLabel,{className:styles.noOptionsLabel,colorTheme:"gray"},L);return React.createElement("div",{className:"".concat(styles.container," ").concat(s)},N&&React.createElement(UTFieldLabel,{actions:o,required:w,size:D},N),React.createElement(Autocomplete,_extends({classes:{...f&&!A?{popper:styles.popper}:{},...h?{paper:h}:{}},PopperComponent:pe,disabled:c||P,getOptionLabel:e=>"".concat(e.name),ListboxComponent:ListboxComponent,ListboxProps:ie,multiple:S,noOptionsText:ue,onClose:()=>j(!1),onOpen:()=>j(!0),open:q,options:F,PaperComponent:UTPaper,renderInput:e=>React.createElement(InputComponent,{alwaysShowPlaceholder:a,dataTestId:i,disabled:c,error:u,inputRef:X,inputSize:b,leftAdornments:re,onBlur:ne,onChange:ee,onFocus:ae,params:e,placeholder:U,readOnly:P,rightAdornments:le,value:W,variant:k})},n)),y&&React.createElement(UTLabel,{colorTheme:"gray",variant:"small"},y),Y&&React.createElement(UTValidation,{dataTestId:m,validationData:Y}))};UTSelect.propTypes=utselectTypes;export default UTSelect;
1
+ function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var o=arguments[t];for(var a in o)({}).hasOwnProperty.call(o,a)&&(e[a]=o[a])}return e},_extends.apply(null,arguments)}import clone from"lodash/clone";import React,{useMemo,useState,useRef,useCallback,useEffect}from"react";import{Autocomplete}from"@material-ui/lab";import Popper from"@material-ui/core/Popper";import UTFieldLabel from"../../../UTFieldLabel";import UTLabel from"../../../UTLabel";import UTPaper from"../../../UTPaper";import UTValidation from"../../../UTValidation";import{formatErrorToValidation}from"../../../UTValidation/utils";import{TITLE_VARIANTS}from"../../../../constants/inputs";import InputComponent from"./components/InputComponent";import ListboxComponent from"./components/ListboxComponent";import{utselectTypes}from"./types";import styles from"./styles.module.scss";import{VARIANTS}from"./constants";import{getLeftAdornments,getRightAdornments,shouldReset,getDisplayValue,sortOptions}from"./utils";const UTSelect=e=>{let{action:t,actions:o,alwaysShowPlaceholder:a=!0,autocompleteProps:n={},className:s,clearable:r=!0,CustomRow:l,dataTestId:i,disabled:p,disableFilterOptions:c=!1,error:m,errorDataTestId:u,fixedBottomOption:d,freeWidth:f=!1,hideSingleCategoryTitle:T=!1,paperClassName:h,helpText:y,icon:g,inputSize:b,itemDataTestId:x,listDataTestId:C,listProps:R={},maxOptions:O,menuHelpText:A,menuHelpTextDataTestId:I,menuWidth:S,multiple:v=!1,noMatchesText:L="No hay coincidencias con tu búsqueda",noOptionsText:E="No hay opciones disponibles",onChange:U=()=>{},onChangeSearchTerm:V=()=>{},options:P=[],placeholder:w,prefix:D,readOnly:M,required:N,suffix:_,title:k,titleVariant:z=TITLE_VARIANTS.large,value:F=(v?[]:null),variant:B=VARIANTS.select,withAutoReset:q=!0}=e;const j=useMemo(()=>{if(!P||0===P.length)return[];const e=clone(P).map(e=>({...e,name:"".concat(e.name)})),t=new Map;e.forEach(e=>{t.has(e.category)||t.set(e.category,t.size)});const o=e.sort((e,o)=>t.get(e.category)-t.get(o.category));return T&&t.size<=1?o.map(e=>{let{category:t,...o}=e;return o}):o},[P,T]),H=useMemo(()=>d?[...j,d]:j,[j,d]),[W,G]=useState(!1),[J,K]=useState(getDisplayValue(F,H,v)),[Q,X]=useState(!!J),[Y,Z]=useState(j),$=useRef(null);useEffect(()=>{const e=d&&(v?Array.isArray(F)&&F.includes(d.value):F===(null==d?void 0:d.value));q&&!e&&shouldReset(F,j,v)&&(U(null),Z(sortOptions(j,null,v)))},[v,U,j,F,q,d]),useEffect(()=>{if(!W){const e=getDisplayValue(F,H,v);K(e),X(e)}},[F,H,v,W]),useEffect(()=>{W&&Z(sortOptions(j,F,v))},[j]),useEffect(()=>{Z(sortOptions(j,F,v))},[]),useEffect(()=>{W&&Z(sortOptions(j,F,v))},[W]);const ee=useMemo(()=>m&&formatErrorToValidation(m),[m]),te=B===VARIANTS.picker,oe=useMemo(()=>{const e=c||te?Y:Y.filter(e=>"".concat(e.name).toLowerCase().includes(J.toLowerCase()));return d?e.filter(e=>e.value!==d.value):e},[Y,J,c,te,d]),ae=useCallback(e=>{null==V||V(e),K(e)},[V]),ne=useCallback(e=>{G(!1);const t=getDisplayValue(e,H,v);ae(t),X(""!==t)},[getDisplayValue,H,v,ae]),se=e=>{const t=v?e:e.length>0?e[0]:"";var o;(U(t),v)||(null===(o=$.current)||void 0===o||o.blur(),ne(t))},re=()=>{X(!1),ae(""),G(!0)},le=()=>{ne(F)},ie=()=>{U(v?[]:null),ae(""),X(!1),G(!1)},pe=useMemo(()=>getLeftAdornments({error:m,multiple:v,value:F,prefix:D,icon:g}),[v,F,D,g]),ce=useMemo(()=>getRightAdornments({action:t,clearable:r,disabled:p,handleClearSelection:ie,readOnly:M,showClearButton:Q,suffix:_,variant:B}),[_,Q,r,p,t,ie,B]),me=useMemo(()=>({CustomRow:l,dataTestId:C,filteredOptions:oe,fixedBottomOption:d,handleSelectionChange:se,helpText:A,helpTextDataTestId:I,itemDataTestId:x,maxOptions:O,multiple:v,noMatchesText:L,value:F,...R}),[l,oe,d,se,O,A,I,v,L,F,R]),ue=useRef(S);ue.current=S;const de=useCallback(e=>{const t=ue.current;return React.createElement(Popper,_extends({},e,t?{placement:"bottom-start"}:{},{style:t?{...e.style,width:t}:e.style}))},[]),fe=React.createElement(UTLabel,{className:styles.noOptionsLabel,colorTheme:"gray"},E);return React.createElement("div",{className:"".concat(styles.container," ").concat(s)},k&&React.createElement(UTFieldLabel,{actions:o,required:N,size:z},k),React.createElement(Autocomplete,_extends({classes:{...f&&!S?{popper:styles.popper}:{},...h?{paper:h}:{}},PopperComponent:de,disabled:p||M,getOptionLabel:e=>"".concat(e.name),ListboxComponent:ListboxComponent,ListboxProps:me,multiple:v,noOptionsText:fe,onClose:()=>G(!1),onOpen:()=>G(!0),open:W,options:j,PaperComponent:UTPaper,renderInput:e=>React.createElement(InputComponent,{alwaysShowPlaceholder:a,dataTestId:i,disabled:p,error:m,inputRef:$,inputSize:b,leftAdornments:pe,onBlur:le,onChange:ae,onFocus:re,params:e,placeholder:w,readOnly:M,rightAdornments:ce,value:J,variant:B})},n)),y&&React.createElement(UTLabel,{colorTheme:"gray",variant:"small"},y),ee&&React.createElement(UTValidation,{dataTestId:u,validationData:ee}))};UTSelect.propTypes=utselectTypes;export default UTSelect;
@@ -1 +1 @@
1
- import{arrayOf,bool,elementType,func,number,object,oneOf,oneOfType,shape,string}from"prop-types";import{buttonTypes}from"../../../../types/buttonTypes";import{VARIANTS}from"./constants";export const utselectTypes={action:shape({Icon:string,onClick:func,size:string}),actions:arrayOf(buttonTypes),alwaysShowPlaceholder:bool,autocompleteProps:object,className:string,clearable:bool,CustomRow:elementType,dataTestId:string,disabled:bool,disableFilterOptions:bool,error:string,errorDataTestId:string,fixedBottomOption:shape({name:string,value:oneOfType([string,number])}),freeWidth:bool,hideSingleCategoryTitle:bool,paperClassName:string,helpText:string,icon:string,inputSize:string,itemDataTestId:string,listDataTestId:string,listProps:object,menuWidth:string,multiple:bool,noMatchesText:string,noOptionsText:string,onChange:func,onChangeSearchTerm:func,options:arrayOf(shape({name:string,value:oneOfType([string,number])})),placeholder:string,prefix:string,readOnly:bool,required:bool,suffix:string,title:string,titleVariant:string,value:oneOfType([string,arrayOf(oneOfType([string,number]))]),variant:oneOf(Object.values(VARIANTS)),withAutoReset:bool};
1
+ import{arrayOf,bool,elementType,func,number,object,oneOf,oneOfType,shape,string}from"prop-types";import{buttonTypes}from"../../../../types/buttonTypes";import{VARIANTS}from"./constants";export const utselectTypes={action:shape({Icon:string,onClick:func,size:string}),actions:arrayOf(buttonTypes),alwaysShowPlaceholder:bool,autocompleteProps:object,className:string,clearable:bool,CustomRow:elementType,dataTestId:string,disabled:bool,disableFilterOptions:bool,error:string,errorDataTestId:string,fixedBottomOption:shape({name:string,value:oneOfType([string,number])}),freeWidth:bool,hideSingleCategoryTitle:bool,paperClassName:string,helpText:string,icon:string,inputSize:string,itemDataTestId:string,listDataTestId:string,listProps:object,maxOptions:number,menuHelpText:string,menuHelpTextDataTestId:string,menuWidth:string,multiple:bool,noMatchesText:string,noOptionsText:string,onChange:func,onChangeSearchTerm:func,options:arrayOf(shape({name:string,value:oneOfType([string,number])})),placeholder:string,prefix:string,readOnly:bool,required:bool,suffix:string,title:string,titleVariant:string,value:oneOfType([string,arrayOf(oneOfType([string,number]))]),variant:oneOf(Object.values(VARIANTS)),withAutoReset:bool};
@@ -1 +1 @@
1
- function _defineProperty(e,t,i){return(t=_toPropertyKey(t))in e?Object.defineProperty(e,t,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[t]=i,e}function _toPropertyKey(e){var t=_toPrimitive(e,"string");return"symbol"==typeof t?t:t+""}function _toPrimitive(e,t){if("object"!=typeof e||!e)return e;var i=e[Symbol.toPrimitive];if(void 0!==i){var a=i.call(e,t||"default");if("object"!=typeof a)return a;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}import React,{Component}from"react";import{arrayOf,bool,elementType,func,node,number,object,objectOf,oneOfType,shape,string}from"prop-types";import{fileSignatureValidation,fileSizeValidation}from"@widergy/web-utils/lib/validate";import{resizeImage}from"@widergy/web-utils/lib/image";import{isIE}from"@widergy/web-utils/lib/browser";import{isEmpty}from"@widergy/web-utils/lib/array";import WithTheme from"../../components/WithTheme";import{buttonTypes}from"../../types/buttonTypes";import{retrieveStyle}from"./theme";import{FORMAT_ERROR_TEXT,SIZE_ERROR_TEXT,ASPECT_RATIO_ERROR_TEXT,DEFAULT_UPLOADING_TEXT,DEFAULT_ATTACHMENT_NAME,previewPropType}from"./constants";import Attachment from"./layout";import{getBlobFromUrl,pdfAspectRatioValidation,hasPreview,isImage,isPDF,isValidFile,isNewFile}from"./utils";class AttachmentContainer extends Component{constructor(e){super(e),_defineProperty(this,"loadElement",()=>{const{input:e,onLoaded:t}=this.props;getBlobFromUrl(e.value,i=>{if(null!=i&&i.type){const t=i.type.substring(i.type.indexOf("/")+1);this.setState({name:this.getDefaultAttachment(e.value,t)}),hasPreview(i)&&this.buildPreview(i)}else this.setState({name:this.getDefaultAttachment(e.value)});t&&t()})}),_defineProperty(this,"loadDefaultValues",()=>{const{input:e}=this.props;this.hasDefaultValueToLoad()?this.loadElement():this.hasDefaultFileObjectToLoad()&&this.setFile(e.value.file)}),_defineProperty(this,"getDefaultAttachment",(e,t)=>e&&"string"==typeof e&&React.createElement("a",{href:e,target:"_blank",rel:"noopener noreferrer"},DEFAULT_ATTACHMENT_NAME,t&&".".concat(t))||""),_defineProperty(this,"hasDefaultValueToLoad",()=>this.props.input.value&&"string"==typeof this.props.input.value),_defineProperty(this,"hasDefaultFileObjectToLoad",()=>{const{input:e}=this.props;return e.value&&"object"==typeof e.value&&isValidFile(e.value.file)}),_defineProperty(this,"onChange",async e=>{var t;let i=e.target.files[0];const{resizeConfig:a,disableResize:r}=this.props,s={formatError:FORMAT_ERROR_TEXT,sizeError:"".concat(SIZE_ERROR_TEXT," ").concat(Math.round(this.props.maxFileSize/1048576),"MB."),aspectRatioError:"".concat(ASPECT_RATIO_ERROR_TEXT," ").concat(null===(t=this.props.allowedPDFUploadSizes)||void 0===t?void 0:t.map(e=>e.name).join(" - "),")")};if(this.setState({error:!1}),i){let e=!this.props.customValidation||await this.props.customValidation(i,this.onFailValidation);if(e){if(e=await fileSignatureValidation(i,this.props.fieldTypes,i.type),e)return this.props.sanitize&&(i=await this.props.sanitize(i)),e=fileSizeValidation(i,this.props.maxFileSize),e&&isPDF(i)&&!isEmpty(this.props.allowedPDFUploadSizes)?(e=await pdfAspectRatioValidation(i,this.props.allowedPDFUploadSizes),e?this.setFile(i):this.onFailValidation(s.aspectRatioError)):(e||r||!isImage(i)||isIE()||(i=await resizeImage(i,a),e=fileSizeValidation(i,this.props.maxFileSize)),e?this.setFile(i):this.onFailValidation(s.sizeError));this.onFailValidation(s.formatError)}}}),_defineProperty(this,"onFailValidation",e=>this.setState({error:!0,errorText:e})),_defineProperty(this,"setFile",async e=>{const{onChange:t,onLoaded:i}=this.props;this.setState({loading:!0,name:e.name}),hasPreview(e)&&this.buildPreview(e),t&&t({file:e}),this.setState({loading:!1}),i&&i()}),_defineProperty(this,"buildPreview",e=>{const t=new FileReader;t.onload=t=>this.setState({preview:{src:t.target.result,type:e.type}}),t.readAsDataURL(e)}),_defineProperty(this,"removeValue",()=>{this.setState({loading:!1,name:"",preview:{}}),this.props.onChange&&this.props.onChange("")}),this.state={loading:!1,name:"",preview:{},error:!1,errorText:FORMAT_ERROR_TEXT}}componentDidMount(){this.loadDefaultValues()}componentDidUpdate(e){var t;const{fieldTypes:i,input:a}=this.props;(null===(t=e.fieldTypes)||void 0===t?void 0:t[0])!==(null==i?void 0:i[0])?this.removeValue():isNewFile(e.input.value,a.value)&&this.loadDefaultValues()}render(){const{acceptedFileTypes:e,actions:t,classes:i,containerClassname:a,dataTestId:r,deleteDataTestId:s,disabled:o,errorClassname:n,field:l,fieldTypes:p,hideLabels:d,icon:m,input:h,loadingTextClassname:u,previewClassname:f,previewDataTestId:c,previewProps:T,RemoveIcon:y,removeFileClassname:g,titleVariant:v}=this.props,{name:b,preview:w,loading:E,error:F,errorText:P}=this.state,R=this.hasDefaultValueToLoad()&&!b;return React.createElement(Attachment,{acceptedFileTypes:e,actions:t,classes:i,containerClassname:a,dataTestId:r,deleteDataTestId:s,disabled:o,error:F,errorClassname:n,errorText:P,field:l,fieldTypes:p,hideLabels:d,icon:m,loading:E||R,loadingTextClassname:u,name:b||this.getDefaultAttachment(h.value),onChange:this.onChange,onClick:this.removeValue,preview:w,previewClassname:f,previewDataTestId:c,previewProps:T,removeFileClassname:g,RemoveIcon:y,titleVariant:v,uploadingText:R?DEFAULT_UPLOADING_TEXT:""})}}AttachmentContainer.propTypes={acceptedFileTypes:string,actions:arrayOf(buttonTypes),allowedPDFUploadSizes:arrayOf(shape({name:string,heightInPt:number,widthInPt:number,tolerance:number})),classes:objectOf(string),containerClassname:string,customValidation:func,dataTestId:string,deleteDataTestId:string,disableResize:bool,disabled:bool,errorClassname:string,field:object,fieldTypes:arrayOf(string),hideLabels:string,icon:node,input:shape({value:oneOfType([string,shape({name:string,type:string})])}),loadingTextClassname:string,maxFileSize:number,onChange:func,onLoaded:func,previewClassname:string,previewDataTestId:string,previewProps:previewPropType,removeFileClassname:string,RemoveIcon:elementType,resizeConfig:shape({type:string,maxWidth:number,maxHeight:number}),sanitize:func,titleVariant:string},AttachmentContainer.defaultProps={maxFileSize:99999999};export default WithTheme(retrieveStyle)(AttachmentContainer);
1
+ function _defineProperty(e,t,i){return(t=_toPropertyKey(t))in e?Object.defineProperty(e,t,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[t]=i,e}function _toPropertyKey(e){var t=_toPrimitive(e,"string");return"symbol"==typeof t?t:t+""}function _toPrimitive(e,t){if("object"!=typeof e||!e)return e;var i=e[Symbol.toPrimitive];if(void 0!==i){var a=i.call(e,t||"default");if("object"!=typeof a)return a;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}import React,{Component}from"react";import{arrayOf,bool,elementType,func,node,number,object,objectOf,oneOfType,shape,string}from"prop-types";import{fileSignatureValidation,fileSizeValidation}from"@widergy/web-utils/lib/validate";import{resizeImage}from"@widergy/web-utils/lib/image";import{isIE}from"@widergy/web-utils/lib/browser";import{isEmpty}from"@widergy/web-utils/lib/array";import WithTheme from"../../components/WithTheme";import{buttonTypes}from"../../types/buttonTypes";import{retrieveStyle}from"./theme";import{FORMAT_ERROR_TEXT,SIZE_ERROR_TEXT,ASPECT_RATIO_ERROR_TEXT,DEFAULT_UPLOADING_TEXT,DEFAULT_ATTACHMENT_NAME,previewPropType}from"./constants";import Attachment from"./layout";import{getBlobFromUrl,pdfAspectRatioValidation,hasPreview,isImage,isPDF,isValidFile,isNewFile}from"./utils";class AttachmentContainer extends Component{constructor(e){super(e),_defineProperty(this,"loadElement",()=>{const{input:e,onLoaded:t}=this.props;getBlobFromUrl(e.value,i=>{if(null!=i&&i.type){const t=i.type.substring(i.type.indexOf("/")+1);this.setState({name:this.getDefaultAttachment(e.value,t)}),hasPreview(i)&&this.buildPreview(i)}else this.setState({name:this.getDefaultAttachment(e.value)});t&&t()})}),_defineProperty(this,"loadDefaultValues",()=>{const{input:e}=this.props;this.hasDefaultValueToLoad()?this.loadElement():this.hasDefaultFileObjectToLoad()&&this.setFile(e.value.file)}),_defineProperty(this,"getDefaultAttachment",(e,t)=>e&&"string"==typeof e&&React.createElement("a",{href:e,target:"_blank",rel:"noopener noreferrer"},DEFAULT_ATTACHMENT_NAME,t&&".".concat(t))||""),_defineProperty(this,"hasDefaultValueToLoad",()=>this.props.input.value&&"string"==typeof this.props.input.value),_defineProperty(this,"hasDefaultFileObjectToLoad",()=>{const{input:e}=this.props;return e.value&&"object"==typeof e.value&&isValidFile(e.value.file)}),_defineProperty(this,"onChange",async e=>{var t;let i=e.target.files[0];const{resizeConfig:a,disableResize:r}=this.props,s={formatError:FORMAT_ERROR_TEXT,sizeError:"".concat(SIZE_ERROR_TEXT," ").concat(Math.round(this.props.maxFileSize/1048576),"MB."),aspectRatioError:"".concat(ASPECT_RATIO_ERROR_TEXT," ").concat(null===(t=this.props.allowedPDFUploadSizes)||void 0===t?void 0:t.map(e=>e.name).join(" - "),")")};if(this.setState({error:!1}),i){let e=!this.props.customValidation||await this.props.customValidation(i,this.onFailValidation);if(e){if(e=await fileSignatureValidation(i,this.props.fieldTypes,i.type),e){if(this.props.sanitize)try{i=await this.props.sanitize(i)}catch(e){return this.onFailValidation(s.formatError)}return e=fileSizeValidation(i,this.props.maxFileSize),e&&isPDF(i)&&!isEmpty(this.props.allowedPDFUploadSizes)?(e=await pdfAspectRatioValidation(i,this.props.allowedPDFUploadSizes),e?this.setFile(i):this.onFailValidation(s.aspectRatioError)):(e||r||!isImage(i)||isIE()||(i=await resizeImage(i,a),e=fileSizeValidation(i,this.props.maxFileSize)),e?this.setFile(i):this.onFailValidation(s.sizeError))}this.onFailValidation(s.formatError)}}}),_defineProperty(this,"onFailValidation",e=>this.setState({error:!0,errorText:e})),_defineProperty(this,"setFile",async e=>{const{onChange:t,onLoaded:i}=this.props;this.setState({loading:!0,name:e.name}),hasPreview(e)&&this.buildPreview(e),t&&t({file:e}),this.setState({loading:!1}),i&&i()}),_defineProperty(this,"buildPreview",e=>{const t=new FileReader;t.onload=t=>this.setState({preview:{src:t.target.result,type:e.type}}),t.readAsDataURL(e)}),_defineProperty(this,"removeValue",()=>{this.setState({loading:!1,name:"",preview:{}}),this.props.onChange&&this.props.onChange("")}),this.state={loading:!1,name:"",preview:{},error:!1,errorText:FORMAT_ERROR_TEXT}}componentDidMount(){this.loadDefaultValues()}componentDidUpdate(e){var t;const{fieldTypes:i,input:a}=this.props;(null===(t=e.fieldTypes)||void 0===t?void 0:t[0])!==(null==i?void 0:i[0])?this.removeValue():isNewFile(e.input.value,a.value)&&this.loadDefaultValues()}render(){const{acceptedFileTypes:e,actions:t,classes:i,containerClassname:a,dataTestId:r,deleteDataTestId:s,disabled:o,errorClassname:n,field:l,fieldTypes:p,hideLabels:d,icon:m,input:h,loadingTextClassname:u,previewClassname:f,previewDataTestId:c,previewProps:T,RemoveIcon:y,removeFileClassname:g,titleVariant:v}=this.props,{name:b,preview:w,loading:E,error:F,errorText:P}=this.state,R=this.hasDefaultValueToLoad()&&!b;return React.createElement(Attachment,{acceptedFileTypes:e,actions:t,classes:i,containerClassname:a,dataTestId:r,deleteDataTestId:s,disabled:o,error:F,errorClassname:n,errorText:P,field:l,fieldTypes:p,hideLabels:d,icon:m,loading:E||R,loadingTextClassname:u,name:b||this.getDefaultAttachment(h.value),onChange:this.onChange,onClick:this.removeValue,preview:w,previewClassname:f,previewDataTestId:c,previewProps:T,removeFileClassname:g,RemoveIcon:y,titleVariant:v,uploadingText:R?DEFAULT_UPLOADING_TEXT:""})}}AttachmentContainer.propTypes={acceptedFileTypes:string,actions:arrayOf(buttonTypes),allowedPDFUploadSizes:arrayOf(shape({name:string,heightInPt:number,widthInPt:number,tolerance:number})),classes:objectOf(string),containerClassname:string,customValidation:func,dataTestId:string,deleteDataTestId:string,disableResize:bool,disabled:bool,errorClassname:string,field:object,fieldTypes:arrayOf(string),hideLabels:string,icon:node,input:shape({value:oneOfType([string,shape({name:string,type:string})])}),loadingTextClassname:string,maxFileSize:number,onChange:func,onLoaded:func,previewClassname:string,previewDataTestId:string,previewProps:previewPropType,removeFileClassname:string,RemoveIcon:elementType,resizeConfig:shape({type:string,maxWidth:number,maxHeight:number}),sanitize:func,titleVariant:string},AttachmentContainer.defaultProps={maxFileSize:99999999};export default WithTheme(retrieveStyle)(AttachmentContainer);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@widergy/energy-ui",
3
- "version": "3.188.7",
3
+ "version": "3.190.0",
4
4
  "description": "Widergy Web Components",
5
5
  "author": "widergy",
6
6
  "license": "MIT",