plataforma-fundacao-componentes 2.22.14 → 2.22.17

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.
@@ -1,4 +1,4 @@
1
- /// <reference types="react" />
1
+ import React from 'react';
2
2
  import { CheckboxThemes } from '../../libraries/CheckboxThemes';
3
3
  import { TooltipPosition } from '../../libraries/Tooltips';
4
4
  import './Checkbox.scss';
@@ -7,7 +7,7 @@ export interface CheckboxProps {
7
7
  'tooltip-text'?: string;
8
8
  disabled?: boolean;
9
9
  value?: boolean;
10
- onChange?: (value: boolean) => void;
10
+ onChange?: (value: boolean, evt: React.MouseEvent<HTMLElement>) => void;
11
11
  theme?: CheckboxThemes;
12
12
  tag?: 'button' | 'div';
13
13
  }
@@ -1,4 +1,4 @@
1
- import React from 'react';
1
+ import React, { ReactNode } from 'react';
2
2
  import { DropdownMenuProps } from '../../../dropdownMenu/DropdownMenu';
3
3
  import './TableUpperHeader.scss';
4
4
  interface upperHeaderButtonType {
@@ -18,6 +18,8 @@ export interface TableUpperHeaderProps {
18
18
  active?: boolean;
19
19
  leftContent?: (upperHeaderButtonType | upperHeaderDropdownMenuType)[];
20
20
  rightContent?: (upperHeaderButtonType | upperHeaderDropdownMenuType)[];
21
+ opened?: boolean;
22
+ collapsedContent?: ReactNode;
21
23
  }
22
24
  declare function TableUpperHeader(props: TableUpperHeaderProps): JSX.Element;
23
25
  declare const _default: React.MemoExoticComponent<typeof TableUpperHeader>;
@@ -16,8 +16,6 @@ export declare type ColumnObject = {
16
16
  };
17
17
  interface TableWithOverflowProps {
18
18
  upperHeader?: TableUpperHeaderProps;
19
- showArrowControl?: boolean;
20
- hasActionsCol?: boolean;
21
19
  showTopNavigator?: boolean;
22
20
  columns: ColumnObject[];
23
21
  lines?: any[];
@@ -25,8 +23,6 @@ interface TableWithOverflowProps {
25
23
  declare function TableWithOverflow(props: TableWithOverflowProps): JSX.Element;
26
24
  declare namespace TableWithOverflow {
27
25
  var defaultProps: {
28
- showArrowControl: boolean;
29
- hasActionsCol: boolean;
30
26
  showTopNavigator: boolean;
31
27
  };
32
28
  }
package/dist/index.css CHANGED
@@ -15240,7 +15240,7 @@ h5 {
15240
15240
  .component-upper-header-table {
15241
15241
  width: 100%;
15242
15242
  border-radius: 8px 8px 0 0;
15243
- padding: 0 8px;
15243
+ padding: 0;
15244
15244
  display: flex;
15245
15245
  align-items: center;
15246
15246
  justify-content: space-between;
@@ -15248,7 +15248,6 @@ h5 {
15248
15248
  border-bottom: 1px solid;
15249
15249
  transition: background-color 0.3s ease, color 0.3s ease;
15250
15250
  background-color: #cdd3cd;
15251
- color: #828a82;
15252
15251
  border-color: #828a82; }
15253
15252
  .component-upper-header-table .component-upper-header-table-btn {
15254
15253
  font-size: 16px;
@@ -15280,17 +15279,22 @@ h5 {
15280
15279
  max-height: 20px !important; }
15281
15280
  .component-upper-header-table.active {
15282
15281
  background-color: #d7e6c8;
15283
- color: #3fa110;
15284
15282
  border-color: #3fa110; }
15285
15283
  .component-upper-header-table.active .component-upper-header-table-btn:not(:disabled) {
15286
15284
  background-color: #d7e6c8;
15287
15285
  color: #3fa110; }
15288
15286
  .component-upper-header-table .component-upper-header-table-left {
15287
+ padding-left: 8px;
15289
15288
  display: flex;
15290
15289
  flex-wrap: wrap; }
15291
15290
  .component-upper-header-table .component-upper-header-table-right {
15291
+ padding-right: 8px;
15292
15292
  display: flex;
15293
15293
  flex-wrap: wrap; }
15294
+ .component-upper-header-table .component-upper-header-table-collapsed {
15295
+ border-top: 1px solid #3fa110;
15296
+ background-color: #eff4eb;
15297
+ padding: var(--colPadding); }
15294
15298
 
15295
15299
  @import url("https://fonts.googleapis.com/css2?family=Exo+2:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
15296
15300
  @import url("https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,600;1,700;1,800;1,900&display=swap");
@@ -15448,6 +15452,7 @@ h5 {
15448
15452
  .component-table-with-overflow .component-table-with-overflow-wrapper .component-table-with-overflow-outer-table table thead tr:nth-child(2) {
15449
15453
  height: 12px; }
15450
15454
  .component-table-with-overflow .component-table-with-overflow-wrapper .component-table-with-overflow-outer-table table tbody tr td {
15455
+ min-height: 44px;
15451
15456
  background-color: #fefefe;
15452
15457
  padding: 12px 8px;
15453
15458
  white-space: nowrap; }
package/dist/index.js CHANGED
@@ -1339,7 +1339,7 @@ function Checkbox(props) {
1339
1339
  var fProps = React.useMemo(function () {
1340
1340
  var handleClick = function handleClick(evt) {
1341
1341
  if (typeof props.onChange === 'function' && !props.disabled) {
1342
- props.onChange(!props.value);
1342
+ props.onChange(!props.value, evt);
1343
1343
  evt.stopPropagation();
1344
1344
  }
1345
1345
  };
@@ -9580,7 +9580,7 @@ var LeftCheckboxWithLabel = function LeftCheckboxWithLabel(props) {
9580
9580
  var _props$spanProps3;
9581
9581
 
9582
9582
  if (props.anchorLabelToCheckbox) {
9583
- props.onChange(!props.value);
9583
+ props.onChange(!props.value, evt);
9584
9584
  }
9585
9585
 
9586
9586
  if (props.spanProps && typeof props.spanProps.onClick === 'function') (_props$spanProps3 = props.spanProps) === null || _props$spanProps3 === void 0 ? void 0 : _props$spanProps3.onClick(evt);
@@ -9872,38 +9872,49 @@ function TableUpperHeader(props) {
9872
9872
  }, React__default.createElement("div", {
9873
9873
  className: rootClassName$1A + "-left"
9874
9874
  }, (_props$leftContent = props.leftContent) === null || _props$leftContent === void 0 ? void 0 : _props$leftContent.map(function (btn, i) {
9875
- return btn.type === 'Button' ? React__default.createElement("button", Object.assign({
9876
- key: i
9877
- }, btn, {
9875
+ return btn.type === 'Button' ? React__default.createElement("button", {
9876
+ key: i,
9877
+ id: btn.id,
9878
+ onClick: btn.onClick,
9878
9879
  disabled: !props.active || (btn === null || btn === void 0 ? void 0 : btn.disabled) || false,
9879
- type: 'button',
9880
- className: rootClassName$1A + "-btn"
9881
- }), btn.leftIcon && React__default.createElement("span", null, btn.leftIcon), btn.label, btn.rightIcon && React__default.createElement("span", null, btn.rightIcon)) : React__default.createElement(DropdownMenu, Object.assign({}, btn, {
9882
- key: i
9883
- }), React__default.createElement("button", Object.assign({
9880
+ className: rootClassName$1A + "-btn",
9881
+ type: 'button'
9882
+ }, btn.leftIcon && React__default.createElement("span", null, btn.leftIcon), btn.label, btn.rightIcon && React__default.createElement("span", null, btn.rightIcon)) : React__default.createElement(DropdownMenu, Object.assign({}, btn, {
9884
9883
  key: i
9885
- }, btn.children, {
9884
+ }), React__default.createElement("button", {
9885
+ key: i,
9886
+ id: btn.children.id,
9887
+ onClick: btn.children.onClick,
9886
9888
  className: rootClassName$1A + "-btn",
9887
9889
  disabled: !props.active || (btn === null || btn === void 0 ? void 0 : btn.children.disabled) || false,
9888
9890
  type: 'button'
9889
- }), btn.children.leftIcon && React__default.createElement("span", null, btn.children.leftIcon), btn.children.label, btn.children.rightIcon && React__default.createElement("span", null, btn.children.rightIcon)));
9891
+ }, btn.children.leftIcon && React__default.createElement("span", null, btn.children.leftIcon), btn.children.label, btn.children.rightIcon && React__default.createElement("span", null, btn.children.rightIcon)));
9890
9892
  })), React__default.createElement("div", {
9891
9893
  className: rootClassName$1A + "-right"
9892
9894
  }, (_props$rightContent = props.rightContent) === null || _props$rightContent === void 0 ? void 0 : _props$rightContent.map(function (btn, i) {
9893
- return btn.type === 'Button' ? React__default.createElement("button", Object.assign({
9894
- key: i
9895
- }, btn, {
9895
+ return btn.type === 'Button' ? React__default.createElement("button", {
9896
+ key: i,
9897
+ id: btn.id,
9898
+ onClick: btn.onClick,
9896
9899
  disabled: !props.active || (btn === null || btn === void 0 ? void 0 : btn.disabled) || false,
9897
9900
  className: rootClassName$1A + "-btn",
9898
9901
  type: 'button'
9899
- }), btn.leftIcon && React__default.createElement("span", null, btn.leftIcon), btn.label, btn.rightIcon && React__default.createElement("span", null, btn.rightIcon)) : React__default.createElement(DropdownMenu, Object.assign({}, btn), React__default.createElement("button", Object.assign({
9900
- key: i
9901
- }, btn.children, {
9902
+ }, btn.leftIcon && React__default.createElement("span", null, btn.leftIcon), btn.label, btn.rightIcon && React__default.createElement("span", null, btn.rightIcon)) : React__default.createElement(DropdownMenu, Object.assign({}, btn, {
9903
+ key: "children_" + i
9904
+ }), React__default.createElement("button", {
9905
+ key: i,
9906
+ id: btn.children.id,
9907
+ onClick: btn.children.onClick,
9902
9908
  disabled: !props.active || (btn === null || btn === void 0 ? void 0 : btn.children.disabled) || false,
9903
9909
  className: rootClassName$1A + "-btn",
9904
9910
  type: 'button'
9905
- }), btn.children.leftIcon && React__default.createElement("span", null, btn.children.leftIcon), btn.children.label, btn.children.rightIcon && React__default.createElement("span", null, btn.children.rightIcon)));
9906
- })));
9911
+ }, btn.children.leftIcon && React__default.createElement("span", null, btn.children.leftIcon), btn.children.label, btn.children.rightIcon && React__default.createElement("span", null, btn.children.rightIcon)));
9912
+ })), props.collapsedContent ? React__default.createElement(Collapse$1, {
9913
+ opened: props.opened,
9914
+ animateOpacity: true
9915
+ }, React__default.createElement(Row$1, {
9916
+ className: rootClassName$1A + "-collapsed"
9917
+ }, props.collapsedContent)) : undefined);
9907
9918
  }
9908
9919
 
9909
9920
  var TableUpperHeader$1 = React.memo(TableUpperHeader);
@@ -9915,8 +9926,8 @@ function TableWithOverflow(props) {
9915
9926
 
9916
9927
  var mediaQuery = useScreenSize();
9917
9928
  var wrapperClassName = React.useMemo(function () {
9918
- return getMergedClassNames([rootClassName$1B + "-wrapper", props.hasActionsCol ? 'has-actions-col' : '', props.upperHeader ? 'has-upper-header' : '', 'left-columns-padding']);
9919
- }, [props.hasActionsCol, props.upperHeader]);
9929
+ return getMergedClassNames([rootClassName$1B + "-wrapper", props.upperHeader ? 'has-upper-header' : '', 'left-columns-padding']);
9930
+ }, [props.upperHeader]);
9920
9931
  var outerTableRef = React.createRef();
9921
9932
  useDraggableScroll(outerTableRef, {
9922
9933
  mouseDownCondition: function mouseDownCondition(el) {
@@ -9941,22 +9952,27 @@ function TableWithOverflow(props) {
9941
9952
  }
9942
9953
  };
9943
9954
 
9955
+ var atLeastOneStaticColumn = React.useMemo(function () {
9956
+ return props.columns.some(function (c) {
9957
+ return !c.absolute;
9958
+ });
9959
+ }, [props.columns]);
9944
9960
  var paddingLeft = React.useMemo(function () {
9945
- return props.columns.reduce(function (prev, atual) {
9961
+ return atLeastOneStaticColumn ? props.columns.reduce(function (prev, atual) {
9946
9962
  var _atual$absolute;
9947
9963
 
9948
9964
  var n = (_atual$absolute = atual.absolute) !== null && _atual$absolute !== void 0 && _atual$absolute.left ? parseInt(atual.absolute.width) : 0;
9949
9965
  return prev + n;
9950
- }, 8) + "px";
9951
- }, [props.columns]);
9966
+ }, 8) + "px" : '8px';
9967
+ }, [props.columns, atLeastOneStaticColumn]);
9952
9968
  var paddingRight = React.useMemo(function () {
9953
- return props.columns.reduce(function (prev, atual) {
9969
+ return atLeastOneStaticColumn ? props.columns.reduce(function (prev, atual) {
9954
9970
  var _atual$absolute2;
9955
9971
 
9956
9972
  var n = (_atual$absolute2 = atual.absolute) !== null && _atual$absolute2 !== void 0 && _atual$absolute2.right ? parseInt(atual.absolute.width) : 0;
9957
9973
  return prev + n;
9958
- }, 8) + "px";
9959
- }, [props.columns]);
9974
+ }, 8) + "px" : '8px';
9975
+ }, [props.columns, atLeastOneStaticColumn]);
9960
9976
  return React__default.createElement("div", {
9961
9977
  className: rootClassName$1B
9962
9978
  }, props.upperHeader ? React__default.createElement("div", {
@@ -9987,12 +10003,13 @@ function TableWithOverflow(props) {
9987
10003
  }), (_props$columns = props.columns) === null || _props$columns === void 0 ? void 0 : _props$columns.map(function (column) {
9988
10004
  var _column$props;
9989
10005
 
10006
+ var absoluteObj = atLeastOneStaticColumn && column.absolute ? column.absolute : {};
9990
10007
  return React__default.createElement("th", Object.assign({
9991
10008
  key: "header-" + column.key,
9992
- "data-draggable": !Boolean(column.absolute)
10009
+ "data-draggable": atLeastOneStaticColumn && !Boolean(absoluteObj)
9993
10010
  }, column.props, {
9994
- style: _extends({}, (_column$props = column.props) === null || _column$props === void 0 ? void 0 : _column$props.style, column.absolute),
9995
- className: getMergedClassNames([column.key + "-cell", column.absolute ? 'absolute' : ''])
10011
+ style: _extends({}, (_column$props = column.props) === null || _column$props === void 0 ? void 0 : _column$props.style, absoluteObj),
10012
+ className: getMergedClassNames([column.key + "-cell", atLeastOneStaticColumn && column.absolute ? 'absolute' : ''])
9996
10013
  }), column.value);
9997
10014
  }), React__default.createElement("th", {
9998
10015
  className: 'absolute right-0'
@@ -10008,12 +10025,13 @@ function TableWithOverflow(props) {
10008
10025
  }), (_props$columns2 = props.columns) === null || _props$columns2 === void 0 ? void 0 : _props$columns2.map(function (column) {
10009
10026
  var _column$props2, _column$props3;
10010
10027
 
10028
+ var absoluteObj = atLeastOneStaticColumn && column.absolute ? column.absolute : {};
10011
10029
  return React__default.createElement("td", Object.assign({
10012
- "data-draggable": !Boolean(column.absolute),
10030
+ "data-draggable": atLeastOneStaticColumn && !Boolean(column.absolute),
10013
10031
  key: lineIndex + "-" + column.key
10014
10032
  }, column.props, {
10015
- style: _extends({}, (_column$props2 = column.props) === null || _column$props2 === void 0 ? void 0 : _column$props2.style, column.absolute),
10016
- className: getMergedClassNames([(_column$props3 = column.props) === null || _column$props3 === void 0 ? void 0 : _column$props3.className, column.key + "-cell", column.absolute ? 'absolute' : ''])
10033
+ style: _extends({}, (_column$props2 = column.props) === null || _column$props2 === void 0 ? void 0 : _column$props2.style, absoluteObj),
10034
+ className: getMergedClassNames([(_column$props3 = column.props) === null || _column$props3 === void 0 ? void 0 : _column$props3.className, column.key + "-cell", atLeastOneStaticColumn && column.absolute ? 'absolute' : ''])
10017
10035
  }), line[column.key]);
10018
10036
  }), React__default.createElement("td", {
10019
10037
  className: 'absolute right-0'
@@ -10022,8 +10040,6 @@ function TableWithOverflow(props) {
10022
10040
  }
10023
10041
 
10024
10042
  TableWithOverflow.defaultProps = {
10025
- showArrowControl: true,
10026
- hasActionsCol: true,
10027
10043
  showTopNavigator: true
10028
10044
  };
10029
10045
  var TableWithOverflow$1 = React.memo(TableWithOverflow);