@widergy/energy-ui 3.173.2 → 3.173.4

package/dist/esm/components/UTSelect/versions/V1/components/ListboxComponent/index.js

@@ -1,98 +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 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 = _ref => {
-  let {
-    CustomRow,
-    dataTestId,
-    filteredOptions,
-    fixedBottomOption,
-    handleSelectionChange,
-    horizontalSpacing = SPACING.SMALL,
-    itemDataTestId,
-    maxHeight = DEFAULT_MAX_HEIGHT,
-    multiple,
-    noMatchesText,
-    value,
-    verticalSpacing = SPACING.SMALL
-  } = _ref;
-  const hasNoOptions = useMemo(() => isEmpty(filteredOptions), [filteredOptions]);
-  const maxHeightValid = useMemo(() => isFinite(maxHeight) ? maxHeight : DEFAULT_MAX_HEIGHT, [maxHeight]);
-  const fixedSectionRef = useRef(null);
-  const [reservedHeight, setReservedHeight] = useState(0);
-  useLayoutEffect(() => {
-    if (fixedSectionRef.current) {
-      setReservedHeight(fixedSectionRef.current.offsetHeight);
-    }
-  }, [fixedBottomOption]);
-  const scrollMaxHeight = maxHeightValid - reservedHeight;
-  const handleFixedOptionChange = newValues => {
-    if (!multiple && newValues.length === 0) {
-      handleSelectionChange([fixedBottomOption.value]);
-    } else {
-      handleSelectionChange(newValues);
-    }
-  };
-  const checkListProps = {
-    CustomRow,
-    horizontalSpacing,
-    isSimple: !multiple,
-    itemDataTestId,
-    onChange: handleSelectionChange,
-    reversed: true,
-    showSelectAll: false,
-    value: multiple ? value : [value],
-    variant: 'button',
-    version: 'V1',
-    verticalSpacing
-  };
-  return /*#__PURE__*/React.createElement("div", {
-    className: styles.listbox
-  }, hasNoOptions ? /*#__PURE__*/React.createElement(UTLabel, {
-    colorTheme: "gray",
-    className: styles.noOptionsLabel
-  }, noMatchesText) : /*#__PURE__*/React.createElement(ScrollBar, {
-    style: {
-      maxHeight: scrollMaxHeight
-    }
-  }, /*#__PURE__*/React.createElement(UTCheckList, _extends({}, checkListProps, {
-    dataTestId: dataTestId,
-    options: filteredOptions
-  }))), fixedBottomOption && /*#__PURE__*/React.createElement("div", {
-    ref: fixedSectionRef
-  }, /*#__PURE__*/React.createElement("div", {
-    className: styles.fixedOptionDivider
-  }), /*#__PURE__*/React.createElement(UTCheckList, _extends({}, checkListProps, {
-    onChange: handleFixedOptionChange,
-    options: [fixedBottomOption]
-  }))));
-};
-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;
+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;

package/dist/esm/components/UTSelect/versions/V1/constants.js

@@ -1,4 +1 @@
-export const VARIANTS = {
-  picker: 'picker',
-  select: 'select'
-};
+export const VARIANTS={picker:"picker",select:"select"};

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

@@ -1,254 +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 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 = _ref => {
-  let {
-    action,
-    actions: titleActions,
-    alwaysShowPlaceholder = true,
-    autocompleteProps = {},
-    className,
-    clearable = true,
-    CustomRow,
-    dataTestId,
-    disabled,
-    disableFilterOptions = false,
-    error,
-    errorDataTestId,
-    fixedBottomOption,
-    freeWidth = false,
-    hideSingleCategoryTitle = false,
-    paperClassName,
-    helpText,
-    icon,
-    inputSize,
-    itemDataTestId,
-    listDataTestId,
-    listProps = {},
-    menuWidth,
-    multiple = false,
-    noMatchesText = 'No hay coincidencias con tu búsqueda',
-    noOptionsText = 'No hay opciones disponibles',
-    onChange = () => {},
-    onChangeSearchTerm = () => {},
-    options = [],
-    placeholder,
-    prefix,
-    readOnly,
-    required,
-    suffix,
-    title,
-    titleVariant = TITLE_VARIANTS.large,
-    value = multiple ? [] : null,
-    variant = VARIANTS.select,
-    withAutoReset = true
-  } = _ref;
-  const optionsSortedByCategory = useMemo(() => {
-    if (!options || options.length === 0) return [];
-    const clonedOptions = clone(options).map(option => ({
-      ...option,
-      name: "".concat(option.name)
-    }));
-    const categoryOrder = new Map();
-    clonedOptions.forEach(option => {
-      if (!categoryOrder.has(option.category)) categoryOrder.set(option.category, categoryOrder.size);
-    });
-    const sorted = clonedOptions.sort((a, b) => categoryOrder.get(a.category) - categoryOrder.get(b.category));
-    if (hideSingleCategoryTitle && categoryOrder.size <= 1) {
-      return sorted.map(_ref2 => {
-        let {
-          category: _category,
-          ...rest
-        } = _ref2;
-        return rest;
-      });
-    }
-    return sorted;
-  }, [options, hideSingleCategoryTitle]);
-  const displayOptions = useMemo(() => fixedBottomOption ? [...optionsSortedByCategory, fixedBottomOption] : optionsSortedByCategory, [optionsSortedByCategory, fixedBottomOption]);
-  const [isPopperOpen, setIsPopperOpen] = useState(false);
-  const [searchTerm, setSearchTerm] = useState(getDisplayValue(value, displayOptions, multiple));
-  const [showClearButton, setShowClearButton] = useState(!!searchTerm);
-  const [sortedOptions, setSortedOptions] = useState(optionsSortedByCategory);
-  const inputRef = useRef(null);
-  useEffect(() => {
-    const fixedIsSelected = fixedBottomOption && (multiple ? Array.isArray(value) && value.includes(fixedBottomOption.value) : value === (fixedBottomOption === null || fixedBottomOption === void 0 ? void 0 : fixedBottomOption.value));
-    if (withAutoReset && !fixedIsSelected && shouldReset(value, optionsSortedByCategory, multiple)) {
-      onChange(null);
-      setSortedOptions(sortOptions(optionsSortedByCategory, null, multiple));
-    }
-  }, [multiple, onChange, optionsSortedByCategory, value, withAutoReset, fixedBottomOption]);
-  useEffect(() => {
-    if (!isPopperOpen) {
-      const displayValue = getDisplayValue(value, displayOptions, multiple);
-      setSearchTerm(displayValue);
-      setShowClearButton(displayValue);
-    }
-  }, [value, displayOptions, multiple, isPopperOpen]);
-  useEffect(() => {
-    if (isPopperOpen) {
-      setSortedOptions(sortOptions(optionsSortedByCategory, value, multiple));
-    }
-  }, [optionsSortedByCategory]);
-  useEffect(() => {
-    setSortedOptions(sortOptions(optionsSortedByCategory, value, multiple));
-  }, []);
-  useEffect(() => {
-    if (isPopperOpen) setSortedOptions(sortOptions(optionsSortedByCategory, value, multiple));
-  }, [isPopperOpen]);
-  const validationData = useMemo(() => error && formatErrorToValidation(error), [error]);
-  const isPicker = variant === VARIANTS.picker;
-  const filteredOptions = useMemo(() => {
-    const base = disableFilterOptions || isPicker ? sortedOptions : sortedOptions.filter(option => "".concat(option.name).toLowerCase().includes(searchTerm.toLowerCase()));
-    if (!fixedBottomOption) return base;
-    return base.filter(opt => opt.value !== fixedBottomOption.value);
-  }, [sortedOptions, searchTerm, disableFilterOptions, isPicker, fixedBottomOption]);
-  const handleSearchChange = useCallback(searchValue => {
-    onChangeSearchTerm === null || onChangeSearchTerm === void 0 || onChangeSearchTerm(searchValue);
-    setSearchTerm(searchValue);
-  }, [onChangeSearchTerm]);
-  const clearSearchInputValue = useCallback(inputValue => {
-    setIsPopperOpen(false);
-    const displayValue = getDisplayValue(inputValue, displayOptions, multiple);
-    handleSearchChange(displayValue);
-    setShowClearButton(displayValue !== '');
-  }, [getDisplayValue, displayOptions, multiple, handleSearchChange]);
-  const handleSelectionChange = newValues => {
-    const selectedValue = multiple ? newValues : newValues.length > 0 ? newValues[0] : '';
-    onChange(selectedValue);
-    if (!multiple) {
-      var _inputRef$current;
-      (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 || _inputRef$current.blur();
-      clearSearchInputValue(selectedValue);
-    }
-  };
-  const handleInputFocus = () => {
-    setShowClearButton(false);
-    handleSearchChange('');
-    setIsPopperOpen(true);
-  };
-  const handleInputBlur = () => {
-    clearSearchInputValue(value);
-  };
-  const handleClearSelection = () => {
-    const clearedValue = multiple ? [] : null;
-    onChange(clearedValue);
-    handleSearchChange('');
-    setShowClearButton(false);
-    setIsPopperOpen(false);
-  };
-  const leftAdornments = useMemo(() => getLeftAdornments({
-    error,
-    multiple,
-    value,
-    prefix,
-    icon
-  }), [multiple, value, prefix, icon]);
-  const rightAdornments = useMemo(() => getRightAdornments({
-    action,
-    clearable,
-    disabled,
-    handleClearSelection,
-    readOnly,
-    showClearButton,
-    suffix,
-    variant
-  }), [suffix, showClearButton, clearable, disabled, action, handleClearSelection, variant]);
-  const listBoxProps = useMemo(() => ({
-    CustomRow,
-    dataTestId: listDataTestId,
-    filteredOptions,
-    fixedBottomOption,
-    handleSelectionChange,
-    itemDataTestId,
-    multiple,
-    noMatchesText,
-    value,
-    ...listProps
-  }), [CustomRow, filteredOptions, fixedBottomOption, handleSelectionChange, multiple, noMatchesText, value, listProps]);
-  const menuWidthRef = useRef(menuWidth);
-  menuWidthRef.current = menuWidth;
-  const CustomPopper = useCallback(props => {
-    const width = menuWidthRef.current;
-    return /*#__PURE__*/React.createElement(Popper, _extends({}, props, width ? {
-      placement: 'bottom-start'
-    } : {}, {
-      style: width ? {
-        ...props.style,
-        width
-      } : props.style
-    }));
-  }, []);
-  const noOptionsTextComponent = /*#__PURE__*/React.createElement(UTLabel, {
-    className: styles.noOptionsLabel,
-    colorTheme: "gray"
-  }, noOptionsText);
-  return /*#__PURE__*/React.createElement("div", {
-    className: "".concat(styles.container, " ").concat(className)
-  }, title && /*#__PURE__*/React.createElement(UTFieldLabel, {
-    actions: titleActions,
-    required: required,
-    size: titleVariant
-  }, title), /*#__PURE__*/React.createElement(Autocomplete, _extends({
-    classes: {
-      ...(freeWidth && !menuWidth ? {
-        popper: styles.popper
-      } : {}),
-      ...(paperClassName ? {
-        paper: paperClassName
-      } : {})
-    },
-    PopperComponent: CustomPopper,
-    disabled: disabled || readOnly,
-    getOptionLabel: option => "".concat(option.name),
-    ListboxComponent: ListboxComponent,
-    ListboxProps: listBoxProps,
-    multiple: multiple,
-    noOptionsText: noOptionsTextComponent,
-    onClose: () => setIsPopperOpen(false),
-    onOpen: () => setIsPopperOpen(true),
-    open: isPopperOpen,
-    options: optionsSortedByCategory,
-    PaperComponent: UTPaper,
-    renderInput: params => /*#__PURE__*/React.createElement(InputComponent, {
-      alwaysShowPlaceholder: alwaysShowPlaceholder,
-      dataTestId: dataTestId,
-      disabled: disabled,
-      error: error,
-      inputRef: inputRef,
-      inputSize: inputSize,
-      leftAdornments: leftAdornments,
-      onBlur: handleInputBlur,
-      onChange: handleSearchChange,
-      onFocus: handleInputFocus,
-      params: params,
-      placeholder: placeholder,
-      readOnly: readOnly,
-      rightAdornments: rightAdornments,
-      value: searchTerm,
-      variant: variant
-    })
-  }, autocompleteProps)), helpText && /*#__PURE__*/React.createElement(UTLabel, {
-    colorTheme: "gray",
-    variant: "small"
-  }, helpText), validationData && /*#__PURE__*/React.createElement(UTValidation, {
-    dataTestId: errorDataTestId,
-    validationData: validationData
-  }));
-};
-UTSelect.propTypes = utselectTypes;
-export default UTSelect;
+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;

package/dist/esm/components/UTSelect/versions/V1/types.js

@@ -1,54 +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
-};
+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};

package/dist/esm/components/UTSelect/versions/V1/utils.js

@@ -1,111 +1 @@
-import clone from 'lodash/clone';
-import isEmpty from 'lodash/isEmpty';
-import { COLOR_THEMES } from '../../../../constants/Palette';
-import { COMPONENT_KEYS } from '../../../UTBaseInputField/constants';
-import { NO_CATEGORY } from '../../../UTCheckList/versions/V1/constants';
-import { VARIANTS } from './constants';
-const shouldResetMultipleSelect = (value, options) => !isEmpty(value) && (isEmpty(options) || value.some(el => !options.some(opt => opt.value === el) && !options.some(opt => opt.subOptions && opt.subOptions.some(sub => sub.value === el))));
-const shouldResetSimpleSelect = (value, options) => value && (isEmpty(options) || !options.some(el => el.value === value) && !options.some(el => el.subOptions && el.subOptions.some(sub => sub.value === value)));
-export const shouldReset = (value, options, isMultiple) => {
-  if (isMultiple) return shouldResetMultipleSelect(value, options);
-  return shouldResetSimpleSelect(value, options);
-};
-export const getDisplayValue = (inputValue, options, multiple) => {
-  if (inputValue === null || inputValue === undefined || inputValue === '') return '';
-  const findLabel = optionValue => {
-    var _options$find;
-    return "".concat((_options$find = options.find(o => o.value === optionValue)) === null || _options$find === void 0 ? void 0 : _options$find.name) || '';
-  };
-  const displayValue = multiple ? inputValue.map(findLabel).join(', ') : findLabel(inputValue);
-  return displayValue;
-};
-export const getLeftAdornments = _ref => {
-  let {
-    error,
-    multiple,
-    prefix,
-    value,
-    icon
-  } = _ref;
-  const adornments = [];
-  if (error) adornments.push({
-    name: COMPONENT_KEYS.ICON,
-    props: {
-      showOnlyOnError: true
-    }
-  });
-  if (multiple && !isEmpty(value)) adornments.push({
-    name: COMPONENT_KEYS.BADGE,
-    props: {
-      text: value.length,
-      colorTheme: error ? COLOR_THEMES.error : COLOR_THEMES.accent
-    }
-  });
-  if (prefix) adornments.push({
-    name: COMPONENT_KEYS.PREFIX,
-    props: {
-      text: prefix
-    }
-  });
-  if (icon) adornments.push({
-    name: COMPONENT_KEYS.ICON,
-    props: {
-      Icon: icon
-    }
-  });
-  return adornments;
-};
-export const getRightAdornments = _ref2 => {
-  let {
-    action,
-    clearable,
-    disabled,
-    handleClearSelection,
-    readOnly,
-    showClearButton,
-    suffix,
-    variant
-  } = _ref2;
-  const adornments = [];
-  if (suffix) adornments.push({
-    name: COMPONENT_KEYS.SUFFIX,
-    props: {
-      text: suffix
-    }
-  });
-  if (showClearButton && clearable && !disabled && !readOnly) adornments.push({
-    key: 'clearAction',
-    name: COMPONENT_KEYS.ACTION,
-    props: {
-      action: {
-        Icon: 'IconX',
-        onClick: handleClearSelection,
-        size: 'small'
-      }
-    }
-  });else adornments.push({
-    name: COMPONENT_KEYS.ICON,
-    props: {
-      Icon: 'IconChevronDown',
-      changeIconOnError: false,
-      changeOnError: true,
-      ...(variant === VARIANTS.picker && !disabled && {
-        colorTheme: COLOR_THEMES.dark
-      })
-    }
-  });
-  if (action) adornments.push({
-    name: COMPONENT_KEYS.ACTION,
-    props: {
-      action
-    }
-  });
-  return adornments;
-};
-export const sortOptions = (options, value, multiple) => {
-  const copiedOptions = clone(options);
-  return copiedOptions.map(option => ({
-    ...option,
-    category: multiple ? value !== null && value !== void 0 && value.includes(option.value) ? NO_CATEGORY : option.category : option.value === value ? NO_CATEGORY : option.category
-  })).sort((a, b) => a.category === NO_CATEGORY ? -1 : b.category === NO_CATEGORY ? 1 : 0);
-};
+import clone from"lodash/clone";import isEmpty from"lodash/isEmpty";import{COLOR_THEMES}from"../../../../constants/Palette";import{COMPONENT_KEYS}from"../../../UTBaseInputField/constants";import{NO_CATEGORY}from"../../../UTCheckList/versions/V1/constants";import{VARIANTS}from"./constants";const shouldResetMultipleSelect=(e,o)=>!isEmpty(e)&&(isEmpty(o)||e.some(e=>!o.some(o=>o.value===e)&&!o.some(o=>o.subOptions&&o.subOptions.some(o=>o.value===e)))),shouldResetSimpleSelect=(e,o)=>e&&(isEmpty(o)||!o.some(o=>o.value===e)&&!o.some(o=>o.subOptions&&o.subOptions.some(o=>o.value===e)));export const shouldReset=(e,o,t)=>t?shouldResetMultipleSelect(e,o):shouldResetSimpleSelect(e,o);export const getDisplayValue=(e,o,t)=>{if(null==e||""===e)return"";const s=e=>{var t;return"".concat(null===(t=o.find(o=>o.value===e))||void 0===t?void 0:t.name)||""};return t?e.map(s).join(", "):s(e)};export const getLeftAdornments=e=>{let{error:o,multiple:t,prefix:s,value:n,icon:r}=e;const l=[];return o&&l.push({name:COMPONENT_KEYS.ICON,props:{showOnlyOnError:!0}}),t&&!isEmpty(n)&&l.push({name:COMPONENT_KEYS.BADGE,props:{text:n.length,colorTheme:o?COLOR_THEMES.error:COLOR_THEMES.accent}}),s&&l.push({name:COMPONENT_KEYS.PREFIX,props:{text:s}}),r&&l.push({name:COMPONENT_KEYS.ICON,props:{Icon:r}}),l};export const getRightAdornments=e=>{let{action:o,clearable:t,disabled:s,handleClearSelection:n,readOnly:r,showClearButton:l,suffix:p,variant:a}=e;const c=[];return p&&c.push({name:COMPONENT_KEYS.SUFFIX,props:{text:p}}),l&&t&&!s&&!r?c.push({key:"clearAction",name:COMPONENT_KEYS.ACTION,props:{action:{Icon:"IconX",onClick:n,size:"small"}}}):c.push({name:COMPONENT_KEYS.ICON,props:{Icon:"IconChevronDown",changeIconOnError:!1,changeOnError:!0,...a===VARIANTS.picker&&!s&&{colorTheme:COLOR_THEMES.dark}}}),o&&c.push({name:COMPONENT_KEYS.ACTION,props:{action:o}}),c};export const sortOptions=(e,o,t)=>clone(e).map(e=>({...e,category:t?null!=o&&o.includes(e.value)?NO_CATEGORY:e.category:e.value===o?NO_CATEGORY:e.category})).sort((e,o)=>e.category===NO_CATEGORY?-1:o.category===NO_CATEGORY?1:0);

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

@@ -1,10 +1 @@
-export const APPEARANCES = {
-  GRAY: 'gray',
-  WHITE: 'white'
-};
-export const SIZES = {
-  XLARGE: 'xlarge',
-  LARGE: 'large',
-  MEDIUM: 'medium',
-  SMALL: 'small'
-};
+export const APPEARANCES={GRAY:"gray",WHITE:"white"};export const SIZES={XLARGE:"xlarge",LARGE:"large",MEDIUM:"medium",SMALL:"small"};