@sap-ux/ui-components 1.8.2 → 1.8.4
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/dist/components/Icons.d.ts +140 -139
- package/dist/components/Icons.d.ts.map +1 -1
- package/dist/components/Icons.js +587 -582
- package/dist/components/Icons.js.map +1 -1
- package/dist/components/UIActionCallout/UIActionCallout.d.ts +61 -61
- package/dist/components/UIActionCallout/UIActionCallout.js +63 -63
- package/dist/components/UIActionCallout/UIActionCallout.scss +31 -31
- package/dist/components/UIActionCallout/index.d.ts +1 -1
- package/dist/components/UIActionCallout/index.js +17 -17
- package/dist/components/UIBreadcrumb/UIBreadcrumb.d.ts +23 -23
- package/dist/components/UIBreadcrumb/UIBreadcrumb.js +38 -38
- package/dist/components/UIBreadcrumb/index.d.ts +1 -1
- package/dist/components/UIBreadcrumb/index.js +17 -17
- package/dist/components/UIButton/UIActionButton.d.ts +23 -23
- package/dist/components/UIButton/UIActionButton.js +89 -89
- package/dist/components/UIButton/UIDefaultButton.d.ts +23 -23
- package/dist/components/UIButton/UIDefaultButton.js +229 -229
- package/dist/components/UIButton/UIIconButton.d.ts +37 -37
- package/dist/components/UIButton/UIIconButton.js +106 -106
- package/dist/components/UIButton/UISmallButton.d.ts +34 -34
- package/dist/components/UIButton/UISmallButton.js +115 -115
- package/dist/components/UIButton/UISplitButton.d.ts +36 -36
- package/dist/components/UIButton/UISplitButton.js +71 -71
- package/dist/components/UIButton/index.d.ts +7 -7
- package/dist/components/UIButton/index.js +21 -21
- package/dist/components/UICallout/UICallout.d.ts +37 -37
- package/dist/components/UICallout/UICallout.js +90 -90
- package/dist/components/UICallout/index.d.ts +1 -1
- package/dist/components/UICallout/index.js +17 -17
- package/dist/components/UICheckbox/UICheckbox.d.ts +34 -34
- package/dist/components/UICheckbox/UICheckbox.js +135 -135
- package/dist/components/UICheckbox/index.d.ts +1 -1
- package/dist/components/UICheckbox/index.js +17 -17
- package/dist/components/UIChoiceGroup/UIChoiceGroup.d.ts +28 -28
- package/dist/components/UIChoiceGroup/UIChoiceGroup.js +182 -182
- package/dist/components/UIChoiceGroup/index.d.ts +1 -1
- package/dist/components/UIChoiceGroup/index.js +17 -17
- package/dist/components/UIComboBox/Callout.scss +7 -7
- package/dist/components/UIComboBox/UIComboBox.d.ts +198 -198
- package/dist/components/UIComboBox/UIComboBox.js +516 -516
- package/dist/components/UIComboBox/UIComboBox.scss +268 -268
- package/dist/components/UIComboBox/_mixins.scss +32 -32
- package/dist/components/UIComboBox/index.d.ts +1 -1
- package/dist/components/UIComboBox/index.js +17 -17
- package/dist/components/UIContextualMenu/UIContextualMenu.d.ts +31 -31
- package/dist/components/UIContextualMenu/UIContextualMenu.js +123 -123
- package/dist/components/UIContextualMenu/UIContextualMenu.scss +211 -211
- package/dist/components/UIContextualMenu/UIHighlightMenuOption.d.ts +19 -19
- package/dist/components/UIContextualMenu/UIHighlightMenuOption.js +50 -50
- package/dist/components/UIContextualMenu/UIHighlightMenuOption.scss +23 -23
- package/dist/components/UIContextualMenu/_variables.scss +30 -30
- package/dist/components/UIContextualMenu/index.d.ts +2 -2
- package/dist/components/UIContextualMenu/index.js +18 -18
- package/dist/components/UIDatePicker/UIDatePicker.d.ts +49 -49
- package/dist/components/UIDatePicker/UIDatePicker.js +72 -72
- package/dist/components/UIDatePicker/UIDatePicker.scss +38 -38
- package/dist/components/UIDatePicker/index.d.ts +1 -1
- package/dist/components/UIDatePicker/index.js +17 -17
- package/dist/components/UIDialog/UIDialog.d.ts +116 -116
- package/dist/components/UIDialog/UIDialog.js +279 -279
- package/dist/components/UIDialog/index.d.ts +1 -1
- package/dist/components/UIDialog/index.js +17 -17
- package/dist/components/UIDropdown/UIDropdown.d.ts +90 -90
- package/dist/components/UIDropdown/UIDropdown.js +216 -216
- package/dist/components/UIDropdown/UIDropdown.scss +115 -115
- package/dist/components/UIDropdown/index.d.ts +2 -2
- package/dist/components/UIDropdown/index.js +18 -18
- package/dist/components/UIDropdown/utils.d.ts +8 -8
- package/dist/components/UIDropdown/utils.js +20 -20
- package/dist/components/UIFlexibleTable/RowActions.d.ts +16 -16
- package/dist/components/UIFlexibleTable/RowActions.js +73 -73
- package/dist/components/UIFlexibleTable/RowData.d.ts +16 -16
- package/dist/components/UIFlexibleTable/RowData.js +111 -111
- package/dist/components/UIFlexibleTable/UIFlexibleTable.d.ts +11 -11
- package/dist/components/UIFlexibleTable/UIFlexibleTable.js +280 -280
- package/dist/components/UIFlexibleTable/UIFlexibleTable.scss +433 -433
- package/dist/components/UIFlexibleTable/UIFlexibleTableActionButton.d.ts +20 -20
- package/dist/components/UIFlexibleTable/UIFlexibleTableActionButton.js +20 -20
- package/dist/components/UIFlexibleTable/UIFlexibleTableRow.d.ts +26 -26
- package/dist/components/UIFlexibleTable/UIFlexibleTableRow.js +165 -165
- package/dist/components/UIFlexibleTable/UIFlexibleTableRowActionButton.d.ts +20 -20
- package/dist/components/UIFlexibleTable/UIFlexibleTableRowActionButton.js +19 -19
- package/dist/components/UIFlexibleTable/UIFlexibleTableRowNoData.d.ts +15 -15
- package/dist/components/UIFlexibleTable/UIFlexibleTableRowNoData.js +28 -28
- package/dist/components/UIFlexibleTable/index.d.ts +5 -5
- package/dist/components/UIFlexibleTable/index.js +21 -21
- package/dist/components/UIFlexibleTable/types.d.ts +142 -142
- package/dist/components/UIFlexibleTable/types.js +14 -14
- package/dist/components/UIFlexibleTable/utils.d.ts +25 -25
- package/dist/components/UIFlexibleTable/utils.js +49 -49
- package/dist/components/UIFocusZone/UIFocusTrapZone.d.ts +22 -22
- package/dist/components/UIFocusZone/UIFocusTrapZone.js +33 -33
- package/dist/components/UIFocusZone/UIFocusZone.d.ts +23 -23
- package/dist/components/UIFocusZone/UIFocusZone.js +35 -35
- package/dist/components/UIFocusZone/index.d.ts +2 -2
- package/dist/components/UIFocusZone/index.js +18 -18
- package/dist/components/UIIcon/UIIcon.d.ts +24 -24
- package/dist/components/UIIcon/UIIcon.js +37 -37
- package/dist/components/UIIcon/UIIcon.scss +3 -3
- package/dist/components/UIIcon/index.d.ts +1 -1
- package/dist/components/UIIcon/index.js +17 -17
- package/dist/components/UIInput/UITextInput.d.ts +48 -48
- package/dist/components/UIInput/UITextInput.js +238 -238
- package/dist/components/UIInput/index.d.ts +1 -1
- package/dist/components/UIInput/index.js +17 -17
- package/dist/components/UILabel/UILabel.d.ts +30 -30
- package/dist/components/UILabel/UILabel.js +64 -64
- package/dist/components/UILabel/index.d.ts +1 -1
- package/dist/components/UILabel/index.js +17 -17
- package/dist/components/UILink/UILink.d.ts +25 -25
- package/dist/components/UILink/UILink.js +71 -71
- package/dist/components/UILink/index.d.ts +1 -1
- package/dist/components/UILink/index.js +17 -17
- package/dist/components/UIList/UIList.d.ts +31 -31
- package/dist/components/UIList/UIList.js +120 -120
- package/dist/components/UIList/UIList.scss +16 -16
- package/dist/components/UIList/index.d.ts +1 -1
- package/dist/components/UIList/index.js +17 -17
- package/dist/components/UILoader/UILoader.d.ts +27 -27
- package/dist/components/UILoader/UILoader.js +78 -78
- package/dist/components/UILoader/UILoader.scss +32 -32
- package/dist/components/UILoader/index.d.ts +1 -1
- package/dist/components/UILoader/index.js +17 -17
- package/dist/components/UIMessageBar/UIMessageBar.d.ts +25 -25
- package/dist/components/UIMessageBar/UIMessageBar.js +56 -56
- package/dist/components/UIMessageBar/index.d.ts +1 -1
- package/dist/components/UIMessageBar/index.js +17 -17
- package/dist/components/UIModal/UIModal.d.ts +23 -23
- package/dist/components/UIModal/UIModal.js +43 -43
- package/dist/components/UIModal/index.d.ts +1 -1
- package/dist/components/UIModal/index.js +17 -17
- package/dist/components/UIOverlay/UIOverlay.d.ts +22 -22
- package/dist/components/UIOverlay/UIOverlay.js +38 -38
- package/dist/components/UIOverlay/index.d.ts +1 -1
- package/dist/components/UIOverlay/index.js +17 -17
- package/dist/components/UIPersona/UIPersona.d.ts +27 -27
- package/dist/components/UIPersona/UIPersona.js +48 -48
- package/dist/components/UIPersona/index.d.ts +1 -1
- package/dist/components/UIPersona/index.js +17 -17
- package/dist/components/UISearchBox/UISearchBox.d.ts +22 -22
- package/dist/components/UISearchBox/UISearchBox.js +153 -153
- package/dist/components/UISearchBox/index.d.ts +3 -3
- package/dist/components/UISearchBox/index.js +17 -17
- package/dist/components/UISection/UISection.d.ts +34 -34
- package/dist/components/UISection/UISection.js +44 -44
- package/dist/components/UISection/UISection.scss +76 -76
- package/dist/components/UISection/UISections.d.ts +249 -249
- package/dist/components/UISection/UISections.js +707 -707
- package/dist/components/UISection/UISections.scss +62 -62
- package/dist/components/UISection/UISplitter.d.ts +96 -96
- package/dist/components/UISection/UISplitter.js +220 -220
- package/dist/components/UISection/UISplitter.scss +212 -212
- package/dist/components/UISection/_mixins.scss +14 -14
- package/dist/components/UISection/_variables.scss +1 -1
- package/dist/components/UISection/index.d.ts +3 -3
- package/dist/components/UISection/index.js +19 -19
- package/dist/components/UISeparator/UISeparator.d.ts +25 -25
- package/dist/components/UISeparator/UISeparator.js +65 -65
- package/dist/components/UISeparator/index.d.ts +1 -1
- package/dist/components/UISeparator/index.js +17 -17
- package/dist/components/UITable/UITable-helper.d.ts +79 -79
- package/dist/components/UITable/UITable-helper.js +259 -259
- package/dist/components/UITable/UITable.d.ts +212 -212
- package/dist/components/UITable/UITable.js +775 -775
- package/dist/components/UITable/UITable.scss +194 -194
- package/dist/components/UITable/index.d.ts +2 -2
- package/dist/components/UITable/index.js +18 -18
- package/dist/components/UITable/types.d.ts +77 -77
- package/dist/components/UITable/types.js +28 -28
- package/dist/components/UITabs/UITabs.d.ts +28 -28
- package/dist/components/UITabs/UITabs.js +70 -70
- package/dist/components/UITabs/index.d.ts +1 -1
- package/dist/components/UITabs/index.js +17 -17
- package/dist/components/UIToggle/UIToggle.d.ts +39 -39
- package/dist/components/UIToggle/UIToggle.js +181 -181
- package/dist/components/UIToggle/index.d.ts +1 -1
- package/dist/components/UIToggle/index.js +17 -17
- package/dist/components/UIToggleGroup/UIToggleGroup.d.ts +31 -31
- package/dist/components/UIToggleGroup/UIToggleGroup.js +136 -136
- package/dist/components/UIToggleGroup/UIToggleGroup.scss +13 -13
- package/dist/components/UIToggleGroup/UIToggleGroup.types.d.ts +22 -22
- package/dist/components/UIToggleGroup/UIToggleGroup.types.js +2 -2
- package/dist/components/UIToggleGroup/UIToggleGroupOption/UIToggleGroupOption.d.ts +25 -25
- package/dist/components/UIToggleGroup/UIToggleGroupOption/UIToggleGroupOption.js +77 -77
- package/dist/components/UIToggleGroup/UIToggleGroupOption/UIToggleGroupOption.scss +74 -74
- package/dist/components/UIToggleGroup/UIToggleGroupOption/UIToggleGroupOption.types.d.ts +10 -10
- package/dist/components/UIToggleGroup/UIToggleGroupOption/UIToggleGroupOption.types.js +2 -2
- package/dist/components/UIToggleGroup/UIToggleGroupOption/index.d.ts +2 -2
- package/dist/components/UIToggleGroup/UIToggleGroupOption/index.js +18 -18
- package/dist/components/UIToggleGroup/index.d.ts +2 -2
- package/dist/components/UIToggleGroup/index.js +18 -18
- package/dist/components/UIToolbar/UIToolbar.d.ts +36 -36
- package/dist/components/UIToolbar/UIToolbar.js +104 -104
- package/dist/components/UIToolbar/UIToolbar.scss +48 -48
- package/dist/components/UIToolbar/UIToolbarColumn.d.ts +7 -7
- package/dist/components/UIToolbar/UIToolbarColumn.js +33 -33
- package/dist/components/UIToolbar/UIToolbarDivider.d.ts +27 -27
- package/dist/components/UIToolbar/UIToolbarDivider.js +56 -56
- package/dist/components/UIToolbar/index.d.ts +3 -3
- package/dist/components/UIToolbar/index.js +19 -19
- package/dist/components/UITooltip/UITooltip.d.ts +29 -29
- package/dist/components/UITooltip/UITooltip.js +77 -77
- package/dist/components/UITooltip/UITooltipUtils.d.ts +17 -17
- package/dist/components/UITooltip/UITooltipUtils.js +45 -45
- package/dist/components/UITooltip/index.d.ts +2 -2
- package/dist/components/UITooltip/index.js +18 -18
- package/dist/components/UITranslationInput/UIFormattedText.d.ts +46 -46
- package/dist/components/UITranslationInput/UIFormattedText.js +121 -121
- package/dist/components/UITranslationInput/UILoadButton.d.ts +52 -52
- package/dist/components/UITranslationInput/UILoadButton.js +109 -109
- package/dist/components/UITranslationInput/UILoadButton.scss +14 -14
- package/dist/components/UITranslationInput/UITranslationButton.d.ts +14 -14
- package/dist/components/UITranslationInput/UITranslationButton.js +88 -88
- package/dist/components/UITranslationInput/UITranslationButton.types.d.ts +67 -67
- package/dist/components/UITranslationInput/UITranslationButton.types.js +21 -21
- package/dist/components/UITranslationInput/UITranslationInput.d.ts +25 -25
- package/dist/components/UITranslationInput/UITranslationInput.js +169 -169
- package/dist/components/UITranslationInput/UITranslationInput.scss +40 -40
- package/dist/components/UITranslationInput/UITranslationUtils.d.ts +64 -64
- package/dist/components/UITranslationInput/UITranslationUtils.js +168 -168
- package/dist/components/UITranslationInput/defaults.d.ts +2 -2
- package/dist/components/UITranslationInput/defaults.js +15 -15
- package/dist/components/UITranslationInput/index.d.ts +2 -2
- package/dist/components/UITranslationInput/index.js +18 -18
- package/dist/components/UITreeDropdown/UITreeDropdown.d.ts +265 -265
- package/dist/components/UITreeDropdown/UITreeDropdown.js +661 -661
- package/dist/components/UITreeDropdown/UITreeDropdown.scss +64 -64
- package/dist/components/UITreeDropdown/index.d.ts +1 -1
- package/dist/components/UITreeDropdown/index.js +17 -17
- package/dist/components/UIVerticalDivider/UIVerticalDivider.d.ts +23 -23
- package/dist/components/UIVerticalDivider/UIVerticalDivider.js +41 -41
- package/dist/components/UIVerticalDivider/index.d.ts +1 -1
- package/dist/components/UIVerticalDivider/index.js +17 -17
- package/dist/components/UIVirtualList/UIAutoSizer.d.ts +22 -22
- package/dist/components/UIVirtualList/UIAutoSizer.js +33 -33
- package/dist/components/UIVirtualList/UICellMeasurer.d.ts +23 -23
- package/dist/components/UIVirtualList/UICellMeasurer.js +33 -33
- package/dist/components/UIVirtualList/UIVirtualList.d.ts +43 -43
- package/dist/components/UIVirtualList/UIVirtualList.js +70 -70
- package/dist/components/UIVirtualList/index.d.ts +3 -3
- package/dist/components/UIVirtualList/index.js +19 -19
- package/dist/components/index.d.ts +37 -37
- package/dist/components/index.js +53 -53
- package/dist/helper/ValidationMessage/MessageWrapper.d.ts +17 -17
- package/dist/helper/ValidationMessage/MessageWrapper.js +34 -34
- package/dist/helper/ValidationMessage/MessageWrapper.scss +44 -44
- package/dist/helper/ValidationMessage/index.d.ts +2 -2
- package/dist/helper/ValidationMessage/index.js +18 -18
- package/dist/helper/ValidationMessage/utils.d.ts +31 -31
- package/dist/helper/ValidationMessage/utils.js +121 -121
- package/dist/index.d.ts +2 -2
- package/dist/index.js +18 -18
- package/dist/styles/_mixins.scss +15 -15
- package/dist/styles/_typography.scss +72 -72
- package/dist/styles/_variables.scss +26 -26
- package/dist/styles/ui-components.scss +3 -3
- package/dist/utilities/DeepMerge.d.ts +10 -10
- package/dist/utilities/DeepMerge.js +48 -48
- package/dist/utilities/Focus.d.ts +4 -4
- package/dist/utilities/Focus.js +7 -7
- package/dist/utilities/Id.d.ts +2 -2
- package/dist/utilities/Id.js +5 -5
- package/dist/utilities/Keys.d.ts +2 -2
- package/dist/utilities/Keys.js +5 -5
- package/dist/utilities/index.d.ts +3 -3
- package/dist/utilities/index.js +19 -19
- package/package.json +11 -12
- package/storybook/183.d7ada8f4159c95c30527.manager.bundle.js +891 -0
- package/storybook/260.1c2260a4.iframe.bundle.js +292 -0
- package/storybook/275.02c0af0f1d3b6c70e72d.manager.bundle.js +10 -0
- package/storybook/453.6e0cb2b5c2ede7af85c5.manager.bundle.js +2 -0
- package/storybook/{458.a8cb7c68775e3858b342.manager.bundle.js → 458.05b97cebc6fa3809e87a.manager.bundle.js} +113 -113
- package/storybook/{594.4816ff3f4edb5b8b0949.manager.bundle.js → 594.4d8bf523158b8a4a1ca9.manager.bundle.js} +1 -1
- package/storybook/{637.173c8d06.iframe.bundle.js → 637.149b545a.iframe.bundle.js} +1 -1
- package/storybook/{966.bc8dd3d7eec539544b33.manager.bundle.js → 966.7154988e86ea89b1942c.manager.bundle.js} +3 -3
- package/storybook/{987.81102a5d201c9f5a1528.manager.bundle.js → 987.7aa55d838ce2874baae8.manager.bundle.js} +3 -3
- package/storybook/iframe.html +17 -17
- package/storybook/index.html +119 -119
- package/storybook/{main.73db1398c1704e93ba73.manager.bundle.js → main.bbce46728b43f51e7d37.manager.bundle.js} +1 -1
- package/storybook/main.fdca8543.iframe.bundle.js +99 -0
- package/storybook/project.json +1 -1
- package/storybook/{runtime~main.769376b3.iframe.bundle.js → runtime~main.a1df0937.iframe.bundle.js} +1 -1
- package/storybook/runtime~main.e938cbae9eda438313f6.manager.bundle.js +2 -0
- package/storybook/275.a8ff63b0ed4a5d620142.manager.bundle.js +0 -10
- package/storybook/453.af4e8cc44257a27c435f.manager.bundle.js +0 -2
- package/storybook/713.ec72f301.iframe.bundle.js +0 -292
- package/storybook/756.edf22bba3c06d7815c54.manager.bundle.js +0 -891
- package/storybook/main.4bf0e1ff.iframe.bundle.js +0 -99
- package/storybook/runtime~main.eabd5638d9f3e40b3501.manager.bundle.js +0 -2
|
@@ -1,62 +1,62 @@
|
|
|
1
|
-
@import '_variables.scss';
|
|
2
|
-
|
|
3
|
-
.sections {
|
|
4
|
-
position: relative;
|
|
5
|
-
overflow: hidden;
|
|
6
|
-
&--horizontal {
|
|
7
|
-
height: 100%;
|
|
8
|
-
.sections__item {
|
|
9
|
-
height: 100%;
|
|
10
|
-
}
|
|
11
|
-
}
|
|
12
|
-
&--vertical {
|
|
13
|
-
width: 100%;
|
|
14
|
-
.sections__item {
|
|
15
|
-
width: 100%;
|
|
16
|
-
}
|
|
17
|
-
}
|
|
18
|
-
.sections__item {
|
|
19
|
-
position: absolute;
|
|
20
|
-
}
|
|
21
|
-
// Animation
|
|
22
|
-
&--animated {
|
|
23
|
-
.sections__item {
|
|
24
|
-
transition: all 300ms ease 0s;
|
|
25
|
-
}
|
|
26
|
-
&.sections--horizontal {
|
|
27
|
-
.sections__item {
|
|
28
|
-
transition-property: transform, left, right;
|
|
29
|
-
}
|
|
30
|
-
}
|
|
31
|
-
&.sections--vertical {
|
|
32
|
-
.sections__item {
|
|
33
|
-
transition-property: transform, top, bottom;
|
|
34
|
-
}
|
|
35
|
-
}
|
|
36
|
-
}
|
|
37
|
-
&.sections--horizontal {
|
|
38
|
-
// Toggle splitter
|
|
39
|
-
.sections__item--toggle {
|
|
40
|
-
&.sections__item--hidden {
|
|
41
|
-
transform: translateX(100%);
|
|
42
|
-
}
|
|
43
|
-
}
|
|
44
|
-
.sections__item--toggle {
|
|
45
|
-
max-width: calc(100% - #{$splitter-size + 10});
|
|
46
|
-
}
|
|
47
|
-
> .sections__item:first-child {
|
|
48
|
-
padding-right: calc($splitter-size / 2);
|
|
49
|
-
}
|
|
50
|
-
}
|
|
51
|
-
&.sections--vertical {
|
|
52
|
-
// Toggle splitter
|
|
53
|
-
.sections__item--toggle {
|
|
54
|
-
&.sections__item--hidden {
|
|
55
|
-
transform: translateY(100%);
|
|
56
|
-
}
|
|
57
|
-
}
|
|
58
|
-
.sections__item--toggle {
|
|
59
|
-
max-height: calc(100% - #{$splitter-size + 10});
|
|
60
|
-
}
|
|
61
|
-
}
|
|
62
|
-
}
|
|
1
|
+
@import '_variables.scss';
|
|
2
|
+
|
|
3
|
+
.sections {
|
|
4
|
+
position: relative;
|
|
5
|
+
overflow: hidden;
|
|
6
|
+
&--horizontal {
|
|
7
|
+
height: 100%;
|
|
8
|
+
.sections__item {
|
|
9
|
+
height: 100%;
|
|
10
|
+
}
|
|
11
|
+
}
|
|
12
|
+
&--vertical {
|
|
13
|
+
width: 100%;
|
|
14
|
+
.sections__item {
|
|
15
|
+
width: 100%;
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
.sections__item {
|
|
19
|
+
position: absolute;
|
|
20
|
+
}
|
|
21
|
+
// Animation
|
|
22
|
+
&--animated {
|
|
23
|
+
.sections__item {
|
|
24
|
+
transition: all 300ms ease 0s;
|
|
25
|
+
}
|
|
26
|
+
&.sections--horizontal {
|
|
27
|
+
.sections__item {
|
|
28
|
+
transition-property: transform, left, right;
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
&.sections--vertical {
|
|
32
|
+
.sections__item {
|
|
33
|
+
transition-property: transform, top, bottom;
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
}
|
|
37
|
+
&.sections--horizontal {
|
|
38
|
+
// Toggle splitter
|
|
39
|
+
.sections__item--toggle {
|
|
40
|
+
&.sections__item--hidden {
|
|
41
|
+
transform: translateX(100%);
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
.sections__item--toggle {
|
|
45
|
+
max-width: calc(100% - #{$splitter-size + 10});
|
|
46
|
+
}
|
|
47
|
+
> .sections__item:first-child {
|
|
48
|
+
padding-right: calc($splitter-size / 2);
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
&.sections--vertical {
|
|
52
|
+
// Toggle splitter
|
|
53
|
+
.sections__item--toggle {
|
|
54
|
+
&.sections__item--hidden {
|
|
55
|
+
transform: translateY(100%);
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
.sections__item--toggle {
|
|
59
|
+
max-height: calc(100% - #{$splitter-size + 10});
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
}
|
|
@@ -1,97 +1,97 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import './UISplitter.scss';
|
|
3
|
-
export interface UISplitterProps {
|
|
4
|
-
type: UISplitterType;
|
|
5
|
-
vertical?: boolean;
|
|
6
|
-
hidden?: boolean;
|
|
7
|
-
onResizeStart?: () => void;
|
|
8
|
-
onResize: (position: number) => boolean;
|
|
9
|
-
onResizeEnd?: () => void;
|
|
10
|
-
onToggle?: () => void;
|
|
11
|
-
title?: string;
|
|
12
|
-
splitterLayoutType?: UISplitterLayoutType;
|
|
13
|
-
}
|
|
14
|
-
export declare enum UISplitterType {
|
|
15
|
-
Resize = "resize",
|
|
16
|
-
Toggle = "toggle"
|
|
17
|
-
}
|
|
18
|
-
export declare enum UISplitterLayoutType {
|
|
19
|
-
Standard = "standard",
|
|
20
|
-
Compact = "compact"
|
|
21
|
-
}
|
|
22
|
-
/**
|
|
23
|
-
*
|
|
24
|
-
*/
|
|
25
|
-
export declare class UISplitter extends React.Component<UISplitterProps> {
|
|
26
|
-
private readonly splitterOverlay;
|
|
27
|
-
private readonly mousedownPosition;
|
|
28
|
-
private readonly rootRef;
|
|
29
|
-
private readonly size;
|
|
30
|
-
private readonly compactSize;
|
|
31
|
-
private animationFrame?;
|
|
32
|
-
/**
|
|
33
|
-
*
|
|
34
|
-
* @param props
|
|
35
|
-
*/
|
|
36
|
-
constructor(props: UISplitterProps);
|
|
37
|
-
/**
|
|
38
|
-
* Method called on mousedown over splitter.
|
|
39
|
-
* Method would start resize session.
|
|
40
|
-
*
|
|
41
|
-
* @param {React.MouseEvent} event Mouse.
|
|
42
|
-
*/
|
|
43
|
-
private startSplitterMove;
|
|
44
|
-
/**
|
|
45
|
-
* Method called when resize session is in progress and user moves mouse.
|
|
46
|
-
*
|
|
47
|
-
* @param {React.MouseEvent} event Mouse event.
|
|
48
|
-
*/
|
|
49
|
-
private doMousemoveResize;
|
|
50
|
-
/**
|
|
51
|
-
* Method which receives new delta position of splitter and updates DOM with calling callback.
|
|
52
|
-
*
|
|
53
|
-
* @param {number} deltaPosition Delta position of splitter.
|
|
54
|
-
*/
|
|
55
|
-
private doResize;
|
|
56
|
-
/**
|
|
57
|
-
* Method called on mouseup or mouseleave events.
|
|
58
|
-
* Method would end resize session.
|
|
59
|
-
*/
|
|
60
|
-
private stopMousemoveResize;
|
|
61
|
-
/**
|
|
62
|
-
* Method to update splitter DOM and events depending on if resize started or ended.
|
|
63
|
-
*
|
|
64
|
-
* @param {boolean} start Resize is started or ended.
|
|
65
|
-
*/
|
|
66
|
-
private updateSplitterEvents;
|
|
67
|
-
/**
|
|
68
|
-
* Method called when clicked over splitter and splitter type is 'Toggle'.
|
|
69
|
-
*/
|
|
70
|
-
private toggleSplitter;
|
|
71
|
-
/**
|
|
72
|
-
* Gets icon.
|
|
73
|
-
*
|
|
74
|
-
* @param type
|
|
75
|
-
* @param splitterLayoutType
|
|
76
|
-
* @returns {string}
|
|
77
|
-
*/
|
|
78
|
-
private getIcon;
|
|
79
|
-
/**
|
|
80
|
-
* Method called when keydown events fired while splitter is focused.
|
|
81
|
-
* Method enables support for resize using keyboard.
|
|
82
|
-
*
|
|
83
|
-
* @param {React.KeyboardEvent<HTMLDivElement>} event KeyDown event.
|
|
84
|
-
*/
|
|
85
|
-
private onKeyDown;
|
|
86
|
-
/**
|
|
87
|
-
* Method returns class names string depending on props and component state.
|
|
88
|
-
*
|
|
89
|
-
* @returns {number} Minimal size of section.
|
|
90
|
-
*/
|
|
91
|
-
getClassNames(): string;
|
|
92
|
-
/**
|
|
93
|
-
* @returns {React.ReactElement}
|
|
94
|
-
*/
|
|
95
|
-
render(): React.ReactElement;
|
|
96
|
-
}
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import './UISplitter.scss';
|
|
3
|
+
export interface UISplitterProps {
|
|
4
|
+
type: UISplitterType;
|
|
5
|
+
vertical?: boolean;
|
|
6
|
+
hidden?: boolean;
|
|
7
|
+
onResizeStart?: () => void;
|
|
8
|
+
onResize: (position: number) => boolean;
|
|
9
|
+
onResizeEnd?: () => void;
|
|
10
|
+
onToggle?: () => void;
|
|
11
|
+
title?: string;
|
|
12
|
+
splitterLayoutType?: UISplitterLayoutType;
|
|
13
|
+
}
|
|
14
|
+
export declare enum UISplitterType {
|
|
15
|
+
Resize = "resize",
|
|
16
|
+
Toggle = "toggle"
|
|
17
|
+
}
|
|
18
|
+
export declare enum UISplitterLayoutType {
|
|
19
|
+
Standard = "standard",
|
|
20
|
+
Compact = "compact"
|
|
21
|
+
}
|
|
22
|
+
/**
|
|
23
|
+
*
|
|
24
|
+
*/
|
|
25
|
+
export declare class UISplitter extends React.Component<UISplitterProps> {
|
|
26
|
+
private readonly splitterOverlay;
|
|
27
|
+
private readonly mousedownPosition;
|
|
28
|
+
private readonly rootRef;
|
|
29
|
+
private readonly size;
|
|
30
|
+
private readonly compactSize;
|
|
31
|
+
private animationFrame?;
|
|
32
|
+
/**
|
|
33
|
+
*
|
|
34
|
+
* @param props
|
|
35
|
+
*/
|
|
36
|
+
constructor(props: UISplitterProps);
|
|
37
|
+
/**
|
|
38
|
+
* Method called on mousedown over splitter.
|
|
39
|
+
* Method would start resize session.
|
|
40
|
+
*
|
|
41
|
+
* @param {React.MouseEvent} event Mouse.
|
|
42
|
+
*/
|
|
43
|
+
private startSplitterMove;
|
|
44
|
+
/**
|
|
45
|
+
* Method called when resize session is in progress and user moves mouse.
|
|
46
|
+
*
|
|
47
|
+
* @param {React.MouseEvent} event Mouse event.
|
|
48
|
+
*/
|
|
49
|
+
private doMousemoveResize;
|
|
50
|
+
/**
|
|
51
|
+
* Method which receives new delta position of splitter and updates DOM with calling callback.
|
|
52
|
+
*
|
|
53
|
+
* @param {number} deltaPosition Delta position of splitter.
|
|
54
|
+
*/
|
|
55
|
+
private doResize;
|
|
56
|
+
/**
|
|
57
|
+
* Method called on mouseup or mouseleave events.
|
|
58
|
+
* Method would end resize session.
|
|
59
|
+
*/
|
|
60
|
+
private stopMousemoveResize;
|
|
61
|
+
/**
|
|
62
|
+
* Method to update splitter DOM and events depending on if resize started or ended.
|
|
63
|
+
*
|
|
64
|
+
* @param {boolean} start Resize is started or ended.
|
|
65
|
+
*/
|
|
66
|
+
private updateSplitterEvents;
|
|
67
|
+
/**
|
|
68
|
+
* Method called when clicked over splitter and splitter type is 'Toggle'.
|
|
69
|
+
*/
|
|
70
|
+
private toggleSplitter;
|
|
71
|
+
/**
|
|
72
|
+
* Gets icon.
|
|
73
|
+
*
|
|
74
|
+
* @param type
|
|
75
|
+
* @param splitterLayoutType
|
|
76
|
+
* @returns {string}
|
|
77
|
+
*/
|
|
78
|
+
private getIcon;
|
|
79
|
+
/**
|
|
80
|
+
* Method called when keydown events fired while splitter is focused.
|
|
81
|
+
* Method enables support for resize using keyboard.
|
|
82
|
+
*
|
|
83
|
+
* @param {React.KeyboardEvent<HTMLDivElement>} event KeyDown event.
|
|
84
|
+
*/
|
|
85
|
+
private onKeyDown;
|
|
86
|
+
/**
|
|
87
|
+
* Method returns class names string depending on props and component state.
|
|
88
|
+
*
|
|
89
|
+
* @returns {number} Minimal size of section.
|
|
90
|
+
*/
|
|
91
|
+
getClassNames(): string;
|
|
92
|
+
/**
|
|
93
|
+
* @returns {React.ReactElement}
|
|
94
|
+
*/
|
|
95
|
+
render(): React.ReactElement;
|
|
96
|
+
}
|
|
97
97
|
//# sourceMappingURL=UISplitter.d.ts.map
|