@elliemae/ds-page-header-v2 3.37.0-rc.3 → 3.37.0-rc.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/page-header-editable-title/PageHeaderEditableTitle.js +2 -2
- package/dist/cjs/components/page-header-editable-title/PageHeaderEditableTitle.js.map +2 -2
- package/dist/cjs/components/page-header-editable-title/useDerivedStateFromProps.js +68 -0
- package/dist/cjs/components/page-header-editable-title/useDerivedStateFromProps.js.map +7 -0
- package/dist/cjs/tests/utils.js +4 -4
- package/dist/cjs/tests/utils.js.map +2 -2
- package/dist/esm/components/page-header-editable-title/PageHeaderEditableTitle.js +1 -1
- package/dist/esm/components/page-header-editable-title/PageHeaderEditableTitle.js.map +1 -1
- package/dist/esm/components/page-header-editable-title/useDerivedStateFromProps.js +38 -0
- package/dist/esm/components/page-header-editable-title/useDerivedStateFromProps.js.map +7 -0
- package/dist/esm/tests/utils.js +1 -1
- package/dist/esm/tests/utils.js.map +1 -1
- package/dist/types/components/page-header-editable-title/useDerivedStateFromProps.d.ts +14 -0
- package/package.json +13 -14
|
@@ -39,7 +39,7 @@ var import_react = require("react");
|
|
|
39
39
|
var import_ds_form_input_text = require("@elliemae/ds-form-input-text");
|
|
40
40
|
var import_ds_system = require("@elliemae/ds-system");
|
|
41
41
|
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
42
|
-
var
|
|
42
|
+
var import_useDerivedStateFromProps = require("./useDerivedStateFromProps.js");
|
|
43
43
|
var import_page_header_title = require("../page-header-title/index.js");
|
|
44
44
|
var import_exported_related = require("../../exported-related/index.js");
|
|
45
45
|
var import_react_desc_prop_types = require("./react-desc-prop-types.js");
|
|
@@ -69,7 +69,7 @@ const PageHeaderEditableTitle = (props) => {
|
|
|
69
69
|
const { children: value, editing: editingProp, showMarker, ...rest } = props;
|
|
70
70
|
const [titleValue, setTitleValue] = (0, import_react.useState)(value);
|
|
71
71
|
const [hovered, setHovered] = (0, import_react.useState)(false);
|
|
72
|
-
const [editing, setEditing] = (0,
|
|
72
|
+
const [editing, setEditing] = (0, import_useDerivedStateFromProps.useDerivedStateFromProps)(editingProp || false);
|
|
73
73
|
const titleRef = (0, import_react.useRef)(null);
|
|
74
74
|
const width = titleRef.current?.offsetWidth || 0;
|
|
75
75
|
const handleOnChange = (0, import_react.useCallback)((e) => {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/components/page-header-editable-title/PageHeaderEditableTitle.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React, { useRef, useState, useCallback } from 'react';\nimport { DSInputText, DSInputTextName, DSInputTextSlots } from '@elliemae/ds-form-input-text';\nimport { styled } from '@elliemae/ds-system';\nimport { describe, useGetGlobalAttributes, type ValidationMap } from '@elliemae/ds-props-helpers';\nimport { useDerivedStateFromProps } from '
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADgEnB;AAhEJ,mBAAqD;AACrD,gCAA+D;AAC/D,uBAAuB;AACvB,8BAAqE;AACrE,
|
|
4
|
+
"sourcesContent": ["import React, { useRef, useState, useCallback } from 'react';\nimport { DSInputText, DSInputTextName, DSInputTextSlots } from '@elliemae/ds-form-input-text';\nimport { styled } from '@elliemae/ds-system';\nimport { describe, useGetGlobalAttributes, type ValidationMap } from '@elliemae/ds-props-helpers';\nimport { useDerivedStateFromProps } from './useDerivedStateFromProps.js';\nimport { PageHeaderTitle } from '../page-header-title/index.js';\nimport { DSPageHeaderDataTestIds } from '../../exported-related/index.js';\nimport { PageHeaderEditableTitlePropTypes, type PageHeaderEditableTitleT } from './react-desc-prop-types.js';\n\nconst EditableContainer = styled('div')`\n height: 32px;\n position: relative;\n overflow: hidden;\n &.editable-title-component {\n position: relative;\n left: -7px;\n top: -1px;\n margin-left: -2px;\n margin-right: -9px;\n & .${DSInputTextName}-${DSInputTextSlots.INPUT_WRAPPER} {\n height: 32px;\n }\n & .${DSInputTextName}-${DSInputTextSlots.INPUT} {\n font-size: ${({ theme }) => theme.fontSizes.title[800]};\n line-height: normal;\n color: ${({ theme }) => theme.colors.neutral['700']};\n padding-top: 0px;\n padding-bottom: 0px;\n }\n }\n`;\n\nexport const PageHeaderEditableTitle = (props: PageHeaderEditableTitleT.Props) => {\n const { children: value, editing: editingProp, showMarker, ...rest } = props;\n const [titleValue, setTitleValue] = useState(value);\n const [hovered, setHovered] = useState(false);\n const [editing, setEditing] = useDerivedStateFromProps(editingProp || false);\n const titleRef = useRef<HTMLDivElement>(null);\n const width = titleRef.current?.offsetWidth || 0;\n\n const handleOnChange: React.ChangeEventHandler<HTMLInputElement> = useCallback((e) => {\n setTitleValue(e.target.value);\n }, []);\n\n const handleOnFocus: React.FocusEventHandler = useCallback(() => {\n setEditing(true);\n }, [setEditing]);\n\n const handleOnBlur: React.FocusEventHandler = useCallback(() => {\n setEditing(false);\n }, [setEditing]);\n\n const handleOnMouseOut: React.MouseEventHandler = useCallback(() => {\n setHovered(false);\n }, []);\n\n const globals = useGetGlobalAttributes(rest, {\n onFocus: handleOnFocus,\n onMouseOut: handleOnMouseOut,\n onChange: handleOnChange,\n onBlur: handleOnBlur,\n });\n\n return (\n <EditableContainer\n className={hovered || editing ? 'editable-title-component' : ''}\n onMouseEnter={() => setHovered(true)}\n onMouseLeave={() => setHovered(false)}\n data-testid={DSPageHeaderDataTestIds.EDITABLE_HEADER_TITLE}\n >\n {(hovered || editing) && (\n <DSInputText\n onChange={handleOnChange}\n {...rest}\n {...globals}\n placeholder=\"\"\n style={{ width: width + 10, minWidth: '260px', maxWidth: '100%' }}\n value={titleValue}\n />\n )}\n <div ref={titleRef} style={{ width: 'fit-content' }}>\n <PageHeaderTitle showMarker={showMarker && !hovered && !editing}>{titleValue}</PageHeaderTitle>\n </div>\n </EditableContainer>\n );\n};\n\nPageHeaderEditableTitle.displayName = 'PageHeaderEditableTitle';\nconst DSPageHeaderEditableTitleWithSchema = describe(PageHeaderEditableTitle);\n\nDSPageHeaderEditableTitleWithSchema.propTypes = PageHeaderEditableTitlePropTypes as ValidationMap<unknown>;\n\nexport default PageHeaderEditableTitle;\n\nexport { DSPageHeaderEditableTitleWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADgEnB;AAhEJ,mBAAqD;AACrD,gCAA+D;AAC/D,uBAAuB;AACvB,8BAAqE;AACrE,sCAAyC;AACzC,+BAAgC;AAChC,8BAAwC;AACxC,mCAAgF;AAEhF,MAAM,wBAAoB,yBAAO,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,SAU7B,yCAAe,IAAI,2CAAiB,aAAa;AAAA;AAAA;AAAA,SAGjD,yCAAe,IAAI,2CAAiB,KAAK;AAAA,mBAC/B,CAAC,EAAE,MAAM,MAAM,MAAM,UAAU,MAAM,GAAG,CAAC;AAAA;AAAA,eAE7C,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAOlD,MAAM,0BAA0B,CAAC,UAA0C;AAChF,QAAM,EAAE,UAAU,OAAO,SAAS,aAAa,YAAY,GAAG,KAAK,IAAI;AACvE,QAAM,CAAC,YAAY,aAAa,QAAI,uBAAS,KAAK;AAClD,QAAM,CAAC,SAAS,UAAU,QAAI,uBAAS,KAAK;AAC5C,QAAM,CAAC,SAAS,UAAU,QAAI,0DAAyB,eAAe,KAAK;AAC3E,QAAM,eAAW,qBAAuB,IAAI;AAC5C,QAAM,QAAQ,SAAS,SAAS,eAAe;AAE/C,QAAM,qBAA6D,0BAAY,CAAC,MAAM;AACpF,kBAAc,EAAE,OAAO,KAAK;AAAA,EAC9B,GAAG,CAAC,CAAC;AAEL,QAAM,oBAAyC,0BAAY,MAAM;AAC/D,eAAW,IAAI;AAAA,EACjB,GAAG,CAAC,UAAU,CAAC;AAEf,QAAM,mBAAwC,0BAAY,MAAM;AAC9D,eAAW,KAAK;AAAA,EAClB,GAAG,CAAC,UAAU,CAAC;AAEf,QAAM,uBAA4C,0BAAY,MAAM;AAClE,eAAW,KAAK;AAAA,EAClB,GAAG,CAAC,CAAC;AAEL,QAAM,cAAU,gDAAuB,MAAM;AAAA,IAC3C,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,QAAQ;AAAA,EACV,CAAC;AAED,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,WAAW,UAAU,6BAA6B;AAAA,MAC7D,cAAc,MAAM,WAAW,IAAI;AAAA,MACnC,cAAc,MAAM,WAAW,KAAK;AAAA,MACpC,eAAa,gDAAwB;AAAA,MAEnC;AAAA,oBAAW,YACX;AAAA,UAAC;AAAA;AAAA,YACC,UAAU;AAAA,YACT,GAAG;AAAA,YACH,GAAG;AAAA,YACJ,aAAY;AAAA,YACZ,OAAO,EAAE,OAAO,QAAQ,IAAI,UAAU,SAAS,UAAU,OAAO;AAAA,YAChE,OAAO;AAAA;AAAA,QACT;AAAA,QAEF,4CAAC,SAAI,KAAK,UAAU,OAAO,EAAE,OAAO,cAAc,GAChD,sDAAC,4CAAgB,YAAY,cAAc,CAAC,WAAW,CAAC,SAAU,sBAAW,GAC/E;AAAA;AAAA;AAAA,EACF;AAEJ;AAEA,wBAAwB,cAAc;AACtC,MAAM,0CAAsC,kCAAS,uBAAuB;AAE5E,oCAAoC,YAAY;AAEhD,IAAO,kCAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,68 @@
|
|
|
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
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
28
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
+
var useDerivedStateFromProps_exports = {};
|
|
30
|
+
__export(useDerivedStateFromProps_exports, {
|
|
31
|
+
default: () => useDerivedStateFromProps_default,
|
|
32
|
+
useDerivedStateFromProps: () => useDerivedStateFromProps
|
|
33
|
+
});
|
|
34
|
+
module.exports = __toCommonJS(useDerivedStateFromProps_exports);
|
|
35
|
+
var React = __toESM(require("react"));
|
|
36
|
+
var import_react = require("react");
|
|
37
|
+
var import_lodash = require("lodash");
|
|
38
|
+
const defaultPropUpdateOnChange = (prop) => prop;
|
|
39
|
+
function defaultShouldUpdate({ prop, prevProp, stateValue }) {
|
|
40
|
+
return !(0, import_lodash.isEqual)(prop, prevProp) && !(0, import_lodash.isEqual)(prop, stateValue);
|
|
41
|
+
}
|
|
42
|
+
function setStateWithUpdate(onUpdate, setState) {
|
|
43
|
+
return (state) => {
|
|
44
|
+
setState((prevState) => onUpdate((0, import_lodash.isFunction)(state) ? state(prevState) : state, prevState));
|
|
45
|
+
};
|
|
46
|
+
}
|
|
47
|
+
const useDerivedStateFromProps = (prop, options = {}) => {
|
|
48
|
+
const {
|
|
49
|
+
onUpdate = defaultPropUpdateOnChange,
|
|
50
|
+
shouldUpdate = defaultShouldUpdate,
|
|
51
|
+
updateOnStateChange = false
|
|
52
|
+
} = options;
|
|
53
|
+
const [stateValue, setState] = (0, import_react.useState)(onUpdate(prop, {}));
|
|
54
|
+
const handleSetState = updateOnStateChange ? setStateWithUpdate(onUpdate, setState) : setState;
|
|
55
|
+
const prevProp = (0, import_react.useRef)(prop);
|
|
56
|
+
if (shouldUpdate({
|
|
57
|
+
prop,
|
|
58
|
+
prevProp: prevProp.current,
|
|
59
|
+
stateValue
|
|
60
|
+
})) {
|
|
61
|
+
const nextProp = onUpdate(prop, prevProp.current);
|
|
62
|
+
setState(nextProp);
|
|
63
|
+
}
|
|
64
|
+
prevProp.current = prop;
|
|
65
|
+
return [stateValue, handleSetState];
|
|
66
|
+
};
|
|
67
|
+
var useDerivedStateFromProps_default = useDerivedStateFromProps;
|
|
68
|
+
//# sourceMappingURL=useDerivedStateFromProps.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/components/page-header-editable-title/useDerivedStateFromProps.ts", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["import type React from 'react';\nimport { useRef, useState } from 'react';\nimport { isEqual, isFunction } from 'lodash';\n\ninterface ShouldUpdateArg {\n prop: unknown;\n prevProp: unknown;\n stateValue: unknown;\n}\n\ntype OnUpdateT<T> = (prop: T, prevProp?: T | Record<string, never>) => T;\n\ninterface OptionsT<T> {\n onUpdate?: OnUpdateT<T>;\n shouldUpdate?: (arg: ShouldUpdateArg) => boolean;\n updateOnStateChange?: boolean;\n}\n\nconst defaultPropUpdateOnChange = <T>(prop: T) => prop;\n\nfunction defaultShouldUpdate({ prop, prevProp, stateValue }: ShouldUpdateArg) {\n return !isEqual(prop, prevProp) && !isEqual(prop, stateValue);\n}\n\nfunction setStateWithUpdate<T>(onUpdate: OnUpdateT<T>, setState: React.Dispatch<React.SetStateAction<T>>) {\n return (state: React.SetStateAction<T>) => {\n setState((prevState: T) => onUpdate(isFunction(state) ? state(prevState) : state, prevState));\n };\n}\n\nexport const useDerivedStateFromProps = <T>(\n prop: T,\n options: OptionsT<T> = {},\n): [T, React.Dispatch<React.SetStateAction<T>>] => {\n const {\n onUpdate = defaultPropUpdateOnChange as OnUpdateT<T>,\n shouldUpdate = defaultShouldUpdate,\n updateOnStateChange = false,\n } = options;\n\n const [stateValue, setState] = useState(onUpdate(prop, {}));\n const handleSetState = updateOnStateChange ? setStateWithUpdate(onUpdate, setState) : setState;\n const prevProp = useRef(prop);\n\n if (\n shouldUpdate({\n prop,\n prevProp: prevProp.current,\n stateValue,\n })\n ) {\n const nextProp = onUpdate(prop, prevProp.current);\n setState(nextProp);\n }\n prevProp.current = prop;\n return [stateValue, handleSetState];\n};\n\nexport default useDerivedStateFromProps;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAiC;AACjC,oBAAoC;AAgBpC,MAAM,4BAA4B,CAAI,SAAY;AAElD,SAAS,oBAAoB,EAAE,MAAM,UAAU,WAAW,GAAoB;AAC5E,SAAO,KAAC,uBAAQ,MAAM,QAAQ,KAAK,KAAC,uBAAQ,MAAM,UAAU;AAC9D;AAEA,SAAS,mBAAsB,UAAwB,UAAmD;AACxG,SAAO,CAAC,UAAmC;AACzC,aAAS,CAAC,cAAiB,aAAS,0BAAW,KAAK,IAAI,MAAM,SAAS,IAAI,OAAO,SAAS,CAAC;AAAA,EAC9F;AACF;AAEO,MAAM,2BAA2B,CACtC,MACA,UAAuB,CAAC,MACyB;AACjD,QAAM;AAAA,IACJ,WAAW;AAAA,IACX,eAAe;AAAA,IACf,sBAAsB;AAAA,EACxB,IAAI;AAEJ,QAAM,CAAC,YAAY,QAAQ,QAAI,uBAAS,SAAS,MAAM,CAAC,CAAC,CAAC;AAC1D,QAAM,iBAAiB,sBAAsB,mBAAmB,UAAU,QAAQ,IAAI;AACtF,QAAM,eAAW,qBAAO,IAAI;AAE5B,MACE,aAAa;AAAA,IACX;AAAA,IACA,UAAU,SAAS;AAAA,IACnB;AAAA,EACF,CAAC,GACD;AACA,UAAM,WAAW,SAAS,MAAM,SAAS,OAAO;AAChD,aAAS,QAAQ;AAAA,EACnB;AACA,WAAS,UAAU;AACnB,SAAO,CAAC,YAAY,cAAc;AACpC;AAEA,IAAO,mCAAQ;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
package/dist/cjs/tests/utils.js
CHANGED
|
@@ -32,23 +32,23 @@ __export(utils_exports, {
|
|
|
32
32
|
});
|
|
33
33
|
module.exports = __toCommonJS(utils_exports);
|
|
34
34
|
var React = __toESM(require("react"));
|
|
35
|
-
var
|
|
35
|
+
var import_ds_system = require("@elliemae/ds-system");
|
|
36
36
|
const subItems = [
|
|
37
37
|
{
|
|
38
38
|
id: "id3",
|
|
39
39
|
label: "SubMenu List Item-1",
|
|
40
|
-
onClick: (e) => (0,
|
|
40
|
+
onClick: (e) => (0, import_ds_system.logger)(e, "subMenu id3")
|
|
41
41
|
},
|
|
42
42
|
{
|
|
43
43
|
id: "id4",
|
|
44
44
|
type: "subMenu",
|
|
45
45
|
label: "SubMenu List Item-2",
|
|
46
|
-
onClick: (e) => (0,
|
|
46
|
+
onClick: (e) => (0, import_ds_system.logger)(e, "subMenu id4"),
|
|
47
47
|
subItems: [
|
|
48
48
|
{
|
|
49
49
|
id: "id5",
|
|
50
50
|
label: "SubMenu List Item-2",
|
|
51
|
-
onClick: (e) => (0,
|
|
51
|
+
onClick: (e) => (0, import_ds_system.logger)(e, "subMenu id5")
|
|
52
52
|
}
|
|
53
53
|
]
|
|
54
54
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/tests/utils.js", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import { logger } from '@elliemae/ds-
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,
|
|
4
|
+
"sourcesContent": ["import { logger } from '@elliemae/ds-system';\n\nconst subItems = [\n {\n id: 'id3',\n label: 'SubMenu List Item-1',\n onClick: (e) => logger(e, 'subMenu id3'),\n },\n {\n id: 'id4',\n type: 'subMenu',\n label: 'SubMenu List Item-2',\n onClick: (e) => logger(e, 'subMenu id4'),\n subItems: [\n {\n id: 'id5',\n label: 'SubMenu List Item-2',\n onClick: (e) => logger(e, 'subMenu id5'),\n },\n ],\n },\n];\n\nexport const options = [\n {\n type: 'SelectionGroup',\n id: 'select-option',\n multi: false,\n closeOnClick: false,\n interactionType: 'click',\n items: [\n {\n id: 'id-1',\n selectable: true,\n type: 'subMenu',\n label: 'View Example 123',\n rightAddonType: 'elipsis',\n interactionType: 'click',\n subItems,\n },\n {\n id: 'id-2',\n type: 'subMenu',\n label: 'Option 2',\n rightAddonType: 'elipsis',\n interactionType: 'click',\n subItems,\n },\n {\n id: 'id-3',\n type: 'subMenu',\n label: 'Option 3',\n rightAddonType: 'elipsis',\n interactionType: 'click',\n subItems,\n },\n {\n id: 'id-4',\n type: 'subMenu',\n label: 'Option 4',\n rightAddonType: 'elipsis',\n interactionType: 'click',\n subItems,\n },\n {\n id: 'id-5',\n type: 'subMenu',\n label: 'Option 5',\n rightAddonType: 'elipsis',\n interactionType: 'click',\n subItems,\n },\n {\n id: 'id-6',\n type: 'subMenu',\n label: 'Option 6',\n rightAddonType: 'elipsis',\n interactionType: 'click',\n subItems,\n },\n {\n id: 'id-7',\n type: 'subMenu',\n label: 'Truncate long option Other Custom View Long Long Long Long Long',\n rightAddonType: 'elipsis',\n interactionType: 'click',\n subItems,\n },\n ],\n },\n];\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAuB;AAEvB,MAAM,WAAW;AAAA,EACf;AAAA,IACE,IAAI;AAAA,IACJ,OAAO;AAAA,IACP,SAAS,CAAC,UAAM,yBAAO,GAAG,aAAa;AAAA,EACzC;AAAA,EACA;AAAA,IACE,IAAI;AAAA,IACJ,MAAM;AAAA,IACN,OAAO;AAAA,IACP,SAAS,CAAC,UAAM,yBAAO,GAAG,aAAa;AAAA,IACvC,UAAU;AAAA,MACR;AAAA,QACE,IAAI;AAAA,QACJ,OAAO;AAAA,QACP,SAAS,CAAC,UAAM,yBAAO,GAAG,aAAa;AAAA,MACzC;AAAA,IACF;AAAA,EACF;AACF;AAEO,MAAM,UAAU;AAAA,EACrB;AAAA,IACE,MAAM;AAAA,IACN,IAAI;AAAA,IACJ,OAAO;AAAA,IACP,cAAc;AAAA,IACd,iBAAiB;AAAA,IACjB,OAAO;AAAA,MACL;AAAA,QACE,IAAI;AAAA,QACJ,YAAY;AAAA,QACZ,MAAM;AAAA,QACN,OAAO;AAAA,QACP,gBAAgB;AAAA,QAChB,iBAAiB;AAAA,QACjB;AAAA,MACF;AAAA,MACA;AAAA,QACE,IAAI;AAAA,QACJ,MAAM;AAAA,QACN,OAAO;AAAA,QACP,gBAAgB;AAAA,QAChB,iBAAiB;AAAA,QACjB;AAAA,MACF;AAAA,MACA;AAAA,QACE,IAAI;AAAA,QACJ,MAAM;AAAA,QACN,OAAO;AAAA,QACP,gBAAgB;AAAA,QAChB,iBAAiB;AAAA,QACjB;AAAA,MACF;AAAA,MACA;AAAA,QACE,IAAI;AAAA,QACJ,MAAM;AAAA,QACN,OAAO;AAAA,QACP,gBAAgB;AAAA,QAChB,iBAAiB;AAAA,QACjB;AAAA,MACF;AAAA,MACA;AAAA,QACE,IAAI;AAAA,QACJ,MAAM;AAAA,QACN,OAAO;AAAA,QACP,gBAAgB;AAAA,QAChB,iBAAiB;AAAA,QACjB;AAAA,MACF;AAAA,MACA;AAAA,QACE,IAAI;AAAA,QACJ,MAAM;AAAA,QACN,OAAO;AAAA,QACP,gBAAgB;AAAA,QAChB,iBAAiB;AAAA,QACjB;AAAA,MACF;AAAA,MACA;AAAA,QACE,IAAI;AAAA,QACJ,MAAM;AAAA,QACN,OAAO;AAAA,QACP,gBAAgB;AAAA,QAChB,iBAAiB;AAAA,QACjB;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -4,7 +4,7 @@ import { useRef, useState, useCallback } from "react";
|
|
|
4
4
|
import { DSInputText, DSInputTextName, DSInputTextSlots } from "@elliemae/ds-form-input-text";
|
|
5
5
|
import { styled } from "@elliemae/ds-system";
|
|
6
6
|
import { describe, useGetGlobalAttributes } from "@elliemae/ds-props-helpers";
|
|
7
|
-
import { useDerivedStateFromProps } from "
|
|
7
|
+
import { useDerivedStateFromProps } from "./useDerivedStateFromProps.js";
|
|
8
8
|
import { PageHeaderTitle } from "../page-header-title/index.js";
|
|
9
9
|
import { DSPageHeaderDataTestIds } from "../../exported-related/index.js";
|
|
10
10
|
import { PageHeaderEditableTitlePropTypes } from "./react-desc-prop-types.js";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/components/page-header-editable-title/PageHeaderEditableTitle.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useRef, useState, useCallback } from 'react';\nimport { DSInputText, DSInputTextName, DSInputTextSlots } from '@elliemae/ds-form-input-text';\nimport { styled } from '@elliemae/ds-system';\nimport { describe, useGetGlobalAttributes, type ValidationMap } from '@elliemae/ds-props-helpers';\nimport { useDerivedStateFromProps } from '
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useRef, useState, useCallback } from 'react';\nimport { DSInputText, DSInputTextName, DSInputTextSlots } from '@elliemae/ds-form-input-text';\nimport { styled } from '@elliemae/ds-system';\nimport { describe, useGetGlobalAttributes, type ValidationMap } from '@elliemae/ds-props-helpers';\nimport { useDerivedStateFromProps } from './useDerivedStateFromProps.js';\nimport { PageHeaderTitle } from '../page-header-title/index.js';\nimport { DSPageHeaderDataTestIds } from '../../exported-related/index.js';\nimport { PageHeaderEditableTitlePropTypes, type PageHeaderEditableTitleT } from './react-desc-prop-types.js';\n\nconst EditableContainer = styled('div')`\n height: 32px;\n position: relative;\n overflow: hidden;\n &.editable-title-component {\n position: relative;\n left: -7px;\n top: -1px;\n margin-left: -2px;\n margin-right: -9px;\n & .${DSInputTextName}-${DSInputTextSlots.INPUT_WRAPPER} {\n height: 32px;\n }\n & .${DSInputTextName}-${DSInputTextSlots.INPUT} {\n font-size: ${({ theme }) => theme.fontSizes.title[800]};\n line-height: normal;\n color: ${({ theme }) => theme.colors.neutral['700']};\n padding-top: 0px;\n padding-bottom: 0px;\n }\n }\n`;\n\nexport const PageHeaderEditableTitle = (props: PageHeaderEditableTitleT.Props) => {\n const { children: value, editing: editingProp, showMarker, ...rest } = props;\n const [titleValue, setTitleValue] = useState(value);\n const [hovered, setHovered] = useState(false);\n const [editing, setEditing] = useDerivedStateFromProps(editingProp || false);\n const titleRef = useRef<HTMLDivElement>(null);\n const width = titleRef.current?.offsetWidth || 0;\n\n const handleOnChange: React.ChangeEventHandler<HTMLInputElement> = useCallback((e) => {\n setTitleValue(e.target.value);\n }, []);\n\n const handleOnFocus: React.FocusEventHandler = useCallback(() => {\n setEditing(true);\n }, [setEditing]);\n\n const handleOnBlur: React.FocusEventHandler = useCallback(() => {\n setEditing(false);\n }, [setEditing]);\n\n const handleOnMouseOut: React.MouseEventHandler = useCallback(() => {\n setHovered(false);\n }, []);\n\n const globals = useGetGlobalAttributes(rest, {\n onFocus: handleOnFocus,\n onMouseOut: handleOnMouseOut,\n onChange: handleOnChange,\n onBlur: handleOnBlur,\n });\n\n return (\n <EditableContainer\n className={hovered || editing ? 'editable-title-component' : ''}\n onMouseEnter={() => setHovered(true)}\n onMouseLeave={() => setHovered(false)}\n data-testid={DSPageHeaderDataTestIds.EDITABLE_HEADER_TITLE}\n >\n {(hovered || editing) && (\n <DSInputText\n onChange={handleOnChange}\n {...rest}\n {...globals}\n placeholder=\"\"\n style={{ width: width + 10, minWidth: '260px', maxWidth: '100%' }}\n value={titleValue}\n />\n )}\n <div ref={titleRef} style={{ width: 'fit-content' }}>\n <PageHeaderTitle showMarker={showMarker && !hovered && !editing}>{titleValue}</PageHeaderTitle>\n </div>\n </EditableContainer>\n );\n};\n\nPageHeaderEditableTitle.displayName = 'PageHeaderEditableTitle';\nconst DSPageHeaderEditableTitleWithSchema = describe(PageHeaderEditableTitle);\n\nDSPageHeaderEditableTitleWithSchema.propTypes = PageHeaderEditableTitlePropTypes as ValidationMap<unknown>;\n\nexport default PageHeaderEditableTitle;\n\nexport { DSPageHeaderEditableTitleWithSchema };\n"],
|
|
5
5
|
"mappings": "AAAA,YAAY,WAAW;ACgEnB,SAOI,KAPJ;AAhEJ,SAAgB,QAAQ,UAAU,mBAAmB;AACrD,SAAS,aAAa,iBAAiB,wBAAwB;AAC/D,SAAS,cAAc;AACvB,SAAS,UAAU,8BAAkD;AACrE,SAAS,gCAAgC;AACzC,SAAS,uBAAuB;AAChC,SAAS,+BAA+B;AACxC,SAAS,wCAAuE;AAEhF,MAAM,oBAAoB,OAAO,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,SAU7B,eAAe,IAAI,iBAAiB,aAAa;AAAA;AAAA;AAAA,SAGjD,eAAe,IAAI,iBAAiB,KAAK;AAAA,mBAC/B,CAAC,EAAE,MAAM,MAAM,MAAM,UAAU,MAAM,GAAG,CAAC;AAAA;AAAA,eAE7C,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ,KAAK,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAOlD,MAAM,0BAA0B,CAAC,UAA0C;AAChF,QAAM,EAAE,UAAU,OAAO,SAAS,aAAa,YAAY,GAAG,KAAK,IAAI;AACvE,QAAM,CAAC,YAAY,aAAa,IAAI,SAAS,KAAK;AAClD,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,KAAK;AAC5C,QAAM,CAAC,SAAS,UAAU,IAAI,yBAAyB,eAAe,KAAK;AAC3E,QAAM,WAAW,OAAuB,IAAI;AAC5C,QAAM,QAAQ,SAAS,SAAS,eAAe;AAE/C,QAAM,iBAA6D,YAAY,CAAC,MAAM;AACpF,kBAAc,EAAE,OAAO,KAAK;AAAA,EAC9B,GAAG,CAAC,CAAC;AAEL,QAAM,gBAAyC,YAAY,MAAM;AAC/D,eAAW,IAAI;AAAA,EACjB,GAAG,CAAC,UAAU,CAAC;AAEf,QAAM,eAAwC,YAAY,MAAM;AAC9D,eAAW,KAAK;AAAA,EAClB,GAAG,CAAC,UAAU,CAAC;AAEf,QAAM,mBAA4C,YAAY,MAAM;AAClE,eAAW,KAAK;AAAA,EAClB,GAAG,CAAC,CAAC;AAEL,QAAM,UAAU,uBAAuB,MAAM;AAAA,IAC3C,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,QAAQ;AAAA,EACV,CAAC;AAED,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,WAAW,UAAU,6BAA6B;AAAA,MAC7D,cAAc,MAAM,WAAW,IAAI;AAAA,MACnC,cAAc,MAAM,WAAW,KAAK;AAAA,MACpC,eAAa,wBAAwB;AAAA,MAEnC;AAAA,oBAAW,YACX;AAAA,UAAC;AAAA;AAAA,YACC,UAAU;AAAA,YACT,GAAG;AAAA,YACH,GAAG;AAAA,YACJ,aAAY;AAAA,YACZ,OAAO,EAAE,OAAO,QAAQ,IAAI,UAAU,SAAS,UAAU,OAAO;AAAA,YAChE,OAAO;AAAA;AAAA,QACT;AAAA,QAEF,oBAAC,SAAI,KAAK,UAAU,OAAO,EAAE,OAAO,cAAc,GAChD,8BAAC,mBAAgB,YAAY,cAAc,CAAC,WAAW,CAAC,SAAU,sBAAW,GAC/E;AAAA;AAAA;AAAA,EACF;AAEJ;AAEA,wBAAwB,cAAc;AACtC,MAAM,sCAAsC,SAAS,uBAAuB;AAE5E,oCAAoC,YAAY;AAEhD,IAAO,kCAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import { useRef, useState } from "react";
|
|
3
|
+
import { isEqual, isFunction } from "lodash";
|
|
4
|
+
const defaultPropUpdateOnChange = (prop) => prop;
|
|
5
|
+
function defaultShouldUpdate({ prop, prevProp, stateValue }) {
|
|
6
|
+
return !isEqual(prop, prevProp) && !isEqual(prop, stateValue);
|
|
7
|
+
}
|
|
8
|
+
function setStateWithUpdate(onUpdate, setState) {
|
|
9
|
+
return (state) => {
|
|
10
|
+
setState((prevState) => onUpdate(isFunction(state) ? state(prevState) : state, prevState));
|
|
11
|
+
};
|
|
12
|
+
}
|
|
13
|
+
const useDerivedStateFromProps = (prop, options = {}) => {
|
|
14
|
+
const {
|
|
15
|
+
onUpdate = defaultPropUpdateOnChange,
|
|
16
|
+
shouldUpdate = defaultShouldUpdate,
|
|
17
|
+
updateOnStateChange = false
|
|
18
|
+
} = options;
|
|
19
|
+
const [stateValue, setState] = useState(onUpdate(prop, {}));
|
|
20
|
+
const handleSetState = updateOnStateChange ? setStateWithUpdate(onUpdate, setState) : setState;
|
|
21
|
+
const prevProp = useRef(prop);
|
|
22
|
+
if (shouldUpdate({
|
|
23
|
+
prop,
|
|
24
|
+
prevProp: prevProp.current,
|
|
25
|
+
stateValue
|
|
26
|
+
})) {
|
|
27
|
+
const nextProp = onUpdate(prop, prevProp.current);
|
|
28
|
+
setState(nextProp);
|
|
29
|
+
}
|
|
30
|
+
prevProp.current = prop;
|
|
31
|
+
return [stateValue, handleSetState];
|
|
32
|
+
};
|
|
33
|
+
var useDerivedStateFromProps_default = useDerivedStateFromProps;
|
|
34
|
+
export {
|
|
35
|
+
useDerivedStateFromProps_default as default,
|
|
36
|
+
useDerivedStateFromProps
|
|
37
|
+
};
|
|
38
|
+
//# sourceMappingURL=useDerivedStateFromProps.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/components/page-header-editable-title/useDerivedStateFromProps.ts"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type React from 'react';\nimport { useRef, useState } from 'react';\nimport { isEqual, isFunction } from 'lodash';\n\ninterface ShouldUpdateArg {\n prop: unknown;\n prevProp: unknown;\n stateValue: unknown;\n}\n\ntype OnUpdateT<T> = (prop: T, prevProp?: T | Record<string, never>) => T;\n\ninterface OptionsT<T> {\n onUpdate?: OnUpdateT<T>;\n shouldUpdate?: (arg: ShouldUpdateArg) => boolean;\n updateOnStateChange?: boolean;\n}\n\nconst defaultPropUpdateOnChange = <T>(prop: T) => prop;\n\nfunction defaultShouldUpdate({ prop, prevProp, stateValue }: ShouldUpdateArg) {\n return !isEqual(prop, prevProp) && !isEqual(prop, stateValue);\n}\n\nfunction setStateWithUpdate<T>(onUpdate: OnUpdateT<T>, setState: React.Dispatch<React.SetStateAction<T>>) {\n return (state: React.SetStateAction<T>) => {\n setState((prevState: T) => onUpdate(isFunction(state) ? state(prevState) : state, prevState));\n };\n}\n\nexport const useDerivedStateFromProps = <T>(\n prop: T,\n options: OptionsT<T> = {},\n): [T, React.Dispatch<React.SetStateAction<T>>] => {\n const {\n onUpdate = defaultPropUpdateOnChange as OnUpdateT<T>,\n shouldUpdate = defaultShouldUpdate,\n updateOnStateChange = false,\n } = options;\n\n const [stateValue, setState] = useState(onUpdate(prop, {}));\n const handleSetState = updateOnStateChange ? setStateWithUpdate(onUpdate, setState) : setState;\n const prevProp = useRef(prop);\n\n if (\n shouldUpdate({\n prop,\n prevProp: prevProp.current,\n stateValue,\n })\n ) {\n const nextProp = onUpdate(prop, prevProp.current);\n setState(nextProp);\n }\n prevProp.current = prop;\n return [stateValue, handleSetState];\n};\n\nexport default useDerivedStateFromProps;\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,QAAQ,gBAAgB;AACjC,SAAS,SAAS,kBAAkB;AAgBpC,MAAM,4BAA4B,CAAI,SAAY;AAElD,SAAS,oBAAoB,EAAE,MAAM,UAAU,WAAW,GAAoB;AAC5E,SAAO,CAAC,QAAQ,MAAM,QAAQ,KAAK,CAAC,QAAQ,MAAM,UAAU;AAC9D;AAEA,SAAS,mBAAsB,UAAwB,UAAmD;AACxG,SAAO,CAAC,UAAmC;AACzC,aAAS,CAAC,cAAiB,SAAS,WAAW,KAAK,IAAI,MAAM,SAAS,IAAI,OAAO,SAAS,CAAC;AAAA,EAC9F;AACF;AAEO,MAAM,2BAA2B,CACtC,MACA,UAAuB,CAAC,MACyB;AACjD,QAAM;AAAA,IACJ,WAAW;AAAA,IACX,eAAe;AAAA,IACf,sBAAsB;AAAA,EACxB,IAAI;AAEJ,QAAM,CAAC,YAAY,QAAQ,IAAI,SAAS,SAAS,MAAM,CAAC,CAAC,CAAC;AAC1D,QAAM,iBAAiB,sBAAsB,mBAAmB,UAAU,QAAQ,IAAI;AACtF,QAAM,WAAW,OAAO,IAAI;AAE5B,MACE,aAAa;AAAA,IACX;AAAA,IACA,UAAU,SAAS;AAAA,IACnB;AAAA,EACF,CAAC,GACD;AACA,UAAM,WAAW,SAAS,MAAM,SAAS,OAAO;AAChD,aAAS,QAAQ;AAAA,EACnB;AACA,WAAS,UAAU;AACnB,SAAO,CAAC,YAAY,cAAc;AACpC;AAEA,IAAO,mCAAQ;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
package/dist/esm/tests/utils.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/tests/utils.js"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { logger } from '@elliemae/ds-
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { logger } from '@elliemae/ds-system';\n\nconst subItems = [\n {\n id: 'id3',\n label: 'SubMenu List Item-1',\n onClick: (e) => logger(e, 'subMenu id3'),\n },\n {\n id: 'id4',\n type: 'subMenu',\n label: 'SubMenu List Item-2',\n onClick: (e) => logger(e, 'subMenu id4'),\n subItems: [\n {\n id: 'id5',\n label: 'SubMenu List Item-2',\n onClick: (e) => logger(e, 'subMenu id5'),\n },\n ],\n },\n];\n\nexport const options = [\n {\n type: 'SelectionGroup',\n id: 'select-option',\n multi: false,\n closeOnClick: false,\n interactionType: 'click',\n items: [\n {\n id: 'id-1',\n selectable: true,\n type: 'subMenu',\n label: 'View Example 123',\n rightAddonType: 'elipsis',\n interactionType: 'click',\n subItems,\n },\n {\n id: 'id-2',\n type: 'subMenu',\n label: 'Option 2',\n rightAddonType: 'elipsis',\n interactionType: 'click',\n subItems,\n },\n {\n id: 'id-3',\n type: 'subMenu',\n label: 'Option 3',\n rightAddonType: 'elipsis',\n interactionType: 'click',\n subItems,\n },\n {\n id: 'id-4',\n type: 'subMenu',\n label: 'Option 4',\n rightAddonType: 'elipsis',\n interactionType: 'click',\n subItems,\n },\n {\n id: 'id-5',\n type: 'subMenu',\n label: 'Option 5',\n rightAddonType: 'elipsis',\n interactionType: 'click',\n subItems,\n },\n {\n id: 'id-6',\n type: 'subMenu',\n label: 'Option 6',\n rightAddonType: 'elipsis',\n interactionType: 'click',\n subItems,\n },\n {\n id: 'id-7',\n type: 'subMenu',\n label: 'Truncate long option Other Custom View Long Long Long Long Long',\n rightAddonType: 'elipsis',\n interactionType: 'click',\n subItems,\n },\n ],\n },\n];\n"],
|
|
5
5
|
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,cAAc;AAEvB,MAAM,WAAW;AAAA,EACf;AAAA,IACE,IAAI;AAAA,IACJ,OAAO;AAAA,IACP,SAAS,CAAC,MAAM,OAAO,GAAG,aAAa;AAAA,EACzC;AAAA,EACA;AAAA,IACE,IAAI;AAAA,IACJ,MAAM;AAAA,IACN,OAAO;AAAA,IACP,SAAS,CAAC,MAAM,OAAO,GAAG,aAAa;AAAA,IACvC,UAAU;AAAA,MACR;AAAA,QACE,IAAI;AAAA,QACJ,OAAO;AAAA,QACP,SAAS,CAAC,MAAM,OAAO,GAAG,aAAa;AAAA,MACzC;AAAA,IACF;AAAA,EACF;AACF;AAEO,MAAM,UAAU;AAAA,EACrB;AAAA,IACE,MAAM;AAAA,IACN,IAAI;AAAA,IACJ,OAAO;AAAA,IACP,cAAc;AAAA,IACd,iBAAiB;AAAA,IACjB,OAAO;AAAA,MACL;AAAA,QACE,IAAI;AAAA,QACJ,YAAY;AAAA,QACZ,MAAM;AAAA,QACN,OAAO;AAAA,QACP,gBAAgB;AAAA,QAChB,iBAAiB;AAAA,QACjB;AAAA,MACF;AAAA,MACA;AAAA,QACE,IAAI;AAAA,QACJ,MAAM;AAAA,QACN,OAAO;AAAA,QACP,gBAAgB;AAAA,QAChB,iBAAiB;AAAA,QACjB;AAAA,MACF;AAAA,MACA;AAAA,QACE,IAAI;AAAA,QACJ,MAAM;AAAA,QACN,OAAO;AAAA,QACP,gBAAgB;AAAA,QAChB,iBAAiB;AAAA,QACjB;AAAA,MACF;AAAA,MACA;AAAA,QACE,IAAI;AAAA,QACJ,MAAM;AAAA,QACN,OAAO;AAAA,QACP,gBAAgB;AAAA,QAChB,iBAAiB;AAAA,QACjB;AAAA,MACF;AAAA,MACA;AAAA,QACE,IAAI;AAAA,QACJ,MAAM;AAAA,QACN,OAAO;AAAA,QACP,gBAAgB;AAAA,QAChB,iBAAiB;AAAA,QACjB;AAAA,MACF;AAAA,MACA;AAAA,QACE,IAAI;AAAA,QACJ,MAAM;AAAA,QACN,OAAO;AAAA,QACP,gBAAgB;AAAA,QAChB,iBAAiB;AAAA,QACjB;AAAA,MACF;AAAA,MACA;AAAA,QACE,IAAI;AAAA,QACJ,MAAM;AAAA,QACN,OAAO;AAAA,QACP,gBAAgB;AAAA,QAChB,iBAAiB;AAAA,QACjB;AAAA,MACF;AAAA,IACF;AAAA,EACF;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import type React from 'react';
|
|
2
|
+
interface ShouldUpdateArg {
|
|
3
|
+
prop: unknown;
|
|
4
|
+
prevProp: unknown;
|
|
5
|
+
stateValue: unknown;
|
|
6
|
+
}
|
|
7
|
+
type OnUpdateT<T> = (prop: T, prevProp?: T | Record<string, never>) => T;
|
|
8
|
+
interface OptionsT<T> {
|
|
9
|
+
onUpdate?: OnUpdateT<T>;
|
|
10
|
+
shouldUpdate?: (arg: ShouldUpdateArg) => boolean;
|
|
11
|
+
updateOnStateChange?: boolean;
|
|
12
|
+
}
|
|
13
|
+
export declare const useDerivedStateFromProps: <T>(prop: T, options?: OptionsT<T>) => [T, React.Dispatch<React.SetStateAction<T>>];
|
|
14
|
+
export default useDerivedStateFromProps;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-page-header-v2",
|
|
3
|
-
"version": "3.37.0-rc.
|
|
3
|
+
"version": "3.37.0-rc.5",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Page Header V2",
|
|
6
6
|
"files": [
|
|
@@ -73,23 +73,22 @@
|
|
|
73
73
|
},
|
|
74
74
|
"dependencies": {
|
|
75
75
|
"prop-types": "~15.8.1",
|
|
76
|
-
"@elliemae/ds-
|
|
77
|
-
"@elliemae/ds-
|
|
78
|
-
"@elliemae/ds-
|
|
79
|
-
"@elliemae/ds-
|
|
80
|
-
"@elliemae/ds-
|
|
81
|
-
"@elliemae/ds-
|
|
82
|
-
"@elliemae/ds-
|
|
83
|
-
"@elliemae/ds-props-helpers": "3.37.0-rc.
|
|
84
|
-
"@elliemae/ds-
|
|
85
|
-
"@elliemae/ds-
|
|
86
|
-
"@elliemae/ds-
|
|
87
|
-
"@elliemae/ds-utilities": "3.37.0-rc.3"
|
|
76
|
+
"@elliemae/ds-form": "3.37.0-rc.5",
|
|
77
|
+
"@elliemae/ds-grid": "3.37.0-rc.5",
|
|
78
|
+
"@elliemae/ds-skeleton": "3.37.0-rc.5",
|
|
79
|
+
"@elliemae/ds-icons": "3.37.0-rc.5",
|
|
80
|
+
"@elliemae/ds-system": "3.37.0-rc.5",
|
|
81
|
+
"@elliemae/ds-truncated-tooltip-text": "3.37.0-rc.5",
|
|
82
|
+
"@elliemae/ds-button": "3.37.0-rc.5",
|
|
83
|
+
"@elliemae/ds-props-helpers": "3.37.0-rc.5",
|
|
84
|
+
"@elliemae/ds-breadcrumb": "3.37.0-rc.5",
|
|
85
|
+
"@elliemae/ds-icon": "3.37.0-rc.5",
|
|
86
|
+
"@elliemae/ds-form-input-text": "3.37.0-rc.5"
|
|
88
87
|
},
|
|
89
88
|
"devDependencies": {
|
|
90
89
|
"@elliemae/pui-cli": "9.0.0-next.50",
|
|
91
90
|
"styled-components": "~5.3.9",
|
|
92
|
-
"@elliemae/ds-monorepo-devops": "3.37.0-rc.
|
|
91
|
+
"@elliemae/ds-monorepo-devops": "3.37.0-rc.5"
|
|
93
92
|
},
|
|
94
93
|
"peerDependencies": {
|
|
95
94
|
"lodash": "^4.17.21",
|