@neo4j-ndl/react 4.8.3 → 4.8.5

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 (100) hide show
  1. package/lib/cjs/accordion/Accordion.js +1 -1
  2. package/lib/cjs/accordion/Accordion.js.map +1 -1
  3. package/lib/cjs/ai/prompt/Prompt.js +1 -1
  4. package/lib/cjs/ai/prompt/Prompt.js.map +1 -1
  5. package/lib/cjs/ai/suggestion/Suggestion.js +1 -1
  6. package/lib/cjs/ai/suggestion/Suggestion.js.map +1 -1
  7. package/lib/cjs/breadcrumbs/Breadcrumbs.js +1 -1
  8. package/lib/cjs/breadcrumbs/Breadcrumbs.js.map +1 -1
  9. package/lib/cjs/breadcrumbs/stories/breadcrumbs-header.story.js +1 -1
  10. package/lib/cjs/breadcrumbs/stories/breadcrumbs-header.story.js.map +1 -1
  11. package/lib/cjs/color-picker/ColorPicker.js +1 -1
  12. package/lib/cjs/color-picker/ColorPicker.js.map +1 -1
  13. package/lib/cjs/date-picker/DatePicker.js +2 -2
  14. package/lib/cjs/date-picker/DatePicker.js.map +1 -1
  15. package/lib/cjs/graph-label/GraphLabel.js +5 -1
  16. package/lib/cjs/graph-label/GraphLabel.js.map +1 -1
  17. package/lib/cjs/inline-edit/InlineEdit.js +1 -1
  18. package/lib/cjs/inline-edit/InlineEdit.js.map +1 -1
  19. package/lib/cjs/select/Select.js +2 -1
  20. package/lib/cjs/select/Select.js.map +1 -1
  21. package/lib/cjs/select-icon-button/SelectIconButton.js +1 -1
  22. package/lib/cjs/select-icon-button/SelectIconButton.js.map +1 -1
  23. package/lib/cjs/side-navigation/SideNavigation.js +1 -1
  24. package/lib/cjs/side-navigation/SideNavigation.js.map +1 -1
  25. package/lib/cjs/tabs/Tabs.js +1 -1
  26. package/lib/cjs/tabs/Tabs.js.map +1 -1
  27. package/lib/cjs/text-area/TextArea.js +13 -1
  28. package/lib/cjs/text-area/TextArea.js.map +1 -1
  29. package/lib/cjs/text-input/TextInput.js +21 -3
  30. package/lib/cjs/text-input/TextInput.js.map +1 -1
  31. package/lib/cjs/timezone-picker/stories/timezone-picker-dst-aware.story.js +2 -2
  32. package/lib/cjs/timezone-picker/stories/timezone-picker-dst-aware.story.js.map +1 -1
  33. package/lib/cjs/tooltip/Tooltip.js +1 -1
  34. package/lib/cjs/tooltip/Tooltip.js.map +1 -1
  35. package/lib/cjs/tree-view/TreeItemWrapper.js +1 -1
  36. package/lib/cjs/tree-view/TreeItemWrapper.js.map +1 -1
  37. package/lib/cjs/tree-view/TreeViewTextItem.js +2 -2
  38. package/lib/cjs/tree-view/TreeViewTextItem.js.map +1 -1
  39. package/lib/cjs/tree-view/stories/treeview-custom.story.js +1 -1
  40. package/lib/cjs/tree-view/stories/treeview-custom.story.js.map +1 -1
  41. package/lib/esm/accordion/Accordion.js +1 -1
  42. package/lib/esm/accordion/Accordion.js.map +1 -1
  43. package/lib/esm/ai/prompt/Prompt.js +1 -1
  44. package/lib/esm/ai/prompt/Prompt.js.map +1 -1
  45. package/lib/esm/ai/suggestion/Suggestion.js +1 -1
  46. package/lib/esm/ai/suggestion/Suggestion.js.map +1 -1
  47. package/lib/esm/breadcrumbs/Breadcrumbs.js +1 -1
  48. package/lib/esm/breadcrumbs/Breadcrumbs.js.map +1 -1
  49. package/lib/esm/breadcrumbs/stories/breadcrumbs-header.story.js +1 -1
  50. package/lib/esm/breadcrumbs/stories/breadcrumbs-header.story.js.map +1 -1
  51. package/lib/esm/color-picker/ColorPicker.js +1 -1
  52. package/lib/esm/color-picker/ColorPicker.js.map +1 -1
  53. package/lib/esm/date-picker/DatePicker.js +2 -2
  54. package/lib/esm/date-picker/DatePicker.js.map +1 -1
  55. package/lib/esm/graph-label/GraphLabel.js +5 -1
  56. package/lib/esm/graph-label/GraphLabel.js.map +1 -1
  57. package/lib/esm/inline-edit/InlineEdit.js +1 -1
  58. package/lib/esm/inline-edit/InlineEdit.js.map +1 -1
  59. package/lib/esm/select/Select.js +2 -1
  60. package/lib/esm/select/Select.js.map +1 -1
  61. package/lib/esm/select-icon-button/SelectIconButton.js +1 -1
  62. package/lib/esm/select-icon-button/SelectIconButton.js.map +1 -1
  63. package/lib/esm/side-navigation/SideNavigation.js +1 -1
  64. package/lib/esm/side-navigation/SideNavigation.js.map +1 -1
  65. package/lib/esm/tabs/Tabs.js +1 -1
  66. package/lib/esm/tabs/Tabs.js.map +1 -1
  67. package/lib/esm/text-area/TextArea.js +14 -2
  68. package/lib/esm/text-area/TextArea.js.map +1 -1
  69. package/lib/esm/text-input/TextInput.js +21 -3
  70. package/lib/esm/text-input/TextInput.js.map +1 -1
  71. package/lib/esm/timezone-picker/stories/timezone-picker-dst-aware.story.js +2 -2
  72. package/lib/esm/timezone-picker/stories/timezone-picker-dst-aware.story.js.map +1 -1
  73. package/lib/esm/tooltip/Tooltip.js +1 -1
  74. package/lib/esm/tooltip/Tooltip.js.map +1 -1
  75. package/lib/esm/tree-view/TreeItemWrapper.js +1 -1
  76. package/lib/esm/tree-view/TreeItemWrapper.js.map +1 -1
  77. package/lib/esm/tree-view/TreeViewTextItem.js +2 -2
  78. package/lib/esm/tree-view/TreeViewTextItem.js.map +1 -1
  79. package/lib/esm/tree-view/stories/treeview-custom.story.js +1 -1
  80. package/lib/esm/tree-view/stories/treeview-custom.story.js.map +1 -1
  81. package/lib/types/accordion/Accordion.d.ts.map +1 -1
  82. package/lib/types/ai/prompt/Prompt.d.ts.map +1 -1
  83. package/lib/types/ai/suggestion/Suggestion.d.ts.map +1 -1
  84. package/lib/types/breadcrumbs/Breadcrumbs.d.ts.map +1 -1
  85. package/lib/types/breadcrumbs/stories/breadcrumbs-header.story.d.ts.map +1 -1
  86. package/lib/types/date-picker/DatePicker.d.ts.map +1 -1
  87. package/lib/types/graph-label/GraphLabel.d.ts.map +1 -1
  88. package/lib/types/inline-edit/InlineEdit.d.ts.map +1 -1
  89. package/lib/types/select/Select.d.ts.map +1 -1
  90. package/lib/types/select-icon-button/SelectIconButton.d.ts.map +1 -1
  91. package/lib/types/side-navigation/SideNavigation.d.ts.map +1 -1
  92. package/lib/types/tabs/Tabs.d.ts.map +1 -1
  93. package/lib/types/text-area/TextArea.d.ts.map +1 -1
  94. package/lib/types/text-input/TextInput.d.ts.map +1 -1
  95. package/lib/types/timezone-picker/stories/timezone-picker-dst-aware.story.d.ts.map +1 -1
  96. package/lib/types/tooltip/Tooltip.d.ts.map +1 -1
  97. package/lib/types/tree-view/TreeItemWrapper.d.ts.map +1 -1
  98. package/lib/types/tree-view/TreeViewTextItem.d.ts.map +1 -1
  99. package/lib/types/tree-view/stories/treeview-custom.story.d.ts.map +1 -1
  100. package/package.json +2 -2
@@ -1 +1 @@
1
- {"version":3,"file":"SideNavigation.js","sourceRoot":"","sources":["../../../src/side-navigation/SideNavigation.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport {\n autoUpdate,\n Composite,\n CompositeItem,\n flip,\n FloatingFocusManager,\n FloatingList,\n FloatingPortal,\n offset,\n safePolygon,\n shift,\n useDismiss,\n useFloating,\n useFocus,\n useHover,\n useInteractions,\n useListItem,\n useListNavigation,\n useMergeRefs,\n useTransitionStyles,\n} from '@floating-ui/react';\nimport { tokens } from '@neo4j-ndl/base';\nimport classNames from 'classnames';\nimport type React from 'react';\nimport { useEffect, useId, useRef, useState } from 'react';\n\nimport { IconIndicatorWrapper } from '../_common/IconIndicatorWrapper';\nimport {\n type CommonProps,\n type PolymorphicCommonProps,\n} from '../_common/types';\nimport { CleanIconButton } from '../clean-icon-button';\nimport { ConditionalWrap } from '../conditional-wrap';\nimport { Divider } from '../divider';\nimport { ChevronRightIconOutline, PinIcon } from '../icons';\nimport { Tooltip } from '../tooltip';\nimport { Typography } from '../typography';\nimport {\n SideNavCategoryContext,\n SideNavContext,\n useSideNavCategoryContext,\n useSideNavContext,\n} from './side-navigation-context';\nimport {\n type CategoryHeaderProps,\n type CategoryItemProps,\n type ItemBadgeProps,\n type NavItemProps,\n type SideNavListItemProps,\n type SideNavProps,\n} from './side-navigation-types';\n\n/**\n * SideNav\n */\nconst SideNavComponent = ({\n children,\n className,\n style,\n htmlAttributes,\n isExpanded = false,\n shouldOverlayOnInteraction = true,\n ariaLabel,\n onPinButtonClick,\n expandedWidth,\n ref,\n ...restProps\n}: CommonProps<'div', SideNavProps>) => {\n const [isHovered, setIsHovered] = useState(false);\n const [hasFocusVisible, setHasFocusVisible] = useState(false);\n const [isCollapseTransitioning, setIsCollapseTransitioning] = useState(false);\n const collapseTransitionTimeoutRef = useRef<ReturnType<\n typeof setTimeout\n > | null>(null);\n\n const rootRef = useRef<HTMLDivElement>(null);\n\n const isFloatingExpanded =\n shouldOverlayOnInteraction && (!isHovered ? hasFocusVisible : true);\n\n const classes = classNames('ndl-side-nav', 'ndl-side-nav-root', className, {\n 'ndl-side-nav-collapsed':\n isExpanded !== true && shouldOverlayOnInteraction !== true,\n 'ndl-side-nav-expanded': isExpanded,\n });\n\n const innerClasses = classNames('ndl-side-nav-inner', {\n 'ndl-side-nav-collapsing': isCollapseTransitioning,\n 'ndl-side-nav-hover': isFloatingExpanded === true && isExpanded !== true,\n });\n\n const customStyle = {\n ...style,\n ...(Boolean(expandedWidth) && {\n '--side-nav-width-expanded':\n typeof expandedWidth === 'string'\n ? expandedWidth\n : `${expandedWidth}px`,\n }),\n };\n\n const mergedRef = useMergeRefs([ref, rootRef]);\n\n const collapseTransitionDuration = Number.parseInt(\n tokens.motion.duration.quick,\n 10,\n );\n\n useEffect(() => {\n return () => {\n if (collapseTransitionTimeoutRef.current !== null) {\n clearTimeout(collapseTransitionTimeoutRef.current);\n collapseTransitionTimeoutRef.current = null;\n }\n };\n }, []);\n\n return (\n <SideNavContext.Provider\n value={{\n isExpanded,\n isHovered: isFloatingExpanded, // needs refactoring\n onPinButtonClick,\n shouldOverlayOnInteraction,\n }}\n >\n <div\n className={classes}\n ref={mergedRef}\n style={customStyle}\n onMouseEnter={() => {\n if (collapseTransitionTimeoutRef.current !== null) {\n clearTimeout(collapseTransitionTimeoutRef.current);\n collapseTransitionTimeoutRef.current = null;\n }\n setIsCollapseTransitioning(false);\n setIsHovered(true);\n }}\n onMouseLeave={() => {\n const shouldDelayZIndexRemoval =\n shouldOverlayOnInteraction &&\n !isExpanded &&\n (isHovered || hasFocusVisible);\n setIsHovered(false);\n if (shouldDelayZIndexRemoval) {\n if (collapseTransitionTimeoutRef.current !== null) {\n clearTimeout(collapseTransitionTimeoutRef.current);\n }\n setIsCollapseTransitioning(true);\n collapseTransitionTimeoutRef.current = setTimeout(() => {\n collapseTransitionTimeoutRef.current = null;\n setIsCollapseTransitioning(false);\n }, collapseTransitionDuration);\n }\n }}\n onFocusCapture={() => {\n // Delay slightly to let Composite's focus management settle\n requestAnimationFrame(() => {\n const activeElement = document.activeElement;\n // Check if focus is inside and visible (using :focus-visible on the active element)\n if (\n activeElement instanceof HTMLElement &&\n rootRef.current !== null &&\n rootRef.current.contains(activeElement) &&\n activeElement.matches(':focus-visible')\n ) {\n // Update state after another frame to let focus fully settle\n // This updates the context for consumers without disrupting focus\n requestAnimationFrame(() => {\n setHasFocusVisible(true);\n });\n }\n });\n }}\n onBlurCapture={() => {\n // Small delay to check if focus moved to another element inside\n requestAnimationFrame(() => {\n const activeElement = document.activeElement;\n const isInsideNav =\n activeElement instanceof HTMLElement &&\n rootRef.current !== null &&\n rootRef.current.contains(activeElement);\n // Check if focus is in a portaled floating menu\n const isInsideFloatingMenu =\n activeElement instanceof HTMLElement &&\n activeElement.closest('.ndl-side-nav-popover') !== null;\n\n if (\n (isInsideNav || isInsideFloatingMenu) &&\n activeElement instanceof HTMLElement &&\n activeElement.matches(':focus-visible')\n ) {\n // Focus stayed inside with focus-visible\n setHasFocusVisible(true);\n } else {\n // Focus left - collapse\n setHasFocusVisible(false);\n }\n });\n }}\n {...restProps}\n {...htmlAttributes}\n >\n <div className={innerClasses}>\n {/** TODO v5: should the nav be the one that gets all the stuff spread on it? */}\n <nav className=\"ndl-side-nav-nav\" aria-label={ariaLabel}>\n <Composite\n as=\"ul\"\n aria-label={ariaLabel}\n role=\"menubar\"\n orientation=\"vertical\"\n aria-orientation=\"vertical\"\n className=\"ndl-side-nav-list\"\n loop={true}\n >\n {children}\n </Composite>\n </nav>\n {shouldOverlayOnInteraction === true && (\n <div className=\"ndl-side-nav-footer\">\n <PinButton />\n </div>\n )}\n </div>\n </div>\n </SideNavContext.Provider>\n );\n};\n\n/**\n * SideNavListItem\n */\nconst SideNavListItem = ({\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'li', SideNavListItemProps>) => {\n const classes = classNames('ndl-side-nav-list-item', className, {});\n\n return (\n <li\n role=\"none\"\n className={classes}\n style={style}\n ref={ref}\n {...restProps}\n {...htmlAttributes}\n >\n <SelectedIndicator />\n {children}\n </li>\n );\n};\n\n/**\n * NavItem\n */\nconst NavItem = <T extends React.ElementType = 'button'>({\n icon,\n label,\n trailingElement,\n isActive,\n className,\n style,\n htmlAttributes,\n as,\n badge,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, NavItemProps>) => {\n const { isExpanded, isHovered, shouldOverlayOnInteraction } =\n useSideNavContext();\n const categoryContext = useSideNavCategoryContext();\n const isInCategory = categoryContext !== null;\n\n const item = useListItem();\n const mergedRef = useMergeRefs([item.ref, ref]);\n\n const isActiveIndex = item.index === categoryContext?.activeIndex;\n\n const Component: React.ElementType = as ?? 'button';\n const classes = classNames('ndl-side-nav-nav-item', className, {\n 'ndl-active': isActive === true,\n });\n\n const Wrapper = isInCategory ? Component : CompositeItem;\n const componentProps = {\n className: classes,\n ref: mergedRef,\n role: 'menuitem',\n style: style,\n ...(isInCategory && {\n ...categoryContext?.getItemProps(),\n tabIndex: isActiveIndex ? 0 : -1,\n }),\n ...restProps,\n ...htmlAttributes,\n };\n const wrapperProps = isInCategory\n ? componentProps\n : {\n render: <Component {...componentProps} />,\n };\n\n return (\n <ConditionalWrap\n shouldWrap={\n isExpanded === false &&\n !shouldOverlayOnInteraction &&\n !isInCategory &&\n Boolean(label)\n }\n wrap={(children) => (\n <Tooltip\n type=\"simple\"\n placement=\"right\"\n hoverDelay={{ close: 0, open: shouldOverlayOnInteraction ? 100 : 0 }}\n >\n <Tooltip.Trigger hasButtonWrapper={true}>{children}</Tooltip.Trigger>\n <Tooltip.Content>{label}</Tooltip.Content>\n </Tooltip>\n )}\n >\n <Wrapper {...wrapperProps}>\n <div className=\"ndl-side-nav-item-inner\">\n {Boolean(icon) && (\n <div className=\"ndl-side-nav-item-leading-element\">\n <ConditionalWrap\n shouldWrap={Boolean(badge) && !isHovered && !isExpanded}\n wrap={(children) => (\n <IconIndicatorWrapper type={badge?.type ?? 'info'}>\n {children}\n </IconIndicatorWrapper>\n )}\n >\n {icon}\n </ConditionalWrap>\n </div>\n )}\n {Boolean(label) && (\n <Typography\n variant=\"body-medium\"\n as=\"div\"\n className=\"ndl-side-nav-item-label\"\n >\n {label}\n </Typography>\n )}\n {(Boolean(trailingElement) || Boolean(badge)) && (\n <div className=\"ndl-side-nav-item-trailing-element\">\n {trailingElement}\n {badge !== undefined && (\n <ItemBadge type={badge.type} number={badge.number} />\n )}\n </div>\n )}\n </div>\n </Wrapper>\n </ConditionalWrap>\n );\n};\n\n/**\n * CategoryItem\n */\nconst CategoryItem = ({\n children,\n icon,\n label,\n isActive,\n className,\n style,\n htmlAttributes,\n badge,\n isMenuOpen = false,\n ref,\n ...restProps\n}: CommonProps<'button', CategoryItemProps>) => {\n const floatingId = useId();\n const { isExpanded, isHovered, shouldOverlayOnInteraction } =\n useSideNavContext();\n const anchorRef = useRef<HTMLLIElement>(null);\n const [isOpen, setIsOpen] = useState(false);\n const [activeIndex, setActiveIndex] = useState<number | null>(null);\n const [isTooltipOpen, setIsTooltipOpen] = useState(false);\n const elementsRef = useRef<\n Array<HTMLButtonElement | HTMLAnchorElement | null>\n >([]);\n\n const classes = classNames('ndl-side-nav-category-item', className, {\n 'ndl-active': isActive === true,\n });\n\n // Floating UI setup\n const { refs, context } = useFloating({\n elements: {\n reference: anchorRef.current,\n },\n middleware: [\n offset(5),\n flip({ crossAxis: true, fallbackAxisSideDirection: 'end', padding: 5 }),\n shift({ padding: 5 }),\n ],\n onOpenChange: setIsOpen,\n open: isOpen || isMenuOpen,\n placement: 'right-start',\n strategy: 'fixed',\n whileElementsMounted: autoUpdate,\n });\n\n const dismiss = useDismiss(context, {\n referencePress: false,\n });\n const hover = useHover(context, {\n delay: { close: 130, open: 130 },\n handleClose: safePolygon({\n blockPointerEvents: false,\n requireIntent: false,\n }),\n });\n const focus = useFocus(context);\n const listNavigation = useListNavigation(context, {\n activeIndex: activeIndex,\n focusItemOnHover: false,\n focusItemOnOpen: false,\n listRef: elementsRef,\n loop: true,\n nested: true,\n onNavigate: setActiveIndex,\n openOnArrowKeyDown: false,\n });\n\n // Separate interactions: reference (no listNavigation), floating (with listNavigation)\n const refInteractions = useInteractions([dismiss, hover, focus]);\n const floatInteractions = useInteractions([dismiss, hover, listNavigation]);\n const { styles: transitionStyles } = useTransitionStyles(context, {\n duration: Number.parseInt(tokens.motion.duration.quick) ?? 0,\n });\n\n // Reset activeIndex when menu closes\n useEffect(() => {\n if (!context.open) {\n setActiveIndex(null);\n }\n }, [context.open]);\n\n const mergedRef = useMergeRefs([refs.setReference, ref]);\n\n return (\n <SideNavCategoryContext.Provider\n value={{\n activeIndex,\n getItemProps: floatInteractions.getItemProps,\n }}\n >\n <ConditionalWrap\n shouldWrap={\n isExpanded === false && !shouldOverlayOnInteraction && Boolean(label)\n }\n wrap={(children) => (\n <Tooltip\n type=\"simple\"\n placement=\"top\"\n hoverDelay={{\n close: 0,\n open: shouldOverlayOnInteraction ? 100 : 0,\n }}\n isOpen={isTooltipOpen}\n onOpenChange={setIsTooltipOpen}\n >\n <Tooltip.Trigger hasButtonWrapper={true}>\n {children}\n </Tooltip.Trigger>\n <Tooltip.Content className=\"ndl-side-nav ndl-side-nav-category-menu-tooltip-content\">\n {label}\n </Tooltip.Content>\n </Tooltip>\n )}\n >\n <CompositeItem\n render={\n <button\n {...refInteractions.getReferenceProps({\n className: classes,\n ref: mergedRef,\n style,\n ...restProps,\n ...htmlAttributes,\n })}\n // {...restProps}\n // {...htmlAttributes}\n role=\"menuitem\"\n aria-haspopup=\"menu\"\n aria-expanded={context.open}\n aria-controls={floatingId}\n onFocus={(e) => {\n // Only show tooltip on focus-visible (keyboard navigation)\n if (\n e.target instanceof HTMLElement &&\n e.target.matches(':focus-visible')\n ) {\n setIsTooltipOpen(true);\n }\n // Call original handler if exists\n const originalOnFocus = refInteractions.getReferenceProps({})\n .onFocus as\n | ((e: React.FocusEvent<HTMLButtonElement>) => void)\n | undefined;\n originalOnFocus?.(e);\n }}\n onBlur={(e) => {\n setIsTooltipOpen(false);\n // Call original handler if exists\n const originalOnBlur = refInteractions.getReferenceProps({})\n .onBlur as\n | ((e: React.FocusEvent<HTMLButtonElement>) => void)\n | undefined;\n originalOnBlur?.(e);\n }}\n onKeyDown={(e) => {\n if (e.key === 'ArrowRight') {\n // open and move focus into submenu\n setIsOpen(true);\n setActiveIndex(0);\n // Defer focusing first item (if needed) to next tick\n requestAnimationFrame(() => {\n const el = elementsRef.current[0];\n el?.focus();\n });\n e.preventDefault();\n }\n // ArrowDown/ArrowUp: let Composite handle top-level roving focus.\n }}\n />\n }\n >\n <div className=\"ndl-side-nav-item-inner\">\n {Boolean(icon) && (\n <div className=\"ndl-side-nav-item-leading-element\">\n <ConditionalWrap\n shouldWrap={Boolean(badge) && !isHovered && !isExpanded}\n wrap={(children) => (\n <IconIndicatorWrapper type={badge?.type ?? 'info'}>\n {children}\n </IconIndicatorWrapper>\n )}\n >\n {icon}\n </ConditionalWrap>\n </div>\n )}\n {Boolean(label) && (\n <Typography\n variant=\"body-medium\"\n as=\"div\"\n className=\"ndl-side-nav-item-label\"\n >\n {label}\n </Typography>\n )}\n <div className=\"ndl-side-nav-item-trailing-element\">\n {badge && <ItemBadge type={badge.type} number={badge.number} />}\n <ChevronRightIconOutline className=\"n-size-4 n-text-neutral-icon\" />\n </div>\n </div>\n {context.open && (\n <FloatingList elementsRef={elementsRef}>\n <FloatingPortal>\n <FloatingFocusManager\n context={context}\n modal={false}\n initialFocus={-1}\n returnFocus={true}\n closeOnFocusOut={true}\n guards={true}\n >\n <ul\n id={floatingId}\n ref={refs.setFloating}\n className=\"ndl-side-nav ndl-side-nav-popover ndl-side-nav-popover-list\"\n style={{\n ...context.floatingStyles,\n ...transitionStyles,\n }}\n {...floatInteractions.getFloatingProps()}\n role=\"menu\"\n >\n {children}\n </ul>\n </FloatingFocusManager>\n </FloatingPortal>\n </FloatingList>\n )}\n </CompositeItem>\n </ConditionalWrap>\n </SideNavCategoryContext.Provider>\n );\n};\n\n/**\n * CategoryHeader\n */\nconst CategoryHeader = ({\n children,\n className,\n ref,\n style,\n htmlAttributes,\n ...restProps\n}: CommonProps<'li', CategoryHeaderProps>) => {\n const { isExpanded, isHovered } = useSideNavContext();\n\n const classes = classNames('ndl-side-nav-category-header', className, {\n 'ndl-side-nav-category-header-expanded': isExpanded || isHovered,\n });\n\n return (\n <Typography\n ref={ref}\n variant=\"label\"\n as=\"li\"\n className={classes}\n htmlAttributes={{\n ...htmlAttributes,\n role: 'separator',\n }}\n style={style}\n {...restProps}\n >\n {isExpanded || isHovered ? children : <Divider />}\n </Typography>\n );\n};\n\n/**\n * SelectedIndicator\n */\nconst SelectedIndicator = () => {\n return <div className=\"ndl-side-nav-selected-indicator\" />;\n};\n\n/**\n * SideNavDivider\n */\nconst SideNavDivider = () => {\n return (\n <Divider\n orientation=\"horizontal\"\n className=\"ndl-side-nav-divider\"\n as=\"li\"\n />\n );\n};\n\n/**\n * ItemBadge\n */\nconst ItemBadge = ({\n number,\n type,\n ref,\n htmlAttributes,\n style,\n className,\n ...restProps\n}: CommonProps<'span', ItemBadgeProps>) => {\n useSideNavContext();\n\n const badgeClasses = classNames('ndl-side-nav-item-badge', className, {\n 'ndl-danger': type === 'danger',\n 'ndl-info': type === 'info',\n 'ndl-warning': type === 'warning',\n });\n\n return (\n <Typography\n as=\"span\"\n className={badgeClasses}\n variant=\"subheading-small\"\n htmlAttributes={{\n 'aria-label': `${number} notifications of type ${type}`,\n ...htmlAttributes,\n }}\n style={style}\n ref={ref}\n {...restProps}\n >\n {number}\n </Typography>\n );\n};\n\n/**\n * PinButton\n */\nconst PinButton = () => {\n const { isExpanded, shouldOverlayOnInteraction, onPinButtonClick } =\n useSideNavContext();\n\n const classes = classNames('ndl-side-nav-pin-button');\n\n if (!shouldOverlayOnInteraction) {\n return null;\n }\n\n return (\n <CleanIconButton\n onClick={onPinButtonClick}\n className={classes}\n description=\"Pin\"\n size=\"medium\"\n isActive={isExpanded}\n tooltipProps={{\n root: {\n autoUpdateOptions: {\n animationFrame: true,\n },\n placement: 'right',\n },\n }}\n >\n <PinIcon />\n </CleanIconButton>\n );\n};\n\nconst SideNavigation = Object.assign(SideNavComponent, {\n CategoryHeader: CategoryHeader,\n CategoryItem: CategoryItem,\n Divider: SideNavDivider,\n ItemBadge: ItemBadge,\n ListItem: SideNavListItem,\n NavItem,\n});\n\nexport { SideNavigation };\n"]}
1
+ {"version":3,"file":"SideNavigation.js","sourceRoot":"","sources":["../../../src/side-navigation/SideNavigation.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport {\n autoUpdate,\n Composite,\n CompositeItem,\n flip,\n FloatingFocusManager,\n FloatingList,\n FloatingPortal,\n offset,\n safePolygon,\n shift,\n useDismiss,\n useFloating,\n useFocus,\n useHover,\n useInteractions,\n useListItem,\n useListNavigation,\n useMergeRefs,\n useTransitionStyles,\n} from '@floating-ui/react';\nimport { tokens } from '@neo4j-ndl/base';\nimport classNames from 'classnames';\nimport type React from 'react';\nimport { useEffect, useId, useRef, useState } from 'react';\n\nimport { IconIndicatorWrapper } from '../_common/IconIndicatorWrapper';\nimport {\n type CommonProps,\n type PolymorphicCommonProps,\n} from '../_common/types';\nimport { CleanIconButton } from '../clean-icon-button';\nimport { ConditionalWrap } from '../conditional-wrap';\nimport { Divider } from '../divider';\nimport { ChevronRightIconOutline, PinIcon } from '../icons';\nimport { Tooltip } from '../tooltip';\nimport { Typography } from '../typography';\nimport {\n SideNavCategoryContext,\n SideNavContext,\n useSideNavCategoryContext,\n useSideNavContext,\n} from './side-navigation-context';\nimport {\n type CategoryHeaderProps,\n type CategoryItemProps,\n type ItemBadgeProps,\n type NavItemProps,\n type SideNavListItemProps,\n type SideNavProps,\n} from './side-navigation-types';\n\n/**\n * SideNav\n */\nconst SideNavComponent = ({\n children,\n className,\n style,\n htmlAttributes,\n isExpanded = false,\n shouldOverlayOnInteraction = true,\n ariaLabel,\n onPinButtonClick,\n expandedWidth,\n ref,\n ...restProps\n}: CommonProps<'div', SideNavProps>) => {\n const [isHovered, setIsHovered] = useState(false);\n const [hasFocusVisible, setHasFocusVisible] = useState(false);\n const [isCollapseTransitioning, setIsCollapseTransitioning] = useState(false);\n const collapseTransitionTimeoutRef = useRef<ReturnType<\n typeof setTimeout\n > | null>(null);\n\n const rootRef = useRef<HTMLDivElement>(null);\n\n const isFloatingExpanded =\n shouldOverlayOnInteraction && (!isHovered ? hasFocusVisible : true);\n\n const classes = classNames('ndl-side-nav', 'ndl-side-nav-root', className, {\n 'ndl-side-nav-collapsed':\n isExpanded !== true && shouldOverlayOnInteraction !== true,\n 'ndl-side-nav-expanded': isExpanded,\n });\n\n const innerClasses = classNames('ndl-side-nav-inner', {\n 'ndl-side-nav-collapsing': isCollapseTransitioning,\n 'ndl-side-nav-hover': isFloatingExpanded === true && isExpanded !== true,\n });\n\n const customStyle = {\n ...style,\n ...(Boolean(expandedWidth) && {\n '--side-nav-width-expanded':\n typeof expandedWidth === 'string'\n ? expandedWidth\n : `${expandedWidth}px`,\n }),\n };\n\n const mergedRef = useMergeRefs([ref, rootRef]);\n\n const collapseTransitionDuration = Number.parseInt(\n tokens.motion.duration.quick,\n 10,\n );\n\n useEffect(() => {\n return () => {\n if (collapseTransitionTimeoutRef.current !== null) {\n clearTimeout(collapseTransitionTimeoutRef.current);\n collapseTransitionTimeoutRef.current = null;\n }\n };\n }, []);\n\n return (\n <SideNavContext.Provider\n value={{\n isExpanded,\n isHovered: isFloatingExpanded, // needs refactoring\n onPinButtonClick,\n shouldOverlayOnInteraction,\n }}\n >\n <div\n className={classes}\n ref={mergedRef}\n style={customStyle}\n onMouseEnter={() => {\n if (collapseTransitionTimeoutRef.current !== null) {\n clearTimeout(collapseTransitionTimeoutRef.current);\n collapseTransitionTimeoutRef.current = null;\n }\n setIsCollapseTransitioning(false);\n setIsHovered(true);\n }}\n onMouseLeave={() => {\n const shouldDelayZIndexRemoval =\n shouldOverlayOnInteraction &&\n !isExpanded &&\n (isHovered || hasFocusVisible);\n setIsHovered(false);\n if (shouldDelayZIndexRemoval) {\n if (collapseTransitionTimeoutRef.current !== null) {\n clearTimeout(collapseTransitionTimeoutRef.current);\n }\n setIsCollapseTransitioning(true);\n collapseTransitionTimeoutRef.current = setTimeout(() => {\n collapseTransitionTimeoutRef.current = null;\n setIsCollapseTransitioning(false);\n }, collapseTransitionDuration);\n }\n }}\n onFocusCapture={() => {\n // Delay slightly to let Composite's focus management settle\n requestAnimationFrame(() => {\n const activeElement = document.activeElement;\n // Check if focus is inside and visible (using :focus-visible on the active element)\n if (\n activeElement instanceof HTMLElement &&\n rootRef.current !== null &&\n rootRef.current.contains(activeElement) &&\n activeElement.matches(':focus-visible')\n ) {\n // Update state after another frame to let focus fully settle\n // This updates the context for consumers without disrupting focus\n requestAnimationFrame(() => {\n setHasFocusVisible(true);\n });\n }\n });\n }}\n onBlurCapture={() => {\n // Small delay to check if focus moved to another element inside\n requestAnimationFrame(() => {\n const activeElement = document.activeElement;\n const isInsideNav =\n activeElement instanceof HTMLElement &&\n rootRef.current !== null &&\n rootRef.current.contains(activeElement);\n // Check if focus is in a portaled floating menu\n const isInsideFloatingMenu =\n activeElement instanceof HTMLElement &&\n activeElement.closest('.ndl-side-nav-popover') !== null;\n\n if (\n (isInsideNav || isInsideFloatingMenu) &&\n activeElement instanceof HTMLElement &&\n activeElement.matches(':focus-visible')\n ) {\n // Focus stayed inside with focus-visible\n setHasFocusVisible(true);\n } else {\n // Focus left - collapse\n setHasFocusVisible(false);\n }\n });\n }}\n {...restProps}\n {...htmlAttributes}\n >\n <div className={innerClasses}>\n {/** TODO v5: should the nav be the one that gets all the stuff spread on it? */}\n <nav className=\"ndl-side-nav-nav\" aria-label={ariaLabel}>\n <Composite\n as=\"ul\"\n aria-label={ariaLabel}\n role=\"menubar\"\n orientation=\"vertical\"\n aria-orientation=\"vertical\"\n className=\"ndl-side-nav-list\"\n loop={true}\n >\n {children}\n </Composite>\n </nav>\n {shouldOverlayOnInteraction === true && (\n <div className=\"ndl-side-nav-footer\">\n <PinButton />\n </div>\n )}\n </div>\n </div>\n </SideNavContext.Provider>\n );\n};\n\n/**\n * SideNavListItem\n */\nconst SideNavListItem = ({\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'li', SideNavListItemProps>) => {\n const classes = classNames('ndl-side-nav-list-item', className, {});\n\n return (\n <li\n role=\"none\"\n className={classes}\n style={style}\n ref={ref}\n {...restProps}\n {...htmlAttributes}\n >\n <SelectedIndicator />\n {children}\n </li>\n );\n};\n\n/**\n * NavItem\n */\nconst NavItem = <T extends React.ElementType = 'button'>({\n icon,\n label,\n trailingElement,\n isActive,\n className,\n style,\n htmlAttributes,\n as,\n badge,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, NavItemProps>) => {\n const { isExpanded, isHovered, shouldOverlayOnInteraction } =\n useSideNavContext();\n const categoryContext = useSideNavCategoryContext();\n const isInCategory = categoryContext !== null;\n\n const item = useListItem();\n const mergedRef = useMergeRefs([item.ref, ref]);\n\n const isActiveIndex = item.index === categoryContext?.activeIndex;\n\n const Component: React.ElementType = as ?? 'button';\n const classes = classNames('ndl-side-nav-nav-item', className, {\n 'ndl-active': isActive === true,\n });\n\n const Wrapper = isInCategory ? Component : CompositeItem;\n const componentProps = {\n className: classes,\n ref: mergedRef,\n role: 'menuitem',\n style: style,\n ...(isInCategory && {\n ...categoryContext?.getItemProps(),\n tabIndex: isActiveIndex ? 0 : -1,\n }),\n ...restProps,\n ...htmlAttributes,\n };\n const wrapperProps = isInCategory\n ? componentProps\n : {\n render: <Component {...componentProps} />,\n };\n\n return (\n <ConditionalWrap\n shouldWrap={\n isExpanded === false &&\n !shouldOverlayOnInteraction &&\n !isInCategory &&\n Boolean(label)\n }\n wrap={(children) => (\n <Tooltip\n type=\"simple\"\n placement=\"right\"\n hoverDelay={{ close: 0, open: shouldOverlayOnInteraction ? 100 : 0 }}\n >\n <Tooltip.Trigger hasButtonWrapper={true}>{children}</Tooltip.Trigger>\n <Tooltip.Content>{label}</Tooltip.Content>\n </Tooltip>\n )}\n >\n <Wrapper {...wrapperProps}>\n <div className=\"ndl-side-nav-item-inner\">\n {Boolean(icon) && (\n <div className=\"ndl-side-nav-item-leading-element\">\n <ConditionalWrap\n shouldWrap={Boolean(badge) && !isHovered && !isExpanded}\n wrap={(children) => (\n <IconIndicatorWrapper type={badge?.type ?? 'info'}>\n {children}\n </IconIndicatorWrapper>\n )}\n >\n {icon}\n </ConditionalWrap>\n </div>\n )}\n {Boolean(label) && (\n <Typography\n variant=\"body-medium\"\n as=\"div\"\n className=\"ndl-side-nav-item-label\"\n >\n {label}\n </Typography>\n )}\n {(Boolean(trailingElement) || Boolean(badge)) && (\n <div className=\"ndl-side-nav-item-trailing-element\">\n {trailingElement}\n {badge !== undefined && (\n <ItemBadge type={badge.type} number={badge.number} />\n )}\n </div>\n )}\n </div>\n </Wrapper>\n </ConditionalWrap>\n );\n};\n\n/**\n * CategoryItem\n */\nconst CategoryItem = ({\n children,\n icon,\n label,\n isActive,\n className,\n style,\n htmlAttributes,\n badge,\n isMenuOpen = false,\n ref,\n ...restProps\n}: CommonProps<'button', CategoryItemProps>) => {\n const floatingId = useId();\n const { isExpanded, isHovered, shouldOverlayOnInteraction } =\n useSideNavContext();\n const anchorRef = useRef<HTMLLIElement>(null);\n const [isOpen, setIsOpen] = useState(false);\n const [activeIndex, setActiveIndex] = useState<number | null>(null);\n const [isTooltipOpen, setIsTooltipOpen] = useState(false);\n const elementsRef = useRef<\n Array<HTMLButtonElement | HTMLAnchorElement | null>\n >([]);\n\n const classes = classNames('ndl-side-nav-category-item', className, {\n 'ndl-active': isActive === true,\n });\n\n // Floating UI setup\n const { refs, context } = useFloating({\n elements: {\n reference: anchorRef.current,\n },\n middleware: [\n offset(5),\n flip({ crossAxis: true, fallbackAxisSideDirection: 'end', padding: 5 }),\n shift({ padding: 5 }),\n ],\n onOpenChange: setIsOpen,\n open: isOpen || isMenuOpen,\n placement: 'right-start',\n strategy: 'fixed',\n whileElementsMounted: autoUpdate,\n });\n\n const dismiss = useDismiss(context, {\n referencePress: false,\n });\n const hover = useHover(context, {\n delay: { close: 130, open: 130 },\n handleClose: safePolygon({\n blockPointerEvents: false,\n requireIntent: false,\n }),\n });\n const focus = useFocus(context);\n const listNavigation = useListNavigation(context, {\n activeIndex: activeIndex,\n focusItemOnHover: false,\n focusItemOnOpen: false,\n listRef: elementsRef,\n loop: true,\n nested: true,\n onNavigate: setActiveIndex,\n openOnArrowKeyDown: false,\n });\n\n // Separate interactions: reference (no listNavigation), floating (with listNavigation)\n const refInteractions = useInteractions([dismiss, hover, focus]);\n const floatInteractions = useInteractions([dismiss, hover, listNavigation]);\n const { styles: transitionStyles } = useTransitionStyles(context, {\n duration: Number.parseInt(tokens.motion.duration.quick) ?? 0,\n });\n\n // Reset activeIndex when menu closes\n useEffect(() => {\n if (!context.open) {\n setActiveIndex(null);\n }\n }, [context.open]);\n\n const mergedRef = useMergeRefs([refs.setReference, ref]);\n\n return (\n <SideNavCategoryContext.Provider\n value={{\n activeIndex,\n getItemProps: floatInteractions.getItemProps,\n }}\n >\n <ConditionalWrap\n shouldWrap={\n isExpanded === false && !shouldOverlayOnInteraction && Boolean(label)\n }\n wrap={(children) => (\n <Tooltip\n type=\"simple\"\n placement=\"top\"\n hoverDelay={{\n close: 0,\n open: shouldOverlayOnInteraction ? 100 : 0,\n }}\n isOpen={isTooltipOpen}\n onOpenChange={setIsTooltipOpen}\n >\n <Tooltip.Trigger hasButtonWrapper={true}>\n {children}\n </Tooltip.Trigger>\n <Tooltip.Content className=\"ndl-side-nav ndl-side-nav-category-menu-tooltip-content\">\n {label}\n </Tooltip.Content>\n </Tooltip>\n )}\n >\n <CompositeItem\n render={\n <button\n type=\"button\"\n {...refInteractions.getReferenceProps({\n className: classes,\n ref: mergedRef,\n style,\n ...restProps,\n ...htmlAttributes,\n })}\n // {...restProps}\n // {...htmlAttributes}\n role=\"menuitem\"\n aria-haspopup=\"menu\"\n aria-expanded={context.open}\n aria-controls={floatingId}\n onFocus={(e) => {\n // Only show tooltip on focus-visible (keyboard navigation)\n if (\n e.target instanceof HTMLElement &&\n e.target.matches(':focus-visible')\n ) {\n setIsTooltipOpen(true);\n }\n // Call original handler if exists\n const originalOnFocus = refInteractions.getReferenceProps({})\n .onFocus as\n | ((e: React.FocusEvent<HTMLButtonElement>) => void)\n | undefined;\n originalOnFocus?.(e);\n }}\n onBlur={(e) => {\n setIsTooltipOpen(false);\n // Call original handler if exists\n const originalOnBlur = refInteractions.getReferenceProps({})\n .onBlur as\n | ((e: React.FocusEvent<HTMLButtonElement>) => void)\n | undefined;\n originalOnBlur?.(e);\n }}\n onKeyDown={(e) => {\n if (e.key === 'ArrowRight') {\n // open and move focus into submenu\n setIsOpen(true);\n setActiveIndex(0);\n // Defer focusing first item (if needed) to next tick\n requestAnimationFrame(() => {\n const el = elementsRef.current[0];\n el?.focus();\n });\n e.preventDefault();\n }\n // ArrowDown/ArrowUp: let Composite handle top-level roving focus.\n }}\n />\n }\n >\n <div className=\"ndl-side-nav-item-inner\">\n {Boolean(icon) && (\n <div className=\"ndl-side-nav-item-leading-element\">\n <ConditionalWrap\n shouldWrap={Boolean(badge) && !isHovered && !isExpanded}\n wrap={(children) => (\n <IconIndicatorWrapper type={badge?.type ?? 'info'}>\n {children}\n </IconIndicatorWrapper>\n )}\n >\n {icon}\n </ConditionalWrap>\n </div>\n )}\n {Boolean(label) && (\n <Typography\n variant=\"body-medium\"\n as=\"div\"\n className=\"ndl-side-nav-item-label\"\n >\n {label}\n </Typography>\n )}\n <div className=\"ndl-side-nav-item-trailing-element\">\n {badge && <ItemBadge type={badge.type} number={badge.number} />}\n <ChevronRightIconOutline className=\"n-size-4 n-text-neutral-icon\" />\n </div>\n </div>\n {context.open && (\n <FloatingList elementsRef={elementsRef}>\n <FloatingPortal>\n <FloatingFocusManager\n context={context}\n modal={false}\n initialFocus={-1}\n returnFocus={true}\n closeOnFocusOut={true}\n guards={true}\n >\n <ul\n id={floatingId}\n ref={refs.setFloating}\n className=\"ndl-side-nav ndl-side-nav-popover ndl-side-nav-popover-list\"\n style={{\n ...context.floatingStyles,\n ...transitionStyles,\n }}\n {...floatInteractions.getFloatingProps()}\n role=\"menu\"\n >\n {children}\n </ul>\n </FloatingFocusManager>\n </FloatingPortal>\n </FloatingList>\n )}\n </CompositeItem>\n </ConditionalWrap>\n </SideNavCategoryContext.Provider>\n );\n};\n\n/**\n * CategoryHeader\n */\nconst CategoryHeader = ({\n children,\n className,\n ref,\n style,\n htmlAttributes,\n ...restProps\n}: CommonProps<'li', CategoryHeaderProps>) => {\n const { isExpanded, isHovered } = useSideNavContext();\n\n const classes = classNames('ndl-side-nav-category-header', className, {\n 'ndl-side-nav-category-header-expanded': isExpanded || isHovered,\n });\n\n return (\n <Typography\n ref={ref}\n variant=\"label\"\n as=\"li\"\n className={classes}\n htmlAttributes={{\n ...htmlAttributes,\n role: 'separator',\n }}\n style={style}\n {...restProps}\n >\n {isExpanded || isHovered ? children : <Divider />}\n </Typography>\n );\n};\n\n/**\n * SelectedIndicator\n */\nconst SelectedIndicator = () => {\n return <div className=\"ndl-side-nav-selected-indicator\" />;\n};\n\n/**\n * SideNavDivider\n */\nconst SideNavDivider = () => {\n return (\n <Divider\n orientation=\"horizontal\"\n className=\"ndl-side-nav-divider\"\n as=\"li\"\n />\n );\n};\n\n/**\n * ItemBadge\n */\nconst ItemBadge = ({\n number,\n type,\n ref,\n htmlAttributes,\n style,\n className,\n ...restProps\n}: CommonProps<'span', ItemBadgeProps>) => {\n useSideNavContext();\n\n const badgeClasses = classNames('ndl-side-nav-item-badge', className, {\n 'ndl-danger': type === 'danger',\n 'ndl-info': type === 'info',\n 'ndl-warning': type === 'warning',\n });\n\n return (\n <Typography\n as=\"span\"\n className={badgeClasses}\n variant=\"subheading-small\"\n htmlAttributes={{\n 'aria-label': `${number} notifications of type ${type}`,\n ...htmlAttributes,\n }}\n style={style}\n ref={ref}\n {...restProps}\n >\n {number}\n </Typography>\n );\n};\n\n/**\n * PinButton\n */\nconst PinButton = () => {\n const { isExpanded, shouldOverlayOnInteraction, onPinButtonClick } =\n useSideNavContext();\n\n const classes = classNames('ndl-side-nav-pin-button');\n\n if (!shouldOverlayOnInteraction) {\n return null;\n }\n\n return (\n <CleanIconButton\n onClick={onPinButtonClick}\n className={classes}\n description=\"Pin\"\n size=\"medium\"\n isActive={isExpanded}\n tooltipProps={{\n root: {\n autoUpdateOptions: {\n animationFrame: true,\n },\n placement: 'right',\n },\n }}\n >\n <PinIcon />\n </CleanIconButton>\n );\n};\n\nconst SideNavigation = Object.assign(SideNavComponent, {\n CategoryHeader: CategoryHeader,\n CategoryItem: CategoryItem,\n Divider: SideNavDivider,\n ItemBadge: ItemBadge,\n ListItem: SideNavListItem,\n NavItem,\n});\n\nexport { SideNavigation };\n"]}
@@ -86,7 +86,7 @@ const ScrollButton = ({ direction, isVisible, onClick, onBackground, }) => {
86
86
  'ndl-scroll-item-hidden': !isVisible,
87
87
  'ndl-scroll-item-on-background-default': onBackground === 'default',
88
88
  'ndl-scroll-item-on-background-weak': onBackground === 'weak',
89
- }), children: (0, jsx_runtime_1.jsx)("button", { tabIndex: -1, className: "ndl-scroll-icon-wrapper", onClick: onClick, "aria-hidden": "true", children: (0, jsx_runtime_1.jsx)(Icon, { className: "ndl-scroll-icon" }) }) }));
89
+ }), children: (0, jsx_runtime_1.jsx)("button", { type: "button", tabIndex: -1, className: "ndl-scroll-icon-wrapper", onClick: onClick, "aria-hidden": "true", children: (0, jsx_runtime_1.jsx)(Icon, { className: "ndl-scroll-icon" }) }) }));
90
90
  };
91
91
  // oxlint-disable-next-line @typescript-eslint/no-explicit-any
92
92
  const TabsContext = react_2.default.createContext(null);
@@ -1 +1 @@
1
- {"version":3,"file":"Tabs.js","sourceRoot":"","sources":["../../../src/tabs/Tabs.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport { useMergeRefs } from '@floating-ui/react';\nimport classNames from 'classnames';\nimport React, {\n useCallback,\n useContext,\n useEffect,\n useRef,\n useState,\n} from 'react';\n\nimport {\n type CommonProps,\n type PolymorphicCommonProps,\n type TooltipObjectProps,\n} from '../_common/types';\nimport {\n ArrowLeftCircleIconOutline,\n ArrowRightCircleIconOutline,\n} from '../icons';\nimport { Tooltip } from '../tooltip';\nimport { Typography } from '../typography';\nimport { useTabsScrollOverflow } from './use-tabs-scroll-overflow';\n\n// Reusable scroll button component\nconst ScrollButton = ({\n direction,\n isVisible,\n onClick,\n onBackground,\n}: {\n direction: 'left' | 'right';\n isVisible: boolean;\n onClick: () => void;\n onBackground: React.ComponentProps<typeof TabsComponent>['onBackground'];\n}) => {\n const Icon =\n direction === 'left'\n ? ArrowLeftCircleIconOutline\n : ArrowRightCircleIconOutline;\n const positionClass =\n direction === 'left' ? 'ndl-scroll-left-item' : 'ndl-scroll-right-item';\n\n return (\n <div\n className={classNames('ndl-scroll-item', positionClass, {\n 'ndl-scroll-item-hidden': !isVisible,\n 'ndl-scroll-item-on-background-default': onBackground === 'default',\n 'ndl-scroll-item-on-background-weak': onBackground === 'weak',\n })}\n >\n <button\n tabIndex={-1}\n className=\"ndl-scroll-icon-wrapper\"\n onClick={onClick}\n aria-hidden=\"true\"\n >\n <Icon className=\"ndl-scroll-icon\" />\n </button>\n </div>\n );\n};\n\ntype TabId = string;\ntype Size = 'small' | 'large';\ntype Fill = 'underline' | 'filled';\n\ntype BaseTabsProps<T extends TabId> = {\n /** The currently active tabId */\n value: T;\n /** Callback function triggered when a new tab is selected */\n onChange: (e: T) => void;\n // TODO v5: add leadingVisual & trailingVisual props, to allow for children not to have flex (allowing text ellipsis). Also add a tooltip when ellipsing.\n /** The content dislayed in the tabs */\n children: React.ReactNode | string;\n /** The fill type of the tabs */\n fill?: Fill;\n /** The size of the tabs */\n size?: Size;\n /** What background the Tabs is placed on. This affects the gradient background of the scroll navigation buttons. */\n onBackground?: 'weak' | 'default';\n};\n\ntype TabsContextType<T extends TabId> = Required<\n Pick<BaseTabsProps<T>, 'fill' | 'size' | 'onChange' | 'value'>\n> & {\n registerTab: (tabId: T, ref: React.RefObject<HTMLElement | null>) => void;\n unregisterTab: (tabId: T) => void;\n scrollTabIntoView: (tabId: T) => void;\n firstTabId: T | null;\n isValuePresent: boolean;\n};\n\n// oxlint-disable-next-line @typescript-eslint/no-explicit-any\nconst TabsContext = React.createContext<TabsContextType<any> | null>(null);\n\nconst useTabsContext = () => {\n const context = useContext(TabsContext);\n\n if (context === null) {\n throw new Error('Tab used without context');\n }\n\n return context;\n};\n\nconst getTabPanelId = (tabId: TabId) => `tabpanel-${tabId}`;\n\nconst getGeneralTabClasses = (size: Size, fill: Fill) => {\n return {\n 'ndl-filled-tab': fill === 'filled',\n 'ndl-large': size === 'large',\n 'ndl-small': size === 'small',\n 'ndl-underline-tab': fill === 'underline',\n };\n};\n\nconst TabsComponent = <U extends TabId, T extends React.ElementType = 'div'>({\n children,\n size = 'large',\n fill = 'underline',\n onChange,\n value,\n onBackground = 'weak',\n className,\n style,\n as,\n htmlAttributes,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, BaseTabsProps<U>>) => {\n const tabRefs = useRef<Map<U, React.RefObject<HTMLElement | null>>>(\n new Map(),\n );\n const containerRef = useRef<HTMLElement>(null);\n const scrollContainerRef = useRef<HTMLDivElement>(null);\n const mergedRef = useMergeRefs([containerRef, ref]);\n const [firstTabId, setFirstTabId] = useState<U | null>(null);\n const [isValuePresent, setIsValuePresent] = useState(false);\n const valueRef = useRef(value);\n\n // Use the custom hook for scroll overflow behavior\n const { scrollState, scrollToNextItem, checkOverflow } =\n useTabsScrollOverflow(scrollContainerRef);\n\n useEffect(() => {\n valueRef.current = value;\n setIsValuePresent(tabRefs.current.has(value));\n }, [value]);\n\n const registerTab = useCallback(\n (tabId: U, tabRef: React.RefObject<HTMLElement | null>) => {\n tabRefs.current.set(tabId, tabRef);\n const first = tabRefs.current.keys().next().value ?? null;\n setFirstTabId((prev) => (prev === first ? prev : first));\n\n if (tabId === valueRef.current) {\n setIsValuePresent(true);\n }\n },\n [],\n );\n\n const unregisterTab = useCallback((tabId: U) => {\n tabRefs.current.delete(tabId);\n const first = tabRefs.current.keys().next().value ?? null;\n setFirstTabId((prev) => (prev === first ? prev : first));\n\n if (tabId === valueRef.current) {\n setIsValuePresent(false);\n }\n }, []);\n\n // Check overflow when children change\n useEffect(() => {\n checkOverflow();\n }, [checkOverflow, children]);\n\n const scrollTabIntoView = useCallback((tabId: U) => {\n const tabRef = tabRefs.current.get(tabId);\n const scrollContainer = scrollContainerRef.current;\n\n if (tabRef?.current && scrollContainer) {\n const tabRect = tabRef.current.getBoundingClientRect();\n const containerRect = scrollContainer.getBoundingClientRect();\n const containerCenter = containerRect.left + containerRect.width / 2;\n\n const targetScrollLeft =\n scrollContainer.scrollLeft +\n (tabRect.left - containerCenter + tabRect.width / 2);\n\n scrollContainer.scrollTo({\n behavior: 'smooth',\n left: targetScrollLeft,\n });\n }\n }, []);\n\n const handleKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.key !== 'ArrowLeft' && event.key !== 'ArrowRight') {\n return;\n }\n\n event.preventDefault();\n\n const tabIds = Array.from(tabRefs.current.keys());\n const focusedElement = document.activeElement;\n\n // Find the currently focused tab\n let currentIndex = -1;\n for (let i = 0; i < tabIds.length; i++) {\n const tabRef = tabRefs.current.get(tabIds[i]);\n if (tabRef?.current === focusedElement) {\n currentIndex = i;\n break;\n }\n }\n\n // If no tab is focused, focus the active tab. Or the first tab if the active tab is not present.\n if (currentIndex === -1) {\n const activeTabRef = tabRefs.current.get(value);\n if (activeTabRef?.current) {\n activeTabRef.current.focus();\n } else if (!isValuePresent && firstTabId !== null) {\n const firstTabRef = tabRefs.current.get(firstTabId);\n if (firstTabRef?.current) {\n firstTabRef.current.focus();\n }\n }\n return;\n }\n\n let nextIndex: number;\n\n if (event.key === 'ArrowRight') {\n nextIndex = currentIndex === tabIds.length - 1 ? 0 : currentIndex + 1;\n } else {\n nextIndex = currentIndex === 0 ? tabIds.length - 1 : currentIndex - 1;\n }\n\n const nextTabId = tabIds[nextIndex];\n const nextTabRef = tabRefs.current.get(nextTabId);\n\n if (nextTabRef?.current) {\n nextTabRef.current.focus();\n scrollTabIntoView(nextTabId);\n }\n },\n [value, scrollTabIntoView, firstTabId, isValuePresent],\n );\n\n const classes = classNames(\n 'ndl-tabs',\n getGeneralTabClasses(size, fill),\n className,\n );\n\n const Component: React.ElementType = as ?? 'div';\n\n return (\n <Component\n className={classes}\n style={style}\n role=\"tablist\"\n aria-orientation=\"horizontal\"\n onKeyDown={handleKeyDown}\n ref={mergedRef}\n {...restProps}\n {...htmlAttributes}\n >\n <ScrollButton\n direction=\"left\"\n isVisible={scrollState.isLeftVisible}\n onClick={() => scrollToNextItem('left')}\n onBackground={onBackground}\n />\n <ScrollButton\n direction=\"right\"\n isVisible={scrollState.isRightVisible}\n onClick={() => scrollToNextItem('right')}\n onBackground={onBackground}\n />\n <TabsContext.Provider\n value={{\n fill,\n firstTabId,\n isValuePresent,\n onChange,\n registerTab,\n scrollTabIntoView,\n size,\n unregisterTab,\n value,\n }}\n >\n <div className=\"ndl-tabs-container\" ref={scrollContainerRef}>\n {children}\n </div>\n </TabsContext.Provider>\n </Component>\n );\n};\n\nTabsComponent.displayName = 'Tabs';\n\ntype TabProps<T extends TabId> = {\n /** The id of the tab */\n id: T;\n /** The content of the tab */\n children: React.ReactNode | string;\n /** A string that will be shown as a tooltip when hovering over the button it also acts as an aria-label- {@link https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label} */\n description?: string;\n /** Props for the tooltip component. */\n tooltipProps?: TooltipObjectProps;\n /** Additional class name */\n className?: string;\n /** Whether the tab is disabled */\n isDisabled?: boolean;\n};\n\nconst TabsTab = <\n U extends TabId = TabId,\n T extends React.ElementType = 'button',\n>({\n children,\n id: tabId,\n isDisabled = false,\n className,\n description,\n tooltipProps,\n style,\n as,\n htmlAttributes,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, TabProps<U>>) => {\n const {\n size,\n fill,\n value,\n onChange,\n registerTab,\n unregisterTab,\n scrollTabIntoView,\n firstTabId,\n isValuePresent,\n } = useTabsContext();\n const internalRef = useRef<HTMLElement>(null);\n\n // Create a merged ref that handles both ref objects and ref functions\n const mergedRef = useMergeRefs([\n internalRef as React.RefObject<HTMLElement>,\n ref as React.RefObject<HTMLElement>,\n ]);\n\n // Register/unregister tab for keyboard navigation\n useEffect(() => {\n registerTab(tabId, internalRef);\n\n return () => {\n unregisterTab(tabId);\n };\n }, [tabId, registerTab, unregisterTab]);\n\n const baseClasses = classNames({\n ...getGeneralTabClasses(size, fill),\n 'ndl-disabled': isDisabled,\n 'ndl-selected': value === tabId,\n });\n\n const Component: React.ElementType = as ?? 'button';\n\n const classes = classNames('ndl-tab', baseClasses, className);\n\n // Only the active tab should be in the tab sequence initially\n // Other tabs can be focused via arrow keys but are not in tab sequence\n const tabIndex =\n value === tabId || (!isValuePresent && tabId === firstTabId) ? 0 : -1;\n\n return (\n <Tooltip\n type=\"simple\"\n {...tooltipProps?.root}\n isDisabled={description === undefined}\n >\n <Tooltip.Trigger {...tooltipProps?.trigger} hasButtonWrapper>\n <Component\n className={classes}\n style={style}\n onClick={() => {\n if (!isDisabled) {\n onChange(tabId);\n scrollTabIntoView(tabId);\n }\n }}\n role=\"tab\"\n id={tabId}\n aria-disabled={isDisabled}\n aria-label={description}\n aria-selected={value === tabId}\n aria-controls={getTabPanelId(tabId)}\n tabIndex={tabIndex}\n ref={mergedRef}\n {...restProps}\n {...htmlAttributes}\n >\n <span className=\"ndl-tab-content\">{children}</span>\n {fill === 'underline' && <span className=\"ndl-tab-underline\" />}\n </Component>\n </Tooltip.Trigger>\n <Tooltip.Content {...tooltipProps?.content}>\n {description}\n </Tooltip.Content>\n </Tooltip>\n );\n};\n\nTabsTab.displayName = 'Tabs.Tab';\n\ntype TabPanelProps = {\n /** The content displayed in the tab panel */\n children: React.ReactNode;\n /** The currently selected tabId. The tab is visible if the value is equal to the tabId */\n value: TabId;\n /** The id of the tab panel */\n tabId: TabId;\n /** Additional class name */\n className?: string;\n};\n\nconst TabsTabPanel = <T extends React.ElementType = 'div'>({\n as,\n children,\n value,\n tabId,\n style,\n className,\n htmlAttributes,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, TabPanelProps>) => {\n const Component: React.ElementType = as ?? 'div';\n\n return (\n <>\n {value === tabId ? (\n <Component\n role=\"tabpanel\"\n id={getTabPanelId(tabId)}\n aria-labelledby={tabId}\n style={style}\n className={classNames(className)}\n ref={ref}\n {...restProps}\n {...htmlAttributes}\n >\n {children}\n </Component>\n ) : null}\n </>\n );\n};\n\nTabsTabPanel.displayName = 'Tabs.TabPanel';\n\ntype TabBadgeProps = {\n /** The content of the badge */\n children: React.ReactNode;\n};\n\nconst TabBadge = ({\n children,\n ref,\n htmlAttributes,\n style,\n className,\n ...restProps\n}: CommonProps<'span', TabBadgeProps>) => {\n const classes = classNames('ndl-tab-badge', className);\n return (\n <Typography\n ref={ref}\n variant=\"subheading-small\"\n className={classes}\n style={style}\n htmlAttributes={htmlAttributes}\n {...restProps}\n >\n {children}\n </Typography>\n );\n};\n\nconst Tabs = Object.assign(TabsComponent, {\n Badge: TabBadge,\n Tab: TabsTab,\n TabPanel: TabsTabPanel,\n});\n\nexport { Tabs };\n"]}
1
+ {"version":3,"file":"Tabs.js","sourceRoot":"","sources":["../../../src/tabs/Tabs.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport { useMergeRefs } from '@floating-ui/react';\nimport classNames from 'classnames';\nimport React, {\n useCallback,\n useContext,\n useEffect,\n useRef,\n useState,\n} from 'react';\n\nimport {\n type CommonProps,\n type PolymorphicCommonProps,\n type TooltipObjectProps,\n} from '../_common/types';\nimport {\n ArrowLeftCircleIconOutline,\n ArrowRightCircleIconOutline,\n} from '../icons';\nimport { Tooltip } from '../tooltip';\nimport { Typography } from '../typography';\nimport { useTabsScrollOverflow } from './use-tabs-scroll-overflow';\n\n// Reusable scroll button component\nconst ScrollButton = ({\n direction,\n isVisible,\n onClick,\n onBackground,\n}: {\n direction: 'left' | 'right';\n isVisible: boolean;\n onClick: () => void;\n onBackground: React.ComponentProps<typeof TabsComponent>['onBackground'];\n}) => {\n const Icon =\n direction === 'left'\n ? ArrowLeftCircleIconOutline\n : ArrowRightCircleIconOutline;\n const positionClass =\n direction === 'left' ? 'ndl-scroll-left-item' : 'ndl-scroll-right-item';\n\n return (\n <div\n className={classNames('ndl-scroll-item', positionClass, {\n 'ndl-scroll-item-hidden': !isVisible,\n 'ndl-scroll-item-on-background-default': onBackground === 'default',\n 'ndl-scroll-item-on-background-weak': onBackground === 'weak',\n })}\n >\n <button\n type=\"button\"\n tabIndex={-1}\n className=\"ndl-scroll-icon-wrapper\"\n onClick={onClick}\n aria-hidden=\"true\"\n >\n <Icon className=\"ndl-scroll-icon\" />\n </button>\n </div>\n );\n};\n\ntype TabId = string;\ntype Size = 'small' | 'large';\ntype Fill = 'underline' | 'filled';\n\ntype BaseTabsProps<T extends TabId> = {\n /** The currently active tabId */\n value: T;\n /** Callback function triggered when a new tab is selected */\n onChange: (e: T) => void;\n // TODO v5: add leadingVisual & trailingVisual props, to allow for children not to have flex (allowing text ellipsis). Also add a tooltip when ellipsing.\n /** The content dislayed in the tabs */\n children: React.ReactNode | string;\n /** The fill type of the tabs */\n fill?: Fill;\n /** The size of the tabs */\n size?: Size;\n /** What background the Tabs is placed on. This affects the gradient background of the scroll navigation buttons. */\n onBackground?: 'weak' | 'default';\n};\n\ntype TabsContextType<T extends TabId> = Required<\n Pick<BaseTabsProps<T>, 'fill' | 'size' | 'onChange' | 'value'>\n> & {\n registerTab: (tabId: T, ref: React.RefObject<HTMLElement | null>) => void;\n unregisterTab: (tabId: T) => void;\n scrollTabIntoView: (tabId: T) => void;\n firstTabId: T | null;\n isValuePresent: boolean;\n};\n\n// oxlint-disable-next-line @typescript-eslint/no-explicit-any\nconst TabsContext = React.createContext<TabsContextType<any> | null>(null);\n\nconst useTabsContext = () => {\n const context = useContext(TabsContext);\n\n if (context === null) {\n throw new Error('Tab used without context');\n }\n\n return context;\n};\n\nconst getTabPanelId = (tabId: TabId) => `tabpanel-${tabId}`;\n\nconst getGeneralTabClasses = (size: Size, fill: Fill) => {\n return {\n 'ndl-filled-tab': fill === 'filled',\n 'ndl-large': size === 'large',\n 'ndl-small': size === 'small',\n 'ndl-underline-tab': fill === 'underline',\n };\n};\n\nconst TabsComponent = <U extends TabId, T extends React.ElementType = 'div'>({\n children,\n size = 'large',\n fill = 'underline',\n onChange,\n value,\n onBackground = 'weak',\n className,\n style,\n as,\n htmlAttributes,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, BaseTabsProps<U>>) => {\n const tabRefs = useRef<Map<U, React.RefObject<HTMLElement | null>>>(\n new Map(),\n );\n const containerRef = useRef<HTMLElement>(null);\n const scrollContainerRef = useRef<HTMLDivElement>(null);\n const mergedRef = useMergeRefs([containerRef, ref]);\n const [firstTabId, setFirstTabId] = useState<U | null>(null);\n const [isValuePresent, setIsValuePresent] = useState(false);\n const valueRef = useRef(value);\n\n // Use the custom hook for scroll overflow behavior\n const { scrollState, scrollToNextItem, checkOverflow } =\n useTabsScrollOverflow(scrollContainerRef);\n\n useEffect(() => {\n valueRef.current = value;\n setIsValuePresent(tabRefs.current.has(value));\n }, [value]);\n\n const registerTab = useCallback(\n (tabId: U, tabRef: React.RefObject<HTMLElement | null>) => {\n tabRefs.current.set(tabId, tabRef);\n const first = tabRefs.current.keys().next().value ?? null;\n setFirstTabId((prev) => (prev === first ? prev : first));\n\n if (tabId === valueRef.current) {\n setIsValuePresent(true);\n }\n },\n [],\n );\n\n const unregisterTab = useCallback((tabId: U) => {\n tabRefs.current.delete(tabId);\n const first = tabRefs.current.keys().next().value ?? null;\n setFirstTabId((prev) => (prev === first ? prev : first));\n\n if (tabId === valueRef.current) {\n setIsValuePresent(false);\n }\n }, []);\n\n // Check overflow when children change\n useEffect(() => {\n checkOverflow();\n }, [checkOverflow, children]);\n\n const scrollTabIntoView = useCallback((tabId: U) => {\n const tabRef = tabRefs.current.get(tabId);\n const scrollContainer = scrollContainerRef.current;\n\n if (tabRef?.current && scrollContainer) {\n const tabRect = tabRef.current.getBoundingClientRect();\n const containerRect = scrollContainer.getBoundingClientRect();\n const containerCenter = containerRect.left + containerRect.width / 2;\n\n const targetScrollLeft =\n scrollContainer.scrollLeft +\n (tabRect.left - containerCenter + tabRect.width / 2);\n\n scrollContainer.scrollTo({\n behavior: 'smooth',\n left: targetScrollLeft,\n });\n }\n }, []);\n\n const handleKeyDown = useCallback(\n (event: React.KeyboardEvent) => {\n if (event.key !== 'ArrowLeft' && event.key !== 'ArrowRight') {\n return;\n }\n\n event.preventDefault();\n\n const tabIds = Array.from(tabRefs.current.keys());\n const focusedElement = document.activeElement;\n\n // Find the currently focused tab\n let currentIndex = -1;\n for (let i = 0; i < tabIds.length; i++) {\n const tabRef = tabRefs.current.get(tabIds[i]);\n if (tabRef?.current === focusedElement) {\n currentIndex = i;\n break;\n }\n }\n\n // If no tab is focused, focus the active tab. Or the first tab if the active tab is not present.\n if (currentIndex === -1) {\n const activeTabRef = tabRefs.current.get(value);\n if (activeTabRef?.current) {\n activeTabRef.current.focus();\n } else if (!isValuePresent && firstTabId !== null) {\n const firstTabRef = tabRefs.current.get(firstTabId);\n if (firstTabRef?.current) {\n firstTabRef.current.focus();\n }\n }\n return;\n }\n\n let nextIndex: number;\n\n if (event.key === 'ArrowRight') {\n nextIndex = currentIndex === tabIds.length - 1 ? 0 : currentIndex + 1;\n } else {\n nextIndex = currentIndex === 0 ? tabIds.length - 1 : currentIndex - 1;\n }\n\n const nextTabId = tabIds[nextIndex];\n const nextTabRef = tabRefs.current.get(nextTabId);\n\n if (nextTabRef?.current) {\n nextTabRef.current.focus();\n scrollTabIntoView(nextTabId);\n }\n },\n [value, scrollTabIntoView, firstTabId, isValuePresent],\n );\n\n const classes = classNames(\n 'ndl-tabs',\n getGeneralTabClasses(size, fill),\n className,\n );\n\n const Component: React.ElementType = as ?? 'div';\n\n return (\n <Component\n className={classes}\n style={style}\n role=\"tablist\"\n aria-orientation=\"horizontal\"\n onKeyDown={handleKeyDown}\n ref={mergedRef}\n {...restProps}\n {...htmlAttributes}\n >\n <ScrollButton\n direction=\"left\"\n isVisible={scrollState.isLeftVisible}\n onClick={() => scrollToNextItem('left')}\n onBackground={onBackground}\n />\n <ScrollButton\n direction=\"right\"\n isVisible={scrollState.isRightVisible}\n onClick={() => scrollToNextItem('right')}\n onBackground={onBackground}\n />\n <TabsContext.Provider\n value={{\n fill,\n firstTabId,\n isValuePresent,\n onChange,\n registerTab,\n scrollTabIntoView,\n size,\n unregisterTab,\n value,\n }}\n >\n <div className=\"ndl-tabs-container\" ref={scrollContainerRef}>\n {children}\n </div>\n </TabsContext.Provider>\n </Component>\n );\n};\n\nTabsComponent.displayName = 'Tabs';\n\ntype TabProps<T extends TabId> = {\n /** The id of the tab */\n id: T;\n /** The content of the tab */\n children: React.ReactNode | string;\n /** A string that will be shown as a tooltip when hovering over the button it also acts as an aria-label- {@link https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label} */\n description?: string;\n /** Props for the tooltip component. */\n tooltipProps?: TooltipObjectProps;\n /** Additional class name */\n className?: string;\n /** Whether the tab is disabled */\n isDisabled?: boolean;\n};\n\nconst TabsTab = <\n U extends TabId = TabId,\n T extends React.ElementType = 'button',\n>({\n children,\n id: tabId,\n isDisabled = false,\n className,\n description,\n tooltipProps,\n style,\n as,\n htmlAttributes,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, TabProps<U>>) => {\n const {\n size,\n fill,\n value,\n onChange,\n registerTab,\n unregisterTab,\n scrollTabIntoView,\n firstTabId,\n isValuePresent,\n } = useTabsContext();\n const internalRef = useRef<HTMLElement>(null);\n\n // Create a merged ref that handles both ref objects and ref functions\n const mergedRef = useMergeRefs([\n internalRef as React.RefObject<HTMLElement>,\n ref as React.RefObject<HTMLElement>,\n ]);\n\n // Register/unregister tab for keyboard navigation\n useEffect(() => {\n registerTab(tabId, internalRef);\n\n return () => {\n unregisterTab(tabId);\n };\n }, [tabId, registerTab, unregisterTab]);\n\n const baseClasses = classNames({\n ...getGeneralTabClasses(size, fill),\n 'ndl-disabled': isDisabled,\n 'ndl-selected': value === tabId,\n });\n\n const Component: React.ElementType = as ?? 'button';\n\n const classes = classNames('ndl-tab', baseClasses, className);\n\n // Only the active tab should be in the tab sequence initially\n // Other tabs can be focused via arrow keys but are not in tab sequence\n const tabIndex =\n value === tabId || (!isValuePresent && tabId === firstTabId) ? 0 : -1;\n\n return (\n <Tooltip\n type=\"simple\"\n {...tooltipProps?.root}\n isDisabled={description === undefined}\n >\n <Tooltip.Trigger {...tooltipProps?.trigger} hasButtonWrapper>\n <Component\n className={classes}\n style={style}\n onClick={() => {\n if (!isDisabled) {\n onChange(tabId);\n scrollTabIntoView(tabId);\n }\n }}\n role=\"tab\"\n id={tabId}\n aria-disabled={isDisabled}\n aria-label={description}\n aria-selected={value === tabId}\n aria-controls={getTabPanelId(tabId)}\n tabIndex={tabIndex}\n ref={mergedRef}\n {...restProps}\n {...htmlAttributes}\n >\n <span className=\"ndl-tab-content\">{children}</span>\n {fill === 'underline' && <span className=\"ndl-tab-underline\" />}\n </Component>\n </Tooltip.Trigger>\n <Tooltip.Content {...tooltipProps?.content}>\n {description}\n </Tooltip.Content>\n </Tooltip>\n );\n};\n\nTabsTab.displayName = 'Tabs.Tab';\n\ntype TabPanelProps = {\n /** The content displayed in the tab panel */\n children: React.ReactNode;\n /** The currently selected tabId. The tab is visible if the value is equal to the tabId */\n value: TabId;\n /** The id of the tab panel */\n tabId: TabId;\n /** Additional class name */\n className?: string;\n};\n\nconst TabsTabPanel = <T extends React.ElementType = 'div'>({\n as,\n children,\n value,\n tabId,\n style,\n className,\n htmlAttributes,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, TabPanelProps>) => {\n const Component: React.ElementType = as ?? 'div';\n\n return (\n <>\n {value === tabId ? (\n <Component\n role=\"tabpanel\"\n id={getTabPanelId(tabId)}\n aria-labelledby={tabId}\n style={style}\n className={classNames(className)}\n ref={ref}\n {...restProps}\n {...htmlAttributes}\n >\n {children}\n </Component>\n ) : null}\n </>\n );\n};\n\nTabsTabPanel.displayName = 'Tabs.TabPanel';\n\ntype TabBadgeProps = {\n /** The content of the badge */\n children: React.ReactNode;\n};\n\nconst TabBadge = ({\n children,\n ref,\n htmlAttributes,\n style,\n className,\n ...restProps\n}: CommonProps<'span', TabBadgeProps>) => {\n const classes = classNames('ndl-tab-badge', className);\n return (\n <Typography\n ref={ref}\n variant=\"subheading-small\"\n className={classes}\n style={style}\n htmlAttributes={htmlAttributes}\n {...restProps}\n >\n {children}\n </Typography>\n );\n};\n\nconst Tabs = Object.assign(TabsComponent, {\n Badge: TabBadge,\n Tab: TabsTab,\n TabPanel: TabsTabPanel,\n});\n\nexport { Tabs };\n"]}
@@ -51,6 +51,8 @@ const tooltip_1 = require("../tooltip");
51
51
  */
52
52
  const TextArea = (_a) => {
53
53
  var { label, isFluid = false, errorText, helpText, isOptional = false, moreInformationText, size = 'medium', ariaLabel, tooltipProps, isDisabled = false, className, isReadOnly = false, style, value, placeholder, htmlAttributes, ref } = _a, restProps = __rest(_a, ["label", "isFluid", "errorText", "helpText", "isOptional", "moreInformationText", "size", "ariaLabel", "tooltipProps", "isDisabled", "className", "isReadOnly", "style", "value", "placeholder", "htmlAttributes", "ref"]);
54
+ const helpTextId = (0, react_1.useId)();
55
+ const errorTextId = (0, react_1.useId)();
54
56
  const containerWrappingClasses = (0, classnames_1.default)(`ndl-text-area ndl-type-text`, className, {
55
57
  'ndl-disabled': isDisabled,
56
58
  'ndl-has-error': errorText,
@@ -79,7 +81,17 @@ const TextArea = (_a) => {
79
81
  'ndl-information-icon-large': size === 'large',
80
82
  'ndl-information-icon-small': size === 'small' || size === 'medium',
81
83
  });
82
- return ((0, jsx_runtime_1.jsxs)("div", { className: containerWrappingClasses, children: [(0, jsx_runtime_1.jsxs)("label", { className: labelWrappingClasses, children: [(0, jsx_runtime_1.jsx)("div", { className: "ndl-text-area-wrapper", children: (0, jsx_runtime_1.jsx)("textarea", Object.assign({ disabled: isDisabled, ref: ref, "aria-label": ariaLabel, readOnly: isReadOnly, value: value, placeholder: placeholder, style: style }, restProps, htmlAttributes)) }), !hasEmptyLabelValue && ((0, jsx_runtime_1.jsxs)("div", { className: "ndl-text-area-wrapper", children: [(0, jsx_runtime_1.jsx)("span", { className: "ndl-text-area-label-text", children: label }), Boolean(moreInformationText) && ((0, jsx_runtime_1.jsxs)(tooltip_1.Tooltip, Object.assign({ type: "simple" }, tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.root, { children: [(0, jsx_runtime_1.jsx)(tooltip_1.Tooltip.Trigger, Object.assign({}, tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.trigger, { children: (0, jsx_runtime_1.jsx)("div", { className: informationIconClasses, "data-testid": "ndl-information-icon", children: (0, jsx_runtime_1.jsx)(icons_1.InformationCircleIconOutline, {}) }) })), (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip.Content, Object.assign({}, tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.content, { children: moreInformationText }))] }))), isOptional && ((0, jsx_runtime_1.jsx)("span", { className: "ndl-text-area-optional", children: "Optional" }))] }))] }), helpText && !errorText && ((0, jsx_runtime_1.jsx)("div", { className: "ndl-text-area-msg", children: helpText })), errorText && ((0, jsx_runtime_1.jsxs)("div", { className: "ndl-text-area-msg", children: [(0, jsx_runtime_1.jsx)("div", { className: "ndl-error-icon", children: (0, jsx_runtime_1.jsx)(icons_1.ExclamationCircleIconSolid, {}) }), (0, jsx_runtime_1.jsx)("div", { className: "ndl-error-text", children: errorText })] }))] }));
84
+ const combinedAriaDescribedby = (0, react_1.useMemo)(() => {
85
+ const ariaDescribedby = [];
86
+ if (helpText && !errorText) {
87
+ ariaDescribedby.push(helpTextId);
88
+ }
89
+ else if (errorText) {
90
+ ariaDescribedby.push(errorTextId);
91
+ }
92
+ return ariaDescribedby.join(' ');
93
+ }, [helpText, errorText, helpTextId, errorTextId]);
94
+ return ((0, jsx_runtime_1.jsxs)("div", { className: containerWrappingClasses, children: [(0, jsx_runtime_1.jsxs)("label", { className: labelWrappingClasses, children: [(0, jsx_runtime_1.jsx)("div", { className: "ndl-text-area-wrapper", children: (0, jsx_runtime_1.jsx)("textarea", Object.assign({ disabled: isDisabled, ref: ref, "aria-label": ariaLabel, readOnly: isReadOnly, value: value, placeholder: placeholder, style: style, "aria-describedby": combinedAriaDescribedby }, restProps, htmlAttributes)) }), !hasEmptyLabelValue && ((0, jsx_runtime_1.jsxs)("div", { className: "ndl-text-area-wrapper", children: [(0, jsx_runtime_1.jsx)("span", { className: "ndl-text-area-label-text", children: label }), Boolean(moreInformationText) && ((0, jsx_runtime_1.jsxs)(tooltip_1.Tooltip, Object.assign({ type: "simple" }, tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.root, { children: [(0, jsx_runtime_1.jsx)(tooltip_1.Tooltip.Trigger, Object.assign({}, tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.trigger, { children: (0, jsx_runtime_1.jsx)("div", { className: informationIconClasses, "data-testid": "ndl-information-icon", children: (0, jsx_runtime_1.jsx)(icons_1.InformationCircleIconOutline, {}) }) })), (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip.Content, Object.assign({}, tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.content, { children: moreInformationText }))] }))), isOptional && ((0, jsx_runtime_1.jsx)("span", { className: "ndl-text-area-optional", children: "Optional" }))] }))] }), helpText && !errorText && ((0, jsx_runtime_1.jsx)("div", { className: "ndl-text-area-msg", "aria-live": "polite", id: helpTextId, children: helpText })), errorText && ((0, jsx_runtime_1.jsxs)("div", { className: "ndl-text-area-msg", children: [(0, jsx_runtime_1.jsx)("div", { className: "ndl-error-icon", children: (0, jsx_runtime_1.jsx)(icons_1.ExclamationCircleIconSolid, {}) }), (0, jsx_runtime_1.jsx)("div", { className: "ndl-error-text", id: errorTextId, "aria-live": "polite", children: errorText })] }))] }));
83
95
  };
84
96
  exports.TextArea = TextArea;
85
97
  //# sourceMappingURL=TextArea.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"TextArea.js","sourceRoot":"","sources":["../../../src/text-area/TextArea.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,4DAAoC;AAEpC,iCAAgD;AAEhD,kDAA8E;AAM9E,4CAAwD;AACxD,oCAGkB;AAClB,wCAAqC;AA6DrC;;;;;;GAMG;AAEI,MAAM,QAAQ,GAAG,CAAC,EAmBgB,EAAE,EAAE;QAnBpB,EACvB,KAAK,EACL,OAAO,GAAG,KAAK,EACf,SAAS,EACT,QAAQ,EACR,UAAU,GAAG,KAAK,EAClB,mBAAmB,EACnB,IAAI,GAAG,QAAQ,EACf,SAAS,EACT,YAAY,EACZ,UAAU,GAAG,KAAK,EAClB,SAAS,EACT,UAAU,GAAG,KAAK,EAClB,KAAK,EACL,KAAK,EACL,WAAW,EACX,cAAc,EACd,GAAG,OAEoC,EADpC,SAAS,cAlBW,0NAmBxB,CADa;IAEZ,MAAM,wBAAwB,GAAG,IAAA,oBAAU,EACzC,6BAA6B,EAC7B,SAAS,EACT;QACE,cAAc,EAAE,UAAU;QAC1B,eAAe,EAAE,SAAS;QAC1B,cAAc,EAAE,SAAS;QACzB,uBAAuB,EAAE,SAAS;QAClC,WAAW,EAAE,IAAI,KAAK,OAAO;QAC7B,YAAY,EAAE,IAAI,KAAK,QAAQ;QAC/B,WAAW,EAAE,IAAI,KAAK,OAAO;KAC9B,CACF,CAAC;IAEF,MAAM,kBAAkB,GAAG,CAAC,KAAK,IAAI,KAAK,KAAK,EAAE,CAAC;IAElD,MAAM,oBAAoB,GAAG,IAAA,oBAAU,EAAC,qBAAqB,EAAE;QAC7D,WAAW,EAAE,OAAO;QACpB,wBAAwB,EAAE,kBAAkB;KAC7C,CAAC,CAAC;IAEH,MAAM,aAAa,GAAG,KAAK,IAAI,OAAO,KAAK,KAAK,QAAQ,CAAC;IACzD,MAAM,4BAA4B,GAAG,aAAa,IAAI,CAAC,SAAS,CAAC;IAEjE,IAAA,eAAO,EAAC,GAAG,EAAE;QACX,IAAI,CAAC,KAAK,IAAI,CAAC,SAAS,EAAE,CAAC;YACzB,IAAA,4BAAoB,EAClB,sLAAsL,CACvL,CAAC;QACJ,CAAC;QAED,IAAI,4BAA4B,EAAE,CAAC;YACjC,IAAA,4BAAoB,EAAC,kDAAuC,CAAC,CAAC;QAChE,CAAC;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,EAAE,4BAA4B,CAAC,CAAC,CAAC;IAErD,MAAM,sBAAsB,GAAG,IAAA,oBAAU,EAAC;QACxC,4BAA4B,EAAE,IAAI,KAAK,OAAO;QAC9C,4BAA4B,EAAE,IAAI,KAAK,OAAO,IAAI,IAAI,KAAK,QAAQ;KACpE,CAAC,CAAC;IAEH,OAAO,CACL,iCAAK,SAAS,EAAE,wBAAwB,aAGtC,mCAAO,SAAS,EAAE,oBAAoB,aACpC,gCAAK,SAAS,EAAC,uBAAuB,YACpC,mDACE,QAAQ,EAAE,UAAU,EACpB,GAAG,EAAE,GAAG,gBACI,SAAS,EACrB,QAAQ,EAAE,UAAU,EACpB,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,EACxB,KAAK,EAAE,KAAK,IACR,SAAS,EACT,cAAc,EAClB,GACE,EACL,CAAC,kBAAkB,IAAI,CACtB,iCAAK,SAAS,EAAC,uBAAuB,aACpC,iCAAM,SAAS,EAAC,0BAA0B,YAAE,KAAK,GAAQ,EACxD,OAAO,CAAC,mBAAmB,CAAC,IAAI,CAC/B,wBAAC,iBAAO,kBAAC,IAAI,EAAC,QAAQ,IAAK,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,IAAI,eAC3C,uBAAC,iBAAO,CAAC,OAAO,oBAAK,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,OAAO,cACxC,gCACE,SAAS,EAAE,sBAAsB,iBACrB,sBAAsB,YAElC,uBAAC,oCAA4B,KAAG,GAC5B,IACU,EAClB,uBAAC,iBAAO,CAAC,OAAO,oBAAK,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,OAAO,cACvC,mBAAmB,IACJ,KACV,CACX,EACA,UAAU,IAAI,CACb,iCAAM,SAAS,EAAC,wBAAwB,yBAAgB,CACzD,IACG,CACP,IACK,EACP,QAAQ,IAAI,CAAC,SAAS,IAAI,CACzB,gCAAK,SAAS,EAAC,mBAAmB,YAAE,QAAQ,GAAO,CACpD,EACA,SAAS,IAAI,CACZ,iCAAK,SAAS,EAAC,mBAAmB,aAChC,gCAAK,SAAS,EAAC,gBAAgB,YAC7B,uBAAC,kCAA0B,KAAG,GAC1B,EACN,gCAAK,SAAS,EAAC,gBAAgB,YAAE,SAAS,GAAO,IAC7C,CACP,IACG,CACP,CAAC;AACJ,CAAC,CAAC;AApHW,QAAA,QAAQ,YAoHnB","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport classNames from 'classnames';\nimport type React from 'react';\nimport { type ReactNode, useMemo } from 'react';\n\nimport { customLabelAndNoAriaLabelWarningMessage } from '../_common/messages';\nimport {\n type CommonProps,\n type HtmlAttributes,\n type TooltipObjectProps,\n} from '../_common/types';\nimport { needleWarningMessage } from '../_common/utils';\nimport {\n ExclamationCircleIconSolid,\n InformationCircleIconOutline,\n} from '../icons';\nimport { Tooltip } from '../tooltip';\n\n/**\n *\n *\n * Types\n *\n *\n */\n\ntype TextAreaProps = {\n /** The label displayed above the textarea */\n label?: ReactNode;\n\n /** Whether the textarea should take the full available width */\n isFluid?: boolean;\n\n /** Assistive text displayed below the textarea */\n helpText?: string | ReactNode;\n\n /** Error message displayed below the textarea. When provided, it overrides `helpText` and shows an error icon */\n errorText?: string | ReactNode;\n\n /** Size of the textarea */\n size?: 'small' | 'medium' | 'large';\n\n // TODO v5: use isRequired and showRequiredOrOptionalLabel like in TextInput\n /** Whether to display the Optional label next to the field label */\n isOptional?: boolean;\n\n /** Text displayed in the information tooltip shown next to the label */\n moreInformationText?: React.ReactNode;\n\n /** Props for the Tooltip component used by the information icon */\n tooltipProps?: TooltipObjectProps;\n\n /** Whether the textarea is disabled */\n isDisabled?: boolean;\n\n /** Additional HTML attributes passed to the textarea element */\n htmlAttributes?: HtmlAttributes<'textarea'>;\n\n /** Aria label for accessibility when no visible label is provided */\n ariaLabel?: string;\n\n /** Additional class names */\n className?: string;\n\n /** Additional styles applied to the root element */\n style?: React.CSSProperties;\n\n /** Whether the textarea is read-only */\n isReadOnly?: boolean;\n\n /** The current value of the textarea */\n value?: React.ComponentPropsWithoutRef<'textarea'>['value'];\n\n /** Placeholder text displayed when the textarea is empty */\n placeholder?: React.ComponentPropsWithoutRef<'textarea'>['placeholder'];\n};\n\n/**\n *\n *\n * TextArea Component\n *\n *\n */\n\nexport const TextArea = ({\n label,\n isFluid = false,\n errorText,\n helpText,\n isOptional = false,\n moreInformationText,\n size = 'medium',\n ariaLabel,\n tooltipProps,\n isDisabled = false,\n className,\n isReadOnly = false,\n style,\n value,\n placeholder,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'textarea', TextAreaProps>) => {\n const containerWrappingClasses = classNames(\n `ndl-text-area ndl-type-text`,\n className,\n {\n 'ndl-disabled': isDisabled,\n 'ndl-has-error': errorText,\n 'ndl-has-icon': errorText,\n 'ndl-has-trailing-icon': errorText,\n 'ndl-large': size === 'large',\n 'ndl-medium': size === 'medium',\n 'ndl-small': size === 'small',\n },\n );\n\n const hasEmptyLabelValue = !label || label === '';\n\n const labelWrappingClasses = classNames('ndl-text-area-label', {\n 'ndl-fluid': isFluid,\n 'ndl-text-area-no-label': hasEmptyLabelValue,\n });\n\n const isCustomLabel = label && typeof label !== 'string';\n const hasCustomLabelAndNoAriaLabel = isCustomLabel && !ariaLabel;\n\n useMemo(() => {\n if (!label && !ariaLabel) {\n needleWarningMessage(\n 'A TextArea without a label does not have an aria label, be sure to include an aria label for screen readers link: https://dequeuniversity.com/rules/axe/4.2/label?application=axeAPI',\n );\n }\n\n if (hasCustomLabelAndNoAriaLabel) {\n needleWarningMessage(customLabelAndNoAriaLabelWarningMessage);\n }\n }, [label, ariaLabel, hasCustomLabelAndNoAriaLabel]);\n\n const informationIconClasses = classNames({\n 'ndl-information-icon-large': size === 'large',\n 'ndl-information-icon-small': size === 'small' || size === 'medium',\n });\n\n return (\n <div className={containerWrappingClasses}>\n {/* We enable implicit label wrapping */}\n {/* Source: https://dequeuniversity.com/rules/axe/4.2/label?application=axeAPI */}\n <label className={labelWrappingClasses}>\n <div className=\"ndl-text-area-wrapper\">\n <textarea\n disabled={isDisabled}\n ref={ref}\n aria-label={ariaLabel}\n readOnly={isReadOnly}\n value={value}\n placeholder={placeholder}\n style={style}\n {...restProps}\n {...htmlAttributes}\n />\n </div>\n {!hasEmptyLabelValue && (\n <div className=\"ndl-text-area-wrapper\">\n <span className=\"ndl-text-area-label-text\">{label}</span>\n {Boolean(moreInformationText) && (\n <Tooltip type=\"simple\" {...tooltipProps?.root}>\n <Tooltip.Trigger {...tooltipProps?.trigger}>\n <div\n className={informationIconClasses}\n data-testid=\"ndl-information-icon\"\n >\n <InformationCircleIconOutline />\n </div>\n </Tooltip.Trigger>\n <Tooltip.Content {...tooltipProps?.content}>\n {moreInformationText}\n </Tooltip.Content>\n </Tooltip>\n )}\n {isOptional && (\n <span className=\"ndl-text-area-optional\">Optional</span>\n )}\n </div>\n )}\n </label>\n {helpText && !errorText && (\n <div className=\"ndl-text-area-msg\">{helpText}</div>\n )}\n {errorText && (\n <div className=\"ndl-text-area-msg\">\n <div className=\"ndl-error-icon\">\n <ExclamationCircleIconSolid />\n </div>\n <div className=\"ndl-error-text\">{errorText}</div>\n </div>\n )}\n </div>\n );\n};\n"]}
1
+ {"version":3,"file":"TextArea.js","sourceRoot":"","sources":["../../../src/text-area/TextArea.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport classNames from 'classnames';\nimport type React from 'react';\nimport { type ReactNode, useId, useMemo } from 'react';\n\nimport { customLabelAndNoAriaLabelWarningMessage } from '../_common/messages';\nimport {\n type CommonProps,\n type HtmlAttributes,\n type TooltipObjectProps,\n} from '../_common/types';\nimport { needleWarningMessage } from '../_common/utils';\nimport {\n ExclamationCircleIconSolid,\n InformationCircleIconOutline,\n} from '../icons';\nimport { Tooltip } from '../tooltip';\n\n/**\n *\n *\n * Types\n *\n *\n */\n\ntype TextAreaProps = {\n /** The label displayed above the textarea */\n label?: ReactNode;\n\n /** Whether the textarea should take the full available width */\n isFluid?: boolean;\n\n /** Assistive text displayed below the textarea */\n helpText?: string | ReactNode;\n\n /** Error message displayed below the textarea. When provided, it overrides `helpText` and shows an error icon */\n errorText?: string | ReactNode;\n\n /** Size of the textarea */\n size?: 'small' | 'medium' | 'large';\n\n // TODO v5: use isRequired and showRequiredOrOptionalLabel like in TextInput\n /** Whether to display the Optional label next to the field label */\n isOptional?: boolean;\n\n /** Text displayed in the information tooltip shown next to the label */\n moreInformationText?: React.ReactNode;\n\n /** Props for the Tooltip component used by the information icon */\n tooltipProps?: TooltipObjectProps;\n\n /** Whether the textarea is disabled */\n isDisabled?: boolean;\n\n /** Additional HTML attributes passed to the textarea element */\n htmlAttributes?: HtmlAttributes<'textarea'>;\n\n /** Aria label for accessibility when no visible label is provided */\n ariaLabel?: string;\n\n /** Additional class names */\n className?: string;\n\n /** Additional styles applied to the root element */\n style?: React.CSSProperties;\n\n /** Whether the textarea is read-only */\n isReadOnly?: boolean;\n\n /** The current value of the textarea */\n value?: React.ComponentPropsWithoutRef<'textarea'>['value'];\n\n /** Placeholder text displayed when the textarea is empty */\n placeholder?: React.ComponentPropsWithoutRef<'textarea'>['placeholder'];\n};\n\n/**\n *\n *\n * TextArea Component\n *\n *\n */\n\nexport const TextArea = ({\n label,\n isFluid = false,\n errorText,\n helpText,\n isOptional = false,\n moreInformationText,\n size = 'medium',\n ariaLabel,\n tooltipProps,\n isDisabled = false,\n className,\n isReadOnly = false,\n style,\n value,\n placeholder,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'textarea', TextAreaProps>) => {\n const helpTextId = useId();\n const errorTextId = useId();\n const containerWrappingClasses = classNames(\n `ndl-text-area ndl-type-text`,\n className,\n {\n 'ndl-disabled': isDisabled,\n 'ndl-has-error': errorText,\n 'ndl-has-icon': errorText,\n 'ndl-has-trailing-icon': errorText,\n 'ndl-large': size === 'large',\n 'ndl-medium': size === 'medium',\n 'ndl-small': size === 'small',\n },\n );\n\n const hasEmptyLabelValue = !label || label === '';\n\n const labelWrappingClasses = classNames('ndl-text-area-label', {\n 'ndl-fluid': isFluid,\n 'ndl-text-area-no-label': hasEmptyLabelValue,\n });\n\n const isCustomLabel = label && typeof label !== 'string';\n const hasCustomLabelAndNoAriaLabel = isCustomLabel && !ariaLabel;\n\n useMemo(() => {\n if (!label && !ariaLabel) {\n needleWarningMessage(\n 'A TextArea without a label does not have an aria label, be sure to include an aria label for screen readers link: https://dequeuniversity.com/rules/axe/4.2/label?application=axeAPI',\n );\n }\n\n if (hasCustomLabelAndNoAriaLabel) {\n needleWarningMessage(customLabelAndNoAriaLabelWarningMessage);\n }\n }, [label, ariaLabel, hasCustomLabelAndNoAriaLabel]);\n\n const informationIconClasses = classNames({\n 'ndl-information-icon-large': size === 'large',\n 'ndl-information-icon-small': size === 'small' || size === 'medium',\n });\n\n const combinedAriaDescribedby = useMemo(() => {\n const ariaDescribedby = [];\n if (helpText && !errorText) {\n ariaDescribedby.push(helpTextId);\n } else if (errorText) {\n ariaDescribedby.push(errorTextId);\n }\n return ariaDescribedby.join(' ');\n }, [helpText, errorText, helpTextId, errorTextId]);\n\n return (\n <div className={containerWrappingClasses}>\n {/* We enable implicit label wrapping */}\n {/* Source: https://dequeuniversity.com/rules/axe/4.2/label?application=axeAPI */}\n <label className={labelWrappingClasses}>\n <div className=\"ndl-text-area-wrapper\">\n <textarea\n disabled={isDisabled}\n ref={ref}\n aria-label={ariaLabel}\n readOnly={isReadOnly}\n value={value}\n placeholder={placeholder}\n style={style}\n aria-describedby={combinedAriaDescribedby}\n {...restProps}\n {...htmlAttributes}\n />\n </div>\n {!hasEmptyLabelValue && (\n <div className=\"ndl-text-area-wrapper\">\n <span className=\"ndl-text-area-label-text\">{label}</span>\n {Boolean(moreInformationText) && (\n <Tooltip type=\"simple\" {...tooltipProps?.root}>\n <Tooltip.Trigger {...tooltipProps?.trigger}>\n <div\n className={informationIconClasses}\n data-testid=\"ndl-information-icon\"\n >\n <InformationCircleIconOutline />\n </div>\n </Tooltip.Trigger>\n <Tooltip.Content {...tooltipProps?.content}>\n {moreInformationText}\n </Tooltip.Content>\n </Tooltip>\n )}\n {isOptional && (\n <span className=\"ndl-text-area-optional\">Optional</span>\n )}\n </div>\n )}\n </label>\n {helpText && !errorText && (\n <div className=\"ndl-text-area-msg\" aria-live=\"polite\" id={helpTextId}>\n {helpText}\n </div>\n )}\n {errorText && (\n <div className=\"ndl-text-area-msg\">\n <div className=\"ndl-error-icon\">\n <ExclamationCircleIconSolid />\n </div>\n <div className=\"ndl-error-text\" id={errorTextId} aria-live=\"polite\">\n {errorText}\n </div>\n </div>\n )}\n </div>\n );\n};\n"]}
@@ -62,6 +62,8 @@ const TextInput = (_a) => {
62
62
  state: value !== null && value !== void 0 ? value : '',
63
63
  });
64
64
  const hintId = (0, react_1.useId)();
65
+ const helpTextId = (0, react_1.useId)();
66
+ const errorTextId = (0, react_1.useId)();
65
67
  const containerWrappingClasses = (0, classnames_1.default)(`ndl-text-input`, className, {
66
68
  'ndl-disabled': isDisabled,
67
69
  'ndl-has-error': errorText,
@@ -106,20 +108,36 @@ const TextInput = (_a) => {
106
108
  'ndl-information-icon-large': size === 'large',
107
109
  'ndl-information-icon-small': size === 'small' || size === 'medium',
108
110
  });
111
+ const combinedAriaDescribedby = (0, react_1.useMemo)(() => {
112
+ const ariaDescribedby = [hintId];
113
+ if (helpText && !errorText) {
114
+ ariaDescribedby.push(helpTextId);
115
+ }
116
+ else if (errorText) {
117
+ ariaDescribedby.push(errorTextId);
118
+ }
119
+ return ariaDescribedby.join(' ');
120
+ }, [hintId, helpText, errorText, helpTextId, errorTextId]);
109
121
  return ((0, jsx_runtime_1.jsxs)("div", { className: containerWrappingClasses, style: style, children: [(0, jsx_runtime_1.jsxs)("label", { className: labelWrappingClasses, children: [!hasEmptyLabelValue && ((0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, Object.assign({ onBackground: "weak", shape: "rectangular" }, skeletonProps, { isLoading: isSkeletonLoading, children: (0, jsx_runtime_1.jsxs)("div", { className: "ndl-label-text-wrapper", children: [(0, jsx_runtime_1.jsx)(typography_1.Typography, { variant: size === 'large' ? 'body-large' : 'body-medium', className: "ndl-label-text", children: label }), Boolean(moreInformationText) && ((0, jsx_runtime_1.jsxs)(tooltip_1.Tooltip, Object.assign({}, tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.root, { type: "simple", children: [(0, jsx_runtime_1.jsx)(tooltip_1.Tooltip.Trigger, Object.assign({}, tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.trigger, { className: informationIconClasses, hasButtonWrapper: true, children: (0, jsx_runtime_1.jsx)("div", { tabIndex: 0, role: "button", "aria-label": "Information icon", children: (0, jsx_runtime_1.jsx)(icons_1.InformationCircleIconOutline, {}) }) })), (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip.Content, Object.assign({}, tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.content, { children: moreInformationText }))] }))), showRequiredOrOptionalLabel && ((0, jsx_runtime_1.jsx)(typography_1.Typography, { variant: size === 'large' ? 'body-large' : 'body-medium', className: "ndl-form-item-optional", children: isRequired === true ? 'Required' : 'Optional' }))] }) }))), (0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, Object.assign({ onBackground: "weak", shape: "rectangular" }, skeletonProps, { isLoading: isSkeletonLoading, children: (0, jsx_runtime_1.jsxs)("div", { className: "ndl-input-wrapper", children: [(leadingElement || (isLoading && !trailingElement)) && ((0, jsx_runtime_1.jsx)("div", { className: "ndl-element-leading ndl-element", children: isLoading ? ((0, jsx_runtime_1.jsx)(loading_spinner_1.LoadingSpinner, { size: size === 'large' ? 'medium' : 'small', className: size === 'large'
110
122
  ? 'ndl-medium-spinner'
111
123
  : 'ndl-small-spinner' })) : (leadingElement) })), (0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)('ndl-input-container', {
112
124
  'ndl-clearable': isClearable,
113
- }), children: [(0, jsx_runtime_1.jsx)("input", Object.assign({ ref: ref, readOnly: isReadOnly, disabled: isDisabled, required: isRequired, value: internalState, placeholder: placeholder, type: "text", onChange: internalOnChange, "aria-describedby": shouldRenderHint ? hintId : undefined }, combinedHtmlInputAttributes, { onKeyDown: handleInputKeyDown }, restProps)), shouldRenderHint && ((0, jsx_runtime_1.jsxs)("span", { id: hintId, className: "ndl-text-input-hint", children: [isLoading && 'Loading ', isClearable && 'Press Escape to clear input.'] })), isClearable && Boolean(internalState) && ((0, jsx_runtime_1.jsx)("div", { className: "ndl-element-clear ndl-element", children: (0, jsx_runtime_1.jsx)("button", { tabIndex: -1, "aria-hidden": true, type: "button", title: "Clear input (Esc)", onClick: () => {
125
+ }), children: [(0, jsx_runtime_1.jsx)("input", Object.assign({ ref: ref, readOnly: isReadOnly, disabled: isDisabled, required: isRequired, value: internalState, placeholder: placeholder, type: "text", onChange: internalOnChange, "aria-describedby": combinedAriaDescribedby }, combinedHtmlInputAttributes, { onKeyDown: handleInputKeyDown }, restProps)), shouldRenderHint && ((0, jsx_runtime_1.jsxs)("span", { id: hintId, className: "ndl-text-input-hint", "aria-hidden": true, children: [isLoading && 'Loading ', isClearable && 'Press Escape to clear input.'] })), isClearable && Boolean(internalState) && ((0, jsx_runtime_1.jsx)("div", { className: "ndl-element-clear ndl-element", children: (0, jsx_runtime_1.jsx)("button", { tabIndex: -1, "aria-hidden": true, type: "button", title: "Clear input (Esc)", onClick: () => {
114
126
  internalOnChange === null || internalOnChange === void 0 ? void 0 : internalOnChange({
115
127
  target: { value: '' },
116
128
  });
117
129
  }, children: (0, jsx_runtime_1.jsx)(icons_1.XMarkIconOutline, { className: "n-size-4" }) }) }))] }), trailingElement && ((0, jsx_runtime_1.jsx)("div", { className: "ndl-element-trailing ndl-element", children: isLoading && !leadingElement ? ((0, jsx_runtime_1.jsx)(loading_spinner_1.LoadingSpinner, { size: size === 'large' ? 'medium' : 'small', className: size === 'large'
118
130
  ? 'ndl-medium-spinner'
119
- : 'ndl-small-spinner' })) : (trailingElement) }))] }) }))] }), Boolean(helpText) && !errorText && ((0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { onBackground: "weak", shape: "rectangular", isLoading: isSkeletonLoading, children: (0, jsx_runtime_1.jsx)(typography_1.Typography, { variant: size === 'large' ? 'body-medium' : 'body-small', className: "ndl-form-message", children: helpText }) })), Boolean(errorText) && (
131
+ : 'ndl-small-spinner' })) : (trailingElement) }))] }) }))] }), Boolean(helpText) && !errorText && ((0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { onBackground: "weak", shape: "rectangular", isLoading: isSkeletonLoading, children: (0, jsx_runtime_1.jsx)(typography_1.Typography, { variant: size === 'large' ? 'body-medium' : 'body-small', className: "ndl-form-message", htmlAttributes: {
132
+ 'aria-live': 'polite',
133
+ id: helpTextId,
134
+ }, children: helpText }) })), Boolean(errorText) && (
120
135
  // TODO v4: We might want to have a min width for the container for the messages to help skeleton loading.
121
136
  // Currently the message fills 100% of the width while the rest of the text input has a set width.
122
- (0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, Object.assign({ onBackground: "weak", shape: "rectangular", width: "fit-content" }, skeletonProps, { isLoading: isSkeletonLoading, children: (0, jsx_runtime_1.jsxs)("div", { className: "ndl-form-message", children: [(0, jsx_runtime_1.jsx)("div", { className: "ndl-error-icon", children: (0, jsx_runtime_1.jsx)(icons_1.ExclamationCircleIconSolid, {}) }), (0, jsx_runtime_1.jsx)(typography_1.Typography, { className: "ndl-error-text", variant: size === 'large' ? 'body-medium' : 'body-small', children: errorText })] }) })))] }));
137
+ (0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, Object.assign({ onBackground: "weak", shape: "rectangular", width: "fit-content" }, skeletonProps, { isLoading: isSkeletonLoading, children: (0, jsx_runtime_1.jsxs)("div", { className: "ndl-form-message", children: [(0, jsx_runtime_1.jsx)("div", { className: "ndl-error-icon", children: (0, jsx_runtime_1.jsx)(icons_1.ExclamationCircleIconSolid, {}) }), (0, jsx_runtime_1.jsx)(typography_1.Typography, { className: "ndl-error-text", variant: size === 'large' ? 'body-medium' : 'body-small', htmlAttributes: {
138
+ 'aria-live': 'polite',
139
+ id: errorTextId,
140
+ }, children: errorText })] }) })))] }));
123
141
  };
124
142
  exports.TextInput = TextInput;
125
143
  //# sourceMappingURL=TextInput.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"TextInput.js","sourceRoot":"","sources":["../../../src/text-input/TextInput.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,4DAAoC;AACpC,iCAMe;AAEf,kDAA8E;AAE9E,oFAA8E;AAC9E,4CAAwD;AACxD,oCAIkB;AAClB,wDAAoD;AACpD,0CAAuC;AACvC,wCAAqC;AACrC,8CAA2C;AAoE3C;;;;;;GAMG;AAEI,MAAM,SAAS,GAAG,CAAC,EA0Ba,EAAE,EAAE;QA1BjB,EACxB,KAAK,EACL,OAAO,EACP,SAAS,EACT,QAAQ,EACR,cAAc,EACd,eAAe,EACf,2BAA2B,GAAG,KAAK,EACnC,mBAAmB,EACnB,IAAI,GAAG,QAAQ,EACf,WAAW,EACX,KAAK,EACL,YAAY,EACZ,cAAc,EACd,UAAU,EACV,UAAU,EACV,UAAU,EACV,QAAQ,EACR,WAAW,GAAG,KAAK,EACnB,SAAS,EACT,KAAK,EACL,iBAAiB,GAAG,KAAK,EACzB,SAAS,GAAG,KAAK,EACjB,aAAa,EACb,GAAG,OAEkC,EADlC,SAAS,cAzBY,+VA0BzB,CADa;IAEZ,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,IAAA,kDAAsB,EAAC;QAC/D,SAAS,EAAE,MAAM;QACjB,YAAY,EAAE,KAAK,KAAK,SAAS;QACjC,QAAQ;QACR,KAAK,EAAE,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,EAAE;KACnB,CAAC,CAAC;IACH,MAAM,MAAM,GAAG,IAAA,aAAK,GAAE,CAAC;IAEvB,MAAM,wBAAwB,GAAG,IAAA,oBAAU,EAAC,gBAAgB,EAAE,SAAS,EAAE;QACvE,cAAc,EAAE,UAAU;QAC1B,eAAe,EAAE,SAAS;QAC1B,cAAc,EAAE,cAAc,IAAI,eAAe,IAAI,SAAS;QAC9D,sBAAsB,EAAE,cAAc;QACtC,uBAAuB,EAAE,eAAe,IAAI,SAAS;QACrD,WAAW,EAAE,IAAI,KAAK,OAAO;QAC7B,YAAY,EAAE,IAAI,KAAK,QAAQ;QAC/B,eAAe,EAAE,UAAU;QAC3B,WAAW,EAAE,IAAI,KAAK,OAAO;KAC9B,CAAC,CAAC;IAEH,MAAM,kBAAkB,GACtB,KAAK,KAAK,SAAS,IAAI,KAAK,KAAK,IAAI,IAAI,KAAK,KAAK,EAAE,CAAC;IAExD,MAAM,oBAAoB,GAAG,IAAA,oBAAU,EAAC,qBAAqB,EAAE;QAC7D,WAAW,EAAE,OAAO;QACpB,wBAAwB,EAAE,kBAAkB;KAC7C,CAAC,CAAC;IAEH,MAAM,2BAA2B,mCAC5B,cAAc,KACjB,SAAS,EAAE,IAAA,oBAAU,EAAC,WAAW,EAAE,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,SAAS,CAAC,GAC9D,CAAC;IACF,MAAM,SAAS,GAAG,2BAA2B,CAAC,YAAY,CAAC,CAAC;IAC5D,MAAM,aAAa,GAAG,OAAO,CAAC,KAAK,CAAC,IAAI,OAAO,KAAK,KAAK,QAAQ,CAAC;IAClE,MAAM,4BAA4B,GAChC,aAAa,IAAI,CAAC,SAAS,KAAK,SAAS,IAAI,SAAS,KAAK,EAAE,CAAC,CAAC;IACjE,MAAM,gBAAgB,GAAG,WAAW,IAAI,SAAS,CAAC;IAElD,MAAM,kBAAkB,GAAG,CAAC,KAA4C,EAAE,EAAE;;QAC1E,IAAI,WAAW,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,IAAI,OAAO,CAAC,aAAa,CAAC,EAAE,CAAC;YACpE,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,KAAK,CAAC,eAAe,EAAE,CAAC;YACxB,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAG;gBACjB,MAAM,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE;aACiB,CAAC,CAAC;QAC5C,CAAC;QACD,MAAA,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,SAAS,+DAAG,KAAK,CAAC,CAAC;IACrC,CAAC,CAAC;IAEF,IAAA,eAAO,EAAC,GAAG,EAAE;QACX,IAAI,CAAC,KAAK,IAAI,CAAC,SAAS,EAAE,CAAC;YACzB,IAAA,4BAAoB,EAClB,wLAAwL,CACzL,CAAC;QACJ,CAAC;QAED,IAAI,4BAA4B,EAAE,CAAC;YACjC,IAAA,4BAAoB,EAAC,kDAAuC,CAAC,CAAC;QAChE,CAAC;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,EAAE,4BAA4B,CAAC,CAAC,CAAC;IAErD,MAAM,sBAAsB,GAAG,IAAA,oBAAU,EAAC;QACxC,4BAA4B,EAAE,IAAI,KAAK,OAAO;QAC9C,4BAA4B,EAAE,IAAI,KAAK,OAAO,IAAI,IAAI,KAAK,QAAQ;KACpE,CAAC,CAAC;IAEH,OAAO,CACL,iCAAK,SAAS,EAAE,wBAAwB,EAAE,KAAK,EAAE,KAAK,aAGpD,mCAAO,SAAS,EAAE,oBAAoB,aACnC,CAAC,kBAAkB,IAAI,CACtB,uBAAC,mBAAQ,kBACP,YAAY,EAAC,MAAM,EACnB,KAAK,EAAC,aAAa,IACf,aAAa,IACjB,SAAS,EAAE,iBAAiB,YAE5B,iCAAK,SAAS,EAAC,wBAAwB,aACrC,uBAAC,uBAAU,IACT,OAAO,EAAE,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,aAAa,EACxD,SAAS,EAAC,gBAAgB,YAEzB,KAAK,GACK,EACZ,OAAO,CAAC,mBAAmB,CAAC,IAAI,CAC/B,wBAAC,iBAAO,oBAAK,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,IAAI,IAAE,IAAI,EAAC,QAAQ,aAC5C,uBAAC,iBAAO,CAAC,OAAO,oBACV,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,OAAO,IACzB,SAAS,EAAE,sBAAsB,EACjC,gBAAgB,kBAEhB,gCACE,QAAQ,EAAE,CAAC,EACX,IAAI,EAAC,QAAQ,gBACF,kBAAkB,YAE7B,uBAAC,oCAA4B,KAAG,GAC5B,IACU,EAClB,uBAAC,iBAAO,CAAC,OAAO,oBAAK,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,OAAO,cACvC,mBAAmB,IACJ,KACV,CACX,EACA,2BAA2B,IAAI,CAC9B,uBAAC,uBAAU,IACT,OAAO,EAAE,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,aAAa,EACxD,SAAS,EAAC,wBAAwB,YAEjC,UAAU,KAAK,IAAI,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,UAAU,GACnC,CACd,IACG,IACG,CACZ,EACD,uBAAC,mBAAQ,kBACP,YAAY,EAAC,MAAM,EACnB,KAAK,EAAC,aAAa,IACf,aAAa,IACjB,SAAS,EAAE,iBAAiB,YAE5B,iCAAK,SAAS,EAAC,mBAAmB,aAC/B,CAAC,cAAc,IAAI,CAAC,SAAS,IAAI,CAAC,eAAe,CAAC,CAAC,IAAI,CACtD,gCAAK,SAAS,EAAC,iCAAiC,YAC7C,SAAS,CAAC,CAAC,CAAC,CACX,uBAAC,gCAAc,IACb,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,EAC3C,SAAS,EACP,IAAI,KAAK,OAAO;4CACd,CAAC,CAAC,oBAAoB;4CACtB,CAAC,CAAC,mBAAmB,GAEzB,CACH,CAAC,CAAC,CAAC,CACF,cAAc,CACf,GACG,CACP,EACD,iCACE,SAAS,EAAE,IAAA,oBAAU,EAAC,qBAAqB,EAAE;wCAC3C,eAAe,EAAE,WAAW;qCAC7B,CAAC,aAEF,gDACE,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,UAAU,EACpB,QAAQ,EAAE,UAAU,EACpB,QAAQ,EAAE,UAAU,EACpB,KAAK,EAAE,aAAa,EACpB,WAAW,EAAE,WAAW,EACxB,IAAI,EAAC,MAAM,EACX,QAAQ,EAAE,gBAAgB,sBACR,gBAAgB,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,IACnD,2BAA2B,IAC/B,SAAS,EAAE,kBAAkB,IACzB,SAAS,EACb,EACD,gBAAgB,IAAI,CACnB,kCAAM,EAAE,EAAE,MAAM,EAAE,SAAS,EAAC,qBAAqB,aAC9C,SAAS,IAAI,UAAU,EACvB,WAAW,IAAI,8BAA8B,IACzC,CACR,EACA,WAAW,IAAI,OAAO,CAAC,aAAa,CAAC,IAAI,CACxC,gCAAK,SAAS,EAAC,+BAA+B,YAC5C,mCACE,QAAQ,EAAE,CAAC,CAAC,iBACC,IAAI,EACjB,IAAI,EAAC,QAAQ,EACb,KAAK,EAAC,mBAAmB,EACzB,OAAO,EAAE,GAAG,EAAE;oDACZ,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAG;wDACjB,MAAM,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE;qDACiB,CAAC,CAAC;gDAC5C,CAAC,YAED,uBAAC,wBAAgB,IAAC,SAAS,EAAC,UAAU,GAAG,GAClC,GACL,CACP,IACG,EACL,eAAe,IAAI,CAClB,gCAAK,SAAS,EAAC,kCAAkC,YAC9C,SAAS,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,CAC9B,uBAAC,gCAAc,IACb,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,EAC3C,SAAS,EACP,IAAI,KAAK,OAAO;4CACd,CAAC,CAAC,oBAAoB;4CACtB,CAAC,CAAC,mBAAmB,GAEzB,CACH,CAAC,CAAC,CAAC,CACF,eAAe,CAChB,GACG,CACP,IACG,IACG,IACL,EACP,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,SAAS,IAAI,CAClC,uBAAC,mBAAQ,IACP,YAAY,EAAC,MAAM,EACnB,KAAK,EAAC,aAAa,EACnB,SAAS,EAAE,iBAAiB,YAE5B,uBAAC,uBAAU,IACT,OAAO,EAAE,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,YAAY,EACxD,SAAS,EAAC,kBAAkB,YAE3B,QAAQ,GACE,GACJ,CACZ,EACA,OAAO,CAAC,SAAS,CAAC,IAAI;YACrB,0GAA0G;YAC1G,kGAAkG;YAClG,uBAAC,mBAAQ,kBACP,YAAY,EAAC,MAAM,EACnB,KAAK,EAAC,aAAa,EACnB,KAAK,EAAC,aAAa,IACf,aAAa,IACjB,SAAS,EAAE,iBAAiB,YAE5B,iCAAK,SAAS,EAAC,kBAAkB,aAC/B,gCAAK,SAAS,EAAC,gBAAgB,YAC7B,uBAAC,kCAA0B,KAAG,GAC1B,EACN,uBAAC,uBAAU,IACT,SAAS,EAAC,gBAAgB,EAC1B,OAAO,EAAE,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,YAAY,YAEvD,SAAS,GACC,IACT,IACG,CACZ,IACG,CACP,CAAC;AACJ,CAAC,CAAC;AA3QW,QAAA,SAAS,aA2QpB","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport classNames from 'classnames';\nimport {\n type InputHTMLAttributes,\n type ReactElement,\n type ReactNode,\n useId,\n useMemo,\n} from 'react';\n\nimport { customLabelAndNoAriaLabelWarningMessage } from '../_common/messages';\nimport { type CommonProps, type TooltipObjectProps } from '../_common/types';\nimport { useSemiControlledInput } from '../_common/use-semi-controlled-input';\nimport { needleWarningMessage } from '../_common/utils';\nimport {\n ExclamationCircleIconSolid,\n InformationCircleIconOutline,\n XMarkIconOutline,\n} from '../icons';\nimport { LoadingSpinner } from '../loading-spinner';\nimport { Skeleton } from '../skeleton';\nimport { Tooltip } from '../tooltip';\nimport { Typography } from '../typography';\n\ntype TextInputProps = {\n /** Assistive text displayed below the input */\n helpText?: string | ReactNode;\n\n /** Error message displayed below the input. When provided, it overrides `helpText` and shows an error icon */\n errorText?: string | ReactNode;\n\n /** Leading element rendered inside the input */\n leadingElement?: ReactElement;\n\n /** Trailing element rendered inside the input */\n trailingElement?: ReactElement;\n\n /** Size of the input */\n size?: 'small' | 'medium' | 'large';\n\n /** Whether the input is read-only */\n isReadOnly?: boolean;\n\n /**\n * Whether to display the Required/Optional label next to the field label.\n * Shows Required if isRequired is true, otherwise shows Optional.\n * @default false\n */\n showRequiredOrOptionalLabel?: boolean;\n\n /** Whether the input is disabled */\n isDisabled?: boolean;\n\n /** Whether the input is required */\n isRequired?: boolean;\n\n /** The current value of the input */\n value?: React.ComponentPropsWithoutRef<'input'>['value'];\n\n /** Placeholder text displayed when the input is empty */\n placeholder?: React.ComponentPropsWithoutRef<'input'>['placeholder'];\n\n /** Callback function triggered when the input value changes */\n onChange?: React.ComponentPropsWithoutRef<'input'>['onChange'];\n\n /** Whether the input should take the full available width */\n isFluid?: boolean;\n\n /** Text displayed in the information tooltip shown next to the label */\n moreInformationText?: React.ReactNode;\n\n /** The label displayed above the input */\n label?: string | React.ReactNode;\n\n /** Props for the Tooltip component used by the information icon */\n tooltipProps?: TooltipObjectProps;\n\n /** Whether to render skeletons instead of content */\n isSkeletonLoading?: boolean;\n\n /** Additional props forwarded to the underlying Skeleton components */\n skeletonProps?: React.ComponentProps<typeof Skeleton>;\n\n /** Whether to show the clear button */\n isClearable?: boolean;\n\n /** Whether to show the loading spinner */\n isLoading?: boolean;\n};\n\n/**\n *\n *\n * TextInput Component\n *\n *\n */\n\nexport const TextInput = ({\n label,\n isFluid,\n errorText,\n helpText,\n leadingElement,\n trailingElement,\n showRequiredOrOptionalLabel = false,\n moreInformationText,\n size = 'medium',\n placeholder,\n value,\n tooltipProps,\n htmlAttributes,\n isDisabled,\n isReadOnly,\n isRequired,\n onChange,\n isClearable = false,\n className,\n style,\n isSkeletonLoading = false,\n isLoading = false,\n skeletonProps,\n ref,\n ...restProps\n}: CommonProps<'input', TextInputProps>) => {\n const [internalState, internalOnChange] = useSemiControlledInput({\n inputType: 'text',\n isControlled: value !== undefined,\n onChange,\n state: value ?? '',\n });\n const hintId = useId();\n\n const containerWrappingClasses = classNames(`ndl-text-input`, className, {\n 'ndl-disabled': isDisabled,\n 'ndl-has-error': errorText,\n 'ndl-has-icon': leadingElement || trailingElement || errorText,\n 'ndl-has-leading-icon': leadingElement,\n 'ndl-has-trailing-icon': trailingElement || errorText,\n 'ndl-large': size === 'large',\n 'ndl-medium': size === 'medium',\n 'ndl-read-only': isReadOnly,\n 'ndl-small': size === 'small',\n });\n\n const hasEmptyLabelValue =\n label === undefined || label === null || label === '';\n\n const labelWrappingClasses = classNames('ndl-form-item-label', {\n 'ndl-fluid': isFluid,\n 'ndl-form-item-no-label': hasEmptyLabelValue,\n });\n\n const combinedHtmlInputAttributes: InputHTMLAttributes<HTMLInputElement> = {\n ...htmlAttributes,\n className: classNames('ndl-input', htmlAttributes?.className),\n };\n const ariaLabel = combinedHtmlInputAttributes['aria-label'];\n const isCustomLabel = Boolean(label) && typeof label !== 'string';\n const hasCustomLabelAndNoAriaLabel =\n isCustomLabel && (ariaLabel === undefined || ariaLabel === '');\n const shouldRenderHint = isClearable || isLoading;\n\n const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n if (isClearable && event.key === 'Escape' && Boolean(internalState)) {\n event.preventDefault();\n event.stopPropagation();\n internalOnChange?.({\n target: { value: '' },\n } as React.ChangeEvent<HTMLInputElement>);\n }\n htmlAttributes?.onKeyDown?.(event);\n };\n\n useMemo(() => {\n if (!label && !ariaLabel) {\n needleWarningMessage(\n 'A TextInput without a label does not have an aria label, be sure to include an aria label for screen readers. Link: https://dequeuniversity.com/rules/axe/4.2/label?application=axeAPI',\n );\n }\n\n if (hasCustomLabelAndNoAriaLabel) {\n needleWarningMessage(customLabelAndNoAriaLabelWarningMessage);\n }\n }, [label, ariaLabel, hasCustomLabelAndNoAriaLabel]);\n\n const informationIconClasses = classNames({\n 'ndl-information-icon-large': size === 'large',\n 'ndl-information-icon-small': size === 'small' || size === 'medium',\n });\n\n return (\n <div className={containerWrappingClasses} style={style}>\n {/* We enable implicit label wrapping */}\n {/* Source: https://dequeuniversity.com/rules/axe/4.2/label?application=axeAPI */}\n <label className={labelWrappingClasses}>\n {!hasEmptyLabelValue && (\n <Skeleton\n onBackground=\"weak\"\n shape=\"rectangular\"\n {...skeletonProps}\n isLoading={isSkeletonLoading}\n >\n <div className=\"ndl-label-text-wrapper\">\n <Typography\n variant={size === 'large' ? 'body-large' : 'body-medium'}\n className=\"ndl-label-text\"\n >\n {label}\n </Typography>\n {Boolean(moreInformationText) && (\n <Tooltip {...tooltipProps?.root} type=\"simple\">\n <Tooltip.Trigger\n {...tooltipProps?.trigger}\n className={informationIconClasses}\n hasButtonWrapper\n >\n <div\n tabIndex={0}\n role=\"button\"\n aria-label=\"Information icon\"\n >\n <InformationCircleIconOutline />\n </div>\n </Tooltip.Trigger>\n <Tooltip.Content {...tooltipProps?.content}>\n {moreInformationText}\n </Tooltip.Content>\n </Tooltip>\n )}\n {showRequiredOrOptionalLabel && (\n <Typography\n variant={size === 'large' ? 'body-large' : 'body-medium'}\n className=\"ndl-form-item-optional\"\n >\n {isRequired === true ? 'Required' : 'Optional'}\n </Typography>\n )}\n </div>\n </Skeleton>\n )}\n <Skeleton\n onBackground=\"weak\"\n shape=\"rectangular\"\n {...skeletonProps}\n isLoading={isSkeletonLoading}\n >\n <div className=\"ndl-input-wrapper\">\n {(leadingElement || (isLoading && !trailingElement)) && (\n <div className=\"ndl-element-leading ndl-element\">\n {isLoading ? (\n <LoadingSpinner\n size={size === 'large' ? 'medium' : 'small'}\n className={\n size === 'large'\n ? 'ndl-medium-spinner'\n : 'ndl-small-spinner'\n }\n />\n ) : (\n leadingElement\n )}\n </div>\n )}\n <div\n className={classNames('ndl-input-container', {\n 'ndl-clearable': isClearable,\n })}\n >\n <input\n ref={ref}\n readOnly={isReadOnly}\n disabled={isDisabled}\n required={isRequired}\n value={internalState}\n placeholder={placeholder}\n type=\"text\"\n onChange={internalOnChange}\n aria-describedby={shouldRenderHint ? hintId : undefined}\n {...combinedHtmlInputAttributes}\n onKeyDown={handleInputKeyDown}\n {...restProps}\n />\n {shouldRenderHint && (\n <span id={hintId} className=\"ndl-text-input-hint\">\n {isLoading && 'Loading '}\n {isClearable && 'Press Escape to clear input.'}\n </span>\n )}\n {isClearable && Boolean(internalState) && (\n <div className=\"ndl-element-clear ndl-element\">\n <button\n tabIndex={-1}\n aria-hidden={true}\n type=\"button\"\n title=\"Clear input (Esc)\"\n onClick={() => {\n internalOnChange?.({\n target: { value: '' },\n } as React.ChangeEvent<HTMLInputElement>);\n }}\n >\n <XMarkIconOutline className=\"n-size-4\" />\n </button>\n </div>\n )}\n </div>\n {trailingElement && (\n <div className=\"ndl-element-trailing ndl-element\">\n {isLoading && !leadingElement ? (\n <LoadingSpinner\n size={size === 'large' ? 'medium' : 'small'}\n className={\n size === 'large'\n ? 'ndl-medium-spinner'\n : 'ndl-small-spinner'\n }\n />\n ) : (\n trailingElement\n )}\n </div>\n )}\n </div>\n </Skeleton>\n </label>\n {Boolean(helpText) && !errorText && (\n <Skeleton\n onBackground=\"weak\"\n shape=\"rectangular\"\n isLoading={isSkeletonLoading}\n >\n <Typography\n variant={size === 'large' ? 'body-medium' : 'body-small'}\n className=\"ndl-form-message\"\n >\n {helpText}\n </Typography>\n </Skeleton>\n )}\n {Boolean(errorText) && (\n // TODO v4: We might want to have a min width for the container for the messages to help skeleton loading.\n // Currently the message fills 100% of the width while the rest of the text input has a set width.\n <Skeleton\n onBackground=\"weak\"\n shape=\"rectangular\"\n width=\"fit-content\"\n {...skeletonProps}\n isLoading={isSkeletonLoading}\n >\n <div className=\"ndl-form-message\">\n <div className=\"ndl-error-icon\">\n <ExclamationCircleIconSolid />\n </div>\n <Typography\n className=\"ndl-error-text\"\n variant={size === 'large' ? 'body-medium' : 'body-small'}\n >\n {errorText}\n </Typography>\n </div>\n </Skeleton>\n )}\n </div>\n );\n};\n"]}
1
+ {"version":3,"file":"TextInput.js","sourceRoot":"","sources":["../../../src/text-input/TextInput.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,4DAAoC;AACpC,iCAMe;AAEf,kDAA8E;AAE9E,oFAA8E;AAC9E,4CAAwD;AACxD,oCAIkB;AAClB,wDAAoD;AACpD,0CAAuC;AACvC,wCAAqC;AACrC,8CAA2C;AAoE3C;;;;;;GAMG;AAEI,MAAM,SAAS,GAAG,CAAC,EA0Ba,EAAE,EAAE;QA1BjB,EACxB,KAAK,EACL,OAAO,EACP,SAAS,EACT,QAAQ,EACR,cAAc,EACd,eAAe,EACf,2BAA2B,GAAG,KAAK,EACnC,mBAAmB,EACnB,IAAI,GAAG,QAAQ,EACf,WAAW,EACX,KAAK,EACL,YAAY,EACZ,cAAc,EACd,UAAU,EACV,UAAU,EACV,UAAU,EACV,QAAQ,EACR,WAAW,GAAG,KAAK,EACnB,SAAS,EACT,KAAK,EACL,iBAAiB,GAAG,KAAK,EACzB,SAAS,GAAG,KAAK,EACjB,aAAa,EACb,GAAG,OAEkC,EADlC,SAAS,cAzBY,+VA0BzB,CADa;IAEZ,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,IAAA,kDAAsB,EAAC;QAC/D,SAAS,EAAE,MAAM;QACjB,YAAY,EAAE,KAAK,KAAK,SAAS;QACjC,QAAQ;QACR,KAAK,EAAE,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,EAAE;KACnB,CAAC,CAAC;IACH,MAAM,MAAM,GAAG,IAAA,aAAK,GAAE,CAAC;IACvB,MAAM,UAAU,GAAG,IAAA,aAAK,GAAE,CAAC;IAC3B,MAAM,WAAW,GAAG,IAAA,aAAK,GAAE,CAAC;IAE5B,MAAM,wBAAwB,GAAG,IAAA,oBAAU,EAAC,gBAAgB,EAAE,SAAS,EAAE;QACvE,cAAc,EAAE,UAAU;QAC1B,eAAe,EAAE,SAAS;QAC1B,cAAc,EAAE,cAAc,IAAI,eAAe,IAAI,SAAS;QAC9D,sBAAsB,EAAE,cAAc;QACtC,uBAAuB,EAAE,eAAe,IAAI,SAAS;QACrD,WAAW,EAAE,IAAI,KAAK,OAAO;QAC7B,YAAY,EAAE,IAAI,KAAK,QAAQ;QAC/B,eAAe,EAAE,UAAU;QAC3B,WAAW,EAAE,IAAI,KAAK,OAAO;KAC9B,CAAC,CAAC;IAEH,MAAM,kBAAkB,GACtB,KAAK,KAAK,SAAS,IAAI,KAAK,KAAK,IAAI,IAAI,KAAK,KAAK,EAAE,CAAC;IAExD,MAAM,oBAAoB,GAAG,IAAA,oBAAU,EAAC,qBAAqB,EAAE;QAC7D,WAAW,EAAE,OAAO;QACpB,wBAAwB,EAAE,kBAAkB;KAC7C,CAAC,CAAC;IAEH,MAAM,2BAA2B,mCAC5B,cAAc,KACjB,SAAS,EAAE,IAAA,oBAAU,EAAC,WAAW,EAAE,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,SAAS,CAAC,GAC9D,CAAC;IACF,MAAM,SAAS,GAAG,2BAA2B,CAAC,YAAY,CAAC,CAAC;IAC5D,MAAM,aAAa,GAAG,OAAO,CAAC,KAAK,CAAC,IAAI,OAAO,KAAK,KAAK,QAAQ,CAAC;IAClE,MAAM,4BAA4B,GAChC,aAAa,IAAI,CAAC,SAAS,KAAK,SAAS,IAAI,SAAS,KAAK,EAAE,CAAC,CAAC;IACjE,MAAM,gBAAgB,GAAG,WAAW,IAAI,SAAS,CAAC;IAElD,MAAM,kBAAkB,GAAG,CAAC,KAA4C,EAAE,EAAE;;QAC1E,IAAI,WAAW,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,IAAI,OAAO,CAAC,aAAa,CAAC,EAAE,CAAC;YACpE,KAAK,CAAC,cAAc,EAAE,CAAC;YACvB,KAAK,CAAC,eAAe,EAAE,CAAC;YACxB,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAG;gBACjB,MAAM,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE;aACiB,CAAC,CAAC;QAC5C,CAAC;QACD,MAAA,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,SAAS,+DAAG,KAAK,CAAC,CAAC;IACrC,CAAC,CAAC;IAEF,IAAA,eAAO,EAAC,GAAG,EAAE;QACX,IAAI,CAAC,KAAK,IAAI,CAAC,SAAS,EAAE,CAAC;YACzB,IAAA,4BAAoB,EAClB,wLAAwL,CACzL,CAAC;QACJ,CAAC;QAED,IAAI,4BAA4B,EAAE,CAAC;YACjC,IAAA,4BAAoB,EAAC,kDAAuC,CAAC,CAAC;QAChE,CAAC;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,EAAE,4BAA4B,CAAC,CAAC,CAAC;IAErD,MAAM,sBAAsB,GAAG,IAAA,oBAAU,EAAC;QACxC,4BAA4B,EAAE,IAAI,KAAK,OAAO;QAC9C,4BAA4B,EAAE,IAAI,KAAK,OAAO,IAAI,IAAI,KAAK,QAAQ;KACpE,CAAC,CAAC;IAEH,MAAM,uBAAuB,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;QAC3C,MAAM,eAAe,GAAG,CAAC,MAAM,CAAC,CAAC;QAEjC,IAAI,QAAQ,IAAI,CAAC,SAAS,EAAE,CAAC;YAC3B,eAAe,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QACnC,CAAC;aAAM,IAAI,SAAS,EAAE,CAAC;YACrB,eAAe,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QACpC,CAAC;QACD,OAAO,eAAe,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IACnC,CAAC,EAAE,CAAC,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,UAAU,EAAE,WAAW,CAAC,CAAC,CAAC;IAE3D,OAAO,CACL,iCAAK,SAAS,EAAE,wBAAwB,EAAE,KAAK,EAAE,KAAK,aAGpD,mCAAO,SAAS,EAAE,oBAAoB,aACnC,CAAC,kBAAkB,IAAI,CACtB,uBAAC,mBAAQ,kBACP,YAAY,EAAC,MAAM,EACnB,KAAK,EAAC,aAAa,IACf,aAAa,IACjB,SAAS,EAAE,iBAAiB,YAE5B,iCAAK,SAAS,EAAC,wBAAwB,aACrC,uBAAC,uBAAU,IACT,OAAO,EAAE,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,aAAa,EACxD,SAAS,EAAC,gBAAgB,YAEzB,KAAK,GACK,EACZ,OAAO,CAAC,mBAAmB,CAAC,IAAI,CAC/B,wBAAC,iBAAO,oBAAK,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,IAAI,IAAE,IAAI,EAAC,QAAQ,aAC5C,uBAAC,iBAAO,CAAC,OAAO,oBACV,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,OAAO,IACzB,SAAS,EAAE,sBAAsB,EACjC,gBAAgB,kBAEhB,gCACE,QAAQ,EAAE,CAAC,EACX,IAAI,EAAC,QAAQ,gBACF,kBAAkB,YAE7B,uBAAC,oCAA4B,KAAG,GAC5B,IACU,EAClB,uBAAC,iBAAO,CAAC,OAAO,oBAAK,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,OAAO,cACvC,mBAAmB,IACJ,KACV,CACX,EACA,2BAA2B,IAAI,CAC9B,uBAAC,uBAAU,IACT,OAAO,EAAE,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,aAAa,EACxD,SAAS,EAAC,wBAAwB,YAEjC,UAAU,KAAK,IAAI,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,UAAU,GACnC,CACd,IACG,IACG,CACZ,EACD,uBAAC,mBAAQ,kBACP,YAAY,EAAC,MAAM,EACnB,KAAK,EAAC,aAAa,IACf,aAAa,IACjB,SAAS,EAAE,iBAAiB,YAE5B,iCAAK,SAAS,EAAC,mBAAmB,aAC/B,CAAC,cAAc,IAAI,CAAC,SAAS,IAAI,CAAC,eAAe,CAAC,CAAC,IAAI,CACtD,gCAAK,SAAS,EAAC,iCAAiC,YAC7C,SAAS,CAAC,CAAC,CAAC,CACX,uBAAC,gCAAc,IACb,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,EAC3C,SAAS,EACP,IAAI,KAAK,OAAO;4CACd,CAAC,CAAC,oBAAoB;4CACtB,CAAC,CAAC,mBAAmB,GAEzB,CACH,CAAC,CAAC,CAAC,CACF,cAAc,CACf,GACG,CACP,EACD,iCACE,SAAS,EAAE,IAAA,oBAAU,EAAC,qBAAqB,EAAE;wCAC3C,eAAe,EAAE,WAAW;qCAC7B,CAAC,aAEF,gDACE,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,UAAU,EACpB,QAAQ,EAAE,UAAU,EACpB,QAAQ,EAAE,UAAU,EACpB,KAAK,EAAE,aAAa,EACpB,WAAW,EAAE,WAAW,EACxB,IAAI,EAAC,MAAM,EACX,QAAQ,EAAE,gBAAgB,sBACR,uBAAuB,IACrC,2BAA2B,IAC/B,SAAS,EAAE,kBAAkB,IACzB,SAAS,EACb,EACD,gBAAgB,IAAI,CACnB,kCACE,EAAE,EAAE,MAAM,EACV,SAAS,EAAC,qBAAqB,iBAClB,IAAI,aAEhB,SAAS,IAAI,UAAU,EACvB,WAAW,IAAI,8BAA8B,IACzC,CACR,EACA,WAAW,IAAI,OAAO,CAAC,aAAa,CAAC,IAAI,CACxC,gCAAK,SAAS,EAAC,+BAA+B,YAC5C,mCACE,QAAQ,EAAE,CAAC,CAAC,iBACC,IAAI,EACjB,IAAI,EAAC,QAAQ,EACb,KAAK,EAAC,mBAAmB,EACzB,OAAO,EAAE,GAAG,EAAE;oDACZ,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAG;wDACjB,MAAM,EAAE,EAAE,KAAK,EAAE,EAAE,EAAE;qDACiB,CAAC,CAAC;gDAC5C,CAAC,YAED,uBAAC,wBAAgB,IAAC,SAAS,EAAC,UAAU,GAAG,GAClC,GACL,CACP,IACG,EACL,eAAe,IAAI,CAClB,gCAAK,SAAS,EAAC,kCAAkC,YAC9C,SAAS,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,CAC9B,uBAAC,gCAAc,IACb,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,EAC3C,SAAS,EACP,IAAI,KAAK,OAAO;4CACd,CAAC,CAAC,oBAAoB;4CACtB,CAAC,CAAC,mBAAmB,GAEzB,CACH,CAAC,CAAC,CAAC,CACF,eAAe,CAChB,GACG,CACP,IACG,IACG,IACL,EACP,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,SAAS,IAAI,CAClC,uBAAC,mBAAQ,IACP,YAAY,EAAC,MAAM,EACnB,KAAK,EAAC,aAAa,EACnB,SAAS,EAAE,iBAAiB,YAE5B,uBAAC,uBAAU,IACT,OAAO,EAAE,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,YAAY,EACxD,SAAS,EAAC,kBAAkB,EAC5B,cAAc,EAAE;wBACd,WAAW,EAAE,QAAQ;wBACrB,EAAE,EAAE,UAAU;qBACf,YAEA,QAAQ,GACE,GACJ,CACZ,EACA,OAAO,CAAC,SAAS,CAAC,IAAI;YACrB,0GAA0G;YAC1G,kGAAkG;YAClG,uBAAC,mBAAQ,kBACP,YAAY,EAAC,MAAM,EACnB,KAAK,EAAC,aAAa,EACnB,KAAK,EAAC,aAAa,IACf,aAAa,IACjB,SAAS,EAAE,iBAAiB,YAE5B,iCAAK,SAAS,EAAC,kBAAkB,aAC/B,gCAAK,SAAS,EAAC,gBAAgB,YAC7B,uBAAC,kCAA0B,KAAG,GAC1B,EACN,uBAAC,uBAAU,IACT,SAAS,EAAC,gBAAgB,EAC1B,OAAO,EAAE,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,YAAY,EACxD,cAAc,EAAE;gCACd,WAAW,EAAE,QAAQ;gCACrB,EAAE,EAAE,WAAW;6BAChB,YAEA,SAAS,GACC,IACT,IACG,CACZ,IACG,CACP,CAAC;AACJ,CAAC,CAAC;AApSW,QAAA,SAAS,aAoSpB","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport classNames from 'classnames';\nimport {\n type InputHTMLAttributes,\n type ReactElement,\n type ReactNode,\n useId,\n useMemo,\n} from 'react';\n\nimport { customLabelAndNoAriaLabelWarningMessage } from '../_common/messages';\nimport { type CommonProps, type TooltipObjectProps } from '../_common/types';\nimport { useSemiControlledInput } from '../_common/use-semi-controlled-input';\nimport { needleWarningMessage } from '../_common/utils';\nimport {\n ExclamationCircleIconSolid,\n InformationCircleIconOutline,\n XMarkIconOutline,\n} from '../icons';\nimport { LoadingSpinner } from '../loading-spinner';\nimport { Skeleton } from '../skeleton';\nimport { Tooltip } from '../tooltip';\nimport { Typography } from '../typography';\n\ntype TextInputProps = {\n /** Assistive text displayed below the input */\n helpText?: string | ReactNode;\n\n /** Error message displayed below the input. When provided, it overrides `helpText` and shows an error icon */\n errorText?: string | ReactNode;\n\n /** Leading element rendered inside the input */\n leadingElement?: ReactElement;\n\n /** Trailing element rendered inside the input */\n trailingElement?: ReactElement;\n\n /** Size of the input */\n size?: 'small' | 'medium' | 'large';\n\n /** Whether the input is read-only */\n isReadOnly?: boolean;\n\n /**\n * Whether to display the Required/Optional label next to the field label.\n * Shows Required if isRequired is true, otherwise shows Optional.\n * @default false\n */\n showRequiredOrOptionalLabel?: boolean;\n\n /** Whether the input is disabled */\n isDisabled?: boolean;\n\n /** Whether the input is required */\n isRequired?: boolean;\n\n /** The current value of the input */\n value?: React.ComponentPropsWithoutRef<'input'>['value'];\n\n /** Placeholder text displayed when the input is empty */\n placeholder?: React.ComponentPropsWithoutRef<'input'>['placeholder'];\n\n /** Callback function triggered when the input value changes */\n onChange?: React.ComponentPropsWithoutRef<'input'>['onChange'];\n\n /** Whether the input should take the full available width */\n isFluid?: boolean;\n\n /** Text displayed in the information tooltip shown next to the label */\n moreInformationText?: React.ReactNode;\n\n /** The label displayed above the input */\n label?: string | React.ReactNode;\n\n /** Props for the Tooltip component used by the information icon */\n tooltipProps?: TooltipObjectProps;\n\n /** Whether to render skeletons instead of content */\n isSkeletonLoading?: boolean;\n\n /** Additional props forwarded to the underlying Skeleton components */\n skeletonProps?: React.ComponentProps<typeof Skeleton>;\n\n /** Whether to show the clear button */\n isClearable?: boolean;\n\n /** Whether to show the loading spinner */\n isLoading?: boolean;\n};\n\n/**\n *\n *\n * TextInput Component\n *\n *\n */\n\nexport const TextInput = ({\n label,\n isFluid,\n errorText,\n helpText,\n leadingElement,\n trailingElement,\n showRequiredOrOptionalLabel = false,\n moreInformationText,\n size = 'medium',\n placeholder,\n value,\n tooltipProps,\n htmlAttributes,\n isDisabled,\n isReadOnly,\n isRequired,\n onChange,\n isClearable = false,\n className,\n style,\n isSkeletonLoading = false,\n isLoading = false,\n skeletonProps,\n ref,\n ...restProps\n}: CommonProps<'input', TextInputProps>) => {\n const [internalState, internalOnChange] = useSemiControlledInput({\n inputType: 'text',\n isControlled: value !== undefined,\n onChange,\n state: value ?? '',\n });\n const hintId = useId();\n const helpTextId = useId();\n const errorTextId = useId();\n\n const containerWrappingClasses = classNames(`ndl-text-input`, className, {\n 'ndl-disabled': isDisabled,\n 'ndl-has-error': errorText,\n 'ndl-has-icon': leadingElement || trailingElement || errorText,\n 'ndl-has-leading-icon': leadingElement,\n 'ndl-has-trailing-icon': trailingElement || errorText,\n 'ndl-large': size === 'large',\n 'ndl-medium': size === 'medium',\n 'ndl-read-only': isReadOnly,\n 'ndl-small': size === 'small',\n });\n\n const hasEmptyLabelValue =\n label === undefined || label === null || label === '';\n\n const labelWrappingClasses = classNames('ndl-form-item-label', {\n 'ndl-fluid': isFluid,\n 'ndl-form-item-no-label': hasEmptyLabelValue,\n });\n\n const combinedHtmlInputAttributes: InputHTMLAttributes<HTMLInputElement> = {\n ...htmlAttributes,\n className: classNames('ndl-input', htmlAttributes?.className),\n };\n const ariaLabel = combinedHtmlInputAttributes['aria-label'];\n const isCustomLabel = Boolean(label) && typeof label !== 'string';\n const hasCustomLabelAndNoAriaLabel =\n isCustomLabel && (ariaLabel === undefined || ariaLabel === '');\n const shouldRenderHint = isClearable || isLoading;\n\n const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n if (isClearable && event.key === 'Escape' && Boolean(internalState)) {\n event.preventDefault();\n event.stopPropagation();\n internalOnChange?.({\n target: { value: '' },\n } as React.ChangeEvent<HTMLInputElement>);\n }\n htmlAttributes?.onKeyDown?.(event);\n };\n\n useMemo(() => {\n if (!label && !ariaLabel) {\n needleWarningMessage(\n 'A TextInput without a label does not have an aria label, be sure to include an aria label for screen readers. Link: https://dequeuniversity.com/rules/axe/4.2/label?application=axeAPI',\n );\n }\n\n if (hasCustomLabelAndNoAriaLabel) {\n needleWarningMessage(customLabelAndNoAriaLabelWarningMessage);\n }\n }, [label, ariaLabel, hasCustomLabelAndNoAriaLabel]);\n\n const informationIconClasses = classNames({\n 'ndl-information-icon-large': size === 'large',\n 'ndl-information-icon-small': size === 'small' || size === 'medium',\n });\n\n const combinedAriaDescribedby = useMemo(() => {\n const ariaDescribedby = [hintId];\n\n if (helpText && !errorText) {\n ariaDescribedby.push(helpTextId);\n } else if (errorText) {\n ariaDescribedby.push(errorTextId);\n }\n return ariaDescribedby.join(' ');\n }, [hintId, helpText, errorText, helpTextId, errorTextId]);\n\n return (\n <div className={containerWrappingClasses} style={style}>\n {/* We enable implicit label wrapping */}\n {/* Source: https://dequeuniversity.com/rules/axe/4.2/label?application=axeAPI */}\n <label className={labelWrappingClasses}>\n {!hasEmptyLabelValue && (\n <Skeleton\n onBackground=\"weak\"\n shape=\"rectangular\"\n {...skeletonProps}\n isLoading={isSkeletonLoading}\n >\n <div className=\"ndl-label-text-wrapper\">\n <Typography\n variant={size === 'large' ? 'body-large' : 'body-medium'}\n className=\"ndl-label-text\"\n >\n {label}\n </Typography>\n {Boolean(moreInformationText) && (\n <Tooltip {...tooltipProps?.root} type=\"simple\">\n <Tooltip.Trigger\n {...tooltipProps?.trigger}\n className={informationIconClasses}\n hasButtonWrapper\n >\n <div\n tabIndex={0}\n role=\"button\"\n aria-label=\"Information icon\"\n >\n <InformationCircleIconOutline />\n </div>\n </Tooltip.Trigger>\n <Tooltip.Content {...tooltipProps?.content}>\n {moreInformationText}\n </Tooltip.Content>\n </Tooltip>\n )}\n {showRequiredOrOptionalLabel && (\n <Typography\n variant={size === 'large' ? 'body-large' : 'body-medium'}\n className=\"ndl-form-item-optional\"\n >\n {isRequired === true ? 'Required' : 'Optional'}\n </Typography>\n )}\n </div>\n </Skeleton>\n )}\n <Skeleton\n onBackground=\"weak\"\n shape=\"rectangular\"\n {...skeletonProps}\n isLoading={isSkeletonLoading}\n >\n <div className=\"ndl-input-wrapper\">\n {(leadingElement || (isLoading && !trailingElement)) && (\n <div className=\"ndl-element-leading ndl-element\">\n {isLoading ? (\n <LoadingSpinner\n size={size === 'large' ? 'medium' : 'small'}\n className={\n size === 'large'\n ? 'ndl-medium-spinner'\n : 'ndl-small-spinner'\n }\n />\n ) : (\n leadingElement\n )}\n </div>\n )}\n <div\n className={classNames('ndl-input-container', {\n 'ndl-clearable': isClearable,\n })}\n >\n <input\n ref={ref}\n readOnly={isReadOnly}\n disabled={isDisabled}\n required={isRequired}\n value={internalState}\n placeholder={placeholder}\n type=\"text\"\n onChange={internalOnChange}\n aria-describedby={combinedAriaDescribedby}\n {...combinedHtmlInputAttributes}\n onKeyDown={handleInputKeyDown}\n {...restProps}\n />\n {shouldRenderHint && (\n <span\n id={hintId}\n className=\"ndl-text-input-hint\"\n aria-hidden={true}\n >\n {isLoading && 'Loading '}\n {isClearable && 'Press Escape to clear input.'}\n </span>\n )}\n {isClearable && Boolean(internalState) && (\n <div className=\"ndl-element-clear ndl-element\">\n <button\n tabIndex={-1}\n aria-hidden={true}\n type=\"button\"\n title=\"Clear input (Esc)\"\n onClick={() => {\n internalOnChange?.({\n target: { value: '' },\n } as React.ChangeEvent<HTMLInputElement>);\n }}\n >\n <XMarkIconOutline className=\"n-size-4\" />\n </button>\n </div>\n )}\n </div>\n {trailingElement && (\n <div className=\"ndl-element-trailing ndl-element\">\n {isLoading && !leadingElement ? (\n <LoadingSpinner\n size={size === 'large' ? 'medium' : 'small'}\n className={\n size === 'large'\n ? 'ndl-medium-spinner'\n : 'ndl-small-spinner'\n }\n />\n ) : (\n trailingElement\n )}\n </div>\n )}\n </div>\n </Skeleton>\n </label>\n {Boolean(helpText) && !errorText && (\n <Skeleton\n onBackground=\"weak\"\n shape=\"rectangular\"\n isLoading={isSkeletonLoading}\n >\n <Typography\n variant={size === 'large' ? 'body-medium' : 'body-small'}\n className=\"ndl-form-message\"\n htmlAttributes={{\n 'aria-live': 'polite',\n id: helpTextId,\n }}\n >\n {helpText}\n </Typography>\n </Skeleton>\n )}\n {Boolean(errorText) && (\n // TODO v4: We might want to have a min width for the container for the messages to help skeleton loading.\n // Currently the message fills 100% of the width while the rest of the text input has a set width.\n <Skeleton\n onBackground=\"weak\"\n shape=\"rectangular\"\n width=\"fit-content\"\n {...skeletonProps}\n isLoading={isSkeletonLoading}\n >\n <div className=\"ndl-form-message\">\n <div className=\"ndl-error-icon\">\n <ExclamationCircleIconSolid />\n </div>\n <Typography\n className=\"ndl-error-text\"\n variant={size === 'large' ? 'body-medium' : 'body-small'}\n htmlAttributes={{\n 'aria-live': 'polite',\n id: errorTextId,\n }}\n >\n {errorText}\n </Typography>\n </div>\n </Skeleton>\n )}\n </div>\n );\n};\n"]}