@7shifts/sous-chef 2.8.0 → 2.8.3

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.
@@ -6,6 +6,6 @@ declare type Props = {
6
6
  isSelected?: boolean;
7
7
  actions?: Action[];
8
8
  hasDefaultPadding?: boolean;
9
- };
10
- declare const DataTableRow: React.FC<Props>;
9
+ } & Omit<React.HTMLProps<HTMLDivElement>, 'css'>;
10
+ declare const DataTableRow: React.ForwardRefExoticComponent<Pick<Props, "children" | "type" | "default" | "disabled" | "onClick" | "id" | "title" | "href" | "target" | "cite" | "data" | "form" | "label" | "slot" | "span" | "style" | "summary" | "pattern" | "key" | "contextMenu" | "list" | "className" | "start" | "wrap" | "dir" | "checked" | "onChange" | "name" | "value" | "onBlur" | "placeholder" | "prefix" | "color" | "content" | "height" | "translate" | "width" | "hidden" | "size" | "open" | "multiple" | "aria-label" | "aria-labelledby" | "autoFocus" | "onFocus" | "onKeyDown" | "tabIndex" | "defaultValue" | "accept" | "acceptCharset" | "action" | "allowFullScreen" | "allowTransparency" | "alt" | "as" | "async" | "autoComplete" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "classID" | "cols" | "colSpan" | "controls" | "coords" | "crossOrigin" | "dateTime" | "defer" | "download" | "encType" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "high" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "loop" | "low" | "manifest" | "marginHeight" | "marginWidth" | "max" | "maxLength" | "media" | "mediaGroup" | "method" | "min" | "minLength" | "muted" | "nonce" | "noValidate" | "optimum" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "required" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "sizes" | "src" | "srcDoc" | "srcLang" | "srcSet" | "step" | "useMap" | "wmode" | "defaultChecked" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "draggable" | "lang" | "spellCheck" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocusCapture" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "isSelected" | "actions" | "hasDefaultPadding"> & React.RefAttributes<HTMLDivElement>>;
11
11
  export default DataTableRow;
@@ -0,0 +1,5 @@
1
+ /**
2
+ * This helper method helps to check if the user is scrolling inside the select options so,
3
+ * it does not close the menu when using the prop menuShouldScrollIntoView
4
+ **/
5
+ export declare const isScrollingTheSelectMenu: (element: HTMLElement) => boolean;
package/dist/index.js CHANGED
@@ -3346,7 +3346,9 @@ var useDataTableContext = function useDataTableContext() {
3346
3346
 
3347
3347
  var styles$9 = {"item":"_1d8Ci","selected":"_3tb7U","clickable":"_thFcO","item-column":"_OTcMc","item-column--default-padding":"_lNHQ8","item-column--right-align":"_13YLe","item-column--vertical-border":"_1rrRr","actions":"_azbIG"};
3348
3348
 
3349
- var DataTableRow = function DataTableRow(_ref) {
3349
+ var _excluded$2 = ["children", "onClick", "isSelected", "actions", "hasDefaultPadding"];
3350
+
3351
+ var DataTableRowComponent = function DataTableRowComponent(_ref, ref) {
3350
3352
  var _classnames;
3351
3353
 
3352
3354
  var children = _ref.children,
@@ -3356,7 +3358,8 @@ var DataTableRow = function DataTableRow(_ref) {
3356
3358
  _ref$actions = _ref.actions,
3357
3359
  actions = _ref$actions === void 0 ? [] : _ref$actions,
3358
3360
  _ref$hasDefaultPaddin = _ref.hasDefaultPadding,
3359
- hasDefaultPadding = _ref$hasDefaultPaddin === void 0 ? true : _ref$hasDefaultPaddin;
3361
+ hasDefaultPadding = _ref$hasDefaultPaddin === void 0 ? true : _ref$hasDefaultPaddin,
3362
+ nativeDivProps = _objectWithoutPropertiesLoose(_ref, _excluded$2);
3360
3363
 
3361
3364
  var _useDataTableContext = useDataTableContext(),
3362
3365
  columns = _useDataTableContext.columns,
@@ -3380,13 +3383,14 @@ var DataTableRow = function DataTableRow(_ref) {
3380
3383
  }, columnElement);
3381
3384
  };
3382
3385
 
3383
- return React__default.createElement("div", {
3386
+ return React__default.createElement("div", Object.assign({}, nativeDivProps, {
3384
3387
  className: styleNames,
3385
3388
  onClick: onClick ? onClick : undefined,
3386
3389
  onKeyPress: onClick ? onClick : undefined,
3387
3390
  "data-testid": "data-table-row",
3388
- role: "row"
3389
- }, React__default.Children.map(children, function (child, index) {
3391
+ role: "row",
3392
+ ref: ref
3393
+ }), React__default.Children.map(children, function (child, index) {
3390
3394
  return renderColumn(child, index);
3391
3395
  }), showActionMenu && React__default.createElement("div", {
3392
3396
  className: classnames(styles$9['item-column'], styles$9['actions']),
@@ -3399,6 +3403,8 @@ var DataTableRow = function DataTableRow(_ref) {
3399
3403
  })))));
3400
3404
  };
3401
3405
 
3406
+ var DataTableRow = React.forwardRef(DataTableRowComponent);
3407
+
3402
3408
  var styles$a = {"header":"_of22N","header-item":"_27x4v","header-item--sortable":"_3gw3Z","header-item--right-align":"_Fjm2n","header-item--action":"_LoIvx","header-sort-icon":"_3VjFP","body":"_1bTmd","footer":"_1opWx","pagination-controls":"_F_spz"};
3403
3409
 
3404
3410
  var SORT_ORDER$1 = {
@@ -4321,12 +4327,12 @@ var useTextField = function useTextField(_ref) {
4321
4327
  };
4322
4328
  };
4323
4329
 
4324
- var _excluded$2 = ["prefix", "suffix"];
4330
+ var _excluded$3 = ["prefix", "suffix"];
4325
4331
 
4326
4332
  var TextFieldElement = function TextFieldElement(_ref, ref) {
4327
4333
  var prefix = _ref.prefix,
4328
4334
  suffix = _ref.suffix,
4329
- props = _objectWithoutPropertiesLoose(_ref, _excluded$2);
4335
+ props = _objectWithoutPropertiesLoose(_ref, _excluded$3);
4330
4336
 
4331
4337
  var _useTextField = useTextField(_extends({}, props, {
4332
4338
  ref: ref
@@ -4949,16 +4955,38 @@ var getSelectStyles$1 = function getSelectStyles(_ref) {
4949
4955
  };
4950
4956
  };
4951
4957
 
4952
- var _excluded$3 = ["children", "CustomComponent"];
4958
+ var _excluded$4 = ["children", "CustomComponent"];
4953
4959
 
4954
4960
  function CustomOption(_ref) {
4955
4961
  var children = _ref.children,
4956
4962
  CustomComponent = _ref.CustomComponent,
4957
- props = _objectWithoutPropertiesLoose(_ref, _excluded$3);
4963
+ props = _objectWithoutPropertiesLoose(_ref, _excluded$4);
4958
4964
 
4959
4965
  return React__default.createElement(Select.components.Option, Object.assign({}, props), React__default.createElement(CustomComponent, Object.assign({}, props), children));
4960
4966
  }
4961
4967
 
4968
+ var isScrollingTheSelectMenu = function isScrollingTheSelectMenu(element) {
4969
+ if (!isReactSelectElement(element)) {
4970
+ var _element$children;
4971
+
4972
+ return isReactSelectElement(element === null || element === void 0 ? void 0 : (_element$children = element.children) === null || _element$children === void 0 ? void 0 : _element$children[0]);
4973
+ }
4974
+
4975
+ return true;
4976
+ };
4977
+
4978
+ var isReactSelectElement = function isReactSelectElement(element) {
4979
+ var _element$children2;
4980
+
4981
+ var firstOption = element === null || element === void 0 ? void 0 : (_element$children2 = element.children) === null || _element$children2 === void 0 ? void 0 : _element$children2[0];
4982
+
4983
+ if (!firstOption) {
4984
+ return false;
4985
+ }
4986
+
4987
+ return typeof firstOption.id === 'string' && firstOption.id.includes('react-select');
4988
+ };
4989
+
4962
4990
  var MultiSelectField = function MultiSelectField(_ref) {
4963
4991
  var name = _ref.name,
4964
4992
  inputId = _ref.id,
@@ -5027,24 +5055,21 @@ var MultiSelectField = function MultiSelectField(_ref) {
5027
5055
  return false;
5028
5056
  }
5029
5057
 
5030
- var target = e.target;
5031
- var firstOption = target.children[0];
5032
- var isScrollingTheMenu = firstOption && typeof firstOption.id === 'string' && firstOption.id.includes('react-select');
5033
- return !isScrollingTheMenu;
5058
+ return !isScrollingTheSelectMenu(e.target);
5034
5059
  }
5035
5060
  }));
5036
5061
  };
5037
5062
 
5038
5063
  var styles$q = {"custom-control":"_1cDCR"};
5039
5064
 
5040
- var _excluded$4 = ["children", "CustomPrefixComponent"];
5065
+ var _excluded$5 = ["children", "CustomPrefixComponent"];
5041
5066
 
5042
5067
  function CustomControl(_ref) {
5043
5068
  var _props$getValue;
5044
5069
 
5045
5070
  var children = _ref.children,
5046
5071
  CustomPrefixComponent = _ref.CustomPrefixComponent,
5047
- props = _objectWithoutPropertiesLoose(_ref, _excluded$4);
5072
+ props = _objectWithoutPropertiesLoose(_ref, _excluded$5);
5048
5073
 
5049
5074
  var selectedOption = (_props$getValue = props.getValue()) === null || _props$getValue === void 0 ? void 0 : _props$getValue[0];
5050
5075
  return React__default.createElement(Select.components.Control, Object.assign({}, props), CustomControl && selectedOption ? React__default.createElement("div", {
@@ -5061,12 +5086,12 @@ function CustomControl(_ref) {
5061
5086
  }, props)), children)) : children);
5062
5087
  }
5063
5088
 
5064
- var _excluded$5 = ["children", "CustomComponent"];
5089
+ var _excluded$6 = ["children", "CustomComponent"];
5065
5090
 
5066
5091
  function CustomOption$1(_ref) {
5067
5092
  var children = _ref.children,
5068
5093
  CustomComponent = _ref.CustomComponent,
5069
- props = _objectWithoutPropertiesLoose(_ref, _excluded$5);
5094
+ props = _objectWithoutPropertiesLoose(_ref, _excluded$6);
5070
5095
 
5071
5096
  return React__default.createElement(Select.components.Option, Object.assign({}, props), React__default.createElement(CustomComponent, Object.assign({}, props), children));
5072
5097
  }
@@ -5120,10 +5145,7 @@ var SelectField = function SelectField(_ref) {
5120
5145
  return false;
5121
5146
  }
5122
5147
 
5123
- var target = e.target;
5124
- var firstOption = target.children[0];
5125
- var isScrollingTheMenu = firstOption && typeof firstOption.id === 'string' && firstOption.id.includes('react-select');
5126
- return !isScrollingTheMenu;
5148
+ return !isScrollingTheSelectMenu(e.target);
5127
5149
  },
5128
5150
  components: {
5129
5151
  Option: UserCustomOption ? function (props) {
@@ -5881,14 +5903,14 @@ var WeekField = function WeekField(_ref) {
5881
5903
  })));
5882
5904
  };
5883
5905
 
5884
- var _excluded$6 = ["placeholder", "autoComplete"];
5906
+ var _excluded$7 = ["placeholder", "autoComplete"];
5885
5907
 
5886
5908
  var TimeFieldElement = function TimeFieldElement(_ref, ref) {
5887
5909
  var _ref$placeholder = _ref.placeholder,
5888
5910
  placeholder = _ref$placeholder === void 0 ? '9am' : _ref$placeholder,
5889
5911
  _ref$autoComplete = _ref.autoComplete,
5890
5912
  autoComplete = _ref$autoComplete === void 0 ? 'off' : _ref$autoComplete,
5891
- allOtherProps = _objectWithoutPropertiesLoose(_ref, _excluded$6);
5913
+ allOtherProps = _objectWithoutPropertiesLoose(_ref, _excluded$7);
5892
5914
 
5893
5915
  var _useTextField = useTextField(_extends({}, allOtherProps, {
5894
5916
  placeholder: placeholder,
@@ -5909,12 +5931,12 @@ var TimeFieldElement = function TimeFieldElement(_ref, ref) {
5909
5931
 
5910
5932
  var TimeField = React.forwardRef(TimeFieldElement);
5911
5933
 
5912
- var _excluded$7 = ["currencySymbol"];
5934
+ var _excluded$8 = ["currencySymbol"];
5913
5935
 
5914
5936
  var CurrencyFieldElement = function CurrencyFieldElement(_ref, ref) {
5915
5937
  var _ref$currencySymbol = _ref.currencySymbol,
5916
5938
  currencySymbol = _ref$currencySymbol === void 0 ? "$" : _ref$currencySymbol,
5917
- allOtherProps = _objectWithoutPropertiesLoose(_ref, _excluded$7);
5939
+ allOtherProps = _objectWithoutPropertiesLoose(_ref, _excluded$8);
5918
5940
 
5919
5941
  var _useTextField = useTextField(_extends({}, allOtherProps, {
5920
5942
  ref: ref
@@ -5947,7 +5969,7 @@ var CurrencyFieldElement = function CurrencyFieldElement(_ref, ref) {
5947
5969
 
5948
5970
  var CurrencyField = React.forwardRef(CurrencyFieldElement);
5949
5971
 
5950
- var _excluded$8 = ["max", "min", "precision", "stepSize"];
5972
+ var _excluded$9 = ["max", "min", "precision", "stepSize"];
5951
5973
 
5952
5974
  var PercentageElement = function PercentageElement(_ref, ref) {
5953
5975
  var _ref$max = _ref.max,
@@ -5958,7 +5980,7 @@ var PercentageElement = function PercentageElement(_ref, ref) {
5958
5980
  precision = _ref$precision === void 0 ? 0 : _ref$precision,
5959
5981
  _ref$stepSize = _ref.stepSize,
5960
5982
  stepSize = _ref$stepSize === void 0 ? 1 : _ref$stepSize,
5961
- allOtherProps = _objectWithoutPropertiesLoose(_ref, _excluded$8);
5983
+ allOtherProps = _objectWithoutPropertiesLoose(_ref, _excluded$9);
5962
5984
 
5963
5985
  var _useTextField = useTextField(_extends({}, allOtherProps, {
5964
5986
  ref: ref
@@ -6211,7 +6233,7 @@ var FooterContainer = function FooterContainer(_ref2) {
6211
6233
 
6212
6234
  var styles$z = {"badge":"_2f81N","badge--warning":"_2g1GI","badge--danger":"_2zLnM","badge--success":"_27QOo","badge--info":"_2gmsM"};
6213
6235
 
6214
- var _excluded$9 = ["children", "theme", "title"];
6236
+ var _excluded$a = ["children", "theme", "title"];
6215
6237
 
6216
6238
  var Badge = function Badge(_ref, forwardedRef) {
6217
6239
  var _classnames;
@@ -6219,7 +6241,7 @@ var Badge = function Badge(_ref, forwardedRef) {
6219
6241
  var children = _ref.children,
6220
6242
  theme = _ref.theme,
6221
6243
  title = _ref.title,
6222
- otherProps = _objectWithoutPropertiesLoose(_ref, _excluded$9);
6244
+ otherProps = _objectWithoutPropertiesLoose(_ref, _excluded$a);
6223
6245
 
6224
6246
  var internalRef = React.useRef(null);
6225
6247
  var ref = forwardedRef || internalRef;