@elliemae/ds-menu-items 3.11.0-next.3 → 3.11.0-next.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/components/ActionMenuItem/index.js +5 -5
- package/dist/cjs/components/ActionMenuItem/index.js.map +2 -2
- package/dist/cjs/components/MultiMenuItem/index.js +5 -4
- package/dist/cjs/components/MultiMenuItem/index.js.map +2 -2
- package/dist/cjs/components/Section/index.js +2 -5
- package/dist/cjs/components/Section/index.js.map +2 -2
- package/dist/cjs/components/SingleMenuItem/index.js +2 -2
- package/dist/cjs/components/SingleMenuItem/index.js.map +2 -2
- package/dist/cjs/components/SingleWithSubmenuItem/index.js +6 -9
- package/dist/cjs/components/SingleWithSubmenuItem/index.js.map +2 -2
- package/dist/cjs/components/SubmenuItem/index.js +2 -2
- package/dist/cjs/components/SubmenuItem/index.js.map +2 -2
- package/dist/cjs/components/styled.js +36 -11
- package/dist/cjs/components/styled.js.map +2 -2
- package/dist/cjs/exported-related/constants.js +47 -0
- package/dist/cjs/exported-related/constants.js.map +7 -0
- package/dist/cjs/exported-related/index.js +26 -0
- package/dist/cjs/exported-related/index.js.map +7 -0
- package/dist/cjs/index.js.map +2 -2
- package/dist/cjs/react-desc-prop-types.js.map +1 -1
- package/dist/esm/components/ActionMenuItem/index.js +11 -6
- package/dist/esm/components/ActionMenuItem/index.js.map +2 -2
- package/dist/esm/components/MultiMenuItem/index.js +5 -4
- package/dist/esm/components/MultiMenuItem/index.js.map +2 -2
- package/dist/esm/components/Section/index.js +2 -5
- package/dist/esm/components/Section/index.js.map +2 -2
- package/dist/esm/components/SingleMenuItem/index.js +8 -3
- package/dist/esm/components/SingleMenuItem/index.js.map +2 -2
- package/dist/esm/components/SingleWithSubmenuItem/index.js +8 -10
- package/dist/esm/components/SingleWithSubmenuItem/index.js.map +2 -2
- package/dist/esm/components/SubmenuItem/index.js +4 -3
- package/dist/esm/components/SubmenuItem/index.js.map +2 -2
- package/dist/esm/components/styled.js +36 -11
- package/dist/esm/components/styled.js.map +2 -2
- package/dist/esm/exported-related/constants.js +21 -0
- package/dist/esm/exported-related/constants.js.map +7 -0
- package/dist/esm/exported-related/index.js +3 -0
- package/dist/esm/exported-related/index.js.map +7 -0
- package/dist/esm/index.js.map +2 -2
- package/dist/esm/react-desc-prop-types.js.map +1 -1
- package/package.json +6 -6
|
@@ -31,7 +31,6 @@ module.exports = __toCommonJS(ActionMenuItem_exports);
|
|
|
31
31
|
var React = __toESM(require("react"));
|
|
32
32
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
33
33
|
var import_react = require("react");
|
|
34
|
-
var import_ds_grid = require("@elliemae/ds-grid");
|
|
35
34
|
var import_ds_utilities = require("@elliemae/ds-utilities");
|
|
36
35
|
var import_react_desc_prop_types = require("../../react-desc-prop-types");
|
|
37
36
|
var import_styled = require("../styled");
|
|
@@ -65,14 +64,15 @@ const ActionMenuItem = (props) => {
|
|
|
65
64
|
ref: innerRef,
|
|
66
65
|
pl: optionsShouldHavePadding ? 40 : 16,
|
|
67
66
|
style: wrapperStyles,
|
|
68
|
-
|
|
67
|
+
"data-type": "action",
|
|
68
|
+
children: Render !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Render, {
|
|
69
|
+
...propsWithDefault
|
|
70
|
+
}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledContentWrapper, {
|
|
69
71
|
cols: gridLayout,
|
|
70
72
|
minHeight: "16px",
|
|
71
73
|
gutter: "xxs",
|
|
72
74
|
alignItems: "center",
|
|
73
|
-
children:
|
|
74
|
-
...propsWithDefault
|
|
75
|
-
}) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
|
|
75
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
|
|
76
76
|
children: [
|
|
77
77
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyleMenuItemLabel, {
|
|
78
78
|
children: label
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/components/ActionMenuItem/index.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React, { useMemo } from 'react';\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAAA,mBAA+B;AAC/B,
|
|
4
|
+
"sourcesContent": ["import React, { useMemo } from 'react';\nimport { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-utilities';\nimport { DSMenuItemT, defaultActionProps, itemProps } from '../../react-desc-prop-types';\nimport {\n StyledContentWrapper,\n StyledGlobalMenuItemWrapper,\n StyleMenuItemLabel,\n StyleMenuItemSecondaryLabel,\n} from '../styled';\n\nconst ActionMenuItem: React.ComponentType<DSMenuItemT.ActionProps> = (props) => {\n const propsWithDefault = useMemoMergePropsWithDefault(props, defaultActionProps);\n\n useValidateTypescriptPropTypes(propsWithDefault, itemProps);\n\n const {\n dsId,\n label,\n secondaryLabel,\n onClick,\n isActive,\n disabled,\n innerRef,\n wrapperStyles,\n optionsShouldHavePadding,\n render: Render,\n } = propsWithDefault;\n\n const gridLayout = useMemo(() => {\n const cols = ['auto'];\n if (secondaryLabel) cols.push('min-content');\n return cols;\n }, [secondaryLabel]);\n\n return (\n <StyledGlobalMenuItemWrapper\n id={dsId}\n role=\"option\"\n isActive={isActive}\n disabled={disabled}\n onClick={!disabled ? onClick : undefined}\n ref={innerRef}\n pl={optionsShouldHavePadding ? 40 : 16}\n style={wrapperStyles}\n data-type=\"action\"\n >\n {Render !== undefined ? (\n <Render {...propsWithDefault} />\n ) : (\n <StyledContentWrapper cols={gridLayout} minHeight=\"16px\" gutter=\"xxs\" alignItems=\"center\">\n <>\n <StyleMenuItemLabel>{label}</StyleMenuItemLabel>\n {secondaryLabel !== undefined && (\n <StyleMenuItemSecondaryLabel>{secondaryLabel}</StyleMenuItemSecondaryLabel>\n )}\n </>\n </StyledContentWrapper>\n )}\n </StyledGlobalMenuItemWrapper>\n );\n};\n\nActionMenuItem.propTypes = itemProps;\nActionMenuItem.displayName = 'ActionMenuItem';\nconst ActionMenuItemWithSchema = describe(ActionMenuItem);\nActionMenuItemWithSchema.propTypes = itemProps;\n\nexport { ActionMenuItem, ActionMenuItemWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAAA,mBAA+B;AAC/B,0BAAuF;AACvF,mCAA2D;AAC3D,oBAKO;AAEP,MAAM,iBAA+D,CAAC,UAAU;AAC9E,QAAM,uBAAmB,kDAA6B,OAAO,+CAAkB;AAE/E,0DAA+B,kBAAkB,sCAAS;AAE1D,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,EACV,IAAI;AAEJ,QAAM,iBAAa,sBAAQ,MAAM;AAC/B,UAAM,OAAO,CAAC,MAAM;AACpB,QAAI;AAAgB,WAAK,KAAK,aAAa;AAC3C,WAAO;AAAA,EACT,GAAG,CAAC,cAAc,CAAC;AAEnB,SACE,4CAAC;AAAA,IACC,IAAI;AAAA,IACJ,MAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA,SAAS,CAAC,WAAW,UAAU;AAAA,IAC/B,KAAK;AAAA,IACL,IAAI,2BAA2B,KAAK;AAAA,IACpC,OAAO;AAAA,IACP,aAAU;AAAA,IAET,qBAAW,SACV,4CAAC;AAAA,MAAQ,GAAG;AAAA,KAAkB,IAE9B,4CAAC;AAAA,MAAqB,MAAM;AAAA,MAAY,WAAU;AAAA,MAAO,QAAO;AAAA,MAAM,YAAW;AAAA,MAC/E;AAAA,QACE;AAAA,sDAAC;AAAA,YAAoB;AAAA,WAAM;AAAA,UAC1B,mBAAmB,UAClB,4CAAC;AAAA,YAA6B;AAAA,WAAe;AAAA;AAAA,OAEjD;AAAA,KACF;AAAA,GAEJ;AAEJ;AAEA,eAAe,YAAY;AAC3B,eAAe,cAAc;AAC7B,MAAM,+BAA2B,8BAAS,cAAc;AACxD,yBAAyB,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -68,10 +68,11 @@ const MultiMenuItem = (props) => {
|
|
|
68
68
|
style: wrapperStyles,
|
|
69
69
|
onClick,
|
|
70
70
|
"data-testid": "combobox-option",
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
71
|
+
"data-type": "multi",
|
|
72
|
+
children: Render !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Render, {
|
|
73
|
+
...props
|
|
74
|
+
}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledItemContent, {
|
|
75
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_form_checkbox.DSControlledCheckbox, {
|
|
75
76
|
disabled,
|
|
76
77
|
checked: isSelected,
|
|
77
78
|
onMouseDown,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/components/MultiMenuItem/index.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-utilities';\nimport { DSControlledCheckbox } from '@elliemae/ds-form-checkbox';\nimport { DSMenuItemT, defaultMultiProps, itemProps } from '../../react-desc-prop-types';\nimport { StyledGlobalMenuItemWrapper, StyledItemContent } from '../styled';\n\nconst noop = () => null;\n\nconst MultiMenuItem: React.ComponentType<DSMenuItemT.MultiProps> = (props) => {\n const propsWithDefault = useMemoMergePropsWithDefault(props, defaultMultiProps);\n\n useValidateTypescriptPropTypes(propsWithDefault, itemProps);\n\n const {\n dsId,\n label,\n disabled,\n isSelected,\n isActive,\n onClick,\n innerRef,\n onMouseEnter,\n onMouseLeave,\n onMouseDown,\n wrapperStyles,\n tabIndex,\n render: Render,\n } = propsWithDefault;\n\n return (\n <StyledGlobalMenuItemWrapper\n id={dsId}\n disabled={disabled}\n isActive={isActive}\n isSelected={isSelected}\n ref={innerRef}\n onMouseDown={onMouseDown}\n onMouseEnter={onMouseEnter}\n onMouseLeave={onMouseLeave}\n role=\"option\"\n className={isActive ? 'ds-list-item-active' : ''}\n aria-selected={isSelected}\n style={wrapperStyles}\n onClick={onClick}\n data-testid=\"combobox-option\"\n >\n
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,0BAAuF;AACvF,8BAAqC;AACrC,mCAA0D;AAC1D,oBAA+D;AAE/D,MAAM,OAAO,MAAM;AAEnB,MAAM,gBAA6D,CAAC,UAAU;AAC5E,QAAM,uBAAmB,kDAA6B,OAAO,8CAAiB;AAE9E,0DAA+B,kBAAkB,sCAAS;AAE1D,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,EACV,IAAI;AAEJ,SACE,4CAAC;AAAA,IACC,IAAI;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,KAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA,MAAK;AAAA,IACL,WAAW,WAAW,wBAAwB;AAAA,IAC9C,iBAAe;AAAA,IACf,OAAO;AAAA,IACP;AAAA,IACA,eAAY;AAAA,
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-utilities';\nimport { DSControlledCheckbox } from '@elliemae/ds-form-checkbox';\nimport { DSMenuItemT, defaultMultiProps, itemProps } from '../../react-desc-prop-types';\nimport { StyledGlobalMenuItemWrapper, StyledItemContent } from '../styled';\n\nconst noop = () => null;\n\nconst MultiMenuItem: React.ComponentType<DSMenuItemT.MultiProps> = (props) => {\n const propsWithDefault = useMemoMergePropsWithDefault(props, defaultMultiProps);\n\n useValidateTypescriptPropTypes(propsWithDefault, itemProps);\n\n const {\n dsId,\n label,\n disabled,\n isSelected,\n isActive,\n onClick,\n innerRef,\n onMouseEnter,\n onMouseLeave,\n onMouseDown,\n wrapperStyles,\n tabIndex,\n render: Render,\n } = propsWithDefault;\n\n return (\n <StyledGlobalMenuItemWrapper\n id={dsId}\n disabled={disabled}\n isActive={isActive}\n isSelected={isSelected}\n ref={innerRef}\n onMouseDown={onMouseDown}\n onMouseEnter={onMouseEnter}\n onMouseLeave={onMouseLeave}\n role=\"option\"\n className={isActive ? 'ds-list-item-active' : ''}\n aria-selected={isSelected}\n style={wrapperStyles}\n onClick={onClick}\n data-testid=\"combobox-option\"\n data-type=\"multi\"\n >\n {Render !== undefined ? (\n <Render {...props} />\n ) : (\n <StyledItemContent>\n <DSControlledCheckbox\n disabled={disabled}\n checked={isSelected}\n onMouseDown={onMouseDown}\n name={label}\n label={label}\n onChange={noop}\n tabIndex={tabIndex}\n wrapLabel\n device=\"desktop\"\n />\n </StyledItemContent>\n )}\n </StyledGlobalMenuItemWrapper>\n );\n};\n\nMultiMenuItem.propTypes = itemProps;\nMultiMenuItem.displayName = 'MultiMenuItem';\nconst MultiMenuItemWithSchema = describe(MultiMenuItem);\nMultiMenuItemWithSchema.propTypes = itemProps;\n\nexport { MultiMenuItem, MultiMenuItemWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,0BAAuF;AACvF,8BAAqC;AACrC,mCAA0D;AAC1D,oBAA+D;AAE/D,MAAM,OAAO,MAAM;AAEnB,MAAM,gBAA6D,CAAC,UAAU;AAC5E,QAAM,uBAAmB,kDAA6B,OAAO,8CAAiB;AAE9E,0DAA+B,kBAAkB,sCAAS;AAE1D,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,EACV,IAAI;AAEJ,SACE,4CAAC;AAAA,IACC,IAAI;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,KAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA,MAAK;AAAA,IACL,WAAW,WAAW,wBAAwB;AAAA,IAC9C,iBAAe;AAAA,IACf,OAAO;AAAA,IACP;AAAA,IACA,eAAY;AAAA,IACZ,aAAU;AAAA,IAET,qBAAW,SACV,4CAAC;AAAA,MAAQ,GAAG;AAAA,KAAO,IAEnB,4CAAC;AAAA,MACC,sDAAC;AAAA,QACC;AAAA,QACA,SAAS;AAAA,QACT;AAAA,QACA,MAAM;AAAA,QACN;AAAA,QACA,UAAU;AAAA,QACV;AAAA,QACA,WAAS;AAAA,QACT,QAAO;AAAA,OACT;AAAA,KACF;AAAA,GAEJ;AAEJ;AAEA,cAAc,YAAY;AAC1B,cAAc,cAAc;AAC5B,MAAM,8BAA0B,8BAAS,aAAa;AACtD,wBAAwB,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -30,7 +30,6 @@ __export(Section_exports, {
|
|
|
30
30
|
module.exports = __toCommonJS(Section_exports);
|
|
31
31
|
var React = __toESM(require("react"));
|
|
32
32
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
33
|
-
var import_ds_grid = require("@elliemae/ds-grid");
|
|
34
33
|
var import_ds_utilities = require("@elliemae/ds-utilities");
|
|
35
34
|
var import_react_desc_prop_types = require("../../react-desc-prop-types");
|
|
36
35
|
var import_styled = require("../styled");
|
|
@@ -44,10 +43,8 @@ const Section = (props) => {
|
|
|
44
43
|
role: "presentation",
|
|
45
44
|
children: Render !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Render, {
|
|
46
45
|
...props
|
|
47
|
-
}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
48
|
-
children:
|
|
49
|
-
children: label
|
|
50
|
-
})
|
|
46
|
+
}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledGroupLabel, {
|
|
47
|
+
children: label
|
|
51
48
|
})
|
|
52
49
|
});
|
|
53
50
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/components/Section/index.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-utilities';\nimport { DSMenuItemT, defaultSectionProps, itemProps } from '../../react-desc-prop-types';\nimport { StyledSectionWrapper, StyledGroupLabel } from '../styled';\n\nconst Section: React.ComponentType<DSMenuItemT.SectionProps> = (props) => {\n const propsWithDefault = useMemoMergePropsWithDefault(props, defaultSectionProps);\n\n useValidateTypescriptPropTypes(propsWithDefault, itemProps);\n\n const { label, wrapperStyles, innerRef, render: Render } = props;\n\n return (\n <StyledSectionWrapper style={wrapperStyles} ref={innerRef} role=\"presentation\">\n {Render !== undefined ?
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-utilities';\nimport { DSMenuItemT, defaultSectionProps, itemProps } from '../../react-desc-prop-types';\nimport { StyledSectionWrapper, StyledGroupLabel } from '../styled';\n\nconst Section: React.ComponentType<DSMenuItemT.SectionProps> = (props) => {\n const propsWithDefault = useMemoMergePropsWithDefault(props, defaultSectionProps);\n\n useValidateTypescriptPropTypes(propsWithDefault, itemProps);\n\n const { label, wrapperStyles, innerRef, render: Render } = props;\n\n return (\n <StyledSectionWrapper style={wrapperStyles} ref={innerRef} role=\"presentation\">\n {Render !== undefined ? <Render {...props} /> : <StyledGroupLabel>{label}</StyledGroupLabel>}\n </StyledSectionWrapper>\n );\n};\n\nSection.propTypes = itemProps;\nSection.displayName = 'Section';\nconst SectionWithSchema = describe(Section);\nSectionWithSchema.propTypes = itemProps;\n\nexport { Section, SectionWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAEA,0BAAuF;AACvF,mCAA4D;AAC5D,oBAAuD;AAEvD,MAAM,UAAyD,CAAC,UAAU;AACxE,QAAM,uBAAmB,kDAA6B,OAAO,gDAAmB;AAEhF,0DAA+B,kBAAkB,sCAAS;AAE1D,QAAM,EAAE,OAAO,eAAe,UAAU,QAAQ,OAAO,IAAI;AAE3D,SACE,4CAAC;AAAA,IAAqB,OAAO;AAAA,IAAe,KAAK;AAAA,IAAU,MAAK;AAAA,IAC7D,qBAAW,SAAY,4CAAC;AAAA,MAAQ,GAAG;AAAA,KAAO,IAAK,4CAAC;AAAA,MAAkB;AAAA,KAAM;AAAA,GAC3E;AAEJ;AAEA,QAAQ,YAAY;AACpB,QAAQ,cAAc;AACtB,MAAM,wBAAoB,8BAAS,OAAO;AAC1C,kBAAkB,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -32,7 +32,6 @@ var import_jsx_runtime = require("react/jsx-runtime");
|
|
|
32
32
|
var import_react = require("react");
|
|
33
33
|
var import_ds_utilities = require("@elliemae/ds-utilities");
|
|
34
34
|
var import_ds_icons = require("@elliemae/ds-icons");
|
|
35
|
-
var import_ds_grid = require("@elliemae/ds-grid");
|
|
36
35
|
var import_react_desc_prop_types = require("../../react-desc-prop-types");
|
|
37
36
|
var import_styled = require("../styled");
|
|
38
37
|
const SingleMenuItem = (props) => {
|
|
@@ -75,9 +74,10 @@ const SingleMenuItem = (props) => {
|
|
|
75
74
|
style: wrapperStyles,
|
|
76
75
|
"data-testid": dataTestid,
|
|
77
76
|
disabled,
|
|
77
|
+
"data-type": "single",
|
|
78
78
|
children: Render !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Render, {
|
|
79
79
|
...props
|
|
80
|
-
}) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
80
|
+
}) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_styled.StyledContentWrapper, {
|
|
81
81
|
cols: gridLayout,
|
|
82
82
|
minHeight: "16px",
|
|
83
83
|
gutter: "xxs",
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/components/SingleMenuItem/index.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React, { useMemo } from 'react';\nimport { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-utilities';\nimport { Checkmark } from '@elliemae/ds-icons';\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAAA,mBAA+B;AAC/B,0BAAuF;AACvF,sBAA0B;AAC1B,
|
|
4
|
+
"sourcesContent": ["import React, { useMemo } from 'react';\nimport { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-utilities';\nimport { Checkmark } from '@elliemae/ds-icons';\nimport { DSMenuItemT, defaultSingleProps, itemProps } from '../../react-desc-prop-types';\nimport {\n StyledContentWrapper,\n StyledGlobalMenuItemWrapper,\n StyleMenuItemLabel,\n StyleMenuItemSecondaryLabel,\n} from '../styled';\n\nconst SingleMenuItem: React.ComponentType<DSMenuItemT.SingleProps> = (props) => {\n const propsWithDefault = useMemoMergePropsWithDefault(props, defaultSingleProps);\n\n useValidateTypescriptPropTypes(propsWithDefault, itemProps);\n const {\n dsId,\n label,\n secondaryLabel,\n isSelected,\n onClick,\n isActive,\n innerRef,\n onMouseDown,\n onMouseEnter,\n onMouseLeave,\n wrapperStyles,\n render: Render,\n dataTestid,\n disabled,\n } = propsWithDefault;\n\n const gridLayout = useMemo(() => {\n const cols = ['16px', 'auto'];\n if (secondaryLabel) cols.push('min-content');\n return cols;\n }, [secondaryLabel]);\n\n return (\n <StyledGlobalMenuItemWrapper\n aria-selected={isSelected}\n id={dsId}\n role=\"option\"\n isActive={isActive}\n isSelected={isSelected}\n onClick={onClick}\n ref={innerRef}\n onMouseDown={onMouseDown}\n onMouseEnter={onMouseEnter}\n onMouseLeave={onMouseLeave}\n className={isActive ? 'ds-list-item-active' : ''}\n style={wrapperStyles}\n data-testid={dataTestid}\n disabled={disabled}\n data-type=\"single\"\n >\n {Render !== undefined ? (\n <Render {...props} />\n ) : (\n <StyledContentWrapper cols={gridLayout} minHeight=\"16px\" gutter=\"xxs\" alignItems=\"center\">\n <div>{isSelected && <Checkmark size=\"s\" color={['brand-primary', '600']} />}</div>\n <StyleMenuItemLabel>{label}</StyleMenuItemLabel>\n {secondaryLabel !== undefined && <StyleMenuItemSecondaryLabel>{secondaryLabel}</StyleMenuItemSecondaryLabel>}\n </StyledContentWrapper>\n )}\n </StyledGlobalMenuItemWrapper>\n );\n};\n\nSingleMenuItem.propTypes = itemProps;\nSingleMenuItem.displayName = 'SingleMenuItem';\nconst SingleMenuItemWithSchema = describe(SingleMenuItem);\nSingleMenuItemWithSchema.propTypes = itemProps;\n\nexport { SingleMenuItem };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AAAA,mBAA+B;AAC/B,0BAAuF;AACvF,sBAA0B;AAC1B,mCAA2D;AAC3D,oBAKO;AAEP,MAAM,iBAA+D,CAAC,UAAU;AAC9E,QAAM,uBAAmB,kDAA6B,OAAO,+CAAkB;AAE/E,0DAA+B,kBAAkB,sCAAS;AAC1D,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,iBAAa,sBAAQ,MAAM;AAC/B,UAAM,OAAO,CAAC,QAAQ,MAAM;AAC5B,QAAI;AAAgB,WAAK,KAAK,aAAa;AAC3C,WAAO;AAAA,EACT,GAAG,CAAC,cAAc,CAAC;AAEnB,SACE,4CAAC;AAAA,IACC,iBAAe;AAAA,IACf,IAAI;AAAA,IACJ,MAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA,KAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW,WAAW,wBAAwB;AAAA,IAC9C,OAAO;AAAA,IACP,eAAa;AAAA,IACb;AAAA,IACA,aAAU;AAAA,IAET,qBAAW,SACV,4CAAC;AAAA,MAAQ,GAAG;AAAA,KAAO,IAEnB,6CAAC;AAAA,MAAqB,MAAM;AAAA,MAAY,WAAU;AAAA,MAAO,QAAO;AAAA,MAAM,YAAW;AAAA,MAC/E;AAAA,oDAAC;AAAA,UAAK,wBAAc,4CAAC;AAAA,YAAU,MAAK;AAAA,YAAI,OAAO,CAAC,iBAAiB,KAAK;AAAA,WAAG;AAAA,SAAG;AAAA,QAC5E,4CAAC;AAAA,UAAoB;AAAA,SAAM;AAAA,QAC1B,mBAAmB,UAAa,4CAAC;AAAA,UAA6B;AAAA,SAAe;AAAA;AAAA,KAChF;AAAA,GAEJ;AAEJ;AAEA,eAAe,YAAY;AAC3B,eAAe,cAAc;AAC7B,MAAM,+BAA2B,8BAAS,cAAc;AACxD,yBAAyB,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -31,7 +31,6 @@ module.exports = __toCommonJS(SingleWithSubmenuItem_exports);
|
|
|
31
31
|
var React = __toESM(require("react"));
|
|
32
32
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
33
33
|
var import_react = require("react");
|
|
34
|
-
var import_ds_grid = require("@elliemae/ds-grid");
|
|
35
34
|
var import_ds_icons = require("@elliemae/ds-icons");
|
|
36
35
|
var import_ds_utilities = require("@elliemae/ds-utilities");
|
|
37
36
|
var import_react_desc_prop_types = require("../../react-desc-prop-types");
|
|
@@ -112,21 +111,19 @@ const SingleWithSubmenuItem = (props) => {
|
|
|
112
111
|
onMouseEnter: onMouseEnterHandler,
|
|
113
112
|
onMouseLeave: onMouseLeaveHandler,
|
|
114
113
|
ref: innerRef,
|
|
115
|
-
|
|
114
|
+
"data-type": "single-with-submenu",
|
|
116
115
|
children: [
|
|
117
116
|
Render !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Render, {
|
|
118
117
|
...propsWithDefault
|
|
119
|
-
}) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
118
|
+
}) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_styled.StyledContentWrapper, {
|
|
120
119
|
cols: gridLayout,
|
|
121
120
|
gutter: "xxs",
|
|
122
121
|
alignItems: "center",
|
|
123
122
|
children: [
|
|
124
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
})
|
|
129
|
-
}),
|
|
123
|
+
isSelected ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.Checkmark, {
|
|
124
|
+
size: "s",
|
|
125
|
+
color: disabled ? ["neutral", "500"] : ["brand-primary", "600"]
|
|
126
|
+
}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {}),
|
|
130
127
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyleMenuItemLabel, {
|
|
131
128
|
children: label
|
|
132
129
|
}),
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/components/SingleWithSubmenuItem/index.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable max-lines */\nimport React, { useEffect, useState, useMemo } from 'react';\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,mBAAoD;AACpD,
|
|
4
|
+
"sourcesContent": ["/* eslint-disable max-lines */\nimport React, { useEffect, useState, useMemo } from 'react';\nimport { MoreOptionsVert, ChevronRight, Checkmark } from '@elliemae/ds-icons';\nimport { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-utilities';\nimport { DSMenuItemT, defaultSingleWithSubmenuProps, itemProps } from '../../react-desc-prop-types';\nimport {\n StyleMenuItemLabel,\n StyleMenuItemSecondaryLabel,\n StyledIconContainer,\n StyledEllipsisButton,\n StyledGlobalMenuItemWrapper,\n StyledVerticalSeparator,\n StyledContentWrapper,\n} from '../styled';\nimport { useGetSubmenuHandlers } from './useGetSubmenuHandlers';\n\nconst SingleWithSubmenuItem: React.ComponentType<DSMenuItemT.SingleWithSubmenuProps> = (props) => {\n const propsWithDefault = useMemoMergePropsWithDefault<Required<DSMenuItemT.SingleWithSubmenuProps>>(\n props,\n defaultSingleWithSubmenuProps,\n );\n\n useValidateTypescriptPropTypes(propsWithDefault, itemProps);\n\n const {\n dsId,\n label,\n secondaryLabel,\n isActive,\n disabled,\n onClick,\n isSelected,\n isSubmenuOpened,\n rightAddon,\n innerRef,\n wrapperStyles,\n render: Render,\n Dropdown,\n dropdownProps: {\n options,\n openedSubmenus,\n onSubmenuToggle,\n selectedOptions,\n onKeyDown,\n onOptionClick,\n onClickOutside,\n minWidth,\n maxHeight,\n },\n } = propsWithDefault;\n\n // If we don't delay the opening of the poppers, the position will not be placed correctly\n // That why we delay it for the next render using the useEffect hook\n // TODO -- @carusox move this to utilities as a hook\n const [delayedIsOpened, setDelayedIsOpened] = useState(false);\n\n useEffect(() => {\n setTimeout(() => setDelayedIsOpened(isSubmenuOpened));\n }, [isSubmenuOpened]);\n\n const { onMouseEnterHandler, onMouseLeaveHandler, onEllipsisClick } = useGetSubmenuHandlers(propsWithDefault);\n\n const gridLayout = useMemo(() => {\n const cols = ['16px', 'auto'];\n if (secondaryLabel) cols.push('min-content');\n cols.push('min-content');\n return cols;\n }, [secondaryLabel]);\n\n return (\n <Dropdown\n isOpened={delayedIsOpened}\n options={options ?? []}\n onOptionClick={onOptionClick}\n startPlacementPreference=\"right-start\"\n placementOrderPreference={['right-start', 'right-end', 'left-start', 'left-end']}\n selectedOptions={selectedOptions}\n openedSubmenus={openedSubmenus}\n onSubmenuToggle={onSubmenuToggle}\n onKeyDown={onKeyDown}\n onClickOutside={onClickOutside}\n customOffset={[-4, 1]}\n onMouseEnter={onMouseEnterHandler}\n onMouseLeave={onMouseLeaveHandler}\n wrapperStyles={{ ...wrapperStyles, w: '100%' }}\n minWidth={minWidth}\n maxHeight={maxHeight}\n as=\"li\"\n role=\"option\"\n aria-selected={isSubmenuOpened}\n aria-describedby={`dropdownmenu-submenu-${dsId}`}\n id={dsId}\n >\n <StyledGlobalMenuItemWrapper\n pr={0}\n onClick={!disabled ? onClick : undefined}\n isSelected={isSubmenuOpened}\n disabled={disabled}\n isActive={isActive}\n onMouseEnter={onMouseEnterHandler}\n onMouseLeave={onMouseLeaveHandler}\n ref={innerRef}\n data-type=\"single-with-submenu\"\n >\n {Render !== undefined ? (\n <Render {...propsWithDefault} />\n ) : (\n <StyledContentWrapper cols={gridLayout} gutter=\"xxs\" alignItems=\"center\">\n {isSelected ? (\n <Checkmark size=\"s\" color={disabled ? ['neutral', '500'] : ['brand-primary', '600']} />\n ) : (\n <div />\n )}\n <StyleMenuItemLabel>{label}</StyleMenuItemLabel>\n {secondaryLabel !== undefined && (\n <StyleMenuItemSecondaryLabel>{secondaryLabel}</StyleMenuItemSecondaryLabel>\n )}\n <StyledIconContainer>\n <StyledVerticalSeparator />\n {rightAddon === 'ellipsis' ? (\n <StyledEllipsisButton tabIndex={-1} onClick={onEllipsisClick} disabled={disabled}>\n <MoreOptionsVert\n className=\"ds-dropdown-menu-v2-more-options\"\n color={disabled ? ['neutral', '500'] : ['brand-primary', '600']}\n size=\"s\"\n />\n </StyledEllipsisButton>\n ) : (\n <ChevronRight color={disabled ? ['neutral', '500'] : ['brand-primary', '600']} size=\"s\" />\n )}\n </StyledIconContainer>\n </StyledContentWrapper>\n )}\n <span id={`dropdownmenu-submenu-${dsId}`} style={{ display: 'none' }}>\n submenu, to open this submenu press the Right Arrow key\n </span>\n </StyledGlobalMenuItemWrapper>\n </Dropdown>\n );\n};\n\nSingleWithSubmenuItem.propTypes = itemProps;\nSingleWithSubmenuItem.displayName = 'SingleWithSubmenuItem';\nconst SingleWithSubmenuItemWithSchema = describe(SingleWithSubmenuItem);\nSingleWithSubmenuItemWithSchema.propTypes = itemProps;\n\nexport { SingleWithSubmenuItem, SingleWithSubmenuItemWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -31,7 +31,6 @@ module.exports = __toCommonJS(SubmenuItem_exports);
|
|
|
31
31
|
var React = __toESM(require("react"));
|
|
32
32
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
33
33
|
var import_react = require("react");
|
|
34
|
-
var import_ds_grid = require("@elliemae/ds-grid");
|
|
35
34
|
var import_ds_icons = require("@elliemae/ds-icons");
|
|
36
35
|
var import_ds_utilities = require("@elliemae/ds-utilities");
|
|
37
36
|
var import_react_desc_prop_types = require("../../react-desc-prop-types");
|
|
@@ -109,10 +108,11 @@ const SubmenuItem = (props) => {
|
|
|
109
108
|
disabled,
|
|
110
109
|
pl: optionsShouldHavePadding ? 40 : 16,
|
|
111
110
|
as: "div",
|
|
111
|
+
"data-type": "submenu",
|
|
112
112
|
children: [
|
|
113
113
|
Render !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Render, {
|
|
114
114
|
...propsWithDefault
|
|
115
|
-
}) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
115
|
+
}) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_styled.StyledContentWrapper, {
|
|
116
116
|
cols: gridLayout,
|
|
117
117
|
gutter: "xxs",
|
|
118
118
|
alignItems: "center",
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/components/SubmenuItem/index.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable max-lines */\nimport React, { useEffect, useMemo, useState } from 'react';\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB;AACA,mBAAoD;AACpD,
|
|
4
|
+
"sourcesContent": ["/* eslint-disable max-lines */\nimport React, { useEffect, useMemo, useState } from 'react';\nimport { MoreOptionsVert, ChevronRight } from '@elliemae/ds-icons';\nimport { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-utilities';\nimport { DSMenuItemT, defaultSubmenuProps, itemProps } from '../../react-desc-prop-types';\nimport {\n StyleMenuItemLabel,\n StyleMenuItemSecondaryLabel,\n StyledIconContainer,\n StyledEllipsisButton,\n StyledGlobalMenuItemWrapper,\n StyledVerticalSeparator,\n StyledContentWrapper,\n} from '../styled';\nimport { useGetSubmenuHandlers } from './useGetSubmenuHandlers';\n\nconst SubmenuItem: React.ComponentType<DSMenuItemT.SubmenuProps> = (props) => {\n const propsWithDefault = useMemoMergePropsWithDefault<Required<DSMenuItemT.SubmenuProps>>(props, defaultSubmenuProps);\n\n useValidateTypescriptPropTypes(propsWithDefault, itemProps);\n\n const {\n dsId,\n label,\n secondaryLabel,\n isActive,\n disabled,\n isSubmenuOpened,\n rightAddon,\n innerRef,\n wrapperStyles,\n optionsShouldHavePadding,\n render: Render,\n Dropdown,\n dropdownProps: {\n options,\n openedSubmenus,\n onSubmenuToggle,\n selectedOptions,\n onKeyDown,\n onOptionClick,\n onClickOutside,\n minWidth,\n maxHeight,\n },\n } = propsWithDefault;\n\n // If we don't delay the opening of the poppers, the position will not be placed correctly\n // That why we delay it for the next render using the useEffect hook\n // TODO -- @carusox move this to utilities as a hook\n const [delayedIsOpened, setDelayedIsOpened] = useState(false);\n\n useEffect(() => {\n setTimeout(() => setDelayedIsOpened(isSubmenuOpened));\n }, [isSubmenuOpened]);\n\n const { onMouseEnterHandler, onMouseLeaveHandler, onEllipsisClick } = useGetSubmenuHandlers(propsWithDefault);\n\n const gridLayout = useMemo(() => {\n const cols = ['auto'];\n if (secondaryLabel !== undefined) cols.push('min-content');\n cols.push('min-content');\n return cols;\n }, [secondaryLabel]);\n\n return (\n <Dropdown\n isOpened={delayedIsOpened}\n options={options ?? []}\n onOptionClick={onOptionClick}\n startPlacementPreference=\"right-start\"\n placementOrderPreference={['right-start', 'right-end', 'left-start', 'left-end']}\n selectedOptions={selectedOptions}\n openedSubmenus={openedSubmenus}\n onSubmenuToggle={onSubmenuToggle}\n onKeyDown={onKeyDown}\n onClickOutside={onClickOutside}\n customOffset={[-4, 1]}\n onMouseEnter={onMouseEnterHandler}\n onMouseLeave={onMouseLeaveHandler}\n wrapperStyles={{ ...wrapperStyles, w: '100%' }}\n minWidth={minWidth}\n maxHeight={maxHeight}\n as=\"li\"\n role=\"option\"\n aria-selected={isSubmenuOpened}\n aria-describedby={`dropdownmenu-submenu-${dsId}`}\n id={dsId}\n >\n <StyledGlobalMenuItemWrapper\n pr={0}\n isSelected={isSubmenuOpened}\n isActive={isActive}\n onMouseEnter={onMouseEnterHandler}\n onMouseLeave={onMouseLeaveHandler}\n ref={innerRef}\n disabled={disabled}\n pl={optionsShouldHavePadding ? 40 : 16}\n as={'div' as keyof JSX.IntrinsicElements}\n data-type=\"submenu\"\n >\n {Render !== undefined ? (\n <Render {...propsWithDefault} />\n ) : (\n <StyledContentWrapper cols={gridLayout} gutter=\"xxs\" alignItems=\"center\">\n <StyleMenuItemLabel>{label}</StyleMenuItemLabel>\n {secondaryLabel !== undefined && (\n <StyleMenuItemSecondaryLabel>{secondaryLabel}</StyleMenuItemSecondaryLabel>\n )}\n <StyledIconContainer>\n <StyledVerticalSeparator />\n {rightAddon === 'ellipsis' ? (\n <StyledEllipsisButton tabIndex={-1} onClick={onEllipsisClick} disabled={disabled}>\n <MoreOptionsVert\n className=\"ds-dropdown-menu-v2-more-options\"\n color={disabled ? ['neutral', '500'] : ['brand-primary', '600']}\n size=\"s\"\n />\n </StyledEllipsisButton>\n ) : (\n <ChevronRight color={disabled ? ['neutral', '500'] : ['brand-primary', '600']} size=\"s\" />\n )}\n </StyledIconContainer>\n </StyledContentWrapper>\n )}\n <span id={`dropdownmenu-submenu-${dsId}`} style={{ display: 'none' }}>\n submenu, to open this submenu press the Right Arrow key\n </span>\n </StyledGlobalMenuItemWrapper>\n </Dropdown>\n );\n};\n\nSubmenuItem.propTypes = itemProps;\nSubmenuItem.displayName = 'SubmenuItem';\nconst SubmenuItemWithSchema = describe(SubmenuItem);\nSubmenuItemWithSchema.propTypes = itemProps;\n\nexport { SubmenuItem, SubmenuItemWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -26,6 +26,7 @@ var styled_exports = {};
|
|
|
26
26
|
__export(styled_exports, {
|
|
27
27
|
StyleMenuItemLabel: () => StyleMenuItemLabel,
|
|
28
28
|
StyleMenuItemSecondaryLabel: () => StyleMenuItemSecondaryLabel,
|
|
29
|
+
StyledContentWrapper: () => StyledContentWrapper,
|
|
29
30
|
StyledEllipsisButton: () => StyledEllipsisButton,
|
|
30
31
|
StyledGlobalMenuItemWrapper: () => StyledGlobalMenuItemWrapper,
|
|
31
32
|
StyledGroupLabel: () => StyledGroupLabel,
|
|
@@ -39,6 +40,8 @@ __export(styled_exports, {
|
|
|
39
40
|
module.exports = __toCommonJS(styled_exports);
|
|
40
41
|
var React = __toESM(require("react"));
|
|
41
42
|
var import_ds_system = require("@elliemae/ds-system");
|
|
43
|
+
var import_ds_grid = require("@elliemae/ds-grid");
|
|
44
|
+
var import_exported_related = require("../exported-related");
|
|
42
45
|
const borderOutside = () => import_ds_system.css`
|
|
43
46
|
:after {
|
|
44
47
|
display: block;
|
|
@@ -61,7 +64,10 @@ const disabledOption = () => import_ds_system.css`
|
|
|
61
64
|
cursor: not-allowed;
|
|
62
65
|
}
|
|
63
66
|
`;
|
|
64
|
-
const StyledGlobalMenuItemWrapper = import_ds_system.styled
|
|
67
|
+
const StyledGlobalMenuItemWrapper = (0, import_ds_system.styled)("li", {
|
|
68
|
+
name: import_exported_related.DSMenuItemName,
|
|
69
|
+
slot: import_exported_related.DSMenuItemSlots.MENU_ITEM_WRAPPER
|
|
70
|
+
})`
|
|
65
71
|
cursor: pointer;
|
|
66
72
|
min-height: 32px;
|
|
67
73
|
|
|
@@ -90,24 +96,30 @@ const StyledGlobalMenuItemWrapper = import_ds_system.styled.li`
|
|
|
90
96
|
background-color: ${(props) => !props.disabled && props.theme.colors.brand[200]};
|
|
91
97
|
}
|
|
92
98
|
`;
|
|
93
|
-
const StyleMenuItemLabel = import_ds_system.styled.
|
|
99
|
+
const StyleMenuItemLabel = (0, import_ds_system.styled)("span", { name: import_exported_related.DSMenuItemName, slot: import_exported_related.DSMenuItemSlots.MENU_ITEM_LABEL })`
|
|
94
100
|
padding: 8px 0;
|
|
95
101
|
font-size: 13px;
|
|
96
102
|
`;
|
|
97
|
-
const StyleMenuItemSecondaryLabel = import_ds_system.styled
|
|
103
|
+
const StyleMenuItemSecondaryLabel = (0, import_ds_system.styled)("span", {
|
|
104
|
+
name: import_exported_related.DSMenuItemName,
|
|
105
|
+
slot: import_exported_related.DSMenuItemSlots.MENU_ITEM_SECONDARY_LABEL
|
|
106
|
+
})`
|
|
98
107
|
padding: 8px 0;
|
|
99
108
|
font-size: 11px;
|
|
100
109
|
font-style: italic;
|
|
101
110
|
color: brand-800;
|
|
102
111
|
`;
|
|
103
|
-
const StyledIconContainer = import_ds_system.styled.
|
|
112
|
+
const StyledIconContainer = (0, import_ds_system.styled)("div", { name: import_exported_related.DSMenuItemName, slot: import_exported_related.DSMenuItemSlots.MENU_ITEM_ICON })`
|
|
104
113
|
width: 25px;
|
|
105
114
|
height: 24px;
|
|
106
115
|
display: grid;
|
|
107
116
|
grid-template-columns: min-content auto;
|
|
108
117
|
place-items: center;
|
|
109
118
|
`;
|
|
110
|
-
const StyledEllipsisButton = import_ds_system.styled
|
|
119
|
+
const StyledEllipsisButton = (0, import_ds_system.styled)("div", {
|
|
120
|
+
name: import_exported_related.DSMenuItemName,
|
|
121
|
+
slot: import_exported_related.DSMenuItemSlots.MENU_ITEM_ELLIPSIS_BUTTON
|
|
122
|
+
})`
|
|
111
123
|
position: relative;
|
|
112
124
|
width: 100%;
|
|
113
125
|
height: 100%;
|
|
@@ -118,28 +130,34 @@ const StyledEllipsisButton = import_ds_system.styled.div`
|
|
|
118
130
|
${(props) => props.disabled ? "" : borderOutside()}
|
|
119
131
|
}
|
|
120
132
|
`;
|
|
121
|
-
const StyledItemContent = import_ds_system.styled.
|
|
133
|
+
const StyledItemContent = (0, import_ds_system.styled)("div", { name: import_exported_related.DSMenuItemName, slot: import_exported_related.DSMenuItemSlots.MENU_ITEM_CONTENT })`
|
|
122
134
|
display: flex;
|
|
123
135
|
width: 100%;
|
|
124
136
|
`;
|
|
125
|
-
const StyledSeparator = import_ds_system.styled.
|
|
137
|
+
const StyledSeparator = (0, import_ds_system.styled)("hr", { name: import_exported_related.DSMenuItemName, slot: import_exported_related.DSMenuItemSlots.MENU_ITEM_SEPARATOR })`
|
|
126
138
|
border: 0;
|
|
127
139
|
border-top: 1px solid #697489;
|
|
128
140
|
margin: 4px 0px;
|
|
129
141
|
padding: 0;
|
|
130
142
|
`;
|
|
131
|
-
const StyledSeparatorWrapper = import_ds_system.styled
|
|
143
|
+
const StyledSeparatorWrapper = (0, import_ds_system.styled)("li", {
|
|
144
|
+
name: import_exported_related.DSMenuItemName,
|
|
145
|
+
slot: import_exported_related.DSMenuItemSlots.MENU_ITEM_SEPARATOR_WRAPPER
|
|
146
|
+
})`
|
|
132
147
|
list-style: none;
|
|
133
148
|
padding: 0px 16px;
|
|
134
149
|
${import_ds_system.position}
|
|
135
150
|
${import_ds_system.layout}
|
|
136
151
|
${import_ds_system.sizing}
|
|
137
152
|
`;
|
|
138
|
-
const StyledGroupLabel = import_ds_system.styled.
|
|
153
|
+
const StyledGroupLabel = (0, import_ds_system.styled)("span", { name: import_exported_related.DSMenuItemName, slot: import_exported_related.DSMenuItemSlots.MENU_ITEM_GROUP_LABEL })`
|
|
139
154
|
font-size: 13px;
|
|
140
155
|
color: neutral-500;
|
|
141
156
|
`;
|
|
142
|
-
const StyledSectionWrapper = import_ds_system.styled
|
|
157
|
+
const StyledSectionWrapper = (0, import_ds_system.styled)("li", {
|
|
158
|
+
name: import_exported_related.DSMenuItemName,
|
|
159
|
+
slot: import_exported_related.DSMenuItemSlots.MENU_ITEM_SECTION_WRAPPER
|
|
160
|
+
})`
|
|
143
161
|
${import_ds_system.position}
|
|
144
162
|
${import_ds_system.layout}
|
|
145
163
|
${import_ds_system.sizing}
|
|
@@ -149,9 +167,16 @@ const StyledSectionWrapper = import_ds_system.styled.li`
|
|
|
149
167
|
display: flex;
|
|
150
168
|
align-items: center;
|
|
151
169
|
`;
|
|
152
|
-
const StyledVerticalSeparator = import_ds_system.styled
|
|
170
|
+
const StyledVerticalSeparator = (0, import_ds_system.styled)("div", {
|
|
171
|
+
name: import_exported_related.DSMenuItemName,
|
|
172
|
+
slot: import_exported_related.DSMenuItemSlots.MENU_ITEM_VERTICAL_SEPARATOR
|
|
173
|
+
})`
|
|
153
174
|
width: 1px;
|
|
154
175
|
height: 18px;
|
|
155
176
|
background-color: neutral-300;
|
|
156
177
|
`;
|
|
178
|
+
const StyledContentWrapper = (0, import_ds_system.styled)(import_ds_grid.Grid, {
|
|
179
|
+
name: import_exported_related.DSMenuItemName,
|
|
180
|
+
slot: import_exported_related.DSMenuItemSlots.MENU_ITEM_CONTENT_WRAPPER
|
|
181
|
+
})``;
|
|
157
182
|
//# sourceMappingURL=styled.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/styled.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import {\n styled,\n css,\n layout,\n position,\n space,\n sizing,\n LayoutProps,\n SizingProps,\n PositionProps,\n SpaceProps,\n} from '@elliemae/ds-system';\n\nconst borderOutside = () => css`\n :after {\n display: block;\n content: ' ';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n border: 1px solid ${({ theme }) => theme.colors.brand[500]};\n pointer-events: none;\n z-index: 7;\n }\n`;\n\nconst disabledOption = () => css`\n color: ${({ theme }) => theme.colors.neutral[500]};\n\n cursor: not-allowed;\n * {\n cursor: not-allowed;\n }\n`;\n\
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAWO;
|
|
4
|
+
"sourcesContent": ["import {\n styled,\n css,\n layout,\n position,\n space,\n sizing,\n LayoutProps,\n SizingProps,\n PositionProps,\n SpaceProps,\n} from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSMenuItemName, DSMenuItemSlots } from '../exported-related';\n\nconst borderOutside = () => css`\n :after {\n display: block;\n content: ' ';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n border: 1px solid ${({ theme }) => theme.colors.brand[500]};\n pointer-events: none;\n z-index: 7;\n }\n`;\n\nconst disabledOption = () => css`\n color: ${({ theme }) => theme.colors.neutral[500]};\n\n cursor: not-allowed;\n * {\n cursor: not-allowed;\n }\n`;\n\ninterface StyledGlobalMenuItemWrapperT extends LayoutProps, SizingProps, PositionProps, SpaceProps {\n isSelected?: boolean;\n isActive?: boolean;\n disabled?: boolean;\n}\n\nexport const StyledGlobalMenuItemWrapper = styled('li', {\n name: DSMenuItemName,\n slot: DSMenuItemSlots.MENU_ITEM_WRAPPER,\n})<StyledGlobalMenuItemWrapperT>`\n cursor: pointer;\n min-height: 32px;\n\n padding-left: 16px;\n padding-right: 16px;\n display: grid;\n align-items: center;\n list-style: none;\n position: relative;\n ${position}\n ${layout}\n ${sizing}\n ${space}\n\n ${(props) => {\n if (props.disabled) return disabledOption();\n if (props.isActive) return borderOutside();\n return '';\n }};\n\n background-color: ${(props) => (props.isActive ? props.theme.colors.brand[200] : 'white')};\n\n &:hover {\n background-color: ${(props) => !props.disabled && props.theme.colors.brand[200]};\n }\n`;\n\nexport const StyleMenuItemLabel = styled('span', { name: DSMenuItemName, slot: DSMenuItemSlots.MENU_ITEM_LABEL })`\n padding: 8px 0;\n font-size: 13px;\n`;\n\nexport const StyleMenuItemSecondaryLabel = styled('span', {\n name: DSMenuItemName,\n slot: DSMenuItemSlots.MENU_ITEM_SECONDARY_LABEL,\n})`\n padding: 8px 0;\n font-size: 11px;\n font-style: italic;\n color: brand-800;\n`;\n\nexport const StyledIconContainer = styled('div', { name: DSMenuItemName, slot: DSMenuItemSlots.MENU_ITEM_ICON })`\n width: 25px;\n height: 24px;\n display: grid;\n grid-template-columns: min-content auto;\n place-items: center;\n`;\n\nexport const StyledEllipsisButton = styled('div', {\n name: DSMenuItemName,\n slot: DSMenuItemSlots.MENU_ITEM_ELLIPSIS_BUTTON,\n})<{ disabled: boolean }>`\n position: relative;\n width: 100%;\n height: 100%;\n display: grid;\n place-items: center;\n background: transparent;\n :active {\n ${(props) => (props.disabled ? '' : borderOutside())}\n }\n`;\n\nexport const StyledItemContent = styled('div', { name: DSMenuItemName, slot: DSMenuItemSlots.MENU_ITEM_CONTENT })`\n display: flex;\n width: 100%;\n`;\n\nexport const StyledSeparator = styled('hr', { name: DSMenuItemName, slot: DSMenuItemSlots.MENU_ITEM_SEPARATOR })`\n border: 0;\n border-top: 1px solid #697489;\n margin: 4px 0px;\n padding: 0;\n`;\n\nexport const StyledSeparatorWrapper = styled('li', {\n name: DSMenuItemName,\n slot: DSMenuItemSlots.MENU_ITEM_SEPARATOR_WRAPPER,\n})`\n list-style: none;\n padding: 0px 16px;\n ${position}\n ${layout}\n ${sizing}\n`;\n\nexport const StyledGroupLabel = styled('span', { name: DSMenuItemName, slot: DSMenuItemSlots.MENU_ITEM_GROUP_LABEL })`\n font-size: 13px;\n color: neutral-500;\n`;\n\nexport const StyledSectionWrapper = styled('li', {\n name: DSMenuItemName,\n slot: DSMenuItemSlots.MENU_ITEM_SECTION_WRAPPER,\n})`\n ${position}\n ${layout}\n ${sizing}\n list-style: none;\n padding: 0px 16px;\n height: 24px;\n display: flex;\n align-items: center;\n`;\n\nexport const StyledVerticalSeparator = styled('div', {\n name: DSMenuItemName,\n slot: DSMenuItemSlots.MENU_ITEM_VERTICAL_SEPARATOR,\n})`\n width: 1px;\n height: 18px;\n background-color: neutral-300;\n`;\n\nexport const StyledContentWrapper = styled(Grid, {\n name: DSMenuItemName,\n slot: DSMenuItemSlots.MENU_ITEM_CONTENT_WRAPPER,\n})``;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAWO;AACP,qBAAqB;AACrB,8BAAgD;AAEhD,MAAM,gBAAgB,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBASJ,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAM1D,MAAM,iBAAiB,MAAM;AAAA,WAClB,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAcxC,MAAM,kCAA8B,yBAAO,MAAM;AAAA,EACtD,MAAM;AAAA,EACN,MAAM,wCAAgB;AACxB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAUG;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA,IAEA,CAAC,UAAU;AACX,MAAI,MAAM;AAAU,WAAO,eAAe;AAC1C,MAAI,MAAM;AAAU,WAAO,cAAc;AACzC,SAAO;AACT;AAAA;AAAA,sBAEoB,CAAC,UAAW,MAAM,WAAW,MAAM,MAAM,OAAO,MAAM,OAAO;AAAA;AAAA;AAAA,wBAG3D,CAAC,UAAU,CAAC,MAAM,YAAY,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAIxE,MAAM,yBAAqB,yBAAO,QAAQ,EAAE,MAAM,wCAAgB,MAAM,wCAAgB,gBAAgB,CAAC;AAAA;AAAA;AAAA;AAKzG,MAAM,kCAA8B,yBAAO,QAAQ;AAAA,EACxD,MAAM;AAAA,EACN,MAAM,wCAAgB;AACxB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAOM,MAAM,0BAAsB,yBAAO,OAAO,EAAE,MAAM,wCAAgB,MAAM,wCAAgB,eAAe,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQxG,MAAM,2BAAuB,yBAAO,OAAO;AAAA,EAChD,MAAM;AAAA,EACN,MAAM,wCAAgB;AACxB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAQK,CAAC,UAAW,MAAM,WAAW,KAAK,cAAc;AAAA;AAAA;AAI/C,MAAM,wBAAoB,yBAAO,OAAO,EAAE,MAAM,wCAAgB,MAAM,wCAAgB,kBAAkB,CAAC;AAAA;AAAA;AAAA;AAKzG,MAAM,sBAAkB,yBAAO,MAAM,EAAE,MAAM,wCAAgB,MAAM,wCAAgB,oBAAoB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAOxG,MAAM,6BAAyB,yBAAO,MAAM;AAAA,EACjD,MAAM;AAAA,EACN,MAAM,wCAAgB;AACxB,CAAC;AAAA;AAAA;AAAA,IAGG;AAAA,IACA;AAAA,IACA;AAAA;AAGG,MAAM,uBAAmB,yBAAO,QAAQ,EAAE,MAAM,wCAAgB,MAAM,wCAAgB,sBAAsB,CAAC;AAAA;AAAA;AAAA;AAK7G,MAAM,2BAAuB,yBAAO,MAAM;AAAA,EAC/C,MAAM;AAAA,EACN,MAAM,wCAAgB;AACxB,CAAC;AAAA,IACG;AAAA,IACA;AAAA,IACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQG,MAAM,8BAA0B,yBAAO,OAAO;AAAA,EACnD,MAAM;AAAA,EACN,MAAM,wCAAgB;AACxB,CAAC;AAAA;AAAA;AAAA;AAAA;AAMM,MAAM,2BAAuB,yBAAO,qBAAM;AAAA,EAC/C,MAAM;AAAA,EACN,MAAM,wCAAgB;AACxB,CAAC;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,47 @@
|
|
|
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 constants_exports = {};
|
|
26
|
+
__export(constants_exports, {
|
|
27
|
+
DSMenuItemName: () => DSMenuItemName,
|
|
28
|
+
DSMenuItemSlots: () => DSMenuItemSlots
|
|
29
|
+
});
|
|
30
|
+
module.exports = __toCommonJS(constants_exports);
|
|
31
|
+
var React = __toESM(require("react"));
|
|
32
|
+
const DSMenuItemName = "ds-menu-item";
|
|
33
|
+
const DSMenuItemSlots = {
|
|
34
|
+
MENU_ITEM_WRAPPER: "menu-item-wrapper",
|
|
35
|
+
MENU_ITEM_LABEL: "menu-item-label",
|
|
36
|
+
MENU_ITEM_SECONDARY_LABEL: "menu-item-secondary-label",
|
|
37
|
+
MENU_ITEM_ICON: "menu-item-icon",
|
|
38
|
+
MENU_ITEM_ELLIPSIS_BUTTON: "menu-item-ellipsis-button",
|
|
39
|
+
MENU_ITEM_CONTENT: "menu-item-content",
|
|
40
|
+
MENU_ITEM_SEPARATOR: "menu-item-separator",
|
|
41
|
+
MENU_ITEM_SEPARATOR_WRAPPER: "menu-item-separator-wrapper",
|
|
42
|
+
MENU_ITEM_GROUP_LABEL: "menu-item-group-label",
|
|
43
|
+
MENU_ITEM_SECTION_WRAPPER: "menu-item-section-wrapper",
|
|
44
|
+
MENU_ITEM_VERTICAL_SEPARATOR: "menu-item-vertical-separator",
|
|
45
|
+
MENU_ITEM_CONTENT_WRAPPER: "menu-item-content-wrapper"
|
|
46
|
+
};
|
|
47
|
+
//# sourceMappingURL=constants.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/exported-related/constants.ts", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["export const DSMenuItemName = 'ds-menu-item';\n\nexport const DSMenuItemSlots = {\n MENU_ITEM_WRAPPER: 'menu-item-wrapper',\n MENU_ITEM_LABEL: 'menu-item-label',\n MENU_ITEM_SECONDARY_LABEL: 'menu-item-secondary-label',\n MENU_ITEM_ICON: 'menu-item-icon',\n MENU_ITEM_ELLIPSIS_BUTTON: 'menu-item-ellipsis-button',\n MENU_ITEM_CONTENT: 'menu-item-content',\n MENU_ITEM_SEPARATOR: 'menu-item-separator',\n MENU_ITEM_SEPARATOR_WRAPPER: 'menu-item-separator-wrapper',\n MENU_ITEM_GROUP_LABEL: 'menu-item-group-label',\n MENU_ITEM_SECTION_WRAPPER: 'menu-item-section-wrapper',\n MENU_ITEM_VERTICAL_SEPARATOR: 'menu-item-vertical-separator',\n MENU_ITEM_CONTENT_WRAPPER: 'menu-item-content-wrapper',\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,iBAAiB;AAEvB,MAAM,kBAAkB;AAAA,EAC7B,mBAAmB;AAAA,EACnB,iBAAiB;AAAA,EACjB,2BAA2B;AAAA,EAC3B,gBAAgB;AAAA,EAChB,2BAA2B;AAAA,EAC3B,mBAAmB;AAAA,EACnB,qBAAqB;AAAA,EACrB,6BAA6B;AAAA,EAC7B,uBAAuB;AAAA,EACvB,2BAA2B;AAAA,EAC3B,8BAA8B;AAAA,EAC9B,2BAA2B;AAC7B;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,26 @@
|
|
|
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 __copyProps = (to, from, except, desc) => {
|
|
9
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
10
|
+
for (let key of __getOwnPropNames(from))
|
|
11
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
12
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
13
|
+
}
|
|
14
|
+
return to;
|
|
15
|
+
};
|
|
16
|
+
var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
|
|
17
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
18
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
19
|
+
mod
|
|
20
|
+
));
|
|
21
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
22
|
+
var exported_related_exports = {};
|
|
23
|
+
module.exports = __toCommonJS(exported_related_exports);
|
|
24
|
+
var React = __toESM(require("react"));
|
|
25
|
+
__reExport(exported_related_exports, require("./constants"), module.exports);
|
|
26
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/exported-related/index.ts", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["export * from './constants';\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;ACAA,YAAuB;ADAvB,qCAAc,wBAAd;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
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": ["
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;ACAA,YAAuB;
|
|
4
|
+
"sourcesContent": ["import type {} from '@xstyled/system';\nimport type {} from '@xstyled/util';\n\nexport * from './components';\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;ACAA,YAAuB;ADGvB,wBAAc,yBAHd;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|