@foxford/ui 2.4.3-beta-7227108-20230620 → 2.4.3-beta-f7c0390-20230703

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.
@@ -1,2 +1,2 @@
1
- import e,{css as i}from'styled-components';import{display as t}from'../../mixins/display.js';import{color as n}from'../../mixins/color.js';import{property as o,responsiveNamedProperty as l}from'../../mixins/responsive-property.js';var s={lighter:100,normal:400,bold:600,bolder:800};var r={l:1.5,m:1.3,s:1.15,xs:1};var a=i(["a{text-decoration:underline;&:hover{text-decoration:none;}}"]);var g=e.div.withConfig({shouldForwardProp:e=>['children','className','style','title','dangerouslySetInnerHTML'].includes(e)}).withConfig({componentId:"fox-ui__sc-s2fogy-0"})(["line-height:inherit;margin:initial;"," "," "," "," "," "," a{text-decoration:none;&:hover{text-decoration:none;}}"," "," "," ",""],(e=>e.display?t(e.display):null),(e=>n(e.color?e.color:e.theme.textColor)),(e=>e.lineHeight?i(["line-height:",";"],'string'==typeof e.lineHeight&&r[e.lineHeight]?r[e.lineHeight]:e.lineHeight):null),(e=>e.fontStyle?i(["font-style:",";"],e.fontStyle):null),(e=>e.fontFamily?i(["font-family:",";"],e.fontFamily):null),(e=>e.weight?i(["font-weight:",";"],'string'==typeof e.lineHeight&&s[e.weight]?s[e.weight]:e.weight):null),(e=>e.underlineLinks?a:null),(e=>e.textAlign?i(["text-align:",";"],e.textAlign):null),(e=>e.size?o(e.size,'font-size'):null),(e=>{var{sizeXS:i,sizeS:t,sizeM:n,sizeL:o,sizeXL:s}=e;return l({sizes:{sizeXS:i,sizeS:t,sizeM:n,sizeL:o,sizeXL:s},cssProperty:'font-size'})}));export{g as Root};
1
+ import e from'styled-components';import{injectDefaultTheme as i}from'../../shared/utils/inject-theme.js';import{display as t}from'../../mixins/display.js';import{color as o}from'../../mixins/color.js';import{property as n,responsiveNamedProperty as s}from'../../mixins/responsive-property.js';var r={lighter:100,normal:400,bold:600,bolder:800};var l={l:1.5,m:1.3,s:1.15,xs:1};var a=e.div.withConfig({shouldForwardProp:e=>['children','className','style','title','dangerouslySetInnerHTML'].includes(e)}).attrs(i).withConfig({componentId:"fox-ui__sc-s2fogy-0"})(["line-height:inherit;margin:initial;"," "," "," "," "," "," a{text-decoration:",";&:hover{text-decoration:none;}}"," "," ",""],(e=>e.display&&t(e.display)),(e=>o(e.color?e.color:e.theme.textColor)),(e=>e.fontStyle&&"font-style: ".concat(e.fontStyle,";")),(e=>e.fontFamily&&"font-family: ".concat(e.fontFamily,";")),(e=>e.lineHeight&&"line-height: ".concat('string'==typeof e.lineHeight&&l[e.lineHeight]?l[e.lineHeight]:e.lineHeight,";")),(e=>e.weight&&"font-weight: ".concat('string'==typeof e.lineHeight&&r[e.weight]?r[e.weight]:e.weight,";")),(e=>{var{underlineLinks:i}=e;return i?'underline':'none'}),(e=>e.textAlign&&" text-align: ".concat(e.textAlign,";")),(e=>e.size&&n(e.size,'font-size')),(e=>{var{sizeXS:i,sizeS:t,sizeM:o,sizeL:n,sizeXL:r}=e;return s({sizes:{sizeXS:i,sizeS:t,sizeM:o,sizeL:n,sizeXL:r},cssProperty:'font-size'})}));export{a as Root};
2
2
  //# sourceMappingURL=style.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","sources":["../../../../src/components/Text/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { display } from '../../mixins/display'\nimport { color, ColorValue } from '../../mixins/color'\nimport { responsiveNamedProperty, property } from '../../mixins/responsive-property'\nimport { TextProps } from './types'\n\nconst WEIGHT_MAP = {\n lighter: 100,\n normal: 400,\n bold: 600,\n bolder: 800,\n}\n\nconst LINE_HEIGHT_MAP: Record<Exclude<TextProps['lineHeight'], undefined>, number> = {\n l: 1.5,\n m: 1.3,\n s: 1.15,\n xs: 1,\n}\n\nconst underlineLinksStyle = css`\n a {\n text-decoration: underline;\n &:hover {\n text-decoration: none;\n }\n }\n`\n\nexport const Root = styled.div.withConfig<TextProps>({\n shouldForwardProp: (prop) => ['children', 'className', 'style', 'title', 'dangerouslySetInnerHTML'].includes(prop),\n})`\n line-height: inherit;\n margin: initial;\n ${(props) => (props.display ? display(props.display) : null)}\n ${(props) => (props.color ? color(props.color) : color(props.theme.textColor as ColorValue))}\n ${(props) =>\n props.lineHeight\n ? css`\n line-height: ${typeof props.lineHeight === 'string' && LINE_HEIGHT_MAP[props.lineHeight]\n ? LINE_HEIGHT_MAP[props.lineHeight]\n : props.lineHeight};\n `\n : null}\n ${(props) =>\n props.fontStyle\n ? css`\n font-style: ${props.fontStyle};\n `\n : null}\n ${(props) =>\n props.fontFamily\n ? css`\n font-family: ${props.fontFamily};\n `\n : null}\n ${(props) =>\n props.weight\n ? css`\n font-weight: ${typeof props.lineHeight === 'string' && WEIGHT_MAP[props.weight]\n ? WEIGHT_MAP[props.weight]\n : props.weight};\n `\n : null}\n\n a {\n text-decoration: none;\n &:hover {\n text-decoration: none;\n }\n }\n\n ${(props) => (props.underlineLinks ? underlineLinksStyle : null)}\n ${(props) =>\n props.textAlign\n ? css`\n text-align: ${props.textAlign};\n `\n : null}\n\n ${(props) => (props.size ? property(props.size, 'font-size') : null)}\n ${({ sizeXS, sizeS, sizeM, sizeL, sizeXL }) =>\n responsiveNamedProperty({ sizes: { sizeXS, sizeS, sizeM, sizeL, sizeXL }, cssProperty: 'font-size' })}\n`\n"],"names":["WEIGHT_MAP","lighter","normal","bold","bolder","LINE_HEIGHT_MAP","l","m","s","xs","underlineLinksStyle","css","Root","styled","div","withConfig","shouldForwardProp","prop","includes","componentId","props","display","color","theme","textColor","lineHeight","fontStyle","fontFamily","weight","underlineLinks","textAlign","size","property","_ref","sizeXS","sizeS","sizeM","sizeL","sizeXL","responsiveNamedProperty","sizes","cssProperty"],"mappings":"uOAMA,IAAMA,EAAa,CACjBC,QAAS,IACTC,OAAQ,IACRC,KAAM,IACNC,OAAQ,KAGV,IAAMC,EAA+E,CACnFC,EAAG,IACHC,EAAG,IACHC,EAAG,KACHC,GAAI,GAGN,IAAMC,EAAsBC,EAA5B,CAAA,gEASO,IAAMC,EAAOC,EAAOC,IAAIC,WAAsB,CACnDC,kBAAoBC,GAAS,CAAC,WAAY,YAAa,QAAS,QAAS,2BAA2BC,SAASD,KAD9FF,WAAA,CAAAI,YAAA,uBAAGN,CAAH,CAAA,sCAAA,IAAA,IAAA,IAAA,IAAA,IAAA,0DAAA,IAAA,IAAA,IAAA,KAKZO,GAAWA,EAAMC,QAAUA,EAAQD,EAAMC,SAAW,OACpDD,GAAyBE,EAAdF,EAAME,MAAcF,EAAME,MAAeF,EAAMG,MAAMC,aAChEJ,GACDA,EAAMK,WACFd,uBAC6C,iBAArBS,EAAMK,YAA2BpB,EAAgBe,EAAMK,YACzEpB,EAAgBe,EAAMK,YACtBL,EAAMK,YAEZ,OACHL,GACDA,EAAMM,UACFf,EACgBS,CAAAA,cAAAA,KAAAA,EAAMM,WAEtB,OACHN,GACDA,EAAMO,WACFhB,EACiBS,CAAAA,eAAAA,KAAAA,EAAMO,YAEvB,OACHP,GACDA,EAAMQ,OACFjB,EACiB,CAAA,eAAA,KAA4B,iBAArBS,EAAMK,YAA2BzB,EAAWoB,EAAMQ,QACpE5B,EAAWoB,EAAMQ,QACjBR,EAAMQ,QAEZ,OASHR,GAAWA,EAAMS,eAAiBnB,EAAsB,OACxDU,GACDA,EAAMU,UACFnB,EACgBS,CAAAA,cAAAA,KAAAA,EAAMU,WAEtB,OAEHV,GAAWA,EAAMW,KAAOC,EAASZ,EAAMW,KAAM,aAAe,OAC7DE,IAAA,IAACC,OAAEA,EAAFC,MAAUA,EAAVC,MAAiBA,EAAjBC,MAAwBA,EAAxBC,OAA+BA,GAAhCL,EAAA,OACAM,EAAwB,CAAEC,MAAO,CAAEN,OAAAA,EAAQC,MAAAA,EAAOC,MAAAA,EAAOC,MAAAA,EAAOC,OAAAA,GAAUG,YAAa"}
1
+ {"version":3,"file":"style.js","sources":["../../../../src/components/Text/style.ts"],"sourcesContent":["import styled from 'styled-components'\nimport { injectDefaultTheme } from 'shared/utils/inject-theme'\nimport { display } from '../../mixins/display'\nimport { color, ColorValue } from '../../mixins/color'\nimport { responsiveNamedProperty, property } from '../../mixins/responsive-property'\nimport { TextProps } from './types'\n\nconst WEIGHT_MAP = {\n lighter: 100,\n normal: 400,\n bold: 600,\n bolder: 800,\n}\n\nconst LINE_HEIGHT_MAP: Record<Exclude<TextProps['lineHeight'], undefined>, number> = {\n l: 1.5,\n m: 1.3,\n s: 1.15,\n xs: 1,\n}\n\nexport const Root = styled.div\n .withConfig({\n shouldForwardProp: (prop) => ['children', 'className', 'style', 'title', 'dangerouslySetInnerHTML'].includes(prop),\n })\n .attrs(injectDefaultTheme)<TextProps>`\n line-height: inherit;\n margin: initial;\n ${(props) => props.display && display(props.display)}\n ${(props) => (props.color ? color(props.color) : color(props.theme.textColor as ColorValue))}\n ${(props) => props.fontStyle && `font-style: ${props.fontStyle};`}\n ${(props) => props.fontFamily && `font-family: ${props.fontFamily};`}\n ${(props) =>\n props.lineHeight &&\n `line-height: ${\n typeof props.lineHeight === 'string' && LINE_HEIGHT_MAP[props.lineHeight]\n ? LINE_HEIGHT_MAP[props.lineHeight]\n : props.lineHeight\n };`}\n ${(props) =>\n props.weight &&\n `font-weight: ${\n typeof props.lineHeight === 'string' && WEIGHT_MAP[props.weight] ? WEIGHT_MAP[props.weight] : props.weight\n };`}\n\n a {\n text-decoration: ${({ underlineLinks }) => (underlineLinks ? 'underline' : 'none')};\n &:hover {\n text-decoration: none;\n }\n }\n\n ${(props) => props.textAlign && ` text-align: ${props.textAlign};`}\n ${(props) => props.size && property(props.size, 'font-size')}\n ${({ sizeXS, sizeS, sizeM, sizeL, sizeXL }) =>\n responsiveNamedProperty({ sizes: { sizeXS, sizeS, sizeM, sizeL, sizeXL }, cssProperty: 'font-size' })}\n`\n"],"names":["WEIGHT_MAP","lighter","normal","bold","bolder","LINE_HEIGHT_MAP","l","m","s","xs","Root","styled","div","withConfig","shouldForwardProp","prop","includes","attrs","injectDefaultTheme","componentId","props","display","color","theme","textColor","fontStyle","fontFamily","concat","lineHeight","weight","_ref","underlineLinks","textAlign","size","property","_ref2","sizeXS","sizeS","sizeM","sizeL","sizeXL","responsiveNamedProperty","sizes","cssProperty"],"mappings":"qSAOA,IAAMA,EAAa,CACjBC,QAAS,IACTC,OAAQ,IACRC,KAAM,IACNC,OAAQ,KAGV,IAAMC,EAA+E,CACnFC,EAAG,IACHC,EAAG,IACHC,EAAG,KACHC,GAAI,GAGC,IAAMC,EAAOC,EAAOC,IACxBC,WAAW,CACVC,kBAAoBC,GAAS,CAAC,WAAY,YAAa,QAAS,QAAS,2BAA2BC,SAASD,KAE9GE,MAAMC,GAJQL,WAAA,CAAAM,YAAA,uBAAGR,CAOfS,CAAAA,sCAAAA,IAAAA,IAAAA,IAAAA,IAAAA,IAAAA,sBAAAA,mCAAAA,IAAAA,IAAAA,KAAAA,GAAUA,EAAMC,SAAWA,EAAQD,EAAMC,WACzCD,GAAyBE,EAAdF,EAAME,MAAcF,EAAME,MAAeF,EAAMG,MAAMC,aAChEJ,GAAUA,EAAMK,WAA4BL,eAAAA,OAAAA,EAAMK,UATtC,OAUZL,GAAUA,EAAMM,YAAN,gBAAAC,OAAoCP,EAAMM,WAA1C,OACVN,GACDA,EAAMQ,YAAN,gBAAAD,OAE8B,iBAArBP,EAAMQ,YAA2BvB,EAAgBe,EAAMQ,YAC1DvB,EAAgBe,EAAMQ,YACtBR,EAAMQ,WAhBC,OAkBZR,GACDA,EAAMS,QAEJ,gBAAAF,OAA4B,iBAArBP,EAAMQ,YAA2B5B,EAAWoB,EAAMS,QAAU7B,EAAWoB,EAAMS,QAAUT,EAAMS,OAFtG,OAMmBC,IAAA,IAACC,eAAEA,GAAHD,EAAA,OAAyBC,EAAiB,YAAc,UAM1EX,GAAUA,EAAMY,WAAN,gBAAAL,OAAmCP,EAAMY,UAAzC,OACVZ,GAAUA,EAAMa,MAAQC,EAASd,EAAMa,KAAM,eAC9CE,IAAA,IAACC,OAAEA,EAAFC,MAAUA,EAAVC,MAAiBA,EAAjBC,MAAwBA,EAAxBC,OAA+BA,GAAhCL,EAAA,OACAM,EAAwB,CAAEC,MAAO,CAAEN,OAAAA,EAAQC,MAAAA,EAAOC,MAAAA,EAAOC,MAAAA,EAAOC,OAAAA,GAAUG,YAAa"}
@@ -1,2 +1,2 @@
1
- import e from'@babel/runtime/helpers/objectSpread2';import i from'@babel/runtime/helpers/objectWithoutProperties';import{useFallbackTheme as t}from'../../hooks/use-theme.js';import{useConfigPriority as o}from'../../hooks/use-config-priority.js';import{Text as r}from'../Text/Text.js';import{jsx as s}from'react/jsx-runtime';var a=["h"],h=["fontFamily"];var m={h1:{size:44,sizeM:32,lineHeight:'s',weight:'bold'},h2:{size:32,sizeM:28,lineHeight:'s',weight:'bold'},h3:{size:28,lineHeight:'s',weight:'bold'},h4:{size:24,lineHeight:'s',weight:'bold'}};var l='Text.Heading';var n=l=>{var n;var{h:g="h1"}=l,p=i(l,a);var d=t();var b=o(null===(n=d.components)||void 0===n?void 0:n["Text.Heading"],p),{fontFamily:f=""}=b,u=i(b,h);return s(r,e(e({as:g,fontFamily:f},m[g]),u))};n.displayName="Text.Heading";export{l as COMPONENT_NAME,n as TextHeading};
1
+ import e from'@babel/runtime/helpers/objectSpread2';import i from'@babel/runtime/helpers/objectWithoutProperties';import{useFallbackTheme as t}from'../../hooks/use-theme.js';import{useConfigPriority as o}from'../../hooks/use-config-priority.js';import{Text as r}from'../Text/Text.js';import{jsx as s}from'react/jsx-runtime';var a=["h","fontFamily"];var h={h1:{size:44,sizeM:32,lineHeight:'s',weight:'bold'},h2:{size:32,sizeM:28,lineHeight:'s',weight:'bold'},h3:{size:28,lineHeight:'s',weight:'bold'},h4:{size:24,lineHeight:'s',weight:'bold'}};var m='Text.Heading';var l=m=>{var l;var n=t();var g=o(null===(l=n.components)||void 0===l?void 0:l["Text.Heading"],m),{h:p="h1",fontFamily:d=""}=g,b=i(g,a);return s(r,e(e({as:p,fontFamily:d},h[p]),b))};l.displayName="Text.Heading";export{m as COMPONENT_NAME,l as TextHeading};
2
2
  //# sourceMappingURL=Text.Heading.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Text.Heading.js","sources":["../../../../src/components/Text.Heading/Text.Heading.tsx"],"sourcesContent":["import { useFallbackTheme } from 'hooks/use-theme'\nimport { useConfigPriority } from 'hooks/use-config-priority'\nimport { Text } from '../Text'\nimport { TextHeadingProps, H } from './types'\n\nconst PARAMS: Record<keyof typeof H, Partial<TextHeadingProps>> = {\n h1: {\n size: 44,\n sizeM: 32,\n lineHeight: 's',\n weight: 'bold',\n },\n h2: {\n size: 32,\n sizeM: 28,\n lineHeight: 's',\n weight: 'bold',\n },\n h3: {\n size: 28,\n lineHeight: 's',\n weight: 'bold',\n },\n h4: {\n size: 24,\n lineHeight: 's',\n weight: 'bold',\n },\n}\n\nconst COMPONENT_NAME = 'Text.Heading'\n\n/**\n * Text.Heading component\n * @visibleName Text.Heading\n */\nconst TextHeading = ({ h = 'h1', ...props }: TextHeadingProps) => {\n const theme = useFallbackTheme()\n\n const { fontFamily = '', ...configProps } = useConfigPriority<TextHeadingProps>(\n theme.components?.[COMPONENT_NAME],\n props\n )\n\n const predefinedParams = PARAMS[h]\n\n return <Text as={h} fontFamily={fontFamily} {...predefinedParams} {...configProps} />\n}\n\nTextHeading.displayName = COMPONENT_NAME\n\nexport { TextHeading, COMPONENT_NAME }\n"],"names":["PARAMS","h1","size","sizeM","lineHeight","weight","h2","h3","h4","COMPONENT_NAME","TextHeading","_ref","_theme$components","h","props","_objectWithoutProperties","_excluded","theme","useFallbackTheme","useConfigPriority","components","fontFamily","_useConfigPriority","configProps","_excluded2","_jsx","Text","_objectSpread","as","displayName"],"mappings":"iWAKA,IAAMA,EAA4D,CAChEC,GAAI,CACFC,KAAM,GACNC,MAAO,GACPC,WAAY,IACZC,OAAQ,QAEVC,GAAI,CACFJ,KAAM,GACNC,MAAO,GACPC,WAAY,IACZC,OAAQ,QAEVE,GAAI,CACFL,KAAM,GACNE,WAAY,IACZC,OAAQ,QAEVG,GAAI,CACFN,KAAM,GACNE,WAAY,IACZC,OAAQ,SAINI,IAAAA,EAAiB,eAMjBC,IAAAA,EAAcC,IAA8C,IAAAC,EAAA,IAA7CC,EAAEA,EAAI,MAAuCF,EAA9BG,EAA8BC,EAAAJ,EAAAK,GAChE,IAAMC,EAAQC,IAEd,IAA4CC,EAAAA,EAC1C,QAAAF,EAAAA,EAAMG,kBAAAA,IAANR,OAAAA,EAAAA,EAVmB,gBAWnBE,IAFIO,WAAEA,EAAa,IAArBC,EAA4BC,EAA5BR,EAAAO,EAAAE,GAOA,OAAOC,EAACC,EAADC,EAAAA,EAAA,CAAMC,GAAIf,EAAGQ,WAAYA,GAFPrB,EAAOa,IAEsCU,KAGxEb,EAAYmB,YAnBW"}
1
+ {"version":3,"file":"Text.Heading.js","sources":["../../../../src/components/Text.Heading/Text.Heading.tsx"],"sourcesContent":["import { useFallbackTheme } from 'hooks/use-theme'\nimport { useConfigPriority } from 'hooks/use-config-priority'\nimport { Text } from '../Text'\nimport { TextHeadingProps, H } from './types'\n\nconst PARAMS: Record<H, Partial<TextHeadingProps>> = {\n h1: {\n size: 44,\n sizeM: 32,\n lineHeight: 's',\n weight: 'bold',\n },\n h2: {\n size: 32,\n sizeM: 28,\n lineHeight: 's',\n weight: 'bold',\n },\n h3: {\n size: 28,\n lineHeight: 's',\n weight: 'bold',\n },\n h4: {\n size: 24,\n lineHeight: 's',\n weight: 'bold',\n },\n}\n\nconst COMPONENT_NAME = 'Text.Heading'\n\n/**\n * @visibleName Text.Heading\n */\nconst TextHeading = (props: TextHeadingProps) => {\n const theme = useFallbackTheme()\n\n const {\n h = 'h1',\n fontFamily = '',\n ...configProps\n } = useConfigPriority<TextHeadingProps>(theme.components?.[COMPONENT_NAME], props)\n\n const predefinedParams = PARAMS[h]\n\n return <Text as={h} fontFamily={fontFamily} {...predefinedParams} {...configProps} />\n}\n\nTextHeading.displayName = COMPONENT_NAME\n\nexport { TextHeading, COMPONENT_NAME }\n"],"names":["PARAMS","h1","size","sizeM","lineHeight","weight","h2","h3","h4","COMPONENT_NAME","TextHeading","props","_theme$components","theme","useFallbackTheme","useConfigPriority","components","h","fontFamily","_useConfigPriority","configProps","_objectWithoutProperties","_excluded","_jsx","Text","_objectSpread","as","displayName"],"mappings":"6VAKA,IAAMA,EAA+C,CACnDC,GAAI,CACFC,KAAM,GACNC,MAAO,GACPC,WAAY,IACZC,OAAQ,QAEVC,GAAI,CACFJ,KAAM,GACNC,MAAO,GACPC,WAAY,IACZC,OAAQ,QAEVE,GAAI,CACFL,KAAM,GACNE,WAAY,IACZC,OAAQ,QAEVG,GAAI,CACFN,KAAM,GACNE,WAAY,IACZC,OAAQ,SAINI,IAAAA,EAAiB,eAKjBC,IAAAA,EAAeC,IAA4B,IAAAC,EAC/C,IAAMC,EAAQC,IAEd,IAIIC,EAAAA,EAAoC,QAAAF,EAAAA,EAAMG,kBAAAA,IAANJ,OAAA,EAAAA,EAZnB,gBAYuDD,IAJtEM,EACJA,EAAI,KADAC,WAEJA,EAAa,IAFfC,EAGKC,EAHLC,EAAAF,EAAAG,GAQA,OAAOC,EAACC,EAADC,EAAAA,EAAA,CAAMC,GAAIT,EAAGC,WAAYA,GAFPlB,EAAOiB,IAEsCG,KAGxEV,EAAYiB,YAnBW"}
@@ -1,2 +1,2 @@
1
- import r,{css as e}from'styled-components';import{property as o,responsiveNamedProperty as t}from'../../mixins/responsive-property.js';import{chooseWidthValue as d}from'../Input/helpers.js';import{baseInputStyle as a}from'../Input/style.js';var i=e(["display:block;box-sizing:border-box;appearance:none;width:auto;resize:vertical;background:",";border:1px solid ",";border-radius:12px;padding:12px 16px;font-style:normal;font-weight:400;font-size:18px;line-height:24px;color:",";&::placeholder{color:",";}&:focus{border:1px solid ",";caret-color:",";outline:none;}&:disabled{background-color:",";border-color:",";color:",";cursor:not-allowed;}"," "," "," ",""],(r=>{var{theme:e}=r;return e.colors['bg-onmain-secondary']}),(r=>{var{theme:e}=r;return e.colors['border-onmain-default-large']}),(r=>{var{theme:e}=r;return e.colors['content-onmain-primary']}),(r=>{var{theme:e}=r;return e.colors['content-onmain-secondary']}),(r=>{var{theme:e}=r;return e.colors['border-brand-primary']}),(r=>{var{theme:e}=r;return e.colors['border-brand-primary']}),(r=>{var{theme:e}=r;return e.colors['bg-disabled-large']}),(r=>{var{theme:e}=r;return e.colors['border-disabled']}),(r=>{var{theme:e}=r;return e.colors['content-disabled']}),(r=>r.width?o(d(r.width),r.fluid&&'auto'!==r.width?'max-width':'width'):null),(r=>t({sizes:{widthXS:r.widthXS,widthS:r.widthS,widthM:r.widthM,widthL:r.widthL,widthXL:r.widthXL},cssProperty:r.fluid&&'auto'!==r.width?'max-width':'width',customSizeHandler:d})),(r=>{var{fluid:o}=r;return o&&e(["width:100%;"])}),(r=>{var{error:o}=r;return o&&e(["background-color:",";border:1px solid ",";"],(r=>{var{theme:e}=r;return e.colors['alert-bg-error-100']}),(r=>{var{theme:e}=r;return e.colors['alert-bg-error-500']}))}));var n=e(["resize:none;line-height:23px;padding:16px 20px 11px;",""],a);var s=r.textarea.withConfig({shouldForwardProp:r=>!['color','placeholderColor','rounded','fluid','error','brandPresetUsed'].includes(r)&&!r.includes('width')}).withConfig({componentId:"fox-ui__sc-a4hfy5-0"})(["",""],(r=>{var{brandPresetUsed:e}=r;return e?i:n}));export{s as Root};
1
+ import r,{css as o}from'styled-components';import{injectDefaultTheme as e}from'../../shared/utils/inject-theme.js';import{property as t,responsiveNamedProperty as d}from'../../mixins/responsive-property.js';import{chooseWidthValue as i}from'../Input/helpers.js';import{baseInputStyle as a}from'../Input/style.js';var s=o(["",";"," "," "," ",""],(r=>{var{theme:e}=r;return o(["display:block;box-sizing:border-box;appearance:none;width:auto;resize:vertical;background:",";border:1px solid ",";border-radius:12px;padding:12px 16px;font-style:normal;font-weight:400;font-size:18px;line-height:24px;color:",";&::placeholder{color:",";}&:focus{border:1px solid ",";caret-color:",";outline:none;}&:disabled{background-color:",";border-color:",";color:",";cursor:not-allowed;}"],e.colors['bg-onmain-secondary'],e.colors['border-onmain-default-large'],e.colors['content-onmain-primary'],e.colors['content-onmain-secondary'],e.colors['border-brand-primary'],e.colors['border-brand-primary'],e.colors['bg-disabled-large'],e.colors['border-disabled'],e.colors['content-disabled'])}),(r=>r.width?t(i(r.width),r.fluid&&'auto'!==r.width?'max-width':'width'):null),(r=>d({sizes:{widthXS:r.widthXS,widthS:r.widthS,widthM:r.widthM,widthL:r.widthL,widthXL:r.widthXL},cssProperty:r.fluid&&'auto'!==r.width?'max-width':'width',customSizeHandler:i})),(r=>{var{fluid:o}=r;return o&&'width: 100%;'}),(r=>{var{error:e}=r;return e&&o(["background-color:",";border:1px solid ",";"],(r=>{var{theme:o}=r;return o.colors['alert-bg-error-100']}),(r=>{var{theme:o}=r;return o.colors['alert-bg-error-500']}))}));var n=o(["resize:none;line-height:23px;padding:16px 20px 11px;",""],a);var l=r.textarea.withConfig({shouldForwardProp:r=>!['color','placeholderColor','rounded','fluid','error','brandPresetUsed'].includes(r)&&!r.includes('width')}).attrs(e).withConfig({componentId:"fox-ui__sc-a4hfy5-0"})(["",""],(r=>{var{brandPresetUsed:o}=r;return o?s:n}));export{l as Root};
2
2
  //# sourceMappingURL=style.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","sources":["../../../../src/components/Textarea/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { property, responsiveNamedProperty } from 'mixins/responsive-property'\nimport { chooseWidthValue } from '../../components/Input/helpers'\nimport { baseInputStyle } from '../../components/Input/style'\nimport type { TextareaRootProps } from './types'\n\n/* TODO: combine following styles durnig Input component rebranding and remove it from here */\nconst brandTextareaStyle = css<TextareaRootProps>`\n display: block;\n box-sizing: border-box;\n appearance: none;\n width: auto;\n resize: vertical;\n\n background: ${({ theme }) => theme.colors['bg-onmain-secondary']};\n border: 1px solid ${({ theme }) => theme.colors['border-onmain-default-large']};\n border-radius: 12px;\n padding: 12px 16px;\n\n font-style: normal;\n font-weight: 400;\n font-size: 18px;\n line-height: 24px;\n color: ${({ theme }) => theme.colors['content-onmain-primary']};\n\n &::placeholder {\n color: ${({ theme }) => theme.colors['content-onmain-secondary']};\n }\n\n &:focus {\n border: 1px solid ${({ theme }) => theme.colors['border-brand-primary']};\n caret-color: ${({ theme }) => theme.colors['border-brand-primary']};\n outline: none;\n }\n\n &:disabled {\n background-color: ${({ theme }) => theme.colors['bg-disabled-large']};\n border-color: ${({ theme }) => theme.colors['border-disabled']};\n color: ${({ theme }) => theme.colors['content-disabled']};\n cursor: not-allowed;\n }\n\n ${(props) =>\n props.width\n ? property(chooseWidthValue(props.width), props.fluid && props.width !== 'auto' ? 'max-width' : 'width')\n : null}\n\n ${(props) =>\n responsiveNamedProperty({\n sizes: {\n widthXS: props.widthXS,\n widthS: props.widthS,\n widthM: props.widthM,\n widthL: props.widthL,\n widthXL: props.widthXL,\n },\n cssProperty: props.fluid && props.width !== 'auto' ? 'max-width' : 'width',\n customSizeHandler: chooseWidthValue,\n })}\n\n ${({ fluid }) =>\n fluid &&\n css`\n width: 100%;\n `}\n\n ${({ error }) =>\n error &&\n css`\n background-color: ${({ theme }) => theme.colors['alert-bg-error-100']};\n border: 1px solid ${({ theme }) => theme.colors['alert-bg-error-500']};\n `}\n`\n\nconst baseTextareaStyle = css`\n resize: none;\n line-height: 23px;\n padding: 16px 20px 11px;\n ${baseInputStyle}\n`\n\nexport const Root = styled.textarea.withConfig<TextareaRootProps>({\n shouldForwardProp: (prop) =>\n !['color', 'placeholderColor', 'rounded', 'fluid', 'error', 'brandPresetUsed'].includes(prop) &&\n !prop.includes('width'),\n})`\n ${({ brandPresetUsed }) => (brandPresetUsed ? brandTextareaStyle : baseTextareaStyle)}\n`\n"],"names":["brandTextareaStyle","css","_ref","theme","colors","_ref2","_ref3","_ref4","_ref5","_ref6","_ref7","_ref8","_ref9","props","width","property","chooseWidthValue","fluid","responsiveNamedProperty","sizes","widthXS","widthS","widthM","widthL","widthXL","cssProperty","customSizeHandler","_ref10","_ref11","error","_ref12","_ref13","baseTextareaStyle","baseInputStyle","Root","styled","textarea","withConfig","shouldForwardProp","prop","includes","componentId","_ref14","brandPresetUsed"],"mappings":"iPAOA,IAAMA,EAAqBC,EAOX,CAAA,6FAAA,qBAAA,iHAAA,yBAAA,8BAAA,gBAAA,8CAAA,iBAAA,UAAA,wBAAA,IAAA,IAAA,IAAA,KAAAC,IAAA,IAACC,MAAEA,GAAHD,EAAA,OAAeC,EAAMC,OAAO,0BACtBC,IAAA,IAACF,MAAEA,GAAHE,EAAA,OAAeF,EAAMC,OAAO,kCAQvCE,IAAA,IAACH,MAAEA,GAAHG,EAAA,OAAeH,EAAMC,OAAO,6BAG1BG,IAAA,IAACJ,MAAEA,GAAHI,EAAA,OAAeJ,EAAMC,OAAO,+BAIjBI,IAAA,IAACL,MAAEA,GAAHK,EAAA,OAAeL,EAAMC,OAAO,2BACjCK,IAAA,IAACN,MAAEA,GAAHM,EAAA,OAAeN,EAAMC,OAAO,2BAKvBM,IAAA,IAACP,MAAEA,GAAHO,EAAA,OAAeP,EAAMC,OAAO,wBAChCO,IAAA,IAACR,MAAEA,GAAHQ,EAAA,OAAeR,EAAMC,OAAO,sBACnCQ,IAAA,IAACT,MAAEA,GAAHS,EAAA,OAAeT,EAAMC,OAAO,uBAIpCS,GACDA,EAAMC,MACFC,EAASC,EAAiBH,EAAMC,OAAQD,EAAMI,OAAyB,SAAhBJ,EAAMC,MAAmB,YAAc,SAC9F,OAEHD,GACDK,EAAwB,CACtBC,MAAO,CACLC,QAASP,EAAMO,QACfC,OAAQR,EAAMQ,OACdC,OAAQT,EAAMS,OACdC,OAAQV,EAAMU,OACdC,QAASX,EAAMW,SAEjBC,YAAaZ,EAAMI,OAAyB,SAAhBJ,EAAMC,MAAmB,YAAc,QACnEY,kBAAmBV,MAGrBW,IAAA,IAACV,MAAEA,GAAHU,EAAA,OACAV,GACAhB,EAFA,CAAA,mBAMA2B,IAAA,IAACC,MAAEA,GAAHD,EAAA,OACAC,GACA5B,EACsB,CAAA,oBAAA,qBAAA,MAAA6B,IAAA,IAAC3B,MAAEA,GAAH2B,EAAA,OAAe3B,EAAMC,OAAO,yBAC5B2B,IAAA,IAAC5B,MAAEA,GAAH4B,EAAA,OAAe5B,EAAMC,OAAO,4BAItD,IAAM4B,EAAoB/B,EAAH,CAAA,uDAAA,IAInBgC,GAGG,IAAMC,EAAOC,EAAOC,SAASC,WAA8B,CAChEC,kBAAoBC,IACjB,CAAC,QAAS,mBAAoB,UAAW,QAAS,QAAS,mBAAmBC,SAASD,KACvFA,EAAKC,SAAS,WAHFH,WAAA,CAAAI,YAAA,uBAAGN,CAKhB,CAAA,GAAA,KAAAO,IAAA,IAACC,gBAAEA,GAAHD,EAAA,OAA0BC,EAAkB3C,EAAqBgC"}
1
+ {"version":3,"file":"style.js","sources":["../../../../src/components/Textarea/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { injectDefaultTheme } from 'shared/utils/inject-theme'\nimport { property, responsiveNamedProperty } from 'mixins/responsive-property'\nimport { chooseWidthValue } from '../../components/Input/helpers'\nimport { baseInputStyle } from '../../components/Input/style'\nimport type { TextareaRootProps } from './types'\n\n/**\n * TODO: combine following styles durnig Input component rebranding and remove it from here\n * https://jira.netology-group.ru/browse/STOEGE-20514\n */\nconst brandTextareaStyle = css<TextareaRootProps>`\n ${({ theme }) => css`\n display: block;\n box-sizing: border-box;\n appearance: none;\n width: auto;\n resize: vertical;\n\n background: ${theme.colors['bg-onmain-secondary']};\n border: 1px solid ${theme.colors['border-onmain-default-large']};\n border-radius: 12px;\n padding: 12px 16px;\n\n font-style: normal;\n font-weight: 400;\n font-size: 18px;\n line-height: 24px;\n color: ${theme.colors['content-onmain-primary']};\n\n &::placeholder {\n color: ${theme.colors['content-onmain-secondary']};\n }\n\n &:focus {\n border: 1px solid ${theme.colors['border-brand-primary']};\n caret-color: ${theme.colors['border-brand-primary']};\n outline: none;\n }\n\n &:disabled {\n background-color: ${theme.colors['bg-disabled-large']};\n border-color: ${theme.colors['border-disabled']};\n color: ${theme.colors['content-disabled']};\n cursor: not-allowed;\n }\n `};\n\n ${(props) =>\n props.width\n ? property(chooseWidthValue(props.width), props.fluid && props.width !== 'auto' ? 'max-width' : 'width')\n : null}\n\n ${(props) =>\n responsiveNamedProperty({\n sizes: {\n widthXS: props.widthXS,\n widthS: props.widthS,\n widthM: props.widthM,\n widthL: props.widthL,\n widthXL: props.widthXL,\n },\n cssProperty: props.fluid && props.width !== 'auto' ? 'max-width' : 'width',\n customSizeHandler: chooseWidthValue,\n })}\n\n ${({ fluid }) => fluid && 'width: 100%;'}\n\n ${({ error }) =>\n error &&\n css`\n background-color: ${({ theme }) => theme.colors['alert-bg-error-100']};\n border: 1px solid ${({ theme }) => theme.colors['alert-bg-error-500']};\n `}\n`\n\nconst baseTextareaStyle = css`\n resize: none;\n line-height: 23px;\n padding: 16px 20px 11px;\n ${baseInputStyle}\n`\n\nexport const Root = styled.textarea\n .withConfig({\n shouldForwardProp: (prop) =>\n !['color', 'placeholderColor', 'rounded', 'fluid', 'error', 'brandPresetUsed'].includes(prop) &&\n !prop.includes('width'),\n })\n .attrs(injectDefaultTheme)<TextareaRootProps>`\n ${({ brandPresetUsed }) => (brandPresetUsed ? brandTextareaStyle : baseTextareaStyle)}\n`\n"],"names":["brandTextareaStyle","css","_ref","theme","colors","props","width","property","chooseWidthValue","fluid","responsiveNamedProperty","sizes","widthXS","widthS","widthM","widthL","widthXL","cssProperty","customSizeHandler","_ref2","_ref3","error","_ref4","_ref5","baseTextareaStyle","baseInputStyle","Root","styled","textarea","withConfig","shouldForwardProp","prop","includes","attrs","injectDefaultTheme","componentId","_ref6","brandPresetUsed"],"mappings":"yTAWA,IAAMA,EAAqBC,EACvB,CAAA,GAAA,IAAA,IAAA,IAAA,IAAA,KAAAC,IAAA,IAACC,MAAEA,GAAHD,EAAA,OAAeD,EAAf,CAAA,6FAAA,qBAAA,iHAAA,yBAAA,8BAAA,gBAAA,8CAAA,iBAAA,UAAA,yBAOcE,EAAMC,OAAO,uBACPD,EAAMC,OAAO,+BAQxBD,EAAMC,OAAO,0BAGXD,EAAMC,OAAO,4BAIFD,EAAMC,OAAO,wBAClBD,EAAMC,OAAO,wBAKRD,EAAMC,OAAO,qBACjBD,EAAMC,OAAO,mBACpBD,EAAMC,OAAO,wBAKvBC,GACDA,EAAMC,MACFC,EAASC,EAAiBH,EAAMC,OAAQD,EAAMI,OAAyB,SAAhBJ,EAAMC,MAAmB,YAAc,SAC9F,OAEHD,GACDK,EAAwB,CACtBC,MAAO,CACLC,QAASP,EAAMO,QACfC,OAAQR,EAAMQ,OACdC,OAAQT,EAAMS,OACdC,OAAQV,EAAMU,OACdC,QAASX,EAAMW,SAEjBC,YAAaZ,EAAMI,OAAyB,SAAhBJ,EAAMC,MAAmB,YAAc,QACnEY,kBAAmBV,MAGrBW,IAAA,IAACV,MAAEA,GAAHU,EAAA,OAAeV,GAAS,kBAExBW,IAAA,IAACC,MAAEA,GAAHD,EAAA,OACAC,GACApB,EACsB,CAAA,oBAAA,qBAAA,MAAAqB,IAAA,IAACnB,MAAEA,GAAHmB,EAAA,OAAenB,EAAMC,OAAO,yBAC5BmB,IAAA,IAACpB,MAAEA,GAAHoB,EAAA,OAAepB,EAAMC,OAAO,4BAItD,IAAMoB,EAAoBvB,EAAH,CAAA,uDAAA,IAInBwB,GAGG,IAAMC,EAAOC,EAAOC,SACxBC,WAAW,CACVC,kBAAoBC,IACjB,CAAC,QAAS,mBAAoB,UAAW,QAAS,QAAS,mBAAmBC,SAASD,KACvFA,EAAKC,SAAS,WAElBC,MAAMC,GANQL,WAAA,CAAAM,YAAA,uBAAGR,CAOhB,CAAA,GAAA,KAAAS,IAAA,IAACC,gBAAEA,GAAHD,EAAA,OAA0BC,EAAkBrC,EAAqBwB"}
package/dts/index.d.ts CHANGED
@@ -332,7 +332,7 @@ interface InputField extends Color, Color<'placeholderColor'>, ResponsiveNamedPr
332
332
  */
333
333
  children?: React.ReactNode;
334
334
  /**
335
- * Rounded style
335
+ * @preset {Default} Rounded style
336
336
  */
337
337
  rounded?: boolean;
338
338
  /**
@@ -881,15 +881,10 @@ declare class Avatar extends PureComponent<AvatarProps> {
881
881
  render(): JSX.Element;
882
882
  }
883
883
 
884
- declare enum H {
885
- h1 = 0,
886
- h2 = 1,
887
- h3 = 2,
888
- h4 = 3
889
- }
884
+ declare type H = 'h1' | 'h2' | 'h3' | 'h4';
890
885
  interface TextHeadingProps extends Omit<TextProps, 'content' | 'as'> {
891
886
  /** Default set of size, lineHeight and weight props */
892
- h?: keyof typeof H;
887
+ h?: H;
893
888
  /** Children react node */
894
889
  children?: React.ReactNode;
895
890
  }
@@ -961,7 +956,7 @@ interface TextProps extends BaseProps$1, Color$1, ResponsiveNamedProperty$1<'siz
961
956
  declare const Text: {
962
957
  (props: TextProps): JSX.Element;
963
958
  Heading: {
964
- ({ h, ...props }: TextHeadingProps): JSX.Element;
959
+ (props: TextHeadingProps): JSX.Element;
965
960
  displayName: string;
966
961
  };
967
962
  Ellipse: typeof TextEllipse;