@deephaven/components 0.48.0 → 0.48.1-beta.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/AutoResizeTextarea.js.map +1 -1
- package/dist/BasicModal.d.ts.map +1 -1
- package/dist/BasicModal.js.map +1 -1
- package/dist/BulkActionBar.d.ts.map +1 -1
- package/dist/BulkActionBar.js.map +1 -1
- package/dist/CardFlip.d.ts.map +1 -1
- package/dist/CardFlip.js.map +1 -1
- package/dist/MaskedInput.d.ts.map +1 -1
- package/dist/MaskedInput.js.map +1 -1
- package/dist/RandomAreaPlotAnimation.d.ts.map +1 -1
- package/dist/RandomAreaPlotAnimation.js.map +1 -1
- package/dist/SearchableCombobox.d.ts.map +1 -1
- package/dist/SearchableCombobox.js.map +1 -1
- package/dist/TableViewEmptyState.d.ts.map +1 -1
- package/dist/TableViewEmptyState.js.map +1 -1
- package/dist/TextWithTooltip.d.ts.map +1 -1
- package/dist/TextWithTooltip.js.map +1 -1
- package/dist/TimeInput.js.map +1 -1
- package/dist/TimeSlider.js.map +1 -1
- package/dist/actions/ConfirmActionButton.d.ts.map +1 -1
- package/dist/actions/ConfirmActionButton.js.map +1 -1
- package/dist/actions/IconActionButton.d.ts.map +1 -1
- package/dist/actions/IconActionButton.js.map +1 -1
- package/dist/context-actions/ContextMenuItem.js.map +1 -1
- package/dist/dialogs/ConfirmationDialog.d.ts.map +1 -1
- package/dist/dialogs/ConfirmationDialog.js.map +1 -1
- package/dist/modal/DebouncedModal.d.ts.map +1 -1
- package/dist/modal/DebouncedModal.js.map +1 -1
- package/dist/modal/Modal.js.map +1 -1
- package/package.json +7 -7
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AutoResizeTextarea.js","names":["React","useState","useRef","useEffect","PropTypes","classNames","AutoResizeTextarea","className","value","propsValue","onChange","spellCheck","placeholder","disabled","delimiter","id","dataTestId","setValue","isPastedChange","setIsPastedChange","element","syncStateWithProp","explode","input","trim","split","filter","string","join","implode","map","reCalculateLayout","current","style","height","resizedHeight","scrollHeight","offsetHeight","clientHeight","handleChange","event","newValue","target","handleFocus","scrollLeft","handleMouseDown","document","activeElement","focus","handleBlur","handlePaste","reCalculate","propTypes","isRequired","func","bool","defaultProps","undefined"],"sources":["../src/AutoResizeTextarea.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect } from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\n\nimport './AutoResizeTextarea.scss';\n\ninterface AutoResizeTextareaProps {\n value: string;\n onChange: (val: string) => void;\n className?: string;\n spellCheck?: boolean;\n placeholder?: string;\n disabled?: boolean;\n delimiter?: string;\n id?: string;\n 'data-testid'?: string;\n}\n\n/**\n * Makes a textarea that auto resizes based on contents, its height grows with new lines.\n * If a delimeter is set, such as \" -\" or \" \", as used by jvm args or env vars\n * then the field will also \"explode\" the value by the delimiter over new lines\n * on focus, and implode on blur. By default, it doesn't word wrap.\n */\nfunction AutoResizeTextarea({\n className = '',\n value: propsValue,\n onChange,\n spellCheck = false,\n placeholder = '',\n disabled = false,\n delimiter = '',\n id = '',\n 'data-testid': dataTestId,\n}: AutoResizeTextareaProps): JSX.Element {\n const [value, setValue] = useState(propsValue);\n const [isPastedChange, setIsPastedChange] = useState(false);\n const element = useRef<HTMLTextAreaElement>(null);\n\n useEffect(\n function syncStateWithProp() {\n // keep state value in sync with prop changes\n setValue(propsValue);\n },\n [propsValue]\n );\n\n function explode(input: string) {\n // split by delimiter, commonly \" \" or \" -\"\n // strip empty strings (if delimiter is space, and there are multiple spaces in a row)\n // and join with new line and a trimmed delimeter (get rid of leading spaces)\n return input\n .trim()\n .split(delimiter)\n .filter(string => string) // remove empty strings\n .join(`\\n${delimiter.trim()}`);\n }\n\n function implode(input: string) {\n return input\n .split('\\n')\n .map(string => string.trim())\n .join(' ');\n }\n\n function reCalculateLayout() {\n if (!element.current) {\n return;\n }\n element.current.style.height = '0'; // shrink component to get scrollHeight\n const resizedHeight =\n element.current.scrollHeight +\n (element.current.offsetHeight - element.current.clientHeight);\n // accounts for border, padding is captured by scroll height\n if (resizedHeight > 0) element.current.style.height = `${resizedHeight}px`;\n }\n\n function handleChange(event: React.ChangeEvent<HTMLTextAreaElement>) {\n let newValue = event.target.value;\n if (isPastedChange) {\n if (delimiter) newValue = explode(newValue);\n setIsPastedChange(false);\n }\n setValue(newValue);\n onChange(newValue);\n }\n\n function handleFocus() {\n if (!element.current) {\n return;\n }\n if (delimiter) {\n setValue(explode(value));\n reCalculateLayout();\n }\n element.current.scrollLeft = 0;\n // scroll left as it can be disorienting if you click on a long line\n }\n\n // make it explode when dragging the resize handle\n // by making it trigger focus (which normally doesn't\n // trigger when just resizing).\n function handleMouseDown() {\n if (!element.current) return;\n if (document.activeElement === element.current) return;\n element.current.focus();\n }\n\n function handleBlur() {\n if (delimiter) {\n setValue(implode(value));\n onChange(implode(value));\n }\n }\n\n function handlePaste() {\n setIsPastedChange(true);\n }\n\n useEffect(\n function reCalculate() {\n reCalculateLayout();\n },\n [value]\n );\n\n return (\n <textarea\n ref={element}\n id={id}\n className={classNames(className, 'auto-resize-textarea form-control')}\n placeholder={placeholder}\n value={value}\n rows={1}\n onChange={handleChange}\n onFocus={handleFocus}\n onMouseDown={handleMouseDown}\n onBlur={handleBlur}\n onPaste={handlePaste}\n spellCheck={spellCheck}\n disabled={disabled}\n data-testid={dataTestId}\n />\n );\n}\n\nAutoResizeTextarea.propTypes = {\n value: PropTypes.string.isRequired,\n onChange: PropTypes.func.isRequired,\n className: PropTypes.string,\n placeholder: PropTypes.string,\n spellCheck: PropTypes.bool,\n disabled: PropTypes.bool,\n delimiter: PropTypes.string,\n id: PropTypes.string,\n 'data-testid': PropTypes.string,\n};\n\nAutoResizeTextarea.defaultProps = {\n className: '',\n id: '',\n placeholder: '',\n disabled: false,\n spellCheck: false,\n delimiter: '',\n 'data-testid': undefined,\n};\n\nexport default AutoResizeTextarea;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,QAAQ,EAAEC,MAAM,EAAEC,SAAS,QAAQ,OAAO;AAC1D,OAAOC,SAAS,MAAM,YAAY;AAClC,OAAOC,UAAU,MAAM,YAAY;AAAC;AAAA;AAgBpC;AACA;AACA;AACA;AACA;AACA;AACA,SAASC,kBAAkB,OAUc;EAAA,IAVb;IAC1BC,SAAS,GAAG,EAAE;IACdC,KAAK,EAAEC,UAAU;IACjBC,QAAQ;IACRC,UAAU,GAAG,KAAK;IAClBC,WAAW,GAAG,EAAE;IAChBC,QAAQ,GAAG,KAAK;IAChBC,SAAS,GAAG,EAAE;IACdC,EAAE,GAAG,EAAE;IACP,aAAa,EAAEC;EACQ,CAAC;EACxB,IAAM,CAACR,KAAK,EAAES,QAAQ,CAAC,GAAGhB,QAAQ,CAACQ,UAAU,CAAC;EAC9C,IAAM,CAACS,cAAc,EAAEC,iBAAiB,CAAC,GAAGlB,QAAQ,CAAC,KAAK,CAAC;EAC3D,IAAMmB,OAAO,GAAGlB,MAAM,CAAsB,IAAI,CAAC;EAEjDC,SAAS,CACP,SAASkB,iBAAiB,GAAG;IAC3B;IACAJ,QAAQ,CAACR,UAAU,CAAC;EACtB,CAAC,EACD,CAACA,UAAU,CAAC,CACb;EAED,SAASa,OAAO,CAACC,KAAa,
|
|
1
|
+
{"version":3,"file":"AutoResizeTextarea.js","names":["React","useState","useRef","useEffect","PropTypes","classNames","AutoResizeTextarea","className","value","propsValue","onChange","spellCheck","placeholder","disabled","delimiter","id","dataTestId","setValue","isPastedChange","setIsPastedChange","element","syncStateWithProp","explode","input","trim","split","filter","string","join","implode","map","reCalculateLayout","current","style","height","resizedHeight","scrollHeight","offsetHeight","clientHeight","handleChange","event","newValue","target","handleFocus","scrollLeft","handleMouseDown","document","activeElement","focus","handleBlur","handlePaste","reCalculate","propTypes","isRequired","func","bool","defaultProps","undefined"],"sources":["../src/AutoResizeTextarea.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect } from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\n\nimport './AutoResizeTextarea.scss';\n\ninterface AutoResizeTextareaProps {\n value: string;\n onChange: (val: string) => void;\n className?: string;\n spellCheck?: boolean;\n placeholder?: string;\n disabled?: boolean;\n delimiter?: string;\n id?: string;\n 'data-testid'?: string;\n}\n\n/**\n * Makes a textarea that auto resizes based on contents, its height grows with new lines.\n * If a delimeter is set, such as \" -\" or \" \", as used by jvm args or env vars\n * then the field will also \"explode\" the value by the delimiter over new lines\n * on focus, and implode on blur. By default, it doesn't word wrap.\n */\nfunction AutoResizeTextarea({\n className = '',\n value: propsValue,\n onChange,\n spellCheck = false,\n placeholder = '',\n disabled = false,\n delimiter = '',\n id = '',\n 'data-testid': dataTestId,\n}: AutoResizeTextareaProps): JSX.Element {\n const [value, setValue] = useState(propsValue);\n const [isPastedChange, setIsPastedChange] = useState(false);\n const element = useRef<HTMLTextAreaElement>(null);\n\n useEffect(\n function syncStateWithProp() {\n // keep state value in sync with prop changes\n setValue(propsValue);\n },\n [propsValue]\n );\n\n function explode(input: string): string {\n // split by delimiter, commonly \" \" or \" -\"\n // strip empty strings (if delimiter is space, and there are multiple spaces in a row)\n // and join with new line and a trimmed delimeter (get rid of leading spaces)\n return input\n .trim()\n .split(delimiter)\n .filter(string => string) // remove empty strings\n .join(`\\n${delimiter.trim()}`);\n }\n\n function implode(input: string): string {\n return input\n .split('\\n')\n .map(string => string.trim())\n .join(' ');\n }\n\n function reCalculateLayout(): void {\n if (!element.current) {\n return;\n }\n element.current.style.height = '0'; // shrink component to get scrollHeight\n const resizedHeight =\n element.current.scrollHeight +\n (element.current.offsetHeight - element.current.clientHeight);\n // accounts for border, padding is captured by scroll height\n if (resizedHeight > 0) element.current.style.height = `${resizedHeight}px`;\n }\n\n function handleChange(event: React.ChangeEvent<HTMLTextAreaElement>): void {\n let newValue = event.target.value;\n if (isPastedChange) {\n if (delimiter) newValue = explode(newValue);\n setIsPastedChange(false);\n }\n setValue(newValue);\n onChange(newValue);\n }\n\n function handleFocus(): void {\n if (!element.current) {\n return;\n }\n if (delimiter) {\n setValue(explode(value));\n reCalculateLayout();\n }\n element.current.scrollLeft = 0;\n // scroll left as it can be disorienting if you click on a long line\n }\n\n // make it explode when dragging the resize handle\n // by making it trigger focus (which normally doesn't\n // trigger when just resizing).\n function handleMouseDown(): void {\n if (!element.current) return;\n if (document.activeElement === element.current) return;\n element.current.focus();\n }\n\n function handleBlur(): void {\n if (delimiter) {\n setValue(implode(value));\n onChange(implode(value));\n }\n }\n\n function handlePaste(): void {\n setIsPastedChange(true);\n }\n\n useEffect(\n function reCalculate() {\n reCalculateLayout();\n },\n [value]\n );\n\n return (\n <textarea\n ref={element}\n id={id}\n className={classNames(className, 'auto-resize-textarea form-control')}\n placeholder={placeholder}\n value={value}\n rows={1}\n onChange={handleChange}\n onFocus={handleFocus}\n onMouseDown={handleMouseDown}\n onBlur={handleBlur}\n onPaste={handlePaste}\n spellCheck={spellCheck}\n disabled={disabled}\n data-testid={dataTestId}\n />\n );\n}\n\nAutoResizeTextarea.propTypes = {\n value: PropTypes.string.isRequired,\n onChange: PropTypes.func.isRequired,\n className: PropTypes.string,\n placeholder: PropTypes.string,\n spellCheck: PropTypes.bool,\n disabled: PropTypes.bool,\n delimiter: PropTypes.string,\n id: PropTypes.string,\n 'data-testid': PropTypes.string,\n};\n\nAutoResizeTextarea.defaultProps = {\n className: '',\n id: '',\n placeholder: '',\n disabled: false,\n spellCheck: false,\n delimiter: '',\n 'data-testid': undefined,\n};\n\nexport default AutoResizeTextarea;\n"],"mappings":"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"}
|
package/dist/BasicModal.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BasicModal.d.ts","sourceRoot":"","sources":["../src/BasicModal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AACnD,OAAO,SAAS,MAAM,YAAY,CAAC;AAKnC,MAAM,WAAW,eAAe;IAC9B,MAAM,EAAE,OAAO,CAAC;IAChB,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,GAAG,CAAC,MAAM,MAAM,CAAC,CAAC;IAClC,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;;;;;;;;;;;GAYG;AACH,iBAAS,UAAU,CAAC,KAAK,EAAE,eAAe,
|
|
1
|
+
{"version":3,"file":"BasicModal.d.ts","sourceRoot":"","sources":["../src/BasicModal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AACnD,OAAO,SAAS,MAAM,YAAY,CAAC;AAKnC,MAAM,WAAW,eAAe;IAC9B,MAAM,EAAE,OAAO,CAAC;IAChB,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,GAAG,CAAC,MAAM,MAAM,CAAC,CAAC;IAClC,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;;;;;;;;;;;GAYG;AACH,iBAAS,UAAU,CAAC,KAAK,EAAE,eAAe,GAAG,GAAG,CAAC,OAAO,CA6GvD;kBA7GQ,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;AAyInB,eAAe,UAAU,CAAC"}
|
package/dist/BasicModal.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BasicModal.js","names":["React","useRef","useCallback","PropTypes","ButtonGroup","Button","Modal","ModalBody","ModalFooter","ModalHeader","BasicModal","props","isOpen","headerText","bodyText","onCancel","onConfirm","onDiscard","onModalDisable","cancelButtonText","confirmButtonText","discardButtonText","isConfirmDanger","children","dataTestId","confirmButton","disableModalCheckbox","onConfirmClicked","current","checked","onOpened","focus","modalBody","undefined","propTypes","bool","isRequired","string","oneOfType","func","node","defaultProps"],"sources":["../src/BasicModal.tsx"],"sourcesContent":["import React, { useRef, useCallback } from 'react';\nimport PropTypes from 'prop-types';\nimport ButtonGroup from './ButtonGroup';\nimport Button from './Button';\nimport { Modal, ModalBody, ModalFooter, ModalHeader } from './modal';\n\nexport interface BasicModalProps {\n isOpen: boolean;\n headerText: string;\n bodyText: string | (() => string);\n onCancel?: () => void;\n onConfirm: () => void;\n onDiscard?: () => void;\n onModalDisable?: () => void;\n cancelButtonText?: string;\n confirmButtonText?: string;\n discardButtonText?: string;\n isConfirmDanger?: boolean;\n children?: React.ReactNode;\n 'data-testid'?: string;\n}\n\n/**\n * A basic modal dialog with two buttons: cancel / confirm.\n *\n * @param isOpen indicates if the modal dialog is open\n * @param headerText text displayed in the modal header\n * @param bodyText text displayed in the modal body\n * @param onCancel callback for the cancel button; if not provided, button not shown\n * @param onConfirm callback for the confirm button\n * @param onDiscard callback for the discard button; if not provided, button not shown\n * @param cancelButtonText optional text for the cancel button, defaults to 'Cancel'\n * @param confirmButtonText optional text for the confirm button, defaults to 'Okay'\n * @param discardButtonText optional text for the discard button, defaults to 'Discard'\n */\nfunction BasicModal(props: BasicModalProps) {\n const {\n isOpen,\n headerText,\n bodyText,\n onCancel,\n onConfirm,\n onDiscard,\n onModalDisable,\n cancelButtonText = 'Cancel',\n confirmButtonText = 'Okay',\n discardButtonText = 'Discard',\n isConfirmDanger = false,\n children,\n 'data-testid': dataTestId,\n } = props;\n\n const confirmButton = useRef<HTMLButtonElement>(null);\n\n const disableModalCheckbox = useRef<HTMLInputElement>(null);\n\n const onConfirmClicked = useCallback(() => {\n if (\n disableModalCheckbox.current !== null &&\n disableModalCheckbox.current.checked &&\n onModalDisable\n ) {\n onModalDisable();\n }\n onConfirm();\n }, [onConfirm, onModalDisable]);\n\n const onOpened = useCallback(() => {\n confirmButton.current?.focus();\n }, []);\n\n let modalBody = '';\n if (isOpen) {\n modalBody = typeof bodyText === 'function' ? bodyText() : bodyText;\n }\n\n return (\n <Modal isOpen={isOpen} className=\"theme-bg-light\" onOpened={onOpened}>\n <ModalHeader closeButton={false}>{headerText}</ModalHeader>\n <ModalBody>{modalBody}</ModalBody>\n <ModalFooter>\n {onModalDisable && (\n <div className=\"custom-control custom-checkbox form-group mr-auto\">\n <input\n type=\"checkbox\"\n className=\"custom-control-input\"\n id=\"move-confirmation-checkbox\"\n defaultChecked={false}\n ref={disableModalCheckbox}\n data-testid={\n dataTestId !== undefined\n ? `${dataTestId}-checkbox-confirm`\n : undefined\n }\n />\n <label\n className=\"custom-control-label\"\n htmlFor=\"move-confirmation-checkbox\"\n >\n Don't ask me again\n </label>\n </div>\n )}\n {onDiscard && (\n <Button\n kind=\"secondary\"\n className=\"mr-auto\"\n data-dismiss=\"modal\"\n onClick={onDiscard}\n data-testid={\n dataTestId !== undefined ? `${dataTestId}-btn-discard` : undefined\n }\n >\n {discardButtonText}\n </Button>\n )}\n {onCancel && (\n <Button\n kind=\"secondary\"\n data-dismiss=\"modal\"\n onClick={onCancel}\n data-testid={\n dataTestId !== undefined ? `${dataTestId}-btn-cancel` : undefined\n }\n >\n {cancelButtonText}\n </Button>\n )}\n <ButtonGroup>\n <Button\n kind={isConfirmDanger ? 'danger' : 'primary'}\n onClick={onConfirmClicked}\n ref={confirmButton}\n data-testid={\n dataTestId !== undefined ? `${dataTestId}-btn-confirm` : undefined\n }\n >\n {confirmButtonText}\n </Button>\n {children}\n </ButtonGroup>\n </ModalFooter>\n </Modal>\n );\n}\n\nBasicModal.propTypes = {\n isOpen: PropTypes.bool.isRequired,\n headerText: PropTypes.string.isRequired,\n bodyText: PropTypes.oneOfType([PropTypes.string, PropTypes.func]).isRequired,\n onCancel: PropTypes.func,\n onConfirm: PropTypes.func.isRequired,\n onDiscard: PropTypes.func,\n onModalDisable: PropTypes.func,\n cancelButtonText: PropTypes.string,\n confirmButtonText: PropTypes.string,\n discardButtonText: PropTypes.string,\n children: PropTypes.node,\n 'data-testid': PropTypes.string,\n};\n\nBasicModal.defaultProps = {\n children: undefined,\n cancelButtonText: 'Cancel',\n confirmButtonText: 'Okay',\n discardButtonText: 'Discard',\n onCancel: undefined,\n onDiscard: undefined,\n onModalDisable: undefined,\n 'data-testid': undefined,\n};\n\nexport default BasicModal;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,MAAM,EAAEC,WAAW,QAAQ,OAAO;AAClD,OAAOC,SAAS,MAAM,YAAY;AAAC,OAC5BC,WAAW;AAAA,OACXC,MAAM;AAAA,SACJC,KAAK,EAAEC,SAAS,EAAEC,WAAW,EAAEC,WAAW;AAAA;AAAA;AAkBnD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASC,UAAU,CAACC,KAAsB,
|
|
1
|
+
{"version":3,"file":"BasicModal.js","names":["React","useRef","useCallback","PropTypes","ButtonGroup","Button","Modal","ModalBody","ModalFooter","ModalHeader","BasicModal","props","isOpen","headerText","bodyText","onCancel","onConfirm","onDiscard","onModalDisable","cancelButtonText","confirmButtonText","discardButtonText","isConfirmDanger","children","dataTestId","confirmButton","disableModalCheckbox","onConfirmClicked","current","checked","onOpened","focus","modalBody","undefined","propTypes","bool","isRequired","string","oneOfType","func","node","defaultProps"],"sources":["../src/BasicModal.tsx"],"sourcesContent":["import React, { useRef, useCallback } from 'react';\nimport PropTypes from 'prop-types';\nimport ButtonGroup from './ButtonGroup';\nimport Button from './Button';\nimport { Modal, ModalBody, ModalFooter, ModalHeader } from './modal';\n\nexport interface BasicModalProps {\n isOpen: boolean;\n headerText: string;\n bodyText: string | (() => string);\n onCancel?: () => void;\n onConfirm: () => void;\n onDiscard?: () => void;\n onModalDisable?: () => void;\n cancelButtonText?: string;\n confirmButtonText?: string;\n discardButtonText?: string;\n isConfirmDanger?: boolean;\n children?: React.ReactNode;\n 'data-testid'?: string;\n}\n\n/**\n * A basic modal dialog with two buttons: cancel / confirm.\n *\n * @param isOpen indicates if the modal dialog is open\n * @param headerText text displayed in the modal header\n * @param bodyText text displayed in the modal body\n * @param onCancel callback for the cancel button; if not provided, button not shown\n * @param onConfirm callback for the confirm button\n * @param onDiscard callback for the discard button; if not provided, button not shown\n * @param cancelButtonText optional text for the cancel button, defaults to 'Cancel'\n * @param confirmButtonText optional text for the confirm button, defaults to 'Okay'\n * @param discardButtonText optional text for the discard button, defaults to 'Discard'\n */\nfunction BasicModal(props: BasicModalProps): JSX.Element {\n const {\n isOpen,\n headerText,\n bodyText,\n onCancel,\n onConfirm,\n onDiscard,\n onModalDisable,\n cancelButtonText = 'Cancel',\n confirmButtonText = 'Okay',\n discardButtonText = 'Discard',\n isConfirmDanger = false,\n children,\n 'data-testid': dataTestId,\n } = props;\n\n const confirmButton = useRef<HTMLButtonElement>(null);\n\n const disableModalCheckbox = useRef<HTMLInputElement>(null);\n\n const onConfirmClicked = useCallback(() => {\n if (\n disableModalCheckbox.current !== null &&\n disableModalCheckbox.current.checked &&\n onModalDisable\n ) {\n onModalDisable();\n }\n onConfirm();\n }, [onConfirm, onModalDisable]);\n\n const onOpened = useCallback(() => {\n confirmButton.current?.focus();\n }, []);\n\n let modalBody = '';\n if (isOpen) {\n modalBody = typeof bodyText === 'function' ? bodyText() : bodyText;\n }\n\n return (\n <Modal isOpen={isOpen} className=\"theme-bg-light\" onOpened={onOpened}>\n <ModalHeader closeButton={false}>{headerText}</ModalHeader>\n <ModalBody>{modalBody}</ModalBody>\n <ModalFooter>\n {onModalDisable && (\n <div className=\"custom-control custom-checkbox form-group mr-auto\">\n <input\n type=\"checkbox\"\n className=\"custom-control-input\"\n id=\"move-confirmation-checkbox\"\n defaultChecked={false}\n ref={disableModalCheckbox}\n data-testid={\n dataTestId !== undefined\n ? `${dataTestId}-checkbox-confirm`\n : undefined\n }\n />\n <label\n className=\"custom-control-label\"\n htmlFor=\"move-confirmation-checkbox\"\n >\n Don't ask me again\n </label>\n </div>\n )}\n {onDiscard && (\n <Button\n kind=\"secondary\"\n className=\"mr-auto\"\n data-dismiss=\"modal\"\n onClick={onDiscard}\n data-testid={\n dataTestId !== undefined ? `${dataTestId}-btn-discard` : undefined\n }\n >\n {discardButtonText}\n </Button>\n )}\n {onCancel && (\n <Button\n kind=\"secondary\"\n data-dismiss=\"modal\"\n onClick={onCancel}\n data-testid={\n dataTestId !== undefined ? `${dataTestId}-btn-cancel` : undefined\n }\n >\n {cancelButtonText}\n </Button>\n )}\n <ButtonGroup>\n <Button\n kind={isConfirmDanger ? 'danger' : 'primary'}\n onClick={onConfirmClicked}\n ref={confirmButton}\n data-testid={\n dataTestId !== undefined ? `${dataTestId}-btn-confirm` : undefined\n }\n >\n {confirmButtonText}\n </Button>\n {children}\n </ButtonGroup>\n </ModalFooter>\n </Modal>\n );\n}\n\nBasicModal.propTypes = {\n isOpen: PropTypes.bool.isRequired,\n headerText: PropTypes.string.isRequired,\n bodyText: PropTypes.oneOfType([PropTypes.string, PropTypes.func]).isRequired,\n onCancel: PropTypes.func,\n onConfirm: PropTypes.func.isRequired,\n onDiscard: PropTypes.func,\n onModalDisable: PropTypes.func,\n cancelButtonText: PropTypes.string,\n confirmButtonText: PropTypes.string,\n discardButtonText: PropTypes.string,\n children: PropTypes.node,\n 'data-testid': PropTypes.string,\n};\n\nBasicModal.defaultProps = {\n children: undefined,\n cancelButtonText: 'Cancel',\n confirmButtonText: 'Okay',\n discardButtonText: 'Discard',\n onCancel: undefined,\n onDiscard: undefined,\n onModalDisable: undefined,\n 'data-testid': undefined,\n};\n\nexport default BasicModal;\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BulkActionBar.d.ts","sourceRoot":"","sources":["../src/BulkActionBar.tsx"],"names":[],"mappings":";AACA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAGtD,MAAM,WAAW,kBAAkB;IACjC,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,iBAAiB,EAAE,KAAK,GAAG,MAAM,CAAC;IAClC,gBAAgB,EAAE,MAAM,IAAI,CAAC;CAC9B;AAED,wBAAgB,aAAa,CAAC,EAC5B,UAAU,EACV,iBAAiB,EACjB,gBAAgB,GACjB,EAAE,kBAAkB,
|
|
1
|
+
{"version":3,"file":"BulkActionBar.d.ts","sourceRoot":"","sources":["../src/BulkActionBar.tsx"],"names":[],"mappings":";AACA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAGtD,MAAM,WAAW,kBAAkB;IACjC,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,iBAAiB,EAAE,KAAK,GAAG,MAAM,CAAC;IAClC,gBAAgB,EAAE,MAAM,IAAI,CAAC;CAC9B;AAED,wBAAgB,aAAa,CAAC,EAC5B,UAAU,EACV,iBAAiB,EACjB,gBAAgB,GACjB,EAAE,kBAAkB,GAAG,GAAG,CAAC,OAAO,CAalC;AAED,eAAe,aAAa,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BulkActionBar.js","names":["ActionBar","commonStyles","BulkActionBar","styleProps","selectedItemCount","onClearSelection","spectrumActionBar"],"sources":["../src/BulkActionBar.tsx"],"sourcesContent":["import { ActionBar } from '@adobe/react-spectrum';\nimport type { StyleProps } from '@react-types/shared';\nimport commonStyles from './SpectrumComponent.module.scss';\n\nexport interface BulkActionBarProps {\n styleProps?: StyleProps;\n selectedItemCount: 'all' | number;\n onClearSelection: () => void;\n}\n\nexport function BulkActionBar({\n styleProps,\n selectedItemCount,\n onClearSelection,\n}: BulkActionBarProps) {\n return (\n <ActionBar\n UNSAFE_className={commonStyles.spectrumActionBar}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...styleProps}\n isEmphasized\n selectedItemCount={selectedItemCount}\n onClearSelection={onClearSelection}\n >\n {/* */}\n </ActionBar>\n );\n}\n\nexport default BulkActionBar;\n"],"mappings":";;;;;AAAA,SAASA,SAAS,QAAQ,uBAAuB;AAAC,OAE3CC,YAAY;AAAA;AAQnB,OAAO,SAASC,aAAa,
|
|
1
|
+
{"version":3,"file":"BulkActionBar.js","names":["ActionBar","commonStyles","BulkActionBar","styleProps","selectedItemCount","onClearSelection","spectrumActionBar"],"sources":["../src/BulkActionBar.tsx"],"sourcesContent":["import { ActionBar } from '@adobe/react-spectrum';\nimport type { StyleProps } from '@react-types/shared';\nimport commonStyles from './SpectrumComponent.module.scss';\n\nexport interface BulkActionBarProps {\n styleProps?: StyleProps;\n selectedItemCount: 'all' | number;\n onClearSelection: () => void;\n}\n\nexport function BulkActionBar({\n styleProps,\n selectedItemCount,\n onClearSelection,\n}: BulkActionBarProps): JSX.Element {\n return (\n <ActionBar\n UNSAFE_className={commonStyles.spectrumActionBar}\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...styleProps}\n isEmphasized\n selectedItemCount={selectedItemCount}\n onClearSelection={onClearSelection}\n >\n {/* */}\n </ActionBar>\n );\n}\n\nexport default BulkActionBar;\n"],"mappings":";;;;;AAAA,SAASA,SAAS,QAAQ,uBAAuB;AAAC,OAE3CC,YAAY;AAAA;AAQnB,OAAO,SAASC,aAAa,OAIO;EAAA,IAJN;IAC5BC,UAAU;IACVC,iBAAiB;IACjBC;EACkB,CAAC;EACnB,oBACE,KAAC,SAAS;IACR,gBAAgB,EAAEJ,YAAY,CAACK;IAC/B;EAAA,GACIH,UAAU;IACd,YAAY;IACZ,iBAAiB,EAAEC,iBAAkB;IACrC,gBAAgB,EAAEC;EAAiB,GAGzB;AAEhB;AAEA,eAAeH,aAAa"}
|
package/dist/CardFlip.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CardFlip.d.ts","sourceRoot":"","sources":["../src/CardFlip.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"CardFlip.d.ts","sourceRoot":"","sources":["../src/CardFlip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoD,MAAM,OAAO,CAAC;AAEzE,OAAO,iBAAiB,CAAC;AAEzB,KAAK,aAAa,GAAG;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,CAAC,KAAK,CAAC,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF;;;;;;;GAOG;AACH,iBAAS,QAAQ,CAAC,EAChB,SAAS,EACT,SAAS,EACT,QAAQ,EACR,aAAa,EAAE,UAAU,GAC1B,EAAE,aAAa,GAAG,GAAG,CAAC,OAAO,CAuD7B;AAED,eAAe,QAAQ,CAAC"}
|
package/dist/CardFlip.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CardFlip.js","names":["React","useCallback","useEffect","useRef","classNames","CardFlip","className","isFlipped","children","dataTestId","getComponent","key","length","Error","front","transitionStart","event","target","currentTarget","document","body","classList","add","transitionEnd","remove","setIsFlippingClassOnTransitionStart","current","addEventListener","refObj","cleanupListener","removeEventListener"],"sources":["../src/CardFlip.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useRef } from 'react';\nimport classNames from 'classnames';\nimport './CardFlip.scss';\n\ntype CardFlipProps = {\n isFlipped: boolean;\n children: [React.ReactNode, React.ReactNode];\n className?: string;\n 'data-testid'?: string;\n};\n\n/**\n * Card flip component, switches between a front and back face being visible.\n * Has logic to handle overflow on body, caused by perspective transforms\n * and moves z-index to top during transition.\n * @param isFlipped true shows second child, false shows first child\n * @param children Expects exactly two children\n * @returns\n */\nfunction CardFlip({\n className,\n isFlipped,\n children,\n 'data-testid': dataTestId,\n}: CardFlipProps): JSX.Element {\n const getComponent = (key: 0 | 1) => {\n if (children.length !== 2) {\n throw new Error('CardFlip requires 2 children to function');\n }\n return children[key];\n };\n\n const front = useRef<HTMLDivElement>(null);\n\n const transitionStart = useCallback(event => {\n if (event.target === event.currentTarget) {\n document.body.classList.add('card-flip--is-flipping');\n }\n }, []);\n\n const transitionEnd = useCallback(event => {\n if (event.target === event.currentTarget) {\n document.body.classList.remove('card-flip--is-flipping');\n }\n }, []);\n\n useEffect(\n function setIsFlippingClassOnTransitionStart() {\n if (!front.current) throw Error('ref undefined');\n front.current.addEventListener('transitionstart', transitionStart);\n\n const refObj = front.current;\n return function cleanupListener() {\n if (refObj != null) {\n return refObj.removeEventListener('transitionstart', transitionStart);\n }\n };\n },\n [transitionStart]\n );\n\n return (\n <div\n className={classNames(className, {\n 'card-flip--show-front': isFlipped,\n 'card-flip--show-back': !isFlipped,\n })}\n data-testid={dataTestId}\n >\n <div className=\"card-flip--back\">{getComponent(0)}</div>\n <div\n ref={front}\n className=\"card-flip--front\"\n onTransitionEnd={transitionEnd}\n >\n {getComponent(1)}\n </div>\n </div>\n );\n}\n\nexport default CardFlip;\n"],"mappings":"AAAA,OAAOA,KAAK,
|
|
1
|
+
{"version":3,"file":"CardFlip.js","names":["React","useCallback","useEffect","useRef","classNames","CardFlip","className","isFlipped","children","dataTestId","getComponent","key","length","Error","front","transitionStart","event","target","currentTarget","document","body","classList","add","transitionEnd","remove","setIsFlippingClassOnTransitionStart","current","addEventListener","refObj","cleanupListener","removeEventListener"],"sources":["../src/CardFlip.tsx"],"sourcesContent":["import React, { ReactNode, useCallback, useEffect, useRef } from 'react';\nimport classNames from 'classnames';\nimport './CardFlip.scss';\n\ntype CardFlipProps = {\n isFlipped: boolean;\n children: [React.ReactNode, React.ReactNode];\n className?: string;\n 'data-testid'?: string;\n};\n\n/**\n * Card flip component, switches between a front and back face being visible.\n * Has logic to handle overflow on body, caused by perspective transforms\n * and moves z-index to top during transition.\n * @param isFlipped true shows second child, false shows first child\n * @param children Expects exactly two children\n * @returns\n */\nfunction CardFlip({\n className,\n isFlipped,\n children,\n 'data-testid': dataTestId,\n}: CardFlipProps): JSX.Element {\n const getComponent = (key: 0 | 1): ReactNode => {\n if (children.length !== 2) {\n throw new Error('CardFlip requires 2 children to function');\n }\n return children[key];\n };\n\n const front = useRef<HTMLDivElement>(null);\n\n const transitionStart = useCallback(event => {\n if (event.target === event.currentTarget) {\n document.body.classList.add('card-flip--is-flipping');\n }\n }, []);\n\n const transitionEnd = useCallback(event => {\n if (event.target === event.currentTarget) {\n document.body.classList.remove('card-flip--is-flipping');\n }\n }, []);\n\n useEffect(\n function setIsFlippingClassOnTransitionStart() {\n if (!front.current) throw Error('ref undefined');\n front.current.addEventListener('transitionstart', transitionStart);\n\n const refObj = front.current;\n return function cleanupListener() {\n if (refObj != null) {\n return refObj.removeEventListener('transitionstart', transitionStart);\n }\n };\n },\n [transitionStart]\n );\n\n return (\n <div\n className={classNames(className, {\n 'card-flip--show-front': isFlipped,\n 'card-flip--show-back': !isFlipped,\n })}\n data-testid={dataTestId}\n >\n <div className=\"card-flip--back\">{getComponent(0)}</div>\n <div\n ref={front}\n className=\"card-flip--front\"\n onTransitionEnd={transitionEnd}\n >\n {getComponent(1)}\n </div>\n </div>\n );\n}\n\nexport default CardFlip;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAeC,WAAW,EAAEC,SAAS,EAAEC,MAAM,QAAQ,OAAO;AACxE,OAAOC,UAAU,MAAM,YAAY;AAAC;AAAA;AAAA;AAUpC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASC,QAAQ,OAKc;EAAA,IALb;IAChBC,SAAS;IACTC,SAAS;IACTC,QAAQ;IACR,aAAa,EAAEC;EACF,CAAC;EACd,IAAMC,YAAY,GAAIC,GAAU,IAAgB;IAC9C,IAAIH,QAAQ,CAACI,MAAM,KAAK,CAAC,EAAE;MACzB,MAAM,IAAIC,KAAK,CAAC,0CAA0C,CAAC;IAC7D;IACA,OAAOL,QAAQ,CAACG,GAAG,CAAC;EACtB,CAAC;EAED,IAAMG,KAAK,GAAGX,MAAM,CAAiB,IAAI,CAAC;EAE1C,IAAMY,eAAe,GAAGd,WAAW,CAACe,KAAK,IAAI;IAC3C,IAAIA,KAAK,CAACC,MAAM,KAAKD,KAAK,CAACE,aAAa,EAAE;MACxCC,QAAQ,CAACC,IAAI,CAACC,SAAS,CAACC,GAAG,CAAC,wBAAwB,CAAC;IACvD;EACF,CAAC,EAAE,EAAE,CAAC;EAEN,IAAMC,aAAa,GAAGtB,WAAW,CAACe,KAAK,IAAI;IACzC,IAAIA,KAAK,CAACC,MAAM,KAAKD,KAAK,CAACE,aAAa,EAAE;MACxCC,QAAQ,CAACC,IAAI,CAACC,SAAS,CAACG,MAAM,CAAC,wBAAwB,CAAC;IAC1D;EACF,CAAC,EAAE,EAAE,CAAC;EAENtB,SAAS,CACP,SAASuB,mCAAmC,GAAG;IAC7C,IAAI,CAACX,KAAK,CAACY,OAAO,EAAE,MAAMb,KAAK,CAAC,eAAe,CAAC;IAChDC,KAAK,CAACY,OAAO,CAACC,gBAAgB,CAAC,iBAAiB,EAAEZ,eAAe,CAAC;IAElE,IAAMa,MAAM,GAAGd,KAAK,CAACY,OAAO;IAC5B,OAAO,SAASG,eAAe,GAAG;MAChC,IAAID,MAAM,IAAI,IAAI,EAAE;QAClB,OAAOA,MAAM,CAACE,mBAAmB,CAAC,iBAAiB,EAAEf,eAAe,CAAC;MACvE;IACF,CAAC;EACH,CAAC,EACD,CAACA,eAAe,CAAC,CAClB;EAED,oBACE;IACE,SAAS,EAAEX,UAAU,CAACE,SAAS,EAAE;MAC/B,uBAAuB,EAAEC,SAAS;MAClC,sBAAsB,EAAE,CAACA;IAC3B,CAAC,CAAE;IACH,eAAaE,UAAW;IAAA,wBAExB;MAAK,SAAS,EAAC,iBAAiB;MAAA,UAAEC,YAAY,CAAC,CAAC;IAAC,EAAO,eACxD;MACE,GAAG,EAAEI,KAAM;MACX,SAAS,EAAC,kBAAkB;MAC5B,eAAe,EAAES,aAAc;MAAA,UAE9Bb,YAAY,CAAC,CAAC;IAAC,EACZ;EAAA,EACF;AAEV;AAEA,eAAeL,QAAQ"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MaskedInput.d.ts","sourceRoot":"","sources":["../src/MaskedInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAmC,aAAa,EAAE,MAAM,OAAO,CAAC;AAS9E,OAAO,oBAAoB,CAAC;AAI5B,QAAA,MAAM,mBAAmB;;;;CAIf,CAAC;AAQX,MAAM,MAAM,gBAAgB,GAAG;IAC7B,cAAc,EAAE,MAAM,CAAC;IACvB,YAAY,EAAE,MAAM,CAAC;IACrB,kBAAkB,CAAC,EAAE,CAAC,OAAO,mBAAmB,CAAC,CAAC,MAAM,OAAO,mBAAmB,CAAC,CAAC;CACrF,CAAC;AAEF,KAAK,gBAAgB,GAAG;IACtB,kDAAkD;IAClD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,qDAAqD;IACrD,OAAO,EAAE,MAAM,CAAC;IAChB,wBAAwB;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mCAAmC;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,2IAA2I;IAC3I,OAAO,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IAC3B,iDAAiD;IACjD,SAAS,CAAC,EAAE,gBAAgB,CAAC;IAC7B,6EAA6E;IAC7E,QAAQ,CAAC,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B,oCAAoC;IACpC,QAAQ,CAAC,CAAC,OAAO,EAAE,gBAAgB,GAAG,IAAI,CAAC;IAC3C,mCAAmC;IACnC,QAAQ,CAAC,CAAC,KAAK,CAAC,EAAE,aAAa,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAC;IACzD,qDAAqD;IACrD,mBAAmB,CAAC,CAClB,OAAO,EAAE,gBAAgB,EACzB,KAAK,EAAE,MAAM,EACb,YAAY,EAAE,MAAM,EACpB,KAAK,EAAE,MAAM,GACZ,MAAM,CAAC;IACV,6BAA6B,CAAC,CAC5B,KAAK,EAAE,MAAM,EACb,YAAY,EAAE,MAAM,EACpB,WAAW,EAAE,MAAM,EACnB,cAAc,EAAE,MAAM,EACtB,YAAY,EAAE,MAAM,GACnB,MAAM,CAAC;IACV,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IAClC,MAAM,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IAEjC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF;;;GAGG;AAIH,QAAA,MAAM,WAAW,
|
|
1
|
+
{"version":3,"file":"MaskedInput.d.ts","sourceRoot":"","sources":["../src/MaskedInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAmC,aAAa,EAAE,MAAM,OAAO,CAAC;AAS9E,OAAO,oBAAoB,CAAC;AAI5B,QAAA,MAAM,mBAAmB;;;;CAIf,CAAC;AAQX,MAAM,MAAM,gBAAgB,GAAG;IAC7B,cAAc,EAAE,MAAM,CAAC;IACvB,YAAY,EAAE,MAAM,CAAC;IACrB,kBAAkB,CAAC,EAAE,CAAC,OAAO,mBAAmB,CAAC,CAAC,MAAM,OAAO,mBAAmB,CAAC,CAAC;CACrF,CAAC;AAEF,KAAK,gBAAgB,GAAG;IACtB,kDAAkD;IAClD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,qDAAqD;IACrD,OAAO,EAAE,MAAM,CAAC;IAChB,wBAAwB;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mCAAmC;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,2IAA2I;IAC3I,OAAO,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IAC3B,iDAAiD;IACjD,SAAS,CAAC,EAAE,gBAAgB,CAAC;IAC7B,6EAA6E;IAC7E,QAAQ,CAAC,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B,oCAAoC;IACpC,QAAQ,CAAC,CAAC,OAAO,EAAE,gBAAgB,GAAG,IAAI,CAAC;IAC3C,mCAAmC;IACnC,QAAQ,CAAC,CAAC,KAAK,CAAC,EAAE,aAAa,CAAC,gBAAgB,CAAC,GAAG,IAAI,CAAC;IACzD,qDAAqD;IACrD,mBAAmB,CAAC,CAClB,OAAO,EAAE,gBAAgB,EACzB,KAAK,EAAE,MAAM,EACb,YAAY,EAAE,MAAM,EACpB,KAAK,EAAE,MAAM,GACZ,MAAM,CAAC;IACV,6BAA6B,CAAC,CAC5B,KAAK,EAAE,MAAM,EACb,YAAY,EAAE,MAAM,EACpB,WAAW,EAAE,MAAM,EACnB,cAAc,EAAE,MAAM,EACtB,YAAY,EAAE,MAAM,GACnB,MAAM,CAAC;IACV,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IAClC,MAAM,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC;IAEjC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF;;;GAGG;AAIH,QAAA,MAAM,WAAW,2FA2dhB,CAAC;AAuBF,eAAe,WAAW,CAAC"}
|
package/dist/MaskedInput.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MaskedInput.js","names":["React","useMemo","useEffect","useCallback","classNames","Log","useForwardedRef","DEFAULT_GET_PREFERRED_REPLACEMENT_STRING","fillToLength","trimTrailingMask","log","module","SELECTION_DIRECTION","FORWARD","BACKWARD","NONE","FIXED_WIDTH_SPACE","MaskedInput","forwardRef","props","ref","className","example","getNextSegmentValue","range","delta","segmentValue","getPreferredReplacementString","onChange","onSelect","onSubmit","pattern","placeholder","selection","value","onFocus","onBlur","dataTestId","input","examples","Array","isArray","emptyMask","replace","setSelectedSegment","debug","selectionStart","selectionEnd","selectionDirection","current","setSelectionRange","getSegment","cursorPosition","testValue","length","i","test","charAt","fillValue","checkValue","exampleValue","filledValue","concat","substring","isValid","patternRegex","RegExp","nextSegment","position","currentSegment","nextPosition","previousSegment","previousPosition","nextSegmentValue","segment","newSegmentValue","newValue","handleSelect","event","target","error","debug2","nativeEvent","type","newSelection","handleSelectCapture","preventDefault","stopPropagation","handleArrowKey","key","handleKeyDown","startsWith","trimmedValue","altKey","metaKey","ctrlKey","newChars","from","Set","toUpperCase","toLowerCase","newChar","maxReplaceIndex","replaceIndex","newSelectionStart","nextSegmentSelection","undefined","defaultProps"],"sources":["../src/MaskedInput.tsx"],"sourcesContent":["import React, { useMemo, useEffect, useCallback, KeyboardEvent } from 'react';\nimport classNames from 'classnames';\nimport Log from '@deephaven/log';\nimport { useForwardedRef } from '@deephaven/react-hooks';\nimport {\n DEFAULT_GET_PREFERRED_REPLACEMENT_STRING,\n fillToLength,\n trimTrailingMask,\n} from './MaskedInputUtils';\nimport './MaskedInput.scss';\n\nconst log = Log.module('MaskedInput');\n\nconst SELECTION_DIRECTION = {\n FORWARD: 'forward',\n BACKWARD: 'backward',\n NONE: 'none',\n} as const;\n\n/**\n * Special space character that's the same size as tabular numbers\n * https://www.fileformat.info/info/unicode/char/2007/index.htm\n */\nconst FIXED_WIDTH_SPACE = '\\u2007';\n\nexport type SelectionSegment = {\n selectionStart: number;\n selectionEnd: number;\n selectionDirection?: (typeof SELECTION_DIRECTION)[keyof typeof SELECTION_DIRECTION];\n};\n\ntype MaskedInputProps = {\n /** An extra class name to add to the component */\n className?: string;\n /** The regex pattern this masked input must match */\n pattern: string;\n /** Input placeholder */\n placeholder?: string;\n /** The current value to display */\n value: string;\n /** One or more examples of valid values. Used when deciding if next keystroke is valid (as rest of the current value may be incomplete) */\n example: string | string[];\n /** The current selection to use for the input */\n selection?: SelectionSegment;\n /** Called when the value changes. Note the value may still be incomplete. */\n onChange?(value: string): void;\n /** Called when selection changes */\n onSelect?(segment: SelectionSegment): void;\n /** Called when enter is pressed */\n onSubmit?(event?: KeyboardEvent<HTMLInputElement>): void;\n /** Retrieve the next value for a provided segment */\n getNextSegmentValue?(\n segment: SelectionSegment,\n delta: number,\n segmentValue: string,\n value: string\n ): string;\n getPreferredReplacementString?(\n value: string,\n replaceIndex: number,\n replaceChar: string,\n selectionStart: number,\n selectionEnd: number\n ): string;\n onFocus?: React.FocusEventHandler;\n onBlur?: React.FocusEventHandler;\n\n 'data-testid'?: string;\n};\n\n/**\n * A masked input for entering data from a template.\n * Won't work by itself, must use within another component and handle updating the value/selection.\n */\n// Forward ref causes a false positive for display-name in eslint:\n// https://github.com/yannickcr/eslint-plugin-react/issues/2269\n// eslint-disable-next-line react/display-name\nconst MaskedInput = React.forwardRef<HTMLInputElement, MaskedInputProps>(\n (props: MaskedInputProps, ref) => {\n const {\n className,\n example,\n getNextSegmentValue = (range, delta, segmentValue) => segmentValue,\n getPreferredReplacementString = DEFAULT_GET_PREFERRED_REPLACEMENT_STRING,\n onChange = () => false,\n onSelect = () => false,\n onSubmit,\n pattern,\n placeholder,\n selection,\n value,\n onFocus = () => false,\n onBlur = () => false,\n 'data-testid': dataTestId,\n } = props;\n const input = useForwardedRef(ref);\n const examples = useMemo(\n () => (Array.isArray(example) ? example : [example]),\n [example]\n );\n const emptyMask = useMemo(\n () => examples[0].replace(/[a-zA-Z0-9]/g, FIXED_WIDTH_SPACE),\n [examples]\n );\n\n useEffect(\n function setSelectedSegment() {\n if (selection != null) {\n log.debug('setting selection...', selection);\n const { selectionStart, selectionEnd, selectionDirection } =\n selection;\n input.current?.setSelectionRange(\n selectionStart,\n selectionEnd,\n selectionDirection\n );\n log.debug('selection set!');\n }\n },\n [selection, input]\n );\n\n /**\n * Returns the selection range for the segment at the given cursor position\n * @param cursorPosition The current position of the cursor\n */\n const getSegment = useCallback(\n (cursorPosition: number) => {\n let selectionStart = cursorPosition;\n let selectionEnd = cursorPosition;\n const testValue = examples.length > 0 ? examples[0] : value;\n\n for (let i = selectionStart - 1; i >= 0; i -= 1) {\n if (!/[a-zA-Z0-9]/g.test(testValue.charAt(i))) {\n break;\n }\n\n selectionStart = i;\n }\n\n for (let i = selectionEnd; i < testValue.length; i += 1) {\n if (!/[a-zA-Z0-9]/g.test(testValue.charAt(i))) {\n break;\n }\n\n selectionEnd = i + 1;\n }\n\n const selectionDirection =\n selectionStart === selectionEnd\n ? SELECTION_DIRECTION.NONE\n : SELECTION_DIRECTION.BACKWARD;\n\n return {\n selectionStart,\n selectionEnd,\n selectionDirection,\n };\n },\n [examples, value]\n );\n\n /**\n * Replaces all blank spaces and everything after the current cursor position with the example value\n * @param checkValue The value to check/fill in\n * @param exampleValue The example to fill in the value from\n * @param cursorPosition The cursor position\n * @returns The filled in value\n */\n function fillValue(\n checkValue: string,\n exampleValue: string,\n cursorPosition = checkValue.length\n ): string {\n let filledValue = '';\n for (let i = 0; i < cursorPosition; i += 1) {\n if (checkValue.charAt(i) !== FIXED_WIDTH_SPACE) {\n filledValue = filledValue.concat(checkValue[i]);\n } else {\n filledValue = filledValue.concat(exampleValue[i]);\n }\n }\n filledValue = filledValue.concat(exampleValue.substring(cursorPosition));\n\n return filledValue;\n }\n\n /**\n * Checks if a given `value` is valid up until the `cursorPosition`.\n * Uses the examples to build the rest of the string\n * @param checkValue The value to check validity of\n * @param cursorPosition The position of the cursor to check up to\n */\n function isValid(\n checkValue: string,\n cursorPosition = checkValue.length\n ): boolean {\n const patternRegex = new RegExp(`^${pattern}$`);\n if (patternRegex.test(checkValue)) {\n return true;\n }\n\n for (let i = 0; i < examples.length; i += 1) {\n const filledValue = fillValue(checkValue, examples[i], cursorPosition);\n if (patternRegex.test(filledValue)) {\n return true;\n }\n }\n return false;\n }\n\n /**\n * Returns the next segment after the given position\n * @param position The cursor position to start at\n * @returns The new selection range\n */\n function nextSegment(position: number): SelectionSegment {\n const currentSegment = getSegment(position);\n const nextPosition = currentSegment.selectionEnd + 1;\n if (nextPosition >= value.length) {\n return currentSegment;\n }\n\n return getSegment(nextPosition);\n }\n\n /**\n * Returns the previous segment before the given position\n * @param position The cursor position to start at\n * @returns The new selection range\n */\n function previousSegment(position: number): SelectionSegment {\n const currentSegment = getSegment(position);\n const previousPosition = currentSegment.selectionStart - 1;\n if (previousPosition <= 0) {\n return currentSegment;\n }\n\n return getSegment(previousPosition);\n }\n\n function nextSegmentValue(position: number, delta: number): void {\n const segment = getSegment(position);\n const segmentValue = value.substring(\n segment.selectionStart,\n segment.selectionEnd\n );\n const newSegmentValue = getNextSegmentValue(\n segment,\n delta,\n segmentValue,\n value\n );\n const newValue =\n value.substring(0, segment.selectionStart) +\n newSegmentValue +\n value.substring(segment.selectionEnd);\n if (isValid(newValue, segment.selectionEnd)) {\n onChange(newValue);\n onSelect(segment);\n }\n }\n\n const handleSelect = useCallback(\n (event: React.UIEvent<HTMLInputElement>) => {\n const {\n selectionStart = 0,\n selectionEnd = 0,\n selectionDirection = 'none',\n } = event.target as HTMLInputElement;\n\n if (\n selectionStart === null ||\n selectionEnd === null ||\n selectionDirection === null\n ) {\n log.error(\n 'Selection attempted on non-text input element',\n event.target\n );\n return;\n }\n\n log.debug2(\n 'handleSelect',\n selectionStart,\n selectionEnd,\n selectionDirection\n );\n if (\n selection != null &&\n selectionStart === selection.selectionStart &&\n selectionEnd === selection.selectionEnd\n ) {\n return;\n }\n if (\n selection != null &&\n selectionStart === value.length &&\n selectionEnd === value.length &&\n event.nativeEvent.type !== 'mouseup'\n ) {\n // React triggers onSelect event with the cursor at the end of the input content\n // when the component is rendered at a different location in the DOM,\n // i.e. when start/end times switch places in the TimeSlider.\n // Ignore this event and reset the selection to its previous state.\n onSelect({ ...selection });\n return;\n }\n if (selectionStart === selectionEnd) {\n const newSelection = getSegment(selectionStart);\n log.debug(\n 'Selection segment from ',\n selectionStart,\n selectionEnd,\n '=>',\n newSelection\n );\n onSelect(newSelection);\n } else {\n onSelect({ selectionStart, selectionEnd, selectionDirection });\n }\n },\n [getSegment, onSelect, selection, value]\n );\n\n const handleSelectCapture = useCallback(\n (event: React.UIEvent<HTMLInputElement>) => {\n if (!input.current) {\n return;\n }\n log.debug('handleSelectCapture', event);\n const selectionStart = input.current.selectionStart ?? 0;\n if (\n selectionStart === value.length &&\n selection != null &&\n selectionStart !== selection.selectionStart\n ) {\n event.preventDefault();\n event.stopPropagation();\n }\n },\n [input, selection, value]\n );\n\n function handleArrowKey(event: React.KeyboardEvent<HTMLInputElement>) {\n event.preventDefault();\n event.stopPropagation();\n\n if (!input.current) {\n return;\n }\n\n const { key } = event;\n const { selectionStart = 0, selectionEnd = 0 } = input.current;\n if (selectionStart === null || selectionEnd === null) {\n log.error(\n 'Selection arrow nvaigation attempted on non-text input element',\n event.target\n );\n return;\n }\n\n if (key === 'ArrowLeft') {\n onSelect(previousSegment(selectionStart));\n } else if (key === 'ArrowRight') {\n onSelect(nextSegment(selectionEnd));\n } else if (key === 'ArrowUp') {\n nextSegmentValue(selectionStart, -1);\n } else if (key === 'ArrowDown') {\n nextSegmentValue(selectionStart, 1);\n }\n }\n\n function handleKeyDown(event: React.KeyboardEvent<HTMLInputElement>) {\n if (!input.current) {\n return;\n }\n log.debug('handleKeyDown', event);\n const { key } = event;\n const { selectionStart = 0, selectionEnd = 0 } = input.current;\n if (selectionStart === null || selectionEnd === null) {\n log.error(\n 'Selection key event on non-text input element',\n event.target\n );\n return;\n }\n if (key === 'Enter') {\n onSubmit?.(event);\n return;\n }\n if (key.startsWith('Arrow')) {\n handleArrowKey(event);\n return;\n }\n\n if (key === 'Delete' || key === 'Backspace') {\n event.preventDefault();\n event.stopPropagation();\n\n // Deleting at the end of the value\n if (selectionEnd >= trimTrailingMask(value, emptyMask).length) {\n const newValue = value.substring(\n 0,\n // Delete whole selection or just the char before the cursor\n selectionStart === selectionEnd\n ? selectionStart - 1\n : selectionStart\n );\n const trimmedValue = trimTrailingMask(newValue, emptyMask);\n if (trimmedValue !== value) {\n onChange(trimmedValue);\n onSelect({\n selectionStart: trimmedValue.length,\n selectionEnd: trimmedValue.length,\n selectionDirection: SELECTION_DIRECTION.NONE,\n });\n }\n return;\n }\n\n if (selectionStart !== selectionEnd) {\n // Replace all non-masked characters with blanks, set selection to start\n const newValue =\n value.substring(0, selectionStart) +\n value\n .substring(selectionStart, selectionEnd)\n .replace(/[a-zA-Z0-9]/g, FIXED_WIDTH_SPACE) +\n value.substring(selectionEnd);\n log.debug(\n 'Range ',\n selectionStart,\n selectionEnd,\n 'deleted, setting value',\n newValue\n );\n\n onChange(newValue);\n onSelect({\n selectionStart,\n selectionEnd: selectionStart,\n selectionDirection: SELECTION_DIRECTION.NONE,\n });\n } else if (selectionStart > 0) {\n for (let i = selectionStart - 1; i >= 0; i -= 1) {\n // Only replace non placeholder text\n const newValue =\n value.substring(0, i) +\n value\n .substring(i, selectionStart)\n .replace(/[a-zA-Z0-9]/g, FIXED_WIDTH_SPACE) +\n value.substring(selectionStart);\n\n if (newValue !== value) {\n onChange(newValue);\n onSelect({\n selectionStart: i,\n selectionEnd: i,\n selectionDirection: SELECTION_DIRECTION.NONE,\n });\n return;\n }\n }\n }\n\n return;\n }\n\n if (event.altKey || event.metaKey || event.ctrlKey || key.length > 1) {\n return;\n }\n\n event.preventDefault();\n event.stopPropagation();\n\n // Get the different permutations of the character they entered, remove duplicates\n const newChars = Array.from(\n new Set([key, key.toUpperCase(), key.toLowerCase()])\n );\n for (let i = 0; i < newChars.length; i += 1) {\n const newChar = newChars[i];\n\n // If they're typing an alphanumeric character, be smart and allow it to jump ahead\n const maxReplaceIndex = /[a-zA-Z0-9]/g.test(newChar)\n ? examples[0].length - 1\n : selectionStart;\n for (\n let replaceIndex = selectionStart;\n replaceIndex <= maxReplaceIndex;\n replaceIndex += 1\n ) {\n // Fill with the example chars if necessary\n const filledValue = fillToLength(\n value,\n examples[0],\n replaceIndex + 1\n );\n const newValue = getPreferredReplacementString(\n filledValue,\n replaceIndex,\n newChar,\n selectionStart,\n selectionEnd\n );\n if (isValid(newValue, replaceIndex + 1)) {\n const currentSegment = getSegment(replaceIndex);\n const newSelectionStart = replaceIndex + 1;\n let newSelection: SelectionSegment = {\n selectionStart: newSelectionStart,\n selectionEnd: newSelectionStart,\n selectionDirection: SELECTION_DIRECTION.NONE,\n };\n if (newSelectionStart >= currentSegment.selectionEnd) {\n const nextSegmentSelection = nextSegment(replaceIndex);\n if (\n nextSegmentSelection.selectionStart !==\n currentSegment.selectionStart\n ) {\n newSelection = nextSegmentSelection;\n }\n }\n log.debug('handleKeyDown', key, '=>', newValue, newSelection);\n onChange(newValue);\n onSelect(newSelection);\n return;\n }\n }\n }\n }\n\n // Need to use \"text\" type so we can apply a pattern and make selection properly\n return (\n <input\n ref={input}\n className={classNames('form-control masked-input', className)}\n type=\"text\"\n pattern={pattern}\n placeholder={placeholder}\n value={value}\n onChange={() => undefined}\n onKeyDown={handleKeyDown}\n onSelect={handleSelect}\n onSelectCapture={handleSelectCapture}\n onFocus={onFocus}\n onBlur={onBlur}\n data-testid={dataTestId}\n />\n );\n }\n);\n\nMaskedInput.defaultProps = {\n className: '',\n placeholder: undefined,\n onChange(): void {\n // no-op\n },\n onSelect(): void {\n // no-op\n },\n getNextSegmentValue: (range, delta, segmentValue) => segmentValue,\n getPreferredReplacementString: DEFAULT_GET_PREFERRED_REPLACEMENT_STRING,\n selection: undefined,\n onFocus(): void {\n // no-op\n },\n onBlur(): void {\n // no-op\n },\n 'data-testid': undefined,\n};\n\nexport default MaskedInput;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"MaskedInput.js","names":["React","useMemo","useEffect","useCallback","classNames","Log","useForwardedRef","DEFAULT_GET_PREFERRED_REPLACEMENT_STRING","fillToLength","trimTrailingMask","log","module","SELECTION_DIRECTION","FORWARD","BACKWARD","NONE","FIXED_WIDTH_SPACE","MaskedInput","forwardRef","props","ref","className","example","getNextSegmentValue","range","delta","segmentValue","getPreferredReplacementString","onChange","onSelect","onSubmit","pattern","placeholder","selection","value","onFocus","onBlur","dataTestId","input","examples","Array","isArray","emptyMask","replace","setSelectedSegment","debug","selectionStart","selectionEnd","selectionDirection","current","setSelectionRange","getSegment","cursorPosition","testValue","length","i","test","charAt","fillValue","checkValue","exampleValue","filledValue","concat","substring","isValid","patternRegex","RegExp","nextSegment","position","currentSegment","nextPosition","previousSegment","previousPosition","nextSegmentValue","segment","newSegmentValue","newValue","handleSelect","event","target","error","debug2","nativeEvent","type","newSelection","handleSelectCapture","preventDefault","stopPropagation","handleArrowKey","key","handleKeyDown","startsWith","trimmedValue","altKey","metaKey","ctrlKey","newChars","from","Set","toUpperCase","toLowerCase","newChar","maxReplaceIndex","replaceIndex","newSelectionStart","nextSegmentSelection","undefined","defaultProps"],"sources":["../src/MaskedInput.tsx"],"sourcesContent":["import React, { useMemo, useEffect, useCallback, KeyboardEvent } from 'react';\nimport classNames from 'classnames';\nimport Log from '@deephaven/log';\nimport { useForwardedRef } from '@deephaven/react-hooks';\nimport {\n DEFAULT_GET_PREFERRED_REPLACEMENT_STRING,\n fillToLength,\n trimTrailingMask,\n} from './MaskedInputUtils';\nimport './MaskedInput.scss';\n\nconst log = Log.module('MaskedInput');\n\nconst SELECTION_DIRECTION = {\n FORWARD: 'forward',\n BACKWARD: 'backward',\n NONE: 'none',\n} as const;\n\n/**\n * Special space character that's the same size as tabular numbers\n * https://www.fileformat.info/info/unicode/char/2007/index.htm\n */\nconst FIXED_WIDTH_SPACE = '\\u2007';\n\nexport type SelectionSegment = {\n selectionStart: number;\n selectionEnd: number;\n selectionDirection?: (typeof SELECTION_DIRECTION)[keyof typeof SELECTION_DIRECTION];\n};\n\ntype MaskedInputProps = {\n /** An extra class name to add to the component */\n className?: string;\n /** The regex pattern this masked input must match */\n pattern: string;\n /** Input placeholder */\n placeholder?: string;\n /** The current value to display */\n value: string;\n /** One or more examples of valid values. Used when deciding if next keystroke is valid (as rest of the current value may be incomplete) */\n example: string | string[];\n /** The current selection to use for the input */\n selection?: SelectionSegment;\n /** Called when the value changes. Note the value may still be incomplete. */\n onChange?(value: string): void;\n /** Called when selection changes */\n onSelect?(segment: SelectionSegment): void;\n /** Called when enter is pressed */\n onSubmit?(event?: KeyboardEvent<HTMLInputElement>): void;\n /** Retrieve the next value for a provided segment */\n getNextSegmentValue?(\n segment: SelectionSegment,\n delta: number,\n segmentValue: string,\n value: string\n ): string;\n getPreferredReplacementString?(\n value: string,\n replaceIndex: number,\n replaceChar: string,\n selectionStart: number,\n selectionEnd: number\n ): string;\n onFocus?: React.FocusEventHandler;\n onBlur?: React.FocusEventHandler;\n\n 'data-testid'?: string;\n};\n\n/**\n * A masked input for entering data from a template.\n * Won't work by itself, must use within another component and handle updating the value/selection.\n */\n// Forward ref causes a false positive for display-name in eslint:\n// https://github.com/yannickcr/eslint-plugin-react/issues/2269\n// eslint-disable-next-line react/display-name\nconst MaskedInput = React.forwardRef<HTMLInputElement, MaskedInputProps>(\n (props: MaskedInputProps, ref) => {\n const {\n className,\n example,\n getNextSegmentValue = (range, delta, segmentValue) => segmentValue,\n getPreferredReplacementString = DEFAULT_GET_PREFERRED_REPLACEMENT_STRING,\n onChange = () => false,\n onSelect = () => false,\n onSubmit,\n pattern,\n placeholder,\n selection,\n value,\n onFocus = () => false,\n onBlur = () => false,\n 'data-testid': dataTestId,\n } = props;\n const input = useForwardedRef(ref);\n const examples = useMemo(\n () => (Array.isArray(example) ? example : [example]),\n [example]\n );\n const emptyMask = useMemo(\n () => examples[0].replace(/[a-zA-Z0-9]/g, FIXED_WIDTH_SPACE),\n [examples]\n );\n\n useEffect(\n function setSelectedSegment() {\n if (selection != null) {\n log.debug('setting selection...', selection);\n const { selectionStart, selectionEnd, selectionDirection } =\n selection;\n input.current?.setSelectionRange(\n selectionStart,\n selectionEnd,\n selectionDirection\n );\n log.debug('selection set!');\n }\n },\n [selection, input]\n );\n\n /**\n * Returns the selection range for the segment at the given cursor position\n * @param cursorPosition The current position of the cursor\n */\n const getSegment = useCallback(\n (cursorPosition: number) => {\n let selectionStart = cursorPosition;\n let selectionEnd = cursorPosition;\n const testValue = examples.length > 0 ? examples[0] : value;\n\n for (let i = selectionStart - 1; i >= 0; i -= 1) {\n if (!/[a-zA-Z0-9]/g.test(testValue.charAt(i))) {\n break;\n }\n\n selectionStart = i;\n }\n\n for (let i = selectionEnd; i < testValue.length; i += 1) {\n if (!/[a-zA-Z0-9]/g.test(testValue.charAt(i))) {\n break;\n }\n\n selectionEnd = i + 1;\n }\n\n const selectionDirection =\n selectionStart === selectionEnd\n ? SELECTION_DIRECTION.NONE\n : SELECTION_DIRECTION.BACKWARD;\n\n return {\n selectionStart,\n selectionEnd,\n selectionDirection,\n };\n },\n [examples, value]\n );\n\n /**\n * Replaces all blank spaces and everything after the current cursor position with the example value\n * @param checkValue The value to check/fill in\n * @param exampleValue The example to fill in the value from\n * @param cursorPosition The cursor position\n * @returns The filled in value\n */\n function fillValue(\n checkValue: string,\n exampleValue: string,\n cursorPosition = checkValue.length\n ): string {\n let filledValue = '';\n for (let i = 0; i < cursorPosition; i += 1) {\n if (checkValue.charAt(i) !== FIXED_WIDTH_SPACE) {\n filledValue = filledValue.concat(checkValue[i]);\n } else {\n filledValue = filledValue.concat(exampleValue[i]);\n }\n }\n filledValue = filledValue.concat(exampleValue.substring(cursorPosition));\n\n return filledValue;\n }\n\n /**\n * Checks if a given `value` is valid up until the `cursorPosition`.\n * Uses the examples to build the rest of the string\n * @param checkValue The value to check validity of\n * @param cursorPosition The position of the cursor to check up to\n */\n function isValid(\n checkValue: string,\n cursorPosition = checkValue.length\n ): boolean {\n const patternRegex = new RegExp(`^${pattern}$`);\n if (patternRegex.test(checkValue)) {\n return true;\n }\n\n for (let i = 0; i < examples.length; i += 1) {\n const filledValue = fillValue(checkValue, examples[i], cursorPosition);\n if (patternRegex.test(filledValue)) {\n return true;\n }\n }\n return false;\n }\n\n /**\n * Returns the next segment after the given position\n * @param position The cursor position to start at\n * @returns The new selection range\n */\n function nextSegment(position: number): SelectionSegment {\n const currentSegment = getSegment(position);\n const nextPosition = currentSegment.selectionEnd + 1;\n if (nextPosition >= value.length) {\n return currentSegment;\n }\n\n return getSegment(nextPosition);\n }\n\n /**\n * Returns the previous segment before the given position\n * @param position The cursor position to start at\n * @returns The new selection range\n */\n function previousSegment(position: number): SelectionSegment {\n const currentSegment = getSegment(position);\n const previousPosition = currentSegment.selectionStart - 1;\n if (previousPosition <= 0) {\n return currentSegment;\n }\n\n return getSegment(previousPosition);\n }\n\n function nextSegmentValue(position: number, delta: number): void {\n const segment = getSegment(position);\n const segmentValue = value.substring(\n segment.selectionStart,\n segment.selectionEnd\n );\n const newSegmentValue = getNextSegmentValue(\n segment,\n delta,\n segmentValue,\n value\n );\n const newValue =\n value.substring(0, segment.selectionStart) +\n newSegmentValue +\n value.substring(segment.selectionEnd);\n if (isValid(newValue, segment.selectionEnd)) {\n onChange(newValue);\n onSelect(segment);\n }\n }\n\n const handleSelect = useCallback(\n (event: React.UIEvent<HTMLInputElement>) => {\n const {\n selectionStart = 0,\n selectionEnd = 0,\n selectionDirection = 'none',\n } = event.target as HTMLInputElement;\n\n if (\n selectionStart === null ||\n selectionEnd === null ||\n selectionDirection === null\n ) {\n log.error(\n 'Selection attempted on non-text input element',\n event.target\n );\n return;\n }\n\n log.debug2(\n 'handleSelect',\n selectionStart,\n selectionEnd,\n selectionDirection\n );\n if (\n selection != null &&\n selectionStart === selection.selectionStart &&\n selectionEnd === selection.selectionEnd\n ) {\n return;\n }\n if (\n selection != null &&\n selectionStart === value.length &&\n selectionEnd === value.length &&\n event.nativeEvent.type !== 'mouseup'\n ) {\n // React triggers onSelect event with the cursor at the end of the input content\n // when the component is rendered at a different location in the DOM,\n // i.e. when start/end times switch places in the TimeSlider.\n // Ignore this event and reset the selection to its previous state.\n onSelect({ ...selection });\n return;\n }\n if (selectionStart === selectionEnd) {\n const newSelection = getSegment(selectionStart);\n log.debug(\n 'Selection segment from ',\n selectionStart,\n selectionEnd,\n '=>',\n newSelection\n );\n onSelect(newSelection);\n } else {\n onSelect({ selectionStart, selectionEnd, selectionDirection });\n }\n },\n [getSegment, onSelect, selection, value]\n );\n\n const handleSelectCapture = useCallback(\n (event: React.UIEvent<HTMLInputElement>) => {\n if (!input.current) {\n return;\n }\n log.debug('handleSelectCapture', event);\n const selectionStart = input.current.selectionStart ?? 0;\n if (\n selectionStart === value.length &&\n selection != null &&\n selectionStart !== selection.selectionStart\n ) {\n event.preventDefault();\n event.stopPropagation();\n }\n },\n [input, selection, value]\n );\n\n function handleArrowKey(\n event: React.KeyboardEvent<HTMLInputElement>\n ): void {\n event.preventDefault();\n event.stopPropagation();\n\n if (!input.current) {\n return;\n }\n\n const { key } = event;\n const { selectionStart = 0, selectionEnd = 0 } = input.current;\n if (selectionStart === null || selectionEnd === null) {\n log.error(\n 'Selection arrow nvaigation attempted on non-text input element',\n event.target\n );\n return;\n }\n\n if (key === 'ArrowLeft') {\n onSelect(previousSegment(selectionStart));\n } else if (key === 'ArrowRight') {\n onSelect(nextSegment(selectionEnd));\n } else if (key === 'ArrowUp') {\n nextSegmentValue(selectionStart, -1);\n } else if (key === 'ArrowDown') {\n nextSegmentValue(selectionStart, 1);\n }\n }\n\n function handleKeyDown(event: React.KeyboardEvent<HTMLInputElement>): void {\n if (!input.current) {\n return;\n }\n log.debug('handleKeyDown', event);\n const { key } = event;\n const { selectionStart = 0, selectionEnd = 0 } = input.current;\n if (selectionStart === null || selectionEnd === null) {\n log.error(\n 'Selection key event on non-text input element',\n event.target\n );\n return;\n }\n if (key === 'Enter') {\n onSubmit?.(event);\n return;\n }\n if (key.startsWith('Arrow')) {\n handleArrowKey(event);\n return;\n }\n\n if (key === 'Delete' || key === 'Backspace') {\n event.preventDefault();\n event.stopPropagation();\n\n // Deleting at the end of the value\n if (selectionEnd >= trimTrailingMask(value, emptyMask).length) {\n const newValue = value.substring(\n 0,\n // Delete whole selection or just the char before the cursor\n selectionStart === selectionEnd\n ? selectionStart - 1\n : selectionStart\n );\n const trimmedValue = trimTrailingMask(newValue, emptyMask);\n if (trimmedValue !== value) {\n onChange(trimmedValue);\n onSelect({\n selectionStart: trimmedValue.length,\n selectionEnd: trimmedValue.length,\n selectionDirection: SELECTION_DIRECTION.NONE,\n });\n }\n return;\n }\n\n if (selectionStart !== selectionEnd) {\n // Replace all non-masked characters with blanks, set selection to start\n const newValue =\n value.substring(0, selectionStart) +\n value\n .substring(selectionStart, selectionEnd)\n .replace(/[a-zA-Z0-9]/g, FIXED_WIDTH_SPACE) +\n value.substring(selectionEnd);\n log.debug(\n 'Range ',\n selectionStart,\n selectionEnd,\n 'deleted, setting value',\n newValue\n );\n\n onChange(newValue);\n onSelect({\n selectionStart,\n selectionEnd: selectionStart,\n selectionDirection: SELECTION_DIRECTION.NONE,\n });\n } else if (selectionStart > 0) {\n for (let i = selectionStart - 1; i >= 0; i -= 1) {\n // Only replace non placeholder text\n const newValue =\n value.substring(0, i) +\n value\n .substring(i, selectionStart)\n .replace(/[a-zA-Z0-9]/g, FIXED_WIDTH_SPACE) +\n value.substring(selectionStart);\n\n if (newValue !== value) {\n onChange(newValue);\n onSelect({\n selectionStart: i,\n selectionEnd: i,\n selectionDirection: SELECTION_DIRECTION.NONE,\n });\n return;\n }\n }\n }\n\n return;\n }\n\n if (event.altKey || event.metaKey || event.ctrlKey || key.length > 1) {\n return;\n }\n\n event.preventDefault();\n event.stopPropagation();\n\n // Get the different permutations of the character they entered, remove duplicates\n const newChars = Array.from(\n new Set([key, key.toUpperCase(), key.toLowerCase()])\n );\n for (let i = 0; i < newChars.length; i += 1) {\n const newChar = newChars[i];\n\n // If they're typing an alphanumeric character, be smart and allow it to jump ahead\n const maxReplaceIndex = /[a-zA-Z0-9]/g.test(newChar)\n ? examples[0].length - 1\n : selectionStart;\n for (\n let replaceIndex = selectionStart;\n replaceIndex <= maxReplaceIndex;\n replaceIndex += 1\n ) {\n // Fill with the example chars if necessary\n const filledValue = fillToLength(\n value,\n examples[0],\n replaceIndex + 1\n );\n const newValue = getPreferredReplacementString(\n filledValue,\n replaceIndex,\n newChar,\n selectionStart,\n selectionEnd\n );\n if (isValid(newValue, replaceIndex + 1)) {\n const currentSegment = getSegment(replaceIndex);\n const newSelectionStart = replaceIndex + 1;\n let newSelection: SelectionSegment = {\n selectionStart: newSelectionStart,\n selectionEnd: newSelectionStart,\n selectionDirection: SELECTION_DIRECTION.NONE,\n };\n if (newSelectionStart >= currentSegment.selectionEnd) {\n const nextSegmentSelection = nextSegment(replaceIndex);\n if (\n nextSegmentSelection.selectionStart !==\n currentSegment.selectionStart\n ) {\n newSelection = nextSegmentSelection;\n }\n }\n log.debug('handleKeyDown', key, '=>', newValue, newSelection);\n onChange(newValue);\n onSelect(newSelection);\n return;\n }\n }\n }\n }\n\n // Need to use \"text\" type so we can apply a pattern and make selection properly\n return (\n <input\n ref={input}\n className={classNames('form-control masked-input', className)}\n type=\"text\"\n pattern={pattern}\n placeholder={placeholder}\n value={value}\n onChange={() => undefined}\n onKeyDown={handleKeyDown}\n onSelect={handleSelect}\n onSelectCapture={handleSelectCapture}\n onFocus={onFocus}\n onBlur={onBlur}\n data-testid={dataTestId}\n />\n );\n }\n);\n\nMaskedInput.defaultProps = {\n className: '',\n placeholder: undefined,\n onChange(): void {\n // no-op\n },\n onSelect(): void {\n // no-op\n },\n getNextSegmentValue: (range, delta, segmentValue) => segmentValue,\n getPreferredReplacementString: DEFAULT_GET_PREFERRED_REPLACEMENT_STRING,\n selection: undefined,\n onFocus(): void {\n // no-op\n },\n onBlur(): void {\n // no-op\n },\n 'data-testid': undefined,\n};\n\nexport default MaskedInput;\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RandomAreaPlotAnimation.d.ts","sourceRoot":"","sources":["../src/RandomAreaPlotAnimation.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAG3D,OAAO,gCAAgC,CAAC;AAiBxC,QAAA,MAAM,uBAAuB,
|
|
1
|
+
{"version":3,"file":"RandomAreaPlotAnimation.d.ts","sourceRoot":"","sources":["../src/RandomAreaPlotAnimation.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAG3D,OAAO,gCAAgC,CAAC;AAiBxC,QAAA,MAAM,uBAAuB,8CAiS3B,CAAC;AAEH,eAAe,uBAAuB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RandomAreaPlotAnimation.js","names":["React","useEffect","useState","useRef","debounce","assertNotNull","ThemeExport","VOLATILITY","LOW","HIGH","START_Y","FOREGROUND","GRID_SIZE","GRID_COLOR","BACKGROUND","PATTERN","SIZE","DOT_SIZE","FILL_OPACITY","PX_PER_SECOND","RESIZE_DEBOUNCE","INTERACTION_TIMEOUT","RandomAreaPlotAnimation","memo","canvas","container","shade","setShade","scale","window","devicePixelRatio","ctx","pattern","width","height","rAF","lastTimestamp","data","setCanvasSize","current","offsetWidth","offsetHeight","style","createPatternFill","canvasPattern","document","createElement","contextPattern","getContext","fillStyle","fillRect","Math","round","toString","padStart","createPattern","randomWalk","prev","rand","random","change","abs","initData","startingData","y","x","push","setDataSize","length","pop","drawAreaLine","path","context","beginPath","moveTo","lineTo","i","closePath","drawGridLines","drawCanvas","timestamp","lineWidth","strokeStyle","stroke","subPixelMotion","translate","fill","setTransform","numberOfPoints","floor","shift","cancelAnimationFrame","requestAnimationFrame","debouncedHandleResize","leading","pauseAnimation","resetIdleTimeout","startAnimation","handleActivity","hasFocus","handleResize","alpha","addEventListener","removeEventListener","cancel"],"sources":["../src/RandomAreaPlotAnimation.tsx"],"sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\n/* eslint-disable react/display-name */\n\nimport React, { useEffect, useState, useRef } from 'react';\nimport debounce from 'lodash.debounce';\nimport { assertNotNull } from '@deephaven/utils';\nimport './RandomAreaPlotAnimation.scss';\nimport ThemeExport from './ThemeExport';\n\nconst VOLATILITY = 0.025; // how spikey the data gets\nconst LOW = 0.9;\nconst HIGH = 0.1;\nconst START_Y = 0.618;\nconst FOREGROUND = ThemeExport['primary-dark'];\nconst GRID_SIZE = 80;\nconst GRID_COLOR = ThemeExport['gray-800'];\nconst BACKGROUND = ThemeExport['gray-900'];\nconst PATTERN = { SIZE: 8, DOT_SIZE: 2, FILL_OPACITY: 0.25 };\nconst PX_PER_SECOND = 18;\nconst RESIZE_DEBOUNCE = 250;\nconst INTERACTION_TIMEOUT = 60 * 1000;\n\n// Draw a background canvas, paint it with a fun chart looking animation\nconst RandomAreaPlotAnimation = React.memo(() => {\n const canvas = useRef<HTMLCanvasElement>(null);\n const container = useRef<HTMLDivElement>(null);\n const [shade, setShade] = useState(false);\n const scale = window.devicePixelRatio;\n\n let ctx: CanvasRenderingContext2D | null | undefined;\n let pattern: CanvasPattern | null | undefined;\n let width: number;\n let height: number;\n let rAF: number | null;\n\n let lastTimestamp: DOMHighResTimeStamp | null | undefined = null;\n let data: number[] = [];\n\n function setCanvasSize() {\n // Set canvas size to fill screen\n if (container.current != null) {\n width = container.current.offsetWidth;\n height = container.current.offsetHeight;\n }\n\n if (canvas.current != null) {\n canvas.current.style.width = `${width}px`;\n canvas.current.style.height = `${height}px`;\n\n canvas.current.width = width * scale;\n canvas.current.height = height * scale;\n }\n\n ctx?.scale(scale, scale);\n }\n\n // Returns the background fill create offscreen as pattern\n function createPatternFill() {\n // create the off-screen canvas\n const canvasPattern = document.createElement('canvas');\n canvasPattern.width = PATTERN.SIZE;\n canvasPattern.height = PATTERN.SIZE;\n const contextPattern = canvasPattern.getContext('2d');\n\n // draw pattern to off-screen context\n if (contextPattern != null) {\n contextPattern.fillStyle = FOREGROUND;\n contextPattern.fillRect(0, 0, PATTERN.DOT_SIZE, PATTERN.DOT_SIZE);\n\n // add an overlay fill\n contextPattern.fillStyle =\n FOREGROUND +\n Math.round(255 * PATTERN.FILL_OPACITY)\n .toString(16)\n .padStart(2, '0'); // adds opacity in hex to color\n contextPattern.fillRect(0, 0, PATTERN.SIZE, PATTERN.SIZE);\n }\n return contextPattern?.createPattern(canvasPattern, 'repeat');\n }\n\n /**\n * Generates a step in a random walk between LOW - HIGH given a previous value\n * data is always in 0-1 data space so its scaleable\n * data space is converted to screen space inside draw functions\n * @param prev previous random walk step\n * @return new random walk step\n */\n function randomWalk(prev: number): number {\n const rand = Math.random() - 0.5; // give it directionality\n let change = VOLATILITY * rand; // scale by volatity constant\n\n // ensure directional bounce off approaching edges\n if (prev < HIGH) {\n change = Math.abs(change);\n } else if (prev > LOW) {\n change = -Math.abs(change);\n }\n\n return prev + change;\n }\n\n function initData() {\n const startingData = [];\n let y = START_Y; // always start towards the bottom of the screen\n for (let x = 0; x < width + PX_PER_SECOND; x += 1) {\n y = randomWalk(y);\n startingData.push(y);\n }\n return startingData;\n }\n\n function setDataSize() {\n while (data.length >= width + PX_PER_SECOND) {\n data.pop();\n }\n while (data.length < width + PX_PER_SECOND) {\n data.push(randomWalk(data[data.length - 1]));\n }\n }\n\n function drawAreaLine(path: number[], context: CanvasRenderingContext2D) {\n context.beginPath();\n // start offscreen\n context.moveTo(-1, height + 1);\n context.lineTo(-1, height * path[0]);\n\n // draw the line\n for (let i = 0; i < path.length; i += 1) {\n context.lineTo(i, height * path[i]);\n }\n\n // close offscreen\n context.lineTo(width + PX_PER_SECOND, height * path[path.length - 1]);\n context.lineTo(width + PX_PER_SECOND, height + 1);\n context.closePath();\n }\n\n function drawGridLines(context: CanvasRenderingContext2D) {\n context.beginPath();\n // draw verticals\n for (let x = 1; x < width; x += GRID_SIZE) {\n context.moveTo(x, 0);\n context.lineTo(x, height);\n }\n // draw horizontals\n for (let y = 1; y < height; y += GRID_SIZE) {\n context.moveTo(0, y);\n context.lineTo(width, y);\n }\n }\n\n /**\n * Main draw loop for where the animation happens\n * all the styling happens within drawCanvas from paths generated by other functions\n * @param timestamp passed in callback from requestAnimationFrame\n */\n function drawCanvas(timestamp?: DOMHighResTimeStamp) {\n lastTimestamp = lastTimestamp ?? timestamp;\n\n assertNotNull(ctx);\n // clear the canvas\n ctx.fillStyle = BACKGROUND;\n ctx.fillRect(0, 0, width, height);\n\n drawGridLines(ctx);\n ctx.lineWidth = 1;\n ctx.strokeStyle = GRID_COLOR;\n ctx.stroke();\n\n // for speeds less then 60 px per second, subpixel motion is required to look smooth\n const subPixelMotion =\n ((lastTimestamp ?? 0) - (timestamp ?? 0)) / (1000 / PX_PER_SECOND);\n ctx.translate(subPixelMotion, 0);\n\n drawAreaLine(data, ctx);\n ctx.lineWidth = 2;\n ctx.strokeStyle = FOREGROUND;\n ctx.stroke();\n\n ctx.translate(-subPixelMotion, 0); // we don't pattern to shift however\n if (pattern != null) {\n ctx.fillStyle = pattern;\n }\n ctx.fill();\n ctx.setTransform(scale, 0, 0, scale, 0, 0); // reset the translate matrix to normal\n\n // generate new data points\n if ((timestamp ?? 0) - (lastTimestamp ?? 0) > 1000 / PX_PER_SECOND) {\n // number of points to add since last update\n const numberOfPoints = Math.floor(\n ((timestamp ?? 0) - (lastTimestamp ?? 0)) / (1000 / PX_PER_SECOND)\n );\n for (let i = 0; i < numberOfPoints; i += 1) {\n data.shift();\n data.push(randomWalk(data[data.length - 1]));\n }\n lastTimestamp = timestamp;\n }\n\n if (rAF != null) {\n cancelAnimationFrame(rAF);\n }\n rAF = requestAnimationFrame(drawCanvas);\n }\n\n // debounce the resize so its not overly aggresive\n const debouncedHandleResize = debounce(\n () => {\n rAF = requestAnimationFrame(timestamp => {\n setCanvasSize(); // setCanvas can cause lag if not debounced\n\n // fill or remove extra data points\n setDataSize();\n\n // opening devtools triggers a blur then resize,\n // need to reset shade as we are restarting animation\n setShade(false);\n drawCanvas(timestamp);\n });\n },\n RESIZE_DEBOUNCE,\n { leading: true } // resize immediately, once.\n );\n\n function pauseAnimation() {\n // pause animation when browser window is blurred to conserve CPU usage\n setShade(true);\n if (rAF != null) {\n cancelAnimationFrame(rAF);\n }\n rAF = null;\n lastTimestamp = null;\n }\n\n // when timeout expires, pause animation\n const resetIdleTimeout = debounce(() => {\n pauseAnimation();\n }, INTERACTION_TIMEOUT);\n\n function startAnimation() {\n // can fire multiple times, check if rAF is null first\n // restart animation loop, and fade back in\n if (rAF == null) {\n setShade(false);\n setCanvasSize();\n setDataSize();\n rAF = requestAnimationFrame(drawCanvas);\n }\n resetIdleTimeout();\n }\n\n function handleActivity() {\n if (document.hasFocus()) {\n // only if document has focus (mousemove can fire on non-focused tabs)\n startAnimation();\n }\n }\n\n function handleResize() {\n // pause and debounce animation during resize for better resizing performance\n if (rAF != null) {\n cancelAnimationFrame(rAF);\n }\n resetIdleTimeout(); // treat resizing as a form of activity\n debouncedHandleResize();\n }\n\n // react mount/unmount hooks\n useEffect(() => {\n ctx = canvas.current?.getContext('2d', { alpha: false });\n setCanvasSize();\n data = initData();\n pattern = createPatternFill();\n\n // start draw loop\n drawCanvas();\n resetIdleTimeout();\n\n window.addEventListener('resize', handleResize);\n\n window.addEventListener('focus', startAnimation);\n window.addEventListener('blur', pauseAnimation);\n\n // don't burn cpu if the user is \"idle\", start a timer that resets\n // on any user activity, and on timeout expiry pause the animation\n window.addEventListener('mousemove', handleActivity);\n window.addEventListener('keydown', handleActivity);\n\n return () => {\n if (rAF != null) {\n cancelAnimationFrame(rAF);\n }\n window.removeEventListener('resize', handleResize);\n window.removeEventListener('focus', startAnimation);\n window.removeEventListener('blur', pauseAnimation);\n\n window.removeEventListener('mousemove', handleActivity);\n window.removeEventListener('keydown', handleActivity);\n\n resetIdleTimeout.cancel();\n debouncedHandleResize.cancel();\n };\n }, []);\n\n return (\n <div className=\"random-area-plot-animation-container\" ref={container}>\n <canvas ref={canvas} className={shade ? 'shade' : ''} />\n </div>\n );\n});\n\nexport default RandomAreaPlotAnimation;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"RandomAreaPlotAnimation.js","names":["React","useEffect","useState","useRef","debounce","assertNotNull","ThemeExport","VOLATILITY","LOW","HIGH","START_Y","FOREGROUND","GRID_SIZE","GRID_COLOR","BACKGROUND","PATTERN","SIZE","DOT_SIZE","FILL_OPACITY","PX_PER_SECOND","RESIZE_DEBOUNCE","INTERACTION_TIMEOUT","RandomAreaPlotAnimation","memo","canvas","container","shade","setShade","scale","window","devicePixelRatio","ctx","pattern","width","height","rAF","lastTimestamp","data","setCanvasSize","current","offsetWidth","offsetHeight","style","createPatternFill","canvasPattern","document","createElement","contextPattern","getContext","fillStyle","fillRect","Math","round","toString","padStart","createPattern","randomWalk","prev","rand","random","change","abs","initData","startingData","y","x","push","setDataSize","length","pop","drawAreaLine","path","context","beginPath","moveTo","lineTo","i","closePath","drawGridLines","drawCanvas","timestamp","lineWidth","strokeStyle","stroke","subPixelMotion","translate","fill","setTransform","numberOfPoints","floor","shift","cancelAnimationFrame","requestAnimationFrame","debouncedHandleResize","leading","pauseAnimation","resetIdleTimeout","startAnimation","handleActivity","hasFocus","handleResize","alpha","addEventListener","removeEventListener","cancel"],"sources":["../src/RandomAreaPlotAnimation.tsx"],"sourcesContent":["/* eslint-disable react-hooks/exhaustive-deps */\n/* eslint-disable react/display-name */\n\nimport React, { useEffect, useState, useRef } from 'react';\nimport debounce from 'lodash.debounce';\nimport { assertNotNull } from '@deephaven/utils';\nimport './RandomAreaPlotAnimation.scss';\nimport ThemeExport from './ThemeExport';\n\nconst VOLATILITY = 0.025; // how spikey the data gets\nconst LOW = 0.9;\nconst HIGH = 0.1;\nconst START_Y = 0.618;\nconst FOREGROUND = ThemeExport['primary-dark'];\nconst GRID_SIZE = 80;\nconst GRID_COLOR = ThemeExport['gray-800'];\nconst BACKGROUND = ThemeExport['gray-900'];\nconst PATTERN = { SIZE: 8, DOT_SIZE: 2, FILL_OPACITY: 0.25 };\nconst PX_PER_SECOND = 18;\nconst RESIZE_DEBOUNCE = 250;\nconst INTERACTION_TIMEOUT = 60 * 1000;\n\n// Draw a background canvas, paint it with a fun chart looking animation\nconst RandomAreaPlotAnimation = React.memo(() => {\n const canvas = useRef<HTMLCanvasElement>(null);\n const container = useRef<HTMLDivElement>(null);\n const [shade, setShade] = useState(false);\n const scale = window.devicePixelRatio;\n\n let ctx: CanvasRenderingContext2D | null | undefined;\n let pattern: CanvasPattern | null | undefined;\n let width: number;\n let height: number;\n let rAF: number | null;\n\n let lastTimestamp: DOMHighResTimeStamp | null | undefined = null;\n let data: number[] = [];\n\n function setCanvasSize(): void {\n // Set canvas size to fill screen\n if (container.current != null) {\n width = container.current.offsetWidth;\n height = container.current.offsetHeight;\n }\n\n if (canvas.current != null) {\n canvas.current.style.width = `${width}px`;\n canvas.current.style.height = `${height}px`;\n\n canvas.current.width = width * scale;\n canvas.current.height = height * scale;\n }\n\n ctx?.scale(scale, scale);\n }\n\n // Returns the background fill create offscreen as pattern\n function createPatternFill(): CanvasPattern | null | undefined {\n // create the off-screen canvas\n const canvasPattern = document.createElement('canvas');\n canvasPattern.width = PATTERN.SIZE;\n canvasPattern.height = PATTERN.SIZE;\n const contextPattern = canvasPattern.getContext('2d');\n\n // draw pattern to off-screen context\n if (contextPattern != null) {\n contextPattern.fillStyle = FOREGROUND;\n contextPattern.fillRect(0, 0, PATTERN.DOT_SIZE, PATTERN.DOT_SIZE);\n\n // add an overlay fill\n contextPattern.fillStyle =\n FOREGROUND +\n Math.round(255 * PATTERN.FILL_OPACITY)\n .toString(16)\n .padStart(2, '0'); // adds opacity in hex to color\n contextPattern.fillRect(0, 0, PATTERN.SIZE, PATTERN.SIZE);\n }\n return contextPattern?.createPattern(canvasPattern, 'repeat');\n }\n\n /**\n * Generates a step in a random walk between LOW - HIGH given a previous value\n * data is always in 0-1 data space so its scaleable\n * data space is converted to screen space inside draw functions\n * @param prev previous random walk step\n * @return new random walk step\n */\n function randomWalk(prev: number): number {\n const rand = Math.random() - 0.5; // give it directionality\n let change = VOLATILITY * rand; // scale by volatity constant\n\n // ensure directional bounce off approaching edges\n if (prev < HIGH) {\n change = Math.abs(change);\n } else if (prev > LOW) {\n change = -Math.abs(change);\n }\n\n return prev + change;\n }\n\n function initData(): number[] {\n const startingData = [];\n let y = START_Y; // always start towards the bottom of the screen\n for (let x = 0; x < width + PX_PER_SECOND; x += 1) {\n y = randomWalk(y);\n startingData.push(y);\n }\n return startingData;\n }\n\n function setDataSize(): void {\n while (data.length >= width + PX_PER_SECOND) {\n data.pop();\n }\n while (data.length < width + PX_PER_SECOND) {\n data.push(randomWalk(data[data.length - 1]));\n }\n }\n\n function drawAreaLine(\n path: number[],\n context: CanvasRenderingContext2D\n ): void {\n context.beginPath();\n // start offscreen\n context.moveTo(-1, height + 1);\n context.lineTo(-1, height * path[0]);\n\n // draw the line\n for (let i = 0; i < path.length; i += 1) {\n context.lineTo(i, height * path[i]);\n }\n\n // close offscreen\n context.lineTo(width + PX_PER_SECOND, height * path[path.length - 1]);\n context.lineTo(width + PX_PER_SECOND, height + 1);\n context.closePath();\n }\n\n function drawGridLines(context: CanvasRenderingContext2D): void {\n context.beginPath();\n // draw verticals\n for (let x = 1; x < width; x += GRID_SIZE) {\n context.moveTo(x, 0);\n context.lineTo(x, height);\n }\n // draw horizontals\n for (let y = 1; y < height; y += GRID_SIZE) {\n context.moveTo(0, y);\n context.lineTo(width, y);\n }\n }\n\n /**\n * Main draw loop for where the animation happens\n * all the styling happens within drawCanvas from paths generated by other functions\n * @param timestamp passed in callback from requestAnimationFrame\n */\n function drawCanvas(timestamp?: DOMHighResTimeStamp): void {\n lastTimestamp = lastTimestamp ?? timestamp;\n\n assertNotNull(ctx);\n // clear the canvas\n ctx.fillStyle = BACKGROUND;\n ctx.fillRect(0, 0, width, height);\n\n drawGridLines(ctx);\n ctx.lineWidth = 1;\n ctx.strokeStyle = GRID_COLOR;\n ctx.stroke();\n\n // for speeds less then 60 px per second, subpixel motion is required to look smooth\n const subPixelMotion =\n ((lastTimestamp ?? 0) - (timestamp ?? 0)) / (1000 / PX_PER_SECOND);\n ctx.translate(subPixelMotion, 0);\n\n drawAreaLine(data, ctx);\n ctx.lineWidth = 2;\n ctx.strokeStyle = FOREGROUND;\n ctx.stroke();\n\n ctx.translate(-subPixelMotion, 0); // we don't pattern to shift however\n if (pattern != null) {\n ctx.fillStyle = pattern;\n }\n ctx.fill();\n ctx.setTransform(scale, 0, 0, scale, 0, 0); // reset the translate matrix to normal\n\n // generate new data points\n if ((timestamp ?? 0) - (lastTimestamp ?? 0) > 1000 / PX_PER_SECOND) {\n // number of points to add since last update\n const numberOfPoints = Math.floor(\n ((timestamp ?? 0) - (lastTimestamp ?? 0)) / (1000 / PX_PER_SECOND)\n );\n for (let i = 0; i < numberOfPoints; i += 1) {\n data.shift();\n data.push(randomWalk(data[data.length - 1]));\n }\n lastTimestamp = timestamp;\n }\n\n if (rAF != null) {\n cancelAnimationFrame(rAF);\n }\n rAF = requestAnimationFrame(drawCanvas);\n }\n\n // debounce the resize so its not overly aggresive\n const debouncedHandleResize = debounce(\n () => {\n rAF = requestAnimationFrame(timestamp => {\n setCanvasSize(); // setCanvas can cause lag if not debounced\n\n // fill or remove extra data points\n setDataSize();\n\n // opening devtools triggers a blur then resize,\n // need to reset shade as we are restarting animation\n setShade(false);\n drawCanvas(timestamp);\n });\n },\n RESIZE_DEBOUNCE,\n { leading: true } // resize immediately, once.\n );\n\n function pauseAnimation(): void {\n // pause animation when browser window is blurred to conserve CPU usage\n setShade(true);\n if (rAF != null) {\n cancelAnimationFrame(rAF);\n }\n rAF = null;\n lastTimestamp = null;\n }\n\n // when timeout expires, pause animation\n const resetIdleTimeout = debounce(() => {\n pauseAnimation();\n }, INTERACTION_TIMEOUT);\n\n function startAnimation(): void {\n // can fire multiple times, check if rAF is null first\n // restart animation loop, and fade back in\n if (rAF == null) {\n setShade(false);\n setCanvasSize();\n setDataSize();\n rAF = requestAnimationFrame(drawCanvas);\n }\n resetIdleTimeout();\n }\n\n function handleActivity(): void {\n if (document.hasFocus()) {\n // only if document has focus (mousemove can fire on non-focused tabs)\n startAnimation();\n }\n }\n\n function handleResize(): void {\n // pause and debounce animation during resize for better resizing performance\n if (rAF != null) {\n cancelAnimationFrame(rAF);\n }\n resetIdleTimeout(); // treat resizing as a form of activity\n debouncedHandleResize();\n }\n\n // react mount/unmount hooks\n useEffect(() => {\n ctx = canvas.current?.getContext('2d', { alpha: false });\n setCanvasSize();\n data = initData();\n pattern = createPatternFill();\n\n // start draw loop\n drawCanvas();\n resetIdleTimeout();\n\n window.addEventListener('resize', handleResize);\n\n window.addEventListener('focus', startAnimation);\n window.addEventListener('blur', pauseAnimation);\n\n // don't burn cpu if the user is \"idle\", start a timer that resets\n // on any user activity, and on timeout expiry pause the animation\n window.addEventListener('mousemove', handleActivity);\n window.addEventListener('keydown', handleActivity);\n\n return () => {\n if (rAF != null) {\n cancelAnimationFrame(rAF);\n }\n window.removeEventListener('resize', handleResize);\n window.removeEventListener('focus', startAnimation);\n window.removeEventListener('blur', pauseAnimation);\n\n window.removeEventListener('mousemove', handleActivity);\n window.removeEventListener('keydown', handleActivity);\n\n resetIdleTimeout.cancel();\n debouncedHandleResize.cancel();\n };\n }, []);\n\n return (\n <div className=\"random-area-plot-animation-container\" ref={container}>\n <canvas ref={canvas} className={shade ? 'shade' : ''} />\n </div>\n );\n});\n\nexport default RandomAreaPlotAnimation;\n"],"mappings":"AAAA;AACA;;AAEA,OAAOA,KAAK,IAAIC,SAAS,EAAEC,QAAQ,EAAEC,MAAM,QAAQ,OAAO;AAC1D,OAAOC,QAAQ,MAAM,iBAAiB;AACtC,SAASC,aAAa,QAAQ,kBAAkB;AAAC;AAAA,OAE1CC,WAAW;AAAA;AAElB,IAAMC,UAAU,GAAG,KAAK,CAAC,CAAC;AAC1B,IAAMC,GAAG,GAAG,GAAG;AACf,IAAMC,IAAI,GAAG,GAAG;AAChB,IAAMC,OAAO,GAAG,KAAK;AACrB,IAAMC,UAAU,GAAGL,WAAW,CAAC,cAAc,CAAC;AAC9C,IAAMM,SAAS,GAAG,EAAE;AACpB,IAAMC,UAAU,GAAGP,WAAW,CAAC,UAAU,CAAC;AAC1C,IAAMQ,UAAU,GAAGR,WAAW,CAAC,UAAU,CAAC;AAC1C,IAAMS,OAAO,GAAG;EAAEC,IAAI,EAAE,CAAC;EAAEC,QAAQ,EAAE,CAAC;EAAEC,YAAY,EAAE;AAAK,CAAC;AAC5D,IAAMC,aAAa,GAAG,EAAE;AACxB,IAAMC,eAAe,GAAG,GAAG;AAC3B,IAAMC,mBAAmB,GAAG,EAAE,GAAG,IAAI;;AAErC;AACA,IAAMC,uBAAuB,gBAAGtB,KAAK,CAACuB,IAAI,CAAC,MAAM;EAC/C,IAAMC,MAAM,GAAGrB,MAAM,CAAoB,IAAI,CAAC;EAC9C,IAAMsB,SAAS,GAAGtB,MAAM,CAAiB,IAAI,CAAC;EAC9C,IAAM,CAACuB,KAAK,EAAEC,QAAQ,CAAC,GAAGzB,QAAQ,CAAC,KAAK,CAAC;EACzC,IAAM0B,KAAK,GAAGC,MAAM,CAACC,gBAAgB;EAErC,IAAIC,GAAgD;EACpD,IAAIC,OAAyC;EAC7C,IAAIC,KAAa;EACjB,IAAIC,MAAc;EAClB,IAAIC,GAAkB;EAEtB,IAAIC,aAAqD,GAAG,IAAI;EAChE,IAAIC,IAAc,GAAG,EAAE;EAEvB,SAASC,aAAa,GAAS;IAAA;IAC7B;IACA,IAAIb,SAAS,CAACc,OAAO,IAAI,IAAI,EAAE;MAC7BN,KAAK,GAAGR,SAAS,CAACc,OAAO,CAACC,WAAW;MACrCN,MAAM,GAAGT,SAAS,CAACc,OAAO,CAACE,YAAY;IACzC;IAEA,IAAIjB,MAAM,CAACe,OAAO,IAAI,IAAI,EAAE;MAC1Bf,MAAM,CAACe,OAAO,CAACG,KAAK,CAACT,KAAK,aAAMA,KAAK,OAAI;MACzCT,MAAM,CAACe,OAAO,CAACG,KAAK,CAACR,MAAM,aAAMA,MAAM,OAAI;MAE3CV,MAAM,CAACe,OAAO,CAACN,KAAK,GAAGA,KAAK,GAAGL,KAAK;MACpCJ,MAAM,CAACe,OAAO,CAACL,MAAM,GAAGA,MAAM,GAAGN,KAAK;IACxC;IAEA,QAAAG,GAAG,yCAAH,KAAKH,KAAK,CAACA,KAAK,EAAEA,KAAK,CAAC;EAC1B;;EAEA;EACA,SAASe,iBAAiB,GAAqC;IAC7D;IACA,IAAMC,aAAa,GAAGC,QAAQ,CAACC,aAAa,CAAC,QAAQ,CAAC;IACtDF,aAAa,CAACX,KAAK,GAAGlB,OAAO,CAACC,IAAI;IAClC4B,aAAa,CAACV,MAAM,GAAGnB,OAAO,CAACC,IAAI;IACnC,IAAM+B,cAAc,GAAGH,aAAa,CAACI,UAAU,CAAC,IAAI,CAAC;;IAErD;IACA,IAAID,cAAc,IAAI,IAAI,EAAE;MAC1BA,cAAc,CAACE,SAAS,GAAGtC,UAAU;MACrCoC,cAAc,CAACG,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAEnC,OAAO,CAACE,QAAQ,EAAEF,OAAO,CAACE,QAAQ,CAAC;;MAEjE;MACA8B,cAAc,CAACE,SAAS,GACtBtC,UAAU,GACVwC,IAAI,CAACC,KAAK,CAAC,GAAG,GAAGrC,OAAO,CAACG,YAAY,CAAC,CACnCmC,QAAQ,CAAC,EAAE,CAAC,CACZC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC;MACvBP,cAAc,CAACG,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAEnC,OAAO,CAACC,IAAI,EAAED,OAAO,CAACC,IAAI,CAAC;IAC3D;IACA,OAAO+B,cAAc,aAAdA,cAAc,uBAAdA,cAAc,CAAEQ,aAAa,CAACX,aAAa,EAAE,QAAQ,CAAC;EAC/D;;EAEA;AACF;AACA;AACA;AACA;AACA;AACA;EACE,SAASY,UAAU,CAACC,IAAY,EAAU;IACxC,IAAMC,IAAI,GAAGP,IAAI,CAACQ,MAAM,EAAE,GAAG,GAAG,CAAC,CAAC;IAClC,IAAIC,MAAM,GAAGrD,UAAU,GAAGmD,IAAI,CAAC,CAAC;;IAEhC;IACA,IAAID,IAAI,GAAGhD,IAAI,EAAE;MACfmD,MAAM,GAAGT,IAAI,CAACU,GAAG,CAACD,MAAM,CAAC;IAC3B,CAAC,MAAM,IAAIH,IAAI,GAAGjD,GAAG,EAAE;MACrBoD,MAAM,GAAG,CAACT,IAAI,CAACU,GAAG,CAACD,MAAM,CAAC;IAC5B;IAEA,OAAOH,IAAI,GAAGG,MAAM;EACtB;EAEA,SAASE,QAAQ,GAAa;IAC5B,IAAMC,YAAY,GAAG,EAAE;IACvB,IAAIC,CAAC,GAAGtD,OAAO,CAAC,CAAC;IACjB,KAAK,IAAIuD,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGhC,KAAK,GAAGd,aAAa,EAAE8C,CAAC,IAAI,CAAC,EAAE;MACjDD,CAAC,GAAGR,UAAU,CAACQ,CAAC,CAAC;MACjBD,YAAY,CAACG,IAAI,CAACF,CAAC,CAAC;IACtB;IACA,OAAOD,YAAY;EACrB;EAEA,SAASI,WAAW,GAAS;IAC3B,OAAO9B,IAAI,CAAC+B,MAAM,IAAInC,KAAK,GAAGd,aAAa,EAAE;MAC3CkB,IAAI,CAACgC,GAAG,EAAE;IACZ;IACA,OAAOhC,IAAI,CAAC+B,MAAM,GAAGnC,KAAK,GAAGd,aAAa,EAAE;MAC1CkB,IAAI,CAAC6B,IAAI,CAACV,UAAU,CAACnB,IAAI,CAACA,IAAI,CAAC+B,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC;IAC9C;EACF;EAEA,SAASE,YAAY,CACnBC,IAAc,EACdC,OAAiC,EAC3B;IACNA,OAAO,CAACC,SAAS,EAAE;IACnB;IACAD,OAAO,CAACE,MAAM,CAAC,CAAC,CAAC,EAAExC,MAAM,GAAG,CAAC,CAAC;IAC9BsC,OAAO,CAACG,MAAM,CAAC,CAAC,CAAC,EAAEzC,MAAM,GAAGqC,IAAI,CAAC,CAAC,CAAC,CAAC;;IAEpC;IACA,KAAK,IAAIK,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGL,IAAI,CAACH,MAAM,EAAEQ,CAAC,IAAI,CAAC,EAAE;MACvCJ,OAAO,CAACG,MAAM,CAACC,CAAC,EAAE1C,MAAM,GAAGqC,IAAI,CAACK,CAAC,CAAC,CAAC;IACrC;;IAEA;IACAJ,OAAO,CAACG,MAAM,CAAC1C,KAAK,GAAGd,aAAa,EAAEe,MAAM,GAAGqC,IAAI,CAACA,IAAI,CAACH,MAAM,GAAG,CAAC,CAAC,CAAC;IACrEI,OAAO,CAACG,MAAM,CAAC1C,KAAK,GAAGd,aAAa,EAAEe,MAAM,GAAG,CAAC,CAAC;IACjDsC,OAAO,CAACK,SAAS,EAAE;EACrB;EAEA,SAASC,aAAa,CAACN,OAAiC,EAAQ;IAC9DA,OAAO,CAACC,SAAS,EAAE;IACnB;IACA,KAAK,IAAIR,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGhC,KAAK,EAAEgC,CAAC,IAAIrD,SAAS,EAAE;MACzC4D,OAAO,CAACE,MAAM,CAACT,CAAC,EAAE,CAAC,CAAC;MACpBO,OAAO,CAACG,MAAM,CAACV,CAAC,EAAE/B,MAAM,CAAC;IAC3B;IACA;IACA,KAAK,IAAI8B,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAG9B,MAAM,EAAE8B,CAAC,IAAIpD,SAAS,EAAE;MAC1C4D,OAAO,CAACE,MAAM,CAAC,CAAC,EAAEV,CAAC,CAAC;MACpBQ,OAAO,CAACG,MAAM,CAAC1C,KAAK,EAAE+B,CAAC,CAAC;IAC1B;EACF;;EAEA;AACF;AACA;AACA;AACA;EACE,SAASe,UAAU,CAACC,SAA+B,EAAQ;IAAA;IACzD5C,aAAa,qBAAGA,aAAa,2DAAI4C,SAAS;IAE1C3E,aAAa,CAAC0B,GAAG,CAAC;IAClB;IACAA,GAAG,CAACkB,SAAS,GAAGnC,UAAU;IAC1BiB,GAAG,CAACmB,QAAQ,CAAC,CAAC,EAAE,CAAC,EAAEjB,KAAK,EAAEC,MAAM,CAAC;IAEjC4C,aAAa,CAAC/C,GAAG,CAAC;IAClBA,GAAG,CAACkD,SAAS,GAAG,CAAC;IACjBlD,GAAG,CAACmD,WAAW,GAAGrE,UAAU;IAC5BkB,GAAG,CAACoD,MAAM,EAAE;;IAEZ;IACA,IAAMC,cAAc,GAClB,CAAC,oBAAChD,aAAa,6DAAI,CAAC,KAAK4C,SAAS,aAATA,SAAS,cAATA,SAAS,GAAI,CAAC,CAAC,KAAK,IAAI,GAAG7D,aAAa,CAAC;IACpEY,GAAG,CAACsD,SAAS,CAACD,cAAc,EAAE,CAAC,CAAC;IAEhCd,YAAY,CAACjC,IAAI,EAAEN,GAAG,CAAC;IACvBA,GAAG,CAACkD,SAAS,GAAG,CAAC;IACjBlD,GAAG,CAACmD,WAAW,GAAGvE,UAAU;IAC5BoB,GAAG,CAACoD,MAAM,EAAE;IAEZpD,GAAG,CAACsD,SAAS,CAAC,CAACD,cAAc,EAAE,CAAC,CAAC,CAAC,CAAC;IACnC,IAAIpD,OAAO,IAAI,IAAI,EAAE;MACnBD,GAAG,CAACkB,SAAS,GAAGjB,OAAO;IACzB;IACAD,GAAG,CAACuD,IAAI,EAAE;IACVvD,GAAG,CAACwD,YAAY,CAAC3D,KAAK,EAAE,CAAC,EAAE,CAAC,EAAEA,KAAK,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;;IAE5C;IACA,IAAI,CAACoD,SAAS,aAATA,SAAS,cAATA,SAAS,GAAI,CAAC,wBAAK5C,aAAa,6DAAI,CAAC,CAAC,GAAG,IAAI,GAAGjB,aAAa,EAAE;MAAA;MAClE;MACA,IAAMqE,cAAc,GAAGrC,IAAI,CAACsC,KAAK,CAC/B,CAAC,CAACT,SAAS,aAATA,SAAS,cAATA,SAAS,GAAI,CAAC,wBAAK5C,aAAa,6DAAI,CAAC,CAAC,KAAK,IAAI,GAAGjB,aAAa,CAAC,CACnE;MACD,KAAK,IAAIyD,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGY,cAAc,EAAEZ,CAAC,IAAI,CAAC,EAAE;QAC1CvC,IAAI,CAACqD,KAAK,EAAE;QACZrD,IAAI,CAAC6B,IAAI,CAACV,UAAU,CAACnB,IAAI,CAACA,IAAI,CAAC+B,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC;MAC9C;MACAhC,aAAa,GAAG4C,SAAS;IAC3B;IAEA,IAAI7C,GAAG,IAAI,IAAI,EAAE;MACfwD,oBAAoB,CAACxD,GAAG,CAAC;IAC3B;IACAA,GAAG,GAAGyD,qBAAqB,CAACb,UAAU,CAAC;EACzC;;EAEA;EACA,IAAMc,qBAAqB,GAAGzF,QAAQ,CACpC,MAAM;IACJ+B,GAAG,GAAGyD,qBAAqB,CAACZ,SAAS,IAAI;MACvC1C,aAAa,EAAE,CAAC,CAAC;;MAEjB;MACA6B,WAAW,EAAE;;MAEb;MACA;MACAxC,QAAQ,CAAC,KAAK,CAAC;MACfoD,UAAU,CAACC,SAAS,CAAC;IACvB,CAAC,CAAC;EACJ,CAAC,EACD5D,eAAe,EACf;IAAE0E,OAAO,EAAE;EAAK,CAAC,CAAC;EAAA,CACnB;;EAED,SAASC,cAAc,GAAS;IAC9B;IACApE,QAAQ,CAAC,IAAI,CAAC;IACd,IAAIQ,GAAG,IAAI,IAAI,EAAE;MACfwD,oBAAoB,CAACxD,GAAG,CAAC;IAC3B;IACAA,GAAG,GAAG,IAAI;IACVC,aAAa,GAAG,IAAI;EACtB;;EAEA;EACA,IAAM4D,gBAAgB,GAAG5F,QAAQ,CAAC,MAAM;IACtC2F,cAAc,EAAE;EAClB,CAAC,EAAE1E,mBAAmB,CAAC;EAEvB,SAAS4E,cAAc,GAAS;IAC9B;IACA;IACA,IAAI9D,GAAG,IAAI,IAAI,EAAE;MACfR,QAAQ,CAAC,KAAK,CAAC;MACfW,aAAa,EAAE;MACf6B,WAAW,EAAE;MACbhC,GAAG,GAAGyD,qBAAqB,CAACb,UAAU,CAAC;IACzC;IACAiB,gBAAgB,EAAE;EACpB;EAEA,SAASE,cAAc,GAAS;IAC9B,IAAIrD,QAAQ,CAACsD,QAAQ,EAAE,EAAE;MACvB;MACAF,cAAc,EAAE;IAClB;EACF;EAEA,SAASG,YAAY,GAAS;IAC5B;IACA,IAAIjE,GAAG,IAAI,IAAI,EAAE;MACfwD,oBAAoB,CAACxD,GAAG,CAAC;IAC3B;IACA6D,gBAAgB,EAAE,CAAC,CAAC;IACpBH,qBAAqB,EAAE;EACzB;;EAEA;EACA5F,SAAS,CAAC,MAAM;IAAA;IACd8B,GAAG,sBAAGP,MAAM,CAACe,OAAO,oDAAd,gBAAgBS,UAAU,CAAC,IAAI,EAAE;MAAEqD,KAAK,EAAE;IAAM,CAAC,CAAC;IACxD/D,aAAa,EAAE;IACfD,IAAI,GAAGyB,QAAQ,EAAE;IACjB9B,OAAO,GAAGW,iBAAiB,EAAE;;IAE7B;IACAoC,UAAU,EAAE;IACZiB,gBAAgB,EAAE;IAElBnE,MAAM,CAACyE,gBAAgB,CAAC,QAAQ,EAAEF,YAAY,CAAC;IAE/CvE,MAAM,CAACyE,gBAAgB,CAAC,OAAO,EAAEL,cAAc,CAAC;IAChDpE,MAAM,CAACyE,gBAAgB,CAAC,MAAM,EAAEP,cAAc,CAAC;;IAE/C;IACA;IACAlE,MAAM,CAACyE,gBAAgB,CAAC,WAAW,EAAEJ,cAAc,CAAC;IACpDrE,MAAM,CAACyE,gBAAgB,CAAC,SAAS,EAAEJ,cAAc,CAAC;IAElD,OAAO,MAAM;MACX,IAAI/D,GAAG,IAAI,IAAI,EAAE;QACfwD,oBAAoB,CAACxD,GAAG,CAAC;MAC3B;MACAN,MAAM,CAAC0E,mBAAmB,CAAC,QAAQ,EAAEH,YAAY,CAAC;MAClDvE,MAAM,CAAC0E,mBAAmB,CAAC,OAAO,EAAEN,cAAc,CAAC;MACnDpE,MAAM,CAAC0E,mBAAmB,CAAC,MAAM,EAAER,cAAc,CAAC;MAElDlE,MAAM,CAAC0E,mBAAmB,CAAC,WAAW,EAAEL,cAAc,CAAC;MACvDrE,MAAM,CAAC0E,mBAAmB,CAAC,SAAS,EAAEL,cAAc,CAAC;MAErDF,gBAAgB,CAACQ,MAAM,EAAE;MACzBX,qBAAqB,CAACW,MAAM,EAAE;IAChC,CAAC;EACH,CAAC,EAAE,EAAE,CAAC;EAEN,oBACE;IAAK,SAAS,EAAC,sCAAsC;IAAC,GAAG,EAAE/E,SAAU;IAAA,uBACnE;MAAQ,GAAG,EAAED,MAAO;MAAC,SAAS,EAAEE,KAAK,GAAG,OAAO,GAAG;IAAG;EAAG,EACpD;AAEV,CAAC,CAAC;AAEF,eAAeJ,uBAAuB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SearchableCombobox.d.ts","sourceRoot":"","sources":["../src/SearchableCombobox.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,GAAG,EAAe,MAAM,OAAO,CAAC;AACzC,OAAO,EAAkB,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AAE9E,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,wBAAwB,CAAC;AAGrE,MAAM,WAAW,uBAAuB,CAAC,KAAK,EAAE,IAAI,SAAS,GAAG,CAC9D,SAAQ,IAAI,CACV,qBAAqB,CAAC,KAAK,CAAC,EAC5B,UAAU,GAAG,aAAa,GAAG,mBAAmB,CACjD;IACD,kBAAkB,EAAE,CAAC,IAAI,EAAE,KAAK,GAAG,IAAI,GAAG,SAAS,KAAK,MAAM,GAAG,IAAI,CAAC;IACtE,MAAM,EAAE,CAAC,IAAI,EAAE,KAAK,GAAG,IAAI,GAAG,SAAS,KAAK,IAAI,GAAG,IAAI,CAAC;IACxD,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,sBAAsB,CAAC,WAAW,CAAC,CAAC,CAAC;IAChE,iBAAiB,EAAE,CAAC,GAAG,EAAE,IAAI,GAAG,IAAI,KAAK,IAAI,CAAC;CAC/C;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,IAAI,SAAS,GAAG,EAAE,EAC1D,SAAS,EACT,kBAAkB,EAClB,MAAM,EACN,GAAG,KAAK,EACT,EAAE,uBAAuB,CAAC,KAAK,EAAE,IAAI,CAAC,
|
|
1
|
+
{"version":3,"file":"SearchableCombobox.d.ts","sourceRoot":"","sources":["../src/SearchableCombobox.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,GAAG,EAAe,MAAM,OAAO,CAAC;AACzC,OAAO,EAAkB,qBAAqB,EAAE,MAAM,uBAAuB,CAAC;AAE9E,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,wBAAwB,CAAC;AAGrE,MAAM,WAAW,uBAAuB,CAAC,KAAK,EAAE,IAAI,SAAS,GAAG,CAC9D,SAAQ,IAAI,CACV,qBAAqB,CAAC,KAAK,CAAC,EAC5B,UAAU,GAAG,aAAa,GAAG,mBAAmB,CACjD;IACD,kBAAkB,EAAE,CAAC,IAAI,EAAE,KAAK,GAAG,IAAI,GAAG,SAAS,KAAK,MAAM,GAAG,IAAI,CAAC;IACtE,MAAM,EAAE,CAAC,IAAI,EAAE,KAAK,GAAG,IAAI,GAAG,SAAS,KAAK,IAAI,GAAG,IAAI,CAAC;IACxD,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,sBAAsB,CAAC,WAAW,CAAC,CAAC,CAAC;IAChE,iBAAiB,EAAE,CAAC,GAAG,EAAE,IAAI,GAAG,IAAI,KAAK,IAAI,CAAC;CAC/C;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,IAAI,SAAS,GAAG,EAAE,EAC1D,SAAS,EACT,kBAAkB,EAClB,MAAM,EACN,GAAG,KAAK,EACT,EAAE,uBAAuB,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,GAAG,CAAC,OAAO,CA4BpD;AAED,eAAe,kBAAkB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SearchableCombobox.js","names":["useCallback","ComboBox","Item","TextWithTooltip","SearchableCombobox","scrollRef","getItemDisplayText","getKey","props","renderItem","item","key","displayText","String","onSelectionChange"],"sources":["../src/SearchableCombobox.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\nimport { Key, useCallback } from 'react';\nimport { ComboBox, Item, SpectrumComboBoxProps } from '@adobe/react-spectrum';\nimport type { FocusableRef } from '@react-types/shared';\nimport type { ReactSpectrumComponent } from '@deephaven/react-hooks';\nimport TextWithTooltip from './TextWithTooltip';\n\nexport interface SearchableComboboxProps<TItem, TKey extends Key>\n extends Omit<\n SpectrumComboBoxProps<TItem>,\n 'children' | 'menuTrigger' | 'onSelectionChange'\n > {\n getItemDisplayText: (item: TItem | null | undefined) => string | null;\n getKey: (item: TItem | null | undefined) => TKey | null;\n scrollRef: React.RefObject<ReactSpectrumComponent<HTMLElement>>;\n onSelectionChange: (key: TKey | null) => void;\n}\n\nexport function SearchableCombobox<TItem, TKey extends Key>({\n scrollRef,\n getItemDisplayText,\n getKey,\n ...props\n}: SearchableComboboxProps<TItem, TKey>) {\n const renderItem = useCallback(\n item => {\n const key = getKey(item);\n const displayText = getItemDisplayText(item);\n\n return (\n <Item key={key} textValue={displayText ?? String(key)}>\n <TextWithTooltip text={displayText} />\n </Item>\n );\n },\n [getItemDisplayText, getKey]\n );\n\n return (\n <ComboBox\n {...props}\n // The `ref`prop type defined by React Spectrum is incorrect here\n ref={scrollRef as unknown as FocusableRef<HTMLElement>}\n menuTrigger=\"focus\"\n // Type assertion is necessary since <ComboBox> types don't recognize the\n // generic key arg\n onSelectionChange={props.onSelectionChange as (key: Key | null) => void}\n >\n {renderItem}\n </ComboBox>\n );\n}\n\nexport default SearchableCombobox;\n"],"mappings":";;;;;;;;AAAA;AACA,SAAcA,WAAW,QAAQ,OAAO;AACxC,SAASC,QAAQ,EAAEC,IAAI,QAA+B,uBAAuB;AAAC,OAGvEC,eAAe;AAAA;AAatB,OAAO,SAASC,kBAAkB,
|
|
1
|
+
{"version":3,"file":"SearchableCombobox.js","names":["useCallback","ComboBox","Item","TextWithTooltip","SearchableCombobox","scrollRef","getItemDisplayText","getKey","props","renderItem","item","key","displayText","String","onSelectionChange"],"sources":["../src/SearchableCombobox.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\nimport { Key, useCallback } from 'react';\nimport { ComboBox, Item, SpectrumComboBoxProps } from '@adobe/react-spectrum';\nimport type { FocusableRef } from '@react-types/shared';\nimport type { ReactSpectrumComponent } from '@deephaven/react-hooks';\nimport TextWithTooltip from './TextWithTooltip';\n\nexport interface SearchableComboboxProps<TItem, TKey extends Key>\n extends Omit<\n SpectrumComboBoxProps<TItem>,\n 'children' | 'menuTrigger' | 'onSelectionChange'\n > {\n getItemDisplayText: (item: TItem | null | undefined) => string | null;\n getKey: (item: TItem | null | undefined) => TKey | null;\n scrollRef: React.RefObject<ReactSpectrumComponent<HTMLElement>>;\n onSelectionChange: (key: TKey | null) => void;\n}\n\nexport function SearchableCombobox<TItem, TKey extends Key>({\n scrollRef,\n getItemDisplayText,\n getKey,\n ...props\n}: SearchableComboboxProps<TItem, TKey>): JSX.Element {\n const renderItem = useCallback(\n item => {\n const key = getKey(item);\n const displayText = getItemDisplayText(item);\n\n return (\n <Item key={key} textValue={displayText ?? String(key)}>\n <TextWithTooltip text={displayText} />\n </Item>\n );\n },\n [getItemDisplayText, getKey]\n );\n\n return (\n <ComboBox\n {...props}\n // The `ref`prop type defined by React Spectrum is incorrect here\n ref={scrollRef as unknown as FocusableRef<HTMLElement>}\n menuTrigger=\"focus\"\n // Type assertion is necessary since <ComboBox> types don't recognize the\n // generic key arg\n onSelectionChange={props.onSelectionChange as (key: Key | null) => void}\n >\n {renderItem}\n </ComboBox>\n );\n}\n\nexport default SearchableCombobox;\n"],"mappings":";;;;;;;;AAAA;AACA,SAAcA,WAAW,QAAQ,OAAO;AACxC,SAASC,QAAQ,EAAEC,IAAI,QAA+B,uBAAuB;AAAC,OAGvEC,eAAe;AAAA;AAatB,OAAO,SAASC,kBAAkB,OAKoB;EAAA,IALM;MAC1DC,SAAS;MACTC,kBAAkB;MAClBC;IAEoC,CAAC;IADlCC,KAAK;EAER,IAAMC,UAAU,GAAGT,WAAW,CAC5BU,IAAI,IAAI;IACN,IAAMC,GAAG,GAAGJ,MAAM,CAACG,IAAI,CAAC;IACxB,IAAME,WAAW,GAAGN,kBAAkB,CAACI,IAAI,CAAC;IAE5C,oBACE,KAAC,IAAI;MAAW,SAAS,EAAEE,WAAW,aAAXA,WAAW,cAAXA,WAAW,GAAIC,MAAM,CAACF,GAAG,CAAE;MAAA,uBACpD,KAAC,eAAe;QAAC,IAAI,EAAEC;MAAY;IAAG,GAD7BD,GAAG,CAEP;EAEX,CAAC,EACD,CAACL,kBAAkB,EAAEC,MAAM,CAAC,CAC7B;EAED,oBACE,KAAC,QAAQ,kCACHC,KAAK;IACT;IACA,GAAG,EAAEH,SAAkD;IACvD,WAAW,EAAC;IACZ;IACA;IAAA;IACA,iBAAiB,EAAEG,KAAK,CAACM,iBAA+C;IAAA,UAEvEL;EAAU,GACF;AAEf;AAEA,eAAeL,kBAAkB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TableViewEmptyState.d.ts","sourceRoot":"","sources":["../src/TableViewEmptyState.tsx"],"names":[],"mappings":";AAYA,MAAM,WAAW,wBAAwB;IACvC,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,wBAAgB,mBAAmB,CAAC,EAClC,OAAO,EACP,OAAO,EACP,OAA0B,GAC3B,EAAE,wBAAwB,
|
|
1
|
+
{"version":3,"file":"TableViewEmptyState.d.ts","sourceRoot":"","sources":["../src/TableViewEmptyState.tsx"],"names":[],"mappings":";AAYA,MAAM,WAAW,wBAAwB;IACvC,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,wBAAgB,mBAAmB,CAAC,EAClC,OAAO,EACP,OAAO,EACP,OAA0B,GAC3B,EAAE,wBAAwB,GAAG,GAAG,CAAC,OAAO,GAAG,IAAI,CAuB/C;AAED,eAAe,mBAAmB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TableViewEmptyState.js","names":["useEffect","useState","FontAwesomeIcon","Content","Heading","Icon","IllustratedMessage","vsEmptyWindow","DEFAULT_DELAY_MS","TableViewEmptyState","heading","content","delayMs","show","setShow","window","setTimeout"],"sources":["../src/TableViewEmptyState.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport {\n Content,\n Heading,\n Icon,\n IllustratedMessage,\n} from '@adobe/react-spectrum';\nimport { vsEmptyWindow } from '@deephaven/icons';\n\nconst DEFAULT_DELAY_MS = 500;\n\nexport interface TableViewEmptyStateProps {\n heading: string;\n content?: string;\n delayMs?: number;\n}\n\nexport function TableViewEmptyState({\n heading,\n content,\n delayMs = DEFAULT_DELAY_MS,\n}: TableViewEmptyStateProps) {\n const [show, setShow] = useState(false);\n\n // Spectrum `TableView` will render the result of `renderEmptyState` prop\n // immediately, and it will be hidden once data loads. In cases where the data\n // load is quick, there is a jarring flicker, and the empty data message is\n // not helpful. This delay will avoid showing the message if data loads within\n // the `delayMs`.\n useEffect(() => {\n window.setTimeout(() => {\n setShow(true);\n }, delayMs);\n }, [delayMs]);\n\n return show ? (\n <IllustratedMessage>\n <Icon size=\"XXL\">\n <FontAwesomeIcon icon={vsEmptyWindow} />\n </Icon>\n <Heading>{heading}</Heading>\n {content == null ? null : <Content>{content}</Content>}\n </IllustratedMessage>\n ) : null;\n}\n\nexport default TableViewEmptyState;\n"],"mappings":"AAAA,SAASA,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAC3C,SAASC,eAAe,QAAQ,gCAAgC;AAChE,SACEC,OAAO,EACPC,OAAO,EACPC,IAAI,EACJC,kBAAkB,QACb,uBAAuB;AAC9B,SAASC,aAAa,QAAQ,kBAAkB;AAAC;AAAA;AAEjD,IAAMC,gBAAgB,GAAG,GAAG;AAQ5B,OAAO,SAASC,mBAAmB,
|
|
1
|
+
{"version":3,"file":"TableViewEmptyState.js","names":["useEffect","useState","FontAwesomeIcon","Content","Heading","Icon","IllustratedMessage","vsEmptyWindow","DEFAULT_DELAY_MS","TableViewEmptyState","heading","content","delayMs","show","setShow","window","setTimeout"],"sources":["../src/TableViewEmptyState.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport {\n Content,\n Heading,\n Icon,\n IllustratedMessage,\n} from '@adobe/react-spectrum';\nimport { vsEmptyWindow } from '@deephaven/icons';\n\nconst DEFAULT_DELAY_MS = 500;\n\nexport interface TableViewEmptyStateProps {\n heading: string;\n content?: string;\n delayMs?: number;\n}\n\nexport function TableViewEmptyState({\n heading,\n content,\n delayMs = DEFAULT_DELAY_MS,\n}: TableViewEmptyStateProps): JSX.Element | null {\n const [show, setShow] = useState(false);\n\n // Spectrum `TableView` will render the result of `renderEmptyState` prop\n // immediately, and it will be hidden once data loads. In cases where the data\n // load is quick, there is a jarring flicker, and the empty data message is\n // not helpful. This delay will avoid showing the message if data loads within\n // the `delayMs`.\n useEffect(() => {\n window.setTimeout(() => {\n setShow(true);\n }, delayMs);\n }, [delayMs]);\n\n return show ? (\n <IllustratedMessage>\n <Icon size=\"XXL\">\n <FontAwesomeIcon icon={vsEmptyWindow} />\n </Icon>\n <Heading>{heading}</Heading>\n {content == null ? null : <Content>{content}</Content>}\n </IllustratedMessage>\n ) : null;\n}\n\nexport default TableViewEmptyState;\n"],"mappings":"AAAA,SAASA,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAC3C,SAASC,eAAe,QAAQ,gCAAgC;AAChE,SACEC,OAAO,EACPC,OAAO,EACPC,IAAI,EACJC,kBAAkB,QACb,uBAAuB;AAC9B,SAASC,aAAa,QAAQ,kBAAkB;AAAC;AAAA;AAEjD,IAAMC,gBAAgB,GAAG,GAAG;AAQ5B,OAAO,SAASC,mBAAmB,OAIc;EAAA,IAJb;IAClCC,OAAO;IACPC,OAAO;IACPC,OAAO,GAAGJ;EACc,CAAC;EACzB,IAAM,CAACK,IAAI,EAAEC,OAAO,CAAC,GAAGb,QAAQ,CAAC,KAAK,CAAC;;EAEvC;EACA;EACA;EACA;EACA;EACAD,SAAS,CAAC,MAAM;IACde,MAAM,CAACC,UAAU,CAAC,MAAM;MACtBF,OAAO,CAAC,IAAI,CAAC;IACf,CAAC,EAAEF,OAAO,CAAC;EACb,CAAC,EAAE,CAACA,OAAO,CAAC,CAAC;EAEb,OAAOC,IAAI,gBACT,MAAC,kBAAkB;IAAA,wBACjB,KAAC,IAAI;MAAC,IAAI,EAAC,KAAK;MAAA,uBACd,KAAC,eAAe;QAAC,IAAI,EAAEN;MAAc;IAAG,EACnC,eACP,KAAC,OAAO;MAAA,UAAEG;IAAO,EAAW,EAC3BC,OAAO,IAAI,IAAI,GAAG,IAAI,gBAAG,KAAC,OAAO;MAAA,UAAEA;IAAO,EAAW;EAAA,EACnC,GACnB,IAAI;AACV;AAEA,eAAeF,mBAAmB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextWithTooltip.d.ts","sourceRoot":"","sources":["../src/TextWithTooltip.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,aAAa,EAAW,MAAM,UAAU,CAAC;AAElD,MAAM,WAAW,oBAAoB;IACnC,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,aAAa,CAAC,WAAW,CAAC,CAAC;CACxC;AAED,wBAAgB,eAAe,CAAC,EAC9B,IAAI,EACJ,SAAuB,GACxB,EAAE,oBAAoB,
|
|
1
|
+
{"version":3,"file":"TextWithTooltip.d.ts","sourceRoot":"","sources":["../src/TextWithTooltip.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,aAAa,EAAW,MAAM,UAAU,CAAC;AAElD,MAAM,WAAW,oBAAoB;IACnC,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,aAAa,CAAC,WAAW,CAAC,CAAC;CACxC;AAED,wBAAgB,eAAe,CAAC,EAC9B,IAAI,EACJ,SAAuB,GACxB,EAAE,oBAAoB,GAAG,GAAG,CAAC,OAAO,CAgBpC;AAED,eAAe,eAAe,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextWithTooltip.js","names":["useMemo","Text","stylesCommon","Tooltip","TextWithTooltip","text","placement","options","spectrumEllipsis"],"sources":["../src/TextWithTooltip.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport { Text } from '@adobe/react-spectrum';\nimport stylesCommon from './SpectrumComponent.module.scss';\nimport { PopperOptions, Tooltip } from './popper';\n\nexport interface TextWithTooltipProps {\n text?: string | null;\n placement?: PopperOptions['placement'];\n}\n\nexport function TextWithTooltip({\n text,\n placement = 'top-start',\n}: TextWithTooltipProps) {\n const options = useMemo(() => ({ placement }), [placement]);\n\n return (\n <>\n <Text UNSAFE_className={stylesCommon.spectrumEllipsis}>\n {text ?? (\n /* so that height doesn't collapse when empty */\n <> </>\n )}\n </Text>\n {text == null || text === '' ? null : (\n <Tooltip options={options}>{text}</Tooltip>\n )}\n </>\n );\n}\n\nexport default TextWithTooltip;\n"],"mappings":"AAAA,SAASA,OAAO,QAAQ,OAAO;AAC/B,SAASC,IAAI,QAAQ,uBAAuB;AAAC,OACtCC,YAAY;AAAA,SACKC,OAAO;AAAA;AAAA;AAAA;AAO/B,OAAO,SAASC,eAAe,
|
|
1
|
+
{"version":3,"file":"TextWithTooltip.js","names":["useMemo","Text","stylesCommon","Tooltip","TextWithTooltip","text","placement","options","spectrumEllipsis"],"sources":["../src/TextWithTooltip.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport { Text } from '@adobe/react-spectrum';\nimport stylesCommon from './SpectrumComponent.module.scss';\nimport { PopperOptions, Tooltip } from './popper';\n\nexport interface TextWithTooltipProps {\n text?: string | null;\n placement?: PopperOptions['placement'];\n}\n\nexport function TextWithTooltip({\n text,\n placement = 'top-start',\n}: TextWithTooltipProps): JSX.Element {\n const options = useMemo(() => ({ placement }), [placement]);\n\n return (\n <>\n <Text UNSAFE_className={stylesCommon.spectrumEllipsis}>\n {text ?? (\n /* so that height doesn't collapse when empty */\n <> </>\n )}\n </Text>\n {text == null || text === '' ? null : (\n <Tooltip options={options}>{text}</Tooltip>\n )}\n </>\n );\n}\n\nexport default TextWithTooltip;\n"],"mappings":"AAAA,SAASA,OAAO,QAAQ,OAAO;AAC/B,SAASC,IAAI,QAAQ,uBAAuB;AAAC,OACtCC,YAAY;AAAA,SACKC,OAAO;AAAA;AAAA;AAAA;AAO/B,OAAO,SAASC,eAAe,OAGO;EAAA,IAHN;IAC9BC,IAAI;IACJC,SAAS,GAAG;EACQ,CAAC;EACrB,IAAMC,OAAO,GAAGP,OAAO,CAAC,OAAO;IAAEM;EAAU,CAAC,CAAC,EAAE,CAACA,SAAS,CAAC,CAAC;EAE3D,oBACE;IAAA,wBACE,KAAC,IAAI;MAAC,gBAAgB,EAAEJ,YAAY,CAACM,gBAAiB;MAAA,UACnDH,IAAI,aAAJA,IAAI,cAAJA,IAAI;MAAA;MACH;MACA;QAAA,UAAE;MAAM;IAAG,EAER,EACNA,IAAI,IAAI,IAAI,IAAIA,IAAI,KAAK,EAAE,GAAG,IAAI,gBACjC,KAAC,OAAO;MAAC,OAAO,EAAEE,OAAQ;MAAA,UAAEF;IAAI,EACjC;EAAA,EACA;AAEP;AAEA,eAAeD,eAAe"}
|
package/dist/TimeInput.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TimeInput.js","names":["React","useCallback","useEffect","useImperativeHandle","useRef","useState","Log","TimeUtils","MaskedInput","DEFAULT_GET_PREFERRED_REPLACEMENT_STRING","log","module","TIME_PATTERN","EXAMPLES","TimeInput","forwardRef","props","ref","allowValueWrapping","className","onChange","value","propsValue","onFocus","onBlur","onSelect","dataTestId","setValue","formatTime","selection","setSelection","inputRef","focus","current","newSelection","setFormattedTime","getNextSegmentValue","range","delta","segmentValue","maxValue","selectionStart","newSegmentValue","parseInt","Number","isNaN","Math","min","max","padStart","getPreferredReplacementString","replaceValue","replaceIndex","newChar","selectionEnd","substring","handleChange","newValue","debug","isTimeString","parseTime","handleSelect","defaultProps","undefined"],"sources":["../src/TimeInput.tsx"],"sourcesContent":["import React, {\n useCallback,\n useEffect,\n useImperativeHandle,\n useRef,\n useState,\n} from 'react';\nimport Log from '@deephaven/log';\nimport { TimeUtils } from '@deephaven/utils';\nimport MaskedInput, { SelectionSegment } from './MaskedInput';\nimport { DEFAULT_GET_PREFERRED_REPLACEMENT_STRING } from './MaskedInputUtils';\n\nexport type { SelectionSegment } from './MaskedInput';\n\nconst log = Log.module('TimeInput');\n\nconst TIME_PATTERN = '([01][0-9]|2[0-3]):[0-5][0-9]:[0-5][0-9]';\nconst EXAMPLES = ['00:00:00', '12:34:56', '23:59:59'];\n\ntype TimeInputProps = {\n allowValueWrapping?: boolean;\n className?: string;\n onChange?(timeInSec: number): void;\n onSelect?(selection: SelectionSegment): void;\n value?: number;\n onFocus?(): void;\n onBlur?(): void;\n 'data-testid'?: string;\n};\n\nexport type TimeInputElement = {\n focus: () => void;\n setSelection: (newSelection: SelectionSegment) => void;\n};\n\n// Forward ref causes a false positive for display-name in eslint:\n// https://github.com/yannickcr/eslint-plugin-react/issues/2269\n// eslint-disable-next-line react/display-name\nconst TimeInput = React.forwardRef<TimeInputElement, TimeInputProps>(\n (props: TimeInputProps, ref) => {\n const {\n allowValueWrapping = true,\n className = '',\n onChange = () => false,\n value: propsValue = 0,\n onFocus = () => false,\n onBlur = () => false,\n onSelect = () => false,\n 'data-testid': dataTestId,\n } = props;\n const [value, setValue] = useState(TimeUtils.formatTime(propsValue));\n const [selection, setSelection] = useState<SelectionSegment>();\n const inputRef = useRef<HTMLInputElement>(null);\n\n useImperativeHandle(\n ref,\n () => ({\n focus: () => {\n inputRef.current?.focus();\n },\n setSelection: newSelection => {\n inputRef.current?.focus();\n setSelection(newSelection);\n },\n }),\n []\n );\n\n useEffect(\n function setFormattedTime() {\n setValue(TimeUtils.formatTime(propsValue));\n },\n [propsValue]\n );\n\n function getNextSegmentValue(\n range: SelectionSegment,\n delta: number,\n segmentValue: string\n ): string {\n // Delta is backward because negative Y is up\n const maxValue = range.selectionStart === 0 ? 24 : 60;\n let newSegmentValue = parseInt(segmentValue, 10) - delta;\n if (Number.isNaN(newSegmentValue)) {\n newSegmentValue = 0;\n } else if (allowValueWrapping) {\n // Add max value and re-mod so we don't get negative values after mod\n newSegmentValue = ((newSegmentValue % maxValue) + maxValue) % maxValue;\n } else {\n newSegmentValue = Math.min(Math.max(0, newSegmentValue), maxValue - 1);\n }\n return `${newSegmentValue}`.padStart(2, '0');\n }\n\n function getPreferredReplacementString(\n replaceValue: string,\n replaceIndex: number,\n newChar: string,\n selectionStart: number,\n selectionEnd: number\n ) {\n if (\n selectionStart === 0 &&\n selectionEnd === 2 &&\n replaceIndex === 1 &&\n parseInt(newChar, 10) > 1\n ) {\n // DH-10082 Special case for when typing `3` when it's already 12\n return `0${newChar}${replaceValue.substring(2)}`;\n }\n return DEFAULT_GET_PREFERRED_REPLACEMENT_STRING(\n replaceValue,\n replaceIndex,\n newChar\n );\n }\n\n function handleChange(newValue: string): void {\n log.debug('handleChange', newValue);\n setValue(newValue);\n\n // Only send a change if the value is actually valid\n if (TimeUtils.isTimeString(newValue)) {\n onChange(TimeUtils.parseTime(newValue));\n }\n }\n\n const handleSelect = useCallback(\n (newSelection: SelectionSegment) => {\n setSelection(newSelection);\n onSelect(newSelection);\n },\n [onSelect]\n );\n\n return (\n <MaskedInput\n ref={inputRef}\n className={className}\n example={EXAMPLES}\n getNextSegmentValue={getNextSegmentValue}\n getPreferredReplacementString={getPreferredReplacementString}\n onChange={handleChange}\n onSelect={handleSelect}\n pattern={TIME_PATTERN}\n selection={selection}\n value={value}\n onFocus={onFocus}\n onBlur={onBlur}\n data-testid={dataTestId}\n />\n );\n }\n);\n\nTimeInput.defaultProps = {\n allowValueWrapping: true,\n className: '',\n onChange: () => false,\n onSelect: () => false,\n value: 0,\n onFocus: () => false,\n onBlur: () => false,\n 'data-testid': undefined,\n};\n\nexport default TimeInput;\n"],"mappings":"AAAA,OAAOA,KAAK,IACVC,WAAW,EACXC,SAAS,EACTC,mBAAmB,EACnBC,MAAM,EACNC,QAAQ,QACH,OAAO;AACd,OAAOC,GAAG,MAAM,gBAAgB;AAChC,SAASC,SAAS,QAAQ,kBAAkB;AAAC,OACtCC,WAAW;AAAA,SACTC,wCAAwC;AAAA;AAIjD,IAAMC,GAAG,GAAGJ,GAAG,CAACK,MAAM,CAAC,WAAW,CAAC;AAEnC,IAAMC,YAAY,GAAG,0CAA0C;AAC/D,IAAMC,QAAQ,GAAG,CAAC,UAAU,EAAE,UAAU,EAAE,UAAU,CAAC;AAkBrD;AACA;AACA;AACA,IAAMC,SAAS,gBAAGd,KAAK,CAACe,UAAU,CAChC,CAACC,KAAqB,EAAEC,GAAG,KAAK;EAC9B,IAAM;IACJC,kBAAkB,GAAG,IAAI;IACzBC,SAAS,GAAG,EAAE;IACdC,QAAQ,GAAG,MAAM,KAAK;IACtBC,KAAK,EAAEC,UAAU,GAAG,CAAC;IACrBC,OAAO,GAAG,MAAM,KAAK;IACrBC,MAAM,GAAG,MAAM,KAAK;IACpBC,QAAQ,GAAG,MAAM,KAAK;IACtB,aAAa,EAAEC;EACjB,CAAC,GAAGV,KAAK;EACT,IAAM,CAACK,KAAK,EAAEM,QAAQ,CAAC,GAAGtB,QAAQ,CAACE,SAAS,CAACqB,UAAU,CAACN,UAAU,CAAC,CAAC;EACpE,IAAM,CAACO,SAAS,EAAEC,aAAY,CAAC,GAAGzB,QAAQ,EAAoB;EAC9D,IAAM0B,QAAQ,GAAG3B,MAAM,CAAmB,IAAI,CAAC;EAE/CD,mBAAmB,CACjBc,GAAG,EACH,OAAO;IACLe,KAAK,EAAE,MAAM;MAAA;MACX,qBAAAD,QAAQ,CAACE,OAAO,sDAAhB,kBAAkBD,KAAK,EAAE;IAC3B,CAAC;IACDF,YAAY,EAAEI,YAAY,IAAI;MAAA;MAC5B,sBAAAH,QAAQ,CAACE,OAAO,uDAAhB,mBAAkBD,KAAK,EAAE;MACzBF,aAAY,CAACI,YAAY,CAAC;IAC5B;EACF,CAAC,CAAC,EACF,EAAE,CACH;EAEDhC,SAAS,CACP,SAASiC,gBAAgB,GAAG;IAC1BR,QAAQ,CAACpB,SAAS,CAACqB,UAAU,CAACN,UAAU,CAAC,CAAC;EAC5C,CAAC,EACD,CAACA,UAAU,CAAC,CACb;EAED,SAASc,mBAAmB,CAC1BC,KAAuB,EACvBC,KAAa,EACbC,YAAoB,EACZ;IACR;IACA,IAAMC,QAAQ,GAAGH,KAAK,CAACI,cAAc,KAAK,CAAC,GAAG,EAAE,GAAG,EAAE;IACrD,IAAIC,eAAe,GAAGC,QAAQ,CAACJ,YAAY,EAAE,EAAE,CAAC,GAAGD,KAAK;IACxD,IAAIM,MAAM,CAACC,KAAK,CAACH,eAAe,CAAC,EAAE;MACjCA,eAAe,GAAG,CAAC;IACrB,CAAC,MAAM,IAAIxB,kBAAkB,EAAE;MAC7B;MACAwB,eAAe,GAAG,CAAEA,eAAe,GAAGF,QAAQ,GAAIA,QAAQ,IAAIA,QAAQ;IACxE,CAAC,MAAM;MACLE,eAAe,GAAGI,IAAI,CAACC,GAAG,CAACD,IAAI,CAACE,GAAG,CAAC,CAAC,EAAEN,eAAe,CAAC,EAAEF,QAAQ,GAAG,CAAC,CAAC;IACxE;IACA,OAAO,UAAGE,eAAe,EAAGO,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC;EAC9C;EAEA,SAASC,6BAA6B,CACpCC,YAAoB,EACpBC,YAAoB,EACpBC,OAAe,EACfZ,cAAsB,EACtBa,YAAoB,
|
|
1
|
+
{"version":3,"file":"TimeInput.js","names":["React","useCallback","useEffect","useImperativeHandle","useRef","useState","Log","TimeUtils","MaskedInput","DEFAULT_GET_PREFERRED_REPLACEMENT_STRING","log","module","TIME_PATTERN","EXAMPLES","TimeInput","forwardRef","props","ref","allowValueWrapping","className","onChange","value","propsValue","onFocus","onBlur","onSelect","dataTestId","setValue","formatTime","selection","setSelection","inputRef","focus","current","newSelection","setFormattedTime","getNextSegmentValue","range","delta","segmentValue","maxValue","selectionStart","newSegmentValue","parseInt","Number","isNaN","Math","min","max","padStart","getPreferredReplacementString","replaceValue","replaceIndex","newChar","selectionEnd","substring","handleChange","newValue","debug","isTimeString","parseTime","handleSelect","defaultProps","undefined"],"sources":["../src/TimeInput.tsx"],"sourcesContent":["import React, {\n useCallback,\n useEffect,\n useImperativeHandle,\n useRef,\n useState,\n} from 'react';\nimport Log from '@deephaven/log';\nimport { TimeUtils } from '@deephaven/utils';\nimport MaskedInput, { SelectionSegment } from './MaskedInput';\nimport { DEFAULT_GET_PREFERRED_REPLACEMENT_STRING } from './MaskedInputUtils';\n\nexport type { SelectionSegment } from './MaskedInput';\n\nconst log = Log.module('TimeInput');\n\nconst TIME_PATTERN = '([01][0-9]|2[0-3]):[0-5][0-9]:[0-5][0-9]';\nconst EXAMPLES = ['00:00:00', '12:34:56', '23:59:59'];\n\ntype TimeInputProps = {\n allowValueWrapping?: boolean;\n className?: string;\n onChange?(timeInSec: number): void;\n onSelect?(selection: SelectionSegment): void;\n value?: number;\n onFocus?(): void;\n onBlur?(): void;\n 'data-testid'?: string;\n};\n\nexport type TimeInputElement = {\n focus: () => void;\n setSelection: (newSelection: SelectionSegment) => void;\n};\n\n// Forward ref causes a false positive for display-name in eslint:\n// https://github.com/yannickcr/eslint-plugin-react/issues/2269\n// eslint-disable-next-line react/display-name\nconst TimeInput = React.forwardRef<TimeInputElement, TimeInputProps>(\n (props: TimeInputProps, ref) => {\n const {\n allowValueWrapping = true,\n className = '',\n onChange = () => false,\n value: propsValue = 0,\n onFocus = () => false,\n onBlur = () => false,\n onSelect = () => false,\n 'data-testid': dataTestId,\n } = props;\n const [value, setValue] = useState(TimeUtils.formatTime(propsValue));\n const [selection, setSelection] = useState<SelectionSegment>();\n const inputRef = useRef<HTMLInputElement>(null);\n\n useImperativeHandle(\n ref,\n () => ({\n focus: () => {\n inputRef.current?.focus();\n },\n setSelection: newSelection => {\n inputRef.current?.focus();\n setSelection(newSelection);\n },\n }),\n []\n );\n\n useEffect(\n function setFormattedTime() {\n setValue(TimeUtils.formatTime(propsValue));\n },\n [propsValue]\n );\n\n function getNextSegmentValue(\n range: SelectionSegment,\n delta: number,\n segmentValue: string\n ): string {\n // Delta is backward because negative Y is up\n const maxValue = range.selectionStart === 0 ? 24 : 60;\n let newSegmentValue = parseInt(segmentValue, 10) - delta;\n if (Number.isNaN(newSegmentValue)) {\n newSegmentValue = 0;\n } else if (allowValueWrapping) {\n // Add max value and re-mod so we don't get negative values after mod\n newSegmentValue = ((newSegmentValue % maxValue) + maxValue) % maxValue;\n } else {\n newSegmentValue = Math.min(Math.max(0, newSegmentValue), maxValue - 1);\n }\n return `${newSegmentValue}`.padStart(2, '0');\n }\n\n function getPreferredReplacementString(\n replaceValue: string,\n replaceIndex: number,\n newChar: string,\n selectionStart: number,\n selectionEnd: number\n ): string {\n if (\n selectionStart === 0 &&\n selectionEnd === 2 &&\n replaceIndex === 1 &&\n parseInt(newChar, 10) > 1\n ) {\n // DH-10082 Special case for when typing `3` when it's already 12\n return `0${newChar}${replaceValue.substring(2)}`;\n }\n return DEFAULT_GET_PREFERRED_REPLACEMENT_STRING(\n replaceValue,\n replaceIndex,\n newChar\n );\n }\n\n function handleChange(newValue: string): void {\n log.debug('handleChange', newValue);\n setValue(newValue);\n\n // Only send a change if the value is actually valid\n if (TimeUtils.isTimeString(newValue)) {\n onChange(TimeUtils.parseTime(newValue));\n }\n }\n\n const handleSelect = useCallback(\n (newSelection: SelectionSegment) => {\n setSelection(newSelection);\n onSelect(newSelection);\n },\n [onSelect]\n );\n\n return (\n <MaskedInput\n ref={inputRef}\n className={className}\n example={EXAMPLES}\n getNextSegmentValue={getNextSegmentValue}\n getPreferredReplacementString={getPreferredReplacementString}\n onChange={handleChange}\n onSelect={handleSelect}\n pattern={TIME_PATTERN}\n selection={selection}\n value={value}\n onFocus={onFocus}\n onBlur={onBlur}\n data-testid={dataTestId}\n />\n );\n }\n);\n\nTimeInput.defaultProps = {\n allowValueWrapping: true,\n className: '',\n onChange: () => false,\n onSelect: () => false,\n value: 0,\n onFocus: () => false,\n onBlur: () => false,\n 'data-testid': undefined,\n};\n\nexport default TimeInput;\n"],"mappings":"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"}
|
package/dist/TimeSlider.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TimeSlider.js","names":["React","useCallback","useMemo","useRef","useState","useEffect","classNames","TimeInput","StyleExports","HANDLE_SIZE","parseInt","POPOVER_WIDTH","SECONDS_IN_DAY","SNAP_NEAREST_MINUTES","TimeSlider","startTime","propStartTime","endTime","propEndTime","onChange","isStartModified","isEndModified","dataTestId","setStartTime","setEndTime","track","setTimeOnPropTimeChange","updateTime","newStartTime","newEndTime","start","end","handleStartTimeChange","handleEndTimeChange","Array","fill","map","value","index","PopOvers","props","onStartTimeChange","onEndTimeChange","swapTimes","firstTime","setFirstTime","secondTime","setSecondTime","firstTimeRef","secondTimeRef","firstTimeSelectionRef","secondTimeSelectionRef","setFocusOnSwapTimesChange","current","setSelection","onFirstTimeChange","onSecondTimeChange","onFirstTimeSelect","selection","onSecondTimeSelect","flexBasis","modified","undefined","TrackFills","transform","Handle","time","setTime","ONE_HOUR","handleOffset","calculatePositionAsTime","clientX","trackRect","getBoundingClientRect","leftEdge","Math","max","left","preciseTime","min","width","roundedTime","round","limitMax","handleMouseMove","handleMouseUp","window","removeEventListener","document","documentElement","classList","remove","startDragListening","addEventListener","add","stopDragListening","handleMouseDown","removeListenersOnUnmount"],"sources":["../src/TimeSlider.tsx"],"sourcesContent":["/* eslint-disable react/no-array-index-key */\n// array maps being used are static, this is fine.\n\nimport React, {\n useCallback,\n useMemo,\n useRef,\n useState,\n useEffect,\n} from 'react';\nimport classNames from 'classnames';\nimport TimeInput, { SelectionSegment, TimeInputElement } from './TimeInput';\nimport StyleExports from './TimeSlider.module.scss';\nimport './TimeSlider.scss';\n\nconst HANDLE_SIZE = parseInt(StyleExports['handle-size'], 10);\nconst POPOVER_WIDTH = parseInt(StyleExports['popover-width'], 10);\nconst SECONDS_IN_DAY = 24 * 60 * 60 - 1; // Max is actually 23:59:59\nconst SNAP_NEAREST_MINUTES = 5 * 60; // rounds in 5 minute intervals\n\ntype TimeSliderProps = {\n startTime: number;\n endTime: number;\n onChange(value: { startTime: number; endTime: number }): void;\n isStartModified?: boolean;\n isEndModified?: boolean;\n 'data-testid'?: string;\n};\n\n/**\n * Creates a time slider for setting a start and end time, that can also run overnight\n * @param props takes times in seconds 0 - 86399 and a callback\n */\nfunction TimeSlider({\n startTime: propStartTime,\n endTime: propEndTime,\n onChange,\n isStartModified = false,\n isEndModified = false,\n 'data-testid': dataTestId,\n}: TimeSliderProps): JSX.Element {\n const [startTime, setStartTime] = useState(propStartTime);\n const [endTime, setEndTime] = useState(propEndTime);\n\n const track = useRef<HTMLDivElement>(null); // we need the track width while calulculating time from handle drag\n\n // updates state if props change\n useEffect(\n function setTimeOnPropTimeChange() {\n setStartTime(propStartTime);\n setEndTime(propEndTime);\n },\n [propStartTime, propEndTime]\n );\n\n const updateTime = useCallback(\n (newStartTime: number, newEndTime: number) => {\n let start = newStartTime;\n let end = newEndTime;\n if (start === end) {\n if (end < SECONDS_IN_DAY) {\n end += 1;\n } else {\n start -= 1;\n }\n }\n\n setStartTime(start);\n setEndTime(end);\n onChange({ startTime: start, endTime: end });\n },\n [setStartTime, setEndTime, onChange]\n );\n\n const handleStartTimeChange = useCallback(\n (newStartTime: number) => {\n updateTime(newStartTime, endTime);\n },\n [updateTime, endTime]\n );\n\n const handleEndTimeChange = useCallback(\n (newEndTime: number) => {\n updateTime(startTime, newEndTime);\n },\n [updateTime, startTime]\n );\n\n return (\n <div className=\"time-slider\" data-testid={dataTestId}>\n <PopOvers\n startTime={startTime}\n endTime={endTime}\n onStartTimeChange={handleStartTimeChange}\n onEndTimeChange={handleEndTimeChange}\n isStartModified={isStartModified}\n isEndModified={isEndModified}\n />\n <div className=\"track\" ref={track}>\n <TrackFills startTime={startTime} endTime={endTime} />\n <div className=\"ticks\">\n {Array(24)\n .fill(null)\n .map((value, index) => (\n <div className=\"tick\" key={index} />\n ))}\n </div>\n <Handle\n track={track}\n time={startTime}\n setTime={handleStartTimeChange}\n />\n <Handle track={track} time={endTime} setTime={handleEndTimeChange} />\n </div>\n\n <div className=\"tick-labels\">\n <div className=\"tick-label\">0:00</div>\n <div className=\"tick-label-wrapper\">\n {Array(24)\n .fill(null)\n .map((value, index) => (\n <div className=\"tick-label\" key={index}>{`${index + 1}:00`}</div>\n ))}\n </div>\n </div>\n </div>\n );\n}\n\ntype PopOversProps = {\n startTime: number;\n endTime: number;\n onStartTimeChange(time: number): void;\n onEndTimeChange(time: number): void;\n isStartModified: boolean;\n isEndModified: boolean;\n 'data-testid'?: string;\n};\n\nfunction PopOvers(props: PopOversProps): JSX.Element {\n const {\n startTime,\n endTime,\n onStartTimeChange,\n onEndTimeChange,\n isStartModified,\n isEndModified,\n 'data-testid': dataTestId,\n } = props;\n\n const swapTimes = startTime > endTime;\n\n const [firstTime, setFirstTime] = useState(swapTimes ? endTime : startTime);\n const [secondTime, setSecondTime] = useState(swapTimes ? startTime : endTime);\n const firstTimeRef = useRef<TimeInputElement>(null);\n const secondTimeRef = useRef<TimeInputElement>(null);\n // Keep track of selection in both time inputs\n const firstTimeSelectionRef = useRef<SelectionSegment | null>(null);\n const secondTimeSelectionRef = useRef<SelectionSegment | null>(null);\n\n useEffect(\n function setTimeOnPropTimeChange() {\n setFirstTime(startTime > endTime ? endTime : startTime);\n setSecondTime(startTime > endTime ? startTime : endTime);\n },\n [startTime, endTime]\n );\n\n useEffect(\n function setFocusOnSwapTimesChange() {\n if (firstTimeSelectionRef.current !== null) {\n secondTimeRef.current?.setSelection(firstTimeSelectionRef.current);\n }\n if (secondTimeSelectionRef.current !== null) {\n firstTimeRef.current?.setSelection(secondTimeSelectionRef.current);\n }\n },\n [swapTimes]\n );\n\n function onFirstTimeChange(value: number) {\n if (startTime <= endTime) {\n onStartTimeChange(value);\n } else {\n onEndTimeChange(value);\n }\n }\n\n function onSecondTimeChange(value: number) {\n if (startTime <= endTime) {\n onEndTimeChange(value);\n } else {\n onStartTimeChange(value);\n }\n }\n\n const onFirstTimeSelect = useCallback(selection => {\n firstTimeSelectionRef.current = selection;\n secondTimeSelectionRef.current = null;\n }, []);\n\n const onSecondTimeSelect = useCallback(selection => {\n firstTimeSelectionRef.current = null;\n secondTimeSelectionRef.current = selection;\n }, []);\n\n return (\n <div className=\"time-slider-popovers\">\n <div\n className=\"flex\"\n style={{\n flexBasis: `calc(${(firstTime / SECONDS_IN_DAY) * 100}% - ${\n POPOVER_WIDTH / 2\n }px)`,\n }}\n />\n <div className=\"handle-popper\">\n <label\n className={classNames({\n modified: swapTimes ? isEndModified : isStartModified,\n })}\n >\n {swapTimes ? 'End Time' : 'Start Time'}\n </label>\n <TimeInput\n ref={firstTimeRef}\n allowValueWrapping={false}\n value={firstTime}\n onChange={onFirstTimeChange}\n onSelect={onFirstTimeSelect}\n data-testid={\n dataTestId !== undefined ? `${dataTestId}-input-1` : undefined\n }\n />\n </div>\n <div className=\"flex-spacer\" />\n <div className=\"handle-popper\">\n <label\n className={classNames({\n modified: swapTimes ? isStartModified : isEndModified,\n })}\n >\n {swapTimes ? 'Start Time' : 'End Time'}\n </label>\n <TimeInput\n ref={secondTimeRef}\n allowValueWrapping={false}\n value={secondTime}\n onChange={onSecondTimeChange}\n onSelect={onSecondTimeSelect}\n data-testid={\n dataTestId !== undefined ? `${dataTestId}-input-2` : undefined\n }\n />\n </div>\n <div\n className=\"flex\"\n style={{\n flexBasis: `calc(${\n ((SECONDS_IN_DAY - secondTime) / SECONDS_IN_DAY) * 100\n }% - ${POPOVER_WIDTH / 2}px)`,\n }}\n />\n </div>\n );\n}\n\ntype TrackFillsProps = {\n startTime: number;\n endTime: number;\n 'data-testid'?: string;\n};\n\n/**\n * Shades the area between or outside of handles according to if start or endtime is greater.\n */\nfunction TrackFills(props: TrackFillsProps): JSX.Element {\n const { startTime, endTime, 'data-testid': dataTestId } = props;\n return (\n <div className=\"track-fills\" data-testid={dataTestId}>\n {startTime > endTime && (\n <>\n <div\n className=\"track-fill track-fill-start\"\n style={{ transform: `scaleX(${endTime / SECONDS_IN_DAY})` }}\n />\n <div\n className=\"track-fill track-fill-end\"\n style={{\n transform: `scaleX(${\n (SECONDS_IN_DAY - startTime) / SECONDS_IN_DAY\n })`,\n }}\n />\n </>\n )}\n {startTime < endTime && (\n <div\n className=\"track-fill track-fill-middle\"\n style={{\n transform: `translateX(${\n (startTime / SECONDS_IN_DAY) * 100\n }%) scaleX(${(endTime - startTime) / SECONDS_IN_DAY})`,\n }}\n />\n )}\n </div>\n );\n}\n\ntype HandleProps = {\n track: React.RefObject<HTMLDivElement>;\n time: number;\n setTime(time: number): void;\n 'data-testid'?: string;\n};\n\n/**\n * Creates a draggable handle the sets the time\n */\nfunction Handle(props: HandleProps): JSX.Element {\n const { track, time, setTime, 'data-testid': dataTestId } = props;\n\n /**\n * Takes the time and generate our translation string taking into account handle offset.\n * The handle offset changes for the first and last tick range dynmaically. Normally,\n * the center of the handle (size/2) is the selection origin, but at edges, it becomes either\n * end of the handle, requireing a relative offset range of 0 - 0.5, and 0.5 - 1 of handle size.\n * @param t time in seconds\n */\n const transform = useMemo(() => {\n const ONE_HOUR = 60 * 60;\n let handleOffset = HANDLE_SIZE / 2;\n if (time < ONE_HOUR) {\n handleOffset = (time / ONE_HOUR) * (HANDLE_SIZE / 2); // 0 - 0.5 Handle size\n } else if (time > 23 * ONE_HOUR) {\n handleOffset =\n HANDLE_SIZE / 2 +\n (1 / (SECONDS_IN_DAY - 23 * ONE_HOUR)) *\n (time - 23 * ONE_HOUR) *\n (HANDLE_SIZE / 2); // 0.5 - 1 Handle size\n }\n return `translateX(calc(${\n (time / SECONDS_IN_DAY) * 100\n }% - ${handleOffset}px))`;\n }, [time]);\n\n const calculatePositionAsTime = useCallback(\n (clientX: number) => {\n if (!track.current) {\n return 0;\n }\n const trackRect = track.current.getBoundingClientRect();\n const leftEdge = Math.max(clientX - trackRect.left, 0);\n // get position as 0-1 on slider and mulitply by seconds in a day to convert to time\n const preciseTime =\n SECONDS_IN_DAY * Math.min(1, leftEdge / trackRect.width);\n // snap to nearest N(5) minute interval\n const roundedTime =\n SNAP_NEAREST_MINUTES * Math.round(preciseTime / SNAP_NEAREST_MINUTES);\n // prevent over-rounding to 24:00:00\n const limitMax = Math.min(SECONDS_IN_DAY, roundedTime);\n return limitMax;\n },\n [track]\n );\n\n const handleMouseMove = useCallback(\n ({ clientX }: MouseEvent) => {\n setTime(calculatePositionAsTime(clientX));\n },\n [setTime, calculatePositionAsTime]\n );\n\n const handleMouseUp = useCallback(\n ({ clientX }: MouseEvent) => {\n setTime(calculatePositionAsTime(clientX));\n\n window.removeEventListener('mousemove', handleMouseMove);\n window.removeEventListener('mouseup', handleMouseUp);\n document.documentElement.classList.remove('drag-pointer-events-none');\n },\n [setTime, calculatePositionAsTime, handleMouseMove]\n );\n\n const startDragListening = useCallback(() => {\n window.addEventListener('mousemove', handleMouseMove);\n window.addEventListener('mouseup', handleMouseUp);\n document.documentElement.classList.add('drag-pointer-events-none');\n }, [handleMouseMove, handleMouseUp]);\n\n const stopDragListening = useCallback(() => {\n window.removeEventListener('mousemove', handleMouseMove);\n window.removeEventListener('mouseup', handleMouseUp);\n document.documentElement.classList.remove('drag-pointer-events-none');\n }, [handleMouseMove, handleMouseUp]);\n\n const handleMouseDown = useCallback(() => {\n startDragListening();\n }, [startDragListening]);\n\n useEffect(\n function removeListenersOnUnmount() {\n return () => {\n stopDragListening();\n };\n },\n [stopDragListening]\n );\n\n return (\n <div className=\"handle-track\" style={{ transform }}>\n <button\n className=\"handle\"\n type=\"button\"\n aria-label=\"Change time\"\n onMouseDown={handleMouseDown}\n data-testid={dataTestId}\n />\n </div>\n );\n}\n\nexport default TimeSlider;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"TimeSlider.js","names":["React","useCallback","useMemo","useRef","useState","useEffect","classNames","TimeInput","StyleExports","HANDLE_SIZE","parseInt","POPOVER_WIDTH","SECONDS_IN_DAY","SNAP_NEAREST_MINUTES","TimeSlider","startTime","propStartTime","endTime","propEndTime","onChange","isStartModified","isEndModified","dataTestId","setStartTime","setEndTime","track","setTimeOnPropTimeChange","updateTime","newStartTime","newEndTime","start","end","handleStartTimeChange","handleEndTimeChange","Array","fill","map","value","index","PopOvers","props","onStartTimeChange","onEndTimeChange","swapTimes","firstTime","setFirstTime","secondTime","setSecondTime","firstTimeRef","secondTimeRef","firstTimeSelectionRef","secondTimeSelectionRef","setFocusOnSwapTimesChange","current","setSelection","onFirstTimeChange","onSecondTimeChange","onFirstTimeSelect","selection","onSecondTimeSelect","flexBasis","modified","undefined","TrackFills","transform","Handle","time","setTime","ONE_HOUR","handleOffset","calculatePositionAsTime","clientX","trackRect","getBoundingClientRect","leftEdge","Math","max","left","preciseTime","min","width","roundedTime","round","limitMax","handleMouseMove","handleMouseUp","window","removeEventListener","document","documentElement","classList","remove","startDragListening","addEventListener","add","stopDragListening","handleMouseDown","removeListenersOnUnmount"],"sources":["../src/TimeSlider.tsx"],"sourcesContent":["/* eslint-disable react/no-array-index-key */\n// array maps being used are static, this is fine.\n\nimport React, {\n useCallback,\n useMemo,\n useRef,\n useState,\n useEffect,\n} from 'react';\nimport classNames from 'classnames';\nimport TimeInput, { SelectionSegment, TimeInputElement } from './TimeInput';\nimport StyleExports from './TimeSlider.module.scss';\nimport './TimeSlider.scss';\n\nconst HANDLE_SIZE = parseInt(StyleExports['handle-size'], 10);\nconst POPOVER_WIDTH = parseInt(StyleExports['popover-width'], 10);\nconst SECONDS_IN_DAY = 24 * 60 * 60 - 1; // Max is actually 23:59:59\nconst SNAP_NEAREST_MINUTES = 5 * 60; // rounds in 5 minute intervals\n\ntype TimeSliderProps = {\n startTime: number;\n endTime: number;\n onChange(value: { startTime: number; endTime: number }): void;\n isStartModified?: boolean;\n isEndModified?: boolean;\n 'data-testid'?: string;\n};\n\n/**\n * Creates a time slider for setting a start and end time, that can also run overnight\n * @param props takes times in seconds 0 - 86399 and a callback\n */\nfunction TimeSlider({\n startTime: propStartTime,\n endTime: propEndTime,\n onChange,\n isStartModified = false,\n isEndModified = false,\n 'data-testid': dataTestId,\n}: TimeSliderProps): JSX.Element {\n const [startTime, setStartTime] = useState(propStartTime);\n const [endTime, setEndTime] = useState(propEndTime);\n\n const track = useRef<HTMLDivElement>(null); // we need the track width while calulculating time from handle drag\n\n // updates state if props change\n useEffect(\n function setTimeOnPropTimeChange() {\n setStartTime(propStartTime);\n setEndTime(propEndTime);\n },\n [propStartTime, propEndTime]\n );\n\n const updateTime = useCallback(\n (newStartTime: number, newEndTime: number) => {\n let start = newStartTime;\n let end = newEndTime;\n if (start === end) {\n if (end < SECONDS_IN_DAY) {\n end += 1;\n } else {\n start -= 1;\n }\n }\n\n setStartTime(start);\n setEndTime(end);\n onChange({ startTime: start, endTime: end });\n },\n [setStartTime, setEndTime, onChange]\n );\n\n const handleStartTimeChange = useCallback(\n (newStartTime: number) => {\n updateTime(newStartTime, endTime);\n },\n [updateTime, endTime]\n );\n\n const handleEndTimeChange = useCallback(\n (newEndTime: number) => {\n updateTime(startTime, newEndTime);\n },\n [updateTime, startTime]\n );\n\n return (\n <div className=\"time-slider\" data-testid={dataTestId}>\n <PopOvers\n startTime={startTime}\n endTime={endTime}\n onStartTimeChange={handleStartTimeChange}\n onEndTimeChange={handleEndTimeChange}\n isStartModified={isStartModified}\n isEndModified={isEndModified}\n />\n <div className=\"track\" ref={track}>\n <TrackFills startTime={startTime} endTime={endTime} />\n <div className=\"ticks\">\n {Array(24)\n .fill(null)\n .map((value, index) => (\n <div className=\"tick\" key={index} />\n ))}\n </div>\n <Handle\n track={track}\n time={startTime}\n setTime={handleStartTimeChange}\n />\n <Handle track={track} time={endTime} setTime={handleEndTimeChange} />\n </div>\n\n <div className=\"tick-labels\">\n <div className=\"tick-label\">0:00</div>\n <div className=\"tick-label-wrapper\">\n {Array(24)\n .fill(null)\n .map((value, index) => (\n <div className=\"tick-label\" key={index}>{`${index + 1}:00`}</div>\n ))}\n </div>\n </div>\n </div>\n );\n}\n\ntype PopOversProps = {\n startTime: number;\n endTime: number;\n onStartTimeChange(time: number): void;\n onEndTimeChange(time: number): void;\n isStartModified: boolean;\n isEndModified: boolean;\n 'data-testid'?: string;\n};\n\nfunction PopOvers(props: PopOversProps): JSX.Element {\n const {\n startTime,\n endTime,\n onStartTimeChange,\n onEndTimeChange,\n isStartModified,\n isEndModified,\n 'data-testid': dataTestId,\n } = props;\n\n const swapTimes = startTime > endTime;\n\n const [firstTime, setFirstTime] = useState(swapTimes ? endTime : startTime);\n const [secondTime, setSecondTime] = useState(swapTimes ? startTime : endTime);\n const firstTimeRef = useRef<TimeInputElement>(null);\n const secondTimeRef = useRef<TimeInputElement>(null);\n // Keep track of selection in both time inputs\n const firstTimeSelectionRef = useRef<SelectionSegment | null>(null);\n const secondTimeSelectionRef = useRef<SelectionSegment | null>(null);\n\n useEffect(\n function setTimeOnPropTimeChange() {\n setFirstTime(startTime > endTime ? endTime : startTime);\n setSecondTime(startTime > endTime ? startTime : endTime);\n },\n [startTime, endTime]\n );\n\n useEffect(\n function setFocusOnSwapTimesChange() {\n if (firstTimeSelectionRef.current !== null) {\n secondTimeRef.current?.setSelection(firstTimeSelectionRef.current);\n }\n if (secondTimeSelectionRef.current !== null) {\n firstTimeRef.current?.setSelection(secondTimeSelectionRef.current);\n }\n },\n [swapTimes]\n );\n\n function onFirstTimeChange(value: number): void {\n if (startTime <= endTime) {\n onStartTimeChange(value);\n } else {\n onEndTimeChange(value);\n }\n }\n\n function onSecondTimeChange(value: number): void {\n if (startTime <= endTime) {\n onEndTimeChange(value);\n } else {\n onStartTimeChange(value);\n }\n }\n\n const onFirstTimeSelect = useCallback(selection => {\n firstTimeSelectionRef.current = selection;\n secondTimeSelectionRef.current = null;\n }, []);\n\n const onSecondTimeSelect = useCallback(selection => {\n firstTimeSelectionRef.current = null;\n secondTimeSelectionRef.current = selection;\n }, []);\n\n return (\n <div className=\"time-slider-popovers\">\n <div\n className=\"flex\"\n style={{\n flexBasis: `calc(${(firstTime / SECONDS_IN_DAY) * 100}% - ${\n POPOVER_WIDTH / 2\n }px)`,\n }}\n />\n <div className=\"handle-popper\">\n <label\n className={classNames({\n modified: swapTimes ? isEndModified : isStartModified,\n })}\n >\n {swapTimes ? 'End Time' : 'Start Time'}\n </label>\n <TimeInput\n ref={firstTimeRef}\n allowValueWrapping={false}\n value={firstTime}\n onChange={onFirstTimeChange}\n onSelect={onFirstTimeSelect}\n data-testid={\n dataTestId !== undefined ? `${dataTestId}-input-1` : undefined\n }\n />\n </div>\n <div className=\"flex-spacer\" />\n <div className=\"handle-popper\">\n <label\n className={classNames({\n modified: swapTimes ? isStartModified : isEndModified,\n })}\n >\n {swapTimes ? 'Start Time' : 'End Time'}\n </label>\n <TimeInput\n ref={secondTimeRef}\n allowValueWrapping={false}\n value={secondTime}\n onChange={onSecondTimeChange}\n onSelect={onSecondTimeSelect}\n data-testid={\n dataTestId !== undefined ? `${dataTestId}-input-2` : undefined\n }\n />\n </div>\n <div\n className=\"flex\"\n style={{\n flexBasis: `calc(${\n ((SECONDS_IN_DAY - secondTime) / SECONDS_IN_DAY) * 100\n }% - ${POPOVER_WIDTH / 2}px)`,\n }}\n />\n </div>\n );\n}\n\ntype TrackFillsProps = {\n startTime: number;\n endTime: number;\n 'data-testid'?: string;\n};\n\n/**\n * Shades the area between or outside of handles according to if start or endtime is greater.\n */\nfunction TrackFills(props: TrackFillsProps): JSX.Element {\n const { startTime, endTime, 'data-testid': dataTestId } = props;\n return (\n <div className=\"track-fills\" data-testid={dataTestId}>\n {startTime > endTime && (\n <>\n <div\n className=\"track-fill track-fill-start\"\n style={{ transform: `scaleX(${endTime / SECONDS_IN_DAY})` }}\n />\n <div\n className=\"track-fill track-fill-end\"\n style={{\n transform: `scaleX(${\n (SECONDS_IN_DAY - startTime) / SECONDS_IN_DAY\n })`,\n }}\n />\n </>\n )}\n {startTime < endTime && (\n <div\n className=\"track-fill track-fill-middle\"\n style={{\n transform: `translateX(${\n (startTime / SECONDS_IN_DAY) * 100\n }%) scaleX(${(endTime - startTime) / SECONDS_IN_DAY})`,\n }}\n />\n )}\n </div>\n );\n}\n\ntype HandleProps = {\n track: React.RefObject<HTMLDivElement>;\n time: number;\n setTime(time: number): void;\n 'data-testid'?: string;\n};\n\n/**\n * Creates a draggable handle the sets the time\n */\nfunction Handle(props: HandleProps): JSX.Element {\n const { track, time, setTime, 'data-testid': dataTestId } = props;\n\n /**\n * Takes the time and generate our translation string taking into account handle offset.\n * The handle offset changes for the first and last tick range dynmaically. Normally,\n * the center of the handle (size/2) is the selection origin, but at edges, it becomes either\n * end of the handle, requireing a relative offset range of 0 - 0.5, and 0.5 - 1 of handle size.\n * @param t time in seconds\n */\n const transform = useMemo(() => {\n const ONE_HOUR = 60 * 60;\n let handleOffset = HANDLE_SIZE / 2;\n if (time < ONE_HOUR) {\n handleOffset = (time / ONE_HOUR) * (HANDLE_SIZE / 2); // 0 - 0.5 Handle size\n } else if (time > 23 * ONE_HOUR) {\n handleOffset =\n HANDLE_SIZE / 2 +\n (1 / (SECONDS_IN_DAY - 23 * ONE_HOUR)) *\n (time - 23 * ONE_HOUR) *\n (HANDLE_SIZE / 2); // 0.5 - 1 Handle size\n }\n return `translateX(calc(${\n (time / SECONDS_IN_DAY) * 100\n }% - ${handleOffset}px))`;\n }, [time]);\n\n const calculatePositionAsTime = useCallback(\n (clientX: number) => {\n if (!track.current) {\n return 0;\n }\n const trackRect = track.current.getBoundingClientRect();\n const leftEdge = Math.max(clientX - trackRect.left, 0);\n // get position as 0-1 on slider and mulitply by seconds in a day to convert to time\n const preciseTime =\n SECONDS_IN_DAY * Math.min(1, leftEdge / trackRect.width);\n // snap to nearest N(5) minute interval\n const roundedTime =\n SNAP_NEAREST_MINUTES * Math.round(preciseTime / SNAP_NEAREST_MINUTES);\n // prevent over-rounding to 24:00:00\n const limitMax = Math.min(SECONDS_IN_DAY, roundedTime);\n return limitMax;\n },\n [track]\n );\n\n const handleMouseMove = useCallback(\n ({ clientX }: MouseEvent) => {\n setTime(calculatePositionAsTime(clientX));\n },\n [setTime, calculatePositionAsTime]\n );\n\n const handleMouseUp = useCallback(\n ({ clientX }: MouseEvent) => {\n setTime(calculatePositionAsTime(clientX));\n\n window.removeEventListener('mousemove', handleMouseMove);\n window.removeEventListener('mouseup', handleMouseUp);\n document.documentElement.classList.remove('drag-pointer-events-none');\n },\n [setTime, calculatePositionAsTime, handleMouseMove]\n );\n\n const startDragListening = useCallback(() => {\n window.addEventListener('mousemove', handleMouseMove);\n window.addEventListener('mouseup', handleMouseUp);\n document.documentElement.classList.add('drag-pointer-events-none');\n }, [handleMouseMove, handleMouseUp]);\n\n const stopDragListening = useCallback(() => {\n window.removeEventListener('mousemove', handleMouseMove);\n window.removeEventListener('mouseup', handleMouseUp);\n document.documentElement.classList.remove('drag-pointer-events-none');\n }, [handleMouseMove, handleMouseUp]);\n\n const handleMouseDown = useCallback(() => {\n startDragListening();\n }, [startDragListening]);\n\n useEffect(\n function removeListenersOnUnmount() {\n return () => {\n stopDragListening();\n };\n },\n [stopDragListening]\n );\n\n return (\n <div className=\"handle-track\" style={{ transform }}>\n <button\n className=\"handle\"\n type=\"button\"\n aria-label=\"Change time\"\n onMouseDown={handleMouseDown}\n data-testid={dataTestId}\n />\n </div>\n );\n}\n\nexport default TimeSlider;\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ConfirmActionButton.d.ts","sourceRoot":"","sources":["../../src/actions/ConfirmActionButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,SAAS,EAAe,MAAM,OAAO,CAAC;AAC7D,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,qBAAqB,CAAC;AAKlE,MAAM,WAAW,wBAAwB;IACvC,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,SAAS,CAAC;IACnB,uBAAuB,EAAE,MAAM,CAAC;IAChC,QAAQ,EACJ,YAAY,CAAC,sBAAsB,CAAC,GACpC,YAAY,CAAC,sBAAsB,CAAC,EAAE,CAAC;IAC3C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,wBAAgB,mBAAmB,CAAC,EAClC,SAAS,EACT,OAAO,EACP,uBAAuB,EACvB,QAAQ,EACR,QAAQ,EACR,SAAS,GACV,EAAE,wBAAwB,
|
|
1
|
+
{"version":3,"file":"ConfirmActionButton.d.ts","sourceRoot":"","sources":["../../src/actions/ConfirmActionButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,SAAS,EAAe,MAAM,OAAO,CAAC;AAC7D,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,qBAAqB,CAAC;AAKlE,MAAM,WAAW,wBAAwB;IACvC,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,SAAS,CAAC;IACnB,uBAAuB,EAAE,MAAM,CAAC;IAChC,QAAQ,EACJ,YAAY,CAAC,sBAAsB,CAAC,GACpC,YAAY,CAAC,sBAAsB,CAAC,EAAE,CAAC;IAC3C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,wBAAgB,mBAAmB,CAAC,EAClC,SAAS,EACT,OAAO,EACP,uBAAuB,EACvB,QAAQ,EACR,QAAQ,EACR,SAAS,GACV,EAAE,wBAAwB,GAAG,GAAG,CAAC,OAAO,CA6BxC;AAED,eAAe,mBAAmB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ConfirmActionButton.js","names":["useCallback","vsTrash","ACTION_ICON_HEIGHT","ActionButtonDialogTrigger","ConfirmationDialog","ConfirmActionButton","ariaLabel","heading","confirmationButtonLabel","isHidden","children","onConfirm","renderDialog","close"],"sources":["../../src/actions/ConfirmActionButton.tsx"],"sourcesContent":["import { ReactElement, ReactNode, useCallback } from 'react';\nimport type { SpectrumLabelableProps } from '@react-types/shared';\nimport { vsTrash } from '@deephaven/icons';\nimport { ACTION_ICON_HEIGHT } from '@deephaven/utils';\nimport { ActionButtonDialogTrigger, ConfirmationDialog } from '../dialogs';\n\nexport interface ConfirmActionButtonProps {\n ariaLabel: string;\n heading: ReactNode;\n confirmationButtonLabel: string;\n children:\n | ReactElement<SpectrumLabelableProps>\n | ReactElement<SpectrumLabelableProps>[];\n isHidden?: boolean;\n onConfirm: () => void;\n}\n\nexport function ConfirmActionButton({\n ariaLabel,\n heading,\n confirmationButtonLabel,\n isHidden,\n children,\n onConfirm,\n}: ConfirmActionButtonProps) {\n const renderDialog = useCallback(\n close => (\n <ConfirmationDialog\n heading={heading}\n confirmationButtonLabel={confirmationButtonLabel}\n onCancel={close}\n onConfirm={() => {\n close();\n onConfirm();\n }}\n >\n {children}\n </ConfirmationDialog>\n ),\n [children, confirmationButtonLabel, heading, onConfirm]\n );\n\n return (\n <ActionButtonDialogTrigger\n ariaLabel={ariaLabel}\n icon={vsTrash}\n isHidden={isHidden}\n isQuiet\n height={ACTION_ICON_HEIGHT}\n >\n {renderDialog}\n </ActionButtonDialogTrigger>\n );\n}\n\nexport default ConfirmActionButton;\n"],"mappings":"AAAA,SAAkCA,WAAW,QAAQ,OAAO;AAE5D,SAASC,OAAO,QAAQ,kBAAkB;AAC1C,SAASC,kBAAkB,QAAQ,kBAAkB;AAAC,SAC7CC,yBAAyB,EAAEC,kBAAkB;AAAA;AAatD,OAAO,SAASC,mBAAmB,
|
|
1
|
+
{"version":3,"file":"ConfirmActionButton.js","names":["useCallback","vsTrash","ACTION_ICON_HEIGHT","ActionButtonDialogTrigger","ConfirmationDialog","ConfirmActionButton","ariaLabel","heading","confirmationButtonLabel","isHidden","children","onConfirm","renderDialog","close"],"sources":["../../src/actions/ConfirmActionButton.tsx"],"sourcesContent":["import { ReactElement, ReactNode, useCallback } from 'react';\nimport type { SpectrumLabelableProps } from '@react-types/shared';\nimport { vsTrash } from '@deephaven/icons';\nimport { ACTION_ICON_HEIGHT } from '@deephaven/utils';\nimport { ActionButtonDialogTrigger, ConfirmationDialog } from '../dialogs';\n\nexport interface ConfirmActionButtonProps {\n ariaLabel: string;\n heading: ReactNode;\n confirmationButtonLabel: string;\n children:\n | ReactElement<SpectrumLabelableProps>\n | ReactElement<SpectrumLabelableProps>[];\n isHidden?: boolean;\n onConfirm: () => void;\n}\n\nexport function ConfirmActionButton({\n ariaLabel,\n heading,\n confirmationButtonLabel,\n isHidden,\n children,\n onConfirm,\n}: ConfirmActionButtonProps): JSX.Element {\n const renderDialog = useCallback(\n close => (\n <ConfirmationDialog\n heading={heading}\n confirmationButtonLabel={confirmationButtonLabel}\n onCancel={close}\n onConfirm={() => {\n close();\n onConfirm();\n }}\n >\n {children}\n </ConfirmationDialog>\n ),\n [children, confirmationButtonLabel, heading, onConfirm]\n );\n\n return (\n <ActionButtonDialogTrigger\n ariaLabel={ariaLabel}\n icon={vsTrash}\n isHidden={isHidden}\n isQuiet\n height={ACTION_ICON_HEIGHT}\n >\n {renderDialog}\n </ActionButtonDialogTrigger>\n );\n}\n\nexport default ConfirmActionButton;\n"],"mappings":"AAAA,SAAkCA,WAAW,QAAQ,OAAO;AAE5D,SAASC,OAAO,QAAQ,kBAAkB;AAC1C,SAASC,kBAAkB,QAAQ,kBAAkB;AAAC,SAC7CC,yBAAyB,EAAEC,kBAAkB;AAAA;AAatD,OAAO,SAASC,mBAAmB,OAOO;EAAA,IAPN;IAClCC,SAAS;IACTC,OAAO;IACPC,uBAAuB;IACvBC,QAAQ;IACRC,QAAQ;IACRC,SAAS,EAATA;EACwB,CAAC;EACzB,IAAMC,YAAY,GAAGZ,WAAW,CAC9Ba,KAAK,iBACH,KAAC,kBAAkB;IACjB,OAAO,EAAEN,OAAQ;IACjB,uBAAuB,EAAEC,uBAAwB;IACjD,QAAQ,EAAEK,KAAM;IAChB,SAAS,EAAE,MAAM;MACfA,KAAK,EAAE;MACPF,UAAS,EAAE;IACb,CAAE;IAAA,UAEDD;EAAQ,EAEZ,EACD,CAACA,QAAQ,EAAEF,uBAAuB,EAAED,OAAO,EAAEI,UAAS,CAAC,CACxD;EAED,oBACE,KAAC,yBAAyB;IACxB,SAAS,EAAEL,SAAU;IACrB,IAAI,EAAEL,OAAQ;IACd,QAAQ,EAAEQ,QAAS;IACnB,OAAO;IACP,MAAM,EAAEP,kBAAmB;IAAA,UAE1BU;EAAY,EACa;AAEhC;AAEA,eAAeP,mBAAmB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconActionButton.d.ts","sourceRoot":"","sources":["../../src/actions/IconActionButton.tsx"],"names":[],"mappings":";AACA,OAAO,EAGL,yBAAyB,EAC1B,MAAM,uBAAuB,CAAC;AAE/B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,mCAAmC,CAAC;AAGlE,MAAM,WAAW,qBACf,SAAQ,IAAI,CAAC,yBAAyB,EAAE,YAAY,GAAG,SAAS,GAAG,QAAQ,CAAC;IAC5E,IAAI,EAAE,QAAQ,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;CACf;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,IAAI,EACJ,KAAK,EACL,GAAG,KAAK,EACT,EAAE,qBAAqB,
|
|
1
|
+
{"version":3,"file":"IconActionButton.d.ts","sourceRoot":"","sources":["../../src/actions/IconActionButton.tsx"],"names":[],"mappings":";AACA,OAAO,EAGL,yBAAyB,EAC1B,MAAM,uBAAuB,CAAC;AAE/B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,mCAAmC,CAAC;AAGlE,MAAM,WAAW,qBACf,SAAQ,IAAI,CAAC,yBAAyB,EAAE,YAAY,GAAG,SAAS,GAAG,QAAQ,CAAC;IAC5E,IAAI,EAAE,QAAQ,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;CACf;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,IAAI,EACJ,KAAK,EACL,GAAG,KAAK,EACT,EAAE,qBAAqB,GAAG,GAAG,CAAC,OAAO,CAarC;yBAjBe,gBAAgB;;;AAoBhC,eAAe,gBAAgB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconActionButton.js","names":["ActionButton","Icon","FontAwesomeIcon","ACTION_ICON_HEIGHT","IconActionButton","icon","label","props","displayName"],"sources":["../../src/actions/IconActionButton.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\nimport {\n ActionButton,\n Icon,\n SpectrumActionButtonProps,\n} from '@adobe/react-spectrum';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport type { IconProp } from '@fortawesome/fontawesome-svg-core';\nimport { ACTION_ICON_HEIGHT } from '@deephaven/utils';\n\nexport interface IconActionButtonProps\n extends Omit<SpectrumActionButtonProps, 'aria-label' | 'isQuiet' | 'height'> {\n icon: IconProp;\n label: string;\n}\n\nexport function IconActionButton({\n icon,\n label,\n ...props\n}: IconActionButtonProps) {\n return (\n <ActionButton\n {...props}\n aria-label={label}\n isQuiet\n height={ACTION_ICON_HEIGHT}\n >\n <Icon>\n <FontAwesomeIcon icon={icon} />\n </Icon>\n </ActionButton>\n );\n}\nIconActionButton.displayName = 'IconActionButton';\n\nexport default IconActionButton;\n"],"mappings":";;;;;;;;AAAA;AACA,SACEA,YAAY,EACZC,IAAI,QAEC,uBAAuB;AAC9B,SAASC,eAAe,QAAQ,gCAAgC;AAEhE,SAASC,kBAAkB,QAAQ,kBAAkB;AAAC;AAQtD,OAAO,SAASC,gBAAgB,
|
|
1
|
+
{"version":3,"file":"IconActionButton.js","names":["ActionButton","Icon","FontAwesomeIcon","ACTION_ICON_HEIGHT","IconActionButton","icon","label","props","displayName"],"sources":["../../src/actions/IconActionButton.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\nimport {\n ActionButton,\n Icon,\n SpectrumActionButtonProps,\n} from '@adobe/react-spectrum';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport type { IconProp } from '@fortawesome/fontawesome-svg-core';\nimport { ACTION_ICON_HEIGHT } from '@deephaven/utils';\n\nexport interface IconActionButtonProps\n extends Omit<SpectrumActionButtonProps, 'aria-label' | 'isQuiet' | 'height'> {\n icon: IconProp;\n label: string;\n}\n\nexport function IconActionButton({\n icon,\n label,\n ...props\n}: IconActionButtonProps): JSX.Element {\n return (\n <ActionButton\n {...props}\n aria-label={label}\n isQuiet\n height={ACTION_ICON_HEIGHT}\n >\n <Icon>\n <FontAwesomeIcon icon={icon} />\n </Icon>\n </ActionButton>\n );\n}\nIconActionButton.displayName = 'IconActionButton';\n\nexport default IconActionButton;\n"],"mappings":";;;;;;;;AAAA;AACA,SACEA,YAAY,EACZC,IAAI,QAEC,uBAAuB;AAC9B,SAASC,eAAe,QAAQ,gCAAgC;AAEhE,SAASC,kBAAkB,QAAQ,kBAAkB;AAAC;AAQtD,OAAO,SAASC,gBAAgB,OAIO;EAAA,IAJN;MAC/BC,IAAI;MACJC;IAEqB,CAAC;IADnBC,KAAK;EAER,oBACE,KAAC,YAAY,kCACPA,KAAK;IACT,cAAYD,KAAM;IAClB,OAAO;IACP,MAAM,EAAEH,kBAAmB;IAAA,uBAE3B,KAAC,IAAI;MAAA,uBACH,KAAC,eAAe;QAAC,IAAI,EAAEE;MAAK;IAAG;EAC1B,GACM;AAEnB;AACAD,gBAAgB,CAACI,WAAW,GAAG,kBAAkB;AAEjD,eAAeJ,gBAAgB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ContextMenuItem.js","names":["React","classNames","FontAwesomeIcon","vsChevronRight","ContextMenuItem","forwardRef","props","ref","handleMenuItemClick","e","menuItem","onMenuItemClick","handleMenuItemMouseMove","onMenuItemMouseMove","handleMenuItemContextMenu","onMenuItemContextMenu","renderCustomMenuElement","element","iconElement","displayShortcut","type","closeMenu","isKeyboardSelected","isMouseSelected","dataTestId","forwardedProps","cloneElement","children","shortcut","getDisplayText","icon","menuItemIcon","isValidElement","style","iconColor","disabled","undefined","color","subMenuIndicator","isSubMenuActive","Boolean","actions","content","menuElement","menuItemDisabled","iconHasOutline","iconOutline","active","description","outline","title","displayName","defaultProps"],"sources":["../../src/context-actions/ContextMenuItem.tsx"],"sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { vsChevronRight, IconDefinition } from '@deephaven/icons';\nimport type { ContextAction } from './ContextActionUtils';\n\ninterface ContextMenuItemProps {\n children?: React.ReactNode;\n closeMenu(closeAll: boolean): void;\n isKeyboardSelected?: boolean;\n isMouseSelected?: boolean;\n menuItem: ContextAction;\n onMenuItemClick(item: ContextAction, e: React.MouseEvent): void;\n onMenuItemMouseMove(item: ContextAction, e: React.MouseEvent): void;\n onMenuItemContextMenu(item: ContextAction, e: React.MouseEvent): void;\n 'data-testid'?: string;\n}\n\nconst ContextMenuItem = React.forwardRef<HTMLDivElement, ContextMenuItemProps>(\n (props: ContextMenuItemProps, ref) => {\n function handleMenuItemClick(e: React.MouseEvent) {\n const { menuItem, onMenuItemClick } = props;\n onMenuItemClick(menuItem, e);\n }\n\n function handleMenuItemMouseMove(e: React.MouseEvent) {\n const { menuItem, onMenuItemMouseMove } = props;\n onMenuItemMouseMove(menuItem, e);\n }\n\n function handleMenuItemContextMenu(e: React.MouseEvent) {\n const { menuItem, onMenuItemContextMenu } = props;\n onMenuItemContextMenu(menuItem, e);\n }\n\n function renderCustomMenuElement(\n element: React.ReactElement,\n iconElement: IconDefinition | React.ReactElement | null,\n displayShortcut: string | undefined\n ): JSX.Element {\n // Don't pass forwardedProps if menuElement is a native DOM node\n if (typeof element.type === 'string') {\n return element;\n }\n const {\n closeMenu,\n menuItem,\n isKeyboardSelected,\n isMouseSelected,\n 'data-testid': dataTestId,\n } = props;\n const forwardedProps = {\n menuItem,\n closeMenu,\n isKeyboardSelected,\n isMouseSelected,\n iconElement,\n displayShortcut,\n 'data-testid': dataTestId,\n };\n return React.cloneElement(element, {\n forwardedProps,\n });\n }\n\n const {\n children,\n menuItem,\n isKeyboardSelected = false,\n isMouseSelected = false,\n 'data-testid': dataTestId,\n } = props;\n\n const displayShortcut = menuItem.shortcut?.getDisplayText();\n let icon: IconDefinition | React.ReactElement | null = null;\n if (menuItem.icon) {\n const menuItemIcon = menuItem.icon;\n if (React.isValidElement(menuItemIcon)) {\n icon = menuItemIcon;\n } else {\n let style: React.CSSProperties | undefined;\n if (\n menuItem.iconColor != null &&\n (menuItem.disabled === undefined || !menuItem.disabled)\n ) {\n style = { color: menuItem.iconColor };\n }\n icon = <FontAwesomeIcon icon={menuItemIcon} style={style} />;\n }\n }\n\n let subMenuIndicator = null;\n const isSubMenuActive = Boolean(children);\n if (menuItem.actions) {\n subMenuIndicator = <FontAwesomeIcon icon={vsChevronRight} />;\n }\n let content = null;\n if (menuItem.menuElement) {\n content = (\n <div className=\"custom-menu-item\" onMouseMove={handleMenuItemMouseMove}>\n {renderCustomMenuElement(menuItem.menuElement, icon, displayShortcut)}\n </div>\n );\n } else {\n const menuItemDisabled = menuItem.disabled;\n const iconHasOutline = menuItem.iconOutline;\n content = (\n <button\n type=\"button\"\n className={classNames(\n 'btn-context-menu',\n { disabled: menuItemDisabled },\n {\n active:\n (isSubMenuActive || isMouseSelected) &&\n (menuItemDisabled === undefined || !menuItemDisabled),\n },\n {\n 'keyboard-active':\n isKeyboardSelected &&\n (menuItemDisabled === undefined || !menuItemDisabled),\n }\n )}\n onClick={handleMenuItemClick}\n onMouseMove={handleMenuItemMouseMove}\n onContextMenu={handleMenuItemContextMenu}\n title={menuItem.description ?? ''}\n >\n <div className=\"btn-context-menu-wrapper\">\n <span className={classNames('icon', { outline: iconHasOutline })}>\n {icon}\n </span>\n <span className=\"title\">{menuItem.title}</span>\n {displayShortcut !== undefined && (\n <span className=\"shortcut\">{displayShortcut}</span>\n )}\n {subMenuIndicator && (\n <span\n className={classNames('submenu-indicator', {\n disabled: menuItemDisabled,\n })}\n >\n {subMenuIndicator}\n </span>\n )}\n </div>\n </button>\n );\n }\n\n return (\n <div className=\"context-menu-item\" ref={ref} data-testid={dataTestId}>\n {children}\n {content}\n </div>\n );\n }\n);\n\nContextMenuItem.displayName = 'ContextMenuItem';\n\nContextMenuItem.defaultProps = {\n children: null,\n isKeyboardSelected: false,\n isMouseSelected: false,\n 'data-testid': undefined,\n};\n\nexport default ContextMenuItem;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,eAAe,QAAQ,gCAAgC;AAChE,SAASC,cAAc,QAAwB,kBAAkB;AAAC;AAAA;AAelE,IAAMC,eAAe,gBAAGJ,KAAK,CAACK,UAAU,CACtC,CAACC,KAA2B,EAAEC,GAAG,KAAK;EAAA;EACpC,SAASC,mBAAmB,CAACC,CAAmB,
|
|
1
|
+
{"version":3,"file":"ContextMenuItem.js","names":["React","classNames","FontAwesomeIcon","vsChevronRight","ContextMenuItem","forwardRef","props","ref","handleMenuItemClick","e","menuItem","onMenuItemClick","handleMenuItemMouseMove","onMenuItemMouseMove","handleMenuItemContextMenu","onMenuItemContextMenu","renderCustomMenuElement","element","iconElement","displayShortcut","type","closeMenu","isKeyboardSelected","isMouseSelected","dataTestId","forwardedProps","cloneElement","children","shortcut","getDisplayText","icon","menuItemIcon","isValidElement","style","iconColor","disabled","undefined","color","subMenuIndicator","isSubMenuActive","Boolean","actions","content","menuElement","menuItemDisabled","iconHasOutline","iconOutline","active","description","outline","title","displayName","defaultProps"],"sources":["../../src/context-actions/ContextMenuItem.tsx"],"sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { vsChevronRight, IconDefinition } from '@deephaven/icons';\nimport type { ContextAction } from './ContextActionUtils';\n\ninterface ContextMenuItemProps {\n children?: React.ReactNode;\n closeMenu(closeAll: boolean): void;\n isKeyboardSelected?: boolean;\n isMouseSelected?: boolean;\n menuItem: ContextAction;\n onMenuItemClick(item: ContextAction, e: React.MouseEvent): void;\n onMenuItemMouseMove(item: ContextAction, e: React.MouseEvent): void;\n onMenuItemContextMenu(item: ContextAction, e: React.MouseEvent): void;\n 'data-testid'?: string;\n}\n\nconst ContextMenuItem = React.forwardRef<HTMLDivElement, ContextMenuItemProps>(\n (props: ContextMenuItemProps, ref) => {\n function handleMenuItemClick(e: React.MouseEvent): void {\n const { menuItem, onMenuItemClick } = props;\n onMenuItemClick(menuItem, e);\n }\n\n function handleMenuItemMouseMove(e: React.MouseEvent): void {\n const { menuItem, onMenuItemMouseMove } = props;\n onMenuItemMouseMove(menuItem, e);\n }\n\n function handleMenuItemContextMenu(e: React.MouseEvent): void {\n const { menuItem, onMenuItemContextMenu } = props;\n onMenuItemContextMenu(menuItem, e);\n }\n\n function renderCustomMenuElement(\n element: React.ReactElement,\n iconElement: IconDefinition | React.ReactElement | null,\n displayShortcut: string | undefined\n ): JSX.Element {\n // Don't pass forwardedProps if menuElement is a native DOM node\n if (typeof element.type === 'string') {\n return element;\n }\n const {\n closeMenu,\n menuItem,\n isKeyboardSelected,\n isMouseSelected,\n 'data-testid': dataTestId,\n } = props;\n const forwardedProps = {\n menuItem,\n closeMenu,\n isKeyboardSelected,\n isMouseSelected,\n iconElement,\n displayShortcut,\n 'data-testid': dataTestId,\n };\n return React.cloneElement(element, {\n forwardedProps,\n });\n }\n\n const {\n children,\n menuItem,\n isKeyboardSelected = false,\n isMouseSelected = false,\n 'data-testid': dataTestId,\n } = props;\n\n const displayShortcut = menuItem.shortcut?.getDisplayText();\n let icon: IconDefinition | React.ReactElement | null = null;\n if (menuItem.icon) {\n const menuItemIcon = menuItem.icon;\n if (React.isValidElement(menuItemIcon)) {\n icon = menuItemIcon;\n } else {\n let style: React.CSSProperties | undefined;\n if (\n menuItem.iconColor != null &&\n (menuItem.disabled === undefined || !menuItem.disabled)\n ) {\n style = { color: menuItem.iconColor };\n }\n icon = <FontAwesomeIcon icon={menuItemIcon} style={style} />;\n }\n }\n\n let subMenuIndicator = null;\n const isSubMenuActive = Boolean(children);\n if (menuItem.actions) {\n subMenuIndicator = <FontAwesomeIcon icon={vsChevronRight} />;\n }\n let content = null;\n if (menuItem.menuElement) {\n content = (\n <div className=\"custom-menu-item\" onMouseMove={handleMenuItemMouseMove}>\n {renderCustomMenuElement(menuItem.menuElement, icon, displayShortcut)}\n </div>\n );\n } else {\n const menuItemDisabled = menuItem.disabled;\n const iconHasOutline = menuItem.iconOutline;\n content = (\n <button\n type=\"button\"\n className={classNames(\n 'btn-context-menu',\n { disabled: menuItemDisabled },\n {\n active:\n (isSubMenuActive || isMouseSelected) &&\n (menuItemDisabled === undefined || !menuItemDisabled),\n },\n {\n 'keyboard-active':\n isKeyboardSelected &&\n (menuItemDisabled === undefined || !menuItemDisabled),\n }\n )}\n onClick={handleMenuItemClick}\n onMouseMove={handleMenuItemMouseMove}\n onContextMenu={handleMenuItemContextMenu}\n title={menuItem.description ?? ''}\n >\n <div className=\"btn-context-menu-wrapper\">\n <span className={classNames('icon', { outline: iconHasOutline })}>\n {icon}\n </span>\n <span className=\"title\">{menuItem.title}</span>\n {displayShortcut !== undefined && (\n <span className=\"shortcut\">{displayShortcut}</span>\n )}\n {subMenuIndicator && (\n <span\n className={classNames('submenu-indicator', {\n disabled: menuItemDisabled,\n })}\n >\n {subMenuIndicator}\n </span>\n )}\n </div>\n </button>\n );\n }\n\n return (\n <div className=\"context-menu-item\" ref={ref} data-testid={dataTestId}>\n {children}\n {content}\n </div>\n );\n }\n);\n\nContextMenuItem.displayName = 'ContextMenuItem';\n\nContextMenuItem.defaultProps = {\n children: null,\n isKeyboardSelected: false,\n isMouseSelected: false,\n 'data-testid': undefined,\n};\n\nexport default ContextMenuItem;\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ConfirmationDialog.d.ts","sourceRoot":"","sources":["../../src/dialogs/ConfirmationDialog.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAUhD,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,qBAAqB,CAAC;AAIlE,MAAM,WAAW,uBAAuB;IACtC,OAAO,EAAE,SAAS,CAAC;IACnB,uBAAuB,EAAE,MAAM,CAAC;IAChC,QAAQ,EACJ,YAAY,CAAC,sBAAsB,CAAC,GACpC,YAAY,CAAC,sBAAsB,CAAC,EAAE,CAAC;IAC3C,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,wBAAgB,kBAAkB,CAAC,EACjC,OAAO,EACP,uBAAuB,EACvB,QAAQ,EACR,QAAQ,EACR,SAAS,GACV,EAAE,uBAAuB,
|
|
1
|
+
{"version":3,"file":"ConfirmationDialog.d.ts","sourceRoot":"","sources":["../../src/dialogs/ConfirmationDialog.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAUhD,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,qBAAqB,CAAC;AAIlE,MAAM,WAAW,uBAAuB;IACtC,OAAO,EAAE,SAAS,CAAC;IACnB,uBAAuB,EAAE,MAAM,CAAC;IAChC,QAAQ,EACJ,YAAY,CAAC,sBAAsB,CAAC,GACpC,YAAY,CAAC,sBAAsB,CAAC,EAAE,CAAC;IAC3C,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,EAAE,MAAM,IAAI,CAAC;CACvB;AAED,wBAAgB,kBAAkB,CAAC,EACjC,OAAO,EACP,uBAAuB,EACvB,QAAQ,EACR,QAAQ,EACR,SAAS,GACV,EAAE,uBAAuB,GAAG,GAAG,CAAC,OAAO,CAqCvC;AAED,eAAe,kBAAkB,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ConfirmationDialog.js","names":["Button","ButtonGroup","Content","Dialog","Divider","Form","Heading","useFormWithDetachedSubmitButton","styles","ConfirmationDialog","heading","confirmationButtonLabel","children","onCancel","onConfirm","formProps","submitButtonProps","spectrumDialogComponentHeading"],"sources":["../../src/dialogs/ConfirmationDialog.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\nimport { ReactElement, ReactNode } from 'react';\nimport {\n Button,\n ButtonGroup,\n Content,\n Dialog,\n Divider,\n Form,\n Heading,\n} from '@adobe/react-spectrum';\nimport type { SpectrumLabelableProps } from '@react-types/shared';\nimport { useFormWithDetachedSubmitButton } from '@deephaven/react-hooks';\nimport styles from '../SpectrumComponent.module.scss';\n\nexport interface ConfirmationDialogProps {\n heading: ReactNode;\n confirmationButtonLabel: string;\n children:\n | ReactElement<SpectrumLabelableProps>\n | ReactElement<SpectrumLabelableProps>[];\n onCancel: () => void;\n onConfirm: () => void;\n}\n\nexport function ConfirmationDialog({\n heading,\n confirmationButtonLabel,\n children,\n onCancel,\n onConfirm,\n}: ConfirmationDialogProps) {\n const { formProps, submitButtonProps } = useFormWithDetachedSubmitButton();\n\n return (\n <Dialog>\n <Heading\n level={3}\n UNSAFE_className={styles.spectrumDialogComponentHeading}\n >\n {heading}\n </Heading>\n <Divider />\n <Content>\n <Form\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...formProps}\n >\n {children}\n </Form>\n </Content>\n <ButtonGroup>\n <Button variant=\"secondary\" onPress={onCancel}>\n Cancel\n </Button>\n <Button\n {...submitButtonProps}\n // eslint-disable-next-line react/style-prop-object\n style=\"fill\"\n variant=\"negative\"\n onPress={onConfirm}\n type=\"submit\"\n >\n {confirmationButtonLabel}\n </Button>\n </ButtonGroup>\n </Dialog>\n );\n}\n\nexport default ConfirmationDialog;\n"],"mappings":";;;;;AAAA;;AAEA,SACEA,MAAM,EACNC,WAAW,EACXC,OAAO,EACPC,MAAM,EACNC,OAAO,EACPC,IAAI,EACJC,OAAO,QACF,uBAAuB;AAE9B,SAASC,+BAA+B,QAAQ,wBAAwB;AAAC,OAClEC,MAAM;AAAA;AAAA;AAYb,OAAO,SAASC,kBAAkB,
|
|
1
|
+
{"version":3,"file":"ConfirmationDialog.js","names":["Button","ButtonGroup","Content","Dialog","Divider","Form","Heading","useFormWithDetachedSubmitButton","styles","ConfirmationDialog","heading","confirmationButtonLabel","children","onCancel","onConfirm","formProps","submitButtonProps","spectrumDialogComponentHeading"],"sources":["../../src/dialogs/ConfirmationDialog.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\nimport { ReactElement, ReactNode } from 'react';\nimport {\n Button,\n ButtonGroup,\n Content,\n Dialog,\n Divider,\n Form,\n Heading,\n} from '@adobe/react-spectrum';\nimport type { SpectrumLabelableProps } from '@react-types/shared';\nimport { useFormWithDetachedSubmitButton } from '@deephaven/react-hooks';\nimport styles from '../SpectrumComponent.module.scss';\n\nexport interface ConfirmationDialogProps {\n heading: ReactNode;\n confirmationButtonLabel: string;\n children:\n | ReactElement<SpectrumLabelableProps>\n | ReactElement<SpectrumLabelableProps>[];\n onCancel: () => void;\n onConfirm: () => void;\n}\n\nexport function ConfirmationDialog({\n heading,\n confirmationButtonLabel,\n children,\n onCancel,\n onConfirm,\n}: ConfirmationDialogProps): JSX.Element {\n const { formProps, submitButtonProps } = useFormWithDetachedSubmitButton();\n\n return (\n <Dialog>\n <Heading\n level={3}\n UNSAFE_className={styles.spectrumDialogComponentHeading}\n >\n {heading}\n </Heading>\n <Divider />\n <Content>\n <Form\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...formProps}\n >\n {children}\n </Form>\n </Content>\n <ButtonGroup>\n <Button variant=\"secondary\" onPress={onCancel}>\n Cancel\n </Button>\n <Button\n {...submitButtonProps}\n // eslint-disable-next-line react/style-prop-object\n style=\"fill\"\n variant=\"negative\"\n onPress={onConfirm}\n type=\"submit\"\n >\n {confirmationButtonLabel}\n </Button>\n </ButtonGroup>\n </Dialog>\n );\n}\n\nexport default ConfirmationDialog;\n"],"mappings":";;;;;AAAA;;AAEA,SACEA,MAAM,EACNC,WAAW,EACXC,OAAO,EACPC,MAAM,EACNC,OAAO,EACPC,IAAI,EACJC,OAAO,QACF,uBAAuB;AAE9B,SAASC,+BAA+B,QAAQ,wBAAwB;AAAC,OAClEC,MAAM;AAAA;AAAA;AAYb,OAAO,SAASC,kBAAkB,OAMO;EAAA,IANN;IACjCC,OAAO;IACPC,uBAAuB;IACvBC,QAAQ;IACRC,QAAQ;IACRC;EACuB,CAAC;EACxB,IAAM;IAAEC,SAAS;IAAEC;EAAkB,CAAC,GAAGT,+BAA+B,EAAE;EAE1E,oBACE,MAAC,MAAM;IAAA,wBACL,KAAC,OAAO;MACN,KAAK,EAAE,CAAE;MACT,gBAAgB,EAAEC,MAAM,CAACS,8BAA+B;MAAA,UAEvDP;IAAO,EACA,eACV,KAAC,OAAO,KAAG,eACX,KAAC,OAAO;MAAA,uBACN,KAAC;MACC;MAAA,kCACIK,SAAS;QAAA,UAEZH;MAAQ;IACJ,EACC,eACV,MAAC,WAAW;MAAA,wBACV,KAAC,MAAM;QAAC,OAAO,EAAC,WAAW;QAAC,OAAO,EAAEC,QAAS;QAAA,UAAC;MAE/C,EAAS,eACT,KAAC,MAAM,kCACDG,iBAAiB;QACrB;QACA,KAAK,EAAC,MAAM;QACZ,OAAO,EAAC,UAAU;QAClB,OAAO,EAAEF,SAAU;QACnB,IAAI,EAAC,QAAQ;QAAA,UAEZH;MAAuB,GACjB;IAAA,EACG;EAAA,EACP;AAEb;AAEA,eAAeF,kBAAkB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DebouncedModal.d.ts","sourceRoot":"","sources":["../../src/modal/DebouncedModal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,MAAM,MAAM,mBAAmB,GAAG;IAChC,+CAA+C;IAC/C,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAE3B,yDAAyD;IACzD,QAAQ,EAAE,KAAK,CAAC,YAAY,CAAC;IAE7B,uBAAuB;IACvB,UAAU,EAAE,MAAM,CAAC;IAEnB;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB,CAAC;AAEF;;;GAGG;AACH,iBAAS,cAAc,CAAC,EACtB,gBAAuB,EACvB,QAAQ,EACR,UAAU,EACV,MAAc,GACf,EAAE,mBAAmB,
|
|
1
|
+
{"version":3,"file":"DebouncedModal.d.ts","sourceRoot":"","sources":["../../src/modal/DebouncedModal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,MAAM,MAAM,mBAAmB,GAAG;IAChC,+CAA+C;IAC/C,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAE3B,yDAAyD;IACzD,QAAQ,EAAE,KAAK,CAAC,YAAY,CAAC;IAE7B,uBAAuB;IACvB,UAAU,EAAE,MAAM,CAAC;IAEnB;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB,CAAC;AAEF;;;GAGG;AACH,iBAAS,cAAc,CAAC,EACtB,gBAAuB,EACvB,QAAQ,EACR,UAAU,EACV,MAAc,GACf,EAAE,mBAAmB,GAAG,GAAG,CAAC,OAAO,CAenC;AAED,eAAe,cAAc,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DebouncedModal.js","names":["React","useDebouncedValue","DebouncedModal","blockInteraction","children","debounceMs","isOpen","debouncedIsOpen","backgroundColor","cloneElement"],"sources":["../../src/modal/DebouncedModal.tsx"],"sourcesContent":["import React from 'react';\nimport { useDebouncedValue } from '@deephaven/react-hooks';\n\nexport type DebouncedModalProps = {\n /** Whether to block interaction immediately */\n blockInteraction?: boolean;\n\n /** Children to render after the alloted debounce time */\n children: React.ReactElement;\n\n /** Time to debounce */\n debounceMs: number;\n\n /**\n * Will render the `children` `debounceMs` after `isOpen` is set to `true.\n * Will stop rendering immediately after `isOpen` is set to `false`.\n */\n isOpen?: boolean;\n};\n\n/**\n * Display a modal after a debounce time. Blocks the screen from interaction immediately,\n * but then waits the set debounce time before rendering the modal.\n */\nfunction DebouncedModal({\n blockInteraction = true,\n children,\n debounceMs,\n isOpen = false,\n}: DebouncedModalProps) {\n const debouncedIsOpen = useDebouncedValue(isOpen, debounceMs);\n\n return (\n <>\n {blockInteraction && isOpen && (\n <div\n className=\"modal-backdrop\"\n style={{ backgroundColor: 'transparent' }}\n data-testid=\"debounced-modal-backdrop\"\n />\n )}\n {React.cloneElement(children, { isOpen: isOpen && debouncedIsOpen })}\n </>\n );\n}\n\nexport default DebouncedModal;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,iBAAiB,QAAQ,wBAAwB;AAAC;AAAA;AAAA;AAmB3D;AACA;AACA;AACA;AACA,SAASC,cAAc,
|
|
1
|
+
{"version":3,"file":"DebouncedModal.js","names":["React","useDebouncedValue","DebouncedModal","blockInteraction","children","debounceMs","isOpen","debouncedIsOpen","backgroundColor","cloneElement"],"sources":["../../src/modal/DebouncedModal.tsx"],"sourcesContent":["import React from 'react';\nimport { useDebouncedValue } from '@deephaven/react-hooks';\n\nexport type DebouncedModalProps = {\n /** Whether to block interaction immediately */\n blockInteraction?: boolean;\n\n /** Children to render after the alloted debounce time */\n children: React.ReactElement;\n\n /** Time to debounce */\n debounceMs: number;\n\n /**\n * Will render the `children` `debounceMs` after `isOpen` is set to `true.\n * Will stop rendering immediately after `isOpen` is set to `false`.\n */\n isOpen?: boolean;\n};\n\n/**\n * Display a modal after a debounce time. Blocks the screen from interaction immediately,\n * but then waits the set debounce time before rendering the modal.\n */\nfunction DebouncedModal({\n blockInteraction = true,\n children,\n debounceMs,\n isOpen = false,\n}: DebouncedModalProps): JSX.Element {\n const debouncedIsOpen = useDebouncedValue(isOpen, debounceMs);\n\n return (\n <>\n {blockInteraction && isOpen && (\n <div\n className=\"modal-backdrop\"\n style={{ backgroundColor: 'transparent' }}\n data-testid=\"debounced-modal-backdrop\"\n />\n )}\n {React.cloneElement(children, { isOpen: isOpen && debouncedIsOpen })}\n </>\n );\n}\n\nexport default DebouncedModal;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,iBAAiB,QAAQ,wBAAwB;AAAC;AAAA;AAAA;AAmB3D;AACA;AACA;AACA;AACA,SAASC,cAAc,OAKc;EAAA,IALb;IACtBC,gBAAgB,GAAG,IAAI;IACvBC,QAAQ;IACRC,UAAU;IACVC,MAAM,GAAG;EACU,CAAC;EACpB,IAAMC,eAAe,GAAGN,iBAAiB,CAACK,MAAM,EAAED,UAAU,CAAC;EAE7D,oBACE;IAAA,WACGF,gBAAgB,IAAIG,MAAM,iBACzB;MACE,SAAS,EAAC,gBAAgB;MAC1B,KAAK,EAAE;QAAEE,eAAe,EAAE;MAAc,CAAE;MAC1C,eAAY;IAA0B,EAEzC,eACAR,KAAK,CAACS,YAAY,CAACL,QAAQ,EAAE;MAAEE,MAAM,EAAEA,MAAM,IAAIC;IAAgB,CAAC,CAAC;EAAA,EACnE;AAEP;AAEA,eAAeL,cAAc"}
|
package/dist/modal/Modal.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.js","names":["classNames","React","useCallback","useEffect","useRef","useState","ReactDOM","CSSTransition","ThemeExport","Modal","className","children","role","keyboard","isOpen","centered","size","onOpened","onClosed","toggle","dataTestId","element","background","backgroundClicked","setBackgroundClicked","handleKeyDown","event","key","addKeydownEventListener","window","addEventListener","removeEventListener","open","closed","current","document","createElement","setAttribute","body","appendChild","onExited","removeChild","undefined","createPortal","appearActive","appearDone","transitionMs","zIndex","e","target","display"],"sources":["../../src/modal/Modal.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport React, {\n ReactNode,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from 'react';\nimport ReactDOM from 'react-dom';\nimport { CSSTransition } from 'react-transition-group';\nimport ThemeExport from '../ThemeExport';\n\ninterface ModalProps {\n className?: string;\n children?: ReactNode;\n role?: string;\n keyboard?: boolean;\n isOpen?: boolean;\n centered?: boolean;\n size?: 'sm' | 'lg' | 'xl' | undefined;\n onOpened?: () => void;\n onClosed?: () => void;\n toggle?: () => void;\n 'data-testid'?: string;\n}\n\nfunction Modal({\n className = 'theme-bg-light',\n children,\n role = 'role',\n keyboard = true,\n isOpen = false,\n centered = false,\n size,\n onOpened,\n onClosed,\n toggle,\n 'data-testid': dataTestId,\n}: ModalProps): React.ReactElement | null {\n const element = useRef<HTMLElement>();\n const background = useRef<HTMLDivElement>(null);\n const [backgroundClicked, setBackgroundClicked] = useState(false);\n\n const handleKeyDown = useCallback(\n (event: KeyboardEvent): void => {\n switch (event.key) {\n case 'Escape':\n toggle?.();\n break;\n default:\n break;\n }\n },\n [toggle]\n );\n\n useEffect(\n function addKeydownEventListener() {\n if (isOpen && keyboard) {\n window.addEventListener('keydown', handleKeyDown);\n return () => window.removeEventListener('keydown', handleKeyDown);\n }\n },\n [handleKeyDown, isOpen, keyboard]\n );\n\n useEffect(\n function open() {\n if (isOpen && onOpened) {\n onOpened();\n }\n },\n [onOpened, isOpen]\n );\n\n useEffect(\n function closed() {\n if (!isOpen && onClosed) {\n onClosed();\n }\n },\n [onClosed, isOpen]\n );\n\n if (isOpen && !element.current) {\n element.current = document.createElement('div');\n element.current.setAttribute(\n 'style',\n 'padding-right: 15px; display: block'\n );\n element.current.setAttribute('role', 'presentation');\n document.body.appendChild(element.current);\n }\n\n const onExited = () => {\n if (element.current) {\n document.body.removeChild(element.current);\n element.current = undefined;\n }\n };\n\n return element.current\n ? ReactDOM.createPortal(\n <>\n <CSSTransition\n appear\n mountOnEnter\n unmountOnExit\n in={isOpen}\n classNames={{\n appearActive: 'show',\n appearDone: 'show',\n }}\n timeout={ThemeExport.transitionMs}\n onExited={onExited}\n >\n <div\n className={classNames('modal-backdrop fade')}\n style={{ zIndex: 1050 }}\n />\n </CSSTransition>\n <CSSTransition\n appear\n mountOnEnter\n unmountOnExit\n in={isOpen}\n classNames={{\n appearDone: 'show',\n }}\n timeout={ThemeExport.transitionMs}\n onExited={onExited}\n >\n <div\n ref={background}\n className=\"modal fade\"\n onMouseDown={e => {\n if (e.target === background.current) {\n setBackgroundClicked(true);\n } else {\n setBackgroundClicked(false);\n }\n }}\n onMouseUp={e => {\n if (\n backgroundClicked &&\n e.target === background.current &&\n toggle !== undefined\n ) {\n toggle();\n }\n }}\n role=\"dialog\"\n style={{ display: 'block' }}\n >\n <div\n className={classNames(`modal-dialog ${className}`, {\n 'modal-lg': size === 'lg',\n 'modal-sm': size === 'sm',\n 'modal-xl': size === 'xl',\n 'modal-dialog-centered': centered,\n })}\n style={{ zIndex: 1040 }}\n >\n <div\n className=\"modal-content\"\n role=\"presentation\"\n data-testid={dataTestId}\n >\n {children}\n </div>\n </div>\n </div>\n </CSSTransition>\n </>,\n element.current\n )\n : null;\n}\n\nexport default Modal;\n"],"mappings":"AAAA,OAAOA,UAAU,MAAM,YAAY;AACnC,OAAOC,KAAK,IAEVC,WAAW,EACXC,SAAS,EACTC,MAAM,EACNC,QAAQ,QACH,OAAO;AACd,OAAOC,QAAQ,MAAM,WAAW;AAChC,SAASC,aAAa,QAAQ,wBAAwB;AAAC,OAChDC,WAAW;AAAA;AAAA;AAAA;AAgBlB,SAASC,KAAK,OAY4B;EAAA,IAZ3B;IACbC,SAAS,GAAG,gBAAgB;IAC5BC,QAAQ;IACRC,IAAI,GAAG,MAAM;IACbC,QAAQ,GAAG,IAAI;IACfC,MAAM,GAAG,KAAK;IACdC,QAAQ,GAAG,KAAK;IAChBC,IAAI;IACJC,QAAQ;IACRC,QAAQ;IACRC,MAAM;IACN,aAAa,EAAEC;EACL,CAAC;EACX,IAAMC,OAAO,GAAGjB,MAAM,EAAe;EACrC,IAAMkB,UAAU,GAAGlB,MAAM,CAAiB,IAAI,CAAC;EAC/C,IAAM,CAACmB,iBAAiB,EAAEC,oBAAoB,CAAC,GAAGnB,QAAQ,CAAC,KAAK,CAAC;EAEjE,IAAMoB,aAAa,GAAGvB,WAAW,CAC9BwB,KAAoB,IAAW;IAC9B,QAAQA,KAAK,CAACC,GAAG;MACf,KAAK,QAAQ;QACXR,MAAM,aAANA,MAAM,uBAANA,MAAM,EAAI;QACV;MACF;QACE;IAAM;EAEZ,CAAC,EACD,CAACA,MAAM,CAAC,CACT;EAEDhB,SAAS,CACP,SAASyB,uBAAuB,GAAG;IACjC,IAAId,MAAM,IAAID,QAAQ,EAAE;MACtBgB,MAAM,CAACC,gBAAgB,CAAC,SAAS,EAAEL,aAAa,CAAC;MACjD,OAAO,MAAMI,MAAM,CAACE,mBAAmB,CAAC,SAAS,EAAEN,aAAa,CAAC;IACnE;EACF,CAAC,EACD,CAACA,aAAa,EAAEX,MAAM,EAAED,QAAQ,CAAC,CAClC;EAEDV,SAAS,CACP,SAAS6B,IAAI,GAAG;IACd,IAAIlB,MAAM,IAAIG,QAAQ,EAAE;MACtBA,QAAQ,EAAE;IACZ;EACF,CAAC,EACD,CAACA,QAAQ,EAAEH,MAAM,CAAC,CACnB;EAEDX,SAAS,CACP,SAAS8B,MAAM,GAAG;IAChB,IAAI,CAACnB,MAAM,IAAII,QAAQ,EAAE;MACvBA,QAAQ,EAAE;IACZ;EACF,CAAC,EACD,CAACA,QAAQ,EAAEJ,MAAM,CAAC,CACnB;EAED,IAAIA,MAAM,IAAI,CAACO,OAAO,CAACa,OAAO,EAAE;IAC9Bb,OAAO,CAACa,OAAO,GAAGC,QAAQ,CAACC,aAAa,CAAC,KAAK,CAAC;IAC/Cf,OAAO,CAACa,OAAO,CAACG,YAAY,CAC1B,OAAO,EACP,qCAAqC,CACtC;IACDhB,OAAO,CAACa,OAAO,CAACG,YAAY,CAAC,MAAM,EAAE,cAAc,CAAC;IACpDF,QAAQ,CAACG,IAAI,CAACC,WAAW,CAAClB,OAAO,CAACa,OAAO,CAAC;EAC5C;EAEA,IAAMM,QAAQ,GAAG,
|
|
1
|
+
{"version":3,"file":"Modal.js","names":["classNames","React","useCallback","useEffect","useRef","useState","ReactDOM","CSSTransition","ThemeExport","Modal","className","children","role","keyboard","isOpen","centered","size","onOpened","onClosed","toggle","dataTestId","element","background","backgroundClicked","setBackgroundClicked","handleKeyDown","event","key","addKeydownEventListener","window","addEventListener","removeEventListener","open","closed","current","document","createElement","setAttribute","body","appendChild","onExited","removeChild","undefined","createPortal","appearActive","appearDone","transitionMs","zIndex","e","target","display"],"sources":["../../src/modal/Modal.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport React, {\n ReactNode,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from 'react';\nimport ReactDOM from 'react-dom';\nimport { CSSTransition } from 'react-transition-group';\nimport ThemeExport from '../ThemeExport';\n\ninterface ModalProps {\n className?: string;\n children?: ReactNode;\n role?: string;\n keyboard?: boolean;\n isOpen?: boolean;\n centered?: boolean;\n size?: 'sm' | 'lg' | 'xl' | undefined;\n onOpened?: () => void;\n onClosed?: () => void;\n toggle?: () => void;\n 'data-testid'?: string;\n}\n\nfunction Modal({\n className = 'theme-bg-light',\n children,\n role = 'role',\n keyboard = true,\n isOpen = false,\n centered = false,\n size,\n onOpened,\n onClosed,\n toggle,\n 'data-testid': dataTestId,\n}: ModalProps): React.ReactElement | null {\n const element = useRef<HTMLElement>();\n const background = useRef<HTMLDivElement>(null);\n const [backgroundClicked, setBackgroundClicked] = useState(false);\n\n const handleKeyDown = useCallback(\n (event: KeyboardEvent): void => {\n switch (event.key) {\n case 'Escape':\n toggle?.();\n break;\n default:\n break;\n }\n },\n [toggle]\n );\n\n useEffect(\n function addKeydownEventListener() {\n if (isOpen && keyboard) {\n window.addEventListener('keydown', handleKeyDown);\n return () => window.removeEventListener('keydown', handleKeyDown);\n }\n },\n [handleKeyDown, isOpen, keyboard]\n );\n\n useEffect(\n function open() {\n if (isOpen && onOpened) {\n onOpened();\n }\n },\n [onOpened, isOpen]\n );\n\n useEffect(\n function closed() {\n if (!isOpen && onClosed) {\n onClosed();\n }\n },\n [onClosed, isOpen]\n );\n\n if (isOpen && !element.current) {\n element.current = document.createElement('div');\n element.current.setAttribute(\n 'style',\n 'padding-right: 15px; display: block'\n );\n element.current.setAttribute('role', 'presentation');\n document.body.appendChild(element.current);\n }\n\n const onExited = (): void => {\n if (element.current) {\n document.body.removeChild(element.current);\n element.current = undefined;\n }\n };\n\n return element.current\n ? ReactDOM.createPortal(\n <>\n <CSSTransition\n appear\n mountOnEnter\n unmountOnExit\n in={isOpen}\n classNames={{\n appearActive: 'show',\n appearDone: 'show',\n }}\n timeout={ThemeExport.transitionMs}\n onExited={onExited}\n >\n <div\n className={classNames('modal-backdrop fade')}\n style={{ zIndex: 1050 }}\n />\n </CSSTransition>\n <CSSTransition\n appear\n mountOnEnter\n unmountOnExit\n in={isOpen}\n classNames={{\n appearDone: 'show',\n }}\n timeout={ThemeExport.transitionMs}\n onExited={onExited}\n >\n <div\n ref={background}\n className=\"modal fade\"\n onMouseDown={e => {\n if (e.target === background.current) {\n setBackgroundClicked(true);\n } else {\n setBackgroundClicked(false);\n }\n }}\n onMouseUp={e => {\n if (\n backgroundClicked &&\n e.target === background.current &&\n toggle !== undefined\n ) {\n toggle();\n }\n }}\n role=\"dialog\"\n style={{ display: 'block' }}\n >\n <div\n className={classNames(`modal-dialog ${className}`, {\n 'modal-lg': size === 'lg',\n 'modal-sm': size === 'sm',\n 'modal-xl': size === 'xl',\n 'modal-dialog-centered': centered,\n })}\n style={{ zIndex: 1040 }}\n >\n <div\n className=\"modal-content\"\n role=\"presentation\"\n data-testid={dataTestId}\n >\n {children}\n </div>\n </div>\n </div>\n </CSSTransition>\n </>,\n element.current\n )\n : null;\n}\n\nexport default Modal;\n"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@deephaven/components",
|
|
3
|
-
"version": "0.48.
|
|
3
|
+
"version": "0.48.1-beta.1+32e6d208",
|
|
4
4
|
"description": "Deephaven React component library",
|
|
5
5
|
"author": "Deephaven Data Labs LLC",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -24,10 +24,10 @@
|
|
|
24
24
|
},
|
|
25
25
|
"dependencies": {
|
|
26
26
|
"@adobe/react-spectrum": "^3.29.0",
|
|
27
|
-
"@deephaven/icons": "^0.48.
|
|
28
|
-
"@deephaven/log": "^0.48.
|
|
29
|
-
"@deephaven/react-hooks": "^0.48.
|
|
30
|
-
"@deephaven/utils": "^0.48.
|
|
27
|
+
"@deephaven/icons": "^0.48.1-beta.1+32e6d208",
|
|
28
|
+
"@deephaven/log": "^0.48.1-beta.1+32e6d208",
|
|
29
|
+
"@deephaven/react-hooks": "^0.48.1-beta.1+32e6d208",
|
|
30
|
+
"@deephaven/utils": "^0.48.1-beta.1+32e6d208",
|
|
31
31
|
"@fortawesome/fontawesome-svg-core": "^6.2.1",
|
|
32
32
|
"@fortawesome/react-fontawesome": "^0.2.0",
|
|
33
33
|
"@react-spectrum/theme-default": "^3.5.1",
|
|
@@ -51,7 +51,7 @@
|
|
|
51
51
|
"react-dom": "^17.x"
|
|
52
52
|
},
|
|
53
53
|
"devDependencies": {
|
|
54
|
-
"@deephaven/mocks": "^0.48.
|
|
54
|
+
"@deephaven/mocks": "^0.48.1-beta.1+32e6d208"
|
|
55
55
|
},
|
|
56
56
|
"files": [
|
|
57
57
|
"dist",
|
|
@@ -64,5 +64,5 @@
|
|
|
64
64
|
"publishConfig": {
|
|
65
65
|
"access": "public"
|
|
66
66
|
},
|
|
67
|
-
"gitHead": "
|
|
67
|
+
"gitHead": "32e6d208d0977092f315caa122b8ab23f0fc110a"
|
|
68
68
|
}
|