orcs-design-system 3.1.37 → 3.1.39

package/es/components/DatePicker/index.js

@@ -97,7 +97,7 @@ var DatePickerLabel = styled.label.withConfig({
 var DatePickerContainer = styled.div.withConfig({
   displayName: "DatePicker__DatePickerContainer",
   componentId: "sc-15292wq-1"
-})([".SingleDatePickerInput,.DateRangePickerInput{display:block;cursor:text;-moz-appearance:none;-webkit-appearance:none;appearance:none;box-shadow:none;font-family:\"Open Sans\",\"Helvetica Neue\",Helvetica,Arial,sans-serif;border:0;border-radius:0;background:transparent;}.SingleDatePickerInput__withBorder,.DateRangePickerInput__withBorder{border:none;border-radius:0;}.SingleDatePicker{width:", ";}.DateInput{width:", ";background:none;position:relative;}.DateRangePickerInput_arrow_svg path{fill:", ";}.SingleDatePicker_picker,.DateRangePicker_picker{background:none;z-index:", ";}.DateInput_input{display:block;cursor:text;-moz-appearance:none;-webkit-appearance:none;appearance:none;box-shadow:none;font-family:\"Open Sans\",\"Helvetica Neue\",Helvetica,Arial,sans-serif;font-size:", ";font-weight:", ";z-index:1;transition:", ";background:", ";color:", ";height:", ";width:", ";padding:5px 12px 6px 12px;border-radius:", ";border:1px solid ", ";&:hover{border:1px solid ", ";}&:focus{outline:0;box-shadow:", " ", ";border:1px solid ", ";}&::placeholder{color:", ";}}.DateInput_input__focused{outline:0;box-shadow:", " ", ";border:1px solid ", ";}.DayPickerKeyboardShortcuts_panel{color:", ";}.CalendarDay__default{transition:", ";}.CalendarDay__selected,.CalendarDay__selected:active,.CalendarDay__selected:hover{background:", ";border:1px solid ", ";}.DayPickerKeyboardShortcuts_show__bottomRight{border-radius:0 0 3px 0;overflow:hidden;}.DayPickerKeyboardShortcuts_show__topRight{border-radius:0 3px 0 0;overflow:hidden;}.DayPickerKeyboardShortcuts_show__bottomRight:before,.DayPickerKeyboardShortcuts_show__topRight:before{border-right:33px solid ", ";transition:", ";}.DayPickerKeyboardShortcuts_show__bottomRight:hover:before,.DayPickerKeyboardShortcuts_show__topRight:hover:before{border-right:33px solid ", ";}.CalendarDay__selected_span,.CalendarDay__hovered_span,.CalendarDay__hovered_span:active{background:", ";border:1px solid ", ";color:", ";}.CalendarDay__hovered_span:hover,.CalendarDay__default:hover{background:", ";border:1px double ", ";color:", ";}.CalendarDay__selected_span:active,.CalendarDay__selected_span:hover{background:", ";border:1px solid ", ";}.DateInput_fang{margin-top:1px;z-index:", ";}"], function (props) {
+})([".SingleDatePickerInput,.DateRangePickerInput{display:block;cursor:text;-moz-appearance:none;-webkit-appearance:none;appearance:none;box-shadow:none;font-family:\"Open Sans\",\"Helvetica Neue\",Helvetica,Arial,sans-serif;border:0;border-radius:0;background:transparent;}.SingleDatePickerInput__withBorder,.DateRangePickerInput__withBorder{border:none;border-radius:0;}.SingleDatePicker{width:", ";}.DateInput{width:", ";background:none;position:relative;}.DateRangePickerInput_arrow_svg path{fill:", ";}.DateRangePickerInput_arrow{display:none;}.SingleDatePicker_picker,.DateRangePicker_picker{background:none;z-index:", ";}.DateInput_input{display:block;cursor:text;-moz-appearance:none;-webkit-appearance:none;appearance:none;box-shadow:none;font-family:\"Open Sans\",\"Helvetica Neue\",Helvetica,Arial,sans-serif;font-size:", ";font-weight:", ";z-index:1;transition:", ";background:", ";color:", ";height:", ";width:", ";padding:5px 12px 6px 12px;border-radius:", ";border:1px solid ", ";&:hover{border:1px solid ", ";}&:focus{outline:0;box-shadow:", " ", ";border:1px solid ", ";}&::placeholder{color:", ";}}.DateInput_input__focused{outline:0;box-shadow:", " ", ";border:1px solid ", ";}.DateRangePickerInput .DateInput:first-child .DateInput_input{border-radius:", ";}.DateRangePickerInput .DateInput:last-child .DateInput_input{border-radius:", ";}.DayPickerKeyboardShortcuts_panel{color:", ";}.CalendarDay__default{transition:", ";}.CalendarDay__selected,.CalendarDay__selected:active,.CalendarDay__selected:hover{background:", ";border:1px solid ", ";}.DayPickerKeyboardShortcuts_show__bottomRight{border-radius:0 0 3px 0;overflow:hidden;}.DayPickerKeyboardShortcuts_show__topRight{border-radius:0 3px 0 0;overflow:hidden;}.DayPickerKeyboardShortcuts_show__bottomRight:before,.DayPickerKeyboardShortcuts_show__topRight:before{border-right:33px solid ", ";transition:", ";}.DayPickerKeyboardShortcuts_show__bottomRight:hover:before,.DayPickerKeyboardShortcuts_show__topRight:hover:before{border-right:33px solid ", ";}.CalendarDay__selected_span,.CalendarDay__hovered_span,.CalendarDay__hovered_span:active{background:", ";border:1px solid ", ";color:", ";}.CalendarDay__hovered_span:hover,.CalendarDay__default:hover{background:", ";border:1px double ", ";color:", ";}.CalendarDay__selected_span:active,.CalendarDay__selected_span:hover{background:", ";border:1px solid ", ";}.DateInput_fang{margin-top:1px;z-index:", ";}"], function (props) {
   return props.width ? props.width : "110px";
 }, function (props) {
   return props.width ? props.width : "110px";
@@ -139,6 +139,10 @@ var DatePickerContainer = styled.div.withConfig({
   return themeGet("colors.primary30")(props);
 }, function (props) {
   return themeGet("colors.primary")(props);
+}, function (props) {
+  return "".concat(themeGet("radii.2")(props), " 0 0 ").concat(themeGet("radii.2")(props));
+}, function (props) {
+  return "0 ".concat(themeGet("radii.2")(props), " ").concat(themeGet("radii.2")(props), " 0");
 }, function (props) {
   return themeGet("colors.greyDarkest")(props);
 }, function (props) {

package/es/components/Popover/index.js

@@ -66,6 +66,10 @@ var Text = styled.div.withConfig({
   var direction = _ref.direction;
   return direction === "top" ? css(["left:50%;top:auto;bottom:100%;transform:translateX(-50%) translateY(-10px);&:before{left:50%;top:auto;margin-top:0;bottom:-9px;margin-left:-3px;transform:rotate(-90deg);}&:after{left:50%;top:auto;margin-top:0;bottom:-10px;margin-left:-3px;transform:rotate(-90deg);}"]) : direction === "topRight" ? css(["left:100%;top:auto;bottom:100%;transform:translateX(5px) translateY(-5px);&:before{left:0;top:auto;margin-top:0;bottom:-5px;margin-left:-5px;transform:rotate(-45deg);border-width:5px 10px 5px 0;}&:after{left:0;top:auto;margin-top:0;bottom:-6px;margin-left:-6px;transform:rotate(-45deg);border-width:5px 10px 5px 0;}"]) : direction === "right" ? css([""]) : direction === "bottomRight" ? css(["left:100%;top:100%;bottom:auto;transform:translateX(5px) translateY(5px);&:before{left:0;bottom:auto;margin-top:0;top:-5px;margin-left:-5px;transform:rotate(45deg);border-width:5px 10px 5px 0;}&:after{left:0;bottom:auto;margin-top:0;top:-6px;margin-left:-6px;transform:rotate(45deg);border-width:5px 10px 5px 0;}"]) : direction === "bottom" ? css(["left:50%;top:100%;transform:translateX(-50%) translateY(10px);&:before{left:50%;top:-9px;margin-top:0;margin-left:-3px;transform:rotate(90deg);}&:after{left:50%;top:-10px;margin-top:0;margin-left:-3px;transform:rotate(90deg);}"]) : direction === "bottomLeft" ? css(["right:100%;left:auto;top:100%;bottom:auto;transform:translateX(-5px) translateY(5px);&:before{right:0;left:auto;bottom:auto;margin-top:0;top:-5px;margin-right:-5px;transform:rotate(135deg);border-width:5px 10px 5px 0;}&:after{right:0;left:auto;bottom:auto;margin-top:0;top:-6px;margin-right:-6px;transform:rotate(135deg);border-width:5px 10px 5px 0;}"]) : direction === "left" ? css(["left:auto;right:100%;transform:translateX(-10px) translateY(-50%);&:before{left:auto;right:-6px;transform:rotate(180deg);}&:after{left:auto;right:-7px;transform:rotate(180deg);top:50%;margin-top:-6px;}"]) : direction === "topLeft" ? css(["right:100%;left:auto;top:auto;bottom:100%;transform:translateX(-5px) translateY(-5px);&:before{right:0;left:auto;top:auto;margin-top:0;bottom:-5px;margin-right:-5px;transform:rotate(225deg);border-width:5px 10px 5px 0;}&:after{right:0;left:auto;top:auto;margin-top:0;bottom:-6px;margin-right:-6px;transform:rotate(225deg);border-width:5px 10px 5px 0;}"]) : css([""]);
 });
+var HoverSpacer = styled.div.withConfig({
+  displayName: "Popover__HoverSpacer",
+  componentId: "sc-1bwoak-3"
+})(["position:absolute;background:transparent;height:calc(100% + 24px);width:calc(100% + 24px);left:-12px;top:-12px;"]);
 
 /**
  * This popover component is intended to be used to supplement buttons (or other elements) that require some helper text. It supports customisation of direction and width. This is so that you can ensure that the popover doesn't run off the screen, and that the width suits the amount of text in the popover.
@@ -143,7 +147,9 @@ export default function Popover(_ref2) {
     width: width,
     enableSelectAll: enableSelectAll,
     id: toolTipId
-  }, text), children);
+  }, /*#__PURE__*/React.createElement(HoverSpacer, {
+    className: "popoverSpacer"
+  }), text), children);
   return theme ? /*#__PURE__*/React.createElement(ThemeProvider, {
     theme: theme
   }, component) : component;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "orcs-design-system",
-  "version": "3.1.37",
+  "version": "3.1.39",
   "engines": {
     "node": "18.17.1"
   },
@@ -148,7 +148,8 @@
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "eslint-plugin-testing-library": "^5.11.1",
-    "typescript": "5.2.2"
+    "typescript": "5.2.2",
+    "webpack-dev-middleware": "6.1.2"
   },
   "browserslist": {
     "development": [