@draftbit/core 46.4.4-fedda6.2 → 46.5.1

package/lib/module/styles/DefaultTheme.js

@@ -28,67 +28,80 @@ const DefaultTheme = {
   },
   fonts: configureFonts(),
   typography: {
-    headline1: { ...systemWeights.regular,
+    headline1: {
+      ...systemWeights.regular,
       fontSize: 60,
       letterSpacing: 0,
       lineHeight: 71
     },
-    headline2: { ...systemWeights.regular,
+    headline2: {
+      ...systemWeights.regular,
       fontSize: 48,
       letterSpacing: 0,
       lineHeight: 58
     },
-    headline3: { ...systemWeights.regular,
+    headline3: {
+      ...systemWeights.regular,
       fontSize: 34,
       letterSpacing: 0,
       lineHeight: 40
     },
-    headline4: { ...systemWeights.regular,
+    headline4: {
+      ...systemWeights.regular,
       fontSize: 24,
       letterSpacing: 0,
       lineHeight: 34
     },
-    headline5: { ...systemWeights.regular,
+    headline5: {
+      ...systemWeights.regular,
       fontSize: 20,
       letterSpacing: 0,
       lineHeight: 26
     },
-    subtitle1: { ...systemWeights.regular,
+    subtitle1: {
+      ...systemWeights.regular,
       fontSize: 16,
       letterSpacing: 0,
       lineHeight: 26
     },
-    subtitle2: { ...systemWeights.regular,
+    subtitle2: {
+      ...systemWeights.regular,
       fontSize: 14,
       letterSpacing: 0,
       lineHeight: 22
     },
-    body1: { ...systemWeights.regular,
+    body1: {
+      ...systemWeights.regular,
       fontSize: 16,
       letterSpacing: 0,
       lineHeight: 26
     },
-    body2: { ...systemWeights.regular,
+    body2: {
+      ...systemWeights.regular,
       fontSize: 14,
       letterSpacing: 0,
       lineHeight: 22
     },
-    button: { ...systemWeights.regular,
+    button: {
+      ...systemWeights.regular,
       fontSize: 14,
       letterSpacing: 0,
       lineHeight: 16
     },
-    caption: { ...systemWeights.regular,
+    caption: {
+      ...systemWeights.regular,
       fontSize: 12,
       letterSpacing: 0,
       lineHeight: 16
     },
-    overline: { ...systemWeights.regular,
+    overline: {
+      ...systemWeights.regular,
       fontSize: 12,
       letterSpacing: 2,
       lineHeight: 16
     },
-    headline6: { ...systemWeights.regular,
+    headline6: {
+      ...systemWeights.regular,
       fontSize: 16,
       letterSpacing: 0,
       lineHeight: 24

package/lib/module/styles/fonts.js

@@ -57,7 +57,8 @@ const fontConfig = {
   }
 };
 export default function configureFonts(config) {
-  const fonts = Platform.select({ ...fontConfig,
+  const fonts = Platform.select({
+    ...fontConfig,
     ...config
   });
   return fonts;

package/lib/module/styles/overlay.js

@@ -2,31 +2,27 @@
 import color from "color";
 import { Animated } from "react-native";
 import DarkTheme from "./DarkTheme";
-
 const isAnimatedValue = it => it instanceof Animated.Value;
-
 export default function overlay(elevation) {
   let surfaceColor = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : DarkTheme.colors.surface;
-
   if (isAnimatedValue(elevation)) {
-    const inputRange = [0, 1, 2, 3, 8, 24]; // @ts-expect-error: TS doesn't seem to refine the type correctly
+    const inputRange = [0, 1, 2, 3, 8, 24];
 
+    // @ts-expect-error: TS doesn't seem to refine the type correctly
     return elevation.interpolate({
       inputRange,
       outputRange: inputRange.map(e => {
         return calculateColor(surfaceColor, e);
       })
     });
-  } // @ts-expect-error: TS doesn't seem to refine the type correctly
-
+  }
 
+  // @ts-expect-error: TS doesn't seem to refine the type correctly
   return calculateColor(surfaceColor, elevation);
 }
-
 function calculateColor(surfaceColor) {
   let elevation = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
   let overlayTransparency;
-
   if (elevation >= 1 && elevation <= 24) {
     overlayTransparency = elevationOverlayTransparency[elevation];
   } else if (elevation > 24) {
@@ -34,10 +30,8 @@ function calculateColor(surfaceColor) {
   } else {
     overlayTransparency = elevationOverlayTransparency[1];
   }
-
   return color(surfaceColor).mix(color("white"), overlayTransparency * 0.01).hex();
 }
-
 const elevationOverlayTransparency = {
   1: 5,
   2: 7,

package/lib/module/styles/shadow.js

@@ -3,7 +3,6 @@ const SHADOW_COLOR = "#000";
 const SHADOW_OPACITY = 0.24;
 export default function shadow() {
   let elevation = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
-
   if (elevation instanceof Animated.Value) {
     const inputRange = [0, 1, 2, 3, 8, 24];
     return {
@@ -25,25 +24,20 @@ export default function shadow() {
     if (elevation === 0) {
       return {};
     }
-
     let height, radius;
-
     switch (elevation) {
       case 1:
         height = 0.5;
         radius = 0.75;
         break;
-
       case 2:
         height = 0.75;
         radius = 1.5;
         break;
-
       default:
         height = elevation - 1;
         radius = elevation;
     }
-
     return {
       shadowColor: SHADOW_COLOR,
       shadowOffset: {

package/lib/module/utilities.js

@@ -44,6 +44,7 @@ export function extractBorderAndMarginStyles(style, additionalBorderStyles, addi
     marginStyles
   };
 }
+
 /**
  * Merges a style object on top of another style object. In React Native,
  * keys with undefined values in a style object will still override styles
@@ -56,20 +57,16 @@ export function extractBorderAndMarginStyles(style, additionalBorderStyles, addi
  * `const mergedStyles = StyleSheet.compose({ color: "red" }, { color: undefined })`
  * `const mergedStyles = StyleSheet.flatten([{ color: "red" }, { color: undefined }])`
  */
-
 export function applyStyles(baseStyles, stylesToApply) {
   if (!stylesToApply) {
     return;
   }
-
   const flattenedStyles = StyleSheet.flatten(baseStyles);
-
   for (const [key, value] of Object.entries(stylesToApply)) {
     if (value != null) {
       flattenedStyles[key] = value;
     }
   }
-
   return flattenedStyles;
 }
 export function getValueForRadioButton(value) {

package/lib/typescript/src/components/DatePicker/DatePicker.d.ts

@@ -1,9 +1,9 @@
 import * as React from "react";
-import { StyleProp, ViewStyle, TextInputProps } from "react-native";
+import { StyleProp, ViewStyle, TextStyle, TextInputProps } from "react-native";
 import type { Theme } from "../../styles/DefaultTheme";
 import type { IconSlot } from "../../interfaces/Icon";
 declare type Props = {
-    style?: StyleProp<ViewStyle> & {
+    style?: StyleProp<ViewStyle | TextStyle> & {
         height?: number;
     };
     theme: Theme;
@@ -15,10 +15,14 @@ declare type Props = {
     mode?: "date" | "time" | "datetime";
     type?: "solid" | "underline";
     label?: string;
+    labelSize?: number;
+    labelColor?: string;
     placeholder?: string;
     leftIconName?: string;
     leftIconMode?: "outset" | "inset";
     rightIconName?: string;
+    borderColor?: string;
+    borderColorActive?: string;
 } & IconSlot & TextInputProps;
 declare const _default: React.ComponentType<import("@draftbit/react-theme-provider").$Without<React.PropsWithChildren<Props>, "theme"> & {
     theme?: import("@draftbit/react-theme-provider").$DeepPartial<any> | undefined;

package/lib/typescript/src/components/DatePicker/DatePicker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../../../../src/components/DatePicker/DatePicker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAKL,SAAS,EACT,SAAS,EAET,cAAc,EAKf,MAAM,cAAc,CAAC;AAStB,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,2BAA2B,CAAC;AACvD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAQtD,aAAK,KAAK,GAAG;IACX,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,GAAG;QAAE,MAAM,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IACnD,KAAK,EAAE,KAAK,CAAC;IAOb,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,YAAY,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,KAAK,IAAI,CAAC;IACrC,YAAY,CAAC,EAAE,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,UAAU,CAAC;IACpC,IAAI,CAAC,EAAE,OAAO,GAAG,WAAW,CAAC;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;IAClC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,GAAG,QAAQ,GACV,cAAc,CAAC;;;;AAifjB,wBAAqC"}
+{"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../../../../src/components/DatePicker/DatePicker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAKL,SAAS,EACT,SAAS,EACT,SAAS,EACT,cAAc,EAKf,MAAM,cAAc,CAAC;AAStB,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,2BAA2B,CAAC;AACvD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAStD,aAAK,KAAK,GAAG;IACX,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,GAAG,SAAS,CAAC,GAAG;QAAE,MAAM,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAC/D,KAAK,EAAE,KAAK,CAAC;IAMb,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,YAAY,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,KAAK,IAAI,CAAC;IACrC,YAAY,CAAC,EAAE,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,UAAU,CAAC;IACpC,IAAI,CAAC,EAAE,OAAO,GAAG,WAAW,CAAC;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;IAClC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B,GAAG,QAAQ,GACV,cAAc,CAAC;;;;AA+fjB,wBAAqC"}

package/lib/typescript/src/mappings/DatePicker.d.ts

@@ -5,6 +5,7 @@ export declare const SEED_DATA: {
     category: string;
     layout: null;
     triggers: string[];
+    StylesPanelSections: string[];
     props: {
         type: {
             label: string;
@@ -17,6 +18,17 @@ export declare const SEED_DATA: {
             required: boolean;
             group: string;
         };
+        mode: {
+            label: string;
+            description: string;
+            defaultValue: string;
+            editable: boolean;
+            required: boolean;
+            formType: string;
+            propType: string;
+            options: string[];
+            group: string;
+        };
         label: {
             label: string;
             description: string;
@@ -27,16 +39,46 @@ export declare const SEED_DATA: {
             required: boolean;
             group: string;
         };
-        mode: {
+        labelSize: {
+            label: string;
+            description: string;
+            formType: string;
+            propType: string;
+            group: string;
+            defaultValue: null;
+            editable: boolean;
+            required: boolean;
+            step: number;
+        };
+        labelColor: {
+            group: string;
             label: string;
             description: string;
-            defaultValue: string;
             editable: boolean;
             required: boolean;
+            defaultValue: null;
             formType: string;
             propType: string;
-            options: string[];
+        };
+        borderColor: {
             group: string;
+            label: string;
+            description: string;
+            editable: boolean;
+            required: boolean;
+            defaultValue: null;
+            formType: string;
+            propType: string;
+        };
+        borderColorActive: {
+            group: string;
+            label: string;
+            description: string;
+            editable: boolean;
+            required: boolean;
+            defaultValue: null;
+            formType: string;
+            propType: string;
         };
         format: {
             label: string;

package/lib/typescript/src/mappings/DatePicker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../../../src/mappings/DatePicker.ts"],"names":[],"mappings":"AAgJA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuBrB,CAAC"}
+{"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../../../src/mappings/DatePicker.ts"],"names":[],"mappings":"AA+JA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BrB,CAAC"}

package/lib/typescript/src/mappings/TextArea.d.ts

@@ -58,6 +58,26 @@ export declare const SEED_DATA: {
             formType: string;
             propType: string;
         };
+        blurOnSubmit: {
+            group: string;
+            label: string;
+            description: string;
+            editable: boolean;
+            required: boolean;
+            defaultValue: null;
+            formType: string;
+            propType: string;
+        };
+        disabled: {
+            label: string;
+            description: string;
+            group: string;
+            editable: boolean;
+            required: boolean;
+            formType: string;
+            propType: string;
+            defaultValue: null;
+        };
         caretHidden: {
             group: string;
             label: string;
@@ -84,7 +104,7 @@ export declare const SEED_DATA: {
             description: string;
             editable: boolean;
             required: boolean;
-            defaultValue: boolean;
+            defaultValue: null;
             formType: string;
             propType: string;
         };

package/lib/typescript/src/mappings/TextArea.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TextArea.d.ts","sourceRoot":"","sources":["../../../../src/mappings/TextArea.ts"],"names":[],"mappings":"AASA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4QrB,CAAC"}
+{"version":3,"file":"TextArea.d.ts","sourceRoot":"","sources":["../../../../src/mappings/TextArea.ts"],"names":[],"mappings":"AAUA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuRrB,CAAC"}

package/lib/typescript/src/mappings/TextField.d.ts

@@ -125,7 +125,17 @@ export declare const SEED_DATA: ({
             description: string;
             editable: boolean;
             required: boolean;
-            defaultValue: boolean;
+            defaultValue: null;
+            formType: string;
+            propType: string;
+        };
+        blurOnSubmit: {
+            group: string;
+            label: string;
+            description: string;
+            editable: boolean;
+            required: boolean;
+            defaultValue: null;
             formType: string;
             propType: string;
         };
@@ -432,7 +442,17 @@ export declare const SEED_DATA: ({
             description: string;
             editable: boolean;
             required: boolean;
-            defaultValue: boolean;
+            defaultValue: null;
+            formType: string;
+            propType: string;
+        };
+        blurOnSubmit: {
+            group: string;
+            label: string;
+            description: string;
+            editable: boolean;
+            required: boolean;
+            defaultValue: null;
             formType: string;
             propType: string;
         };

package/lib/typescript/src/mappings/TextField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TextField.d.ts","sourceRoot":"","sources":["../../../../src/mappings/TextField.ts"],"names":[],"mappings":"AAmTA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAgGrB,CAAC"}
+{"version":3,"file":"TextField.d.ts","sourceRoot":"","sources":["../../../../src/mappings/TextField.ts"],"names":[],"mappings":"AA6TA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAgGrB,CAAC"}

package/lib/typescript/src/mappings/TextInput.d.ts

@@ -108,6 +108,16 @@ export declare const SEED_DATA: {
             formType: string;
             propType: string;
         };
+        disabled: {
+            label: string;
+            description: string;
+            group: string;
+            editable: boolean;
+            required: boolean;
+            formType: string;
+            propType: string;
+            defaultValue: null;
+        };
         scrollEnabled: {
             group: string;
             label: string;
@@ -280,7 +290,7 @@ export declare const SEED_DATA: {
             description: string;
             editable: boolean;
             required: boolean;
-            defaultValue: boolean;
+            defaultValue: null;
             formType: string;
             propType: string;
         };
@@ -349,6 +359,16 @@ export declare const SEED_DATA: {
             formType: string;
             propType: string;
         };
+        blurOnSubmit: {
+            group: string;
+            label: string;
+            description: string;
+            editable: boolean;
+            required: boolean;
+            defaultValue: null;
+            formType: string;
+            propType: string;
+        };
         returnKeyType: {
             group: string;
             label: string;

package/lib/typescript/src/mappings/TextInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TextInput.d.ts","sourceRoot":"","sources":["../../../../src/mappings/TextInput.ts"],"names":[],"mappings":"AAUA,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6D3B,CAAC;AAEF,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyVrB,CAAC"}
+{"version":3,"file":"TextInput.d.ts","sourceRoot":"","sources":["../../../../src/mappings/TextInput.ts"],"names":[],"mappings":"AAWA,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6D3B,CAAC;AAEF,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoWrB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@draftbit/core",
-  "version": "46.4.4-fedda6.2+fedda68",
+  "version": "46.5.1",
   "description": "Core (non-native) Components",
   "main": "lib/commonjs/index.js",
   "module": "lib/module/index.js",
@@ -41,7 +41,7 @@
   "dependencies": {
     "@date-io/date-fns": "^1.3.13",
     "@draftbit/react-theme-provider": "^2.1.1",
-    "@draftbit/types": "^46.4.4-fedda6.2+fedda68",
+    "@draftbit/types": "^46.5.1",
     "@material-ui/core": "^4.11.0",
     "@material-ui/pickers": "^3.2.10",
     "@react-native-community/slider": "4.2.3",
@@ -91,5 +91,5 @@
       ]
     ]
   },
-  "gitHead": "fedda68963151dca4aff9eae15447682aa414f88"
+  "gitHead": "40f39c499f1b5e1c867f7e16290ee0ce2a2aee17"
 }

package/src/components/DatePicker/DatePicker.tsx

@@ -23,6 +23,7 @@ import DateTimePicker from "./DatePickerComponent";
 
 import type { Theme } from "../../styles/DefaultTheme";
 import type { IconSlot } from "../../interfaces/Icon";
+import { extractStyles } from "../../utilities";
 
 const AnimatedText = Animated.createAnimatedComponent(Text);
 
@@ -31,14 +32,13 @@ const BLUR_ANIMATION_DURATION = 180;
 const ICON_SIZE = 24;
 
 type Props = {
-  style?: StyleProp<ViewStyle> & { height?: number };
+  style?: StyleProp<ViewStyle | TextStyle> & { height?: number };
   theme: Theme;
   // initialDate?: string;
   // locale?: string;
   // minuteInterval?: number;
   // timeZoneOffsetInMinutes?: number;
   // error?: boolean;
-  // type?: string;
   date?: Date;
   format?: string;
   onDateChange?: (data?: Date) => void;
@@ -47,10 +47,14 @@ type Props = {
   mode?: "date" | "time" | "datetime";
   type?: "solid" | "underline";
   label?: string;
+  labelSize?: number;
+  labelColor?: string;
   placeholder?: string;
   leftIconName?: string;
   leftIconMode?: "outset" | "inset";
   rightIconName?: string;
+  borderColor?: string;
+  borderColorActive?: string;
 } & IconSlot &
   TextInputProps;
 
@@ -84,7 +88,11 @@ const DatePicker: React.FC<React.PropsWithChildren<Props>> = ({
   rightIconName,
   leftIconMode = "inset",
   label,
+  labelSize,
+  labelColor,
   placeholder,
+  borderColor: inputBorderColor,
+  borderColorActive: inputBorderColorActive,
   ...props
 }) => {
   const [value, setValue] = React.useState<any>(date || defaultValue);
@@ -106,6 +114,8 @@ const DatePicker: React.FC<React.PropsWithChildren<Props>> = ({
     width: number;
   }>({ measured: false, width: 0 });
 
+  const { viewStyles, textStyles } = extractStyles(style);
+
   const getValidDate = (): Date => {
     if (!value) {
       return new Date();
@@ -211,8 +221,11 @@ const DatePicker: React.FC<React.PropsWithChildren<Props>> = ({
 
   const MINIMIZED_LABEL_Y_OFFSET = -(typography.caption.lineHeight + 4);
   const OUTLINE_MINIMIZED_LABEL_Y_OFFSET = -(16 * 0.5 + 4);
-  const MAXIMIZED_LABEL_FONT_SIZE = typography.subtitle1.fontSize;
-  const MINIMIZED_LABEL_FONT_SIZE = typography.caption.fontSize;
+  const MAXIMIZED_LABEL_FONT_SIZE =
+    textStyles.fontSize || typography.subtitle1.fontSize;
+  const MINIMIZED_LABEL_FONT_SIZE = labelSize
+    ? labelSize
+    : typography.caption.fontSize;
 
   const hasActiveOutline = focused;
 
@@ -233,9 +246,9 @@ const DatePicker: React.FC<React.PropsWithChildren<Props>> = ({
     underlineColor = "transparent";
     backgroundColor = colors.divider;
   } else {
-    activeColor = colors.primary;
-    placeholderColor = borderColor = colors.light;
-    underlineColor = colors.light;
+    activeColor = inputBorderColorActive || colors.primary;
+    placeholderColor = inputBorderColor || colors.light;
+    underlineColor = inputBorderColor || colors.light;
     backgroundColor = colors.background;
   }
 
@@ -306,6 +319,7 @@ const DatePicker: React.FC<React.PropsWithChildren<Props>> = ({
   const labelStyle = {
     ...typography.subtitle1,
     top: type === "solid" ? 16 : 0,
+    fontFamily: textStyles?.fontFamily,
     left:
       leftIconName && leftIconMode === "inset"
         ? ICON_SIZE + (type === "solid" ? 16 : 12)
@@ -364,7 +378,11 @@ const DatePicker: React.FC<React.PropsWithChildren<Props>> = ({
               <Icon {...leftIconProps} style={leftIconStyle} />
             ) : null}
             <View
-              style={[containerStyle, style ? { height: style.height } : {}]}
+              style={[
+                containerStyle,
+                style ? { height: style.height } : {},
+                viewStyles,
+              ]}
             >
               {type === "underline" ? (
                 // When type === 'flat', render an underline
@@ -406,7 +424,7 @@ const DatePicker: React.FC<React.PropsWithChildren<Props>> = ({
                       type === "solid" ? { paddingHorizontal: 12 } : {},
                       labelStyle,
                       {
-                        color: colors.light,
+                        color: labelColor || colors.light,
                         opacity: labeled.interpolate({
                           inputRange: [0, 1],
                           outputRange: [hasActiveOutline ? 1 : 0, 0],
@@ -423,7 +441,7 @@ const DatePicker: React.FC<React.PropsWithChildren<Props>> = ({
                       type === "solid" ? { paddingHorizontal: 12 } : {},
                       labelStyle,
                       {
-                        color: placeholderColor,
+                        color: labelColor || placeholderColor,
                         opacity: hasActiveOutline ? labeled : 1,
                       },
                     ]}
@@ -453,7 +471,7 @@ const DatePicker: React.FC<React.PropsWithChildren<Props>> = ({
                 onFocus={_handleFocus}
                 onBlur={_handleBlur}
                 underlineColorAndroid={"transparent"}
-                style={inputStyles}
+                style={[inputStyles, textStyles]}
                 {...props}
               />
             </View>