@dhis2-ui/calendar 10.5.1 → 10.6.0

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.
Files changed (5) hide show
  1. package/build/cjs/calendar/calendar-container.js +6 -7
  2. package/build/cjs/calendar-input/calendar-input.js +2 -3
  3. package/build/es/calendar/calendar-container.js +7 -8
  4. package/build/es/calendar-input/calendar-input.js +2 -3
  5. package/package.json +8 -8
package/build/cjs/calendar/calendar-container.js CHANGED
@@ -13,7 +13,6 @@ var _navigationContainer = require("./navigation-container.js");
13
13
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
14
14
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
15
15
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
16
- const wrapperBorderColor = _uiConstants.colors.grey300;
17
16
  const backgroundColor = 'none';
18
17
  const CalendarContainer = exports.CalendarContainer = /*#__PURE__*/_react.default.memo(function CalendarContainer(_ref) {
19
18
  let {
@@ -51,14 +50,14 @@ const CalendarContainer = exports.CalendarContainer = /*#__PURE__*/_react.defaul
51
50
  };
52
51
  }, [currMonth, currYear, languageDirection, nextMonth, nextYear, prevMonth, prevYear, navigateToYear, navigateToMonth, months, years]);
53
52
  return /*#__PURE__*/_react.default.createElement("div", {
54
- className: _style.default.dynamic([["2823859047", [backgroundColor, wrapperBorderColor, width]]])
53
+ className: _style.default.dynamic([["1500576791", [backgroundColor, width, _uiConstants.elevations.popover]]])
55
54
  }, /*#__PURE__*/_react.default.createElement("div", {
56
55
  dir: languageDirection,
57
56
  "data-test": "calendar",
58
- className: _style.default.dynamic([["2823859047", [backgroundColor, wrapperBorderColor, width]]]) + " " + "calendar-wrapper"
57
+ className: _style.default.dynamic([["1500576791", [backgroundColor, width, _uiConstants.elevations.popover]]]) + " " + "calendar-wrapper"
59
58
  }, /*#__PURE__*/_react.default.createElement("div", {
60
59
  ref: calendarRef,
61
- className: _style.default.dynamic([["2823859047", [backgroundColor, wrapperBorderColor, width]]])
60
+ className: _style.default.dynamic([["1500576791", [backgroundColor, width, _uiConstants.elevations.popover]]])
62
61
  }, /*#__PURE__*/_react.default.createElement(_navigationContainer.NavigationContainer, navigationProps), /*#__PURE__*/_react.default.createElement(_calendarTable.CalendarTable, {
63
62
  selectedDate: date,
64
63
  calendarWeekDays: calendarWeekDays,
@@ -66,9 +65,9 @@ const CalendarContainer = exports.CalendarContainer = /*#__PURE__*/_react.defaul
66
65
  cellSize: cellSize,
67
66
  width: width
68
67
  }))), /*#__PURE__*/_react.default.createElement(_style.default, {
69
- id: "2823859047",
70
- dynamic: [backgroundColor, wrapperBorderColor, width]
71
- }, [`.calendar-wrapper.__jsx-style-dynamic-selector{font-family:Roboto,sans-serif;font-weight:400;font-size:14px;background-color:${backgroundColor};display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;border:1px solid ${wrapperBorderColor};border-radius:3px;min-width:${width};width:-webkit-max-content;width:-moz-max-content;width:max-content;box-shadow:0px 4px 6px -2px #2129340d;box-shadow:0px 10px 15px -3px #2129341a;}`]));
68
+ id: "1500576791",
69
+ dynamic: [backgroundColor, width, _uiConstants.elevations.popover]
70
+ }, [`.calendar-wrapper.__jsx-style-dynamic-selector{font-family:Roboto,sans-serif;font-weight:400;font-size:14px;background-color:${backgroundColor};display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;border-radius:3px;min-width:${width};width:-webkit-max-content;width:-moz-max-content;width:max-content;box-shadow:${_uiConstants.elevations.popover};}`]));
72
71
  });
73
72
  CalendarContainer.propTypes = {
74
73
  /** the currently selected date using an iso-like format YYYY-MM-DD, in the calendar system provided (not iso8601) */
package/build/cjs/calendar-input/calendar-input.js CHANGED
@@ -7,7 +7,6 @@ exports.CalendarInput = void 0;
7
7
  var _style = _interopRequireDefault(require("styled-jsx/style"));
8
8
  var _multiCalendarDates = require("@dhis2/multi-calendar-dates");
9
9
  var _button = require("@dhis2-ui/button");
10
- var _card = require("@dhis2-ui/card");
11
10
  var _input = require("@dhis2-ui/input");
12
11
  var _layer = require("@dhis2-ui/layer");
13
12
  var _popper = require("@dhis2-ui/popper");
@@ -158,9 +157,9 @@ const CalendarInput = function () {
158
157
  reference: ref,
159
158
  placement: "bottom-start",
160
159
  modifiers: [offsetModifier]
161
- }, /*#__PURE__*/_react.default.createElement(_card.Card, null, /*#__PURE__*/_react.default.createElement(_calendarContainer.CalendarContainer, _extends({}, calendarProps, {
160
+ }, /*#__PURE__*/_react.default.createElement(_calendarContainer.CalendarContainer, _extends({}, calendarProps, {
162
161
  calendarRef: calendarRef
163
- }))))), /*#__PURE__*/_react.default.createElement(_style.default, {
162
+ })))), /*#__PURE__*/_react.default.createElement(_style.default, {
164
163
  id: "423137534",
165
164
  dynamic: [inputWidth, rest.error || rest.warning ? '36px' : '6px']
166
165
  }, [`.calendar-input-wrapper.__jsx-style-dynamic-selector{position:relative;width:${inputWidth};}`, `.calendar-clear-button.__jsx-style-dynamic-selector{position:absolute;inset-inline-end:${rest.error || rest.warning ? '36px' : '6px'};-webkit-inset-block-start:27px;-ms-intb-rlock-start:27px;inset-block-start:27px;}`, ".calendar-clear-button.with-icon.__jsx-style-dynamic-selector{inset-inline-end:36px;}", ".calendar-clear-button.with-dense-wrapper.__jsx-style-dynamic-selector{-webkit-inset-block-start:23px;-ms-intb-rlock-start:23px;inset-block-start:23px;}"]));
package/build/es/calendar/calendar-container.js CHANGED
@@ -1,10 +1,9 @@
1
1
  import _JSXStyle from "styled-jsx/style";
2
- import { colors } from '@dhis2/ui-constants';
2
+ import { elevations } from '@dhis2/ui-constants';
3
3
  import PropTypes from 'prop-types';
4
4
  import React, { useMemo } from 'react';
5
5
  import { CalendarTable, CalendarTableProps } from './calendar-table.js';
6
6
  import { NavigationContainer, NavigationContainerProps } from './navigation-container.js';
7
- const wrapperBorderColor = colors.grey300;
8
7
  const backgroundColor = 'none';
9
8
  export const CalendarContainer = /*#__PURE__*/React.memo(function CalendarContainer(_ref) {
10
9
  let {
@@ -42,14 +41,14 @@ export const CalendarContainer = /*#__PURE__*/React.memo(function CalendarContai
42
41
  };
43
42
  }, [currMonth, currYear, languageDirection, nextMonth, nextYear, prevMonth, prevYear, navigateToYear, navigateToMonth, months, years]);
44
43
  return /*#__PURE__*/React.createElement("div", {
45
- className: _JSXStyle.dynamic([["2823859047", [backgroundColor, wrapperBorderColor, width]]])
44
+ className: _JSXStyle.dynamic([["1500576791", [backgroundColor, width, elevations.popover]]])
46
45
  }, /*#__PURE__*/React.createElement("div", {
47
46
  dir: languageDirection,
48
47
  "data-test": "calendar",
49
- className: _JSXStyle.dynamic([["2823859047", [backgroundColor, wrapperBorderColor, width]]]) + " " + "calendar-wrapper"
48
+ className: _JSXStyle.dynamic([["1500576791", [backgroundColor, width, elevations.popover]]]) + " " + "calendar-wrapper"
50
49
  }, /*#__PURE__*/React.createElement("div", {
51
50
  ref: calendarRef,
52
- className: _JSXStyle.dynamic([["2823859047", [backgroundColor, wrapperBorderColor, width]]])
51
+ className: _JSXStyle.dynamic([["1500576791", [backgroundColor, width, elevations.popover]]])
53
52
  }, /*#__PURE__*/React.createElement(NavigationContainer, navigationProps), /*#__PURE__*/React.createElement(CalendarTable, {
54
53
  selectedDate: date,
55
54
  calendarWeekDays: calendarWeekDays,
@@ -57,9 +56,9 @@ export const CalendarContainer = /*#__PURE__*/React.memo(function CalendarContai
57
56
  cellSize: cellSize,
58
57
  width: width
59
58
  }))), /*#__PURE__*/React.createElement(_JSXStyle, {
60
- id: "2823859047",
61
- dynamic: [backgroundColor, wrapperBorderColor, width]
62
- }, [`.calendar-wrapper.__jsx-style-dynamic-selector{font-family:Roboto,sans-serif;font-weight:400;font-size:14px;background-color:${backgroundColor};display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;border:1px solid ${wrapperBorderColor};border-radius:3px;min-width:${width};width:-webkit-max-content;width:-moz-max-content;width:max-content;box-shadow:0px 4px 6px -2px #2129340d;box-shadow:0px 10px 15px -3px #2129341a;}`]));
59
+ id: "1500576791",
60
+ dynamic: [backgroundColor, width, elevations.popover]
61
+ }, [`.calendar-wrapper.__jsx-style-dynamic-selector{font-family:Roboto,sans-serif;font-weight:400;font-size:14px;background-color:${backgroundColor};display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;border-radius:3px;min-width:${width};width:-webkit-max-content;width:-moz-max-content;width:max-content;box-shadow:${elevations.popover};}`]));
63
62
  });
64
63
  CalendarContainer.propTypes = {
65
64
  /** the currently selected date using an iso-like format YYYY-MM-DD, in the calendar system provided (not iso8601) */
package/build/es/calendar-input/calendar-input.js CHANGED
@@ -2,7 +2,6 @@ import _JSXStyle from "styled-jsx/style";
2
2
  function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
3
3
  import { useDatePicker, useResolvedDirection, validateDateString } from '@dhis2/multi-calendar-dates';
4
4
  import { Button } from '@dhis2-ui/button';
5
- import { Card } from '@dhis2-ui/card';
6
5
  import { InputField } from '@dhis2-ui/input';
7
6
  import { Layer } from '@dhis2-ui/layer';
8
7
  import { Popper } from '@dhis2-ui/popper';
@@ -149,9 +148,9 @@ export const CalendarInput = function () {
149
148
  reference: ref,
150
149
  placement: "bottom-start",
151
150
  modifiers: [offsetModifier]
152
- }, /*#__PURE__*/React.createElement(Card, null, /*#__PURE__*/React.createElement(CalendarContainer, _extends({}, calendarProps, {
151
+ }, /*#__PURE__*/React.createElement(CalendarContainer, _extends({}, calendarProps, {
153
152
  calendarRef: calendarRef
154
- }))))), /*#__PURE__*/React.createElement(_JSXStyle, {
153
+ })))), /*#__PURE__*/React.createElement(_JSXStyle, {
155
154
  id: "423137534",
156
155
  dynamic: [inputWidth, rest.error || rest.warning ? '36px' : '6px']
157
156
  }, [`.calendar-input-wrapper.__jsx-style-dynamic-selector{position:relative;width:${inputWidth};}`, `.calendar-clear-button.__jsx-style-dynamic-selector{position:absolute;inset-inline-end:${rest.error || rest.warning ? '36px' : '6px'};-webkit-inset-block-start:27px;-ms-intb-rlock-start:27px;inset-block-start:27px;}`, ".calendar-clear-button.with-icon.__jsx-style-dynamic-selector{inset-inline-end:36px;}", ".calendar-clear-button.with-dense-wrapper.__jsx-style-dynamic-selector{-webkit-inset-block-start:23px;-ms-intb-rlock-start:23px;inset-block-start:23px;}"]));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@dhis2-ui/calendar",
3
- "version": "10.5.1",
3
+ "version": "10.6.0",
4
4
  "description": "UI Calendar",
5
5
  "repository": {
6
6
  "type": "git",
@@ -33,15 +33,15 @@
33
33
  "styled-jsx": "^4"
34
34
  },
35
35
  "dependencies": {
36
- "@dhis2-ui/button": "10.5.1",
37
- "@dhis2-ui/card": "10.5.1",
38
- "@dhis2-ui/input": "10.5.1",
39
- "@dhis2-ui/layer": "10.5.1",
40
- "@dhis2-ui/popper": "10.5.1",
36
+ "@dhis2-ui/button": "10.6.0",
37
+ "@dhis2-ui/card": "10.6.0",
38
+ "@dhis2-ui/input": "10.6.0",
39
+ "@dhis2-ui/layer": "10.6.0",
40
+ "@dhis2-ui/popper": "10.6.0",
41
41
  "@dhis2/multi-calendar-dates": "2.1.0",
42
42
  "@dhis2/prop-types": "^3.1.2",
43
- "@dhis2/ui-constants": "10.5.1",
44
- "@dhis2/ui-icons": "10.5.1",
43
+ "@dhis2/ui-constants": "10.6.0",
44
+ "@dhis2/ui-icons": "10.6.0",
45
45
  "classnames": "^2.3.1",
46
46
  "prop-types": "^15.7.2"
47
47
  },