@onesy/ui-react 1.0.186 → 1.0.188

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.
@@ -40,6 +40,7 @@ export declare type ICalendarMonth = Omit<ILine, 'onChange'> & {
40
40
  dayNamesFull?: boolean;
41
41
  valid?: (value: OnesyDate, version: 'day' | 'month' | 'year') => boolean;
42
42
  renderDay?: (value: OnesyDate, props: any, day: any, outside: boolean) => React.ReactNode;
43
+ renderDayValue?: (value: number, date: OnesyDate, day: any) => any;
43
44
  renderDayName?: (order: number) => any;
44
45
  DayNameProps?: IPropsAny;
45
46
  PaginationItemProps?: IPropsAny;
@@ -52,6 +53,7 @@ export interface IDay {
52
53
  dayWeek: number;
53
54
  weekend: boolean;
54
55
  today: boolean;
56
+ future: boolean;
55
57
  is: {
56
58
  start: boolean;
57
59
  between: boolean;
@@ -19,7 +19,7 @@ var _Transitions = _interopRequireDefault(require("../Transitions"));
19
19
  var _Transition = _interopRequireDefault(require("../Transition"));
20
20
  var _utils2 = require("../utils");
21
21
  var _jsxRuntime = require("react/jsx-runtime");
22
- const _excluded = ["tonal", "color", "size", "value", "valueDefault", "onChange", "calendar", "calendarDefault", "onChangeCalendar", "colorSelected", "selected", "onTimeClick", "range", "offset", "outside", "weekStartDay", "now", "min", "max", "validate", "labels", "dayNamesFull", "noTransition", "valid", "renderDay", "renderDayName", "disabled", "DayNameProps", "PaginationItemProps", "TransitionProps", "TransitionsProps", "className"];
22
+ const _excluded = ["tonal", "color", "size", "value", "valueDefault", "onChange", "calendar", "calendarDefault", "onChangeCalendar", "colorSelected", "selected", "onTimeClick", "range", "offset", "outside", "weekStartDay", "now", "min", "max", "validate", "labels", "dayNamesFull", "noTransition", "valid", "renderDay", "renderDayValue", "renderDayName", "disabled", "DayNameProps", "PaginationItemProps", "TransitionProps", "TransitionsProps", "className"];
23
23
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
24
24
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
25
25
  const useStyle = (0, _styleReact.style)(theme => ({
@@ -191,6 +191,7 @@ const useStyle = (0, _styleReact.style)(theme => ({
191
191
  }
192
192
  },
193
193
  dayValue: {
194
+ position: 'relative',
194
195
  zIndex: 1,
195
196
  '&:hover': {
196
197
  boxShadow: 'inset 0px 0px 0px 1px currentColor !important'
@@ -240,6 +241,7 @@ const CalendarMonth = props__ => {
240
241
  noTransition = true,
241
242
  valid: valid_,
242
243
  renderDay,
244
+ renderDayValue,
243
245
  renderDayName,
244
246
  disabled,
245
247
  DayNameProps,
@@ -464,6 +466,7 @@ const CalendarMonth = props__ => {
464
466
  };
465
467
  const days = _react.default.useMemo(() => {
466
468
  const items = [];
469
+ const nowDate = new _date.OnesyDate();
467
470
 
468
471
  // Add all month days
469
472
  for (let i_0 = 0; i_0 < month.daysInMonth; i_0++) {
@@ -476,6 +479,7 @@ const CalendarMonth = props__ => {
476
479
  dayWeek: day_0.dayWeek,
477
480
  weekend: [0, 6].includes(day_0.dayWeek),
478
481
  today: day_0.year === monthNow.year && day_0.dayYear === monthNow.dayYear,
482
+ future: day_0.milliseconds > nowDate.milliseconds,
479
483
  is: _objectSpread({}, details),
480
484
  onesyDate: day_0
481
485
  });
@@ -496,6 +500,7 @@ const CalendarMonth = props__ => {
496
500
  dayWeek: day_1.dayWeek,
497
501
  weekend: [0, 6].includes(day_1.dayWeek),
498
502
  today: day_1.year === monthNow.year && day_1.dayYear === monthNow.dayYear,
503
+ future: day_1.milliseconds > nowDate.milliseconds,
499
504
  is: _objectSpread({}, details_0),
500
505
  start: true,
501
506
  onesyDate: day_1
@@ -517,6 +522,7 @@ const CalendarMonth = props__ => {
517
522
  dayWeek: day_2.dayWeek,
518
523
  weekend: [0, 6].includes(day_2.dayWeek),
519
524
  today: day_2.year === monthNow.year && day_2.dayYear === monthNow.dayYear,
525
+ future: day_2.milliseconds > nowDate.milliseconds,
520
526
  is: _objectSpread({}, details_1),
521
527
  end: true,
522
528
  onesyDate: day_2
@@ -616,7 +622,7 @@ const CalendarMonth = props__ => {
616
622
  backgroundColor: `hsl(from var(--onesy-color) h s ${theme.palette.light ? propsDay.disabled ? 40 : 50 : propsDay.disabled ? 60 : 70})`
617
623
  }), PaginationItemProps === null || PaginationItemProps === void 0 ? void 0 : PaginationItemProps.style)
618
624
  }, propsDay), {}, {
619
- children: day_3.value
625
+ children: (0, _utils.is)('function', renderDayValue) ? renderDayValue(day_3.value, day_3.onesyDate, day_3) : day_3.value
620
626
  }))
621
627
  }, index_);
622
628
  })
@@ -71,15 +71,15 @@ const useStyle = (0, _styleReact.style)(theme => ({
71
71
  }),
72
72
  borderRadius: theme.methods.shape.radius.value(4e4, 'px'),
73
73
  '&.entering': {
74
- opacity: theme.palette.visual_contrast.default.opacity.press,
74
+ opacity: theme.palette.visual_contrast.low.opacity.press,
75
75
  transform: 'scale(1)'
76
76
  },
77
77
  '&.entered': {
78
- opacity: theme.palette.visual_contrast.default.opacity.press,
78
+ opacity: theme.palette.visual_contrast.low.opacity.press,
79
79
  transform: 'scale(1)'
80
80
  },
81
81
  '&.exit': {
82
- opacity: theme.palette.visual_contrast.default.opacity.press,
82
+ opacity: theme.palette.visual_contrast.low.opacity.press,
83
83
  transform: 'scale(1)'
84
84
  },
85
85
  '&.exiting': {
@@ -93,16 +93,16 @@ const useStyle = (0, _styleReact.style)(theme => ({
93
93
  }),
94
94
  pulse: {
95
95
  '&.entering': {
96
- opacity: theme.palette.visual_contrast.default.opacity.press,
96
+ opacity: theme.palette.visual_contrast.low.opacity.press,
97
97
  transform: 'scale(0.77)'
98
98
  },
99
99
  '&.entered': {
100
- opacity: theme.palette.visual_contrast.default.opacity.press,
100
+ opacity: theme.palette.visual_contrast.low.opacity.press,
101
101
  transform: 'scale(0.77)',
102
102
  animation: `$pulse 2400ms ${theme.transitions.timing_function.emphasized} 240ms infinite`
103
103
  },
104
104
  '&.exit': {
105
- opacity: theme.palette.visual_contrast.default.opacity.press,
105
+ opacity: theme.palette.visual_contrast.low.opacity.press,
106
106
  transform: 'scale(0.7)'
107
107
  },
108
108
  '&.exiting': {
@@ -122,13 +122,13 @@ const useStyle = (0, _styleReact.style)(theme => ({
122
122
  timing_function: 'standard'
123
123
  }),
124
124
  '&.entering': {
125
- opacity: theme.palette.visual_contrast.default.opacity.press
125
+ opacity: theme.palette.visual_contrast.low.opacity.press
126
126
  },
127
127
  '&.entered': {
128
- opacity: theme.palette.visual_contrast.default.opacity.press
128
+ opacity: theme.palette.visual_contrast.low.opacity.press
129
129
  },
130
130
  '&.exit': {
131
- opacity: theme.palette.visual_contrast.default.opacity.press
131
+ opacity: theme.palette.visual_contrast.low.opacity.press
132
132
  },
133
133
  '&.exiting': {
134
134
  opacity: '0'
@@ -424,7 +424,7 @@ const Interaction = props_ => {
424
424
  children: status => /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
425
425
  className: (0, _styleReact.classNames)([(0, _.staticClassName)('Interaction', theme) && ['onesy-Interaction-border'], classes.border]),
426
426
  style: {
427
- opacity: (status === null || status === void 0 ? void 0 : status.indexOf('enter')) > -1 ? theme.palette.visual_contrast.default.opacity.quaternary : 0,
427
+ opacity: (status === null || status === void 0 ? void 0 : status.indexOf('enter')) > -1 ? theme.palette.visual_contrast.low.opacity.press : 0,
428
428
  transition: (status === null || status === void 0 ? void 0 : status.indexOf('exit')) > -1 ? theme.methods.transitions.make('opacity', {
429
429
  duration: 'complex',
430
430
  timing_function: 'standard'
@@ -1,6 +1,6 @@
1
1
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
2
2
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
3
- const _excluded = ["tonal", "color", "size", "value", "valueDefault", "onChange", "calendar", "calendarDefault", "onChangeCalendar", "colorSelected", "selected", "onTimeClick", "range", "offset", "outside", "weekStartDay", "now", "min", "max", "validate", "labels", "dayNamesFull", "noTransition", "valid", "renderDay", "renderDayName", "disabled", "DayNameProps", "PaginationItemProps", "TransitionProps", "TransitionsProps", "className"];
3
+ const _excluded = ["tonal", "color", "size", "value", "valueDefault", "onChange", "calendar", "calendarDefault", "onChangeCalendar", "colorSelected", "selected", "onTimeClick", "range", "offset", "outside", "weekStartDay", "now", "min", "max", "validate", "labels", "dayNamesFull", "noTransition", "valid", "renderDay", "renderDayValue", "renderDayName", "disabled", "DayNameProps", "PaginationItemProps", "TransitionProps", "TransitionsProps", "className"];
4
4
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
5
5
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
6
6
  import React from 'react';
@@ -184,6 +184,7 @@ const useStyle = style(theme => ({
184
184
  }
185
185
  },
186
186
  dayValue: {
187
+ position: 'relative',
187
188
  zIndex: 1,
188
189
  '&:hover': {
189
190
  boxShadow: 'inset 0px 0px 0px 1px currentColor !important'
@@ -232,6 +233,7 @@ const CalendarMonth = props__ => {
232
233
  noTransition = true,
233
234
  valid: valid_,
234
235
  renderDay,
236
+ renderDayValue,
235
237
  renderDayName,
236
238
  disabled,
237
239
  DayNameProps,
@@ -454,6 +456,7 @@ const CalendarMonth = props__ => {
454
456
  };
455
457
  const days = React.useMemo(() => {
456
458
  const items = [];
459
+ const nowDate = new OnesyDate();
457
460
 
458
461
  // Add all month days
459
462
  for (let i_0 = 0; i_0 < month.daysInMonth; i_0++) {
@@ -466,6 +469,7 @@ const CalendarMonth = props__ => {
466
469
  dayWeek: day_0.dayWeek,
467
470
  weekend: [0, 6].includes(day_0.dayWeek),
468
471
  today: day_0.year === monthNow.year && day_0.dayYear === monthNow.dayYear,
472
+ future: day_0.milliseconds > nowDate.milliseconds,
469
473
  is: _objectSpread({}, details),
470
474
  onesyDate: day_0
471
475
  });
@@ -486,6 +490,7 @@ const CalendarMonth = props__ => {
486
490
  dayWeek: day_1.dayWeek,
487
491
  weekend: [0, 6].includes(day_1.dayWeek),
488
492
  today: day_1.year === monthNow.year && day_1.dayYear === monthNow.dayYear,
493
+ future: day_1.milliseconds > nowDate.milliseconds,
489
494
  is: _objectSpread({}, details_0),
490
495
  start: true,
491
496
  onesyDate: day_1
@@ -507,6 +512,7 @@ const CalendarMonth = props__ => {
507
512
  dayWeek: day_2.dayWeek,
508
513
  weekend: [0, 6].includes(day_2.dayWeek),
509
514
  today: day_2.year === monthNow.year && day_2.dayYear === monthNow.dayYear,
515
+ future: day_2.milliseconds > nowDate.milliseconds,
510
516
  is: _objectSpread({}, details_1),
511
517
  end: true,
512
518
  onesyDate: day_2
@@ -605,7 +611,7 @@ const CalendarMonth = props__ => {
605
611
  backgroundColor: `hsl(from var(--onesy-color) h s ${theme.palette.light ? propsDay.disabled ? 40 : 50 : propsDay.disabled ? 60 : 70})`
606
612
  }), PaginationItemProps?.style)
607
613
  }, propsDay), {}, {
608
- children: day_3.value
614
+ children: is('function', renderDayValue) ? renderDayValue(day_3.value, day_3.onesyDate, day_3) : day_3.value
609
615
  }))
610
616
  }, index_);
611
617
  })
@@ -64,15 +64,15 @@ const useStyle = styleMethod(theme => ({
64
64
  }),
65
65
  borderRadius: theme.methods.shape.radius.value(4e4, 'px'),
66
66
  '&.entering': {
67
- opacity: theme.palette.visual_contrast.default.opacity.press,
67
+ opacity: theme.palette.visual_contrast.low.opacity.press,
68
68
  transform: 'scale(1)'
69
69
  },
70
70
  '&.entered': {
71
- opacity: theme.palette.visual_contrast.default.opacity.press,
71
+ opacity: theme.palette.visual_contrast.low.opacity.press,
72
72
  transform: 'scale(1)'
73
73
  },
74
74
  '&.exit': {
75
- opacity: theme.palette.visual_contrast.default.opacity.press,
75
+ opacity: theme.palette.visual_contrast.low.opacity.press,
76
76
  transform: 'scale(1)'
77
77
  },
78
78
  '&.exiting': {
@@ -86,16 +86,16 @@ const useStyle = styleMethod(theme => ({
86
86
  }),
87
87
  pulse: {
88
88
  '&.entering': {
89
- opacity: theme.palette.visual_contrast.default.opacity.press,
89
+ opacity: theme.palette.visual_contrast.low.opacity.press,
90
90
  transform: 'scale(0.77)'
91
91
  },
92
92
  '&.entered': {
93
- opacity: theme.palette.visual_contrast.default.opacity.press,
93
+ opacity: theme.palette.visual_contrast.low.opacity.press,
94
94
  transform: 'scale(0.77)',
95
95
  animation: `$pulse 2400ms ${theme.transitions.timing_function.emphasized} 240ms infinite`
96
96
  },
97
97
  '&.exit': {
98
- opacity: theme.palette.visual_contrast.default.opacity.press,
98
+ opacity: theme.palette.visual_contrast.low.opacity.press,
99
99
  transform: 'scale(0.7)'
100
100
  },
101
101
  '&.exiting': {
@@ -115,13 +115,13 @@ const useStyle = styleMethod(theme => ({
115
115
  timing_function: 'standard'
116
116
  }),
117
117
  '&.entering': {
118
- opacity: theme.palette.visual_contrast.default.opacity.press
118
+ opacity: theme.palette.visual_contrast.low.opacity.press
119
119
  },
120
120
  '&.entered': {
121
- opacity: theme.palette.visual_contrast.default.opacity.press
121
+ opacity: theme.palette.visual_contrast.low.opacity.press
122
122
  },
123
123
  '&.exit': {
124
- opacity: theme.palette.visual_contrast.default.opacity.press
124
+ opacity: theme.palette.visual_contrast.low.opacity.press
125
125
  },
126
126
  '&.exiting': {
127
127
  opacity: '0'
@@ -413,7 +413,7 @@ const Interaction = props_ => {
413
413
  children: status => /*#__PURE__*/_jsx("span", {
414
414
  className: classNames([staticClassName('Interaction', theme) && ['onesy-Interaction-border'], classes.border]),
415
415
  style: {
416
- opacity: status?.indexOf('enter') > -1 ? theme.palette.visual_contrast.default.opacity.quaternary : 0,
416
+ opacity: status?.indexOf('enter') > -1 ? theme.palette.visual_contrast.low.opacity.press : 0,
417
417
  transition: status?.indexOf('exit') > -1 ? theme.methods.transitions.make('opacity', {
418
418
  duration: 'complex',
419
419
  timing_function: 'standard'
package/esm/index.js CHANGED
@@ -1,4 +1,4 @@
1
- /** @license UiReact v1.0.185
1
+ /** @license UiReact v1.0.187
2
2
  *
3
3
  * This source code is licensed under the MIT license found in the
4
4
  * LICENSE file in the root directory of this source tree.
package/index.js CHANGED
@@ -1,4 +1,4 @@
1
- /** @license UiReact v1.0.185
1
+ /** @license UiReact v1.0.187
2
2
  *
3
3
  * This source code is licensed under the MIT license found in the
4
4
  * LICENSE file in the root directory of this source tree.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@onesy/ui-react",
3
- "version": "1.0.186",
3
+ "version": "1.0.188",
4
4
  "description": "UI for React",
5
5
  "repository": "https://github.com/onesy-me/onesy.git",
6
6
  "author": "Lazar Erić <lazareric1@proton.me>",