@fountain-ui/core 3.0.0-alpha.3 → 3.0.0-alpha.5
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/build/commonjs/Accordion/useVariantStyleMap.js +2 -2
- package/build/commonjs/Accordion/useVariantStyleMap.js.map +1 -1
- package/build/commonjs/Badge/useVariantStyleMap.js +2 -2
- package/build/commonjs/Badge/useVariantStyleMap.js.map +1 -1
- package/build/commonjs/ListItem/ListItem.js +47 -25
- package/build/commonjs/ListItem/ListItem.js.map +1 -1
- package/build/commonjs/ListItem/ListItemProps.js.map +1 -1
- package/build/commonjs/ListItemIcon/ListItemIcon.js +1 -2
- package/build/commonjs/ListItemIcon/ListItemIcon.js.map +1 -1
- package/build/commonjs/ListItemSecondaryAction/ListItemSecondaryAction.js +2 -0
- package/build/commonjs/ListItemSecondaryAction/ListItemSecondaryAction.js.map +1 -1
- package/build/commonjs/ListItemText/ListItemText.js +20 -21
- package/build/commonjs/ListItemText/ListItemText.js.map +1 -1
- package/build/commonjs/ListItemText/ListItemTextProps.js.map +1 -1
- package/build/commonjs/Section/Section.js +32 -0
- package/build/commonjs/Section/Section.js.map +1 -0
- package/build/commonjs/Section/SectionProps.js +2 -0
- package/build/commonjs/Section/SectionProps.js.map +1 -0
- package/build/commonjs/Section/index.js +16 -0
- package/build/commonjs/Section/index.js.map +1 -0
- package/build/commonjs/ShadowView/ShadowView.native.js +4 -0
- package/build/commonjs/ShadowView/ShadowView.native.js.map +1 -1
- package/build/commonjs/SnackbarContent/SnackbarContent.js +2 -2
- package/build/commonjs/SnackbarContent/SnackbarContent.js.map +1 -1
- package/build/commonjs/Tab/useVariantStyleMap.js +3 -3
- package/build/commonjs/Tab/useVariantStyleMap.js.map +1 -1
- package/build/commonjs/TextField/TextField.js +1 -1
- package/build/commonjs/TextField/TextField.js.map +1 -1
- package/build/commonjs/TextField/useVariantStyleMap.js +2 -2
- package/build/commonjs/TextField/useVariantStyleMap.js.map +1 -1
- package/build/commonjs/Tooltip/Tooltip.js +1 -1
- package/build/commonjs/Tooltip/Tooltip.js.map +1 -1
- package/build/commonjs/hooks/useBreakpointUp.js +4 -1
- package/build/commonjs/hooks/useBreakpointUp.js.map +1 -1
- package/build/commonjs/hooks/useContentContainerStyle.js +24 -28
- package/build/commonjs/hooks/useContentContainerStyle.js.map +1 -1
- package/build/commonjs/index.js +21 -0
- package/build/commonjs/index.js.map +1 -1
- package/build/module/Accordion/useVariantStyleMap.js +2 -2
- package/build/module/Accordion/useVariantStyleMap.js.map +1 -1
- package/build/module/Badge/useVariantStyleMap.js +2 -2
- package/build/module/Badge/useVariantStyleMap.js.map +1 -1
- package/build/module/ListItem/ListItem.js +45 -27
- package/build/module/ListItem/ListItem.js.map +1 -1
- package/build/module/ListItem/ListItemProps.js.map +1 -1
- package/build/module/ListItemIcon/ListItemIcon.js +1 -2
- package/build/module/ListItemIcon/ListItemIcon.js.map +1 -1
- package/build/module/ListItemSecondaryAction/ListItemSecondaryAction.js +2 -0
- package/build/module/ListItemSecondaryAction/ListItemSecondaryAction.js.map +1 -1
- package/build/module/ListItemText/ListItemText.js +17 -19
- package/build/module/ListItemText/ListItemText.js.map +1 -1
- package/build/module/ListItemText/ListItemTextProps.js.map +1 -1
- package/build/module/Section/Section.js +19 -0
- package/build/module/Section/Section.js.map +1 -0
- package/build/module/Section/SectionProps.js +2 -0
- package/build/module/Section/SectionProps.js.map +1 -0
- package/build/module/Section/index.js +2 -0
- package/build/module/Section/index.js.map +1 -0
- package/build/module/ShadowView/ShadowView.native.js +4 -0
- package/build/module/ShadowView/ShadowView.native.js.map +1 -1
- package/build/module/SnackbarContent/SnackbarContent.js +2 -2
- package/build/module/SnackbarContent/SnackbarContent.js.map +1 -1
- package/build/module/Tab/useVariantStyleMap.js +3 -3
- package/build/module/Tab/useVariantStyleMap.js.map +1 -1
- package/build/module/TextField/TextField.js +1 -1
- package/build/module/TextField/TextField.js.map +1 -1
- package/build/module/TextField/useVariantStyleMap.js +2 -2
- package/build/module/TextField/useVariantStyleMap.js.map +1 -1
- package/build/module/Tooltip/Tooltip.js +1 -1
- package/build/module/Tooltip/Tooltip.js.map +1 -1
- package/build/module/hooks/useBreakpointUp.js +4 -1
- package/build/module/hooks/useBreakpointUp.js.map +1 -1
- package/build/module/hooks/useContentContainerStyle.js +23 -24
- package/build/module/hooks/useContentContainerStyle.js.map +1 -1
- package/build/module/index.js +2 -0
- package/build/module/index.js.map +1 -1
- package/build/typescript/ListItem/ListItem.d.ts +1 -1
- package/build/typescript/ListItem/ListItemProps.d.ts +4 -0
- package/build/typescript/ListItemText/ListItemTextProps.d.ts +2 -9
- package/build/typescript/Section/Section.d.ts +3 -0
- package/build/typescript/Section/SectionProps.d.ts +6 -0
- package/build/typescript/Section/index.d.ts +2 -0
- package/build/typescript/hooks/useContentContainerStyle.d.ts +4 -8
- package/build/typescript/index.d.ts +2 -0
- package/package.json +3 -3
- package/src/Accordion/useVariantStyleMap.ts +2 -2
- package/src/Badge/useVariantStyleMap.ts +2 -2
- package/src/ListItem/ListItem.tsx +69 -28
- package/src/ListItem/ListItemProps.ts +5 -0
- package/src/ListItemIcon/ListItemIcon.tsx +1 -2
- package/src/ListItemSecondaryAction/ListItemSecondaryAction.tsx +2 -0
- package/src/ListItemText/ListItemText.tsx +20 -28
- package/src/ListItemText/ListItemTextProps.ts +2 -10
- package/src/Section/Section.tsx +26 -0
- package/src/Section/SectionProps.ts +6 -0
- package/src/Section/index.ts +2 -0
- package/src/ShadowView/ShadowView.native.tsx +4 -0
- package/src/SnackbarContent/SnackbarContent.tsx +2 -2
- package/src/Tab/useVariantStyleMap.ts +3 -3
- package/src/TextField/TextField.tsx +1 -1
- package/src/TextField/useVariantStyleMap.ts +2 -2
- package/src/Tooltip/Tooltip.tsx +1 -1
- package/src/hooks/useBreakpointUp.ts +3 -1
- package/src/hooks/useContentContainerStyle.ts +27 -32
- package/src/index.ts +3 -0
|
@@ -48,7 +48,7 @@ function useVariantStyleMap(variant) {
|
|
|
48
48
|
selector: _ => (0, _styles.typographyOf)({
|
|
49
49
|
fontSize: 15,
|
|
50
50
|
lineHeight: 19.5,
|
|
51
|
-
fontFamily: '
|
|
51
|
+
fontFamily: 'PretendardStd-SemiBold',
|
|
52
52
|
letterSpacing: 0
|
|
53
53
|
}),
|
|
54
54
|
color: theme.palette.text.strong
|
|
@@ -114,7 +114,7 @@ function useVariantStyleMap(variant) {
|
|
|
114
114
|
selector: _ => (0, _styles.typographyOf)({
|
|
115
115
|
fontSize: 15,
|
|
116
116
|
lineHeight: 19.5,
|
|
117
|
-
fontFamily: '
|
|
117
|
+
fontFamily: 'PretendardStd-SemiBold',
|
|
118
118
|
letterSpacing: 0
|
|
119
119
|
}),
|
|
120
120
|
color: theme.palette.text.strong
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useVariantStyleMap","variant","theme","useTheme","useMemo","container","backgroundColor","palette","surface","supportive","borderRadius","shape","radius","md","content","borderTopColor","border","weak","borderTopWidth","marginHorizontal","spacing","paddingBottom","paddingTop","position","contentFont","createFontStyle","selector","typography","body3","regular","color","text","base","subTitleFont","caption1","title","alignItems","paddingLeft","paddingRight","paddingVertical","titleFont","_","typographyOf","fontSize","lineHeight","fontFamily","letterSpacing","strong","borderColor","borderWidth","caption2","caption1short","semiBold","borderBottomColor","borderBottomWidth"],"sources":["useVariantStyleMap.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport type { TextStyle } from 'react-native';\nimport type { FountainUiStyle } from '@fountain-ui/styles';\nimport { typographyOf } from '@fountain-ui/styles';\nimport { createFontStyle, useTheme } from '../styles';\nimport type { AccordionVariant } from './AccordionProps';\n\ninterface VariantStyle {\n container: FountainUiStyle;\n content: FountainUiStyle;\n contentFont: TextStyle;\n subTitleFont?: TextStyle;\n title: FountainUiStyle;\n titleFont: TextStyle;\n}\n\nexport default function useVariantStyleMap(variant: AccordionVariant): VariantStyle {\n const theme = useTheme();\n\n return useMemo(() => {\n switch (variant) {\n default:\n case 'solid':\n return {\n container: {\n backgroundColor: theme.palette.surface.supportive,\n borderRadius: theme.shape.radius.md,\n },\n content: {\n borderTopColor: theme.palette.border.weak,\n borderTopWidth: 0.5,\n marginHorizontal: theme.spacing(4),\n paddingBottom: theme.spacing(5),\n paddingTop: theme.spacing(4),\n position: 'absolute',\n },\n contentFont: createFontStyle(theme, {\n selector: (typography) => typography.body3.regular,\n color: theme.palette.text.base,\n }),\n subTitleFont: createFontStyle(theme, {\n selector: (typography) => typography.caption1.regular,\n color: theme.palette.text.base,\n }),\n title: {\n alignItems: 'center',\n paddingLeft: theme.spacing(4),\n paddingRight: theme.spacing(2),\n paddingVertical: theme.spacing(4),\n },\n titleFont: createFontStyle(theme, {\n selector: (_) => typographyOf({\n fontSize: 15,\n lineHeight: 19.5,\n fontFamily: '
|
|
1
|
+
{"version":3,"names":["useVariantStyleMap","variant","theme","useTheme","useMemo","container","backgroundColor","palette","surface","supportive","borderRadius","shape","radius","md","content","borderTopColor","border","weak","borderTopWidth","marginHorizontal","spacing","paddingBottom","paddingTop","position","contentFont","createFontStyle","selector","typography","body3","regular","color","text","base","subTitleFont","caption1","title","alignItems","paddingLeft","paddingRight","paddingVertical","titleFont","_","typographyOf","fontSize","lineHeight","fontFamily","letterSpacing","strong","borderColor","borderWidth","caption2","caption1short","semiBold","borderBottomColor","borderBottomWidth"],"sources":["useVariantStyleMap.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport type { TextStyle } from 'react-native';\nimport type { FountainUiStyle } from '@fountain-ui/styles';\nimport { typographyOf } from '@fountain-ui/styles';\nimport { createFontStyle, useTheme } from '../styles';\nimport type { AccordionVariant } from './AccordionProps';\n\ninterface VariantStyle {\n container: FountainUiStyle;\n content: FountainUiStyle;\n contentFont: TextStyle;\n subTitleFont?: TextStyle;\n title: FountainUiStyle;\n titleFont: TextStyle;\n}\n\nexport default function useVariantStyleMap(variant: AccordionVariant): VariantStyle {\n const theme = useTheme();\n\n return useMemo(() => {\n switch (variant) {\n default:\n case 'solid':\n return {\n container: {\n backgroundColor: theme.palette.surface.supportive,\n borderRadius: theme.shape.radius.md,\n },\n content: {\n borderTopColor: theme.palette.border.weak,\n borderTopWidth: 0.5,\n marginHorizontal: theme.spacing(4),\n paddingBottom: theme.spacing(5),\n paddingTop: theme.spacing(4),\n position: 'absolute',\n },\n contentFont: createFontStyle(theme, {\n selector: (typography) => typography.body3.regular,\n color: theme.palette.text.base,\n }),\n subTitleFont: createFontStyle(theme, {\n selector: (typography) => typography.caption1.regular,\n color: theme.palette.text.base,\n }),\n title: {\n alignItems: 'center',\n paddingLeft: theme.spacing(4),\n paddingRight: theme.spacing(2),\n paddingVertical: theme.spacing(4),\n },\n titleFont: createFontStyle(theme, {\n selector: (_) => typographyOf({\n fontSize: 15,\n lineHeight: 19.5,\n fontFamily: 'PretendardStd-SemiBold',\n letterSpacing: 0,\n }),\n color: theme.palette.text.strong,\n }),\n };\n case 'line':\n return {\n container: {\n borderColor: theme.palette.border.weak,\n borderRadius: theme.shape.radius.md,\n borderWidth: 1,\n },\n content: {\n borderTopColor: theme.palette.border.weak,\n borderTopWidth: 0.5,\n marginHorizontal: theme.spacing(4),\n paddingBottom: theme.spacing(4),\n paddingTop: theme.spacing(3),\n position: 'absolute',\n },\n contentFont: createFontStyle(theme, {\n selector: (typography) => typography.caption2.regular,\n color: theme.palette.text.base,\n }),\n title: {\n alignItems: 'center',\n paddingBottom: theme.spacing(1),\n paddingLeft: theme.spacing(4),\n paddingRight: theme.spacing(2),\n paddingTop: theme.spacing(0.75),\n },\n titleFont: createFontStyle(theme, {\n selector: (typography) => typography.caption1short.semiBold,\n color: theme.palette.text.base,\n }),\n };\n case 'underline':\n return {\n container: {\n borderBottomColor: theme.palette.border.weak,\n borderBottomWidth: 1,\n },\n content: {\n borderTopColor: theme.palette.border.weak,\n borderTopWidth: 0.5,\n paddingBottom: theme.spacing(5),\n paddingLeft: theme.spacing(0.5),\n paddingRight: theme.spacing(2),\n paddingTop: theme.spacing(4),\n },\n contentFont: createFontStyle(theme, {\n selector: (typography) => typography.body3.regular,\n color: theme.palette.text.base,\n }),\n title: {\n alignItems: 'center',\n paddingLeft: theme.spacing(0.5),\n paddingVertical: theme.spacing(2),\n },\n titleFont: createFontStyle(theme, {\n selector: (_) => typographyOf({\n fontSize: 15,\n lineHeight: 19.5,\n fontFamily: 'PretendardStd-SemiBold',\n letterSpacing: 0,\n }),\n color: theme.palette.text.strong,\n }),\n };\n }\n }, [theme, variant]);\n}\n"],"mappings":";;;;;;;AAAA;;AAGA;;AACA;;AAYe,SAASA,kBAAT,CAA4BC,OAA5B,EAAqE;EAChF,MAAMC,KAAK,GAAG,IAAAC,iBAAA,GAAd;EAEA,OAAO,IAAAC,cAAA,EAAQ,MAAM;IACjB,QAAQH,OAAR;MACI;MACA,KAAK,OAAL;QACI,OAAO;UACHI,SAAS,EAAE;YACPC,eAAe,EAAEJ,KAAK,CAACK,OAAN,CAAcC,OAAd,CAAsBC,UADhC;YAEPC,YAAY,EAAER,KAAK,CAACS,KAAN,CAAYC,MAAZ,CAAmBC;UAF1B,CADR;UAKHC,OAAO,EAAE;YACLC,cAAc,EAAEb,KAAK,CAACK,OAAN,CAAcS,MAAd,CAAqBC,IADhC;YAELC,cAAc,EAAE,GAFX;YAGLC,gBAAgB,EAAEjB,KAAK,CAACkB,OAAN,CAAc,CAAd,CAHb;YAILC,aAAa,EAAEnB,KAAK,CAACkB,OAAN,CAAc,CAAd,CAJV;YAKLE,UAAU,EAAEpB,KAAK,CAACkB,OAAN,CAAc,CAAd,CALP;YAMLG,QAAQ,EAAE;UANL,CALN;UAaHC,WAAW,EAAE,IAAAC,wBAAA,EAAgBvB,KAAhB,EAAuB;YAChCwB,QAAQ,EAAGC,UAAD,IAAgBA,UAAU,CAACC,KAAX,CAAiBC,OADX;YAEhCC,KAAK,EAAE5B,KAAK,CAACK,OAAN,CAAcwB,IAAd,CAAmBC;UAFM,CAAvB,CAbV;UAiBHC,YAAY,EAAE,IAAAR,wBAAA,EAAgBvB,KAAhB,EAAuB;YACjCwB,QAAQ,EAAGC,UAAD,IAAgBA,UAAU,CAACO,QAAX,CAAoBL,OADb;YAEjCC,KAAK,EAAE5B,KAAK,CAACK,OAAN,CAAcwB,IAAd,CAAmBC;UAFO,CAAvB,CAjBX;UAqBHG,KAAK,EAAE;YACHC,UAAU,EAAE,QADT;YAEHC,WAAW,EAAEnC,KAAK,CAACkB,OAAN,CAAc,CAAd,CAFV;YAGHkB,YAAY,EAAEpC,KAAK,CAACkB,OAAN,CAAc,CAAd,CAHX;YAIHmB,eAAe,EAAErC,KAAK,CAACkB,OAAN,CAAc,CAAd;UAJd,CArBJ;UA2BHoB,SAAS,EAAE,IAAAf,wBAAA,EAAgBvB,KAAhB,EAAuB;YAC9BwB,QAAQ,EAAGe,CAAD,IAAO,IAAAC,oBAAA,EAAa;cAC1BC,QAAQ,EAAE,EADgB;cAE1BC,UAAU,EAAE,IAFc;cAG1BC,UAAU,EAAE,wBAHc;cAI1BC,aAAa,EAAE;YAJW,CAAb,CADa;YAO9BhB,KAAK,EAAE5B,KAAK,CAACK,OAAN,CAAcwB,IAAd,CAAmBgB;UAPI,CAAvB;QA3BR,CAAP;;MAqCJ,KAAK,MAAL;QACI,OAAO;UACH1C,SAAS,EAAE;YACP2C,WAAW,EAAE9C,KAAK,CAACK,OAAN,CAAcS,MAAd,CAAqBC,IAD3B;YAEPP,YAAY,EAAER,KAAK,CAACS,KAAN,CAAYC,MAAZ,CAAmBC,EAF1B;YAGPoC,WAAW,EAAE;UAHN,CADR;UAMHnC,OAAO,EAAE;YACLC,cAAc,EAAEb,KAAK,CAACK,OAAN,CAAcS,MAAd,CAAqBC,IADhC;YAELC,cAAc,EAAE,GAFX;YAGLC,gBAAgB,EAAEjB,KAAK,CAACkB,OAAN,CAAc,CAAd,CAHb;YAILC,aAAa,EAAEnB,KAAK,CAACkB,OAAN,CAAc,CAAd,CAJV;YAKLE,UAAU,EAAEpB,KAAK,CAACkB,OAAN,CAAc,CAAd,CALP;YAMLG,QAAQ,EAAE;UANL,CANN;UAcHC,WAAW,EAAE,IAAAC,wBAAA,EAAgBvB,KAAhB,EAAuB;YAChCwB,QAAQ,EAAGC,UAAD,IAAgBA,UAAU,CAACuB,QAAX,CAAoBrB,OADd;YAEhCC,KAAK,EAAE5B,KAAK,CAACK,OAAN,CAAcwB,IAAd,CAAmBC;UAFM,CAAvB,CAdV;UAkBHG,KAAK,EAAE;YACHC,UAAU,EAAE,QADT;YAEHf,aAAa,EAAEnB,KAAK,CAACkB,OAAN,CAAc,CAAd,CAFZ;YAGHiB,WAAW,EAAEnC,KAAK,CAACkB,OAAN,CAAc,CAAd,CAHV;YAIHkB,YAAY,EAAEpC,KAAK,CAACkB,OAAN,CAAc,CAAd,CAJX;YAKHE,UAAU,EAAEpB,KAAK,CAACkB,OAAN,CAAc,IAAd;UALT,CAlBJ;UAyBHoB,SAAS,EAAE,IAAAf,wBAAA,EAAgBvB,KAAhB,EAAuB;YAC9BwB,QAAQ,EAAGC,UAAD,IAAgBA,UAAU,CAACwB,aAAX,CAAyBC,QADrB;YAE9BtB,KAAK,EAAE5B,KAAK,CAACK,OAAN,CAAcwB,IAAd,CAAmBC;UAFI,CAAvB;QAzBR,CAAP;;MA8BJ,KAAK,WAAL;QACI,OAAO;UACH3B,SAAS,EAAE;YACPgD,iBAAiB,EAAEnD,KAAK,CAACK,OAAN,CAAcS,MAAd,CAAqBC,IADjC;YAEPqC,iBAAiB,EAAE;UAFZ,CADR;UAKHxC,OAAO,EAAE;YACLC,cAAc,EAAEb,KAAK,CAACK,OAAN,CAAcS,MAAd,CAAqBC,IADhC;YAELC,cAAc,EAAE,GAFX;YAGLG,aAAa,EAAEnB,KAAK,CAACkB,OAAN,CAAc,CAAd,CAHV;YAILiB,WAAW,EAAEnC,KAAK,CAACkB,OAAN,CAAc,GAAd,CAJR;YAKLkB,YAAY,EAAEpC,KAAK,CAACkB,OAAN,CAAc,CAAd,CALT;YAMLE,UAAU,EAAEpB,KAAK,CAACkB,OAAN,CAAc,CAAd;UANP,CALN;UAaHI,WAAW,EAAE,IAAAC,wBAAA,EAAgBvB,KAAhB,EAAuB;YAChCwB,QAAQ,EAAGC,UAAD,IAAgBA,UAAU,CAACC,KAAX,CAAiBC,OADX;YAEhCC,KAAK,EAAE5B,KAAK,CAACK,OAAN,CAAcwB,IAAd,CAAmBC;UAFM,CAAvB,CAbV;UAiBHG,KAAK,EAAE;YACHC,UAAU,EAAE,QADT;YAEHC,WAAW,EAAEnC,KAAK,CAACkB,OAAN,CAAc,GAAd,CAFV;YAGHmB,eAAe,EAAErC,KAAK,CAACkB,OAAN,CAAc,CAAd;UAHd,CAjBJ;UAsBHoB,SAAS,EAAE,IAAAf,wBAAA,EAAgBvB,KAAhB,EAAuB;YAC9BwB,QAAQ,EAAGe,CAAD,IAAO,IAAAC,oBAAA,EAAa;cAC1BC,QAAQ,EAAE,EADgB;cAE1BC,UAAU,EAAE,IAFc;cAG1BC,UAAU,EAAE,wBAHc;cAI1BC,aAAa,EAAE;YAJW,CAAb,CADa;YAO9BhB,KAAK,EAAE5B,KAAK,CAACK,OAAN,CAAcwB,IAAd,CAAmBgB;UAPI,CAAvB;QAtBR,CAAP;IAxER;EAyGH,CA1GM,EA0GJ,CAAC7C,KAAD,EAAQD,OAAR,CA1GI,CAAP;AA2GH"}
|
|
@@ -47,13 +47,13 @@ function useVariantStyleMap(variant, size, color) {
|
|
|
47
47
|
large: (0, _styles.typographyOf)({
|
|
48
48
|
fontSize: 14,
|
|
49
49
|
lineHeight: 14,
|
|
50
|
-
fontFamily: '
|
|
50
|
+
fontFamily: 'PretendardStd-Bold',
|
|
51
51
|
letterSpacing: -0.7
|
|
52
52
|
}),
|
|
53
53
|
medium: (0, _styles.typographyOf)({
|
|
54
54
|
fontSize: 12,
|
|
55
55
|
lineHeight: 12,
|
|
56
|
-
fontFamily: '
|
|
56
|
+
fontFamily: 'PretendardStd-Bold',
|
|
57
57
|
letterSpacing: -0.6
|
|
58
58
|
})
|
|
59
59
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["sizeMap","dot","medium","number","large","getColorMap","theme","accent","palette","fill","danger","status","useVariantStyleMap","variant","size","color","useTheme","useMemo","badgeSize","process","env","NODE_ENV","undefined","console","warn","colorMap","commonBadgeStyle","backgroundColor","borderRadius","shape","radius","full","height","position","width","fontStyleMap","typographyOf","fontSize","lineHeight","fontFamily","letterSpacing","badge","alignItems","justifyContent","contentFont","createFontStyle","selector","_","commonColors","opacity","white"],"sources":["useVariantStyleMap.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport type { TextStyle } from 'react-native';\nimport type { FontStyle, FountainUiStyle, Theme } from '@fountain-ui/styles';\nimport { commonColors, typographyOf } from '@fountain-ui/styles';\nimport { createFontStyle, useTheme } from '../styles';\nimport type { BadgeColor, BadgeSize, BadgeVariant } from './BadgeProps';\n\nconst sizeMap: Record<BadgeVariant, Partial<Record<BadgeSize, number>>> = {\n dot: {\n medium: 4,\n },\n number: {\n large: 26,\n medium: 22,\n },\n};\n\nconst getColorMap = (theme: Theme): Record<BadgeColor, string> => ({\n accent: theme.palette.fill.accent,\n danger: theme.palette.status.danger,\n});\n\ninterface VariantStyle {\n badge: FountainUiStyle;\n contentFont?: TextStyle;\n}\n\nexport default function useVariantStyleMap(variant: BadgeVariant, size: BadgeSize, color: BadgeColor): VariantStyle {\n const theme = useTheme();\n\n return useMemo<VariantStyle>(() => {\n const badgeSize = sizeMap[variant][size] ?? sizeMap[variant].medium;\n\n if (process.env.NODE_ENV !== 'production' && sizeMap[variant][size] === undefined) {\n console.warn('The selected size is not supported for the chosen variant.');\n }\n\n const colorMap = getColorMap(theme);\n\n const commonBadgeStyle: FountainUiStyle = {\n backgroundColor: colorMap[color],\n borderRadius: theme.shape.radius.full,\n height: badgeSize,\n position: 'absolute',\n width: badgeSize,\n };\n\n const fontStyleMap: Record<BadgeSize, FontStyle> = {\n large: typographyOf({\n fontSize: 14,\n lineHeight: 14,\n fontFamily: '
|
|
1
|
+
{"version":3,"names":["sizeMap","dot","medium","number","large","getColorMap","theme","accent","palette","fill","danger","status","useVariantStyleMap","variant","size","color","useTheme","useMemo","badgeSize","process","env","NODE_ENV","undefined","console","warn","colorMap","commonBadgeStyle","backgroundColor","borderRadius","shape","radius","full","height","position","width","fontStyleMap","typographyOf","fontSize","lineHeight","fontFamily","letterSpacing","badge","alignItems","justifyContent","contentFont","createFontStyle","selector","_","commonColors","opacity","white"],"sources":["useVariantStyleMap.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport type { TextStyle } from 'react-native';\nimport type { FontStyle, FountainUiStyle, Theme } from '@fountain-ui/styles';\nimport { commonColors, typographyOf } from '@fountain-ui/styles';\nimport { createFontStyle, useTheme } from '../styles';\nimport type { BadgeColor, BadgeSize, BadgeVariant } from './BadgeProps';\n\nconst sizeMap: Record<BadgeVariant, Partial<Record<BadgeSize, number>>> = {\n dot: {\n medium: 4,\n },\n number: {\n large: 26,\n medium: 22,\n },\n};\n\nconst getColorMap = (theme: Theme): Record<BadgeColor, string> => ({\n accent: theme.palette.fill.accent,\n danger: theme.palette.status.danger,\n});\n\ninterface VariantStyle {\n badge: FountainUiStyle;\n contentFont?: TextStyle;\n}\n\nexport default function useVariantStyleMap(variant: BadgeVariant, size: BadgeSize, color: BadgeColor): VariantStyle {\n const theme = useTheme();\n\n return useMemo<VariantStyle>(() => {\n const badgeSize = sizeMap[variant][size] ?? sizeMap[variant].medium;\n\n if (process.env.NODE_ENV !== 'production' && sizeMap[variant][size] === undefined) {\n console.warn('The selected size is not supported for the chosen variant.');\n }\n\n const colorMap = getColorMap(theme);\n\n const commonBadgeStyle: FountainUiStyle = {\n backgroundColor: colorMap[color],\n borderRadius: theme.shape.radius.full,\n height: badgeSize,\n position: 'absolute',\n width: badgeSize,\n };\n\n const fontStyleMap: Record<BadgeSize, FontStyle> = {\n large: typographyOf({\n fontSize: 14,\n lineHeight: 14,\n fontFamily: 'PretendardStd-Bold',\n letterSpacing: -0.7,\n }),\n medium: typographyOf({\n fontSize: 12,\n lineHeight: 12,\n fontFamily: 'PretendardStd-Bold',\n letterSpacing: -0.6,\n }),\n };\n\n switch (variant) {\n default:\n case 'dot':\n return {\n badge: { ...commonBadgeStyle },\n };\n case 'number':\n return {\n badge: {\n ...commonBadgeStyle,\n alignItems: 'center',\n justifyContent: 'center',\n },\n contentFont: createFontStyle(theme, {\n selector: (_) => fontStyleMap[size],\n color: commonColors.opacity.white['100'],\n }),\n };\n }\n }, [theme, variant, size, color]);\n}\n"],"mappings":";;;;;;;AAAA;;AAGA;;AACA;;AAGA,MAAMA,OAAiE,GAAG;EACtEC,GAAG,EAAE;IACDC,MAAM,EAAE;EADP,CADiE;EAItEC,MAAM,EAAE;IACJC,KAAK,EAAE,EADH;IAEJF,MAAM,EAAE;EAFJ;AAJ8D,CAA1E;;AAUA,MAAMG,WAAW,GAAIC,KAAD,KAA+C;EAC/DC,MAAM,EAAED,KAAK,CAACE,OAAN,CAAcC,IAAd,CAAmBF,MADoC;EAE/DG,MAAM,EAAEJ,KAAK,CAACE,OAAN,CAAcG,MAAd,CAAqBD;AAFkC,CAA/C,CAApB;;AAUe,SAASE,kBAAT,CAA4BC,OAA5B,EAAmDC,IAAnD,EAAoEC,KAApE,EAAqG;EAChH,MAAMT,KAAK,GAAG,IAAAU,iBAAA,GAAd;EAEA,OAAO,IAAAC,cAAA,EAAsB,MAAM;IAC/B,MAAMC,SAAS,GAAGlB,OAAO,CAACa,OAAD,CAAP,CAAiBC,IAAjB,KAA0Bd,OAAO,CAACa,OAAD,CAAP,CAAiBX,MAA7D;;IAEA,IAAIiB,OAAO,CAACC,GAAR,CAAYC,QAAZ,KAAyB,YAAzB,IAAyCrB,OAAO,CAACa,OAAD,CAAP,CAAiBC,IAAjB,MAA2BQ,SAAxE,EAAmF;MAC/EC,OAAO,CAACC,IAAR,CAAa,4DAAb;IACH;;IAED,MAAMC,QAAQ,GAAGpB,WAAW,CAACC,KAAD,CAA5B;IAEA,MAAMoB,gBAAiC,GAAG;MACtCC,eAAe,EAAEF,QAAQ,CAACV,KAAD,CADa;MAEtCa,YAAY,EAAEtB,KAAK,CAACuB,KAAN,CAAYC,MAAZ,CAAmBC,IAFK;MAGtCC,MAAM,EAAEd,SAH8B;MAItCe,QAAQ,EAAE,UAJ4B;MAKtCC,KAAK,EAAEhB;IAL+B,CAA1C;IAQA,MAAMiB,YAA0C,GAAG;MAC/C/B,KAAK,EAAE,IAAAgC,oBAAA,EAAa;QAChBC,QAAQ,EAAE,EADM;QAEhBC,UAAU,EAAE,EAFI;QAGhBC,UAAU,EAAE,oBAHI;QAIhBC,aAAa,EAAE,CAAC;MAJA,CAAb,CADwC;MAO/CtC,MAAM,EAAE,IAAAkC,oBAAA,EAAa;QACjBC,QAAQ,EAAE,EADO;QAEjBC,UAAU,EAAE,EAFK;QAGjBC,UAAU,EAAE,oBAHK;QAIjBC,aAAa,EAAE,CAAC;MAJC,CAAb;IAPuC,CAAnD;;IAeA,QAAQ3B,OAAR;MACI;MACA,KAAK,KAAL;QACI,OAAO;UACH4B,KAAK,EAAE,EAAE,GAAGf;UAAL;QADJ,CAAP;;MAGJ,KAAK,QAAL;QACI,OAAO;UACHe,KAAK,EAAE,EACH,GAAGf,gBADA;YAEHgB,UAAU,EAAE,QAFT;YAGHC,cAAc,EAAE;UAHb,CADJ;UAMHC,WAAW,EAAE,IAAAC,wBAAA,EAAgBvC,KAAhB,EAAuB;YAChCwC,QAAQ,EAAGC,CAAD,IAAOZ,YAAY,CAACrB,IAAD,CADG;YAEhCC,KAAK,EAAEiC,oBAAA,CAAaC,OAAb,CAAqBC,KAArB,CAA2B,KAA3B;UAFyB,CAAvB;QANV,CAAP;IAPR;EAmBH,CAnDM,EAmDJ,CAAC5C,KAAD,EAAQO,OAAR,EAAiBC,IAAjB,EAAuBC,KAAvB,CAnDI,CAAP;AAoDH"}
|
|
@@ -9,22 +9,34 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
9
9
|
|
|
10
10
|
var _reactNative = require("react-native");
|
|
11
11
|
|
|
12
|
+
var _styles = require("@fountain-ui/styles");
|
|
13
|
+
|
|
12
14
|
var _ButtonBase = _interopRequireDefault(require("../ButtonBase"));
|
|
13
15
|
|
|
14
|
-
var
|
|
16
|
+
var _Row = _interopRequireDefault(require("../Row"));
|
|
15
17
|
|
|
16
|
-
|
|
18
|
+
var _styles2 = require("../styles");
|
|
17
19
|
|
|
18
|
-
function
|
|
20
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
19
21
|
|
|
20
22
|
const useStyles = function () {
|
|
21
|
-
const theme = (0,
|
|
23
|
+
const theme = (0, _styles2.useTheme)();
|
|
22
24
|
return {
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
paddingVertical: theme.spacing(3),
|
|
25
|
+
content: {
|
|
26
|
+
gap: theme.spacing(2),
|
|
27
|
+
paddingVertical: theme.spacing(3.75),
|
|
26
28
|
paddingHorizontal: theme.spacing(4),
|
|
27
29
|
width: '100%'
|
|
30
|
+
},
|
|
31
|
+
description: {
|
|
32
|
+
paddingRight: theme.spacing(20)
|
|
33
|
+
},
|
|
34
|
+
divider: {
|
|
35
|
+
borderBottomColor: theme.palette.border.weak,
|
|
36
|
+
borderBottomWidth: 0.5
|
|
37
|
+
},
|
|
38
|
+
dividerWrapper: {
|
|
39
|
+
paddingHorizontal: theme.spacing(4)
|
|
28
40
|
}
|
|
29
41
|
};
|
|
30
42
|
};
|
|
@@ -34,39 +46,49 @@ function ListItem(props) {
|
|
|
34
46
|
alignItems = 'center',
|
|
35
47
|
button = false,
|
|
36
48
|
children,
|
|
49
|
+
description,
|
|
37
50
|
disabled = false,
|
|
38
51
|
onPress,
|
|
39
52
|
style,
|
|
40
53
|
...otherProps
|
|
41
54
|
} = props;
|
|
55
|
+
const theme = (0, _styles2.useTheme)();
|
|
42
56
|
const styles = useStyles();
|
|
43
57
|
const rootComponentProps = {
|
|
44
58
|
accessibilityRole: _reactNative.Platform.OS === 'web' ? 'listitem' : undefined,
|
|
45
59
|
...otherProps
|
|
46
60
|
};
|
|
47
|
-
const
|
|
48
|
-
|
|
49
|
-
|
|
61
|
+
const contentWrapperStyle = (0, _styles2.css)([styles.content, style]);
|
|
62
|
+
const descriptionFontStyle = (0, _styles2.createFontStyle)(theme, {
|
|
63
|
+
selector: _ => (0, _styles.typographyOf)({
|
|
64
|
+
fontSize: 13,
|
|
65
|
+
lineHeight: 18.2,
|
|
66
|
+
fontFamily: 'PretendardStd-Regular',
|
|
67
|
+
letterSpacing: 0
|
|
68
|
+
}),
|
|
69
|
+
color: theme.palette.text.base
|
|
70
|
+
});
|
|
50
71
|
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
disabled: disabled,
|
|
57
|
-
onPress: onPress,
|
|
58
|
-
style: rootStyle
|
|
59
|
-
}, children))
|
|
60
|
-
);
|
|
61
|
-
}
|
|
72
|
+
const content = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Row.default, {
|
|
73
|
+
alignItems: alignItems
|
|
74
|
+
}, children), description ? /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
|
|
75
|
+
style: (0, _styles2.css)([styles.description, descriptionFontStyle])
|
|
76
|
+
}, description) : null);
|
|
62
77
|
|
|
63
78
|
return (
|
|
64
79
|
/*#__PURE__*/
|
|
65
80
|
// @ts-ignore
|
|
66
|
-
_react.default.createElement(_reactNative.View,
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
81
|
+
_react.default.createElement(_reactNative.View, rootComponentProps, button ? /*#__PURE__*/_react.default.createElement(_ButtonBase.default, {
|
|
82
|
+
disabled: disabled,
|
|
83
|
+
onPress: onPress,
|
|
84
|
+
style: contentWrapperStyle
|
|
85
|
+
}, content) : /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
86
|
+
style: contentWrapperStyle
|
|
87
|
+
}, content), /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
88
|
+
style: styles.dividerWrapper
|
|
89
|
+
}, /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
90
|
+
style: styles.divider
|
|
91
|
+
})))
|
|
70
92
|
);
|
|
71
93
|
}
|
|
72
94
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useStyles","theme","useTheme","
|
|
1
|
+
{"version":3,"names":["useStyles","theme","useTheme","content","gap","spacing","paddingVertical","paddingHorizontal","width","description","paddingRight","divider","borderBottomColor","palette","border","weak","borderBottomWidth","dividerWrapper","ListItem","props","alignItems","button","children","disabled","onPress","style","otherProps","styles","rootComponentProps","accessibilityRole","Platform","OS","undefined","contentWrapperStyle","css","descriptionFontStyle","createFontStyle","selector","_","typographyOf","fontSize","lineHeight","fontFamily","letterSpacing","color","text","base"],"sources":["ListItem.tsx"],"sourcesContent":["import React from 'react';\nimport type { FlexStyle } from 'react-native';\nimport { Platform, Text, View } from 'react-native';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { typographyOf } from '@fountain-ui/styles';\nimport ButtonBase from '../ButtonBase';\nimport Row from '../Row';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport type ListItemProps from './ListItemProps';\n\ntype ListItemStyles = NamedStylesStringUnion<'content' | 'description' | 'divider' | 'dividerWrapper'>;\n\nconst useStyles: UseStyles<ListItemStyles> = function (): ListItemStyles {\n const theme = useTheme();\n\n return {\n content: {\n gap: theme.spacing(2),\n paddingVertical: theme.spacing(3.75),\n paddingHorizontal: theme.spacing(4),\n width: '100%',\n },\n description: {\n paddingRight: theme.spacing(20),\n },\n divider: {\n borderBottomColor: theme.palette.border.weak,\n borderBottomWidth: 0.5,\n },\n dividerWrapper: {\n paddingHorizontal: theme.spacing(4),\n },\n };\n};\n\nexport default function ListItem(props: ListItemProps) {\n const {\n alignItems = 'center' as FlexStyle['alignItems'],\n button = false,\n children,\n description,\n disabled = false,\n onPress,\n style,\n ...otherProps\n } = props;\n\n const theme = useTheme();\n\n const styles = useStyles();\n\n const rootComponentProps = {\n accessibilityRole: Platform.OS === 'web' ? 'listitem' : undefined,\n ...otherProps,\n };\n\n const contentWrapperStyle = css([\n styles.content,\n style,\n ]);\n\n const descriptionFontStyle = createFontStyle(theme, {\n selector: (_) => typographyOf({\n fontSize: 13,\n lineHeight: 18.2,\n fontFamily: 'PretendardStd-Regular',\n letterSpacing: 0,\n }),\n color: theme.palette.text.base,\n });\n\n const content = (\n <React.Fragment>\n <Row alignItems={alignItems}>\n {children}\n </Row>\n\n {description ? (\n <Text style={css([\n styles.description,\n descriptionFontStyle,\n ])}>\n {description}\n </Text>\n ) : null}\n </React.Fragment>\n );\n\n return (\n // @ts-ignore\n <View {...rootComponentProps}>\n {button ? (\n <ButtonBase\n disabled={disabled}\n onPress={onPress}\n style={contentWrapperStyle}\n >\n {content}\n </ButtonBase>\n ) : (\n <View style={contentWrapperStyle}>\n {content}\n </View>\n )}\n\n <View style={styles.dividerWrapper}>\n <View style={styles.divider}/>\n </View>\n </View>\n );\n};\n"],"mappings":";;;;;;;AAAA;;AAEA;;AAEA;;AACA;;AACA;;AACA;;;;AAKA,MAAMA,SAAoC,GAAG,YAA4B;EACrE,MAAMC,KAAK,GAAG,IAAAC,iBAAA,GAAd;EAEA,OAAO;IACHC,OAAO,EAAE;MACLC,GAAG,EAAEH,KAAK,CAACI,OAAN,CAAc,CAAd,CADA;MAELC,eAAe,EAAEL,KAAK,CAACI,OAAN,CAAc,IAAd,CAFZ;MAGLE,iBAAiB,EAAEN,KAAK,CAACI,OAAN,CAAc,CAAd,CAHd;MAILG,KAAK,EAAE;IAJF,CADN;IAOHC,WAAW,EAAE;MACTC,YAAY,EAAET,KAAK,CAACI,OAAN,CAAc,EAAd;IADL,CAPV;IAUHM,OAAO,EAAE;MACLC,iBAAiB,EAAEX,KAAK,CAACY,OAAN,CAAcC,MAAd,CAAqBC,IADnC;MAELC,iBAAiB,EAAE;IAFd,CAVN;IAcHC,cAAc,EAAE;MACZV,iBAAiB,EAAEN,KAAK,CAACI,OAAN,CAAc,CAAd;IADP;EAdb,CAAP;AAkBH,CArBD;;AAuBe,SAASa,QAAT,CAAkBC,KAAlB,EAAwC;EACnD,MAAM;IACFC,UAAU,GAAG,QADX;IAEFC,MAAM,GAAG,KAFP;IAGFC,QAHE;IAIFb,WAJE;IAKFc,QAAQ,GAAG,KALT;IAMFC,OANE;IAOFC,KAPE;IAQF,GAAGC;EARD,IASFP,KATJ;EAWA,MAAMlB,KAAK,GAAG,IAAAC,iBAAA,GAAd;EAEA,MAAMyB,MAAM,GAAG3B,SAAS,EAAxB;EAEA,MAAM4B,kBAAkB,GAAG;IACvBC,iBAAiB,EAAEC,qBAAA,CAASC,EAAT,KAAgB,KAAhB,GAAwB,UAAxB,GAAqCC,SADjC;IAEvB,GAAGN;EAFoB,CAA3B;EAKA,MAAMO,mBAAmB,GAAG,IAAAC,YAAA,EAAI,CAC5BP,MAAM,CAACxB,OADqB,EAE5BsB,KAF4B,CAAJ,CAA5B;EAKA,MAAMU,oBAAoB,GAAG,IAAAC,wBAAA,EAAgBnC,KAAhB,EAAuB;IAChDoC,QAAQ,EAAGC,CAAD,IAAO,IAAAC,oBAAA,EAAa;MAC1BC,QAAQ,EAAE,EADgB;MAE1BC,UAAU,EAAE,IAFc;MAG1BC,UAAU,EAAE,uBAHc;MAI1BC,aAAa,EAAE;IAJW,CAAb,CAD+B;IAOhDC,KAAK,EAAE3C,KAAK,CAACY,OAAN,CAAcgC,IAAd,CAAmBC;EAPsB,CAAvB,CAA7B;;EAUA,MAAM3C,OAAO,gBACT,6BAAC,cAAD,CAAO,QAAP,qBACI,6BAAC,YAAD;IAAK,UAAU,EAAEiB;EAAjB,GACKE,QADL,CADJ,EAKKb,WAAW,gBACR,6BAAC,iBAAD;IAAM,KAAK,EAAE,IAAAyB,YAAA,EAAI,CACbP,MAAM,CAAClB,WADM,EAEb0B,oBAFa,CAAJ;EAAb,GAIK1B,WAJL,CADQ,GAOR,IAZR,CADJ;;EAiBA;IAAA;IACI;IACA,6BAAC,iBAAD,EAAUmB,kBAAV,EACKP,MAAM,gBACH,6BAAC,mBAAD;MACI,QAAQ,EAAEE,QADd;MAEI,OAAO,EAAEC,OAFb;MAGI,KAAK,EAAES;IAHX,GAKK9B,OALL,CADG,gBASH,6BAAC,iBAAD;MAAM,KAAK,EAAE8B;IAAb,GACK9B,OADL,CAVR,eAeI,6BAAC,iBAAD;MAAM,KAAK,EAAEwB,MAAM,CAACV;IAApB,gBACI,6BAAC,iBAAD;MAAM,KAAK,EAAEU,MAAM,CAAChB;IAApB,EADJ,CAfJ;EAFJ;AAsBH;;AAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sources":["ListItemProps.ts"],"sourcesContent":["import React from 'react';\nimport type { FlexStyle, ViewProps } from 'react-native';\nimport type { ButtonBaseProps } from '../ButtonBase';\nimport type { OverridableComponentProps } from '../types';\n\nexport default interface ListItemProps extends OverridableComponentProps<React.PropsWithChildren<ViewProps>, {\n /**\n * Aligns children vertical direction.\n * @default 'center'\n */\n alignItems?: FlexStyle['alignItems'];\n\n /**\n * If `true`, the list item is a button (using `ButtonBase`).\n * @default false\n */\n button?: boolean;\n\n /**\n * Whether to prevent interaction with the ButtonBase.\n * @default false\n */\n disabled?: ButtonBaseProps['disabled'];\n\n /**\n * Function to execute on press. If not set, will cause the ButtonBase to be disabled.\n */\n onPress?: ButtonBaseProps['onPress'];\n}> {}\n"],"mappings":""}
|
|
1
|
+
{"version":3,"names":[],"sources":["ListItemProps.ts"],"sourcesContent":["import React from 'react';\nimport type { FlexStyle, ViewProps } from 'react-native';\nimport type { ButtonBaseProps } from '../ButtonBase';\nimport type { OverridableComponentProps } from '../types';\n\nexport default interface ListItemProps extends OverridableComponentProps<React.PropsWithChildren<ViewProps>, {\n /**\n * Aligns children vertical direction.\n * @default 'center'\n */\n alignItems?: FlexStyle['alignItems'];\n\n /**\n * If `true`, the list item is a button (using `ButtonBase`).\n * @default false\n */\n button?: boolean;\n\n /**\n * Displays a description in this item.\n */\n description?: string;\n\n /**\n * Whether to prevent interaction with the ButtonBase.\n * @default false\n */\n disabled?: ButtonBaseProps['disabled'];\n\n /**\n * Function to execute on press. If not set, will cause the ButtonBase to be disabled.\n */\n onPress?: ButtonBaseProps['onPress'];\n}> {}\n"],"mappings":""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useStyles","theme","useTheme","root","marginRight","spacing","
|
|
1
|
+
{"version":3,"names":["useStyles","theme","useTheme","root","marginRight","spacing","flexShrink","ListItemIcon","props","style","otherProps","styles","css"],"sources":["ListItemIcon.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { css, useTheme } from '../styles';\nimport type ListItemIconProps from './ListItemIconProps';\n\ntype ListItemIconStyles = NamedStylesStringUnion<'root'>;\n\nconst useStyles: UseStyles<ListItemIconStyles> = function (): ListItemIconStyles {\n const theme = useTheme();\n\n return {\n root: {\n marginRight: theme.spacing(3),\n flexShrink: 0,\n },\n };\n};\n\nexport default function ListItemIcon(props: ListItemIconProps) {\n const {\n style,\n ...otherProps\n } = props;\n\n const styles = useStyles();\n\n return (\n <View\n style={css([\n styles.root,\n style,\n ])}\n {...otherProps}\n />\n );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;;;;;AAKA,MAAMA,SAAwC,GAAG,YAAgC;EAC7E,MAAMC,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,OAAO;IACHC,IAAI,EAAE;MACFC,WAAW,EAAEH,KAAK,CAACI,OAAN,CAAc,CAAd,CADX;MAEFC,UAAU,EAAE;IAFV;EADH,CAAP;AAMH,CATD;;AAWe,SAASC,YAAT,CAAsBC,KAAtB,EAAgD;EAC3D,MAAM;IACFC,KADE;IAEF,GAAGC;EAFD,IAGFF,KAHJ;EAKA,MAAMG,MAAM,GAAGX,SAAS,EAAxB;EAEA,oBACI,6BAAC,iBAAD;IACI,KAAK,EAAE,IAAAY,WAAA,EAAI,CACPD,MAAM,CAACR,IADA,EAEPM,KAFO,CAAJ;EADX,GAKQC,UALR,EADJ;AASH;;AAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useStyles","root","flexShrink","marginLeft","ListItemSecondaryAction","props","style","otherProps","styles","css"],"sources":["ListItemSecondaryAction.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { css } from '../styles';\nimport ListItemSecondaryActionProps from './ListItemSecondaryActionProps';\n\ntype ListItemSecondaryActionStyles = NamedStylesStringUnion<'root'>;\n\nconst useStyles: UseStyles<ListItemSecondaryActionStyles> = function (): ListItemSecondaryActionStyles {\n return {\n root: {\n flexShrink: 0,\n marginLeft: 'auto',\n },\n };\n};\n\nexport default function ListItemSecondaryAction(props: ListItemSecondaryActionProps) {\n const {\n style,\n ...otherProps\n } = props;\n\n const styles = useStyles();\n\n return (\n <View\n style={css([\n styles.root,\n style,\n ])}\n {...otherProps}\n />\n );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;;;;;AAKA,MAAMA,SAAmD,GAAG,YAA2C;EACnG,OAAO;IACHC,IAAI,EAAE;MACFC,UAAU,EAAE,
|
|
1
|
+
{"version":3,"names":["useStyles","root","alignItems","flexDirection","flexShrink","marginLeft","ListItemSecondaryAction","props","style","otherProps","styles","css"],"sources":["ListItemSecondaryAction.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\nimport { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { css } from '../styles';\nimport ListItemSecondaryActionProps from './ListItemSecondaryActionProps';\n\ntype ListItemSecondaryActionStyles = NamedStylesStringUnion<'root'>;\n\nconst useStyles: UseStyles<ListItemSecondaryActionStyles> = function (): ListItemSecondaryActionStyles {\n return {\n root: {\n alignItems: 'center',\n flexDirection: 'row',\n flexShrink: 0,\n marginLeft: 'auto',\n },\n };\n};\n\nexport default function ListItemSecondaryAction(props: ListItemSecondaryActionProps) {\n const {\n style,\n ...otherProps\n } = props;\n\n const styles = useStyles();\n\n return (\n <View\n style={css([\n styles.root,\n style,\n ])}\n {...otherProps}\n />\n );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;;;;;AAKA,MAAMA,SAAmD,GAAG,YAA2C;EACnG,OAAO;IACHC,IAAI,EAAE;MACFC,UAAU,EAAE,QADV;MAEFC,aAAa,EAAE,KAFb;MAGFC,UAAU,EAAE,CAHV;MAIFC,UAAU,EAAE;IAJV;EADH,CAAP;AAQH,CATD;;AAWe,SAASC,uBAAT,CAAiCC,KAAjC,EAAsE;EACjF,MAAM;IACFC,KADE;IAEF,GAAGC;EAFD,IAGFF,KAHJ;EAKA,MAAMG,MAAM,GAAGV,SAAS,EAAxB;EAEA,oBACI,6BAAC,iBAAD;IACI,KAAK,EAAE,IAAAW,WAAA,EAAI,CACPD,MAAM,CAACT,IADA,EAEPO,KAFO,CAAJ;EADX,GAKQC,UALR,EADJ;AASH;;AAAA"}
|
|
@@ -7,50 +7,49 @@ exports.default = ListItemText;
|
|
|
7
7
|
|
|
8
8
|
var _react = _interopRequireDefault(require("react"));
|
|
9
9
|
|
|
10
|
-
var
|
|
10
|
+
var _reactNative = require("react-native");
|
|
11
|
+
|
|
12
|
+
var _styles = require("@fountain-ui/styles");
|
|
11
13
|
|
|
12
|
-
var
|
|
14
|
+
var _Column = _interopRequireDefault(require("../Column"));
|
|
13
15
|
|
|
14
|
-
var
|
|
16
|
+
var _styles2 = require("../styles");
|
|
15
17
|
|
|
16
18
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
17
19
|
|
|
18
20
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
19
21
|
|
|
20
22
|
const useStyles = function () {
|
|
21
|
-
const theme = (0, _styles.useTheme)();
|
|
22
23
|
return {
|
|
23
24
|
root: {
|
|
24
25
|
flexGrow: 1,
|
|
25
26
|
flexShrink: 1
|
|
26
|
-
},
|
|
27
|
-
multiline: {
|
|
28
|
-
marginBottom: theme.spacing(1)
|
|
29
27
|
}
|
|
30
28
|
};
|
|
31
29
|
};
|
|
32
30
|
|
|
33
31
|
function ListItemText(props) {
|
|
34
32
|
const {
|
|
35
|
-
|
|
36
|
-
secondary,
|
|
33
|
+
children,
|
|
37
34
|
style,
|
|
38
35
|
...otherProps
|
|
39
36
|
} = props;
|
|
37
|
+
const theme = (0, _styles2.useTheme)();
|
|
40
38
|
const styles = useStyles();
|
|
41
|
-
const
|
|
39
|
+
const fontStyle = (0, _styles2.createFontStyle)(theme, {
|
|
40
|
+
selector: _ => (0, _styles.typographyOf)({
|
|
41
|
+
fontSize: 15,
|
|
42
|
+
lineHeight: 18,
|
|
43
|
+
fontFamily: 'PretendardStd-Medium',
|
|
44
|
+
letterSpacing: 0
|
|
45
|
+
}),
|
|
46
|
+
color: theme.palette.text.strong
|
|
47
|
+
});
|
|
42
48
|
return /*#__PURE__*/_react.default.createElement(_Column.default, _extends({
|
|
43
|
-
style: (0,
|
|
44
|
-
}, otherProps),
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
variant: 'body3',
|
|
48
|
-
style: isMultiline ? styles.multiline : undefined
|
|
49
|
-
}) : null, secondary ? /*#__PURE__*/_react.default.createElement(_Typography.default, {
|
|
50
|
-
children: secondary,
|
|
51
|
-
color: 'strong',
|
|
52
|
-
variant: 'body3'
|
|
53
|
-
}) : null);
|
|
49
|
+
style: (0, _styles2.css)([styles.root, style])
|
|
50
|
+
}, otherProps), /*#__PURE__*/_react.default.createElement(_reactNative.Text, {
|
|
51
|
+
style: fontStyle
|
|
52
|
+
}, children));
|
|
54
53
|
}
|
|
55
54
|
|
|
56
55
|
;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useStyles","theme","useTheme","
|
|
1
|
+
{"version":3,"names":["useStyles","root","flexGrow","flexShrink","ListItemText","props","children","style","otherProps","theme","useTheme","styles","fontStyle","createFontStyle","selector","_","typographyOf","fontSize","lineHeight","fontFamily","letterSpacing","color","palette","text","strong","css"],"sources":["ListItemText.tsx"],"sourcesContent":["import React from 'react';\nimport { Text } from 'react-native';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { typographyOf } from '@fountain-ui/styles';\nimport Column from '../Column';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport type ListItemTextProps from './ListItemTextProps';\n\ntype ListItemTextStyles = NamedStylesStringUnion<'root'>;\n\nconst useStyles: UseStyles<ListItemTextStyles> = function (): ListItemTextStyles {\n return {\n root: {\n flexGrow: 1,\n flexShrink: 1,\n },\n };\n};\n\nexport default function ListItemText(props: ListItemTextProps) {\n const {\n children,\n style,\n ...otherProps\n } = props;\n\n const theme = useTheme();\n\n const styles = useStyles();\n\n const fontStyle = createFontStyle(theme, {\n selector: (_) => typographyOf({\n fontSize: 15,\n lineHeight: 18,\n fontFamily: 'PretendardStd-Medium',\n letterSpacing: 0,\n }),\n color: theme.palette.text.strong,\n });\n\n return (\n <Column\n style={css([\n styles.root,\n style,\n ])}\n {...otherProps}\n >\n <Text style={fontStyle}>\n {children}\n </Text>\n </Column>\n );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;;;;;AAKA,MAAMA,SAAwC,GAAG,YAAgC;EAC7E,OAAO;IACHC,IAAI,EAAE;MACFC,QAAQ,EAAE,CADR;MAEFC,UAAU,EAAE;IAFV;EADH,CAAP;AAMH,CAPD;;AASe,SAASC,YAAT,CAAsBC,KAAtB,EAAgD;EAC3D,MAAM;IACFC,QADE;IAEFC,KAFE;IAGF,GAAGC;EAHD,IAIFH,KAJJ;EAMA,MAAMI,KAAK,GAAG,IAAAC,iBAAA,GAAd;EAEA,MAAMC,MAAM,GAAGX,SAAS,EAAxB;EAEA,MAAMY,SAAS,GAAG,IAAAC,wBAAA,EAAgBJ,KAAhB,EAAuB;IACrCK,QAAQ,EAAGC,CAAD,IAAO,IAAAC,oBAAA,EAAa;MAC1BC,QAAQ,EAAE,EADgB;MAE1BC,UAAU,EAAE,EAFc;MAG1BC,UAAU,EAAE,sBAHc;MAI1BC,aAAa,EAAE;IAJW,CAAb,CADoB;IAOrCC,KAAK,EAAEZ,KAAK,CAACa,OAAN,CAAcC,IAAd,CAAmBC;EAPW,CAAvB,CAAlB;EAUA,oBACI,6BAAC,eAAD;IACI,KAAK,EAAE,IAAAC,YAAA,EAAI,CACPd,MAAM,CAACV,IADA,EAEPM,KAFO,CAAJ;EADX,GAKQC,UALR,gBAOI,6BAAC,iBAAD;IAAM,KAAK,EAAEI;EAAb,GACKN,QADL,CAPJ,CADJ;AAaH;;AAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sources":["ListItemTextProps.ts"],"sourcesContent":["import type {
|
|
1
|
+
{"version":3,"names":[],"sources":["ListItemTextProps.ts"],"sourcesContent":["import type { OverridableComponentProps } from '../types';\nimport type { ColumnProps } from '../Column';\n\nexport default interface ListItemTextProps extends OverridableComponentProps<ColumnProps, {\n /**\n * The main content element.\n */\n children: string;\n}> {}\n"],"mappings":""}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = Section;
|
|
7
|
+
|
|
8
|
+
var _react = _interopRequireDefault(require("react"));
|
|
9
|
+
|
|
10
|
+
var _reactNative = require("react-native");
|
|
11
|
+
|
|
12
|
+
var _hooks = require("../hooks");
|
|
13
|
+
|
|
14
|
+
var _styles = require("../styles");
|
|
15
|
+
|
|
16
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
17
|
+
|
|
18
|
+
function Section(props) {
|
|
19
|
+
const {
|
|
20
|
+
children,
|
|
21
|
+
maxWidth,
|
|
22
|
+
style: styleProp
|
|
23
|
+
} = props;
|
|
24
|
+
const styles = (0, _hooks.useContentContainerStyle)({
|
|
25
|
+
maxWidth
|
|
26
|
+
});
|
|
27
|
+
const rootStyle = (0, _styles.css)([styles, styleProp]);
|
|
28
|
+
return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
|
|
29
|
+
style: rootStyle
|
|
30
|
+
}, children);
|
|
31
|
+
}
|
|
32
|
+
//# sourceMappingURL=Section.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["Section","props","children","maxWidth","style","styleProp","styles","useContentContainerStyle","rootStyle","css"],"sources":["Section.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\nimport { useContentContainerStyle } from '../hooks';\nimport { css } from '../styles';\nimport type SectionProps from './SectionProps';\n\nexport default function Section(props: SectionProps) {\n const {\n children,\n maxWidth,\n style: styleProp,\n } = props;\n\n const styles = useContentContainerStyle({ maxWidth });\n\n const rootStyle = css([\n styles,\n styleProp,\n ]);\n\n return (\n <View style={rootStyle}>\n {children}\n </View>\n );\n}\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;;;AAGe,SAASA,OAAT,CAAiBC,KAAjB,EAAsC;EACjD,MAAM;IACFC,QADE;IAEFC,QAFE;IAGFC,KAAK,EAAEC;EAHL,IAIFJ,KAJJ;EAMA,MAAMK,MAAM,GAAG,IAAAC,+BAAA,EAAyB;IAAEJ;EAAF,CAAzB,CAAf;EAEA,MAAMK,SAAS,GAAG,IAAAC,WAAA,EAAI,CAClBH,MADkB,EAElBD,SAFkB,CAAJ,CAAlB;EAKA,oBACI,6BAAC,iBAAD;IAAM,KAAK,EAAEG;EAAb,GACKN,QADL,CADJ;AAKH"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":[],"sources":["SectionProps.ts"],"sourcesContent":["import type { ViewProps } from 'react-native';\nimport type { OverridableComponentProps } from '../types';\n\nexport default interface SectionProps extends OverridableComponentProps<ViewProps, {\n maxWidth?: number;\n}> {}\n"],"mappings":""}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
Object.defineProperty(exports, "default", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function () {
|
|
9
|
+
return _Section.default;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
|
|
13
|
+
var _Section = _interopRequireDefault(require("./Section"));
|
|
14
|
+
|
|
15
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
16
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default } from './Section';\nexport type { default as SectionProps } from './SectionProps';\n"],"mappings":";;;;;;;;;;;;AAAA"}
|
|
@@ -29,6 +29,8 @@ function ShadowView(props) {
|
|
|
29
29
|
const {
|
|
30
30
|
borderRadius,
|
|
31
31
|
height,
|
|
32
|
+
maxHeight,
|
|
33
|
+
maxWidth,
|
|
32
34
|
width
|
|
33
35
|
} = styleProp;
|
|
34
36
|
return nativeShadows.reduce((accumulator, nativeShadow) => {
|
|
@@ -37,6 +39,8 @@ function ShadowView(props) {
|
|
|
37
39
|
}, {
|
|
38
40
|
borderRadius: borderRadius ?? 0,
|
|
39
41
|
height,
|
|
42
|
+
maxHeight,
|
|
43
|
+
maxWidth,
|
|
40
44
|
width
|
|
41
45
|
}])
|
|
42
46
|
}, accumulator);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["ShadowView","props","children","style","styleProp","variant","otherProps","theme","useTheme","nativeShadows","shadow","borderRadius","height","width","reduce","accumulator","nativeShadow","css"],"sources":["ShadowView.native.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\nimport type { FountainUiStyle, ShadowVariant } from '@fountain-ui/styles';\nimport { css, useTheme } from '../styles';\nimport type ShadowViewProps from './ShadowViewProps';\n\nexport default function ShadowView(props: ShadowViewProps) {\n const {\n children,\n style: styleProp = {},\n variant = 100 as ShadowVariant,\n ...otherProps\n } = props;\n\n const theme = useTheme();\n\n const { nativeShadows } = theme.shadow[variant];\n\n const {\n borderRadius,\n height,\n width,\n } = styleProp as FountainUiStyle;\n\n return nativeShadows.reduce((accumulator, nativeShadow) => {\n return (\n <View\n style={css([\n { ...nativeShadow },\n {\n borderRadius: borderRadius ?? 0,\n height,\n width,\n },\n ])}\n >\n {accumulator}\n </View>\n );\n }, (\n <View\n style={styleProp}\n {...otherProps}\n >\n {children}\n </View>\n ));\n}\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;;;;;AAGe,SAASA,UAAT,CAAoBC,KAApB,EAA4C;EACvD,MAAM;IACFC,QADE;IAEFC,KAAK,EAAEC,SAAS,GAAG,EAFjB;IAGFC,OAAO,GAAG,GAHR;IAIF,GAAGC;EAJD,IAKFL,KALJ;EAOA,MAAMM,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,MAAM;IAAEC;EAAF,IAAoBF,KAAK,CAACG,MAAN,CAAaL,OAAb,CAA1B;EAEA,MAAM;IACFM,YADE;IAEFC,MAFE;IAGFC;
|
|
1
|
+
{"version":3,"names":["ShadowView","props","children","style","styleProp","variant","otherProps","theme","useTheme","nativeShadows","shadow","borderRadius","height","maxHeight","maxWidth","width","reduce","accumulator","nativeShadow","css"],"sources":["ShadowView.native.tsx"],"sourcesContent":["import React from 'react';\nimport { View } from 'react-native';\nimport type { FountainUiStyle, ShadowVariant } from '@fountain-ui/styles';\nimport { css, useTheme } from '../styles';\nimport type ShadowViewProps from './ShadowViewProps';\n\nexport default function ShadowView(props: ShadowViewProps) {\n const {\n children,\n style: styleProp = {},\n variant = 100 as ShadowVariant,\n ...otherProps\n } = props;\n\n const theme = useTheme();\n\n const { nativeShadows } = theme.shadow[variant];\n\n const {\n borderRadius,\n height,\n maxHeight,\n maxWidth,\n width,\n } = styleProp as FountainUiStyle;\n\n return nativeShadows.reduce((accumulator, nativeShadow) => {\n return (\n <View\n style={css([\n { ...nativeShadow },\n {\n borderRadius: borderRadius ?? 0,\n height,\n maxHeight,\n maxWidth,\n width,\n },\n ])}\n >\n {accumulator}\n </View>\n );\n }, (\n <View\n style={styleProp}\n {...otherProps}\n >\n {children}\n </View>\n ));\n}\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;;;;;AAGe,SAASA,UAAT,CAAoBC,KAApB,EAA4C;EACvD,MAAM;IACFC,QADE;IAEFC,KAAK,EAAEC,SAAS,GAAG,EAFjB;IAGFC,OAAO,GAAG,GAHR;IAIF,GAAGC;EAJD,IAKFL,KALJ;EAOA,MAAMM,KAAK,GAAG,IAAAC,gBAAA,GAAd;EAEA,MAAM;IAAEC;EAAF,IAAoBF,KAAK,CAACG,MAAN,CAAaL,OAAb,CAA1B;EAEA,MAAM;IACFM,YADE;IAEFC,MAFE;IAGFC,SAHE;IAIFC,QAJE;IAKFC;EALE,IAMFX,SANJ;EAQA,OAAOK,aAAa,CAACO,MAAd,CAAqB,CAACC,WAAD,EAAcC,YAAd,KAA+B;IACvD,oBACI,6BAAC,iBAAD;MACI,KAAK,EAAE,IAAAC,WAAA,EAAI,CACP,EAAE,GAAGD;MAAL,CADO,EAEP;QACIP,YAAY,EAAEA,YAAY,IAAI,CADlC;QAEIC,MAFJ;QAGIC,SAHJ;QAIIC,QAJJ;QAKIC;MALJ,CAFO,CAAJ;IADX,GAYKE,WAZL,CADJ;EAgBH,CAjBM,eAkBH,6BAAC,iBAAD;IACI,KAAK,EAAEb;EADX,GAEQE,UAFR,GAIKJ,QAJL,CAlBG,CAAP;AAyBH"}
|
|
@@ -64,7 +64,7 @@ function SnackbarContent(props) {
|
|
|
64
64
|
selector: _ => (0, _styles.typographyOf)({
|
|
65
65
|
fontSize: 14,
|
|
66
66
|
lineHeight: 18.2,
|
|
67
|
-
fontFamily: '
|
|
67
|
+
fontFamily: 'PretendardStd-SemiBold',
|
|
68
68
|
letterSpacing: 0
|
|
69
69
|
}),
|
|
70
70
|
color: theme.palette.text.strongInverse
|
|
@@ -73,7 +73,7 @@ function SnackbarContent(props) {
|
|
|
73
73
|
selector: _ => (0, _styles.typographyOf)({
|
|
74
74
|
fontSize: 13,
|
|
75
75
|
lineHeight: 16.9,
|
|
76
|
-
fontFamily: '
|
|
76
|
+
fontFamily: 'PretendardStd-Regular',
|
|
77
77
|
letterSpacing: 0
|
|
78
78
|
}),
|
|
79
79
|
color: theme.palette.text.strongInverse
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useStyles","theme","useTheme","root","flexDirection","alignItems","alignSelf","backgroundColor","palette","surface","accent","borderRadius","maxWidth","paddingBottom","spacing","paddingHorizontal","paddingTop","actionButton","marginLeft","SnackbarContent","props","actionContent","message","title","onPress","style","styleProp","status","startIcon","otherProps","styles","titleFontStyle","createFontStyle","selector","_","typographyOf","fontSize","lineHeight","fontFamily","letterSpacing","color","text","strongInverse","messageFontStyle","labelFontStyle","hasActionButton","rootStyle","css","shape","radius","xl","undefined","width"],"sources":["SnackbarContent.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, View } from 'react-native';\nimport { typographyOf } from '@fountain-ui/styles';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport ButtonBase from '../ButtonBase/ButtonBase';\nimport Column from '../Column';\nimport Spacer from '../Spacer';\nimport Typography from '../Typography';\nimport type SnackbarContentProps from './SnackbarContentProps';\nimport StatusIcon from './StatusIcon';\n\ntype SnackBarContentStyles = NamedStylesStringUnion<'root' | 'actionButton'>;\n\nconst useStyles: UseStyles<SnackBarContentStyles> = function (): SnackBarContentStyles {\n const theme = useTheme();\n\n return {\n root: {\n flexDirection: 'row',\n alignItems: 'center',\n alignSelf: 'center',\n backgroundColor: theme.palette.surface.accent,\n borderRadius: 22,\n maxWidth: 400,\n paddingBottom: theme.spacing(2.25),\n paddingHorizontal: theme.spacing(4),\n paddingTop: theme.spacing(2),\n },\n actionButton: {\n marginLeft: theme.spacing(6),\n },\n };\n};\n\nexport default function SnackbarContent(props: SnackbarContentProps) {\n const {\n actionContent,\n message,\n title,\n onPress,\n style: styleProp,\n status = 'info',\n startIcon,\n ...otherProps\n } = props;\n\n const styles = useStyles();\n\n const theme = useTheme();\n\n const titleFontStyle = createFontStyle(theme, {\n selector: (_) => typographyOf({\n fontSize: 14,\n lineHeight: 18.2,\n fontFamily: '
|
|
1
|
+
{"version":3,"names":["useStyles","theme","useTheme","root","flexDirection","alignItems","alignSelf","backgroundColor","palette","surface","accent","borderRadius","maxWidth","paddingBottom","spacing","paddingHorizontal","paddingTop","actionButton","marginLeft","SnackbarContent","props","actionContent","message","title","onPress","style","styleProp","status","startIcon","otherProps","styles","titleFontStyle","createFontStyle","selector","_","typographyOf","fontSize","lineHeight","fontFamily","letterSpacing","color","text","strongInverse","messageFontStyle","labelFontStyle","hasActionButton","rootStyle","css","shape","radius","xl","undefined","width"],"sources":["SnackbarContent.tsx"],"sourcesContent":["import React from 'react';\nimport { Text, View } from 'react-native';\nimport { typographyOf } from '@fountain-ui/styles';\nimport type { NamedStylesStringUnion, UseStyles } from '@fountain-ui/styles';\nimport { createFontStyle, css, useTheme } from '../styles';\nimport ButtonBase from '../ButtonBase/ButtonBase';\nimport Column from '../Column';\nimport Spacer from '../Spacer';\nimport Typography from '../Typography';\nimport type SnackbarContentProps from './SnackbarContentProps';\nimport StatusIcon from './StatusIcon';\n\ntype SnackBarContentStyles = NamedStylesStringUnion<'root' | 'actionButton'>;\n\nconst useStyles: UseStyles<SnackBarContentStyles> = function (): SnackBarContentStyles {\n const theme = useTheme();\n\n return {\n root: {\n flexDirection: 'row',\n alignItems: 'center',\n alignSelf: 'center',\n backgroundColor: theme.palette.surface.accent,\n borderRadius: 22,\n maxWidth: 400,\n paddingBottom: theme.spacing(2.25),\n paddingHorizontal: theme.spacing(4),\n paddingTop: theme.spacing(2),\n },\n actionButton: {\n marginLeft: theme.spacing(6),\n },\n };\n};\n\nexport default function SnackbarContent(props: SnackbarContentProps) {\n const {\n actionContent,\n message,\n title,\n onPress,\n style: styleProp,\n status = 'info',\n startIcon,\n ...otherProps\n } = props;\n\n const styles = useStyles();\n\n const theme = useTheme();\n\n const titleFontStyle = createFontStyle(theme, {\n selector: (_) => typographyOf({\n fontSize: 14,\n lineHeight: 18.2,\n fontFamily: 'PretendardStd-SemiBold',\n letterSpacing: 0,\n }),\n color: theme.palette.text.strongInverse,\n });\n\n const messageFontStyle = createFontStyle(theme, {\n selector: (_) => typographyOf({\n fontSize: 13,\n lineHeight: 16.9,\n fontFamily: 'PretendardStd-Regular',\n letterSpacing: 0,\n }),\n color: theme.palette.text.strongInverse,\n });\n\n const labelFontStyle = createFontStyle(theme, {\n selector: (_) => typographyOf({\n fontSize: 13,\n lineHeight: 16.25,\n fontFamily: 'LexendDeca-SemiBold',\n letterSpacing: -0.26,\n }),\n color: theme.palette.text.accent,\n });\n\n const hasActionButton = !!(actionContent && onPress);\n\n const rootStyle = css([\n styles.root,\n startIcon ? { borderRadius: theme.shape.radius.xl } : undefined,\n hasActionButton ? { width: '100%' } : undefined,\n styleProp,\n ]);\n\n return (\n <ButtonBase\n disabled={!onPress}\n onPress={onPress}\n style={rootStyle}\n {...otherProps}\n >\n {startIcon ? (\n <React.Fragment>\n {startIcon}\n\n <Spacer size={3}/>\n </React.Fragment>\n ) : status !== 'info' ? (\n <React.Fragment>\n <StatusIcon status={status}/>\n\n <Spacer size={1.5}/>\n </React.Fragment>\n ) : null}\n\n <Column>\n {title ? (\n <Typography\n children={title}\n style={css([titleFontStyle])}\n />\n ) : null}\n\n <Text\n children={message}\n style={css([messageFontStyle])}\n />\n </Column>\n\n {actionContent ? (\n <React.Fragment>\n <Spacer flex={1}/>\n\n <View style={styles.actionButton}>\n {typeof actionContent === 'string' ? (\n <Text\n children={actionContent}\n style={labelFontStyle}\n />\n ) : (actionContent)}\n </View>\n </React.Fragment>\n ) : null}\n </ButtonBase>\n );\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AACA;;AAEA;;;;;;AAIA,MAAMA,SAA2C,GAAG,YAAmC;EACnF,MAAMC,KAAK,GAAG,IAAAC,iBAAA,GAAd;EAEA,OAAO;IACHC,IAAI,EAAE;MACFC,aAAa,EAAE,KADb;MAEFC,UAAU,EAAE,QAFV;MAGFC,SAAS,EAAE,QAHT;MAIFC,eAAe,EAAEN,KAAK,CAACO,OAAN,CAAcC,OAAd,CAAsBC,MAJrC;MAKFC,YAAY,EAAE,EALZ;MAMFC,QAAQ,EAAE,GANR;MAOFC,aAAa,EAAEZ,KAAK,CAACa,OAAN,CAAc,IAAd,CAPb;MAQFC,iBAAiB,EAAEd,KAAK,CAACa,OAAN,CAAc,CAAd,CARjB;MASFE,UAAU,EAAEf,KAAK,CAACa,OAAN,CAAc,CAAd;IATV,CADH;IAYHG,YAAY,EAAE;MACVC,UAAU,EAAEjB,KAAK,CAACa,OAAN,CAAc,CAAd;IADF;EAZX,CAAP;AAgBH,CAnBD;;AAqBe,SAASK,eAAT,CAAyBC,KAAzB,EAAsD;EACjE,MAAM;IACFC,aADE;IAEFC,OAFE;IAGFC,KAHE;IAIFC,OAJE;IAKFC,KAAK,EAAEC,SALL;IAMFC,MAAM,GAAG,MANP;IAOFC,SAPE;IAQF,GAAGC;EARD,IASFT,KATJ;EAWA,MAAMU,MAAM,GAAG9B,SAAS,EAAxB;EAEA,MAAMC,KAAK,GAAG,IAAAC,iBAAA,GAAd;EAEA,MAAM6B,cAAc,GAAG,IAAAC,wBAAA,EAAgB/B,KAAhB,EAAuB;IAC1CgC,QAAQ,EAAGC,CAAD,IAAO,IAAAC,oBAAA,EAAa;MAC1BC,QAAQ,EAAE,EADgB;MAE1BC,UAAU,EAAE,IAFc;MAG1BC,UAAU,EAAE,wBAHc;MAI1BC,aAAa,EAAE;IAJW,CAAb,CADyB;IAO1CC,KAAK,EAAEvC,KAAK,CAACO,OAAN,CAAciC,IAAd,CAAmBC;EAPgB,CAAvB,CAAvB;EAUA,MAAMC,gBAAgB,GAAG,IAAAX,wBAAA,EAAgB/B,KAAhB,EAAuB;IAC5CgC,QAAQ,EAAGC,CAAD,IAAO,IAAAC,oBAAA,EAAa;MAC1BC,QAAQ,EAAE,EADgB;MAE1BC,UAAU,EAAE,IAFc;MAG1BC,UAAU,EAAE,uBAHc;MAI1BC,aAAa,EAAE;IAJW,CAAb,CAD2B;IAO5CC,KAAK,EAAEvC,KAAK,CAACO,OAAN,CAAciC,IAAd,CAAmBC;EAPkB,CAAvB,CAAzB;EAUA,MAAME,cAAc,GAAG,IAAAZ,wBAAA,EAAgB/B,KAAhB,EAAuB;IAC1CgC,QAAQ,EAAGC,CAAD,IAAO,IAAAC,oBAAA,EAAa;MAC1BC,QAAQ,EAAE,EADgB;MAE1BC,UAAU,EAAE,KAFc;MAG1BC,UAAU,EAAE,qBAHc;MAI1BC,aAAa,EAAE,CAAC;IAJU,CAAb,CADyB;IAO1CC,KAAK,EAAEvC,KAAK,CAACO,OAAN,CAAciC,IAAd,CAAmB/B;EAPgB,CAAvB,CAAvB;EAUA,MAAMmC,eAAe,GAAG,CAAC,EAAExB,aAAa,IAAIG,OAAnB,CAAzB;EAEA,MAAMsB,SAAS,GAAG,IAAAC,YAAA,EAAI,CAClBjB,MAAM,CAAC3B,IADW,EAElByB,SAAS,GAAG;IAAEjB,YAAY,EAAEV,KAAK,CAAC+C,KAAN,CAAYC,MAAZ,CAAmBC;EAAnC,CAAH,GAA6CC,SAFpC,EAGlBN,eAAe,GAAG;IAAEO,KAAK,EAAE;EAAT,CAAH,GAAuBD,SAHpB,EAIlBzB,SAJkB,CAAJ,CAAlB;EAOA,oBACI,6BAAC,mBAAD;IACI,QAAQ,EAAE,CAACF,OADf;IAEI,OAAO,EAAEA,OAFb;IAGI,KAAK,EAAEsB;EAHX,GAIQjB,UAJR,GAMKD,SAAS,gBACN,6BAAC,cAAD,CAAO,QAAP,QACKA,SADL,eAGI,6BAAC,eAAD;IAAQ,IAAI,EAAE;EAAd,EAHJ,CADM,GAMND,MAAM,KAAK,MAAX,gBACA,6BAAC,cAAD,CAAO,QAAP,qBACI,6BAAC,mBAAD;IAAY,MAAM,EAAEA;EAApB,EADJ,eAGI,6BAAC,eAAD;IAAQ,IAAI,EAAE;EAAd,EAHJ,CADA,GAMA,IAlBR,eAoBI,6BAAC,eAAD,QACKJ,KAAK,gBACF,6BAAC,mBAAD;IACI,QAAQ,EAAEA,KADd;IAEI,KAAK,EAAE,IAAAwB,YAAA,EAAI,CAAChB,cAAD,CAAJ;EAFX,EADE,GAKF,IANR,eAQI,6BAAC,iBAAD;IACI,QAAQ,EAAET,OADd;IAEI,KAAK,EAAE,IAAAyB,YAAA,EAAI,CAACJ,gBAAD,CAAJ;EAFX,EARJ,CApBJ,EAkCKtB,aAAa,gBACV,6BAAC,cAAD,CAAO,QAAP,qBACI,6BAAC,eAAD;IAAQ,IAAI,EAAE;EAAd,EADJ,eAGI,6BAAC,iBAAD;IAAM,KAAK,EAAES,MAAM,CAACb;EAApB,GACK,OAAOI,aAAP,KAAyB,QAAzB,gBACG,6BAAC,iBAAD;IACI,QAAQ,EAAEA,aADd;IAEI,KAAK,EAAEuB;EAFX,EADH,GAKIvB,aANT,CAHJ,CADU,GAaV,IA/CR,CADJ;AAmDH;;AAAA"}
|
|
@@ -31,7 +31,7 @@ function useVariantStyleMap(variant, selected) {
|
|
|
31
31
|
selector: _ => (0, _styles.typographyOf)({
|
|
32
32
|
fontSize: 14,
|
|
33
33
|
lineHeight: 18.2,
|
|
34
|
-
fontFamily: '
|
|
34
|
+
fontFamily: selected ? 'PretendardStd-SemiBold' : 'PretendardStd-Medium',
|
|
35
35
|
letterSpacing: 0
|
|
36
36
|
}),
|
|
37
37
|
color: selected ? theme.palette.text.strongInverse : theme.palette.text.strong
|
|
@@ -51,7 +51,7 @@ function useVariantStyleMap(variant, selected) {
|
|
|
51
51
|
selector: _ => (0, _styles.typographyOf)({
|
|
52
52
|
fontSize: 10,
|
|
53
53
|
lineHeight: 10,
|
|
54
|
-
fontFamily: '
|
|
54
|
+
fontFamily: 'PretendardStd-Medium',
|
|
55
55
|
letterSpacing: -0.1
|
|
56
56
|
}),
|
|
57
57
|
color: selected ? theme.palette.text.strong : theme.palette.text.base
|
|
@@ -68,7 +68,7 @@ function useVariantStyleMap(variant, selected) {
|
|
|
68
68
|
selector: _ => (0, _styles.typographyOf)({
|
|
69
69
|
fontSize: 15,
|
|
70
70
|
lineHeight: 18.75,
|
|
71
|
-
fontFamily: '
|
|
71
|
+
fontFamily: selected ? 'PretendardStd-SemiBold' : 'PretendardStd-Medium',
|
|
72
72
|
letterSpacing: 0
|
|
73
73
|
}),
|
|
74
74
|
color: selected ? theme.palette.text.strong : theme.palette.text.base
|