@neo4j-ndl/react 4.9.38 → 4.9.40

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 (40) hide show
  1. package/lib/cjs/time-picker/TimePicker.js +5 -2
  2. package/lib/cjs/time-picker/TimePicker.js.map +1 -1
  3. package/lib/cjs/timezone-picker/TimeZonePicker.js +7 -4
  4. package/lib/cjs/timezone-picker/TimeZonePicker.js.map +1 -1
  5. package/lib/cjs/tooltip/Tooltip.js +57 -5
  6. package/lib/cjs/tooltip/Tooltip.js.map +1 -1
  7. package/lib/cjs/tooltip/stories/index.js +6 -2
  8. package/lib/cjs/tooltip/stories/index.js.map +1 -1
  9. package/lib/cjs/tooltip/stories/tooltip-rich-actions.story.js +30 -0
  10. package/lib/cjs/tooltip/stories/tooltip-rich-actions.story.js.map +1 -0
  11. package/lib/cjs/tooltip/stories/tooltip-rich.story.js +1 -1
  12. package/lib/cjs/tooltip/stories/tooltip-rich.story.js.map +1 -1
  13. package/lib/cjs/tooltip/use-tooltip.js +18 -3
  14. package/lib/cjs/tooltip/use-tooltip.js.map +1 -1
  15. package/lib/esm/time-picker/TimePicker.js +5 -2
  16. package/lib/esm/time-picker/TimePicker.js.map +1 -1
  17. package/lib/esm/timezone-picker/TimeZonePicker.js +7 -4
  18. package/lib/esm/timezone-picker/TimeZonePicker.js.map +1 -1
  19. package/lib/esm/tooltip/Tooltip.js +24 -5
  20. package/lib/esm/tooltip/Tooltip.js.map +1 -1
  21. package/lib/esm/tooltip/stories/index.js +4 -1
  22. package/lib/esm/tooltip/stories/index.js.map +1 -1
  23. package/lib/esm/tooltip/stories/tooltip-rich-actions.story.js +28 -0
  24. package/lib/esm/tooltip/stories/tooltip-rich-actions.story.js.map +1 -0
  25. package/lib/esm/tooltip/stories/tooltip-rich.story.js +2 -2
  26. package/lib/esm/tooltip/stories/tooltip-rich.story.js.map +1 -1
  27. package/lib/esm/tooltip/use-tooltip.js +19 -4
  28. package/lib/esm/tooltip/use-tooltip.js.map +1 -1
  29. package/lib/types/time-picker/TimePicker.d.ts.map +1 -1
  30. package/lib/types/timezone-picker/TimeZonePicker.d.ts.map +1 -1
  31. package/lib/types/tooltip/Tooltip.d.ts +5 -2
  32. package/lib/types/tooltip/Tooltip.d.ts.map +1 -1
  33. package/lib/types/tooltip/stories/index.d.ts +3 -1
  34. package/lib/types/tooltip/stories/index.d.ts.map +1 -1
  35. package/lib/types/tooltip/stories/tooltip-rich-actions.story.d.ts +24 -0
  36. package/lib/types/tooltip/stories/tooltip-rich-actions.story.d.ts.map +1 -0
  37. package/lib/types/tooltip/stories/tooltip-rich.story.d.ts.map +1 -1
  38. package/lib/types/tooltip/use-tooltip.d.ts +5 -0
  39. package/lib/types/tooltip/use-tooltip.d.ts.map +1 -1
  40. package/package.json +1 -1
@@ -1 +1 @@
1
- {"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../../src/tooltip/Tooltip.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 {\n type AutoUpdateOptions,\n FloatingFocusManager,\n FloatingPortal,\n type Placement,\n type UseFloatingOptions,\n useMergeRefs,\n} from '@floating-ui/react';\nimport classNames from 'classnames';\nimport type React from 'react';\nimport { cloneElement, isValidElement } from 'react';\n\nimport { type CommonProps } from '../_common/types';\nimport { ConditionalWrap } from '../conditional-wrap';\nimport { useIsInsideDialog } from '../dialog/dialog-context';\nimport { useNeedleTheme } from '../theme';\nimport { Typography, type TypographyVariants } from '../typography';\nimport { TooltipContext, useTooltip, useTooltipContext } from './use-tooltip';\n\nexport type TooltipProps = {\n /** Content displayed inside the tooltip. Wraps `Tooltip.Trigger`, `Tooltip.Content`, and optional parts */\n children: React.ReactNode;\n /** Whether the tooltip is disabled */\n isDisabled?: boolean;\n /** Whether the tooltip should be open on first render */\n isInitialOpen?: boolean;\n /** Placement of the tooltip content relative to the trigger */\n placement?: Placement;\n /** Controls the open state . If omitted, the tooltip manages its own state */\n isOpen?: boolean;\n /** Visual style of the tooltip content. `simple` renders plain text, `rich` renders a composable panel */\n type: 'simple' | 'rich';\n /** Whether the content is rendered in a portal. */\n isPortaled?: boolean;\n /** Callback fired when the open state changes, if omitted, the tooltip manages its own state using internal hooks */\n onOpenChange?: UseFloatingOptions['onOpenChange'];\n /** Positioning strategy of the tooltip. Defaults to `fixed` when inside a dialog, otherwise `absolute` */\n floatingStrategy?: 'absolute' | 'fixed';\n /** Hover open/close delays in milliseconds */\n hoverDelay?: {\n open: number;\n close: number;\n };\n /** Whether the tooltip should close when the reference element is clicked. Useful when the trigger moves after click. */\n shouldCloseOnReferenceClick?: boolean;\n autoUpdateOptions?: AutoUpdateOptions;\n};\n\nconst TooltipComponent = ({\n children,\n isDisabled = false,\n type,\n isInitialOpen,\n placement,\n isOpen,\n onOpenChange,\n isPortaled: isPortaledProp,\n floatingStrategy: strategyProp,\n hoverDelay,\n shouldCloseOnReferenceClick,\n autoUpdateOptions,\n}: TooltipProps) => {\n const isInsideDialog = useIsInsideDialog();\n const strategy = isInsideDialog ? 'fixed' : 'absolute';\n const isPortaled = !isInsideDialog;\n\n const tooltip = useTooltip({\n autoUpdateOptions,\n hoverDelay,\n isDisabled,\n isInitialOpen,\n // if isDisabled is true tooltip will not open otherwise either controlled or uncontrolled depending on if isOpen is passed\n isOpen: isDisabled === true ? false : isOpen,\n isPortaled: isPortaledProp ?? isPortaled,\n onOpenChange,\n placement,\n shouldCloseOnReferenceClick,\n strategy: strategyProp ?? strategy,\n type,\n });\n\n return (\n <TooltipContext.Provider value={tooltip}>\n {children}\n </TooltipContext.Provider>\n );\n};\n\nTooltipComponent.displayName = 'Tooltip';\n\ntype TooltipTriggerProps = {\n /** Content displayed inside the trigger element */\n children: React.ReactNode;\n /** Whether the trigger element can be any element without an extra button wrapper. The child element will be cloned with the necessary trigger props and merged refs */\n hasButtonWrapper?: boolean;\n};\n\nconst TooltipTrigger = ({\n children,\n hasButtonWrapper = false,\n htmlAttributes,\n className,\n style,\n ref,\n ...restProps\n}: CommonProps<'button', TooltipTriggerProps>) => {\n const context = useTooltipContext();\n\n // Example from floating-ui\n // oxlint-disable-next-line @typescript-eslint/no-explicit-any\n const childrenProps = (children as any).props;\n const mergedRefs = useMergeRefs([\n context.refs.setReference,\n ref,\n childrenProps?.ref,\n ]);\n\n const triggerClasses = classNames(\n {\n 'ndl-closed': !context.isOpen,\n 'ndl-open': context.isOpen,\n },\n 'ndl-tooltip-trigger',\n className,\n );\n\n // `hasButtonWrapper=true` allows the user to pass any element as the anchor\n if (hasButtonWrapper && isValidElement(children)) {\n const props: Record<string, unknown> = {\n className: triggerClasses,\n ...htmlAttributes,\n ...childrenProps,\n ref: mergedRefs,\n };\n return cloneElement(children, context.getReferenceProps(props));\n }\n\n return (\n <button\n type=\"button\"\n className={triggerClasses}\n style={style}\n ref={mergedRefs}\n {...context.getReferenceProps(htmlAttributes)}\n {...restProps}\n >\n {children}\n </button>\n );\n};\n\ntype TooltipContentProps = {\n /** Content displayed inside the tooltip */\n children: React.ReactNode;\n};\n\nconst TooltipContent = ({\n children,\n style,\n htmlAttributes,\n className,\n ref,\n ...restProps\n}: CommonProps<'div', TooltipContentProps>) => {\n const context = useTooltipContext();\n const mergedRef = useMergeRefs([context.refs.setFloating, ref]);\n const { themeClassName } = useNeedleTheme();\n if (!context.isOpen) {\n return null;\n }\n\n const classes = classNames('ndl-tooltip-content', themeClassName, className, {\n 'ndl-tooltip-content-rich': context.type === 'rich',\n 'ndl-tooltip-content-simple': context.type === 'simple',\n });\n\n if (context.type === 'simple') {\n return (\n <ConditionalWrap\n shouldWrap={context.isPortaled}\n wrap={(wrapChildren) => <FloatingPortal>{wrapChildren}</FloatingPortal>}\n >\n <div\n ref={mergedRef}\n className={classes}\n style={{\n ...context.floatingStyles,\n ...style,\n }}\n {...restProps}\n {...context.getFloatingProps(htmlAttributes)}\n >\n <Typography variant=\"body-medium\">{children}</Typography>\n </div>\n </ConditionalWrap>\n );\n }\n\n return (\n <ConditionalWrap\n shouldWrap={context.isPortaled}\n wrap={(wrapChildren) => <FloatingPortal>{wrapChildren}</FloatingPortal>}\n >\n <FloatingFocusManager\n context={context.context}\n returnFocus={true}\n modal={false}\n initialFocus={-1}\n closeOnFocusOut\n >\n <div\n ref={mergedRef}\n className={classes}\n style={{\n ...context.floatingStyles,\n ...style,\n }}\n {...restProps}\n {...context.getFloatingProps(htmlAttributes)}\n >\n {children}\n </div>\n </FloatingFocusManager>\n </ConditionalWrap>\n );\n};\n\ntype TooltipHeaderProps = {\n /** Content displayed inside the header */\n children: React.ReactNode;\n /** @deprecated Use `typographyVariant` instead */\n passThroughProps?: Partial<React.ComponentPropsWithoutRef<typeof Typography>>;\n typographyVariant?: TypographyVariants;\n};\n\nconst TooltipHeader = ({\n children,\n passThroughProps,\n typographyVariant = 'subheading-medium',\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'span', TooltipHeaderProps>) => {\n const context = useTooltipContext();\n\n const classes = classNames('ndl-tooltip-header', className);\n\n if (!context.isOpen) {\n return null;\n }\n\n return (\n <Typography\n ref={ref}\n variant={typographyVariant}\n className={classes}\n style={style}\n htmlAttributes={htmlAttributes}\n {...passThroughProps}\n {...restProps}\n >\n {children}\n </Typography>\n );\n};\n\nexport type TooltipBodyProps = {\n /** Content displayed inside the body */\n children: React.ReactNode;\n /** Additional props to pass to the Typography component */\n // TODO v5: Deprecate passThroughProps and use restProps instead\n passThroughProps?: Partial<React.ComponentPropsWithoutRef<typeof Typography>>;\n};\n\nconst TooltipBody = ({\n children,\n className,\n style,\n htmlAttributes,\n passThroughProps,\n ref,\n ...restProps\n}: CommonProps<'span', TooltipBodyProps>) => {\n const context = useTooltipContext();\n\n const classes = classNames('ndl-tooltip-body', className);\n if (!context.isOpen) {\n return null;\n }\n\n return (\n <Typography\n ref={ref}\n variant=\"body-medium\"\n className={classes}\n style={style}\n htmlAttributes={htmlAttributes}\n {...passThroughProps}\n {...restProps}\n >\n {children}\n </Typography>\n );\n};\n\ntype ToolTipActionsProps = {\n /** Content displayed inside the actions container */\n children: React.ReactNode;\n};\n\nconst Actions = ({\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'div', ToolTipActionsProps>) => {\n const context = useTooltipContext();\n const mergedRefs = useMergeRefs([context.refs.setFloating, ref]);\n\n if (!context.isOpen) {\n return null;\n }\n\n const classes = classNames('ndl-tooltip-actions', className);\n\n return (\n <div\n className={classes}\n ref={mergedRefs}\n style={style}\n {...restProps}\n {...htmlAttributes}\n >\n {children}\n </div>\n );\n};\n\nconst Tooltip = Object.assign(TooltipComponent, {\n Actions: Actions,\n Body: TooltipBody,\n Content: TooltipContent,\n Header: TooltipHeader,\n Trigger: TooltipTrigger,\n});\n\nexport { Tooltip };\n"]}
1
+ {"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../../src/tooltip/Tooltip.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 {\n type AutoUpdateOptions,\n FloatingFocusManager,\n FloatingPortal,\n type Placement,\n type UseFloatingOptions,\n useMergeRefs,\n} from '@floating-ui/react';\nimport classNames from 'classnames';\nimport React, { useEffect } from 'react';\n\nimport { type CommonProps } from '../_common/types';\nimport { ConditionalWrap } from '../conditional-wrap';\nimport { useIsInsideDialog } from '../dialog/dialog-context';\nimport { useNeedleTheme } from '../theme';\nimport { Typography, type TypographyVariants } from '../typography';\nimport { TooltipContext, useTooltip, useTooltipContext } from './use-tooltip';\n\nexport type TooltipProps = {\n /** Content displayed inside the tooltip. Wraps `Tooltip.Trigger`, `Tooltip.Content`, and optional parts */\n children: React.ReactNode;\n /** Whether the tooltip is disabled */\n isDisabled?: boolean;\n /** Whether the tooltip should be open on first render */\n isInitialOpen?: boolean;\n /** Placement of the tooltip content relative to the trigger */\n placement?: Placement;\n /** Controls the open state . If omitted, the tooltip manages its own state */\n isOpen?: boolean;\n /** Visual style of the tooltip content. `simple` renders plain text, `rich` renders a composable panel */\n type: 'simple' | 'rich';\n /** Whether the content is rendered in a portal. */\n isPortaled?: boolean;\n /** Callback fired when the open state changes, if omitted, the tooltip manages its own state using internal hooks */\n onOpenChange?: UseFloatingOptions['onOpenChange'];\n /** Positioning strategy of the tooltip. Defaults to `fixed` when inside a dialog, otherwise `absolute` */\n floatingStrategy?: 'absolute' | 'fixed';\n /** Hover open/close delays in milliseconds */\n hoverDelay?: {\n open: number;\n close: number;\n };\n /** Whether the tooltip should close when the reference element is clicked. Useful when the trigger moves after click. */\n shouldCloseOnReferenceClick?: boolean;\n autoUpdateOptions?: AutoUpdateOptions;\n};\n\nconst TooltipComponent = ({\n children,\n isDisabled = false,\n type,\n isInitialOpen,\n placement,\n isOpen,\n onOpenChange,\n isPortaled: isPortaledProp,\n floatingStrategy: strategyProp,\n hoverDelay,\n shouldCloseOnReferenceClick,\n autoUpdateOptions,\n}: TooltipProps) => {\n const isInsideDialog = useIsInsideDialog();\n const strategy = isInsideDialog ? 'fixed' : 'absolute';\n const isPortaled = !isInsideDialog;\n\n const tooltip = useTooltip({\n autoUpdateOptions,\n hoverDelay,\n isDisabled,\n isInitialOpen,\n // if isDisabled is true tooltip will not open otherwise either controlled or uncontrolled depending on if isOpen is passed\n isOpen: isDisabled === true ? false : isOpen,\n isPortaled: isPortaledProp ?? isPortaled,\n onOpenChange,\n placement,\n shouldCloseOnReferenceClick,\n strategy: strategyProp ?? strategy,\n type,\n });\n\n return (\n <TooltipContext.Provider value={tooltip}>\n {children}\n </TooltipContext.Provider>\n );\n};\n\nTooltipComponent.displayName = 'Tooltip';\n\ntype TooltipTriggerProps = {\n /** Content displayed inside the trigger element */\n children: React.ReactNode;\n /** Whether the trigger element can be any element without an extra button wrapper. The child element will be cloned with the necessary trigger props and merged refs */\n hasButtonWrapper?: boolean;\n};\n\nconst TooltipTrigger = ({\n children,\n hasButtonWrapper = false,\n htmlAttributes,\n className,\n style,\n ref,\n ...restProps\n}: CommonProps<'button', TooltipTriggerProps>) => {\n const context = useTooltipContext();\n\n // Example from floating-ui\n // oxlint-disable-next-line @typescript-eslint/no-explicit-any\n const childrenProps = (children as any).props;\n const mergedRefs = useMergeRefs([\n context.refs.setReference,\n ref,\n childrenProps?.ref,\n ]);\n\n const triggerClasses = classNames(\n {\n 'ndl-closed': !context.isOpen,\n 'ndl-open': context.isOpen,\n },\n 'ndl-tooltip-trigger',\n className,\n );\n\n // `hasButtonWrapper=true` allows the user to pass any element as the anchor\n if (hasButtonWrapper && React.isValidElement(children)) {\n const props: Record<string, unknown> = {\n className: triggerClasses,\n ...htmlAttributes,\n ...childrenProps,\n ref: mergedRefs,\n };\n return React.cloneElement(children, context.getReferenceProps(props));\n }\n\n return (\n <button\n type=\"button\"\n className={triggerClasses}\n style={style}\n ref={mergedRefs}\n {...context.getReferenceProps(htmlAttributes)}\n {...restProps}\n >\n {children}\n </button>\n );\n};\n\ntype TooltipContentProps = {\n /** Content displayed inside the tooltip */\n children: React.ReactNode;\n};\n\nconst TooltipContent = ({\n children,\n style,\n htmlAttributes,\n className,\n ref,\n ...restProps\n}: CommonProps<'div', TooltipContentProps>) => {\n const context = useTooltipContext();\n const mergedRef = useMergeRefs([context.refs.setFloating, ref]);\n const { themeClassName } = useNeedleTheme();\n\n const hasHeaderChild = React.useMemo(() => {\n if (context.type !== 'rich') {\n return false;\n }\n const childrenArray = React.Children.toArray(children);\n return childrenArray.some(\n (child) => React.isValidElement(child) && child.type === TooltipHeader,\n );\n }, [children, context.type]);\n\n if (!context.isOpen) {\n return null;\n }\n\n const classes = classNames('ndl-tooltip-content', themeClassName, className, {\n 'ndl-tooltip-content-rich': context.type === 'rich',\n 'ndl-tooltip-content-simple': context.type === 'simple',\n });\n\n if (context.type === 'simple') {\n return (\n <ConditionalWrap\n shouldWrap={context.isPortaled}\n wrap={(wrapChildren) => <FloatingPortal>{wrapChildren}</FloatingPortal>}\n >\n <div\n ref={mergedRef}\n className={classes}\n style={{\n ...context.floatingStyles,\n ...style,\n }}\n {...restProps}\n {...context.getFloatingProps(htmlAttributes)}\n >\n <Typography variant=\"body-medium\">{children}</Typography>\n </div>\n </ConditionalWrap>\n );\n }\n\n const ariaLabelledBy =\n htmlAttributes?.['aria-labelledby'] ??\n (hasHeaderChild ? context.headerId : undefined);\n\n if (htmlAttributes?.['aria-label'] === undefined && !ariaLabelledBy) {\n console.warn(\n 'The rich Tooltip is missing aria-label and Header. Please add one of them for accessibility.',\n );\n }\n\n return (\n <ConditionalWrap\n shouldWrap={context.isPortaled}\n wrap={(wrapChildren) => <FloatingPortal>{wrapChildren}</FloatingPortal>}\n >\n <FloatingFocusManager\n context={context.context}\n returnFocus={true}\n modal={false}\n initialFocus={0}\n closeOnFocusOut\n >\n <div\n ref={mergedRef}\n className={classes}\n style={{\n ...context.floatingStyles,\n ...style,\n }}\n {...restProps}\n {...context.getFloatingProps({\n ...htmlAttributes,\n 'aria-labelledby': ariaLabelledBy,\n })}\n >\n {children}\n </div>\n </FloatingFocusManager>\n </ConditionalWrap>\n );\n};\n\ntype TooltipHeaderProps = {\n /** Content displayed inside the header */\n children: React.ReactNode;\n /** @deprecated Use `typographyVariant` instead */\n passThroughProps?: Partial<React.ComponentPropsWithoutRef<typeof Typography>>;\n typographyVariant?: TypographyVariants;\n};\n\nconst TooltipHeader = ({\n children,\n passThroughProps,\n typographyVariant = 'subheading-medium',\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'span', TooltipHeaderProps>) => {\n const context = useTooltipContext();\n\n const classes = classNames('ndl-tooltip-header', className);\n\n useEffect(() => {\n if (Boolean(htmlAttributes?.id) === true) {\n context.setHeaderId?.(htmlAttributes?.id);\n }\n }, [context, htmlAttributes?.id]);\n\n if (!context.isOpen) {\n return null;\n }\n\n return (\n <Typography\n ref={ref}\n variant={typographyVariant}\n className={classes}\n style={style}\n htmlAttributes={{ ...htmlAttributes, id: context.headerId }}\n {...passThroughProps}\n {...restProps}\n >\n {children}\n </Typography>\n );\n};\n\nexport type TooltipBodyProps = {\n /** Content displayed inside the body */\n children: React.ReactNode;\n /** Additional props to pass to the Typography component */\n // TODO v5: Deprecate passThroughProps and use restProps instead\n passThroughProps?: Partial<React.ComponentPropsWithoutRef<typeof Typography>>;\n};\n\nconst TooltipBody = ({\n children,\n className,\n style,\n htmlAttributes,\n passThroughProps,\n ref,\n ...restProps\n}: CommonProps<'span', TooltipBodyProps>) => {\n const context = useTooltipContext();\n\n const classes = classNames('ndl-tooltip-body', className);\n if (!context.isOpen) {\n return null;\n }\n\n return (\n <Typography\n ref={ref}\n variant=\"body-medium\"\n className={classes}\n style={style}\n htmlAttributes={htmlAttributes}\n {...passThroughProps}\n {...restProps}\n >\n {children}\n </Typography>\n );\n};\n\ntype ToolTipActionsProps = {\n /** Content displayed inside the actions container */\n children: React.ReactNode;\n};\n\nconst Actions = ({\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'div', ToolTipActionsProps>) => {\n const context = useTooltipContext();\n const mergedRefs = useMergeRefs([context.refs.setFloating, ref]);\n\n if (!context.isOpen) {\n return null;\n }\n\n const classes = classNames('ndl-tooltip-actions', className);\n\n return (\n <div\n className={classes}\n ref={mergedRefs}\n style={style}\n {...restProps}\n {...htmlAttributes}\n >\n {children}\n </div>\n );\n};\n\nActions.displayName = 'Tooltip.Actions';\n\nconst Tooltip = Object.assign(TooltipComponent, {\n Actions: Actions,\n Body: TooltipBody,\n Content: TooltipContent,\n Header: TooltipHeader,\n Trigger: TooltipTrigger,\n});\n\nexport { Tooltip };\n"]}
@@ -23,7 +23,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
23
23
  return (mod && mod.__esModule) ? mod : { "default": mod };
24
24
  };
25
25
  Object.defineProperty(exports, "__esModule", { value: true });
26
- exports.TooltipWithKeyboardShortcutSource = exports.TooltipRichLinkSource = exports.TooltipRichSource = exports.TooltipTriggerButtonWrapperSource = exports.TooltipHoverDelaySource = exports.TooltipInDialogSource = exports.TooltipPlacementsSource = exports.TooltipInitialOpenSource = exports.TooltipControlledSource = exports.TooltipDisabledSource = exports.TooltipDefaultSource = exports.TooltipWithKeyboardShortcut = exports.TooltipRichLink = exports.TooltipRich = exports.TooltipTriggerButtonWrapper = exports.TooltipHoverDelay = exports.TooltipInDialog = exports.TooltipPlacements = exports.TooltipInitialOpen = exports.TooltipControlled = exports.TooltipDisabled = exports.TooltipDefault = void 0;
26
+ exports.TooltipWithKeyboardShortcutSource = exports.TooltipTriggerButtonWrapperSource = exports.TooltipRichLinkSource = exports.TooltipRichActionsSource = exports.TooltipRichSource = exports.TooltipHoverDelaySource = exports.TooltipInDialogSource = exports.TooltipPlacementsSource = exports.TooltipInitialOpenSource = exports.TooltipControlledSource = exports.TooltipDisabledSource = exports.TooltipDefaultSource = exports.TooltipWithKeyboardShortcut = exports.TooltipRichLink = exports.TooltipRichActions = exports.TooltipRich = exports.TooltipTriggerButtonWrapper = exports.TooltipHoverDelay = exports.TooltipInDialog = exports.TooltipPlacements = exports.TooltipInitialOpen = exports.TooltipControlled = exports.TooltipDisabled = exports.TooltipDefault = void 0;
27
27
  var tooltip_default_story_1 = require("./tooltip-default.story");
28
28
  Object.defineProperty(exports, "TooltipDefault", { enumerable: true, get: function () { return __importDefault(tooltip_default_story_1).default; } });
29
29
  var tooltip_disabled_story_1 = require("./tooltip-disabled.story");
@@ -42,6 +42,8 @@ var tooltip_trigger_button_wrapper_story_1 = require("./tooltip-trigger-button-w
42
42
  Object.defineProperty(exports, "TooltipTriggerButtonWrapper", { enumerable: true, get: function () { return __importDefault(tooltip_trigger_button_wrapper_story_1).default; } });
43
43
  var tooltip_rich_story_1 = require("./tooltip-rich.story");
44
44
  Object.defineProperty(exports, "TooltipRich", { enumerable: true, get: function () { return __importDefault(tooltip_rich_story_1).default; } });
45
+ var tooltip_rich_actions_story_1 = require("./tooltip-rich-actions.story");
46
+ Object.defineProperty(exports, "TooltipRichActions", { enumerable: true, get: function () { return __importDefault(tooltip_rich_actions_story_1).default; } });
45
47
  var tooltip_rich_link_story_1 = require("./tooltip-rich-link.story");
46
48
  Object.defineProperty(exports, "TooltipRichLink", { enumerable: true, get: function () { return __importDefault(tooltip_rich_link_story_1).default; } });
47
49
  var tooltip_with_keyboard_shortcut_story_1 = require("./tooltip-with-keyboard-shortcut.story");
@@ -55,6 +57,7 @@ const tooltip_in_dialog_story_raw_1 = __importDefault(require("./tooltip-in-dial
55
57
  const tooltip_initial_open_story_raw_1 = __importDefault(require("./tooltip-initial-open.story?raw"));
56
58
  const tooltip_placements_story_raw_1 = __importDefault(require("./tooltip-placements.story?raw"));
57
59
  const tooltip_rich_story_raw_1 = __importDefault(require("./tooltip-rich.story?raw"));
60
+ const tooltip_rich_actions_story_raw_1 = __importDefault(require("./tooltip-rich-actions.story?raw"));
58
61
  const tooltip_rich_link_story_raw_1 = __importDefault(require("./tooltip-rich-link.story?raw"));
59
62
  const tooltip_trigger_button_wrapper_story_raw_1 = __importDefault(require("./tooltip-trigger-button-wrapper.story?raw"));
60
63
  const tooltip_with_keyboard_shortcut_story_raw_1 = __importDefault(require("./tooltip-with-keyboard-shortcut.story?raw"));
@@ -65,8 +68,9 @@ exports.TooltipInitialOpenSource = (0, export_stories_utils_1.removeLicenseHeade
65
68
  exports.TooltipPlacementsSource = (0, export_stories_utils_1.removeLicenseHeader)(tooltip_placements_story_raw_1.default);
66
69
  exports.TooltipInDialogSource = (0, export_stories_utils_1.removeLicenseHeader)(tooltip_in_dialog_story_raw_1.default);
67
70
  exports.TooltipHoverDelaySource = (0, export_stories_utils_1.removeLicenseHeader)(tooltip_hover_delay_story_raw_1.default);
68
- exports.TooltipTriggerButtonWrapperSource = (0, export_stories_utils_1.removeLicenseHeader)(tooltip_trigger_button_wrapper_story_raw_1.default);
69
71
  exports.TooltipRichSource = (0, export_stories_utils_1.removeLicenseHeader)(tooltip_rich_story_raw_1.default);
72
+ exports.TooltipRichActionsSource = (0, export_stories_utils_1.removeLicenseHeader)(tooltip_rich_actions_story_raw_1.default);
70
73
  exports.TooltipRichLinkSource = (0, export_stories_utils_1.removeLicenseHeader)(tooltip_rich_link_story_raw_1.default);
74
+ exports.TooltipTriggerButtonWrapperSource = (0, export_stories_utils_1.removeLicenseHeader)(tooltip_trigger_button_wrapper_story_raw_1.default);
71
75
  exports.TooltipWithKeyboardShortcutSource = (0, export_stories_utils_1.removeLicenseHeader)(tooltip_with_keyboard_shortcut_story_raw_1.default);
72
76
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/tooltip/stories/index.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;;;;AAEH,iEAAoE;AAA3D,wIAAA,OAAO,OAAkB;AAClC,mEAAsE;AAA7D,0IAAA,OAAO,OAAmB;AACnC,uEAA0E;AAAjE,8IAAA,OAAO,OAAqB;AACrC,2EAA6E;AAApE,iJAAA,OAAO,OAAsB;AACtC,uEAA0E;AAAjE,8IAAA,OAAO,OAAqB;AACrC,qEAAuE;AAA9D,2IAAA,OAAO,OAAmB;AACnC,yEAA2E;AAAlE,+IAAA,OAAO,OAAqB;AACrC,+FAAgG;AAAvF,oKAAA,OAAO,OAA+B;AAC/C,2DAA8D;AAArD,kIAAA,OAAO,OAAe;AAC/B,qEAAuE;AAA9D,2IAAA,OAAO,OAAmB;AACnC,+FAAgG;AAAvF,oKAAA,OAAO,OAA+B;AAE/C,6EAAyE;AACzE,kGAAwE;AACxE,4FAAkE;AAClE,8FAAoE;AACpE,oGAAyE;AACzE,gGAAqE;AACrE,sGAA2E;AAC3E,kGAAwE;AACxE,sFAA4D;AAC5D,gGAAqE;AACrE,0HAA8F;AAC9F,0HAA8F;AAEjF,QAAA,oBAAoB,GAAG,IAAA,0CAAmB,EACrD,mCAAuB,CACxB,CAAC;AACW,QAAA,qBAAqB,GAAG,IAAA,0CAAmB,EACtD,oCAAwB,CACzB,CAAC;AACW,QAAA,uBAAuB,GAAG,IAAA,0CAAmB,EACxD,sCAA0B,CAC3B,CAAC;AACW,QAAA,wBAAwB,GAAG,IAAA,0CAAmB,EACzD,wCAA2B,CAC5B,CAAC;AACW,QAAA,uBAAuB,GAAG,IAAA,0CAAmB,EACxD,sCAA0B,CAC3B,CAAC;AACW,QAAA,qBAAqB,GAAG,IAAA,0CAAmB,EACtD,qCAAwB,CACzB,CAAC;AACW,QAAA,uBAAuB,GAAG,IAAA,0CAAmB,EACxD,uCAA0B,CAC3B,CAAC;AACW,QAAA,iCAAiC,GAAG,IAAA,0CAAmB,EAClE,kDAAoC,CACrC,CAAC;AACW,QAAA,iBAAiB,GAAG,IAAA,0CAAmB,EAAC,gCAAoB,CAAC,CAAC;AAC9D,QAAA,qBAAqB,GAAG,IAAA,0CAAmB,EACtD,qCAAwB,CACzB,CAAC;AACW,QAAA,iCAAiC,GAAG,IAAA,0CAAmB,EAClE,kDAAoC,CACrC,CAAC","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\nexport { default as TooltipDefault } from './tooltip-default.story';\nexport { default as TooltipDisabled } from './tooltip-disabled.story';\nexport { default as TooltipControlled } from './tooltip-controlled.story';\nexport { default as TooltipInitialOpen } from './tooltip-initial-open.story';\nexport { default as TooltipPlacements } from './tooltip-placements.story';\nexport { default as TooltipInDialog } from './tooltip-in-dialog.story';\nexport { default as TooltipHoverDelay } from './tooltip-hover-delay.story';\nexport { default as TooltipTriggerButtonWrapper } from './tooltip-trigger-button-wrapper.story';\nexport { default as TooltipRich } from './tooltip-rich.story';\nexport { default as TooltipRichLink } from './tooltip-rich-link.story';\nexport { default as TooltipWithKeyboardShortcut } from './tooltip-with-keyboard-shortcut.story';\n\nimport { removeLicenseHeader } from '../../_common/export-stories-utils';\nimport TooltipControlledSourceRaw from './tooltip-controlled.story?raw';\nimport TooltipDefaultSourceRaw from './tooltip-default.story?raw';\nimport TooltipDisabledSourceRaw from './tooltip-disabled.story?raw';\nimport TooltipHoverDelaySourceRaw from './tooltip-hover-delay.story?raw';\nimport TooltipInDialogSourceRaw from './tooltip-in-dialog.story?raw';\nimport TooltipInitialOpenSourceRaw from './tooltip-initial-open.story?raw';\nimport TooltipPlacementsSourceRaw from './tooltip-placements.story?raw';\nimport TooltipRichSourceRaw from './tooltip-rich.story?raw';\nimport TooltipRichLinkSourceRaw from './tooltip-rich-link.story?raw';\nimport TooltipTriggerButtonWrapperSourceRaw from './tooltip-trigger-button-wrapper.story?raw';\nimport TooltipWithKeyboardShortcutSourceRaw from './tooltip-with-keyboard-shortcut.story?raw';\n\nexport const TooltipDefaultSource = removeLicenseHeader(\n TooltipDefaultSourceRaw,\n);\nexport const TooltipDisabledSource = removeLicenseHeader(\n TooltipDisabledSourceRaw,\n);\nexport const TooltipControlledSource = removeLicenseHeader(\n TooltipControlledSourceRaw,\n);\nexport const TooltipInitialOpenSource = removeLicenseHeader(\n TooltipInitialOpenSourceRaw,\n);\nexport const TooltipPlacementsSource = removeLicenseHeader(\n TooltipPlacementsSourceRaw,\n);\nexport const TooltipInDialogSource = removeLicenseHeader(\n TooltipInDialogSourceRaw,\n);\nexport const TooltipHoverDelaySource = removeLicenseHeader(\n TooltipHoverDelaySourceRaw,\n);\nexport const TooltipTriggerButtonWrapperSource = removeLicenseHeader(\n TooltipTriggerButtonWrapperSourceRaw,\n);\nexport const TooltipRichSource = removeLicenseHeader(TooltipRichSourceRaw);\nexport const TooltipRichLinkSource = removeLicenseHeader(\n TooltipRichLinkSourceRaw,\n);\nexport const TooltipWithKeyboardShortcutSource = removeLicenseHeader(\n TooltipWithKeyboardShortcutSourceRaw,\n);\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/tooltip/stories/index.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;;;;AAEH,iEAAoE;AAA3D,wIAAA,OAAO,OAAkB;AAClC,mEAAsE;AAA7D,0IAAA,OAAO,OAAmB;AACnC,uEAA0E;AAAjE,8IAAA,OAAO,OAAqB;AACrC,2EAA6E;AAApE,iJAAA,OAAO,OAAsB;AACtC,uEAA0E;AAAjE,8IAAA,OAAO,OAAqB;AACrC,qEAAuE;AAA9D,2IAAA,OAAO,OAAmB;AACnC,yEAA2E;AAAlE,+IAAA,OAAO,OAAqB;AACrC,+FAAgG;AAAvF,oKAAA,OAAO,OAA+B;AAC/C,2DAA8D;AAArD,kIAAA,OAAO,OAAe;AAC/B,2EAA6E;AAApE,iJAAA,OAAO,OAAsB;AACtC,qEAAuE;AAA9D,2IAAA,OAAO,OAAmB;AACnC,+FAAgG;AAAvF,oKAAA,OAAO,OAA+B;AAE/C,6EAAyE;AACzE,kGAAwE;AACxE,4FAAkE;AAClE,8FAAoE;AACpE,oGAAyE;AACzE,gGAAqE;AACrE,sGAA2E;AAC3E,kGAAwE;AACxE,sFAA4D;AAC5D,sGAA2E;AAC3E,gGAAqE;AACrE,0HAA8F;AAC9F,0HAA8F;AAEjF,QAAA,oBAAoB,GAAG,IAAA,0CAAmB,EACrD,mCAAuB,CACxB,CAAC;AACW,QAAA,qBAAqB,GAAG,IAAA,0CAAmB,EACtD,oCAAwB,CACzB,CAAC;AACW,QAAA,uBAAuB,GAAG,IAAA,0CAAmB,EACxD,sCAA0B,CAC3B,CAAC;AACW,QAAA,wBAAwB,GAAG,IAAA,0CAAmB,EACzD,wCAA2B,CAC5B,CAAC;AACW,QAAA,uBAAuB,GAAG,IAAA,0CAAmB,EACxD,sCAA0B,CAC3B,CAAC;AACW,QAAA,qBAAqB,GAAG,IAAA,0CAAmB,EACtD,qCAAwB,CACzB,CAAC;AACW,QAAA,uBAAuB,GAAG,IAAA,0CAAmB,EACxD,uCAA0B,CAC3B,CAAC;AACW,QAAA,iBAAiB,GAAG,IAAA,0CAAmB,EAAC,gCAAoB,CAAC,CAAC;AAC9D,QAAA,wBAAwB,GAAG,IAAA,0CAAmB,EACzD,wCAA2B,CAC5B,CAAC;AACW,QAAA,qBAAqB,GAAG,IAAA,0CAAmB,EACtD,qCAAwB,CACzB,CAAC;AACW,QAAA,iCAAiC,GAAG,IAAA,0CAAmB,EAClE,kDAAoC,CACrC,CAAC;AACW,QAAA,iCAAiC,GAAG,IAAA,0CAAmB,EAClE,kDAAoC,CACrC,CAAC","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\nexport { default as TooltipDefault } from './tooltip-default.story';\nexport { default as TooltipDisabled } from './tooltip-disabled.story';\nexport { default as TooltipControlled } from './tooltip-controlled.story';\nexport { default as TooltipInitialOpen } from './tooltip-initial-open.story';\nexport { default as TooltipPlacements } from './tooltip-placements.story';\nexport { default as TooltipInDialog } from './tooltip-in-dialog.story';\nexport { default as TooltipHoverDelay } from './tooltip-hover-delay.story';\nexport { default as TooltipTriggerButtonWrapper } from './tooltip-trigger-button-wrapper.story';\nexport { default as TooltipRich } from './tooltip-rich.story';\nexport { default as TooltipRichActions } from './tooltip-rich-actions.story';\nexport { default as TooltipRichLink } from './tooltip-rich-link.story';\nexport { default as TooltipWithKeyboardShortcut } from './tooltip-with-keyboard-shortcut.story';\n\nimport { removeLicenseHeader } from '../../_common/export-stories-utils';\nimport TooltipControlledSourceRaw from './tooltip-controlled.story?raw';\nimport TooltipDefaultSourceRaw from './tooltip-default.story?raw';\nimport TooltipDisabledSourceRaw from './tooltip-disabled.story?raw';\nimport TooltipHoverDelaySourceRaw from './tooltip-hover-delay.story?raw';\nimport TooltipInDialogSourceRaw from './tooltip-in-dialog.story?raw';\nimport TooltipInitialOpenSourceRaw from './tooltip-initial-open.story?raw';\nimport TooltipPlacementsSourceRaw from './tooltip-placements.story?raw';\nimport TooltipRichSourceRaw from './tooltip-rich.story?raw';\nimport TooltipRichActionsSourceRaw from './tooltip-rich-actions.story?raw';\nimport TooltipRichLinkSourceRaw from './tooltip-rich-link.story?raw';\nimport TooltipTriggerButtonWrapperSourceRaw from './tooltip-trigger-button-wrapper.story?raw';\nimport TooltipWithKeyboardShortcutSourceRaw from './tooltip-with-keyboard-shortcut.story?raw';\n\nexport const TooltipDefaultSource = removeLicenseHeader(\n TooltipDefaultSourceRaw,\n);\nexport const TooltipDisabledSource = removeLicenseHeader(\n TooltipDisabledSourceRaw,\n);\nexport const TooltipControlledSource = removeLicenseHeader(\n TooltipControlledSourceRaw,\n);\nexport const TooltipInitialOpenSource = removeLicenseHeader(\n TooltipInitialOpenSourceRaw,\n);\nexport const TooltipPlacementsSource = removeLicenseHeader(\n TooltipPlacementsSourceRaw,\n);\nexport const TooltipInDialogSource = removeLicenseHeader(\n TooltipInDialogSourceRaw,\n);\nexport const TooltipHoverDelaySource = removeLicenseHeader(\n TooltipHoverDelaySourceRaw,\n);\nexport const TooltipRichSource = removeLicenseHeader(TooltipRichSourceRaw);\nexport const TooltipRichActionsSource = removeLicenseHeader(\n TooltipRichActionsSourceRaw,\n);\nexport const TooltipRichLinkSource = removeLicenseHeader(\n TooltipRichLinkSourceRaw,\n);\nexport const TooltipTriggerButtonWrapperSource = removeLicenseHeader(\n TooltipTriggerButtonWrapperSourceRaw,\n);\nexport const TooltipWithKeyboardShortcutSource = removeLicenseHeader(\n TooltipWithKeyboardShortcutSourceRaw,\n);\n"]}
@@ -0,0 +1,30 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ const jsx_runtime_1 = require("react/jsx-runtime");
4
+ /**
5
+ *
6
+ * Copyright (c) "Neo4j"
7
+ * Neo4j Sweden AB [http://neo4j.com]
8
+ *
9
+ * This file is part of Neo4j.
10
+ *
11
+ * Neo4j is free software: you can redistribute it and/or modify
12
+ * it under the terms of the GNU General Public License as published by
13
+ * the Free Software Foundation, either version 3 of the License, or
14
+ * (at your option) any later version.
15
+ *
16
+ * This program is distributed in the hope that it will be useful,
17
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
18
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
19
+ * GNU General Public License for more details.
20
+ *
21
+ * You should have received a copy of the GNU General Public License
22
+ * along with this program. If not, see <http://www.gnu.org/licenses/>.
23
+ */
24
+ require("@neo4j-ndl/base/lib/neo4j-ds-styles.css");
25
+ const react_1 = require("@neo4j-ndl/react");
26
+ const Component = () => {
27
+ return ((0, jsx_runtime_1.jsxs)(react_1.Tooltip, { type: "rich", children: [(0, jsx_runtime_1.jsx)(react_1.Tooltip.Trigger, { hasButtonWrapper: true, children: (0, jsx_runtime_1.jsx)(react_1.FilledButton, { size: "medium", children: "Click me!" }) }), (0, jsx_runtime_1.jsxs)(react_1.Tooltip.Content, { children: [(0, jsx_runtime_1.jsx)(react_1.Tooltip.Header, { children: "Header" }), (0, jsx_runtime_1.jsx)(react_1.Tooltip.Body, { children: "This rich tooltip demonstrates all the available subcomponents: Header, Body, and Actions." }), (0, jsx_runtime_1.jsxs)(react_1.Tooltip.Actions, { children: [(0, jsx_runtime_1.jsx)(react_1.OutlinedButton, { onClick: () => alert('Primary action'), children: "Action" }), (0, jsx_runtime_1.jsx)(react_1.TextButton, { onClick: () => alert('Secondary action'), children: "Action" })] })] })] }));
28
+ };
29
+ exports.default = Component;
30
+ //# sourceMappingURL=tooltip-rich-actions.story.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"tooltip-rich-actions.story.js","sourceRoot":"","sources":["../../../../src/tooltip/stories/tooltip-rich-actions.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAK0B;AAE1B,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,wBAAC,eAAO,IAAC,IAAI,EAAC,MAAM,aAClB,uBAAC,eAAO,CAAC,OAAO,IAAC,gBAAgB,kBAC/B,uBAAC,oBAAY,IAAC,IAAI,EAAC,QAAQ,0BAAyB,GACpC,EAClB,wBAAC,eAAO,CAAC,OAAO,eACd,uBAAC,eAAO,CAAC,MAAM,yBAAwB,EACvC,uBAAC,eAAO,CAAC,IAAI,6GAGE,EACf,wBAAC,eAAO,CAAC,OAAO,eACd,uBAAC,sBAAc,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,gBAAgB,CAAC,uBAErC,EACjB,uBAAC,kBAAU,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,kBAAkB,CAAC,uBAEvC,IACG,IACF,IACV,CACX,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","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 '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport {\n FilledButton,\n OutlinedButton,\n TextButton,\n Tooltip,\n} from '@neo4j-ndl/react';\n\nconst Component = () => {\n return (\n <Tooltip type=\"rich\">\n <Tooltip.Trigger hasButtonWrapper>\n <FilledButton size=\"medium\">Click me!</FilledButton>\n </Tooltip.Trigger>\n <Tooltip.Content>\n <Tooltip.Header>Header</Tooltip.Header>\n <Tooltip.Body>\n This rich tooltip demonstrates all the available subcomponents:\n Header, Body, and Actions.\n </Tooltip.Body>\n <Tooltip.Actions>\n <OutlinedButton onClick={() => alert('Primary action')}>\n Action\n </OutlinedButton>\n <TextButton onClick={() => alert('Secondary action')}>\n Action\n </TextButton>\n </Tooltip.Actions>\n </Tooltip.Content>\n </Tooltip>\n );\n};\n\nexport default Component;\n"]}
@@ -24,7 +24,7 @@ const jsx_runtime_1 = require("react/jsx-runtime");
24
24
  require("@neo4j-ndl/base/lib/neo4j-ds-styles.css");
25
25
  const react_1 = require("@neo4j-ndl/react");
26
26
  const Component = () => {
27
- return ((0, jsx_runtime_1.jsxs)(react_1.Tooltip, { type: "rich", children: [(0, jsx_runtime_1.jsx)(react_1.Tooltip.Trigger, { hasButtonWrapper: true, children: (0, jsx_runtime_1.jsx)(react_1.FilledButton, { size: "medium", children: "Click me!" }) }), (0, jsx_runtime_1.jsxs)(react_1.Tooltip.Content, { children: [(0, jsx_runtime_1.jsx)(react_1.Tooltip.Header, { children: "Header" }), (0, jsx_runtime_1.jsx)(react_1.Tooltip.Body, { children: "This rich tooltip demonstrates all the available subcomponents: Header, Body, and Actions." }), (0, jsx_runtime_1.jsxs)(react_1.Tooltip.Actions, { children: [(0, jsx_runtime_1.jsx)(react_1.OutlinedButton, { onClick: () => alert('Primary action'), children: "Action" }), (0, jsx_runtime_1.jsx)(react_1.TextButton, { onClick: () => alert('Secondary action'), children: "Action" })] })] })] }));
27
+ return ((0, jsx_runtime_1.jsxs)(react_1.Tooltip, { type: "rich", children: [(0, jsx_runtime_1.jsx)(react_1.Tooltip.Trigger, { hasButtonWrapper: true, children: (0, jsx_runtime_1.jsx)(react_1.FilledButton, { size: "medium", children: "Click me!" }) }), (0, jsx_runtime_1.jsxs)(react_1.Tooltip.Content, { children: [(0, jsx_runtime_1.jsx)(react_1.Tooltip.Header, { children: "Header" }), (0, jsx_runtime_1.jsx)(react_1.Tooltip.Body, { children: "This rich tooltip demonstrates all the available subcomponents: Header and Body, without Actions." })] })] }));
28
28
  };
29
29
  exports.default = Component;
30
30
  //# sourceMappingURL=tooltip-rich.story.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"tooltip-rich.story.js","sourceRoot":"","sources":["../../../../src/tooltip/stories/tooltip-rich.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAK0B;AAE1B,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,wBAAC,eAAO,IAAC,IAAI,EAAC,MAAM,aAClB,uBAAC,eAAO,CAAC,OAAO,IAAC,gBAAgB,kBAC/B,uBAAC,oBAAY,IAAC,IAAI,EAAC,QAAQ,0BAAyB,GACpC,EAClB,wBAAC,eAAO,CAAC,OAAO,eACd,uBAAC,eAAO,CAAC,MAAM,yBAAwB,EACvC,uBAAC,eAAO,CAAC,IAAI,6GAGE,EACf,wBAAC,eAAO,CAAC,OAAO,eACd,uBAAC,sBAAc,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,gBAAgB,CAAC,uBAErC,EACjB,uBAAC,kBAAU,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,kBAAkB,CAAC,uBAEvC,IACG,IACF,IACV,CACX,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","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 '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport {\n FilledButton,\n OutlinedButton,\n TextButton,\n Tooltip,\n} from '@neo4j-ndl/react';\n\nconst Component = () => {\n return (\n <Tooltip type=\"rich\">\n <Tooltip.Trigger hasButtonWrapper>\n <FilledButton size=\"medium\">Click me!</FilledButton>\n </Tooltip.Trigger>\n <Tooltip.Content>\n <Tooltip.Header>Header</Tooltip.Header>\n <Tooltip.Body>\n This rich tooltip demonstrates all the available subcomponents:\n Header, Body, and Actions.\n </Tooltip.Body>\n <Tooltip.Actions>\n <OutlinedButton onClick={() => alert('Primary action')}>\n Action\n </OutlinedButton>\n <TextButton onClick={() => alert('Secondary action')}>\n Action\n </TextButton>\n </Tooltip.Actions>\n </Tooltip.Content>\n </Tooltip>\n );\n};\n\nexport default Component;\n"]}
1
+ {"version":3,"file":"tooltip-rich.story.js","sourceRoot":"","sources":["../../../../src/tooltip/stories/tooltip-rich.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAyD;AAEzD,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,wBAAC,eAAO,IAAC,IAAI,EAAC,MAAM,aAClB,uBAAC,eAAO,CAAC,OAAO,IAAC,gBAAgB,kBAC/B,uBAAC,oBAAY,IAAC,IAAI,EAAC,QAAQ,0BAAyB,GACpC,EAClB,wBAAC,eAAO,CAAC,OAAO,eACd,uBAAC,eAAO,CAAC,MAAM,yBAAwB,EACvC,uBAAC,eAAO,CAAC,IAAI,oHAGE,IACC,IACV,CACX,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","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 '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { FilledButton, Tooltip } from '@neo4j-ndl/react';\n\nconst Component = () => {\n return (\n <Tooltip type=\"rich\">\n <Tooltip.Trigger hasButtonWrapper>\n <FilledButton size=\"medium\">Click me!</FilledButton>\n </Tooltip.Trigger>\n <Tooltip.Content>\n <Tooltip.Header>Header</Tooltip.Header>\n <Tooltip.Body>\n This rich tooltip demonstrates all the available subcomponents: Header\n and Body, without Actions.\n </Tooltip.Body>\n </Tooltip.Content>\n </Tooltip>\n );\n};\n\nexport default Component;\n"]}
@@ -25,9 +25,12 @@ exports.useTooltip = useTooltip;
25
25
  const react_1 = require("@floating-ui/react");
26
26
  const react_2 = require("react");
27
27
  function useTooltip({ isInitialOpen = false, placement = 'top', isOpen: controlledOpen, onOpenChange: setControlledOpen, type = 'simple', isPortaled = true, strategy = 'absolute', hoverDelay = undefined, shouldCloseOnReferenceClick = false, autoUpdateOptions, isDisabled = false, } = {}) {
28
+ const id = (0, react_2.useId)();
29
+ const [headerId, setHeaderId] = (0, react_2.useState)(id);
28
30
  const [isUncontrolledOpen, setIsUncontrolledOpen] = (0, react_2.useState)(isInitialOpen);
29
31
  const isOpen = controlledOpen !== null && controlledOpen !== void 0 ? controlledOpen : isUncontrolledOpen;
30
32
  const setOpen = setControlledOpen !== null && setControlledOpen !== void 0 ? setControlledOpen : setIsUncontrolledOpen;
33
+ const typeOpenedRef = (0, react_2.useRef)(null);
31
34
  const data = (0, react_1.useFloating)({
32
35
  middleware: [
33
36
  (0, react_1.offset)(5),
@@ -70,10 +73,22 @@ function useTooltip({ isInitialOpen = false, placement = 'top', isOpen: controll
70
73
  role: type === 'simple' ? 'tooltip' : 'dialog',
71
74
  });
72
75
  const interactions = (0, react_1.useInteractions)([hover, focus, dismiss, role, click]);
73
- return (0, react_2.useMemo)(() => (Object.assign(Object.assign({ isOpen,
74
- isPortaled,
76
+ const setTypeOpened = (type) => {
77
+ typeOpenedRef.current = type;
78
+ };
79
+ return (0, react_2.useMemo)(() => (Object.assign(Object.assign({ headerId: type === 'rich' ? headerId : undefined, isOpen,
80
+ isPortaled, setHeaderId: type === 'rich' ? setHeaderId : undefined, setOpen,
81
+ setTypeOpened,
82
+ type, typeOpened: typeOpenedRef.current }, interactions), data)), [
83
+ headerId,
84
+ isOpen,
75
85
  setOpen,
76
- type }, interactions), data)), [isOpen, setOpen, type, isPortaled, interactions, data]);
86
+ type,
87
+ typeOpenedRef,
88
+ isPortaled,
89
+ interactions,
90
+ data,
91
+ ]);
77
92
  }
78
93
  exports.TooltipContext = (0, react_2.createContext)(null);
79
94
  const useTooltipContext = () => {
@@ -1 +1 @@
1
- {"version":3,"file":"use-tooltip.js","sourceRoot":"","sources":["../../../src/tooltip/use-tooltip.ts"],"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 {\n autoUpdate,\n type AutoUpdateOptions,\n flip,\n offset,\n type Placement,\n type ReferenceType,\n safePolygon,\n shift,\n useClick,\n useDismiss,\n useFloating,\n type UseFloatingOptions,\n type UseFloatingReturn,\n useFocus,\n useHover,\n useInteractions,\n type UseInteractionsReturn,\n useRole,\n} from '@floating-ui/react';\nimport { createContext, useContext, useMemo, useState } from 'react';\n\nexport interface TooltipOptions {\n isInitialOpen?: boolean;\n placement?: Placement;\n isOpen?: boolean;\n onOpenChange?: UseFloatingOptions['onOpenChange'];\n type?: 'simple' | 'rich';\n isPortaled?: boolean;\n strategy?: 'fixed' | 'absolute';\n hoverDelay?: {\n open: number;\n close: number;\n };\n shouldCloseOnReferenceClick?: boolean;\n autoUpdateOptions?: AutoUpdateOptions;\n isDisabled?: boolean;\n}\n\nexport function useTooltip({\n isInitialOpen = false,\n placement = 'top',\n isOpen: controlledOpen,\n onOpenChange: setControlledOpen,\n type = 'simple',\n isPortaled = true,\n strategy = 'absolute',\n hoverDelay = undefined,\n shouldCloseOnReferenceClick = false,\n autoUpdateOptions,\n isDisabled = false,\n}: TooltipOptions = {}): {\n isOpen: boolean;\n setOpen: (open: boolean) => void;\n type: 'simple' | 'rich';\n isPortaled: boolean;\n} & UseInteractionsReturn &\n UseFloatingReturn<ReferenceType> {\n const [isUncontrolledOpen, setIsUncontrolledOpen] = useState(isInitialOpen);\n const isOpen = controlledOpen ?? isUncontrolledOpen;\n const setOpen = setControlledOpen ?? setIsUncontrolledOpen;\n\n const data = useFloating({\n middleware: [\n offset(5),\n flip({\n crossAxis: placement.includes('-'),\n fallbackAxisSideDirection: 'start',\n padding: 5,\n }),\n shift({ padding: 5 }),\n ],\n onOpenChange: setOpen,\n open: isOpen,\n placement,\n strategy,\n whileElementsMounted(referenceEl, floatingEl, update) {\n const cleanup = autoUpdate(referenceEl, floatingEl, update, {\n ...autoUpdateOptions,\n });\n return cleanup;\n },\n });\n\n const context = data.context;\n\n const hover = useHover(context, {\n delay: hoverDelay,\n enabled: type === 'simple' && !isDisabled,\n handleClose: safePolygon(),\n move: false,\n });\n const click = useClick(context, {\n enabled: type === 'rich' && !isDisabled,\n });\n const focus = useFocus(context, {\n enabled: type === 'simple' && !isDisabled,\n visibleOnly: true,\n });\n const dismiss = useDismiss(context, {\n escapeKey: true,\n outsidePress: true,\n referencePress: shouldCloseOnReferenceClick,\n });\n const role = useRole(context, {\n role: type === 'simple' ? 'tooltip' : 'dialog',\n });\n\n const interactions = useInteractions([hover, focus, dismiss, role, click]);\n\n return useMemo(\n () => ({\n isOpen,\n isPortaled,\n setOpen,\n type,\n ...interactions,\n ...data,\n }),\n [isOpen, setOpen, type, isPortaled, interactions, data],\n );\n}\n\ntype ContextType = ReturnType<typeof useTooltip> | null;\nexport const TooltipContext = createContext<ContextType>(null);\n\nexport const useTooltipContext = (): ReturnType<typeof useTooltip> => {\n const context = useContext(TooltipContext);\n\n if (context === null) {\n throw new Error('Tooltip components must be wrapped in <Tooltip />');\n }\n\n return context;\n};\n"]}
1
+ {"version":3,"file":"use-tooltip.js","sourceRoot":"","sources":["../../../src/tooltip/use-tooltip.ts"],"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 {\n autoUpdate,\n type AutoUpdateOptions,\n flip,\n offset,\n type Placement,\n type ReferenceType,\n safePolygon,\n shift,\n useClick,\n useDismiss,\n useFloating,\n type UseFloatingOptions,\n type UseFloatingReturn,\n useFocus,\n useHover,\n useInteractions,\n type UseInteractionsReturn,\n useRole,\n} from '@floating-ui/react';\nimport {\n createContext,\n useContext,\n useId,\n useMemo,\n useRef,\n useState,\n} from 'react';\n\nexport interface TooltipOptions {\n isInitialOpen?: boolean;\n placement?: Placement;\n isOpen?: boolean;\n onOpenChange?: UseFloatingOptions['onOpenChange'];\n type?: 'simple' | 'rich';\n isPortaled?: boolean;\n strategy?: 'fixed' | 'absolute';\n hoverDelay?: {\n open: number;\n close: number;\n };\n shouldCloseOnReferenceClick?: boolean;\n autoUpdateOptions?: AutoUpdateOptions;\n isDisabled?: boolean;\n typeOpened?: 'keyboard' | 'mouse';\n}\n\nexport function useTooltip({\n isInitialOpen = false,\n placement = 'top',\n isOpen: controlledOpen,\n onOpenChange: setControlledOpen,\n type = 'simple',\n isPortaled = true,\n strategy = 'absolute',\n hoverDelay = undefined,\n shouldCloseOnReferenceClick = false,\n autoUpdateOptions,\n isDisabled = false,\n}: TooltipOptions = {}): {\n headerId?: string;\n setHeaderId?: (id: string | undefined) => void;\n isOpen: boolean;\n setOpen: (open: boolean) => void;\n type: 'simple' | 'rich';\n isPortaled: boolean;\n typeOpened: 'keyboard' | 'mouse' | null;\n setTypeOpened: (type: 'keyboard' | 'mouse' | null) => void;\n} & UseInteractionsReturn &\n UseFloatingReturn<ReferenceType> {\n const id = useId();\n const [headerId, setHeaderId] = useState<string | undefined>(id);\n const [isUncontrolledOpen, setIsUncontrolledOpen] = useState(isInitialOpen);\n const isOpen = controlledOpen ?? isUncontrolledOpen;\n const setOpen = setControlledOpen ?? setIsUncontrolledOpen;\n const typeOpenedRef = useRef<'keyboard' | 'mouse'>(null);\n\n const data = useFloating({\n middleware: [\n offset(5),\n flip({\n crossAxis: placement.includes('-'),\n fallbackAxisSideDirection: 'start',\n padding: 5,\n }),\n shift({ padding: 5 }),\n ],\n onOpenChange: setOpen,\n open: isOpen,\n placement,\n strategy,\n whileElementsMounted(referenceEl, floatingEl, update) {\n const cleanup = autoUpdate(referenceEl, floatingEl, update, {\n ...autoUpdateOptions,\n });\n return cleanup;\n },\n });\n\n const context = data.context;\n\n const hover = useHover(context, {\n delay: hoverDelay,\n enabled: type === 'simple' && !isDisabled,\n handleClose: safePolygon(),\n move: false,\n });\n const click = useClick(context, {\n enabled: type === 'rich' && !isDisabled,\n });\n const focus = useFocus(context, {\n enabled: type === 'simple' && !isDisabled,\n visibleOnly: true,\n });\n const dismiss = useDismiss(context, {\n escapeKey: true,\n outsidePress: true,\n referencePress: shouldCloseOnReferenceClick,\n });\n const role = useRole(context, {\n role: type === 'simple' ? 'tooltip' : 'dialog',\n });\n\n const interactions = useInteractions([hover, focus, dismiss, role, click]);\n\n const setTypeOpened = (type: 'keyboard' | 'mouse' | null) => {\n typeOpenedRef.current = type;\n };\n\n return useMemo(\n () => ({\n headerId: type === 'rich' ? headerId : undefined,\n isOpen,\n isPortaled,\n setHeaderId: type === 'rich' ? setHeaderId : undefined,\n setOpen,\n setTypeOpened,\n type,\n typeOpened: typeOpenedRef.current,\n ...interactions,\n ...data,\n }),\n [\n headerId,\n isOpen,\n setOpen,\n type,\n typeOpenedRef,\n isPortaled,\n interactions,\n data,\n ],\n );\n}\n\ntype ContextType = ReturnType<typeof useTooltip> | null;\nexport const TooltipContext = createContext<ContextType>(null);\n\nexport const useTooltipContext = (): ReturnType<typeof useTooltip> => {\n const context = useContext(TooltipContext);\n\n if (context === null) {\n throw new Error('Tooltip components must be wrapped in <Tooltip />');\n }\n\n return context;\n};\n"]}
@@ -54,6 +54,7 @@ export const TimePicker = (_a) => {
54
54
  const [lastAction, setLastAction] = useState('type');
55
55
  const [error, setError] = useState(undefined);
56
56
  const errorTextId = useId();
57
+ const listboxId = useId();
57
58
  const timeOptions = useMemo(() => generateTimeOptions(is24Hour, timeInterval), [is24Hour, timeInterval]);
58
59
  const { themeClassName } = useNeedleTheme();
59
60
  const { isPopoverOpen, setIsPopoverOpen } = useTimePickerPopover(false);
@@ -237,7 +238,9 @@ export const TimePicker = (_a) => {
237
238
  const mergedRef = useMergeRefs([refs.setReference, containerRef]);
238
239
  return (_jsxs(_Fragment, { children: [_jsxs("div", Object.assign({ className: classNames('ndl-time-picker', className, Object.assign({}, classes)), ref: mergedRef }, getReferenceProps(), { style: {
239
240
  width: isFluid === true ? '100%' : 'fit-content',
240
- }, children: [_jsxs("label", { className: "ndl-time-picker-label", children: [label !== undefined && (_jsx(Typography, { variant: size === 'large' ? 'body-large' : 'body-medium', children: label })), _jsxs("div", { className: "ndl-time-picker-input-wrapper", style: Object.assign({ width: inputWidth }, style), children: [_jsx("input", Object.assign({ "aria-label": label, "aria-invalid": Boolean(errorToShow), "aria-describedby": errorToShow ? errorTextId : undefined, className: "ndl-time-picker-input", type: "text", ref: inputRef, value: inputValue, disabled: isDisabled, readOnly: isReadOnly, required: isRequired, onChange: newHandleInputChange, onKeyDown: handleKeyDown, onClick: () => {
241
+ }, children: [_jsxs("label", { className: "ndl-time-picker-label", children: [label !== undefined && (_jsx(Typography, { variant: size === 'large' ? 'body-large' : 'body-medium', children: label })), _jsxs("div", { className: "ndl-time-picker-input-wrapper", style: Object.assign({ width: inputWidth }, style), children: [_jsx("input", Object.assign({ role: "combobox", "aria-expanded": isPopoverOpen, "aria-controls": listboxId, "aria-activedescendant": isPopoverOpen && focusedIndex >= 0
242
+ ? `${listboxId}-option-${focusedIndex}`
243
+ : undefined, "aria-label": label, "aria-invalid": Boolean(errorToShow), "aria-describedby": errorToShow ? errorTextId : undefined, className: "ndl-time-picker-input", type: "text", ref: inputRef, value: inputValue, disabled: isDisabled, readOnly: isReadOnly, required: isRequired, onChange: newHandleInputChange, onKeyDown: handleKeyDown, onClick: () => {
241
244
  if (isReadOnly === true || isDisabled === true) {
242
245
  return;
243
246
  }
@@ -268,7 +271,7 @@ export const TimePicker = (_a) => {
268
271
  }
269
272
  }, placeholder: format, maxLength: is24Hour ? 5 : 8 }, restProps, htmlAttributes)), _jsx(ClockIconOutline, { className: "ndl-icon-svg ndl-time-picker-icon" })] })] }), errorToShow !== undefined && (_jsxs("div", { className: "ndl-time-picker-error-wrapper", role: "status", children: [_jsx(ExclamationCircleIconSolid, { className: "ndl-time-picker-error-icon" }), _jsx(Typography, { variant: size === 'large' ? 'body-medium' : 'body-small', className: "ndl-time-picker-error-text", htmlAttributes: { id: errorTextId }, children: errorToShow })] }))] })), context.open && (_jsx(ConditionalWrap, { shouldWrap: isPortaled, wrap: (wrapChildren) => (_jsx(FloatingPortal, { children: wrapChildren })), children: _jsx(FloatingFocusManager, { context: context, modal: false, initialFocus: -1, children: _jsx("div", Object.assign({ ref: refs.setFloating, className: classNames(themeClassName, 'ndl-time-picker-popover', Object.assign({}, classes)), style: Object.assign(Object.assign(Object.assign({}, transitionStyles), floatingStyles), { width: isFluid === true
270
273
  ? (_d = containerRef.current) === null || _d === void 0 ? void 0 : _d.clientWidth
271
- : undefined }) }, getFloatingProps(), { children: _jsx("ul", { ref: listRef, tabIndex: -1, children: timeOptions.map((time, i) => (_jsx("li", { role: "option", "aria-selected": (value === null || value === void 0 ? void 0 : value.toString(is24Hour)) === time ||
274
+ : undefined }) }, getFloatingProps(), { children: _jsx("ul", { ref: listRef, role: "listbox", id: listboxId, tabIndex: -1, children: timeOptions.map((time, i) => (_jsx("li", { id: `${listboxId}-option-${i}`, role: "option", "aria-selected": (value === null || value === void 0 ? void 0 : value.toString(is24Hour)) === time ||
272
275
  (editedInput === null || editedInput === void 0 ? void 0 : editedInput.toString(is24Hour)) === time, value: time, onClick: (e) => {
273
276
  e.stopPropagation();
274
277
  e.preventDefault();
@@ -1 +1 @@
1
- {"version":3,"file":"TimePicker.js","sourceRoot":"","sources":["../../../src/time-picker/TimePicker.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 {\n autoUpdate,\n flip,\n FloatingFocusManager,\n FloatingPortal,\n offset,\n shift,\n useDismiss,\n useFloating,\n useInteractions,\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 {\n useCallback,\n useEffect,\n useId,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from 'react';\n\nimport { type PolymorphicCommonProps } from '../_common/types';\nimport { ConditionalWrap } from '../conditional-wrap';\nimport { useIsInsideDialog } from '../dialog/dialog-context';\nimport { ClockIconOutline, ExclamationCircleIconSolid } from '../icons';\nimport { useNeedleTheme } from '../theme';\nimport { Typography } from '../typography';\nimport { generateTimeOptions } from './generate-time-options';\nimport { NeedleTime } from './needle-time';\nimport {\n useKeyboardNavigation,\n useTimePickerPopover,\n} from './time-picker-hooks';\n\nexport type TimeFormat = 'hh:mm' | 'hh:mm aa';\n\nexport type TimePickerProps = {\n /** The value of the time picker */\n value?: NeedleTime;\n /** The format of the time picker */\n format?: TimeFormat;\n /** Whether the time picker is fluid */\n isFluid?: boolean;\n /** Whether the time picker is read only */\n isReadOnly?: boolean;\n /** Whether the time picker is required */\n isRequired?: boolean;\n /** Whether the time picker is disabled */\n isDisabled?: boolean;\n /** The time interval of the time picker, in minutes */\n timeInterval?: number;\n /** The label of the time picker */\n label?: string;\n /** The size of the time picker */\n size?: 'small' | 'medium' | 'large';\n /** Manually set the error text */\n errorText?: string;\n /** Callback function triggered when the time picker value changes */\n onChange?: (time: NeedleTime) => void;\n /** Callback function triggered when the time picker encounters an error */\n onError?: (error: string, time: NeedleTime) => void;\n /**\n * Strategy for the dropdown floating element.\n * By default it is absolute, but if the component is inside of a needle Dialog, it is set to fixed.\n * If this prop is set, no auto-detection of Dialog is done.\n */\n floatingStrategy?: 'absolute' | 'fixed';\n /** Whether the dropdown element is rendered in a portal. */\n isPortaled?: boolean;\n};\n\nexport const TimePicker = <T extends React.ElementType = 'div'>({\n format = 'hh:mm',\n isDisabled,\n isFluid,\n isReadOnly,\n isRequired,\n value,\n timeInterval = 15,\n label,\n onChange,\n className,\n onError,\n style,\n size = 'medium',\n errorText,\n htmlAttributes,\n floatingStrategy,\n isPortaled: isPortaledProp,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, TimePickerProps>) => {\n const [editedInput, setEditedInput] = useState<NeedleTime | undefined>(value);\n\n const is24Hour = format === 'hh:mm';\n const [inputValue, setInputValue] = useState<string>(\n value?.toString(is24Hour) ?? '',\n );\n const listRef = useRef<HTMLUListElement>(null);\n const inputRef = useRef<HTMLInputElement>(null);\n useImperativeHandle(ref, () => inputRef.current as HTMLInputElement, []);\n const [lastAction, setLastAction] = useState<'type' | 'arrow'>('type');\n const [error, setError] = useState<string | undefined>(undefined);\n const errorTextId = useId();\n\n const timeOptions = useMemo(\n () => generateTimeOptions(is24Hour, timeInterval),\n [is24Hour, timeInterval],\n );\n\n const { themeClassName } = useNeedleTheme();\n const { isPopoverOpen, setIsPopoverOpen } = useTimePickerPopover(false);\n const { focusedIndex, setFocusedIndex, handleArrowNavigation } =\n useKeyboardNavigation(listRef, timeOptions.length);\n\n const errorToShow =\n errorText !== undefined && errorText !== '' ? errorText : error;\n\n const classes = {\n 'ndl-disabled': isDisabled,\n 'ndl-error': errorToShow !== undefined,\n 'ndl-fluid': isFluid,\n 'ndl-large': size === 'large',\n 'ndl-medium': size === 'medium',\n 'ndl-read-only': isReadOnly,\n 'ndl-small': size === 'small',\n };\n\n const inputWidth =\n isFluid === true ? '100%' : is24Hour === true ? '6rem' : '9rem';\n\n const isValidTime = useCallback((hours: number, minutes: number) => {\n if (hours > 23 || hours < 0) {\n return false;\n }\n\n if (minutes > 59 || minutes < 0) {\n return false;\n }\n\n return true;\n }, []);\n\n useEffect(() => {\n if (error !== undefined) {\n onError?.(error, NeedleTime.fromString(inputValue));\n }\n }, [error, inputValue, onError]);\n\n useEffect(() => {\n setEditedInput(value);\n setInputValue(value?.toString(is24Hour) ?? '');\n }, [is24Hour, value]);\n\n useEffect(() => {\n if (isPopoverOpen) {\n setTimeout(() => {\n listRef.current?.children[focusedIndex]?.scrollIntoView({\n block: 'center',\n inline: 'nearest',\n });\n }, 0);\n } else {\n setTimeout(() => {\n inputRef.current?.blur();\n const selectedIndex =\n timeOptions.indexOf(value?.toString(is24Hour) ?? '') ?? 0;\n setFocusedIndex(selectedIndex);\n }, 0);\n }\n }, [\n focusedIndex,\n is24Hour,\n isPopoverOpen,\n value,\n setFocusedIndex,\n timeOptions,\n ]);\n\n const handleOnClick = (timeText: string) => {\n if (onChange) {\n onChange(NeedleTime.fromString(timeText));\n }\n setError(undefined);\n setInputValue(timeText);\n setEditedInput(NeedleTime.fromString(timeText));\n setIsPopoverOpen(false);\n };\n const newHandleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n scrollToTime(e.target.value);\n setInputValue(e.target.value);\n setLastAction('type');\n\n const time = NeedleTime.fromString(e.target.value);\n if (!isValidTime(time.hour, time.minute)) {\n setError('Invalid time');\n } else {\n setError(undefined);\n }\n };\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (isReadOnly === true || isDisabled === true) {\n e.preventDefault();\n return;\n }\n\n if (e.key === 'Escape') {\n setIsPopoverOpen(false);\n }\n\n setIsPopoverOpen(true);\n\n if (e.key === 'Enter') {\n if (lastAction === 'type' && inputValue.length >= (is24Hour ? 5 : 6)) {\n const time = NeedleTime.fromString(inputValue);\n handleOnClick(time.toString(is24Hour));\n } else if (lastAction === 'type' && !inputValue.includes(':')) {\n const time = NeedleTime.fromString(inputValue);\n if (isValidTime(time.hour, time.minute)) {\n handleOnClick(time.toString(is24Hour));\n }\n setIsPopoverOpen(false);\n } else {\n handleOnClick(timeOptions[focusedIndex]);\n }\n } else if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {\n e.preventDefault();\n setLastAction('arrow');\n handleArrowNavigation(e.key);\n }\n };\n\n const scrollToTime = (startOfTime: string) => {\n const parsedTime = startOfTime.toLowerCase().replace(/[^0-9amp]/g, '');\n let index = -1;\n\n // Handle AM/PM input\n const isPM = parsedTime.includes('p');\n const isAM = parsedTime.includes('a');\n const timeDigits = parsedTime.replace(/[amp]/g, '');\n\n if (timeDigits.length === 1) {\n // Single digit - assume it's an hour\n const hour = `0${timeDigits}`;\n const searchTime = is24Hour\n ? `${hour}:00`\n : `${hour}:00 ${isPM ? 'PM' : 'AM'}`;\n index = timeOptions.indexOf(searchTime);\n } else {\n // Find closest matching time\n const closestTime = timeOptions.find((time) => {\n const timeWithoutSpecialChars = time\n .toLowerCase()\n .replace(/[^0-9amp]/g, '');\n if (isPM || isAM) {\n // If AM/PM specified, match that specifically\n return timeWithoutSpecialChars.startsWith(parsedTime);\n } else {\n // Otherwise just match the numbers\n return timeWithoutSpecialChars\n .replace(/[amp]/g, '')\n .startsWith(timeDigits);\n }\n });\n index = closestTime !== undefined ? timeOptions.indexOf(closestTime) : -1;\n }\n\n if (index !== -1) {\n setFocusedIndex(index);\n }\n\n return index;\n };\n\n /** Custom floating ui solution */\n const isInsideDialog = useIsInsideDialog();\n const isPortaled = isPortaledProp ?? !isInsideDialog;\n const containerRef = useRef<HTMLDivElement>(null);\n const { refs, floatingStyles, context } = useFloating({\n elements: {\n reference: containerRef.current,\n },\n middleware: [\n offset(10),\n flip({\n fallbackPlacements: ['top'],\n fallbackStrategy: 'bestFit',\n }),\n shift({ padding: 5 }),\n ],\n onOpenChange: (open) => {\n setIsPopoverOpen(open);\n },\n open: isDisabled !== true && isReadOnly !== true && isPopoverOpen,\n placement: 'bottom',\n strategy: floatingStrategy ?? (isInsideDialog ? 'fixed' : 'absolute'),\n whileElementsMounted: autoUpdate,\n });\n const dismiss = useDismiss(context);\n const { getReferenceProps, getFloatingProps } = useInteractions([dismiss]);\n const { styles: transitionStyles } = useTransitionStyles(context, {\n duration: Number.parseInt(tokens.motion.duration.quick) ?? 0,\n });\n\n const mergedRef = useMergeRefs([refs.setReference, containerRef]);\n\n return (\n <>\n <div\n className={classNames('ndl-time-picker', className, {\n ...classes,\n })}\n ref={mergedRef}\n {...getReferenceProps()}\n style={{\n width: isFluid === true ? '100%' : 'fit-content',\n }}\n >\n <label className=\"ndl-time-picker-label\">\n {label !== undefined && (\n <Typography\n variant={size === 'large' ? 'body-large' : 'body-medium'}\n >\n {label}\n </Typography>\n )}\n <div\n className=\"ndl-time-picker-input-wrapper\"\n style={{\n width: inputWidth,\n ...style,\n }}\n >\n <input\n aria-label={label} // TODO: handle label natively\n aria-invalid={Boolean(errorToShow)}\n aria-describedby={errorToShow ? errorTextId : undefined}\n className=\"ndl-time-picker-input\"\n type=\"text\"\n ref={inputRef}\n value={inputValue}\n disabled={isDisabled}\n readOnly={isReadOnly}\n required={isRequired}\n onChange={newHandleInputChange}\n onKeyDown={handleKeyDown}\n onClick={() => {\n if (isReadOnly === true || isDisabled === true) {\n return;\n }\n setIsPopoverOpen(true);\n }}\n onBlur={(e) => {\n if (isReadOnly === true || isDisabled === true) {\n return;\n }\n\n if (\n e.relatedTarget?.classList.contains(\n 'ndl-time-picker-popover-item',\n ) === true\n ) {\n return;\n }\n\n if (inputValue.length < 4) {\n setError('Invalid time');\n return;\n }\n\n const time = NeedleTime.fromString(inputValue);\n\n if (time === undefined || time === null) {\n setError('Invalid time');\n return;\n }\n\n if (!isValidTime(time.hour, time.minute)) {\n setError('Invalid time');\n } else {\n setError(undefined);\n setInputValue(time.toString(is24Hour));\n }\n }}\n placeholder={format}\n maxLength={is24Hour ? 5 : 8}\n {...restProps}\n {...htmlAttributes}\n />\n <ClockIconOutline className=\"ndl-icon-svg ndl-time-picker-icon\" />\n </div>\n </label>\n {errorToShow !== undefined && (\n <div className=\"ndl-time-picker-error-wrapper\" role=\"status\">\n <ExclamationCircleIconSolid className=\"ndl-time-picker-error-icon\" />\n <Typography\n variant={size === 'large' ? 'body-medium' : 'body-small'}\n className=\"ndl-time-picker-error-text\"\n htmlAttributes={{ id: errorTextId }}\n >\n {errorToShow}\n </Typography>\n </div>\n )}\n </div>\n\n {context.open && (\n <ConditionalWrap\n shouldWrap={isPortaled}\n wrap={(wrapChildren) => (\n <FloatingPortal>{wrapChildren}</FloatingPortal>\n )}\n >\n <FloatingFocusManager\n context={context}\n modal={false}\n initialFocus={-1}\n >\n <div\n ref={refs.setFloating}\n className={classNames(themeClassName, 'ndl-time-picker-popover', {\n ...classes,\n })}\n style={{\n ...transitionStyles,\n ...floatingStyles,\n width:\n isFluid === true\n ? containerRef.current?.clientWidth\n : undefined,\n }}\n {...getFloatingProps()}\n >\n <ul ref={listRef} tabIndex={-1}>\n {timeOptions.map((time, i) => (\n <li\n key={i}\n role=\"option\"\n aria-selected={\n value?.toString(is24Hour) === time ||\n editedInput?.toString(is24Hour) === time\n }\n value={time}\n onClick={(e) => {\n e.stopPropagation();\n e.preventDefault();\n handleOnClick(time);\n setIsPopoverOpen(false);\n }}\n onMouseDown={(e) => {\n e.stopPropagation();\n e.preventDefault();\n }}\n tabIndex={-1}\n className={classNames(\n focusedIndex === i ? 'focused' : '',\n 'ndl-time-picker-popover-item',\n )}\n onKeyDown={(e) => {\n if (e.key === 'Enter') {\n e.stopPropagation();\n handleOnClick(time);\n }\n }}\n >\n {time}\n </li>\n ))}\n </ul>\n </div>\n </FloatingFocusManager>\n </ConditionalWrap>\n )}\n </>\n );\n};\n"]}
1
+ {"version":3,"file":"TimePicker.js","sourceRoot":"","sources":["../../../src/time-picker/TimePicker.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 {\n autoUpdate,\n flip,\n FloatingFocusManager,\n FloatingPortal,\n offset,\n shift,\n useDismiss,\n useFloating,\n useInteractions,\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 {\n useCallback,\n useEffect,\n useId,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from 'react';\n\nimport { type PolymorphicCommonProps } from '../_common/types';\nimport { ConditionalWrap } from '../conditional-wrap';\nimport { useIsInsideDialog } from '../dialog/dialog-context';\nimport { ClockIconOutline, ExclamationCircleIconSolid } from '../icons';\nimport { useNeedleTheme } from '../theme';\nimport { Typography } from '../typography';\nimport { generateTimeOptions } from './generate-time-options';\nimport { NeedleTime } from './needle-time';\nimport {\n useKeyboardNavigation,\n useTimePickerPopover,\n} from './time-picker-hooks';\n\nexport type TimeFormat = 'hh:mm' | 'hh:mm aa';\n\nexport type TimePickerProps = {\n /** The value of the time picker */\n value?: NeedleTime;\n /** The format of the time picker */\n format?: TimeFormat;\n /** Whether the time picker is fluid */\n isFluid?: boolean;\n /** Whether the time picker is read only */\n isReadOnly?: boolean;\n /** Whether the time picker is required */\n isRequired?: boolean;\n /** Whether the time picker is disabled */\n isDisabled?: boolean;\n /** The time interval of the time picker, in minutes */\n timeInterval?: number;\n /** The label of the time picker */\n label?: string;\n /** The size of the time picker */\n size?: 'small' | 'medium' | 'large';\n /** Manually set the error text */\n errorText?: string;\n /** Callback function triggered when the time picker value changes */\n onChange?: (time: NeedleTime) => void;\n /** Callback function triggered when the time picker encounters an error */\n onError?: (error: string, time: NeedleTime) => void;\n /**\n * Strategy for the dropdown floating element.\n * By default it is absolute, but if the component is inside of a needle Dialog, it is set to fixed.\n * If this prop is set, no auto-detection of Dialog is done.\n */\n floatingStrategy?: 'absolute' | 'fixed';\n /** Whether the dropdown element is rendered in a portal. */\n isPortaled?: boolean;\n};\n\nexport const TimePicker = <T extends React.ElementType = 'div'>({\n format = 'hh:mm',\n isDisabled,\n isFluid,\n isReadOnly,\n isRequired,\n value,\n timeInterval = 15,\n label,\n onChange,\n className,\n onError,\n style,\n size = 'medium',\n errorText,\n htmlAttributes,\n floatingStrategy,\n isPortaled: isPortaledProp,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, TimePickerProps>) => {\n const [editedInput, setEditedInput] = useState<NeedleTime | undefined>(value);\n\n const is24Hour = format === 'hh:mm';\n const [inputValue, setInputValue] = useState<string>(\n value?.toString(is24Hour) ?? '',\n );\n const listRef = useRef<HTMLUListElement>(null);\n const inputRef = useRef<HTMLInputElement>(null);\n useImperativeHandle(ref, () => inputRef.current as HTMLInputElement, []);\n const [lastAction, setLastAction] = useState<'type' | 'arrow'>('type');\n const [error, setError] = useState<string | undefined>(undefined);\n const errorTextId = useId();\n const listboxId = useId();\n\n const timeOptions = useMemo(\n () => generateTimeOptions(is24Hour, timeInterval),\n [is24Hour, timeInterval],\n );\n\n const { themeClassName } = useNeedleTheme();\n const { isPopoverOpen, setIsPopoverOpen } = useTimePickerPopover(false);\n const { focusedIndex, setFocusedIndex, handleArrowNavigation } =\n useKeyboardNavigation(listRef, timeOptions.length);\n\n const errorToShow =\n errorText !== undefined && errorText !== '' ? errorText : error;\n\n const classes = {\n 'ndl-disabled': isDisabled,\n 'ndl-error': errorToShow !== undefined,\n 'ndl-fluid': isFluid,\n 'ndl-large': size === 'large',\n 'ndl-medium': size === 'medium',\n 'ndl-read-only': isReadOnly,\n 'ndl-small': size === 'small',\n };\n\n const inputWidth =\n isFluid === true ? '100%' : is24Hour === true ? '6rem' : '9rem';\n\n const isValidTime = useCallback((hours: number, minutes: number) => {\n if (hours > 23 || hours < 0) {\n return false;\n }\n\n if (minutes > 59 || minutes < 0) {\n return false;\n }\n\n return true;\n }, []);\n\n useEffect(() => {\n if (error !== undefined) {\n onError?.(error, NeedleTime.fromString(inputValue));\n }\n }, [error, inputValue, onError]);\n\n useEffect(() => {\n setEditedInput(value);\n setInputValue(value?.toString(is24Hour) ?? '');\n }, [is24Hour, value]);\n\n useEffect(() => {\n if (isPopoverOpen) {\n setTimeout(() => {\n listRef.current?.children[focusedIndex]?.scrollIntoView({\n block: 'center',\n inline: 'nearest',\n });\n }, 0);\n } else {\n setTimeout(() => {\n inputRef.current?.blur();\n const selectedIndex =\n timeOptions.indexOf(value?.toString(is24Hour) ?? '') ?? 0;\n setFocusedIndex(selectedIndex);\n }, 0);\n }\n }, [\n focusedIndex,\n is24Hour,\n isPopoverOpen,\n value,\n setFocusedIndex,\n timeOptions,\n ]);\n\n const handleOnClick = (timeText: string) => {\n if (onChange) {\n onChange(NeedleTime.fromString(timeText));\n }\n setError(undefined);\n setInputValue(timeText);\n setEditedInput(NeedleTime.fromString(timeText));\n setIsPopoverOpen(false);\n };\n const newHandleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n scrollToTime(e.target.value);\n setInputValue(e.target.value);\n setLastAction('type');\n\n const time = NeedleTime.fromString(e.target.value);\n if (!isValidTime(time.hour, time.minute)) {\n setError('Invalid time');\n } else {\n setError(undefined);\n }\n };\n\n const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (isReadOnly === true || isDisabled === true) {\n e.preventDefault();\n return;\n }\n\n if (e.key === 'Escape') {\n setIsPopoverOpen(false);\n }\n\n setIsPopoverOpen(true);\n\n if (e.key === 'Enter') {\n if (lastAction === 'type' && inputValue.length >= (is24Hour ? 5 : 6)) {\n const time = NeedleTime.fromString(inputValue);\n handleOnClick(time.toString(is24Hour));\n } else if (lastAction === 'type' && !inputValue.includes(':')) {\n const time = NeedleTime.fromString(inputValue);\n if (isValidTime(time.hour, time.minute)) {\n handleOnClick(time.toString(is24Hour));\n }\n setIsPopoverOpen(false);\n } else {\n handleOnClick(timeOptions[focusedIndex]);\n }\n } else if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {\n e.preventDefault();\n setLastAction('arrow');\n handleArrowNavigation(e.key);\n }\n };\n\n const scrollToTime = (startOfTime: string) => {\n const parsedTime = startOfTime.toLowerCase().replace(/[^0-9amp]/g, '');\n let index = -1;\n\n // Handle AM/PM input\n const isPM = parsedTime.includes('p');\n const isAM = parsedTime.includes('a');\n const timeDigits = parsedTime.replace(/[amp]/g, '');\n\n if (timeDigits.length === 1) {\n // Single digit - assume it's an hour\n const hour = `0${timeDigits}`;\n const searchTime = is24Hour\n ? `${hour}:00`\n : `${hour}:00 ${isPM ? 'PM' : 'AM'}`;\n index = timeOptions.indexOf(searchTime);\n } else {\n // Find closest matching time\n const closestTime = timeOptions.find((time) => {\n const timeWithoutSpecialChars = time\n .toLowerCase()\n .replace(/[^0-9amp]/g, '');\n if (isPM || isAM) {\n // If AM/PM specified, match that specifically\n return timeWithoutSpecialChars.startsWith(parsedTime);\n } else {\n // Otherwise just match the numbers\n return timeWithoutSpecialChars\n .replace(/[amp]/g, '')\n .startsWith(timeDigits);\n }\n });\n index = closestTime !== undefined ? timeOptions.indexOf(closestTime) : -1;\n }\n\n if (index !== -1) {\n setFocusedIndex(index);\n }\n\n return index;\n };\n\n /** Custom floating ui solution */\n const isInsideDialog = useIsInsideDialog();\n const isPortaled = isPortaledProp ?? !isInsideDialog;\n const containerRef = useRef<HTMLDivElement>(null);\n const { refs, floatingStyles, context } = useFloating({\n elements: {\n reference: containerRef.current,\n },\n middleware: [\n offset(10),\n flip({\n fallbackPlacements: ['top'],\n fallbackStrategy: 'bestFit',\n }),\n shift({ padding: 5 }),\n ],\n onOpenChange: (open) => {\n setIsPopoverOpen(open);\n },\n open: isDisabled !== true && isReadOnly !== true && isPopoverOpen,\n placement: 'bottom',\n strategy: floatingStrategy ?? (isInsideDialog ? 'fixed' : 'absolute'),\n whileElementsMounted: autoUpdate,\n });\n const dismiss = useDismiss(context);\n const { getReferenceProps, getFloatingProps } = useInteractions([dismiss]);\n const { styles: transitionStyles } = useTransitionStyles(context, {\n duration: Number.parseInt(tokens.motion.duration.quick) ?? 0,\n });\n\n const mergedRef = useMergeRefs([refs.setReference, containerRef]);\n\n return (\n <>\n <div\n className={classNames('ndl-time-picker', className, {\n ...classes,\n })}\n ref={mergedRef}\n {...getReferenceProps()}\n style={{\n width: isFluid === true ? '100%' : 'fit-content',\n }}\n >\n <label className=\"ndl-time-picker-label\">\n {label !== undefined && (\n <Typography\n variant={size === 'large' ? 'body-large' : 'body-medium'}\n >\n {label}\n </Typography>\n )}\n <div\n className=\"ndl-time-picker-input-wrapper\"\n style={{\n width: inputWidth,\n ...style,\n }}\n >\n <input\n role=\"combobox\"\n aria-expanded={isPopoverOpen}\n aria-controls={listboxId}\n aria-activedescendant={\n isPopoverOpen && focusedIndex >= 0\n ? `${listboxId}-option-${focusedIndex}`\n : undefined\n }\n aria-label={label} // TODO: handle label natively\n aria-invalid={Boolean(errorToShow)}\n aria-describedby={errorToShow ? errorTextId : undefined}\n className=\"ndl-time-picker-input\"\n type=\"text\"\n ref={inputRef}\n value={inputValue}\n disabled={isDisabled}\n readOnly={isReadOnly}\n required={isRequired}\n onChange={newHandleInputChange}\n onKeyDown={handleKeyDown}\n onClick={() => {\n if (isReadOnly === true || isDisabled === true) {\n return;\n }\n setIsPopoverOpen(true);\n }}\n onBlur={(e) => {\n if (isReadOnly === true || isDisabled === true) {\n return;\n }\n\n if (\n e.relatedTarget?.classList.contains(\n 'ndl-time-picker-popover-item',\n ) === true\n ) {\n return;\n }\n\n if (inputValue.length < 4) {\n setError('Invalid time');\n return;\n }\n\n const time = NeedleTime.fromString(inputValue);\n\n if (time === undefined || time === null) {\n setError('Invalid time');\n return;\n }\n\n if (!isValidTime(time.hour, time.minute)) {\n setError('Invalid time');\n } else {\n setError(undefined);\n setInputValue(time.toString(is24Hour));\n }\n }}\n placeholder={format}\n maxLength={is24Hour ? 5 : 8}\n {...restProps}\n {...htmlAttributes}\n />\n <ClockIconOutline className=\"ndl-icon-svg ndl-time-picker-icon\" />\n </div>\n </label>\n {errorToShow !== undefined && (\n <div className=\"ndl-time-picker-error-wrapper\" role=\"status\">\n <ExclamationCircleIconSolid className=\"ndl-time-picker-error-icon\" />\n <Typography\n variant={size === 'large' ? 'body-medium' : 'body-small'}\n className=\"ndl-time-picker-error-text\"\n htmlAttributes={{ id: errorTextId }}\n >\n {errorToShow}\n </Typography>\n </div>\n )}\n </div>\n\n {context.open && (\n <ConditionalWrap\n shouldWrap={isPortaled}\n wrap={(wrapChildren) => (\n <FloatingPortal>{wrapChildren}</FloatingPortal>\n )}\n >\n <FloatingFocusManager\n context={context}\n modal={false}\n initialFocus={-1}\n >\n <div\n ref={refs.setFloating}\n className={classNames(themeClassName, 'ndl-time-picker-popover', {\n ...classes,\n })}\n style={{\n ...transitionStyles,\n ...floatingStyles,\n width:\n isFluid === true\n ? containerRef.current?.clientWidth\n : undefined,\n }}\n {...getFloatingProps()}\n >\n <ul ref={listRef} role=\"listbox\" id={listboxId} tabIndex={-1}>\n {timeOptions.map((time, i) => (\n <li\n id={`${listboxId}-option-${i}`}\n key={i}\n role=\"option\"\n aria-selected={\n value?.toString(is24Hour) === time ||\n editedInput?.toString(is24Hour) === time\n }\n value={time}\n onClick={(e) => {\n e.stopPropagation();\n e.preventDefault();\n handleOnClick(time);\n setIsPopoverOpen(false);\n }}\n onMouseDown={(e) => {\n e.stopPropagation();\n e.preventDefault();\n }}\n tabIndex={-1}\n className={classNames(\n focusedIndex === i ? 'focused' : '',\n 'ndl-time-picker-popover-item',\n )}\n onKeyDown={(e) => {\n if (e.key === 'Enter') {\n e.stopPropagation();\n handleOnClick(time);\n }\n }}\n >\n {time}\n </li>\n ))}\n </ul>\n </div>\n </FloatingFocusManager>\n </ConditionalWrap>\n )}\n </>\n );\n};\n"]}
@@ -54,6 +54,7 @@ export const TimeZonePicker = (_a) => {
54
54
  useImperativeHandle(ref, () => inputRef.current, []);
55
55
  const [error, setError] = useState(undefined);
56
56
  const errorTextId = useId();
57
+ const listboxId = useId();
57
58
  const timezoneOptions = useMemo(() => {
58
59
  if (mode === 'utc') {
59
60
  return generateUTCTimeZoneOptions(referenceDate);
@@ -235,7 +236,9 @@ export const TimeZonePicker = (_a) => {
235
236
  const mergedRef = useMergeRefs([refs.setReference, containerRef]);
236
237
  return (_jsxs(_Fragment, { children: [_jsxs("div", Object.assign({ className: classNames('ndl-timezone-picker', className, Object.assign({}, classes)), ref: mergedRef }, getReferenceProps(), { style: {
237
238
  width: isFluid === true ? '100%' : 'fit-content',
238
- }, children: [_jsxs("label", { className: "ndl-timezone-picker-label", children: [label !== undefined && (_jsx(Typography, { variant: size === 'large' ? 'body-large' : 'body-medium', children: label })), _jsxs("div", { className: "ndl-timezone-picker-input-wrapper", style: Object.assign({ width: inputWidth }, style), children: [_jsx("input", Object.assign({ "aria-label": label, "aria-invalid": Boolean(errorToShow), "aria-describedby": errorToShow ? errorTextId : undefined, className: "ndl-timezone-picker-input", type: "text", ref: inputRef, value: inputValue, disabled: isDisabled, readOnly: isReadOnly, required: isRequired, onChange: handleInputChange, onKeyDown: handleKeyDown, onClick: (e) => {
239
+ }, children: [_jsxs("label", { className: "ndl-timezone-picker-label", children: [label !== undefined && (_jsx(Typography, { variant: size === 'large' ? 'body-large' : 'body-medium', children: label })), _jsxs("div", { className: "ndl-timezone-picker-input-wrapper", style: Object.assign({ width: inputWidth }, style), children: [_jsx("input", Object.assign({ role: "combobox", "aria-expanded": isPopoverOpen, "aria-controls": listboxId, "aria-activedescendant": isPopoverOpen && focusedIndex >= 0
240
+ ? `${listboxId}-option-${focusedIndex}`
241
+ : undefined, "aria-label": label, "aria-invalid": Boolean(errorToShow), "aria-describedby": errorToShow ? errorTextId : undefined, className: "ndl-timezone-picker-input", type: "text", ref: inputRef, value: inputValue, disabled: isDisabled, readOnly: isReadOnly, required: isRequired, onChange: handleInputChange, onKeyDown: handleKeyDown, onClick: (e) => {
239
242
  if (isReadOnly === true || isDisabled === true) {
240
243
  return;
241
244
  }
@@ -281,7 +284,7 @@ export const TimeZonePicker = (_a) => {
281
284
  ? 'Select or type UTC offset (e.g., UTC+5:30)'
282
285
  : 'Select timezone or type UTC offset' }, htmlAttributes, restProps)), _jsx(ChevronDownIcon, { className: "ndl-icon-svg ndl-timezone-picker-icon" })] })] }), errorToShow !== undefined && (_jsxs("div", { className: "ndl-timezone-picker-error-wrapper", role: "status", children: [_jsx(ExclamationCircleIconSolid, { className: "ndl-timezone-picker-error-icon" }), _jsx(Typography, { variant: size === 'large' ? 'body-medium' : 'body-small', className: "ndl-timezone-picker-error-text", htmlAttributes: { id: errorTextId }, children: errorToShow })] }))] })), context.open && (_jsx(ConditionalWrap, { shouldWrap: isPortaled, wrap: (wrapChildren) => (_jsx(FloatingPortal, { children: wrapChildren })), children: _jsx(FloatingFocusManager, { context: context, modal: false, initialFocus: -1, children: _jsx("div", Object.assign({ ref: refs.setFloating, className: classNames(themeClassName, 'ndl-timezone-picker-popover', Object.assign({}, classes)), style: Object.assign(Object.assign(Object.assign({}, transitionStyles), floatingStyles), { width: isFluid === true
283
286
  ? (_c = containerRef.current) === null || _c === void 0 ? void 0 : _c.clientWidth
284
- : undefined }) }, getFloatingProps(), { children: _jsx("ul", { ref: listRef, tabIndex: -1, children: mode === 'both' ? (_jsxs(_Fragment, { children: [utcOptions.length > 0 && (_jsxs(_Fragment, { children: [_jsx("li", { className: "ndl-timezone-picker-section-header", children: "UTC Offsets" }), utcOptions.map((option, i) => (_jsx("li", { role: "option", "aria-selected": value === option.value, value: option.value, onClick: (e) => {
287
+ : undefined }) }, getFloatingProps(), { children: _jsx("ul", { ref: listRef, role: "listbox", id: listboxId, tabIndex: -1, children: mode === 'both' ? (_jsxs(_Fragment, { children: [utcOptions.length > 0 && (_jsxs(_Fragment, { children: [_jsx("li", { className: "ndl-timezone-picker-section-header", children: "UTC Offsets" }), utcOptions.map((option, i) => (_jsx("li", { id: `${listboxId}-option-${i}`, role: "option", "aria-selected": value === option.value, value: option.value, onClick: (e) => {
285
288
  e.stopPropagation();
286
289
  e.preventDefault();
287
290
  handleOnClick(option.value);
@@ -296,7 +299,7 @@ export const TimeZonePicker = (_a) => {
296
299
  }
297
300
  }, children: option.label }, option.value)))] })), cityOptions.length > 0 && (_jsxs(_Fragment, { children: [_jsx("li", { className: "ndl-timezone-picker-section-header", children: "City-Based Timezones" }), cityOptions.map((option, i) => {
298
301
  const adjustedIndex = i + utcOptions.length;
299
- return (_jsx("li", { role: "option", "aria-selected": value === option.value, value: option.value, onClick: (e) => {
302
+ return (_jsx("li", { id: `${listboxId}-option-${adjustedIndex}`, role: "option", "aria-selected": value === option.value, value: option.value, onClick: (e) => {
300
303
  e.stopPropagation();
301
304
  e.preventDefault();
302
305
  handleOnClick(option.value);
@@ -310,7 +313,7 @@ export const TimeZonePicker = (_a) => {
310
313
  handleOnClick(option.value);
311
314
  }
312
315
  }, children: option.label }, option.value));
313
- })] })), utcOptions.length === 0 && cityOptions.length === 0 && (_jsx("li", { className: "ndl-timezone-picker-popover-item ndl-timezone-picker-no-results", children: "No timezones found" }))] })) : (_jsx(_Fragment, { children: filteredOptions.length > 0 ? (filteredOptions.map((option, i) => (_jsx("li", { role: "option", "aria-selected": value === option.value, value: option.value, onClick: (e) => {
316
+ })] })), utcOptions.length === 0 && cityOptions.length === 0 && (_jsx("li", { className: "ndl-timezone-picker-popover-item ndl-timezone-picker-no-results", children: "No timezones found" }))] })) : (_jsx(_Fragment, { children: filteredOptions.length > 0 ? (filteredOptions.map((option, i) => (_jsx("li", { id: `${listboxId}-option-${i}`, role: "option", "aria-selected": value === option.value, value: option.value, onClick: (e) => {
314
317
  e.stopPropagation();
315
318
  e.preventDefault();
316
319
  handleOnClick(option.value);