@widergy/energy-ui 3.173.2 → 3.173.4

package/dist/esm/components/UTCuit/versions/V0/theme.js

@@ -1,59 +1 @@
-import { getIn } from 'seamless-immutable';
-import { createTheme } from '@material-ui/core/styles';
-import Colors from '../../../../scss/variables/colors.module.scss';
-export const retrieveMuiTheme = theme => createTheme({
-  typography: {
-    fontFamily: getIn(theme, ['Fonts', 'fontFamily'])
-  },
-  overrides: {
-    MuiInput: {
-      input: {
-        fontSize: getIn(theme, ['UTTextInput', 'fontSize'], getIn(theme, ['Fonts', 'medium'], 14)),
-        color: getIn(theme, ['UTTextInput', 'color'])
-      },
-      underline: {
-        '&:hover:not($disabled):not($focused):not($error):before': {
-          borderBottom: getIn(theme, ['UTTextInput', 'underline', 'hover', 'borderBottom'], "1px solid ".concat(Colors.gray))
-        },
-        '&$disabled:before': {
-          borderBottom: getIn(theme, ['UTTextInput', 'underline', 'disabled', 'borderBottom'], "1px solid ".concat(Colors.gray))
-        },
-        '&:before': {
-          borderBottom: getIn(theme, ['UTTextInput', 'underline', 'unfocused', 'borderBottom'], "1px solid ".concat(Colors.gray))
-        },
-        '&$focused:after': {
-          borderBottom: getIn(theme, ['UTTextInput', 'underline', 'focused', 'borderBottom'], "2px solid ".concat(Colors.primary))
-        },
-        '&:after': {
-          borderBottom: getIn(theme, ['UTTextInput', 'underline', 'base', 'borderBottom'], "2px solid ".concat(Colors.primary))
-        },
-        '&$error:after': {
-          borderBottom: "2px solid ".concat(theme.Palette.error['05']),
-          borderBottomColor: theme.Palette.error['05']
-        }
-      }
-    },
-    MuiFormLabel: {
-      root: {
-        color: getIn(theme, ['UTTextInput', 'formLabel', 'color']),
-        '&$error': {
-          color: getIn(theme, ['UTTextInput', 'formLabel', 'errorColor'], Colors.gray)
-        },
-        '&$focused': {
-          color: getIn(theme, ['UTTextInput', 'formLabel', 'focusedColor'], Colors.primary),
-          '&$error': {
-            color: theme.Palette.error['05']
-          }
-        },
-        fontFamily: getIn(theme, ['Fonts', 'fontFamily']),
-        fontSize: getIn(theme, ['UTTextInput', 'fontSize'], getIn(theme, ['Fonts', 'medium'], 14))
-      }
-    },
-    MuiFormHelperText: {
-      root: {
-        fontSize: getIn(theme, ['UTTextInput', 'helperText', 'fontSize'], 12),
-        color: getIn(theme, ['UTTextInput', 'helperText', 'color'], theme.Palette.error['05'])
-      }
-    }
-  }
-});
+import{getIn}from"seamless-immutable";import{createTheme}from"@material-ui/core/styles";import Colors from"../../../../scss/variables/colors.module.scss";export const retrieveMuiTheme=o=>createTheme({typography:{fontFamily:getIn(o,["Fonts","fontFamily"])},overrides:{MuiInput:{input:{fontSize:getIn(o,["UTTextInput","fontSize"],getIn(o,["Fonts","medium"],14)),color:getIn(o,["UTTextInput","color"])},underline:{"&:hover:not($disabled):not($focused):not($error):before":{borderBottom:getIn(o,["UTTextInput","underline","hover","borderBottom"],"1px solid ".concat(Colors.gray))},"&$disabled:before":{borderBottom:getIn(o,["UTTextInput","underline","disabled","borderBottom"],"1px solid ".concat(Colors.gray))},"&:before":{borderBottom:getIn(o,["UTTextInput","underline","unfocused","borderBottom"],"1px solid ".concat(Colors.gray))},"&$focused:after":{borderBottom:getIn(o,["UTTextInput","underline","focused","borderBottom"],"2px solid ".concat(Colors.primary))},"&:after":{borderBottom:getIn(o,["UTTextInput","underline","base","borderBottom"],"2px solid ".concat(Colors.primary))},"&$error:after":{borderBottom:"2px solid ".concat(o.Palette.error["05"]),borderBottomColor:o.Palette.error["05"]}}},MuiFormLabel:{root:{color:getIn(o,["UTTextInput","formLabel","color"]),"&$error":{color:getIn(o,["UTTextInput","formLabel","errorColor"],Colors.gray)},"&$focused":{color:getIn(o,["UTTextInput","formLabel","focusedColor"],Colors.primary),"&$error":{color:o.Palette.error["05"]}},fontFamily:getIn(o,["Fonts","fontFamily"]),fontSize:getIn(o,["UTTextInput","fontSize"],getIn(o,["Fonts","medium"],14))}},MuiFormHelperText:{root:{fontSize:getIn(o,["UTTextInput","helperText","fontSize"],12),color:getIn(o,["UTTextInput","helperText","color"],o.Palette.error["05"])}}}});

package/dist/esm/components/UTCuit/versions/V1/index.js

@@ -1,155 +1 @@
-import React, { useState, useEffect, useRef, useCallback } from 'react';
-import { shouldShowErrors } from '@widergy/web-utils/lib/form';
-import { string, bool } from 'prop-types';
-import UTLabel from '../../../UTLabel';
-import UTTextInput from '../../../UTTextInput';
-import WithTheme from '../../../WithTheme';
-import { inputPropTypes, metaPropTypes, fieldType } from '../../../../types/formTypes';
-import styles from './styles.module.scss';
-const UTCuit = _ref => {
-  var _field$configuration;
-  let {
-    documentDataTestId,
-    field,
-    input,
-    meta,
-    prefixDataTestId,
-    verificationCodeDataTestId,
-    dni,
-    disableDocument = false
-  } = _ref;
-  const [prefix, setPrefix] = useState('');
-  const [verificationCode, setVerificationCode] = useState('');
-  const [document, setDocument] = useState('');
-  const verificationCodeRef = useRef(null);
-  const documentRef = useRef(null);
-  const getDocumentValue = useCallback(() => {
-    const rawDocumentValue = disableDocument && dni ? dni : document;
-    return rawDocumentValue ? rawDocumentValue.padStart(8, '0') : '';
-  }, [disableDocument, dni, document]);
-  const handleChangeCuit = useCallback(() => {
-    const documentValue = getDocumentValue();
-    const fullCuit = prefix.concat(documentValue, verificationCode);
-    input.onChange(fullCuit);
-  }, [prefix, document, verificationCode, input, disableDocument, dni]);
-  useEffect(() => {
-    if (disableDocument && dni && !document) {
-      setDocument(dni.padStart(8, '0'));
-    }
-  }, [disableDocument, dni, document]);
-  const handleOnChangePrefix = useCallback(event => {
-    const value = event && event.target ? event.target.value : event;
-    const numericValue = value.replace(/[^0-9]/g, '');
-    if (numericValue.length === 0) {
-      setPrefix('');
-    } else if (numericValue[0] === '2') {
-      setPrefix(numericValue);
-    } else {
-      setPrefix('');
-    }
-  }, []);
-  const handleOnChangeDocument = useCallback(event => {
-    const value = event && event.target ? event.target.value : event;
-    const numericValue = value.replace(/[^0-9]/g, '');
-    setDocument(numericValue);
-  }, []);
-  const handleOnChangeVerificationCode = useCallback(event => {
-    const value = event && event.target ? event.target.value : event;
-    const numericValue = value.replace(/[^0-9]/g, '');
-    setVerificationCode(numericValue);
-  }, []);
-  const handleFocus = useCallback(() => {
-    const documentValue = getDocumentValue();
-    if (prefix.length === 2 && documentValue.length === 8) {
-      var _verificationCodeRef$;
-      (_verificationCodeRef$ = verificationCodeRef.current) === null || _verificationCodeRef$ === void 0 || _verificationCodeRef$.focus();
-    } else if (prefix.length === 2 && !disableDocument) {
-      var _documentRef$current;
-      (_documentRef$current = documentRef.current) === null || _documentRef$current === void 0 || _documentRef$current.focus();
-    }
-  }, [prefix, document, disableDocument, dni]);
-  useEffect(() => {
-    handleChangeCuit();
-  }, [handleChangeCuit]);
-  useEffect(() => {
-    handleFocus();
-  }, [handleFocus]);
-  return /*#__PURE__*/React.createElement("div", {
-    className: styles.container
-  }, (field === null || field === void 0 ? void 0 : field.label) && /*#__PURE__*/React.createElement(UTLabel, {
-    className: styles.label,
-    variant: "medium"
-  }, field === null || field === void 0 ? void 0 : field.label), /*#__PURE__*/React.createElement("div", {
-    className: styles.fieldContainer
-  }, /*#__PURE__*/React.createElement("div", {
-    className: styles.fieldCuit
-  }, /*#__PURE__*/React.createElement(UTTextInput, {
-    version: "V1",
-    autoComplete: "off",
-    autofocus: ((_field$configuration = field.configuration) === null || _field$configuration === void 0 ? void 0 : _field$configuration.auto_focus) || false,
-    dataTestId: prefixDataTestId,
-    alwaysShowPlaceholder: true,
-    field: field,
-    input: {
-      name: 'prefix'
-    },
-    maxLength: 2,
-    meta: meta,
-    onChange: handleOnChangePrefix,
-    placeholder: "XX",
-    type: "text",
-    value: prefix || ''
-  })), /*#__PURE__*/React.createElement("div", {
-    className: styles.fieldDocument
-  }, /*#__PURE__*/React.createElement(UTTextInput, {
-    version: "V1",
-    autoComplete: "off",
-    dataTestId: documentDataTestId,
-    alwaysShowPlaceholder: !dni,
-    disabled: disableDocument && dni,
-    field: field,
-    value: dni,
-    input: {
-      value: disableDocument && dni ? dni : document,
-      onChange: disableDocument && dni ? () => {} : handleOnChangeDocument,
-      name: 'document'
-    },
-    maxLength: 8,
-    inputRef: !disableDocument ? documentRef : null,
-    meta: meta,
-    placeholder: "XXXXXXXX",
-    type: "numeric"
-  })), /*#__PURE__*/React.createElement("div", {
-    className: styles.fieldCuit
-  }, /*#__PURE__*/React.createElement(UTTextInput, {
-    version: "V1",
-    autoComplete: "off",
-    dataTestId: verificationCodeDataTestId,
-    alwaysShowPlaceholder: true,
-    field: field,
-    input: {
-      value: verificationCode || '',
-      name: 'verificationCode'
-    },
-    onChange: handleOnChangeVerificationCode,
-    maxLength: 1,
-    inputRef: verificationCodeRef,
-    meta: meta,
-    placeholder: "X",
-    type: "text"
-  }))), /*#__PURE__*/React.createElement(UTLabel, {
-    variant: "small",
-    colorTheme: "error"
-  }, shouldShowErrors(meta) ? meta.error : ''));
-};
-UTCuit.propTypes = {
-  documentDataTestId: string,
-  field: fieldType,
-  input: inputPropTypes,
-  meta: metaPropTypes,
-  prefixDataTestId: string,
-  verificationCodeDataTestId: string,
-  dni: string,
-  disableDocument: bool
-};
-export default WithTheme(null, null)(UTCuit);
+import React,{useState,useEffect,useRef,useCallback}from"react";import{shouldShowErrors}from"@widergy/web-utils/lib/form";import{string,bool}from"prop-types";import UTLabel from"../../../UTLabel";import UTTextInput from"../../../UTTextInput";import WithTheme from"../../../WithTheme";import{inputPropTypes,metaPropTypes,fieldType}from"../../../../types/formTypes";import styles from"./styles.module.scss";const UTCuit=e=>{var t;let{documentDataTestId:a,field:l,input:o,meta:s,prefixDataTestId:r,verificationCodeDataTestId:n,dni:i,disableDocument:u=!1}=e;const[c,m]=useState(""),[d,p]=useState(""),[f,T]=useState(""),h=useRef(null),v=useRef(null),g=useCallback(()=>{const e=u&&i?i:f;return e?e.padStart(8,"0"):""},[u,i,f]),y=useCallback(()=>{const e=g(),t=c.concat(e,d);o.onChange(t)},[c,f,d,o,u,i]);useEffect(()=>{u&&i&&!f&&T(i.padStart(8,"0"))},[u,i,f]);const C=useCallback(e=>{const t=(e&&e.target?e.target.value:e).replace(/[^0-9]/g,"");0===t.length?m(""):"2"===t[0]?m(t):m("")},[]),b=useCallback(e=>{const t=(e&&e.target?e.target.value:e).replace(/[^0-9]/g,"");T(t)},[]),E=useCallback(e=>{const t=(e&&e.target?e.target.value:e).replace(/[^0-9]/g,"");p(t)},[]),R=useCallback(()=>{const e=g();var t;if(2===c.length&&8===e.length)null===(t=h.current)||void 0===t||t.focus();else if(2===c.length&&!u){var a;null===(a=v.current)||void 0===a||a.focus()}},[c,f,u,i]);return useEffect(()=>{y()},[y]),useEffect(()=>{R()},[R]),React.createElement("div",{className:styles.container},(null==l?void 0:l.label)&&React.createElement(UTLabel,{className:styles.label,variant:"medium"},null==l?void 0:l.label),React.createElement("div",{className:styles.fieldContainer},React.createElement("div",{className:styles.fieldCuit},React.createElement(UTTextInput,{version:"V1",autoComplete:"off",autofocus:(null===(t=l.configuration)||void 0===t?void 0:t.auto_focus)||!1,dataTestId:r,alwaysShowPlaceholder:!0,field:l,input:{name:"prefix"},maxLength:2,meta:s,onChange:C,placeholder:"XX",type:"text",value:c||""})),React.createElement("div",{className:styles.fieldDocument},React.createElement(UTTextInput,{version:"V1",autoComplete:"off",dataTestId:a,alwaysShowPlaceholder:!i,disabled:u&&i,field:l,value:i,input:{value:u&&i?i:f,onChange:u&&i?()=>{}:b,name:"document"},maxLength:8,inputRef:u?null:v,meta:s,placeholder:"XXXXXXXX",type:"numeric"})),React.createElement("div",{className:styles.fieldCuit},React.createElement(UTTextInput,{version:"V1",autoComplete:"off",dataTestId:n,alwaysShowPlaceholder:!0,field:l,input:{value:d||"",name:"verificationCode"},onChange:E,maxLength:1,inputRef:h,meta:s,placeholder:"X",type:"text"}))),React.createElement(UTLabel,{variant:"small",colorTheme:"error"},shouldShowErrors(s)?s.error:""))};UTCuit.propTypes={documentDataTestId:string,field:fieldType,input:inputPropTypes,meta:metaPropTypes,prefixDataTestId:string,verificationCodeDataTestId:string,dni:string,disableDocument:bool};export default WithTheme(null,null)(UTCuit);

package/dist/esm/components/UTDataCategory/components/MainAction/index.js

@@ -1,40 +1 @@
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-import React from 'react';
-import { bool, oneOf, func, string, number, oneOfType } from 'prop-types';
-import { TEST_IDS } from '../../../../constants/testIds';
-import UTSwitch from '../../../UTSwitch';
-import UTButton from '../../../UTButton';
-import { ACTION_TYPE } from '../../constants';
-const {
-  dataElement
-} = TEST_IDS;
-const MainAction = _ref => {
-  let {
-    type = ACTION_TYPE.BUTTON,
-    onChange,
-    value,
-    onClick,
-    dataTestId,
-    ...props
-  } = _ref;
-  return type === ACTION_TYPE.SWITCH && onChange ? /*#__PURE__*/React.createElement(UTSwitch, _extends({
-    onChange: onChange,
-    value: value
-  }, props, {
-    dataTestId: dataTestId ? "".concat(dataTestId, ".").concat(dataElement.switchAction) : undefined,
-    version: "V1"
-  })) : type === ACTION_TYPE.BUTTON && onClick ? /*#__PURE__*/React.createElement(UTButton, _extends({
-    dataTestId: dataTestId ? "".concat(dataTestId, ".").concat(dataElement.buttonAction) : undefined,
-    variant: "text",
-    onClick: onClick
-  }, props)) : null;
-};
-MainAction.propTypes = {
-  dataTestId: string,
-  id: oneOfType([string, number]),
-  onChange: func,
-  onClick: func,
-  type: oneOf(Object.values(ACTION_TYPE)),
-  value: bool
-};
-export default MainAction;
+function _extends(){return _extends=Object.assign?Object.assign.bind():function(t){for(var n=1;n<arguments.length;n++){var e=arguments[n];for(var o in e)({}).hasOwnProperty.call(e,o)&&(t[o]=e[o])}return t},_extends.apply(null,arguments)}import React from"react";import{bool,oneOf,func,string,number,oneOfType}from"prop-types";import{TEST_IDS}from"../../../../constants/testIds";import UTSwitch from"../../../UTSwitch";import UTButton from"../../../UTButton";import{ACTION_TYPE}from"../../constants";const{dataElement:dataElement}=TEST_IDS,MainAction=t=>{let{type:n=ACTION_TYPE.BUTTON,onChange:e,value:o,onClick:a,dataTestId:c,...r}=t;return n===ACTION_TYPE.SWITCH&&e?React.createElement(UTSwitch,_extends({onChange:e,value:o},r,{dataTestId:c?"".concat(c,".").concat(dataElement.switchAction):void 0,version:"V1"})):n===ACTION_TYPE.BUTTON&&a?React.createElement(UTButton,_extends({dataTestId:c?"".concat(c,".").concat(dataElement.buttonAction):void 0,variant:"text",onClick:a},r)):null};MainAction.propTypes={dataTestId:string,id:oneOfType([string,number]),onChange:func,onClick:func,type:oneOf(Object.values(ACTION_TYPE)),value:bool};export default MainAction;

package/dist/esm/components/UTDataCategory/constants.js

@@ -1,5 +1 @@
-export const WITHOUT_DATA_TEXT = 'Sin datos';
-export const ACTION_TYPE = {
-  SWITCH: 'switch',
-  BUTTON: 'button'
-};
+export const WITHOUT_DATA_TEXT="Sin datos";export const ACTION_TYPE={SWITCH:"switch",BUTTON:"button"};

package/dist/esm/components/UTDataCategory/index.js

@@ -1,133 +1 @@
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-import { array, bool, object, objectOf, shape, string } from 'prop-types';
-import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
-import isEmpty from 'lodash/isEmpty';
-import WithTheme from '../WithTheme';
-import UTDataElement from '../UTDataElement';
-import UTLabel from '../UTLabel';
-import UTTouchableWithoutFeedback from '../UTTouchableWithoutFeedback';
-import { mergeClasses } from '../../utils/classesUtils';
-import { TEST_IDS } from '../../constants/testIds';
-import UTIcon from '../UTIcon';
-import styles from './styles.module.scss';
-import { retrieveStyle } from './theme';
-import { WITHOUT_DATA_TEXT } from './constants';
-import MainAction from './components/MainAction';
-const {
-  dataCategory
-} = TEST_IDS;
-const UTDataCategory = _ref => {
-  let {
-    action,
-    area,
-    classes: theme,
-    classNames,
-    collapsable = true,
-    dataTestId,
-    description,
-    descriptionProps = {},
-    elements = [],
-    elementsProps = {},
-    expanded = false,
-    Icon,
-    iconProps,
-    title,
-    titleProps
-  } = _ref;
-  const IconComponent = typeof Icon === 'string' ? UTIcon : Icon;
-  const showTitle = !!title;
-  const classes = useMemo(() => mergeClasses(theme, classNames), [classNames, theme]);
-  const [isCollapsed, setIsCollapsed] = useState(showTitle && collapsable && !expanded);
-  const childrenRef = useRef(null);
-  useEffect(() => {
-    setIsCollapsed(showTitle && collapsable && !expanded);
-  }, [expanded, showTitle, collapsable]);
-  const toggleCollapsed = () => setIsCollapsed(!isCollapsed);
-  const handleHeaderKeyDown = useCallback(event => {
-    if (event.target === event.currentTarget && (event.key === 'Enter' || event.key === ' ')) {
-      event.preventDefault();
-      toggleCollapsed();
-    }
-  }, [toggleCollapsed]);
-  const stopActionPropagation = useCallback(event => event.stopPropagation(), []);
-  const containerClasses = "".concat(styles.container, " ").concat(classes.container || '', " ").concat(area ? classes.area : '');
-  const collapseIconClasses = "".concat(styles.collapseButton, " ").concat(isCollapsed ? styles.collapsed : '');
-  const headerContent = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
-    className: styles.title
-  }, IconComponent && /*#__PURE__*/React.createElement(IconComponent, _extends({
-    name: Icon,
-    colorTheme: "gray"
-  }, iconProps)), /*#__PURE__*/React.createElement(UTLabel, _extends({
-    colorTheme: "gray",
-    weight: "medium"
-  }, titleProps), title), collapsable && /*#__PURE__*/React.createElement(UTIcon, {
-    className: collapseIconClasses,
-    colorTheme: "gray",
-    name: "IconChevronUp",
-    dataTestId: dataTestId ? "".concat(dataTestId, ".").concat(dataCategory.collapseButton) : undefined
-  }), action &&
-  /*#__PURE__*/
-  // Sin role="button": este div solo corta la propagación del click/keydown hacia el toggle de colapso, no es un control propio.
-  React.createElement("div", {
-    onClick: stopActionPropagation,
-    onKeyDown: stopActionPropagation
-  }, /*#__PURE__*/React.createElement(MainAction, action))), description && /*#__PURE__*/React.createElement(UTLabel, _extends({
-    colorTheme: "gray"
-  }, descriptionProps), description));
-  return /*#__PURE__*/React.createElement("div", {
-    className: containerClasses,
-    "data-testid": dataTestId ? "".concat(dataTestId, ".").concat(dataCategory.container) : undefined
-  }, title && (collapsable ? /*#__PURE__*/React.createElement(UTTouchableWithoutFeedback, {
-    className: "".concat(styles.header, " ").concat(styles.clickable),
-    onClick: toggleCollapsed,
-    onKeyDown: handleHeaderKeyDown,
-    "aria-expanded": !isCollapsed
-  }, headerContent) : /*#__PURE__*/React.createElement("div", {
-    className: styles.header
-  }, headerContent)), /*#__PURE__*/React.createElement("div", {
-    style: {
-      gridTemplateRows: isCollapsed ? '0fr' : '1fr',
-      marginTop: isCollapsed || !showTitle ? 0 : 16
-    },
-    className: styles.children
-  }, /*#__PURE__*/React.createElement("div", {
-    ref: childrenRef,
-    className: styles.childrenContent
-  }, isEmpty(elements) ? /*#__PURE__*/React.createElement(UTLabel, {
-    align: "center",
-    colorTheme: "gray"
-  }, WITHOUT_DATA_TEXT) : elements.map((element, index) => {
-    const {
-      key,
-      ...dataElementProps
-    } = element;
-    return /*#__PURE__*/React.createElement(UTDataElement, _extends({
-      key: key || index,
-      dataTestId: dataTestId ? "".concat(dataTestId, ".").concat(index) : "".concat(dataCategory.item, ".").concat(index),
-      classNames: classes.element
-    }, elementsProps, dataElementProps));
-  }))));
-};
-UTDataCategory.propTypes = {
-  action: object,
-  area: bool,
-  areaProps: shape({
-    colorTheme: string,
-    shade: string
-  }),
-  classes: objectOf(string),
-  classNames: objectOf(string),
-  collapsable: bool,
-  dataTestId: string,
-  description: string,
-  descriptionProps: object,
-  elements: array,
-  elementsProps: object,
-  expanded: bool,
-  Icon: string,
-  iconProps: object,
-  style: object,
-  title: string,
-  titleProps: object
-};
-export default WithTheme(retrieveStyle)(UTDataCategory);
+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 o in a)({}).hasOwnProperty.call(a,o)&&(e[o]=a[o])}return e},_extends.apply(null,arguments)}import{array,bool,object,objectOf,shape,string}from"prop-types";import React,{useCallback,useEffect,useMemo,useRef,useState}from"react";import isEmpty from"lodash/isEmpty";import WithTheme from"../WithTheme";import UTDataElement from"../UTDataElement";import UTLabel from"../UTLabel";import UTTouchableWithoutFeedback from"../UTTouchableWithoutFeedback";import{mergeClasses}from"../../utils/classesUtils";import{TEST_IDS}from"../../constants/testIds";import UTIcon from"../UTIcon";import styles from"./styles.module.scss";import{retrieveStyle}from"./theme";import{WITHOUT_DATA_TEXT}from"./constants";import MainAction from"./components/MainAction";const{dataCategory:dataCategory}=TEST_IDS,UTDataCategory=e=>{let{action:t,area:a,classes:o,classNames:c,collapsable:s=!0,dataTestId:r,description:n,descriptionProps:l={},elements:i=[],elementsProps:m={},expanded:p=!1,Icon:d,iconProps:T,title:y,titleProps:g}=e;const b="string"==typeof d?UTIcon:d,u=!!y,f=useMemo(()=>mergeClasses(o,c),[c,o]),[h,E]=useState(u&&s&&!p),U=useRef(null);useEffect(()=>{E(u&&s&&!p)},[p,u,s]);const R=()=>E(!h),C=useCallback(e=>{e.target!==e.currentTarget||"Enter"!==e.key&&" "!==e.key||(e.preventDefault(),R())},[R]),I=useCallback(e=>e.stopPropagation(),[]),v="".concat(styles.container," ").concat(f.container||""," ").concat(a?f.area:""),k="".concat(styles.collapseButton," ").concat(h?styles.collapsed:""),D=React.createElement(React.Fragment,null,React.createElement("div",{className:styles.title},b&&React.createElement(b,_extends({name:d,colorTheme:"gray"},T)),React.createElement(UTLabel,_extends({colorTheme:"gray",weight:"medium"},g),y),s&&React.createElement(UTIcon,{className:k,colorTheme:"gray",name:"IconChevronUp",dataTestId:r?"".concat(r,".").concat(dataCategory.collapseButton):void 0}),t&&React.createElement("div",{onClick:I,onKeyDown:I},React.createElement(MainAction,t))),n&&React.createElement(UTLabel,_extends({colorTheme:"gray"},l),n));return React.createElement("div",{className:v,"data-testid":r?"".concat(r,".").concat(dataCategory.container):void 0},y&&(s?React.createElement(UTTouchableWithoutFeedback,{className:"".concat(styles.header," ").concat(styles.clickable),onClick:R,onKeyDown:C,"aria-expanded":!h},D):React.createElement("div",{className:styles.header},D)),React.createElement("div",{style:{gridTemplateRows:h?"0fr":"1fr",marginTop:h||!u?0:16},className:styles.children},React.createElement("div",{ref:U,className:styles.childrenContent},isEmpty(i)?React.createElement(UTLabel,{align:"center",colorTheme:"gray"},WITHOUT_DATA_TEXT):i.map((e,t)=>{const{key:a,...o}=e;return React.createElement(UTDataElement,_extends({key:a||t,dataTestId:r?"".concat(r,".").concat(t):"".concat(dataCategory.item,".").concat(t),classNames:f.element},m,o))}))))};UTDataCategory.propTypes={action:object,area:bool,areaProps:shape({colorTheme:string,shade:string}),classes:objectOf(string),classNames:objectOf(string),collapsable:bool,dataTestId:string,description:string,descriptionProps:object,elements:array,elementsProps:object,expanded:bool,Icon:string,iconProps:object,style:object,title:string,titleProps:object};export default WithTheme(retrieveStyle)(UTDataCategory);

package/dist/esm/components/UTDataCategory/theme.js

@@ -1,27 +1 @@
-import { COLOR_THEMES, COLOR_SHADES } from '../../constants/Palette';
-export const backgroundColor = function (theme, area) {
-  var _theme$Palette;
-  let areaProps = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
-  const colorTheme = areaProps.colorTheme || COLOR_THEMES.light;
-  const actionPaletteColors = ((_theme$Palette = theme.Palette) === null || _theme$Palette === void 0 ? void 0 : _theme$Palette.actions) || theme.Palette;
-  const areaColor = actionPaletteColors[colorTheme];
-  const shade = areaProps.shade || (COLOR_THEMES.light === colorTheme ? COLOR_SHADES.shade03 : COLOR_SHADES.shade01);
-  return {
-    backgroundColor: area ? areaColor[shade] : 'transparent'
-  };
-};
-export const retrieveStyle = _ref => {
-  let {
-    area,
-    theme,
-    areaProps
-  } = _ref;
-  const areaBackgroundColor = backgroundColor(theme, area, areaProps);
-  return {
-    area: {
-      ...areaBackgroundColor,
-      padding: 'var(--UT-dataCategory-padding, 1rem)',
-      borderRadius: 8
-    }
-  };
-};
+import{COLOR_THEMES,COLOR_SHADES}from"../../constants/Palette";export const backgroundColor=function(e,t){var r;let a=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};const o=a.colorTheme||COLOR_THEMES.light,n=((null===(r=e.Palette)||void 0===r?void 0:r.actions)||e.Palette)[o],d=a.shade||(COLOR_THEMES.light===o?COLOR_SHADES.shade03:COLOR_SHADES.shade01);return{backgroundColor:t?n[d]:"transparent"}};export const retrieveStyle=e=>{let{area:t,theme:r,areaProps:a}=e;return{area:{...backgroundColor(r,t,a),padding:"var(--UT-dataCategory-padding, 1rem)",borderRadius:8}}};

package/dist/esm/components/UTDataElement/components/MainAction/index.js

@@ -1,40 +1 @@
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-import React from 'react';
-import { bool, oneOf, func, string, number, oneOfType } from 'prop-types';
-import { TEST_IDS } from '../../../../constants/testIds';
-import UTSwitch from '../../../UTSwitch';
-import UTButton from '../../../UTButton';
-import { ACTION_TYPE } from '../../constants';
-const {
-  dataElement
-} = TEST_IDS;
-const MainAction = _ref => {
-  let {
-    type = ACTION_TYPE.BUTTON,
-    onChange,
-    value,
-    onClick,
-    dataTestId,
-    ...props
-  } = _ref;
-  return type === ACTION_TYPE.SWITCH && onChange ? /*#__PURE__*/React.createElement(UTSwitch, _extends({
-    onChange: onChange,
-    value: value
-  }, props, {
-    dataTestId: dataTestId ? "".concat(dataTestId, ".").concat(dataElement.switchAction) : undefined,
-    version: "V1"
-  })) : type === ACTION_TYPE.BUTTON && onClick ? /*#__PURE__*/React.createElement(UTButton, _extends({
-    dataTestId: dataTestId ? "".concat(dataTestId, ".").concat(dataElement.buttonAction) : undefined,
-    variant: "text",
-    onClick: onClick
-  }, props)) : null;
-};
-MainAction.propTypes = {
-  dataTestId: string,
-  id: oneOfType([string, number]),
-  onChange: func,
-  onClick: func,
-  type: oneOf(Object.values(ACTION_TYPE)),
-  value: bool
-};
-export default MainAction;
+function _extends(){return _extends=Object.assign?Object.assign.bind():function(t){for(var n=1;n<arguments.length;n++){var e=arguments[n];for(var o in e)({}).hasOwnProperty.call(e,o)&&(t[o]=e[o])}return t},_extends.apply(null,arguments)}import React from"react";import{bool,oneOf,func,string,number,oneOfType}from"prop-types";import{TEST_IDS}from"../../../../constants/testIds";import UTSwitch from"../../../UTSwitch";import UTButton from"../../../UTButton";import{ACTION_TYPE}from"../../constants";const{dataElement:dataElement}=TEST_IDS,MainAction=t=>{let{type:n=ACTION_TYPE.BUTTON,onChange:e,value:o,onClick:a,dataTestId:c,...r}=t;return n===ACTION_TYPE.SWITCH&&e?React.createElement(UTSwitch,_extends({onChange:e,value:o},r,{dataTestId:c?"".concat(c,".").concat(dataElement.switchAction):void 0,version:"V1"})):n===ACTION_TYPE.BUTTON&&a?React.createElement(UTButton,_extends({dataTestId:c?"".concat(c,".").concat(dataElement.buttonAction):void 0,variant:"text",onClick:a},r)):null};MainAction.propTypes={dataTestId:string,id:oneOfType([string,number]),onChange:func,onClick:func,type:oneOf(Object.values(ACTION_TYPE)),value:bool};export default MainAction;

package/dist/esm/components/UTDataElement/constants.js

@@ -1,24 +1 @@
-export const ORIENTATION = {
-  HORIZONTAL: 'horizontal',
-  VERTICAL: 'vertical'
-};
-export const PADDING = {
-  SMALL: 'small',
-  MEDIUM: 'medium'
-};
-export const SPACING = {
-  XS: 'xs',
-  SMALL: 'small',
-  MEDIUM: 'medium'
-};
-export const ACTION_TYPE = {
-  SWITCH: 'switch',
-  BUTTON: 'button'
-};
-export const TOOLTIP_PROPS = {
-  appendTo: () => document.body,
-  interactive: false
-};
-export const ANIMATION = {
-  TRANSITION_DURATION: 300
-};
+export const ORIENTATION={HORIZONTAL:"horizontal",VERTICAL:"vertical"};export const PADDING={SMALL:"small",MEDIUM:"medium"};export const SPACING={XS:"xs",SMALL:"small",MEDIUM:"medium"};export const ACTION_TYPE={SWITCH:"switch",BUTTON:"button"};export const TOOLTIP_PROPS={appendTo:()=>document.body,interactive:!1};export const ANIMATION={TRANSITION_DURATION:300};