@hoddy-ui/core 2.5.47 → 2.5.49

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.
@@ -89,7 +89,7 @@ interface FlashMessageProps {
89
89
  onPress?: () => void;
90
90
  }>;
91
91
  duration?: number;
92
- type?: "success" | "warning" | "error";
92
+ type?: "success" | "warning" | "error" | "info" | "default";
93
93
  }
94
94
  interface LinkButtonProps {
95
95
  title: string;
@@ -206,7 +206,7 @@ interface TextFieldProps extends TextInputProps {
206
206
  variant?: "outlined" | "text" | "contained";
207
207
  color?: colorTypes;
208
208
  size?: "small" | "normal" | "large";
209
- type?: "email" | "tel" | "password" | "text" | "number" | "search";
209
+ type?: "email" | "tel" | "password" | "text" | "number" | "search" | "date";
210
210
  helperText?: string;
211
211
  value: any;
212
212
  start?: ReactNode;
@@ -89,7 +89,7 @@ interface FlashMessageProps {
89
89
  onPress?: () => void;
90
90
  }>;
91
91
  duration?: number;
92
- type?: "success" | "warning" | "error";
92
+ type?: "success" | "warning" | "error" | "info" | "default";
93
93
  }
94
94
  interface LinkButtonProps {
95
95
  title: string;
@@ -206,7 +206,7 @@ interface TextFieldProps extends TextInputProps {
206
206
  variant?: "outlined" | "text" | "contained";
207
207
  color?: colorTypes;
208
208
  size?: "small" | "normal" | "large";
209
- type?: "email" | "tel" | "password" | "text" | "number" | "search";
209
+ type?: "email" | "tel" | "password" | "text" | "number" | "search" | "date";
210
210
  helperText?: string;
211
211
  value: any;
212
212
  start?: ReactNode;
@@ -315,7 +315,7 @@ var Typography = (0, import_react.forwardRef)(
315
315
  const config2 = getConfig();
316
316
  const customFontSizes = config2.TYPOGRAPHY?.fontSizes;
317
317
  const baseFontSize = customFontSizes?.[variant] ?? DEFAULT_FONT_SIZES[variant];
318
- const f = fontSize || baseFontSize;
318
+ const f = fontSize || style?.fontSize || baseFontSize;
319
319
  const lh = lineHeight || f * 1.2;
320
320
  const styles = import_react_native.StyleSheet.create({
321
321
  text: {
@@ -411,6 +411,7 @@ var FlashMessage = () => {
411
411
  opacity: opacity.value
412
412
  };
413
413
  });
414
+ const textColor = type === "default" ? "#fff" : colors2[type].text;
414
415
  const styles = import_react_native_size_matters2.ScaledSheet.create({
415
416
  root: {
416
417
  position: "absolute",
@@ -419,7 +420,7 @@ var FlashMessage = () => {
419
420
  left: 0,
420
421
  paddingTop: top + 10,
421
422
  paddingHorizontal: "15@ms",
422
- backgroundColor: colors2[type].main,
423
+ backgroundColor: type === "default" ? "#333" : colors2[type].main,
423
424
  width: "100%",
424
425
  borderBottomLeftRadius: 10,
425
426
  borderBottomRightRadius: 10,
@@ -443,10 +444,10 @@ var FlashMessage = () => {
443
444
  variant: "h6",
444
445
  fontWeight: 600,
445
446
  gutterBottom: 3,
446
- style: { color: "#fff" }
447
+ color: textColor
447
448
  },
448
449
  message?.title
449
- ), /* @__PURE__ */ import_react2.default.createElement(Typography_default, { style: { color: "#fff" } }, message?.message)))), message?.actions?.map((cur, i) => /* @__PURE__ */ import_react2.default.createElement(
450
+ ), /* @__PURE__ */ import_react2.default.createElement(Typography_default, { color: textColor }, message?.message)))), message?.actions?.map((cur, i) => /* @__PURE__ */ import_react2.default.createElement(
450
451
  import_react_native2.TouchableOpacity,
451
452
  {
452
453
  key: i,
@@ -1402,6 +1403,7 @@ var import_vector_icons8 = require("@expo/vector-icons");
1402
1403
  var import_react16 = __toESM(require("react"));
1403
1404
  var import_react_native16 = require("react-native");
1404
1405
  var import_react_native_size_matters13 = require("react-native-size-matters");
1406
+ var import_react_native_modal_datetime_picker = __toESM(require("react-native-modal-datetime-picker"));
1405
1407
 
1406
1408
  // ../src/Components/SelectMenu.tsx
1407
1409
  var import_vector_icons7 = require("@expo/vector-icons");
@@ -1536,6 +1538,7 @@ var TextField = ({
1536
1538
  color = "primary",
1537
1539
  value,
1538
1540
  type,
1541
+ placeholder = "",
1539
1542
  helperText,
1540
1543
  onChangeText,
1541
1544
  onSubmitEditing = () => {
@@ -1559,6 +1562,8 @@ var TextField = ({
1559
1562
  }) => {
1560
1563
  const colors2 = useColors();
1561
1564
  const [focused, setFocused] = (0, import_react16.useState)(false);
1565
+ const [datePickerVisible, setDatePickerVisible] = (0, import_react16.useState)(false);
1566
+ const isDate = type === "date";
1562
1567
  const height2 = (0, import_react_native_size_matters13.moderateScale)(variant === "text" ? 50 : 45) * (size === "large" ? 1.2 : size === "small" ? 0.8 : 1);
1563
1568
  const labelAnim = (0, import_react16.useRef)(
1564
1569
  new import_react_native16.Animated.Value(height2 / (0, import_react_native_size_matters13.moderateScale)(variant === "text" ? 2.5 : 3.2))
@@ -1615,6 +1620,21 @@ var TextField = ({
1615
1620
  paddingLeft: variant === "text" ? 0 : (0, import_react_native_size_matters13.moderateScale)(15),
1616
1621
  paddingTop: "13@ms"
1617
1622
  },
1623
+ dateContent: {
1624
+ flexDirection: "row",
1625
+ alignItems: "center",
1626
+ flex: 1,
1627
+ paddingLeft: variant === "text" ? 0 : (0, import_react_native_size_matters13.moderateScale)(15),
1628
+ paddingRight: (0, import_react_native_size_matters13.moderateScale)(10),
1629
+ paddingTop: variant === "text" ? (0, import_react_native_size_matters13.ms)(13) : (0, import_react_native_size_matters13.ms)(12)
1630
+ },
1631
+ dateText: {
1632
+ fontSize: "14@ms",
1633
+ flex: 1
1634
+ },
1635
+ datePlaceholder: {
1636
+ color: colors2.textSecondary.main
1637
+ },
1618
1638
  label: {
1619
1639
  fontFamily: getFontFamily(400),
1620
1640
  position: "absolute",
@@ -1660,10 +1680,46 @@ var TextField = ({
1660
1680
  autoCapitalize: "none",
1661
1681
  textContentType: "password"
1662
1682
  } : {};
1683
+ const parseDateValue = () => {
1684
+ if (!value)
1685
+ return /* @__PURE__ */ new Date();
1686
+ if (value instanceof Date)
1687
+ return value;
1688
+ const parts = `${value}`.split("/");
1689
+ if (parts.length === 3) {
1690
+ const [day, month, year] = parts;
1691
+ const parsed = new Date(
1692
+ parseInt(year, 10),
1693
+ parseInt(month, 10) - 1,
1694
+ parseInt(day, 10)
1695
+ );
1696
+ if (!isNaN(parsed.getTime()))
1697
+ return parsed;
1698
+ }
1699
+ const fallback = new Date(value);
1700
+ return isNaN(fallback.getTime()) ? /* @__PURE__ */ new Date() : fallback;
1701
+ };
1702
+ const handleDateConfirm = (date) => {
1703
+ const day = date.getDate();
1704
+ const month = date.getMonth() + 1;
1705
+ const year = date.getFullYear();
1706
+ const dateString = `${day}/${month}/${year}`;
1707
+ onChangeText?.(dateString);
1708
+ setDatePickerVisible(false);
1709
+ };
1710
+ const handleContainerPress = () => {
1711
+ if (disabled)
1712
+ return;
1713
+ setFocused(true);
1714
+ if (isDate) {
1715
+ onFocus();
1716
+ setDatePickerVisible(true);
1717
+ }
1718
+ };
1663
1719
  return /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, /* @__PURE__ */ import_react16.default.createElement(import_react_native16.View, { style: styles.root }, /* @__PURE__ */ import_react16.default.createElement(
1664
1720
  import_react_native16.TouchableOpacity,
1665
1721
  {
1666
- onPress: () => setFocused(true),
1722
+ onPress: handleContainerPress,
1667
1723
  style: styles.container
1668
1724
  },
1669
1725
  /* @__PURE__ */ import_react16.default.createElement(import_react_native16.Animated.Text, { style: { ...styles.label, top: labelAnim } }, label),
@@ -1684,7 +1740,24 @@ var TextField = ({
1684
1740
  options.find((cur) => cur.value === value)?.start
1685
1741
  ),
1686
1742
  /* @__PURE__ */ import_react16.default.createElement(Typography_default, { style: styles.inputText }, options.find((cur) => cur.value === value)?.label)
1687
- ) : /* @__PURE__ */ import_react16.default.createElement(
1743
+ ) : isDate ? /* @__PURE__ */ import_react16.default.createElement(import_react_native16.View, { style: styles.dateContent }, /* @__PURE__ */ import_react16.default.createElement(
1744
+ Typography_default,
1745
+ {
1746
+ style: [
1747
+ styles.dateText,
1748
+ !value ? styles.datePlaceholder : void 0
1749
+ ],
1750
+ color: value ? "dark" : "textSecondary"
1751
+ },
1752
+ value || placeholder
1753
+ ), /* @__PURE__ */ import_react16.default.createElement(import_react_native16.View, { style: { marginLeft: 8 } }, end ?? /* @__PURE__ */ import_react16.default.createElement(
1754
+ import_vector_icons8.Ionicons,
1755
+ {
1756
+ name: "calendar-outline",
1757
+ size: 22,
1758
+ color: colors2.textSecondary.main
1759
+ }
1760
+ ))) : /* @__PURE__ */ import_react16.default.createElement(
1688
1761
  import_react_native16.TextInput,
1689
1762
  {
1690
1763
  onFocus: () => {
@@ -1754,6 +1827,18 @@ var TextField = ({
1754
1827
  onChange: onChangeText,
1755
1828
  ...selectMenuProps
1756
1829
  }
1830
+ ), isDate && /* @__PURE__ */ import_react16.default.createElement(
1831
+ import_react_native_modal_datetime_picker.default,
1832
+ {
1833
+ isVisible: datePickerVisible,
1834
+ mode: "date",
1835
+ date: parseDateValue(),
1836
+ onConfirm: handleDateConfirm,
1837
+ onCancel: () => {
1838
+ setDatePickerVisible(false);
1839
+ setFocused(false);
1840
+ }
1841
+ }
1757
1842
  ));
1758
1843
  };
1759
1844
  var TextField2 = import_react16.default.forwardRef(
@@ -1764,6 +1849,7 @@ var TextField2 = import_react16.default.forwardRef(
1764
1849
  color = "primary",
1765
1850
  value,
1766
1851
  type,
1852
+ placeholder,
1767
1853
  helperText,
1768
1854
  onChangeText,
1769
1855
  onSubmitEditing = () => {
@@ -1779,7 +1865,6 @@ var TextField2 = import_react16.default.forwardRef(
1779
1865
  style = {},
1780
1866
  inputStyles = {},
1781
1867
  gutterBottom = 8,
1782
- placeholder,
1783
1868
  end,
1784
1869
  options,
1785
1870
  multiline,
@@ -1789,6 +1874,8 @@ var TextField2 = import_react16.default.forwardRef(
1789
1874
  const colors2 = useColors();
1790
1875
  const [focused, _setFocused] = (0, import_react16.useState)(false);
1791
1876
  const [showPassword, setShowPassword] = (0, import_react16.useState)(false);
1877
+ const [datePickerVisible, setDatePickerVisible] = (0, import_react16.useState)(false);
1878
+ const isDate = type === "date";
1792
1879
  const height2 = (0, import_react_native_size_matters13.moderateScale)(
1793
1880
  multiline ? 50 + (props.numberOfLines || 1) * 18 : 50
1794
1881
  );
@@ -1839,6 +1926,20 @@ var TextField2 = import_react16.default.forwardRef(
1839
1926
  color: colors2.textSecondary.light,
1840
1927
  paddingLeft: (0, import_react_native_size_matters13.moderateScale)(10)
1841
1928
  },
1929
+ dateContent: {
1930
+ flexDirection: "row",
1931
+ alignItems: "center",
1932
+ flex: 1,
1933
+ paddingHorizontal: (0, import_react_native_size_matters13.moderateScale)(10),
1934
+ paddingTop: multiline ? 4 : 0
1935
+ },
1936
+ dateText: {
1937
+ fontSize: "14@ms",
1938
+ flex: 1
1939
+ },
1940
+ datePlaceholder: {
1941
+ color: colors2.textSecondary.light
1942
+ },
1842
1943
  label: {},
1843
1944
  helperText: {
1844
1945
  paddingHorizontal: "15@s",
@@ -1877,6 +1978,42 @@ var TextField2 = import_react16.default.forwardRef(
1877
1978
  autoCapitalize: "none",
1878
1979
  textContentType: "password"
1879
1980
  } : {};
1981
+ const parseDateValue = () => {
1982
+ if (!value)
1983
+ return /* @__PURE__ */ new Date();
1984
+ if (value instanceof Date)
1985
+ return value;
1986
+ const parts = `${value}`.split("/");
1987
+ if (parts.length === 3) {
1988
+ const [day, month, year] = parts;
1989
+ const parsed = new Date(
1990
+ parseInt(year, 10),
1991
+ parseInt(month, 10) - 1,
1992
+ parseInt(day, 10)
1993
+ );
1994
+ if (!isNaN(parsed.getTime()))
1995
+ return parsed;
1996
+ }
1997
+ const fallback = new Date(value);
1998
+ return isNaN(fallback.getTime()) ? /* @__PURE__ */ new Date() : fallback;
1999
+ };
2000
+ const handleDateConfirm = (date) => {
2001
+ const day = date.getDate();
2002
+ const month = date.getMonth() + 1;
2003
+ const year = date.getFullYear();
2004
+ const dateString = `${day}/${month}/${year}`;
2005
+ onChangeText?.(dateString);
2006
+ setDatePickerVisible(false);
2007
+ };
2008
+ const handleContainerPress = () => {
2009
+ if (disabled)
2010
+ return;
2011
+ setFocused(true);
2012
+ if (isDate) {
2013
+ onFocus();
2014
+ setDatePickerVisible(true);
2015
+ }
2016
+ };
1880
2017
  return /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, /* @__PURE__ */ import_react16.default.createElement(import_react_native16.View, { style: styles.root }, label && /* @__PURE__ */ import_react16.default.createElement(
1881
2018
  Typography_default,
1882
2019
  {
@@ -1889,7 +2026,7 @@ var TextField2 = import_react16.default.forwardRef(
1889
2026
  ), /* @__PURE__ */ import_react16.default.createElement(
1890
2027
  import_react_native16.TouchableOpacity,
1891
2028
  {
1892
- onPress: () => setFocused(true),
2029
+ onPress: handleContainerPress,
1893
2030
  style: styles.container
1894
2031
  },
1895
2032
  /* @__PURE__ */ import_react16.default.createElement(import_react_native16.View, { style: { marginTop: multiline ? 5 : 0 } }, start),
@@ -1901,7 +2038,24 @@ var TextField2 = import_react16.default.forwardRef(
1901
2038
  style: { marginLeft: "auto", marginRight: 15 },
1902
2039
  color: colors2.dark.light
1903
2040
  }
1904
- )) : /* @__PURE__ */ import_react16.default.createElement(
2041
+ )) : isDate ? /* @__PURE__ */ import_react16.default.createElement(import_react_native16.View, { style: styles.dateContent }, /* @__PURE__ */ import_react16.default.createElement(
2042
+ Typography_default,
2043
+ {
2044
+ style: [
2045
+ styles.dateText,
2046
+ !value ? styles.datePlaceholder : void 0
2047
+ ],
2048
+ color: value ? "dark" : "textSecondary"
2049
+ },
2050
+ value || placeholder
2051
+ ), /* @__PURE__ */ import_react16.default.createElement(import_react_native16.View, { style: { marginLeft: 8 } }, end ?? /* @__PURE__ */ import_react16.default.createElement(
2052
+ import_vector_icons8.Ionicons,
2053
+ {
2054
+ name: "calendar-outline",
2055
+ size: 22,
2056
+ color: colors2.textSecondary.main
2057
+ }
2058
+ ))) : /* @__PURE__ */ import_react16.default.createElement(
1905
2059
  import_react_native16.TextInput,
1906
2060
  {
1907
2061
  ref,