npm - @salt-ds/lab - Versions diffs - 1.0.0-alpha.1 → 1.0.0-alpha.2 - Mend

@salt-ds/lab 1.0.0-alpha.1 → 1.0.0-alpha.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (380) hide show

package/dist-cjs/packages/lab/src/dropdown/useDropdown.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useDropdown.js","sources":["../src/dropdown/useDropdown.ts"],"sourcesContent":["import { useControlled } from \"@salt-ds/core\";\nimport { useCallback, useMemo } from \"react\";\nimport { ListHookProps, ListHookResult, useList } from \"../list\";\nimport { DropdownHookResult, DropdownHookProps } from \"./dropdownTypes\";\nimport {\n CollectionItem,\n itemToString as defaultItemToString,\n SelectionChangeHandler,\n SelectionStrategy,\n} from \"../common-hooks\";\n\nconst NULL_REF = { current: null };\n\nexport interface DropdownListHookProps<Item, Strategy extends SelectionStrategy>\n extends Partial<Omit<DropdownHookProps, \"onKeyDown\">>,\n Omit<ListHookProps<Item, Strategy>, \"containerRef\"> {\n itemToString?: (item: Item) => string;\n}\n\nexport interface DropdownListHookResult<\n Item,\n Selection extends SelectionStrategy\n> extends Partial<ListHookResult<Item, Selection>>,\n Partial<DropdownHookResult> {\n onOpenChange: any;\n triggerLabel?: string;\n}\n\nexport const useDropdown = <\n Item,\n Selection extends SelectionStrategy = \"default\"\n>({\n collectionHook,\n defaultHighlightedIndex: defaultHighlightedIndexProp,\n defaultIsOpen,\n defaultSelected,\n highlightedIndex: highlightedIndexProp,\n isOpen: isOpenProp,\n itemToString = defaultItemToString,\n onHighlight,\n onOpenChange,\n onSelectionChange,\n selected,\n selectionStrategy,\n}: DropdownListHookProps<Item, Selection>): DropdownListHookResult<\n Item,\n Selection\n> => {\n const isMultiSelect =\n selectionStrategy === \"multiple\" \|\| selectionStrategy === \"extended\";\n\n const [isOpen, setIsOpen] = useControlled<boolean>({\n controlled: isOpenProp,\n default: defaultIsOpen ?? false,\n name: \"useDropdownList\",\n });\n\n const handleSelectionChange = useCallback<\n SelectionChangeHandler<Item, Selection>\n >(\n (evt, selected) => {\n if (!isMultiSelect) {\n setIsOpen(false);\n onOpenChange?.(false);\n }\n onSelectionChange?.(evt, selected);\n },\n [isMultiSelect, onOpenChange, onSelectionChange, setIsOpen]\n );\n\n const listHook = useList<Item, Selection>({\n collectionHook,\n defaultHighlightedIndex:\n defaultHighlightedIndexProp ?? highlightedIndexProp === undefined\n ? 0\n : undefined,\n defaultSelected,\n label: \"useDropDownList\",\n onSelectionChange: handleSelectionChange,\n containerRef: NULL_REF,\n highlightedIndex: highlightedIndexProp,\n onHighlight,\n selected,\n selectionStrategy,\n tabToSelect: !isMultiSelect,\n });\n\n const handleOpenChange = useCallback(\n (open: boolean) => {\n setIsOpen(open);\n onOpenChange?.(open);\n },\n [onOpenChange, setIsOpen]\n );\n\n const triggerLabel = useMemo(() => {\n if (isMultiSelect && Array.isArray(listHook.selected)) {\n const selectedItems = listHook.selected as CollectionItem<Item>[];\n if (selectedItems.length === 0) {\n return undefined;\n } else if (selectedItems.length === 1) {\n const { value } = selectedItems[0];\n return value === null ? undefined : itemToString(value);\n } else {\n return `${selectedItems.length} items selected`;\n }\n } else {\n const selectedItem = listHook.selected as CollectionItem<Item>;\n return selectedItem == null \|\| selectedItem.value === null\n ? undefined\n : itemToString(selectedItem.value);\n }\n }, [isMultiSelect, itemToString, listHook.selected]);\n\n return {\n isOpen,\n onOpenChange: handleOpenChange,\n triggerLabel,\n ...listHook,\n };\n};\n"],"names":["itemToString","defaultItemToString","useControlled","useCallback","selected","useList","useMemo"],"mappings":"~~;;;;;;;;;;;;;;;;;~~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"}
1	+ {"version":3,"file":"useDropdown.js","sources":["../src/dropdown/useDropdown.ts"],"sourcesContent":["import { useControlled } from \"@salt-ds/core\";\nimport { useCallback, useMemo } from \"react\";\nimport { ListHookProps, ListHookResult, useList } from \"../list\";\nimport { DropdownHookResult, DropdownHookProps } from \"./dropdownTypes\";\nimport {\n CollectionItem,\n itemToString as defaultItemToString,\n SelectionChangeHandler,\n SelectionStrategy,\n} from \"../common-hooks\";\n\nconst NULL_REF = { current: null };\n\nexport interface DropdownListHookProps<Item, Strategy extends SelectionStrategy>\n extends Partial<Omit<DropdownHookProps, \"onKeyDown\">>,\n Omit<ListHookProps<Item, Strategy>, \"containerRef\"> {\n itemToString?: (item: Item) => string;\n}\n\nexport interface DropdownListHookResult<\n Item,\n Selection extends SelectionStrategy\n> extends Partial<ListHookResult<Item, Selection>>,\n Partial<DropdownHookResult> {\n onOpenChange: any;\n triggerLabel?: string;\n}\n\nexport const useDropdown = <\n Item,\n Selection extends SelectionStrategy = \"default\"\n>({\n collectionHook,\n defaultHighlightedIndex: defaultHighlightedIndexProp,\n defaultIsOpen,\n defaultSelected,\n highlightedIndex: highlightedIndexProp,\n isOpen: isOpenProp,\n itemToString = defaultItemToString,\n onHighlight,\n onOpenChange,\n onSelectionChange,\n selected,\n selectionStrategy,\n}: DropdownListHookProps<Item, Selection>): DropdownListHookResult<\n Item,\n Selection\n> => {\n const isMultiSelect =\n selectionStrategy === \"multiple\" \|\| selectionStrategy === \"extended\";\n\n const [isOpen, setIsOpen] = useControlled<boolean>({\n controlled: isOpenProp,\n default: defaultIsOpen ?? false,\n name: \"useDropdownList\",\n });\n\n const handleSelectionChange = useCallback<\n SelectionChangeHandler<Item, Selection>\n >(\n (evt, selected) => {\n if (!isMultiSelect) {\n setIsOpen(false);\n onOpenChange?.(false);\n }\n onSelectionChange?.(evt, selected);\n },\n [isMultiSelect, onOpenChange, onSelectionChange, setIsOpen]\n );\n\n const listHook = useList<Item, Selection>({\n collectionHook,\n defaultHighlightedIndex:\n defaultHighlightedIndexProp ?? highlightedIndexProp === undefined\n ? 0\n : undefined,\n defaultSelected,\n label: \"useDropDownList\",\n onSelectionChange: handleSelectionChange,\n containerRef: NULL_REF,\n highlightedIndex: highlightedIndexProp,\n onHighlight,\n selected,\n selectionStrategy,\n tabToSelect: !isMultiSelect,\n });\n\n const handleOpenChange = useCallback(\n (open: boolean) => {\n setIsOpen(open);\n onOpenChange?.(open);\n },\n [onOpenChange, setIsOpen]\n );\n\n const triggerLabel = useMemo(() => {\n if (isMultiSelect && Array.isArray(listHook.selected)) {\n const selectedItems = listHook.selected as CollectionItem<Item>[];\n if (selectedItems.length === 0) {\n return undefined;\n } else if (selectedItems.length === 1) {\n const { value } = selectedItems[0];\n return value === null ? undefined : itemToString(value);\n } else {\n return `${selectedItems.length} items selected`;\n }\n } else {\n const selectedItem = listHook.selected as CollectionItem<Item>;\n return selectedItem == null \|\| selectedItem.value === null\n ? undefined\n : itemToString(selectedItem.value);\n }\n }, [isMultiSelect, itemToString, listHook.selected]);\n\n return {\n isOpen,\n onOpenChange: handleOpenChange,\n triggerLabel,\n ...listHook,\n };\n};\n"],"names":["itemToString","defaultItemToString","useControlled","useCallback","selected","useList","useMemo"],"mappings":"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"}

package/dist-cjs/packages/lab/src/dropdown/useDropdownBase.js CHANGED Viewed

@@ -7,6 +7,7 @@ var React = require('react');
 var useClickAway = require('./useClickAway.js');
 require('react/jsx-runtime');
 var useResizeObserver = require('../responsive/useResizeObserver.js');
+require('../utils/useFloatingUI.js');
 require('../form-field-context/FormFieldContext.js');
 var useFormFieldProps = require('../form-field-context/useFormFieldProps.js');

package/dist-cjs/packages/lab/src/dropdown/useDropdownBase.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useDropdownBase.js","sources":["../src/dropdown/useDropdownBase.ts"],"sourcesContent":["import { useControlled } from \"@salt-ds/core\";\nimport { KeyboardEvent, useCallback, useRef, useState } from \"react\";\n\nimport { DropdownHookProps, DropdownHookResult } from \"./dropdownTypes\";\nimport { useClickAway } from \"./useClickAway\";\nimport { measurements, useResizeObserver, WidthOnly } from \"../responsive\";\nimport { useFormFieldProps } from \"../form-field-context\";\n\nconst NO_OBSERVER: string[] = [];\n\nexport const useDropdownBase = ({\n ariaLabelledBy: ariaLabelledByProp,\n defaultIsOpen,\n disabled,\n // TODO check how we're using fullWidth, do we need a separate value for the popup component\n fullWidth: fullWidthProp,\n id,\n isOpen: isOpenProp,\n onOpenChange,\n onKeyDown: onKeyDownProp,\n openOnFocus,\n popupComponent: { props: componentProps },\n popupWidth: popupWidthProp,\n rootRef,\n width,\n}: DropdownHookProps): DropdownHookResult => {\n const justFocused = useRef<number \| null>(null);\n const popperRef = useRef<HTMLElement \| null>(null);\n const popperCallbackRef = useCallback((element: HTMLElement \| null) => {\n popperRef.current = element;\n }, []);\n const [isOpen, setIsOpen] = useControlled({\n controlled: isOpenProp,\n default: Boolean(defaultIsOpen),\n name: \"useDropdown\",\n state: \"isOpen\",\n });\n\n const {\n inFormField,\n // onFocus: formFieldOnFocus,\n // onBlur: formFieldOnBlur,\n a11yProps: { \"aria-labelledby\": ariaLabelledBy, ...restA11yProps } = {},\n } = useFormFieldProps();\n\n const [popup, setPopup] = useState<measurements>({\n width: popupWidthProp ?? width ?? 0,\n });\n\n const showDropdown = useCallback(() => {\n setIsOpen(true);\n onOpenChange?.(true);\n }, [onOpenChange, setIsOpen]);\n\n const hideDropdown = useCallback(() => {\n setIsOpen(false);\n onOpenChange?.(false);\n }, [onOpenChange, setIsOpen]);\n\n useClickAway({\n popperRef,\n rootRef,\n isOpen,\n onClose: hideDropdown,\n });\n\n const handleTriggerFocus = useCallback(() => {\n setIsOpen(true);\n onOpenChange?.(true);\n // Suppress response to click if click was the cause of focus\n justFocused.current = window.setTimeout(() => {\n justFocused.current = null;\n }, 1000);\n }, [onOpenChange, setIsOpen]);\n\n const handleTriggerToggle = useCallback(\n (e: MouseEvent) => {\n // Do not trigger menu open for 'Enter' and 'SPACE' key as they're handled in `handleKeyDown`\n if (\n [\"Enter\", \" \"].indexOf(\n (e as unknown as KeyboardEvent<HTMLDivElement>).key\n ) === -1\n ) {\n const newIsOpen = !isOpen;\n setIsOpen(newIsOpen);\n onOpenChange?.(newIsOpen);\n }\n },\n [isOpen, setIsOpen, onOpenChange]\n );\n\n const handleKeydown = useCallback(\n (evt: KeyboardEvent<HTMLElement>) => {\n if ((evt.key === \"Tab\" \|\| evt.key === \"Escape\") && isOpen) {\n // No preventDefault here, this behaviour does not need to be exclusive\n hideDropdown();\n } else if (\n (evt.key === \"Enter\" \|\| evt.key === \"ArrowDown\" \|\| evt.key === \" \") &&\n !isOpen\n ) {\n evt.preventDefault();\n showDropdown();\n } else {\n onKeyDownProp?.(evt);\n }\n },\n [hideDropdown, isOpen, onKeyDownProp, showDropdown]\n );\n\n const fullWidth = fullWidthProp ?? inFormField;\n const measurements = fullWidth ? WidthOnly : NO_OBSERVER;\n useResizeObserver(rootRef, measurements, setPopup, fullWidth);\n\n const componentId = `${id}-dropdown`;\n\n const getAriaLabelledBy = (\n labelledBy: string \| undefined,\n labelledByProp: string \| undefined\n ): string \| undefined => {\n if (labelledBy === undefined && labelledByProp === undefined) {\n return undefined;\n } else {\n return [labelledBy, labelledByProp].filter((x) => !!x).join(\" \");\n }\n };\n\n // TODO do we use aria-popup - valid values are menu, disloag, grid, tree, listbox\n const triggerProps = {\n ...restA11yProps,\n \"aria-expanded\": isOpen,\n \"aria-labelledby\": getAriaLabelledBy(ariaLabelledBy, ariaLabelledByProp),\n \"aria-owns\": isOpen ? componentId : undefined,\n id: `${id}-control`,\n onClick: disabled \|\| openOnFocus ? undefined : handleTriggerToggle,\n onFocus: openOnFocus && !disabled ? handleTriggerFocus : undefined,\n role: \"listbox\",\n onKeyDown: disabled ? undefined : handleKeydown,\n style: { width: fullWidth ? undefined : width },\n };\n\n const dropdownComponentProps = {\n \"aria-labelledby\": ariaLabelledBy,\n id: componentId,\n width: popup.width,\n };\n\n return {\n componentProps: dropdownComponentProps,\n popperRef: popperCallbackRef,\n isOpen,\n label: \"Dropdown Button\",\n triggerProps,\n };\n};\n"],"names":["useRef","useCallback","useControlled","useFormFieldProps","useState","useClickAway","measurements","WidthOnly","useResizeObserver"],"mappings":"~~;;;;;;;;;;;;~~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"}
1	+ {"version":3,"file":"useDropdownBase.js","sources":["../src/dropdown/useDropdownBase.ts"],"sourcesContent":["import { useControlled } from \"@salt-ds/core\";\nimport { KeyboardEvent, useCallback, useRef, useState } from \"react\";\n\nimport { DropdownHookProps, DropdownHookResult } from \"./dropdownTypes\";\nimport { useClickAway } from \"./useClickAway\";\nimport { measurements, useResizeObserver, WidthOnly } from \"../responsive\";\nimport { useFormFieldProps } from \"../form-field-context\";\n\nconst NO_OBSERVER: string[] = [];\n\nexport const useDropdownBase = ({\n ariaLabelledBy: ariaLabelledByProp,\n defaultIsOpen,\n disabled,\n // TODO check how we're using fullWidth, do we need a separate value for the popup component\n fullWidth: fullWidthProp,\n id,\n isOpen: isOpenProp,\n onOpenChange,\n onKeyDown: onKeyDownProp,\n openOnFocus,\n popupComponent: { props: componentProps },\n popupWidth: popupWidthProp,\n rootRef,\n width,\n}: DropdownHookProps): DropdownHookResult => {\n const justFocused = useRef<number \| null>(null);\n const popperRef = useRef<HTMLElement \| null>(null);\n const popperCallbackRef = useCallback((element: HTMLElement \| null) => {\n popperRef.current = element;\n }, []);\n const [isOpen, setIsOpen] = useControlled({\n controlled: isOpenProp,\n default: Boolean(defaultIsOpen),\n name: \"useDropdown\",\n state: \"isOpen\",\n });\n\n const {\n inFormField,\n // onFocus: formFieldOnFocus,\n // onBlur: formFieldOnBlur,\n a11yProps: { \"aria-labelledby\": ariaLabelledBy, ...restA11yProps } = {},\n } = useFormFieldProps();\n\n const [popup, setPopup] = useState<measurements>({\n width: popupWidthProp ?? width ?? 0,\n });\n\n const showDropdown = useCallback(() => {\n setIsOpen(true);\n onOpenChange?.(true);\n }, [onOpenChange, setIsOpen]);\n\n const hideDropdown = useCallback(() => {\n setIsOpen(false);\n onOpenChange?.(false);\n }, [onOpenChange, setIsOpen]);\n\n useClickAway({\n popperRef,\n rootRef,\n isOpen,\n onClose: hideDropdown,\n });\n\n const handleTriggerFocus = useCallback(() => {\n setIsOpen(true);\n onOpenChange?.(true);\n // Suppress response to click if click was the cause of focus\n justFocused.current = window.setTimeout(() => {\n justFocused.current = null;\n }, 1000);\n }, [onOpenChange, setIsOpen]);\n\n const handleTriggerToggle = useCallback(\n (e: MouseEvent) => {\n // Do not trigger menu open for 'Enter' and 'SPACE' key as they're handled in `handleKeyDown`\n if (\n [\"Enter\", \" \"].indexOf(\n (e as unknown as KeyboardEvent<HTMLDivElement>).key\n ) === -1\n ) {\n const newIsOpen = !isOpen;\n setIsOpen(newIsOpen);\n onOpenChange?.(newIsOpen);\n }\n },\n [isOpen, setIsOpen, onOpenChange]\n );\n\n const handleKeydown = useCallback(\n (evt: KeyboardEvent<HTMLElement>) => {\n if ((evt.key === \"Tab\" \|\| evt.key === \"Escape\") && isOpen) {\n // No preventDefault here, this behaviour does not need to be exclusive\n hideDropdown();\n } else if (\n (evt.key === \"Enter\" \|\| evt.key === \"ArrowDown\" \|\| evt.key === \" \") &&\n !isOpen\n ) {\n evt.preventDefault();\n showDropdown();\n } else {\n onKeyDownProp?.(evt);\n }\n },\n [hideDropdown, isOpen, onKeyDownProp, showDropdown]\n );\n\n const fullWidth = fullWidthProp ?? inFormField;\n const measurements = fullWidth ? WidthOnly : NO_OBSERVER;\n useResizeObserver(rootRef, measurements, setPopup, fullWidth);\n\n const componentId = `${id}-dropdown`;\n\n const getAriaLabelledBy = (\n labelledBy: string \| undefined,\n labelledByProp: string \| undefined\n ): string \| undefined => {\n if (labelledBy === undefined && labelledByProp === undefined) {\n return undefined;\n } else {\n return [labelledBy, labelledByProp].filter((x) => !!x).join(\" \");\n }\n };\n\n // TODO do we use aria-popup - valid values are menu, disloag, grid, tree, listbox\n const triggerProps = {\n ...restA11yProps,\n \"aria-expanded\": isOpen,\n \"aria-labelledby\": getAriaLabelledBy(ariaLabelledBy, ariaLabelledByProp),\n \"aria-owns\": isOpen ? componentId : undefined,\n id: `${id}-control`,\n onClick: disabled \|\| openOnFocus ? undefined : handleTriggerToggle,\n onFocus: openOnFocus && !disabled ? handleTriggerFocus : undefined,\n role: \"listbox\",\n onKeyDown: disabled ? undefined : handleKeydown,\n style: { width: fullWidth ? undefined : width },\n };\n\n const dropdownComponentProps = {\n \"aria-labelledby\": ariaLabelledBy,\n id: componentId,\n width: popup.width,\n };\n\n return {\n componentProps: dropdownComponentProps,\n popperRef: popperCallbackRef,\n isOpen,\n label: \"Dropdown Button\",\n triggerProps,\n };\n};\n"],"names":["useRef","useCallback","useControlled","useFormFieldProps","useState","useClickAway","measurements","WidthOnly","useResizeObserver"],"mappings":";;;;;;;;;;;;;AAQA,MAAM,cAAwB,EAAC,CAAA;AAExB,MAAM,kBAAkB,CAAC;AAAA,EAC9B,cAAgB,EAAA,kBAAA;AAAA,EAChB,aAAA;AAAA,EACA,QAAA;AAAA,EAEA,SAAW,EAAA,aAAA;AAAA,EACX,EAAA;AAAA,EACA,MAAQ,EAAA,UAAA;AAAA,EACR,YAAA;AAAA,EACA,SAAW,EAAA,aAAA;AAAA,EACX,WAAA;AAAA,EACA,cAAA,EAAgB,EAAE,KAAA,EAAO,cAAe,EAAA;AAAA,EACxC,UAAY,EAAA,cAAA;AAAA,EACZ,OAAA;AAAA,EACA,KAAA;AACF,CAA6C,KAAA;AAzB7C,EAAA,IAAA,EAAA,CAAA;AA0BE,EAAM,MAAA,WAAA,GAAcA,aAAsB,IAAI,CAAA,CAAA;AAC9C,EAAM,MAAA,SAAA,GAAYA,aAA2B,IAAI,CAAA,CAAA;AACjD,EAAM,MAAA,iBAAA,GAAoBC,iBAAY,CAAA,CAAC,OAAgC,KAAA;AACrE,IAAA,SAAA,CAAU,OAAU,GAAA,OAAA,CAAA;AAAA,GACtB,EAAG,EAAE,CAAA,CAAA;AACL,EAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAIC,kBAAc,CAAA;AAAA,IACxC,UAAY,EAAA,UAAA;AAAA,IACZ,OAAA,EAAS,QAAQ,aAAa,CAAA;AAAA,IAC9B,IAAM,EAAA,aAAA;AAAA,IACN,KAAO,EAAA,QAAA;AAAA,GACR,CAAA,CAAA;AAED,EAAM,MAAA;AAAA,IACJ,WAAA;AAAA,IAGA,WAAW,EAAE,iBAAA,EAAmB,cAAmB,EAAA,GAAA,aAAA,KAAkB,EAAC;AAAA,MACpEC,mCAAkB,EAAA,CAAA;AAEtB,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAIC,cAAuB,CAAA;AAAA,IAC/C,KAAA,EAAA,CAAO,EAAkB,GAAA,cAAA,IAAA,IAAA,GAAA,cAAA,GAAA,KAAA,KAAlB,IAA2B,GAAA,EAAA,GAAA,CAAA;AAAA,GACnC,CAAA,CAAA;AAED,EAAM,MAAA,YAAA,GAAeH,kBAAY,MAAM;AACrC,IAAA,SAAA,CAAU,IAAI,CAAA,CAAA;AACd,IAAe,YAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,YAAA,CAAA,IAAA,CAAA,CAAA;AAAA,GACd,EAAA,CAAC,YAAc,EAAA,SAAS,CAAC,CAAA,CAAA;AAE5B,EAAM,MAAA,YAAA,GAAeA,kBAAY,MAAM;AACrC,IAAA,SAAA,CAAU,KAAK,CAAA,CAAA;AACf,IAAe,YAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,YAAA,CAAA,KAAA,CAAA,CAAA;AAAA,GACd,EAAA,CAAC,YAAc,EAAA,SAAS,CAAC,CAAA,CAAA;AAE5B,EAAaI,yBAAA,CAAA;AAAA,IACX,SAAA;AAAA,IACA,OAAA;AAAA,IACA,MAAA;AAAA,IACA,OAAS,EAAA,YAAA;AAAA,GACV,CAAA,CAAA;AAED,EAAM,MAAA,kBAAA,GAAqBJ,kBAAY,MAAM;AAC3C,IAAA,SAAA,CAAU,IAAI,CAAA,CAAA;AACd,IAAe,YAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,YAAA,CAAA,IAAA,CAAA,CAAA;AAEf,IAAY,WAAA,CAAA,OAAA,GAAU,MAAO,CAAA,UAAA,CAAW,MAAM;AAC5C,MAAA,WAAA,CAAY,OAAU,GAAA,IAAA,CAAA;AAAA,OACrB,GAAI,CAAA,CAAA;AAAA,GACN,EAAA,CAAC,YAAc,EAAA,SAAS,CAAC,CAAA,CAAA;AAE5B,EAAA,MAAM,mBAAsB,GAAAA,iBAAA;AAAA,IAC1B,CAAC,CAAkB,KAAA;AAEjB,MACE,IAAA,CAAC,OAAS,EAAA,GAAG,CAAE,CAAA,OAAA;AAAA,QACZ,CAA+C,CAAA,GAAA;AAAA,YAC5C,CACN,CAAA,EAAA;AACA,QAAA,MAAM,YAAY,CAAC,MAAA,CAAA;AACnB,QAAA,SAAA,CAAU,SAAS,CAAA,CAAA;AACnB,QAAe,YAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,YAAA,CAAA,SAAA,CAAA,CAAA;AAAA,OACjB;AAAA,KACF;AAAA,IACA,CAAC,MAAQ,EAAA,SAAA,EAAW,YAAY,CAAA;AAAA,GAClC,CAAA;AAEA,EAAA,MAAM,aAAgB,GAAAA,iBAAA;AAAA,IACpB,CAAC,GAAoC,KAAA;AACnC,MAAA,IAAA,CAAK,IAAI,GAAQ,KAAA,KAAA,IAAS,GAAI,CAAA,GAAA,KAAQ,aAAa,MAAQ,EAAA;AAEzD,QAAa,YAAA,EAAA,CAAA;AAAA,OACf,MAAA,IAAA,CACG,GAAI,CAAA,GAAA,KAAQ,OAAW,IAAA,GAAA,CAAI,GAAQ,KAAA,WAAA,IAAe,GAAI,CAAA,GAAA,KAAQ,GAC/D,KAAA,CAAC,MACD,EAAA;AACA,QAAA,GAAA,CAAI,cAAe,EAAA,CAAA;AACnB,QAAa,YAAA,EAAA,CAAA;AAAA,OACR,MAAA;AACL,QAAgB,aAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,aAAA,CAAA,GAAA,CAAA,CAAA;AAAA,OAClB;AAAA,KACF;AAAA,IACA,CAAC,YAAA,EAAc,MAAQ,EAAA,aAAA,EAAe,YAAY,CAAA;AAAA,GACpD,CAAA;AAEA,EAAA,MAAM,YAAY,aAAiB,IAAA,IAAA,GAAA,aAAA,GAAA,WAAA,CAAA;AACnC,EAAMK,MAAAA,aAAAA,GAAe,YAAYC,2BAAY,GAAA,WAAA,CAAA;AAC7C,EAAkBC,mCAAA,CAAA,OAAA,EAASF,aAAc,EAAA,QAAA,EAAU,SAAS,CAAA,CAAA;AAE5D,EAAA,MAAM,cAAc,CAAG,EAAA,EAAA,CAAA,SAAA,CAAA,CAAA;AAEvB,EAAM,MAAA,iBAAA,GAAoB,CACxB,UAAA,EACA,cACuB,KAAA;AACvB,IAAI,IAAA,UAAA,KAAe,KAAa,CAAA,IAAA,cAAA,KAAmB,KAAW,CAAA,EAAA;AAC5D,MAAO,OAAA,KAAA,CAAA,CAAA;AAAA,KACF,MAAA;AACL,MAAA,OAAO,CAAC,UAAA,EAAY,cAAc,CAAA,CAAE,MAAO,CAAA,CAAC,CAAM,KAAA,CAAC,CAAC,CAAC,CAAE,CAAA,IAAA,CAAK,GAAG,CAAA,CAAA;AAAA,KACjE;AAAA,GACF,CAAA;AAGA,EAAA,MAAM,YAAe,GAAA;AAAA,IACnB,GAAG,aAAA;AAAA,IACH,eAAiB,EAAA,MAAA;AAAA,IACjB,iBAAA,EAAmB,iBAAkB,CAAA,cAAA,EAAgB,kBAAkB,CAAA;AAAA,IACvE,WAAA,EAAa,SAAS,WAAc,GAAA,KAAA,CAAA;AAAA,IACpC,IAAI,CAAG,EAAA,EAAA,CAAA,QAAA,CAAA;AAAA,IACP,OAAA,EAAS,QAAY,IAAA,WAAA,GAAc,KAAY,CAAA,GAAA,mBAAA;AAAA,IAC/C,OAAS,EAAA,WAAA,IAAe,CAAC,QAAA,GAAW,kBAAqB,GAAA,KAAA,CAAA;AAAA,IACzD,IAAM,EAAA,SAAA;AAAA,IACN,SAAA,EAAW,WAAW,KAAY,CAAA,GAAA,aAAA;AAAA,IAClC,KAAO,EAAA,EAAE,KAAO,EAAA,SAAA,GAAY,SAAY,KAAM,EAAA;AAAA,GAChD,CAAA;AAEA,EAAA,MAAM,sBAAyB,GAAA;AAAA,IAC7B,iBAAmB,EAAA,cAAA;AAAA,IACnB,EAAI,EAAA,WAAA;AAAA,IACJ,OAAO,KAAM,CAAA,KAAA;AAAA,GACf,CAAA;AAEA,EAAO,OAAA;AAAA,IACL,cAAgB,EAAA,sBAAA;AAAA,IAChB,SAAW,EAAA,iBAAA;AAAA,IACX,MAAA;AAAA,IACA,KAAO,EAAA,iBAAA;AAAA,IACP,YAAA;AAAA,GACF,CAAA;AACF;;;;"}

package/dist-cjs/packages/lab/src/form-field/FormField.js CHANGED Viewed

@@ -7,9 +7,6 @@ var clsx = require('clsx');
 var React = require('react');
 var core = require('@salt-ds/core');
 var FormFieldContext = require('../form-field-context/FormFieldContext.js');
-var Tooltip = require('../tooltip/Tooltip.js');
-require('../tooltip/TooltipContext.js');
-var useTooltip = require('../tooltip/useTooltip.js');
 var constant = require('./constant.js');
 var FormActivationIndicator = require('./FormActivationIndicator.js');
 var FormHelperText = require('./FormHelperText.js');
@@ -112,77 +109,67 @@ const FormField = React.forwardRef(
     const focusClass = disableFocusRing ? "lowFocused" : "focused";
     const inlineHelperText = renderHelperText && helperTextPlacement === "bottom";
     const tooltipHelperText = renderHelperText && helperTextPlacement === "tooltip" && !hasStatusIndicator;
-    const { getTooltipProps, getTriggerProps } = useTooltip.useTooltip({
-      disabled: !tooltipHelperText
-    });
-    const { ref: triggerRef, ...triggerProps } = getTriggerProps({
-      className: clsx.clsx(
-        withBaseName(),
-        {
-          [withBaseName("disabled")]: disabled,
-          [withBaseName("readOnly")]: readOnly,
-          [withBaseName("warning")]: isWarning,
-          [withBaseName("error")]: isError,
-          [withBaseName("fullWidth")]: fullWidth,
-          [withBaseName(focusClass)]: states.focused,
-          [withBaseName("labelTop")]: labelTop,
-          [withBaseName("labelLeft")]: labelLeft,
-          [withBaseName(`withHelperText`)]: inlineHelperText,
-          [withBaseName(variant)]: variant
-        },
-        className
-      ),
-      ...eventHandlers,
-      ...restProps
-    });
-    const handleTriggerRef = core.useForkRef(triggerRef, rootRef);
-    const handleRef = core.useForkRef(handleTriggerRef, ref);
-    return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", {
-          ref: handleRef,
-          ...triggerProps,
-          children: /* @__PURE__ */ jsxRuntime.jsxs(FormFieldContext.FormFieldContext.Provider, {
-            value: {
-              ...states,
-              ...dispatchers,
-              ...eventHandlers,
-              a11yProps: a11yValue,
-              inFormField: true,
-              ref: rootRef
-            },
-            children: [
-              hasLabel && /* @__PURE__ */ jsxRuntime.jsx(LabelComponent, {
-                ...LabelProps,
-                validationStatus,
-                hasStatusIndicator,
-                StatusIndicatorProps: StatusIndicatorProps2,
-                className: LabelProps.className,
-                label,
-                disabled,
-                readOnly,
-                required,
-                tooltipText: helperText,
-                id: labelId
-              }),
-              children,
-              /* @__PURE__ */ jsxRuntime.jsx(ActivationIndicatorComponent, {
-                hasIcon: !hasStatusIndicator,
-                validationStatus
-              }),
-              renderHelperText && /* @__PURE__ */ jsxRuntime.jsx(HelperTextComponent, {
-                helperText,
-                helperTextPlacement,
-                ...HelperTextProps,
-                id: helperTextId
-              })
-            ]
-          })
-        }),
-        /* @__PURE__ */ jsxRuntime.jsx(Tooltip.Tooltip, {
-          ...getTooltipProps({ title: helperText })
+    const handleTriggerRef = core.useForkRef(rootRef, ref);
+    return /* @__PURE__ */ jsxRuntime.jsx(core.Tooltip, {
+      disabled: !tooltipHelperText,
+      content: helperText,
+      children: /* @__PURE__ */ jsxRuntime.jsx("div", {
+        ref: handleTriggerRef,
+        className: clsx.clsx(
+          withBaseName(),
+          {
+            [withBaseName("disabled")]: disabled,
+            [withBaseName("readOnly")]: readOnly,
+            [withBaseName("warning")]: isWarning,
+            [withBaseName("error")]: isError,
+            [withBaseName("fullWidth")]: fullWidth,
+            [withBaseName(focusClass)]: states.focused,
+            [withBaseName("labelTop")]: labelTop,
+            [withBaseName("labelLeft")]: labelLeft,
+            [withBaseName(`withHelperText`)]: inlineHelperText,
+            [withBaseName(variant)]: variant
+          },
+          className
+        ),
+        ...eventHandlers,
+        ...restProps,
+        children: /* @__PURE__ */ jsxRuntime.jsxs(FormFieldContext.FormFieldContext.Provider, {
+          value: {
+            ...states,
+            ...dispatchers,
+            ...eventHandlers,
+            a11yProps: a11yValue,
+            inFormField: true,
+            ref: rootRef
+          },
+          children: [
+            hasLabel && /* @__PURE__ */ jsxRuntime.jsx(LabelComponent, {
+              ...LabelProps,
+              validationStatus,
+              hasStatusIndicator,
+              StatusIndicatorProps: StatusIndicatorProps2,
+              className: LabelProps.className,
+              label,
+              disabled,
+              readOnly,
+              required,
+              tooltipText: helperText,
+              id: labelId
+            }),
+            children,
+            /* @__PURE__ */ jsxRuntime.jsx(ActivationIndicatorComponent, {
+              hasIcon: !hasStatusIndicator,
+              validationStatus
+            }),
+            renderHelperText && /* @__PURE__ */ jsxRuntime.jsx(HelperTextComponent, {
+              helperText,
+              helperTextPlacement,
+              ...HelperTextProps,
+              id: helperTextId
+            })
+          ]
         })
-      ]
+      })
     });
   }
 );

package/dist-cjs/packages/lab/src/form-field/FormField.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FormField.js","sources":["../src/form-field/FormField.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n Dispatch,\n ElementType,\n FocusEventHandler,\n ForwardedRef,\n forwardRef,\n HTMLAttributes,\n SetStateAction,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { makePrefixer, useForkRef, useId } from \"@salt-ds/core\";\nimport { FormFieldContext } from \"../form-field-context\";\nimport { Tooltip, useTooltip } from \"../tooltip\";\nimport { classBase } from \"./constant\";\nimport {\n FormActivationIndicator,\n FormActivationIndicatorProps,\n} from \"./FormActivationIndicator\";\nimport { FormHelperText, FormHelperTextProps } from \"./FormHelperText\";\nimport { FormLabel, FormLabelProps } from \"./FormLabel\";\nimport { NecessityIndicatorOptions } from \"./NecessityIndicator\";\nimport { StatusIndicatorProps } from \"./StatusIndicator\";\n\nimport \"./FormField.css\";\n\nexport type FormFieldLabelPlacement = \"top\" \| \"left\";\nexport type FormFieldHelperTextPlacement = \"bottom\" \| \"tooltip\";\nexport type FormFieldValidationStatus = \"error\" \| \"warning\";\n\nexport interface A11yValueProps\n extends Pick<NecessityIndicatorOptions, \"required\"> {\n /*\n If `true`, the FormField will be disabled.\n /\n disabled?: boolean;\n /* id of the helper text node /\n helperTextId?: string;\n /* id of the label node /\n labelId?: string;\n /\n The FormField value is Readonly\n /\n readOnly?: boolean;\n\n /\n Whether the form field needs to render helper text\n /\n renderHelperText?: boolean;\n}\n\nexport interface FormFieldProps\n extends HTMLAttributes<HTMLDivElement>,\n A11yValueProps {\n /\n The component used for activation indicator. Default to `FormActivationIndicator`.\n /\n ActivationIndicatorComponent?: ElementType<FormActivationIndicatorProps>;\n /\n Outer focus ring focus will not be applied. Defaults to false.\n /\n disableFocusRing?: boolean;\n // I hate this fullWidth business. We should support a width prop. The default should be 100% (standard block behaviour)\n // we should also support 'auto' or explicit numeric values\n /\n Whether the form field is occupying full width.\n /\n fullWidth?: boolean;\n /\n Whether to show the StatusIndicator component for validation states.\n /\n hasStatusIndicator?: boolean;\n /\n The helper text content\n /\n helperText?: string;\n /\n The component used for the helper text. Default to `FormHelperText`.\n /\n HelperTextComponent?: ElementType<FormHelperTextProps>;\n /\n Location the helperText, values: 'bottom' (default) or 'tooltip'.\n /\n helperTextPlacement?: FormFieldHelperTextPlacement;\n /\n Props to be applied to the `HelperTextComponent`.\n \n Generic on `FormHelperTextProps` is omitted.\n /\n HelperTextProps?: Partial<FormHelperTextProps>;\n /\n The label value for the FormField\n /\n label?: string;\n /\n The component used for the label. Default to `FormLabel`.\n /\n LabelComponent?: ElementType;\n /\n Location the label, values: 'top' (default) or 'left'\n /\n labelPlacement?: FormFieldLabelPlacement;\n /\n Props to be applied to the `LabelComponent`\n /\n LabelProps?: Partial<FormLabelProps>;\n /\n Override props to be used with the StatusIndicator component\n /\n StatusIndicatorProps?: Partial<StatusIndicatorProps>;\n /\n The state for the FormField: Must be one of: 'error'\|'warning'\|undefined\n /\n validationStatus?: FormFieldValidationStatus;\n /\n FormField variants; defaults to primary.\n /\n variant?: \"primary\" \| \"secondary\" \| \"tertiary\";\n}\n\nexport interface useA11yValueValue {\n \"aria-labelledby\": A11yValueProps[\"labelId\"];\n \"aria-required\": A11yValueProps[\"required\"];\n \"aria-describedby\": A11yValueProps[\"helperTextId\"] \| undefined;\n disabled: A11yValueProps[\"disabled\"];\n readOnly: A11yValueProps[\"readOnly\"];\n}\n\nconst useA11yValue = ({\n required,\n disabled,\n readOnly,\n labelId,\n helperTextId,\n renderHelperText,\n}: A11yValueProps) => {\n return useMemo(\n () => ({\n \"aria-labelledby\": labelId,\n \"aria-required\": required,\n \"aria-describedby\": renderHelperText ? helperTextId : undefined,\n disabled,\n readOnly,\n }),\n [labelId, disabled, readOnly, required, renderHelperText, helperTextId]\n );\n};\n\n// TODO: Add TS props for this\nexport const useFormField = ({\n onBlur,\n onFocus,\n}: {\n onBlur?: FocusEventHandler<HTMLDivElement>;\n onFocus?: FocusEventHandler<HTMLDivElement>;\n}): [\n { focused: boolean },\n { setFocused: Dispatch<SetStateAction<boolean>> },\n {\n onBlur: FocusEventHandler<HTMLDivElement>;\n onFocus: FocusEventHandler<HTMLDivElement>;\n }\n] => {\n const [focused, setFocused] = useState(false);\n const handleBlur: FocusEventHandler<HTMLDivElement> = (event) => {\n setFocused(false);\n onBlur?.(event);\n };\n const handleFocus: FocusEventHandler<HTMLDivElement> = (event) => {\n setFocused(true);\n onFocus?.(event);\n };\n return [\n {\n focused,\n },\n {\n setFocused,\n },\n {\n onBlur: handleBlur,\n onFocus: handleFocus,\n },\n ];\n};\n\nconst withBaseName = makePrefixer(classBase);\n\nexport const FormField = forwardRef(\n (\n {\n ActivationIndicatorComponent = FormActivationIndicator,\n children,\n className,\n disabled,\n disableFocusRing = false,\n fullWidth = true,\n hasStatusIndicator,\n HelperTextComponent = FormHelperText,\n HelperTextProps,\n helperText,\n helperTextPlacement = \"bottom\",\n label,\n LabelComponent = FormLabel,\n labelPlacement = \"top\",\n LabelProps = { displayedNecessity: \"required\" },\n onBlur,\n onFocus,\n readOnly,\n required,\n StatusIndicatorProps,\n validationStatus,\n variant = \"primary\",\n ...restProps\n }: FormFieldProps,\n ref: ForwardedRef<HTMLDivElement>\n ) => {\n const labelId = useId(LabelProps?.id);\n const helperTextId = useId(HelperTextProps?.id);\n const rootRef = useRef<HTMLDivElement>(null);\n\n const renderHelperText = !!helperText;\n\n const a11yValue = useA11yValue({\n required,\n disabled,\n readOnly,\n labelId,\n helperTextId,\n renderHelperText,\n });\n\n const [states, dispatchers, eventHandlers] = useFormField({\n onBlur,\n onFocus,\n });\n\n const hasLabel = label !== undefined;\n const labelTop = hasLabel && labelPlacement === \"top\";\n const labelLeft = hasLabel && labelPlacement === \"left\";\n const isWarning = validationStatus === \"warning\";\n const isError = validationStatus === \"error\";\n const focusClass = disableFocusRing\n ? \"lowFocused\"\n : \"focused\"; / NOTE: need to look at */\n const inlineHelperText =\n renderHelperText && helperTextPlacement === \"bottom\";\n const tooltipHelperText =\n renderHelperText &&\n helperTextPlacement === \"tooltip\" &&\n !hasStatusIndicator;\n\n const { getTooltipProps, getTriggerProps } = useTooltip({\n disabled: !tooltipHelperText,\n });\n\n const { ref: triggerRef, ...triggerProps } = getTriggerProps({\n className: clsx(\n withBaseName(),\n {\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"readOnly\")]: readOnly,\n [withBaseName(\"warning\")]: isWarning,\n [withBaseName(\"error\")]: isError,\n [withBaseName(\"fullWidth\")]: fullWidth,\n [withBaseName(focusClass)]: states.focused,\n [withBaseName(\"labelTop\")]: labelTop,\n [withBaseName(\"labelLeft\")]: labelLeft,\n [withBaseName(`withHelperText`)]: inlineHelperText,\n [withBaseName(variant)]: variant,\n },\n className\n ),\n ...eventHandlers,\n ...restProps,\n });\n\n const handleTriggerRef = useForkRef(triggerRef, rootRef);\n const handleRef = useForkRef(handleTriggerRef, ref);\n\n return (\n <>\n <div ref={handleRef} {...triggerProps}>\n <FormFieldContext.Provider\n value={{\n ...states,\n ...dispatchers,\n ...eventHandlers,\n a11yProps: a11yValue,\n inFormField: true,\n ref: rootRef,\n }}\n >\n {hasLabel && (\n <LabelComponent\n {...LabelProps}\n validationStatus={validationStatus}\n hasStatusIndicator={hasStatusIndicator}\n StatusIndicatorProps={StatusIndicatorProps}\n className={LabelProps.className}\n label={label}\n disabled={disabled}\n readOnly={readOnly}\n required={required}\n tooltipText={helperText}\n id={labelId}\n />\n )}\n {children}\n <ActivationIndicatorComponent\n hasIcon={!hasStatusIndicator}\n validationStatus={validationStatus}\n />\n {renderHelperText && (\n <HelperTextComponent\n helperText={helperText}\n helperTextPlacement={helperTextPlacement}\n {...HelperTextProps}\n id={helperTextId}\n />\n )}\n </FormFieldContext.Provider>\n </div>\n <Tooltip {...getTooltipProps({ title: helperText })} />\n </>\n );\n }\n);\n"],"names":["useMemo","useState","makePrefixer","classBase","forwardRef","FormActivationIndicator","FormHelperText","FormLabel","StatusIndicatorProps","useId","useRef","useTooltip","clsx","useForkRef","jsxs","Fragment","jsx","FormFieldContext","Tooltip"],"mappings":"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"}
1	+ {"version":3,"file":"FormField.js","sources":["../src/form-field/FormField.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport {\n Dispatch,\n ElementType,\n FocusEventHandler,\n ForwardedRef,\n forwardRef,\n HTMLAttributes,\n SetStateAction,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { makePrefixer, Tooltip, useForkRef, useId } from \"@salt-ds/core\";\nimport { FormFieldContext } from \"../form-field-context\";\nimport { classBase } from \"./constant\";\nimport {\n FormActivationIndicator,\n FormActivationIndicatorProps,\n} from \"./FormActivationIndicator\";\nimport { FormHelperText, FormHelperTextProps } from \"./FormHelperText\";\nimport { FormLabel, FormLabelProps } from \"./FormLabel\";\nimport { NecessityIndicatorOptions } from \"./NecessityIndicator\";\nimport { StatusIndicatorProps } from \"./StatusIndicator\";\n\nimport \"./FormField.css\";\n\nexport type FormFieldLabelPlacement = \"top\" \| \"left\";\nexport type FormFieldHelperTextPlacement = \"bottom\" \| \"tooltip\";\nexport type FormFieldValidationStatus = \"error\" \| \"warning\";\n\nexport interface A11yValueProps\n extends Pick<NecessityIndicatorOptions, \"required\"> {\n /*\n If `true`, the FormField will be disabled.\n /\n disabled?: boolean;\n /* id of the helper text node /\n helperTextId?: string;\n /* id of the label node /\n labelId?: string;\n /\n The FormField value is Readonly\n /\n readOnly?: boolean;\n\n /\n Whether the form field needs to render helper text\n /\n renderHelperText?: boolean;\n}\n\nexport interface FormFieldProps\n extends HTMLAttributes<HTMLDivElement>,\n A11yValueProps {\n /\n The component used for activation indicator. Default to `FormActivationIndicator`.\n /\n ActivationIndicatorComponent?: ElementType<FormActivationIndicatorProps>;\n /\n Outer focus ring focus will not be applied. Defaults to false.\n /\n disableFocusRing?: boolean;\n // I hate this fullWidth business. We should support a width prop. The default should be 100% (standard block behaviour)\n // we should also support 'auto' or explicit numeric values\n /\n Whether the form field is occupying full width.\n /\n fullWidth?: boolean;\n /\n Whether to show the StatusIndicator component for validation states.\n /\n hasStatusIndicator?: boolean;\n /\n The helper text content\n /\n helperText?: string;\n /\n The component used for the helper text. Default to `FormHelperText`.\n /\n HelperTextComponent?: ElementType<FormHelperTextProps>;\n /\n Location the helperText, values: 'bottom' (default) or 'tooltip'.\n /\n helperTextPlacement?: FormFieldHelperTextPlacement;\n /\n Props to be applied to the `HelperTextComponent`.\n \n Generic on `FormHelperTextProps` is omitted.\n /\n HelperTextProps?: Partial<FormHelperTextProps>;\n /\n The label value for the FormField\n /\n label?: string;\n /\n The component used for the label. Default to `FormLabel`.\n /\n LabelComponent?: ElementType;\n /\n Location the label, values: 'top' (default) or 'left'\n /\n labelPlacement?: FormFieldLabelPlacement;\n /\n Props to be applied to the `LabelComponent`\n /\n LabelProps?: Partial<FormLabelProps>;\n /\n Override props to be used with the StatusIndicator component\n /\n StatusIndicatorProps?: Partial<StatusIndicatorProps>;\n /\n The state for the FormField: Must be one of: 'error'\|'warning'\|undefined\n /\n validationStatus?: FormFieldValidationStatus;\n /\n FormField variants; defaults to primary.\n /\n variant?: \"primary\" \| \"secondary\" \| \"tertiary\";\n}\n\nexport interface useA11yValueValue {\n \"aria-labelledby\": A11yValueProps[\"labelId\"];\n \"aria-required\": A11yValueProps[\"required\"];\n \"aria-describedby\": A11yValueProps[\"helperTextId\"] \| undefined;\n disabled: A11yValueProps[\"disabled\"];\n readOnly: A11yValueProps[\"readOnly\"];\n}\n\nconst useA11yValue = ({\n required,\n disabled,\n readOnly,\n labelId,\n helperTextId,\n renderHelperText,\n}: A11yValueProps) => {\n return useMemo(\n () => ({\n \"aria-labelledby\": labelId,\n \"aria-required\": required,\n \"aria-describedby\": renderHelperText ? helperTextId : undefined,\n disabled,\n readOnly,\n }),\n [labelId, disabled, readOnly, required, renderHelperText, helperTextId]\n );\n};\n\n// TODO: Add TS props for this\nexport const useFormField = ({\n onBlur,\n onFocus,\n}: {\n onBlur?: FocusEventHandler<HTMLDivElement>;\n onFocus?: FocusEventHandler<HTMLDivElement>;\n}): [\n { focused: boolean },\n { setFocused: Dispatch<SetStateAction<boolean>> },\n {\n onBlur: FocusEventHandler<HTMLDivElement>;\n onFocus: FocusEventHandler<HTMLDivElement>;\n }\n] => {\n const [focused, setFocused] = useState(false);\n const handleBlur: FocusEventHandler<HTMLDivElement> = (event) => {\n setFocused(false);\n onBlur?.(event);\n };\n const handleFocus: FocusEventHandler<HTMLDivElement> = (event) => {\n setFocused(true);\n onFocus?.(event);\n };\n return [\n {\n focused,\n },\n {\n setFocused,\n },\n {\n onBlur: handleBlur,\n onFocus: handleFocus,\n },\n ];\n};\n\nconst withBaseName = makePrefixer(classBase);\n\nexport const FormField = forwardRef(\n (\n {\n ActivationIndicatorComponent = FormActivationIndicator,\n children,\n className,\n disabled,\n disableFocusRing = false,\n fullWidth = true,\n hasStatusIndicator,\n HelperTextComponent = FormHelperText,\n HelperTextProps,\n helperText,\n helperTextPlacement = \"bottom\",\n label,\n LabelComponent = FormLabel,\n labelPlacement = \"top\",\n LabelProps = { displayedNecessity: \"required\" },\n onBlur,\n onFocus,\n readOnly,\n required,\n StatusIndicatorProps,\n validationStatus,\n variant = \"primary\",\n ...restProps\n }: FormFieldProps,\n ref: ForwardedRef<HTMLDivElement>\n ) => {\n const labelId = useId(LabelProps?.id);\n const helperTextId = useId(HelperTextProps?.id);\n const rootRef = useRef<HTMLDivElement>(null);\n\n const renderHelperText = !!helperText;\n\n const a11yValue = useA11yValue({\n required,\n disabled,\n readOnly,\n labelId,\n helperTextId,\n renderHelperText,\n });\n\n const [states, dispatchers, eventHandlers] = useFormField({\n onBlur,\n onFocus,\n });\n\n const hasLabel = label !== undefined;\n const labelTop = hasLabel && labelPlacement === \"top\";\n const labelLeft = hasLabel && labelPlacement === \"left\";\n const isWarning = validationStatus === \"warning\";\n const isError = validationStatus === \"error\";\n const focusClass = disableFocusRing\n ? \"lowFocused\"\n : \"focused\"; / NOTE: need to look at */\n const inlineHelperText =\n renderHelperText && helperTextPlacement === \"bottom\";\n const tooltipHelperText =\n renderHelperText &&\n helperTextPlacement === \"tooltip\" &&\n !hasStatusIndicator;\n\n const handleTriggerRef = useForkRef(rootRef, ref);\n\n return (\n <Tooltip disabled={!tooltipHelperText} content={helperText}>\n <div\n ref={handleTriggerRef}\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"readOnly\")]: readOnly,\n [withBaseName(\"warning\")]: isWarning,\n [withBaseName(\"error\")]: isError,\n [withBaseName(\"fullWidth\")]: fullWidth,\n [withBaseName(focusClass)]: states.focused,\n [withBaseName(\"labelTop\")]: labelTop,\n [withBaseName(\"labelLeft\")]: labelLeft,\n [withBaseName(`withHelperText`)]: inlineHelperText,\n [withBaseName(variant)]: variant,\n },\n className\n )}\n {...eventHandlers}\n {...restProps}\n >\n <FormFieldContext.Provider\n value={{\n ...states,\n ...dispatchers,\n ...eventHandlers,\n a11yProps: a11yValue,\n inFormField: true,\n ref: rootRef,\n }}\n >\n {hasLabel && (\n <LabelComponent\n {...LabelProps}\n validationStatus={validationStatus}\n hasStatusIndicator={hasStatusIndicator}\n StatusIndicatorProps={StatusIndicatorProps}\n className={LabelProps.className}\n label={label}\n disabled={disabled}\n readOnly={readOnly}\n required={required}\n tooltipText={helperText}\n id={labelId}\n />\n )}\n {children}\n <ActivationIndicatorComponent\n hasIcon={!hasStatusIndicator}\n validationStatus={validationStatus}\n />\n {renderHelperText && (\n <HelperTextComponent\n helperText={helperText}\n helperTextPlacement={helperTextPlacement}\n {...HelperTextProps}\n id={helperTextId}\n />\n )}\n </FormFieldContext.Provider>\n </div>\n </Tooltip>\n );\n }\n);\n"],"names":["useMemo","useState","makePrefixer","classBase","forwardRef","FormActivationIndicator","FormHelperText","FormLabel","StatusIndicatorProps","useId","useRef","useForkRef","jsx","Tooltip","clsx","jsxs","FormFieldContext"],"mappings":"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"}

package/dist-cjs/packages/lab/src/form-field/StatusIndicator.js CHANGED Viewed

@@ -5,14 +5,11 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var jsxRuntime = require('react/jsx-runtime');
 var clsx = require('clsx');
 var core = require('@salt-ds/core');
-var Tooltip = require('../tooltip/Tooltip.js');
-require('../tooltip/TooltipContext.js');
-var useTooltip = require('../tooltip/useTooltip.js');
 const withBaseName = core.makePrefixer("saltFormField");
 const StatusIndicator = (props) => {
   const {
-    TooltipComponent = Tooltip.Tooltip,
+    TooltipComponent = core.Tooltip,
     hasTooltip = false,
     TooltipProps: TooltipProps2,
     tooltipText,
@@ -21,33 +18,23 @@ const StatusIndicator = (props) => {
     status = "info",
     ...restProps
   } = props;
-  const { getTriggerProps, getTooltipProps } = useTooltip.useTooltip({
+  return /* @__PURE__ */ jsxRuntime.jsx(TooltipComponent, {
+    hideIcon: true,
+    status,
+    content: tooltipText,
     placement: "top",
-    disabled: !hasTooltip
-  });
-  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
-    children: [
-      /* @__PURE__ */ jsxRuntime.jsx(TooltipComponent, {
-        ...getTooltipProps({
-          hideIcon: true,
-          status,
-          title: tooltipText,
-          ...TooltipProps2
-        })
-      }),
-      /* @__PURE__ */ jsxRuntime.jsx(core.StatusIndicator, {
-        ...getTriggerProps({
-          status,
-          ...restProps,
-          ...IconProps2,
-          className: clsx.clsx(
-            withBaseName("statusIndicator"),
-            className,
-            IconProps2 == null ? void 0 : IconProps2.className
-          )
-        })
-      })
-    ]
+    disabled: !hasTooltip,
+    ...TooltipProps2,
+    children: /* @__PURE__ */ jsxRuntime.jsx(core.StatusIndicator, {
+      status,
+      ...restProps,
+      ...IconProps2,
+      className: clsx.clsx(
+        withBaseName("statusIndicator"),
+        className,
+        IconProps2 == null ? void 0 : IconProps2.className
+      )
+    })
   });
 };

package/dist-cjs/packages/lab/src/form-field/StatusIndicator.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StatusIndicator.js","sources":["../src/form-field/StatusIndicator.tsx"],"sourcesContent":["import { IconProps } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport { ElementType } from \"react\";\nimport {\n StatusIndicator as BaseStatusIndicator,\n ~~makePrefixer~~,\n} from \"@salt-ds/core\";\~~nimport { Tooltip, TooltipProps, useTooltip } from \"../tooltip\";\~~n\nconst withBaseName = makePrefixer(\"saltFormField\");\n\nexport type StatusIndicatorStatus = \"error\" \| \"info\" \| \"warning\" \| \"success\";\n\nexport interface StatusIndicatorProps extends IconProps {\n hasTooltip?: boolean;\n IconProps?: Partial<IconProps>;\n status?: StatusIndicatorStatus;\n TooltipComponent?: ElementType<TooltipProps>;\n TooltipProps?: Partial<TooltipProps>;\n tooltipText?: string;\n}\n\nexport const StatusIndicator = (props: StatusIndicatorProps) => {\n const {\n TooltipComponent = Tooltip,\n hasTooltip = false,\n TooltipProps,\n tooltipText,\n IconProps,\n className,\n status = \"info\",\n ...restProps\n } = props;\n\n ~~const~~ { ~~getTriggerProps, getTooltipProps~~ } = ~~useTooltip(~~{\n placement~~: \~~"top\",\n disabled: !hasTooltip~~,\n~~ }~~);\n~~\n ~~return (\n <>\n~~ ~~<TooltipComponent\n~~ {...~~getTooltipProps({\n hideIcon: true,\n status,\n title: tooltipText,\n ...~~TooltipProps~~,\n~~ })}\n ~~/>\~~n <BaseStatusIndicator\n {~~...getTriggerProps<typeof BaseStatusIndicator>({~~\n ~~status,\n~~ ...restProps,\n ...IconProps,\n className: clsx(\n withBaseName(\"statusIndicator\"),\n className,\n IconProps?.className\n ~~),\n~~ })}\n />\n ~~</>\~~n );\n};\n"],"names":["makePrefixer","Tooltip","TooltipProps","IconProps","~~useTooltip","jsxs","Fragment","~~jsx","BaseStatusIndicator","clsx"],"mappings":"~~;;;;;;;;;;;AASA~~,MAAM,YAAA,GAAeA,kBAAa,eAAe,CAAA,CAAA;AAapC,MAAA,eAAA,GAAkB,CAAC,KAAgC,KAAA;AAC9D,EAAM,MAAA;AAAA,IACJ,gBAAmB,GAAAC,~~eAAA~~;AAAA,IACnB,UAAa,GAAA,KAAA;AAAA,IACb,YAAAC,EAAAA,aAAAA;AAAA,IACA,WAAA;AAAA,IACA,SAAAC,EAAAA,UAAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAS,GAAA,MAAA;AAAA,IACN,GAAA,SAAA;AAAA,GACD,GAAA,KAAA,CAAA;AAEJ,EAAA,~~MAAM~~,~~EAAE~~,~~eAAA~~,~~EAAiB~~,~~eAAgB,~~EAAA~~,GAAIC,qBAAW,CAAA~~;AAAA,~~IACtD~~,~~SAAW~~,EAAA,~~KAAA~~;AAAA,~~IACX~~,~~UAAU,CAAC,UAAA~~;AAAA,~~GACZ~~,~~CAAA~~,~~CAAA;AAED,EACE,uBAAAC,eAAA,CAAAC,mBAAA,~~EAAA~~;AAAA~~,~~IACE,QAAA,EAAA~~;AAAA,~~sBAACC~~,~~cAAA~~,~~CAAA,gBAAA,~~EAAA~~;AAAA~~,~~QACE,GAAG,eAAgB,CAAA~~;AAAA,~~UAClB~~,~~QAAU~~,~~EAAA~~,~~IAAA~~;AAAA,~~UACV~~,~~MAAA;AAAA~~,~~UACA,KAAO,EAAA,WAAA;AAAA,UACP,GAAGL,~~aAAAA;AAAA,~~SACJ~~,~~CAAA;AAAA~~,~~OACH~~,~~CAAA;AAAA,sBACCK,~~cAAA,CAAAC,oBAAA,EAAA;AAAA,~~QACE~~,~~GAAG,eAA4C,CAAA;AAAA,UAC9C,~~MAAA;AAAA,~~UACA~~,GAAG,SAAA;AAAA,~~UACH~~,~~GAAGL~~,UAAAA;AAAA,~~UACH~~,SAAW,~~EAAAM~~,SAAA;AAAA,~~YACT~~,aAAa,iBAAiB,CAAA;AAAA,~~YAC9B~~,SAAA;AAAA,~~YACAN~~,UAAAA,IAAA,gBAAAA,UAAW,CAAA,SAAA;AAAA,~~WACb~~;AAAA,~~SACD~~,CAAA;AAAA,~~OACH,CAAA;AAAA,KAAA;AAAA,~~GACF,CAAA,CAAA;AAEJ;;;;"}
1	+ {"version":3,"file":"StatusIndicator.js","sources":["../src/form-field/StatusIndicator.tsx"],"sourcesContent":["import { IconProps } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport { ElementType } from \"react\";\nimport {\n makePrefixer,\n StatusIndicator as BaseStatusIndicator,\n Tooltip,\n TooltipProps,\n} from \"@salt-ds/core\";\n\nconst withBaseName = makePrefixer(\"saltFormField\");\n\nexport type StatusIndicatorStatus = \"error\" \| \"info\" \| \"warning\" \| \"success\";\n\nexport interface StatusIndicatorProps extends IconProps {\n hasTooltip?: boolean;\n IconProps?: Partial<IconProps>;\n status?: StatusIndicatorStatus;\n TooltipComponent?: ElementType<TooltipProps>;\n TooltipProps?: Partial<TooltipProps>;\n tooltipText?: string;\n}\n\nexport const StatusIndicator = (props: StatusIndicatorProps) => {\n const {\n TooltipComponent = Tooltip,\n hasTooltip = false,\n TooltipProps,\n tooltipText,\n IconProps,\n className,\n status = \"info\",\n ...restProps\n } = props;\n\n return (\n <TooltipComponent\n hideIcon\n status={status}\n content={tooltipText}\n placement=\"top\"\n disabled={!hasTooltip}\n {...TooltipProps}\n >\n <BaseStatusIndicator\n status={status}\n {...restProps}\n {...IconProps}\n className={clsx(\n withBaseName(\"statusIndicator\"),\n className,\n IconProps?.className\n )}\n />\n </TooltipComponent>\n );\n};\n"],"names":["makePrefixer","Tooltip","TooltipProps","IconProps","jsx","BaseStatusIndicator","clsx"],"mappings":";;;;;;;;AAUA,MAAM,YAAA,GAAeA,kBAAa,eAAe,CAAA,CAAA;AAapC,MAAA,eAAA,GAAkB,CAAC,KAAgC,KAAA;AAC9D,EAAM,MAAA;AAAA,IACJ,gBAAmB,GAAAC,YAAA;AAAA,IACnB,UAAa,GAAA,KAAA;AAAA,IACb,YAAAC,EAAAA,aAAAA;AAAA,IACA,WAAA;AAAA,IACA,SAAAC,EAAAA,UAAAA;AAAA,IACA,SAAA;AAAA,IACA,MAAS,GAAA,MAAA;AAAA,IACN,GAAA,SAAA;AAAA,GACD,GAAA,KAAA,CAAA;AAEJ,EAAA,uBACGC,cAAA,CAAA,gBAAA,EAAA;AAAA,IACC,QAAQ,EAAA,IAAA;AAAA,IACR,MAAA;AAAA,IACA,OAAS,EAAA,WAAA;AAAA,IACT,SAAU,EAAA,KAAA;AAAA,IACV,UAAU,CAAC,UAAA;AAAA,IACV,GAAGF,aAAAA;AAAA,IAEJ,QAAC,kBAAAE,cAAA,CAAAC,oBAAA,EAAA;AAAA,MACC,MAAA;AAAA,MACC,GAAG,SAAA;AAAA,MACH,GAAGF,UAAAA;AAAA,MACJ,SAAW,EAAAG,SAAA;AAAA,QACT,aAAa,iBAAiB,CAAA;AAAA,QAC9B,SAAA;AAAA,QACAH,UAAAA,IAAA,gBAAAA,UAAW,CAAA,SAAA;AAAA,OACb;AAAA,KACF,CAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}

package/dist-cjs/packages/lab/src/index.js CHANGED Viewed

@@ -19,6 +19,7 @@ var isPlainObject = require('./utils/isPlainObject.js');
 var partition = require('./utils/partition.js');
 var useClickOutside = require('./utils/useClickOutside.js');
 var useEventCallback = require('./utils/useEventCallback.js');
+var useFloatingUI = require('./utils/useFloatingUI.js');
 var useIsViewportLargerThanBreakpoint = require('./utils/useIsViewportLargerThanBreakpoint.js');
 var useLayoutEffectOnce = require('./utils/useLayoutEffectOnce.js');
 var useLayoutEffectSkipFirst = require('./utils/useLayoutEffectSkipFirst.js');
@@ -119,7 +120,6 @@ var ParentChildLayout = require('./parent-child-layout/ParentChildLayout.js');
 var Pill = require('./pill/Pill.js');
 var ClosablePill = require('./pill/ClosablePill.js');
 var SelectablePill = require('./pill/SelectablePill.js');
-var useFloatingUI = require('./popper/useFloatingUI.js');
 var Portal = require('./portal/Portal.js');
 var CircularProgress = require('./progress/CircularProgress/CircularProgress.js');
 var LinearProgress = require('./progress/LinearProgress/LinearProgress.js');
@@ -145,8 +145,6 @@ var SearchInput = require('./search-input/SearchInput.js');
 var SkipLink = require('./skip-link/SkipLink.js');
 var SkipLinks = require('./skip-link/SkipLinks.js');
 var Slider = require('./slider/Slider.js');
-var Spinner = require('./spinner/Spinner.js');
-var SplitLayout = require('./split-layout/SplitLayout.js');
 var useStepperInput = require('./stepper-input/useStepperInput.js');
 var StepperInput = require('./stepper-input/StepperInput.js');
 var Switch = require('./switch/Switch.js');
@@ -164,9 +162,6 @@ var Toolbar = require('./toolbar/Toolbar.js');
 var Tooltray = require('./toolbar/Tooltray.js');
 var ToolbarButton = require('./toolbar/ToolbarButton.js');
 var ToolbarField = require('./toolbar/toolbar-field/ToolbarField.js');
-var Tooltip = require('./tooltip/Tooltip.js');
-var TooltipContext = require('./tooltip/TooltipContext.js');
-var useTooltip = require('./tooltip/useTooltip.js');
 var Tree = require('./tree/Tree.js');
 var WindowContext = require('./window/WindowContext.js');
 var ElectronWindow = require('./window/ElectronWindow.js');
@@ -183,6 +178,8 @@ exports.isPlainObject = isPlainObject.isPlainObject;
 exports.partition = partition.partition;
 exports.useClickOutside = useClickOutside.useClickOutside;
 exports.useEventCallback = useEventCallback.useEventCallback;
+exports.DEFAULT_FLOATING_UI_MIDDLEWARE = useFloatingUI.DEFAULT_FLOATING_UI_MIDDLEWARE;
+exports.useFloatingUI = useFloatingUI.useFloatingUI;
 exports.useIsViewportLargerThanBreakpoint = useIsViewportLargerThanBreakpoint.useIsViewportLargerThanBreakpoint;
 exports.useLayoutEffectOnce = useLayoutEffectOnce.useLayoutEffectOnce;
 exports.useLayoutEffectSkipFirst = useLayoutEffectSkipFirst.useLayoutEffectSkipFirst;
@@ -298,8 +295,6 @@ exports.ParentChildLayout = ParentChildLayout.ParentChildLayout;
 exports.Pill = Pill.Pill;
 exports.ClosablePill = ClosablePill.ClosablePill;
 exports.SelectablePill = SelectablePill.SelectablePill;
-exports.DEFAULT_FLOATING_UI_MIDDLEWARE = useFloatingUI.DEFAULT_FLOATING_UI_MIDDLEWARE;
-exports.useFloatingUI = useFloatingUI.useFloatingUI;
 exports.Portal = Portal.Portal;
 exports.CircularProgress = CircularProgress.CircularProgress;
 exports.SIZE_OPTIONS = CircularProgress.SIZE_OPTIONS;
@@ -352,9 +347,6 @@ exports.SearchInput = SearchInput.SearchInput;
 exports.SkipLink = SkipLink.SkipLink;
 exports.SkipLinks = SkipLinks.SkipLinks;
 exports.Slider = Slider.Slider;
-exports.Spinner = Spinner.Spinner;
-exports.SpinnerSizeValues = Spinner.SpinnerSizeValues;
-exports.SplitLayout = SplitLayout.SplitLayout;
 exports.useStepperInput = useStepperInput.useStepperInput;
 exports.StepperInput = StepperInput.StepperInput;
 exports.Switch = Switch.Switch;
@@ -372,10 +364,6 @@ exports.Toolbar = Toolbar.Toolbar;
 exports.Tooltray = Tooltray.Tooltray;
 exports.ToolbarButton = ToolbarButton.ToolbarButton;
 exports.ToolbarField = ToolbarField.ToolbarField;
-exports.Tooltip = Tooltip.Tooltip;
-exports.TooltipContext = TooltipContext.TooltipContext;
-exports.useTooltipContext = TooltipContext.useTooltipContext;
-exports.useTooltip = useTooltip.useTooltip;
 exports.Tree = Tree.Tree;
 exports.Window = WindowContext.Window;
 exports.WindowContext = WindowContext.WindowContext;

package/dist-cjs/packages/lab/src/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1	+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist-cjs/packages/lab/src/layer-layout/LayerLayout.js CHANGED Viewed

@@ -5,11 +5,12 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var clsx = require('clsx');
-var core = require('@salt-ds/core');
-var useIsViewportLargerThanBreakpoint = require('../utils/useIsViewportLargerThanBreakpoint.js');
 var Scrim = require('../scrim/Scrim.js');
 require('../scrim/ScrimContext.js');
 require('./LayerLayout.css.js');
+var core = require('@salt-ds/core');
+require('../utils/useFloatingUI.js');
+var useIsViewportLargerThanBreakpoint = require('../utils/useIsViewportLargerThanBreakpoint.js');
 const LAYER_POSITIONS = [
   "center",

package/dist-cjs/packages/lab/src/layer-layout/LayerLayout.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"LayerLayout.js","sources":["../src/layer-layout/LayerLayout.tsx"],"sourcesContent":["import { forwardRef, HTMLAttributes, ~~useState~~, ~~useEffect~~ } from \"react\";\nimport { clsx } from \"clsx\";\nimport { ~~Breakpoints~~, ~~makePrefixer,~~ ~~usePrevious~~ } from \"~~@salt-ds/core~~\";\n\nimport { ~~useIsViewportLargerThanBreakpoint~~ } from \"~~../utils~~\";\n\nimport { ~~Scrim,~~ ~~ScrimProps~~ } from \"../~~scrim~~\";\~~nimport \"./LayerLayout.css\";\~~n\nexport const LAYER_POSITIONS = [\n \"center\",\n \"left\",\n \"top\",\n \"right\",\n \"bottom\",\n] as const;\n\nexport type LayerPositions = typeof LAYER_POSITIONS[number];\n\nexport interface LayerLayoutProps extends HTMLAttributes<HTMLDivElement> {\n /*\n Disable the scrim.\n /\n disableScrim?: boolean;\n /\n Defines the layer position within the screen.\n /\n position?: LayerPositions;\n /\n Breakpoint at which the layer will become fullscreen.\n /\n fullScreenAtBreakpoint?: keyof Breakpoints;\n /\n Disable all animations.\n /\n disableAnimations?: boolean;\n /\n Display or hide the component.\n /\n isOpen?: boolean;\n /\n Props to be passed to the Scrim component.\n */\n scrimProps?: Partial<ScrimProps>;\n}\n\nconst withBaseName = makePrefixer(\"saltLayerLayout\");\n\nconst ariaAttributes = { role: \"dialog\", \"aria-modal\": true };\n\nexport const LayerLayout = forwardRef<HTMLDivElement, LayerLayoutProps>(\n function LayerLayout(props, ref) {\n const {\n children,\n className,\n disableScrim = false,\n position = \"center\",\n fullScreenAtBreakpoint = \"sm\",\n disableAnimations = false,\n scrimProps,\n isOpen = true,\n ...rest\n } = props;\n\n const previousDisableAnimationsProp = usePrevious(\n disableAnimations,\n [disableAnimations],\n false\n ); // we check the previous value for this prop to prevent the animations from triggering again when it changes\n\n const [showComponent, setShowComponent] = useState(false);\n\n const [isAnimating, setIsAnimating] = useState(false);\n\n useEffect(() => {\n if ((!isOpen && disableAnimations) \|\| (!isOpen && !isAnimating)) {\n setShowComponent(false);\n }\n\n if (isOpen && !showComponent) {\n setShowComponent(true);\n }\n }, [isOpen, showComponent, disableAnimations, isAnimating]);\n\n const fullScreen = useIsViewportLargerThanBreakpoint(\n fullScreenAtBreakpoint\n );\n\n const anchored = position !== \"center\" && !fullScreen;\n\n const enterAnimation =\n !disableAnimations && isOpen && !previousDisableAnimationsProp;\n\n const exitAnimation = !disableAnimations && !isOpen;\n\n const layerLayout = showComponent ? (\n <div\n ref={ref}\n className={clsx(withBaseName(), className, {\n [withBaseName(\"anchor\")]: anchored,\n [withBaseName(\"fullScreen\")]: fullScreen,\n [withBaseName(position)]: !fullScreen,\n [withBaseName(\"enter-animation\")]: enterAnimation,\n [withBaseName(\"exit-animation\")]: exitAnimation,\n })}\n onAnimationStart={() => setIsAnimating(true)}\n onAnimationEnd={() => {\n if (!isOpen && showComponent) {\n setShowComponent(false);\n }\n }}\n {...(disableScrim && ariaAttributes)}\n {...rest}\n >\n {children}\n </div>\n ) : null;\n\n return disableScrim ? (\n layerLayout\n ) : (\n <Scrim\n open={showComponent}\n className={clsx({\n [withBaseName(\"enter-animation\")]: enterAnimation,\n [withBaseName(\"exit-animation\")]: exitAnimation,\n })}\n {...scrimProps}\n >\n {layerLayout}\n </Scrim>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","LayerLayout","usePrevious","useState","useEffect","useIsViewportLargerThanBreakpoint","jsx","clsx","Scrim"],"mappings":"~~;;;;;;;;;;;;;AASO~~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"}
1	+ {"version":3,"file":"LayerLayout.js","sources":["../src/layer-layout/LayerLayout.tsx"],"sourcesContent":["import { forwardRef, HTMLAttributes, useEffect, useState } from \"react\";\nimport { clsx } from \"clsx\";\n\nimport { Scrim, ScrimProps } from \"../scrim\";\nimport \"./LayerLayout.css\";\nimport { Breakpoints, makePrefixer, usePrevious } from \"@salt-ds/core\";\nimport { useIsViewportLargerThanBreakpoint } from \"../utils\";\n\nexport const LAYER_POSITIONS = [\n \"center\",\n \"left\",\n \"top\",\n \"right\",\n \"bottom\",\n] as const;\n\nexport type LayerPositions = typeof LAYER_POSITIONS[number];\n\nexport interface LayerLayoutProps extends HTMLAttributes<HTMLDivElement> {\n /*\n Disable the scrim.\n /\n disableScrim?: boolean;\n /\n Defines the layer position within the screen.\n /\n position?: LayerPositions;\n /\n Breakpoint at which the layer will become fullscreen.\n /\n fullScreenAtBreakpoint?: keyof Breakpoints;\n /\n Disable all animations.\n /\n disableAnimations?: boolean;\n /\n Display or hide the component.\n /\n isOpen?: boolean;\n /\n Props to be passed to the Scrim component.\n */\n scrimProps?: Partial<ScrimProps>;\n}\n\nconst withBaseName = makePrefixer(\"saltLayerLayout\");\n\nconst ariaAttributes = { role: \"dialog\", \"aria-modal\": true };\n\nexport const LayerLayout = forwardRef<HTMLDivElement, LayerLayoutProps>(\n function LayerLayout(props, ref) {\n const {\n children,\n className,\n disableScrim = false,\n position = \"center\",\n fullScreenAtBreakpoint = \"sm\",\n disableAnimations = false,\n scrimProps,\n isOpen = true,\n ...rest\n } = props;\n\n const previousDisableAnimationsProp = usePrevious(\n disableAnimations,\n [disableAnimations],\n false\n ); // we check the previous value for this prop to prevent the animations from triggering again when it changes\n\n const [showComponent, setShowComponent] = useState(false);\n\n const [isAnimating, setIsAnimating] = useState(false);\n\n useEffect(() => {\n if ((!isOpen && disableAnimations) \|\| (!isOpen && !isAnimating)) {\n setShowComponent(false);\n }\n\n if (isOpen && !showComponent) {\n setShowComponent(true);\n }\n }, [isOpen, showComponent, disableAnimations, isAnimating]);\n\n const fullScreen = useIsViewportLargerThanBreakpoint(\n fullScreenAtBreakpoint\n );\n\n const anchored = position !== \"center\" && !fullScreen;\n\n const enterAnimation =\n !disableAnimations && isOpen && !previousDisableAnimationsProp;\n\n const exitAnimation = !disableAnimations && !isOpen;\n\n const layerLayout = showComponent ? (\n <div\n ref={ref}\n className={clsx(withBaseName(), className, {\n [withBaseName(\"anchor\")]: anchored,\n [withBaseName(\"fullScreen\")]: fullScreen,\n [withBaseName(position)]: !fullScreen,\n [withBaseName(\"enter-animation\")]: enterAnimation,\n [withBaseName(\"exit-animation\")]: exitAnimation,\n })}\n onAnimationStart={() => setIsAnimating(true)}\n onAnimationEnd={() => {\n if (!isOpen && showComponent) {\n setShowComponent(false);\n }\n }}\n {...(disableScrim && ariaAttributes)}\n {...rest}\n >\n {children}\n </div>\n ) : null;\n\n return disableScrim ? (\n layerLayout\n ) : (\n <Scrim\n open={showComponent}\n className={clsx({\n [withBaseName(\"enter-animation\")]: enterAnimation,\n [withBaseName(\"exit-animation\")]: exitAnimation,\n })}\n {...scrimProps}\n >\n {layerLayout}\n </Scrim>\n );\n }\n);\n"],"names":["makePrefixer","forwardRef","LayerLayout","usePrevious","useState","useEffect","useIsViewportLargerThanBreakpoint","jsx","clsx","Scrim"],"mappings":"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"}

package/dist-cjs/packages/lab/src/list/Highlighter.js CHANGED Viewed

@@ -6,6 +6,7 @@ var jsxRuntime = require('react/jsx-runtime');
 var core = require('@salt-ds/core');
 var escapeRegExp = require('../utils/escapeRegExp.js');
 require('react');
+require('../utils/useFloatingUI.js');
 require('./Highlighter.css.js');
 const withBaseName = core.makePrefixer("saltHighlighter");

package/dist-cjs/packages/lab/src/list/Highlighter.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Highlighter.js","sources":["../src/list/Highlighter.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { ReactElement } from \"react\";\nimport { escapeRegExp } from \"../utils\";\n\nimport \"./Highlighter.css\";\n\nconst withBaseName = makePrefixer(\"saltHighlighter\");\n\nexport interface HighlighterProps {\n matchPattern?: RegExp \| string;\n text?: string;\n}\n\nexport const Highlighter = (\n props: HighlighterProps\n): ReactElement<HighlighterProps> => {\n const { matchPattern, text = \"\" } = props;\n const matchRegex =\n typeof matchPattern === \"string\"\n ? new RegExp(`(${escapeRegExp(matchPattern)})`, \"gi\")\n : matchPattern;\n\n if (matchRegex === undefined) {\n return <>{text}</>;\n }\n return (\n <span>\n {text.split(matchRegex).map((part, index) =>\n part.match(matchRegex) ? (\n <strong\n className={withBaseName(\"highlight\")}\n key={`${index}-${part}`}\n >\n {part}\n </strong>\n ) : (\n part\n )\n )}\n </span>\n );\n};\n"],"names":["makePrefixer","escapeRegExp","jsx","Fragment"],"mappings":"~~;;;;;;;;;;~~AAMA,MAAM,YAAA,GAAeA,kBAAa,iBAAiB,CAAA,CAAA;AAOtC,MAAA,WAAA,GAAc,CACzB,KACmC,KAAA;AACnC,EAAA,MAAM,EAAE,YAAA,EAAc,IAAO,GAAA,EAAA,EAAO,GAAA,KAAA,CAAA;AACpC,EAAM,MAAA,UAAA,GACJ,OAAO,YAAA,KAAiB,QACpB,GAAA,IAAI,MAAO,CAAA,CAAA,CAAA,EAAIC,yBAAa,CAAA,YAAY,CAAM,CAAA,CAAA,CAAA,EAAA,IAAI,CAClD,GAAA,YAAA,CAAA;AAEN,EAAA,IAAI,eAAe,KAAW,CAAA,EAAA;AAC5B,IAAO,uBAAAC,cAAA,CAAAC,mBAAA,EAAA;AAAA,MAAG,QAAA,EAAA,IAAA;AAAA,KAAK,CAAA,CAAA;AAAA,GACjB;AACA,EAAA,uBACGD,cAAA,CAAA,MAAA,EAAA;AAAA,IACE,QAAA,EAAA,IAAA,CAAK,KAAM,CAAA,UAAU,CAAE,CAAA,GAAA;AAAA,MAAI,CAAC,IAAM,EAAA,KAAA,KACjC,KAAK,KAAM,CAAA,UAAU,oBAClBA,cAAA,CAAA,QAAA,EAAA;AAAA,QACC,SAAA,EAAW,aAAa,WAAW,CAAA;AAAA,QAGlC,QAAA,EAAA,IAAA;AAAA,OAFI,EAAA,CAAA,EAAG,KAAS,CAAA,CAAA,EAAA,IAAA,CAAA,CAGnB,CAEA,GAAA,IAAA;AAAA,KAEJ;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}
1	+ {"version":3,"file":"Highlighter.js","sources":["../src/list/Highlighter.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { ReactElement } from \"react\";\nimport { escapeRegExp } from \"../utils\";\n\nimport \"./Highlighter.css\";\n\nconst withBaseName = makePrefixer(\"saltHighlighter\");\n\nexport interface HighlighterProps {\n matchPattern?: RegExp \| string;\n text?: string;\n}\n\nexport const Highlighter = (\n props: HighlighterProps\n): ReactElement<HighlighterProps> => {\n const { matchPattern, text = \"\" } = props;\n const matchRegex =\n typeof matchPattern === \"string\"\n ? new RegExp(`(${escapeRegExp(matchPattern)})`, \"gi\")\n : matchPattern;\n\n if (matchRegex === undefined) {\n return <>{text}</>;\n }\n return (\n <span>\n {text.split(matchRegex).map((part, index) =>\n part.match(matchRegex) ? (\n <strong\n className={withBaseName(\"highlight\")}\n key={`${index}-${part}`}\n >\n {part}\n </strong>\n ) : (\n part\n )\n )}\n </span>\n );\n};\n"],"names":["makePrefixer","escapeRegExp","jsx","Fragment"],"mappings":";;;;;;;;;;;AAMA,MAAM,YAAA,GAAeA,kBAAa,iBAAiB,CAAA,CAAA;AAOtC,MAAA,WAAA,GAAc,CACzB,KACmC,KAAA;AACnC,EAAA,MAAM,EAAE,YAAA,EAAc,IAAO,GAAA,EAAA,EAAO,GAAA,KAAA,CAAA;AACpC,EAAM,MAAA,UAAA,GACJ,OAAO,YAAA,KAAiB,QACpB,GAAA,IAAI,MAAO,CAAA,CAAA,CAAA,EAAIC,yBAAa,CAAA,YAAY,CAAM,CAAA,CAAA,CAAA,EAAA,IAAI,CAClD,GAAA,YAAA,CAAA;AAEN,EAAA,IAAI,eAAe,KAAW,CAAA,EAAA;AAC5B,IAAO,uBAAAC,cAAA,CAAAC,mBAAA,EAAA;AAAA,MAAG,QAAA,EAAA,IAAA;AAAA,KAAK,CAAA,CAAA;AAAA,GACjB;AACA,EAAA,uBACGD,cAAA,CAAA,MAAA,EAAA;AAAA,IACE,QAAA,EAAA,IAAA,CAAK,KAAM,CAAA,UAAU,CAAE,CAAA,GAAA;AAAA,MAAI,CAAC,IAAM,EAAA,KAAA,KACjC,KAAK,KAAM,CAAA,UAAU,oBAClBA,cAAA,CAAA,QAAA,EAAA;AAAA,QACC,SAAA,EAAW,aAAa,WAAW,CAAA;AAAA,QAGlC,QAAA,EAAA,IAAA;AAAA,OAFI,EAAA,CAAA,EAAG,KAAS,CAAA,CAAA,EAAA,IAAA,CAAA,CAGnB,CAEA,GAAA,IAAA;AAAA,KAEJ;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}

package/dist-cjs/packages/lab/src/list/List.js CHANGED Viewed

@@ -13,6 +13,7 @@ var useCollectionItems = require('../common-hooks/useCollectionItems.js');
 var useImperativeScrollingAPI = require('../common-hooks/useImperativeScrollingAPI.js');
 var useKeyboardNavigation = require('../common-hooks/useKeyboardNavigation.js');
 require('../responsive/useResizeObserver.js');
+require('../utils/useFloatingUI.js');
 var isSelected = require('../common-hooks/utils/isSelected.js');
 var ListItem = require('./ListItem.js');
 var useList = require('./useList.js');