@vkontakte/vkui 4.26.0 → 4.27.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.cache/.eslintcache +1 -1
- package/.cache/.stylelintcache +1 -1
- package/.cache/.tsbuildinfo +210 -85
- package/.cache/ts/src/components/ActionSheetItem/ActionSheetItem.d.ts +1 -2
- package/.cache/ts/src/components/Alert/Alert.d.ts +1 -2
- package/.cache/ts/src/components/AppearanceProvider/AppearanceProvider.d.ts +1 -0
- package/.cache/ts/src/components/Card/Card.d.ts +1 -2
- package/.cache/ts/src/components/CardScroll/CardScroll.d.ts +4 -7
- package/.cache/ts/src/components/Chip/Chip.d.ts +2 -2
- package/.cache/ts/src/components/ConfigProvider/ConfigProvider.d.ts +1 -1
- package/.cache/ts/src/components/ConfigProvider/ConfigProviderContext.d.ts +5 -5
- package/.cache/ts/src/components/Gradient/Gradient.d.ts +1 -2
- package/.cache/ts/src/components/SegmentedControl/SegmentedControl.d.ts +17 -0
- package/.cache/ts/src/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.d.ts +4 -0
- package/.cache/ts/src/components/SliderSwitch/SliderSwitch.d.ts +6 -2
- package/.cache/ts/src/components/SliderSwitch/SliderSwitchButton.d.ts +4 -2
- package/.cache/ts/src/components/Switch/Switch.d.ts +3 -2
- package/.cache/ts/src/components/Typography/Title/Title.d.ts +4 -1
- package/.cache/ts/src/components/VisuallyHiddenInput/VisuallyHiddenInput.d.ts +12 -0
- package/.cache/ts/src/hooks/usePlatform.d.ts +1 -1
- package/.cache/ts/src/index.d.ts +7 -5
- package/.cache/ts/src/lib/utils.d.ts +1 -0
- package/.cache/ts/src/tokenized/index.d.ts +6 -0
- package/VKUI_TOKENS_MIGRATION_GUIDE.md +2 -1
- package/dist/cjs/components/ActionSheetItem/ActionSheetItem.d.ts +1 -2
- package/dist/cjs/components/ActionSheetItem/ActionSheetItem.js +16 -10
- package/dist/cjs/components/ActionSheetItem/ActionSheetItem.js.map +1 -1
- package/dist/cjs/components/Alert/Alert.d.ts +1 -2
- package/dist/cjs/components/Alert/Alert.js +12 -12
- package/dist/cjs/components/Alert/Alert.js.map +1 -1
- package/dist/cjs/components/AppearanceProvider/AppearanceProvider.d.ts +1 -0
- package/dist/cjs/components/AppearanceProvider/AppearanceProvider.js +29 -2
- package/dist/cjs/components/AppearanceProvider/AppearanceProvider.js.map +1 -1
- package/dist/cjs/components/Banner/Banner.js +1 -1
- package/dist/cjs/components/Banner/Banner.js.map +1 -1
- package/dist/cjs/components/Button/Button.js +9 -1
- package/dist/cjs/components/Button/Button.js.map +1 -1
- package/dist/cjs/components/Card/Card.d.ts +1 -2
- package/dist/cjs/components/Card/Card.js +4 -8
- package/dist/cjs/components/Card/Card.js.map +1 -1
- package/dist/cjs/components/CardScroll/CardScroll.d.ts +4 -7
- package/dist/cjs/components/CardScroll/CardScroll.js +11 -15
- package/dist/cjs/components/CardScroll/CardScroll.js.map +1 -1
- package/dist/cjs/components/Chip/Chip.d.ts +2 -2
- package/dist/cjs/components/Chip/Chip.js +3 -5
- package/dist/cjs/components/Chip/Chip.js.map +1 -1
- package/dist/cjs/components/ChipsInput/ChipsInput.js +2 -2
- package/dist/cjs/components/ChipsInput/ChipsInput.js.map +1 -1
- package/dist/cjs/components/ConfigProvider/ConfigProvider.d.ts +1 -1
- package/dist/cjs/components/ConfigProvider/ConfigProvider.js +1 -26
- package/dist/cjs/components/ConfigProvider/ConfigProvider.js.map +1 -1
- package/dist/cjs/components/ConfigProvider/ConfigProviderContext.d.ts +5 -5
- package/dist/cjs/components/ConfigProvider/ConfigProviderContext.js.map +1 -1
- package/dist/cjs/components/ContentCard/ContentCard.js +4 -4
- package/dist/cjs/components/ContentCard/ContentCard.js.map +1 -1
- package/dist/cjs/components/Gradient/Gradient.d.ts +1 -2
- package/dist/cjs/components/Gradient/Gradient.js +6 -10
- package/dist/cjs/components/Gradient/Gradient.js.map +1 -1
- package/dist/cjs/components/Header/Header.js +1 -1
- package/dist/cjs/components/Header/Header.js.map +1 -1
- package/dist/cjs/components/ModalCardBase/ModalCardBase.js +1 -1
- package/dist/cjs/components/ModalCardBase/ModalCardBase.js.map +1 -1
- package/dist/cjs/components/PanelHeaderButton/PanelHeaderButton.js +1 -1
- package/dist/cjs/components/PanelHeaderButton/PanelHeaderButton.js.map +1 -1
- package/dist/cjs/components/Placeholder/Placeholder.js +1 -1
- package/dist/cjs/components/Placeholder/Placeholder.js.map +1 -1
- package/dist/cjs/components/Search/Search.js +47 -23
- package/dist/cjs/components/Search/Search.js.map +1 -1
- package/dist/cjs/components/SegmentedControl/SegmentedControl.d.ts +17 -0
- package/dist/cjs/components/SegmentedControl/SegmentedControl.js +116 -0
- package/dist/cjs/components/SegmentedControl/SegmentedControl.js.map +1 -0
- package/dist/cjs/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.d.ts +4 -0
- package/dist/cjs/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.js +61 -0
- package/dist/cjs/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.js.map +1 -0
- package/dist/cjs/components/SimpleCell/SimpleCell.js +21 -8
- package/dist/cjs/components/SimpleCell/SimpleCell.js.map +1 -1
- package/dist/cjs/components/SliderSwitch/SliderSwitch.d.ts +6 -2
- package/dist/cjs/components/SliderSwitch/SliderSwitch.js +18 -6
- package/dist/cjs/components/SliderSwitch/SliderSwitch.js.map +1 -1
- package/dist/cjs/components/SliderSwitch/SliderSwitchButton.d.ts +4 -2
- package/dist/cjs/components/SliderSwitch/SliderSwitchButton.js +6 -5
- package/dist/cjs/components/SliderSwitch/SliderSwitchButton.js.map +1 -1
- package/dist/cjs/components/Switch/Switch.d.ts +3 -2
- package/dist/cjs/components/Switch/Switch.js +3 -6
- package/dist/cjs/components/Switch/Switch.js.map +1 -1
- package/dist/cjs/components/Typography/Title/Title.d.ts +4 -1
- package/dist/cjs/components/Typography/Title/Title.js +9 -19
- package/dist/cjs/components/Typography/Title/Title.js.map +1 -1
- package/dist/cjs/components/VisuallyHiddenInput/VisuallyHiddenInput.d.ts +12 -0
- package/dist/cjs/components/VisuallyHiddenInput/VisuallyHiddenInput.js +37 -0
- package/dist/cjs/components/VisuallyHiddenInput/VisuallyHiddenInput.js.map +1 -0
- package/dist/cjs/hooks/usePlatform.d.ts +1 -1
- package/dist/cjs/hooks/usePlatform.js.map +1 -1
- package/dist/cjs/index.d.ts +7 -5
- package/dist/cjs/index.js +18 -10
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/lib/utils.d.ts +1 -0
- package/dist/cjs/lib/utils.js +7 -0
- package/dist/cjs/lib/utils.js.map +1 -1
- package/dist/cjs/tokenized/index.d.ts +6 -0
- package/dist/cjs/tokenized/index.js +24 -0
- package/dist/cjs/tokenized/index.js.map +1 -1
- package/dist/components/ActionSheetItem/ActionSheetItem.d.ts +1 -2
- package/dist/components/ActionSheetItem/ActionSheetItem.js +14 -10
- package/dist/components/ActionSheetItem/ActionSheetItem.js.map +1 -1
- package/dist/components/Alert/Alert.d.ts +1 -2
- package/dist/components/Alert/Alert.js +11 -12
- package/dist/components/Alert/Alert.js.map +1 -1
- package/dist/components/AppearanceProvider/AppearanceProvider.d.ts +1 -0
- package/dist/components/AppearanceProvider/AppearanceProvider.js +24 -1
- package/dist/components/AppearanceProvider/AppearanceProvider.js.map +1 -1
- package/dist/components/Banner/Banner.js +1 -1
- package/dist/components/Banner/Banner.js.map +1 -1
- package/dist/components/Button/Button.js +9 -2
- package/dist/components/Button/Button.js.map +1 -1
- package/dist/components/Card/Card.d.ts +1 -2
- package/dist/components/Card/Card.js +3 -9
- package/dist/components/Card/Card.js.map +1 -1
- package/dist/components/CardScroll/CardScroll.d.ts +4 -7
- package/dist/components/CardScroll/CardScroll.js +9 -14
- package/dist/components/CardScroll/CardScroll.js.map +1 -1
- package/dist/components/Chip/Chip.d.ts +2 -2
- package/dist/components/Chip/Chip.js +2 -6
- package/dist/components/Chip/Chip.js.map +1 -1
- package/dist/components/ChipsInput/ChipsInput.js +1 -1
- package/dist/components/ChipsInput/ChipsInput.js.map +1 -1
- package/dist/components/ConfigProvider/ConfigProvider.d.ts +1 -1
- package/dist/components/ConfigProvider/ConfigProvider.js +1 -25
- package/dist/components/ConfigProvider/ConfigProvider.js.map +1 -1
- package/dist/components/ConfigProvider/ConfigProviderContext.d.ts +5 -5
- package/dist/components/ConfigProvider/ConfigProviderContext.js.map +1 -1
- package/dist/components/ContentCard/ContentCard.js +3 -3
- package/dist/components/ContentCard/ContentCard.js.map +1 -1
- package/dist/components/Gradient/Gradient.d.ts +1 -2
- package/dist/components/Gradient/Gradient.js +5 -11
- package/dist/components/Gradient/Gradient.js.map +1 -1
- package/dist/components/Header/Header.js +1 -1
- package/dist/components/Header/Header.js.map +1 -1
- package/dist/components/ModalCardBase/ModalCardBase.js +2 -2
- package/dist/components/ModalCardBase/ModalCardBase.js.map +1 -1
- package/dist/components/PanelHeaderButton/PanelHeaderButton.js +1 -1
- package/dist/components/PanelHeaderButton/PanelHeaderButton.js.map +1 -1
- package/dist/components/Placeholder/Placeholder.js +1 -1
- package/dist/components/Placeholder/Placeholder.js.map +1 -1
- package/dist/components/Search/Search.js +45 -22
- package/dist/components/Search/Search.js.map +1 -1
- package/dist/components/SegmentedControl/SegmentedControl.d.ts +17 -0
- package/dist/components/SegmentedControl/SegmentedControl.js +94 -0
- package/dist/components/SegmentedControl/SegmentedControl.js.map +1 -0
- package/dist/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.d.ts +4 -0
- package/dist/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.js +40 -0
- package/dist/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.js.map +1 -0
- package/dist/components/SimpleCell/SimpleCell.js +21 -9
- package/dist/components/SimpleCell/SimpleCell.js.map +1 -1
- package/dist/components/SliderSwitch/SliderSwitch.d.ts +6 -2
- package/dist/components/SliderSwitch/SliderSwitch.js +14 -3
- package/dist/components/SliderSwitch/SliderSwitch.js.map +1 -1
- package/dist/components/SliderSwitch/SliderSwitchButton.d.ts +4 -2
- package/dist/components/SliderSwitch/SliderSwitchButton.js +5 -5
- package/dist/components/SliderSwitch/SliderSwitchButton.js.map +1 -1
- package/dist/components/Switch/Switch.d.ts +3 -2
- package/dist/components/Switch/Switch.js +3 -6
- package/dist/components/Switch/Switch.js.map +1 -1
- package/dist/components/Typography/Title/Title.d.ts +4 -1
- package/dist/components/Typography/Title/Title.js +7 -16
- package/dist/components/Typography/Title/Title.js.map +1 -1
- package/dist/components/VisuallyHiddenInput/VisuallyHiddenInput.d.ts +12 -0
- package/dist/components/VisuallyHiddenInput/VisuallyHiddenInput.js +23 -0
- package/dist/components/VisuallyHiddenInput/VisuallyHiddenInput.js.map +1 -0
- package/dist/components.css +5 -5
- package/dist/components.css.map +1 -1
- package/dist/cssm/components/ActionSheetItem/ActionSheetItem.js +14 -10
- package/dist/cssm/components/ActionSheetItem/ActionSheetItem.js.map +1 -1
- package/dist/cssm/components/Alert/Alert.js +11 -12
- package/dist/cssm/components/Alert/Alert.js.map +1 -1
- package/dist/cssm/components/AppearanceProvider/AppearanceProvider.js +24 -1
- package/dist/cssm/components/AppearanceProvider/AppearanceProvider.js.map +1 -1
- package/dist/cssm/components/Banner/Banner.js +1 -1
- package/dist/cssm/components/Banner/Banner.js.map +1 -1
- package/dist/cssm/components/Button/Button.js +9 -2
- package/dist/cssm/components/Button/Button.js.map +1 -1
- package/dist/cssm/components/Card/Card.css +2 -2
- package/dist/cssm/components/Card/Card.js +3 -9
- package/dist/cssm/components/Card/Card.js.map +1 -1
- package/dist/cssm/components/CardScroll/CardScroll.css +1 -1
- package/dist/cssm/components/CardScroll/CardScroll.js +9 -14
- package/dist/cssm/components/CardScroll/CardScroll.js.map +1 -1
- package/dist/cssm/components/Chip/Chip.js +2 -6
- package/dist/cssm/components/Chip/Chip.js.map +1 -1
- package/dist/cssm/components/ChipsInput/ChipsInput.js +1 -1
- package/dist/cssm/components/ChipsInput/ChipsInput.js.map +1 -1
- package/dist/cssm/components/ConfigProvider/ConfigProvider.js +1 -25
- package/dist/cssm/components/ConfigProvider/ConfigProvider.js.map +1 -1
- package/dist/cssm/components/ConfigProvider/ConfigProviderContext.js.map +1 -1
- package/dist/cssm/components/ContentCard/ContentCard.js +3 -3
- package/dist/cssm/components/ContentCard/ContentCard.js.map +1 -1
- package/dist/cssm/components/FocusVisible/FocusVisible.css +1 -1
- package/dist/cssm/components/Gradient/Gradient.js +5 -11
- package/dist/cssm/components/Gradient/Gradient.js.map +1 -1
- package/dist/cssm/components/Header/Header.js +1 -1
- package/dist/cssm/components/Header/Header.js.map +1 -1
- package/dist/cssm/components/ModalCardBase/ModalCardBase.js +2 -2
- package/dist/cssm/components/ModalCardBase/ModalCardBase.js.map +1 -1
- package/dist/cssm/components/PanelHeaderButton/PanelHeaderButton.js +1 -1
- package/dist/cssm/components/PanelHeaderButton/PanelHeaderButton.js.map +1 -1
- package/dist/cssm/components/Placeholder/Placeholder.js +1 -1
- package/dist/cssm/components/Placeholder/Placeholder.js.map +1 -1
- package/dist/cssm/components/Search/Search.js +45 -22
- package/dist/cssm/components/Search/Search.js.map +1 -1
- package/dist/cssm/components/SegmentedControl/SegmentedControl.css +1 -0
- package/dist/cssm/components/SegmentedControl/SegmentedControl.js +95 -0
- package/dist/cssm/components/SegmentedControl/SegmentedControl.js.map +1 -0
- package/dist/cssm/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.css +1 -0
- package/dist/cssm/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.js +41 -0
- package/dist/cssm/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.js.map +1 -0
- package/dist/cssm/components/SimpleCell/SimpleCell.js +21 -9
- package/dist/cssm/components/SimpleCell/SimpleCell.js.map +1 -1
- package/dist/cssm/components/SliderSwitch/SliderSwitch.js +14 -3
- package/dist/cssm/components/SliderSwitch/SliderSwitch.js.map +1 -1
- package/dist/cssm/components/SliderSwitch/SliderSwitchButton.js +5 -5
- package/dist/cssm/components/SliderSwitch/SliderSwitchButton.js.map +1 -1
- package/dist/cssm/components/Switch/Switch.css +1 -1
- package/dist/cssm/components/Switch/Switch.js +3 -6
- package/dist/cssm/components/Switch/Switch.js.map +1 -1
- package/dist/cssm/components/Typography/Title/Title.css +1 -1
- package/dist/cssm/components/Typography/Title/Title.js +7 -16
- package/dist/cssm/components/Typography/Title/Title.js.map +1 -1
- package/dist/cssm/components/VisuallyHiddenInput/VisuallyHiddenInput.css +1 -0
- package/dist/cssm/components/VisuallyHiddenInput/VisuallyHiddenInput.js +24 -0
- package/dist/cssm/components/VisuallyHiddenInput/VisuallyHiddenInput.js.map +1 -0
- package/dist/cssm/hooks/usePlatform.js.map +1 -1
- package/dist/cssm/index.js +6 -5
- package/dist/cssm/index.js.map +1 -1
- package/dist/cssm/lib/utils.js +3 -0
- package/dist/cssm/lib/utils.js.map +1 -1
- package/dist/cssm/styles/components.css +5 -5
- package/dist/cssm/styles/themes.css +1 -1
- package/dist/cssm/tokenized/index.js +3 -0
- package/dist/cssm/tokenized/index.js.map +1 -1
- package/dist/hooks/usePlatform.d.ts +1 -1
- package/dist/hooks/usePlatform.js.map +1 -1
- package/dist/index.d.ts +7 -5
- package/dist/index.js +6 -5
- package/dist/index.js.map +1 -1
- package/dist/lib/utils.d.ts +1 -0
- package/dist/lib/utils.js +3 -0
- package/dist/lib/utils.js.map +1 -1
- package/dist/tokenized/index.d.ts +6 -0
- package/dist/tokenized/index.js +3 -0
- package/dist/tokenized/index.js.map +1 -1
- package/dist/vkui.css +6 -6
- package/dist/vkui.css.map +1 -1
- package/package.json +2 -2
- package/src/components/ActionSheetItem/ActionSheetItem.tsx +26 -24
- package/src/components/Alert/Alert.tsx +5 -7
- package/src/components/AppearanceProvider/AppearanceProvider.tsx +25 -1
- package/src/components/Banner/Banner.tsx +1 -1
- package/src/components/Button/Button.tsx +6 -3
- package/src/components/Card/Card.css +41 -0
- package/src/components/Card/Card.tsx +2 -9
- package/src/components/CardScroll/CardScroll.css +2 -39
- package/src/components/CardScroll/CardScroll.tsx +7 -17
- package/src/components/CardScroll/Readme.md +3 -2
- package/src/components/Chip/Chip.tsx +1 -4
- package/src/components/ChipsInput/ChipsInput.tsx +1 -1
- package/src/components/ConfigProvider/ConfigProvider.tsx +6 -25
- package/src/components/ConfigProvider/ConfigProviderContext.tsx +5 -5
- package/src/components/ContentCard/ContentCard.tsx +2 -2
- package/src/components/FocusVisible/FocusVisible.css +4 -8
- package/src/components/FormItem/Readme.md +14 -2
- package/src/components/Gradient/Gradient.tsx +4 -12
- package/src/components/Gradient/Readme.md +1 -1
- package/src/components/Header/Header.tsx +1 -1
- package/src/components/ModalCardBase/ModalCardBase.tsx +2 -2
- package/src/components/ModalRoot/Readme.md +1 -1
- package/src/components/PanelHeaderButton/PanelHeaderButton.tsx +1 -5
- package/src/components/Placeholder/Placeholder.tsx +1 -1
- package/src/components/Search/Search.tsx +38 -14
- package/src/components/SegmentedControl/Readme.md +94 -0
- package/src/components/SegmentedControl/SegmentedControl.css +42 -0
- package/src/components/SegmentedControl/SegmentedControl.tsx +105 -0
- package/src/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.css +30 -0
- package/src/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.tsx +42 -0
- package/src/components/SimpleCell/SimpleCell.tsx +10 -6
- package/src/components/SliderSwitch/Readme.md +4 -0
- package/src/components/SliderSwitch/SliderSwitch.tsx +17 -3
- package/src/components/SliderSwitch/SliderSwitchButton.tsx +4 -4
- package/src/components/Switch/Switch.css +0 -12
- package/src/components/Switch/Switch.tsx +8 -10
- package/src/components/Typography/Title/Readme.md +28 -41
- package/src/components/Typography/Title/Title.css +22 -13
- package/src/components/Typography/Title/Title.tsx +27 -22
- package/src/components/VisuallyHiddenInput/VisuallyHiddenInput.css +9 -0
- package/src/components/VisuallyHiddenInput/VisuallyHiddenInput.tsx +25 -0
- package/src/hooks/usePlatform.ts +1 -1
- package/src/index.ts +11 -5
- package/src/lib/utils.ts +6 -0
- package/src/styles/components.css +3 -0
- package/src/tokenized/index.ts +13 -0
|
@@ -0,0 +1,94 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
+
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
|
|
3
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
4
|
+
var _excluded = ["size", "name", "options", "getRootRef", "onChange", "value", "defaultValue", "children"],
|
|
5
|
+
_excluded2 = ["label"];
|
|
6
|
+
import { createScopedElement } from "../../lib/jsxRuntime";
|
|
7
|
+
import * as React from "react";
|
|
8
|
+
import { classNames } from "../../lib/classNames";
|
|
9
|
+
import { useIsomorphicLayoutEffect } from "../../lib/useIsomorphicLayoutEffect";
|
|
10
|
+
import { generateRandomId, noop } from "../../lib/utils";
|
|
11
|
+
import { warnOnce } from "../../lib/warnOnce";
|
|
12
|
+
import { SegmentedControlOption } from "./SegmentedControlOption/SegmentedControlOption";
|
|
13
|
+
var warn = warnOnce("SegmentedControl");
|
|
14
|
+
export var SegmentedControl = function SegmentedControl(_ref) {
|
|
15
|
+
var _ref$size = _ref.size,
|
|
16
|
+
size = _ref$size === void 0 ? "l" : _ref$size,
|
|
17
|
+
name = _ref.name,
|
|
18
|
+
options = _ref.options,
|
|
19
|
+
getRootRef = _ref.getRootRef,
|
|
20
|
+
_ref$onChange = _ref.onChange,
|
|
21
|
+
onChange = _ref$onChange === void 0 ? noop : _ref$onChange,
|
|
22
|
+
value = _ref.value,
|
|
23
|
+
defaultValue = _ref.defaultValue,
|
|
24
|
+
children = _ref.children,
|
|
25
|
+
restProps = _objectWithoutProperties(_ref, _excluded);
|
|
26
|
+
|
|
27
|
+
var initialValue = defaultValue !== null && defaultValue !== void 0 ? defaultValue : value;
|
|
28
|
+
|
|
29
|
+
if (!initialValue) {
|
|
30
|
+
var _options$;
|
|
31
|
+
|
|
32
|
+
initialValue = (_options$ = options[0]) === null || _options$ === void 0 ? void 0 : _options$.value;
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
var _React$useState = React.useState(0),
|
|
36
|
+
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
37
|
+
activeOptionIdx = _React$useState2[0],
|
|
38
|
+
updateActiveOptionIdx = _React$useState2[1];
|
|
39
|
+
|
|
40
|
+
var _React$useState3 = React.useState(initialValue),
|
|
41
|
+
_React$useState4 = _slicedToArray(_React$useState3, 2),
|
|
42
|
+
activeValue = _React$useState4[0],
|
|
43
|
+
updateActiveValue = _React$useState4[1];
|
|
44
|
+
|
|
45
|
+
var nameRef = React.useRef(name !== null && name !== void 0 ? name : generateRandomId());
|
|
46
|
+
useIsomorphicLayoutEffect(function () {
|
|
47
|
+
var _activeOptionIdx = options.findIndex(function (option) {
|
|
48
|
+
return option.value === activeValue;
|
|
49
|
+
});
|
|
50
|
+
|
|
51
|
+
if (_activeOptionIdx === -1 && process.env.NODE_ENV === "development") {
|
|
52
|
+
warn("defaultValue: такого значения нет среди опций!");
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
updateActiveOptionIdx(_activeOptionIdx);
|
|
56
|
+
}, [activeValue, options]);
|
|
57
|
+
var translateX = "translateX(".concat(100 * activeOptionIdx, "%)");
|
|
58
|
+
|
|
59
|
+
var handleOnChange = function handleOnChange(value) {
|
|
60
|
+
updateActiveValue(value);
|
|
61
|
+
onChange(value);
|
|
62
|
+
};
|
|
63
|
+
|
|
64
|
+
return createScopedElement("div", _extends({}, restProps, {
|
|
65
|
+
vkuiClass: classNames("SegmentedControl", "SegmentedControl--".concat(size)),
|
|
66
|
+
ref: getRootRef
|
|
67
|
+
}), createScopedElement("div", {
|
|
68
|
+
role: "radiogroup",
|
|
69
|
+
vkuiClass: "SegmentedControl__in"
|
|
70
|
+
}, activeOptionIdx > -1 && createScopedElement("div", {
|
|
71
|
+
"aria-hidden": "true",
|
|
72
|
+
vkuiClass: "SegmentedControl__slider",
|
|
73
|
+
style: {
|
|
74
|
+
width: "".concat(100 / options.length, "%"),
|
|
75
|
+
transform: translateX,
|
|
76
|
+
WebkitTransform: translateX
|
|
77
|
+
}
|
|
78
|
+
}), options.map(function (_ref2) {
|
|
79
|
+
var label = _ref2.label,
|
|
80
|
+
optionProps = _objectWithoutProperties(_ref2, _excluded2);
|
|
81
|
+
|
|
82
|
+
return createScopedElement(SegmentedControlOption, _extends({
|
|
83
|
+
key: "".concat(optionProps.value)
|
|
84
|
+
}, optionProps, {
|
|
85
|
+
vkuiClass: "SegmentedControl__option",
|
|
86
|
+
name: nameRef.current,
|
|
87
|
+
checked: activeValue === optionProps.value,
|
|
88
|
+
onChange: function onChange() {
|
|
89
|
+
return handleOnChange(optionProps.value);
|
|
90
|
+
}
|
|
91
|
+
}), label);
|
|
92
|
+
})));
|
|
93
|
+
};
|
|
94
|
+
//# sourceMappingURL=SegmentedControl.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../src/components/SegmentedControl/SegmentedControl.tsx"],"names":["React","classNames","useIsomorphicLayoutEffect","generateRandomId","noop","warnOnce","SegmentedControlOption","warn","SegmentedControl","size","name","options","getRootRef","onChange","value","defaultValue","children","restProps","initialValue","useState","activeOptionIdx","updateActiveOptionIdx","activeValue","updateActiveValue","nameRef","useRef","_activeOptionIdx","findIndex","option","process","env","NODE_ENV","translateX","handleOnChange","width","length","transform","WebkitTransform","map","label","optionProps","current"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { classNames } from \"../../lib/classNames\";\nimport { useIsomorphicLayoutEffect } from \"../../lib/useIsomorphicLayoutEffect\";\nimport { generateRandomId, noop } from \"../../lib/utils\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport { SegmentedControlOption } from \"./SegmentedControlOption/SegmentedControlOption\";\nimport { HasRootRef } from \"../../types\";\nimport \"./SegmentedControl.css\";\n\nexport type SegmentedControlValue = string | number | undefined;\n\nexport interface SegmentedControlOptionInterface\n extends Omit<React.HTMLAttributes<HTMLElement>, \"label\"> {\n label: React.ReactChild;\n value: SegmentedControlValue;\n}\n\nexport interface SegmentedControlProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, \"onChange\">,\n HasRootRef<HTMLDivElement> {\n options: SegmentedControlOptionInterface[];\n size?: \"m\" | \"l\";\n name?: string;\n onChange?: (value: SegmentedControlValue) => void;\n value?: SegmentedControlValue;\n defaultValue?: SegmentedControlValue;\n}\n\nconst warn = warnOnce(\"SegmentedControl\");\nexport const SegmentedControl: React.FC<SegmentedControlProps> = ({\n size = \"l\",\n name,\n options,\n getRootRef,\n onChange = noop,\n value,\n defaultValue,\n children,\n ...restProps\n}) => {\n let initialValue = defaultValue ?? value;\n\n if (!initialValue) {\n initialValue = options[0]?.value;\n }\n\n const [activeOptionIdx, updateActiveOptionIdx] = React.useState<number>(0);\n const [activeValue, updateActiveValue] =\n React.useState<SegmentedControlValue>(initialValue);\n\n const nameRef = React.useRef<string>(name ?? generateRandomId());\n\n useIsomorphicLayoutEffect(() => {\n const _activeOptionIdx = options.findIndex(\n (option) => option.value === activeValue\n );\n\n if (_activeOptionIdx === -1 && process.env.NODE_ENV === \"development\") {\n warn(\"defaultValue: такого значения нет среди опций!\");\n }\n\n updateActiveOptionIdx(_activeOptionIdx);\n }, [activeValue, options]);\n\n const translateX = `translateX(${100 * activeOptionIdx}%)`;\n\n const handleOnChange = (value: SegmentedControlValue) => {\n updateActiveValue(value);\n onChange(value);\n };\n\n return (\n <div\n {...restProps}\n vkuiClass={classNames(\"SegmentedControl\", `SegmentedControl--${size}`)}\n ref={getRootRef}\n >\n <div role=\"radiogroup\" vkuiClass=\"SegmentedControl__in\">\n {activeOptionIdx > -1 && (\n <div\n aria-hidden=\"true\"\n vkuiClass=\"SegmentedControl__slider\"\n style={{\n width: `${100 / options.length}%`,\n transform: translateX,\n WebkitTransform: translateX,\n }}\n />\n )}\n {options.map(({ label, ...optionProps }) => (\n <SegmentedControlOption\n key={`${optionProps.value}`}\n {...optionProps}\n vkuiClass=\"SegmentedControl__option\"\n name={nameRef.current}\n checked={activeValue === optionProps.value}\n onChange={() => handleOnChange(optionProps.value)}\n >\n {label}\n </SegmentedControlOption>\n ))}\n </div>\n </div>\n );\n};\n"],"file":"SegmentedControl.js"}
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
3
|
+
var _excluded = ["className", "style", "children"];
|
|
4
|
+
import { createScopedElement } from "../../../lib/jsxRuntime";
|
|
5
|
+
import { useFocusVisible } from "../../../hooks/useFocusVisible";
|
|
6
|
+
import { callMultiple } from "../../../lib/callMultiple";
|
|
7
|
+
import { classNames } from "../../../lib/classNames";
|
|
8
|
+
import { FocusVisible } from "../../FocusVisible/FocusVisible";
|
|
9
|
+
import Text from "../../Typography/Text/Text";
|
|
10
|
+
import { VisuallyHiddenInput } from "../../VisuallyHiddenInput/VisuallyHiddenInput";
|
|
11
|
+
export var SegmentedControlOption = function SegmentedControlOption(_ref) {
|
|
12
|
+
var className = _ref.className,
|
|
13
|
+
style = _ref.style,
|
|
14
|
+
children = _ref.children,
|
|
15
|
+
restProps = _objectWithoutProperties(_ref, _excluded);
|
|
16
|
+
|
|
17
|
+
var _useFocusVisible = useFocusVisible(),
|
|
18
|
+
focusVisible = _useFocusVisible.focusVisible,
|
|
19
|
+
onBlur = _useFocusVisible.onBlur,
|
|
20
|
+
onFocus = _useFocusVisible.onFocus;
|
|
21
|
+
|
|
22
|
+
return createScopedElement("label", {
|
|
23
|
+
className: className,
|
|
24
|
+
style: style,
|
|
25
|
+
vkuiClass: classNames("SegmentedControlOption", {
|
|
26
|
+
"SegmentedControlOption--checked": restProps.checked,
|
|
27
|
+
"SegmentedControlOption--focus-visible": focusVisible
|
|
28
|
+
})
|
|
29
|
+
}, createScopedElement(VisuallyHiddenInput, _extends({}, restProps, {
|
|
30
|
+
type: "radio",
|
|
31
|
+
onBlur: callMultiple(onBlur, restProps.onBlur),
|
|
32
|
+
onFocus: callMultiple(onFocus, restProps.onFocus)
|
|
33
|
+
})), createScopedElement(Text, {
|
|
34
|
+
vkuiClass: "SegmentedControlOption__content",
|
|
35
|
+
weight: "medium"
|
|
36
|
+
}, children), createScopedElement(FocusVisible, {
|
|
37
|
+
mode: "inside"
|
|
38
|
+
}));
|
|
39
|
+
};
|
|
40
|
+
//# sourceMappingURL=SegmentedControlOption.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/SegmentedControl/SegmentedControlOption/SegmentedControlOption.tsx"],"names":["useFocusVisible","callMultiple","classNames","FocusVisible","Text","VisuallyHiddenInput","SegmentedControlOption","className","style","children","restProps","focusVisible","onBlur","onFocus","checked"],"mappings":";;;;AACA,SAASA,eAAT;AACA,SAASC,YAAT;AACA,SAASC,UAAT;AACA,SAASC,YAAT;AACA,OAAOC,IAAP;AACA,SACEC,mBADF;AAMA,OAAO,IAAMC,sBAA0D,GAAG,SAA7DA,sBAA6D,OAKpE;AAAA,MAJJC,SAII,QAJJA,SAII;AAAA,MAHJC,KAGI,QAHJA,KAGI;AAAA,MAFJC,QAEI,QAFJA,QAEI;AAAA,MADDC,SACC;;AACJ,yBAA0CV,eAAe,EAAzD;AAAA,MAAQW,YAAR,oBAAQA,YAAR;AAAA,MAAsBC,MAAtB,oBAAsBA,MAAtB;AAAA,MAA8BC,OAA9B,oBAA8BA,OAA9B;;AAEA,SACE;AACE,IAAA,SAAS,EAAEN,SADb;AAEE,IAAA,KAAK,EAAEC,KAFT;AAGE,IAAA,SAAS,EAAEN,UAAU,CAAC,wBAAD,EAA2B;AAC9C,yCAAmCQ,SAAS,CAACI,OADC;AAE9C,+CAAyCH;AAFK,KAA3B;AAHvB,KAQE,oBAAC,mBAAD,eACMD,SADN;AAEE,IAAA,IAAI,EAAC,OAFP;AAGE,IAAA,MAAM,EAAET,YAAY,CAACW,MAAD,EAASF,SAAS,CAACE,MAAnB,CAHtB;AAIE,IAAA,OAAO,EAAEX,YAAY,CAACY,OAAD,EAAUH,SAAS,CAACG,OAApB;AAJvB,KARF,EAcE,oBAAC,IAAD;AAAM,IAAA,SAAS,EAAC,iCAAhB;AAAkD,IAAA,MAAM,EAAC;AAAzD,KACGJ,QADH,CAdF,EAiBE,oBAAC,YAAD;AAAc,IAAA,IAAI,EAAC;AAAnB,IAjBF,CADF;AAqBD,CA7BM","sourcesContent":["import * as React from \"react\";\nimport { useFocusVisible } from \"../../../hooks/useFocusVisible\";\nimport { callMultiple } from \"../../../lib/callMultiple\";\nimport { classNames } from \"../../../lib/classNames\";\nimport { FocusVisible } from \"../../FocusVisible/FocusVisible\";\nimport Text from \"../../Typography/Text/Text\";\nimport {\n VisuallyHiddenInput,\n VisuallyHiddenInputProps,\n} from \"../../VisuallyHiddenInput/VisuallyHiddenInput\";\nimport \"./SegmentedControlOption.css\";\n\nexport const SegmentedControlOption: React.FC<VisuallyHiddenInputProps> = ({\n className,\n style,\n children,\n ...restProps\n}) => {\n const { focusVisible, onBlur, onFocus } = useFocusVisible();\n\n return (\n <label\n className={className}\n style={style}\n vkuiClass={classNames(\"SegmentedControlOption\", {\n \"SegmentedControlOption--checked\": restProps.checked,\n \"SegmentedControlOption--focus-visible\": focusVisible,\n })}\n >\n <VisuallyHiddenInput\n {...restProps}\n type=\"radio\"\n onBlur={callMultiple(onBlur, restProps.onBlur)}\n onFocus={callMultiple(onFocus, restProps.onFocus)}\n />\n <Text vkuiClass=\"SegmentedControlOption__content\" weight=\"medium\">\n {children}\n </Text>\n <FocusVisible mode=\"inside\" />\n </label>\n );\n};\n"],"file":"SegmentedControlOption.js"}
|
|
@@ -6,7 +6,7 @@ import { classNames } from "../../lib/classNames";
|
|
|
6
6
|
import { getClassName } from "../../helpers/getClassName";
|
|
7
7
|
import Tappable from "../Tappable/Tappable";
|
|
8
8
|
import { Icon24Chevron } from "@vkontakte/icons";
|
|
9
|
-
import { IOS } from "../../lib/platform";
|
|
9
|
+
import { ANDROID, IOS } from "../../lib/platform";
|
|
10
10
|
import { usePlatform } from "../../hooks/usePlatform";
|
|
11
11
|
import { hasReactNode } from "../../lib/utils";
|
|
12
12
|
import { useAdaptivity } from "../../hooks/useAdaptivity";
|
|
@@ -14,19 +14,31 @@ import { withAdaptivity, SizeType } from "../../hoc/withAdaptivity";
|
|
|
14
14
|
import Title from "../Typography/Title/Title";
|
|
15
15
|
import Text from "../Typography/Text/Text";
|
|
16
16
|
import Subhead from "../Typography/Subhead/Subhead";
|
|
17
|
+
import Headline from "../Typography/Headline/Headline";
|
|
17
18
|
|
|
18
19
|
var SimpleCellTypography = function SimpleCellTypography(props) {
|
|
19
20
|
var _useAdaptivity = useAdaptivity(),
|
|
20
21
|
sizeY = _useAdaptivity.sizeY;
|
|
21
22
|
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
}
|
|
23
|
+
var platform = usePlatform();
|
|
24
|
+
|
|
25
|
+
if (sizeY === SizeType.COMPACT) {
|
|
26
|
+
return createScopedElement(Text, _extends({
|
|
27
|
+
Component: "span",
|
|
28
|
+
weight: "regular"
|
|
29
|
+
}, props));
|
|
30
|
+
} else if (platform === ANDROID) {
|
|
31
|
+
return createScopedElement(Headline, _extends({
|
|
32
|
+
Component: "span",
|
|
33
|
+
weight: "regular"
|
|
34
|
+
}, props));
|
|
35
|
+
} else {
|
|
36
|
+
return createScopedElement(Title, _extends({
|
|
37
|
+
Component: "span",
|
|
38
|
+
level: "3",
|
|
39
|
+
weight: "3"
|
|
40
|
+
}, props));
|
|
41
|
+
}
|
|
30
42
|
};
|
|
31
43
|
|
|
32
44
|
var SimpleCell = function SimpleCell(_ref) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/SimpleCell/SimpleCell.tsx"],"names":["classNames","getClassName","Tappable","Icon24Chevron","IOS","usePlatform","hasReactNode","useAdaptivity","withAdaptivity","SizeType","Title","Text","Subhead","SimpleCellTypography","props","sizeY","COMPACT","SimpleCell","badge","before","indicator","children","after","description","expandable","multiline","restProps","
|
|
1
|
+
{"version":3,"sources":["../../../src/components/SimpleCell/SimpleCell.tsx"],"names":["classNames","getClassName","Tappable","Icon24Chevron","ANDROID","IOS","usePlatform","hasReactNode","useAdaptivity","withAdaptivity","SizeType","Title","Text","Subhead","Headline","SimpleCellTypography","props","sizeY","platform","COMPACT","SimpleCell","badge","before","indicator","children","after","description","expandable","multiline","restProps","hasAfter"],"mappings":";;;;AAEA,SAASA,UAAT;AACA,SAASC,YAAT;AACA,OAAOC,QAAP;AACA,SAASC,aAAT,QAA8B,kBAA9B;AACA,SAASC,OAAT,EAAkBC,GAAlB;AACA,SAASC,WAAT;AACA,SAASC,YAAT;AACA,SAASC,aAAT;AACA,SAASC,cAAT,EAAyBC,QAAzB;AACA,OAAOC,KAAP;AACA,OAAOC,IAAP;AACA,OAAOC,OAAP;AACA,OAAOC,QAAP;;AAwCA,IAAMC,oBAAyD,GAAG,SAA5DA,oBAA4D,CAChEC,KADgE,EAE7D;AACH,uBAAkBR,aAAa,EAA/B;AAAA,MAAQS,KAAR,kBAAQA,KAAR;;AACA,MAAMC,QAAQ,GAAGZ,WAAW,EAA5B;;AAEA,MAAIW,KAAK,KAAKP,QAAQ,CAACS,OAAvB,EAAgC;AAC9B,WAAO,oBAAC,IAAD;AAAM,MAAA,SAAS,EAAC,MAAhB;AAAuB,MAAA,MAAM,EAAC;AAA9B,OAA4CH,KAA5C,EAAP;AACD,GAFD,MAEO,IAAIE,QAAQ,KAAKd,OAAjB,EAA0B;AAC/B,WAAO,oBAAC,QAAD;AAAU,MAAA,SAAS,EAAC,MAApB;AAA2B,MAAA,MAAM,EAAC;AAAlC,OAAgDY,KAAhD,EAAP;AACD,GAFM,MAEA;AACL,WAAO,oBAAC,KAAD;AAAO,MAAA,SAAS,EAAC,MAAjB;AAAwB,MAAA,KAAK,EAAC,GAA9B;AAAkC,MAAA,MAAM,EAAC;AAAzC,OAAiDA,KAAjD,EAAP;AACD;AACF,CAbD;;AAeA,IAAMI,UAAqC,GAAG,SAAxCA,UAAwC,OAWvB;AAAA,MAVrBC,KAUqB,QAVrBA,KAUqB;AAAA,MATrBC,MASqB,QATrBA,MASqB;AAAA,MARrBC,SAQqB,QARrBA,SAQqB;AAAA,MAPrBC,QAOqB,QAPrBA,QAOqB;AAAA,MANrBC,KAMqB,QANrBA,KAMqB;AAAA,MALrBC,WAKqB,QALrBA,WAKqB;AAAA,MAJrBC,UAIqB,QAJrBA,UAIqB;AAAA,MAHrBC,SAGqB,QAHrBA,SAGqB;AAAA,MAFrBX,KAEqB,QAFrBA,KAEqB;AAAA,MADlBY,SACkB;;AACrB,MAAMX,QAAQ,GAAGZ,WAAW,EAA5B;AACA,MAAMwB,QAAQ,GAAGvB,YAAY,CAACkB,KAAD,CAAZ,IAAwBE,UAAU,IAAIT,QAAQ,KAAKb,GAApE;AAEA,SACE,oBAAC,QAAD,eACMwB,SADN;AAEE,IAAA,SAAS,EAAE7B,UAAU,CACnBC,YAAY,CAAC,YAAD,EAAeiB,QAAf,CADO,EAEnB;AACE,yBAAmBS,UADrB;AAEE,0BAAoBC;AAFtB,KAFmB,8BAMEX,KANF;AAFvB,MAWGK,MAXH,EAYE;AAAK,IAAA,SAAS,EAAC;AAAf,KACE;AAAK,IAAA,SAAS,EAAC;AAAf,KACE,oBAAC,oBAAD;AAAsB,IAAA,SAAS,EAAC;AAAhC,KACGE,QADH,CADF,EAIGjB,YAAY,CAACc,KAAD,CAAZ,IACC;AAAM,IAAA,SAAS,EAAC;AAAhB,KAAqCA,KAArC,CALJ,CADF,EASGK,WAAW,IACV,oBAAC,OAAD;AACE,IAAA,SAAS,EAAC,MADZ;AAEE,IAAA,MAAM,EAAC,SAFT;AAGE,IAAA,SAAS,EAAC;AAHZ,KAKGA,WALH,CAVJ,CAZF,EA+BGnB,YAAY,CAACgB,SAAD,CAAZ,IACC,oBAAC,oBAAD;AACE,IAAA,SAAS,EAAC,MADZ;AAEE,IAAA,SAAS,EAAC;AAFZ,KAIGA,SAJH,CAhCJ,EAuCGO,QAAQ,IACP;AAAK,IAAA,SAAS,EAAC;AAAf,KACGL,KADH,EAEGE,UAAU,IAAIT,QAAQ,KAAKb,GAA3B,IAAkC,oBAAC,aAAD,OAFrC,CAxCJ,CADF;AAgDD,CA/DD,C,CAiEA;;;AACA,eAAeI,cAAc,CAACW,UAAD,EAAa;AAAEH,EAAAA,KAAK,EAAE;AAAT,CAAb,CAA7B","sourcesContent":["import * as React from \"react\";\nimport { HasComponent } from \"../../types\";\nimport { classNames } from \"../../lib/classNames\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport Tappable, { TappableProps } from \"../Tappable/Tappable\";\nimport { Icon24Chevron } from \"@vkontakte/icons\";\nimport { ANDROID, IOS } from \"../../lib/platform\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { hasReactNode } from \"../../lib/utils\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport { withAdaptivity, SizeType } from \"../../hoc/withAdaptivity\";\nimport Title from \"../Typography/Title/Title\";\nimport Text from \"../Typography/Text/Text\";\nimport Subhead from \"../Typography/Subhead/Subhead\";\nimport Headline from \"../Typography/Headline/Headline\";\nimport \"./SimpleCell.css\";\n\nexport interface SimpleCellOwnProps extends HasComponent {\n /**\n * Иконка 28 или `<Avatar size={28|32|40|48|72} />`\n */\n before?: React.ReactNode;\n /**\n * Иконка 12 или `<Badge />`. Добавится справа от текста `children`.\n */\n badge?: React.ReactNode;\n /**\n * Контейнер для текста справа от `children`.\n */\n indicator?: React.ReactNode;\n /**\n * Иконка 24|28 или `<Switch />`. Располагается справа от `indicator`.\n */\n after?: React.ReactNode;\n /**\n * Контейнер для текста под `children`.\n */\n description?: React.ReactNode;\n /**\n * Убирает анимацию нажатия\n */\n disabled?: boolean;\n /**\n * В iOS добавляет chevron справа. Передавать `true`, если предполагается переход при клике по ячейке.\n */\n expandable?: boolean;\n multiline?: boolean;\n}\n\nexport interface SimpleCellProps extends SimpleCellOwnProps, TappableProps {}\n\ntype SimpleCellTypographyProps = React.HTMLAttributes<HTMLDivElement> &\n HasComponent;\n\nconst SimpleCellTypography: React.FC<SimpleCellTypographyProps> = (\n props: SimpleCellTypographyProps\n) => {\n const { sizeY } = useAdaptivity();\n const platform = usePlatform();\n\n if (sizeY === SizeType.COMPACT) {\n return <Text Component=\"span\" weight=\"regular\" {...props} />;\n } else if (platform === ANDROID) {\n return <Headline Component=\"span\" weight=\"regular\" {...props} />;\n } else {\n return <Title Component=\"span\" level=\"3\" weight=\"3\" {...props} />;\n }\n};\n\nconst SimpleCell: React.FC<SimpleCellProps> = ({\n badge,\n before,\n indicator,\n children,\n after,\n description,\n expandable,\n multiline,\n sizeY,\n ...restProps\n}: SimpleCellProps) => {\n const platform = usePlatform();\n const hasAfter = hasReactNode(after) || (expandable && platform === IOS);\n\n return (\n <Tappable\n {...restProps}\n vkuiClass={classNames(\n getClassName(\"SimpleCell\", platform),\n {\n \"SimpleCell--exp\": expandable,\n \"SimpleCell--mult\": multiline,\n },\n `SimpleCell--sizeY-${sizeY}`\n )}\n >\n {before}\n <div vkuiClass=\"SimpleCell__main\">\n <div vkuiClass=\"SimpleCell__content\">\n <SimpleCellTypography vkuiClass=\"SimpleCell__children\">\n {children}\n </SimpleCellTypography>\n {hasReactNode(badge) && (\n <span vkuiClass=\"SimpleCell__badge\">{badge}</span>\n )}\n </div>\n {description && (\n <Subhead\n Component=\"span\"\n weight=\"regular\"\n vkuiClass=\"SimpleCell__description\"\n >\n {description}\n </Subhead>\n )}\n </div>\n {hasReactNode(indicator) && (\n <SimpleCellTypography\n Component=\"span\"\n vkuiClass=\"SimpleCell__indicator\"\n >\n {indicator}\n </SimpleCellTypography>\n )}\n {hasAfter && (\n <div vkuiClass=\"SimpleCell__after\">\n {after}\n {expandable && platform === IOS && <Icon24Chevron />}\n </div>\n )}\n </Tappable>\n );\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default withAdaptivity(SimpleCell, { sizeY: true });\n"],"file":"SimpleCell.js"}
|
|
@@ -18,7 +18,10 @@ interface SliderSwitchState {
|
|
|
18
18
|
activeValue: SliderSwitchOptionInterface["value"];
|
|
19
19
|
hoveredOptionId: number;
|
|
20
20
|
}
|
|
21
|
-
|
|
21
|
+
/**
|
|
22
|
+
* @deprecated Этот компонент устарел и будет удален в 5.0.0. Используйте [`SegmentedControl`](#/SegmentedControl).
|
|
23
|
+
*/
|
|
24
|
+
declare class SliderSwitch extends React.Component<SliderSwitchProps, SliderSwitchState> {
|
|
22
25
|
constructor(props: SliderSwitchProps);
|
|
23
26
|
static defaultProps: {
|
|
24
27
|
options: {
|
|
@@ -38,6 +41,7 @@ export default class SliderSwitch extends React.Component<SliderSwitchProps, Sli
|
|
|
38
41
|
static getDerivedStateFromProps(nextProps: SliderSwitchProps, prevState: SliderSwitchState): {
|
|
39
42
|
activeValue: string | number;
|
|
40
43
|
} | null;
|
|
44
|
+
componentDidMount(): void;
|
|
41
45
|
render(): JSX.Element;
|
|
42
46
|
}
|
|
43
|
-
export {};
|
|
47
|
+
export { SliderSwitch };
|
|
@@ -10,10 +10,14 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
|
10
10
|
var _excluded = ["name", "options", "activeValue", "onSwitch"];
|
|
11
11
|
import { createScopedElement } from "../../lib/jsxRuntime";
|
|
12
12
|
import * as React from "react";
|
|
13
|
-
import SliderSwitchButton from "./SliderSwitchButton";
|
|
13
|
+
import { SliderSwitchButton } from "./SliderSwitchButton";
|
|
14
14
|
import { classNames } from "../../lib/classNames";
|
|
15
|
+
import { warnOnce } from "../../lib/warnOnce";
|
|
16
|
+
var warn = warnOnce("SliderSwitch");
|
|
17
|
+
/**
|
|
18
|
+
* @deprecated Этот компонент устарел и будет удален в 5.0.0. Используйте [`SegmentedControl`](#/SegmentedControl).
|
|
19
|
+
*/
|
|
15
20
|
|
|
16
|
-
// eslint-disable-next-line import/no-default-export
|
|
17
21
|
var SliderSwitch = /*#__PURE__*/function (_React$Component) {
|
|
18
22
|
_inherits(SliderSwitch, _React$Component);
|
|
19
23
|
|
|
@@ -121,6 +125,13 @@ var SliderSwitch = /*#__PURE__*/function (_React$Component) {
|
|
|
121
125
|
}
|
|
122
126
|
|
|
123
127
|
_createClass(SliderSwitch, [{
|
|
128
|
+
key: "componentDidMount",
|
|
129
|
+
value: function componentDidMount() {
|
|
130
|
+
if (process.env.NODE_ENV === "development") {
|
|
131
|
+
warn("Этот компонент устарел и будет удален в 5.0.0. Используйте SegmentedControl.");
|
|
132
|
+
}
|
|
133
|
+
}
|
|
134
|
+
}, {
|
|
124
135
|
key: "render",
|
|
125
136
|
value: function render() {
|
|
126
137
|
var _classNames;
|
|
@@ -195,5 +206,5 @@ _defineProperty(SliderSwitch, "defaultProps", {
|
|
|
195
206
|
}]
|
|
196
207
|
});
|
|
197
208
|
|
|
198
|
-
export { SliderSwitch
|
|
209
|
+
export { SliderSwitch };
|
|
199
210
|
//# sourceMappingURL=SliderSwitch.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/SliderSwitch/SliderSwitch.tsx"],"names":["React","SliderSwitchButton","classNames","SliderSwitch","props","value","onSwitch","setState","activeValue","options","hoveredOptionId","event","key","preventDefault","state","find","option","undefined","firstButton","current","focus","secondButton","createRef","name","_activeValue","restProps","firstOption","secondOption","firstActive","secondActive","switchByKey","resetFocusedOption","handleFirstClick","handleFirstHover","handleSecondClick","handleSecondHover","nextProps","prevState","Component"],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,
|
|
1
|
+
{"version":3,"sources":["../../../src/components/SliderSwitch/SliderSwitch.tsx"],"names":["React","SliderSwitchButton","classNames","warnOnce","warn","SliderSwitch","props","value","onSwitch","setState","activeValue","options","hoveredOptionId","event","key","preventDefault","state","find","option","undefined","firstButton","current","focus","secondButton","createRef","process","env","NODE_ENV","name","_activeValue","restProps","firstOption","secondOption","firstActive","secondActive","switchByKey","resetFocusedOption","handleFirstClick","handleFirstHover","handleSecondClick","handleSecondHover","nextProps","prevState","Component"],"mappings":"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","sourcesContent":["import * as React from \"react\";\nimport { SliderSwitchButton } from \"./SliderSwitchButton\";\nimport { classNames } from \"../../lib/classNames\";\nimport { warnOnce } from \"../../lib/warnOnce\";\nimport { HasPlatform } from \"../../types\";\nimport \"./SliderSwitch.css\";\n\nexport interface SliderSwitchOptionInterface {\n name: string;\n value: string | number;\n}\n\nexport interface SliderSwitchProps\n extends React.HTMLAttributes<HTMLDivElement>,\n HasPlatform {\n options: Array<{\n name: string;\n value: string | number;\n }>;\n activeValue?: SliderSwitchOptionInterface[\"value\"];\n name?: string;\n onSwitch?: (value: SliderSwitchOptionInterface[\"value\"]) => void;\n}\n\ninterface SliderSwitchState {\n activeValue: SliderSwitchOptionInterface[\"value\"];\n hoveredOptionId: number;\n}\n\nconst warn = warnOnce(\"SliderSwitch\");\n/**\n * @deprecated Этот компонент устарел и будет удален в 5.0.0. Используйте [`SegmentedControl`](#/SegmentedControl).\n */\nclass SliderSwitch extends React.Component<\n SliderSwitchProps,\n SliderSwitchState\n> {\n public constructor(props: SliderSwitchProps) {\n super(props);\n\n this.state = {\n activeValue: props.activeValue ?? \"\",\n hoveredOptionId: -1,\n };\n\n this.firstButton = React.createRef();\n this.secondButton = React.createRef();\n }\n\n static defaultProps = {\n options: [\n { name: \"\", value: \"\" },\n { name: \"\", value: \"\" },\n ],\n };\n\n firstButton: React.RefObject<HTMLDivElement>;\n secondButton: React.RefObject<HTMLDivElement>;\n\n onSwitch = (value: SliderSwitchOptionInterface[\"value\"]) => {\n const { onSwitch } = this.props;\n\n this.setState(\n () => ({\n activeValue: value,\n }),\n () => {\n onSwitch && onSwitch(value);\n }\n );\n };\n\n handleFirstClick = () => {\n const { options } = this.props;\n const { value } = options[0];\n\n this.onSwitch(value);\n };\n\n handleSecondClick = () => {\n const { options } = this.props;\n const { value } = options[1];\n\n this.onSwitch(value);\n };\n\n handleFirstHover = () => {\n this.setState(() => ({\n hoveredOptionId: 0,\n }));\n };\n\n handleSecondHover = () => {\n this.setState(() => ({\n hoveredOptionId: 1,\n }));\n };\n\n resetFocusedOption = () => {\n this.setState(() => ({\n hoveredOptionId: -1,\n }));\n };\n\n switchByKey = (event: React.KeyboardEvent) => {\n if (\n event.key !== \"Enter\" &&\n event.key !== \"Spacebar\" &&\n event.key !== \" \"\n ) {\n return;\n }\n event.preventDefault();\n\n const { options } = this.props;\n const { activeValue } = this.state;\n const value = options.find((option) => option.value !== activeValue)?.value;\n\n if (value !== undefined) {\n this.onSwitch(value);\n }\n\n if (options[0].value === value) {\n this.firstButton.current?.focus();\n } else {\n this.secondButton.current?.focus();\n }\n };\n\n static getDerivedStateFromProps(\n nextProps: SliderSwitchProps,\n prevState: SliderSwitchState\n ) {\n if (\n nextProps.activeValue &&\n nextProps.activeValue !== prevState.activeValue\n ) {\n return {\n activeValue: nextProps.activeValue,\n };\n }\n\n return null;\n }\n\n componentDidMount(): void {\n if (process.env.NODE_ENV === \"development\") {\n warn(\n \"Этот компонент устарел и будет удален в 5.0.0. Используйте SegmentedControl.\"\n );\n }\n }\n\n public render() {\n const {\n name,\n options,\n activeValue: _activeValue,\n onSwitch,\n ...restProps\n } = this.props;\n const { activeValue, hoveredOptionId } = this.state;\n\n const [firstOption, secondOption] = options;\n const firstActive = firstOption.value === activeValue;\n const secondActive = secondOption.value === activeValue;\n\n return (\n <div\n {...restProps}\n vkuiClass=\"SliderSwitch\"\n onKeyDown={this.switchByKey}\n onMouseLeave={this.resetFocusedOption}\n >\n {!firstActive && !secondActive && (\n <div vkuiClass=\"SliderSwitch__border\" />\n )}\n <div\n vkuiClass={classNames(\"SliderSwitch__slider\", {\n [\"SliderSwitch--firstActive\"]: firstActive,\n [\"SliderSwitch--secondActive\"]: secondActive,\n })}\n />\n <input type=\"hidden\" name={name} value={activeValue} />\n <SliderSwitchButton\n active={firstActive}\n hovered={hoveredOptionId === 0}\n aria-pressed={firstActive}\n onClick={this.handleFirstClick}\n onMouseEnter={this.handleFirstHover}\n getRootRef={this.firstButton}\n >\n {firstOption.name}\n </SliderSwitchButton>\n <SliderSwitchButton\n active={secondActive}\n hovered={hoveredOptionId === 1}\n onClick={this.handleSecondClick}\n onMouseEnter={this.handleSecondHover}\n getRootRef={this.secondButton}\n >\n {secondOption.name}\n </SliderSwitchButton>\n </div>\n );\n }\n}\n\nexport { SliderSwitch };\n"],"file":"SliderSwitch.js"}
|
|
@@ -5,5 +5,7 @@ export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLElement>, Ha
|
|
|
5
5
|
active?: boolean;
|
|
6
6
|
hovered?: boolean;
|
|
7
7
|
}
|
|
8
|
-
|
|
9
|
-
|
|
8
|
+
/**
|
|
9
|
+
* @deprecated Этот компонент устарел и будет удален в 5.0.0.
|
|
10
|
+
*/
|
|
11
|
+
export declare const SliderSwitchButton: React.FunctionComponent<ButtonProps>;
|
|
@@ -11,7 +11,10 @@ import { classNames } from "../../lib/classNames";
|
|
|
11
11
|
import { usePlatform } from "../../hooks/usePlatform";
|
|
12
12
|
import Text from "../Typography/Text/Text";
|
|
13
13
|
|
|
14
|
-
|
|
14
|
+
/**
|
|
15
|
+
* @deprecated Этот компонент устарел и будет удален в 5.0.0.
|
|
16
|
+
*/
|
|
17
|
+
export var SliderSwitchButton = function SliderSwitchButton(props) {
|
|
15
18
|
var _classNames;
|
|
16
19
|
|
|
17
20
|
var active = props.active,
|
|
@@ -45,8 +48,5 @@ var SliderSwitchButton = function SliderSwitchButton(props) {
|
|
|
45
48
|
}), createScopedElement(Text, {
|
|
46
49
|
weight: "medium"
|
|
47
50
|
}, children));
|
|
48
|
-
};
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
export default SliderSwitchButton;
|
|
51
|
+
};
|
|
52
52
|
//# sourceMappingURL=SliderSwitchButton.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/SliderSwitch/SliderSwitchButton.tsx"],"names":["React","Tappable","getClassName","classNames","usePlatform","Text","SliderSwitchButton","props","active","hovered","children","getRootRef","restProps","platform","useState","focus","setFocus","toggleFocus"],"mappings":";;;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,QAAP;AACA,SAASC,YAAT;AACA,SAASC,UAAT;AAEA,SAASC,WAAT;AACA,OAAOC,IAAP;;AAUA,IAAMC,kBAAwD,GAAG,SAA3DA,kBAA2D,
|
|
1
|
+
{"version":3,"sources":["../../../src/components/SliderSwitch/SliderSwitchButton.tsx"],"names":["React","Tappable","getClassName","classNames","usePlatform","Text","SliderSwitchButton","props","active","hovered","children","getRootRef","restProps","platform","useState","focus","setFocus","toggleFocus"],"mappings":";;;;;;AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,OAAOC,QAAP;AACA,SAASC,YAAT;AACA,SAASC,UAAT;AAEA,SAASC,WAAT;AACA,OAAOC,IAAP;;AAUA;AACA;AACA;AACA,OAAO,IAAMC,kBAAwD,GAAG,SAA3DA,kBAA2D,CACtEC,KADsE,EAEnE;AAAA;;AACH,MAAQC,MAAR,GAAgED,KAAhE,CAAQC,MAAR;AAAA,MAAgBC,OAAhB,GAAgEF,KAAhE,CAAgBE,OAAhB;AAAA,MAAyBC,QAAzB,GAAgEH,KAAhE,CAAyBG,QAAzB;AAAA,MAAmCC,UAAnC,GAAgEJ,KAAhE,CAAmCI,UAAnC;AAAA,MAAkDC,SAAlD,4BAAgEL,KAAhE;;AACA,MAAMM,QAAQ,GAAGT,WAAW,EAA5B;;AACA,wBAA0BJ,KAAK,CAACc,QAAN,CAAe,KAAf,CAA1B;AAAA;AAAA,MAAOC,KAAP;AAAA,MAAcC,QAAd;;AAEA,MAAMC,WAAW,GAAG,SAAdA,WAAc,GAAM;AACxBD,IAAAA,QAAQ,CAAC,CAACD,KAAF,CAAR;AACD,GAFD;;AAIA,SACE,oBAAC,QAAD,eACMH,SADN;AAEE,IAAA,SAAS,EAAET,UAAU,CAACD,YAAY,CAAC,sBAAD,EAAyBW,QAAzB,CAAb,kDAClB,8BADkB,EACeL,MADf,gCAElB,6BAFkB,EAEc,CAACA,MAAD,IAAWC,OAFzB,gCAGlB,mCAHkB,EAGoBD,MAAM,IAAIC,OAH9B,gCAIlB,6BAJkB,EAIcM,KAAK,IAAI,CAACN,OAJxB,gBAFvB;AAQE,IAAA,SAAS,EAAC,QARZ;AASE,IAAA,IAAI,EAAC,QATP;AAUE,IAAA,UAAU,EAAEE,UAVd;AAWE,oBAAcH,MAXhB;AAYE,IAAA,OAAO,EAAES,WAZX;AAaE,IAAA,MAAM,EAAEA,WAbV;AAcE,IAAA,QAAQ,EAAE,CAdZ;AAeE,IAAA,SAAS,EAAE,KAfb;AAgBE,IAAA,SAAS,EAAC;AAhBZ,MAkBE,oBAAC,IAAD;AAAM,IAAA,MAAM,EAAC;AAAb,KAAuBP,QAAvB,CAlBF,CADF;AAsBD,CAjCM","sourcesContent":["import * as React from \"react\";\nimport Tappable from \"../Tappable/Tappable\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { HasRootRef } from \"../../types\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport Text from \"../Typography/Text/Text\";\nimport \"./SliderSwitch.css\";\n\nexport interface ButtonProps\n extends React.ButtonHTMLAttributes<HTMLElement>,\n HasRootRef<HTMLElement> {\n active?: boolean;\n hovered?: boolean;\n}\n\n/**\n * @deprecated Этот компонент устарел и будет удален в 5.0.0.\n */\nexport const SliderSwitchButton: React.FunctionComponent<ButtonProps> = (\n props: ButtonProps\n) => {\n const { active, hovered, children, getRootRef, ...restProps } = props;\n const platform = usePlatform();\n const [focus, setFocus] = React.useState(false);\n\n const toggleFocus = () => {\n setFocus(!focus);\n };\n\n return (\n <Tappable\n {...restProps}\n vkuiClass={classNames(getClassName(\"SliderSwitch__button\", platform), {\n [\"SliderSwitch__button--active\"]: active,\n [\"SliderSwitch__button--hover\"]: !active && hovered,\n [\"SliderSwitch__button--activeHover\"]: active && hovered,\n [\"SliderSwitch__button--focus\"]: focus && !hovered,\n })}\n Component=\"button\"\n type=\"button\"\n getRootRef={getRootRef}\n aria-pressed={active}\n onFocus={toggleFocus}\n onBlur={toggleFocus}\n tabIndex={0}\n hasActive={false}\n hoverMode=\"opacity\"\n >\n <Text weight=\"medium\">{children}</Text>\n </Tappable>\n );\n};\n"],"file":"SliderSwitchButton.js"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
import {
|
|
2
|
+
import { HasRootRef } from "../../types";
|
|
3
|
+
import { VisuallyHiddenInputProps } from "../VisuallyHiddenInput/VisuallyHiddenInput";
|
|
3
4
|
import "./Switch.css";
|
|
4
|
-
export interface SwitchProps extends
|
|
5
|
+
export interface SwitchProps extends VisuallyHiddenInputProps, HasRootRef<HTMLLabelElement> {
|
|
5
6
|
}
|
|
6
7
|
export declare const Switch: React.FC<SwitchProps>;
|
|
@@ -1,19 +1,18 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
2
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
3
|
-
var _excluded = ["style", "className", "
|
|
3
|
+
var _excluded = ["style", "className", "getRootRef"];
|
|
4
4
|
import { createScopedElement } from "../../lib/jsxRuntime";
|
|
5
5
|
import { getClassName } from "../../helpers/getClassName";
|
|
6
6
|
import { classNames } from "../../lib/classNames";
|
|
7
7
|
import { callMultiple } from "../../lib/callMultiple";
|
|
8
8
|
import { usePlatform } from "../../hooks/usePlatform";
|
|
9
9
|
import { useAdaptivity } from "../../hooks/useAdaptivity";
|
|
10
|
-
import {
|
|
10
|
+
import { VisuallyHiddenInput } from "../VisuallyHiddenInput/VisuallyHiddenInput";
|
|
11
11
|
import { useFocusVisible } from "../../hooks/useFocusVisible";
|
|
12
12
|
import { FocusVisible } from "../FocusVisible/FocusVisible";
|
|
13
13
|
export var Switch = function Switch(_ref) {
|
|
14
14
|
var style = _ref.style,
|
|
15
15
|
className = _ref.className,
|
|
16
|
-
getRef = _ref.getRef,
|
|
17
16
|
getRootRef = _ref.getRootRef,
|
|
18
17
|
restProps = _objectWithoutProperties(_ref, _excluded);
|
|
19
18
|
|
|
@@ -27,7 +26,6 @@ export var Switch = function Switch(_ref) {
|
|
|
27
26
|
onBlur = _useFocusVisible.onBlur,
|
|
28
27
|
onFocus = _useFocusVisible.onFocus;
|
|
29
28
|
|
|
30
|
-
var inputRef = useExternRef(getRef);
|
|
31
29
|
return createScopedElement("label", {
|
|
32
30
|
vkuiClass: classNames(getClassName("Switch", platform), "Switch--sizeY-".concat(sizeY), {
|
|
33
31
|
"Switch--disabled": restProps.disabled,
|
|
@@ -37,10 +35,9 @@ export var Switch = function Switch(_ref) {
|
|
|
37
35
|
style: style,
|
|
38
36
|
ref: getRootRef,
|
|
39
37
|
role: "presentation"
|
|
40
|
-
}, createScopedElement(
|
|
38
|
+
}, createScopedElement(VisuallyHiddenInput, _extends({}, restProps, {
|
|
41
39
|
type: "checkbox",
|
|
42
40
|
vkuiClass: "Switch__self",
|
|
43
|
-
ref: inputRef,
|
|
44
41
|
onBlur: callMultiple(onBlur, restProps.onBlur),
|
|
45
42
|
onFocus: callMultiple(onFocus, restProps.onFocus)
|
|
46
43
|
})), createScopedElement("span", {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/Switch/Switch.tsx"],"names":["getClassName","classNames","callMultiple","usePlatform","useAdaptivity","
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Switch/Switch.tsx"],"names":["getClassName","classNames","callMultiple","usePlatform","useAdaptivity","VisuallyHiddenInput","useFocusVisible","FocusVisible","Switch","style","className","getRootRef","restProps","platform","sizeY","focusVisible","onBlur","onFocus","disabled"],"mappings":";;;;AACA,SAASA,YAAT;AACA,SAASC,UAAT;AACA,SAASC,YAAT;AACA,SAASC,WAAT;AAEA,SAASC,aAAT;AACA,SACEC,mBADF;AAIA,SAASC,eAAT;AACA,SAASC,YAAT;AAOA,OAAO,IAAMC,MAA6B,GAAG,SAAhCA,MAAgC,OAK1B;AAAA,MAJjBC,KAIiB,QAJjBA,KAIiB;AAAA,MAHjBC,SAGiB,QAHjBA,SAGiB;AAAA,MAFjBC,UAEiB,QAFjBA,UAEiB;AAAA,MADdC,SACc;;AACjB,MAAMC,QAAQ,GAAGV,WAAW,EAA5B;;AACA,uBAAkBC,aAAa,EAA/B;AAAA,MAAQU,KAAR,kBAAQA,KAAR;;AACA,yBAA0CR,eAAe,EAAzD;AAAA,MAAQS,YAAR,oBAAQA,YAAR;AAAA,MAAsBC,MAAtB,oBAAsBA,MAAtB;AAAA,MAA8BC,OAA9B,oBAA8BA,OAA9B;;AAEA,SACE;AACE,IAAA,SAAS,EAAEhB,UAAU,CACnBD,YAAY,CAAC,QAAD,EAAWa,QAAX,CADO,0BAEFC,KAFE,GAGnB;AACE,0BAAoBF,SAAS,CAACM,QADhC;AAEE,+BAAyBH;AAF3B,KAHmB,CADvB;AASE,IAAA,SAAS,EAAEL,SATb;AAUE,IAAA,KAAK,EAAED,KAVT;AAWE,IAAA,GAAG,EAAEE,UAXP;AAYE,IAAA,IAAI,EAAC;AAZP,KAcE,oBAAC,mBAAD,eACMC,SADN;AAEE,IAAA,IAAI,EAAC,UAFP;AAGE,IAAA,SAAS,EAAC,cAHZ;AAIE,IAAA,MAAM,EAAEV,YAAY,CAACc,MAAD,EAASJ,SAAS,CAACI,MAAnB,CAJtB;AAKE,IAAA,OAAO,EAAEd,YAAY,CAACe,OAAD,EAAUL,SAAS,CAACK,OAApB;AALvB,KAdF,EAqBE;AAAM,IAAA,IAAI,EAAC,cAAX;AAA0B,IAAA,SAAS,EAAC;AAApC,IArBF,EAsBE,oBAAC,YAAD;AAAc,IAAA,IAAI,EAAC;AAAnB,IAtBF,CADF;AA0BD,CApCM","sourcesContent":["import * as React from \"react\";\nimport { getClassName } from \"../../helpers/getClassName\";\nimport { classNames } from \"../../lib/classNames\";\nimport { callMultiple } from \"../../lib/callMultiple\";\nimport { usePlatform } from \"../../hooks/usePlatform\";\nimport { HasRootRef } from \"../../types\";\nimport { useAdaptivity } from \"../../hooks/useAdaptivity\";\nimport {\n VisuallyHiddenInput,\n VisuallyHiddenInputProps,\n} from \"../VisuallyHiddenInput/VisuallyHiddenInput\";\nimport { useFocusVisible } from \"../../hooks/useFocusVisible\";\nimport { FocusVisible } from \"../FocusVisible/FocusVisible\";\nimport \"./Switch.css\";\n\nexport interface SwitchProps\n extends VisuallyHiddenInputProps,\n HasRootRef<HTMLLabelElement> {}\n\nexport const Switch: React.FC<SwitchProps> = ({\n style,\n className,\n getRootRef,\n ...restProps\n}: SwitchProps) => {\n const platform = usePlatform();\n const { sizeY } = useAdaptivity();\n const { focusVisible, onBlur, onFocus } = useFocusVisible();\n\n return (\n <label\n vkuiClass={classNames(\n getClassName(\"Switch\", platform),\n `Switch--sizeY-${sizeY}`,\n {\n \"Switch--disabled\": restProps.disabled,\n \"Switch--focus-visible\": focusVisible,\n }\n )}\n className={className}\n style={style}\n ref={getRootRef}\n role=\"presentation\"\n >\n <VisuallyHiddenInput\n {...restProps}\n type=\"checkbox\"\n vkuiClass=\"Switch__self\"\n onBlur={callMultiple(onBlur, restProps.onBlur)}\n onFocus={callMultiple(onFocus, restProps.onFocus)}\n />\n <span role=\"presentation\" vkuiClass=\"Switch__pseudo\" />\n <FocusVisible mode=\"outside\" />\n </label>\n );\n};\n"],"file":"Switch.js"}
|
|
@@ -2,7 +2,10 @@ import * as React from "react";
|
|
|
2
2
|
import { HasComponent } from "../../../types";
|
|
3
3
|
import "./Title.css";
|
|
4
4
|
export interface TitleProps extends React.AllHTMLAttributes<HTMLElement>, HasComponent {
|
|
5
|
-
|
|
5
|
+
/**
|
|
6
|
+
* Начертания "heavy", "bold", "semibold", "medium" и "regular" устарели и будут удалены в 5.0.0.
|
|
7
|
+
*/
|
|
8
|
+
weight?: "heavy" | "bold" | "semibold" | "medium" | "regular" | "1" | "2" | "3";
|
|
6
9
|
level: "1" | "2" | "3";
|
|
7
10
|
}
|
|
8
11
|
declare const Title: React.FC<TitleProps>;
|
|
@@ -1,39 +1,30 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
3
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
3
4
|
var _excluded = ["children", "weight", "level", "Component"];
|
|
4
5
|
import { createScopedElement } from "../../../lib/jsxRuntime";
|
|
5
|
-
import { usePlatform } from "../../../hooks/usePlatform";
|
|
6
6
|
import { classNames } from "../../../lib/classNames";
|
|
7
|
-
import {
|
|
8
|
-
|
|
9
|
-
import Headline from "../Headline/Headline";
|
|
7
|
+
import { warnOnce } from "../../../lib/warnOnce";
|
|
8
|
+
var warn = warnOnce("Title");
|
|
10
9
|
|
|
11
10
|
var Title = function Title(_ref) {
|
|
12
11
|
var children = _ref.children,
|
|
13
|
-
|
|
14
|
-
weight = _ref$weight === void 0 ? "regular" : _ref$weight,
|
|
12
|
+
weight = _ref.weight,
|
|
15
13
|
_ref$level = _ref.level,
|
|
16
14
|
level = _ref$level === void 0 ? "1" : _ref$level,
|
|
17
15
|
Component = _ref.Component,
|
|
18
16
|
restProps = _objectWithoutProperties(_ref, _excluded);
|
|
19
17
|
|
|
20
|
-
var platform = usePlatform();
|
|
21
|
-
|
|
22
18
|
if (!Component) {
|
|
23
19
|
Component = "h" + level;
|
|
24
20
|
}
|
|
25
21
|
|
|
26
|
-
if (
|
|
27
|
-
|
|
28
|
-
return createScopedElement(Headline, _extends({
|
|
29
|
-
Component: Component
|
|
30
|
-
}, restProps, {
|
|
31
|
-
weight: headlineWeight
|
|
32
|
-
}), children);
|
|
22
|
+
if (process.env.NODE_ENV === "development") {
|
|
23
|
+
if (weight && ["heavy", "bold", "semibold", "medium", "regular"].includes(weight)) warn("\u041D\u0430\u0447\u0435\u0440\u0442\u0430\u043D\u0438\u0435 \"".concat(weight, "\" \u0443\u0441\u0442\u0430\u0440\u0435\u043B\u043E \u0438 \u0431\u0443\u0434\u0435\u0442 \u0443\u0434\u0430\u043B\u0435\u043D\u043E \u0432 5.0.0. \u0418\u0441\u043F\u043E\u043B\u044C\u0437\u0443\u0439\u0442\u0435 \u0437\u043D\u0430\u0447\u0435\u043D\u0438\u044F \"1\", \"2\" \u0438 \"3\""));
|
|
33
24
|
}
|
|
34
25
|
|
|
35
26
|
return createScopedElement(Component, _extends({}, restProps, {
|
|
36
|
-
vkuiClass: classNames(
|
|
27
|
+
vkuiClass: classNames("Title", "Title--l-".concat(level), _defineProperty({}, "Title--w-".concat(weight), !!weight))
|
|
37
28
|
}), children);
|
|
38
29
|
}; // eslint-disable-next-line import/no-default-export
|
|
39
30
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/Typography/Title/Title.tsx"],"names":["
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/Typography/Title/Title.tsx"],"names":["classNames","warnOnce","warn","Title","children","weight","level","Component","restProps","process","env","NODE_ENV","includes"],"mappings":";;;;;AAEA,SAASA,UAAT;AACA,SAASC,QAAT;AAqBA,IAAMC,IAAI,GAAGD,QAAQ,CAAC,OAAD,CAArB;;AAEA,IAAME,KAA2B,GAAG,SAA9BA,KAA8B,OAMlB;AAAA,MALhBC,QAKgB,QALhBA,QAKgB;AAAA,MAJhBC,MAIgB,QAJhBA,MAIgB;AAAA,wBAHhBC,KAGgB;AAAA,MAHhBA,KAGgB,2BAHR,GAGQ;AAAA,MAFhBC,SAEgB,QAFhBA,SAEgB;AAAA,MADbC,SACa;;AAChB,MAAI,CAACD,SAAL,EAAgB;AACdA,IAAAA,SAAS,GAAI,MAAMD,KAAnB;AACD;;AAED,MAAIG,OAAO,CAACC,GAAR,CAAYC,QAAZ,KAAyB,aAA7B,EAA4C;AAC1C,QACEN,MAAM,IACN,CAAC,OAAD,EAAU,MAAV,EAAkB,UAAlB,EAA8B,QAA9B,EAAwC,SAAxC,EAAmDO,QAAnD,CAA4DP,MAA5D,CAFF,EAIEH,IAAI,0EACaG,MADb,sSAAJ;AAGH;;AAED,SACE,oBAAC,SAAD,eACMG,SADN;AAEE,IAAA,SAAS,EAAER,UAAU,CAAC,OAAD,qBAAsBM,KAAtB,0CACND,MADM,GACK,CAAC,CAACA,MADP;AAFvB,MAMGD,QANH,CADF;AAUD,CA/BD,C,CAiCA;;;AACA,eAAeD,KAAf","sourcesContent":["import * as React from \"react\";\nimport { HasComponent } from \"../../../types\";\nimport { classNames } from \"../../../lib/classNames\";\nimport { warnOnce } from \"../../../lib/warnOnce\";\nimport \"./Title.css\";\n\nexport interface TitleProps\n extends React.AllHTMLAttributes<HTMLElement>,\n HasComponent {\n /**\n * Начертания \"heavy\", \"bold\", \"semibold\", \"medium\" и \"regular\" устарели и будут удалены в 5.0.0.\n */\n weight?:\n | \"heavy\"\n | \"bold\"\n | \"semibold\"\n | \"medium\"\n | \"regular\"\n | \"1\"\n | \"2\"\n | \"3\";\n level: \"1\" | \"2\" | \"3\";\n}\n\nconst warn = warnOnce(\"Title\");\n\nconst Title: React.FC<TitleProps> = ({\n children,\n weight,\n level = \"1\",\n Component,\n ...restProps\n}: TitleProps) => {\n if (!Component) {\n Component = (\"h\" + level) as React.ElementType;\n }\n\n if (process.env.NODE_ENV === \"development\") {\n if (\n weight &&\n [\"heavy\", \"bold\", \"semibold\", \"medium\", \"regular\"].includes(weight)\n )\n warn(\n `Начертание \"${weight}\" устарело и будет удалено в 5.0.0. Используйте значения \"1\", \"2\" и \"3\"`\n );\n }\n\n return (\n <Component\n {...restProps}\n vkuiClass={classNames(\"Title\", `Title--l-${level}`, {\n [`Title--w-${weight}`]: !!weight,\n })}\n >\n {children}\n </Component>\n );\n};\n\n// eslint-disable-next-line import/no-default-export\nexport default Title;\n"],"file":"Title.js"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { HasRef } from "../../types";
|
|
3
|
+
import "./VisuallyHiddenInput.css";
|
|
4
|
+
export interface VisuallyHiddenInputProps extends React.InputHTMLAttributes<HTMLInputElement>, HasRef<HTMLInputElement> {
|
|
5
|
+
}
|
|
6
|
+
/**
|
|
7
|
+
* @description
|
|
8
|
+
* Обертка над обычным `<input/>`; дает
|
|
9
|
+
* скрыть его визуально и оставить
|
|
10
|
+
* доступным для ассистивных технологий.
|
|
11
|
+
*/
|
|
12
|
+
export declare const VisuallyHiddenInput: React.FC<VisuallyHiddenInputProps>;
|