react-native-better-html 1.0.23 → 1.0.25

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/dist/index.d.mts +21 -6
  2. package/dist/index.d.ts +21 -6
  3. package/dist/index.js +181 -68
  4. package/dist/index.js.map +1 -1
  5. package/dist/index.mjs +165 -53
  6. package/dist/index.mjs.map +1 -1
  7. package/package.json +1 -1
package/dist/index.d.mts CHANGED
@@ -50,7 +50,7 @@ type BetterComponentsProviderProps = BetterProviderCommonProps & {
50
50
  config?: BetterComponentsProviderConfig;
51
51
  };
52
52
  declare function BetterComponentsProvider({ config, ...props }: BetterComponentsProviderProps): react_jsx_runtime.JSX.Element;
53
- declare const _default$4: react.MemoExoticComponent<typeof BetterComponentsProvider>;
53
+ declare const _default$5: react.MemoExoticComponent<typeof BetterComponentsProvider>;
54
54
 
55
55
  type ComponentStyle<Style extends ViewStyle = ViewStyle> = OmitProps<Style, "shadowOffset" | ComponentExcludeMarginProps | ComponentExcludePaddingProps> & {
56
56
  shadowOffsetWidth?: number;
@@ -107,7 +107,7 @@ type IconProps = {
107
107
  color?: ColorValue;
108
108
  } & OmitProps<ViewProps, "width" | "height" | "pressType">;
109
109
  declare function Icon({ name, nameIOS, size, color, ...props }: IconProps): react_jsx_runtime.JSX.Element;
110
- declare const _default$3: react.MemoExoticComponent<typeof Icon>;
110
+ declare const _default$4: react.MemoExoticComponent<typeof Icon>;
111
111
 
112
112
  type InputFieldProps = {
113
113
  flex?: ViewStyle["flex"];
@@ -195,7 +195,19 @@ type SwitchProps = {
195
195
  onChange?: (isEnabled: boolean) => void;
196
196
  };
197
197
  declare function Switch({ isEnabled, defaultIsEnabled, disabled, onChange }: SwitchProps): react_jsx_runtime.JSX.Element;
198
- declare const _default$2: react.MemoExoticComponent<typeof Switch>;
198
+ declare const _default$3: react.MemoExoticComponent<typeof Switch>;
199
+
200
+ type CheckBoxProps = {
201
+ isChecked?: boolean;
202
+ defaultIsChecked?: boolean;
203
+ /** @default 36 */
204
+ size?: number;
205
+ /** @default false */
206
+ disabled?: boolean;
207
+ onChange?: (isChecked: boolean) => void;
208
+ };
209
+ declare function CheckBox({ isChecked, defaultIsChecked, size, disabled, onChange }: CheckBoxProps): react_jsx_runtime.JSX.Element;
210
+ declare const _default$2: react.MemoExoticComponent<typeof CheckBox>;
199
211
 
200
212
  declare function useDevice(): {
201
213
  safeArea: {
@@ -241,6 +253,7 @@ declare function useForm<FormFields extends Record<string | number, FormFieldVal
241
253
  setFieldsValue: (values: Partial<FormFields>) => void;
242
254
  getInputFieldProps: <FieldName extends keyof FormFields>(field: FieldName) => ComponentPropWithRef<InputFieldRef, InputFieldProps>;
243
255
  getSwitchProps: <FieldName extends keyof FormFields>(field: FieldName, insideListItem?: boolean) => SwitchProps;
256
+ getCheckBoxProps: <FieldName extends keyof FormFields>(field: FieldName, insideListItem?: boolean) => CheckBoxProps;
244
257
  focusField: (field: keyof FormFields) => void;
245
258
  inputFieldRefs: Record<keyof FormFields, TextInput | undefined>;
246
259
  validate: () => {};
@@ -501,7 +514,7 @@ type ListItemProps = {
501
514
  title?: string;
502
515
  description?: string;
503
516
  descriptionSelectable?: boolean;
504
- rightElement?: "arrow" | "switch";
517
+ rightElement?: "arrow" | "switch" | "checkBox";
505
518
  /** @default theme.colors.backgroundBase */
506
519
  backgroundColor?: ViewProps["backgroundColor"];
507
520
  /** @default false */
@@ -511,8 +524,10 @@ type ListItemProps = {
511
524
  rightValueSelectable?: boolean;
512
525
  switchIsEnabled?: boolean;
513
526
  switchOnChange?: (isEnabled: boolean) => void;
527
+ checkBoxIsChecked?: boolean;
528
+ checkBoxOnChange?: (isChecked: boolean) => void;
514
529
  };
515
- declare function ListItem({ icon, iconIOS, title, description, descriptionSelectable, rightElement, backgroundColor, insideScreenHolder, onPress, rightValue, rightValueSelectable, switchIsEnabled, switchOnChange, }: ListItemProps): react_jsx_runtime.JSX.Element;
530
+ declare function ListItem({ icon, iconIOS, title, description, descriptionSelectable, rightElement, backgroundColor, insideScreenHolder, onPress, rightValue, rightValueSelectable, switchIsEnabled, switchOnChange, checkBoxIsChecked, checkBoxOnChange, }: ListItemProps): react_jsx_runtime.JSX.Element;
516
531
  declare const _default: react.MemoExoticComponent<typeof ListItem>;
517
532
 
518
533
  type AlertsPluginOptions = {
@@ -531,4 +546,4 @@ type AsyncStoragePluginOptions = {};
531
546
  declare const defaultAsyncStoragePluginOptions: Required<AsyncStoragePluginOptions>;
532
547
  declare const asyncStoragePlugin: BetterComponentsPluginConstructor<AsyncStoragePluginOptions>;
533
548
 
534
- export { type AlertsPluginOptions, Animate, type AnimateTextProps, type AnimateViewProps, type AppConfig, type AsyncStoragePluginOptions, type BetterComponentsConfig, type BetterComponentsPlugin, _default$4 as BetterComponentsProvider, type BetterComponentsProviderConfig, Button, type ButtonProps, type ComponentMarginProps, type ComponentPaddingProps, type FooterProps, _default$3 as Icon, type IconNameIOS, type IconProps, Image, type ImageProps, InputField, type InputFieldProps, type InputFieldRef, _default as ListItem, type ListItemProps, Loader, type LoaderProps, type LoaderSize, type PluginName, ScreenHolder, type ScreenHolderProps, _default$1 as StatusBar, type StatusBarProps, _default$2 as Switch, type SwitchProps, Text, type TextProps, View, type ViewProps, alertControls, alertsPlugin, asyncStoragePlugin, defaultAlertsPluginOptions, defaultAsyncStoragePluginOptions, generateAsyncStorage, getFormErrorObject, pressStrength, useAlertControls, useBetterComponentsContext, useDevice, useEventEmitter, useForm, useKeyboard };
549
+ export { type AlertsPluginOptions, Animate, type AnimateTextProps, type AnimateViewProps, type AppConfig, type AsyncStoragePluginOptions, type BetterComponentsConfig, type BetterComponentsPlugin, _default$5 as BetterComponentsProvider, type BetterComponentsProviderConfig, Button, type ButtonProps, _default$2 as CheckBox, type CheckBoxProps, type ComponentMarginProps, type ComponentPaddingProps, type FooterProps, _default$4 as Icon, type IconNameIOS, type IconProps, Image, type ImageProps, InputField, type InputFieldProps, type InputFieldRef, _default as ListItem, type ListItemProps, Loader, type LoaderProps, type LoaderSize, type PluginName, ScreenHolder, type ScreenHolderProps, _default$1 as StatusBar, type StatusBarProps, _default$3 as Switch, type SwitchProps, Text, type TextProps, View, type ViewProps, alertControls, alertsPlugin, asyncStoragePlugin, defaultAlertsPluginOptions, defaultAsyncStoragePluginOptions, generateAsyncStorage, getFormErrorObject, pressStrength, useAlertControls, useBetterComponentsContext, useDevice, useEventEmitter, useForm, useKeyboard };
package/dist/index.d.ts CHANGED
@@ -50,7 +50,7 @@ type BetterComponentsProviderProps = BetterProviderCommonProps & {
50
50
  config?: BetterComponentsProviderConfig;
51
51
  };
52
52
  declare function BetterComponentsProvider({ config, ...props }: BetterComponentsProviderProps): react_jsx_runtime.JSX.Element;
53
- declare const _default$4: react.MemoExoticComponent<typeof BetterComponentsProvider>;
53
+ declare const _default$5: react.MemoExoticComponent<typeof BetterComponentsProvider>;
54
54
 
55
55
  type ComponentStyle<Style extends ViewStyle = ViewStyle> = OmitProps<Style, "shadowOffset" | ComponentExcludeMarginProps | ComponentExcludePaddingProps> & {
56
56
  shadowOffsetWidth?: number;
@@ -107,7 +107,7 @@ type IconProps = {
107
107
  color?: ColorValue;
108
108
  } & OmitProps<ViewProps, "width" | "height" | "pressType">;
109
109
  declare function Icon({ name, nameIOS, size, color, ...props }: IconProps): react_jsx_runtime.JSX.Element;
110
- declare const _default$3: react.MemoExoticComponent<typeof Icon>;
110
+ declare const _default$4: react.MemoExoticComponent<typeof Icon>;
111
111
 
112
112
  type InputFieldProps = {
113
113
  flex?: ViewStyle["flex"];
@@ -195,7 +195,19 @@ type SwitchProps = {
195
195
  onChange?: (isEnabled: boolean) => void;
196
196
  };
197
197
  declare function Switch({ isEnabled, defaultIsEnabled, disabled, onChange }: SwitchProps): react_jsx_runtime.JSX.Element;
198
- declare const _default$2: react.MemoExoticComponent<typeof Switch>;
198
+ declare const _default$3: react.MemoExoticComponent<typeof Switch>;
199
+
200
+ type CheckBoxProps = {
201
+ isChecked?: boolean;
202
+ defaultIsChecked?: boolean;
203
+ /** @default 36 */
204
+ size?: number;
205
+ /** @default false */
206
+ disabled?: boolean;
207
+ onChange?: (isChecked: boolean) => void;
208
+ };
209
+ declare function CheckBox({ isChecked, defaultIsChecked, size, disabled, onChange }: CheckBoxProps): react_jsx_runtime.JSX.Element;
210
+ declare const _default$2: react.MemoExoticComponent<typeof CheckBox>;
199
211
 
200
212
  declare function useDevice(): {
201
213
  safeArea: {
@@ -241,6 +253,7 @@ declare function useForm<FormFields extends Record<string | number, FormFieldVal
241
253
  setFieldsValue: (values: Partial<FormFields>) => void;
242
254
  getInputFieldProps: <FieldName extends keyof FormFields>(field: FieldName) => ComponentPropWithRef<InputFieldRef, InputFieldProps>;
243
255
  getSwitchProps: <FieldName extends keyof FormFields>(field: FieldName, insideListItem?: boolean) => SwitchProps;
256
+ getCheckBoxProps: <FieldName extends keyof FormFields>(field: FieldName, insideListItem?: boolean) => CheckBoxProps;
244
257
  focusField: (field: keyof FormFields) => void;
245
258
  inputFieldRefs: Record<keyof FormFields, TextInput | undefined>;
246
259
  validate: () => {};
@@ -501,7 +514,7 @@ type ListItemProps = {
501
514
  title?: string;
502
515
  description?: string;
503
516
  descriptionSelectable?: boolean;
504
- rightElement?: "arrow" | "switch";
517
+ rightElement?: "arrow" | "switch" | "checkBox";
505
518
  /** @default theme.colors.backgroundBase */
506
519
  backgroundColor?: ViewProps["backgroundColor"];
507
520
  /** @default false */
@@ -511,8 +524,10 @@ type ListItemProps = {
511
524
  rightValueSelectable?: boolean;
512
525
  switchIsEnabled?: boolean;
513
526
  switchOnChange?: (isEnabled: boolean) => void;
527
+ checkBoxIsChecked?: boolean;
528
+ checkBoxOnChange?: (isChecked: boolean) => void;
514
529
  };
515
- declare function ListItem({ icon, iconIOS, title, description, descriptionSelectable, rightElement, backgroundColor, insideScreenHolder, onPress, rightValue, rightValueSelectable, switchIsEnabled, switchOnChange, }: ListItemProps): react_jsx_runtime.JSX.Element;
530
+ declare function ListItem({ icon, iconIOS, title, description, descriptionSelectable, rightElement, backgroundColor, insideScreenHolder, onPress, rightValue, rightValueSelectable, switchIsEnabled, switchOnChange, checkBoxIsChecked, checkBoxOnChange, }: ListItemProps): react_jsx_runtime.JSX.Element;
516
531
  declare const _default: react.MemoExoticComponent<typeof ListItem>;
517
532
 
518
533
  type AlertsPluginOptions = {
@@ -531,4 +546,4 @@ type AsyncStoragePluginOptions = {};
531
546
  declare const defaultAsyncStoragePluginOptions: Required<AsyncStoragePluginOptions>;
532
547
  declare const asyncStoragePlugin: BetterComponentsPluginConstructor<AsyncStoragePluginOptions>;
533
548
 
534
- export { type AlertsPluginOptions, Animate, type AnimateTextProps, type AnimateViewProps, type AppConfig, type AsyncStoragePluginOptions, type BetterComponentsConfig, type BetterComponentsPlugin, _default$4 as BetterComponentsProvider, type BetterComponentsProviderConfig, Button, type ButtonProps, type ComponentMarginProps, type ComponentPaddingProps, type FooterProps, _default$3 as Icon, type IconNameIOS, type IconProps, Image, type ImageProps, InputField, type InputFieldProps, type InputFieldRef, _default as ListItem, type ListItemProps, Loader, type LoaderProps, type LoaderSize, type PluginName, ScreenHolder, type ScreenHolderProps, _default$1 as StatusBar, type StatusBarProps, _default$2 as Switch, type SwitchProps, Text, type TextProps, View, type ViewProps, alertControls, alertsPlugin, asyncStoragePlugin, defaultAlertsPluginOptions, defaultAsyncStoragePluginOptions, generateAsyncStorage, getFormErrorObject, pressStrength, useAlertControls, useBetterComponentsContext, useDevice, useEventEmitter, useForm, useKeyboard };
549
+ export { type AlertsPluginOptions, Animate, type AnimateTextProps, type AnimateViewProps, type AppConfig, type AsyncStoragePluginOptions, type BetterComponentsConfig, type BetterComponentsPlugin, _default$5 as BetterComponentsProvider, type BetterComponentsProviderConfig, Button, type ButtonProps, _default$2 as CheckBox, type CheckBoxProps, type ComponentMarginProps, type ComponentPaddingProps, type FooterProps, _default$4 as Icon, type IconNameIOS, type IconProps, Image, type ImageProps, InputField, type InputFieldProps, type InputFieldRef, _default as ListItem, type ListItemProps, Loader, type LoaderProps, type LoaderSize, type PluginName, ScreenHolder, type ScreenHolderProps, _default$1 as StatusBar, type StatusBarProps, _default$3 as Switch, type SwitchProps, Text, type TextProps, View, type ViewProps, alertControls, alertsPlugin, asyncStoragePlugin, defaultAlertsPluginOptions, defaultAsyncStoragePluginOptions, generateAsyncStorage, getFormErrorObject, pressStrength, useAlertControls, useBetterComponentsContext, useDevice, useEventEmitter, useForm, useKeyboard };
package/dist/index.js CHANGED
@@ -33,6 +33,7 @@ __export(index_exports, {
33
33
  Animate: () => Animate_default,
34
34
  BetterComponentsProvider: () => BetterComponentsProvider_default,
35
35
  Button: () => Button_default,
36
+ CheckBox: () => CheckBox_default,
36
37
  Icon: () => Icon_default,
37
38
  Image: () => Image_default,
38
39
  InputField: () => InputField_default,
@@ -46,38 +47,38 @@ __export(index_exports, {
46
47
  alertControls: () => alertControls,
47
48
  alertsPlugin: () => alertsPlugin,
48
49
  asyncStoragePlugin: () => asyncStoragePlugin,
49
- colorThemeControls: () => import_react_better_core17.colorThemeControls,
50
- countries: () => import_react_better_core17.countries,
51
- darkenColor: () => import_react_better_core17.darkenColor,
50
+ colorThemeControls: () => import_react_better_core18.colorThemeControls,
51
+ countries: () => import_react_better_core18.countries,
52
+ darkenColor: () => import_react_better_core18.darkenColor,
52
53
  defaultAlertsPluginOptions: () => defaultAlertsPluginOptions,
53
54
  defaultAsyncStoragePluginOptions: () => defaultAsyncStoragePluginOptions,
54
- desaturateColor: () => import_react_better_core17.desaturateColor,
55
- eventPreventDefault: () => import_react_better_core17.eventPreventDefault,
56
- eventPreventStop: () => import_react_better_core17.eventPreventStop,
57
- eventStopPropagation: () => import_react_better_core17.eventStopPropagation,
58
- formatPhoneNumber: () => import_react_better_core17.formatPhoneNumber,
55
+ desaturateColor: () => import_react_better_core18.desaturateColor,
56
+ eventPreventDefault: () => import_react_better_core18.eventPreventDefault,
57
+ eventPreventStop: () => import_react_better_core18.eventPreventStop,
58
+ eventStopPropagation: () => import_react_better_core18.eventStopPropagation,
59
+ formatPhoneNumber: () => import_react_better_core18.formatPhoneNumber,
59
60
  generateAsyncStorage: () => generateAsyncStorage,
60
- generateRandomString: () => import_react_better_core17.generateRandomString,
61
+ generateRandomString: () => import_react_better_core18.generateRandomString,
61
62
  getFormErrorObject: () => getFormErrorObject,
62
- getPluralWord: () => import_react_better_core17.getPluralWord,
63
- lightenColor: () => import_react_better_core17.lightenColor,
64
- loaderControls: () => import_react_better_core17.loaderControls,
63
+ getPluralWord: () => import_react_better_core18.getPluralWord,
64
+ lightenColor: () => import_react_better_core18.lightenColor,
65
+ loaderControls: () => import_react_better_core18.loaderControls,
65
66
  pressStrength: () => pressStrength,
66
- saturateColor: () => import_react_better_core17.saturateColor,
67
+ saturateColor: () => import_react_better_core18.saturateColor,
67
68
  useAlertControls: () => useAlertControls,
68
69
  useBetterComponentsContext: () => useBetterComponentsContext,
69
- useBooleanState: () => import_react_better_core17.useBooleanState,
70
- useDebounceState: () => import_react_better_core17.useDebounceState,
70
+ useBooleanState: () => import_react_better_core18.useBooleanState,
71
+ useDebounceState: () => import_react_better_core18.useDebounceState,
71
72
  useDevice: () => useDevice,
72
73
  useEventEmitter: () => useEventEmitter,
73
74
  useForm: () => useForm,
74
75
  useKeyboard: () => useKeyboard,
75
- useLoader: () => import_react_better_core17.useLoader,
76
- useLoaderControls: () => import_react_better_core17.useLoaderControls,
77
- useTheme: () => import_react_better_core17.useTheme
76
+ useLoader: () => import_react_better_core18.useLoader,
77
+ useLoaderControls: () => import_react_better_core18.useLoaderControls,
78
+ useTheme: () => import_react_better_core18.useTheme
78
79
  });
79
80
  module.exports = __toCommonJS(index_exports);
80
- var import_react_better_core17 = require("react-better-core");
81
+ var import_react_better_core18 = require("react-better-core");
81
82
 
82
83
  // src/components/BetterComponentsProvider.tsx
83
84
  var import_react12 = require("react");
@@ -507,6 +508,22 @@ function useForm(options) {
507
508
  },
508
509
  [values, setFieldValue]
509
510
  );
511
+ const getCheckBoxProps = (0, import_react.useCallback)(
512
+ (field, insideListItem) => {
513
+ return insideListItem ? {
514
+ checkBoxIsChecked: values[field],
515
+ checkBoxOnChange: (value) => {
516
+ setFieldValue(field, value);
517
+ }
518
+ } : {
519
+ isChecked: values[field],
520
+ onChange: (value) => {
521
+ setFieldValue(field, value);
522
+ }
523
+ };
524
+ },
525
+ [values, setFieldValue]
526
+ );
510
527
  const reset = (0, import_react.useCallback)(() => {
511
528
  setValues(defaultValues);
512
529
  setErrors({});
@@ -531,6 +548,7 @@ function useForm(options) {
531
548
  setFieldsValue,
532
549
  getInputFieldProps,
533
550
  getSwitchProps,
551
+ getCheckBoxProps,
534
552
  focusField,
535
553
  inputFieldRefs: inputFieldRefs.current,
536
554
  validate: validateForm,
@@ -561,6 +579,8 @@ var import_react_better_core2 = require("react-better-core");
561
579
  var import_jsx_runtime = require("react/jsx-runtime");
562
580
  var touchableHighlightStyleMoveToContent = [
563
581
  "width",
582
+ "alignItems",
583
+ "justifyContent",
564
584
  "backgroundColor",
565
585
  "padding",
566
586
  "paddingTop",
@@ -1907,6 +1927,7 @@ var InputFieldComponent = (0, import_react14.forwardRef)(
1907
1927
  /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Text_default, { fontSize: 14, color: isError ? theme2.colors.error : theme2.colors.textSecondary, children: label }),
1908
1928
  required && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Text_default, { color: theme2.colors.error, children: "*" })
1909
1929
  ] });
1930
+ const borderColor = isFocused ? theme2.colors.primary : isError ? theme2.colors.error : theme2.colors.border;
1910
1931
  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
1911
1932
  Animate_default.View,
1912
1933
  {
@@ -1918,10 +1939,11 @@ var InputFieldComponent = (0, import_react14.forwardRef)(
1918
1939
  children: [
1919
1940
  isIOSDateTime && !iOSDateTimeFullSize ? void 0 : labelComponent,
1920
1941
  /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(View_default, { isRow: true, position: "relative", alignItems: "center", height: readyHeight, children: [
1921
- prefix && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
1942
+ prefix && /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
1922
1943
  View_default,
1923
1944
  {
1924
1945
  isRow: true,
1946
+ position: "relative",
1925
1947
  height: "100%",
1926
1948
  backgroundColor: prefixSuffixBackgroundColor,
1927
1949
  alignItems: "center",
@@ -1932,16 +1954,23 @@ var InputFieldComponent = (0, import_react14.forwardRef)(
1932
1954
  borderBottomLeftRadius: theme2.styles.borderRadius,
1933
1955
  borderColor: theme2.colors.border,
1934
1956
  paddingHorizontal: readyPaddingHorizontal,
1957
+ zIndex: 1,
1935
1958
  onPress: onPressPrefix,
1936
- children: typeof prefix === "string" ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
1937
- Text_default,
1938
- {
1939
- fontWeight: 700,
1940
- lineHeight,
1941
- marginTop: import_react_native9.Platform.OS === "ios" && onPressPrefix ? readyPaddingVertical : void 0,
1942
- children: prefix
1943
- }
1944
- ) : prefix
1959
+ children: [
1960
+ typeof prefix === "string" ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Text_default, { fontWeight: 700, lineHeight, children: prefix }) : prefix,
1961
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
1962
+ Animate_default.View,
1963
+ {
1964
+ position: "absolute",
1965
+ top: 0,
1966
+ right: -1,
1967
+ width: 1,
1968
+ height: "100%",
1969
+ initialBackgroundColor: theme2.colors.border,
1970
+ animateBackgroundColor: borderColor
1971
+ }
1972
+ )
1973
+ ]
1945
1974
  }
1946
1975
  ),
1947
1976
  isIOSDateTime ? /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_jsx_runtime12.Fragment, { children: [
@@ -1976,13 +2005,15 @@ var InputFieldComponent = (0, import_react14.forwardRef)(
1976
2005
  flex: 1,
1977
2006
  justifyContent: "center",
1978
2007
  backgroundColor: theme2.colors.backgroundContent,
1979
- borderTopLeftRadius: prefix ? 0 : theme2.styles.borderRadius,
1980
- borderBottomLeftRadius: prefix ? 0 : theme2.styles.borderRadius,
1981
- borderTopRightRadius: suffix ? 0 : theme2.styles.borderRadius,
1982
- borderBottomRightRadius: suffix ? 0 : theme2.styles.borderRadius,
2008
+ borderTopLeftRadius: prefix ? 2 : theme2.styles.borderRadius,
2009
+ borderBottomLeftRadius: prefix ? 2 : theme2.styles.borderRadius,
2010
+ borderTopRightRadius: suffix ? 2 : theme2.styles.borderRadius,
2011
+ borderBottomRightRadius: suffix ? 2 : theme2.styles.borderRadius,
1983
2012
  borderWidth,
2013
+ marginLeft: prefix ? -2 : 0,
2014
+ marginRight: suffix ? -2 : 0,
1984
2015
  initialBorderColor: theme2.colors.border,
1985
- animateBorderColor: isFocused ? theme2.colors.primary : isError ? theme2.colors.error : theme2.colors.border,
2016
+ animateBorderColor: borderColor,
1986
2017
  overflow: "hidden",
1987
2018
  children: [
1988
2019
  leftIcon && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
@@ -2049,29 +2080,38 @@ var InputFieldComponent = (0, import_react14.forwardRef)(
2049
2080
  )
2050
2081
  }
2051
2082
  ),
2052
- suffix && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
2083
+ suffix && /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
2053
2084
  View_default,
2054
2085
  {
2055
2086
  isRow: true,
2087
+ position: "relative",
2056
2088
  height: "100%",
2057
2089
  backgroundColor: prefixSuffixBackgroundColor,
2058
2090
  alignItems: "center",
2091
+ justifyContent: "center",
2059
2092
  borderWidth,
2060
2093
  borderLeftWidth: 0,
2061
2094
  borderTopRightRadius: theme2.styles.borderRadius,
2062
2095
  borderBottomRightRadius: theme2.styles.borderRadius,
2063
2096
  borderColor: theme2.colors.border,
2064
2097
  paddingHorizontal: readyPaddingHorizontal,
2098
+ zIndex: 1,
2065
2099
  onPress: onPressSuffix,
2066
- children: typeof suffix === "string" ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
2067
- Text_default,
2068
- {
2069
- fontWeight: 700,
2070
- lineHeight,
2071
- marginTop: import_react_native9.Platform.OS === "ios" && onPressSuffix ? readyPaddingVertical : void 0,
2072
- children: suffix
2073
- }
2074
- ) : suffix
2100
+ children: [
2101
+ typeof suffix === "string" ? /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Text_default, { fontWeight: 700, lineHeight, children: suffix }) : suffix,
2102
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
2103
+ Animate_default.View,
2104
+ {
2105
+ position: "absolute",
2106
+ top: 0,
2107
+ left: -1,
2108
+ width: 1,
2109
+ height: "100%",
2110
+ initialBackgroundColor: theme2.colors.border,
2111
+ animateBackgroundColor: borderColor
2112
+ }
2113
+ )
2114
+ ]
2075
2115
  }
2076
2116
  )
2077
2117
  ] }),
@@ -2219,10 +2259,10 @@ function Switch({ isEnabled, defaultIsEnabled, disabled, onChange }) {
2219
2259
  width: "100%",
2220
2260
  height: ballGap + ballSize + ballGap,
2221
2261
  borderRadius: 999,
2222
- initialOpacity: 1,
2223
- animateOpacity: disabled ? 0.6 : 1,
2224
2262
  initialBackgroundColor: theme2.colors.border,
2225
2263
  animateBackgroundColor: enabled ? theme2.colors.primary : theme2.colors.border,
2264
+ initialOpacity: 1,
2265
+ animateOpacity: disabled ? 0.6 : 1,
2226
2266
  children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
2227
2267
  Animate_default.View,
2228
2268
  {
@@ -2230,6 +2270,9 @@ function Switch({ isEnabled, defaultIsEnabled, disabled, onChange }) {
2230
2270
  height: ballSize,
2231
2271
  top: ballGap,
2232
2272
  borderRadius: 999,
2273
+ transitionType: "spring",
2274
+ transitionDamping: 20,
2275
+ transitionStiffness: 230,
2233
2276
  backgroundColor: theme2.colors.backgroundContent,
2234
2277
  initialX: ballGap,
2235
2278
  animateX: enabled ? holderWidth - ballGap - ballSize : ballGap
@@ -2242,28 +2285,95 @@ function Switch({ isEnabled, defaultIsEnabled, disabled, onChange }) {
2242
2285
  }
2243
2286
  var Switch_default = (0, import_react15.memo)(Switch);
2244
2287
 
2245
- // src/components/StatusBar.tsx
2288
+ // src/components/CheckBox.tsx
2246
2289
  var import_react16 = require("react");
2247
- var import_react_better_core15 = require("react-better-core");
2248
2290
  var import_react_native11 = require("react-native");
2291
+ var import_react_better_core15 = require("react-better-core");
2249
2292
  var import_jsx_runtime14 = require("react/jsx-runtime");
2250
- function StatusBar({ darkStatusBar, hidden, barStyle, androidBarStyle, iOSBarStyle }) {
2293
+ function CheckBox({ isChecked, defaultIsChecked, size = 36, disabled, onChange }) {
2251
2294
  const theme2 = (0, import_react_better_core15.useTheme)();
2295
+ const [checked, setChecked] = (0, import_react_better_core15.useBooleanState)(isChecked ?? defaultIsChecked);
2296
+ const onPressElement = (0, import_react16.useCallback)(() => {
2297
+ onChange?.(!checked);
2298
+ setChecked.toggle();
2299
+ }, [onChange, checked]);
2300
+ (0, import_react16.useEffect)(() => {
2301
+ if (isChecked === void 0) return;
2302
+ setChecked.setState(isChecked);
2303
+ }, [isChecked]);
2252
2304
  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
2253
- import_react_native11.StatusBar,
2305
+ View_default,
2254
2306
  {
2255
- backgroundColor: darkStatusBar ? theme2.colors.backgroundSecondary : void 0,
2256
- barStyle: barStyle ?? (import_react_native11.Platform.OS === "android" ? androidBarStyle : iOSBarStyle),
2257
- hidden
2307
+ width: size,
2308
+ borderRadius: theme2.styles.borderRadius,
2309
+ pressStrength: pressStrength().p05,
2310
+ disabled,
2311
+ onPress: !disabled ? onPressElement : void 0,
2312
+ children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
2313
+ Animate_default.View,
2314
+ {
2315
+ width: "100%",
2316
+ height: size,
2317
+ borderWidth: 1,
2318
+ borderRadius: theme2.styles.borderRadius,
2319
+ initialBackgroundColor: theme2.colors.backgroundContent,
2320
+ animateBackgroundColor: checked ? theme2.colors.primary : theme2.colors.backgroundContent,
2321
+ initialBorderColor: theme2.colors.border,
2322
+ animateBorderColor: checked ? theme2.colors.primary : theme2.colors.border,
2323
+ initialOpacity: 1,
2324
+ animateOpacity: disabled ? 0.6 : 1,
2325
+ children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
2326
+ Animate_default.View,
2327
+ {
2328
+ width: "100%",
2329
+ height: "100%",
2330
+ alignItems: "center",
2331
+ justifyContent: "center",
2332
+ transitionType: "spring",
2333
+ transitionDamping: 20,
2334
+ transitionStiffness: 230,
2335
+ initialScale: 0,
2336
+ animateScale: checked ? 1 : 0,
2337
+ children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
2338
+ Icon_default,
2339
+ {
2340
+ name: "check",
2341
+ nameIOS: "checkmark",
2342
+ size: size * (import_react_native11.Platform.OS === "ios" ? 0.5 : 0.6),
2343
+ color: theme2.colors.base
2344
+ }
2345
+ )
2346
+ }
2347
+ )
2348
+ }
2349
+ )
2258
2350
  }
2259
2351
  );
2260
2352
  }
2261
- var StatusBar_default = (0, import_react16.memo)(StatusBar);
2353
+ var CheckBox_default = (0, import_react16.memo)(CheckBox);
2262
2354
 
2263
- // src/components/ListItem.tsx
2355
+ // src/components/StatusBar.tsx
2264
2356
  var import_react17 = require("react");
2265
2357
  var import_react_better_core16 = require("react-better-core");
2358
+ var import_react_native12 = require("react-native");
2266
2359
  var import_jsx_runtime15 = require("react/jsx-runtime");
2360
+ function StatusBar({ darkStatusBar, hidden, barStyle, androidBarStyle, iOSBarStyle }) {
2361
+ const theme2 = (0, import_react_better_core16.useTheme)();
2362
+ return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
2363
+ import_react_native12.StatusBar,
2364
+ {
2365
+ backgroundColor: darkStatusBar ? theme2.colors.backgroundSecondary : void 0,
2366
+ barStyle: barStyle ?? (import_react_native12.Platform.OS === "android" ? androidBarStyle : iOSBarStyle),
2367
+ hidden
2368
+ }
2369
+ );
2370
+ }
2371
+ var StatusBar_default = (0, import_react17.memo)(StatusBar);
2372
+
2373
+ // src/components/ListItem.tsx
2374
+ var import_react18 = require("react");
2375
+ var import_react_better_core17 = require("react-better-core");
2376
+ var import_jsx_runtime16 = require("react/jsx-runtime");
2267
2377
  function ListItem({
2268
2378
  icon,
2269
2379
  iconIOS,
@@ -2277,12 +2387,14 @@ function ListItem({
2277
2387
  rightValue,
2278
2388
  rightValueSelectable,
2279
2389
  switchIsEnabled,
2280
- switchOnChange
2390
+ switchOnChange,
2391
+ checkBoxIsChecked,
2392
+ checkBoxOnChange
2281
2393
  }) {
2282
- const theme2 = (0, import_react_better_core16.useTheme)();
2394
+ const theme2 = (0, import_react_better_core17.useTheme)();
2283
2395
  const device = useDevice();
2284
2396
  const sideSpace = theme2.styles.space;
2285
- return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
2397
+ return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
2286
2398
  View_default,
2287
2399
  {
2288
2400
  width: insideScreenHolder ? device.windowDimensions.width : "100%",
@@ -2292,15 +2404,15 @@ function ListItem({
2292
2404
  paddingHorizontal: sideSpace,
2293
2405
  pressStrength: pressStrength().p05,
2294
2406
  onPress,
2295
- children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(View_default, { isRow: true, alignItems: "center", gap: theme2.styles.space, children: [
2296
- icon && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Icon_default, { name: icon, nameIOS: iconIOS, size: 22, color: theme2.colors.primary }),
2297
- /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(View_default, { flex: 1, flexDirection: "row", alignItems: "center", gap: theme2.styles.gap, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(View_default, { flex: 1, children: [
2298
- title && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Text_default, { fontSize: 20, fontWeight: 700, children: title }),
2299
- description && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Text_default.body, { selectable: descriptionSelectable, children: description })
2407
+ children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(View_default, { isRow: true, alignItems: "center", gap: theme2.styles.space, children: [
2408
+ icon && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Icon_default, { name: icon, nameIOS: iconIOS, size: 22, color: theme2.colors.primary }),
2409
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(View_default, { flex: 1, flexDirection: "row", alignItems: "center", gap: theme2.styles.gap, children: /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(View_default, { flex: 1, children: [
2410
+ title && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Text_default, { fontSize: 20, fontWeight: 700, children: title }),
2411
+ description && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Text_default.body, { selectable: descriptionSelectable, children: description })
2300
2412
  ] }) }),
2301
- rightElement ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_jsx_runtime15.Fragment, { children: rightValue !== void 0 || rightElement === "arrow" ? /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(View_default, { isRow: true, alignItems: "center", gap: theme2.styles.gap / 2, children: [
2302
- rightValue !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Text_default, { fontSize: 14, fontWeight: 700, selectable: rightValueSelectable, children: rightValue }),
2303
- rightElement === "arrow" && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
2413
+ rightElement ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_jsx_runtime16.Fragment, { children: rightValue !== void 0 || rightElement === "arrow" ? /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(View_default, { isRow: true, alignItems: "center", gap: theme2.styles.gap / 2, children: [
2414
+ rightValue !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Text_default, { fontSize: 14, fontWeight: 700, selectable: rightValueSelectable, children: rightValue }),
2415
+ rightElement === "arrow" && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
2304
2416
  Icon_default,
2305
2417
  {
2306
2418
  name: "chevronRight",
@@ -2308,17 +2420,18 @@ function ListItem({
2308
2420
  color: rightValue !== void 0 ? theme2.colors.textPrimary : theme2.colors.textSecondary
2309
2421
  }
2310
2422
  )
2311
- ] }) : rightElement === "switch" ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Switch_default, { isEnabled: switchIsEnabled, onChange: switchOnChange }) : void 0 }) : void 0
2423
+ ] }) : rightElement === "switch" ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Switch_default, { isEnabled: switchIsEnabled, onChange: switchOnChange }) : rightElement === "checkBox" ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(CheckBox_default, { isChecked: checkBoxIsChecked, onChange: checkBoxOnChange }) : void 0 }) : void 0
2312
2424
  ] })
2313
2425
  }
2314
2426
  );
2315
2427
  }
2316
- var ListItem_default = (0, import_react17.memo)(ListItem);
2428
+ var ListItem_default = (0, import_react18.memo)(ListItem);
2317
2429
  // Annotate the CommonJS export names for ESM import in node:
2318
2430
  0 && (module.exports = {
2319
2431
  Animate,
2320
2432
  BetterComponentsProvider,
2321
2433
  Button,
2434
+ CheckBox,
2322
2435
  Icon,
2323
2436
  Image,
2324
2437
  InputField,