@hh.ru/magritte-ui-form-label 6.0.15 → 6.1.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/FormLabel.js +2 -3
- package/FormLabel.js.map +1 -1
- package/index.css +230 -230
- package/index.js +0 -1
- package/index.js.map +1 -1
- package/package.json +9 -10
package/FormLabel.js
CHANGED
|
@@ -5,7 +5,6 @@ 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';
|
|
9
8
|
import { BottomSheet } from '@hh.ru/magritte-ui-bottom-sheet';
|
|
10
9
|
import { QuestionCircleOutlinedSize16, CrossOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';
|
|
11
10
|
import { NavigationBar } from '@hh.ru/magritte-ui-navigation-bar';
|
|
@@ -13,7 +12,7 @@ import { VSpacing } from '@hh.ru/magritte-ui-spacing';
|
|
|
13
12
|
import { Tooltip } from '@hh.ru/magritte-ui-tooltip';
|
|
14
13
|
import { Text } from '@hh.ru/magritte-ui-typography';
|
|
15
14
|
|
|
16
|
-
var styles = {"form-label":"magritte-form-label___Yzcxs_6-0
|
|
15
|
+
var styles = {"form-label":"magritte-form-label___Yzcxs_6-1-0","formLabel":"magritte-form-label___Yzcxs_6-1-0","content":"magritte-content___o4wkg_6-1-0","postfix":"magritte-postfix___UBcl3_6-1-0","icon":"magritte-icon___nwksH_6-1-0","style-text__primary":"magritte-style-text__primary___O5HzE_6-1-0","styleTextPrimary":"magritte-style-text__primary___O5HzE_6-1-0","form-label_disabled":"magritte-form-label_disabled___rq0Rq_6-1-0","formLabelDisabled":"magritte-form-label_disabled___rq0Rq_6-1-0","style-text__secondary":"magritte-style-text__secondary___Uc8qw_6-1-0","styleTextSecondary":"magritte-style-text__secondary___Uc8qw_6-1-0","style-text__tertiary":"magritte-style-text__tertiary___4Tv0c_6-1-0","styleTextTertiary":"magritte-style-text__tertiary___4Tv0c_6-1-0","style-text__accent":"magritte-style-text__accent___DO4-g_6-1-0","styleTextAccent":"magritte-style-text__accent___DO4-g_6-1-0","style-text__accent-secondary":"magritte-style-text__accent-secondary___vZP4l_6-1-0","styleTextAccentSecondary":"magritte-style-text__accent-secondary___vZP4l_6-1-0","style-text__positive":"magritte-style-text__positive___A7nAW_6-1-0","styleTextPositive":"magritte-style-text__positive___A7nAW_6-1-0","style-text__positive-secondary":"magritte-style-text__positive-secondary___BVzsp_6-1-0","styleTextPositiveSecondary":"magritte-style-text__positive-secondary___BVzsp_6-1-0","style-text__negative":"magritte-style-text__negative___bfQGc_6-1-0","styleTextNegative":"magritte-style-text__negative___bfQGc_6-1-0","style-text__negative-secondary":"magritte-style-text__negative-secondary___dwdIU_6-1-0","styleTextNegativeSecondary":"magritte-style-text__negative-secondary___dwdIU_6-1-0","style-text__warning":"magritte-style-text__warning___LMwJL_6-1-0","styleTextWarning":"magritte-style-text__warning___LMwJL_6-1-0","style-text__warning-secondary":"magritte-style-text__warning-secondary___00jFu_6-1-0","styleTextWarningSecondary":"magritte-style-text__warning-secondary___00jFu_6-1-0","style-text__special":"magritte-style-text__special___dM5OC_6-1-0","styleTextSpecial":"magritte-style-text__special___dM5OC_6-1-0","style-text__special-secondary":"magritte-style-text__special-secondary___TW9M0_6-1-0","styleTextSpecialSecondary":"magritte-style-text__special-secondary___TW9M0_6-1-0","style-text__contrast":"magritte-style-text__contrast___gdVqp_6-1-0","styleTextContrast":"magritte-style-text__contrast___gdVqp_6-1-0","style-text__contrast-secondary":"magritte-style-text__contrast-secondary___Vg7J2_6-1-0","styleTextContrastSecondary":"magritte-style-text__contrast-secondary___Vg7J2_6-1-0","style-postfix__primary":"magritte-style-postfix__primary___SZze8_6-1-0","stylePostfixPrimary":"magritte-style-postfix__primary___SZze8_6-1-0","style-postfix__secondary":"magritte-style-postfix__secondary___62v6C_6-1-0","stylePostfixSecondary":"magritte-style-postfix__secondary___62v6C_6-1-0","style-postfix__tertiary":"magritte-style-postfix__tertiary___ETf7E_6-1-0","stylePostfixTertiary":"magritte-style-postfix__tertiary___ETf7E_6-1-0","style-postfix__accent":"magritte-style-postfix__accent___qZ4eI_6-1-0","stylePostfixAccent":"magritte-style-postfix__accent___qZ4eI_6-1-0","style-postfix__accent-secondary":"magritte-style-postfix__accent-secondary___X20G-_6-1-0","stylePostfixAccentSecondary":"magritte-style-postfix__accent-secondary___X20G-_6-1-0","style-postfix__positive":"magritte-style-postfix__positive___X1KrC_6-1-0","stylePostfixPositive":"magritte-style-postfix__positive___X1KrC_6-1-0","style-postfix__positive-secondary":"magritte-style-postfix__positive-secondary___mcQO2_6-1-0","stylePostfixPositiveSecondary":"magritte-style-postfix__positive-secondary___mcQO2_6-1-0","style-postfix__negative":"magritte-style-postfix__negative___FTrS7_6-1-0","stylePostfixNegative":"magritte-style-postfix__negative___FTrS7_6-1-0","style-postfix__negative-secondary":"magritte-style-postfix__negative-secondary___Z3jnL_6-1-0","stylePostfixNegativeSecondary":"magritte-style-postfix__negative-secondary___Z3jnL_6-1-0","style-postfix__warning":"magritte-style-postfix__warning___WvGdQ_6-1-0","stylePostfixWarning":"magritte-style-postfix__warning___WvGdQ_6-1-0","style-postfix__warning-secondary":"magritte-style-postfix__warning-secondary___bGMil_6-1-0","stylePostfixWarningSecondary":"magritte-style-postfix__warning-secondary___bGMil_6-1-0","style-postfix__special":"magritte-style-postfix__special___lBEXe_6-1-0","stylePostfixSpecial":"magritte-style-postfix__special___lBEXe_6-1-0","style-postfix__special-secondary":"magritte-style-postfix__special-secondary___oTEbd_6-1-0","stylePostfixSpecialSecondary":"magritte-style-postfix__special-secondary___oTEbd_6-1-0","style-postfix__contrast":"magritte-style-postfix__contrast___BrIfF_6-1-0","stylePostfixContrast":"magritte-style-postfix__contrast___BrIfF_6-1-0","style-postfix__contrast-secondary":"magritte-style-postfix__contrast-secondary___bcpSX_6-1-0","stylePostfixContrastSecondary":"magritte-style-postfix__contrast-secondary___bcpSX_6-1-0","style-icon__primary":"magritte-style-icon__primary___sIzuU_6-1-0","styleIconPrimary":"magritte-style-icon__primary___sIzuU_6-1-0","style-icon__secondary":"magritte-style-icon__secondary___zivt-_6-1-0","styleIconSecondary":"magritte-style-icon__secondary___zivt-_6-1-0","style-icon__tertiary":"magritte-style-icon__tertiary___zkP-z_6-1-0","styleIconTertiary":"magritte-style-icon__tertiary___zkP-z_6-1-0","style-icon__accent":"magritte-style-icon__accent___xcbA1_6-1-0","styleIconAccent":"magritte-style-icon__accent___xcbA1_6-1-0","style-icon__accent-secondary":"magritte-style-icon__accent-secondary___AgGVg_6-1-0","styleIconAccentSecondary":"magritte-style-icon__accent-secondary___AgGVg_6-1-0","style-icon__positive":"magritte-style-icon__positive___163dH_6-1-0","styleIconPositive":"magritte-style-icon__positive___163dH_6-1-0","style-icon__positive-secondary":"magritte-style-icon__positive-secondary___x5bUo_6-1-0","styleIconPositiveSecondary":"magritte-style-icon__positive-secondary___x5bUo_6-1-0","style-icon__negative":"magritte-style-icon__negative___2KuxQ_6-1-0","styleIconNegative":"magritte-style-icon__negative___2KuxQ_6-1-0","style-icon__negative-secondary":"magritte-style-icon__negative-secondary___0eEdz_6-1-0","styleIconNegativeSecondary":"magritte-style-icon__negative-secondary___0eEdz_6-1-0","style-icon__warning":"magritte-style-icon__warning___hJNkL_6-1-0","styleIconWarning":"magritte-style-icon__warning___hJNkL_6-1-0","style-icon__warning-secondary":"magritte-style-icon__warning-secondary___nkKO2_6-1-0","styleIconWarningSecondary":"magritte-style-icon__warning-secondary___nkKO2_6-1-0","style-icon__special":"magritte-style-icon__special___U-skl_6-1-0","styleIconSpecial":"magritte-style-icon__special___U-skl_6-1-0","style-icon__special-secondary":"magritte-style-icon__special-secondary___rbPs0_6-1-0","styleIconSpecialSecondary":"magritte-style-icon__special-secondary___rbPs0_6-1-0","style-icon__contrast":"magritte-style-icon__contrast___qE6uq_6-1-0","styleIconContrast":"magritte-style-icon__contrast___qE6uq_6-1-0","style-icon__contrast-secondary":"magritte-style-icon__contrast-secondary___caCaw_6-1-0","styleIconContrastSecondary":"magritte-style-icon__contrast-secondary___caCaw_6-1-0"};
|
|
17
16
|
|
|
18
17
|
const FormLabel = (props) => {
|
|
19
18
|
const disabled = useDisabled();
|
|
@@ -56,7 +55,7 @@ const FormLabel = (props) => {
|
|
|
56
55
|
[styles[`style-text__${styleText}`]]: styleText,
|
|
57
56
|
}), "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: () => {
|
|
58
57
|
setShowBottomSheet(false);
|
|
59
|
-
}, header: jsx(NavigationBar, { title: children, right: jsx(
|
|
58
|
+
}, header: jsx(NavigationBar, { title: children, right: jsx(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 })] })] }))] }));
|
|
60
59
|
};
|
|
61
60
|
|
|
62
61
|
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 {
|
|
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) => {\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 {\n children,\n info,\n postfix,\n styleText = 'secondary',\n stylePostfix = 'tertiary',\n styleIcon = 'secondary',\n 'data-qa': dataQa = 'form-label',\n ...restProps\n } = 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, {\n [styles.formLabelDisabled]: disabled,\n [styles[`style-icon__${styleIcon}`]]: styleIcon,\n [styles[`style-postfix__${stylePostfix}`]]: stylePostfix,\n [styles[`style-text__${styleText}`]]: styleText,\n })}\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={<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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"}
|