@elliemae/ds-accordion 3.16.0 → 3.16.1
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/DSAccordion.js +9 -5
- package/dist/cjs/DSAccordion.js.map +2 -2
- package/dist/cjs/DSAccordionCTX.js +4 -0
- package/dist/cjs/DSAccordionCTX.js.map +2 -2
- package/dist/cjs/config/useAccordion.js +6 -2
- package/dist/cjs/config/useAccordion.js.map +2 -2
- package/dist/cjs/config/useAccordionRefs.js +4 -0
- package/dist/cjs/config/useAccordionRefs.js.map +2 -2
- package/dist/cjs/defaultProps.js +4 -0
- package/dist/cjs/defaultProps.js.map +2 -2
- package/dist/cjs/exported-related/DSAccordionDatatestid.js +4 -0
- package/dist/cjs/exported-related/DSAccordionDatatestid.js.map +1 -1
- package/dist/cjs/exported-related/index.js +6 -2
- package/dist/cjs/exported-related/index.js.map +2 -2
- package/dist/cjs/exported-related/theming.js +4 -0
- package/dist/cjs/exported-related/theming.js.map +1 -1
- package/dist/cjs/index.js +8 -4
- package/dist/cjs/index.js.map +2 -2
- package/dist/cjs/package.json +7 -0
- package/dist/cjs/parts/accordionContent/AccordionContent.js +7 -3
- package/dist/cjs/parts/accordionContent/AccordionContent.js.map +2 -2
- package/dist/cjs/parts/accordionContent/styles.js +5 -1
- package/dist/cjs/parts/accordionContent/styles.js.map +2 -2
- package/dist/cjs/parts/accordionItem/DSAccordionItem.js +15 -6
- package/dist/cjs/parts/accordionItem/DSAccordionItem.js.map +2 -2
- package/dist/cjs/parts/accordionItem/styles.js +5 -1
- package/dist/cjs/parts/accordionItem/styles.js.map +2 -2
- package/dist/cjs/parts/accordionItem/useAccordionItem.js +5 -1
- package/dist/cjs/parts/accordionItem/useAccordionItem.js.map +2 -2
- package/dist/cjs/propTypes.js +4 -0
- package/dist/cjs/propTypes.js.map +1 -1
- package/dist/cjs/react-desc-prop-types.js +6 -2
- package/dist/cjs/react-desc-prop-types.js.map +2 -2
- package/dist/cjs/sharedTypes.js +4 -0
- package/dist/cjs/sharedTypes.js.map +1 -1
- package/dist/esm/DSAccordion.js +5 -5
- package/dist/esm/DSAccordion.js.map +1 -1
- package/dist/esm/DSAccordionCTX.js.map +1 -1
- package/dist/esm/config/useAccordion.js +2 -2
- package/dist/esm/config/useAccordion.js.map +1 -1
- package/dist/esm/config/useAccordionRefs.js.map +2 -2
- package/dist/esm/defaultProps.js.map +1 -1
- package/dist/esm/exported-related/index.js +2 -2
- package/dist/esm/exported-related/index.js.map +1 -1
- package/dist/esm/index.js +4 -4
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/package.json +7 -0
- package/dist/esm/parts/accordionContent/AccordionContent.js +3 -3
- package/dist/esm/parts/accordionContent/AccordionContent.js.map +2 -2
- package/dist/esm/parts/accordionContent/styles.js +1 -1
- package/dist/esm/parts/accordionContent/styles.js.map +1 -1
- package/dist/esm/parts/accordionItem/DSAccordionItem.js +11 -6
- package/dist/esm/parts/accordionItem/DSAccordionItem.js.map +2 -2
- package/dist/esm/parts/accordionItem/styles.js +1 -1
- package/dist/esm/parts/accordionItem/styles.js.map +2 -2
- package/dist/esm/parts/accordionItem/useAccordionItem.js +1 -1
- package/dist/esm/parts/accordionItem/useAccordionItem.js.map +2 -2
- package/dist/esm/react-desc-prop-types.js +2 -2
- package/dist/esm/react-desc-prop-types.js.map +2 -2
- package/dist/types/DSAccordion.d.ts +2 -2
- package/dist/types/DSAccordionCTX.d.ts +2 -2
- package/dist/types/config/useAccordion.d.ts +2 -2
- package/dist/types/config/useAccordionRefs.d.ts +2 -2
- package/dist/types/defaultProps.d.ts +1 -1
- package/dist/types/exported-related/index.d.ts +2 -2
- package/dist/types/index.d.ts +4 -4
- package/dist/types/parts/accordionItem/DSAccordionItem.d.ts +2 -2
- package/dist/types/react-desc-prop-types.d.ts +897 -897
- package/dist/types/tests/a11y/axe.test.d.ts +1 -0
- package/package.json +9 -8
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/accordionItem/useAccordionItem.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import type React from 'react';\nimport { useCallback, useContext, useMemo } from 'react';\nimport { DSAccordionContext } from '../../DSAccordionCTX';\n\nexport interface UseAccordionItemPropsT {\n value: string | number;\n disabled: boolean;\n}\n\ninterface UseAccordionItemReturnTypeT {\n handleOnClick: (e: React.MouseEvent) => void;\n handleOnKeyDown: (e: React.KeyboardEvent, dsIndex: number) => void;\n selected: boolean;\n}\n\nexport const useAccordionItem = ({ value, disabled }: UseAccordionItemPropsT): UseAccordionItemReturnTypeT => {\n const { actualActiveValue, setActiveValues, focusableChildrenReferences } = useContext(DSAccordionContext);\n\n const selected = useMemo(() => {\n if (Array.isArray(actualActiveValue)) {\n return actualActiveValue.some((currentValue) => currentValue === value);\n }\n return value === actualActiveValue;\n }, [actualActiveValue, value]);\n\n const handleOnClick = useCallback(\n (e: React.MouseEvent) => {\n if (!disabled) setActiveValues(value, e);\n },\n [disabled, setActiveValues, value],\n );\n\n const handleOnKeyDown = useCallback(\n (e: React.KeyboardEvent, _dsIndex: number) => {\n if (!disabled && e.key === 'ArrowDown') {\n const currentIndex = focusableChildrenReferences.findIndex((item) => item.index === _dsIndex);\n if (focusableChildrenReferences[currentIndex + 1]?.ref?.current)\n focusableChildrenReferences[currentIndex + 1]?.ref?.current?.focus();\n else if (currentIndex === focusableChildrenReferences.length - 1) {\n focusableChildrenReferences[0]?.ref?.current?.focus();\n }\n }\n\n if (!disabled && e.key === 'ArrowUp') {\n const currentIndex = focusableChildrenReferences.findIndex((item) => item.index === _dsIndex);\n if (focusableChildrenReferences[currentIndex - 1]?.ref?.current)\n focusableChildrenReferences[currentIndex - 1]?.ref?.current?.focus();\n else if (currentIndex === 0) {\n focusableChildrenReferences[focusableChildrenReferences.length - 1]?.ref?.current?.focus();\n }\n }\n },\n [disabled, focusableChildrenReferences],\n );\n\n return {\n handleOnClick,\n handleOnKeyDown,\n selected,\n };\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["import type React from 'react';\nimport { useCallback, useContext, useMemo } from 'react';\nimport { DSAccordionContext } from '../../DSAccordionCTX.js';\n\nexport interface UseAccordionItemPropsT {\n value: string | number;\n disabled: boolean;\n}\n\ninterface UseAccordionItemReturnTypeT {\n handleOnClick: (e: React.MouseEvent) => void;\n handleOnKeyDown: (e: React.KeyboardEvent, dsIndex: number) => void;\n selected: boolean;\n}\n\nexport const useAccordionItem = ({ value, disabled }: UseAccordionItemPropsT): UseAccordionItemReturnTypeT => {\n const { actualActiveValue, setActiveValues, focusableChildrenReferences } = useContext(DSAccordionContext);\n\n const selected = useMemo(() => {\n if (Array.isArray(actualActiveValue)) {\n return actualActiveValue.some((currentValue) => currentValue === value);\n }\n return value === actualActiveValue;\n }, [actualActiveValue, value]);\n\n const handleOnClick = useCallback(\n (e: React.MouseEvent) => {\n if (!disabled) setActiveValues(value, e);\n },\n [disabled, setActiveValues, value],\n );\n\n const handleOnKeyDown = useCallback(\n (e: React.KeyboardEvent, _dsIndex: number) => {\n if (!disabled && e.key === 'ArrowDown') {\n const currentIndex = focusableChildrenReferences.findIndex((item) => item.index === _dsIndex);\n if (focusableChildrenReferences[currentIndex + 1]?.ref?.current)\n focusableChildrenReferences[currentIndex + 1]?.ref?.current?.focus();\n else if (currentIndex === focusableChildrenReferences.length - 1) {\n focusableChildrenReferences[0]?.ref?.current?.focus();\n }\n }\n\n if (!disabled && e.key === 'ArrowUp') {\n const currentIndex = focusableChildrenReferences.findIndex((item) => item.index === _dsIndex);\n if (focusableChildrenReferences[currentIndex - 1]?.ref?.current)\n focusableChildrenReferences[currentIndex - 1]?.ref?.current?.focus();\n else if (currentIndex === 0) {\n focusableChildrenReferences[focusableChildrenReferences.length - 1]?.ref?.current?.focus();\n }\n }\n },\n [disabled, focusableChildrenReferences],\n );\n\n return {\n handleOnClick,\n handleOnKeyDown,\n selected,\n };\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAiD;AACjD,4BAAmC;AAa5B,MAAM,mBAAmB,CAAC,EAAE,OAAO,SAAS,MAA2D;AAC5G,QAAM,EAAE,mBAAmB,iBAAiB,4BAA4B,QAAI,yBAAW,wCAAkB;AAEzG,QAAM,eAAW,sBAAQ,MAAM;AAC7B,QAAI,MAAM,QAAQ,iBAAiB,GAAG;AACpC,aAAO,kBAAkB,KAAK,CAAC,iBAAiB,iBAAiB,KAAK;AAAA,IACxE;AACA,WAAO,UAAU;AAAA,EACnB,GAAG,CAAC,mBAAmB,KAAK,CAAC;AAE7B,QAAM,oBAAgB;AAAA,IACpB,CAAC,MAAwB;AACvB,UAAI,CAAC;AAAU,wBAAgB,OAAO,CAAC;AAAA,IACzC;AAAA,IACA,CAAC,UAAU,iBAAiB,KAAK;AAAA,EACnC;AAEA,QAAM,sBAAkB;AAAA,IACtB,CAAC,GAAwB,aAAqB;AAC5C,UAAI,CAAC,YAAY,EAAE,QAAQ,aAAa;AACtC,cAAM,eAAe,4BAA4B,UAAU,CAAC,SAAS,KAAK,UAAU,QAAQ;AAC5F,YAAI,4BAA4B,eAAe,CAAC,GAAG,KAAK;AACtD,sCAA4B,eAAe,CAAC,GAAG,KAAK,SAAS,MAAM;AAAA,iBAC5D,iBAAiB,4BAA4B,SAAS,GAAG;AAChE,sCAA4B,CAAC,GAAG,KAAK,SAAS,MAAM;AAAA,QACtD;AAAA,MACF;AAEA,UAAI,CAAC,YAAY,EAAE,QAAQ,WAAW;AACpC,cAAM,eAAe,4BAA4B,UAAU,CAAC,SAAS,KAAK,UAAU,QAAQ;AAC5F,YAAI,4BAA4B,eAAe,CAAC,GAAG,KAAK;AACtD,sCAA4B,eAAe,CAAC,GAAG,KAAK,SAAS,MAAM;AAAA,iBAC5D,iBAAiB,GAAG;AAC3B,sCAA4B,4BAA4B,SAAS,CAAC,GAAG,KAAK,SAAS,MAAM;AAAA,QAC3F;AAAA,MACF;AAAA,IACF;AAAA,IACA,CAAC,UAAU,2BAA2B;AAAA,EACxC;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/propTypes.js
CHANGED
|
@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
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.
|
|
21
25
|
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
26
|
mod
|
|
23
27
|
));
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/propTypes.ts", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import { PropTypes } from '@elliemae/ds-props-helpers';\n\nexport const accordionItemPropTypes = {\n children: PropTypes.node.description('Dimsum AccordionItem content.').isRequired,\n title: PropTypes.string.description('Set a primary title.'),\n value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description(\n 'Dimsum AccordionItem value, this value should be unique.',\n ).isRequired,\n iconClosed: PropTypes.node.description('Custom Dimsum Icon when it is closed.'),\n iconOpened: PropTypes.node.description('Custom Dimsum Icon when it is open.'),\n secondaryTitle: PropTypes.string.description('Set a secondary title'),\n customActions: PropTypes.arrayOf(PropTypes.object)\n .description('Set Dimsum AccordionItem custom actions.')\n .deprecated({ version: '3.x' }),\n renderCustomActions: PropTypes.func\n .description(\n 'This property will render any JSX in the custom actions area. You can access to all references and active values within the props.',\n )\n .deprecated({ version: '3.x' }),\n};\n\nexport const accordionPropTypes = {\n containerProps: PropTypes.object.description('Adds props to the container.'),\n activeValue: PropTypes.oneOfType([\n PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])),\n PropTypes.string,\n PropTypes.number,\n ]).description('Selected active value. This property makes the component a controlled one.'),\n children: PropTypes.node.description('Dimsum AccordionItems to show.'),\n allowMultipleOpen: PropTypes.bool.description('Allows multiple Dimsum AccordionItems to be open at the same time.'),\n onChange: PropTypes.func.description('Callback function once the Dimsum Accordion changes.'),\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,8BAA0B;AAEnB,MAAM,yBAAyB;AAAA,EACpC,UAAU,kCAAU,KAAK,YAAY,+BAA+B,EAAE;AAAA,EACtE,OAAO,kCAAU,OAAO,YAAY,sBAAsB;AAAA,EAC1D,OAAO,kCAAU,UAAU,CAAC,kCAAU,QAAQ,kCAAU,MAAM,CAAC,EAAE;AAAA,IAC/D;AAAA,EACF,EAAE;AAAA,EACF,YAAY,kCAAU,KAAK,YAAY,uCAAuC;AAAA,EAC9E,YAAY,kCAAU,KAAK,YAAY,qCAAqC;AAAA,EAC5E,gBAAgB,kCAAU,OAAO,YAAY,uBAAuB;AAAA,EACpE,eAAe,kCAAU,QAAQ,kCAAU,MAAM,EAC9C,YAAY,0CAA0C,EACtD,WAAW,EAAE,SAAS,MAAM,CAAC;AAAA,EAChC,qBAAqB,kCAAU,KAC5B;AAAA,IACC;AAAA,EACF,EACC,WAAW,EAAE,SAAS,MAAM,CAAC;AAClC;AAEO,MAAM,qBAAqB;AAAA,EAChC,gBAAgB,kCAAU,OAAO,YAAY,8BAA8B;AAAA,EAC3E,aAAa,kCAAU,UAAU;AAAA,IAC/B,kCAAU,QAAQ,kCAAU,UAAU,CAAC,kCAAU,QAAQ,kCAAU,MAAM,CAAC,CAAC;AAAA,IAC3E,kCAAU;AAAA,IACV,kCAAU;AAAA,EACZ,CAAC,EAAE,YAAY,4EAA4E;AAAA,EAC3F,UAAU,kCAAU,KAAK,YAAY,gCAAgC;AAAA,EACrE,mBAAmB,kCAAU,KAAK,YAAY,oEAAoE;AAAA,EAClH,UAAU,kCAAU,KAAK,YAAY,sDAAsD;AAC7F;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
18
18
|
return to;
|
|
19
19
|
};
|
|
20
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.
|
|
21
25
|
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
26
|
mod
|
|
23
27
|
));
|
|
@@ -41,7 +45,7 @@ const accordionItemPropTypes = {
|
|
|
41
45
|
iconClosed: import_ds_props_helpers.PropTypes.node.description("Custom Dimsum Icon when it is closed.").deprecated({ version: "3.x" }),
|
|
42
46
|
iconOpened: import_ds_props_helpers.PropTypes.node.description("Custom Dimsum Icon when it is open.").deprecated({ version: "3.x" }),
|
|
43
47
|
secondaryTitle: import_ds_props_helpers.PropTypes.string.description("Set a secondary title"),
|
|
44
|
-
xStyledPropsContent: import_ds_props_helpers.PropTypes.
|
|
48
|
+
xStyledPropsContent: import_ds_props_helpers.PropTypes.shape(import_ds_props_helpers.xstyledPropTypes).description(
|
|
45
49
|
"This property is xStyledProps object to apply in the content wrapper"
|
|
46
50
|
),
|
|
47
51
|
customActions: import_ds_props_helpers.PropTypes.arrayOf(import_ds_props_helpers.PropTypes.object).description("Set Dimsum AccordionItem custom actions.").deprecated({ version: "3.x" }),
|
|
@@ -55,7 +59,7 @@ const accordionItemPropTypes = {
|
|
|
55
59
|
const accordionPropTypes = {
|
|
56
60
|
...import_ds_props_helpers.globalAttributesPropTypes,
|
|
57
61
|
...import_ds_props_helpers.xstyledPropTypes,
|
|
58
|
-
containerProps: import_ds_props_helpers.PropTypes.object.description("Adds props to the container."),
|
|
62
|
+
containerProps: import_ds_props_helpers.PropTypes.object.description("Adds props to the container.").deprecated({ version: "4.x" }),
|
|
59
63
|
activeValue: import_ds_props_helpers.PropTypes.oneOfType([
|
|
60
64
|
import_ds_props_helpers.PropTypes.arrayOf(import_ds_props_helpers.PropTypes.oneOfType([import_ds_props_helpers.PropTypes.string, import_ds_props_helpers.PropTypes.number])),
|
|
61
65
|
import_ds_props_helpers.PropTypes.string,
|
|
@@ -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 React from 'react';\nimport { PropTypes, globalAttributesPropTypes, xstyledPropTypes, type XstyledProps } from '@elliemae/ds-props-helpers';\nimport type { DSAccordionInternalsT } from './sharedTypes';\n\nexport declare namespace DSAccordionT {\n export interface DefaultProps {\n containerProps: Record<string, unknown>;\n allowMultipleOpen: boolean;\n onChange: (value: (string | number)[] | string | number | null, e: React.MouseEvent | React.KeyboardEvent) => void;\n children: React.ReactElement<InternalItemProps>[];\n isDSMobile: boolean;\n }\n\n export interface OptionalProps {\n activeValue?: DSAccordionInternalsT.InternalActiveValue;\n }\n\n export interface RequiredProps {\n children: React.ReactElement<ItemProps>[];\n }\n\n export interface Props extends OptionalProps, Partial<Omit<DefaultProps, 'children'>>, RequiredProps {}\n\n export interface ItemDefaultProps {\n iconClosed: React.MemoExoticComponent<React.FunctionComponent<DSAccordionInternalsT.DefaultIconProps>>;\n iconOpened: React.MemoExoticComponent<React.FunctionComponent<DSAccordionInternalsT.DefaultIconProps>>;\n title: string;\n customActions: DSAccordionInternalsT.CustomActions[];\n disabled: boolean;\n xStyledPropsContent: XstyledProps;\n }\n\n export interface ItemOptionalProps {\n secondaryTitle?: string;\n renderCustomActions?: (props: {\n allRefs: DSAccordionInternalsT.AllChildrenReferences;\n actualActiveValue: DSAccordionInternalsT.InternalActiveValue;\n }) => JSX.Element;\n CustomActions?: React.ComponentType<{\n allRefs: DSAccordionInternalsT.AllChildrenReferences;\n actualActiveValue: DSAccordionInternalsT.InternalActiveValue;\n }>;\n }\n\n export interface ItemRequiredProps {\n children: React.ReactNode;\n value: string | number;\n }\n\n export interface ItemProps extends ItemRequiredProps, ItemOptionalProps, Partial<ItemDefaultProps> {}\n\n export interface InternalItemProps\n extends ItemRequiredProps,\n ItemOptionalProps,\n Omit<ItemDefaultProps, 'disabled' | 'customActions' | 'iconClosed' | 'iconOpened'> {\n dsIndex: number;\n disabled: boolean;\n customActions: DSAccordionInternalsT.CustomActions[];\n iconClosed: React.MemoExoticComponent<React.FunctionComponent<DSAccordionInternalsT.DefaultIconProps>>;\n iconOpened: React.MemoExoticComponent<React.FunctionComponent<DSAccordionInternalsT.DefaultIconProps>>;\n }\n\n export interface InternalProps\n extends OptionalProps,\n Partial<Omit<DefaultProps, 'children' | 'isDSMobile' | 'onChange'>> {\n children: React.ReactElement<InternalItemProps>[];\n isDSMobile: boolean;\n onChange: (value: (string | number)[] | string | number | null, e: React.MouseEvent | React.KeyboardEvent) => void;\n }\n}\n\nexport const accordionItemPropTypes = {\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n children: PropTypes.node.description('Dimsum AccordionItem content.').isRequired,\n title: PropTypes.string.description('Set a primary title.'),\n value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description(\n 'Dimsum AccordionItem value, this value should be unique.',\n ).isRequired,\n iconClosed: PropTypes.node.description('Custom Dimsum Icon when it is closed.').deprecated({ version: '3.x' }),\n iconOpened: PropTypes.node.description('Custom Dimsum Icon when it is open.').deprecated({ version: '3.x' }),\n secondaryTitle: PropTypes.string.description('Set a secondary title'),\n xStyledPropsContent: PropTypes.
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["import type React from 'react';\nimport { PropTypes, globalAttributesPropTypes, xstyledPropTypes, type XstyledProps } from '@elliemae/ds-props-helpers';\nimport type { DSAccordionInternalsT } from './sharedTypes.js';\n\nexport declare namespace DSAccordionT {\n export interface DefaultProps {\n containerProps: Record<string, unknown>;\n allowMultipleOpen: boolean;\n onChange: (value: (string | number)[] | string | number | null, e: React.MouseEvent | React.KeyboardEvent) => void;\n children: React.ReactElement<InternalItemProps>[];\n isDSMobile: boolean;\n }\n\n export interface OptionalProps {\n activeValue?: DSAccordionInternalsT.InternalActiveValue;\n }\n\n export interface RequiredProps {\n children: React.ReactElement<ItemProps>[];\n }\n\n export interface Props extends OptionalProps, Partial<Omit<DefaultProps, 'children'>>, RequiredProps {}\n\n export interface ItemDefaultProps {\n iconClosed: React.MemoExoticComponent<React.FunctionComponent<DSAccordionInternalsT.DefaultIconProps>>;\n iconOpened: React.MemoExoticComponent<React.FunctionComponent<DSAccordionInternalsT.DefaultIconProps>>;\n title: string;\n customActions: DSAccordionInternalsT.CustomActions[];\n disabled: boolean;\n xStyledPropsContent: XstyledProps;\n }\n\n export interface ItemOptionalProps {\n secondaryTitle?: string;\n renderCustomActions?: (props: {\n allRefs: DSAccordionInternalsT.AllChildrenReferences;\n actualActiveValue: DSAccordionInternalsT.InternalActiveValue;\n }) => JSX.Element;\n CustomActions?: React.ComponentType<{\n allRefs: DSAccordionInternalsT.AllChildrenReferences;\n actualActiveValue: DSAccordionInternalsT.InternalActiveValue;\n }>;\n }\n\n export interface ItemRequiredProps {\n children: React.ReactNode;\n value: string | number;\n }\n\n export interface ItemProps extends ItemRequiredProps, ItemOptionalProps, Partial<ItemDefaultProps> {}\n\n export interface InternalItemProps\n extends ItemRequiredProps,\n ItemOptionalProps,\n Omit<ItemDefaultProps, 'disabled' | 'customActions' | 'iconClosed' | 'iconOpened'> {\n dsIndex: number;\n disabled: boolean;\n customActions: DSAccordionInternalsT.CustomActions[];\n iconClosed: React.MemoExoticComponent<React.FunctionComponent<DSAccordionInternalsT.DefaultIconProps>>;\n iconOpened: React.MemoExoticComponent<React.FunctionComponent<DSAccordionInternalsT.DefaultIconProps>>;\n }\n\n export interface InternalProps\n extends OptionalProps,\n Partial<Omit<DefaultProps, 'children' | 'isDSMobile' | 'onChange'>> {\n children: React.ReactElement<InternalItemProps>[];\n isDSMobile: boolean;\n onChange: (value: (string | number)[] | string | number | null, e: React.MouseEvent | React.KeyboardEvent) => void;\n }\n}\n\nexport const accordionItemPropTypes = {\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n children: PropTypes.node.description('Dimsum AccordionItem content.').isRequired,\n title: PropTypes.string.description('Set a primary title.'),\n value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description(\n 'Dimsum AccordionItem value, this value should be unique.',\n ).isRequired,\n iconClosed: PropTypes.node.description('Custom Dimsum Icon when it is closed.').deprecated({ version: '3.x' }),\n iconOpened: PropTypes.node.description('Custom Dimsum Icon when it is open.').deprecated({ version: '3.x' }),\n secondaryTitle: PropTypes.string.description('Set a secondary title'),\n xStyledPropsContent: PropTypes.shape(xstyledPropTypes).description(\n 'This property is xStyledProps object to apply in the content wrapper',\n ),\n customActions: PropTypes.arrayOf(PropTypes.object)\n .description('Set Dimsum AccordionItem custom actions.')\n .deprecated({ version: '3.x' }),\n renderCustomActions: PropTypes.func\n .description(\n 'This property will render any JSX in the header controls area. You can access to all references and active values within the props. Rendered as a function which does not allow hook calls inside.',\n )\n .deprecated({ version: '4.x' }),\n CustomActions: PropTypes.func.description(\n 'This property will render any JSX in the header controls area. You can access to all references and active values within the props.',\n ),\n};\n\nexport const accordionPropTypes = {\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n containerProps: PropTypes.object.description('Adds props to the container.').deprecated({ version: '4.x' }),\n activeValue: PropTypes.oneOfType([\n PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])),\n PropTypes.string,\n PropTypes.number,\n ]).description('Selected active value. This property makes the component a controlled one.'),\n children: PropTypes.node.description('Dimsum AccordionItems to show.'),\n allowMultipleOpen: PropTypes.bool.description('Allows multiple Dimsum AccordionItems to be open at the same time.'),\n onChange: PropTypes.func.description('Callback function once the Dimsum Accordion changes.'),\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,8BAA0F;AAsEnF,MAAM,yBAAyB;AAAA,EACpC,GAAG;AAAA,EACH,GAAG;AAAA,EACH,UAAU,kCAAU,KAAK,YAAY,+BAA+B,EAAE;AAAA,EACtE,OAAO,kCAAU,OAAO,YAAY,sBAAsB;AAAA,EAC1D,OAAO,kCAAU,UAAU,CAAC,kCAAU,QAAQ,kCAAU,MAAM,CAAC,EAAE;AAAA,IAC/D;AAAA,EACF,EAAE;AAAA,EACF,YAAY,kCAAU,KAAK,YAAY,uCAAuC,EAAE,WAAW,EAAE,SAAS,MAAM,CAAC;AAAA,EAC7G,YAAY,kCAAU,KAAK,YAAY,qCAAqC,EAAE,WAAW,EAAE,SAAS,MAAM,CAAC;AAAA,EAC3G,gBAAgB,kCAAU,OAAO,YAAY,uBAAuB;AAAA,EACpE,qBAAqB,kCAAU,MAAM,wCAAgB,EAAE;AAAA,IACrD;AAAA,EACF;AAAA,EACA,eAAe,kCAAU,QAAQ,kCAAU,MAAM,EAC9C,YAAY,0CAA0C,EACtD,WAAW,EAAE,SAAS,MAAM,CAAC;AAAA,EAChC,qBAAqB,kCAAU,KAC5B;AAAA,IACC;AAAA,EACF,EACC,WAAW,EAAE,SAAS,MAAM,CAAC;AAAA,EAChC,eAAe,kCAAU,KAAK;AAAA,IAC5B;AAAA,EACF;AACF;AAEO,MAAM,qBAAqB;AAAA,EAChC,GAAG;AAAA,EACH,GAAG;AAAA,EACH,gBAAgB,kCAAU,OAAO,YAAY,8BAA8B,EAAE,WAAW,EAAE,SAAS,MAAM,CAAC;AAAA,EAC1G,aAAa,kCAAU,UAAU;AAAA,IAC/B,kCAAU,QAAQ,kCAAU,UAAU,CAAC,kCAAU,QAAQ,kCAAU,MAAM,CAAC,CAAC;AAAA,IAC3E,kCAAU;AAAA,IACV,kCAAU;AAAA,EACZ,CAAC,EAAE,YAAY,4EAA4E;AAAA,EAC3F,UAAU,kCAAU,KAAK,YAAY,gCAAgC;AAAA,EACrE,mBAAmB,kCAAU,KAAK,YAAY,oEAAoE;AAAA,EAClH,UAAU,kCAAU,KAAK,YAAY,sDAAsD;AAC7F;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/sharedTypes.js
CHANGED
|
@@ -14,6 +14,10 @@ var __copyProps = (to, from, except, desc) => {
|
|
|
14
14
|
return to;
|
|
15
15
|
};
|
|
16
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.
|
|
17
21
|
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
18
22
|
mod
|
|
19
23
|
));
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/sharedTypes.ts", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["export declare namespace DSAccordionInternalsT {\n export interface CustomActions {\n onClick: (e: React.MouseEvent) => void;\n id: string;\n }\n\n export interface DefaultIconProps {\n isDSMobile?: boolean;\n }\n\n export interface FocusableChildrenReferences {\n index: number;\n value: string | number;\n ref: React.MutableRefObject<HTMLButtonElement | null>;\n }\n\n export interface AllChildrenReferences {\n [index: string]: React.MutableRefObject<HTMLButtonElement | null>;\n }\n\n export type InternalActiveValue = (string | number)[] | string | number | null | undefined;\n}\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;ACAA,YAAuB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/DSAccordion.js
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { jsx } from "react/jsx-runtime";
|
|
3
3
|
import { describe } from "@elliemae/ds-props-helpers";
|
|
4
|
-
import { AccordionContent } from "./parts/accordionContent/AccordionContent";
|
|
5
|
-
import { useAccordion } from "./config/useAccordion";
|
|
6
|
-
import { DSAccordionContext } from "./DSAccordionCTX";
|
|
7
|
-
import { accordionPropTypes } from "./react-desc-prop-types";
|
|
8
|
-
import { DSAccordionName } from "./exported-related/theming";
|
|
4
|
+
import { AccordionContent } from "./parts/accordionContent/AccordionContent.js";
|
|
5
|
+
import { useAccordion } from "./config/useAccordion.js";
|
|
6
|
+
import { DSAccordionContext } from "./DSAccordionCTX.js";
|
|
7
|
+
import { accordionPropTypes } from "./react-desc-prop-types.js";
|
|
8
|
+
import { DSAccordionName } from "./exported-related/theming.js";
|
|
9
9
|
const DSAccordion = (props) => {
|
|
10
10
|
const ctx = useAccordion(props);
|
|
11
11
|
return /* @__PURE__ */ jsx(DSAccordionContext.Provider, { value: ctx, children: /* @__PURE__ */ jsx(AccordionContent, {}) });
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DSAccordion.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { WeakValidationMap } from 'react';\nimport React from 'react';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { AccordionContent } from './parts/accordionContent/AccordionContent';\nimport { useAccordion } from './config/useAccordion';\nimport { DSAccordionContext } from './DSAccordionCTX';\nimport { accordionPropTypes } from './react-desc-prop-types';\nimport type { DSAccordionT } from './react-desc-prop-types';\nimport { DSAccordionName } from './exported-related/theming';\n\nconst DSAccordion = (props: DSAccordionT.Props): JSX.Element => {\n const ctx = useAccordion(props);\n\n return (\n <DSAccordionContext.Provider value={ctx}>\n <AccordionContent />\n </DSAccordionContext.Provider>\n );\n};\n\nDSAccordion.displayName = DSAccordionName;\nconst DSAccordionWithSchema = describe(DSAccordion);\nDSAccordionWithSchema.propTypes = accordionPropTypes as WeakValidationMap<unknown>;\n\nexport { DSAccordion, DSAccordionWithSchema };\n\nexport default DSAccordion;\n"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { WeakValidationMap } from 'react';\nimport React from 'react';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { AccordionContent } from './parts/accordionContent/AccordionContent.js';\nimport { useAccordion } from './config/useAccordion.js';\nimport { DSAccordionContext } from './DSAccordionCTX.js';\nimport { accordionPropTypes } from './react-desc-prop-types.js';\nimport type { DSAccordionT } from './react-desc-prop-types.js';\nimport { DSAccordionName } from './exported-related/theming.js';\n\nconst DSAccordion = (props: DSAccordionT.Props): JSX.Element => {\n const ctx = useAccordion(props);\n\n return (\n <DSAccordionContext.Provider value={ctx}>\n <AccordionContent />\n </DSAccordionContext.Provider>\n );\n};\n\nDSAccordion.displayName = DSAccordionName;\nconst DSAccordionWithSchema = describe(DSAccordion);\nDSAccordionWithSchema.propTypes = accordionPropTypes as WeakValidationMap<unknown>;\n\nexport { DSAccordion, DSAccordionWithSchema };\n\nexport default DSAccordion;\n"],
|
|
5
5
|
"mappings": "AAAA,YAAY,WAAW;ACejB;AAbN,SAAS,gBAAgB;AACzB,SAAS,wBAAwB;AACjC,SAAS,oBAAoB;AAC7B,SAAS,0BAA0B;AACnC,SAAS,0BAA0B;AAEnC,SAAS,uBAAuB;AAEhC,MAAM,cAAc,CAAC,UAA2C;AAC9D,QAAM,MAAM,aAAa,KAAK;AAE9B,SACE,oBAAC,mBAAmB,UAAnB,EAA4B,OAAO,KAClC,8BAAC,oBAAiB,GACpB;AAEJ;AAEA,YAAY,cAAc;AAC1B,MAAM,wBAAwB,SAAS,WAAW;AAClD,sBAAsB,YAAY;AAIlC,IAAO,sBAAQ;",
|
|
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/DSAccordionCTX.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { createContext } from 'react';\nimport type { DSAccordionT } from './react-desc-prop-types';\nimport type { DSAccordionInternalsT } from './sharedTypes';\n\ninterface DSAccordionContextT {\n props: DSAccordionT.InternalProps;\n actualActiveValue: DSAccordionInternalsT.InternalActiveValue;\n setActiveValues: (value: string | number, e: React.MouseEvent | React.KeyboardEvent) => void;\n focusableChildrenReferences: DSAccordionInternalsT.FocusableChildrenReferences[];\n allChildrenReferences: DSAccordionInternalsT.AllChildrenReferences;\n}\n\nconst defaultContext = {} as DSAccordionContextT;\n\nexport const DSAccordionContext = createContext<DSAccordionContextT>(defaultContext);\n"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { createContext } from 'react';\nimport type { DSAccordionT } from './react-desc-prop-types.js';\nimport type { DSAccordionInternalsT } from './sharedTypes.js';\n\ninterface DSAccordionContextT {\n props: DSAccordionT.InternalProps;\n actualActiveValue: DSAccordionInternalsT.InternalActiveValue;\n setActiveValues: (value: string | number, e: React.MouseEvent | React.KeyboardEvent) => void;\n focusableChildrenReferences: DSAccordionInternalsT.FocusableChildrenReferences[];\n allChildrenReferences: DSAccordionInternalsT.AllChildrenReferences;\n}\n\nconst defaultContext = {} as DSAccordionContextT;\n\nexport const DSAccordionContext = createContext<DSAccordionContextT>(defaultContext);\n"],
|
|
5
5
|
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,qBAAqB;AAY9B,MAAM,iBAAiB,CAAC;AAEjB,MAAM,qBAAqB,cAAmC,cAAc;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { useMemo, useState, useCallback } from "react";
|
|
3
3
|
import { useMemoMergePropsWithDefault } from "@elliemae/ds-props-helpers";
|
|
4
|
-
import { useAccordionRefs } from "./useAccordionRefs";
|
|
5
|
-
import { defaultProps } from "../defaultProps";
|
|
4
|
+
import { useAccordionRefs } from "./useAccordionRefs.js";
|
|
5
|
+
import { defaultProps } from "../defaultProps.js";
|
|
6
6
|
const useAccordion = (props) => {
|
|
7
7
|
const propsWithDefaults = useMemoMergePropsWithDefault(props, defaultProps);
|
|
8
8
|
const { activeValue, allowMultipleOpen, onChange } = propsWithDefaults;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/config/useAccordion.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type React from 'react';\nimport { useMemo, useState, useCallback } from 'react';\nimport { useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';\nimport { useAccordionRefs } from './useAccordionRefs';\nimport { defaultProps } from '../defaultProps';\nimport type { DSAccordionT } from '../react-desc-prop-types';\nimport type { DSAccordionInternalsT } from '../sharedTypes';\n\ninterface DSAccordionUseAccordionContextT {\n props: DSAccordionT.InternalProps;\n actualActiveValue: DSAccordionInternalsT.InternalActiveValue;\n setActiveValues: (value: string | number, e: React.MouseEvent | React.KeyboardEvent) => void;\n focusableChildrenReferences: DSAccordionInternalsT.FocusableChildrenReferences[];\n allChildrenReferences: DSAccordionInternalsT.AllChildrenReferences;\n}\n\nexport const useAccordion = (props: DSAccordionT.Props): DSAccordionUseAccordionContextT => {\n const propsWithDefaults = useMemoMergePropsWithDefault(props, defaultProps) as DSAccordionT.InternalProps;\n\n const { activeValue, allowMultipleOpen, onChange } = propsWithDefaults;\n\n const { focusableChildrenReferences, allChildrenReferences } = useAccordionRefs(propsWithDefaults);\n\n const [internalActiveValue, setInternalActiveValue] =\n useState<DSAccordionInternalsT.InternalActiveValue>(activeValue);\n\n const actualActiveValue = useMemo(() => {\n if (activeValue === undefined) return internalActiveValue;\n return activeValue;\n }, [activeValue, internalActiveValue]);\n\n const setActiveValues = useCallback(\n (value: string | number, e: React.MouseEvent | React.KeyboardEvent) => {\n let newState: DSAccordionInternalsT.InternalActiveValue;\n if (allowMultipleOpen && (actualActiveValue === undefined || actualActiveValue === null)) newState = [value];\n else if (allowMultipleOpen && Array.isArray(actualActiveValue))\n if (!actualActiveValue.some((currentValues: string | number) => currentValues === value))\n newState = [...actualActiveValue, value];\n else newState = actualActiveValue.filter((currentValues: string | number) => currentValues !== value);\n else if (actualActiveValue === value) newState = null;\n else newState = value;\n setInternalActiveValue(newState);\n return onChange(newState, e);\n },\n [actualActiveValue, allowMultipleOpen, onChange],\n );\n const ctx = useMemo(\n () => ({\n props: propsWithDefaults,\n actualActiveValue,\n setActiveValues,\n focusableChildrenReferences,\n allChildrenReferences,\n }),\n [actualActiveValue, allChildrenReferences, focusableChildrenReferences, propsWithDefaults, setActiveValues],\n );\n\n return ctx;\n};\n"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type React from 'react';\nimport { useMemo, useState, useCallback } from 'react';\nimport { useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';\nimport { useAccordionRefs } from './useAccordionRefs.js';\nimport { defaultProps } from '../defaultProps.js';\nimport type { DSAccordionT } from '../react-desc-prop-types.js';\nimport type { DSAccordionInternalsT } from '../sharedTypes.js';\n\ninterface DSAccordionUseAccordionContextT {\n props: DSAccordionT.InternalProps;\n actualActiveValue: DSAccordionInternalsT.InternalActiveValue;\n setActiveValues: (value: string | number, e: React.MouseEvent | React.KeyboardEvent) => void;\n focusableChildrenReferences: DSAccordionInternalsT.FocusableChildrenReferences[];\n allChildrenReferences: DSAccordionInternalsT.AllChildrenReferences;\n}\n\nexport const useAccordion = (props: DSAccordionT.Props): DSAccordionUseAccordionContextT => {\n const propsWithDefaults = useMemoMergePropsWithDefault(props, defaultProps) as DSAccordionT.InternalProps;\n\n const { activeValue, allowMultipleOpen, onChange } = propsWithDefaults;\n\n const { focusableChildrenReferences, allChildrenReferences } = useAccordionRefs(propsWithDefaults);\n\n const [internalActiveValue, setInternalActiveValue] =\n useState<DSAccordionInternalsT.InternalActiveValue>(activeValue);\n\n const actualActiveValue = useMemo(() => {\n if (activeValue === undefined) return internalActiveValue;\n return activeValue;\n }, [activeValue, internalActiveValue]);\n\n const setActiveValues = useCallback(\n (value: string | number, e: React.MouseEvent | React.KeyboardEvent) => {\n let newState: DSAccordionInternalsT.InternalActiveValue;\n if (allowMultipleOpen && (actualActiveValue === undefined || actualActiveValue === null)) newState = [value];\n else if (allowMultipleOpen && Array.isArray(actualActiveValue))\n if (!actualActiveValue.some((currentValues: string | number) => currentValues === value))\n newState = [...actualActiveValue, value];\n else newState = actualActiveValue.filter((currentValues: string | number) => currentValues !== value);\n else if (actualActiveValue === value) newState = null;\n else newState = value;\n setInternalActiveValue(newState);\n return onChange(newState, e);\n },\n [actualActiveValue, allowMultipleOpen, onChange],\n );\n const ctx = useMemo(\n () => ({\n props: propsWithDefaults,\n actualActiveValue,\n setActiveValues,\n focusableChildrenReferences,\n allChildrenReferences,\n }),\n [actualActiveValue, allChildrenReferences, focusableChildrenReferences, propsWithDefaults, setActiveValues],\n );\n\n return ctx;\n};\n"],
|
|
5
5
|
"mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,SAAS,UAAU,mBAAmB;AAC/C,SAAS,oCAAoC;AAC7C,SAAS,wBAAwB;AACjC,SAAS,oBAAoB;AAYtB,MAAM,eAAe,CAAC,UAA+D;AAC1F,QAAM,oBAAoB,6BAA6B,OAAO,YAAY;AAE1E,QAAM,EAAE,aAAa,mBAAmB,SAAS,IAAI;AAErD,QAAM,EAAE,6BAA6B,sBAAsB,IAAI,iBAAiB,iBAAiB;AAEjG,QAAM,CAAC,qBAAqB,sBAAsB,IAChD,SAAoD,WAAW;AAEjE,QAAM,oBAAoB,QAAQ,MAAM;AACtC,QAAI,gBAAgB;AAAW,aAAO;AACtC,WAAO;AAAA,EACT,GAAG,CAAC,aAAa,mBAAmB,CAAC;AAErC,QAAM,kBAAkB;AAAA,IACtB,CAAC,OAAwB,MAA8C;AACrE,UAAI;AACJ,UAAI,sBAAsB,sBAAsB,UAAa,sBAAsB;AAAO,mBAAW,CAAC,KAAK;AAAA,eAClG,qBAAqB,MAAM,QAAQ,iBAAiB;AAC3D,YAAI,CAAC,kBAAkB,KAAK,CAAC,kBAAmC,kBAAkB,KAAK;AACrF,qBAAW,CAAC,GAAG,mBAAmB,KAAK;AAAA;AACpC,qBAAW,kBAAkB,OAAO,CAAC,kBAAmC,kBAAkB,KAAK;AAAA,eAC7F,sBAAsB;AAAO,mBAAW;AAAA;AAC5C,mBAAW;AAChB,6BAAuB,QAAQ;AAC/B,aAAO,SAAS,UAAU,CAAC;AAAA,IAC7B;AAAA,IACA,CAAC,mBAAmB,mBAAmB,QAAQ;AAAA,EACjD;AACA,QAAM,MAAM;AAAA,IACV,OAAO;AAAA,MACL,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,mBAAmB,uBAAuB,6BAA6B,mBAAmB,eAAe;AAAA,EAC5G;AAEA,SAAO;AACT;",
|
|
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/config/useAccordionRefs.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useMemo } from 'react';\nimport type { DSAccordionT } from '../react-desc-prop-types';\nimport type { DSAccordionInternalsT } from '../sharedTypes';\n\ninterface UseAccordionRefsPropsT {\n children: React.ReactElement<DSAccordionT.InternalItemProps>[];\n}\n\ninterface UseAccordionRefsReturnTypeT {\n focusableChildrenReferences: DSAccordionInternalsT.FocusableChildrenReferences[];\n allChildrenReferences: DSAccordionInternalsT.AllChildrenReferences;\n}\n\nexport const useAccordionRefs = ({ children }: UseAccordionRefsPropsT): UseAccordionRefsReturnTypeT =>\n useMemo(() => {\n const focusableChildrenReferences: DSAccordionInternalsT.FocusableChildrenReferences[] = [];\n const allChildrenReferences: DSAccordionInternalsT.AllChildrenReferences = {};\n\n React.Children.map(children, (child: React.ReactElement<DSAccordionT.InternalItemProps>, index) => {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n const { value, disabled } = child.props;\n const currentRef = React.createRef<HTMLButtonElement>();\n allChildrenReferences[index] = currentRef;\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n if (!disabled) focusableChildrenReferences.push({ index, value, ref: currentRef });\n });\n return { focusableChildrenReferences, allChildrenReferences };\n }, [children]);\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,UAAS,eAAe;AAaxB,MAAM,mBAAmB,CAAC,EAAE,SAAS,MAC1C,QAAQ,MAAM;AACZ,QAAM,8BAAmF,CAAC;AAC1F,QAAM,wBAAqE,CAAC;AAE5E,EAAAA,OAAM,SAAS,IAAI,UAAU,CAAC,OAA2D,UAAU;AAEjG,UAAM,EAAE,OAAO,SAAS,IAAI,MAAM;AAClC,UAAM,aAAaA,OAAM,UAA6B;AACtD,0BAAsB,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useMemo } from 'react';\nimport type { DSAccordionT } from '../react-desc-prop-types.js';\nimport type { DSAccordionInternalsT } from '../sharedTypes.js';\n\ninterface UseAccordionRefsPropsT {\n children: React.ReactElement<DSAccordionT.InternalItemProps>[];\n}\n\ninterface UseAccordionRefsReturnTypeT {\n focusableChildrenReferences: DSAccordionInternalsT.FocusableChildrenReferences[];\n allChildrenReferences: DSAccordionInternalsT.AllChildrenReferences;\n}\n\nexport const useAccordionRefs = ({ children }: UseAccordionRefsPropsT): UseAccordionRefsReturnTypeT =>\n useMemo(() => {\n const focusableChildrenReferences: DSAccordionInternalsT.FocusableChildrenReferences[] = [];\n const allChildrenReferences: DSAccordionInternalsT.AllChildrenReferences = {};\n\n React.Children.map(children, (child: React.ReactElement<DSAccordionT.InternalItemProps>, index) => {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n const { value, disabled } = child.props;\n const currentRef = React.createRef<HTMLButtonElement>();\n allChildrenReferences[index] = currentRef;\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n if (!disabled) focusableChildrenReferences.push({ index, value, ref: currentRef });\n });\n return { focusableChildrenReferences, allChildrenReferences };\n }, [children]);\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,UAAS,eAAe;AAaxB,MAAM,mBAAmB,CAAC,EAAE,SAAS,MAC1C,QAAQ,MAAM;AACZ,QAAM,8BAAmF,CAAC;AAC1F,QAAM,wBAAqE,CAAC;AAE5E,EAAAA,OAAM,SAAS,IAAI,UAAU,CAAC,OAA2D,UAAU;AAEjG,UAAM,EAAE,OAAO,SAAS,IAAI,MAAM;AAClC,UAAM,aAAaA,OAAM,UAA6B;AACtD,0BAAsB,KAAK,IAAI;AAE/B,QAAI,CAAC;AAAU,kCAA4B,KAAK,EAAE,OAAO,OAAO,KAAK,WAAW,CAAC;AAAA,EACnF,CAAC;AACD,SAAO,EAAE,6BAA6B,sBAAsB;AAC9D,GAAG,CAAC,QAAQ,CAAC;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/defaultProps.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { memo } from 'react';\nimport { ArrowheadRight, ArrowheadDown, ChevronRight, ChevronDown } from '@elliemae/ds-icons';\nimport type { DSAccordionInternalsT } from './sharedTypes';\nimport type { DSAccordionT } from './react-desc-prop-types';\n\nconst DefaultIconClosed = memo(({ isDSMobile = false }: DSAccordionInternalsT.DefaultIconProps) =>\n isDSMobile ? <ChevronRight width=\"20px\" color={['brand-primary', '800']} /> : <ArrowheadRight width=\"20px\" />,\n);\n\nconst DefaultIconOpen = memo(({ isDSMobile = false }: DSAccordionInternalsT.DefaultIconProps) =>\n isDSMobile ? <ChevronDown width=\"20px\" color={['brand-primary', '800']} /> : <ArrowheadDown width=\"20px\" />,\n);\n\n// eslint-disable-next-line @typescript-eslint/no-empty-function\nconst noop = (): void => {};\n\nexport const defaultProps: DSAccordionT.DefaultProps = {\n containerProps: {},\n allowMultipleOpen: false,\n onChange: noop,\n children: [],\n isDSMobile: false,\n};\n\nexport const accordionItemDefaultProps: DSAccordionT.ItemDefaultProps = {\n iconClosed: DefaultIconClosed,\n iconOpened: DefaultIconOpen,\n title: '',\n customActions: [],\n disabled: false,\n xStyledPropsContent: {},\n};\n"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { memo } from 'react';\nimport { ArrowheadRight, ArrowheadDown, ChevronRight, ChevronDown } from '@elliemae/ds-icons';\nimport type { DSAccordionInternalsT } from './sharedTypes.js';\nimport type { DSAccordionT } from './react-desc-prop-types.js';\n\nconst DefaultIconClosed = memo(({ isDSMobile = false }: DSAccordionInternalsT.DefaultIconProps) =>\n isDSMobile ? <ChevronRight width=\"20px\" color={['brand-primary', '800']} /> : <ArrowheadRight width=\"20px\" />,\n);\n\nconst DefaultIconOpen = memo(({ isDSMobile = false }: DSAccordionInternalsT.DefaultIconProps) =>\n isDSMobile ? <ChevronDown width=\"20px\" color={['brand-primary', '800']} /> : <ArrowheadDown width=\"20px\" />,\n);\n\n// eslint-disable-next-line @typescript-eslint/no-empty-function\nconst noop = (): void => {};\n\nexport const defaultProps: DSAccordionT.DefaultProps = {\n containerProps: {},\n allowMultipleOpen: false,\n onChange: noop,\n children: [],\n isDSMobile: false,\n};\n\nexport const accordionItemDefaultProps: DSAccordionT.ItemDefaultProps = {\n iconClosed: DefaultIconClosed,\n iconOpened: DefaultIconOpen,\n title: '',\n customActions: [],\n disabled: false,\n xStyledPropsContent: {},\n};\n"],
|
|
5
5
|
"mappings": "AAAA,YAAY,WAAW;ACMR;AANf,SAAgB,YAAY;AAC5B,SAAS,gBAAgB,eAAe,cAAc,mBAAmB;AAIzE,MAAM,oBAAoB;AAAA,EAAK,CAAC,EAAE,aAAa,MAAM,MACnD,aAAa,oBAAC,gBAAa,OAAM,QAAO,OAAO,CAAC,iBAAiB,KAAK,GAAG,IAAK,oBAAC,kBAAe,OAAM,QAAO;AAC7G;AAEA,MAAM,kBAAkB;AAAA,EAAK,CAAC,EAAE,aAAa,MAAM,MACjD,aAAa,oBAAC,eAAY,OAAM,QAAO,OAAO,CAAC,iBAAiB,KAAK,GAAG,IAAK,oBAAC,iBAAc,OAAM,QAAO;AAC3G;AAGA,MAAM,OAAO,MAAY;AAAC;AAEnB,MAAM,eAA0C;AAAA,EACrD,gBAAgB,CAAC;AAAA,EACjB,mBAAmB;AAAA,EACnB,UAAU;AAAA,EACV,UAAU,CAAC;AAAA,EACX,YAAY;AACd;AAEO,MAAM,4BAA2D;AAAA,EACtE,YAAY;AAAA,EACZ,YAAY;AAAA,EACZ,OAAO;AAAA,EACP,eAAe,CAAC;AAAA,EAChB,UAAU;AAAA,EACV,qBAAqB,CAAC;AACxB;",
|
|
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/exported-related/index.ts"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './DSAccordionDatatestid';\nexport * from './theming';\n"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './DSAccordionDatatestid.js';\nexport * from './theming.js';\n"],
|
|
5
5
|
"mappings": "AAAA,YAAY,WAAW;ACAvB,cAAc;AACd,cAAc;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/index.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
export * from "./DSAccordion";
|
|
3
|
-
export * from "./parts/accordionItem/DSAccordionItem";
|
|
4
|
-
export * from "./exported-related";
|
|
5
|
-
import { default as default2 } from "./DSAccordion";
|
|
2
|
+
export * from "./DSAccordion.js";
|
|
3
|
+
export * from "./parts/accordionItem/DSAccordionItem.js";
|
|
4
|
+
export * from "./exported-related/index.js";
|
|
5
|
+
import { default as default2 } from "./DSAccordion.js";
|
|
6
6
|
export {
|
|
7
7
|
default2 as default
|
|
8
8
|
};
|
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.ts"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './DSAccordion';\nexport * from './parts/accordionItem/DSAccordionItem';\nexport * from './exported-related';\n\nexport { default } from './DSAccordion';\n"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './DSAccordion.js';\nexport * from './parts/accordionItem/DSAccordionItem.js';\nexport * from './exported-related/index.js';\n\nexport { default } from './DSAccordion.js';\n"],
|
|
5
5
|
"mappings": "AAAA,YAAY,WAAW;ACAvB,cAAc;AACd,cAAc;AACd,cAAc;AAEd,SAAS,WAAAA,gBAAe;",
|
|
6
6
|
"names": ["default"]
|
|
7
7
|
}
|
|
@@ -2,9 +2,9 @@ import * as React from "react";
|
|
|
2
2
|
import { jsx } from "react/jsx-runtime";
|
|
3
3
|
import React2, { useContext } from "react";
|
|
4
4
|
import { useGetGlobalAttributes, useGetXstyledProps } from "@elliemae/ds-props-helpers";
|
|
5
|
-
import { DSAccordionContext } from "../../DSAccordionCTX";
|
|
6
|
-
import { DSAccordionDataTestid } from "../../exported-related/DSAccordionDatatestid";
|
|
7
|
-
import { StyledContainer } from "./styles";
|
|
5
|
+
import { DSAccordionContext } from "../../DSAccordionCTX.js";
|
|
6
|
+
import { DSAccordionDataTestid } from "../../exported-related/DSAccordionDatatestid.js";
|
|
7
|
+
import { StyledContainer } from "./styles.js";
|
|
8
8
|
const AccordionContent = () => {
|
|
9
9
|
const {
|
|
10
10
|
props: { containerProps, children, onChange, ...rest }
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/accordionContent/AccordionContent.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useContext } from 'react';\nimport { useGetGlobalAttributes, useGetXstyledProps } from '@elliemae/ds-props-helpers';\nimport { DSAccordionContext } from '../../DSAccordionCTX';\nimport { DSAccordionDataTestid } from '../../exported-related/DSAccordionDatatestid';\nimport { StyledContainer } from './styles';\nimport type { DSAccordionT } from '../../react-desc-prop-types';\n\nexport const AccordionContent = (): JSX.Element => {\n const {\n props: { containerProps, children, onChange, ...rest },\n } = useContext(DSAccordionContext);\n\n const childrenWithIndex: React.ReactElement<DSAccordionT.InternalItemProps>[] = [];\n\n const xstyledAttrs = useGetXstyledProps(rest);\n\n const globalAttrs = useGetGlobalAttributes(rest);\n\n React.Children.forEach(children, (child, index) =>\n childrenWithIndex.push(\n React.cloneElement(child, {\n dsIndex: index,\n }),\n ),\n );\n\n return (\n <StyledContainer data-testid={DSAccordionDataTestid.GROUP} {...containerProps} {...globalAttrs} {...xstyledAttrs}>\n {childrenWithIndex}\n </StyledContainer>\n );\n};\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;AC2BnB;AA3BJ,OAAOA,UAAS,kBAAkB;AAClC,SAAS,wBAAwB,0BAA0B;AAC3D,SAAS,0BAA0B;AACnC,SAAS,6BAA6B;AACtC,SAAS,uBAAuB;AAGzB,MAAM,mBAAmB,MAAmB;AACjD,QAAM;AAAA,IACJ,OAAO,EAAE,gBAAgB,UAAU,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useContext } from 'react';\nimport { useGetGlobalAttributes, useGetXstyledProps } from '@elliemae/ds-props-helpers';\nimport { DSAccordionContext } from '../../DSAccordionCTX.js';\nimport { DSAccordionDataTestid } from '../../exported-related/DSAccordionDatatestid.js';\nimport { StyledContainer } from './styles.js';\nimport type { DSAccordionT } from '../../react-desc-prop-types.js';\n\nexport const AccordionContent = (): JSX.Element => {\n const {\n props: { containerProps, children, onChange, ...rest },\n } = useContext(DSAccordionContext);\n\n const childrenWithIndex: React.ReactElement<DSAccordionT.InternalItemProps>[] = [];\n\n const xstyledAttrs = useGetXstyledProps(rest);\n\n const globalAttrs = useGetGlobalAttributes(rest);\n\n React.Children.forEach(children, (child, index) =>\n childrenWithIndex.push(\n React.cloneElement(child, {\n dsIndex: index,\n }),\n ),\n );\n\n return (\n <StyledContainer data-testid={DSAccordionDataTestid.GROUP} {...containerProps} {...globalAttrs} {...xstyledAttrs}>\n {childrenWithIndex}\n </StyledContainer>\n );\n};\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;AC2BnB;AA3BJ,OAAOA,UAAS,kBAAkB;AAClC,SAAS,wBAAwB,0BAA0B;AAC3D,SAAS,0BAA0B;AACnC,SAAS,6BAA6B;AACtC,SAAS,uBAAuB;AAGzB,MAAM,mBAAmB,MAAmB;AACjD,QAAM;AAAA,IACJ,OAAO,EAAE,gBAAgB,UAAU,UAAU,GAAG,KAAK;AAAA,EACvD,IAAI,WAAW,kBAAkB;AAEjC,QAAM,oBAA0E,CAAC;AAEjF,QAAM,eAAe,mBAAmB,IAAI;AAE5C,QAAM,cAAc,uBAAuB,IAAI;AAE/C,EAAAA,OAAM,SAAS;AAAA,IAAQ;AAAA,IAAU,CAAC,OAAO,UACvC,kBAAkB;AAAA,MAChBA,OAAM,aAAa,OAAO;AAAA,QACxB,SAAS;AAAA,MACX,CAAC;AAAA,IACH;AAAA,EACF;AAEA,SACE,oBAAC,mBAAgB,eAAa,sBAAsB,OAAQ,GAAG,gBAAiB,GAAG,aAAc,GAAG,cACjG,6BACH;AAEJ;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { styled, xStyledCommonProps } from "@elliemae/ds-system";
|
|
3
|
-
import { DSAccordionName, DSAccordionSlots } from "../../exported-related";
|
|
3
|
+
import { DSAccordionName, DSAccordionSlots } from "../../exported-related/index.js";
|
|
4
4
|
const StyledContainer = styled("div", {
|
|
5
5
|
name: DSAccordionName,
|
|
6
6
|
slot: DSAccordionSlots.CONTAINER
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/accordionContent/styles.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled, xStyledCommonProps } from '@elliemae/ds-system';\nimport { DSAccordionName, DSAccordionSlots } from '../../exported-related';\n\nexport const StyledContainer = styled('div', {\n name: DSAccordionName,\n slot: DSAccordionSlots.CONTAINER,\n})`\n min-width: 240px;\n ${xStyledCommonProps};\n`;\n"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled, xStyledCommonProps } from '@elliemae/ds-system';\nimport { DSAccordionName, DSAccordionSlots } from '../../exported-related/index.js';\n\nexport const StyledContainer = styled('div', {\n name: DSAccordionName,\n slot: DSAccordionSlots.CONTAINER,\n})`\n min-width: 240px;\n ${xStyledCommonProps};\n`;\n"],
|
|
5
5
|
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,QAAQ,0BAA0B;AAC3C,SAAS,iBAAiB,wBAAwB;AAE3C,MAAM,kBAAkB,OAAO,OAAO;AAAA,EAC3C,MAAM;AAAA,EACN,MAAM,iBAAiB;AACzB,CAAC;AAAA;AAAA,IAEG;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -11,7 +11,7 @@ import { Grid } from "@elliemae/ds-grid";
|
|
|
11
11
|
import { useIsShowingEllipsis } from "@elliemae/ds-utilities";
|
|
12
12
|
import { DSButton, BUTTON_TYPE } from "@elliemae/ds-button";
|
|
13
13
|
import { DSPopperJS } from "@elliemae/ds-popperjs";
|
|
14
|
-
import { accordionItemDefaultProps } from "../../defaultProps";
|
|
14
|
+
import { accordionItemDefaultProps } from "../../defaultProps.js";
|
|
15
15
|
import {
|
|
16
16
|
StyledItemAddon,
|
|
17
17
|
StyledItemContainer,
|
|
@@ -23,11 +23,11 @@ import {
|
|
|
23
23
|
StyledPrimaryTitle,
|
|
24
24
|
StyledSecondaryTitle,
|
|
25
25
|
StyledTooltipContent
|
|
26
|
-
} from "./styles";
|
|
27
|
-
import { useAccordionItem } from "./useAccordionItem";
|
|
28
|
-
import { DSAccordionContext } from "../../DSAccordionCTX";
|
|
29
|
-
import { DSAccordionDataTestid } from "../../exported-related/DSAccordionDatatestid";
|
|
30
|
-
import { accordionItemPropTypes } from "../../react-desc-prop-types";
|
|
26
|
+
} from "./styles.js";
|
|
27
|
+
import { useAccordionItem } from "./useAccordionItem.js";
|
|
28
|
+
import { DSAccordionContext } from "../../DSAccordionCTX.js";
|
|
29
|
+
import { DSAccordionDataTestid } from "../../exported-related/DSAccordionDatatestid.js";
|
|
30
|
+
import { accordionItemPropTypes } from "../../react-desc-prop-types.js";
|
|
31
31
|
const DSAccordionItem = (props) => {
|
|
32
32
|
const propsWithDefaults = useMemoMergePropsWithDefault(
|
|
33
33
|
props,
|
|
@@ -139,8 +139,13 @@ const DSAccordionItem = (props) => {
|
|
|
139
139
|
setSecondaryElement,
|
|
140
140
|
handleOnBlur,
|
|
141
141
|
handleOnFocus,
|
|
142
|
+
handleOnBlur,
|
|
142
143
|
secondaryTitle,
|
|
144
|
+
disabled,
|
|
143
145
|
selected,
|
|
146
|
+
IconOpened,
|
|
147
|
+
IconClosed,
|
|
148
|
+
setPrimaryElement,
|
|
144
149
|
title,
|
|
145
150
|
disabled
|
|
146
151
|
]
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/accordionItem/DSAccordionItem.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport type { WeakValidationMap } from 'react';\nimport React, { useState, useContext, useCallback, useMemo } from 'react';\nimport {\n useMemoMergePropsWithDefault,\n describe,\n useGetGlobalAttributes,\n useGetXstyledProps,\n} from '@elliemae/ds-props-helpers';\nimport { Grid } from '@elliemae/ds-grid';\nimport { useIsShowingEllipsis } from '@elliemae/ds-utilities';\nimport { DSButton, BUTTON_TYPE } from '@elliemae/ds-button';\nimport { DSPopperJS } from '@elliemae/ds-popperjs';\nimport { accordionItemDefaultProps } from '../../defaultProps';\nimport {\n StyledItemAddon,\n StyledItemContainer,\n StyledItemContent,\n StyledItemCustomActions,\n StyledItemHeader,\n StyledItemHeaderContainer,\n StyledItemTitles,\n StyledPrimaryTitle,\n StyledSecondaryTitle,\n StyledTooltipContent,\n} from './styles';\nimport { useAccordionItem } from './useAccordionItem';\nimport { DSAccordionContext } from '../../DSAccordionCTX';\nimport { DSAccordionDataTestid } from '../../exported-related/DSAccordionDatatestid';\nimport { accordionItemPropTypes } from '../../react-desc-prop-types';\nimport type { DSAccordionT } from '../../react-desc-prop-types';\n\nconst DSAccordionItem = (props: DSAccordionT.ItemProps): JSX.Element => {\n const propsWithDefaults = useMemoMergePropsWithDefault(\n props,\n accordionItemDefaultProps,\n ) as DSAccordionT.InternalItemProps;\n\n const {\n children,\n title,\n secondaryTitle,\n customActions,\n iconOpened: IconOpened,\n iconClosed: IconClosed,\n value,\n disabled,\n dsIndex,\n renderCustomActions,\n CustomActions,\n xStyledPropsContent,\n ...rest\n } = propsWithDefaults;\n\n const { handleOnClick, handleOnKeyDown, selected } = useAccordionItem({ value, disabled });\n\n const xstyledAttrs = useGetXstyledProps(rest);\n const xstyledContentAttrs = useGetXstyledProps(xStyledPropsContent);\n\n const {\n allChildrenReferences,\n actualActiveValue,\n props: { isDSMobile },\n } = useContext(DSAccordionContext);\n\n const [showPopover, setShowPopover] = useState(false);\n const [referenceElement, setReferenceElement] = useState<HTMLElement | null>();\n\n const CustomActionsContent = useMemo(() => {\n if (!isDSMobile && customActions?.length > 0)\n return (\n <StyledItemCustomActions isDSMobile={isDSMobile}>\n {customActions?.map(({ onClick, id, ...otherProps }) => (\n <DSButton\n key={id}\n onClick={(e: React.MouseEvent<HTMLElement, MouseEvent> | React.KeyboardEvent<HTMLElement>): void => {\n e.stopPropagation();\n if (onClick) onClick(e as React.MouseEvent<HTMLElement, MouseEvent>);\n }}\n {...otherProps}\n buttonType={BUTTON_TYPE.SECONDARY}\n />\n ))}\n </StyledItemCustomActions>\n );\n\n if (!isDSMobile && (renderCustomActions || CustomActions))\n return (\n <StyledItemCustomActions isDSMobile={isDSMobile}>\n {CustomActions !== undefined ? (\n <CustomActions allRefs={allChildrenReferences} actualActiveValue={actualActiveValue} />\n ) : (\n renderCustomActions?.({ allRefs: allChildrenReferences, actualActiveValue })\n )}\n </StyledItemCustomActions>\n );\n return null;\n }, [CustomActions, actualActiveValue, allChildrenReferences, customActions, isDSMobile, renderCustomActions]);\n\n const { isShowingEllipsis: isPrimaryShowingEllipsis, setElement: setPrimaryElement } = useIsShowingEllipsis();\n\n const { isShowingEllipsis: isSecondaryShowingEllipsis, setElement: setSecondaryElement } = useIsShowingEllipsis();\n\n const onKeyDownWithIndex = useCallback(\n (e: React.KeyboardEvent) => {\n handleOnKeyDown(e, dsIndex);\n },\n [dsIndex, handleOnKeyDown],\n );\n const handleOnFocus = useCallback(\n () => setShowPopover(isPrimaryShowingEllipsis || isSecondaryShowingEllipsis),\n [isPrimaryShowingEllipsis, isSecondaryShowingEllipsis],\n );\n\n const handleOnBlur = useCallback(() => setShowPopover(false), []);\n\n const { className, ...globalAttrs } = useGetGlobalAttributes(rest, {\n onClick: handleOnClick,\n onFocus: handleOnFocus,\n onBlur: handleOnBlur,\n });\n\n const handlers = {\n onClick: handleOnClick,\n onFocus: handleOnFocus,\n onBlur: handleOnBlur,\n };\n\n const titleDesktop = useMemo(\n () => (\n <Grid\n onMouseEnter={handleOnFocus}\n onMouseLeave={handleOnBlur}\n rows={['auto', 'auto']}\n rowGap={secondaryTitle ? '3px' : '0px'}\n padding=\"6px 0px\"\n width=\"100%\"\n >\n <Grid cols={['20px', 'auto']}>\n <StyledItemAddon disabled={disabled}>{selected ? <IconOpened /> : <IconClosed />}</StyledItemAddon>\n <StyledItemTitles withSecondaryTitle={secondaryTitle} selected={selected}>\n <StyledPrimaryTitle\n ref={setPrimaryElement}\n {...(title ? { id: `accordion_${title || ''}id` } : undefined)}\n disabled={disabled}\n selected={selected}\n withSecondaryTitle={secondaryTitle}\n >\n {title}\n </StyledPrimaryTitle>\n </StyledItemTitles>\n </Grid>\n {secondaryTitle && (\n <Grid cols={['20px', 'auto']}>\n <div></div>\n <StyledSecondaryTitle ref={setSecondaryElement} disabled={disabled} selected={selected}>\n {secondaryTitle}\n </StyledSecondaryTitle>\n </Grid>\n )}\n </Grid>\n ),\n [\n setPrimaryElement,\n IconOpened,\n IconClosed,\n setSecondaryElement,\n handleOnBlur,\n handleOnFocus,\n secondaryTitle,\n selected,\n title,\n disabled,\n ],\n );\n\n const titleMobile = useMemo(\n () => (\n <Grid width=\"100%\">\n <Grid cols={['auto', '20px']}>\n <StyledItemTitles\n onMouseEnter={handleOnFocus}\n onMouseLeave={handleOnBlur}\n isDSMobile\n withSecondaryTitle={secondaryTitle}\n selected={selected}\n >\n <StyledPrimaryTitle\n ref={setPrimaryElement}\n {...(title ? { id: `accordion_${title || ''}id` } : undefined)}\n disabled={disabled}\n isDSMobile\n selected={selected}\n withSecondaryTitle={secondaryTitle}\n >\n {title}\n </StyledPrimaryTitle>\n </StyledItemTitles>\n <StyledItemAddon disabled={disabled} isDSMobile>\n {selected ? <IconOpened isDSMobile /> : <IconClosed isDSMobile />}\n </StyledItemAddon>\n </Grid>\n </Grid>\n ),\n [handleOnFocus, handleOnBlur, secondaryTitle, selected, setPrimaryElement, title, disabled, IconOpened, IconClosed],\n );\n return (\n <StyledItemContainer data-testid={DSAccordionDataTestid.ITEM.CONTAINER} className={className} {...xstyledAttrs}>\n <StyledItemHeaderContainer disabled={disabled} ref={setReferenceElement}>\n <StyledItemHeader\n type=\"button\"\n withCustomActions={(customActions?.length > 0 || renderCustomActions !== undefined) && !isDSMobile}\n withSecondaryTitle={secondaryTitle}\n tabIndex={!disabled ? 0 : undefined}\n disabled={disabled}\n data-disabled={disabled}\n ref={allChildrenReferences[dsIndex]}\n onKeyDown={onKeyDownWithIndex}\n isDSMobile={isDSMobile}\n data-testid={DSAccordionDataTestid.ITEM.HEADER}\n id={`ds-accordion-header-${value}`}\n aria-expanded={selected}\n aria-disabled={disabled}\n aria-controls={`ds-accordion-content-${value}`}\n {...handlers}\n {...globalAttrs}\n >\n {isDSMobile ? titleMobile : titleDesktop}\n <DSPopperJS referenceElement={referenceElement} showPopover={!selected && showPopover}>\n <StyledTooltipContent>\n <p>{title}</p>\n <p> {secondaryTitle}</p>\n </StyledTooltipContent>\n </DSPopperJS>\n </StyledItemHeader>\n {CustomActionsContent}\n </StyledItemHeaderContainer>\n {selected && (\n <StyledItemContent\n data-testid={DSAccordionDataTestid.ITEM.CONTENT}\n aria-labelledby={`ds-accordion-header-${value}`}\n role=\"region\"\n isDSMobile={isDSMobile}\n id={`ds-accordion-content-${value}`}\n {...xstyledContentAttrs}\n >\n {children}\n </StyledItemContent>\n )}\n </StyledItemContainer>\n );\n};\n\nDSAccordionItem.displayName = 'DSAccordionItem';\nconst DSAccordionItemWithSchema = describe(DSAccordionItem);\nDSAccordionItemWithSchema.propTypes = accordionItemPropTypes as WeakValidationMap<unknown>;\n\nexport { DSAccordionItem, DSAccordionItemWithSchema };\nexport default DSAccordionItem;\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACyEX,cAiEJ,YAjEI;AAvEZ,SAAgB,UAAU,YAAY,aAAa,eAAe;AAClE;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,YAAY;AACrB,SAAS,4BAA4B;AACrC,SAAS,UAAU,mBAAmB;AACtC,SAAS,kBAAkB;AAC3B,SAAS,iCAAiC;AAC1C;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,wBAAwB;AACjC,SAAS,0BAA0B;AACnC,SAAS,6BAA6B;AACtC,SAAS,8BAA8B;AAGvC,MAAM,kBAAkB,CAAC,UAA+C;AACtE,QAAM,oBAAoB;AAAA,IACxB;AAAA,IACA;AAAA,EACF;AAEA,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport type { WeakValidationMap } from 'react';\nimport React, { useState, useContext, useCallback, useMemo } from 'react';\nimport {\n useMemoMergePropsWithDefault,\n describe,\n useGetGlobalAttributes,\n useGetXstyledProps,\n} from '@elliemae/ds-props-helpers';\nimport { Grid } from '@elliemae/ds-grid';\nimport { useIsShowingEllipsis } from '@elliemae/ds-utilities';\nimport { DSButton, BUTTON_TYPE } from '@elliemae/ds-button';\nimport { DSPopperJS } from '@elliemae/ds-popperjs';\nimport { accordionItemDefaultProps } from '../../defaultProps.js';\nimport {\n StyledItemAddon,\n StyledItemContainer,\n StyledItemContent,\n StyledItemCustomActions,\n StyledItemHeader,\n StyledItemHeaderContainer,\n StyledItemTitles,\n StyledPrimaryTitle,\n StyledSecondaryTitle,\n StyledTooltipContent,\n} from './styles.js';\nimport { useAccordionItem } from './useAccordionItem.js';\nimport { DSAccordionContext } from '../../DSAccordionCTX.js';\nimport { DSAccordionDataTestid } from '../../exported-related/DSAccordionDatatestid.js';\nimport { accordionItemPropTypes } from '../../react-desc-prop-types.js';\nimport type { DSAccordionT } from '../../react-desc-prop-types.js';\n\nconst DSAccordionItem = (props: DSAccordionT.ItemProps): JSX.Element => {\n const propsWithDefaults = useMemoMergePropsWithDefault(\n props,\n accordionItemDefaultProps,\n ) as DSAccordionT.InternalItemProps;\n\n const {\n children,\n title,\n secondaryTitle,\n customActions,\n iconOpened: IconOpened,\n iconClosed: IconClosed,\n value,\n disabled,\n dsIndex,\n renderCustomActions,\n CustomActions,\n xStyledPropsContent,\n ...rest\n } = propsWithDefaults;\n\n const { handleOnClick, handleOnKeyDown, selected } = useAccordionItem({ value, disabled });\n\n const xstyledAttrs = useGetXstyledProps(rest);\n const xstyledContentAttrs = useGetXstyledProps(xStyledPropsContent);\n\n const {\n allChildrenReferences,\n actualActiveValue,\n props: { isDSMobile },\n } = useContext(DSAccordionContext);\n\n const [showPopover, setShowPopover] = useState(false);\n const [referenceElement, setReferenceElement] = useState<HTMLElement | null>();\n\n const CustomActionsContent = useMemo(() => {\n if (!isDSMobile && customActions?.length > 0)\n return (\n <StyledItemCustomActions isDSMobile={isDSMobile}>\n {customActions?.map(({ onClick, id, ...otherProps }) => (\n <DSButton\n key={id}\n onClick={(e: React.MouseEvent<HTMLElement, MouseEvent> | React.KeyboardEvent<HTMLElement>): void => {\n e.stopPropagation();\n if (onClick) onClick(e as React.MouseEvent<HTMLElement, MouseEvent>);\n }}\n {...otherProps}\n buttonType={BUTTON_TYPE.SECONDARY}\n />\n ))}\n </StyledItemCustomActions>\n );\n\n if (!isDSMobile && (renderCustomActions || CustomActions))\n return (\n <StyledItemCustomActions isDSMobile={isDSMobile}>\n {CustomActions !== undefined ? (\n <CustomActions allRefs={allChildrenReferences} actualActiveValue={actualActiveValue} />\n ) : (\n renderCustomActions?.({ allRefs: allChildrenReferences, actualActiveValue })\n )}\n </StyledItemCustomActions>\n );\n return null;\n }, [CustomActions, actualActiveValue, allChildrenReferences, customActions, isDSMobile, renderCustomActions]);\n\n const { isShowingEllipsis: isPrimaryShowingEllipsis, setElement: setPrimaryElement } = useIsShowingEllipsis();\n\n const { isShowingEllipsis: isSecondaryShowingEllipsis, setElement: setSecondaryElement } = useIsShowingEllipsis();\n\n const onKeyDownWithIndex = useCallback(\n (e: React.KeyboardEvent) => {\n handleOnKeyDown(e, dsIndex);\n },\n [dsIndex, handleOnKeyDown],\n );\n const handleOnFocus = useCallback(\n () => setShowPopover(isPrimaryShowingEllipsis || isSecondaryShowingEllipsis),\n [isPrimaryShowingEllipsis, isSecondaryShowingEllipsis],\n );\n\n const handleOnBlur = useCallback(() => setShowPopover(false), []);\n\n const { className, ...globalAttrs } = useGetGlobalAttributes(rest, {\n onClick: handleOnClick,\n onFocus: handleOnFocus,\n onBlur: handleOnBlur,\n });\n\n const handlers = {\n onClick: handleOnClick,\n onFocus: handleOnFocus,\n onBlur: handleOnBlur,\n };\n\n const titleDesktop = useMemo(\n () => (\n <Grid\n onMouseEnter={handleOnFocus}\n onMouseLeave={handleOnBlur}\n rows={['auto', 'auto']}\n rowGap={secondaryTitle ? '3px' : '0px'}\n padding=\"6px 0px\"\n width=\"100%\"\n >\n <Grid cols={['20px', 'auto']}>\n <StyledItemAddon disabled={disabled}>{selected ? <IconOpened /> : <IconClosed />}</StyledItemAddon>\n <StyledItemTitles withSecondaryTitle={secondaryTitle} selected={selected}>\n <StyledPrimaryTitle\n ref={setPrimaryElement}\n {...(title ? { id: `accordion_${title || ''}id` } : undefined)}\n disabled={disabled}\n selected={selected}\n withSecondaryTitle={secondaryTitle}\n >\n {title}\n </StyledPrimaryTitle>\n </StyledItemTitles>\n </Grid>\n {secondaryTitle && (\n <Grid cols={['20px', 'auto']}>\n <div></div>\n <StyledSecondaryTitle ref={setSecondaryElement} disabled={disabled} selected={selected}>\n {secondaryTitle}\n </StyledSecondaryTitle>\n </Grid>\n )}\n </Grid>\n ),\n [\n setPrimaryElement,\n IconOpened,\n IconClosed,\n setSecondaryElement,\n handleOnBlur,\n handleOnFocus,\n handleOnBlur,\n secondaryTitle,\n disabled,\n selected,\n IconOpened,\n IconClosed,\n setPrimaryElement,\n title,\n disabled,\n ],\n );\n\n const titleMobile = useMemo(\n () => (\n <Grid width=\"100%\">\n <Grid cols={['auto', '20px']}>\n <StyledItemTitles\n onMouseEnter={handleOnFocus}\n onMouseLeave={handleOnBlur}\n isDSMobile\n withSecondaryTitle={secondaryTitle}\n selected={selected}\n >\n <StyledPrimaryTitle\n ref={setPrimaryElement}\n {...(title ? { id: `accordion_${title || ''}id` } : undefined)}\n disabled={disabled}\n isDSMobile\n selected={selected}\n withSecondaryTitle={secondaryTitle}\n >\n {title}\n </StyledPrimaryTitle>\n </StyledItemTitles>\n <StyledItemAddon disabled={disabled} isDSMobile>\n {selected ? <IconOpened isDSMobile /> : <IconClosed isDSMobile />}\n </StyledItemAddon>\n </Grid>\n </Grid>\n ),\n [handleOnFocus, handleOnBlur, secondaryTitle, selected, setPrimaryElement, title, disabled, IconOpened, IconClosed],\n );\n return (\n <StyledItemContainer data-testid={DSAccordionDataTestid.ITEM.CONTAINER} className={className} {...xstyledAttrs}>\n <StyledItemHeaderContainer disabled={disabled} ref={setReferenceElement}>\n <StyledItemHeader\n type=\"button\"\n withCustomActions={(customActions?.length > 0 || renderCustomActions !== undefined) && !isDSMobile}\n withSecondaryTitle={secondaryTitle}\n tabIndex={!disabled ? 0 : undefined}\n disabled={disabled}\n data-disabled={disabled}\n ref={allChildrenReferences[dsIndex]}\n onKeyDown={onKeyDownWithIndex}\n isDSMobile={isDSMobile}\n data-testid={DSAccordionDataTestid.ITEM.HEADER}\n id={`ds-accordion-header-${value}`}\n aria-expanded={selected}\n aria-disabled={disabled}\n aria-controls={`ds-accordion-content-${value}`}\n {...handlers}\n {...globalAttrs}\n >\n {isDSMobile ? titleMobile : titleDesktop}\n <DSPopperJS referenceElement={referenceElement} showPopover={!selected && showPopover}>\n <StyledTooltipContent>\n <p>{title}</p>\n <p> {secondaryTitle}</p>\n </StyledTooltipContent>\n </DSPopperJS>\n </StyledItemHeader>\n {CustomActionsContent}\n </StyledItemHeaderContainer>\n {selected && (\n <StyledItemContent\n data-testid={DSAccordionDataTestid.ITEM.CONTENT}\n aria-labelledby={`ds-accordion-header-${value}`}\n role=\"region\"\n isDSMobile={isDSMobile}\n id={`ds-accordion-content-${value}`}\n {...xstyledContentAttrs}\n >\n {children}\n </StyledItemContent>\n )}\n </StyledItemContainer>\n );\n};\n\nDSAccordionItem.displayName = 'DSAccordionItem';\nconst DSAccordionItemWithSchema = describe(DSAccordionItem);\nDSAccordionItemWithSchema.propTypes = accordionItemPropTypes as WeakValidationMap<unknown>;\n\nexport { DSAccordionItem, DSAccordionItemWithSchema };\nexport default DSAccordionItem;\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { styled, xStyledCommonProps } from "@elliemae/ds-system";
|
|
3
|
-
import { DSAccordionName, DSAccordionSlots } from "../../exported-related";
|
|
3
|
+
import { DSAccordionName, DSAccordionSlots } from "../../exported-related/index.js";
|
|
4
4
|
const StyledItemContainer = styled("div", {
|
|
5
5
|
name: DSAccordionName,
|
|
6
6
|
slot: DSAccordionSlots.ITEM.CONTAINER
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/accordionItem/styles.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport { styled, xStyledCommonProps } from '@elliemae/ds-system';\nimport { DSAccordionName, DSAccordionSlots } from '../../exported-related';\ninterface StyledItemHeaderPropsT {\n withCustomActions: boolean;\n withSecondaryTitle?: string;\n isDSMobile?: boolean;\n}\n\ninterface StyledItemTitlesPropsT {\n withSecondaryTitle?: string;\n isDSMobile?: boolean;\n selected: boolean;\n}\n\ninterface StyledPrimaryTitlePropsT {\n disabled: boolean;\n isDSMobile?: boolean;\n selected: boolean;\n withSecondaryTitle: boolean;\n}\n\ninterface StyledItemContentPropsT {\n isDSMobile?: boolean;\n}\n\ninterface StyledSecondaryTitlePropsT {\n disabled: boolean;\n selected: boolean;\n}\n\ninterface StyledItemAddonPropsT {\n disabled: boolean;\n isDSMobile?: boolean;\n}\n\ninterface StyledItemHeaderContainerPropsT {\n disabled: boolean;\n}\n\ninterface StyledItemCustomActionsPropsT {\n isDSMobile?: boolean;\n}\n\nexport const StyledItemContainer = styled('div', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.CONTAINER,\n})`\n display: grid;\n grid-template-rows: auto auto;\n border-bottom: 1px solid ${({ theme }) => theme.colors.neutral[200]};\n align-items: center;\n min-width: 240px;\n grid-template-columns: 100%;\n ${xStyledCommonProps};\n`;\n\nexport const StyledItemHeader = styled('button', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.HEADER.CONTAINER,\n})<StyledItemHeaderPropsT>`\n display: flex;\n min-height: ${({ theme, withSecondaryTitle, isDSMobile }) =>\n isDSMobile ? `44px` : `${withSecondaryTitle ? theme.space.m : theme.space.s}`};\n width: 100%;\n align-items: center;\n border: none;\n outline: none;\n background: none;\n &:hover {\n cursor: ${({ disabled }) => (disabled ? 'not-allowed' : 'pointer')};\n }\n padding: ${({ isDSMobile }) => (isDSMobile ? `0 16px` : `0`)};\n &:focus {\n &:after {\n position: absolute;\n content: '';\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n border-radius: 2px;\n border: 2px solid ${({ theme }) => theme.colors.brand[700]};\n pointer-events: none;\n }\n }\n`;\n\nexport const StyledItemContent = styled('div', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.CONTENT.CONTAINER,\n})<StyledItemContentPropsT>`\n padding: ${({ isDSMobile }) => (isDSMobile ? `3px 16px 24px 16px` : '16px 20px')};\n ${xStyledCommonProps};\n`;\n\nexport const StyledItemAddon = styled('div', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.HEADER.ADDON,\n})<StyledItemAddonPropsT>`\n height: 100%;\n display: grid;\n place-items: center;\n & .em-ds-icon svg {\n fill: ${({ disabled, theme }) => (disabled ? theme.colors.neutral[200] : theme.colors.brand[800])};\n }\n`;\n\nexport const StyledItemTitles = styled('div', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.HEADER.TITLE_CONTAINER,\n})<StyledItemTitlesPropsT>`\n display: grid;\n grid-gap: ${({ theme }) => theme.space.xxxs};\n grid-template-columns: 100%;\n width: 100%;\n align-content: center;\n`;\n\nexport const StyledPrimaryTitle = styled('div', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.HEADER.PRIMARY_TITLE,\n})<StyledPrimaryTitlePropsT>`\n margin: 0;\n font-size: 16px;\n line-height: 1.125;\n text-align: left;\n text-overflow: ellipsis;\n min-height: ${({ theme }) => theme.space.xs};\n color: ${({ disabled, theme }) => (disabled ? theme.colors.neutral[500] : theme.colors.neutral[700])};\n font-weight: ${({ theme, isDSMobile }) => (isDSMobile ? theme.fontWeights.semibold : theme.fontWeights.regular)};\n ${({ selected }) =>\n selected\n ? `word-break: break-word;`\n : `\n overflow: hidden;\n white-space: nowrap;\n `};\n width: 100%;\n display: block;\n`;\n\nexport const StyledSecondaryTitle = styled('span', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.HEADER.SECONDARY_TITLE,\n})<StyledSecondaryTitlePropsT>`\n margin: 0;\n font-size: ${({ theme }) => theme.fontSizes.label[200]};\n line-height: 1.273;\n text-align: left;\n min-height: 12px;\n color: ${({ disabled, theme }) => (disabled ? theme.colors.neutral[500] : theme.colors.neutral[700])};\n text-overflow: ellipsis;\n ${({ selected }) =>\n selected\n ? `word-break: break-word;`\n : `\n overflow: hidden;\n white-space: nowrap;\n width: 100%;\n display: block;`}\n`;\n\nexport const StyledItemCustomActions = styled('div', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.HEADER.CUSTOM_ACTIONS_CONTAINER,\n})<StyledItemCustomActionsPropsT>`\n display: grid;\n grid-auto-flow: column;\n place-items: center;\n grid-gap: ${({ theme }) => theme.space.xxs};\n margin: ${({ theme, isDSMobile }) => (isDSMobile ? `0 ${theme.space.xs}` : '0 20px 0 16px')};\n justify-content: flex-end;\n height: 28px;\n`;\n\nexport const StyledItemHeaderContainer = styled('div', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.HEADER.CONTAINER,\n})<StyledItemHeaderContainerPropsT>`\n display: grid;\n grid-template-columns: auto max-content;\n place-items: center;\n position: relative;\n border-radius: 2px;\n &:hover {\n ${({ disabled, theme }) => (!disabled ? `background: ${theme.colors.brand[200]};` : ``)}\n }\n`;\n\nexport const StyledTooltipContent = styled('div', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.HEADER.TOOLTIP,\n})`\n padding: 8px;\n width: 250px;\n background: white;\n display: grid;\n gap: ${({ theme }) => theme.space.xxs};\n\n p {\n margin: 0;\n }\n`;\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,QAAQ,0BAA0B;AAC3C,SAAS,iBAAiB,wBAAwB;AA0C3C,MAAM,sBAAsB,OAAO,OAAO;AAAA,EAC/C,MAAM;AAAA,EACN,MAAM,iBAAiB,KAAK;AAC9B,CAAC;AAAA;AAAA;AAAA,6BAG4B,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport { styled, xStyledCommonProps } from '@elliemae/ds-system';\nimport { DSAccordionName, DSAccordionSlots } from '../../exported-related/index.js';\ninterface StyledItemHeaderPropsT {\n withCustomActions: boolean;\n withSecondaryTitle?: string;\n isDSMobile?: boolean;\n}\n\ninterface StyledItemTitlesPropsT {\n withSecondaryTitle?: string;\n isDSMobile?: boolean;\n selected: boolean;\n}\n\ninterface StyledPrimaryTitlePropsT {\n disabled: boolean;\n isDSMobile?: boolean;\n selected: boolean;\n withSecondaryTitle: boolean;\n}\n\ninterface StyledItemContentPropsT {\n isDSMobile?: boolean;\n}\n\ninterface StyledSecondaryTitlePropsT {\n disabled: boolean;\n selected: boolean;\n}\n\ninterface StyledItemAddonPropsT {\n disabled: boolean;\n isDSMobile?: boolean;\n}\n\ninterface StyledItemHeaderContainerPropsT {\n disabled: boolean;\n}\n\ninterface StyledItemCustomActionsPropsT {\n isDSMobile?: boolean;\n}\n\nexport const StyledItemContainer = styled('div', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.CONTAINER,\n})`\n display: grid;\n grid-template-rows: auto auto;\n border-bottom: 1px solid ${({ theme }) => theme.colors.neutral[200]};\n align-items: center;\n min-width: 240px;\n grid-template-columns: 100%;\n ${xStyledCommonProps};\n`;\n\nexport const StyledItemHeader = styled('button', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.HEADER.CONTAINER,\n})<StyledItemHeaderPropsT>`\n display: flex;\n min-height: ${({ theme, withSecondaryTitle, isDSMobile }) =>\n isDSMobile ? `44px` : `${withSecondaryTitle ? theme.space.m : theme.space.s}`};\n width: 100%;\n align-items: center;\n border: none;\n outline: none;\n background: none;\n &:hover {\n cursor: ${({ disabled }) => (disabled ? 'not-allowed' : 'pointer')};\n }\n padding: ${({ isDSMobile }) => (isDSMobile ? `0 16px` : `0`)};\n &:focus {\n &:after {\n position: absolute;\n content: '';\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n border-radius: 2px;\n border: 2px solid ${({ theme }) => theme.colors.brand[700]};\n pointer-events: none;\n }\n }\n`;\n\nexport const StyledItemContent = styled('div', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.CONTENT.CONTAINER,\n})<StyledItemContentPropsT>`\n padding: ${({ isDSMobile }) => (isDSMobile ? `3px 16px 24px 16px` : '16px 20px')};\n ${xStyledCommonProps};\n`;\n\nexport const StyledItemAddon = styled('div', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.HEADER.ADDON,\n})<StyledItemAddonPropsT>`\n height: 100%;\n display: grid;\n place-items: center;\n & .em-ds-icon svg {\n fill: ${({ disabled, theme }) => (disabled ? theme.colors.neutral[200] : theme.colors.brand[800])};\n }\n`;\n\nexport const StyledItemTitles = styled('div', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.HEADER.TITLE_CONTAINER,\n})<StyledItemTitlesPropsT>`\n display: grid;\n grid-gap: ${({ theme }) => theme.space.xxxs};\n grid-template-columns: 100%;\n width: 100%;\n align-content: center;\n`;\n\nexport const StyledPrimaryTitle = styled('div', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.HEADER.PRIMARY_TITLE,\n})<StyledPrimaryTitlePropsT>`\n margin: 0;\n font-size: 16px;\n line-height: 1.125;\n text-align: left;\n text-overflow: ellipsis;\n min-height: ${({ theme }) => theme.space.xs};\n color: ${({ disabled, theme }) => (disabled ? theme.colors.neutral[500] : theme.colors.neutral[700])};\n font-weight: ${({ theme, isDSMobile }) => (isDSMobile ? theme.fontWeights.semibold : theme.fontWeights.regular)};\n ${({ selected }) =>\n selected\n ? `word-break: break-word;`\n : `\n overflow: hidden;\n white-space: nowrap;\n `};\n width: 100%;\n display: block;\n`;\n\nexport const StyledSecondaryTitle = styled('span', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.HEADER.SECONDARY_TITLE,\n})<StyledSecondaryTitlePropsT>`\n margin: 0;\n font-size: ${({ theme }) => theme.fontSizes.label[200]};\n line-height: 1.273;\n text-align: left;\n min-height: 12px;\n color: ${({ disabled, theme }) => (disabled ? theme.colors.neutral[500] : theme.colors.neutral[700])};\n text-overflow: ellipsis;\n ${({ selected }) =>\n selected\n ? `word-break: break-word;`\n : `\n overflow: hidden;\n white-space: nowrap;\n width: 100%;\n display: block;`}\n`;\n\nexport const StyledItemCustomActions = styled('div', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.HEADER.CUSTOM_ACTIONS_CONTAINER,\n})<StyledItemCustomActionsPropsT>`\n display: grid;\n grid-auto-flow: column;\n place-items: center;\n grid-gap: ${({ theme }) => theme.space.xxs};\n margin: ${({ theme, isDSMobile }) => (isDSMobile ? `0 ${theme.space.xs}` : '0 20px 0 16px')};\n justify-content: flex-end;\n height: 28px;\n`;\n\nexport const StyledItemHeaderContainer = styled('div', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.HEADER.CONTAINER,\n})<StyledItemHeaderContainerPropsT>`\n display: grid;\n grid-template-columns: auto max-content;\n place-items: center;\n position: relative;\n border-radius: 2px;\n &:hover {\n ${({ disabled, theme }) => (!disabled ? `background: ${theme.colors.brand[200]};` : ``)}\n }\n`;\n\nexport const StyledTooltipContent = styled('div', {\n name: DSAccordionName,\n slot: DSAccordionSlots.ITEM.HEADER.TOOLTIP,\n})`\n padding: 8px;\n width: 250px;\n background: white;\n display: grid;\n gap: ${({ theme }) => theme.space.xxs};\n\n p {\n margin: 0;\n }\n`;\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { useCallback, useContext, useMemo } from "react";
|
|
3
|
-
import { DSAccordionContext } from "../../DSAccordionCTX";
|
|
3
|
+
import { DSAccordionContext } from "../../DSAccordionCTX.js";
|
|
4
4
|
const useAccordionItem = ({ value, disabled }) => {
|
|
5
5
|
const { actualActiveValue, setActiveValues, focusableChildrenReferences } = useContext(DSAccordionContext);
|
|
6
6
|
const selected = useMemo(() => {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/accordionItem/useAccordionItem.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type React from 'react';\nimport { useCallback, useContext, useMemo } from 'react';\nimport { DSAccordionContext } from '../../DSAccordionCTX';\n\nexport interface UseAccordionItemPropsT {\n value: string | number;\n disabled: boolean;\n}\n\ninterface UseAccordionItemReturnTypeT {\n handleOnClick: (e: React.MouseEvent) => void;\n handleOnKeyDown: (e: React.KeyboardEvent, dsIndex: number) => void;\n selected: boolean;\n}\n\nexport const useAccordionItem = ({ value, disabled }: UseAccordionItemPropsT): UseAccordionItemReturnTypeT => {\n const { actualActiveValue, setActiveValues, focusableChildrenReferences } = useContext(DSAccordionContext);\n\n const selected = useMemo(() => {\n if (Array.isArray(actualActiveValue)) {\n return actualActiveValue.some((currentValue) => currentValue === value);\n }\n return value === actualActiveValue;\n }, [actualActiveValue, value]);\n\n const handleOnClick = useCallback(\n (e: React.MouseEvent) => {\n if (!disabled) setActiveValues(value, e);\n },\n [disabled, setActiveValues, value],\n );\n\n const handleOnKeyDown = useCallback(\n (e: React.KeyboardEvent, _dsIndex: number) => {\n if (!disabled && e.key === 'ArrowDown') {\n const currentIndex = focusableChildrenReferences.findIndex((item) => item.index === _dsIndex);\n if (focusableChildrenReferences[currentIndex + 1]?.ref?.current)\n focusableChildrenReferences[currentIndex + 1]?.ref?.current?.focus();\n else if (currentIndex === focusableChildrenReferences.length - 1) {\n focusableChildrenReferences[0]?.ref?.current?.focus();\n }\n }\n\n if (!disabled && e.key === 'ArrowUp') {\n const currentIndex = focusableChildrenReferences.findIndex((item) => item.index === _dsIndex);\n if (focusableChildrenReferences[currentIndex - 1]?.ref?.current)\n focusableChildrenReferences[currentIndex - 1]?.ref?.current?.focus();\n else if (currentIndex === 0) {\n focusableChildrenReferences[focusableChildrenReferences.length - 1]?.ref?.current?.focus();\n }\n }\n },\n [disabled, focusableChildrenReferences],\n );\n\n return {\n handleOnClick,\n handleOnKeyDown,\n selected,\n };\n};\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,aAAa,YAAY,eAAe;AACjD,SAAS,0BAA0B;AAa5B,MAAM,mBAAmB,CAAC,EAAE,OAAO,SAAS,MAA2D;AAC5G,QAAM,EAAE,mBAAmB,iBAAiB,4BAA4B,IAAI,WAAW,kBAAkB;AAEzG,QAAM,WAAW,QAAQ,MAAM;AAC7B,QAAI,MAAM,QAAQ,iBAAiB,GAAG;AACpC,aAAO,kBAAkB,KAAK,CAAC,iBAAiB,iBAAiB,KAAK;AAAA,IACxE;AACA,WAAO,UAAU;AAAA,EACnB,GAAG,CAAC,mBAAmB,KAAK,CAAC;AAE7B,QAAM,gBAAgB;AAAA,IACpB,CAAC,MAAwB;AACvB,UAAI,CAAC;AAAU,wBAAgB,OAAO,CAAC;AAAA,IACzC;AAAA,IACA,CAAC,UAAU,iBAAiB,KAAK;AAAA,EACnC;AAEA,QAAM,kBAAkB;AAAA,IACtB,CAAC,GAAwB,aAAqB;AAC5C,UAAI,CAAC,YAAY,EAAE,QAAQ,aAAa;AACtC,cAAM,eAAe,4BAA4B,UAAU,CAAC,SAAS,KAAK,UAAU,QAAQ;AAC5F,YAAI,4BAA4B,eAAe,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type React from 'react';\nimport { useCallback, useContext, useMemo } from 'react';\nimport { DSAccordionContext } from '../../DSAccordionCTX.js';\n\nexport interface UseAccordionItemPropsT {\n value: string | number;\n disabled: boolean;\n}\n\ninterface UseAccordionItemReturnTypeT {\n handleOnClick: (e: React.MouseEvent) => void;\n handleOnKeyDown: (e: React.KeyboardEvent, dsIndex: number) => void;\n selected: boolean;\n}\n\nexport const useAccordionItem = ({ value, disabled }: UseAccordionItemPropsT): UseAccordionItemReturnTypeT => {\n const { actualActiveValue, setActiveValues, focusableChildrenReferences } = useContext(DSAccordionContext);\n\n const selected = useMemo(() => {\n if (Array.isArray(actualActiveValue)) {\n return actualActiveValue.some((currentValue) => currentValue === value);\n }\n return value === actualActiveValue;\n }, [actualActiveValue, value]);\n\n const handleOnClick = useCallback(\n (e: React.MouseEvent) => {\n if (!disabled) setActiveValues(value, e);\n },\n [disabled, setActiveValues, value],\n );\n\n const handleOnKeyDown = useCallback(\n (e: React.KeyboardEvent, _dsIndex: number) => {\n if (!disabled && e.key === 'ArrowDown') {\n const currentIndex = focusableChildrenReferences.findIndex((item) => item.index === _dsIndex);\n if (focusableChildrenReferences[currentIndex + 1]?.ref?.current)\n focusableChildrenReferences[currentIndex + 1]?.ref?.current?.focus();\n else if (currentIndex === focusableChildrenReferences.length - 1) {\n focusableChildrenReferences[0]?.ref?.current?.focus();\n }\n }\n\n if (!disabled && e.key === 'ArrowUp') {\n const currentIndex = focusableChildrenReferences.findIndex((item) => item.index === _dsIndex);\n if (focusableChildrenReferences[currentIndex - 1]?.ref?.current)\n focusableChildrenReferences[currentIndex - 1]?.ref?.current?.focus();\n else if (currentIndex === 0) {\n focusableChildrenReferences[focusableChildrenReferences.length - 1]?.ref?.current?.focus();\n }\n }\n },\n [disabled, focusableChildrenReferences],\n );\n\n return {\n handleOnClick,\n handleOnKeyDown,\n selected,\n };\n};\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,aAAa,YAAY,eAAe;AACjD,SAAS,0BAA0B;AAa5B,MAAM,mBAAmB,CAAC,EAAE,OAAO,SAAS,MAA2D;AAC5G,QAAM,EAAE,mBAAmB,iBAAiB,4BAA4B,IAAI,WAAW,kBAAkB;AAEzG,QAAM,WAAW,QAAQ,MAAM;AAC7B,QAAI,MAAM,QAAQ,iBAAiB,GAAG;AACpC,aAAO,kBAAkB,KAAK,CAAC,iBAAiB,iBAAiB,KAAK;AAAA,IACxE;AACA,WAAO,UAAU;AAAA,EACnB,GAAG,CAAC,mBAAmB,KAAK,CAAC;AAE7B,QAAM,gBAAgB;AAAA,IACpB,CAAC,MAAwB;AACvB,UAAI,CAAC;AAAU,wBAAgB,OAAO,CAAC;AAAA,IACzC;AAAA,IACA,CAAC,UAAU,iBAAiB,KAAK;AAAA,EACnC;AAEA,QAAM,kBAAkB;AAAA,IACtB,CAAC,GAAwB,aAAqB;AAC5C,UAAI,CAAC,YAAY,EAAE,QAAQ,aAAa;AACtC,cAAM,eAAe,4BAA4B,UAAU,CAAC,SAAS,KAAK,UAAU,QAAQ;AAC5F,YAAI,4BAA4B,eAAe,CAAC,GAAG,KAAK;AACtD,sCAA4B,eAAe,CAAC,GAAG,KAAK,SAAS,MAAM;AAAA,iBAC5D,iBAAiB,4BAA4B,SAAS,GAAG;AAChE,sCAA4B,CAAC,GAAG,KAAK,SAAS,MAAM;AAAA,QACtD;AAAA,MACF;AAEA,UAAI,CAAC,YAAY,EAAE,QAAQ,WAAW;AACpC,cAAM,eAAe,4BAA4B,UAAU,CAAC,SAAS,KAAK,UAAU,QAAQ;AAC5F,YAAI,4BAA4B,eAAe,CAAC,GAAG,KAAK;AACtD,sCAA4B,eAAe,CAAC,GAAG,KAAK,SAAS,MAAM;AAAA,iBAC5D,iBAAiB,GAAG;AAC3B,sCAA4B,4BAA4B,SAAS,CAAC,GAAG,KAAK,SAAS,MAAM;AAAA,QAC3F;AAAA,MACF;AAAA,IACF;AAAA,IACA,CAAC,UAAU,2BAA2B;AAAA,EACxC;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|