@hh.ru/magritte-ui-form-label 4.2.25 → 4.2.27
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/FormLabel.js +3 -7
- package/FormLabel.js.map +1 -1
- package/index.css +88 -88
- package/index.js +1 -0
- package/index.js.map +1 -1
- package/package.json +11 -11
package/FormLabel.js
CHANGED
|
@@ -5,6 +5,7 @@ import classNames from 'classnames';
|
|
|
5
5
|
import '@hh.ru/magritte-common-focus-visible';
|
|
6
6
|
import { keyboardMatches, keyboardKeys } from '@hh.ru/magritte-common-keyboard';
|
|
7
7
|
import { useDisabled } from '@hh.ru/magritte-common-use-disabled';
|
|
8
|
+
import { Action } from '@hh.ru/magritte-ui-action';
|
|
8
9
|
import { BottomSheet } from '@hh.ru/magritte-ui-bottom-sheet';
|
|
9
10
|
import { QuestionCircleOutlinedSize16, CrossOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';
|
|
10
11
|
import { NavigationBar } from '@hh.ru/magritte-ui-navigation-bar';
|
|
@@ -12,7 +13,7 @@ import { VSpacing } from '@hh.ru/magritte-ui-spacing';
|
|
|
12
13
|
import { Tooltip } from '@hh.ru/magritte-ui-tooltip';
|
|
13
14
|
import { Text } from '@hh.ru/magritte-ui-typography';
|
|
14
15
|
|
|
15
|
-
var styles = {"form-label":"magritte-form-label___Yzcxs_4-2-
|
|
16
|
+
var styles = {"form-label":"magritte-form-label___Yzcxs_4-2-27","formLabel":"magritte-form-label___Yzcxs_4-2-27","postfix":"magritte-postfix___UBcl3_4-2-27","form-label_disabled":"magritte-form-label_disabled___rq0Rq_4-2-27","formLabelDisabled":"magritte-form-label_disabled___rq0Rq_4-2-27","content":"magritte-content___o4wkg_4-2-27","icon":"magritte-icon___nwksH_4-2-27"};
|
|
16
17
|
|
|
17
18
|
const FormLabel = (props) => {
|
|
18
19
|
const disabled = useDisabled();
|
|
@@ -50,12 +51,7 @@ const FormLabel = (props) => {
|
|
|
50
51
|
: {};
|
|
51
52
|
return (jsxs(Fragment, { children: [jsxs("label", { className: classNames(styles.formLabel, { [styles.formLabelDisabled]: disabled }), "data-qa": dataQa, ...propsForInfo, ...restProps, children: [jsx("span", { className: styles.content, children: children }), postfix && (jsx("span", { className: styles.postfix, "data-qa": "form-label-postfix", children: postfix })), info && (jsx("span", { "data-qa": "form-label-info-icon", className: styles.icon, ref: activatorRef, children: jsx(QuestionCircleOutlinedSize16, {}) }))] }), info && (jsxs(Fragment, { children: [jsx(Tooltip, { maxWidth: 300, visible: showTooltip, activatorRef: activatorRef, placement: "top-center", "data-qa": "form-label-tooltip", children: info }), jsxs(BottomSheet, { visible: showBottomSheet, onClose: () => {
|
|
52
53
|
setShowBottomSheet(false);
|
|
53
|
-
}, header: jsx(NavigationBar, { title: children, right: {
|
|
54
|
-
icon: CrossOutlinedSize24,
|
|
55
|
-
onClick: () => {
|
|
56
|
-
setShowBottomSheet(false);
|
|
57
|
-
},
|
|
58
|
-
}, showDivider: "always" }), "data-qa": "form-label-bottom-sheet", children: [jsx(Text, { typography: "label-2-regular", children: info }), jsx(VSpacing, { default: 16 })] })] }))] }));
|
|
54
|
+
}, header: jsx(NavigationBar, { title: children, right: jsx(Action, { icon: CrossOutlinedSize24, onClick: () => setShowBottomSheet(false) }), showDivider: "always" }), "data-qa": "form-label-bottom-sheet", children: [jsx(Text, { typography: "label-2-regular", children: info }), jsx(VSpacing, { default: 16 })] })] }))] }));
|
|
59
55
|
};
|
|
60
56
|
|
|
61
57
|
export { FormLabel };
|
package/FormLabel.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormLabel.js","sources":["../src/FormLabel.tsx"],"sourcesContent":["import { FC, useCallback, KeyboardEvent, MouseEvent, useState, useRef } from 'react';\nimport classNames from 'classnames';\n\nimport '@hh.ru/magritte-common-focus-visible';\nimport { keyboardMatches, keyboardKeys } from '@hh.ru/magritte-common-keyboard';\nimport { useDisabled } from '@hh.ru/magritte-common-use-disabled';\nimport { BottomSheet } from '@hh.ru/magritte-ui-bottom-sheet';\nimport { FormLabelProps } from '@hh.ru/magritte-ui-form-label/types';\nimport { QuestionCircleOutlinedSize16, CrossOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';\nimport { NavigationBar } from '@hh.ru/magritte-ui-navigation-bar';\nimport { VSpacing } from '@hh.ru/magritte-ui-spacing';\nimport { Tooltip } from '@hh.ru/magritte-ui-tooltip';\nimport { Text } from '@hh.ru/magritte-ui-typography';\n\nimport styles from './form-label.less';\n\nexport const FormLabel: FC<FormLabelProps> = (props: FormLabelProps) => {\n const disabled = useDisabled();\n const [showBottomSheet, setShowBottomSheet] = useState<boolean>(false);\n const [showTooltip, setShowTooltip] = useState<boolean>(false);\n const activatorRef = useRef<HTMLSpanElement | null>(null);\n\n const { children, info, postfix, 'data-qa': dataQa = 'form-label', ...restProps } = props;\n\n const onClick = useCallback(\n (event: MouseEvent) => {\n if (info) {\n event.preventDefault();\n }\n\n if (!disabled) {\n setShowBottomSheet(true);\n }\n },\n [disabled, info]\n );\n\n const onKeyDown = useCallback(\n (event: KeyboardEvent<HTMLLabelElement>) => {\n if (disabled || !onClick) {\n return;\n }\n\n if (keyboardMatches(event.nativeEvent, [keyboardKeys.Enter, keyboardKeys.Space])) {\n onClick(event as unknown as MouseEvent<HTMLLabelElement>);\n }\n },\n [onClick, disabled]\n );\n\n const propsForInfo = info\n ? {\n tabIndex: disabled ? -1 : 0,\n role: 'button',\n onKeyDown,\n onClick,\n onMouseEnter: () => setShowTooltip(true),\n onMouseLeave: () => setShowTooltip(false),\n onFocus: () => setShowTooltip(true),\n onBlur: () => setShowTooltip(false),\n }\n : {};\n\n return (\n <>\n <label\n className={classNames(styles.formLabel, { [styles.formLabelDisabled]: disabled })}\n data-qa={dataQa}\n {...propsForInfo}\n {...restProps}\n >\n <span className={styles.content}>{children}</span>\n {postfix && (\n <span className={styles.postfix} data-qa=\"form-label-postfix\">\n {postfix}\n </span>\n )}\n {info && (\n <span data-qa=\"form-label-info-icon\" className={styles.icon} ref={activatorRef}>\n <QuestionCircleOutlinedSize16 />\n </span>\n )}\n </label>\n {info && (\n <>\n <Tooltip\n maxWidth={300}\n visible={showTooltip}\n activatorRef={activatorRef}\n placement=\"top-center\"\n data-qa=\"form-label-tooltip\"\n >\n {info}\n </Tooltip>\n <BottomSheet\n visible={showBottomSheet}\n onClose={() => {\n setShowBottomSheet(false);\n }}\n header={\n <NavigationBar\n title={children}\n right={{
|
|
1
|
+
{"version":3,"file":"FormLabel.js","sources":["../src/FormLabel.tsx"],"sourcesContent":["import { FC, useCallback, KeyboardEvent, MouseEvent, useState, useRef } from 'react';\nimport classNames from 'classnames';\n\nimport '@hh.ru/magritte-common-focus-visible';\nimport { keyboardMatches, keyboardKeys } from '@hh.ru/magritte-common-keyboard';\nimport { useDisabled } from '@hh.ru/magritte-common-use-disabled';\nimport { Action } from '@hh.ru/magritte-ui-action';\nimport { BottomSheet } from '@hh.ru/magritte-ui-bottom-sheet';\nimport { FormLabelProps } from '@hh.ru/magritte-ui-form-label/types';\nimport { QuestionCircleOutlinedSize16, CrossOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';\nimport { NavigationBar } from '@hh.ru/magritte-ui-navigation-bar';\nimport { VSpacing } from '@hh.ru/magritte-ui-spacing';\nimport { Tooltip } from '@hh.ru/magritte-ui-tooltip';\nimport { Text } from '@hh.ru/magritte-ui-typography';\n\nimport styles from './form-label.less';\n\nexport const FormLabel: FC<FormLabelProps> = (props: FormLabelProps) => {\n const disabled = useDisabled();\n const [showBottomSheet, setShowBottomSheet] = useState<boolean>(false);\n const [showTooltip, setShowTooltip] = useState<boolean>(false);\n const activatorRef = useRef<HTMLSpanElement | null>(null);\n\n const { children, info, postfix, 'data-qa': dataQa = 'form-label', ...restProps } = props;\n\n const onClick = useCallback(\n (event: MouseEvent) => {\n if (info) {\n event.preventDefault();\n }\n\n if (!disabled) {\n setShowBottomSheet(true);\n }\n },\n [disabled, info]\n );\n\n const onKeyDown = useCallback(\n (event: KeyboardEvent<HTMLLabelElement>) => {\n if (disabled || !onClick) {\n return;\n }\n\n if (keyboardMatches(event.nativeEvent, [keyboardKeys.Enter, keyboardKeys.Space])) {\n onClick(event as unknown as MouseEvent<HTMLLabelElement>);\n }\n },\n [onClick, disabled]\n );\n\n const propsForInfo = info\n ? {\n tabIndex: disabled ? -1 : 0,\n role: 'button',\n onKeyDown,\n onClick,\n onMouseEnter: () => setShowTooltip(true),\n onMouseLeave: () => setShowTooltip(false),\n onFocus: () => setShowTooltip(true),\n onBlur: () => setShowTooltip(false),\n }\n : {};\n\n return (\n <>\n <label\n className={classNames(styles.formLabel, { [styles.formLabelDisabled]: disabled })}\n data-qa={dataQa}\n {...propsForInfo}\n {...restProps}\n >\n <span className={styles.content}>{children}</span>\n {postfix && (\n <span className={styles.postfix} data-qa=\"form-label-postfix\">\n {postfix}\n </span>\n )}\n {info && (\n <span data-qa=\"form-label-info-icon\" className={styles.icon} ref={activatorRef}>\n <QuestionCircleOutlinedSize16 />\n </span>\n )}\n </label>\n {info && (\n <>\n <Tooltip\n maxWidth={300}\n visible={showTooltip}\n activatorRef={activatorRef}\n placement=\"top-center\"\n data-qa=\"form-label-tooltip\"\n >\n {info}\n </Tooltip>\n <BottomSheet\n visible={showBottomSheet}\n onClose={() => {\n setShowBottomSheet(false);\n }}\n header={\n <NavigationBar\n title={children}\n right={<Action icon={CrossOutlinedSize24} onClick={() => setShowBottomSheet(false)} />}\n showDivider=\"always\"\n />\n }\n data-qa=\"form-label-bottom-sheet\"\n >\n <Text typography=\"label-2-regular\">{info}</Text>\n <VSpacing default={16} />\n </BottomSheet>\n </>\n )}\n </>\n );\n};\n"],"names":["_jsxs","_Fragment","_jsx"],"mappings":"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"}
|
package/index.css
CHANGED
|
@@ -1,127 +1,127 @@
|
|
|
1
1
|
:root{
|
|
2
|
-
--magritte-color-stroke-state-focused-accessible-
|
|
3
|
-
--magritte-color-text-secondary-
|
|
4
|
-
--magritte-color-text-tertiary-
|
|
5
|
-
--magritte-color-text-state-secondary-hovered-
|
|
6
|
-
--magritte-color-text-state-secondary-pressed-
|
|
7
|
-
--magritte-color-text-state-secondary-disabled-
|
|
8
|
-
--magritte-color-text-state-tertiary-hovered-
|
|
9
|
-
--magritte-color-text-state-tertiary-pressed-
|
|
10
|
-
--magritte-color-text-state-tertiary-disabled-
|
|
11
|
-
--magritte-color-icon-secondary-
|
|
12
|
-
--magritte-color-icon-state-secondary-hovered-
|
|
13
|
-
--magritte-color-icon-state-secondary-pressed-
|
|
14
|
-
--magritte-color-icon-state-secondary-disabled-
|
|
2
|
+
--magritte-color-stroke-state-focused-accessible-v19-0-0:#0070ff7a;
|
|
3
|
+
--magritte-color-text-secondary-v19-0-0:#768694;
|
|
4
|
+
--magritte-color-text-tertiary-v19-0-0:#AABBCA;
|
|
5
|
+
--magritte-color-text-state-secondary-hovered-v19-0-0:#768694;
|
|
6
|
+
--magritte-color-text-state-secondary-pressed-v19-0-0:#768694;
|
|
7
|
+
--magritte-color-text-state-secondary-disabled-v19-0-0:#7686947a;
|
|
8
|
+
--magritte-color-text-state-tertiary-hovered-v19-0-0:#AABBCA;
|
|
9
|
+
--magritte-color-text-state-tertiary-pressed-v19-0-0:#AABBCA;
|
|
10
|
+
--magritte-color-text-state-tertiary-disabled-v19-0-0:#aabbca7a;
|
|
11
|
+
--magritte-color-icon-secondary-v19-0-0:#768694;
|
|
12
|
+
--magritte-color-icon-state-secondary-hovered-v19-0-0:#20262b;
|
|
13
|
+
--magritte-color-icon-state-secondary-pressed-v19-0-0:#768694;
|
|
14
|
+
--magritte-color-icon-state-secondary-disabled-v19-0-0:#BBC8D4;
|
|
15
15
|
}
|
|
16
16
|
:root{
|
|
17
|
-
--magritte-typography-subtitle-1-semibold-font-family-
|
|
18
|
-
--magritte-typography-subtitle-1-semibold-font-weight-
|
|
19
|
-
--magritte-typography-subtitle-1-semibold-line-height-
|
|
20
|
-
--magritte-typography-subtitle-1-semibold-font-size-
|
|
21
|
-
--magritte-typography-subtitle-1-semibold-letter-spacing-
|
|
22
|
-
--magritte-typography-subtitle-1-semibold-text-indent-
|
|
23
|
-
--magritte-typography-subtitle-1-semibold-text-transform-
|
|
24
|
-
--magritte-typography-subtitle-1-semibold-text-decoration-
|
|
25
|
-
--magritte-typography-label-2-regular-font-family-
|
|
26
|
-
--magritte-typography-label-2-regular-font-weight-
|
|
27
|
-
--magritte-typography-label-2-regular-line-height-
|
|
28
|
-
--magritte-typography-label-2-regular-font-size-
|
|
29
|
-
--magritte-typography-label-2-regular-letter-spacing-
|
|
30
|
-
--magritte-typography-label-2-regular-text-indent-
|
|
31
|
-
--magritte-typography-label-2-regular-text-transform-
|
|
32
|
-
--magritte-typography-label-2-regular-text-decoration-
|
|
17
|
+
--magritte-typography-subtitle-1-semibold-font-family-v19-0-0:"Inter";
|
|
18
|
+
--magritte-typography-subtitle-1-semibold-font-weight-v19-0-0:600;
|
|
19
|
+
--magritte-typography-subtitle-1-semibold-line-height-v19-0-0:22px;
|
|
20
|
+
--magritte-typography-subtitle-1-semibold-font-size-v19-0-0:16px;
|
|
21
|
+
--magritte-typography-subtitle-1-semibold-letter-spacing-v19-0-0:0em;
|
|
22
|
+
--magritte-typography-subtitle-1-semibold-text-indent-v19-0-0:0px;
|
|
23
|
+
--magritte-typography-subtitle-1-semibold-text-transform-v19-0-0:none;
|
|
24
|
+
--magritte-typography-subtitle-1-semibold-text-decoration-v19-0-0:none;
|
|
25
|
+
--magritte-typography-label-2-regular-font-family-v19-0-0:"Inter";
|
|
26
|
+
--magritte-typography-label-2-regular-font-weight-v19-0-0:400;
|
|
27
|
+
--magritte-typography-label-2-regular-line-height-v19-0-0:22px;
|
|
28
|
+
--magritte-typography-label-2-regular-font-size-v19-0-0:16px;
|
|
29
|
+
--magritte-typography-label-2-regular-letter-spacing-v19-0-0:0em;
|
|
30
|
+
--magritte-typography-label-2-regular-text-indent-v19-0-0:0px;
|
|
31
|
+
--magritte-typography-label-2-regular-text-transform-v19-0-0:none;
|
|
32
|
+
--magritte-typography-label-2-regular-text-decoration-v19-0-0:none;
|
|
33
33
|
}
|
|
34
34
|
.magritte-night-theme{
|
|
35
|
-
--magritte-color-stroke-state-focused-accessible-
|
|
36
|
-
--magritte-color-text-secondary-
|
|
37
|
-
--magritte-color-text-tertiary-
|
|
38
|
-
--magritte-color-text-state-secondary-hovered-
|
|
39
|
-
--magritte-color-text-state-secondary-disabled-
|
|
40
|
-
--magritte-color-text-state-tertiary-hovered-
|
|
41
|
-
--magritte-color-text-state-tertiary-disabled-
|
|
42
|
-
--magritte-color-text-state-secondary-pressed-
|
|
43
|
-
--magritte-color-text-state-tertiary-pressed-
|
|
44
|
-
--magritte-color-icon-secondary-
|
|
45
|
-
--magritte-color-icon-state-secondary-hovered-
|
|
46
|
-
--magritte-color-icon-state-secondary-pressed-
|
|
47
|
-
--magritte-color-icon-state-secondary-disabled-
|
|
35
|
+
--magritte-color-stroke-state-focused-accessible-v19-0-0:#0070ff7a;
|
|
36
|
+
--magritte-color-text-secondary-v19-0-0:#ABABAB;
|
|
37
|
+
--magritte-color-text-tertiary-v19-0-0:#767676;
|
|
38
|
+
--magritte-color-text-state-secondary-hovered-v19-0-0:#ABABAB;
|
|
39
|
+
--magritte-color-text-state-secondary-disabled-v19-0-0:#ababab7a;
|
|
40
|
+
--magritte-color-text-state-tertiary-hovered-v19-0-0:#767676;
|
|
41
|
+
--magritte-color-text-state-tertiary-disabled-v19-0-0:#7676767a;
|
|
42
|
+
--magritte-color-text-state-secondary-pressed-v19-0-0:#768694;
|
|
43
|
+
--magritte-color-text-state-tertiary-pressed-v19-0-0:#AABBCA;
|
|
44
|
+
--magritte-color-icon-secondary-v19-0-0:#ABABAB;
|
|
45
|
+
--magritte-color-icon-state-secondary-hovered-v19-0-0:#ABABAB;
|
|
46
|
+
--magritte-color-icon-state-secondary-pressed-v19-0-0:#ABABAB;
|
|
47
|
+
--magritte-color-icon-state-secondary-disabled-v19-0-0:#767676;
|
|
48
48
|
}
|
|
49
|
-
.magritte-form-label___Yzcxs_4-2-
|
|
50
|
-
font-family:var(--magritte-typography-label-2-regular-font-family-
|
|
51
|
-
font-weight:var(--magritte-typography-label-2-regular-font-weight-
|
|
52
|
-
line-height:var(--magritte-typography-label-2-regular-line-height-
|
|
53
|
-
font-size:var(--magritte-typography-label-2-regular-font-size-
|
|
54
|
-
letter-spacing:var(--magritte-typography-label-2-regular-letter-spacing-
|
|
55
|
-
text-indent:var(--magritte-typography-label-2-regular-text-indent-
|
|
56
|
-
text-transform:var(--magritte-typography-label-2-regular-text-transform-
|
|
57
|
-
text-decoration:var(--magritte-typography-label-2-regular-text-decoration-
|
|
49
|
+
.magritte-form-label___Yzcxs_4-2-27{
|
|
50
|
+
font-family:var(--magritte-typography-label-2-regular-font-family-v19-0-0);
|
|
51
|
+
font-weight:var(--magritte-typography-label-2-regular-font-weight-v19-0-0);
|
|
52
|
+
line-height:var(--magritte-typography-label-2-regular-line-height-v19-0-0);
|
|
53
|
+
font-size:var(--magritte-typography-label-2-regular-font-size-v19-0-0);
|
|
54
|
+
letter-spacing:var(--magritte-typography-label-2-regular-letter-spacing-v19-0-0);
|
|
55
|
+
text-indent:var(--magritte-typography-label-2-regular-text-indent-v19-0-0);
|
|
56
|
+
text-transform:var(--magritte-typography-label-2-regular-text-transform-v19-0-0);
|
|
57
|
+
text-decoration:var(--magritte-typography-label-2-regular-text-decoration-v19-0-0);
|
|
58
58
|
display:inline-flex;
|
|
59
59
|
gap:6px;
|
|
60
60
|
align-items:center;
|
|
61
61
|
border-radius:50vh;
|
|
62
|
-
color:var(--magritte-color-text-secondary-
|
|
63
|
-
--magritte-ui-icon-color-override:var(--magritte-color-icon-secondary-
|
|
62
|
+
color:var(--magritte-color-text-secondary-v19-0-0);
|
|
63
|
+
--magritte-ui-icon-color-override:var(--magritte-color-icon-secondary-v19-0-0);
|
|
64
64
|
}
|
|
65
|
-
.magritte-form-label___Yzcxs_4-2-
|
|
66
|
-
color:var(--magritte-color-text-tertiary-
|
|
65
|
+
.magritte-form-label___Yzcxs_4-2-27 .magritte-postfix___UBcl3_4-2-27{
|
|
66
|
+
color:var(--magritte-color-text-tertiary-v19-0-0);
|
|
67
67
|
}
|
|
68
|
-
.magritte-form-label___Yzcxs_4-2-
|
|
69
|
-
outline:var(--magritte-color-stroke-state-focused-accessible-
|
|
68
|
+
.magritte-form-label___Yzcxs_4-2-27.focus-visible{
|
|
69
|
+
outline:var(--magritte-color-stroke-state-focused-accessible-v19-0-0) solid 4px;
|
|
70
70
|
}
|
|
71
|
-
.magritte-form-label___Yzcxs_4-2-
|
|
72
|
-
color:var(--magritte-color-text-state-secondary-pressed-
|
|
73
|
-
--magritte-ui-icon-color-override:var(--magritte-color-icon-state-secondary-pressed-
|
|
71
|
+
.magritte-form-label___Yzcxs_4-2-27:not(.magritte-form-label_disabled___rq0Rq_4-2-27):active{
|
|
72
|
+
color:var(--magritte-color-text-state-secondary-pressed-v19-0-0);
|
|
73
|
+
--magritte-ui-icon-color-override:var(--magritte-color-icon-state-secondary-pressed-v19-0-0);
|
|
74
74
|
}
|
|
75
|
-
.magritte-form-label___Yzcxs_4-2-
|
|
76
|
-
color:var(--magritte-color-text-state-tertiary-pressed-
|
|
75
|
+
.magritte-form-label___Yzcxs_4-2-27:not(.magritte-form-label_disabled___rq0Rq_4-2-27):active .magritte-postfix___UBcl3_4-2-27{
|
|
76
|
+
color:var(--magritte-color-text-state-tertiary-pressed-v19-0-0);
|
|
77
77
|
}
|
|
78
78
|
@media (min-width: 1020px){
|
|
79
|
-
body.magritte-old-layout .magritte-form-label___Yzcxs_4-2-
|
|
80
|
-
color:var(--magritte-color-text-state-secondary-hovered-
|
|
81
|
-
--magritte-ui-icon-color-override:var(--magritte-color-icon-state-secondary-hovered-
|
|
79
|
+
body.magritte-old-layout .magritte-form-label___Yzcxs_4-2-27:hover:not(.magritte-form-label_disabled___rq0Rq_4-2-27):not(:active){
|
|
80
|
+
color:var(--magritte-color-text-state-secondary-hovered-v19-0-0);
|
|
81
|
+
--magritte-ui-icon-color-override:var(--magritte-color-icon-state-secondary-hovered-v19-0-0);
|
|
82
82
|
}
|
|
83
|
-
body.magritte-old-layout .magritte-form-label___Yzcxs_4-2-
|
|
84
|
-
color:var(--magritte-color-text-state-tertiary-hovered-
|
|
83
|
+
body.magritte-old-layout .magritte-form-label___Yzcxs_4-2-27:hover:not(.magritte-form-label_disabled___rq0Rq_4-2-27):not(:active) .magritte-postfix___UBcl3_4-2-27{
|
|
84
|
+
color:var(--magritte-color-text-state-tertiary-hovered-v19-0-0);
|
|
85
85
|
}
|
|
86
86
|
}
|
|
87
87
|
@media (min-width: 1024px){
|
|
88
|
-
body:not(.magritte-old-layout) .magritte-form-label___Yzcxs_4-2-
|
|
89
|
-
color:var(--magritte-color-text-state-secondary-hovered-
|
|
90
|
-
--magritte-ui-icon-color-override:var(--magritte-color-icon-state-secondary-hovered-
|
|
88
|
+
body:not(.magritte-old-layout) .magritte-form-label___Yzcxs_4-2-27:hover:not(.magritte-form-label_disabled___rq0Rq_4-2-27):not(:active){
|
|
89
|
+
color:var(--magritte-color-text-state-secondary-hovered-v19-0-0);
|
|
90
|
+
--magritte-ui-icon-color-override:var(--magritte-color-icon-state-secondary-hovered-v19-0-0);
|
|
91
91
|
}
|
|
92
|
-
body:not(.magritte-old-layout) .magritte-form-label___Yzcxs_4-2-
|
|
93
|
-
color:var(--magritte-color-text-state-tertiary-hovered-
|
|
92
|
+
body:not(.magritte-old-layout) .magritte-form-label___Yzcxs_4-2-27:hover:not(.magritte-form-label_disabled___rq0Rq_4-2-27):not(:active) .magritte-postfix___UBcl3_4-2-27{
|
|
93
|
+
color:var(--magritte-color-text-state-tertiary-hovered-v19-0-0);
|
|
94
94
|
}
|
|
95
95
|
}
|
|
96
|
-
.magritte-form-label_disabled___rq0Rq_4-2-
|
|
97
|
-
color:var(--magritte-color-text-state-secondary-disabled-
|
|
98
|
-
--magritte-ui-icon-color-override:var(--magritte-color-icon-state-secondary-disabled-
|
|
96
|
+
.magritte-form-label_disabled___rq0Rq_4-2-27{
|
|
97
|
+
color:var(--magritte-color-text-state-secondary-disabled-v19-0-0);
|
|
98
|
+
--magritte-ui-icon-color-override:var(--magritte-color-icon-state-secondary-disabled-v19-0-0);
|
|
99
99
|
}
|
|
100
|
-
.magritte-form-label_disabled___rq0Rq_4-2-
|
|
101
|
-
color:var(--magritte-color-text-state-tertiary-disabled-
|
|
100
|
+
.magritte-form-label_disabled___rq0Rq_4-2-27 .magritte-postfix___UBcl3_4-2-27{
|
|
101
|
+
color:var(--magritte-color-text-state-tertiary-disabled-v19-0-0);
|
|
102
102
|
}
|
|
103
|
-
.magritte-content___o4wkg_4-2-
|
|
103
|
+
.magritte-content___o4wkg_4-2-27{
|
|
104
104
|
flex:0 1 auto;
|
|
105
105
|
min-width:0;
|
|
106
106
|
overflow:hidden;
|
|
107
107
|
text-overflow:ellipsis;
|
|
108
108
|
}
|
|
109
|
-
.magritte-postfix___UBcl3_4-2-
|
|
110
|
-
font-family:var(--magritte-typography-subtitle-1-semibold-font-family-
|
|
111
|
-
font-weight:var(--magritte-typography-subtitle-1-semibold-font-weight-
|
|
112
|
-
line-height:var(--magritte-typography-subtitle-1-semibold-line-height-
|
|
113
|
-
font-size:var(--magritte-typography-subtitle-1-semibold-font-size-
|
|
114
|
-
letter-spacing:var(--magritte-typography-subtitle-1-semibold-letter-spacing-
|
|
115
|
-
text-indent:var(--magritte-typography-subtitle-1-semibold-text-indent-
|
|
116
|
-
text-transform:var(--magritte-typography-subtitle-1-semibold-text-transform-
|
|
117
|
-
text-decoration:var(--magritte-typography-subtitle-1-semibold-text-decoration-
|
|
109
|
+
.magritte-postfix___UBcl3_4-2-27{
|
|
110
|
+
font-family:var(--magritte-typography-subtitle-1-semibold-font-family-v19-0-0);
|
|
111
|
+
font-weight:var(--magritte-typography-subtitle-1-semibold-font-weight-v19-0-0);
|
|
112
|
+
line-height:var(--magritte-typography-subtitle-1-semibold-line-height-v19-0-0);
|
|
113
|
+
font-size:var(--magritte-typography-subtitle-1-semibold-font-size-v19-0-0);
|
|
114
|
+
letter-spacing:var(--magritte-typography-subtitle-1-semibold-letter-spacing-v19-0-0);
|
|
115
|
+
text-indent:var(--magritte-typography-subtitle-1-semibold-text-indent-v19-0-0);
|
|
116
|
+
text-transform:var(--magritte-typography-subtitle-1-semibold-text-transform-v19-0-0);
|
|
117
|
+
text-decoration:var(--magritte-typography-subtitle-1-semibold-text-decoration-v19-0-0);
|
|
118
118
|
flex:0 0 auto;
|
|
119
119
|
max-width:100%;
|
|
120
120
|
overflow:hidden;
|
|
121
121
|
text-overflow:ellipsis;
|
|
122
122
|
white-space:nowrap;
|
|
123
123
|
}
|
|
124
|
-
.magritte-icon___nwksH_4-2-
|
|
124
|
+
.magritte-icon___nwksH_4-2-27{
|
|
125
125
|
display:inline-flex;
|
|
126
126
|
align-items:center;
|
|
127
127
|
}
|
package/index.js
CHANGED
|
@@ -7,6 +7,7 @@ import 'classnames';
|
|
|
7
7
|
import '@hh.ru/magritte-common-focus-visible';
|
|
8
8
|
import '@hh.ru/magritte-common-keyboard';
|
|
9
9
|
import '@hh.ru/magritte-common-use-disabled';
|
|
10
|
+
import '@hh.ru/magritte-ui-action';
|
|
10
11
|
import '@hh.ru/magritte-ui-bottom-sheet';
|
|
11
12
|
import '@hh.ru/magritte-ui-icon/icon';
|
|
12
13
|
import '@hh.ru/magritte-ui-navigation-bar';
|
package/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@hh.ru/magritte-ui-form-label",
|
|
3
|
-
"version": "4.2.
|
|
3
|
+
"version": "4.2.27",
|
|
4
4
|
"main": "index.js",
|
|
5
5
|
"types": "index.d.ts",
|
|
6
6
|
"sideEffects": [
|
|
@@ -23,18 +23,18 @@
|
|
|
23
23
|
"@hh.ru/magritte-common-focus-visible": "0.1.5",
|
|
24
24
|
"@hh.ru/magritte-common-keyboard": "4.0.1",
|
|
25
25
|
"@hh.ru/magritte-common-use-disabled": "1.0.9",
|
|
26
|
-
"@hh.ru/magritte-design-tokens": "
|
|
26
|
+
"@hh.ru/magritte-design-tokens": "19.0.0",
|
|
27
27
|
"@hh.ru/magritte-types": "4.0.2",
|
|
28
|
-
"@hh.ru/magritte-ui-action": "4.
|
|
29
|
-
"@hh.ru/magritte-ui-bottom-sheet": "5.3.
|
|
28
|
+
"@hh.ru/magritte-ui-action": "4.4.1",
|
|
29
|
+
"@hh.ru/magritte-ui-bottom-sheet": "5.3.11",
|
|
30
30
|
"@hh.ru/magritte-ui-breakpoint": "4.0.3",
|
|
31
|
-
"@hh.ru/magritte-ui-icon": "7.5.
|
|
31
|
+
"@hh.ru/magritte-ui-icon": "7.5.2",
|
|
32
32
|
"@hh.ru/magritte-ui-mock-component": "1.0.11",
|
|
33
|
-
"@hh.ru/magritte-ui-navigation-bar": "
|
|
34
|
-
"@hh.ru/magritte-ui-spacing": "2.0.
|
|
35
|
-
"@hh.ru/magritte-ui-theme-provider": "1.1.
|
|
36
|
-
"@hh.ru/magritte-ui-tooltip": "7.0.
|
|
37
|
-
"@hh.ru/magritte-ui-typography": "3.0.
|
|
33
|
+
"@hh.ru/magritte-ui-navigation-bar": "6.0.1",
|
|
34
|
+
"@hh.ru/magritte-ui-spacing": "2.0.28",
|
|
35
|
+
"@hh.ru/magritte-ui-theme-provider": "1.1.28",
|
|
36
|
+
"@hh.ru/magritte-ui-tooltip": "7.0.12",
|
|
37
|
+
"@hh.ru/magritte-ui-typography": "3.0.15"
|
|
38
38
|
},
|
|
39
39
|
"peerDependencies": {
|
|
40
40
|
"classnames": ">=2.3.2",
|
|
@@ -43,5 +43,5 @@
|
|
|
43
43
|
"publishConfig": {
|
|
44
44
|
"access": "public"
|
|
45
45
|
},
|
|
46
|
-
"gitHead": "
|
|
46
|
+
"gitHead": "221bc5bb48b75a7d399b5db083a3da598e543f9f"
|
|
47
47
|
}
|