plataforma-fundacao-componentes 2.22.4 → 2.22.7

package/dist/components/col/Col.d.ts

@@ -9,6 +9,8 @@ interface ColProps extends React.HTMLAttributes<HTMLDivElement> {
     end?: boolean;
     noPadding?: boolean;
     children?: React.ReactNode;
+    noPaddingTop?: boolean;
+    buttonActionsCol?: boolean;
 }
 declare function Col(props: ColProps): JSX.Element;
 declare namespace Col {

package/dist/components/datePicker/DatePicker.d.ts

@@ -4,6 +4,7 @@ interface DatePickerProps {
     initialValue?: string;
     onChange?: (evt: any) => void;
     queryToAppend: string;
+    disabled?: boolean;
     language?: {
         daysOfWeek: string[];
         months: string[];

package/dist/components/modal/Modal.d.ts

@@ -12,6 +12,7 @@ export interface ModalProps {
     onClose?: (modalKey?: string | number) => void;
     size?: ModalSizes;
     mobileOnXS?: boolean;
+    compenseColPaddingContent?: boolean;
     footer?: ButtonProps[] | any;
     children?: any;
 }

package/dist/components/modal/Modal.stories.d.ts

@@ -4,6 +4,7 @@ declare namespace _default {
 }
 export default _default;
 export function Small(): JSX.Element;
+export function SmallCompensePadding(): JSX.Element;
 export function Large(): JSX.Element;
 export function ExtraLarge(): JSX.Element;
 export function Alert(): JSX.Element;

package/dist/components/modal/ModalTypes.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { ModalProps } from './Modal';
-interface AlertModalProps extends ModalProps {
+export interface AlertModalProps extends ModalProps {
     language?: {
         confirm: string;
     };
@@ -13,7 +13,7 @@ export declare namespace AlertModal {
         showIcons: boolean;
     };
 }
-interface ConfirmModalProps extends ModalProps {
+export interface ConfirmModalProps extends ModalProps {
     language?: {
         confirm: string;
         cancel: string;
@@ -28,7 +28,7 @@ export declare namespace ConfirmModal {
         showIcons: boolean;
     };
 }
-interface DestructiveModalProps extends ModalProps {
+export interface DestructiveModalProps extends ModalProps {
     language?: {
         confirm: string;
         cancel: string;
@@ -43,4 +43,3 @@ export declare namespace DestructiveModal {
         showIcons: boolean;
     };
 }
-export {};

package/dist/index.css

@@ -3147,6 +3147,7 @@ h5 {
     width: 100%;
     position: relative;
     display: flex;
+    flex-wrap: nowrap;
     align-items: center;
     border-width: 0 0 2px 0;
     border-style: solid;
@@ -3165,14 +3166,13 @@ h5 {
       .component-input .component-input-input-container .component-input-input:focus {
         outline: none; }
     .component-input .component-input-input-container::before {
-      content: "";
+      content: '';
       transition: visibility 0.3s ease, opacity 0.3s ease;
       opacity: 0;
       visibility: hidden; }
     .component-input .component-input-input-container .component-input-right-object {
-      position: absolute;
-      right: 5px;
-      padding-bottom: 1px; }
+      position: static;
+      padding: 0 5px 1px 5px; }
       .component-input .component-input-input-container .component-input-right-object svg {
         width: 23px;
         height: 23px; }
@@ -3211,7 +3211,7 @@ h5 {
   color: #e60000 !important; }
 
 .component-input.component-input-loading .component-input-input-container::after {
-  content: "";
+  content: '';
   height: 2px;
   width: 0;
   left: 0;
@@ -3283,7 +3283,7 @@ h5 {
 .component-input:not(.component-input-error):not(.force-focus):not(.component-input-disabled):not(.component-input-loading) .component-input-input-container:focus-within::before {
   opacity: 1;
   visibility: visible;
-  content: "";
+  content: '';
   height: 2px;
   display: block;
   position: absolute;
@@ -3294,7 +3294,7 @@ h5 {
 
 .component-input:not(.component-input-error):not(.force-focus):not(.component-input-disabled):not(.component-input-loading) .component-input-input-container:not(:focus-within):not(.force-focus)::before {
   opacity: 0;
-  content: "";
+  content: '';
   height: 2px;
   display: block;
   position: absolute;
@@ -3306,7 +3306,7 @@ h5 {
 .component-input:not(.component-input-error).force-focus .component-input-input-container::before {
   opacity: 1;
   visibility: visible;
-  content: "";
+  content: '';
   height: 2px;
   display: block;
   position: absolute;
@@ -6438,12 +6438,22 @@ h5 {
   width: 100%; }
   .component-col:not(.no-padding) {
     padding: var(--colPadding); }
+  .component-col.no-padding-top {
+    padding-top: 0 !important; }
   .component-col.centralized {
     justify-content: center;
     align-items: center; }
   .component-col.end {
     justify-content: flex-end;
     align-items: center; }
+  .component-col.button-actions-col {
+    padding: 0;
+    flex-wrap: wrap; }
+    .component-col.button-actions-col button {
+      margin: var(--colPadding); }
+      @media screen and (max-width: 575.98px) {
+        .component-col.button-actions-col button {
+          width: 100% !important; } }
   .component-col.component-col-xl-1 {
     flex: 0 0 calc(100% * 1 / 12);
     max-width: calc(100% * 1 / 12); }
@@ -10913,6 +10923,7 @@ h5 {
     width: 100%;
     position: relative;
     display: flex;
+    flex-wrap: nowrap;
     align-items: center;
     border-width: 0 0 2px 0;
     border-style: solid;
@@ -10932,13 +10943,16 @@ h5 {
       .component-input-area .component-input-area-input-container .component-input-area-input-area:focus {
         outline: none; }
     .component-input-area .component-input-area-input-container::before {
-      content: "";
+      content: '';
       transition: visibility 0.3s ease, opacity 0.3s ease;
       opacity: 0;
       visibility: hidden; }
     .component-input-area .component-input-area-input-container .component-input-area-right-object {
-      position: absolute;
-      right: 5px; }
+      position: static;
+      padding: 0 5px 1px; }
+      .component-input-area .component-input-area-input-container .component-input-area-right-object svg {
+        width: 23px;
+        height: 23px; }
   .component-input-area .component-input-area-helper-and-counter {
     position: relative;
     display: flex;
@@ -10974,7 +10988,7 @@ h5 {
   color: #e60000 !important; }
 
 .component-input-area.component-input-area-loading .component-input-area-input-container::after {
-  content: "";
+  content: '';
   height: 2px;
   width: 0;
   left: 0;
@@ -11046,7 +11060,7 @@ h5 {
 .component-input-area:not(.component-input-area-error):not(.force-focus):not(.component-input-area-disabled):not(.component-input-area-loading) .component-input-area-input-container:focus-within::before {
   opacity: 1;
   visibility: visible;
-  content: "";
+  content: '';
   height: 2px;
   display: block;
   position: absolute;
@@ -11057,7 +11071,7 @@ h5 {
 
 .component-input-area:not(.component-input-area-error):not(.force-focus):not(.component-input-area-disabled):not(.component-input-area-loading) .component-input-area-input-container:not(:focus-within):not(.force-focus)::before {
   opacity: 0;
-  content: "";
+  content: '';
   height: 2px;
   display: block;
   position: absolute;
@@ -11069,7 +11083,7 @@ h5 {
 .component-input-area:not(.component-input-area-error).force-focus .component-input-area-input-container::before {
   opacity: 1;
   visibility: visible;
-  content: "";
+  content: '';
   height: 2px;
   display: block;
   position: absolute;
@@ -12286,6 +12300,8 @@ h5 {
     flex-flow: column;
     overflow-y: overlay;
     padding: 24px; }
+    .component-modal .component-modal-content.compense {
+      padding: calc(24px - var(--colPadding)); }
   .component-modal .component-modal-footer {
     display: flex;
     justify-content: flex-end;
@@ -14379,7 +14395,11 @@ h5 {
   display: flex;
   align-items: center;
   width: 100%; }
-  .component-table-left-checkbox-with-label span {
+  .component-table-left-checkbox-with-label .component-table-left-checkbox-with-label-checkbox-wrapper {
+    display: flex;
+    align-items: center;
+    justify-content: center; }
+  .component-table-left-checkbox-with-label .component-table-left-checkbox-with-label-label-wrapper {
     display: flex;
     align-items: center;
     margin-left: 8px;
@@ -14515,7 +14535,7 @@ table.component-table {
   padding: 8px;
   border-collapse: collapse; }
   table.component-table * {
-    font-family: "Nunito", sans-serif; }
+    font-family: "Nunito", sans-serif !important; }
   table.component-table thead tr th {
     background-color: #fefefe;
     font-weight: 800;
@@ -15061,7 +15081,7 @@ h5 {
   position: relative;
   width: 100%; }
   .component-table-with-overflow * {
-    font-family: "Nunito", sans-serif; }
+    font-family: "Nunito", sans-serif !important; }
   .component-table-with-overflow .component-table-with-overflow-outer-table {
     width: 100%;
     overflow-x: auto; }

package/dist/index.js

@@ -39,7 +39,7 @@ var ChevronArrowDownIcon = function ChevronArrowDownIcon() {
 
 var getMergedClassNames = function getMergedClassNames(arr) {
   return arr.filter(function (el) {
-    return el !== '';
+    return Boolean(el);
   }).join(' ');
 };
 var getUniqueKey = function getUniqueKey() {
@@ -3948,7 +3948,7 @@ function Col(props) {
     });
 
     var rp = _extends({}, props, {
-      className: getMergedClassNames([props.className, rootClassName$L].concat(getSizes, [props.centralized ? 'centralized' : '', props.end ? 'end' : '', props.noPadding ? 'no-padding' : '']))
+      className: getMergedClassNames([props.className, rootClassName$L].concat(getSizes, [props.centralized ? 'centralized' : '', props.end ? 'end' : '', props.noPadding ? 'no-padding' : '', props.noPaddingTop ? 'no-padding-top' : '', props.buttonActionsCol ? 'button-actions-col' : '']))
     });
 
     delete rp.noPadding;
@@ -3956,6 +3956,8 @@ function Col(props) {
     delete rp.end;
     delete rp.cols;
     delete rp.children;
+    delete rp.buttonActionsCol;
+    delete rp.noPaddingTop;
     return rp;
   }, [props]);
   return React__default.createElement("div", Object.assign({}, p), props.children);
@@ -4294,6 +4296,7 @@ function DatePicker(props) {
   return React__default.createElement("div", {
     className: rootClassName$P
   }, props.initialValue ? React__default.createElement(IconButton$1, {
+    disabled: props.disabled,
     className: rootClassName$P + "-clear-button",
     icon: React__default.createElement(CloseIcon, null),
     onClick: function onClick() {
@@ -8416,7 +8419,7 @@ function Modal(props) {
   var filteredProps = React.useMemo(function () {
     var p = _extends({}, props, {
       id: props.id ? props.id : props.modalKey ? props.modalKey : "modal" + getUniqueKey(),
-      className: getMergedClassNames([rootClassName$1k, props.className || '', props.mobileOnXS ? 'mobile-on-xs' : '', rootClassName$1k + "-" + String(props.size).toLowerCase()])
+      className: getMergedClassNames([props.className || '', rootClassName$1k, props.mobileOnXS ? 'mobile-on-xs' : '', rootClassName$1k + "-" + String(props.size).toLowerCase()])
     });
 
     delete p.footer;
@@ -8428,6 +8431,7 @@ function Modal(props) {
     delete p.mobileOnXS;
     delete p.preventEscExit;
     delete p.preventMaskExit;
+    delete p.compenseColPaddingContent;
     delete p.modalKey;
     return p;
   }, [props]);
@@ -8459,7 +8463,7 @@ function Modal(props) {
     onClick: handleClose,
     icon: React__default.createElement(CloseIcon, null)
   }))), React__default.createElement("div", {
-    className: rootClassName$1k + "-content"
+    className: getMergedClassNames([rootClassName$1k + "-content", props.compenseColPaddingContent ? 'compense' : ''])
   }, props.children), props.footer ? React__default.createElement("div", {
     className: rootClassName$1k + "-footer"
   }, footer) : undefined);
@@ -9526,6 +9530,8 @@ ActionsColumn.defaultProps = {
 
 var rootClassName$1w = 'component-table-left-checkbox-with-label';
 var LeftCheckboxWithLabel = function LeftCheckboxWithLabel(props) {
+  var _props$spanProps2;
+
   var style = React.useMemo(function () {
     var _props$spanProps;
 
@@ -9545,25 +9551,28 @@ var LeftCheckboxWithLabel = function LeftCheckboxWithLabel(props) {
   }, [props.anchorLabelToCheckbox, props.disabled, props.justifyContent, props.removeUserSelect, props.spanProps]);
   return React__default.createElement("div", {
     className: rootClassName$1w
-  }, React__default.createElement(Checkbox, {
+  }, React__default.createElement("span", {
+    className: rootClassName$1w + "-checkbox-wrapper",
     "tooltip-position": props['tooltip-position'],
-    "tooltip-text": props['tooltip-text'],
+    "tooltip-text": props['tooltip-text']
+  }, React__default.createElement(Checkbox, {
     value: props.value,
     disabled: props.disabled,
     onChange: props.onChange,
     theme: props.theme
-  }), typeof props.label === 'string' ? React__default.createElement("span", Object.assign({}, props.spanProps, {
+  })), React__default.createElement("span", Object.assign({}, props.spanProps, {
+    className: getMergedClassNames([rootClassName$1w + "-label-wrapper", ((_props$spanProps2 = props.spanProps) === null || _props$spanProps2 === void 0 ? void 0 : _props$spanProps2.className) || '']),
     style: style,
     onClick: function onClick(evt) {
-      var _props$spanProps2;
+      var _props$spanProps3;
 
       if (props.anchorLabelToCheckbox) {
         props.onChange(!props.value);
       }
 
-      (_props$spanProps2 = props.spanProps) === null || _props$spanProps2 === void 0 ? void 0 : _props$spanProps2.onClick(evt);
+      (_props$spanProps3 = props.spanProps) === null || _props$spanProps3 === void 0 ? void 0 : _props$spanProps3.onClick(evt);
     }
-  }), props.label) : props.label);
+  }), props.label));
 };
 
 var rootClassName$1x = 'component-table';
@@ -9817,7 +9826,7 @@ function TableWithOverflow(props) {
     body();
     midWith();
   }, [props.lines, props.columns]);
-  React.useLayoutEffect(function () {
+  React.useEffect(function () {
     var func = function func() {
       attWidth();
       header();
@@ -9830,7 +9839,7 @@ function TableWithOverflow(props) {
       window.removeEventListener('resize', func);
     };
   }, []);
-  React.useLayoutEffect(function () {
+  React.useEffect(function () {
     var element = document.querySelector("#" + id + " ." + rootClassName$1A + "-table ." + rootClassName$1A + "-mid");
     var pos = {
       left: 0,
@@ -9890,7 +9899,9 @@ function TableWithOverflow(props) {
       var column = Array.from(props.columns).find(function (c) {
         return c.key === cell[0];
       });
-      return (column === null || column === void 0 ? void 0 : column.key) === 'actions' ? React__default.createElement("td", null) : React__default.createElement("td", Object.assign({
+      return (column === null || column === void 0 ? void 0 : column.key) === 'actions' ? React__default.createElement("td", {
+        key: fakeId + "-actions"
+      }) : React__default.createElement("td", Object.assign({
         key: cell[1].key ? cell[1].key : valueIndex
       }, column === null || column === void 0 ? void 0 : column.props, cell[1].props), cell[1]);
     }), React__default.createElement("td", null));