@superdispatch/ui - npm Package Compare versions

Comparing version 0.0.14 to 0.0.15

dist-node/index.js

@@ -366,2 +366,9 @@ 'use strict';
       },
+      MuiListItem: {
+        root: {
+          '&$selected, &$selected:hover': {
+            color: exports.Color.Blue
+          }
+        }
+      },
       MuiTabs: {
@@ -438,10 +445,10 @@ root: {
 
-  const handleOpen = event => setAnchorEl(event.currentTarget);
+  const onOpen = event => setAnchorEl(event.currentTarget);
 
-  const handleClose = () => setAnchorEl(null);
+  const onClose = () => setAnchorEl(null);
 
   return {
     anchorEl,
-    handleOpen,
-    handleClose
+    onOpen,
+    onClose
   };
@@ -480,11 +487,12 @@ }
     anchorEl,
-    handleOpen,
-    handleClose,
+    onOpen,
+    onClose,
     quickSelectionItems,
+    quickSelectionSelectedItem,
     footer
   } = _ref2,
-      props = _objectWithoutProperties(_ref2, ["InputComponent", "classNames", "value", "onChange", "anchorEl", "handleOpen", "handleClose", "quickSelectionItems", "footer"]);
+      props = _objectWithoutProperties(_ref2, ["InputComponent", "classNames", "value", "onChange", "anchorEl", "onOpen", "onClose", "quickSelectionItems", "quickSelectionSelectedItem", "footer"]);
 
   return React__default.createElement(React__default.Fragment, null, React__default.createElement(InputComponent, {
-    onClick: handleOpen,
+    onClick: onOpen,
     value: value,
@@ -499,6 +507,7 @@ readOnly: true
     },
-    onClose: handleClose
+    onClose: onClose
   }, React__default.createElement(core.Paper, null, React__default.createElement(core.Grid, {
     container: true
   }, quickSelectionItems && React__default.createElement(core.Grid, {
+    item: true,
     xs: 12,
@@ -512,7 +521,9 @@ sm: "auto",
     button: true,
+    selected: quickSelectionSelectedItem === quickSelectionItem,
     onClick: () => {
       onChange(quickSelectionItem.value);
-      handleClose();
+      onClose();
     }
   }, quickSelectionItem.label)))), React__default.createElement(core.Grid, {
+    item: true,
     xs: 12,
@@ -687,15 +698,13 @@ sm: "auto"
   const classNames = useDatePickerStyles();
+  const stateProps = useDatePickerBaseState();
+  const {
+    onClose
+  } = stateProps;
 
-  const _useDatePickerBaseSta = useDatePickerBaseState(),
-        {
-    handleClose
-  } = _useDatePickerBaseSta,
-        stateProps = _objectWithoutProperties(_useDatePickerBaseSta, ["handleClose"]);
-
   const handleDayClick = day => {
     onChange(day);
-    handleClose();
+    onClose();
   };
 
-  return React__default.createElement(DatePickerBase, _extends({
+  return React__default.createElement(DatePickerBase, _extends({}, stateProps, {
     classNames: classNames,
@@ -706,5 +715,3 @@ onDayClick: handleDayClick,
     onChange: onChange
-  }, props, {
-    handleClose: handleClose
-  }, stateProps));
+  }, props));
 }
@@ -767,9 +774,23 @@
 
+const isSameDate = (dateA, dateB) => dateA && dateB && dateA.getTime() === dateB.getTime();
+
+const isSameValue = (valueA, valueB) => {
+  const sortedValueA = sortDates(valueA);
+  const sortedValueB = sortDates(valueB);
+  return isSameDate(sortedValueA[0], sortedValueB[0]) && isSameDate(sortedValueA[1], sortedValueB[1]);
+};
+
 function DateRangePicker(_ref) {
   let {
     value,
-    onChange
+    onChange,
+    quickSelectionItems
   } = _ref,
-      props = _objectWithoutProperties(_ref, ["value", "onChange"]);
+      props = _objectWithoutProperties(_ref, ["value", "onChange", "quickSelectionItems"]);
 
+  const stateProps = useDatePickerBaseState();
+  const {
+    onClose
+  } = stateProps;
+
   const _useDateRangePickerSt = useDateRangePickerStyles(),
@@ -782,8 +803,2 @@ {
 
-  const _useDatePickerBaseSta = useDatePickerBaseState(),
-        {
-    handleClose
-  } = _useDatePickerBaseSta,
-        stateProps = _objectWithoutProperties(_useDatePickerBaseSta, ["handleClose"]);
-
   const [pickingDateType, setPickingDateType] = React.useState('start');
@@ -803,2 +818,7 @@ const [hoveredDate, setHoveredDate] = React.useState();
 
+  const handleClose = () => {
+    setPickingDateType('start');
+    onClose();
+  };
+
   const handleDayClick = date => {
@@ -814,3 +834,2 @@ if (pickingDateType === 'start') {
       onChange(sortDates(newValue));
-      setPickingDateType('start');
       handleClose();
@@ -824,3 +843,5 @@ }
 
-  return React__default.createElement(DatePickerBase, _extends({
+  const quickSelectionSelectedItem = quickSelectionItems && quickSelectionItems.find(item => isSameValue(item.value, value));
+  return React__default.createElement(DatePickerBase, _extends({}, stateProps, {
+    onClose: handleClose,
     classNames: classNames,
@@ -832,6 +853,6 @@ selectedDays: selectedDays,
     value: value,
-    onChange: onChange
-  }, props, {
-    handleClose: handleClose
-  }, stateProps));
+    onChange: onChange,
+    quickSelectionItems: quickSelectionItems,
+    quickSelectionSelectedItem: quickSelectionSelectedItem
+  }, props));
 }
@@ -838,0 +859,0 @@

dist-src/date-picker/DatePicker.js

@@ -11,13 +11,13 @@ import _extends from "@babel/runtime/helpers/extends";
   const classNames = useDatePickerStyles();
+  const stateProps = useDatePickerBaseState();
   const {
-    handleClose,
-    ...stateProps
-  } = useDatePickerBaseState();
+    onClose
+  } = stateProps;
 
   const handleDayClick = day => {
     onChange(day);
-    handleClose();
+    onClose();
   };
 
-  return React.createElement(DatePickerBase, _extends({
+  return React.createElement(DatePickerBase, _extends({}, stateProps, {
     classNames: classNames,
@@ -28,5 +28,3 @@ onDayClick: handleDayClick,
     onChange: onChange
-  }, props, {
-    handleClose: handleClose
-  }, stateProps));
+  }, props));
 }

dist-src/date-picker/DatePickerBase.js

@@ -8,10 +8,10 @@ import _extends from "@babel/runtime/helpers/extends";
 
-  const handleOpen = event => setAnchorEl(event.currentTarget);
+  const onOpen = event => setAnchorEl(event.currentTarget);
 
-  const handleClose = () => setAnchorEl(null);
+  const onClose = () => setAnchorEl(null);
 
   return {
     anchorEl,
-    handleOpen,
-    handleClose
+    onOpen,
+    onClose
   };
@@ -45,5 +45,6 @@ }
   anchorEl,
-  handleOpen,
-  handleClose,
+  onOpen,
+  onClose,
   quickSelectionItems,
+  quickSelectionSelectedItem,
   footer,
@@ -53,3 +54,3 @@ ...props
   return React.createElement(React.Fragment, null, React.createElement(InputComponent, {
-    onClick: handleOpen,
+    onClick: onOpen,
     value: value,
@@ -64,6 +65,7 @@ readOnly: true
     },
-    onClose: handleClose
+    onClose: onClose
   }, React.createElement(Paper, null, React.createElement(Grid, {
     container: true
   }, quickSelectionItems && React.createElement(Grid, {
+    item: true,
     xs: 12,
@@ -77,7 +79,9 @@ sm: "auto",
     button: true,
+    selected: quickSelectionSelectedItem === quickSelectionItem,
     onClick: () => {
       onChange(quickSelectionItem.value);
-      handleClose();
+      onClose();
     }
   }, quickSelectionItem.label)))), React.createElement(Grid, {
+    item: true,
     xs: 12,
@@ -84,0 +88,0 @@ sm: "auto"

dist-src/date-picker/DateRangePicker.js

@@ -10,8 +10,21 @@ import _extends from "@babel/runtime/helpers/extends";
 
+const isSameDate = (dateA, dateB) => dateA && dateB && dateA.getTime() === dateB.getTime();
+
+const isSameValue = (valueA, valueB) => {
+  const sortedValueA = sortDates(valueA);
+  const sortedValueB = sortDates(valueB);
+  return isSameDate(sortedValueA[0], sortedValueB[0]) && isSameDate(sortedValueA[1], sortedValueB[1]);
+};
+
 export function DateRangePicker({
   value,
   onChange,
+  quickSelectionItems,
   ...props
 }) {
+  const stateProps = useDatePickerBaseState();
   const {
+    onClose
+  } = stateProps;
+  const {
     firstDayOfRange,
@@ -21,6 +34,2 @@ lastDayOfRange,
   } = useDateRangePickerStyles();
-  const {
-    handleClose,
-    ...stateProps
-  } = useDatePickerBaseState();
   const [pickingDateType, setPickingDateType] = useState('start');
@@ -39,4 +48,8 @@ const [hoveredDate, setHoveredDate] = useState();
   };
-  [].sort;
 
+  const handleClose = () => {
+    setPickingDateType('start');
+    onClose();
+  };
+
   const handleDayClick = date => {
@@ -52,3 +65,2 @@ if (pickingDateType === 'start') {
       onChange(sortDates(newValue));
-      setPickingDateType('start');
       handleClose();
@@ -62,3 +74,5 @@ }
 
-  return React.createElement(DatePickerBase, _extends({
+  const quickSelectionSelectedItem = quickSelectionItems && quickSelectionItems.find(item => isSameValue(item.value, value));
+  return React.createElement(DatePickerBase, _extends({}, stateProps, {
+    onClose: handleClose,
     classNames: classNames,
@@ -70,6 +84,6 @@ selectedDays: selectedDays,
     value: value,
-    onChange: onChange
-  }, props, {
-    handleClose: handleClose
-  }, stateProps));
+    onChange: onChange,
+    quickSelectionItems: quickSelectionItems,
+    quickSelectionSelectedItem: quickSelectionSelectedItem
+  }, props));
 }

dist-src/theme/ThemeProvider.js

@@ -72,2 +72,9 @@ import { createMuiTheme, CssBaseline } from '@material-ui/core';
       },
+      MuiListItem: {
+        root: {
+          '&$selected, &$selected:hover': {
+            color: Color.Blue
+          }
+        }
+      },
       MuiTabs: {
@@ -74,0 +81,0 @@ root: {

dist-types/date-picker/DatePickerBase.d.ts

@@ -10,4 +10,4 @@ import React from 'react';
     anchorEl: HTMLInputElement | null;
-    handleOpen: (event: React.MouseEvent<HTMLInputElement>) => void;
-    handleClose: () => void;
+    onOpen: (event: React.MouseEvent<HTMLInputElement>) => void;
+    onClose: () => void;
 }
@@ -24,2 +24,3 @@ export interface DatePickerBaseQuickSelectionItem {
     quickSelectionItems?: DatePickerBaseQuickSelectionItem[];
+    quickSelectionSelectedItem?: DatePickerBaseQuickSelectionItem;
     InputComponent: DatePickerBaseInputComponent<any>;
@@ -31,5 +32,5 @@ onChange: (value: any) => void;
     anchorEl: HTMLInputElement | null;
-    handleOpen: (event: React.MouseEvent<HTMLInputElement, MouseEvent>) => void;
-    handleClose: () => void;
+    onOpen: (event: React.MouseEvent<HTMLInputElement, MouseEvent>) => void;
+    onClose: () => void;
 };
-export declare function DatePickerBase({ InputComponent, classNames, value, onChange, anchorEl, handleOpen, handleClose, quickSelectionItems, footer, ...props }: DatePickerBaseProps & DatePickerBaseState): JSX.Element;
+export declare function DatePickerBase({ InputComponent, classNames, value, onChange, anchorEl, onOpen, onClose, quickSelectionItems, quickSelectionSelectedItem, footer, ...props }: DatePickerBaseProps & DatePickerBaseState): JSX.Element;

dist-types/date-picker/DateRangePicker.d.ts

@@ -14,2 +14,2 @@ /// <reference types="react" />
 }
-export declare function DateRangePicker({ value, onChange, ...props }: DateRangePickerProps): JSX.Element;
+export declare function DateRangePicker({ value, onChange, quickSelectionItems, ...props }: DateRangePickerProps): JSX.Element;

dist-web/index.js

@@ -274,2 +274,9 @@ import _extends from '@babel/runtime/helpers/extends';
       },
+      MuiListItem: {
+        root: {
+          '&$selected, &$selected:hover': {
+            color: Color.Blue
+          }
+        }
+      },
       MuiTabs: {
@@ -346,10 +353,10 @@ root: {
 
-  const handleOpen = event => setAnchorEl(event.currentTarget);
+  const onOpen = event => setAnchorEl(event.currentTarget);
 
-  const handleClose = () => setAnchorEl(null);
+  const onClose = () => setAnchorEl(null);
 
   return {
     anchorEl,
-    handleOpen,
-    handleClose
+    onOpen,
+    onClose
   };
@@ -383,5 +390,6 @@ }
   anchorEl,
-  handleOpen,
-  handleClose,
+  onOpen,
+  onClose,
   quickSelectionItems,
+  quickSelectionSelectedItem,
   footer,
@@ -391,3 +399,3 @@ ...props
   return React.createElement(React.Fragment, null, React.createElement(InputComponent, {
-    onClick: handleOpen,
+    onClick: onOpen,
     value: value,
@@ -402,6 +410,7 @@ readOnly: true
     },
-    onClose: handleClose
+    onClose: onClose
   }, React.createElement(Paper, null, React.createElement(Grid, {
     container: true
   }, quickSelectionItems && React.createElement(Grid, {
+    item: true,
     xs: 12,
@@ -415,7 +424,9 @@ sm: "auto",
     button: true,
+    selected: quickSelectionSelectedItem === quickSelectionItem,
     onClick: () => {
       onChange(quickSelectionItem.value);
-      handleClose();
+      onClose();
     }
   }, quickSelectionItem.label)))), React.createElement(Grid, {
+    item: true,
     xs: 12,
@@ -589,13 +600,13 @@ sm: "auto"
   const classNames = useDatePickerStyles();
+  const stateProps = useDatePickerBaseState();
   const {
-    handleClose,
-    ...stateProps
-  } = useDatePickerBaseState();
+    onClose
+  } = stateProps;
 
   const handleDayClick = day => {
     onChange(day);
-    handleClose();
+    onClose();
   };
 
-  return React.createElement(DatePickerBase, _extends({
+  return React.createElement(DatePickerBase, _extends({}, stateProps, {
     classNames: classNames,
@@ -606,5 +617,3 @@ onDayClick: handleDayClick,
     onChange: onChange
-  }, props, {
-    handleClose: handleClose
-  }, stateProps));
+  }, props));
 }
@@ -667,8 +676,21 @@
 
+const isSameDate = (dateA, dateB) => dateA && dateB && dateA.getTime() === dateB.getTime();
+
+const isSameValue = (valueA, valueB) => {
+  const sortedValueA = sortDates(valueA);
+  const sortedValueB = sortDates(valueB);
+  return isSameDate(sortedValueA[0], sortedValueB[0]) && isSameDate(sortedValueA[1], sortedValueB[1]);
+};
+
 function DateRangePicker({
   value,
   onChange,
+  quickSelectionItems,
   ...props
 }) {
+  const stateProps = useDatePickerBaseState();
   const {
+    onClose
+  } = stateProps;
+  const {
     firstDayOfRange,
@@ -678,6 +700,2 @@ lastDayOfRange,
   } = useDateRangePickerStyles();
-  const {
-    handleClose,
-    ...stateProps
-  } = useDatePickerBaseState();
   const [pickingDateType, setPickingDateType] = useState('start');
@@ -697,2 +715,7 @@ const [hoveredDate, setHoveredDate] = useState();
 
+  const handleClose = () => {
+    setPickingDateType('start');
+    onClose();
+  };
+
   const handleDayClick = date => {
@@ -708,3 +731,2 @@ if (pickingDateType === 'start') {
       onChange(sortDates(newValue));
-      setPickingDateType('start');
       handleClose();
@@ -718,3 +740,5 @@ }
 
-  return React.createElement(DatePickerBase, _extends({
+  const quickSelectionSelectedItem = quickSelectionItems && quickSelectionItems.find(item => isSameValue(item.value, value));
+  return React.createElement(DatePickerBase, _extends({}, stateProps, {
+    onClose: handleClose,
     classNames: classNames,
@@ -726,6 +750,6 @@ selectedDays: selectedDays,
     value: value,
-    onChange: onChange
-  }, props, {
-    handleClose: handleClose
-  }, stateProps));
+    onChange: onChange,
+    quickSelectionItems: quickSelectionItems,
+    quickSelectionSelectedItem: quickSelectionSelectedItem
+  }, props));
 }
@@ -732,0 +756,0 @@

package.json

 {
   "name": "@superdispatch/ui",
-  "version": "0.0.14",
+  "version": "0.0.15",
   "license": "MIT",
@@ -5,0 +5,0 @@ "files": [

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

162431

increased by3.75%

Lines of code

2401

increased by2.61%

Published versions last week

2

increased by100%

No dependency changes