@fountain-ui/core 1.19.0 → 2.0.0-beta.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (153) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/build/commonjs/Accordion/Accordion.js +1 -7
  3. package/build/commonjs/Accordion/Accordion.js.map +1 -1
  4. package/build/commonjs/Button/Button.js +14 -8
  5. package/build/commonjs/Button/Button.js.map +1 -1
  6. package/build/commonjs/Checkbox/Checkbox.js +7 -2
  7. package/build/commonjs/Checkbox/Checkbox.js.map +1 -1
  8. package/build/commonjs/Chip/Chip.js +10 -9
  9. package/build/commonjs/Chip/Chip.js.map +1 -1
  10. package/build/commonjs/Fab/Fab.js +10 -3
  11. package/build/commonjs/Fab/Fab.js.map +1 -1
  12. package/build/commonjs/IconButton/IconButton.js +13 -3
  13. package/build/commonjs/IconButton/IconButton.js.map +1 -1
  14. package/build/commonjs/Image/Image.js +13 -1
  15. package/build/commonjs/Image/Image.js.map +1 -1
  16. package/build/commonjs/Radio/Radio.js +12 -11
  17. package/build/commonjs/Radio/Radio.js.map +1 -1
  18. package/build/commonjs/SvgIcon/SvgIcon.js +6 -2
  19. package/build/commonjs/SvgIcon/SvgIcon.js.map +1 -1
  20. package/build/commonjs/Switch/Switch.js +1 -1
  21. package/build/commonjs/Switch/Switch.js.map +1 -1
  22. package/build/commonjs/TextField/InputLabel.js +5 -2
  23. package/build/commonjs/TextField/InputLabel.js.map +1 -1
  24. package/build/commonjs/TextField/OutlinedTextField.js +2 -1
  25. package/build/commonjs/TextField/OutlinedTextField.js.map +1 -1
  26. package/build/commonjs/hooks/useFadeInAppBar.js +5 -2
  27. package/build/commonjs/hooks/useFadeInAppBar.js.map +1 -1
  28. package/build/commonjs/internal/icons/Checkbox.js +1 -2
  29. package/build/commonjs/internal/icons/Checkbox.js.map +1 -1
  30. package/build/commonjs/internal/icons/CheckboxChecked.js +3 -2
  31. package/build/commonjs/internal/icons/CheckboxChecked.js.map +1 -1
  32. package/build/commonjs/internal/icons/ChevronDown.js +0 -2
  33. package/build/commonjs/internal/icons/ChevronDown.js.map +1 -1
  34. package/build/commonjs/internal/icons/ChevronLeft.js +0 -2
  35. package/build/commonjs/internal/icons/ChevronLeft.js.map +1 -1
  36. package/build/commonjs/internal/icons/ChevronRight.js +0 -2
  37. package/build/commonjs/internal/icons/ChevronRight.js.map +1 -1
  38. package/build/commonjs/internal/icons/Close.js +0 -2
  39. package/build/commonjs/internal/icons/Close.js.map +1 -1
  40. package/build/commonjs/internal/icons/Radio.js.map +1 -1
  41. package/build/commonjs/internal/icons/RadioChecked.js.map +1 -1
  42. package/build/commonjs/styles/index.js +0 -8
  43. package/build/commonjs/styles/index.js.map +1 -1
  44. package/build/commonjs/utils/cloneElementSafely.js +15 -0
  45. package/build/commonjs/utils/cloneElementSafely.js.map +1 -0
  46. package/build/commonjs/utils/index.js +8 -0
  47. package/build/commonjs/utils/index.js.map +1 -1
  48. package/build/module/Accordion/Accordion.js +1 -7
  49. package/build/module/Accordion/Accordion.js.map +1 -1
  50. package/build/module/Button/Button.js +13 -9
  51. package/build/module/Button/Button.js.map +1 -1
  52. package/build/module/Checkbox/Checkbox.js +7 -2
  53. package/build/module/Checkbox/Checkbox.js.map +1 -1
  54. package/build/module/Chip/Chip.js +10 -10
  55. package/build/module/Chip/Chip.js.map +1 -1
  56. package/build/module/Fab/Fab.js +10 -4
  57. package/build/module/Fab/Fab.js.map +1 -1
  58. package/build/module/IconButton/IconButton.js +12 -4
  59. package/build/module/IconButton/IconButton.js.map +1 -1
  60. package/build/module/Image/Image.js +13 -1
  61. package/build/module/Image/Image.js.map +1 -1
  62. package/build/module/Radio/Radio.js +11 -11
  63. package/build/module/Radio/Radio.js.map +1 -1
  64. package/build/module/SvgIcon/SvgIcon.js +7 -3
  65. package/build/module/SvgIcon/SvgIcon.js.map +1 -1
  66. package/build/module/Switch/Switch.js +1 -1
  67. package/build/module/Switch/Switch.js.map +1 -1
  68. package/build/module/TextField/InputLabel.js +4 -2
  69. package/build/module/TextField/InputLabel.js.map +1 -1
  70. package/build/module/TextField/OutlinedTextField.js +2 -1
  71. package/build/module/TextField/OutlinedTextField.js.map +1 -1
  72. package/build/module/hooks/useFadeInAppBar.js +3 -2
  73. package/build/module/hooks/useFadeInAppBar.js.map +1 -1
  74. package/build/module/internal/icons/Checkbox.js +1 -2
  75. package/build/module/internal/icons/Checkbox.js.map +1 -1
  76. package/build/module/internal/icons/CheckboxChecked.js +3 -2
  77. package/build/module/internal/icons/CheckboxChecked.js.map +1 -1
  78. package/build/module/internal/icons/ChevronDown.js +0 -2
  79. package/build/module/internal/icons/ChevronDown.js.map +1 -1
  80. package/build/module/internal/icons/ChevronLeft.js +0 -2
  81. package/build/module/internal/icons/ChevronLeft.js.map +1 -1
  82. package/build/module/internal/icons/ChevronRight.js +0 -2
  83. package/build/module/internal/icons/ChevronRight.js.map +1 -1
  84. package/build/module/internal/icons/Close.js +0 -2
  85. package/build/module/internal/icons/Close.js.map +1 -1
  86. package/build/module/internal/icons/Radio.js.map +1 -1
  87. package/build/module/internal/icons/RadioChecked.js.map +1 -1
  88. package/build/module/styles/index.js +0 -1
  89. package/build/module/styles/index.js.map +1 -1
  90. package/build/module/utils/cloneElementSafely.js +6 -0
  91. package/build/module/utils/cloneElementSafely.js.map +1 -0
  92. package/build/module/utils/index.js +1 -0
  93. package/build/module/utils/index.js.map +1 -1
  94. package/build/typescript/Button/ButtonProps.d.ts +2 -2
  95. package/build/typescript/Checkbox/CheckboxProps.d.ts +7 -1
  96. package/build/typescript/Fab/FabProps.d.ts +2 -2
  97. package/build/typescript/IconButton/IconButtonProps.d.ts +2 -2
  98. package/build/typescript/Image/ImageProps.d.ts +8 -0
  99. package/build/typescript/Slider/Slider.d.ts +1 -1
  100. package/build/typescript/SvgIcon/SvgIconProps.d.ts +7 -6
  101. package/build/typescript/Switch/SwitchProps.d.ts +2 -2
  102. package/build/typescript/hooks/useFadeInAppBar.d.ts +0 -1
  103. package/build/typescript/internal/icons/Checkbox.d.ts +19 -18
  104. package/build/typescript/internal/icons/CheckboxChecked.d.ts +19 -18
  105. package/build/typescript/internal/icons/ChevronDown.d.ts +19 -18
  106. package/build/typescript/internal/icons/ChevronLeft.d.ts +19 -18
  107. package/build/typescript/internal/icons/ChevronRight.d.ts +19 -18
  108. package/build/typescript/internal/icons/Close.d.ts +19 -18
  109. package/build/typescript/internal/icons/Radio.d.ts +19 -18
  110. package/build/typescript/internal/icons/RadioChecked.d.ts +19 -18
  111. package/build/typescript/styles/index.d.ts +0 -1
  112. package/build/typescript/types/index.d.ts +1 -0
  113. package/build/typescript/utils/cloneElementSafely.d.ts +4 -0
  114. package/build/typescript/utils/index.d.ts +1 -0
  115. package/package.json +4 -4
  116. package/src/Accordion/Accordion.tsx +1 -4
  117. package/src/Button/Button.tsx +18 -3
  118. package/src/Button/ButtonProps.ts +2 -7
  119. package/src/Checkbox/Checkbox.tsx +3 -2
  120. package/src/Checkbox/CheckboxProps.ts +9 -1
  121. package/src/Chip/Chip.tsx +11 -4
  122. package/src/Fab/Fab.tsx +14 -4
  123. package/src/Fab/FabProps.ts +2 -8
  124. package/src/IconButton/IconButton.tsx +16 -4
  125. package/src/IconButton/IconButtonProps.ts +2 -7
  126. package/src/Image/Image.tsx +12 -1
  127. package/src/Image/ImageProps.ts +10 -0
  128. package/src/Radio/Radio.tsx +7 -15
  129. package/src/SvgIcon/SvgIcon.tsx +11 -5
  130. package/src/SvgIcon/SvgIconProps.ts +8 -6
  131. package/src/Switch/Switch.tsx +1 -1
  132. package/src/Switch/SwitchProps.ts +2 -8
  133. package/src/TextField/InputLabel.tsx +6 -3
  134. package/src/TextField/OutlinedTextField.tsx +2 -1
  135. package/src/hooks/useFadeInAppBar.ts +4 -3
  136. package/src/internal/icons/Checkbox.tsx +3 -3
  137. package/src/internal/icons/CheckboxChecked.tsx +5 -3
  138. package/src/internal/icons/ChevronDown.tsx +3 -4
  139. package/src/internal/icons/ChevronLeft.tsx +3 -4
  140. package/src/internal/icons/ChevronRight.tsx +3 -4
  141. package/src/internal/icons/Close.tsx +3 -4
  142. package/src/internal/icons/Radio.tsx +4 -2
  143. package/src/internal/icons/RadioChecked.tsx +4 -2
  144. package/src/styles/index.ts +0 -1
  145. package/src/types/index.ts +7 -0
  146. package/src/utils/cloneElementSafely.ts +9 -0
  147. package/src/utils/index.ts +1 -0
  148. package/build/commonjs/styles/cloneSvgIcon.js +0 -37
  149. package/build/commonjs/styles/cloneSvgIcon.js.map +0 -1
  150. package/build/module/styles/cloneSvgIcon.js +0 -25
  151. package/build/module/styles/cloneSvgIcon.js.map +0 -1
  152. package/build/typescript/styles/cloneSvgIcon.d.ts +0 -12
  153. package/src/styles/cloneSvgIcon.ts +0 -39
@@ -1 +1 @@
1
- {"version":3,"sources":["Button.tsx"],"names":["React","Linking","Text","ButtonBase","cloneSvgIcon","createFontStyle","css","StyleSheet","useTheme","styles","create","root","flexDirection","justifyContent","alignItems","fullWidth","width","medium","minWidth","height","small","Button","props","children","clipHorizontalSpacing","color","disabled","endIcon","endIconProp","href","onPress","size","startIcon","startIconProp","style","styleProp","variant","otherProps","theme","mainColor","palette","main","fontColor","contrastTextColor","variantStyleMap","contained","backgroundColor","outlined","borderColor","borderStyle","borderWidth","text","paddingSize","spacing","paddingLeft","paddingRight","borderRadius","shape","roundness","buttonBaseStyle","undefined","fontStyle","selector","typo","button2","button1","textMarginSize","textMarginStyle","marginLeft","marginRight","textStyle","textAlign","handlePress","canOpenURL","openURL"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Linking, Text } from 'react-native';\nimport ButtonBase from '../ButtonBase';\nimport { cloneSvgIcon, createFontStyle, css, StyleSheet, useTheme } from '../styles';\nimport type ButtonProps from './ButtonProps';\n\nconst styles = StyleSheet.create({\n root: {\n flexDirection: 'row',\n justifyContent: 'center',\n alignItems: 'center',\n },\n fullWidth: {\n width: '100%',\n },\n medium: {\n minWidth: 104,\n height: 48,\n },\n small: {\n minWidth: 56,\n height: 32,\n },\n});\n\nexport default function Button(props: ButtonProps) {\n const {\n children,\n clipHorizontalSpacing = false,\n color = 'primary',\n disabled = false,\n endIcon: endIconProp,\n fullWidth = false,\n href,\n onPress,\n size = 'medium',\n startIcon: startIconProp,\n style: styleProp,\n variant = 'contained',\n ...otherProps\n } = props;\n\n const theme = useTheme();\n\n const mainColor = theme.palette[color].main;\n\n const fontColor = variant === 'contained'\n ? theme.palette[color].contrastTextColor\n : theme.palette[color].main;\n\n const variantStyleMap = {\n contained: {\n backgroundColor: mainColor,\n },\n outlined: {\n backgroundColor: 'transparent',\n borderColor: mainColor,\n borderStyle: 'solid',\n borderWidth: 1,\n },\n text: {\n backgroundColor: 'transparent',\n },\n };\n\n const startIcon = cloneSvgIcon(startIconProp, { size, color: fontColor });\n const endIcon = cloneSvgIcon(endIconProp, { size, color: fontColor });\n\n const paddingSize = size === 'small' ? theme.spacing(2) : theme.spacing(4);\n const paddingLeft = startIcon ? paddingSize - theme.spacing(1) : paddingSize;\n const paddingRight = endIcon ? paddingSize - theme.spacing(1) : paddingSize;\n\n const borderRadius = theme.shape.roundness;\n const buttonBaseStyle = css([\n styles.root,\n variantStyleMap[variant],\n size === 'medium' ? styles.medium : styles.small,\n fullWidth ? styles.fullWidth : undefined,\n { borderRadius, color: fontColor },\n (variant === 'text' && clipHorizontalSpacing)\n ? { minWidth: 0 }\n : { paddingLeft, paddingRight },\n styleProp,\n ]);\n\n const fontStyle = createFontStyle(theme, {\n selector: (typo) => size === 'small' ? typo.button2 : typo.button1,\n color: fontColor,\n });\n\n const textMarginSize = size === 'small' ? theme.spacing(1) : theme.spacing(2);\n const textMarginStyle = startIcon\n ? { marginLeft: textMarginSize }\n : endIcon\n ? { marginRight: textMarginSize }\n : undefined;\n\n const textStyle = css([\n fontStyle,\n textMarginStyle,\n { textAlign: 'center' },\n ]);\n\n const handlePress = async () => {\n if (disabled) {\n return;\n }\n if (onPress) {\n onPress();\n return;\n }\n if (href) {\n if (await Linking.canOpenURL(href)) {\n await Linking.openURL(href);\n }\n }\n };\n\n return (\n <ButtonBase\n disabled={disabled}\n onPress={handlePress}\n style={buttonBaseStyle}\n {...otherProps}\n >\n {startIcon}\n\n <Text\n children={children}\n style={textStyle}\n />\n\n {endIcon}\n </ButtonBase>\n );\n};\n"]}
1
+ {"version":3,"sources":["Button.tsx"],"names":["React","Linking","Text","ButtonBase","createFontStyle","css","StyleSheet","useTheme","cloneElementSafely","iconSizes","small","medium","styles","create","root","flexDirection","justifyContent","alignItems","fullWidth","width","minWidth","height","Button","props","children","clipHorizontalSpacing","color","disabled","endIcon","endIconProp","href","onPress","size","startIcon","startIconProp","style","styleProp","variant","otherProps","theme","mainColor","palette","main","fontColor","contrastTextColor","variantStyleMap","contained","backgroundColor","outlined","borderColor","borderStyle","borderWidth","text","iconProps","colorValue","paddingSize","spacing","paddingLeft","paddingRight","borderRadius","shape","roundness","buttonBaseStyle","undefined","fontStyle","selector","typo","button2","button1","textMarginSize","textMarginStyle","marginLeft","marginRight","textStyle","textAlign","handlePress","canOpenURL","openURL"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Linking, Text } from 'react-native';\nimport ButtonBase from '../ButtonBase';\nimport { createFontStyle, css, StyleSheet, useTheme } from '../styles';\nimport { cloneElementSafely } from '../utils';\nimport type ButtonProps from './ButtonProps';\nimport type { ButtonSize } from './ButtonProps';\n\ntype IconSizes = { [n in ButtonSize]: number };\n\nconst iconSizes: IconSizes = {\n small: 20,\n medium: 24,\n};\n\nconst styles = StyleSheet.create({\n root: {\n flexDirection: 'row',\n justifyContent: 'center',\n alignItems: 'center',\n },\n fullWidth: {\n width: '100%',\n },\n medium: {\n minWidth: 104,\n height: 48,\n },\n small: {\n minWidth: 56,\n height: 32,\n },\n});\n\nexport default function Button(props: ButtonProps) {\n const {\n children,\n clipHorizontalSpacing = false,\n color = 'primary',\n disabled = false,\n endIcon: endIconProp,\n fullWidth = false,\n href,\n onPress,\n size = 'medium',\n startIcon: startIconProp,\n style: styleProp,\n variant = 'contained',\n ...otherProps\n } = props;\n\n const theme = useTheme();\n\n const mainColor = theme.palette[color].main;\n\n const fontColor = variant === 'contained'\n ? theme.palette[color].contrastTextColor\n : theme.palette[color].main;\n\n const variantStyleMap = {\n contained: {\n backgroundColor: mainColor,\n },\n outlined: {\n backgroundColor: 'transparent',\n borderColor: mainColor,\n borderStyle: 'solid',\n borderWidth: 1,\n },\n text: {\n backgroundColor: 'transparent',\n },\n };\n\n const iconProps = {\n width: iconSizes[size],\n height: iconSizes[size],\n colorValue: fontColor,\n };\n\n const startIcon = cloneElementSafely(startIconProp, iconProps);\n const endIcon = cloneElementSafely(endIconProp, iconProps);\n\n const paddingSize = size === 'small' ? theme.spacing(2) : theme.spacing(4);\n const paddingLeft = startIcon ? paddingSize - theme.spacing(1) : paddingSize;\n const paddingRight = endIcon ? paddingSize - theme.spacing(1) : paddingSize;\n\n const borderRadius = theme.shape.roundness;\n const buttonBaseStyle = css([\n styles.root,\n variantStyleMap[variant],\n size === 'medium' ? styles.medium : styles.small,\n fullWidth ? styles.fullWidth : undefined,\n { borderRadius, color: fontColor },\n (variant === 'text' && clipHorizontalSpacing)\n ? { minWidth: 0 }\n : { paddingLeft, paddingRight },\n styleProp,\n ]);\n\n const fontStyle = createFontStyle(theme, {\n selector: (typo) => size === 'small' ? typo.button2 : typo.button1,\n color: fontColor,\n });\n\n const textMarginSize = size === 'small' ? theme.spacing(1) : theme.spacing(2);\n const textMarginStyle = startIcon\n ? { marginLeft: textMarginSize }\n : endIcon\n ? { marginRight: textMarginSize }\n : undefined;\n\n const textStyle = css([\n fontStyle,\n textMarginStyle,\n { textAlign: 'center' },\n ]);\n\n const handlePress = async () => {\n if (disabled) {\n return;\n }\n if (onPress) {\n onPress();\n return;\n }\n if (href) {\n if (await Linking.canOpenURL(href)) {\n await Linking.openURL(href);\n }\n }\n };\n\n return (\n <ButtonBase\n disabled={disabled}\n onPress={handlePress}\n style={buttonBaseStyle}\n {...otherProps}\n >\n {startIcon}\n\n <Text\n children={children}\n style={textStyle}\n />\n\n {endIcon}\n </ButtonBase>\n );\n};\n"]}
@@ -20,6 +20,7 @@ export default function Checkbox(props) {
20
20
  const {
21
21
  checked = false,
22
22
  checkedIcon: checkedIconProp,
23
+ color = 'primary',
23
24
  disabled = false,
24
25
  icon: iconProp,
25
26
  onChange,
@@ -27,8 +28,12 @@ export default function Checkbox(props) {
27
28
  ...otherProps
28
29
  } = props;
29
30
  const styles = useStyles();
30
- const uncheckedIcon = iconProp ? iconProp : /*#__PURE__*/React.createElement(CheckboxIcon, null);
31
- const checkedIcon = checkedIconProp ? checkedIconProp : /*#__PURE__*/React.createElement(CheckboxCheckedIcon, null);
31
+ const uncheckedIcon = iconProp ? iconProp : /*#__PURE__*/React.createElement(CheckboxIcon, {
32
+ color: color
33
+ });
34
+ const checkedIcon = checkedIconProp ? checkedIconProp : /*#__PURE__*/React.createElement(CheckboxCheckedIcon, {
35
+ color: color
36
+ });
32
37
 
33
38
  const handlePress = () => {
34
39
  if (onChange) {
@@ -1 +1 @@
1
- {"version":3,"sources":["Checkbox.tsx"],"names":["React","ButtonBase","Checkbox","CheckboxIcon","CheckboxChecked","CheckboxCheckedIcon","css","useStyles","root","width","height","justifyContent","alignItems","props","checked","checkedIcon","checkedIconProp","disabled","icon","iconProp","onChange","style","otherProps","styles","uncheckedIcon","handlePress","rootStyle"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAGA,OAAOC,UAAP,MAAuB,eAAvB;AACA,SAASC,QAAQ,IAAIC,YAArB,EAAmCC,eAAe,IAAIC,mBAAtD,QAAiF,mBAAjF;AACA,SAASC,GAAT,QAAoB,WAApB;;AAIA,MAAMC,SAAmC,GAAG,YAA2B;AACnE,SAAO;AACHC,IAAAA,IAAI,EAAE;AACFC,MAAAA,KAAK,EAAE,EADL;AAEFC,MAAAA,MAAM,EAAE,EAFN;AAGFC,MAAAA,cAAc,EAAE,QAHd;AAIFC,MAAAA,UAAU,EAAE;AAJV;AADH,GAAP;AAQH,CATD;;AAWA,eAAe,SAASV,QAAT,CAAkBW,KAAlB,EAAwC;AACnD,QAAM;AACFC,IAAAA,OAAO,GAAG,KADR;AAEFC,IAAAA,WAAW,EAAEC,eAFX;AAGFC,IAAAA,QAAQ,GAAG,KAHT;AAIFC,IAAAA,IAAI,EAAEC,QAJJ;AAKFC,IAAAA,QALE;AAMFC,IAAAA,KANE;AAOF,OAAGC;AAPD,MAQFT,KARJ;AAUA,QAAMU,MAAM,GAAGhB,SAAS,EAAxB;AAEA,QAAMiB,aAAa,GAAGL,QAAQ,GAAGA,QAAH,gBAAc,oBAAC,YAAD,OAA5C;AACA,QAAMJ,WAAW,GAAGC,eAAe,GAAGA,eAAH,gBAAqB,oBAAC,mBAAD,OAAxD;;AAEA,QAAMS,WAAW,GAAG,MAAM;AACtB,QAAIL,QAAJ,EAAc;AACVA,MAAAA,QAAQ,CAAC,CAACN,OAAF,CAAR;AACH;AACJ,GAJD;;AAMA,QAAMY,SAAS,GAAGpB,GAAG,CAAC,CAClBiB,MAAM,CAACf,IADW,EAElBa,KAFkB,CAAD,CAArB;AAKA,sBACI,oBAAC,UAAD;AACI,IAAA,QAAQ,EAAEJ,QADd;AAEI,IAAA,OAAO,EAAEQ,WAFb;AAGI,IAAA,KAAK,EAAEC;AAHX,KAIQJ,UAJR,GAMKR,OAAO,GACFC,WADE,GAEFS,aARV,CADJ;AAaH;AAAA","sourcesContent":["import React from 'react';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport type CheckboxProps from './CheckboxProps';\nimport ButtonBase from '../ButtonBase';\nimport { Checkbox as CheckboxIcon, CheckboxChecked as CheckboxCheckedIcon } from '../internal/icons';\nimport { css } from '../styles';\n\ntype CheckboxStyle = NamedStylesStringUnion<'root'>;\n\nconst useStyles: UseStyles<CheckboxStyle> = function (): CheckboxStyle {\n return {\n root: {\n width: 24,\n height: 24,\n justifyContent: 'center',\n alignItems: 'center',\n },\n };\n};\n\nexport default function Checkbox(props: CheckboxProps) {\n const {\n checked = false,\n checkedIcon: checkedIconProp,\n disabled = false,\n icon: iconProp,\n onChange,\n style,\n ...otherProps\n } = props;\n\n const styles = useStyles();\n\n const uncheckedIcon = iconProp ? iconProp : <CheckboxIcon/>;\n const checkedIcon = checkedIconProp ? checkedIconProp : <CheckboxCheckedIcon/>;\n\n const handlePress = () => {\n if (onChange) {\n onChange(!checked);\n }\n };\n\n const rootStyle = css([\n styles.root,\n style,\n ]);\n\n return (\n <ButtonBase\n disabled={disabled}\n onPress={handlePress}\n style={rootStyle}\n {...otherProps}\n >\n {checked\n ? checkedIcon\n : uncheckedIcon\n }\n </ButtonBase>\n );\n};\n"]}
1
+ {"version":3,"sources":["Checkbox.tsx"],"names":["React","ButtonBase","Checkbox","CheckboxIcon","CheckboxChecked","CheckboxCheckedIcon","css","useStyles","root","width","height","justifyContent","alignItems","props","checked","checkedIcon","checkedIconProp","color","disabled","icon","iconProp","onChange","style","otherProps","styles","uncheckedIcon","handlePress","rootStyle"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAGA,OAAOC,UAAP,MAAuB,eAAvB;AACA,SAASC,QAAQ,IAAIC,YAArB,EAAmCC,eAAe,IAAIC,mBAAtD,QAAiF,mBAAjF;AACA,SAASC,GAAT,QAAoB,WAApB;;AAIA,MAAMC,SAAmC,GAAG,YAA2B;AACnE,SAAO;AACHC,IAAAA,IAAI,EAAE;AACFC,MAAAA,KAAK,EAAE,EADL;AAEFC,MAAAA,MAAM,EAAE,EAFN;AAGFC,MAAAA,cAAc,EAAE,QAHd;AAIFC,MAAAA,UAAU,EAAE;AAJV;AADH,GAAP;AAQH,CATD;;AAWA,eAAe,SAASV,QAAT,CAAkBW,KAAlB,EAAwC;AACnD,QAAM;AACFC,IAAAA,OAAO,GAAG,KADR;AAEFC,IAAAA,WAAW,EAAEC,eAFX;AAGFC,IAAAA,KAAK,GAAG,SAHN;AAIFC,IAAAA,QAAQ,GAAG,KAJT;AAKFC,IAAAA,IAAI,EAAEC,QALJ;AAMFC,IAAAA,QANE;AAOFC,IAAAA,KAPE;AAQF,OAAGC;AARD,MASFV,KATJ;AAWA,QAAMW,MAAM,GAAGjB,SAAS,EAAxB;AAEA,QAAMkB,aAAa,GAAGL,QAAQ,GAAGA,QAAH,gBAAc,oBAAC,YAAD;AAAc,IAAA,KAAK,EAAEH;AAArB,IAA5C;AACA,QAAMF,WAAW,GAAGC,eAAe,GAAGA,eAAH,gBAAqB,oBAAC,mBAAD;AAAqB,IAAA,KAAK,EAAEC;AAA5B,IAAxD;;AAEA,QAAMS,WAAW,GAAG,MAAM;AACtB,QAAIL,QAAJ,EAAc;AACVA,MAAAA,QAAQ,CAAC,CAACP,OAAF,CAAR;AACH;AACJ,GAJD;;AAMA,QAAMa,SAAS,GAAGrB,GAAG,CAAC,CAClBkB,MAAM,CAAChB,IADW,EAElBc,KAFkB,CAAD,CAArB;AAKA,sBACI,oBAAC,UAAD;AACI,IAAA,QAAQ,EAAEJ,QADd;AAEI,IAAA,OAAO,EAAEQ,WAFb;AAGI,IAAA,KAAK,EAAEC;AAHX,KAIQJ,UAJR,GAMKT,OAAO,GACFC,WADE,GAEFU,aARV,CADJ;AAaH;AAAA","sourcesContent":["import React from 'react';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport type CheckboxProps from './CheckboxProps';\nimport ButtonBase from '../ButtonBase';\nimport { Checkbox as CheckboxIcon, CheckboxChecked as CheckboxCheckedIcon } from '../internal/icons';\nimport { css } from '../styles';\n\ntype CheckboxStyle = NamedStylesStringUnion<'root'>;\n\nconst useStyles: UseStyles<CheckboxStyle> = function (): CheckboxStyle {\n return {\n root: {\n width: 24,\n height: 24,\n justifyContent: 'center',\n alignItems: 'center',\n },\n };\n};\n\nexport default function Checkbox(props: CheckboxProps) {\n const {\n checked = false,\n checkedIcon: checkedIconProp,\n color = 'primary',\n disabled = false,\n icon: iconProp,\n onChange,\n style,\n ...otherProps\n } = props;\n\n const styles = useStyles();\n\n const uncheckedIcon = iconProp ? iconProp : <CheckboxIcon color={color}/>;\n const checkedIcon = checkedIconProp ? checkedIconProp : <CheckboxCheckedIcon color={color}/>;\n\n const handlePress = () => {\n if (onChange) {\n onChange(!checked);\n }\n };\n\n const rootStyle = css([\n styles.root,\n style,\n ]);\n\n return (\n <ButtonBase\n disabled={disabled}\n onPress={handlePress}\n style={rootStyle}\n {...otherProps}\n >\n {checked\n ? checkedIcon\n : uncheckedIcon\n }\n </ButtonBase>\n );\n};\n"]}
@@ -2,9 +2,10 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
2
2
 
3
3
  import React from 'react';
4
4
  import { Text } from 'react-native';
5
- import { cloneSvgIcon, createFontStyle, css, useTheme } from '../styles';
5
+ import { createFontStyle, css, useTheme } from '../styles';
6
+ import { cloneElementSafely } from '../utils';
6
7
  import ButtonBase from '../ButtonBase';
7
- const ICON_SIZE = 'tiny';
8
+ const ICON_SIZE = 16;
8
9
 
9
10
  const useStyles = function () {
10
11
  const theme = useTheme();
@@ -63,14 +64,13 @@ export default function Chip(props) {
63
64
  const textStyle = css([fontStyle, textMarginStyle, {
64
65
  textAlign: 'center'
65
66
  }]);
66
- const startIcon = cloneSvgIcon(startIconProp, {
67
- size: ICON_SIZE,
68
- color: fontColor
69
- });
70
- const endIcon = cloneSvgIcon(endIconProp, {
71
- size: ICON_SIZE,
72
- color: fontColor
73
- });
67
+ const iconProps = {
68
+ width: ICON_SIZE,
69
+ height: ICON_SIZE,
70
+ colorValue: fontColor
71
+ };
72
+ const startIcon = cloneElementSafely(startIconProp, iconProps);
73
+ const endIcon = cloneElementSafely(endIconProp, iconProps);
74
74
  return /*#__PURE__*/React.createElement(ButtonBase, _extends({
75
75
  onPress: onPress,
76
76
  style: chipStyle
@@ -1 +1 @@
1
- {"version":3,"sources":["Chip.tsx"],"names":["React","Text","cloneSvgIcon","createFontStyle","css","useTheme","ButtonBase","ICON_SIZE","useStyles","theme","root","alignItems","borderRadius","flexDirection","height","justifyContent","paddingLeft","spacing","paddingRight","Chip","props","children","endIcon","endIconProp","onPress","startIcon","startIconProp","style","styleProp","variant","otherProps","styles","fontColor","palette","tertiary","main","primary","variantStyleMap","outlined","backgroundColor","paper","default","borderColor","border","borderWidth","filled","grey","bold","chipStyle","fontStyle","selector","typo","subtitle2","color","textMarginSize","textMarginStyle","marginLeft","marginRight","undefined","textStyle","textAlign","size"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { cloneSvgIcon, createFontStyle, css, useTheme } from '../styles';\nimport ButtonBase from '../ButtonBase';\nimport type ChipProps from './ChipProps';\n\ntype ChipStyles = NamedStylesStringUnion<'root'>;\n\nconst ICON_SIZE = 'tiny';\n\nconst useStyles: UseStyles<ChipStyles> = function (): ChipStyles {\n const theme = useTheme();\n\n return {\n root: {\n alignItems: 'center',\n borderRadius: 20,\n flexDirection: 'row',\n height: 32,\n justifyContent: 'center',\n paddingLeft: theme.spacing(2),\n paddingRight: theme.spacing(2),\n },\n };\n};\n\nexport default function Chip(props: ChipProps) {\n const {\n children,\n endIcon: endIconProp,\n onPress,\n startIcon: startIconProp,\n style: styleProp,\n variant = 'outlined',\n ...otherProps\n } = props;\n\n const theme = useTheme();\n const styles = useStyles();\n\n const fontColor = variant === 'outlined'\n ? theme.palette.tertiary.main\n : theme.palette.primary.main;\n\n const variantStyleMap = {\n outlined: {\n backgroundColor: theme.palette.paper.default,\n borderColor: theme.palette.border,\n borderWidth: 2,\n },\n filled: {\n backgroundColor: theme.palette.paper.grey,\n },\n bold: {\n backgroundColor: theme.palette.paper.grey,\n borderColor: theme.palette.primary.main,\n borderWidth: 2,\n },\n };\n\n const chipStyle = css([\n styles.root,\n variantStyleMap[variant],\n styleProp,\n ]);\n\n const fontStyle = createFontStyle(theme, {\n selector: (typo) => typo.subtitle2,\n color: fontColor,\n });\n\n const textMarginSize = theme.spacing(1);\n const textMarginStyle = startIconProp\n ? { marginLeft: textMarginSize }\n : endIconProp\n ? { marginRight: textMarginSize }\n : undefined;\n\n const textStyle = css([\n fontStyle,\n textMarginStyle,\n { textAlign: 'center' },\n ]);\n\n const startIcon = cloneSvgIcon(startIconProp, { size: ICON_SIZE, color: fontColor });\n const endIcon = cloneSvgIcon(endIconProp, { size: ICON_SIZE, color: fontColor });\n\n return (\n <ButtonBase\n onPress={onPress}\n style={chipStyle}\n {...otherProps}\n >\n {startIcon}\n\n <Text\n children={children}\n style={textStyle}\n />\n\n {endIcon}\n </ButtonBase>\n );\n}\n"]}
1
+ {"version":3,"sources":["Chip.tsx"],"names":["React","Text","createFontStyle","css","useTheme","cloneElementSafely","ButtonBase","ICON_SIZE","useStyles","theme","root","alignItems","borderRadius","flexDirection","height","justifyContent","paddingLeft","spacing","paddingRight","Chip","props","children","endIcon","endIconProp","onPress","startIcon","startIconProp","style","styleProp","variant","otherProps","styles","fontColor","palette","tertiary","main","primary","variantStyleMap","outlined","backgroundColor","paper","default","borderColor","border","borderWidth","filled","grey","bold","chipStyle","fontStyle","selector","typo","subtitle2","color","textMarginSize","textMarginStyle","marginLeft","marginRight","undefined","textStyle","textAlign","iconProps","width","colorValue"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport { cloneElementSafely } from '../utils';\nimport ButtonBase from '../ButtonBase';\nimport type ChipProps from './ChipProps';\n\ntype ChipStyles = NamedStylesStringUnion<'root'>;\n\nconst ICON_SIZE = 16;\n\nconst useStyles: UseStyles<ChipStyles> = function (): ChipStyles {\n const theme = useTheme();\n\n return {\n root: {\n alignItems: 'center',\n borderRadius: 20,\n flexDirection: 'row',\n height: 32,\n justifyContent: 'center',\n paddingLeft: theme.spacing(2),\n paddingRight: theme.spacing(2),\n },\n };\n};\n\nexport default function Chip(props: ChipProps) {\n const {\n children,\n endIcon: endIconProp,\n onPress,\n startIcon: startIconProp,\n style: styleProp,\n variant = 'outlined',\n ...otherProps\n } = props;\n\n const theme = useTheme();\n const styles = useStyles();\n\n const fontColor = variant === 'outlined'\n ? theme.palette.tertiary.main\n : theme.palette.primary.main;\n\n const variantStyleMap = {\n outlined: {\n backgroundColor: theme.palette.paper.default,\n borderColor: theme.palette.border,\n borderWidth: 2,\n },\n filled: {\n backgroundColor: theme.palette.paper.grey,\n },\n bold: {\n backgroundColor: theme.palette.paper.grey,\n borderColor: theme.palette.primary.main,\n borderWidth: 2,\n },\n };\n\n const chipStyle = css([\n styles.root,\n variantStyleMap[variant],\n styleProp,\n ]);\n\n const fontStyle = createFontStyle(theme, {\n selector: (typo) => typo.subtitle2,\n color: fontColor,\n });\n\n const textMarginSize = theme.spacing(1);\n const textMarginStyle = startIconProp\n ? { marginLeft: textMarginSize }\n : endIconProp\n ? { marginRight: textMarginSize }\n : undefined;\n\n const textStyle = css([\n fontStyle,\n textMarginStyle,\n { textAlign: 'center' },\n ]);\n\n const iconProps = {\n width: ICON_SIZE,\n height: ICON_SIZE,\n colorValue: fontColor,\n };\n\n const startIcon = cloneElementSafely(startIconProp, iconProps);\n const endIcon = cloneElementSafely(endIconProp, iconProps);\n\n return (\n <ButtonBase\n onPress={onPress}\n style={chipStyle}\n {...otherProps}\n >\n {startIcon}\n\n <Text\n children={children}\n style={textStyle}\n />\n\n {endIcon}\n </ButtonBase>\n );\n}\n"]}
@@ -4,9 +4,14 @@ import React from 'react';
4
4
  import { Text } from 'react-native';
5
5
  import ButtonBase from '../ButtonBase';
6
6
  import { useElevationStyle } from '../hooks';
7
- import { cloneSvgIcon, createFontStyle, css, StyleSheet, useTheme } from '../styles';
7
+ import { createFontStyle, css, StyleSheet, useTheme } from '../styles';
8
+ import { cloneElementSafely } from '../utils';
8
9
  const SMALL = 32;
9
10
  const MEDIUM = 48;
11
+ const iconSizes = {
12
+ small: 20,
13
+ medium: 24
14
+ };
10
15
  const styles = StyleSheet.create({
11
16
  medium: {
12
17
  borderRadius: MEDIUM * 0.5,
@@ -45,9 +50,10 @@ export default function Fab(props) {
45
50
  const theme = useTheme();
46
51
  const backgroundColor = theme.palette[color].main;
47
52
  const fontColor = theme.palette[color].contrastTextColor;
48
- const icon = cloneSvgIcon(children, {
49
- size,
50
- color: fontColor
53
+ const icon = cloneElementSafely(children, {
54
+ width: iconSizes[size],
55
+ height: iconSizes[size],
56
+ colorValue: fontColor
51
57
  });
52
58
  const elevationStyle = useElevationStyle(elevation);
53
59
  const width = variant === 'circular' ? size === 'medium' ? MEDIUM : SMALL : undefined;
@@ -1 +1 @@
1
- {"version":3,"sources":["Fab.tsx"],"names":["React","Text","ButtonBase","useElevationStyle","cloneSvgIcon","createFontStyle","css","StyleSheet","useTheme","SMALL","MEDIUM","styles","create","medium","borderRadius","height","root","alignItems","justifyContent","row","flexDirection","reverse","small","Fab","props","children","color","disabled","elevation","label","numberOfLines","onPress","size","style","styleProp","variant","otherProps","theme","backgroundColor","palette","main","fontColor","contrastTextColor","icon","elevationStyle","width","undefined","paddingSize","spacing","iconPadding","paddingLeft","paddingRight","buttonBaseStyle","fontStyle","selector","typo","button2","button1","textMarginSize","textMarginStyle","marginRight","marginLeft","textStyle","handlePress"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport ButtonBase from '../ButtonBase';\nimport { useElevationStyle } from '../hooks';\nimport { cloneSvgIcon, createFontStyle, css, StyleSheet, useTheme } from '../styles';\nimport type FabProps from './FabProps';\n\nconst SMALL = 32;\nconst MEDIUM = 48;\n\nconst styles = StyleSheet.create({\n medium: {\n borderRadius: MEDIUM * 0.5,\n height: MEDIUM,\n },\n root: {\n alignItems: 'center',\n justifyContent: 'center',\n },\n row: {\n flexDirection: 'row',\n },\n reverse: {\n flexDirection: 'row-reverse',\n },\n small: {\n borderRadius: SMALL * 0.5,\n height: SMALL,\n },\n});\n\nexport default function Fab(props: FabProps) {\n const {\n children,\n color = 'primary',\n disabled = false,\n elevation = 2,\n label,\n numberOfLines = 1,\n onPress,\n reverse,\n size = 'medium',\n style: styleProp,\n variant = 'circular',\n ...otherProps\n } = props;\n\n const theme = useTheme();\n\n const backgroundColor = theme.palette[color].main;\n const fontColor = theme.palette[color].contrastTextColor;\n\n const icon = cloneSvgIcon(children, {\n size,\n color: fontColor,\n });\n\n const elevationStyle = useElevationStyle(elevation);\n const width = variant === 'circular' ? (size === 'medium' ? MEDIUM : SMALL) : undefined;\n const paddingSize = size === 'medium' ? theme.spacing(5) : theme.spacing(3);\n const iconPadding = icon ? paddingSize - theme.spacing(1) : paddingSize;\n\n const paddingLeft = variant === 'circular'\n ? undefined\n : icon\n ? (reverse ? paddingSize : iconPadding)\n : paddingSize;\n\n const paddingRight = variant === 'circular'\n ? undefined\n : icon\n ? (reverse ? iconPadding : paddingSize)\n : paddingSize;\n\n const buttonBaseStyle = css([\n styles.root,\n reverse ? styles.reverse : styles.row,\n size === 'medium' ? styles.medium : styles.small,\n { width, backgroundColor, paddingLeft, paddingRight },\n elevationStyle,\n styleProp,\n ]);\n\n const fontStyle = createFontStyle(theme, {\n selector: (typo) => size === 'small' ? typo.button2 : typo.button1,\n color: fontColor,\n });\n\n const textMarginSize = size === 'small' ? theme.spacing(1) : theme.spacing(2);\n const textMarginStyle = icon\n ? (reverse ? { marginRight: textMarginSize } : { marginLeft: textMarginSize })\n : undefined;\n\n const textStyle = css([\n fontStyle,\n textMarginStyle,\n ]);\n\n const handlePress = async () => {\n if (disabled) {\n return;\n }\n if (onPress) {\n onPress();\n return;\n }\n };\n\n return (\n <ButtonBase\n disabled={disabled}\n onPress={handlePress}\n style={buttonBaseStyle}\n {...otherProps}\n >\n {icon}\n\n {variant === 'extended' && label ? (\n <Text\n children={label}\n numberOfLines={numberOfLines}\n style={textStyle}\n />\n ) : null}\n </ButtonBase>\n );\n};\n"]}
1
+ {"version":3,"sources":["Fab.tsx"],"names":["React","Text","ButtonBase","useElevationStyle","createFontStyle","css","StyleSheet","useTheme","cloneElementSafely","SMALL","MEDIUM","iconSizes","small","medium","styles","create","borderRadius","height","root","alignItems","justifyContent","row","flexDirection","reverse","Fab","props","children","color","disabled","elevation","label","numberOfLines","onPress","size","style","styleProp","variant","otherProps","theme","backgroundColor","palette","main","fontColor","contrastTextColor","icon","width","colorValue","elevationStyle","undefined","paddingSize","spacing","iconPadding","paddingLeft","paddingRight","buttonBaseStyle","fontStyle","selector","typo","button2","button1","textMarginSize","textMarginStyle","marginRight","marginLeft","textStyle","handlePress"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,QAAqB,cAArB;AACA,OAAOC,UAAP,MAAuB,eAAvB;AACA,SAASC,iBAAT,QAAkC,UAAlC;AACA,SAASC,eAAT,EAA0BC,GAA1B,EAA+BC,UAA/B,EAA2CC,QAA3C,QAA2D,WAA3D;AACA,SAASC,kBAAT,QAAmC,UAAnC;AAIA,MAAMC,KAAK,GAAG,EAAd;AACA,MAAMC,MAAM,GAAG,EAAf;AAIA,MAAMC,SAAoB,GAAG;AACzBC,EAAAA,KAAK,EAAE,EADkB;AAEzBC,EAAAA,MAAM,EAAE;AAFiB,CAA7B;AAKA,MAAMC,MAAM,GAAGR,UAAU,CAACS,MAAX,CAAkB;AAC7BF,EAAAA,MAAM,EAAE;AACJG,IAAAA,YAAY,EAAEN,MAAM,GAAG,GADnB;AAEJO,IAAAA,MAAM,EAAEP;AAFJ,GADqB;AAK7BQ,EAAAA,IAAI,EAAE;AACFC,IAAAA,UAAU,EAAE,QADV;AAEFC,IAAAA,cAAc,EAAE;AAFd,GALuB;AAS7BC,EAAAA,GAAG,EAAE;AACDC,IAAAA,aAAa,EAAE;AADd,GATwB;AAY7BC,EAAAA,OAAO,EAAE;AACLD,IAAAA,aAAa,EAAE;AADV,GAZoB;AAe7BV,EAAAA,KAAK,EAAE;AACHI,IAAAA,YAAY,EAAEP,KAAK,GAAG,GADnB;AAEHQ,IAAAA,MAAM,EAAER;AAFL;AAfsB,CAAlB,CAAf;AAqBA,eAAe,SAASe,GAAT,CAAaC,KAAb,EAA8B;AACzC,QAAM;AACFC,IAAAA,QADE;AAEFC,IAAAA,KAAK,GAAG,SAFN;AAGFC,IAAAA,QAAQ,GAAG,KAHT;AAIFC,IAAAA,SAAS,GAAG,CAJV;AAKFC,IAAAA,KALE;AAMFC,IAAAA,aAAa,GAAG,CANd;AAOFC,IAAAA,OAPE;AAQFT,IAAAA,OARE;AASFU,IAAAA,IAAI,GAAG,QATL;AAUFC,IAAAA,KAAK,EAAEC,SAVL;AAWFC,IAAAA,OAAO,GAAG,UAXR;AAYF,OAAGC;AAZD,MAaFZ,KAbJ;AAeA,QAAMa,KAAK,GAAG/B,QAAQ,EAAtB;AAEA,QAAMgC,eAAe,GAAGD,KAAK,CAACE,OAAN,CAAcb,KAAd,EAAqBc,IAA7C;AACA,QAAMC,SAAS,GAAGJ,KAAK,CAACE,OAAN,CAAcb,KAAd,EAAqBgB,iBAAvC;AAEA,QAAMC,IAAI,GAAGpC,kBAAkB,CAACkB,QAAD,EAAW;AACtCmB,IAAAA,KAAK,EAAElC,SAAS,CAACsB,IAAD,CADsB;AAEtChB,IAAAA,MAAM,EAAEN,SAAS,CAACsB,IAAD,CAFqB;AAGtCa,IAAAA,UAAU,EAAEJ;AAH0B,GAAX,CAA/B;AAMA,QAAMK,cAAc,GAAG5C,iBAAiB,CAAC0B,SAAD,CAAxC;AACA,QAAMgB,KAAK,GAAGT,OAAO,KAAK,UAAZ,GAA0BH,IAAI,KAAK,QAAT,GAAoBvB,MAApB,GAA6BD,KAAvD,GAAgEuC,SAA9E;AACA,QAAMC,WAAW,GAAGhB,IAAI,KAAK,QAAT,GAAoBK,KAAK,CAACY,OAAN,CAAc,CAAd,CAApB,GAAuCZ,KAAK,CAACY,OAAN,CAAc,CAAd,CAA3D;AACA,QAAMC,WAAW,GAAGP,IAAI,GAAGK,WAAW,GAAGX,KAAK,CAACY,OAAN,CAAc,CAAd,CAAjB,GAAoCD,WAA5D;AAEA,QAAMG,WAAW,GAAGhB,OAAO,KAAK,UAAZ,GACdY,SADc,GAEdJ,IAAI,GACCrB,OAAO,GAAG0B,WAAH,GAAiBE,WADzB,GAEAF,WAJV;AAMA,QAAMI,YAAY,GAAGjB,OAAO,KAAK,UAAZ,GACfY,SADe,GAEfJ,IAAI,GACCrB,OAAO,GAAG4B,WAAH,GAAiBF,WADzB,GAEAA,WAJV;AAMA,QAAMK,eAAe,GAAGjD,GAAG,CAAC,CACxBS,MAAM,CAACI,IADiB,EAExBK,OAAO,GAAGT,MAAM,CAACS,OAAV,GAAoBT,MAAM,CAACO,GAFV,EAGxBY,IAAI,KAAK,QAAT,GAAoBnB,MAAM,CAACD,MAA3B,GAAoCC,MAAM,CAACF,KAHnB,EAIxB;AAAEiC,IAAAA,KAAF;AAASN,IAAAA,eAAT;AAA0Ba,IAAAA,WAA1B;AAAuCC,IAAAA;AAAvC,GAJwB,EAKxBN,cALwB,EAMxBZ,SANwB,CAAD,CAA3B;AASA,QAAMoB,SAAS,GAAGnD,eAAe,CAACkC,KAAD,EAAQ;AACrCkB,IAAAA,QAAQ,EAAGC,IAAD,IAAUxB,IAAI,KAAK,OAAT,GAAmBwB,IAAI,CAACC,OAAxB,GAAkCD,IAAI,CAACE,OADtB;AAErChC,IAAAA,KAAK,EAAEe;AAF8B,GAAR,CAAjC;AAKA,QAAMkB,cAAc,GAAG3B,IAAI,KAAK,OAAT,GAAmBK,KAAK,CAACY,OAAN,CAAc,CAAd,CAAnB,GAAsCZ,KAAK,CAACY,OAAN,CAAc,CAAd,CAA7D;AACA,QAAMW,eAAe,GAAGjB,IAAI,GACrBrB,OAAO,GAAG;AAAEuC,IAAAA,WAAW,EAAEF;AAAf,GAAH,GAAqC;AAAEG,IAAAA,UAAU,EAAEH;AAAd,GADvB,GAEtBZ,SAFN;AAIA,QAAMgB,SAAS,GAAG3D,GAAG,CAAC,CAClBkD,SADkB,EAElBM,eAFkB,CAAD,CAArB;;AAKA,QAAMI,WAAW,GAAG,YAAY;AAC5B,QAAIrC,QAAJ,EAAc;AACV;AACH;;AACD,QAAII,OAAJ,EAAa;AACTA,MAAAA,OAAO;AACP;AACH;AACJ,GARD;;AAUA,sBACI,oBAAC,UAAD;AACI,IAAA,QAAQ,EAAEJ,QADd;AAEI,IAAA,OAAO,EAAEqC,WAFb;AAGI,IAAA,KAAK,EAAEX;AAHX,KAIQjB,UAJR,GAMKO,IANL,EAQKR,OAAO,KAAK,UAAZ,IAA0BN,KAA1B,gBACG,oBAAC,IAAD;AACI,IAAA,QAAQ,EAAEA,KADd;AAEI,IAAA,aAAa,EAAEC,aAFnB;AAGI,IAAA,KAAK,EAAEiC;AAHX,IADH,GAMG,IAdR,CADJ;AAkBH;AAAA","sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport ButtonBase from '../ButtonBase';\nimport { useElevationStyle } from '../hooks';\nimport { createFontStyle, css, StyleSheet, useTheme } from '../styles';\nimport { cloneElementSafely } from '../utils';\nimport type FabProps from './FabProps';\nimport type { FabSize } from './FabProps';\n\nconst SMALL = 32;\nconst MEDIUM = 48;\n\ntype IconSizes = { [n in FabSize]: number };\n\nconst iconSizes: IconSizes = {\n small: 20,\n medium: 24,\n};\n\nconst styles = StyleSheet.create({\n medium: {\n borderRadius: MEDIUM * 0.5,\n height: MEDIUM,\n },\n root: {\n alignItems: 'center',\n justifyContent: 'center',\n },\n row: {\n flexDirection: 'row',\n },\n reverse: {\n flexDirection: 'row-reverse',\n },\n small: {\n borderRadius: SMALL * 0.5,\n height: SMALL,\n },\n});\n\nexport default function Fab(props: FabProps) {\n const {\n children,\n color = 'primary',\n disabled = false,\n elevation = 2,\n label,\n numberOfLines = 1,\n onPress,\n reverse,\n size = 'medium',\n style: styleProp,\n variant = 'circular',\n ...otherProps\n } = props;\n\n const theme = useTheme();\n\n const backgroundColor = theme.palette[color].main;\n const fontColor = theme.palette[color].contrastTextColor;\n\n const icon = cloneElementSafely(children, {\n width: iconSizes[size],\n height: iconSizes[size],\n colorValue: fontColor,\n });\n\n const elevationStyle = useElevationStyle(elevation);\n const width = variant === 'circular' ? (size === 'medium' ? MEDIUM : SMALL) : undefined;\n const paddingSize = size === 'medium' ? theme.spacing(5) : theme.spacing(3);\n const iconPadding = icon ? paddingSize - theme.spacing(1) : paddingSize;\n\n const paddingLeft = variant === 'circular'\n ? undefined\n : icon\n ? (reverse ? paddingSize : iconPadding)\n : paddingSize;\n\n const paddingRight = variant === 'circular'\n ? undefined\n : icon\n ? (reverse ? iconPadding : paddingSize)\n : paddingSize;\n\n const buttonBaseStyle = css([\n styles.root,\n reverse ? styles.reverse : styles.row,\n size === 'medium' ? styles.medium : styles.small,\n { width, backgroundColor, paddingLeft, paddingRight },\n elevationStyle,\n styleProp,\n ]);\n\n const fontStyle = createFontStyle(theme, {\n selector: (typo) => size === 'small' ? typo.button2 : typo.button1,\n color: fontColor,\n });\n\n const textMarginSize = size === 'small' ? theme.spacing(1) : theme.spacing(2);\n const textMarginStyle = icon\n ? (reverse ? { marginRight: textMarginSize } : { marginLeft: textMarginSize })\n : undefined;\n\n const textStyle = css([\n fontStyle,\n textMarginStyle,\n ]);\n\n const handlePress = async () => {\n if (disabled) {\n return;\n }\n if (onPress) {\n onPress();\n return;\n }\n };\n\n return (\n <ButtonBase\n disabled={disabled}\n onPress={handlePress}\n style={buttonBaseStyle}\n {...otherProps}\n >\n {icon}\n\n {variant === 'extended' && label ? (\n <Text\n children={label}\n numberOfLines={numberOfLines}\n style={textStyle}\n />\n ) : null}\n </ButtonBase>\n );\n};\n"]}
@@ -3,7 +3,14 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
3
3
  import React from 'react';
4
4
  import { Text } from 'react-native';
5
5
  import ButtonBase from '../ButtonBase';
6
- import { cloneSvgIcon, createFontStyle, css, useTheme } from '../styles';
6
+ import { createFontStyle, css, useTheme } from '../styles';
7
+ import { cloneElementSafely } from '../utils';
8
+ const iconSizes = {
9
+ tiny: 16,
10
+ small: 20,
11
+ medium: 24,
12
+ large: 28
13
+ };
7
14
 
8
15
  const useStyles = function () {
9
16
  const theme = useTheme();
@@ -30,9 +37,10 @@ export default function IconButton(props) {
30
37
  } = props;
31
38
  const theme = useTheme();
32
39
  const styles = useStyles();
33
- const icon = cloneSvgIcon(children, {
34
- color: theme.palette[color].main,
35
- size
40
+ const icon = cloneElementSafely(children, {
41
+ width: iconSizes[size],
42
+ height: iconSizes[size],
43
+ color: color
36
44
  });
37
45
  const fontStyle = createFontStyle(theme, {
38
46
  selector: typo => typo.caption1,
@@ -1 +1 @@
1
- {"version":3,"sources":["IconButton.tsx"],"names":["React","Text","ButtonBase","cloneSvgIcon","createFontStyle","css","useTheme","useStyles","theme","root","flexDirection","justifyContent","alignItems","padding","spacing","IconButton","props","children","color","disabled","label","onPress","size","style","otherProps","styles","icon","palette","main","fontStyle","selector","typo","caption1","labelStyle","rootStyle","handlePress"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,QAAqB,cAArB;AAEA,OAAOC,UAAP,MAAuB,eAAvB;AACA,SAASC,YAAT,EAAuBC,eAAvB,EAAwCC,GAAxC,EAA6CC,QAA7C,QAA6D,WAA7D;;AAKA,MAAMC,SAAsC,GAAG,YAA8B;AACzE,QAAMC,KAAK,GAAGF,QAAQ,EAAtB;AAEA,SAAO;AACHG,IAAAA,IAAI,EAAE;AACFC,MAAAA,aAAa,EAAE,QADb;AAEFC,MAAAA,cAAc,EAAE,QAFd;AAGFC,MAAAA,UAAU,EAAE,QAHV;AAIFC,MAAAA,OAAO,EAAEL,KAAK,CAACM,OAAN,CAAc,CAAd;AAJP;AADH,GAAP;AAQH,CAXD;;AAaA,eAAe,SAASC,UAAT,CAAoBC,KAApB,EAA4C;AACvD,QAAM;AACFC,IAAAA,QADE;AAEFC,IAAAA,KAAK,GAAG,SAFN;AAGFC,IAAAA,QAAQ,GAAG,KAHT;AAIFC,IAAAA,KAJE;AAKFC,IAAAA,OALE;AAMFC,IAAAA,IAAI,GAAG,QANL;AAOFC,IAAAA,KAPE;AAQF,OAAGC;AARD,MASFR,KATJ;AAWA,QAAMR,KAAK,GAAGF,QAAQ,EAAtB;AACA,QAAMmB,MAAM,GAAGlB,SAAS,EAAxB;AAEA,QAAMmB,IAAI,GAAGvB,YAAY,CAACc,QAAD,EAAW;AAChCC,IAAAA,KAAK,EAAEV,KAAK,CAACmB,OAAN,CAAcT,KAAd,EAAqBU,IADI;AAEhCN,IAAAA;AAFgC,GAAX,CAAzB;AAKA,QAAMO,SAAS,GAAGzB,eAAe,CAACI,KAAD,EAAQ;AACrCsB,IAAAA,QAAQ,EAAGC,IAAD,IAAUA,IAAI,CAACC,QADY;AAErCd,IAAAA,KAAK,EAAEV,KAAK,CAACmB,OAAN,CAAcT,KAAd,EAAqBU;AAFS,GAAR,CAAjC;AAKA,QAAMK,UAAU,GAAG5B,GAAG,CAAC,CACnBwB,SADmB,CAAD,CAAtB;AAIA,QAAMK,SAAS,GAAG7B,GAAG,CAAC,CAClBoB,MAAM,CAAChB,IADW,EAElBc,KAFkB,CAAD,CAArB;;AAKA,QAAMY,WAAW,GAAG,YAAY;AAC5B,QAAIhB,QAAJ,EAAc;AACV;AACH;;AACD,QAAIE,OAAJ,EAAa;AACTA,MAAAA,OAAO;AACP;AACH;AACJ,GARD;;AAUA,sBACI,oBAAC,UAAD;AACI,IAAA,QAAQ,EAAEF,QADd;AAEI,IAAA,OAAO,EAAEgB,WAFb;AAGI,IAAA,KAAK,EAAED;AAHX,KAIQV,UAJR,GAMKE,IANL,EAQKN,KAAK,gBACF,oBAAC,IAAD;AACI,IAAA,QAAQ,EAAEA,KADd;AAEI,IAAA,KAAK,EAAEa;AAFX,IADE,GAKF,IAbR,CADJ;AAiBH;AAAA","sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport ButtonBase from '../ButtonBase';\nimport { cloneSvgIcon, createFontStyle, css, useTheme } from '../styles';\nimport type IconButtonProps from './IconButtonProps';\n\ntype IconButtonStyles = NamedStylesStringUnion<'root'>;\n\nconst useStyles: UseStyles<IconButtonStyles> = function (): IconButtonStyles {\n const theme = useTheme();\n\n return {\n root: {\n flexDirection: 'column',\n justifyContent: 'center',\n alignItems: 'center',\n padding: theme.spacing(1),\n },\n };\n};\n\nexport default function IconButton(props: IconButtonProps) {\n const {\n children,\n color = 'primary',\n disabled = false,\n label,\n onPress,\n size = 'medium',\n style,\n ...otherProps\n } = props;\n\n const theme = useTheme();\n const styles = useStyles();\n\n const icon = cloneSvgIcon(children, {\n color: theme.palette[color].main,\n size,\n });\n\n const fontStyle = createFontStyle(theme, {\n selector: (typo) => typo.caption1,\n color: theme.palette[color].main,\n });\n\n const labelStyle = css([\n fontStyle,\n ]);\n\n const rootStyle = css([\n styles.root,\n style,\n ]);\n\n const handlePress = async () => {\n if (disabled) {\n return;\n }\n if (onPress) {\n onPress();\n return;\n }\n };\n\n return (\n <ButtonBase\n disabled={disabled}\n onPress={handlePress}\n style={rootStyle}\n {...otherProps}\n >\n {icon}\n\n {label ? (\n <Text\n children={label}\n style={labelStyle}\n />\n ) : null}\n </ButtonBase>\n );\n};\n"]}
1
+ {"version":3,"sources":["IconButton.tsx"],"names":["React","Text","ButtonBase","createFontStyle","css","useTheme","cloneElementSafely","iconSizes","tiny","small","medium","large","useStyles","theme","root","flexDirection","justifyContent","alignItems","padding","spacing","IconButton","props","children","color","disabled","label","onPress","size","style","otherProps","styles","icon","width","height","fontStyle","selector","typo","caption1","palette","main","labelStyle","rootStyle","handlePress"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,QAAqB,cAArB;AAEA,OAAOC,UAAP,MAAuB,eAAvB;AACA,SAASC,eAAT,EAA0BC,GAA1B,EAA+BC,QAA/B,QAA+C,WAA/C;AACA,SAASC,kBAAT,QAAmC,UAAnC;AAQA,MAAMC,SAAoB,GAAG;AACzBC,EAAAA,IAAI,EAAE,EADmB;AAEzBC,EAAAA,KAAK,EAAE,EAFkB;AAGzBC,EAAAA,MAAM,EAAE,EAHiB;AAIzBC,EAAAA,KAAK,EAAE;AAJkB,CAA7B;;AAOA,MAAMC,SAAsC,GAAG,YAA8B;AACzE,QAAMC,KAAK,GAAGR,QAAQ,EAAtB;AAEA,SAAO;AACHS,IAAAA,IAAI,EAAE;AACFC,MAAAA,aAAa,EAAE,QADb;AAEFC,MAAAA,cAAc,EAAE,QAFd;AAGFC,MAAAA,UAAU,EAAE,QAHV;AAIFC,MAAAA,OAAO,EAAEL,KAAK,CAACM,OAAN,CAAc,CAAd;AAJP;AADH,GAAP;AAQH,CAXD;;AAaA,eAAe,SAASC,UAAT,CAAoBC,KAApB,EAA4C;AACvD,QAAM;AACFC,IAAAA,QADE;AAEFC,IAAAA,KAAK,GAAG,SAFN;AAGFC,IAAAA,QAAQ,GAAG,KAHT;AAIFC,IAAAA,KAJE;AAKFC,IAAAA,OALE;AAMFC,IAAAA,IAAI,GAAG,QANL;AAOFC,IAAAA,KAPE;AAQF,OAAGC;AARD,MASFR,KATJ;AAWA,QAAMR,KAAK,GAAGR,QAAQ,EAAtB;AACA,QAAMyB,MAAM,GAAGlB,SAAS,EAAxB;AAEA,QAAMmB,IAAI,GAAGzB,kBAAkB,CAACgB,QAAD,EAAW;AACtCU,IAAAA,KAAK,EAAEzB,SAAS,CAACoB,IAAD,CADsB;AAEtCM,IAAAA,MAAM,EAAE1B,SAAS,CAACoB,IAAD,CAFqB;AAGtCJ,IAAAA,KAAK,EAAEA;AAH+B,GAAX,CAA/B;AAMA,QAAMW,SAAS,GAAG/B,eAAe,CAACU,KAAD,EAAQ;AACrCsB,IAAAA,QAAQ,EAAGC,IAAD,IAAUA,IAAI,CAACC,QADY;AAErCd,IAAAA,KAAK,EAAEV,KAAK,CAACyB,OAAN,CAAcf,KAAd,EAAqBgB;AAFS,GAAR,CAAjC;AAKA,QAAMC,UAAU,GAAGpC,GAAG,CAAC,CACnB8B,SADmB,CAAD,CAAtB;AAIA,QAAMO,SAAS,GAAGrC,GAAG,CAAC,CAClB0B,MAAM,CAAChB,IADW,EAElBc,KAFkB,CAAD,CAArB;;AAKA,QAAMc,WAAW,GAAG,YAAY;AAC5B,QAAIlB,QAAJ,EAAc;AACV;AACH;;AACD,QAAIE,OAAJ,EAAa;AACTA,MAAAA,OAAO;AACP;AACH;AACJ,GARD;;AAUA,sBACI,oBAAC,UAAD;AACI,IAAA,QAAQ,EAAEF,QADd;AAEI,IAAA,OAAO,EAAEkB,WAFb;AAGI,IAAA,KAAK,EAAED;AAHX,KAIQZ,UAJR,GAMKE,IANL,EAQKN,KAAK,gBACF,oBAAC,IAAD;AACI,IAAA,QAAQ,EAAEA,KADd;AAEI,IAAA,KAAK,EAAEe;AAFX,IADE,GAKF,IAbR,CADJ;AAiBH;AAAA","sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport ButtonBase from '../ButtonBase';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport { cloneElementSafely } from '../utils';\nimport type IconButtonProps from './IconButtonProps';\nimport type { IconButtonSize } from './IconButtonProps';\n\ntype IconButtonStyles = NamedStylesStringUnion<'root'>;\n\ntype IconSizes = { [n in IconButtonSize]: number };\n\nconst iconSizes: IconSizes = {\n tiny: 16,\n small: 20,\n medium: 24,\n large: 28,\n};\n\nconst useStyles: UseStyles<IconButtonStyles> = function (): IconButtonStyles {\n const theme = useTheme();\n\n return {\n root: {\n flexDirection: 'column',\n justifyContent: 'center',\n alignItems: 'center',\n padding: theme.spacing(1),\n },\n };\n};\n\nexport default function IconButton(props: IconButtonProps) {\n const {\n children,\n color = 'primary',\n disabled = false,\n label,\n onPress,\n size = 'medium',\n style,\n ...otherProps\n } = props;\n\n const theme = useTheme();\n const styles = useStyles();\n\n const icon = cloneElementSafely(children, {\n width: iconSizes[size],\n height: iconSizes[size],\n color: color,\n });\n\n const fontStyle = createFontStyle(theme, {\n selector: (typo) => typo.caption1,\n color: theme.palette[color].main,\n });\n\n const labelStyle = css([\n fontStyle,\n ]);\n\n const rootStyle = css([\n styles.root,\n style,\n ]);\n\n const handlePress = async () => {\n if (disabled) {\n return;\n }\n if (onPress) {\n onPress();\n return;\n }\n };\n\n return (\n <ButtonBase\n disabled={disabled}\n onPress={handlePress}\n style={rootStyle}\n {...otherProps}\n >\n {icon}\n\n {label ? (\n <Text\n children={label}\n style={labelStyle}\n />\n ) : null}\n </ButtonBase>\n );\n};\n"]}
@@ -35,17 +35,29 @@ export default function Image(props) {
35
35
  source,
36
36
  style,
37
37
  square = false,
38
+ onLoad,
39
+ onError,
38
40
  ...otherProps
39
41
  } = props;
40
42
  const [failed, setFailed] = React.useState(false);
41
43
  const styles = useStyles();
44
+
45
+ const handleError = () => {
46
+ if (onError) {
47
+ onError();
48
+ }
49
+
50
+ setFailed(true);
51
+ };
52
+
42
53
  return /*#__PURE__*/React.createElement(View, _extends({
43
54
  style: css([styles.root, !disableOutline ? styles.outlined : undefined, !disablePlaceholder ? styles.placeholder : undefined, !square ? styles.rounded : undefined, style])
44
55
  }, otherProps), failed ? /*#__PURE__*/React.createElement(Text, null, alt) : /*#__PURE__*/React.createElement(ImageCore, {
45
56
  alt: alt,
46
57
  height: '100%',
47
58
  loading: loading,
48
- onError: () => setFailed(true),
59
+ onError: handleError,
60
+ onLoad: onLoad,
49
61
  resizeMode: resizeMode,
50
62
  source: source,
51
63
  width: '100%'
@@ -1 +1 @@
1
- {"version":3,"sources":["Image.tsx"],"names":["React","Text","View","ImageCore","css","StyleSheet","useTheme","useStyles","theme","root","rounded","borderRadius","shape","roundness","overflow","placeholder","backgroundColor","palette","paper","grey","outlined","borderWidth","hairlineWidth","borderStyle","borderColor","Image","props","alt","disableOutline","disablePlaceholder","loading","overlaidChildren","resizeMode","source","style","square","otherProps","failed","setFailed","useState","styles","undefined","absoluteFill"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,EAAeC,IAAf,QAA2B,cAA3B;AAEA,OAAOC,SAAP,MAAsB,cAAtB;AACA,SAASC,GAAT,EAAcC,UAAd,EAA0BC,QAA1B,QAA0C,WAA1C;;AAWA,MAAMC,SAAiC,GAAG,YAAyB;AAC/D,QAAMC,KAAK,GAAGF,QAAQ,EAAtB;AAEA,SAAO;AACHG,IAAAA,IAAI,EAAE,EADH;AAEHC,IAAAA,OAAO,EAAE;AACLC,MAAAA,YAAY,EAAEH,KAAK,CAACI,KAAN,CAAYC,SADrB;AAELC,MAAAA,QAAQ,EAAE;AAFL,KAFN;AAMHC,IAAAA,WAAW,EAAE;AACTC,MAAAA,eAAe,EAAER,KAAK,CAACS,OAAN,CAAcC,KAAd,CAAoBC;AAD5B,KANV;AASHC,IAAAA,QAAQ,EAAE;AACNC,MAAAA,WAAW,EAAEhB,UAAU,CAACiB,aADlB;AAENC,MAAAA,WAAW,EAAE,OAFP;AAGNC,MAAAA,WAAW,EAAEhB,KAAK,CAACS,OAAN,CAAcC,KAAd,CAAoBC;AAH3B;AATP,GAAP;AAeH,CAlBD;;AAoBA,eAAe,SAASM,KAAT,CAAeC,KAAf,EAAkC;AAC7C,QAAM;AACFC,IAAAA,GADE;AAEFC,IAAAA,cAFE;AAGFC,IAAAA,kBAHE;AAIFC,IAAAA,OAAO,GAAG,MAJR;AAKFC,IAAAA,gBALE;AAMFC,IAAAA,UAAU,GAAG,OANX;AAOFC,IAAAA,MAPE;AAQFC,IAAAA,KARE;AASFC,IAAAA,MAAM,GAAG,KATP;AAUF,OAAGC;AAVD,MAWFV,KAXJ;AAaA,QAAM,CAACW,MAAD,EAASC,SAAT,IAAsBtC,KAAK,CAACuC,QAAN,CAAe,KAAf,CAA5B;AAEA,QAAMC,MAAM,GAAGjC,SAAS,EAAxB;AAEA,sBACI,oBAAC,IAAD;AACI,IAAA,KAAK,EAAEH,GAAG,CAAC,CACPoC,MAAM,CAAC/B,IADA,EAEP,CAACmB,cAAD,GAAkBY,MAAM,CAACpB,QAAzB,GAAoCqB,SAF7B,EAGP,CAACZ,kBAAD,GAAsBW,MAAM,CAACzB,WAA7B,GAA2C0B,SAHpC,EAIP,CAACN,MAAD,GAAUK,MAAM,CAAC9B,OAAjB,GAA2B+B,SAJpB,EAKPP,KALO,CAAD;AADd,KAQQE,UARR,GAUKC,MAAM,gBACH,oBAAC,IAAD,QAAOV,GAAP,CADG,gBAGH,oBAAC,SAAD;AACI,IAAA,GAAG,EAAEA,GADT;AAEI,IAAA,MAAM,EAAE,MAFZ;AAGI,IAAA,OAAO,EAAEG,OAHb;AAII,IAAA,OAAO,EAAE,MAAMQ,SAAS,CAAC,IAAD,CAJ5B;AAKI,IAAA,UAAU,EAAEN,UALhB;AAMI,IAAA,MAAM,EAAEC,MANZ;AAOI,IAAA,KAAK,EAAE;AAPX,IAbR,EAwBKF,gBAAgB,gBACb,oBAAC,IAAD;AAAM,IAAA,KAAK,EAAE1B,UAAU,CAACqC;AAAxB,KACKX,gBADL,CADa,GAIb,IA5BR,CADJ;AAgCH;AAAA","sourcesContent":["import React from 'react';\nimport { Text, View } from 'react-native';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport ImageCore from '../ImageCore';\nimport { css, StyleSheet, useTheme } from '../styles';\nimport type ImageProps from './ImageProps';\n\ntype ImageStyleKeys =\n | 'root'\n | 'rounded'\n | 'placeholder'\n | 'outlined';\n\ntype ImageStyles = NamedStylesStringUnion<ImageStyleKeys>;\n\nconst useStyles: UseStyles<ImageStyles> = function (): ImageStyles {\n const theme = useTheme();\n\n return {\n root: {},\n rounded: {\n borderRadius: theme.shape.roundness,\n overflow: 'hidden',\n },\n placeholder: {\n backgroundColor: theme.palette.paper.grey,\n },\n outlined: {\n borderWidth: StyleSheet.hairlineWidth,\n borderStyle: 'solid',\n borderColor: theme.palette.paper.grey,\n },\n };\n};\n\nexport default function Image(props: ImageProps) {\n const {\n alt,\n disableOutline,\n disablePlaceholder,\n loading = 'lazy',\n overlaidChildren,\n resizeMode = 'cover',\n source,\n style,\n square = false,\n ...otherProps\n } = props;\n\n const [failed, setFailed] = React.useState(false);\n\n const styles = useStyles();\n\n return (\n <View\n style={css([\n styles.root,\n !disableOutline ? styles.outlined : undefined,\n !disablePlaceholder ? styles.placeholder : undefined,\n !square ? styles.rounded : undefined,\n style,\n ])}\n {...otherProps}\n >\n {failed ? (\n <Text>{alt}</Text>\n ) : (\n <ImageCore\n alt={alt}\n height={'100%'}\n loading={loading}\n onError={() => setFailed(true)}\n resizeMode={resizeMode}\n source={source}\n width={'100%'}\n />\n )}\n\n {overlaidChildren ? (\n <View style={StyleSheet.absoluteFill}>\n {overlaidChildren}\n </View>\n ) : null}\n </View>\n );\n};\n"]}
1
+ {"version":3,"sources":["Image.tsx"],"names":["React","Text","View","ImageCore","css","StyleSheet","useTheme","useStyles","theme","root","rounded","borderRadius","shape","roundness","overflow","placeholder","backgroundColor","palette","paper","grey","outlined","borderWidth","hairlineWidth","borderStyle","borderColor","Image","props","alt","disableOutline","disablePlaceholder","loading","overlaidChildren","resizeMode","source","style","square","onLoad","onError","otherProps","failed","setFailed","useState","styles","handleError","undefined","absoluteFill"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,IAAT,EAAeC,IAAf,QAA2B,cAA3B;AAEA,OAAOC,SAAP,MAAsB,cAAtB;AACA,SAASC,GAAT,EAAcC,UAAd,EAA0BC,QAA1B,QAA0C,WAA1C;;AAWA,MAAMC,SAAiC,GAAG,YAAyB;AAC/D,QAAMC,KAAK,GAAGF,QAAQ,EAAtB;AAEA,SAAO;AACHG,IAAAA,IAAI,EAAE,EADH;AAEHC,IAAAA,OAAO,EAAE;AACLC,MAAAA,YAAY,EAAEH,KAAK,CAACI,KAAN,CAAYC,SADrB;AAELC,MAAAA,QAAQ,EAAE;AAFL,KAFN;AAMHC,IAAAA,WAAW,EAAE;AACTC,MAAAA,eAAe,EAAER,KAAK,CAACS,OAAN,CAAcC,KAAd,CAAoBC;AAD5B,KANV;AASHC,IAAAA,QAAQ,EAAE;AACNC,MAAAA,WAAW,EAAEhB,UAAU,CAACiB,aADlB;AAENC,MAAAA,WAAW,EAAE,OAFP;AAGNC,MAAAA,WAAW,EAAEhB,KAAK,CAACS,OAAN,CAAcC,KAAd,CAAoBC;AAH3B;AATP,GAAP;AAeH,CAlBD;;AAoBA,eAAe,SAASM,KAAT,CAAeC,KAAf,EAAkC;AAC7C,QAAM;AACFC,IAAAA,GADE;AAEFC,IAAAA,cAFE;AAGFC,IAAAA,kBAHE;AAIFC,IAAAA,OAAO,GAAG,MAJR;AAKFC,IAAAA,gBALE;AAMFC,IAAAA,UAAU,GAAG,OANX;AAOFC,IAAAA,MAPE;AAQFC,IAAAA,KARE;AASFC,IAAAA,MAAM,GAAG,KATP;AAUFC,IAAAA,MAVE;AAWFC,IAAAA,OAXE;AAYF,OAAGC;AAZD,MAaFZ,KAbJ;AAeA,QAAM,CAACa,MAAD,EAASC,SAAT,IAAsBxC,KAAK,CAACyC,QAAN,CAAe,KAAf,CAA5B;AAEA,QAAMC,MAAM,GAAGnC,SAAS,EAAxB;;AAEA,QAAMoC,WAAW,GAAG,MAAM;AACtB,QAAGN,OAAH,EAAW;AACPA,MAAAA,OAAO;AACV;;AAEDG,IAAAA,SAAS,CAAC,IAAD,CAAT;AACH,GAND;;AAQA,sBACI,oBAAC,IAAD;AACI,IAAA,KAAK,EAAEpC,GAAG,CAAC,CACPsC,MAAM,CAACjC,IADA,EAEP,CAACmB,cAAD,GAAkBc,MAAM,CAACtB,QAAzB,GAAoCwB,SAF7B,EAGP,CAACf,kBAAD,GAAsBa,MAAM,CAAC3B,WAA7B,GAA2C6B,SAHpC,EAIP,CAACT,MAAD,GAAUO,MAAM,CAAChC,OAAjB,GAA2BkC,SAJpB,EAKPV,KALO,CAAD;AADd,KAQQI,UARR,GAUKC,MAAM,gBACH,oBAAC,IAAD,QAAOZ,GAAP,CADG,gBAGH,oBAAC,SAAD;AACI,IAAA,GAAG,EAAEA,GADT;AAEI,IAAA,MAAM,EAAE,MAFZ;AAGI,IAAA,OAAO,EAAEG,OAHb;AAII,IAAA,OAAO,EAAEa,WAJb;AAKI,IAAA,MAAM,EAAEP,MALZ;AAMI,IAAA,UAAU,EAAEJ,UANhB;AAOI,IAAA,MAAM,EAAEC,MAPZ;AAQI,IAAA,KAAK,EAAE;AARX,IAbR,EAyBKF,gBAAgB,gBACb,oBAAC,IAAD;AAAM,IAAA,KAAK,EAAE1B,UAAU,CAACwC;AAAxB,KACKd,gBADL,CADa,GAIb,IA7BR,CADJ;AAiCH;AAAA","sourcesContent":["import React from 'react';\nimport { Text, View } from 'react-native';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport ImageCore from '../ImageCore';\nimport { css, StyleSheet, useTheme } from '../styles';\nimport type ImageProps from './ImageProps';\n\ntype ImageStyleKeys =\n | 'root'\n | 'rounded'\n | 'placeholder'\n | 'outlined';\n\ntype ImageStyles = NamedStylesStringUnion<ImageStyleKeys>;\n\nconst useStyles: UseStyles<ImageStyles> = function (): ImageStyles {\n const theme = useTheme();\n\n return {\n root: {},\n rounded: {\n borderRadius: theme.shape.roundness,\n overflow: 'hidden',\n },\n placeholder: {\n backgroundColor: theme.palette.paper.grey,\n },\n outlined: {\n borderWidth: StyleSheet.hairlineWidth,\n borderStyle: 'solid',\n borderColor: theme.palette.paper.grey,\n },\n };\n};\n\nexport default function Image(props: ImageProps) {\n const {\n alt,\n disableOutline,\n disablePlaceholder,\n loading = 'lazy',\n overlaidChildren,\n resizeMode = 'cover',\n source,\n style,\n square = false,\n onLoad,\n onError,\n ...otherProps\n } = props;\n\n const [failed, setFailed] = React.useState(false);\n\n const styles = useStyles();\n\n const handleError = () => {\n if(onError){\n onError();\n }\n\n setFailed(true);\n }\n\n return (\n <View\n style={css([\n styles.root,\n !disableOutline ? styles.outlined : undefined,\n !disablePlaceholder ? styles.placeholder : undefined,\n !square ? styles.rounded : undefined,\n style,\n ])}\n {...otherProps}\n >\n {failed ? (\n <Text>{alt}</Text>\n ) : (\n <ImageCore\n alt={alt}\n height={'100%'}\n loading={loading}\n onError={handleError}\n onLoad={onLoad}\n resizeMode={resizeMode}\n source={source}\n width={'100%'}\n />\n )}\n\n {overlaidChildren ? (\n <View style={StyleSheet.absoluteFill}>\n {overlaidChildren}\n </View>\n ) : null}\n </View>\n );\n};\n"]}
@@ -5,6 +5,7 @@ import ButtonBase from '../ButtonBase';
5
5
  import { Radio as RadioIcon, RadioChecked as RadioCheckedIcon } from '../internal';
6
6
  import { css, useTheme } from '../styles';
7
7
  import { RadioContext } from '../RadioGroup/RadioContextProvider';
8
+ const ICON_SIZE = 20;
8
9
 
9
10
  const useStyles = function () {
10
11
  return {
@@ -42,22 +43,21 @@ export default function Radio(props) {
42
43
  };
43
44
 
44
45
  const isChecked = (_ref = (context === null || context === void 0 ? void 0 : context.value) === value) !== null && _ref !== void 0 ? _ref : checked;
45
- const color = theme.palette.tertiary.main;
46
- const checkedColor = theme.palette.primary.main;
46
+ const icon = isChecked ? /*#__PURE__*/React.createElement(RadioCheckedIcon, {
47
+ width: ICON_SIZE,
48
+ height: ICON_SIZE,
49
+ color: 'primary'
50
+ }) : /*#__PURE__*/React.createElement(RadioIcon, {
51
+ width: ICON_SIZE,
52
+ height: ICON_SIZE,
53
+ color: 'tertiary'
54
+ });
47
55
  const rootStyle = css([styles.root, style]);
48
56
  return /*#__PURE__*/React.createElement(ButtonBase, _extends({
49
57
  disabled: disabled,
50
58
  onPress: handlePress,
51
59
  style: rootStyle
52
- }, otherProps), isChecked ? /*#__PURE__*/React.createElement(RadioCheckedIcon, {
53
- fill: checkedColor,
54
- height: 20,
55
- width: 20
56
- }) : /*#__PURE__*/React.createElement(RadioIcon, {
57
- fill: color,
58
- height: 20,
59
- width: 20
60
- }), children ? children : null);
60
+ }, otherProps), icon, children ? children : null);
61
61
  }
62
62
  ;
63
63
  //# sourceMappingURL=Radio.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["Radio.tsx"],"names":["React","ButtonBase","Radio","RadioIcon","RadioChecked","RadioCheckedIcon","css","useTheme","RadioContext","useStyles","root","alignItems","flexDirection","props","checked","children","disabled","onChange","onChangeProp","style","value","otherProps","styles","theme","context","useContext","handlePress","isChecked","color","palette","tertiary","main","checkedColor","primary","rootStyle"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,OAAOC,UAAP,MAAuB,eAAvB;AACA,SAASC,KAAK,IAAIC,SAAlB,EAA6BC,YAAY,IAAIC,gBAA7C,QAAqE,aAArE;AACA,SAASC,GAAT,EAAcC,QAAd,QAA8B,WAA9B;AACA,SAASC,YAAT,QAA6B,oCAA7B;;AAKA,MAAMC,SAAiC,GAAG,YAAyB;AAC/D,SAAO;AACHC,IAAAA,IAAI,EAAE;AACFC,MAAAA,UAAU,EAAE,QADV;AAEFC,MAAAA,aAAa,EAAE;AAFb;AADH,GAAP;AAMH,CAPD;;AASA,eAAe,SAASV,KAAT,CAAeW,KAAf,EAAkC;AAAA;;AAC7C,QAAM;AACFC,IAAAA,OAAO,GAAG,KADR;AAEFC,IAAAA,QAFE;AAGFC,IAAAA,QAAQ,GAAG,KAHT;AAIFC,IAAAA,QAAQ,EAAEC,YAJR;AAKFC,IAAAA,KALE;AAMFC,IAAAA,KANE;AAOF,OAAGC;AAPD,MAQFR,KARJ;AAUA,QAAMS,MAAM,GAAGb,SAAS,EAAxB;AAEA,QAAMc,KAAK,GAAGhB,QAAQ,EAAtB;AAEA,QAAMiB,OAAO,GAAGxB,KAAK,CAACyB,UAAN,CAAiBjB,YAAjB,CAAhB;;AAEA,QAAMkB,WAAW,GAAG,MAAM;AAAA;;AACtB,UAAMT,QAAQ,wBAAGO,OAAH,aAAGA,OAAH,uBAAGA,OAAO,CAAEP,QAAZ,iEAAwBC,YAAtC;;AACA,QAAID,QAAJ,EAAc;AACVA,MAAAA,QAAQ,CAACG,KAAD,CAAR;AACH;AACJ,GALD;;AAOA,QAAMO,SAAS,WAAG,CAAAH,OAAO,SAAP,IAAAA,OAAO,WAAP,YAAAA,OAAO,CAAEJ,KAAT,MAAmBA,KAAtB,uCAA+BN,OAA9C;AAEA,QAAMc,KAAK,GAAGL,KAAK,CAACM,OAAN,CAAcC,QAAd,CAAuBC,IAArC;AACA,QAAMC,YAAY,GAAGT,KAAK,CAACM,OAAN,CAAcI,OAAd,CAAsBF,IAA3C;AAEA,QAAMG,SAAS,GAAG5B,GAAG,CAAC,CAClBgB,MAAM,CAACZ,IADW,EAElBS,KAFkB,CAAD,CAArB;AAKA,sBACI,oBAAC,UAAD;AACI,IAAA,QAAQ,EAAEH,QADd;AAEI,IAAA,OAAO,EAAEU,WAFb;AAGI,IAAA,KAAK,EAAEQ;AAHX,KAIQb,UAJR,GAMKM,SAAS,gBACN,oBAAC,gBAAD;AACI,IAAA,IAAI,EAAEK,YADV;AAEI,IAAA,MAAM,EAAE,EAFZ;AAGI,IAAA,KAAK,EAAE;AAHX,IADM,gBAON,oBAAC,SAAD;AACI,IAAA,IAAI,EAAEJ,KADV;AAEI,IAAA,MAAM,EAAE,EAFZ;AAGI,IAAA,KAAK,EAAE;AAHX,IAbR,EAmBKb,QAAQ,GAAGA,QAAH,GAAc,IAnB3B,CADJ;AAuBH;AAAA","sourcesContent":["import React from 'react';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport ButtonBase from '../ButtonBase';\nimport { Radio as RadioIcon, RadioChecked as RadioCheckedIcon } from '../internal';\nimport { css, useTheme } from '../styles';\nimport { RadioContext } from '../RadioGroup/RadioContextProvider';\nimport type RadioProps from './RadioProps';\n\ntype RadioStyles = NamedStylesStringUnion<'root'>;\n\nconst useStyles: UseStyles<RadioStyles> = function (): RadioStyles {\n return {\n root: {\n alignItems: 'center',\n flexDirection: 'row',\n },\n };\n};\n\nexport default function Radio(props: RadioProps) {\n const {\n checked = false,\n children,\n disabled = false,\n onChange: onChangeProp,\n style,\n value,\n ...otherProps\n } = props;\n\n const styles = useStyles();\n\n const theme = useTheme();\n\n const context = React.useContext(RadioContext);\n\n const handlePress = () => {\n const onChange = context?.onChange ?? onChangeProp;\n if (onChange) {\n onChange(value);\n }\n };\n\n const isChecked = context?.value === value ?? checked;\n\n const color = theme.palette.tertiary.main;\n const checkedColor = theme.palette.primary.main;\n\n const rootStyle = css([\n styles.root,\n style,\n ]);\n\n return (\n <ButtonBase\n disabled={disabled}\n onPress={handlePress}\n style={rootStyle}\n {...otherProps}\n >\n {isChecked ? (\n <RadioCheckedIcon\n fill={checkedColor}\n height={20}\n width={20}\n />\n ) : (\n <RadioIcon\n fill={color}\n height={20}\n width={20}\n />\n )}\n {children ? children : null}\n </ButtonBase>\n );\n};\n"]}
1
+ {"version":3,"sources":["Radio.tsx"],"names":["React","ButtonBase","Radio","RadioIcon","RadioChecked","RadioCheckedIcon","css","useTheme","RadioContext","ICON_SIZE","useStyles","root","alignItems","flexDirection","props","checked","children","disabled","onChange","onChangeProp","style","value","otherProps","styles","theme","context","useContext","handlePress","isChecked","icon","rootStyle"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AAEA,OAAOC,UAAP,MAAuB,eAAvB;AACA,SAASC,KAAK,IAAIC,SAAlB,EAA6BC,YAAY,IAAIC,gBAA7C,QAAqE,aAArE;AACA,SAASC,GAAT,EAAcC,QAAd,QAA8B,WAA9B;AACA,SAASC,YAAT,QAA6B,oCAA7B;AAKA,MAAMC,SAAS,GAAG,EAAlB;;AAEA,MAAMC,SAAiC,GAAG,YAAyB;AAC/D,SAAO;AACHC,IAAAA,IAAI,EAAE;AACFC,MAAAA,UAAU,EAAE,QADV;AAEFC,MAAAA,aAAa,EAAE;AAFb;AADH,GAAP;AAMH,CAPD;;AASA,eAAe,SAASX,KAAT,CAAeY,KAAf,EAAkC;AAAA;;AAC7C,QAAM;AACFC,IAAAA,OAAO,GAAG,KADR;AAEFC,IAAAA,QAFE;AAGFC,IAAAA,QAAQ,GAAG,KAHT;AAIFC,IAAAA,QAAQ,EAAEC,YAJR;AAKFC,IAAAA,KALE;AAMFC,IAAAA,KANE;AAOF,OAAGC;AAPD,MAQFR,KARJ;AAUA,QAAMS,MAAM,GAAGb,SAAS,EAAxB;AAEA,QAAMc,KAAK,GAAGjB,QAAQ,EAAtB;AAEA,QAAMkB,OAAO,GAAGzB,KAAK,CAAC0B,UAAN,CAAiBlB,YAAjB,CAAhB;;AAEA,QAAMmB,WAAW,GAAG,MAAM;AAAA;;AACtB,UAAMT,QAAQ,wBAAGO,OAAH,aAAGA,OAAH,uBAAGA,OAAO,CAAEP,QAAZ,iEAAwBC,YAAtC;;AACA,QAAID,QAAJ,EAAc;AACVA,MAAAA,QAAQ,CAACG,KAAD,CAAR;AACH;AACJ,GALD;;AAOA,QAAMO,SAAS,WAAG,CAAAH,OAAO,SAAP,IAAAA,OAAO,WAAP,YAAAA,OAAO,CAAEJ,KAAT,MAAmBA,KAAtB,uCAA+BN,OAA9C;AAEA,QAAMc,IAAI,GAAGD,SAAS,gBAChB,oBAAC,gBAAD;AAAkB,IAAA,KAAK,EAAEnB,SAAzB;AAAoC,IAAA,MAAM,EAAEA,SAA5C;AAAuD,IAAA,KAAK,EAAE;AAA9D,IADgB,gBAEhB,oBAAC,SAAD;AAAW,IAAA,KAAK,EAAEA,SAAlB;AAA6B,IAAA,MAAM,EAAEA,SAArC;AAAgD,IAAA,KAAK,EAAE;AAAvD,IAFN;AAIA,QAAMqB,SAAS,GAAGxB,GAAG,CAAC,CAClBiB,MAAM,CAACZ,IADW,EAElBS,KAFkB,CAAD,CAArB;AAKA,sBACI,oBAAC,UAAD;AACI,IAAA,QAAQ,EAAEH,QADd;AAEI,IAAA,OAAO,EAAEU,WAFb;AAGI,IAAA,KAAK,EAAEG;AAHX,KAIQR,UAJR,GAMKO,IANL,EAQKb,QAAQ,GAAGA,QAAH,GAAc,IAR3B,CADJ;AAYH;AAAA","sourcesContent":["import React from 'react';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport ButtonBase from '../ButtonBase';\nimport { Radio as RadioIcon, RadioChecked as RadioCheckedIcon } from '../internal';\nimport { css, useTheme } from '../styles';\nimport { RadioContext } from '../RadioGroup/RadioContextProvider';\nimport type RadioProps from './RadioProps';\n\ntype RadioStyles = NamedStylesStringUnion<'root'>;\n\nconst ICON_SIZE = 20;\n\nconst useStyles: UseStyles<RadioStyles> = function (): RadioStyles {\n return {\n root: {\n alignItems: 'center',\n flexDirection: 'row',\n },\n };\n};\n\nexport default function Radio(props: RadioProps) {\n const {\n checked = false,\n children,\n disabled = false,\n onChange: onChangeProp,\n style,\n value,\n ...otherProps\n } = props;\n\n const styles = useStyles();\n\n const theme = useTheme();\n\n const context = React.useContext(RadioContext);\n\n const handlePress = () => {\n const onChange = context?.onChange ?? onChangeProp;\n if (onChange) {\n onChange(value);\n }\n };\n\n const isChecked = context?.value === value ?? checked;\n\n const icon = isChecked\n ? <RadioCheckedIcon width={ICON_SIZE} height={ICON_SIZE} color={'primary'}/>\n : <RadioIcon width={ICON_SIZE} height={ICON_SIZE} color={'tertiary'}/>;\n\n const rootStyle = css([\n styles.root,\n style,\n ]);\n\n return (\n <ButtonBase\n disabled={disabled}\n onPress={handlePress}\n style={rootStyle}\n {...otherProps}\n >\n {icon}\n\n {children ? children : null}\n </ButtonBase>\n );\n};\n"]}
@@ -2,21 +2,25 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
2
2
 
3
3
  import React from 'react';
4
4
  import Svg from 'react-native-svg';
5
- import { css } from '../styles';
5
+ import { css, useTheme } from '../styles';
6
6
  export default function SvgIcon(props) {
7
7
  const {
8
- fill = '#000',
8
+ color: colorProp = 'primary',
9
+ colorValue,
9
10
  height = 24,
10
11
  style: styleProp,
11
12
  viewBox = '0 0 20 20',
12
13
  width = 24,
13
14
  ...otherProps
14
15
  } = props;
16
+ const theme = useTheme();
17
+ const color = colorValue !== null && colorValue !== void 0 ? colorValue : theme.palette[colorProp].main;
15
18
  const style = css([{
16
19
  flexShrink: 0
17
20
  }, styleProp]);
18
21
  return /*#__PURE__*/React.createElement(Svg, _extends({
19
- fill: fill,
22
+ color: color,
23
+ fill: 'currentColor',
20
24
  height: height,
21
25
  style: style,
22
26
  viewBox: viewBox,
@@ -1 +1 @@
1
- {"version":3,"sources":["SvgIcon.tsx"],"names":["React","Svg","css","SvgIcon","props","fill","height","style","styleProp","viewBox","width","otherProps","flexShrink"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,GAAP,MAAgB,kBAAhB;AACA,SAASC,GAAT,QAAoB,WAApB;AAGA,eAAe,SAASC,OAAT,CAAiBC,KAAjB,EAAsC;AACjD,QAAM;AACFC,IAAAA,IAAI,GAAG,MADL;AAEFC,IAAAA,MAAM,GAAG,EAFP;AAGFC,IAAAA,KAAK,EAAEC,SAHL;AAIFC,IAAAA,OAAO,GAAG,WAJR;AAKFC,IAAAA,KAAK,GAAG,EALN;AAMF,OAAGC;AAND,MAOYP,KAPlB;AASA,QAAMG,KAAK,GAAGL,GAAG,CAAC,CACd;AAAEU,IAAAA,UAAU,EAAG;AAAf,GADc,EAEdJ,SAFc,CAAD,CAAjB;AAKA,sBACI,oBAAC,GAAD;AACI,IAAA,IAAI,EAAEH,IADV;AAEI,IAAA,MAAM,EAAEC,MAFZ;AAGI,IAAA,KAAK,EAAEC,KAHX;AAII,IAAA,OAAO,EAAEE,OAJb;AAKI,IAAA,KAAK,EAAEC;AALX,KAMQC,UANR,EADJ;AAUH;AAAA","sourcesContent":["import React from 'react';\nimport Svg from 'react-native-svg';\nimport { css } from '../styles';\nimport type SvgIconProps from './SvgIconProps';\n\nexport default function SvgIcon(props: SvgIconProps) {\n const {\n fill = '#000',\n height = 24,\n style: styleProp,\n viewBox = '0 0 20 20',\n width = 24,\n ...otherProps\n }: SvgIconProps = props;\n\n const style = css([\n { flexShrink : 0 },\n styleProp,\n ]);\n\n return (\n <Svg\n fill={fill}\n height={height}\n style={style}\n viewBox={viewBox}\n width={width}\n {...otherProps}\n />\n );\n};"]}
1
+ {"version":3,"sources":["SvgIcon.tsx"],"names":["React","Svg","css","useTheme","SvgIcon","props","color","colorProp","colorValue","height","style","styleProp","viewBox","width","otherProps","theme","palette","main","flexShrink"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,GAAP,MAAgB,kBAAhB;AACA,SAASC,GAAT,EAAcC,QAAd,QAA8B,WAA9B;AAGA,eAAe,SAASC,OAAT,CAAiBC,KAAjB,EAAsC;AACjD,QAAM;AACFC,IAAAA,KAAK,EAAEC,SAAS,GAAG,SADjB;AAEFC,IAAAA,UAFE;AAGFC,IAAAA,MAAM,GAAG,EAHP;AAIFC,IAAAA,KAAK,EAAEC,SAJL;AAKFC,IAAAA,OAAO,GAAG,WALR;AAMFC,IAAAA,KAAK,GAAG,EANN;AAOF,OAAGC;AAPD,MAQYT,KARlB;AAUA,QAAMU,KAAK,GAAGZ,QAAQ,EAAtB;AAEA,QAAMG,KAAK,GAAGE,UAAH,aAAGA,UAAH,cAAGA,UAAH,GAAiBO,KAAK,CAACC,OAAN,CAAcT,SAAd,EAAyBU,IAArD;AAEA,QAAMP,KAAK,GAAGR,GAAG,CAAC,CACd;AAAEgB,IAAAA,UAAU,EAAE;AAAd,GADc,EAEdP,SAFc,CAAD,CAAjB;AAKA,sBACI,oBAAC,GAAD;AACI,IAAA,KAAK,EAAEL,KADX;AAEI,IAAA,IAAI,EAAE,cAFV;AAGI,IAAA,MAAM,EAAEG,MAHZ;AAII,IAAA,KAAK,EAAEC,KAJX;AAKI,IAAA,OAAO,EAAEE,OALb;AAMI,IAAA,KAAK,EAAEC;AANX,KAOQC,UAPR,EADJ;AAWH;AAAA","sourcesContent":["import React from 'react';\nimport Svg from 'react-native-svg';\nimport { css, useTheme } from '../styles';\nimport type SvgIconProps from './SvgIconProps';\n\nexport default function SvgIcon(props: SvgIconProps) {\n const {\n color: colorProp = 'primary',\n colorValue,\n height = 24,\n style: styleProp,\n viewBox = '0 0 20 20',\n width = 24,\n ...otherProps\n }: SvgIconProps = props;\n\n const theme = useTheme();\n\n const color = colorValue ?? theme.palette[colorProp].main;\n\n const style = css([\n { flexShrink: 0 },\n styleProp,\n ]);\n\n return (\n <Svg\n color={color}\n fill={'currentColor'}\n height={height}\n style={style}\n viewBox={viewBox}\n width={width}\n {...otherProps}\n />\n );\n};\n"]}
@@ -16,7 +16,7 @@ export default function Switch(props) {
16
16
  const accentColor = theme.palette[colorProp].main;
17
17
  const disabledColor = theme.palette.tertiary.main;
18
18
  const notActiveTrackColor = theme.palette.tertiary.main;
19
- const thumbColor = Platform.OS === 'ios' ? undefined : disabled ? disabledColor : theme.palette.background.default;
19
+ const thumbColor = Platform.OS === 'ios' ? undefined : disabled ? disabledColor : '#fff';
20
20
  const trackColor = Platform.OS === 'ios' ? accentColor : disabled ? disabledColor : accentColor;
21
21
  const style = css([{
22
22
  opacity: disabled ? 0.3 : 1
@@ -1 +1 @@
1
- {"version":3,"sources":["Switch.tsx"],"names":["React","Platform","Switch","RNSwitch","css","useTheme","props","checked","color","colorProp","disabled","onChange","style","styleProp","otherProps","theme","accentColor","palette","main","disabledColor","tertiary","notActiveTrackColor","thumbColor","OS","undefined","background","default","trackColor","opacity","true","false"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,QAAT,EAAmBC,MAAM,IAAIC,QAA7B,QAA6C,cAA7C;AACA,SAASC,GAAT,EAAcC,QAAd,QAA8B,WAA9B;AAGA,eAAe,SAASH,MAAT,CAAgBI,KAAhB,EAAoC;AAC/C,QAAM;AACFC,IAAAA,OAAO,GAAG,KADR;AAEFC,IAAAA,KAAK,EAAEC,SAAS,GAAG,WAFjB;AAGFC,IAAAA,QAAQ,GAAG,KAHT;AAIFC,IAAAA,QAJE;AAKFC,IAAAA,KAAK,EAAEC,SALL;AAMF,OAAGC;AAND,MAOFR,KAPJ;AASA,QAAMS,KAAK,GAAGV,QAAQ,EAAtB;AAEA,QAAMW,WAAW,GAAGD,KAAK,CAACE,OAAN,CAAcR,SAAd,EAAyBS,IAA7C;AACA,QAAMC,aAAa,GAAGJ,KAAK,CAACE,OAAN,CAAcG,QAAd,CAAuBF,IAA7C;AACA,QAAMG,mBAAmB,GAAGN,KAAK,CAACE,OAAN,CAAcG,QAAd,CAAuBF,IAAnD;AAEA,QAAMI,UAAU,GAAGrB,QAAQ,CAACsB,EAAT,KAAgB,KAAhB,GACbC,SADa,GAEbd,QAAQ,GACJS,aADI,GAEJJ,KAAK,CAACE,OAAN,CAAcQ,UAAd,CAAyBC,OAJnC;AAMA,QAAMC,UAAU,GAAG1B,QAAQ,CAACsB,EAAT,KAAgB,KAAhB,GACbP,WADa,GAEbN,QAAQ,GAAGS,aAAH,GAAmBH,WAFjC;AAIA,QAAMJ,KAAK,GAAGR,GAAG,CAAC,CACd;AAAEwB,IAAAA,OAAO,EAAElB,QAAQ,GAAG,GAAH,GAAS;AAA5B,GADc,EAEdG,SAFc,CAAD,CAAjB;AAKA,sBACI,oBAAC,QAAD;AACI,IAAA,KAAK,EAAEN,OADX;AAEI,IAAA,QAAQ,EAAEG,QAFd;AAGI,IAAA,UAAU,EAAEY,UAHhB;AAII,IAAA,aAAa,EAAEZ,QAAQ,GAAGc,SAAH,GAAeb,QAJ1C,CAKI;AALJ;AAMI,IAAA,gBAAgB,EAAEgB,UANtB;AAOI,IAAA,gBAAgB,EAAEL,UAPtB;AAQI,IAAA,UAAU,EAAE;AACRO,MAAAA,IAAI,EAAEF,UADE;AAERG,MAAAA,KAAK,EAAET;AAFC,KARhB;AAYI,IAAA,KAAK,EAAET;AAZX,KAaQE,UAbR,EADJ;AAiBH;AAAA","sourcesContent":["import React from 'react';\nimport { Platform, Switch as RNSwitch } from 'react-native';\nimport { css, useTheme } from '../styles';\nimport type SwitchProps from './SwitchProps';\n\nexport default function Switch(props: SwitchProps) {\n const {\n checked = false,\n color: colorProp = 'secondary',\n disabled = false,\n onChange,\n style: styleProp,\n ...otherProps\n } = props;\n\n const theme = useTheme();\n\n const accentColor = theme.palette[colorProp].main;\n const disabledColor = theme.palette.tertiary.main;\n const notActiveTrackColor = theme.palette.tertiary.main;\n\n const thumbColor = Platform.OS === 'ios'\n ? undefined\n : disabled\n ? disabledColor\n : theme.palette.background.default;\n\n const trackColor = Platform.OS === 'ios'\n ? accentColor\n : disabled ? disabledColor : accentColor;\n\n const style = css([\n { opacity: disabled ? 0.3 : 1 },\n styleProp,\n ]);\n\n return (\n <RNSwitch\n value={checked}\n disabled={disabled}\n thumbColor={thumbColor}\n onValueChange={disabled ? undefined : onChange}\n //@ts-ignore\n activeTrackColor={trackColor}\n activeThumbColor={thumbColor}\n trackColor={{\n true: trackColor,\n false: notActiveTrackColor,\n }}\n style={style}\n {...otherProps}\n />\n );\n};\n"]}
1
+ {"version":3,"sources":["Switch.tsx"],"names":["React","Platform","Switch","RNSwitch","css","useTheme","props","checked","color","colorProp","disabled","onChange","style","styleProp","otherProps","theme","accentColor","palette","main","disabledColor","tertiary","notActiveTrackColor","thumbColor","OS","undefined","trackColor","opacity","true","false"],"mappings":";;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,QAAT,EAAmBC,MAAM,IAAIC,QAA7B,QAA6C,cAA7C;AACA,SAASC,GAAT,EAAcC,QAAd,QAA8B,WAA9B;AAGA,eAAe,SAASH,MAAT,CAAgBI,KAAhB,EAAoC;AAC/C,QAAM;AACFC,IAAAA,OAAO,GAAG,KADR;AAEFC,IAAAA,KAAK,EAAEC,SAAS,GAAG,WAFjB;AAGFC,IAAAA,QAAQ,GAAG,KAHT;AAIFC,IAAAA,QAJE;AAKFC,IAAAA,KAAK,EAAEC,SALL;AAMF,OAAGC;AAND,MAOFR,KAPJ;AASA,QAAMS,KAAK,GAAGV,QAAQ,EAAtB;AAEA,QAAMW,WAAW,GAAGD,KAAK,CAACE,OAAN,CAAcR,SAAd,EAAyBS,IAA7C;AACA,QAAMC,aAAa,GAAGJ,KAAK,CAACE,OAAN,CAAcG,QAAd,CAAuBF,IAA7C;AACA,QAAMG,mBAAmB,GAAGN,KAAK,CAACE,OAAN,CAAcG,QAAd,CAAuBF,IAAnD;AAEA,QAAMI,UAAU,GAAGrB,QAAQ,CAACsB,EAAT,KAAgB,KAAhB,GACbC,SADa,GAEbd,QAAQ,GACJS,aADI,GAEJ,MAJV;AAMA,QAAMM,UAAU,GAAGxB,QAAQ,CAACsB,EAAT,KAAgB,KAAhB,GACbP,WADa,GAEbN,QAAQ,GAAGS,aAAH,GAAmBH,WAFjC;AAIA,QAAMJ,KAAK,GAAGR,GAAG,CAAC,CACd;AAAEsB,IAAAA,OAAO,EAAEhB,QAAQ,GAAG,GAAH,GAAS;AAA5B,GADc,EAEdG,SAFc,CAAD,CAAjB;AAKA,sBACI,oBAAC,QAAD;AACI,IAAA,KAAK,EAAEN,OADX;AAEI,IAAA,QAAQ,EAAEG,QAFd;AAGI,IAAA,UAAU,EAAEY,UAHhB;AAII,IAAA,aAAa,EAAEZ,QAAQ,GAAGc,SAAH,GAAeb,QAJ1C,CAKI;AALJ;AAMI,IAAA,gBAAgB,EAAEc,UANtB;AAOI,IAAA,gBAAgB,EAAEH,UAPtB;AAQI,IAAA,UAAU,EAAE;AACRK,MAAAA,IAAI,EAAEF,UADE;AAERG,MAAAA,KAAK,EAAEP;AAFC,KARhB;AAYI,IAAA,KAAK,EAAET;AAZX,KAaQE,UAbR,EADJ;AAiBH;AAAA","sourcesContent":["import React from 'react';\nimport { Platform, Switch as RNSwitch } from 'react-native';\nimport { css, useTheme } from '../styles';\nimport type SwitchProps from './SwitchProps';\n\nexport default function Switch(props: SwitchProps) {\n const {\n checked = false,\n color: colorProp = 'secondary',\n disabled = false,\n onChange,\n style: styleProp,\n ...otherProps\n } = props;\n\n const theme = useTheme();\n\n const accentColor = theme.palette[colorProp].main;\n const disabledColor = theme.palette.tertiary.main;\n const notActiveTrackColor = theme.palette.tertiary.main;\n\n const thumbColor = Platform.OS === 'ios'\n ? undefined\n : disabled\n ? disabledColor\n : '#fff';\n\n const trackColor = Platform.OS === 'ios'\n ? accentColor\n : disabled ? disabledColor : accentColor;\n\n const style = css([\n { opacity: disabled ? 0.3 : 1 },\n styleProp,\n ]);\n\n return (\n <RNSwitch\n value={checked}\n disabled={disabled}\n thumbColor={thumbColor}\n onValueChange={disabled ? undefined : onChange}\n //@ts-ignore\n activeTrackColor={trackColor}\n activeThumbColor={thumbColor}\n trackColor={{\n true: trackColor,\n false: notActiveTrackColor,\n }}\n style={style}\n {...otherProps}\n />\n );\n};\n"]}
@@ -1,8 +1,10 @@
1
1
  import React from 'react';
2
2
  import { Animated, StyleSheet } from 'react-native';
3
+ import { useTheme } from '../styles';
3
4
  import { inputPaddingHorizontal } from './utils';
4
5
 
5
6
  const useStyles = function () {
7
+ const theme = useTheme();
6
8
  return {
7
9
  background: {
8
10
  position: 'absolute',
@@ -12,14 +14,14 @@ const useStyles = function () {
12
14
  right: 0,
13
15
  width: 8,
14
16
  height: 2,
15
- backgroundColor: '#fff'
17
+ backgroundColor: theme.palette.background.default
16
18
  },
17
19
  backgroundText: {
18
20
  position: 'absolute',
19
21
  left: 18,
20
22
  paddingHorizontal: 0,
21
23
  color: 'transparent',
22
- backgroundColor: '#fff'
24
+ backgroundColor: theme.palette.background.default
23
25
  },
24
26
  placeholder: {
25
27
  position: 'absolute',
@@ -1 +1 @@
1
- {"version":3,"sources":["InputLabel.tsx"],"names":["React","Animated","StyleSheet","inputPaddingHorizontal","useStyles","background","position","top","left","bottom","right","width","height","backgroundColor","backgroundText","paddingHorizontal","color","placeholder","InputLabel","props","activeColor","animatedError","animatedLabel","error","errorColor","focused","fontSize","hasActiveOutline","label","labelLayout","labelScale","labelTranslateX","labelTranslateY","onLayoutAnimatedText","paddingOffset","placeholderColor","placeholderOpacity","topPosition","value","styles","hasFocus","opacity","interpolate","inputRange","outputRange","labelTranslationX","transform","translateX","labelStyle","translateY","scale","absoluteFill","measured","scaleY","textAlign"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Animated, LayoutChangeEvent, StyleSheet } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { inputPaddingHorizontal } from './utils';\n\ninterface LabelProps {\n activeColor: string;\n animatedError: Animated.Value;\n animatedLabel: Animated.Value;\n error?: boolean;\n errorColor?: string;\n focused?: boolean;\n fontSize?: number;\n hasActiveOutline?: boolean;\n label?: string;\n labelLayout: { measured: boolean; width: number; height: number };\n labelScale: number;\n labelTranslateX: number;\n labelTranslateY: number;\n onLayoutAnimatedText: (event: LayoutChangeEvent) => void;\n paddingOffset?: { paddingLeft: number; paddingRight: number };\n placeholder?: string;\n placeholderColor?: string;\n placeholderOpacity: number | Animated.AnimatedInterpolation;\n topPosition: number;\n value?: string;\n}\n\ntype InputLabelStyles = NamedStylesStringUnion<'background' | 'backgroundText' | 'placeholder'>;\n\nconst useStyles: UseStyles<InputLabelStyles> = function (): InputLabelStyles {\n return {\n background: {\n position: 'absolute',\n top: 6,\n left: 10,\n bottom: 0,\n right: 0,\n width: 8,\n height: 2,\n backgroundColor: '#fff',\n },\n backgroundText: {\n position: 'absolute',\n left: 18,\n paddingHorizontal: 0,\n color: 'transparent',\n backgroundColor: '#fff',\n },\n placeholder: {\n position: 'absolute',\n left: 0,\n paddingHorizontal: inputPaddingHorizontal,\n },\n };\n};\n\nconst InputLabel = (props: LabelProps) => {\n const {\n activeColor,\n animatedError,\n animatedLabel,\n error = false,\n errorColor,\n focused,\n fontSize,\n hasActiveOutline,\n label,\n labelLayout,\n labelScale,\n labelTranslateX,\n labelTranslateY,\n onLayoutAnimatedText,\n paddingOffset,\n placeholderColor,\n placeholderOpacity,\n topPosition,\n value,\n } = props;\n\n const styles = useStyles();\n\n const hasFocus = hasActiveOutline || value;\n const opacity = animatedLabel.interpolate({\n inputRange: [0, 1],\n outputRange: [hasFocus ? 1 : 0, 0],\n });\n\n const labelTranslationX = {\n transform: [\n {\n translateX: animatedLabel.interpolate({\n inputRange: [0, 1],\n outputRange: [labelTranslateX, 0 || 0],\n }),\n },\n ],\n };\n\n const labelStyle = {\n fontSize,\n transform: [\n {\n translateX: animatedError.interpolate({\n inputRange: [0, 0.5, 1],\n outputRange: [0, value && error ? 4 : 0, 0],\n }),\n },\n {\n translateY: animatedLabel.interpolate({\n inputRange: [0, 1],\n outputRange: [labelTranslateY, 0],\n }),\n },\n {\n scale: animatedLabel.interpolate({\n inputRange: [0, 1],\n outputRange: [labelScale, 1],\n }),\n },\n ],\n };\n\n return (label ? (\n <Animated.View\n pointerEvents={'none'}\n style={[\n StyleSheet.absoluteFill,\n {\n opacity: value || focused ? (labelLayout.measured ? 1 : 0) : 1,\n },\n labelTranslationX,\n ]}\n >\n {[\n <Animated.View\n key={'labelBackground-view'}\n pointerEvents={'none'}\n style={[\n styles.background,\n {\n opacity,\n transform: [\n {\n translateX: animatedLabel.interpolate({\n inputRange: [0, 1],\n outputRange: [-labelTranslateX, 0],\n }),\n },\n ],\n },\n ]}\n />,\n <Animated.Text\n key={'labelBackground-text'}\n style={[\n styles.placeholder,\n styles.backgroundText,\n labelStyle,\n {\n top: topPosition + 1,\n opacity,\n transform: [\n ...labelStyle.transform,\n {\n scaleY: animatedLabel.interpolate({\n inputRange: [0, 1],\n outputRange: [0.2, 1],\n }),\n },\n ],\n },\n ]}\n numberOfLines={1}\n >\n {label}\n </Animated.Text>,\n ]}\n <Animated.Text\n onLayout={onLayoutAnimatedText}\n style={[\n styles.placeholder,\n labelStyle,\n paddingOffset,\n {\n textAlign: 'left',\n top: topPosition,\n color: error && errorColor ? errorColor : activeColor,\n opacity: animatedLabel.interpolate({\n inputRange: [0, 1],\n outputRange: [hasActiveOutline ? 1 : 0, 0],\n }),\n },\n ]}\n numberOfLines={1}\n >\n {label}\n </Animated.Text>\n <Animated.Text\n style={[\n styles.placeholder,\n labelStyle,\n paddingOffset,\n {\n textAlign: 'left',\n top: topPosition,\n color: error && errorColor ? errorColor : placeholderColor,\n opacity: placeholderOpacity,\n },\n ]}\n numberOfLines={1}\n >\n {label}\n </Animated.Text>\n </Animated.View>\n ) : null);\n};\n\nexport default InputLabel;"]}
1
+ {"version":3,"sources":["InputLabel.tsx"],"names":["React","Animated","StyleSheet","useTheme","inputPaddingHorizontal","useStyles","theme","background","position","top","left","bottom","right","width","height","backgroundColor","palette","default","backgroundText","paddingHorizontal","color","placeholder","InputLabel","props","activeColor","animatedError","animatedLabel","error","errorColor","focused","fontSize","hasActiveOutline","label","labelLayout","labelScale","labelTranslateX","labelTranslateY","onLayoutAnimatedText","paddingOffset","placeholderColor","placeholderOpacity","topPosition","value","styles","hasFocus","opacity","interpolate","inputRange","outputRange","labelTranslationX","transform","translateX","labelStyle","translateY","scale","absoluteFill","measured","scaleY","textAlign"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { Animated, LayoutChangeEvent, StyleSheet } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { useTheme } from '../styles';\nimport { inputPaddingHorizontal } from './utils';\n\ninterface LabelProps {\n activeColor: string;\n animatedError: Animated.Value;\n animatedLabel: Animated.Value;\n error?: boolean;\n errorColor?: string;\n focused?: boolean;\n fontSize?: number;\n hasActiveOutline?: boolean;\n label?: string;\n labelLayout: { measured: boolean; width: number; height: number };\n labelScale: number;\n labelTranslateX: number;\n labelTranslateY: number;\n onLayoutAnimatedText: (event: LayoutChangeEvent) => void;\n paddingOffset?: { paddingLeft: number; paddingRight: number };\n placeholder?: string;\n placeholderColor?: string;\n placeholderOpacity: number | Animated.AnimatedInterpolation;\n topPosition: number;\n value?: string;\n}\n\ntype InputLabelStyles = NamedStylesStringUnion<'background' | 'backgroundText' | 'placeholder'>;\n\nconst useStyles: UseStyles<InputLabelStyles> = function (): InputLabelStyles {\n const theme = useTheme();\n\n return {\n background: {\n position: 'absolute',\n top: 6,\n left: 10,\n bottom: 0,\n right: 0,\n width: 8,\n height: 2,\n backgroundColor: theme.palette.background.default,\n },\n backgroundText: {\n position: 'absolute',\n left: 18,\n paddingHorizontal: 0,\n color: 'transparent',\n backgroundColor: theme.palette.background.default,\n },\n placeholder: {\n position: 'absolute',\n left: 0,\n paddingHorizontal: inputPaddingHorizontal,\n },\n };\n};\n\nconst InputLabel = (props: LabelProps) => {\n const {\n activeColor,\n animatedError,\n animatedLabel,\n error = false,\n errorColor,\n focused,\n fontSize,\n hasActiveOutline,\n label,\n labelLayout,\n labelScale,\n labelTranslateX,\n labelTranslateY,\n onLayoutAnimatedText,\n paddingOffset,\n placeholderColor,\n placeholderOpacity,\n topPosition,\n value,\n } = props;\n\n const styles = useStyles();\n\n const hasFocus = hasActiveOutline || value;\n const opacity = animatedLabel.interpolate({\n inputRange: [0, 1],\n outputRange: [hasFocus ? 1 : 0, 0],\n });\n\n const labelTranslationX = {\n transform: [\n {\n translateX: animatedLabel.interpolate({\n inputRange: [0, 1],\n outputRange: [labelTranslateX, 0 || 0],\n }),\n },\n ],\n };\n\n const labelStyle = {\n fontSize,\n transform: [\n {\n translateX: animatedError.interpolate({\n inputRange: [0, 0.5, 1],\n outputRange: [0, value && error ? 4 : 0, 0],\n }),\n },\n {\n translateY: animatedLabel.interpolate({\n inputRange: [0, 1],\n outputRange: [labelTranslateY, 0],\n }),\n },\n {\n scale: animatedLabel.interpolate({\n inputRange: [0, 1],\n outputRange: [labelScale, 1],\n }),\n },\n ],\n };\n\n return (label ? (\n <Animated.View\n pointerEvents={'none'}\n style={[\n StyleSheet.absoluteFill,\n {\n opacity: value || focused ? (labelLayout.measured ? 1 : 0) : 1,\n },\n labelTranslationX,\n ]}\n >\n {[\n <Animated.View\n key={'labelBackground-view'}\n pointerEvents={'none'}\n style={[\n styles.background,\n {\n opacity,\n transform: [\n {\n translateX: animatedLabel.interpolate({\n inputRange: [0, 1],\n outputRange: [-labelTranslateX, 0],\n }),\n },\n ],\n },\n ]}\n />,\n <Animated.Text\n key={'labelBackground-text'}\n style={[\n styles.placeholder,\n styles.backgroundText,\n labelStyle,\n {\n top: topPosition + 1,\n opacity,\n transform: [\n ...labelStyle.transform,\n {\n scaleY: animatedLabel.interpolate({\n inputRange: [0, 1],\n outputRange: [0.2, 1],\n }),\n },\n ],\n },\n ]}\n numberOfLines={1}\n >\n {label}\n </Animated.Text>,\n ]}\n <Animated.Text\n onLayout={onLayoutAnimatedText}\n style={[\n styles.placeholder,\n labelStyle,\n paddingOffset,\n {\n textAlign: 'left',\n top: topPosition,\n color: error && errorColor ? errorColor : activeColor,\n opacity: animatedLabel.interpolate({\n inputRange: [0, 1],\n outputRange: [hasActiveOutline ? 1 : 0, 0],\n }),\n },\n ]}\n numberOfLines={1}\n >\n {label}\n </Animated.Text>\n <Animated.Text\n style={[\n styles.placeholder,\n labelStyle,\n paddingOffset,\n {\n textAlign: 'left',\n top: topPosition,\n color: error && errorColor ? errorColor : placeholderColor,\n opacity: placeholderOpacity,\n },\n ]}\n numberOfLines={1}\n >\n {label}\n </Animated.Text>\n </Animated.View>\n ) : null);\n};\n\nexport default InputLabel;\n"]}