@tecsinapse/react-core 1.9.0 → 1.10.3

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 (91) hide show
  1. package/CHANGELOG.md +47 -0
  2. package/dist/components/atoms/Avatar/styled.js +0 -3
  3. package/dist/components/atoms/Avatar/styled.js.map +1 -1
  4. package/dist/components/atoms/BoxContent/styled.d.ts +10 -1
  5. package/dist/components/atoms/BoxContent/styled.js.map +1 -1
  6. package/dist/components/atoms/Button/States/Error.js +2 -2
  7. package/dist/components/atoms/Button/States/Error.js.map +1 -1
  8. package/dist/components/atoms/Button/States/Success.js +2 -2
  9. package/dist/components/atoms/Button/States/Success.js.map +1 -1
  10. package/dist/components/atoms/GroupButton/GroupButton.d.ts +2 -1
  11. package/dist/components/atoms/GroupButton/GroupButton.js +3 -2
  12. package/dist/components/atoms/GroupButton/GroupButton.js.map +1 -1
  13. package/dist/components/atoms/GroupButton/GroupButtonOption.d.ts +2 -2
  14. package/dist/components/atoms/GroupButton/GroupButtonOption.js.map +1 -1
  15. package/dist/components/atoms/GroupButton/styled.d.ts +1 -1
  16. package/dist/components/atoms/GroupButton/styled.js +8 -0
  17. package/dist/components/atoms/GroupButton/styled.js.map +1 -1
  18. package/dist/components/atoms/Input/InputElement/InputElement.d.ts +5 -4
  19. package/dist/components/atoms/Input/InputElement/InputElement.js +5 -3
  20. package/dist/components/atoms/Input/InputElement/InputElement.js.map +1 -1
  21. package/dist/components/atoms/Input/hooks/useCurrencyMask.d.ts +2 -2
  22. package/dist/components/atoms/Input/hooks/useCurrencyMask.js.map +1 -1
  23. package/dist/components/atoms/Input/hooks/useMask.d.ts +5 -5
  24. package/dist/components/atoms/Input/hooks/useMask.js +1 -1
  25. package/dist/components/atoms/Input/hooks/useMask.js.map +1 -1
  26. package/dist/components/atoms/Input/masks/index.js +1 -1
  27. package/dist/components/atoms/Input/masks/index.js.map +1 -1
  28. package/dist/components/atoms/Switch/Switch.d.ts +1 -0
  29. package/dist/components/atoms/Switch/Switch.js +10 -4
  30. package/dist/components/atoms/Switch/Switch.js.map +1 -1
  31. package/dist/components/atoms/Switch/animation.d.ts +2 -1
  32. package/dist/components/atoms/Switch/animation.js.map +1 -1
  33. package/dist/components/atoms/Tag/Tag.js +2 -2
  34. package/dist/components/atoms/Tag/Tag.js.map +1 -1
  35. package/dist/components/molecules/Calendar/Calendar.d.ts +1 -1
  36. package/dist/components/molecules/Calendar/Calendar.js +35 -156
  37. package/dist/components/molecules/Calendar/Calendar.js.map +1 -1
  38. package/dist/components/molecules/Calendar/components/MonthWeek.d.ts +13 -0
  39. package/dist/components/molecules/Calendar/components/MonthWeek.js +152 -0
  40. package/dist/components/molecules/Calendar/components/MonthWeek.js.map +1 -0
  41. package/dist/components/molecules/Calendar/components/Weekdays.d.ts +8 -0
  42. package/dist/components/molecules/Calendar/components/Weekdays.js +41 -0
  43. package/dist/components/molecules/Calendar/components/Weekdays.js.map +1 -0
  44. package/dist/components/molecules/Calendar/components/index.d.ts +2 -0
  45. package/dist/components/molecules/Calendar/components/index.js +24 -0
  46. package/dist/components/molecules/Calendar/components/index.js.map +1 -0
  47. package/dist/components/molecules/DatePicker/Modal.js.map +1 -1
  48. package/dist/components/molecules/DatePicker/styled.d.ts +4 -25
  49. package/dist/components/molecules/DatePicker/styled.js.map +1 -1
  50. package/dist/components/molecules/HintInputContainer/HintInputContainer.d.ts +1 -2
  51. package/dist/components/molecules/HintInputContainer/HintInputContainer.js.map +1 -1
  52. package/dist/hooks/useTheme.js.map +1 -1
  53. package/dist/index.d.ts +1 -1
  54. package/dist/index.js +14 -0
  55. package/dist/index.js.map +1 -1
  56. package/dist/utils/extractNumbersFromString.d.ts +1 -0
  57. package/dist/utils/extractNumbersFromString.js +5 -1
  58. package/dist/utils/extractNumbersFromString.js.map +1 -1
  59. package/dist/utils/index.d.ts +1 -1
  60. package/dist/utils/index.js +6 -0
  61. package/dist/utils/index.js.map +1 -1
  62. package/dist/utils/lightenDarkenColor.js +5 -5
  63. package/dist/utils/lightenDarkenColor.js.map +1 -1
  64. package/package.json +2 -2
  65. package/src/components/atoms/Avatar/styled.ts +0 -1
  66. package/src/components/atoms/BoxContent/styled.ts +1 -1
  67. package/src/components/atoms/Button/States/Error.tsx +1 -1
  68. package/src/components/atoms/Button/States/Success.tsx +1 -1
  69. package/src/components/atoms/GroupButton/GroupButton.tsx +6 -4
  70. package/src/components/atoms/GroupButton/GroupButtonOption.tsx +3 -3
  71. package/src/components/atoms/GroupButton/styled.ts +13 -1
  72. package/src/components/atoms/Input/InputElement/InputElement.tsx +36 -27
  73. package/src/components/atoms/Input/hooks/useCurrencyMask.ts +4 -5
  74. package/src/components/atoms/Input/hooks/useMask.ts +10 -9
  75. package/src/components/atoms/Input/masks/index.ts +1 -1
  76. package/src/components/atoms/Switch/Switch.stories.tsx +2 -1
  77. package/src/components/atoms/Switch/Switch.tsx +17 -6
  78. package/src/components/atoms/Switch/animation.ts +5 -1
  79. package/src/components/atoms/Tag/Tag.tsx +2 -2
  80. package/src/components/molecules/Calendar/Calendar.tsx +60 -162
  81. package/src/components/molecules/Calendar/components/MonthWeek.tsx +144 -0
  82. package/src/components/molecules/Calendar/components/Weekdays.tsx +34 -0
  83. package/src/components/molecules/Calendar/components/index.ts +2 -0
  84. package/src/components/molecules/DatePicker/Modal.tsx +1 -1
  85. package/src/components/molecules/DatePicker/styled.ts +1 -2
  86. package/src/components/molecules/HintInputContainer/HintInputContainer.tsx +1 -2
  87. package/src/hooks/useTheme.ts +1 -1
  88. package/src/index.ts +2 -0
  89. package/src/utils/extractNumbersFromString.ts +6 -0
  90. package/src/utils/index.ts +4 -1
  91. package/src/utils/lightenDarkenColor.ts +5 -5
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/atoms/Switch/Switch.tsx"],"names":["Switch","onChange","activeColor","activeColorTone","inactiveColor","inactiveColorTone","active","dotStyle","rest","theme","transitionValue","React","useRef","Animated","Value","current","animatedColor","interpolateColor","interpolate","inputRange","outputRange","color","animatedStyle","backgroundColor","handleChange","stylesDefaut","borderRadius","pill","paddingHorizontal","spacing","micro","paddingVertical","justifyContent","width","height","transform","translateX"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAMA;;AACA;;AACA;;AACA;;;;;;;;AAaA,MAAMA,MAAuB,GAAG,CAAC;AAC/BC,EAAAA,QAD+B;AAE/BC,EAAAA,WAAW,GAAG,SAFiB;AAG/BC,EAAAA,eAAe,GAAG,QAHa;AAI/BC,EAAAA,aAAa,GAAG,WAJe;AAK/BC,EAAAA,iBAAiB,GAAG,OALW;AAM/BC,EAAAA,MAN+B;AAO/BC,EAAAA,QAP+B;AAQ/B,KAAGC;AAR4B,CAAD,KASb;AACjB,QAAMC,KAAK,GAAG,sBAAd;;AAEA,QAAMC,eAAe,GAAGC,gBAAMC,MAAN,CAAa,IAAIC,sBAASC,KAAb,CAAmBR,MAAM,GAAG,IAAH,GAAU,CAAnC,CAAb,EACrBS,OADH;;AAGA,QAAMC,aAAa,GAAGL,gBAAMC,MAAN,CAAa,IAAIC,sBAASC,KAAb,CAAmBR,MAAM,GAAG,CAAH,GAAO,CAAhC,CAAb,EACnBS,OADH;;AAGA,QAAME,gBAAgB,GAAGD,aAAa,CAACE,WAAd,CAA0B;AACjDC,IAAAA,UAAU,EAAE,CAAC,CAAD,EAAI,CAAJ,CADqC;AAEjDC,IAAAA,WAAW,EAAE,CACXX,KAAK,CAACY,KAAN,CAAYjB,aAAZ,EAA2BC,iBAA3B,CADW,EAEXI,KAAK,CAACY,KAAN,CAAYnB,WAAZ,EAAyBC,eAAzB,CAFW;AAFoC,GAA1B,CAAzB;AAQA,QAAMmB,aAAa,GAAG;AACpBC,IAAAA,eAAe,EAAEN;AADG,GAAtB;AAIA,QAAMO,YAAY,GAAG,yBAAY,MAAM;AACrCvB,IAAAA,QAAQ,CAAC,CAACK,MAAF,CAAR;AACA,qCAAiBA,MAAjB,EAAyBI,eAAzB,EAA0CM,aAA1C;AACD,GAHoB,EAGlB,CAACV,MAAD,EAASL,QAAT,CAHkB,CAArB;AAKA,QAAMwB,YAAuB,GAAG;AAC9BC,IAAAA,YAAY,EAAE,qCAAyBjB,KAAK,CAACiB,YAAN,CAAmBC,IAA5C,CADgB;AAE9BC,IAAAA,iBAAiB,EAAE,qCAAyBnB,KAAK,CAACoB,OAAN,CAAcC,KAAvC,CAFW;AAG9BC,IAAAA,eAAe,EAAE,CAHa;AAI9BC,IAAAA,cAAc,EAAE,QAJc;AAK9BC,IAAAA,KAAK,EAAE,EALuB;AAM9BC,IAAAA,MAAM,EAAE;AANsB,GAAhC;AASA,SACE,8BAAC,kCAAD,eAAsB1B,IAAtB;AAA4B,IAAA,OAAO,EAAEgB,YAArC;AAAmD,IAAA,MAAM,EAAC;AAA1D,MACE,8BAAC,qBAAD,CAAU,IAAV;AAAe,IAAA,KAAK,EAAE,EAAE,GAAGF,aAAL;AAAoB,SAAGG;AAAvB;AAAtB,KACE,8BAAC,oBAAD;AACE,IAAA,KAAK,EAAE,CAAClB,QAAD,EAAW;AAAE4B,MAAAA,SAAS,EAAE,CAAC;AAAEC,QAAAA,UAAU,EAAE1B;AAAd,OAAD;AAAb,KAAX;AADT,IADF,CADF,CADF;AASD,CArDD;;eAuDeV,M","sourcesContent":["import { useTheme } from '@emotion/react';\nimport React, { FC, useCallback } from 'react';\nimport { Animated, StyleProp, ViewStyle } from 'react-native';\nimport {\n ColorGradationType,\n ColorType,\n ThemeProp,\n} from '../../../types/defaults';\nimport { PressableSurface } from '../PressableSurface';\nimport { StyledSwitch } from './styled';\nimport { transitionSwitch } from './animation';\nimport { extractNumbersFromString } from '../../../utils';\n\nexport interface SwitchProps {\n onChange: (active: boolean) => void;\n active: boolean;\n activeColor?: ColorType;\n activeColorTone?: ColorGradationType;\n inactiveColor?: ColorType;\n inactiveColorTone?: ColorGradationType;\n style?: StyleProp<ViewStyle>;\n dotStyle?: StyleProp<ViewStyle>;\n}\n\nconst Switch: FC<SwitchProps> = ({\n onChange,\n activeColor = 'primary',\n activeColorTone = 'medium',\n inactiveColor = 'secondary',\n inactiveColorTone = 'light',\n active,\n dotStyle,\n ...rest\n}): JSX.Element => {\n const theme = useTheme() as ThemeProp;\n\n const transitionValue = React.useRef(new Animated.Value(active ? 16.5 : 0))\n .current;\n\n const animatedColor = React.useRef(new Animated.Value(active ? 1 : 0))\n .current;\n\n const interpolateColor = animatedColor.interpolate({\n inputRange: [0, 1],\n outputRange: [\n theme.color[inactiveColor][inactiveColorTone],\n theme.color[activeColor][activeColorTone],\n ],\n });\n\n const animatedStyle = {\n backgroundColor: interpolateColor,\n };\n\n const handleChange = useCallback(() => {\n onChange(!active);\n transitionSwitch(active, transitionValue, animatedColor);\n }, [active, onChange]);\n\n const stylesDefaut: ViewStyle = {\n borderRadius: extractNumbersFromString(theme.borderRadius.pill),\n paddingHorizontal: extractNumbersFromString(theme.spacing.micro),\n paddingVertical: 0,\n justifyContent: 'center',\n width: 40,\n height: 22,\n };\n\n return (\n <PressableSurface {...rest} onPress={handleChange} effect=\"none\">\n <Animated.View style={{ ...animatedStyle, ...stylesDefaut }}>\n <StyledSwitch\n style={[dotStyle, { transform: [{ translateX: transitionValue }] }]}\n />\n </Animated.View>\n </PressableSurface>\n );\n};\n\nexport default Switch;\n"],"file":"Switch.js"}
1
+ {"version":3,"sources":["../../../../src/components/atoms/Switch/Switch.tsx"],"names":["Switch","onChange","activeColor","activeColorTone","inactiveColor","inactiveColorTone","active","dotStyle","disabled","rest","theme","transitionValue","React","useRef","Animated","Value","current","animatedColor","getBackgroundColor","color","variation","interpolateColor","interpolate","inputRange","outputRange","animatedStyle","backgroundColor","handleChange","stylesDefault","borderRadius","pill","paddingHorizontal","spacing","micro","paddingVertical","justifyContent","width","height","transform","translateX"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAMA;;AACA;;AACA;;AACA;;;;;;;;AAcA,MAAMA,MAAuB,GAAG,CAAC;AAC/BC,EAAAA,QAD+B;AAE/BC,EAAAA,WAAW,GAAG,SAFiB;AAG/BC,EAAAA,eAAe,GAAG,QAHa;AAI/BC,EAAAA,aAAa,GAAG,WAJe;AAK/BC,EAAAA,iBAAiB,GAAG,OALW;AAM/BC,EAAAA,MAN+B;AAO/BC,EAAAA,QAP+B;AAQ/BC,EAAAA,QAAQ,GAAG,KARoB;AAS/B,KAAGC;AAT4B,CAAD,KAUb;AACjB,QAAMC,KAAK,GAAG,sBAAd;;AAEA,QAAMC,eAAe,GAAGC,gBAAMC,MAAN,CAAa,IAAIC,sBAASC,KAAb,CAAmBT,MAAM,GAAG,IAAH,GAAU,CAAnC,CAAb,EACrBU,OADH;;AAGA,QAAMC,aAAa,GAAGL,gBAAMC,MAAN,CAAa,IAAIC,sBAASC,KAAb,CAAmBT,MAAM,GAAG,CAAH,GAAO,CAAhC,CAAb,EACnBU,OADH;;AAGA,QAAME,kBAAkB,GAAG,CAACC,KAAD,EAAgBC,SAAhB,KAAsC;AAC/D,WAAOZ,QAAQ,GAAG,+BAAmBW,KAAnB,EAA0BC,SAA1B,CAAH,GAA0CD,KAAzD;AACD,GAFD;;AAIA,QAAME,gBAAgB,GAAGJ,aAAa,CAACK,WAAd,CAA0B;AACjDC,IAAAA,UAAU,EAAE,CAAC,CAAD,EAAI,CAAJ,CADqC;AAEjDC,IAAAA,WAAW,EAAE,CACXN,kBAAkB,CAACR,KAAK,CAACS,KAAN,CAAYf,aAAZ,EAA2BC,iBAA3B,CAAD,EAAgD,EAAhD,CADP,EAEXa,kBAAkB,CAACR,KAAK,CAACS,KAAN,CAAYjB,WAAZ,EAAyBC,eAAzB,CAAD,EAA4C,EAA5C,CAFP;AAFoC,GAA1B,CAAzB;AAQA,QAAMsB,aAAa,GAAG;AACpBC,IAAAA,eAAe,EAAEL;AADG,GAAtB;AAIA,QAAMM,YAAY,GAAG,yBAAY,MAAM;AACrC1B,IAAAA,QAAQ,CAAC,CAACK,MAAF,CAAR;AACA,qCAAiBA,MAAjB,EAAyBK,eAAzB,EAA0CM,aAA1C;AACD,GAHoB,EAGlB,CAACX,MAAD,EAASL,QAAT,CAHkB,CAArB;AAKA,QAAM2B,aAAwB,GAAG;AAC/BC,IAAAA,YAAY,EAAE,qCAAyBnB,KAAK,CAACmB,YAAN,CAAmBC,IAA5C,CADiB;AAE/BC,IAAAA,iBAAiB,EAAE,qCAAyBrB,KAAK,CAACsB,OAAN,CAAcC,KAAvC,CAFY;AAG/BC,IAAAA,eAAe,EAAE,CAHc;AAI/BC,IAAAA,cAAc,EAAE,QAJe;AAK/BC,IAAAA,KAAK,EAAE,EALwB;AAM/BC,IAAAA,MAAM,EAAE;AANuB,GAAjC;AASA,SACE,8BAAC,kCAAD,eACM5B,IADN;AAEE,IAAA,OAAO,EAAEkB,YAFX;AAGE,IAAA,MAAM,EAAC,MAHT;AAIE,IAAA,QAAQ,EAAEnB;AAJZ,MAME,8BAAC,qBAAD,CAAU,IAAV;AAAe,IAAA,KAAK,EAAE,EAAE,GAAGiB,aAAL;AAAoB,SAAGG;AAAvB;AAAtB,KACE,8BAAC,oBAAD;AACE,IAAA,KAAK,EAAE,CAACrB,QAAD,EAAW;AAAE+B,MAAAA,SAAS,EAAE,CAAC;AAAEC,QAAAA,UAAU,EAAE5B;AAAd,OAAD;AAAb,KAAX;AADT,IADF,CANF,CADF;AAcD,CA/DD;;eAiEeX,M","sourcesContent":["import { useTheme } from '@emotion/react';\nimport React, { FC, useCallback } from 'react';\nimport { Animated, StyleProp, ViewStyle } from 'react-native';\nimport {\n ColorGradationType,\n ColorType,\n ThemeProp,\n} from '../../../types/defaults';\nimport { PressableSurface } from '../PressableSurface';\nimport { StyledSwitch } from './styled';\nimport { transitionSwitch } from './animation';\nimport { extractNumbersFromString, lightenDarkenColor } from '../../../utils';\n\nexport interface SwitchProps {\n onChange: (active: boolean) => void;\n active: boolean;\n activeColor?: ColorType;\n activeColorTone?: ColorGradationType;\n inactiveColor?: ColorType;\n inactiveColorTone?: ColorGradationType;\n style?: StyleProp<ViewStyle>;\n dotStyle?: StyleProp<ViewStyle>;\n disabled?: boolean;\n}\n\nconst Switch: FC<SwitchProps> = ({\n onChange,\n activeColor = 'primary',\n activeColorTone = 'medium',\n inactiveColor = 'secondary',\n inactiveColorTone = 'light',\n active,\n dotStyle,\n disabled = false,\n ...rest\n}): JSX.Element => {\n const theme = useTheme() as ThemeProp;\n\n const transitionValue = React.useRef(new Animated.Value(active ? 16.5 : 0))\n .current;\n\n const animatedColor = React.useRef(new Animated.Value(active ? 1 : 0))\n .current;\n\n const getBackgroundColor = (color: string, variation: number) => {\n return disabled ? lightenDarkenColor(color, variation) : color;\n };\n\n const interpolateColor = animatedColor.interpolate({\n inputRange: [0, 1],\n outputRange: [\n getBackgroundColor(theme.color[inactiveColor][inactiveColorTone], 25),\n getBackgroundColor(theme.color[activeColor][activeColorTone], 50),\n ],\n });\n\n const animatedStyle = {\n backgroundColor: interpolateColor,\n };\n\n const handleChange = useCallback(() => {\n onChange(!active);\n transitionSwitch(active, transitionValue, animatedColor);\n }, [active, onChange]);\n\n const stylesDefault: ViewStyle = {\n borderRadius: extractNumbersFromString(theme.borderRadius.pill),\n paddingHorizontal: extractNumbersFromString(theme.spacing.micro),\n paddingVertical: 0,\n justifyContent: 'center',\n width: 40,\n height: 22,\n };\n\n return (\n <PressableSurface\n {...rest}\n onPress={handleChange}\n effect=\"none\"\n disabled={disabled}\n >\n <Animated.View style={{ ...animatedStyle, ...stylesDefault }}>\n <StyledSwitch\n style={[dotStyle, { transform: [{ translateX: transitionValue }] }]}\n />\n </Animated.View>\n </PressableSurface>\n );\n};\n\nexport default Switch;\n"],"file":"Switch.js"}
@@ -1 +1,2 @@
1
- export declare const transitionSwitch: (active: any, transitionValue: any, animatedColor: any) => void;
1
+ import { Animated } from 'react-native';
2
+ export declare const transitionSwitch: (active: boolean, transitionValue: Animated.Value, animatedColor: Animated.Value) => void;
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/atoms/Switch/animation.ts"],"names":["transitionSwitch","active","transitionValue","animatedColor","Animated","timing","toValue","duration","useNativeDriver","start"],"mappings":";;;;;;;AAAA;;AAEO,MAAMA,gBAAgB,GAAG,CAACC,MAAD,EAASC,eAAT,EAA0BC,aAA1B,KAA4C;AAC1E,MAAIF,MAAJ,EAAY;AACVG,0BAASC,MAAT,CAAgBH,eAAhB,EAAiC;AAC/BI,MAAAA,OAAO,EAAE,CADsB;AAE/BC,MAAAA,QAAQ,EAAE,GAFqB;AAG/BC,MAAAA,eAAe,EAAE;AAHc,KAAjC,EAIGC,KAJH;;AAKAL,0BAASC,MAAT,CAAgBF,aAAhB,EAA+B;AAC7BG,MAAAA,OAAO,EAAE,CADoB;AAE7BC,MAAAA,QAAQ,EAAE,GAFmB;AAG7BC,MAAAA,eAAe,EAAE;AAHY,KAA/B,EAIGC,KAJH;AAKD,GAXD,MAWO;AACLL,0BAASC,MAAT,CAAgBH,eAAhB,EAAiC;AAC/BI,MAAAA,OAAO,EAAE,IADsB;AAE/BC,MAAAA,QAAQ,EAAE,GAFqB;AAG/BC,MAAAA,eAAe,EAAE;AAHc,KAAjC,EAIGC,KAJH;;AAKAL,0BAASC,MAAT,CAAgBF,aAAhB,EAA+B;AAC7BG,MAAAA,OAAO,EAAE,CADoB;AAE7BC,MAAAA,QAAQ,EAAE,GAFmB;AAG7BC,MAAAA,eAAe,EAAE;AAHY,KAA/B,EAIGC,KAJH;AAKD;AACF,CAxBM","sourcesContent":["import { Animated } from 'react-native';\n\nexport const transitionSwitch = (active, transitionValue, animatedColor) => {\n if (active) {\n Animated.timing(transitionValue, {\n toValue: 0,\n duration: 250,\n useNativeDriver: true,\n }).start();\n Animated.timing(animatedColor, {\n toValue: 0,\n duration: 250,\n useNativeDriver: false,\n }).start();\n } else {\n Animated.timing(transitionValue, {\n toValue: 16.5,\n duration: 250,\n useNativeDriver: true,\n }).start();\n Animated.timing(animatedColor, {\n toValue: 1,\n duration: 250,\n useNativeDriver: false,\n }).start();\n }\n};\n"],"file":"animation.js"}
1
+ {"version":3,"sources":["../../../../src/components/atoms/Switch/animation.ts"],"names":["transitionSwitch","active","transitionValue","animatedColor","Animated","timing","toValue","duration","useNativeDriver","start"],"mappings":";;;;;;;AAAA;;AAEO,MAAMA,gBAAgB,GAAG,CAC9BC,MAD8B,EAE9BC,eAF8B,EAG9BC,aAH8B,KAIrB;AACT,MAAIF,MAAJ,EAAY;AACVG,0BAASC,MAAT,CAAgBH,eAAhB,EAAiC;AAC/BI,MAAAA,OAAO,EAAE,CADsB;AAE/BC,MAAAA,QAAQ,EAAE,GAFqB;AAG/BC,MAAAA,eAAe,EAAE;AAHc,KAAjC,EAIGC,KAJH;;AAKAL,0BAASC,MAAT,CAAgBF,aAAhB,EAA+B;AAC7BG,MAAAA,OAAO,EAAE,CADoB;AAE7BC,MAAAA,QAAQ,EAAE,GAFmB;AAG7BC,MAAAA,eAAe,EAAE;AAHY,KAA/B,EAIGC,KAJH;AAKD,GAXD,MAWO;AACLL,0BAASC,MAAT,CAAgBH,eAAhB,EAAiC;AAC/BI,MAAAA,OAAO,EAAE,IADsB;AAE/BC,MAAAA,QAAQ,EAAE,GAFqB;AAG/BC,MAAAA,eAAe,EAAE;AAHc,KAAjC,EAIGC,KAJH;;AAKAL,0BAASC,MAAT,CAAgBF,aAAhB,EAA+B;AAC7BG,MAAAA,OAAO,EAAE,CADoB;AAE7BC,MAAAA,QAAQ,EAAE,GAFmB;AAG7BC,MAAAA,eAAe,EAAE;AAHY,KAA/B,EAIGC,KAJH;AAKD;AACF,CA5BM","sourcesContent":["import { Animated } from 'react-native';\n\nexport const transitionSwitch = (\n active: boolean,\n transitionValue: Animated.Value,\n animatedColor: Animated.Value\n): void => {\n if (active) {\n Animated.timing(transitionValue, {\n toValue: 0,\n duration: 250,\n useNativeDriver: true,\n }).start();\n Animated.timing(animatedColor, {\n toValue: 0,\n duration: 250,\n useNativeDriver: false,\n }).start();\n } else {\n Animated.timing(transitionValue, {\n toValue: 16.5,\n duration: 250,\n useNativeDriver: true,\n }).start();\n Animated.timing(animatedColor, {\n toValue: 1,\n duration: 250,\n useNativeDriver: false,\n }).start();\n }\n};\n"],"file":"animation.js"}
@@ -24,7 +24,7 @@ const Tag = ({
24
24
  icon,
25
25
  variant = 'small',
26
26
  dismiss: canDismiss = false,
27
- onDismiss = () => {},
27
+ onDismiss,
28
28
  style,
29
29
  ...rest
30
30
  }) => {
@@ -43,7 +43,7 @@ const Tag = ({
43
43
  };
44
44
 
45
45
  const handleDismiss = (0, _react.useCallback)(() => {
46
- onDismiss();
46
+ onDismiss === null || onDismiss === void 0 ? void 0 : onDismiss();
47
47
  fadeOut();
48
48
  setTimeout(() => setDismiss(true), duration);
49
49
  }, [onDismiss]);
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/atoms/Tag/Tag.tsx"],"names":["Tag","value","icon","variant","dismiss","canDismiss","onDismiss","style","rest","setDismiss","fadeAnim","React","useRef","Animated","Value","current","duration","fadeOut","timing","toValue","useNativeDriver","start","handleDismiss","setTimeout","opacity","size","colorVariant"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;;;;;;;AAUA,MAAMA,GAAuB,GAAG,CAAC;AAC/BC,EAAAA,KAD+B;AAE/BC,EAAAA,IAF+B;AAG/BC,EAAAA,OAAO,GAAG,OAHqB;AAI/BC,EAAAA,OAAO,EAAEC,UAAU,GAAG,KAJS;AAK/BC,EAAAA,SAAS,GAAG,MAAM,CAAE,CALW;AAM/BC,EAAAA,KAN+B;AAO/B,KAAGC;AAP4B,CAAD,KAQb;AACjB,QAAM,CAACJ,OAAD,EAAUK,UAAV,IAAwB,qBAAS,KAAT,CAA9B;;AACA,QAAMC,QAAQ,GAAGC,eAAMC,MAAN,CAAa,IAAIC,sBAASC,KAAb,CAAmB,CAAnB,CAAb,EAAoCC,OAArD;;AACA,QAAMC,QAAQ,GAAG,GAAjB;;AAEA,QAAMC,OAAO,GAAG,MAAM;AACpBJ,0BAASK,MAAT,CAAgBR,QAAhB,EAA0B;AACxBS,MAAAA,OAAO,EAAE,CADe;AAExBH,MAAAA,QAFwB;AAGxBI,MAAAA,eAAe,EAAE;AAHO,KAA1B,EAIGC,KAJH;AAKD,GAND;;AAQA,QAAMC,aAAa,GAAG,wBAAY,MAAM;AACtChB,IAAAA,SAAS;AACTW,IAAAA,OAAO;AACPM,IAAAA,UAAU,CAAC,MAAMd,UAAU,CAAC,IAAD,CAAjB,EAAyBO,QAAzB,CAAV;AACD,GAJqB,EAInB,CAACV,SAAD,CAJmB,CAAtB;AAMA,SACE,6BAAC,0BAAD,eACME,IADN;AAEE,IAAA,OAAO,EAAEL,OAFX;AAGE,IAAA,KAAK,EAAE,CAAC;AAAEqB,MAAAA,OAAO,EAAGd;AAAZ,KAAD,EAA+CH,KAA/C,CAHT;AAIE,IAAA,OAAO,EAAE,CAACH;AAJZ,MAMGF,IAAI,IACH,6BAAC,sBAAD;AACE,IAAA,IAAI,EAAEA,IAAI,CAACuB,IAAL,IAAa,OADrB;AAEE,IAAA,YAAY,EAAEvB,IAAI,CAACwB,YAAL,IAAqB;AAFrC,KAGMxB,IAHN,EAPJ,EAaGD,KAbH,EAcGI,UAAU,IACT,6BAAC,kCAAD;AAAkB,IAAA,OAAO,EAAEiB;AAA3B,KACE,6BAAC,uBAAD;AACE,IAAA,IAAI,EAAC,eADP;AAEE,IAAA,IAAI,EAAC,SAFP;AAGE,IAAA,IAAI,EAAC,OAHP;AAIE,IAAA,SAAS,EAAC;AAJZ,IADF,CAfJ,CADF;AA2BD,CAtDD;;eAwDetB,G","sourcesContent":["import React, { useCallback, useState } from 'react';\nimport { Animated, ViewProps } from 'react-native';\nimport { IconProps } from '../Icon';\nimport { PressableSurface } from '../PressableSurface';\nimport { StyledCloseIcon, StyledLeftIcon, StyledTagContainer } from './styled';\n\nexport interface TagProps extends ViewProps {\n value: React.ReactNode;\n icon?: IconProps;\n dismiss?: boolean;\n onDismiss?: () => void;\n variant?: 'small' | 'default';\n}\n\nconst Tag: React.FC<TagProps> = ({\n value,\n icon,\n variant = 'small',\n dismiss: canDismiss = false,\n onDismiss = () => {},\n style,\n ...rest\n}): JSX.Element => {\n const [dismiss, setDismiss] = useState(false);\n const fadeAnim = React.useRef(new Animated.Value(1)).current;\n const duration = 300;\n\n const fadeOut = () => {\n Animated.timing(fadeAnim, {\n toValue: 0,\n duration,\n useNativeDriver: true,\n }).start();\n };\n\n const handleDismiss = useCallback(() => {\n onDismiss();\n fadeOut();\n setTimeout(() => setDismiss(true), duration);\n }, [onDismiss]);\n\n return (\n <StyledTagContainer\n {...rest}\n variant={variant}\n style={[{ opacity: (fadeAnim as unknown) as number }, style]}\n visible={!dismiss}\n >\n {icon && (\n <StyledLeftIcon\n size={icon.size || 'micro'}\n colorVariant={icon.colorVariant || 'primary'}\n {...icon}\n />\n )}\n {value}\n {canDismiss && (\n <PressableSurface onPress={handleDismiss}>\n <StyledCloseIcon\n name=\"close-outline\"\n type=\"ionicon\"\n size=\"centi\"\n fontColor=\"medium\"\n />\n </PressableSurface>\n )}\n </StyledTagContainer>\n );\n};\n\nexport default Tag;\n"],"file":"Tag.js"}
1
+ {"version":3,"sources":["../../../../src/components/atoms/Tag/Tag.tsx"],"names":["Tag","value","icon","variant","dismiss","canDismiss","onDismiss","style","rest","setDismiss","fadeAnim","React","useRef","Animated","Value","current","duration","fadeOut","timing","toValue","useNativeDriver","start","handleDismiss","setTimeout","opacity","size","colorVariant"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;;;;;;;AAUA,MAAMA,GAAuB,GAAG,CAAC;AAC/BC,EAAAA,KAD+B;AAE/BC,EAAAA,IAF+B;AAG/BC,EAAAA,OAAO,GAAG,OAHqB;AAI/BC,EAAAA,OAAO,EAAEC,UAAU,GAAG,KAJS;AAK/BC,EAAAA,SAL+B;AAM/BC,EAAAA,KAN+B;AAO/B,KAAGC;AAP4B,CAAD,KAQb;AACjB,QAAM,CAACJ,OAAD,EAAUK,UAAV,IAAwB,qBAAS,KAAT,CAA9B;;AACA,QAAMC,QAAQ,GAAGC,eAAMC,MAAN,CAAa,IAAIC,sBAASC,KAAb,CAAmB,CAAnB,CAAb,EAAoCC,OAArD;;AACA,QAAMC,QAAQ,GAAG,GAAjB;;AAEA,QAAMC,OAAO,GAAG,MAAM;AACpBJ,0BAASK,MAAT,CAAgBR,QAAhB,EAA0B;AACxBS,MAAAA,OAAO,EAAE,CADe;AAExBH,MAAAA,QAFwB;AAGxBI,MAAAA,eAAe,EAAE;AAHO,KAA1B,EAIGC,KAJH;AAKD,GAND;;AAQA,QAAMC,aAAa,GAAG,wBAAY,MAAM;AACtChB,IAAAA,SAAS,SAAT,IAAAA,SAAS,WAAT,YAAAA,SAAS;AACTW,IAAAA,OAAO;AACPM,IAAAA,UAAU,CAAC,MAAMd,UAAU,CAAC,IAAD,CAAjB,EAAyBO,QAAzB,CAAV;AACD,GAJqB,EAInB,CAACV,SAAD,CAJmB,CAAtB;AAMA,SACE,6BAAC,0BAAD,eACME,IADN;AAEE,IAAA,OAAO,EAAEL,OAFX;AAGE,IAAA,KAAK,EAAE,CAAC;AAAEqB,MAAAA,OAAO,EAAGd;AAAZ,KAAD,EAA+CH,KAA/C,CAHT;AAIE,IAAA,OAAO,EAAE,CAACH;AAJZ,MAMGF,IAAI,IACH,6BAAC,sBAAD;AACE,IAAA,IAAI,EAAEA,IAAI,CAACuB,IAAL,IAAa,OADrB;AAEE,IAAA,YAAY,EAAEvB,IAAI,CAACwB,YAAL,IAAqB;AAFrC,KAGMxB,IAHN,EAPJ,EAaGD,KAbH,EAcGI,UAAU,IACT,6BAAC,kCAAD;AAAkB,IAAA,OAAO,EAAEiB;AAA3B,KACE,6BAAC,uBAAD;AACE,IAAA,IAAI,EAAC,eADP;AAEE,IAAA,IAAI,EAAC,SAFP;AAGE,IAAA,IAAI,EAAC,OAHP;AAIE,IAAA,SAAS,EAAC;AAJZ,IADF,CAfJ,CADF;AA2BD,CAtDD;;eAwDetB,G","sourcesContent":["import React, { useCallback, useState } from 'react';\nimport { Animated, ViewProps } from 'react-native';\nimport { IconProps } from '../Icon';\nimport { PressableSurface } from '../PressableSurface';\nimport { StyledCloseIcon, StyledLeftIcon, StyledTagContainer } from './styled';\n\nexport interface TagProps extends ViewProps {\n value: React.ReactNode;\n icon?: IconProps;\n dismiss?: boolean;\n onDismiss?: () => void;\n variant?: 'small' | 'default';\n}\n\nconst Tag: React.FC<TagProps> = ({\n value,\n icon,\n variant = 'small',\n dismiss: canDismiss = false,\n onDismiss,\n style,\n ...rest\n}): JSX.Element => {\n const [dismiss, setDismiss] = useState(false);\n const fadeAnim = React.useRef(new Animated.Value(1)).current;\n const duration = 300;\n\n const fadeOut = () => {\n Animated.timing(fadeAnim, {\n toValue: 0,\n duration,\n useNativeDriver: true,\n }).start();\n };\n\n const handleDismiss = useCallback(() => {\n onDismiss?.();\n fadeOut();\n setTimeout(() => setDismiss(true), duration);\n }, [onDismiss]);\n\n return (\n <StyledTagContainer\n {...rest}\n variant={variant}\n style={[{ opacity: (fadeAnim as unknown) as number }, style]}\n visible={!dismiss}\n >\n {icon && (\n <StyledLeftIcon\n size={icon.size || 'micro'}\n colorVariant={icon.colorVariant || 'primary'}\n {...icon}\n />\n )}\n {value}\n {canDismiss && (\n <PressableSurface onPress={handleDismiss}>\n <StyledCloseIcon\n name=\"close-outline\"\n type=\"ionicon\"\n size=\"centi\"\n fontColor=\"medium\"\n />\n </PressableSurface>\n )}\n </StyledTagContainer>\n );\n};\n\nexport default Tag;\n"],"file":"Tag.js"}
@@ -6,7 +6,7 @@ export declare type DateRange = {
6
6
  lowest: Date;
7
7
  highest?: Date;
8
8
  };
9
- declare type Value<T extends SelectionType> = T extends 'range' ? DateRange : Date;
9
+ export declare type Value<T extends SelectionType> = T extends 'range' ? DateRange : Date;
10
10
  export interface CalendarProps<T extends SelectionType> extends ViewProps {
11
11
  TextComponent?: React.FC<TextProps>;
12
12
  year?: number;
@@ -17,6 +17,8 @@ var _Text = require("../../atoms/Text");
17
17
 
18
18
  var _styled = require("./styled");
19
19
 
20
+ var _components = require("./components");
21
+
20
22
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
21
23
 
22
24
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -43,120 +45,35 @@ function Calendar({
43
45
  locale,
44
46
  ...rest
45
47
  }) {
46
- var _locale$options, _locale$options2;
47
-
48
- const _referenceDate = _year && _month ? new Date(_year, _month, 1, 0, 0, 0, 0) : _month ? new Date(now.getFullYear(), _month, 1, 0, 0, 0, 0) : now;
48
+ const _referenceDate = React.useMemo(() => _year && _month ? new Date(_year, _month, 1, 0, 0, 0, 0) : _month ? new Date(now.getFullYear(), _month, 1, 0, 0, 0, 0) : now, [_year, _month]);
49
49
 
50
50
  const [referenceDate, setReferenceDate] = React.useState(_referenceDate);
51
- const startingWeekDay = dayOfWeekFromWeekStart(referenceDate.getDay(), (locale === null || locale === void 0 ? void 0 : (_locale$options = locale.options) === null || _locale$options === void 0 ? void 0 : _locale$options.weekStartsOn) ?? 0);
52
- const weeksInMonth = (0, _dateFns.getWeeksInMonth)(referenceDate, {
53
- weekStartsOn: (locale === null || locale === void 0 ? void 0 : (_locale$options2 = locale.options) === null || _locale$options2 === void 0 ? void 0 : _locale$options2.weekStartsOn) ?? 0
54
- });
55
- const Capitalized = (0, _styled.getCapitalizedTextComponent)(TextComponent);
56
- const calendar = [...Array(weeksInMonth).keys()].map(week => [...Array(7).keys()].map(weekDayIndex => (0, _dateFns.add)(referenceDate, {
51
+ const startingWeekDay = React.useMemo(() => {
52
+ var _locale$options;
53
+
54
+ return dayOfWeekFromWeekStart(referenceDate.getDay(), (locale === null || locale === void 0 ? void 0 : (_locale$options = locale.options) === null || _locale$options === void 0 ? void 0 : _locale$options.weekStartsOn) ?? 0);
55
+ }, [referenceDate, locale]);
56
+ const weeksInMonth = React.useMemo(() => {
57
+ var _locale$options2;
58
+
59
+ return (0, _dateFns.getWeeksInMonth)(referenceDate, {
60
+ weekStartsOn: (locale === null || locale === void 0 ? void 0 : (_locale$options2 = locale.options) === null || _locale$options2 === void 0 ? void 0 : _locale$options2.weekStartsOn) ?? 0
61
+ });
62
+ }, [referenceDate, locale]);
63
+ const Capitalized = React.useMemo(() => (0, _styled.getCapitalizedTextComponent)(TextComponent), [TextComponent]);
64
+ const calendar = React.useMemo(() => [...Array(weeksInMonth).keys()].map(week => [...Array(7).keys()].map(weekDayIndex => (0, _dateFns.add)(referenceDate, {
57
65
  days: 6 * week + week + weekDayIndex - startingWeekDay
58
- })));
59
-
60
- const checkIfIsBetween = date => {
61
- if (type !== 'range' || !value) return false;else {
62
- const {
63
- lowest,
64
- highest
65
- } = value;
66
- if (!highest) return false;
67
- return (0, _dateFns.compareAsc)(lowest, date) <= 0 && (0, _dateFns.compareAsc)(highest, date) >= 0;
68
- }
69
- };
70
-
71
- const checkIfIsSelected = date => {
72
- if (!value) return false;else if (type === 'range' && value) {
73
- const {
74
- lowest,
75
- highest
76
- } = value;
77
- return (0, _dateFns.isSameDay)(lowest, date) || (highest ? (0, _dateFns.isSameDay)(highest, date) : false);
78
- } else {
79
- return (0, _dateFns.isSameDay)(value, date);
80
- }
81
- };
82
-
83
- const handlePressCell = date => () => {
84
- if (type === 'day') {
85
- onChange === null || onChange === void 0 ? void 0 : onChange(date);
86
- } else if (!value) {
87
- onChange === null || onChange === void 0 ? void 0 : onChange({
88
- lowest: date
89
- });
90
- } else {
91
- let newValue;
92
- const {
93
- lowest,
94
- highest
95
- } = value;
96
-
97
- if (!highest) {
98
- if ((0, _dateFns.compareAsc)(date, lowest) === -1) {
99
- newValue = {
100
- lowest: date,
101
- highest: lowest
102
- };
103
- } else if ((0, _dateFns.compareAsc)(date, lowest) === 0) {
104
- newValue = undefined;
105
- } else {
106
- newValue = {
107
- lowest: lowest,
108
- highest: date
109
- };
110
- }
111
- } else {
112
- if ((0, _dateFns.compareAsc)(date, lowest) === -1) {
113
- newValue = {
114
- lowest: date,
115
- highest: highest
116
- };
117
- } else if ((0, _dateFns.compareAsc)(date, lowest) === 0) {
118
- newValue = {
119
- lowest: highest,
120
- highest: undefined
121
- };
122
- } else {
123
- if ((0, _dateFns.compareAsc)(date, highest) === -1) {
124
- const lowestDiff = Math.abs((0, _dateFns.differenceInDays)(date, lowest));
125
- const highestDiff = Math.abs((0, _dateFns.differenceInDays)(date, highest));
126
- newValue = {
127
- lowest: lowestDiff < highestDiff ? date : lowest,
128
- highest: highestDiff <= lowestDiff ? date : highest
129
- };
130
- } else if ((0, _dateFns.compareAsc)(date, highest) === 0) {
131
- newValue = {
132
- lowest: lowest,
133
- highest: undefined
134
- };
135
- } else {
136
- newValue = {
137
- lowest: lowest,
138
- highest: date
139
- };
140
- }
141
- }
142
- }
143
-
144
- onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
145
- }
146
- };
147
-
148
- const handlePressNext = () => {
66
+ }))), [weeksInMonth, startingWeekDay, referenceDate]);
67
+ const handlePressNext = React.useCallback(() => {
149
68
  setReferenceDate((0, _dateFns.add)(referenceDate, {
150
69
  months: 1
151
70
  }));
152
- };
153
-
154
- const handlePressPrev = () => {
71
+ }, [referenceDate, setReferenceDate]);
72
+ const handlePressPrev = React.useCallback(() => {
155
73
  setReferenceDate((0, _dateFns.add)(referenceDate, {
156
74
  months: -1
157
75
  }));
158
- };
159
-
76
+ }, [referenceDate, setReferenceDate]);
160
77
  return React.createElement(_reactNative.View, rest, React.createElement(_styled.TitleContainer, null, React.createElement(_styled.Control, {
161
78
  onPress: handlePressPrev,
162
79
  align: 'start',
@@ -183,57 +100,19 @@ function Calendar({
183
100
  size: 'kilo',
184
101
  colorVariant: 'secondary',
185
102
  colorTone: 'medium'
186
- }))), React.createElement(_styled.Content, null, React.createElement(_styled.Week, null, calendar[0].map(date => React.createElement(_styled.Cell, {
187
- key: date.getDate(),
188
- selected: false,
189
- highlighted: false,
190
- isLineEnd: false,
191
- isLineStart: false,
192
- isRangeStart: false,
193
- isRangeEnd: false,
194
- pointerEvents: 'none'
195
- }, React.createElement(Capitalized, {
196
- colorVariant: 'secondary',
197
- colorTone: 'medium'
198
- }, (0, _dateFns.format)(date, 'EEE', {
199
- locale
200
- }).slice(0, 3))))), calendar.map((week, index) => React.createElement(_styled.Week, {
201
- key: `week-${index}`
202
- }, week.map((date, index) => {
203
- const isSelected = checkIfIsSelected(date);
204
- const isBetween = checkIfIsBetween(date);
205
- let isRangeStart, isRangeEnd;
206
-
207
- if (type === 'range' && value) {
208
- const {
209
- lowest,
210
- highest
211
- } = value;
212
- isRangeStart = highest && (0, _dateFns.isSameDay)(lowest, date);
213
- isRangeEnd = !!highest && (0, _dateFns.isSameDay)(highest, date);
214
- } else {
215
- isRangeStart = false;
216
- isRangeEnd = false;
217
- }
218
-
219
- const colorTone = isSelected ? 'xlight' : date.getMonth() === referenceDate.getMonth() ? 'xdark' : 'light';
220
- return React.createElement(_styled.Cell, {
221
- key: date.getDate(),
222
- selected: isSelected,
223
- highlighted: isBetween,
224
- isLineEnd: index === 6,
225
- isLineStart: index === 0,
226
- isRangeStart: isRangeStart,
227
- isRangeEnd: isRangeEnd,
228
- onPress: handlePressCell(date)
229
- }, React.createElement(_styled.Selected, {
230
- selected: isSelected,
231
- pointerEvents: 'none'
232
- }, React.createElement(TextComponent, {
233
- colorVariant: 'secondary',
234
- colorTone: colorTone
235
- }, date.getDate())));
236
- })))));
103
+ }))), React.createElement(_styled.Content, null, React.createElement(_components.Weekdays, {
104
+ locale: locale,
105
+ calendar: calendar,
106
+ Capitalized: Capitalized
107
+ }), calendar.map((week, index) => React.createElement(_components.MonthWeek, {
108
+ week: week,
109
+ type: type,
110
+ value: value,
111
+ key: `week-${index}`,
112
+ onChange: onChange,
113
+ TextComponent: TextComponent,
114
+ referenceDate: referenceDate
115
+ }))));
237
116
  }
238
117
 
239
118
  var _default = Calendar;
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/molecules/Calendar/Calendar.tsx"],"names":["now","Date","date","hours","minutes","seconds","milliseconds","dayOfWeekFromWeekStart","dayOfWeek","weekStartsOn","Calendar","TextComponent","Text","year","_year","month","_month","value","type","onChange","locale","rest","_referenceDate","getFullYear","referenceDate","setReferenceDate","React","useState","startingWeekDay","getDay","options","weeksInMonth","Capitalized","calendar","Array","keys","map","week","weekDayIndex","days","checkIfIsBetween","lowest","highest","checkIfIsSelected","handlePressCell","newValue","undefined","lowestDiff","Math","abs","highestDiff","handlePressNext","months","handlePressPrev","getDate","slice","index","isSelected","isBetween","isRangeStart","isRangeEnd","colorTone","getMonth"],"mappings":"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","sourcesContent":["import {\n add,\n compareAsc as compare,\n differenceInDays,\n format,\n getWeeksInMonth,\n isSameDay,\n set,\n} from 'date-fns';\nimport * as React from 'react';\nimport { View, ViewProps } from 'react-native';\nimport { Icon } from '../../atoms/Icon';\nimport { Text, TextProps } from '../../atoms/Text';\nimport {\n Cell,\n Content,\n Control,\n getCapitalizedTextComponent,\n Selected,\n TitleContainer,\n Week,\n} from './styled';\n\nexport type SelectionType = 'range' | 'day';\n\nexport type DateRange = { lowest: Date; highest?: Date };\n\ntype Value<T extends SelectionType> = T extends 'range' ? DateRange : Date;\n\nexport interface CalendarProps<T extends SelectionType> extends ViewProps {\n TextComponent?: React.FC<TextProps>;\n year?: number;\n month?: number;\n onChange?: (value?: Value<T>) => void | never;\n type?: T;\n value?: Value<T>;\n locale?: Locale;\n}\n\nconst now = set(new Date(), {\n date: 1,\n hours: 0,\n minutes: 0,\n seconds: 0,\n milliseconds: 0,\n});\n\nfunction dayOfWeekFromWeekStart(dayOfWeek: number, weekStartsOn: number) {\n return dayOfWeek === 0 ? 0 : dayOfWeek - weekStartsOn;\n}\n\nfunction Calendar<T extends SelectionType>({\n TextComponent = Text,\n year: _year,\n month: _month,\n value,\n type,\n onChange,\n locale,\n ...rest\n}: CalendarProps<T>): JSX.Element {\n const _referenceDate =\n _year && _month\n ? new Date(_year, _month, 1, 0, 0, 0, 0)\n : _month\n ? new Date(now.getFullYear(), _month, 1, 0, 0, 0, 0)\n : now;\n\n const [referenceDate, setReferenceDate] = React.useState(_referenceDate);\n\n const startingWeekDay = dayOfWeekFromWeekStart(\n referenceDate.getDay(),\n locale?.options?.weekStartsOn ?? 0\n );\n\n const weeksInMonth = getWeeksInMonth(referenceDate, {\n weekStartsOn: locale?.options?.weekStartsOn ?? 0,\n });\n\n const Capitalized = getCapitalizedTextComponent(TextComponent);\n\n const calendar = [...Array(weeksInMonth).keys()].map(week =>\n [...Array(7).keys()].map(weekDayIndex =>\n add(referenceDate, {\n days: 6 * week + week + weekDayIndex - startingWeekDay,\n })\n )\n );\n\n const checkIfIsBetween = (date: Date) => {\n if (type !== 'range' || !value) return false;\n else {\n const { lowest, highest } = value as DateRange;\n if (!highest) return false;\n return compare(lowest, date) <= 0 && compare(highest, date) >= 0;\n }\n };\n\n const checkIfIsSelected = (date: Date) => {\n if (!value) return false;\n else if (type === 'range' && value) {\n const { lowest, highest } = value as DateRange;\n return (\n isSameDay(lowest, date) || (highest ? isSameDay(highest, date) : false)\n );\n } else {\n return isSameDay(value as Date, date);\n }\n };\n\n const handlePressCell = (date: Date) => () => {\n if (type === 'day') {\n onChange?.(date as never);\n } else if (!value) {\n onChange?.({ lowest: date } as never);\n } else {\n let newValue;\n const { lowest, highest } = value as DateRange;\n\n if (!highest) {\n if (compare(date, lowest) === -1) {\n newValue = { lowest: date, highest: lowest };\n } else if (compare(date, lowest) === 0) {\n newValue = undefined;\n } else {\n newValue = { lowest: lowest, highest: date };\n }\n } else {\n if (compare(date, lowest) === -1) {\n newValue = { lowest: date, highest: highest };\n } else if (compare(date, lowest) === 0) {\n newValue = { lowest: highest, highest: undefined };\n } else {\n if (compare(date, highest) === -1) {\n const lowestDiff = Math.abs(differenceInDays(date, lowest));\n const highestDiff = Math.abs(differenceInDays(date, highest));\n newValue = {\n lowest: lowestDiff < highestDiff ? date : lowest,\n highest: highestDiff <= lowestDiff ? date : highest,\n };\n } else if (compare(date, highest) === 0) {\n newValue = { lowest: lowest, highest: undefined };\n } else {\n newValue = { lowest: lowest, highest: date };\n }\n }\n }\n\n onChange?.(newValue as never);\n }\n };\n\n const handlePressNext = () => {\n setReferenceDate(add(referenceDate, { months: 1 }));\n };\n\n const handlePressPrev = () => {\n setReferenceDate(add(referenceDate, { months: -1 }));\n };\n\n return (\n <View {...rest}>\n <TitleContainer>\n <Control onPress={handlePressPrev} align={'start'} isLeft>\n <Icon\n name={'chevron-left'}\n type={'material-community'}\n size={'kilo'}\n colorVariant={'secondary'}\n colorTone={'medium'}\n />\n </Control>\n <Capitalized\n colorVariant={'secondary'}\n colorTone={'xdark'}\n fontWeight={'bold'}\n >\n {format(referenceDate, 'MMMM yyyy', { locale })}\n </Capitalized>\n <Control onPress={handlePressNext} align={'end'} isRright>\n <Icon\n name={'chevron-right'}\n type={'material-community'}\n size={'kilo'}\n colorVariant={'secondary'}\n colorTone={'medium'}\n />\n </Control>\n </TitleContainer>\n <Content>\n <Week>\n {calendar[0].map(date => (\n <Cell\n key={date.getDate()}\n selected={false}\n highlighted={false}\n isLineEnd={false}\n isLineStart={false}\n isRangeStart={false}\n isRangeEnd={false}\n pointerEvents={'none'}\n >\n <Capitalized colorVariant={'secondary'} colorTone={'medium'}>\n {format(date, 'EEE', { locale }).slice(0, 3)}\n </Capitalized>\n </Cell>\n ))}\n </Week>\n {calendar.map((week, index) => (\n <Week key={`week-${index}`}>\n {week.map((date, index) => {\n const isSelected = checkIfIsSelected(date);\n const isBetween = checkIfIsBetween(date);\n\n let isRangeStart, isRangeEnd;\n\n if (type === 'range' && value) {\n const { lowest, highest } = value as DateRange;\n isRangeStart = highest && isSameDay(lowest, date);\n isRangeEnd = !!highest && isSameDay(highest, date);\n } else {\n isRangeStart = false;\n isRangeEnd = false;\n }\n\n const colorTone = isSelected\n ? 'xlight'\n : date.getMonth() === referenceDate.getMonth()\n ? 'xdark'\n : 'light';\n\n return (\n <Cell\n key={date.getDate()}\n selected={isSelected}\n highlighted={isBetween}\n isLineEnd={index === 6}\n isLineStart={index === 0}\n isRangeStart={isRangeStart}\n isRangeEnd={isRangeEnd}\n onPress={handlePressCell(date)}\n >\n <Selected selected={isSelected} pointerEvents={'none'}>\n <TextComponent\n colorVariant={'secondary'}\n colorTone={colorTone}\n >\n {date.getDate()}\n </TextComponent>\n </Selected>\n </Cell>\n );\n })}\n </Week>\n ))}\n </Content>\n </View>\n );\n}\n\nexport default Calendar;\n"],"file":"Calendar.js"}
1
+ {"version":3,"sources":["../../../../src/components/molecules/Calendar/Calendar.tsx"],"names":["now","Date","date","hours","minutes","seconds","milliseconds","dayOfWeekFromWeekStart","dayOfWeek","weekStartsOn","Calendar","TextComponent","Text","year","_year","month","_month","value","type","onChange","locale","rest","_referenceDate","React","useMemo","getFullYear","referenceDate","setReferenceDate","useState","startingWeekDay","getDay","options","weeksInMonth","Capitalized","calendar","Array","keys","map","week","weekDayIndex","days","handlePressNext","useCallback","months","handlePressPrev","index"],"mappings":"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","sourcesContent":["import { add, format, getWeeksInMonth, set } from 'date-fns';\nimport * as React from 'react';\nimport { View, ViewProps } from 'react-native';\nimport { Icon } from '../../atoms/Icon';\nimport { Text, TextProps } from '../../atoms/Text';\nimport {\n Content,\n Control,\n getCapitalizedTextComponent,\n TitleContainer,\n} from './styled';\nimport { Weekdays, MonthWeek } from './components';\n\nexport type SelectionType = 'range' | 'day';\n\nexport type DateRange = { lowest: Date; highest?: Date };\n\nexport type Value<T extends SelectionType> = T extends 'range'\n ? DateRange\n : Date;\n\nexport interface CalendarProps<T extends SelectionType> extends ViewProps {\n TextComponent?: React.FC<TextProps>;\n year?: number;\n month?: number;\n onChange?: (value?: Value<T>) => void | never;\n type?: T;\n value?: Value<T>;\n locale?: Locale;\n}\n\nconst now = set(new Date(), {\n date: 1,\n hours: 0,\n minutes: 0,\n seconds: 0,\n milliseconds: 0,\n});\n\nfunction dayOfWeekFromWeekStart(dayOfWeek: number, weekStartsOn: number) {\n return dayOfWeek === 0 ? 0 : dayOfWeek - weekStartsOn;\n}\n\nfunction Calendar<T extends SelectionType>({\n TextComponent = Text,\n year: _year,\n month: _month,\n value,\n type,\n onChange,\n locale,\n ...rest\n}: CalendarProps<T>): JSX.Element {\n const _referenceDate = React.useMemo(\n () =>\n _year && _month\n ? new Date(_year, _month, 1, 0, 0, 0, 0)\n : _month\n ? new Date(now.getFullYear(), _month, 1, 0, 0, 0, 0)\n : now,\n [_year, _month]\n );\n\n const [referenceDate, setReferenceDate] = React.useState(_referenceDate);\n\n const startingWeekDay = React.useMemo(\n () =>\n dayOfWeekFromWeekStart(\n referenceDate.getDay(),\n locale?.options?.weekStartsOn ?? 0\n ),\n [referenceDate, locale]\n );\n\n const weeksInMonth = React.useMemo(\n () =>\n getWeeksInMonth(referenceDate, {\n weekStartsOn: locale?.options?.weekStartsOn ?? 0,\n }),\n [referenceDate, locale]\n );\n\n const Capitalized = React.useMemo(\n () => getCapitalizedTextComponent(TextComponent),\n [TextComponent]\n );\n\n const calendar = React.useMemo(\n () =>\n [...Array(weeksInMonth).keys()].map(week =>\n [...Array(7).keys()].map(weekDayIndex =>\n add(referenceDate, {\n days: 6 * week + week + weekDayIndex - startingWeekDay,\n })\n )\n ),\n [weeksInMonth, startingWeekDay, referenceDate]\n );\n\n const handlePressNext = React.useCallback(() => {\n setReferenceDate(add(referenceDate, { months: 1 }));\n }, [referenceDate, setReferenceDate]);\n\n const handlePressPrev = React.useCallback(() => {\n setReferenceDate(add(referenceDate, { months: -1 }));\n }, [referenceDate, setReferenceDate]);\n\n return (\n <View {...rest}>\n <TitleContainer>\n <Control onPress={handlePressPrev} align={'start'} isLeft>\n <Icon\n name={'chevron-left'}\n type={'material-community'}\n size={'kilo'}\n colorVariant={'secondary'}\n colorTone={'medium'}\n />\n </Control>\n <Capitalized\n colorVariant={'secondary'}\n colorTone={'xdark'}\n fontWeight={'bold'}\n >\n {format(referenceDate, 'MMMM yyyy', { locale })}\n </Capitalized>\n <Control onPress={handlePressNext} align={'end'} isRright>\n <Icon\n name={'chevron-right'}\n type={'material-community'}\n size={'kilo'}\n colorVariant={'secondary'}\n colorTone={'medium'}\n />\n </Control>\n </TitleContainer>\n <Content>\n <Weekdays\n locale={locale}\n calendar={calendar}\n Capitalized={Capitalized}\n />\n {calendar.map((week, index) => (\n <MonthWeek\n week={week}\n type={type}\n value={value}\n key={`week-${index}`}\n onChange={onChange}\n TextComponent={TextComponent}\n referenceDate={referenceDate}\n />\n ))}\n </Content>\n </View>\n );\n}\n\nexport default Calendar;\n"],"file":"Calendar.js"}
@@ -0,0 +1,13 @@
1
+ import React from 'react';
2
+ import { Value, SelectionType } from '../Calendar';
3
+ import { TextProps } from '@tecsinapse/react-core';
4
+ interface IMonthWeek<T extends SelectionType> {
5
+ TextComponent: React.FC<TextProps>;
6
+ onChange?: (value?: any) => void | never;
7
+ type?: T;
8
+ value?: Value<T>;
9
+ week: Date[];
10
+ referenceDate: Date;
11
+ }
12
+ declare const _default: React.MemoExoticComponent<(<T extends SelectionType>({ week, referenceDate, type, value, TextComponent, onChange, }: IMonthWeek<T>) => JSX.Element)>;
13
+ export default _default;
@@ -0,0 +1,152 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+
8
+ var _react = _interopRequireDefault(require("react"));
9
+
10
+ var _dateFns = require("date-fns");
11
+
12
+ var _styled = require("../styled");
13
+
14
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
15
+
16
+ const MonthWeek = ({
17
+ week,
18
+ referenceDate,
19
+ type,
20
+ value,
21
+ TextComponent,
22
+ onChange
23
+ }) => {
24
+ const checkIfIsBetween = _react.default.useCallback((date, _value) => {
25
+ if (type !== 'range' || !_value) return false;else {
26
+ const {
27
+ lowest,
28
+ highest
29
+ } = _value;
30
+ if (!highest) return false;
31
+ return (0, _dateFns.compareAsc)(lowest, date) <= 0 && (0, _dateFns.compareAsc)(highest, date) >= 0;
32
+ }
33
+ }, [type]);
34
+
35
+ const checkIfIsSelected = _react.default.useCallback((date, _value) => {
36
+ if (!_value) return false;else if (type === 'range' && _value) {
37
+ const {
38
+ lowest,
39
+ highest
40
+ } = _value;
41
+ return (0, _dateFns.isSameDay)(lowest, date) || (highest ? (0, _dateFns.isSameDay)(highest, date) : false);
42
+ } else {
43
+ return (0, _dateFns.isSameDay)(_value, date);
44
+ }
45
+ }, [type]);
46
+
47
+ const handlePressCell = _react.default.useCallback((date, _value) => () => {
48
+ if (type === 'day') {
49
+ onChange === null || onChange === void 0 ? void 0 : onChange(date);
50
+ } else if (!_value) {
51
+ onChange === null || onChange === void 0 ? void 0 : onChange({
52
+ lowest: date
53
+ });
54
+ } else {
55
+ let newValue;
56
+ const {
57
+ lowest,
58
+ highest
59
+ } = _value;
60
+
61
+ if (!highest) {
62
+ if ((0, _dateFns.compareAsc)(date, lowest) === -1) {
63
+ newValue = {
64
+ lowest: date,
65
+ highest: lowest
66
+ };
67
+ } else if ((0, _dateFns.compareAsc)(date, lowest) === 0) {
68
+ newValue = undefined;
69
+ } else {
70
+ newValue = {
71
+ lowest: lowest,
72
+ highest: date
73
+ };
74
+ }
75
+ } else {
76
+ if ((0, _dateFns.compareAsc)(date, lowest) === -1) {
77
+ newValue = {
78
+ lowest: date,
79
+ highest: highest
80
+ };
81
+ } else if ((0, _dateFns.compareAsc)(date, lowest) === 0) {
82
+ newValue = {
83
+ lowest: highest,
84
+ highest: undefined
85
+ };
86
+ } else {
87
+ if ((0, _dateFns.compareAsc)(date, highest) === -1) {
88
+ const lowestDiff = Math.abs((0, _dateFns.differenceInDays)(date, lowest));
89
+ const highestDiff = Math.abs((0, _dateFns.differenceInDays)(date, highest));
90
+ newValue = {
91
+ lowest: lowestDiff < highestDiff ? date : lowest,
92
+ highest: highestDiff <= lowestDiff ? date : highest
93
+ };
94
+ } else if ((0, _dateFns.compareAsc)(date, highest) === 0) {
95
+ newValue = {
96
+ lowest: lowest,
97
+ highest: undefined
98
+ };
99
+ } else {
100
+ newValue = {
101
+ lowest: lowest,
102
+ highest: date
103
+ };
104
+ }
105
+ }
106
+ }
107
+
108
+ onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
109
+ }
110
+ }, [onChange, type]);
111
+
112
+ return _react.default.createElement(_styled.Week, null, week.map((date, index) => {
113
+ const isSelected = checkIfIsSelected(date, value);
114
+ const isBetween = checkIfIsBetween(date, value);
115
+ let isRangeStart, isRangeEnd;
116
+
117
+ if (type === 'range' && value) {
118
+ const {
119
+ lowest,
120
+ highest
121
+ } = value;
122
+ isRangeStart = highest && (0, _dateFns.isSameDay)(lowest, date);
123
+ isRangeEnd = !!highest && (0, _dateFns.isSameDay)(highest, date);
124
+ } else {
125
+ isRangeStart = false;
126
+ isRangeEnd = false;
127
+ }
128
+
129
+ const colorTone = isSelected ? 'xlight' : date.getMonth() === referenceDate.getMonth() ? 'xdark' : 'light';
130
+ return _react.default.createElement(_styled.Cell, {
131
+ key: date.getDate(),
132
+ selected: isSelected,
133
+ highlighted: isBetween,
134
+ isLineEnd: index === 6,
135
+ isLineStart: index === 0,
136
+ isRangeStart: isRangeStart,
137
+ isRangeEnd: isRangeEnd,
138
+ onPress: handlePressCell(date, value)
139
+ }, _react.default.createElement(_styled.Selected, {
140
+ selected: isSelected,
141
+ pointerEvents: 'none'
142
+ }, _react.default.createElement(TextComponent, {
143
+ colorVariant: 'secondary',
144
+ colorTone: colorTone
145
+ }, date.getDate())));
146
+ }));
147
+ };
148
+
149
+ var _default = _react.default.memo(MonthWeek);
150
+
151
+ exports.default = _default;
152
+ //# sourceMappingURL=MonthWeek.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../../../src/components/molecules/Calendar/components/MonthWeek.tsx"],"names":["MonthWeek","week","referenceDate","type","value","TextComponent","onChange","checkIfIsBetween","React","useCallback","date","_value","lowest","highest","checkIfIsSelected","handlePressCell","newValue","undefined","lowestDiff","Math","abs","highestDiff","map","index","isSelected","isBetween","isRangeStart","isRangeEnd","colorTone","getMonth","getDate","memo"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { compareAsc as compare, differenceInDays, isSameDay } from 'date-fns';\nimport { Cell, Selected, Week } from '../styled';\nimport { Value, DateRange, SelectionType } from '../Calendar';\nimport { TextProps } from '@tecsinapse/react-core';\n\ninterface IMonthWeek<T extends SelectionType> {\n TextComponent: React.FC<TextProps>;\n /** any as workaround for TS type mismatching */\n onChange?: (value?: any) => void | never;\n type?: T;\n value?: Value<T>;\n week: Date[];\n referenceDate: Date;\n}\n\nconst MonthWeek = <T extends SelectionType>({\n week,\n referenceDate,\n type,\n value,\n TextComponent,\n onChange,\n}: IMonthWeek<T>) => {\n const checkIfIsBetween = React.useCallback(\n (date: Date, _value?: Value<T>) => {\n if (type !== 'range' || !_value) return false;\n else {\n const { lowest, highest } = _value as DateRange;\n if (!highest) return false;\n return compare(lowest, date) <= 0 && compare(highest, date) >= 0;\n }\n },\n [type]\n );\n\n const checkIfIsSelected = React.useCallback(\n (date: Date, _value?: Value<T>) => {\n if (!_value) return false;\n else if (type === 'range' && _value) {\n const { lowest, highest } = _value as DateRange;\n return (\n isSameDay(lowest, date) ||\n (highest ? isSameDay(highest, date) : false)\n );\n } else {\n return isSameDay(_value as Date, date);\n }\n },\n [type]\n );\n\n const handlePressCell = React.useCallback(\n (date: Date, _value?: Value<T>) => () => {\n if (type === 'day') {\n onChange?.(date as never);\n } else if (!_value) {\n onChange?.({ lowest: date } as never);\n } else {\n let newValue;\n const { lowest, highest } = _value as DateRange;\n\n if (!highest) {\n if (compare(date, lowest) === -1) {\n newValue = { lowest: date, highest: lowest };\n } else if (compare(date, lowest) === 0) {\n newValue = undefined;\n } else {\n newValue = { lowest: lowest, highest: date };\n }\n } else {\n if (compare(date, lowest) === -1) {\n newValue = { lowest: date, highest: highest };\n } else if (compare(date, lowest) === 0) {\n newValue = { lowest: highest, highest: undefined };\n } else {\n if (compare(date, highest) === -1) {\n const lowestDiff = Math.abs(differenceInDays(date, lowest));\n const highestDiff = Math.abs(differenceInDays(date, highest));\n newValue = {\n lowest: lowestDiff < highestDiff ? date : lowest,\n highest: highestDiff <= lowestDiff ? date : highest,\n };\n } else if (compare(date, highest) === 0) {\n newValue = { lowest: lowest, highest: undefined };\n } else {\n newValue = { lowest: lowest, highest: date };\n }\n }\n }\n\n onChange?.(newValue as never);\n }\n },\n [onChange, type]\n );\n\n return (\n <Week>\n {week.map((date, index) => {\n const isSelected = checkIfIsSelected(date, value);\n const isBetween = checkIfIsBetween(date, value);\n\n let isRangeStart, isRangeEnd;\n\n if (type === 'range' && value) {\n const { lowest, highest } = value as DateRange;\n isRangeStart = highest && isSameDay(lowest, date);\n isRangeEnd = !!highest && isSameDay(highest, date);\n } else {\n isRangeStart = false;\n isRangeEnd = false;\n }\n\n const colorTone = isSelected\n ? 'xlight'\n : date.getMonth() === referenceDate.getMonth()\n ? 'xdark'\n : 'light';\n\n return (\n <Cell\n key={date.getDate()}\n selected={isSelected}\n highlighted={isBetween}\n isLineEnd={index === 6}\n isLineStart={index === 0}\n isRangeStart={isRangeStart}\n isRangeEnd={isRangeEnd}\n onPress={handlePressCell(date, value)}\n >\n <Selected selected={isSelected} pointerEvents={'none'}>\n <TextComponent colorVariant={'secondary'} colorTone={colorTone}>\n {date.getDate()}\n </TextComponent>\n </Selected>\n </Cell>\n );\n })}\n </Week>\n );\n};\n\nexport default React.memo(MonthWeek);\n"],"file":"MonthWeek.js"}
@@ -0,0 +1,8 @@
1
+ import React from 'react';
2
+ interface IWeekdays {
3
+ calendar: Date[][];
4
+ locale?: Locale;
5
+ Capitalized: React.ElementType;
6
+ }
7
+ declare const _default: React.MemoExoticComponent<({ calendar, locale, Capitalized }: IWeekdays) => JSX.Element>;
8
+ export default _default;
@@ -0,0 +1,41 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+
8
+ var _react = _interopRequireDefault(require("react"));
9
+
10
+ var _styled = require("../styled");
11
+
12
+ var _dateFns = require("date-fns");
13
+
14
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
15
+
16
+ const Weekdays = ({
17
+ calendar,
18
+ locale,
19
+ Capitalized
20
+ }) => {
21
+ return _react.default.createElement(_styled.Week, null, calendar[0].map(date => _react.default.createElement(_styled.Cell, {
22
+ key: date.getDate(),
23
+ selected: false,
24
+ highlighted: false,
25
+ isLineEnd: false,
26
+ isLineStart: false,
27
+ isRangeStart: false,
28
+ isRangeEnd: false,
29
+ pointerEvents: 'none'
30
+ }, _react.default.createElement(Capitalized, {
31
+ colorVariant: 'secondary',
32
+ colorTone: 'medium'
33
+ }, (0, _dateFns.format)(date, 'EEE', {
34
+ locale
35
+ }).slice(0, 3)))));
36
+ };
37
+
38
+ var _default = _react.default.memo(Weekdays);
39
+
40
+ exports.default = _default;
41
+ //# sourceMappingURL=Weekdays.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../../../src/components/molecules/Calendar/components/Weekdays.tsx"],"names":["Weekdays","calendar","locale","Capitalized","map","date","getDate","slice","React","memo"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;AAQA,MAAMA,QAAQ,GAAG,CAAC;AAAEC,EAAAA,QAAF;AAAYC,EAAAA,MAAZ;AAAoBC,EAAAA;AAApB,CAAD,KAAkD;AACjE,SACE,6BAAC,YAAD,QACGF,QAAQ,CAAC,CAAD,CAAR,CAAYG,GAAZ,CAAgBC,IAAI,IACnB,6BAAC,YAAD;AACE,IAAA,GAAG,EAAEA,IAAI,CAACC,OAAL,EADP;AAEE,IAAA,QAAQ,EAAE,KAFZ;AAGE,IAAA,WAAW,EAAE,KAHf;AAIE,IAAA,SAAS,EAAE,KAJb;AAKE,IAAA,WAAW,EAAE,KALf;AAME,IAAA,YAAY,EAAE,KANhB;AAOE,IAAA,UAAU,EAAE,KAPd;AAQE,IAAA,aAAa,EAAE;AARjB,KAUE,6BAAC,WAAD;AAAa,IAAA,YAAY,EAAE,WAA3B;AAAwC,IAAA,SAAS,EAAE;AAAnD,KACG,qBAAOD,IAAP,EAAa,KAAb,EAAoB;AAAEH,IAAAA;AAAF,GAApB,EAAgCK,KAAhC,CAAsC,CAAtC,EAAyC,CAAzC,CADH,CAVF,CADD,CADH,CADF;AAoBD,CArBD;;eAuBeC,eAAMC,IAAN,CAAWT,QAAX,C","sourcesContent":["import React from 'react';\nimport { Cell, Week } from '../styled';\nimport { format } from 'date-fns';\n\ninterface IWeekdays {\n calendar: Date[][];\n locale?: Locale;\n Capitalized: React.ElementType;\n}\n\nconst Weekdays = ({ calendar, locale, Capitalized }: IWeekdays) => {\n return (\n <Week>\n {calendar[0].map(date => (\n <Cell\n key={date.getDate()}\n selected={false}\n highlighted={false}\n isLineEnd={false}\n isLineStart={false}\n isRangeStart={false}\n isRangeEnd={false}\n pointerEvents={'none'}\n >\n <Capitalized colorVariant={'secondary'} colorTone={'medium'}>\n {format(date, 'EEE', { locale }).slice(0, 3)}\n </Capitalized>\n </Cell>\n ))}\n </Week>\n );\n};\n\nexport default React.memo(Weekdays);\n"],"file":"Weekdays.js"}
@@ -0,0 +1,2 @@
1
+ export { default as Weekdays } from './Weekdays';
2
+ export { default as MonthWeek } from './MonthWeek';