@consta/uikit 5.2.0 → 5.2.2
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/__internal__/src/components/Badge/Badge.css +1 -1
- package/__internal__/src/components/Badge/Badge.js +1 -1
- package/__internal__/src/components/Badge/Badge.js.map +1 -1
- package/__internal__/src/components/DatePicker/useCalendarVisible.js +1 -1
- package/__internal__/src/components/DatePicker/useCalendarVisible.js.map +1 -1
- package/__internal__/src/components/TextField/TextField.js +1 -1
- package/__internal__/src/components/TextField/TextField.js.map +1 -1
- package/__internal__/src/components/UserSelect/UserSelectItem/UserSelectItem.css +1 -1
- package/__internal__/src/components/UserSelect/UserSelectItem/UserSelectItem.js +1 -1
- package/__internal__/src/components/UserSelect/UserSelectItem/UserSelectItem.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
.Badge{align-items:center;box-sizing:border-box;display:inline-flex;flex-wrap:nowrap;font-size:var(--badge-text-size);font-weight:var(--font-weight-text-semibold);gap:var(--space-2xs);height:var(--badge-size);letter-spacing:.05em;line-height:var(--badge-size);position:relative;text-decoration:none;text-transform:uppercase;white-space:nowrap}.Badge_size_xs
|
|
1
|
+
.Badge{align-items:center;box-sizing:border-box;display:inline-flex;flex-wrap:nowrap;font-size:var(--badge-text-size);font-weight:var(--font-weight-text-semibold);gap:var(--space-2xs);height:var(--badge-size);letter-spacing:.05em;line-height:var(--badge-size);position:relative;text-decoration:none;text-transform:uppercase;white-space:nowrap}.Badge_size_xs{--badge-padding-round:var(--space-xs);--badge-padding-default:var(--space-2xs);--badge-size:var(--control-box-size-m);--badge-text-size:calc(var(--size-text-m)/2);--badge-border-size:2px;--badge-size-minified:10px}.Badge_size_s{--badge-padding-round:var(--space-xs);--badge-padding-default:var(--space-2xs);--badge-size:var(--control-box-size-l);--badge-text-size:var(--size-text-2xs);--badge-size-minified:16px;--badge-border-size:3px}.Badge_size_m{--badge-padding-round:var(--space-s);--badge-padding-default:var(--space-xs);--badge-size:var(--control-height-xs);--badge-text-size:var(--size-text-xs);--badge-size-minified:24px;--badge-border-size:4px}.Badge_size_l{--badge-padding-round:var(--space-m);--badge-padding-default:var(--space-xs);--badge-size:var(--control-height-s);--badge-text-size:var(--size-text-s);--badge-size-minified:32px;--badge-border-size:5px}.Badge:not(.Badge_counter.Badge_minified).Badge_form_round{padding:0 var(--badge-padding-round)}.Badge:not(.Badge_counter.Badge_minified).Badge_form_default{padding:0 var(--badge-padding-default)}.Badge_form_default{border-radius:var(--control-radius)}.Badge_form_round{border-radius:99em}.Badge_status_success{--badge-bg-color:var(--color-bg-success);--badge-text-color:var(--color-typo-success);--badge-border-color:var(--color-bg-success)}.Badge_status_error{--badge-bg-color:var(--color-bg-alert);--badge-text-color:var(--color-typo-alert);--badge-border-color:var(--color-bg-alert)}.Badge_status_warning{--badge-bg-color:var(--color-bg-warning);--badge-text-color:var(--color-typo-warning);--badge-border-color:var(--color-bg-warning)}.Badge_status_normal{--badge-bg-color:var(--color-bg-normal);--badge-text-color:var(--color-typo-normal);--badge-border-color:var(--color-bg-normal)}.Badge_status_system{--badge-bg-color:var(--color-bg-system);--badge-border-color:var(--color-bg-system)}.Badge_view_filled{background:var(--badge-bg-color);color:var(--color-typo-primary)}.Badge_view_filled.Badge_status_system{color:var(--color-typo-secondary)}.Badge_view_stroked{box-shadow:inset 0 0 0 1px var(--badge-border-color);color:var(--badge-text-color)}.Badge_view_stroked.Badge_status_system{--badge-text-color:var(--color-typo-system)}.Badge_counter{justify-content:center;padding:0;text-align:center;width:var(--badge-size)}.Badge_minified{background:transparent;border:var(--badge-border-size) solid transparent;border-radius:50%;box-shadow:inset 0 0 0 var(--badge-size) var(--badge-bg-color);height:var(--badge-size);line-height:var(--badge-size-minified);padding:0;width:var(--badge-size-minified)}.Badge-Icon{flex-shrink:0;font-size:0;line-height:1em}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import _defineProperty from"@babel/runtime/helpers/defineProperty";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["size","view","status","form","icon","iconLeft","iconRight","minified","label","as","title"];function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import"./Badge.css";import{classnames}from"@bem-react/classnames";import React from"react";import{cn}from"../../utils/bem";import{forwardRefWithAs}from"../../utils/types/PropsWithAsAttributes";import{useTheme}from"../Theme/Theme";export var badgePropSize=["xs","s","m","l"];export var badgePropSizeDefault="m";export var badgePropView=["filled","stroked"];export var badgePropViewDefault=badgePropView[0];export var badgePropStatus=["normal","success","error","warning","system"];export var badgePropStatusDefault=badgePropStatus[0];export var badgePropForm=["default","round"];export var badgePropFormDefault=badgePropForm[0];export var cnBadge=cn("Badge");var renderIcon=function(a){return a?React.createElement(a,{size:"xs",className:cnBadge("Icon")}):null};export var Badge=forwardRefWithAs(function(a,b){var c=a.size,d=void 0===c?badgePropSizeDefault:c,e=a.view,f=void 0===e?badgePropViewDefault:e,g=a.status,h=void 0===g?badgePropStatusDefault:g,i=a.form,j=void 0===i?badgePropFormDefault:i,k=a.icon,l=a.iconLeft,m=a.iconRight,n=a.minified,o=a.label,p=a.as,q=void 0===p?"div":p,r=a.title,s=_objectWithoutProperties(a,_excluded),t=useTheme(),u=t.themeClassNames,v="system"!==h&&"filled"===f?classnames(a.className,u.color.accent):a.className,w=null!==l&&void 0!==l?l:k,x=1===[k,l,m,o].filter(
|
|
1
|
+
import _defineProperty from"@babel/runtime/helpers/defineProperty";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["size","view","status","form","icon","iconLeft","iconRight","minified","label","as","title"];function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import"./Badge.css";import{classnames}from"@bem-react/classnames";import React from"react";import{cn}from"../../utils/bem";import{forwardRefWithAs}from"../../utils/types/PropsWithAsAttributes";import{useTheme}from"../Theme/Theme";export var badgePropSize=["xs","s","m","l"];export var badgePropSizeDefault="m";export var badgePropView=["filled","stroked"];export var badgePropViewDefault=badgePropView[0];export var badgePropStatus=["normal","success","error","warning","system"];export var badgePropStatusDefault=badgePropStatus[0];export var badgePropForm=["default","round"];export var badgePropFormDefault=badgePropForm[0];export var cnBadge=cn("Badge");var renderIcon=function(a){return a?React.createElement(a,{size:"xs",className:cnBadge("Icon")}):null};export var Badge=forwardRefWithAs(function(a,b){var c=a.size,d=void 0===c?badgePropSizeDefault:c,e=a.view,f=void 0===e?badgePropViewDefault:e,g=a.status,h=void 0===g?badgePropStatusDefault:g,i=a.form,j=void 0===i?badgePropFormDefault:i,k=a.icon,l=a.iconLeft,m=a.iconRight,n=a.minified,o=a.label,p=a.as,q=void 0===p?"div":p,r=a.title,s=_objectWithoutProperties(a,_excluded),t=useTheme(),u=t.themeClassNames,v="system"!==h&&"filled"===f?classnames(a.className,u.color.accent):a.className,w=null!==l&&void 0!==l?l:k,x=1===[k,l,m,o].filter(Boolean).length&&1>=((null===o||void 0===o?void 0:o.length)||0);return React.createElement(q,Object.assign({},s,{className:cnBadge(_objectSpread({size:d,status:h,minified:n},!n&&{view:f,form:j,counter:x}),[v]),ref:b,title:r||n&&o}),!n&&React.createElement(React.Fragment,null,renderIcon(w),o,renderIcon(m)))});
|
|
2
2
|
//# sourceMappingURL=Badge.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Badge.js","names":["classnames","React","cn","forwardRefWithAs","useTheme","badgePropSize","badgePropSizeDefault","badgePropView","badgePropViewDefault","badgePropStatus","badgePropStatusDefault","badgePropForm","badgePropFormDefault","cnBadge","renderIcon","Icon","Badge","props","ref","size","view","status","form","icon","iconLeft","IconRight","iconRight","minified","label","as","title","otherProps","themeClassNames","className","color","accent","IconLeft","counter","filter","
|
|
1
|
+
{"version":3,"file":"Badge.js","names":["classnames","React","cn","forwardRefWithAs","useTheme","badgePropSize","badgePropSizeDefault","badgePropView","badgePropViewDefault","badgePropStatus","badgePropStatusDefault","badgePropForm","badgePropFormDefault","cnBadge","renderIcon","Icon","Badge","props","ref","size","view","status","form","icon","iconLeft","IconRight","iconRight","minified","label","as","title","otherProps","themeClassNames","className","color","accent","IconLeft","counter","filter","Boolean","length"],"sources":["../../../../../src/components/Badge/Badge.tsx"],"sourcesContent":["import './Badge.css';\n\nimport { classnames } from '@bem-react/classnames';\nimport { IconComponent } from '@consta/icons/Icon';\nimport React from 'react';\n\nimport { cn } from '../../utils/bem';\nimport { forwardRefWithAs } from '../../utils/types/PropsWithAsAttributes';\nimport { useTheme } from '../Theme/Theme';\n\nexport const badgePropSize = ['xs', 's', 'm', 'l'] as const;\nexport type BadgePropSize = typeof badgePropSize[number];\nexport const badgePropSizeDefault: BadgePropSize = 'm';\n\nexport const badgePropView = ['filled', 'stroked'] as const;\nexport type BadgePropView = typeof badgePropView[number];\nexport const badgePropViewDefault: BadgePropView = badgePropView[0];\n\nexport const badgePropStatus = [\n 'normal',\n 'success',\n 'error',\n 'warning',\n 'system',\n] as const;\nexport type BadgePropStatus = typeof badgePropStatus[number];\nexport const badgePropStatusDefault: BadgePropStatus = badgePropStatus[0];\n\nexport const badgePropForm = ['default', 'round'] as const;\nexport type BadgePropForm = typeof badgePropForm[number];\nexport const badgePropFormDefault: BadgePropForm = badgePropForm[0];\n\ntype Props = {\n size?: BadgePropSize;\n view?: BadgePropView;\n status?: BadgePropStatus;\n form?: BadgePropForm;\n minified?: boolean;\n /**\n * @deprecated since version 4.17.2 iconLeft\n */\n icon?: IconComponent;\n iconLeft?: IconComponent;\n iconRight?: IconComponent;\n label?: string;\n children?: never;\n};\n\nexport const cnBadge = cn('Badge');\n\nconst renderIcon = (Icon: IconComponent | undefined) =>\n Icon ? <Icon size=\"xs\" className={cnBadge('Icon')} /> : null;\n\nexport const Badge = forwardRefWithAs<Props>((props, ref) => {\n const {\n size = badgePropSizeDefault,\n view = badgePropViewDefault,\n status = badgePropStatusDefault,\n form = badgePropFormDefault,\n icon,\n iconLeft,\n iconRight: IconRight,\n minified,\n label,\n as = 'div',\n title,\n ...otherProps\n } = props;\n\n const Tag = as as string;\n const { themeClassNames } = useTheme();\n\n const className =\n status !== 'system' && view === 'filled'\n ? classnames(props.className, themeClassNames.color.accent)\n : props.className;\n const IconLeft = iconLeft ?? icon;\n const counter =\n [icon, iconLeft, IconRight, label].filter(Boolean).length === 1 &&\n (label?.length || 0) <= 1;\n\n return (\n <Tag\n {...otherProps}\n className={cnBadge(\n {\n size,\n status,\n minified,\n ...(!minified && {\n view,\n form,\n counter,\n }),\n },\n [className],\n )}\n ref={ref}\n title={title || (minified && label)}\n >\n {!minified && (\n <>\n {renderIcon(IconLeft)}\n {label}\n {renderIcon(IconRight)}\n </>\n )}\n </Tag>\n );\n});\n"],"mappings":"s2BAAA,oBAEA,OAASA,UAAT,KAA2B,uBAA3B,CAEA,MAAOC,MAAP,KAAkB,OAAlB,CAEA,OAASC,EAAT,uBACA,OAASC,gBAAT,+CACA,OAASC,QAAT,sBAEA,MAAO,IAAMC,cAAa,CAAG,CAAC,IAAD,CAAO,GAAP,CAAY,GAAZ,CAAiB,GAAjB,CAAtB,CAEP,MAAO,IAAMC,qBAAmC,CAAG,GAA5C,CAEP,MAAO,IAAMC,cAAa,CAAG,CAAC,QAAD,CAAW,SAAX,CAAtB,CAEP,MAAO,IAAMC,qBAAmC,CAAGD,aAAa,CAAC,CAAD,CAAzD,CAEP,MAAO,IAAME,gBAAe,CAAG,CAC7B,QAD6B,CAE7B,SAF6B,CAG7B,OAH6B,CAI7B,SAJ6B,CAK7B,QAL6B,CAAxB,CAQP,MAAO,IAAMC,uBAAuC,CAAGD,eAAe,CAAC,CAAD,CAA/D,CAEP,MAAO,IAAME,cAAa,CAAG,CAAC,SAAD,CAAY,OAAZ,CAAtB,CAEP,MAAO,IAAMC,qBAAmC,CAAGD,aAAa,CAAC,CAAD,CAAzD,CAkBP,MAAO,IAAME,QAAO,CAAGX,EAAE,CAAC,OAAD,CAAlB,CAEP,GAAMY,WAAU,CAAG,SAACC,CAAD,QACjBA,EAAI,CAAG,oBAAC,CAAD,EAAM,IAAI,CAAC,IAAX,CAAgB,SAAS,CAAEF,OAAO,CAAC,MAAD,CAAlC,EAAH,CAAoD,IADvC,CAAnB,CAGA,MAAO,IAAMG,MAAK,CAAGb,gBAAgB,CAAQ,SAACc,CAAD,CAAQC,CAAR,CAAgB,OAcvDD,CAduD,CAEzDE,IAFyD,CAEzDA,CAFyD,YAElDb,oBAFkD,KAcvDW,CAduD,CAGzDG,IAHyD,CAGzDA,CAHyD,YAGlDZ,oBAHkD,KAcvDS,CAduD,CAIzDI,MAJyD,CAIzDA,CAJyD,YAIhDX,sBAJgD,KAcvDO,CAduD,CAKzDK,IALyD,CAKzDA,CALyD,YAKlDV,oBALkD,GAMzDW,CANyD,CAcvDN,CAduD,CAMzDM,IANyD,CAOzDC,CAPyD,CAcvDP,CAduD,CAOzDO,QAPyD,CAQ9CC,CAR8C,CAcvDR,CAduD,CAQzDS,SARyD,CASzDC,CATyD,CAcvDV,CAduD,CASzDU,QATyD,CAUzDC,CAVyD,CAcvDX,CAduD,CAUzDW,KAVyD,GAcvDX,CAduD,CAWzDY,EAXyD,CAWzDA,CAXyD,YAWpD,KAXoD,GAYzDC,CAZyD,CAcvDb,CAduD,CAYzDa,KAZyD,CAatDC,CAbsD,0BAcvDd,CAduD,cAiB/Bb,QAAQ,EAjBuB,CAiBnD4B,CAjBmD,GAiBnDA,eAjBmD,CAmBrDC,CAAS,CACF,QAAX,GAAAZ,CAAM,EAA0B,QAAT,GAAAD,CAAvB,CACIpB,UAAU,CAACiB,CAAK,CAACgB,SAAP,CAAkBD,CAAe,CAACE,KAAhB,CAAsBC,MAAxC,CADd,CAEIlB,CAAK,CAACgB,SAtB+C,CAuBrDG,CAAQ,QAAGZ,CAAH,WAAGA,CAAH,CAAGA,CAAH,CAAeD,CAvB8B,CAwBrDc,CAAO,CACmD,CAA9D,IAACd,CAAD,CAAOC,CAAP,CAAiBC,CAAjB,CAA4BG,CAA5B,EAAmCU,MAAnC,CAA0CC,OAA1C,EAAmDC,MAAnD,EACwB,CAAxB,GAAC,QAAAZ,CAAK,WAALA,CAAA,QAAAA,CAAK,CAAEY,MAAP,GAAiB,CAAlB,CA1ByD,CA4B3D,MACE,qBAbUX,CAaV,kBACME,CADN,EAEE,SAAS,CAAElB,OAAO,gBAEdM,IAAI,CAAJA,CAFc,CAGdE,MAAM,CAANA,CAHc,CAIdM,QAAQ,CAARA,CAJc,EAKV,CAACA,CAAD,EAAa,CACfP,IAAI,CAAJA,CADe,CAEfE,IAAI,CAAJA,CAFe,CAGfe,OAAO,CAAPA,CAHe,CALH,EAWhB,CAACJ,CAAD,CAXgB,CAFpB,CAeE,GAAG,CAAEf,CAfP,CAgBE,KAAK,CAAEY,CAAK,EAAKH,CAAQ,EAAIC,CAhB/B,GAkBG,CAACD,CAAD,EACC,wCACGb,UAAU,CAACsB,CAAD,CADb,CAEGR,CAFH,CAGGd,UAAU,CAACW,CAAD,CAHb,CAnBJ,CA2BH,CAxDoC,CAA9B"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import{useEffect,
|
|
1
|
+
import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import{useEffect,useRef}from"react";import{useFlag}from"../../hooks/useFlag";import{useKeysRef}from"../../hooks/useKeysRef";var useFlagWithDisabled=function(){var a=!!(0<arguments.length&&void 0!==arguments[0])&&arguments[0],b=1<arguments.length?arguments[1]:void 0,c=useFlag(a),d=_slicedToArray(c,2),e=d[0],f=d[1];return useEffect(function(){b&&f.off()},[b]),[e,{on:function on(){b||f.on()},off:function off(){return f.off()},toggle:function toggle(){b||f.toggle()},set:function set(a){b||f.set(a)}}]};export var useCalendarVisible=function(a){var b=a.onDropdownOpen,c=a.dropdownOpen,d=a.disabled,e=a.startRef,f=a.endRef,g=useFlagWithDisabled(!1,d),h=_slicedToArray(g,2),i=h[0],j=h[1],k=useRef(!0),l=function(a){a.preventDefault(),j.on()},m={ArrowUp:l,ArrowDown:l,PageUp:l,PageDown:l,Home:l,End:l,Enter:function Enter(){d||j.on()},Escape:function Escape(){j.off()},Tab:function Tab(a){i&&(a.preventDefault(),j.off())}},n=function(a){var b=a.key;"Tab"!==b&&"Escape"!==b&&j.on()};return useKeysRef({ref:e,keys:m,eventHandler:n,isActive:!d}),useKeysRef({ref:f,keys:m,eventHandler:n,isActive:!d}),useEffect(function(){return function(){k.current=!0}},[]),useEffect(function(){return k.current?void(k.current=!1):void(!d&&(null===b||void 0===b?void 0:b(i)))},[i]),useEffect(function(){d||j.set(null!==c&&void 0!==c&&c)},[c]),[i,j]};
|
|
2
2
|
//# sourceMappingURL=useCalendarVisible.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useCalendarVisible.js","names":["useEffect","
|
|
1
|
+
{"version":3,"file":"useCalendarVisible.js","names":["useEffect","useRef","useFlag","useKeysRef","useFlagWithDisabled","initial","disabled","state","setState","off","on","toggle","set","action","useCalendarVisible","params","onDropdownOpen","dropdownOpen","startRef","endRef","calendarVisible","setCalendarVisible","isFirstRender","ArrowHandler","e","preventDefault","keys","ArrowUp","ArrowDown","PageUp","PageDown","Home","End","Enter","Escape","Tab","eventHandler","key","ref","isActive","current"],"sources":["../../../../../src/components/DatePicker/useCalendarVisible.ts"],"sourcesContent":["import React, { useEffect, useRef } from 'react';\n\nimport { Flag, useFlag } from '##/hooks/useFlag';\nimport { KeyHandlers, useKeysRef } from '##/hooks/useKeysRef';\n\ntype UseCalendarVisibleParams = {\n onDropdownOpen?: (isOpen: boolean) => void;\n dropdownOpen?: boolean;\n disabled?: boolean;\n startRef: React.RefObject<HTMLInputElement>;\n endRef?: React.RefObject<HTMLInputElement>;\n};\ntype UseFlagReturn = ReturnType<typeof useFlagWithDisabled>;\ntype Return = [UseFlagReturn[0], UseFlagReturn[1]];\n\nconst useFlagWithDisabled = (initial = false, disabled?: boolean): Flag => {\n const [state, setState] = useFlag(initial);\n\n useEffect(() => {\n disabled && setState.off();\n }, [disabled]);\n\n return [\n state,\n {\n on: () => {\n !disabled && setState.on();\n },\n off: () => setState.off(),\n toggle: () => {\n !disabled && setState.toggle();\n },\n set: (action) => {\n !disabled && setState.set(action);\n },\n },\n ];\n};\n\nexport const useCalendarVisible = (\n params: UseCalendarVisibleParams,\n): Return => {\n const { onDropdownOpen, dropdownOpen, disabled, startRef, endRef } = params;\n\n const [calendarVisible, setCalendarVisible] = useFlagWithDisabled(\n false,\n disabled,\n );\n const isFirstRender = useRef(true);\n\n const ArrowHandler = (e: KeyboardEvent) => {\n e.preventDefault();\n setCalendarVisible.on();\n };\n\n const Escape = () => {\n setCalendarVisible.off();\n };\n\n const Enter = () => {\n !disabled && setCalendarVisible.on();\n };\n\n const Tab = (e: KeyboardEvent) => {\n if (calendarVisible) {\n e.preventDefault();\n setCalendarVisible.off();\n }\n };\n\n const keys: KeyHandlers = {\n ArrowUp: ArrowHandler,\n ArrowDown: ArrowHandler,\n PageUp: ArrowHandler,\n PageDown: ArrowHandler,\n Home: ArrowHandler,\n End: ArrowHandler,\n Enter,\n Escape,\n Tab,\n };\n\n const eventHandler = (e: KeyboardEvent) => {\n const { key } = e;\n if (key !== 'Tab' && key !== 'Escape') {\n setCalendarVisible.on();\n }\n };\n\n useKeysRef({ ref: startRef, keys, eventHandler, isActive: !disabled });\n useKeysRef({ ref: endRef, keys, eventHandler, isActive: !disabled });\n\n useEffect(() => {\n return () => {\n isFirstRender.current = true;\n };\n }, []);\n\n useEffect(() => {\n if (isFirstRender.current) {\n isFirstRender.current = false;\n return;\n }\n !disabled && onDropdownOpen?.(calendarVisible);\n }, [calendarVisible]);\n\n useEffect(() => {\n !disabled && setCalendarVisible.set(dropdownOpen ?? false);\n }, [dropdownOpen]);\n\n return [calendarVisible, setCalendarVisible];\n};\n"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["className","type","value","defaultValue","onChange","id","name","rows","cols","minRows","maxRows","inputRef","maxLength","disabled","size","view","form","state","status","onBlur","onFocus","autoFocus","placeholder","leftSide","rightSide","autoComplete","withClearButton","incrementButtons","max","min","readOnly","required","step","tabIndex","ariaLabel","label","labelIcon","inputContainerRef","labelPosition","caption","iconSize","focused","onClick","onKeyDown","onKeyDownCapture","onKeyPress","onKeyPressCapture","onKeyUp","onKeyUpCapture","onClear"];import"./TextField.css";import{IconClear}from"@consta/icons/IconClear";import{IconEye}from"@consta/icons/IconEye";import{IconEyeClose}from"@consta/icons/IconEyeClose";import{IconSelect}from"@consta/icons/IconSelect";import React,{forwardRef,useCallback,useEffect}from"react";import TextAreaAutoSize from"react-textarea-autosize";import{usePropsHandler}from"../EventInterceptor/usePropsHandler";import{FieldCaption}from"../FieldCaption/FieldCaption";import{FieldLabel}from"../FieldLabel/FieldLabel";import{useFlag}from"../../hooks/useFlag/useFlag";import{useForkRef}from"../../hooks/useForkRef/useForkRef";import{useMutableRef}from"../../hooks/useMutableRef/useMutableRef";import{useSortSteps}from"../../hooks/useSortSteps/useSortSteps";import{cn}from"../../utils/bem";import{getByMap}from"../../utils/getByMap";import{isString}from"../../utils/type-guards";import{getIncrementFlag,getTypeForRender,getValueByStep,inputValue,sizeMap}from"./helpers";import{textFieldPropFormDefault,textFieldPropSizeDefault,textFieldPropViewDefault}from"./types";export var COMPONENT_NAME="TextField";export var cnTextField=cn("TextField");export var TextFieldRender=function(a,b){var c,d,e=React.useRef(null),f=React.useRef(null),g=usePropsHandler(COMPONENT_NAME,a,e),h=g.className,i=g.type,j=void 0===i?"text":i,k=g.value,l=g.defaultValue,m=g.onChange,n=g.id,o=g.name,p=g.rows,q=g.cols,r=g.minRows,s=g.maxRows,t=g.inputRef,u=g.maxLength,v=g.disabled,w=g.size,x=void 0===w?textFieldPropSizeDefault:w,y=g.view,z=void 0===y?textFieldPropViewDefault:y,A=g.form,B=void 0===A?textFieldPropFormDefault:A,C=g.state,D=g.status,E=g.onBlur,F=g.onFocus,G=g.autoFocus,H=void 0!==G&&G,I=g.placeholder,J=g.leftSide,K=g.rightSide,L=g.autoComplete,M=g.withClearButton,N=g.incrementButtons,O=g.max,P=g.min,Q=g.readOnly,R=g.required,S=g.step,T=void 0===S?1:S,U=g.tabIndex,V=g.ariaLabel,W=g.label,X=g.labelIcon,Y=g.inputContainerRef,Z=g.labelPosition,$=void 0===Z?"top":Z,_=g.caption,aa=g.iconSize,ba=g.focused,ca=g.onClick,da=g.onKeyDown,ea=g.onKeyDownCapture,fa=g.onKeyPress,ga=g.onKeyPressCapture,ha=g.onKeyUp,ia=g.onKeyUpCapture,ja=g.onClear,ka=_objectWithoutProperties(g,_excluded),la="number"===j&&(void 0===N||N),ma=useFlag(H),na=_slicedToArray(ma,2),oa=na[0],pa=na[1],qa=useFlag(),ra=_slicedToArray(qa,2),sa=ra[0],ta=ra[1],ua=useFlag(),va=_slicedToArray(ua,2),wa=va[0],xa=va[1],ya=useMutableRef(ca),za=useMutableRef(m),Aa=useCallback(function(a){var b;a.stopPropagation(),ta.toggle(),null===(b=f.current)||void 0===b?void 0:b.focus()},[]),Ba=J,Ca=K,Da=isString(J),Ea=isString(K),Fa=getByMap(sizeMap,x,aa),Ga=useSortSteps({step:T,min:+P,max:+O}),Ha=useCallback(function(a){var b;v||(null===(b=za.current)||void 0===b?void 0:b.call(za,a.target.value||null,{e:a,id:n,name:o})),a.target.value?xa.on():xa.off()},[n,o,v]),Ia=function(a){pa.on(),null===F||void 0===F?void 0:F(a)},Ja={className:cnTextField("Input"),value:inputValue(k),defaultValue:inputValue(l),onChange:Ha,maxLength:u,disabled:v,onBlur:function handleBlur(a){pa.off(),null===E||void 0===E?void 0:E(a)},onFocus:Ia,autoFocus:H,placeholder:I,autoComplete:L,readOnly:Q,tabIndex:U,name:o,onKeyDownCapture:ea,onKeyPress:fa,onKeyPressCapture:ga,onKeyUp:ha,onKeyUpCapture:ia,id:n?n.toString():void 0,"aria-label":V},Ka=sa?IconEyeClose:IconEye,La={rows:p,cols:q,minRows:r||p,maxRows:s||p,ref:useForkRef([f,t])},Ma={type:getTypeForRender(j,sa),max:O,min:P,step:Array.isArray(Ga)?0:Ga,onKeyDown:function onKeyDown(a){var b=getIncrementFlag(a);if(null===da||void 0===da?void 0:da(a),"number"===j&&"boolean"==typeof b&&!v){var c,d;a.preventDefault();var e=getValueByStep(Ga,null===(c=f.current)||void 0===c?void 0:c.value,b,P,O);null===(d=za.current)||void 0===d?void 0:d.call(za,e,{e:a,id:n,name:o}),f.current&&(f.current.value=e,xa.on())}},ref:useForkRef([f,t])},Na=useCallback(function(a){var b;null===(b=za.current)||void 0===b?void 0:b.call(za,null,{e:a,id:n,name:o}),f.current&&(f.current.value="",xa.off())},[]),Oa=function(a){var b,c,d=!(1<arguments.length&&void 0!==arguments[1])||arguments[1],e=getValueByStep(Ga,null===(b=f.current)||void 0===b?void 0:b.value,d,P,O);null===(c=za.current)||void 0===c?void 0:c.call(za,e,{e:a,id:n,name:o}),f.current&&(f.current.value=e,xa.on())},Pa={onClick:useCallback(function(a){var b,c;null===(b=f.current)||void 0===b?void 0:b.focus(),null===(c=ya.current)||void 0===c?void 0:c.call(ya,a)},[])};return useEffect(function(){var a;xa[null!==(a=f.current)&&void 0!==a&&a.value?"on":"off"]()},[null===(c=f.current)||void 0===c?void 0:c.value]),React.createElement("div",Object.assign({className:cnTextField({labelPosition:$,size:x,view:z},[h]),ref:useForkRef([b,e])},Pa,ka),W&&React.createElement(FieldLabel,{as:"label",htmlFor:null===n||void 0===n?void 0:n.toString(),icon:X,required:R,className:cnTextField("Label",{labelPosition:$}),size:x},W),React.createElement("div",{className:cnTextField("Body")},React.createElement("div",{ref:Y,className:cnTextField("InputContainer",{view:z,form:B,status:D||C,disabled:v,type:j,focus:oa||ba,withValue:wa,incrementButtons:"number"===j&&la})},Ba&&React.createElement("div",{className:cnTextField("Side",{position:"left",type:Da?"string":"icon"}),title:"string"==typeof J?J:void 0},Da?J:React.createElement(Ba,{className:cnTextField("Icon"),size:Fa})),"textarea"===j?React.createElement(TextAreaAutoSize,Object.assign({},Ja,La)):React.createElement("input",Object.assign({},Ja,Ma)),
|
|
1
|
+
import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["className","type","value","defaultValue","onChange","id","name","rows","cols","minRows","maxRows","inputRef","maxLength","disabled","size","view","form","state","status","onBlur","onFocus","autoFocus","placeholder","leftSide","rightSide","autoComplete","withClearButton","incrementButtons","max","min","readOnly","required","step","tabIndex","ariaLabel","label","labelIcon","inputContainerRef","labelPosition","caption","iconSize","focused","onClick","onKeyDown","onKeyDownCapture","onKeyPress","onKeyPressCapture","onKeyUp","onKeyUpCapture","onClear"];import"./TextField.css";import{IconClear}from"@consta/icons/IconClear";import{IconEye}from"@consta/icons/IconEye";import{IconEyeClose}from"@consta/icons/IconEyeClose";import{IconSelect}from"@consta/icons/IconSelect";import React,{forwardRef,useCallback,useEffect}from"react";import TextAreaAutoSize from"react-textarea-autosize";import{usePropsHandler}from"../EventInterceptor/usePropsHandler";import{FieldCaption}from"../FieldCaption/FieldCaption";import{FieldLabel}from"../FieldLabel/FieldLabel";import{useFlag}from"../../hooks/useFlag/useFlag";import{useForkRef}from"../../hooks/useForkRef/useForkRef";import{useMutableRef}from"../../hooks/useMutableRef/useMutableRef";import{useSortSteps}from"../../hooks/useSortSteps/useSortSteps";import{cn}from"../../utils/bem";import{getByMap}from"../../utils/getByMap";import{isString}from"../../utils/type-guards";import{getIncrementFlag,getTypeForRender,getValueByStep,inputValue,sizeMap}from"./helpers";import{textFieldPropFormDefault,textFieldPropSizeDefault,textFieldPropViewDefault}from"./types";export var COMPONENT_NAME="TextField";export var cnTextField=cn("TextField");export var TextFieldRender=function(a,b){var c,d,e=React.useRef(null),f=React.useRef(null),g=usePropsHandler(COMPONENT_NAME,a,e),h=g.className,i=g.type,j=void 0===i?"text":i,k=g.value,l=g.defaultValue,m=g.onChange,n=g.id,o=g.name,p=g.rows,q=g.cols,r=g.minRows,s=g.maxRows,t=g.inputRef,u=g.maxLength,v=g.disabled,w=g.size,x=void 0===w?textFieldPropSizeDefault:w,y=g.view,z=void 0===y?textFieldPropViewDefault:y,A=g.form,B=void 0===A?textFieldPropFormDefault:A,C=g.state,D=g.status,E=g.onBlur,F=g.onFocus,G=g.autoFocus,H=void 0!==G&&G,I=g.placeholder,J=g.leftSide,K=g.rightSide,L=g.autoComplete,M=g.withClearButton,N=g.incrementButtons,O=g.max,P=g.min,Q=g.readOnly,R=g.required,S=g.step,T=void 0===S?1:S,U=g.tabIndex,V=g.ariaLabel,W=g.label,X=g.labelIcon,Y=g.inputContainerRef,Z=g.labelPosition,$=void 0===Z?"top":Z,_=g.caption,aa=g.iconSize,ba=g.focused,ca=g.onClick,da=g.onKeyDown,ea=g.onKeyDownCapture,fa=g.onKeyPress,ga=g.onKeyPressCapture,ha=g.onKeyUp,ia=g.onKeyUpCapture,ja=g.onClear,ka=_objectWithoutProperties(g,_excluded),la="number"===j&&(void 0===N||N),ma=useFlag(H),na=_slicedToArray(ma,2),oa=na[0],pa=na[1],qa=useFlag(),ra=_slicedToArray(qa,2),sa=ra[0],ta=ra[1],ua=useFlag(),va=_slicedToArray(ua,2),wa=va[0],xa=va[1],ya=useMutableRef(ca),za=useMutableRef(m),Aa=useCallback(function(a){var b;a.stopPropagation(),ta.toggle(),null===(b=f.current)||void 0===b?void 0:b.focus()},[]),Ba=J,Ca=K,Da=isString(J),Ea=isString(K),Fa=getByMap(sizeMap,x,aa),Ga=useSortSteps({step:T,min:+P,max:+O}),Ha=useCallback(function(a){var b;v||(null===(b=za.current)||void 0===b?void 0:b.call(za,a.target.value||null,{e:a,id:n,name:o})),a.target.value?xa.on():xa.off()},[n,o,v]),Ia=function(a){pa.on(),null===F||void 0===F?void 0:F(a)},Ja={className:cnTextField("Input"),value:inputValue(k),defaultValue:inputValue(l),onChange:Ha,maxLength:u,disabled:v,onBlur:function handleBlur(a){pa.off(),null===E||void 0===E?void 0:E(a)},onFocus:Ia,autoFocus:H,placeholder:I,autoComplete:L,readOnly:Q,tabIndex:U,name:o,onKeyDownCapture:ea,onKeyPress:fa,onKeyPressCapture:ga,onKeyUp:ha,onKeyUpCapture:ia,id:n?n.toString():void 0,"aria-label":V},Ka=sa?IconEyeClose:IconEye,La={rows:p,cols:q,minRows:r||p,maxRows:s||p,ref:useForkRef([f,t])},Ma={type:getTypeForRender(j,sa),max:O,min:P,step:Array.isArray(Ga)?0:Ga,onKeyDown:function onKeyDown(a){var b=getIncrementFlag(a);if(null===da||void 0===da?void 0:da(a),"number"===j&&"boolean"==typeof b&&!v){var c,d;a.preventDefault();var e=getValueByStep(Ga,null===(c=f.current)||void 0===c?void 0:c.value,b,P,O);null===(d=za.current)||void 0===d?void 0:d.call(za,e,{e:a,id:n,name:o}),f.current&&(f.current.value=e,xa.on())}},ref:useForkRef([f,t])},Na=useCallback(function(a){var b;null===(b=za.current)||void 0===b?void 0:b.call(za,null,{e:a,id:n,name:o}),f.current&&(f.current.value="",xa.off())},[]),Oa=function(a){var b,c,d=!(1<arguments.length&&void 0!==arguments[1])||arguments[1],e=getValueByStep(Ga,null===(b=f.current)||void 0===b?void 0:b.value,d,P,O);null===(c=za.current)||void 0===c?void 0:c.call(za,e,{e:a,id:n,name:o}),f.current&&(f.current.value=e,xa.on())},Pa={onClick:useCallback(function(a){var b,c;null===(b=f.current)||void 0===b?void 0:b.focus(),null===(c=ya.current)||void 0===c?void 0:c.call(ya,a)},[])};return useEffect(function(){var a;xa[null!==(a=f.current)&&void 0!==a&&a.value?"on":"off"]()},[null===(c=f.current)||void 0===c?void 0:c.value]),React.createElement("div",Object.assign({className:cnTextField({labelPosition:$,size:x,view:z},[h]),ref:useForkRef([b,e])},Pa,ka),W&&React.createElement(FieldLabel,{as:"label",htmlFor:null===n||void 0===n?void 0:n.toString(),icon:X,required:R,className:cnTextField("Label",{labelPosition:$}),size:x},W),React.createElement("div",{className:cnTextField("Body")},React.createElement("div",{ref:Y,className:cnTextField("InputContainer",{view:z,form:B,status:D||C,disabled:v,type:j,focus:oa||ba,withValue:wa,incrementButtons:"number"===j&&la})},Ba&&React.createElement("div",{className:cnTextField("Side",{position:"left",type:Da?"string":"icon"}),title:"string"==typeof J?J:void 0},Da?J:React.createElement(Ba,{className:cnTextField("Icon"),size:Fa})),"textarea"===j?React.createElement(TextAreaAutoSize,Object.assign({},Ja,La)):React.createElement("input",Object.assign({},Ja,Ma)),la&&!v&&React.createElement("div",{className:cnTextField("Counter")},React.createElement("button",{className:cnTextField("CounterButton",{fn:"increment"}),onFocus:Ia,onClick:function(a){return Oa(a,!0)},type:"button"},React.createElement(IconSelect,{size:"xs"})),React.createElement("button",{className:cnTextField("CounterButton"),onFocus:Ia,onClick:function(a){return Oa(a,!1)},type:"button"},React.createElement(IconSelect,{size:"xs"}))),!la&&wa&&M&&!v&&React.createElement("button",{type:"button",disabled:v,tabIndex:-1,onClick:ja||Na,className:cnTextField("ClearButton")},React.createElement(IconClear,{size:sizeMap[x],className:cnTextField("ClearButtonIcon")})),"password"===j&&(null===(d=f.current)||void 0===d?void 0:d.value)&&React.createElement("button",{className:cnTextField("ClearButton"),type:"button",onClick:Aa},React.createElement(Ka,{className:cnTextField("Icon"),size:Fa})),Ca&&!la&&"password"!==j&&React.createElement("div",{className:cnTextField("Side",{position:"right",type:Ea?"string":"icon"}),title:"string"==typeof K?K:void 0},Ea?K:React.createElement(Ca,{className:cnTextField("Icon"),size:Fa}))),_&&React.createElement(FieldCaption,{className:cnTextField("Caption"),status:D||C},_)))};export var TextField=forwardRef(TextFieldRender);export*from"./types";
|
|
2
2
|
//# sourceMappingURL=TextField.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextField.js","names":["IconClear","IconEye","IconEyeClose","IconSelect","React","forwardRef","useCallback","useEffect","TextAreaAutoSize","usePropsHandler","FieldCaption","FieldLabel","useFlag","useForkRef","useMutableRef","useSortSteps","cn","getByMap","isString","getIncrementFlag","getTypeForRender","getValueByStep","inputValue","sizeMap","textFieldPropFormDefault","textFieldPropSizeDefault","textFieldPropViewDefault","COMPONENT_NAME","cnTextField","TextFieldRender","props","ref","textFieldRef","useRef","inputRef","className","type","value","defaultValue","onChange","id","name","rows","cols","minRows","maxRows","inputRefProp","maxLength","disabled","size","view","form","state","status","onBlur","onFocus","autoFocus","placeholder","leftSide","rightSide","autoComplete","withClearButton","incrementButtons","max","min","readOnly","required","step","tabIndex","ariaLabel","label","labelIcon","inputContainerRef","labelPosition","caption","iconSizeProp","iconSize","focused","onClick","onKeyDownProp","onKeyDown","onKeyDownCapture","onKeyPress","onKeyPressCapture","onKeyUp","onKeyUpCapture","onClear","otherProps","focus","setFocus","passwordVisible","setPasswordVisuble","withValue","setWithValue","onClickRef","onChangeRef","handleEyeClick","e","stopPropagation","toggle","current","LeftIcon","RightIcon","leftSideIsString","rightSideIsString","sortedSteps","handleChange","target","on","off","handleFocus","commonProps","handleBlur","toString","Eye","textareaProps","inputProps","Array","isArray","flag","preventDefault","newValue","handleClear","changeNumberValue","isIncrement","rootProps","position","fn","TextField"],"sources":["../../../../../src/components/TextField/TextField.tsx"],"sourcesContent":["import './TextField.css';\n\nimport { IconClear } from '@consta/icons/IconClear';\nimport { IconEye } from '@consta/icons/IconEye';\nimport { IconEyeClose } from '@consta/icons/IconEyeClose';\nimport { IconSelect } from '@consta/icons/IconSelect';\nimport React, { forwardRef, useCallback, useEffect } from 'react';\nimport TextAreaAutoSize from 'react-textarea-autosize';\n\nimport { usePropsHandler } from '##/components/EventInterceptor/usePropsHandler';\nimport { FieldCaption } from '##/components/FieldCaption/FieldCaption';\nimport { FieldLabel } from '##/components/FieldLabel/FieldLabel';\nimport { useFlag } from '##/hooks/useFlag/useFlag';\nimport { useForkRef } from '##/hooks/useForkRef/useForkRef';\nimport { useMutableRef } from '##/hooks/useMutableRef/useMutableRef';\nimport { useSortSteps } from '##/hooks/useSortSteps/useSortSteps';\nimport { cn } from '##/utils/bem';\nimport { getByMap } from '##/utils/getByMap';\nimport { isString } from '##/utils/type-guards';\n\nimport {\n getIncrementFlag,\n getTypeForRender,\n getValueByStep,\n inputValue,\n sizeMap,\n} from './helpers';\nimport {\n TextFieldComponent,\n textFieldPropFormDefault,\n TextFieldProps,\n textFieldPropSizeDefault,\n textFieldPropViewDefault,\n} from './types';\n\nexport const COMPONENT_NAME = 'TextField' as const;\nexport const cnTextField = cn(COMPONENT_NAME);\n\nexport const TextFieldRender = <TYPE extends string>(\n props: TextFieldProps<TYPE>,\n ref: React.Ref<HTMLDivElement>,\n) => {\n const textFieldRef = React.useRef<HTMLDivElement>(null);\n const inputRef = React.useRef<HTMLInputElement | HTMLTextAreaElement>(null);\n\n const {\n className,\n type = 'text',\n value,\n defaultValue,\n onChange,\n id,\n name,\n rows,\n cols,\n minRows,\n maxRows,\n inputRef: inputRefProp,\n maxLength,\n disabled,\n size = textFieldPropSizeDefault,\n view = textFieldPropViewDefault,\n form = textFieldPropFormDefault,\n state,\n status,\n onBlur,\n onFocus,\n autoFocus = false,\n placeholder,\n leftSide,\n rightSide,\n autoComplete,\n withClearButton,\n incrementButtons: incrementButtonsProp = true,\n max,\n min,\n readOnly,\n required,\n step = 1,\n tabIndex,\n ariaLabel,\n label,\n labelIcon,\n inputContainerRef,\n labelPosition = 'top',\n caption,\n iconSize: iconSizeProp,\n focused,\n onClick,\n // onkey props\n onKeyDown: onKeyDownProp,\n onKeyDownCapture,\n onKeyPress,\n onKeyPressCapture,\n onKeyUp,\n onKeyUpCapture,\n onClear,\n ...otherProps\n } = usePropsHandler(COMPONENT_NAME, props, textFieldRef);\n\n const incrementButtons = type === 'number' ? incrementButtonsProp : false;\n\n const [focus, setFocus] = useFlag(autoFocus);\n const [passwordVisible, setPasswordVisuble] = useFlag();\n const [withValue, setWithValue] = useFlag();\n\n const onClickRef = useMutableRef(onClick);\n const onChangeRef = useMutableRef(onChange);\n\n const handleEyeClick = useCallback(\n (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n e.stopPropagation();\n setPasswordVisuble.toggle();\n inputRef.current?.focus();\n },\n [],\n );\n\n const textarea = type === 'textarea';\n const LeftIcon = leftSide;\n const RightIcon = rightSide;\n const leftSideIsString = isString(leftSide);\n const rightSideIsString = isString(rightSide);\n const iconSize = getByMap(sizeMap, size, iconSizeProp);\n\n const sortedSteps = useSortSteps({\n step,\n min: Number(min),\n max: Number(max),\n });\n\n const handleChange: React.ChangeEventHandler<\n HTMLInputElement | HTMLTextAreaElement\n > = useCallback(\n (e) => {\n !disabled &&\n onChangeRef.current?.(e.target.value || null, {\n e,\n id,\n name,\n });\n\n if (e.target.value) {\n setWithValue.on();\n } else {\n setWithValue.off();\n }\n },\n [id, name, disabled],\n );\n\n const handleBlur: React.FocusEventHandler<HTMLElement> = (e) => {\n setFocus.off();\n onBlur?.(e);\n };\n\n const handleFocus: React.FocusEventHandler<HTMLElement> = (e) => {\n setFocus.on();\n onFocus?.(e);\n };\n\n const commonProps = {\n 'className': cnTextField('Input'),\n 'value': inputValue(value),\n 'defaultValue': inputValue(defaultValue),\n 'onChange': handleChange,\n maxLength,\n disabled,\n 'onBlur': handleBlur,\n 'onFocus': handleFocus,\n autoFocus,\n placeholder,\n autoComplete,\n readOnly,\n tabIndex,\n name,\n onKeyDownCapture,\n onKeyPress,\n onKeyPressCapture,\n onKeyUp,\n onKeyUpCapture,\n 'id': id ? id.toString() : undefined,\n 'aria-label': ariaLabel,\n };\n\n const Eye = passwordVisible ? IconEyeClose : IconEye;\n\n const onKeyDown = (e: React.KeyboardEvent) => {\n const flag = getIncrementFlag(e);\n onKeyDownProp?.(e);\n if (type === 'number' && typeof flag === 'boolean' && !disabled) {\n e.preventDefault();\n\n const newValue = getValueByStep(\n sortedSteps,\n inputRef.current?.value,\n flag,\n min,\n max,\n );\n\n onChangeRef.current?.(newValue, {\n e,\n id,\n name,\n });\n\n if (inputRef.current) {\n inputRef.current.value = newValue;\n setWithValue.on();\n }\n }\n };\n\n const textareaProps = {\n rows,\n cols,\n minRows: minRows || rows,\n maxRows: maxRows || rows,\n ref: useForkRef([inputRef, inputRefProp]) as (\n node: HTMLTextAreaElement,\n ) => void,\n };\n\n const inputProps = {\n type: getTypeForRender(type, passwordVisible),\n max,\n min,\n step: !Array.isArray(sortedSteps) ? sortedSteps : 0,\n onKeyDown,\n ref: useForkRef([\n inputRef,\n inputRefProp,\n ]) as React.RefCallback<HTMLInputElement>,\n };\n\n const handleClear = useCallback((e: React.MouseEvent<HTMLButtonElement>) => {\n onChangeRef.current?.(null, {\n e,\n id,\n name,\n });\n\n if (inputRef.current) {\n inputRef.current.value = '';\n setWithValue.off();\n }\n }, []);\n\n const changeNumberValue = (\n e: React.MouseEvent<HTMLButtonElement>,\n isIncrement = true,\n ) => {\n const newValue = getValueByStep(\n sortedSteps,\n inputRef.current?.value,\n isIncrement,\n min,\n max,\n );\n onChangeRef.current?.(newValue, {\n e,\n id,\n name,\n });\n if (inputRef.current) {\n inputRef.current.value = newValue;\n setWithValue.on();\n }\n };\n\n const rootProps = {\n onClick: useCallback((e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n inputRef.current?.focus();\n onClickRef.current?.(e);\n }, []),\n };\n\n useEffect(() => {\n setWithValue[inputRef.current?.value ? 'on' : 'off']();\n }, [inputRef.current?.value]);\n\n return (\n <div\n className={cnTextField({ labelPosition, size, view }, [className])}\n ref={useForkRef([ref, textFieldRef])}\n {...rootProps}\n {...otherProps}\n >\n {label && (\n <FieldLabel\n as=\"label\"\n htmlFor={id?.toString()}\n icon={labelIcon}\n required={required}\n className={cnTextField('Label', { labelPosition })}\n size={size}\n >\n {label}\n </FieldLabel>\n )}\n <div className={cnTextField('Body')}>\n <div\n ref={inputContainerRef}\n className={cnTextField('InputContainer', {\n view,\n form,\n status: status || state,\n disabled,\n type,\n focus: focus || focused,\n withValue,\n incrementButtons: type === 'number' && incrementButtons,\n })}\n >\n {LeftIcon && (\n <div\n className={cnTextField('Side', {\n position: 'left',\n type: leftSideIsString ? 'string' : 'icon',\n })}\n title={typeof leftSide === 'string' ? leftSide : undefined}\n >\n {leftSideIsString ? (\n leftSide\n ) : (\n <LeftIcon className={cnTextField('Icon')} size={iconSize} />\n )}\n </div>\n )}\n {textarea ? (\n <TextAreaAutoSize {...commonProps} {...textareaProps} />\n ) : (\n <input {...commonProps} {...inputProps} />\n )}\n\n {type === 'number' && incrementButtons && !disabled && (\n <div className={cnTextField('Counter')}>\n <button\n onFocus={handleFocus}\n onClick={(e) => changeNumberValue(e, true)}\n type=\"button\"\n className={cnTextField('CounterButton', { fn: 'increment' })}\n >\n <IconSelect size=\"xs\" />\n </button>\n <button\n onFocus={handleFocus}\n onClick={(e) => changeNumberValue(e, false)}\n type=\"button\"\n className={cnTextField('CounterButton')}\n >\n <IconSelect size=\"xs\" />\n </button>\n </div>\n )}\n\n {!incrementButtons &&\n withValue &&\n withClearButton &&\n !disabled &&\n type !== 'number' && (\n <button\n type=\"button\"\n disabled={disabled}\n tabIndex={-1}\n onClick={onClear || handleClear}\n className={cnTextField('ClearButton')}\n >\n <IconClear\n size={sizeMap[size]}\n className={cnTextField('ClearButtonIcon')}\n />\n </button>\n )}\n\n {type === 'password' && inputRef.current?.value && (\n <button\n className={cnTextField('ClearButton')}\n type=\"button\"\n onClick={handleEyeClick}\n >\n <Eye className={cnTextField('Icon')} size={iconSize} />\n </button>\n )}\n\n {RightIcon && !incrementButtons && type !== 'password' && (\n <div\n className={cnTextField('Side', {\n position: 'right',\n type: rightSideIsString ? 'string' : 'icon',\n })}\n title={typeof rightSide === 'string' ? rightSide : undefined}\n >\n {rightSideIsString ? (\n rightSide\n ) : (\n <RightIcon className={cnTextField('Icon')} size={iconSize} />\n )}\n </div>\n )}\n </div>\n {caption && (\n <FieldCaption\n className={cnTextField('Caption')}\n status={status || state}\n >\n {caption}\n </FieldCaption>\n )}\n </div>\n </div>\n );\n};\n\nexport const TextField = forwardRef(TextFieldRender) as TextFieldComponent;\nexport * from './types';\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"TextField.js","names":["IconClear","IconEye","IconEyeClose","IconSelect","React","forwardRef","useCallback","useEffect","TextAreaAutoSize","usePropsHandler","FieldCaption","FieldLabel","useFlag","useForkRef","useMutableRef","useSortSteps","cn","getByMap","isString","getIncrementFlag","getTypeForRender","getValueByStep","inputValue","sizeMap","textFieldPropFormDefault","textFieldPropSizeDefault","textFieldPropViewDefault","COMPONENT_NAME","cnTextField","TextFieldRender","props","ref","textFieldRef","useRef","inputRef","className","type","value","defaultValue","onChange","id","name","rows","cols","minRows","maxRows","inputRefProp","maxLength","disabled","size","view","form","state","status","onBlur","onFocus","autoFocus","placeholder","leftSide","rightSide","autoComplete","withClearButton","incrementButtons","max","min","readOnly","required","step","tabIndex","ariaLabel","label","labelIcon","inputContainerRef","labelPosition","caption","iconSizeProp","iconSize","focused","onClick","onKeyDownProp","onKeyDown","onKeyDownCapture","onKeyPress","onKeyPressCapture","onKeyUp","onKeyUpCapture","onClear","otherProps","focus","setFocus","passwordVisible","setPasswordVisuble","withValue","setWithValue","onClickRef","onChangeRef","handleEyeClick","e","stopPropagation","toggle","current","LeftIcon","RightIcon","leftSideIsString","rightSideIsString","sortedSteps","handleChange","target","on","off","handleFocus","commonProps","handleBlur","toString","Eye","textareaProps","inputProps","Array","isArray","flag","preventDefault","newValue","handleClear","changeNumberValue","isIncrement","rootProps","position","fn","TextField"],"sources":["../../../../../src/components/TextField/TextField.tsx"],"sourcesContent":["import './TextField.css';\n\nimport { IconClear } from '@consta/icons/IconClear';\nimport { IconEye } from '@consta/icons/IconEye';\nimport { IconEyeClose } from '@consta/icons/IconEyeClose';\nimport { IconSelect } from '@consta/icons/IconSelect';\nimport React, { forwardRef, useCallback, useEffect } from 'react';\nimport TextAreaAutoSize from 'react-textarea-autosize';\n\nimport { usePropsHandler } from '##/components/EventInterceptor/usePropsHandler';\nimport { FieldCaption } from '##/components/FieldCaption/FieldCaption';\nimport { FieldLabel } from '##/components/FieldLabel/FieldLabel';\nimport { useFlag } from '##/hooks/useFlag/useFlag';\nimport { useForkRef } from '##/hooks/useForkRef/useForkRef';\nimport { useMutableRef } from '##/hooks/useMutableRef/useMutableRef';\nimport { useSortSteps } from '##/hooks/useSortSteps/useSortSteps';\nimport { cn } from '##/utils/bem';\nimport { getByMap } from '##/utils/getByMap';\nimport { isString } from '##/utils/type-guards';\n\nimport {\n getIncrementFlag,\n getTypeForRender,\n getValueByStep,\n inputValue,\n sizeMap,\n} from './helpers';\nimport {\n TextFieldComponent,\n textFieldPropFormDefault,\n TextFieldProps,\n textFieldPropSizeDefault,\n textFieldPropViewDefault,\n} from './types';\n\nexport const COMPONENT_NAME = 'TextField' as const;\nexport const cnTextField = cn(COMPONENT_NAME);\n\nexport const TextFieldRender = <TYPE extends string>(\n props: TextFieldProps<TYPE>,\n ref: React.Ref<HTMLDivElement>,\n) => {\n const textFieldRef = React.useRef<HTMLDivElement>(null);\n const inputRef = React.useRef<HTMLInputElement | HTMLTextAreaElement>(null);\n\n const {\n className,\n type = 'text',\n value,\n defaultValue,\n onChange,\n id,\n name,\n rows,\n cols,\n minRows,\n maxRows,\n inputRef: inputRefProp,\n maxLength,\n disabled,\n size = textFieldPropSizeDefault,\n view = textFieldPropViewDefault,\n form = textFieldPropFormDefault,\n state,\n status,\n onBlur,\n onFocus,\n autoFocus = false,\n placeholder,\n leftSide,\n rightSide,\n autoComplete,\n withClearButton,\n incrementButtons: incrementButtonsProp = true,\n max,\n min,\n readOnly,\n required,\n step = 1,\n tabIndex,\n ariaLabel,\n label,\n labelIcon,\n inputContainerRef,\n labelPosition = 'top',\n caption,\n iconSize: iconSizeProp,\n focused,\n onClick,\n // onkey props\n onKeyDown: onKeyDownProp,\n onKeyDownCapture,\n onKeyPress,\n onKeyPressCapture,\n onKeyUp,\n onKeyUpCapture,\n onClear,\n ...otherProps\n } = usePropsHandler(COMPONENT_NAME, props, textFieldRef);\n\n const incrementButtons = type === 'number' ? incrementButtonsProp : false;\n\n const [focus, setFocus] = useFlag(autoFocus);\n const [passwordVisible, setPasswordVisuble] = useFlag();\n const [withValue, setWithValue] = useFlag();\n\n const onClickRef = useMutableRef(onClick);\n const onChangeRef = useMutableRef(onChange);\n\n const handleEyeClick = useCallback(\n (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n e.stopPropagation();\n setPasswordVisuble.toggle();\n inputRef.current?.focus();\n },\n [],\n );\n\n const textarea = type === 'textarea';\n const LeftIcon = leftSide;\n const RightIcon = rightSide;\n const leftSideIsString = isString(leftSide);\n const rightSideIsString = isString(rightSide);\n const iconSize = getByMap(sizeMap, size, iconSizeProp);\n\n const sortedSteps = useSortSteps({\n step,\n min: Number(min),\n max: Number(max),\n });\n\n const handleChange: React.ChangeEventHandler<\n HTMLInputElement | HTMLTextAreaElement\n > = useCallback(\n (e) => {\n !disabled &&\n onChangeRef.current?.(e.target.value || null, {\n e,\n id,\n name,\n });\n\n if (e.target.value) {\n setWithValue.on();\n } else {\n setWithValue.off();\n }\n },\n [id, name, disabled],\n );\n\n const handleBlur: React.FocusEventHandler<HTMLElement> = (e) => {\n setFocus.off();\n onBlur?.(e);\n };\n\n const handleFocus: React.FocusEventHandler<HTMLElement> = (e) => {\n setFocus.on();\n onFocus?.(e);\n };\n\n const commonProps = {\n 'className': cnTextField('Input'),\n 'value': inputValue(value),\n 'defaultValue': inputValue(defaultValue),\n 'onChange': handleChange,\n maxLength,\n disabled,\n 'onBlur': handleBlur,\n 'onFocus': handleFocus,\n autoFocus,\n placeholder,\n autoComplete,\n readOnly,\n tabIndex,\n name,\n onKeyDownCapture,\n onKeyPress,\n onKeyPressCapture,\n onKeyUp,\n onKeyUpCapture,\n 'id': id ? id.toString() : undefined,\n 'aria-label': ariaLabel,\n };\n\n const Eye = passwordVisible ? IconEyeClose : IconEye;\n\n const onKeyDown = (e: React.KeyboardEvent) => {\n const flag = getIncrementFlag(e);\n onKeyDownProp?.(e);\n if (type === 'number' && typeof flag === 'boolean' && !disabled) {\n e.preventDefault();\n\n const newValue = getValueByStep(\n sortedSteps,\n inputRef.current?.value,\n flag,\n min,\n max,\n );\n\n onChangeRef.current?.(newValue, {\n e,\n id,\n name,\n });\n\n if (inputRef.current) {\n inputRef.current.value = newValue;\n setWithValue.on();\n }\n }\n };\n\n const textareaProps = {\n rows,\n cols,\n minRows: minRows || rows,\n maxRows: maxRows || rows,\n ref: useForkRef([inputRef, inputRefProp]) as (\n node: HTMLTextAreaElement,\n ) => void,\n };\n\n const inputProps = {\n type: getTypeForRender(type, passwordVisible),\n max,\n min,\n step: !Array.isArray(sortedSteps) ? sortedSteps : 0,\n onKeyDown,\n ref: useForkRef([\n inputRef,\n inputRefProp,\n ]) as React.RefCallback<HTMLInputElement>,\n };\n\n const handleClear = useCallback((e: React.MouseEvent<HTMLButtonElement>) => {\n onChangeRef.current?.(null, {\n e,\n id,\n name,\n });\n\n if (inputRef.current) {\n inputRef.current.value = '';\n setWithValue.off();\n }\n }, []);\n\n const changeNumberValue = (\n e: React.MouseEvent<HTMLButtonElement>,\n isIncrement = true,\n ) => {\n const newValue = getValueByStep(\n sortedSteps,\n inputRef.current?.value,\n isIncrement,\n min,\n max,\n );\n onChangeRef.current?.(newValue, {\n e,\n id,\n name,\n });\n if (inputRef.current) {\n inputRef.current.value = newValue;\n setWithValue.on();\n }\n };\n\n const rootProps = {\n onClick: useCallback((e: React.MouseEvent<HTMLDivElement, MouseEvent>) => {\n inputRef.current?.focus();\n onClickRef.current?.(e);\n }, []),\n };\n\n useEffect(() => {\n setWithValue[inputRef.current?.value ? 'on' : 'off']();\n }, [inputRef.current?.value]);\n\n return (\n <div\n className={cnTextField({ labelPosition, size, view }, [className])}\n ref={useForkRef([ref, textFieldRef])}\n {...rootProps}\n {...otherProps}\n >\n {label && (\n <FieldLabel\n as=\"label\"\n htmlFor={id?.toString()}\n icon={labelIcon}\n required={required}\n className={cnTextField('Label', { labelPosition })}\n size={size}\n >\n {label}\n </FieldLabel>\n )}\n <div className={cnTextField('Body')}>\n <div\n ref={inputContainerRef}\n className={cnTextField('InputContainer', {\n view,\n form,\n status: status || state,\n disabled,\n type,\n focus: focus || focused,\n withValue,\n incrementButtons: type === 'number' && incrementButtons,\n })}\n >\n {LeftIcon && (\n <div\n className={cnTextField('Side', {\n position: 'left',\n type: leftSideIsString ? 'string' : 'icon',\n })}\n title={typeof leftSide === 'string' ? leftSide : undefined}\n >\n {leftSideIsString ? (\n leftSide\n ) : (\n <LeftIcon className={cnTextField('Icon')} size={iconSize} />\n )}\n </div>\n )}\n {textarea ? (\n <TextAreaAutoSize {...commonProps} {...textareaProps} />\n ) : (\n <input {...commonProps} {...inputProps} />\n )}\n\n {incrementButtons && !disabled && (\n <div className={cnTextField('Counter')}>\n <button\n className={cnTextField('CounterButton', { fn: 'increment' })}\n onFocus={handleFocus}\n onClick={(e) => changeNumberValue(e, true)}\n type=\"button\"\n >\n <IconSelect size=\"xs\" />\n </button>\n <button\n className={cnTextField('CounterButton')}\n onFocus={handleFocus}\n onClick={(e) => changeNumberValue(e, false)}\n type=\"button\"\n >\n <IconSelect size=\"xs\" />\n </button>\n </div>\n )}\n\n {!incrementButtons && withValue && withClearButton && !disabled && (\n <button\n type=\"button\"\n disabled={disabled}\n tabIndex={-1}\n onClick={onClear || handleClear}\n className={cnTextField('ClearButton')}\n >\n <IconClear\n size={sizeMap[size]}\n className={cnTextField('ClearButtonIcon')}\n />\n </button>\n )}\n\n {type === 'password' && inputRef.current?.value && (\n <button\n className={cnTextField('ClearButton')}\n type=\"button\"\n onClick={handleEyeClick}\n >\n <Eye className={cnTextField('Icon')} size={iconSize} />\n </button>\n )}\n\n {RightIcon && !incrementButtons && type !== 'password' && (\n <div\n className={cnTextField('Side', {\n position: 'right',\n type: rightSideIsString ? 'string' : 'icon',\n })}\n title={typeof rightSide === 'string' ? rightSide : undefined}\n >\n {rightSideIsString ? (\n rightSide\n ) : (\n <RightIcon className={cnTextField('Icon')} size={iconSize} />\n )}\n </div>\n )}\n </div>\n {caption && (\n <FieldCaption\n className={cnTextField('Caption')}\n status={status || state}\n >\n {caption}\n </FieldCaption>\n )}\n </div>\n </div>\n );\n};\n\nexport const TextField = forwardRef(TextFieldRender) as TextFieldComponent;\nexport * from './types';\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.UserSelectItem{align-items:center;background-color:var(--color-control-bg-clear);color:var(--color-control-typo-default);cursor:pointer;display:flex;font-size:var(--font-size);position:relative}.UserSelectItem_size_s{--font-size:var(--control-text-size-s);--sub-info-space:var(--space-xs);--sub-label-font-size:var(--size-text-2xs)}.UserSelectItem_size_m{--font-size:var(--control-text-size-m);--sub-info-space:var(--space-s);--sub-label-font-size:var(--size-text-xs)}.UserSelectItem_size_l{--font-size:var(--control-text-size-l);--sub-info-space:var(--space-s);--sub-label-font-size:var(--size-text-s)}.
|
|
1
|
+
.UserSelectItem{align-items:center;background-color:var(--color-control-bg-clear);color:var(--color-control-typo-default);cursor:pointer;display:flex;font-size:var(--font-size);position:relative}.UserSelectItem_size_s{--font-size:var(--control-text-size-s);--sub-info-space:var(--space-xs);--sub-label-font-size:var(--size-text-2xs)}.UserSelectItem_size_m{--font-size:var(--control-text-size-m);--sub-info-space:var(--space-s);--sub-label-font-size:var(--size-text-xs)}.UserSelectItem_size_l{--font-size:var(--control-text-size-l);--sub-info-space:var(--space-s);--sub-label-font-size:var(--size-text-s)}.UserSelectItem_hovered{background-color:var(--color-control-bg-clear-hover)}.UserSelectItem_disable{color:var(--color-control-typo-disable);cursor:auto}.UserSelectItem_active{color:var(--color-control-typo-secondary)}.UserSelectItem_indent_increased{padding-left:calc(var(--horizontal-space)*2.6)}.UserSelectItem-AvatarContainer{position:relative}.UserSelectItem-CheckIcon{background-color:var(--color-control-bg-primary);border:1px solid var(--color-control-bg-default);border-radius:50%;bottom:calc(var(--space-2xs)*-1);color:var(--color-control-bg-default);height:var(--graphics-size-xs);padding:0;position:absolute;right:calc(var(--space-2xs)*-1);width:var(--graphics-size-xs)}.UserSelectItem-CheckIcon_animate_entered,.UserSelectItem-CheckIcon_animate_entering,.UserSelectItem-CheckIcon_animate_exited,.UserSelectItem-CheckIcon_animate_exiting{transition:.2s ease;transition-property:opacity,transform}.UserSelectItem-CheckIcon_animate_entered,.UserSelectItem-CheckIcon_animate_entering{opacity:1;transform:scale(1)}.UserSelectItem-CheckIcon_animate_exiting{opacity:0;transform:scale(.25)}.UserSelectItem-CheckIcon_animate_exited{opacity:0;transform:scale(0)}.UserSelectItem-Info{padding-left:var(--sub-info-space)}.UserSelectItem-SubLabel{font-size:var(--sub-label-font-size);opacity:.7}.UserSelectItem-SubLabel_disable{opacity:1}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["className","label","subLabel","avatarUrl","active","hovered","size","indent","disable","multiple"];import"./UserSelectItem.css";import{IconCheck}from"@consta/icons/IconCheck";import React,{forwardRef,useRef}from"react";import{Transition}from"react-transition-group";import{Avatar}from"../../Avatar";import{mapHorisontalSpase,mapHorisontalSpaseIncreased,mapItemVerticalPadding}from"../../ListCanary";import{cnMixSpace}from"../../../mixs/MixSpace";import{cn}from"../../../utils/bem";export var cnUserSelectItem=cn("UserSelectItem");export var UserSelectItem=forwardRef(function(a,b){var c=a.className,d=a.label,e=a.subLabel,f=a.avatarUrl,g=a.active,h=a.hovered,i=a.size,j=a.indent,k=a.disable,l=a.multiple,m=_objectWithoutProperties(a,_excluded),n=useRef(null);return React.createElement("div",Object.assign({},m,{className:cnUserSelectItem({active:g,hovered:h,size:i,indent:j,disable:k},[cnMixSpace({pH:"increased"===j?mapHorisontalSpaseIncreased[i]:mapHorisontalSpase[i],pV:mapItemVerticalPadding[i]}),c]),"aria-selected":g,ref:b}),React.createElement("div",{className:cnUserSelectItem("AvatarContainer")},React.createElement(Avatar,{className:cnUserSelectItem("Avatar"),url:f,name:d}),l&&React.createElement(Transition,{in:g,unmountOnExit:!0,timeout:200,nodeRef:n},function(a){return React.createElement(IconCheck,{className:cnUserSelectItem("CheckIcon",{animate:a}),ref:n})}),!l&&g&&React.createElement(IconCheck,{className:cnUserSelectItem("CheckIcon")})),e?React.createElement("div",{className:cnUserSelectItem("Info")},React.createElement("div",null,d),React.createElement("div",{className:cnUserSelectItem("SubLabel",{disable:k})},e)):React.createElement("div",{className:cnUserSelectItem("Info")},d))});
|
|
1
|
+
import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["className","label","subLabel","avatarUrl","active","hovered","size","indent","disable","multiple"];import"./UserSelectItem.css";import{IconCheck}from"@consta/icons/IconCheck";import React,{forwardRef,useRef}from"react";import{Transition}from"react-transition-group";import{Avatar}from"../../Avatar";import{mapHorisontalSpase,mapHorisontalSpaseIncreased,mapItemVerticalPadding}from"../../ListCanary";import{cnMixSpace}from"../../../mixs/MixSpace";import{cn}from"../../../utils/bem";export var cnUserSelectItem=cn("UserSelectItem");export var UserSelectItem=forwardRef(function(a,b){var c=a.className,d=a.label,e=a.subLabel,f=a.avatarUrl,g=a.active,h=a.hovered,i=a.size,j=a.indent,k=a.disable,l=a.multiple,m=_objectWithoutProperties(a,_excluded),n=useRef(null);return React.createElement("div",Object.assign({},m,{className:cnUserSelectItem({active:g,hovered:h,size:i,indent:j,disable:k},[cnMixSpace({pH:"increased"===j?mapHorisontalSpaseIncreased[i]:mapHorisontalSpase[i],pV:mapItemVerticalPadding[i]}),c]),"aria-selected":g,ref:b}),React.createElement("div",{className:cnUserSelectItem("AvatarContainer")},React.createElement(Avatar,{className:cnUserSelectItem("Avatar"),url:f,name:d,monochrome:k}),l&&React.createElement(Transition,{in:g,unmountOnExit:!0,timeout:200,nodeRef:n},function(a){return React.createElement(IconCheck,{className:cnUserSelectItem("CheckIcon",{animate:a}),ref:n})}),!l&&g&&React.createElement(IconCheck,{className:cnUserSelectItem("CheckIcon")})),e?React.createElement("div",{className:cnUserSelectItem("Info")},React.createElement("div",null,d),React.createElement("div",{className:cnUserSelectItem("SubLabel",{disable:k})},e)):React.createElement("div",{className:cnUserSelectItem("Info")},d))});
|
|
2
2
|
//# sourceMappingURL=UserSelectItem.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"UserSelectItem.js","names":["IconCheck","React","forwardRef","useRef","Transition","Avatar","mapHorisontalSpase","mapHorisontalSpaseIncreased","mapItemVerticalPadding","cnMixSpace","cn","cnUserSelectItem","UserSelectItem","props","ref","className","label","subLabel","avatarUrl","active","hovered","size","indent","disable","multiple","otherProps","iconRef","pH","pV","animate"],"sources":["../../../../../../src/components/UserSelect/UserSelectItem/UserSelectItem.tsx"],"sourcesContent":["import './UserSelectItem.css';\n\nimport { IconCheck } from '@consta/icons/IconCheck';\nimport React, { forwardRef, useRef } from 'react';\nimport { Transition } from 'react-transition-group';\n\nimport { Avatar } from '##/components/Avatar';\nimport {\n mapHorisontalSpase,\n mapHorisontalSpaseIncreased,\n mapItemVerticalPadding,\n} from '##/components/ListCanary';\nimport { cnMixSpace } from '##/mixs/MixSpace';\nimport { cn } from '##/utils/bem';\nimport { PropsWithHTMLAttributes } from '##/utils/types/PropsWithHTMLAttributes';\n\ntype UserSelectItemProps = PropsWithHTMLAttributes<\n {\n label: string;\n active: boolean;\n hovered: boolean;\n size: 's' | 'm' | 'l';\n indent: 'normal' | 'increased';\n subLabel?: string;\n avatarUrl?: string;\n disable?: boolean;\n multiple?: boolean;\n },\n HTMLDivElement\n>;\n\nexport const cnUserSelectItem = cn('UserSelectItem');\n\nexport const UserSelectItem = forwardRef<HTMLDivElement, UserSelectItemProps>(\n (props, ref) => {\n const {\n className,\n label,\n subLabel,\n avatarUrl,\n active,\n hovered,\n size,\n indent,\n disable,\n multiple,\n ...otherProps\n } = props;\n\n const iconRef = useRef<HTMLSpanElement>(null);\n\n return (\n <div\n {...otherProps}\n className={cnUserSelectItem(\n { active, hovered, size, indent, disable },\n [\n cnMixSpace({\n pH:\n indent === 'increased'\n ? mapHorisontalSpaseIncreased[size]\n : mapHorisontalSpase[size],\n pV: mapItemVerticalPadding[size],\n }),\n className,\n ],\n )}\n aria-selected={active}\n ref={ref}\n >\n <div className={cnUserSelectItem('AvatarContainer')}>\n <Avatar\n className={cnUserSelectItem('Avatar')}\n url={avatarUrl}\n name={label}\n />\n {multiple && (\n <Transition\n in={active}\n unmountOnExit\n timeout={200}\n nodeRef={iconRef}\n >\n {(animate) => (\n <IconCheck\n className={cnUserSelectItem('CheckIcon', { animate })}\n ref={iconRef}\n />\n )}\n </Transition>\n )}\n {!multiple && active && (\n <IconCheck className={cnUserSelectItem('CheckIcon')} />\n )}\n </div>\n {!subLabel ? (\n <div className={cnUserSelectItem('Info')}>{label}</div>\n ) : (\n <div className={cnUserSelectItem('Info')}>\n <div>{label}</div>\n <div className={cnUserSelectItem('SubLabel', { disable })}>\n {subLabel}\n </div>\n </div>\n )}\n </div>\n );\n },\n);\n"],"mappings":"wMAAA,6BAEA,OAASA,SAAT,KAA0B,yBAA1B,CACA,MAAOC,MAAP,EAAgBC,UAAhB,CAA4BC,MAA5B,KAA0C,OAA1C,CACA,OAASC,UAAT,KAA2B,wBAA3B,CAEA,OAASC,MAAT,oBACA,OACEC,kBADF,CAEEC,2BAFF,CAGEC,sBAHF,wBAKA,OAASC,UAAT,8BACA,OAASC,EAAT,0BAkBA,MAAO,IAAMC,iBAAgB,CAAGD,EAAE,CAAC,gBAAD,CAA3B,CAEP,MAAO,IAAME,eAAc,CAAGV,UAAU,CACtC,SAACW,CAAD,CAAQC,CAAR,CAAgB,IAEZC,EAFY,CAaVF,CAbU,CAEZE,SAFY,CAGZC,CAHY,CAaVH,CAbU,CAGZG,KAHY,CAIZC,CAJY,CAaVJ,CAbU,CAIZI,QAJY,CAKZC,CALY,CAaVL,CAbU,CAKZK,SALY,CAMZC,CANY,CAaVN,CAbU,CAMZM,MANY,CAOZC,CAPY,CAaVP,CAbU,CAOZO,OAPY,CAQZC,CARY,CAaVR,CAbU,CAQZQ,IARY,CASZC,CATY,CAaVT,CAbU,CASZS,MATY,CAUZC,CAVY,CAaVV,CAbU,CAUZU,OAVY,CAWZC,CAXY,CAaVX,CAbU,CAWZW,QAXY,CAYTC,CAZS,0BAaVZ,CAbU,YAeRa,CAAO,CAAGvB,MAAM,CAAkB,IAAlB,CAfR,CAiBd,MACE,4CACMsB,CADN,EAEE,SAAS,CAAEd,gBAAgB,CACzB,CAAEQ,MAAM,CAANA,CAAF,CAAUC,OAAO,CAAPA,CAAV,CAAmBC,IAAI,CAAJA,CAAnB,CAAyBC,MAAM,CAANA,CAAzB,CAAiCC,OAAO,CAAPA,CAAjC,CADyB,CAEzB,CACEd,UAAU,CAAC,CACTkB,EAAE,CACW,WAAX,GAAAL,CAAM,CACFf,2BAA2B,CAACc,CAAD,CADzB,CAEFf,kBAAkB,CAACe,CAAD,CAJf,CAKTO,EAAE,CAAEpB,sBAAsB,CAACa,CAAD,CALjB,CAAD,CADZ,CAQEN,CARF,CAFyB,CAF7B,CAeE,gBAAeI,CAfjB,CAgBE,GAAG,CAAEL,CAhBP,GAkBE,2BAAK,SAAS,CAAEH,gBAAgB,CAAC,iBAAD,CAAhC,EACE,oBAAC,MAAD,EACE,SAAS,CAAEA,gBAAgB,CAAC,QAAD,CAD7B,CAEE,GAAG,CAAEO,CAFP,CAGE,IAAI,CAAEF,CAHR,EADF,
|
|
1
|
+
{"version":3,"file":"UserSelectItem.js","names":["IconCheck","React","forwardRef","useRef","Transition","Avatar","mapHorisontalSpase","mapHorisontalSpaseIncreased","mapItemVerticalPadding","cnMixSpace","cn","cnUserSelectItem","UserSelectItem","props","ref","className","label","subLabel","avatarUrl","active","hovered","size","indent","disable","multiple","otherProps","iconRef","pH","pV","animate"],"sources":["../../../../../../src/components/UserSelect/UserSelectItem/UserSelectItem.tsx"],"sourcesContent":["import './UserSelectItem.css';\n\nimport { IconCheck } from '@consta/icons/IconCheck';\nimport React, { forwardRef, useRef } from 'react';\nimport { Transition } from 'react-transition-group';\n\nimport { Avatar } from '##/components/Avatar';\nimport {\n mapHorisontalSpase,\n mapHorisontalSpaseIncreased,\n mapItemVerticalPadding,\n} from '##/components/ListCanary';\nimport { cnMixSpace } from '##/mixs/MixSpace';\nimport { cn } from '##/utils/bem';\nimport { PropsWithHTMLAttributes } from '##/utils/types/PropsWithHTMLAttributes';\n\ntype UserSelectItemProps = PropsWithHTMLAttributes<\n {\n label: string;\n active: boolean;\n hovered: boolean;\n size: 's' | 'm' | 'l';\n indent: 'normal' | 'increased';\n subLabel?: string;\n avatarUrl?: string;\n disable?: boolean;\n multiple?: boolean;\n },\n HTMLDivElement\n>;\n\nexport const cnUserSelectItem = cn('UserSelectItem');\n\nexport const UserSelectItem = forwardRef<HTMLDivElement, UserSelectItemProps>(\n (props, ref) => {\n const {\n className,\n label,\n subLabel,\n avatarUrl,\n active,\n hovered,\n size,\n indent,\n disable,\n multiple,\n ...otherProps\n } = props;\n\n const iconRef = useRef<HTMLSpanElement>(null);\n\n return (\n <div\n {...otherProps}\n className={cnUserSelectItem(\n { active, hovered, size, indent, disable },\n [\n cnMixSpace({\n pH:\n indent === 'increased'\n ? mapHorisontalSpaseIncreased[size]\n : mapHorisontalSpase[size],\n pV: mapItemVerticalPadding[size],\n }),\n className,\n ],\n )}\n aria-selected={active}\n ref={ref}\n >\n <div className={cnUserSelectItem('AvatarContainer')}>\n <Avatar\n className={cnUserSelectItem('Avatar')}\n url={avatarUrl}\n name={label}\n monochrome={disable}\n />\n {multiple && (\n <Transition\n in={active}\n unmountOnExit\n timeout={200}\n nodeRef={iconRef}\n >\n {(animate) => (\n <IconCheck\n className={cnUserSelectItem('CheckIcon', { animate })}\n ref={iconRef}\n />\n )}\n </Transition>\n )}\n {!multiple && active && (\n <IconCheck className={cnUserSelectItem('CheckIcon')} />\n )}\n </div>\n {!subLabel ? (\n <div className={cnUserSelectItem('Info')}>{label}</div>\n ) : (\n <div className={cnUserSelectItem('Info')}>\n <div>{label}</div>\n <div className={cnUserSelectItem('SubLabel', { disable })}>\n {subLabel}\n </div>\n </div>\n )}\n </div>\n );\n },\n);\n"],"mappings":"wMAAA,6BAEA,OAASA,SAAT,KAA0B,yBAA1B,CACA,MAAOC,MAAP,EAAgBC,UAAhB,CAA4BC,MAA5B,KAA0C,OAA1C,CACA,OAASC,UAAT,KAA2B,wBAA3B,CAEA,OAASC,MAAT,oBACA,OACEC,kBADF,CAEEC,2BAFF,CAGEC,sBAHF,wBAKA,OAASC,UAAT,8BACA,OAASC,EAAT,0BAkBA,MAAO,IAAMC,iBAAgB,CAAGD,EAAE,CAAC,gBAAD,CAA3B,CAEP,MAAO,IAAME,eAAc,CAAGV,UAAU,CACtC,SAACW,CAAD,CAAQC,CAAR,CAAgB,IAEZC,EAFY,CAaVF,CAbU,CAEZE,SAFY,CAGZC,CAHY,CAaVH,CAbU,CAGZG,KAHY,CAIZC,CAJY,CAaVJ,CAbU,CAIZI,QAJY,CAKZC,CALY,CAaVL,CAbU,CAKZK,SALY,CAMZC,CANY,CAaVN,CAbU,CAMZM,MANY,CAOZC,CAPY,CAaVP,CAbU,CAOZO,OAPY,CAQZC,CARY,CAaVR,CAbU,CAQZQ,IARY,CASZC,CATY,CAaVT,CAbU,CASZS,MATY,CAUZC,CAVY,CAaVV,CAbU,CAUZU,OAVY,CAWZC,CAXY,CAaVX,CAbU,CAWZW,QAXY,CAYTC,CAZS,0BAaVZ,CAbU,YAeRa,CAAO,CAAGvB,MAAM,CAAkB,IAAlB,CAfR,CAiBd,MACE,4CACMsB,CADN,EAEE,SAAS,CAAEd,gBAAgB,CACzB,CAAEQ,MAAM,CAANA,CAAF,CAAUC,OAAO,CAAPA,CAAV,CAAmBC,IAAI,CAAJA,CAAnB,CAAyBC,MAAM,CAANA,CAAzB,CAAiCC,OAAO,CAAPA,CAAjC,CADyB,CAEzB,CACEd,UAAU,CAAC,CACTkB,EAAE,CACW,WAAX,GAAAL,CAAM,CACFf,2BAA2B,CAACc,CAAD,CADzB,CAEFf,kBAAkB,CAACe,CAAD,CAJf,CAKTO,EAAE,CAAEpB,sBAAsB,CAACa,CAAD,CALjB,CAAD,CADZ,CAQEN,CARF,CAFyB,CAF7B,CAeE,gBAAeI,CAfjB,CAgBE,GAAG,CAAEL,CAhBP,GAkBE,2BAAK,SAAS,CAAEH,gBAAgB,CAAC,iBAAD,CAAhC,EACE,oBAAC,MAAD,EACE,SAAS,CAAEA,gBAAgB,CAAC,QAAD,CAD7B,CAEE,GAAG,CAAEO,CAFP,CAGE,IAAI,CAAEF,CAHR,CAIE,UAAU,CAAEO,CAJd,EADF,CAOGC,CAAQ,EACP,oBAAC,UAAD,EACE,GAAIL,CADN,CAEE,aAAa,GAFf,CAGE,OAAO,CAAE,GAHX,CAIE,OAAO,CAAEO,CAJX,EAMG,SAACG,CAAD,QACC,qBAAC,SAAD,EACE,SAAS,CAAElB,gBAAgB,CAAC,WAAD,CAAc,CAAEkB,OAAO,CAAPA,CAAF,CAAd,CAD7B,CAEE,GAAG,CAAEH,CAFP,EADD,CANH,CARJ,CAsBG,CAACF,CAAD,EAAaL,CAAb,EACC,oBAAC,SAAD,EAAW,SAAS,CAAER,gBAAgB,CAAC,WAAD,CAAtC,EAvBJ,CAlBF,CA4CIM,CAAD,CAGC,2BAAK,SAAS,CAAEN,gBAAgB,CAAC,MAAD,CAAhC,EACE,+BAAMK,CAAN,CADF,CAEE,2BAAK,SAAS,CAAEL,gBAAgB,CAAC,UAAD,CAAa,CAAEY,OAAO,CAAPA,CAAF,CAAb,CAAhC,EACGN,CADH,CAFF,CAHD,CACC,2BAAK,SAAS,CAAEN,gBAAgB,CAAC,MAAD,CAAhC,EAA2CK,CAA3C,CA7CJ,CAwDH,CA3EqC,CAAjC"}
|