diginet-core-ui 1.3.34 → 1.3.35

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 (39) hide show
  1. package/assets/images/menu/dhr/MHRP09N0032.svg +7 -0
  2. package/components/avatar/index.js +19 -19
  3. package/components/badge/index.js +61 -64
  4. package/components/button/icon.js +21 -21
  5. package/components/button/index.js +180 -180
  6. package/components/button/ripple-effect.js +23 -23
  7. package/components/chart/Pie-v2/index.js +40 -42
  8. package/components/chip/index.js +129 -134
  9. package/components/form-control/attachment/index.js +431 -435
  10. package/components/form-control/calendar/function.js +69 -46
  11. package/components/form-control/calendar/index.js +12 -3
  12. package/components/form-control/control/index.js +35 -23
  13. package/components/form-control/date-picker/index.js +36 -36
  14. package/components/form-control/date-range-picker/index.js +84 -86
  15. package/components/form-control/dropdown/index.js +462 -431
  16. package/components/form-control/dropdown-box/index.js +53 -53
  17. package/components/form-control/label/index.js +16 -15
  18. package/components/form-control/money-input/index.js +106 -7
  19. package/components/form-control/radio/index.js +129 -132
  20. package/components/form-control/text-input/index.js +25 -28
  21. package/components/form-control/toggle/index.js +106 -107
  22. package/components/modal/modal.js +43 -46
  23. package/components/popover/index.js +27 -29
  24. package/components/popup/index.js +73 -77
  25. package/components/popup/proposals_popup.js +46 -48
  26. package/components/popup/v2/index.js +108 -110
  27. package/components/progress/circular.js +65 -66
  28. package/components/tab/tab-container.js +32 -14
  29. package/components/tab/tab-header.js +81 -56
  30. package/components/tab/tab-panel.js +46 -17
  31. package/components/tab/tab.js +105 -87
  32. package/components/tooltip/index.js +24 -26
  33. package/components/typography/index.js +10 -10
  34. package/icons/basic.js +148 -27
  35. package/icons/effect.js +26 -26
  36. package/package.json +1 -1
  37. package/readme.md +17 -0
  38. package/theme/settings.js +7 -5
  39. package/utils/number.js +11 -12
package/components/form-control/date-range-picker/index.js CHANGED
@@ -126,25 +126,26 @@ const DateRangePickerV2 = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
126
126
  const confirmText = getGlobal(['confirm']);
127
127
  const unitText = getGlobal([unitCount]);
128
128
  const iconAreaCSS = css`
129
- align-items : center;
130
- color : inherit;
131
- display : flex;
132
- width : 24px;
133
- & span {
134
- padding: 0;
135
- }
136
- .${unique.icon} {
137
- cursor : pointer;
138
- opacity : 0;
139
- transition : display 50ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, opacity 300ms cubic-bezier(0.4, 0, 0.2, 1) 50ms;
140
- display : none;
141
- will-change: display, opacity;
142
- }
143
- .${unique.icon}-accept {
144
- opacity : 1;
145
- display: block;
146
- }
147
- `;
129
+ align-items: center;
130
+ color: inherit;
131
+ display: flex;
132
+ width: 24px;
133
+ & span {
134
+ padding: 0;
135
+ }
136
+ .${unique.icon} {
137
+ cursor: pointer;
138
+ opacity: 0;
139
+ transition: display 50ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,
140
+ opacity 300ms cubic-bezier(0.4, 0, 0.2, 1) 50ms;
141
+ display: none;
142
+ will-change: display, opacity;
143
+ }
144
+ .${unique.icon}-accept {
145
+ opacity: 1;
146
+ display: block;
147
+ }
148
+ `;
148
149
  const hiddenStyle = {
149
150
  opacity: 0,
150
151
  display: 'none'
@@ -155,10 +156,10 @@ const DateRangePickerV2 = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
155
156
  display: 'block'
156
157
  };
157
158
  const controlContainerCSS = css`
158
- display : flex;
159
- justify-content: flex-end;
160
- margin : 0 16px 16px;
161
- `;
159
+ display: flex;
160
+ justify-content: flex-end;
161
+ margin: 0 16px 16px;
162
+ `;
162
163
  const buttonProps = {
163
164
  style: {
164
165
  display: 'none',
@@ -199,60 +200,61 @@ const DateRangePickerV2 = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
199
200
  const pickerCSS = {
200
201
  backGr: 'background-color: transparent; inset: 0px; pointer-events: auto; position: fixed; z-index: 9001;',
201
202
  container: css`
202
- background-color: ${theme.colors.white};
203
- border-radius : ${theme.border.radius};
204
- box-shadow : ${theme.boxShadows.large};
205
- display : flex;
206
- flex-flow : column;
207
- .${unique.wrapper} {
208
- display : flex;
209
- min-width: 633px;
210
- }
211
- .${unique.tooltip} {
212
- background-color: rgba(21, 26, 48, 0.9);
213
- border-radius : ${theme.border.radius};
214
- height : 18px;
215
- min-width : 65px;
216
- padding : 3px 6px;
217
- pointer-events : none;
218
- position : fixed;
219
- text-align : center;
220
- transition : left 0.05s ease-in, top 0.05s ease-in;
221
- user-select : none;
222
- vertical-align : middle;
223
- visibility : hidden;
224
- white-space : nowrap;
225
- will-change : left top visibility;
226
- z-index : 9003;
227
- }
228
- @media only screen and (max-width: 599px) {
229
- max-width : 400px;
230
- .${unique.wrapper} {
231
- flex-direction: column;
232
- min-width : 260px;
233
- }
234
- .${unique.divider} {
235
- height: 1px !important;
236
- margin: 0px 16px !important;
237
- width : calc(100% - 32px) !important;
238
- }
239
- }
240
- `,
203
+ background-color: ${theme.colors.white};
204
+ border-radius: ${theme.border.radius};
205
+ box-shadow: ${theme.boxShadows.large};
206
+ display: flex;
207
+ flex-flow: column;
208
+ .${unique.wrapper} {
209
+ display: flex;
210
+ min-width: 633px;
211
+ }
212
+ .${unique.tooltip} {
213
+ background-color: rgba(21, 26, 48, 0.9);
214
+ border-radius: ${theme.border.radius};
215
+ height: 18px;
216
+ min-width: 65px;
217
+ padding: 3px 6px;
218
+ pointer-events: none;
219
+ position: fixed;
220
+ text-align: center;
221
+ transition: left 0.05s ease-in, top 0.05s ease-in;
222
+ user-select: none;
223
+ vertical-align: middle;
224
+ visibility: hidden;
225
+ white-space: nowrap;
226
+ will-change: left top visibility;
227
+ z-index: 9003;
228
+ }
229
+ @media only screen and (max-width: 599px) {
230
+ max-width: 400px;
231
+ .${unique.wrapper} {
232
+ flex-direction: column;
233
+ min-width: 260px;
234
+ }
235
+ .${unique.divider} {
236
+ height: 1px !important;
237
+ margin: 0px 16px !important;
238
+ width: calc(100% - 32px) !important;
239
+ }
240
+ }
241
+ `,
241
242
  picker: (position, width) => css`
242
- border-radius : ${theme.border.radius};
243
- height : max-content;
244
- left : ${position.left}px;
245
- max-width : 805px;
246
- min-width : ${window.innerWidth <= 633 ? 300 : 633}px;
247
- opacity : 0;
248
- position : fixed;
249
- top : ${position.top}px;
250
- transform : scale(0);
251
- transform-origin: ${position.transformOrigin};
252
- transition : opacity 120ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, transform 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
253
- width : ${width}px;
254
- z-index : 9002;
255
- `,
243
+ border-radius: ${theme.border.radius};
244
+ height: max-content;
245
+ left: ${position.left}px;
246
+ max-width: 805px;
247
+ min-width: ${window.innerWidth <= 633 ? 300 : 633}px;
248
+ opacity: 0;
249
+ position: fixed;
250
+ top: ${position.top}px;
251
+ transform: scale(0);
252
+ transform-origin: ${position.transformOrigin};
253
+ transition: opacity 120ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,
254
+ transform 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
255
+ width: ${width}px;
256
+ z-index: 9002;
257
+ `,
256
258
  active: {
257
259
  opacity: 1,
258
260
  transform: 'scale(1)'
@@ -456,8 +458,8 @@ const DateRangePickerV2 = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
456
458
  tableData = [],
457
459
  weekDateFirst = getDateOfWeek(firstDay),
458
460
  weekDateLast = getDateOfWeek(lastDay);
459
- /**
460
- * days of previous month
461
+ /**
462
+ * days of previous month
461
463
  */
462
464
 
463
465
  for (let i = weekDateFirst; i > 0; i--) {
@@ -470,8 +472,8 @@ const DateRangePickerV2 = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
470
472
  className: unique.day.day
471
473
  })));
472
474
  }
473
- /**
474
- * days of current month
475
+ /**
476
+ * days of current month
475
477
  */
476
478
 
477
479
 
@@ -485,8 +487,8 @@ const DateRangePickerV2 = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
485
487
  }, jsx(Typography, { ...typographyProps(unique.day.day)
486
488
  }, i + 1)));
487
489
  }
488
- /**
489
- * days of next month
490
+ /**
491
+ * days of next month
490
492
  */
491
493
 
492
494
 
@@ -531,8 +533,6 @@ const DateRangePickerV2 = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
531
533
  render(tableBody, tableToRef.current.appendChild(document.createElement('tbody')));
532
534
  }
533
535
  }
534
-
535
- ;
536
536
  };
537
537
 
538
538
  const updateFromTo = (times = [new Date(), new Date()]) => {
@@ -907,8 +907,6 @@ const DateRangePickerV2 = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
907
907
  target: null
908
908
  });
909
909
  }
910
-
911
- ;
912
910
  };
913
911
 
914
912
  const renderPicker = () => {