td-stylekit 26.1.0 → 26.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +7 -0
- package/dist/es/DataGrid/elements.d.ts +6 -31
- package/dist/es/DateControl/DateControl.d.ts +1 -1
- package/dist/es/DateControl/elements.d.ts +7 -7
- package/dist/es/DateField/DateField.d.ts +1 -1
- package/dist/es/FormControl/FormControl.d.ts +5 -5
- package/dist/es/FormControl/components/CheckboxGroup.d.ts +1 -1
- package/dist/es/FormControl/components/CheckboxGroup.js +1 -1
- package/dist/es/FormControl/components/RadioGroup.d.ts +1 -1
- package/dist/es/FormControl/components/RadioGroup.js +1 -1
- package/dist/es/FormField/FormField.d.ts +5 -5
- package/dist/es/FormField/FormField.js +4 -1
- package/dist/es/Input/Input.d.ts +21 -15
- package/dist/es/Input/Input.js +29 -30
- package/dist/es/MultiSelect/elements.d.ts +1 -1
- package/dist/es/Select/Select.d.ts +3 -3
- package/dist/es/Select/Select.js +2 -2
- package/dist/es/Select/utils.d.ts +1 -1
- package/dist/es/Slider/elements.d.ts +7 -6
- package/dist/es/Tagger/components/PopupSelector.js +2 -1
- package/dist/es/Tagger/components/PopupSelectorElements.d.ts +10 -7
- package/dist/es/Tagger/components/PopupSelectorElements.js +11 -11
- package/dist/es/TimeControl/elements.d.ts +7 -7
- package/dist/es/TimeField/TimeField.d.ts +2 -2
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,10 @@
|
|
|
1
|
+
## [26.1.1](https://github.com/treasure-data/td-stylekit/compare/v26.1.0...v26.1.1) (2022-03-31)
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
### Bug Fixes
|
|
5
|
+
|
|
6
|
+
* **CON-9160:** Remove generics from FormControl and FormField components ([#1257](https://github.com/treasure-data/td-stylekit/issues/1257)) ([8f38b83](https://github.com/treasure-data/td-stylekit/commit/8f38b83))
|
|
7
|
+
|
|
1
8
|
# [26.1.0](https://github.com/treasure-data/td-stylekit/compare/v26.0.0...v26.1.0) (2022-03-28)
|
|
2
9
|
|
|
3
10
|
|
|
@@ -86,35 +86,10 @@ export declare const SortButton: StyledComponent<{
|
|
|
86
86
|
declare type InlineInputProps = {
|
|
87
87
|
textAlign?: 'right' | 'left';
|
|
88
88
|
};
|
|
89
|
-
export declare const InlineInput: StyledComponent<{
|
|
90
|
-
className?: string | undefined;
|
|
91
|
-
disabled?: boolean | undefined;
|
|
92
|
-
'data-instrumentation'?: string | undefined;
|
|
93
|
-
id?: string | undefined;
|
|
94
|
-
inline?: boolean | undefined;
|
|
95
|
-
inputRef?: any;
|
|
96
|
-
invalid?: boolean | undefined;
|
|
97
|
-
max?: number | undefined;
|
|
98
|
-
min?: number | undefined;
|
|
99
|
-
name: string;
|
|
100
|
-
onBlur?: ((event: import("react").FocusEvent<HTMLInputElement | HTMLTextAreaElement>) => void) | undefined;
|
|
101
|
-
onChange: (arg0: {
|
|
102
|
-
name: string;
|
|
103
|
-
value?: string | number | undefined;
|
|
104
|
-
}) => void;
|
|
105
|
-
placeholder?: string | undefined;
|
|
106
|
-
type?: ("number" | ("textarea" | "text" | "url" | "email" | "datetime-local" | "password")) | undefined;
|
|
107
|
-
value: string | number;
|
|
108
|
-
variant?: ("primary" | "secondary" | {
|
|
109
|
-
borderBottomColor: string;
|
|
110
|
-
color: string;
|
|
111
|
-
focusBorderColor: string;
|
|
112
|
-
placeholderColor: string;
|
|
113
|
-
}) | undefined;
|
|
114
|
-
} & Omit<import("react").InputHTMLAttributes<HTMLInputElement>, "onChange"> & Omit<import("react").TextareaHTMLAttributes<HTMLTextAreaElement>, "onChange"> & {
|
|
89
|
+
export declare const InlineInput: StyledComponent<(import("../Input").InputProps & {
|
|
115
90
|
theme?: import("@emotion/react").Theme | undefined;
|
|
116
|
-
} & InlineInputProps, {}, {
|
|
117
|
-
ref?: import("react").Ref<Input
|
|
91
|
+
}) & InlineInputProps, {}, {
|
|
92
|
+
ref?: import("react").Ref<Input> | undefined;
|
|
118
93
|
}>;
|
|
119
94
|
export declare const SelectWrapper: StyledComponent<{
|
|
120
95
|
theme?: import("@emotion/react").Theme | undefined;
|
|
@@ -158,9 +133,9 @@ export declare const OperatorSelect: StyledComponent<((import("../Select").Selec
|
|
|
158
133
|
multi?: boolean | undefined;
|
|
159
134
|
name: string;
|
|
160
135
|
noResultsMessage?: string | undefined;
|
|
161
|
-
onChange: (
|
|
136
|
+
onChange: (event: {
|
|
162
137
|
name: string;
|
|
163
|
-
value: any;
|
|
138
|
+
value: string | number | any[] | null;
|
|
164
139
|
}) => void;
|
|
165
140
|
optionHeight?: number | undefined;
|
|
166
141
|
optionRenderer?: ((props: import("../Select/components").OptionRendererProps) => import("react").ReactNode) | undefined;
|
|
@@ -170,7 +145,7 @@ export declare const OperatorSelect: StyledComponent<((import("../Select").Selec
|
|
|
170
145
|
textOnly?: boolean | undefined;
|
|
171
146
|
selectRef?: import("react").MutableRefObject<HTMLInputElement | null> | ((instance: HTMLInputElement | null) => void) | undefined;
|
|
172
147
|
style?: import("@emotion/serialize").CSSObject | undefined;
|
|
173
|
-
value?: string | number | any[] | undefined;
|
|
148
|
+
value?: string | number | any[] | null | undefined;
|
|
174
149
|
warning?: boolean | undefined;
|
|
175
150
|
width?: string | undefined;
|
|
176
151
|
} & Omit<import("react-select").Props<{
|
|
@@ -10,7 +10,7 @@ export declare const FORMAT_HOUR24_ERROR_MESSAGE: string;
|
|
|
10
10
|
export declare const HOUR12_DATE_FORMAT = "MMM DD, YYYY hh:mm:ss A";
|
|
11
11
|
export declare const FORMAT_HOUR12_ERROR_MESSAGE: string;
|
|
12
12
|
export declare const DISABLED_DAY_ERROR_MESSAGE = "That date is disabled";
|
|
13
|
-
export declare type DateControlProps = Omit<FormControlProps
|
|
13
|
+
export declare type DateControlProps = Omit<FormControlProps, 'blockLabel' | 'label' | 'labelWidth' | 'onChange' | 'type' | 'value'> & Pick<DatePickerProps, 'variant' | 'disabledDays'> & {
|
|
14
14
|
blockLabel?: boolean;
|
|
15
15
|
clearable?: boolean;
|
|
16
16
|
/** Date format used for displaying dates; defaults to 'MMM DD, YYYY' */
|
|
@@ -86,7 +86,7 @@ export declare const DateFormControl: import("@emotion/styled").StyledComponent<
|
|
|
86
86
|
labelWidth?: string | number | undefined;
|
|
87
87
|
inputCss?: import("@emotion/serialize").Interpolation<any>;
|
|
88
88
|
options?: any;
|
|
89
|
-
} & import("../
|
|
89
|
+
} & Omit<import("../Input").InputProps, "label">, "form" | "style" | "title" | "pattern" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "lang" | "placeholder" | "slot" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "readOnly" | "checked" | "height" | "width" | "wrap" | "inline" | "rows" | "max" | "min" | "crossOrigin" | "autoFocus" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "list" | "step" | "multiple" | "accept" | "alt" | "autoComplete" | "capture" | "maxLength" | "minLength" | "src" | "cols" | "dirName" | "variant" | "inputRef"> & Partial<Pick<{
|
|
90
90
|
addOnClassName?: string | undefined;
|
|
91
91
|
blockLabel?: boolean | undefined;
|
|
92
92
|
'data-gs-c'?: Function | undefined;
|
|
@@ -114,7 +114,7 @@ export declare const DateFormControl: import("@emotion/styled").StyledComponent<
|
|
|
114
114
|
labelWidth?: string | number | undefined;
|
|
115
115
|
inputCss?: import("@emotion/serialize").Interpolation<any>;
|
|
116
116
|
options?: any;
|
|
117
|
-
} & import("../
|
|
117
|
+
} & Omit<import("../Input").InputProps, "label">, "value" | "label" | "className" | "id" | "onChange" | "disabled" | "error" | "required" | "invalid" | "name" | "type" | "data-instrumentation" | "getRef" | "size" | "data-gs-c" | "labelWidth" | "showFullError" | "showFullHint" | "showFullInfo" | "showFullWarning" | "hint" | "info" | "hintNode" | "truncateErrors" | "truncateWarnings" | "options" | "isClearable" | "warning" | "showFullLabel" | "addOnClassName" | "valueCanBeNull" | "blockLabel" | "inputCss">> & Partial<Pick<Partial<import("../FormControl").FormControlProps>, never>>) | (Pick<{
|
|
118
118
|
addOnClassName?: string | undefined;
|
|
119
119
|
blockLabel?: boolean | undefined;
|
|
120
120
|
'data-gs-c'?: Function | undefined;
|
|
@@ -142,7 +142,7 @@ export declare const DateFormControl: import("@emotion/styled").StyledComponent<
|
|
|
142
142
|
labelWidth?: string | number | undefined;
|
|
143
143
|
inputCss?: import("@emotion/serialize").Interpolation<any>;
|
|
144
144
|
options?: any;
|
|
145
|
-
} & import("../FormControl/components/
|
|
145
|
+
} & import("../FormControl/components/CheckboxGroup").CheckboxGroupProps, "getLabelForOption" | "disabledOptions"> & Partial<Pick<{
|
|
146
146
|
addOnClassName?: string | undefined;
|
|
147
147
|
blockLabel?: boolean | undefined;
|
|
148
148
|
'data-gs-c'?: Function | undefined;
|
|
@@ -170,7 +170,7 @@ export declare const DateFormControl: import("@emotion/styled").StyledComponent<
|
|
|
170
170
|
labelWidth?: string | number | undefined;
|
|
171
171
|
inputCss?: import("@emotion/serialize").Interpolation<any>;
|
|
172
172
|
options?: any;
|
|
173
|
-
} & import("../FormControl/components/
|
|
173
|
+
} & import("../FormControl/components/CheckboxGroup").CheckboxGroupProps, "value" | "label" | "className" | "id" | "onChange" | "disabled" | "error" | "required" | "invalid" | "name" | "type" | "data-instrumentation" | "getRef" | "size" | "data-gs-c" | "labelWidth" | "showFullError" | "showFullHint" | "showFullInfo" | "showFullWarning" | "hint" | "info" | "hintNode" | "truncateErrors" | "truncateWarnings" | "options" | "isClearable" | "warning" | "showFullLabel" | "addOnClassName" | "valueCanBeNull" | "blockLabel" | "inputCss">> & Partial<Pick<Partial<import("../FormControl").FormControlProps>, never>>) | (Pick<{
|
|
174
174
|
addOnClassName?: string | undefined;
|
|
175
175
|
blockLabel?: boolean | undefined;
|
|
176
176
|
'data-gs-c'?: Function | undefined;
|
|
@@ -198,7 +198,7 @@ export declare const DateFormControl: import("@emotion/styled").StyledComponent<
|
|
|
198
198
|
labelWidth?: string | number | undefined;
|
|
199
199
|
inputCss?: import("@emotion/serialize").Interpolation<any>;
|
|
200
200
|
options?: any;
|
|
201
|
-
} &
|
|
201
|
+
} & import("../FormControl/components/RadioGroup").RadioGroupProps, "getLabelForOption" | "disabledOptions"> & Partial<Pick<{
|
|
202
202
|
addOnClassName?: string | undefined;
|
|
203
203
|
blockLabel?: boolean | undefined;
|
|
204
204
|
'data-gs-c'?: Function | undefined;
|
|
@@ -226,11 +226,11 @@ export declare const DateFormControl: import("@emotion/styled").StyledComponent<
|
|
|
226
226
|
labelWidth?: string | number | undefined;
|
|
227
227
|
inputCss?: import("@emotion/serialize").Interpolation<any>;
|
|
228
228
|
options?: any;
|
|
229
|
-
} &
|
|
229
|
+
} & import("../FormControl/components/RadioGroup").RadioGroupProps, "value" | "label" | "className" | "id" | "onChange" | "disabled" | "error" | "required" | "invalid" | "name" | "type" | "data-instrumentation" | "getRef" | "size" | "data-gs-c" | "labelWidth" | "showFullError" | "showFullHint" | "showFullInfo" | "showFullWarning" | "hint" | "info" | "hintNode" | "truncateErrors" | "truncateWarnings" | "options" | "isClearable" | "warning" | "showFullLabel" | "addOnClassName" | "valueCanBeNull" | "blockLabel" | "inputCss">> & Partial<Pick<Partial<import("../FormControl").FormControlProps>, never>>)) & {
|
|
230
230
|
theme?: import("@emotion/react").Theme | undefined;
|
|
231
231
|
}) & {
|
|
232
232
|
variant: string;
|
|
233
233
|
}, {}, {
|
|
234
|
-
ref?: import("react").Ref<FormControl
|
|
234
|
+
ref?: import("react").Ref<FormControl> | undefined;
|
|
235
235
|
}>;
|
|
236
236
|
//# sourceMappingURL=elements.d.ts.map
|
|
@@ -6,7 +6,7 @@ export declare const FORMAT_DATE_ERROR_MESSAGE = "Format MM/DD/YYYY";
|
|
|
6
6
|
export declare const DATE_FORMAT = "YYYY-MM-DD HH:mm:ss";
|
|
7
7
|
export declare const FORMAT_ERROR_MESSAGE: string;
|
|
8
8
|
export declare const DISABLED_DAY_ERROR_MESSAGE = "That date is disabled";
|
|
9
|
-
export declare type DateFieldProps = Omit<FormFieldProps
|
|
9
|
+
export declare type DateFieldProps = Omit<FormFieldProps, 'value' | 'onChange' | 'type'> & {
|
|
10
10
|
clearable?: boolean;
|
|
11
11
|
disabledDays?: (date: Date) => boolean;
|
|
12
12
|
/** Dates after today should be selectable; defaults to true */
|
|
@@ -11,8 +11,8 @@ declare type FormControlTypeRadio = 'radio';
|
|
|
11
11
|
declare type FormControlTypeCheckbox = 'checkbox';
|
|
12
12
|
declare type FormControlTypeInput = 'datetime-local' | 'email' | 'number' | 'password' | 'text' | 'textarea' | 'url';
|
|
13
13
|
export declare type FormControlTypes = FormControlTypeSelect | FormControlTypeInput | FormControlTypeRadio | FormControlTypeCheckbox;
|
|
14
|
-
export declare type FormControlElementTypes
|
|
15
|
-
export declare type FormControlProps
|
|
14
|
+
export declare type FormControlElementTypes = Omit<SelectComponentProps, 'label'> | Omit<InputProps, 'label'> | RadioGroupProps | CheckboxGroupProps;
|
|
15
|
+
export declare type FormControlProps = {
|
|
16
16
|
addOnClassName?: string;
|
|
17
17
|
/** Display label above form control */
|
|
18
18
|
blockLabel?: boolean;
|
|
@@ -37,7 +37,7 @@ export declare type FormControlProps<T extends FormControlTypes = 'text'> = {
|
|
|
37
37
|
/** Show only first error with ellipsis */
|
|
38
38
|
truncateErrors?: boolean;
|
|
39
39
|
truncateWarnings?: boolean;
|
|
40
|
-
type:
|
|
40
|
+
type: FormControlTypes;
|
|
41
41
|
valueCanBeNull?: boolean;
|
|
42
42
|
warning?: React.ReactNode | null;
|
|
43
43
|
/** Gives a custom width to the LabelWrapper */
|
|
@@ -48,8 +48,8 @@ export declare type FormControlProps<T extends FormControlTypes = 'text'> = {
|
|
|
48
48
|
*/
|
|
49
49
|
inputCss?: Interpolation<any>;
|
|
50
50
|
options?: any;
|
|
51
|
-
} & FormControlElementTypes
|
|
52
|
-
declare class FormControl
|
|
51
|
+
} & FormControlElementTypes;
|
|
52
|
+
declare class FormControl extends PureComponent<FormControlProps> {
|
|
53
53
|
static defaultProps: Partial<FormControlProps>;
|
|
54
54
|
hintIconRef: React.RefObject<SVGSVGElement>;
|
|
55
55
|
warningIconRef: React.RefObject<HTMLDivElement>;
|
|
@@ -11,7 +11,7 @@ export declare type CheckboxGroupProps = {
|
|
|
11
11
|
/** The array of items that will be displayed as Checkboxes. */
|
|
12
12
|
options: FormControlValue[];
|
|
13
13
|
/** Callback triggered when user selects a new value. */
|
|
14
|
-
onChange: (
|
|
14
|
+
onChange: (event: {
|
|
15
15
|
name: string;
|
|
16
16
|
value: FormControlValue[];
|
|
17
17
|
}) => void;
|
|
@@ -34,7 +34,7 @@ var _ref3 = process.env.NODE_ENV === "production" ? {
|
|
|
34
34
|
} : {
|
|
35
35
|
name: "95fix3-CheckboxGroup",
|
|
36
36
|
styles: "height:auto;line-height:32px;label:CheckboxGroup;",
|
|
37
|
-
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
37
|
+
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9Gb3JtQ29udHJvbC9jb21wb25lbnRzL0NoZWNrYm94R3JvdXAudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTZEVSIsImZpbGUiOiIuLi8uLi8uLi8uLi9zcmMvRm9ybUNvbnRyb2wvY29tcG9uZW50cy9DaGVja2JveEdyb3VwLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qIGVzbGludC1kaXNhYmxlIHRkL2luc3RydW1lbnRhdGlvbiAqL1xuLy8gdGhpcyBsZXZlbCBvZiBmaW5lIGdyYWluZWQgaW5zdHJ1bWVudGF0aW9uIGlzIG5vdCBuZWVkZWRcbmltcG9ydCBDaGVja2JveCBmcm9tICcuLi8uLi9DaGVja2JveCdcbmltcG9ydCB0eXBlIHsgRm9ybUNvbnRyb2xWYWx1ZSB9IGZyb20gJy4uL3R5cGVzJ1xuXG5leHBvcnQgdHlwZSBDaGVja2JveEdyb3VwUHJvcHMgPSB7XG4gIC8qKiBJZGVudGlmaWVzIHRoZXNlIGZvcm0gY29udHJvbHMuICovXG4gIG5hbWU6IHN0cmluZ1xuXG4gIGRpc2FibGVkPzogYm9vbGVhblxuXG4gIC8qKiBFbmFibGVzIGluZGl2aWR1YWwgY2hlY2tib3ggZGlzYWJsaW5nICovXG4gIGRpc2FibGVkT3B0aW9ucz86IEZvcm1Db250cm9sVmFsdWVbXVxuXG4gIC8qKiBTZWxlY3RlZCBvcHRpb25zLiAgKi9cbiAgdmFsdWU6IEZvcm1Db250cm9sVmFsdWVbXVxuXG4gIC8qKiBUaGUgYXJyYXkgb2YgaXRlbXMgdGhhdCB3aWxsIGJlIGRpc3BsYXllZCBhcyBDaGVja2JveGVzLiAqL1xuICBvcHRpb25zOiBGb3JtQ29udHJvbFZhbHVlW11cblxuICAvKiogQ2FsbGJhY2sgdHJpZ2dlcmVkIHdoZW4gdXNlciBzZWxlY3RzIGEgbmV3IHZhbHVlLiAqL1xuICBvbkNoYW5nZTogKGV2ZW50OiB7IG5hbWU6IHN0cmluZzsgdmFsdWU6IEZvcm1Db250cm9sVmFsdWVbXSB9KSA9PiB2b2lkXG5cbiAgLyoqIENsYXNzIG5hbWUgZm9yIHRoZSB3cmFwcGVyICovXG4gIGNsYXNzTmFtZT86IHN0cmluZ1xuXG4gIC8qKiBGdW5jdGlvbiByZXNwb25zaWJsZSBmb3IgcmV0dXJuaW5nIGEgbmFtZSBmb3IgYSBnaXZlbiBvcHRpb24vdmFsdWUuICovXG4gIGdldExhYmVsRm9yT3B0aW9uPzogKG9wdGlvbjogRm9ybUNvbnRyb2xWYWx1ZSkgPT4gc3RyaW5nXG5cbiAgLyoqIElkIGZvciB0aGUgd3JhcHBlci4gKi9cbiAgaWQ/OiBzdHJpbmdcbn1cblxuZXhwb3J0IGNvbnN0IENoZWNrYm94R3JvdXA6IFJlYWN0LkZ1bmN0aW9uQ29tcG9uZW50PENoZWNrYm94R3JvdXBQcm9wcz4gPSAoe1xuICB2YWx1ZTogc2VsZWN0ZWRJdGVtcyA9IFtdLFxuICBkaXNhYmxlZCA9IGZhbHNlLFxuICBkaXNhYmxlZE9wdGlvbnMgPSBbXSxcbiAgbmFtZSxcbiAgb3B0aW9ucyxcbiAgb25DaGFuZ2UgPSAoKSA9PiB7fSxcbiAgY2xhc3NOYW1lLFxuICBnZXRMYWJlbEZvck9wdGlvbiA9IFN0cmluZyxcbiAgaWRcbn06IENoZWNrYm94R3JvdXBQcm9wcykgPT4ge1xuICByZXR1cm4gKFxuICAgIDxkaXYgY2xhc3NOYW1lPXtjbGFzc05hbWV9IGlkPXtpZH0+XG4gICAgICB7b3B0aW9ucy5tYXAoKG9wdGlvbjogc3RyaW5nKSA9PiAoXG4gICAgICAgIDxDaGVja2JveFxuICAgICAgICAgIGRpc2FibGVkPXtkaXNhYmxlZE9wdGlvbnMuaW5jbHVkZXMob3B0aW9uKSB8fCBkaXNhYmxlZH1cbiAgICAgICAgICBrZXk9e2BjaGVja2JveC1ncm91cC0ke29wdGlvbn1gfVxuICAgICAgICAgIG5hbWU9e25hbWV9XG4gICAgICAgICAgbGFiZWw9e2dldExhYmVsRm9yT3B0aW9uKG9wdGlvbil9XG4gICAgICAgICAgdmFsdWU9e3NlbGVjdGVkSXRlbXMuaW5jbHVkZXMob3B0aW9uKX1cbiAgICAgICAgICBvbkNoYW5nZT17KHsgdmFsdWU6IGlzQ2hlY2tlZCB9KSA9PiB7XG4gICAgICAgICAgICBvbkNoYW5nZSh7XG4gICAgICAgICAgICAgIG5hbWUsXG4gICAgICAgICAgICAgIHZhbHVlOiBpc0NoZWNrZWRcbiAgICAgICAgICAgICAgICA/IFsuLi5zZWxlY3RlZEl0ZW1zLCBvcHRpb25dXG4gICAgICAgICAgICAgICAgOiBzZWxlY3RlZEl0ZW1zLmZpbHRlcihpdGVtID0+IGl0ZW0gIT09IG9wdGlvbilcbiAgICAgICAgICAgIH0pXG4gICAgICAgICAgfX1cbiAgICAgICAgICBjc3M9e3tcbiAgICAgICAgICAgIGhlaWdodDogJ2F1dG8nLFxuICAgICAgICAgICAgbGluZUhlaWdodDogJzMycHgnXG4gICAgICAgICAgfX1cbiAgICAgICAgLz5cbiAgICAgICkpfVxuICAgIDwvZGl2PlxuICApXG59XG5cbmV4cG9ydCBkZWZhdWx0IENoZWNrYm94R3JvdXBcbiJdfQ== */",
|
|
38
38
|
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
39
39
|
};
|
|
40
40
|
|
|
@@ -11,7 +11,7 @@ export declare type RadioGroupProps = {
|
|
|
11
11
|
/** The array of items that will be displayed as Radio buttons. */
|
|
12
12
|
options: FormControlValue[];
|
|
13
13
|
/** Callback triggered when user selects a new value. */
|
|
14
|
-
onChange: (
|
|
14
|
+
onChange: (event: {
|
|
15
15
|
name: string;
|
|
16
16
|
value: FormControlValue;
|
|
17
17
|
}) => void;
|
|
@@ -22,7 +22,7 @@ var _ref2 = process.env.NODE_ENV === "production" ? {
|
|
|
22
22
|
} : {
|
|
23
23
|
name: "5gmama-RadioGroup",
|
|
24
24
|
styles: "height:auto;line-height:32px;label:RadioGroup;",
|
|
25
|
-
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
25
|
+
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9Gb3JtQ29udHJvbC9jb21wb25lbnRzL1JhZGlvR3JvdXAudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXNEUSIsImZpbGUiOiIuLi8uLi8uLi8uLi9zcmMvRm9ybUNvbnRyb2wvY29tcG9uZW50cy9SYWRpb0dyb3VwLnRzeCIsInNvdXJjZXNDb250ZW50IjpbIi8qIGVzbGludC1kaXNhYmxlIHRkL2luc3RydW1lbnRhdGlvbiAqL1xuLy8gdGhpcyBsZXZlbCBvZiBmaW5lIGdyYWluZWQgaW5zdHJ1bWVudGF0aW9uIGlzIG5vdCBuZWVkZWRcbmltcG9ydCBSYWRpbyBmcm9tICcuLi8uLi9SYWRpbydcbmltcG9ydCB0eXBlIHsgRm9ybUNvbnRyb2xWYWx1ZSB9IGZyb20gJy4uL3R5cGVzJ1xuXG5leHBvcnQgdHlwZSBSYWRpb0dyb3VwUHJvcHMgPSB7XG4gIC8qKiBJZGVudGlmaWVzIHRoZXNlIGZvcm0gY29udHJvbHMuICovXG4gIG5hbWU6IHN0cmluZ1xuXG4gIGRpc2FibGVkPzogYm9vbGVhblxuXG4gIC8qKiBFbmFibGVzIGluZGl2aWR1YWwgcmFkaW8gZGlzYWJsaW5nICovXG4gIGRpc2FibGVkT3B0aW9uczogRm9ybUNvbnRyb2xWYWx1ZVtdXG5cbiAgLyoqIFNlbGVjdGVkIG9wdGlvbi4gKi9cbiAgdmFsdWU6IEZvcm1Db250cm9sVmFsdWVcblxuICAvKiogVGhlIGFycmF5IG9mIGl0ZW1zIHRoYXQgd2lsbCBiZSBkaXNwbGF5ZWQgYXMgUmFkaW8gYnV0dG9ucy4gKi9cbiAgb3B0aW9uczogRm9ybUNvbnRyb2xWYWx1ZVtdXG5cbiAgLyoqIENhbGxiYWNrIHRyaWdnZXJlZCB3aGVuIHVzZXIgc2VsZWN0cyBhIG5ldyB2YWx1ZS4gKi9cbiAgb25DaGFuZ2U6IChldmVudDogeyBuYW1lOiBzdHJpbmc7IHZhbHVlOiBGb3JtQ29udHJvbFZhbHVlIH0pID0+IHZvaWRcblxuICAvKiogQ2xhc3MgbmFtZSBmb3IgdGhlIHdyYXBwZXIgKi9cbiAgY2xhc3NOYW1lPzogc3RyaW5nXG5cbiAgLyoqIEZ1bmN0aW9uIHJlc3BvbnNpYmxlIGZvciByZXR1cm5pbmcgYSBuYW1lIGZvciBhIGdpdmVuIG9wdGlvbi92YWx1ZS4gKi9cbiAgZ2V0TGFiZWxGb3JPcHRpb24/OiAob3B0aW9uKSA9PiBzdHJpbmdcblxuICAvKiogSWQgZm9yIHRoZSB3cmFwcGVyLiAqL1xuICBpZD86IHN0cmluZ1xufVxuXG5leHBvcnQgY29uc3QgUmFkaW9Hcm91cDogUmVhY3QuRnVuY3Rpb25Db21wb25lbnQ8UmFkaW9Hcm91cFByb3BzPiA9ICh7XG4gIG5hbWUsXG4gIGRpc2FibGVkID0gZmFsc2UsXG4gIGRpc2FibGVkT3B0aW9ucyA9IFtdLFxuICB2YWx1ZTogc2VsZWN0ZWRJdGVtLFxuICBvbkNoYW5nZSA9ICgpID0+IHt9LFxuICBvcHRpb25zLFxuICBnZXRMYWJlbEZvck9wdGlvbiA9IFN0cmluZyxcbiAgY2xhc3NOYW1lLFxuICBpZFxufTogUmFkaW9Hcm91cFByb3BzKSA9PiAoXG4gIDxkaXYgY2xhc3NOYW1lPXtjbGFzc05hbWV9IGlkPXtpZH0+XG4gICAge29wdGlvbnMubWFwKChvcHRpb246IHN0cmluZykgPT4gKFxuICAgICAgPFJhZGlvXG4gICAgICAgIGRpc2FibGVkPXtkaXNhYmxlZE9wdGlvbnMuaW5jbHVkZXMob3B0aW9uKSB8fCBkaXNhYmxlZH1cbiAgICAgICAga2V5PXtgcmFkaW8tZ3JvdXAtJHtvcHRpb259YH1cbiAgICAgICAgbmFtZT17bmFtZX1cbiAgICAgICAgbGFiZWw9e2dldExhYmVsRm9yT3B0aW9uKG9wdGlvbil9XG4gICAgICAgIHZhbHVlPXtvcHRpb259XG4gICAgICAgIGNoZWNrZWQ9e29wdGlvbiA9PT0gc2VsZWN0ZWRJdGVtfVxuICAgICAgICBvbkNoYW5nZT17KCkgPT4gb25DaGFuZ2UoeyBuYW1lLCB2YWx1ZTogb3B0aW9uIH0pfVxuICAgICAgICBjc3M9e3tcbiAgICAgICAgICBoZWlnaHQ6ICdhdXRvJyxcbiAgICAgICAgICBsaW5lSGVpZ2h0OiAnMzJweCdcbiAgICAgICAgfX1cbiAgICAgIC8+XG4gICAgKSl9XG4gIDwvZGl2PlxuKVxuXG5leHBvcnQgZGVmYXVsdCBSYWRpb0dyb3VwXG4iXX0= */",
|
|
26
26
|
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
27
27
|
};
|
|
28
28
|
|
|
@@ -7,8 +7,8 @@ declare type FormFieldTypeSelect = 'select';
|
|
|
7
7
|
declare type FormFieldTypeInput = 'datetime-local' | 'email' | 'number' | 'password' | 'text' | 'textarea' | 'url';
|
|
8
8
|
export declare type FormFieldTypes = FormFieldTypeSelect | FormFieldTypeInput;
|
|
9
9
|
export declare type FormFieldValue = string | number | any[] | null;
|
|
10
|
-
export declare type FormFieldElementTypes
|
|
11
|
-
export declare type FormFieldProps
|
|
10
|
+
export declare type FormFieldElementTypes = Omit<SelectComponentProps, 'label'> | Omit<InputProps, 'label'>;
|
|
11
|
+
export declare type FormFieldProps = {
|
|
12
12
|
addOnClassName?: string;
|
|
13
13
|
'data-gs-c'?: Function;
|
|
14
14
|
'data-instrumentation'?: string;
|
|
@@ -26,10 +26,10 @@ export declare type FormFieldProps<T extends FormFieldTypes = 'text'> = {
|
|
|
26
26
|
tooltip?: React.ReactNode;
|
|
27
27
|
tooltipClassName?: string;
|
|
28
28
|
truncateErrors?: boolean;
|
|
29
|
-
type?:
|
|
29
|
+
type?: FormFieldTypes;
|
|
30
30
|
valueCanBeNull?: boolean;
|
|
31
|
-
} & FormFieldElementTypes
|
|
32
|
-
declare class FormField
|
|
31
|
+
} & FormFieldElementTypes;
|
|
32
|
+
declare class FormField extends PureComponent<FormFieldProps> {
|
|
33
33
|
getTypeComponent: (type: FormFieldTypes) => typeof Input | ((props: any) => import("@emotion/react/jsx-runtime").JSX.Element);
|
|
34
34
|
inputRef: React.RefObject<HTMLDivElement>;
|
|
35
35
|
/**
|
|
@@ -162,7 +162,10 @@ var FormField = /*#__PURE__*/function (_PureComponent) {
|
|
|
162
162
|
invalid: isInvalid,
|
|
163
163
|
name: name,
|
|
164
164
|
"data-instrumentation": "".concat(dataInstrumentation, "-input"),
|
|
165
|
-
onChange: onChange
|
|
165
|
+
onChange: onChange // The union of types here throws an error which is not really straightforward to
|
|
166
|
+
// fix without altering a lot more components and surfacing further type issues
|
|
167
|
+
// @ts-ignore
|
|
168
|
+
,
|
|
166
169
|
type: type,
|
|
167
170
|
value: value,
|
|
168
171
|
disabled: disabled,
|
package/dist/es/Input/Input.d.ts
CHANGED
|
@@ -27,10 +27,8 @@ export declare const InlineInputComponentUnderline: import("@emotion/styled").St
|
|
|
27
27
|
export declare const InlineInputComponent: React.ForwardRefExoticComponent<React.InputHTMLAttributes<HTMLInputElement> & ComponentProps & {
|
|
28
28
|
inline?: boolean | undefined;
|
|
29
29
|
} & React.RefAttributes<HTMLInputElement>>;
|
|
30
|
-
declare type
|
|
31
|
-
declare type
|
|
32
|
-
declare type StringTypes = 'url' | 'datetime-local' | 'email' | 'password' | 'text' | TextAreaType;
|
|
33
|
-
declare type InputTypes = NumberTypes | StringTypes;
|
|
30
|
+
declare type StringTypes = 'url' | 'datetime-local' | 'email' | 'password' | 'text' | 'textarea';
|
|
31
|
+
declare type InputTypes = StringTypes | 'number';
|
|
34
32
|
/**
|
|
35
33
|
* This uses a generic plus conditional types to adjust prop types based on the type prop.
|
|
36
34
|
*
|
|
@@ -40,7 +38,8 @@ declare type InputTypes = NumberTypes | StringTypes;
|
|
|
40
38
|
* For more info on conditional types, please read this:
|
|
41
39
|
* https://artsy.github.io/blog/2018/11/21/conditional-types-in-typescript/
|
|
42
40
|
*/
|
|
43
|
-
export declare type InputProps
|
|
41
|
+
export declare type InputProps = InputMainProps & InputTypeProps;
|
|
42
|
+
declare type InputMainProps = {
|
|
44
43
|
className?: string;
|
|
45
44
|
disabled?: boolean;
|
|
46
45
|
'data-instrumentation'?: string;
|
|
@@ -52,20 +51,27 @@ export declare type InputProps<T extends InputTypes = 'text'> = {
|
|
|
52
51
|
min?: number;
|
|
53
52
|
name: string;
|
|
54
53
|
onBlur?: (event: React.FocusEvent<HTMLTextAreaElement | HTMLInputElement>) => void;
|
|
55
|
-
onChange: (arg0: {
|
|
56
|
-
name: string;
|
|
57
|
-
value?: InputValue<T>;
|
|
58
|
-
}) => void;
|
|
59
54
|
placeholder?: string;
|
|
60
|
-
|
|
61
|
-
value: InputValue<T>;
|
|
55
|
+
value: InputValue;
|
|
62
56
|
variant?: Variant;
|
|
63
57
|
} & Omit<InputHTMLAttributes<HTMLInputElement>, 'onChange'> & Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'onChange'>;
|
|
64
|
-
declare type InputValue
|
|
65
|
-
declare
|
|
66
|
-
|
|
58
|
+
declare type InputValue = number | string;
|
|
59
|
+
declare type InputTypeProps = {
|
|
60
|
+
type: 'url' | 'datetime-local' | 'email' | 'password' | 'text' | 'textarea';
|
|
61
|
+
onChange: (event: {
|
|
62
|
+
name: string;
|
|
63
|
+
value?: string;
|
|
64
|
+
}) => void;
|
|
65
|
+
} | {
|
|
66
|
+
type: 'number';
|
|
67
|
+
onChange: (event: {
|
|
68
|
+
name: string;
|
|
69
|
+
value?: number;
|
|
70
|
+
}) => void;
|
|
71
|
+
};
|
|
72
|
+
declare class Input extends PureComponent<InputProps> {
|
|
73
|
+
_sanitizeNumber: (value: string) => number;
|
|
67
74
|
_onBlur: (event: React.FocusEvent<HTMLTextAreaElement | HTMLInputElement>) => void;
|
|
68
|
-
_isInputValue: (value: string | number) => value is InputValue<T>;
|
|
69
75
|
_onChange: (event: React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>) => void;
|
|
70
76
|
getComponent: () => import("@emotion/styled").StyledComponent<{
|
|
71
77
|
theme?: import("@emotion/react").Theme | undefined;
|