diginet-core-ui 1.3.88 → 1.3.89
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.
- package/assets/avatar/default.svg +3 -3
- package/assets/images/icons/wifi.svg +3 -3
- package/assets/images/menu/bem/WA3F0100.svg +6 -6
- package/assets/images/menu/bem/WA3F1025.svg +10 -10
- package/assets/images/menu/bem/WA3F2000.svg +10 -10
- package/assets/images/menu/bem/WA3F2020.svg +6 -6
- package/assets/images/menu/bem/WA3F2030.svg +14 -14
- package/assets/images/menu/bem/WA3F2040.svg +8 -8
- package/assets/images/menu/bem/WA3F2100.svg +6 -6
- package/assets/images/menu/dhr/ALL.svg +6 -6
- package/assets/images/menu/dhr/D00.svg +12 -12
- package/assets/images/menu/dhr/D09.svg +8 -8
- package/assets/images/menu/dhr/D13.svg +10 -10
- package/assets/images/menu/dhr/D15.svg +10 -10
- package/assets/images/menu/dhr/D21.svg +10 -10
- package/assets/images/menu/dhr/D25.svg +11 -11
- package/assets/images/menu/dhr/D29.svg +11 -11
- package/assets/images/menu/dhr/D38.svg +6 -6
- package/assets/images/menu/dhr/D39.svg +10 -10
- package/assets/images/menu/dhr/D51.svg +12 -12
- package/assets/images/menu/dhr/D52.svg +16 -16
- package/assets/images/menu/dhr/D77.svg +16 -16
- package/assets/images/menu/dhr/D84.svg +12 -12
- package/assets/images/menu/dhr/D89.svg +8 -8
- package/assets/images/menu/dhr/Default.svg +13 -13
- package/assets/images/menu/dhr/MHRM00N0001.svg +14 -14
- package/assets/images/menu/dhr/MHRM00N0002.svg +22 -22
- package/assets/images/menu/dhr/MHRM00N0003.svg +17 -17
- package/assets/images/menu/dhr/MHRM00N0004.svg +12 -12
- package/assets/images/menu/dhr/MHRM00N0005.svg +11 -11
- package/assets/images/menu/dhr/MHRM09N0002.svg +3 -3
- package/assets/images/menu/dhr/MHRM09N0003.svg +25 -25
- package/assets/images/menu/dhr/MHRM09N0004.svg +14 -14
- package/assets/images/menu/dhr/MHRM09N0005.svg +7 -7
- package/assets/images/menu/dhr/MHRM09N1010.svg +12 -12
- package/assets/images/menu/dhr/MHRM09N1015.svg +18 -18
- package/assets/images/menu/dhr/MHRM09N1020.svg +13 -13
- package/assets/images/menu/dhr/MHRM09N1025.svg +12 -12
- package/assets/images/menu/dhr/MHRM09N1030.svg +11 -11
- package/assets/images/menu/dhr/MHRM09N1035.svg +15 -15
- package/assets/images/menu/dhr/MHRM09N1040.svg +8 -8
- package/assets/images/menu/dhr/MHRM09N1400.svg +11 -11
- package/assets/images/menu/dhr/MHRM13N0001.svg +16 -16
- package/assets/images/menu/dhr/MHRM13N0002.svg +13 -13
- package/assets/images/menu/dhr/MHRM13N0003.svg +12 -12
- package/assets/images/menu/dhr/MHRM13N0004.svg +21 -21
- package/assets/images/menu/dhr/MHRM25N0001.svg +26 -26
- package/assets/images/menu/dhr/MHRM29N0001.svg +30 -30
- package/assets/images/menu/dhr/MHRM29N0002.svg +13 -13
- package/assets/images/menu/dhr/MHRM29N0003.svg +17 -17
- package/assets/images/menu/dhr/MHRM29N0004.svg +18 -18
- package/assets/images/menu/dhr/MHRM29N0005.svg +13 -13
- package/assets/images/menu/dhr/MHRM29N0015.svg +63 -63
- package/assets/images/menu/dhr/MHRM39N0012.svg +43 -43
- package/assets/images/menu/dhr/MHRM39N0013.svg +24 -24
- package/assets/images/menu/dhr/MHRM39N0014.svg +14 -14
- package/assets/images/menu/dhr/MHRM39N0015.svg +36 -36
- package/assets/images/menu/dhr/MHRM39N0016.svg +23 -23
- package/assets/images/menu/dhr/MHRM39N0017.svg +14 -14
- package/assets/images/menu/dhr/MHRM39N0018.svg +5 -5
- package/assets/images/menu/dhr/MHRM39N0019.svg +11 -11
- package/assets/images/menu/dhr/MHRM39N0020.svg +11 -11
- package/assets/images/menu/dhr/MHRM39N0021.svg +11 -11
- package/assets/images/menu/dhr/MHRM39N0022.svg +18 -18
- package/assets/images/menu/dhr/MHRM39N0023.svg +13 -13
- package/assets/images/menu/dhr/MHRM77N0001.svg +28 -28
- package/assets/images/menu/dhr/MHRM82N0001.svg +8 -8
- package/assets/images/menu/dhr/MHRM82N0002.svg +5 -5
- package/assets/images/menu/dhr/MHRM84N0001.svg +27 -27
- package/assets/images/menu/dhr/MHRM84N0002.svg +24 -24
- package/assets/images/menu/dhr/MHRM89N0001.svg +16 -16
- package/assets/images/menu/dhr/MHRP00N0001.svg +10 -10
- package/assets/images/menu/dhr/MHRP09N0001.svg +22 -22
- package/assets/images/menu/dhr/MHRP09N0002.svg +19 -19
- package/assets/images/menu/dhr/MHRP09N0003.svg +12 -12
- package/assets/images/menu/dhr/MHRP09N0004.svg +6 -6
- package/assets/images/menu/dhr/MHRP09N0005.svg +10 -10
- package/assets/images/menu/dhr/MHRP09N0006.svg +17 -17
- package/assets/images/menu/dhr/MHRP09N0007.svg +15 -15
- package/assets/images/menu/dhr/MHRP09N0008.svg +8 -8
- package/assets/images/menu/dhr/MHRP09N0009.svg +10 -10
- package/assets/images/menu/dhr/MHRP09N0010.svg +12 -12
- package/assets/images/menu/dhr/MHRP09N0011.svg +16 -16
- package/assets/images/menu/dhr/MHRP09N0012.svg +6 -6
- package/assets/images/menu/dhr/MHRP09N0013.svg +8 -8
- package/assets/images/menu/dhr/MHRP09N0014.svg +11 -11
- package/assets/images/menu/dhr/MHRP09N0015.svg +12 -12
- package/assets/images/menu/dhr/MHRP09N0016.svg +18 -18
- package/assets/images/menu/dhr/MHRP09N0017.svg +18 -18
- package/assets/images/menu/dhr/MHRP09N0018.svg +12 -12
- package/assets/images/menu/dhr/MHRP09N0019.svg +13 -13
- package/assets/images/menu/dhr/MHRP09N0020.svg +17 -17
- package/assets/images/menu/dhr/MHRP09N0021.svg +10 -10
- package/assets/images/menu/dhr/MHRP09N0022.svg +16 -16
- package/assets/images/menu/dhr/MHRP09N0023.svg +8 -8
- package/assets/images/menu/dhr/MHRP09N0024.svg +15 -15
- package/assets/images/menu/dhr/MHRP09N0025.svg +16 -16
- package/assets/images/menu/dhr/MHRP09N0026.svg +13 -13
- package/assets/images/menu/dhr/MHRP09N0027.svg +10 -10
- package/assets/images/menu/dhr/MHRP09N0028.svg +6 -6
- package/assets/images/menu/dhr/MHRP09N0029.svg +14 -14
- package/assets/images/menu/dhr/MHRP09N0030.svg +4 -4
- package/assets/images/menu/dhr/MHRP09N0031.svg +5 -5
- package/assets/images/menu/dhr/MHRP09N0032.svg +7 -7
- package/assets/images/menu/dhr/MHRP13N0001.svg +9 -9
- package/assets/images/menu/dhr/MHRP21N0001.svg +12 -12
- package/assets/images/menu/dhr/MHRP21N0002.svg +13 -13
- package/assets/images/menu/dhr/MHRP25L0101.svg +15 -15
- package/assets/images/menu/dhr/MHRP25L0501.svg +14 -14
- package/assets/images/menu/dhr/MHRP25N0001.svg +13 -13
- package/assets/images/menu/dhr/MHRP25N0002.svg +16 -16
- package/assets/images/menu/dhr/MHRP25N0003.svg +38 -38
- package/assets/images/menu/dhr/MHRP25N0004.svg +17 -17
- package/assets/images/menu/dhr/MHRP25N0005.svg +20 -20
- package/assets/images/menu/dhr/MHRP29N0001.svg +18 -18
- package/assets/images/menu/dhr/MHRP29N0002.svg +15 -15
- package/assets/images/menu/dhr/MHRP29N0003.svg +20 -20
- package/assets/images/menu/dhr/MHRP29N0004.svg +21 -21
- package/assets/images/menu/dhr/MHRP29N0005.svg +21 -21
- package/assets/images/menu/dhr/MHRP29N0006.svg +14 -14
- package/assets/images/menu/dhr/MHRP29N0007.svg +19 -19
- package/assets/images/menu/dhr/MHRP29N0008.svg +20 -20
- package/assets/images/menu/dhr/MHRP29N0009.svg +11 -11
- package/assets/images/menu/dhr/MHRP29N0010.svg +11 -11
- package/assets/images/menu/dhr/MHRP29N0011.svg +12 -12
- package/assets/images/menu/dhr/MHRP29N0012.svg +7 -7
- package/assets/images/menu/dhr/MHRP29N0013.svg +27 -27
- package/assets/images/menu/dhr/MHRP29N0014.svg +32 -32
- package/assets/images/menu/dhr/MHRP29N0016.svg +54 -54
- package/assets/images/menu/dhr/MHRP29N0017.svg +24 -24
- package/assets/images/menu/dhr/MHRP29N0018.svg +44 -44
- package/assets/images/menu/dhr/MHRP29N0019.svg +17 -17
- package/assets/images/menu/dhr/MHRP29N0020.svg +11 -11
- package/assets/images/menu/dhr/MHRP29N0021.svg +8 -8
- package/assets/images/menu/dhr/MHRP29N0022.svg +9 -9
- package/assets/images/menu/dhr/MHRP29N0023.svg +22 -22
- package/assets/images/menu/dhr/MHRP29N0026.svg +13 -13
- package/assets/images/menu/dhr/MHRP29N0027.svg +14 -14
- package/assets/images/menu/dhr/MHRP29N0028.svg +15 -15
- package/assets/images/menu/dhr/MHRP38N0001.svg +13 -13
- package/assets/images/menu/dhr/MHRP38N0002.svg +14 -14
- package/assets/images/menu/dhr/MHRP39N0001.svg +15 -15
- package/assets/images/menu/dhr/MHRP39N0002.svg +13 -13
- package/assets/images/menu/dhr/MHRP39N0003.svg +16 -16
- package/assets/images/menu/dhr/MHRP39N0004.svg +22 -22
- package/assets/images/menu/dhr/MHRP39N0005.svg +16 -16
- package/assets/images/menu/dhr/MHRP39N0006.svg +17 -17
- package/assets/images/menu/dhr/MHRP39N0007.svg +13 -13
- package/assets/images/menu/dhr/MHRP39N0008.svg +3 -3
- package/assets/images/menu/dhr/MHRP39N0009.svg +3 -3
- package/assets/images/menu/dhr/MHRP39N0010.svg +7 -7
- package/assets/images/menu/dhr/MHRP39N0011.svg +7 -7
- package/assets/images/menu/dhr/MHRP39N0013.svg +10 -10
- package/assets/images/menu/dhr/MHRP39N0014.svg +11 -11
- package/assets/images/menu/dhr/MHRP39N0015.svg +5 -5
- package/assets/images/menu/dhr/MHRP39N0017.svg +11 -11
- package/assets/images/menu/dhr/MHRP39N0018.svg +11 -11
- package/assets/images/menu/dhr/MHRP39N1222.svg +12 -12
- package/assets/images/menu/dhr/MHRP51N0001.svg +9 -9
- package/assets/images/menu/dhr/MHRP51N0002.svg +13 -13
- package/assets/images/menu/dhr/MHRP52N0001.svg +21 -21
- package/assets/images/menu/dhr/MHRP52N0002.svg +21 -21
- package/assets/images/menu/dhr/MHRP52N0003.svg +16 -16
- package/assets/images/menu/dhr/MHRP75N0001.svg +19 -19
- package/assets/images/menu/dhr/MHRP75N0002.svg +25 -25
- package/assets/images/menu/dhr/MHRP75N0003.svg +3 -3
- package/assets/images/menu/dhr/MHRP75N0006.svg +14 -14
- package/assets/images/menu/dhr/MHRP75N0007.svg +19 -19
- package/assets/images/menu/dhr/MHRP75N0008.svg +19 -19
- package/assets/images/menu/dhr/MHRP77N0007.svg +28 -28
- package/assets/images/menu/dhr/MHRP77N0008.svg +17 -17
- package/assets/images/menu/dhr/MHRP77N0009.svg +19 -19
- package/assets/images/menu/dhr/MHRP77N0010.svg +20 -20
- package/assets/images/menu/dhr/MHRP89N1000.svg +5 -5
- package/assets/images/menu/dhr/MHRP89N1001.svg +5 -5
- package/assets/images/menu/dhr/TASK.svg +9 -9
- package/assets/images/menu/dhr/W00F0001.svg +3 -3
- package/assets/images/menu/dhr/W00F0002.svg +3 -3
- package/assets/images/menu/dhr/W00F0003.svg +3 -3
- package/assets/images/menu/dhr/W00F0004.svg +3 -3
- package/assets/images/menu/dhr/W09F2000-WEB5.svg +17 -17
- package/assets/images/menu/dhr/W09F2000.svg +4 -4
- package/assets/images/menu/dhr/W09F2002-WEB5.svg +21 -21
- package/assets/images/menu/dhr/W09F2005-WEB5.svg +13 -13
- package/assets/images/menu/dhr/W09F2020-WEB5.svg +16 -16
- package/assets/images/menu/dhr/W09F2022-WEB5.svg +20 -20
- package/assets/images/menu/dhr/W09F2150-WEB5.svg +16 -16
- package/assets/images/menu/dhr/W09F2152-WEB5.svg +20 -20
- package/assets/images/menu/dhr/W09F2160-WEB5.svg +14 -14
- package/assets/images/menu/dhr/W09F2162-WEB5.svg +18 -18
- package/assets/images/menu/dhr/W29F4006-WEB5.svg +19 -19
- package/assets/images/menu/dhr/W75F2260-WEB5.svg +15 -15
- package/assets/images/menu/dhr/W75F2261-WEB5.svg +19 -19
- package/assets/images/menu/dhr/W75F3005-WEB5.svg +13 -13
- package/assets/images/menu/dhr/W75F4070-WEB5.svg +21 -21
- package/assets/images/menu/dhr/W75F4071-WEB5.svg +17 -17
- package/assets/images/menu/dhr/W75F4100-WEB5.svg +14 -14
- package/assets/images/menu/dhr/W77F1011.svg +19 -19
- package/assets/images/menu/dhr/W77F1013.svg +22 -22
- package/assets/images/menu/erp/D05.svg +8 -8
- package/assets/images/menu/erp/D06.svg +4 -4
- package/assets/images/menu/erp/D90R.svg +9 -9
- package/assets/images/menu/erp/DBC.svg +9 -9
- package/assets/images/menu/erp/W00F0001.svg +3 -3
- package/assets/images/menu/erp/W00F0002.svg +3 -3
- package/assets/images/menu/erp/W00F0003.svg +3 -3
- package/assets/images/menu/erp/W00F0004.svg +3 -3
- package/assets/images/menu/erp/W05F0001.svg +16 -16
- package/assets/images/menu/erp/W05F0001N0000.svg +16 -16
- package/assets/images/menu/erp/W05F0004N0000.svg +6 -6
- package/assets/images/menu/erp/W05F0006N0000.svg +30 -30
- package/assets/images/menu/erp/W05F0007N0000.svg +6 -6
- package/assets/images/menu/erp/W05F0008N0000.svg +14 -14
- package/assets/images/menu/erp/W05F0011N0000.svg +20 -20
- package/assets/images/menu/erp/W05F0013N0000.svg +9 -9
- package/assets/images/menu/erp/W05F4000N0000.svg +9 -9
- package/assets/images/menu/erp/W06F0001.svg +17 -17
- package/assets/images/menu/erp/W06F0001N0000.svg +17 -17
- package/assets/images/menu/erp/W06F0004N0000.svg +22 -22
- package/assets/images/menu/erp/W06F0005N0000.svg +22 -22
- package/assets/images/menu/erp/W06F0006N0000.svg +55 -55
- package/assets/images/menu/erp/W06F0008N0000.svg +17 -17
- package/assets/images/menu/erp/W94F1000N0000.svg +9 -9
- package/assets/images/menu/erp/W94F1000N0001.svg +9 -9
- package/assets/images/menu/erp/WA3F1025.svg +5 -5
- package/assets/images/menu/erp/WA3F2100.svg +10 -10
- package/assets/storybook/avatar01.svg +9 -9
- package/assets/storybook/cover01.svg +9 -9
- package/components/accordion/details.js +2 -6
- package/components/accordion/group.js +2 -9
- package/components/accordion/index.js +2 -15
- package/components/accordion/summary.js +4 -27
- package/components/alert/index.js +2 -33
- package/components/alert/notify.js +12 -22
- package/components/avatar/index.js +22 -81
- package/components/badge/index.js +20 -45
- package/components/button/icon.js +25 -56
- package/components/button/index.js +16 -65
- package/components/button/more.js +15 -35
- package/components/button/ripple-effect.js +0 -10
- package/components/card/body.js +2 -7
- package/components/card/extra.js +2 -7
- package/components/card/footer.js +2 -7
- package/components/card/header.js +2 -7
- package/components/card/index.js +2 -22
- package/components/chart/Pie/Circle.js +0 -1
- package/components/chart/Pie/Sector.js +2 -19
- package/components/chart/Pie/Sectors.js +0 -10
- package/components/chart/Pie/index.js +4 -36
- package/components/chart/Pie-v2/Circle.js +0 -1
- package/components/chart/Pie-v2/Sector.js +2 -15
- package/components/chart/Pie-v2/Sectors.js +0 -20
- package/components/chart/Pie-v2/index.js +11 -38
- package/components/chart/bar/Axis.js +0 -12
- package/components/chart/bar/Bar.js +13 -35
- package/components/chart/bar/Grid.js +0 -18
- package/components/chart/bar/Labels.js +4 -22
- package/components/chart/bar/Points.js +0 -17
- package/components/chart/bar/index.js +6 -26
- package/components/chart/bar-v2/Axis.js +0 -12
- package/components/chart/bar-v2/Bar.js +15 -36
- package/components/chart/bar-v2/Grid.js +0 -18
- package/components/chart/bar-v2/Labels.js +4 -22
- package/components/chart/bar-v2/Points.js +0 -17
- package/components/chart/bar-v2/index.js +6 -26
- package/components/chart/line/Axis.js +4 -16
- package/components/chart/line/Grid.js +2 -19
- package/components/chart/line/Labels.js +4 -22
- package/components/chart/line/Path.js +24 -34
- package/components/chart/line/Point.js +7 -41
- package/components/chart/line/Title.js +0 -3
- package/components/chart/line/index.js +12 -35
- package/components/chart/line-v2/Axis.js +0 -13
- package/components/chart/line-v2/Grid.js +0 -18
- package/components/chart/line-v2/Labels.js +4 -22
- package/components/chart/line-v2/Path.js +23 -33
- package/components/chart/line-v2/Point.js +6 -35
- package/components/chart/line-v2/Title.js +0 -3
- package/components/chart/line-v2/index.js +12 -30
- package/components/check-text/index.js +7 -15
- package/components/check-text/interview-confirmation.js +24 -31
- package/components/check-text/interview-status.js +24 -31
- package/components/chip/attach.js +9 -22
- package/components/chip/index.js +13 -38
- package/components/collapse/index.js +0 -13
- package/components/divider/index.js +2 -13
- package/components/form-control/attachment/index.js +41 -202
- package/components/form-control/calendar/function.js +154 -208
- package/components/form-control/calendar/index.js +21 -46
- package/components/form-control/calendar/range.js +11 -28
- package/components/form-control/checkbox/index.js +12 -46
- package/components/form-control/control/index.js +4 -14
- package/components/form-control/date-picker/index-old.js +18 -0
- package/components/form-control/date-picker/index.js +23 -99
- package/components/form-control/date-range-picker/index.js +44 -180
- package/components/form-control/dropdown/index.js +101 -314
- package/components/form-control/dropdown-box/index.js +7 -37
- package/components/form-control/form/index.js +0 -2
- package/components/form-control/form-group/index.js +1 -6
- package/components/form-control/helper-text/index.js +2 -9
- package/components/form-control/input-base/index.js +4 -68
- package/components/form-control/label/index.js +2 -12
- package/components/form-control/money-input/index.js +54 -143
- package/components/form-control/number-input/index.js +26 -124
- package/components/form-control/number-input/index2.js +95 -134
- package/components/form-control/phone-input/index.js +23 -85
- package/components/form-control/radio/index.js +16 -35
- package/components/form-control/text-input/index.js +10 -46
- package/components/form-control/time-picker/index.js +43 -100
- package/components/form-control/time-picker/swiper.js +21 -73
- package/components/form-control/toggle/index.js +26 -40
- package/components/form-view/helper-text.js +2 -2
- package/components/form-view/index.js +0 -14
- package/components/form-view/input.js +2 -13
- package/components/form-view/label.js +0 -2
- package/components/grid/Col.js +2 -16
- package/components/grid/Container.js +2 -21
- package/components/grid/Row.js +2 -21
- package/components/grid/index.js +2 -44
- package/components/image/index.js +2 -22
- package/components/index.js +62 -31
- package/components/list/list-item-action.js +12 -21
- package/components/list/list-item-icon.js +10 -19
- package/components/list/list-item-text.js +0 -5
- package/components/list/list-item.js +27 -38
- package/components/list/list.js +37 -50
- package/components/list/sub-header.js +13 -17
- package/components/modal/body.js +2 -6
- package/components/modal/footer.js +2 -11
- package/components/modal/header.js +2 -12
- package/components/modal/index.js +2 -10
- package/components/modal/modal.js +11 -52
- package/components/others/extra/index.js +3 -10
- package/components/others/import/index.js +0 -7
- package/components/others/option-wrapper/index.js +4 -7
- package/components/others/scrollbar/index.js +0 -3
- package/components/paging/page-info.js +35 -99
- package/components/paging/page-selector.js +10 -38
- package/components/paging/page-selector2.js +35 -74
- package/components/paper/index.js +23 -34
- package/components/popover/body.js +2 -6
- package/components/popover/footer.js +2 -11
- package/components/popover/header.js +2 -7
- package/components/popover/index.js +54 -146
- package/components/popup/danger_popup.js +0 -19
- package/components/popup/index.js +4 -50
- package/components/popup/proposals_popup.js +11 -50
- package/components/popup/v2/index.js +13 -47
- package/components/progress/circular.js +10 -48
- package/components/progress/linear.js +58 -74
- package/components/rating/index.js +10 -35
- package/components/slider/slider-container.js +4 -41
- package/components/slider/slider-item.js +10 -25
- package/components/status/index.js +2 -14
- package/components/tab/tab-container.js +4 -18
- package/components/tab/tab-header.js +4 -24
- package/components/tab/tab-panel.js +4 -16
- package/components/tab/tab.js +8 -33
- package/components/tooltip/index.js +12 -97
- package/components/tooltip/portal.js +0 -2
- package/components/transfer/index.js +28 -73
- package/components/tree-view/index.js +62 -202
- package/components/typography/index.js +14 -42
- package/global/index.js +0 -8
- package/icons/basic.js +0 -48
- package/icons/effect.js +15 -32
- package/icons/general/clock/clock.js +0 -2
- package/icons/general/color-handler/background.js +0 -2
- package/icons/general/color-handler/text.js +0 -2
- package/icons/general/emoji/emoji.js +0 -2
- package/icons/general/font-properties/bold.js +0 -2
- package/icons/general/font-properties/font-family.js +0 -2
- package/icons/general/font-properties/font-size.js +0 -2
- package/icons/general/font-properties/italic.js +0 -2
- package/icons/general/font-properties/underline.js +0 -2
- package/icons/general/hyperlink/hyperlink.js +0 -2
- package/icons/general/indent/decrease.js +0 -2
- package/icons/general/indent/increase.js +0 -2
- package/icons/general/list/bullets.js +0 -2
- package/icons/general/list/numbering.js +0 -2
- package/icons/general/picture/picture.js +0 -2
- package/icons/general/steps/redo.js +0 -2
- package/icons/general/steps/undo.js +0 -2
- package/icons/general/text-align/center.js +0 -2
- package/icons/general/text-align/justify.js +0 -2
- package/icons/general/text-align/left.js +0 -2
- package/icons/general/text-align/right.js +0 -2
- package/icons/menu/dhr.js +2 -1
- package/icons/menu/index.js +2 -2
- package/icons/menu/v2/index.js +2 -15
- package/package.json +42 -42
- package/readme.md +1034 -1027
- package/styles/animation.js +15 -58
- package/styles/color-helper.js +127 -157
- package/styles/colors.js +17 -9
- package/styles/general.js +16 -57
- package/styles/typography.js +4 -4
- package/styles/utils.js +18 -18
- package/theme/createBreakpoints.js +7 -18
- package/theme/make-styles.js +2 -5
- package/theme/set-theme.js +6 -9
- package/theme/settings.js +17 -22
- package/theme/theme-provider.js +0 -1
- package/utils/array/array.js +45 -54
- package/utils/classNames/index.js +0 -5
- package/utils/console.js +0 -6
- package/utils/date.js +69 -138
- package/utils/error/error.js +3 -11
- package/utils/error/errors.js +100 -147
- package/utils/getFileType.js +0 -9
- package/utils/handleBreakpoints.js +0 -5
- package/utils/intersectionObserver.js +0 -5
- package/utils/iterator.js +0 -9
- package/utils/map-parent.js +3 -10
- package/utils/object/extend.js +0 -10
- package/utils/object/object.js +12 -11
- package/utils/parseHTML.js +0 -1
- package/utils/promisify.js +0 -5
- package/utils/randomString.js +0 -7
- package/utils/remove-unicode.js +0 -1
- package/utils/render-portal.js +1 -9
- package/utils/renderHTML.js +4 -6
- package/utils/renderIcon.js +9 -19
- package/utils/sb-template.js +6 -5
- package/utils/string/capitalize.js +0 -1
- package/utils/string/capitalizeSentenceCase.js +0 -2
- package/utils/string/string.js +0 -13
- package/utils/type.js +0 -21
- package/utils/updatePosition.js +4 -5
- package/utils/useDelayUnmount.js +0 -4
- package/utils/useElementSize.js +9 -3
- package/utils/useEventListener.js +12 -6
- package/utils/useInput.js +0 -6
- package/utils/useMediaQuery/index.js +8 -10
- package/utils/useOnClickOutside.js +2 -4
- package/utils/usePortal.js +12 -19
- package/utils/validate.js +39 -53
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
/** @jsxRuntime classic */
|
|
2
|
-
|
|
3
2
|
/** @jsx jsx */
|
|
4
3
|
import { jsx, css } from '@emotion/core';
|
|
5
4
|
import PropTypes from 'prop-types';
|
|
@@ -20,7 +19,6 @@ const InputView = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
|
|
|
20
19
|
if (!ref) {
|
|
21
20
|
ref = useRef(null);
|
|
22
21
|
}
|
|
23
|
-
|
|
24
22
|
const inputRef = useRef(null);
|
|
25
23
|
const TextInput = viewType !== 'outlined' ? css`
|
|
26
24
|
display: flex;
|
|
@@ -71,41 +69,34 @@ const InputView = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
|
|
|
71
69
|
pointer-events: none;
|
|
72
70
|
}
|
|
73
71
|
`;
|
|
74
|
-
|
|
75
72
|
const numberWithFormat = (x, thousandChar) => {
|
|
76
73
|
let a = '';
|
|
77
|
-
|
|
78
74
|
switch (thousandChar) {
|
|
79
75
|
case ',':
|
|
80
76
|
a = x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
|
|
81
77
|
break;
|
|
82
|
-
|
|
83
78
|
case '.':
|
|
84
79
|
a = x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ".");
|
|
85
80
|
break;
|
|
86
|
-
|
|
87
81
|
default:
|
|
88
82
|
a = x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
|
|
89
83
|
}
|
|
90
|
-
|
|
91
84
|
return a;
|
|
92
85
|
};
|
|
93
|
-
|
|
94
86
|
const dateWithFormat = date => {
|
|
95
87
|
value = formatDate(date, format, utc);
|
|
96
88
|
return value;
|
|
97
89
|
};
|
|
98
|
-
|
|
99
90
|
useEffect(() => {
|
|
100
91
|
if (dataType === 'integer' && format !== null) {
|
|
101
92
|
inputRef.current.innerHTML = numberWithFormat(value, thousandChar);
|
|
102
93
|
}
|
|
103
|
-
|
|
104
94
|
if (dataType === 'date' && format !== null) {
|
|
105
95
|
inputRef.current.innerHTML = dateWithFormat(value);
|
|
106
96
|
}
|
|
107
97
|
}, [value]);
|
|
108
|
-
return useMemo(() => jsx("span", {
|
|
98
|
+
return useMemo(() => jsx("span", {
|
|
99
|
+
...inputProps,
|
|
109
100
|
style: inputStyleProps,
|
|
110
101
|
css: TextInput,
|
|
111
102
|
ref: inputRef
|
|
@@ -117,10 +108,8 @@ InputView.defaultProps = {
|
|
|
117
108
|
InputView.propTypes = {
|
|
118
109
|
/** the displayed value for each change */
|
|
119
110
|
value: PropTypes.oneOfType([PropTypes.number, PropTypes.string, PropTypes.func]),
|
|
120
|
-
|
|
121
111
|
/** props of span in InputView component */
|
|
122
112
|
inputProps: PropTypes.object,
|
|
123
|
-
|
|
124
113
|
/** style inline of span in InputView component */
|
|
125
114
|
inputStyleProps: PropTypes.object
|
|
126
115
|
};
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
/** @jsxRuntime classic */
|
|
2
|
-
|
|
3
2
|
/** @jsx jsx */
|
|
4
3
|
import { jsx, css } from '@emotion/core';
|
|
5
4
|
import PropTypes from 'prop-types';
|
|
@@ -27,7 +26,6 @@ Label.defaultProps = {
|
|
|
27
26
|
Label.propTypes = {
|
|
28
27
|
/** label for input */
|
|
29
28
|
label: PropTypes.string,
|
|
30
|
-
|
|
31
29
|
/** style inline of label in Label component */
|
|
32
30
|
labelProps: PropTypes.object
|
|
33
31
|
};
|
package/components/grid/Col.js
CHANGED
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
/** @jsxRuntime classic */
|
|
2
|
-
|
|
3
2
|
/** @jsx jsx */
|
|
4
3
|
import { jsx } from '@emotion/core';
|
|
5
4
|
import PropTypes from 'prop-types';
|
|
@@ -28,18 +27,17 @@ const useStyles = makeStyles({
|
|
|
28
27
|
}
|
|
29
28
|
}
|
|
30
29
|
});
|
|
31
|
-
|
|
32
30
|
const Col = props => {
|
|
33
31
|
const classes = useStyles();
|
|
34
32
|
const {
|
|
35
33
|
className
|
|
36
34
|
} = props;
|
|
37
|
-
return jsx(Grid, {
|
|
35
|
+
return jsx(Grid, {
|
|
36
|
+
...props,
|
|
38
37
|
className: classNames(`DGN-UI-Col ${classes.customCol}`, className),
|
|
39
38
|
item: true
|
|
40
39
|
});
|
|
41
40
|
};
|
|
42
|
-
|
|
43
41
|
Col.defaultProps = {
|
|
44
42
|
className: '',
|
|
45
43
|
columns: 12,
|
|
@@ -56,40 +54,28 @@ Col.defaultProps = {
|
|
|
56
54
|
Col.propTypes = {
|
|
57
55
|
/** The content of the component. */
|
|
58
56
|
children: PropTypes.node,
|
|
59
|
-
|
|
60
57
|
/** Class for component. */
|
|
61
58
|
className: PropTypes.string,
|
|
62
|
-
|
|
63
59
|
/** The number of columns. */
|
|
64
60
|
columns: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.number), PropTypes.number, PropTypes.object]),
|
|
65
|
-
|
|
66
61
|
/** Defines the `flex-direction` style property. It is applied for all screen sizes. */
|
|
67
62
|
direction: PropTypes.oneOfType([PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row']), PropTypes.arrayOf(PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row'])), PropTypes.object]),
|
|
68
|
-
|
|
69
63
|
/** If a number, it sets the number of columns the grid item uses. It can't be greater than the total number of columns of the container (12 by default). If 'auto', the grid item's width matches its content. If false, the prop is ignored. If true, the grid item's width grows to use the space available in the grid container. The value is applied for the `lg` breakpoint and wider screens if not overridden. */
|
|
70
64
|
lg: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
|
|
71
|
-
|
|
72
65
|
/** If a number, it sets the number of columns the grid item uses. It can't be greater than the total number of columns of the container (12 by default). If 'auto', the grid item's width matches its content. If false, the prop is ignored. If true, the grid item's width grows to use the space available in the grid container. The value is applied for the `md` breakpoint and wider screens if not overridden. */
|
|
73
66
|
md: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
|
|
74
|
-
|
|
75
67
|
/** If a number, it sets the number of columns the grid item uses. It can't be greater than the total number of columns of the container (12 by default). If 'auto', the grid item's width matches its content. If false, the prop is ignored. If true, the grid item's width grows to use the space available in the grid container. The value is applied for the `sm` breakpoint and wider screens if not overridden. */
|
|
76
68
|
sm: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
|
|
77
|
-
|
|
78
69
|
/** Style inline of component. */
|
|
79
70
|
style: PropTypes.object,
|
|
80
|
-
|
|
81
71
|
/** Self-align of the grid item. */
|
|
82
72
|
verticalAlign: PropTypes.oneOf(['auto', 'start', 'center', 'end']),
|
|
83
|
-
|
|
84
73
|
/** Defines the flex-wrap style property. It's applied for all screen sizes. */
|
|
85
74
|
wrap: PropTypes.oneOf(['nowrap', 'wrap-reverse', 'wrap']),
|
|
86
|
-
|
|
87
75
|
/** If a number, it sets the number of columns the grid item uses. It can't be greater than the total number of columns of the container (12 by default). If 'auto', the grid item's width matches its content. If false, the prop is ignored. If true, the grid item's width grows to use the space available in the grid container. The value is applied for the `xl` breakpoint and wider screens if not overridden. */
|
|
88
76
|
xl: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
|
|
89
|
-
|
|
90
77
|
/** If a number, it sets the number of columns the grid item uses. It can't be greater than the total number of columns of the container (12 by default). If 'auto', the grid item's width matches its content. If false, the prop is ignored. If true, the grid item's width grows to use the space available in the grid container. The value is applied for all the screen sizes with the lowest priority. */
|
|
91
78
|
xs: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
|
|
92
|
-
|
|
93
79
|
/** If `true`, it sets `min-width: 0` on the item. Refer to the limitations section of the documentation to better understand the use case. */
|
|
94
80
|
zeroMinWidth: PropTypes.bool
|
|
95
81
|
};
|
|
@@ -1,32 +1,27 @@
|
|
|
1
1
|
/** @jsxRuntime classic */
|
|
2
|
-
|
|
3
2
|
/** @jsx jsx */
|
|
4
3
|
import { jsx } from '@emotion/core';
|
|
5
4
|
import PropTypes from 'prop-types';
|
|
6
5
|
import { classNames } from "../../utils";
|
|
7
6
|
import Grid from '.';
|
|
8
|
-
|
|
9
7
|
const checkChildren = children => {
|
|
10
8
|
if (!children) return false;
|
|
11
|
-
|
|
12
9
|
if (Array.isArray(children)) {
|
|
13
10
|
return !children.every(v => v === false);
|
|
14
11
|
}
|
|
15
|
-
|
|
16
12
|
return true;
|
|
17
13
|
};
|
|
18
|
-
|
|
19
14
|
const Container = props => {
|
|
20
15
|
const {
|
|
21
16
|
className,
|
|
22
17
|
children
|
|
23
18
|
} = props;
|
|
24
|
-
return checkChildren(children) ? jsx(Grid, {
|
|
19
|
+
return checkChildren(children) ? jsx(Grid, {
|
|
20
|
+
...props,
|
|
25
21
|
className: classNames('DGN-UI-Container', className),
|
|
26
22
|
container: true
|
|
27
23
|
}) : null;
|
|
28
24
|
};
|
|
29
|
-
|
|
30
25
|
Container.defaultProps = {
|
|
31
26
|
className: '',
|
|
32
27
|
columns: 12,
|
|
@@ -65,46 +60,32 @@ Container.defaultProps = {
|
|
|
65
60
|
Container.propTypes = {
|
|
66
61
|
/** The content of the component. */
|
|
67
62
|
children: PropTypes.node,
|
|
68
|
-
|
|
69
63
|
/** Class for component. */
|
|
70
64
|
className: PropTypes.string,
|
|
71
|
-
|
|
72
65
|
/** The number of columns. */
|
|
73
66
|
columns: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.number), PropTypes.number, PropTypes.object]),
|
|
74
|
-
|
|
75
67
|
/** Defines the horizontal space between the type `Col` components. It overrides the value of the `spacing` prop. */
|
|
76
68
|
columnSpacing: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
|
|
77
|
-
|
|
78
69
|
/** Defines the `flex-direction` style property. It is applied for all screen sizes. */
|
|
79
70
|
direction: PropTypes.oneOfType([PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row']), PropTypes.arrayOf(PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row'])), PropTypes.object]),
|
|
80
|
-
|
|
81
71
|
/** If a number, it sets the number of columns the grid item uses. It can't be greater than the total number of columns of the container (12 by default). If 'auto', the grid item's width matches its content. If false, the prop is ignored. If true, the grid item's width grows to use the space available in the grid container. The value is applied for the `lg` breakpoint and wider screens if not overridden. */
|
|
82
72
|
lg: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
|
|
83
|
-
|
|
84
73
|
/** If a number, it sets the number of columns the grid item uses. It can't be greater than the total number of columns of the container (12 by default). If 'auto', the grid item's width matches its content. If false, the prop is ignored. If true, the grid item's width grows to use the space available in the grid container. The value is applied for the `md` breakpoint and wider screens if not overridden. */
|
|
85
74
|
md: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
|
|
86
|
-
|
|
87
75
|
/** Defines the vertical space between the type `Col` components. It overrides the value of the `spacing` prop. */
|
|
88
76
|
rowSpacing: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
|
|
89
|
-
|
|
90
77
|
/** If a number, it sets the number of columns the grid item uses. It can't be greater than the total number of columns of the container (12 by default). If 'auto', the grid item's width matches its content. If false, the prop is ignored. If true, the grid item's width grows to use the space available in the grid container. The value is applied for the `sm` breakpoint and wider screens if not overridden. */
|
|
91
78
|
sm: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
|
|
92
|
-
|
|
93
79
|
/** Defines the space between the type `Col` components */
|
|
94
80
|
spacing: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
|
|
95
|
-
|
|
96
81
|
/** Style inline of component. */
|
|
97
82
|
style: PropTypes.object,
|
|
98
|
-
|
|
99
83
|
/** Defines the flex-wrap style property. It's applied for all screen sizes. */
|
|
100
84
|
wrap: PropTypes.oneOf(['nowrap', 'wrap-reverse', 'wrap']),
|
|
101
|
-
|
|
102
85
|
/** If a number, it sets the number of columns the grid item uses. It can't be greater than the total number of columns of the container (12 by default). If 'auto', the grid item's width matches its content. If false, the prop is ignored. If true, the grid item's width grows to use the space available in the grid container. The value is applied for the `xl` breakpoint and wider screens if not overridden. */
|
|
103
86
|
xl: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
|
|
104
|
-
|
|
105
87
|
/** If a number, it sets the number of columns the grid item uses. It can't be greater than the total number of columns of the container (12 by default). If 'auto', the grid item's width matches its content. If false, the prop is ignored. If true, the grid item's width grows to use the space available in the grid container. The value is applied for all the screen sizes with the lowest priority. */
|
|
106
88
|
xs: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
|
|
107
|
-
|
|
108
89
|
/** If `true`, it sets `min-width: 0` on the item. Refer to the limitations section of the documentation to better understand the use case. */
|
|
109
90
|
zeroMinWidth: PropTypes.bool
|
|
110
91
|
};
|
package/components/grid/Row.js
CHANGED
|
@@ -1,32 +1,27 @@
|
|
|
1
1
|
/** @jsxRuntime classic */
|
|
2
|
-
|
|
3
2
|
/** @jsx jsx */
|
|
4
3
|
import { jsx } from '@emotion/core';
|
|
5
4
|
import PropTypes from 'prop-types';
|
|
6
5
|
import { classNames } from "../../utils";
|
|
7
6
|
import Grid from '.';
|
|
8
|
-
|
|
9
7
|
const checkChildren = children => {
|
|
10
8
|
if (!children) return false;
|
|
11
|
-
|
|
12
9
|
if (Array.isArray(children)) {
|
|
13
10
|
return !children.every(v => v === false);
|
|
14
11
|
}
|
|
15
|
-
|
|
16
12
|
return true;
|
|
17
13
|
};
|
|
18
|
-
|
|
19
14
|
const Row = props => {
|
|
20
15
|
const {
|
|
21
16
|
className,
|
|
22
17
|
children
|
|
23
18
|
} = props;
|
|
24
|
-
return checkChildren(children) ? jsx(Grid, {
|
|
19
|
+
return checkChildren(children) ? jsx(Grid, {
|
|
20
|
+
...props,
|
|
25
21
|
className: classNames('DGN-UI-Row', className),
|
|
26
22
|
container: true
|
|
27
23
|
}) : null;
|
|
28
24
|
};
|
|
29
|
-
|
|
30
25
|
Row.defaultProps = {
|
|
31
26
|
className: '',
|
|
32
27
|
columns: 12,
|
|
@@ -58,46 +53,32 @@ Row.defaultProps = {
|
|
|
58
53
|
Row.propTypes = {
|
|
59
54
|
/** The content of the component. */
|
|
60
55
|
children: PropTypes.node,
|
|
61
|
-
|
|
62
56
|
/** Class for component. */
|
|
63
57
|
className: PropTypes.string,
|
|
64
|
-
|
|
65
58
|
/** The number of columns. */
|
|
66
59
|
columns: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.number), PropTypes.number, PropTypes.object]),
|
|
67
|
-
|
|
68
60
|
/** Defines the horizontal space between the type `Col` components. It overrides the value of the `spacing` prop. */
|
|
69
61
|
columnSpacing: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
|
|
70
|
-
|
|
71
62
|
/** Defines the `flex-direction` style property. It is applied for all screen sizes. */
|
|
72
63
|
direction: PropTypes.oneOfType([PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row']), PropTypes.arrayOf(PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row'])), PropTypes.object]),
|
|
73
|
-
|
|
74
64
|
/** If a number, it sets the number of columns the grid item uses. It can't be greater than the total number of columns of the container (12 by default). If 'auto', the grid item's width matches its content. If false, the prop is ignored. If true, the grid item's width grows to use the space available in the grid container. The value is applied for the `lg` breakpoint and wider screens if not overridden. */
|
|
75
65
|
lg: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
|
|
76
|
-
|
|
77
66
|
/** If a number, it sets the number of columns the grid item uses. It can't be greater than the total number of columns of the container (12 by default). If 'auto', the grid item's width matches its content. If false, the prop is ignored. If true, the grid item's width grows to use the space available in the grid container. The value is applied for the `md` breakpoint and wider screens if not overridden. */
|
|
78
67
|
md: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
|
|
79
|
-
|
|
80
68
|
/** Defines the vertical space between the type `Col` components. It overrides the value of the `spacing` prop. */
|
|
81
69
|
rowSpacing: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
|
|
82
|
-
|
|
83
70
|
/** If a number, it sets the number of columns the grid item uses. It can't be greater than the total number of columns of the container (12 by default). If 'auto', the grid item's width matches its content. If false, the prop is ignored. If true, the grid item's width grows to use the space available in the grid container. The value is applied for the `sm` breakpoint and wider screens if not overridden. */
|
|
84
71
|
sm: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
|
|
85
|
-
|
|
86
72
|
/** Defines the space between the type `Col` components */
|
|
87
73
|
spacing: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
|
|
88
|
-
|
|
89
74
|
/** Style inline of component. */
|
|
90
75
|
style: PropTypes.object,
|
|
91
|
-
|
|
92
76
|
/** Defines the flex-wrap style property. It's applied for all screen sizes. */
|
|
93
77
|
wrap: PropTypes.oneOf(['nowrap', 'wrap-reverse', 'wrap']),
|
|
94
|
-
|
|
95
78
|
/** If a number, it sets the number of columns the grid item uses. It can't be greater than the total number of columns of the container (12 by default). If 'auto', the grid item's width matches its content. If false, the prop is ignored. If true, the grid item's width grows to use the space available in the grid container. The value is applied for the `xl` breakpoint and wider screens if not overridden. */
|
|
96
79
|
xl: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
|
|
97
|
-
|
|
98
80
|
/** If a number, it sets the number of columns the grid item uses. It can't be greater than the total number of columns of the container (12 by default). If 'auto', the grid item's width matches its content. If false, the prop is ignored. If true, the grid item's width grows to use the space available in the grid container. The value is applied for all the screen sizes with the lowest priority. */
|
|
99
81
|
xs: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
|
|
100
|
-
|
|
101
82
|
/** If `true`, it sets `min-width: 0` on the item. Refer to the limitations section of the documentation to better understand the use case. */
|
|
102
83
|
zeroMinWidth: PropTypes.bool
|
|
103
84
|
};
|
package/components/grid/index.js
CHANGED
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
/** @jsxRuntime classic */
|
|
2
|
-
|
|
3
2
|
/** @jsx jsx */
|
|
4
3
|
import { css, jsx } from '@emotion/core';
|
|
5
4
|
import PropTypes from 'prop-types';
|
|
@@ -44,21 +43,16 @@ const Grid = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
|
|
|
44
43
|
const topSpacing = topSpacingProp !== null && topSpacingProp !== void 0 ? topSpacingProp : rowSpacing;
|
|
45
44
|
const leftSpacing = leftSpacingProp !== null && leftSpacingProp !== void 0 ? leftSpacingProp : columnSpacing;
|
|
46
45
|
const ref = useRef(null);
|
|
47
|
-
|
|
48
46
|
const _GridCSS = GridCSS(direction, zeroMinWidth, container, item, wrap, verticalAlign);
|
|
49
|
-
|
|
50
47
|
const _GridSpacingCSS = GridSpacingCSS(rowSpacing, columnSpacing, topSpacing, leftSpacing);
|
|
51
|
-
|
|
52
48
|
const _HandleGridCSS = HandleGridCSS([xs, sm, md, lg, xl], columns);
|
|
53
|
-
|
|
54
49
|
useImperativeHandle(reference, () => {
|
|
55
50
|
const currentRef = ref.current || {};
|
|
56
51
|
currentRef.element = ref.current;
|
|
57
|
-
const _instance = {
|
|
52
|
+
const _instance = {
|
|
53
|
+
...action
|
|
58
54
|
}; // methods
|
|
59
|
-
|
|
60
55
|
_instance.__proto__ = {}; // hidden methods
|
|
61
|
-
|
|
62
56
|
currentRef.instance = _instance;
|
|
63
57
|
return currentRef;
|
|
64
58
|
});
|
|
@@ -74,12 +68,10 @@ const Grid = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
|
|
|
74
68
|
}, children));
|
|
75
69
|
}, [columns, columnSpacing, leftSpacing, rowSpacing, topSpacing, children, className, container, direction, id, item, lg, md, sm, spacing, style, verticalAlign, wrap, xl, xs, zeroMinWidth]);
|
|
76
70
|
}));
|
|
77
|
-
|
|
78
71
|
const getOffset = val => {
|
|
79
72
|
const parse = parseFloat(val);
|
|
80
73
|
return `${parse}${String(val).replace(String(parse), '') || 'px'}`;
|
|
81
74
|
};
|
|
82
|
-
|
|
83
75
|
const processSizeArray = sizeArr => {
|
|
84
76
|
let lastValue = false;
|
|
85
77
|
sizeArr = sizeArr.map(item => {
|
|
@@ -88,10 +80,8 @@ const processSizeArray = sizeArr => {
|
|
|
88
80
|
});
|
|
89
81
|
return sizeArr;
|
|
90
82
|
};
|
|
91
|
-
|
|
92
83
|
const handleGrid = (size, value, columns) => {
|
|
93
84
|
let css = '';
|
|
94
|
-
|
|
95
85
|
if (value === true) {
|
|
96
86
|
css = `
|
|
97
87
|
flex-basis: 0;
|
|
@@ -115,12 +105,10 @@ const handleGrid = (size, value, columns) => {
|
|
|
115
105
|
`;
|
|
116
106
|
});
|
|
117
107
|
}
|
|
118
|
-
|
|
119
108
|
return `${themeBreakpoints.up(size)} {
|
|
120
109
|
${css}
|
|
121
110
|
}`;
|
|
122
111
|
};
|
|
123
|
-
|
|
124
112
|
const GridCSS = (direction, zeroMinWidth, container, item, wrap, verticalAlign) => css`
|
|
125
113
|
${boxBorder};
|
|
126
114
|
${container && `
|
|
@@ -137,22 +125,18 @@ const GridCSS = (direction, zeroMinWidth, container, item, wrap, verticalAlign)
|
|
|
137
125
|
return `flex-direction: ${propValue}`;
|
|
138
126
|
})};
|
|
139
127
|
`;
|
|
140
|
-
|
|
141
128
|
const GridSpacingCSS = (rowSpacing, columnSpacing, topSpacing, leftSpacing) => css`
|
|
142
129
|
${topSpacing && handleBreakpoints(topSpacing, propValue => {
|
|
143
130
|
const spacing = typeof propValue === 'number' ? themeSpacing(propValue) : propValue;
|
|
144
|
-
|
|
145
131
|
if (spacing !== '0px') {
|
|
146
132
|
return `
|
|
147
133
|
margin-top: -${getOffset(spacing)};
|
|
148
134
|
`;
|
|
149
135
|
}
|
|
150
|
-
|
|
151
136
|
return '';
|
|
152
137
|
})};
|
|
153
138
|
${rowSpacing && handleBreakpoints(rowSpacing, propValue => {
|
|
154
139
|
const spacing = typeof propValue === 'number' ? themeSpacing(propValue) : propValue;
|
|
155
|
-
|
|
156
140
|
if (spacing !== '0px') {
|
|
157
141
|
return `
|
|
158
142
|
& > .DGN-UI-Grid-item {
|
|
@@ -160,23 +144,19 @@ const GridSpacingCSS = (rowSpacing, columnSpacing, topSpacing, leftSpacing) => c
|
|
|
160
144
|
}
|
|
161
145
|
`;
|
|
162
146
|
}
|
|
163
|
-
|
|
164
147
|
return '';
|
|
165
148
|
})};
|
|
166
149
|
${leftSpacing && handleBreakpoints(leftSpacing, propValue => {
|
|
167
150
|
const spacing = typeof propValue === 'number' ? themeSpacing(propValue) : propValue;
|
|
168
|
-
|
|
169
151
|
if (spacing !== '0px') {
|
|
170
152
|
return `
|
|
171
153
|
margin-left: -${getOffset(spacing)};
|
|
172
154
|
`;
|
|
173
155
|
}
|
|
174
|
-
|
|
175
156
|
return '';
|
|
176
157
|
})};
|
|
177
158
|
${columnSpacing && handleBreakpoints(columnSpacing, propValue => {
|
|
178
159
|
const spacing = typeof propValue === 'number' ? themeSpacing(propValue) : propValue;
|
|
179
|
-
|
|
180
160
|
if (spacing !== '0px') {
|
|
181
161
|
return `
|
|
182
162
|
width: calc(100% + ${getOffset(spacing)});
|
|
@@ -185,17 +165,14 @@ const GridSpacingCSS = (rowSpacing, columnSpacing, topSpacing, leftSpacing) => c
|
|
|
185
165
|
}
|
|
186
166
|
`;
|
|
187
167
|
}
|
|
188
|
-
|
|
189
168
|
return '';
|
|
190
169
|
})};
|
|
191
170
|
`;
|
|
192
|
-
|
|
193
171
|
const HandleGridCSS = (sizeArr, columns) => css`
|
|
194
172
|
${processSizeArray(sizeArr).map((item, idx) => {
|
|
195
173
|
return handleGrid(breakpointKeys[idx], item, columns);
|
|
196
174
|
})}
|
|
197
175
|
`;
|
|
198
|
-
|
|
199
176
|
Grid.defaultProps = {
|
|
200
177
|
className: '',
|
|
201
178
|
columns: 12,
|
|
@@ -216,61 +193,42 @@ Grid.defaultProps = {
|
|
|
216
193
|
Grid.propTypes = {
|
|
217
194
|
/** The content of the component. */
|
|
218
195
|
children: PropTypes.node,
|
|
219
|
-
|
|
220
196
|
/** Style inline of component. */
|
|
221
197
|
style: PropTypes.object,
|
|
222
|
-
|
|
223
198
|
/** Class for component. */
|
|
224
199
|
className: PropTypes.string,
|
|
225
|
-
|
|
226
200
|
/** The number of columns. */
|
|
227
201
|
columns: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.number), PropTypes.number, PropTypes.object]),
|
|
228
|
-
|
|
229
202
|
/** Defines the horizontal space between the type `item` components. It overrides the value of the `spacing` prop. */
|
|
230
203
|
columnSpacing: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
|
|
231
|
-
|
|
232
204
|
/** If true, the component will have the flex *container* behavior. You should be wrapping *items* with a *container*. */
|
|
233
205
|
container: PropTypes.bool,
|
|
234
|
-
|
|
235
206
|
/** Defines the `flex-direction` style property. It is applied for all screen sizes. */
|
|
236
207
|
direction: PropTypes.oneOfType([PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row']), PropTypes.arrayOf(PropTypes.oneOf(['column-reverse', 'column', 'row-reverse', 'row'])), PropTypes.object]),
|
|
237
|
-
|
|
238
208
|
/** If `true`, the component will have the flex *item* behavior. You should be wrapping *items* with a *container*. */
|
|
239
209
|
item: PropTypes.bool,
|
|
240
|
-
|
|
241
210
|
/** Defines the horizontal space of `container` components. */
|
|
242
211
|
leftSpacing: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
|
|
243
|
-
|
|
244
212
|
/** If a number, it sets the number of columns the grid item uses. It can't be greater than the total number of columns of the container (12 by default). If 'auto', the grid item's width matches its content. If false, the prop is ignored. If true, the grid item's width grows to use the space available in the grid container. The value is applied for the `lg` breakpoint and wider screens if not overridden. */
|
|
245
213
|
lg: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
|
|
246
|
-
|
|
247
214
|
/** If a number, it sets the number of columns the grid item uses. It can't be greater than the total number of columns of the container (12 by default). If 'auto', the grid item's width matches its content. If false, the prop is ignored. If true, the grid item's width grows to use the space available in the grid container. The value is applied for the `md` breakpoint and wider screens if not overridden. */
|
|
248
215
|
md: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
|
|
249
|
-
|
|
250
216
|
/** Defines the vertical space between the type `item` components. It overrides the value of the `spacing` prop. */
|
|
251
217
|
rowSpacing: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
|
|
252
|
-
|
|
253
218
|
/** If a number, it sets the number of columns the grid item uses. It can't be greater than the total number of columns of the container (12 by default). If 'auto', the grid item's width matches its content. If false, the prop is ignored. If true, the grid item's width grows to use the space available in the grid container. The value is applied for the `sm` breakpoint and wider screens if not overridden. */
|
|
254
219
|
sm: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
|
|
255
|
-
|
|
256
220
|
/** Defines the space between the type `item` components. It can only be used on a type `container` component. */
|
|
257
221
|
spacing: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
|
|
258
|
-
|
|
259
222
|
/** Defines the vertical space of `container` components. */
|
|
260
223
|
topSpacing: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.number, PropTypes.string])), PropTypes.number, PropTypes.object, PropTypes.string]),
|
|
261
|
-
|
|
262
224
|
/** Self-align of the grid item. */
|
|
263
225
|
verticalAlign: PropTypes.oneOf(['auto', 'start', 'center', 'end']),
|
|
264
|
-
|
|
265
226
|
/** Defines the flex-wrap style property. It's applied for all screen sizes. */
|
|
266
227
|
wrap: PropTypes.oneOf(['nowrap', 'wrap-reverse', 'wrap']),
|
|
267
|
-
|
|
268
228
|
/** If a number, it sets the number of columns the grid item uses. It can't be greater than the total number of columns of the container (12 by default). If 'auto', the grid item's width matches its content. If false, the prop is ignored. If true, the grid item's width grows to use the space available in the grid container. The value is applied for the `xl` breakpoint and wider screens if not overridden. */
|
|
269
229
|
xl: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
|
|
270
|
-
|
|
271
230
|
/** If a number, it sets the number of columns the grid item uses. It can't be greater than the total number of columns of the container (12 by default). If 'auto', the grid item's width matches its content. If false, the prop is ignored. If true, the grid item's width grows to use the space available in the grid container. The value is applied for all the screen sizes with the lowest priority. */
|
|
272
231
|
xs: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.number, PropTypes.bool]),
|
|
273
|
-
|
|
274
232
|
/** If `true`, it sets `min-width: 0` on the item. Refer to the limitations section of the documentation to better understand the use case. */
|
|
275
233
|
zeroMinWidth: PropTypes.bool
|
|
276
234
|
};
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
/** @jsxRuntime classic */
|
|
2
|
-
|
|
3
2
|
/** @jsx jsx */
|
|
4
3
|
import { forwardRef, Fragment, memo, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';
|
|
5
4
|
import PropTypes from 'prop-types';
|
|
@@ -38,21 +37,17 @@ const Image = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
|
|
|
38
37
|
useIntersection(ref, () => {
|
|
39
38
|
setIsInView(true);
|
|
40
39
|
});
|
|
41
|
-
|
|
42
40
|
const _ImageCSS = ImageCSS(width, height, circular);
|
|
43
|
-
|
|
44
41
|
useEffect(() => {
|
|
45
42
|
if (src) {
|
|
46
43
|
if (isInView || !lazyLoading) {
|
|
47
44
|
const img = document.createElement('img');
|
|
48
45
|
img.src = src;
|
|
49
46
|
img.alt = '';
|
|
50
|
-
|
|
51
47
|
img.onerror = () => {
|
|
52
48
|
setSrcState(defaultSrc);
|
|
53
49
|
onError === null || onError === void 0 ? void 0 : onError();
|
|
54
50
|
};
|
|
55
|
-
|
|
56
51
|
img.onload = () => {
|
|
57
52
|
setSrcState(src);
|
|
58
53
|
};
|
|
@@ -62,15 +57,13 @@ const Image = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
|
|
|
62
57
|
useImperativeHandle(reference, () => {
|
|
63
58
|
const currentRef = ref.current || {};
|
|
64
59
|
currentRef.element = ref.current;
|
|
65
|
-
const _instance = {
|
|
60
|
+
const _instance = {
|
|
61
|
+
...action
|
|
66
62
|
}; // methods
|
|
67
|
-
|
|
68
63
|
_instance.__proto__ = {}; // hidden methods
|
|
69
|
-
|
|
70
64
|
currentRef.instance = _instance;
|
|
71
65
|
return currentRef;
|
|
72
66
|
});
|
|
73
|
-
|
|
74
67
|
const renderImage = () => {
|
|
75
68
|
const defaultImage = jsx("img", {
|
|
76
69
|
src: defaultSrc,
|
|
@@ -92,12 +85,10 @@ const Image = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
|
|
|
92
85
|
width: width,
|
|
93
86
|
height: height
|
|
94
87
|
}));
|
|
95
|
-
|
|
96
88
|
if (lazyLoading) {
|
|
97
89
|
return isInView ? image : defaultImage;
|
|
98
90
|
} else return image;
|
|
99
91
|
};
|
|
100
|
-
|
|
101
92
|
return useMemo(() => {
|
|
102
93
|
return jsx("div", {
|
|
103
94
|
ref: ref,
|
|
@@ -108,7 +99,6 @@ const Image = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(({
|
|
|
108
99
|
}, renderImage());
|
|
109
100
|
}, [alt, circular, className, defaultSrc, height, id, lazyLoading, src, style, width, isInView, onLoaded, srcState]);
|
|
110
101
|
}));
|
|
111
|
-
|
|
112
102
|
const ImageCSS = (width, height, circular) => css`
|
|
113
103
|
${displayInlineFlex};
|
|
114
104
|
${positionRelative};
|
|
@@ -117,7 +107,6 @@ const ImageCSS = (width, height, circular) => css`
|
|
|
117
107
|
${parseWidthHeight(width, height)};
|
|
118
108
|
${circular && `border-radius: 50%`};
|
|
119
109
|
`;
|
|
120
|
-
|
|
121
110
|
const blurAnimationCSS = css`
|
|
122
111
|
animation: ${blurKeyframe} 1s ease;
|
|
123
112
|
`;
|
|
@@ -132,31 +121,22 @@ Image.defaultProps = {
|
|
|
132
121
|
Image.propTypes = {
|
|
133
122
|
/** Image description. */
|
|
134
123
|
alt: PropTypes.string,
|
|
135
|
-
|
|
136
124
|
/** If `true`, image is circular.*/
|
|
137
125
|
circular: PropTypes.bool,
|
|
138
|
-
|
|
139
126
|
/** Class for component. */
|
|
140
127
|
className: PropTypes.string,
|
|
141
|
-
|
|
142
128
|
/** Default img when src error. */
|
|
143
129
|
defaultSrc: PropTypes.string,
|
|
144
|
-
|
|
145
130
|
/** Height of component. */
|
|
146
131
|
height: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
|
147
|
-
|
|
148
132
|
/** If `true`, lazy loading image.*/
|
|
149
133
|
lazyLoading: PropTypes.bool,
|
|
150
|
-
|
|
151
134
|
/** Callback fired when the src is error. */
|
|
152
135
|
onError: PropTypes.func,
|
|
153
|
-
|
|
154
136
|
/** Image path. */
|
|
155
137
|
src: PropTypes.string,
|
|
156
|
-
|
|
157
138
|
/** Style inline of component. */
|
|
158
139
|
style: PropTypes.object,
|
|
159
|
-
|
|
160
140
|
/** Width of component. */
|
|
161
141
|
width: PropTypes.oneOfType([PropTypes.number, PropTypes.string])
|
|
162
142
|
};
|