@elliemae/ds-treeview 3.39.1 → 3.40.0-rc.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.
@@ -65,7 +65,8 @@ const defaultProps = {
65
65
  height: "100%",
66
66
  groupIcon: null,
67
67
  itemIcon: null,
68
- searchQuery: ""
68
+ searchQuery: "",
69
+ applyAriaDisabled: false
69
70
  // workaround on the typings over the fact that
70
71
  // when we instantiate the context we can't have all the props
71
72
  // we only have a part of them but the final typings will include missing props
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/TreeViewContext.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["/* eslint-disable no-unused-vars */\nimport { createContext, createRef } from 'react';\nimport type { DSTreeviewT } from './react-desc-prop-types.js';\nimport type { DSTreeviewInternalsT } from './sharedTypes.js';\n\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nfunction noop<T extends unknown[]>(..._args: T): void {}\n\nexport const defaultProps = {\n plugins: [],\n selection: {},\n instanceRef: createRef(),\n isItemDisabled: () => false,\n disableIcons: false,\n isMultiSelect: false,\n isSingleSelect: false,\n getIsDropValid: () => true,\n showChildrenAmount: false,\n isLoading: false,\n highlightOnlyQuery: false,\n onItemClick: noop,\n onItemActivate: noop,\n onItemFocus: noop,\n onVisibleItemsChange: noop,\n onOrderChange: noop,\n onSelectionChange: noop,\n onExpandChange: noop,\n onInstanceRefInitialized: noop,\n rowSize: 'normal',\n labelOverflow: 'wrap',\n noItemsPlaceholder: 'No items found',\n nameKey: 'name',\n width: '100%',\n height: '100%',\n groupIcon: null,\n itemIcon: null,\n searchQuery: '',\n // workaround on the typings over the fact that\n // when we instantiate the context we can't have all the props\n // we only have a part of them but the final typings will include missing props\n // this is safe to do because\n // we will \"mergeWithDefaults\" + \"validatePropTypes\" when we do instantiate the context\n} as unknown as DSTreeviewT.Props;\n\nexport const defaultRelativeMouseCoord = {\n isBefore: false,\n isAfter: false,\n isValid: true,\n item: null,\n x: null,\n y: null,\n relativeElementDOMRect: null,\n relativeElementIndex: null,\n};\n\nconst defaultContext: DSTreeviewInternalsT.CTX = {\n props: defaultProps,\n visibleItems: [],\n flattenedItems: [],\n withRadioChecks: false,\n withCheckboxChecks: false,\n withDragAndDrop: false,\n triggerTreeRerender: noop,\n tree: undefined,\n treeRoot: undefined,\n virtualListHelpers: {\n virtualItems: [],\n totalSize: 0,\n scrollToOffset: noop,\n scrollToIndex: noop,\n measure: noop,\n },\n virtualListRef: undefined,\n uniqueTreeViewUUID: '',\n selectedItem: null,\n setSelectedItem: noop,\n focusedItem: null,\n setFocusedItem: noop,\n selectedCheckboxes: {},\n setInternallySelectedCheckboxes: noop,\n expandedGroups: {},\n setExpandedGroups: noop,\n latestToggledItem: null,\n setLatestToggledItem: noop,\n hoverItem: null,\n setHoverItem: noop,\n handleExpandGroup: noop,\n updateUserExpandedState: noop,\n};\n\n/** Context for cross component communication */\nconst TreeViewContext = createContext(defaultContext);\n\nexport default TreeViewContext;\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAyC;AAKzC,SAAS,QAA6B,OAAgB;AAAC;AAEhD,MAAM,eAAe;AAAA,EAC1B,SAAS,CAAC;AAAA,EACV,WAAW,CAAC;AAAA,EACZ,iBAAa,wBAAU;AAAA,EACvB,gBAAgB,MAAM;AAAA,EACtB,cAAc;AAAA,EACd,eAAe;AAAA,EACf,gBAAgB;AAAA,EAChB,gBAAgB,MAAM;AAAA,EACtB,oBAAoB;AAAA,EACpB,WAAW;AAAA,EACX,oBAAoB;AAAA,EACpB,aAAa;AAAA,EACb,gBAAgB;AAAA,EAChB,aAAa;AAAA,EACb,sBAAsB;AAAA,EACtB,eAAe;AAAA,EACf,mBAAmB;AAAA,EACnB,gBAAgB;AAAA,EAChB,0BAA0B;AAAA,EAC1B,SAAS;AAAA,EACT,eAAe;AAAA,EACf,oBAAoB;AAAA,EACpB,SAAS;AAAA,EACT,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,UAAU;AAAA,EACV,aAAa;AAAA;AAAA;AAAA;AAAA;AAAA;AAMf;AAEO,MAAM,4BAA4B;AAAA,EACvC,UAAU;AAAA,EACV,SAAS;AAAA,EACT,SAAS;AAAA,EACT,MAAM;AAAA,EACN,GAAG;AAAA,EACH,GAAG;AAAA,EACH,wBAAwB;AAAA,EACxB,sBAAsB;AACxB;AAEA,MAAM,iBAA2C;AAAA,EAC/C,OAAO;AAAA,EACP,cAAc,CAAC;AAAA,EACf,gBAAgB,CAAC;AAAA,EACjB,iBAAiB;AAAA,EACjB,oBAAoB;AAAA,EACpB,iBAAiB;AAAA,EACjB,qBAAqB;AAAA,EACrB,MAAM;AAAA,EACN,UAAU;AAAA,EACV,oBAAoB;AAAA,IAClB,cAAc,CAAC;AAAA,IACf,WAAW;AAAA,IACX,gBAAgB;AAAA,IAChB,eAAe;AAAA,IACf,SAAS;AAAA,EACX;AAAA,EACA,gBAAgB;AAAA,EAChB,oBAAoB;AAAA,EACpB,cAAc;AAAA,EACd,iBAAiB;AAAA,EACjB,aAAa;AAAA,EACb,gBAAgB;AAAA,EAChB,oBAAoB,CAAC;AAAA,EACrB,iCAAiC;AAAA,EACjC,gBAAgB,CAAC;AAAA,EACjB,mBAAmB;AAAA,EACnB,mBAAmB;AAAA,EACnB,sBAAsB;AAAA,EACtB,WAAW;AAAA,EACX,cAAc;AAAA,EACd,mBAAmB;AAAA,EACnB,yBAAyB;AAC3B;AAGA,MAAM,sBAAkB,4BAAc,cAAc;AAEpD,IAAO,0BAAQ;",
4
+ "sourcesContent": ["/* eslint-disable no-unused-vars */\nimport { createContext, createRef } from 'react';\nimport type { DSTreeviewT } from './react-desc-prop-types.js';\nimport type { DSTreeviewInternalsT } from './sharedTypes.js';\n\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nfunction noop<T extends unknown[]>(..._args: T): void {}\n\nexport const defaultProps = {\n plugins: [],\n selection: {},\n instanceRef: createRef(),\n isItemDisabled: () => false,\n disableIcons: false,\n isMultiSelect: false,\n isSingleSelect: false,\n getIsDropValid: () => true,\n showChildrenAmount: false,\n isLoading: false,\n highlightOnlyQuery: false,\n onItemClick: noop,\n onItemActivate: noop,\n onItemFocus: noop,\n onVisibleItemsChange: noop,\n onOrderChange: noop,\n onSelectionChange: noop,\n onExpandChange: noop,\n onInstanceRefInitialized: noop,\n rowSize: 'normal',\n labelOverflow: 'wrap',\n noItemsPlaceholder: 'No items found',\n nameKey: 'name',\n width: '100%',\n height: '100%',\n groupIcon: null,\n itemIcon: null,\n searchQuery: '',\n applyAriaDisabled: false,\n // workaround on the typings over the fact that\n // when we instantiate the context we can't have all the props\n // we only have a part of them but the final typings will include missing props\n // this is safe to do because\n // we will \"mergeWithDefaults\" + \"validatePropTypes\" when we do instantiate the context\n} as unknown as DSTreeviewT.Props;\n\nexport const defaultRelativeMouseCoord = {\n isBefore: false,\n isAfter: false,\n isValid: true,\n item: null,\n x: null,\n y: null,\n relativeElementDOMRect: null,\n relativeElementIndex: null,\n};\n\nconst defaultContext: DSTreeviewInternalsT.CTX = {\n props: defaultProps,\n visibleItems: [],\n flattenedItems: [],\n withRadioChecks: false,\n withCheckboxChecks: false,\n withDragAndDrop: false,\n triggerTreeRerender: noop,\n tree: undefined,\n treeRoot: undefined,\n virtualListHelpers: {\n virtualItems: [],\n totalSize: 0,\n scrollToOffset: noop,\n scrollToIndex: noop,\n measure: noop,\n },\n virtualListRef: undefined,\n uniqueTreeViewUUID: '',\n selectedItem: null,\n setSelectedItem: noop,\n focusedItem: null,\n setFocusedItem: noop,\n selectedCheckboxes: {},\n setInternallySelectedCheckboxes: noop,\n expandedGroups: {},\n setExpandedGroups: noop,\n latestToggledItem: null,\n setLatestToggledItem: noop,\n hoverItem: null,\n setHoverItem: noop,\n handleExpandGroup: noop,\n updateUserExpandedState: noop,\n};\n\n/** Context for cross component communication */\nconst TreeViewContext = createContext(defaultContext);\n\nexport default TreeViewContext;\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAyC;AAKzC,SAAS,QAA6B,OAAgB;AAAC;AAEhD,MAAM,eAAe;AAAA,EAC1B,SAAS,CAAC;AAAA,EACV,WAAW,CAAC;AAAA,EACZ,iBAAa,wBAAU;AAAA,EACvB,gBAAgB,MAAM;AAAA,EACtB,cAAc;AAAA,EACd,eAAe;AAAA,EACf,gBAAgB;AAAA,EAChB,gBAAgB,MAAM;AAAA,EACtB,oBAAoB;AAAA,EACpB,WAAW;AAAA,EACX,oBAAoB;AAAA,EACpB,aAAa;AAAA,EACb,gBAAgB;AAAA,EAChB,aAAa;AAAA,EACb,sBAAsB;AAAA,EACtB,eAAe;AAAA,EACf,mBAAmB;AAAA,EACnB,gBAAgB;AAAA,EAChB,0BAA0B;AAAA,EAC1B,SAAS;AAAA,EACT,eAAe;AAAA,EACf,oBAAoB;AAAA,EACpB,SAAS;AAAA,EACT,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,UAAU;AAAA,EACV,aAAa;AAAA,EACb,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAMrB;AAEO,MAAM,4BAA4B;AAAA,EACvC,UAAU;AAAA,EACV,SAAS;AAAA,EACT,SAAS;AAAA,EACT,MAAM;AAAA,EACN,GAAG;AAAA,EACH,GAAG;AAAA,EACH,wBAAwB;AAAA,EACxB,sBAAsB;AACxB;AAEA,MAAM,iBAA2C;AAAA,EAC/C,OAAO;AAAA,EACP,cAAc,CAAC;AAAA,EACf,gBAAgB,CAAC;AAAA,EACjB,iBAAiB;AAAA,EACjB,oBAAoB;AAAA,EACpB,iBAAiB;AAAA,EACjB,qBAAqB;AAAA,EACrB,MAAM;AAAA,EACN,UAAU;AAAA,EACV,oBAAoB;AAAA,IAClB,cAAc,CAAC;AAAA,IACf,WAAW;AAAA,IACX,gBAAgB;AAAA,IAChB,eAAe;AAAA,IACf,SAAS;AAAA,EACX;AAAA,EACA,gBAAgB;AAAA,EAChB,oBAAoB;AAAA,EACpB,cAAc;AAAA,EACd,iBAAiB;AAAA,EACjB,aAAa;AAAA,EACb,gBAAgB;AAAA,EAChB,oBAAoB,CAAC;AAAA,EACrB,iCAAiC;AAAA,EACjC,gBAAgB,CAAC;AAAA,EACjB,mBAAmB;AAAA,EACnB,mBAAmB;AAAA,EACnB,sBAAsB;AAAA,EACtB,WAAW;AAAA,EACX,cAAc;AAAA,EACd,mBAAmB;AAAA,EACnB,yBAAyB;AAC3B;AAGA,MAAM,sBAAkB,4BAAc,cAAc;AAEpD,IAAO,0BAAQ;",
6
6
  "names": []
7
7
  }
@@ -48,7 +48,7 @@ const CheckboxSelectable = (props) => {
48
48
  const { id, children } = item;
49
49
  const ctx = (0, import_react.useContext)(import_TreeViewContext.default);
50
50
  const {
51
- props: { onSelectionChange, isItemDisabled },
51
+ props: { onSelectionChange, isItemDisabled, applyAriaDisabled },
52
52
  virtualListHelpers: { scrollToIndex },
53
53
  triggerTreeRerender,
54
54
  selectedCheckboxes,
@@ -100,7 +100,8 @@ const CheckboxSelectable = (props) => {
100
100
  import_ds_controlled_form.DSControlledCheckbox,
101
101
  {
102
102
  checked: isChecked,
103
- disabled: isDisabled,
103
+ disabled: isDisabled && !applyAriaDisabled,
104
+ applyAriaDisabled: isDisabled && applyAriaDisabled,
104
105
  "data-testid": "tree-item-checkbox",
105
106
  "aria-controls": ariaControls,
106
107
  id: `ds-item-${uniqueTreeViewUUID}-${id}`,
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/parts/CheckboxSelectable.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import React, { useContext, useCallback, useMemo } from 'react';\nimport { DSControlledCheckbox } from '@elliemae/ds-controlled-form';\nimport { styled } from '@elliemae/ds-system';\nimport TreeViewContext from '../TreeViewContext.js';\nimport { toggleCheckboxItem } from '../utils/selectable-helper.js';\nimport { filterObject } from '../utils/object-helpers.js';\nimport type { DSTreeviewT } from '../react-desc-prop-types.js';\nconst StyledCheckboxWrapper = styled.span`\n padding-top: 3px;\n margin-left: 8px;\n`;\ninterface PropsT {\n item: DSTreeviewT.Item;\n itemIndex: number;\n}\nconst CheckboxSelectable = (props: PropsT): JSX.Element | null => {\n const { item, itemIndex } = props;\n const { id, children } = item;\n\n const ctx = useContext(TreeViewContext);\n const {\n props: { onSelectionChange, isItemDisabled },\n virtualListHelpers: { scrollToIndex },\n triggerTreeRerender,\n selectedCheckboxes,\n setInternallySelectedCheckboxes,\n uniqueTreeViewUUID,\n } = ctx;\n\n const onCheckboxChange = useCallback(() => {\n const newSelections = toggleCheckboxItem(item, selectedCheckboxes);\n const newSelectionHasmap = filterObject<DSTreeviewT.SelectionState>(\n { ...selectedCheckboxes, ...newSelections },\n (value) => value !== false,\n );\n setInternallySelectedCheckboxes(newSelectionHasmap);\n triggerTreeRerender();\n\n const indexAndScrollTo = {\n scrollToItem: () => {\n if (typeof item.virtualIndex === 'number') scrollToIndex(item.virtualIndex);\n },\n itemIndex,\n };\n if (onSelectionChange) onSelectionChange(newSelectionHasmap, item, indexAndScrollTo);\n }, [\n item,\n triggerTreeRerender,\n onSelectionChange,\n itemIndex,\n scrollToIndex,\n selectedCheckboxes,\n setInternallySelectedCheckboxes,\n ]);\n const isChecked = useMemo(() => {\n if (selectedCheckboxes[id] === 'mixed') {\n return 'mixed' as const;\n }\n if (selectedCheckboxes[id] === true) {\n return true;\n }\n return false;\n }, [selectedCheckboxes, id]);\n\n const isDisabled = useMemo(() => isItemDisabled(item), [item, isItemDisabled]);\n const ariaControls = useMemo(() => {\n if (children?.length) {\n const childrenIds = children.map((child) => `ds-item-${uniqueTreeViewUUID}-${child.id}`);\n return childrenIds.join(' ');\n }\n return undefined;\n }, [children, uniqueTreeViewUUID]);\n\n return (\n <StyledCheckboxWrapper>\n <DSControlledCheckbox\n checked={isChecked}\n disabled={isDisabled}\n data-testid=\"tree-item-checkbox\"\n aria-controls={ariaControls}\n id={`ds-item-${uniqueTreeViewUUID}-${id}`}\n onChange={onCheckboxChange}\n tabIndex=\"0\"\n />\n </StyledCheckboxWrapper>\n );\n};\n\nexport default CheckboxSelectable;\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD2EjB;AA3EN,mBAAwD;AACxD,gCAAqC;AACrC,uBAAuB;AACvB,6BAA4B;AAC5B,+BAAmC;AACnC,4BAA6B;AAE7B,MAAM,wBAAwB,wBAAO;AAAA;AAAA;AAAA;AAQrC,MAAM,qBAAqB,CAAC,UAAsC;AAChE,QAAM,EAAE,MAAM,UAAU,IAAI;AAC5B,QAAM,EAAE,IAAI,SAAS,IAAI;AAEzB,QAAM,UAAM,yBAAW,uBAAAA,OAAe;AACtC,QAAM;AAAA,IACJ,OAAO,EAAE,mBAAmB,eAAe;AAAA,IAC3C,oBAAoB,EAAE,cAAc;AAAA,IACpC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,uBAAmB,0BAAY,MAAM;AACzC,UAAM,oBAAgB,6CAAmB,MAAM,kBAAkB;AACjE,UAAM,yBAAqB;AAAA,MACzB,EAAE,GAAG,oBAAoB,GAAG,cAAc;AAAA,MAC1C,CAAC,UAAU,UAAU;AAAA,IACvB;AACA,oCAAgC,kBAAkB;AAClD,wBAAoB;AAEpB,UAAM,mBAAmB;AAAA,MACvB,cAAc,MAAM;AAClB,YAAI,OAAO,KAAK,iBAAiB,SAAU,eAAc,KAAK,YAAY;AAAA,MAC5E;AAAA,MACA;AAAA,IACF;AACA,QAAI,kBAAmB,mBAAkB,oBAAoB,MAAM,gBAAgB;AAAA,EACrF,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AACD,QAAM,gBAAY,sBAAQ,MAAM;AAC9B,QAAI,mBAAmB,EAAE,MAAM,SAAS;AACtC,aAAO;AAAA,IACT;AACA,QAAI,mBAAmB,EAAE,MAAM,MAAM;AACnC,aAAO;AAAA,IACT;AACA,WAAO;AAAA,EACT,GAAG,CAAC,oBAAoB,EAAE,CAAC;AAE3B,QAAM,iBAAa,sBAAQ,MAAM,eAAe,IAAI,GAAG,CAAC,MAAM,cAAc,CAAC;AAC7E,QAAM,mBAAe,sBAAQ,MAAM;AACjC,QAAI,UAAU,QAAQ;AACpB,YAAM,cAAc,SAAS,IAAI,CAAC,UAAU,WAAW,kBAAkB,IAAI,MAAM,EAAE,EAAE;AACvF,aAAO,YAAY,KAAK,GAAG;AAAA,IAC7B;AACA,WAAO;AAAA,EACT,GAAG,CAAC,UAAU,kBAAkB,CAAC;AAEjC,SACE,4CAAC,yBACC;AAAA,IAAC;AAAA;AAAA,MACC,SAAS;AAAA,MACT,UAAU;AAAA,MACV,eAAY;AAAA,MACZ,iBAAe;AAAA,MACf,IAAI,WAAW,kBAAkB,IAAI,EAAE;AAAA,MACvC,UAAU;AAAA,MACV,UAAS;AAAA;AAAA,EACX,GACF;AAEJ;AAEA,IAAO,6BAAQ;",
4
+ "sourcesContent": ["import React, { useContext, useCallback, useMemo } from 'react';\nimport { DSControlledCheckbox } from '@elliemae/ds-controlled-form';\nimport { styled } from '@elliemae/ds-system';\nimport TreeViewContext from '../TreeViewContext.js';\nimport { toggleCheckboxItem } from '../utils/selectable-helper.js';\nimport { filterObject } from '../utils/object-helpers.js';\nimport type { DSTreeviewT } from '../react-desc-prop-types.js';\nconst StyledCheckboxWrapper = styled.span`\n padding-top: 3px;\n margin-left: 8px;\n`;\ninterface PropsT {\n item: DSTreeviewT.Item;\n itemIndex: number;\n}\nconst CheckboxSelectable = (props: PropsT): JSX.Element | null => {\n const { item, itemIndex } = props;\n const { id, children } = item;\n\n const ctx = useContext(TreeViewContext);\n const {\n props: { onSelectionChange, isItemDisabled, applyAriaDisabled },\n virtualListHelpers: { scrollToIndex },\n triggerTreeRerender,\n selectedCheckboxes,\n setInternallySelectedCheckboxes,\n uniqueTreeViewUUID,\n } = ctx;\n\n const onCheckboxChange = useCallback(() => {\n const newSelections = toggleCheckboxItem(item, selectedCheckboxes);\n const newSelectionHasmap = filterObject<DSTreeviewT.SelectionState>(\n { ...selectedCheckboxes, ...newSelections },\n (value) => value !== false,\n );\n setInternallySelectedCheckboxes(newSelectionHasmap);\n triggerTreeRerender();\n\n const indexAndScrollTo = {\n scrollToItem: () => {\n if (typeof item.virtualIndex === 'number') scrollToIndex(item.virtualIndex);\n },\n itemIndex,\n };\n if (onSelectionChange) onSelectionChange(newSelectionHasmap, item, indexAndScrollTo);\n }, [\n item,\n triggerTreeRerender,\n onSelectionChange,\n itemIndex,\n scrollToIndex,\n selectedCheckboxes,\n setInternallySelectedCheckboxes,\n ]);\n const isChecked = useMemo(() => {\n if (selectedCheckboxes[id] === 'mixed') {\n return 'mixed' as const;\n }\n if (selectedCheckboxes[id] === true) {\n return true;\n }\n return false;\n }, [selectedCheckboxes, id]);\n\n const isDisabled = useMemo(() => isItemDisabled(item), [item, isItemDisabled]);\n const ariaControls = useMemo(() => {\n if (children?.length) {\n const childrenIds = children.map((child) => `ds-item-${uniqueTreeViewUUID}-${child.id}`);\n return childrenIds.join(' ');\n }\n return undefined;\n }, [children, uniqueTreeViewUUID]);\n\n return (\n <StyledCheckboxWrapper>\n <DSControlledCheckbox\n checked={isChecked}\n disabled={isDisabled && !applyAriaDisabled}\n applyAriaDisabled={isDisabled && applyAriaDisabled}\n data-testid=\"tree-item-checkbox\"\n aria-controls={ariaControls}\n id={`ds-item-${uniqueTreeViewUUID}-${id}`}\n onChange={onCheckboxChange}\n tabIndex=\"0\"\n />\n </StyledCheckboxWrapper>\n );\n};\n\nexport default CheckboxSelectable;\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD2EjB;AA3EN,mBAAwD;AACxD,gCAAqC;AACrC,uBAAuB;AACvB,6BAA4B;AAC5B,+BAAmC;AACnC,4BAA6B;AAE7B,MAAM,wBAAwB,wBAAO;AAAA;AAAA;AAAA;AAQrC,MAAM,qBAAqB,CAAC,UAAsC;AAChE,QAAM,EAAE,MAAM,UAAU,IAAI;AAC5B,QAAM,EAAE,IAAI,SAAS,IAAI;AAEzB,QAAM,UAAM,yBAAW,uBAAAA,OAAe;AACtC,QAAM;AAAA,IACJ,OAAO,EAAE,mBAAmB,gBAAgB,kBAAkB;AAAA,IAC9D,oBAAoB,EAAE,cAAc;AAAA,IACpC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,uBAAmB,0BAAY,MAAM;AACzC,UAAM,oBAAgB,6CAAmB,MAAM,kBAAkB;AACjE,UAAM,yBAAqB;AAAA,MACzB,EAAE,GAAG,oBAAoB,GAAG,cAAc;AAAA,MAC1C,CAAC,UAAU,UAAU;AAAA,IACvB;AACA,oCAAgC,kBAAkB;AAClD,wBAAoB;AAEpB,UAAM,mBAAmB;AAAA,MACvB,cAAc,MAAM;AAClB,YAAI,OAAO,KAAK,iBAAiB,SAAU,eAAc,KAAK,YAAY;AAAA,MAC5E;AAAA,MACA;AAAA,IACF;AACA,QAAI,kBAAmB,mBAAkB,oBAAoB,MAAM,gBAAgB;AAAA,EACrF,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AACD,QAAM,gBAAY,sBAAQ,MAAM;AAC9B,QAAI,mBAAmB,EAAE,MAAM,SAAS;AACtC,aAAO;AAAA,IACT;AACA,QAAI,mBAAmB,EAAE,MAAM,MAAM;AACnC,aAAO;AAAA,IACT;AACA,WAAO;AAAA,EACT,GAAG,CAAC,oBAAoB,EAAE,CAAC;AAE3B,QAAM,iBAAa,sBAAQ,MAAM,eAAe,IAAI,GAAG,CAAC,MAAM,cAAc,CAAC;AAC7E,QAAM,mBAAe,sBAAQ,MAAM;AACjC,QAAI,UAAU,QAAQ;AACpB,YAAM,cAAc,SAAS,IAAI,CAAC,UAAU,WAAW,kBAAkB,IAAI,MAAM,EAAE,EAAE;AACvF,aAAO,YAAY,KAAK,GAAG;AAAA,IAC7B;AACA,WAAO;AAAA,EACT,GAAG,CAAC,UAAU,kBAAkB,CAAC;AAEjC,SACE,4CAAC,yBACC;AAAA,IAAC;AAAA;AAAA,MACC,SAAS;AAAA,MACT,UAAU,cAAc,CAAC;AAAA,MACzB,mBAAmB,cAAc;AAAA,MACjC,eAAY;AAAA,MACZ,iBAAe;AAAA,MACf,IAAI,WAAW,kBAAkB,IAAI,EAAE;AAAA,MACvC,UAAU;AAAA,MACV,UAAS;AAAA;AAAA,EACX,GACF;AAEJ;AAEA,IAAO,6BAAQ;",
6
6
  "names": ["TreeViewContext"]
7
7
  }
@@ -34,15 +34,14 @@ module.exports = __toCommonJS(RadioSelectable_exports);
34
34
  var React = __toESM(require("react"));
35
35
  var import_jsx_runtime = require("react/jsx-runtime");
36
36
  var import_react = require("react");
37
- var import_ds_form = require("@elliemae/ds-form");
37
+ var import_ds_controlled_form = require("@elliemae/ds-controlled-form");
38
38
  var import_TreeViewContext = __toESM(require("../TreeViewContext.js"));
39
39
  const RadioSelectable = (props) => {
40
40
  const { item, itemIndex } = props;
41
41
  const ctx = (0, import_react.useContext)(import_TreeViewContext.default);
42
42
  const {
43
- props: { onSelectionChange, isItemDisabled },
43
+ props: { onSelectionChange, isItemDisabled, applyAriaDisabled },
44
44
  virtualListHelpers: { scrollToIndex },
45
- uniqueTreeViewUUID,
46
45
  selectedCheckboxes,
47
46
  setInternallySelectedCheckboxes
48
47
  } = ctx;
@@ -58,18 +57,19 @@ const RadioSelectable = (props) => {
58
57
  };
59
58
  if (onSelectionChange) onSelectionChange(newSelectionHasmap, item, indexAndScrollTo);
60
59
  }, [id, setInternallySelectedCheckboxes, itemIndex, onSelectionChange, item, scrollToIndex]);
61
- const radioName = (0, import_react.useMemo)(() => `radios-${uniqueTreeViewUUID}`, [uniqueTreeViewUUID]);
62
60
  const isDisabled = (0, import_react.useMemo)(() => isItemDisabled(item), [item, isItemDisabled]);
63
61
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
64
- import_ds_form.DSRadio,
62
+ import_ds_controlled_form.DSControlledRadio,
65
63
  {
66
64
  checked: selectedCheckboxes[id] === true,
67
- name: radioName,
68
- disabled: isDisabled,
65
+ disabled: isDisabled && !applyAriaDisabled,
66
+ applyAriaDisabled: isDisabled && applyAriaDisabled,
67
+ "aria-label": item.name,
69
68
  className: "em-ds-tree-item-radio",
70
69
  "data-testid": "tree-item-radio",
71
70
  onChange: onRadioChange,
72
- tabIndex: 0
71
+ tabIndex: 0,
72
+ value: id.toString()
73
73
  }
74
74
  );
75
75
  };
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/parts/RadioSelectable.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import React, { useContext, useCallback, useMemo } from 'react';\nimport { DSRadio } from '@elliemae/ds-form';\nimport TreeViewContext from '../TreeViewContext.js';\nimport type { DSTreeviewT } from '../react-desc-prop-types.js';\ninterface PropsT {\n item: DSTreeviewT.Item;\n itemIndex: number;\n}\nconst RadioSelectable = (props: PropsT) => {\n const { item, itemIndex } = props;\n\n const ctx = useContext(TreeViewContext);\n const {\n props: { onSelectionChange, isItemDisabled },\n virtualListHelpers: { scrollToIndex },\n uniqueTreeViewUUID,\n selectedCheckboxes,\n setInternallySelectedCheckboxes,\n } = ctx;\n\n const { id } = item;\n\n const onRadioChange = useCallback(() => {\n const newSelectionHasmap = { [id]: true };\n setInternallySelectedCheckboxes(newSelectionHasmap);\n const indexAndScrollTo = {\n scrollToItem: () => {\n if (item.virtualIndex) scrollToIndex(item.virtualIndex);\n },\n itemIndex,\n };\n if (onSelectionChange) onSelectionChange(newSelectionHasmap, item, indexAndScrollTo);\n }, [id, setInternallySelectedCheckboxes, itemIndex, onSelectionChange, item, scrollToIndex]);\n\n const radioName = useMemo(() => `radios-${uniqueTreeViewUUID}`, [uniqueTreeViewUUID]);\n\n const isDisabled = useMemo(() => isItemDisabled(item), [item, isItemDisabled]);\n\n return (\n <DSRadio\n checked={selectedCheckboxes[id] === true}\n name={radioName}\n disabled={isDisabled}\n className=\"em-ds-tree-item-radio\"\n data-testid=\"tree-item-radio\"\n onChange={onRadioChange}\n tabIndex={0}\n />\n );\n};\n\nexport default RadioSelectable;\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADuCnB;AAvCJ,mBAAwD;AACxD,qBAAwB;AACxB,6BAA4B;AAM5B,MAAM,kBAAkB,CAAC,UAAkB;AACzC,QAAM,EAAE,MAAM,UAAU,IAAI;AAE5B,QAAM,UAAM,yBAAW,uBAAAA,OAAe;AACtC,QAAM;AAAA,IACJ,OAAO,EAAE,mBAAmB,eAAe;AAAA,IAC3C,oBAAoB,EAAE,cAAc;AAAA,IACpC;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,EAAE,GAAG,IAAI;AAEf,QAAM,oBAAgB,0BAAY,MAAM;AACtC,UAAM,qBAAqB,EAAE,CAAC,EAAE,GAAG,KAAK;AACxC,oCAAgC,kBAAkB;AAClD,UAAM,mBAAmB;AAAA,MACvB,cAAc,MAAM;AAClB,YAAI,KAAK,aAAc,eAAc,KAAK,YAAY;AAAA,MACxD;AAAA,MACA;AAAA,IACF;AACA,QAAI,kBAAmB,mBAAkB,oBAAoB,MAAM,gBAAgB;AAAA,EACrF,GAAG,CAAC,IAAI,iCAAiC,WAAW,mBAAmB,MAAM,aAAa,CAAC;AAE3F,QAAM,gBAAY,sBAAQ,MAAM,UAAU,kBAAkB,IAAI,CAAC,kBAAkB,CAAC;AAEpF,QAAM,iBAAa,sBAAQ,MAAM,eAAe,IAAI,GAAG,CAAC,MAAM,cAAc,CAAC;AAE7E,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAS,mBAAmB,EAAE,MAAM;AAAA,MACpC,MAAM;AAAA,MACN,UAAU;AAAA,MACV,WAAU;AAAA,MACV,eAAY;AAAA,MACZ,UAAU;AAAA,MACV,UAAU;AAAA;AAAA,EACZ;AAEJ;AAEA,IAAO,0BAAQ;",
4
+ "sourcesContent": ["import React, { useContext, useCallback, useMemo } from 'react';\nimport { DSControlledRadio } from '@elliemae/ds-controlled-form';\nimport TreeViewContext from '../TreeViewContext.js';\nimport type { DSTreeviewT } from '../react-desc-prop-types.js';\ninterface PropsT {\n item: DSTreeviewT.Item;\n itemIndex: number;\n}\nconst RadioSelectable = (props: PropsT) => {\n const { item, itemIndex } = props;\n\n const ctx = useContext(TreeViewContext);\n const {\n props: { onSelectionChange, isItemDisabled, applyAriaDisabled },\n virtualListHelpers: { scrollToIndex },\n selectedCheckboxes,\n setInternallySelectedCheckboxes,\n } = ctx;\n\n const { id } = item;\n\n const onRadioChange = useCallback(() => {\n const newSelectionHasmap = { [id]: true };\n setInternallySelectedCheckboxes(newSelectionHasmap);\n const indexAndScrollTo = {\n scrollToItem: () => {\n if (item.virtualIndex) scrollToIndex(item.virtualIndex);\n },\n itemIndex,\n };\n if (onSelectionChange) onSelectionChange(newSelectionHasmap, item, indexAndScrollTo);\n }, [id, setInternallySelectedCheckboxes, itemIndex, onSelectionChange, item, scrollToIndex]);\n\n const isDisabled = useMemo(() => isItemDisabled(item), [item, isItemDisabled]);\n return (\n <DSControlledRadio\n checked={selectedCheckboxes[id] === true}\n disabled={isDisabled && !applyAriaDisabled}\n applyAriaDisabled={isDisabled && applyAriaDisabled}\n aria-label={item.name}\n className=\"em-ds-tree-item-radio\"\n data-testid=\"tree-item-radio\"\n onChange={onRadioChange}\n tabIndex={0}\n value={id.toString()}\n />\n );\n};\n\nexport default RadioSelectable;\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADmCnB;AAnCJ,mBAAwD;AACxD,gCAAkC;AAClC,6BAA4B;AAM5B,MAAM,kBAAkB,CAAC,UAAkB;AACzC,QAAM,EAAE,MAAM,UAAU,IAAI;AAE5B,QAAM,UAAM,yBAAW,uBAAAA,OAAe;AACtC,QAAM;AAAA,IACJ,OAAO,EAAE,mBAAmB,gBAAgB,kBAAkB;AAAA,IAC9D,oBAAoB,EAAE,cAAc;AAAA,IACpC;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,EAAE,GAAG,IAAI;AAEf,QAAM,oBAAgB,0BAAY,MAAM;AACtC,UAAM,qBAAqB,EAAE,CAAC,EAAE,GAAG,KAAK;AACxC,oCAAgC,kBAAkB;AAClD,UAAM,mBAAmB;AAAA,MACvB,cAAc,MAAM;AAClB,YAAI,KAAK,aAAc,eAAc,KAAK,YAAY;AAAA,MACxD;AAAA,MACA;AAAA,IACF;AACA,QAAI,kBAAmB,mBAAkB,oBAAoB,MAAM,gBAAgB;AAAA,EACrF,GAAG,CAAC,IAAI,iCAAiC,WAAW,mBAAmB,MAAM,aAAa,CAAC;AAE3F,QAAM,iBAAa,sBAAQ,MAAM,eAAe,IAAI,GAAG,CAAC,MAAM,cAAc,CAAC;AAC7E,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAS,mBAAmB,EAAE,MAAM;AAAA,MACpC,UAAU,cAAc,CAAC;AAAA,MACzB,mBAAmB,cAAc;AAAA,MACjC,cAAY,KAAK;AAAA,MACjB,WAAU;AAAA,MACV,eAAY;AAAA,MACZ,UAAU;AAAA,MACV,UAAU;AAAA,MACV,OAAO,GAAG,SAAS;AAAA;AAAA,EACrB;AAEJ;AAEA,IAAO,0BAAQ;",
6
6
  "names": ["TreeViewContext"]
7
7
  }
@@ -84,6 +84,9 @@ const TreeViewPropTypes = {
84
84
  searchQuery: import_ds_props_helpers.PropTypes.string.description("search query value"),
85
85
  noItemsPlaceholder: import_ds_props_helpers.PropTypes.string.description("message to be shown when there are no items in the treeview to be displayed").defaultValue("No items found"),
86
86
  nameKey: import_ds_props_helpers.PropTypes.string.description("property key to identifier for items labels").defaultValue("name"),
87
- highlightOnlyQuery: import_ds_props_helpers.PropTypes.bool.description("whether to highlight results or not").defaultValue(false)
87
+ highlightOnlyQuery: import_ds_props_helpers.PropTypes.bool.description("whether to highlight results or not").defaultValue(false),
88
+ applyAriaDisabled: import_ds_props_helpers.PropTypes.bool.description(
89
+ "Whether to apply disabled styling and announce as disabled in SR. CAN STILL RECEIVE FOCUS. PREVENTS ONLY MAIN ACTION"
90
+ ).defaultValue(false)
88
91
  };
89
92
  //# sourceMappingURL=react-desc-prop-types.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/react-desc-prop-types.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["/* eslint-disable max-lines */\nimport type { WeakValidationMap } from 'react';\nimport type React from 'react';\nimport { PropTypes } from '@elliemae/ds-props-helpers';\nimport type TreeModel from 'tree-model';\nimport type { useVirtual } from 'react-virtual';\nexport declare namespace DSTreeviewT {\n export type StringOrNum = string | number;\n export type SelectionState = boolean | 'mixed';\n export type SelectionItems = Record<StringOrNum, SelectionState>;\n export type ScrollToFunc = ReturnType<typeof useVirtual>['scrollToIndex'];\n export type ScrollToItemOptions = Parameters<ReturnType<typeof useVirtual>['scrollToIndex']>[1];\n export type ScrollToItemFunc = (options: ScrollToItemOptions) => void;\n export type ExpandedItems = Record<StringOrNum, true>; // { [id]:true } -> e.g. {1:true; 2:true} // false are not listed\n export interface SimpleItem {\n [key: string]: unknown;\n name: string;\n children?: SimpleItem[];\n id: StringOrNum;\n }\n\n export interface Item extends SimpleItem {\n children: Item[];\n treeDepth?: number;\n virtualIndex?: number;\n isChecked?: boolean | 'mixed';\n isGroup?: boolean;\n isExpanded?: boolean;\n childrenMatchesSearchQuery?: boolean;\n matchesSearchQuery?: boolean;\n nodeItemRef?: React.RefObject<HTMLLIElement>;\n model: TreeModel.Node<Item>['model'];\n node: TreeModel.Node<Item> & { parent?: TreeModel.Node<Item> };\n nodePath: TreeModel.Node<Item>[];\n }\n\n export interface DndItem {\n uid: string;\n depth: number;\n realIndex: number;\n childrenCount: number;\n parentId: string | null;\n original: DSTreeviewT.Item;\n }\n\n export interface Actions {\n toggleExpandAll: (isExpand: boolean) => Promise<DSTreeviewT.Item[]>;\n scrollTo: DSTreeviewT.ScrollToFunc;\n setSelectedItemByVirtualIndex: (index: number) => void;\n setFocusedItemByVirtualIndex: (\n index: number,\n scrollOpts: DSTreeviewT.ScrollToItemOptions & { withScroll?: boolean },\n ) => void;\n }\n export interface InstanceRef {\n actions: Actions;\n }\n\n export interface DefaultProps {\n plugins: string[];\n selection: SelectionItems;\n instanceRef: React.MutableRefObject<InstanceRef>;\n isItemDisabled: (item: Item) => boolean;\n disableIcons: boolean;\n isMultiSelect: boolean;\n isSingleSelect: boolean;\n getIsDropValid: (\n active: DndItem,\n over: DndItem,\n dropIndicatorPosition: 'none' | 'before' | 'after' | 'inside',\n ) => boolean;\n showChildrenAmount: boolean;\n isLoading: boolean;\n highlightOnlyQuery: boolean;\n onItemClick: (item: Item, e: React.MouseEvent<HTMLLIElement>) => void;\n onItemActivate: (item: Item, e?: React.MouseEvent<HTMLLIElement> | React.KeyboardEvent<HTMLLIElement>) => void;\n onItemFocus: (meta: { scrollToItem: ScrollToItemFunc; itemIndex: number; item: Item }) => void;\n onVisibleItemsChange: (newVisibleItems: Item[]) => void;\n onOrderChange: (newData: SimpleItem[], oldData: SimpleItem[], draggedItem: DndItem) => void;\n onSelectionChange: (\n selection: SelectionItems,\n item: Item,\n meta: { scrollToItem: ScrollToItemFunc; itemIndex: number },\n ) => void;\n onExpandChange: (expandedHashmap: ExpandedItems, itemToggled: Item | null | undefined) => void;\n onInstanceRefInitialized: (instanceRef: React.MutableRefObject<InstanceRef>) => void;\n rowSize: 'normal' | 'compact';\n labelOverflow: 'wrap' | 'wrap-all' | 'truncate';\n noItemsPlaceholder: string;\n nameKey: string;\n width: StringOrNum;\n height: StringOrNum;\n groupIcon: JSX.Element | null;\n itemIcon: JSX.Element | null;\n searchQuery: string;\n }\n export interface PropsOptional {\n controlledSelection: SelectionItems;\n expanded: ExpandedItems;\n rightAddons: ((item: Item) => React.ReactNode[]) | JSX.Element;\n RightAddons: React.ComponentType<{ item: Item }>;\n }\n export interface PropsRequired {\n data: Item[];\n }\n export interface Props extends DefaultProps, PropsOptional, PropsRequired {}\n}\n\nexport const TreeViewPropTypes = {\n data: PropTypes.arrayOf(\n PropTypes.shape({\n children: PropTypes.arrayOf(PropTypes.object),\n id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n isGroup: PropTypes.oneOfType([PropTypes.oneOf([undefined, null]), PropTypes.bool]),\n name: PropTypes.string,\n node: PropTypes.object,\n }),\n ).description('data to populate tree view').isRequired,\n plugins: PropTypes.tuple([PropTypes.oneOf(['tree-dnd'])])\n .description(\n 'only accepted value is TreeDndPlugin constant\\nother legacy plugins are now supported via different props',\n )\n .defaultValue([]),\n selection: PropTypes.object.description('pre selected items').defaultValue({}),\n RightAddons: PropTypes.func\n .description('A React component that will be rendered on the right side of each rows')\n .signature('React.ComponentType<{item}>'),\n expanded: PropTypes.object.description('control what items are expanded').defaultValue(undefined),\n instanceRef: PropTypes.shape({\n current: PropTypes.oneOfType([\n PropTypes.oneOf([null, undefined]),\n PropTypes.shape({\n actions: PropTypes.shape({\n toggleExpandAll: PropTypes.func,\n scrollTo: PropTypes.func,\n }).description('').isRequired,\n }),\n ]),\n }).description('instance ref'),\n isItemDisabled: PropTypes.func\n .description('Function that receives an item, and returns whether that item should be disabled')\n .defaultValue('() => false'),\n disableIcons: PropTypes.bool.description('disable icons').defaultValue(false),\n isMultiSelect: PropTypes.bool.description('whether the tree view is multi select or not').defaultValue(false),\n isSingleSelect: PropTypes.bool.description('wheter the tree view is single select or not').defaultValue(false),\n isLoading: PropTypes.bool.description('wheter the tree should show the loading state or not').defaultValue(false),\n getIsDropValid: PropTypes.func\n .description(\"Function that returns true if the drop is valid and false if it's not\")\n .defaultValue('() => true'),\n showChildrenAmount: PropTypes.bool.description('whether to show the amount of children or not').defaultValue(false),\n onItemClick: PropTypes.func.description('function executed when clicking on an item').defaultValue('() => {}'),\n onItemActivate: PropTypes.func.description('function executed when an item gets activated').defaultValue('() => {}'),\n onItemFocus: PropTypes.func.description('function executed when focusing on an item').defaultValue('() => {}'),\n onVisibleItemsChange: PropTypes.func\n .description('function executed when the visible items change')\n .defaultValue('() => {}'),\n onOrderChange: PropTypes.func.description('function executed when the items order changes').defaultValue('() => {}'),\n onSelectionChange: PropTypes.func\n .description('function executed when the selection changes')\n .defaultValue('() => {}'),\n onExpandChange: PropTypes.func.description('function executed when expanding an item').defaultValue('() => {}'),\n onInstanceRefInitialized: PropTypes.func\n .description('function executed when instanceRef has terminated instanciation')\n .defaultValue('() => {}'),\n rowSize: PropTypes.oneOf(['normal', 'compact']).description('size of the row').defaultValue('normal'),\n labelOverflow: PropTypes.oneOf(['wrap', 'wrap-all', 'truncate'])\n .description('label truncation preference')\n .defaultValue('wrap'),\n width: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).description('components width').defaultValue('100%'),\n height: PropTypes.oneOfType([PropTypes.number, PropTypes.string])\n .description('components height')\n .defaultValue('100%'),\n groupIcon: PropTypes.node.description('icon for groups'),\n itemIcon: PropTypes.node.description('icon for items'),\n searchQuery: PropTypes.string.description('search query value'),\n noItemsPlaceholder: PropTypes.string\n .description('message to be shown when there are no items in the treeview to be displayed')\n .defaultValue('No items found'),\n nameKey: PropTypes.string.description('property key to identifier for items labels').defaultValue('name'),\n highlightOnlyQuery: PropTypes.bool.description('whether to highlight results or not').defaultValue(false),\n} as WeakValidationMap<unknown>;\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["/* eslint-disable max-lines */\nimport type { WeakValidationMap } from 'react';\nimport type React from 'react';\nimport { PropTypes } from '@elliemae/ds-props-helpers';\nimport type TreeModel from 'tree-model';\nimport type { useVirtual } from 'react-virtual';\nexport declare namespace DSTreeviewT {\n export type StringOrNum = string | number;\n export type SelectionState = boolean | 'mixed';\n export type SelectionItems = Record<StringOrNum, SelectionState>;\n export type ScrollToFunc = ReturnType<typeof useVirtual>['scrollToIndex'];\n export type ScrollToItemOptions = Parameters<ReturnType<typeof useVirtual>['scrollToIndex']>[1];\n export type ScrollToItemFunc = (options: ScrollToItemOptions) => void;\n export type ExpandedItems = Record<StringOrNum, true>; // { [id]:true } -> e.g. {1:true; 2:true} // false are not listed\n export interface SimpleItem {\n [key: string]: unknown;\n name: string;\n children?: SimpleItem[];\n id: StringOrNum;\n }\n\n export interface Item extends SimpleItem {\n children: Item[];\n treeDepth?: number;\n virtualIndex?: number;\n isChecked?: boolean | 'mixed';\n isGroup?: boolean;\n isExpanded?: boolean;\n childrenMatchesSearchQuery?: boolean;\n matchesSearchQuery?: boolean;\n nodeItemRef?: React.RefObject<HTMLLIElement>;\n model: TreeModel.Node<Item>['model'];\n node: TreeModel.Node<Item> & { parent?: TreeModel.Node<Item> };\n nodePath: TreeModel.Node<Item>[];\n }\n\n export interface DndItem {\n uid: string;\n depth: number;\n realIndex: number;\n childrenCount: number;\n parentId: string | null;\n original: DSTreeviewT.Item;\n }\n\n export interface Actions {\n toggleExpandAll: (isExpand: boolean) => Promise<DSTreeviewT.Item[]>;\n scrollTo: DSTreeviewT.ScrollToFunc;\n setSelectedItemByVirtualIndex: (index: number) => void;\n setFocusedItemByVirtualIndex: (\n index: number,\n scrollOpts: DSTreeviewT.ScrollToItemOptions & { withScroll?: boolean },\n ) => void;\n }\n export interface InstanceRef {\n actions: Actions;\n }\n\n export interface DefaultProps {\n plugins: string[];\n selection: SelectionItems;\n instanceRef: React.MutableRefObject<InstanceRef>;\n isItemDisabled: (item: Item) => boolean;\n disableIcons: boolean;\n isMultiSelect: boolean;\n isSingleSelect: boolean;\n getIsDropValid: (\n active: DndItem,\n over: DndItem,\n dropIndicatorPosition: 'none' | 'before' | 'after' | 'inside',\n ) => boolean;\n showChildrenAmount: boolean;\n isLoading: boolean;\n highlightOnlyQuery: boolean;\n onItemClick: (item: Item, e: React.MouseEvent<HTMLLIElement>) => void;\n onItemActivate: (item: Item, e?: React.MouseEvent<HTMLLIElement> | React.KeyboardEvent<HTMLLIElement>) => void;\n onItemFocus: (meta: { scrollToItem: ScrollToItemFunc; itemIndex: number; item: Item }) => void;\n onVisibleItemsChange: (newVisibleItems: Item[]) => void;\n onOrderChange: (newData: SimpleItem[], oldData: SimpleItem[], draggedItem: DndItem) => void;\n onSelectionChange: (\n selection: SelectionItems,\n item: Item,\n meta: { scrollToItem: ScrollToItemFunc; itemIndex: number },\n ) => void;\n onExpandChange: (expandedHashmap: ExpandedItems, itemToggled: Item | null | undefined) => void;\n onInstanceRefInitialized: (instanceRef: React.MutableRefObject<InstanceRef>) => void;\n rowSize: 'normal' | 'compact';\n labelOverflow: 'wrap' | 'wrap-all' | 'truncate';\n noItemsPlaceholder: string;\n nameKey: string;\n width: StringOrNum;\n height: StringOrNum;\n groupIcon: JSX.Element | null;\n itemIcon: JSX.Element | null;\n searchQuery: string;\n applyAriaDisabled: boolean;\n }\n export interface PropsOptional {\n controlledSelection: SelectionItems;\n expanded: ExpandedItems;\n rightAddons: ((item: Item) => React.ReactNode[]) | JSX.Element;\n RightAddons: React.ComponentType<{ item: Item }>;\n }\n export interface PropsRequired {\n data: Item[];\n }\n export interface Props extends DefaultProps, PropsOptional, PropsRequired {}\n}\n\nexport const TreeViewPropTypes = {\n data: PropTypes.arrayOf(\n PropTypes.shape({\n children: PropTypes.arrayOf(PropTypes.object),\n id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n isGroup: PropTypes.oneOfType([PropTypes.oneOf([undefined, null]), PropTypes.bool]),\n name: PropTypes.string,\n node: PropTypes.object,\n }),\n ).description('data to populate tree view').isRequired,\n plugins: PropTypes.tuple([PropTypes.oneOf(['tree-dnd'])])\n .description(\n 'only accepted value is TreeDndPlugin constant\\nother legacy plugins are now supported via different props',\n )\n .defaultValue([]),\n selection: PropTypes.object.description('pre selected items').defaultValue({}),\n RightAddons: PropTypes.func\n .description('A React component that will be rendered on the right side of each rows')\n .signature('React.ComponentType<{item}>'),\n expanded: PropTypes.object.description('control what items are expanded').defaultValue(undefined),\n instanceRef: PropTypes.shape({\n current: PropTypes.oneOfType([\n PropTypes.oneOf([null, undefined]),\n PropTypes.shape({\n actions: PropTypes.shape({\n toggleExpandAll: PropTypes.func,\n scrollTo: PropTypes.func,\n }).description('').isRequired,\n }),\n ]),\n }).description('instance ref'),\n isItemDisabled: PropTypes.func\n .description('Function that receives an item, and returns whether that item should be disabled')\n .defaultValue('() => false'),\n disableIcons: PropTypes.bool.description('disable icons').defaultValue(false),\n isMultiSelect: PropTypes.bool.description('whether the tree view is multi select or not').defaultValue(false),\n isSingleSelect: PropTypes.bool.description('wheter the tree view is single select or not').defaultValue(false),\n isLoading: PropTypes.bool.description('wheter the tree should show the loading state or not').defaultValue(false),\n getIsDropValid: PropTypes.func\n .description(\"Function that returns true if the drop is valid and false if it's not\")\n .defaultValue('() => true'),\n showChildrenAmount: PropTypes.bool.description('whether to show the amount of children or not').defaultValue(false),\n onItemClick: PropTypes.func.description('function executed when clicking on an item').defaultValue('() => {}'),\n onItemActivate: PropTypes.func.description('function executed when an item gets activated').defaultValue('() => {}'),\n onItemFocus: PropTypes.func.description('function executed when focusing on an item').defaultValue('() => {}'),\n onVisibleItemsChange: PropTypes.func\n .description('function executed when the visible items change')\n .defaultValue('() => {}'),\n onOrderChange: PropTypes.func.description('function executed when the items order changes').defaultValue('() => {}'),\n onSelectionChange: PropTypes.func\n .description('function executed when the selection changes')\n .defaultValue('() => {}'),\n onExpandChange: PropTypes.func.description('function executed when expanding an item').defaultValue('() => {}'),\n onInstanceRefInitialized: PropTypes.func\n .description('function executed when instanceRef has terminated instanciation')\n .defaultValue('() => {}'),\n rowSize: PropTypes.oneOf(['normal', 'compact']).description('size of the row').defaultValue('normal'),\n labelOverflow: PropTypes.oneOf(['wrap', 'wrap-all', 'truncate'])\n .description('label truncation preference')\n .defaultValue('wrap'),\n width: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).description('components width').defaultValue('100%'),\n height: PropTypes.oneOfType([PropTypes.number, PropTypes.string])\n .description('components height')\n .defaultValue('100%'),\n groupIcon: PropTypes.node.description('icon for groups'),\n itemIcon: PropTypes.node.description('icon for items'),\n searchQuery: PropTypes.string.description('search query value'),\n noItemsPlaceholder: PropTypes.string\n .description('message to be shown when there are no items in the treeview to be displayed')\n .defaultValue('No items found'),\n nameKey: PropTypes.string.description('property key to identifier for items labels').defaultValue('name'),\n highlightOnlyQuery: PropTypes.bool.description('whether to highlight results or not').defaultValue(false),\n applyAriaDisabled: PropTypes.bool\n .description(\n 'Whether to apply disabled styling and announce as disabled in SR. CAN STILL RECEIVE FOCUS. PREVENTS ONLY MAIN ACTION',\n )\n .defaultValue(false),\n} as WeakValidationMap<unknown>;\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
@@ -30,7 +30,8 @@ const defaultProps = {
30
30
  height: "100%",
31
31
  groupIcon: null,
32
32
  itemIcon: null,
33
- searchQuery: ""
33
+ searchQuery: "",
34
+ applyAriaDisabled: false
34
35
  // workaround on the typings over the fact that
35
36
  // when we instantiate the context we can't have all the props
36
37
  // we only have a part of them but the final typings will include missing props
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/TreeViewContext.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable no-unused-vars */\nimport { createContext, createRef } from 'react';\nimport type { DSTreeviewT } from './react-desc-prop-types.js';\nimport type { DSTreeviewInternalsT } from './sharedTypes.js';\n\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nfunction noop<T extends unknown[]>(..._args: T): void {}\n\nexport const defaultProps = {\n plugins: [],\n selection: {},\n instanceRef: createRef(),\n isItemDisabled: () => false,\n disableIcons: false,\n isMultiSelect: false,\n isSingleSelect: false,\n getIsDropValid: () => true,\n showChildrenAmount: false,\n isLoading: false,\n highlightOnlyQuery: false,\n onItemClick: noop,\n onItemActivate: noop,\n onItemFocus: noop,\n onVisibleItemsChange: noop,\n onOrderChange: noop,\n onSelectionChange: noop,\n onExpandChange: noop,\n onInstanceRefInitialized: noop,\n rowSize: 'normal',\n labelOverflow: 'wrap',\n noItemsPlaceholder: 'No items found',\n nameKey: 'name',\n width: '100%',\n height: '100%',\n groupIcon: null,\n itemIcon: null,\n searchQuery: '',\n // workaround on the typings over the fact that\n // when we instantiate the context we can't have all the props\n // we only have a part of them but the final typings will include missing props\n // this is safe to do because\n // we will \"mergeWithDefaults\" + \"validatePropTypes\" when we do instantiate the context\n} as unknown as DSTreeviewT.Props;\n\nexport const defaultRelativeMouseCoord = {\n isBefore: false,\n isAfter: false,\n isValid: true,\n item: null,\n x: null,\n y: null,\n relativeElementDOMRect: null,\n relativeElementIndex: null,\n};\n\nconst defaultContext: DSTreeviewInternalsT.CTX = {\n props: defaultProps,\n visibleItems: [],\n flattenedItems: [],\n withRadioChecks: false,\n withCheckboxChecks: false,\n withDragAndDrop: false,\n triggerTreeRerender: noop,\n tree: undefined,\n treeRoot: undefined,\n virtualListHelpers: {\n virtualItems: [],\n totalSize: 0,\n scrollToOffset: noop,\n scrollToIndex: noop,\n measure: noop,\n },\n virtualListRef: undefined,\n uniqueTreeViewUUID: '',\n selectedItem: null,\n setSelectedItem: noop,\n focusedItem: null,\n setFocusedItem: noop,\n selectedCheckboxes: {},\n setInternallySelectedCheckboxes: noop,\n expandedGroups: {},\n setExpandedGroups: noop,\n latestToggledItem: null,\n setLatestToggledItem: noop,\n hoverItem: null,\n setHoverItem: noop,\n handleExpandGroup: noop,\n updateUserExpandedState: noop,\n};\n\n/** Context for cross component communication */\nconst TreeViewContext = createContext(defaultContext);\n\nexport default TreeViewContext;\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,eAAe,iBAAiB;AAKzC,SAAS,QAA6B,OAAgB;AAAC;AAEhD,MAAM,eAAe;AAAA,EAC1B,SAAS,CAAC;AAAA,EACV,WAAW,CAAC;AAAA,EACZ,aAAa,UAAU;AAAA,EACvB,gBAAgB,MAAM;AAAA,EACtB,cAAc;AAAA,EACd,eAAe;AAAA,EACf,gBAAgB;AAAA,EAChB,gBAAgB,MAAM;AAAA,EACtB,oBAAoB;AAAA,EACpB,WAAW;AAAA,EACX,oBAAoB;AAAA,EACpB,aAAa;AAAA,EACb,gBAAgB;AAAA,EAChB,aAAa;AAAA,EACb,sBAAsB;AAAA,EACtB,eAAe;AAAA,EACf,mBAAmB;AAAA,EACnB,gBAAgB;AAAA,EAChB,0BAA0B;AAAA,EAC1B,SAAS;AAAA,EACT,eAAe;AAAA,EACf,oBAAoB;AAAA,EACpB,SAAS;AAAA,EACT,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,UAAU;AAAA,EACV,aAAa;AAAA;AAAA;AAAA;AAAA;AAAA;AAMf;AAEO,MAAM,4BAA4B;AAAA,EACvC,UAAU;AAAA,EACV,SAAS;AAAA,EACT,SAAS;AAAA,EACT,MAAM;AAAA,EACN,GAAG;AAAA,EACH,GAAG;AAAA,EACH,wBAAwB;AAAA,EACxB,sBAAsB;AACxB;AAEA,MAAM,iBAA2C;AAAA,EAC/C,OAAO;AAAA,EACP,cAAc,CAAC;AAAA,EACf,gBAAgB,CAAC;AAAA,EACjB,iBAAiB;AAAA,EACjB,oBAAoB;AAAA,EACpB,iBAAiB;AAAA,EACjB,qBAAqB;AAAA,EACrB,MAAM;AAAA,EACN,UAAU;AAAA,EACV,oBAAoB;AAAA,IAClB,cAAc,CAAC;AAAA,IACf,WAAW;AAAA,IACX,gBAAgB;AAAA,IAChB,eAAe;AAAA,IACf,SAAS;AAAA,EACX;AAAA,EACA,gBAAgB;AAAA,EAChB,oBAAoB;AAAA,EACpB,cAAc;AAAA,EACd,iBAAiB;AAAA,EACjB,aAAa;AAAA,EACb,gBAAgB;AAAA,EAChB,oBAAoB,CAAC;AAAA,EACrB,iCAAiC;AAAA,EACjC,gBAAgB,CAAC;AAAA,EACjB,mBAAmB;AAAA,EACnB,mBAAmB;AAAA,EACnB,sBAAsB;AAAA,EACtB,WAAW;AAAA,EACX,cAAc;AAAA,EACd,mBAAmB;AAAA,EACnB,yBAAyB;AAC3B;AAGA,MAAM,kBAAkB,cAAc,cAAc;AAEpD,IAAO,0BAAQ;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable no-unused-vars */\nimport { createContext, createRef } from 'react';\nimport type { DSTreeviewT } from './react-desc-prop-types.js';\nimport type { DSTreeviewInternalsT } from './sharedTypes.js';\n\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nfunction noop<T extends unknown[]>(..._args: T): void {}\n\nexport const defaultProps = {\n plugins: [],\n selection: {},\n instanceRef: createRef(),\n isItemDisabled: () => false,\n disableIcons: false,\n isMultiSelect: false,\n isSingleSelect: false,\n getIsDropValid: () => true,\n showChildrenAmount: false,\n isLoading: false,\n highlightOnlyQuery: false,\n onItemClick: noop,\n onItemActivate: noop,\n onItemFocus: noop,\n onVisibleItemsChange: noop,\n onOrderChange: noop,\n onSelectionChange: noop,\n onExpandChange: noop,\n onInstanceRefInitialized: noop,\n rowSize: 'normal',\n labelOverflow: 'wrap',\n noItemsPlaceholder: 'No items found',\n nameKey: 'name',\n width: '100%',\n height: '100%',\n groupIcon: null,\n itemIcon: null,\n searchQuery: '',\n applyAriaDisabled: false,\n // workaround on the typings over the fact that\n // when we instantiate the context we can't have all the props\n // we only have a part of them but the final typings will include missing props\n // this is safe to do because\n // we will \"mergeWithDefaults\" + \"validatePropTypes\" when we do instantiate the context\n} as unknown as DSTreeviewT.Props;\n\nexport const defaultRelativeMouseCoord = {\n isBefore: false,\n isAfter: false,\n isValid: true,\n item: null,\n x: null,\n y: null,\n relativeElementDOMRect: null,\n relativeElementIndex: null,\n};\n\nconst defaultContext: DSTreeviewInternalsT.CTX = {\n props: defaultProps,\n visibleItems: [],\n flattenedItems: [],\n withRadioChecks: false,\n withCheckboxChecks: false,\n withDragAndDrop: false,\n triggerTreeRerender: noop,\n tree: undefined,\n treeRoot: undefined,\n virtualListHelpers: {\n virtualItems: [],\n totalSize: 0,\n scrollToOffset: noop,\n scrollToIndex: noop,\n measure: noop,\n },\n virtualListRef: undefined,\n uniqueTreeViewUUID: '',\n selectedItem: null,\n setSelectedItem: noop,\n focusedItem: null,\n setFocusedItem: noop,\n selectedCheckboxes: {},\n setInternallySelectedCheckboxes: noop,\n expandedGroups: {},\n setExpandedGroups: noop,\n latestToggledItem: null,\n setLatestToggledItem: noop,\n hoverItem: null,\n setHoverItem: noop,\n handleExpandGroup: noop,\n updateUserExpandedState: noop,\n};\n\n/** Context for cross component communication */\nconst TreeViewContext = createContext(defaultContext);\n\nexport default TreeViewContext;\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,eAAe,iBAAiB;AAKzC,SAAS,QAA6B,OAAgB;AAAC;AAEhD,MAAM,eAAe;AAAA,EAC1B,SAAS,CAAC;AAAA,EACV,WAAW,CAAC;AAAA,EACZ,aAAa,UAAU;AAAA,EACvB,gBAAgB,MAAM;AAAA,EACtB,cAAc;AAAA,EACd,eAAe;AAAA,EACf,gBAAgB;AAAA,EAChB,gBAAgB,MAAM;AAAA,EACtB,oBAAoB;AAAA,EACpB,WAAW;AAAA,EACX,oBAAoB;AAAA,EACpB,aAAa;AAAA,EACb,gBAAgB;AAAA,EAChB,aAAa;AAAA,EACb,sBAAsB;AAAA,EACtB,eAAe;AAAA,EACf,mBAAmB;AAAA,EACnB,gBAAgB;AAAA,EAChB,0BAA0B;AAAA,EAC1B,SAAS;AAAA,EACT,eAAe;AAAA,EACf,oBAAoB;AAAA,EACpB,SAAS;AAAA,EACT,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,UAAU;AAAA,EACV,aAAa;AAAA,EACb,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAMrB;AAEO,MAAM,4BAA4B;AAAA,EACvC,UAAU;AAAA,EACV,SAAS;AAAA,EACT,SAAS;AAAA,EACT,MAAM;AAAA,EACN,GAAG;AAAA,EACH,GAAG;AAAA,EACH,wBAAwB;AAAA,EACxB,sBAAsB;AACxB;AAEA,MAAM,iBAA2C;AAAA,EAC/C,OAAO;AAAA,EACP,cAAc,CAAC;AAAA,EACf,gBAAgB,CAAC;AAAA,EACjB,iBAAiB;AAAA,EACjB,oBAAoB;AAAA,EACpB,iBAAiB;AAAA,EACjB,qBAAqB;AAAA,EACrB,MAAM;AAAA,EACN,UAAU;AAAA,EACV,oBAAoB;AAAA,IAClB,cAAc,CAAC;AAAA,IACf,WAAW;AAAA,IACX,gBAAgB;AAAA,IAChB,eAAe;AAAA,IACf,SAAS;AAAA,EACX;AAAA,EACA,gBAAgB;AAAA,EAChB,oBAAoB;AAAA,EACpB,cAAc;AAAA,EACd,iBAAiB;AAAA,EACjB,aAAa;AAAA,EACb,gBAAgB;AAAA,EAChB,oBAAoB,CAAC;AAAA,EACrB,iCAAiC;AAAA,EACjC,gBAAgB,CAAC;AAAA,EACjB,mBAAmB;AAAA,EACnB,mBAAmB;AAAA,EACnB,sBAAsB;AAAA,EACtB,WAAW;AAAA,EACX,cAAc;AAAA,EACd,mBAAmB;AAAA,EACnB,yBAAyB;AAC3B;AAGA,MAAM,kBAAkB,cAAc,cAAc;AAEpD,IAAO,0BAAQ;",
6
6
  "names": []
7
7
  }
@@ -15,7 +15,7 @@ const CheckboxSelectable = (props) => {
15
15
  const { id, children } = item;
16
16
  const ctx = useContext(TreeViewContext);
17
17
  const {
18
- props: { onSelectionChange, isItemDisabled },
18
+ props: { onSelectionChange, isItemDisabled, applyAriaDisabled },
19
19
  virtualListHelpers: { scrollToIndex },
20
20
  triggerTreeRerender,
21
21
  selectedCheckboxes,
@@ -67,7 +67,8 @@ const CheckboxSelectable = (props) => {
67
67
  DSControlledCheckbox,
68
68
  {
69
69
  checked: isChecked,
70
- disabled: isDisabled,
70
+ disabled: isDisabled && !applyAriaDisabled,
71
+ applyAriaDisabled: isDisabled && applyAriaDisabled,
71
72
  "data-testid": "tree-item-checkbox",
72
73
  "aria-controls": ariaControls,
73
74
  id: `ds-item-${uniqueTreeViewUUID}-${id}`,
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/CheckboxSelectable.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useContext, useCallback, useMemo } from 'react';\nimport { DSControlledCheckbox } from '@elliemae/ds-controlled-form';\nimport { styled } from '@elliemae/ds-system';\nimport TreeViewContext from '../TreeViewContext.js';\nimport { toggleCheckboxItem } from '../utils/selectable-helper.js';\nimport { filterObject } from '../utils/object-helpers.js';\nimport type { DSTreeviewT } from '../react-desc-prop-types.js';\nconst StyledCheckboxWrapper = styled.span`\n padding-top: 3px;\n margin-left: 8px;\n`;\ninterface PropsT {\n item: DSTreeviewT.Item;\n itemIndex: number;\n}\nconst CheckboxSelectable = (props: PropsT): JSX.Element | null => {\n const { item, itemIndex } = props;\n const { id, children } = item;\n\n const ctx = useContext(TreeViewContext);\n const {\n props: { onSelectionChange, isItemDisabled },\n virtualListHelpers: { scrollToIndex },\n triggerTreeRerender,\n selectedCheckboxes,\n setInternallySelectedCheckboxes,\n uniqueTreeViewUUID,\n } = ctx;\n\n const onCheckboxChange = useCallback(() => {\n const newSelections = toggleCheckboxItem(item, selectedCheckboxes);\n const newSelectionHasmap = filterObject<DSTreeviewT.SelectionState>(\n { ...selectedCheckboxes, ...newSelections },\n (value) => value !== false,\n );\n setInternallySelectedCheckboxes(newSelectionHasmap);\n triggerTreeRerender();\n\n const indexAndScrollTo = {\n scrollToItem: () => {\n if (typeof item.virtualIndex === 'number') scrollToIndex(item.virtualIndex);\n },\n itemIndex,\n };\n if (onSelectionChange) onSelectionChange(newSelectionHasmap, item, indexAndScrollTo);\n }, [\n item,\n triggerTreeRerender,\n onSelectionChange,\n itemIndex,\n scrollToIndex,\n selectedCheckboxes,\n setInternallySelectedCheckboxes,\n ]);\n const isChecked = useMemo(() => {\n if (selectedCheckboxes[id] === 'mixed') {\n return 'mixed' as const;\n }\n if (selectedCheckboxes[id] === true) {\n return true;\n }\n return false;\n }, [selectedCheckboxes, id]);\n\n const isDisabled = useMemo(() => isItemDisabled(item), [item, isItemDisabled]);\n const ariaControls = useMemo(() => {\n if (children?.length) {\n const childrenIds = children.map((child) => `ds-item-${uniqueTreeViewUUID}-${child.id}`);\n return childrenIds.join(' ');\n }\n return undefined;\n }, [children, uniqueTreeViewUUID]);\n\n return (\n <StyledCheckboxWrapper>\n <DSControlledCheckbox\n checked={isChecked}\n disabled={isDisabled}\n data-testid=\"tree-item-checkbox\"\n aria-controls={ariaControls}\n id={`ds-item-${uniqueTreeViewUUID}-${id}`}\n onChange={onCheckboxChange}\n tabIndex=\"0\"\n />\n </StyledCheckboxWrapper>\n );\n};\n\nexport default CheckboxSelectable;\n"],
5
- "mappings": "AAAA,YAAY,WAAW;AC2EjB;AA3EN,SAAgB,YAAY,aAAa,eAAe;AACxD,SAAS,4BAA4B;AACrC,SAAS,cAAc;AACvB,OAAO,qBAAqB;AAC5B,SAAS,0BAA0B;AACnC,SAAS,oBAAoB;AAE7B,MAAM,wBAAwB,OAAO;AAAA;AAAA;AAAA;AAQrC,MAAM,qBAAqB,CAAC,UAAsC;AAChE,QAAM,EAAE,MAAM,UAAU,IAAI;AAC5B,QAAM,EAAE,IAAI,SAAS,IAAI;AAEzB,QAAM,MAAM,WAAW,eAAe;AACtC,QAAM;AAAA,IACJ,OAAO,EAAE,mBAAmB,eAAe;AAAA,IAC3C,oBAAoB,EAAE,cAAc;AAAA,IACpC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,mBAAmB,YAAY,MAAM;AACzC,UAAM,gBAAgB,mBAAmB,MAAM,kBAAkB;AACjE,UAAM,qBAAqB;AAAA,MACzB,EAAE,GAAG,oBAAoB,GAAG,cAAc;AAAA,MAC1C,CAAC,UAAU,UAAU;AAAA,IACvB;AACA,oCAAgC,kBAAkB;AAClD,wBAAoB;AAEpB,UAAM,mBAAmB;AAAA,MACvB,cAAc,MAAM;AAClB,YAAI,OAAO,KAAK,iBAAiB,SAAU,eAAc,KAAK,YAAY;AAAA,MAC5E;AAAA,MACA;AAAA,IACF;AACA,QAAI,kBAAmB,mBAAkB,oBAAoB,MAAM,gBAAgB;AAAA,EACrF,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AACD,QAAM,YAAY,QAAQ,MAAM;AAC9B,QAAI,mBAAmB,EAAE,MAAM,SAAS;AACtC,aAAO;AAAA,IACT;AACA,QAAI,mBAAmB,EAAE,MAAM,MAAM;AACnC,aAAO;AAAA,IACT;AACA,WAAO;AAAA,EACT,GAAG,CAAC,oBAAoB,EAAE,CAAC;AAE3B,QAAM,aAAa,QAAQ,MAAM,eAAe,IAAI,GAAG,CAAC,MAAM,cAAc,CAAC;AAC7E,QAAM,eAAe,QAAQ,MAAM;AACjC,QAAI,UAAU,QAAQ;AACpB,YAAM,cAAc,SAAS,IAAI,CAAC,UAAU,WAAW,kBAAkB,IAAI,MAAM,EAAE,EAAE;AACvF,aAAO,YAAY,KAAK,GAAG;AAAA,IAC7B;AACA,WAAO;AAAA,EACT,GAAG,CAAC,UAAU,kBAAkB,CAAC;AAEjC,SACE,oBAAC,yBACC;AAAA,IAAC;AAAA;AAAA,MACC,SAAS;AAAA,MACT,UAAU;AAAA,MACV,eAAY;AAAA,MACZ,iBAAe;AAAA,MACf,IAAI,WAAW,kBAAkB,IAAI,EAAE;AAAA,MACvC,UAAU;AAAA,MACV,UAAS;AAAA;AAAA,EACX,GACF;AAEJ;AAEA,IAAO,6BAAQ;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useContext, useCallback, useMemo } from 'react';\nimport { DSControlledCheckbox } from '@elliemae/ds-controlled-form';\nimport { styled } from '@elliemae/ds-system';\nimport TreeViewContext from '../TreeViewContext.js';\nimport { toggleCheckboxItem } from '../utils/selectable-helper.js';\nimport { filterObject } from '../utils/object-helpers.js';\nimport type { DSTreeviewT } from '../react-desc-prop-types.js';\nconst StyledCheckboxWrapper = styled.span`\n padding-top: 3px;\n margin-left: 8px;\n`;\ninterface PropsT {\n item: DSTreeviewT.Item;\n itemIndex: number;\n}\nconst CheckboxSelectable = (props: PropsT): JSX.Element | null => {\n const { item, itemIndex } = props;\n const { id, children } = item;\n\n const ctx = useContext(TreeViewContext);\n const {\n props: { onSelectionChange, isItemDisabled, applyAriaDisabled },\n virtualListHelpers: { scrollToIndex },\n triggerTreeRerender,\n selectedCheckboxes,\n setInternallySelectedCheckboxes,\n uniqueTreeViewUUID,\n } = ctx;\n\n const onCheckboxChange = useCallback(() => {\n const newSelections = toggleCheckboxItem(item, selectedCheckboxes);\n const newSelectionHasmap = filterObject<DSTreeviewT.SelectionState>(\n { ...selectedCheckboxes, ...newSelections },\n (value) => value !== false,\n );\n setInternallySelectedCheckboxes(newSelectionHasmap);\n triggerTreeRerender();\n\n const indexAndScrollTo = {\n scrollToItem: () => {\n if (typeof item.virtualIndex === 'number') scrollToIndex(item.virtualIndex);\n },\n itemIndex,\n };\n if (onSelectionChange) onSelectionChange(newSelectionHasmap, item, indexAndScrollTo);\n }, [\n item,\n triggerTreeRerender,\n onSelectionChange,\n itemIndex,\n scrollToIndex,\n selectedCheckboxes,\n setInternallySelectedCheckboxes,\n ]);\n const isChecked = useMemo(() => {\n if (selectedCheckboxes[id] === 'mixed') {\n return 'mixed' as const;\n }\n if (selectedCheckboxes[id] === true) {\n return true;\n }\n return false;\n }, [selectedCheckboxes, id]);\n\n const isDisabled = useMemo(() => isItemDisabled(item), [item, isItemDisabled]);\n const ariaControls = useMemo(() => {\n if (children?.length) {\n const childrenIds = children.map((child) => `ds-item-${uniqueTreeViewUUID}-${child.id}`);\n return childrenIds.join(' ');\n }\n return undefined;\n }, [children, uniqueTreeViewUUID]);\n\n return (\n <StyledCheckboxWrapper>\n <DSControlledCheckbox\n checked={isChecked}\n disabled={isDisabled && !applyAriaDisabled}\n applyAriaDisabled={isDisabled && applyAriaDisabled}\n data-testid=\"tree-item-checkbox\"\n aria-controls={ariaControls}\n id={`ds-item-${uniqueTreeViewUUID}-${id}`}\n onChange={onCheckboxChange}\n tabIndex=\"0\"\n />\n </StyledCheckboxWrapper>\n );\n};\n\nexport default CheckboxSelectable;\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;AC2EjB;AA3EN,SAAgB,YAAY,aAAa,eAAe;AACxD,SAAS,4BAA4B;AACrC,SAAS,cAAc;AACvB,OAAO,qBAAqB;AAC5B,SAAS,0BAA0B;AACnC,SAAS,oBAAoB;AAE7B,MAAM,wBAAwB,OAAO;AAAA;AAAA;AAAA;AAQrC,MAAM,qBAAqB,CAAC,UAAsC;AAChE,QAAM,EAAE,MAAM,UAAU,IAAI;AAC5B,QAAM,EAAE,IAAI,SAAS,IAAI;AAEzB,QAAM,MAAM,WAAW,eAAe;AACtC,QAAM;AAAA,IACJ,OAAO,EAAE,mBAAmB,gBAAgB,kBAAkB;AAAA,IAC9D,oBAAoB,EAAE,cAAc;AAAA,IACpC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,mBAAmB,YAAY,MAAM;AACzC,UAAM,gBAAgB,mBAAmB,MAAM,kBAAkB;AACjE,UAAM,qBAAqB;AAAA,MACzB,EAAE,GAAG,oBAAoB,GAAG,cAAc;AAAA,MAC1C,CAAC,UAAU,UAAU;AAAA,IACvB;AACA,oCAAgC,kBAAkB;AAClD,wBAAoB;AAEpB,UAAM,mBAAmB;AAAA,MACvB,cAAc,MAAM;AAClB,YAAI,OAAO,KAAK,iBAAiB,SAAU,eAAc,KAAK,YAAY;AAAA,MAC5E;AAAA,MACA;AAAA,IACF;AACA,QAAI,kBAAmB,mBAAkB,oBAAoB,MAAM,gBAAgB;AAAA,EACrF,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AACD,QAAM,YAAY,QAAQ,MAAM;AAC9B,QAAI,mBAAmB,EAAE,MAAM,SAAS;AACtC,aAAO;AAAA,IACT;AACA,QAAI,mBAAmB,EAAE,MAAM,MAAM;AACnC,aAAO;AAAA,IACT;AACA,WAAO;AAAA,EACT,GAAG,CAAC,oBAAoB,EAAE,CAAC;AAE3B,QAAM,aAAa,QAAQ,MAAM,eAAe,IAAI,GAAG,CAAC,MAAM,cAAc,CAAC;AAC7E,QAAM,eAAe,QAAQ,MAAM;AACjC,QAAI,UAAU,QAAQ;AACpB,YAAM,cAAc,SAAS,IAAI,CAAC,UAAU,WAAW,kBAAkB,IAAI,MAAM,EAAE,EAAE;AACvF,aAAO,YAAY,KAAK,GAAG;AAAA,IAC7B;AACA,WAAO;AAAA,EACT,GAAG,CAAC,UAAU,kBAAkB,CAAC;AAEjC,SACE,oBAAC,yBACC;AAAA,IAAC;AAAA;AAAA,MACC,SAAS;AAAA,MACT,UAAU,cAAc,CAAC;AAAA,MACzB,mBAAmB,cAAc;AAAA,MACjC,eAAY;AAAA,MACZ,iBAAe;AAAA,MACf,IAAI,WAAW,kBAAkB,IAAI,EAAE;AAAA,MACvC,UAAU;AAAA,MACV,UAAS;AAAA;AAAA,EACX,GACF;AAEJ;AAEA,IAAO,6BAAQ;",
6
6
  "names": []
7
7
  }
@@ -1,15 +1,14 @@
1
1
  import * as React from "react";
2
2
  import { jsx } from "react/jsx-runtime";
3
3
  import { useContext, useCallback, useMemo } from "react";
4
- import { DSRadio } from "@elliemae/ds-form";
4
+ import { DSControlledRadio } from "@elliemae/ds-controlled-form";
5
5
  import TreeViewContext from "../TreeViewContext.js";
6
6
  const RadioSelectable = (props) => {
7
7
  const { item, itemIndex } = props;
8
8
  const ctx = useContext(TreeViewContext);
9
9
  const {
10
- props: { onSelectionChange, isItemDisabled },
10
+ props: { onSelectionChange, isItemDisabled, applyAriaDisabled },
11
11
  virtualListHelpers: { scrollToIndex },
12
- uniqueTreeViewUUID,
13
12
  selectedCheckboxes,
14
13
  setInternallySelectedCheckboxes
15
14
  } = ctx;
@@ -25,18 +24,19 @@ const RadioSelectable = (props) => {
25
24
  };
26
25
  if (onSelectionChange) onSelectionChange(newSelectionHasmap, item, indexAndScrollTo);
27
26
  }, [id, setInternallySelectedCheckboxes, itemIndex, onSelectionChange, item, scrollToIndex]);
28
- const radioName = useMemo(() => `radios-${uniqueTreeViewUUID}`, [uniqueTreeViewUUID]);
29
27
  const isDisabled = useMemo(() => isItemDisabled(item), [item, isItemDisabled]);
30
28
  return /* @__PURE__ */ jsx(
31
- DSRadio,
29
+ DSControlledRadio,
32
30
  {
33
31
  checked: selectedCheckboxes[id] === true,
34
- name: radioName,
35
- disabled: isDisabled,
32
+ disabled: isDisabled && !applyAriaDisabled,
33
+ applyAriaDisabled: isDisabled && applyAriaDisabled,
34
+ "aria-label": item.name,
36
35
  className: "em-ds-tree-item-radio",
37
36
  "data-testid": "tree-item-radio",
38
37
  onChange: onRadioChange,
39
- tabIndex: 0
38
+ tabIndex: 0,
39
+ value: id.toString()
40
40
  }
41
41
  );
42
42
  };
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/RadioSelectable.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useContext, useCallback, useMemo } from 'react';\nimport { DSRadio } from '@elliemae/ds-form';\nimport TreeViewContext from '../TreeViewContext.js';\nimport type { DSTreeviewT } from '../react-desc-prop-types.js';\ninterface PropsT {\n item: DSTreeviewT.Item;\n itemIndex: number;\n}\nconst RadioSelectable = (props: PropsT) => {\n const { item, itemIndex } = props;\n\n const ctx = useContext(TreeViewContext);\n const {\n props: { onSelectionChange, isItemDisabled },\n virtualListHelpers: { scrollToIndex },\n uniqueTreeViewUUID,\n selectedCheckboxes,\n setInternallySelectedCheckboxes,\n } = ctx;\n\n const { id } = item;\n\n const onRadioChange = useCallback(() => {\n const newSelectionHasmap = { [id]: true };\n setInternallySelectedCheckboxes(newSelectionHasmap);\n const indexAndScrollTo = {\n scrollToItem: () => {\n if (item.virtualIndex) scrollToIndex(item.virtualIndex);\n },\n itemIndex,\n };\n if (onSelectionChange) onSelectionChange(newSelectionHasmap, item, indexAndScrollTo);\n }, [id, setInternallySelectedCheckboxes, itemIndex, onSelectionChange, item, scrollToIndex]);\n\n const radioName = useMemo(() => `radios-${uniqueTreeViewUUID}`, [uniqueTreeViewUUID]);\n\n const isDisabled = useMemo(() => isItemDisabled(item), [item, isItemDisabled]);\n\n return (\n <DSRadio\n checked={selectedCheckboxes[id] === true}\n name={radioName}\n disabled={isDisabled}\n className=\"em-ds-tree-item-radio\"\n data-testid=\"tree-item-radio\"\n onChange={onRadioChange}\n tabIndex={0}\n />\n );\n};\n\nexport default RadioSelectable;\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACuCnB;AAvCJ,SAAgB,YAAY,aAAa,eAAe;AACxD,SAAS,eAAe;AACxB,OAAO,qBAAqB;AAM5B,MAAM,kBAAkB,CAAC,UAAkB;AACzC,QAAM,EAAE,MAAM,UAAU,IAAI;AAE5B,QAAM,MAAM,WAAW,eAAe;AACtC,QAAM;AAAA,IACJ,OAAO,EAAE,mBAAmB,eAAe;AAAA,IAC3C,oBAAoB,EAAE,cAAc;AAAA,IACpC;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,EAAE,GAAG,IAAI;AAEf,QAAM,gBAAgB,YAAY,MAAM;AACtC,UAAM,qBAAqB,EAAE,CAAC,EAAE,GAAG,KAAK;AACxC,oCAAgC,kBAAkB;AAClD,UAAM,mBAAmB;AAAA,MACvB,cAAc,MAAM;AAClB,YAAI,KAAK,aAAc,eAAc,KAAK,YAAY;AAAA,MACxD;AAAA,MACA;AAAA,IACF;AACA,QAAI,kBAAmB,mBAAkB,oBAAoB,MAAM,gBAAgB;AAAA,EACrF,GAAG,CAAC,IAAI,iCAAiC,WAAW,mBAAmB,MAAM,aAAa,CAAC;AAE3F,QAAM,YAAY,QAAQ,MAAM,UAAU,kBAAkB,IAAI,CAAC,kBAAkB,CAAC;AAEpF,QAAM,aAAa,QAAQ,MAAM,eAAe,IAAI,GAAG,CAAC,MAAM,cAAc,CAAC;AAE7E,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAS,mBAAmB,EAAE,MAAM;AAAA,MACpC,MAAM;AAAA,MACN,UAAU;AAAA,MACV,WAAU;AAAA,MACV,eAAY;AAAA,MACZ,UAAU;AAAA,MACV,UAAU;AAAA;AAAA,EACZ;AAEJ;AAEA,IAAO,0BAAQ;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useContext, useCallback, useMemo } from 'react';\nimport { DSControlledRadio } from '@elliemae/ds-controlled-form';\nimport TreeViewContext from '../TreeViewContext.js';\nimport type { DSTreeviewT } from '../react-desc-prop-types.js';\ninterface PropsT {\n item: DSTreeviewT.Item;\n itemIndex: number;\n}\nconst RadioSelectable = (props: PropsT) => {\n const { item, itemIndex } = props;\n\n const ctx = useContext(TreeViewContext);\n const {\n props: { onSelectionChange, isItemDisabled, applyAriaDisabled },\n virtualListHelpers: { scrollToIndex },\n selectedCheckboxes,\n setInternallySelectedCheckboxes,\n } = ctx;\n\n const { id } = item;\n\n const onRadioChange = useCallback(() => {\n const newSelectionHasmap = { [id]: true };\n setInternallySelectedCheckboxes(newSelectionHasmap);\n const indexAndScrollTo = {\n scrollToItem: () => {\n if (item.virtualIndex) scrollToIndex(item.virtualIndex);\n },\n itemIndex,\n };\n if (onSelectionChange) onSelectionChange(newSelectionHasmap, item, indexAndScrollTo);\n }, [id, setInternallySelectedCheckboxes, itemIndex, onSelectionChange, item, scrollToIndex]);\n\n const isDisabled = useMemo(() => isItemDisabled(item), [item, isItemDisabled]);\n return (\n <DSControlledRadio\n checked={selectedCheckboxes[id] === true}\n disabled={isDisabled && !applyAriaDisabled}\n applyAriaDisabled={isDisabled && applyAriaDisabled}\n aria-label={item.name}\n className=\"em-ds-tree-item-radio\"\n data-testid=\"tree-item-radio\"\n onChange={onRadioChange}\n tabIndex={0}\n value={id.toString()}\n />\n );\n};\n\nexport default RadioSelectable;\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACmCnB;AAnCJ,SAAgB,YAAY,aAAa,eAAe;AACxD,SAAS,yBAAyB;AAClC,OAAO,qBAAqB;AAM5B,MAAM,kBAAkB,CAAC,UAAkB;AACzC,QAAM,EAAE,MAAM,UAAU,IAAI;AAE5B,QAAM,MAAM,WAAW,eAAe;AACtC,QAAM;AAAA,IACJ,OAAO,EAAE,mBAAmB,gBAAgB,kBAAkB;AAAA,IAC9D,oBAAoB,EAAE,cAAc;AAAA,IACpC;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,EAAE,GAAG,IAAI;AAEf,QAAM,gBAAgB,YAAY,MAAM;AACtC,UAAM,qBAAqB,EAAE,CAAC,EAAE,GAAG,KAAK;AACxC,oCAAgC,kBAAkB;AAClD,UAAM,mBAAmB;AAAA,MACvB,cAAc,MAAM;AAClB,YAAI,KAAK,aAAc,eAAc,KAAK,YAAY;AAAA,MACxD;AAAA,MACA;AAAA,IACF;AACA,QAAI,kBAAmB,mBAAkB,oBAAoB,MAAM,gBAAgB;AAAA,EACrF,GAAG,CAAC,IAAI,iCAAiC,WAAW,mBAAmB,MAAM,aAAa,CAAC;AAE3F,QAAM,aAAa,QAAQ,MAAM,eAAe,IAAI,GAAG,CAAC,MAAM,cAAc,CAAC;AAC7E,SACE;AAAA,IAAC;AAAA;AAAA,MACC,SAAS,mBAAmB,EAAE,MAAM;AAAA,MACpC,UAAU,cAAc,CAAC;AAAA,MACzB,mBAAmB,cAAc;AAAA,MACjC,cAAY,KAAK;AAAA,MACjB,WAAU;AAAA,MACV,eAAY;AAAA,MACZ,UAAU;AAAA,MACV,UAAU;AAAA,MACV,OAAO,GAAG,SAAS;AAAA;AAAA,EACrB;AAEJ;AAEA,IAAO,0BAAQ;",
6
6
  "names": []
7
7
  }
@@ -51,7 +51,10 @@ const TreeViewPropTypes = {
51
51
  searchQuery: PropTypes.string.description("search query value"),
52
52
  noItemsPlaceholder: PropTypes.string.description("message to be shown when there are no items in the treeview to be displayed").defaultValue("No items found"),
53
53
  nameKey: PropTypes.string.description("property key to identifier for items labels").defaultValue("name"),
54
- highlightOnlyQuery: PropTypes.bool.description("whether to highlight results or not").defaultValue(false)
54
+ highlightOnlyQuery: PropTypes.bool.description("whether to highlight results or not").defaultValue(false),
55
+ applyAriaDisabled: PropTypes.bool.description(
56
+ "Whether to apply disabled styling and announce as disabled in SR. CAN STILL RECEIVE FOCUS. PREVENTS ONLY MAIN ACTION"
57
+ ).defaultValue(false)
55
58
  };
56
59
  export {
57
60
  TreeViewPropTypes
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/react-desc-prop-types.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport type { WeakValidationMap } from 'react';\nimport type React from 'react';\nimport { PropTypes } from '@elliemae/ds-props-helpers';\nimport type TreeModel from 'tree-model';\nimport type { useVirtual } from 'react-virtual';\nexport declare namespace DSTreeviewT {\n export type StringOrNum = string | number;\n export type SelectionState = boolean | 'mixed';\n export type SelectionItems = Record<StringOrNum, SelectionState>;\n export type ScrollToFunc = ReturnType<typeof useVirtual>['scrollToIndex'];\n export type ScrollToItemOptions = Parameters<ReturnType<typeof useVirtual>['scrollToIndex']>[1];\n export type ScrollToItemFunc = (options: ScrollToItemOptions) => void;\n export type ExpandedItems = Record<StringOrNum, true>; // { [id]:true } -> e.g. {1:true; 2:true} // false are not listed\n export interface SimpleItem {\n [key: string]: unknown;\n name: string;\n children?: SimpleItem[];\n id: StringOrNum;\n }\n\n export interface Item extends SimpleItem {\n children: Item[];\n treeDepth?: number;\n virtualIndex?: number;\n isChecked?: boolean | 'mixed';\n isGroup?: boolean;\n isExpanded?: boolean;\n childrenMatchesSearchQuery?: boolean;\n matchesSearchQuery?: boolean;\n nodeItemRef?: React.RefObject<HTMLLIElement>;\n model: TreeModel.Node<Item>['model'];\n node: TreeModel.Node<Item> & { parent?: TreeModel.Node<Item> };\n nodePath: TreeModel.Node<Item>[];\n }\n\n export interface DndItem {\n uid: string;\n depth: number;\n realIndex: number;\n childrenCount: number;\n parentId: string | null;\n original: DSTreeviewT.Item;\n }\n\n export interface Actions {\n toggleExpandAll: (isExpand: boolean) => Promise<DSTreeviewT.Item[]>;\n scrollTo: DSTreeviewT.ScrollToFunc;\n setSelectedItemByVirtualIndex: (index: number) => void;\n setFocusedItemByVirtualIndex: (\n index: number,\n scrollOpts: DSTreeviewT.ScrollToItemOptions & { withScroll?: boolean },\n ) => void;\n }\n export interface InstanceRef {\n actions: Actions;\n }\n\n export interface DefaultProps {\n plugins: string[];\n selection: SelectionItems;\n instanceRef: React.MutableRefObject<InstanceRef>;\n isItemDisabled: (item: Item) => boolean;\n disableIcons: boolean;\n isMultiSelect: boolean;\n isSingleSelect: boolean;\n getIsDropValid: (\n active: DndItem,\n over: DndItem,\n dropIndicatorPosition: 'none' | 'before' | 'after' | 'inside',\n ) => boolean;\n showChildrenAmount: boolean;\n isLoading: boolean;\n highlightOnlyQuery: boolean;\n onItemClick: (item: Item, e: React.MouseEvent<HTMLLIElement>) => void;\n onItemActivate: (item: Item, e?: React.MouseEvent<HTMLLIElement> | React.KeyboardEvent<HTMLLIElement>) => void;\n onItemFocus: (meta: { scrollToItem: ScrollToItemFunc; itemIndex: number; item: Item }) => void;\n onVisibleItemsChange: (newVisibleItems: Item[]) => void;\n onOrderChange: (newData: SimpleItem[], oldData: SimpleItem[], draggedItem: DndItem) => void;\n onSelectionChange: (\n selection: SelectionItems,\n item: Item,\n meta: { scrollToItem: ScrollToItemFunc; itemIndex: number },\n ) => void;\n onExpandChange: (expandedHashmap: ExpandedItems, itemToggled: Item | null | undefined) => void;\n onInstanceRefInitialized: (instanceRef: React.MutableRefObject<InstanceRef>) => void;\n rowSize: 'normal' | 'compact';\n labelOverflow: 'wrap' | 'wrap-all' | 'truncate';\n noItemsPlaceholder: string;\n nameKey: string;\n width: StringOrNum;\n height: StringOrNum;\n groupIcon: JSX.Element | null;\n itemIcon: JSX.Element | null;\n searchQuery: string;\n }\n export interface PropsOptional {\n controlledSelection: SelectionItems;\n expanded: ExpandedItems;\n rightAddons: ((item: Item) => React.ReactNode[]) | JSX.Element;\n RightAddons: React.ComponentType<{ item: Item }>;\n }\n export interface PropsRequired {\n data: Item[];\n }\n export interface Props extends DefaultProps, PropsOptional, PropsRequired {}\n}\n\nexport const TreeViewPropTypes = {\n data: PropTypes.arrayOf(\n PropTypes.shape({\n children: PropTypes.arrayOf(PropTypes.object),\n id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n isGroup: PropTypes.oneOfType([PropTypes.oneOf([undefined, null]), PropTypes.bool]),\n name: PropTypes.string,\n node: PropTypes.object,\n }),\n ).description('data to populate tree view').isRequired,\n plugins: PropTypes.tuple([PropTypes.oneOf(['tree-dnd'])])\n .description(\n 'only accepted value is TreeDndPlugin constant\\nother legacy plugins are now supported via different props',\n )\n .defaultValue([]),\n selection: PropTypes.object.description('pre selected items').defaultValue({}),\n RightAddons: PropTypes.func\n .description('A React component that will be rendered on the right side of each rows')\n .signature('React.ComponentType<{item}>'),\n expanded: PropTypes.object.description('control what items are expanded').defaultValue(undefined),\n instanceRef: PropTypes.shape({\n current: PropTypes.oneOfType([\n PropTypes.oneOf([null, undefined]),\n PropTypes.shape({\n actions: PropTypes.shape({\n toggleExpandAll: PropTypes.func,\n scrollTo: PropTypes.func,\n }).description('').isRequired,\n }),\n ]),\n }).description('instance ref'),\n isItemDisabled: PropTypes.func\n .description('Function that receives an item, and returns whether that item should be disabled')\n .defaultValue('() => false'),\n disableIcons: PropTypes.bool.description('disable icons').defaultValue(false),\n isMultiSelect: PropTypes.bool.description('whether the tree view is multi select or not').defaultValue(false),\n isSingleSelect: PropTypes.bool.description('wheter the tree view is single select or not').defaultValue(false),\n isLoading: PropTypes.bool.description('wheter the tree should show the loading state or not').defaultValue(false),\n getIsDropValid: PropTypes.func\n .description(\"Function that returns true if the drop is valid and false if it's not\")\n .defaultValue('() => true'),\n showChildrenAmount: PropTypes.bool.description('whether to show the amount of children or not').defaultValue(false),\n onItemClick: PropTypes.func.description('function executed when clicking on an item').defaultValue('() => {}'),\n onItemActivate: PropTypes.func.description('function executed when an item gets activated').defaultValue('() => {}'),\n onItemFocus: PropTypes.func.description('function executed when focusing on an item').defaultValue('() => {}'),\n onVisibleItemsChange: PropTypes.func\n .description('function executed when the visible items change')\n .defaultValue('() => {}'),\n onOrderChange: PropTypes.func.description('function executed when the items order changes').defaultValue('() => {}'),\n onSelectionChange: PropTypes.func\n .description('function executed when the selection changes')\n .defaultValue('() => {}'),\n onExpandChange: PropTypes.func.description('function executed when expanding an item').defaultValue('() => {}'),\n onInstanceRefInitialized: PropTypes.func\n .description('function executed when instanceRef has terminated instanciation')\n .defaultValue('() => {}'),\n rowSize: PropTypes.oneOf(['normal', 'compact']).description('size of the row').defaultValue('normal'),\n labelOverflow: PropTypes.oneOf(['wrap', 'wrap-all', 'truncate'])\n .description('label truncation preference')\n .defaultValue('wrap'),\n width: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).description('components width').defaultValue('100%'),\n height: PropTypes.oneOfType([PropTypes.number, PropTypes.string])\n .description('components height')\n .defaultValue('100%'),\n groupIcon: PropTypes.node.description('icon for groups'),\n itemIcon: PropTypes.node.description('icon for items'),\n searchQuery: PropTypes.string.description('search query value'),\n noItemsPlaceholder: PropTypes.string\n .description('message to be shown when there are no items in the treeview to be displayed')\n .defaultValue('No items found'),\n nameKey: PropTypes.string.description('property key to identifier for items labels').defaultValue('name'),\n highlightOnlyQuery: PropTypes.bool.description('whether to highlight results or not').defaultValue(false),\n} as WeakValidationMap<unknown>;\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport type { WeakValidationMap } from 'react';\nimport type React from 'react';\nimport { PropTypes } from '@elliemae/ds-props-helpers';\nimport type TreeModel from 'tree-model';\nimport type { useVirtual } from 'react-virtual';\nexport declare namespace DSTreeviewT {\n export type StringOrNum = string | number;\n export type SelectionState = boolean | 'mixed';\n export type SelectionItems = Record<StringOrNum, SelectionState>;\n export type ScrollToFunc = ReturnType<typeof useVirtual>['scrollToIndex'];\n export type ScrollToItemOptions = Parameters<ReturnType<typeof useVirtual>['scrollToIndex']>[1];\n export type ScrollToItemFunc = (options: ScrollToItemOptions) => void;\n export type ExpandedItems = Record<StringOrNum, true>; // { [id]:true } -> e.g. {1:true; 2:true} // false are not listed\n export interface SimpleItem {\n [key: string]: unknown;\n name: string;\n children?: SimpleItem[];\n id: StringOrNum;\n }\n\n export interface Item extends SimpleItem {\n children: Item[];\n treeDepth?: number;\n virtualIndex?: number;\n isChecked?: boolean | 'mixed';\n isGroup?: boolean;\n isExpanded?: boolean;\n childrenMatchesSearchQuery?: boolean;\n matchesSearchQuery?: boolean;\n nodeItemRef?: React.RefObject<HTMLLIElement>;\n model: TreeModel.Node<Item>['model'];\n node: TreeModel.Node<Item> & { parent?: TreeModel.Node<Item> };\n nodePath: TreeModel.Node<Item>[];\n }\n\n export interface DndItem {\n uid: string;\n depth: number;\n realIndex: number;\n childrenCount: number;\n parentId: string | null;\n original: DSTreeviewT.Item;\n }\n\n export interface Actions {\n toggleExpandAll: (isExpand: boolean) => Promise<DSTreeviewT.Item[]>;\n scrollTo: DSTreeviewT.ScrollToFunc;\n setSelectedItemByVirtualIndex: (index: number) => void;\n setFocusedItemByVirtualIndex: (\n index: number,\n scrollOpts: DSTreeviewT.ScrollToItemOptions & { withScroll?: boolean },\n ) => void;\n }\n export interface InstanceRef {\n actions: Actions;\n }\n\n export interface DefaultProps {\n plugins: string[];\n selection: SelectionItems;\n instanceRef: React.MutableRefObject<InstanceRef>;\n isItemDisabled: (item: Item) => boolean;\n disableIcons: boolean;\n isMultiSelect: boolean;\n isSingleSelect: boolean;\n getIsDropValid: (\n active: DndItem,\n over: DndItem,\n dropIndicatorPosition: 'none' | 'before' | 'after' | 'inside',\n ) => boolean;\n showChildrenAmount: boolean;\n isLoading: boolean;\n highlightOnlyQuery: boolean;\n onItemClick: (item: Item, e: React.MouseEvent<HTMLLIElement>) => void;\n onItemActivate: (item: Item, e?: React.MouseEvent<HTMLLIElement> | React.KeyboardEvent<HTMLLIElement>) => void;\n onItemFocus: (meta: { scrollToItem: ScrollToItemFunc; itemIndex: number; item: Item }) => void;\n onVisibleItemsChange: (newVisibleItems: Item[]) => void;\n onOrderChange: (newData: SimpleItem[], oldData: SimpleItem[], draggedItem: DndItem) => void;\n onSelectionChange: (\n selection: SelectionItems,\n item: Item,\n meta: { scrollToItem: ScrollToItemFunc; itemIndex: number },\n ) => void;\n onExpandChange: (expandedHashmap: ExpandedItems, itemToggled: Item | null | undefined) => void;\n onInstanceRefInitialized: (instanceRef: React.MutableRefObject<InstanceRef>) => void;\n rowSize: 'normal' | 'compact';\n labelOverflow: 'wrap' | 'wrap-all' | 'truncate';\n noItemsPlaceholder: string;\n nameKey: string;\n width: StringOrNum;\n height: StringOrNum;\n groupIcon: JSX.Element | null;\n itemIcon: JSX.Element | null;\n searchQuery: string;\n applyAriaDisabled: boolean;\n }\n export interface PropsOptional {\n controlledSelection: SelectionItems;\n expanded: ExpandedItems;\n rightAddons: ((item: Item) => React.ReactNode[]) | JSX.Element;\n RightAddons: React.ComponentType<{ item: Item }>;\n }\n export interface PropsRequired {\n data: Item[];\n }\n export interface Props extends DefaultProps, PropsOptional, PropsRequired {}\n}\n\nexport const TreeViewPropTypes = {\n data: PropTypes.arrayOf(\n PropTypes.shape({\n children: PropTypes.arrayOf(PropTypes.object),\n id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n isGroup: PropTypes.oneOfType([PropTypes.oneOf([undefined, null]), PropTypes.bool]),\n name: PropTypes.string,\n node: PropTypes.object,\n }),\n ).description('data to populate tree view').isRequired,\n plugins: PropTypes.tuple([PropTypes.oneOf(['tree-dnd'])])\n .description(\n 'only accepted value is TreeDndPlugin constant\\nother legacy plugins are now supported via different props',\n )\n .defaultValue([]),\n selection: PropTypes.object.description('pre selected items').defaultValue({}),\n RightAddons: PropTypes.func\n .description('A React component that will be rendered on the right side of each rows')\n .signature('React.ComponentType<{item}>'),\n expanded: PropTypes.object.description('control what items are expanded').defaultValue(undefined),\n instanceRef: PropTypes.shape({\n current: PropTypes.oneOfType([\n PropTypes.oneOf([null, undefined]),\n PropTypes.shape({\n actions: PropTypes.shape({\n toggleExpandAll: PropTypes.func,\n scrollTo: PropTypes.func,\n }).description('').isRequired,\n }),\n ]),\n }).description('instance ref'),\n isItemDisabled: PropTypes.func\n .description('Function that receives an item, and returns whether that item should be disabled')\n .defaultValue('() => false'),\n disableIcons: PropTypes.bool.description('disable icons').defaultValue(false),\n isMultiSelect: PropTypes.bool.description('whether the tree view is multi select or not').defaultValue(false),\n isSingleSelect: PropTypes.bool.description('wheter the tree view is single select or not').defaultValue(false),\n isLoading: PropTypes.bool.description('wheter the tree should show the loading state or not').defaultValue(false),\n getIsDropValid: PropTypes.func\n .description(\"Function that returns true if the drop is valid and false if it's not\")\n .defaultValue('() => true'),\n showChildrenAmount: PropTypes.bool.description('whether to show the amount of children or not').defaultValue(false),\n onItemClick: PropTypes.func.description('function executed when clicking on an item').defaultValue('() => {}'),\n onItemActivate: PropTypes.func.description('function executed when an item gets activated').defaultValue('() => {}'),\n onItemFocus: PropTypes.func.description('function executed when focusing on an item').defaultValue('() => {}'),\n onVisibleItemsChange: PropTypes.func\n .description('function executed when the visible items change')\n .defaultValue('() => {}'),\n onOrderChange: PropTypes.func.description('function executed when the items order changes').defaultValue('() => {}'),\n onSelectionChange: PropTypes.func\n .description('function executed when the selection changes')\n .defaultValue('() => {}'),\n onExpandChange: PropTypes.func.description('function executed when expanding an item').defaultValue('() => {}'),\n onInstanceRefInitialized: PropTypes.func\n .description('function executed when instanceRef has terminated instanciation')\n .defaultValue('() => {}'),\n rowSize: PropTypes.oneOf(['normal', 'compact']).description('size of the row').defaultValue('normal'),\n labelOverflow: PropTypes.oneOf(['wrap', 'wrap-all', 'truncate'])\n .description('label truncation preference')\n .defaultValue('wrap'),\n width: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).description('components width').defaultValue('100%'),\n height: PropTypes.oneOfType([PropTypes.number, PropTypes.string])\n .description('components height')\n .defaultValue('100%'),\n groupIcon: PropTypes.node.description('icon for groups'),\n itemIcon: PropTypes.node.description('icon for items'),\n searchQuery: PropTypes.string.description('search query value'),\n noItemsPlaceholder: PropTypes.string\n .description('message to be shown when there are no items in the treeview to be displayed')\n .defaultValue('No items found'),\n nameKey: PropTypes.string.description('property key to identifier for items labels').defaultValue('name'),\n highlightOnlyQuery: PropTypes.bool.description('whether to highlight results or not').defaultValue(false),\n applyAriaDisabled: PropTypes.bool\n .description(\n 'Whether to apply disabled styling and announce as disabled in SR. CAN STILL RECEIVE FOCUS. PREVENTS ONLY MAIN ACTION',\n )\n .defaultValue(false),\n} as WeakValidationMap<unknown>;\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
@@ -87,6 +87,7 @@ export declare namespace DSTreeviewT {
87
87
  groupIcon: JSX.Element | null;
88
88
  itemIcon: JSX.Element | null;
89
89
  searchQuery: string;
90
+ applyAriaDisabled: boolean;
90
91
  }
91
92
  interface PropsOptional {
92
93
  controlledSelection: SelectionItems;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-treeview",
3
- "version": "3.39.1",
3
+ "version": "3.40.0-rc.1",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Tree View",
6
6
  "files": [
@@ -232,22 +232,22 @@
232
232
  "react-virtual": "~2.10.4",
233
233
  "tree-model": "~1.0.7",
234
234
  "uid": "~2.0.1",
235
- "@elliemae/ds-button-v2": "3.39.1",
236
- "@elliemae/ds-circular-progress-indicator": "3.39.1",
237
- "@elliemae/ds-classnames": "3.39.1",
238
- "@elliemae/ds-controlled-form": "3.39.1",
239
- "@elliemae/ds-icons": "3.39.1",
240
- "@elliemae/ds-props-helpers": "3.39.1",
241
- "@elliemae/ds-form": "3.39.1",
242
- "@elliemae/ds-drag-and-drop": "3.39.1",
243
- "@elliemae/ds-truncated-tooltip-text": "3.39.1",
244
- "@elliemae/ds-typescript-helpers": "3.39.1",
245
- "@elliemae/ds-system": "3.39.1"
235
+ "@elliemae/ds-circular-progress-indicator": "3.40.0-rc.1",
236
+ "@elliemae/ds-classnames": "3.40.0-rc.1",
237
+ "@elliemae/ds-controlled-form": "3.40.0-rc.1",
238
+ "@elliemae/ds-drag-and-drop": "3.40.0-rc.1",
239
+ "@elliemae/ds-form": "3.40.0-rc.1",
240
+ "@elliemae/ds-button-v2": "3.40.0-rc.1",
241
+ "@elliemae/ds-icons": "3.40.0-rc.1",
242
+ "@elliemae/ds-props-helpers": "3.40.0-rc.1",
243
+ "@elliemae/ds-system": "3.40.0-rc.1",
244
+ "@elliemae/ds-truncated-tooltip-text": "3.40.0-rc.1",
245
+ "@elliemae/ds-typescript-helpers": "3.40.0-rc.1"
246
246
  },
247
247
  "devDependencies": {
248
248
  "@elliemae/pui-cli": "9.0.0-next.50",
249
249
  "styled-components": "~5.3.9",
250
- "@elliemae/ds-monorepo-devops": "3.39.1"
250
+ "@elliemae/ds-monorepo-devops": "3.40.0-rc.1"
251
251
  },
252
252
  "peerDependencies": {
253
253
  "lodash": "^4.17.21",