@elliemae/ds-side-panel-header 3.37.2 → 3.38.0-rc.0
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/SidePanelHeader.js.map +2 -2
- package/dist/cjs/SidePanelHeaderDefinitions.js.map +2 -2
- package/dist/cjs/index.js +12 -4
- package/dist/cjs/index.js.map +2 -2
- package/dist/cjs/react-desc-prop-types.js +2 -0
- package/dist/cjs/react-desc-prop-types.js.map +2 -2
- package/dist/cjs/typescript-testing/typescript-side-panel-header-valid.js +95 -0
- package/dist/cjs/typescript-testing/typescript-side-panel-header-valid.js.map +7 -0
- package/dist/esm/SidePanelHeader.js.map +2 -2
- package/dist/esm/SidePanelHeaderDefinitions.js.map +2 -2
- package/dist/esm/index.js +8 -3
- package/dist/esm/index.js.map +2 -2
- package/dist/esm/react-desc-prop-types.js +4 -1
- package/dist/esm/react-desc-prop-types.js.map +2 -2
- package/dist/esm/typescript-testing/typescript-side-panel-header-valid.js +72 -0
- package/dist/esm/typescript-testing/typescript-side-panel-header-valid.js.map +7 -0
- package/dist/types/index.d.ts +3 -3
- package/dist/types/react-desc-prop-types.d.ts +4 -3
- package/dist/types/typescript-testing/typescript-side-panel-header-valid.d.ts +1 -0
- package/package.json +8 -8
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/SidePanelHeader.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React, { useCallback } from 'react';\nimport {\n describe,\n useMemoMergePropsWithDefault,\n useGetGlobalAttributes,\n useGetXstyledProps,\n} from '@elliemae/ds-props-helpers';\nimport { CloseSmall } from '@elliemae/ds-icons';\nimport { type DSGridT, Grid } from '@elliemae/ds-grid';\nimport { type DSSidePanelHeaderT, defaultProps, propTypes } from './react-desc-prop-types.js';\n\nconst noop = () => {};\n\nimport { StyledSeparatorWrapper, StyledSeparator, StyledTitle, Wrapper, StyledCloseButton } from './styled.js';\nconst SidePanelHeader = (props: DSSidePanelHeaderT.Props) => {\n const propsWithDefaults = useMemoMergePropsWithDefault<DSSidePanelHeaderT.InternalProps>(props, defaultProps);\n\n const globalAttributes = useGetGlobalAttributes<DSSidePanelHeaderT.InternalProps, HTMLDivElement, DSGridT.Props>(\n propsWithDefaults,\n );\n const xStyledProps = useGetXstyledProps(propsWithDefaults);\n\n const getOwnerProps = useCallback(() => propsWithDefaults, [propsWithDefaults]);\n const getOwnerPropsArguments = useCallback(() => ({}), []);\n const { title, additionalAction, onClose = noop, showClose = true, closeButtonRef = undefined } = propsWithDefaults;\n const separator = (\n <StyledSeparatorWrapper>\n <StyledSeparator getOwnerProps={getOwnerProps} getOwnerPropsArguments={getOwnerPropsArguments} />\n </StyledSeparatorWrapper>\n );\n const cols = ['1fr', 'auto', 'auto'];\n return (\n <Wrapper cols={cols} alignItems=\"flex-start\" width=\"100%\" {...globalAttributes} {...xStyledProps}>\n <StyledTitle\n maxWidth=\"100%\"\n alignItems=\"center\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {title}\n </StyledTitle>\n <Grid ml=\"xxs\" cols={additionalAction ? ['auto', 'auto', 'auto'] : ['auto']}>\n {additionalAction && <Grid>{additionalAction}</Grid>}\n {additionalAction && showClose && separator}\n <Grid>\n {showClose && (\n <StyledCloseButton\n buttonType=\"icon\"\n innerRef={closeButtonRef}\n size=\"m\"\n onClick={onClose}\n data-testid=\"btn-close-slide-panel\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <CloseSmall />\n </StyledCloseButton>\n )}\n </Grid>\n </Grid>\n </Wrapper>\n );\n};\n\nSidePanelHeader.displayName = 'SidePanelHeader';\nconst DSSidePanelHeaderWithSchema = describe(SidePanelHeader);\n\nDSSidePanelHeaderWithSchema.propTypes = propTypes;\n\nexport { SidePanelHeader, DSSidePanelHeaderWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
4
|
+
"sourcesContent": ["import React, { useCallback } from 'react';\nimport {\n describe,\n useMemoMergePropsWithDefault,\n useGetGlobalAttributes,\n useGetXstyledProps,\n} from '@elliemae/ds-props-helpers';\nimport { CloseSmall } from '@elliemae/ds-icons';\nimport { type DSGridT, Grid } from '@elliemae/ds-grid';\nimport { type DSSidePanelHeaderT, defaultProps, propTypes } from './react-desc-prop-types.js';\n\nconst noop = () => {};\n\nimport { StyledSeparatorWrapper, StyledSeparator, StyledTitle, Wrapper, StyledCloseButton } from './styled.js';\n\nconst SidePanelHeader = (props: DSSidePanelHeaderT.Props) => {\n const propsWithDefaults = useMemoMergePropsWithDefault<DSSidePanelHeaderT.InternalProps>(props, defaultProps);\n\n const globalAttributes = useGetGlobalAttributes<DSSidePanelHeaderT.InternalProps, HTMLDivElement, DSGridT.Props>(\n propsWithDefaults,\n );\n const xStyledProps = useGetXstyledProps(propsWithDefaults);\n\n const getOwnerProps = useCallback(() => propsWithDefaults, [propsWithDefaults]);\n const getOwnerPropsArguments = useCallback(() => ({}), []);\n const { title, additionalAction, onClose = noop, showClose = true, closeButtonRef = undefined } = propsWithDefaults;\n const separator = (\n <StyledSeparatorWrapper>\n <StyledSeparator getOwnerProps={getOwnerProps} getOwnerPropsArguments={getOwnerPropsArguments} />\n </StyledSeparatorWrapper>\n );\n const cols = ['1fr', 'auto', 'auto'];\n return (\n <Wrapper cols={cols} alignItems=\"flex-start\" width=\"100%\" {...globalAttributes} {...xStyledProps}>\n <StyledTitle\n maxWidth=\"100%\"\n alignItems=\"center\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {title}\n </StyledTitle>\n <Grid ml=\"xxs\" cols={additionalAction ? ['auto', 'auto', 'auto'] : ['auto']}>\n {additionalAction && <Grid>{additionalAction}</Grid>}\n {additionalAction && showClose && separator}\n <Grid>\n {showClose && (\n <StyledCloseButton\n buttonType=\"icon\"\n innerRef={closeButtonRef}\n size=\"m\"\n onClick={onClose}\n data-testid=\"btn-close-slide-panel\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <CloseSmall />\n </StyledCloseButton>\n )}\n </Grid>\n </Grid>\n </Wrapper>\n );\n};\n\nSidePanelHeader.displayName = 'SidePanelHeader';\nconst DSSidePanelHeaderWithSchema = describe(SidePanelHeader);\n\nDSSidePanelHeaderWithSchema.propTypes = propTypes;\n\nexport { SidePanelHeader, DSSidePanelHeaderWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD4BjB;AA5BN,mBAAmC;AACnC,8BAKO;AACP,sBAA2B;AAC3B,qBAAmC;AACnC,mCAAiE;AAIjE,oBAAiG;AAFjG,MAAM,OAAO,MAAM;AAAC;AAIpB,MAAM,kBAAkB,CAAC,UAAoC;AAC3D,QAAM,wBAAoB,sDAA+D,OAAO,yCAAY;AAE5G,QAAM,uBAAmB;AAAA,IACvB;AAAA,EACF;AACA,QAAM,mBAAe,4CAAmB,iBAAiB;AAEzD,QAAM,oBAAgB,0BAAY,MAAM,mBAAmB,CAAC,iBAAiB,CAAC;AAC9E,QAAM,6BAAyB,0BAAY,OAAO,CAAC,IAAI,CAAC,CAAC;AACzD,QAAM,EAAE,OAAO,kBAAkB,UAAU,MAAM,YAAY,MAAM,iBAAiB,OAAU,IAAI;AAClG,QAAM,YACJ,4CAAC,wCACC,sDAAC,iCAAgB,eAA8B,wBAAgD,GACjG;AAEF,QAAM,OAAO,CAAC,OAAO,QAAQ,MAAM;AACnC,SACE,6CAAC,yBAAQ,MAAY,YAAW,cAAa,OAAM,QAAQ,GAAG,kBAAmB,GAAG,cAClF;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,UAAS;AAAA,QACT,YAAW;AAAA,QACX;AAAA,QACA;AAAA,QAEC;AAAA;AAAA,IACH;AAAA,IACA,6CAAC,uBAAK,IAAG,OAAM,MAAM,mBAAmB,CAAC,QAAQ,QAAQ,MAAM,IAAI,CAAC,MAAM,GACvE;AAAA,0BAAoB,4CAAC,uBAAM,4BAAiB;AAAA,MAC5C,oBAAoB,aAAa;AAAA,MAClC,4CAAC,uBACE,uBACC;AAAA,QAAC;AAAA;AAAA,UACC,YAAW;AAAA,UACX,UAAU;AAAA,UACV,MAAK;AAAA,UACL,SAAS;AAAA,UACT,eAAY;AAAA,UACZ;AAAA,UACA;AAAA,UAEA,sDAAC,8BAAW;AAAA;AAAA,MACd,GAEJ;AAAA,OACF;AAAA,KACF;AAEJ;AAEA,gBAAgB,cAAc;AAC9B,MAAM,kCAA8B,kCAAS,eAAe;AAE5D,4BAA4B,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/SidePanelHeaderDefinitions.ts", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import { slotObjectToDataTestIds } from '@elliemae/ds-system';\n\nexport const DSSidePanelHeaderName = 'DSSidePanelHeader' as const;\nexport const DSSidePanelHeaderSlots = {\n CLOSE_BUTTON: 'close-button',\n TITLE: 'title',\n WRAPPER: 'wrapper',\n SEPARATOR: 'separator',\n};\n\nexport const DSSidePanelHeaderDataTestIds = {\n ...slotObjectToDataTestIds(DSSidePanelHeaderName, DSSidePanelHeaderSlots),\n CLOSE_BUTTON: 'btn-close-slide-panel',\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAwC;AAEjC,MAAM,wBAAwB;
|
|
4
|
+
"sourcesContent": ["import { slotObjectToDataTestIds } from '@elliemae/ds-system';\n\nexport const DSSidePanelHeaderName = 'DSSidePanelHeader' as const;\n\nexport const DSSidePanelHeaderSlots = {\n CLOSE_BUTTON: 'close-button',\n TITLE: 'title',\n WRAPPER: 'wrapper',\n SEPARATOR: 'separator',\n};\n\nexport const DSSidePanelHeaderDataTestIds = {\n ...slotObjectToDataTestIds(DSSidePanelHeaderName, DSSidePanelHeaderSlots),\n CLOSE_BUTTON: 'btn-close-slide-panel',\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAwC;AAEjC,MAAM,wBAAwB;AAE9B,MAAM,yBAAyB;AAAA,EACpC,cAAc;AAAA,EACd,OAAO;AAAA,EACP,SAAS;AAAA,EACT,WAAW;AACb;AAEO,MAAM,+BAA+B;AAAA,EAC1C,OAAG,0CAAwB,uBAAuB,sBAAsB;AAAA,EACxE,cAAc;AAChB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/index.js
CHANGED
|
@@ -5,6 +5,10 @@ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
|
5
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
6
|
var __getProtoOf = Object.getPrototypeOf;
|
|
7
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
|
+
};
|
|
8
12
|
var __copyProps = (to, from, except, desc) => {
|
|
9
13
|
if (from && typeof from === "object" || typeof from === "function") {
|
|
10
14
|
for (let key of __getOwnPropNames(from))
|
|
@@ -13,7 +17,6 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
13
17
|
}
|
|
14
18
|
return to;
|
|
15
19
|
};
|
|
16
|
-
var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
|
|
17
20
|
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
18
21
|
// If the importer is in node compatibility mode or this is not an ESM
|
|
19
22
|
// file that has been converted to a CommonJS file using a Babel-
|
|
@@ -24,9 +27,14 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
|
|
|
24
27
|
));
|
|
25
28
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
26
29
|
var src_exports = {};
|
|
30
|
+
__export(src_exports, {
|
|
31
|
+
DSSidePanelHeaderDataTestIds: () => import_SidePanelHeaderDefinitions.DSSidePanelHeaderDataTestIds,
|
|
32
|
+
DSSidePanelHeaderSlots: () => import_SidePanelHeaderDefinitions.DSSidePanelHeaderSlots,
|
|
33
|
+
DSSidePanelHeaderWithSchema: () => import_SidePanelHeader.DSSidePanelHeaderWithSchema,
|
|
34
|
+
SidePanelHeader: () => import_SidePanelHeader.SidePanelHeader
|
|
35
|
+
});
|
|
27
36
|
module.exports = __toCommonJS(src_exports);
|
|
28
37
|
var React = __toESM(require("react"));
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
__reExport(src_exports, require("./SidePanelHeaderDefinitions.js"), module.exports);
|
|
38
|
+
var import_SidePanelHeader = require("./SidePanelHeader.js");
|
|
39
|
+
var import_SidePanelHeaderDefinitions = require("./SidePanelHeaderDefinitions.js");
|
|
32
40
|
//# sourceMappingURL=index.js.map
|
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": "
|
|
4
|
+
"sourcesContent": ["// this is a workaround to typescript error TS2742\n// https://github.com/microsoft/TypeScript/issues/47663\nimport {} from '@xstyled/system';\nimport {} from '@xstyled/util';\n\nexport { SidePanelHeader, DSSidePanelHeaderWithSchema } from './SidePanelHeader.js';\nexport type { DSSidePanelHeaderT } from './react-desc-prop-types.js';\nexport { DSSidePanelHeaderSlots, DSSidePanelHeaderDataTestIds } from './SidePanelHeaderDefinitions.js';\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADKvB,6BAA6D;AAE7D,wCAAqE;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -35,6 +35,7 @@ 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
37
|
var import_ds_props_helpers2 = require("@elliemae/ds-props-helpers");
|
|
38
|
+
var import_SidePanelHeaderDefinitions = require("./SidePanelHeaderDefinitions.js");
|
|
38
39
|
const defaultProps = {
|
|
39
40
|
onClose: () => {
|
|
40
41
|
},
|
|
@@ -43,6 +44,7 @@ const defaultProps = {
|
|
|
43
44
|
const propTypes = {
|
|
44
45
|
...import_ds_props_helpers.globalAttributesPropTypes,
|
|
45
46
|
...import_ds_props_helpers.xstyledPropTypes,
|
|
47
|
+
...(0, import_ds_props_helpers.getPropsPerSlotPropTypes)(import_SidePanelHeaderDefinitions.DSSidePanelHeaderName, import_SidePanelHeaderDefinitions.DSSidePanelHeaderSlots),
|
|
46
48
|
/** Page title */
|
|
47
49
|
title: import_ds_props_helpers2.PropTypes.string.description("Page title"),
|
|
48
50
|
/** Action button */
|
|
@@ -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": ["import type
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
4
|
+
"sourcesContent": ["import type React from 'react';\nimport {\n type GlobalAttributesT,\n type XstyledProps,\n globalAttributesPropTypes,\n xstyledPropTypes,\n type ValidationMap,\n getPropsPerSlotPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport { PropTypes } from '@elliemae/ds-props-helpers';\nimport { DSSidePanelHeaderName, DSSidePanelHeaderSlots } from './SidePanelHeaderDefinitions.js';\n\nexport declare namespace DSSidePanelHeaderT {\n export interface RequiredProps {}\n\n export interface DefaultProps {\n onClose: () => void;\n showClose: boolean;\n }\n\n export interface OptionalProps {\n title?: string;\n additionalAction?: React.ReactNode;\n closeButtonRef?: React.RefObject<HTMLButtonElement>;\n }\n\n export interface Props\n extends Partial<DefaultProps>,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps>,\n XstyledProps {}\n\n export interface InternalProps\n extends DefaultProps,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps>,\n XstyledProps {}\n}\n\nexport const defaultProps: DSSidePanelHeaderT.DefaultProps = {\n onClose: () => {},\n showClose: true,\n};\n\nexport const propTypes = {\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n ...getPropsPerSlotPropTypes(DSSidePanelHeaderName, DSSidePanelHeaderSlots),\n /** Page title */\n title: PropTypes.string.description('Page title'),\n /** Action button */\n additionalAction: PropTypes.element.description('Action button'),\n /** Called when the slide collapse */\n onClose: PropTypes.func.description('Called when the slide collapse').defaultValue(defaultProps.onClose),\n /** Show/Hide close button */\n showClose: PropTypes.bool.description('Show/Hide close button').defaultValue(defaultProps.showClose),\n /** Ref for close button */\n closeButtonRef: PropTypes.object.description('Ref for close button'),\n} as unknown as ValidationMap<DSSidePanelHeaderT.Props>;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,8BAOO;AACP,IAAAA,2BAA0B;AAC1B,wCAA8D;AA6BvD,MAAM,eAAgD;AAAA,EAC3D,SAAS,MAAM;AAAA,EAAC;AAAA,EAChB,WAAW;AACb;AAEO,MAAM,YAAY;AAAA,EACvB,GAAG;AAAA,EACH,GAAG;AAAA,EACH,OAAG,kDAAyB,yDAAuB,wDAAsB;AAAA;AAAA,EAEzE,OAAO,mCAAU,OAAO,YAAY,YAAY;AAAA;AAAA,EAEhD,kBAAkB,mCAAU,QAAQ,YAAY,eAAe;AAAA;AAAA,EAE/D,SAAS,mCAAU,KAAK,YAAY,gCAAgC,EAAE,aAAa,aAAa,OAAO;AAAA;AAAA,EAEvG,WAAW,mCAAU,KAAK,YAAY,wBAAwB,EAAE,aAAa,aAAa,SAAS;AAAA;AAAA,EAEnG,gBAAgB,mCAAU,OAAO,YAAY,sBAAsB;AACrE;",
|
|
6
6
|
"names": ["import_ds_props_helpers"]
|
|
7
7
|
}
|
|
@@ -0,0 +1,95 @@
|
|
|
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_react = __toESM(require("react"));
|
|
27
|
+
var import__ = require("../index.js");
|
|
28
|
+
const MockComponent = () => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {});
|
|
29
|
+
const ref = import_react.default.createRef();
|
|
30
|
+
const testRequiredProps = {};
|
|
31
|
+
const testOptionalProps = {
|
|
32
|
+
title: "",
|
|
33
|
+
additionalAction: MockComponent(),
|
|
34
|
+
closeButtonRef: ref
|
|
35
|
+
};
|
|
36
|
+
const testPartialDefaults = {
|
|
37
|
+
showClose: false
|
|
38
|
+
};
|
|
39
|
+
const testProps = {
|
|
40
|
+
...testRequiredProps,
|
|
41
|
+
...testOptionalProps,
|
|
42
|
+
...testPartialDefaults
|
|
43
|
+
};
|
|
44
|
+
const testPropsAsSyntax = {
|
|
45
|
+
...testRequiredProps,
|
|
46
|
+
...testOptionalProps,
|
|
47
|
+
...testPartialDefaults
|
|
48
|
+
};
|
|
49
|
+
const testCompleteDefaults = {
|
|
50
|
+
onClose: () => {
|
|
51
|
+
},
|
|
52
|
+
showClose: true
|
|
53
|
+
};
|
|
54
|
+
const testInternalProps = {
|
|
55
|
+
...testRequiredProps,
|
|
56
|
+
...testOptionalProps,
|
|
57
|
+
...testCompleteDefaults
|
|
58
|
+
};
|
|
59
|
+
const testInternalPropsAsSyntax = {
|
|
60
|
+
...testRequiredProps,
|
|
61
|
+
...testOptionalProps,
|
|
62
|
+
...testCompleteDefaults
|
|
63
|
+
};
|
|
64
|
+
const testExplicitDefinition = {
|
|
65
|
+
onClose: () => {
|
|
66
|
+
},
|
|
67
|
+
showClose: true,
|
|
68
|
+
title: "",
|
|
69
|
+
additionalAction: MockComponent(),
|
|
70
|
+
closeButtonRef: ref
|
|
71
|
+
};
|
|
72
|
+
const testInferedTypeCompatibility = {
|
|
73
|
+
onClose: () => {
|
|
74
|
+
},
|
|
75
|
+
showClose: true,
|
|
76
|
+
title: "",
|
|
77
|
+
additionalAction: MockComponent(),
|
|
78
|
+
closeButtonRef: ref
|
|
79
|
+
};
|
|
80
|
+
const testDefinitionAsConst = {
|
|
81
|
+
onClose: () => {
|
|
82
|
+
},
|
|
83
|
+
showClose: true,
|
|
84
|
+
title: "",
|
|
85
|
+
additionalAction: MockComponent(),
|
|
86
|
+
closeButtonRef: ref
|
|
87
|
+
};
|
|
88
|
+
const ExampleUsageComponent = () => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
|
|
89
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.SidePanelHeader, { ...testExplicitDefinition }),
|
|
90
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.SidePanelHeader, { ...testInferedTypeCompatibility }),
|
|
91
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.SidePanelHeader, { ...testDefinitionAsConst }),
|
|
92
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.SidePanelHeader, { onClose: () => {
|
|
93
|
+
}, showClose: true, title: "", additionalAction: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MockComponent, {}), closeButtonRef: ref })
|
|
94
|
+
] });
|
|
95
|
+
//# sourceMappingURL=typescript-side-panel-header-valid.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/typescript-testing/typescript-side-panel-header-valid.tsx"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-unused-vars, no-unused-vars */\nimport React from 'react';\nimport { SidePanelHeader } from '../index.js';\nimport type { DSSidePanelHeaderT } from '../index.js';\n\n// test we expose the namespace and the namespace follows our deliverable conventions\ntype ComponentPropsForApp = DSSidePanelHeaderT.Props;\ntype ComponentPropsInternals = DSSidePanelHeaderT.InternalProps;\ntype ComponentPropsDefaultProps = DSSidePanelHeaderT.DefaultProps;\ntype ComponentPropsOptionalProps = DSSidePanelHeaderT.OptionalProps;\ntype ComponentPropsRequiredProps = DSSidePanelHeaderT.RequiredProps;\n\nconst MockComponent = () => <div></div>;\nconst ref = React.createRef<HTMLButtonElement>();\n\nconst testRequiredProps: ComponentPropsRequiredProps = {};\n\nconst testOptionalProps: ComponentPropsOptionalProps = {\n title: '',\n additionalAction: MockComponent(),\n closeButtonRef: ref,\n};\n\n// difference Props and InternalProps is that InternalProps has all the default props filled in\n// Props allows for partial defaults\nconst testPartialDefaults: Partial<ComponentPropsDefaultProps> = {\n showClose: false,\n};\n\nconst testProps: ComponentPropsForApp = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testPartialDefaults,\n};\n\nconst testPropsAsSyntax = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testPartialDefaults,\n} as ComponentPropsForApp;\n\n// InternalProps requires all defaults to be filled in\nconst testCompleteDefaults: Required<ComponentPropsDefaultProps> = {\n onClose: () => {},\n showClose: true,\n};\n\nconst testInternalProps: ComponentPropsInternals = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testCompleteDefaults,\n};\n\nconst testInternalPropsAsSyntax = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testCompleteDefaults,\n} as ComponentPropsInternals;\n\n// using the explicit type definition, if there is an error, it will be marked on the key that is wrong\nconst testExplicitDefinition: ComponentPropsForApp = {\n onClose: () => {},\n showClose: true,\n title: '',\n additionalAction: MockComponent(),\n closeButtonRef: ref,\n};\n\n// using the \"as\" syntax, if there is an error, it will be marking the whole object as wrong because it is not compatible with the type\nconst testInferedTypeCompatibility = {\n onClose: () => {},\n showClose: true,\n title: '',\n additionalAction: MockComponent(),\n closeButtonRef: ref,\n} as ComponentPropsForApp;\n\nconst testDefinitionAsConst = {\n onClose: () => {},\n showClose: true,\n title: '',\n additionalAction: MockComponent(),\n closeButtonRef: ref,\n} as const;\n\nconst ExampleUsageComponent = () => (\n <>\n {/* works with explicitly casted props, all syntaxes */}\n <SidePanelHeader {...testExplicitDefinition} />\n <SidePanelHeader {...testInferedTypeCompatibility} />\n <SidePanelHeader {...testDefinitionAsConst} />\n {/* works with inline values */}\n <SidePanelHeader onClose={() => {}} showClose title=\"\" additionalAction={<MockComponent />} closeButtonRef={ref} />\n </>\n);\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA,YAAuB;ACYK;AAX5B,mBAAkB;AAClB,eAAgC;AAUhC,MAAM,gBAAgB,MAAM,4CAAC,SAAI;AACjC,MAAM,MAAM,aAAAA,QAAM,UAA6B;AAE/C,MAAM,oBAAiD,CAAC;AAExD,MAAM,oBAAiD;AAAA,EACrD,OAAO;AAAA,EACP,kBAAkB,cAAc;AAAA,EAChC,gBAAgB;AAClB;AAIA,MAAM,sBAA2D;AAAA,EAC/D,WAAW;AACb;AAEA,MAAM,YAAkC;AAAA,EACtC,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AAEA,MAAM,oBAAoB;AAAA,EACxB,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AAGA,MAAM,uBAA6D;AAAA,EACjE,SAAS,MAAM;AAAA,EAAC;AAAA,EAChB,WAAW;AACb;AAEA,MAAM,oBAA6C;AAAA,EACjD,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AAEA,MAAM,4BAA4B;AAAA,EAChC,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AAGA,MAAM,yBAA+C;AAAA,EACnD,SAAS,MAAM;AAAA,EAAC;AAAA,EAChB,WAAW;AAAA,EACX,OAAO;AAAA,EACP,kBAAkB,cAAc;AAAA,EAChC,gBAAgB;AAClB;AAGA,MAAM,+BAA+B;AAAA,EACnC,SAAS,MAAM;AAAA,EAAC;AAAA,EAChB,WAAW;AAAA,EACX,OAAO;AAAA,EACP,kBAAkB,cAAc;AAAA,EAChC,gBAAgB;AAClB;AAEA,MAAM,wBAAwB;AAAA,EAC5B,SAAS,MAAM;AAAA,EAAC;AAAA,EAChB,WAAW;AAAA,EACX,OAAO;AAAA,EACP,kBAAkB,cAAc;AAAA,EAChC,gBAAgB;AAClB;AAEA,MAAM,wBAAwB,MAC5B,4EAEE;AAAA,8CAAC,4BAAiB,GAAG,wBAAwB;AAAA,EAC7C,4CAAC,4BAAiB,GAAG,8BAA8B;AAAA,EACnD,4CAAC,4BAAiB,GAAG,uBAAuB;AAAA,EAE5C,4CAAC,4BAAgB,SAAS,MAAM;AAAA,EAAC,GAAG,WAAS,MAAC,OAAM,IAAG,kBAAkB,4CAAC,iBAAc,GAAI,gBAAgB,KAAK;AAAA,GACnH;",
|
|
6
|
+
"names": ["React"]
|
|
7
|
+
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/SidePanelHeader.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useCallback } from 'react';\nimport {\n describe,\n useMemoMergePropsWithDefault,\n useGetGlobalAttributes,\n useGetXstyledProps,\n} from '@elliemae/ds-props-helpers';\nimport { CloseSmall } from '@elliemae/ds-icons';\nimport { type DSGridT, Grid } from '@elliemae/ds-grid';\nimport { type DSSidePanelHeaderT, defaultProps, propTypes } from './react-desc-prop-types.js';\n\nconst noop = () => {};\n\nimport { StyledSeparatorWrapper, StyledSeparator, StyledTitle, Wrapper, StyledCloseButton } from './styled.js';\nconst SidePanelHeader = (props: DSSidePanelHeaderT.Props) => {\n const propsWithDefaults = useMemoMergePropsWithDefault<DSSidePanelHeaderT.InternalProps>(props, defaultProps);\n\n const globalAttributes = useGetGlobalAttributes<DSSidePanelHeaderT.InternalProps, HTMLDivElement, DSGridT.Props>(\n propsWithDefaults,\n );\n const xStyledProps = useGetXstyledProps(propsWithDefaults);\n\n const getOwnerProps = useCallback(() => propsWithDefaults, [propsWithDefaults]);\n const getOwnerPropsArguments = useCallback(() => ({}), []);\n const { title, additionalAction, onClose = noop, showClose = true, closeButtonRef = undefined } = propsWithDefaults;\n const separator = (\n <StyledSeparatorWrapper>\n <StyledSeparator getOwnerProps={getOwnerProps} getOwnerPropsArguments={getOwnerPropsArguments} />\n </StyledSeparatorWrapper>\n );\n const cols = ['1fr', 'auto', 'auto'];\n return (\n <Wrapper cols={cols} alignItems=\"flex-start\" width=\"100%\" {...globalAttributes} {...xStyledProps}>\n <StyledTitle\n maxWidth=\"100%\"\n alignItems=\"center\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {title}\n </StyledTitle>\n <Grid ml=\"xxs\" cols={additionalAction ? ['auto', 'auto', 'auto'] : ['auto']}>\n {additionalAction && <Grid>{additionalAction}</Grid>}\n {additionalAction && showClose && separator}\n <Grid>\n {showClose && (\n <StyledCloseButton\n buttonType=\"icon\"\n innerRef={closeButtonRef}\n size=\"m\"\n onClick={onClose}\n data-testid=\"btn-close-slide-panel\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <CloseSmall />\n </StyledCloseButton>\n )}\n </Grid>\n </Grid>\n </Wrapper>\n );\n};\n\nSidePanelHeader.displayName = 'SidePanelHeader';\nconst DSSidePanelHeaderWithSchema = describe(SidePanelHeader);\n\nDSSidePanelHeaderWithSchema.propTypes = propTypes;\n\nexport { SidePanelHeader, DSSidePanelHeaderWithSchema };\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useCallback } from 'react';\nimport {\n describe,\n useMemoMergePropsWithDefault,\n useGetGlobalAttributes,\n useGetXstyledProps,\n} from '@elliemae/ds-props-helpers';\nimport { CloseSmall } from '@elliemae/ds-icons';\nimport { type DSGridT, Grid } from '@elliemae/ds-grid';\nimport { type DSSidePanelHeaderT, defaultProps, propTypes } from './react-desc-prop-types.js';\n\nconst noop = () => {};\n\nimport { StyledSeparatorWrapper, StyledSeparator, StyledTitle, Wrapper, StyledCloseButton } from './styled.js';\n\nconst SidePanelHeader = (props: DSSidePanelHeaderT.Props) => {\n const propsWithDefaults = useMemoMergePropsWithDefault<DSSidePanelHeaderT.InternalProps>(props, defaultProps);\n\n const globalAttributes = useGetGlobalAttributes<DSSidePanelHeaderT.InternalProps, HTMLDivElement, DSGridT.Props>(\n propsWithDefaults,\n );\n const xStyledProps = useGetXstyledProps(propsWithDefaults);\n\n const getOwnerProps = useCallback(() => propsWithDefaults, [propsWithDefaults]);\n const getOwnerPropsArguments = useCallback(() => ({}), []);\n const { title, additionalAction, onClose = noop, showClose = true, closeButtonRef = undefined } = propsWithDefaults;\n const separator = (\n <StyledSeparatorWrapper>\n <StyledSeparator getOwnerProps={getOwnerProps} getOwnerPropsArguments={getOwnerPropsArguments} />\n </StyledSeparatorWrapper>\n );\n const cols = ['1fr', 'auto', 'auto'];\n return (\n <Wrapper cols={cols} alignItems=\"flex-start\" width=\"100%\" {...globalAttributes} {...xStyledProps}>\n <StyledTitle\n maxWidth=\"100%\"\n alignItems=\"center\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {title}\n </StyledTitle>\n <Grid ml=\"xxs\" cols={additionalAction ? ['auto', 'auto', 'auto'] : ['auto']}>\n {additionalAction && <Grid>{additionalAction}</Grid>}\n {additionalAction && showClose && separator}\n <Grid>\n {showClose && (\n <StyledCloseButton\n buttonType=\"icon\"\n innerRef={closeButtonRef}\n size=\"m\"\n onClick={onClose}\n data-testid=\"btn-close-slide-panel\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <CloseSmall />\n </StyledCloseButton>\n )}\n </Grid>\n </Grid>\n </Wrapper>\n );\n};\n\nSidePanelHeader.displayName = 'SidePanelHeader';\nconst DSSidePanelHeaderWithSchema = describe(SidePanelHeader);\n\nDSSidePanelHeaderWithSchema.propTypes = propTypes;\n\nexport { SidePanelHeader, DSSidePanelHeaderWithSchema };\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;AC4BjB,cAcA,YAdA;AA5BN,SAAgB,mBAAmB;AACnC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,kBAAkB;AAC3B,SAAuB,YAAY;AACnC,SAAkC,cAAc,iBAAiB;AAEjE,MAAM,OAAO,MAAM;AAAC;AAEpB,SAAS,wBAAwB,iBAAiB,aAAa,SAAS,yBAAyB;AAEjG,MAAM,kBAAkB,CAAC,UAAoC;AAC3D,QAAM,oBAAoB,6BAA+D,OAAO,YAAY;AAE5G,QAAM,mBAAmB;AAAA,IACvB;AAAA,EACF;AACA,QAAM,eAAe,mBAAmB,iBAAiB;AAEzD,QAAM,gBAAgB,YAAY,MAAM,mBAAmB,CAAC,iBAAiB,CAAC;AAC9E,QAAM,yBAAyB,YAAY,OAAO,CAAC,IAAI,CAAC,CAAC;AACzD,QAAM,EAAE,OAAO,kBAAkB,UAAU,MAAM,YAAY,MAAM,iBAAiB,OAAU,IAAI;AAClG,QAAM,YACJ,oBAAC,0BACC,8BAAC,mBAAgB,eAA8B,wBAAgD,GACjG;AAEF,QAAM,OAAO,CAAC,OAAO,QAAQ,MAAM;AACnC,SACE,qBAAC,WAAQ,MAAY,YAAW,cAAa,OAAM,QAAQ,GAAG,kBAAmB,GAAG,cAClF;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,UAAS;AAAA,QACT,YAAW;AAAA,QACX;AAAA,QACA;AAAA,QAEC;AAAA;AAAA,IACH;AAAA,IACA,qBAAC,QAAK,IAAG,OAAM,MAAM,mBAAmB,CAAC,QAAQ,QAAQ,MAAM,IAAI,CAAC,MAAM,GACvE;AAAA,0BAAoB,oBAAC,QAAM,4BAAiB;AAAA,MAC5C,oBAAoB,aAAa;AAAA,MAClC,oBAAC,QACE,uBACC;AAAA,QAAC;AAAA;AAAA,UACC,YAAW;AAAA,UACX,UAAU;AAAA,UACV,MAAK;AAAA,UACL,SAAS;AAAA,UACT,eAAY;AAAA,UACZ;AAAA,UACA;AAAA,UAEA,8BAAC,cAAW;AAAA;AAAA,MACd,GAEJ;AAAA,OACF;AAAA,KACF;AAEJ;AAEA,gBAAgB,cAAc;AAC9B,MAAM,8BAA8B,SAAS,eAAe;AAE5D,4BAA4B,YAAY;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/SidePanelHeaderDefinitions.ts"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { slotObjectToDataTestIds } from '@elliemae/ds-system';\n\nexport const DSSidePanelHeaderName = 'DSSidePanelHeader' as const;\nexport const DSSidePanelHeaderSlots = {\n CLOSE_BUTTON: 'close-button',\n TITLE: 'title',\n WRAPPER: 'wrapper',\n SEPARATOR: 'separator',\n};\n\nexport const DSSidePanelHeaderDataTestIds = {\n ...slotObjectToDataTestIds(DSSidePanelHeaderName, DSSidePanelHeaderSlots),\n CLOSE_BUTTON: 'btn-close-slide-panel',\n};\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,+BAA+B;AAEjC,MAAM,wBAAwB;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { slotObjectToDataTestIds } from '@elliemae/ds-system';\n\nexport const DSSidePanelHeaderName = 'DSSidePanelHeader' as const;\n\nexport const DSSidePanelHeaderSlots = {\n CLOSE_BUTTON: 'close-button',\n TITLE: 'title',\n WRAPPER: 'wrapper',\n SEPARATOR: 'separator',\n};\n\nexport const DSSidePanelHeaderDataTestIds = {\n ...slotObjectToDataTestIds(DSSidePanelHeaderName, DSSidePanelHeaderSlots),\n CLOSE_BUTTON: 'btn-close-slide-panel',\n};\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,+BAA+B;AAEjC,MAAM,wBAAwB;AAE9B,MAAM,yBAAyB;AAAA,EACpC,cAAc;AAAA,EACd,OAAO;AAAA,EACP,SAAS;AAAA,EACT,WAAW;AACb;AAEO,MAAM,+BAA+B;AAAA,EAC1C,GAAG,wBAAwB,uBAAuB,sBAAsB;AAAA,EACxE,cAAc;AAChB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/index.js
CHANGED
|
@@ -1,5 +1,10 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
export
|
|
2
|
+
import { SidePanelHeader, DSSidePanelHeaderWithSchema } from "./SidePanelHeader.js";
|
|
3
|
+
import { DSSidePanelHeaderSlots, DSSidePanelHeaderDataTestIds } from "./SidePanelHeaderDefinitions.js";
|
|
4
|
+
export {
|
|
5
|
+
DSSidePanelHeaderDataTestIds,
|
|
6
|
+
DSSidePanelHeaderSlots,
|
|
7
|
+
DSSidePanelHeaderWithSchema,
|
|
8
|
+
SidePanelHeader
|
|
9
|
+
};
|
|
5
10
|
//# sourceMappingURL=index.js.map
|
package/dist/esm/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "// this is a workaround to typescript error TS2742\n// https://github.com/microsoft/TypeScript/issues/47663\nimport {} from '@xstyled/system';\nimport {} from '@xstyled/util';\n\nexport { SidePanelHeader, DSSidePanelHeaderWithSchema } from './SidePanelHeader.js';\nexport type { DSSidePanelHeaderT } from './react-desc-prop-types.js';\nexport { DSSidePanelHeaderSlots, DSSidePanelHeaderDataTestIds } from './SidePanelHeaderDefinitions.js';\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACKvB,SAAS,iBAAiB,mCAAmC;AAE7D,SAAS,wBAAwB,oCAAoC;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import {
|
|
3
3
|
globalAttributesPropTypes,
|
|
4
|
-
xstyledPropTypes
|
|
4
|
+
xstyledPropTypes,
|
|
5
|
+
getPropsPerSlotPropTypes
|
|
5
6
|
} from "@elliemae/ds-props-helpers";
|
|
6
7
|
import { PropTypes } from "@elliemae/ds-props-helpers";
|
|
8
|
+
import { DSSidePanelHeaderName, DSSidePanelHeaderSlots } from "./SidePanelHeaderDefinitions.js";
|
|
7
9
|
const defaultProps = {
|
|
8
10
|
onClose: () => {
|
|
9
11
|
},
|
|
@@ -12,6 +14,7 @@ const defaultProps = {
|
|
|
12
14
|
const propTypes = {
|
|
13
15
|
...globalAttributesPropTypes,
|
|
14
16
|
...xstyledPropTypes,
|
|
17
|
+
...getPropsPerSlotPropTypes(DSSidePanelHeaderName, DSSidePanelHeaderSlots),
|
|
15
18
|
/** Page title */
|
|
16
19
|
title: PropTypes.string.description("Page title"),
|
|
17
20
|
/** Action button */
|
|
@@ -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", "import type
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type React from 'react';\nimport {\n type GlobalAttributesT,\n type XstyledProps,\n globalAttributesPropTypes,\n xstyledPropTypes,\n type ValidationMap,\n getPropsPerSlotPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport { PropTypes } from '@elliemae/ds-props-helpers';\nimport { DSSidePanelHeaderName, DSSidePanelHeaderSlots } from './SidePanelHeaderDefinitions.js';\n\nexport declare namespace DSSidePanelHeaderT {\n export interface RequiredProps {}\n\n export interface DefaultProps {\n onClose: () => void;\n showClose: boolean;\n }\n\n export interface OptionalProps {\n title?: string;\n additionalAction?: React.ReactNode;\n closeButtonRef?: React.RefObject<HTMLButtonElement>;\n }\n\n export interface Props\n extends Partial<DefaultProps>,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps>,\n XstyledProps {}\n\n export interface InternalProps\n extends DefaultProps,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLButtonElement>, keyof DefaultProps | keyof OptionalProps>,\n XstyledProps {}\n}\n\nexport const defaultProps: DSSidePanelHeaderT.DefaultProps = {\n onClose: () => {},\n showClose: true,\n};\n\nexport const propTypes = {\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n ...getPropsPerSlotPropTypes(DSSidePanelHeaderName, DSSidePanelHeaderSlots),\n /** Page title */\n title: PropTypes.string.description('Page title'),\n /** Action button */\n additionalAction: PropTypes.element.description('Action button'),\n /** Called when the slide collapse */\n onClose: PropTypes.func.description('Called when the slide collapse').defaultValue(defaultProps.onClose),\n /** Show/Hide close button */\n showClose: PropTypes.bool.description('Show/Hide close button').defaultValue(defaultProps.showClose),\n /** Ref for close button */\n closeButtonRef: PropTypes.object.description('Ref for close button'),\n} as unknown as ValidationMap<DSSidePanelHeaderT.Props>;\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACCvB;AAAA,EAGE;AAAA,EACA;AAAA,EAEA;AAAA,OACK;AACP,SAAS,iBAAiB;AAC1B,SAAS,uBAAuB,8BAA8B;AA6BvD,MAAM,eAAgD;AAAA,EAC3D,SAAS,MAAM;AAAA,EAAC;AAAA,EAChB,WAAW;AACb;AAEO,MAAM,YAAY;AAAA,EACvB,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG,yBAAyB,uBAAuB,sBAAsB;AAAA;AAAA,EAEzE,OAAO,UAAU,OAAO,YAAY,YAAY;AAAA;AAAA,EAEhD,kBAAkB,UAAU,QAAQ,YAAY,eAAe;AAAA;AAAA,EAE/D,SAAS,UAAU,KAAK,YAAY,gCAAgC,EAAE,aAAa,aAAa,OAAO;AAAA;AAAA,EAEvG,WAAW,UAAU,KAAK,YAAY,wBAAwB,EAAE,aAAa,aAAa,SAAS;AAAA;AAAA,EAEnG,gBAAgB,UAAU,OAAO,YAAY,sBAAsB;AACrE;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,72 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
+
import React2 from "react";
|
|
4
|
+
import { SidePanelHeader } from "../index.js";
|
|
5
|
+
const MockComponent = () => /* @__PURE__ */ jsx("div", {});
|
|
6
|
+
const ref = React2.createRef();
|
|
7
|
+
const testRequiredProps = {};
|
|
8
|
+
const testOptionalProps = {
|
|
9
|
+
title: "",
|
|
10
|
+
additionalAction: MockComponent(),
|
|
11
|
+
closeButtonRef: ref
|
|
12
|
+
};
|
|
13
|
+
const testPartialDefaults = {
|
|
14
|
+
showClose: false
|
|
15
|
+
};
|
|
16
|
+
const testProps = {
|
|
17
|
+
...testRequiredProps,
|
|
18
|
+
...testOptionalProps,
|
|
19
|
+
...testPartialDefaults
|
|
20
|
+
};
|
|
21
|
+
const testPropsAsSyntax = {
|
|
22
|
+
...testRequiredProps,
|
|
23
|
+
...testOptionalProps,
|
|
24
|
+
...testPartialDefaults
|
|
25
|
+
};
|
|
26
|
+
const testCompleteDefaults = {
|
|
27
|
+
onClose: () => {
|
|
28
|
+
},
|
|
29
|
+
showClose: true
|
|
30
|
+
};
|
|
31
|
+
const testInternalProps = {
|
|
32
|
+
...testRequiredProps,
|
|
33
|
+
...testOptionalProps,
|
|
34
|
+
...testCompleteDefaults
|
|
35
|
+
};
|
|
36
|
+
const testInternalPropsAsSyntax = {
|
|
37
|
+
...testRequiredProps,
|
|
38
|
+
...testOptionalProps,
|
|
39
|
+
...testCompleteDefaults
|
|
40
|
+
};
|
|
41
|
+
const testExplicitDefinition = {
|
|
42
|
+
onClose: () => {
|
|
43
|
+
},
|
|
44
|
+
showClose: true,
|
|
45
|
+
title: "",
|
|
46
|
+
additionalAction: MockComponent(),
|
|
47
|
+
closeButtonRef: ref
|
|
48
|
+
};
|
|
49
|
+
const testInferedTypeCompatibility = {
|
|
50
|
+
onClose: () => {
|
|
51
|
+
},
|
|
52
|
+
showClose: true,
|
|
53
|
+
title: "",
|
|
54
|
+
additionalAction: MockComponent(),
|
|
55
|
+
closeButtonRef: ref
|
|
56
|
+
};
|
|
57
|
+
const testDefinitionAsConst = {
|
|
58
|
+
onClose: () => {
|
|
59
|
+
},
|
|
60
|
+
showClose: true,
|
|
61
|
+
title: "",
|
|
62
|
+
additionalAction: MockComponent(),
|
|
63
|
+
closeButtonRef: ref
|
|
64
|
+
};
|
|
65
|
+
const ExampleUsageComponent = () => /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
66
|
+
/* @__PURE__ */ jsx(SidePanelHeader, { ...testExplicitDefinition }),
|
|
67
|
+
/* @__PURE__ */ jsx(SidePanelHeader, { ...testInferedTypeCompatibility }),
|
|
68
|
+
/* @__PURE__ */ jsx(SidePanelHeader, { ...testDefinitionAsConst }),
|
|
69
|
+
/* @__PURE__ */ jsx(SidePanelHeader, { onClose: () => {
|
|
70
|
+
}, showClose: true, title: "", additionalAction: /* @__PURE__ */ jsx(MockComponent, {}), closeButtonRef: ref })
|
|
71
|
+
] });
|
|
72
|
+
//# sourceMappingURL=typescript-side-panel-header-valid.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/typescript-testing/typescript-side-panel-header-valid.tsx"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-unused-vars, no-unused-vars */\nimport React from 'react';\nimport { SidePanelHeader } from '../index.js';\nimport type { DSSidePanelHeaderT } from '../index.js';\n\n// test we expose the namespace and the namespace follows our deliverable conventions\ntype ComponentPropsForApp = DSSidePanelHeaderT.Props;\ntype ComponentPropsInternals = DSSidePanelHeaderT.InternalProps;\ntype ComponentPropsDefaultProps = DSSidePanelHeaderT.DefaultProps;\ntype ComponentPropsOptionalProps = DSSidePanelHeaderT.OptionalProps;\ntype ComponentPropsRequiredProps = DSSidePanelHeaderT.RequiredProps;\n\nconst MockComponent = () => <div></div>;\nconst ref = React.createRef<HTMLButtonElement>();\n\nconst testRequiredProps: ComponentPropsRequiredProps = {};\n\nconst testOptionalProps: ComponentPropsOptionalProps = {\n title: '',\n additionalAction: MockComponent(),\n closeButtonRef: ref,\n};\n\n// difference Props and InternalProps is that InternalProps has all the default props filled in\n// Props allows for partial defaults\nconst testPartialDefaults: Partial<ComponentPropsDefaultProps> = {\n showClose: false,\n};\n\nconst testProps: ComponentPropsForApp = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testPartialDefaults,\n};\n\nconst testPropsAsSyntax = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testPartialDefaults,\n} as ComponentPropsForApp;\n\n// InternalProps requires all defaults to be filled in\nconst testCompleteDefaults: Required<ComponentPropsDefaultProps> = {\n onClose: () => {},\n showClose: true,\n};\n\nconst testInternalProps: ComponentPropsInternals = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testCompleteDefaults,\n};\n\nconst testInternalPropsAsSyntax = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testCompleteDefaults,\n} as ComponentPropsInternals;\n\n// using the explicit type definition, if there is an error, it will be marked on the key that is wrong\nconst testExplicitDefinition: ComponentPropsForApp = {\n onClose: () => {},\n showClose: true,\n title: '',\n additionalAction: MockComponent(),\n closeButtonRef: ref,\n};\n\n// using the \"as\" syntax, if there is an error, it will be marking the whole object as wrong because it is not compatible with the type\nconst testInferedTypeCompatibility = {\n onClose: () => {},\n showClose: true,\n title: '',\n additionalAction: MockComponent(),\n closeButtonRef: ref,\n} as ComponentPropsForApp;\n\nconst testDefinitionAsConst = {\n onClose: () => {},\n showClose: true,\n title: '',\n additionalAction: MockComponent(),\n closeButtonRef: ref,\n} as const;\n\nconst ExampleUsageComponent = () => (\n <>\n {/* works with explicitly casted props, all syntaxes */}\n <SidePanelHeader {...testExplicitDefinition} />\n <SidePanelHeader {...testInferedTypeCompatibility} />\n <SidePanelHeader {...testDefinitionAsConst} />\n {/* works with inline values */}\n <SidePanelHeader onClose={() => {}} showClose title=\"\" additionalAction={<MockComponent />} closeButtonRef={ref} />\n </>\n);\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACYK,SA0E1B,UA1E0B,KA0E1B,YA1E0B;AAX5B,OAAOA,YAAW;AAClB,SAAS,uBAAuB;AAUhC,MAAM,gBAAgB,MAAM,oBAAC,SAAI;AACjC,MAAM,MAAMA,OAAM,UAA6B;AAE/C,MAAM,oBAAiD,CAAC;AAExD,MAAM,oBAAiD;AAAA,EACrD,OAAO;AAAA,EACP,kBAAkB,cAAc;AAAA,EAChC,gBAAgB;AAClB;AAIA,MAAM,sBAA2D;AAAA,EAC/D,WAAW;AACb;AAEA,MAAM,YAAkC;AAAA,EACtC,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AAEA,MAAM,oBAAoB;AAAA,EACxB,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AAGA,MAAM,uBAA6D;AAAA,EACjE,SAAS,MAAM;AAAA,EAAC;AAAA,EAChB,WAAW;AACb;AAEA,MAAM,oBAA6C;AAAA,EACjD,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AAEA,MAAM,4BAA4B;AAAA,EAChC,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AAGA,MAAM,yBAA+C;AAAA,EACnD,SAAS,MAAM;AAAA,EAAC;AAAA,EAChB,WAAW;AAAA,EACX,OAAO;AAAA,EACP,kBAAkB,cAAc;AAAA,EAChC,gBAAgB;AAClB;AAGA,MAAM,+BAA+B;AAAA,EACnC,SAAS,MAAM;AAAA,EAAC;AAAA,EAChB,WAAW;AAAA,EACX,OAAO;AAAA,EACP,kBAAkB,cAAc;AAAA,EAChC,gBAAgB;AAClB;AAEA,MAAM,wBAAwB;AAAA,EAC5B,SAAS,MAAM;AAAA,EAAC;AAAA,EAChB,WAAW;AAAA,EACX,OAAO;AAAA,EACP,kBAAkB,cAAc;AAAA,EAChC,gBAAgB;AAClB;AAEA,MAAM,wBAAwB,MAC5B,iCAEE;AAAA,sBAAC,mBAAiB,GAAG,wBAAwB;AAAA,EAC7C,oBAAC,mBAAiB,GAAG,8BAA8B;AAAA,EACnD,oBAAC,mBAAiB,GAAG,uBAAuB;AAAA,EAE5C,oBAAC,mBAAgB,SAAS,MAAM;AAAA,EAAC,GAAG,WAAS,MAAC,OAAM,IAAG,kBAAkB,oBAAC,iBAAc,GAAI,gBAAgB,KAAK;AAAA,GACnH;",
|
|
6
|
+
"names": ["React"]
|
|
7
|
+
}
|
package/dist/types/index.d.ts
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
export
|
|
2
|
-
export
|
|
3
|
-
export
|
|
1
|
+
export { SidePanelHeader, DSSidePanelHeaderWithSchema } from './SidePanelHeader.js';
|
|
2
|
+
export type { DSSidePanelHeaderT } from './react-desc-prop-types.js';
|
|
3
|
+
export { DSSidePanelHeaderSlots, DSSidePanelHeaderDataTestIds } from './SidePanelHeaderDefinitions.js';
|
|
@@ -1,7 +1,8 @@
|
|
|
1
|
-
import type { WeakValidationMap } from 'react';
|
|
2
1
|
import type React from 'react';
|
|
3
|
-
import { type GlobalAttributesT, type XstyledProps } from '@elliemae/ds-props-helpers';
|
|
2
|
+
import { type GlobalAttributesT, type XstyledProps, type ValidationMap } from '@elliemae/ds-props-helpers';
|
|
4
3
|
export declare namespace DSSidePanelHeaderT {
|
|
4
|
+
interface RequiredProps {
|
|
5
|
+
}
|
|
5
6
|
interface DefaultProps {
|
|
6
7
|
onClose: () => void;
|
|
7
8
|
showClose: boolean;
|
|
@@ -17,4 +18,4 @@ export declare namespace DSSidePanelHeaderT {
|
|
|
17
18
|
}
|
|
18
19
|
}
|
|
19
20
|
export declare const defaultProps: DSSidePanelHeaderT.DefaultProps;
|
|
20
|
-
export declare const propTypes:
|
|
21
|
+
export declare const propTypes: ValidationMap<DSSidePanelHeaderT.Props>;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-side-panel-header",
|
|
3
|
-
"version": "3.
|
|
3
|
+
"version": "3.38.0-rc.0",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Side Panel Header",
|
|
6
6
|
"files": [
|
|
@@ -57,18 +57,18 @@
|
|
|
57
57
|
},
|
|
58
58
|
"dependencies": {
|
|
59
59
|
"@elliemae/pui-theme": "~2.9.3",
|
|
60
|
-
"@elliemae/ds-button-v2": "3.
|
|
61
|
-
"@elliemae/ds-grid": "3.
|
|
62
|
-
"@elliemae/ds-
|
|
63
|
-
"@elliemae/ds-
|
|
64
|
-
"@elliemae/ds-
|
|
60
|
+
"@elliemae/ds-button-v2": "3.38.0-rc.0",
|
|
61
|
+
"@elliemae/ds-grid": "3.38.0-rc.0",
|
|
62
|
+
"@elliemae/ds-icons": "3.38.0-rc.0",
|
|
63
|
+
"@elliemae/ds-props-helpers": "3.38.0-rc.0",
|
|
64
|
+
"@elliemae/ds-system": "3.38.0-rc.0"
|
|
65
65
|
},
|
|
66
66
|
"devDependencies": {
|
|
67
67
|
"@elliemae/pui-cli": "9.0.0-next.50",
|
|
68
68
|
"@xstyled/system": "3.7.0",
|
|
69
69
|
"@xstyled/util": "3.7.0",
|
|
70
70
|
"styled-components": "~5.3.9",
|
|
71
|
-
"@elliemae/ds-monorepo-devops": "3.
|
|
71
|
+
"@elliemae/ds-monorepo-devops": "3.38.0-rc.0"
|
|
72
72
|
},
|
|
73
73
|
"peerDependencies": {
|
|
74
74
|
"lodash": "^4.17.21",
|
|
@@ -78,7 +78,7 @@
|
|
|
78
78
|
},
|
|
79
79
|
"publishConfig": {
|
|
80
80
|
"access": "public",
|
|
81
|
-
"typeSafety":
|
|
81
|
+
"typeSafety": true
|
|
82
82
|
},
|
|
83
83
|
"scripts": {
|
|
84
84
|
"dev": "cross-env NODE_ENV=development node ../../../scripts/build/build.mjs --watch",
|