sag_components 2.0.0-beta143 → 2.0.0-beta144

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.
package/dist/index.js CHANGED
@@ -10327,24 +10327,23 @@ const QuarterPopupPicker = ({
10327
10327
  };
10328
10328
 
10329
10329
  /* eslint-disable import/no-extraneous-dependencies */
10330
- const QuarterPicker = _ref => {
10331
- let {
10332
- availableQuarters,
10333
- // ["Q1-2024"]
10334
- label,
10335
- onChange,
10336
- borderRadius,
10337
- required,
10338
- width,
10339
- height,
10340
- placeholder,
10341
- disabled,
10342
- borderColor,
10343
- borderColorFocus,
10344
- textColor,
10345
- selectedValue,
10346
- startYear
10347
- } = _ref;
10330
+ const QuarterPicker = ({
10331
+ availableQuarters,
10332
+ // ["Q1-2024"]
10333
+ label,
10334
+ onChange,
10335
+ borderRadius,
10336
+ required,
10337
+ width,
10338
+ height,
10339
+ placeholder,
10340
+ disabled,
10341
+ borderColor,
10342
+ borderColorFocus,
10343
+ textColor,
10344
+ selectedValue,
10345
+ startYear
10346
+ }) => {
10348
10347
  const [isFocused, setIsFocused] = React$1.useState(false);
10349
10348
  const [isOpen, setIsOpen] = React$1.useState(false);
10350
10349
  const [value, setValue] = React$1.useState('');
@@ -10786,23 +10785,22 @@ const MonthPopupPicker = ({
10786
10785
  };
10787
10786
 
10788
10787
  /* eslint-disable import/no-extraneous-dependencies */
10789
- const MonthPicker = _ref => {
10790
- let {
10791
- availableMonths,
10792
- label,
10793
- onChange,
10794
- borderRadius,
10795
- required,
10796
- width,
10797
- height,
10798
- placeholder,
10799
- disabled,
10800
- borderColor,
10801
- borderColorFocus,
10802
- textColor,
10803
- selectedValue,
10804
- startYear
10805
- } = _ref;
10788
+ const MonthPicker = ({
10789
+ availableMonths,
10790
+ label,
10791
+ onChange,
10792
+ borderRadius,
10793
+ required,
10794
+ width,
10795
+ height,
10796
+ placeholder,
10797
+ disabled,
10798
+ borderColor,
10799
+ borderColorFocus,
10800
+ textColor,
10801
+ selectedValue,
10802
+ startYear
10803
+ }) => {
10806
10804
  const [isFocused, setIsFocused] = React$1.useState(false);
10807
10805
  const [isOpen, setIsOpen] = React$1.useState(false);
10808
10806
  const [value, setValue] = React$1.useState('');
@@ -23913,22 +23911,21 @@ const DeleteIcon = styled__default["default"].div`
23913
23911
  position: absolute;
23914
23912
  `;
23915
23913
 
23916
- const QuickFilterDropdownSingle = _ref => {
23917
- let {
23918
- label,
23919
- hoverColor,
23920
- options,
23921
- selectedValue,
23922
- placeHolder,
23923
- onChange,
23924
- disabled,
23925
- width,
23926
- error,
23927
- errorMessage,
23928
- xIconShow,
23929
- labelColor,
23930
- showLabelOnTop
23931
- } = _ref;
23914
+ const QuickFilterDropdownSingle = ({
23915
+ label,
23916
+ hoverColor,
23917
+ options,
23918
+ selectedValue,
23919
+ placeHolder,
23920
+ onChange,
23921
+ disabled,
23922
+ width,
23923
+ error,
23924
+ errorMessage,
23925
+ xIconShow,
23926
+ labelColor,
23927
+ showLabelOnTop
23928
+ }) => {
23932
23929
  const [isFocused, setIsFocused] = React$1.useState(false);
23933
23930
  const [showOptions, setShowOptions] = React$1.useState(false);
23934
23931
  const [inputValue, setInputValue] = React$1.useState("");
@@ -24325,24 +24322,23 @@ const IconContainer$2 = styled__default["default"].div`
24325
24322
  cursor: pointer;
24326
24323
  `;
24327
24324
 
24328
- const QuickFilterDropdownMultiSelection = _ref => {
24329
- let {
24330
- label,
24331
- labelEmptyValue,
24332
- options,
24333
- selectedValue,
24334
- placeHolder,
24335
- onChange,
24336
- required,
24337
- disabled,
24338
- width,
24339
- error,
24340
- errorMessage,
24341
- labelColor,
24342
- xIconShow,
24343
- checkBoxColor,
24344
- showLabelOnTop
24345
- } = _ref;
24325
+ const QuickFilterDropdownMultiSelection = ({
24326
+ label,
24327
+ labelEmptyValue,
24328
+ options,
24329
+ selectedValue,
24330
+ placeHolder,
24331
+ onChange,
24332
+ required,
24333
+ disabled,
24334
+ width,
24335
+ error,
24336
+ errorMessage,
24337
+ labelColor,
24338
+ xIconShow,
24339
+ checkBoxColor,
24340
+ showLabelOnTop
24341
+ }) => {
24346
24342
  const [isFocused, setIsFocused] = React$1.useState(false);
24347
24343
  const [showOptions, setShowOptions] = React$1.useState(false);
24348
24344
  const [inputValue, setInputValue] = React$1.useState('');
@@ -35574,9 +35570,9 @@ const ToggleSlider = styled__default["default"].span`
35574
35570
  }
35575
35571
  `;
35576
35572
 
35577
- /**
35578
- * ToggleSwitch component for on/off states.
35579
- * Supports small/large sizes and disabled state.
35573
+ /**
35574
+ * ToggleSwitch component for on/off states.
35575
+ * Supports small/large sizes and disabled state.
35580
35576
  */
35581
35577
  function ToggleSwitch(_ref) {
35582
35578
  let {
@@ -38317,21 +38313,6 @@ const DisabledTrashIconWrapper = styled__default["default"].div`
38317
38313
  color: #d9d9d9;
38318
38314
  }
38319
38315
  `;
38320
- const StatusCell = styled__default["default"].div`
38321
- font-size: 12px;
38322
- font-weight: 500;
38323
- display: flex;
38324
- align-items: center;
38325
- gap: 6px;
38326
- color: ${props => props.color || "#000"};
38327
- `;
38328
- const StatusCellCircle = styled__default["default"].div`
38329
- width: 8px;
38330
- height: 8px;
38331
- border-radius: 50%;
38332
- border: 1px solid white;
38333
- background-color: ${props => props.backgroundColor};
38334
- `;
38335
38316
 
38336
38317
  // CommentModal.styles.js
38337
38318
  const ModalOverlay$1 = styled__default["default"].div`
@@ -38702,22 +38683,10 @@ const TableBody = ({
38702
38683
  buttonColor,
38703
38684
  onDeleteClick,
38704
38685
  selectedColor,
38705
- resetFocus = false,
38686
+ resetFocusIndex,
38687
+ changeFocusIndex,
38706
38688
  onFocusChange,
38707
38689
  indexToShimmer = 0,
38708
- statuses = [{
38709
- status: 'Pending',
38710
- palette: ['#F5C9A7', '#8B4513']
38711
- }, {
38712
- status: 'Received',
38713
- palette: ['#B9D5D5', '#2F4F4F']
38714
- }, {
38715
- status: 'Approved',
38716
- palette: ['#BEDDC3', '#2D5016']
38717
- }, {
38718
- status: 'Cancelled',
38719
- palette: ['#EBA6AF', '#8B1538']
38720
- }],
38721
38690
  onCommentSave = () => {},
38722
38691
  ref = null
38723
38692
  }) => {
@@ -38726,24 +38695,16 @@ const TableBody = ({
38726
38695
  const [isCommentModalOpen, setIsCommentModalOpen] = React$1.useState(false);
38727
38696
  const [currentCommentRow, setCurrentCommentRow] = React$1.useState(null); // Track which row is being edited
38728
38697
 
38729
- // Expose methods to parent components via ref (if ref is provided)
38730
- // useImperativeHandle(ref, () => ({
38731
- // clearFocus: () => setFocusedRowIndex(null),
38732
- // getFocusedRowIndex: () => focusedRowIndex
38733
- // }), [focusedRowIndex]);
38734
-
38735
38698
  React$1.useEffect(() => {
38736
- if (resetFocus) {
38699
+ if (resetFocusIndex) {
38737
38700
  setFocusedRowIndex(null);
38738
38701
  }
38739
- }, [resetFocus]);
38740
-
38741
- // Notify parent of focus changes
38742
- // useEffect(() => {
38743
- // if (onFocusChange) {
38744
- // onFocusChange(focusedRowIndex);
38745
- // }
38746
- // }, [focusedRowIndex, onFocusChange]);
38702
+ }, [resetFocusIndex]);
38703
+ React$1.useEffect(() => {
38704
+ if (changeFocusIndex) {
38705
+ setFocusedRowIndex(changeFocusIndex);
38706
+ }
38707
+ }, [changeFocusIndex]);
38747
38708
 
38748
38709
  // Handle row click for focus state
38749
38710
  const handleRowClick = (row, rowIndex) => {
@@ -38903,14 +38864,6 @@ const TableBody = ({
38903
38864
  }), /*#__PURE__*/React__default["default"].createElement("span", null, "All Sent"));
38904
38865
  }
38905
38866
  return value;
38906
- case 'status':
38907
- const statusObj = statuses.find(status => status.status === value) || {};
38908
- const [palette0, palette1] = statusObj.palette;
38909
- return /*#__PURE__*/React__default["default"].createElement(StatusCell, {
38910
- color: palette1
38911
- }, /*#__PURE__*/React__default["default"].createElement(StatusCellCircle, {
38912
- backgroundColor: palette0
38913
- }), /*#__PURE__*/React__default["default"].createElement("span", null, value));
38914
38867
  case 'comments':
38915
38868
  const commentText = value || '';
38916
38869
  const hasComments = commentText.trim().length > 0;
@@ -42274,8 +42227,8 @@ const Table = props => {
42274
42227
  noDataInSearchTitle = "No Results Found",
42275
42228
  noDataInSearchMessage = "Try to refine your query and search again",
42276
42229
  indexToShimmer = -1,
42277
- // New props for focus management
42278
- resetTableFocus = false,
42230
+ resetFocusIndex,
42231
+ changeFocusIndex,
42279
42232
  onTableFocusChange = () => {},
42280
42233
  clearFocusOnOutsideClick = true,
42281
42234
  // NEW: Props for edit mode focus management
@@ -42395,7 +42348,8 @@ const Table = props => {
42395
42348
  onDeleteClick: onDeleteClick,
42396
42349
  onCommentSave: handleCommentSave,
42397
42350
  buttonColor: buttonColor,
42398
- resetFocus: resetTableFocus,
42351
+ resetFocusIndex: resetFocusIndex,
42352
+ changeFocusIndex: changeFocusIndex,
42399
42353
  onFocusChange: handleTableFocusChange
42400
42354
  })), data.length === 0 && /*#__PURE__*/React__default["default"].createElement(NoEventsParent, null, /*#__PURE__*/React__default["default"].createElement(NoEventsWrapper, null, showNoDataInSearch ? /*#__PURE__*/React__default["default"].createElement(NoDataInSearchIcon, null) : /*#__PURE__*/React__default["default"].createElement(NoEvents, null)), /*#__PURE__*/React__default["default"].createElement(NoEventsMessage, null, showNoDataInSearch ? /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("strong", null, noDataInSearchTitle), /*#__PURE__*/React__default["default"].createElement("br", null), noDataInSearchMessage) : /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("strong", null, "You haven't created any events yet"), /*#__PURE__*/React__default["default"].createElement("br", null), "Let's get started and create your first one!")), !showNoDataInSearch && /*#__PURE__*/React__default["default"].createElement(Button$1, {
42401
42355
  height: "45px",