@foxford/ui 2.46.0 → 2.47.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/assets/apple-auth-mono-color.svg +1 -0
- package/assets/apple-authorization.svg +1 -1
- package/assets/educont-auth-mono-color.svg +1 -0
- package/assets/educont-authorization.svg +1 -1
- package/assets/google-auth-mono-color.svg +1 -0
- package/assets/mail.ru-authorization.svg +1 -1
- package/assets/mailru-auth-mono-color.svg +1 -0
- package/assets/ok-authorization.svg +1 -1
- package/assets/sber-auth-mono-color.svg +1 -0
- package/assets/sber-authorization.svg +1 -0
- package/assets/share.svg +1 -1
- package/assets/t-bank-authorization.svg +1 -0
- package/assets/tbank-auth-mono-color.svg +1 -0
- package/assets/twenty-thirty-five-authorization.svg +1 -1
- package/assets/un2035-auth-mono-color.svg +1 -0
- package/assets/vk-auth-mono-color.svg +1 -0
- package/assets/vk-authorization.svg +1 -1
- package/assets/yandex-auth-mono-color.svg +1 -0
- package/assets/yandex-authorization.svg +1 -1
- package/components/Alert/Alert.js +1 -1
- package/components/Alert/Alert.mjs +1 -1
- package/components/Button/style.js +1 -1
- package/components/Button/style.mjs +1 -1
- package/components/Dropdown/style.js +1 -1
- package/components/Dropdown/style.mjs +1 -1
- package/components/FormLabel/FormLabel.js +1 -1
- package/components/FormLabel/FormLabel.js.map +1 -1
- package/components/FormLabel/FormLabel.mjs +1 -1
- package/components/FormLabel/FormLabel.mjs.map +1 -1
- package/components/FormLabel/constants.js +1 -1
- package/components/FormLabel/constants.js.map +1 -1
- package/components/FormLabel/constants.mjs +1 -1
- package/components/FormLabel/constants.mjs.map +1 -1
- package/components/FormLabel/style.js +1 -1
- package/components/FormLabel/style.js.map +1 -1
- package/components/FormLabel/style.mjs +1 -1
- package/components/FormLabel/style.mjs.map +1 -1
- package/components/Icon/list/icon-pack.js +1 -1
- package/components/Icon/list/icon-pack.mjs +1 -1
- package/components/Input/Input.js +1 -1
- package/components/Input/Input.js.map +1 -1
- package/components/Input/Input.mjs +1 -1
- package/components/Input/Input.mjs.map +1 -1
- package/components/InputCheckbox/InputCheckbox.js +1 -1
- package/components/InputCheckbox/InputCheckbox.js.map +1 -1
- package/components/InputCheckbox/InputCheckbox.mjs +1 -1
- package/components/InputCheckbox/InputCheckbox.mjs.map +1 -1
- package/components/InputCheckbox/constants.js +1 -1
- package/components/InputCheckbox/constants.js.map +1 -1
- package/components/InputCheckbox/constants.mjs +1 -1
- package/components/InputCheckbox/constants.mjs.map +1 -1
- package/components/InputCheckbox/style.js +1 -1
- package/components/InputCheckbox/style.js.map +1 -1
- package/components/InputCheckbox/style.mjs +1 -1
- package/components/InputCheckbox/style.mjs.map +1 -1
- package/components/InputRadio/InputRadio.js +1 -1
- package/components/InputRadio/InputRadio.js.map +1 -1
- package/components/InputRadio/InputRadio.mjs +1 -1
- package/components/InputRadio/InputRadio.mjs.map +1 -1
- package/components/InputRadio/constants.js +1 -1
- package/components/InputRadio/constants.js.map +1 -1
- package/components/InputRadio/constants.mjs +1 -1
- package/components/InputRadio/constants.mjs.map +1 -1
- package/components/InputRadio/style.js +1 -1
- package/components/InputRadio/style.js.map +1 -1
- package/components/InputRadio/style.mjs +1 -1
- package/components/InputRadio/style.mjs.map +1 -1
- package/components/PopoverComponent/PopoverComponent.js +1 -1
- package/components/PopoverComponent/PopoverComponent.js.map +1 -1
- package/components/PopoverComponent/PopoverComponent.mjs +1 -1
- package/components/PopoverComponent/PopoverComponent.mjs.map +1 -1
- package/dts/index.d.ts +81 -49
- package/external/.pnpm/@foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/components.json.js +2 -0
- package/external/.pnpm/@foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/components.json.mjs +2 -0
- package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/icons/CheckCircleFill/index.js.map +1 -1
- package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/icons/CheckCircleFill/index.mjs.map +1 -1
- package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/icons/ChevronDown/index.js.map +1 -1
- package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/icons/ChevronDown/index.mjs.map +1 -1
- package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/icons/Close/index.js.map +1 -1
- package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/icons/Close/index.mjs.map +1 -1
- package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/icons/CloseCirlceFill/index.js.map +1 -1
- package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/icons/CloseCirlceFill/index.mjs.map +1 -1
- package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/icons/LoaderFill/index.js.map +1 -1
- package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/icons/LoaderFill/index.mjs.map +1 -1
- package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/icons/NotifFill/index.js.map +1 -1
- package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/icons/NotifFill/index.mjs.map +1 -1
- package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/icons/WarningTriangleFill/index.js.map +1 -1
- package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/icons/WarningTriangleFill/index.mjs.map +1 -1
- package/mixins/responsive-margin.js +1 -1
- package/mixins/responsive-margin.js.map +1 -1
- package/mixins/responsive-margin.mjs +1 -1
- package/mixins/responsive-margin.mjs.map +1 -1
- package/package.json +1 -1
- package/shared/regexp.js +1 -1
- package/shared/regexp.js.map +1 -1
- package/shared/regexp.mjs +1 -1
- package/shared/regexp.mjs.map +1 -1
- package/external/.pnpm/@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/components.json.js +0 -2
- package/external/.pnpm/@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/@foxford/icon-pack/components.json.mjs +0 -2
- /package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/components.json.js.map +0 -0
- /package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/components.json.mjs.map +0 -0
- /package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/icons/CheckCircleFill/index.js +0 -0
- /package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/icons/CheckCircleFill/index.mjs +0 -0
- /package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/icons/ChevronDown/index.js +0 -0
- /package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/icons/ChevronDown/index.mjs +0 -0
- /package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/icons/Close/index.js +0 -0
- /package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/icons/Close/index.mjs +0 -0
- /package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/icons/CloseCirlceFill/index.js +0 -0
- /package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/icons/CloseCirlceFill/index.mjs +0 -0
- /package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/icons/LoaderFill/index.js +0 -0
- /package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/icons/LoaderFill/index.mjs +0 -0
- /package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/icons/NotifFill/index.js +0 -0
- /package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/icons/NotifFill/index.mjs +0 -0
- /package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/icons/WarningTriangleFill/index.js +0 -0
- /package/external/.pnpm/{@foxford_icon-pack@0.6.3_react-dom@18.3.1_react@18.3.1__react@18.3.1 → @foxford_icon-pack@0.8.0_react-dom@18.3.1_react@18.3.1__react@18.3.1}/node_modules/@foxford/icon-pack/icons/WarningTriangleFill/index.mjs +0 -0
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{forwardRef,useRef,useImperativeHandle,useState}from'react';import{useTheme}from'styled-components';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{Root,Input as Input$1,InputControl}from'./style.mjs';import{jsx,jsxs,Fragment}from'react/jsx-runtime';import{InputPhone}from'../Input.Phone/Input.Phone.mjs';import{SIZES}from'../FormInputLabel/constants.mjs';import{FormInputLabel}from'../FormInputLabel/FormInputLabel.mjs';import{Icon}from'../Icon/Icon.mjs';import{Spacer}from'../Spacer/Spacer.mjs';const COMPONENT_NAME='Input';const Input=Object.assign(withMergedProps(forwardRef(((t,n)=>{const e=useTheme();const{size:r="m",mask:o="",rounded:i=!0,color:a="mineShaft",placeholderColor:s="silver",width:m=e.defaultInputControlsWidth,type:p="text",labelPosition:c="dynamic",textProps:l={},iconProps:u={},controls:g={},preset:d,className:f,style:h,sizeXXS:S,sizeXS:X,sizeS:b,sizeM:L,sizeL:y,sizeXL:v,sizeUnits:I,sizes:x,margin:z,marginXXS:T,marginXS:P,marginS:C,marginM:M,marginL:R,marginXL:j,marginTop:w,marginTopXXS:B,marginTopXS:F,marginTopS:k,marginTopM:E,marginTopL:N,marginTopXL:A,marginRight:O,marginRightXXS:
|
|
1
|
+
import{forwardRef,useRef,useImperativeHandle,useState}from'react';import{useTheme}from'styled-components';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{Root,Input as Input$1,InputControl}from'./style.mjs';import{jsx,jsxs,Fragment}from'react/jsx-runtime';import{InputPhone}from'../Input.Phone/Input.Phone.mjs';import{SIZES}from'../FormInputLabel/constants.mjs';import{FormInputLabel}from'../FormInputLabel/FormInputLabel.mjs';import{Icon}from'../Icon/Icon.mjs';import{Spacer}from'../Spacer/Spacer.mjs';const COMPONENT_NAME='Input';const Input=Object.assign(withMergedProps(forwardRef(((t,n)=>{const e=useTheme();const{size:r="m",mask:o="",rounded:i=!0,color:a="mineShaft",placeholderColor:s="silver",width:m=e.defaultInputControlsWidth,type:p="text",labelPosition:c="dynamic",textProps:l={},iconProps:u={},controls:g={},preset:d,className:f,style:h,sizeXXS:S,sizeXS:X,sizeS:b,sizeM:L,sizeL:y,sizeXL:v,sizeUnits:I,sizes:x,margin:z,marginXXS:T,marginXS:P,marginS:C,marginM:M,marginL:R,marginXL:j,marginTop:w,marginTopXXS:B,marginTopXS:F,marginTopS:k,marginTopM:E,marginTopL:N,marginTopXL:A,marginRight:O,marginRightXXS:V,marginRightXS:U,marginRightS:H,marginRightM:Z,marginRightL:$,marginRightXL:_,marginBottom:D,marginBottomXXS:W,marginBottomXS:q,marginBottomS:G,marginBottomM:J,marginBottomL:K,marginBottomXL:Q,marginLeft:Y,marginLeftXXS:tt,marginLeftXS:nt,marginLeftS:et,marginLeftM:rt,marginLeftL:ot,marginLeftXL:at,palette:st,widthXXS:mt,widthXS:pt,widthS:ct,widthM:lt,widthL:ut,widthXL:gt,error:dt,success:ft,label:ht,icon:St,text:Xt,primary:bt,secondary:Lt,onColored:yt,fluid:vt,disabled:It,inline:xt,inputRef:zt,...Tt}=t;const{icon:Pt,iconProps:Ct={},buttonProps:Mt={}}=g.additional??{};const{icon:Rt,iconProps:jt={},buttonProps:wt=[]}=g.number??{};const[Bt,Ft]=Array.isArray(Rt)?Rt:[Rt];const kt=(Array.isArray(wt)?wt[0]:wt)??{};const Et=(Array.isArray(wt)?wt[1]:{})??{};const Nt=useRef(null);useImperativeHandle(n,(()=>Nt.current),[]);const At=typeof Tt.value=='string'||typeof Tt.value=='number'||typeof Tt.defaultValue=='string'||typeof Tt.defaultValue=='number';const[Ot,Vt]=useState(At);const[Ut,Ht]=useState(At);const[Zt,$t]=useState((()=>{if(p!=='number'||Tt.min===void 0)return!1;const{value:t=1/0,defaultValue:n=1/0}=Tt;const e=typeof t=='number'?t:parseFloat(t);const r=typeof n=='number'?n:parseFloat(n);const o=typeof Tt.min=='number'?Tt.min:parseFloat(Tt.min);return Math.min(e,r)<=o}));const[_t,Dt]=useState((()=>{if(p!=='number'||Tt.max===void 0)return!1;const{value:t=-1/0,defaultValue:n=-1/0}=Tt;const e=typeof t=='number'?t:parseFloat(t);const r=typeof n=='number'?n:parseFloat(n);const o=typeof Tt.max=='number'?Tt.max:parseFloat(Tt.max);return Math.max(e,r)>=o}));return d!=='brand'?jsx(Root,{...Tt,inputRef:zt??(t=>{Nt.current=t}),className:f,style:h,size:typeof r=='number'?r:void 0,mask:o,rounded:i,color:a,placeholderColor:s,width:m,widthXXS:mt,widthXS:pt,widthS:ct,widthM:lt,widthL:ut,widthXL:gt,error:dt,type:p,fluid:vt,disabled:It}):jsx(FormInputLabel,{className:f,style:h,size:r,sizeXXS:S,sizeXS:X,sizeS:b,sizeM:L,sizeL:y,sizeXL:v,sizeUnits:I,sizes:x,margin:z,marginXXS:T,marginXS:P,marginS:C,marginM:M,marginL:R,marginXL:j,marginTop:w,marginTopXXS:B,marginTopXS:F,marginTopS:k,marginTopM:E,marginTopL:N,marginTopXL:A,marginRight:O,marginRightXXS:V,marginRightXS:U,marginRightS:H,marginRightM:Z,marginRightL:$,marginRightXL:_,marginBottom:D,marginBottomXXS:W,marginBottomXS:q,marginBottomS:G,marginBottomM:J,marginBottomL:K,marginBottomXL:Q,marginLeft:Y,marginLeftXXS:tt,marginLeftXS:nt,marginLeftS:et,marginLeftM:rt,marginLeftL:ot,marginLeftXL:at,palette:st,error:dt,success:ft,label:ht,labelPosition:c,icon:St,text:Xt,primary:bt,secondary:Lt,onColored:yt,disabled:It,inline:xt,active:Ot,textProps:l,iconProps:{size:24,color:It?'content-disabled':'content-onmain-tertiary',...u},onClick:()=>{Nt.current&&Nt.current.focus()},onFocus:t=>{t.target!==t.currentTarget&&Vt(!0)},onBlur:t=>{t.target===t.currentTarget||Ut||Vt(!1)},input:jsx(Input$1,{...Tt,inputRef:t=>{Nt.current=t},mask:o,palette:st,type:p,label:ht,labelPosition:c,disabled:It,active:Ot,onChange:t=>{if(Tt.onChange&&Tt.onChange(t),p==='number'){const n=parseFloat(t.currentTarget.value);const e=n<=parseFloat(t.currentTarget.min);const r=n>=parseFloat(t.currentTarget.max);$t(e),Dt(r),(e||r)&&t.currentTarget.focus()}},onBlur:t=>{t.stopPropagation(),Tt.onBlur&&Tt.onBlur(t),Ht(Boolean(t.currentTarget.value)),Vt(Boolean(t.currentTarget.value))}}),controls:Pt||p==='number'?jsxs(Fragment,{children:[Pt&&jsx(InputControl,{...Mt,type:"button",palette:st,disabled:It,onClick:t=>{t.stopPropagation(),Mt.onClick&&Mt.onClick(t)},children:jsx(Icon,{as:"span",size:24,color:"inherit",name:typeof Pt=='string'?Pt:void 0,icon:typeof Pt!='string'?Pt:void 0,...Ct})}),p==='number'&&jsxs(Spacer,{display:"flex",marginLeft:4,children:[jsx(InputControl,{...kt,type:"button",palette:st,disabled:It||Zt,onClick:t=>{t.stopPropagation(),kt.onClick&&kt.onClick(t);try{if(Nt.current){const t=Nt.current.value;if(Nt.current.stepDown(),t!==Nt.current.value){const t=new Event('input',{bubbles:!0});Nt.current.dispatchEvent(t)}}}catch(t){console.error(t)}},children:jsx(Icon,Bt===void 0?{as:"span",size:24,color:"inherit",name:"minus",preset:"brand",...jt}:{as:"span",size:24,color:"inherit",name:typeof Bt=='string'?Bt:void 0,icon:typeof Bt!='string'?Bt:void 0,...jt})}),jsx(InputControl,{...Et,type:"button",palette:st,disabled:It||_t,onClick:t=>{t.stopPropagation(),Et.onClick&&Et.onClick(t);try{if(Nt.current){const t=Nt.current.value;if(Nt.current.stepUp(),t!==Nt.current.value){const t=new Event('input',{bubbles:!0});Nt.current.dispatchEvent(t)}}}catch(t){console.error(t)}},children:jsx(Icon,Ft===void 0?{as:"span",size:24,color:"inherit",name:"plus",preset:"brand",...jt}:{as:"span",size:24,color:"inherit",name:typeof Ft=='string'?Ft:void 0,icon:typeof Ft!='string'?Ft:void 0,...jt})})]})]}):void 0})})),{sizes:SIZES,displayName:"Input"}),{Phone:InputPhone});export{COMPONENT_NAME,Input};
|
|
2
2
|
//# sourceMappingURL=Input.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.mjs","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 * 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 as='span'\n size={24}\n color='inherit'\n name={typeof additionalControlIcon === 'string' ? additionalControlIcon : undefined}\n icon={typeof additionalControlIcon !== 'string' ? additionalControlIcon : undefined}\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 {minus === undefined ? (\n <Icon\n as='span'\n size={24}\n color='inherit'\n name='minus'\n preset='brand'\n {...numberControlIconProps}\n />\n ) : (\n <Icon\n as='span'\n size={24}\n color='inherit'\n name={typeof minus === 'string' ? minus : undefined}\n icon={typeof minus !== 'string' ? minus : undefined}\n {...numberControlIconProps}\n />\n )}\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 {plus === undefined ? (\n <Icon\n as='span'\n size={24}\n color='inherit'\n name='plus'\n preset='brand'\n {...numberControlIconProps}\n />\n ) : (\n <Icon\n as='span'\n size={24}\n color='inherit'\n name={typeof plus === 'string' ? plus : undefined}\n icon={typeof plus !== 'string' ? plus : undefined}\n {...numberControlIconProps}\n />\n )}\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","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","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","min","undefined","Infinity","initValue","parseFloat","initDefaultValue","minValue","Math","plusDisabled","setPlusDisabled","max","maxValue","_jsx","Styled","input","FormInputLabel","onClick","focus","onFocus","evt","target","currentTarget","onBlur","onChange","currentValue","minValueReached","maxValueReached","stopPropagation","Boolean","_jsxs","_Fragment","children","Icon","as","name","Spacer","display","prev","stepDown","event","Event","bubbles","dispatchEvent","err","console","stepUp","SIZES","displayName","Phone","InputPhone"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Input.mjs","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 * 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 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 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 as='span'\n size={24}\n color='inherit'\n name={typeof additionalControlIcon === 'string' ? additionalControlIcon : undefined}\n icon={typeof additionalControlIcon !== 'string' ? additionalControlIcon : undefined}\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 {minus === undefined ? (\n <Icon\n as='span'\n size={24}\n color='inherit'\n name='minus'\n preset='brand'\n {...numberControlIconProps}\n />\n ) : (\n <Icon\n as='span'\n size={24}\n color='inherit'\n name={typeof minus === 'string' ? minus : undefined}\n icon={typeof minus !== 'string' ? minus : undefined}\n {...numberControlIconProps}\n />\n )}\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 {plus === undefined ? (\n <Icon\n as='span'\n size={24}\n color='inherit'\n name='plus'\n preset='brand'\n {...numberControlIconProps}\n />\n ) : (\n <Icon\n as='span'\n size={24}\n color='inherit'\n name={typeof plus === 'string' ? plus : undefined}\n icon={typeof plus !== 'string' ? plus : undefined}\n {...numberControlIconProps}\n />\n )}\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","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","palette","widthXXS","widthXS","widthS","widthM","widthL","widthXL","error","success","label","icon","text","primary","secondary","onColored","fluid","disabled","inline","inputRef","inputProps","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","min","undefined","Infinity","initValue","parseFloat","initDefaultValue","minValue","Math","plusDisabled","setPlusDisabled","max","maxValue","_jsx","Styled","input","FormInputLabel","onClick","focus","onFocus","evt","target","currentTarget","onBlur","onChange","currentValue","minValueReached","maxValueReached","stopPropagation","Boolean","_jsxs","_Fragment","children","Icon","as","name","Spacer","display","prev","stepDown","event","Event","bubbles","dispatchEvent","err","console","stepUp","SIZES","displayName","Phone","InputPhone"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
'use strict';var React=require('react');var withMergedProps=require('../../hocs/withMergedProps.js');var constants=require('./constants.js');var style=require('./style.js');var require$$0=require('react/jsx-runtime');const InputCheckbox=withMergedProps.withMergedProps(React.forwardRef((({size:e="m",sizeXXS:s,sizeXS:r,sizeS:
|
|
1
|
+
'use strict';var React=require('react');var withMergedProps=require('../../hocs/withMergedProps.js');var constants=require('./constants.js');var style=require('./style.js');var require$$0=require('react/jsx-runtime');const InputCheckbox=withMergedProps.withMergedProps(React.forwardRef((({size:e="m",sizeXXS:s,sizeXS:r,sizeS:t,sizeM:i,sizeL:n,sizeXL:a,sizes:o,sizeUnits:c,inline:l,error:u,success:d,contrast:p,onColored:z,palette:h,style:x,indeterminate:y,className:I,disabled:q,...$},b)=>require$$0.jsxs(style.Root,{size:e,sizeXXS:s,sizeXS:r,sizeS:t,sizeM:i,sizeL:n,sizeXL:a,sizes:o,sizeUnits:c,inline:l,error:u,success:d,contrast:p,onColored:z,palette:h,style:x,indeterminate:y,className:I,disabled:q,children:[require$$0.jsx(style.Input,{...$,disabled:q,type:"checkbox",ref:b}),require$$0.jsx(style.InputMask,{children:require$$0.jsx(y===!0?style.InputIndeterminate:style.InputChecked,{})})]}))),{displayName:"InputCheckbox",sizes:constants.SIZES});exports.COMPONENT_NAME="InputCheckbox",exports.InputCheckbox=InputCheckbox;
|
|
2
2
|
//# sourceMappingURL=InputCheckbox.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InputCheckbox.js","sources":["../../../../src/components/InputCheckbox/InputCheckbox.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { SIZES } from './constants'\nimport * as Styled from './style'\nimport type { InputCheckboxProps } from './types'\n\nconst COMPONENT_NAME = 'InputCheckbox'\n\n/**\n *\n *
|
|
1
|
+
{"version":3,"file":"InputCheckbox.js","sources":["../../../../src/components/InputCheckbox/InputCheckbox.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { SIZES } from './constants'\nimport * as Styled from './style'\nimport type { InputCheckboxProps } from './types'\n\nconst COMPONENT_NAME = 'InputCheckbox'\n\n/**\n *\n * Компонент поддерживает все атрибуты \\<input\\> элемента.\n *\n * Переданный \"ref\" будет ассоциирован с \\<input\\>.\n *\n * Поддерживаются пропсы определения размеров в зависимости от ширины вьюпорта.\n *\n * Полный интерфейс можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/InputCheckbox/types.ts).\n *\n * @visibleName Checkbox\n */\nconst InputCheckbox: React.ForwardRefExoticComponent<InputCheckboxProps> = withMergedProps<\n InputCheckboxProps,\n HTMLInputElement\n>(\n forwardRef(\n (\n {\n size = 'm',\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n sizes,\n sizeUnits,\n inline,\n error,\n success,\n contrast,\n onColored,\n palette,\n style,\n indeterminate,\n className,\n disabled,\n ...inputProps\n },\n ref\n ) => {\n return (\n <Styled.Root\n size={size}\n sizeXXS={sizeXXS}\n sizeXS={sizeXS}\n sizeS={sizeS}\n sizeM={sizeM}\n sizeL={sizeL}\n sizeXL={sizeXL}\n sizes={sizes}\n sizeUnits={sizeUnits}\n inline={inline}\n error={error}\n success={success}\n contrast={contrast}\n onColored={onColored}\n palette={palette}\n style={style}\n indeterminate={indeterminate}\n className={className}\n disabled={disabled}\n >\n <Styled.Input {...inputProps} disabled={disabled} type='checkbox' ref={ref} />\n <Styled.InputMask>\n {indeterminate === true ? <Styled.InputIndeterminate /> : <Styled.InputChecked />}\n </Styled.InputMask>\n </Styled.Root>\n )\n }\n ),\n {\n displayName: COMPONENT_NAME,\n sizes: SIZES,\n }\n)\n\nexport { InputCheckbox, COMPONENT_NAME }\n"],"names":["InputCheckbox","withMergedProps","forwardRef","size","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","sizes","sizeUnits","inline","error","success","contrast","onColored","palette","style","indeterminate","className","disabled","inputProps","ref","_jsxs","Styled","children","_jsx","jsx","type","InputChecked","displayName","SIZES"],"mappings":"yNAoBA,MAAMA,cAAqEC,gBAAAA,gBAIzEC,MAAAA,YACE,EAEIC,OAAO,IACPC,UACAC,SACAC,QACAC,QACAC,QACAC,SACAC,QACAC,YACAC,SACAC,QACAC,UACAC,WACAC,YACAC,gBACAC,EACAC,gBACAC,YACAC,cACGC,GAELC,IAGEC,WAAAA,KAACC,MAAAA,KAAW,CACVtB,KAAMA,EACNC,QAASA,EACTC,OAAQA,EACRC,MAAOA,EACPC,MAAOA,EACPC,MAAOA,EACPC,OAAQA,EACRC,MAAOA,EACPC,UAAWA,EACXC,OAAQA,EACRC,MAAOA,EACPC,QAASA,EACTC,SAAUA,EACVC,UAAWA,EACXC,QAASA,EACTC,MAAOA,EACPC,cAAeA,EACfC,UAAWA,EACXC,SAAUA,EAASK,SAEnBC,CAAAA,WAAAC,IAACH,YAAY,IAAKH,EAAYD,SAAUA,EAAUQ,KAAK,WAAWN,IAAKA,IACvEI,WAAAC,IAACH,gBAAgB,CAAAC,SACWC,eAAzBR,KAAkB,EAAQM,MAAAA,mBAAgCA,MAAmBK,aAA1B,CAAA,UAM9D,CACEC,YA3EmB,gBA4EnBrB,MAAOsB,UAAAA,+BA5EY"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{forwardRef}from'react';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{SIZES}from'./constants.mjs';import{Root,Input,InputMask,InputIndeterminate,InputChecked}from'./style.mjs';import{jsxs,jsx}from'react/jsx-runtime';const COMPONENT_NAME='InputCheckbox';const InputCheckbox=withMergedProps(forwardRef((({size:e="m",sizeXXS:s,sizeXS:t,sizeS:i,sizeM:r,sizeL:o,sizeXL:n,sizes:p,sizeUnits:a,inline:c,error:d,success:m,
|
|
1
|
+
import{forwardRef}from'react';import{withMergedProps}from'../../hocs/withMergedProps.mjs';import{SIZES}from'./constants.mjs';import{Root,Input,InputMask,InputIndeterminate,InputChecked}from'./style.mjs';import{jsxs,jsx}from'react/jsx-runtime';const COMPONENT_NAME='InputCheckbox';const InputCheckbox=withMergedProps(forwardRef((({size:e="m",sizeXXS:s,sizeXS:t,sizeS:i,sizeM:r,sizeL:o,sizeXL:n,sizes:p,sizeUnits:a,inline:c,error:d,success:m,contrast:z,onColored:l,palette:I,style:u,indeterminate:h,className:x,disabled:M,...f},j)=>jsxs(Root,{size:e,sizeXXS:s,sizeXS:t,sizeS:i,sizeM:r,sizeL:o,sizeXL:n,sizes:p,sizeUnits:a,inline:c,error:d,success:m,contrast:z,onColored:l,palette:I,style:u,indeterminate:h,className:x,disabled:M,children:[jsx(Input,{...f,disabled:M,type:"checkbox",ref:j}),jsx(InputMask,{children:jsx(h===!0?InputIndeterminate:InputChecked,{})})]}))),{displayName:"InputCheckbox",sizes:SIZES});export{COMPONENT_NAME,InputCheckbox};
|
|
2
2
|
//# sourceMappingURL=InputCheckbox.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InputCheckbox.mjs","sources":["../../../../src/components/InputCheckbox/InputCheckbox.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { SIZES } from './constants'\nimport * as Styled from './style'\nimport type { InputCheckboxProps } from './types'\n\nconst COMPONENT_NAME = 'InputCheckbox'\n\n/**\n *\n *
|
|
1
|
+
{"version":3,"file":"InputCheckbox.mjs","sources":["../../../../src/components/InputCheckbox/InputCheckbox.tsx"],"sourcesContent":["import { forwardRef } from 'react'\nimport { withMergedProps } from 'hocs/withMergedProps'\nimport { SIZES } from './constants'\nimport * as Styled from './style'\nimport type { InputCheckboxProps } from './types'\n\nconst COMPONENT_NAME = 'InputCheckbox'\n\n/**\n *\n * Компонент поддерживает все атрибуты \\<input\\> элемента.\n *\n * Переданный \"ref\" будет ассоциирован с \\<input\\>.\n *\n * Поддерживаются пропсы определения размеров в зависимости от ширины вьюпорта.\n *\n * Полный интерфейс можно посмотреть [тут](https://github.com/foxford/ui/blob/master/src/components/InputCheckbox/types.ts).\n *\n * @visibleName Checkbox\n */\nconst InputCheckbox: React.ForwardRefExoticComponent<InputCheckboxProps> = withMergedProps<\n InputCheckboxProps,\n HTMLInputElement\n>(\n forwardRef(\n (\n {\n size = 'm',\n sizeXXS,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n sizes,\n sizeUnits,\n inline,\n error,\n success,\n contrast,\n onColored,\n palette,\n style,\n indeterminate,\n className,\n disabled,\n ...inputProps\n },\n ref\n ) => {\n return (\n <Styled.Root\n size={size}\n sizeXXS={sizeXXS}\n sizeXS={sizeXS}\n sizeS={sizeS}\n sizeM={sizeM}\n sizeL={sizeL}\n sizeXL={sizeXL}\n sizes={sizes}\n sizeUnits={sizeUnits}\n inline={inline}\n error={error}\n success={success}\n contrast={contrast}\n onColored={onColored}\n palette={palette}\n style={style}\n indeterminate={indeterminate}\n className={className}\n disabled={disabled}\n >\n <Styled.Input {...inputProps} disabled={disabled} type='checkbox' ref={ref} />\n <Styled.InputMask>\n {indeterminate === true ? <Styled.InputIndeterminate /> : <Styled.InputChecked />}\n </Styled.InputMask>\n </Styled.Root>\n )\n }\n ),\n {\n displayName: COMPONENT_NAME,\n sizes: SIZES,\n }\n)\n\nexport { InputCheckbox, COMPONENT_NAME }\n"],"names":["COMPONENT_NAME","InputCheckbox","withMergedProps","forwardRef","size","sizeXXS","sizeXS","sizeS","sizeM","sizeL","sizeXL","sizes","sizeUnits","inline","error","success","contrast","onColored","palette","style","indeterminate","className","disabled","inputProps","ref","_jsxs","Styled","children","_jsx","type","displayName","SIZES"],"mappings":"mPAMMA,MAAAA,eAAiB,gBAcvB,MAAMC,cAAqEC,gBAIzEC,YACE,EAEIC,OAAO,IACPC,UACAC,SACAC,QACAC,QACAC,QACAC,SACAC,QACAC,YACAC,SACAC,QACAC,UACAC,WACAC,YACAC,UACAC,QACAC,gBACAC,YACAC,cACGC,GAELC,IAGEC,KAACC,KAAW,CACVtB,KAAMA,EACNC,QAASA,EACTC,OAAQA,EACRC,MAAOA,EACPC,MAAOA,EACPC,MAAOA,EACPC,OAAQA,EACRC,MAAOA,EACPC,UAAWA,EACXC,OAAQA,EACRC,MAAOA,EACPC,QAASA,EACTC,SAAUA,EACVC,UAAWA,EACXC,QAASA,EACTC,MAAOA,EACPC,cAAeA,EACfC,UAAWA,EACXC,SAAUA,EAASK,SAEnBC,CAAAA,IAACF,MAAY,IAAKH,EAAYD,SAAUA,EAAUO,KAAK,WAAWL,IAAKA,IACvEI,IAACF,UAAgB,CAAAC,SACWC,IAAzBR,KAAkB,EAAQM,mBAAgCA,aAAP,CAAA,UAM9D,CACEI,YA3EmB,gBA4EnBnB,MAAOoB"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
'use strict';exports.SIZES={
|
|
1
|
+
'use strict';exports.SIZES={xl:{width:32,height:32,borderRadius:7},l:{width:28,height:28,borderRadius:6},m:{width:24,height:24,borderRadius:5},s:{width:20,height:20,borderRadius:4},xs:{width:18,height:18,borderRadius:4}};
|
|
2
2
|
//# sourceMappingURL=constants.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"constants.js","sources":["../../../../src/components/InputCheckbox/constants.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport type {
|
|
1
|
+
{"version":3,"file":"constants.js","sources":["../../../../src/components/InputCheckbox/constants.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport type { CheckboxSize } from './types'\n\nexport const SIZES: Record<CheckboxSize, CSSProperties> = {\n xl: {\n width: 32,\n height: 32,\n borderRadius: 7,\n },\n l: {\n width: 28,\n height: 28,\n borderRadius: 6,\n },\n m: {\n width: 24,\n height: 24,\n borderRadius: 5,\n },\n s: {\n width: 20,\n height: 20,\n borderRadius: 4,\n },\n xs: {\n width: 18,\n height: 18,\n borderRadius: 4,\n },\n}\n"],"names":["xl","width","height","borderRadius","l","m","s","xs"],"mappings":"2BAG0D,CACxDA,GAAI,CACFC,MAAO,GACPC,OAAQ,GACRC,aAAc,GAEhBC,EAAG,CACDH,MAAO,GACPC,OAAQ,GACRC,aAAc,GAEhBE,EAAG,CACDJ,MAAO,GACPC,OAAQ,GACRC,aAAc,GAEhBG,EAAG,CACDL,MAAO,GACPC,OAAQ,GACRC,aAAc,GAEhBI,GAAI,CACFN,MAAO,GACPC,OAAQ,GACRC,aAAc"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
const SIZES={
|
|
1
|
+
const SIZES={xl:{width:32,height:32,borderRadius:7},l:{width:28,height:28,borderRadius:6},m:{width:24,height:24,borderRadius:5},s:{width:20,height:20,borderRadius:4},xs:{width:18,height:18,borderRadius:4}};export{SIZES};
|
|
2
2
|
//# sourceMappingURL=constants.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"constants.mjs","sources":["../../../../src/components/InputCheckbox/constants.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport type {
|
|
1
|
+
{"version":3,"file":"constants.mjs","sources":["../../../../src/components/InputCheckbox/constants.ts"],"sourcesContent":["import type { CSSProperties } from 'react'\nimport type { CheckboxSize } from './types'\n\nexport const SIZES: Record<CheckboxSize, CSSProperties> = {\n xl: {\n width: 32,\n height: 32,\n borderRadius: 7,\n },\n l: {\n width: 28,\n height: 28,\n borderRadius: 6,\n },\n m: {\n width: 24,\n height: 24,\n borderRadius: 5,\n },\n s: {\n width: 20,\n height: 20,\n borderRadius: 4,\n },\n xs: {\n width: 18,\n height: 18,\n borderRadius: 4,\n },\n}\n"],"names":["SIZES","xl","width","height","borderRadius","l","m","s","xs"],"mappings":"AAGO,MAAMA,MAA6C,CACxDC,GAAI,CACFC,MAAO,GACPC,OAAQ,GACRC,aAAc,GAEhBC,EAAG,CACDH,MAAO,GACPC,OAAQ,GACRC,aAAc,GAEhBE,EAAG,CACDJ,MAAO,GACPC,OAAQ,GACRC,aAAc,GAEhBG,EAAG,CACDL,MAAO,GACPC,OAAQ,GACRC,aAAc,GAEhBI,GAAI,CACFN,MAAO,GACPC,OAAQ,GACRC,aAAc"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
'use strict';var styled=require('styled-components');var style=require('../../shared/utils/style.js');var responsiveSize=require('../../mixins/responsive-size.js');var checked=require('./images/checked.svg.js');var indeterminate=require('./images/indeterminate.svg.js');function _interopDefault(o){return o&&o.__esModule?o:{default:o}}var styled__default=_interopDefault(styled);const shouldForwardInputCheckboxProp=style.createShouldForwardProp((o=>!['inline','error','success','onColored','indeterminate','disabled'].includes(o)));const Input=styled__default.default.input.withConfig({displayName:"InputCheckbox__Input",componentId:"ui__sc-3ztnvc-0"})(["box-sizing:border-box;position:absolute;top:0;left:0;margin:0;border:none;opacity:0;width:100%;height:100%;z-index:1;&:focus{outline:none;}"]);const InputMask=styled__default.default.span.withConfig({displayName:"InputCheckbox__InputMask",componentId:"ui__sc-3ztnvc-1"})(["box-sizing:border-box;position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;border:1px solid transparent;
|
|
1
|
+
'use strict';var styled=require('styled-components');var style=require('../../shared/utils/style.js');var responsiveSize=require('../../mixins/responsive-size.js');var checked=require('./images/checked.svg.js');var indeterminate=require('./images/indeterminate.svg.js');function _interopDefault(o){return o&&o.__esModule?o:{default:o}}var styled__default=_interopDefault(styled);const shouldForwardInputCheckboxProp=style.createShouldForwardProp((o=>!['inline','error','success','onColored','indeterminate','disabled'].includes(o)));const Input=styled__default.default.input.withConfig({displayName:"InputCheckbox__Input",componentId:"ui__sc-3ztnvc-0"})(["box-sizing:border-box;position:absolute;top:0;left:0;margin:0;border:none;opacity:0;width:100%;height:100%;z-index:1;&:focus{outline:none;}"]);const InputMask=styled__default.default.span.withConfig({displayName:"InputCheckbox__InputMask",componentId:"ui__sc-3ztnvc-1"})(["box-sizing:border-box;position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;border:1px solid transparent;"]);const InputChecked=styled__default.default(checked.default).withConfig({displayName:"InputCheckbox__InputChecked",componentId:"ui__sc-3ztnvc-2"})(["box-sizing:border-box;width:90%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);opacity:0;"]);const InputIndeterminate=styled__default.default(indeterminate.default).withConfig({displayName:"InputCheckbox__InputIndeterminate",componentId:"ui__sc-3ztnvc-3"})(["box-sizing:border-box;width:90%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);"]);const template=o=>`\n & > ${InputMask} {\n background-color: ${o.backgroundColor};\n border-color: ${o.borderColor};\n color: ${o.color};\n }\n &:hover > ${InputMask} {\n background-color: ${o.backgroundColorHover};\n border-color: ${o.borderColorHover};\n color: ${o.colorHover};\n }\n & > ${Input}:checked:not(:disabled) + ${InputMask} {\n background-color: ${o.backgroundColorChecked};\n border-color: ${o.borderColorChecked};\n color: ${o.colorChecked};\n }\n & > ${Input}:disabled:not(:checked) + ${InputMask} {\n background-color: ${o.backgroundColorDisabled};\n border-color: ${o.borderColorDisabled};\n color: ${o.colorDisabled};\n }\n & > ${Input}:disabled:checked + ${InputMask} {\n background-color: ${o.backgroundColorDisabledChecked};\n border-color: ${o.borderColorDisabledChecked};\n color: ${o.colorDisabledChecked};\n }\n`;const COLOR_SCHEMA={default:{error:styled.css(["",""],(({theme:o,palette:r,indeterminate:e})=>template({color:o.colors['content-oncolor-primary'],backgroundColor:e?o.colors['alert-bg-error-500']:o.colors['bg-onmain-primary'],borderColor:o.colors['alert-bg-error-500'],colorHover:o.colors['content-oncolor-primary'],backgroundColorHover:e?o.colors['alert-bg-error-500']:o.colors['bg-onmain-primary'],borderColorHover:o.colors['alert-bg-error-500'],colorChecked:o.colors['content-oncolor-primary'],backgroundColorChecked:o.colors['alert-bg-error-500'],borderColorChecked:o.colors['alert-bg-error-500'],colorDisabled:o.colors['bg-onmain-secondary'],backgroundColorDisabled:e?o.colors['bg-disabled-active']:o.colors['bg-disabled-large'],borderColorDisabled:e?o.colors['bg-disabled-active']:o.colors['border-disabled'],colorDisabledChecked:o.colors['bg-onmain-secondary'],backgroundColorDisabledChecked:o.colors['bg-disabled-active'],borderColorDisabledChecked:o.colors['bg-disabled-active'],...r}))),success:styled.css(["",""],(({theme:o,palette:r,indeterminate:e})=>template({color:o.colors['content-oncolor-primary'],backgroundColor:e?o.colors['alert-bg-success-500']:o.colors['bg-onmain-primary'],borderColor:o.colors['alert-bg-success-500'],colorHover:o.colors['content-oncolor-primary'],backgroundColorHover:e?o.colors['alert-bg-success-500']:o.colors['bg-onmain-primary'],borderColorHover:o.colors['alert-bg-success-500'],colorChecked:o.colors['content-oncolor-primary'],backgroundColorChecked:o.colors['alert-bg-success-500'],borderColorChecked:o.colors['alert-bg-success-500'],colorDisabled:o.colors['bg-onmain-secondary'],backgroundColorDisabled:e?o.colors['bg-disabled-active']:o.colors['bg-disabled-large'],borderColorDisabled:e?o.colors['bg-disabled-active']:o.colors['border-disabled'],colorDisabledChecked:o.colors['bg-onmain-secondary'],backgroundColorDisabledChecked:o.colors['bg-disabled-active'],borderColorDisabledChecked:o.colors['bg-disabled-active'],...r}))),default:styled.css(["",""],(({theme:o,palette:r,indeterminate:e})=>template({color:o.colors['content-oncolor-primary'],backgroundColor:e?o.colors['bg-brand-primary-basic']:o.colors['bg-onmain-primary'],borderColor:e?o.colors['bg-brand-primary-basic']:o.colors['border-onmain-default-small'],colorHover:o.colors['content-oncolor-primary'],backgroundColorHover:e?o.colors['bg-brand-primary-basic']:o.colors['bg-onmain-primary'],borderColorHover:e?o.colors['bg-brand-primary-basic']:o.colors['border-brand-primary'],colorChecked:o.colors['content-oncolor-primary'],backgroundColorChecked:o.colors['bg-brand-primary-basic'],borderColorChecked:o.colors['bg-brand-primary-basic'],colorDisabled:o.colors['bg-onmain-secondary'],backgroundColorDisabled:e?o.colors['bg-disabled-active']:o.colors['bg-disabled-large'],borderColorDisabled:e?o.colors['bg-disabled-active']:o.colors['border-disabled'],colorDisabledChecked:o.colors['bg-onmain-secondary'],backgroundColorDisabledChecked:o.colors['bg-disabled-active'],borderColorDisabledChecked:o.colors['bg-disabled-active'],...r})))},contrast:{error:styled.css(["",""],(({theme:o,palette:r,indeterminate:e})=>template({color:o.colors['content-oncolor-primary'],backgroundColor:e?o.colors['alert-bg-error-500']:o.colors['bg-onmain-secondary'],borderColor:e?o.colors['alert-bg-error-500']:o.colors['alert-error'],colorHover:o.colors['content-oncolor-primary'],backgroundColorHover:e?o.colors['alert-bg-error-500']:o.colors['bg-onmain-secondary'],borderColorHover:e?o.colors['alert-bg-error-500']:o.colors['alert-error'],colorChecked:o.colors['content-oncolor-primary'],backgroundColorChecked:o.colors['alert-bg-error-500'],borderColorChecked:o.colors['alert-bg-error-500'],colorDisabled:o.colors['bg-onmain-secondary'],backgroundColorDisabled:e?o.colors['bg-disabled-active']:o.colors['bg-disabled-small'],borderColorDisabled:e?o.colors['bg-disabled-active']:o.colors['border-disabled'],colorDisabledChecked:o.colors['bg-onmain-secondary'],backgroundColorDisabledChecked:o.colors['bg-disabled-active'],borderColorDisabledChecked:o.colors['bg-disabled-active'],...r}))),success:styled.css(["",""],(({theme:o,palette:r,indeterminate:e})=>template({color:o.colors['content-oncolor-primary'],backgroundColor:e?o.colors['alert-bg-success-500']:o.colors['bg-onmain-secondary'],borderColor:e?o.colors['alert-bg-success-500']:o.colors['alert-success'],colorHover:o.colors['content-oncolor-primary'],backgroundColorHover:e?o.colors['alert-bg-success-500']:o.colors['bg-onmain-secondary'],borderColorHover:e?o.colors['alert-bg-success-500']:o.colors['alert-success'],colorChecked:o.colors['content-oncolor-primary'],backgroundColorChecked:o.colors['alert-bg-success-500'],borderColorChecked:o.colors['alert-bg-success-500'],colorDisabled:o.colors['bg-onmain-secondary'],backgroundColorDisabled:e?o.colors['bg-disabled-active']:o.colors['bg-disabled-small'],borderColorDisabled:e?o.colors['bg-disabled-active']:o.colors['border-disabled'],colorDisabledChecked:o.colors['bg-onmain-secondary'],backgroundColorDisabledChecked:o.colors['bg-disabled-active'],borderColorDisabledChecked:o.colors['bg-disabled-active'],...r}))),default:styled.css(["",""],(({theme:o,palette:r,indeterminate:e})=>template({color:o.colors['bg-brand-primary-basic'],backgroundColor:e?o.colors['bg-oncolor-primary']:o.colors['bg-onmain-primary'],borderColor:e?o.colors['bg-oncolor-primary']:o.colors['border-onmain-default-small'],colorHover:o.colors['bg-brand-primary-basic'],backgroundColorHover:e?o.colors['bg-oncolor-primary']:o.colors['bg-onmain-primary'],borderColorHover:e?o.colors['bg-oncolor-primary']:o.colors['border-brand-primary'],colorChecked:o.colors['bg-brand-primary-basic'],backgroundColorChecked:o.colors['bg-oncolor-primary'],borderColorChecked:o.colors['bg-oncolor-primary'],colorDisabled:o.colors['bg-onmain-secondary'],backgroundColorDisabled:e?o.colors['bg-disabled-active']:o.colors['bg-disabled-small'],borderColorDisabled:e?o.colors['bg-disabled-active']:o.colors['border-disabled'],colorDisabledChecked:o.colors['bg-onmain-secondary'],backgroundColorDisabledChecked:o.colors['bg-disabled-active'],borderColorDisabledChecked:o.colors['bg-disabled-active'],...r})))}};const Root=styled__default.default.span.withConfig({shouldForwardProp:shouldForwardInputCheckboxProp}).withConfig({displayName:"InputCheckbox__Root",componentId:"ui__sc-3ztnvc-4"})([""," "," ",""],(o=>`\n box-sizing: border-box;\n isolation: isolate;\n position: relative;\n display: ${o.inline?'inline-flex':'flex'};\n flex-shrink: 0;\n cursor: ${o.disabled?'not-allowed':'pointer'};\n & > ${Input} {\n cursor: inherit;\n }\n & > ${Input}:checked + ${InputMask} > ${InputChecked} {\n opacity: 1;\n }\n & > ${Input}:focus-visible + ${InputMask} {\n box-shadow: 0 0 0 2px ${o.theme.colors.white}, 0 0 0 4px ${o.theme.colors['border-focus']};\n outline: 2px solid transparent;\n outline-offset: 2px;\n }\n `),(o=>{const r=o.contrast||o.onColored?COLOR_SCHEMA.contrast:COLOR_SCHEMA.default;return o.error?r.error:o.success?r.success:r.default}),responsiveSize.responsiveSize);exports.Input=Input,exports.InputChecked=InputChecked,exports.InputIndeterminate=InputIndeterminate,exports.InputMask=InputMask,exports.Root=Root;
|
|
2
2
|
//# sourceMappingURL=style.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"style.js","sources":["../../../../src/components/InputCheckbox/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport Checked from './images/checked.svg?module'\nimport Indeterminate from './images/indeterminate.svg?module'\nimport type { StyledInputCheckboxProps, InputCheckboxPalette } from './types'\n\nconst shouldForwardInputCheckboxProp = createShouldForwardProp(\n (propKey) => !['inline', 'error', 'success', 'onColored', 'indeterminate', 'disabled'].includes(propKey)\n)\n\nexport const Input = styled.input`\n box-sizing: border-box;\n position: absolute;\n top: 0;\n left: 0;\n margin: 0;\n border: none;\n opacity: 0;\n width: 100%;\n height: 100%;\n z-index: 1;\n &:focus {\n outline: none;\n }\n`\n\nexport const InputMask = styled.span`\n box-sizing: border-box;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n border-radius: inherit;\n border: 1px solid transparent;\n transition-property: border-color;\n transition-duration: 150ms;\n transition-timing-function: ease-in;\n`\n\nexport const InputChecked = styled(Checked)`\n box-sizing: border-box;\n width: 90%;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n opacity: 0;\n`\n\nexport const InputIndeterminate = styled(Indeterminate)`\n box-sizing: border-box;\n width: 90%;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n`\n\nconst template = (palette: InputCheckboxPalette) => `\n & > ${InputMask} {\n background-color: ${palette.backgroundColor};\n border-color: ${palette.borderColor};\n color: ${palette.color};\n }\n &:hover > ${InputMask} {\n background-color: ${palette.backgroundColorHover};\n border-color: ${palette.borderColorHover};\n color: ${palette.colorHover};\n }\n & > ${Input}:checked:not(:disabled) + ${InputMask} {\n background-color: ${palette.backgroundColorChecked};\n border-color: ${palette.borderColorChecked};\n color: ${palette.colorChecked};\n }\n & > ${Input}:disabled:not(:checked) + ${InputMask} {\n background-color: ${palette.backgroundColorDisabled};\n border-color: ${palette.borderColorDisabled};\n color: ${palette.colorDisabled};\n }\n & > ${Input}:disabled:checked + ${InputMask} {\n background-color: ${palette.backgroundColorDisabledChecked};\n border-color: ${palette.borderColorDisabledChecked};\n color: ${palette.colorDisabledChecked};\n }\n`\n\nconst COLOR_SCHEMA = {\n default: {\n error: css<StyledInputCheckboxProps>`\n ${({ theme, palette, indeterminate }) =>\n template({\n color: theme.colors['content-oncolor-primary'],\n backgroundColor: indeterminate ? theme.colors['alert-bg-error-500'] : theme.colors['bg-onmain-primary'],\n borderColor: theme.colors['alert-bg-error-500'],\n colorHover: theme.colors['content-oncolor-primary'],\n backgroundColorHover: indeterminate ? theme.colors['alert-bg-error-500'] : theme.colors['bg-onmain-primary'],\n borderColorHover: theme.colors['alert-bg-error-500'],\n colorChecked: theme.colors['content-oncolor-primary'],\n backgroundColorChecked: theme.colors['alert-bg-error-500'],\n borderColorChecked: theme.colors['alert-bg-error-500'],\n colorDisabled: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabled: indeterminate\n ? theme.colors['bg-disabled-active']\n : theme.colors['bg-disabled-large'],\n borderColorDisabled: indeterminate ? theme.colors['bg-disabled-active'] : theme.colors['border-disabled'],\n colorDisabledChecked: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabledChecked: theme.colors['bg-disabled-active'],\n borderColorDisabledChecked: theme.colors['bg-disabled-active'],\n ...palette,\n })}\n `,\n success: css<StyledInputCheckboxProps>`\n ${({ theme, palette, indeterminate }) =>\n template({\n color: theme.colors['content-oncolor-primary'],\n backgroundColor: indeterminate ? theme.colors['alert-bg-success-500'] : theme.colors['bg-onmain-primary'],\n borderColor: theme.colors['alert-bg-success-500'],\n colorHover: theme.colors['content-oncolor-primary'],\n backgroundColorHover: indeterminate\n ? theme.colors['alert-bg-success-500']\n : theme.colors['bg-onmain-primary'],\n borderColorHover: theme.colors['alert-bg-success-500'],\n colorChecked: theme.colors['content-oncolor-primary'],\n backgroundColorChecked: theme.colors['alert-bg-success-500'],\n borderColorChecked: theme.colors['alert-bg-success-500'],\n colorDisabled: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabled: indeterminate\n ? theme.colors['bg-disabled-active']\n : theme.colors['bg-disabled-large'],\n borderColorDisabled: indeterminate ? theme.colors['bg-disabled-active'] : theme.colors['border-disabled'],\n colorDisabledChecked: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabledChecked: theme.colors['bg-disabled-active'],\n borderColorDisabledChecked: theme.colors['bg-disabled-active'],\n ...palette,\n })}\n `,\n default: css<StyledInputCheckboxProps>`\n ${({ theme, palette, indeterminate }) =>\n template({\n color: theme.colors['content-oncolor-primary'],\n backgroundColor: indeterminate ? theme.colors['bg-brand-primary-basic'] : theme.colors['bg-onmain-primary'],\n borderColor: indeterminate\n ? theme.colors['bg-brand-primary-basic']\n : theme.colors['border-onmain-default-small'],\n colorHover: theme.colors['content-oncolor-primary'],\n backgroundColorHover: indeterminate\n ? theme.colors['bg-brand-primary-basic']\n : theme.colors['bg-onmain-primary'],\n borderColorHover: indeterminate\n ? theme.colors['bg-brand-primary-basic']\n : theme.colors['border-brand-primary'],\n colorChecked: theme.colors['content-oncolor-primary'],\n backgroundColorChecked: theme.colors['bg-brand-primary-basic'],\n borderColorChecked: theme.colors['bg-brand-primary-basic'],\n colorDisabled: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabled: indeterminate\n ? theme.colors['bg-disabled-active']\n : theme.colors['bg-disabled-large'],\n borderColorDisabled: indeterminate ? theme.colors['bg-disabled-active'] : theme.colors['border-disabled'],\n colorDisabledChecked: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabledChecked: theme.colors['bg-disabled-active'],\n borderColorDisabledChecked: theme.colors['bg-disabled-active'],\n ...palette,\n })}\n `,\n },\n onColored: {\n error: css<StyledInputCheckboxProps>`\n ${({ theme, palette, indeterminate }) =>\n template({\n color: theme.colors['content-oncolor-primary'],\n backgroundColor: indeterminate ? theme.colors['alert-bg-error-500'] : theme.colors['bg-onmain-secondary'],\n borderColor: indeterminate ? theme.colors['alert-bg-error-500'] : theme.colors['alert-error'],\n colorHover: theme.colors['content-oncolor-primary'],\n backgroundColorHover: indeterminate\n ? theme.colors['alert-bg-error-500']\n : theme.colors['bg-onmain-secondary'],\n borderColorHover: indeterminate ? theme.colors['alert-bg-error-500'] : theme.colors['alert-error'],\n colorChecked: theme.colors['content-oncolor-primary'],\n backgroundColorChecked: theme.colors['alert-bg-error-500'],\n borderColorChecked: theme.colors['alert-bg-error-500'],\n colorDisabled: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabled: indeterminate\n ? theme.colors['bg-disabled-active']\n : theme.colors['bg-disabled-small'],\n borderColorDisabled: indeterminate ? theme.colors['bg-disabled-active'] : theme.colors['border-disabled'],\n colorDisabledChecked: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabledChecked: theme.colors['bg-disabled-active'],\n borderColorDisabledChecked: theme.colors['bg-disabled-active'],\n ...palette,\n })}\n `,\n success: css<StyledInputCheckboxProps>`\n ${({ theme, palette, indeterminate }) =>\n template({\n color: theme.colors['content-oncolor-primary'],\n backgroundColor: indeterminate ? theme.colors['alert-bg-success-500'] : theme.colors['bg-onmain-secondary'],\n borderColor: indeterminate ? theme.colors['alert-bg-success-500'] : theme.colors['alert-success'],\n colorHover: theme.colors['content-oncolor-primary'],\n backgroundColorHover: indeterminate\n ? theme.colors['alert-bg-success-500']\n : theme.colors['bg-onmain-secondary'],\n borderColorHover: indeterminate ? theme.colors['alert-bg-success-500'] : theme.colors['alert-success'],\n colorChecked: theme.colors['content-oncolor-primary'],\n backgroundColorChecked: theme.colors['alert-bg-success-500'],\n borderColorChecked: theme.colors['alert-bg-success-500'],\n colorDisabled: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabled: indeterminate\n ? theme.colors['bg-disabled-active']\n : theme.colors['bg-disabled-small'],\n borderColorDisabled: indeterminate ? theme.colors['bg-disabled-active'] : theme.colors['border-disabled'],\n colorDisabledChecked: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabledChecked: theme.colors['bg-disabled-active'],\n borderColorDisabledChecked: theme.colors['bg-disabled-active'],\n ...palette,\n })}\n `,\n default: css<StyledInputCheckboxProps>`\n ${({ theme, palette, indeterminate }) =>\n template({\n color: theme.colors['bg-brand-primary-basic'],\n backgroundColor: indeterminate ? theme.colors['bg-oncolor-primary'] : theme.colors['bg-onmain-primary'],\n borderColor: indeterminate ? theme.colors['bg-oncolor-primary'] : theme.colors['border-onmain-default-small'],\n colorHover: theme.colors['bg-brand-primary-basic'],\n backgroundColorHover: indeterminate ? theme.colors['bg-oncolor-primary'] : theme.colors['bg-onmain-primary'],\n borderColorHover: indeterminate ? theme.colors['bg-oncolor-primary'] : theme.colors['border-brand-primary'],\n colorChecked: theme.colors['bg-brand-primary-basic'],\n backgroundColorChecked: theme.colors['bg-oncolor-primary'],\n borderColorChecked: theme.colors['bg-oncolor-primary'],\n colorDisabled: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabled: indeterminate\n ? theme.colors['bg-disabled-active']\n : theme.colors['bg-disabled-small'],\n borderColorDisabled: indeterminate ? theme.colors['bg-disabled-active'] : theme.colors['border-disabled'],\n colorDisabledChecked: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabledChecked: theme.colors['bg-disabled-active'],\n borderColorDisabledChecked: theme.colors['bg-disabled-active'],\n ...palette,\n })}\n `,\n },\n}\n\nexport const Root = styled.span\n .withConfig<StyledInputCheckboxProps>({\n shouldForwardProp: shouldForwardInputCheckboxProp,\n })\n .attrs(<Required<Pick<StyledInputCheckboxProps, 'dynamicSizeDeclaration'>>>{\n dynamicSizeDeclaration: (size, sizeUnits) => {\n return {\n fontSize: typeof size === 'string' ? size : `${size}${sizeUnits}`,\n height: '1em',\n width: '1em',\n borderRadius: '0.2em',\n }\n },\n })`\n ${(props) => `\n box-sizing: border-box;\n isolation: isolate;\n position: relative;\n display: ${props.inline ? 'inline-flex' : 'flex'};\n flex-shrink: 0;\n cursor: ${props.disabled ? 'not-allowed' : 'pointer'};\n & > ${Input} {\n cursor: inherit;\n }\n & > ${Input}:checked + ${InputMask} > ${InputChecked} {\n opacity: 1;\n }\n & > ${Input}:focus-visible + ${InputMask} {\n box-shadow: 0 0 0 2px ${props.theme.colors.white}, 0 0 0 4px ${props.theme.colors['border-focus']};\n outline: 2px solid transparent;\n outline-offset: 2px;\n }\n `}\n ${(props) => {\n const schema = props.onColored ? COLOR_SCHEMA.onColored : COLOR_SCHEMA.default\n\n if (props.error) return schema.error\n if (props.success) return schema.success\n\n return schema.default\n }}\n\n ${responsiveSize}\n`\n"],"names":["shouldForwardInputCheckboxProp","createShouldForwardProp","propKey","includes","Input","styled","input","withConfig","displayName","componentId","InputMask","span","InputChecked","default","Checked","InputIndeterminate","Indeterminate","template","palette","backgroundColor","borderColor","color","backgroundColorHover","borderColorHover","colorHover","backgroundColorChecked","borderColorChecked","colorChecked","backgroundColorDisabled","borderColorDisabled","colorDisabled","backgroundColorDisabledChecked","borderColorDisabledChecked","colorDisabledChecked","COLOR_SCHEMA","error","css","theme","indeterminate","colors","success","onColored","Root","shouldForwardProp","attrs","dynamicSizeDeclaration","size","sizeUnits","fontSize","height","width","borderRadius","props","inline","disabled","white","schema","responsiveSize"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"style.js","sources":["../../../../src/components/InputCheckbox/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport Checked from './images/checked.svg?module'\nimport Indeterminate from './images/indeterminate.svg?module'\nimport type { StyledInputCheckboxProps, InputCheckboxPalette } from './types'\n\nconst shouldForwardInputCheckboxProp = createShouldForwardProp(\n (propKey) => !['inline', 'error', 'success', 'onColored', 'indeterminate', 'disabled'].includes(propKey)\n)\n\nexport const Input = styled.input`\n box-sizing: border-box;\n position: absolute;\n top: 0;\n left: 0;\n margin: 0;\n border: none;\n opacity: 0;\n width: 100%;\n height: 100%;\n z-index: 1;\n &:focus {\n outline: none;\n }\n`\n\nexport const InputMask = styled.span`\n box-sizing: border-box;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n border-radius: inherit;\n border: 1px solid transparent;\n`\n\nexport const InputChecked = styled(Checked)`\n box-sizing: border-box;\n width: 90%;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n opacity: 0;\n`\n\nexport const InputIndeterminate = styled(Indeterminate)`\n box-sizing: border-box;\n width: 90%;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n`\n\nconst template = (palette: InputCheckboxPalette) => `\n & > ${InputMask} {\n background-color: ${palette.backgroundColor};\n border-color: ${palette.borderColor};\n color: ${palette.color};\n }\n &:hover > ${InputMask} {\n background-color: ${palette.backgroundColorHover};\n border-color: ${palette.borderColorHover};\n color: ${palette.colorHover};\n }\n & > ${Input}:checked:not(:disabled) + ${InputMask} {\n background-color: ${palette.backgroundColorChecked};\n border-color: ${palette.borderColorChecked};\n color: ${palette.colorChecked};\n }\n & > ${Input}:disabled:not(:checked) + ${InputMask} {\n background-color: ${palette.backgroundColorDisabled};\n border-color: ${palette.borderColorDisabled};\n color: ${palette.colorDisabled};\n }\n & > ${Input}:disabled:checked + ${InputMask} {\n background-color: ${palette.backgroundColorDisabledChecked};\n border-color: ${palette.borderColorDisabledChecked};\n color: ${palette.colorDisabledChecked};\n }\n`\n\nconst COLOR_SCHEMA = {\n default: {\n error: css<StyledInputCheckboxProps>`\n ${({ theme, palette, indeterminate }) =>\n template({\n color: theme.colors['content-oncolor-primary'],\n backgroundColor: indeterminate ? theme.colors['alert-bg-error-500'] : theme.colors['bg-onmain-primary'],\n borderColor: theme.colors['alert-bg-error-500'],\n colorHover: theme.colors['content-oncolor-primary'],\n backgroundColorHover: indeterminate ? theme.colors['alert-bg-error-500'] : theme.colors['bg-onmain-primary'],\n borderColorHover: theme.colors['alert-bg-error-500'],\n colorChecked: theme.colors['content-oncolor-primary'],\n backgroundColorChecked: theme.colors['alert-bg-error-500'],\n borderColorChecked: theme.colors['alert-bg-error-500'],\n colorDisabled: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabled: indeterminate\n ? theme.colors['bg-disabled-active']\n : theme.colors['bg-disabled-large'],\n borderColorDisabled: indeterminate ? theme.colors['bg-disabled-active'] : theme.colors['border-disabled'],\n colorDisabledChecked: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabledChecked: theme.colors['bg-disabled-active'],\n borderColorDisabledChecked: theme.colors['bg-disabled-active'],\n ...palette,\n })}\n `,\n success: css<StyledInputCheckboxProps>`\n ${({ theme, palette, indeterminate }) =>\n template({\n color: theme.colors['content-oncolor-primary'],\n backgroundColor: indeterminate ? theme.colors['alert-bg-success-500'] : theme.colors['bg-onmain-primary'],\n borderColor: theme.colors['alert-bg-success-500'],\n colorHover: theme.colors['content-oncolor-primary'],\n backgroundColorHover: indeterminate\n ? theme.colors['alert-bg-success-500']\n : theme.colors['bg-onmain-primary'],\n borderColorHover: theme.colors['alert-bg-success-500'],\n colorChecked: theme.colors['content-oncolor-primary'],\n backgroundColorChecked: theme.colors['alert-bg-success-500'],\n borderColorChecked: theme.colors['alert-bg-success-500'],\n colorDisabled: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabled: indeterminate\n ? theme.colors['bg-disabled-active']\n : theme.colors['bg-disabled-large'],\n borderColorDisabled: indeterminate ? theme.colors['bg-disabled-active'] : theme.colors['border-disabled'],\n colorDisabledChecked: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabledChecked: theme.colors['bg-disabled-active'],\n borderColorDisabledChecked: theme.colors['bg-disabled-active'],\n ...palette,\n })}\n `,\n default: css<StyledInputCheckboxProps>`\n ${({ theme, palette, indeterminate }) =>\n template({\n color: theme.colors['content-oncolor-primary'],\n backgroundColor: indeterminate ? theme.colors['bg-brand-primary-basic'] : theme.colors['bg-onmain-primary'],\n borderColor: indeterminate\n ? theme.colors['bg-brand-primary-basic']\n : theme.colors['border-onmain-default-small'],\n colorHover: theme.colors['content-oncolor-primary'],\n backgroundColorHover: indeterminate\n ? theme.colors['bg-brand-primary-basic']\n : theme.colors['bg-onmain-primary'],\n borderColorHover: indeterminate\n ? theme.colors['bg-brand-primary-basic']\n : theme.colors['border-brand-primary'],\n colorChecked: theme.colors['content-oncolor-primary'],\n backgroundColorChecked: theme.colors['bg-brand-primary-basic'],\n borderColorChecked: theme.colors['bg-brand-primary-basic'],\n colorDisabled: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabled: indeterminate\n ? theme.colors['bg-disabled-active']\n : theme.colors['bg-disabled-large'],\n borderColorDisabled: indeterminate ? theme.colors['bg-disabled-active'] : theme.colors['border-disabled'],\n colorDisabledChecked: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabledChecked: theme.colors['bg-disabled-active'],\n borderColorDisabledChecked: theme.colors['bg-disabled-active'],\n ...palette,\n })}\n `,\n },\n contrast: {\n error: css<StyledInputCheckboxProps>`\n ${({ theme, palette, indeterminate }) =>\n template({\n color: theme.colors['content-oncolor-primary'],\n backgroundColor: indeterminate ? theme.colors['alert-bg-error-500'] : theme.colors['bg-onmain-secondary'],\n borderColor: indeterminate ? theme.colors['alert-bg-error-500'] : theme.colors['alert-error'],\n colorHover: theme.colors['content-oncolor-primary'],\n backgroundColorHover: indeterminate\n ? theme.colors['alert-bg-error-500']\n : theme.colors['bg-onmain-secondary'],\n borderColorHover: indeterminate ? theme.colors['alert-bg-error-500'] : theme.colors['alert-error'],\n colorChecked: theme.colors['content-oncolor-primary'],\n backgroundColorChecked: theme.colors['alert-bg-error-500'],\n borderColorChecked: theme.colors['alert-bg-error-500'],\n colorDisabled: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabled: indeterminate\n ? theme.colors['bg-disabled-active']\n : theme.colors['bg-disabled-small'],\n borderColorDisabled: indeterminate ? theme.colors['bg-disabled-active'] : theme.colors['border-disabled'],\n colorDisabledChecked: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabledChecked: theme.colors['bg-disabled-active'],\n borderColorDisabledChecked: theme.colors['bg-disabled-active'],\n ...palette,\n })}\n `,\n success: css<StyledInputCheckboxProps>`\n ${({ theme, palette, indeterminate }) =>\n template({\n color: theme.colors['content-oncolor-primary'],\n backgroundColor: indeterminate ? theme.colors['alert-bg-success-500'] : theme.colors['bg-onmain-secondary'],\n borderColor: indeterminate ? theme.colors['alert-bg-success-500'] : theme.colors['alert-success'],\n colorHover: theme.colors['content-oncolor-primary'],\n backgroundColorHover: indeterminate\n ? theme.colors['alert-bg-success-500']\n : theme.colors['bg-onmain-secondary'],\n borderColorHover: indeterminate ? theme.colors['alert-bg-success-500'] : theme.colors['alert-success'],\n colorChecked: theme.colors['content-oncolor-primary'],\n backgroundColorChecked: theme.colors['alert-bg-success-500'],\n borderColorChecked: theme.colors['alert-bg-success-500'],\n colorDisabled: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabled: indeterminate\n ? theme.colors['bg-disabled-active']\n : theme.colors['bg-disabled-small'],\n borderColorDisabled: indeterminate ? theme.colors['bg-disabled-active'] : theme.colors['border-disabled'],\n colorDisabledChecked: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabledChecked: theme.colors['bg-disabled-active'],\n borderColorDisabledChecked: theme.colors['bg-disabled-active'],\n ...palette,\n })}\n `,\n default: css<StyledInputCheckboxProps>`\n ${({ theme, palette, indeterminate }) =>\n template({\n color: theme.colors['bg-brand-primary-basic'],\n backgroundColor: indeterminate ? theme.colors['bg-oncolor-primary'] : theme.colors['bg-onmain-primary'],\n borderColor: indeterminate ? theme.colors['bg-oncolor-primary'] : theme.colors['border-onmain-default-small'],\n colorHover: theme.colors['bg-brand-primary-basic'],\n backgroundColorHover: indeterminate ? theme.colors['bg-oncolor-primary'] : theme.colors['bg-onmain-primary'],\n borderColorHover: indeterminate ? theme.colors['bg-oncolor-primary'] : theme.colors['border-brand-primary'],\n colorChecked: theme.colors['bg-brand-primary-basic'],\n backgroundColorChecked: theme.colors['bg-oncolor-primary'],\n borderColorChecked: theme.colors['bg-oncolor-primary'],\n colorDisabled: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabled: indeterminate\n ? theme.colors['bg-disabled-active']\n : theme.colors['bg-disabled-small'],\n borderColorDisabled: indeterminate ? theme.colors['bg-disabled-active'] : theme.colors['border-disabled'],\n colorDisabledChecked: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabledChecked: theme.colors['bg-disabled-active'],\n borderColorDisabledChecked: theme.colors['bg-disabled-active'],\n ...palette,\n })}\n `,\n },\n}\n\nexport const Root = styled.span.withConfig<StyledInputCheckboxProps>({\n shouldForwardProp: shouldForwardInputCheckboxProp,\n})`\n ${(props) => `\n box-sizing: border-box;\n isolation: isolate;\n position: relative;\n display: ${props.inline ? 'inline-flex' : 'flex'};\n flex-shrink: 0;\n cursor: ${props.disabled ? 'not-allowed' : 'pointer'};\n & > ${Input} {\n cursor: inherit;\n }\n & > ${Input}:checked + ${InputMask} > ${InputChecked} {\n opacity: 1;\n }\n & > ${Input}:focus-visible + ${InputMask} {\n box-shadow: 0 0 0 2px ${props.theme.colors.white}, 0 0 0 4px ${props.theme.colors['border-focus']};\n outline: 2px solid transparent;\n outline-offset: 2px;\n }\n `}\n ${(props) => {\n const schema = props.contrast || props.onColored ? COLOR_SCHEMA.contrast : COLOR_SCHEMA.default\n\n if (props.error) return schema.error\n if (props.success) return schema.success\n\n return schema.default\n }}\n\n ${responsiveSize}\n`\n"],"names":["shouldForwardInputCheckboxProp","createShouldForwardProp","propKey","includes","Input","styled","input","withConfig","displayName","componentId","InputMask","span","InputChecked","default","Checked","InputIndeterminate","Indeterminate","template","palette","backgroundColor","borderColor","color","backgroundColorHover","borderColorHover","colorHover","backgroundColorChecked","borderColorChecked","colorChecked","backgroundColorDisabled","borderColorDisabled","colorDisabled","backgroundColorDisabledChecked","borderColorDisabledChecked","colorDisabledChecked","COLOR_SCHEMA","error","css","theme","indeterminate","colors","success","contrast","Root","shouldForwardProp","props","inline","disabled","white","schema","onColored","responsiveSize"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import styled,{css}from'styled-components';import{createShouldForwardProp}from'../../shared/utils/style.mjs';import{responsiveSize}from'../../mixins/responsive-size.mjs';import SvgChecked from'./images/checked.svg.mjs';import SvgIndeterminate from'./images/indeterminate.svg.mjs';const shouldForwardInputCheckboxProp=createShouldForwardProp((o=>!['inline','error','success','onColored','indeterminate','disabled'].includes(o)));const Input=styled.input.withConfig({displayName:"InputCheckbox__Input",componentId:"ui__sc-3ztnvc-0"})(["box-sizing:border-box;position:absolute;top:0;left:0;margin:0;border:none;opacity:0;width:100%;height:100%;z-index:1;&:focus{outline:none;}"]);const InputMask=styled.span.withConfig({displayName:"InputCheckbox__InputMask",componentId:"ui__sc-3ztnvc-1"})(["box-sizing:border-box;position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;border:1px solid transparent;
|
|
1
|
+
import styled,{css}from'styled-components';import{createShouldForwardProp}from'../../shared/utils/style.mjs';import{responsiveSize}from'../../mixins/responsive-size.mjs';import SvgChecked from'./images/checked.svg.mjs';import SvgIndeterminate from'./images/indeterminate.svg.mjs';const shouldForwardInputCheckboxProp=createShouldForwardProp((o=>!['inline','error','success','onColored','indeterminate','disabled'].includes(o)));const Input=styled.input.withConfig({displayName:"InputCheckbox__Input",componentId:"ui__sc-3ztnvc-0"})(["box-sizing:border-box;position:absolute;top:0;left:0;margin:0;border:none;opacity:0;width:100%;height:100%;z-index:1;&:focus{outline:none;}"]);const InputMask=styled.span.withConfig({displayName:"InputCheckbox__InputMask",componentId:"ui__sc-3ztnvc-1"})(["box-sizing:border-box;position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;border:1px solid transparent;"]);const InputChecked=styled(SvgChecked).withConfig({displayName:"InputCheckbox__InputChecked",componentId:"ui__sc-3ztnvc-2"})(["box-sizing:border-box;width:90%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);opacity:0;"]);const InputIndeterminate=styled(SvgIndeterminate).withConfig({displayName:"InputCheckbox__InputIndeterminate",componentId:"ui__sc-3ztnvc-3"})(["box-sizing:border-box;width:90%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);"]);const template=o=>`\n & > ${InputMask} {\n background-color: ${o.backgroundColor};\n border-color: ${o.borderColor};\n color: ${o.color};\n }\n &:hover > ${InputMask} {\n background-color: ${o.backgroundColorHover};\n border-color: ${o.borderColorHover};\n color: ${o.colorHover};\n }\n & > ${Input}:checked:not(:disabled) + ${InputMask} {\n background-color: ${o.backgroundColorChecked};\n border-color: ${o.borderColorChecked};\n color: ${o.colorChecked};\n }\n & > ${Input}:disabled:not(:checked) + ${InputMask} {\n background-color: ${o.backgroundColorDisabled};\n border-color: ${o.borderColorDisabled};\n color: ${o.colorDisabled};\n }\n & > ${Input}:disabled:checked + ${InputMask} {\n background-color: ${o.backgroundColorDisabledChecked};\n border-color: ${o.borderColorDisabledChecked};\n color: ${o.colorDisabledChecked};\n }\n`;const COLOR_SCHEMA={default:{error:css(["",""],(({theme:o,palette:r,indeterminate:e})=>template({color:o.colors['content-oncolor-primary'],backgroundColor:e?o.colors['alert-bg-error-500']:o.colors['bg-onmain-primary'],borderColor:o.colors['alert-bg-error-500'],colorHover:o.colors['content-oncolor-primary'],backgroundColorHover:e?o.colors['alert-bg-error-500']:o.colors['bg-onmain-primary'],borderColorHover:o.colors['alert-bg-error-500'],colorChecked:o.colors['content-oncolor-primary'],backgroundColorChecked:o.colors['alert-bg-error-500'],borderColorChecked:o.colors['alert-bg-error-500'],colorDisabled:o.colors['bg-onmain-secondary'],backgroundColorDisabled:e?o.colors['bg-disabled-active']:o.colors['bg-disabled-large'],borderColorDisabled:e?o.colors['bg-disabled-active']:o.colors['border-disabled'],colorDisabledChecked:o.colors['bg-onmain-secondary'],backgroundColorDisabledChecked:o.colors['bg-disabled-active'],borderColorDisabledChecked:o.colors['bg-disabled-active'],...r}))),success:css(["",""],(({theme:o,palette:r,indeterminate:e})=>template({color:o.colors['content-oncolor-primary'],backgroundColor:e?o.colors['alert-bg-success-500']:o.colors['bg-onmain-primary'],borderColor:o.colors['alert-bg-success-500'],colorHover:o.colors['content-oncolor-primary'],backgroundColorHover:e?o.colors['alert-bg-success-500']:o.colors['bg-onmain-primary'],borderColorHover:o.colors['alert-bg-success-500'],colorChecked:o.colors['content-oncolor-primary'],backgroundColorChecked:o.colors['alert-bg-success-500'],borderColorChecked:o.colors['alert-bg-success-500'],colorDisabled:o.colors['bg-onmain-secondary'],backgroundColorDisabled:e?o.colors['bg-disabled-active']:o.colors['bg-disabled-large'],borderColorDisabled:e?o.colors['bg-disabled-active']:o.colors['border-disabled'],colorDisabledChecked:o.colors['bg-onmain-secondary'],backgroundColorDisabledChecked:o.colors['bg-disabled-active'],borderColorDisabledChecked:o.colors['bg-disabled-active'],...r}))),default:css(["",""],(({theme:o,palette:r,indeterminate:e})=>template({color:o.colors['content-oncolor-primary'],backgroundColor:e?o.colors['bg-brand-primary-basic']:o.colors['bg-onmain-primary'],borderColor:e?o.colors['bg-brand-primary-basic']:o.colors['border-onmain-default-small'],colorHover:o.colors['content-oncolor-primary'],backgroundColorHover:e?o.colors['bg-brand-primary-basic']:o.colors['bg-onmain-primary'],borderColorHover:e?o.colors['bg-brand-primary-basic']:o.colors['border-brand-primary'],colorChecked:o.colors['content-oncolor-primary'],backgroundColorChecked:o.colors['bg-brand-primary-basic'],borderColorChecked:o.colors['bg-brand-primary-basic'],colorDisabled:o.colors['bg-onmain-secondary'],backgroundColorDisabled:e?o.colors['bg-disabled-active']:o.colors['bg-disabled-large'],borderColorDisabled:e?o.colors['bg-disabled-active']:o.colors['border-disabled'],colorDisabledChecked:o.colors['bg-onmain-secondary'],backgroundColorDisabledChecked:o.colors['bg-disabled-active'],borderColorDisabledChecked:o.colors['bg-disabled-active'],...r})))},contrast:{error:css(["",""],(({theme:o,palette:r,indeterminate:e})=>template({color:o.colors['content-oncolor-primary'],backgroundColor:e?o.colors['alert-bg-error-500']:o.colors['bg-onmain-secondary'],borderColor:e?o.colors['alert-bg-error-500']:o.colors['alert-error'],colorHover:o.colors['content-oncolor-primary'],backgroundColorHover:e?o.colors['alert-bg-error-500']:o.colors['bg-onmain-secondary'],borderColorHover:e?o.colors['alert-bg-error-500']:o.colors['alert-error'],colorChecked:o.colors['content-oncolor-primary'],backgroundColorChecked:o.colors['alert-bg-error-500'],borderColorChecked:o.colors['alert-bg-error-500'],colorDisabled:o.colors['bg-onmain-secondary'],backgroundColorDisabled:e?o.colors['bg-disabled-active']:o.colors['bg-disabled-small'],borderColorDisabled:e?o.colors['bg-disabled-active']:o.colors['border-disabled'],colorDisabledChecked:o.colors['bg-onmain-secondary'],backgroundColorDisabledChecked:o.colors['bg-disabled-active'],borderColorDisabledChecked:o.colors['bg-disabled-active'],...r}))),success:css(["",""],(({theme:o,palette:r,indeterminate:e})=>template({color:o.colors['content-oncolor-primary'],backgroundColor:e?o.colors['alert-bg-success-500']:o.colors['bg-onmain-secondary'],borderColor:e?o.colors['alert-bg-success-500']:o.colors['alert-success'],colorHover:o.colors['content-oncolor-primary'],backgroundColorHover:e?o.colors['alert-bg-success-500']:o.colors['bg-onmain-secondary'],borderColorHover:e?o.colors['alert-bg-success-500']:o.colors['alert-success'],colorChecked:o.colors['content-oncolor-primary'],backgroundColorChecked:o.colors['alert-bg-success-500'],borderColorChecked:o.colors['alert-bg-success-500'],colorDisabled:o.colors['bg-onmain-secondary'],backgroundColorDisabled:e?o.colors['bg-disabled-active']:o.colors['bg-disabled-small'],borderColorDisabled:e?o.colors['bg-disabled-active']:o.colors['border-disabled'],colorDisabledChecked:o.colors['bg-onmain-secondary'],backgroundColorDisabledChecked:o.colors['bg-disabled-active'],borderColorDisabledChecked:o.colors['bg-disabled-active'],...r}))),default:css(["",""],(({theme:o,palette:r,indeterminate:e})=>template({color:o.colors['bg-brand-primary-basic'],backgroundColor:e?o.colors['bg-oncolor-primary']:o.colors['bg-onmain-primary'],borderColor:e?o.colors['bg-oncolor-primary']:o.colors['border-onmain-default-small'],colorHover:o.colors['bg-brand-primary-basic'],backgroundColorHover:e?o.colors['bg-oncolor-primary']:o.colors['bg-onmain-primary'],borderColorHover:e?o.colors['bg-oncolor-primary']:o.colors['border-brand-primary'],colorChecked:o.colors['bg-brand-primary-basic'],backgroundColorChecked:o.colors['bg-oncolor-primary'],borderColorChecked:o.colors['bg-oncolor-primary'],colorDisabled:o.colors['bg-onmain-secondary'],backgroundColorDisabled:e?o.colors['bg-disabled-active']:o.colors['bg-disabled-small'],borderColorDisabled:e?o.colors['bg-disabled-active']:o.colors['border-disabled'],colorDisabledChecked:o.colors['bg-onmain-secondary'],backgroundColorDisabledChecked:o.colors['bg-disabled-active'],borderColorDisabledChecked:o.colors['bg-disabled-active'],...r})))}};const Root=styled.span.withConfig({shouldForwardProp:shouldForwardInputCheckboxProp}).withConfig({displayName:"InputCheckbox__Root",componentId:"ui__sc-3ztnvc-4"})([""," "," ",""],(o=>`\n box-sizing: border-box;\n isolation: isolate;\n position: relative;\n display: ${o.inline?'inline-flex':'flex'};\n flex-shrink: 0;\n cursor: ${o.disabled?'not-allowed':'pointer'};\n & > ${Input} {\n cursor: inherit;\n }\n & > ${Input}:checked + ${InputMask} > ${InputChecked} {\n opacity: 1;\n }\n & > ${Input}:focus-visible + ${InputMask} {\n box-shadow: 0 0 0 2px ${o.theme.colors.white}, 0 0 0 4px ${o.theme.colors['border-focus']};\n outline: 2px solid transparent;\n outline-offset: 2px;\n }\n `),(o=>{const r=o.contrast||o.onColored?COLOR_SCHEMA.contrast:COLOR_SCHEMA.default;return o.error?r.error:o.success?r.success:r.default}),responsiveSize);export{Input,InputChecked,InputIndeterminate,InputMask,Root};
|
|
2
2
|
//# sourceMappingURL=style.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"style.mjs","sources":["../../../../src/components/InputCheckbox/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport Checked from './images/checked.svg?module'\nimport Indeterminate from './images/indeterminate.svg?module'\nimport type { StyledInputCheckboxProps, InputCheckboxPalette } from './types'\n\nconst shouldForwardInputCheckboxProp = createShouldForwardProp(\n (propKey) => !['inline', 'error', 'success', 'onColored', 'indeterminate', 'disabled'].includes(propKey)\n)\n\nexport const Input = styled.input`\n box-sizing: border-box;\n position: absolute;\n top: 0;\n left: 0;\n margin: 0;\n border: none;\n opacity: 0;\n width: 100%;\n height: 100%;\n z-index: 1;\n &:focus {\n outline: none;\n }\n`\n\nexport const InputMask = styled.span`\n box-sizing: border-box;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n border-radius: inherit;\n border: 1px solid transparent;\n transition-property: border-color;\n transition-duration: 150ms;\n transition-timing-function: ease-in;\n`\n\nexport const InputChecked = styled(Checked)`\n box-sizing: border-box;\n width: 90%;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n opacity: 0;\n`\n\nexport const InputIndeterminate = styled(Indeterminate)`\n box-sizing: border-box;\n width: 90%;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n`\n\nconst template = (palette: InputCheckboxPalette) => `\n & > ${InputMask} {\n background-color: ${palette.backgroundColor};\n border-color: ${palette.borderColor};\n color: ${palette.color};\n }\n &:hover > ${InputMask} {\n background-color: ${palette.backgroundColorHover};\n border-color: ${palette.borderColorHover};\n color: ${palette.colorHover};\n }\n & > ${Input}:checked:not(:disabled) + ${InputMask} {\n background-color: ${palette.backgroundColorChecked};\n border-color: ${palette.borderColorChecked};\n color: ${palette.colorChecked};\n }\n & > ${Input}:disabled:not(:checked) + ${InputMask} {\n background-color: ${palette.backgroundColorDisabled};\n border-color: ${palette.borderColorDisabled};\n color: ${palette.colorDisabled};\n }\n & > ${Input}:disabled:checked + ${InputMask} {\n background-color: ${palette.backgroundColorDisabledChecked};\n border-color: ${palette.borderColorDisabledChecked};\n color: ${palette.colorDisabledChecked};\n }\n`\n\nconst COLOR_SCHEMA = {\n default: {\n error: css<StyledInputCheckboxProps>`\n ${({ theme, palette, indeterminate }) =>\n template({\n color: theme.colors['content-oncolor-primary'],\n backgroundColor: indeterminate ? theme.colors['alert-bg-error-500'] : theme.colors['bg-onmain-primary'],\n borderColor: theme.colors['alert-bg-error-500'],\n colorHover: theme.colors['content-oncolor-primary'],\n backgroundColorHover: indeterminate ? theme.colors['alert-bg-error-500'] : theme.colors['bg-onmain-primary'],\n borderColorHover: theme.colors['alert-bg-error-500'],\n colorChecked: theme.colors['content-oncolor-primary'],\n backgroundColorChecked: theme.colors['alert-bg-error-500'],\n borderColorChecked: theme.colors['alert-bg-error-500'],\n colorDisabled: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabled: indeterminate\n ? theme.colors['bg-disabled-active']\n : theme.colors['bg-disabled-large'],\n borderColorDisabled: indeterminate ? theme.colors['bg-disabled-active'] : theme.colors['border-disabled'],\n colorDisabledChecked: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabledChecked: theme.colors['bg-disabled-active'],\n borderColorDisabledChecked: theme.colors['bg-disabled-active'],\n ...palette,\n })}\n `,\n success: css<StyledInputCheckboxProps>`\n ${({ theme, palette, indeterminate }) =>\n template({\n color: theme.colors['content-oncolor-primary'],\n backgroundColor: indeterminate ? theme.colors['alert-bg-success-500'] : theme.colors['bg-onmain-primary'],\n borderColor: theme.colors['alert-bg-success-500'],\n colorHover: theme.colors['content-oncolor-primary'],\n backgroundColorHover: indeterminate\n ? theme.colors['alert-bg-success-500']\n : theme.colors['bg-onmain-primary'],\n borderColorHover: theme.colors['alert-bg-success-500'],\n colorChecked: theme.colors['content-oncolor-primary'],\n backgroundColorChecked: theme.colors['alert-bg-success-500'],\n borderColorChecked: theme.colors['alert-bg-success-500'],\n colorDisabled: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabled: indeterminate\n ? theme.colors['bg-disabled-active']\n : theme.colors['bg-disabled-large'],\n borderColorDisabled: indeterminate ? theme.colors['bg-disabled-active'] : theme.colors['border-disabled'],\n colorDisabledChecked: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabledChecked: theme.colors['bg-disabled-active'],\n borderColorDisabledChecked: theme.colors['bg-disabled-active'],\n ...palette,\n })}\n `,\n default: css<StyledInputCheckboxProps>`\n ${({ theme, palette, indeterminate }) =>\n template({\n color: theme.colors['content-oncolor-primary'],\n backgroundColor: indeterminate ? theme.colors['bg-brand-primary-basic'] : theme.colors['bg-onmain-primary'],\n borderColor: indeterminate\n ? theme.colors['bg-brand-primary-basic']\n : theme.colors['border-onmain-default-small'],\n colorHover: theme.colors['content-oncolor-primary'],\n backgroundColorHover: indeterminate\n ? theme.colors['bg-brand-primary-basic']\n : theme.colors['bg-onmain-primary'],\n borderColorHover: indeterminate\n ? theme.colors['bg-brand-primary-basic']\n : theme.colors['border-brand-primary'],\n colorChecked: theme.colors['content-oncolor-primary'],\n backgroundColorChecked: theme.colors['bg-brand-primary-basic'],\n borderColorChecked: theme.colors['bg-brand-primary-basic'],\n colorDisabled: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabled: indeterminate\n ? theme.colors['bg-disabled-active']\n : theme.colors['bg-disabled-large'],\n borderColorDisabled: indeterminate ? theme.colors['bg-disabled-active'] : theme.colors['border-disabled'],\n colorDisabledChecked: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabledChecked: theme.colors['bg-disabled-active'],\n borderColorDisabledChecked: theme.colors['bg-disabled-active'],\n ...palette,\n })}\n `,\n },\n onColored: {\n error: css<StyledInputCheckboxProps>`\n ${({ theme, palette, indeterminate }) =>\n template({\n color: theme.colors['content-oncolor-primary'],\n backgroundColor: indeterminate ? theme.colors['alert-bg-error-500'] : theme.colors['bg-onmain-secondary'],\n borderColor: indeterminate ? theme.colors['alert-bg-error-500'] : theme.colors['alert-error'],\n colorHover: theme.colors['content-oncolor-primary'],\n backgroundColorHover: indeterminate\n ? theme.colors['alert-bg-error-500']\n : theme.colors['bg-onmain-secondary'],\n borderColorHover: indeterminate ? theme.colors['alert-bg-error-500'] : theme.colors['alert-error'],\n colorChecked: theme.colors['content-oncolor-primary'],\n backgroundColorChecked: theme.colors['alert-bg-error-500'],\n borderColorChecked: theme.colors['alert-bg-error-500'],\n colorDisabled: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabled: indeterminate\n ? theme.colors['bg-disabled-active']\n : theme.colors['bg-disabled-small'],\n borderColorDisabled: indeterminate ? theme.colors['bg-disabled-active'] : theme.colors['border-disabled'],\n colorDisabledChecked: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabledChecked: theme.colors['bg-disabled-active'],\n borderColorDisabledChecked: theme.colors['bg-disabled-active'],\n ...palette,\n })}\n `,\n success: css<StyledInputCheckboxProps>`\n ${({ theme, palette, indeterminate }) =>\n template({\n color: theme.colors['content-oncolor-primary'],\n backgroundColor: indeterminate ? theme.colors['alert-bg-success-500'] : theme.colors['bg-onmain-secondary'],\n borderColor: indeterminate ? theme.colors['alert-bg-success-500'] : theme.colors['alert-success'],\n colorHover: theme.colors['content-oncolor-primary'],\n backgroundColorHover: indeterminate\n ? theme.colors['alert-bg-success-500']\n : theme.colors['bg-onmain-secondary'],\n borderColorHover: indeterminate ? theme.colors['alert-bg-success-500'] : theme.colors['alert-success'],\n colorChecked: theme.colors['content-oncolor-primary'],\n backgroundColorChecked: theme.colors['alert-bg-success-500'],\n borderColorChecked: theme.colors['alert-bg-success-500'],\n colorDisabled: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabled: indeterminate\n ? theme.colors['bg-disabled-active']\n : theme.colors['bg-disabled-small'],\n borderColorDisabled: indeterminate ? theme.colors['bg-disabled-active'] : theme.colors['border-disabled'],\n colorDisabledChecked: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabledChecked: theme.colors['bg-disabled-active'],\n borderColorDisabledChecked: theme.colors['bg-disabled-active'],\n ...palette,\n })}\n `,\n default: css<StyledInputCheckboxProps>`\n ${({ theme, palette, indeterminate }) =>\n template({\n color: theme.colors['bg-brand-primary-basic'],\n backgroundColor: indeterminate ? theme.colors['bg-oncolor-primary'] : theme.colors['bg-onmain-primary'],\n borderColor: indeterminate ? theme.colors['bg-oncolor-primary'] : theme.colors['border-onmain-default-small'],\n colorHover: theme.colors['bg-brand-primary-basic'],\n backgroundColorHover: indeterminate ? theme.colors['bg-oncolor-primary'] : theme.colors['bg-onmain-primary'],\n borderColorHover: indeterminate ? theme.colors['bg-oncolor-primary'] : theme.colors['border-brand-primary'],\n colorChecked: theme.colors['bg-brand-primary-basic'],\n backgroundColorChecked: theme.colors['bg-oncolor-primary'],\n borderColorChecked: theme.colors['bg-oncolor-primary'],\n colorDisabled: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabled: indeterminate\n ? theme.colors['bg-disabled-active']\n : theme.colors['bg-disabled-small'],\n borderColorDisabled: indeterminate ? theme.colors['bg-disabled-active'] : theme.colors['border-disabled'],\n colorDisabledChecked: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabledChecked: theme.colors['bg-disabled-active'],\n borderColorDisabledChecked: theme.colors['bg-disabled-active'],\n ...palette,\n })}\n `,\n },\n}\n\nexport const Root = styled.span\n .withConfig<StyledInputCheckboxProps>({\n shouldForwardProp: shouldForwardInputCheckboxProp,\n })\n .attrs(<Required<Pick<StyledInputCheckboxProps, 'dynamicSizeDeclaration'>>>{\n dynamicSizeDeclaration: (size, sizeUnits) => {\n return {\n fontSize: typeof size === 'string' ? size : `${size}${sizeUnits}`,\n height: '1em',\n width: '1em',\n borderRadius: '0.2em',\n }\n },\n })`\n ${(props) => `\n box-sizing: border-box;\n isolation: isolate;\n position: relative;\n display: ${props.inline ? 'inline-flex' : 'flex'};\n flex-shrink: 0;\n cursor: ${props.disabled ? 'not-allowed' : 'pointer'};\n & > ${Input} {\n cursor: inherit;\n }\n & > ${Input}:checked + ${InputMask} > ${InputChecked} {\n opacity: 1;\n }\n & > ${Input}:focus-visible + ${InputMask} {\n box-shadow: 0 0 0 2px ${props.theme.colors.white}, 0 0 0 4px ${props.theme.colors['border-focus']};\n outline: 2px solid transparent;\n outline-offset: 2px;\n }\n `}\n ${(props) => {\n const schema = props.onColored ? COLOR_SCHEMA.onColored : COLOR_SCHEMA.default\n\n if (props.error) return schema.error\n if (props.success) return schema.success\n\n return schema.default\n }}\n\n ${responsiveSize}\n`\n"],"names":["shouldForwardInputCheckboxProp","createShouldForwardProp","propKey","includes","Input","styled","input","withConfig","displayName","componentId","InputMask","span","InputChecked","Checked","InputIndeterminate","Indeterminate","template","palette","backgroundColor","borderColor","color","backgroundColorHover","borderColorHover","colorHover","backgroundColorChecked","borderColorChecked","colorChecked","backgroundColorDisabled","borderColorDisabled","colorDisabled","backgroundColorDisabledChecked","borderColorDisabledChecked","colorDisabledChecked","COLOR_SCHEMA","default","error","css","theme","indeterminate","colors","success","onColored","Root","shouldForwardProp","attrs","dynamicSizeDeclaration","size","sizeUnits","fontSize","height","width","borderRadius","props","inline","disabled","white","schema","responsiveSize"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"style.mjs","sources":["../../../../src/components/InputCheckbox/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport Checked from './images/checked.svg?module'\nimport Indeterminate from './images/indeterminate.svg?module'\nimport type { StyledInputCheckboxProps, InputCheckboxPalette } from './types'\n\nconst shouldForwardInputCheckboxProp = createShouldForwardProp(\n (propKey) => !['inline', 'error', 'success', 'onColored', 'indeterminate', 'disabled'].includes(propKey)\n)\n\nexport const Input = styled.input`\n box-sizing: border-box;\n position: absolute;\n top: 0;\n left: 0;\n margin: 0;\n border: none;\n opacity: 0;\n width: 100%;\n height: 100%;\n z-index: 1;\n &:focus {\n outline: none;\n }\n`\n\nexport const InputMask = styled.span`\n box-sizing: border-box;\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n border-radius: inherit;\n border: 1px solid transparent;\n`\n\nexport const InputChecked = styled(Checked)`\n box-sizing: border-box;\n width: 90%;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n opacity: 0;\n`\n\nexport const InputIndeterminate = styled(Indeterminate)`\n box-sizing: border-box;\n width: 90%;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n`\n\nconst template = (palette: InputCheckboxPalette) => `\n & > ${InputMask} {\n background-color: ${palette.backgroundColor};\n border-color: ${palette.borderColor};\n color: ${palette.color};\n }\n &:hover > ${InputMask} {\n background-color: ${palette.backgroundColorHover};\n border-color: ${palette.borderColorHover};\n color: ${palette.colorHover};\n }\n & > ${Input}:checked:not(:disabled) + ${InputMask} {\n background-color: ${palette.backgroundColorChecked};\n border-color: ${palette.borderColorChecked};\n color: ${palette.colorChecked};\n }\n & > ${Input}:disabled:not(:checked) + ${InputMask} {\n background-color: ${palette.backgroundColorDisabled};\n border-color: ${palette.borderColorDisabled};\n color: ${palette.colorDisabled};\n }\n & > ${Input}:disabled:checked + ${InputMask} {\n background-color: ${palette.backgroundColorDisabledChecked};\n border-color: ${palette.borderColorDisabledChecked};\n color: ${palette.colorDisabledChecked};\n }\n`\n\nconst COLOR_SCHEMA = {\n default: {\n error: css<StyledInputCheckboxProps>`\n ${({ theme, palette, indeterminate }) =>\n template({\n color: theme.colors['content-oncolor-primary'],\n backgroundColor: indeterminate ? theme.colors['alert-bg-error-500'] : theme.colors['bg-onmain-primary'],\n borderColor: theme.colors['alert-bg-error-500'],\n colorHover: theme.colors['content-oncolor-primary'],\n backgroundColorHover: indeterminate ? theme.colors['alert-bg-error-500'] : theme.colors['bg-onmain-primary'],\n borderColorHover: theme.colors['alert-bg-error-500'],\n colorChecked: theme.colors['content-oncolor-primary'],\n backgroundColorChecked: theme.colors['alert-bg-error-500'],\n borderColorChecked: theme.colors['alert-bg-error-500'],\n colorDisabled: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabled: indeterminate\n ? theme.colors['bg-disabled-active']\n : theme.colors['bg-disabled-large'],\n borderColorDisabled: indeterminate ? theme.colors['bg-disabled-active'] : theme.colors['border-disabled'],\n colorDisabledChecked: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabledChecked: theme.colors['bg-disabled-active'],\n borderColorDisabledChecked: theme.colors['bg-disabled-active'],\n ...palette,\n })}\n `,\n success: css<StyledInputCheckboxProps>`\n ${({ theme, palette, indeterminate }) =>\n template({\n color: theme.colors['content-oncolor-primary'],\n backgroundColor: indeterminate ? theme.colors['alert-bg-success-500'] : theme.colors['bg-onmain-primary'],\n borderColor: theme.colors['alert-bg-success-500'],\n colorHover: theme.colors['content-oncolor-primary'],\n backgroundColorHover: indeterminate\n ? theme.colors['alert-bg-success-500']\n : theme.colors['bg-onmain-primary'],\n borderColorHover: theme.colors['alert-bg-success-500'],\n colorChecked: theme.colors['content-oncolor-primary'],\n backgroundColorChecked: theme.colors['alert-bg-success-500'],\n borderColorChecked: theme.colors['alert-bg-success-500'],\n colorDisabled: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabled: indeterminate\n ? theme.colors['bg-disabled-active']\n : theme.colors['bg-disabled-large'],\n borderColorDisabled: indeterminate ? theme.colors['bg-disabled-active'] : theme.colors['border-disabled'],\n colorDisabledChecked: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabledChecked: theme.colors['bg-disabled-active'],\n borderColorDisabledChecked: theme.colors['bg-disabled-active'],\n ...palette,\n })}\n `,\n default: css<StyledInputCheckboxProps>`\n ${({ theme, palette, indeterminate }) =>\n template({\n color: theme.colors['content-oncolor-primary'],\n backgroundColor: indeterminate ? theme.colors['bg-brand-primary-basic'] : theme.colors['bg-onmain-primary'],\n borderColor: indeterminate\n ? theme.colors['bg-brand-primary-basic']\n : theme.colors['border-onmain-default-small'],\n colorHover: theme.colors['content-oncolor-primary'],\n backgroundColorHover: indeterminate\n ? theme.colors['bg-brand-primary-basic']\n : theme.colors['bg-onmain-primary'],\n borderColorHover: indeterminate\n ? theme.colors['bg-brand-primary-basic']\n : theme.colors['border-brand-primary'],\n colorChecked: theme.colors['content-oncolor-primary'],\n backgroundColorChecked: theme.colors['bg-brand-primary-basic'],\n borderColorChecked: theme.colors['bg-brand-primary-basic'],\n colorDisabled: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabled: indeterminate\n ? theme.colors['bg-disabled-active']\n : theme.colors['bg-disabled-large'],\n borderColorDisabled: indeterminate ? theme.colors['bg-disabled-active'] : theme.colors['border-disabled'],\n colorDisabledChecked: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabledChecked: theme.colors['bg-disabled-active'],\n borderColorDisabledChecked: theme.colors['bg-disabled-active'],\n ...palette,\n })}\n `,\n },\n contrast: {\n error: css<StyledInputCheckboxProps>`\n ${({ theme, palette, indeterminate }) =>\n template({\n color: theme.colors['content-oncolor-primary'],\n backgroundColor: indeterminate ? theme.colors['alert-bg-error-500'] : theme.colors['bg-onmain-secondary'],\n borderColor: indeterminate ? theme.colors['alert-bg-error-500'] : theme.colors['alert-error'],\n colorHover: theme.colors['content-oncolor-primary'],\n backgroundColorHover: indeterminate\n ? theme.colors['alert-bg-error-500']\n : theme.colors['bg-onmain-secondary'],\n borderColorHover: indeterminate ? theme.colors['alert-bg-error-500'] : theme.colors['alert-error'],\n colorChecked: theme.colors['content-oncolor-primary'],\n backgroundColorChecked: theme.colors['alert-bg-error-500'],\n borderColorChecked: theme.colors['alert-bg-error-500'],\n colorDisabled: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabled: indeterminate\n ? theme.colors['bg-disabled-active']\n : theme.colors['bg-disabled-small'],\n borderColorDisabled: indeterminate ? theme.colors['bg-disabled-active'] : theme.colors['border-disabled'],\n colorDisabledChecked: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabledChecked: theme.colors['bg-disabled-active'],\n borderColorDisabledChecked: theme.colors['bg-disabled-active'],\n ...palette,\n })}\n `,\n success: css<StyledInputCheckboxProps>`\n ${({ theme, palette, indeterminate }) =>\n template({\n color: theme.colors['content-oncolor-primary'],\n backgroundColor: indeterminate ? theme.colors['alert-bg-success-500'] : theme.colors['bg-onmain-secondary'],\n borderColor: indeterminate ? theme.colors['alert-bg-success-500'] : theme.colors['alert-success'],\n colorHover: theme.colors['content-oncolor-primary'],\n backgroundColorHover: indeterminate\n ? theme.colors['alert-bg-success-500']\n : theme.colors['bg-onmain-secondary'],\n borderColorHover: indeterminate ? theme.colors['alert-bg-success-500'] : theme.colors['alert-success'],\n colorChecked: theme.colors['content-oncolor-primary'],\n backgroundColorChecked: theme.colors['alert-bg-success-500'],\n borderColorChecked: theme.colors['alert-bg-success-500'],\n colorDisabled: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabled: indeterminate\n ? theme.colors['bg-disabled-active']\n : theme.colors['bg-disabled-small'],\n borderColorDisabled: indeterminate ? theme.colors['bg-disabled-active'] : theme.colors['border-disabled'],\n colorDisabledChecked: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabledChecked: theme.colors['bg-disabled-active'],\n borderColorDisabledChecked: theme.colors['bg-disabled-active'],\n ...palette,\n })}\n `,\n default: css<StyledInputCheckboxProps>`\n ${({ theme, palette, indeterminate }) =>\n template({\n color: theme.colors['bg-brand-primary-basic'],\n backgroundColor: indeterminate ? theme.colors['bg-oncolor-primary'] : theme.colors['bg-onmain-primary'],\n borderColor: indeterminate ? theme.colors['bg-oncolor-primary'] : theme.colors['border-onmain-default-small'],\n colorHover: theme.colors['bg-brand-primary-basic'],\n backgroundColorHover: indeterminate ? theme.colors['bg-oncolor-primary'] : theme.colors['bg-onmain-primary'],\n borderColorHover: indeterminate ? theme.colors['bg-oncolor-primary'] : theme.colors['border-brand-primary'],\n colorChecked: theme.colors['bg-brand-primary-basic'],\n backgroundColorChecked: theme.colors['bg-oncolor-primary'],\n borderColorChecked: theme.colors['bg-oncolor-primary'],\n colorDisabled: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabled: indeterminate\n ? theme.colors['bg-disabled-active']\n : theme.colors['bg-disabled-small'],\n borderColorDisabled: indeterminate ? theme.colors['bg-disabled-active'] : theme.colors['border-disabled'],\n colorDisabledChecked: theme.colors['bg-onmain-secondary'],\n backgroundColorDisabledChecked: theme.colors['bg-disabled-active'],\n borderColorDisabledChecked: theme.colors['bg-disabled-active'],\n ...palette,\n })}\n `,\n },\n}\n\nexport const Root = styled.span.withConfig<StyledInputCheckboxProps>({\n shouldForwardProp: shouldForwardInputCheckboxProp,\n})`\n ${(props) => `\n box-sizing: border-box;\n isolation: isolate;\n position: relative;\n display: ${props.inline ? 'inline-flex' : 'flex'};\n flex-shrink: 0;\n cursor: ${props.disabled ? 'not-allowed' : 'pointer'};\n & > ${Input} {\n cursor: inherit;\n }\n & > ${Input}:checked + ${InputMask} > ${InputChecked} {\n opacity: 1;\n }\n & > ${Input}:focus-visible + ${InputMask} {\n box-shadow: 0 0 0 2px ${props.theme.colors.white}, 0 0 0 4px ${props.theme.colors['border-focus']};\n outline: 2px solid transparent;\n outline-offset: 2px;\n }\n `}\n ${(props) => {\n const schema = props.contrast || props.onColored ? COLOR_SCHEMA.contrast : COLOR_SCHEMA.default\n\n if (props.error) return schema.error\n if (props.success) return schema.success\n\n return schema.default\n }}\n\n ${responsiveSize}\n`\n"],"names":["shouldForwardInputCheckboxProp","createShouldForwardProp","propKey","includes","Input","styled","input","withConfig","displayName","componentId","InputMask","span","InputChecked","Checked","InputIndeterminate","Indeterminate","template","palette","backgroundColor","borderColor","color","backgroundColorHover","borderColorHover","colorHover","backgroundColorChecked","borderColorChecked","colorChecked","backgroundColorDisabled","borderColorDisabled","colorDisabled","backgroundColorDisabledChecked","borderColorDisabledChecked","colorDisabledChecked","COLOR_SCHEMA","default","error","css","theme","indeterminate","colors","success","contrast","Root","shouldForwardProp","props","inline","disabled","white","schema","onColored","responsiveSize"],"mappings":"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"}
|