@vitality-ds/components 4.0.5 → 4.0.6-alpha.4

package/dist/Input/DateRangePicker/index.js

@@ -7,9 +7,9 @@ Object.defineProperty(exports, "__esModule", {
 exports["default"] = void 0;
 var _icons = require("@vitality-ds/icons");
 var _react = _interopRequireDefault(require("react"));
-var _Button = _interopRequireDefault(require("../../Button"));
 var _DropdownMenu = _interopRequireDefault(require("../../DropdownMenu"));
-var _FormFieldLabel = _interopRequireDefault(require("../../Form/FormField/components/FormFieldLabel"));
+var _Flex = _interopRequireDefault(require("../../Flex"));
+var _IconButton = _interopRequireDefault(require("../../IconButton"));
 var _DatePicker = _interopRequireDefault(require("../DatePicker"));
 var _constants = _interopRequireDefault(require("./constants"));
 var _useDateRangePicker2 = _interopRequireDefault(require("./hooks/useDateRangePicker"));
@@ -54,11 +54,13 @@ var DateRangePicker = /*#__PURE__*/_react["default"].forwardRef(function (_ref,
   });
   return /*#__PURE__*/_react["default"].createElement(_styled.BaseDateRangePicker, {
     ref: forwardedRef
-  }, /*#__PURE__*/_react["default"].createElement(_styled.DatePickerContainer, null, /*#__PURE__*/_react["default"].createElement(_styled.DateContainer, null, /*#__PURE__*/_react["default"].createElement(_FormFieldLabel["default"], {
-    id: "".concat(id, "_start_date"),
-    fieldType: "text",
-    content: fromLabel
-  }), /*#__PURE__*/_react["default"].createElement(_DatePicker["default"], {
+  }, /*#__PURE__*/_react["default"].createElement(_styled.DatePickerContainer, null, /*#__PURE__*/_react["default"].createElement(_Flex["default"], {
+    direction: "row",
+    wrap: "wrap",
+    spacing: "none"
+  }, /*#__PURE__*/_react["default"].createElement(_styled.DateContainer, null, /*#__PURE__*/_react["default"].createElement(_styled.BaseDateRangePickerLabel, {
+    id: "".concat(id, "_start_date")
+  }, fromLabel), /*#__PURE__*/_react["default"].createElement(_DatePicker["default"], {
     disabled: disabled,
     hasError: hasError,
     showFirstDateInRangeOnOpen: true,
@@ -72,11 +74,9 @@ var DateRangePicker = /*#__PURE__*/_react["default"].forwardRef(function (_ref,
       return inputRef.current.children[0].children[0].children[0].focus();
     },
     name: "".concat(name, "_start_date")
-  })), /*#__PURE__*/_react["default"].createElement(_styled.DateContainer, null, /*#__PURE__*/_react["default"].createElement(_FormFieldLabel["default"], {
-    id: "".concat(id, "_end_date"),
-    fieldType: "text",
-    content: toLabel
-  }), /*#__PURE__*/_react["default"].createElement(_DatePicker["default"], {
+  })), /*#__PURE__*/_react["default"].createElement(_styled.DateContainer, null, /*#__PURE__*/_react["default"].createElement(_styled.BaseDateRangePickerLabel, {
+    id: "".concat(id, "_end_date")
+  }, toLabel), /*#__PURE__*/_react["default"].createElement(_DatePicker["default"], {
     ref: inputRef,
     disabled: disabled,
     hasError: hasError,
@@ -87,13 +87,15 @@ var DateRangePicker = /*#__PURE__*/_react["default"].forwardRef(function (_ref,
     calendarValue: calendarValue,
     id: "".concat(id, "_end_date"),
     name: "".concat(name, "_end_date")
-  }))), /*#__PURE__*/_react["default"].createElement(_styled.ExtrasContainer, null, /*#__PURE__*/_react["default"].createElement(_Button["default"], {
+  }))), /*#__PURE__*/_react["default"].createElement(_styled.ExtrasContainer, null, /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+    tooltipContent: "Clear",
     disabled: disabled,
     onClick: function onClick() {
       return handleClearButtonClick();
     },
-    appearance: "ghost"
-  }, "Clear"), showPresets && /*#__PURE__*/_react["default"].createElement(_DropdownMenu["default"], {
+    icon: /*#__PURE__*/_react["default"].createElement(_icons.Close, null),
+    size: "compact"
+  }), showPresets && /*#__PURE__*/_react["default"].createElement(_DropdownMenu["default"], {
     disabled: disabled,
     trigger: {
       type: "iconButton",
@@ -105,7 +107,7 @@ var DateRangePicker = /*#__PURE__*/_react["default"].forwardRef(function (_ref,
     },
     items: itemsArray,
     preferredAlignment: "center"
-  })));
+  }))));
 });
 DateRangePicker.displayName = "DateRangePicker";
 var _default = exports["default"] = DateRangePicker;

package/dist/Input/DateRangePicker/styled.js

@@ -4,13 +4,15 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.ExtrasContainer = exports.DatePickerContainer = exports.DateContainer = exports.BaseDateRangePicker = void 0;
+exports.ExtrasContainer = exports.DatePickerContainer = exports.DateContainer = exports.BaseDateRangePickerLabel = exports.BaseDateRangePicker = void 0;
 var _system = require("@vitality-ds/system");
+var _styled = require("../../Form/Label/styled");
 var _BaseDateRangePicker = _interopRequireDefault(require("./styles/BaseDateRangePicker.styles"));
+var _BaseDateRangePickerLabel = _interopRequireDefault(require("./styles/BaseDateRangePickerLabel.styles"));
 var _DateContainer = _interopRequireDefault(require("./styles/DateContainer.styles"));
 var _DatePickerContainer = _interopRequireDefault(require("./styles/DatePickerContainer.styles"));
 var _ExtrasContainers = _interopRequireDefault(require("./styles/ExtrasContainers"));
-// eslint-disable-next-line import/prefer-default-export
+var BaseDateRangePickerLabel = exports.BaseDateRangePickerLabel = (0, _system.styled)(_styled.BaseLabel, _BaseDateRangePickerLabel["default"]);
 var BaseDateRangePicker = exports.BaseDateRangePicker = (0, _system.styled)("div", _BaseDateRangePicker["default"]);
 var DateContainer = exports.DateContainer = (0, _system.styled)("div", _DateContainer["default"]);
 var DatePickerContainer = exports.DatePickerContainer = (0, _system.styled)("div", _DatePickerContainer["default"]);

package/dist/Input/DateRangePicker/styles/BaseDateRangePickerLabel.styles.js

@@ -0,0 +1,10 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _system = require("@vitality-ds/system");
+var _default = exports["default"] = (0, _system.css)({
+  flexShrink: 0
+});

package/dist/Input/DateRangePicker/styles/DateContainer.styles.js

@@ -1,12 +1,29 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _system = require("@vitality-ds/system");
-var _default = exports["default"] = (0, _system.css)({
+var _styled = require("../../TextInput/styled");
+var borders = _system.colorUseCases.borders;
+var _default = exports["default"] = (0, _system.css)((0, _defineProperty2["default"])({
   display: "flex",
-  gap: "$xs",
-  flexDirection: "column"
-});
+  gap: "$sm",
+  flex: 1,
+  alignItems: "center",
+  overflow: "visible",
+  marginRight: "$sm",
+  borderRight: "1px solid ".concat((0, _system.getColorScaleValueByUseCase)("neutral", borders.uiElement)),
+  minWidth: 155,
+  "& >:not(label)": {
+    width: "100%"
+  }
+}, "".concat(_styled.BaseInputWrapper), {
+  borderColor: "transparent",
+  backgroundColor: "transparent",
+  paddingLeft: 0,
+  minWidth: 130
+}));

package/dist/Input/DateRangePicker/styles/DatePickerContainer.styles.js

@@ -5,7 +5,17 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports["default"] = void 0;
 var _system = require("@vitality-ds/system");
+var borders = _system.colorUseCases.borders,
+  backgrounds = _system.colorUseCases.backgrounds;
 var _default = exports["default"] = (0, _system.css)({
   display: "flex",
-  gap: "$lg"
+  gap: "$sm",
+  paddingLeft: "$md",
+  paddingRight: "$sm",
+  border: "1px solid ".concat((0, _system.getColorScaleValueByUseCase)("neutral", borders.uiElement)),
+  borderRadius: "$default",
+  backgroundColor: (0, _system.getColorScaleValueByUseCase)("neutral", backgrounds.app),
+  "&:hover": {
+    borderColor: (0, _system.getColorScaleValueByUseCase)("neutral", borders.uiElement_hovered)
+  }
 });

package/dist/Input/DateRangePicker/styles/ExtrasContainers.js

@@ -6,7 +6,5 @@ Object.defineProperty(exports, "__esModule", {
 exports["default"] = void 0;
 var _system = require("@vitality-ds/system");
 var _default = exports["default"] = (0, _system.css)({
-  display: "flex",
-  gap: "$sm",
-  alignItems: "baseline"
+  display: "flex"
 });

package/dist/components/src/Input/DateRangePicker/constants.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../../../src/Input/DateRangePicker/constants.ts"],"names":[],"mappings":"AASA,QAAA,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAyEV,CAAC;AAEX,eAAe,cAAc,CAAC"}
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../../../src/Input/DateRangePicker/constants.ts"],"names":[],"mappings":"AAQA,QAAA,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAyEV,CAAC;AAEX,eAAe,cAAc,CAAC"}

package/dist/components/src/Input/DateRangePicker/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../../../../src/Input/DateRangePicker/constants.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../../../../src/Input/DateRangePicker/constants.ts"],"names":[],"mappings":"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"}

package/dist/components/src/Input/DateRangePicker/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/Input/DateRangePicker/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAgB1B,QAAA,MAAM,eAAe;;;;;;;;;;;;;;wCA8GpB,CAAC;AAGF,eAAe,eAAe,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/Input/DateRangePicker/index.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAiB1B,QAAA,MAAM,eAAe;;;;;;;;;;;;;;wCA4GpB,CAAC;AAGF,eAAe,eAAe,CAAC"}

package/dist/components/src/Input/DateRangePicker/index.js

@@ -5,9 +5,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 var icons_1 = require("@vitality-ds/icons");
 var react_1 = __importDefault(require("react"));
-var Button_1 = __importDefault(require("../../Button"));
 var DropdownMenu_1 = __importDefault(require("../../DropdownMenu"));
-var FormFieldLabel_1 = __importDefault(require("../../Form/FormField/components/FormFieldLabel"));
+var Flex_1 = __importDefault(require("../../Flex"));
+var IconButton_1 = __importDefault(require("../../IconButton"));
 var DatePicker_1 = __importDefault(require("../DatePicker"));
 var constants_1 = __importDefault(require("./constants"));
 var useDateRangePicker_1 = __importDefault(require("./hooks/useDateRangePicker"));
@@ -24,24 +24,25 @@ var DateRangePicker = react_1.default.forwardRef(function (_a, forwardedRef) {
     }); });
     return (react_1.default.createElement(styled_1.BaseDateRangePicker, { ref: forwardedRef },
         react_1.default.createElement(styled_1.DatePickerContainer, null,
-            react_1.default.createElement(styled_1.DateContainer, null,
-                react_1.default.createElement(FormFieldLabel_1.default, { id: id + "_start_date", fieldType: "text", content: fromLabel }),
-                react_1.default.createElement(DatePicker_1.default, { disabled: disabled, hasError: hasError, showFirstDateInRangeOnOpen: true, minYear: minYear && minYear, maxYear: maxYear && maxYear, onChange: handleNewStartDate, value: selectedValue.startDate, calendarValue: calendarValue.length === 1 ? calendarValue[0] : calendarValue, id: id + "_start_date", onSelectedDateChange: function () {
-                        return inputRef.current.children[0].children[0].children[0].focus();
-                    }, name: name + "_start_date" })),
-            react_1.default.createElement(styled_1.DateContainer, null,
-                react_1.default.createElement(FormFieldLabel_1.default, { id: id + "_end_date", fieldType: "text", content: toLabel }),
-                react_1.default.createElement(DatePicker_1.default, { ref: inputRef, disabled: disabled, hasError: hasError, minYear: minYear && minYear, maxYear: maxYear && maxYear, value: selectedValue.endDate, onChange: handleNewEndDate, calendarValue: calendarValue, id: id + "_end_date", name: name + "_end_date" }))),
-        react_1.default.createElement(styled_1.ExtrasContainer, null,
-            react_1.default.createElement(Button_1.default, { disabled: disabled, onClick: function () { return handleClearButtonClick(); }, appearance: "ghost" }, "Clear"),
-            showPresets && (react_1.default.createElement(DropdownMenu_1.default, { disabled: disabled, trigger: {
-                    type: "iconButton",
-                    props: {
-                        icon: react_1.default.createElement(icons_1.MenuMoreVertical, null),
-                        tooltipContent: "Preset Ranges",
-                        size: "compact",
-                    },
-                }, items: itemsArray, preferredAlignment: "center" })))));
+            react_1.default.createElement(Flex_1.default, { direction: "row", wrap: "wrap", spacing: "none" },
+                react_1.default.createElement(styled_1.DateContainer, null,
+                    react_1.default.createElement(styled_1.BaseDateRangePickerLabel, { id: id + "_start_date" }, fromLabel),
+                    react_1.default.createElement(DatePicker_1.default, { disabled: disabled, hasError: hasError, showFirstDateInRangeOnOpen: true, minYear: minYear && minYear, maxYear: maxYear && maxYear, onChange: handleNewStartDate, value: selectedValue.startDate, calendarValue: calendarValue.length === 1 ? calendarValue[0] : calendarValue, id: id + "_start_date", onSelectedDateChange: function () {
+                            return inputRef.current.children[0].children[0].children[0].focus();
+                        }, name: name + "_start_date" })),
+                react_1.default.createElement(styled_1.DateContainer, null,
+                    react_1.default.createElement(styled_1.BaseDateRangePickerLabel, { id: id + "_end_date" }, toLabel),
+                    react_1.default.createElement(DatePicker_1.default, { ref: inputRef, disabled: disabled, hasError: hasError, minYear: minYear && minYear, maxYear: maxYear && maxYear, value: selectedValue.endDate, onChange: handleNewEndDate, calendarValue: calendarValue, id: id + "_end_date", name: name + "_end_date" }))),
+            react_1.default.createElement(styled_1.ExtrasContainer, null,
+                react_1.default.createElement(IconButton_1.default, { tooltipContent: "Clear", disabled: disabled, onClick: function () { return handleClearButtonClick(); }, icon: react_1.default.createElement(icons_1.Close, null), size: "compact" }),
+                showPresets && (react_1.default.createElement(DropdownMenu_1.default, { disabled: disabled, trigger: {
+                        type: "iconButton",
+                        props: {
+                            icon: react_1.default.createElement(icons_1.MenuMoreVertical, null),
+                            tooltipContent: "Preset Ranges",
+                            size: "compact",
+                        },
+                    }, items: itemsArray, preferredAlignment: "center" }))))));
 });
 DateRangePicker.displayName = "DateRangePicker";
 exports.default = DateRangePicker;

package/dist/components/src/Input/DateRangePicker/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/Input/DateRangePicker/index.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/Input/DateRangePicker/index.tsx"],"names":[],"mappings":"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"}