@tecsinapse/react-native-kit 1.12.12 → 1.12.16
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.
- package/CHANGELOG.md +32 -0
- package/dist/components/atoms/Text/styled.js +3 -1
- package/dist/components/atoms/Text/styled.js.map +1 -1
- package/dist/components/molecules/Calendar/Calendar.d.ts +1 -4
- package/dist/components/molecules/Calendar/Calendar.js.map +1 -1
- package/dist/components/molecules/DatePicker/DatePicker.d.ts +3 -2
- package/dist/components/molecules/DatePicker/DatePicker.js.map +1 -1
- package/dist/components/molecules/DatePicker/index.d.ts +1 -1
- package/dist/components/molecules/DatePicker/index.js +6 -0
- package/dist/components/molecules/DatePicker/index.js.map +1 -1
- package/dist/components/molecules/DateTimePicker/DateTimePicker.d.ts +2 -1
- package/dist/components/molecules/DateTimePicker/DateTimePicker.js.map +1 -1
- package/dist/components/molecules/DateTimePicker/index.d.ts +1 -1
- package/dist/components/molecules/DateTimePicker/index.js +6 -0
- package/dist/components/molecules/DateTimePicker/index.js.map +1 -1
- package/dist/components/molecules/Select/Modal.js +1 -1
- package/dist/components/molecules/Select/Modal.js.map +1 -1
- package/dist/components/molecules/Select/styled.js +1 -1
- package/dist/components/molecules/Select/styled.js.map +1 -1
- package/dist/index.d.ts +2 -2
- package/dist/index.js +14 -0
- package/dist/index.js.map +1 -1
- package/package.json +3 -3
- package/src/components/atoms/Text/styled.ts +2 -1
- package/src/components/molecules/Calendar/Calendar.tsx +2 -2
- package/src/components/molecules/DatePicker/DatePicker.tsx +3 -1
- package/src/components/molecules/DatePicker/index.ts +1 -1
- package/src/components/molecules/DateTimePicker/DateTimePicker.tsx +3 -1
- package/src/components/molecules/DateTimePicker/index.ts +1 -1
- package/src/components/molecules/Select/Modal.tsx +2 -2
- package/src/components/molecules/Select/styled.ts +2 -1
- package/src/index.ts +2 -2
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,38 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## [1.12.16](https://github.com/tecsinapse/design-system/compare/@tecsinapse/react-native-kit@1.12.15...@tecsinapse/react-native-kit@1.12.16) (2022-01-28)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @tecsinapse/react-native-kit
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
## [1.12.15](https://github.com/tecsinapse/design-system/compare/@tecsinapse/react-native-kit@1.12.14...@tecsinapse/react-native-kit@1.12.15) (2022-01-24)
|
|
15
|
+
|
|
16
|
+
**Note:** Version bump only for package @tecsinapse/react-native-kit
|
|
17
|
+
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
## [1.12.14](https://github.com/tecsinapse/design-system/compare/@tecsinapse/react-native-kit@1.12.13...@tecsinapse/react-native-kit@1.12.14) (2022-01-19)
|
|
23
|
+
|
|
24
|
+
**Note:** Version bump only for package @tecsinapse/react-native-kit
|
|
25
|
+
|
|
26
|
+
|
|
27
|
+
|
|
28
|
+
|
|
29
|
+
|
|
30
|
+
## [1.12.13](https://github.com/tecsinapse/design-system/compare/@tecsinapse/react-native-kit@1.12.12...@tecsinapse/react-native-kit@1.12.13) (2022-01-18)
|
|
31
|
+
|
|
32
|
+
**Note:** Version bump only for package @tecsinapse/react-native-kit
|
|
33
|
+
|
|
34
|
+
|
|
35
|
+
|
|
36
|
+
|
|
37
|
+
|
|
6
38
|
## [1.12.12](https://github.com/tecsinapse/design-system/compare/@tecsinapse/react-native-kit@1.12.11...@tecsinapse/react-native-kit@1.12.12) (2022-01-18)
|
|
7
39
|
|
|
8
40
|
**Note:** Version bump only for package @tecsinapse/react-native-kit
|
|
@@ -9,6 +9,8 @@ var _native = _interopRequireWildcard(require("@emotion/native"));
|
|
|
9
9
|
|
|
10
10
|
var _reactCore = require("@tecsinapse/react-core");
|
|
11
11
|
|
|
12
|
+
var _reactNative = require("react-native");
|
|
13
|
+
|
|
12
14
|
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); }
|
|
13
15
|
|
|
14
16
|
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; }
|
|
@@ -21,7 +23,7 @@ const fontStyles = ({
|
|
|
21
23
|
const fontFamily = (theme === null || theme === void 0 ? void 0 : theme.font.stack[fontStack]) || '';
|
|
22
24
|
const fontStyle = theme === null || theme === void 0 ? void 0 : theme.font.files[fontWeight];
|
|
23
25
|
return (0, _native.css)`
|
|
24
|
-
font-weight: normal;
|
|
26
|
+
${_reactNative.Platform.OS === 'android' ? 'font-weight: normal;' : undefined}
|
|
25
27
|
font-family: ${fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.replace('{0}', fontFamily)};
|
|
26
28
|
`;
|
|
27
29
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/atoms/Text/styled.ts"],"names":["fontStyles","theme","fontStack","fontWeight","fontFamily","font","stack","fontStyle","files","replace","StyledNativeText","Text"],"mappings":";;;;;;;AAAA;;AACA;;;;;;
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/atoms/Text/styled.ts"],"names":["fontStyles","theme","fontStack","fontWeight","fontFamily","font","stack","fontStyle","files","Platform","OS","undefined","replace","StyledNativeText","Text"],"mappings":";;;;;;;AAAA;;AACA;;AAMA;;;;;;AAQO,MAAMA,UAAU,GAAG,CAAC;AACzBC,EAAAA,KADyB;AAEzBC,EAAAA,SAAS,GAAG,SAFa;AAGzBC,EAAAA,UAAU,GAAG;AAHY,CAAD,KAIiB;AACzC,QAAMC,UAAU,GAAG,CAAAH,KAAK,SAAL,IAAAA,KAAK,WAAL,YAAAA,KAAK,CAAEI,IAAP,CAAYC,KAAZ,CAAkBJ,SAAlB,MAAgC,EAAnD;AACA,QAAMK,SAAS,GAAGN,KAAH,aAAGA,KAAH,uBAAGA,KAAK,CAAEI,IAAP,CAAYG,KAAZ,CAAkBL,UAAlB,CAAlB;AACA,SAAO,gBAAI;AACb,MAAMM,sBAASC,EAAT,KAAgB,SAAhB,GAA4B,sBAA5B,GAAqDC,SAAU;AACrE,mBAAmBJ,SAFP,aAEOA,SAFP,uBAEOA,SAAS,CAAEK,OAAX,CAAmB,KAAnB,EAA0BR,UAA1B,CAAsC;AACzD,GAHE;AAID,CAXM;;;AAaA,MAAMS,gBAAgB,GAAG,qBAAOC,eAAP,EAE9Bd,UAF8B,CAAzB","sourcesContent":["import styled, { css } from '@emotion/native';\nimport {\n FontStackType,\n FontWeightType,\n StyleProps,\n Text,\n} from '@tecsinapse/react-core';\nimport { Platform } from 'react-native';\nimport { TextNativeProps } from './Text';\n\nexport interface Font {\n fontStack?: FontStackType;\n fontWeight?: FontWeightType;\n}\n\nexport const fontStyles = ({\n theme,\n fontStack = 'default',\n fontWeight = 'regular',\n}: Partial<Font & Partial<StyleProps>>) => {\n const fontFamily = theme?.font.stack[fontStack] || '';\n const fontStyle = theme?.font.files[fontWeight];\n return css`\n ${Platform.OS === 'android' ? 'font-weight: normal;' : undefined}\n font-family: ${fontStyle?.replace('{0}', fontFamily)};\n `;\n};\n\nexport const StyledNativeText = styled(Text)<\n Font & Partial<TextNativeProps> & Partial<StyleProps>\n>(fontStyles);\n"],"file":"styled.js"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/molecules/Calendar/Calendar.tsx"],"names":["Calendar","locale","rest","Text"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;AAEO,MAAMA,QAAQ,GAAG,CAA0B;AAChDC,EAAAA,MADgD;AAEhD,KAAGC;AAF6C,CAA1B,
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/molecules/Calendar/Calendar.tsx"],"names":["Calendar","locale","rest","Text"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;AAEO,MAAMA,QAAQ,GAAG,CAA0B;AAChDC,EAAAA,MADgD;AAEhD,KAAGC;AAF6C,CAA1B,KAGa;AACnC,SACE,6BAAC,mBAAD,eACMA,IADN;AAEE,IAAA,aAAa,EAAEC,UAFjB;AAGE,IAAA,MAAM,EAAEF,MAAM,IAAI;AAHpB,KADF;AAOD,CAXM","sourcesContent":["import { Calendar as CalendarCore, CalendarProps, SelectionType } from '@tecsinapse/react-core';\nimport React from 'react';\nimport { getLocale } from '../../../utils/date';\nimport { Text } from '../../atoms/Text';\n\nexport const Calendar = <T extends SelectionType>({\n locale,\n ...rest\n}: CalendarProps<T>): JSX.Element => {\n return (\n <CalendarCore\n {...rest}\n TextComponent={Text}\n locale={locale ?? getLocale()}\n />\n );\n};\n"],"file":"Calendar.js"}
|
|
@@ -1,2 +1,3 @@
|
|
|
1
|
-
import { DatePickerProps } from '@tecsinapse/react-core';
|
|
2
|
-
export declare
|
|
1
|
+
import { DatePickerProps, SelectionType } from '@tecsinapse/react-core';
|
|
2
|
+
export declare type NativeDatePickerProps<T extends SelectionType> = Omit<DatePickerProps<T>, 'CalendarComponent' | 'renderCalendar' | 'requestCloseCalendar' | 'requestShowCalendar'>;
|
|
3
|
+
export declare const DatePicker: <T extends any>({ locale, onChange, ...rest }: NativeDatePickerProps<T>) => JSX.Element;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/molecules/DatePicker/DatePicker.tsx"],"names":["DatePicker","locale","onChange","rest","modal","handleChange","value","requestUpdate","Text","Calendar","show","close","calendar","blur","sync","NativeModal","children","others","CalendarBoxContent"],"mappings":";;;;;;;AAAA;;AAGA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/molecules/DatePicker/DatePicker.tsx"],"names":["DatePicker","locale","onChange","rest","modal","handleChange","value","requestUpdate","Text","Calendar","show","close","calendar","blur","sync","NativeModal","children","others","CalendarBoxContent"],"mappings":";;;;;;;AAAA;;AAGA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;AAIO,MAAMA,UAAU,GAAG,CAA0B;AAAEC,EAAAA,MAAF;AAAUC,EAAAA,QAAV;AAAoB,KAAGC;AAAvB,CAA1B,KAAmG;AAE3H,QAAMC,KAAK,GAAG,iCAAd;;AAEA,QAAMC,YAAY,GAAIC,KAAD,IAAsB;AACzCJ,IAAAA,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ,CAAGI,KAAH,CAAR;AACAF,IAAAA,KAAK,CAACG,aAAN;AACD,GAHD;;AAKA,SACE,6BAAC,qBAAD,eACMJ,IADN;AAEE,IAAA,aAAa,EAAEK,UAFjB;AAGE,IAAA,iBAAiB,EAAEC,kBAHrB;AAIE,IAAA,MAAM,EAAER,MAAM,IAAI,sBAJpB;AAKE,IAAA,QAAQ,EAAEI,YALZ;AAME,IAAA,mBAAmB,EAAE,MAAMD,KAAK,CAACM,IAAN,EAN7B;AAOE,IAAA,oBAAoB,EAAE,MAAMN,KAAK,CAACO,KAAN,EAP9B;AAQE,IAAA,cAAc,EAAE,CAACC,QAAD,EAAWC,IAAX,KAAoBT,KAAK,CAACU,IAAN,CAClC,6BAAC,WAAD;AAAa,MAAA,OAAO,EAAED;AAAtB,OACGD,QADH,CADkC;AARtC,KADF;AAiBD,CA1BM;;;;AA4BP,MAAMG,WAA2B,GAAG,CAAC;AAAEC,EAAAA,QAAF;AAAY,KAAGC;AAAf,CAAD,KAA6B;AAC/D,SACE,6BAAC,gBAAD;AAAW,IAAA,YAAY,EAAEC;AAAzB,KAAiDD,MAAjD,GACGD,QADH,CADF;AAKD,CAND","sourcesContent":["import {\n DatePicker as DatePickerCore, DatePickerProps, SelectionType, Value\n} from '@tecsinapse/react-core';\nimport React, { FC } from 'react';\nimport { getLocale } from '../../../utils/date';\nimport { IBaseModal, ModalView, useLazyModalManager } from '../../atoms/Modal';\nimport { Text } from '../../atoms/Text';\nimport { Calendar } from '../Calendar';\nimport { CalendarBoxContent } from './styled';\n\nexport type NativeDatePickerProps<T extends SelectionType> = Omit<DatePickerProps<T>, 'CalendarComponent' | 'renderCalendar' | 'requestCloseCalendar' | 'requestShowCalendar'>\n\nexport const DatePicker = <T extends SelectionType>({ locale, onChange, ...rest }: NativeDatePickerProps<T>): JSX.Element => {\n\n const modal = useLazyModalManager()\n \n const handleChange = (value?: Value<T>) => {\n onChange?.(value)\n modal.requestUpdate()\n }\n \n return (\n <DatePickerCore\n {...rest}\n TextComponent={Text}\n CalendarComponent={Calendar}\n locale={locale ?? getLocale()}\n onChange={handleChange}\n requestShowCalendar={() => modal.show()}\n requestCloseCalendar={() => modal.close()}\n renderCalendar={(calendar, blur) => modal.sync(\n <NativeModal onClose={blur}>\n {calendar}\n </NativeModal>\n )}\n />\n );\n\n};\n\nconst NativeModal: FC<IBaseModal> = ({ children, ...others }) => {\n return (\n <ModalView BoxComponent={CalendarBoxContent} {...others}>\n {children}\n </ModalView>\n )\n}"],"file":"DatePicker.js"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { DatePicker } from './DatePicker';
|
|
1
|
+
export { DatePicker, NativeDatePickerProps } from './DatePicker';
|
|
@@ -9,6 +9,12 @@ Object.defineProperty(exports, "DatePicker", {
|
|
|
9
9
|
return _DatePicker.DatePicker;
|
|
10
10
|
}
|
|
11
11
|
});
|
|
12
|
+
Object.defineProperty(exports, "NativeDatePickerProps", {
|
|
13
|
+
enumerable: true,
|
|
14
|
+
get: function () {
|
|
15
|
+
return _DatePicker.NativeDatePickerProps;
|
|
16
|
+
}
|
|
17
|
+
});
|
|
12
18
|
|
|
13
19
|
var _DatePicker = require("./DatePicker");
|
|
14
20
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/molecules/DatePicker/index.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/molecules/DatePicker/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA","sourcesContent":["export { DatePicker, NativeDatePickerProps } from './DatePicker';\n"],"file":"index.js"}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
1
|
import { DateTimePickerProps } from '@tecsinapse/react-core';
|
|
2
2
|
import { FC } from 'react';
|
|
3
|
-
export declare
|
|
3
|
+
export declare type NativeDateTimePickerProps = Omit<DateTimePickerProps, 'DateTimeSelectorComponent' | 'renderSelector' | 'requestCloseSelector' | 'requestShowSelector'>;
|
|
4
|
+
export declare const DateTimePicker: FC<NativeDateTimePickerProps>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/molecules/DateTimePicker/DateTimePicker.tsx"],"names":["DateTimePicker","locale","rest","modal","Text","DateTimeSelector","show","close","selector","blur","sync","NativeModal","children","others"],"mappings":";;;;;;;AAAA;;AAIA;;AACA;;AACA;;AACA;;AACA;;;;;;
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/molecules/DateTimePicker/DateTimePicker.tsx"],"names":["DateTimePicker","locale","rest","modal","Text","DateTimeSelector","show","close","selector","blur","sync","NativeModal","children","others"],"mappings":";;;;;;;AAAA;;AAIA;;AACA;;AACA;;AACA;;AACA;;;;;;AAIO,MAAMA,cAA6C,GAAG,CAAC;AAAEC,EAAAA,MAAF;AAAU,KAAGC;AAAb,CAAD,KAAyB;AAEpF,QAAMC,KAAK,GAAG,iCAAd;AAEA,SACE,6BAAC,yBAAD,eACMD,IADN;AAEE,IAAA,aAAa,EAAEE,UAFjB;AAGE,IAAA,yBAAyB,EAAEC,kCAH7B;AAIE,IAAA,MAAM,EAAEJ,MAAM,IAAI,sBAJpB;AAKE,IAAA,mBAAmB,EAAE,MAAME,KAAK,CAACG,IAAN,EAL7B;AAME,IAAA,oBAAoB,EAAE,MAAMH,KAAK,CAACI,KAAN,EAN9B;AAOE,IAAA,cAAc,EAAE,CAACC,QAAD,EAAWC,IAAX,KAAoBN,KAAK,CAACO,IAAN,CAClC,6BAAC,WAAD;AAAa,MAAA,OAAO,EAAED;AAAtB,OACGD,QADH,CADkC;AAPtC,KADF;AAeD,CAnBM;;;;AAqBP,MAAMG,WAA2B,GAAG,CAAC;AAAEC,EAAAA,QAAF;AAAY,KAAGC;AAAf,CAAD,KAA6B;AAC/D,SACE,6BAAC,gBAAD,EAAeA,MAAf,EACGD,QADH,CADF;AAKD,CAND","sourcesContent":["import {\n DateTimePicker as DateTimePickerCore,\n DateTimePickerProps\n} from '@tecsinapse/react-core';\nimport React, { FC } from 'react';\nimport { getLocale } from '../../../utils/date';\nimport { IBaseModal, ModalView, useLazyModalManager } from '../../atoms/Modal';\nimport { Text } from '../../atoms/Text';\nimport { DateTimeSelector } from '../DateTimeSelector';\n\nexport type NativeDateTimePickerProps = Omit<DateTimePickerProps, 'DateTimeSelectorComponent' | 'renderSelector' | 'requestCloseSelector' | 'requestShowSelector'>\n\nexport const DateTimePicker: FC<NativeDateTimePickerProps> = ({ locale, ...rest }) => {\n\n const modal = useLazyModalManager()\n\n return (\n <DateTimePickerCore\n {...rest}\n TextComponent={Text}\n DateTimeSelectorComponent={DateTimeSelector}\n locale={locale ?? getLocale()}\n requestShowSelector={() => modal.show()}\n requestCloseSelector={() => modal.close()}\n renderSelector={(selector, blur) => modal.sync(\n <NativeModal onClose={blur}>\n {selector}\n </NativeModal>\n )}\n />\n );\n};\n\nconst NativeModal: FC<IBaseModal> = ({ children, ...others }) => {\n return (\n <ModalView {...others}>\n {children}\n </ModalView>\n )\n}"],"file":"DateTimePicker.js"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { DateTimePicker } from './DateTimePicker';
|
|
1
|
+
export { DateTimePicker, NativeDateTimePickerProps } from './DateTimePicker';
|
|
@@ -9,6 +9,12 @@ Object.defineProperty(exports, "DateTimePicker", {
|
|
|
9
9
|
return _DateTimePicker.DateTimePicker;
|
|
10
10
|
}
|
|
11
11
|
});
|
|
12
|
+
Object.defineProperty(exports, "NativeDateTimePickerProps", {
|
|
13
|
+
enumerable: true,
|
|
14
|
+
get: function () {
|
|
15
|
+
return _DateTimePicker.NativeDateTimePickerProps;
|
|
16
|
+
}
|
|
17
|
+
});
|
|
12
18
|
|
|
13
19
|
var _DateTimePicker = require("./DateTimePicker");
|
|
14
20
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/molecules/DateTimePicker/index.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/molecules/DateTimePicker/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA","sourcesContent":["export { DateTimePicker, NativeDateTimePickerProps } from './DateTimePicker';\n"],"file":"index.js"}
|
|
@@ -51,7 +51,7 @@ const Component = ({
|
|
|
51
51
|
}) => {
|
|
52
52
|
const [selectedValues, setSelectedValues] = React.useState([]);
|
|
53
53
|
const [searchArg, setSearchArg] = (0, _reactCore.useDebouncedState)('', onSearch);
|
|
54
|
-
const ModalComponent = React.useMemo(() => (0, _styled.getStyledModal)(
|
|
54
|
+
const ModalComponent = React.useMemo(() => (0, _styled.getStyledModal)((0, _reactCore.getStatusBarHeight)(true)), []);
|
|
55
55
|
|
|
56
56
|
const _closeOnPick = closeOnPick && type === 'single';
|
|
57
57
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/molecules/Select/Modal.tsx"],"names":["Component","options","keyExtractor","labelExtractor","groupKeyExtractor","hideSearchBar","searchBarPlaceholder","focused","type","value","onSelect","onSearch","selectModalTitle","selectModalTitleComponent","confirmButtonText","loading","close","closeOnPick","others","selectedValues","setSelectedValues","React","useState","searchArg","setSearchArg","ModalComponent","useMemo","StatusBar","currentHeight","_closeOnPick","useEffect","getData","map","option","index","_checked","find","data","handlePressItem","newArr","found","push","handleConfirm","headerContent","onPress","icon","name","fontColor","text","item","Modal"],"mappings":"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","sourcesContent":["import { Checkbox, RadioButton, useDebouncedState } from '@tecsinapse/react-core';\nimport * as React from 'react';\nimport { FlatList, StatusBar, View } from 'react-native';\nimport { Button } from '../../atoms/Button';\nimport { Header } from '../../atoms/Header';\nimport { Input } from '../../atoms/Input';\nimport { IBaseModal, ModalView } from '../../atoms/Modal';\nimport { Text } from '../../atoms/Text';\nimport { SelectNativeProps } from './Select';\nimport {\n FetchIndicator, getStyledModal, ListItem, ModalFooter, SearchBarContainer,\n SelectIcon\n} from './styled';\n\ninterface LoadingProps {\n loading?: boolean;\n}\n\nconst Component = <Data, Type extends 'single' | 'multi'>({\n options,\n keyExtractor,\n labelExtractor,\n groupKeyExtractor,\n hideSearchBar,\n searchBarPlaceholder,\n focused,\n type,\n value,\n onSelect,\n onSearch,\n selectModalTitle,\n selectModalTitleComponent,\n confirmButtonText,\n loading,\n close,\n closeOnPick,\n ...others\n}: SelectNativeProps<Data, Type> & LoadingProps & IBaseModal): JSX.Element => {\n const [selectedValues, setSelectedValues] = React.useState<Data[]>([]);\n const [searchArg, setSearchArg] = useDebouncedState<string>('', onSearch);\n const ModalComponent = React.useMemo(() => getStyledModal(StatusBar.currentHeight), [])\n const _closeOnPick = closeOnPick && type === 'single'\n\n // Resets the temporary state to the initial state whenever the\n // modal is reopened or the value changes\n React.useEffect(() => {\n setSelectedValues(\n (value ? (type === 'multi' ? value : [value]) : []) as Data[]\n );\n }, [value, focused, setSelectedValues]);\n\n const getData = (options: Data[]) => {\n return options?.map((option, index) => ({\n ...option,\n _checked:\n type === 'multi'\n ? !!selectedValues.find(\n value => keyExtractor(option, index) == keyExtractor(value, index)\n )\n : keyExtractor((selectedValues[0] || {}) as Data, index) ==\n keyExtractor(option, index),\n }));\n };\n\n const data = typeof options !== 'function' ? getData(options) : [];\n\n const handlePressItem = (option: Data) => () => {\n setSelectedValues(selectedValues => {\n if (type === 'multi') {\n const newArr: Data[] = [];\n let found = false;\n for (const value of selectedValues) {\n if (keyExtractor(value) != keyExtractor(option)) newArr.push(value);\n else found = true;\n }\n if (!found) newArr.push(option);\n return newArr;\n }\n return keyExtractor((selectedValues[0] || {}) as Data) ===\n keyExtractor(option)\n ? []\n : [option];\n });\n };\n\n React.useEffect(() => {\n if (_closeOnPick && selectedValues[0] && (selectedValues[0] !== value)) {\n handleConfirm()\n }\n }, [selectedValues[0], value, closeOnPick])\n\n const handleConfirm = () => {\n // TS Workaround since TS won't infer the ternary operator's result type correctly\n type OnSelectArg = Parameters<typeof onSelect>[0];\n onSelect(\n (type === 'single' ? selectedValues[0] : selectedValues) as OnSelectArg\n );\n close?.()\n };\n\n const headerContent = selectModalTitleComponent ? (\n selectModalTitleComponent\n ) : selectModalTitle ? (\n <Text typography=\"h4\" fontWeight=\"bold\">\n {selectModalTitle}\n </Text>\n ) : null;\n\n return (\n <ModalView {...others} BoxComponent={ModalComponent} showCloseBar={false}>\n <Header\n rightButton={{\n onPress: close,\n icon: {\n name: 'close',\n type: 'material-community',\n fontColor: 'light',\n },\n }}\n >\n {headerContent}\n </Header>\n\n {!hideSearchBar && (\n <SearchBarContainer>\n <Input\n placeholder={searchBarPlaceholder}\n value={searchArg}\n onChange={text => setSearchArg(text)}\n leftComponent={\n <SelectIcon name=\"search\" type=\"ionicon\" size=\"centi\" />\n }\n />\n </SearchBarContainer>\n )}\n\n {loading && (\n <FetchIndicator animating={true} color={'grey'} size={'large'} />\n )}\n\n <FlatList\n data={data}\n keyExtractor={keyExtractor}\n fadingEdgeLength={200}\n renderItem={({ item }) => (\n <ListItem onPress={handlePressItem(item)}>\n <View pointerEvents={'none'}>\n {type === 'multi' ? (\n <Checkbox\n color={'primary'}\n labelPosition={'right'}\n checked={item._checked}\n >\n <Text fontWeight={item._checked ? 'bold' : 'regular'}>\n {labelExtractor(item)}\n </Text>\n </Checkbox>\n ) : (\n <RadioButton\n color={'primary'}\n labelPosition={'right'}\n checked={item._checked}\n >\n <Text fontWeight={item._checked ? 'bold' : 'regular'}>\n {labelExtractor(item)}\n </Text>\n </RadioButton>\n )}\n </View>\n </ListItem>\n )}\n />\n \n { !_closeOnPick && <ModalFooter>\n <Button\n variant={'filled'}\n color={'primary'}\n onPress={handleConfirm}\n disabled={loading}\n >\n <Text fontColor={'light'} fontWeight=\"bold\">\n {confirmButtonText}\n </Text>\n </Button>\n </ModalFooter>}\n </ModalView>\n );\n};\n\nexport const Modal = Component;\n"],"file":"Modal.js"}
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/molecules/Select/Modal.tsx"],"names":["Component","options","keyExtractor","labelExtractor","groupKeyExtractor","hideSearchBar","searchBarPlaceholder","focused","type","value","onSelect","onSearch","selectModalTitle","selectModalTitleComponent","confirmButtonText","loading","close","closeOnPick","others","selectedValues","setSelectedValues","React","useState","searchArg","setSearchArg","ModalComponent","useMemo","_closeOnPick","useEffect","getData","map","option","index","_checked","find","data","handlePressItem","newArr","found","push","handleConfirm","headerContent","onPress","icon","name","fontColor","text","item","Modal"],"mappings":"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","sourcesContent":["import { Checkbox, getStatusBarHeight, RadioButton, useDebouncedState } from '@tecsinapse/react-core';\nimport * as React from 'react';\nimport { FlatList, StatusBar, View } from 'react-native';\nimport { Button } from '../../atoms/Button';\nimport { Header } from '../../atoms/Header';\nimport { Input } from '../../atoms/Input';\nimport { IBaseModal, ModalView } from '../../atoms/Modal';\nimport { Text } from '../../atoms/Text';\nimport { SelectNativeProps } from './Select';\nimport {\n FetchIndicator, getStyledModal, ListItem, ModalFooter, SearchBarContainer,\n SelectIcon\n} from './styled';\n\ninterface LoadingProps {\n loading?: boolean;\n}\n\nconst Component = <Data, Type extends 'single' | 'multi'>({\n options,\n keyExtractor,\n labelExtractor,\n groupKeyExtractor,\n hideSearchBar,\n searchBarPlaceholder,\n focused,\n type,\n value,\n onSelect,\n onSearch,\n selectModalTitle,\n selectModalTitleComponent,\n confirmButtonText,\n loading,\n close,\n closeOnPick,\n ...others\n}: SelectNativeProps<Data, Type> & LoadingProps & IBaseModal): JSX.Element => {\n const [selectedValues, setSelectedValues] = React.useState<Data[]>([]);\n const [searchArg, setSearchArg] = useDebouncedState<string>('', onSearch);\n const ModalComponent = React.useMemo(() => getStyledModal(getStatusBarHeight(true)), [])\n const _closeOnPick = closeOnPick && type === 'single'\n\n // Resets the temporary state to the initial state whenever the\n // modal is reopened or the value changes\n React.useEffect(() => {\n setSelectedValues(\n (value ? (type === 'multi' ? value : [value]) : []) as Data[]\n );\n }, [value, focused, setSelectedValues]);\n\n const getData = (options: Data[]) => {\n return options?.map((option, index) => ({\n ...option,\n _checked:\n type === 'multi'\n ? !!selectedValues.find(\n value => keyExtractor(option, index) == keyExtractor(value, index)\n )\n : keyExtractor((selectedValues[0] || {}) as Data, index) ==\n keyExtractor(option, index),\n }));\n };\n\n const data = typeof options !== 'function' ? getData(options) : [];\n\n const handlePressItem = (option: Data) => () => {\n setSelectedValues(selectedValues => {\n if (type === 'multi') {\n const newArr: Data[] = [];\n let found = false;\n for (const value of selectedValues) {\n if (keyExtractor(value) != keyExtractor(option)) newArr.push(value);\n else found = true;\n }\n if (!found) newArr.push(option);\n return newArr;\n }\n return keyExtractor((selectedValues[0] || {}) as Data) ===\n keyExtractor(option)\n ? []\n : [option];\n });\n };\n\n React.useEffect(() => {\n if (_closeOnPick && selectedValues[0] && (selectedValues[0] !== value)) {\n handleConfirm()\n }\n }, [selectedValues[0], value, closeOnPick])\n\n const handleConfirm = () => {\n // TS Workaround since TS won't infer the ternary operator's result type correctly\n type OnSelectArg = Parameters<typeof onSelect>[0];\n onSelect(\n (type === 'single' ? selectedValues[0] : selectedValues) as OnSelectArg\n );\n close?.()\n };\n\n const headerContent = selectModalTitleComponent ? (\n selectModalTitleComponent\n ) : selectModalTitle ? (\n <Text typography=\"h4\" fontWeight=\"bold\">\n {selectModalTitle}\n </Text>\n ) : null;\n\n return (\n <ModalView {...others} BoxComponent={ModalComponent} showCloseBar={false}>\n <Header\n rightButton={{\n onPress: close,\n icon: {\n name: 'close',\n type: 'material-community',\n fontColor: 'light',\n },\n }}\n >\n {headerContent}\n </Header>\n\n {!hideSearchBar && (\n <SearchBarContainer>\n <Input\n placeholder={searchBarPlaceholder}\n value={searchArg}\n onChange={text => setSearchArg(text)}\n leftComponent={\n <SelectIcon name=\"search\" type=\"ionicon\" size=\"centi\" />\n }\n />\n </SearchBarContainer>\n )}\n\n {loading && (\n <FetchIndicator animating={true} color={'grey'} size={'large'} />\n )}\n\n <FlatList\n data={data}\n keyExtractor={keyExtractor}\n fadingEdgeLength={200}\n renderItem={({ item }) => (\n <ListItem onPress={handlePressItem(item)}>\n <View pointerEvents={'none'}>\n {type === 'multi' ? (\n <Checkbox\n color={'primary'}\n labelPosition={'right'}\n checked={item._checked}\n >\n <Text fontWeight={item._checked ? 'bold' : 'regular'}>\n {labelExtractor(item)}\n </Text>\n </Checkbox>\n ) : (\n <RadioButton\n color={'primary'}\n labelPosition={'right'}\n checked={item._checked}\n >\n <Text fontWeight={item._checked ? 'bold' : 'regular'}>\n {labelExtractor(item)}\n </Text>\n </RadioButton>\n )}\n </View>\n </ListItem>\n )}\n />\n \n { !_closeOnPick && <ModalFooter>\n <Button\n variant={'filled'}\n color={'primary'}\n onPress={handleConfirm}\n disabled={loading}\n >\n <Text fontColor={'light'} fontWeight=\"bold\">\n {confirmButtonText}\n </Text>\n </Button>\n </ModalFooter>}\n </ModalView>\n );\n};\n\nexport const Modal = Component;\n"],"file":"Modal.js"}
|
|
@@ -21,7 +21,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
|
|
|
21
21
|
|
|
22
22
|
const getStyledModal = (safeTop = 0) => {
|
|
23
23
|
return (0, _native.default)(_reactNative.View)`
|
|
24
|
-
padding-top: ${`${safeTop}px`};
|
|
24
|
+
padding-top: ${`${(0, _reactCore.RFValue)(safeTop)}px`};
|
|
25
25
|
background-color: ${({
|
|
26
26
|
theme
|
|
27
27
|
}) => theme.miscellaneous.bodyColor};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/molecules/Select/styled.ts"],"names":["getStyledModal","safeTop","View","theme","miscellaneous","bodyColor","StyledSelectionText","Text","props","typography","h5","lineHeight","Dummy","StyledPressableSurface","PressableSurface","Header","spacing","deca","CloseButton","Button","SearchBarContainer","SearchBar","Input","ListItem","color","secondary","light","mili","ModalFooter","SelectIcon","Icon","centi","medium","FetchIndicator","ActivityIndicator"],"mappings":";;;;;;;AAAA;;AACA;;
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/molecules/Select/styled.ts"],"names":["getStyledModal","safeTop","View","theme","miscellaneous","bodyColor","StyledSelectionText","Text","props","typography","h5","lineHeight","Dummy","StyledPressableSurface","PressableSurface","Header","spacing","deca","CloseButton","Button","SearchBarContainer","SearchBar","Input","ListItem","color","secondary","light","mili","ModalFooter","SelectIcon","Icon","centi","medium","FetchIndicator","ActivityIndicator"],"mappings":";;;;;;;AAAA;;AACA;;AAYA;;AACA;;AACA;;;;;;AAEO,MAAMA,cAAc,GAAG,CAACC,OAAe,GAAG,CAAnB,KAAyB;AACrD,SAAO,qBAAOC,iBAAP,CAA+C;AACxD,mBAAoB,GAAE,wBAAQD,OAAR,CAAiB,IAAI;AAC3C,wBAAwB,CAAC;AAAEE,IAAAA;AAAF,GAAD,KAAeA,KAAK,CAACC,aAAN,CAAoBC,SAAU;AACrE;AACA,GAJE;AAKD,CANM;;;AAQA,MAAMC,mBAAmB,GAAG,qBAAOC,UAAP,EAChCC,KAAD;AAAA;;AAAA,SAA+D,gBAAI;AACrE,mBADoE,gBACjDA,KAAK,CAACL,KAD2C,iDACjD,aAAaM,UAAb,CAAwBC,EAAxB,CAA2BC,UAAW;AACzD,MAAM,oCAAoBH,KAApB,CAA2B;AACjC,GAHE;AAAA,CADiC,CAA5B;;AAOA,MAAMI,KAAK,GAAG,qBAAOV,iBAAP,CAAa;AAClC;AACA;AACA,CAHO;;AAKA,MAAMW,sBAAsB,GAAG,qBACpCC,2BADoC,CAEb;AACzB;AACA,CAJO;;AAMA,MAAMC,MAAM,GAAG,qBAAOb,iBAAP,CAA8C;AACpE;AACA;AACA;AACA;AACA;AACA;AACA,aAAa,CAAC;AAAEC,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACa,OAAN,CAAcC,IAAK;AAC/C,YAAY,2BAAW,MAAX,CAAmB;AAC/B,CATO;;AAWA,MAAMC,WAAW,GAAG,qBAAOC,iBAAP,CAAkD;AAC7E;AACA;AACA,CAHO;;AAKA,MAAMC,kBAAkB,GAAG,qBAAOlB,iBAAP,CAA8C;AAChF,aAAa,CAAC;AAAEC,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACa,OAAN,CAAcC,IAAK;AAC/C;AACA,CAHO;;AAKA,MAAMI,SAAS,GAAG,qBAAOC,YAAP,CAAsD;AAC/E,mBAAmB,CAAC;AAAEnB,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACa,OAAN,CAAcC,IAAK;AACrD,CAFO;;AAIA,MAAMM,QAAQ,GAAG,qBAAOT,2BAAP,CAEtB;AACF,yBAAyB,2BAAW,KAAX,CAAkB;AAC3C,kBAAkB,CAAC;AAAEX,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACqB,KAAN,CAAYC,SAAZ,CAAsBC,KAAM;AAC7D,sBAAsB,CAAC;AAAEvB,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACa,OAAN,CAAcW,IAAK;AACxD,wBAAwB,CAAC;AAAExB,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACa,OAAN,CAAcC,IAAK;AAC1D,CAPO;;AASA,MAAMW,WAAW,GAAG,qBAAO1B,iBAAP,CAAkC;AAC7D;AACA;AACA;AACA,sBAAsB,CAAC;AAAEC,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACC,aAAN,CAAoBC,SAAU;AACnE,aAAa,CAAC;AAAEF,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACa,OAAN,CAAcC,IAAK;AAC/C,CANO;;AAQA,MAAMY,UAAU,GAAG,qBAAOC,eAAP,CAAkC;AAC5D,aAAa,CAAC;AAAE3B,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACa,OAAN,CAAce,KAAM;AAChD,WAAW,CAAC;AAAE5B,EAAAA;AAAF,CAAD,KAAeA,KAAK,CAACqB,KAAN,CAAYC,SAAZ,CAAsBO,MAAO;AACvD,CAHO;;AAKA,MAAMC,cAAc,GAAG,qBAAOC,8BAAP,CAA0B;AACxD;AACA,CAFO","sourcesContent":["import styled, { css } from '@emotion/native';\nimport {\n Button,\n ButtonProps,\n disabledInputStyles,\n Icon,\n InputContainerProps,\n PressableSurface,\n PressableSurfaceProps,\n RFValue,\n RFValueStr,\n StyleProps\n} from '@tecsinapse/react-core';\nimport { ActivityIndicator, ModalProps, View, ViewProps } from 'react-native';\nimport { Input, InputNativeProps } from '../../atoms/Input';\nimport { Text } from '../../atoms/Text';\n\nexport const getStyledModal = (safeTop: number = 0) => {\n return styled(View)<ModalProps & Partial<StyleProps>>`\n padding-top: ${`${RFValue(safeTop)}px`};\n background-color: ${({ theme }) => theme.miscellaneous.bodyColor};\n height: 100%;\n `\n}\n\nexport const StyledSelectionText = styled(Text)(\n (props: Partial<InputContainerProps> & Partial<StyleProps>) => css`\n line-height: ${props.theme?.typography.h5.lineHeight};\n ${disabledInputStyles(props)};\n `\n);\n\nexport const Dummy = styled(View)`\n aspect-ratio: 1;\n height: 100%;\n`;\n\nexport const StyledPressableSurface = styled(\n PressableSurface\n)<PressableSurfaceProps>`\n width: 100%;\n`;\n\nexport const Header = styled(View)<ViewProps & Partial<StyleProps>>`\n position: relative;\n width: 100%;\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n padding: ${({ theme }) => theme.spacing.deca};\n height: ${RFValueStr('75px')};\n`;\n\nexport const CloseButton = styled(Button)<ButtonProps & Partial<StyleProps>>`\n aspect-ratio: 1;\n height: 100%;\n`;\n\nexport const SearchBarContainer = styled(View)<ViewProps & Partial<StyleProps>>`\n padding: ${({ theme }) => theme.spacing.deca};\n position: relative;\n`;\n\nexport const SearchBar = styled(Input)<InputNativeProps & Partial<StyleProps>>`\n margin-bottom: ${({ theme }) => theme.spacing.deca};\n`;\n\nexport const ListItem = styled(PressableSurface)<\n PressableSurfaceProps & Partial<StyleProps>\n>`\n border-bottom-width: ${RFValueStr('1px')};\n border-color: ${({ theme }) => theme.color.secondary.light};\n padding-vertical: ${({ theme }) => theme.spacing.mili};\n padding-horizontal: ${({ theme }) => theme.spacing.deca};\n`;\n\nexport const ModalFooter = styled(View)<Partial<StyleProps>>`\n width: 100%;\n height: auto;\n bottom: 0;\n background-color: ${({ theme }) => theme.miscellaneous.bodyColor};\n padding: ${({ theme }) => theme.spacing.deca};\n`;\n\nexport const SelectIcon = styled(Icon)<Partial<StyleProps>>`\n padding: ${({ theme }) => theme.spacing.centi};\n color: ${({ theme }) => theme.color.secondary.medium};\n`;\n\nexport const FetchIndicator = styled(ActivityIndicator)`\n align-self: center;\n`;\n"],"file":"styled.js"}
|
package/dist/index.d.ts
CHANGED
|
@@ -12,8 +12,8 @@ export { Tag, TagProps } from './components/atoms/Tag';
|
|
|
12
12
|
export { SnappingSlider, SnappingSliderProps, } from './components/atoms/SnappingSlider';
|
|
13
13
|
export { Badge, BadgeNativeProps } from './components/atoms/Badge';
|
|
14
14
|
export { Snackbar, SnackbarNativeProps } from './components/molecules/Snackbar';
|
|
15
|
-
export { DatePicker } from './components/molecules/DatePicker';
|
|
16
|
-
export { DateTimePicker } from './components/molecules/DateTimePicker';
|
|
15
|
+
export { DatePicker, NativeDatePickerProps } from './components/molecules/DatePicker';
|
|
16
|
+
export { DateTimePicker, NativeDateTimePickerProps } from './components/molecules/DateTimePicker';
|
|
17
17
|
export { Avatar } from './components/atoms/Avatar';
|
|
18
18
|
export { Calendar } from './components/molecules/Calendar';
|
|
19
19
|
export { DateTimeSelector } from './components/molecules/DateTimeSelector';
|
package/dist/index.js
CHANGED
|
@@ -33,7 +33,9 @@ var _exportNames = {
|
|
|
33
33
|
Snackbar: true,
|
|
34
34
|
SnackbarNativeProps: true,
|
|
35
35
|
DatePicker: true,
|
|
36
|
+
NativeDatePickerProps: true,
|
|
36
37
|
DateTimePicker: true,
|
|
38
|
+
NativeDateTimePickerProps: true,
|
|
37
39
|
Avatar: true,
|
|
38
40
|
Calendar: true,
|
|
39
41
|
DateTimeSelector: true,
|
|
@@ -218,12 +220,24 @@ Object.defineProperty(exports, "DatePicker", {
|
|
|
218
220
|
return _DatePicker.DatePicker;
|
|
219
221
|
}
|
|
220
222
|
});
|
|
223
|
+
Object.defineProperty(exports, "NativeDatePickerProps", {
|
|
224
|
+
enumerable: true,
|
|
225
|
+
get: function () {
|
|
226
|
+
return _DatePicker.NativeDatePickerProps;
|
|
227
|
+
}
|
|
228
|
+
});
|
|
221
229
|
Object.defineProperty(exports, "DateTimePicker", {
|
|
222
230
|
enumerable: true,
|
|
223
231
|
get: function () {
|
|
224
232
|
return _DateTimePicker.DateTimePicker;
|
|
225
233
|
}
|
|
226
234
|
});
|
|
235
|
+
Object.defineProperty(exports, "NativeDateTimePickerProps", {
|
|
236
|
+
enumerable: true,
|
|
237
|
+
get: function () {
|
|
238
|
+
return _DateTimePicker.NativeDateTimePickerProps;
|
|
239
|
+
}
|
|
240
|
+
});
|
|
227
241
|
Object.defineProperty(exports, "Avatar", {
|
|
228
242
|
enumerable: true,
|
|
229
243
|
get: function () {
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAIA;;AAIA;;AACA;;AAIA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA","sourcesContent":["export * from '@tecsinapse/react-core';\nexport { Header, HeaderProps } from './components/atoms/Header';\nexport { Select, SelectNativeProps } from './components/molecules/Select';\nexport { Input, InputNativeProps } from './components/atoms/Input';\nexport { TextArea, TextAreaProps } from './components/atoms/TextArea';\nexport { Text, TextNativeProps } from './components/atoms/Text';\nexport { Error, Loading, Success, Button, ButtonNativeProps } from './components/atoms/Button';\nexport { GroupButtonOption } from './components/atoms/GroupButton';\nexport {\n InputPassword,\n InputPasswordNativeProps,\n} from './components/molecules/InputPassword';\nexport {\n BottomNavigator,\n BottomNavigatorProps,\n} from './components/atoms/BottomNavigator';\nexport { Tag, TagProps } from './components/atoms/Tag';\nexport {\n SnappingSlider,\n SnappingSliderProps,\n} from './components/atoms/SnappingSlider';\nexport { Badge, BadgeNativeProps } from './components/atoms/Badge';\nexport { Snackbar, SnackbarNativeProps } from './components/molecules/Snackbar';\nexport { DatePicker, NativeDatePickerProps } from './components/molecules/DatePicker';\nexport { DateTimePicker, NativeDateTimePickerProps } from './components/molecules/DateTimePicker';\nexport { Avatar } from './components/atoms/Avatar';\nexport { Calendar } from './components/molecules/Calendar';\nexport { DateTimeSelector } from './components/molecules/DateTimeSelector';\nexport { ModalGroupManager, ModalView, ModalLifecycleHandler, useLazyModalManager, useModalManager, IBaseModal } from './components/atoms/Modal';\n"],"file":"index.js"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tecsinapse/react-native-kit",
|
|
3
3
|
"description": "TecSinapse React Native components",
|
|
4
|
-
"version": "1.12.
|
|
4
|
+
"version": "1.12.16",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
7
7
|
"license": "MIT",
|
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
"dependencies": {
|
|
14
14
|
"@emotion/native": "^11.0.0",
|
|
15
15
|
"@emotion/react": "^11.4.1",
|
|
16
|
-
"@tecsinapse/react-core": "^1.12.
|
|
16
|
+
"@tecsinapse/react-core": "^1.12.10"
|
|
17
17
|
},
|
|
18
18
|
"repository": {
|
|
19
19
|
"type": "git",
|
|
@@ -34,5 +34,5 @@
|
|
|
34
34
|
"devDependencies": {
|
|
35
35
|
"@types/uuid": "^8.3.3"
|
|
36
36
|
},
|
|
37
|
-
"gitHead": "
|
|
37
|
+
"gitHead": "89853e05d039d029e66401700b450dc9be58de3e"
|
|
38
38
|
}
|
|
@@ -5,6 +5,7 @@ import {
|
|
|
5
5
|
StyleProps,
|
|
6
6
|
Text,
|
|
7
7
|
} from '@tecsinapse/react-core';
|
|
8
|
+
import { Platform } from 'react-native';
|
|
8
9
|
import { TextNativeProps } from './Text';
|
|
9
10
|
|
|
10
11
|
export interface Font {
|
|
@@ -20,7 +21,7 @@ export const fontStyles = ({
|
|
|
20
21
|
const fontFamily = theme?.font.stack[fontStack] || '';
|
|
21
22
|
const fontStyle = theme?.font.files[fontWeight];
|
|
22
23
|
return css`
|
|
23
|
-
font-weight: normal;
|
|
24
|
+
${Platform.OS === 'android' ? 'font-weight: normal;' : undefined}
|
|
24
25
|
font-family: ${fontStyle?.replace('{0}', fontFamily)};
|
|
25
26
|
`;
|
|
26
27
|
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Calendar as CalendarCore, SelectionType } from '@tecsinapse/react-core';
|
|
1
|
+
import { Calendar as CalendarCore, CalendarProps, SelectionType } from '@tecsinapse/react-core';
|
|
2
2
|
import React from 'react';
|
|
3
3
|
import { getLocale } from '../../../utils/date';
|
|
4
4
|
import { Text } from '../../atoms/Text';
|
|
@@ -6,7 +6,7 @@ import { Text } from '../../atoms/Text';
|
|
|
6
6
|
export const Calendar = <T extends SelectionType>({
|
|
7
7
|
locale,
|
|
8
8
|
...rest
|
|
9
|
-
}): JSX.Element => {
|
|
9
|
+
}: CalendarProps<T>): JSX.Element => {
|
|
10
10
|
return (
|
|
11
11
|
<CalendarCore
|
|
12
12
|
{...rest}
|
|
@@ -8,7 +8,9 @@ import { Text } from '../../atoms/Text';
|
|
|
8
8
|
import { Calendar } from '../Calendar';
|
|
9
9
|
import { CalendarBoxContent } from './styled';
|
|
10
10
|
|
|
11
|
-
export
|
|
11
|
+
export type NativeDatePickerProps<T extends SelectionType> = Omit<DatePickerProps<T>, 'CalendarComponent' | 'renderCalendar' | 'requestCloseCalendar' | 'requestShowCalendar'>
|
|
12
|
+
|
|
13
|
+
export const DatePicker = <T extends SelectionType>({ locale, onChange, ...rest }: NativeDatePickerProps<T>): JSX.Element => {
|
|
12
14
|
|
|
13
15
|
const modal = useLazyModalManager()
|
|
14
16
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { DatePicker } from './DatePicker';
|
|
1
|
+
export { DatePicker, NativeDatePickerProps } from './DatePicker';
|
|
@@ -8,7 +8,9 @@ import { IBaseModal, ModalView, useLazyModalManager } from '../../atoms/Modal';
|
|
|
8
8
|
import { Text } from '../../atoms/Text';
|
|
9
9
|
import { DateTimeSelector } from '../DateTimeSelector';
|
|
10
10
|
|
|
11
|
-
export
|
|
11
|
+
export type NativeDateTimePickerProps = Omit<DateTimePickerProps, 'DateTimeSelectorComponent' | 'renderSelector' | 'requestCloseSelector' | 'requestShowSelector'>
|
|
12
|
+
|
|
13
|
+
export const DateTimePicker: FC<NativeDateTimePickerProps> = ({ locale, ...rest }) => {
|
|
12
14
|
|
|
13
15
|
const modal = useLazyModalManager()
|
|
14
16
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export { DateTimePicker } from './DateTimePicker';
|
|
1
|
+
export { DateTimePicker, NativeDateTimePickerProps } from './DateTimePicker';
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Checkbox, RadioButton, useDebouncedState } from '@tecsinapse/react-core';
|
|
1
|
+
import { Checkbox, getStatusBarHeight, RadioButton, useDebouncedState } from '@tecsinapse/react-core';
|
|
2
2
|
import * as React from 'react';
|
|
3
3
|
import { FlatList, StatusBar, View } from 'react-native';
|
|
4
4
|
import { Button } from '../../atoms/Button';
|
|
@@ -38,7 +38,7 @@ const Component = <Data, Type extends 'single' | 'multi'>({
|
|
|
38
38
|
}: SelectNativeProps<Data, Type> & LoadingProps & IBaseModal): JSX.Element => {
|
|
39
39
|
const [selectedValues, setSelectedValues] = React.useState<Data[]>([]);
|
|
40
40
|
const [searchArg, setSearchArg] = useDebouncedState<string>('', onSearch);
|
|
41
|
-
const ModalComponent = React.useMemo(() => getStyledModal(
|
|
41
|
+
const ModalComponent = React.useMemo(() => getStyledModal(getStatusBarHeight(true)), [])
|
|
42
42
|
const _closeOnPick = closeOnPick && type === 'single'
|
|
43
43
|
|
|
44
44
|
// Resets the temporary state to the initial state whenever the
|
|
@@ -7,6 +7,7 @@ import {
|
|
|
7
7
|
InputContainerProps,
|
|
8
8
|
PressableSurface,
|
|
9
9
|
PressableSurfaceProps,
|
|
10
|
+
RFValue,
|
|
10
11
|
RFValueStr,
|
|
11
12
|
StyleProps
|
|
12
13
|
} from '@tecsinapse/react-core';
|
|
@@ -16,7 +17,7 @@ import { Text } from '../../atoms/Text';
|
|
|
16
17
|
|
|
17
18
|
export const getStyledModal = (safeTop: number = 0) => {
|
|
18
19
|
return styled(View)<ModalProps & Partial<StyleProps>>`
|
|
19
|
-
padding-top: ${`${safeTop}px`};
|
|
20
|
+
padding-top: ${`${RFValue(safeTop)}px`};
|
|
20
21
|
background-color: ${({ theme }) => theme.miscellaneous.bodyColor};
|
|
21
22
|
height: 100%;
|
|
22
23
|
`
|
package/src/index.ts
CHANGED
|
@@ -21,8 +21,8 @@ export {
|
|
|
21
21
|
} from './components/atoms/SnappingSlider';
|
|
22
22
|
export { Badge, BadgeNativeProps } from './components/atoms/Badge';
|
|
23
23
|
export { Snackbar, SnackbarNativeProps } from './components/molecules/Snackbar';
|
|
24
|
-
export { DatePicker } from './components/molecules/DatePicker';
|
|
25
|
-
export { DateTimePicker } from './components/molecules/DateTimePicker';
|
|
24
|
+
export { DatePicker, NativeDatePickerProps } from './components/molecules/DatePicker';
|
|
25
|
+
export { DateTimePicker, NativeDateTimePickerProps } from './components/molecules/DateTimePicker';
|
|
26
26
|
export { Avatar } from './components/atoms/Avatar';
|
|
27
27
|
export { Calendar } from './components/molecules/Calendar';
|
|
28
28
|
export { DateTimeSelector } from './components/molecules/DateTimeSelector';
|