@draftbit/core 43.4.13 → 43.4.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- {"version":3,"sources":["RowHeadlineImageCaption.js"],"names":["RowHeadlineImageCaption","title","subtitle","caption","image","style","theme","colors","typography","React","createElement","Row","titleTypeStyle","headline6","titleColor","strong","subtitleTypeStyle","body2","subtitleColor","medium","right","Text","color","marginLeft"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;;;AACA,MAAMA,uBAAuB,GAAG,QAAgF;AAAA,MAA/E;AAAEC,IAAAA,KAAF;AAASC,IAAAA,QAAT;AAAmBC,IAAAA,OAAnB;AAA4BC,IAAAA,KAA5B;AAAmCC,IAAAA,KAAnC;AAA0CC,IAAAA,KAAK,EAAE;AAAEC,MAAAA,MAAF;AAAUC,MAAAA;AAAV;AAAjD,GAA+E;AAC5G,sBAAQC,KAAK,CAACC,aAAN,CAAoBC,YAApB,EAAyB;AAAEC,IAAAA,cAAc,EAAEJ,UAAU,CAACK,SAA7B;AAAwCC,IAAAA,UAAU,EAAEP,MAAM,CAACQ,MAA3D;AAAmEC,IAAAA,iBAAiB,EAAER,UAAU,CAACS,KAAjG;AAAwGC,IAAAA,aAAa,EAAEX,MAAM,CAACY,MAA9H;AAAsIlB,IAAAA,KAAK,EAAEA,KAA7I;AAAoJC,IAAAA,QAAQ,EAAEA,QAA9J;AAAwKE,IAAAA,KAAK,EAAEA,KAA/K;AAAsLgB,IAAAA,KAAK,EAAE,mBAAOX,KAAK,CAACC,aAAN,CAAoBW,iBAApB,EAA0B;AAAEhB,MAAAA,KAAK,EAAE,EAC5P,GAAGG,UAAU,CAACL,OAD8O;AAE5PmB,QAAAA,KAAK,EAAEf,MAAM,CAACQ,MAF8O;AAG5PQ,QAAAA,UAAU,EAAE;AAHgP;AAAT,KAA1B,EAIxNpB,OAJwN,CAApM;AAITE,IAAAA,KAAK,EAAEA;AAJE,GAAzB,CAAR;AAKH,CAND;;eAOe,wBAAUL,uBAAV,C","sourcesContent":["import * as React from \"react\";\nimport { Text } from \"react-native\";\nimport { withTheme } from \"../theming\";\nimport Row from \"./Row\";\nconst RowHeadlineImageCaption = ({ title, subtitle, caption, image, style, theme: { colors, typography }, }) => {\n return (React.createElement(Row, { titleTypeStyle: typography.headline6, titleColor: colors.strong, subtitleTypeStyle: typography.body2, subtitleColor: colors.medium, title: title, subtitle: subtitle, image: image, right: () => (React.createElement(Text, { style: {\n ...typography.caption,\n color: colors.strong,\n marginLeft: 16,\n } }, caption)), style: style }));\n};\nexport default withTheme(RowHeadlineImageCaption);\n"]}
1
+ {"version":3,"sources":["RowHeadlineImageCaption.tsx"],"names":["RowHeadlineImageCaption","title","subtitle","caption","image","style","theme","colors","typography","headline6","strong","body2","medium","color","marginLeft"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;;;AAYA,MAAMA,uBAAwC,GAAG,QAO3C;AAAA,MAP4C;AAChDC,IAAAA,KADgD;AAEhDC,IAAAA,QAFgD;AAGhDC,IAAAA,OAHgD;AAIhDC,IAAAA,KAJgD;AAKhDC,IAAAA,KALgD;AAMhDC,IAAAA,KAAK,EAAE;AAAEC,MAAAA,MAAF;AAAUC,MAAAA;AAAV;AANyC,GAO5C;AACJ,sBACE,oBAAC,YAAD;AACE,IAAA,cAAc,EAAEA,UAAU,CAACC,SAD7B;AAEE,IAAA,UAAU,EAAEF,MAAM,CAACG,MAFrB;AAGE,IAAA,iBAAiB,EAAEF,UAAU,CAACG,KAHhC;AAIE,IAAA,aAAa,EAAEJ,MAAM,CAACK,MAJxB;AAKE,IAAA,KAAK,EAAEX,KALT;AAME,IAAA,QAAQ,EAAEC,QANZ;AAOE,IAAA,KAAK,EAAEE,KAPT;AAQE,IAAA,KAAK,EAAE,mBACL,oBAAC,iBAAD;AACE,MAAA,KAAK,EAAE,EACL,GAAGI,UAAU,CAACL,OADT;AAELU,QAAAA,KAAK,EAAEN,MAAM,CAACG,MAFT;AAGLI,QAAAA,UAAU,EAAE;AAHP;AADT,OAOGX,OAPH,CATJ;AAmBE,IAAA,KAAK,EAAEE;AAnBT,IADF;AAuBD,CA/BD;;eAiCe,wBAAUL,uBAAV,C","sourcesContent":["import * as React from \"react\";\nimport { Text, ImageSourcePropType, StyleProp, ViewStyle } from \"react-native\";\nimport { withTheme } from \"../theming\";\nimport Row from \"./Row\";\nimport theme from \"../styles/DefaultTheme\";\n\ntype Props = {\n title?: string;\n subtitle?: string;\n caption?: string;\n image: string | ImageSourcePropType;\n style?: StyleProp<ViewStyle>;\n theme: typeof theme;\n};\n\nconst RowHeadlineImageCaption: React.FC<Props> = ({\n title,\n subtitle,\n caption,\n image,\n style,\n theme: { colors, typography },\n}) => {\n return (\n <Row\n titleTypeStyle={typography.headline6}\n titleColor={colors.strong}\n subtitleTypeStyle={typography.body2}\n subtitleColor={colors.medium}\n title={title}\n subtitle={subtitle}\n image={image}\n right={() => (\n <Text\n style={{\n ...typography.caption,\n color: colors.strong,\n marginLeft: 16,\n }}\n >\n {caption}\n </Text>\n )}\n style={style}\n />\n );\n};\n\nexport default withTheme(RowHeadlineImageCaption);\n"]}
@@ -25,7 +25,7 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
25
25
 
26
26
  const Surface = _ref => {
27
27
  let {
28
- elevation,
28
+ elevation: propElevation,
29
29
  style,
30
30
  theme,
31
31
  children,
@@ -33,21 +33,33 @@ const Surface = _ref => {
33
33
  } = _ref;
34
34
  const {
35
35
  elevation: styleElevation = 3,
36
- borderRadius: radius = 0
36
+ borderRadius,
37
+ overflow,
38
+ height,
39
+ width
37
40
  } = _reactNative.StyleSheet.flatten(style) || {};
38
41
  const {
39
42
  dark: isDarkTheme,
40
43
  mode,
41
44
  colors
42
45
  } = theme;
43
- const borderRadius = radius;
44
- const ele = elevation || styleElevation;
46
+ const elevation = propElevation || styleElevation;
47
+ const evalationStyles = elevation ? (0, _shadow.default)(elevation) : {};
45
48
  return /*#__PURE__*/React.createElement(_reactNative.Animated.View, _extends({}, rest, {
49
+ style: [style, {
50
+ backgroundColor: isDarkTheme && mode === "adaptive" ? (0, _overlay.default)(elevation, colors.surface) : colors.surface,
51
+ overflow: _reactNative.Platform.OS === "web" ? "hidden" : "visible",
52
+ elevation,
53
+ ...evalationStyles
54
+ }]
55
+ }), /*#__PURE__*/React.createElement(_reactNative.View, {
46
56
  style: [{
57
+ overflow,
47
58
  borderRadius,
48
- backgroundColor: isDarkTheme && mode === "adaptive" ? (0, _overlay.default)(ele, colors.surface) : colors.surface
49
- }, elevation ? (0, _shadow.default)(elevation) : null, style]
50
- }), children);
59
+ height,
60
+ width
61
+ }]
62
+ }, children));
51
63
  };
52
64
 
53
65
  var _default = (0, _theming.withTheme)(Surface);
@@ -1 +1 @@
1
- {"version":3,"sources":["Surface.tsx"],"names":["Surface","elevation","style","theme","children","rest","styleElevation","borderRadius","radius","StyleSheet","flatten","dark","isDarkTheme","mode","colors","ele","backgroundColor","surface"],"mappings":";;;;;;;AACA;;AACA;;AAOA;;AACA;;AACA;;;;;;;;;;AASA,MAAMA,OAAwB,GAAG,QAM3B;AAAA,MAN4B;AAChCC,IAAAA,SADgC;AAEhCC,IAAAA,KAFgC;AAGhCC,IAAAA,KAHgC;AAIhCC,IAAAA,QAJgC;AAKhC,OAAGC;AAL6B,GAM5B;AACJ,QAAM;AAAEJ,IAAAA,SAAS,EAAEK,cAAc,GAAG,CAA9B;AAAiCC,IAAAA,YAAY,EAAEC,MAAM,GAAG;AAAxD,MACHC,wBAAWC,OAAX,CAAmBR,KAAnB,KAA6B,EADhC;AAEA,QAAM;AAAES,IAAAA,IAAI,EAAEC,WAAR;AAAqBC,IAAAA,IAArB;AAA2BC,IAAAA;AAA3B,MAAsCX,KAA5C;AACA,QAAMI,YAAY,GAAGC,MAArB;AACA,QAAMO,GAAG,GAAGd,SAAS,IAAIK,cAAzB;AAEA,sBACE,oBAAC,qBAAD,CAAU,IAAV,eACMD,IADN;AAEE,IAAA,KAAK,EAAE,CACL;AACEE,MAAAA,YADF;AAEES,MAAAA,eAAe,EACbJ,WAAW,IAAIC,IAAI,KAAK,UAAxB,GACI,sBAAQE,GAAR,EAAaD,MAAM,CAACG,OAApB,CADJ,GAEIH,MAAM,CAACG;AALf,KADK,EAQLhB,SAAS,GAAG,qBAAOA,SAAP,CAAH,GAAuB,IAR3B,EASLC,KATK;AAFT,MAcGE,QAdH,CADF;AAkBD,CA/BD;;eAiCe,wBAAUJ,OAAV,C","sourcesContent":["/* Copied from https://github.com/callstack/react-native-paper/blob/main/src/components/Surface.tsx */\nimport * as React from \"react\";\nimport {\n Animated,\n StyleSheet,\n ViewProps,\n StyleProp,\n ViewStyle,\n} from \"react-native\";\nimport shadow from \"../styles/shadow\";\nimport overlay from \"../styles/overlay\";\nimport { withTheme } from \"../theming\";\nimport type { Theme } from \"../styles/DefaultTheme\";\n\ntype Props = {\n elevation?: number;\n style?: StyleProp<ViewStyle>;\n theme: Theme;\n} & ViewProps;\n\nconst Surface: React.FC<Props> = ({\n elevation,\n style,\n theme,\n children,\n ...rest\n}) => {\n const { elevation: styleElevation = 3, borderRadius: radius = 0 } =\n (StyleSheet.flatten(style) || {}) as ViewStyle;\n const { dark: isDarkTheme, mode, colors } = theme;\n const borderRadius = radius;\n const ele = elevation || styleElevation;\n\n return (\n <Animated.View\n {...rest}\n style={[\n {\n borderRadius,\n backgroundColor:\n isDarkTheme && mode === \"adaptive\"\n ? overlay(ele, colors.surface)\n : colors.surface,\n },\n elevation ? shadow(elevation) : null,\n style,\n ]}\n >\n {children}\n </Animated.View>\n );\n};\n\nexport default withTheme(Surface);\n"]}
1
+ {"version":3,"sources":["Surface.tsx"],"names":["Surface","elevation","propElevation","style","theme","children","rest","styleElevation","borderRadius","overflow","height","width","StyleSheet","flatten","dark","isDarkTheme","mode","colors","evalationStyles","backgroundColor","surface","Platform","OS"],"mappings":";;;;;;;AACA;;AACA;;AASA;;AACA;;AACA;;;;;;;;;;AASA,MAAMA,OAAwB,GAAG,QAM3B;AAAA,MAN4B;AAChCC,IAAAA,SAAS,EAAEC,aADqB;AAEhCC,IAAAA,KAFgC;AAGhCC,IAAAA,KAHgC;AAIhCC,IAAAA,QAJgC;AAKhC,OAAGC;AAL6B,GAM5B;AACJ,QAAM;AACJL,IAAAA,SAAS,EAAEM,cAAc,GAAG,CADxB;AAEJC,IAAAA,YAFI;AAGJC,IAAAA,QAHI;AAIJC,IAAAA,MAJI;AAKJC,IAAAA;AALI,MAMDC,wBAAWC,OAAX,CAAmBV,KAAnB,KAA6B,EANlC;AAQA,QAAM;AAAEW,IAAAA,IAAI,EAAEC,WAAR;AAAqBC,IAAAA,IAArB;AAA2BC,IAAAA;AAA3B,MAAsCb,KAA5C;AAEA,QAAMH,SAAS,GAAGC,aAAa,IAAIK,cAAnC;AAEA,QAAMW,eAAe,GAAGjB,SAAS,GAAG,qBAAOA,SAAP,CAAH,GAAuB,EAAxD;AAEA,sBACE,oBAAC,qBAAD,CAAU,IAAV,eACMK,IADN;AAEE,IAAA,KAAK,EAAE,CACLH,KADK,EAEL;AACEgB,MAAAA,eAAe,EACbJ,WAAW,IAAIC,IAAI,KAAK,UAAxB,GACI,sBAAQf,SAAR,EAAmBgB,MAAM,CAACG,OAA1B,CADJ,GAEIH,MAAM,CAACG,OAJf;AAKEX,MAAAA,QAAQ,EAAEY,sBAASC,EAAT,KAAgB,KAAhB,GAAwB,QAAxB,GAAmC,SAL/C;AAMErB,MAAAA,SANF;AAOE,SAAGiB;AAPL,KAFK;AAFT,mBAeE,oBAAC,iBAAD;AACE,IAAA,KAAK,EAAE,CACL;AACET,MAAAA,QADF;AAEED,MAAAA,YAFF;AAGEE,MAAAA,MAHF;AAIEC,MAAAA;AAJF,KADK;AADT,KAUGN,QAVH,CAfF,CADF;AA8BD,CAnDD;;eAqDe,wBAAUL,OAAV,C","sourcesContent":["/* Copied from https://github.com/callstack/react-native-paper/blob/main/src/components/Surface.tsx */\nimport * as React from \"react\";\nimport {\n Animated,\n StyleSheet,\n ViewProps,\n StyleProp,\n ViewStyle,\n View,\n Platform,\n} from \"react-native\";\nimport shadow from \"../styles/shadow\";\nimport overlay from \"../styles/overlay\";\nimport { withTheme } from \"../theming\";\nimport type { Theme } from \"../styles/DefaultTheme\";\n\ntype Props = {\n elevation?: number;\n style?: StyleProp<ViewStyle>;\n theme: Theme;\n} & ViewProps;\n\nconst Surface: React.FC<Props> = ({\n elevation: propElevation,\n style,\n theme,\n children,\n ...rest\n}) => {\n const {\n elevation: styleElevation = 3,\n borderRadius,\n overflow,\n height,\n width,\n } = (StyleSheet.flatten(style) || {}) as ViewStyle;\n\n const { dark: isDarkTheme, mode, colors } = theme;\n\n const elevation = propElevation || styleElevation;\n\n const evalationStyles = elevation ? shadow(elevation) : {};\n\n return (\n <Animated.View\n {...rest}\n style={[\n style,\n {\n backgroundColor:\n isDarkTheme && mode === \"adaptive\"\n ? overlay(elevation, colors.surface)\n : colors.surface,\n overflow: Platform.OS === \"web\" ? \"hidden\" : \"visible\",\n elevation,\n ...evalationStyles,\n },\n ]}\n >\n <View\n style={[\n {\n overflow,\n borderRadius,\n height,\n width,\n },\n ]}\n >\n {children}\n </View>\n </Animated.View>\n );\n};\n\nexport default withTheme(Surface);\n"]}
@@ -11,7 +11,7 @@ const SEED_DATA = {
11
11
  name: "Keyboard Avoiding View",
12
12
  tag: "KeyboardAvoidingView",
13
13
  description: "View that moves out of the way of the virtual keyboard. ",
14
- category: _types.COMPONENT_TYPES.layout,
14
+ category: _types.COMPONENT_TYPES.deprecated,
15
15
  props: {
16
16
  enabled: {
17
17
  label: "Enable",
@@ -1 +1 @@
1
- {"version":3,"sources":["KeyboardAvoidingView.ts"],"names":["SEED_DATA","name","tag","description","category","COMPONENT_TYPES","layout","props","enabled","label","editable","required","defaultValue","formType","FORM_TYPES","boolean","propType","PROP_TYPES","BOOLEAN","group","GROUPS","basic","behavior","options","flatArray","STRING","keyboardVerticalOffset","number","NUMBER"],"mappings":";;;;;;;AAAA;;AAOO,MAAMA,SAAS,GAAG;AACvBC,EAAAA,IAAI,EAAE,wBADiB;AAEvBC,EAAAA,GAAG,EAAE,sBAFkB;AAGvBC,EAAAA,WAAW,EAAE,0DAHU;AAIvBC,EAAAA,QAAQ,EAAEC,uBAAgBC,MAJH;AAKvBC,EAAAA,KAAK,EAAE;AACLC,IAAAA,OAAO,EAAE;AACPC,MAAAA,KAAK,EAAE,QADA;AAEPN,MAAAA,WAAW,EAAE,mCAFN;AAGPO,MAAAA,QAAQ,EAAE,IAHH;AAIPC,MAAAA,QAAQ,EAAE,IAJH;AAKPC,MAAAA,YAAY,EAAE,IALP;AAMPC,MAAAA,QAAQ,EAAEC,kBAAWC,OANd;AAOPC,MAAAA,QAAQ,EAAEC,kBAAWC,OAPd;AAQPC,MAAAA,KAAK,EAAEC,cAAOC;AARP,KADJ;AAWLC,IAAAA,QAAQ,EAAE;AACRb,MAAAA,KAAK,EAAE,mBADC;AAERN,MAAAA,WAAW,EACT,uGAHM;AAIRO,MAAAA,QAAQ,EAAE,IAJF;AAKRC,MAAAA,QAAQ,EAAE,IALF;AAMRC,MAAAA,YAAY,EAAE,SANN;AAORW,MAAAA,OAAO,EAAE,CAAC,SAAD,EAAY,UAAZ,EAAwB,QAAxB,CAPD;AAQRV,MAAAA,QAAQ,EAAEC,kBAAWU,SARb;AASRR,MAAAA,QAAQ,EAAEC,kBAAWQ,MATb;AAURN,MAAAA,KAAK,EAAEC,cAAOC;AAVN,KAXL;AAuBLK,IAAAA,sBAAsB,EAAE;AACtBjB,MAAAA,KAAK,EAAE,0BADe;AAEtBN,MAAAA,WAAW,EACT,8DAHoB;AAItBO,MAAAA,QAAQ,EAAE,IAJY;AAKtBC,MAAAA,QAAQ,EAAE,KALY;AAMtBC,MAAAA,YAAY,EAAE,CANQ;AAOtBC,MAAAA,QAAQ,EAAEC,kBAAWa,MAPC;AAQtBX,MAAAA,QAAQ,EAAEC,kBAAWW,MARC;AAStBT,MAAAA,KAAK,EAAEC,cAAOC;AATQ;AAvBnB;AALgB,CAAlB","sourcesContent":["import {\n COMPONENT_TYPES,\n FORM_TYPES,\n PROP_TYPES,\n GROUPS,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = {\n name: \"Keyboard Avoiding View\",\n tag: \"KeyboardAvoidingView\",\n description: \"View that moves out of the way of the virtual keyboard. \",\n category: COMPONENT_TYPES.layout,\n props: {\n enabled: {\n label: \"Enable\",\n description: \"Enable the keyboard avoiding view\",\n editable: true,\n required: true,\n defaultValue: true,\n formType: FORM_TYPES.boolean,\n propType: PROP_TYPES.BOOLEAN,\n group: GROUPS.basic,\n },\n behavior: {\n label: \"Resizing Behavior\",\n description:\n \"The behavior for how the keyboard resizing interacts with the rest of the screen. (Default: padding).\",\n editable: true,\n required: true,\n defaultValue: \"padding\",\n options: [\"padding\", \"position\", \"height\"],\n formType: FORM_TYPES.flatArray,\n propType: PROP_TYPES.STRING,\n group: GROUPS.basic,\n },\n keyboardVerticalOffset: {\n label: \"Keyboard Vertical Offset\",\n description:\n \"The distance between the bottom of the view and the keyboard\",\n editable: true,\n required: false,\n defaultValue: 0,\n formType: FORM_TYPES.number,\n propType: PROP_TYPES.NUMBER,\n group: GROUPS.basic,\n },\n },\n};\n"]}
1
+ {"version":3,"sources":["KeyboardAvoidingView.ts"],"names":["SEED_DATA","name","tag","description","category","COMPONENT_TYPES","deprecated","props","enabled","label","editable","required","defaultValue","formType","FORM_TYPES","boolean","propType","PROP_TYPES","BOOLEAN","group","GROUPS","basic","behavior","options","flatArray","STRING","keyboardVerticalOffset","number","NUMBER"],"mappings":";;;;;;;AAAA;;AAOO,MAAMA,SAAS,GAAG;AACvBC,EAAAA,IAAI,EAAE,wBADiB;AAEvBC,EAAAA,GAAG,EAAE,sBAFkB;AAGvBC,EAAAA,WAAW,EAAE,0DAHU;AAIvBC,EAAAA,QAAQ,EAAEC,uBAAgBC,UAJH;AAKvBC,EAAAA,KAAK,EAAE;AACLC,IAAAA,OAAO,EAAE;AACPC,MAAAA,KAAK,EAAE,QADA;AAEPN,MAAAA,WAAW,EAAE,mCAFN;AAGPO,MAAAA,QAAQ,EAAE,IAHH;AAIPC,MAAAA,QAAQ,EAAE,IAJH;AAKPC,MAAAA,YAAY,EAAE,IALP;AAMPC,MAAAA,QAAQ,EAAEC,kBAAWC,OANd;AAOPC,MAAAA,QAAQ,EAAEC,kBAAWC,OAPd;AAQPC,MAAAA,KAAK,EAAEC,cAAOC;AARP,KADJ;AAWLC,IAAAA,QAAQ,EAAE;AACRb,MAAAA,KAAK,EAAE,mBADC;AAERN,MAAAA,WAAW,EACT,uGAHM;AAIRO,MAAAA,QAAQ,EAAE,IAJF;AAKRC,MAAAA,QAAQ,EAAE,IALF;AAMRC,MAAAA,YAAY,EAAE,SANN;AAORW,MAAAA,OAAO,EAAE,CAAC,SAAD,EAAY,UAAZ,EAAwB,QAAxB,CAPD;AAQRV,MAAAA,QAAQ,EAAEC,kBAAWU,SARb;AASRR,MAAAA,QAAQ,EAAEC,kBAAWQ,MATb;AAURN,MAAAA,KAAK,EAAEC,cAAOC;AAVN,KAXL;AAuBLK,IAAAA,sBAAsB,EAAE;AACtBjB,MAAAA,KAAK,EAAE,0BADe;AAEtBN,MAAAA,WAAW,EACT,8DAHoB;AAItBO,MAAAA,QAAQ,EAAE,IAJY;AAKtBC,MAAAA,QAAQ,EAAE,KALY;AAMtBC,MAAAA,YAAY,EAAE,CANQ;AAOtBC,MAAAA,QAAQ,EAAEC,kBAAWa,MAPC;AAQtBX,MAAAA,QAAQ,EAAEC,kBAAWW,MARC;AAStBT,MAAAA,KAAK,EAAEC,cAAOC;AATQ;AAvBnB;AALgB,CAAlB","sourcesContent":["import {\n COMPONENT_TYPES,\n FORM_TYPES,\n PROP_TYPES,\n GROUPS,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = {\n name: \"Keyboard Avoiding View\",\n tag: \"KeyboardAvoidingView\",\n description: \"View that moves out of the way of the virtual keyboard. \",\n category: COMPONENT_TYPES.deprecated,\n props: {\n enabled: {\n label: \"Enable\",\n description: \"Enable the keyboard avoiding view\",\n editable: true,\n required: true,\n defaultValue: true,\n formType: FORM_TYPES.boolean,\n propType: PROP_TYPES.BOOLEAN,\n group: GROUPS.basic,\n },\n behavior: {\n label: \"Resizing Behavior\",\n description:\n \"The behavior for how the keyboard resizing interacts with the rest of the screen. (Default: padding).\",\n editable: true,\n required: true,\n defaultValue: \"padding\",\n options: [\"padding\", \"position\", \"height\"],\n formType: FORM_TYPES.flatArray,\n propType: PROP_TYPES.STRING,\n group: GROUPS.basic,\n },\n keyboardVerticalOffset: {\n label: \"Keyboard Vertical Offset\",\n description:\n \"The distance between the bottom of the view and the keyboard\",\n editable: true,\n required: false,\n defaultValue: 0,\n formType: FORM_TYPES.number,\n propType: PROP_TYPES.NUMBER,\n group: GROUPS.basic,\n },\n },\n};\n"]}
@@ -2,14 +2,14 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
2
2
 
3
3
  /* Copied from https://github.com/callstack/react-native-paper/blob/main/src/components/Surface.tsx */
4
4
  import * as React from "react";
5
- import { Animated, StyleSheet } from "react-native";
5
+ import { Animated, StyleSheet, View, Platform } from "react-native";
6
6
  import shadow from "../styles/shadow";
7
7
  import overlay from "../styles/overlay";
8
8
  import { withTheme } from "../theming";
9
9
 
10
10
  const Surface = _ref => {
11
11
  let {
12
- elevation,
12
+ elevation: propElevation,
13
13
  style,
14
14
  theme,
15
15
  children,
@@ -17,21 +17,33 @@ const Surface = _ref => {
17
17
  } = _ref;
18
18
  const {
19
19
  elevation: styleElevation = 3,
20
- borderRadius: radius = 0
20
+ borderRadius,
21
+ overflow,
22
+ height,
23
+ width
21
24
  } = StyleSheet.flatten(style) || {};
22
25
  const {
23
26
  dark: isDarkTheme,
24
27
  mode,
25
28
  colors
26
29
  } = theme;
27
- const borderRadius = radius;
28
- const ele = elevation || styleElevation;
30
+ const elevation = propElevation || styleElevation;
31
+ const evalationStyles = elevation ? shadow(elevation) : {};
29
32
  return /*#__PURE__*/React.createElement(Animated.View, _extends({}, rest, {
33
+ style: [style, {
34
+ backgroundColor: isDarkTheme && mode === "adaptive" ? overlay(elevation, colors.surface) : colors.surface,
35
+ overflow: Platform.OS === "web" ? "hidden" : "visible",
36
+ elevation,
37
+ ...evalationStyles
38
+ }]
39
+ }), /*#__PURE__*/React.createElement(View, {
30
40
  style: [{
41
+ overflow,
31
42
  borderRadius,
32
- backgroundColor: isDarkTheme && mode === "adaptive" ? overlay(ele, colors.surface) : colors.surface
33
- }, elevation ? shadow(elevation) : null, style]
34
- }), children);
43
+ height,
44
+ width
45
+ }]
46
+ }, children));
35
47
  };
36
48
 
37
49
  export default withTheme(Surface);
@@ -1 +1 @@
1
- {"version":3,"sources":["Surface.tsx"],"names":["React","Animated","StyleSheet","shadow","overlay","withTheme","Surface","elevation","style","theme","children","rest","styleElevation","borderRadius","radius","flatten","dark","isDarkTheme","mode","colors","ele","backgroundColor","surface"],"mappings":";;AAAA;AACA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SACEC,QADF,EAEEC,UAFF,QAMO,cANP;AAOA,OAAOC,MAAP,MAAmB,kBAAnB;AACA,OAAOC,OAAP,MAAoB,mBAApB;AACA,SAASC,SAAT,QAA0B,YAA1B;;AASA,MAAMC,OAAwB,GAAG,QAM3B;AAAA,MAN4B;AAChCC,IAAAA,SADgC;AAEhCC,IAAAA,KAFgC;AAGhCC,IAAAA,KAHgC;AAIhCC,IAAAA,QAJgC;AAKhC,OAAGC;AAL6B,GAM5B;AACJ,QAAM;AAAEJ,IAAAA,SAAS,EAAEK,cAAc,GAAG,CAA9B;AAAiCC,IAAAA,YAAY,EAAEC,MAAM,GAAG;AAAxD,MACHZ,UAAU,CAACa,OAAX,CAAmBP,KAAnB,KAA6B,EADhC;AAEA,QAAM;AAAEQ,IAAAA,IAAI,EAAEC,WAAR;AAAqBC,IAAAA,IAArB;AAA2BC,IAAAA;AAA3B,MAAsCV,KAA5C;AACA,QAAMI,YAAY,GAAGC,MAArB;AACA,QAAMM,GAAG,GAAGb,SAAS,IAAIK,cAAzB;AAEA,sBACE,oBAAC,QAAD,CAAU,IAAV,eACMD,IADN;AAEE,IAAA,KAAK,EAAE,CACL;AACEE,MAAAA,YADF;AAEEQ,MAAAA,eAAe,EACbJ,WAAW,IAAIC,IAAI,KAAK,UAAxB,GACId,OAAO,CAACgB,GAAD,EAAMD,MAAM,CAACG,OAAb,CADX,GAEIH,MAAM,CAACG;AALf,KADK,EAQLf,SAAS,GAAGJ,MAAM,CAACI,SAAD,CAAT,GAAuB,IAR3B,EASLC,KATK;AAFT,MAcGE,QAdH,CADF;AAkBD,CA/BD;;AAiCA,eAAeL,SAAS,CAACC,OAAD,CAAxB","sourcesContent":["/* Copied from https://github.com/callstack/react-native-paper/blob/main/src/components/Surface.tsx */\nimport * as React from \"react\";\nimport {\n Animated,\n StyleSheet,\n ViewProps,\n StyleProp,\n ViewStyle,\n} from \"react-native\";\nimport shadow from \"../styles/shadow\";\nimport overlay from \"../styles/overlay\";\nimport { withTheme } from \"../theming\";\nimport type { Theme } from \"../styles/DefaultTheme\";\n\ntype Props = {\n elevation?: number;\n style?: StyleProp<ViewStyle>;\n theme: Theme;\n} & ViewProps;\n\nconst Surface: React.FC<Props> = ({\n elevation,\n style,\n theme,\n children,\n ...rest\n}) => {\n const { elevation: styleElevation = 3, borderRadius: radius = 0 } =\n (StyleSheet.flatten(style) || {}) as ViewStyle;\n const { dark: isDarkTheme, mode, colors } = theme;\n const borderRadius = radius;\n const ele = elevation || styleElevation;\n\n return (\n <Animated.View\n {...rest}\n style={[\n {\n borderRadius,\n backgroundColor:\n isDarkTheme && mode === \"adaptive\"\n ? overlay(ele, colors.surface)\n : colors.surface,\n },\n elevation ? shadow(elevation) : null,\n style,\n ]}\n >\n {children}\n </Animated.View>\n );\n};\n\nexport default withTheme(Surface);\n"]}
1
+ {"version":3,"sources":["Surface.tsx"],"names":["React","Animated","StyleSheet","View","Platform","shadow","overlay","withTheme","Surface","elevation","propElevation","style","theme","children","rest","styleElevation","borderRadius","overflow","height","width","flatten","dark","isDarkTheme","mode","colors","evalationStyles","backgroundColor","surface","OS"],"mappings":";;AAAA;AACA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SACEC,QADF,EAEEC,UAFF,EAMEC,IANF,EAOEC,QAPF,QAQO,cARP;AASA,OAAOC,MAAP,MAAmB,kBAAnB;AACA,OAAOC,OAAP,MAAoB,mBAApB;AACA,SAASC,SAAT,QAA0B,YAA1B;;AASA,MAAMC,OAAwB,GAAG,QAM3B;AAAA,MAN4B;AAChCC,IAAAA,SAAS,EAAEC,aADqB;AAEhCC,IAAAA,KAFgC;AAGhCC,IAAAA,KAHgC;AAIhCC,IAAAA,QAJgC;AAKhC,OAAGC;AAL6B,GAM5B;AACJ,QAAM;AACJL,IAAAA,SAAS,EAAEM,cAAc,GAAG,CADxB;AAEJC,IAAAA,YAFI;AAGJC,IAAAA,QAHI;AAIJC,IAAAA,MAJI;AAKJC,IAAAA;AALI,MAMDjB,UAAU,CAACkB,OAAX,CAAmBT,KAAnB,KAA6B,EANlC;AAQA,QAAM;AAAEU,IAAAA,IAAI,EAAEC,WAAR;AAAqBC,IAAAA,IAArB;AAA2BC,IAAAA;AAA3B,MAAsCZ,KAA5C;AAEA,QAAMH,SAAS,GAAGC,aAAa,IAAIK,cAAnC;AAEA,QAAMU,eAAe,GAAGhB,SAAS,GAAGJ,MAAM,CAACI,SAAD,CAAT,GAAuB,EAAxD;AAEA,sBACE,oBAAC,QAAD,CAAU,IAAV,eACMK,IADN;AAEE,IAAA,KAAK,EAAE,CACLH,KADK,EAEL;AACEe,MAAAA,eAAe,EACbJ,WAAW,IAAIC,IAAI,KAAK,UAAxB,GACIjB,OAAO,CAACG,SAAD,EAAYe,MAAM,CAACG,OAAnB,CADX,GAEIH,MAAM,CAACG,OAJf;AAKEV,MAAAA,QAAQ,EAAEb,QAAQ,CAACwB,EAAT,KAAgB,KAAhB,GAAwB,QAAxB,GAAmC,SAL/C;AAMEnB,MAAAA,SANF;AAOE,SAAGgB;AAPL,KAFK;AAFT,mBAeE,oBAAC,IAAD;AACE,IAAA,KAAK,EAAE,CACL;AACER,MAAAA,QADF;AAEED,MAAAA,YAFF;AAGEE,MAAAA,MAHF;AAIEC,MAAAA;AAJF,KADK;AADT,KAUGN,QAVH,CAfF,CADF;AA8BD,CAnDD;;AAqDA,eAAeN,SAAS,CAACC,OAAD,CAAxB","sourcesContent":["/* Copied from https://github.com/callstack/react-native-paper/blob/main/src/components/Surface.tsx */\nimport * as React from \"react\";\nimport {\n Animated,\n StyleSheet,\n ViewProps,\n StyleProp,\n ViewStyle,\n View,\n Platform,\n} from \"react-native\";\nimport shadow from \"../styles/shadow\";\nimport overlay from \"../styles/overlay\";\nimport { withTheme } from \"../theming\";\nimport type { Theme } from \"../styles/DefaultTheme\";\n\ntype Props = {\n elevation?: number;\n style?: StyleProp<ViewStyle>;\n theme: Theme;\n} & ViewProps;\n\nconst Surface: React.FC<Props> = ({\n elevation: propElevation,\n style,\n theme,\n children,\n ...rest\n}) => {\n const {\n elevation: styleElevation = 3,\n borderRadius,\n overflow,\n height,\n width,\n } = (StyleSheet.flatten(style) || {}) as ViewStyle;\n\n const { dark: isDarkTheme, mode, colors } = theme;\n\n const elevation = propElevation || styleElevation;\n\n const evalationStyles = elevation ? shadow(elevation) : {};\n\n return (\n <Animated.View\n {...rest}\n style={[\n style,\n {\n backgroundColor:\n isDarkTheme && mode === \"adaptive\"\n ? overlay(elevation, colors.surface)\n : colors.surface,\n overflow: Platform.OS === \"web\" ? \"hidden\" : \"visible\",\n elevation,\n ...evalationStyles,\n },\n ]}\n >\n <View\n style={[\n {\n overflow,\n borderRadius,\n height,\n width,\n },\n ]}\n >\n {children}\n </View>\n </Animated.View>\n );\n};\n\nexport default withTheme(Surface);\n"]}
@@ -3,7 +3,7 @@ export const SEED_DATA = {
3
3
  name: "Keyboard Avoiding View",
4
4
  tag: "KeyboardAvoidingView",
5
5
  description: "View that moves out of the way of the virtual keyboard. ",
6
- category: COMPONENT_TYPES.layout,
6
+ category: COMPONENT_TYPES.deprecated,
7
7
  props: {
8
8
  enabled: {
9
9
  label: "Enable",
@@ -1 +1 @@
1
- {"version":3,"sources":["KeyboardAvoidingView.ts"],"names":["COMPONENT_TYPES","FORM_TYPES","PROP_TYPES","GROUPS","SEED_DATA","name","tag","description","category","layout","props","enabled","label","editable","required","defaultValue","formType","boolean","propType","BOOLEAN","group","basic","behavior","options","flatArray","STRING","keyboardVerticalOffset","number","NUMBER"],"mappings":"AAAA,SACEA,eADF,EAEEC,UAFF,EAGEC,UAHF,EAIEC,MAJF,QAKO,iBALP;AAOA,OAAO,MAAMC,SAAS,GAAG;AACvBC,EAAAA,IAAI,EAAE,wBADiB;AAEvBC,EAAAA,GAAG,EAAE,sBAFkB;AAGvBC,EAAAA,WAAW,EAAE,0DAHU;AAIvBC,EAAAA,QAAQ,EAAER,eAAe,CAACS,MAJH;AAKvBC,EAAAA,KAAK,EAAE;AACLC,IAAAA,OAAO,EAAE;AACPC,MAAAA,KAAK,EAAE,QADA;AAEPL,MAAAA,WAAW,EAAE,mCAFN;AAGPM,MAAAA,QAAQ,EAAE,IAHH;AAIPC,MAAAA,QAAQ,EAAE,IAJH;AAKPC,MAAAA,YAAY,EAAE,IALP;AAMPC,MAAAA,QAAQ,EAAEf,UAAU,CAACgB,OANd;AAOPC,MAAAA,QAAQ,EAAEhB,UAAU,CAACiB,OAPd;AAQPC,MAAAA,KAAK,EAAEjB,MAAM,CAACkB;AARP,KADJ;AAWLC,IAAAA,QAAQ,EAAE;AACRV,MAAAA,KAAK,EAAE,mBADC;AAERL,MAAAA,WAAW,EACT,uGAHM;AAIRM,MAAAA,QAAQ,EAAE,IAJF;AAKRC,MAAAA,QAAQ,EAAE,IALF;AAMRC,MAAAA,YAAY,EAAE,SANN;AAORQ,MAAAA,OAAO,EAAE,CAAC,SAAD,EAAY,UAAZ,EAAwB,QAAxB,CAPD;AAQRP,MAAAA,QAAQ,EAAEf,UAAU,CAACuB,SARb;AASRN,MAAAA,QAAQ,EAAEhB,UAAU,CAACuB,MATb;AAURL,MAAAA,KAAK,EAAEjB,MAAM,CAACkB;AAVN,KAXL;AAuBLK,IAAAA,sBAAsB,EAAE;AACtBd,MAAAA,KAAK,EAAE,0BADe;AAEtBL,MAAAA,WAAW,EACT,8DAHoB;AAItBM,MAAAA,QAAQ,EAAE,IAJY;AAKtBC,MAAAA,QAAQ,EAAE,KALY;AAMtBC,MAAAA,YAAY,EAAE,CANQ;AAOtBC,MAAAA,QAAQ,EAAEf,UAAU,CAAC0B,MAPC;AAQtBT,MAAAA,QAAQ,EAAEhB,UAAU,CAAC0B,MARC;AAStBR,MAAAA,KAAK,EAAEjB,MAAM,CAACkB;AATQ;AAvBnB;AALgB,CAAlB","sourcesContent":["import {\n COMPONENT_TYPES,\n FORM_TYPES,\n PROP_TYPES,\n GROUPS,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = {\n name: \"Keyboard Avoiding View\",\n tag: \"KeyboardAvoidingView\",\n description: \"View that moves out of the way of the virtual keyboard. \",\n category: COMPONENT_TYPES.layout,\n props: {\n enabled: {\n label: \"Enable\",\n description: \"Enable the keyboard avoiding view\",\n editable: true,\n required: true,\n defaultValue: true,\n formType: FORM_TYPES.boolean,\n propType: PROP_TYPES.BOOLEAN,\n group: GROUPS.basic,\n },\n behavior: {\n label: \"Resizing Behavior\",\n description:\n \"The behavior for how the keyboard resizing interacts with the rest of the screen. (Default: padding).\",\n editable: true,\n required: true,\n defaultValue: \"padding\",\n options: [\"padding\", \"position\", \"height\"],\n formType: FORM_TYPES.flatArray,\n propType: PROP_TYPES.STRING,\n group: GROUPS.basic,\n },\n keyboardVerticalOffset: {\n label: \"Keyboard Vertical Offset\",\n description:\n \"The distance between the bottom of the view and the keyboard\",\n editable: true,\n required: false,\n defaultValue: 0,\n formType: FORM_TYPES.number,\n propType: PROP_TYPES.NUMBER,\n group: GROUPS.basic,\n },\n },\n};\n"]}
1
+ {"version":3,"sources":["KeyboardAvoidingView.ts"],"names":["COMPONENT_TYPES","FORM_TYPES","PROP_TYPES","GROUPS","SEED_DATA","name","tag","description","category","deprecated","props","enabled","label","editable","required","defaultValue","formType","boolean","propType","BOOLEAN","group","basic","behavior","options","flatArray","STRING","keyboardVerticalOffset","number","NUMBER"],"mappings":"AAAA,SACEA,eADF,EAEEC,UAFF,EAGEC,UAHF,EAIEC,MAJF,QAKO,iBALP;AAOA,OAAO,MAAMC,SAAS,GAAG;AACvBC,EAAAA,IAAI,EAAE,wBADiB;AAEvBC,EAAAA,GAAG,EAAE,sBAFkB;AAGvBC,EAAAA,WAAW,EAAE,0DAHU;AAIvBC,EAAAA,QAAQ,EAAER,eAAe,CAACS,UAJH;AAKvBC,EAAAA,KAAK,EAAE;AACLC,IAAAA,OAAO,EAAE;AACPC,MAAAA,KAAK,EAAE,QADA;AAEPL,MAAAA,WAAW,EAAE,mCAFN;AAGPM,MAAAA,QAAQ,EAAE,IAHH;AAIPC,MAAAA,QAAQ,EAAE,IAJH;AAKPC,MAAAA,YAAY,EAAE,IALP;AAMPC,MAAAA,QAAQ,EAAEf,UAAU,CAACgB,OANd;AAOPC,MAAAA,QAAQ,EAAEhB,UAAU,CAACiB,OAPd;AAQPC,MAAAA,KAAK,EAAEjB,MAAM,CAACkB;AARP,KADJ;AAWLC,IAAAA,QAAQ,EAAE;AACRV,MAAAA,KAAK,EAAE,mBADC;AAERL,MAAAA,WAAW,EACT,uGAHM;AAIRM,MAAAA,QAAQ,EAAE,IAJF;AAKRC,MAAAA,QAAQ,EAAE,IALF;AAMRC,MAAAA,YAAY,EAAE,SANN;AAORQ,MAAAA,OAAO,EAAE,CAAC,SAAD,EAAY,UAAZ,EAAwB,QAAxB,CAPD;AAQRP,MAAAA,QAAQ,EAAEf,UAAU,CAACuB,SARb;AASRN,MAAAA,QAAQ,EAAEhB,UAAU,CAACuB,MATb;AAURL,MAAAA,KAAK,EAAEjB,MAAM,CAACkB;AAVN,KAXL;AAuBLK,IAAAA,sBAAsB,EAAE;AACtBd,MAAAA,KAAK,EAAE,0BADe;AAEtBL,MAAAA,WAAW,EACT,8DAHoB;AAItBM,MAAAA,QAAQ,EAAE,IAJY;AAKtBC,MAAAA,QAAQ,EAAE,KALY;AAMtBC,MAAAA,YAAY,EAAE,CANQ;AAOtBC,MAAAA,QAAQ,EAAEf,UAAU,CAAC0B,MAPC;AAQtBT,MAAAA,QAAQ,EAAEhB,UAAU,CAAC0B,MARC;AAStBR,MAAAA,KAAK,EAAEjB,MAAM,CAACkB;AATQ;AAvBnB;AALgB,CAAlB","sourcesContent":["import {\n COMPONENT_TYPES,\n FORM_TYPES,\n PROP_TYPES,\n GROUPS,\n} from \"@draftbit/types\";\n\nexport const SEED_DATA = {\n name: \"Keyboard Avoiding View\",\n tag: \"KeyboardAvoidingView\",\n description: \"View that moves out of the way of the virtual keyboard. \",\n category: COMPONENT_TYPES.deprecated,\n props: {\n enabled: {\n label: \"Enable\",\n description: \"Enable the keyboard avoiding view\",\n editable: true,\n required: true,\n defaultValue: true,\n formType: FORM_TYPES.boolean,\n propType: PROP_TYPES.BOOLEAN,\n group: GROUPS.basic,\n },\n behavior: {\n label: \"Resizing Behavior\",\n description:\n \"The behavior for how the keyboard resizing interacts with the rest of the screen. (Default: padding).\",\n editable: true,\n required: true,\n defaultValue: \"padding\",\n options: [\"padding\", \"position\", \"height\"],\n formType: FORM_TYPES.flatArray,\n propType: PROP_TYPES.STRING,\n group: GROUPS.basic,\n },\n keyboardVerticalOffset: {\n label: \"Keyboard Vertical Offset\",\n description:\n \"The distance between the bottom of the view and the keyboard\",\n editable: true,\n required: false,\n defaultValue: 0,\n formType: FORM_TYPES.number,\n propType: PROP_TYPES.NUMBER,\n group: GROUPS.basic,\n },\n },\n};\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@draftbit/core",
3
- "version": "43.4.13",
3
+ "version": "43.4.14",
4
4
  "description": "Core (non-native) Components",
5
5
  "main": "lib/commonjs/index.js",
6
6
  "module": "lib/module/index.js",
@@ -80,5 +80,5 @@
80
80
  ]
81
81
  ]
82
82
  },
83
- "gitHead": "46ebb667314a2489633ddb06ff27a63133e1831c"
83
+ "gitHead": "d54108f01816381aa9447e2cf7d03b97746207e8"
84
84
  }
@@ -1,23 +1,32 @@
1
1
  /* Copied from https://github.com/callstack/react-native-paper/blob/main/src/components/Surface.tsx */
2
2
  import * as React from "react";
3
- import { Animated, StyleSheet, } from "react-native";
3
+ import { Animated, StyleSheet, View, Platform, } from "react-native";
4
4
  import shadow from "../styles/shadow";
5
5
  import overlay from "../styles/overlay";
6
6
  import { withTheme } from "../theming";
7
- const Surface = ({ elevation, style, theme, children, ...rest }) => {
8
- const { elevation: styleElevation = 3, borderRadius: radius = 0 } = (StyleSheet.flatten(style) || {});
7
+ const Surface = ({ elevation: propElevation, style, theme, children, ...rest }) => {
8
+ const { elevation: styleElevation = 3, borderRadius, overflow, height, width, } = (StyleSheet.flatten(style) || {});
9
9
  const { dark: isDarkTheme, mode, colors } = theme;
10
- const borderRadius = radius;
11
- const ele = elevation || styleElevation;
10
+ const elevation = propElevation || styleElevation;
11
+ const evalationStyles = elevation ? shadow(elevation) : {};
12
12
  return (React.createElement(Animated.View, { ...rest, style: [
13
+ style,
13
14
  {
14
- borderRadius,
15
15
  backgroundColor: isDarkTheme && mode === "adaptive"
16
- ? overlay(ele, colors.surface)
16
+ ? overlay(elevation, colors.surface)
17
17
  : colors.surface,
18
+ overflow: Platform.OS === "web" ? "hidden" : "visible",
19
+ elevation,
20
+ ...evalationStyles,
18
21
  },
19
- elevation ? shadow(elevation) : null,
20
- style,
21
- ] }, children));
22
+ ] },
23
+ React.createElement(View, { style: [
24
+ {
25
+ overflow,
26
+ borderRadius,
27
+ height,
28
+ width,
29
+ },
30
+ ] }, children)));
22
31
  };
23
32
  export default withTheme(Surface);
@@ -6,6 +6,8 @@ import {
6
6
  ViewProps,
7
7
  StyleProp,
8
8
  ViewStyle,
9
+ View,
10
+ Platform,
9
11
  } from "react-native";
10
12
  import shadow from "../styles/shadow";
11
13
  import overlay from "../styles/overlay";
@@ -19,34 +21,54 @@ type Props = {
19
21
  } & ViewProps;
20
22
 
21
23
  const Surface: React.FC<Props> = ({
22
- elevation,
24
+ elevation: propElevation,
23
25
  style,
24
26
  theme,
25
27
  children,
26
28
  ...rest
27
29
  }) => {
28
- const { elevation: styleElevation = 3, borderRadius: radius = 0 } =
29
- (StyleSheet.flatten(style) || {}) as ViewStyle;
30
+ const {
31
+ elevation: styleElevation = 3,
32
+ borderRadius,
33
+ overflow,
34
+ height,
35
+ width,
36
+ } = (StyleSheet.flatten(style) || {}) as ViewStyle;
37
+
30
38
  const { dark: isDarkTheme, mode, colors } = theme;
31
- const borderRadius = radius;
32
- const ele = elevation || styleElevation;
39
+
40
+ const elevation = propElevation || styleElevation;
41
+
42
+ const evalationStyles = elevation ? shadow(elevation) : {};
33
43
 
34
44
  return (
35
45
  <Animated.View
36
46
  {...rest}
37
47
  style={[
48
+ style,
38
49
  {
39
- borderRadius,
40
50
  backgroundColor:
41
51
  isDarkTheme && mode === "adaptive"
42
- ? overlay(ele, colors.surface)
52
+ ? overlay(elevation, colors.surface)
43
53
  : colors.surface,
54
+ overflow: Platform.OS === "web" ? "hidden" : "visible",
55
+ elevation,
56
+ ...evalationStyles,
44
57
  },
45
- elevation ? shadow(elevation) : null,
46
- style,
47
58
  ]}
48
59
  >
49
- {children}
60
+ <View
61
+ style={[
62
+ {
63
+ overflow,
64
+ borderRadius,
65
+ height,
66
+ width,
67
+ },
68
+ ]}
69
+ >
70
+ {children}
71
+ </View>
50
72
  </Animated.View>
51
73
  );
52
74
  };
@@ -3,7 +3,7 @@ export const SEED_DATA = {
3
3
  name: "Keyboard Avoiding View",
4
4
  tag: "KeyboardAvoidingView",
5
5
  description: "View that moves out of the way of the virtual keyboard. ",
6
- category: COMPONENT_TYPES.layout,
6
+ category: COMPONENT_TYPES.deprecated,
7
7
  props: {
8
8
  enabled: {
9
9
  label: "Enable",
@@ -9,7 +9,7 @@ export const SEED_DATA = {
9
9
  name: "Keyboard Avoiding View",
10
10
  tag: "KeyboardAvoidingView",
11
11
  description: "View that moves out of the way of the virtual keyboard. ",
12
- category: COMPONENT_TYPES.layout,
12
+ category: COMPONENT_TYPES.deprecated,
13
13
  props: {
14
14
  enabled: {
15
15
  label: "Enable",