@elliemae/ds-form 3.3.0-next.2 → 3.3.0-next.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/CheckboxGroup/DSCheckboxGroup.js +15 -29
- package/dist/cjs/CheckboxGroup/DSCheckboxGroup.js.map +1 -1
- package/dist/cjs/ComboBoxFreeSolo/ComboBoxFreeSolo.js +24 -65
- package/dist/cjs/ComboBoxFreeSolo/ComboBoxFreeSolo.js.map +1 -1
- package/dist/cjs/ComboBoxFreeSolo/components/MultiValueRemove.js +5 -19
- package/dist/cjs/ComboBoxFreeSolo/components/MultiValueRemove.js.map +1 -1
- package/dist/cjs/ComboBoxFreeSolo/components/SingleValue.js +3 -15
- package/dist/cjs/ComboBoxFreeSolo/components/SingleValue.js.map +1 -1
- package/dist/cjs/ComboBoxFreeSolo/components/SingleValueRemove.js +7 -20
- package/dist/cjs/ComboBoxFreeSolo/components/SingleValueRemove.js.map +1 -1
- package/dist/cjs/DateInput/DSDateInput.js +14 -46
- package/dist/cjs/DateInput/DSDateInput.js.map +1 -1
- package/dist/cjs/DateInput/components/DateInputImpl.js +4 -17
- package/dist/cjs/DateInput/components/DateInputImpl.js.map +1 -1
- package/dist/cjs/DateInput/components/DateInputs.js +9 -23
- package/dist/cjs/DateInput/components/DateInputs.js.map +1 -1
- package/dist/cjs/DateInputV2/components/DateInputs.js +9 -23
- package/dist/cjs/DateInputV2/components/DateInputs.js.map +1 -1
- package/dist/cjs/ExpandableInput/ExpandableInputImpl.js +3 -19
- package/dist/cjs/ExpandableInput/ExpandableInputImpl.js.map +1 -1
- package/dist/cjs/FloatingLabelInput/FloatingLabelInputImpl.js +4 -17
- package/dist/cjs/FloatingLabelInput/FloatingLabelInputImpl.js.map +1 -1
- package/dist/cjs/FormItem/DSFormItemLayout.js +56 -118
- package/dist/cjs/FormItem/DSFormItemLayout.js.map +1 -1
- package/dist/cjs/FormItem/ValidationFieldWrapper.js +3 -19
- package/dist/cjs/FormItem/ValidationFieldWrapper.js.map +1 -1
- package/dist/cjs/InputGroup/AddonWrapper.js +4 -17
- package/dist/cjs/InputGroup/AddonWrapper.js.map +1 -1
- package/dist/cjs/InputMask/DSInputMask.js +19 -51
- package/dist/cjs/InputMask/DSInputMask.js.map +1 -1
- package/dist/cjs/InputMask/DSInputMaskDeprecated.js +11 -62
- package/dist/cjs/InputMask/DSInputMaskDeprecated.js.map +1 -1
- package/dist/cjs/InputMask/MaskTypes.js +3 -17
- package/dist/cjs/InputMask/MaskTypes.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/DateInputMask.js +37 -97
- package/dist/cjs/InputMask/mask_types/DateInputMask.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/DateTimeInputMask.js +37 -97
- package/dist/cjs/InputMask/mask_types/DateTimeInputMask.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/DictionaryInputMask.js +40 -103
- package/dist/cjs/InputMask/mask_types/DictionaryInputMask.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/NumberInputMask.js +49 -121
- package/dist/cjs/InputMask/mask_types/NumberInputMask.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/PhoneInputMask.js +37 -97
- package/dist/cjs/InputMask/mask_types/PhoneInputMask.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/PhoneInternationalInputMask.js +37 -97
- package/dist/cjs/InputMask/mask_types/PhoneInternationalInputMask.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/SsnInputMask.js +37 -97
- package/dist/cjs/InputMask/mask_types/SsnInputMask.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/UsZipCodeInputMask.js +37 -97
- package/dist/cjs/InputMask/mask_types/UsZipCodeInputMask.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/ZipCodeSearchInputMask.js +37 -97
- package/dist/cjs/InputMask/mask_types/ZipCodeSearchInputMask.js.map +1 -1
- package/dist/cjs/InputMask/mask_types/index.js +79 -119
- package/dist/cjs/InputMask/mask_types/index.js.map +1 -1
- package/dist/cjs/InputProtected/DSInputProtected.js +14 -51
- package/dist/cjs/InputProtected/DSInputProtected.js.map +1 -1
- package/dist/cjs/LargeInputText/DSLargeInputText.js +3 -19
- package/dist/cjs/LargeInputText/DSLargeInputText.js.map +1 -1
- package/dist/cjs/Radio/DSRadio.js +24 -67
- package/dist/cjs/Radio/DSRadio.js.map +1 -1
- package/dist/cjs/RadioGroup/DSRadioGroup.js +15 -29
- package/dist/cjs/RadioGroup/DSRadioGroup.js.map +1 -1
- package/dist/cjs/TimeInput/DSTimeInput.js +8 -40
- package/dist/cjs/TimeInput/DSTimeInput.js.map +1 -1
- package/dist/cjs/TimeInput/TimeInputImpl.js +4 -17
- package/dist/cjs/TimeInput/TimeInputImpl.js.map +1 -1
- package/dist/cjs/TimeInput/TimeInputs.js +12 -25
- package/dist/cjs/TimeInput/TimeInputs.js.map +1 -1
- package/dist/cjs/Toggle/DSToggle.js +25 -66
- package/dist/cjs/Toggle/DSToggle.js.map +1 -1
- package/dist/cjs/Toggle/DSToggleImpl.js +7 -22
- package/dist/cjs/Toggle/DSToggleImpl.js.map +1 -1
- package/dist/cjs/Toggle/DSToggleRender.js +10 -24
- package/dist/cjs/Toggle/DSToggleRender.js.map +1 -1
- package/dist/esm/CheckboxGroup/DSCheckboxGroup.js +15 -31
- package/dist/esm/CheckboxGroup/DSCheckboxGroup.js.map +1 -1
- package/dist/esm/ComboBoxFreeSolo/ComboBoxFreeSolo.js +24 -67
- package/dist/esm/ComboBoxFreeSolo/ComboBoxFreeSolo.js.map +1 -1
- package/dist/esm/ComboBoxFreeSolo/components/MultiValueRemove.js +5 -21
- package/dist/esm/ComboBoxFreeSolo/components/MultiValueRemove.js.map +1 -1
- package/dist/esm/ComboBoxFreeSolo/components/SingleValue.js +3 -17
- package/dist/esm/ComboBoxFreeSolo/components/SingleValue.js.map +1 -1
- package/dist/esm/ComboBoxFreeSolo/components/SingleValueRemove.js +7 -22
- package/dist/esm/ComboBoxFreeSolo/components/SingleValueRemove.js.map +1 -1
- package/dist/esm/DateInput/DSDateInput.js +14 -48
- package/dist/esm/DateInput/DSDateInput.js.map +1 -1
- package/dist/esm/DateInput/components/DateInputImpl.js +4 -19
- package/dist/esm/DateInput/components/DateInputImpl.js.map +1 -1
- package/dist/esm/DateInput/components/DateInputs.js +9 -25
- package/dist/esm/DateInput/components/DateInputs.js.map +1 -1
- package/dist/esm/DateInputV2/components/DateInputs.js +9 -25
- package/dist/esm/DateInputV2/components/DateInputs.js.map +1 -1
- package/dist/esm/ExpandableInput/ExpandableInputImpl.js +3 -21
- package/dist/esm/ExpandableInput/ExpandableInputImpl.js.map +1 -1
- package/dist/esm/FloatingLabelInput/FloatingLabelInputImpl.js +4 -19
- package/dist/esm/FloatingLabelInput/FloatingLabelInputImpl.js.map +1 -1
- package/dist/esm/FormItem/DSFormItemLayout.js +56 -120
- package/dist/esm/FormItem/DSFormItemLayout.js.map +1 -1
- package/dist/esm/FormItem/ValidationFieldWrapper.js +3 -21
- package/dist/esm/FormItem/ValidationFieldWrapper.js.map +1 -1
- package/dist/esm/InputGroup/AddonWrapper.js +4 -19
- package/dist/esm/InputGroup/AddonWrapper.js.map +1 -1
- package/dist/esm/InputMask/DSInputMask.js +19 -53
- package/dist/esm/InputMask/DSInputMask.js.map +1 -1
- package/dist/esm/InputMask/DSInputMaskDeprecated.js +11 -64
- package/dist/esm/InputMask/DSInputMaskDeprecated.js.map +1 -1
- package/dist/esm/InputMask/MaskTypes.js +3 -19
- package/dist/esm/InputMask/MaskTypes.js.map +1 -1
- package/dist/esm/InputMask/mask_types/DateInputMask.js +37 -99
- package/dist/esm/InputMask/mask_types/DateInputMask.js.map +1 -1
- package/dist/esm/InputMask/mask_types/DateTimeInputMask.js +37 -99
- package/dist/esm/InputMask/mask_types/DateTimeInputMask.js.map +1 -1
- package/dist/esm/InputMask/mask_types/DictionaryInputMask.js +40 -105
- package/dist/esm/InputMask/mask_types/DictionaryInputMask.js.map +1 -1
- package/dist/esm/InputMask/mask_types/NumberInputMask.js +49 -123
- package/dist/esm/InputMask/mask_types/NumberInputMask.js.map +1 -1
- package/dist/esm/InputMask/mask_types/PhoneInputMask.js +37 -99
- package/dist/esm/InputMask/mask_types/PhoneInputMask.js.map +1 -1
- package/dist/esm/InputMask/mask_types/PhoneInternationalInputMask.js +37 -99
- package/dist/esm/InputMask/mask_types/PhoneInternationalInputMask.js.map +1 -1
- package/dist/esm/InputMask/mask_types/SsnInputMask.js +37 -99
- package/dist/esm/InputMask/mask_types/SsnInputMask.js.map +1 -1
- package/dist/esm/InputMask/mask_types/UsZipCodeInputMask.js +37 -99
- package/dist/esm/InputMask/mask_types/UsZipCodeInputMask.js.map +1 -1
- package/dist/esm/InputMask/mask_types/ZipCodeSearchInputMask.js +37 -99
- package/dist/esm/InputMask/mask_types/ZipCodeSearchInputMask.js.map +1 -1
- package/dist/esm/InputMask/mask_types/index.js +79 -121
- package/dist/esm/InputMask/mask_types/index.js.map +1 -1
- package/dist/esm/InputProtected/DSInputProtected.js +14 -53
- package/dist/esm/InputProtected/DSInputProtected.js.map +1 -1
- package/dist/esm/LargeInputText/DSLargeInputText.js +3 -21
- package/dist/esm/LargeInputText/DSLargeInputText.js.map +1 -1
- package/dist/esm/Radio/DSRadio.js +24 -69
- package/dist/esm/Radio/DSRadio.js.map +1 -1
- package/dist/esm/RadioGroup/DSRadioGroup.js +15 -31
- package/dist/esm/RadioGroup/DSRadioGroup.js.map +1 -1
- package/dist/esm/TimeInput/DSTimeInput.js +8 -42
- package/dist/esm/TimeInput/DSTimeInput.js.map +1 -1
- package/dist/esm/TimeInput/TimeInputImpl.js +4 -19
- package/dist/esm/TimeInput/TimeInputImpl.js.map +1 -1
- package/dist/esm/TimeInput/TimeInputs.js +12 -27
- package/dist/esm/TimeInput/TimeInputs.js.map +1 -1
- package/dist/esm/Toggle/DSToggle.js +25 -68
- package/dist/esm/Toggle/DSToggle.js.map +1 -1
- package/dist/esm/Toggle/DSToggleImpl.js +7 -24
- package/dist/esm/Toggle/DSToggleImpl.js.map +1 -1
- package/dist/esm/Toggle/DSToggleRender.js +10 -26
- package/dist/esm/Toggle/DSToggleRender.js.map +1 -1
- package/package.json +12 -12
|
@@ -1,27 +1,10 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
var __create = Object.create;
|
|
3
3
|
var __defProp = Object.defineProperty;
|
|
4
|
-
var __defProps = Object.defineProperties;
|
|
5
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
6
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
7
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
8
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
9
6
|
var __getProtoOf = Object.getPrototypeOf;
|
|
10
7
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
11
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
12
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
13
|
-
var __spreadValues = (a, b) => {
|
|
14
|
-
for (var prop in b || (b = {}))
|
|
15
|
-
if (__hasOwnProp.call(b, prop))
|
|
16
|
-
__defNormalProp(a, prop, b[prop]);
|
|
17
|
-
if (__getOwnPropSymbols)
|
|
18
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
19
|
-
if (__propIsEnum.call(b, prop))
|
|
20
|
-
__defNormalProp(a, prop, b[prop]);
|
|
21
|
-
}
|
|
22
|
-
return a;
|
|
23
|
-
};
|
|
24
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
25
8
|
var __export = (target, all) => {
|
|
26
9
|
for (var name in all)
|
|
27
10
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -54,11 +37,12 @@ var import_defaultProps = require("./defaultProps");
|
|
|
54
37
|
const emClassPrefix = "em-ds";
|
|
55
38
|
const baseClass = `${emClassPrefix}-radio-group`;
|
|
56
39
|
const RadioItem = (props) => /* @__PURE__ */ import_react.default.createElement(import_ds_shared.GroupItem, {
|
|
57
|
-
render: (context) => /* @__PURE__ */ import_react.default.createElement(import_Radio.DSRadio,
|
|
40
|
+
render: (context) => /* @__PURE__ */ import_react.default.createElement(import_Radio.DSRadio, {
|
|
41
|
+
...props,
|
|
58
42
|
checked: context.activeValue === props.value,
|
|
59
43
|
disabled: context.disabled || props.disabled,
|
|
60
44
|
onChange: context.onChange
|
|
61
|
-
})
|
|
45
|
+
})
|
|
62
46
|
});
|
|
63
47
|
const DSRadioGroup = ({
|
|
64
48
|
containerProps,
|
|
@@ -90,27 +74,29 @@ const DSRadioGroup = ({
|
|
|
90
74
|
activeValue,
|
|
91
75
|
disabled,
|
|
92
76
|
onChange
|
|
93
|
-
}, /* @__PURE__ */ import_react.default.createElement("div",
|
|
94
|
-
"data-testid": "ds-radiogroup"
|
|
95
|
-
|
|
77
|
+
}, /* @__PURE__ */ import_react.default.createElement("div", {
|
|
78
|
+
"data-testid": "ds-radiogroup",
|
|
79
|
+
...labelProps && labelProps.labelText ? {} : containerProps,
|
|
96
80
|
className: `${baseClass} ${baseClass}--${orientation}`,
|
|
97
81
|
role: "group"
|
|
98
|
-
}
|
|
82
|
+
}, import_react.default.Children.map(children, (child, index) => /* @__PURE__ */ import_react.default.createElement(RadioItem, {
|
|
83
|
+
...child.props,
|
|
99
84
|
innerRef: (t) => {
|
|
100
85
|
checkRefs.push(t);
|
|
101
86
|
},
|
|
102
87
|
onKeyDown: (e) => onKeyDown(e, index)
|
|
103
|
-
})
|
|
88
|
+
}), null)));
|
|
104
89
|
if (labelProps && labelProps.labelText) {
|
|
105
|
-
return /* @__PURE__ */ import_react.default.createElement("div",
|
|
106
|
-
className: `${baseClass}-form-item-layout-wrapper
|
|
107
|
-
|
|
90
|
+
return /* @__PURE__ */ import_react.default.createElement("div", {
|
|
91
|
+
className: `${baseClass}-form-item-layout-wrapper`,
|
|
92
|
+
...containerProps,
|
|
108
93
|
role: "group"
|
|
109
|
-
}
|
|
94
|
+
}, /* @__PURE__ */ import_react.default.createElement(import_FormItem.DSFormItemLayout, {
|
|
95
|
+
...labelProps,
|
|
110
96
|
inputComponent: group,
|
|
111
97
|
onChange,
|
|
112
98
|
truncateText
|
|
113
|
-
}))
|
|
99
|
+
}));
|
|
114
100
|
}
|
|
115
101
|
return group;
|
|
116
102
|
};
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/RadioGroup/DSRadioGroup.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React from 'react';\nimport { describe } from '@elliemae/ds-utilities';\nimport { GroupItem, Group } from '@elliemae/ds-shared';\nimport { DSFormItemLayout } from '../FormItem';\nimport { DSRadio } from '../Radio';\nimport { props as rprops } from './props';\nimport { defaultProps } from './defaultProps';\n\nconst emClassPrefix = 'em-ds';\nconst baseClass = `${emClassPrefix}-radio-group`;\n\nconst RadioItem = (props) => (\n <GroupItem\n render={(context) => (\n <DSRadio\n {...props}\n checked={context.activeValue === props.value}\n disabled={context.disabled || props.disabled}\n onChange={context.onChange}\n />\n )}\n />\n);\n\nconst DSRadioGroup = ({\n containerProps,\n onChange,\n activeValue,\n children,\n orientation,\n disabled,\n truncateText,\n labelProps,\n}) => {\n const checkRefs = [];\n const count = React.Children.count(children);\n const onKeyDown = (e, index) => {\n if (e.key === 'ArrowLeft' || e.key === 'ArrowUp') {\n if (index === 0) checkRefs[count - 1].focus();\n else checkRefs[index - 1].focus();\n }\n if (e.key === 'ArrowRight' || e.key === 'ArrowDown') {\n if (index === count - 1) checkRefs[0].focus();\n else checkRefs[index + 1].focus();\n }\n };\n const group = (\n <Group activeValue={activeValue} disabled={disabled} onChange={onChange}>\n <div\n data-testid=\"ds-radiogroup\"\n {...(labelProps && labelProps.labelText ? {} : containerProps)}\n className={`${baseClass} ${baseClass}--${orientation}`}\n role=\"group\"\n >\n {React.Children.map(\n children,\n (child, index) => (\n <RadioItem\n {...child.props}\n innerRef={(t) => {\n checkRefs.push(t);\n }}\n onKeyDown={(e) => onKeyDown(e, index)}\n />\n ),\n null,\n )}\n </div>\n </Group>\n );\n\n if (labelProps && labelProps.labelText) {\n return (\n <div\n className={`${baseClass}-form-item-layout-wrapper`}\n {...containerProps}\n role=\"group\"\n >\n <DSFormItemLayout\n {...labelProps}\n inputComponent={group}\n onChange={onChange}\n truncateText={truncateText}\n />\n </div>\n );\n }\n return group;\n};\n\nDSRadioGroup.propTypes = rprops;\nDSRadioGroup.defaultProps = defaultProps;\nDSRadioGroup.displayName = 'DSRadioGroup';\nconst DSRadioGroupWithSchema = describe(DSRadioGroup);\nDSRadioGroupWithSchema.propTypes = rprops;\n\nexport { DSRadioGroup, DSRadioGroupWithSchema };\n\nexport default DSRadioGroup;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,0BAAyB;AACzB,uBAAiC;AACjC,sBAAiC;AACjC,mBAAwB;AACxB,mBAAgC;AAChC,0BAA6B;AAE7B,MAAM,gBAAgB;AACtB,MAAM,YAAY,GAAG;AAErB,MAAM,YAAY,CAAC,UACjB,mDAAC;AAAA,EACC,QAAQ,CAAC,YACP,mDAAC;AAAA,IACE,GAAG;AAAA,IACJ,SAAS,QAAQ,gBAAgB,MAAM;AAAA,IACvC,UAAU,QAAQ,YAAY,MAAM;AAAA,IACpC,UAAU,QAAQ;AAAA,GACpB;AAAA,CAEJ;AAGF,MAAM,eAAe,CAAC;AAAA,EACpB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,MACI;AACJ,QAAM,YAAY,CAAC;AACnB,QAAM,QAAQ,qBAAM,SAAS,MAAM,QAAQ;AAC3C,QAAM,YAAY,CAAC,GAAG,UAAU;AAC9B,QAAI,EAAE,QAAQ,eAAe,EAAE,QAAQ,WAAW;AAChD,UAAI,UAAU;AAAG,kBAAU,QAAQ,GAAG,MAAM;AAAA;AACvC,kBAAU,QAAQ,GAAG,MAAM;AAAA,IAClC;AACA,QAAI,EAAE,QAAQ,gBAAgB,EAAE,QAAQ,aAAa;AACnD,UAAI,UAAU,QAAQ;AAAG,kBAAU,GAAG,MAAM;AAAA;AACvC,kBAAU,QAAQ,GAAG,MAAM;AAAA,IAClC;AAAA,EACF;AACA,QAAM,QACJ,mDAAC;AAAA,IAAM;AAAA,IAA0B;AAAA,IAAoB;AAAA,KACnD,mDAAC;AAAA,IACC,eAAY;AAAA,IACX,GAAI,cAAc,WAAW,YAAY,CAAC,IAAI;AAAA,IAC/C,WAAW,GAAG,aAAa,cAAc;AAAA,IACzC,MAAK;AAAA,KAEJ,qBAAM,SAAS,IACd,UACA,CAAC,OAAO,UACN,mDAAC;AAAA,IACE,GAAG,MAAM;AAAA,IACV,UAAU,CAAC,MAAM;AACf,gBAAU,KAAK,CAAC;AAAA,IAClB;AAAA,IACA,WAAW,CAAC,MAAM,UAAU,GAAG,KAAK;AAAA,GACtC,GAEF,IACF,CACF,CACF;AAGF,MAAI,cAAc,WAAW,WAAW;AACtC,WACE,mDAAC;AAAA,MACC,WAAW,GAAG;AAAA,MACb,GAAG;AAAA,MACJ,MAAK;AAAA,OAEL,mDAAC;AAAA,MACE,GAAG;AAAA,MACJ,gBAAgB;AAAA,MAChB;AAAA,MACA;AAAA,KACF,CACF;AAAA,EAEJ;AACA,SAAO;AACT;AAEA,aAAa,YAAY;AACzB,aAAa,eAAe;AAC5B,aAAa,cAAc;AAC3B,MAAM,yBAAyB,kCAAS,YAAY;AACpD,uBAAuB,YAAY;AAInC,IAAO,uBAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,39 +1,10 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
var __create = Object.create;
|
|
3
3
|
var __defProp = Object.defineProperty;
|
|
4
|
-
var __defProps = Object.defineProperties;
|
|
5
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
6
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
7
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
8
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
9
6
|
var __getProtoOf = Object.getPrototypeOf;
|
|
10
7
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
11
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
12
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
13
|
-
var __spreadValues = (a, b) => {
|
|
14
|
-
for (var prop in b || (b = {}))
|
|
15
|
-
if (__hasOwnProp.call(b, prop))
|
|
16
|
-
__defNormalProp(a, prop, b[prop]);
|
|
17
|
-
if (__getOwnPropSymbols)
|
|
18
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
19
|
-
if (__propIsEnum.call(b, prop))
|
|
20
|
-
__defNormalProp(a, prop, b[prop]);
|
|
21
|
-
}
|
|
22
|
-
return a;
|
|
23
|
-
};
|
|
24
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
25
|
-
var __objRest = (source, exclude) => {
|
|
26
|
-
var target = {};
|
|
27
|
-
for (var prop in source)
|
|
28
|
-
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
29
|
-
target[prop] = source[prop];
|
|
30
|
-
if (source != null && __getOwnPropSymbols)
|
|
31
|
-
for (var prop of __getOwnPropSymbols(source)) {
|
|
32
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
33
|
-
target[prop] = source[prop];
|
|
34
|
-
}
|
|
35
|
-
return target;
|
|
36
|
-
};
|
|
37
8
|
var __export = (target, all) => {
|
|
38
9
|
for (var name in all)
|
|
39
10
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -76,17 +47,14 @@ const DSTimeInput = ({
|
|
|
76
47
|
className,
|
|
77
48
|
clearable,
|
|
78
49
|
containerProps,
|
|
79
|
-
customInputType: (
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
style
|
|
88
|
-
}));
|
|
89
|
-
},
|
|
50
|
+
customInputType: ({ onChange: inputOnChange, ...restInputProps }) => /* @__PURE__ */ import_react.default.createElement(import_TimeInputImpl.TimeInputImpl, {
|
|
51
|
+
"aria-label": ariaLabel,
|
|
52
|
+
disabled,
|
|
53
|
+
format,
|
|
54
|
+
onChange: (time) => inputOnChange(time),
|
|
55
|
+
...restInputProps,
|
|
56
|
+
style
|
|
57
|
+
}),
|
|
90
58
|
disabled,
|
|
91
59
|
innerRef,
|
|
92
60
|
isShowElipsisActive: false,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/TimeInput/DSTimeInput.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-utilities';\nimport { DSInput } from '../Input';\nimport { TimeInputImpl } from './TimeInputImpl';\n\nconst DSTimeInput = ({\n containerProps = {},\n innerRef,\n className = '',\n style = {},\n onChange = () => null,\n format,\n value = '',\n clearable = false,\n disabled = false,\n ariaLabel = 'Time input',\n}) => (\n <DSInput\n className={className}\n clearable={clearable}\n containerProps={containerProps}\n customInputType={({ onChange: inputOnChange, ...restInputProps }) => (\n <TimeInputImpl\n aria-label={ariaLabel}\n disabled={disabled}\n format={format}\n onChange={(time) => inputOnChange(time)}\n {...restInputProps}\n style={style}\n />\n )}\n disabled={disabled}\n innerRef={innerRef}\n isShowElipsisActive={false}\n onChange={onChange}\n onClear={() => onChange(null)}\n value={value}\n />\n);\n\nDSTimeInput.defaultProps = {\n format: 'hh:mm:ss',\n disabled: false,\n clearable: true,\n};\n\nconst props = {\n /** Injected props to wrapper element of component */\n containerProps: PropTypes.object.description(\n 'Injected props to wrapper element of component',\n ),\n /**\n * Allows a function that is triggered once the time input changes\n */\n onChange: PropTypes.func.description(\n 'Allows a function that is triggered once the time input changes',\n ),\n /** a11y aria label */\n 'aria-label': PropTypes.string.description('a11y aria label'),\n /** style object for time input wrapper */\n style: PropTypes.object.description('style object for time input wrapper'),\n /** inner ref for time inpot wrapper */\n innerRef: PropTypes.oneOfType([\n PropTypes.func,\n PropTypes.shape({ current: PropTypes.any }),\n ]).description('inner ref for time input wrapper'),\n /** class for time input */\n className: PropTypes.string.description('class for time input'),\n /**\n * Valid time format\n */\n format: PropTypes.string.description('Valid time format'),\n /**\n * Default value once the component is initialized\n */\n value: PropTypes.string.description(\n 'Default value once the component is initialized',\n ),\n /**\n * Whether the time input is clearable or not\n */\n clearable: PropTypes.bool.description(\n 'Whether the time input is clearable or not',\n ),\n /**\n * Whether the time input is disabled or not\n */\n disabled: PropTypes.bool.description(\n 'Whether the time input is disabled or not',\n ),\n /**\n * Aria label\n */\n ariaLabel: PropTypes.string.description('Aria label'),\n};\n\nDSTimeInput.propTypes = props;\nDSTimeInput.displayName = 'DSTimeInput';\nconst DSTimeInputWithSchema = describe(DSTimeInput);\nDSTimeInputWithSchema.propTypes = props;\n\nexport { TimeInputImpl, DSTimeInputWithSchema, DSTimeInput };\n\nexport default DSTimeInput;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,0BAAoC;AACpC,mBAAwB;AACxB,2BAA8B;AAE9B,MAAM,cAAc,CAAC;AAAA,EACnB,iBAAiB,CAAC;AAAA,EAClB;AAAA,EACA,YAAY;AAAA,EACZ,QAAQ,CAAC;AAAA,EACT,WAAW,MAAM;AAAA,EACjB;AAAA,EACA,QAAQ;AAAA,EACR,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,YAAY;AAAA,MAEZ,mDAAC;AAAA,EACC;AAAA,EACA;AAAA,EACA;AAAA,EACA,iBAAiB,CAAC,EAAE,UAAU,kBAAkB,qBAC9C,mDAAC;AAAA,IACC,cAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA,UAAU,CAAC,SAAS,cAAc,IAAI;AAAA,IACrC,GAAG;AAAA,IACJ;AAAA,GACF;AAAA,EAEF;AAAA,EACA;AAAA,EACA,qBAAqB;AAAA,EACrB;AAAA,EACA,SAAS,MAAM,SAAS,IAAI;AAAA,EAC5B;AAAA,CACF;AAGF,YAAY,eAAe;AAAA,EACzB,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,WAAW;AACb;AAEA,MAAM,QAAQ;AAAA,EAEZ,gBAAgB,8BAAU,OAAO,YAC/B,gDACF;AAAA,EAIA,UAAU,8BAAU,KAAK,YACvB,iEACF;AAAA,EAEA,cAAc,8BAAU,OAAO,YAAY,iBAAiB;AAAA,EAE5D,OAAO,8BAAU,OAAO,YAAY,qCAAqC;AAAA,EAEzE,UAAU,8BAAU,UAAU;AAAA,IAC5B,8BAAU;AAAA,IACV,8BAAU,MAAM,EAAE,SAAS,8BAAU,IAAI,CAAC;AAAA,EAC5C,CAAC,EAAE,YAAY,kCAAkC;AAAA,EAEjD,WAAW,8BAAU,OAAO,YAAY,sBAAsB;AAAA,EAI9D,QAAQ,8BAAU,OAAO,YAAY,mBAAmB;AAAA,EAIxD,OAAO,8BAAU,OAAO,YACtB,iDACF;AAAA,EAIA,WAAW,8BAAU,KAAK,YACxB,4CACF;AAAA,EAIA,UAAU,8BAAU,KAAK,YACvB,2CACF;AAAA,EAIA,WAAW,8BAAU,OAAO,YAAY,YAAY;AACtD;AAEA,YAAY,YAAY;AACxB,YAAY,cAAc;AAC1B,MAAM,wBAAwB,kCAAS,WAAW;AAClD,sBAAsB,YAAY;AAIlC,IAAO,sBAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -3,22 +3,8 @@ var __create = Object.create;
|
|
|
3
3
|
var __defProp = Object.defineProperty;
|
|
4
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
7
6
|
var __getProtoOf = Object.getPrototypeOf;
|
|
8
7
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
9
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
10
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
11
|
-
var __spreadValues = (a, b) => {
|
|
12
|
-
for (var prop in b || (b = {}))
|
|
13
|
-
if (__hasOwnProp.call(b, prop))
|
|
14
|
-
__defNormalProp(a, prop, b[prop]);
|
|
15
|
-
if (__getOwnPropSymbols)
|
|
16
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
17
|
-
if (__propIsEnum.call(b, prop))
|
|
18
|
-
__defNormalProp(a, prop, b[prop]);
|
|
19
|
-
}
|
|
20
|
-
return a;
|
|
21
|
-
};
|
|
22
8
|
var __export = (target, all) => {
|
|
23
9
|
for (var name in all)
|
|
24
10
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -71,7 +57,7 @@ const TimeInputImpl = ({
|
|
|
71
57
|
disabled,
|
|
72
58
|
innerRef,
|
|
73
59
|
onClick: handleFocus
|
|
74
|
-
}, /* @__PURE__ */ import_react.default.createElement(import_TimeInputs.TimeInputs,
|
|
60
|
+
}, /* @__PURE__ */ import_react.default.createElement(import_TimeInputs.TimeInputs, {
|
|
75
61
|
"aria-label": ariaLabel,
|
|
76
62
|
clearable,
|
|
77
63
|
disabled,
|
|
@@ -80,8 +66,9 @@ const TimeInputImpl = ({
|
|
|
80
66
|
inputsContainer = node;
|
|
81
67
|
},
|
|
82
68
|
onChange,
|
|
83
|
-
time: value
|
|
84
|
-
|
|
69
|
+
time: value,
|
|
70
|
+
...visibleInputs
|
|
71
|
+
}));
|
|
85
72
|
};
|
|
86
73
|
TimeInputImpl.propTypes = {
|
|
87
74
|
containerProps: import_prop_types.default.shape({}),
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/TimeInput/TimeInputImpl.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React, { useRef, useMemo } from 'react';\nimport PropTypes from 'prop-types';\nimport { getVisibleTimeByFormat } from '@elliemae/ds-utilities';\nimport memoizeOne from 'memoize-one';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport { TimeInputs } from './TimeInputs';\n\nconst blockName = 'input-time';\n\nconst InputTimeContainer = aggregatedClasses('div')(blockName);\n\nconst TimeInputImpl = ({\n format,\n innerRef,\n onChange,\n className,\n value,\n disabled,\n clearable,\n 'arial-label': ariaLabel,\n}) => {\n const getVisibleTimeInputs = memoizeOne((formatValue) =>\n getVisibleTimeByFormat(formatValue),\n );\n let inputsContainer = useRef();\n\n const handleFocus = (e) => {\n if (!e.target.type) {\n inputsContainer.querySelector('input').focus();\n }\n };\n\n const visibleInputs = useMemo(() => getVisibleTimeInputs(format));\n\n return (\n <InputTimeContainer\n className={className}\n disabled={disabled}\n innerRef={innerRef}\n onClick={handleFocus}\n >\n <TimeInputs\n aria-label={ariaLabel}\n clearable={clearable}\n disabled={disabled}\n format={format}\n innerRef={(node) => {\n inputsContainer = node;\n }}\n onChange={onChange}\n time={value}\n {...visibleInputs}\n />\n </InputTimeContainer>\n );\n};\n\nTimeInputImpl.propTypes = {\n containerProps: PropTypes.shape({}),\n /**\n * Inner reference to the input\n */\n innerRef: PropTypes.any,\n /**\n * Classes to add to the container\n */\n className: PropTypes.string,\n /**\n * Styles to add to the container\n */\n style: PropTypes.shape({}),\n /**\n * Allows a function that is triggered once the time input changes\n */\n onChange: PropTypes.func,\n /**\n * Valid time format\n */\n format: PropTypes.string,\n /**\n * Default value once the component is initialized\n */\n value: PropTypes.string,\n /**\n * Whether the time input is clearable or not\n */\n clearable: PropTypes.bool,\n /**\n * Whether the time input is disabled or not\n */\n disabled: PropTypes.bool,\n /**\n * Aria label to add to the container\n */\n 'aria-label': PropTypes.bool,\n 'arial-label': PropTypes.bool,\n};\n\nexport { TimeInputImpl };\nexport default TimeInputImpl;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAuC;AACvC,wBAAsB;AACtB,0BAAuC;AACvC,yBAAuB;AACvB,2BAAkC;AAClC,wBAA2B;AAE3B,MAAM,YAAY;AAElB,MAAM,qBAAqB,4CAAkB,KAAK,EAAE,SAAS;AAE7D,MAAM,gBAAgB,CAAC;AAAA,EACrB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AAAA,MACX;AACJ,QAAM,uBAAuB,gCAAW,CAAC,gBACvC,gDAAuB,WAAW,CACpC;AACA,MAAI,kBAAkB,yBAAO;AAE7B,QAAM,cAAc,CAAC,MAAM;AACzB,QAAI,CAAC,EAAE,OAAO,MAAM;AAClB,sBAAgB,cAAc,OAAO,EAAE,MAAM;AAAA,IAC/C;AAAA,EACF;AAEA,QAAM,gBAAgB,0BAAQ,MAAM,qBAAqB,MAAM,CAAC;AAEhE,SACE,mDAAC;AAAA,IACC;AAAA,IACA;AAAA,IACA;AAAA,IACA,SAAS;AAAA,KAET,mDAAC;AAAA,IACC,cAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA,UAAU,CAAC,SAAS;AAClB,wBAAkB;AAAA,IACpB;AAAA,IACA;AAAA,IACA,MAAM;AAAA,IACL,GAAG;AAAA,GACN,CACF;AAEJ;AAEA,cAAc,YAAY;AAAA,EACxB,gBAAgB,0BAAU,MAAM,CAAC,CAAC;AAAA,EAIlC,UAAU,0BAAU;AAAA,EAIpB,WAAW,0BAAU;AAAA,EAIrB,OAAO,0BAAU,MAAM,CAAC,CAAC;AAAA,EAIzB,UAAU,0BAAU;AAAA,EAIpB,QAAQ,0BAAU;AAAA,EAIlB,OAAO,0BAAU;AAAA,EAIjB,WAAW,0BAAU;AAAA,EAIrB,UAAU,0BAAU;AAAA,EAIpB,cAAc,0BAAU;AAAA,EACxB,eAAe,0BAAU;AAC3B;AAGA,IAAO,wBAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,27 +1,10 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
var __create = Object.create;
|
|
3
3
|
var __defProp = Object.defineProperty;
|
|
4
|
-
var __defProps = Object.defineProperties;
|
|
5
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
6
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
7
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
8
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
9
6
|
var __getProtoOf = Object.getPrototypeOf;
|
|
10
7
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
11
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
12
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
13
|
-
var __spreadValues = (a, b) => {
|
|
14
|
-
for (var prop in b || (b = {}))
|
|
15
|
-
if (__hasOwnProp.call(b, prop))
|
|
16
|
-
__defNormalProp(a, prop, b[prop]);
|
|
17
|
-
if (__getOwnPropSymbols)
|
|
18
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
19
|
-
if (__propIsEnum.call(b, prop))
|
|
20
|
-
__defNormalProp(a, prop, b[prop]);
|
|
21
|
-
}
|
|
22
|
-
return a;
|
|
23
|
-
};
|
|
24
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
25
8
|
var __export = (target, all) => {
|
|
26
9
|
for (var name in all)
|
|
27
10
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -263,7 +246,8 @@ const TimeInputs = ({
|
|
|
263
246
|
const renderSecondsInput = () => {
|
|
264
247
|
if (!showSeconds)
|
|
265
248
|
return null;
|
|
266
|
-
return /* @__PURE__ */ import_react.default.createElement(TimeInput,
|
|
249
|
+
return /* @__PURE__ */ import_react.default.createElement(TimeInput, {
|
|
250
|
+
...(0, import_utils.commonInputProps)((e) => onKeyDown(e, import_ds_shared.GENERAL_TIME_RANGE.max), onInputFocus, onClick),
|
|
267
251
|
key: "seconds-input",
|
|
268
252
|
"data-testid": "ds-time-input__seconds",
|
|
269
253
|
"aria-label": ariaLabel || ariaLabel2 || "Seconds Input",
|
|
@@ -272,12 +256,13 @@ const TimeInputs = ({
|
|
|
272
256
|
onChange: handleSecondsChange,
|
|
273
257
|
placeholder: (0, import_utils.placeholderFormat)(import_ds_shared.PLACEHOLDER_TIME.seconds, format),
|
|
274
258
|
value: seconds
|
|
275
|
-
})
|
|
259
|
+
});
|
|
276
260
|
};
|
|
277
261
|
const renderMinutesInput = () => {
|
|
278
262
|
if (!showMinutes)
|
|
279
263
|
return null;
|
|
280
|
-
return /* @__PURE__ */ import_react.default.createElement(TimeInput,
|
|
264
|
+
return /* @__PURE__ */ import_react.default.createElement(TimeInput, {
|
|
265
|
+
...(0, import_utils.commonInputProps)((e) => onKeyDown(e, import_ds_shared.GENERAL_TIME_RANGE.max), onInputFocus, onClick),
|
|
281
266
|
key: "minutes-input",
|
|
282
267
|
"data-testid": "ds-time-input__minutes",
|
|
283
268
|
"aria-label": ariaLabel || ariaLabel2 || "Minutes Input",
|
|
@@ -286,13 +271,14 @@ const TimeInputs = ({
|
|
|
286
271
|
onChange: handleMinutesChange,
|
|
287
272
|
placeholder: (0, import_utils.placeholderFormat)(import_ds_shared.PLACEHOLDER_TIME.minutes, format),
|
|
288
273
|
value: minutes
|
|
289
|
-
})
|
|
274
|
+
});
|
|
290
275
|
};
|
|
291
276
|
const renderHoursInput = () => {
|
|
292
277
|
if (!showHours)
|
|
293
278
|
return null;
|
|
294
279
|
const hourFormatRange = use12Hours ? import_ds_shared.HOUR_RANGE_12 : import_ds_shared.HOUR_RANGE_24;
|
|
295
|
-
return /* @__PURE__ */ import_react.default.createElement(TimeInput,
|
|
280
|
+
return /* @__PURE__ */ import_react.default.createElement(TimeInput, {
|
|
281
|
+
...(0, import_utils.commonInputProps)((e) => onKeyDown(e, hourFormatRange.max), onInputFocus, onClick),
|
|
296
282
|
key: "hour-input",
|
|
297
283
|
"data-testid": "ds-time-input__hours",
|
|
298
284
|
"aria-label": ariaLabel || ariaLabel2 || "Hours Input",
|
|
@@ -301,12 +287,13 @@ const TimeInputs = ({
|
|
|
301
287
|
onChange: handleHoursChange,
|
|
302
288
|
placeholder: (0, import_utils.placeholderFormat)(import_ds_shared.PLACEHOLDER_TIME.hour, format, use12Hours),
|
|
303
289
|
value: hours
|
|
304
|
-
})
|
|
290
|
+
});
|
|
305
291
|
};
|
|
306
292
|
const renderMeridiemInput = () => {
|
|
307
293
|
if (!use12Hours)
|
|
308
294
|
return null;
|
|
309
|
-
return /* @__PURE__ */ import_react.default.createElement(TimeInput,
|
|
295
|
+
return /* @__PURE__ */ import_react.default.createElement(TimeInput, {
|
|
296
|
+
...import_utils.commonInputProps,
|
|
310
297
|
key: "meridiem-input",
|
|
311
298
|
"data-testid": "ds-time-input__ampm",
|
|
312
299
|
"aria-label": ariaLabel || ariaLabel2 || "Meridiem Input",
|
|
@@ -315,7 +302,7 @@ const TimeInputs = ({
|
|
|
315
302
|
onKeyDown: handleMeridiemKeyDown,
|
|
316
303
|
placeholder: (0, import_utils.placeholderFormat)(import_ds_shared.PLACEHOLDER_TIME.meridiem, format),
|
|
317
304
|
value: meridiem
|
|
318
|
-
})
|
|
305
|
+
});
|
|
319
306
|
};
|
|
320
307
|
const renderTimeInputs = () => {
|
|
321
308
|
const inputs = [renderHoursInput(), renderMinutesInput(), renderSecondsInput()];
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/TimeInput/TimeInputs.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable complexity */\n/* eslint-disable react/prop-types */\n/* eslint-disable max-lines */\n/* eslint-disable max-statements */\nimport React, { useEffect, useState } from 'react';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport moment from 'moment';\nimport {\n commonInputProps,\n formatHour,\n formatMinutes,\n formatSeconds,\n formatMeridiem,\n getValidTimeNumber,\n setNativeValue,\n parseTimeNumberFromText,\n focusNextInput,\n focusPreviousInput,\n getTimeValuesFromTime,\n isArrowIncrementDecrement,\n shouldFocusNextInput,\n placeholderFormat,\n} from './utils';\nimport {\n AM,\n PM,\n ARROW_UP,\n ARROW_DOWN,\n BACKSPACE,\n ESCAPE,\n HOME,\n HOUR_RANGE_12,\n HOUR_RANGE_24,\n GENERAL_TIME_RANGE,\n END,\n PLACEHOLDER_TIME,\n SHIFT,\n} from '@elliemae/ds-shared';\n\nconst blockName = 'input-times-group';\n\nconst InputTimesGroup = aggregatedClasses('div')(blockName);\nconst TimeInput = aggregatedClasses('input')(blockName, 'input');\nconst Divider = aggregatedClasses('span')(blockName, 'divider', ({ value }) => ({\n value,\n}));\n\n// eslint-disable-next-line react/prop-types\nconst TimeDivider = ({ content = ':', value = '' }) => <Divider value={!!value}>{content}</Divider>;\n\nconst TimeInputs = ({\n time,\n format,\n use12Hours,\n step = 1,\n showHours,\n showMinutes,\n showSeconds,\n onChange,\n disabled,\n innerRef,\n clearable,\n 'arial-label': ariaLabel,\n 'aria-label': ariaLabel2,\n}) => {\n const [meridiem, setMeridiem] = useState('');\n const [hours, setHours] = useState('');\n const [minutes, setMinutes] = useState('');\n const [hasInputValue, setHasInputValue] = useState(false);\n const [seconds, setSeconds] = useState('');\n const [currentKey, setCurrentKey] = useState('');\n const [hasInputBeenTriggered, setHasInputBeenTriggered] = useState(false);\n\n const [lastTypedNumber, setLastTypedNumber] = useState(null);\n const inputRefs = {\n hours: null,\n minutes: null,\n seconds: null,\n meridiem: null,\n };\n\n useEffect(() => {\n if (time && moment(time).isValid()) {\n const timeValues = getTimeValuesFromTime(time, format, use12Hours);\n\n setMeridiem(timeValues.meridiem);\n setHours(timeValues.hours);\n setMinutes(timeValues.minutes);\n setSeconds(timeValues.seconds);\n } else {\n setMeridiem('');\n setHours('');\n setMinutes('');\n setSeconds('');\n }\n }, [time, format, use12Hours]);\n\n useEffect(() => {\n const selectedTime = time || moment();\n if (isTimeCompletelySet() && selectedTime.hours && hasInputBeenTriggered) {\n if (showHours && hours) selectedTime.hours(hours);\n if (showMinutes && minutes) selectedTime.minutes(minutes);\n if (showSeconds && seconds) selectedTime.seconds(seconds);\n if (use12Hours && meridiem) {\n const nextHours = meridiem.toLowerCase() === AM ? hours % 12 : (hours % 12) + 12;\n selectedTime.hour(nextHours);\n }\n onChange(selectedTime);\n setHasInputBeenTriggered(false);\n }\n }, [hours, minutes, seconds, meridiem]);\n\n const focusNextInputIfNeeded = (currentEl, max, number) => {\n if (\n shouldFocusNextInput(max, number, currentEl.value) &&\n !isArrowIncrementDecrement(currentKey) &&\n !hasInputValue\n ) {\n focusNextInput(currentEl);\n }\n };\n\n const getNextTimeValue = (value, incrementing = true) => {\n const parsedValue = parseTimeNumberFromText(value);\n return incrementing ? parsedValue + step : parsedValue - step;\n };\n\n const onInputFocus = (e) => {\n e.preventDefault();\n e.stopPropagation();\n e.target.select();\n };\n\n const onClick = (e) => {\n if (e.target.value) {\n setHasInputValue(true);\n }\n };\n\n // eslint-disable-next-line max-statements\n const onKeyDown = (event, max) => {\n const { target } = event;\n const { value } = target;\n setLastTypedNumber(event.key);\n switch (event.key) {\n case ARROW_UP: {\n event.preventDefault();\n setCurrentKey(event.key);\n const incrementedValue = getNextTimeValue(value);\n setNativeValue(event.target, incrementedValue);\n break;\n }\n case ARROW_DOWN: {\n event.preventDefault();\n setCurrentKey(event.key);\n const decrementedValue = getNextTimeValue(value, false);\n setNativeValue(event.target, decrementedValue);\n break;\n }\n case BACKSPACE: {\n event.preventDefault();\n if (!value) {\n focusPreviousInput(event.target);\n } else {\n setNativeValue(event.target, '');\n }\n break;\n }\n case ESCAPE: {\n event.preventDefault();\n event.target.blur();\n break;\n }\n case HOME: {\n event.preventDefault();\n setNativeValue(event.target, String(max));\n focusNextInput(event.target);\n break;\n }\n case END: {\n event.preventDefault();\n setNativeValue(event.target, '00');\n focusNextInput(event.target);\n break;\n }\n case SHIFT:\n event.preventDefault();\n setCurrentKey(event.key);\n break;\n default:\n break;\n }\n };\n\n const isTimeCompletelySet = () => {\n let neededValues = [];\n\n if (showHours) neededValues = [...neededValues, hours || null];\n if (showMinutes) neededValues = [...neededValues, minutes || null];\n if (showSeconds) neededValues = [...neededValues, seconds || null];\n if (use12Hours) neededValues = [...neededValues, meridiem || null];\n\n return !neededValues.some((value) => !value);\n };\n\n const handleSecondsChange = (e) => {\n const { value } = e.target;\n const secondsHandled = parseTimeNumberFromText(value);\n\n const nextSeconds = getValidTimeNumber(GENERAL_TIME_RANGE, secondsHandled, lastTypedNumber);\n\n setSeconds(formatSeconds(format, nextSeconds));\n setHasInputBeenTriggered(true);\n focusNextInputIfNeeded(e.target, GENERAL_TIME_RANGE.max, value);\n };\n\n const handleMinutesChange = (e) => {\n const { value } = e.target;\n const minutesHandled = parseTimeNumberFromText(value);\n const nextMinutes = getValidTimeNumber(GENERAL_TIME_RANGE, minutesHandled, lastTypedNumber);\n\n setMinutes(formatMinutes(format, nextMinutes));\n setHasInputBeenTriggered(true);\n focusNextInputIfNeeded(e.target, GENERAL_TIME_RANGE.max, value);\n };\n\n const handleHoursChange = (e) => {\n const { value } = e.target;\n const hour = parseTimeNumberFromText(value);\n const hoursRange = use12Hours ? HOUR_RANGE_12 : HOUR_RANGE_24;\n\n const nextHour = getValidTimeNumber(hoursRange, hour, lastTypedNumber);\n setHours(formatHour(format, nextHour));\n setHasInputBeenTriggered(true);\n focusNextInputIfNeeded(e.target, hoursRange.max, value);\n };\n\n const handleMeridiemKeyDown = (e) => {\n if (e.key === ARROW_UP || e.key === 'a') {\n setMeridiem(formatMeridiem(format, AM));\n } else if (e.key === ARROW_DOWN || e.key === 'p') {\n setMeridiem(formatMeridiem(format, PM));\n } else if (e.key === SHIFT) {\n setCurrentKey(e.key);\n } else if (e.key === BACKSPACE) {\n setMeridiem('');\n }\n setHasInputBeenTriggered(true);\n };\n\n const handleMeridiemBlur = (e) => {\n const { value } = e.target;\n if (value !== AM && value !== PM) {\n setMeridiem('');\n }\n };\n\n const handleOnBlur = (event) => {\n const selectedTime = moment();\n if (clearable && !event.currentTarget.contains(event.relatedTarget)) {\n if (showHours && hours) selectedTime.hours(hours);\n if (showMinutes && minutes) selectedTime.minutes(minutes);\n if (showSeconds && seconds) selectedTime.seconds(seconds);\n if (use12Hours && meridiem) {\n const nextHours = meridiem.toLowerCase() === AM ? hours % 12 : (hours % 12) + 12;\n selectedTime.hour(nextHours);\n }\n onChange(selectedTime);\n }\n };\n\n const renderSecondsInput = () => {\n if (!showSeconds) return null;\n\n return (\n <TimeInput\n {...commonInputProps((e) => onKeyDown(e, GENERAL_TIME_RANGE.max), onInputFocus, onClick)}\n key=\"seconds-input\"\n data-testid=\"ds-time-input__seconds\"\n aria-label={ariaLabel || ariaLabel2 || 'Seconds Input'}\n disabled={disabled}\n // eslint-disable-next-line no-return-assign\n innerRef={(node) => (inputRefs.seconds = node)}\n onChange={handleSecondsChange}\n placeholder={placeholderFormat(PLACEHOLDER_TIME.seconds, format)}\n value={seconds}\n />\n );\n };\n\n const renderMinutesInput = () => {\n if (!showMinutes) return null;\n\n return (\n <TimeInput\n {...commonInputProps((e) => onKeyDown(e, GENERAL_TIME_RANGE.max), onInputFocus, onClick)}\n key=\"minutes-input\"\n data-testid=\"ds-time-input__minutes\"\n aria-label={ariaLabel || ariaLabel2 || 'Minutes Input'}\n disabled={disabled}\n // eslint-disable-next-line no-return-assign\n innerRef={(node) => (inputRefs.minutes = node)}\n onChange={handleMinutesChange}\n placeholder={placeholderFormat(PLACEHOLDER_TIME.minutes, format)}\n value={minutes}\n />\n );\n };\n\n const renderHoursInput = () => {\n if (!showHours) return null;\n const hourFormatRange = use12Hours ? HOUR_RANGE_12 : HOUR_RANGE_24;\n\n return (\n <TimeInput\n {...commonInputProps((e) => onKeyDown(e, hourFormatRange.max), onInputFocus, onClick)}\n key=\"hour-input\"\n data-testid=\"ds-time-input__hours\"\n aria-label={ariaLabel || ariaLabel2 || 'Hours Input'}\n disabled={disabled}\n // eslint-disable-next-line no-return-assign\n innerRef={(node) => (inputRefs.hours = node)}\n onChange={handleHoursChange}\n placeholder={placeholderFormat(PLACEHOLDER_TIME.hour, format, use12Hours)}\n value={hours}\n />\n );\n };\n\n const renderMeridiemInput = () => {\n if (!use12Hours) return null;\n\n return (\n <TimeInput\n {...commonInputProps}\n key=\"meridiem-input\"\n data-testid=\"ds-time-input__ampm\"\n aria-label={ariaLabel || ariaLabel2 || 'Meridiem Input'}\n disabled={disabled}\n onBlur={handleMeridiemBlur}\n onKeyDown={handleMeridiemKeyDown}\n placeholder={placeholderFormat(PLACEHOLDER_TIME.meridiem, format)}\n value={meridiem}\n />\n );\n };\n\n const renderTimeInputs = () => {\n const inputs = [renderHoursInput(), renderMinutesInput(), renderSecondsInput()];\n /* eslint-disable indent */\n const inputsWithDividers = inputs.reduce(\n (acc, input, index) =>\n input\n ? acc.concat([\n index ? (\n <TimeDivider\n // eslint-disable-next-line react/no-array-index-key\n key={index}\n content=\":\"\n value={input.props.value}\n />\n ) : null,\n input,\n ])\n : acc,\n [],\n );\n /* eslint-enable indent */\n\n return [\n inputsWithDividers,\n React.createElement('span', { key: 'span' }), // hack for next/prev focus\n renderMeridiemInput(),\n ];\n };\n\n return (\n <InputTimesGroup onBlur={handleOnBlur} innerRef={innerRef}>\n {renderTimeInputs()}\n </InputTimesGroup>\n );\n};\n\nexport { TimeInputs };\nexport default TimeInputs;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADIvB,mBAA2C;AAC3C,2BAAkC;AAClC,oBAAmB;AACnB,mBAeO;AACP,uBAcO;AAEP,MAAM,YAAY;AAElB,MAAM,kBAAkB,4CAAkB,KAAK,EAAE,SAAS;AAC1D,MAAM,YAAY,4CAAkB,OAAO,EAAE,WAAW,OAAO;AAC/D,MAAM,UAAU,4CAAkB,MAAM,EAAE,WAAW,WAAW,CAAC,EAAE,YAAa;AAAA,EAC9E;AACF,EAAE;AAGF,MAAM,cAAc,CAAC,EAAE,UAAU,KAAK,QAAQ,SAAS,mDAAC;AAAA,EAAQ,OAAO,CAAC,CAAC;AAAA,GAAQ,OAAQ;AAEzF,MAAM,aAAa,CAAC;AAAA,EAClB;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AAAA,EACf,cAAc;AAAA,MACV;AACJ,QAAM,CAAC,UAAU,eAAe,2BAAS,EAAE;AAC3C,QAAM,CAAC,OAAO,YAAY,2BAAS,EAAE;AACrC,QAAM,CAAC,SAAS,cAAc,2BAAS,EAAE;AACzC,QAAM,CAAC,eAAe,oBAAoB,2BAAS,KAAK;AACxD,QAAM,CAAC,SAAS,cAAc,2BAAS,EAAE;AACzC,QAAM,CAAC,YAAY,iBAAiB,2BAAS,EAAE;AAC/C,QAAM,CAAC,uBAAuB,4BAA4B,2BAAS,KAAK;AAExE,QAAM,CAAC,iBAAiB,sBAAsB,2BAAS,IAAI;AAC3D,QAAM,YAAY;AAAA,IAChB,OAAO;AAAA,IACP,SAAS;AAAA,IACT,SAAS;AAAA,IACT,UAAU;AAAA,EACZ;AAEA,8BAAU,MAAM;AACd,QAAI,QAAQ,2BAAO,IAAI,EAAE,QAAQ,GAAG;AAClC,YAAM,aAAa,wCAAsB,MAAM,QAAQ,UAAU;AAEjE,kBAAY,WAAW,QAAQ;AAC/B,eAAS,WAAW,KAAK;AACzB,iBAAW,WAAW,OAAO;AAC7B,iBAAW,WAAW,OAAO;AAAA,IAC/B,OAAO;AACL,kBAAY,EAAE;AACd,eAAS,EAAE;AACX,iBAAW,EAAE;AACb,iBAAW,EAAE;AAAA,IACf;AAAA,EACF,GAAG,CAAC,MAAM,QAAQ,UAAU,CAAC;AAE7B,8BAAU,MAAM;AACd,UAAM,eAAe,QAAQ,2BAAO;AACpC,QAAI,oBAAoB,KAAK,aAAa,SAAS,uBAAuB;AACxE,UAAI,aAAa;AAAO,qBAAa,MAAM,KAAK;AAChD,UAAI,eAAe;AAAS,qBAAa,QAAQ,OAAO;AACxD,UAAI,eAAe;AAAS,qBAAa,QAAQ,OAAO;AACxD,UAAI,cAAc,UAAU;AAC1B,cAAM,YAAY,SAAS,YAAY,MAAM,sBAAK,QAAQ,KAAM,QAAQ,KAAM;AAC9E,qBAAa,KAAK,SAAS;AAAA,MAC7B;AACA,eAAS,YAAY;AACrB,+BAAyB,KAAK;AAAA,IAChC;AAAA,EACF,GAAG,CAAC,OAAO,SAAS,SAAS,QAAQ,CAAC;AAEtC,QAAM,yBAAyB,CAAC,WAAW,KAAK,WAAW;AACzD,QACE,uCAAqB,KAAK,QAAQ,UAAU,KAAK,KACjD,CAAC,4CAA0B,UAAU,KACrC,CAAC,eACD;AACA,uCAAe,SAAS;AAAA,IAC1B;AAAA,EACF;AAEA,QAAM,mBAAmB,CAAC,OAAO,eAAe,SAAS;AACvD,UAAM,cAAc,0CAAwB,KAAK;AACjD,WAAO,eAAe,cAAc,OAAO,cAAc;AAAA,EAC3D;AAEA,QAAM,eAAe,CAAC,MAAM;AAC1B,MAAE,eAAe;AACjB,MAAE,gBAAgB;AAClB,MAAE,OAAO,OAAO;AAAA,EAClB;AAEA,QAAM,UAAU,CAAC,MAAM;AACrB,QAAI,EAAE,OAAO,OAAO;AAClB,uBAAiB,IAAI;AAAA,IACvB;AAAA,EACF;AAGA,QAAM,YAAY,CAAC,OAAO,QAAQ;AAChC,UAAM,EAAE,WAAW;AACnB,UAAM,EAAE,UAAU;AAClB,uBAAmB,MAAM,GAAG;AAC5B,YAAQ,MAAM;AAAA,WACP,2BAAU;AACb,cAAM,eAAe;AACrB,sBAAc,MAAM,GAAG;AACvB,cAAM,mBAAmB,iBAAiB,KAAK;AAC/C,yCAAe,MAAM,QAAQ,gBAAgB;AAC7C;AAAA,MACF;AAAA,WACK,6BAAY;AACf,cAAM,eAAe;AACrB,sBAAc,MAAM,GAAG;AACvB,cAAM,mBAAmB,iBAAiB,OAAO,KAAK;AACtD,yCAAe,MAAM,QAAQ,gBAAgB;AAC7C;AAAA,MACF;AAAA,WACK,4BAAW;AACd,cAAM,eAAe;AACrB,YAAI,CAAC,OAAO;AACV,+CAAmB,MAAM,MAAM;AAAA,QACjC,OAAO;AACL,2CAAe,MAAM,QAAQ,EAAE;AAAA,QACjC;AACA;AAAA,MACF;AAAA,WACK,yBAAQ;AACX,cAAM,eAAe;AACrB,cAAM,OAAO,KAAK;AAClB;AAAA,MACF;AAAA,WACK,uBAAM;AACT,cAAM,eAAe;AACrB,yCAAe,MAAM,QAAQ,OAAO,GAAG,CAAC;AACxC,yCAAe,MAAM,MAAM;AAC3B;AAAA,MACF;AAAA,WACK,sBAAK;AACR,cAAM,eAAe;AACrB,yCAAe,MAAM,QAAQ,IAAI;AACjC,yCAAe,MAAM,MAAM;AAC3B;AAAA,MACF;AAAA,WACK;AACH,cAAM,eAAe;AACrB,sBAAc,MAAM,GAAG;AACvB;AAAA;AAEA;AAAA;AAAA,EAEN;AAEA,QAAM,sBAAsB,MAAM;AAChC,QAAI,eAAe,CAAC;AAEpB,QAAI;AAAW,qBAAe,CAAC,GAAG,cAAc,SAAS,IAAI;AAC7D,QAAI;AAAa,qBAAe,CAAC,GAAG,cAAc,WAAW,IAAI;AACjE,QAAI;AAAa,qBAAe,CAAC,GAAG,cAAc,WAAW,IAAI;AACjE,QAAI;AAAY,qBAAe,CAAC,GAAG,cAAc,YAAY,IAAI;AAEjE,WAAO,CAAC,aAAa,KAAK,CAAC,UAAU,CAAC,KAAK;AAAA,EAC7C;AAEA,QAAM,sBAAsB,CAAC,MAAM;AACjC,UAAM,EAAE,UAAU,EAAE;AACpB,UAAM,iBAAiB,0CAAwB,KAAK;AAEpD,UAAM,cAAc,qCAAmB,qCAAoB,gBAAgB,eAAe;AAE1F,eAAW,gCAAc,QAAQ,WAAW,CAAC;AAC7C,6BAAyB,IAAI;AAC7B,2BAAuB,EAAE,QAAQ,oCAAmB,KAAK,KAAK;AAAA,EAChE;AAEA,QAAM,sBAAsB,CAAC,MAAM;AACjC,UAAM,EAAE,UAAU,EAAE;AACpB,UAAM,iBAAiB,0CAAwB,KAAK;AACpD,UAAM,cAAc,qCAAmB,qCAAoB,gBAAgB,eAAe;AAE1F,eAAW,gCAAc,QAAQ,WAAW,CAAC;AAC7C,6BAAyB,IAAI;AAC7B,2BAAuB,EAAE,QAAQ,oCAAmB,KAAK,KAAK;AAAA,EAChE;AAEA,QAAM,oBAAoB,CAAC,MAAM;AAC/B,UAAM,EAAE,UAAU,EAAE;AACpB,UAAM,OAAO,0CAAwB,KAAK;AAC1C,UAAM,aAAa,aAAa,iCAAgB;AAEhD,UAAM,WAAW,qCAAmB,YAAY,MAAM,eAAe;AACrE,aAAS,6BAAW,QAAQ,QAAQ,CAAC;AACrC,6BAAyB,IAAI;AAC7B,2BAAuB,EAAE,QAAQ,WAAW,KAAK,KAAK;AAAA,EACxD;AAEA,QAAM,wBAAwB,CAAC,MAAM;AACnC,QAAI,EAAE,QAAQ,6BAAY,EAAE,QAAQ,KAAK;AACvC,kBAAY,iCAAe,QAAQ,mBAAE,CAAC;AAAA,IACxC,WAAW,EAAE,QAAQ,+BAAc,EAAE,QAAQ,KAAK;AAChD,kBAAY,iCAAe,QAAQ,mBAAE,CAAC;AAAA,IACxC,WAAW,EAAE,QAAQ,wBAAO;AAC1B,oBAAc,EAAE,GAAG;AAAA,IACrB,WAAW,EAAE,QAAQ,4BAAW;AAC9B,kBAAY,EAAE;AAAA,IAChB;AACA,6BAAyB,IAAI;AAAA,EAC/B;AAEA,QAAM,qBAAqB,CAAC,MAAM;AAChC,UAAM,EAAE,UAAU,EAAE;AACpB,QAAI,UAAU,uBAAM,UAAU,qBAAI;AAChC,kBAAY,EAAE;AAAA,IAChB;AAAA,EACF;AAEA,QAAM,eAAe,CAAC,UAAU;AAC9B,UAAM,eAAe,2BAAO;AAC5B,QAAI,aAAa,CAAC,MAAM,cAAc,SAAS,MAAM,aAAa,GAAG;AACnE,UAAI,aAAa;AAAO,qBAAa,MAAM,KAAK;AAChD,UAAI,eAAe;AAAS,qBAAa,QAAQ,OAAO;AACxD,UAAI,eAAe;AAAS,qBAAa,QAAQ,OAAO;AACxD,UAAI,cAAc,UAAU;AAC1B,cAAM,YAAY,SAAS,YAAY,MAAM,sBAAK,QAAQ,KAAM,QAAQ,KAAM;AAC9E,qBAAa,KAAK,SAAS;AAAA,MAC7B;AACA,eAAS,YAAY;AAAA,IACvB;AAAA,EACF;AAEA,QAAM,qBAAqB,MAAM;AAC/B,QAAI,CAAC;AAAa,aAAO;AAEzB,WACE,mDAAC;AAAA,MACE,GAAG,mCAAiB,CAAC,MAAM,UAAU,GAAG,oCAAmB,GAAG,GAAG,cAAc,OAAO;AAAA,MACvF,KAAI;AAAA,MACJ,eAAY;AAAA,MACZ,cAAY,aAAa,cAAc;AAAA,MACvC;AAAA,MAEA,UAAU,CAAC,SAAU,UAAU,UAAU;AAAA,MACzC,UAAU;AAAA,MACV,aAAa,oCAAkB,kCAAiB,SAAS,MAAM;AAAA,MAC/D,OAAO;AAAA,KACT;AAAA,EAEJ;AAEA,QAAM,qBAAqB,MAAM;AAC/B,QAAI,CAAC;AAAa,aAAO;AAEzB,WACE,mDAAC;AAAA,MACE,GAAG,mCAAiB,CAAC,MAAM,UAAU,GAAG,oCAAmB,GAAG,GAAG,cAAc,OAAO;AAAA,MACvF,KAAI;AAAA,MACJ,eAAY;AAAA,MACZ,cAAY,aAAa,cAAc;AAAA,MACvC;AAAA,MAEA,UAAU,CAAC,SAAU,UAAU,UAAU;AAAA,MACzC,UAAU;AAAA,MACV,aAAa,oCAAkB,kCAAiB,SAAS,MAAM;AAAA,MAC/D,OAAO;AAAA,KACT;AAAA,EAEJ;AAEA,QAAM,mBAAmB,MAAM;AAC7B,QAAI,CAAC;AAAW,aAAO;AACvB,UAAM,kBAAkB,aAAa,iCAAgB;AAErD,WACE,mDAAC;AAAA,MACE,GAAG,mCAAiB,CAAC,MAAM,UAAU,GAAG,gBAAgB,GAAG,GAAG,cAAc,OAAO;AAAA,MACpF,KAAI;AAAA,MACJ,eAAY;AAAA,MACZ,cAAY,aAAa,cAAc;AAAA,MACvC;AAAA,MAEA,UAAU,CAAC,SAAU,UAAU,QAAQ;AAAA,MACvC,UAAU;AAAA,MACV,aAAa,oCAAkB,kCAAiB,MAAM,QAAQ,UAAU;AAAA,MACxE,OAAO;AAAA,KACT;AAAA,EAEJ;AAEA,QAAM,sBAAsB,MAAM;AAChC,QAAI,CAAC;AAAY,aAAO;AAExB,WACE,mDAAC;AAAA,MACE,GAAG;AAAA,MACJ,KAAI;AAAA,MACJ,eAAY;AAAA,MACZ,cAAY,aAAa,cAAc;AAAA,MACvC;AAAA,MACA,QAAQ;AAAA,MACR,WAAW;AAAA,MACX,aAAa,oCAAkB,kCAAiB,UAAU,MAAM;AAAA,MAChE,OAAO;AAAA,KACT;AAAA,EAEJ;AAEA,QAAM,mBAAmB,MAAM;AAC7B,UAAM,SAAS,CAAC,iBAAiB,GAAG,mBAAmB,GAAG,mBAAmB,CAAC;AAE9E,UAAM,qBAAqB,OAAO,OAChC,CAAC,KAAK,OAAO,UACX,QACI,IAAI,OAAO;AAAA,MACT,QACE,mDAAC;AAAA,QAEC,KAAK;AAAA,QACL,SAAQ;AAAA,QACR,OAAO,MAAM,MAAM;AAAA,OACrB,IACE;AAAA,MACJ;AAAA,IACF,CAAC,IACD,KACN,CAAC,CACH;AAGA,WAAO;AAAA,MACL;AAAA,MACA,qBAAM,cAAc,QAAQ,EAAE,KAAK,OAAO,CAAC;AAAA,MAC3C,oBAAoB;AAAA,IACtB;AAAA,EACF;AAEA,SACE,mDAAC;AAAA,IAAgB,QAAQ;AAAA,IAAc;AAAA,KACpC,iBAAiB,CACpB;AAEJ;AAGA,IAAO,qBAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,39 +1,10 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
var __create = Object.create;
|
|
3
3
|
var __defProp = Object.defineProperty;
|
|
4
|
-
var __defProps = Object.defineProperties;
|
|
5
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
6
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
7
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
8
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
9
6
|
var __getProtoOf = Object.getPrototypeOf;
|
|
10
7
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
11
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
12
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
13
|
-
var __spreadValues = (a, b) => {
|
|
14
|
-
for (var prop in b || (b = {}))
|
|
15
|
-
if (__hasOwnProp.call(b, prop))
|
|
16
|
-
__defNormalProp(a, prop, b[prop]);
|
|
17
|
-
if (__getOwnPropSymbols)
|
|
18
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
19
|
-
if (__propIsEnum.call(b, prop))
|
|
20
|
-
__defNormalProp(a, prop, b[prop]);
|
|
21
|
-
}
|
|
22
|
-
return a;
|
|
23
|
-
};
|
|
24
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
25
|
-
var __objRest = (source, exclude) => {
|
|
26
|
-
var target = {};
|
|
27
|
-
for (var prop in source)
|
|
28
|
-
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
29
|
-
target[prop] = source[prop];
|
|
30
|
-
if (source != null && __getOwnPropSymbols)
|
|
31
|
-
for (var prop of __getOwnPropSymbols(source)) {
|
|
32
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
33
|
-
target[prop] = source[prop];
|
|
34
|
-
}
|
|
35
|
-
return target;
|
|
36
|
-
};
|
|
37
8
|
var __export = (target, all) => {
|
|
38
9
|
for (var name in all)
|
|
39
10
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -60,43 +31,31 @@ var import_react = __toESM(require("react"));
|
|
|
60
31
|
var import_ds_utilities = require("@elliemae/ds-utilities");
|
|
61
32
|
var import_DSToggleImpl = require("./DSToggleImpl");
|
|
62
33
|
var import_ds_shared = require("@elliemae/ds-shared");
|
|
63
|
-
const DSToggle = (
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
checked,
|
|
89
|
-
containerProps,
|
|
90
|
-
disabled,
|
|
91
|
-
hasError,
|
|
92
|
-
labelOff,
|
|
93
|
-
labelOn,
|
|
94
|
-
name,
|
|
95
|
-
readOnly,
|
|
96
|
-
size,
|
|
97
|
-
value
|
|
98
|
-
}));
|
|
99
|
-
};
|
|
34
|
+
const DSToggle = ({
|
|
35
|
+
containerProps,
|
|
36
|
+
hasError,
|
|
37
|
+
readOnly,
|
|
38
|
+
disabled,
|
|
39
|
+
checked,
|
|
40
|
+
labelOn,
|
|
41
|
+
labelOff,
|
|
42
|
+
name,
|
|
43
|
+
value,
|
|
44
|
+
size,
|
|
45
|
+
...otherProps
|
|
46
|
+
}) => /* @__PURE__ */ import_react.default.createElement(import_DSToggleImpl.DSToggleImpl, {
|
|
47
|
+
...otherProps,
|
|
48
|
+
checked,
|
|
49
|
+
containerProps,
|
|
50
|
+
disabled,
|
|
51
|
+
hasError,
|
|
52
|
+
labelOff,
|
|
53
|
+
labelOn,
|
|
54
|
+
name,
|
|
55
|
+
readOnly,
|
|
56
|
+
size,
|
|
57
|
+
value
|
|
58
|
+
});
|
|
100
59
|
DSToggle.defaultProps = {
|
|
101
60
|
labelOn: "ON",
|
|
102
61
|
labelOff: "OFF",
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/Toggle/DSToggle.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-utilities';\nimport { DSToggleImpl } from './DSToggleImpl';\nimport { dsBasicSizes } from '@elliemae/ds-shared';\n\nconst DSToggle = ({\n containerProps,\n hasError,\n readOnly,\n disabled,\n checked,\n labelOn,\n labelOff,\n name,\n value,\n size,\n ...otherProps\n}) => (\n <DSToggleImpl\n {...otherProps}\n checked={checked}\n containerProps={containerProps}\n disabled={disabled}\n hasError={hasError}\n labelOff={labelOff}\n labelOn={labelOn}\n name={name}\n readOnly={readOnly}\n size={size}\n value={value}\n />\n);\n\nDSToggle.defaultProps = {\n labelOn: 'ON',\n labelOff: 'OFF',\n size: 's',\n hasError: false,\n readOnly: false,\n disabled: false,\n checked: undefined,\n};\n\nconst props = {\n /**\n * Set of Properties attached to the main container\n */\n containerProps: PropTypes.shape({}).description('Set of Properties attached to the main container'),\n /**\n * Whether the toggle has error or not\n */\n hasError: PropTypes.bool.description('Whether the toggle has error or not'),\n /**\n * Whether the toggle is read only or not\n */\n readOnly: PropTypes.bool.description('Whether the toggle is read only or not'),\n /**\n * Whether the toggle is disabled or not\n */\n disabled: PropTypes.bool.description('Whether the toggle is disabled or not'),\n /**\n * Whether the toggle is checked or not\n */\n checked: PropTypes.bool.description('Whether the toggle is checked or not'),\n /**\n * Allows a function that is triggered once the toggle changes\n */\n onChange: PropTypes.func.description('Allows a function that is triggered once the toggle changes'),\n /**\n * Label to show when the toggle is ON\n */\n labelOn: PropTypes.string.description('Label to show when the toggle is ON'),\n /**\n * Label to show when the toggle is OFF\n */\n labelOff: PropTypes.string.description('Label to show when the toggle is OFF'),\n /**\n * Default value once the component is initialized\n */\n value: PropTypes.string.description('Default value once the component is initialized'),\n /**\n * ['s', 'm', 'l']\n */\n size: PropTypes.oneOf(dsBasicSizes).description(\"['s', 'm', 'l']\"),\n /**\n * Input name\n */\n name: PropTypes.string.description('Input name'),\n};\n\nDSToggle.propTypes = props;\nDSToggle.displayName = 'DSToggle';\nconst DSToggleWithSchema = describe(DSToggle);\n\nDSToggleWithSchema.propTypes = props;\n\nexport default DSToggle;\n\nexport { DSToggleWithSchema, DSToggle };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,0BAAoC;AACpC,0BAA6B;AAC7B,uBAA6B;AAE7B,MAAM,WAAW,CAAC;AAAA,EAChB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,KACG;AAAA,MAEH,mDAAC;AAAA,EACE,GAAG;AAAA,EACJ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,CACF;AAGF,SAAS,eAAe;AAAA,EACtB,SAAS;AAAA,EACT,UAAU;AAAA,EACV,MAAM;AAAA,EACN,UAAU;AAAA,EACV,UAAU;AAAA,EACV,UAAU;AAAA,EACV,SAAS;AACX;AAEA,MAAM,QAAQ;AAAA,EAIZ,gBAAgB,8BAAU,MAAM,CAAC,CAAC,EAAE,YAAY,kDAAkD;AAAA,EAIlG,UAAU,8BAAU,KAAK,YAAY,qCAAqC;AAAA,EAI1E,UAAU,8BAAU,KAAK,YAAY,wCAAwC;AAAA,EAI7E,UAAU,8BAAU,KAAK,YAAY,uCAAuC;AAAA,EAI5E,SAAS,8BAAU,KAAK,YAAY,sCAAsC;AAAA,EAI1E,UAAU,8BAAU,KAAK,YAAY,6DAA6D;AAAA,EAIlG,SAAS,8BAAU,OAAO,YAAY,qCAAqC;AAAA,EAI3E,UAAU,8BAAU,OAAO,YAAY,sCAAsC;AAAA,EAI7E,OAAO,8BAAU,OAAO,YAAY,iDAAiD;AAAA,EAIrF,MAAM,8BAAU,MAAM,6BAAY,EAAE,YAAY,iBAAiB;AAAA,EAIjE,MAAM,8BAAU,OAAO,YAAY,YAAY;AACjD;AAEA,SAAS,YAAY;AACrB,SAAS,cAAc;AACvB,MAAM,qBAAqB,kCAAS,QAAQ;AAE5C,mBAAmB,YAAY;AAE/B,IAAO,mBAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,27 +1,10 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
var __create = Object.create;
|
|
3
3
|
var __defProp = Object.defineProperty;
|
|
4
|
-
var __defProps = Object.defineProperties;
|
|
5
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
6
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
7
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
8
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
9
6
|
var __getProtoOf = Object.getPrototypeOf;
|
|
10
7
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
11
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
12
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
13
|
-
var __spreadValues = (a, b) => {
|
|
14
|
-
for (var prop in b || (b = {}))
|
|
15
|
-
if (__hasOwnProp.call(b, prop))
|
|
16
|
-
__defNormalProp(a, prop, b[prop]);
|
|
17
|
-
if (__getOwnPropSymbols)
|
|
18
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
19
|
-
if (__propIsEnum.call(b, prop))
|
|
20
|
-
__defNormalProp(a, prop, b[prop]);
|
|
21
|
-
}
|
|
22
|
-
return a;
|
|
23
|
-
};
|
|
24
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
25
8
|
var __export = (target, all) => {
|
|
26
9
|
for (var name in all)
|
|
27
10
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -162,9 +145,10 @@ class DSToggleImpl extends import_react.Component {
|
|
|
162
145
|
}
|
|
163
146
|
static getDerivedStateFromProps(props, state) {
|
|
164
147
|
if (props.checked === true || props.checked === false) {
|
|
165
|
-
return
|
|
166
|
-
checked: props.checked
|
|
167
|
-
|
|
148
|
+
return {
|
|
149
|
+
checked: props.checked,
|
|
150
|
+
...(0, import_toggleHelper.dragStartingPoints)(props.checked)(state)
|
|
151
|
+
};
|
|
168
152
|
}
|
|
169
153
|
return null;
|
|
170
154
|
}
|
|
@@ -203,7 +187,8 @@ class DSToggleImpl extends import_react.Component {
|
|
|
203
187
|
render() {
|
|
204
188
|
const { checked, drag, inside, hide } = this.state;
|
|
205
189
|
const dragStyle = drag !== null || checked || this.props.checked ? { left: `${drag}px` } : null;
|
|
206
|
-
return /* @__PURE__ */ import_react.default.createElement(import_DSToggleRender.DSToggleRender,
|
|
190
|
+
return /* @__PURE__ */ import_react.default.createElement(import_DSToggleRender.DSToggleRender, {
|
|
191
|
+
...this.props,
|
|
207
192
|
defaultState: this.props.checked,
|
|
208
193
|
checked,
|
|
209
194
|
containerRef: this.box,
|
|
@@ -221,7 +206,7 @@ class DSToggleImpl extends import_react.Component {
|
|
|
221
206
|
onTouchEnd: this.onTouchEnd,
|
|
222
207
|
onTouchMove: this.onTouchMove,
|
|
223
208
|
onTouchStart: this.onTouchStart
|
|
224
|
-
})
|
|
209
|
+
});
|
|
225
210
|
}
|
|
226
211
|
}
|
|
227
212
|
DSToggleImpl.propTypes = import_props.togglePropTypes;
|