@elliemae/ds-menu-items-skeleton 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/DSMenuItemsSkeleton.js +14 -4
- package/dist/cjs/DSMenuItemsSkeleton.js.map +2 -2
- package/dist/cjs/package.json +1 -4
- package/dist/cjs/react-desc-prop-types.js.map +2 -2
- package/dist/cjs/typescript-testing/typescript-menu-items-skeleton-valid.js +49 -0
- package/dist/cjs/typescript-testing/typescript-menu-items-skeleton-valid.js.map +7 -0
- package/dist/esm/DSMenuItemsSkeleton.js +14 -4
- package/dist/esm/DSMenuItemsSkeleton.js.map +2 -2
- package/dist/esm/package.json +1 -4
- package/dist/esm/react-desc-prop-types.js.map +2 -2
- package/dist/esm/typescript-testing/typescript-menu-items-skeleton-valid.js +26 -0
- package/dist/esm/typescript-testing/typescript-menu-items-skeleton-valid.js.map +7 -0
- package/package.json +12 -11
|
@@ -56,10 +56,20 @@ const DSMenuItemsSkeleton = (props) => {
|
|
|
56
56
|
getOwnerProps,
|
|
57
57
|
...globalProps,
|
|
58
58
|
...xstyledProps,
|
|
59
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
59
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
60
|
+
import_ds_menu_items_commons.StyledContentWrapper,
|
|
61
|
+
{
|
|
62
|
+
cols: gridLayout,
|
|
63
|
+
minHeight: "16px",
|
|
64
|
+
gutter: "xxs",
|
|
65
|
+
alignItems: "center",
|
|
66
|
+
getOwnerProps,
|
|
67
|
+
children: [
|
|
68
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_skeleton.DSSkeleton, { variant: "rectangular", width: "20px", bg: "neutral-080", borderRadius: "1px" }),
|
|
69
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_skeleton.DSSkeleton, { variant: "rectangular", width: "100%", bg: "neutral-080", borderRadius: "1px" })
|
|
70
|
+
]
|
|
71
|
+
}
|
|
72
|
+
)
|
|
63
73
|
}
|
|
64
74
|
);
|
|
65
75
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/DSMenuItemsSkeleton.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { describe, useOwnerProps } from '@elliemae/ds-props-helpers';\nimport { DSSkeleton } from '@elliemae/ds-skeleton';\nimport { StyledGlobalMenuItemWrapper, StyledContentWrapper } from '@elliemae/ds-menu-items-commons';\nimport { type DSMenuItemsSkeletonT, DSMenuItemsSkeletonPropTypesSchema } from './react-desc-prop-types.js';\nimport { useMenuItemsSkeleton } from './config/useMenuItemsSkeleton.js';\nconst gridLayout = ['16px', 'auto'];\n\nconst DSMenuItemsSkeleton: React.ComponentType<DSMenuItemsSkeletonT.Props> = (props) => {\n const { propsWithDefault, globalProps, xstyledProps } = useMenuItemsSkeleton(props);\n const { wrapperStyles, isActive, dsId } = propsWithDefault;\n const { getOwnerProps } = useOwnerProps(props);\n\n return (\n <StyledGlobalMenuItemWrapper\n id={dsId}\n data-type=\"skeleton\"\n data-testid=\"ds-skeleton-menu-item\"\n role=\"presentation\"\n style={wrapperStyles}\n isActive={isActive}\n getOwnerProps={getOwnerProps}\n {...globalProps}\n {...xstyledProps}\n >\n <StyledContentWrapper
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADyBjB;AAxBN,8BAAwC;AACxC,yBAA2B;AAC3B,mCAAkE;AAClE,mCAA8E;AAC9E,kCAAqC;AACrC,MAAM,aAAa,CAAC,QAAQ,MAAM;AAElC,MAAM,sBAAuE,CAAC,UAAU;AACtF,QAAM,EAAE,kBAAkB,aAAa,aAAa,QAAI,kDAAqB,KAAK;AAClF,QAAM,EAAE,eAAe,UAAU,KAAK,IAAI;AAC1C,QAAM,EAAE,cAAc,QAAI,uCAAc,KAAK;AAE7C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,IAAI;AAAA,MACJ,aAAU;AAAA,MACV,eAAY;AAAA,MACZ,MAAK;AAAA,MACL,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACC,GAAG;AAAA,MACH,GAAG;AAAA,MAEJ,
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { describe, useOwnerProps } from '@elliemae/ds-props-helpers';\nimport { DSSkeleton } from '@elliemae/ds-skeleton';\nimport { StyledGlobalMenuItemWrapper, StyledContentWrapper } from '@elliemae/ds-menu-items-commons';\nimport { type DSMenuItemsSkeletonT, DSMenuItemsSkeletonPropTypesSchema } from './react-desc-prop-types.js';\nimport { useMenuItemsSkeleton } from './config/useMenuItemsSkeleton.js';\nconst gridLayout = ['16px', 'auto'];\n\nconst DSMenuItemsSkeleton: React.ComponentType<DSMenuItemsSkeletonT.Props> = (props) => {\n const { propsWithDefault, globalProps, xstyledProps } = useMenuItemsSkeleton(props);\n const { wrapperStyles, isActive, dsId } = propsWithDefault;\n const { getOwnerProps } = useOwnerProps(props);\n\n return (\n <StyledGlobalMenuItemWrapper\n id={dsId}\n data-type=\"skeleton\"\n data-testid=\"ds-skeleton-menu-item\"\n role=\"presentation\"\n style={wrapperStyles}\n isActive={isActive}\n getOwnerProps={getOwnerProps}\n {...globalProps}\n {...xstyledProps}\n >\n <StyledContentWrapper\n cols={gridLayout}\n minHeight=\"16px\"\n gutter=\"xxs\"\n alignItems=\"center\"\n getOwnerProps={getOwnerProps}\n >\n <DSSkeleton variant=\"rectangular\" width=\"20px\" bg=\"neutral-080\" borderRadius=\"1px\" />\n <DSSkeleton variant=\"rectangular\" width=\"100%\" bg=\"neutral-080\" borderRadius=\"1px\" />\n </StyledContentWrapper>\n </StyledGlobalMenuItemWrapper>\n );\n};\n\n// the component used to not even define this...\nDSMenuItemsSkeleton.displayName = 'DSMenuItemSkeleton';\nconst DSMenuItemsSkeletonWithSchema = describe(DSMenuItemsSkeleton);\nDSMenuItemsSkeletonWithSchema.propTypes = DSMenuItemsSkeletonPropTypesSchema;\n\nexport { DSMenuItemsSkeleton, DSMenuItemsSkeletonWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADyBjB;AAxBN,8BAAwC;AACxC,yBAA2B;AAC3B,mCAAkE;AAClE,mCAA8E;AAC9E,kCAAqC;AACrC,MAAM,aAAa,CAAC,QAAQ,MAAM;AAElC,MAAM,sBAAuE,CAAC,UAAU;AACtF,QAAM,EAAE,kBAAkB,aAAa,aAAa,QAAI,kDAAqB,KAAK;AAClF,QAAM,EAAE,eAAe,UAAU,KAAK,IAAI;AAC1C,QAAM,EAAE,cAAc,QAAI,uCAAc,KAAK;AAE7C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,IAAI;AAAA,MACJ,aAAU;AAAA,MACV,eAAY;AAAA,MACZ,MAAK;AAAA,MACL,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACC,GAAG;AAAA,MACH,GAAG;AAAA,MAEJ;AAAA,QAAC;AAAA;AAAA,UACC,MAAM;AAAA,UACN,WAAU;AAAA,UACV,QAAO;AAAA,UACP,YAAW;AAAA,UACX;AAAA,UAEA;AAAA,wDAAC,iCAAW,SAAQ,eAAc,OAAM,QAAO,IAAG,eAAc,cAAa,OAAM;AAAA,YACnF,4CAAC,iCAAW,SAAQ,eAAc,OAAM,QAAO,IAAG,eAAc,cAAa,OAAM;AAAA;AAAA;AAAA,MACrF;AAAA;AAAA,EACF;AAEJ;AAGA,oBAAoB,cAAc;AAClC,MAAM,oCAAgC,kCAAS,mBAAmB;AAClE,8BAA8B,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/react-desc-prop-types.ts", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable @typescript-eslint/no-duplicate-type-constituents */\n
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADGvB,8BAAuE;
|
|
4
|
+
"sourcesContent": ["/* eslint-disable @typescript-eslint/no-duplicate-type-constituents */\n\nimport type { GlobalAttributesT, XstyledProps, DSPropTypesSchema } from '@elliemae/ds-props-helpers';\nimport { PropTypes, globalAttributesPropTypes, xstyledPropTypes } from '@elliemae/ds-props-helpers';\nimport { type DSMenuItemsCommonsT } from '@elliemae/ds-menu-items-commons';\nimport type { WeakValidationMap } from 'react';\n\nexport declare namespace DSMenuItemsSkeletonT {\n /** *****************************************************************************************\n ******************************** IMPORTANT DISCLAIMER *************************************\n *******************************************************************************************\n This component violates `common.RequiredProps` because\n - it does not have a 'render' prop\n - it does not have an 'original' prop\n - it does not have an 'innerRef' prop\n - it does not have any \"schema\" validator\n\n Legacy was not supporting global attributes but during the refactor I added them.\n It was not merging \"default\" props either, but I added them as well. (only for wrapperStyles)\n Those changes should be 100% backward compatible.\n \n I am reflecting what the code is actually doing instead of what we \"meant\" to do.\n ***************************************************************************************** */\n\n // sections can not be \"selected\" nor activated and for this reason we never had an hard requirement for the dsId\n // this may not scale well but to avoid breaking changes we are keeping it this way, if we ever need to add it we will do a V2\n\n // typescript inheritance has no syntax support for \"interfaces\", we have to use union types instead...\n export type RequiredProps = DSMenuItemsCommonsT.RequiredProps;\n\n export type DefaultProps = {\n wrapperStyles?: DSMenuItemsCommonsT.DefaultProps['wrapperStyles'];\n };\n\n export type OptionalProps = {\n isActive?: boolean;\n };\n\n export interface Props\n extends\n Partial<DefaultProps>,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps | keyof XstyledProps>,\n XstyledProps,\n RequiredProps {}\n\n export interface InternalProps\n extends\n DefaultProps,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps | keyof XstyledProps>,\n XstyledProps,\n RequiredProps {}\n}\n\nexport const defaultProps: DSMenuItemsSkeletonT.DefaultProps = {\n wrapperStyles: {},\n};\n\nexport const DSMenuItemsSkeletonPropTypes: DSPropTypesSchema<DSMenuItemsSkeletonT.InternalProps> = {\n // each single menu-item is in charge of spreading the GlobalAttributesT & XstyledProps\n // they are NOT inherited from a common element from ds-menu-items-commons\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n dsId: PropTypes.string.description(\n 'This is used as \"id\" in the DOM, you need this to be able to make this A11Y accessible.',\n ).isRequired,\n isActive: PropTypes.bool.description('Whether the menu item is active.'),\n wrapperStyles: PropTypes.object.description('The styles to apply to the wrapper element, if any.'),\n};\n\nexport const DSMenuItemsSkeletonPropTypesSchema =\n DSMenuItemsSkeletonPropTypes as unknown as WeakValidationMap<DSMenuItemsSkeletonT.Props>;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADGvB,8BAAuE;AAoDhE,MAAM,eAAkD;AAAA,EAC7D,eAAe,CAAC;AAClB;AAEO,MAAM,+BAAsF;AAAA;AAAA;AAAA,EAGjG,GAAG;AAAA,EACH,GAAG;AAAA,EACH,MAAM,kCAAU,OAAO;AAAA,IACrB;AAAA,EACF,EAAE;AAAA,EACF,UAAU,kCAAU,KAAK,YAAY,kCAAkC;AAAA,EACvE,eAAe,kCAAU,OAAO,YAAY,qDAAqD;AACnG;AAEO,MAAM,qCACX;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,49 @@
|
|
|
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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
17
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
18
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
19
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
20
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
24
|
+
var React = __toESM(require("react"));
|
|
25
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
26
|
+
var import_DSMenuItemsSkeleton = require("../DSMenuItemsSkeleton");
|
|
27
|
+
const testRequiredProps = {
|
|
28
|
+
dsId: "skeleton-0"
|
|
29
|
+
};
|
|
30
|
+
const testOptionalProps = {
|
|
31
|
+
isActive: false
|
|
32
|
+
};
|
|
33
|
+
const testPartialDefaults = {
|
|
34
|
+
wrapperStyles: { width: "100%" }
|
|
35
|
+
};
|
|
36
|
+
const testProps = {
|
|
37
|
+
...testRequiredProps,
|
|
38
|
+
...testOptionalProps,
|
|
39
|
+
...testPartialDefaults
|
|
40
|
+
};
|
|
41
|
+
const testInternalProps = {
|
|
42
|
+
dsId: "skeleton-0",
|
|
43
|
+
wrapperStyles: {}
|
|
44
|
+
};
|
|
45
|
+
const validMinimum = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_DSMenuItemsSkeleton.DSMenuItemsSkeleton, { dsId: "skeleton-0" });
|
|
46
|
+
const validActive = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_DSMenuItemsSkeleton.DSMenuItemsSkeleton, { dsId: "skeleton-0", isActive: true });
|
|
47
|
+
const validWithStyles = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_DSMenuItemsSkeleton.DSMenuItemsSkeleton, { dsId: "skeleton-0", wrapperStyles: { width: "100%" } });
|
|
48
|
+
const validWithAriaLabel = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_DSMenuItemsSkeleton.DSMenuItemsSkeleton, { dsId: "skeleton-0", "aria-label": "loading option" });
|
|
49
|
+
//# sourceMappingURL=typescript-menu-items-skeleton-valid.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/typescript-testing/typescript-menu-items-skeleton-valid.tsx"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-unused-vars, no-unused-vars */\n/* eslint-disable local-rules/custom-rule */\nimport { DSMenuItemsSkeleton } from '../DSMenuItemsSkeleton';\nimport type { DSMenuItemsSkeletonT } from '../react-desc-prop-types';\n\ntype ComponentPropsForApp = DSMenuItemsSkeletonT.Props;\ntype ComponentPropsInternals = DSMenuItemsSkeletonT.InternalProps;\ntype ComponentPropsDefaultProps = DSMenuItemsSkeletonT.DefaultProps;\ntype ComponentPropsOptionalProps = DSMenuItemsSkeletonT.OptionalProps;\ntype ComponentPropsRequiredProps = DSMenuItemsSkeletonT.RequiredProps;\n\nconst testRequiredProps: ComponentPropsRequiredProps = {\n dsId: 'skeleton-0',\n};\n\nconst testOptionalProps: ComponentPropsOptionalProps = {\n isActive: false,\n};\n\nconst testPartialDefaults: Partial<ComponentPropsDefaultProps> = {\n wrapperStyles: { width: '100%' },\n};\n\nconst testProps: ComponentPropsForApp = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testPartialDefaults,\n};\n\nconst testInternalProps: ComponentPropsInternals = {\n dsId: 'skeleton-0',\n wrapperStyles: {},\n};\n\n/**\n * Compile-time renders \u2014 pure type checking, never executed. If any of these\n * fail to typecheck, the component's public Props contract has drifted from\n * what the namespace claims.\n */\nconst validMinimum = <DSMenuItemsSkeleton dsId=\"skeleton-0\" />;\nconst validActive = <DSMenuItemsSkeleton dsId=\"skeleton-0\" isActive />;\nconst validWithStyles = <DSMenuItemsSkeleton dsId=\"skeleton-0\" wrapperStyles={{ width: '100%' }} />;\nconst validWithAriaLabel = <DSMenuItemsSkeleton dsId=\"skeleton-0\" aria-label=\"loading option\" />;\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA,YAAuB;ACuCF;AArCrB,iCAAoC;AASpC,MAAM,oBAAiD;AAAA,EACrD,MAAM;AACR;AAEA,MAAM,oBAAiD;AAAA,EACrD,UAAU;AACZ;AAEA,MAAM,sBAA2D;AAAA,EAC/D,eAAe,EAAE,OAAO,OAAO;AACjC;AAEA,MAAM,YAAkC;AAAA,EACtC,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AAEA,MAAM,oBAA6C;AAAA,EACjD,MAAM;AAAA,EACN,eAAe,CAAC;AAClB;AAOA,MAAM,eAAe,4CAAC,kDAAoB,MAAK,cAAa;AAC5D,MAAM,cAAc,4CAAC,kDAAoB,MAAK,cAAa,UAAQ,MAAC;AACpE,MAAM,kBAAkB,4CAAC,kDAAoB,MAAK,cAAa,eAAe,EAAE,OAAO,OAAO,GAAG;AACjG,MAAM,qBAAqB,4CAAC,kDAAoB,MAAK,cAAa,cAAW,kBAAiB;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -22,10 +22,20 @@ const DSMenuItemsSkeleton = (props) => {
|
|
|
22
22
|
getOwnerProps,
|
|
23
23
|
...globalProps,
|
|
24
24
|
...xstyledProps,
|
|
25
|
-
children: /* @__PURE__ */ jsxs(
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
25
|
+
children: /* @__PURE__ */ jsxs(
|
|
26
|
+
StyledContentWrapper,
|
|
27
|
+
{
|
|
28
|
+
cols: gridLayout,
|
|
29
|
+
minHeight: "16px",
|
|
30
|
+
gutter: "xxs",
|
|
31
|
+
alignItems: "center",
|
|
32
|
+
getOwnerProps,
|
|
33
|
+
children: [
|
|
34
|
+
/* @__PURE__ */ jsx(DSSkeleton, { variant: "rectangular", width: "20px", bg: "neutral-080", borderRadius: "1px" }),
|
|
35
|
+
/* @__PURE__ */ jsx(DSSkeleton, { variant: "rectangular", width: "100%", bg: "neutral-080", borderRadius: "1px" })
|
|
36
|
+
]
|
|
37
|
+
}
|
|
38
|
+
)
|
|
29
39
|
}
|
|
30
40
|
);
|
|
31
41
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/DSMenuItemsSkeleton.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { describe, useOwnerProps } from '@elliemae/ds-props-helpers';\nimport { DSSkeleton } from '@elliemae/ds-skeleton';\nimport { StyledGlobalMenuItemWrapper, StyledContentWrapper } from '@elliemae/ds-menu-items-commons';\nimport { type DSMenuItemsSkeletonT, DSMenuItemsSkeletonPropTypesSchema } from './react-desc-prop-types.js';\nimport { useMenuItemsSkeleton } from './config/useMenuItemsSkeleton.js';\nconst gridLayout = ['16px', 'auto'];\n\nconst DSMenuItemsSkeleton: React.ComponentType<DSMenuItemsSkeletonT.Props> = (props) => {\n const { propsWithDefault, globalProps, xstyledProps } = useMenuItemsSkeleton(props);\n const { wrapperStyles, isActive, dsId } = propsWithDefault;\n const { getOwnerProps } = useOwnerProps(props);\n\n return (\n <StyledGlobalMenuItemWrapper\n id={dsId}\n data-type=\"skeleton\"\n data-testid=\"ds-skeleton-menu-item\"\n role=\"presentation\"\n style={wrapperStyles}\n isActive={isActive}\n getOwnerProps={getOwnerProps}\n {...globalProps}\n {...xstyledProps}\n >\n <StyledContentWrapper
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACyBjB,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { describe, useOwnerProps } from '@elliemae/ds-props-helpers';\nimport { DSSkeleton } from '@elliemae/ds-skeleton';\nimport { StyledGlobalMenuItemWrapper, StyledContentWrapper } from '@elliemae/ds-menu-items-commons';\nimport { type DSMenuItemsSkeletonT, DSMenuItemsSkeletonPropTypesSchema } from './react-desc-prop-types.js';\nimport { useMenuItemsSkeleton } from './config/useMenuItemsSkeleton.js';\nconst gridLayout = ['16px', 'auto'];\n\nconst DSMenuItemsSkeleton: React.ComponentType<DSMenuItemsSkeletonT.Props> = (props) => {\n const { propsWithDefault, globalProps, xstyledProps } = useMenuItemsSkeleton(props);\n const { wrapperStyles, isActive, dsId } = propsWithDefault;\n const { getOwnerProps } = useOwnerProps(props);\n\n return (\n <StyledGlobalMenuItemWrapper\n id={dsId}\n data-type=\"skeleton\"\n data-testid=\"ds-skeleton-menu-item\"\n role=\"presentation\"\n style={wrapperStyles}\n isActive={isActive}\n getOwnerProps={getOwnerProps}\n {...globalProps}\n {...xstyledProps}\n >\n <StyledContentWrapper\n cols={gridLayout}\n minHeight=\"16px\"\n gutter=\"xxs\"\n alignItems=\"center\"\n getOwnerProps={getOwnerProps}\n >\n <DSSkeleton variant=\"rectangular\" width=\"20px\" bg=\"neutral-080\" borderRadius=\"1px\" />\n <DSSkeleton variant=\"rectangular\" width=\"100%\" bg=\"neutral-080\" borderRadius=\"1px\" />\n </StyledContentWrapper>\n </StyledGlobalMenuItemWrapper>\n );\n};\n\n// the component used to not even define this...\nDSMenuItemsSkeleton.displayName = 'DSMenuItemSkeleton';\nconst DSMenuItemsSkeletonWithSchema = describe(DSMenuItemsSkeleton);\nDSMenuItemsSkeletonWithSchema.propTypes = DSMenuItemsSkeletonPropTypesSchema;\n\nexport { DSMenuItemsSkeleton, DSMenuItemsSkeletonWithSchema };\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACyBjB,SAOE,KAPF;AAxBN,SAAS,UAAU,qBAAqB;AACxC,SAAS,kBAAkB;AAC3B,SAAS,6BAA6B,4BAA4B;AAClE,SAAoC,0CAA0C;AAC9E,SAAS,4BAA4B;AACrC,MAAM,aAAa,CAAC,QAAQ,MAAM;AAElC,MAAM,sBAAuE,CAAC,UAAU;AACtF,QAAM,EAAE,kBAAkB,aAAa,aAAa,IAAI,qBAAqB,KAAK;AAClF,QAAM,EAAE,eAAe,UAAU,KAAK,IAAI;AAC1C,QAAM,EAAE,cAAc,IAAI,cAAc,KAAK;AAE7C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,IAAI;AAAA,MACJ,aAAU;AAAA,MACV,eAAY;AAAA,MACZ,MAAK;AAAA,MACL,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACC,GAAG;AAAA,MACH,GAAG;AAAA,MAEJ;AAAA,QAAC;AAAA;AAAA,UACC,MAAM;AAAA,UACN,WAAU;AAAA,UACV,QAAO;AAAA,UACP,YAAW;AAAA,UACX;AAAA,UAEA;AAAA,gCAAC,cAAW,SAAQ,eAAc,OAAM,QAAO,IAAG,eAAc,cAAa,OAAM;AAAA,YACnF,oBAAC,cAAW,SAAQ,eAAc,OAAM,QAAO,IAAG,eAAc,cAAa,OAAM;AAAA;AAAA;AAAA,MACrF;AAAA;AAAA,EACF;AAEJ;AAGA,oBAAoB,cAAc;AAClC,MAAM,gCAAgC,SAAS,mBAAmB;AAClE,8BAA8B,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/react-desc-prop-types.ts"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-duplicate-type-constituents */\n
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACGvB,SAAS,WAAW,2BAA2B,wBAAwB;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-duplicate-type-constituents */\n\nimport type { GlobalAttributesT, XstyledProps, DSPropTypesSchema } from '@elliemae/ds-props-helpers';\nimport { PropTypes, globalAttributesPropTypes, xstyledPropTypes } from '@elliemae/ds-props-helpers';\nimport { type DSMenuItemsCommonsT } from '@elliemae/ds-menu-items-commons';\nimport type { WeakValidationMap } from 'react';\n\nexport declare namespace DSMenuItemsSkeletonT {\n /** *****************************************************************************************\n ******************************** IMPORTANT DISCLAIMER *************************************\n *******************************************************************************************\n This component violates `common.RequiredProps` because\n - it does not have a 'render' prop\n - it does not have an 'original' prop\n - it does not have an 'innerRef' prop\n - it does not have any \"schema\" validator\n\n Legacy was not supporting global attributes but during the refactor I added them.\n It was not merging \"default\" props either, but I added them as well. (only for wrapperStyles)\n Those changes should be 100% backward compatible.\n \n I am reflecting what the code is actually doing instead of what we \"meant\" to do.\n ***************************************************************************************** */\n\n // sections can not be \"selected\" nor activated and for this reason we never had an hard requirement for the dsId\n // this may not scale well but to avoid breaking changes we are keeping it this way, if we ever need to add it we will do a V2\n\n // typescript inheritance has no syntax support for \"interfaces\", we have to use union types instead...\n export type RequiredProps = DSMenuItemsCommonsT.RequiredProps;\n\n export type DefaultProps = {\n wrapperStyles?: DSMenuItemsCommonsT.DefaultProps['wrapperStyles'];\n };\n\n export type OptionalProps = {\n isActive?: boolean;\n };\n\n export interface Props\n extends\n Partial<DefaultProps>,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps | keyof XstyledProps>,\n XstyledProps,\n RequiredProps {}\n\n export interface InternalProps\n extends\n DefaultProps,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps | keyof XstyledProps>,\n XstyledProps,\n RequiredProps {}\n}\n\nexport const defaultProps: DSMenuItemsSkeletonT.DefaultProps = {\n wrapperStyles: {},\n};\n\nexport const DSMenuItemsSkeletonPropTypes: DSPropTypesSchema<DSMenuItemsSkeletonT.InternalProps> = {\n // each single menu-item is in charge of spreading the GlobalAttributesT & XstyledProps\n // they are NOT inherited from a common element from ds-menu-items-commons\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n dsId: PropTypes.string.description(\n 'This is used as \"id\" in the DOM, you need this to be able to make this A11Y accessible.',\n ).isRequired,\n isActive: PropTypes.bool.description('Whether the menu item is active.'),\n wrapperStyles: PropTypes.object.description('The styles to apply to the wrapper element, if any.'),\n};\n\nexport const DSMenuItemsSkeletonPropTypesSchema =\n DSMenuItemsSkeletonPropTypes as unknown as WeakValidationMap<DSMenuItemsSkeletonT.Props>;\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACGvB,SAAS,WAAW,2BAA2B,wBAAwB;AAoDhE,MAAM,eAAkD;AAAA,EAC7D,eAAe,CAAC;AAClB;AAEO,MAAM,+BAAsF;AAAA;AAAA;AAAA,EAGjG,GAAG;AAAA,EACH,GAAG;AAAA,EACH,MAAM,UAAU,OAAO;AAAA,IACrB;AAAA,EACF,EAAE;AAAA,EACF,UAAU,UAAU,KAAK,YAAY,kCAAkC;AAAA,EACvE,eAAe,UAAU,OAAO,YAAY,qDAAqD;AACnG;AAEO,MAAM,qCACX;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { jsx } from "react/jsx-runtime";
|
|
3
|
+
import { DSMenuItemsSkeleton } from "../DSMenuItemsSkeleton";
|
|
4
|
+
const testRequiredProps = {
|
|
5
|
+
dsId: "skeleton-0"
|
|
6
|
+
};
|
|
7
|
+
const testOptionalProps = {
|
|
8
|
+
isActive: false
|
|
9
|
+
};
|
|
10
|
+
const testPartialDefaults = {
|
|
11
|
+
wrapperStyles: { width: "100%" }
|
|
12
|
+
};
|
|
13
|
+
const testProps = {
|
|
14
|
+
...testRequiredProps,
|
|
15
|
+
...testOptionalProps,
|
|
16
|
+
...testPartialDefaults
|
|
17
|
+
};
|
|
18
|
+
const testInternalProps = {
|
|
19
|
+
dsId: "skeleton-0",
|
|
20
|
+
wrapperStyles: {}
|
|
21
|
+
};
|
|
22
|
+
const validMinimum = /* @__PURE__ */ jsx(DSMenuItemsSkeleton, { dsId: "skeleton-0" });
|
|
23
|
+
const validActive = /* @__PURE__ */ jsx(DSMenuItemsSkeleton, { dsId: "skeleton-0", isActive: true });
|
|
24
|
+
const validWithStyles = /* @__PURE__ */ jsx(DSMenuItemsSkeleton, { dsId: "skeleton-0", wrapperStyles: { width: "100%" } });
|
|
25
|
+
const validWithAriaLabel = /* @__PURE__ */ jsx(DSMenuItemsSkeleton, { dsId: "skeleton-0", "aria-label": "loading option" });
|
|
26
|
+
//# sourceMappingURL=typescript-menu-items-skeleton-valid.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/typescript-testing/typescript-menu-items-skeleton-valid.tsx"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-unused-vars, no-unused-vars */\n/* eslint-disable local-rules/custom-rule */\nimport { DSMenuItemsSkeleton } from '../DSMenuItemsSkeleton';\nimport type { DSMenuItemsSkeletonT } from '../react-desc-prop-types';\n\ntype ComponentPropsForApp = DSMenuItemsSkeletonT.Props;\ntype ComponentPropsInternals = DSMenuItemsSkeletonT.InternalProps;\ntype ComponentPropsDefaultProps = DSMenuItemsSkeletonT.DefaultProps;\ntype ComponentPropsOptionalProps = DSMenuItemsSkeletonT.OptionalProps;\ntype ComponentPropsRequiredProps = DSMenuItemsSkeletonT.RequiredProps;\n\nconst testRequiredProps: ComponentPropsRequiredProps = {\n dsId: 'skeleton-0',\n};\n\nconst testOptionalProps: ComponentPropsOptionalProps = {\n isActive: false,\n};\n\nconst testPartialDefaults: Partial<ComponentPropsDefaultProps> = {\n wrapperStyles: { width: '100%' },\n};\n\nconst testProps: ComponentPropsForApp = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testPartialDefaults,\n};\n\nconst testInternalProps: ComponentPropsInternals = {\n dsId: 'skeleton-0',\n wrapperStyles: {},\n};\n\n/**\n * Compile-time renders \u2014 pure type checking, never executed. If any of these\n * fail to typecheck, the component's public Props contract has drifted from\n * what the namespace claims.\n */\nconst validMinimum = <DSMenuItemsSkeleton dsId=\"skeleton-0\" />;\nconst validActive = <DSMenuItemsSkeleton dsId=\"skeleton-0\" isActive />;\nconst validWithStyles = <DSMenuItemsSkeleton dsId=\"skeleton-0\" wrapperStyles={{ width: '100%' }} />;\nconst validWithAriaLabel = <DSMenuItemsSkeleton dsId=\"skeleton-0\" aria-label=\"loading option\" />;\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACuCF;AArCrB,SAAS,2BAA2B;AASpC,MAAM,oBAAiD;AAAA,EACrD,MAAM;AACR;AAEA,MAAM,oBAAiD;AAAA,EACrD,UAAU;AACZ;AAEA,MAAM,sBAA2D;AAAA,EAC/D,eAAe,EAAE,OAAO,OAAO;AACjC;AAEA,MAAM,YAAkC;AAAA,EACtC,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AAEA,MAAM,oBAA6C;AAAA,EACjD,MAAM;AAAA,EACN,eAAe,CAAC;AAClB;AAOA,MAAM,eAAe,oBAAC,uBAAoB,MAAK,cAAa;AAC5D,MAAM,cAAc,oBAAC,uBAAoB,MAAK,cAAa,UAAQ,MAAC;AACpE,MAAM,kBAAkB,oBAAC,uBAAoB,MAAK,cAAa,eAAe,EAAE,OAAO,OAAO,GAAG;AACjG,MAAM,qBAAqB,oBAAC,uBAAoB,MAAK,cAAa,cAAW,kBAAiB;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-menu-items-skeleton",
|
|
3
|
-
"version": "3.70.0-next.
|
|
3
|
+
"version": "3.70.0-next.70",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Menu Items Skeleton",
|
|
6
6
|
"files": [
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
],
|
|
23
23
|
"repository": {
|
|
24
24
|
"type": "git",
|
|
25
|
-
"url": "https://
|
|
25
|
+
"url": "https://github.com/intcx/PLATFORM-UI.dimsum.git"
|
|
26
26
|
},
|
|
27
27
|
"engines": {
|
|
28
28
|
"pnpm": ">=9",
|
|
@@ -36,24 +36,25 @@
|
|
|
36
36
|
"indent": 4
|
|
37
37
|
},
|
|
38
38
|
"dependencies": {
|
|
39
|
-
"@elliemae/ds-menu-items-commons": "3.70.0-next.
|
|
40
|
-
"@elliemae/ds-
|
|
41
|
-
"@elliemae/ds-
|
|
39
|
+
"@elliemae/ds-menu-items-commons": "3.70.0-next.70",
|
|
40
|
+
"@elliemae/ds-props-helpers": "3.70.0-next.70",
|
|
41
|
+
"@elliemae/ds-skeleton": "3.70.0-next.70"
|
|
42
42
|
},
|
|
43
43
|
"devDependencies": {
|
|
44
44
|
"jest": "^30.0.0",
|
|
45
|
-
"lodash-es": "^4.
|
|
46
|
-
"styled-components": "~5.3.
|
|
47
|
-
"@elliemae/ds-
|
|
45
|
+
"lodash-es": "^4.18.1",
|
|
46
|
+
"styled-components": "~5.3.11",
|
|
47
|
+
"@elliemae/ds-test-utils": "3.70.0-next.70",
|
|
48
|
+
"@elliemae/ds-monorepo-devops": "3.70.0-next.70"
|
|
48
49
|
},
|
|
49
50
|
"peerDependencies": {
|
|
50
51
|
"@testing-library/jest-dom": "^6.6.3",
|
|
51
52
|
"@testing-library/react": "^16.0.1",
|
|
52
53
|
"@testing-library/user-event": "~14.6.1",
|
|
53
|
-
"lodash-es": "^4.
|
|
54
|
+
"lodash-es": "^4.18.1",
|
|
54
55
|
"react": "^18.3.1",
|
|
55
56
|
"react-dom": "^18.3.1",
|
|
56
|
-
"styled-components": "~5.3.
|
|
57
|
+
"styled-components": "~5.3.11"
|
|
57
58
|
},
|
|
58
59
|
"publishConfig": {
|
|
59
60
|
"access": "public",
|
|
@@ -68,4 +69,4 @@
|
|
|
68
69
|
"build": "cross-env NODE_ENV=production node ../../../scripts/build/build.mjs",
|
|
69
70
|
"checkDeps": "npx -yes ../../util/ds-codemods check-missing-packages --projectFolderPath=\"./\" --ignorePackagesGlobPattern=\"\" --ignoreFilesGlobPattern=\"**/test-ables/*,**/tests/*\""
|
|
70
71
|
}
|
|
71
|
-
}
|
|
72
|
+
}
|