genesys-react-components 0.1.0-alpha.6 → 0.1.0-alpha.7

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 +6 -4
  4. package/build/dxitemgroup/DxItemGroup.d.ts +2 -12
  5. package/build/dxtabbedcontent/DxTabPanel.d.ts +3 -7
  6. package/build/dxtabbedcontent/DxTabbedContent.d.ts +3 -7
  7. package/build/index.d.ts +37 -0
  8. package/build/index.js +58 -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 CHANGED
@@ -1,15 +1,17 @@
1
1
  /// <reference types="react" />
2
- import { BooleanChangedCallback } from '..';
2
+ import { CheckedChangedCallback } from '..';
3
3
  import './DxCheckbox.scss';
4
4
  interface IProps {
5
5
  label: string;
6
- value: string;
6
+ itemValue: string;
7
7
  description?: string;
8
- initialValue?: boolean;
8
+ checked?: boolean;
9
+ initiallyChecked?: boolean;
9
10
  name?: string;
10
11
  className?: string;
11
- onCheckChanged?: BooleanChangedCallback;
12
+ onCheckChanged?: CheckedChangedCallback;
12
13
  useRadioType?: boolean;
14
+ disabled?: boolean;
13
15
  }
14
16
  export default function DxCheckbox(props: IProps): JSX.Element;
15
17
  export {};
package/build/dxitemgroup/DxItemGroup.d.ts CHANGED
@@ -1,17 +1,7 @@
1
1
  /// <reference types="react" />
2
- import { DxItemGroupItem, ItemChangedCallback, ItemGroupChangedCallback } from '..';
2
+ import { DxItemGroupProps } from '..';
3
3
  import './DxItemGroup.scss';
4
4
  import './radiobutton.scss';
5
5
  import './dropdown.scss';
6
6
  import './multiselect.scss';
7
- interface IProps {
8
- title?: string;
9
- description?: string;
10
- format: DxItemGroupFormat;
11
- items: DxItemGroupItem[];
12
- onItemChanged?: ItemChangedCallback;
13
- onItemsChanged?: ItemGroupChangedCallback;
14
- }
15
- export declare type DxItemGroupFormat = 'checkbox' | 'radio' | 'dropdown' | 'multiselect';
16
- export default function DxItemGroup(props: IProps): JSX.Element;
17
- 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
@@ -17,12 +17,16 @@ export interface StringChangedCallback {
17
17
  export interface BooleanChangedCallback {
18
18
  (value?: boolean): void;
19
19
  }
20
+ export interface CheckedChangedCallback {
21
+ (checked: boolean): void;
22
+ }
20
23
  export interface VoidEventCallback {
21
24
  (): void;
22
25
  }
23
26
  export interface DxItemGroupItem {
24
27
  label: string;
25
28
  value: string;
29
+ disabled?: boolean;
26
30
  }
27
31
  export interface DxItemGroupItemValue {
28
32
  item: DxItemGroupItem;
@@ -37,15 +41,19 @@ export interface ItemGroupChangedCallback {
37
41
  export interface DxToggleProps {
38
42
  isTriState?: boolean;
39
43
  initialValue?: boolean;
44
+ value?: boolean;
40
45
  label?: string;
41
46
  description?: string;
42
47
  trueIcon?: GenesysDevIcons;
43
48
  falseIcon?: GenesysDevIcons;
49
+ disabled?: boolean;
44
50
  onChange?: BooleanChangedCallback;
51
+ className?: string;
45
52
  }
46
53
  export declare type DxTextboxType = 'text' | 'password' | 'email' | 'date' | 'datetime-local' | 'time' | 'integer' | 'decimal';
47
54
  export interface DxTextboxProps {
48
55
  initialValue?: string;
56
+ value?: string;
49
57
  inputType?: DxTextboxType;
50
58
  label?: string;
51
59
  description?: string;
@@ -57,4 +65,33 @@ export interface DxTextboxProps {
57
65
  inputRef?: React.RefObject<HTMLInputElement>;
58
66
  onFocus?: VoidEventCallback;
59
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;
60
97
  }
package/build/index.js CHANGED
@@ -34,7 +34,7 @@ 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,16 +67,16 @@ 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
73
  var css_248z$8 = "";
74
74
  styleInject(css_248z$8);
75
75
 
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 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}";
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-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}";
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
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}";
@@ -87,24 +87,35 @@ function DxLabel(props) {
87
87
  const description = props.description ? (React.createElement("div", { className: 'input-description' },
88
88
  React.createElement(GenesysDevIcon, { icon: GenesysDevIcons.AppInfoSolid }),
89
89
  React.createElement("span", null, props.description))) : undefined;
90
- if (props.useFieldset) {
91
- return (React.createElement("fieldset", { className: 'dx-label ' + props.className || '' },
92
- props.label ? React.createElement("legend", { className: 'label-text' }, props.label) : undefined,
93
- props.children,
94
- description));
95
- }
96
- return (React.createElement("label", { className: 'dx-label ' + props.className || '' },
90
+ const contents = (React.createElement(React.Fragment, null,
91
+ ' ',
97
92
  hasLabel ? React.createElement("span", { className: 'label-text' }, props.label) : undefined,
98
93
  props.children,
99
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
100
  }
101
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\n.dx-label .dx-checkbox .label-text {\n margin: 0;\n}";
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
103
  styleInject(css_248z$4);
104
104
 
105
105
  function DxCheckbox(props) {
106
- return (React.createElement("label", { className: `dx-checkbox ${props.className || ''}` },
107
- React.createElement("input", { type: props.useRadioType ? 'radio' : 'checkbox', name: props.name, id: props.label, value: props.value, checked: props.initialValue, onChange: (e) => (props.onCheckChanged ? props.onCheckChanged(e.target.checked) : undefined) }),
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 }),
108
119
  React.createElement("span", { className: 'label-text' }, props.label)));
109
120
  }
110
121
 
@@ -134,31 +145,19 @@ function DxItemGroup(props) {
134
145
  switch (props.format) {
135
146
  case 'multiselect':
136
147
  case 'dropdown': {
137
- return (React.createElement(DxLabel, { label: props.title, description: props.description },
138
- React.createElement("div", { className: `dx-item-group${props.format === 'multiselect' ? ' dx-multiselect-group' : ' dx-select-group'}` },
139
- React.createElement("select", { multiple: props.format === 'multiselect' }, data.map((d, i) => (React.createElement("option", { key: i, value: d.item.value }, d.item.label)))))));
148
+ return (React.createElement(DxLabel, { label: props.title, description: props.description, className: props.className },
149
+ React.createElement("div", { className: `dx-item-group${props.format === 'multiselect' ? ' dx-multiselect-group' : ' dx-select-group'}${props.disabled ? ' disabled' : ''}` },
150
+ React.createElement("select", { multiple: props.format === 'multiselect', disabled: props.disabled === true }, data.map((d, i) => (React.createElement("option", { key: i, value: d.item.value, disabled: d.item.disabled }, d.item.label)))))));
140
151
  }
141
152
  case 'checkbox':
142
153
  case 'radio':
143
154
  default: {
144
- return (React.createElement(DxLabel, { label: props.title, description: props.description, className: 'dx-item-group', useFieldset: true }, data.map((d, i) => (React.createElement(DxCheckbox, { key: i, name: props.format === 'checkbox' ? `${id}-${i}` : id, label: d.item.label, value: d.item.value, initialValue: d.isSelected, onCheckChanged: (checked) => onChange(i, d.item, checked) })
145
- // <label key={i}>
146
- // <input
147
- // type={props.format}
148
- // name={props.format === 'checkbox' ? `${id}-${i}` : id}
149
- // id={d.item.label}
150
- // value={d.item.value}
151
- // checked={d.isSelected}
152
- // onChange={(e) => onChange(i, d.item, e)}
153
- // />
154
- // <span className='label-text'>{d.item.label}</span>
155
- // </label>
156
- ))));
155
+ return (React.createElement(DxLabel, { label: props.title, description: props.description, className: `dx-item-group${props.disabled ? ' disabled' : ''}${props.className ? ' ' + props.className : ''}`, useFieldset: true }, data.map((d, i) => (React.createElement(DxCheckbox, { key: i, name: props.format === 'checkbox' ? `${id}-${i}` : id, label: d.item.label, itemValue: d.item.value, initiallyChecked: d.isSelected, onCheckChanged: (checked) => onChange(i, d.item, checked), useRadioType: props.format === 'radio', disabled: props.disabled || d.item.disabled })))));
157
156
  }
158
157
  }
159
158
  }
160
159
 
161
- 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}";
160
+ 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}";
162
161
  styleInject(css_248z$3);
163
162
 
164
163
  function DxTabbedContent(props) {
@@ -170,7 +169,7 @@ function DxTabbedContent(props) {
170
169
  return 'Unknown title';
171
170
  return child.props.title;
172
171
  }));
173
- return (React.createElement("div", { className: 'dx-tabbed-content' },
172
+ return (React.createElement("div", { className: `dx-tabbed-content${props.className ? ' ' + props.className : ''}` },
174
173
  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)))),
175
174
  React.createElement("div", { className: 'tab-content' }, React.Children.toArray(props.children)[activeTab])));
176
175
  }
@@ -179,15 +178,15 @@ var css_248z$2 = "";
179
178
  styleInject(css_248z$2);
180
179
 
181
180
  function DxTabPanel(props) {
182
- return React.createElement("div", { className: 'dx-tab-panel' }, props.children);
181
+ return React.createElement("div", { className: `dx-tab-panel${props.className ? ' ' + props.className : ''}` }, props.children);
183
182
  }
184
183
 
185
- 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}";
184
+ 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}";
186
185
  styleInject(css_248z$1);
187
186
 
188
187
  function DxTextbox(props) {
189
188
  const [debounceMs, setDebounceMs] = useState(props.changeDebounceMs || 300);
190
- const [value, setValue] = useState(props.initialValue || '');
189
+ const [value, setValue] = useState(props.initialValue || props.value || '');
191
190
  const [isFocused, setIsFocused] = useState(false);
192
191
  const [escapePressed, setEscapePressed] = useState(Date.now());
193
192
  const [step, setStep] = useState(undefined);
@@ -200,6 +199,10 @@ function DxTextbox(props) {
200
199
  document.removeEventListener('keydown', globalKeyBindings, false);
201
200
  };
202
201
  }, []);
202
+ // Value prop updated
203
+ useEffect(() => {
204
+ setValue(props.value || '');
205
+ }, [props.value]);
203
206
  // Escape pressed
204
207
  useEffect(() => {
205
208
  var _a;
@@ -260,7 +263,7 @@ function DxTextbox(props) {
260
263
  if (inputType === 'integer' || inputType === 'decimal')
261
264
  inputType = 'number';
262
265
  // TODO: handle props.inputType
263
- let component = (React.createElement("div", { className: `dx-textbox${hasLabel ? ' with-label' : ''}`, style: {} },
266
+ let component = (React.createElement("div", { className: `dx-textbox${hasLabel ? ' with-label' : ''}${props.disabled ? ' disabled' : ''}`, style: {} },
264
267
  props.icon ? React.createElement(GenesysDevIcon, { icon: props.icon, className: 'input-icon' }) : undefined,
265
268
  React.createElement("input", { className: 'dx-input', type: inputType, step: step, value: value, placeholder: props.placeholder, onChange: (e) => setValue(e.target.value), ref: inputRef, onFocus: () => {
266
269
  setIsFocused(true);
@@ -270,25 +273,35 @@ function DxTextbox(props) {
270
273
  setIsFocused(false);
271
274
  if (props.onBlur)
272
275
  props.onBlur();
273
- } }),
274
- props.clearButton && (value || isFocused) ? (React.createElement(GenesysDevIcon, { icon: GenesysDevIcons.AppTimes, className: 'clear-icon', onClick: () => setValue('') })) : undefined));
276
+ }, disabled: props.disabled === true }),
277
+ props.clearButton && (value || isFocused) && !props.disabled ? (React.createElement(GenesysDevIcon, { icon: GenesysDevIcons.AppTimes, className: 'clear-icon', onClick: () => setValue('') })) : undefined));
275
278
  // Render
276
- return (React.createElement(DxLabel, { label: props.label, description: props.description }, component));
279
+ return (React.createElement(DxLabel, { label: props.label, description: props.description, className: props.className }, component));
277
280
  }
278
281
 
279
- 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}";
282
+ 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}";
280
283
  styleInject(css_248z);
281
284
 
282
285
  function DxToggle(props) {
283
- const [value, setValue] = useState(props.isTriState ? props.initialValue : props.initialValue || false);
286
+ let initialValue = props.value !== undefined ? props.value : props.initialValue;
287
+ if (!props.isTriState)
288
+ initialValue = initialValue || false;
289
+ const [value, setValue] = useState(initialValue);
284
290
  const trueIcon = props.trueIcon || GenesysDevIcons.AppCheck;
285
291
  const falseIcon = props.falseIcon || GenesysDevIcons.AppTimes;
292
+ useEffect(() => {
293
+ if (props.initialValue || props.value === value || (!props.isTriState && props.value === undefined))
294
+ return;
295
+ setValue(props.value);
296
+ }, [props.value]);
286
297
  useEffect(() => {
287
298
  if (props.onChange)
288
299
  props.onChange(value);
289
300
  // eslint-disable-next-line react-hooks/exhaustive-deps
290
301
  }, [value]);
291
302
  const toggleValue = () => {
303
+ if (props.disabled)
304
+ return;
292
305
  if (props.isTriState) {
293
306
  if (value === undefined)
294
307
  setValue(true);
@@ -301,8 +314,8 @@ function DxToggle(props) {
301
314
  setValue(!value);
302
315
  }
303
316
  };
304
- return (React.createElement(DxLabel, { label: props.label, description: props.description },
305
- React.createElement("div", { className: 'dx-toggle-container' },
317
+ return (React.createElement(DxLabel, { label: props.label, description: props.description, className: props.className },
318
+ React.createElement("div", { className: `dx-toggle-container${props.disabled ? ' disabled' : ''}` },
306
319
  React.createElement("div", { className: 'dx-toggle', onClick: toggleValue },
307
320
  value !== false ? React.createElement(GenesysDevIcon, { icon: falseIcon }) : undefined,
308
321
  value === true && props.isTriState ? React.createElement("div", { className: 'clear-placeholder' }, "\u00A0") : undefined,
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/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';\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 from 'react';\nimport { BooleanChangedCallback } from '..';\n\nimport './DxCheckbox.scss';\n\ninterface IProps {\n\tlabel: string;\n\tvalue: string;\n\tdescription?: string;\n\tinitialValue?: boolean;\n\tname?: string;\n\tclassName?: string;\n\tonCheckChanged?: BooleanChangedCallback;\n\tuseRadioType?: boolean;\n}\n\nexport default function DxCheckbox(props: IProps) {\n\treturn (\n\t\t<label className={`dx-checkbox ${props.className || ''}`}>\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.value}\n\t\t\t\tchecked={props.initialValue}\n\t\t\t\tonChange={(e) => (props.onCheckChanged ? props.onCheckChanged(e.target.checked) : undefined)}\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, 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\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, 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 (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 = 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<DxCheckbox\n\t\t\t\t\t\t\tkey={i}\n\t\t\t\t\t\t\tname={props.format === 'checkbox' ? `${id}-${i}` : id}\n\t\t\t\t\t\t\tlabel={d.item.label}\n\t\t\t\t\t\t\tvalue={d.item.value}\n\t\t\t\t\t\t\tinitialValue={d.isSelected}\n\t\t\t\t\t\t\tonCheckChanged={(checked) => onChange(i, d.item, checked)}\n\t\t\t\t\t\t/>\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\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, 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 (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 = 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} className={props.className}>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={`dx-item-group${props.format === 'multiselect' ? ' dx-multiselect-group' : ' dx-select-group'}${\n\t\t\t\t\t\t\tprops.disabled ? ' disabled' : ''\n\t\t\t\t\t\t}`}\n\t\t\t\t\t>\n\t\t\t\t\t\t<select multiple={props.format === 'multiselect'} disabled={props.disabled === true}>\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={props.title}\n\t\t\t\t\tdescription={props.description}\n\t\t\t\t\tclassName={`dx-item-group${props.disabled ? ' disabled' : ''}${props.className ? ' ' + props.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={i}\n\t\t\t\t\t\t\tname={props.format === 'checkbox' ? `${id}-${i}` : 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) => onChange(i, d.item, checked)}\n\t\t\t\t\t\t\tuseRadioType={props.format === 'radio'}\n\t\t\t\t\t\t\tdisabled={props.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":";;;;AAAA,SAAS,WAAW,CAAC,GAAG,EAAE,GAAG,EAAE;AAC/B,EAAE,KAAK,GAAG,KAAK,KAAK,CAAC,GAAG,GAAG,GAAG,EAAE,CAAC;AACjC,EAAE,IAAI,QAAQ,GAAG,GAAG,CAAC,QAAQ,CAAC;AAC9B;AACA,EAAE,IAAI,CAAC,GAAG,IAAI,OAAO,QAAQ,KAAK,WAAW,EAAE,EAAE,OAAO,EAAE;AAC1D;AACA,EAAE,IAAI,IAAI,GAAG,QAAQ,CAAC,IAAI,IAAI,QAAQ,CAAC,oBAAoB,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC;AACvE,EAAE,IAAI,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;AAC9C,EAAE,KAAK,CAAC,IAAI,GAAG,UAAU,CAAC;AAC1B;AACA,EAAE,IAAI,QAAQ,KAAK,KAAK,EAAE;AAC1B,IAAI,IAAI,IAAI,CAAC,UAAU,EAAE;AACzB,MAAM,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;AAChD,KAAK,MAAM;AACX,MAAM,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;AAC9B,KAAK;AACL,GAAG,MAAM;AACT,IAAI,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;AAC5B,GAAG;AACH;AACA,EAAE,IAAI,KAAK,CAAC,UAAU,EAAE;AACxB,IAAI,KAAK,CAAC,UAAU,CAAC,OAAO,GAAG,GAAG,CAAC;AACnC,GAAG,MAAM;AACT,IAAI,KAAK,CAAC,WAAW,CAAC,QAAQ,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC,CAAC;AACpD,GAAG;AACH;;;;;SCnBwB,WAAW,CAAC,KAAuB;IAC1D,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,CAAC;IAE9D,QACC,6BAAK,SAAS,EAAE,eAAe,KAAK,CAAC,SAAS,GAAG,GAAG,GAAG,KAAK,CAAC,SAAS,GAAG,EAAE,EAAE;QAC5E,6BAAK,SAAS,EAAC,mBAAmB,EAAC,OAAO,EAAE,MAAM,SAAS,CAAC,CAAC,MAAM,CAAC;YAClE,KAAK,CAAC,KAAK;;YAAE,oBAAC,cAAc,IAAC,IAAI,EAAE,MAAM,GAAG,eAAe,CAAC,YAAY,GAAG,eAAe,CAAC,cAAc,GAAI,CACzG;QACL,MAAM,GAAG,6BAAK,SAAS,EAAC,mBAAmB,IAAE,KAAK,CAAC,QAAQ,CAAO,GAAG,SAAS,CAC1E,EACL;AACH;;;;;SCRwB,gBAAgB,CAAC,KAAa;IACrD,OAAO,6BAAK,SAAS,EAAE,qBAAqB,KAAK,CAAC,SAAS,GAAG,GAAG,GAAG,KAAK,CAAC,SAAS,GAAG,EAAE,EAAE,IAAG,KAAK,CAAC,QAAQ,CAAO,CAAC;AACpH;;;;;SCEwB,QAAQ,CAAC,KAAa;IAC7C,IAAI,UAAU,GAAG,CAAC,WAAW,CAAC,CAAC;IAC/B,UAAU,CAAC,IAAI,CAAC,aAAa,KAAK,CAAC,IAAI,IAAI,SAAS,EAAE,CAAC,CAAC;IACxD,IAAI,KAAK,CAAC,SAAS;QAAE,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;IAEtD,MAAM,WAAW,GAAG,CAAC,CAAkD;QACtE,IAAI,CAAC,KAAK,CAAC,OAAO;YAAE,OAAO;QAC3B,CAAC,CAAC,cAAc,EAAE,CAAC;QACnB,CAAC,CAAC,eAAe,EAAE,CAAC;QACpB,KAAK,CAAC,OAAO,EAAE,CAAC;KAChB,CAAC;IAEF,QACC,gCAAQ,SAAS,EAAE,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,KAAK,IAAI,IAC5G,KAAK,CAAC,QAAQ,CACP,EACR;AACH;;;;;;;;;;;;;;;;;SCjBwB,OAAO,CAAC,KAAa;IAC5C,MAAM,QAAQ,GAAG,KAAK,CAAC,KAAK,IAAI,KAAK,CAAC,KAAK,KAAK,EAAE,CAAC;IAEnD,MAAM,WAAW,GAAG,KAAK,CAAC,WAAW,IACpC,6BAAK,SAAS,EAAC,mBAAmB;QACjC,oBAAC,cAAc,IAAC,IAAI,EAAE,eAAe,CAAC,YAAY,GAAI;QACtD,kCAAO,KAAK,CAAC,WAAW,CAAQ,CAC3B,IACH,SAAS,CAAC;IAEd,MAAM,QAAQ,IACb,oBAAC,KAAK,CAAC,QAAQ;QACb,GAAG;QACH,QAAQ,GAAG,8BAAM,SAAS,EAAC,YAAY,IAAE,KAAK,CAAC,KAAK,CAAQ,GAAG,SAAS;QACxE,KAAK,CAAC,QAAQ;QACd,WAAW,CACI,CACjB,CAAC;IAEF,MAAM,SAAS,GAAG,WAAW,KAAK,CAAC,SAAS,GAAG,GAAG,GAAG,KAAK,CAAC,SAAS,GAAG,EAAE,EAAE,CAAC;IAE5E,IAAI,KAAK,CAAC,WAAW,EAAE;QACtB,OAAO,kCAAU,SAAS,EAAE,SAAS,IAAG,QAAQ,CAAY,CAAC;KAC7D;IACD,OAAO,+BAAO,SAAS,EAAE,SAAS,IAAG,QAAQ,CAAS,CAAC;AACxD;;;;;SCpBwB,UAAU,CAAC,KAAa;IAC/C,IAAI,YAAY,GAAY,KAAK,CAAC,OAAO,KAAK,SAAS,GAAG,KAAK,CAAC,OAAO,GAAG,KAAK,CAAC,gBAAgB,IAAI,KAAK,CAAC;IAE1G,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAU,YAAY,CAAC,CAAC;IAE9D,SAAS,CAAC;QACT,IAAI,KAAK,CAAC,OAAO,KAAK,SAAS,IAAI,KAAK,CAAC,OAAO,KAAK,OAAO;YAAE,OAAO;QACrE,UAAU,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;KAC1B,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;IAEpB,SAAS,CAAC;QACT,IAAI,KAAK,CAAC,cAAc;YAAE,KAAK,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC;KACxD,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,QACC,+BAAO,SAAS,EAAE,cAAc,KAAK,CAAC,SAAS,GAAG,GAAG,GAAG,KAAK,CAAC,SAAS,GAAG,EAAE,GAAG,KAAK,CAAC,QAAQ,GAAG,WAAW,GAAG,EAAE,EAAE;QACjH,+BACC,IAAI,EAAE,KAAK,CAAC,YAAY,GAAG,OAAO,GAAG,UAAU,EAC/C,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,EAAE,EAAE,KAAK,CAAC,KAAK,EACf,KAAK,EAAE,KAAK,CAAC,SAAS,EACtB,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,CAAC,CAAC,KAAK,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,EAC7C,QAAQ,EAAE,KAAK,CAAC,QAAQ,KAAK,IAAI,GAChC;QACF,8BAAM,SAAS,EAAC,YAAY,IAAE,KAAK,CAAC,KAAK,CAAQ,CAC1C,EACP;AACH;;SCnCwB,WAAW,CAAC,KAAuB;IAC1D,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAC/B,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI;QACpB,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,CAAC;KACnC,CAAC,CACF,CAAC;IACF,MAAM,CAAC,EAAE,CAAC,GAAG,QAAQ,CAACA,EAAI,EAAE,CAAC,CAAC;;IAG9B,SAAS,CAAC;QACT,IAAI,KAAK,CAAC,cAAc;YAAE,KAAK,CAAC,cAAc,CAAC,IAAI,CAAC,CAAC;;KAErD,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;;IAGX,MAAM,QAAQ,GAAG,CAAC,GAAW,EAAE,IAAqB,EAAE,OAAgB;QACrE,IAAI,KAAK,CAAC,aAAa;YAAE,KAAK,CAAC,aAAa,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;QAC5D,IAAI,OAAO,GAAG,CAAC,GAAG,IAAI,CAAC,CAAC;;QAExB,IAAI,KAAK,CAAC,MAAM,KAAK,OAAO;YAAE,OAAO,CAAC,OAAO,CAAC,CAAC,KAAK,MAAM,KAAK,CAAC,UAAU,GAAG,KAAK,CAAC,CAAC,CAAC;;QAErF,OAAO,CAAC,GAAG,CAAC,CAAC,UAAU,GAAG,OAAO,CAAC;QAClC,OAAO,CAAC,OAAO,CAAC,CAAC;KACjB,CAAC;IAEF,QAAQ,KAAK,CAAC,MAAM;QACnB,KAAK,aAAa,CAAC;QACnB,KAAK,UAAU,EAAE;YAChB,QACC,oBAAC,OAAO,IAAC,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,WAAW,EAAE,KAAK,CAAC,WAAW,EAAE,SAAS,EAAE,KAAK,CAAC,SAAS;gBACtF,6BACC,SAAS,EAAE,gBAAgB,KAAK,CAAC,MAAM,KAAK,aAAa,GAAG,uBAAuB,GAAG,kBAAkB,GACvG,KAAK,CAAC,QAAQ,GAAG,WAAW,GAAG,EAChC,EAAE;oBAEF,gCAAQ,QAAQ,EAAE,KAAK,CAAC,MAAM,KAAK,aAAa,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,KAAK,IAAI,IACjF,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,MACd,gCAAQ,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAC,IAAI,CAAC,QAAQ,IAC5D,CAAC,CAAC,IAAI,CAAC,KAAK,CACL,CACT,CAAC,CACM,CACJ,CACG,EACT;SACF;QACD,KAAK,UAAU,CAAC;QAChB,KAAK,OAAO,CAAC;QACb,SAAS;YACR,QACC,oBAAC,OAAO,IACP,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,WAAW,EAAE,KAAK,CAAC,WAAW,EAC9B,SAAS,EAAE,gBAAgB,KAAK,CAAC,QAAQ,GAAG,WAAW,GAAG,EAAE,GAAG,KAAK,CAAC,SAAS,GAAG,GAAG,GAAG,KAAK,CAAC,SAAS,GAAG,EAAE,EAAE,EAC7G,WAAW,EAAE,IAAI,IAEhB,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,MACd,oBAAC,UAAU,IACV,GAAG,EAAE,CAAC,EACN,IAAI,EAAE,KAAK,CAAC,MAAM,KAAK,UAAU,GAAG,GAAG,EAAE,IAAI,CAAC,EAAE,GAAG,EAAE,EACrD,KAAK,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK,EACnB,SAAS,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK,EACvB,gBAAgB,EAAE,CAAC,CAAC,UAAU,EAC9B,cAAc,EAAE,CAAC,OAAO,KAAK,QAAQ,CAAC,CAAC,EAAE,CAAC,CAAC,IAAI,EAAE,OAAO,CAAC,EACzD,YAAY,EAAE,KAAK,CAAC,MAAM,KAAK,OAAO,EACtC,QAAQ,EAAE,KAAK,CAAC,QAAQ,IAAI,CAAC,CAAC,IAAI,CAAC,QAAQ,GAC1C,CACF,CAAC,CACO,EACT;SACF;KACD;AACF;;;;;SC9EwB,eAAe,CAAC,KAA2B;IAClE,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,YAAY,IAAI,CAAC,CAAC,CAAC;IACpE,MAAM,CAAC,MAAM,CAAC,GAAG,QAAQ;;IAExB,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,CAAC,KAAU;QACrD,IAAI,CAAC,KAAK,IAAI,CAAC,KAAK,CAAC,KAAK,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK;YAAE,OAAO,eAAe,CAAC;QACzE,OAAO,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC;KACzB,CAAC,CACF,CAAC;IAEF,QACC,6BAAK,SAAS,EAAE,oBAAoB,KAAK,CAAC,SAAS,GAAG,GAAG,GAAG,KAAK,CAAC,SAAS,GAAG,EAAE,EAAE;QACjF,6BAAK,SAAS,EAAC,YAAY,IACzB,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,CAAC,MACpB,8BAAM,GAAG,EAAE,CAAC,EAAE,SAAS,EAAE,YAAY,CAAC,KAAK,SAAS,GAAG,SAAS,GAAG,EAAE,EAAE,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC,CAAC,CAAC,IACrG,KAAK,CACA,CACP,CAAC,CACG;QACN,6BAAK,SAAS,EAAC,aAAa,IAAE,KAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,SAAS,CAAC,CAAO,CACjF,EACL;AACH;;;;;SCtBwB,UAAU,CAAC,KAAsB;IACxD,OAAO,6BAAK,SAAS,EAAE,eAAe,KAAK,CAAC,SAAS,GAAG,GAAG,GAAG,KAAK,CAAC,SAAS,GAAG,EAAE,EAAE,IAAG,KAAK,CAAC,QAAQ,CAAO,CAAC;AAC9G;;;;;SCAwB,SAAS,CAAC,KAAqB;IACtD,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,gBAAgB,IAAI,GAAG,CAAC,CAAC;IAC5E,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,YAAY,IAAI,KAAK,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC;IAC5E,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClD,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC;IAC/D,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAA8B,SAAS,CAAC,CAAC;IACzE,IAAI,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,SAAqD,CAAC,CAAC;;IAGxF,SAAS,CAAC;;QAET,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,iBAAiB,EAAE,KAAK,CAAC,CAAC;QAE/D,OAAO;YACN,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,iBAAiB,EAAE,KAAK,CAAC,CAAC;SAClE,CAAC;KACF,EAAE,EAAE,CAAC,CAAC;;IAGP,SAAS,CAAC;QACT,QAAQ,CAAC,KAAK,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC;KAC5B,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;;IAGlB,SAAS,CAAC;;QACT,IAAI,CAAC,SAAS;YAAE,OAAO;QACvB,QAAQ,CAAC,EAAE,CAAC,CAAC;QACb,MAAA,QAAQ,CAAC,OAAO,0CAAE,IAAI,EAAE,CAAC;;KAEzB,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;;IAGpB,SAAS,CAAC;QACT,IAAI,KAAK,CAAC,SAAS,KAAK,SAAS,EAAE;;YAElC,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,EAAE;gBAC9B,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;gBACnC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;gBACnB,IAAI,KAAK,EAAE;oBACV,MAAM,CAAC,GAAG,KAAK,KAAK,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;yBAC1D,GAAG,CAAC,MAAM,GAAG,CAAC;yBACd,IAAI,CAAC,EAAE,CAAC,GAAG,CAAC;oBACd,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;oBACf,OAAO,CAAC,CAAC,CAAC,CAAC;iBACX;aACD;SACD;aAAM,IAAI,KAAK,CAAC,SAAS,KAAK,SAAS,EAAE;;YAEzC,QAAQ,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC;SACrC;;QAGD,IAAI,CAAC,KAAK,CAAC,QAAQ;YAAE,OAAO;QAC5B,YAAY,CAAC,KAAK,CAAC,CAAC;QACpB,QAAQ,CAAC,UAAU,CAAC,OAAO,KAAK,CAAC,QAAQ,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,SAAS,CAAC,EAAE,UAAU,CAAC,CAAC,CAAC;;KAE7F,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;;IAGZ,SAAS,CAAC;QACT,aAAa,CAAC,KAAK,CAAC,gBAAgB,IAAI,GAAG,CAAC,CAAC;KAC7C,EAAE,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC;;IAG7B,IAAI,QAAQ,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IAC9C,IAAI,KAAK,CAAC,QAAQ;QAAE,QAAQ,GAAG,KAAK,CAAC,QAAQ,CAAC;IAC9C,MAAM,QAAQ,GAAG,KAAK,CAAC,KAAK,IAAI,KAAK,CAAC,KAAK,KAAK,EAAE,CAAC;;IAGnD,SAAS,iBAAiB,CAAC,KAAoB;;QAE9C,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,EAAE;YAC3B,KAAK,CAAC,eAAe,EAAE,CAAC;YACxB,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,gBAAgB,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC;YAC7B,OAAO;SACP;KACD;;IAGD,IAAI,SAAS,GAA6C,KAAK,CAAC,SAAS,CAAC;IAC1E,IAAI,SAAS,KAAK,SAAS,IAAI,SAAS,KAAK,SAAS;QAAE,SAAS,GAAG,QAAQ,CAAC;;IAG7E,IAAI,SAAS,IACZ,6BAAK,SAAS,EAAE,aAAa,QAAQ,GAAG,aAAa,GAAG,EAAE,GAAG,KAAK,CAAC,QAAQ,GAAG,WAAW,GAAG,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE;QACzG,KAAK,CAAC,IAAI,GAAG,oBAAC,cAAc,IAAC,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,SAAS,EAAC,YAAY,GAAG,GAAG,SAAS;QACrF,+BACC,SAAS,EAAC,UAAU,EACpB,IAAI,EAAE,SAAS,EACf,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,KAAK,CAAC,WAAW,EAC9B,QAAQ,EAAE,CAAC,CAAC,KAAK,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EACzC,GAAG,EAAE,QAAQ,EACb,OAAO,EAAE;gBACR,YAAY,CAAC,IAAI,CAAC,CAAC;gBACnB,IAAI,KAAK,CAAC,OAAO;oBAAE,KAAK,CAAC,OAAO,EAAE,CAAC;aACnC,EACD,MAAM,EAAE;gBACP,YAAY,CAAC,KAAK,CAAC,CAAC;gBACpB,IAAI,KAAK,CAAC,MAAM;oBAAE,KAAK,CAAC,MAAM,EAAE,CAAC;aACjC,EACD,QAAQ,EAAE,KAAK,CAAC,QAAQ,KAAK,IAAI,GAChC;QACD,KAAK,CAAC,WAAW,KAAK,KAAK,IAAI,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,IAC5D,oBAAC,cAAc,IAAC,IAAI,EAAE,eAAe,CAAC,QAAQ,EAAE,SAAS,EAAC,YAAY,EAAC,OAAO,EAAE,MAAM,QAAQ,CAAC,EAAE,CAAC,GAAI,IACnG,SAAS,CACR,CACN,CAAC;;IAGF,QACC,oBAAC,OAAO,IAAC,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,WAAW,EAAE,KAAK,CAAC,WAAW,EAAE,SAAS,EAAE,KAAK,CAAC,SAAS,IACrF,SAAS,CACD,EACT;AACH;;;;;SCrHwB,QAAQ,CAAC,KAAoB;IACpD,IAAI,YAAY,GAAwB,KAAK,CAAC,KAAK,KAAK,SAAS,GAAG,KAAK,CAAC,KAAK,GAAG,KAAK,CAAC,YAAY,CAAC;IACrG,IAAI,CAAC,KAAK,CAAC,UAAU;QAAE,YAAY,GAAG,YAAY,IAAI,KAAK,CAAC;IAE5D,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAsB,YAAY,CAAC,CAAC;IAEtE,MAAM,QAAQ,GAAG,KAAK,CAAC,QAAQ,IAAI,eAAe,CAAC,QAAQ,CAAC;IAC5D,MAAM,SAAS,GAAG,KAAK,CAAC,SAAS,IAAI,eAAe,CAAC,QAAQ,CAAC;IAE9D,SAAS,CAAC;QACT,IAAI,KAAK,CAAC,YAAY,IAAI,KAAK,CAAC,KAAK,KAAK,KAAK,KAAK,CAAC,KAAK,CAAC,UAAU,IAAI,KAAK,CAAC,KAAK,KAAK,SAAS,CAAC;YAAE,OAAO;QAC5G,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;KACtB,EAAE,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;IAElB,SAAS,CAAC;QACT,IAAI,KAAK,CAAC,QAAQ;YAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;;KAE1C,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,MAAM,WAAW,GAAG;QACnB,IAAI,KAAK,CAAC,QAAQ;YAAE,OAAO;QAC3B,IAAI,KAAK,CAAC,UAAU,EAAE;YACrB,IAAI,KAAK,KAAK,SAAS;gBAAE,QAAQ,CAAC,IAAI,CAAC,CAAC;iBACnC,IAAI,KAAK,KAAK,IAAI;gBAAE,QAAQ,CAAC,KAAK,CAAC,CAAC;;gBACpC,QAAQ,CAAC,SAAS,CAAC,CAAC;SACzB;aAAM;YACN,QAAQ,CAAC,CAAC,KAAK,CAAC,CAAC;SACjB;KACD,CAAC;IAEF,QACC,oBAAC,OAAO,IAAC,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,WAAW,EAAE,KAAK,CAAC,WAAW,EAAE,SAAS,EAAE,KAAK,CAAC,SAAS;QACtF,6BAAK,SAAS,EAAE,sBAAsB,KAAK,CAAC,QAAQ,GAAG,WAAW,GAAG,EAAE,EAAE;YACxE,6BAAK,SAAS,EAAC,WAAW,EAAC,OAAO,EAAE,WAAW;gBAC7C,KAAK,KAAK,KAAK,GAAG,oBAAC,cAAc,IAAC,IAAI,EAAE,SAAS,GAAI,GAAG,SAAS;gBACjE,KAAK,KAAK,IAAI,IAAI,KAAK,CAAC,UAAU,GAAG,6BAAK,SAAS,EAAC,mBAAmB,aAAa,GAAG,SAAS;gBACjG,6BAAK,SAAS,EAAC,QAAQ,IAAE,KAAK,KAAK,SAAS,GAAG,oBAAC,cAAc,IAAC,IAAI,EAAE,KAAK,GAAG,QAAQ,GAAG,SAAS,GAAI,GAAG,SAAS,CAAO;gBACvH,KAAK,KAAK,KAAK,IAAI,KAAK,CAAC,UAAU,GAAG,6BAAK,SAAS,EAAC,mBAAmB,aAAa,GAAG,SAAS;gBACjG,KAAK,KAAK,IAAI,GAAG,oBAAC,cAAc,IAAC,IAAI,EAAE,QAAQ,GAAI,GAAG,SAAS,CAC3D,CACD,CACG,EACT;AACH;;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "genesys-react-components",
3
- "version": "0.1.0-alpha.6",
3
+ "version": "0.1.0-alpha.7",
4
4
  "description": "A React component library containing standardized form elements.",
5
5
  "main": "build/index.js",
6
6
  "module": "build/index.js",