@elliemae/ds-form-checkbox 3.10.0-next.9 → 3.10.2
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/ControlledCheckbox.js +7 -106
- package/dist/cjs/ControlledCheckbox.js.map +2 -2
- package/dist/cjs/ControlledCheckboxCTX.js +36 -0
- package/dist/cjs/ControlledCheckboxCTX.js.map +7 -0
- package/dist/cjs/config/useCheckBox.js +56 -0
- package/dist/cjs/config/useCheckBox.js.map +7 -0
- package/dist/cjs/config/useEventHandlers.js +67 -0
- package/dist/cjs/config/useEventHandlers.js.map +7 -0
- package/dist/cjs/config/useValidateProps.js +0 -15
- package/dist/cjs/config/useValidateProps.js.map +2 -2
- package/dist/cjs/constants/device.js +35 -0
- package/dist/cjs/constants/device.js.map +7 -0
- package/dist/cjs/exported-related/data-test-ids.js.map +1 -1
- package/dist/cjs/exported-related/theming.js.map +1 -1
- package/dist/cjs/parts/ControlledCheckBoxContent.js +74 -0
- package/dist/cjs/parts/ControlledCheckBoxContent.js.map +7 -0
- package/dist/cjs/parts/MainInput.js +76 -0
- package/dist/cjs/parts/MainInput.js.map +7 -0
- package/dist/cjs/react-desc-prop-types.js +22 -9
- package/dist/cjs/react-desc-prop-types.js.map +2 -2
- package/dist/cjs/utils/styleHelpers.js +0 -1
- package/dist/cjs/utils/styleHelpers.js.map +2 -2
- package/dist/esm/ControlledCheckbox.js +10 -114
- package/dist/esm/ControlledCheckbox.js.map +2 -2
- package/dist/esm/ControlledCheckboxCTX.js +10 -0
- package/dist/esm/ControlledCheckboxCTX.js.map +7 -0
- package/dist/esm/config/useCheckBox.js +30 -0
- package/dist/esm/config/useCheckBox.js.map +7 -0
- package/dist/esm/config/useEventHandlers.js +41 -0
- package/dist/esm/config/useEventHandlers.js.map +7 -0
- package/dist/esm/config/useValidateProps.js +0 -15
- package/dist/esm/config/useValidateProps.js.map +2 -2
- package/dist/esm/constants/device.js +9 -0
- package/dist/esm/constants/device.js.map +7 -0
- package/dist/esm/exported-related/data-test-ids.js.map +1 -1
- package/dist/esm/exported-related/theming.js.map +1 -1
- package/dist/esm/parts/ControlledCheckBoxContent.js +48 -0
- package/dist/esm/parts/ControlledCheckBoxContent.js.map +7 -0
- package/dist/esm/parts/MainInput.js +50 -0
- package/dist/esm/parts/MainInput.js.map +7 -0
- package/dist/esm/react-desc-prop-types.js +23 -10
- package/dist/esm/react-desc-prop-types.js.map +2 -2
- package/dist/esm/utils/styleHelpers.js +0 -1
- package/dist/esm/utils/styleHelpers.js.map +2 -2
- package/package.json +7 -4
|
@@ -30,115 +30,16 @@ __export(ControlledCheckbox_exports, {
|
|
|
30
30
|
module.exports = __toCommonJS(ControlledCheckbox_exports);
|
|
31
31
|
var React = __toESM(require("react"));
|
|
32
32
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
33
|
-
var import_react = require("react");
|
|
34
|
-
var import_uid = require("uid");
|
|
35
33
|
var import_ds_utilities = require("@elliemae/ds-utilities");
|
|
36
|
-
var import_ds_truncated_tooltip_text = require("@elliemae/ds-truncated-tooltip-text");
|
|
37
|
-
var import_styles = require("./styles");
|
|
38
34
|
var import_react_desc_prop_types = require("./react-desc-prop-types");
|
|
39
|
-
var
|
|
35
|
+
var import_useCheckBox = require("./config/useCheckBox");
|
|
36
|
+
var import_ControlledCheckboxCTX = require("./ControlledCheckboxCTX");
|
|
37
|
+
var import_ControlledCheckBoxContent = require("./parts/ControlledCheckBoxContent");
|
|
40
38
|
const DSControlledCheckbox = (props) => {
|
|
41
|
-
const
|
|
42
|
-
(0,
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
device,
|
|
46
|
-
label,
|
|
47
|
-
hasError,
|
|
48
|
-
innerRef,
|
|
49
|
-
wrapLabel,
|
|
50
|
-
ariaLabel: legacyAriaLabel,
|
|
51
|
-
ariaControls: legacyAriaControls
|
|
52
|
-
} = propsWithDefault;
|
|
53
|
-
const handleMixedCheckboxOnKeyDown = (0, import_react.useCallback)((e) => {
|
|
54
|
-
if (e.code === "Space") {
|
|
55
|
-
const { currentTarget } = e;
|
|
56
|
-
currentTarget.click();
|
|
57
|
-
e.preventDefault();
|
|
58
|
-
}
|
|
59
|
-
}, []);
|
|
60
|
-
const {
|
|
61
|
-
id,
|
|
62
|
-
disabled,
|
|
63
|
-
readOnly,
|
|
64
|
-
label: globalLabel,
|
|
65
|
-
"aria-label": ariaLabel,
|
|
66
|
-
"aria-controls": ariaControls,
|
|
67
|
-
className,
|
|
68
|
-
onChange,
|
|
69
|
-
tabIndex,
|
|
70
|
-
onKeyDown: userOnKeyDown,
|
|
71
|
-
...restGlobals
|
|
72
|
-
} = (0, import_ds_utilities.useGetGlobalAttributes)(propsWithDefault, {
|
|
73
|
-
onKeyDown: handleMixedCheckboxOnKeyDown
|
|
74
|
-
});
|
|
75
|
-
const instanceUid = (0, import_react.useMemo)(() => id || (0, import_uid.uid)(5), [id]);
|
|
76
|
-
const onChangeValue = (0, import_react.useCallback)(
|
|
77
|
-
(e) => {
|
|
78
|
-
if (checked === "mixed")
|
|
79
|
-
onChange(true, e);
|
|
80
|
-
if (checked === true)
|
|
81
|
-
onChange(false, e);
|
|
82
|
-
if (checked === false)
|
|
83
|
-
onChange(true, e);
|
|
84
|
-
},
|
|
85
|
-
[checked, onChange]
|
|
86
|
-
);
|
|
87
|
-
const xstyledProps = (0, import_ds_utilities.useGetXstyledProps)(propsWithDefault);
|
|
88
|
-
const commonProps = {
|
|
89
|
-
"data-testid": "ds-checkbox",
|
|
90
|
-
...restGlobals,
|
|
91
|
-
id: instanceUid,
|
|
92
|
-
"aria-label": ariaLabel || legacyAriaLabel || label,
|
|
93
|
-
"aria-checked": checked
|
|
94
|
-
};
|
|
95
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_styles.StyledContainer, {
|
|
96
|
-
device,
|
|
97
|
-
"data-testid": "ds-checkbox-container",
|
|
98
|
-
className,
|
|
99
|
-
...xstyledProps,
|
|
100
|
-
children: [
|
|
101
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledCheckBox, {
|
|
102
|
-
device,
|
|
103
|
-
checked,
|
|
104
|
-
hasError,
|
|
105
|
-
disabled,
|
|
106
|
-
readOnly,
|
|
107
|
-
children: ariaControls || legacyAriaControls ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledInputMixed, {
|
|
108
|
-
...commonProps,
|
|
109
|
-
role: "checkbox",
|
|
110
|
-
"aria-controls": ariaControls || legacyAriaControls,
|
|
111
|
-
"aria-disabled": disabled,
|
|
112
|
-
onClick: !disabled && !readOnly ? onChangeValue : void 0,
|
|
113
|
-
onKeyDown: userOnKeyDown,
|
|
114
|
-
tabIndex: tabIndex ?? (disabled ? -1 : 0),
|
|
115
|
-
ref: innerRef
|
|
116
|
-
}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledInput, {
|
|
117
|
-
...commonProps,
|
|
118
|
-
type: "checkbox",
|
|
119
|
-
checked,
|
|
120
|
-
onChange: onChangeValue,
|
|
121
|
-
disabled,
|
|
122
|
-
tabIndex,
|
|
123
|
-
ref: innerRef
|
|
124
|
-
})
|
|
125
|
-
}),
|
|
126
|
-
label && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledLabel, {
|
|
127
|
-
htmlFor: instanceUid,
|
|
128
|
-
disabled,
|
|
129
|
-
readOnly,
|
|
130
|
-
checked,
|
|
131
|
-
"data-testid": "ds-checkbox-label",
|
|
132
|
-
wrapLabel,
|
|
133
|
-
device,
|
|
134
|
-
...!disabled && (ariaControls || legacyAriaControls) ? { onClick: onChangeValue } : {},
|
|
135
|
-
children: wrapLabel ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledWrapLabel, {
|
|
136
|
-
children: label
|
|
137
|
-
}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_truncated_tooltip_text.SimpleTruncatedTooltipText, {
|
|
138
|
-
value: label
|
|
139
|
-
})
|
|
140
|
-
})
|
|
141
|
-
]
|
|
39
|
+
const ctx = (0, import_useCheckBox.useCheckBox)(props);
|
|
40
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ControlledCheckboxCTX.ControlledCheckBoxContext.Provider, {
|
|
41
|
+
value: ctx,
|
|
42
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ControlledCheckBoxContent.ControlledCheckBoxContent, {})
|
|
142
43
|
});
|
|
143
44
|
};
|
|
144
45
|
DSControlledCheckbox.propTypes = import_react_desc_prop_types.propTypes;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/ControlledCheckbox.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable complexity */\nimport React, {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;
|
|
4
|
+
"sourcesContent": ["/* eslint-disable complexity */\nimport React, { WeakValidationMap } from 'react';\nimport { describe } from '@elliemae/ds-utilities';\nimport { DSControlledCheckboxT, propTypes } from './react-desc-prop-types';\nimport { useCheckBox } from './config/useCheckBox';\nimport { ControlledCheckBoxContext } from './ControlledCheckboxCTX';\nimport { ControlledCheckBoxContent } from './parts/ControlledCheckBoxContent';\n\nconst DSControlledCheckbox: React.ComponentType<DSControlledCheckboxT.Props> = (props) => {\n const ctx = useCheckBox(props);\n return (\n <ControlledCheckBoxContext.Provider value={ctx}>\n <ControlledCheckBoxContent />\n </ControlledCheckBoxContext.Provider>\n );\n};\n\nDSControlledCheckbox.propTypes = propTypes as WeakValidationMap<unknown>;\nDSControlledCheckbox.displayName = 'DSControlledCheckbox';\nconst DSControlledCheckboxWithSchema = describe(DSControlledCheckbox);\nDSControlledCheckboxWithSchema.propTypes = propTypes as WeakValidationMap<unknown>;\n\nexport { DSControlledCheckbox, DSControlledCheckboxWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAEA,0BAAyB;AACzB,mCAAiD;AACjD,yBAA4B;AAC5B,mCAA0C;AAC1C,uCAA0C;AAE1C,MAAM,uBAAyE,CAAC,UAAU;AACxF,QAAM,UAAM,gCAAY,KAAK;AAC7B,SACE,4CAAC,uDAA0B,UAA1B;AAAA,IAAmC,OAAO;AAAA,IACzC,sDAAC,8DAA0B;AAAA,GAC7B;AAEJ;AAEA,qBAAqB,YAAY;AACjC,qBAAqB,cAAc;AACnC,MAAM,qCAAiC,8BAAS,oBAAoB;AACpE,+BAA+B,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return to;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
24
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
25
|
+
var ControlledCheckboxCTX_exports = {};
|
|
26
|
+
__export(ControlledCheckboxCTX_exports, {
|
|
27
|
+
ControlledCheckBoxContext: () => ControlledCheckBoxContext,
|
|
28
|
+
default: () => ControlledCheckboxCTX_default
|
|
29
|
+
});
|
|
30
|
+
module.exports = __toCommonJS(ControlledCheckboxCTX_exports);
|
|
31
|
+
var React = __toESM(require("react"));
|
|
32
|
+
var import_react = require("react");
|
|
33
|
+
const defaultContext = {};
|
|
34
|
+
const ControlledCheckBoxContext = (0, import_react.createContext)(defaultContext);
|
|
35
|
+
var ControlledCheckboxCTX_default = ControlledCheckBoxContext;
|
|
36
|
+
//# sourceMappingURL=ControlledCheckboxCTX.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/ControlledCheckboxCTX.ts", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["import { createContext } from 'react';\nimport type { ControlledCheckboxCTX } from './config/useCheckBox';\n\nconst defaultContext = {} as ControlledCheckboxCTX;\n\n/** Context for cross component communication */\nexport const ControlledCheckBoxContext = createContext<ControlledCheckboxCTX>(defaultContext);\n\nexport default ControlledCheckBoxContext;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAA8B;AAG9B,MAAM,iBAAiB,CAAC;AAGjB,MAAM,gCAA4B,4BAAqC,cAAc;AAE5F,IAAO,gCAAQ;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return to;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
24
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
25
|
+
var useCheckBox_exports = {};
|
|
26
|
+
__export(useCheckBox_exports, {
|
|
27
|
+
useCheckBox: () => useCheckBox
|
|
28
|
+
});
|
|
29
|
+
module.exports = __toCommonJS(useCheckBox_exports);
|
|
30
|
+
var React = __toESM(require("react"));
|
|
31
|
+
var import_react = __toESM(require("react"));
|
|
32
|
+
var import_ds_utilities = require("@elliemae/ds-utilities");
|
|
33
|
+
var import_uid = require("uid");
|
|
34
|
+
var import_react_desc_prop_types = require("../react-desc-prop-types");
|
|
35
|
+
var import_useValidateProps = require("./useValidateProps");
|
|
36
|
+
var import_useEventHandlers = require("./useEventHandlers");
|
|
37
|
+
const useCheckBox = (props) => {
|
|
38
|
+
const propsWithDefault = (0, import_ds_utilities.useMemoMergePropsWithDefault)(props, import_react_desc_prop_types.defaultProps);
|
|
39
|
+
(0, import_useValidateProps.useValidateProps)(props, import_react_desc_prop_types.propTypes);
|
|
40
|
+
const globalProps = (0, import_ds_utilities.useGetGlobalAttributes)(propsWithDefault);
|
|
41
|
+
const xstyledProps = (0, import_ds_utilities.useGetXstyledProps)(propsWithDefault);
|
|
42
|
+
const { id } = globalProps;
|
|
43
|
+
const instanceUid = import_react.default.useMemo(() => id || (0, import_uid.uid)(5), [id]);
|
|
44
|
+
const eventHandlers = (0, import_useEventHandlers.useEventHandlers)(propsWithDefault);
|
|
45
|
+
return import_react.default.useMemo(
|
|
46
|
+
() => ({
|
|
47
|
+
propsWithDefault,
|
|
48
|
+
globalProps,
|
|
49
|
+
xstyledProps,
|
|
50
|
+
instanceUid,
|
|
51
|
+
...eventHandlers
|
|
52
|
+
}),
|
|
53
|
+
[eventHandlers, globalProps, instanceUid, propsWithDefault, xstyledProps]
|
|
54
|
+
);
|
|
55
|
+
};
|
|
56
|
+
//# sourceMappingURL=useCheckBox.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/config/useCheckBox.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { useGetGlobalAttributes, useGetXstyledProps, useMemoMergePropsWithDefault } from '@elliemae/ds-utilities';\nimport { uid } from 'uid';\nimport { DSControlledCheckboxT, propTypes, defaultProps } from '../react-desc-prop-types';\nimport { useValidateProps } from './useValidateProps';\nimport { useEventHandlers } from './useEventHandlers';\n\nexport interface ControlledCheckboxCTX extends ReturnType<typeof useEventHandlers> {\n propsWithDefault: DSControlledCheckboxT.InternalProps;\n globalProps: ReturnType<typeof useGetGlobalAttributes>;\n xstyledProps: ReturnType<typeof useGetXstyledProps>;\n instanceUid: string;\n}\n\nexport const useCheckBox = (props: DSControlledCheckboxT.Props): ControlledCheckboxCTX => {\n // =============================================================================\n // MERGE WITH DEFAULT AND VALIDATE PROPS\n // =============================================================================\n const propsWithDefault = useMemoMergePropsWithDefault<DSControlledCheckboxT.InternalProps>(props, defaultProps);\n useValidateProps(props, propTypes);\n // =============================================================================\n // GLOBAL ATTRIBUTES & XSTYLED PROPS\n // =============================================================================\n const globalProps = useGetGlobalAttributes<DSControlledCheckboxT.InternalProps>(propsWithDefault);\n const xstyledProps = useGetXstyledProps(propsWithDefault);\n // =============================================================================\n // AD HOC PER COMPONENT LOGIC\n // =============================================================================\n const { id } = globalProps;\n const instanceUid = React.useMemo(() => id || uid(5), [id]);\n\n // =============================================================================\n // HELPERS HOOKS CONFIGS\n // =============================================================================\n const eventHandlers = useEventHandlers(propsWithDefault);\n\n return React.useMemo(\n () => ({\n propsWithDefault,\n globalProps,\n xstyledProps,\n instanceUid,\n ...eventHandlers,\n }),\n [eventHandlers, globalProps, instanceUid, propsWithDefault, xstyledProps],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,0BAAyF;AACzF,iBAAoB;AACpB,mCAA+D;AAC/D,8BAAiC;AACjC,8BAAiC;AAS1B,MAAM,cAAc,CAAC,UAA8D;AAIxF,QAAM,uBAAmB,kDAAkE,OAAO,yCAAY;AAC9G,gDAAiB,OAAO,sCAAS;AAIjC,QAAM,kBAAc,4CAA4D,gBAAgB;AAChG,QAAM,mBAAe,wCAAmB,gBAAgB;AAIxD,QAAM,EAAE,GAAG,IAAI;AACf,QAAM,cAAc,aAAAA,QAAM,QAAQ,MAAM,UAAM,gBAAI,CAAC,GAAG,CAAC,EAAE,CAAC;AAK1D,QAAM,oBAAgB,0CAAiB,gBAAgB;AAEvD,SAAO,aAAAA,QAAM;AAAA,IACX,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,IACL;AAAA,IACA,CAAC,eAAe,aAAa,aAAa,kBAAkB,YAAY;AAAA,EAC1E;AACF;",
|
|
6
|
+
"names": ["React"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return to;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
24
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
25
|
+
var useEventHandlers_exports = {};
|
|
26
|
+
__export(useEventHandlers_exports, {
|
|
27
|
+
useEventHandlers: () => useEventHandlers
|
|
28
|
+
});
|
|
29
|
+
module.exports = __toCommonJS(useEventHandlers_exports);
|
|
30
|
+
var React = __toESM(require("react"));
|
|
31
|
+
var import_react = __toESM(require("react"));
|
|
32
|
+
const useEventHandlers = (props) => {
|
|
33
|
+
const { checked, onChange, onKeyDown } = props;
|
|
34
|
+
const handleOnChange = import_react.default.useCallback(
|
|
35
|
+
(e) => {
|
|
36
|
+
if (onChange) {
|
|
37
|
+
if (checked === "mixed")
|
|
38
|
+
onChange(true, e);
|
|
39
|
+
if (checked === true)
|
|
40
|
+
onChange(false, e);
|
|
41
|
+
if (checked === false)
|
|
42
|
+
onChange(true, e);
|
|
43
|
+
}
|
|
44
|
+
},
|
|
45
|
+
[checked, onChange]
|
|
46
|
+
);
|
|
47
|
+
const handleMixedCheckboxOnKeyDown = import_react.default.useCallback(
|
|
48
|
+
(e) => {
|
|
49
|
+
if (onKeyDown) {
|
|
50
|
+
onKeyDown(e);
|
|
51
|
+
}
|
|
52
|
+
if (e.code === "Space" || e.code === "Enter") {
|
|
53
|
+
handleOnChange(e);
|
|
54
|
+
e.preventDefault();
|
|
55
|
+
}
|
|
56
|
+
},
|
|
57
|
+
[handleOnChange, onKeyDown]
|
|
58
|
+
);
|
|
59
|
+
return import_react.default.useMemo(
|
|
60
|
+
() => ({
|
|
61
|
+
handleOnChange,
|
|
62
|
+
handleMixedCheckboxOnKeyDown
|
|
63
|
+
}),
|
|
64
|
+
[handleMixedCheckboxOnKeyDown, handleOnChange]
|
|
65
|
+
);
|
|
66
|
+
};
|
|
67
|
+
//# sourceMappingURL=useEventHandlers.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/config/useEventHandlers.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { DSControlledCheckboxT } from '../react-desc-prop-types';\n\nexport const useEventHandlers = (props: DSControlledCheckboxT.InternalProps) => {\n const { checked, onChange, onKeyDown } = props;\n const handleOnChange = React.useCallback(\n (\n e:\n | React.ChangeEvent<HTMLInputElement>\n | React.MouseEvent<HTMLLabelElement>\n | React.MouseEvent<HTMLDivElement>\n | React.KeyboardEvent<HTMLDivElement>,\n ) => {\n if (onChange) {\n if (checked === 'mixed') onChange(true, e);\n if (checked === true) onChange(false, e);\n if (checked === false) onChange(true, e);\n }\n },\n [checked, onChange],\n );\n const handleMixedCheckboxOnKeyDown = React.useCallback(\n (e: React.KeyboardEvent<HTMLDivElement>) => {\n if (onKeyDown) {\n // if user provides 'onKeyDown' event, he is in charge of what happens\n onKeyDown(e);\n }\n if (e.code === 'Space' || e.code === 'Enter') {\n handleOnChange(e);\n e.preventDefault(); // when selecting a checkbox we don't want to scroll for example\n }\n },\n [handleOnChange, onKeyDown],\n );\n\n return React.useMemo(\n () => ({\n handleOnChange,\n handleMixedCheckboxOnKeyDown,\n }),\n [handleMixedCheckboxOnKeyDown, handleOnChange],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAGX,MAAM,mBAAmB,CAAC,UAA+C;AAC9E,QAAM,EAAE,SAAS,UAAU,UAAU,IAAI;AACzC,QAAM,iBAAiB,aAAAA,QAAM;AAAA,IAC3B,CACE,MAKG;AACH,UAAI,UAAU;AACZ,YAAI,YAAY;AAAS,mBAAS,MAAM,CAAC;AACzC,YAAI,YAAY;AAAM,mBAAS,OAAO,CAAC;AACvC,YAAI,YAAY;AAAO,mBAAS,MAAM,CAAC;AAAA,MACzC;AAAA,IACF;AAAA,IACA,CAAC,SAAS,QAAQ;AAAA,EACpB;AACA,QAAM,+BAA+B,aAAAA,QAAM;AAAA,IACzC,CAAC,MAA2C;AAC1C,UAAI,WAAW;AAEb,kBAAU,CAAC;AAAA,MACb;AACA,UAAI,EAAE,SAAS,WAAW,EAAE,SAAS,SAAS;AAC5C,uBAAe,CAAC;AAChB,UAAE,eAAe;AAAA,MACnB;AAAA,IACF;AAAA,IACA,CAAC,gBAAgB,SAAS;AAAA,EAC5B;AAEA,SAAO,aAAAA,QAAM;AAAA,IACX,OAAO;AAAA,MACL;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,8BAA8B,cAAc;AAAA,EAC/C;AACF;",
|
|
6
|
+
"names": ["React"]
|
|
7
|
+
}
|
|
@@ -29,22 +29,7 @@ __export(useValidateProps_exports, {
|
|
|
29
29
|
module.exports = __toCommonJS(useValidateProps_exports);
|
|
30
30
|
var React = __toESM(require("react"));
|
|
31
31
|
var import_ds_utilities = require("@elliemae/ds-utilities");
|
|
32
|
-
const throwError = (message) => {
|
|
33
|
-
throw new Error(
|
|
34
|
-
`DSControlledCheckbox:: ${message}
|
|
35
|
-
`
|
|
36
|
-
);
|
|
37
|
-
};
|
|
38
32
|
const useValidateProps = (props, propTypes) => {
|
|
39
33
|
(0, import_ds_utilities.useValidateTypescriptPropTypes)(props, propTypes);
|
|
40
|
-
if (typeof props.label === "undefined" && typeof props["aria-label"] === "undefined") {
|
|
41
|
-
throwError(`Please provide a label or "aria-label" property to use this component.`);
|
|
42
|
-
}
|
|
43
|
-
if (props.checked === "mixed" && typeof props["aria-controls"] === "undefined") {
|
|
44
|
-
throwError(
|
|
45
|
-
`Please provide an ariaControls property to use a checkbox mixed state.
|
|
46
|
-
This property must be a string containing all the ids that this mixed checkbox is controlling.`
|
|
47
|
-
);
|
|
48
|
-
}
|
|
49
34
|
};
|
|
50
35
|
//# sourceMappingURL=useValidateProps.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/config/useValidateProps.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import { useValidateTypescriptPropTypes } from '@elliemae/ds-utilities';\nimport { WeakValidationMap } from 'react';\nimport { DSControlledCheckboxT } from '../react-desc-prop-types';\n\
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,0BAA+C;
|
|
4
|
+
"sourcesContent": ["import { useValidateTypescriptPropTypes } from '@elliemae/ds-utilities';\nimport { WeakValidationMap } from 'react';\nimport { DSControlledCheckboxT } from '../react-desc-prop-types';\n\nexport const useValidateProps = (props: DSControlledCheckboxT.Props, propTypes: WeakValidationMap<unknown>): void => {\n // we validate the \"required if\" via 'isRequiredIf from our custom PropTypes\n useValidateTypescriptPropTypes(props, propTypes);\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,0BAA+C;AAIxC,MAAM,mBAAmB,CAAC,OAAoC,cAAgD;AAEnH,0DAA+B,OAAO,SAAS;AACjD;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return to;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
24
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
25
|
+
var device_exports = {};
|
|
26
|
+
__export(device_exports, {
|
|
27
|
+
DEVICE: () => DEVICE
|
|
28
|
+
});
|
|
29
|
+
module.exports = __toCommonJS(device_exports);
|
|
30
|
+
var React = __toESM(require("react"));
|
|
31
|
+
const DEVICE = {
|
|
32
|
+
MOBILE: "mobile",
|
|
33
|
+
DESKTOP: "desktop"
|
|
34
|
+
};
|
|
35
|
+
//# sourceMappingURL=device.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/constants/device.ts", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["export const DEVICE = {\n MOBILE: 'mobile',\n DESKTOP: 'desktop',\n} as const;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,SAAS;AAAA,EACpB,QAAQ;AAAA,EACR,SAAS;AACX;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/exported-related/data-test-ids.ts", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["export const DSCheckboxDataTestIds = {\n CONTAINER: 'ds-checkbox-container',\n INPUT: 'ds-checkbox',\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
4
|
+
"sourcesContent": ["export const DSCheckboxDataTestIds = {\n CONTAINER: 'ds-checkbox-container',\n INPUT: 'ds-checkbox',\n} as const;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,wBAAwB;AAAA,EACnC,WAAW;AAAA,EACX,OAAO;AACT;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/exported-related/theming.ts", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["export const DSCheckboxName = 'DS-Checkbox';\n\nexport const DSCheckboxSlots = {\n CONTAINER: 'root',\n INPUT: 'input',\n LABEL: 'label',\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
4
|
+
"sourcesContent": ["export const DSCheckboxName = 'DS-Checkbox' as const;\n\nexport const DSCheckboxSlots = {\n CONTAINER: 'root',\n INPUT: 'input',\n LABEL: 'label',\n} as const;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,iBAAiB;AAEvB,MAAM,kBAAkB;AAAA,EAC7B,WAAW;AAAA,EACX,OAAO;AAAA,EACP,OAAO;AACT;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,74 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return to;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
24
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
25
|
+
var ControlledCheckBoxContent_exports = {};
|
|
26
|
+
__export(ControlledCheckBoxContent_exports, {
|
|
27
|
+
ControlledCheckBoxContent: () => ControlledCheckBoxContent
|
|
28
|
+
});
|
|
29
|
+
module.exports = __toCommonJS(ControlledCheckBoxContent_exports);
|
|
30
|
+
var React = __toESM(require("react"));
|
|
31
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
32
|
+
var import_react = __toESM(require("react"));
|
|
33
|
+
var import_ds_truncated_tooltip_text = require("@elliemae/ds-truncated-tooltip-text");
|
|
34
|
+
var import_styles = require("../styles");
|
|
35
|
+
var import_MainInput = require("./MainInput");
|
|
36
|
+
var import_ControlledCheckboxCTX = require("../ControlledCheckboxCTX");
|
|
37
|
+
const ControlledCheckBoxContent = () => {
|
|
38
|
+
const { propsWithDefault, globalProps, instanceUid, xstyledProps, handleOnChange } = import_react.default.useContext(import_ControlledCheckboxCTX.ControlledCheckBoxContext);
|
|
39
|
+
const { checked, device, label, hasError, wrapLabel, ariaControls: legacyAriaControls } = propsWithDefault;
|
|
40
|
+
const { disabled, readOnly, "aria-controls": ariaControls, className } = globalProps;
|
|
41
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_styles.StyledContainer, {
|
|
42
|
+
device,
|
|
43
|
+
"data-testid": "ds-checkbox-container",
|
|
44
|
+
className,
|
|
45
|
+
...xstyledProps,
|
|
46
|
+
children: [
|
|
47
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledCheckBox, {
|
|
48
|
+
device,
|
|
49
|
+
checked,
|
|
50
|
+
hasError,
|
|
51
|
+
disabled,
|
|
52
|
+
readOnly,
|
|
53
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_MainInput.MainInput, {})
|
|
54
|
+
}),
|
|
55
|
+
label && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledLabel, {
|
|
56
|
+
id: `${instanceUid}_label`,
|
|
57
|
+
htmlFor: instanceUid,
|
|
58
|
+
disabled,
|
|
59
|
+
readOnly,
|
|
60
|
+
checked,
|
|
61
|
+
"data-testid": "ds-checkbox-label",
|
|
62
|
+
wrapLabel,
|
|
63
|
+
device,
|
|
64
|
+
...!disabled && (ariaControls || legacyAriaControls) ? { onClick: handleOnChange } : {},
|
|
65
|
+
children: wrapLabel ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledWrapLabel, {
|
|
66
|
+
children: label
|
|
67
|
+
}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_truncated_tooltip_text.SimpleTruncatedTooltipText, {
|
|
68
|
+
value: label
|
|
69
|
+
})
|
|
70
|
+
})
|
|
71
|
+
]
|
|
72
|
+
});
|
|
73
|
+
};
|
|
74
|
+
//# sourceMappingURL=ControlledCheckBoxContent.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/parts/ControlledCheckBoxContent.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport { StyledContainer, StyledWrapLabel, StyledLabel, StyledCheckBox } from '../styles';\nimport { MainInput } from './MainInput';\nimport { ControlledCheckBoxContext } from '../ControlledCheckboxCTX';\n\nexport const ControlledCheckBoxContent = () => {\n const { propsWithDefault, globalProps, instanceUid, xstyledProps, handleOnChange } =\n React.useContext(ControlledCheckBoxContext);\n const { checked, device, label, hasError, wrapLabel, ariaControls: legacyAriaControls } = propsWithDefault;\n const { disabled, readOnly, 'aria-controls': ariaControls, className } = globalProps;\n\n return (\n <StyledContainer device={device} data-testid=\"ds-checkbox-container\" className={className} {...xstyledProps}>\n <StyledCheckBox device={device} checked={checked} hasError={hasError} disabled={disabled} readOnly={readOnly}>\n <MainInput />\n </StyledCheckBox>\n {label && (\n <StyledLabel\n id={`${instanceUid}_label`}\n htmlFor={instanceUid}\n disabled={disabled}\n readOnly={readOnly}\n checked={checked}\n data-testid=\"ds-checkbox-label\"\n wrapLabel={wrapLabel}\n device={device}\n {...(!disabled && (ariaControls || legacyAriaControls) ? { onClick: handleOnChange } : {})}\n >\n {wrapLabel ? <StyledWrapLabel>{label}</StyledWrapLabel> : <SimpleTruncatedTooltipText value={label} />}\n </StyledLabel>\n )}\n </StyledContainer>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAAA,mBAAkB;AAClB,uCAA2C;AAC3C,oBAA8E;AAC9E,uBAA0B;AAC1B,mCAA0C;AAEnC,MAAM,4BAA4B,MAAM;AAC7C,QAAM,EAAE,kBAAkB,aAAa,aAAa,cAAc,eAAe,IAC/E,aAAAA,QAAM,WAAW,sDAAyB;AAC5C,QAAM,EAAE,SAAS,QAAQ,OAAO,UAAU,WAAW,cAAc,mBAAmB,IAAI;AAC1F,QAAM,EAAE,UAAU,UAAU,iBAAiB,cAAc,UAAU,IAAI;AAEzE,SACE,6CAAC;AAAA,IAAgB;AAAA,IAAgB,eAAY;AAAA,IAAwB;AAAA,IAAuB,GAAG;AAAA,IAC7F;AAAA,kDAAC;AAAA,QAAe;AAAA,QAAgB;AAAA,QAAkB;AAAA,QAAoB;AAAA,QAAoB;AAAA,QACxF,sDAAC,8BAAU;AAAA,OACb;AAAA,MACC,SACC,4CAAC;AAAA,QACC,IAAI,GAAG;AAAA,QACP,SAAS;AAAA,QACT;AAAA,QACA;AAAA,QACA;AAAA,QACA,eAAY;AAAA,QACZ;AAAA,QACA;AAAA,QACC,GAAI,CAAC,aAAa,gBAAgB,sBAAsB,EAAE,SAAS,eAAe,IAAI,CAAC;AAAA,QAEvF,sBAAY,4CAAC;AAAA,UAAiB;AAAA,SAAM,IAAqB,4CAAC;AAAA,UAA2B,OAAO;AAAA,SAAO;AAAA,OACtG;AAAA;AAAA,GAEJ;AAEJ;",
|
|
6
|
+
"names": ["React"]
|
|
7
|
+
}
|
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return to;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
24
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
25
|
+
var MainInput_exports = {};
|
|
26
|
+
__export(MainInput_exports, {
|
|
27
|
+
MainInput: () => MainInput
|
|
28
|
+
});
|
|
29
|
+
module.exports = __toCommonJS(MainInput_exports);
|
|
30
|
+
var React = __toESM(require("react"));
|
|
31
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
32
|
+
var import_react = __toESM(require("react"));
|
|
33
|
+
var import_styles = require("../styles");
|
|
34
|
+
var import_ControlledCheckboxCTX = require("../ControlledCheckboxCTX");
|
|
35
|
+
const MainInput = () => {
|
|
36
|
+
const { propsWithDefault, globalProps, instanceUid, handleOnChange, handleMixedCheckboxOnKeyDown } = import_react.default.useContext(import_ControlledCheckboxCTX.ControlledCheckBoxContext);
|
|
37
|
+
const {
|
|
38
|
+
disabled,
|
|
39
|
+
readOnly,
|
|
40
|
+
tabIndex,
|
|
41
|
+
innerRef,
|
|
42
|
+
checked,
|
|
43
|
+
ariaControls: camelCaseAriaControls
|
|
44
|
+
} = propsWithDefault;
|
|
45
|
+
const { "aria-controls": ariaControls } = globalProps;
|
|
46
|
+
const canShowMixedState = ariaControls || camelCaseAriaControls;
|
|
47
|
+
const mainInputProps = {
|
|
48
|
+
id: instanceUid,
|
|
49
|
+
"data-testid": "ds-checkbox",
|
|
50
|
+
"aria-labelledby": `${instanceUid}_label ${instanceUid}_block_label`,
|
|
51
|
+
"aria-checked": checked,
|
|
52
|
+
...globalProps
|
|
53
|
+
};
|
|
54
|
+
if (canShowMixedState)
|
|
55
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledInputMixed, {
|
|
56
|
+
...mainInputProps,
|
|
57
|
+
role: "checkbox",
|
|
58
|
+
"aria-controls": ariaControls || camelCaseAriaControls,
|
|
59
|
+
"aria-disabled": disabled,
|
|
60
|
+
onClick: !disabled && !readOnly ? handleOnChange : void 0,
|
|
61
|
+
onKeyDown: handleMixedCheckboxOnKeyDown,
|
|
62
|
+
tabIndex: tabIndex ?? (disabled ? -1 : 0),
|
|
63
|
+
ref: innerRef
|
|
64
|
+
});
|
|
65
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledInput, {
|
|
66
|
+
...mainInputProps,
|
|
67
|
+
type: "checkbox",
|
|
68
|
+
checked,
|
|
69
|
+
onChange: handleOnChange,
|
|
70
|
+
onKeyDown: handleMixedCheckboxOnKeyDown,
|
|
71
|
+
disabled,
|
|
72
|
+
tabIndex,
|
|
73
|
+
ref: innerRef
|
|
74
|
+
});
|
|
75
|
+
};
|
|
76
|
+
//# sourceMappingURL=MainInput.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/parts/MainInput.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { StyledInput, StyledInputMixed } from '../styles';\nimport { ControlledCheckBoxContext } from '../ControlledCheckboxCTX';\n\nexport const MainInput = () => {\n const { propsWithDefault, globalProps, instanceUid, handleOnChange, handleMixedCheckboxOnKeyDown } =\n React.useContext(ControlledCheckBoxContext);\n const {\n disabled,\n readOnly,\n // label,\n tabIndex,\n innerRef,\n checked,\n ariaControls: camelCaseAriaControls,\n // ariaLabel: camelCaseAriaLabel,\n // externalLabel,\n } = propsWithDefault;\n const { 'aria-controls': ariaControls } = globalProps;\n\n // if components doesn't define 'aria-controls' it would be \"a11y invalid\" to allow 'mixed' state\n // so\n // if they are NOT provided we use <input type='checkbox' /> that has no 'mixed' state support in html5\n // if they ARE provided we use <input /> (no type checkbox) in which we super-charge the 'mixed' state via css\n // props slightly differ because of this\n // also, because of this, \"onChange\" may be an onClick (or keyboard activation) or the native \"onChange\"\n const canShowMixedState = ariaControls || camelCaseAriaControls;\n\n const mainInputProps = {\n id: instanceUid,\n 'data-testid': 'ds-checkbox',\n 'aria-labelledby': `${instanceUid}_label ${instanceUid}_block_label`,\n 'aria-checked': checked, // if user doesn't provide aria-checked, we make this the same as the actual value\n ...globalProps, // any props provided by the user will over-ride ours\n };\n\n if (canShowMixedState)\n return (\n <StyledInputMixed\n {...mainInputProps}\n role=\"checkbox\"\n aria-controls={ariaControls || camelCaseAriaControls}\n aria-disabled={disabled}\n onClick={!disabled && !readOnly ? handleOnChange : undefined}\n onKeyDown={handleMixedCheckboxOnKeyDown}\n tabIndex={tabIndex ?? (disabled ? -1 : 0)}\n ref={innerRef}\n />\n );\n return (\n <StyledInput\n {...mainInputProps}\n type=\"checkbox\"\n checked={checked as boolean | undefined}\n onChange={handleOnChange}\n onKeyDown={handleMixedCheckboxOnKeyDown}\n disabled={disabled}\n tabIndex={tabIndex}\n ref={innerRef}\n />\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAAA,mBAAkB;AAClB,oBAA8C;AAC9C,mCAA0C;AAEnC,MAAM,YAAY,MAAM;AAC7B,QAAM,EAAE,kBAAkB,aAAa,aAAa,gBAAgB,6BAA6B,IAC/F,aAAAA,QAAM,WAAW,sDAAyB;AAC5C,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IAEA;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,EAGhB,IAAI;AACJ,QAAM,EAAE,iBAAiB,aAAa,IAAI;AAQ1C,QAAM,oBAAoB,gBAAgB;AAE1C,QAAM,iBAAiB;AAAA,IACrB,IAAI;AAAA,IACJ,eAAe;AAAA,IACf,mBAAmB,GAAG,qBAAqB;AAAA,IAC3C,gBAAgB;AAAA,IAChB,GAAG;AAAA,EACL;AAEA,MAAI;AACF,WACE,4CAAC;AAAA,MACE,GAAG;AAAA,MACJ,MAAK;AAAA,MACL,iBAAe,gBAAgB;AAAA,MAC/B,iBAAe;AAAA,MACf,SAAS,CAAC,YAAY,CAAC,WAAW,iBAAiB;AAAA,MACnD,WAAW;AAAA,MACX,UAAU,aAAa,WAAW,KAAK;AAAA,MACvC,KAAK;AAAA,KACP;AAEJ,SACE,4CAAC;AAAA,IACE,GAAG;AAAA,IACJ,MAAK;AAAA,IACL;AAAA,IACA,UAAU;AAAA,IACV,WAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA,KAAK;AAAA,GACP;AAEJ;",
|
|
6
|
+
"names": ["React"]
|
|
7
|
+
}
|