@foxford/ui 2.5.1-beta-9bf8d2f-20230704 → 2.5.2-beta-1daba91-20230706
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/Amount/Amount.js.map +1 -1
- package/components/Badge/Badge.js.map +1 -1
- package/components/Tag/Tag.js.map +1 -1
- package/components/Tag/style.js.map +1 -1
- package/components/Text/Text.js +1 -1
- package/components/Text/Text.js.map +1 -1
- package/components/Text/style.js +1 -1
- package/components/Text/style.js.map +1 -1
- package/components/Text.Heading/Text.Heading.js +1 -1
- package/components/Text.Heading/Text.Heading.js.map +1 -1
- package/components/Textarea/Textarea.js +1 -1
- package/components/Textarea/Textarea.js.map +1 -1
- package/components/Textarea/style.js +1 -1
- package/components/Textarea/style.js.map +1 -1
- package/dts/index.d.ts +42 -107
- package/hooks/use-config-priority.js +1 -1
- package/hooks/use-config-priority.js.map +1 -1
- package/index.cjs.js +1 -1
- package/index.cjs.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Amount.js","sources":["../../../../src/components/Amount/Amount.tsx"],"sourcesContent":["import { PureComponent } from 'react'\nimport cx from 'clsx'\nimport { Color } from '../../mixins/color'\nimport { ResponsiveNamedProperty } from '../../mixins/responsive-property'\nimport { BaseProps } from '../../shared/interfaces'\nimport { Text } from '../Text
|
|
1
|
+
{"version":3,"file":"Amount.js","sources":["../../../../src/components/Amount/Amount.tsx"],"sourcesContent":["import { PureComponent } from 'react'\nimport cx from 'clsx'\nimport { Color } from '../../mixins/color'\nimport { ResponsiveNamedProperty } from '../../mixins/responsive-property'\nimport { BaseProps } from '../../shared/interfaces'\nimport { Text } from '../Text'\nimport { Display } from '../../mixins/display'\nimport { CurrencyCodes, CURRENCY_MAP } from './data'\nimport * as Styled from './style'\n\nexport interface AmountProps extends BaseProps, Color, ResponsiveNamedProperty<'size'>, Display {\n /**\n * Value for amount\n */\n value?: number\n /**\n * Digits after point\n */\n digitsAfterPoint?: number\n /**\n * Show zero minor part\n */\n showZeroMinorPart?: boolean\n /**\n * Separator of major and minor part of amount\n */\n separator?: string\n /**\n * International code of currency.\n */\n currency?: keyof typeof CurrencyCodes | string\n /**\n * Use Header component for display amount\n */\n isHeader?: boolean\n /**\n * Amount is not valid and will be crossed out with ```text-decoration: line-through```\n */\n crossedOut?: boolean\n /**\n * If need only currency symbol\n */\n onlyCurrency?: boolean\n}\n\nconst AMOUNT_MAJOR_PART_SIZE = 3\nconst ZERO_MINOR_PART_REGEXP = /^0+$/\nconst MINUS_SIGN_HTML_CODE = '\\u2212'\n\nfunction createSplitter(partSize: number): (_s: string) => string[] {\n const parts = (str: string): string[] => {\n const { length } = str\n\n if (length <= partSize) {\n return [str]\n }\n\n const from = length - partSize\n const to = length\n\n return [str.slice(from, to)].concat(parts(str.slice(0, from)))\n }\n\n return parts\n}\n\nfunction formatAmount(\n value: AmountProps['value'] = 0,\n digitsAfterPoint: AmountProps['digitsAfterPoint'],\n currencyCode: AmountProps['currency']\n) {\n const isNegative = value < 0\n\n const valueAbs = Math.abs(value)\n const valueAbsStr = valueAbs.toFixed(digitsAfterPoint)\n\n const numberParts = valueAbsStr.split('.')\n const majorPart = numberParts[0]\n const minorPart = numberParts[1]\n\n const amountSplitter = createSplitter(AMOUNT_MAJOR_PART_SIZE)\n\n const majorPartFormatted = amountSplitter(majorPart).reverse().join(' ')\n\n const formattedValueStr = majorPartFormatted + (minorPart ? `,${minorPart}` : '')\n\n return {\n majorPart: majorPartFormatted,\n minorPart,\n value: formattedValueStr,\n isNegative,\n currencySymbol: currencyCode ? Amount.getCurrencySymbol(currencyCode) : '',\n }\n}\n\n/**\n * Расширен:\n * - [`BaseProps`](#/Миксины)\n * - [`Color`](#/Миксины)\n * - [`ResponsiveNamedProperty<'size'>`](#/Миксины)\n */\nexport class Amount extends PureComponent<AmountProps> {\n static displayName = 'Amount'\n static defaultProps = {\n isHeader: false,\n showZeroMinorPart: false,\n crossedOut: false,\n digitsAfterPoint: 2,\n separator: ',',\n onlyCurrency: false,\n }\n\n static getCurrencySymbol(currencyCode: keyof typeof CurrencyCodes | string) {\n return CURRENCY_MAP[currencyCode] || currencyCode\n }\n\n renderMinorPart(minorPart: string) {\n const { showZeroMinorPart, separator } = this.props\n\n let needMinorPart = false\n\n if (minorPart) {\n needMinorPart = true\n\n if (!showZeroMinorPart && ZERO_MINOR_PART_REGEXP.test(minorPart)) {\n needMinorPart = false\n }\n }\n\n if (needMinorPart) {\n return (\n <span className='minor-container'>\n <span className='separator'>{separator}</span>\n <span className='minor'>{minorPart}</span>\n </span>\n )\n }\n\n return null\n }\n\n renderCurrencySymbol = (currencySymbol: string) => (\n <span style={{ position: 'relative' }}>\n {this.props.currency === 'RUR' ? (\n <span\n style={{\n position: 'absolute',\n width: 0,\n opacity: 0,\n visibility: 'hidden',\n }}\n >\n руб.\n </span>\n ) : null}\n <span>{` ${currencySymbol}`}</span>\n </span>\n )\n\n render() {\n const { value, digitsAfterPoint, currency, isHeader, className, style, crossedOut, onlyCurrency, ...rest } =\n this.props\n\n const { majorPart, minorPart, isNegative, currencySymbol } = formatAmount(value, digitsAfterPoint, currency)\n\n const classNames = cx('amount', className)\n\n const amountInner = (\n <Styled.Root className={classNames} style={style} crossedOut={crossedOut}>\n {!onlyCurrency ? (\n <>\n <span className='major'>\n {isNegative && MINUS_SIGN_HTML_CODE}\n {majorPart}\n </span>\n {this.renderMinorPart(minorPart)}\n </>\n ) : null}\n {currency && this.renderCurrencySymbol(currencySymbol)}\n </Styled.Root>\n )\n\n const Element = isHeader ? Text.Heading : Text\n\n return (\n <Element {...rest} as='span'>\n {amountInner}\n </Element>\n )\n }\n}\n"],"names":["ZERO_MINOR_PART_REGEXP","createSplitter","partSize","parts","str","length","from","slice","concat","Amount","PureComponent","constructor","super","arguments","this","renderCurrencySymbol","currencySymbol","_jsxs","style","position","children","props","currency","_jsx","width","opacity","visibility","static","currencyCode","CURRENCY_MAP","renderMinorPart","minorPart","showZeroMinorPart","separator","needMinorPart","test","className","render","_this$props","value","digitsAfterPoint","isHeader","crossedOut","onlyCurrency","rest","_objectWithoutProperties","_excluded","majorPart","isNegative","r","e","t","undefined","numberParts","Math","abs","toFixed","split","majorPartFormatted","reverse","join","formattedValueStr","getCurrencySymbol","classNames","cx","amountInner","Styled.Root","_Fragment","Text","Heading","_objectSpread","as","displayName","defaultProps"],"mappings":"6cA8CA,IAAMA,EAAyB,OAG/B,SAASC,EAAeC,GACtB,IAAMC,EAASC,IACb,IAAMC,OAAEA,GAAWD,EAEnB,GAAIC,GAAUH,EACZ,MAAO,CAACE,GAGV,IAAME,EAAOD,EAASH,EAGtB,MAAO,CAACE,EAAIG,MAAMD,EAFPD,IAEkBG,OAAOL,EAAMC,EAAIG,MAAM,EAAGD,MAGzD,OAAOH,EAsCF,MAAMM,UAAeC,EAA2BC,cAAAC,SAAAC,WAAAC,KAwCrDC,qBAAwBC,GACtBC,EAAA,OAAA,CAAMC,MAAO,CAAEC,SAAU,YAAzBC,SAAA,CAC2B,QAAxBN,KAAKO,MAAMC,SACVC,EAAA,OAAA,CACEL,MAAO,CACLC,SAAU,WACVK,MAAO,EACPC,QAAS,EACTC,WAAY,UALhBN,SAAA,SAUE,KACJG,EAAA,OAAA,CAAAH,SAAA,IAAAZ,OAAWQ,QA3CSW,yBAACC,GACvB,OAAOC,EAAaD,IAAiBA,EAGvCE,gBAAgBC,GACd,IAAMC,kBAAEA,EAAFC,UAAqBA,GAAcnB,KAAKO,MAE9C,IAAIa,GAAAA,EAUJ,OARIH,IACFG,MAEKF,GAAqBhC,EAAuBmC,KAAKJ,KACpDG,GAAgB,IAIhBA,EAEAjB,EAAA,OAAA,CAAMmB,UAAU,kBAAhBhB,SACE,CAAAG,EAAA,OAAA,CAAMa,UAAU,YAAhBhB,SAA6Ba,IAC7BV,EAAA,OAAA,CAAMa,UAAU,QAAhBhB,SAAyBW,OAKxB,KAqBTM,SACE,IAAAC,EACExB,KAAKO,OADDkB,MAAEA,EAAFC,iBAASA,EAATlB,SAA2BA,EAA3BmB,SAAqCA,EAArCL,UAA+CA,EAA/ClB,MAA0DA,EAA1DwB,WAAiEA,EAAjEC,aAA6EA,GAAnFL,EAAoGM,EAApGC,EAAAP,EAAAQ,GAGA,IAAMC,UAAEA,EAAFhB,UAAaA,EAAbiB,WAAwBA,EAAxBhC,eAAoCA,GAjG9C,SAAAiC,EAAAC,EAAAC,GAIE,IAHAZ,+BADFU,EAAAA,EACgC,EAG9B,IAFAT,EAEA3B,UAAAR,OAAA,EAJF6C,SAIE,IADAtB,EACAf,UAAAR,OAAA,EAJF8C,OAIEC,EACA,IAAMJ,EAAaT,EAAQ,EAK3B,IAAMc,EAHWC,KAAKC,IAAIhB,GACGiB,QAAQhB,GAELiB,MAAM,KACtC,IAAMV,EAAYM,EAAY,GAC9B,IAAMtB,EAAYsB,EAAY,GAI9B,IAAMK,EAFiBzD,EAnCM,EAmCNA,CAEmB8C,GAAWY,UAAUC,KAAK,KAEpE,IAAMC,EAAoBH,GAAsB3B,EAAgBA,IAAAA,OAAAA,GAAc,IAE9E,MAAO,CACLgB,UAAWW,EACX3B,UAAAA,EACAQ,MAAOsB,EACPb,WAAAA,EACAhC,eAAgBY,EAAenB,EAAOqD,kBAAkBlC,GAAgB,IAzB5E,CAiG8EW,EAAOC,EAAkBlB,GAEnG,IAAMyC,EAAaC,EAAG,SAAU5B,GAEhC,IAAM6B,EACJhD,EAACiD,EAAD,CAAa9B,UAAW2B,EAAY7C,MAAOA,EAAOwB,WAAYA,EAA9DtB,SACG,CAACuB,EAQE,KAPF1B,EAAAkD,EAAA,CAAA/C,SACE,CAAAH,EAAA,OAAA,CAAMmB,UAAU,QAAhBhB,SAAA,CACG4B,GA7Hc,IA8HdD,KAEFjC,KAAKgB,gBAAgBC,MAGzBT,GAAYR,KAAKC,qBAAqBC,MAM3C,OACEO,EAHckB,EAAW2B,EAAKC,QAAUD,EAGxCE,EAAAA,EAAA,GAAa1B,GAAb,GAAA,CAAmB2B,GAAG,OAAtBnD,SACG6C,MArFIxD,EACJ+D,YAAc,SADV/D,EAEJgE,aAAe,CACpBhC,UAAAA,EACAT,mBAAmB,EACnBU,cACAF,iBAAkB,EAClBP,UAAW,IACXU"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Badge.js","sources":["../../../../src/components/Badge/Badge.tsx"],"sourcesContent":["import { useClassname } from 'hooks/useClassname'\nimport { Color } from '../../mixins/color'\nimport { Display } from '../../mixins/display'\nimport { BaseProps } from '../../shared/interfaces'\nimport { Text, TextProps } from '
|
|
1
|
+
{"version":3,"file":"Badge.js","sources":["../../../../src/components/Badge/Badge.tsx"],"sourcesContent":["import { useClassname } from 'hooks/useClassname'\nimport { Color } from '../../mixins/color'\nimport { Display } from '../../mixins/display'\nimport { BaseProps } from '../../shared/interfaces'\nimport { Text, TextProps } from '../Text'\nimport * as Styled from './style'\n\nexport interface BadgeProps extends BaseProps, Color, Display {\n /**\n * Children react node\n */\n children?: React.ReactNode\n content?: string | React.ReactNode\n textProps?: TextProps\n /** Make badge round */\n round?: string\n}\n\nBadge.displayName = 'Badge'\n\n/**\n * Расширен:\n * - [`BaseProps`](#/Миксины)\n * - [`Color`](#/Миксины)\n * - [`Display`](#/Миксины)\n */\nexport function Badge({\n children,\n content,\n className,\n textProps,\n round,\n display = 'inline-block',\n ...restProps\n}: BadgeProps) {\n const _className = useClassname(Badge.displayName, className)\n return (\n <Styled.Root round={round} display={display} className={_className} {...restProps}>\n <Text\n className='text'\n size={round ? 10 : 12}\n weight={round ? 'bolder' : 'normal'}\n lineHeight='s'\n content={typeof content === 'string' ? content : undefined}\n {...textProps}\n >\n {children || content}\n </Text>\n </Styled.Root>\n )\n}\n"],"names":["Badge","_ref","children","content","className","textProps","round","display","restProps","_objectWithoutProperties","_excluded","_className","useClassname","displayName","_jsx","Styled.Root","_objectSpread","Text","size","weight","lineHeight","undefined"],"mappings":"qWA0BO,SAASA,EAQDC,GAAA,IAROC,SACpBA,EADoBC,QAEpBA,EAFoBC,UAGpBA,EAHoBC,UAIpBA,EAJoBC,MAKpBA,EALoBC,QAMpBA,EAAU,gBAEGN,EADVO,EACUC,EAAAR,EAAAS,GACb,IAAMC,EAAaC,EAAaZ,EAAMa,YAAaT,GACnD,OACEU,EAACC,EAADC,EAAAA,EAAA,CAAaV,MAAOA,EAAOC,QAASA,EAASH,UAAWO,GAAgBH,GAAxE,GAAA,CAAAN,SACEY,EAACG,EAADD,EAAAA,EAAA,CACEZ,UAAU,OACVc,KAAMZ,EAAQ,GAAK,GACnBa,OAAQb,EAAQ,SAAW,SAC3Bc,WAAW,IACXjB,QAA4B,iBAAZA,EAAuBA,OAAUkB,GAC7ChB,GANN,GAAA,CAAAH,SAQGA,GAAYC,QA5BrBH,EAAMa,YAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tag.js","sources":["../../../../src/components/Tag/Tag.tsx"],"sourcesContent":["import { ResponsiveNamedProperty } from '../../mixins/responsive-property'\nimport { Color } from '../../mixins/color'\nimport { Display } from '../../mixins/display'\nimport { BaseProps } from '../../shared/interfaces'\nimport { TextProps } from '../Text
|
|
1
|
+
{"version":3,"file":"Tag.js","sources":["../../../../src/components/Tag/Tag.tsx"],"sourcesContent":["import { ResponsiveNamedProperty } from '../../mixins/responsive-property'\nimport { Color } from '../../mixins/color'\nimport { Display } from '../../mixins/display'\nimport { BaseProps } from '../../shared/interfaces'\nimport { TextProps } from '../Text'\nimport * as Styled from './style'\n\nexport interface TagProps\n extends BaseProps,\n Display,\n Color,\n ResponsiveNamedProperty<'height'>,\n ResponsiveNamedProperty<'width'> {\n as?: 'button' | 'div' | 'input' | 'label'\n /**\n * Field id\n */\n id?: string\n /**\n * Field name\n */\n name?: string\n /**\n * Input type\n */\n inputType?: 'checkbox' | 'radio'\n /**\n * On change handler\n */\n onChange?(_e: React.ChangeEvent<HTMLInputElement>): void\n /**\n * On click handler\n */\n onClick?(_e: React.MouseEvent<HTMLInputElement>): void\n /**\n * Whether or not Radio is checked\n */\n defaultChecked?: boolean\n /**\n * Value\n */\n value?: string | number\n /** Children are placed before Text */\n /**\n * Children react node\n */\n children?: React.ReactNode\n /** Inner Text content */\n content?: React.ReactNode\n /** Inner Text component props */\n textProps?: TextProps\n /** Checked state */\n checked?: boolean\n /** Disabled state */\n disabled?: boolean\n /** Error state */\n error?: boolean\n /** If as = 'label' could provide for */\n htmlFor?: string\n /**\n * inverse\n */\n inverse?: boolean\n /**\n * Size\n */\n size?: 'l' | 'm' | 's' | 'xs'\n}\n\nTag.defaultProps = {\n display: 'inline-block',\n as: 'button',\n height: 40,\n}\n\nTagInput.defaultProps = {\n display: 'inline-block',\n height: 40,\n}\n\n// Prevent brakechanges\nTag.Input = TagInput\n\nTag.displayName = 'Tag'\n\nfunction TagInput(props: typeof TagInput.defaultProps & TagProps) {\n return <Tag as='input' {...props} />\n}\n\n/**\n * Расширен:\n * - [`BaseProps`](#/Миксины)\n * - [`Display`](#/Миксины)\n * - [`Color`](#/Миксины)\n * - [`ResponsiveNamedProperty<'width'>`](#/Миксины)\n * - [`ResponsiveNamedProperty<'height'>`](#/Миксины)\n */\nexport function Tag(props: typeof Tag.defaultProps & TagProps) {\n const {\n as,\n textProps,\n content,\n children,\n htmlFor,\n id,\n name,\n inputType,\n value,\n disabled,\n onChange,\n onClick,\n inverse,\n checked,\n ...restProps\n } = props\n\n const buttonProps = as === 'button' ? { type: 'button' } : {}\n const labelProps = as === 'label' ? { htmlFor } : {}\n const inputProps = as === 'input' ? { htmlFor: id || name } : {}\n\n return (\n <Styled.Root\n as={as === 'input' ? 'label' : as}\n inverse={inverse}\n checked={checked}\n disabled={disabled}\n onClick={as !== 'input' ? onClick : undefined}\n {...labelProps}\n {...buttonProps}\n {...inputProps}\n {...restProps}\n >\n {as === 'input' ? (\n <input\n id={id || name}\n name={name}\n type={inputType || 'checkbox'}\n tabIndex={0}\n onChange={(e) => {\n e.persist()\n\n return onChange && onChange(e)\n }}\n onClick={(e) => {\n e.persist()\n\n return onClick && onClick(e)\n }}\n defaultChecked={props.defaultChecked}\n checked={checked}\n value={value}\n disabled={disabled}\n hidden\n />\n ) : null}\n {children}\n <Styled.Text size={14} forwardedAs='span' color={checked && !inverse ? 'white' : 'mineShaft'} {...textProps}>\n {content}\n </Styled.Text>\n </Styled.Root>\n )\n}\n"],"names":["TagInput","props","_jsx","Tag","_objectSpread","as","textProps","content","children","htmlFor","id","name","inputType","value","disabled","onChange","onClick","inverse","checked","restProps","_excluded","buttonProps","type","inputProps","_jsxs","Styled.Root","tabIndex","_onChange","_x","apply","this","arguments","toString","e","persist","_onClick","_x2","defaultChecked","hidden","Styled.Text","size","forwardedAs","color","defaultProps","display","height","Input","displayName"],"mappings":"4VAqFA,SAASA,EAASC,GAChB,OAAOC,EAACC,EAADC,EAAA,CAAKC,GAAG,SAAYJ,IAWtB,SAASE,EAAIF,GAClB,IAAMI,GACJA,EADIC,UAEJA,EAFIC,QAGJA,EAHIC,SAIJA,EAJIC,QAKJA,EALIC,GAMJA,EANIC,KAOJA,EAPIC,UAQJA,EARIC,MASJA,EATIC,SAUJA,EAVIC,SAWJA,EAXIC,QAYJA,EAZIC,QAaJA,EAbIC,QAcJA,GAEEjB,EADCkB,IACDlB,EAhBJmB,GAkBA,IAAMC,EAAqB,WAAPhB,EAAkB,CAAEiB,KAAM,UAAa,GAE3D,IAAMC,EAAoB,UAAPlB,EAAiB,CAAEI,QAASC,GAAMC,GAAS,GAE9D,OACEa,EAACC,EAADrB,EAAAA,EAAAA,EAAAA,EAAAA,EAAA,CACEC,GAAW,UAAPA,EAAiB,QAAUA,EAC/BY,QAASA,EACTC,QAASA,EACTJ,SAAUA,EACVE,QAAgB,UAAPX,EAAiBW,OAAAA,GATJ,UAAPX,EAAiB,CAAEI,QAAAA,GAAY,IAW1CY,GACAE,GACAJ,GATN,GAAA,CAAAX,SAWGH,CAAO,UAAPA,EACCH,EAAA,QAAA,CACEQ,GAAIA,GAAMC,EACVA,KAAMA,EACNW,KAAMV,GAAa,WACnBc,SAAU,EACVX,SAAQ,SAAAY,GAAA,SAAAZ,EAAAa,GAAA,OAAAD,EAAAE,MAAAC,KAAAC,WAAA,OAAAhB,EAAAiB,SAAA,IAAAL,EAAAK,WAAAjB,EAAA,EAAGkB,IACTA,EAAEC,UAEKnB,GAAYA,EAASkB,MAE9BjB,QAAO,SAAAmB,GAAA,SAAAnB,EAAAoB,GAAA,OAAAD,EAAAN,MAAAC,KAAAC,WAAA,OAAAf,EAAAgB,SAAA,IAAAG,EAAAH,WAAAhB,EAAA,EAAGiB,IACRA,EAAEC,UAEKlB,GAAWA,EAAQiB,MAE5BI,eAAgBpC,EAAMoC,eACtBnB,QAASA,EACTL,MAAOA,EACPC,SAAUA,EACVwB,QAAM,IAEN,KACH9B,EACDN,EAACqC,EAADnC,EAAAA,EAAA,CAAaoC,KAAM,GAAIC,YAAY,OAAOC,MAAOxB,IAAYD,EAAU,QAAU,aAAiBX,GAAlG,GAAA,CAAAE,SACGD,SAxFTJ,EAAIwC,aAAe,CACjBC,QAAS,eACTvC,GAAI,SACJwC,OAAQ,IAGV7C,EAAS2C,aAAe,CACtBC,QAAS,eACTC,OAAQ,IAIV1C,EAAI2C,MAAQ9C,EAEZG,EAAI4C,YAAc"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"style.js","sources":["../../../../src/components/Tag/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { display } from 'mixins/display'\nimport { color } from 'mixins/color'\nimport { property, PossibleValues, responsiveNamedProperty } from 'mixins/responsive-property'\nimport { Text as UiText, TextProps } from '../Text
|
|
1
|
+
{"version":3,"file":"style.js","sources":["../../../../src/components/Tag/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { display } from 'mixins/display'\nimport { color } from 'mixins/color'\nimport { property, PossibleValues, responsiveNamedProperty } from 'mixins/responsive-property'\nimport { Text as UiText, TextProps } from '../Text'\nimport { TagProps } from './Tag'\n\nconst WIDTHS: Record<Partial<Exclude<TagProps['size'], 'auto' | undefined>>, number> = {\n l: 220,\n m: 182,\n s: 100,\n xs: 60,\n}\n\nconst chooseWidthValue = (props: TagProps): PossibleValues => {\n if (props.width === 'auto') return 'auto'\n if (typeof props.width === 'number') return props.width\n\n if (props.size && WIDTHS[props.size]) return WIDTHS[props.size]\n\n return 'auto'\n}\n\nconst active = css`\n border-color: transparent;\n background-color: currentColor;\n`\n\nexport const Text = styled(UiText)<TextProps>`\n display: inline-block;\n vertical-align: middle;\n white-space: nowrap;\n text-overflow: ellipsis;\n max-width: 100%;\n overflow: hidden;\n vertical-align: middle;\n transition: color 0.25s ease;\n`\n\nconst disabled = css`\n cursor: not-allowed;\n background-color: rgba(0, 0, 0, 0.04);\n ${Text} {\n color: rgba(0, 0, 0, 0.16);\n }\n`\n\nexport const Root = styled.button.withConfig<TagProps>({\n shouldForwardProp: (prop) => ['children', 'htmlFor', 'className', 'style', 'onClick'].includes(prop),\n})`\n padding: 0px 16px;\n margin-bottom: 10px;\n border-radius: 3px;\n background-color: ${(props) => props.theme.colors.white};\n border: 1px solid ${(props) => props.theme.colors.whiteGray};\n box-sizing: border-box;\n vertical-align: middle;\n transition: color 0.25s ease, background 0.25s ease, border-color 0.25s ease;\n cursor: pointer;\n text-align: center;\n touch-action: manipulation;\n min-width: 60px;\n\n ${(props) => (props.size ? property(chooseWidthValue(props), 'width') : null)}\n ${(props) => (props.height ? property(props.height, 'line-height') : null)}\n ${(props) => (props.height ? property(props.height, 'height') : null)}\n ${({ heightXS, heightS, heightM, heightL, heightXL }) =>\n responsiveNamedProperty({ sizes: { heightXS, heightS, heightM, heightL, heightXL }, cssProperty: 'height' })}\n\n ${(props) => (props.width ? property(props.width, 'width') : null)}\n ${({ widthXS, widthS, widthM, widthL, widthXL }) =>\n responsiveNamedProperty({ sizes: { widthXS, widthS, widthM, widthL, widthXL }, cssProperty: 'width' })}\n\n ${(props) => (props.display ? display(props.display) : null)}\n ${(props) => (props.color ? color(props.color) : null)}\n\n &:not(:last-child) {\n margin-right: 20px;\n }\n\n ${(props) =>\n !props.disabled\n ? css`\n &:hover:not(:disabled) {\n border-color: currentColor;\n }\n &:active:not(:disabled) {\n ${active}\n ${Text} {\n color: ${(props) => props.theme.colors.white};\n }\n }\n `\n : null}\n\n ${(props) => (props.inverse || props.checked ? active : null)}\n\n &:disabled {\n ${disabled}\n }\n ${(props) => (props.disabled ? disabled : null)}\n`\n"],"names":["WIDTHS","l","m","s","xs","active","css","Text","styled","UiText","withConfig","componentId","disabled","Root","button","shouldForwardProp","prop","includes","props","theme","colors","white","whiteGray","size","property","width","height","_ref","heightXS","heightS","heightM","heightL","heightXL","responsiveNamedProperty","sizes","cssProperty","_ref2","widthXS","widthS","widthM","widthL","widthXL","display","color","inverse","checked"],"mappings":"8QAOA,IAAMA,EAAiF,CACrFC,EAAG,IACHC,EAAG,IACHC,EAAG,IACHC,GAAI,IAYN,IAAMC,EAASC,EAAf,CAAA,gEAKaC,EAAOC,EAAOC,GAAVC,WAAA,CAAAC,YAAA,uBAAGH,CAAb,CAAA,2KAWP,IAAMI,EAAWN,EAAH,CAAA,wDAAA,6BAGVC,GAKG,IAAMM,EAAOL,EAAOM,OAAOJ,WAAqB,CACrDK,kBAAoBC,GAAS,CAAC,WAAY,UAAW,YAAa,QAAS,WAAWC,SAASD,KADhFN,WAAA,CAAAC,YAAA,uBAAGH,CAAH,CAAA,0EAAA,qBAAA,oMAAA,IAAA,IAAA,IAAA,IAAA,IAAA,IAAA,IAAA,0CAAA,IAAA,eAAA,IAAA,KAMMU,GAAUA,EAAMC,MAAMC,OAAOC,QAC7BH,GAAUA,EAAMC,MAAMC,OAAOE,YAS/CJ,GAAWA,EAAMK,KAAOC,EAjDHN,CAAAA,GACJ,SAAhBA,EAAMO,MAAyB,OACR,iBAAhBP,EAAMO,MAA2BP,EAAMO,MAE9CP,EAAMK,MAAQvB,EAAOkB,EAAMK,MAAcvB,EAAOkB,EAAMK,MAEnD,OANiBL,CAiD6BA,GAAQ,SAAW,OACrEA,GAAWA,EAAMQ,OAASF,EAASN,EAAMQ,OAAQ,eAAiB,OAClER,GAAWA,EAAMQ,OAASF,EAASN,EAAMQ,OAAQ,UAAY,OAC9DC,IAAA,IAACC,SAAEA,EAAFC,QAAYA,EAAZC,QAAqBA,EAArBC,QAA8BA,EAA9BC,SAAuCA,GAAxCL,EAAA,OACAM,EAAwB,CAAEC,MAAO,CAAEN,SAAAA,EAAUC,QAAAA,EAASC,QAAAA,EAASC,QAAAA,EAASC,SAAAA,GAAYG,YAAa,cAEhGjB,GAAWA,EAAMO,MAAQD,EAASN,EAAMO,MAAO,SAAW,OACzDW,IAAA,IAACC,QAAEA,EAAFC,OAAWA,EAAXC,OAAmBA,EAAnBC,OAA2BA,EAA3BC,QAAmCA,GAApCL,EAAA,OACFH,EAAwB,CAAEC,MAAO,CAAEG,QAAAA,EAASC,OAAAA,EAAQC,OAAAA,EAAQC,OAAAA,EAAQC,QAAAA,GAAWN,YAAa,aAE3FjB,GAAWA,EAAMwB,QAAUA,EAAQxB,EAAMwB,SAAW,OACpDxB,GAAWA,EAAMyB,MAAQA,EAAMzB,EAAMyB,OAAS,OAM9CzB,GACAA,EAAMN,SAYH,KAXAN,EADJ,CAAA,6EAAA,IAAA,UAAA,OAMUD,EACAE,GACUW,GAAUA,EAAMC,MAAMC,OAAOC,UAMhDH,GAAWA,EAAM0B,SAAW1B,EAAM2B,QAAUxC,EAAS,MAGpDO,GAEDM,GAAWA,EAAMN,SAAWA,EAAW"}
|
package/components/Text/Text.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{useClassname as
|
|
1
|
+
import e from'@babel/runtime/helpers/objectSpread2';import i from'@babel/runtime/helpers/objectWithoutProperties';import{useClassname as s}from'../../hooks/useClassname.js';import{useFallbackTheme as t}from'../../hooks/use-theme.js';import{useConfigPriority as l}from'../../hooks/use-config-priority.js';import{TextHeading as o}from'../Text.Heading/Text.Heading.js';import{TextEllipse as a}from'../Text.Ellipse/Text.Ellipse.js';import{Root as r}from'./style.js';import{jsx as n}from'react/jsx-runtime';var m=["as","children","weight","content","textAlign","underlineLinks","className","style","lineHeight","fontStyle","fontFamily","title","color","size","sizeXS","sizeS","sizeM","sizeL","sizeXL","display"];var p='Text';var z=o=>{var a;var p=t();var d=l(null===(a=p.components)||void 0===a?void 0:a.Text,o),{as:y="div",children:h,weight:c="normal",content:f,textAlign:g,underlineLinks:u,className:x,style:S,lineHeight:L="m",fontStyle:T="normal",fontFamily:j,title:v,color:H,size:N="m",sizeXS:k,sizeS:X,sizeM:b,sizeL:M,sizeXL:E,display:A}=d,F=i(d,m);var w=s(z.displayName,x);return n(r,e(e({},F),{},h?{as:y,color:H,className:w,title:v,weight:c,lineHeight:L,textAlign:g,fontStyle:T,fontFamily:j,underlineLinks:u,size:N,sizeXS:k,sizeS:X,sizeM:b,sizeL:M,sizeXL:E,display:A,style:S,children:h}:{as:y,color:H,className:w,title:v,weight:c,lineHeight:L,textAlign:g,fontStyle:T,fontFamily:j,underlineLinks:u,size:N,sizeXS:k,sizeS:X,sizeM:b,sizeL:M,sizeXL:E,display:A,style:S,dangerouslySetInnerHTML:{__html:f||''}}))};z.Heading=o,z.Ellipse=a,z.displayName="Text";export{p as COMPONENT_NAME,z as Text};
|
|
2
2
|
//# sourceMappingURL=Text.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Text.js","sources":["../../../../src/components/Text/Text.tsx"],"sourcesContent":["import { useClassname } from 'hooks/useClassname'\nimport {
|
|
1
|
+
{"version":3,"file":"Text.js","sources":["../../../../src/components/Text/Text.tsx"],"sourcesContent":["import { useClassname } from 'hooks/useClassname'\nimport { useFallbackTheme } from 'hooks/use-theme'\nimport { useConfigPriority } from 'hooks/use-config-priority'\nimport { TextHeading } from '../../components/Text.Heading'\nimport { TextEllipse } from '../../components/Text.Ellipse'\nimport type { TextProps } from './types'\nimport * as Styled from './style'\n\nconst COMPONENT_NAME = 'Text'\n\nconst Text = (props: TextProps) => {\n const theme = useFallbackTheme()\n\n const {\n as = 'div',\n children,\n weight = 'normal',\n content,\n textAlign,\n underlineLinks,\n className: origClassName,\n style,\n lineHeight = 'm',\n fontStyle = 'normal',\n fontFamily,\n title,\n color,\n size = 'm',\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n display,\n ...configProps\n } = useConfigPriority<TextProps>(theme.components?.[COMPONENT_NAME], props)\n\n const className = useClassname(Text.displayName, origClassName)\n\n if (children) {\n return (\n <Styled.Root\n {...configProps}\n as={as}\n color={color}\n className={className}\n title={title}\n weight={weight}\n lineHeight={lineHeight}\n textAlign={textAlign}\n fontStyle={fontStyle}\n fontFamily={fontFamily}\n underlineLinks={underlineLinks}\n size={size}\n sizeXS={sizeXS}\n sizeS={sizeS}\n sizeM={sizeM}\n sizeL={sizeL}\n sizeXL={sizeXL}\n display={display}\n style={style}\n >\n {children}\n </Styled.Root>\n )\n }\n\n return (\n <Styled.Root\n {...configProps}\n as={as}\n color={color}\n className={className}\n title={title}\n weight={weight}\n lineHeight={lineHeight}\n textAlign={textAlign}\n fontStyle={fontStyle}\n fontFamily={fontFamily}\n underlineLinks={underlineLinks}\n size={size}\n sizeXS={sizeXS}\n sizeS={sizeS}\n sizeM={sizeM}\n sizeL={sizeL}\n sizeXL={sizeXL}\n display={display}\n style={style}\n dangerouslySetInnerHTML={{ __html: content || '' }}\n />\n )\n}\n\nText.Heading = TextHeading\nText.Ellipse = TextEllipse\nText.displayName = COMPONENT_NAME\n\nexport { Text, COMPONENT_NAME }\n"],"names":["COMPONENT_NAME","Text","props","_theme$components","theme","useFallbackTheme","useConfigPriority","components","as","children","weight","content","textAlign","underlineLinks","className","origClassName","style","lineHeight","fontStyle","fontFamily","title","color","size","sizeXS","sizeS","sizeM","sizeL","sizeXL","display","_useConfigPriority","configProps","_objectWithoutProperties","_excluded","useClassname","displayName","_jsx","Styled.Root","dangerouslySetInnerHTML","__html","Heading","TextHeading","Ellipse","TextEllipse"],"mappings":"msBAQMA,IAAAA,EAAiB,OAEjBC,IAAAA,EAAQC,IAAqB,IAAAC,EACjC,IAAMC,EAAQC,IAEd,IAsBIC,EAAAA,EAA6B,QAAAF,EAAAA,EAAMG,kBAAAA,IAANJ,OAAAA,EAAAA,EAAAF,KAAoCC,IAtB/DM,GACJA,EAAK,MADDC,SAEJA,EAFIC,OAGJA,EAAS,SAHLC,QAIJA,EAJIC,UAKJA,EALIC,eAMJA,EACAC,UAAWC,EAPPC,MAQJA,EARIC,WASJA,EAAa,IATTC,UAUJA,EAAY,SAVRC,WAWJA,EAXIC,MAYJA,EAZIC,MAaJA,EAbIC,KAcJA,EAAO,IAdHC,OAeJA,EAfIC,MAgBJA,EAhBIC,MAiBJA,EAjBIC,MAkBJA,EAlBIC,OAmBJA,EAnBIC,QAoBJA,GApBFC,EAqBKC,EArBLC,EAAAF,EAAAG,GAwBA,IAAMlB,EAAYmB,EAAahC,EAAKiC,YAAanB,GAEjD,OAEIoB,EAACC,SACKN,GADN,GAFArB,EAEA,CAEED,GAAIA,EACJa,MAAOA,EACPP,UAAWA,EACXM,MAAOA,EACPV,OAAQA,EACRO,WAAYA,EACZL,UAAWA,EACXM,UAAWA,EACXC,WAAYA,EACZN,eAAgBA,EAChBS,KAAMA,EACNC,OAAQA,EACRC,MAAOA,EACPC,MAAOA,EACPC,MAAOA,EACPC,OAAQA,EACRC,QAASA,EACTZ,MAAOA,EAnBTP,SAqBGA,GAML,CAEED,GAAIA,EACJa,MAAOA,EACPP,UAAWA,EACXM,MAAOA,EACPV,OAAQA,EACRO,WAAYA,EACZL,UAAWA,EACXM,UAAWA,EACXC,WAAYA,EACZN,eAAgBA,EAChBS,KAAMA,EACNC,OAAQA,EACRC,MAAOA,EACPC,MAAOA,EACPC,MAAOA,EACPC,OAAQA,EACRC,QAASA,EACTZ,MAAOA,EACPqB,wBAAyB,CAAEC,OAAQ3B,GAAW,QAKpDV,EAAKsC,QAAUC,EACfvC,EAAKwC,QAAUC,EACfzC,EAAKiC,YAvFkB"}
|
package/components/Text/style.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import e,{css as i}from'styled-components';import{
|
|
1
|
+
import e,{css as i}from'styled-components';import{injectDefaultTheme as t}from'../../shared/utils/inject-theme.js';import{display as o}from'../../mixins/display.js';import{color as s}from'../../mixins/color.js';import{property as n,responsiveNamedProperty as r}from'../../mixins/responsive-property.js';var a={lighter:100,normal:400,bold:600,bolder:800};var l={l:1.5,m:1.3,s:1.15,xs:1};var c=e.div.withConfig({shouldForwardProp:e=>['children','className','style','title','dangerouslySetInnerHTML'].includes(e)}).attrs(t).withConfig({componentId:"fox-ui__sc-s2fogy-0"})(["line-height:inherit;margin:initial;",""],(e=>{var{theme:t,display:c,color:m,fontStyle:p,fontFamily:f,weight:d,lineHeight:h,underlineLinks:y,textAlign:g,size:z,sizeXS:x,sizeS:u,sizeM:v,sizeL:j,sizeXL:L}=e;return i([""," "," "," "," "," "," a{text-decoration:",";&:hover{text-decoration:none;}}"," "," ",""],c&&o(c),s(m||t.textColor),p&&"font-style: ".concat(p,";"),f&&"font-family: ".concat(f,";"),d&&"font-weight: ".concat('string'==typeof h&&a[d]?a[d]:d,";"),h&&"line-height: ".concat('string'==typeof h&&l[h]?l[h]:h,";"),y?'underline':'none',g&&"text-align: ".concat(g,";"),z&&n(z,'font-size'),r({sizes:{sizeXS:x,sizeS:u,sizeM:v,sizeL:j,sizeXL:L},cssProperty:'font-size'}))}));export{c 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 './
|
|
1
|
+
{"version":3,"file":"style.js","sources":["../../../../src/components/Text/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport { injectDefaultTheme } from 'shared/utils/inject-theme'\nimport { display as displayCss } from '../../mixins/display'\nimport { color as ColorCss, 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\n ${({\n theme,\n display,\n color,\n fontStyle,\n fontFamily,\n weight,\n lineHeight,\n underlineLinks,\n textAlign,\n size,\n sizeXS,\n sizeS,\n sizeM,\n sizeL,\n sizeXL,\n }) => css`\n ${display && displayCss(display)}\n ${color ? ColorCss(color) : ColorCss(theme.textColor as ColorValue)}\n ${fontStyle && `font-style: ${fontStyle};`}\n ${fontFamily && `font-family: ${fontFamily};`}\n ${weight && `font-weight: ${typeof lineHeight === 'string' && WEIGHT_MAP[weight] ? WEIGHT_MAP[weight] : weight};`}\n ${lineHeight &&\n `line-height: ${\n typeof lineHeight === 'string' && LINE_HEIGHT_MAP[lineHeight] ? LINE_HEIGHT_MAP[lineHeight] : lineHeight\n };`}\n\n a {\n text-decoration: ${underlineLinks ? 'underline' : 'none'};\n &:hover {\n text-decoration: none;\n }\n }\n\n ${textAlign && `text-align: ${textAlign};`}\n ${size && property(size, 'font-size')}\n ${responsiveNamedProperty({ sizes: { sizeXS, sizeS, sizeM, sizeL, sizeXL }, cssProperty: 'font-size' })}\n `}\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","_ref","theme","display","color","fontStyle","fontFamily","weight","lineHeight","underlineLinks","textAlign","size","sizeXS","sizeS","sizeM","sizeL","sizeXL","css","displayCss","ColorCss","textColor","concat","property","responsiveNamedProperty","sizes","cssProperty"],"mappings":"+SAOA,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,CAQhB,CAAA,sCAAA,KAAAS,IAAA,IAACC,MACDA,UACAC,QACAC,EAHCC,UAIDA,EAJCC,WAKDA,EALCC,OAMDA,EANCC,WAODA,EAPCC,eAQDA,EARCC,UASDA,EATCC,KAUDA,EAVCC,OAWDA,EAXCC,MAYDA,EAZCC,MAaDA,EAbCC,MAcDA,EAdCC,OAeDA,GAfAf,EAAA,OAgBIgB,+FACFd,GAAWe,EAAWf,GACdgB,EAARf,GAAmCF,EAAMkB,WACzCf,GAAS,eAAAgB,OAAmBhB,EAnB9B,KAoBEC,GAA8BA,gBAAAA,OAAAA,OAC9BC,0BAAgD,iBAAfC,GAA2B3B,EAAW0B,GAAU1B,EAAW0B,GAAUA,EArBxG,KAsBEC,GAEA,gBAAAa,OAAsB,iBAAfb,GAA2BtB,EAAgBsB,GAActB,EAAgBsB,GAAcA,OAI3EC,EAAiB,YAAc,OAMlDC,yBAA4BA,EAAnB,KACTC,GAAQW,EAASX,EAAM,aACvBY,EAAwB,CAAEC,MAAO,CAAEZ,OAAAA,EAAQC,MAAAA,EAAOC,MAAAA,EAAOC,MAAAA,EAAOC,OAAAA,GAAUS,YAAa"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import e from'@babel/runtime/helpers/objectSpread2';import i from'@babel/runtime/helpers/objectWithoutProperties';import{
|
|
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 {
|
|
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 type { 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,sBAANJ,OAAAA,EAAAA,EAZnB,gBAYuDD,IAJtEM,EACJA,EAAI,KADAC,WAEJA,GAFFC,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 e from'@babel/runtime/helpers/objectSpread2';import r from'@babel/runtime/helpers/objectWithoutProperties';import{
|
|
1
|
+
import e from'@babel/runtime/helpers/objectSpread2';import r from'@babel/runtime/helpers/objectWithoutProperties';import{useRef as a,useState as o,useCallback as t,useEffect as s}from'react';import{omit as l}from'ramda';import{useFallbackTheme as i}from'../../hooks/use-theme.js';import{useConfigPriority as n}from'../../hooks/use-config-priority.js';import{Root as d}from'./style.js';import{jsx as m}from'react/jsx-runtime';var u=["preset","disabled","error","fluid","name","onChange","maxLength","placeholder","required","tabIndex","value","className","style","autosize","rounded","cols","rows","maxRows","color","placeholderColor","width"];var c='Textarea';var h=c=>{var h;var p=i();var f=n(null===(h=p.components)||void 0===h?void 0:h.Textarea,l(['children'],c)),{preset:v,disabled:g,error:b,fluid:x,name:C,onChange:y,maxLength:w,placeholder:T,required:j,tabIndex:N,value:R,className:H,style:I,autosize:k=!0,rounded:E=!0,cols:L=20,rows:M=2,maxRows:P=30,color:S="mineShaft",placeholderColor:q="silver",width:z=p.defaultInputControlsWidth}=f,A=r(f,u);var B=a();var[O,W]=o(M);var F=t((e=>{var{target:r}=e;if(r instanceof HTMLTextAreaElement&&k){var a=r.getBoundingClientRect();r.scrollHeight>a.height&&O<P?W(O+1):r.value&&''!==r.value||W(M)}'function'==typeof y&&y(e)}),[y,O,P,k]);s((()=>{if(B&&B.current){var e=B.current;var r=e.getBoundingClientRect();if(e.scrollHeight>r.height){var a=parseInt(getComputedStyle(e).lineHeight,10);var o=Math.floor(e.scrollHeight/a);o<=P&&o>M&&W(o)}}}),[]);var U='brand'===p.preset;return'string'==typeof v&&(U='brand'===v),m(d,e(e({},A),{},{ref:B,className:H,style:I,onChange:F,cols:L,disabled:g,maxLength:w,name:C,placeholder:T,required:j,rows:O,tabIndex:N,value:R,color:S,rounded:E,placeholderColor:q,fluid:x,error:b,width:z,brandPresetUsed:U}))};h.displayName="Textarea";export{c as COMPONENT_NAME,h as Textarea};
|
|
2
2
|
//# sourceMappingURL=Textarea.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Textarea.js","sources":["../../../../src/components/Textarea/Textarea.tsx"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react'\nimport {
|
|
1
|
+
{"version":3,"file":"Textarea.js","sources":["../../../../src/components/Textarea/Textarea.tsx"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react'\nimport { omit } from 'ramda'\nimport { useFallbackTheme } from 'hooks/use-theme'\nimport { useConfigPriority } from 'hooks/use-config-priority'\nimport * as Styled from './style'\nimport type { TextareaProps } from './types'\n\nconst COMPONENT_NAME = 'Textarea'\n\nconst Textarea = (props: TextareaProps) => {\n const theme = useFallbackTheme()\n\n const {\n preset,\n disabled,\n error,\n fluid,\n name,\n onChange,\n maxLength,\n placeholder,\n required,\n tabIndex,\n value,\n className,\n style,\n autosize = true,\n rounded = true,\n cols = 20,\n rows = 2,\n maxRows = 30,\n color = 'mineShaft',\n placeholderColor = 'silver',\n width = theme.defaultInputControlsWidth,\n ...configProps\n } = useConfigPriority<TextareaProps>(theme.components?.[COMPONENT_NAME], omit(['children'], props))\n\n const textarea = useRef() as React.MutableRefObject<HTMLTextAreaElement>\n\n const [tRows, setRows] = useState(rows)\n\n const onChangeHandler: React.ChangeEventHandler<HTMLTextAreaElement> = useCallback(\n (event) => {\n const { target } = event\n\n if (target instanceof HTMLTextAreaElement && autosize) {\n const rect = target.getBoundingClientRect()\n\n if (target.scrollHeight > rect.height && tRows < maxRows) {\n setRows(tRows + 1)\n } else if (!target.value || target.value === '') {\n setRows(rows)\n }\n }\n\n if (typeof onChange === 'function') {\n onChange(event)\n }\n },\n [onChange, tRows, maxRows, autosize]\n )\n\n useEffect(() => {\n if (!textarea || !textarea.current) return\n\n const el = textarea.current\n const rect = el.getBoundingClientRect()\n if (el.scrollHeight > rect.height) {\n const lh = parseInt(getComputedStyle(el).lineHeight, 10)\n const numberOfLines = Math.floor(el.scrollHeight / lh)\n if (numberOfLines <= maxRows && numberOfLines > rows) {\n setRows(numberOfLines)\n }\n }\n }, [])\n\n let brandPresetUsed = theme.preset === 'brand'\n if (typeof preset === 'string') brandPresetUsed = preset === 'brand'\n\n return (\n <Styled.Root\n {...configProps}\n ref={textarea}\n className={className}\n style={style}\n onChange={onChangeHandler}\n cols={cols}\n disabled={disabled}\n maxLength={maxLength}\n name={name}\n placeholder={placeholder}\n required={required}\n rows={tRows}\n tabIndex={tabIndex}\n value={value}\n color={color}\n rounded={rounded}\n placeholderColor={placeholderColor}\n fluid={fluid}\n error={error}\n width={width}\n brandPresetUsed={brandPresetUsed}\n />\n )\n}\n\nTextarea.displayName = COMPONENT_NAME\n\nexport { Textarea, COMPONENT_NAME }\n"],"names":["COMPONENT_NAME","Textarea","props","_theme$components","theme","useFallbackTheme","_useConfigPriority","useConfigPriority","components","omit","preset","disabled","error","fluid","name","onChange","maxLength","placeholder","required","tabIndex","value","className","style","autosize","rounded","cols","rows","maxRows","color","placeholderColor","width","defaultInputControlsWidth","configProps","_objectWithoutProperties","_excluded","textarea","useRef","tRows","setRows","useState","onChangeHandler","useCallback","event","target","HTMLTextAreaElement","rect","getBoundingClientRect","scrollHeight","height","useEffect","current","el","lh","parseInt","getComputedStyle","lineHeight","numberOfLines","Math","floor","brandPresetUsed","_jsx","Styled.Root","ref","displayName"],"mappings":"moBAOMA,IAAAA,EAAiB,WAEjBC,IAAAA,EAAYC,IAAyB,IAAAC,EACzC,IAAMC,EAAQC,IAEd,IAAAC,EAuBIC,EAAiB,QAAgBH,EAAAA,EAAMI,kBAAtB,IAAAL,OAAA,EAAgBA,EAAAF,SAAoCQ,EAAK,CAAC,YAAaP,KAvBtFQ,OACJA,EADIC,SAEJA,EAFIC,MAGJA,EAHIC,MAIJA,EAJIC,KAKJA,EALIC,SAMJA,EANIC,UAOJA,EAPIC,YAQJA,EARIC,SASJA,EATIC,SAUJA,EAVIC,MAWJA,EAXIC,UAYJA,EAZIC,MAaJA,EAbIC,SAcJA,GAAW,EAdPC,QAeJA,GAAAA,EAfIC,KAgBJA,EAAO,GAhBHC,KAiBJA,EAAO,EAjBHC,QAkBJA,EAAU,GAlBNC,MAmBJA,EAAQ,YAnBJC,iBAoBJA,EAAmB,SApBfC,MAqBJA,EAAQ1B,EAAM2B,2BArBhBzB,EAsBK0B,EAtBLC,EAAA3B,EAAA4B,GAyBA,IAAMC,EAAWC,IAEjB,IAAOC,EAAOC,GAAWC,EAASb,GAElC,IAAMc,EAAiEC,GACpEC,IACC,IAAMC,OAAEA,GAAWD,EAEnB,GAAIC,aAAkBC,qBAAuBrB,EAAU,CACrD,IAAMsB,EAAOF,EAAOG,wBAEhBH,EAAOI,aAAeF,EAAKG,QAAUX,EAAQV,EAC/CW,EAAQD,EAAQ,GACNM,EAAOvB,OAA0B,KAAjBuB,EAAOvB,OACjCkB,EAAQZ,GAIY,mBAAbX,GACTA,EAAS2B,KAGb,CAAC3B,EAAUsB,EAAOV,EAASJ,IAG7B0B,GAAAA,KACE,GAAKd,GAAaA,EAASe,QAA3B,CAEA,IAAMC,EAAKhB,EAASe,QACpB,IAAML,EAAOM,EAAGL,wBAChB,GAAIK,EAAGJ,aAAeF,EAAKG,OAAQ,CACjC,IAAMI,EAAKC,SAASC,iBAAiBH,GAAII,WAAY,IACrD,IAAMC,EAAgBC,KAAKC,MAAMP,EAAGJ,aAAeK,GAC/CI,GAAiB7B,GAAW6B,EAAgB9B,GAC9CY,EAAQkB,OAGX,IAEH,IAAIG,EAAmC,UAAjBvD,EAAMM,OAG5B,MAFsB,iBAAXA,IAAqBiD,EAA6B,UAAXjD,GAGhDkD,EAACC,SACK7B,GADN,GAAA,CAEE8B,IAAK3B,EACLd,UAAWA,EACXC,MAAOA,EACPP,SAAUyB,EACVf,KAAMA,EACNd,SAAUA,EACVK,UAAWA,EACXF,KAAMA,EACNG,YAAaA,EACbC,SAAUA,EACVQ,KAAMW,EACNlB,SAAUA,EACVC,MAAOA,EACPQ,MAAOA,EACPJ,QAASA,EACTK,iBAAkBA,EAClBhB,MAAOA,EACPD,MAAOA,EACPkB,MAAOA,EACP6B,gBAAiBA,MAKvB1D,EAAS8D,YAnGc"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import o from'styled-components';import{
|
|
1
|
+
import o,{css as r}from'styled-components';import{injectDefaultTheme as n}from'../../shared/utils/inject-theme.js';import{property as e,responsiveNamedProperty as t}from'../../mixins/responsive-property.js';import{chooseWidthValue as i}from'../Input/helpers.js';import{baseInputStyle as a}from'../Input/style.js';var d=r(["",";"," "," "," ",""],(o=>{var{theme:r}=o;return"\n display: block;\n box-sizing: border-box;\n appearance: none;\n width: auto;\n resize: none;\n\n background: ".concat(r.colors['bg-onmain-secondary'],";\n border: 1px solid ").concat(r.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: ").concat(r.colors['content-onmain-primary'],";\n\n transition-property: background-color, border-color, color, caret-color;\n transition-duration: 200ms;\n transition-timing-function: ease-in;\n\n &::placeholder {\n color: ").concat(r.colors['content-onmain-secondary'],";\n }\n\n &:focus {\n border: 1px solid ").concat(r.colors['border-brand-primary'],";\n caret-color: ").concat(r.colors['border-brand-primary'],";\n outline: none;\n }\n\n &:disabled {\n background-color: ").concat(r.colors['bg-disabled-large'],";\n border-color: ").concat(r.colors['border-disabled'],";\n color: ").concat(r.colors['content-disabled'],";\n cursor: not-allowed;\n }\n ")}),(o=>o.width?e(i(o.width),o.fluid&&'auto'!==o.width?'max-width':'width'):null),(o=>t({sizes:{widthXS:o.widthXS,widthS:o.widthS,widthM:o.widthM,widthL:o.widthL,widthXL:o.widthXL},cssProperty:o.fluid&&'auto'!==o.width?'max-width':'width',customSizeHandler:i})),(o=>{var{fluid:r}=o;return r&&'width: 100%;'}),(o=>{var{error:r,theme:n}=o;return r&&"\n background-color: ".concat(n.colors['alert-bg-error-100'],";\n border: 1px solid ").concat(n.colors['alert-bg-error-500'],";\n ")}));var c=r(["resize:none;line-height:23px;padding:16px 20px 11px;",""],a);var s=o.textarea.withConfig({shouldForwardProp:o=>!['color','placeholderColor','rounded','fluid','error','brandPresetUsed','theme'].includes(o)&&!o.includes('width')}).attrs(n).withConfig({componentId:"fox-ui__sc-a4hfy5-0"})(["",""],(o=>{var{brandPresetUsed:r}=o;return r?d:c}));export{s 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 from 'styled-components'\nimport { baseInputStyle } from '../../components/Input/style'\nimport {
|
|
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 }) => `\n display: block;\n box-sizing: border-box;\n appearance: none;\n width: auto;\n resize: none;\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 transition-property: background-color, border-color, color, caret-color;\n transition-duration: 200ms;\n transition-timing-function: ease-in;\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, theme }) =>\n error &&\n `\n background-color: ${theme.colors['alert-bg-error-100']};\n border: 1px solid ${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', 'theme'].includes(prop) &&\n !prop.includes('width'),\n })\n .attrs(injectDefaultTheme)<TextareaRootProps>`\n ${({ brandPresetUsed }) => (brandPresetUsed ? brandTextareaStyle : baseTextareaStyle)}\n`\n"],"names":["brandTextareaStyle","css","_ref","theme","concat","colors","props","width","property","chooseWidthValue","fluid","responsiveNamedProperty","sizes","widthXS","widthS","widthM","widthL","widthXL","cssProperty","customSizeHandler","_ref2","_ref3","error","baseTextareaStyle","baseInputStyle","Root","styled","textarea","withConfig","shouldForwardProp","prop","includes","attrs","injectDefaultTheme","componentId","_ref4","brandPresetUsed"],"mappings":"yTAWA,IAAMA,EAAqBC,EACvB,CAAA,GAAA,IAAA,IAAA,IAAA,IAAA,KAAAC,IAAA,IAACC,MAAEA,GAAHD,EAAA,MAAA,qIAAAE,OAOcD,EAAME,OAAO,uBACPF,6BAAAA,OAAAA,EAAME,OAAO,+BARjC,qKAAAD,OAgBSD,EAAME,OAAO,0BAOXF,uMAAAA,OAAAA,EAAME,OAAO,4BAvBxB,uDAAAD,OA2BsBD,EAAME,OAAO,wBAClBF,0BAAAA,OAAAA,EAAME,OAAO,wBA5B9B,gFAAAD,OAiCsBD,EAAME,OAAO,qBACjBF,2BAAAA,OAAAA,EAAME,OAAO,mBAlC/B,oBAAAD,OAmCWD,EAAME,OAAO,oBAnCxB,+CAwCCC,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,EAAFnB,MAASA,GAAVkB,EAAA,OACAC,GAAK,6BAAAlB,OAEiBD,EAAME,OAAO,sBAF9B,+BAAAD,OAGiBD,EAAME,OAAO,sBAJnC,cAQJ,IAAMkB,EAAoBtB,EAAH,CAAA,uDAAA,IAInBuB,GAGG,IAAMC,EAAOC,EAAOC,SACxBC,WAAW,CACVC,kBAAoBC,IACjB,CAAC,QAAS,mBAAoB,UAAW,QAAS,QAAS,kBAAmB,SAASC,SAASD,KAChGA,EAAKC,SAAS,WAElBC,MAAMC,GANQL,WAAA,CAAAM,YAAA,uBAAGR,CAOhB,CAAA,GAAA,KAAAS,IAAA,IAACC,gBAAEA,GAAHD,EAAA,OAA0BC,EAAkBpC,EAAqBuB"}
|
package/dts/index.d.ts
CHANGED
|
@@ -5,9 +5,9 @@ import * as react from 'react';
|
|
|
5
5
|
import { PureComponent, Component, ForwardRefExoticComponent, PropsWithoutRef, RefAttributes } from 'react';
|
|
6
6
|
import { Link, NavLink } from 'react-router-dom';
|
|
7
7
|
import { ResponsiveProperty as ResponsiveProperty$1, ResponsiveNamedProperty as ResponsiveNamedProperty$1 } from 'mixins/responsive-property';
|
|
8
|
-
import { BaseProps as BaseProps$1, Nullable as Nullable$1, FontWeight as FontWeight$1 } from 'shared/interfaces';
|
|
9
|
-
import { Display as Display$1 } from 'mixins/display';
|
|
8
|
+
import { BaseProps as BaseProps$1, Nullable as Nullable$1, FontWeight as FontWeight$1, InputField as InputField$1 } from 'shared/interfaces';
|
|
10
9
|
import { Color as Color$1 } from 'mixins/color';
|
|
10
|
+
import { Display as Display$1 } from 'mixins/display';
|
|
11
11
|
import { Anchor as Anchor$1 } from 'components/Anchor';
|
|
12
12
|
import { Classes } from 'react-modal';
|
|
13
13
|
import * as rc_scrollbars_lib_Scrollbars_types from 'rc-scrollbars/lib/Scrollbars/types';
|
|
@@ -327,11 +327,7 @@ interface InputField extends Color, Color<'placeholderColor'>, ResponsiveNamedPr
|
|
|
327
327
|
*/
|
|
328
328
|
fluid?: boolean;
|
|
329
329
|
/**
|
|
330
|
-
*
|
|
331
|
-
*/
|
|
332
|
-
children?: React.ReactNode;
|
|
333
|
-
/**
|
|
334
|
-
* Rounded style
|
|
330
|
+
* @preset {Default} Rounded style
|
|
335
331
|
*/
|
|
336
332
|
rounded?: boolean;
|
|
337
333
|
/**
|
|
@@ -880,23 +876,13 @@ declare class Avatar extends PureComponent<AvatarProps> {
|
|
|
880
876
|
render(): JSX.Element;
|
|
881
877
|
}
|
|
882
878
|
|
|
883
|
-
declare
|
|
884
|
-
h1 = 0,
|
|
885
|
-
h2 = 1,
|
|
886
|
-
h3 = 2,
|
|
887
|
-
h4 = 3
|
|
888
|
-
}
|
|
879
|
+
declare type H = 'h1' | 'h2' | 'h3' | 'h4';
|
|
889
880
|
interface TextHeadingProps extends Omit<TextProps, 'content' | 'as'> {
|
|
890
|
-
|
|
891
|
-
|
|
892
|
-
|
|
893
|
-
*/
|
|
881
|
+
/** Default set of size, lineHeight and weight props */
|
|
882
|
+
h?: H;
|
|
883
|
+
/** Children react node */
|
|
894
884
|
children?: React.ReactNode;
|
|
895
885
|
}
|
|
896
|
-
declare function TextHeading({ h, ...props }: TextHeadingProps): JSX.Element;
|
|
897
|
-
declare namespace TextHeading {
|
|
898
|
-
var displayName: string;
|
|
899
|
-
}
|
|
900
886
|
|
|
901
887
|
interface TextEllipseProps extends Omit<TextProps, 'content'> {
|
|
902
888
|
/** Toggle text for folded state */
|
|
@@ -935,60 +921,38 @@ declare class TextEllipse extends Component<TextEllipseProps, TextEllipseState>
|
|
|
935
921
|
render(): JSX.Element;
|
|
936
922
|
}
|
|
937
923
|
|
|
938
|
-
interface TextProps extends BaseProps, Color, ResponsiveNamedProperty<'size'>, Display {
|
|
939
|
-
/**
|
|
940
|
-
* An element type to render as (string).
|
|
941
|
-
*/
|
|
924
|
+
interface TextProps extends BaseProps$1, Color$1, ResponsiveNamedProperty$1<'size'>, Display$1 {
|
|
925
|
+
/** An element type to render as (string) */
|
|
942
926
|
as?: 'div' | 'span' | 'h1' | 'h2' | 'h3' | 'h4' | 'p';
|
|
943
|
-
/**
|
|
944
|
-
* Primary content
|
|
945
|
-
*/
|
|
927
|
+
/** Primary content */
|
|
946
928
|
content?: string;
|
|
947
|
-
/**
|
|
948
|
-
* Primary content
|
|
949
|
-
*/
|
|
950
|
-
/**
|
|
951
|
-
* Children react node
|
|
952
|
-
*/
|
|
929
|
+
/** Children react node */
|
|
953
930
|
children?: React.ReactNode;
|
|
954
|
-
/**
|
|
955
|
-
* Text font weight
|
|
956
|
-
*/
|
|
931
|
+
/** Text font weight */
|
|
957
932
|
weight?: 'lighter' | 'normal' | 'bold' | 'bolder' | number;
|
|
958
|
-
/**
|
|
959
|
-
* Text font style
|
|
960
|
-
*/
|
|
933
|
+
/** Text font style */
|
|
961
934
|
fontStyle?: 'normal' | 'italic';
|
|
962
|
-
/**
|
|
963
|
-
|
|
964
|
-
|
|
935
|
+
/** Text font family */
|
|
936
|
+
fontFamily?: string;
|
|
937
|
+
/** Add underline to inline links */
|
|
965
938
|
underlineLinks?: boolean;
|
|
966
|
-
/**
|
|
967
|
-
* Text align
|
|
968
|
-
*/
|
|
939
|
+
/** Text align */
|
|
969
940
|
textAlign?: 'left' | 'center' | 'right' | 'justify' | 'start' | 'end';
|
|
970
|
-
/**
|
|
971
|
-
* Line height
|
|
972
|
-
*/
|
|
941
|
+
/** Line height */
|
|
973
942
|
lineHeight?: 'l' | 'm' | 's' | 'xs' | number;
|
|
974
|
-
/**
|
|
975
|
-
* Element title
|
|
976
|
-
*/
|
|
943
|
+
/** Element title */
|
|
977
944
|
title?: string;
|
|
978
945
|
}
|
|
979
|
-
|
|
980
|
-
|
|
981
|
-
|
|
982
|
-
|
|
983
|
-
|
|
984
|
-
|
|
985
|
-
|
|
986
|
-
|
|
987
|
-
|
|
988
|
-
|
|
989
|
-
var Ellipse: typeof TextEllipse;
|
|
990
|
-
var displayName: string;
|
|
991
|
-
}
|
|
946
|
+
|
|
947
|
+
declare const Text: {
|
|
948
|
+
(props: TextProps): JSX.Element;
|
|
949
|
+
Heading: {
|
|
950
|
+
(props: TextHeadingProps): JSX.Element;
|
|
951
|
+
displayName: string;
|
|
952
|
+
};
|
|
953
|
+
Ellipse: typeof TextEllipse;
|
|
954
|
+
displayName: string;
|
|
955
|
+
};
|
|
992
956
|
|
|
993
957
|
interface BadgeProps extends BaseProps, Color, Display {
|
|
994
958
|
/**
|
|
@@ -2142,56 +2106,27 @@ declare class ContextMenu extends PureComponent<ContextMenuProps, {
|
|
|
2142
2106
|
}
|
|
2143
2107
|
|
|
2144
2108
|
declare type TextAreaHTMLAttributes = Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'cols' | 'rows' | 'color'>;
|
|
2145
|
-
interface TextareaProps extends BaseProps, InputField, TextAreaHTMLAttributes {
|
|
2146
|
-
/**
|
|
2147
|
-
* Specifies the visible width of a text area
|
|
2148
|
-
*/
|
|
2109
|
+
interface TextareaProps extends BaseProps$1, InputField$1, TextAreaHTMLAttributes {
|
|
2110
|
+
/** Specifies the visible width of a text area */
|
|
2149
2111
|
cols?: number;
|
|
2150
|
-
/**
|
|
2151
|
-
* Specifies the visible number of lines in a text area
|
|
2152
|
-
*/
|
|
2112
|
+
/** Specifies the visible number of lines in a text area */
|
|
2153
2113
|
rows?: number;
|
|
2154
|
-
/**
|
|
2155
|
-
* Specifies the visible max number of lines in a text area
|
|
2156
|
-
*/
|
|
2114
|
+
/** Specifies the visible max number of lines in a text area */
|
|
2157
2115
|
maxRows?: number;
|
|
2158
|
-
/**
|
|
2159
|
-
* Specifies the maximum number of characters allowed in the text area
|
|
2160
|
-
*/
|
|
2116
|
+
/** Specifies the maximum number of characters allowed in the text area */
|
|
2161
2117
|
maxLength?: number;
|
|
2162
|
-
/**
|
|
2163
|
-
* On change handler
|
|
2164
|
-
*/
|
|
2118
|
+
/** On change handler */
|
|
2165
2119
|
onChange?(_event: React.ChangeEvent<HTMLTextAreaElement>): void;
|
|
2166
|
-
/**
|
|
2167
|
-
* Value
|
|
2168
|
-
*/
|
|
2120
|
+
/** Value */
|
|
2169
2121
|
value?: string;
|
|
2170
|
-
/**
|
|
2171
|
-
* Autosize for textarea
|
|
2172
|
-
*/
|
|
2122
|
+
/** Autosize for textarea */
|
|
2173
2123
|
autosize?: boolean;
|
|
2174
2124
|
}
|
|
2175
|
-
|
|
2176
|
-
|
|
2177
|
-
|
|
2178
|
-
|
|
2179
|
-
|
|
2180
|
-
*/
|
|
2181
|
-
declare function Textarea({ cols, disabled, error, fluid, name, onChange, maxLength, placeholder, required, rounded, rows, tabIndex, value, className, style, children, autosize, maxRows, color, placeholderColor, ...props }: typeof Textarea.defaultProps & TextareaProps): JSX.Element;
|
|
2182
|
-
declare namespace Textarea {
|
|
2183
|
-
var defaultProps: {
|
|
2184
|
-
onChange: (e: react.ChangeEvent<HTMLTextAreaElement>) => void;
|
|
2185
|
-
rounded: boolean;
|
|
2186
|
-
color: string;
|
|
2187
|
-
placeholderColor: string;
|
|
2188
|
-
cols: number;
|
|
2189
|
-
maxRows: number;
|
|
2190
|
-
rows: number;
|
|
2191
|
-
autosize: boolean;
|
|
2192
|
-
};
|
|
2193
|
-
var displayName: string;
|
|
2194
|
-
}
|
|
2125
|
+
|
|
2126
|
+
declare const Textarea: {
|
|
2127
|
+
(props: TextareaProps): JSX.Element;
|
|
2128
|
+
displayName: string;
|
|
2129
|
+
};
|
|
2195
2130
|
|
|
2196
2131
|
interface InputPhoneProps extends InputProps {
|
|
2197
2132
|
/**
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import e from'@babel/runtime/helpers/objectSpread2';import{useMemo as r}from'react';function t(t,n){return r((()=>{var r=null!=t?t:{};var u=null!=n?n:{};return[...new Set([...Object.keys(r),...Object.keys(u)])].reduce(((t,n)=>{var a;return o(r[n])&&(a=r[n]),o(u[n])&&(a=u[n]),o(a)?e(e({},t),{},{[n]:a}):t}),{})}),[t,n])}function o(e){return Boolean(e)||'boolean'==typeof e||'number'==typeof e}export{t as useConfigPriority};
|
|
1
|
+
import e from'@babel/runtime/helpers/objectSpread2';import{useMemo as r}from'react';function t(t,n){return r((()=>{var r=null!=t?t:{};var u=null!=n?n:{};return[...new Set([...Object.keys(r),...Object.keys(u)])].reduce(((t,n)=>{var a;return o(r[n])&&(a=r[n]),o(u[n])&&(a=u[n]),o(a)?e(e({},t),{},{[n]:a}):t}),{})}),[t,n])}function o(e){return Boolean(e)||'boolean'==typeof e||'number'==typeof e||'string'==typeof e}export{t as useConfigPriority};
|
|
2
2
|
//# sourceMappingURL=use-config-priority.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-config-priority.js","sources":["../../../src/hooks/use-config-priority.ts"],"sourcesContent":["import { useMemo } from 'react'\n\nexport function useConfigPriority<T extends object>(minor?: Partial<T>, major?: Partial<T>): Partial<T> {\n return useMemo(() => {\n const minorConfig = minor ?? {}\n const majorConfig = major ?? {}\n const uniqueKeys = [...new Set([...Object.keys(minorConfig), ...Object.keys(majorConfig)])]\n\n return uniqueKeys.reduce((prioritized, key) => {\n let finalVal\n\n if (valid(minorConfig[key])) finalVal = minorConfig[key]\n if (valid(majorConfig[key])) finalVal = majorConfig[key]\n\n return valid(finalVal) ? { ...prioritized, [key]: finalVal } : prioritized\n }, {} as Partial<T>)\n }, [minor, major])\n}\n\nfunction valid(value: unknown): boolean {\n return Boolean(value) || typeof value === 'boolean' || typeof value === 'number'\n}\n"],"names":["useConfigPriority","minor","major","useMemo","minorConfig","majorConfig","Set","Object","keys","reduce","prioritized","key","finalVal","valid","value","Boolean"],"mappings":"oFAEO,SAASA,EAAoCC,EAAoBC,GACtE,OAAOC,GAAQ,KACb,IAAMC,EAAcH,MAAAA,EAAAA,EAAS,GAC7B,IAAMI,EAAcH,MAAAA,EAAAA,EAAS,GAG7B,MAFmB,IAAI,IAAII,IAAI,IAAIC,OAAOC,KAAKJ,MAAiBG,OAAOC,KAAKH,MAE1DI,
|
|
1
|
+
{"version":3,"file":"use-config-priority.js","sources":["../../../src/hooks/use-config-priority.ts"],"sourcesContent":["import { useMemo } from 'react'\n\nexport function useConfigPriority<T extends object>(minor?: Partial<T>, major?: Partial<T>): Partial<T> {\n return useMemo(() => {\n const minorConfig = minor ?? {}\n const majorConfig = major ?? {}\n const uniqueKeys = [...new Set([...Object.keys(minorConfig), ...Object.keys(majorConfig)])]\n\n return uniqueKeys.reduce((prioritized, key) => {\n let finalVal\n\n if (valid(minorConfig[key])) finalVal = minorConfig[key]\n if (valid(majorConfig[key])) finalVal = majorConfig[key]\n\n return valid(finalVal) ? { ...prioritized, [key]: finalVal } : prioritized\n }, {} as Partial<T>)\n }, [minor, major])\n}\n\nfunction valid(value: unknown): boolean {\n return Boolean(value) || typeof value === 'boolean' || typeof value === 'number' || typeof value === 'string'\n}\n"],"names":["useConfigPriority","minor","major","useMemo","minorConfig","majorConfig","Set","Object","keys","reduce","prioritized","key","finalVal","valid","value","Boolean"],"mappings":"oFAEO,SAASA,EAAoCC,EAAoBC,GACtE,OAAOC,GAAQ,KACb,IAAMC,EAAcH,MAAAA,EAAAA,EAAS,GAC7B,IAAMI,EAAcH,MAAAA,EAAAA,EAAS,GAG7B,MAFmB,IAAI,IAAII,IAAI,IAAIC,OAAOC,KAAKJ,MAAiBG,OAAOC,KAAKH,MAE1DI,SAAQC,EAAaC,KACrC,IAAIC,EAKJ,OAHIC,EAAMT,EAAYO,MAAOC,EAAWR,EAAYO,IAChDE,EAAMR,EAAYM,MAAOC,EAAWP,EAAYM,IAE7CE,EAAMD,UAAiBF,GAAvB,GAAA,CAAoCC,CAACA,GAAMC,IAAaF,IAC9D,MACF,CAACT,EAAOC,IAGb,SAASW,EAAMC,GACb,OAAOC,QAAQD,IAA2B,kBAAVA,GAAwC,iBAAVA,GAAuC,iBAAVA"}
|