@elliemae/ds-form-checkbox 3.70.0-next.7 → 3.70.0-next.70
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/TruncatedTooltipText.js +45 -8
- package/dist/cjs/TruncatedTooltipText.js.map +2 -2
- package/dist/cjs/config/useValidateProps.js +2 -2
- package/dist/cjs/config/useValidateProps.js.map +2 -2
- package/dist/cjs/{exported-related → constants}/index.js +9 -4
- package/dist/cjs/constants/index.js.map +7 -0
- package/dist/cjs/index.js +4 -4
- package/dist/cjs/index.js.map +2 -2
- package/dist/cjs/package.json +1 -4
- package/dist/cjs/parts/ControlledCheckBoxContent.js +24 -2
- package/dist/cjs/parts/ControlledCheckBoxContent.js.map +2 -2
- package/dist/cjs/react-desc-prop-types.js +2 -2
- package/dist/cjs/react-desc-prop-types.js.map +2 -2
- package/dist/cjs/styles.js +27 -44
- package/dist/cjs/styles.js.map +2 -2
- package/dist/cjs/typescript-testing/slot-props.js +48 -0
- package/dist/cjs/typescript-testing/slot-props.js.map +7 -0
- package/dist/esm/TruncatedTooltipText.js +45 -8
- package/dist/esm/TruncatedTooltipText.js.map +2 -2
- package/dist/esm/config/useValidateProps.js +1 -1
- package/dist/esm/config/useValidateProps.js.map +1 -1
- package/dist/esm/{exported-related → constants}/index.js +6 -1
- package/dist/esm/constants/index.js.map +7 -0
- package/dist/esm/index.js +1 -1
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/package.json +1 -4
- package/dist/esm/parts/ControlledCheckBoxContent.js +25 -3
- package/dist/esm/parts/ControlledCheckBoxContent.js.map +2 -2
- package/dist/esm/react-desc-prop-types.js +1 -1
- package/dist/esm/react-desc-prop-types.js.map +2 -2
- package/dist/esm/styles.js +18 -35
- package/dist/esm/styles.js.map +2 -2
- package/dist/esm/typescript-testing/slot-props.js +25 -0
- package/dist/esm/typescript-testing/slot-props.js.map +7 -0
- package/dist/types/TruncatedTooltipText.d.ts +4 -1
- package/dist/types/constants/index.d.ts +23 -0
- package/dist/types/index.d.ts +3 -3
- package/dist/types/parts/ControlledCheckBoxContent.d.ts +2 -1
- package/dist/types/parts/MainInput.d.ts +2 -1
- package/dist/types/react-desc-prop-types.d.ts +17 -1
- package/dist/types/styles.d.ts +1 -1
- package/package.json +14 -12
- package/dist/cjs/exported-related/index.js.map +0 -7
- package/dist/esm/exported-related/index.js.map +0 -7
- package/dist/types/exported-related/index.d.ts +0 -13
- package/dist/types/tests/DSControlledCheckbox.API.test.d.ts +0 -1
- package/dist/types/tests/DSControlledCheckbox.a11y.test.d.ts +0 -1
- package/dist/types/tests/DSControlledCheckbox.keyboard.test.d.ts +0 -1
- package/dist/types/tests/DSControlledCheckbox.test.d.ts +0 -1
- package/dist/types/tests/DSControlledCheckboxMixed.test.d.ts +0 -1
- package/dist/types/tests/DSControllledCheckbox.events.test.d.ts +0 -1
- package/dist/types/tests/axe.test.d.ts +0 -1
- package/dist/types/typescript-testing/typescript-checkbox-valid.d.ts +0 -1
|
@@ -36,15 +36,23 @@ var React = __toESM(require("react"));
|
|
|
36
36
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
37
37
|
var import_react = require("react");
|
|
38
38
|
var import_ds_system = require("@elliemae/ds-system");
|
|
39
|
+
var import_ds_typography = require("@elliemae/ds-typography");
|
|
39
40
|
var import_ds_floating_context = require("@elliemae/ds-floating-context");
|
|
40
|
-
|
|
41
|
+
var import_constants = require("./constants/index.js");
|
|
42
|
+
const TruncatedSpan = (0, import_ds_system.styled)(import_ds_typography.DSTypography, {
|
|
43
|
+
name: import_constants.DSCheckboxName,
|
|
44
|
+
slot: import_constants.DSCheckboxSlots.TRUNCATED_LABEL
|
|
45
|
+
})`
|
|
41
46
|
text-overflow: ellipsis;
|
|
42
47
|
white-space: nowrap;
|
|
43
48
|
overflow: hidden;
|
|
44
49
|
display: inline-block;
|
|
45
50
|
max-width: 100%;
|
|
46
51
|
`;
|
|
47
|
-
const TooltipContainer = import_ds_system.styled
|
|
52
|
+
const TooltipContainer = (0, import_ds_system.styled)("div", {
|
|
53
|
+
name: import_constants.DSCheckboxName,
|
|
54
|
+
slot: import_constants.DSCheckboxSlots.TOOLTIP_CONTAINER
|
|
55
|
+
})`
|
|
48
56
|
text-align: center;
|
|
49
57
|
min-width: ${({ theme }) => theme.space.l};
|
|
50
58
|
max-width: 250px;
|
|
@@ -57,11 +65,18 @@ const TooltipContainer = import_ds_system.styled.div`
|
|
|
57
65
|
position: relative;
|
|
58
66
|
background-color: white;
|
|
59
67
|
border-radius: 2px;
|
|
60
|
-
font-size: 13px;
|
|
61
|
-
color: ${({ theme }) => theme.colors.neutral[600]};
|
|
62
68
|
pointer-events: none;
|
|
63
69
|
`;
|
|
64
|
-
const
|
|
70
|
+
const StyledTooltipText = (0, import_ds_system.styled)(import_ds_typography.DSTypography, {
|
|
71
|
+
name: import_constants.DSCheckboxName,
|
|
72
|
+
slot: import_constants.DSCheckboxSlots.TOOLTIP_TEXT
|
|
73
|
+
})``;
|
|
74
|
+
const TruncatedTooltipText = ({
|
|
75
|
+
value = "",
|
|
76
|
+
placement = "top",
|
|
77
|
+
getOwnerProps,
|
|
78
|
+
getOwnerPropsArguments
|
|
79
|
+
}) => {
|
|
65
80
|
const [showTooltip, setShowTooltip] = (0, import_react.useState)(false);
|
|
66
81
|
const { refs, floatingStyles, arrowStyles, context } = (0, import_ds_floating_context.useFloatingContext)({
|
|
67
82
|
placement,
|
|
@@ -76,7 +91,20 @@ const TruncatedTooltipText = ({ value = "", placement = "top" }) => {
|
|
|
76
91
|
setShowTooltip(false);
|
|
77
92
|
}, []);
|
|
78
93
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
|
79
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
94
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
95
|
+
TruncatedSpan,
|
|
96
|
+
{
|
|
97
|
+
component: "span",
|
|
98
|
+
variant: "b2",
|
|
99
|
+
"data-testid": import_constants.DSCheckboxDataTestIds.TRUNCATED_LABEL,
|
|
100
|
+
innerRef: refs.setReference,
|
|
101
|
+
onMouseEnter: handleMouseEnter,
|
|
102
|
+
onMouseLeave: handleMouseLeave,
|
|
103
|
+
getOwnerProps,
|
|
104
|
+
getOwnerPropsArguments,
|
|
105
|
+
children: value
|
|
106
|
+
}
|
|
107
|
+
),
|
|
80
108
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
81
109
|
import_ds_floating_context.FloatingWrapper,
|
|
82
110
|
{
|
|
@@ -84,8 +112,17 @@ const TruncatedTooltipText = ({ value = "", placement = "top" }) => {
|
|
|
84
112
|
isOpen: showTooltip,
|
|
85
113
|
floatingStyles,
|
|
86
114
|
context,
|
|
87
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(TooltipContainer, { children: [
|
|
88
|
-
|
|
115
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(TooltipContainer, { getOwnerProps, getOwnerPropsArguments, children: [
|
|
116
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
117
|
+
StyledTooltipText,
|
|
118
|
+
{
|
|
119
|
+
component: "span",
|
|
120
|
+
variant: "b2-light",
|
|
121
|
+
getOwnerProps,
|
|
122
|
+
getOwnerPropsArguments,
|
|
123
|
+
children: value
|
|
124
|
+
}
|
|
125
|
+
),
|
|
89
126
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_floating_context.PopoverArrow, { ...arrowStyles })
|
|
90
127
|
] })
|
|
91
128
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/TruncatedTooltipText.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React, { useCallback, useState } from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport {\n useFloatingContext,\n FloatingWrapper,\n PopoverArrow,\n type DSHookFloatingContextT,\n} from '@elliemae/ds-floating-context';\n\nconst TruncatedSpan = styled.
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
4
|
+
"sourcesContent": ["import React, { useCallback, useState } from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { DSTypography } from '@elliemae/ds-typography';\nimport {\n useFloatingContext,\n FloatingWrapper,\n PopoverArrow,\n type DSHookFloatingContextT,\n} from '@elliemae/ds-floating-context';\nimport { DSCheckboxName, DSCheckboxSlots, DSCheckboxDataTestIds } from './constants/index.js';\n\nconst TruncatedSpan = styled(DSTypography, {\n name: DSCheckboxName,\n slot: DSCheckboxSlots.TRUNCATED_LABEL,\n})`\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n display: inline-block;\n max-width: 100%;\n`;\n\n// Matches DSTooltipV3's StyledTooltipContainer styles for visual consistency\nconst TooltipContainer = styled('div', {\n name: DSCheckboxName,\n slot: DSCheckboxSlots.TOOLTIP_CONTAINER,\n})`\n text-align: center;\n min-width: ${({ theme }) => theme.space.l};\n max-width: 250px;\n overflow-wrap: break-word;\n word-break: break-word;\n min-height: 30px;\n display: grid;\n align-items: center;\n padding: ${({ theme }) => `${theme.space.xxs} ${theme.space.xs}`};\n position: relative;\n background-color: white;\n border-radius: 2px;\n pointer-events: none;\n`;\n\nconst StyledTooltipText = styled(DSTypography, {\n name: DSCheckboxName,\n slot: DSCheckboxSlots.TOOLTIP_TEXT,\n})``;\n\ninterface TruncatedTooltipTextProps {\n value?: string;\n placement?: DSHookFloatingContextT.PopperPlacementsT;\n getOwnerProps?: () => object;\n getOwnerPropsArguments?: () => object;\n}\n\nconst TruncatedTooltipText = ({\n value = '',\n placement = 'top',\n getOwnerProps,\n getOwnerPropsArguments,\n}: TruncatedTooltipTextProps) => {\n const [showTooltip, setShowTooltip] = useState(false);\n\n const { refs, floatingStyles, arrowStyles, context } = useFloatingContext({\n placement,\n externallyControlledIsOpen: showTooltip,\n withoutAnimation: true,\n });\n\n const handleMouseEnter = useCallback((e: React.MouseEvent<HTMLSpanElement>) => {\n const el = e.currentTarget;\n setShowTooltip(el.offsetWidth < el.scrollWidth);\n }, []);\n\n const handleMouseLeave = useCallback(() => {\n setShowTooltip(false);\n }, []);\n\n return (\n <>\n <TruncatedSpan\n component=\"span\"\n variant=\"b2\"\n data-testid={DSCheckboxDataTestIds.TRUNCATED_LABEL}\n innerRef={refs.setReference}\n onMouseEnter={handleMouseEnter}\n onMouseLeave={handleMouseLeave}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {value}\n </TruncatedSpan>\n <FloatingWrapper\n innerRef={refs.setFloating}\n isOpen={showTooltip}\n floatingStyles={floatingStyles}\n context={context}\n >\n <TooltipContainer getOwnerProps={getOwnerProps} getOwnerPropsArguments={getOwnerPropsArguments}>\n <StyledTooltipText\n component=\"span\"\n variant=\"b2-light\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {value}\n </StyledTooltipText>\n <PopoverArrow {...arrowStyles} />\n </TooltipContainer>\n </FloatingWrapper>\n </>\n );\n};\n\nexport { TruncatedTooltipText };\nexport default TruncatedTooltipText;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD8EnB;AA9EJ,mBAA6C;AAC7C,uBAAuB;AACvB,2BAA6B;AAC7B,iCAKO;AACP,uBAAuE;AAEvE,MAAM,oBAAgB,yBAAO,mCAAc;AAAA,EACzC,MAAM;AAAA,EACN,MAAM,iCAAgB;AACxB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASD,MAAM,uBAAmB,yBAAO,OAAO;AAAA,EACrC,MAAM;AAAA,EACN,MAAM,iCAAgB;AACxB,CAAC;AAAA;AAAA,eAEc,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAO9B,CAAC,EAAE,MAAM,MAAM,GAAG,MAAM,MAAM,GAAG,IAAI,MAAM,MAAM,EAAE,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA;AAOlE,MAAM,wBAAoB,yBAAO,mCAAc;AAAA,EAC7C,MAAM;AAAA,EACN,MAAM,iCAAgB;AACxB,CAAC;AASD,MAAM,uBAAuB,CAAC;AAAA,EAC5B,QAAQ;AAAA,EACR,YAAY;AAAA,EACZ;AAAA,EACA;AACF,MAAiC;AAC/B,QAAM,CAAC,aAAa,cAAc,QAAI,uBAAS,KAAK;AAEpD,QAAM,EAAE,MAAM,gBAAgB,aAAa,QAAQ,QAAI,+CAAmB;AAAA,IACxE;AAAA,IACA,4BAA4B;AAAA,IAC5B,kBAAkB;AAAA,EACpB,CAAC;AAED,QAAM,uBAAmB,0BAAY,CAAC,MAAyC;AAC7E,UAAM,KAAK,EAAE;AACb,mBAAe,GAAG,cAAc,GAAG,WAAW;AAAA,EAChD,GAAG,CAAC,CAAC;AAEL,QAAM,uBAAmB,0BAAY,MAAM;AACzC,mBAAe,KAAK;AAAA,EACtB,GAAG,CAAC,CAAC;AAEL,SACE,4EACE;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV,SAAQ;AAAA,QACR,eAAa,uCAAsB;AAAA,QACnC,UAAU,KAAK;AAAA,QACf,cAAc;AAAA,QACd,cAAc;AAAA,QACd;AAAA,QACA;AAAA,QAEC;AAAA;AAAA,IACH;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,UAAU,KAAK;AAAA,QACf,QAAQ;AAAA,QACR;AAAA,QACA;AAAA,QAEA,uDAAC,oBAAiB,eAA8B,wBAC9C;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,WAAU;AAAA,cACV,SAAQ;AAAA,cACR;AAAA,cACA;AAAA,cAEC;AAAA;AAAA,UACH;AAAA,UACA,4CAAC,2CAAc,GAAG,aAAa;AAAA,WACjC;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;AAGA,IAAO,+BAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -33,8 +33,8 @@ __export(useValidateProps_exports, {
|
|
|
33
33
|
module.exports = __toCommonJS(useValidateProps_exports);
|
|
34
34
|
var React = __toESM(require("react"));
|
|
35
35
|
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
36
|
-
var
|
|
36
|
+
var import_constants = require("../constants/index.js");
|
|
37
37
|
const useValidateProps = (props, propTypes) => {
|
|
38
|
-
(0, import_ds_props_helpers.useValidateTypescriptPropTypes)(props, propTypes,
|
|
38
|
+
(0, import_ds_props_helpers.useValidateTypescriptPropTypes)(props, propTypes, import_constants.DSCheckboxName);
|
|
39
39
|
};
|
|
40
40
|
//# 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, type ValidationMap } from '@elliemae/ds-props-helpers';\nimport { DSCheckboxName } from '../
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,8BAAmE;AACnE,
|
|
4
|
+
"sourcesContent": ["import { useValidateTypescriptPropTypes, type ValidationMap } from '@elliemae/ds-props-helpers';\nimport { DSCheckboxName } from '../constants/index.js';\nimport type { DSControlledCheckboxT } from '../react-desc-prop-types.js';\n\nexport const useValidateProps = (props: DSControlledCheckboxT.Props, propTypes: ValidationMap<unknown>): void => {\n // we validate the \"required if\" via 'isRequiredIf from our custom PropTypes\n useValidateTypescriptPropTypes(props, propTypes, DSCheckboxName);\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,8BAAmE;AACnE,uBAA+B;AAGxB,MAAM,mBAAmB,CAAC,OAAoC,cAA4C;AAE/G,8DAA+B,OAAO,WAAW,+BAAc;AACjE;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -26,13 +26,13 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
|
|
|
26
26
|
mod
|
|
27
27
|
));
|
|
28
28
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
-
var
|
|
30
|
-
__export(
|
|
29
|
+
var constants_exports = {};
|
|
30
|
+
__export(constants_exports, {
|
|
31
31
|
DSCheckboxDataTestIds: () => DSCheckboxDataTestIds,
|
|
32
32
|
DSCheckboxName: () => DSCheckboxName,
|
|
33
33
|
DSCheckboxSlots: () => DSCheckboxSlots
|
|
34
34
|
});
|
|
35
|
-
module.exports = __toCommonJS(
|
|
35
|
+
module.exports = __toCommonJS(constants_exports);
|
|
36
36
|
var React = __toESM(require("react"));
|
|
37
37
|
var import_ds_system = require("@elliemae/ds-system");
|
|
38
38
|
const DSCheckboxName = "DSCheckbox";
|
|
@@ -40,7 +40,12 @@ const DSCheckboxSlots = {
|
|
|
40
40
|
CONTAINER: "root",
|
|
41
41
|
INPUT: "input",
|
|
42
42
|
INPUT_WRAPPER: "input-wrapper",
|
|
43
|
-
LABEL: "label"
|
|
43
|
+
LABEL: "label",
|
|
44
|
+
LABEL_TYPOGRAPHY: "label-typography",
|
|
45
|
+
READ_ONLY_HELPER: "read-only-helper",
|
|
46
|
+
TRUNCATED_LABEL: "truncated-label",
|
|
47
|
+
TOOLTIP_CONTAINER: "tooltip-container",
|
|
48
|
+
TOOLTIP_TEXT: "tooltip-text"
|
|
44
49
|
};
|
|
45
50
|
const DSCheckboxDataTestIds = {
|
|
46
51
|
...(0, import_ds_system.slotObjectToDataTestIds)(DSCheckboxName, DSCheckboxSlots),
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/constants/index.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["import { slotObjectToDataTestIds } from '@elliemae/ds-system';\n\nexport const DSCheckboxName = 'DSCheckbox';\n\nexport const DSCheckboxSlots = {\n CONTAINER: 'root',\n INPUT: 'input',\n INPUT_WRAPPER: 'input-wrapper',\n LABEL: 'label',\n LABEL_TYPOGRAPHY: 'label-typography',\n READ_ONLY_HELPER: 'read-only-helper',\n TRUNCATED_LABEL: 'truncated-label',\n TOOLTIP_CONTAINER: 'tooltip-container',\n TOOLTIP_TEXT: 'tooltip-text',\n} as const;\n\nexport const DSCheckboxDataTestIds = {\n ...slotObjectToDataTestIds(DSCheckboxName, DSCheckboxSlots),\n // for legacy reasons we have to keep those around and override the slots...\n CONTAINER: 'ds-checkbox-container',\n INPUT: 'ds-checkbox',\n} as const;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAwC;AAEjC,MAAM,iBAAiB;AAEvB,MAAM,kBAAkB;AAAA,EAC7B,WAAW;AAAA,EACX,OAAO;AAAA,EACP,eAAe;AAAA,EACf,OAAO;AAAA,EACP,kBAAkB;AAAA,EAClB,kBAAkB;AAAA,EAClB,iBAAiB;AAAA,EACjB,mBAAmB;AAAA,EACnB,cAAc;AAChB;AAEO,MAAM,wBAAwB;AAAA,EACnC,OAAG,0CAAwB,gBAAgB,eAAe;AAAA;AAAA,EAE1D,WAAW;AAAA,EACX,OAAO;AACT;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
package/dist/cjs/index.js
CHANGED
|
@@ -28,9 +28,9 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
|
|
|
28
28
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
29
|
var index_exports = {};
|
|
30
30
|
__export(index_exports, {
|
|
31
|
-
DSCheckboxDataTestIds: () =>
|
|
32
|
-
DSCheckboxName: () =>
|
|
33
|
-
DSCheckboxSlots: () =>
|
|
31
|
+
DSCheckboxDataTestIds: () => import_constants.DSCheckboxDataTestIds,
|
|
32
|
+
DSCheckboxName: () => import_constants.DSCheckboxName,
|
|
33
|
+
DSCheckboxSlots: () => import_constants.DSCheckboxSlots,
|
|
34
34
|
DSControlledCheckbox: () => DSControlledCheckbox,
|
|
35
35
|
DSControlledCheckboxWithSchema: () => import_ControlledCheckbox2.DSControlledCheckboxWithSchema,
|
|
36
36
|
PresentationalCheckbox: () => PresentationalCheckbox
|
|
@@ -39,7 +39,7 @@ module.exports = __toCommonJS(index_exports);
|
|
|
39
39
|
var React = __toESM(require("react"));
|
|
40
40
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
41
41
|
var import_ControlledCheckbox = require("./ControlledCheckbox.js");
|
|
42
|
-
var
|
|
42
|
+
var import_constants = require("./constants/index.js");
|
|
43
43
|
var import_ControlledCheckbox2 = require("./ControlledCheckbox.js");
|
|
44
44
|
const DSControlledCheckbox = ({ ...props }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ControlledCheckbox.DSControlledCheckbox, { ...props });
|
|
45
45
|
const PresentationalCheckbox = ({ ...props }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ControlledCheckbox.DSControlledCheckbox, { ...props, visualOnly: true });
|
package/dist/cjs/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/index.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import { DSControlledCheckbox as Checkbox } from './ControlledCheckbox.js';\nimport type { DSControlledCheckboxT } from './react-desc-prop-types.js';\n\nexport type { DSControlledCheckboxT } from './react-desc-prop-types.js';\nexport { DSCheckboxDataTestIds, DSCheckboxName, DSCheckboxSlots } from './
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADO4D;AAPnF,gCAAiD;AAIjD,
|
|
4
|
+
"sourcesContent": ["import { DSControlledCheckbox as Checkbox } from './ControlledCheckbox.js';\nimport type { DSControlledCheckboxT } from './react-desc-prop-types.js';\n\nexport type { DSControlledCheckboxT } from './react-desc-prop-types.js';\nexport { DSCheckboxDataTestIds, DSCheckboxName, DSCheckboxSlots } from './constants/index.js';\nexport { DSControlledCheckboxWithSchema } from './ControlledCheckbox.js';\n\nexport const DSControlledCheckbox = ({ ...props }: DSControlledCheckboxT.Props) => <Checkbox {...props} />;\nexport const PresentationalCheckbox = ({ ...props }: DSControlledCheckboxT.Props) => <Checkbox {...props} visualOnly />;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADO4D;AAPnF,gCAAiD;AAIjD,uBAAuE;AACvE,IAAAA,6BAA+C;AAExC,MAAM,uBAAuB,CAAC,EAAE,GAAG,MAAM,MAAmC,4CAAC,0BAAAC,sBAAA,EAAU,GAAG,OAAO;AACjG,MAAM,yBAAyB,CAAC,EAAE,GAAG,MAAM,MAAmC,4CAAC,0BAAAA,sBAAA,EAAU,GAAG,OAAO,YAAU,MAAC;",
|
|
6
6
|
"names": ["import_ControlledCheckbox", "Checkbox"]
|
|
7
7
|
}
|
package/dist/cjs/package.json
CHANGED
|
@@ -39,6 +39,7 @@ var import_TruncatedTooltipText = require("../TruncatedTooltipText.js");
|
|
|
39
39
|
var import_styles = require("../styles.js");
|
|
40
40
|
var import_MainInput = require("./MainInput.js");
|
|
41
41
|
var import_ControlledCheckboxCTX = require("../ControlledCheckboxCTX.js");
|
|
42
|
+
var import_constants = require("../constants/index.js");
|
|
42
43
|
const ControlledCheckBoxContent = () => {
|
|
43
44
|
const { propsWithDefault, globalProps, instanceUid, xstyledProps, handleOnChange } = import_react.default.useContext(import_ControlledCheckboxCTX.ControlledCheckBoxContext);
|
|
44
45
|
const {
|
|
@@ -107,10 +108,31 @@ const ControlledCheckBoxContent = () => {
|
|
|
107
108
|
...!disabled && (ariaControls || legacyAriaControls) ? { onClick: handleLabelClick } : {},
|
|
108
109
|
getOwnerProps,
|
|
109
110
|
getOwnerPropsArguments,
|
|
110
|
-
children: wrapLabel ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
111
|
+
children: wrapLabel ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
112
|
+
import_styles.StyledLabelTypography,
|
|
113
|
+
{
|
|
114
|
+
component: "span",
|
|
115
|
+
variant: "b2",
|
|
116
|
+
getOwnerProps,
|
|
117
|
+
getOwnerPropsArguments,
|
|
118
|
+
children: label
|
|
119
|
+
}
|
|
120
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
121
|
+
import_TruncatedTooltipText.TruncatedTooltipText,
|
|
122
|
+
{
|
|
123
|
+
value: label,
|
|
124
|
+
getOwnerProps,
|
|
125
|
+
getOwnerPropsArguments
|
|
126
|
+
}
|
|
127
|
+
)
|
|
111
128
|
}
|
|
112
129
|
),
|
|
113
|
-
readOnly ?
|
|
130
|
+
readOnly ? (
|
|
131
|
+
// READ_ONLY_HELPER is a display:none, SR-only helper — intentionally NOT a getOwnerProps
|
|
132
|
+
// injection point (no consumer use case). The slot/data-testid exist only for naming +
|
|
133
|
+
// QA targeting consistency. Tracked in KNOWN_INTENTIONAL_DEVIATIONS.md.
|
|
134
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styles.StyledHiddenP, { id: `${instanceUid}-read-only-helper-msg`, "data-testid": import_constants.DSCheckboxDataTestIds.READ_ONLY_HELPER, children: "Read only" })
|
|
135
|
+
) : null
|
|
114
136
|
]
|
|
115
137
|
}
|
|
116
138
|
);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/parts/ControlledCheckBoxContent.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { useOwnerProps } from '@elliemae/ds-props-helpers';\nimport { TruncatedTooltipText } from '../TruncatedTooltipText.js';\nimport { StyledContainer,
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { useOwnerProps } from '@elliemae/ds-props-helpers';\nimport { TruncatedTooltipText } from '../TruncatedTooltipText.js';\nimport { StyledContainer, StyledLabelTypography, StyledLabel, StyledCheckBox, StyledHiddenP } from '../styles.js';\nimport { MainInput } from './MainInput.js';\nimport { ControlledCheckBoxContext } from '../ControlledCheckboxCTX.js';\nimport { DSCheckboxDataTestIds } from '../constants/index.js';\n\nexport const ControlledCheckBoxContent = () => {\n const { propsWithDefault, globalProps, instanceUid, xstyledProps, handleOnChange } =\n React.useContext(ControlledCheckBoxContext);\n const {\n checked,\n device,\n label,\n hasError,\n wrapLabel,\n ariaControls: legacyAriaControls,\n applyAriaDisabled,\n } = propsWithDefault;\n const { disabled, readOnly, 'aria-controls': ariaControls, className } = globalProps;\n\n const { getOwnerProps, getOwnerPropsArguments } = useOwnerProps(propsWithDefault);\n\n const { ariaControls: camelCaseAriaControls } = propsWithDefault;\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 handleLabelClick = React.useCallback(\n (\n e:\n | React.ChangeEvent<HTMLInputElement>\n | React.MouseEvent<HTMLLabelElement>\n | React.MouseEvent<HTMLDivElement>\n | React.KeyboardEvent<HTMLDivElement>,\n ) => {\n handleOnChange(e);\n // if we are in a mixed state, we want to focus the input when the label is clicked\n // this is because the auto-focus work only on the input itself, not a div with role=checkbox\n // so we need to manually focus the input: https://jira.elliemae.io/browse/PUI-15422\n if (canShowMixedState) {\n const input = document.getElementById(instanceUid);\n if (input) {\n input.focus();\n }\n }\n },\n [canShowMixedState, handleOnChange, instanceUid],\n );\n\n return (\n <StyledContainer\n wrapLabel={wrapLabel}\n device={device}\n data-testid=\"ds-checkbox-container\"\n className={className}\n hasLabel={Boolean(label)}\n {...xstyledProps}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <StyledCheckBox\n device={device}\n checked={checked}\n hasError={hasError}\n disabled={disabled}\n applyAriaDisabled={applyAriaDisabled}\n readOnly={readOnly}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <MainInput />\n </StyledCheckBox>\n {label && (\n <StyledLabel\n id={`${instanceUid}_label`}\n htmlFor={instanceUid}\n disabled={disabled}\n applyAriaDisabled={applyAriaDisabled}\n readOnly={readOnly}\n checked={checked}\n data-testid=\"ds-checkbox-label\"\n wrapLabel={wrapLabel}\n device={device}\n {...(!disabled && (ariaControls || legacyAriaControls) ? { onClick: handleLabelClick } : {})}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {wrapLabel ? (\n <StyledLabelTypography\n component=\"span\"\n variant=\"b2\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {label}\n </StyledLabelTypography>\n ) : (\n <TruncatedTooltipText\n value={label}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n />\n )}\n </StyledLabel>\n )}\n {readOnly ? (\n // READ_ONLY_HELPER is a display:none, SR-only helper \u2014 intentionally NOT a getOwnerProps\n // injection point (no consumer use case). The slot/data-testid exist only for naming +\n // QA targeting consistency. Tracked in KNOWN_INTENTIONAL_DEVIATIONS.md.\n <StyledHiddenP id={`${instanceUid}-read-only-helper-msg`} data-testid={DSCheckboxDataTestIds.READ_ONLY_HELPER}>\n Read only\n </StyledHiddenP>\n ) : null}\n </StyledContainer>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADwDnB;AAxDJ,mBAAkB;AAClB,8BAA8B;AAC9B,kCAAqC;AACrC,oBAAmG;AACnG,uBAA0B;AAC1B,mCAA0C;AAC1C,uBAAsC;AAE/B,MAAM,4BAA4B,MAAM;AAC7C,QAAM,EAAE,kBAAkB,aAAa,aAAa,cAAc,eAAe,IAC/E,aAAAA,QAAM,WAAW,sDAAyB;AAC5C,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd;AAAA,EACF,IAAI;AACJ,QAAM,EAAE,UAAU,UAAU,iBAAiB,cAAc,UAAU,IAAI;AAEzE,QAAM,EAAE,eAAe,uBAAuB,QAAI,uCAAc,gBAAgB;AAEhF,QAAM,EAAE,cAAc,sBAAsB,IAAI;AAOhD,QAAM,oBAAoB,gBAAgB;AAE1C,QAAM,mBAAmB,aAAAA,QAAM;AAAA,IAC7B,CACE,MAKG;AACH,qBAAe,CAAC;AAIhB,UAAI,mBAAmB;AACrB,cAAM,QAAQ,SAAS,eAAe,WAAW;AACjD,YAAI,OAAO;AACT,gBAAM,MAAM;AAAA,QACd;AAAA,MACF;AAAA,IACF;AAAA,IACA,CAAC,mBAAmB,gBAAgB,WAAW;AAAA,EACjD;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA,eAAY;AAAA,MACZ;AAAA,MACA,UAAU,QAAQ,KAAK;AAAA,MACtB,GAAG;AAAA,MACJ;AAAA,MACA;AAAA,MAEA;AAAA;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YAEA,sDAAC,8BAAU;AAAA;AAAA,QACb;AAAA,QACC,SACC;AAAA,UAAC;AAAA;AAAA,YACC,IAAI,GAAG,WAAW;AAAA,YAClB,SAAS;AAAA,YACT;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,eAAY;AAAA,YACZ;AAAA,YACA;AAAA,YACC,GAAI,CAAC,aAAa,gBAAgB,sBAAsB,EAAE,SAAS,iBAAiB,IAAI,CAAC;AAAA,YAC1F;AAAA,YACA;AAAA,YAEC,sBACC;AAAA,cAAC;AAAA;AAAA,gBACC,WAAU;AAAA,gBACV,SAAQ;AAAA,gBACR;AAAA,gBACA;AAAA,gBAEC;AAAA;AAAA,YACH,IAEA;AAAA,cAAC;AAAA;AAAA,gBACC,OAAO;AAAA,gBACP;AAAA,gBACA;AAAA;AAAA,YACF;AAAA;AAAA,QAEJ;AAAA,QAED;AAAA;AAAA;AAAA;AAAA,UAIC,4CAAC,+BAAc,IAAI,GAAG,WAAW,yBAAyB,eAAa,uCAAsB,kBAAkB,uBAE/G;AAAA,YACE;AAAA;AAAA;AAAA,EACN;AAEJ;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -34,7 +34,7 @@ __export(react_desc_prop_types_exports, {
|
|
|
34
34
|
module.exports = __toCommonJS(react_desc_prop_types_exports);
|
|
35
35
|
var React = __toESM(require("react"));
|
|
36
36
|
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
37
|
-
var
|
|
37
|
+
var import_constants = require("./constants/index.js");
|
|
38
38
|
var import_device = require("./constants/device.js");
|
|
39
39
|
const defaultProps = {
|
|
40
40
|
wrapLabel: false,
|
|
@@ -52,7 +52,7 @@ const defaultProps = {
|
|
|
52
52
|
const propTypes = {
|
|
53
53
|
...import_ds_props_helpers.globalAttributesPropTypes,
|
|
54
54
|
...import_ds_props_helpers.xstyledPropTypes,
|
|
55
|
-
...(0, import_ds_props_helpers.getPropsPerSlotPropTypes)(
|
|
55
|
+
...(0, import_ds_props_helpers.getPropsPerSlotPropTypes)(import_constants.DSCheckboxName, import_constants.DSCheckboxSlots),
|
|
56
56
|
checked: import_ds_props_helpers.PropTypes.oneOfType([import_ds_props_helpers.PropTypes.bool, import_ds_props_helpers.PropTypes.string]).description("Wheter the checkbox is set as bool or mixed").isRequiredIf((props) => !props.disabled && !props.readOnly).defaultValue(false),
|
|
57
57
|
onChange: import_ds_props_helpers.PropTypes.func.description("function executed when the checkbox changes state").signature("(( newIsChecked: boolean, e: React.SyntheticEvent ) => void )").isRequiredIf(
|
|
58
58
|
(props) => !props.disabled && !props.readOnly && !props.applyAriaDisabled
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/react-desc-prop-types.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import type React from 'react';\nimport type { GlobalAttributesT } from '@elliemae/ds-props-helpers';\nimport {\n PropTypes,\n globalAttributesPropTypes,\n xstyledPropTypes,\n getPropsPerSlotPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport { DSCheckboxName, DSCheckboxSlots } from './
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,8BAKO;AAEP,
|
|
4
|
+
"sourcesContent": ["import type React from 'react';\nimport type { GlobalAttributesT } from '@elliemae/ds-props-helpers';\nimport {\n PropTypes,\n globalAttributesPropTypes,\n xstyledPropTypes,\n getPropsPerSlotPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport { DSCheckboxName, DSCheckboxSlots } from './constants/index.js';\nimport { DEVICE } from './constants/device.js';\n\nexport declare namespace DSControlledCheckboxT {\n type DevicesKeys = keyof typeof DEVICE;\n type Devices = (typeof DEVICE)[DevicesKeys];\n\n export type SlotFunctionArguments = {\n dsCheckboxRoot: () => object;\n dsCheckboxInputWrapper: () => object;\n dsCheckboxInput: () => object;\n dsCheckboxLabel: () => object;\n dsCheckboxLabelTypography: () => object;\n dsCheckboxReadOnlyHelper: () => object;\n dsCheckboxTruncatedLabel: () => object;\n dsCheckboxTooltipContainer: () => object;\n dsCheckboxTooltipText: () => object;\n };\n\n export interface RequiredProps {}\n\n export interface DefaultProps {\n checked: boolean | 'mixed';\n tabIndex: TypescriptHelpersT.WCAGTabIndex;\n hasError: boolean;\n wrapLabel: boolean;\n disabled: boolean;\n applyAriaDisabled: boolean;\n readOnly: boolean;\n visualOnly: boolean;\n withRelatedBlockLabel: boolean;\n onChange: (\n newVal: boolean,\n e:\n | React.ChangeEvent<HTMLInputElement>\n | React.MouseEvent<HTMLLabelElement>\n | React.MouseEvent<HTMLDivElement>\n | React.KeyboardEvent<HTMLDivElement>,\n ) => void;\n }\n\n export interface OptionalProps extends TypescriptHelpersT.PropsForGlobalOnSlots<\n typeof DSCheckboxName,\n typeof DSCheckboxSlots\n > {\n onKeyDown?: React.KeyboardEventHandler;\n innerRef?: React.MutableRefObject<HTMLInputElement | null> | React.RefCallback<HTMLInputElement>;\n 'data-testid'?: string;\n device?: Devices;\n }\n\n export interface LegacyAriaProps {\n ariaControls?: string;\n ariaLabel?: string;\n }\n\n export interface Props\n extends\n Partial<DefaultProps>,\n OptionalProps,\n Omit<GlobalAttributesT, keyof DefaultProps | keyof OptionalProps>,\n LegacyAriaProps {}\n\n export interface InternalProps\n extends\n DefaultProps,\n OptionalProps,\n Omit<GlobalAttributesT, keyof DefaultProps | keyof OptionalProps>,\n LegacyAriaProps {}\n\n export interface StyledCheckBoxT {\n checked: boolean | 'mixed';\n readOnly?: boolean;\n hasError?: boolean;\n disabled?: boolean;\n applyAriaDisabled?: boolean;\n device?: Devices;\n }\n\n export interface StyledLabelT {\n disabled?: boolean;\n applyAriaDisabled?: boolean;\n readOnly?: boolean;\n checked: boolean | 'mixed';\n wrapLabel: boolean;\n device?: Devices;\n }\n}\n\nexport const defaultProps: DSControlledCheckboxT.DefaultProps = {\n wrapLabel: false,\n hasError: false,\n checked: false,\n disabled: false,\n applyAriaDisabled: false,\n readOnly: false,\n tabIndex: 0,\n onChange: () => {},\n visualOnly: false,\n withRelatedBlockLabel: false,\n};\n\nexport const propTypes = {\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n ...getPropsPerSlotPropTypes(DSCheckboxName, DSCheckboxSlots),\n checked: PropTypes.oneOfType([PropTypes.bool, PropTypes.string])\n .description('Wheter the checkbox is set as bool or mixed')\n .isRequiredIf((props: DSControlledCheckboxT.Props) => !props.disabled && !props.readOnly)\n .defaultValue(false),\n onChange: PropTypes.func\n .description('function executed when the checkbox changes state')\n .signature('(( newIsChecked: boolean, e: React.SyntheticEvent ) => void )')\n .isRequiredIf(\n (props: DSControlledCheckboxT.Props) => !props.disabled && !props.readOnly && !props.applyAriaDisabled,\n ),\n 'aria-controls': PropTypes.string\n .description('a11y required attribute when \"mixed\" state is to be supported')\n .isRequiredIf(\n (props: DSControlledCheckboxT.Props) => props.checked === 'mixed' && typeof props.ariaControls !== 'string',\n ),\n ariaControls: PropTypes.string\n .description('deprecated equivalent of \"aria-controls\", please use \"aria-controls\" instead')\n .deprecated({ version: '3.x', message: 'use \"aria-controls\" instead' })\n .isRequiredIf(\n (props: DSControlledCheckboxT.Props) => props.checked === 'mixed' && typeof props['aria-controls'] !== 'string',\n ),\n label: PropTypes.string.description(\n 'Checkbox Label property. This label is also going to be used as an aria-label for screen readers.',\n ),\n hasError: PropTypes.bool.description('Whether the checkbox has error or not.').defaultValue(false),\n disabled: PropTypes.bool.description('Whether the checkbox is disabled or not.').defaultValue(false),\n applyAriaDisabled: PropTypes.bool\n .description(\n 'Whether to apply disabled styling and announce as disabled in SR. CAN STILL RECEIVE FOCUS. PREVENTS ONLY MAIN ACTION.',\n )\n .defaultValue(false),\n readOnly: PropTypes.bool.description('Whether the checkbox is readOnly or not.').defaultValue(false),\n wrapLabel: PropTypes.bool.description('Whether to wrap or truncate the label').defaultValue(false),\n withRelatedBlockLabel: PropTypes.bool\n .description('wheter the autogenerated aria-labelledby should also include a reference to the block label')\n .defaultValue(false),\n device: PropTypes.oneOf(Object.values(DEVICE)).description(\n 'When not provide will scale via css breakpoint media queries, if provided, breakpoint will be ignored in favor of explicit devide declaration',\n ),\n innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]).description('Checkbox input ref.'),\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,8BAKO;AAEP,uBAAgD;AAChD,oBAAuB;AAwFhB,MAAM,eAAmD;AAAA,EAC9D,WAAW;AAAA,EACX,UAAU;AAAA,EACV,SAAS;AAAA,EACT,UAAU;AAAA,EACV,mBAAmB;AAAA,EACnB,UAAU;AAAA,EACV,UAAU;AAAA,EACV,UAAU,MAAM;AAAA,EAAC;AAAA,EACjB,YAAY;AAAA,EACZ,uBAAuB;AACzB;AAEO,MAAM,YAAY;AAAA,EACvB,GAAG;AAAA,EACH,GAAG;AAAA,EACH,OAAG,kDAAyB,iCAAgB,gCAAe;AAAA,EAC3D,SAAS,kCAAU,UAAU,CAAC,kCAAU,MAAM,kCAAU,MAAM,CAAC,EAC5D,YAAY,6CAA6C,EACzD,aAAa,CAAC,UAAuC,CAAC,MAAM,YAAY,CAAC,MAAM,QAAQ,EACvF,aAAa,KAAK;AAAA,EACrB,UAAU,kCAAU,KACjB,YAAY,mDAAmD,EAC/D,UAAU,+DAA+D,EACzE;AAAA,IACC,CAAC,UAAuC,CAAC,MAAM,YAAY,CAAC,MAAM,YAAY,CAAC,MAAM;AAAA,EACvF;AAAA,EACF,iBAAiB,kCAAU,OACxB,YAAY,+DAA+D,EAC3E;AAAA,IACC,CAAC,UAAuC,MAAM,YAAY,WAAW,OAAO,MAAM,iBAAiB;AAAA,EACrG;AAAA,EACF,cAAc,kCAAU,OACrB,YAAY,8EAA8E,EAC1F,WAAW,EAAE,SAAS,OAAO,SAAS,8BAA8B,CAAC,EACrE;AAAA,IACC,CAAC,UAAuC,MAAM,YAAY,WAAW,OAAO,MAAM,eAAe,MAAM;AAAA,EACzG;AAAA,EACF,OAAO,kCAAU,OAAO;AAAA,IACtB;AAAA,EACF;AAAA,EACA,UAAU,kCAAU,KAAK,YAAY,wCAAwC,EAAE,aAAa,KAAK;AAAA,EACjG,UAAU,kCAAU,KAAK,YAAY,0CAA0C,EAAE,aAAa,KAAK;AAAA,EACnG,mBAAmB,kCAAU,KAC1B;AAAA,IACC;AAAA,EACF,EACC,aAAa,KAAK;AAAA,EACrB,UAAU,kCAAU,KAAK,YAAY,0CAA0C,EAAE,aAAa,KAAK;AAAA,EACnG,WAAW,kCAAU,KAAK,YAAY,uCAAuC,EAAE,aAAa,KAAK;AAAA,EACjG,uBAAuB,kCAAU,KAC9B,YAAY,6FAA6F,EACzG,aAAa,KAAK;AAAA,EACrB,QAAQ,kCAAU,MAAM,OAAO,OAAO,oBAAM,CAAC,EAAE;AAAA,IAC7C;AAAA,EACF;AAAA,EACA,UAAU,kCAAU,UAAU,CAAC,kCAAU,MAAM,kCAAU,MAAM,CAAC,EAAE,YAAY,qBAAqB;AACrG;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/styles.js
CHANGED
|
@@ -34,16 +34,17 @@ __export(styles_exports, {
|
|
|
34
34
|
StyledInput: () => StyledInput,
|
|
35
35
|
StyledInputMixed: () => StyledInputMixed,
|
|
36
36
|
StyledLabel: () => StyledLabel,
|
|
37
|
-
|
|
37
|
+
StyledLabelTypography: () => StyledLabelTypography
|
|
38
38
|
});
|
|
39
39
|
module.exports = __toCommonJS(styles_exports);
|
|
40
40
|
var React = __toESM(require("react"));
|
|
41
41
|
var import_ds_system = require("@elliemae/ds-system");
|
|
42
|
+
var import_ds_typography = require("@elliemae/ds-typography");
|
|
42
43
|
var import_styleHelpers = require("./utils/styleHelpers.js");
|
|
43
|
-
var
|
|
44
|
+
var import_constants = require("./constants/index.js");
|
|
44
45
|
const StyledCheckBox = (0, import_ds_system.styled)("span", {
|
|
45
|
-
name:
|
|
46
|
-
slot:
|
|
46
|
+
name: import_constants.DSCheckboxName,
|
|
47
|
+
slot: import_constants.DSCheckboxSlots.INPUT_WRAPPER
|
|
47
48
|
})`
|
|
48
49
|
position: relative;
|
|
49
50
|
background: ${({ theme, disabled, applyAriaDisabled, readOnly }) => (0, import_styleHelpers.handleBackgroundColor)(theme, disabled, applyAriaDisabled, readOnly)};
|
|
@@ -104,6 +105,7 @@ const StyledCheckBox = (0, import_ds_system.styled)("span", {
|
|
|
104
105
|
}
|
|
105
106
|
}
|
|
106
107
|
&:focus-within {
|
|
108
|
+
background: ${({ theme, checked, disabled, applyAriaDisabled, readOnly, hasError }) => checked === true && !disabled && !applyAriaDisabled && !readOnly && !hasError ? theme.colors.brand[200] : void 0};
|
|
107
109
|
&:hover {
|
|
108
110
|
${({ theme, checked, disabled, applyAriaDisabled, readOnly, hasError, device }) => (0, import_styleHelpers.handleCheckmark)(theme, checked, disabled, applyAriaDisabled, readOnly, hasError, true, device)}
|
|
109
111
|
}
|
|
@@ -113,7 +115,7 @@ const StyledCheckBox = (0, import_ds_system.styled)("span", {
|
|
|
113
115
|
}
|
|
114
116
|
&:active {
|
|
115
117
|
&:after {
|
|
116
|
-
border: ${({ disabled, theme }) => disabled ? `1px solid ${theme.colors.neutral[400]}` : `
|
|
118
|
+
border: ${({ disabled, theme }) => disabled ? `1px solid ${theme.colors.neutral[400]}` : `1px solid ${theme.colors.brand[600]}`};
|
|
117
119
|
}
|
|
118
120
|
}
|
|
119
121
|
`;
|
|
@@ -130,8 +132,8 @@ const checkboxStyles = import_ds_system.css`
|
|
|
130
132
|
z-index: 1;
|
|
131
133
|
`;
|
|
132
134
|
const StyledInput = (0, import_ds_system.styled)("input", {
|
|
133
|
-
name:
|
|
134
|
-
slot:
|
|
135
|
+
name: import_constants.DSCheckboxName,
|
|
136
|
+
slot: import_constants.DSCheckboxSlots.INPUT
|
|
135
137
|
})`
|
|
136
138
|
${checkboxStyles}
|
|
137
139
|
&:disabled {
|
|
@@ -142,8 +144,8 @@ const StyledInput = (0, import_ds_system.styled)("input", {
|
|
|
142
144
|
}
|
|
143
145
|
`;
|
|
144
146
|
const StyledInputMixed = (0, import_ds_system.styled)("div", {
|
|
145
|
-
name:
|
|
146
|
-
slot:
|
|
147
|
+
name: import_constants.DSCheckboxName,
|
|
148
|
+
slot: import_constants.DSCheckboxSlots.INPUT
|
|
147
149
|
})`
|
|
148
150
|
${checkboxStyles}
|
|
149
151
|
${({ "aria-disabled": disabled }) => disabled ? `&:hover {
|
|
@@ -151,8 +153,8 @@ const StyledInputMixed = (0, import_ds_system.styled)("div", {
|
|
|
151
153
|
}` : ""}
|
|
152
154
|
`;
|
|
153
155
|
const StyledLabel = (0, import_ds_system.styled)("label", {
|
|
154
|
-
name:
|
|
155
|
-
slot:
|
|
156
|
+
name: import_constants.DSCheckboxName,
|
|
157
|
+
slot: import_constants.DSCheckboxSlots.LABEL
|
|
156
158
|
})`
|
|
157
159
|
${({ wrapLabel }) => wrapLabel && `
|
|
158
160
|
overflow-wrap: break-word;
|
|
@@ -160,44 +162,22 @@ const StyledLabel = (0, import_ds_system.styled)("label", {
|
|
|
160
162
|
word-break: break-word;
|
|
161
163
|
`};
|
|
162
164
|
width: fit-content;
|
|
163
|
-
color: ${({ theme, disabled }) => disabled ? theme.colors.neutral[500] : theme.colors.neutral[
|
|
164
|
-
|
|
165
|
-
@media (max-width: ${import_ds_system.th.breakpoint("small")}) {
|
|
166
|
-
line-height: 1rem; /* 13px / 16 */
|
|
167
|
-
}
|
|
168
|
-
${({ device, theme }) => {
|
|
169
|
-
if (device === "mobile") {
|
|
170
|
-
return `
|
|
171
|
-
@media (max-width: ${theme.breakpoints.small}) {
|
|
172
|
-
font-size: 1rem; /* 16px / 16 */
|
|
173
|
-
}
|
|
174
|
-
font-size: 1.2307rem; /* 16px / 13 */
|
|
175
|
-
`;
|
|
176
|
-
}
|
|
177
|
-
if (device === void 0) {
|
|
178
|
-
return `
|
|
179
|
-
font-size: 1rem;
|
|
180
|
-
`;
|
|
181
|
-
}
|
|
182
|
-
return `
|
|
183
|
-
@media (max-width: ${theme.breakpoints.small}) {
|
|
184
|
-
font-size: 0.8125rem; /* 13px / 16 */
|
|
185
|
-
}
|
|
186
|
-
|
|
187
|
-
font-size: 1rem; /* 13px / 13 */
|
|
188
|
-
`;
|
|
189
|
-
}}
|
|
165
|
+
color: ${({ theme, disabled }) => disabled ? theme.colors.neutral[500] : theme.colors.neutral[700]};
|
|
166
|
+
/* Typography metrics delegated to child DSTypography b2 */
|
|
190
167
|
display: inherit;
|
|
191
|
-
${({ disabled
|
|
168
|
+
${({ disabled }) => disabled ? `&:hover {
|
|
192
169
|
cursor: not-allowed;
|
|
193
170
|
}` : `&:hover {
|
|
194
171
|
cursor: pointer;
|
|
195
172
|
}`}
|
|
196
173
|
`;
|
|
197
|
-
const
|
|
174
|
+
const StyledLabelTypography = (0, import_ds_system.styled)(import_ds_typography.DSTypography, {
|
|
175
|
+
name: import_constants.DSCheckboxName,
|
|
176
|
+
slot: import_constants.DSCheckboxSlots.LABEL_TYPOGRAPHY
|
|
177
|
+
})``;
|
|
198
178
|
const StyledContainer = (0, import_ds_system.styled)("div", {
|
|
199
|
-
name:
|
|
200
|
-
slot:
|
|
179
|
+
name: import_constants.DSCheckboxName,
|
|
180
|
+
slot: import_constants.DSCheckboxSlots.CONTAINER
|
|
201
181
|
})`
|
|
202
182
|
${({ device, theme }) => {
|
|
203
183
|
if (device === "mobile") {
|
|
@@ -224,13 +204,16 @@ const StyledContainer = (0, import_ds_system.styled)("div", {
|
|
|
224
204
|
|
|
225
205
|
`;
|
|
226
206
|
}}
|
|
227
|
-
column-gap: ${({ hasLabel }) => hasLabel ? "8px" : "0px
|
|
207
|
+
column-gap: ${({ hasLabel }) => hasLabel ? "8px" : "0px"};
|
|
228
208
|
display: inline-grid;
|
|
229
209
|
grid-template-rows: min-content;
|
|
230
210
|
align-items: ${({ wrapLabel }) => wrapLabel ? "flex-start" : "center"};
|
|
231
211
|
${import_ds_system.xStyledCommonProps}
|
|
232
212
|
`;
|
|
233
|
-
const StyledHiddenP = import_ds_system.styled
|
|
213
|
+
const StyledHiddenP = (0, import_ds_system.styled)("p", {
|
|
214
|
+
name: import_constants.DSCheckboxName,
|
|
215
|
+
slot: import_constants.DSCheckboxSlots.READ_ONLY_HELPER
|
|
216
|
+
})`
|
|
234
217
|
display: none;
|
|
235
218
|
`;
|
|
236
219
|
//# sourceMappingURL=styles.js.map
|
package/dist/cjs/styles.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/styles.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable max-lines */\nimport { styled,
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,
|
|
4
|
+
"sourcesContent": ["/* eslint-disable max-lines */\nimport { styled, css, xStyledCommonProps } from '@elliemae/ds-system';\nimport { DSTypography } from '@elliemae/ds-typography';\nimport type { DSControlledCheckboxT } from './react-desc-prop-types.js';\nimport { handleBackgroundColor, handleCheckmark } from './utils/styleHelpers.js';\nimport { DSCheckboxName, DSCheckboxSlots } from './constants/index.js';\n\nexport const StyledCheckBox = styled('span', {\n name: DSCheckboxName,\n slot: DSCheckboxSlots.INPUT_WRAPPER,\n})<DSControlledCheckboxT.StyledCheckBoxT>`\n position: relative;\n background: ${({ theme, disabled, applyAriaDisabled, readOnly }) =>\n handleBackgroundColor(theme, disabled, applyAriaDisabled, readOnly)};\n\n ${({ device, theme }) => {\n if (device === 'mobile') {\n return ` \n @media (max-width: ${theme.breakpoints.small}) {\n width: 1.5rem; /* 24px / 16 */\n height: 1.5rem; /* 24px / 16 */\n }\n width: 1.846rem; /* 24px / 13 */\n height: 1.846rem; /* 24px / 13 */`;\n }\n if (device === undefined) {\n return `\n @media (max-width: ${theme.breakpoints.small}) {\n width: 1.5rem; /* 24px / 16 */\n height: 1.5rem; /* 24px / 16 */\n }\n width: 1.2307rem;\n height: 1.2307rem;\n `;\n }\n return `\n @media (max-width: ${theme.breakpoints.small}) {\n width: 1rem; /* 16px / 16 */\n height: 1rem; /* 16px / 16 */\n }\n width: 1.2307rem; /* 16px / 13 */\n height: 1.2307rem; /* 16px / 13 */\n `;\n }}\n\n ${({ theme, checked, disabled, applyAriaDisabled, readOnly, hasError, device }) =>\n handleCheckmark(theme, checked, disabled, applyAriaDisabled, readOnly, hasError, false, device)}\n\n &:after {\n content: '';\n border-radius: 2px;\n position: absolute;\n top: 0px;\n right: 0px;\n bottom: 0px;\n left: 0px;\n border: 1px solid ${({ theme, hasError }) => (hasError ? theme.colors.danger[900] : theme.colors.neutral[400])};\n }\n &:hover {\n background: ${({ theme, applyAriaDisabled, disabled, readOnly }) =>\n !disabled && !applyAriaDisabled && !readOnly ? theme.colors.brand[200] : undefined};\n\n &:after {\n border: 1px solid\n ${({ theme, hasError, disabled, applyAriaDisabled, readOnly }) => {\n if (hasError) return theme.colors.danger[900];\n if (applyAriaDisabled || readOnly) return theme.colors.brand[700];\n if (disabled) return theme.colors.neutral[400];\n return theme.colors.brand[600];\n }};\n }\n }\n &:focus-within {\n background: ${({ theme, checked, disabled, applyAriaDisabled, readOnly, hasError }) =>\n checked === true && !disabled && !applyAriaDisabled && !readOnly && !hasError\n ? theme.colors.brand[200]\n : undefined};\n &:hover {\n ${({ theme, checked, disabled, applyAriaDisabled, readOnly, hasError, device }) =>\n handleCheckmark(theme, checked, disabled, applyAriaDisabled, readOnly, hasError, true, device)}\n }\n &:after {\n border: 2px solid ${({ theme }) => theme.colors.brand[700]};\n }\n }\n &:active {\n &:after {\n border: ${({ disabled, theme }) =>\n disabled ? `1px solid ${theme.colors.neutral[400]}` : `1px solid ${theme.colors.brand[600]}`};\n }\n }\n`;\n\nconst checkboxStyles = css`\n &:hover {\n cursor: pointer;\n }\n width: 100%;\n height: 100%;\n position: absolute;\n top: 0;\n left: 0;\n opacity: 0;\n z-index: 1;\n`;\n\nexport const StyledInput = styled('input', {\n name: DSCheckboxName,\n slot: DSCheckboxSlots.INPUT,\n})`\n ${checkboxStyles}\n &:disabled {\n cursor: not-allowed;\n }\n &[aria-disabled='true'] {\n cursor: not-allowed;\n }\n`;\n\nexport const StyledInputMixed = styled('div', {\n name: DSCheckboxName,\n slot: DSCheckboxSlots.INPUT,\n})`\n ${checkboxStyles}\n ${({ 'aria-disabled': disabled }) =>\n disabled\n ? `&:hover {\n cursor: not-allowed;\n }`\n : ''}\n`;\n\nexport const StyledLabel = styled('label', {\n name: DSCheckboxName,\n slot: DSCheckboxSlots.LABEL,\n})<DSControlledCheckboxT.StyledLabelT>`\n ${({ wrapLabel }) =>\n wrapLabel &&\n `\n overflow-wrap: break-word;\n white-space: pre-wrap;\n word-break: break-word;\n`};\n width: fit-content;\n color: ${({ theme, disabled }) => (disabled ? theme.colors.neutral[500] : theme.colors.neutral[700])};\n /* Typography metrics delegated to child DSTypography b2 */\n display: inherit;\n ${({ disabled }) =>\n disabled\n ? `&:hover {\n cursor: not-allowed;\n }`\n : `&:hover {\n cursor: pointer;\n }`}\n`;\n\nexport const StyledLabelTypography = styled(DSTypography, {\n name: DSCheckboxName,\n slot: DSCheckboxSlots.LABEL_TYPOGRAPHY,\n})``;\n\nexport const StyledContainer = styled('div', {\n name: DSCheckboxName,\n slot: DSCheckboxSlots.CONTAINER,\n})<{ device?: 'mobile' | 'desktop'; wrapLabel?: boolean; hasLabel: boolean }>`\n ${({ device, theme }) => {\n if (device === 'mobile') {\n return ` \n @media (max-width: ${theme.breakpoints.small}) {\n grid-template-columns: 1.5rem auto; /* 24px / 16px */\n }\n grid-template-columns: 1.846rem auto;\n `;\n }\n if (device === undefined) {\n return `\n @media (max-width: ${theme.breakpoints.small}) {\n grid-template-columns: 1.5rem auto;\n }\n grid-template-columns: 1.23rem auto;\n `;\n }\n return `\n @media (max-width: ${theme.breakpoints.small}) {\n grid-template-columns: 1rem auto; /* 16px / 16px */\n }\n grid-template-columns: 1.2307rem auto; /* 16px / 13 */\n\n `;\n }}\n column-gap: ${({ hasLabel }) => (hasLabel ? '8px' : '0px')};\n display: inline-grid;\n grid-template-rows: min-content;\n align-items: ${({ wrapLabel }) => (wrapLabel ? 'flex-start' : 'center')};\n ${xStyledCommonProps}\n`;\n\nexport const StyledHiddenP = styled('p', {\n name: DSCheckboxName,\n slot: DSCheckboxSlots.READ_ONLY_HELPER,\n})`\n display: none;\n`;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|