@adiraku/react-native-ui 0.1.16 → 0.2.0

package/lib/typescript/components/RadioInput/RadioInput.type.d.ts

@@ -33,10 +33,19 @@ export interface RadioInputProps {
     saveInputLabel: string;
     bottomSheetOpt: Omit<BottomSheetProps, 'visibility' | 'onDismiss'>;
     onInputDismiss?: () => void;
+    customRadioInput?: (props: RadioItemPropsComponent) => any;
+    customItemSeparator?: any;
 }
 export declare type RadioItemProps = {
     label: string;
     value: string;
     disabled?: boolean;
 };
+export declare type RadioItemPropsComponent = {
+    data: {
+        item: RadioItemProps;
+    };
+    selectedValue?: RadioItemProps;
+    onItemPress?: (value: RadioItemProps) => void;
+};
 //# sourceMappingURL=RadioInput.type.d.ts.map

package/lib/typescript/components/RadioInput/RadioInput.type.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RadioInput.type.d.ts","sourceRoot":"","sources":["../../../../src/components/RadioInput/RadioInput.type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,gBAAgB,EAAE,MAAM,iCAAiC,CAAC;AAEnE,MAAM,WAAW,eAAe;IAC9B;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;;;OAIG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB,KAAK,CAAC,EAAE,cAAc,CAAC;IAEvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,IAAI,CAAC,EAAE,cAAc,EAAE,CAAC;IAExB,WAAW,CAAC,EAAE,CAAC,aAAa,CAAC,EAAE,cAAc,KAAK,IAAI,CAAC;IAEvD,cAAc,EAAE,MAAM,CAAC;IAEvB,cAAc,EAAE,IAAI,CAAC,gBAAgB,EAAE,YAAY,GAAG,WAAW,CAAC,CAAC;IAEnE,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;CAC7B;AAED,oBAAY,cAAc,GAAG;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC"}
+{"version":3,"file":"RadioInput.type.d.ts","sourceRoot":"","sources":["../../../../src/components/RadioInput/RadioInput.type.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,gBAAgB,EAAE,MAAM,iCAAiC,CAAC;AAEnE,MAAM,WAAW,eAAe;IAC9B;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;;;OAIG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB,KAAK,CAAC,EAAE,cAAc,CAAC;IAEvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,IAAI,CAAC,EAAE,cAAc,EAAE,CAAC;IAExB,WAAW,CAAC,EAAE,CAAC,aAAa,CAAC,EAAE,cAAc,KAAK,IAAI,CAAC;IAEvD,cAAc,EAAE,MAAM,CAAC;IAEvB,cAAc,EAAE,IAAI,CAAC,gBAAgB,EAAE,YAAY,GAAG,WAAW,CAAC,CAAC;IAEnE,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAE5B,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,uBAAuB,KAAK,GAAG,CAAC;IAE3D,mBAAmB,CAAC,EAAE,GAAG,CAAC;CAC3B;AAED,oBAAY,cAAc,GAAG;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,oBAAY,uBAAuB,GAAG;IACpC,IAAI,EAAE;QACJ,IAAI,EAAE,cAAc,CAAC;KACtB,CAAC;IACF,aAAa,CAAC,EAAE,cAAc,CAAC;IAC/B,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,cAAc,KAAK,IAAI,CAAC;CAC/C,CAAC"}

package/lib/typescript/components/Snackbar/Snackbar.component.d.ts

@@ -1,5 +1,12 @@
 import * as React from 'react';
-import type { SnackbarProps } from './Snackbar.type';
-declare const Snackbar: React.FunctionComponent<SnackbarProps>;
-export { Snackbar };
+import { ToastProps, ToastShowParams, ToastHideParams } from 'react-native-toast-message';
+declare function SnackbarComponent(props: ToastProps): JSX.Element;
+declare const Snackbar: {
+    show: (params: Omit<ToastShowParams, 'props' | 'text1' | 'text2' | 'type'> & {
+        message: string;
+        action?: React.ReactNode;
+    }) => void;
+    hide: (params: ToastHideParams) => void;
+};
+export { Snackbar, SnackbarComponent };
 //# sourceMappingURL=Snackbar.component.d.ts.map

package/lib/typescript/components/Snackbar/Snackbar.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Snackbar.component.d.ts","sourceRoot":"","sources":["../../../../src/components/Snackbar/Snackbar.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAErD,QAAA,MAAM,QAAQ,EAAE,KAAK,CAAC,iBAAiB,CAAC,aAAa,CAiBpD,CAAC;AAEF,OAAO,EAAE,QAAQ,EAAE,CAAC"}
+{"version":3,"file":"Snackbar.component.d.ts","sourceRoot":"","sources":["../../../../src/components/Snackbar/Snackbar.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAgB,EACd,UAAU,EACV,eAAe,EACf,eAAe,EAChB,MAAM,4BAA4B,CAAC;AA0BpC,iBAAS,iBAAiB,CAAC,KAAK,EAAE,UAAU,eAuB3C;AAED,QAAA,MAAM,QAAQ;mBAEF,KAAK,eAAe,EAAE,OAAO,GAAG,OAAO,GAAG,OAAO,GAAG,MAAM,CAAC,GAAG;QACpE,OAAO,EAAE,MAAM,CAAC;QAChB,MAAM,CAAC,EAAE,MAAM,SAAS,CAAC;KAC1B;mBAWY,eAAe;CAG/B,CAAC;AAEF,OAAO,EAAE,QAAQ,EAAE,iBAAiB,EAAE,CAAC"}

package/lib/typescript/components/Snackbar/Snakbar.style.d.ts

@@ -1,6 +1,7 @@
 import type { ViewStyle, TextStyle } from 'react-native';
 interface ComputedStyleProps {
     container?: ViewStyle;
+    snackbarWrapper?: ViewStyle;
     message?: TextStyle;
     actionWrapper?: ViewStyle;
 }

package/lib/typescript/components/Snackbar/Snakbar.style.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Snakbar.style.d.ts","sourceRoot":"","sources":["../../../../src/components/Snackbar/Snakbar.style.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzD,UAAU,kBAAkB;IAC1B,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,aAAa,CAAC,EAAE,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,QAAQ,0BAsBpB,CAAC"}
+{"version":3,"file":"Snakbar.style.d.ts","sourceRoot":"","sources":["../../../../src/components/Snackbar/Snakbar.style.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzD,UAAU,kBAAkB;IAC1B,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,aAAa,CAAC,EAAE,SAAS,CAAC;CAC3B;AAED,eAAO,MAAM,QAAQ,0BA2BpB,CAAC"}

package/lib/typescript/components/TextInput/TextInput.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TextInput.component.d.ts","sourceRoot":"","sources":["../../../../src/components/TextInput/TextInput.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AASvD,QAAA,MAAM,SAAS,EAAE,KAAK,CAAC,iBAAiB,CAAC,cAAc,CA+GtD,CAAC;AAEF,OAAO,EAAE,SAAS,EAAE,CAAC"}
+{"version":3,"file":"TextInput.component.d.ts","sourceRoot":"","sources":["../../../../src/components/TextInput/TextInput.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AASvD,QAAA,MAAM,SAAS,EAAE,KAAK,CAAC,iBAAiB,CAAC,cAAc,CA2GtD,CAAC;AAEF,OAAO,EAAE,SAAS,EAAE,CAAC"}

package/lib/typescript/components/button/button.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button.component.d.ts","sourceRoot":"","sources":["../../../../src/components/button/button.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAEjD,QAAA,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CA8BjC,CAAC;AAEF,OAAO,EAAE,MAAM,EAAE,CAAC"}
+{"version":3,"file":"button.component.d.ts","sourceRoot":"","sources":["../../../../src/components/button/button.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAEjD,QAAA,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAmCjC,CAAC;AAEF,OAAO,EAAE,MAAM,EAAE,CAAC"}

package/lib/typescript/components/countdown/countdown.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"countdown.component.d.ts","sourceRoot":"","sources":["../../../../src/components/countdown/countdown.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAIvD,QAAA,MAAM,SAAS,EAAE,KAAK,CAAC,iBAAiB,CAAC,cAAc,CAsEtD,CAAC;AAmBF,OAAO,EAAE,SAAS,EAAE,CAAC"}
+{"version":3,"file":"countdown.component.d.ts","sourceRoot":"","sources":["../../../../src/components/countdown/countdown.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAIvD,QAAA,MAAM,SAAS,EAAE,KAAK,CAAC,iBAAiB,CAAC,cAAc,CAuEtD,CAAC;AAmBF,OAAO,EAAE,SAAS,EAAE,CAAC"}

package/lib/typescript/components/countdown/countdown.style.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"countdown.style.d.ts","sourceRoot":"","sources":["../../../../src/components/countdown/countdown.style.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzD,UAAU,kBAAkB;IAC1B,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,gBAAgB,CAAC,EAAE,SAAS,CAAC;CAC9B;AAED,eAAO,MAAM,QAAQ,0BA4BpB,CAAC"}
+{"version":3,"file":"countdown.style.d.ts","sourceRoot":"","sources":["../../../../src/components/countdown/countdown.style.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzD,UAAU,kBAAkB;IAC1B,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,gBAAgB,CAAC,EAAE,SAAS,CAAC;CAC9B;AAED,eAAO,MAAM,QAAQ,0BA6BpB,CAAC"}

package/lib/typescript/components/countdown/countdown.type.d.ts

@@ -3,5 +3,10 @@ export interface CountdownProps {
      * The target time in Date format, ex: 'YYYY-MM-DD hh:mm:ss'
      */
     targetDateTime: string | number | Date;
+    formats?: {
+        type: 'd' | 'h' | 'm' | 's';
+        trailingString?: string;
+        leadingString?: string;
+    }[];
 }
 //# sourceMappingURL=countdown.type.d.ts.map

package/lib/typescript/components/countdown/countdown.type.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"countdown.type.d.ts","sourceRoot":"","sources":["../../../../src/components/countdown/countdown.type.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,cAAc;IAC7B;;OAEG;IACH,cAAc,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC;CACxC"}
+{"version":3,"file":"countdown.type.d.ts","sourceRoot":"","sources":["../../../../src/components/countdown/countdown.type.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,cAAc;IAC7B;;OAEG;IACH,cAAc,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC;IAEvC,OAAO,CAAC,EAAE;QACR,IAAI,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;QAC5B,cAAc,CAAC,EAAE,MAAM,CAAC;QACxB,aAAa,CAAC,EAAE,MAAM,CAAC;KACxB,EAAE,CAAC;CACL"}

package/lib/typescript/components/index.d.ts

@@ -16,7 +16,7 @@ export { RadioInput } from './RadioInput/RadioInput.component';
 export { CheckBoxInput } from './CheckBoxInput/CheckBoxInput.component';
 export { Checkbox } from './Checkbox/Checkbox.component';
 export { Appbar } from './Appbar/Appbar.component';
-export { Snackbar } from './Snackbar/Snackbar.component';
+export { Snackbar, SnackbarComponent } from './Snackbar/Snackbar.component';
 export { Switch } from './switch/switch.component';
 export { Dot } from './dot/dot.component';
 export { InformationBox } from './information-box/information-box.component';

package/lib/typescript/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AACnD,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,UAAU,EAAE,MAAM,mCAAmC,CAAC;AAC/D,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AACzD,OAAO,EAAE,eAAe,EAAE,MAAM,+CAA+C,CAAC;AAChF,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AACzD,OAAO,EAAE,cAAc,EAAE,MAAM,2CAA2C,CAAC;AAC3E,OAAO,EAAE,OAAO,EAAE,MAAM,6BAA6B,CAAC;AACtD,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,qCAAqC,CAAC;AAClE,OAAO,EAAE,WAAW,EAAE,MAAM,qCAAqC,CAAC;AAClE,OAAO,EAAE,UAAU,EAAE,MAAM,mCAAmC,CAAC;AAC/D,OAAO,EAAE,aAAa,EAAE,MAAM,yCAAyC,CAAC;AACxE,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AACnD,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AACnD,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAC1C,OAAO,EAAE,cAAc,EAAE,MAAM,6CAA6C,CAAC;AAC7E,OAAO,EAAE,UAAU,EAAE,MAAM,qCAAqC,CAAC;AACjE,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAE5D,YAAY,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACxD,YAAY,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AACjE,YAAY,EAAE,oBAAoB,EAAE,MAAM,0CAA0C,CAAC;AACrF,YAAY,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAC9D,YAAY,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AACpE,YAAY,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AACjE,YAAY,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAC9D,YAAY,EAAE,mBAAmB,EAAE,MAAM,sCAAsC,CAAC;AAChF,YAAY,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAC3D,YAAY,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AACnD,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,UAAU,EAAE,MAAM,mCAAmC,CAAC;AAC/D,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AACzD,OAAO,EAAE,eAAe,EAAE,MAAM,+CAA+C,CAAC;AAChF,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AACzD,OAAO,EAAE,cAAc,EAAE,MAAM,2CAA2C,CAAC;AAC3E,OAAO,EAAE,OAAO,EAAE,MAAM,6BAA6B,CAAC;AACtD,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,qCAAqC,CAAC;AAClE,OAAO,EAAE,WAAW,EAAE,MAAM,qCAAqC,CAAC;AAClE,OAAO,EAAE,UAAU,EAAE,MAAM,mCAAmC,CAAC;AAC/D,OAAO,EAAE,aAAa,EAAE,MAAM,yCAAyC,CAAC;AACxE,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AACnD,OAAO,EAAE,QAAQ,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAC5E,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AACnD,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAC1C,OAAO,EAAE,cAAc,EAAE,MAAM,6CAA6C,CAAC;AAC7E,OAAO,EAAE,UAAU,EAAE,MAAM,qCAAqC,CAAC;AACjE,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAE5D,YAAY,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACxD,YAAY,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AACjE,YAAY,EAAE,oBAAoB,EAAE,MAAM,0CAA0C,CAAC;AACrF,YAAY,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAC9D,YAAY,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AACpE,YAAY,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AACjE,YAAY,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAC9D,YAAY,EAAE,mBAAmB,EAAE,MAAM,sCAAsC,CAAC;AAChF,YAAY,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAC3D,YAAY,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adiraku/react-native-ui",
-  "version": "0.1.16",
+  "version": "0.2.0",
   "description": "test",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",
@@ -30,6 +30,7 @@
     "test": "jest",
     "typecheck": "tsc --noEmit",
     "lint": "eslint \"**/*.{js,ts,tsx}\"",
+    "lint-fix": "eslint \"**/*.{js,ts,tsx}\" --fix",
     "prepack": "bob build",
     "release": "release-it",
     "example": "yarn --cwd example",
@@ -67,11 +68,11 @@
     "react": "18.2.0",
     "react-native": "0.71.1",
     "react-native-builder-bob": "^0.20.0",
+    "react-native-svg": "^13.9.0",
     "react-native-svg-web": "^1.0.9",
     "react-native-web": "^0.19.4",
     "release-it": "^15.0.0",
-    "typescript": "4.5.2",
-    "react-native-svg": "^13.9.0"
+    "typescript": "4.5.2"
   },
   "resolutions": {
     "@types/react": "17.0.21"
@@ -125,5 +126,6 @@
     ]
   },
   "dependencies": {
+    "react-native-toast-message": "^2.1.6"
   }
 }

package/src/components/CheckBoxInput/CheckBoxInput.component.tsx

@@ -18,6 +18,7 @@ import { Divider } from '../Divider/Divider.component';
 import type {
   CheckboxInputProps,
   CheckboxItemProps,
+  CheckboxItemPropsComponent,
 } from './CheckBoxInput.type';
 import { Checkbox } from '../Checkbox/Checkbox.component';
 
@@ -42,6 +43,8 @@ const CheckBoxInput: React.FunctionComponent<CheckboxInputProps> = (props) => {
     bottomSheetOpt,
     selectionLimit,
     onInputDismiss = () => {},
+    customCheckboxInput,
+    customItemSeparator = <Divider />,
   } = props;
 
   const [labelWidth, setLabelWidth] = React.useState(0);
@@ -187,17 +190,26 @@ const CheckBoxInput: React.FunctionComponent<CheckboxInputProps> = (props) => {
       >
         <FlatList
           data={data}
-          renderItem={(item) => (
-            <CheckboxItem
-              data={item}
-              selectedValue={selectedValue}
-              onItemPress={onCheckboxItemPress}
-            />
-          )}
+          renderItem={(item) => {
+            if (customCheckboxInput) {
+              return customCheckboxInput({
+                data: item,
+                selectedValue: selectedValue,
+                onItemPress: onCheckboxItemPress,
+              });
+            }
+
+            return (
+              <CheckboxItem
+                data={item}
+                selectedValue={selectedValue}
+                onItemPress={onCheckboxItemPress}
+              />
+            );
+          }}
           // eslint-disable-next-line react-native/no-inline-styles
           contentContainerStyle={{ padding: 16 }}
-          // eslint-disable-next-line react/no-unstable-nested-components
-          ItemSeparatorComponent={() => <Divider />}
+          ItemSeparatorComponent={() => customItemSeparator}
         />
         {/* eslint-disable-next-line react-native/no-inline-styles */}
         <View style={{ padding: 16, backgroundColor: 'transparent' }}>
@@ -216,13 +228,7 @@ function CheckboxItem({
   data,
   selectedValue,
   onItemPress = () => {},
-}: {
-  data: {
-    item: CheckboxItemProps;
-  };
-  selectedValue?: CheckboxItemProps[];
-  onItemPress?: (value: CheckboxItemProps) => void;
-}) {
+}: CheckboxItemPropsComponent) {
   const { item } = data;
   const computedStyle = getStyle({} as CheckboxInputProps);
 

package/src/components/CheckBoxInput/CheckBoxInput.type.ts

@@ -47,6 +47,10 @@ export interface CheckboxInputProps {
   selectionLimit?: number;
 
   onInputDismiss?: () => void;
+
+  customCheckboxInput?: (props: CheckboxItemPropsComponent) => any;
+
+  customItemSeparator?: any;
 }
 
 export type CheckboxItemProps = {
@@ -54,3 +58,11 @@ export type CheckboxItemProps = {
   value: string;
   disabled?: boolean;
 };
+
+export type CheckboxItemPropsComponent = {
+  data: {
+    item: CheckboxItemProps;
+  };
+  selectedValue?: CheckboxItemProps[];
+  onItemPress?: (value: CheckboxItemProps) => void;
+};

package/src/components/RadioInput/RadioInput.component.tsx

@@ -17,7 +17,11 @@ import { RadioButton } from '../RadioButton/RadioButton.component';
 import { Divider } from '../Divider/Divider.component';
 
 import type { LayoutChangeEvent } from 'react-native';
-import type { RadioInputProps, RadioItemProps } from './RadioInput.type';
+import type {
+  RadioInputProps,
+  RadioItemProps,
+  RadioItemPropsComponent,
+} from './RadioInput.type';
 
 const RadioInput: React.FunctionComponent<RadioInputProps> = (props) => {
   const {
@@ -36,6 +40,8 @@ const RadioInput: React.FunctionComponent<RadioInputProps> = (props) => {
     saveInputLabel,
     bottomSheetOpt,
     onInputDismiss = () => {},
+    customRadioInput,
+    customItemSeparator = <Divider />,
   } = props;
 
   const [labelWidth, setLabelWidth] = React.useState(0);
@@ -157,17 +163,26 @@ const RadioInput: React.FunctionComponent<RadioInputProps> = (props) => {
       >
         <FlatList
           data={data}
-          renderItem={(item) => (
-            <RadioItem
-              data={item}
-              selectedValue={selectedValue}
-              onItemPress={onRadioItemPress}
-            />
-          )}
+          renderItem={(item) => {
+            if (customRadioInput) {
+              return customRadioInput({
+                data: item,
+                selectedValue: selectedValue,
+                onItemPress: onRadioItemPress,
+              });
+            }
+
+            return (
+              <RadioItem
+                data={item}
+                selectedValue={selectedValue}
+                onItemPress={onRadioItemPress}
+              />
+            );
+          }}
           // eslint-disable-next-line react-native/no-inline-styles
           contentContainerStyle={{ padding: 16 }}
-          // eslint-disable-next-line react/no-unstable-nested-components
-          ItemSeparatorComponent={() => <Divider />}
+          ItemSeparatorComponent={() => customItemSeparator}
         />
         {/* eslint-disable-next-line react-native/no-inline-styles */}
         <View style={{ padding: 16, backgroundColor: 'transparent' }}>
@@ -186,13 +201,7 @@ function RadioItem({
   data,
   selectedValue,
   onItemPress = () => {},
-}: {
-  data: {
-    item: RadioItemProps;
-  };
-  selectedValue?: RadioItemProps;
-  onItemPress?: (value: RadioItemProps) => void;
-}) {
+}: RadioItemPropsComponent) {
   const { item } = data;
   const computedStyle = getStyle({} as RadioInputProps);
 

package/src/components/RadioInput/RadioInput.type.ts

@@ -45,6 +45,10 @@ export interface RadioInputProps {
   bottomSheetOpt: Omit<BottomSheetProps, 'visibility' | 'onDismiss'>;
 
   onInputDismiss?: () => void;
+
+  customRadioInput?: (props: RadioItemPropsComponent) => any;
+
+  customItemSeparator?: any;
 }
 
 export type RadioItemProps = {
@@ -52,3 +56,11 @@ export type RadioItemProps = {
   value: string;
   disabled?: boolean;
 };
+
+export type RadioItemPropsComponent = {
+  data: {
+    item: RadioItemProps;
+  };
+  selectedValue?: RadioItemProps;
+  onItemPress?: (value: RadioItemProps) => void;
+};

package/src/components/Snackbar/Snackbar.component.tsx

@@ -1,12 +1,17 @@
 import * as React from 'react';
 import { View } from 'react-native';
+import RNToast, {
+  ToastProps,
+  ToastShowParams,
+  ToastHideParams,
+} from 'react-native-toast-message';
 
 import { Typography } from '../typography/typography.component';
 import { getStyle } from './Snakbar.style';
 
 import type { SnackbarProps } from './Snackbar.type';
 
-const Snackbar: React.FunctionComponent<SnackbarProps> = (props) => {
+const SnackbarUI: React.FunctionComponent<SnackbarProps> = (props) => {
   const { message = '', action = null, containerStyle } = props;
 
   const computedStyle = getStyle();
@@ -25,4 +30,50 @@ const Snackbar: React.FunctionComponent<SnackbarProps> = (props) => {
   );
 };
 
-export { Snackbar };
+function SnackbarComponent(props: ToastProps) {
+  const computedStyle = getStyle();
+
+  return (
+    <RNToast
+      {...props}
+      config={{
+        ...props.config,
+        // eslint-disable-next-line react/no-unstable-nested-components
+        aleph_toast: ({ props: toastProps }: { props: SnackbarProps }) => {
+          const { message, action } = toastProps;
+
+          return (
+            <View style={[computedStyle.snackbarWrapper]}>
+              <SnackbarUI message={message} action={action} />
+            </View>
+          );
+        },
+      }}
+      type="aleph_toast"
+      position="bottom"
+    />
+  );
+}
+
+const Snackbar = {
+  show: (
+    params: Omit<ToastShowParams, 'props' | 'text1' | 'text2' | 'type'> & {
+      message: string;
+      action?: React.ReactNode;
+    }
+  ) => {
+    const { message = '', action } = params;
+    RNToast.show({
+      ...params,
+      props: {
+        message,
+        action,
+      },
+    });
+  },
+  hide: (params: ToastHideParams) => {
+    RNToast.hide(params);
+  },
+};
+
+export { Snackbar, SnackbarComponent };

package/src/components/Snackbar/Snakbar.style.tsx

@@ -6,6 +6,7 @@ import type { ViewStyle, TextStyle } from 'react-native';
 
 interface ComputedStyleProps {
   container?: ViewStyle;
+  snackbarWrapper?: ViewStyle;
   message?: TextStyle;
   actionWrapper?: ViewStyle;
 }
@@ -23,6 +24,11 @@ export const getStyle = () => {
     ...Shadow['shadow-elevation-1'],
   };
 
+  computedStyle.snackbarWrapper = {
+    width: '100%',
+    paddingHorizontal: Spacing[16],
+  };
+
   computedStyle.message = {
     flex: 1,
   };

package/src/components/TextInput/TextInput.component.tsx

@@ -50,27 +50,23 @@ const TextInput: React.FunctionComponent<TextInputProps> = (props) => {
     }).start();
 
   React.useEffect(() => {
-    if (value) {
+    if (focused || !!value) {
       animate(1);
     } else {
       animate(0);
     }
-  }, [value]);
+  }, [value, focused]);
 
   const handleOnFocus = (
     event: NativeSyntheticEvent<TextInputFocusEventData>
   ) => {
-    animate(1);
     setFocused(true);
     onBlur(event);
   };
   const handleOnBlur = (
     event: NativeSyntheticEvent<TextInputFocusEventData>
   ) => {
-    if (value === '') {
-      animate(0);
-      onFocus(event);
-    }
+    onFocus(event);
     setFocused(false);
   };
 

package/src/components/button/button.component.tsx

@@ -12,20 +12,25 @@ const Button: React.FC<ButtonProps> = (props) => {
     onPress = () => {},
     variant = 'primary',
     label = 'Default',
-    size = 'large',
+    size = 'small',
     containerStyles,
     textStyles,
     ...rest
   } = props;
 
-  const computedStyle = getStyle(props);
+  const computedStyle = getStyle({
+    ...props,
+    variant,
+    label,
+    size,
+  });
 
   return (
     <TouchableHighlight
       onPress={onPress}
       style={[computedStyle.container, containerStyles]}
       underlayColor={
-        variant === 'primary' ? Palettes.black[800] : Palettes.blue[50]
+        variant !== 'primary' ? Palettes.blue[50] : Palettes.black[800]
       }
       {...rest}
     >

package/src/components/countdown/countdown.component.tsx

@@ -7,7 +7,15 @@ import type { CountdownProps } from './countdown.type';
 import { getStyle } from './countdown.style';
 
 const Countdown: React.FunctionComponent<CountdownProps> = (props) => {
-  const { targetDateTime } = props;
+  const {
+    targetDateTime,
+    formats = [
+      { type: 'd', trailingString: ' hari' },
+      { type: 'h' },
+      { type: 'm' },
+      { type: 's' },
+    ],
+  } = props;
 
   const computedStyle = getStyle();
 
@@ -21,59 +29,52 @@ const Countdown: React.FunctionComponent<CountdownProps> = (props) => {
     }, 1000);
 
     return () => clearInterval(timer);
-  }, []);
+  }, [targetDateTime]);
 
   const formatTime = (time: number) => {
     if (time <= 0) {
       return {
-        days: `0 hari`,
-        hours: appendZero(0),
-        minutes: appendZero(0),
-        seconds: appendZero(0),
+        d: appendZero(0),
+        h: appendZero(0),
+        m: appendZero(0),
+        s: appendZero(0),
       };
     }
 
-    const days = Math.floor(time / (1000 * 60 * 60 * 24));
-    const hours = appendZero(Math.floor((time / (1000 * 60 * 60)) % 24));
-    const minutes = appendZero(Math.floor((time / 1000 / 60) % 60));
-    const seconds = appendZero(Math.floor((time / 1000) % 60));
-
-    return { days: `${days} hari`, hours, minutes, seconds };
+    time /= 1000;
+    let day = Math.floor(time / (24 * 3600));
+    let remainingSeconds = time % (24 * 3600);
+    let hour = Math.floor(remainingSeconds / 3600);
+    remainingSeconds %= 3600;
+    let minute = Math.floor(remainingSeconds / 60);
+    let second = remainingSeconds % 60;
+
+    return {
+      d: Math.floor(day),
+      h: Math.floor(hour),
+      m: Math.floor(minute),
+      s: Math.floor(second),
+    };
   };
 
   return (
     <View style={[computedStyle.container]}>
-      <View style={[computedStyle.textContainer]}>
-        <Typography variant="overline" style={[computedStyle.textLabel]}>
-          {formatTime(timeLeft).days}
-        </Typography>
-      </View>
-
-      <View style={[computedStyle.dividerContainer]}>
-        <Typography variant="overline">:</Typography>
-      </View>
-
-      <View style={[computedStyle.textContainer]}>
-        <Typography variant="overline" style={[computedStyle.textLabel]}>
-          {formatTime(timeLeft).hours}
-        </Typography>
-      </View>
-      <View style={[computedStyle.dividerContainer]}>
-        <Typography variant="overline">:</Typography>
-      </View>
-      <View style={[computedStyle.textContainer]}>
-        <Typography variant="overline" style={[computedStyle.textLabel]}>
-          {formatTime(timeLeft).minutes}
-        </Typography>
-      </View>
-      <View style={[computedStyle.dividerContainer]}>
-        <Typography variant="overline">:</Typography>
-      </View>
-      <View style={[computedStyle.textContainer]}>
-        <Typography variant="overline" style={[computedStyle.textLabel]}>
-          {formatTime(timeLeft).seconds}
-        </Typography>
-      </View>
+      {formats.map(({ type, leadingString = '', trailingString = '' }, idx) => {
+        return (
+          <>
+            <View style={[computedStyle.textContainer]}>
+              <Typography variant="overline" style={[computedStyle.textLabel]}>
+                {leadingString + formatTime(timeLeft)?.[type] + trailingString}
+              </Typography>
+            </View>
+            {idx !== formats.length - 1 ? (
+              <View style={[computedStyle.dividerContainer]}>
+                <Typography variant="overline">:</Typography>
+              </View>
+            ) : null}
+          </>
+        );
+      })}
     </View>
   );
 };

package/src/components/countdown/countdown.style.tsx

@@ -16,6 +16,7 @@ export const getStyle = () => {
 
   computedStyle.container = {
     flexDirection: 'row',
+    alignSelf: 'flex-start',
   };
 
   computedStyle.textLabel = {

package/src/components/countdown/countdown.type.ts

@@ -3,4 +3,10 @@ export interface CountdownProps {
    * The target time in Date format, ex: 'YYYY-MM-DD hh:mm:ss'
    */
   targetDateTime: string | number | Date;
+
+  formats?: {
+    type: 'd' | 'h' | 'm' | 's';
+    trailingString?: string;
+    leadingString?: string;
+  }[];
 }

package/src/components/index.ts

@@ -16,7 +16,7 @@ export { RadioInput } from './RadioInput/RadioInput.component';
 export { CheckBoxInput } from './CheckBoxInput/CheckBoxInput.component';
 export { Checkbox } from './Checkbox/Checkbox.component';
 export { Appbar } from './Appbar/Appbar.component';
-export { Snackbar } from './Snackbar/Snackbar.component';
+export { Snackbar, SnackbarComponent } from './Snackbar/Snackbar.component';
 export { Switch } from './switch/switch.component';
 export { Dot } from './dot/dot.component';
 export { InformationBox } from './information-box/information-box.component';