genesys-react-components 0.1.0-alpha.5 → 0.1.0-alpha.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/build/dxaccordion/DxAccordion.d.ts +3 -8
  2. package/build/dxaccordion/DxAccordionGroup.d.ts +1 -0
  3. package/build/dxitemgroup/DxCheckbox.d.ts +17 -0
  4. package/build/dxitemgroup/DxItemGroup.d.ts +2 -13
  5. package/build/dxtabbedcontent/DxTabPanel.d.ts +3 -7
  6. package/build/dxtabbedcontent/DxTabbedContent.d.ts +3 -7
  7. package/build/index.d.ts +39 -1
  8. package/build/index.js +108 -45
  9. package/build/index.js.map +1 -1
  10. package/package.json +1 -1
package/build/dxaccordion/DxAccordion.d.ts CHANGED
@@ -1,9 +1,4 @@
1
- import React from 'react';
1
+ /// <reference types="react" />
2
+ import { DxAccordionProps } from '..';
2
3
  import './DxAccordion.scss';
3
- interface IProps {
4
- title: React.ReactNode;
5
- children: React.ReactNode;
6
- showOpen?: boolean;
7
- }
8
- export default function DxAccordion(props: IProps): JSX.Element;
9
- export {};
4
+ export default function DxAccordion(props: DxAccordionProps): JSX.Element;
package/build/dxaccordion/DxAccordionGroup.d.ts CHANGED
@@ -2,6 +2,7 @@ import React from 'react';
2
2
  import './DxAccordionGroup.scss';
3
3
  interface IProps {
4
4
  children: React.ReactNode;
5
+ className?: string;
5
6
  }
6
7
  export default function DxAccordionGroup(props: IProps): JSX.Element;
7
8
  export {};
package/build/dxitemgroup/DxCheckbox.d.ts ADDED
@@ -0,0 +1,17 @@
1
+ /// <reference types="react" />
2
+ import { CheckedChangedCallback } from '..';
3
+ import './DxCheckbox.scss';
4
+ interface IProps {
5
+ label: string;
6
+ itemValue: string;
7
+ description?: string;
8
+ checked?: boolean;
9
+ initiallyChecked?: boolean;
10
+ name?: string;
11
+ className?: string;
12
+ onCheckChanged?: CheckedChangedCallback;
13
+ useRadioType?: boolean;
14
+ disabled?: boolean;
15
+ }
16
+ export default function DxCheckbox(props: IProps): JSX.Element;
17
+ export {};
package/build/dxitemgroup/DxItemGroup.d.ts CHANGED
@@ -1,18 +1,7 @@
1
1
  /// <reference types="react" />
2
- import { DxItemGroupItem, ItemChangedCallback, ItemGroupChangedCallback } from '..';
2
+ import { DxItemGroupProps } from '..';
3
3
  import './DxItemGroup.scss';
4
- import './checkbox.scss';
5
4
  import './radiobutton.scss';
6
5
  import './dropdown.scss';
7
6
  import './multiselect.scss';
8
- interface IProps {
9
- title?: string;
10
- description?: string;
11
- format: DxItemGroupFormat;
12
- items: DxItemGroupItem[];
13
- onItemChanged?: ItemChangedCallback;
14
- onItemsChanged?: ItemGroupChangedCallback;
15
- }
16
- export declare type DxItemGroupFormat = 'checkbox' | 'radio' | 'dropdown' | 'multiselect';
17
- export default function DxItemGroup(props: IProps): JSX.Element;
18
- export {};
7
+ export default function DxItemGroup(props: DxItemGroupProps): JSX.Element;
package/build/dxtabbedcontent/DxTabPanel.d.ts CHANGED
@@ -1,8 +1,4 @@
1
- import React from 'react';
1
+ /// <reference types="react" />
2
+ import { DxTabPanelProps } from '..';
2
3
  import './DxTabPanel.scss';
3
- interface IProps {
4
- title: React.ReactNode;
5
- children: React.ReactNode;
6
- }
7
- export default function DxTabPanel(props: IProps): JSX.Element;
8
- export {};
4
+ export default function DxTabPanel(props: DxTabPanelProps): JSX.Element;
package/build/dxtabbedcontent/DxTabbedContent.d.ts CHANGED
@@ -1,8 +1,4 @@
1
- import React from 'react';
1
+ /// <reference types="react" />
2
+ import { DxTabbedContentProps } from '..';
2
3
  import './DxTabbedContent.scss';
3
- interface IProps {
4
- children: React.ReactNode;
5
- initialTabId?: number;
6
- }
7
- export default function DxTabbedContent(props: IProps): JSX.Element;
8
- export {};
4
+ export default function DxTabbedContent(props: DxTabbedContentProps): JSX.Element;
package/build/index.d.ts CHANGED
@@ -4,24 +4,29 @@ import DxAccordion from './dxaccordion/DxAccordion';
4
4
  import DxAccordionGroup from './dxaccordion/DxAccordionGroup';
5
5
  import DxButton from './dxbutton/DxButton';
6
6
  import DxItemGroup from './dxitemgroup/DxItemGroup';
7
+ import DxCheckbox from './dxitemgroup/DxCheckbox';
7
8
  import DxLabel from './dxlabel/DxLabel';
8
9
  import DxTabbedContent from './dxtabbedcontent/DxTabbedContent';
9
10
  import DxTabPanel from './dxtabbedcontent/DxTabPanel';
10
11
  import DxTextbox from './dxtextbox/DxTextbox';
11
12
  import DxToggle from './dxtoggle/DxToggle';
12
- export { DxAccordion, DxAccordionGroup, DxButton, DxItemGroup, DxLabel, DxTabbedContent, DxTabPanel, DxTextbox, DxToggle };
13
+ export { DxAccordion, DxAccordionGroup, DxButton, DxItemGroup, DxCheckbox, DxLabel, DxTabbedContent, DxTabPanel, DxTextbox, DxToggle };
13
14
  export interface StringChangedCallback {
14
15
  (value: string): void;
15
16
  }
16
17
  export interface BooleanChangedCallback {
17
18
  (value?: boolean): void;
18
19
  }
20
+ export interface CheckedChangedCallback {
21
+ (checked: boolean): void;
22
+ }
19
23
  export interface VoidEventCallback {
20
24
  (): void;
21
25
  }
22
26
  export interface DxItemGroupItem {
23
27
  label: string;
24
28
  value: string;
29
+ disabled?: boolean;
25
30
  }
26
31
  export interface DxItemGroupItemValue {
27
32
  item: DxItemGroupItem;
@@ -36,15 +41,19 @@ export interface ItemGroupChangedCallback {
36
41
  export interface DxToggleProps {
37
42
  isTriState?: boolean;
38
43
  initialValue?: boolean;
44
+ value?: boolean;
39
45
  label?: string;
40
46
  description?: string;
41
47
  trueIcon?: GenesysDevIcons;
42
48
  falseIcon?: GenesysDevIcons;
49
+ disabled?: boolean;
43
50
  onChange?: BooleanChangedCallback;
51
+ className?: string;
44
52
  }
45
53
  export declare type DxTextboxType = 'text' | 'password' | 'email' | 'date' | 'datetime-local' | 'time' | 'integer' | 'decimal';
46
54
  export interface DxTextboxProps {
47
55
  initialValue?: string;
56
+ value?: string;
48
57
  inputType?: DxTextboxType;
49
58
  label?: string;
50
59
  description?: string;
@@ -56,4 +65,33 @@ export interface DxTextboxProps {
56
65
  inputRef?: React.RefObject<HTMLInputElement>;
57
66
  onFocus?: VoidEventCallback;
58
67
  onBlur?: VoidEventCallback;
68
+ disabled?: boolean;
69
+ className?: string;
70
+ }
71
+ export interface DxAccordionProps {
72
+ title: React.ReactNode;
73
+ children: React.ReactNode;
74
+ showOpen?: boolean;
75
+ className?: string;
76
+ }
77
+ export interface DxItemGroupProps {
78
+ title?: string;
79
+ description?: string;
80
+ format: DxItemGroupFormat;
81
+ items: DxItemGroupItem[];
82
+ disabled?: boolean;
83
+ className?: string;
84
+ onItemChanged?: ItemChangedCallback;
85
+ onItemsChanged?: ItemGroupChangedCallback;
86
+ }
87
+ export declare type DxItemGroupFormat = 'checkbox' | 'radio' | 'dropdown' | 'multiselect';
88
+ export interface DxTabbedContentProps {
89
+ children: React.ReactNode;
90
+ initialTabId?: number;
91
+ className?: string;
92
+ }
93
+ export interface DxTabPanelProps {
94
+ title: React.ReactNode;
95
+ children: React.ReactNode;
96
+ className?: string;
59
97
  }
package/build/index.js CHANGED
@@ -29,12 +29,12 @@ function styleInject(css, ref) {
29
29
  }
30
30
  }
31
31
 
32
- var css_248z$c = ".dx-accordion {\n margin: 0;\n}\n.dx-accordion .accordion-heading {\n border-width: 0 0 1px 0;\n border-style: solid;\n border-color: #bfd4e4;\n font-style: normal;\n font-weight: bold;\n font-size: 14px;\n line-height: 14px;\n color: #54565a;\n padding: 13px 20px;\n display: flex;\n flex-flow: row nowrap;\n justify-content: space-between;\n align-items: center;\n cursor: pointer;\n}\n.dx-accordion .accordion-heading .icon {\n line-height: 0;\n}\n.dx-accordion .accordion-content {\n padding: 13px 20px 20px 20px;\n border-bottom: 1px solid #bfd4e4;\n}\n.dx-accordion .accordion-content *:first-child {\n margin-top: 0;\n}\n.dx-accordion .accordion-content *:last-child {\n margin-bottom: 0;\n}";
32
+ var css_248z$c = ".dx-accordion {\n margin: 0;\n}\n.dx-accordion .accordion-heading {\n border-width: 0 0 1px 0;\n border-style: solid;\n border-color: #bfd4e4;\n font-style: normal;\n font-weight: bold;\n font-size: 14px;\n line-height: 14px;\n color: #54565a;\n padding: 13px 20px;\n display: flex;\n flex-flow: row nowrap;\n justify-content: space-between;\n align-items: center;\n cursor: pointer;\n}\n.dx-accordion .accordion-heading .icon {\n line-height: 0;\n}\n.dx-accordion .accordion-content {\n padding: 13px 20px 20px 20px;\n border-bottom: 1px solid #bfd4e4;\n}\n.dx-accordion .accordion-content > *:first-child {\n margin-top: 0;\n}\n.dx-accordion .accordion-content > *:last-child {\n margin-bottom: 0;\n}";
33
33
  styleInject(css_248z$c);
34
34
 
35
35
  function DxAccordion(props) {
36
36
  const [isOpen, setIsOpen] = useState(props.showOpen || false);
37
- return (React.createElement("div", { className: 'dx-accordion' },
37
+ return (React.createElement("div", { className: `dx-accordion${props.className ? ' ' + props.className : ''}` },
38
38
  React.createElement("div", { className: 'accordion-heading', onClick: () => setIsOpen(!isOpen) },
39
39
  props.title,
40
40
  " ",
@@ -46,10 +46,10 @@ var css_248z$b = ".dx-accordion-group {\n margin: 40px 0;\n}";
46
46
  styleInject(css_248z$b);
47
47
 
48
48
  function DxAccordionGroup(props) {
49
- return React.createElement("div", { className: 'dx-accordion-group' }, props.children);
49
+ return React.createElement("div", { className: `dx-accordion-group${props.className ? ' ' + props.className : ''}` }, props.children);
50
50
  }
51
51
 
52
- var css_248z$a = ".dx-button {\n margin: 15px 10px;\n border-radius: 2px;\n padding: 8px 15px;\n cursor: pointer;\n font-weight: 500;\n}\n.dx-button-primary {\n color: #ffffff;\n border: 1px solid #419bb2;\n background-color: #419bb2;\n}\n.dx-button-primary:hover {\n background-color: #317b8d;\n border-color: #317b8d;\n transition: 0.1s;\n}\n.dx-button-primary:focus {\n background-color: #419bb2;\n border-color: #419bb2;\n box-shadow: 0 0 0 2px #aac9ff;\n transition: 0.1s;\n}\n.dx-button-primary:disabled {\n background-color: #9aafb540;\n border-color: #9aafb540;\n transition: 0.1s;\n}\n.dx-button-secondary {\n color: #419bb2;\n border: 1px solid #419bb2;\n background-color: #ffffff;\n}\n.dx-button-secondary:hover {\n color: #317b8d;\n border-color: #317b8d;\n transition: 0.1s;\n}\n.dx-button-secondary:focus {\n color: #419bb2;\n border-color: #419bb2;\n box-shadow: 0 0 0 2px #aac9ff;\n transition: 0.1s;\n}\n.dx-button-secondary:disabled {\n color: #8a9a9e;\n background-color: #e0e6e8;\n border-color: #e0e6e8;\n transition: 0.1s;\n}";
52
+ var css_248z$a = ".dx-button {\n margin: 15px 10px;\n border-radius: 2px;\n padding: 8px 15px;\n cursor: pointer;\n font-weight: 500;\n}\n.dx-button-primary {\n color: #ffffff;\n border: 1px solid #419bb2;\n background-color: #419bb2;\n}\n.dx-button-primary:hover {\n background-color: #317b8d;\n border-color: #317b8d;\n transition: 0.1s;\n}\n.dx-button-primary:focus {\n background-color: #419bb2;\n border-color: #419bb2;\n box-shadow: 0 0 0 2px #aac9ff;\n transition: 0.1s;\n}\n.dx-button-primary:disabled {\n background-color: #9aafb540;\n border-color: #9aafb540;\n transition: 0.1s;\n cursor: not-allowed;\n}\n.dx-button-secondary {\n color: #419bb2;\n border: 1px solid #419bb2;\n background-color: #ffffff;\n}\n.dx-button-secondary:hover {\n color: #317b8d;\n border-color: #317b8d;\n transition: 0.1s;\n}\n.dx-button-secondary:focus {\n color: #419bb2;\n border-color: #419bb2;\n box-shadow: 0 0 0 2px #aac9ff;\n transition: 0.1s;\n}\n.dx-button-secondary:disabled {\n color: #8a9a9e;\n background-color: #e0e6e8;\n border-color: #e0e6e8;\n transition: 0.1s;\n cursor: not-allowed;\n}";
53
53
  styleInject(css_248z$a);
54
54
 
55
55
  function DxButton(props) {
@@ -67,39 +67,56 @@ function DxButton(props) {
67
67
  return (React.createElement("button", { className: classNames.join(' '), type: 'button', onClick: handleClick, disabled: props.disabled === true }, props.children));
68
68
  }
69
69
 
70
- var css_248z$9 = ".dx-item-group {\n display: block;\n border: 0;\n margin: 0;\n padding: 0;\n}\n.dx-item-group label {\n display: flex;\n flex-flow: row nowrap;\n align-items: center;\n margin: 15px 0;\n}\n.dx-item-group label:first-of-type {\n margin-top: 0;\n}\n.dx-item-group label .label-text {\n font-family: Roboto;\n font-style: normal;\n font-weight: normal;\n font-size: 12px;\n line-height: 18px;\n color: #75757a;\n}";
70
+ var css_248z$9 = ".dx-item-group {\n display: block;\n border: 0;\n margin: 0;\n padding: 0;\n}";
71
71
  styleInject(css_248z$9);
72
72
 
73
- var css_248z$8 = ".dx-item-group input[type=checkbox] {\n -webkit-appearance: none;\n appearance: none;\n margin: 0 8px 0 0;\n width: 16px;\n height: 16px;\n border: 1px solid #8a96a3;\n border-radius: 2px;\n background-color: #ffffff;\n flex-shrink: 0;\n}\n.dx-item-group input[type=checkbox]::before {\n display: none;\n}\n.dx-item-group input[type=checkbox]:checked {\n background-color: #8a96a3;\n}\n.dx-item-group input[type=checkbox]:checked::before {\n display: block;\n position: relative;\n top: 7px;\n left: 3px;\n font-size: 9px;\n line-height: 0;\n color: #ffffff;\n content: \"\\f103\";\n font-family: genesys-dev-icons !important;\n font-style: normal;\n font-weight: normal !important;\n font-feature-settings: normal;\n font-variant: normal;\n text-transform: none;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n.dx-item-group input[type=checkbox]:not(:disabled):hover {\n border-color: #4d5061;\n}\n.dx-item-group input[type=checkbox]:not(:disabled):focus {\n outline: #aac9ff solid 2px;\n}\n.dx-item-group input[type=checkbox]:not(:disabled):focus-visible {\n outline: 0;\n}";
73
+ var css_248z$8 = "";
74
74
  styleInject(css_248z$8);
75
75
 
76
- var css_248z$7 = ".dx-item-group input[type=radio] {\n -webkit-appearance: none;\n appearance: none;\n margin: 0 8px 0 0;\n width: 16px;\n height: 16px;\n border: 1px solid #8a96a3;\n border-radius: 8px;\n background-color: #ffffff;\n flex-shrink: 0;\n}\n.dx-item-group input[type=radio]::before {\n display: none;\n}\n.dx-item-group input[type=radio]:checked::before {\n content: \"\";\n display: block;\n width: 10px;\n height: 10px;\n border-radius: 8px;\n position: relative;\n top: 2px;\n left: 2px;\n background-color: #8a96a3;\n}\n.dx-item-group input[type=radio]:not(:disabled):hover {\n border-color: #4d5061;\n}\n.dx-item-group input[type=radio]:not(:disabled):focus {\n outline: #aac9ff solid 2px;\n}\n.dx-item-group input[type=radio]:not(:disabled):focus-visible {\n outline: 0;\n}";
76
+ var css_248z$7 = ".dx-select-group {\n appearance: none;\n position: relative;\n}\n.dx-select-group select {\n border: 1px solid #8a96a3;\n border-radius: 2px;\n background-color: #ffffff;\n font-style: normal;\n font-weight: 300;\n font-size: 12px;\n line-height: 14px;\n color: #75757a;\n padding: 8px 32px 8px 12px;\n width: 100%;\n appearance: none;\n}\n.dx-select-group select:focus-visible {\n outline: 2px solid #aac9ff;\n}\n.dx-select-group::after {\n position: absolute;\n bottom: 12px;\n right: 12px;\n content: \"\\f104\";\n font-size: 8px;\n font-family: genesys-dev-icons !important;\n font-style: normal;\n font-weight: normal !important;\n font-feature-settings: normal;\n font-variant: normal;\n text-transform: none;\n line-height: 1;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n pointer-events: none;\n}\n.dx-select-group.disabled::after {\n color: #8a9a9e;\n}\n.dx-select-group.disabled select:disabled {\n background-color: #e6ebec;\n border-color: #e8eaed;\n color: #8a9a9e;\n cursor: not-allowed;\n}";
77
77
  styleInject(css_248z$7);
78
78
 
79
- var css_248z$6 = ".dx-select-group {\n appearance: none;\n position: relative;\n}\n.dx-select-group select {\n border: 1px solid #8a96a3;\n border-radius: 2px;\n background-color: #ffffff;\n font-style: normal;\n font-weight: 300;\n font-size: 12px;\n line-height: 14px;\n color: #75757a;\n padding: 8px 32px 8px 12px;\n width: 100%;\n appearance: none;\n}\n.dx-select-group select:focus-visible {\n outline: 2px solid #aac9ff;\n}\n.dx-select-group select option {\n background: #aac9ff -webkit-linear-gradient(bottom, #aac9ff 0%, #aac9ff 100%);\n}\n.dx-select-group::after {\n position: absolute;\n bottom: 12px;\n right: 12px;\n content: \"\\f104\";\n font-size: 8px;\n font-family: genesys-dev-icons !important;\n font-style: normal;\n font-weight: normal !important;\n font-feature-settings: normal;\n font-variant: normal;\n text-transform: none;\n line-height: 1;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n pointer-events: none;\n}";
79
+ var css_248z$6 = ".dx-multiselect-group {\n appearance: none;\n position: relative;\n}\n.dx-multiselect-group select {\n border: 1px solid #8a96a3;\n border-radius: 2px;\n background-color: #ffffff;\n font-style: normal;\n font-weight: 300;\n font-size: 12px;\n line-height: 14px;\n color: #75757a;\n width: 100%;\n appearance: none;\n scrollbar-color: #b0b2b5 transparent;\n}\n.dx-multiselect-group select:focus-visible {\n outline: 2px solid #aac9ff;\n}\n.dx-multiselect-group select option {\n overflow: hidden;\n white-space: pre;\n text-overflow: ellipsis;\n -webkit-appearance: none;\n font-style: normal;\n font-weight: 300;\n font-size: 12px;\n line-height: 31px;\n padding: 8px 12px;\n color: #75757a;\n}\n.dx-multiselect-group select option:checked {\n background: #aac9ff -webkit-linear-gradient(bottom, #aac9ff 0%, #aac9ff 100%);\n}\n.dx-multiselect-group select option:disabled {\n color: #8a9a9e;\n cursor: not-allowed;\n}\n.dx-multiselect-group select::-webkit-scrollbar {\n -webkit-appearance: none;\n width: 7px;\n height: 7px;\n}\n.dx-multiselect-group select::-webkit-scrollbar-thumb {\n border-radius: 4px;\n background-color: #b0b2b5;\n}\n.dx-multiselect-group select::-webkit-scrollbar-corner {\n background: transparent;\n}\n.dx-multiselect-group.disabled select:disabled {\n background-color: #e6ebec;\n border-color: #e8eaed;\n cursor: not-allowed;\n}\n.dx-multiselect-group.disabled select:disabled option {\n color: #8a9a9e;\n}";
80
80
  styleInject(css_248z$6);
81
81
 
82
- var css_248z$5 = ".dx-multiselect-group {\n appearance: none;\n position: relative;\n}\n.dx-multiselect-group select {\n border: 1px solid #8a96a3;\n border-radius: 2px;\n background-color: #ffffff;\n font-style: normal;\n font-weight: 300;\n font-size: 12px;\n line-height: 14px;\n color: #75757a;\n width: 100%;\n appearance: none;\n scrollbar-color: #b0b2b5 transparent;\n}\n.dx-multiselect-group select:focus-visible {\n outline: 2px solid #aac9ff;\n}\n.dx-multiselect-group select option {\n overflow: hidden;\n white-space: pre;\n text-overflow: ellipsis;\n -webkit-appearance: none;\n font-style: normal;\n font-weight: 300;\n font-size: 12px;\n line-height: 31px;\n padding: 8px 12px;\n color: #75757a;\n}\n.dx-multiselect-group select option:checked {\n background: #aac9ff -webkit-linear-gradient(bottom, #aac9ff 0%, #aac9ff 100%);\n}\n.dx-multiselect-group select::-webkit-scrollbar {\n -webkit-appearance: none;\n width: 7px;\n height: 7px;\n}\n.dx-multiselect-group select::-webkit-scrollbar-thumb {\n border-radius: 4px;\n background-color: #b0b2b5;\n}\n.dx-multiselect-group select::-webkit-scrollbar-corner {\n background: transparent;\n}";
82
+ var css_248z$5 = ".dx-label {\n margin: 20px 0;\n display: block;\n}\n.dx-label .label-text,\n.dx-label .input-description {\n display: block;\n font-family: Roboto;\n font-style: normal;\n font-weight: 400;\n font-size: 12px;\n line-height: 14px;\n color: #75757a;\n}\n.dx-label .label-text {\n margin: 0 0 4px 0;\n}\n.dx-label .input-description {\n padding: 6px 20px;\n display: flex;\n flex-flow: row nowrap;\n gap: 8px;\n}\n.dx-label .input-description .icon {\n color: #597393;\n line-height: 0;\n}";
83
83
  styleInject(css_248z$5);
84
84
 
85
- var css_248z$4 = ".dx-label {\n margin: 20px 0;\n display: block;\n}\n.dx-label .label-text,\n.dx-label .input-description {\n display: block;\n font-family: Roboto;\n font-style: normal;\n font-weight: 400;\n font-size: 12px;\n line-height: 14px;\n color: #75757a;\n}\n.dx-label .label-text {\n margin: 0 0 4px 0;\n}\n.dx-label .input-description {\n padding: 6px 20px;\n display: flex;\n flex-flow: row nowrap;\n gap: 8px;\n}\n.dx-label .input-description .icon {\n color: #597393;\n line-height: 0;\n}";
86
- styleInject(css_248z$4);
87
-
88
85
  function DxLabel(props) {
89
86
  const hasLabel = props.label && props.label !== '';
90
87
  const description = props.description ? (React.createElement("div", { className: 'input-description' },
91
88
  React.createElement(GenesysDevIcon, { icon: GenesysDevIcons.AppInfoSolid }),
92
89
  React.createElement("span", null, props.description))) : undefined;
93
- if (props.useFieldset) {
94
- return (React.createElement("fieldset", { className: 'dx-label ' + props.className || '' },
95
- props.label ? React.createElement("legend", { className: 'label-text' }, props.label) : undefined,
96
- props.children,
97
- description));
98
- }
99
- return (React.createElement("label", { className: 'dx-label ' + props.className || '' },
90
+ const contents = (React.createElement(React.Fragment, null,
91
+ ' ',
100
92
  hasLabel ? React.createElement("span", { className: 'label-text' }, props.label) : undefined,
101
93
  props.children,
102
94
  description));
95
+ const className = `dx-label${props.className ? ' ' + props.className : ''}`;
96
+ if (props.useFieldset) {
97
+ return React.createElement("fieldset", { className: className }, contents);
98
+ }
99
+ return React.createElement("label", { className: className }, contents);
100
+ }
101
+
102
+ var css_248z$4 = ".dx-checkbox {\n display: flex;\n flex-flow: row nowrap;\n align-items: center;\n margin: 15px 0;\n}\n.dx-checkbox:first-of-type {\n margin-top: 0;\n}\n.dx-checkbox .label-text {\n font-family: Roboto;\n font-style: normal;\n font-weight: normal;\n font-size: 12px;\n line-height: 18px;\n color: #75757a;\n}\n.dx-checkbox input[type=checkbox] {\n -webkit-appearance: none;\n appearance: none;\n margin: 0 8px 0 0;\n width: 16px;\n height: 16px;\n border: 1px solid #8a96a3;\n border-radius: 2px;\n background-color: #ffffff;\n flex-shrink: 0;\n}\n.dx-checkbox input[type=checkbox]::before {\n display: none;\n}\n.dx-checkbox input[type=checkbox]:checked {\n background-color: #8a96a3;\n}\n.dx-checkbox input[type=checkbox]:checked::before {\n display: block;\n position: relative;\n top: 7px;\n left: 3px;\n font-size: 9px;\n line-height: 0;\n color: #ffffff;\n content: \"\\f103\";\n font-family: genesys-dev-icons !important;\n font-style: normal;\n font-weight: normal !important;\n font-feature-settings: normal;\n font-variant: normal;\n text-transform: none;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n.dx-checkbox input[type=checkbox]:not(:disabled):hover {\n border-color: #4d5061;\n}\n.dx-checkbox input[type=checkbox]:not(:disabled):focus {\n outline: #aac9ff solid 2px;\n}\n.dx-checkbox input[type=checkbox]:not(:disabled):focus-visible {\n outline: 0;\n}\n.dx-checkbox input[type=radio] {\n -webkit-appearance: none;\n appearance: none;\n margin: 0 8px 0 0;\n width: 16px;\n height: 16px;\n border: 1px solid #8a96a3;\n border-radius: 8px;\n background-color: #ffffff;\n flex-shrink: 0;\n}\n.dx-checkbox input[type=radio]::before {\n display: none;\n}\n.dx-checkbox input[type=radio]:checked::before {\n content: \"\";\n display: block;\n width: 10px;\n height: 10px;\n border-radius: 8px;\n position: relative;\n top: 2px;\n left: 2px;\n background-color: #8a96a3;\n}\n.dx-checkbox input[type=radio]:not(:disabled):hover {\n border-color: #4d5061;\n}\n.dx-checkbox input[type=radio]:not(:disabled):focus {\n outline: #aac9ff solid 2px;\n}\n.dx-checkbox input[type=radio]:not(:disabled):focus-visible {\n outline: 0;\n}\n.dx-checkbox.disabled {\n cursor: not-allowed;\n}\n.dx-checkbox.disabled input {\n border-color: #e8eaed;\n cursor: not-allowed;\n}\n.dx-checkbox.disabled input:checked {\n background-color: #e8eaed;\n cursor: not-allowed;\n}\n\n.dx-label .dx-checkbox .label-text {\n margin: 0;\n}";
103
+ styleInject(css_248z$4);
104
+
105
+ function DxCheckbox(props) {
106
+ let initialValue = props.checked !== undefined ? props.checked : props.initiallyChecked || false;
107
+ const [checked, setChecked] = useState(initialValue);
108
+ useEffect(() => {
109
+ if (props.checked === undefined || props.checked === checked)
110
+ return;
111
+ setChecked(props.checked);
112
+ }, [props.checked]);
113
+ useEffect(() => {
114
+ if (props.onCheckChanged)
115
+ props.onCheckChanged(checked);
116
+ }, [checked]);
117
+ return (React.createElement("label", { className: `dx-checkbox${props.className ? ' ' + props.className : ''}${props.disabled ? ' disabled' : ''}` },
118
+ React.createElement("input", { type: props.useRadioType ? 'radio' : 'checkbox', name: props.name, id: props.label, value: props.itemValue, checked: checked, onChange: (e) => setChecked(e.target.checked), disabled: props.disabled === true }),
119
+ React.createElement("span", { className: 'label-text' }, props.label)));
103
120
  }
104
121
 
105
122
  function DxItemGroup(props) {
@@ -107,42 +124,74 @@ function DxItemGroup(props) {
107
124
  return { item, isSelected: false };
108
125
  }));
109
126
  const [id] = useState(v4());
127
+ const [title, setTitle] = useState(props.title);
128
+ const [description, setDescription] = useState(props.description);
129
+ const [format, setFormat] = useState(props.format);
130
+ const [items, setItems] = useState(props.items);
131
+ const [disabled, setDisabled] = useState(props.disabled);
132
+ const [className, setClassName] = useState(props.className);
110
133
  // data changed
111
134
  useEffect(() => {
112
135
  if (props.onItemsChanged)
113
136
  props.onItemsChanged(data);
114
137
  // eslint-disable-next-line react-hooks/exhaustive-deps
115
138
  }, [data]);
116
- // Handle checkbox changed
117
- const onChange = (idx, item, e) => {
139
+ // Recalculate on props changed
140
+ useEffect(() => {
141
+ setTitle(props.title);
142
+ setDescription(props.description);
143
+ setFormat(props.format);
144
+ setItems(props.items);
145
+ setDisabled(props.disabled);
146
+ setClassName(props.className);
147
+ setData(props.items.map((item) => {
148
+ return { item, isSelected: false };
149
+ }));
150
+ }, [props.title, props.description, props.format, props.items, props.disabled, props.className]);
151
+ // Handle individual item changed
152
+ const itemChanged = (idx, item, checked) => {
118
153
  if (props.onItemChanged)
119
- props.onItemChanged(item, e.target.checked);
154
+ props.onItemChanged(item, checked);
120
155
  let newData = [...data];
121
156
  // Unselect everything if it's radio buttons
122
- if (props.format === 'radio')
157
+ if (format === 'radio')
123
158
  newData.forEach((value) => (value.isSelected = false));
124
159
  // Set the selected state of the new item
125
- newData[idx].isSelected = e.target.checked;
160
+ newData[idx].isSelected = checked;
126
161
  setData(newData);
127
162
  };
128
- switch (props.format) {
163
+ const selectChanged = (e) => {
164
+ const options = e.target.options;
165
+ let newData = [...data];
166
+ // Assign selected value for each item in the list
167
+ for (let i = 0; i < options.length; i++) {
168
+ const thisItem = newData.find((value) => value.item.value === options[i].value);
169
+ thisItem.isSelected = options[i].selected;
170
+ }
171
+ // Update entire data list
172
+ setData(newData);
173
+ // Trigger individual update
174
+ const changedItemIdx = newData.findIndex((value) => value.item.value === e.target.value);
175
+ if (changedItemIdx >= 0)
176
+ itemChanged(changedItemIdx, newData[changedItemIdx].item, newData[changedItemIdx].isSelected);
177
+ };
178
+ switch (format) {
129
179
  case 'multiselect':
130
180
  case 'dropdown': {
131
- return (React.createElement(DxLabel, { label: props.title, description: props.description },
132
- React.createElement("div", { className: `dx-item-group${props.format === 'multiselect' ? ' dx-multiselect-group' : ' dx-select-group'}` },
133
- React.createElement("select", { multiple: props.format === 'multiselect' }, data.map((d, i) => (React.createElement("option", { key: i, value: d.item.value }, d.item.label)))))));
181
+ const isMulti = format === 'multiselect';
182
+ return (React.createElement(DxLabel, { label: title, description: description, className: className },
183
+ React.createElement("div", { className: `dx-item-group${isMulti ? ' dx-multiselect-group' : ' dx-select-group'}${disabled ? ' disabled' : ''}` },
184
+ React.createElement("select", { multiple: isMulti, disabled: disabled === true, onChange: (e) => selectChanged(e) }, data.map((d, i) => (React.createElement("option", { key: i, value: d.item.value, disabled: d.item.disabled }, d.item.label)))))));
134
185
  }
135
186
  case 'checkbox':
136
187
  case 'radio':
137
188
  default: {
138
- return (React.createElement(DxLabel, { label: props.title, description: props.description, className: 'dx-item-group', useFieldset: true }, data.map((d, i) => (React.createElement("label", { key: i },
139
- React.createElement("input", { type: props.format, name: props.format === 'checkbox' ? `${id}-${i}` : id, id: d.item.label, value: d.item.value, checked: d.isSelected, onChange: (e) => onChange(i, d.item, e) }),
140
- React.createElement("span", { className: 'label-text' }, d.item.label))))));
189
+ return (React.createElement(DxLabel, { label: title, description: description, className: `dx-item-group${disabled ? ' disabled' : ''}${className ? ' ' + className : ''}`, useFieldset: true }, data.map((d, i) => (React.createElement(DxCheckbox, { key: d.item.value, name: format === 'checkbox' ? `${id}-${d.item.value}` : id, label: d.item.label, itemValue: d.item.value, initiallyChecked: d.isSelected, onCheckChanged: (checked) => itemChanged(i, d.item, checked), useRadioType: format === 'radio', disabled: disabled || d.item.disabled })))));
141
190
  }
142
191
  }
143
192
  }
144
193
 
145
- var css_248z$3 = ".dx-tabbed-content {\n margin: 40px 0;\n}\n.dx-tabbed-content .tab-titles {\n border-bottom: 1px solid #bfd4e4;\n font-weight: normal;\n font-size: 14px;\n line-height: 20px;\n}\n.dx-tabbed-content .tab-titles .tab-title {\n display: inline-block;\n padding: 5px 20px;\n border-bottom: 1px solid transparent;\n cursor: pointer;\n}\n.dx-tabbed-content .tab-titles .tab-title.active {\n border-bottom-color: #597393;\n font-weight: bold;\n}\n.dx-tabbed-content .tab-titles .tab-title p {\n margin: 0;\n display: inline;\n}\n.dx-tabbed-content .tab-content {\n padding: 13px 20px 20px 20px;\n border-bottom: 1px solid #bfd4e4;\n}\n.dx-tabbed-content .tab-content *:first-child {\n margin-top: 0;\n}\n.dx-tabbed-content .tab-content *:last-child {\n margin-bottom: 0;\n}";
194
+ var css_248z$3 = ".dx-tabbed-content {\n margin: 40px 0;\n}\n.dx-tabbed-content .tab-titles {\n border-bottom: 1px solid #bfd4e4;\n font-weight: normal;\n font-size: 14px;\n line-height: 20px;\n}\n.dx-tabbed-content .tab-titles .tab-title {\n display: inline-block;\n padding: 5px 20px;\n border-bottom: 1px solid transparent;\n cursor: pointer;\n}\n.dx-tabbed-content .tab-titles .tab-title:hover {\n border-color: #bfd4e4;\n}\n.dx-tabbed-content .tab-titles .tab-title.active {\n border-bottom-color: #597393;\n font-weight: bold;\n}\n.dx-tabbed-content .tab-titles .tab-title p {\n margin: 0;\n display: inline;\n}\n.dx-tabbed-content .tab-content {\n padding: 13px 20px 20px 20px;\n border-bottom: 1px solid #bfd4e4;\n}\n.dx-tabbed-content .tab-content > *:first-child {\n margin-top: 0;\n}\n.dx-tabbed-content .tab-content > *:last-child {\n margin-bottom: 0;\n}";
146
195
  styleInject(css_248z$3);
147
196
 
148
197
  function DxTabbedContent(props) {
@@ -154,7 +203,7 @@ function DxTabbedContent(props) {
154
203
  return 'Unknown title';
155
204
  return child.props.title;
156
205
  }));
157
- return (React.createElement("div", { className: 'dx-tabbed-content' },
206
+ return (React.createElement("div", { className: `dx-tabbed-content${props.className ? ' ' + props.className : ''}` },
158
207
  React.createElement("div", { className: 'tab-titles' }, titles.map((title, i) => (React.createElement("span", { key: i, className: `tab-title${i === activeTab ? ' active' : ''}`, onClick: () => setActiveTab(i) }, title)))),
159
208
  React.createElement("div", { className: 'tab-content' }, React.Children.toArray(props.children)[activeTab])));
160
209
  }
@@ -163,15 +212,15 @@ var css_248z$2 = "";
163
212
  styleInject(css_248z$2);
164
213
 
165
214
  function DxTabPanel(props) {
166
- return React.createElement("div", { className: 'dx-tab-panel' }, props.children);
215
+ return React.createElement("div", { className: `dx-tab-panel${props.className ? ' ' + props.className : ''}` }, props.children);
167
216
  }
168
217
 
169
- var css_248z$1 = ".dx-textbox {\n display: flex;\n flex-flow: row nowrap;\n justify-content: space-between;\n align-items: center;\n gap: 10px;\n border: 1px solid #c6cbd1;\n border-radius: 2px;\n margin: 0;\n padding: 0 10px;\n height: 32px;\n}\n.dx-textbox.with-label {\n margin-top: 0;\n}\n.dx-textbox:focus-within {\n outline: #aac9ff solid 2px;\n}\n.dx-textbox .icon {\n display: block;\n flex: none;\n color: #75757a;\n}\n.dx-textbox .icon.input-icon {\n font-size: 14px;\n line-height: 0;\n}\n.dx-textbox .icon.clear-icon {\n font-size: 11px;\n line-height: 0;\n cursor: pointer;\n padding: 4px;\n margin-right: -4px;\n}\n.dx-textbox input {\n flex-grow: 1;\n border: 0;\n background: #ffffff;\n box-sizing: border-box;\n height: 32px;\n width: 100%;\n padding: 0;\n margin: 0;\n font-family: Roboto;\n font-style: normal;\n font-weight: normal;\n font-size: 14px;\n line-height: 16px;\n color: #272d2d;\n}\n.dx-textbox input:focus-visible {\n outline: 0;\n}\n.dx-textbox input::placeholder {\n font-family: Roboto;\n font-style: normal;\n font-weight: 300;\n font-size: 14px;\n line-height: 16px;\n color: #757576;\n}";
218
+ var css_248z$1 = ".dx-textbox {\n display: flex;\n flex-flow: row nowrap;\n justify-content: space-between;\n align-items: center;\n gap: 10px;\n border: 1px solid #c6cbd1;\n border-radius: 2px;\n margin: 0;\n padding: 0 10px;\n height: 32px;\n background-color: #ffffff;\n}\n.dx-textbox.with-label {\n margin-top: 0;\n}\n.dx-textbox:focus-within {\n outline: #aac9ff solid 2px;\n}\n.dx-textbox .icon {\n display: block;\n flex: none;\n color: #75757a;\n}\n.dx-textbox .icon.input-icon {\n font-size: 14px;\n line-height: 0;\n}\n.dx-textbox .icon.clear-icon {\n font-size: 11px;\n line-height: 0;\n cursor: pointer;\n padding: 4px;\n margin-right: -4px;\n}\n.dx-textbox input {\n flex-grow: 1;\n border: 0;\n background: transparent;\n box-sizing: border-box;\n height: 32px;\n width: 100%;\n padding: 0;\n margin: 0;\n font-family: Roboto;\n font-style: normal;\n font-weight: normal;\n font-size: 14px;\n line-height: 16px;\n color: #272d2d;\n}\n.dx-textbox input:focus-visible {\n outline: 0;\n}\n.dx-textbox input::placeholder {\n font-style: normal;\n font-weight: 300;\n font-size: 14px;\n line-height: 16px;\n color: #757576;\n}\n.dx-textbox.disabled {\n background-color: #e6ebec;\n border-color: #e8eaed;\n cursor: not-allowed;\n}\n.dx-textbox.disabled input {\n cursor: not-allowed;\n color: #75757a;\n}\n.dx-textbox.disabled .icon,\n.dx-textbox.disabled input::placeholder {\n color: #ffffff;\n}";
170
219
  styleInject(css_248z$1);
171
220
 
172
221
  function DxTextbox(props) {
173
222
  const [debounceMs, setDebounceMs] = useState(props.changeDebounceMs || 300);
174
- const [value, setValue] = useState(props.initialValue || '');
223
+ const [value, setValue] = useState(props.initialValue || props.value || '');
175
224
  const [isFocused, setIsFocused] = useState(false);
176
225
  const [escapePressed, setEscapePressed] = useState(Date.now());
177
226
  const [step, setStep] = useState(undefined);
@@ -184,6 +233,10 @@ function DxTextbox(props) {
184
233
  document.removeEventListener('keydown', globalKeyBindings, false);
185
234
  };
186
235
  }, []);
236
+ // Value prop updated
237
+ useEffect(() => {
238
+ setValue(props.value || '');
239
+ }, [props.value]);
187
240
  // Escape pressed
188
241
  useEffect(() => {
189
242
  var _a;
@@ -244,7 +297,7 @@ function DxTextbox(props) {
244
297
  if (inputType === 'integer' || inputType === 'decimal')
245
298
  inputType = 'number';
246
299
  // TODO: handle props.inputType
247
- let component = (React.createElement("div", { className: `dx-textbox${hasLabel ? ' with-label' : ''}`, style: {} },
300
+ let component = (React.createElement("div", { className: `dx-textbox${hasLabel ? ' with-label' : ''}${props.disabled ? ' disabled' : ''}`, style: {} },
248
301
  props.icon ? React.createElement(GenesysDevIcon, { icon: props.icon, className: 'input-icon' }) : undefined,
249
302
  React.createElement("input", { className: 'dx-input', type: inputType, step: step, value: value, placeholder: props.placeholder, onChange: (e) => setValue(e.target.value), ref: inputRef, onFocus: () => {
250
303
  setIsFocused(true);
@@ -254,25 +307,35 @@ function DxTextbox(props) {
254
307
  setIsFocused(false);
255
308
  if (props.onBlur)
256
309
  props.onBlur();
257
- } }),
258
- props.clearButton && (value || isFocused) ? (React.createElement(GenesysDevIcon, { icon: GenesysDevIcons.AppTimes, className: 'clear-icon', onClick: () => setValue('') })) : undefined));
310
+ }, disabled: props.disabled === true }),
311
+ props.clearButton && (value || isFocused) && !props.disabled ? (React.createElement(GenesysDevIcon, { icon: GenesysDevIcons.AppTimes, className: 'clear-icon', onClick: () => setValue('') })) : undefined));
259
312
  // Render
260
- return (React.createElement(DxLabel, { label: props.label, description: props.description }, component));
313
+ return (React.createElement(DxLabel, { label: props.label, description: props.description, className: props.className }, component));
261
314
  }
262
315
 
263
- var css_248z = ".dx-toggle-container {\n display: inline-block;\n}\n.dx-toggle-container .dx-toggle {\n background: #f5f8fb;\n border: 1px solid #c6cbd1;\n border-radius: 6px;\n height: 26px;\n padding: 0px 4px;\n display: flex;\n flex-flow: row nowrap;\n justify-content: space-between;\n align-items: center;\n gap: 2px;\n cursor: pointer;\n}\n.dx-toggle-container .dx-toggle:hover .slider {\n border-color: #aac9ff;\n}\n.dx-toggle-container .dx-toggle .icon {\n font-size: 10px;\n line-height: 0;\n margin: 0 5px;\n color: #c4c4c4;\n}\n.dx-toggle-container .dx-toggle .clear-placeholder {\n width: 19px;\n padding: 0 1px 0 0;\n margin: 0;\n display: block;\n}\n.dx-toggle-container .dx-toggle .slider {\n height: 22px;\n width: 22px;\n border-radius: 22px;\n background-color: #419bb2;\n box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.25);\n display: flex;\n align-items: center;\n justify-content: center;\n border: 1px solid transparent;\n}\n.dx-toggle-container .dx-toggle .slider .icon {\n font-size: 10px;\n line-height: 0;\n color: #ffffff;\n padding: 0;\n margin: 0;\n}";
316
+ var css_248z = ".dx-toggle-container {\n display: inline-block;\n}\n.dx-toggle-container .dx-toggle {\n background: #f5f8fb;\n border: 1px solid #c6cbd1;\n border-radius: 6px;\n height: 26px;\n padding: 0px 4px;\n display: flex;\n flex-flow: row nowrap;\n justify-content: space-between;\n align-items: center;\n gap: 2px;\n cursor: pointer;\n}\n.dx-toggle-container .dx-toggle:hover .slider {\n border-color: #aac9ff;\n}\n.dx-toggle-container .dx-toggle .icon {\n font-size: 10px;\n line-height: 0;\n margin: 0 5px;\n color: #c4c4c4;\n}\n.dx-toggle-container .dx-toggle .clear-placeholder {\n width: 19px;\n padding: 0 1px 0 0;\n margin: 0;\n display: block;\n}\n.dx-toggle-container .dx-toggle .slider {\n height: 22px;\n width: 22px;\n border-radius: 22px;\n background-color: #419bb2;\n box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.25);\n display: flex;\n align-items: center;\n justify-content: center;\n border: 1px solid transparent;\n}\n.dx-toggle-container .dx-toggle .slider .icon {\n font-size: 10px;\n line-height: 0;\n color: #ffffff;\n padding: 0;\n margin: 0;\n}\n.dx-toggle-container.disabled .dx-toggle {\n border-color: #e8eaed;\n color: #ffffff;\n cursor: not-allowed;\n}\n.dx-toggle-container.disabled .dx-toggle:hover .slider {\n border-color: transparent;\n}\n.dx-toggle-container.disabled .dx-toggle .slider {\n color: #8a9a9e;\n background-color: #e0e6e8;\n}";
264
317
  styleInject(css_248z);
265
318
 
266
319
  function DxToggle(props) {
267
- const [value, setValue] = useState(props.isTriState ? props.initialValue : props.initialValue || false);
320
+ let initialValue = props.value !== undefined ? props.value : props.initialValue;
321
+ if (!props.isTriState)
322
+ initialValue = initialValue || false;
323
+ const [value, setValue] = useState(initialValue);
268
324
  const trueIcon = props.trueIcon || GenesysDevIcons.AppCheck;
269
325
  const falseIcon = props.falseIcon || GenesysDevIcons.AppTimes;
326
+ useEffect(() => {
327
+ if (props.initialValue || props.value === value || (!props.isTriState && props.value === undefined))
328
+ return;
329
+ setValue(props.value);
330
+ }, [props.value]);
270
331
  useEffect(() => {
271
332
  if (props.onChange)
272
333
  props.onChange(value);
273
334
  // eslint-disable-next-line react-hooks/exhaustive-deps
274
335
  }, [value]);
275
336
  const toggleValue = () => {
337
+ if (props.disabled)
338
+ return;
276
339
  if (props.isTriState) {
277
340
  if (value === undefined)
278
341
  setValue(true);
@@ -285,8 +348,8 @@ function DxToggle(props) {
285
348
  setValue(!value);
286
349
  }
287
350
  };
288
- return (React.createElement(DxLabel, { label: props.label, description: props.description },
289
- React.createElement("div", { className: 'dx-toggle-container' },
351
+ return (React.createElement(DxLabel, { label: props.label, description: props.description, className: props.className },
352
+ React.createElement("div", { className: `dx-toggle-container${props.disabled ? ' disabled' : ''}` },
290
353
  React.createElement("div", { className: 'dx-toggle', onClick: toggleValue },
291
354
  value !== false ? React.createElement(GenesysDevIcon, { icon: falseIcon }) : undefined,
292
355
  value === true && props.isTriState ? React.createElement("div", { className: 'clear-placeholder' }, "\u00A0") : undefined,
@@ -295,5 +358,5 @@ function DxToggle(props) {
295
358
  value !== true ? React.createElement(GenesysDevIcon, { icon: trueIcon }) : undefined))));
296
359
  }
297
360
 
298
- export { DxAccordion, DxAccordionGroup, DxButton, DxItemGroup, DxLabel, DxTabPanel, DxTabbedContent, DxTextbox, DxToggle };
361
+ export { DxAccordion, DxAccordionGroup, DxButton, DxCheckbox, DxItemGroup, DxLabel, DxTabPanel, DxTabbedContent, DxTextbox, DxToggle };
299
362
  //# sourceMappingURL=index.js.map
package/build/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../node_modules/style-inject/dist/style-inject.es.js","../src/dxaccordion/DxAccordion.tsx","../src/dxaccordion/DxAccordionGroup.tsx","../src/dxbutton/DxButton.tsx","../src/dxlabel/DxLabel.tsx","../src/dxitemgroup/DxItemGroup.tsx","../src/dxtabbedcontent/DxTabbedContent.tsx","../src/dxtabbedcontent/DxTabPanel.tsx","../src/dxtextbox/DxTextbox.tsx","../src/dxtoggle/DxToggle.tsx"],"sourcesContent":["function styleInject(css, ref) {\n if ( ref === void 0 ) ref = {};\n var insertAt = ref.insertAt;\n\n if (!css || typeof document === 'undefined') { return; }\n\n var head = document.head || document.getElementsByTagName('head')[0];\n var style = document.createElement('style');\n style.type = 'text/css';\n\n if (insertAt === 'top') {\n if (head.firstChild) {\n head.insertBefore(style, head.firstChild);\n } else {\n head.appendChild(style);\n }\n } else {\n head.appendChild(style);\n }\n\n if (style.styleSheet) {\n style.styleSheet.cssText = css;\n } else {\n style.appendChild(document.createTextNode(css));\n }\n}\n\nexport default styleInject;\n","import { GenesysDevIcon, GenesysDevIcons } from 'genesys-dev-icons';\nimport React, { useState } from 'react';\n\nimport './DxAccordion.scss';\n\ninterface IProps {\n\ttitle: React.ReactNode;\n\tchildren: React.ReactNode;\n\tshowOpen?: boolean;\n}\n\nexport default function DxAccordion(props: IProps) {\n\tconst [isOpen, setIsOpen] = useState(props.showOpen || false);\n\n\treturn (\n\t\t<div className='dx-accordion'>\n\t\t\t<div className='accordion-heading' onClick={() => setIsOpen(!isOpen)}>\n\t\t\t\t{props.title} <GenesysDevIcon icon={isOpen ? GenesysDevIcons.AppChevronUp : GenesysDevIcons.AppChevronDown} />\n\t\t\t</div>\n\t\t\t{isOpen ? <div className='accordion-content'>{props.children}</div> : undefined}\n\t\t</div>\n\t);\n}\n","import React from 'react';\n\nimport './DxAccordionGroup.scss';\n\ninterface IProps {\n\tchildren: React.ReactNode;\n}\n\nexport default function DxAccordionGroup(props: IProps) {\n\treturn <div className='dx-accordion-group'>{props.children}</div>;\n}\n","import React from 'react';\nimport { VoidEventCallback } from '..';\n\nimport './DxButton.scss';\n\ninterface IProps {\n\ttype?: 'primary' | 'secondary';\n\tdisabled?: boolean;\n\tchildren?: React.ReactNode;\n\tclassName?: string;\n\tonClick?: VoidEventCallback;\n}\n\nexport default function DxButton(props: IProps) {\n\tlet classNames = ['dx-button'];\n\tclassNames.push(`dx-button-${props.type || 'primary'}`);\n\tif (props.className) classNames.push(props.className);\n\n\tconst handleClick = (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n\t\tif (!props.onClick) return;\n\t\te.preventDefault();\n\t\te.stopPropagation();\n\t\tprops.onClick();\n\t};\n\n\treturn (\n\t\t<button className={classNames.join(' ')} type='button' onClick={handleClick} disabled={props.disabled === true}>\n\t\t\t{props.children}\n\t\t</button>\n\t);\n}\n","import { GenesysDevIcon, GenesysDevIcons } from 'genesys-dev-icons';\nimport React from 'react';\n\nimport './DxLabel.scss';\n\ninterface IProps {\n\tlabel?: string;\n\tdescription?: string;\n\tuseFieldset?: boolean;\n\tclassName?: string;\n\tchildren: React.ReactNode;\n}\n\nexport default function DxLabel(props: IProps) {\n\tconst hasLabel = props.label && props.label !== '';\n\n\tconst description = props.description ? (\n\t\t<div className='input-description'>\n\t\t\t<GenesysDevIcon icon={GenesysDevIcons.AppInfoSolid} />\n\t\t\t<span>{props.description}</span>\n\t\t</div>\n\t) : undefined;\n\n\tif (props.useFieldset) {\n\t\treturn (\n\t\t\t<fieldset className={'dx-label ' + props.className || ''}>\n\t\t\t\t{props.label ? <legend className='label-text'>{props.label}</legend> : undefined}\n\t\t\t\t{props.children}\n\t\t\t\t{description}\n\t\t\t</fieldset>\n\t\t);\n\t}\n\treturn (\n\t\t<label className={'dx-label ' + props.className || ''}>\n\t\t\t{hasLabel ? <span className='label-text'>{props.label}</span> : undefined}\n\t\t\t{props.children}\n\t\t\t{description}\n\t\t</label>\n\t);\n}\n","import React, { useEffect, useState } from 'react';\nimport { v4 as uuid } from 'uuid';\nimport { DxItemGroupItem, DxItemGroupItemValue, ItemChangedCallback, ItemGroupChangedCallback } from '..';\n\nimport './DxItemGroup.scss';\nimport './checkbox.scss';\nimport './radiobutton.scss';\nimport './dropdown.scss';\nimport './multiselect.scss';\nimport DxLabel from '../dxlabel/DxLabel';\n\ninterface IProps {\n\ttitle?: string;\n\tdescription?: string;\n\tformat: DxItemGroupFormat;\n\titems: DxItemGroupItem[];\n\tonItemChanged?: ItemChangedCallback;\n\tonItemsChanged?: ItemGroupChangedCallback;\n}\n\nexport type DxItemGroupFormat = 'checkbox' | 'radio' | 'dropdown' | 'multiselect';\n\nexport default function DxItemGroup(props: IProps) {\n\tconst [data, setData] = useState<DxItemGroupItemValue[]>(\n\t\tprops.items.map((item) => {\n\t\t\treturn { item, isSelected: false };\n\t\t})\n\t);\n\tconst [id] = useState(uuid());\n\n\t// data changed\n\tuseEffect(() => {\n\t\tif (props.onItemsChanged) props.onItemsChanged(data);\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [data]);\n\n\t// Handle checkbox changed\n\tconst onChange = (idx: number, item: DxItemGroupItem, e: React.ChangeEvent<HTMLInputElement>) => {\n\t\tif (props.onItemChanged) props.onItemChanged(item, e.target.checked);\n\t\tlet newData = [...data];\n\t\t// Unselect everything if it's radio buttons\n\t\tif (props.format === 'radio') newData.forEach((value) => (value.isSelected = false));\n\t\t// Set the selected state of the new item\n\t\tnewData[idx].isSelected = e.target.checked;\n\t\tsetData(newData);\n\t};\n\n\tswitch (props.format) {\n\t\tcase 'multiselect':\n\t\tcase 'dropdown': {\n\t\t\treturn (\n\t\t\t\t<DxLabel label={props.title} description={props.description}>\n\t\t\t\t\t<div className={`dx-item-group${props.format === 'multiselect' ? ' dx-multiselect-group' : ' dx-select-group'}`}>\n\t\t\t\t\t\t<select multiple={props.format === 'multiselect'}>\n\t\t\t\t\t\t\t{data.map((d, i) => (\n\t\t\t\t\t\t\t\t<option key={i} value={d.item.value}>\n\t\t\t\t\t\t\t\t\t{d.item.label}\n\t\t\t\t\t\t\t\t</option>\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t</select>\n\t\t\t\t\t</div>\n\t\t\t\t</DxLabel>\n\t\t\t);\n\t\t}\n\t\tcase 'checkbox':\n\t\tcase 'radio':\n\t\tdefault: {\n\t\t\treturn (\n\t\t\t\t<DxLabel label={props.title} description={props.description} className='dx-item-group' useFieldset={true}>\n\t\t\t\t\t{data.map((d, i) => (\n\t\t\t\t\t\t<label key={i}>\n\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\ttype={props.format}\n\t\t\t\t\t\t\t\tname={props.format === 'checkbox' ? `${id}-${i}` : id}\n\t\t\t\t\t\t\t\tid={d.item.label}\n\t\t\t\t\t\t\t\tvalue={d.item.value}\n\t\t\t\t\t\t\t\tchecked={d.isSelected}\n\t\t\t\t\t\t\t\tonChange={(e) => onChange(i, d.item, e)}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<span className='label-text'>{d.item.label}</span>\n\t\t\t\t\t\t</label>\n\t\t\t\t\t))}\n\t\t\t\t</DxLabel>\n\t\t\t);\n\t\t}\n\t}\n}\n","import React, { useState } from 'react';\n\nimport './DxTabbedContent.scss';\n\ninterface IProps {\n\tchildren: React.ReactNode;\n\tinitialTabId?: number;\n}\n\nexport default function DxTabbedContent(props: IProps) {\n\tconst [activeTab, setActiveTab] = useState(props.initialTabId || 0);\n\tconst [titles] = useState<React.ReactNode[]>(\n\t\t// Scrape titles from child elements\n\t\tReact.Children.toArray(props.children).map((child: any) => {\n\t\t\tif (!child || !child.props || !child.props.title) return 'Unknown title';\n\t\t\treturn child.props.title;\n\t\t})\n\t);\n\n\treturn (\n\t\t<div className='dx-tabbed-content'>\n\t\t\t<div className='tab-titles'>\n\t\t\t\t{titles.map((title, i) => (\n\t\t\t\t\t<span key={i} className={`tab-title${i === activeTab ? ' active' : ''}`} onClick={() => setActiveTab(i)}>\n\t\t\t\t\t\t{title}\n\t\t\t\t\t</span>\n\t\t\t\t))}\n\t\t\t</div>\n\t\t\t<div className='tab-content'>{React.Children.toArray(props.children)[activeTab]}</div>\n\t\t</div>\n\t);\n}\n","import React from 'react';\n\nimport './DxTabPanel.scss';\n\ninterface IProps {\n\ttitle: React.ReactNode;\n\tchildren: React.ReactNode;\n}\n\nexport default function DxTabPanel(props: IProps) {\n\treturn <div className='dx-tab-panel'>{props.children}</div>;\n}\n","import { GenesysDevIcon, GenesysDevIcons } from 'genesys-dev-icons';\nimport React, { useEffect, useRef, useState } from 'react';\nimport DxLabel from '../dxlabel/DxLabel';\nimport { DxTextboxProps, StringChangedCallback, VoidEventCallback } from '..';\n\nimport './DxTextbox.scss';\n\nexport default function DxTextbox(props: DxTextboxProps) {\n\tconst [debounceMs, setDebounceMs] = useState(props.changeDebounceMs || 300);\n\tconst [value, setValue] = useState(props.initialValue || '');\n\tconst [isFocused, setIsFocused] = useState(false);\n\tconst [escapePressed, setEscapePressed] = useState(Date.now());\n\tconst [step, setStep] = useState<string | number | undefined>(undefined);\n\tlet [timer, setTimer] = useState(undefined as unknown as ReturnType<typeof setTimeout>);\n\n\t// Constructor\n\tuseEffect(() => {\n\t\t// Register global key bindings\n\t\tdocument.addEventListener('keydown', globalKeyBindings, false);\n\n\t\treturn () => {\n\t\t\tdocument.removeEventListener('keydown', globalKeyBindings, false);\n\t\t};\n\t}, []);\n\n\t// Escape pressed\n\tuseEffect(() => {\n\t\tif (!isFocused) return;\n\t\tsetValue('');\n\t\tinputRef.current?.blur();\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [escapePressed]);\n\n\t// Value changed\n\tuseEffect(() => {\n\t\tif (props.inputType === 'decimal') {\n\t\t\t// Normalize step setting\n\t\t\tif (!isNaN(parseFloat(value))) {\n\t\t\t\tconst match = /\\.(.+)/.exec(value);\n\t\t\t\tconsole.log(match);\n\t\t\t\tif (match) {\n\t\t\t\t\tconst s = `0.${Array.apply(null, Array(match[1].length - 1))\n\t\t\t\t\t\t.map(() => '0')\n\t\t\t\t\t\t.join('')}1`;\n\t\t\t\t\tconsole.log(s);\n\t\t\t\t\tsetStep(s);\n\t\t\t\t}\n\t\t\t}\n\t\t} else if (props.inputType === 'integer') {\n\t\t\t// Overwrite value as integer to forcibly truncate floating point numbers\n\t\t\tsetValue(parseInt(value).toString());\n\t\t}\n\n\t\t// Debounce onChange notification\n\t\tif (!props.onChange) return;\n\t\tclearTimeout(timer);\n\t\tsetTimer(setTimeout(() => (props.onChange ? props.onChange(value) : undefined), debounceMs));\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [value]);\n\n\t// Update state from props\n\tuseEffect(() => {\n\t\tsetDebounceMs(props.changeDebounceMs || 300);\n\t}, [props.changeDebounceMs]);\n\n\t// Normalize inputRef\n\tlet inputRef = useRef<HTMLInputElement>(null);\n\tif (props.inputRef) inputRef = props.inputRef;\n\tconst hasLabel = props.label && props.label !== '';\n\n\t// Global key bindings\n\tfunction globalKeyBindings(event: KeyboardEvent) {\n\t\t// Escape - cancel search\n\t\tif (event.key === 'Escape') {\n\t\t\tevent.stopPropagation();\n\t\t\tevent.preventDefault();\n\t\t\tsetEscapePressed(Date.now());\n\t\t\treturn;\n\t\t}\n\t}\n\n\t// Normalize input type\n\tlet inputType: React.HTMLInputTypeAttribute | undefined = props.inputType;\n\tif (inputType === 'integer' || inputType === 'decimal') inputType = 'number';\n\n\t// TODO: handle props.inputType\n\tlet component = (\n\t\t<div className={`dx-textbox${hasLabel ? ' with-label' : ''}`} style={{}}>\n\t\t\t{props.icon ? <GenesysDevIcon icon={props.icon} className='input-icon' /> : undefined}\n\t\t\t<input\n\t\t\t\tclassName='dx-input'\n\t\t\t\ttype={inputType}\n\t\t\t\tstep={step}\n\t\t\t\tvalue={value}\n\t\t\t\tplaceholder={props.placeholder}\n\t\t\t\tonChange={(e) => setValue(e.target.value)}\n\t\t\t\tref={inputRef}\n\t\t\t\tonFocus={() => {\n\t\t\t\t\tsetIsFocused(true);\n\t\t\t\t\tif (props.onFocus) props.onFocus();\n\t\t\t\t}}\n\t\t\t\tonBlur={() => {\n\t\t\t\t\tsetIsFocused(false);\n\t\t\t\t\tif (props.onBlur) props.onBlur();\n\t\t\t\t}}\n\t\t\t/>\n\t\t\t{props.clearButton && (value || isFocused) ? (\n\t\t\t\t<GenesysDevIcon icon={GenesysDevIcons.AppTimes} className='clear-icon' onClick={() => setValue('')} />\n\t\t\t) : undefined}\n\t\t</div>\n\t);\n\n\t// Render\n\treturn (\n\t\t<DxLabel label={props.label} description={props.description}>\n\t\t\t{component}\n\t\t</DxLabel>\n\t);\n}\n","import React, { useEffect, useState } from 'react';\nimport { GenesysDevIcon, GenesysDevIcons } from 'genesys-dev-icons';\nimport { BooleanChangedCallback, DxToggleProps } from '..';\n\nimport './DxToggle.scss';\nimport DxLabel from '../dxlabel/DxLabel';\n\nexport default function DxToggle(props: DxToggleProps) {\n\tconst [value, setValue] = useState(props.isTriState ? props.initialValue : props.initialValue || false);\n\n\tconst trueIcon = props.trueIcon || GenesysDevIcons.AppCheck;\n\tconst falseIcon = props.falseIcon || GenesysDevIcons.AppTimes;\n\n\tuseEffect(() => {\n\t\tif (props.onChange) props.onChange(value);\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [value]);\n\n\tconst toggleValue = () => {\n\t\tif (props.isTriState) {\n\t\t\tif (value === undefined) setValue(true);\n\t\t\telse if (value === true) setValue(false);\n\t\t\telse setValue(undefined);\n\t\t} else {\n\t\t\tsetValue(!value);\n\t\t}\n\t};\n\n\treturn (\n\t\t<DxLabel label={props.label} description={props.description}>\n\t\t\t<div className='dx-toggle-container'>\n\t\t\t\t<div className='dx-toggle' onClick={toggleValue}>\n\t\t\t\t\t{value !== false ? <GenesysDevIcon icon={falseIcon} /> : undefined}\n\t\t\t\t\t{value === true && props.isTriState ? <div className='clear-placeholder'>&nbsp;</div> : undefined}\n\t\t\t\t\t<div className='slider'>{value !== undefined ? <GenesysDevIcon icon={value ? trueIcon : falseIcon} /> : undefined}</div>\n\t\t\t\t\t{value === false && props.isTriState ? <div className='clear-placeholder'>&nbsp;</div> : undefined}\n\t\t\t\t\t{value !== true ? <GenesysDevIcon icon={trueIcon} /> : undefined}\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</DxLabel>\n\t);\n}\n"],"names":["uuid"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","sources":["../node_modules/style-inject/dist/style-inject.es.js","../src/dxaccordion/DxAccordion.tsx","../src/dxaccordion/DxAccordionGroup.tsx","../src/dxbutton/DxButton.tsx","../src/dxlabel/DxLabel.tsx","../src/dxitemgroup/DxCheckbox.tsx","../src/dxitemgroup/DxItemGroup.tsx","../src/dxtabbedcontent/DxTabbedContent.tsx","../src/dxtabbedcontent/DxTabPanel.tsx","../src/dxtextbox/DxTextbox.tsx","../src/dxtoggle/DxToggle.tsx"],"sourcesContent":["function styleInject(css, ref) {\n if ( ref === void 0 ) ref = {};\n var insertAt = ref.insertAt;\n\n if (!css || typeof document === 'undefined') { return; }\n\n var head = document.head || document.getElementsByTagName('head')[0];\n var style = document.createElement('style');\n style.type = 'text/css';\n\n if (insertAt === 'top') {\n if (head.firstChild) {\n head.insertBefore(style, head.firstChild);\n } else {\n head.appendChild(style);\n }\n } else {\n head.appendChild(style);\n }\n\n if (style.styleSheet) {\n style.styleSheet.cssText = css;\n } else {\n style.appendChild(document.createTextNode(css));\n }\n}\n\nexport default styleInject;\n","import { GenesysDevIcon, GenesysDevIcons } from 'genesys-dev-icons';\nimport React, { useState } from 'react';\nimport { DxAccordionProps } from '..';\n\nimport './DxAccordion.scss';\n\nexport default function DxAccordion(props: DxAccordionProps) {\n\tconst [isOpen, setIsOpen] = useState(props.showOpen || false);\n\n\treturn (\n\t\t<div className={`dx-accordion${props.className ? ' ' + props.className : ''}`}>\n\t\t\t<div className='accordion-heading' onClick={() => setIsOpen(!isOpen)}>\n\t\t\t\t{props.title} <GenesysDevIcon icon={isOpen ? GenesysDevIcons.AppChevronUp : GenesysDevIcons.AppChevronDown} />\n\t\t\t</div>\n\t\t\t{isOpen ? <div className='accordion-content'>{props.children}</div> : undefined}\n\t\t</div>\n\t);\n}\n","import React from 'react';\n\nimport './DxAccordionGroup.scss';\n\ninterface IProps {\n\tchildren: React.ReactNode;\n\tclassName?: string;\n}\n\nexport default function DxAccordionGroup(props: IProps) {\n\treturn <div className={`dx-accordion-group${props.className ? ' ' + props.className : ''}`}>{props.children}</div>;\n}\n","import React from 'react';\nimport { VoidEventCallback } from '..';\n\nimport './DxButton.scss';\n\ninterface IProps {\n\ttype?: 'primary' | 'secondary';\n\tdisabled?: boolean;\n\tchildren?: React.ReactNode;\n\tclassName?: string;\n\tonClick?: VoidEventCallback;\n}\n\nexport default function DxButton(props: IProps) {\n\tlet classNames = ['dx-button'];\n\tclassNames.push(`dx-button-${props.type || 'primary'}`);\n\tif (props.className) classNames.push(props.className);\n\n\tconst handleClick = (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n\t\tif (!props.onClick) return;\n\t\te.preventDefault();\n\t\te.stopPropagation();\n\t\tprops.onClick();\n\t};\n\n\treturn (\n\t\t<button className={classNames.join(' ')} type='button' onClick={handleClick} disabled={props.disabled === true}>\n\t\t\t{props.children}\n\t\t</button>\n\t);\n}\n","import { GenesysDevIcon, GenesysDevIcons } from 'genesys-dev-icons';\nimport React from 'react';\n\nimport './DxLabel.scss';\n\ninterface IProps {\n\tlabel?: string;\n\tdescription?: string;\n\tuseFieldset?: boolean;\n\tclassName?: string;\n\tchildren: React.ReactNode;\n}\n\nexport default function DxLabel(props: IProps) {\n\tconst hasLabel = props.label && props.label !== '';\n\n\tconst description = props.description ? (\n\t\t<div className='input-description'>\n\t\t\t<GenesysDevIcon icon={GenesysDevIcons.AppInfoSolid} />\n\t\t\t<span>{props.description}</span>\n\t\t</div>\n\t) : undefined;\n\n\tconst contents = (\n\t\t<React.Fragment>\n\t\t\t{' '}\n\t\t\t{hasLabel ? <span className='label-text'>{props.label}</span> : undefined}\n\t\t\t{props.children}\n\t\t\t{description}\n\t\t</React.Fragment>\n\t);\n\n\tconst className = `dx-label${props.className ? ' ' + props.className : ''}`;\n\n\tif (props.useFieldset) {\n\t\treturn <fieldset className={className}>{contents}</fieldset>;\n\t}\n\treturn <label className={className}>{contents}</label>;\n}\n","import React, { useEffect, useState } from 'react';\nimport { CheckedChangedCallback } from '..';\n\nimport './DxCheckbox.scss';\n\ninterface IProps {\n\tlabel: string;\n\titemValue: string;\n\tdescription?: string;\n\tchecked?: boolean;\n\tinitiallyChecked?: boolean;\n\tname?: string;\n\tclassName?: string;\n\tonCheckChanged?: CheckedChangedCallback;\n\tuseRadioType?: boolean;\n\tdisabled?: boolean;\n}\n\nexport default function DxCheckbox(props: IProps) {\n\tlet initialValue: boolean = props.checked !== undefined ? props.checked : props.initiallyChecked || false;\n\n\tconst [checked, setChecked] = useState<boolean>(initialValue);\n\n\tuseEffect(() => {\n\t\tif (props.checked === undefined || props.checked === checked) return;\n\t\tsetChecked(props.checked);\n\t}, [props.checked]);\n\n\tuseEffect(() => {\n\t\tif (props.onCheckChanged) props.onCheckChanged(checked);\n\t}, [checked]);\n\n\treturn (\n\t\t<label className={`dx-checkbox${props.className ? ' ' + props.className : ''}${props.disabled ? ' disabled' : ''}`}>\n\t\t\t<input\n\t\t\t\ttype={props.useRadioType ? 'radio' : 'checkbox'}\n\t\t\t\tname={props.name}\n\t\t\t\tid={props.label}\n\t\t\t\tvalue={props.itemValue}\n\t\t\t\tchecked={checked}\n\t\t\t\tonChange={(e) => setChecked(e.target.checked)}\n\t\t\t\tdisabled={props.disabled === true}\n\t\t\t/>\n\t\t\t<span className='label-text'>{props.label}</span>\n\t\t</label>\n\t);\n}\n","import React, { useEffect, useState } from 'react';\nimport { v4 as uuid } from 'uuid';\nimport { DxItemGroupItem, DxItemGroupItemValue, DxItemGroupProps, ItemChangedCallback, ItemGroupChangedCallback } from '..';\n\nimport './DxItemGroup.scss';\nimport './radiobutton.scss';\nimport './dropdown.scss';\nimport './multiselect.scss';\nimport DxLabel from '../dxlabel/DxLabel';\nimport DxCheckbox from './DxCheckbox';\n\nexport default function DxItemGroup(props: DxItemGroupProps) {\n\tconst [data, setData] = useState<DxItemGroupItemValue[]>(\n\t\tprops.items.map((item) => {\n\t\t\treturn { item, isSelected: false };\n\t\t})\n\t);\n\tconst [id] = useState(uuid());\n\tconst [title, setTitle] = useState(props.title);\n\tconst [description, setDescription] = useState(props.description);\n\tconst [format, setFormat] = useState(props.format);\n\tconst [items, setItems] = useState(props.items);\n\tconst [disabled, setDisabled] = useState(props.disabled);\n\tconst [className, setClassName] = useState(props.className);\n\n\t// data changed\n\tuseEffect(() => {\n\t\tif (props.onItemsChanged) props.onItemsChanged(data);\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [data]);\n\n\t// Recalculate on props changed\n\tuseEffect(() => {\n\t\tsetTitle(props.title);\n\t\tsetDescription(props.description);\n\t\tsetFormat(props.format);\n\t\tsetItems(props.items);\n\t\tsetDisabled(props.disabled);\n\t\tsetClassName(props.className);\n\t\tsetData(\n\t\t\tprops.items.map((item) => {\n\t\t\t\treturn { item, isSelected: false };\n\t\t\t})\n\t\t);\n\t}, [props.title, props.description, props.format, props.items, props.disabled, props.className]);\n\n\t// Handle individual item changed\n\tconst itemChanged = (idx: number, item: DxItemGroupItem, checked: boolean) => {\n\t\tif (props.onItemChanged) props.onItemChanged(item, checked);\n\t\tlet newData = [...data];\n\t\t// Unselect everything if it's radio buttons\n\t\tif (format === 'radio') newData.forEach((value) => (value.isSelected = false));\n\t\t// Set the selected state of the new item\n\t\tnewData[idx].isSelected = checked;\n\t\tsetData(newData);\n\t};\n\n\tconst selectChanged = (e: React.ChangeEvent<HTMLSelectElement>) => {\n\t\tconst options = e.target.options;\n\t\tlet newData = [...data];\n\t\t// Assign selected value for each item in the list\n\t\tfor (let i = 0; i < options.length; i++) {\n\t\t\tconst thisItem = newData.find((value) => value.item.value === options[i].value);\n\t\t\tthisItem.isSelected = options[i].selected;\n\t\t}\n\t\t// Update entire data list\n\t\tsetData(newData);\n\t\t// Trigger individual update\n\t\tconst changedItemIdx = newData.findIndex((value) => value.item.value === e.target.value);\n\t\tif (changedItemIdx >= 0) itemChanged(changedItemIdx, newData[changedItemIdx].item, newData[changedItemIdx].isSelected);\n\t};\n\n\tswitch (format) {\n\t\tcase 'multiselect':\n\t\tcase 'dropdown': {\n\t\t\tconst isMulti = format === 'multiselect';\n\t\t\treturn (\n\t\t\t\t<DxLabel label={title} description={description} className={className}>\n\t\t\t\t\t<div className={`dx-item-group${isMulti ? ' dx-multiselect-group' : ' dx-select-group'}${disabled ? ' disabled' : ''}`}>\n\t\t\t\t\t\t<select multiple={isMulti} disabled={disabled === true} onChange={(e) => selectChanged(e)}>\n\t\t\t\t\t\t\t{data.map((d, i) => (\n\t\t\t\t\t\t\t\t<option key={i} value={d.item.value} disabled={d.item.disabled}>\n\t\t\t\t\t\t\t\t\t{d.item.label}\n\t\t\t\t\t\t\t\t</option>\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t</select>\n\t\t\t\t\t</div>\n\t\t\t\t</DxLabel>\n\t\t\t);\n\t\t}\n\t\tcase 'checkbox':\n\t\tcase 'radio':\n\t\tdefault: {\n\t\t\treturn (\n\t\t\t\t<DxLabel\n\t\t\t\t\tlabel={title}\n\t\t\t\t\tdescription={description}\n\t\t\t\t\tclassName={`dx-item-group${disabled ? ' disabled' : ''}${className ? ' ' + className : ''}`}\n\t\t\t\t\tuseFieldset={true}\n\t\t\t\t>\n\t\t\t\t\t{data.map((d, i) => (\n\t\t\t\t\t\t<DxCheckbox\n\t\t\t\t\t\t\tkey={d.item.value}\n\t\t\t\t\t\t\tname={format === 'checkbox' ? `${id}-${d.item.value}` : id}\n\t\t\t\t\t\t\tlabel={d.item.label}\n\t\t\t\t\t\t\titemValue={d.item.value}\n\t\t\t\t\t\t\tinitiallyChecked={d.isSelected}\n\t\t\t\t\t\t\tonCheckChanged={(checked) => itemChanged(i, d.item, checked)}\n\t\t\t\t\t\t\tuseRadioType={format === 'radio'}\n\t\t\t\t\t\t\tdisabled={disabled || d.item.disabled}\n\t\t\t\t\t\t/>\n\t\t\t\t\t))}\n\t\t\t\t</DxLabel>\n\t\t\t);\n\t\t}\n\t}\n}\n","import React, { useState } from 'react';\nimport { DxTabbedContentProps } from '..';\n\nimport './DxTabbedContent.scss';\n\nexport default function DxTabbedContent(props: DxTabbedContentProps) {\n\tconst [activeTab, setActiveTab] = useState(props.initialTabId || 0);\n\tconst [titles] = useState<React.ReactNode[]>(\n\t\t// Scrape titles from child elements\n\t\tReact.Children.toArray(props.children).map((child: any) => {\n\t\t\tif (!child || !child.props || !child.props.title) return 'Unknown title';\n\t\t\treturn child.props.title;\n\t\t})\n\t);\n\n\treturn (\n\t\t<div className={`dx-tabbed-content${props.className ? ' ' + props.className : ''}`}>\n\t\t\t<div className='tab-titles'>\n\t\t\t\t{titles.map((title, i) => (\n\t\t\t\t\t<span key={i} className={`tab-title${i === activeTab ? ' active' : ''}`} onClick={() => setActiveTab(i)}>\n\t\t\t\t\t\t{title}\n\t\t\t\t\t</span>\n\t\t\t\t))}\n\t\t\t</div>\n\t\t\t<div className='tab-content'>{React.Children.toArray(props.children)[activeTab]}</div>\n\t\t</div>\n\t);\n}\n","import React from 'react';\nimport { DxTabPanelProps } from '..';\n\nimport './DxTabPanel.scss';\n\nexport default function DxTabPanel(props: DxTabPanelProps) {\n\treturn <div className={`dx-tab-panel${props.className ? ' ' + props.className : ''}`}>{props.children}</div>;\n}\n","import { GenesysDevIcon, GenesysDevIcons } from 'genesys-dev-icons';\nimport React, { useEffect, useRef, useState } from 'react';\nimport DxLabel from '../dxlabel/DxLabel';\nimport { DxTextboxProps } from '..';\n\nimport './DxTextbox.scss';\n\nexport default function DxTextbox(props: DxTextboxProps) {\n\tconst [debounceMs, setDebounceMs] = useState(props.changeDebounceMs || 300);\n\tconst [value, setValue] = useState(props.initialValue || props.value || '');\n\tconst [isFocused, setIsFocused] = useState(false);\n\tconst [escapePressed, setEscapePressed] = useState(Date.now());\n\tconst [step, setStep] = useState<string | number | undefined>(undefined);\n\tlet [timer, setTimer] = useState(undefined as unknown as ReturnType<typeof setTimeout>);\n\n\t// Constructor\n\tuseEffect(() => {\n\t\t// Register global key bindings\n\t\tdocument.addEventListener('keydown', globalKeyBindings, false);\n\n\t\treturn () => {\n\t\t\tdocument.removeEventListener('keydown', globalKeyBindings, false);\n\t\t};\n\t}, []);\n\n\t// Value prop updated\n\tuseEffect(() => {\n\t\tsetValue(props.value || '');\n\t}, [props.value]);\n\n\t// Escape pressed\n\tuseEffect(() => {\n\t\tif (!isFocused) return;\n\t\tsetValue('');\n\t\tinputRef.current?.blur();\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [escapePressed]);\n\n\t// Value changed\n\tuseEffect(() => {\n\t\tif (props.inputType === 'decimal') {\n\t\t\t// Normalize step setting\n\t\t\tif (!isNaN(parseFloat(value))) {\n\t\t\t\tconst match = /\\.(.+)/.exec(value);\n\t\t\t\tconsole.log(match);\n\t\t\t\tif (match) {\n\t\t\t\t\tconst s = `0.${Array.apply(null, Array(match[1].length - 1))\n\t\t\t\t\t\t.map(() => '0')\n\t\t\t\t\t\t.join('')}1`;\n\t\t\t\t\tconsole.log(s);\n\t\t\t\t\tsetStep(s);\n\t\t\t\t}\n\t\t\t}\n\t\t} else if (props.inputType === 'integer') {\n\t\t\t// Overwrite value as integer to forcibly truncate floating point numbers\n\t\t\tsetValue(parseInt(value).toString());\n\t\t}\n\n\t\t// Debounce onChange notification\n\t\tif (!props.onChange) return;\n\t\tclearTimeout(timer);\n\t\tsetTimer(setTimeout(() => (props.onChange ? props.onChange(value) : undefined), debounceMs));\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [value]);\n\n\t// Update state from props\n\tuseEffect(() => {\n\t\tsetDebounceMs(props.changeDebounceMs || 300);\n\t}, [props.changeDebounceMs]);\n\n\t// Normalize inputRef\n\tlet inputRef = useRef<HTMLInputElement>(null);\n\tif (props.inputRef) inputRef = props.inputRef;\n\tconst hasLabel = props.label && props.label !== '';\n\n\t// Global key bindings\n\tfunction globalKeyBindings(event: KeyboardEvent) {\n\t\t// Escape - cancel search\n\t\tif (event.key === 'Escape') {\n\t\t\tevent.stopPropagation();\n\t\t\tevent.preventDefault();\n\t\t\tsetEscapePressed(Date.now());\n\t\t\treturn;\n\t\t}\n\t}\n\n\t// Normalize input type\n\tlet inputType: React.HTMLInputTypeAttribute | undefined = props.inputType;\n\tif (inputType === 'integer' || inputType === 'decimal') inputType = 'number';\n\n\t// TODO: handle props.inputType\n\tlet component = (\n\t\t<div className={`dx-textbox${hasLabel ? ' with-label' : ''}${props.disabled ? ' disabled' : ''}`} style={{}}>\n\t\t\t{props.icon ? <GenesysDevIcon icon={props.icon} className='input-icon' /> : undefined}\n\t\t\t<input\n\t\t\t\tclassName='dx-input'\n\t\t\t\ttype={inputType}\n\t\t\t\tstep={step}\n\t\t\t\tvalue={value}\n\t\t\t\tplaceholder={props.placeholder}\n\t\t\t\tonChange={(e) => setValue(e.target.value)}\n\t\t\t\tref={inputRef}\n\t\t\t\tonFocus={() => {\n\t\t\t\t\tsetIsFocused(true);\n\t\t\t\t\tif (props.onFocus) props.onFocus();\n\t\t\t\t}}\n\t\t\t\tonBlur={() => {\n\t\t\t\t\tsetIsFocused(false);\n\t\t\t\t\tif (props.onBlur) props.onBlur();\n\t\t\t\t}}\n\t\t\t\tdisabled={props.disabled === true}\n\t\t\t/>\n\t\t\t{props.clearButton && (value || isFocused) && !props.disabled ? (\n\t\t\t\t<GenesysDevIcon icon={GenesysDevIcons.AppTimes} className='clear-icon' onClick={() => setValue('')} />\n\t\t\t) : undefined}\n\t\t</div>\n\t);\n\n\t// Render\n\treturn (\n\t\t<DxLabel label={props.label} description={props.description} className={props.className}>\n\t\t\t{component}\n\t\t</DxLabel>\n\t);\n}\n","import React, { useEffect, useState } from 'react';\nimport { GenesysDevIcon, GenesysDevIcons } from 'genesys-dev-icons';\nimport { BooleanChangedCallback, DxToggleProps } from '..';\n\nimport './DxToggle.scss';\nimport DxLabel from '../dxlabel/DxLabel';\n\nexport default function DxToggle(props: DxToggleProps) {\n\tlet initialValue: boolean | undefined = props.value !== undefined ? props.value : props.initialValue;\n\tif (!props.isTriState) initialValue = initialValue || false;\n\n\tconst [value, setValue] = useState<boolean | undefined>(initialValue);\n\n\tconst trueIcon = props.trueIcon || GenesysDevIcons.AppCheck;\n\tconst falseIcon = props.falseIcon || GenesysDevIcons.AppTimes;\n\n\tuseEffect(() => {\n\t\tif (props.initialValue || props.value === value || (!props.isTriState && props.value === undefined)) return;\n\t\tsetValue(props.value);\n\t}, [props.value]);\n\n\tuseEffect(() => {\n\t\tif (props.onChange) props.onChange(value);\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [value]);\n\n\tconst toggleValue = () => {\n\t\tif (props.disabled) return;\n\t\tif (props.isTriState) {\n\t\t\tif (value === undefined) setValue(true);\n\t\t\telse if (value === true) setValue(false);\n\t\t\telse setValue(undefined);\n\t\t} else {\n\t\t\tsetValue(!value);\n\t\t}\n\t};\n\n\treturn (\n\t\t<DxLabel label={props.label} description={props.description} className={props.className}>\n\t\t\t<div className={`dx-toggle-container${props.disabled ? ' disabled' : ''}`}>\n\t\t\t\t<div className='dx-toggle' onClick={toggleValue}>\n\t\t\t\t\t{value !== false ? <GenesysDevIcon icon={falseIcon} /> : undefined}\n\t\t\t\t\t{value === true && props.isTriState ? <div className='clear-placeholder'>&nbsp;</div> : undefined}\n\t\t\t\t\t<div className='slider'>{value !== undefined ? <GenesysDevIcon icon={value ? trueIcon : falseIcon} /> : undefined}</div>\n\t\t\t\t\t{value === false && props.isTriState ? <div className='clear-placeholder'>&nbsp;</div> : undefined}\n\t\t\t\t\t{value !== true ? <GenesysDevIcon icon={trueIcon} /> : undefined}\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</DxLabel>\n\t);\n}\n"],"names":["uuid"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "genesys-react-components",
3
- "version": "0.1.0-alpha.5",
3
+ "version": "0.1.0-alpha.9",
4
4
  "description": "A React component library containing standardized form elements.",
5
5
  "main": "build/index.js",
6
6
  "module": "build/index.js",