@symply.io/basic-components 1.0.0-alpha.15 → 1.0.0-alpha.17

package/TextInput/index.d.ts

@@ -1,7 +1,6 @@
 import { CSSProperties } from "react";
 import { TextFieldProps } from "@mui/material/TextField";
-declare type TextProps = Omit<TextFieldProps, "onChange">;
-export interface TextInputProps {
+export interface TextInputProps extends Omit<TextFieldProps, "onChange"> {
     onChange: (value: string) => void;
     value: string;
     tooltip?: TextFieldProps;
@@ -10,5 +9,5 @@ export interface TextInputProps {
     primaryColor?: CSSProperties["color"];
     secondaryColor?: CSSProperties["color"];
 }
-declare const TextInput: (props: TextInputProps & TextProps) => JSX.Element;
+declare const TextInput: (props: TextInputProps) => JSX.Element;
 export default TextInput;

package/TextInput/index.js

@@ -43,6 +43,6 @@ var TextInput = function (props) {
                 }, onChange: function (event) {
                     event.preventDefault();
                     onChange(event.target.value);
-                }, inputProps: { maxLength: maxLength, minLength: minLength } }, rest), void 0) }), void 0) }), void 0));
+                }, inputProps: { maxLength: maxLength, minLength: minLength } }, rest)) })) })));
 };
 export default TextInput;

package/ToastPrompt/Presentation.js

@@ -34,7 +34,7 @@ import { green, amber, red, blue } from "@mui/material/colors";
 import useCustomTheme from "../useCustomTheme";
 var ToastPrompt = function (props) {
     var _a;
-    var _b = props.open, open = _b === void 0 ? false : _b, _c = props.vertical, vertical = _c === void 0 ? "top" : _c, _d = props.horizontal, horizontal = _d === void 0 ? "center" : _d, _e = props.timeout, timeout = _e === void 0 ? 3000 : _e, onClose = props.onClose, _f = props.transitionDirection, transitionDirection = _f === void 0 ? "down" : _f, _g = props.message, message = _g === void 0 ? "Unknown message" : _g, _h = props.icon, icon = _h === void 0 ? _jsx(_Fragment, {}, void 0) : _h, _j = props.variant, variant = _j === void 0 ? "info" : _j, other = __rest(props, ["open", "vertical", "horizontal", "timeout", "onClose", "transitionDirection", "message", "icon", "variant"]);
+    var _b = props.open, open = _b === void 0 ? false : _b, _c = props.vertical, vertical = _c === void 0 ? "top" : _c, _d = props.horizontal, horizontal = _d === void 0 ? "center" : _d, _e = props.timeout, timeout = _e === void 0 ? 3000 : _e, onClose = props.onClose, _f = props.transitionDirection, transitionDirection = _f === void 0 ? "down" : _f, _g = props.message, message = _g === void 0 ? "Unknown message" : _g, _h = props.icon, icon = _h === void 0 ? _jsx(_Fragment, {}) : _h, _j = props.variant, variant = _j === void 0 ? "info" : _j, other = __rest(props, ["open", "vertical", "horizontal", "timeout", "onClose", "transitionDirection", "message", "icon", "variant"]);
     var theme = useCustomTheme();
     var styles = {
         success: {
@@ -51,7 +51,7 @@ var ToastPrompt = function (props) {
         }
     };
     var Transition = function (args) {
-        return _jsx(Slide, __assign({}, args, { direction: transitionDirection }), void 0);
+        return _jsx(Slide, __assign({}, args, { direction: transitionDirection }));
     };
     var VariantIcon = {
         success: SuccessIcon,
@@ -76,6 +76,6 @@ var ToastPrompt = function (props) {
                                 fontSize: 20,
                                 opacity: 0.9,
                                 marginRight: theme.spacing(1)
-                            } }, void 0)) : (_jsx(_Fragment, { children: icon }, void 0)), message] }), void 0) }, other), void 0) }), "".concat(Date.now() * Math.round(Math.random()))) }), void 0));
+                            } })) : (_jsx(_Fragment, { children: icon })), message] })) }, other)) }), "".concat(Date.now() * Math.round(Math.random()))) })));
 };
 export default ToastPrompt;

package/ToastPrompt/index.d.ts

@@ -1,5 +1,4 @@
 import { ReactNode } from "react";
-import ToastPrompt from "./Presentation";
 export interface PromptProviderProps {
     children: ReactNode;
 }
@@ -12,4 +11,3 @@ export declare const PromptProvider: (props: PromptProviderProps) => JSX.Element
 export declare function usePrompt(): {
     showPrompt: (props: ShowPromptProps) => void;
 };
-export default ToastPrompt;

package/ToastPrompt/index.js

@@ -22,9 +22,8 @@ export var PromptProvider = function (props) {
         var _a = ((toastRef === null || toastRef === void 0 ? void 0 : toastRef.current) || {}).show, show = _a === void 0 ? function () { } : _a;
         show(type, message, timeout);
     }
-    return (_jsx(PromptContext.Provider, __assign({ value: { showPrompt: showPrompt } }, { children: _jsxs(_Fragment, { children: [children, _jsx(Logics, __assign({ ref: toastRef }, { children: _jsx(ToastPrompt, {}, void 0) }), void 0)] }, void 0) }), void 0));
+    return (_jsx(PromptContext.Provider, __assign({ value: { showPrompt: showPrompt } }, { children: _jsxs(_Fragment, { children: [children, _jsx(Logics, __assign({ ref: toastRef }, { children: _jsx(ToastPrompt, {}) }))] }) })));
 };
 export function usePrompt() {
     return useContext(PromptContext);
 }
-export default ToastPrompt;

package/VideoPlayerModal/index.d.ts

@@ -1,6 +1,4 @@
-/// <reference types="react" />
-import { ReactPlayerProps } from "react-player";
 import { VideoPlayerModalProps } from "./types";
-declare function VideoPlayerModal(props: VideoPlayerModalProps & ReactPlayerProps): JSX.Element;
+declare function VideoPlayerModal(props: VideoPlayerModalProps): JSX.Element;
 export default VideoPlayerModal;
 export * from "./types";

package/VideoPlayerModal/index.js

@@ -35,9 +35,9 @@ function VideoPlayerModal(props) {
     var url = props.url, _a = props.pip, pip = _a === void 0 ? false : _a, _b = props.open, open = _b === void 0 ? false : _b, title = props.title, onClose = props.onClose, _c = props.extraButtons, extraButtons = _c === void 0 ? [] : _c, primaryColor = props.primaryColor, secondaryColor = props.secondaryColor, playerProps = __rest(props, ["url", "pip", "open", "title", "onClose", "extraButtons", "primaryColor", "secondaryColor"]);
     var theme = useCustomTheme();
     var fullScreen = useMediaQuery(theme.breakpoints.down("sm"));
-    return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsxs(Dialog, __assign({ open: open, fullScreen: fullScreen, onClose: onClose, fullWidth: true, maxWidth: "lg", "aria-labelledby": "react-video-dialog" }, { children: [title && _jsx(DialogTitle, { children: title }, void 0), _jsx(DialogContent, { children: _jsx(ReactPlayer, __assign({ controls: true, url: url, style: { minHeight: "480px" }, width: "100%", config: {
+    return (_jsx(ThemeProvider, __assign({ theme: theme }, { children: _jsxs(Dialog, __assign({ open: open, fullScreen: fullScreen, onClose: onClose, fullWidth: true, maxWidth: "lg", "aria-labelledby": "react-video-dialog" }, { children: [title && _jsx(DialogTitle, { children: title }), _jsx(DialogContent, { children: _jsx(ReactPlayer, __assign({ controls: true, url: url, style: { minHeight: "480px" }, width: "100%", config: {
                             file: { attributes: { disablePictureInPicture: !pip } }
-                        } }, playerProps), void 0) }, void 0), _jsxs(DialogActions, { children: [extraButtons.map(function (buttonProps, index) { return (_jsx(Grid, __assign({ item: true, xs: 12, md: 3, lg: 2 }, { children: _jsx(Button, __assign({}, buttonProps), void 0) }), "extraButton_".concat(index))); }), _jsx(Button, __assign({ variant: "outlined", color: "secondary", onClick: onClose }, { children: "Close" }), void 0)] }, void 0)] }), void 0) }), void 0));
+                        } }, playerProps)) }), _jsxs(DialogActions, { children: [extraButtons.map(function (buttonProps, index) { return (_jsx(Grid, __assign({ item: true, xs: 12, md: 3, lg: 2 }, { children: _jsx(Button, __assign({}, buttonProps)) }), "extraButton_".concat(index))); }), _jsx(Button, __assign({ variant: "outlined", color: "secondary", onClick: onClose }, { children: "Close" }))] })] })) })));
 }
 export default VideoPlayerModal;
 export * from "./types";

package/VideoPlayerModal/types.d.ts

@@ -1,6 +1,7 @@
 import { CSSProperties } from "react";
 import { ButtonProps } from "@mui/material/Button";
-export interface VideoPlayerModalProps {
+import { ReactPlayerProps } from "react-player";
+export interface VideoPlayerModalProps extends ReactPlayerProps {
     title?: string;
     open: boolean;
     pip?: boolean;

package/index.d.ts

@@ -1,5 +1,10 @@
 export * from "./AlertDialog";
+export * from "./Autocomplete";
+export * from "./AutocompleteWithFilter";
 export * from "./BasicModal";
+export * from "./BreadCrumbs";
+export * from "./CheckBox";
+export * from "./Copyright";
 export * from "./DigitInput";
 export * from "./DynamicHeaderBar";
 export * from "./FormRadioGroup";
@@ -11,11 +16,16 @@ export * from "./NumberInput";
 export * from "./PasswordInput";
 export * from "./PhoneNumberInput";
 export * from "./TabGroup";
+export * from "./TablePagination";
 export * from "./TextInput";
 export * from "./ToastPrompt";
 export * from "./VideoPlayerModal";
 export { default as AlertDialog } from "./AlertDialog";
+export { default as Autocomplete } from "./Autocomplete";
+export { default as AutocompleteWithFilter } from "./AutocompleteWithFilter";
 export { default as BasicModal } from "./BasicModal";
+export { default as BreadCrumbs } from "./BreadCrumbs";
+export { default as Copyright } from "./Copyright";
 export { default as DigitInput } from "./DigitInput";
 export { default as DynamicHeaderBar } from "./DynamicHeaderBar";
 export { default as FormRadioGroup } from "./FormRadioGroup";
@@ -25,5 +35,6 @@ export { default as MenuButtonGroup } from "./MenuButtonGroup";
 export { default as NumberInput } from "./NumberInput";
 export { default as PhoneNumberInput } from "./PhoneNumberInput";
 export { default as TabGroup } from "./TabGroup";
+export { default as TablePagination } from "./TablePagination";
 export { default as TextInput } from "./TextInput";
 export { default as VideoPlayerModal } from "./VideoPlayerModal";

package/index.js

@@ -1,5 +1,10 @@
 export * from "./AlertDialog";
+export * from "./Autocomplete";
+export * from "./AutocompleteWithFilter";
 export * from "./BasicModal";
+export * from "./BreadCrumbs";
+export * from "./CheckBox";
+export * from "./Copyright";
 export * from "./DigitInput";
 export * from "./DynamicHeaderBar";
 export * from "./FormRadioGroup";
@@ -11,11 +16,16 @@ export * from "./NumberInput";
 export * from "./PasswordInput";
 export * from "./PhoneNumberInput";
 export * from "./TabGroup";
+export * from "./TablePagination";
 export * from "./TextInput";
 export * from "./ToastPrompt";
 export * from "./VideoPlayerModal";
 export { default as AlertDialog } from "./AlertDialog";
+export { default as Autocomplete } from "./Autocomplete";
+export { default as AutocompleteWithFilter } from "./AutocompleteWithFilter";
 export { default as BasicModal } from "./BasicModal";
+export { default as BreadCrumbs } from "./BreadCrumbs";
+export { default as Copyright } from "./Copyright";
 export { default as DigitInput } from "./DigitInput";
 export { default as DynamicHeaderBar } from "./DynamicHeaderBar";
 export { default as FormRadioGroup } from "./FormRadioGroup";
@@ -25,5 +35,6 @@ export { default as MenuButtonGroup } from "./MenuButtonGroup";
 export { default as NumberInput } from "./NumberInput";
 export { default as PhoneNumberInput } from "./PhoneNumberInput";
 export { default as TabGroup } from "./TabGroup";
+export { default as TablePagination } from "./TablePagination";
 export { default as TextInput } from "./TextInput";
 export { default as VideoPlayerModal } from "./VideoPlayerModal";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@symply.io/basic-components",
-  "version": "1.0.0-alpha.15",
+  "version": "1.0.0-alpha.17",
   "description": "Basic and reusable components for all frontend of Symply apps",
   "keywords": [
     "react",
@@ -44,10 +44,11 @@
   ],
   "devDependencies": {
     "@types/body-parser": "^1.19.2",
+    "@types/reach__router": "^1.3.10",
     "@types/react": "^17.0.27",
     "@types/react-dom": "^17.0.9",
     "babel-loader": "^8.2.2",
-    "typescript": "^4.5.5"
+    "typescript": "~4.6.3"
   },
   "dependencies": {
     "@emotion/react": "^11.7.1",
@@ -55,6 +56,7 @@
     "@mui/icons-material": "^5.4.2",
     "@mui/material": "^5.4.2",
     "@mui/system": "^5.4.2",
+    "@reach/router": "^1.3.4",
     "color-alpha": "^1.1.3",
     "react-player": "^2.9.0",
     "rifm": "^0.12.1"