@luscii-healthtech/web-ui 0.1.19 → 0.1.22
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/dist/components/ButtonV2/SecondaryButton.d.ts +1 -0
- package/dist/components/ButtonV2/TertiaryButton.d.ts +1 -0
- package/dist/components/Dropdown/Dropdown.d.ts +1 -1
- package/dist/components/Radio/Radio.d.ts +1 -1
- package/dist/components/RadioGroup/RadioGroup.d.ts +3 -2
- package/dist/components/Select/LegacySelect.d.ts +3 -2
- package/dist/index.d.ts +10 -11
- package/dist/web-ui.cjs.development.css +39 -39
- package/dist/web-ui.cjs.development.js +159 -158
- package/dist/web-ui.cjs.development.js.map +1 -1
- package/dist/web-ui.cjs.production.min.css +39 -39
- package/dist/web-ui.cjs.production.min.js +1 -1
- package/dist/web-ui.cjs.production.min.js.map +1 -1
- package/dist/web-ui.esm.css +39 -39
- package/dist/web-ui.esm.js +160 -158
- package/dist/web-ui.esm.js.map +1 -1
- package/package.json +2 -1
- package/src/components/ButtonV2/ButtonV2.tsx +6 -1
- package/src/components/ButtonV2/PrimaryButton.tsx +6 -15
- package/src/components/ButtonV2/SecondaryButton.tsx +4 -4
- package/src/components/ButtonV2/TertiaryButton.tsx +4 -4
- package/src/components/PreviewPhone/useWindowDimensions.js +1 -1
- package/src/index.tsx +45 -13
|
@@ -4,5 +4,6 @@ export interface SecondaryButtonProps {
|
|
|
4
4
|
onClick: (event: React.MouseEvent<HTMLButtonElement>) => void;
|
|
5
5
|
text?: string;
|
|
6
6
|
icon?: React.FunctionComponent<IconProps>;
|
|
7
|
+
isDisabled?: boolean;
|
|
7
8
|
}
|
|
8
9
|
export declare const SecondaryButton: (props: SecondaryButtonProps) => JSX.Element;
|
|
@@ -4,5 +4,6 @@ export interface TertiaryButtonProps {
|
|
|
4
4
|
onClick: (event: React.MouseEvent<HTMLButtonElement>) => void;
|
|
5
5
|
text?: string;
|
|
6
6
|
icon?: React.FunctionComponent<IconProps>;
|
|
7
|
+
isDisabled?: boolean;
|
|
7
8
|
}
|
|
8
9
|
export declare const TertiaryButton: (props: TertiaryButtonProps) => JSX.Element;
|
|
@@ -36,7 +36,7 @@ declare namespace Dropdown {
|
|
|
36
36
|
title: PropTypes.Requireable<string>;
|
|
37
37
|
groupKey: PropTypes.Validator<string>;
|
|
38
38
|
}> | null | undefined)[]>;
|
|
39
|
-
export const initialSelectedItemId: PropTypes.Requireable<
|
|
39
|
+
export const initialSelectedItemId: PropTypes.Requireable<React.Key>;
|
|
40
40
|
export const placeholder: PropTypes.Requireable<string>;
|
|
41
41
|
export const className: PropTypes.Requireable<string>;
|
|
42
42
|
export const onItemSelect: PropTypes.Validator<(...args: any[]) => any>;
|
|
@@ -6,7 +6,7 @@ declare class Radio extends React.PureComponent<any, any, any> {
|
|
|
6
6
|
isChecked: PropTypes.Validator<boolean>;
|
|
7
7
|
isDisabled: PropTypes.Requireable<boolean>;
|
|
8
8
|
name: PropTypes.Validator<string>;
|
|
9
|
-
value: PropTypes.Requireable<
|
|
9
|
+
value: PropTypes.Requireable<React.Key>;
|
|
10
10
|
onChange: PropTypes.Requireable<(...args: any[]) => any>;
|
|
11
11
|
};
|
|
12
12
|
constructor(props: any);
|
|
@@ -16,15 +16,16 @@ declare namespace RadioGroup {
|
|
|
16
16
|
export const className: PropTypes.Requireable<string>;
|
|
17
17
|
export const radioClassName: PropTypes.Requireable<string>;
|
|
18
18
|
export const name: PropTypes.Requireable<string>;
|
|
19
|
-
export const selectedOption: PropTypes.Requireable<
|
|
19
|
+
export const selectedOption: PropTypes.Requireable<React.Key>;
|
|
20
20
|
export const isVertical: PropTypes.Requireable<boolean>;
|
|
21
21
|
export const radioOptions: PropTypes.Validator<(PropTypes.InferProps<{
|
|
22
22
|
text: PropTypes.Requireable<string>;
|
|
23
23
|
info: PropTypes.Requireable<string>;
|
|
24
24
|
isDisabled: PropTypes.Requireable<boolean>;
|
|
25
|
-
value: PropTypes.Requireable<
|
|
25
|
+
value: PropTypes.Requireable<React.Key>;
|
|
26
26
|
}> | null | undefined)[]>;
|
|
27
27
|
export const onChange: PropTypes.Requireable<(...args: any[]) => any>;
|
|
28
28
|
}
|
|
29
29
|
}
|
|
30
30
|
import PropTypes from "prop-types";
|
|
31
|
+
import React from "react";
|
|
@@ -17,11 +17,11 @@ declare function LegacySelect({ className, value, name, placeholder, options, on
|
|
|
17
17
|
declare namespace LegacySelect {
|
|
18
18
|
export namespace propTypes {
|
|
19
19
|
export const className: PropTypes.Requireable<string>;
|
|
20
|
-
export const value: PropTypes.Requireable<
|
|
20
|
+
export const value: PropTypes.Requireable<React.Key>;
|
|
21
21
|
export const name: PropTypes.Validator<string>;
|
|
22
22
|
export const placeholder: PropTypes.Requireable<string>;
|
|
23
23
|
export const options: PropTypes.Validator<(PropTypes.InferProps<{
|
|
24
|
-
value: PropTypes.Validator<
|
|
24
|
+
value: PropTypes.Validator<React.Key>;
|
|
25
25
|
text: PropTypes.Validator<string>;
|
|
26
26
|
disabled: PropTypes.Requireable<boolean>;
|
|
27
27
|
}> | null | undefined)[]>;
|
|
@@ -29,3 +29,4 @@ declare namespace LegacySelect {
|
|
|
29
29
|
}
|
|
30
30
|
}
|
|
31
31
|
import PropTypes from "prop-types";
|
|
32
|
+
import React from "react";
|
package/dist/index.d.ts
CHANGED
|
@@ -1,12 +1,11 @@
|
|
|
1
|
-
export { default as Acknowledgement, ACKNOWLEDGEMENT_TYPE_OPTIONS } from "./components/Acknowledgement/Acknowledgement";
|
|
1
|
+
export { default as Acknowledgement, ACKNOWLEDGEMENT_TYPE_OPTIONS, } from "./components/Acknowledgement/Acknowledgement";
|
|
2
2
|
export { default as Avatar } from "./components/Avatar/Avatar";
|
|
3
3
|
export { default as Badge } from "./components/Badge/Badge";
|
|
4
|
-
export {
|
|
5
|
-
export { BUTTON_ROLES, ButtonProps, BUTTON_TYPE, ButtonType } from "./components/Button/Button.types";
|
|
4
|
+
export { BUTTON_ROLES, ButtonProps, BUTTON_TYPE, ButtonType, } from "./components/Button/Button.types";
|
|
6
5
|
export { ButtonIcon } from "./components/Button/ButtonIcon";
|
|
7
|
-
export { PrimaryButton, PrimaryButtonProps } from "./components/ButtonV2/PrimaryButton";
|
|
8
|
-
export { SecondaryButton, SecondaryButtonProps } from "./components/ButtonV2/SecondaryButton";
|
|
9
|
-
export { TertiaryButton, TertiaryButtonProps } from "./components/ButtonV2/TertiaryButton";
|
|
6
|
+
export { PrimaryButton, PrimaryButtonProps, } from "./components/ButtonV2/PrimaryButton";
|
|
7
|
+
export { SecondaryButton, SecondaryButtonProps, } from "./components/ButtonV2/SecondaryButton";
|
|
8
|
+
export { TertiaryButton, TertiaryButtonProps, } from "./components/ButtonV2/TertiaryButton";
|
|
10
9
|
export { default as Carousel } from "./components/Carousel/Carousel";
|
|
11
10
|
export { default as CenteredHero } from "./components/CenteredHero/CenteredHero";
|
|
12
11
|
export { default as Checkbox } from "./components/Checkbox/Checkbox";
|
|
@@ -19,14 +18,14 @@ export { default as InfoBlock } from "./components/InfoBlock/InfoBlock";
|
|
|
19
18
|
export { InfoField } from "./components/InfoField/InfoField";
|
|
20
19
|
export { INPUT_TYPES, default as Input } from "./components/Input/Input";
|
|
21
20
|
export { default as Line } from "./components/Line/Line";
|
|
22
|
-
export { default as ListItem, ListItemProps } from "./components/ListItem/ListItem";
|
|
23
|
-
export { ListTable, ListTableProps, ListTablePropsConfiguration, ListTablePropsConfigurationField } from "./components/ListTable/ListTable";
|
|
24
|
-
export { LoadingIndicator, LoadingIndicatorProps } from "./components/LoadingIndicator/LoadingIndicator";
|
|
21
|
+
export { default as ListItem, ListItemProps, } from "./components/ListItem/ListItem";
|
|
22
|
+
export { ListTable, ListTableProps, ListTablePropsConfiguration, ListTablePropsConfigurationField, } from "./components/ListTable/ListTable";
|
|
23
|
+
export { LoadingIndicator, LoadingIndicatorProps, } from "./components/LoadingIndicator/LoadingIndicator";
|
|
25
24
|
export { default as Menu } from "./components/Menu/Menu";
|
|
26
25
|
export { MultiSelect } from "./components/MultiSelect/MultiSelect";
|
|
27
26
|
export { NavLayout, NavMenuLayoutProps } from "./components/NavMenu/NavLayout";
|
|
28
27
|
export { NavMenu } from "./components/NavMenu/NavMenu";
|
|
29
|
-
export { NotificationBanner, NotificationBannerColor, NotificationBannerLinkProps } from "./components/NotificationBanner/NotificationBanner";
|
|
28
|
+
export { NotificationBanner, NotificationBannerColor, NotificationBannerLinkProps, } from "./components/NotificationBanner/NotificationBanner";
|
|
30
29
|
export { default as Page } from "./components/Page/Page";
|
|
31
30
|
export { default as CRUDPage } from "./components/Page/CRUDPage";
|
|
32
31
|
export { default as PaginationMenu } from "./components/PaginationMenu/PaginationMenu";
|
|
@@ -34,7 +33,7 @@ export { default as PreviewPhone } from "./components/PreviewPhone/PreviewPhone"
|
|
|
34
33
|
export { default as Radio } from "./components/Radio/Radio";
|
|
35
34
|
export { default as RadioGroup } from "./components/RadioGroup/RadioGroup";
|
|
36
35
|
export { default as Section } from "./components/Section/Section";
|
|
37
|
-
export { SettingsMenuButton, SettingsMenuButtonProps } from "./components/SettingsMenuButton/SettingsMenuButton";
|
|
36
|
+
export { SettingsMenuButton, SettingsMenuButtonProps, } from "./components/SettingsMenuButton/SettingsMenuButton";
|
|
38
37
|
export { Spinner } from "./components/Spinner/Spinner";
|
|
39
38
|
export { Steps } from "./components/Steps/Steps";
|
|
40
39
|
export { default as Switcher } from "./components/Switcher/Switcher";
|
|
@@ -1012,45 +1012,6 @@
|
|
|
1012
1012
|
.entity-preview-dots.glider-dots .glider-dot.active, .entity-preview-dots.glider-dots .glider-dot:focus {
|
|
1013
1013
|
@apply bg-blue-800; }
|
|
1014
1014
|
|
|
1015
|
-
.cweb-switcher-item {
|
|
1016
|
-
display: flex;
|
|
1017
|
-
justify-content: center;
|
|
1018
|
-
flex-direction: row;
|
|
1019
|
-
align-items: center; }
|
|
1020
|
-
.cweb-switcher-item .cweb-switcher-item-link {
|
|
1021
|
-
display: flex;
|
|
1022
|
-
align-items: center;
|
|
1023
|
-
text-decoration: none;
|
|
1024
|
-
padding: 0.5rem 1rem;
|
|
1025
|
-
cursor: pointer; }
|
|
1026
|
-
.cweb-switcher-item .cweb-switcher-item-link .cweb-switcher-item-link-icon {
|
|
1027
|
-
display: flex;
|
|
1028
|
-
align-items: center; }
|
|
1029
|
-
.cweb-switcher-item .cweb-switcher-item-link .cweb-switcher-item-link-icon .cweb-switcher-item-link-icon-default,
|
|
1030
|
-
.cweb-switcher-item .cweb-switcher-item-link .cweb-switcher-item-link-icon .cweb-switcher-item-link-icon-active {
|
|
1031
|
-
width: 20px;
|
|
1032
|
-
height: 20px; }
|
|
1033
|
-
.cweb-switcher-item .cweb-switcher-item-link .cweb-switcher-item-link-icon .cweb-switcher-item-link-icon-active {
|
|
1034
|
-
display: none; }
|
|
1035
|
-
.cweb-switcher-item .cweb-switcher-item-link .cweb-switcher-item-link-text {
|
|
1036
|
-
color: #737373;
|
|
1037
|
-
transition: color 0.4s ease;
|
|
1038
|
-
padding-bottom: 0; }
|
|
1039
|
-
.cweb-switcher-item .cweb-switcher-item-link .cweb-switcher-item-link-icon + .cweb-switcher-item-link-text {
|
|
1040
|
-
margin-left: 8px;
|
|
1041
|
-
padding: 0; }
|
|
1042
|
-
.cweb-switcher-item.is-selected, .cweb-switcher-item:hover, .cweb-switcher-item:active {
|
|
1043
|
-
border-color: #0074dd;
|
|
1044
|
-
z-index: 1; }
|
|
1045
|
-
.cweb-switcher-item.is-selected .cweb-switcher-item-link .cweb-switcher-item-link-icon .cweb-switcher-item-link-icon-default, .cweb-switcher-item:hover .cweb-switcher-item-link .cweb-switcher-item-link-icon .cweb-switcher-item-link-icon-default, .cweb-switcher-item:active .cweb-switcher-item-link .cweb-switcher-item-link-icon .cweb-switcher-item-link-icon-default {
|
|
1046
|
-
display: none; }
|
|
1047
|
-
.cweb-switcher-item.is-selected .cweb-switcher-item-link .cweb-switcher-item-link-icon .cweb-switcher-item-link-icon-active, .cweb-switcher-item:hover .cweb-switcher-item-link .cweb-switcher-item-link-icon .cweb-switcher-item-link-icon-active, .cweb-switcher-item:active .cweb-switcher-item-link .cweb-switcher-item-link-icon .cweb-switcher-item-link-icon-active {
|
|
1048
|
-
display: inherit; }
|
|
1049
|
-
.cweb-switcher-item.is-selected .cweb-switcher-item-link .cweb-switcher-item-link-text, .cweb-switcher-item:hover .cweb-switcher-item-link .cweb-switcher-item-link-text, .cweb-switcher-item:active .cweb-switcher-item-link .cweb-switcher-item-link-text {
|
|
1050
|
-
color: #0074dd; }
|
|
1051
|
-
.cweb-switcher-item.is-disabled {
|
|
1052
|
-
pointer-events: none; }
|
|
1053
|
-
|
|
1054
1015
|
.cweb-box-shadow-default {
|
|
1055
1016
|
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.24), 0 0 2px 0 rgba(0, 0, 0, 0.12); }
|
|
1056
1017
|
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
|
|
@@ -1126,3 +1087,42 @@
|
|
|
1126
1087
|
.cweb-modal-overlay > .cweb-modal .cweb-modal-title-section > .cweb-modal-content {
|
|
1127
1088
|
margin: 24px;
|
|
1128
1089
|
overflow-y: auto; }
|
|
1090
|
+
|
|
1091
|
+
.cweb-switcher-item {
|
|
1092
|
+
display: flex;
|
|
1093
|
+
justify-content: center;
|
|
1094
|
+
flex-direction: row;
|
|
1095
|
+
align-items: center; }
|
|
1096
|
+
.cweb-switcher-item .cweb-switcher-item-link {
|
|
1097
|
+
display: flex;
|
|
1098
|
+
align-items: center;
|
|
1099
|
+
text-decoration: none;
|
|
1100
|
+
padding: 0.5rem 1rem;
|
|
1101
|
+
cursor: pointer; }
|
|
1102
|
+
.cweb-switcher-item .cweb-switcher-item-link .cweb-switcher-item-link-icon {
|
|
1103
|
+
display: flex;
|
|
1104
|
+
align-items: center; }
|
|
1105
|
+
.cweb-switcher-item .cweb-switcher-item-link .cweb-switcher-item-link-icon .cweb-switcher-item-link-icon-default,
|
|
1106
|
+
.cweb-switcher-item .cweb-switcher-item-link .cweb-switcher-item-link-icon .cweb-switcher-item-link-icon-active {
|
|
1107
|
+
width: 20px;
|
|
1108
|
+
height: 20px; }
|
|
1109
|
+
.cweb-switcher-item .cweb-switcher-item-link .cweb-switcher-item-link-icon .cweb-switcher-item-link-icon-active {
|
|
1110
|
+
display: none; }
|
|
1111
|
+
.cweb-switcher-item .cweb-switcher-item-link .cweb-switcher-item-link-text {
|
|
1112
|
+
color: #737373;
|
|
1113
|
+
transition: color 0.4s ease;
|
|
1114
|
+
padding-bottom: 0; }
|
|
1115
|
+
.cweb-switcher-item .cweb-switcher-item-link .cweb-switcher-item-link-icon + .cweb-switcher-item-link-text {
|
|
1116
|
+
margin-left: 8px;
|
|
1117
|
+
padding: 0; }
|
|
1118
|
+
.cweb-switcher-item.is-selected, .cweb-switcher-item:hover, .cweb-switcher-item:active {
|
|
1119
|
+
border-color: #0074dd;
|
|
1120
|
+
z-index: 1; }
|
|
1121
|
+
.cweb-switcher-item.is-selected .cweb-switcher-item-link .cweb-switcher-item-link-icon .cweb-switcher-item-link-icon-default, .cweb-switcher-item:hover .cweb-switcher-item-link .cweb-switcher-item-link-icon .cweb-switcher-item-link-icon-default, .cweb-switcher-item:active .cweb-switcher-item-link .cweb-switcher-item-link-icon .cweb-switcher-item-link-icon-default {
|
|
1122
|
+
display: none; }
|
|
1123
|
+
.cweb-switcher-item.is-selected .cweb-switcher-item-link .cweb-switcher-item-link-icon .cweb-switcher-item-link-icon-active, .cweb-switcher-item:hover .cweb-switcher-item-link .cweb-switcher-item-link-icon .cweb-switcher-item-link-icon-active, .cweb-switcher-item:active .cweb-switcher-item-link .cweb-switcher-item-link-icon .cweb-switcher-item-link-icon-active {
|
|
1124
|
+
display: inherit; }
|
|
1125
|
+
.cweb-switcher-item.is-selected .cweb-switcher-item-link .cweb-switcher-item-link-text, .cweb-switcher-item:hover .cweb-switcher-item-link .cweb-switcher-item-link-text, .cweb-switcher-item:active .cweb-switcher-item-link .cweb-switcher-item-link-text {
|
|
1126
|
+
color: #0074dd; }
|
|
1127
|
+
.cweb-switcher-item.is-disabled {
|
|
1128
|
+
pointer-events: none; }
|
|
@@ -8,8 +8,8 @@ var React = require('react');
|
|
|
8
8
|
var React__default = _interopDefault(React);
|
|
9
9
|
var PropTypes = _interopDefault(require('prop-types'));
|
|
10
10
|
var classNames = _interopDefault(require('classnames'));
|
|
11
|
-
var router = require('@reach/router');
|
|
12
11
|
var Glider = _interopDefault(require('react-glider'));
|
|
12
|
+
var router = require('@reach/router');
|
|
13
13
|
var ReactModal = _interopDefault(require('react-modal'));
|
|
14
14
|
var ReactDatePicker = _interopDefault(require('react-datepicker'));
|
|
15
15
|
var moment = _interopDefault(require('moment'));
|
|
@@ -17,7 +17,7 @@ require('react-datepicker/dist/react-datepicker.css');
|
|
|
17
17
|
var ClipboardJS = _interopDefault(require('clipboard'));
|
|
18
18
|
var ReactSelect = require('react-select');
|
|
19
19
|
var ReactSelect__default = _interopDefault(ReactSelect);
|
|
20
|
-
var debounce = _interopDefault(require('lodash
|
|
20
|
+
var debounce = _interopDefault(require('lodash.debounce'));
|
|
21
21
|
var ReactQuill = _interopDefault(require('react-quill'));
|
|
22
22
|
require('react-quill/dist/quill.snow.css');
|
|
23
23
|
var draftJs = require('draft-js');
|
|
@@ -238,6 +238,163 @@ var Badge = function Badge(props) {
|
|
|
238
238
|
}, props.badgeCount));
|
|
239
239
|
};
|
|
240
240
|
|
|
241
|
+
var BUTTON_ROLES = {
|
|
242
|
+
PRIMARY: "primary",
|
|
243
|
+
SECONDARY: "secondary",
|
|
244
|
+
SECONDARY_DARK: "secondaryDark",
|
|
245
|
+
TERTIARY: "tertiary",
|
|
246
|
+
QUATERNARY: "quaternary",
|
|
247
|
+
NEGATIVE: "negative",
|
|
248
|
+
TEXT: "text",
|
|
249
|
+
LINK: "link",
|
|
250
|
+
ICON: "icon"
|
|
251
|
+
};
|
|
252
|
+
|
|
253
|
+
var CloseIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M7.05037 5.63664C6.65984 5.24612 6.02668 5.24612 5.63615 5.63664C5.24563 6.02717 5.24563 6.66033 5.63616 7.05086L10.5862 12.0009L5.63618 16.9509C5.24566 17.3415 5.24566 17.9746 5.63618 18.3652C6.02671 18.7557 6.65987 18.7557 7.0504 18.3652L12.0004 13.4151L16.9499 18.3646C17.3404 18.7551 17.9736 18.7551 18.3641 18.3646C18.7546 17.974 18.7546 17.3409 18.3641 16.9504L13.4146 12.0009L18.3641 7.05145C18.7546 6.66093 18.7546 6.02776 18.3641 5.63724C17.9736 5.24671 17.3404 5.24671 16.9499 5.63724L12.0004 10.5867L7.05037 5.63664Z\" fill=\"#EDF2F7\"/>\n</svg>";
|
|
254
|
+
|
|
255
|
+
var HamburgerIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M3 6C3 5.44772 3.44772 5 4 5H20C20.5523 5 21 5.44772 21 6C21 6.55228 20.5523 7 20 7H4C3.44772 7 3 6.55228 3 6Z\" fill=\"#EDF2F7\"/>\n<path d=\"M3 12C3 11.4477 3.44772 11 4 11H20C20.5523 11 21 11.4477 21 12C21 12.5523 20.5523 13 20 13H4C3.44772 13 3 12.5523 3 12Z\" fill=\"#EDF2F7\"/>\n<path d=\"M4 17C3.44772 17 3 17.4477 3 18C3 18.5523 3.44772 19 4 19H20C20.5523 19 21 18.5523 21 18C21 17.4477 20.5523 17 20 17H4Z\" fill=\"#EDF2F7\"/>\n</svg>";
|
|
256
|
+
|
|
257
|
+
var ChevronRightBlueIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M9.31008 6.70978C8.92008 7.09978 8.92008 7.72978 9.31008 8.11978L13.1901 11.9998L9.31008 15.8798C8.92008 16.2698 8.92008 16.8998 9.31008 17.2898C9.70008 17.6798 10.3301 17.6798 10.7201 17.2898L15.3101 12.6998C15.7001 12.3098 15.7001 11.6798 15.3101 11.2898L10.7201 6.69978C10.3401 6.31978 9.70008 6.31978 9.31008 6.70978Z\" fill=\"#0074DD\"/>\n</svg>";
|
|
258
|
+
|
|
259
|
+
var ChevronRightGreyIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M9.31008 6.70978C8.92008 7.09978 8.92008 7.72978 9.31008 8.11978L13.1901 11.9998L9.31008 15.8798C8.92008 16.2698 8.92008 16.8998 9.31008 17.2898C9.70008 17.6798 10.3301 17.6798 10.7201 17.2898L15.3101 12.6998C15.7001 12.3098 15.7001 11.6798 15.3101 11.2898L10.7201 6.69978C10.3401 6.31978 9.70008 6.31978 9.31008 6.70978Z\" fill=\"#EDF2F7\"/>\n</svg>";
|
|
260
|
+
|
|
261
|
+
var ChevronLeftBlueIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M13.6899 17.2902C14.0799 16.9002 14.0799 16.2702 13.6899 15.8802L9.80992 12.0002L13.6899 8.12022C14.0799 7.73022 14.0799 7.10022 13.6899 6.71022C13.2999 6.32022 12.6699 6.32022 12.2799 6.71022L7.68992 11.3002C7.29992 11.6902 7.29992 12.3202 7.68992 12.7102L12.2799 17.3002C12.6599 17.6802 13.2999 17.6802 13.6899 17.2902Z\" fill=\"#0074DD\"/>\n</svg>";
|
|
262
|
+
|
|
263
|
+
var ChevronLeftGreyIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M13.6899 17.2902C14.0799 16.9002 14.0799 16.2702 13.6899 15.8802L9.80992 12.0002L13.6899 8.12022C14.0799 7.73022 14.0799 7.10022 13.6899 6.71022C13.2999 6.32022 12.6699 6.32022 12.2799 6.71022L7.68992 11.3002C7.29992 11.6902 7.29992 12.3202 7.68992 12.7102L12.2799 17.3002C12.6599 17.6802 13.2999 17.6802 13.6899 17.2902Z\" fill=\"#EDF2F7\"/>\n</svg>";
|
|
264
|
+
|
|
265
|
+
var SearchIcon = "<svg width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M12.5006 11.0006H11.7106L11.4306 10.7306C12.6306 9.33063 13.2506 7.42063 12.9106 5.39063C12.4406 2.61063 10.1206 0.390626 7.32063 0.0506256C3.09063 -0.469374 -0.469374 3.09063 0.0506256 7.32063C0.390626 10.1206 2.61063 12.4406 5.39063 12.9106C7.42063 13.2506 9.33063 12.6306 10.7306 11.4306L11.0006 11.7106V12.5006L15.2506 16.7506C15.6606 17.1606 16.3306 17.1606 16.7406 16.7506C17.1506 16.3406 17.1506 15.6706 16.7406 15.2606L12.5006 11.0006ZM6.50063 11.0006C4.01063 11.0006 2.00063 8.99063 2.00063 6.50063C2.00063 4.01063 4.01063 2.00063 6.50063 2.00063C8.99063 2.00063 11.0006 4.01063 11.0006 6.50063C11.0006 8.99063 8.99063 11.0006 6.50063 11.0006Z\" fill=\"#0074DD\"/>\n</svg>";
|
|
266
|
+
|
|
267
|
+
var SearchCancelIcon = "<svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M2.05086 0.636643C1.66033 0.246119 1.02717 0.246119 0.636643 0.636643C0.246119 1.02717 0.246119 1.66033 0.636643 2.05086L5.5867 7.00092L0.636672 11.9509C0.246148 12.3415 0.246148 12.9746 0.636672 13.3652C1.0272 13.7557 1.66036 13.7557 2.05089 13.3652L7.00091 8.41513L11.9503 13.3646C12.3409 13.7551 12.974 13.7551 13.3646 13.3646C13.7551 12.974 13.7551 12.3409 13.3646 11.9504L8.41513 7.00092L13.3646 2.05145C13.7551 1.66093 13.7551 1.02776 13.3646 0.637237C12.9741 0.246712 12.3409 0.246713 11.9504 0.637237L7.00092 5.5867L2.05086 0.636643Z\" fill=\"#0074DD\"/>\n</svg>";
|
|
268
|
+
|
|
269
|
+
var StarIcon = "<svg width=\"19\" height=\"18\" viewBox=\"0 0 19 18\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M8.58663 1.04906C8.93899 0.258571 10.061 0.258571 10.4134 1.04906L12.1659 4.9807C12.3112 5.30673 12.6193 5.53057 12.9743 5.56804L17.2551 6.01985C18.1158 6.11069 18.4625 7.17779 17.8196 7.75718L14.6219 10.6389C14.3568 10.8778 14.2391 11.24 14.3131 11.5892L15.2063 15.8001C15.3858 16.6467 14.4781 17.3062 13.7284 16.8738L9.99962 14.7232C9.69041 14.5448 9.30959 14.5448 9.00038 14.7232L5.27159 16.8738C4.52189 17.3062 3.61416 16.6467 3.79373 15.8001L4.68686 11.5892C4.76093 11.24 4.64325 10.8778 4.37808 10.6389L1.18043 7.75718C0.537518 7.17779 0.88424 6.11069 1.74492 6.01985L6.0257 5.56804C6.38068 5.53057 6.68877 5.30673 6.8341 4.9807L8.58663 1.04906Z\" fill=\"#009FE3\"/>\n</svg>";
|
|
270
|
+
|
|
271
|
+
var checkmark = "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\">\n <g transform=\"translate(1.5, 0.5)\">\n <path fill=\"none\" fill-rule=\"evenodd\" stroke=\"#0074DD\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12.643 3.357L6.03 9.97l-2.674 2.674L0 9.286\"/>\n </g>\n</svg>";
|
|
272
|
+
|
|
273
|
+
var iconSrc = {
|
|
274
|
+
// These need to be converted to svg files instead of components and added in
|
|
275
|
+
// "add": AddIcon,
|
|
276
|
+
// "delete": DeleteIcon,
|
|
277
|
+
// "edit": EditIcon,
|
|
278
|
+
close: CloseIcon,
|
|
279
|
+
hamburger: HamburgerIcon,
|
|
280
|
+
"chevron-right-blue": ChevronRightBlueIcon,
|
|
281
|
+
"chevron-left-blue": ChevronLeftBlueIcon,
|
|
282
|
+
"chevron-right-grey": ChevronRightGreyIcon,
|
|
283
|
+
"chevron-left-grey": ChevronLeftGreyIcon,
|
|
284
|
+
search: SearchIcon,
|
|
285
|
+
star: StarIcon,
|
|
286
|
+
check: checkmark,
|
|
287
|
+
"search-cancel": SearchCancelIcon
|
|
288
|
+
};
|
|
289
|
+
var ButtonIcon = function ButtonIcon(props) {
|
|
290
|
+
return /*#__PURE__*/React.createElement("img", {
|
|
291
|
+
src: iconSrc[props.name],
|
|
292
|
+
className: props.className
|
|
293
|
+
});
|
|
294
|
+
};
|
|
295
|
+
|
|
296
|
+
var Spinner = function Spinner(props) {
|
|
297
|
+
return /*#__PURE__*/React__default.createElement("svg", {
|
|
298
|
+
className: "w-5 h-5 animate-spin " + props.className,
|
|
299
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
300
|
+
fill: "none",
|
|
301
|
+
viewBox: "0 0 24 24"
|
|
302
|
+
}, /*#__PURE__*/React__default.createElement("circle", {
|
|
303
|
+
className: "opacity-25",
|
|
304
|
+
cx: "12",
|
|
305
|
+
cy: "12",
|
|
306
|
+
r: "10",
|
|
307
|
+
stroke: "currentColor",
|
|
308
|
+
strokeWidth: "4"
|
|
309
|
+
}), /*#__PURE__*/React__default.createElement("path", {
|
|
310
|
+
className: "opacity-75",
|
|
311
|
+
fill: "currentColor",
|
|
312
|
+
d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
|
|
313
|
+
}));
|
|
314
|
+
};
|
|
315
|
+
|
|
316
|
+
var ButtonV2 = function ButtonV2(props) {
|
|
317
|
+
if (!props.text && !props.icon) {
|
|
318
|
+
console.error("A text or an icon is required to use this component, please make sure to pass at least one of them as a prop.");
|
|
319
|
+
return /*#__PURE__*/React__default.createElement("span", null, "Invalid props passed to this component.");
|
|
320
|
+
}
|
|
321
|
+
|
|
322
|
+
var handleClick = function handleClick(event) {
|
|
323
|
+
if (props.type === "submit") {
|
|
324
|
+
event.preventDefault();
|
|
325
|
+
}
|
|
326
|
+
|
|
327
|
+
props.onClick(event);
|
|
328
|
+
};
|
|
329
|
+
|
|
330
|
+
var buttonClassName = classNames(["h-11", "relative flex flex-row justify-center items-center", "border", "transition-outline transition-colors duration-300 ease-in-out", "rounded-full", "leading-none", "shadow-sm", "cursor-pointer", "focus:outline-primary"], {
|
|
331
|
+
"w-11": !props.text && props.icon,
|
|
332
|
+
"px-4": props.text,
|
|
333
|
+
"py-2": props.text && props.icon,
|
|
334
|
+
"py-3": props.text && !props.icon
|
|
335
|
+
}, {
|
|
336
|
+
"opacity-50": props.isDisabled,
|
|
337
|
+
"pointer-events-none": props.isDisabled || props.isPending
|
|
338
|
+
}, props.className);
|
|
339
|
+
return /*#__PURE__*/React__default.createElement("button", {
|
|
340
|
+
className: buttonClassName,
|
|
341
|
+
type: props.type,
|
|
342
|
+
onClick: handleClick,
|
|
343
|
+
disabled: props.isDisabled,
|
|
344
|
+
"aria-disabled": props.isDisabled
|
|
345
|
+
}, props.icon && /*#__PURE__*/React__default.createElement(props.icon, {
|
|
346
|
+
className: "w-5 h-5"
|
|
347
|
+
}), props.isPending && /*#__PURE__*/React__default.createElement("span", {
|
|
348
|
+
className: "opacity-100",
|
|
349
|
+
// IE11 center translate fix
|
|
350
|
+
style: {
|
|
351
|
+
position: "absolute",
|
|
352
|
+
left: "50%",
|
|
353
|
+
top: "50%",
|
|
354
|
+
transform: "translate(-50%, -50%)"
|
|
355
|
+
}
|
|
356
|
+
}, /*#__PURE__*/React__default.createElement(Spinner, {
|
|
357
|
+
className: "text-white"
|
|
358
|
+
})), props.text && /*#__PURE__*/React__default.createElement("span", {
|
|
359
|
+
className: classNames("text-sm font-medium", {
|
|
360
|
+
invisible: props.isPending,
|
|
361
|
+
"ml-1": props.icon
|
|
362
|
+
})
|
|
363
|
+
}, props.text));
|
|
364
|
+
};
|
|
365
|
+
|
|
366
|
+
var PrimaryButton = function PrimaryButton(props) {
|
|
367
|
+
return /*#__PURE__*/React__default.createElement(ButtonV2, {
|
|
368
|
+
className: classNames(["text-white", "bg-blue-800", "border-transparent", "hover:bg-blue-900"]),
|
|
369
|
+
onClick: props.onClick,
|
|
370
|
+
type: props.type,
|
|
371
|
+
text: props.text,
|
|
372
|
+
icon: props.icon,
|
|
373
|
+
isDisabled: props.isDisabled,
|
|
374
|
+
isPending: props.isPending
|
|
375
|
+
});
|
|
376
|
+
};
|
|
377
|
+
|
|
378
|
+
var SecondaryButton = function SecondaryButton(props) {
|
|
379
|
+
return /*#__PURE__*/React__default.createElement(ButtonV2, {
|
|
380
|
+
className: classNames(["text-blue-800", "bg-white", "border-slate-300", "hover:text-blue-900", "hover:border-slate-400"]),
|
|
381
|
+
onClick: props.onClick,
|
|
382
|
+
text: props.text,
|
|
383
|
+
icon: props.icon,
|
|
384
|
+
isDisabled: props.isDisabled
|
|
385
|
+
});
|
|
386
|
+
};
|
|
387
|
+
|
|
388
|
+
var TertiaryButton = function TertiaryButton(props) {
|
|
389
|
+
return /*#__PURE__*/React__default.createElement(ButtonV2, {
|
|
390
|
+
className: classNames(["text-blue-800", "bg-transparent", "border-transparent", "hover:text-blue-900", "shadow-none"]),
|
|
391
|
+
onClick: props.onClick,
|
|
392
|
+
text: props.text,
|
|
393
|
+
icon: props.icon,
|
|
394
|
+
isDisabled: props.isDisabled
|
|
395
|
+
});
|
|
396
|
+
};
|
|
397
|
+
|
|
241
398
|
function _extends() {
|
|
242
399
|
_extends = Object.assign ? Object.assign.bind() : function (target) {
|
|
243
400
|
for (var i = 1; i < arguments.length; i++) {
|
|
@@ -285,26 +442,6 @@ function _objectWithoutPropertiesLoose(source, excluded) {
|
|
|
285
442
|
return target;
|
|
286
443
|
}
|
|
287
444
|
|
|
288
|
-
var Spinner = function Spinner(props) {
|
|
289
|
-
return /*#__PURE__*/React__default.createElement("svg", {
|
|
290
|
-
className: "w-5 h-5 animate-spin " + props.className,
|
|
291
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
292
|
-
fill: "none",
|
|
293
|
-
viewBox: "0 0 24 24"
|
|
294
|
-
}, /*#__PURE__*/React__default.createElement("circle", {
|
|
295
|
-
className: "opacity-25",
|
|
296
|
-
cx: "12",
|
|
297
|
-
cy: "12",
|
|
298
|
-
r: "10",
|
|
299
|
-
stroke: "currentColor",
|
|
300
|
-
strokeWidth: "4"
|
|
301
|
-
}), /*#__PURE__*/React__default.createElement("path", {
|
|
302
|
-
className: "opacity-75",
|
|
303
|
-
fill: "currentColor",
|
|
304
|
-
d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
|
|
305
|
-
}));
|
|
306
|
-
};
|
|
307
|
-
|
|
308
445
|
var AddIcon = function AddIcon(props) {
|
|
309
446
|
return /*#__PURE__*/React__default.createElement("svg", {
|
|
310
447
|
className: props.className,
|
|
@@ -432,61 +569,6 @@ var PrintIcon = function PrintIcon(props) {
|
|
|
432
569
|
}));
|
|
433
570
|
};
|
|
434
571
|
|
|
435
|
-
var CloseIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M7.05037 5.63664C6.65984 5.24612 6.02668 5.24612 5.63615 5.63664C5.24563 6.02717 5.24563 6.66033 5.63616 7.05086L10.5862 12.0009L5.63618 16.9509C5.24566 17.3415 5.24566 17.9746 5.63618 18.3652C6.02671 18.7557 6.65987 18.7557 7.0504 18.3652L12.0004 13.4151L16.9499 18.3646C17.3404 18.7551 17.9736 18.7551 18.3641 18.3646C18.7546 17.974 18.7546 17.3409 18.3641 16.9504L13.4146 12.0009L18.3641 7.05145C18.7546 6.66093 18.7546 6.02776 18.3641 5.63724C17.9736 5.24671 17.3404 5.24671 16.9499 5.63724L12.0004 10.5867L7.05037 5.63664Z\" fill=\"#EDF2F7\"/>\n</svg>";
|
|
436
|
-
|
|
437
|
-
var HamburgerIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M3 6C3 5.44772 3.44772 5 4 5H20C20.5523 5 21 5.44772 21 6C21 6.55228 20.5523 7 20 7H4C3.44772 7 3 6.55228 3 6Z\" fill=\"#EDF2F7\"/>\n<path d=\"M3 12C3 11.4477 3.44772 11 4 11H20C20.5523 11 21 11.4477 21 12C21 12.5523 20.5523 13 20 13H4C3.44772 13 3 12.5523 3 12Z\" fill=\"#EDF2F7\"/>\n<path d=\"M4 17C3.44772 17 3 17.4477 3 18C3 18.5523 3.44772 19 4 19H20C20.5523 19 21 18.5523 21 18C21 17.4477 20.5523 17 20 17H4Z\" fill=\"#EDF2F7\"/>\n</svg>";
|
|
438
|
-
|
|
439
|
-
var ChevronRightBlueIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M9.31008 6.70978C8.92008 7.09978 8.92008 7.72978 9.31008 8.11978L13.1901 11.9998L9.31008 15.8798C8.92008 16.2698 8.92008 16.8998 9.31008 17.2898C9.70008 17.6798 10.3301 17.6798 10.7201 17.2898L15.3101 12.6998C15.7001 12.3098 15.7001 11.6798 15.3101 11.2898L10.7201 6.69978C10.3401 6.31978 9.70008 6.31978 9.31008 6.70978Z\" fill=\"#0074DD\"/>\n</svg>";
|
|
440
|
-
|
|
441
|
-
var ChevronRightGreyIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M9.31008 6.70978C8.92008 7.09978 8.92008 7.72978 9.31008 8.11978L13.1901 11.9998L9.31008 15.8798C8.92008 16.2698 8.92008 16.8998 9.31008 17.2898C9.70008 17.6798 10.3301 17.6798 10.7201 17.2898L15.3101 12.6998C15.7001 12.3098 15.7001 11.6798 15.3101 11.2898L10.7201 6.69978C10.3401 6.31978 9.70008 6.31978 9.31008 6.70978Z\" fill=\"#EDF2F7\"/>\n</svg>";
|
|
442
|
-
|
|
443
|
-
var ChevronLeftBlueIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M13.6899 17.2902C14.0799 16.9002 14.0799 16.2702 13.6899 15.8802L9.80992 12.0002L13.6899 8.12022C14.0799 7.73022 14.0799 7.10022 13.6899 6.71022C13.2999 6.32022 12.6699 6.32022 12.2799 6.71022L7.68992 11.3002C7.29992 11.6902 7.29992 12.3202 7.68992 12.7102L12.2799 17.3002C12.6599 17.6802 13.2999 17.6802 13.6899 17.2902Z\" fill=\"#0074DD\"/>\n</svg>";
|
|
444
|
-
|
|
445
|
-
var ChevronLeftGreyIcon = "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M13.6899 17.2902C14.0799 16.9002 14.0799 16.2702 13.6899 15.8802L9.80992 12.0002L13.6899 8.12022C14.0799 7.73022 14.0799 7.10022 13.6899 6.71022C13.2999 6.32022 12.6699 6.32022 12.2799 6.71022L7.68992 11.3002C7.29992 11.6902 7.29992 12.3202 7.68992 12.7102L12.2799 17.3002C12.6599 17.6802 13.2999 17.6802 13.6899 17.2902Z\" fill=\"#EDF2F7\"/>\n</svg>";
|
|
446
|
-
|
|
447
|
-
var SearchIcon = "<svg width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M12.5006 11.0006H11.7106L11.4306 10.7306C12.6306 9.33063 13.2506 7.42063 12.9106 5.39063C12.4406 2.61063 10.1206 0.390626 7.32063 0.0506256C3.09063 -0.469374 -0.469374 3.09063 0.0506256 7.32063C0.390626 10.1206 2.61063 12.4406 5.39063 12.9106C7.42063 13.2506 9.33063 12.6306 10.7306 11.4306L11.0006 11.7106V12.5006L15.2506 16.7506C15.6606 17.1606 16.3306 17.1606 16.7406 16.7506C17.1506 16.3406 17.1506 15.6706 16.7406 15.2606L12.5006 11.0006ZM6.50063 11.0006C4.01063 11.0006 2.00063 8.99063 2.00063 6.50063C2.00063 4.01063 4.01063 2.00063 6.50063 2.00063C8.99063 2.00063 11.0006 4.01063 11.0006 6.50063C11.0006 8.99063 8.99063 11.0006 6.50063 11.0006Z\" fill=\"#0074DD\"/>\n</svg>";
|
|
448
|
-
|
|
449
|
-
var SearchCancelIcon = "<svg width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M2.05086 0.636643C1.66033 0.246119 1.02717 0.246119 0.636643 0.636643C0.246119 1.02717 0.246119 1.66033 0.636643 2.05086L5.5867 7.00092L0.636672 11.9509C0.246148 12.3415 0.246148 12.9746 0.636672 13.3652C1.0272 13.7557 1.66036 13.7557 2.05089 13.3652L7.00091 8.41513L11.9503 13.3646C12.3409 13.7551 12.974 13.7551 13.3646 13.3646C13.7551 12.974 13.7551 12.3409 13.3646 11.9504L8.41513 7.00092L13.3646 2.05145C13.7551 1.66093 13.7551 1.02776 13.3646 0.637237C12.9741 0.246712 12.3409 0.246713 11.9504 0.637237L7.00092 5.5867L2.05086 0.636643Z\" fill=\"#0074DD\"/>\n</svg>";
|
|
450
|
-
|
|
451
|
-
var StarIcon = "<svg width=\"19\" height=\"18\" viewBox=\"0 0 19 18\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M8.58663 1.04906C8.93899 0.258571 10.061 0.258571 10.4134 1.04906L12.1659 4.9807C12.3112 5.30673 12.6193 5.53057 12.9743 5.56804L17.2551 6.01985C18.1158 6.11069 18.4625 7.17779 17.8196 7.75718L14.6219 10.6389C14.3568 10.8778 14.2391 11.24 14.3131 11.5892L15.2063 15.8001C15.3858 16.6467 14.4781 17.3062 13.7284 16.8738L9.99962 14.7232C9.69041 14.5448 9.30959 14.5448 9.00038 14.7232L5.27159 16.8738C4.52189 17.3062 3.61416 16.6467 3.79373 15.8001L4.68686 11.5892C4.76093 11.24 4.64325 10.8778 4.37808 10.6389L1.18043 7.75718C0.537518 7.17779 0.88424 6.11069 1.74492 6.01985L6.0257 5.56804C6.38068 5.53057 6.68877 5.30673 6.8341 4.9807L8.58663 1.04906Z\" fill=\"#009FE3\"/>\n</svg>";
|
|
452
|
-
|
|
453
|
-
var checkmark = "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\">\n <g transform=\"translate(1.5, 0.5)\">\n <path fill=\"none\" fill-rule=\"evenodd\" stroke=\"#0074DD\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12.643 3.357L6.03 9.97l-2.674 2.674L0 9.286\"/>\n </g>\n</svg>";
|
|
454
|
-
|
|
455
|
-
var iconSrc = {
|
|
456
|
-
// These need to be converted to svg files instead of components and added in
|
|
457
|
-
// "add": AddIcon,
|
|
458
|
-
// "delete": DeleteIcon,
|
|
459
|
-
// "edit": EditIcon,
|
|
460
|
-
close: CloseIcon,
|
|
461
|
-
hamburger: HamburgerIcon,
|
|
462
|
-
"chevron-right-blue": ChevronRightBlueIcon,
|
|
463
|
-
"chevron-left-blue": ChevronLeftBlueIcon,
|
|
464
|
-
"chevron-right-grey": ChevronRightGreyIcon,
|
|
465
|
-
"chevron-left-grey": ChevronLeftGreyIcon,
|
|
466
|
-
search: SearchIcon,
|
|
467
|
-
star: StarIcon,
|
|
468
|
-
check: checkmark,
|
|
469
|
-
"search-cancel": SearchCancelIcon
|
|
470
|
-
};
|
|
471
|
-
var ButtonIcon = function ButtonIcon(props) {
|
|
472
|
-
return /*#__PURE__*/React.createElement("img", {
|
|
473
|
-
src: iconSrc[props.name],
|
|
474
|
-
className: props.className
|
|
475
|
-
});
|
|
476
|
-
};
|
|
477
|
-
|
|
478
|
-
var BUTTON_ROLES = {
|
|
479
|
-
PRIMARY: "primary",
|
|
480
|
-
SECONDARY: "secondary",
|
|
481
|
-
SECONDARY_DARK: "secondaryDark",
|
|
482
|
-
TERTIARY: "tertiary",
|
|
483
|
-
QUATERNARY: "quaternary",
|
|
484
|
-
NEGATIVE: "negative",
|
|
485
|
-
TEXT: "text",
|
|
486
|
-
LINK: "link",
|
|
487
|
-
ICON: "icon"
|
|
488
|
-
};
|
|
489
|
-
|
|
490
572
|
var _excluded = ["text", "role", "type", "title", "link", "isPending", "isDisabled", "onClick", "className", "iconName", "hasIcon", "dynamicIcon"];
|
|
491
573
|
|
|
492
574
|
function Button(props) {
|
|
@@ -634,86 +716,6 @@ function Button(props) {
|
|
|
634
716
|
}, text));
|
|
635
717
|
}
|
|
636
718
|
|
|
637
|
-
var ButtonV2 = function ButtonV2(props) {
|
|
638
|
-
if (!props.text && !props.icon) {
|
|
639
|
-
console.error("A text or an icon is required to use this component, please make sure to pass at least one of them as a prop.");
|
|
640
|
-
return /*#__PURE__*/React__default.createElement("span", null, "Invalid props passed to this component.");
|
|
641
|
-
}
|
|
642
|
-
|
|
643
|
-
var handleClick = function handleClick(event) {
|
|
644
|
-
if (props.type === "submit") {
|
|
645
|
-
event.preventDefault();
|
|
646
|
-
}
|
|
647
|
-
|
|
648
|
-
props.onClick(event);
|
|
649
|
-
};
|
|
650
|
-
|
|
651
|
-
var buttonClassName = classNames(["h-11", "relative flex flex-row justify-center items-center", "transition-outline transition-colors duration-300 ease-in-out", "rounded-full", "leading-none", "shadow-sm", "cursor-pointer", "focus:outline-none"], {
|
|
652
|
-
"w-11": !props.text && props.icon,
|
|
653
|
-
"px-4": props.text,
|
|
654
|
-
"py-2": props.text && props.icon,
|
|
655
|
-
"py-3": props.text && !props.icon
|
|
656
|
-
}, props.className);
|
|
657
|
-
return /*#__PURE__*/React__default.createElement("button", {
|
|
658
|
-
className: buttonClassName,
|
|
659
|
-
type: props.type,
|
|
660
|
-
onClick: handleClick,
|
|
661
|
-
disabled: props.isDisabled,
|
|
662
|
-
"aria-disabled": props.isDisabled
|
|
663
|
-
}, props.icon && /*#__PURE__*/React__default.createElement(props.icon, {
|
|
664
|
-
className: "w-5 h-5"
|
|
665
|
-
}), props.isPending && /*#__PURE__*/React__default.createElement("span", {
|
|
666
|
-
className: "opacity-100",
|
|
667
|
-
// IE11 center translate fix
|
|
668
|
-
style: {
|
|
669
|
-
position: "absolute",
|
|
670
|
-
left: "50%",
|
|
671
|
-
top: "50%",
|
|
672
|
-
transform: "translate(-50%, -50%)"
|
|
673
|
-
}
|
|
674
|
-
}, /*#__PURE__*/React__default.createElement(Spinner, {
|
|
675
|
-
className: "text-white"
|
|
676
|
-
})), props.text && /*#__PURE__*/React__default.createElement("span", {
|
|
677
|
-
className: classNames("text-sm font-medium", {
|
|
678
|
-
invisible: props.isPending,
|
|
679
|
-
"ml-1": props.icon
|
|
680
|
-
})
|
|
681
|
-
}, props.text));
|
|
682
|
-
};
|
|
683
|
-
|
|
684
|
-
var PrimaryButton = function PrimaryButton(props) {
|
|
685
|
-
return /*#__PURE__*/React__default.createElement(ButtonV2, {
|
|
686
|
-
className: classNames(["text-white", "bg-primary", "border", "border-solid", "border-primary-transparent", "hover:bg-primary-dark", "focus:outline-primary"], {
|
|
687
|
-
"opacity-50": props.isDisabled,
|
|
688
|
-
"pointer-events-none": props.isDisabled || props.isPending
|
|
689
|
-
}),
|
|
690
|
-
onClick: props.onClick,
|
|
691
|
-
type: props.type,
|
|
692
|
-
text: props.text,
|
|
693
|
-
icon: props.icon,
|
|
694
|
-
isDisabled: props.isDisabled,
|
|
695
|
-
isPending: props.isPending
|
|
696
|
-
});
|
|
697
|
-
};
|
|
698
|
-
|
|
699
|
-
var SecondaryButton = function SecondaryButton(props) {
|
|
700
|
-
return /*#__PURE__*/React__default.createElement(ButtonV2, {
|
|
701
|
-
className: classNames(["text-primary", "bg-white", "border", "border-slate-300", "hover:text-primary-dark", "hover:border-slate-400", "focus:outline-primary"]),
|
|
702
|
-
onClick: props.onClick,
|
|
703
|
-
text: props.text,
|
|
704
|
-
icon: props.icon
|
|
705
|
-
});
|
|
706
|
-
};
|
|
707
|
-
|
|
708
|
-
var TertiaryButton = function TertiaryButton(props) {
|
|
709
|
-
return /*#__PURE__*/React__default.createElement(ButtonV2, {
|
|
710
|
-
className: classNames(["text-primary", "bg-transparent", "border", "border-transparent", "shadow-none", "hover:text-primary-dark", "focus:outline-primary"]),
|
|
711
|
-
onClick: props.onClick,
|
|
712
|
-
text: props.text,
|
|
713
|
-
icon: props.icon
|
|
714
|
-
});
|
|
715
|
-
};
|
|
716
|
-
|
|
717
719
|
var GliderContainer = function GliderContainer(props) {
|
|
718
720
|
return /*#__PURE__*/React__default.createElement("div", {
|
|
719
721
|
className: "relative h-full pb-6 glider-contain px-17 pb-6"
|
|
@@ -4068,7 +4070,6 @@ exports.Acknowledgement = Acknowledgement;
|
|
|
4068
4070
|
exports.Avatar = Avatar;
|
|
4069
4071
|
exports.BUTTON_ROLES = BUTTON_ROLES;
|
|
4070
4072
|
exports.Badge = Badge;
|
|
4071
|
-
exports.Button = Button;
|
|
4072
4073
|
exports.ButtonIcon = ButtonIcon;
|
|
4073
4074
|
exports.CRUDPage = CRUDPage;
|
|
4074
4075
|
exports.Carousel = Carousel;
|