@foxford/ui 2.24.0 → 2.25.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/components/Input/Input.js.map +1 -1
- package/components/Tooltip/Tooltip.js +1 -1
- package/components/Tooltip/Tooltip.js.map +1 -1
- package/components/Tooltip/TooltipWrapper.js +2 -0
- package/components/Tooltip/TooltipWrapper.js.map +1 -0
- package/components/Tooltip/default-constants.js +2 -0
- package/components/Tooltip/default-constants.js.map +1 -0
- package/components/TooltipComponent/TooltipComponent.js +2 -0
- package/components/TooltipComponent/TooltipComponent.js.map +1 -0
- package/components/TooltipComponent/constants.js +2 -0
- package/components/TooltipComponent/constants.js.map +1 -0
- package/components/TooltipComponent/images/close.module.svg.js +2 -0
- package/components/TooltipComponent/images/close.module.svg.js.map +1 -0
- package/components/TooltipComponent/style.js +2 -0
- package/components/TooltipComponent/style.js.map +1 -0
- package/dts/index.d.ts +124 -132
- package/hooks/useKeyboardListener.js +2 -0
- package/hooks/useKeyboardListener.js.map +1 -0
- package/index.cjs.js +1 -1
- package/index.cjs.js.map +1 -1
- package/package.json +1 -1
- package/components/Tooltip/tooltip-styles.js +0 -2
- package/components/Tooltip/tooltip-styles.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.js","sources":["../../../../src/components/Input/Input.tsx"],"sourcesContent":["import { forwardRef, useState, useImperativeHandle, useRef } from 'react'\nimport { useTheme } from 'styled-components'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { FormInputLabel, SIZES } from 'components/FormInputLabel'\nimport { Icon } from 'components/Icon'\nimport { InputPhone } from 'components/Input.Phone'\nimport { Spacer } from 'components/Spacer'\nimport Minus from './images/minus.module.svg'\nimport Plus from './images/plus.module.svg'\nimport * as Styled from './style'\nimport type { InputProps } from './types'\n\nconst COMPONENT_NAME = 'Input'\n\n/**\n *\n * Component accepts all \\<input\\> attributes and \"react-input-mask\" props.\n *\n * Responsive \"size\", \"margin\" props are supported.\n *\n * Exposed \"ref\" attached to \\<input\\>.\n *\n * See full [InputProps](https://github.com/foxford/ui/blob/master/src/components/Input/types.ts)\n */\nconst Input: React.ForwardRefExoticComponent<InputProps> & { Phone: typeof InputPhone } = Object.assign(\n withMergedProps<InputProps, HTMLInputElement>(\n forwardRef((props, forwardedRef) => {\n const theme = useTheme()\n\n const {\n size = 'm',\n mask = '',\n rounded = true,\n color = 'mineShaft',\n placeholderColor = 'silver',\n width = theme.defaultInputControlsWidth,\n type = 'text',\n labelPosition = 'dynamic',\n textProps = {},\n iconProps = {},\n controls = {},\n preset,\n className,\n style,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n sizeUnits,\n sizes,\n margin,\n marginXXS,\n marginXS,\n marginS,\n marginM,\n marginL,\n marginXL,\n marginTop,\n marginTopXXS,\n marginTopXS,\n marginTopS,\n marginTopM,\n marginTopL,\n marginTopXL,\n marginRight,\n marginRightXXS,\n marginRightXS,\n marginRightS,\n marginRightM,\n marginRightL,\n marginRightXL,\n marginBottom,\n marginBottomXXS,\n marginBottomXS,\n marginBottomS,\n marginBottomM,\n marginBottomL,\n marginBottomXL,\n marginLeft,\n marginLeftXXS,\n marginLeftXS,\n marginLeftS,\n marginLeftM,\n marginLeftL,\n marginLeftXL,\n marginUnits,\n palette,\n widthXXS,\n widthXS,\n widthS,\n widthM,\n widthL,\n widthXL,\n error,\n success,\n label,\n icon,\n text,\n primary,\n secondary,\n onColored,\n fluid,\n disabled,\n inline,\n inputRef,\n ...inputProps\n } = props\n\n const {\n icon: additionalControlIcon,\n iconProps: additionalControlIconProps = {},\n buttonProps: additionalControlButtonProps = {},\n } = controls.additional ?? {}\n\n const {\n icon: numberControlIcon,\n iconProps: numberControlIconProps = {},\n buttonProps: numberControlButtonProps = [],\n } = controls.number ?? {}\n\n const [minus, plus] = Array.isArray(numberControlIcon) ? numberControlIcon : [numberControlIcon]\n\n const minusButtonProps =\n (Array.isArray(numberControlButtonProps) ? numberControlButtonProps[0] : numberControlButtonProps) ?? {}\n\n const plusButtonProps = (Array.isArray(numberControlButtonProps) ? numberControlButtonProps[1] : {}) ?? {}\n\n const ref = useRef<HTMLInputElement | null>(null)\n useImperativeHandle<HTMLInputElement | null, HTMLInputElement | null>(forwardedRef, () => ref.current, [])\n\n const hasInitValue =\n typeof inputProps.value === 'string' ||\n typeof inputProps.value === 'number' ||\n typeof inputProps.defaultValue === 'string' ||\n typeof inputProps.defaultValue === 'number'\n\n const [active, setActive] = useState(hasInitValue)\n const [hasValue, setHasValue] = useState(hasInitValue)\n\n const [minusDisabled, setMinusDisabled] = useState(() => {\n if (type !== 'number' || inputProps.min === undefined) return false\n\n const { value = Infinity, defaultValue = Infinity } = inputProps\n\n const initValue = typeof value === 'number' ? value : parseFloat(value)\n const initDefaultValue = typeof defaultValue === 'number' ? defaultValue : parseFloat(defaultValue)\n const minValue = typeof inputProps.min === 'number' ? inputProps.min : parseFloat(inputProps.min)\n\n return Math.min(initValue, initDefaultValue) <= minValue\n })\n\n const [plusDisabled, setPlusDisabled] = useState(() => {\n if (type !== 'number' || inputProps.max === undefined) return false\n\n const { value = -Infinity, defaultValue = -Infinity } = inputProps\n\n const initValue = typeof value === 'number' ? value : parseFloat(value)\n const initDefaultValue = typeof defaultValue === 'number' ? defaultValue : parseFloat(defaultValue)\n const maxValue = typeof inputProps.max === 'number' ? inputProps.max : parseFloat(inputProps.max)\n\n return Math.max(initValue, initDefaultValue) >= maxValue\n })\n\n if (preset !== 'brand') {\n return (\n <Styled.Root\n {...inputProps}\n inputRef={\n inputRef ??\n ((input) => {\n ref.current = input\n })\n }\n className={className}\n style={style}\n size={typeof size === 'number' ? size : undefined}\n mask={mask}\n rounded={rounded}\n color={color}\n placeholderColor={placeholderColor}\n width={width}\n widthXXS={widthXXS}\n widthXS={widthXS}\n widthS={widthS}\n widthM={widthM}\n widthL={widthL}\n widthXL={widthXL}\n error={error}\n type={type}\n fluid={fluid}\n disabled={disabled}\n />\n )\n }\n\n return (\n <FormInputLabel\n className={className}\n style={style}\n size={size}\n sizeXXS={sizeXXS}\n sizeXS={sizeXS}\n sizeS={sizeS}\n sizeM={sizeM}\n sizeL={sizeL}\n sizeXL={sizeXL}\n sizeUnits={sizeUnits}\n sizes={sizes}\n margin={margin}\n marginXXS={marginXXS}\n marginXS={marginXS}\n marginS={marginS}\n marginM={marginM}\n marginL={marginL}\n marginXL={marginXL}\n marginTop={marginTop}\n marginTopXXS={marginTopXXS}\n marginTopXS={marginTopXS}\n marginTopS={marginTopS}\n marginTopM={marginTopM}\n marginTopL={marginTopL}\n marginTopXL={marginTopXL}\n marginRight={marginRight}\n marginRightXXS={marginRightXXS}\n marginRightXS={marginRightXS}\n marginRightS={marginRightS}\n marginRightM={marginRightM}\n marginRightL={marginRightL}\n marginRightXL={marginRightXL}\n marginBottom={marginBottom}\n marginBottomXXS={marginBottomXXS}\n marginBottomXS={marginBottomXS}\n marginBottomS={marginBottomS}\n marginBottomM={marginBottomM}\n marginBottomL={marginBottomL}\n marginBottomXL={marginBottomXL}\n marginLeft={marginLeft}\n marginLeftXXS={marginLeftXXS}\n marginLeftXS={marginLeftXS}\n marginLeftS={marginLeftS}\n marginLeftM={marginLeftM}\n marginLeftL={marginLeftL}\n marginLeftXL={marginLeftXL}\n marginUnits={marginUnits}\n palette={palette}\n error={error}\n success={success}\n label={label}\n labelPosition={labelPosition}\n icon={icon}\n text={text}\n primary={primary}\n secondary={secondary}\n onColored={onColored}\n disabled={disabled}\n inline={inline}\n active={active}\n textProps={textProps}\n iconProps={{\n size: 24,\n color: disabled ? 'content-disabled' : 'content-onmain-tertiary',\n ...iconProps,\n }}\n onClick={() => {\n if (ref.current) {\n ref.current.focus()\n }\n }}\n onFocus={(evt) => {\n if (evt.target !== evt.currentTarget) {\n setActive(true)\n }\n }}\n onBlur={(evt) => {\n if (evt.target !== evt.currentTarget && !hasValue) {\n setActive(false)\n }\n }}\n input={\n <Styled.Input\n {...inputProps}\n inputRef={(input) => {\n ref.current = input\n }}\n mask={mask}\n palette={palette}\n type={type}\n label={label}\n labelPosition={labelPosition}\n disabled={disabled}\n active={active}\n onChange={(evt) => {\n if (inputProps.onChange) {\n inputProps.onChange(evt)\n }\n\n if (type === 'number') {\n const currentValue = parseFloat(evt.currentTarget.value)\n\n const minValueReached = currentValue <= parseFloat(evt.currentTarget.min)\n const maxValueReached = currentValue >= parseFloat(evt.currentTarget.max)\n\n setMinusDisabled(minValueReached)\n setPlusDisabled(maxValueReached)\n\n if (minValueReached || maxValueReached) {\n evt.currentTarget.focus()\n }\n }\n }}\n onBlur={(evt) => {\n evt.stopPropagation()\n if (inputProps.onBlur) {\n inputProps.onBlur(evt)\n }\n\n setHasValue(Boolean(evt.currentTarget.value))\n setActive(Boolean(evt.currentTarget.value))\n }}\n />\n }\n controls={\n additionalControlIcon || type === 'number' ? (\n <>\n {additionalControlIcon && (\n <Styled.InputControl\n {...additionalControlButtonProps}\n type='button'\n palette={palette}\n disabled={disabled}\n onClick={(evt) => {\n evt.stopPropagation()\n if (additionalControlButtonProps.onClick) {\n additionalControlButtonProps.onClick(evt)\n }\n }}\n >\n <Icon\n icon={additionalControlIcon}\n as='span'\n size={24}\n color='inherit'\n {...additionalControlIconProps}\n />\n </Styled.InputControl>\n )}\n {type === 'number' && (\n <Spacer display='flex' marginLeft={4}>\n <Styled.InputControl\n {...minusButtonProps}\n type='button'\n palette={palette}\n disabled={disabled || minusDisabled}\n onClick={(evt) => {\n evt.stopPropagation()\n if (minusButtonProps.onClick) {\n minusButtonProps.onClick(evt)\n }\n\n try {\n if (ref.current) {\n const prev = ref.current.value\n ref.current.stepDown()\n\n const decremented = ref.current.value\n if (prev !== decremented) {\n const event = new Event('input', { bubbles: true })\n ref.current.dispatchEvent(event)\n }\n }\n } catch (err) {\n // eslint-disable-next-line no-console\n console.error(err)\n }\n }}\n >\n <Icon icon={minus ?? <Minus />} as='span' size={24} color='inherit' {...numberControlIconProps} />\n </Styled.InputControl>\n <Styled.InputControl\n {...plusButtonProps}\n type='button'\n palette={palette}\n disabled={disabled || plusDisabled}\n onClick={(evt) => {\n evt.stopPropagation()\n if (plusButtonProps.onClick) {\n plusButtonProps.onClick(evt)\n }\n\n try {\n if (ref.current) {\n const prev = ref.current.value\n ref.current.stepUp()\n\n const incremented = ref.current.value\n if (prev !== incremented) {\n const event = new Event('input', { bubbles: true })\n ref.current.dispatchEvent(event)\n }\n }\n } catch (err) {\n // eslint-disable-next-line no-console\n console.error(err)\n }\n }}\n >\n <Icon icon={plus ?? <Plus />} as='span' size={24} color='inherit' {...numberControlIconProps} />\n </Styled.InputControl>\n </Spacer>\n )}\n </>\n ) : undefined\n }\n />\n )\n }),\n {\n sizes: SIZES,\n displayName: COMPONENT_NAME,\n }\n ),\n {\n Phone: InputPhone,\n }\n)\n\nexport { Input, COMPONENT_NAME }\n"],"names":["COMPONENT_NAME","Input","Object","assign","withMergedProps","forwardRef","props","forwardedRef","_controls$additional","_controls$number","_ref","_ref2","theme","useTheme","size","mask","rounded","color","placeholderColor","width","defaultInputControlsWidth","type","labelPosition","textProps","iconProps","controls","preset","className","style","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","sizeUnits","sizes","margin","marginXXS","marginXS","marginS","marginM","marginL","marginXL","marginTop","marginTopXXS","marginTopXS","marginTopS","marginTopM","marginTopL","marginTopXL","marginRight","marginRightXXS","marginRightXS","marginRightS","marginRightM","marginRightL","marginRightXL","marginBottom","marginBottomXXS","marginBottomXS","marginBottomS","marginBottomM","marginBottomL","marginBottomXL","marginLeft","marginLeftXXS","marginLeftXS","marginLeftS","marginLeftM","marginLeftL","marginLeftXL","marginUnits","palette","widthXXS","widthXS","widthS","widthM","widthL","widthXL","error","success","label","icon","text","primary","secondary","onColored","fluid","disabled","inline","inputRef","inputProps","_excluded","additionalControlIcon","additionalControlIconProps","buttonProps","additionalControlButtonProps","additional","numberControlIcon","numberControlIconProps","numberControlButtonProps","number","minus","plus","Array","isArray","minusButtonProps","plusButtonProps","ref","useRef","useImperativeHandle","current","hasInitValue","value","defaultValue","active","setActive","useState","hasValue","setHasValue","minusDisabled","setMinusDisabled","undefined","min","Infinity","initValue","parseFloat","initDefaultValue","minValue","Math","plusDisabled","setPlusDisabled","max","maxValue","_jsx","Styled.Root","input","FormInputLabel","_objectSpread","onClick","focus","onFocus","evt","target","currentTarget","onBlur","Styled.Input","onChange","currentValue","minValueReached","maxValueReached","stopPropagation","Boolean","_jsxs","_Fragment","children","Styled.InputControl","Icon","as","Spacer","display","prev","stepDown","event","Event","bubbles","dispatchEvent","err","console","Minus","stepUp","Plus","SIZES","displayName","Phone","InputPhone"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Input.js","sources":["../../../../src/components/Input/Input.tsx"],"sourcesContent":["import { forwardRef, useState, useImperativeHandle, useRef } from 'react'\nimport { useTheme } from 'styled-components'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { FormInputLabel, SIZES } from 'components/FormInputLabel'\nimport { Icon } from 'components/Icon'\nimport { InputPhone } from 'components/Input.Phone'\nimport { Spacer } from 'components/Spacer'\nimport Minus from './images/minus.module.svg'\nimport Plus from './images/plus.module.svg'\nimport * as Styled from './style'\nimport type { InputProps } from './types'\n\nconst COMPONENT_NAME = 'Input'\n\n/**\n *\n * Component accepts all \\<input\\> attributes and \"react-input-mask\" v2.0.4 props.\n *\n * Responsive \"size\", \"margin\" props are supported.\n *\n * Exposed \"ref\" attached to \\<input\\>.\n *\n * See full [InputProps](https://github.com/foxford/ui/blob/master/src/components/Input/types.ts)\n */\nconst Input: React.ForwardRefExoticComponent<InputProps> & { Phone: typeof InputPhone } = Object.assign(\n withMergedProps<InputProps, HTMLInputElement>(\n forwardRef((props, forwardedRef) => {\n const theme = useTheme()\n\n const {\n size = 'm',\n mask = '',\n rounded = true,\n color = 'mineShaft',\n placeholderColor = 'silver',\n width = theme.defaultInputControlsWidth,\n type = 'text',\n labelPosition = 'dynamic',\n textProps = {},\n iconProps = {},\n controls = {},\n preset,\n className,\n style,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n sizeUnits,\n sizes,\n margin,\n marginXXS,\n marginXS,\n marginS,\n marginM,\n marginL,\n marginXL,\n marginTop,\n marginTopXXS,\n marginTopXS,\n marginTopS,\n marginTopM,\n marginTopL,\n marginTopXL,\n marginRight,\n marginRightXXS,\n marginRightXS,\n marginRightS,\n marginRightM,\n marginRightL,\n marginRightXL,\n marginBottom,\n marginBottomXXS,\n marginBottomXS,\n marginBottomS,\n marginBottomM,\n marginBottomL,\n marginBottomXL,\n marginLeft,\n marginLeftXXS,\n marginLeftXS,\n marginLeftS,\n marginLeftM,\n marginLeftL,\n marginLeftXL,\n marginUnits,\n palette,\n widthXXS,\n widthXS,\n widthS,\n widthM,\n widthL,\n widthXL,\n error,\n success,\n label,\n icon,\n text,\n primary,\n secondary,\n onColored,\n fluid,\n disabled,\n inline,\n inputRef,\n ...inputProps\n } = props\n\n const {\n icon: additionalControlIcon,\n iconProps: additionalControlIconProps = {},\n buttonProps: additionalControlButtonProps = {},\n } = controls.additional ?? {}\n\n const {\n icon: numberControlIcon,\n iconProps: numberControlIconProps = {},\n buttonProps: numberControlButtonProps = [],\n } = controls.number ?? {}\n\n const [minus, plus] = Array.isArray(numberControlIcon) ? numberControlIcon : [numberControlIcon]\n\n const minusButtonProps =\n (Array.isArray(numberControlButtonProps) ? numberControlButtonProps[0] : numberControlButtonProps) ?? {}\n\n const plusButtonProps = (Array.isArray(numberControlButtonProps) ? numberControlButtonProps[1] : {}) ?? {}\n\n const ref = useRef<HTMLInputElement | null>(null)\n useImperativeHandle<HTMLInputElement | null, HTMLInputElement | null>(forwardedRef, () => ref.current, [])\n\n const hasInitValue =\n typeof inputProps.value === 'string' ||\n typeof inputProps.value === 'number' ||\n typeof inputProps.defaultValue === 'string' ||\n typeof inputProps.defaultValue === 'number'\n\n const [active, setActive] = useState(hasInitValue)\n const [hasValue, setHasValue] = useState(hasInitValue)\n\n const [minusDisabled, setMinusDisabled] = useState(() => {\n if (type !== 'number' || inputProps.min === undefined) return false\n\n const { value = Infinity, defaultValue = Infinity } = inputProps\n\n const initValue = typeof value === 'number' ? value : parseFloat(value)\n const initDefaultValue = typeof defaultValue === 'number' ? defaultValue : parseFloat(defaultValue)\n const minValue = typeof inputProps.min === 'number' ? inputProps.min : parseFloat(inputProps.min)\n\n return Math.min(initValue, initDefaultValue) <= minValue\n })\n\n const [plusDisabled, setPlusDisabled] = useState(() => {\n if (type !== 'number' || inputProps.max === undefined) return false\n\n const { value = -Infinity, defaultValue = -Infinity } = inputProps\n\n const initValue = typeof value === 'number' ? value : parseFloat(value)\n const initDefaultValue = typeof defaultValue === 'number' ? defaultValue : parseFloat(defaultValue)\n const maxValue = typeof inputProps.max === 'number' ? inputProps.max : parseFloat(inputProps.max)\n\n return Math.max(initValue, initDefaultValue) >= maxValue\n })\n\n if (preset !== 'brand') {\n return (\n <Styled.Root\n {...inputProps}\n inputRef={\n inputRef ??\n ((input) => {\n ref.current = input\n })\n }\n className={className}\n style={style}\n size={typeof size === 'number' ? size : undefined}\n mask={mask}\n rounded={rounded}\n color={color}\n placeholderColor={placeholderColor}\n width={width}\n widthXXS={widthXXS}\n widthXS={widthXS}\n widthS={widthS}\n widthM={widthM}\n widthL={widthL}\n widthXL={widthXL}\n error={error}\n type={type}\n fluid={fluid}\n disabled={disabled}\n />\n )\n }\n\n return (\n <FormInputLabel\n className={className}\n style={style}\n size={size}\n sizeXXS={sizeXXS}\n sizeXS={sizeXS}\n sizeS={sizeS}\n sizeM={sizeM}\n sizeL={sizeL}\n sizeXL={sizeXL}\n sizeUnits={sizeUnits}\n sizes={sizes}\n margin={margin}\n marginXXS={marginXXS}\n marginXS={marginXS}\n marginS={marginS}\n marginM={marginM}\n marginL={marginL}\n marginXL={marginXL}\n marginTop={marginTop}\n marginTopXXS={marginTopXXS}\n marginTopXS={marginTopXS}\n marginTopS={marginTopS}\n marginTopM={marginTopM}\n marginTopL={marginTopL}\n marginTopXL={marginTopXL}\n marginRight={marginRight}\n marginRightXXS={marginRightXXS}\n marginRightXS={marginRightXS}\n marginRightS={marginRightS}\n marginRightM={marginRightM}\n marginRightL={marginRightL}\n marginRightXL={marginRightXL}\n marginBottom={marginBottom}\n marginBottomXXS={marginBottomXXS}\n marginBottomXS={marginBottomXS}\n marginBottomS={marginBottomS}\n marginBottomM={marginBottomM}\n marginBottomL={marginBottomL}\n marginBottomXL={marginBottomXL}\n marginLeft={marginLeft}\n marginLeftXXS={marginLeftXXS}\n marginLeftXS={marginLeftXS}\n marginLeftS={marginLeftS}\n marginLeftM={marginLeftM}\n marginLeftL={marginLeftL}\n marginLeftXL={marginLeftXL}\n marginUnits={marginUnits}\n palette={palette}\n error={error}\n success={success}\n label={label}\n labelPosition={labelPosition}\n icon={icon}\n text={text}\n primary={primary}\n secondary={secondary}\n onColored={onColored}\n disabled={disabled}\n inline={inline}\n active={active}\n textProps={textProps}\n iconProps={{\n size: 24,\n color: disabled ? 'content-disabled' : 'content-onmain-tertiary',\n ...iconProps,\n }}\n onClick={() => {\n if (ref.current) {\n ref.current.focus()\n }\n }}\n onFocus={(evt) => {\n if (evt.target !== evt.currentTarget) {\n setActive(true)\n }\n }}\n onBlur={(evt) => {\n if (evt.target !== evt.currentTarget && !hasValue) {\n setActive(false)\n }\n }}\n input={\n <Styled.Input\n {...inputProps}\n inputRef={(input) => {\n ref.current = input\n }}\n mask={mask}\n palette={palette}\n type={type}\n label={label}\n labelPosition={labelPosition}\n disabled={disabled}\n active={active}\n onChange={(evt) => {\n if (inputProps.onChange) {\n inputProps.onChange(evt)\n }\n\n if (type === 'number') {\n const currentValue = parseFloat(evt.currentTarget.value)\n\n const minValueReached = currentValue <= parseFloat(evt.currentTarget.min)\n const maxValueReached = currentValue >= parseFloat(evt.currentTarget.max)\n\n setMinusDisabled(minValueReached)\n setPlusDisabled(maxValueReached)\n\n if (minValueReached || maxValueReached) {\n evt.currentTarget.focus()\n }\n }\n }}\n onBlur={(evt) => {\n evt.stopPropagation()\n if (inputProps.onBlur) {\n inputProps.onBlur(evt)\n }\n\n setHasValue(Boolean(evt.currentTarget.value))\n setActive(Boolean(evt.currentTarget.value))\n }}\n />\n }\n controls={\n additionalControlIcon || type === 'number' ? (\n <>\n {additionalControlIcon && (\n <Styled.InputControl\n {...additionalControlButtonProps}\n type='button'\n palette={palette}\n disabled={disabled}\n onClick={(evt) => {\n evt.stopPropagation()\n if (additionalControlButtonProps.onClick) {\n additionalControlButtonProps.onClick(evt)\n }\n }}\n >\n <Icon\n icon={additionalControlIcon}\n as='span'\n size={24}\n color='inherit'\n {...additionalControlIconProps}\n />\n </Styled.InputControl>\n )}\n {type === 'number' && (\n <Spacer display='flex' marginLeft={4}>\n <Styled.InputControl\n {...minusButtonProps}\n type='button'\n palette={palette}\n disabled={disabled || minusDisabled}\n onClick={(evt) => {\n evt.stopPropagation()\n if (minusButtonProps.onClick) {\n minusButtonProps.onClick(evt)\n }\n\n try {\n if (ref.current) {\n const prev = ref.current.value\n ref.current.stepDown()\n\n const decremented = ref.current.value\n if (prev !== decremented) {\n const event = new Event('input', { bubbles: true })\n ref.current.dispatchEvent(event)\n }\n }\n } catch (err) {\n // eslint-disable-next-line no-console\n console.error(err)\n }\n }}\n >\n <Icon icon={minus ?? <Minus />} as='span' size={24} color='inherit' {...numberControlIconProps} />\n </Styled.InputControl>\n <Styled.InputControl\n {...plusButtonProps}\n type='button'\n palette={palette}\n disabled={disabled || plusDisabled}\n onClick={(evt) => {\n evt.stopPropagation()\n if (plusButtonProps.onClick) {\n plusButtonProps.onClick(evt)\n }\n\n try {\n if (ref.current) {\n const prev = ref.current.value\n ref.current.stepUp()\n\n const incremented = ref.current.value\n if (prev !== incremented) {\n const event = new Event('input', { bubbles: true })\n ref.current.dispatchEvent(event)\n }\n }\n } catch (err) {\n // eslint-disable-next-line no-console\n console.error(err)\n }\n }}\n >\n <Icon icon={plus ?? <Plus />} as='span' size={24} color='inherit' {...numberControlIconProps} />\n </Styled.InputControl>\n </Spacer>\n )}\n </>\n ) : undefined\n }\n />\n )\n }),\n {\n sizes: SIZES,\n displayName: COMPONENT_NAME,\n }\n ),\n {\n Phone: InputPhone,\n }\n)\n\nexport { Input, COMPONENT_NAME }\n"],"names":["COMPONENT_NAME","Input","Object","assign","withMergedProps","forwardRef","props","forwardedRef","_controls$additional","_controls$number","_ref","_ref2","theme","useTheme","size","mask","rounded","color","placeholderColor","width","defaultInputControlsWidth","type","labelPosition","textProps","iconProps","controls","preset","className","style","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","sizeUnits","sizes","margin","marginXXS","marginXS","marginS","marginM","marginL","marginXL","marginTop","marginTopXXS","marginTopXS","marginTopS","marginTopM","marginTopL","marginTopXL","marginRight","marginRightXXS","marginRightXS","marginRightS","marginRightM","marginRightL","marginRightXL","marginBottom","marginBottomXXS","marginBottomXS","marginBottomS","marginBottomM","marginBottomL","marginBottomXL","marginLeft","marginLeftXXS","marginLeftXS","marginLeftS","marginLeftM","marginLeftL","marginLeftXL","marginUnits","palette","widthXXS","widthXS","widthS","widthM","widthL","widthXL","error","success","label","icon","text","primary","secondary","onColored","fluid","disabled","inline","inputRef","inputProps","_excluded","additionalControlIcon","additionalControlIconProps","buttonProps","additionalControlButtonProps","additional","numberControlIcon","numberControlIconProps","numberControlButtonProps","number","minus","plus","Array","isArray","minusButtonProps","plusButtonProps","ref","useRef","useImperativeHandle","current","hasInitValue","value","defaultValue","active","setActive","useState","hasValue","setHasValue","minusDisabled","setMinusDisabled","undefined","min","Infinity","initValue","parseFloat","initDefaultValue","minValue","Math","plusDisabled","setPlusDisabled","max","maxValue","_jsx","Styled.Root","input","FormInputLabel","_objectSpread","onClick","focus","onFocus","evt","target","currentTarget","onBlur","Styled.Input","onChange","currentValue","minValueReached","maxValueReached","stopPropagation","Boolean","_jsxs","_Fragment","children","Styled.InputControl","Icon","as","Spacer","display","prev","stepDown","event","Event","bubbles","dispatchEvent","err","console","Minus","stepUp","Plus","SIZES","displayName","Phone","InputPhone"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import
|
|
1
|
+
import o from'@babel/runtime/helpers/objectSpread2';import e from'@babel/runtime/helpers/objectWithoutProperties';import{forwardRef as t}from'react';import{useTheme as r}from'styled-components';import s from'react-floater';import{mergeDeepLeft as i}from'ramda';import{withMergedProps as n}from'../../hocs/withMergedProps.js';import{TooltipComponent as a}from'../TooltipComponent/TooltipComponent.js';import{TooltipWrapper as l}from'./TooltipWrapper.js';import{TOOLTIP_STYLES_DEFAULT as p}from'./default-constants.js';import{jsx as m}from'react/jsx-runtime';import{SIZES as c}from'../TooltipComponent/constants.js';var z=["preset","size","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","sizeUnits","sizes","palette","black","contrast","titleProps","contentProps","closeButtonProps"];var d='Tooltip';var f=Object.assign(n(t(((t,n)=>{var a,c;var{preset:d,size:f="s",sizeXXS:b,sizeXS:u,sizeS:h,sizeM:v,sizeL:T,sizeXL:P,sizeUnits:S,sizes:g,palette:X,black:C,contrast:j,titleProps:L,contentProps:y,closeButtonProps:w}=t,M=e(t,z);var k=r();if('brand'!==d){var B;var E=o(o({},M),{},{styles:i(null!==(B=M.styles)&&void 0!==B?B:{},p)});return m(s,o(o({},E),{},{children:m("span",{children:E.children})}))}var O=k.colors['bg-onmain-primary'];C&&(O=k.colors['bg-onmain-inverse']),j&&(O=k.colors['bg-brand-primary-basic']),null!=X&&X.backgroundColor&&(O=null!==(a=k.colors[X.backgroundColor])&&void 0!==a?a:X.backgroundColor);var x=o(o({},M),{},{styles:i(null!==(c=M.styles)&&void 0!==c?c:{},{arrow:{color:O,spread:16,length:8},floater:{filter:"drop-shadow(0 0 3px ".concat(k.colors['bg-oncolor-hover'],")")}}),component:m(l,{ref:n,size:f,sizeXXS:b,sizeXS:u,sizeS:h,sizeM:v,sizeL:T,sizeXL:P,sizeUnits:S,sizes:g,palette:X,black:C,contrast:j,title:M.title,titleProps:L,content:M.content,contentProps:y,footer:M.footer,showCloseButton:M.showCloseButton,closeButtonProps:w,component:M.component})});return m(s,o(o({},x),{},{modifiers:{flip:{enabled:!x.disableFlip}}}))})),{displayName:"Tooltip",sizes:c}),{Component:a});export{d as COMPONENT_NAME,f as Tooltip};
|
|
2
2
|
//# sourceMappingURL=Tooltip.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tooltip.js","sources":["../../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import Floater from 'react-floater'\nimport type { Props } from 'react-floater/lib/types'\nimport {
|
|
1
|
+
{"version":3,"file":"Tooltip.js","sources":["../../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { useTheme } from 'styled-components'\nimport Floater from 'react-floater'\nimport { mergeDeepLeft } from 'ramda'\nimport type { Props as FloaterProps } from 'react-floater/lib/types'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { SIZES, TooltipComponent } from 'components/TooltipComponent'\nimport { TooltipWrapper } from './TooltipWrapper'\nimport { TOOLTIP_STYLES_DEFAULT } from './default-constants'\nimport type { TooltipProps } from './types'\n\nconst COMPONENT_NAME = 'Tooltip'\n\n/**\n *\n * Component accepts [\"react-floater\"](https://www.npmjs.com/package/react-floater/v/0.8.2) v0.8.2 props.\n *\n * Responsive \"size\" props are supported.\n *\n * Exposed \"ref\" attached to tooltip component root.\n *\n * See full [TooltipProps](https://github.com/foxford/ui/blob/master/src/components/Tooltip/types.ts)\n */\nconst Tooltip: React.ForwardRefExoticComponent<TooltipProps> & { Component: typeof TooltipComponent } = Object.assign(\n withMergedProps<TooltipProps, HTMLDivElement>(\n forwardRef((props, ref) => {\n const {\n preset,\n size = 's',\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n sizeUnits,\n sizes,\n palette,\n black,\n contrast,\n titleProps,\n contentProps,\n closeButtonProps,\n ...restProps\n } = props\n\n const theme = useTheme()\n\n if (preset !== 'brand') {\n const tooltipProps = {\n ...restProps,\n styles: mergeDeepLeft(restProps.styles ?? {}, TOOLTIP_STYLES_DEFAULT),\n } as FloaterProps\n\n return (\n <Floater {...tooltipProps}>\n <span>{tooltipProps.children}</span>\n </Floater>\n )\n }\n\n let color = theme.colors['bg-onmain-primary']\n\n if (black) color = theme.colors['bg-onmain-inverse']\n if (contrast) color = theme.colors['bg-brand-primary-basic']\n if (palette?.backgroundColor) color = theme.colors[palette.backgroundColor] ?? palette.backgroundColor\n\n const tooltipProps = {\n ...restProps,\n styles: mergeDeepLeft(restProps.styles ?? {}, {\n arrow: {\n color,\n spread: 16,\n length: 8,\n },\n floater: {\n filter: `drop-shadow(0 0 3px ${theme.colors['bg-oncolor-hover']})`,\n },\n }),\n component: (\n <TooltipWrapper\n ref={ref}\n size={size}\n sizeXXS={sizeXXS}\n sizeXS={sizeXS}\n sizeS={sizeS}\n sizeM={sizeM}\n sizeL={sizeL}\n sizeXL={sizeXL}\n sizeUnits={sizeUnits}\n sizes={sizes}\n palette={palette}\n black={black}\n contrast={contrast}\n title={restProps.title}\n titleProps={titleProps}\n content={restProps.content}\n contentProps={contentProps}\n footer={restProps.footer}\n showCloseButton={restProps.showCloseButton}\n closeButtonProps={closeButtonProps}\n component={restProps.component}\n />\n ),\n } as FloaterProps\n\n return (\n <Floater\n {...tooltipProps}\n modifiers={{\n flip: {\n enabled: !tooltipProps.disableFlip,\n },\n }}\n />\n )\n }),\n {\n displayName: COMPONENT_NAME,\n sizes: SIZES,\n }\n ),\n {\n Component: TooltipComponent,\n }\n)\n\nexport { Tooltip }\n\nexport { COMPONENT_NAME }\n"],"names":["COMPONENT_NAME","Tooltip","Object","assign","withMergedProps","forwardRef","props","ref","_theme$colors$palette","_restProps$styles2","preset","size","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","sizeUnits","sizes","palette","black","contrast","titleProps","contentProps","closeButtonProps","restProps","_excluded","theme","useTheme","_restProps$styles","tooltipProps","styles","mergeDeepLeft","TOOLTIP_STYLES_DEFAULT","_jsx","Floater","_objectSpread","children","color","colors","backgroundColor","arrow","spread","length","floater","filter","component","TooltipWrapper","title","content","footer","showCloseButton","modifiers","flip","enabled","disableFlip","displayName","SIZES","Component","TooltipComponent"],"mappings":"kxBAWMA,IAAAA,EAAiB,UAYvB,IAAMC,EAAkGC,OAAOC,OAC7GC,EACEC,GAAAA,CAAYC,EAAOC,KAAQ,IAAAC,EAAAC,EACzB,IAAMC,OACJA,EADIC,KAEJA,EAAO,IAFHC,QAGJA,EAHIC,OAIJA,EAJIC,MAKJA,EALIC,MAMJA,EANIC,MAOJA,EAPIC,OAQJA,EARIC,UASJA,EATIC,MAUJA,EAVIC,QAWJA,EAXIC,MAYJA,EAZIC,SAaJA,EAbIC,WAcJA,EAdIC,aAeJA,EAfIC,iBAgBJA,GAEEnB,EADCoB,IACDpB,EAlBJqB,GAoBA,IAAMC,EAAQC,IAEd,GAAe,UAAXnB,EAAoB,CAAA,IAAAoB,EACtB,IAAMC,SACDL,GADa,GAAA,CAEhBM,OAAQC,EAAa,QAACP,EAAAA,EAAUM,cAAX,IAAAF,EAAAA,EAAqB,GAAII,KAGhD,OACEC,EAACC,EAADC,EAAAA,EAAA,GAAaN,GAAb,GAAA,CAAAO,SACEH,EAAA,OAAA,CAAAG,SAAOP,EAAaO,cAK1B,IAAIC,EAAQX,EAAMY,OAAO,qBAErBnB,IAAOkB,EAAQX,EAAMY,OAAO,sBAC5BlB,IAAUiB,EAAQX,EAAMY,OAAO,2BAC/BpB,MAAAA,GAAAA,EAASqB,kBAAiBF,EAAK,QAAA/B,EAAGoB,EAAMY,OAAOpB,EAAQqB,wBAAxB,IAAAjC,EAAAA,EAA4CY,EAAQqB,iBAEvF,IAAMV,SACDL,GADa,GAAA,CAEhBM,OAAQC,EAAa,QAACP,EAAAA,EAAUM,cAAAA,IAAXvB,EAAAA,EAAqB,GAAI,CAC5CiC,MAAO,CACLH,MAAAA,EACAI,OAAQ,GACRC,OAAQ,GAEVC,QAAS,CACPC,qCAA+BlB,EAAMY,OAAO,oBAAtC,QAGVO,UACEZ,EAACa,EAAD,CACEzC,IAAKA,EACLI,KAAMA,EACNC,QAASA,EACTC,OAAQA,EACRC,MAAOA,EACPC,MAAOA,EACPC,MAAOA,EACPC,OAAQA,EACRC,UAAWA,EACXC,MAAOA,EACPC,QAASA,EACTC,MAAOA,EACPC,SAAUA,EACV2B,MAAOvB,EAAUuB,MACjB1B,WAAYA,EACZ2B,QAASxB,EAAUwB,QACnB1B,aAAcA,EACd2B,OAAQzB,EAAUyB,OAClBC,gBAAiB1B,EAAU0B,gBAC3B3B,iBAAkBA,EAClBsB,UAAWrB,EAAUqB,cAK3B,OACEZ,EAACC,EAADC,EAAAA,EAAA,GACMN,GADN,GAAA,CAEEsB,UAAW,CACTC,KAAM,CACJC,SAAUxB,EAAayB,oBAMjC,CACEC,YA3GiB,UA4GjBtC,MAAOuC,IAGX,CACEC,UAAWC"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import e from'@babel/runtime/helpers/objectSpread2';import o from'@babel/runtime/helpers/objectWithoutProperties';import{forwardRef as s,isValidElement as r,cloneElement as t}from'react';import{useKeyboardListener as i}from'../../hooks/useKeyboardListener.js';import{TooltipComponent as n}from'../TooltipComponent/TooltipComponent.js';import{jsx as p}from'react/jsx-runtime';var a=["size","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","black","contrast","showCloseButton","closeButtonProps","id","role","closeFn","component"];var l=()=>{};var c=['Escape','Esc'];var m=s(((s,m)=>{var{size:z,sizeXXS:u,sizeXS:f,sizeS:b,sizeM:X,sizeL:S,sizeXL:d,black:L,contrast:h,showCloseButton:j,closeButtonProps:v,id:B,role:C,closeFn:k=l,component:y}=s,w=o(s,a);i('keyup',c,k);var E={size:z,sizeXXS:u,sizeXS:f,sizeS:b,sizeM:X,sizeL:S,sizeXL:d,black:L,contrast:h,showCloseButton:j,closeButtonProps:v,id:B,role:C,closeFn:k};if(r(y)){var P='object'==typeof y.props&&null!==y.props?y.props:{};return t(y,e(e({ref:m},E),P))}return'function'==typeof y?y(E):p(n,e(e({ref:m},E),w))}));export{m as TooltipWrapper};
|
|
2
|
+
//# sourceMappingURL=TooltipWrapper.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TooltipWrapper.js","sources":["../../../../src/components/Tooltip/TooltipWrapper.tsx"],"sourcesContent":["import { forwardRef, isValidElement, cloneElement } from 'react'\nimport { useKeyboardListener } from 'hooks/useKeyboardListener'\nimport { TooltipComponent } from 'components/TooltipComponent'\nimport type { TooltipWrapperProps } from './types'\n\nconst closeFnNoop = () => undefined\n\nconst ESC_KEYS = ['Escape', 'Esc']\n\nconst TooltipWrapper = forwardRef<HTMLDivElement, TooltipWrapperProps>((props, ref) => {\n const {\n size,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n black,\n contrast,\n showCloseButton,\n closeButtonProps,\n id,\n role,\n closeFn = closeFnNoop,\n component,\n ...restProps\n } = props\n\n useKeyboardListener('keyup', ESC_KEYS, closeFn)\n\n const injectionProps = {\n size,\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n black,\n contrast,\n showCloseButton,\n closeButtonProps,\n id,\n role,\n closeFn,\n }\n\n if (isValidElement(component)) {\n const elementProps = typeof component.props === 'object' && component.props !== null ? component.props : {}\n\n return cloneElement(component, { ref, ...injectionProps, ...elementProps })\n }\n\n if (typeof component === 'function') {\n return component(injectionProps)\n }\n\n return <TooltipComponent ref={ref} {...injectionProps} {...restProps} />\n})\n\nexport { TooltipWrapper }\n"],"names":["closeFnNoop","ESC_KEYS","TooltipWrapper","forwardRef","props","ref","size","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","black","contrast","showCloseButton","closeButtonProps","id","role","closeFn","component","restProps","_excluded","useKeyboardListener","injectionProps","isValidElement","elementProps","cloneElement","_objectSpread","_jsx","TooltipComponent"],"mappings":"ohBAKA,IAAMA,EAAc,OAEpB,IAAMC,EAAW,CAAC,SAAU,OAEtBC,IAAAA,EAAiBC,GAAAA,CAAiDC,EAAOC,KAC7E,IAAMC,KACJA,EADIC,QAEJA,EAFIC,OAGJA,EAHIC,MAIJA,EAJIC,MAKJA,EALIC,MAMJA,EANIC,OAOJA,EAPIC,MAQJA,EARIC,SASJA,EATIC,gBAUJA,EAVIC,iBAWJA,EAXIC,GAYJA,EAZIC,KAaJA,EAbIC,QAcJA,EAAUnB,EAdNoB,UAeJA,GAEEhB,EADCiB,IACDjB,EAjBJkB,GAmBAC,EAAoB,QAAStB,EAAUkB,GAEvC,IAAMK,EAAiB,CACrBlB,KAAAA,EACAC,QAAAA,EACAC,OAAAA,EACAC,MAAAA,EACAC,MAAAA,EACAC,MAAAA,EACAC,OAAAA,EACAC,MAAAA,EACAC,SAAAA,EACAC,gBAAAA,EACAC,iBAAAA,EACAC,GAAAA,EACAC,KAAAA,EACAC,QAAAA,GAGF,GAAIM,EAAeL,GAAY,CAC7B,IAAMM,EAA0C,iBAApBN,EAAUhB,OAA0C,OAApBgB,EAAUhB,MAAiBgB,EAAUhB,MAAQ,GAEzG,OAAOuB,EAAaP,EAADQ,EAAAA,EAAA,CAAcvB,IAAAA,GAAQmB,GAAmBE,IAG9D,MAAyB,mBAAdN,EACFA,EAAUI,GAGZK,EAACC,EAADF,EAAAA,EAAA,CAAkBvB,IAAKA,GAASmB,GAAoBH"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
var i={wrapper:{display:'inline-flex',flexDirection:'column',zIndex:100},wrapperPosition:{left:-1e3,position:'absolute',top:-1e3,visibility:'hidden'},floater:{display:'inline-block',filter:'drop-shadow(0 6px 6px rgba(0, 0, 0, 0.2))',WebkitFilter:'drop-shadow(0 6px 6px rgba(0, 0, 0, 0.2))',maxWidth:300,opacity:0,position:'relative',transition:'opacity 0.2s',visibility:'hidden',zIndex:100},floaterOpening:{opacity:1,visibility:'visible'},floaterWithAnimation:{opacity:1,transition:'opacity 0.2s, transform 0.2s',visibility:'visible'},floaterClosing:{opacity:0,visibility:'visible'},floaterCentered:{left:'50%',position:'fixed',top:'50%',transform:'translate(-50%, -50%)'},container:{boxSizing:'border-box',borderRadius:3,backgroundColor:'#fff',color:'var(--mineShaft)',minHeight:32,minWidth:180,padding:'16px',position:'relative',display:'flex',flexDirection:'column',justifyContent:'center'},title:{borderBottom:'1px solid var(--mineShaft)',color:'var(--mineShaft)',fontWeight:'bold',fontSize:18,marginBottom:5,paddingBottom:6,paddingRight:18},content:{fontSize:12,lineHeight:'16px'},close:{backgroundColor:'transparent',border:0,borderRadius:0,color:'var(--mineShaft)',fontSize:14,height:10,lineHeight:'16px',outline:'none',padding:0,position:'absolute',right:'4px',textAlign:'center',top:'4px',WebkitAppearance:'none',width:10},footer:{borderTop:'1px solid var(--mineShaft)',fontSize:13,marginTop:10,paddingTop:5},arrow:{color:'#fff',display:'inline-flex',length:6,position:'absolute',spread:12},options:{zIndex:100}};export{i as TOOLTIP_STYLES_DEFAULT};
|
|
2
|
+
//# sourceMappingURL=default-constants.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"default-constants.js","sources":["../../../../src/components/Tooltip/default-constants.ts"],"sourcesContent":["import type { Styles } from 'react-floater/lib/types'\n\nexport const TOOLTIP_STYLES_DEFAULT: Partial<Styles> = {\n wrapper: {\n display: 'inline-flex',\n flexDirection: 'column',\n zIndex: 100,\n },\n wrapperPosition: {\n left: -1000,\n position: 'absolute',\n top: -1000,\n visibility: 'hidden',\n },\n floater: {\n display: 'inline-block',\n filter: 'drop-shadow(0 6px 6px rgba(0, 0, 0, 0.2))',\n WebkitFilter: 'drop-shadow(0 6px 6px rgba(0, 0, 0, 0.2))',\n maxWidth: 300,\n opacity: 0,\n position: 'relative',\n transition: 'opacity 0.2s',\n visibility: 'hidden',\n zIndex: 100,\n },\n floaterOpening: {\n opacity: 1,\n visibility: 'visible',\n },\n floaterWithAnimation: {\n opacity: 1,\n transition: 'opacity 0.2s, transform 0.2s',\n visibility: 'visible',\n },\n floaterClosing: {\n opacity: 0,\n visibility: 'visible',\n },\n floaterCentered: {\n left: '50%',\n position: 'fixed',\n top: '50%',\n transform: 'translate(-50%, -50%)',\n },\n container: {\n boxSizing: 'border-box',\n borderRadius: 3,\n backgroundColor: '#fff',\n color: 'var(--mineShaft)',\n minHeight: 32,\n minWidth: 180,\n padding: '16px',\n position: 'relative',\n display: 'flex',\n flexDirection: 'column',\n justifyContent: 'center',\n },\n title: {\n borderBottom: '1px solid var(--mineShaft)',\n color: 'var(--mineShaft)',\n fontWeight: 'bold',\n fontSize: 18,\n marginBottom: 5,\n paddingBottom: 6,\n paddingRight: 18,\n },\n content: {\n fontSize: 12,\n lineHeight: '16px',\n },\n close: {\n backgroundColor: 'transparent',\n border: 0,\n borderRadius: 0,\n color: 'var(--mineShaft)',\n fontSize: 14,\n height: 10,\n lineHeight: '16px',\n outline: 'none',\n padding: 0,\n position: 'absolute',\n right: '4px',\n textAlign: 'center',\n top: '4px',\n WebkitAppearance: 'none',\n width: 10,\n },\n footer: {\n borderTop: '1px solid var(--mineShaft)',\n fontSize: 13,\n marginTop: 10,\n paddingTop: 5,\n },\n arrow: {\n color: '#fff',\n display: 'inline-flex',\n length: 6,\n position: 'absolute',\n spread: 12,\n },\n options: {\n zIndex: 100,\n },\n}\n"],"names":["TOOLTIP_STYLES_DEFAULT","wrapper","display","flexDirection","zIndex","wrapperPosition","left","position","top","visibility","floater","filter","WebkitFilter","maxWidth","opacity","transition","floaterOpening","floaterWithAnimation","floaterClosing","floaterCentered","transform","container","boxSizing","borderRadius","backgroundColor","color","minHeight","minWidth","padding","justifyContent","title","borderBottom","fontWeight","fontSize","marginBottom","paddingBottom","paddingRight","content","lineHeight","close","border","height","outline","right","textAlign","WebkitAppearance","width","footer","borderTop","marginTop","paddingTop","arrow","length","spread","options"],"mappings":"AAEO,IAAMA,EAA0C,CACrDC,QAAS,CACPC,QAAS,cACTC,cAAe,SACfC,OAAQ,KAEVC,gBAAiB,CACfC,MAAO,IACPC,SAAU,WACVC,KAAM,IACNC,WAAY,UAEdC,QAAS,CACPR,QAAS,eACTS,OAAQ,4CACRC,aAAc,4CACdC,SAAU,IACVC,QAAS,EACTP,SAAU,WACVQ,WAAY,eACZN,WAAY,SACZL,OAAQ,KAEVY,eAAgB,CACdF,QAAS,EACTL,WAAY,WAEdQ,qBAAsB,CACpBH,QAAS,EACTC,WAAY,+BACZN,WAAY,WAEdS,eAAgB,CACdJ,QAAS,EACTL,WAAY,WAEdU,gBAAiB,CACfb,KAAM,MACNC,SAAU,QACVC,IAAK,MACLY,UAAW,yBAEbC,UAAW,CACTC,UAAW,aACXC,aAAc,EACdC,gBAAiB,OACjBC,MAAO,mBACPC,UAAW,GACXC,SAAU,IACVC,QAAS,OACTrB,SAAU,WACVL,QAAS,OACTC,cAAe,SACf0B,eAAgB,UAElBC,MAAO,CACLC,aAAc,6BACdN,MAAO,mBACPO,WAAY,OACZC,SAAU,GACVC,aAAc,EACdC,cAAe,EACfC,aAAc,IAEhBC,QAAS,CACPJ,SAAU,GACVK,WAAY,QAEdC,MAAO,CACLf,gBAAiB,cACjBgB,OAAQ,EACRjB,aAAc,EACdE,MAAO,mBACPQ,SAAU,GACVQ,OAAQ,GACRH,WAAY,OACZI,QAAS,OACTd,QAAS,EACTrB,SAAU,WACVoC,MAAO,MACPC,UAAW,SACXpC,IAAK,MACLqC,iBAAkB,OAClBC,MAAO,IAETC,OAAQ,CACNC,UAAW,6BACXf,SAAU,GACVgB,UAAW,GACXC,WAAY,GAEdC,MAAO,CACL1B,MAAO,OACPvB,QAAS,cACTkD,OAAQ,EACR7C,SAAU,WACV8C,OAAQ,IAEVC,QAAS,CACPlD,OAAQ"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import o from'@babel/runtime/helpers/objectSpread2';import t from'@babel/runtime/helpers/objectWithoutProperties';import{forwardRef as e}from'react';import{withMergedProps as r}from'../../hocs/withMergedProps.js';import{Text as s}from'../Text/Text.js';import{Icon as i}from'../Icon/Icon.js';import'../Icon/icons.js';import n from'./images/close.module.svg.js';import{SIZES as m}from'./constants.js';export{SIZES}from'./constants.js';import{Root as p,CloseButton as a}from'./style.js';import{jsxs as c,jsx as l}from'react/jsx-runtime';var f=["size","titleProps","contentProps","closeButtonProps","title","content","footer","closeFn","showCloseButton"];var h='TooltipComponent';var d=r(e(((e,r)=>{var{size:m="s",titleProps:h={},contentProps:d={},closeButtonProps:j={},title:u,content:g,footer:v,closeFn:C,showCloseButton:P}=e,b=t(e,f);var x={appearance:'body',size:'inherit',color:'inherit'};return c(p,o(o({},b),{},{size:m,ref:r,children:[P&&l(a,o(o({},j),{},{type:"button",onClick:o=>{'function'==typeof C&&C(),j.onClick&&j.onClick(o)},children:l(i,{as:"span",icon:l(n,{}),size:16})})),u&&l(s,o(o(o({weight:700,marginRight:P?16:void 0,marginBottom:g||v?'0.3em':void 0},x),h),{},{children:u})),g&&l(s,o(o(o({marginRight:!u&&P?16:void 0,marginBottom:v?'0.2em':void 0},x),d),{},{children:g})),v]}))})),{sizes:m,displayName:"TooltipComponent"});export{h as COMPONENT_NAME,d as TooltipComponent};
|
|
2
|
+
//# sourceMappingURL=TooltipComponent.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TooltipComponent.js","sources":["../../../../src/components/TooltipComponent/TooltipComponent.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { Text } from 'components/Text'\nimport { Icon } from 'components/Icon'\nimport type { TextProps } from 'components/Text'\nimport Close from './images/close.module.svg'\nimport { SIZES } from './constants'\nimport type { TooltipComponentProps } from './types'\nimport * as Styled from './style'\n\nconst COMPONENT_NAME = 'TooltipComponent'\n\n/**\n *\n * Component accepts all \\<div\\> attributes.\n *\n * Responsive \"size\" props are supported.\n *\n * Exposed \"ref\" attached to root node.\n *\n * See full [TooltipComponentProps](https://github.com/foxford/ui/blob/master/src/components/TooltipComponent/types.ts)\n */\nconst TooltipComponent: React.ForwardRefExoticComponent<TooltipComponentProps> = withMergedProps<\n TooltipComponentProps,\n HTMLDivElement\n>(\n forwardRef((props, ref) => {\n const {\n size = 's',\n titleProps = {},\n contentProps = {},\n closeButtonProps = {},\n title,\n content,\n footer,\n closeFn,\n showCloseButton,\n ...restProps\n } = props\n\n const textProps: TextProps = { appearance: 'body', size: 'inherit', color: 'inherit' }\n\n return (\n <Styled.Root {...restProps} size={size} ref={ref}>\n {showCloseButton && (\n <Styled.CloseButton\n {...closeButtonProps}\n type='button'\n onClick={(evt) => {\n if (typeof closeFn === 'function') closeFn()\n if (closeButtonProps.onClick) closeButtonProps.onClick(evt)\n }}\n >\n <Icon as='span' icon={<Close />} size={16} />\n </Styled.CloseButton>\n )}\n {title && (\n <Text\n weight={700}\n marginRight={showCloseButton ? 16 : undefined}\n marginBottom={content || footer ? '0.3em' : undefined}\n {...textProps}\n {...titleProps}\n >\n {title}\n </Text>\n )}\n {content && (\n <Text\n marginRight={!title && showCloseButton ? 16 : undefined}\n marginBottom={footer ? '0.2em' : undefined}\n {...textProps}\n {...contentProps}\n >\n {content}\n </Text>\n )}\n {footer}\n </Styled.Root>\n )\n }),\n {\n sizes: SIZES,\n displayName: COMPONENT_NAME,\n }\n)\n\nexport { TooltipComponent }\n\nexport { COMPONENT_NAME, SIZES }\n"],"names":["COMPONENT_NAME","TooltipComponent","withMergedProps","forwardRef","props","ref","size","titleProps","contentProps","closeButtonProps","title","content","footer","closeFn","showCloseButton","restProps","_excluded","textProps","appearance","color","_jsxs","Styled.Root","children","_jsx","Styled.CloseButton","type","onClick","evt","Icon","as","icon","Close","Text","_objectSpread","weight","marginRight","marginBottom","undefined","sizes","SIZES","displayName"],"mappings":"2oBAUMA,IAAAA,EAAiB,mBAYjBC,IAAAA,EAA2EC,EAI/EC,GAAW,CAACC,EAAOC,KACjB,IAAMC,KACJA,EAAO,IADHC,WAEJA,EAAa,GAFTC,aAGJA,EAAe,GAHXC,iBAIJA,EAAmB,GAJfC,MAKJA,EALIC,QAMJA,EANIC,OAOJA,EAPIC,QAQJA,EARIC,gBASJA,GAEEV,EADCW,IACDX,EAXJY,GAaA,IAAMC,EAAuB,CAAEC,WAAY,OAAQZ,KAAM,UAAWa,MAAO,WAE3E,OACEC,EAACC,SAAgBN,GAAjB,GAAA,CAA4BT,KAAMA,EAAMD,IAAKA,EAA7CiB,SAAA,CACGR,GACCS,EAACC,SACKf,GADN,GAAA,CAEEgB,KAAK,SACLC,QAAUC,IACe,mBAAZd,GAAwBA,IAC/BJ,EAAiBiB,SAASjB,EAAiBiB,QAAQC,IAL3DL,SAQEC,EAACK,EAAD,CAAMC,GAAG,OAAOC,KAAMP,EAACQ,EAAvB,IAAiCzB,KAAM,QAG1CI,GACCa,EAACS,EAADC,EAAAA,EAAAA,EAAA,CACEC,OAAQ,IACRC,YAAarB,EAAkB,QAAA,EAC/BsB,aAAczB,GAAWC,EAAS,aAAUyB,GACxCpB,GACAV,GALN,GAAA,CAAAe,SAOGZ,KAGJC,GACCY,EAACS,EAADC,EAAAA,EAAAA,EAAA,CACEE,aAAczB,GAASI,EAAkB,QAAKuB,EAC9CD,aAAcxB,EAAS,aAAA,GACnBK,GACAT,GAJN,GAAA,CAAAc,SAMGX,KAGJC,SAIP,CACE0B,MAAOC,EACPC,YAzEmB"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
var d={xxxl:{fontSize:16,minWidth:80,maxWidth:380,paddingTop:14,paddingRight:18,paddingBottom:14,paddingLeft:18,borderRadius:8},xxl:{fontSize:16,minWidth:80,maxWidth:380,paddingTop:14,paddingRight:18,paddingBottom:14,paddingLeft:18,borderRadius:8},xl:{fontSize:16,minWidth:80,maxWidth:380,paddingTop:14,paddingRight:18,paddingBottom:14,paddingLeft:18,borderRadius:8},l:{fontSize:16,minWidth:80,maxWidth:380,paddingTop:14,paddingRight:18,paddingBottom:14,paddingLeft:18,borderRadius:8},m:{fontSize:14,minWidth:64,maxWidth:340,paddingTop:12,paddingRight:16,paddingBottom:12,paddingLeft:16,borderRadius:8},s:{fontSize:14,minWidth:45,maxWidth:200,paddingTop:8,paddingRight:8,paddingBottom:8,paddingLeft:8,borderRadius:8},xs:{fontSize:14,minWidth:45,maxWidth:200,paddingTop:8,paddingRight:8,paddingBottom:8,paddingLeft:8,borderRadius:8},xxs:{fontSize:14,minWidth:45,maxWidth:200,paddingTop:8,paddingRight:8,paddingBottom:8,paddingLeft:8,borderRadius:8},xxxs:{fontSize:14,minWidth:45,maxWidth:200,paddingTop:8,paddingRight:8,paddingBottom:8,paddingLeft:8,borderRadius:8}};export{d as SIZES};
|
|
2
|
+
//# sourceMappingURL=constants.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"constants.js","sources":["../../../../src/components/TooltipComponent/constants.ts"],"sourcesContent":["import type { Sizes } from 'shared/types'\n\nexport const SIZES: Sizes = {\n xxxl: {\n fontSize: 16,\n minWidth: 80,\n maxWidth: 380,\n paddingTop: 14,\n paddingRight: 18,\n paddingBottom: 14,\n paddingLeft: 18,\n borderRadius: 8,\n },\n xxl: {\n fontSize: 16,\n minWidth: 80,\n maxWidth: 380,\n paddingTop: 14,\n paddingRight: 18,\n paddingBottom: 14,\n paddingLeft: 18,\n borderRadius: 8,\n },\n xl: {\n fontSize: 16,\n minWidth: 80,\n maxWidth: 380,\n paddingTop: 14,\n paddingRight: 18,\n paddingBottom: 14,\n paddingLeft: 18,\n borderRadius: 8,\n },\n l: {\n fontSize: 16,\n minWidth: 80,\n maxWidth: 380,\n paddingTop: 14,\n paddingRight: 18,\n paddingBottom: 14,\n paddingLeft: 18,\n borderRadius: 8,\n },\n m: {\n fontSize: 14,\n minWidth: 64,\n maxWidth: 340,\n paddingTop: 12,\n paddingRight: 16,\n paddingBottom: 12,\n paddingLeft: 16,\n borderRadius: 8,\n },\n s: {\n fontSize: 14,\n minWidth: 45,\n maxWidth: 200,\n paddingTop: 8,\n paddingRight: 8,\n paddingBottom: 8,\n paddingLeft: 8,\n borderRadius: 8,\n },\n xs: {\n fontSize: 14,\n minWidth: 45,\n maxWidth: 200,\n paddingTop: 8,\n paddingRight: 8,\n paddingBottom: 8,\n paddingLeft: 8,\n borderRadius: 8,\n },\n xxs: {\n fontSize: 14,\n minWidth: 45,\n maxWidth: 200,\n paddingTop: 8,\n paddingRight: 8,\n paddingBottom: 8,\n paddingLeft: 8,\n borderRadius: 8,\n },\n xxxs: {\n fontSize: 14,\n minWidth: 45,\n maxWidth: 200,\n paddingTop: 8,\n paddingRight: 8,\n paddingBottom: 8,\n paddingLeft: 8,\n borderRadius: 8,\n },\n}\n"],"names":["SIZES","xxxl","fontSize","minWidth","maxWidth","paddingTop","paddingRight","paddingBottom","paddingLeft","borderRadius","xxl","xl","l","m","s","xs","xxs","xxxs"],"mappings":"AAEO,IAAMA,EAAe,CAC1BC,KAAM,CACJC,SAAU,GACVC,SAAU,GACVC,SAAU,IACVC,WAAY,GACZC,aAAc,GACdC,cAAe,GACfC,YAAa,GACbC,aAAc,GAEhBC,IAAK,CACHR,SAAU,GACVC,SAAU,GACVC,SAAU,IACVC,WAAY,GACZC,aAAc,GACdC,cAAe,GACfC,YAAa,GACbC,aAAc,GAEhBE,GAAI,CACFT,SAAU,GACVC,SAAU,GACVC,SAAU,IACVC,WAAY,GACZC,aAAc,GACdC,cAAe,GACfC,YAAa,GACbC,aAAc,GAEhBG,EAAG,CACDV,SAAU,GACVC,SAAU,GACVC,SAAU,IACVC,WAAY,GACZC,aAAc,GACdC,cAAe,GACfC,YAAa,GACbC,aAAc,GAEhBI,EAAG,CACDX,SAAU,GACVC,SAAU,GACVC,SAAU,IACVC,WAAY,GACZC,aAAc,GACdC,cAAe,GACfC,YAAa,GACbC,aAAc,GAEhBK,EAAG,CACDZ,SAAU,GACVC,SAAU,GACVC,SAAU,IACVC,WAAY,EACZC,aAAc,EACdC,cAAe,EACfC,YAAa,EACbC,aAAc,GAEhBM,GAAI,CACFb,SAAU,GACVC,SAAU,GACVC,SAAU,IACVC,WAAY,EACZC,aAAc,EACdC,cAAe,EACfC,YAAa,EACbC,aAAc,GAEhBO,IAAK,CACHd,SAAU,GACVC,SAAU,GACVC,SAAU,IACVC,WAAY,EACZC,aAAc,EACdC,cAAe,EACfC,YAAa,EACbC,aAAc,GAEhBQ,KAAM,CACJf,SAAU,GACVC,SAAU,GACVC,SAAU,IACVC,WAAY,EACZC,aAAc,EACdC,cAAe,EACfC,YAAa,EACbC,aAAc"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import*as e from'react';var r;function a(){return a=Object.assign||function(e){for(var r=1;r<arguments.length;r++){var a=arguments[r];for(var t in a)({}).hasOwnProperty.call(a,t)&&(e[t]=a[t])}return e},a.apply(this,arguments)}var t=t=>e.createElement("svg",a({xmlns:"http://www.w3.org/2000/svg",fill:"currentcolor",viewBox:"0 0 16 16"},t),r||(r=e.createElement("path",{fillRule:"evenodd",d:"M3.646 3.646a.5.5 0 0 1 .708 0L8 7.293l3.646-3.647a.5.5 0 0 1 .708.708L8.707 8l3.647 3.646a.5.5 0 0 1-.708.708L8 8.707l-3.646 3.647a.5.5 0 0 1-.708-.708L7.293 8 3.646 4.354a.5.5 0 0 1 0-.708",clipRule:"evenodd"})));export{t as default};
|
|
2
|
+
//# sourceMappingURL=close.module.svg.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"close.module.svg.js","sources":["../../../../../src/components/TooltipComponent/images/close.module.svg"],"sourcesContent":["<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"currentcolor\" viewBox=\"0 0 16 16\"><path fill-rule=\"evenodd\" d=\"M3.646 3.646a.5.5 0 0 1 .708 0L8 7.293l3.646-3.647a.5.5 0 0 1 .708.708L8.707 8l3.647 3.646a.5.5 0 0 1-.708.708L8 8.707l-3.646 3.647a.5.5 0 0 1-.708-.708L7.293 8 3.646 4.354a.5.5 0 0 1 0-.708\" clip-rule=\"evenodd\"/></svg>"],"names":["_path","_extends","Object","assign","target","i","arguments","length","source","key","hasOwnProperty","call","apply","this","SvgClosemodule","props","React","createElement","xmlns","fill","viewBox","fillRule","d","clipRule"],"mappings":"wBAAA,IAAIA,EAEJ,SAASC,IAA2Q,OAA9PA,EAAWC,OAAOC,QAAU,SAAUC,GAAU,IAAK,IAAIC,EAAI,EAAGA,EAAIC,UAAUC,OAAQF,IAAK,CAAE,IAAIG,EAASF,UAAUD,GAAI,IAAK,IAAII,KAAOD,GAAcN,IAAiBQ,eAAeC,KAAKH,EAAQC,KAAQL,EAAOK,GAAOD,EAAOC,IAAY,OAAOL,GAAkBH,EAASW,MAAMC,KAAMP,WAI7S,IAACQ,EAAyCC,GACvBC,EAAMC,cAAc,MAAOhB,EAAS,CACtDiB,MAAO,6BACPC,KAAM,eACNC,QAAS,aACRL,GAAQf,IAAUA,EAAqBgB,EAAMC,cAAc,OAAQ,CACpEI,SAAU,UACVC,EAAG,iMACHC,SAAU"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import o from'@babel/runtime/helpers/objectSpread2';import e,{css as r}from'styled-components';import n from'tinycolor2';import{createShouldForwardProp as t}from'../../shared/utils/style.js';import{focus as c}from'../../mixins/focus.js';import{responsiveSize as l}from'../../mixins/responsive-size.js';var a=t((o=>!['black','contrast','elevated'].includes(o)));var s=e.button.withConfig({componentId:"fox-ui__sc-1fjl2iv-0"})(["box-sizing:border-box;appearance:none;position:absolute;top:0;right:0;padding:4px;margin:0;border:none;display:flex;align-items:center;justify-content:center;border-radius:50%;background-color:transparent;cursor:pointer;&:disabled{cursor:not-allowed;}",""],c);var i=o=>"\n color: ".concat(o.color,";\n background-color: ").concat(o.backgroundColor,";\n filter: drop-shadow(0 0 3px ").concat(o.shadowColor,");\n\n & > ").concat(s," {\n color: ").concat(o.closeColor,";\n }\n & > ").concat(s,":hover {\n color: ").concat(o.closeColorHover,";\n }\n & > ").concat(s,":active {\n color: ").concat(o.closeColorActive,";\n }\n & > ").concat(s,":disabled {\n color: ").concat(o.closeColorDisabled,";\n }\n\n");var m={contrast:r(["",""],(e=>i(o({color:e.theme.colors['content-oncolor-primary'],backgroundColor:e.theme.colors['bg-brand-primary-basic'],shadowColor:e.elevated?e.theme.colors['bg-oncolor-hover']:e.theme.colors.transparent,closeColor:e.theme.colors['content-oncolor-tertiary'],closeColorHover:e.theme.colors['content-oncolor-primary'],closeColorActive:e.theme.colors['content-oncolor-primary'],closeColorDisabled:e.theme.colors['content-oncolor-disabled']},e.palette)))),black:r(["",""],(e=>i(o({color:e.theme.colors['content-onmain-inverse'],backgroundColor:e.theme.colors['bg-onmain-inverse'],shadowColor:e.elevated?e.theme.colors['bg-oncolor-hover']:e.theme.colors.transparent,closeColor:e.theme.colors['content-onmain-inverse'],closeColorHover:n(e.theme.colors['content-onmain-inverse']).darken(20).toString(),closeColorActive:n(e.theme.colors['content-onmain-inverse']).darken(20).toString(),closeColorDisabled:e.theme.colors['content-disabled']},e.palette)))),primary:r(["",""],(e=>i(o({color:e.theme.colors['content-onmain-primary'],backgroundColor:e.theme.colors['bg-onmain-primary'],shadowColor:e.elevated?e.theme.colors['bg-oncolor-hover']:e.theme.colors.transparent,closeColor:e.theme.colors['content-onmain-tertiary'],closeColorHover:e.theme.colors['content-onmain-primary'],closeColorActive:e.theme.colors['content-onmain-primary'],closeColorDisabled:e.theme.colors['content-disabled']},e.palette))))};var d=e.div.withConfig({shouldForwardProp:a}).attrs({dynamicSizeDeclaration:(o,e)=>({fontSize:'string'==typeof o?o:"".concat(o).concat(e),minWidth:'4.6em',maxWidth:'24em',padding:'0.8em',borderRadius:8})}).withConfig({componentId:"fox-ui__sc-1fjl2iv-1"})(["box-sizing:border-box;display:inline-block;isolation:isolate;position:relative;cursor:default;word-break:break-word;"," ",""],(o=>{var e=m.primary;return o.black&&(e=m.black),o.contrast&&(e=m.contrast),e}),l);export{s as CloseButton,d as Root};
|
|
2
|
+
//# sourceMappingURL=style.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"style.js","sources":["../../../../src/components/TooltipComponent/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport tinycolor from 'tinycolor2'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { focus } from 'mixins/focus'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport type { CSSColor } from 'shared/types'\nimport type { StyledTooltipComponentProps, TooltipComponentPalette } from './types'\n\nconst shouldForwardTooltipComponentProp = createShouldForwardProp(\n (propKey) => !['black', 'contrast', 'elevated'].includes(propKey)\n)\n\nexport const CloseButton = styled.button`\n box-sizing: border-box;\n appearance: none;\n position: absolute;\n top: 0;\n right: 0;\n padding: 4px;\n margin: 0;\n border: none;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 50%;\n background-color: transparent;\n cursor: pointer;\n &:disabled {\n cursor: not-allowed;\n }\n\n ${focus}\n`\n\nconst template = (palette: TooltipComponentPalette) => `\n color: ${palette.color};\n background-color: ${palette.backgroundColor};\n filter: drop-shadow(0 0 3px ${palette.shadowColor});\n\n & > ${CloseButton} {\n color: ${palette.closeColor};\n }\n & > ${CloseButton}:hover {\n color: ${palette.closeColorHover};\n }\n & > ${CloseButton}:active {\n color: ${palette.closeColorActive};\n }\n & > ${CloseButton}:disabled {\n color: ${palette.closeColorDisabled};\n }\n\n`\n\nconst COLOR_SCHEMA = {\n contrast: css<StyledTooltipComponentProps>`\n ${(props) =>\n template({\n color: props.theme.colors['content-oncolor-primary'],\n backgroundColor: props.theme.colors['bg-brand-primary-basic'],\n shadowColor: props.elevated ? props.theme.colors['bg-oncolor-hover'] : props.theme.colors.transparent,\n closeColor: props.theme.colors['content-oncolor-tertiary'],\n closeColorHover: props.theme.colors['content-oncolor-primary'],\n closeColorActive: props.theme.colors['content-oncolor-primary'],\n closeColorDisabled: props.theme.colors['content-oncolor-disabled'],\n ...props.palette,\n })}\n `,\n black: css<StyledTooltipComponentProps>`\n ${(props) =>\n template({\n color: props.theme.colors['content-onmain-inverse'],\n backgroundColor: props.theme.colors['bg-onmain-inverse'],\n shadowColor: props.elevated ? props.theme.colors['bg-oncolor-hover'] : props.theme.colors.transparent,\n closeColor: props.theme.colors['content-onmain-inverse'],\n closeColorHover: tinycolor(props.theme.colors['content-onmain-inverse']).darken(20).toString() as CSSColor,\n closeColorActive: tinycolor(props.theme.colors['content-onmain-inverse']).darken(20).toString() as CSSColor,\n closeColorDisabled: props.theme.colors['content-disabled'],\n ...props.palette,\n })}\n `,\n primary: css<StyledTooltipComponentProps>`\n ${(props) =>\n template({\n color: props.theme.colors['content-onmain-primary'],\n backgroundColor: props.theme.colors['bg-onmain-primary'],\n shadowColor: props.elevated ? props.theme.colors['bg-oncolor-hover'] : props.theme.colors.transparent,\n closeColor: props.theme.colors['content-onmain-tertiary'],\n closeColorHover: props.theme.colors['content-onmain-primary'],\n closeColorActive: props.theme.colors['content-onmain-primary'],\n closeColorDisabled: props.theme.colors['content-disabled'],\n ...props.palette,\n })}\n `,\n}\n\nexport const Root = styled.div\n .withConfig<StyledTooltipComponentProps>({\n shouldForwardProp: shouldForwardTooltipComponentProp,\n })\n .attrs<StyledTooltipComponentProps>(<Required<Pick<StyledTooltipComponentProps, 'dynamicSizeDeclaration'>>>{\n dynamicSizeDeclaration: (size, sizeUnits) => ({\n fontSize: typeof size === 'string' ? size : `${size}${sizeUnits}`,\n minWidth: '4.6em',\n maxWidth: '24em',\n padding: '0.8em',\n borderRadius: 8,\n }),\n })`\n box-sizing: border-box;\n display: inline-block;\n isolation: isolate;\n position: relative;\n cursor: default;\n word-break: break-word;\n\n ${(props) => {\n let schema = COLOR_SCHEMA.primary\n\n if (props.black) schema = COLOR_SCHEMA.black\n if (props.contrast) schema = COLOR_SCHEMA.contrast\n\n return schema\n }}\n\n ${responsiveSize}\n`\n"],"names":["shouldForwardTooltipComponentProp","createShouldForwardProp","propKey","includes","CloseButton","styled","button","withConfig","componentId","focus","template","palette","color","concat","backgroundColor","shadowColor","closeColor","closeColorHover","closeColorActive","closeColorDisabled","COLOR_SCHEMA","contrast","css","props","_objectSpread","theme","colors","elevated","transparent","black","tinycolor","darken","toString","primary","Root","div","shouldForwardProp","attrs","dynamicSizeDeclaration","size","sizeUnits","fontSize","minWidth","maxWidth","padding","borderRadius","schema","responsiveSize"],"mappings":"8SAQA,IAAMA,EAAoCC,GACvCC,IAAa,CAAC,QAAS,WAAY,YAAYC,SAASD,KAG9CE,IAAAA,EAAcC,EAAOC,OAAVC,WAAA,CAAAC,YAAA,wBAAGH,CAAH,CAAA,8PAAA,IAmBpBI,GAGJ,IAAMC,EAAYC,GACPA,cAAAA,OAAAA,EAAQC,MADF,2BAAAC,OAEKF,EAAQG,gBACEH,qCAAAA,OAAAA,EAAQI,YAHvB,gBAAAF,OAKTT,EACKO,mBAAAA,OAAAA,EAAQK,oCAEbZ,EARS,yBAAAS,OASJF,EAAQM,yCAEbb,EAXS,0BAAAS,OAYJF,EAAQO,iBAEbd,kBAAAA,OAAAA,qCACKO,EAAQQ,mBAfrB,cAoBA,IAAMC,EAAe,CACnBC,SAAUC,EACLC,CAAAA,GAAAA,KAAAA,GACDb,EAAQc,EAAA,CACNZ,MAAOW,EAAME,MAAMC,OAAO,2BAC1BZ,gBAAiBS,EAAME,MAAMC,OAAO,0BACpCX,YAAaQ,EAAMI,SAAWJ,EAAME,MAAMC,OAAO,oBAAsBH,EAAME,MAAMC,OAAOE,YAC1FZ,WAAYO,EAAME,MAAMC,OAAO,4BAC/BT,gBAAiBM,EAAME,MAAMC,OAAO,2BACpCR,iBAAkBK,EAAME,MAAMC,OAAO,2BACrCP,mBAAoBI,EAAME,MAAMC,OAAO,6BACpCH,EAAMZ,YAGfkB,MAAOP,EACFC,CAAAA,GAAAA,KAAAA,GACDb,EAAQc,EAAA,CACNZ,MAAOW,EAAME,MAAMC,OAAO,0BAC1BZ,gBAAiBS,EAAME,MAAMC,OAAO,qBACpCX,YAAaQ,EAAMI,SAAWJ,EAAME,MAAMC,OAAO,oBAAsBH,EAAME,MAAMC,OAAOE,YAC1FZ,WAAYO,EAAME,MAAMC,OAAO,0BAC/BT,gBAAiBa,EAAUP,EAAME,MAAMC,OAAO,2BAA2BK,OAAO,IAAIC,WACpFd,iBAAkBY,EAAUP,EAAME,MAAMC,OAAO,2BAA2BK,OAAO,IAAIC,WACrFb,mBAAoBI,EAAME,MAAMC,OAAO,qBACpCH,EAAMZ,YAGfsB,QAASX,EACJC,CAAAA,GAAAA,KAAAA,GACDb,EAAQc,EAAA,CACNZ,MAAOW,EAAME,MAAMC,OAAO,0BAC1BZ,gBAAiBS,EAAME,MAAMC,OAAO,qBACpCX,YAAaQ,EAAMI,SAAWJ,EAAME,MAAMC,OAAO,oBAAsBH,EAAME,MAAMC,OAAOE,YAC1FZ,WAAYO,EAAME,MAAMC,OAAO,2BAC/BT,gBAAiBM,EAAME,MAAMC,OAAO,0BACpCR,iBAAkBK,EAAME,MAAMC,OAAO,0BACrCP,mBAAoBI,EAAME,MAAMC,OAAO,qBACpCH,EAAMZ,aAKV,IAAMuB,EAAO7B,EAAO8B,IACxB5B,WAAwC,CACvC6B,kBAAmBpC,IAEpBqC,MAA0G,CACzGC,uBAAwB,CAACC,EAAMC,KAAAA,CAC7BC,SAA0B,iBAATF,EAAoBA,EAAUA,GAAAA,OAAAA,GAAOC,OAAAA,GACtDE,SAAU,QACVC,SAAU,OACVC,QAAS,QACTC,aAAc,MAVHtC,WAAA,CAAAC,YAAA,wBAAGH,CAAH,CAAA,uHAAA,IAAA,KAoBZkB,IACD,IAAIuB,EAAS1B,EAAaa,QAK1B,OAHIV,EAAMM,QAAOiB,EAAS1B,EAAaS,OACnCN,EAAMF,WAAUyB,EAAS1B,EAAaC,UAEnCyB,IAGPC"}
|
package/dts/index.d.ts
CHANGED
|
@@ -7,7 +7,7 @@ import { Classes } from 'react-modal';
|
|
|
7
7
|
import * as rc_scrollbars_lib_Scrollbars_types from 'rc-scrollbars/lib/Scrollbars/types';
|
|
8
8
|
import * as rc_scrollbars from 'rc-scrollbars';
|
|
9
9
|
import { ScrollbarsProps } from 'rc-scrollbars';
|
|
10
|
-
import {
|
|
10
|
+
import { Props, PopperInstance, PlacementOptions, SelectorOrElement, Styles } from 'react-floater/lib/types';
|
|
11
11
|
import { InputState, MaskOptions } from 'react-input-mask';
|
|
12
12
|
import { ReactSelectProps } from 'react-select';
|
|
13
13
|
|
|
@@ -2829,144 +2829,136 @@ declare namespace Tabs {
|
|
|
2829
2829
|
var Tab: react.ForwardRefExoticComponent<TabProps>;
|
|
2830
2830
|
}
|
|
2831
2831
|
|
|
2832
|
-
|
|
2833
|
-
|
|
2834
|
-
|
|
2835
|
-
|
|
2836
|
-
|
|
2837
|
-
|
|
2838
|
-
|
|
2839
|
-
|
|
2840
|
-
| string
|
|
2841
|
-
| number
|
|
2842
|
-
| boolean
|
|
2843
|
-
| symbol
|
|
2844
|
-
| bigint;
|
|
2845
|
-
|
|
2846
|
-
declare global {
|
|
2847
|
-
interface SymbolConstructor {
|
|
2848
|
-
readonly observable: symbol;
|
|
2849
|
-
}
|
|
2850
|
-
}
|
|
2851
|
-
|
|
2852
|
-
/**
|
|
2853
|
-
Matches any primitive, `Date`, or `RegExp` value.
|
|
2854
|
-
*/
|
|
2855
|
-
type BuiltIns = Primitive | Date | RegExp;
|
|
2856
|
-
|
|
2857
|
-
/**
|
|
2858
|
-
Create a type from another type with all keys and nested keys set to optional.
|
|
2859
|
-
|
|
2860
|
-
Use-cases:
|
|
2861
|
-
- Merging a default settings/config object with another object, the second object would be a deep partial of the default object.
|
|
2862
|
-
- Mocking and testing complex entities, where populating an entire object with its keys would be redundant in terms of the mock or test.
|
|
2863
|
-
|
|
2864
|
-
@example
|
|
2865
|
-
```
|
|
2866
|
-
import type {PartialDeep} from 'type-fest';
|
|
2867
|
-
|
|
2868
|
-
const settings: Settings = {
|
|
2869
|
-
textEditor: {
|
|
2870
|
-
fontSize: 14;
|
|
2871
|
-
fontColor: '#000000';
|
|
2872
|
-
fontWeight: 400;
|
|
2873
|
-
}
|
|
2874
|
-
autocomplete: false;
|
|
2875
|
-
autosave: true;
|
|
2832
|
+
declare type TooltipComponentPalette = {
|
|
2833
|
+
color: CSSColor;
|
|
2834
|
+
backgroundColor: CSSColor;
|
|
2835
|
+
shadowColor: CSSColor;
|
|
2836
|
+
closeColor: CSSColor;
|
|
2837
|
+
closeColorHover: CSSColor;
|
|
2838
|
+
closeColorActive: CSSColor;
|
|
2839
|
+
closeColorDisabled: CSSColor;
|
|
2876
2840
|
};
|
|
2877
|
-
|
|
2878
|
-
|
|
2879
|
-
|
|
2880
|
-
|
|
2881
|
-
|
|
2882
|
-
|
|
2883
|
-
|
|
2884
|
-
|
|
2885
|
-
|
|
2886
|
-
|
|
2887
|
-
|
|
2888
|
-
|
|
2889
|
-
|
|
2890
|
-
|
|
2891
|
-
|
|
2892
|
-
|
|
2893
|
-
|
|
2894
|
-
|
|
2895
|
-
|
|
2896
|
-
|
|
2897
|
-
|
|
2898
|
-
|
|
2899
|
-
|
|
2900
|
-
|
|
2901
|
-
|
|
2902
|
-
|
|
2903
|
-
? T extends Array<infer ItemType> // Test for arrays/tuples, per https://github.com/microsoft/TypeScript/issues/35156
|
|
2904
|
-
? ItemType[] extends T // Test for arrays (non-tuples) specifically
|
|
2905
|
-
? Array<PartialDeep<ItemType | undefined>> // Recreate relevant array type to prevent eager evaluation of circular reference
|
|
2906
|
-
: PartialObjectDeep<T> // Tuples behave properly
|
|
2907
|
-
: PartialObjectDeep<T>
|
|
2908
|
-
: unknown;
|
|
2909
|
-
|
|
2910
|
-
/**
|
|
2911
|
-
Same as `PartialDeep`, but accepts only `Map`s and as inputs. Internal helper for `PartialDeep`.
|
|
2912
|
-
*/
|
|
2913
|
-
interface PartialMapDeep<KeyType, ValueType> extends Map<PartialDeep<KeyType>, PartialDeep<ValueType>> {}
|
|
2914
|
-
|
|
2915
|
-
/**
|
|
2916
|
-
Same as `PartialDeep`, but accepts only `Set`s as inputs. Internal helper for `PartialDeep`.
|
|
2917
|
-
*/
|
|
2918
|
-
interface PartialSetDeep<T> extends Set<PartialDeep<T>> {}
|
|
2919
|
-
|
|
2920
|
-
/**
|
|
2921
|
-
Same as `PartialDeep`, but accepts only `ReadonlyMap`s as inputs. Internal helper for `PartialDeep`.
|
|
2922
|
-
*/
|
|
2923
|
-
interface PartialReadonlyMapDeep<KeyType, ValueType> extends ReadonlyMap<PartialDeep<KeyType>, PartialDeep<ValueType>> {}
|
|
2924
|
-
|
|
2925
|
-
/**
|
|
2926
|
-
Same as `PartialDeep`, but accepts only `ReadonlySet`s as inputs. Internal helper for `PartialDeep`.
|
|
2927
|
-
*/
|
|
2928
|
-
interface PartialReadonlySetDeep<T> extends ReadonlySet<PartialDeep<T>> {}
|
|
2841
|
+
interface TooltipComponentProps extends ResponsiveSizeProps, Omit<React.ComponentPropsWithRef<'div'>, 'children' | 'title'> {
|
|
2842
|
+
/** Custom colors */
|
|
2843
|
+
palette?: Partial<Record<keyof TooltipComponentPalette, Color>>;
|
|
2844
|
+
/** Appearance variant */
|
|
2845
|
+
black?: boolean;
|
|
2846
|
+
/** Appearance variant */
|
|
2847
|
+
contrast?: boolean;
|
|
2848
|
+
/** Title text */
|
|
2849
|
+
title?: React.ReactNode;
|
|
2850
|
+
/** Props for title text component */
|
|
2851
|
+
titleProps?: TextProps;
|
|
2852
|
+
/** Main content text */
|
|
2853
|
+
content?: React.ReactNode;
|
|
2854
|
+
/** Props for content text component */
|
|
2855
|
+
contentProps?: TextProps;
|
|
2856
|
+
/** Footer segment */
|
|
2857
|
+
footer?: React.ReactNode;
|
|
2858
|
+
/** Show close button */
|
|
2859
|
+
showCloseButton?: boolean;
|
|
2860
|
+
/** Props for close button */
|
|
2861
|
+
closeButtonProps?: React.ComponentPropsWithoutRef<'button'>;
|
|
2862
|
+
/** Apply drop shadow filter */
|
|
2863
|
+
elevated?: boolean;
|
|
2864
|
+
/** @ignore */
|
|
2865
|
+
closeFn?: () => void;
|
|
2866
|
+
}
|
|
2929
2867
|
|
|
2930
2868
|
/**
|
|
2931
|
-
|
|
2932
|
-
|
|
2933
|
-
|
|
2934
|
-
|
|
2935
|
-
|
|
2869
|
+
*
|
|
2870
|
+
* Component accepts all \<div\> attributes.
|
|
2871
|
+
*
|
|
2872
|
+
* Responsive "size" props are supported.
|
|
2873
|
+
*
|
|
2874
|
+
* Exposed "ref" attached to root node.
|
|
2875
|
+
*
|
|
2876
|
+
* See full [TooltipComponentProps](https://github.com/foxford/ui/blob/master/src/components/TooltipComponent/types.ts)
|
|
2877
|
+
*/
|
|
2878
|
+
declare const TooltipComponent: React.ForwardRefExoticComponent<TooltipComponentProps>;
|
|
2936
2879
|
|
|
2937
|
-
|
|
2938
|
-
|
|
2939
|
-
|
|
2940
|
-
|
|
2941
|
-
|
|
2942
|
-
|
|
2943
|
-
|
|
2944
|
-
|
|
2945
|
-
|
|
2946
|
-
|
|
2947
|
-
|
|
2948
|
-
|
|
2949
|
-
|
|
2950
|
-
|
|
2880
|
+
interface TooltipProps extends ResponsiveSizeProps, React.RefAttributes<HTMLDivElement> {
|
|
2881
|
+
/** UI: brand (v3), or default (v2) */
|
|
2882
|
+
preset?: ThemePreset;
|
|
2883
|
+
/** Custom colors */
|
|
2884
|
+
palette?: Partial<Record<keyof TooltipComponentPalette, Color>>;
|
|
2885
|
+
/** Appearance variant */
|
|
2886
|
+
black?: boolean;
|
|
2887
|
+
/** Appearance variant */
|
|
2888
|
+
contrast?: boolean;
|
|
2889
|
+
/** Open automatically */
|
|
2890
|
+
autoOpen?: boolean;
|
|
2891
|
+
/** It will be called on state change */
|
|
2892
|
+
callback?: (action: 'open' | 'close', props: Props) => void;
|
|
2893
|
+
/** Default tooltip target */
|
|
2894
|
+
children?: React.ReactNode;
|
|
2895
|
+
/** Custom UI for tooltip */
|
|
2896
|
+
component?: React.ReactElement | ((props: Pick<TooltipProps, 'size' | 'sizeXXS' | 'sizeXS' | 'sizeS' | 'sizeM' | 'sizeL' | 'sizeXL' | 'black' | 'contrast' | 'showCloseButton' | 'closeButtonProps'> & {
|
|
2897
|
+
id?: string;
|
|
2898
|
+
role?: string;
|
|
2899
|
+
closeFn?: () => void;
|
|
2900
|
+
}) => React.ReactElement);
|
|
2901
|
+
/** Tooltip content */
|
|
2902
|
+
content?: React.ReactNode;
|
|
2903
|
+
/** Props for content text component */
|
|
2904
|
+
contentProps?: TextProps;
|
|
2905
|
+
/** Debugging logs in console */
|
|
2906
|
+
debug?: boolean;
|
|
2907
|
+
/** Don't adjust tooltip on scroll / resize */
|
|
2908
|
+
disableFlip?: boolean;
|
|
2909
|
+
/** Don't convert 'hover' to 'click' event on mobile */
|
|
2910
|
+
disableHoverToClick?: boolean;
|
|
2911
|
+
/** Trigger event for tooltip */
|
|
2912
|
+
event?: 'click' | 'hover';
|
|
2913
|
+
/** Pause in 'seconds' to wait before close tooltip (valid for 'hover' event) */
|
|
2914
|
+
eventDelay?: number;
|
|
2915
|
+
/** Tooltip footer */
|
|
2916
|
+
footer?: React.ReactNode;
|
|
2917
|
+
/** Callback to get popper.js instance */
|
|
2918
|
+
getPopper?: (popper: PopperInstance, origin: 'floater' | 'wrapper') => void;
|
|
2919
|
+
/** Don't show tooltip arrow */
|
|
2920
|
+
hideArrow?: boolean;
|
|
2921
|
+
/** Distance in 'px' between tooltip and its target */
|
|
2922
|
+
offset?: number;
|
|
2923
|
+
/** Switch between normal and controlled modes. It will disable built in tooltip behavior */
|
|
2924
|
+
open?: boolean;
|
|
2925
|
+
/** Tooltip position relative to its target */
|
|
2926
|
+
placement?: PlacementOptions;
|
|
2927
|
+
/** CSS selector or element to render tooltips */
|
|
2928
|
+
portalElement?: SelectorOrElement;
|
|
2929
|
+
/** Custom styles */
|
|
2930
|
+
styles?: Partial<Styles>;
|
|
2931
|
+
/** Show button to close tooltip */
|
|
2932
|
+
showCloseButton?: boolean;
|
|
2933
|
+
/** Props for button to close tooltip */
|
|
2934
|
+
closeButtonProps?: React.ComponentPropsWithoutRef<'button'>;
|
|
2935
|
+
/** Tooltip target. If it's not set, 'children' will be used */
|
|
2936
|
+
target?: SelectorOrElement;
|
|
2937
|
+
/** Tooltip title */
|
|
2938
|
+
title?: React.ReactNode;
|
|
2939
|
+
/** Props for title text component */
|
|
2940
|
+
titleProps?: TextProps;
|
|
2941
|
+
/** Position of tooltip wrapper relative to target */
|
|
2942
|
+
wrapperOptions?: {
|
|
2943
|
+
offset?: number;
|
|
2944
|
+
placement?: Omit<PlacementOptions, 'center'>;
|
|
2945
|
+
position?: boolean;
|
|
2951
2946
|
};
|
|
2952
|
-
|
|
2953
|
-
};
|
|
2954
|
-
declare type TooltipDefaultStyles = {
|
|
2955
|
-
tooltipStyles: PartialDeep<Styles> | undefined;
|
|
2956
|
-
tooltipDisplayBlockStyles: PartialDeep<Styles> | undefined;
|
|
2957
|
-
tooltipStylesRounend: PartialDeep<Styles> | undefined;
|
|
2958
|
-
};
|
|
2947
|
+
}
|
|
2959
2948
|
|
|
2960
|
-
declare type TooltipProps = Props;
|
|
2961
2949
|
/**
|
|
2962
|
-
*
|
|
2950
|
+
*
|
|
2951
|
+
* Component accepts ["react-floater"](https://www.npmjs.com/package/react-floater/v/0.8.2) v0.8.2 props.
|
|
2952
|
+
*
|
|
2953
|
+
* Responsive "size" props are supported.
|
|
2954
|
+
*
|
|
2955
|
+
* Exposed "ref" attached to tooltip component root.
|
|
2956
|
+
*
|
|
2957
|
+
* See full [TooltipProps](https://github.com/foxford/ui/blob/master/src/components/Tooltip/types.ts)
|
|
2963
2958
|
*/
|
|
2964
|
-
declare
|
|
2965
|
-
|
|
2966
|
-
|
|
2967
|
-
var themes: TooltipDefaultStyles;
|
|
2968
|
-
var displayName: string;
|
|
2969
|
-
}
|
|
2959
|
+
declare const Tooltip: React.ForwardRefExoticComponent<TooltipProps> & {
|
|
2960
|
+
Component: typeof TooltipComponent;
|
|
2961
|
+
};
|
|
2970
2962
|
|
|
2971
2963
|
interface TagProps extends BaseProps, DisplayProperty, ColorProperty, ResponsiveNamedProperty<'height'>, ResponsiveNamedProperty<'width'> {
|
|
2972
2964
|
as?: 'button' | 'div' | 'input' | 'label';
|
|
@@ -3393,7 +3385,7 @@ declare type StyledBaseInputProps = React.ComponentPropsWithoutRef<'input'> & Pi
|
|
|
3393
3385
|
|
|
3394
3386
|
/**
|
|
3395
3387
|
*
|
|
3396
|
-
* Component accepts all \<input\> attributes and "react-input-mask" props.
|
|
3388
|
+
* Component accepts all \<input\> attributes and "react-input-mask" v2.0.4 props.
|
|
3397
3389
|
*
|
|
3398
3390
|
* Responsive "size", "margin" props are supported.
|
|
3399
3391
|
*
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useKeyboardListener.js","sources":["../../../src/hooks/useKeyboardListener.ts"],"sourcesContent":["import { useEffect } from 'react'\n\nexport const useKeyboardListener = (\n keyboardEvtType: 'keydown' | 'keyup',\n keyboardKeys: string[],\n keyboardEvtHandler: (evt: KeyboardEvent) => void\n) => {\n useEffect(() => {\n const handleKeyboardEvt = (evt: KeyboardEvent) => {\n if (keyboardKeys.includes(evt.key)) keyboardEvtHandler(evt)\n }\n\n document.addEventListener(keyboardEvtType, handleKeyboardEvt)\n\n return () => {\n document.removeEventListener(keyboardEvtType, handleKeyboardEvt)\n }\n }, [keyboardEvtType, keyboardEvtHandler, keyboardKeys])\n}\n"],"names":["useKeyboardListener","keyboardEvtType","keyboardKeys","keyboardEvtHandler","useEffect","handleKeyboardEvt","evt","includes","key","document","addEventListener","removeEventListener"],"mappings":"kCAEO,IAAMA,EAAsB,CACjCC,EACAC,EACAC,KAEAC,GAAAA,KACE,IAAMC,EAAqBC,IACrBJ,EAAaK,SAASD,EAAIE,MAAML,EAAmBG,IAKzD,OAFAG,SAASC,iBAAiBT,EAAiBI,GAEpC,KACLI,SAASE,oBAAoBV,EAAiBI,MAE/C,CAACJ,EAAiBE,EAAoBD"}
|