@deephaven/components 0.22.3-embed-pandas.11 → 0.23.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/AutoCompleteInput.js +12 -85
- package/dist/AutoCompleteInput.js.map +1 -1
- package/dist/AutoResizeTextarea.d.ts +5 -5
- package/dist/AutoResizeTextarea.d.ts.map +1 -1
- package/dist/AutoResizeTextarea.js +8 -23
- package/dist/AutoResizeTextarea.js.map +1 -1
- package/dist/BasicModal.d.ts +28 -1
- package/dist/BasicModal.d.ts.map +1 -1
- package/dist/BasicModal.js +2 -8
- package/dist/BasicModal.js.map +1 -1
- package/dist/Button.d.ts +9 -9
- package/dist/Button.d.ts.map +1 -1
- package/dist/Button.js +8 -34
- package/dist/Button.js.map +1 -1
- package/dist/ButtonGroup.d.ts +7 -7
- package/dist/ButtonGroup.d.ts.map +1 -1
- package/dist/ButtonGroup.js +2 -4
- package/dist/ButtonGroup.js.map +1 -1
- package/dist/ButtonOld.js.map +1 -1
- package/dist/CardFlip.d.ts +2 -2
- package/dist/CardFlip.d.ts.map +1 -1
- package/dist/CardFlip.js +2 -7
- package/dist/CardFlip.js.map +1 -1
- package/dist/Checkbox.js +3 -14
- package/dist/Checkbox.js.map +1 -1
- package/dist/Collapse.d.ts +1 -1
- package/dist/Collapse.js +0 -15
- package/dist/Collapse.js.map +1 -1
- package/dist/ComboBox.js +4 -83
- package/dist/ComboBox.js.map +1 -1
- package/dist/CopyButton.d.ts +22 -0
- package/dist/CopyButton.d.ts.map +1 -0
- package/dist/CopyButton.js +30 -0
- package/dist/CopyButton.js.map +1 -0
- package/dist/CustomTimeSelect.d.ts +3 -3
- package/dist/CustomTimeSelect.d.ts.map +1 -1
- package/dist/CustomTimeSelect.js +2 -86
- package/dist/CustomTimeSelect.js.map +1 -1
- package/dist/DateInput.d.ts +1 -1
- package/dist/DateInput.d.ts.map +1 -1
- package/dist/DateInput.js.map +1 -1
- package/dist/DateInputUtils.js +0 -7
- package/dist/DateInputUtils.js.map +1 -1
- package/dist/DateTimeInput.d.ts +1 -1
- package/dist/DateTimeInput.d.ts.map +1 -1
- package/dist/DateTimeInput.js +7 -10
- package/dist/DateTimeInput.js.map +1 -1
- package/dist/DebouncedSearchInput.js +0 -14
- package/dist/DebouncedSearchInput.js.map +1 -1
- package/dist/DragUtils.d.ts +1 -1
- package/dist/DragUtils.d.ts.map +1 -1
- package/dist/DragUtils.js +4 -16
- package/dist/DragUtils.js.map +1 -1
- package/dist/DraggableItemList.d.ts +4 -4
- package/dist/DraggableItemList.d.ts.map +1 -1
- package/dist/DraggableItemList.js +22 -44
- package/dist/DraggableItemList.js.map +1 -1
- package/dist/EditableItemList.d.ts +1 -1
- package/dist/EditableItemList.d.ts.map +1 -1
- package/dist/EditableItemList.js +2 -6
- package/dist/EditableItemList.js.map +1 -1
- package/dist/HierarchicalCheckboxMenu.d.ts +3 -3
- package/dist/HierarchicalCheckboxMenu.d.ts.map +1 -1
- package/dist/HierarchicalCheckboxMenu.js +6 -28
- package/dist/HierarchicalCheckboxMenu.js.map +1 -1
- package/dist/ItemList.d.ts +5 -5
- package/dist/ItemList.d.ts.map +1 -1
- package/dist/ItemList.js +22 -115
- package/dist/ItemList.js.map +1 -1
- package/dist/ItemListItem.d.ts +0 -1
- package/dist/ItemListItem.d.ts.map +1 -1
- package/dist/ItemListItem.js +26 -50
- package/dist/ItemListItem.js.map +1 -1
- package/dist/LoadingOverlay.d.ts +2 -2
- package/dist/LoadingOverlay.d.ts.map +1 -1
- package/dist/LoadingOverlay.js +3 -5
- package/dist/LoadingOverlay.js.map +1 -1
- package/dist/LoadingSpinner.d.ts +2 -2
- package/dist/LoadingSpinner.d.ts.map +1 -1
- package/dist/LoadingSpinner.js +2 -4
- package/dist/LoadingSpinner.js.map +1 -1
- package/dist/MaskedInput.d.ts +2 -2
- package/dist/MaskedInput.d.ts.map +1 -1
- package/dist/MaskedInput.js +26 -85
- package/dist/MaskedInput.js.map +1 -1
- package/dist/Option.d.ts +2 -2
- package/dist/Option.d.ts.map +1 -1
- package/dist/Option.js +2 -4
- package/dist/Option.js.map +1 -1
- package/dist/RadioGroup.d.ts +2 -2
- package/dist/RadioGroup.d.ts.map +1 -1
- package/dist/RadioGroup.js +4 -6
- package/dist/RadioGroup.js.map +1 -1
- package/dist/RadioItem.d.ts +1 -1
- package/dist/RadioItem.d.ts.map +1 -1
- package/dist/RadioItem.js +0 -1
- package/dist/RadioItem.js.map +1 -1
- package/dist/SearchInput.js +2 -13
- package/dist/SearchInput.js.map +1 -1
- package/dist/Select.d.ts +2 -2
- package/dist/Select.d.ts.map +1 -1
- package/dist/Select.js +2 -4
- package/dist/Select.js.map +1 -1
- package/dist/SelectValueList.d.ts +1 -1
- package/dist/SelectValueList.d.ts.map +1 -1
- package/dist/SelectValueList.js +0 -28
- package/dist/SelectValueList.js.map +1 -1
- package/dist/SocketedButton.d.ts +1 -1
- package/dist/SocketedButton.d.ts.map +1 -1
- package/dist/SocketedButton.js.map +1 -1
- package/dist/ThemeExport.d.ts +4 -4
- package/dist/ThemeExport.js +0 -4
- package/dist/ThemeExport.js.map +1 -1
- package/dist/TimeInput.d.ts +2 -2
- package/dist/TimeInput.d.ts.map +1 -1
- package/dist/TimeInput.js +2 -12
- package/dist/TimeInput.js.map +1 -1
- package/dist/TimeSlider.d.ts +2 -2
- package/dist/TimeSlider.d.ts.map +1 -1
- package/dist/TimeSlider.js +19 -33
- package/dist/TimeSlider.js.map +1 -1
- package/dist/ToastNotification.d.ts +6 -6
- package/dist/ToastNotification.d.ts.map +1 -1
- package/dist/ToastNotification.js +2 -4
- package/dist/ToastNotification.js.map +1 -1
- package/dist/UISwitch.d.ts +2 -2
- package/dist/UISwitch.d.ts.map +1 -1
- package/dist/UISwitch.js +2 -4
- package/dist/UISwitch.js.map +1 -1
- package/dist/ValidateLabelInput.d.ts +1 -1
- package/dist/ValidateLabelInput.d.ts.map +1 -1
- package/dist/ValidateLabelInput.js +3 -3
- package/dist/ValidateLabelInput.js.map +1 -1
- package/dist/context-actions/ContextActionUtils.d.ts +3 -15
- package/dist/context-actions/ContextActionUtils.d.ts.map +1 -1
- package/dist/context-actions/ContextActionUtils.js +8 -85
- package/dist/context-actions/ContextActionUtils.js.map +1 -1
- package/dist/context-actions/ContextActions.js +1 -34
- package/dist/context-actions/ContextActions.js.map +1 -1
- package/dist/context-actions/ContextMenu.js +29 -110
- package/dist/context-actions/ContextMenu.js.map +1 -1
- package/dist/context-actions/ContextMenuItem.d.ts.map +1 -1
- package/dist/context-actions/ContextMenuItem.js +3 -19
- package/dist/context-actions/ContextMenuItem.js.map +1 -1
- package/dist/context-actions/ContextMenuRoot.d.ts +1 -1
- package/dist/context-actions/ContextMenuRoot.d.ts.map +1 -1
- package/dist/context-actions/ContextMenuRoot.js +7 -26
- package/dist/context-actions/ContextMenuRoot.js.map +1 -1
- package/dist/context-actions/GlobalContextAction.js +0 -15
- package/dist/context-actions/GlobalContextAction.js.map +1 -1
- package/dist/context-actions/GlobalContextActions.js +0 -6
- package/dist/context-actions/GlobalContextActions.js.map +1 -1
- package/dist/context-actions/index.js.map +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -0
- package/dist/index.js.map +1 -1
- package/dist/menu-actions/DropdownMenu.d.ts +3 -3
- package/dist/menu-actions/DropdownMenu.d.ts.map +1 -1
- package/dist/menu-actions/DropdownMenu.js +4 -32
- package/dist/menu-actions/DropdownMenu.js.map +1 -1
- package/dist/menu-actions/Menu.d.ts +3 -3
- package/dist/menu-actions/Menu.d.ts.map +1 -1
- package/dist/menu-actions/Menu.js +7 -52
- package/dist/menu-actions/Menu.js.map +1 -1
- package/dist/menu-actions/index.d.ts +2 -1
- package/dist/menu-actions/index.d.ts.map +1 -1
- package/dist/menu-actions/index.js +2 -2
- package/dist/menu-actions/index.js.map +1 -1
- package/dist/modal/Modal.d.ts +2 -2
- package/dist/modal/Modal.d.ts.map +1 -1
- package/dist/modal/Modal.js +3 -9
- package/dist/modal/Modal.js.map +1 -1
- package/dist/modal/ModalBody.d.ts +1 -1
- package/dist/modal/ModalBody.d.ts.map +1 -1
- package/dist/modal/ModalBody.js +2 -4
- package/dist/modal/ModalBody.js.map +1 -1
- package/dist/modal/ModalFooter.d.ts +1 -1
- package/dist/modal/ModalFooter.d.ts.map +1 -1
- package/dist/modal/ModalFooter.js +2 -4
- package/dist/modal/ModalFooter.js.map +1 -1
- package/dist/modal/ModalHeader.d.ts +1 -1
- package/dist/modal/ModalHeader.d.ts.map +1 -1
- package/dist/modal/ModalHeader.js +2 -4
- package/dist/modal/ModalHeader.js.map +1 -1
- package/dist/modal/index.js.map +1 -1
- package/dist/navigation/Menu.d.ts +3 -3
- package/dist/navigation/Menu.d.ts.map +1 -1
- package/dist/navigation/Menu.js +2 -2
- package/dist/navigation/Menu.js.map +1 -1
- package/dist/navigation/MenuItem.d.ts +4 -4
- package/dist/navigation/MenuItem.d.ts.map +1 -1
- package/dist/navigation/MenuItem.js +4 -7
- package/dist/navigation/MenuItem.js.map +1 -1
- package/dist/navigation/Page.d.ts +2 -2
- package/dist/navigation/Page.d.ts.map +1 -1
- package/dist/navigation/Page.js +2 -3
- package/dist/navigation/Page.js.map +1 -1
- package/dist/navigation/Stack.d.ts +2 -2
- package/dist/navigation/Stack.d.ts.map +1 -1
- package/dist/navigation/Stack.js +3 -6
- package/dist/navigation/Stack.js.map +1 -1
- package/dist/navigation/index.js.map +1 -1
- package/dist/popper/Popper.d.ts +2 -2
- package/dist/popper/Popper.d.ts.map +1 -1
- package/dist/popper/Popper.js +13 -46
- package/dist/popper/Popper.js.map +1 -1
- package/dist/popper/Tooltip.d.ts +1 -1
- package/dist/popper/Tooltip.d.ts.map +1 -1
- package/dist/popper/Tooltip.js +0 -56
- package/dist/popper/Tooltip.js.map +1 -1
- package/dist/popper/index.js.map +1 -1
- package/dist/shortcuts/GlobalShortcuts.js.map +1 -1
- package/dist/shortcuts/Shortcut.d.ts +2 -2
- package/dist/shortcuts/Shortcut.d.ts.map +1 -1
- package/dist/shortcuts/Shortcut.js +19 -76
- package/dist/shortcuts/Shortcut.js.map +1 -1
- package/dist/shortcuts/ShortcutRegistry.d.ts +1 -1
- package/dist/shortcuts/ShortcutRegistry.d.ts.map +1 -1
- package/dist/shortcuts/ShortcutRegistry.js +3 -18
- package/dist/shortcuts/ShortcutRegistry.js.map +1 -1
- package/dist/shortcuts/index.js.map +1 -1
- package/package.json +8 -8
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DraggableItemList.js","names":["React","PureComponent","classNames","memoize","Draggable","Droppable","FontAwesomeIcon","vsGripper","RangeUtils","ItemList","Tooltip","DraggableItemList","renderHandle","renderBadge","text","length","renderTextItem","badgeText","className","renderItem","item","isClone","selectedCount","displayValue","value","undefined","getDraggableId","draggablePrefix","itemIndex","getDraggableIndex","draggableId","num","split","pop","parseInt","constructor","props","isFocused","isSelected","isDragDisabled","style","provided","innerRef","draggableProps","dragHandleProps","max","CACHE_SIZE","getCachedDraggableItem","draggingItemClassName","items","offset","snapshot","rubric","state","index","source","handleSelectionChange","bind","itemList","createRef","selectItem","current","focusItem","scrollToItem","selectedRanges","setState","count","onSelectionChange","render","droppableId","isDoubleClickSelect","isDropDisabled","isMultiSelect","isStickyBottom","itemCount","onFocusChange","onSelect","onViewportChange","rowHeight","dataTestId","getCachedRenderClone","draggingFromThisWith","isDraggingOver","draggingOverWith","droppableProps","getCachedRenderDraggableItem","DEFAULT_ROW_HEIGHT","isDeselectOnClick","disableSelect"],"sources":["../src/DraggableItemList.tsx"],"sourcesContent":["import React, { PureComponent } from 'react';\nimport classNames from 'classnames';\nimport memoize from 'memoizee';\nimport { Draggable, Droppable, DraggableChildrenFn } from 'react-beautiful-dnd';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { vsGripper } from '@deephaven/icons';\nimport { RangeUtils, Range } from '@deephaven/utils';\nimport ItemList, {\n RenderItemProps,\n DefaultListItem,\n ItemListProps,\n} from './ItemList';\nimport { Tooltip } from './popper';\nimport './DraggableItemList.scss';\n\nexport type DraggableRenderItemProps<T> = RenderItemProps<T> & {\n isClone?: boolean;\n selectedCount?: number;\n};\n\ntype DraggableRenderItemFn<T> = (\n props: DraggableRenderItemProps<T>\n) => React.ReactNode;\n\ntype DraggableItemListProps<T> = Omit<\n ItemListProps<T>,\n 'overscanCount' | 'focusSelector' | 'isDragSelect'\n> & {\n className: string;\n draggingItemClassName: string;\n isDropDisabled: boolean;\n // Whether to allow dragging items from this list\n isDragDisabled: boolean;\n\n renderItem: DraggableRenderItemFn<T>;\n style: React.CSSProperties;\n\n // The prefix to add to all draggable item IDs\n draggablePrefix: string;\n // The ID to give the droppable list\n droppableId: string;\n\n 'data-testid'?: string;\n};\n\ntype DraggableItemListState = {\n selectedCount: number;\n};\n\n/**\n * Show a draggable item list. It _must_ be used within a `DragDropContext`.\n * This implementation uses react-beautiful-dnd for handling dragging and dropping of items.\n * We use ItemList to handle selection for multi drag and drop (not built in to react-beautiful-dnd).\n * One caveat with the use of react-beautiful-dnd is that it doesn't allow a drag to be initiated while\n * using a modifier key: https://github.com/atlassian/react-beautiful-dnd/issues/1678\n */\nclass DraggableItemList<T> extends PureComponent<\n DraggableItemListProps<T>,\n DraggableItemListState\n> {\n static DEFAULT_ROW_HEIGHT = 30;\n\n static defaultProps = {\n className: '',\n draggingItemClassName: '',\n offset: 0,\n items: [],\n rowHeight: DraggableItemList.DEFAULT_ROW_HEIGHT,\n isDeselectOnClick: true,\n isDoubleClickSelect: true,\n isDropDisabled: false,\n isDragDisabled: false,\n isMultiSelect: false,\n isStickyBottom: false,\n disableSelect: false,\n style: null,\n onFocusChange(): void {\n // no-op\n },\n onSelect(): void {\n // no-op\n },\n onSelectionChange(): void {\n // no-op\n },\n onViewportChange(): void {\n // no-op\n },\n renderItem: DraggableItemList.renderItem,\n selectedRanges: [],\n draggablePrefix: 'draggable-item',\n droppableId: 'droppable-item-list',\n 'data-testid': undefined,\n };\n\n static renderHandle(): JSX.Element {\n return (\n <div>\n <Tooltip>Drag to re-order</Tooltip>\n <FontAwesomeIcon icon={vsGripper} />\n </div>\n );\n }\n\n static renderBadge({ text }: { text?: string }): React.ReactNode {\n return text != null && text.length > 0 ? (\n <span className=\"number-badge\">{text}</span>\n ) : null;\n }\n\n static renderTextItem({\n text,\n badgeText = '',\n className = '',\n }: {\n text?: string;\n badgeText?: string;\n className: string;\n }): JSX.Element {\n return (\n <div\n className={classNames(\n 'item-list-item-content',\n 'draggable-item-list-item-content',\n className\n )}\n >\n <span className=\"title\">{text}</span>\n {DraggableItemList.renderBadge({ text: badgeText })}\n {DraggableItemList.renderHandle()}\n </div>\n );\n }\n\n static renderItem<P extends DefaultListItem>({\n item,\n isClone,\n selectedCount,\n }: DraggableRenderItemProps<P>): JSX.Element {\n const text =\n item != null ? item.displayValue ?? item.value ?? `${item}` : '';\n const badgeText =\n isClone !== undefined && isClone ? `${selectedCount}` : '';\n const className =\n isClone !== undefined && isClone ? 'item-list-item-clone' : '';\n return DraggableItemList.renderTextItem({ text, badgeText, className });\n }\n\n static getDraggableId(draggablePrefix: string, itemIndex: number): string {\n return `${draggablePrefix}/${itemIndex}`;\n }\n\n static getDraggableIndex(draggableId: string): number {\n const num = draggableId.split('/').pop();\n return parseInt(num !== undefined ? num : '', 10);\n }\n\n constructor(props: DraggableItemListProps<T>) {\n super(props);\n\n this.handleSelectionChange = this.handleSelectionChange.bind(this);\n\n this.itemList = React.createRef();\n\n this.state = {\n selectedCount: 0,\n };\n }\n\n itemList: React.RefObject<ItemList<T>>;\n\n selectItem(itemIndex: number): void {\n this.itemList.current?.selectItem(itemIndex);\n }\n\n focusItem(itemIndex: number): void {\n this.itemList.current?.focusItem(itemIndex);\n }\n\n scrollToItem(itemIndex: number): void {\n this.itemList.current?.scrollToItem(itemIndex);\n }\n\n getCachedDraggableItem = memoize(\n (\n draggablePrefix: string,\n renderItem: DraggableRenderItemFn<T>,\n item: T,\n itemIndex: number,\n isFocused: boolean,\n isSelected: boolean,\n isDragDisabled: boolean,\n style: React.CSSProperties\n ) => (\n <Draggable\n key={itemIndex}\n draggableId={DraggableItemList.getDraggableId(\n draggablePrefix,\n itemIndex\n )}\n index={itemIndex}\n isDragDisabled={isDragDisabled}\n >\n {provided => (\n <div\n role=\"menuitem\"\n className=\"draggable-item-list-item\"\n ref={provided.innerRef}\n tabIndex={-1}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...provided.draggableProps}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...provided.dragHandleProps}\n >\n {renderItem({\n item,\n itemIndex,\n isFocused,\n isSelected,\n style,\n isClone: false,\n })}\n </div>\n )}\n </Draggable>\n ),\n { max: ItemList.CACHE_SIZE }\n );\n\n handleSelectionChange(selectedRanges: Range[]): void {\n this.setState({ selectedCount: RangeUtils.count(selectedRanges) });\n\n const { onSelectionChange } = this.props;\n onSelectionChange(selectedRanges);\n }\n\n getCachedRenderDraggableItem = memoize(\n (\n draggablePrefix: string,\n isDragDisabled: boolean,\n renderItem: DraggableRenderItemFn<T>\n ) => ({\n item,\n itemIndex,\n isFocused,\n isSelected,\n style,\n }: RenderItemProps<T>) =>\n this.getCachedDraggableItem(\n draggablePrefix,\n renderItem,\n item,\n itemIndex,\n isFocused,\n isSelected,\n isDragDisabled,\n style\n ),\n { max: 1 }\n );\n\n getCachedRenderClone = memoize(\n (\n draggingItemClassName: string,\n items: T[],\n offset: number,\n renderItem: DraggableRenderItemFn<T>\n ): DraggableChildrenFn => (provided, snapshot, rubric) => {\n const { selectedCount } = this.state;\n const { index: itemIndex } = rubric.source;\n const item = items[itemIndex - offset];\n return (\n <div\n className={classNames(\n 'draggable-item-list-dragging-item-container',\n draggingItemClassName\n )}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...provided.draggableProps}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...provided.dragHandleProps}\n ref={provided.innerRef}\n >\n <div\n className={classNames(\n 'draggable-item-list-dragging-item',\n { 'two-dragged': selectedCount === 2 },\n { 'multiple-dragged': selectedCount > 2 }\n )}\n >\n {renderItem({\n item,\n itemIndex,\n isFocused: false,\n isSelected: true,\n style: {},\n isClone: true,\n selectedCount,\n })}\n </div>\n </div>\n );\n },\n { max: 1 }\n );\n\n render(): JSX.Element {\n const {\n className,\n draggablePrefix,\n draggingItemClassName,\n droppableId,\n isDoubleClickSelect,\n isDragDisabled,\n isDropDisabled,\n isMultiSelect,\n isStickyBottom,\n itemCount,\n items,\n offset,\n onFocusChange,\n onSelect,\n onViewportChange,\n renderItem,\n rowHeight,\n selectedRanges,\n style,\n 'data-testid': dataTestId,\n } = this.props;\n return (\n <Droppable\n isDropDisabled={isDropDisabled}\n droppableId={droppableId}\n mode=\"virtual\"\n renderClone={this.getCachedRenderClone(\n draggingItemClassName,\n items,\n offset,\n renderItem\n )}\n data-testid={dataTestId}\n >\n {(provided, snapshot) => (\n <div\n role=\"menu\"\n className={classNames('draggable-item-list', className, {\n 'is-drop-disabled': isDropDisabled,\n 'is-drag-disabled': isDragDisabled,\n 'is-dragging-from-this': snapshot.draggingFromThisWith,\n 'is-dragging-over': snapshot.isDraggingOver,\n 'is-dropping': snapshot.draggingOverWith,\n })}\n style={style}\n ref={provided.innerRef}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...provided.droppableProps}\n >\n <ItemList\n focusSelector=\".draggable-item-list-item\"\n isDoubleClickSelect={isDoubleClickSelect}\n isDragSelect={false}\n isMultiSelect={isMultiSelect}\n isStickyBottom={isStickyBottom}\n itemCount={itemCount}\n items={items}\n onFocusChange={onFocusChange}\n onSelect={onSelect}\n onSelectionChange={this.handleSelectionChange}\n onViewportChange={onViewportChange}\n offset={offset}\n ref={this.itemList}\n renderItem={this.getCachedRenderDraggableItem(\n draggablePrefix,\n isDragDisabled,\n renderItem\n )}\n rowHeight={rowHeight}\n selectedRanges={selectedRanges}\n />\n </div>\n )}\n </Droppable>\n );\n }\n}\n\nexport default DraggableItemList;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"DraggableItemList.js","names":["React","PureComponent","classNames","memoize","Draggable","Droppable","FontAwesomeIcon","vsGripper","RangeUtils","ItemList","Tooltip","DraggableItemList","renderHandle","renderBadge","text","length","renderTextItem","badgeText","className","renderItem","item","isClone","selectedCount","displayValue","value","undefined","getDraggableId","draggablePrefix","itemIndex","getDraggableIndex","draggableId","num","split","pop","parseInt","constructor","props","isFocused","isSelected","isDragDisabled","style","provided","innerRef","draggableProps","dragHandleProps","max","CACHE_SIZE","getCachedDraggableItem","draggingItemClassName","items","offset","snapshot","rubric","state","index","source","handleSelectionChange","bind","itemList","createRef","selectItem","current","focusItem","scrollToItem","selectedRanges","setState","count","onSelectionChange","render","droppableId","isDoubleClickSelect","isDropDisabled","isMultiSelect","isStickyBottom","itemCount","onFocusChange","onSelect","onViewportChange","rowHeight","dataTestId","getCachedRenderClone","draggingFromThisWith","isDraggingOver","draggingOverWith","droppableProps","getCachedRenderDraggableItem","DEFAULT_ROW_HEIGHT","isDeselectOnClick","disableSelect"],"sources":["../src/DraggableItemList.tsx"],"sourcesContent":["import React, { PureComponent } from 'react';\nimport classNames from 'classnames';\nimport memoize from 'memoizee';\nimport { Draggable, Droppable, DraggableChildrenFn } from 'react-beautiful-dnd';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { vsGripper } from '@deephaven/icons';\nimport { RangeUtils, Range } from '@deephaven/utils';\nimport ItemList, {\n RenderItemProps,\n DefaultListItem,\n ItemListProps,\n} from './ItemList';\nimport { Tooltip } from './popper';\nimport './DraggableItemList.scss';\n\nexport type DraggableRenderItemProps<T> = RenderItemProps<T> & {\n isClone?: boolean;\n selectedCount?: number;\n};\n\ntype DraggableRenderItemFn<T> = (\n props: DraggableRenderItemProps<T>\n) => React.ReactNode;\n\ntype DraggableItemListProps<T> = Omit<\n ItemListProps<T>,\n 'overscanCount' | 'focusSelector' | 'isDragSelect'\n> & {\n className: string;\n draggingItemClassName: string;\n isDropDisabled: boolean;\n // Whether to allow dragging items from this list\n isDragDisabled: boolean;\n\n renderItem: DraggableRenderItemFn<T>;\n style: React.CSSProperties;\n\n // The prefix to add to all draggable item IDs\n draggablePrefix: string;\n // The ID to give the droppable list\n droppableId: string;\n\n 'data-testid'?: string;\n};\n\ntype DraggableItemListState = {\n selectedCount: number;\n};\n\n/**\n * Show a draggable item list. It _must_ be used within a `DragDropContext`.\n * This implementation uses react-beautiful-dnd for handling dragging and dropping of items.\n * We use ItemList to handle selection for multi drag and drop (not built in to react-beautiful-dnd).\n * One caveat with the use of react-beautiful-dnd is that it doesn't allow a drag to be initiated while\n * using a modifier key: https://github.com/atlassian/react-beautiful-dnd/issues/1678\n */\nclass DraggableItemList<T> extends PureComponent<\n DraggableItemListProps<T>,\n DraggableItemListState\n> {\n static DEFAULT_ROW_HEIGHT = 30;\n\n static defaultProps = {\n className: '',\n draggingItemClassName: '',\n offset: 0,\n items: [],\n rowHeight: DraggableItemList.DEFAULT_ROW_HEIGHT,\n isDeselectOnClick: true,\n isDoubleClickSelect: true,\n isDropDisabled: false,\n isDragDisabled: false,\n isMultiSelect: false,\n isStickyBottom: false,\n disableSelect: false,\n style: null,\n onFocusChange(): void {\n // no-op\n },\n onSelect(): void {\n // no-op\n },\n onSelectionChange(): void {\n // no-op\n },\n onViewportChange(): void {\n // no-op\n },\n renderItem: DraggableItemList.renderItem,\n selectedRanges: [],\n draggablePrefix: 'draggable-item',\n droppableId: 'droppable-item-list',\n 'data-testid': undefined,\n };\n\n static renderHandle(): JSX.Element {\n return (\n <div>\n <Tooltip>Drag to re-order</Tooltip>\n <FontAwesomeIcon icon={vsGripper} />\n </div>\n );\n }\n\n static renderBadge({ text }: { text?: string }): React.ReactNode {\n return text != null && text.length > 0 ? (\n <span className=\"number-badge\">{text}</span>\n ) : null;\n }\n\n static renderTextItem({\n text,\n badgeText = '',\n className = '',\n }: {\n text?: string;\n badgeText?: string;\n className: string;\n }): JSX.Element {\n return (\n <div\n className={classNames(\n 'item-list-item-content',\n 'draggable-item-list-item-content',\n className\n )}\n >\n <span className=\"title\">{text}</span>\n {DraggableItemList.renderBadge({ text: badgeText })}\n {DraggableItemList.renderHandle()}\n </div>\n );\n }\n\n static renderItem<P extends DefaultListItem>({\n item,\n isClone,\n selectedCount,\n }: DraggableRenderItemProps<P>): JSX.Element {\n const text =\n item != null ? item.displayValue ?? item.value ?? `${item}` : '';\n const badgeText =\n isClone !== undefined && isClone ? `${selectedCount}` : '';\n const className =\n isClone !== undefined && isClone ? 'item-list-item-clone' : '';\n return DraggableItemList.renderTextItem({ text, badgeText, className });\n }\n\n static getDraggableId(draggablePrefix: string, itemIndex: number): string {\n return `${draggablePrefix}/${itemIndex}`;\n }\n\n static getDraggableIndex(draggableId: string): number {\n const num = draggableId.split('/').pop();\n return parseInt(num !== undefined ? num : '', 10);\n }\n\n constructor(props: DraggableItemListProps<T>) {\n super(props);\n\n this.handleSelectionChange = this.handleSelectionChange.bind(this);\n\n this.itemList = React.createRef();\n\n this.state = {\n selectedCount: 0,\n };\n }\n\n itemList: React.RefObject<ItemList<T>>;\n\n selectItem(itemIndex: number): void {\n this.itemList.current?.selectItem(itemIndex);\n }\n\n focusItem(itemIndex: number): void {\n this.itemList.current?.focusItem(itemIndex);\n }\n\n scrollToItem(itemIndex: number): void {\n this.itemList.current?.scrollToItem(itemIndex);\n }\n\n getCachedDraggableItem = memoize(\n (\n draggablePrefix: string,\n renderItem: DraggableRenderItemFn<T>,\n item: T,\n itemIndex: number,\n isFocused: boolean,\n isSelected: boolean,\n isDragDisabled: boolean,\n style: React.CSSProperties\n ) => (\n <Draggable\n key={itemIndex}\n draggableId={DraggableItemList.getDraggableId(\n draggablePrefix,\n itemIndex\n )}\n index={itemIndex}\n isDragDisabled={isDragDisabled}\n >\n {provided => (\n <div\n role=\"menuitem\"\n className=\"draggable-item-list-item\"\n ref={provided.innerRef}\n tabIndex={-1}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...provided.draggableProps}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...provided.dragHandleProps}\n >\n {renderItem({\n item,\n itemIndex,\n isFocused,\n isSelected,\n style,\n isClone: false,\n })}\n </div>\n )}\n </Draggable>\n ),\n { max: ItemList.CACHE_SIZE }\n );\n\n handleSelectionChange(selectedRanges: Range[]): void {\n this.setState({ selectedCount: RangeUtils.count(selectedRanges) });\n\n const { onSelectionChange } = this.props;\n onSelectionChange(selectedRanges);\n }\n\n getCachedRenderDraggableItem = memoize(\n (\n draggablePrefix: string,\n isDragDisabled: boolean,\n renderItem: DraggableRenderItemFn<T>\n ) => ({\n item,\n itemIndex,\n isFocused,\n isSelected,\n style,\n }: RenderItemProps<T>) =>\n this.getCachedDraggableItem(\n draggablePrefix,\n renderItem,\n item,\n itemIndex,\n isFocused,\n isSelected,\n isDragDisabled,\n style\n ),\n { max: 1 }\n );\n\n getCachedRenderClone = memoize(\n (\n draggingItemClassName: string,\n items: T[],\n offset: number,\n renderItem: DraggableRenderItemFn<T>\n // eslint-disable-next-line react/no-unstable-nested-components, react/display-name, react/function-component-definition\n ): DraggableChildrenFn => (provided, snapshot, rubric) => {\n // eslint-disable-next-line react/no-this-in-sfc\n const { selectedCount } = this.state;\n const { draggableProps, dragHandleProps, innerRef } = provided;\n const { index: itemIndex } = rubric.source;\n const item = items[itemIndex - offset];\n return (\n <div\n className={classNames(\n 'draggable-item-list-dragging-item-container',\n draggingItemClassName\n )}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...draggableProps}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...dragHandleProps}\n ref={innerRef}\n >\n <div\n className={classNames(\n 'draggable-item-list-dragging-item',\n { 'two-dragged': selectedCount === 2 },\n { 'multiple-dragged': selectedCount > 2 }\n )}\n >\n {renderItem({\n item,\n itemIndex,\n isFocused: false,\n isSelected: true,\n style: {},\n isClone: true,\n selectedCount,\n })}\n </div>\n </div>\n );\n },\n { max: 1 }\n );\n\n render(): JSX.Element {\n const {\n className,\n draggablePrefix,\n draggingItemClassName,\n droppableId,\n isDoubleClickSelect,\n isDragDisabled,\n isDropDisabled,\n isMultiSelect,\n isStickyBottom,\n itemCount,\n items,\n offset,\n onFocusChange,\n onSelect,\n onViewportChange,\n renderItem,\n rowHeight,\n selectedRanges,\n style,\n 'data-testid': dataTestId,\n } = this.props;\n return (\n <Droppable\n isDropDisabled={isDropDisabled}\n droppableId={droppableId}\n mode=\"virtual\"\n renderClone={this.getCachedRenderClone(\n draggingItemClassName,\n items,\n offset,\n renderItem\n )}\n data-testid={dataTestId}\n >\n {(provided, snapshot) => (\n <div\n role=\"menu\"\n className={classNames('draggable-item-list', className, {\n 'is-drop-disabled': isDropDisabled,\n 'is-drag-disabled': isDragDisabled,\n 'is-dragging-from-this': snapshot.draggingFromThisWith,\n 'is-dragging-over': snapshot.isDraggingOver,\n 'is-dropping': snapshot.draggingOverWith,\n })}\n style={style}\n ref={provided.innerRef}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...provided.droppableProps}\n >\n <ItemList\n focusSelector=\".draggable-item-list-item\"\n isDoubleClickSelect={isDoubleClickSelect}\n isDragSelect={false}\n isMultiSelect={isMultiSelect}\n isStickyBottom={isStickyBottom}\n itemCount={itemCount}\n items={items}\n onFocusChange={onFocusChange}\n onSelect={onSelect}\n onSelectionChange={this.handleSelectionChange}\n onViewportChange={onViewportChange}\n offset={offset}\n ref={this.itemList}\n renderItem={this.getCachedRenderDraggableItem(\n draggablePrefix,\n isDragDisabled,\n renderItem\n )}\n rowHeight={rowHeight}\n selectedRanges={selectedRanges}\n />\n </div>\n )}\n </Droppable>\n );\n }\n}\n\nexport default DraggableItemList;\n"],"mappings":"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"}
|
|
@@ -6,6 +6,6 @@ export interface EditableItemListProps {
|
|
|
6
6
|
onAdd: (item: string) => void;
|
|
7
7
|
validate?: (item: string) => Error | null;
|
|
8
8
|
}
|
|
9
|
-
declare
|
|
9
|
+
declare function EditableItemList(props: EditableItemListProps): React.ReactElement;
|
|
10
10
|
export default EditableItemList;
|
|
11
11
|
//# sourceMappingURL=EditableItemList.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EditableItemList.d.ts","sourceRoot":"","sources":["../src/EditableItemList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAMN,MAAM,OAAO,CAAC;AAOf,MAAM,WAAW,qBAAqB;IACpC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACpC,KAAK,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9B,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,KAAK,GAAG,IAAI,CAAC;CAC3C;AAGD,
|
|
1
|
+
{"version":3,"file":"EditableItemList.d.ts","sourceRoot":"","sources":["../src/EditableItemList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAMN,MAAM,OAAO,CAAC;AAOf,MAAM,WAAW,qBAAqB;IACpC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACpC,KAAK,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9B,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,KAAK,GAAG,IAAI,CAAC;CAC3C;AAGD,iBAAS,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,GAAG,KAAK,CAAC,YAAY,CAmH1E;AAED,eAAe,gBAAgB,CAAC"}
|
package/dist/EditableItemList.js
CHANGED
|
@@ -4,9 +4,8 @@ import clamp from 'lodash.clamp';
|
|
|
4
4
|
import { vsAdd, vsTrash } from '@deephaven/icons';
|
|
5
5
|
import { RangeUtils } from '@deephaven/utils';
|
|
6
6
|
import { Button, ItemList } from "./index.js";
|
|
7
|
-
|
|
8
7
|
// Display a list of items with an input for adding new items, and Add/Delete buttons
|
|
9
|
-
|
|
8
|
+
function EditableItemList(props) {
|
|
10
9
|
var {
|
|
11
10
|
isInvalid = false,
|
|
12
11
|
items,
|
|
@@ -28,9 +27,7 @@ var EditableItemList = props => {
|
|
|
28
27
|
if (value === '') {
|
|
29
28
|
return;
|
|
30
29
|
}
|
|
31
|
-
|
|
32
30
|
var validationError = validate(value);
|
|
33
|
-
|
|
34
31
|
if (validationError == null) {
|
|
35
32
|
onAdd(value);
|
|
36
33
|
setValue('');
|
|
@@ -103,7 +100,6 @@ var EditableItemList = props => {
|
|
|
103
100
|
tooltip: "Delete selected items",
|
|
104
101
|
"data-testid": "delete-item-button"
|
|
105
102
|
}))));
|
|
106
|
-
}
|
|
107
|
-
|
|
103
|
+
}
|
|
108
104
|
export default EditableItemList;
|
|
109
105
|
//# sourceMappingURL=EditableItemList.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EditableItemList.js","names":["React","useCallback","useMemo","useState","classNames","clamp","vsAdd","vsTrash","RangeUtils","Button","ItemList","EditableItemList","props","isInvalid","items","onAdd","undefined","onDelete","validate","inputError","setInputError","selectedRanges","setSelectedRanges","value","setValue","handleSelectionChange","ranges","handleDelete","getItemsInRanges","handleAdd","validationError","handleInputChange","event","inputValue","target","handleInputFocus","handleInputKeyDown","key","containerHeight","length","DEFAULT_ROW_HEIGHT","height","map","item","index","isSelected"],"sources":["../src/EditableItemList.tsx"],"sourcesContent":["import React, {\n ChangeEvent,\n KeyboardEvent,\n useCallback,\n useMemo,\n useState,\n} from 'react';\nimport classNames from 'classnames';\nimport clamp from 'lodash.clamp';\nimport { vsAdd, vsTrash } from '@deephaven/icons';\nimport { Range, RangeUtils } from '@deephaven/utils';\nimport { Button, ItemList } from '.';\n\nexport interface EditableItemListProps {\n isInvalid?: boolean;\n items: string[];\n onDelete: (items: string[]) => void;\n onAdd: (item: string) => void;\n validate?: (item: string) => Error | null;\n}\n\n// Display a list of items with an input for adding new items, and Add/Delete buttons\
|
|
1
|
+
{"version":3,"file":"EditableItemList.js","names":["React","useCallback","useMemo","useState","classNames","clamp","vsAdd","vsTrash","RangeUtils","Button","ItemList","EditableItemList","props","isInvalid","items","onAdd","undefined","onDelete","validate","inputError","setInputError","selectedRanges","setSelectedRanges","value","setValue","handleSelectionChange","ranges","handleDelete","getItemsInRanges","handleAdd","validationError","handleInputChange","event","inputValue","target","handleInputFocus","handleInputKeyDown","key","containerHeight","length","DEFAULT_ROW_HEIGHT","height","map","item","index","isSelected"],"sources":["../src/EditableItemList.tsx"],"sourcesContent":["import React, {\n ChangeEvent,\n KeyboardEvent,\n useCallback,\n useMemo,\n useState,\n} from 'react';\nimport classNames from 'classnames';\nimport clamp from 'lodash.clamp';\nimport { vsAdd, vsTrash } from '@deephaven/icons';\nimport { Range, RangeUtils } from '@deephaven/utils';\nimport { Button, ItemList } from '.';\n\nexport interface EditableItemListProps {\n isInvalid?: boolean;\n items: string[];\n onDelete: (items: string[]) => void;\n onAdd: (item: string) => void;\n validate?: (item: string) => Error | null;\n}\n\n// Display a list of items with an input for adding new items, and Add/Delete buttons\nfunction EditableItemList(props: EditableItemListProps): React.ReactElement {\n const {\n isInvalid = false,\n items,\n onAdd = () => undefined,\n onDelete = () => undefined,\n validate = () => null,\n } = props;\n const [inputError, setInputError] = useState<Error | null>(null);\n const [selectedRanges, setSelectedRanges] = useState<Range[]>([]);\n const [value, setValue] = useState('');\n\n const handleSelectionChange = useCallback((ranges: Range[]) => {\n setSelectedRanges(ranges);\n }, []);\n\n const handleDelete = useCallback(() => {\n onDelete(RangeUtils.getItemsInRanges(items, selectedRanges));\n setSelectedRanges([]);\n }, [items, selectedRanges, onDelete]);\n\n const handleAdd = useCallback(() => {\n if (value === '') {\n return;\n }\n const validationError = validate(value);\n if (validationError == null) {\n onAdd(value);\n setValue('');\n } else {\n setInputError(validationError);\n }\n }, [value, onAdd, validate]);\n\n const handleInputChange = useCallback(\n (event: ChangeEvent<HTMLInputElement>) => {\n const { value: inputValue } = event.target;\n setValue(inputValue);\n setInputError(inputValue === '' ? null : validate(inputValue));\n },\n [validate]\n );\n\n const handleInputFocus = useCallback(() => {\n setSelectedRanges([]);\n }, []);\n\n const handleInputKeyDown = useCallback(\n (event: KeyboardEvent) => {\n if (event.key === 'Enter') {\n handleAdd();\n }\n },\n [handleAdd]\n );\n\n const containerHeight = useMemo(\n (): number => 14 + clamp(items.length, 1, 6) * ItemList.DEFAULT_ROW_HEIGHT,\n [items.length]\n );\n\n return (\n <div\n className={classNames('editable-item-list-container', {\n 'is-invalid': isInvalid,\n })}\n >\n <div style={{ height: containerHeight }}>\n <ItemList\n itemCount={items.length}\n items={items.map((item, index) => ({\n value: item,\n isSelected: RangeUtils.isSelected(selectedRanges, index),\n }))}\n offset={0}\n selectedRanges={selectedRanges}\n onSelectionChange={handleSelectionChange}\n isMultiSelect\n />\n </div>\n <div className=\"d-flex flex-row pt-2\">\n <div className=\"d-flex flex-grow-1\">\n <input\n className={classNames('form-control', {\n 'is-invalid': inputError != null,\n })}\n placeholder=\"Enter value\"\n type=\"text\"\n value={value}\n onChange={handleInputChange}\n onFocus={handleInputFocus}\n onKeyDown={handleInputKeyDown}\n />\n </div>\n <div className=\"d-flex align-items-start mt-1 ml-2\">\n <Button\n kind=\"ghost\"\n onClick={handleAdd}\n disabled={inputError != null || value === ''}\n icon={vsAdd}\n tooltip=\"Add new item\"\n data-testid=\"add-item-button\"\n />\n <Button\n kind=\"ghost\"\n onClick={handleDelete}\n disabled={selectedRanges.length === 0}\n icon={vsTrash}\n tooltip=\"Delete selected items\"\n data-testid=\"delete-item-button\"\n />\n </div>\n </div>\n </div>\n );\n}\n\nexport default EditableItemList;\n"],"mappings":"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"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import React, { Component } from 'react';
|
|
2
2
|
import { IconDefinition } from '@deephaven/icons';
|
|
3
3
|
import './HierarchicalCheckboxMenu.scss';
|
|
4
|
-
export
|
|
5
|
-
|
|
4
|
+
export type HierarchicalCheckboxValueMap = Map<string, boolean | Map<string, boolean>>;
|
|
5
|
+
type HierarchicalCheckboxMenuProps = {
|
|
6
6
|
className: string;
|
|
7
7
|
menuText: string;
|
|
8
8
|
valueMap: HierarchicalCheckboxValueMap;
|
|
@@ -11,7 +11,7 @@ declare type HierarchicalCheckboxMenuProps = {
|
|
|
11
11
|
id: string;
|
|
12
12
|
'data-testid'?: string;
|
|
13
13
|
};
|
|
14
|
-
|
|
14
|
+
type HierarchicalCheckboxMenuState = {
|
|
15
15
|
menuIsOpen: boolean;
|
|
16
16
|
};
|
|
17
17
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HierarchicalCheckboxMenu.d.ts","sourceRoot":"","sources":["../src/HierarchicalCheckboxMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEzC,OAAO,EAAU,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAI1D,OAAO,iCAAiC,CAAC;AAGzC,
|
|
1
|
+
{"version":3,"file":"HierarchicalCheckboxMenu.d.ts","sourceRoot":"","sources":["../src/HierarchicalCheckboxMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEzC,OAAO,EAAU,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAI1D,OAAO,iCAAiC,CAAC;AAGzC,MAAM,MAAM,4BAA4B,GAAG,GAAG,CAC5C,MAAM,EACN,OAAO,GAAG,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,CAC/B,CAAC;AAEF,KAAK,6BAA6B,GAAG;IACnC,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,4BAA4B,CAAC;IACvC,gBAAgB,CAAC,GAAG,EAAE,4BAA4B,GAAG,IAAI,CAAC;IAC1D,IAAI,EAAE,cAAc,GAAG,IAAI,CAAC;IAC5B,EAAE,EAAE,MAAM,CAAC;IACX,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF,KAAK,6BAA6B,GAAG;IACnC,UAAU,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,cAAM,wBAAyB,SAAQ,SAAS,CAC9C,6BAA6B,EAC7B,6BAA6B,CAC9B;IACC,MAAM,CAAC,YAAY,EAAE,OAAO,CAAC,6BAA6B,CAAC,CAKzD;IAEF,MAAM,CAAC,gBAAgB,CACrB,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,4BAA4B,GACrC,OAAO,GAAG,IAAI;gBAkBL,KAAK,EAAE,6BAA6B;IAahD,UAAU,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,GAAG,IAAI;IAS5D,cAAc,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI;IA6CpD,YAAY,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI;IAkBlC,SAAS,IAAI,IAAI;IAIjB,KAAK,IAAI,IAAI;IAIb,iBAAiB,IAAI,KAAK,CAAC,SAAS;IAsDpC,MAAM,IAAI,GAAG,CAAC,OAAO;CAqCtB;AAED,eAAe,wBAAwB,CAAC"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
2
|
-
|
|
3
2
|
import React, { Component } from 'react';
|
|
4
3
|
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
|
5
4
|
import { dhSort } from '@deephaven/icons';
|
|
@@ -8,7 +7,6 @@ import Checkbox from "./Checkbox.js";
|
|
|
8
7
|
import Popper from "./popper/Popper.js";
|
|
9
8
|
import "./HierarchicalCheckboxMenu.css";
|
|
10
9
|
import Button from "./Button.js";
|
|
11
|
-
|
|
12
10
|
/**
|
|
13
11
|
* A pull down menu that displays a hierarchy of checkboxes.
|
|
14
12
|
*
|
|
@@ -38,27 +36,21 @@ import Button from "./Button.js";
|
|
|
38
36
|
class HierarchicalCheckboxMenu extends Component {
|
|
39
37
|
static isParentSelected(parent, valueMap) {
|
|
40
38
|
var children = valueMap.get(parent);
|
|
41
|
-
|
|
42
39
|
if (children === undefined) {
|
|
43
40
|
return false;
|
|
44
41
|
}
|
|
45
|
-
|
|
46
42
|
if (typeof children === 'boolean') {
|
|
47
43
|
// This parent has no children
|
|
48
44
|
return children;
|
|
49
45
|
}
|
|
50
|
-
|
|
51
46
|
var includesTrue = Array.from(children.values()).includes(true);
|
|
52
47
|
var includesFalse = Array.from(children.values()).includes(false);
|
|
53
|
-
|
|
54
48
|
if (includesTrue && includesFalse) {
|
|
55
49
|
// Indeterminate
|
|
56
50
|
return null;
|
|
57
51
|
}
|
|
58
|
-
|
|
59
52
|
return includesTrue;
|
|
60
53
|
}
|
|
61
|
-
|
|
62
54
|
constructor(props) {
|
|
63
55
|
super(props);
|
|
64
56
|
this.toggleMenu = this.toggleMenu.bind(this);
|
|
@@ -69,7 +61,6 @@ class HierarchicalCheckboxMenu extends Component {
|
|
|
69
61
|
menuIsOpen: false
|
|
70
62
|
};
|
|
71
63
|
}
|
|
72
|
-
|
|
73
64
|
toggleMenu(event) {
|
|
74
65
|
event.stopPropagation();
|
|
75
66
|
event.preventDefault();
|
|
@@ -82,19 +73,17 @@ class HierarchicalCheckboxMenu extends Component {
|
|
|
82
73
|
};
|
|
83
74
|
});
|
|
84
75
|
}
|
|
85
|
-
|
|
86
76
|
toggleValueFor(parent, child) {
|
|
87
77
|
var {
|
|
88
78
|
valueMap,
|
|
89
79
|
onUpdateValueMap
|
|
90
|
-
} = this.props;
|
|
80
|
+
} = this.props;
|
|
91
81
|
|
|
82
|
+
// Make a deep copy of the Map and toggle the boolean for parent / child
|
|
92
83
|
var map = new Map(valueMap);
|
|
93
84
|
var children = map.get(parent);
|
|
94
|
-
|
|
95
85
|
if (children instanceof Map) {
|
|
96
86
|
var newChildren = new Map(children);
|
|
97
|
-
|
|
98
87
|
if (child != null) {
|
|
99
88
|
newChildren.set(child, children.get(child) === undefined);
|
|
100
89
|
} else {
|
|
@@ -102,18 +91,15 @@ class HierarchicalCheckboxMenu extends Component {
|
|
|
102
91
|
var newChildValue = parentSelected == null || !parentSelected;
|
|
103
92
|
children.forEach((_, key) => newChildren.set(key, newChildValue));
|
|
104
93
|
}
|
|
105
|
-
|
|
106
94
|
map.set(parent, newChildren);
|
|
107
95
|
} else {
|
|
108
96
|
map.set(parent, children == null || !children);
|
|
109
|
-
}
|
|
110
|
-
|
|
97
|
+
}
|
|
111
98
|
|
|
99
|
+
// The parent was clicked so all children must be toggled
|
|
112
100
|
var currentChildren = map.get(parent);
|
|
113
|
-
|
|
114
101
|
if (child === undefined && currentChildren !== undefined && typeof currentChildren !== 'boolean') {
|
|
115
102
|
var _parentSelected = HierarchicalCheckboxMenu.isParentSelected(parent, valueMap);
|
|
116
|
-
|
|
117
103
|
if (_parentSelected != null && _parentSelected) {
|
|
118
104
|
currentChildren.forEach((_, key) => currentChildren.set(key, false));
|
|
119
105
|
} else {
|
|
@@ -121,16 +107,15 @@ class HierarchicalCheckboxMenu extends Component {
|
|
|
121
107
|
currentChildren.forEach((_, key) => currentChildren.set(key, true));
|
|
122
108
|
}
|
|
123
109
|
}
|
|
124
|
-
|
|
125
110
|
onUpdateValueMap(map);
|
|
126
111
|
}
|
|
127
|
-
|
|
128
112
|
setAllValues(value) {
|
|
129
113
|
var {
|
|
130
114
|
valueMap,
|
|
131
115
|
onUpdateValueMap
|
|
132
|
-
} = this.props;
|
|
116
|
+
} = this.props;
|
|
133
117
|
|
|
118
|
+
// Make a deep copy of the Map and set everything
|
|
134
119
|
var copy = new Map();
|
|
135
120
|
valueMap.forEach((child, parent) => {
|
|
136
121
|
if (typeof child === 'boolean') {
|
|
@@ -143,15 +128,12 @@ class HierarchicalCheckboxMenu extends Component {
|
|
|
143
128
|
});
|
|
144
129
|
onUpdateValueMap(copy);
|
|
145
130
|
}
|
|
146
|
-
|
|
147
131
|
selectAll() {
|
|
148
132
|
this.setAllValues(true);
|
|
149
133
|
}
|
|
150
|
-
|
|
151
134
|
clear() {
|
|
152
135
|
this.setAllValues(false);
|
|
153
136
|
}
|
|
154
|
-
|
|
155
137
|
renderMenuElement() {
|
|
156
138
|
var {
|
|
157
139
|
valueMap,
|
|
@@ -186,7 +168,6 @@ class HierarchicalCheckboxMenu extends Component {
|
|
|
186
168
|
"data-testid": dataTestId !== undefined ? "".concat(dataTestId, "-btn-clear") : undefined
|
|
187
169
|
}, "Clear"));
|
|
188
170
|
}
|
|
189
|
-
|
|
190
171
|
render() {
|
|
191
172
|
var {
|
|
192
173
|
menuText,
|
|
@@ -224,15 +205,12 @@ class HierarchicalCheckboxMenu extends Component {
|
|
|
224
205
|
interactive: true
|
|
225
206
|
}, this.renderMenuElement()));
|
|
226
207
|
}
|
|
227
|
-
|
|
228
208
|
}
|
|
229
|
-
|
|
230
209
|
_defineProperty(HierarchicalCheckboxMenu, "defaultProps", {
|
|
231
210
|
className: '',
|
|
232
211
|
icon: null,
|
|
233
212
|
id: '',
|
|
234
213
|
'data-testid': undefined
|
|
235
214
|
});
|
|
236
|
-
|
|
237
215
|
export default HierarchicalCheckboxMenu;
|
|
238
216
|
//# sourceMappingURL=HierarchicalCheckboxMenu.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HierarchicalCheckboxMenu.js","names":["React","Component","FontAwesomeIcon","dhSort","classNames","Checkbox","Popper","Button","HierarchicalCheckboxMenu","isParentSelected","parent","valueMap","children","get","undefined","includesTrue","Array","from","values","includes","includesFalse","constructor","props","toggleMenu","bind","toggleValueFor","selectAll","clear","state","menuIsOpen","event","stopPropagation","preventDefault","setState","child","onUpdateValueMap","map","Map","newChildren","set","parentSelected","newChildValue","forEach","_","key","currentChildren","setAllValues","value","copy","renderMenuElement","dataTestId","entries","render","menuText","className","icon","id","placement"],"sources":["../src/HierarchicalCheckboxMenu.tsx"],"sourcesContent":["import React, { Component } from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { dhSort, IconDefinition } from '@deephaven/icons';\nimport classNames from 'classnames';\nimport Checkbox from './Checkbox';\nimport Popper from './popper/Popper';\nimport './HierarchicalCheckboxMenu.scss';\nimport Button from './Button';\n\nexport type HierarchicalCheckboxValueMap = Map<\n string,\n boolean | Map<string, boolean>\n>;\n\ntype HierarchicalCheckboxMenuProps = {\n className: string;\n menuText: string;\n valueMap: HierarchicalCheckboxValueMap;\n onUpdateValueMap(map: HierarchicalCheckboxValueMap): void;\n icon: IconDefinition | null;\n id: string;\n 'data-testid'?: string;\n};\n\ntype HierarchicalCheckboxMenuState = {\n menuIsOpen: boolean;\n};\n\n/**\n * A pull down menu that displays a hierarchy of checkboxes.\n *\n * Currently supports only two levels of check boxes. The input should be a Map\n * where the keys are the parent names. The values can a boolean if the parent\n * has no children or another Map where keys are child names and values are booleans.\n *\n * Here is an example:\n * const INITIAL_TYPE_MAP = new Map([\n * ['Queries', new Map([['Live', true], ['Batch', true]])],\n * [\n * 'DBA Queries',\n * new Map([\n * ['Data Merge', true],\n * ['Data Validation', true],\n * ['Imports', true],\n * ['Data Services', true],\n * ]),\n * ],\n * ['Helper Queries', true],\n * ]);\n *\n * When a checkbox is changed, this component will make a deep copy of the Map\n * with the appropriate booleans changed. It will then call onUpdateValueMap\n * with the new Map.\n */\nclass HierarchicalCheckboxMenu extends Component<\n HierarchicalCheckboxMenuProps,\n HierarchicalCheckboxMenuState\n> {\n static defaultProps: Partial<HierarchicalCheckboxMenuProps> = {\n className: '',\n icon: null,\n id: '',\n 'data-testid': undefined,\n };\n\n static isParentSelected(\n parent: string,\n valueMap: HierarchicalCheckboxValueMap\n ): boolean | null {\n const children = valueMap.get(parent);\n if (children === undefined) {\n return false;\n }\n if (typeof children === 'boolean') {\n // This parent has no children\n return children;\n }\n const includesTrue = Array.from(children.values()).includes(true);\n const includesFalse = Array.from(children.values()).includes(false);\n if (includesTrue && includesFalse) {\n // Indeterminate\n return null;\n }\n return includesTrue;\n }\n\n constructor(props: HierarchicalCheckboxMenuProps) {\n super(props);\n\n this.toggleMenu = this.toggleMenu.bind(this);\n this.toggleValueFor = this.toggleValueFor.bind(this);\n this.selectAll = this.selectAll.bind(this);\n this.clear = this.clear.bind(this);\n\n this.state = {\n menuIsOpen: false,\n };\n }\n\n toggleMenu(event: React.MouseEvent<HTMLButtonElement>): void {\n event.stopPropagation();\n event.preventDefault();\n this.setState(state => {\n const { menuIsOpen } = state;\n return { menuIsOpen: !menuIsOpen };\n });\n }\n\n toggleValueFor(parent: string, child?: string): void {\n const { valueMap, onUpdateValueMap } = this.props;\n\n // Make a deep copy of the Map and toggle the boolean for parent / child\n const map = new Map(valueMap);\n const children = map.get(parent);\n if (children instanceof Map) {\n const newChildren = new Map(children);\n if (child != null) {\n newChildren.set(child, children.get(child) === undefined);\n } else {\n const parentSelected = HierarchicalCheckboxMenu.isParentSelected(\n parent,\n map\n );\n const newChildValue = parentSelected == null || !parentSelected;\n children.forEach((_, key) => newChildren.set(key, newChildValue));\n }\n map.set(parent, newChildren);\n } else {\n map.set(parent, children == null || !children);\n }\n\n // The parent was clicked so all children must be toggled\n const currentChildren = map.get(parent);\n if (\n child === undefined &&\n currentChildren !== undefined &&\n typeof currentChildren !== 'boolean'\n ) {\n const parentSelected = HierarchicalCheckboxMenu.isParentSelected(\n parent,\n valueMap\n );\n if (parentSelected != null && parentSelected) {\n currentChildren.forEach((_, key) => currentChildren.set(key, false));\n } else {\n // for parent selection of false or null (indeterminate), select everything\n currentChildren.forEach((_, key) => currentChildren.set(key, true));\n }\n }\n\n onUpdateValueMap(map);\n }\n\n setAllValues(value: boolean): void {\n const { valueMap, onUpdateValueMap } = this.props;\n\n // Make a deep copy of the Map and set everything\n const copy = new Map();\n valueMap.forEach((child, parent) => {\n if (typeof child === 'boolean') {\n copy.set(parent, value);\n } else {\n const children = new Map();\n child.forEach((_, key) => children.set(key, value));\n copy.set(parent, children);\n }\n });\n\n onUpdateValueMap(copy);\n }\n\n selectAll(): void {\n this.setAllValues(true);\n }\n\n clear(): void {\n this.setAllValues(false);\n }\n\n renderMenuElement(): React.ReactNode {\n const { valueMap, 'data-testid': dataTestId } = this.props;\n return (\n <div className=\"hcm-menu-container\">\n {Array.from(valueMap.entries()).map(([parent, children]) => (\n <div key={parent}>\n <Checkbox\n className=\"hcm-parent\"\n checked={HierarchicalCheckboxMenu.isParentSelected(\n parent,\n valueMap\n )}\n onChange={() => this.toggleValueFor(parent)}\n >\n {parent}\n </Checkbox>\n {children !== undefined &&\n typeof children !== 'boolean' &&\n Array.from(children.entries()).map(([child, value]) => (\n <Checkbox\n className=\"hcm-child\"\n key={child}\n checked={value}\n onChange={() => this.toggleValueFor(parent, child)}\n >\n {child}\n </Checkbox>\n ))}\n </div>\n ))}\n <Button\n kind=\"ghost\"\n onClick={this.selectAll}\n data-testid={\n dataTestId !== undefined\n ? `${dataTestId}-btn-select-all`\n : undefined\n }\n >\n Select All\n </Button>\n <Button\n kind=\"ghost\"\n onClick={this.clear}\n data-testid={\n dataTestId !== undefined ? `${dataTestId}-btn-clear` : undefined\n }\n >\n Clear\n </Button>\n </div>\n );\n }\n\n render(): JSX.Element {\n const {\n menuText,\n className,\n icon,\n id,\n 'data-testid': dataTestId,\n } = this.props;\n const { menuIsOpen } = this.state;\n\n return (\n <button\n type=\"button\"\n className={classNames('btn hcm-btn', className)}\n onClick={this.toggleMenu}\n id={id}\n data-testid={dataTestId}\n >\n <span>\n {icon && <FontAwesomeIcon icon={icon} className=\"hcm-icon mr-1\" />}\n {menuText}\n </span>\n <FontAwesomeIcon icon={dhSort} className=\"hcm-icon ml-1\" />\n <Popper\n options={{ placement: 'bottom' }}\n isShown={menuIsOpen}\n onExited={() => {\n this.setState({ menuIsOpen: false });\n }}\n closeOnBlur\n interactive\n >\n {this.renderMenuElement()}\n </Popper>\n </button>\n );\n }\n}\n\nexport default HierarchicalCheckboxMenu;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"HierarchicalCheckboxMenu.js","names":["React","Component","FontAwesomeIcon","dhSort","classNames","Checkbox","Popper","Button","HierarchicalCheckboxMenu","isParentSelected","parent","valueMap","children","get","undefined","includesTrue","Array","from","values","includes","includesFalse","constructor","props","toggleMenu","bind","toggleValueFor","selectAll","clear","state","menuIsOpen","event","stopPropagation","preventDefault","setState","child","onUpdateValueMap","map","Map","newChildren","set","parentSelected","newChildValue","forEach","_","key","currentChildren","setAllValues","value","copy","renderMenuElement","dataTestId","entries","render","menuText","className","icon","id","placement"],"sources":["../src/HierarchicalCheckboxMenu.tsx"],"sourcesContent":["import React, { Component } from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { dhSort, IconDefinition } from '@deephaven/icons';\nimport classNames from 'classnames';\nimport Checkbox from './Checkbox';\nimport Popper from './popper/Popper';\nimport './HierarchicalCheckboxMenu.scss';\nimport Button from './Button';\n\nexport type HierarchicalCheckboxValueMap = Map<\n string,\n boolean | Map<string, boolean>\n>;\n\ntype HierarchicalCheckboxMenuProps = {\n className: string;\n menuText: string;\n valueMap: HierarchicalCheckboxValueMap;\n onUpdateValueMap(map: HierarchicalCheckboxValueMap): void;\n icon: IconDefinition | null;\n id: string;\n 'data-testid'?: string;\n};\n\ntype HierarchicalCheckboxMenuState = {\n menuIsOpen: boolean;\n};\n\n/**\n * A pull down menu that displays a hierarchy of checkboxes.\n *\n * Currently supports only two levels of check boxes. The input should be a Map\n * where the keys are the parent names. The values can a boolean if the parent\n * has no children or another Map where keys are child names and values are booleans.\n *\n * Here is an example:\n * const INITIAL_TYPE_MAP = new Map([\n * ['Queries', new Map([['Live', true], ['Batch', true]])],\n * [\n * 'DBA Queries',\n * new Map([\n * ['Data Merge', true],\n * ['Data Validation', true],\n * ['Imports', true],\n * ['Data Services', true],\n * ]),\n * ],\n * ['Helper Queries', true],\n * ]);\n *\n * When a checkbox is changed, this component will make a deep copy of the Map\n * with the appropriate booleans changed. It will then call onUpdateValueMap\n * with the new Map.\n */\nclass HierarchicalCheckboxMenu extends Component<\n HierarchicalCheckboxMenuProps,\n HierarchicalCheckboxMenuState\n> {\n static defaultProps: Partial<HierarchicalCheckboxMenuProps> = {\n className: '',\n icon: null,\n id: '',\n 'data-testid': undefined,\n };\n\n static isParentSelected(\n parent: string,\n valueMap: HierarchicalCheckboxValueMap\n ): boolean | null {\n const children = valueMap.get(parent);\n if (children === undefined) {\n return false;\n }\n if (typeof children === 'boolean') {\n // This parent has no children\n return children;\n }\n const includesTrue = Array.from(children.values()).includes(true);\n const includesFalse = Array.from(children.values()).includes(false);\n if (includesTrue && includesFalse) {\n // Indeterminate\n return null;\n }\n return includesTrue;\n }\n\n constructor(props: HierarchicalCheckboxMenuProps) {\n super(props);\n\n this.toggleMenu = this.toggleMenu.bind(this);\n this.toggleValueFor = this.toggleValueFor.bind(this);\n this.selectAll = this.selectAll.bind(this);\n this.clear = this.clear.bind(this);\n\n this.state = {\n menuIsOpen: false,\n };\n }\n\n toggleMenu(event: React.MouseEvent<HTMLButtonElement>): void {\n event.stopPropagation();\n event.preventDefault();\n this.setState(state => {\n const { menuIsOpen } = state;\n return { menuIsOpen: !menuIsOpen };\n });\n }\n\n toggleValueFor(parent: string, child?: string): void {\n const { valueMap, onUpdateValueMap } = this.props;\n\n // Make a deep copy of the Map and toggle the boolean for parent / child\n const map = new Map(valueMap);\n const children = map.get(parent);\n if (children instanceof Map) {\n const newChildren = new Map(children);\n if (child != null) {\n newChildren.set(child, children.get(child) === undefined);\n } else {\n const parentSelected = HierarchicalCheckboxMenu.isParentSelected(\n parent,\n map\n );\n const newChildValue = parentSelected == null || !parentSelected;\n children.forEach((_, key) => newChildren.set(key, newChildValue));\n }\n map.set(parent, newChildren);\n } else {\n map.set(parent, children == null || !children);\n }\n\n // The parent was clicked so all children must be toggled\n const currentChildren = map.get(parent);\n if (\n child === undefined &&\n currentChildren !== undefined &&\n typeof currentChildren !== 'boolean'\n ) {\n const parentSelected = HierarchicalCheckboxMenu.isParentSelected(\n parent,\n valueMap\n );\n if (parentSelected != null && parentSelected) {\n currentChildren.forEach((_, key) => currentChildren.set(key, false));\n } else {\n // for parent selection of false or null (indeterminate), select everything\n currentChildren.forEach((_, key) => currentChildren.set(key, true));\n }\n }\n\n onUpdateValueMap(map);\n }\n\n setAllValues(value: boolean): void {\n const { valueMap, onUpdateValueMap } = this.props;\n\n // Make a deep copy of the Map and set everything\n const copy = new Map();\n valueMap.forEach((child, parent) => {\n if (typeof child === 'boolean') {\n copy.set(parent, value);\n } else {\n const children = new Map();\n child.forEach((_, key) => children.set(key, value));\n copy.set(parent, children);\n }\n });\n\n onUpdateValueMap(copy);\n }\n\n selectAll(): void {\n this.setAllValues(true);\n }\n\n clear(): void {\n this.setAllValues(false);\n }\n\n renderMenuElement(): React.ReactNode {\n const { valueMap, 'data-testid': dataTestId } = this.props;\n return (\n <div className=\"hcm-menu-container\">\n {Array.from(valueMap.entries()).map(([parent, children]) => (\n <div key={parent}>\n <Checkbox\n className=\"hcm-parent\"\n checked={HierarchicalCheckboxMenu.isParentSelected(\n parent,\n valueMap\n )}\n onChange={() => this.toggleValueFor(parent)}\n >\n {parent}\n </Checkbox>\n {children !== undefined &&\n typeof children !== 'boolean' &&\n Array.from(children.entries()).map(([child, value]) => (\n <Checkbox\n className=\"hcm-child\"\n key={child}\n checked={value}\n onChange={() => this.toggleValueFor(parent, child)}\n >\n {child}\n </Checkbox>\n ))}\n </div>\n ))}\n <Button\n kind=\"ghost\"\n onClick={this.selectAll}\n data-testid={\n dataTestId !== undefined\n ? `${dataTestId}-btn-select-all`\n : undefined\n }\n >\n Select All\n </Button>\n <Button\n kind=\"ghost\"\n onClick={this.clear}\n data-testid={\n dataTestId !== undefined ? `${dataTestId}-btn-clear` : undefined\n }\n >\n Clear\n </Button>\n </div>\n );\n }\n\n render(): JSX.Element {\n const {\n menuText,\n className,\n icon,\n id,\n 'data-testid': dataTestId,\n } = this.props;\n const { menuIsOpen } = this.state;\n\n return (\n <button\n type=\"button\"\n className={classNames('btn hcm-btn', className)}\n onClick={this.toggleMenu}\n id={id}\n data-testid={dataTestId}\n >\n <span>\n {icon && <FontAwesomeIcon icon={icon} className=\"hcm-icon mr-1\" />}\n {menuText}\n </span>\n <FontAwesomeIcon icon={dhSort} className=\"hcm-icon ml-1\" />\n <Popper\n options={{ placement: 'bottom' }}\n isShown={menuIsOpen}\n onExited={() => {\n this.setState({ menuIsOpen: false });\n }}\n closeOnBlur\n interactive\n >\n {this.renderMenuElement()}\n </Popper>\n </button>\n );\n }\n}\n\nexport default HierarchicalCheckboxMenu;\n"],"mappings":"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"}
|
package/dist/ItemList.d.ts
CHANGED
|
@@ -8,16 +8,16 @@ export interface DefaultListItem {
|
|
|
8
8
|
value?: string;
|
|
9
9
|
displayValue?: string;
|
|
10
10
|
}
|
|
11
|
-
export
|
|
11
|
+
export type RenderItemProps<T> = {
|
|
12
12
|
item: T;
|
|
13
13
|
itemIndex: number;
|
|
14
14
|
isFocused: boolean;
|
|
15
15
|
isSelected: boolean;
|
|
16
16
|
style: React.CSSProperties;
|
|
17
17
|
};
|
|
18
|
-
export
|
|
19
|
-
export
|
|
20
|
-
export
|
|
18
|
+
export type RenderItemFn<T> = (props: RenderItemProps<T>) => React.ReactNode;
|
|
19
|
+
export type ItemDragEventHandler = (index: number, event: React.DragEvent<HTMLDivElement>) => void;
|
|
20
|
+
export type ItemListProps<T> = {
|
|
21
21
|
itemCount: number;
|
|
22
22
|
rowHeight: number;
|
|
23
23
|
offset: number;
|
|
@@ -38,7 +38,7 @@ export declare type ItemListProps<T> = {
|
|
|
38
38
|
focusSelector: string;
|
|
39
39
|
'data-testid'?: string;
|
|
40
40
|
};
|
|
41
|
-
|
|
41
|
+
type ItemListState = {
|
|
42
42
|
focusIndex: number | null;
|
|
43
43
|
mouseDownIndex: number | null;
|
|
44
44
|
selectedRanges: Range[];
|
package/dist/ItemList.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ItemList.d.ts","sourceRoot":"","sources":["../src/ItemList.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ItemList.d.ts","sourceRoot":"","sources":["../src/ItemList.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAC7C,OAAO,OAAO,MAAM,UAAU,CAAC;AAC/B,OAAO,EACL,aAAa,IAAI,IAAI,EACrB,wBAAwB,EACxB,iBAAiB,EAClB,MAAM,cAAc,CAAC;AACtB,OAAkB,EAAE,IAAI,EAAE,MAAM,8BAA8B,CAAC;AAE/D,OAAO,EAAc,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAGrD,OAAO,iBAAiB,CAAC;AAIzB,MAAM,WAAW,eAAe;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,MAAM,MAAM,eAAe,CAAC,CAAC,IAAI;IAC/B,IAAI,EAAE,CAAC,CAAC;IACR,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,OAAO,CAAC;IACpB,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC;CAC5B,CAAC;AAEF,MAAM,MAAM,YAAY,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,eAAe,CAAC,CAAC,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;AAE7E,MAAM,MAAM,oBAAoB,GAAG,CACjC,KAAK,EAAE,MAAM,EACb,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,KACnC,IAAI,CAAC;AAEV,MAAM,MAAM,aAAa,CAAC,CAAC,IAAI;IAE7B,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;IAElB,MAAM,EAAE,MAAM,CAAC;IAKf,KAAK,EAAE,CAAC,EAAE,CAAC;IAEX,iBAAiB,EAAE,OAAO,CAAC;IAE3B,mBAAmB,EAAE,OAAO,CAAC;IAE7B,YAAY,EAAE,OAAO,CAAC;IAEtB,aAAa,EAAE,OAAO,CAAC;IAEvB,cAAc,EAAE,OAAO,CAAC;IAExB,aAAa,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,CAAC;IAG1C,QAAQ,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,CAAC,cAAc,GAAG,IAAI,CAAC;IAC3D,iBAAiB,CAAC,MAAM,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC;IACzC,gBAAgB,CAAC,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1D,aAAa,EAAE,MAAM,CAAC;IACtB,cAAc,EAAE,KAAK,EAAE,CAAC;IACxB,aAAa,EAAE,OAAO,CAAC;IACvB,UAAU,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC;IAC5B,aAAa,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF,KAAK,aAAa,GAAG;IACnB,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,cAAc,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9B,cAAc,EAAE,KAAK,EAAE,CAAC;IACxB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,UAAU,EAAE,OAAO,CAAC;IACpB,eAAe,EAAE,OAAO,CAAC;IACzB,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;CAC7B,CAAC;AAEF;;;GAGG;AACH,qBAAa,QAAQ,CAAC,CAAC,CAAE,SAAQ,aAAa,CAC5C,aAAa,CAAC,CAAC,CAAC,EAChB,aAAa,CACd;IACC,MAAM,CAAC,UAAU,SAAQ;IAEzB,MAAM,CAAC,kBAAkB,SAAM;IAG/B,MAAM,CAAC,gBAAgB,SAAM;IAE7B,MAAM,CAAC,YAAY;;;;;;;;;;yBAiBA,IAAI;oBAGT,IAAI;6BAGK,IAAI;4BAGL,IAAI;;;;;;MAYxB;IAEF,MAAM,CAAC,UAAU,CAAC,CAAC,SAAS,eAAe,EAAE,EAC3C,IAAI,GACL,EAAE,eAAe,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,OAAO;gBAQvB,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC;IAmCnC,kBAAkB,CAChB,SAAS,EAAE,aAAa,CAAC,CAAC,CAAC,EAC3B,SAAS,EAAE,aAAa,GACvB,IAAI;IAoCP,oBAAoB,IAAI,IAAI;IAI5B,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC;IAE5B,aAAa,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAE/C,eAAe,WACL,MAAM,kBAAkB,KAAK,EAAE,yCAA/B,MAAM,kBAAkB,KAAK,EAAE,cAGvC;IAEF,aAAa,eAEE,MAAM,OACZ,MAAM,QACL,CAAC,aACI,OAAO,cACN,OAAO,cACP,aAAa,CAAC,CAAC,SACpB,MAAM,aAAa,iBACX,OAAO,iDAPX,MAAM,OACZ,MAAM,QACL,CAAC,aACI,OAAO,cACN,OAAO,cACP,aAAa,CAAC,CAAC,SACpB,MAAM,aAAa,iBACX,OAAO,kBA+BxB;IAEF,eAAe,eAAuB,MAAM,oBAAoB,0GAA1B,MAAM,oBAAoB,2EAc7D;IAEH,eAAe,8KAWZ;IAEH,WAAW,WACD,CAAC,EAAE,kBAAkB,KAAK,EAAE,cAAc,aAAa,CAAC,CAAC;;;;kCAAzD,CAAC,EAAE,kBAAkB,KAAK,EAAE,cAAc,aAAa,CAAC,CAAC;;;;OAKjE;IAEF,KAAK,IAAI,IAAI;IAIb,qBAAqB,IAAI,IAAI;IAS7B,UAAU,CAAC,SAAS,EAAE,MAAM,GAAG,OAAO,GAAG,IAAI;IAY7C,SAAS,CAAC,SAAS,EAAE,MAAM,GAAG,IAAI;IAYlC,YAAY,CAAC,SAAS,EAAE,MAAM,GAAG,IAAI;IAOrC,qBAAqB,CACnB,SAAS,EAAE,MAAM,EACjB,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,cAAc,CAAC,GAClC,IAAI;IAWP,qBAAqB,CAAC,SAAS,EAAE,MAAM,EAAE,CAAC,EAAE,KAAK,CAAC,UAAU,GAAG,IAAI;IAkBnE,mBAAmB,CAAC,KAAK,EAAE,MAAM,EAAE,CAAC,EAAE,KAAK,CAAC,UAAU,GAAG,IAAI;IA+B7D,cAAc,CAAC,SAAS,EAAE,MAAM,EAAE,CAAC,EAAE,KAAK,CAAC,UAAU,GAAG,IAAI;IAa5D,eAAe,CAAC,SAAS,EAAE,MAAM,EAAE,CAAC,EAAE,KAAK,CAAC,UAAU,GAAG,IAAI;IAW7D,mBAAmB,CAAC,SAAS,EAAE,MAAM,EAAE,CAAC,EAAE,KAAK,CAAC,UAAU,GAAG,IAAI;IAmCjE,iBAAiB,CAAC,KAAK,EAAE,MAAM,EAAE,CAAC,EAAE,KAAK,CAAC,UAAU,GAAG,IAAI;IA2B3D,mBAAmB,CAAC,EAAE,kBAAkB,EAAE,EAAE,wBAAwB,GAAG,IAAI;IAI3E,YAAY,CAAC,EAAE,MAAM,EAAE,EAAE,IAAI,GAAG,IAAI;IAIpC,gBAAgB,IAAI,IAAI;IAIxB,mBAAmB,IAAI,IAAI;IAK3B,aAAa,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,GAAG,IAAI;IA0D3C,YAAY,CAAC,EACX,wBAAwB,EACxB,YAAY,GACb,EAAE,iBAAiB,GAAG,IAAI;IAiB3B,eAAe,IAAI,IAAI;IAIvB,cAAc,IAAI,IAAI;IAOtB,cAAc,CAAC,SAAS,EAAE,MAAM,GAAG,IAAI;IAMvC;;;;;OAKG;IACH,YAAY,CACV,KAAK,EAAE,MAAM,EACb,WAAW,EAAE,OAAO,EACpB,cAAc,EAAE,OAAO,EACvB,cAAc,UAAO,GACpB,IAAI;IAiCP,WAAW,IAAI,IAAI;IAKnB,YAAY,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAIjC,aAAa,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI;IAQjC,UAAU,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAO/B,WAAW,CAAC,KAAK,EAAE,KAAK,GAAG,IAAI;IAQ/B,iBAAiB,CAAC,cAAc,EAAE,KAAK,EAAE,GAAG,IAAI;IAIhD,kBAAkB,IAAI,IAAI;IAU1B,cAAc,CACZ,EACE,YAAY,EACZ,MAAM,GACP,GAAE,IAAI,CAAC,aAAa,EAAE,cAAc,GAAG,QAAQ,CAAc,GAC7D,OAAO;IASV,kBAAkB,CAAC,EACjB,KAAK,EAAE,SAAS,EAChB,KAAK,GACN,EAAE;QACD,KAAK,EAAE,MAAM,CAAC;QACd,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC;KAC5B,GAAG,KAAK,CAAC,YAAY,GAAG,IAAI;IAoB7B,MAAM,IAAI,GAAG,CAAC,OAAO;CAuCtB;AAED,eAAe,QAAQ,CAAC"}
|