@elliemae/ds-data-table 3.0.0-next.43 → 3.0.0-next.46

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.
Files changed (13) hide show
  1. package/dist/cjs/addons/Columns/ColumnExpand/ColumnExpand.js +2 -0
  2. package/dist/cjs/addons/Columns/ColumnExpand/ColumnExpand.js.map +2 -2
  3. package/dist/cjs/exported-related/Toolbar/Toolbar.js +3 -4
  4. package/dist/cjs/exported-related/Toolbar/Toolbar.js.map +2 -2
  5. package/dist/cjs/parts/FilterBar/FiltersBar.js +4 -5
  6. package/dist/cjs/parts/FilterBar/FiltersBar.js.map +2 -2
  7. package/dist/esm/addons/Columns/ColumnExpand/ColumnExpand.js +2 -0
  8. package/dist/esm/addons/Columns/ColumnExpand/ColumnExpand.js.map +2 -2
  9. package/dist/esm/exported-related/Toolbar/Toolbar.js +4 -5
  10. package/dist/esm/exported-related/Toolbar/Toolbar.js.map +2 -2
  11. package/dist/esm/parts/FilterBar/FiltersBar.js +5 -6
  12. package/dist/esm/parts/FilterBar/FiltersBar.js.map +2 -2
  13. package/package.json +15 -15
package/dist/cjs/addons/Columns/ColumnExpand/ColumnExpand.js CHANGED
@@ -166,11 +166,13 @@ const expandRowColumn = {
166
166
  "data-is-col-expanded": isExpanded,
167
167
  "data-role": "row-expander-col",
168
168
  size: "s",
169
+ color: ["brand-primary", "600"],
169
170
  "data-testid": import_constants.DATA_TESTID.DATA_TABLE_ICON_ARROW_DOWN
170
171
  }) : /* @__PURE__ */ import_react.default.createElement(import_ds_icons.ArrowheadRight, {
171
172
  "data-is-col-expanded": isExpanded,
172
173
  "data-role": "row-expander-col",
173
174
  size: "s",
175
+ color: ["brand-primary", "600"],
174
176
  "data-testid": import_constants.DATA_TESTID.DATA_TABLE_ICON_ARROW_RIGHT
175
177
  }), [isExpanded, isDragging, isDragOverlay]);
176
178
  const ChildIcon = (0, import_react.useMemo)(() => /* @__PURE__ */ import_react.default.createElement(import_ds_icons.ArrowShortReturn, {
package/dist/cjs/addons/Columns/ColumnExpand/ColumnExpand.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../src/addons/Columns/ColumnExpand/ColumnExpand.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["/* eslint-disable react/prop-types */\n/* eslint-disable max-lines */\nimport React, { useMemo, useCallback } from 'react';\nimport { ArrowheadDown, ArrowheadRight, ArrowShortReturn } from '@elliemae/ds-icons';\nimport * as CSS from 'csstype';\nimport styled from 'styled-components';\nimport { TypescriptColumn } from '../../../types/props';\nimport { StyledFocusWithin } from '../../../styled';\nimport { DATA_TESTID } from '../../../configs/constants';\n\nconst StyledSpan = styled.span`\n cursor: pointer;\n box-sizing: border-box;\n outline: none;\n display: flex;\n justify-content: center;\n align-items: center;\n`;\n\nexport const expandRowColumn: TypescriptColumn = {\n // Build our expander column\n id: 'expander', // Make sure it has an ID\n accessor: 'expandRowColumn',\n Header: ({ ctx }) => {\n const {\n tableProps: { expandedRows, onRowExpand },\n allDataFlattened,\n } = ctx;\n\n const allExpandable = useMemo(() => {\n const expandable = {};\n allDataFlattened.forEach((row) => {\n if (row.original.subRows || row.original.tableRowDetails || row.original.dimsumHeaderValue)\n expandable[row.uid] = true;\n });\n return expandable;\n }, [allDataFlattened]);\n\n const isAllRowsExpanded = useMemo(\n () => Object.keys(allExpandable).length === Object.keys(expandedRows).length,\n [allExpandable, expandedRows],\n );\n\n const onExpandedAllHandler = useCallback(() => {\n if (isAllRowsExpanded) onRowExpand({}, 'All');\n else onRowExpand({ ...allExpandable }, 'All');\n }, [allExpandable, isAllRowsExpanded, onRowExpand]);\n\n const GlobalExpandIcon = useMemo(() => {\n if (isAllRowsExpanded)\n return (\n <ArrowheadDown\n size=\"s\"\n color={['brand-primary', '600']}\n data-testid={DATA_TESTID.DATA_TABLE_ICON_ARROW_DOWN}\n />\n );\n\n // Mixed\n if (Object.keys(expandedRows).length) {\n return (\n <ArrowheadRight\n size=\"s\"\n color={['brand-primary', '600']}\n data-testid={DATA_TESTID.DATA_TABLE_ICON_ARROW_MIXED}\n style={{ transform: 'rotate(45deg)' }}\n />\n );\n }\n return (\n <ArrowheadRight\n size=\"s\"\n color={['brand-primary', '600']}\n data-testid={DATA_TESTID.DATA_TABLE_ICON_ARROW_RIGHT}\n />\n );\n }, [expandedRows, isAllRowsExpanded]);\n\n return (\n <StyledFocusWithin>\n <StyledSpan\n role=\"button\"\n tabIndex={0}\n title=\"Toggle All Rows Expanded\"\n onClick={onExpandedAllHandler}\n onKeyDown={(e) => {\n if (['Enter', 'Space'].includes(e.code)) {\n onExpandedAllHandler();\n e.preventDefault();\n }\n }}\n data-testid={DATA_TESTID.DATA_TABLE_GLOBAL_EXPAND_CELL}\n aria-expanded={isAllRowsExpanded}\n style={{ width: '24px', height: '24px' }}\n >\n {GlobalExpandIcon}\n </StyledSpan>\n </StyledFocusWithin>\n );\n },\n Cell: ({ cell, row, isRowSelected, ctx, draggableProps }) => {\n const {\n tableProps: { dragAndDropRows, expandedRows, onRowExpand },\n } = ctx;\n\n const uniqueId = row.uid;\n\n const isExpanded = expandedRows[uniqueId];\n\n const shouldPrintCaret =\n (row.original.subRows?.length && row.depth === 0) || // only allows 1 level of expands\n row.original.tableRowDetails ||\n row.original.dimsumHeaderValue;\n\n const onRowExpandHandler = useCallback(\n (e) => {\n e.stopPropagation();\n if (expandedRows[uniqueId]) {\n delete expandedRows[uniqueId];\n } else {\n expandedRows[uniqueId] = true;\n }\n onRowExpand({ ...expandedRows }, uniqueId);\n },\n [expandedRows, uniqueId, onRowExpand],\n );\n\n const isDragging = draggableProps ? draggableProps.isDragging : false;\n const isDragOverlay = dragAndDropRows && !draggableProps;\n\n const indentStyle: CSS.Properties = useMemo(\n () => ({\n marginLeft: `${row.depth * 32}px`,\n marginRight: '18px',\n paddingLeft: '2px',\n paddingRight: '2px',\n position: 'relative',\n height: '100%',\n display: 'flex',\n alignItems: 'center',\n }),\n [row.depth],\n );\n\n const rowProps = useMemo(\n () => ({\n role: 'button',\n key: `${row.uid}-expand-button`,\n title: 'Toggle Row Expanded',\n onClick: onRowExpandHandler,\n onKeyDown: (e) => {\n if (['Enter', 'Space'].includes(e.code)) {\n e.preventDefault();\n onRowExpandHandler(e);\n }\n },\n ref: cell.ref,\n tabIndex: isRowSelected ? 0 : -1,\n 'data-testid': 'data-table-row-expand-cell',\n 'aria-expanded': isExpanded,\n isRightArrow: !isExpanded || isDragging || isDragOverlay,\n }),\n [row.uid, onRowExpandHandler, cell.ref, isRowSelected, isExpanded, isDragging, isDragOverlay],\n );\n\n const PureCaretIcon = useMemo(\n () =>\n isExpanded && !isDragging && !isDragOverlay ? (\n <ArrowheadDown\n data-is-col-expanded={isExpanded}\n data-role=\"row-expander-col\"\n size=\"s\"\n data-testid={DATA_TESTID.DATA_TABLE_ICON_ARROW_DOWN}\n />\n ) : (\n <ArrowheadRight\n data-is-col-expanded={isExpanded}\n data-role=\"row-expander-col\"\n size=\"s\"\n data-testid={DATA_TESTID.DATA_TABLE_ICON_ARROW_RIGHT}\n />\n ),\n [isExpanded, isDragging, isDragOverlay],\n );\n\n const ChildIcon = useMemo(\n () => (\n <ArrowShortReturn\n size=\"s\"\n data-testid={DATA_TESTID.DATA_TABLE_ICON_CHILD}\n style={{ transform: 'rotate(90deg) scaleY(-1)' }}\n color={['brand-primary', '600']}\n />\n ),\n [],\n );\n\n if (shouldPrintCaret)\n return (\n <StyledFocusWithin style={indentStyle}>\n <StyledSpan {...rowProps}>{PureCaretIcon}</StyledSpan>\n </StyledFocusWithin>\n );\n if (row.depth !== 0) return <span style={indentStyle}>{ChildIcon}</span>;\n\n return <div style={{ width: '36px' }} />;\n },\n textWrap: 'wrap',\n canResize: false,\n width: 25,\n padding: 0,\n isFocuseable: false,\n disableDnD: true,\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["/* eslint-disable react/prop-types */\n/* eslint-disable max-lines */\nimport React, { useMemo, useCallback } from 'react';\nimport { ArrowheadDown, ArrowheadRight, ArrowShortReturn } from '@elliemae/ds-icons';\nimport * as CSS from 'csstype';\nimport styled from 'styled-components';\nimport { TypescriptColumn } from '../../../types/props';\nimport { StyledFocusWithin } from '../../../styled';\nimport { DATA_TESTID } from '../../../configs/constants';\n\nconst StyledSpan = styled.span`\n cursor: pointer;\n box-sizing: border-box;\n outline: none;\n display: flex;\n justify-content: center;\n align-items: center;\n`;\n\nexport const expandRowColumn: TypescriptColumn = {\n // Build our expander column\n id: 'expander', // Make sure it has an ID\n accessor: 'expandRowColumn',\n Header: ({ ctx }) => {\n const {\n tableProps: { expandedRows, onRowExpand },\n allDataFlattened,\n } = ctx;\n\n const allExpandable = useMemo(() => {\n const expandable = {};\n allDataFlattened.forEach((row) => {\n if (row.original.subRows || row.original.tableRowDetails || row.original.dimsumHeaderValue)\n expandable[row.uid] = true;\n });\n return expandable;\n }, [allDataFlattened]);\n\n const isAllRowsExpanded = useMemo(\n () => Object.keys(allExpandable).length === Object.keys(expandedRows).length,\n [allExpandable, expandedRows],\n );\n\n const onExpandedAllHandler = useCallback(() => {\n if (isAllRowsExpanded) onRowExpand({}, 'All');\n else onRowExpand({ ...allExpandable }, 'All');\n }, [allExpandable, isAllRowsExpanded, onRowExpand]);\n\n const GlobalExpandIcon = useMemo(() => {\n if (isAllRowsExpanded)\n return (\n <ArrowheadDown\n size=\"s\"\n color={['brand-primary', '600']}\n data-testid={DATA_TESTID.DATA_TABLE_ICON_ARROW_DOWN}\n />\n );\n\n // Mixed\n if (Object.keys(expandedRows).length) {\n return (\n <ArrowheadRight\n size=\"s\"\n color={['brand-primary', '600']}\n data-testid={DATA_TESTID.DATA_TABLE_ICON_ARROW_MIXED}\n style={{ transform: 'rotate(45deg)' }}\n />\n );\n }\n return (\n <ArrowheadRight\n size=\"s\"\n color={['brand-primary', '600']}\n data-testid={DATA_TESTID.DATA_TABLE_ICON_ARROW_RIGHT}\n />\n );\n }, [expandedRows, isAllRowsExpanded]);\n\n return (\n <StyledFocusWithin>\n <StyledSpan\n role=\"button\"\n tabIndex={0}\n title=\"Toggle All Rows Expanded\"\n onClick={onExpandedAllHandler}\n onKeyDown={(e) => {\n if (['Enter', 'Space'].includes(e.code)) {\n onExpandedAllHandler();\n e.preventDefault();\n }\n }}\n data-testid={DATA_TESTID.DATA_TABLE_GLOBAL_EXPAND_CELL}\n aria-expanded={isAllRowsExpanded}\n style={{ width: '24px', height: '24px' }}\n >\n {GlobalExpandIcon}\n </StyledSpan>\n </StyledFocusWithin>\n );\n },\n Cell: ({ cell, row, isRowSelected, ctx, draggableProps }) => {\n const {\n tableProps: { dragAndDropRows, expandedRows, onRowExpand },\n } = ctx;\n\n const uniqueId = row.uid;\n\n const isExpanded = expandedRows[uniqueId];\n\n const shouldPrintCaret =\n (row.original.subRows?.length && row.depth === 0) || // only allows 1 level of expands\n row.original.tableRowDetails ||\n row.original.dimsumHeaderValue;\n\n const onRowExpandHandler = useCallback(\n (e) => {\n e.stopPropagation();\n if (expandedRows[uniqueId]) {\n delete expandedRows[uniqueId];\n } else {\n expandedRows[uniqueId] = true;\n }\n onRowExpand({ ...expandedRows }, uniqueId);\n },\n [expandedRows, uniqueId, onRowExpand],\n );\n\n const isDragging = draggableProps ? draggableProps.isDragging : false;\n const isDragOverlay = dragAndDropRows && !draggableProps;\n\n const indentStyle: CSS.Properties = useMemo(\n () => ({\n marginLeft: `${row.depth * 32}px`,\n marginRight: '18px',\n paddingLeft: '2px',\n paddingRight: '2px',\n position: 'relative',\n height: '100%',\n display: 'flex',\n alignItems: 'center',\n }),\n [row.depth],\n );\n\n const rowProps = useMemo(\n () => ({\n role: 'button',\n key: `${row.uid}-expand-button`,\n title: 'Toggle Row Expanded',\n onClick: onRowExpandHandler,\n onKeyDown: (e) => {\n if (['Enter', 'Space'].includes(e.code)) {\n e.preventDefault();\n onRowExpandHandler(e);\n }\n },\n ref: cell.ref,\n tabIndex: isRowSelected ? 0 : -1,\n 'data-testid': 'data-table-row-expand-cell',\n 'aria-expanded': isExpanded,\n isRightArrow: !isExpanded || isDragging || isDragOverlay,\n }),\n [row.uid, onRowExpandHandler, cell.ref, isRowSelected, isExpanded, isDragging, isDragOverlay],\n );\n\n const PureCaretIcon = useMemo(\n () =>\n isExpanded && !isDragging && !isDragOverlay ? (\n <ArrowheadDown\n data-is-col-expanded={isExpanded}\n data-role=\"row-expander-col\"\n size=\"s\"\n color={['brand-primary', '600']}\n data-testid={DATA_TESTID.DATA_TABLE_ICON_ARROW_DOWN}\n />\n ) : (\n <ArrowheadRight\n data-is-col-expanded={isExpanded}\n data-role=\"row-expander-col\"\n size=\"s\"\n color={['brand-primary', '600']}\n data-testid={DATA_TESTID.DATA_TABLE_ICON_ARROW_RIGHT}\n />\n ),\n [isExpanded, isDragging, isDragOverlay],\n );\n\n const ChildIcon = useMemo(\n () => (\n <ArrowShortReturn\n size=\"s\"\n data-testid={DATA_TESTID.DATA_TABLE_ICON_CHILD}\n style={{ transform: 'rotate(90deg) scaleY(-1)' }}\n color={['brand-primary', '600']}\n />\n ),\n [],\n );\n\n if (shouldPrintCaret)\n return (\n <StyledFocusWithin style={indentStyle}>\n <StyledSpan {...rowProps}>{PureCaretIcon}</StyledSpan>\n </StyledFocusWithin>\n );\n if (row.depth !== 0) return <span style={indentStyle}>{ChildIcon}</span>;\n\n return <div style={{ width: '36px' }} />;\n },\n textWrap: 'wrap',\n canResize: false,\n width: 25,\n padding: 0,\n isFocuseable: false,\n disableDnD: true,\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
package/dist/cjs/exported-related/Toolbar/Toolbar.js CHANGED
@@ -96,15 +96,14 @@ const Toolbar = ({ children }) => {
96
96
  }, /* @__PURE__ */ import_react.default.createElement(ToolbarWrapper, {
97
97
  onMouseEnter: () => setShow(true),
98
98
  onMouseLeave: () => setShow(clicked)
99
- }, show && /* @__PURE__ */ import_react.default.createElement(ToolbarBtns, null, children), /* @__PURE__ */ import_react.default.createElement(import_ds_button.DSButton, {
100
- buttonType: "text",
99
+ }, show && /* @__PURE__ */ import_react.default.createElement(ToolbarBtns, null, children), /* @__PURE__ */ import_react.default.createElement(import_ds_button.DSButtonV2, {
100
+ buttonType: "icon",
101
101
  className: "toolbar-trigger",
102
102
  "data-testid": import_constants.DATA_TESTID.DATA_TABLE_TOOLBAR_TRIGGER,
103
- icon: /* @__PURE__ */ import_react.default.createElement(import_ds_icons.MoreOptionsVert, null),
104
103
  onClick: handleOnClick,
105
104
  onKeyDown: (e) => ["Enter", "Space"].includes(e.code) && handleOnClick(),
106
105
  tabIndex: 0
107
- })));
106
+ }, /* @__PURE__ */ import_react.default.createElement(import_ds_icons.MoreOptionsVert, null))));
108
107
  };
109
108
  module.exports = __toCommonJS(Toolbar_exports);
110
109
  //# sourceMappingURL=Toolbar.js.map
package/dist/cjs/exported-related/Toolbar/Toolbar.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/exported-related/Toolbar/Toolbar.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import React, { useCallback, useRef, useState } from 'react';\nimport styled from 'styled-components';\nimport { DSButton } from '@elliemae/ds-button';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { useOnClickOutside } from '@elliemae/ds-utilities';\nimport { DATA_TESTID } from '../../configs/constants';\n\nconst ToolbarBtns = styled.div`\n & > .em-ds-toolbar {\n box-shadow: none;\n }\n`;\n\nconst ToolbarWrapper = styled.div`\n display: flex;\n align-items: center;\n height: 36px;\n margin-right: 1px;\n pointer-events: all;\n &:hover {\n box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.13), 0 1px 2px 0 rgba(0, 0, 0, 0.2);\n & > .toolbar-trigger {\n border: none;\n }\n }\n`;\n\nconst ToolbarPosition = styled.div`\n display: flex;\n justify-content: flex-end;\n align-items: center;\n pointer-events: none;\n background: white;\n height: 28px;\n margin-top: 4px;\n width: 100%;\n padding-left: 4px;\n &:hover {\n z-index: 1;\n }\n :after {\n content: '';\n position: absolute;\n left: 0px;\n top: 4px;\n bottom: 4px;\n width: 1px;\n background-color: ${(props) => props.theme.colors.neutral['080']};\n z-index: 7;\n }\n`;\n\n// eslint-disable-next-line react/prop-types\nexport const Toolbar: React.ComponentType = ({ children }) => {\n const [show, setShow] = useState(false);\n const [clicked, setClicked] = useState(false);\n\n const toolbarRef = useRef(null);\n\n const handleOnClickOutside = useCallback(() => {\n setShow(false);\n setClicked(false);\n }, []);\n\n const handleOnClick = useCallback(() => {\n setShow(true);\n setClicked(true);\n }, []);\n\n useOnClickOutside(toolbarRef, handleOnClickOutside);\n\n return (\n <ToolbarPosition ref={toolbarRef}>\n <ToolbarWrapper onMouseEnter={() => setShow(true)} onMouseLeave={() => setShow(clicked)}>\n {show && <ToolbarBtns>{children}</ToolbarBtns>}\n <DSButton\n buttonType=\"text\"\n className=\"toolbar-trigger\"\n data-testid={DATA_TESTID.DATA_TABLE_TOOLBAR_TRIGGER}\n icon={<MoreOptionsVert />}\n onClick={handleOnClick}\n onKeyDown={(e) => ['Enter', 'Space'].includes(e.code) && handleOnClick()}\n tabIndex={0}\n />\n </ToolbarWrapper>\n </ToolbarPosition>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAqD;AACrD,+BAAmB;AACnB,uBAAyB;AACzB,sBAAgC;AAChC,0BAAkC;AAClC,uBAA4B;AAE5B,MAAM,cAAc,iCAAO;AAAA;AAAA;AAAA;AAAA;AAM3B,MAAM,iBAAiB,iCAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAc9B,MAAM,kBAAkB,iCAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAoBP,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAMvD,MAAM,UAA+B,CAAC,EAAE,eAAe;AAC5D,QAAM,CAAC,MAAM,WAAW,2BAAS,KAAK;AACtC,QAAM,CAAC,SAAS,cAAc,2BAAS,KAAK;AAE5C,QAAM,aAAa,yBAAO,IAAI;AAE9B,QAAM,uBAAuB,8BAAY,MAAM;AAC7C,YAAQ,KAAK;AACb,eAAW,KAAK;AAAA,EAClB,GAAG,CAAC,CAAC;AAEL,QAAM,gBAAgB,8BAAY,MAAM;AACtC,YAAQ,IAAI;AACZ,eAAW,IAAI;AAAA,EACjB,GAAG,CAAC,CAAC;AAEL,6CAAkB,YAAY,oBAAoB;AAElD,SACE,mDAAC;AAAA,IAAgB,KAAK;AAAA,KACpB,mDAAC;AAAA,IAAe,cAAc,MAAM,QAAQ,IAAI;AAAA,IAAG,cAAc,MAAM,QAAQ,OAAO;AAAA,KACnF,QAAQ,mDAAC,mBAAa,QAAS,GAChC,mDAAC;AAAA,IACC,YAAW;AAAA,IACX,WAAU;AAAA,IACV,eAAa,6BAAY;AAAA,IACzB,MAAM,mDAAC,qCAAgB;AAAA,IACvB,SAAS;AAAA,IACT,WAAW,CAAC,MAAM,CAAC,SAAS,OAAO,EAAE,SAAS,EAAE,IAAI,KAAK,cAAc;AAAA,IACvE,UAAU;AAAA,GACZ,CACF,CACF;AAEJ;",
4
+ "sourcesContent": ["import React, { useCallback, useRef, useState } from 'react';\nimport styled from 'styled-components';\nimport { DSButtonV2 } from '@elliemae/ds-button';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { useOnClickOutside } from '@elliemae/ds-utilities';\nimport { DATA_TESTID } from '../../configs/constants';\n\nconst ToolbarBtns = styled.div`\n & > .em-ds-toolbar {\n box-shadow: none;\n }\n`;\n\nconst ToolbarWrapper = styled.div`\n display: flex;\n align-items: center;\n height: 36px;\n margin-right: 1px;\n pointer-events: all;\n &:hover {\n box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.13), 0 1px 2px 0 rgba(0, 0, 0, 0.2);\n & > .toolbar-trigger {\n border: none;\n }\n }\n`;\n\nconst ToolbarPosition = styled.div`\n display: flex;\n justify-content: flex-end;\n align-items: center;\n pointer-events: none;\n background: white;\n height: 28px;\n margin-top: 4px;\n width: 100%;\n padding-left: 4px;\n &:hover {\n z-index: 1;\n }\n :after {\n content: '';\n position: absolute;\n left: 0px;\n top: 4px;\n bottom: 4px;\n width: 1px;\n background-color: ${(props) => props.theme.colors.neutral['080']};\n z-index: 7;\n }\n`;\n\n// eslint-disable-next-line react/prop-types\nexport const Toolbar: React.ComponentType = ({ children }) => {\n const [show, setShow] = useState(false);\n const [clicked, setClicked] = useState(false);\n\n const toolbarRef = useRef(null);\n\n const handleOnClickOutside = useCallback(() => {\n setShow(false);\n setClicked(false);\n }, []);\n\n const handleOnClick = useCallback(() => {\n setShow(true);\n setClicked(true);\n }, []);\n\n useOnClickOutside(toolbarRef, handleOnClickOutside);\n\n return (\n <ToolbarPosition ref={toolbarRef}>\n <ToolbarWrapper onMouseEnter={() => setShow(true)} onMouseLeave={() => setShow(clicked)}>\n {show && <ToolbarBtns>{children}</ToolbarBtns>}\n <DSButtonV2\n buttonType=\"icon\"\n className=\"toolbar-trigger\"\n data-testid={DATA_TESTID.DATA_TABLE_TOOLBAR_TRIGGER}\n onClick={handleOnClick}\n onKeyDown={(e) => ['Enter', 'Space'].includes(e.code) && handleOnClick()}\n tabIndex={0}\n >\n <MoreOptionsVert />\n </DSButtonV2>\n </ToolbarWrapper>\n </ToolbarPosition>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAqD;AACrD,+BAAmB;AACnB,uBAA2B;AAC3B,sBAAgC;AAChC,0BAAkC;AAClC,uBAA4B;AAE5B,MAAM,cAAc,iCAAO;AAAA;AAAA;AAAA;AAAA;AAM3B,MAAM,iBAAiB,iCAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAc9B,MAAM,kBAAkB,iCAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAoBP,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAMvD,MAAM,UAA+B,CAAC,EAAE,eAAe;AAC5D,QAAM,CAAC,MAAM,WAAW,2BAAS,KAAK;AACtC,QAAM,CAAC,SAAS,cAAc,2BAAS,KAAK;AAE5C,QAAM,aAAa,yBAAO,IAAI;AAE9B,QAAM,uBAAuB,8BAAY,MAAM;AAC7C,YAAQ,KAAK;AACb,eAAW,KAAK;AAAA,EAClB,GAAG,CAAC,CAAC;AAEL,QAAM,gBAAgB,8BAAY,MAAM;AACtC,YAAQ,IAAI;AACZ,eAAW,IAAI;AAAA,EACjB,GAAG,CAAC,CAAC;AAEL,6CAAkB,YAAY,oBAAoB;AAElD,SACE,mDAAC;AAAA,IAAgB,KAAK;AAAA,KACpB,mDAAC;AAAA,IAAe,cAAc,MAAM,QAAQ,IAAI;AAAA,IAAG,cAAc,MAAM,QAAQ,OAAO;AAAA,KACnF,QAAQ,mDAAC,mBAAa,QAAS,GAChC,mDAAC;AAAA,IACC,YAAW;AAAA,IACX,WAAU;AAAA,IACV,eAAa,6BAAY;AAAA,IACzB,SAAS;AAAA,IACT,WAAW,CAAC,MAAM,CAAC,SAAS,OAAO,EAAE,SAAS,EAAE,IAAI,KAAK,cAAc;AAAA,IACvE,UAAU;AAAA,KAEV,mDAAC,qCAAgB,CACnB,CACF,CACF;AAEJ;",
6
6
  "names": []
7
7
  }
package/dist/cjs/parts/FilterBar/FiltersBar.js CHANGED
@@ -97,14 +97,13 @@ const FiltersBar = () => {
97
97
  },
98
98
  ...filterBarProps?.extraOptions || []
99
99
  ],
100
- triggerComponent: /* @__PURE__ */ import_react.default.createElement(import_ds_button.DSButton, {
100
+ triggerComponent: /* @__PURE__ */ import_react.default.createElement(import_ds_button.DSButtonV2, {
101
101
  containerProps: {
102
102
  "data-testid": import_constants.DATA_TESTID.DATA_TABLE_FILTER_BAR_DD_MENU_BUTTON
103
103
  },
104
- buttonType: "text",
105
- innerRef: dropdownMenuRef,
106
- icon: /* @__PURE__ */ import_react.default.createElement(import_ds_icons.MoreOptionsVert, null)
107
- })
104
+ buttonType: "icon",
105
+ innerRef: dropdownMenuRef
106
+ }, /* @__PURE__ */ import_react.default.createElement(import_ds_icons.MoreOptionsVert, null))
108
107
  }));
109
108
  };
110
109
  module.exports = __toCommonJS(FiltersBar_exports);
package/dist/cjs/parts/FilterBar/FiltersBar.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/parts/FilterBar/FiltersBar.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["/* eslint-disable react/prop-types */\nimport React, { useCallback, useContext, useMemo, useRef } from 'react';\nimport { DSButton } from '@elliemae/ds-button';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { FILTER_TYPES } from '../../exported-related';\nimport {\n SelectPill,\n MultiSelectPill,\n SingleDatePill,\n DateRangePill,\n NumberRangePill,\n DateSwitcherPill,\n} from './components';\nimport { DataTableContext } from '../../DataTableContext';\nimport { StyledDropdownMenu, StyledWrapper } from './styled';\nimport { FilterPillComponent } from './types';\nimport { DATA_TESTID } from '../../configs/constants';\n\nconst pillRenderMapper: Record<string, FilterPillComponent<any>> = {\n [FILTER_TYPES.SELECT]: SelectPill,\n [FILTER_TYPES.MULTI_SELECT]: MultiSelectPill,\n [FILTER_TYPES.SINGLE_DATE]: SingleDatePill,\n [FILTER_TYPES.DATE_RANGE]: DateRangePill,\n [FILTER_TYPES.DATE_SWITCHER]: DateSwitcherPill,\n [FILTER_TYPES.NUMBER_RANGE]: NumberRangePill,\n [FILTER_TYPES.CURRENCY_RANGE]: NumberRangePill,\n};\n\nexport const FiltersBar: React.ComponentType = () => {\n const {\n tableProps: { width, filterBarProps, onFiltersChange, filters },\n visibleColumns,\n } = useContext(DataTableContext);\n\n const pillGroupRefs = useMemo(() => {\n const refs: React.RefObject<HTMLElement>[] = [];\n for (let i = 0; i < filters.length; i += 1) refs.push(React.createRef());\n return refs;\n }, [filters.length]);\n\n const dropdownMenuRef = useRef(null);\n\n const removeAllFilters = useCallback(() => {\n onFiltersChange([]);\n }, [onFiltersChange]);\n\n return (\n <StyledWrapper width={width} aria-live=\"polite\" aria-relevant=\"additions removals\" gutter=\"xs\">\n {filters.map(({ id: column, type, value }, index) => {\n const columnHeader = visibleColumns.find((col) => col.accessor === column)?.Header;\n let Component: FilterPillComponent<unknown> = () => null;\n\n const filterType = type;\n if (filterType in pillRenderMapper) {\n Component = pillRenderMapper[filterType];\n } else if (filterBarProps?.customPillRenderer) {\n Component = filterBarProps.customPillRenderer;\n }\n return (\n <Component\n key={column}\n columnHeader={typeof columnHeader === 'string' ? columnHeader : column}\n column={column}\n value={value}\n filters={filters}\n onFiltersChange={onFiltersChange}\n prevRef={pillGroupRefs[index - 1]}\n innerRef={pillGroupRefs[index]}\n nextRef={pillGroupRefs[index + 1] ?? dropdownMenuRef}\n />\n );\n })}\n <StyledDropdownMenu\n preventOverflow=\"scrollParent\"\n options={[\n {\n id: '__internal__option__clear__filters',\n label: 'Clear Filters',\n onClick: removeAllFilters,\n },\n ...(filterBarProps?.extraOptions || []),\n ]}\n triggerComponent={\n <DSButton\n containerProps={{\n 'data-testid': DATA_TESTID.DATA_TABLE_FILTER_BAR_DD_MENU_BUTTON,\n }}\n buttonType=\"text\"\n innerRef={dropdownMenuRef}\n icon={<MoreOptionsVert />}\n />\n }\n />\n </StyledWrapper>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAgE;AAChE,uBAAyB;AACzB,sBAAgC;AAChC,8BAA6B;AAC7B,wBAOO;AACP,8BAAiC;AACjC,oBAAkD;AAElD,uBAA4B;AAE5B,MAAM,mBAA6D;AAAA,GAChE,qCAAa,SAAS;AAAA,GACtB,qCAAa,eAAe;AAAA,GAC5B,qCAAa,cAAc;AAAA,GAC3B,qCAAa,aAAa;AAAA,GAC1B,qCAAa,gBAAgB;AAAA,GAC7B,qCAAa,eAAe;AAAA,GAC5B,qCAAa,iBAAiB;AACjC;AAEO,MAAM,aAAkC,MAAM;AACnD,QAAM;AAAA,IACJ,YAAY,EAAE,OAAO,gBAAgB,iBAAiB;AAAA,IACtD;AAAA,MACE,6BAAW,wCAAgB;AAE/B,QAAM,gBAAgB,0BAAQ,MAAM;AAClC,UAAM,OAAuC,CAAC;AAC9C,aAAS,IAAI,GAAG,IAAI,QAAQ,QAAQ,KAAK;AAAG,WAAK,KAAK,qBAAM,UAAU,CAAC;AACvE,WAAO;AAAA,EACT,GAAG,CAAC,QAAQ,MAAM,CAAC;AAEnB,QAAM,kBAAkB,yBAAO,IAAI;AAEnC,QAAM,mBAAmB,8BAAY,MAAM;AACzC,oBAAgB,CAAC,CAAC;AAAA,EACpB,GAAG,CAAC,eAAe,CAAC;AAEpB,SACE,mDAAC;AAAA,IAAc;AAAA,IAAc,aAAU;AAAA,IAAS,iBAAc;AAAA,IAAqB,QAAO;AAAA,KACvF,QAAQ,IAAI,CAAC,EAAE,IAAI,QAAQ,MAAM,SAAS,UAAU;AACnD,UAAM,eAAe,eAAe,KAAK,CAAC,QAAQ,IAAI,aAAa,MAAM,GAAG;AAC5E,QAAI,YAA0C,MAAM;AAEpD,UAAM,aAAa;AACnB,QAAI,cAAc,kBAAkB;AAClC,kBAAY,iBAAiB;AAAA,IAC/B,WAAW,gBAAgB,oBAAoB;AAC7C,kBAAY,eAAe;AAAA,IAC7B;AACA,WACE,mDAAC;AAAA,MACC,KAAK;AAAA,MACL,cAAc,OAAO,iBAAiB,WAAW,eAAe;AAAA,MAChE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,SAAS,cAAc,QAAQ;AAAA,MAC/B,UAAU,cAAc;AAAA,MACxB,SAAS,cAAc,QAAQ,MAAM;AAAA,KACvC;AAAA,EAEJ,CAAC,GACD,mDAAC;AAAA,IACC,iBAAgB;AAAA,IAChB,SAAS;AAAA,MACP;AAAA,QACE,IAAI;AAAA,QACJ,OAAO;AAAA,QACP,SAAS;AAAA,MACX;AAAA,MACA,GAAI,gBAAgB,gBAAgB,CAAC;AAAA,IACvC;AAAA,IACA,kBACE,mDAAC;AAAA,MACC,gBAAgB;AAAA,QACd,eAAe,6BAAY;AAAA,MAC7B;AAAA,MACA,YAAW;AAAA,MACX,UAAU;AAAA,MACV,MAAM,mDAAC,qCAAgB;AAAA,KACzB;AAAA,GAEJ,CACF;AAEJ;",
4
+ "sourcesContent": ["/* eslint-disable react/prop-types */\nimport React, { useCallback, useContext, useMemo, useRef } from 'react';\nimport { DSButtonV2 } from '@elliemae/ds-button';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { FILTER_TYPES } from '../../exported-related';\nimport {\n SelectPill,\n MultiSelectPill,\n SingleDatePill,\n DateRangePill,\n NumberRangePill,\n DateSwitcherPill,\n} from './components';\nimport { DataTableContext } from '../../DataTableContext';\nimport { StyledDropdownMenu, StyledWrapper } from './styled';\nimport { FilterPillComponent } from './types';\nimport { DATA_TESTID } from '../../configs/constants';\n\nconst pillRenderMapper: Record<string, FilterPillComponent<any>> = {\n [FILTER_TYPES.SELECT]: SelectPill,\n [FILTER_TYPES.MULTI_SELECT]: MultiSelectPill,\n [FILTER_TYPES.SINGLE_DATE]: SingleDatePill,\n [FILTER_TYPES.DATE_RANGE]: DateRangePill,\n [FILTER_TYPES.DATE_SWITCHER]: DateSwitcherPill,\n [FILTER_TYPES.NUMBER_RANGE]: NumberRangePill,\n [FILTER_TYPES.CURRENCY_RANGE]: NumberRangePill,\n};\n\nexport const FiltersBar: React.ComponentType = () => {\n const {\n tableProps: { width, filterBarProps, onFiltersChange, filters },\n visibleColumns,\n } = useContext(DataTableContext);\n\n const pillGroupRefs = useMemo(() => {\n const refs: React.RefObject<HTMLElement>[] = [];\n for (let i = 0; i < filters.length; i += 1) refs.push(React.createRef());\n return refs;\n }, [filters.length]);\n\n const dropdownMenuRef = useRef(null);\n\n const removeAllFilters = useCallback(() => {\n onFiltersChange([]);\n }, [onFiltersChange]);\n\n return (\n <StyledWrapper width={width} aria-live=\"polite\" aria-relevant=\"additions removals\" gutter=\"xs\">\n {filters.map(({ id: column, type, value }, index) => {\n const columnHeader = visibleColumns.find((col) => col.accessor === column)?.Header;\n let Component: FilterPillComponent<unknown> = () => null;\n\n const filterType = type;\n if (filterType in pillRenderMapper) {\n Component = pillRenderMapper[filterType];\n } else if (filterBarProps?.customPillRenderer) {\n Component = filterBarProps.customPillRenderer;\n }\n return (\n <Component\n key={column}\n columnHeader={typeof columnHeader === 'string' ? columnHeader : column}\n column={column}\n value={value}\n filters={filters}\n onFiltersChange={onFiltersChange}\n prevRef={pillGroupRefs[index - 1]}\n innerRef={pillGroupRefs[index]}\n nextRef={pillGroupRefs[index + 1] ?? dropdownMenuRef}\n />\n );\n })}\n <StyledDropdownMenu\n preventOverflow=\"scrollParent\"\n options={[\n {\n id: '__internal__option__clear__filters',\n label: 'Clear Filters',\n onClick: removeAllFilters,\n },\n ...(filterBarProps?.extraOptions || []),\n ]}\n triggerComponent={\n <DSButtonV2\n containerProps={{\n 'data-testid': DATA_TESTID.DATA_TABLE_FILTER_BAR_DD_MENU_BUTTON,\n }}\n buttonType=\"icon\"\n innerRef={dropdownMenuRef}\n >\n <MoreOptionsVert />\n </DSButtonV2>\n }\n />\n </StyledWrapper>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAgE;AAChE,uBAA2B;AAC3B,sBAAgC;AAChC,8BAA6B;AAC7B,wBAOO;AACP,8BAAiC;AACjC,oBAAkD;AAElD,uBAA4B;AAE5B,MAAM,mBAA6D;AAAA,GAChE,qCAAa,SAAS;AAAA,GACtB,qCAAa,eAAe;AAAA,GAC5B,qCAAa,cAAc;AAAA,GAC3B,qCAAa,aAAa;AAAA,GAC1B,qCAAa,gBAAgB;AAAA,GAC7B,qCAAa,eAAe;AAAA,GAC5B,qCAAa,iBAAiB;AACjC;AAEO,MAAM,aAAkC,MAAM;AACnD,QAAM;AAAA,IACJ,YAAY,EAAE,OAAO,gBAAgB,iBAAiB;AAAA,IACtD;AAAA,MACE,6BAAW,wCAAgB;AAE/B,QAAM,gBAAgB,0BAAQ,MAAM;AAClC,UAAM,OAAuC,CAAC;AAC9C,aAAS,IAAI,GAAG,IAAI,QAAQ,QAAQ,KAAK;AAAG,WAAK,KAAK,qBAAM,UAAU,CAAC;AACvE,WAAO;AAAA,EACT,GAAG,CAAC,QAAQ,MAAM,CAAC;AAEnB,QAAM,kBAAkB,yBAAO,IAAI;AAEnC,QAAM,mBAAmB,8BAAY,MAAM;AACzC,oBAAgB,CAAC,CAAC;AAAA,EACpB,GAAG,CAAC,eAAe,CAAC;AAEpB,SACE,mDAAC;AAAA,IAAc;AAAA,IAAc,aAAU;AAAA,IAAS,iBAAc;AAAA,IAAqB,QAAO;AAAA,KACvF,QAAQ,IAAI,CAAC,EAAE,IAAI,QAAQ,MAAM,SAAS,UAAU;AACnD,UAAM,eAAe,eAAe,KAAK,CAAC,QAAQ,IAAI,aAAa,MAAM,GAAG;AAC5E,QAAI,YAA0C,MAAM;AAEpD,UAAM,aAAa;AACnB,QAAI,cAAc,kBAAkB;AAClC,kBAAY,iBAAiB;AAAA,IAC/B,WAAW,gBAAgB,oBAAoB;AAC7C,kBAAY,eAAe;AAAA,IAC7B;AACA,WACE,mDAAC;AAAA,MACC,KAAK;AAAA,MACL,cAAc,OAAO,iBAAiB,WAAW,eAAe;AAAA,MAChE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,SAAS,cAAc,QAAQ;AAAA,MAC/B,UAAU,cAAc;AAAA,MACxB,SAAS,cAAc,QAAQ,MAAM;AAAA,KACvC;AAAA,EAEJ,CAAC,GACD,mDAAC;AAAA,IACC,iBAAgB;AAAA,IAChB,SAAS;AAAA,MACP;AAAA,QACE,IAAI;AAAA,QACJ,OAAO;AAAA,QACP,SAAS;AAAA,MACX;AAAA,MACA,GAAI,gBAAgB,gBAAgB,CAAC;AAAA,IACvC;AAAA,IACA,kBACE,mDAAC;AAAA,MACC,gBAAgB;AAAA,QACd,eAAe,6BAAY;AAAA,MAC7B;AAAA,MACA,YAAW;AAAA,MACX,UAAU;AAAA,OAEV,mDAAC,qCAAgB,CACnB;AAAA,GAEJ,CACF;AAEJ;",
6
6
  "names": []
7
7
  }
package/dist/esm/addons/Columns/ColumnExpand/ColumnExpand.js CHANGED
@@ -137,11 +137,13 @@ const expandRowColumn = {
137
137
  "data-is-col-expanded": isExpanded,
138
138
  "data-role": "row-expander-col",
139
139
  size: "s",
140
+ color: ["brand-primary", "600"],
140
141
  "data-testid": DATA_TESTID.DATA_TABLE_ICON_ARROW_DOWN
141
142
  }) : /* @__PURE__ */ React2.createElement(ArrowheadRight, {
142
143
  "data-is-col-expanded": isExpanded,
143
144
  "data-role": "row-expander-col",
144
145
  size: "s",
146
+ color: ["brand-primary", "600"],
145
147
  "data-testid": DATA_TESTID.DATA_TABLE_ICON_ARROW_RIGHT
146
148
  }), [isExpanded, isDragging, isDragOverlay]);
147
149
  const ChildIcon = useMemo(() => /* @__PURE__ */ React2.createElement(ArrowShortReturn, {
package/dist/esm/addons/Columns/ColumnExpand/ColumnExpand.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/addons/Columns/ColumnExpand/ColumnExpand.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/prop-types */\n/* eslint-disable max-lines */\nimport React, { useMemo, useCallback } from 'react';\nimport { ArrowheadDown, ArrowheadRight, ArrowShortReturn } from '@elliemae/ds-icons';\nimport * as CSS from 'csstype';\nimport styled from 'styled-components';\nimport { TypescriptColumn } from '../../../types/props';\nimport { StyledFocusWithin } from '../../../styled';\nimport { DATA_TESTID } from '../../../configs/constants';\n\nconst StyledSpan = styled.span`\n cursor: pointer;\n box-sizing: border-box;\n outline: none;\n display: flex;\n justify-content: center;\n align-items: center;\n`;\n\nexport const expandRowColumn: TypescriptColumn = {\n // Build our expander column\n id: 'expander', // Make sure it has an ID\n accessor: 'expandRowColumn',\n Header: ({ ctx }) => {\n const {\n tableProps: { expandedRows, onRowExpand },\n allDataFlattened,\n } = ctx;\n\n const allExpandable = useMemo(() => {\n const expandable = {};\n allDataFlattened.forEach((row) => {\n if (row.original.subRows || row.original.tableRowDetails || row.original.dimsumHeaderValue)\n expandable[row.uid] = true;\n });\n return expandable;\n }, [allDataFlattened]);\n\n const isAllRowsExpanded = useMemo(\n () => Object.keys(allExpandable).length === Object.keys(expandedRows).length,\n [allExpandable, expandedRows],\n );\n\n const onExpandedAllHandler = useCallback(() => {\n if (isAllRowsExpanded) onRowExpand({}, 'All');\n else onRowExpand({ ...allExpandable }, 'All');\n }, [allExpandable, isAllRowsExpanded, onRowExpand]);\n\n const GlobalExpandIcon = useMemo(() => {\n if (isAllRowsExpanded)\n return (\n <ArrowheadDown\n size=\"s\"\n color={['brand-primary', '600']}\n data-testid={DATA_TESTID.DATA_TABLE_ICON_ARROW_DOWN}\n />\n );\n\n // Mixed\n if (Object.keys(expandedRows).length) {\n return (\n <ArrowheadRight\n size=\"s\"\n color={['brand-primary', '600']}\n data-testid={DATA_TESTID.DATA_TABLE_ICON_ARROW_MIXED}\n style={{ transform: 'rotate(45deg)' }}\n />\n );\n }\n return (\n <ArrowheadRight\n size=\"s\"\n color={['brand-primary', '600']}\n data-testid={DATA_TESTID.DATA_TABLE_ICON_ARROW_RIGHT}\n />\n );\n }, [expandedRows, isAllRowsExpanded]);\n\n return (\n <StyledFocusWithin>\n <StyledSpan\n role=\"button\"\n tabIndex={0}\n title=\"Toggle All Rows Expanded\"\n onClick={onExpandedAllHandler}\n onKeyDown={(e) => {\n if (['Enter', 'Space'].includes(e.code)) {\n onExpandedAllHandler();\n e.preventDefault();\n }\n }}\n data-testid={DATA_TESTID.DATA_TABLE_GLOBAL_EXPAND_CELL}\n aria-expanded={isAllRowsExpanded}\n style={{ width: '24px', height: '24px' }}\n >\n {GlobalExpandIcon}\n </StyledSpan>\n </StyledFocusWithin>\n );\n },\n Cell: ({ cell, row, isRowSelected, ctx, draggableProps }) => {\n const {\n tableProps: { dragAndDropRows, expandedRows, onRowExpand },\n } = ctx;\n\n const uniqueId = row.uid;\n\n const isExpanded = expandedRows[uniqueId];\n\n const shouldPrintCaret =\n (row.original.subRows?.length && row.depth === 0) || // only allows 1 level of expands\n row.original.tableRowDetails ||\n row.original.dimsumHeaderValue;\n\n const onRowExpandHandler = useCallback(\n (e) => {\n e.stopPropagation();\n if (expandedRows[uniqueId]) {\n delete expandedRows[uniqueId];\n } else {\n expandedRows[uniqueId] = true;\n }\n onRowExpand({ ...expandedRows }, uniqueId);\n },\n [expandedRows, uniqueId, onRowExpand],\n );\n\n const isDragging = draggableProps ? draggableProps.isDragging : false;\n const isDragOverlay = dragAndDropRows && !draggableProps;\n\n const indentStyle: CSS.Properties = useMemo(\n () => ({\n marginLeft: `${row.depth * 32}px`,\n marginRight: '18px',\n paddingLeft: '2px',\n paddingRight: '2px',\n position: 'relative',\n height: '100%',\n display: 'flex',\n alignItems: 'center',\n }),\n [row.depth],\n );\n\n const rowProps = useMemo(\n () => ({\n role: 'button',\n key: `${row.uid}-expand-button`,\n title: 'Toggle Row Expanded',\n onClick: onRowExpandHandler,\n onKeyDown: (e) => {\n if (['Enter', 'Space'].includes(e.code)) {\n e.preventDefault();\n onRowExpandHandler(e);\n }\n },\n ref: cell.ref,\n tabIndex: isRowSelected ? 0 : -1,\n 'data-testid': 'data-table-row-expand-cell',\n 'aria-expanded': isExpanded,\n isRightArrow: !isExpanded || isDragging || isDragOverlay,\n }),\n [row.uid, onRowExpandHandler, cell.ref, isRowSelected, isExpanded, isDragging, isDragOverlay],\n );\n\n const PureCaretIcon = useMemo(\n () =>\n isExpanded && !isDragging && !isDragOverlay ? (\n <ArrowheadDown\n data-is-col-expanded={isExpanded}\n data-role=\"row-expander-col\"\n size=\"s\"\n data-testid={DATA_TESTID.DATA_TABLE_ICON_ARROW_DOWN}\n />\n ) : (\n <ArrowheadRight\n data-is-col-expanded={isExpanded}\n data-role=\"row-expander-col\"\n size=\"s\"\n data-testid={DATA_TESTID.DATA_TABLE_ICON_ARROW_RIGHT}\n />\n ),\n [isExpanded, isDragging, isDragOverlay],\n );\n\n const ChildIcon = useMemo(\n () => (\n <ArrowShortReturn\n size=\"s\"\n data-testid={DATA_TESTID.DATA_TABLE_ICON_CHILD}\n style={{ transform: 'rotate(90deg) scaleY(-1)' }}\n color={['brand-primary', '600']}\n />\n ),\n [],\n );\n\n if (shouldPrintCaret)\n return (\n <StyledFocusWithin style={indentStyle}>\n <StyledSpan {...rowProps}>{PureCaretIcon}</StyledSpan>\n </StyledFocusWithin>\n );\n if (row.depth !== 0) return <span style={indentStyle}>{ChildIcon}</span>;\n\n return <div style={{ width: '36px' }} />;\n },\n textWrap: 'wrap',\n canResize: false,\n width: 25,\n padding: 0,\n isFocuseable: false,\n disableDnD: true,\n};\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/prop-types */\n/* eslint-disable max-lines */\nimport React, { useMemo, useCallback } from 'react';\nimport { ArrowheadDown, ArrowheadRight, ArrowShortReturn } from '@elliemae/ds-icons';\nimport * as CSS from 'csstype';\nimport styled from 'styled-components';\nimport { TypescriptColumn } from '../../../types/props';\nimport { StyledFocusWithin } from '../../../styled';\nimport { DATA_TESTID } from '../../../configs/constants';\n\nconst StyledSpan = styled.span`\n cursor: pointer;\n box-sizing: border-box;\n outline: none;\n display: flex;\n justify-content: center;\n align-items: center;\n`;\n\nexport const expandRowColumn: TypescriptColumn = {\n // Build our expander column\n id: 'expander', // Make sure it has an ID\n accessor: 'expandRowColumn',\n Header: ({ ctx }) => {\n const {\n tableProps: { expandedRows, onRowExpand },\n allDataFlattened,\n } = ctx;\n\n const allExpandable = useMemo(() => {\n const expandable = {};\n allDataFlattened.forEach((row) => {\n if (row.original.subRows || row.original.tableRowDetails || row.original.dimsumHeaderValue)\n expandable[row.uid] = true;\n });\n return expandable;\n }, [allDataFlattened]);\n\n const isAllRowsExpanded = useMemo(\n () => Object.keys(allExpandable).length === Object.keys(expandedRows).length,\n [allExpandable, expandedRows],\n );\n\n const onExpandedAllHandler = useCallback(() => {\n if (isAllRowsExpanded) onRowExpand({}, 'All');\n else onRowExpand({ ...allExpandable }, 'All');\n }, [allExpandable, isAllRowsExpanded, onRowExpand]);\n\n const GlobalExpandIcon = useMemo(() => {\n if (isAllRowsExpanded)\n return (\n <ArrowheadDown\n size=\"s\"\n color={['brand-primary', '600']}\n data-testid={DATA_TESTID.DATA_TABLE_ICON_ARROW_DOWN}\n />\n );\n\n // Mixed\n if (Object.keys(expandedRows).length) {\n return (\n <ArrowheadRight\n size=\"s\"\n color={['brand-primary', '600']}\n data-testid={DATA_TESTID.DATA_TABLE_ICON_ARROW_MIXED}\n style={{ transform: 'rotate(45deg)' }}\n />\n );\n }\n return (\n <ArrowheadRight\n size=\"s\"\n color={['brand-primary', '600']}\n data-testid={DATA_TESTID.DATA_TABLE_ICON_ARROW_RIGHT}\n />\n );\n }, [expandedRows, isAllRowsExpanded]);\n\n return (\n <StyledFocusWithin>\n <StyledSpan\n role=\"button\"\n tabIndex={0}\n title=\"Toggle All Rows Expanded\"\n onClick={onExpandedAllHandler}\n onKeyDown={(e) => {\n if (['Enter', 'Space'].includes(e.code)) {\n onExpandedAllHandler();\n e.preventDefault();\n }\n }}\n data-testid={DATA_TESTID.DATA_TABLE_GLOBAL_EXPAND_CELL}\n aria-expanded={isAllRowsExpanded}\n style={{ width: '24px', height: '24px' }}\n >\n {GlobalExpandIcon}\n </StyledSpan>\n </StyledFocusWithin>\n );\n },\n Cell: ({ cell, row, isRowSelected, ctx, draggableProps }) => {\n const {\n tableProps: { dragAndDropRows, expandedRows, onRowExpand },\n } = ctx;\n\n const uniqueId = row.uid;\n\n const isExpanded = expandedRows[uniqueId];\n\n const shouldPrintCaret =\n (row.original.subRows?.length && row.depth === 0) || // only allows 1 level of expands\n row.original.tableRowDetails ||\n row.original.dimsumHeaderValue;\n\n const onRowExpandHandler = useCallback(\n (e) => {\n e.stopPropagation();\n if (expandedRows[uniqueId]) {\n delete expandedRows[uniqueId];\n } else {\n expandedRows[uniqueId] = true;\n }\n onRowExpand({ ...expandedRows }, uniqueId);\n },\n [expandedRows, uniqueId, onRowExpand],\n );\n\n const isDragging = draggableProps ? draggableProps.isDragging : false;\n const isDragOverlay = dragAndDropRows && !draggableProps;\n\n const indentStyle: CSS.Properties = useMemo(\n () => ({\n marginLeft: `${row.depth * 32}px`,\n marginRight: '18px',\n paddingLeft: '2px',\n paddingRight: '2px',\n position: 'relative',\n height: '100%',\n display: 'flex',\n alignItems: 'center',\n }),\n [row.depth],\n );\n\n const rowProps = useMemo(\n () => ({\n role: 'button',\n key: `${row.uid}-expand-button`,\n title: 'Toggle Row Expanded',\n onClick: onRowExpandHandler,\n onKeyDown: (e) => {\n if (['Enter', 'Space'].includes(e.code)) {\n e.preventDefault();\n onRowExpandHandler(e);\n }\n },\n ref: cell.ref,\n tabIndex: isRowSelected ? 0 : -1,\n 'data-testid': 'data-table-row-expand-cell',\n 'aria-expanded': isExpanded,\n isRightArrow: !isExpanded || isDragging || isDragOverlay,\n }),\n [row.uid, onRowExpandHandler, cell.ref, isRowSelected, isExpanded, isDragging, isDragOverlay],\n );\n\n const PureCaretIcon = useMemo(\n () =>\n isExpanded && !isDragging && !isDragOverlay ? (\n <ArrowheadDown\n data-is-col-expanded={isExpanded}\n data-role=\"row-expander-col\"\n size=\"s\"\n color={['brand-primary', '600']}\n data-testid={DATA_TESTID.DATA_TABLE_ICON_ARROW_DOWN}\n />\n ) : (\n <ArrowheadRight\n data-is-col-expanded={isExpanded}\n data-role=\"row-expander-col\"\n size=\"s\"\n color={['brand-primary', '600']}\n data-testid={DATA_TESTID.DATA_TABLE_ICON_ARROW_RIGHT}\n />\n ),\n [isExpanded, isDragging, isDragOverlay],\n );\n\n const ChildIcon = useMemo(\n () => (\n <ArrowShortReturn\n size=\"s\"\n data-testid={DATA_TESTID.DATA_TABLE_ICON_CHILD}\n style={{ transform: 'rotate(90deg) scaleY(-1)' }}\n color={['brand-primary', '600']}\n />\n ),\n [],\n );\n\n if (shouldPrintCaret)\n return (\n <StyledFocusWithin style={indentStyle}>\n <StyledSpan {...rowProps}>{PureCaretIcon}</StyledSpan>\n </StyledFocusWithin>\n );\n if (row.depth !== 0) return <span style={indentStyle}>{ChildIcon}</span>;\n\n return <div style={{ width: '36px' }} />;\n },\n textWrap: 'wrap',\n canResize: false,\n width: 25,\n padding: 0,\n isFocuseable: false,\n disableDnD: true,\n};\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
package/dist/esm/exported-related/Toolbar/Toolbar.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import * as React from "react";
2
2
  import React2, { useCallback, useRef, useState } from "react";
3
3
  import styled from "styled-components";
4
- import { DSButton } from "@elliemae/ds-button";
4
+ import { DSButtonV2 } from "@elliemae/ds-button";
5
5
  import { MoreOptionsVert } from "@elliemae/ds-icons";
6
6
  import { useOnClickOutside } from "@elliemae/ds-utilities";
7
7
  import { DATA_TESTID } from "../../configs/constants";
@@ -65,15 +65,14 @@ const Toolbar = ({ children }) => {
65
65
  }, /* @__PURE__ */ React2.createElement(ToolbarWrapper, {
66
66
  onMouseEnter: () => setShow(true),
67
67
  onMouseLeave: () => setShow(clicked)
68
- }, show && /* @__PURE__ */ React2.createElement(ToolbarBtns, null, children), /* @__PURE__ */ React2.createElement(DSButton, {
69
- buttonType: "text",
68
+ }, show && /* @__PURE__ */ React2.createElement(ToolbarBtns, null, children), /* @__PURE__ */ React2.createElement(DSButtonV2, {
69
+ buttonType: "icon",
70
70
  className: "toolbar-trigger",
71
71
  "data-testid": DATA_TESTID.DATA_TABLE_TOOLBAR_TRIGGER,
72
- icon: /* @__PURE__ */ React2.createElement(MoreOptionsVert, null),
73
72
  onClick: handleOnClick,
74
73
  onKeyDown: (e) => ["Enter", "Space"].includes(e.code) && handleOnClick(),
75
74
  tabIndex: 0
76
- })));
75
+ }, /* @__PURE__ */ React2.createElement(MoreOptionsVert, null))));
77
76
  };
78
77
  export {
79
78
  Toolbar
package/dist/esm/exported-related/Toolbar/Toolbar.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/exported-related/Toolbar/Toolbar.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useCallback, useRef, useState } from 'react';\nimport styled from 'styled-components';\nimport { DSButton } from '@elliemae/ds-button';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { useOnClickOutside } from '@elliemae/ds-utilities';\nimport { DATA_TESTID } from '../../configs/constants';\n\nconst ToolbarBtns = styled.div`\n & > .em-ds-toolbar {\n box-shadow: none;\n }\n`;\n\nconst ToolbarWrapper = styled.div`\n display: flex;\n align-items: center;\n height: 36px;\n margin-right: 1px;\n pointer-events: all;\n &:hover {\n box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.13), 0 1px 2px 0 rgba(0, 0, 0, 0.2);\n & > .toolbar-trigger {\n border: none;\n }\n }\n`;\n\nconst ToolbarPosition = styled.div`\n display: flex;\n justify-content: flex-end;\n align-items: center;\n pointer-events: none;\n background: white;\n height: 28px;\n margin-top: 4px;\n width: 100%;\n padding-left: 4px;\n &:hover {\n z-index: 1;\n }\n :after {\n content: '';\n position: absolute;\n left: 0px;\n top: 4px;\n bottom: 4px;\n width: 1px;\n background-color: ${(props) => props.theme.colors.neutral['080']};\n z-index: 7;\n }\n`;\n\n// eslint-disable-next-line react/prop-types\nexport const Toolbar: React.ComponentType = ({ children }) => {\n const [show, setShow] = useState(false);\n const [clicked, setClicked] = useState(false);\n\n const toolbarRef = useRef(null);\n\n const handleOnClickOutside = useCallback(() => {\n setShow(false);\n setClicked(false);\n }, []);\n\n const handleOnClick = useCallback(() => {\n setShow(true);\n setClicked(true);\n }, []);\n\n useOnClickOutside(toolbarRef, handleOnClickOutside);\n\n return (\n <ToolbarPosition ref={toolbarRef}>\n <ToolbarWrapper onMouseEnter={() => setShow(true)} onMouseLeave={() => setShow(clicked)}>\n {show && <ToolbarBtns>{children}</ToolbarBtns>}\n <DSButton\n buttonType=\"text\"\n className=\"toolbar-trigger\"\n data-testid={DATA_TESTID.DATA_TABLE_TOOLBAR_TRIGGER}\n icon={<MoreOptionsVert />}\n onClick={handleOnClick}\n onKeyDown={(e) => ['Enter', 'Space'].includes(e.code) && handleOnClick()}\n tabIndex={0}\n />\n </ToolbarWrapper>\n </ToolbarPosition>\n );\n};\n"],
5
- "mappings": "AAAA;ACAA;AACA;AACA;AACA;AACA;AACA;AAEA,MAAM,cAAc,OAAO;AAAA;AAAA;AAAA;AAAA;AAM3B,MAAM,iBAAiB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAc9B,MAAM,kBAAkB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAoBP,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAMvD,MAAM,UAA+B,CAAC,EAAE,eAAe;AAC5D,QAAM,CAAC,MAAM,WAAW,SAAS,KAAK;AACtC,QAAM,CAAC,SAAS,cAAc,SAAS,KAAK;AAE5C,QAAM,aAAa,OAAO,IAAI;AAE9B,QAAM,uBAAuB,YAAY,MAAM;AAC7C,YAAQ,KAAK;AACb,eAAW,KAAK;AAAA,EAClB,GAAG,CAAC,CAAC;AAEL,QAAM,gBAAgB,YAAY,MAAM;AACtC,YAAQ,IAAI;AACZ,eAAW,IAAI;AAAA,EACjB,GAAG,CAAC,CAAC;AAEL,oBAAkB,YAAY,oBAAoB;AAElD,SACE,qCAAC;AAAA,IAAgB,KAAK;AAAA,KACpB,qCAAC;AAAA,IAAe,cAAc,MAAM,QAAQ,IAAI;AAAA,IAAG,cAAc,MAAM,QAAQ,OAAO;AAAA,KACnF,QAAQ,qCAAC,mBAAa,QAAS,GAChC,qCAAC;AAAA,IACC,YAAW;AAAA,IACX,WAAU;AAAA,IACV,eAAa,YAAY;AAAA,IACzB,MAAM,qCAAC,qBAAgB;AAAA,IACvB,SAAS;AAAA,IACT,WAAW,CAAC,MAAM,CAAC,SAAS,OAAO,EAAE,SAAS,EAAE,IAAI,KAAK,cAAc;AAAA,IACvE,UAAU;AAAA,GACZ,CACF,CACF;AAEJ;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useCallback, useRef, useState } from 'react';\nimport styled from 'styled-components';\nimport { DSButtonV2 } from '@elliemae/ds-button';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { useOnClickOutside } from '@elliemae/ds-utilities';\nimport { DATA_TESTID } from '../../configs/constants';\n\nconst ToolbarBtns = styled.div`\n & > .em-ds-toolbar {\n box-shadow: none;\n }\n`;\n\nconst ToolbarWrapper = styled.div`\n display: flex;\n align-items: center;\n height: 36px;\n margin-right: 1px;\n pointer-events: all;\n &:hover {\n box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.13), 0 1px 2px 0 rgba(0, 0, 0, 0.2);\n & > .toolbar-trigger {\n border: none;\n }\n }\n`;\n\nconst ToolbarPosition = styled.div`\n display: flex;\n justify-content: flex-end;\n align-items: center;\n pointer-events: none;\n background: white;\n height: 28px;\n margin-top: 4px;\n width: 100%;\n padding-left: 4px;\n &:hover {\n z-index: 1;\n }\n :after {\n content: '';\n position: absolute;\n left: 0px;\n top: 4px;\n bottom: 4px;\n width: 1px;\n background-color: ${(props) => props.theme.colors.neutral['080']};\n z-index: 7;\n }\n`;\n\n// eslint-disable-next-line react/prop-types\nexport const Toolbar: React.ComponentType = ({ children }) => {\n const [show, setShow] = useState(false);\n const [clicked, setClicked] = useState(false);\n\n const toolbarRef = useRef(null);\n\n const handleOnClickOutside = useCallback(() => {\n setShow(false);\n setClicked(false);\n }, []);\n\n const handleOnClick = useCallback(() => {\n setShow(true);\n setClicked(true);\n }, []);\n\n useOnClickOutside(toolbarRef, handleOnClickOutside);\n\n return (\n <ToolbarPosition ref={toolbarRef}>\n <ToolbarWrapper onMouseEnter={() => setShow(true)} onMouseLeave={() => setShow(clicked)}>\n {show && <ToolbarBtns>{children}</ToolbarBtns>}\n <DSButtonV2\n buttonType=\"icon\"\n className=\"toolbar-trigger\"\n data-testid={DATA_TESTID.DATA_TABLE_TOOLBAR_TRIGGER}\n onClick={handleOnClick}\n onKeyDown={(e) => ['Enter', 'Space'].includes(e.code) && handleOnClick()}\n tabIndex={0}\n >\n <MoreOptionsVert />\n </DSButtonV2>\n </ToolbarWrapper>\n </ToolbarPosition>\n );\n};\n"],
5
+ "mappings": "AAAA;ACAA;AACA;AACA;AACA;AACA;AACA;AAEA,MAAM,cAAc,OAAO;AAAA;AAAA;AAAA;AAAA;AAM3B,MAAM,iBAAiB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAc9B,MAAM,kBAAkB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAoBP,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAMvD,MAAM,UAA+B,CAAC,EAAE,eAAe;AAC5D,QAAM,CAAC,MAAM,WAAW,SAAS,KAAK;AACtC,QAAM,CAAC,SAAS,cAAc,SAAS,KAAK;AAE5C,QAAM,aAAa,OAAO,IAAI;AAE9B,QAAM,uBAAuB,YAAY,MAAM;AAC7C,YAAQ,KAAK;AACb,eAAW,KAAK;AAAA,EAClB,GAAG,CAAC,CAAC;AAEL,QAAM,gBAAgB,YAAY,MAAM;AACtC,YAAQ,IAAI;AACZ,eAAW,IAAI;AAAA,EACjB,GAAG,CAAC,CAAC;AAEL,oBAAkB,YAAY,oBAAoB;AAElD,SACE,qCAAC;AAAA,IAAgB,KAAK;AAAA,KACpB,qCAAC;AAAA,IAAe,cAAc,MAAM,QAAQ,IAAI;AAAA,IAAG,cAAc,MAAM,QAAQ,OAAO;AAAA,KACnF,QAAQ,qCAAC,mBAAa,QAAS,GAChC,qCAAC;AAAA,IACC,YAAW;AAAA,IACX,WAAU;AAAA,IACV,eAAa,YAAY;AAAA,IACzB,SAAS;AAAA,IACT,WAAW,CAAC,MAAM,CAAC,SAAS,OAAO,EAAE,SAAS,EAAE,IAAI,KAAK,cAAc;AAAA,IACvE,UAAU;AAAA,KAEV,qCAAC,qBAAgB,CACnB,CACF,CACF;AAEJ;",
6
6
  "names": []
7
7
  }
package/dist/esm/parts/FilterBar/FiltersBar.js CHANGED
@@ -1,6 +1,6 @@
1
1
  import * as React from "react";
2
2
  import React2, { useCallback, useContext, useMemo, useRef } from "react";
3
- import { DSButton } from "@elliemae/ds-button";
3
+ import { DSButtonV2 } from "@elliemae/ds-button";
4
4
  import { MoreOptionsVert } from "@elliemae/ds-icons";
5
5
  import { FILTER_TYPES } from "../../exported-related";
6
6
  import {
@@ -73,14 +73,13 @@ const FiltersBar = () => {
73
73
  },
74
74
  ...filterBarProps?.extraOptions || []
75
75
  ],
76
- triggerComponent: /* @__PURE__ */ React2.createElement(DSButton, {
76
+ triggerComponent: /* @__PURE__ */ React2.createElement(DSButtonV2, {
77
77
  containerProps: {
78
78
  "data-testid": DATA_TESTID.DATA_TABLE_FILTER_BAR_DD_MENU_BUTTON
79
79
  },
80
- buttonType: "text",
81
- innerRef: dropdownMenuRef,
82
- icon: /* @__PURE__ */ React2.createElement(MoreOptionsVert, null)
83
- })
80
+ buttonType: "icon",
81
+ innerRef: dropdownMenuRef
82
+ }, /* @__PURE__ */ React2.createElement(MoreOptionsVert, null))
84
83
  }));
85
84
  };
86
85
  export {
package/dist/esm/parts/FilterBar/FiltersBar.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/FilterBar/FiltersBar.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/prop-types */\nimport React, { useCallback, useContext, useMemo, useRef } from 'react';\nimport { DSButton } from '@elliemae/ds-button';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { FILTER_TYPES } from '../../exported-related';\nimport {\n SelectPill,\n MultiSelectPill,\n SingleDatePill,\n DateRangePill,\n NumberRangePill,\n DateSwitcherPill,\n} from './components';\nimport { DataTableContext } from '../../DataTableContext';\nimport { StyledDropdownMenu, StyledWrapper } from './styled';\nimport { FilterPillComponent } from './types';\nimport { DATA_TESTID } from '../../configs/constants';\n\nconst pillRenderMapper: Record<string, FilterPillComponent<any>> = {\n [FILTER_TYPES.SELECT]: SelectPill,\n [FILTER_TYPES.MULTI_SELECT]: MultiSelectPill,\n [FILTER_TYPES.SINGLE_DATE]: SingleDatePill,\n [FILTER_TYPES.DATE_RANGE]: DateRangePill,\n [FILTER_TYPES.DATE_SWITCHER]: DateSwitcherPill,\n [FILTER_TYPES.NUMBER_RANGE]: NumberRangePill,\n [FILTER_TYPES.CURRENCY_RANGE]: NumberRangePill,\n};\n\nexport const FiltersBar: React.ComponentType = () => {\n const {\n tableProps: { width, filterBarProps, onFiltersChange, filters },\n visibleColumns,\n } = useContext(DataTableContext);\n\n const pillGroupRefs = useMemo(() => {\n const refs: React.RefObject<HTMLElement>[] = [];\n for (let i = 0; i < filters.length; i += 1) refs.push(React.createRef());\n return refs;\n }, [filters.length]);\n\n const dropdownMenuRef = useRef(null);\n\n const removeAllFilters = useCallback(() => {\n onFiltersChange([]);\n }, [onFiltersChange]);\n\n return (\n <StyledWrapper width={width} aria-live=\"polite\" aria-relevant=\"additions removals\" gutter=\"xs\">\n {filters.map(({ id: column, type, value }, index) => {\n const columnHeader = visibleColumns.find((col) => col.accessor === column)?.Header;\n let Component: FilterPillComponent<unknown> = () => null;\n\n const filterType = type;\n if (filterType in pillRenderMapper) {\n Component = pillRenderMapper[filterType];\n } else if (filterBarProps?.customPillRenderer) {\n Component = filterBarProps.customPillRenderer;\n }\n return (\n <Component\n key={column}\n columnHeader={typeof columnHeader === 'string' ? columnHeader : column}\n column={column}\n value={value}\n filters={filters}\n onFiltersChange={onFiltersChange}\n prevRef={pillGroupRefs[index - 1]}\n innerRef={pillGroupRefs[index]}\n nextRef={pillGroupRefs[index + 1] ?? dropdownMenuRef}\n />\n );\n })}\n <StyledDropdownMenu\n preventOverflow=\"scrollParent\"\n options={[\n {\n id: '__internal__option__clear__filters',\n label: 'Clear Filters',\n onClick: removeAllFilters,\n },\n ...(filterBarProps?.extraOptions || []),\n ]}\n triggerComponent={\n <DSButton\n containerProps={{\n 'data-testid': DATA_TESTID.DATA_TABLE_FILTER_BAR_DD_MENU_BUTTON,\n }}\n buttonType=\"text\"\n innerRef={dropdownMenuRef}\n icon={<MoreOptionsVert />}\n />\n }\n />\n </StyledWrapper>\n );\n};\n"],
5
- "mappings": "AAAA;ACCA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA;AACA;AAEA;AAEA,MAAM,mBAA6D;AAAA,GAChE,aAAa,SAAS;AAAA,GACtB,aAAa,eAAe;AAAA,GAC5B,aAAa,cAAc;AAAA,GAC3B,aAAa,aAAa;AAAA,GAC1B,aAAa,gBAAgB;AAAA,GAC7B,aAAa,eAAe;AAAA,GAC5B,aAAa,iBAAiB;AACjC;AAEO,MAAM,aAAkC,MAAM;AACnD,QAAM;AAAA,IACJ,YAAY,EAAE,OAAO,gBAAgB,iBAAiB;AAAA,IACtD;AAAA,MACE,WAAW,gBAAgB;AAE/B,QAAM,gBAAgB,QAAQ,MAAM;AAClC,UAAM,OAAuC,CAAC;AAC9C,aAAS,IAAI,GAAG,IAAI,QAAQ,QAAQ,KAAK;AAAG,WAAK,KAAK,OAAM,UAAU,CAAC;AACvE,WAAO;AAAA,EACT,GAAG,CAAC,QAAQ,MAAM,CAAC;AAEnB,QAAM,kBAAkB,OAAO,IAAI;AAEnC,QAAM,mBAAmB,YAAY,MAAM;AACzC,oBAAgB,CAAC,CAAC;AAAA,EACpB,GAAG,CAAC,eAAe,CAAC;AAEpB,SACE,qCAAC;AAAA,IAAc;AAAA,IAAc,aAAU;AAAA,IAAS,iBAAc;AAAA,IAAqB,QAAO;AAAA,KACvF,QAAQ,IAAI,CAAC,EAAE,IAAI,QAAQ,MAAM,SAAS,UAAU;AACnD,UAAM,eAAe,eAAe,KAAK,CAAC,QAAQ,IAAI,aAAa,MAAM,GAAG;AAC5E,QAAI,YAA0C,MAAM;AAEpD,UAAM,aAAa;AACnB,QAAI,cAAc,kBAAkB;AAClC,kBAAY,iBAAiB;AAAA,IAC/B,WAAW,gBAAgB,oBAAoB;AAC7C,kBAAY,eAAe;AAAA,IAC7B;AACA,WACE,qCAAC;AAAA,MACC,KAAK;AAAA,MACL,cAAc,OAAO,iBAAiB,WAAW,eAAe;AAAA,MAChE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,SAAS,cAAc,QAAQ;AAAA,MAC/B,UAAU,cAAc;AAAA,MACxB,SAAS,cAAc,QAAQ,MAAM;AAAA,KACvC;AAAA,EAEJ,CAAC,GACD,qCAAC;AAAA,IACC,iBAAgB;AAAA,IAChB,SAAS;AAAA,MACP;AAAA,QACE,IAAI;AAAA,QACJ,OAAO;AAAA,QACP,SAAS;AAAA,MACX;AAAA,MACA,GAAI,gBAAgB,gBAAgB,CAAC;AAAA,IACvC;AAAA,IACA,kBACE,qCAAC;AAAA,MACC,gBAAgB;AAAA,QACd,eAAe,YAAY;AAAA,MAC7B;AAAA,MACA,YAAW;AAAA,MACX,UAAU;AAAA,MACV,MAAM,qCAAC,qBAAgB;AAAA,KACzB;AAAA,GAEJ,CACF;AAEJ;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/prop-types */\nimport React, { useCallback, useContext, useMemo, useRef } from 'react';\nimport { DSButtonV2 } from '@elliemae/ds-button';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { FILTER_TYPES } from '../../exported-related';\nimport {\n SelectPill,\n MultiSelectPill,\n SingleDatePill,\n DateRangePill,\n NumberRangePill,\n DateSwitcherPill,\n} from './components';\nimport { DataTableContext } from '../../DataTableContext';\nimport { StyledDropdownMenu, StyledWrapper } from './styled';\nimport { FilterPillComponent } from './types';\nimport { DATA_TESTID } from '../../configs/constants';\n\nconst pillRenderMapper: Record<string, FilterPillComponent<any>> = {\n [FILTER_TYPES.SELECT]: SelectPill,\n [FILTER_TYPES.MULTI_SELECT]: MultiSelectPill,\n [FILTER_TYPES.SINGLE_DATE]: SingleDatePill,\n [FILTER_TYPES.DATE_RANGE]: DateRangePill,\n [FILTER_TYPES.DATE_SWITCHER]: DateSwitcherPill,\n [FILTER_TYPES.NUMBER_RANGE]: NumberRangePill,\n [FILTER_TYPES.CURRENCY_RANGE]: NumberRangePill,\n};\n\nexport const FiltersBar: React.ComponentType = () => {\n const {\n tableProps: { width, filterBarProps, onFiltersChange, filters },\n visibleColumns,\n } = useContext(DataTableContext);\n\n const pillGroupRefs = useMemo(() => {\n const refs: React.RefObject<HTMLElement>[] = [];\n for (let i = 0; i < filters.length; i += 1) refs.push(React.createRef());\n return refs;\n }, [filters.length]);\n\n const dropdownMenuRef = useRef(null);\n\n const removeAllFilters = useCallback(() => {\n onFiltersChange([]);\n }, [onFiltersChange]);\n\n return (\n <StyledWrapper width={width} aria-live=\"polite\" aria-relevant=\"additions removals\" gutter=\"xs\">\n {filters.map(({ id: column, type, value }, index) => {\n const columnHeader = visibleColumns.find((col) => col.accessor === column)?.Header;\n let Component: FilterPillComponent<unknown> = () => null;\n\n const filterType = type;\n if (filterType in pillRenderMapper) {\n Component = pillRenderMapper[filterType];\n } else if (filterBarProps?.customPillRenderer) {\n Component = filterBarProps.customPillRenderer;\n }\n return (\n <Component\n key={column}\n columnHeader={typeof columnHeader === 'string' ? columnHeader : column}\n column={column}\n value={value}\n filters={filters}\n onFiltersChange={onFiltersChange}\n prevRef={pillGroupRefs[index - 1]}\n innerRef={pillGroupRefs[index]}\n nextRef={pillGroupRefs[index + 1] ?? dropdownMenuRef}\n />\n );\n })}\n <StyledDropdownMenu\n preventOverflow=\"scrollParent\"\n options={[\n {\n id: '__internal__option__clear__filters',\n label: 'Clear Filters',\n onClick: removeAllFilters,\n },\n ...(filterBarProps?.extraOptions || []),\n ]}\n triggerComponent={\n <DSButtonV2\n containerProps={{\n 'data-testid': DATA_TESTID.DATA_TABLE_FILTER_BAR_DD_MENU_BUTTON,\n }}\n buttonType=\"icon\"\n innerRef={dropdownMenuRef}\n >\n <MoreOptionsVert />\n </DSButtonV2>\n }\n />\n </StyledWrapper>\n );\n};\n"],
5
+ "mappings": "AAAA;ACCA;AACA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA;AACA;AAEA;AAEA,MAAM,mBAA6D;AAAA,GAChE,aAAa,SAAS;AAAA,GACtB,aAAa,eAAe;AAAA,GAC5B,aAAa,cAAc;AAAA,GAC3B,aAAa,aAAa;AAAA,GAC1B,aAAa,gBAAgB;AAAA,GAC7B,aAAa,eAAe;AAAA,GAC5B,aAAa,iBAAiB;AACjC;AAEO,MAAM,aAAkC,MAAM;AACnD,QAAM;AAAA,IACJ,YAAY,EAAE,OAAO,gBAAgB,iBAAiB;AAAA,IACtD;AAAA,MACE,WAAW,gBAAgB;AAE/B,QAAM,gBAAgB,QAAQ,MAAM;AAClC,UAAM,OAAuC,CAAC;AAC9C,aAAS,IAAI,GAAG,IAAI,QAAQ,QAAQ,KAAK;AAAG,WAAK,KAAK,OAAM,UAAU,CAAC;AACvE,WAAO;AAAA,EACT,GAAG,CAAC,QAAQ,MAAM,CAAC;AAEnB,QAAM,kBAAkB,OAAO,IAAI;AAEnC,QAAM,mBAAmB,YAAY,MAAM;AACzC,oBAAgB,CAAC,CAAC;AAAA,EACpB,GAAG,CAAC,eAAe,CAAC;AAEpB,SACE,qCAAC;AAAA,IAAc;AAAA,IAAc,aAAU;AAAA,IAAS,iBAAc;AAAA,IAAqB,QAAO;AAAA,KACvF,QAAQ,IAAI,CAAC,EAAE,IAAI,QAAQ,MAAM,SAAS,UAAU;AACnD,UAAM,eAAe,eAAe,KAAK,CAAC,QAAQ,IAAI,aAAa,MAAM,GAAG;AAC5E,QAAI,YAA0C,MAAM;AAEpD,UAAM,aAAa;AACnB,QAAI,cAAc,kBAAkB;AAClC,kBAAY,iBAAiB;AAAA,IAC/B,WAAW,gBAAgB,oBAAoB;AAC7C,kBAAY,eAAe;AAAA,IAC7B;AACA,WACE,qCAAC;AAAA,MACC,KAAK;AAAA,MACL,cAAc,OAAO,iBAAiB,WAAW,eAAe;AAAA,MAChE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,SAAS,cAAc,QAAQ;AAAA,MAC/B,UAAU,cAAc;AAAA,MACxB,SAAS,cAAc,QAAQ,MAAM;AAAA,KACvC;AAAA,EAEJ,CAAC,GACD,qCAAC;AAAA,IACC,iBAAgB;AAAA,IAChB,SAAS;AAAA,MACP;AAAA,QACE,IAAI;AAAA,QACJ,OAAO;AAAA,QACP,SAAS;AAAA,MACX;AAAA,MACA,GAAI,gBAAgB,gBAAgB,CAAC;AAAA,IACvC;AAAA,IACA,kBACE,qCAAC;AAAA,MACC,gBAAgB;AAAA,QACd,eAAe,YAAY;AAAA,MAC7B;AAAA,MACA,YAAW;AAAA,MACX,UAAU;AAAA,OAEV,qCAAC,qBAAgB,CACnB;AAAA,GAEJ,CACF;AAEJ;",
6
6
  "names": []
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-data-table",
3
- "version": "3.0.0-next.43",
3
+ "version": "3.0.0-next.46",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Data Table",
6
6
  "files": [
@@ -573,24 +573,24 @@
573
573
  "dependencies": {
574
574
  "@dnd-kit/core": "~4.0.3",
575
575
  "@dnd-kit/sortable": "~5.0.0",
576
- "@elliemae/ds-button": "3.0.0-next.43",
577
- "@elliemae/ds-circular-progress-indicator": "3.0.0-next.43",
578
- "@elliemae/ds-controlled-form": "3.0.0-next.43",
576
+ "@elliemae/ds-button": "3.0.0-next.46",
577
+ "@elliemae/ds-circular-progress-indicator": "3.0.0-next.46",
578
+ "@elliemae/ds-controlled-form": "3.0.0-next.46",
579
579
  "@elliemae/ds-drag-and-drop": "3.0.0-next.29",
580
- "@elliemae/ds-dropdownmenu": "3.0.0-next.43",
580
+ "@elliemae/ds-dropdownmenu": "3.0.0-next.46",
581
581
  "@elliemae/ds-form": "3.0.0-next.29",
582
- "@elliemae/ds-form-layout-blocks": "3.0.0-next.43",
583
- "@elliemae/ds-grid": "3.0.0-next.43",
584
- "@elliemae/ds-icons": "3.0.0-next.43",
582
+ "@elliemae/ds-form-layout-blocks": "3.0.0-next.46",
583
+ "@elliemae/ds-grid": "3.0.0-next.46",
584
+ "@elliemae/ds-icons": "3.0.0-next.46",
585
585
  "@elliemae/ds-indeterminate-progress-indicator": "3.0.0-next.29",
586
- "@elliemae/ds-pagination": "3.0.0-next.43",
587
- "@elliemae/ds-pills": "3.0.0-next.43",
588
- "@elliemae/ds-popperjs": "3.0.0-next.43",
589
- "@elliemae/ds-skeleton": "3.0.0-next.43",
586
+ "@elliemae/ds-pagination": "3.0.0-next.46",
587
+ "@elliemae/ds-pills": "3.0.0-next.46",
588
+ "@elliemae/ds-popperjs": "3.0.0-next.46",
589
+ "@elliemae/ds-skeleton": "3.0.0-next.46",
590
590
  "@elliemae/ds-system": "3.0.0-next.29",
591
- "@elliemae/ds-toolbar": "3.0.0-next.43",
592
- "@elliemae/ds-truncated-tooltip-text": "3.0.0-next.43",
593
- "@elliemae/ds-utilities": "3.0.0-next.43",
591
+ "@elliemae/ds-toolbar": "3.0.0-next.46",
592
+ "@elliemae/ds-truncated-tooltip-text": "3.0.0-next.46",
593
+ "@elliemae/ds-utilities": "3.0.0-next.46",
594
594
  "@reduxjs/toolkit": "~1.7.2",
595
595
  "csstype": "~3.0.10",
596
596
  "moment": "~2.29.1",