@neo4j-ndl/react 4.16.0 → 4.16.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/cjs/accordion/Accordion.js +2 -2
- package/lib/cjs/accordion/Accordion.js.map +1 -1
- package/lib/cjs/ai/file-tag/FileTag.js +2 -2
- package/lib/cjs/ai/file-tag/FileTag.js.map +1 -1
- package/lib/cjs/ai/image-tag/ImageTag.js +2 -2
- package/lib/cjs/ai/image-tag/ImageTag.js.map +1 -1
- package/lib/cjs/ai/presence/Presence.js +2 -2
- package/lib/cjs/ai/presence/Presence.js.map +1 -1
- package/lib/cjs/ai/preview/Preview.js +3 -2
- package/lib/cjs/ai/preview/Preview.js.map +1 -1
- package/lib/cjs/ai/prompt/Prompt.js +6 -3
- package/lib/cjs/ai/prompt/Prompt.js.map +1 -1
- package/lib/cjs/ai/reasoning/Reasoning.js +2 -2
- package/lib/cjs/ai/reasoning/Reasoning.js.map +1 -1
- package/lib/cjs/ai/tool-call/ToolCall.js +2 -2
- package/lib/cjs/ai/tool-call/ToolCall.js.map +1 -1
- package/lib/cjs/avatar/Avatar.js +2 -2
- package/lib/cjs/avatar/Avatar.js.map +1 -1
- package/lib/cjs/banner/Banner.js +12 -7
- package/lib/cjs/banner/Banner.js.map +1 -1
- package/lib/cjs/breadcrumbs/Breadcrumbs.js +2 -2
- package/lib/cjs/breadcrumbs/Breadcrumbs.js.map +1 -1
- package/lib/cjs/clipboard-button/ClipboardButton.js +2 -2
- package/lib/cjs/clipboard-button/ClipboardButton.js.map +1 -1
- package/lib/cjs/code-block/CodeBlock.js +3 -2
- package/lib/cjs/code-block/CodeBlock.js.map +1 -1
- package/lib/cjs/color-picker/ColorPicker.js +2 -2
- package/lib/cjs/color-picker/ColorPicker.js.map +1 -1
- package/lib/cjs/data-grid/Components.js +18 -11
- package/lib/cjs/data-grid/Components.js.map +1 -1
- package/lib/cjs/date-picker/DatePicker.js +8 -5
- package/lib/cjs/date-picker/DatePicker.js.map +1 -1
- package/lib/cjs/dialog/Dialog.js +8 -5
- package/lib/cjs/dialog/Dialog.js.map +1 -1
- package/lib/cjs/dismissible-tag/DismissibleTag.js +2 -2
- package/lib/cjs/dismissible-tag/DismissibleTag.js.map +1 -1
- package/lib/cjs/drawer/Drawer.js +2 -2
- package/lib/cjs/drawer/Drawer.js.map +1 -1
- package/lib/cjs/dropdown-button/DropdownButton.js +2 -2
- package/lib/cjs/dropdown-button/DropdownButton.js.map +1 -1
- package/lib/cjs/dropzone/Dropzone.js +5 -3
- package/lib/cjs/dropzone/Dropzone.js.map +1 -1
- package/lib/cjs/icon-button-array/IconButtonArray.js +6 -3
- package/lib/cjs/icon-button-array/IconButtonArray.js.map +1 -1
- package/lib/cjs/inline-edit/InlineEdit.js +6 -4
- package/lib/cjs/inline-edit/InlineEdit.js.map +1 -1
- package/lib/cjs/menu/Menu.js +4 -3
- package/lib/cjs/menu/Menu.js.map +1 -1
- package/lib/cjs/next/tree-view/TreeView.js +4 -3
- package/lib/cjs/next/tree-view/TreeView.js.map +1 -1
- package/lib/cjs/select/Overrides.js +4 -3
- package/lib/cjs/select/Overrides.js.map +1 -1
- package/lib/cjs/select/Select.js +2 -2
- package/lib/cjs/select/Select.js.map +1 -1
- package/lib/cjs/select-icon-button/SelectIconButton.js +2 -2
- package/lib/cjs/select-icon-button/SelectIconButton.js.map +1 -1
- package/lib/cjs/side-navigation/SideNavigation.js +4 -3
- package/lib/cjs/side-navigation/SideNavigation.js.map +1 -1
- package/lib/cjs/status-label/StatusLabel.js +10 -7
- package/lib/cjs/status-label/StatusLabel.js.map +1 -1
- package/lib/cjs/tabs/Tabs.js +4 -3
- package/lib/cjs/tabs/Tabs.js.map +1 -1
- package/lib/cjs/tag/Tag.js +2 -2
- package/lib/cjs/tag/Tag.js.map +1 -1
- package/lib/cjs/text-area/TextArea.js +3 -2
- package/lib/cjs/text-area/TextArea.js.map +1 -1
- package/lib/cjs/text-input/TextInput.js +6 -4
- package/lib/cjs/text-input/TextInput.js.map +1 -1
- package/lib/cjs/text-link/TextLink.js +3 -2
- package/lib/cjs/text-link/TextLink.js.map +1 -1
- package/lib/cjs/time-picker/TimePicker.js +3 -2
- package/lib/cjs/time-picker/TimePicker.js.map +1 -1
- package/lib/cjs/timezone-picker/TimeZonePicker.js +2 -2
- package/lib/cjs/timezone-picker/TimeZonePicker.js.map +1 -1
- package/lib/cjs/toast/Toast.js +6 -4
- package/lib/cjs/toast/Toast.js.map +1 -1
- package/lib/cjs/tree-view/TreeItemWrapper.js +2 -2
- package/lib/cjs/tree-view/TreeItemWrapper.js.map +1 -1
- package/lib/cjs/tree-view/TreeViewTextItem.js +3 -2
- package/lib/cjs/tree-view/TreeViewTextItem.js.map +1 -1
- package/lib/esm/accordion/Accordion.js +1 -1
- package/lib/esm/accordion/Accordion.js.map +1 -1
- package/lib/esm/ai/file-tag/FileTag.js +1 -1
- package/lib/esm/ai/file-tag/FileTag.js.map +1 -1
- package/lib/esm/ai/image-tag/ImageTag.js +1 -1
- package/lib/esm/ai/image-tag/ImageTag.js.map +1 -1
- package/lib/esm/ai/presence/Presence.js +1 -1
- package/lib/esm/ai/presence/Presence.js.map +1 -1
- package/lib/esm/ai/preview/Preview.js +2 -1
- package/lib/esm/ai/preview/Preview.js.map +1 -1
- package/lib/esm/ai/prompt/Prompt.js +4 -1
- package/lib/esm/ai/prompt/Prompt.js.map +1 -1
- package/lib/esm/ai/reasoning/Reasoning.js +1 -1
- package/lib/esm/ai/reasoning/Reasoning.js.map +1 -1
- package/lib/esm/ai/tool-call/ToolCall.js +1 -1
- package/lib/esm/ai/tool-call/ToolCall.js.map +1 -1
- package/lib/esm/avatar/Avatar.js +1 -1
- package/lib/esm/avatar/Avatar.js.map +1 -1
- package/lib/esm/banner/Banner.js +6 -1
- package/lib/esm/banner/Banner.js.map +1 -1
- package/lib/esm/breadcrumbs/Breadcrumbs.js +1 -1
- package/lib/esm/breadcrumbs/Breadcrumbs.js.map +1 -1
- package/lib/esm/clipboard-button/ClipboardButton.js +1 -1
- package/lib/esm/clipboard-button/ClipboardButton.js.map +1 -1
- package/lib/esm/code-block/CodeBlock.js +2 -1
- package/lib/esm/code-block/CodeBlock.js.map +1 -1
- package/lib/esm/color-picker/ColorPicker.js +1 -1
- package/lib/esm/color-picker/ColorPicker.js.map +1 -1
- package/lib/esm/data-grid/Components.js +8 -1
- package/lib/esm/data-grid/Components.js.map +1 -1
- package/lib/esm/date-picker/DatePicker.js +4 -1
- package/lib/esm/date-picker/DatePicker.js.map +1 -1
- package/lib/esm/dialog/Dialog.js +4 -1
- package/lib/esm/dialog/Dialog.js.map +1 -1
- package/lib/esm/dismissible-tag/DismissibleTag.js +1 -1
- package/lib/esm/dismissible-tag/DismissibleTag.js.map +1 -1
- package/lib/esm/drawer/Drawer.js +1 -1
- package/lib/esm/drawer/Drawer.js.map +1 -1
- package/lib/esm/dropdown-button/DropdownButton.js +1 -1
- package/lib/esm/dropdown-button/DropdownButton.js.map +1 -1
- package/lib/esm/dropzone/Dropzone.js +3 -1
- package/lib/esm/dropzone/Dropzone.js.map +1 -1
- package/lib/esm/icon-button-array/IconButtonArray.js +4 -1
- package/lib/esm/icon-button-array/IconButtonArray.js.map +1 -1
- package/lib/esm/inline-edit/InlineEdit.js +3 -1
- package/lib/esm/inline-edit/InlineEdit.js.map +1 -1
- package/lib/esm/menu/Menu.js +2 -1
- package/lib/esm/menu/Menu.js.map +1 -1
- package/lib/esm/next/tree-view/TreeView.js +2 -1
- package/lib/esm/next/tree-view/TreeView.js.map +1 -1
- package/lib/esm/select/Overrides.js +2 -1
- package/lib/esm/select/Overrides.js.map +1 -1
- package/lib/esm/select/Select.js +1 -1
- package/lib/esm/select/Select.js.map +1 -1
- package/lib/esm/select-icon-button/SelectIconButton.js +1 -1
- package/lib/esm/select-icon-button/SelectIconButton.js.map +1 -1
- package/lib/esm/side-navigation/SideNavigation.js +2 -1
- package/lib/esm/side-navigation/SideNavigation.js.map +1 -1
- package/lib/esm/status-label/StatusLabel.js +4 -1
- package/lib/esm/status-label/StatusLabel.js.map +1 -1
- package/lib/esm/tabs/Tabs.js +2 -1
- package/lib/esm/tabs/Tabs.js.map +1 -1
- package/lib/esm/tag/Tag.js +1 -1
- package/lib/esm/tag/Tag.js.map +1 -1
- package/lib/esm/text-area/TextArea.js +2 -1
- package/lib/esm/text-area/TextArea.js.map +1 -1
- package/lib/esm/text-input/TextInput.js +3 -1
- package/lib/esm/text-input/TextInput.js.map +1 -1
- package/lib/esm/text-link/TextLink.js +2 -1
- package/lib/esm/text-link/TextLink.js.map +1 -1
- package/lib/esm/time-picker/TimePicker.js +2 -1
- package/lib/esm/time-picker/TimePicker.js.map +1 -1
- package/lib/esm/timezone-picker/TimeZonePicker.js +1 -1
- package/lib/esm/timezone-picker/TimeZonePicker.js.map +1 -1
- package/lib/esm/toast/Toast.js +3 -1
- package/lib/esm/toast/Toast.js.map +1 -1
- package/lib/esm/tree-view/TreeItemWrapper.js +1 -1
- package/lib/esm/tree-view/TreeItemWrapper.js.map +1 -1
- package/lib/esm/tree-view/TreeViewTextItem.js +2 -1
- package/lib/esm/tree-view/TreeViewTextItem.js.map +1 -1
- package/lib/types/ai/file-tag/FileTag.d.ts.map +1 -1
- package/lib/types/ai/image-tag/ImageTag.d.ts.map +1 -1
- package/lib/types/ai/presence/Presence.d.ts.map +1 -1
- package/lib/types/ai/preview/Preview.d.ts.map +1 -1
- package/lib/types/ai/prompt/Prompt.d.ts.map +1 -1
- package/lib/types/ai/reasoning/Reasoning.d.ts.map +1 -1
- package/lib/types/ai/tool-call/ToolCall.d.ts.map +1 -1
- package/lib/types/banner/Banner.d.ts.map +1 -1
- package/lib/types/breadcrumbs/Breadcrumbs.d.ts.map +1 -1
- package/lib/types/code-block/CodeBlock.d.ts.map +1 -1
- package/lib/types/data-grid/Components.d.ts +1 -1
- package/lib/types/data-grid/Components.d.ts.map +1 -1
- package/lib/types/date-picker/DatePicker.d.ts.map +1 -1
- package/lib/types/dialog/Dialog.d.ts.map +1 -1
- package/lib/types/dropzone/Dropzone.d.ts.map +1 -1
- package/lib/types/icon-button-array/IconButtonArray.d.ts.map +1 -1
- package/lib/types/inline-edit/InlineEdit.d.ts.map +1 -1
- package/lib/types/menu/Menu.d.ts.map +1 -1
- package/lib/types/next/tree-view/TreeView.d.ts.map +1 -1
- package/lib/types/select/Overrides.d.ts.map +1 -1
- package/lib/types/side-navigation/SideNavigation.d.ts.map +1 -1
- package/lib/types/status-label/StatusLabel.d.ts.map +1 -1
- package/lib/types/tabs/Tabs.d.ts.map +1 -1
- package/lib/types/text-area/TextArea.d.ts.map +1 -1
- package/lib/types/text-input/TextInput.d.ts.map +1 -1
- package/lib/types/text-link/TextLink.d.ts.map +1 -1
- package/lib/types/time-picker/TimePicker.d.ts.map +1 -1
- package/lib/types/toast/Toast.d.ts.map +1 -1
- package/lib/types/tree-view/TreeView.d.ts.map +1 -1
- package/lib/types/tree-view/TreeViewTextItem.d.ts.map +1 -1
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Avatar.js","sourceRoot":"","sources":["../../../src/avatar/Avatar.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport classNames from 'classnames';\nimport type React from 'react';\n\nimport { type PolymorphicCommonProps } from '../_common/types';\nimport { UserIconOutline } from '../icons';\nimport { Typography } from '../typography';\n\ntype SizeType = AvatarProps['size'];\ntype StatusType = NonNullable<AvatarProps['status']>;\n\ninterface CircleProperties {\n /** Center coordinates of the circles */\n cxAndCy: number;\n /** Diameter of the circles */\n diameter: number;\n /** Radius of the inner circle */\n rInner: number;\n /** Radius of the outer circle */\n rOuter: number;\n}\n\nfunction circleSizeFactory(size: SizeType): CircleProperties {\n switch (size) {\n case 'x-small':\n case 'small':\n case 'medium':\n return {\n cxAndCy: 4.5,\n diameter: 9,\n rInner: 3,\n rOuter: 4.5,\n };\n case 'large':\n case 'x-large':\n default:\n return {\n cxAndCy: 6,\n diameter: 12,\n rInner: 4,\n rOuter: 6,\n };\n }\n}\n\nfunction StatusIndicator({\n size,\n status,\n}: {\n size: SizeType;\n status: StatusType;\n}) {\n const { cxAndCy, diameter, rInner, rOuter } = circleSizeFactory(size);\n const statusClasses = `ndl-avatar-status ndl-avatar-status-${status}`;\n\n return (\n <div\n className={statusClasses}\n title={status.charAt(0).toUpperCase() + status.slice(1)}\n role=\"presentation\"\n >\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n height={diameter}\n width={diameter}\n viewBox={`0 0 ${diameter} ${diameter}`}\n fill=\"none\"\n >\n <circle\n cx={cxAndCy}\n cy={cxAndCy}\n r={rOuter}\n className=\"ndl-avatar-status-circle-outer\"\n />\n <circle\n cx={cxAndCy}\n cy={cxAndCy}\n r={status === 'unknown' ? rInner - 1 : rInner}\n className=\"ndl-avatar-status-circle-inner\"\n />\n </svg>\n </div>\n );\n}\n\ntype AvatarProps = {\n /** Whether to display a status indicator */\n hasStatus?: boolean;\n /** Whether the avatar is disabled. When disabled, status indicators are hidden and `onClick` handlers are disabled when cast as a button */\n isDisabled?: boolean;\n /** The name associated with the avatar. Used for alt text and aria-label. For letters type, this text is displayed */\n name?: string;\n /** The shape of the avatar */\n shape?: 'circle' | 'square';\n /** The size of the avatar */\n size?: 'x-small' | 'small' | 'medium' | 'large' | 'x-large';\n /** Source URI for the image. When provided with `type=\"image`\", displays the image */\n source?: string;\n /** The status to display. Only shown when `hasStatus` is `true` and component is not disabled */\n status?: 'offline' | 'online' | 'unknown';\n /** The type of avatar content. If `type=\"image\"` and no source is provided, automatically falls back to `icon` */\n type?: 'icon' | 'image' | 'letters';\n /** Custom icon to display when `type` is `\"icon\"`. Defaults to `UserIconOutline` */\n icon?: React.ReactNode;\n} & (\n | {\n as: 'button';\n onClick: () => void;\n }\n | {\n as?: React.ElementType;\n }\n);\n\nconst getLettersDisplay = (displayName: string) => {\n const words = displayName.trim().split(/\\s+/).filter(Boolean);\n if (words.length <= 1) {\n return displayName.trim();\n }\n return words\n .map((word) => word.charAt(0))\n .join('')\n .toUpperCase();\n};\n\nexport const Avatar = <T extends React.ElementType = 'div'>({\n as,\n hasStatus = false,\n icon,\n isDisabled = false,\n name,\n shape = 'circle',\n size = 'medium',\n source,\n status,\n type: initialType = 'image',\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, AvatarProps>) => {\n // If source is not provided, fallback to icon\n const type =\n initialType === 'image' && (source === undefined || source === '')\n ? 'icon'\n : initialType;\n\n const Component: React.ElementType = as ?? 'div';\n const isButton = Component === 'button';\n const classes = classNames(\n `ndl-avatar ndl-avatar-${shape} ndl-avatar-${size}`,\n className,\n );\n const shapeClasses = classNames(\n `ndl-avatar-shape ndl-avatar-${shape} ndl-avatar-${shape}-${size}`,\n {\n 'ndl-avatar-disabled': isDisabled,\n },\n );\n\n const typeClass = `ndl-avatar-${type}`;\n\n const renderImageType = () => (\n <>\n <img data-testid=\"ndl-avatar-image\" src={source} alt={name} />\n <div\n data-testid=\"ndl-avatar-image-overlay\"\n className={`${shapeClasses} ndl-avatar-image-overlay`}\n />\n </>\n );\n\n const renderIconType = () => <>{icon ?? <UserIconOutline />}</>;\n\n const renderLettersType = () => {\n return (\n <Typography variant=\"subheading-small\" className=\"ndl-avatar-typography\">\n {getLettersDisplay(name ?? '')}\n </Typography>\n );\n };\n\n const TypeComponent =\n type === 'image'\n ? renderImageType()\n : type === 'icon'\n ? renderIconType()\n : type === 'letters' && Boolean(name)\n ? renderLettersType()\n : null;\n\n const isStatusIndicatorVisible =\n hasStatus && !isDisabled && status !== undefined;\n\n return (\n <Component\n ref={ref}\n className={classes}\n style={style}\n aria-hidden={!isButton}\n {...(isButton && {\n disabled: isDisabled,\n })}\n aria-label={`Avatar ${name}`}\n {...restProps}\n {...htmlAttributes}\n >\n <div className={classNames(shapeClasses, typeClass)}>{TypeComponent}</div>\n {isStatusIndicatorVisible && (\n <StatusIndicator size={size} status={status} />\n )}\n </Component>\n );\n};\n"]}
|
|
1
|
+
{"version":3,"file":"Avatar.js","sourceRoot":"","sources":["../../../src/avatar/Avatar.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport classNames from 'classnames';\nimport type React from 'react';\n\nimport { type PolymorphicCommonProps } from '../_common/types';\nimport { UserIconOutline } from '../icons/generated/heroIcons/UserIconOutline';\nimport { Typography } from '../typography';\n\ntype SizeType = AvatarProps['size'];\ntype StatusType = NonNullable<AvatarProps['status']>;\n\ninterface CircleProperties {\n /** Center coordinates of the circles */\n cxAndCy: number;\n /** Diameter of the circles */\n diameter: number;\n /** Radius of the inner circle */\n rInner: number;\n /** Radius of the outer circle */\n rOuter: number;\n}\n\nfunction circleSizeFactory(size: SizeType): CircleProperties {\n switch (size) {\n case 'x-small':\n case 'small':\n case 'medium':\n return {\n cxAndCy: 4.5,\n diameter: 9,\n rInner: 3,\n rOuter: 4.5,\n };\n case 'large':\n case 'x-large':\n default:\n return {\n cxAndCy: 6,\n diameter: 12,\n rInner: 4,\n rOuter: 6,\n };\n }\n}\n\nfunction StatusIndicator({\n size,\n status,\n}: {\n size: SizeType;\n status: StatusType;\n}) {\n const { cxAndCy, diameter, rInner, rOuter } = circleSizeFactory(size);\n const statusClasses = `ndl-avatar-status ndl-avatar-status-${status}`;\n\n return (\n <div\n className={statusClasses}\n title={status.charAt(0).toUpperCase() + status.slice(1)}\n role=\"presentation\"\n >\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n height={diameter}\n width={diameter}\n viewBox={`0 0 ${diameter} ${diameter}`}\n fill=\"none\"\n >\n <circle\n cx={cxAndCy}\n cy={cxAndCy}\n r={rOuter}\n className=\"ndl-avatar-status-circle-outer\"\n />\n <circle\n cx={cxAndCy}\n cy={cxAndCy}\n r={status === 'unknown' ? rInner - 1 : rInner}\n className=\"ndl-avatar-status-circle-inner\"\n />\n </svg>\n </div>\n );\n}\n\ntype AvatarProps = {\n /** Whether to display a status indicator */\n hasStatus?: boolean;\n /** Whether the avatar is disabled. When disabled, status indicators are hidden and `onClick` handlers are disabled when cast as a button */\n isDisabled?: boolean;\n /** The name associated with the avatar. Used for alt text and aria-label. For letters type, this text is displayed */\n name?: string;\n /** The shape of the avatar */\n shape?: 'circle' | 'square';\n /** The size of the avatar */\n size?: 'x-small' | 'small' | 'medium' | 'large' | 'x-large';\n /** Source URI for the image. When provided with `type=\"image`\", displays the image */\n source?: string;\n /** The status to display. Only shown when `hasStatus` is `true` and component is not disabled */\n status?: 'offline' | 'online' | 'unknown';\n /** The type of avatar content. If `type=\"image\"` and no source is provided, automatically falls back to `icon` */\n type?: 'icon' | 'image' | 'letters';\n /** Custom icon to display when `type` is `\"icon\"`. Defaults to `UserIconOutline` */\n icon?: React.ReactNode;\n} & (\n | {\n as: 'button';\n onClick: () => void;\n }\n | {\n as?: React.ElementType;\n }\n);\n\nconst getLettersDisplay = (displayName: string) => {\n const words = displayName.trim().split(/\\s+/).filter(Boolean);\n if (words.length <= 1) {\n return displayName.trim();\n }\n return words\n .map((word) => word.charAt(0))\n .join('')\n .toUpperCase();\n};\n\nexport const Avatar = <T extends React.ElementType = 'div'>({\n as,\n hasStatus = false,\n icon,\n isDisabled = false,\n name,\n shape = 'circle',\n size = 'medium',\n source,\n status,\n type: initialType = 'image',\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, AvatarProps>) => {\n // If source is not provided, fallback to icon\n const type =\n initialType === 'image' && (source === undefined || source === '')\n ? 'icon'\n : initialType;\n\n const Component: React.ElementType = as ?? 'div';\n const isButton = Component === 'button';\n const classes = classNames(\n `ndl-avatar ndl-avatar-${shape} ndl-avatar-${size}`,\n className,\n );\n const shapeClasses = classNames(\n `ndl-avatar-shape ndl-avatar-${shape} ndl-avatar-${shape}-${size}`,\n {\n 'ndl-avatar-disabled': isDisabled,\n },\n );\n\n const typeClass = `ndl-avatar-${type}`;\n\n const renderImageType = () => (\n <>\n <img data-testid=\"ndl-avatar-image\" src={source} alt={name} />\n <div\n data-testid=\"ndl-avatar-image-overlay\"\n className={`${shapeClasses} ndl-avatar-image-overlay`}\n />\n </>\n );\n\n const renderIconType = () => <>{icon ?? <UserIconOutline />}</>;\n\n const renderLettersType = () => {\n return (\n <Typography variant=\"subheading-small\" className=\"ndl-avatar-typography\">\n {getLettersDisplay(name ?? '')}\n </Typography>\n );\n };\n\n const TypeComponent =\n type === 'image'\n ? renderImageType()\n : type === 'icon'\n ? renderIconType()\n : type === 'letters' && Boolean(name)\n ? renderLettersType()\n : null;\n\n const isStatusIndicatorVisible =\n hasStatus && !isDisabled && status !== undefined;\n\n return (\n <Component\n ref={ref}\n className={classes}\n style={style}\n aria-hidden={!isButton}\n {...(isButton && {\n disabled: isDisabled,\n })}\n aria-label={`Avatar ${name}`}\n {...restProps}\n {...htmlAttributes}\n >\n <div className={classNames(shapeClasses, typeClass)}>{TypeComponent}</div>\n {isStatusIndicatorVisible && (\n <StatusIndicator size={size} status={status} />\n )}\n </Component>\n );\n};\n"]}
|
package/lib/esm/banner/Banner.js
CHANGED
|
@@ -32,7 +32,12 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
32
32
|
*/
|
|
33
33
|
import classNames from 'classnames';
|
|
34
34
|
import { CleanIconButton } from '../clean-icon-button';
|
|
35
|
-
import { BoltIconOutline
|
|
35
|
+
import { BoltIconOutline } from '../icons/generated/heroIcons/BoltIconOutline';
|
|
36
|
+
import { CheckCircleIconSolid } from '../icons/generated/heroIcons/CheckCircleIconSolid';
|
|
37
|
+
import { ExclamationCircleIconSolid } from '../icons/generated/heroIcons/ExclamationCircleIconSolid';
|
|
38
|
+
import { ExclamationTriangleIconSolid } from '../icons/generated/heroIcons/ExclamationTriangleIconSolid';
|
|
39
|
+
import { InformationCircleIconSolid } from '../icons/generated/heroIcons/InformationCircleIconSolid';
|
|
40
|
+
import { XMarkIconOutline } from '../icons/generated/heroIcons/XMarkIconOutline';
|
|
36
41
|
import { Typography } from '../typography';
|
|
37
42
|
const StatusIcon = ({ variant }) => {
|
|
38
43
|
const iconComponent = (() => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Banner.js","sourceRoot":"","sources":["../../../src/banner/Banner.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,OAAO,UAAU,MAAM,YAAY,CAAC;AAOpC,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AACvD,OAAO,
|
|
1
|
+
{"version":3,"file":"Banner.js","sourceRoot":"","sources":["../../../src/banner/Banner.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport classNames from 'classnames';\nimport type React from 'react';\n\nimport {\n type CommonProps,\n type PolymorphicCommonProps,\n} from '../_common/types';\nimport { CleanIconButton } from '../clean-icon-button';\nimport { BoltIconOutline } from '../icons/generated/heroIcons/BoltIconOutline';\nimport { CheckCircleIconSolid } from '../icons/generated/heroIcons/CheckCircleIconSolid';\nimport { ExclamationCircleIconSolid } from '../icons/generated/heroIcons/ExclamationCircleIconSolid';\nimport { ExclamationTriangleIconSolid } from '../icons/generated/heroIcons/ExclamationTriangleIconSolid';\nimport { InformationCircleIconSolid } from '../icons/generated/heroIcons/InformationCircleIconSolid';\nimport { XMarkIconOutline } from '../icons/generated/heroIcons/XMarkIconOutline';\nimport { Typography } from '../typography';\n/**\n *\n *\n * Types\n *\n *\n */\n\ntype BannerCommonProps = {\n /** Shows a status icon. The icon is based on the value of the `variant` prop */\n hasIcon?: boolean;\n\n /** Content to be shown in the banner. */\n children?: React.ReactNode;\n\n /** Sets the role to alert */\n isAlert?: boolean;\n\n /** How the banner is used. */\n usage?: 'inline' | 'global';\n\n /** The variant of the banner */\n variant?: BannerVariant;\n};\n\ntype CloseableBannerProps = {\n /** If the banner is closeable. Renders an icon button in the top right corner */\n isCloseable: true;\n\n /** Event handler for when the close icon is clicked */\n onClose: (\n e?: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>,\n ) => void;\n};\n\ntype NonCloseableBannerProps = {\n isCloseable?: false;\n onClose?: never;\n};\n\ntype BannerCloseProps = CloseableBannerProps | NonCloseableBannerProps;\n\ntype BannerProps = BannerCommonProps & BannerCloseProps;\ntype BannerVariant = 'info' | 'success' | 'warning' | 'danger' | 'neutral';\n\nconst StatusIcon = ({ variant }: { variant: BannerVariant }) => {\n const iconComponent = (() => {\n switch (variant) {\n case 'success':\n return <CheckCircleIconSolid />;\n case 'warning':\n return <ExclamationTriangleIconSolid />;\n case 'danger':\n return <ExclamationCircleIconSolid />;\n case 'info':\n return <InformationCircleIconSolid />;\n case 'neutral':\n return <BoltIconOutline />;\n default:\n return null;\n }\n })();\n\n return <div className=\"ndl-banner-status-icon\">{iconComponent}</div>;\n};\n\nconst BannerHeader = ({\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'span', { children: React.ReactNode }>) => {\n const classes = classNames('ndl-banner-header', className);\n return (\n <Typography\n as=\"span\"\n variant=\"title-4\"\n className={classes}\n style={style}\n ref={ref}\n htmlAttributes={htmlAttributes}\n {...restProps}\n >\n {children}\n </Typography>\n );\n};\n\nconst BannerDescription = ({\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'div', { children: React.ReactNode }>) => {\n const classes = classNames('ndl-banner-description', className);\n return (\n <Typography\n as=\"div\"\n variant=\"body-medium\"\n className={classes}\n style={style}\n ref={ref}\n {...restProps}\n {...htmlAttributes}\n >\n {children}\n </Typography>\n );\n};\n\nconst BannerActions = ({\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'div', { children: React.ReactNode }>) => {\n const classes = classNames('ndl-banner-actions', className);\n return (\n <div\n className={classes}\n style={style}\n ref={ref}\n {...restProps}\n {...htmlAttributes}\n >\n {children}\n </div>\n );\n};\n\nconst BannerComponent = <T extends React.ElementType = 'section'>({\n as,\n variant = 'info',\n hasIcon = false,\n onClose,\n className,\n children,\n isCloseable = false,\n usage = 'inline',\n htmlAttributes,\n isAlert = false,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, BannerProps>) => {\n const Element: React.ElementType = as ?? 'section';\n\n const classes = classNames('ndl-banner', className, {\n 'ndl-danger': variant === 'danger',\n 'ndl-global': usage === 'global',\n 'ndl-info': variant === 'info',\n 'ndl-inline': usage === 'inline',\n 'ndl-neutral': variant === 'neutral',\n 'ndl-success': variant === 'success',\n 'ndl-warning': variant === 'warning',\n });\n\n const handleClose = (\n e:\n | React.MouseEvent<HTMLElement, MouseEvent>\n | React.KeyboardEvent<HTMLElement>,\n ) => {\n if (onClose && typeof onClose === 'function') {\n onClose(e);\n }\n };\n\n return (\n <Element\n className={classes}\n role={isAlert ? 'alert' : undefined}\n ref={ref}\n {...restProps}\n {...htmlAttributes}\n >\n {hasIcon && <StatusIcon variant={variant} />}\n <div className=\"ndl-banner-content\">{children}</div>\n {isCloseable && (\n <CleanIconButton\n size=\"small\"\n onClick={handleClose}\n description={null}\n htmlAttributes={{ 'aria-label': 'Close' }}\n >\n <XMarkIconOutline />\n </CleanIconButton>\n )}\n </Element>\n );\n};\n\nconst Banner = Object.assign(BannerComponent, {\n Actions: BannerActions,\n Description: BannerDescription,\n Header: BannerHeader,\n});\n\nexport { Banner };\n"]}
|
|
@@ -30,9 +30,9 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
30
30
|
* You should have received a copy of the GNU General Public License
|
|
31
31
|
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|
32
32
|
*/
|
|
33
|
-
import { ChevronDownIconOutline } from '@neo4j-ndl/react/icons';
|
|
34
33
|
import classNames from 'classnames';
|
|
35
34
|
import { createContext, useContext, useRef, useState } from 'react';
|
|
35
|
+
import { ChevronDownIconOutline } from '../icons/generated/heroIcons/ChevronDownIconOutline';
|
|
36
36
|
import { Tooltip } from '../tooltip';
|
|
37
37
|
const BreadcrumbsComponent = (_a) => {
|
|
38
38
|
var { children, className, htmlAttributes, style, ref, shouldWrap = true } = _a, restProps = __rest(_a, ["children", "className", "htmlAttributes", "style", "ref", "shouldWrap"]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Breadcrumbs.js","sourceRoot":"","sources":["../../../src/breadcrumbs/Breadcrumbs.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport { ChevronDownIconOutline } from '@neo4j-ndl/react/icons';\nimport classNames from 'classnames';\nimport type React from 'react';\nimport { createContext, useContext, useRef, useState } from 'react';\n\nimport {\n type CommonProps,\n type HtmlAttributes,\n type PolymorphicCommonProps,\n} from '../_common/types';\nimport { Tooltip } from '../tooltip';\n\ntype BreadcrumbsProps = {\n /** Content to be rendered. Should only be `Breadcrumbs.Item`. */\n children?: React.ReactNode;\n /** Additional classnames. */\n shouldWrap?: boolean;\n};\n\nconst BreadcrumbsComponent = ({\n children,\n className,\n htmlAttributes,\n style,\n ref,\n shouldWrap = true,\n ...restProps\n}: CommonProps<'nav', BreadcrumbsProps>) => {\n const classes = classNames('ndl-breadcrumbs', className);\n const listClasses = classNames('ndl-breadcrumbs-list', {\n 'ndl-breadcrumbs-wrap': shouldWrap,\n });\n return (\n <nav\n aria-label=\"Breadcrumb\"\n ref={ref}\n className={classes}\n style={style}\n {...restProps}\n {...htmlAttributes}\n >\n <ol className={listClasses}>{children}</ol>\n </nav>\n );\n};\n\ntype BreadcrumbsItemContextType = {\n isInBreadcrumbsItem: boolean;\n};\n\nconst BreadcrumbsItemContext = createContext<BreadcrumbsItemContextType | null>(\n null,\n);\n\nexport const useBreadcrumbsItemContext = (): BreadcrumbsItemContextType => {\n const context = useContext(BreadcrumbsItemContext);\n if (!context) {\n throw new Error('This component must be used within a <Breadcrumbs.Item>');\n }\n\n return context;\n};\n\ntype BreadcrumbsItemProps = {\n /** Content to be rendered. Should be either `Breadcrumbs.Link`, `Breadcrumbs.Button` or `Breadcrumbs.SelectButton`. */\n children?: React.ReactNode;\n};\n\nconst BreadcrumbsItem = ({\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'li', BreadcrumbsItemProps>) => {\n const classes = classNames('ndl-breadcrumbs-item', className);\n\n return (\n <BreadcrumbsItemContext.Provider value={{ isInBreadcrumbsItem: true }}>\n <li\n ref={ref}\n className={classes}\n style={style}\n {...htmlAttributes}\n {...restProps}\n >\n <div className=\"ndl-breadcrumbs-item-inner\">{children}</div>\n </li>\n </BreadcrumbsItemContext.Provider>\n );\n};\n\ntype InteractiveBreadcrumbProps = {\n /** Content to be rendered. */\n children?: React.ReactNode;\n} & (\n | {\n as: 'button';\n /**\n * Event handler for when the button is clicked. Only applicable if `as` is `'button'`.\n */\n onClick?: (\n event: React.MouseEvent<HTMLButtonElement, MouseEvent>,\n ) => void;\n }\n | {\n as: 'a';\n /**\n * The href of the link. Only applicable if `as` is `'a'`.\n */\n href: HtmlAttributes<'a'>['href'];\n /**\n * The target of the link. Only applicable if `as` is `'a'`.\n */\n target?: HtmlAttributes<'a'>['target'];\n }\n | {\n /**\n * What HTML element to render the root element as.\n */\n as?: React.ElementType;\n }\n);\n\ntype BreadcrumbsButtonProps = InteractiveBreadcrumbProps & {\n /** Leading element to be rendered. */\n leadingElement?: React.ReactNode;\n /** Trailing element to be rendered. */\n trailingElement?: React.ReactNode;\n};\n\nconst BreadcrumbsButton = <T extends React.ElementType = 'button'>({\n children,\n as,\n className,\n style,\n htmlAttributes,\n ref,\n leadingElement,\n trailingElement,\n ...restProps\n}: PolymorphicCommonProps<T, BreadcrumbsButtonProps>) => {\n useBreadcrumbsItemContext();\n\n const [isTooltipOpen, setIsTooltipOpen] = useState(false);\n const contentRef = useRef<HTMLDivElement>(null);\n const Component: React.ElementType = as ?? 'button';\n\n const classes = classNames(\n 'ndl-breadcrumbs-button ndl-breadcrumbs-sibling-hover',\n className,\n );\n\n return (\n <Tooltip\n type=\"simple\"\n isOpen={isTooltipOpen}\n onOpenChange={(isOpen) => {\n if (isOpen) {\n const isTruncated =\n contentRef.current?.scrollWidth &&\n contentRef.current?.clientWidth &&\n contentRef.current.scrollWidth > contentRef.current.clientWidth;\n const isVisible =\n contentRef.current?.offsetWidth &&\n contentRef.current?.offsetHeight &&\n contentRef.current.offsetWidth > 0 &&\n contentRef.current.offsetHeight > 0;\n setIsTooltipOpen(isTruncated || !isVisible);\n } else {\n setIsTooltipOpen(false);\n }\n }}\n >\n <Tooltip.Trigger hasButtonWrapper>\n <Component\n ref={ref}\n className={classes}\n style={style}\n {...htmlAttributes}\n {...restProps}\n >\n {Boolean(leadingElement) && (\n <div className=\"ndl-breadcrumbs-button-leading-element\">\n {leadingElement}\n </div>\n )}\n <div className=\"ndl-breadcrumbs-button-content\" ref={contentRef}>\n {children}\n </div>\n {Boolean(trailingElement) && (\n <div className=\"ndl-breadcrumbs-button-trailing-element\">\n {trailingElement}\n </div>\n )}\n </Component>\n </Tooltip.Trigger>\n <Tooltip.Content>{children}</Tooltip.Content>\n </Tooltip>\n );\n};\n\ntype BreadcrumbsSelectButtonProps = {\n /** Event handler for when the button is clicked. Should be used to open a `Menu`. */\n onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n /** Aria label needed for accessibility. */\n ariaLabel: string;\n /** Content to be rendered. */\n children?: React.ReactNode;\n /** Active - used when a connected menu is open */\n isActive?: boolean;\n};\n\nconst BreadcrumbsSelectButton = ({\n onClick,\n children,\n isActive,\n className,\n style,\n htmlAttributes,\n ariaLabel,\n ref,\n ...restProps\n}: CommonProps<'button', BreadcrumbsSelectButtonProps>) => {\n useBreadcrumbsItemContext();\n\n const classes = classNames(\n 'ndl-breadcrumbs-button ndl-breadcrumbs-sibling-hover ndl-breadcrumbs-select',\n className,\n {\n 'ndl-active': Boolean(isActive),\n },\n );\n\n return (\n <button\n type=\"button\"\n ref={ref}\n className={classes}\n style={style}\n onClick={onClick}\n aria-label={ariaLabel}\n aria-pressed={isActive}\n {...htmlAttributes}\n {...restProps}\n >\n <div className=\"ndl-breadcrumbs-button-leading-element\">\n <ChevronDownIconOutline />\n </div>\n <div className=\"ndl-breadcrumbs-button-content\">{children}</div>\n </button>\n );\n};\n\ntype BreadcrumbsLinkProps = InteractiveBreadcrumbProps & {\n /**\n * Whether the link is the current item. Use `'page'` if it indicates the current page and `'step'` for steps (in a multi-step wizard for example).\n * @see https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current\n */\n ariaCurrent?: React.AriaAttributes['aria-current'];\n};\n\nconst BreadcrumbsLink = <T extends React.ElementType = 'a'>({\n children,\n as,\n className,\n style,\n htmlAttributes,\n ariaCurrent = false,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, BreadcrumbsLinkProps>) => {\n useBreadcrumbsItemContext();\n\n const Component: React.ElementType = as ?? 'a';\n\n const classes = classNames(\n 'ndl-breadcrumbs-link',\n {\n 'ndl-breadcrumbs-link-current': Boolean(ariaCurrent),\n },\n className,\n );\n\n return (\n <Component\n ref={ref}\n className={classes}\n style={style}\n aria-current={ariaCurrent}\n {...restProps}\n {...htmlAttributes}\n >\n {children}\n </Component>\n );\n};\n\nconst Breadcrumbs = Object.assign(BreadcrumbsComponent, {\n Button: BreadcrumbsButton,\n Item: BreadcrumbsItem,\n Link: BreadcrumbsLink,\n SelectButton: BreadcrumbsSelectButton,\n});\n\nexport { Breadcrumbs };\n"]}
|
|
1
|
+
{"version":3,"file":"Breadcrumbs.js","sourceRoot":"","sources":["../../../src/breadcrumbs/Breadcrumbs.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport classNames from 'classnames';\nimport type React from 'react';\nimport { createContext, useContext, useRef, useState } from 'react';\n\nimport {\n type CommonProps,\n type HtmlAttributes,\n type PolymorphicCommonProps,\n} from '../_common/types';\nimport { ChevronDownIconOutline } from '../icons/generated/heroIcons/ChevronDownIconOutline';\nimport { Tooltip } from '../tooltip';\n\ntype BreadcrumbsProps = {\n /** Content to be rendered. Should only be `Breadcrumbs.Item`. */\n children?: React.ReactNode;\n /** Additional classnames. */\n shouldWrap?: boolean;\n};\n\nconst BreadcrumbsComponent = ({\n children,\n className,\n htmlAttributes,\n style,\n ref,\n shouldWrap = true,\n ...restProps\n}: CommonProps<'nav', BreadcrumbsProps>) => {\n const classes = classNames('ndl-breadcrumbs', className);\n const listClasses = classNames('ndl-breadcrumbs-list', {\n 'ndl-breadcrumbs-wrap': shouldWrap,\n });\n return (\n <nav\n aria-label=\"Breadcrumb\"\n ref={ref}\n className={classes}\n style={style}\n {...restProps}\n {...htmlAttributes}\n >\n <ol className={listClasses}>{children}</ol>\n </nav>\n );\n};\n\ntype BreadcrumbsItemContextType = {\n isInBreadcrumbsItem: boolean;\n};\n\nconst BreadcrumbsItemContext = createContext<BreadcrumbsItemContextType | null>(\n null,\n);\n\nexport const useBreadcrumbsItemContext = (): BreadcrumbsItemContextType => {\n const context = useContext(BreadcrumbsItemContext);\n if (!context) {\n throw new Error('This component must be used within a <Breadcrumbs.Item>');\n }\n\n return context;\n};\n\ntype BreadcrumbsItemProps = {\n /** Content to be rendered. Should be either `Breadcrumbs.Link`, `Breadcrumbs.Button` or `Breadcrumbs.SelectButton`. */\n children?: React.ReactNode;\n};\n\nconst BreadcrumbsItem = ({\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'li', BreadcrumbsItemProps>) => {\n const classes = classNames('ndl-breadcrumbs-item', className);\n\n return (\n <BreadcrumbsItemContext.Provider value={{ isInBreadcrumbsItem: true }}>\n <li\n ref={ref}\n className={classes}\n style={style}\n {...htmlAttributes}\n {...restProps}\n >\n <div className=\"ndl-breadcrumbs-item-inner\">{children}</div>\n </li>\n </BreadcrumbsItemContext.Provider>\n );\n};\n\ntype InteractiveBreadcrumbProps = {\n /** Content to be rendered. */\n children?: React.ReactNode;\n} & (\n | {\n as: 'button';\n /**\n * Event handler for when the button is clicked. Only applicable if `as` is `'button'`.\n */\n onClick?: (\n event: React.MouseEvent<HTMLButtonElement, MouseEvent>,\n ) => void;\n }\n | {\n as: 'a';\n /**\n * The href of the link. Only applicable if `as` is `'a'`.\n */\n href: HtmlAttributes<'a'>['href'];\n /**\n * The target of the link. Only applicable if `as` is `'a'`.\n */\n target?: HtmlAttributes<'a'>['target'];\n }\n | {\n /**\n * What HTML element to render the root element as.\n */\n as?: React.ElementType;\n }\n);\n\ntype BreadcrumbsButtonProps = InteractiveBreadcrumbProps & {\n /** Leading element to be rendered. */\n leadingElement?: React.ReactNode;\n /** Trailing element to be rendered. */\n trailingElement?: React.ReactNode;\n};\n\nconst BreadcrumbsButton = <T extends React.ElementType = 'button'>({\n children,\n as,\n className,\n style,\n htmlAttributes,\n ref,\n leadingElement,\n trailingElement,\n ...restProps\n}: PolymorphicCommonProps<T, BreadcrumbsButtonProps>) => {\n useBreadcrumbsItemContext();\n\n const [isTooltipOpen, setIsTooltipOpen] = useState(false);\n const contentRef = useRef<HTMLDivElement>(null);\n const Component: React.ElementType = as ?? 'button';\n\n const classes = classNames(\n 'ndl-breadcrumbs-button ndl-breadcrumbs-sibling-hover',\n className,\n );\n\n return (\n <Tooltip\n type=\"simple\"\n isOpen={isTooltipOpen}\n onOpenChange={(isOpen) => {\n if (isOpen) {\n const isTruncated =\n contentRef.current?.scrollWidth &&\n contentRef.current?.clientWidth &&\n contentRef.current.scrollWidth > contentRef.current.clientWidth;\n const isVisible =\n contentRef.current?.offsetWidth &&\n contentRef.current?.offsetHeight &&\n contentRef.current.offsetWidth > 0 &&\n contentRef.current.offsetHeight > 0;\n setIsTooltipOpen(isTruncated || !isVisible);\n } else {\n setIsTooltipOpen(false);\n }\n }}\n >\n <Tooltip.Trigger hasButtonWrapper>\n <Component\n ref={ref}\n className={classes}\n style={style}\n {...htmlAttributes}\n {...restProps}\n >\n {Boolean(leadingElement) && (\n <div className=\"ndl-breadcrumbs-button-leading-element\">\n {leadingElement}\n </div>\n )}\n <div className=\"ndl-breadcrumbs-button-content\" ref={contentRef}>\n {children}\n </div>\n {Boolean(trailingElement) && (\n <div className=\"ndl-breadcrumbs-button-trailing-element\">\n {trailingElement}\n </div>\n )}\n </Component>\n </Tooltip.Trigger>\n <Tooltip.Content>{children}</Tooltip.Content>\n </Tooltip>\n );\n};\n\ntype BreadcrumbsSelectButtonProps = {\n /** Event handler for when the button is clicked. Should be used to open a `Menu`. */\n onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n /** Aria label needed for accessibility. */\n ariaLabel: string;\n /** Content to be rendered. */\n children?: React.ReactNode;\n /** Active - used when a connected menu is open */\n isActive?: boolean;\n};\n\nconst BreadcrumbsSelectButton = ({\n onClick,\n children,\n isActive,\n className,\n style,\n htmlAttributes,\n ariaLabel,\n ref,\n ...restProps\n}: CommonProps<'button', BreadcrumbsSelectButtonProps>) => {\n useBreadcrumbsItemContext();\n\n const classes = classNames(\n 'ndl-breadcrumbs-button ndl-breadcrumbs-sibling-hover ndl-breadcrumbs-select',\n className,\n {\n 'ndl-active': Boolean(isActive),\n },\n );\n\n return (\n <button\n type=\"button\"\n ref={ref}\n className={classes}\n style={style}\n onClick={onClick}\n aria-label={ariaLabel}\n aria-pressed={isActive}\n {...htmlAttributes}\n {...restProps}\n >\n <div className=\"ndl-breadcrumbs-button-leading-element\">\n <ChevronDownIconOutline />\n </div>\n <div className=\"ndl-breadcrumbs-button-content\">{children}</div>\n </button>\n );\n};\n\ntype BreadcrumbsLinkProps = InteractiveBreadcrumbProps & {\n /**\n * Whether the link is the current item. Use `'page'` if it indicates the current page and `'step'` for steps (in a multi-step wizard for example).\n * @see https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-current\n */\n ariaCurrent?: React.AriaAttributes['aria-current'];\n};\n\nconst BreadcrumbsLink = <T extends React.ElementType = 'a'>({\n children,\n as,\n className,\n style,\n htmlAttributes,\n ariaCurrent = false,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, BreadcrumbsLinkProps>) => {\n useBreadcrumbsItemContext();\n\n const Component: React.ElementType = as ?? 'a';\n\n const classes = classNames(\n 'ndl-breadcrumbs-link',\n {\n 'ndl-breadcrumbs-link-current': Boolean(ariaCurrent),\n },\n className,\n );\n\n return (\n <Component\n ref={ref}\n className={classes}\n style={style}\n aria-current={ariaCurrent}\n {...restProps}\n {...htmlAttributes}\n >\n {children}\n </Component>\n );\n};\n\nconst Breadcrumbs = Object.assign(BreadcrumbsComponent, {\n Button: BreadcrumbsButton,\n Item: BreadcrumbsItem,\n Link: BreadcrumbsLink,\n SelectButton: BreadcrumbsSelectButton,\n});\n\nexport { Breadcrumbs };\n"]}
|
|
@@ -34,7 +34,7 @@ import React from 'react';
|
|
|
34
34
|
import { CleanIconButton } from '../clean-icon-button';
|
|
35
35
|
import { useCopyToClipboard } from '../hooks';
|
|
36
36
|
import { IconButton } from '../icon-button';
|
|
37
|
-
import { Square2StackIconOutline } from '../icons';
|
|
37
|
+
import { Square2StackIconOutline } from '../icons/generated/heroIcons/Square2StackIconOutline';
|
|
38
38
|
import { Kbd } from '../kbd';
|
|
39
39
|
import { OutlinedButton } from '../outlined-button';
|
|
40
40
|
import { Tooltip } from '../tooltip';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ClipboardButton.js","sourceRoot":"","sources":["../../../src/clipboard-button/ClipboardButton.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 React from 'react';\n\nimport { type ButtonSizes } from '../button';\nimport { CleanIconButton } from '../clean-icon-button';\nimport { useCopyToClipboard } from '../hooks';\nimport { IconButton } from '../icon-button';\nimport { Square2StackIconOutline } from '../icons';\nimport { Kbd } from '../kbd';\nimport { OutlinedButton } from '../outlined-button';\nimport { Tooltip } from '../tooltip';\n\ntype ConfirmationButtonProps = {\n description: string;\n descriptionKbdProps?: React.ComponentProps<typeof Kbd>;\n actionFeedbackText: string;\n tooltipProps?: Omit<React.ComponentProps<typeof Tooltip>, 'children'>;\n onClick?: React.ComponentPropsWithoutRef<'button'>['onClick'];\n children: React.ReactNode;\n className?: string;\n icon: React.ReactNode;\n htmlAttributes?: React.ComponentPropsWithoutRef<'button'>;\n} & (\n | {\n type: 'clean-icon-button';\n cleanIconButtonProps?: Omit<\n React.ComponentProps<typeof CleanIconButton>,\n 'children' | 'onClick' | 'tooltip'\n >;\n }\n | {\n type: 'icon-button';\n iconButtonProps?: Omit<\n React.ComponentProps<typeof IconButton>,\n 'children' | 'onClick' | 'tooltip'\n >;\n }\n | {\n type: 'outlined-button';\n outlinedButtonProps?: Omit<\n React.ComponentProps<typeof OutlinedButton>,\n 'children' | 'onClick' | 'tooltip'\n >;\n }\n);\n\nconst ConfirmationButton = ({\n descriptionKbdProps,\n description,\n actionFeedbackText,\n icon,\n children,\n onClick,\n htmlAttributes,\n tooltipProps,\n type = 'clean-icon-button',\n ...restProps\n}: ConfirmationButtonProps) => {\n const [timeoutId, setTimeoutId] = React.useState<number | null>(null);\n const [isOpen, setIsOpen] = React.useState(false);\n\n const handleClick = () => {\n if (timeoutId !== null) {\n clearTimeout(timeoutId);\n }\n\n const newTimeoutId = window.setTimeout(() => {\n setTimeoutId(null);\n }, 2000);\n\n setTimeoutId(newTimeoutId);\n };\n\n const handleCloseTooltip = () => {\n setIsOpen(false);\n };\n\n const handleOpenTooltip = () => {\n setIsOpen(true);\n };\n\n const content = timeoutId === null ? description : actionFeedbackText;\n /* Controlling the tip to make it disappear in a timely manner*/\n\n if (type === 'clean-icon-button') {\n return (\n <CleanIconButton\n {...(\n restProps as {\n cleanIconButtonProps: React.ComponentProps<typeof CleanIconButton>;\n }\n ).cleanIconButtonProps}\n description={content}\n descriptionKbdProps={descriptionKbdProps}\n tooltipProps={{\n root: {\n ...tooltipProps,\n isOpen: isOpen || timeoutId !== null,\n },\n trigger: {\n htmlAttributes: {\n onBlur: handleCloseTooltip,\n onFocus: handleOpenTooltip,\n onMouseEnter: handleOpenTooltip,\n onMouseLeave: handleCloseTooltip,\n },\n },\n }}\n onClick={(event) => {\n if (onClick) {\n onClick(event);\n }\n handleClick();\n }}\n className={restProps.className}\n htmlAttributes={htmlAttributes}\n >\n {icon}\n </CleanIconButton>\n );\n } else if (type === 'icon-button') {\n return (\n <IconButton\n {...(\n restProps as {\n iconButtonProps: React.ComponentProps<typeof IconButton>;\n }\n ).iconButtonProps}\n description={content}\n tooltipProps={{\n root: {\n ...tooltipProps,\n isOpen: isOpen || timeoutId !== null,\n },\n trigger: {\n htmlAttributes: {\n onBlur: handleCloseTooltip,\n onFocus: handleOpenTooltip,\n onMouseEnter: handleOpenTooltip,\n onMouseLeave: handleCloseTooltip,\n },\n },\n }}\n onClick={(event) => {\n if (onClick) {\n onClick(event);\n }\n handleClick();\n }}\n className={restProps.className}\n htmlAttributes={htmlAttributes}\n >\n {icon}\n </IconButton>\n );\n } else if (type === 'outlined-button') {\n return (\n <Tooltip\n type=\"simple\"\n isOpen={isOpen || timeoutId !== null}\n {...tooltipProps}\n onOpenChange={(open) => {\n if (open) {\n handleOpenTooltip();\n } else {\n handleCloseTooltip();\n }\n tooltipProps?.onOpenChange?.(open);\n }}\n >\n <Tooltip.Trigger\n hasButtonWrapper\n htmlAttributes={{\n 'aria-label': content,\n onBlur: handleCloseTooltip,\n onFocus: handleOpenTooltip,\n onMouseEnter: handleOpenTooltip,\n onMouseLeave: handleCloseTooltip,\n }}\n >\n <OutlinedButton\n variant=\"neutral\"\n {...(\n restProps as {\n buttonProps: React.ComponentProps<typeof OutlinedButton>;\n }\n ).buttonProps}\n onClick={(event) => {\n if (onClick) {\n onClick(event);\n }\n handleClick();\n }}\n leadingVisual={icon}\n className={restProps.className}\n htmlAttributes={htmlAttributes}\n >\n {children}\n </OutlinedButton>\n </Tooltip.Trigger>\n <Tooltip.Content>\n {content}\n {descriptionKbdProps && <Kbd {...descriptionKbdProps} />}\n </Tooltip.Content>\n </Tooltip>\n );\n }\n};\n\ninterface ClipboardButtonProps {\n /** The text that should be set to users clipboard */\n textToCopy: string;\n descriptionKbdProps?: React.ComponentProps<typeof Kbd>;\n tooltipProps?: Omit<React.ComponentProps<typeof Tooltip>, 'children'>;\n isDisabled?: boolean;\n size?: ButtonSizes;\n htmlAttributes?: React.ComponentPropsWithoutRef<'button'>;\n type?: 'outlined-button' | 'clean-icon-button' | 'icon-button';\n}\n\nexport const ClipboardButton = ({\n textToCopy,\n descriptionKbdProps,\n isDisabled,\n size,\n tooltipProps,\n htmlAttributes,\n type,\n}: ClipboardButtonProps) => {\n const [, copyFunction] = useCopyToClipboard();\n\n const isOutlinedButton = type === 'outlined-button';\n const isIconButton = type === 'icon-button';\n\n const props = isOutlinedButton\n ? {\n outlinedButtonProps: {\n isDisabled,\n size,\n },\n type: 'outlined-button' as const,\n }\n : isIconButton\n ? {\n iconButtonProps: {\n description: 'Copy to clipboard',\n isDisabled,\n size,\n },\n type: 'icon-button' as const,\n }\n : {\n cleanIconButtonProps: {\n description: 'Copy to clipboard',\n isDisabled,\n size,\n },\n type: 'clean-icon-button' as const,\n };\n\n return (\n <ConfirmationButton\n onClick={() => copyFunction(textToCopy)}\n description=\"Copy to clipboard\"\n actionFeedbackText=\"Copied\"\n descriptionKbdProps={descriptionKbdProps}\n {...props}\n tooltipProps={tooltipProps}\n className=\"n-gap-token-8\"\n icon={<Square2StackIconOutline className=\"ndl-icon-svg\" />}\n htmlAttributes={{\n 'aria-live': 'polite',\n ...htmlAttributes,\n }}\n >\n {type === 'outlined-button' && 'Copy'}\n </ConfirmationButton>\n );\n};\n"]}
|
|
1
|
+
{"version":3,"file":"ClipboardButton.js","sourceRoot":"","sources":["../../../src/clipboard-button/ClipboardButton.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 React from 'react';\n\nimport { type ButtonSizes } from '../button';\nimport { CleanIconButton } from '../clean-icon-button';\nimport { useCopyToClipboard } from '../hooks';\nimport { IconButton } from '../icon-button';\nimport { Square2StackIconOutline } from '../icons/generated/heroIcons/Square2StackIconOutline';\nimport { Kbd } from '../kbd';\nimport { OutlinedButton } from '../outlined-button';\nimport { Tooltip } from '../tooltip';\n\ntype ConfirmationButtonProps = {\n description: string;\n descriptionKbdProps?: React.ComponentProps<typeof Kbd>;\n actionFeedbackText: string;\n tooltipProps?: Omit<React.ComponentProps<typeof Tooltip>, 'children'>;\n onClick?: React.ComponentPropsWithoutRef<'button'>['onClick'];\n children: React.ReactNode;\n className?: string;\n icon: React.ReactNode;\n htmlAttributes?: React.ComponentPropsWithoutRef<'button'>;\n} & (\n | {\n type: 'clean-icon-button';\n cleanIconButtonProps?: Omit<\n React.ComponentProps<typeof CleanIconButton>,\n 'children' | 'onClick' | 'tooltip'\n >;\n }\n | {\n type: 'icon-button';\n iconButtonProps?: Omit<\n React.ComponentProps<typeof IconButton>,\n 'children' | 'onClick' | 'tooltip'\n >;\n }\n | {\n type: 'outlined-button';\n outlinedButtonProps?: Omit<\n React.ComponentProps<typeof OutlinedButton>,\n 'children' | 'onClick' | 'tooltip'\n >;\n }\n);\n\nconst ConfirmationButton = ({\n descriptionKbdProps,\n description,\n actionFeedbackText,\n icon,\n children,\n onClick,\n htmlAttributes,\n tooltipProps,\n type = 'clean-icon-button',\n ...restProps\n}: ConfirmationButtonProps) => {\n const [timeoutId, setTimeoutId] = React.useState<number | null>(null);\n const [isOpen, setIsOpen] = React.useState(false);\n\n const handleClick = () => {\n if (timeoutId !== null) {\n clearTimeout(timeoutId);\n }\n\n const newTimeoutId = window.setTimeout(() => {\n setTimeoutId(null);\n }, 2000);\n\n setTimeoutId(newTimeoutId);\n };\n\n const handleCloseTooltip = () => {\n setIsOpen(false);\n };\n\n const handleOpenTooltip = () => {\n setIsOpen(true);\n };\n\n const content = timeoutId === null ? description : actionFeedbackText;\n /* Controlling the tip to make it disappear in a timely manner*/\n\n if (type === 'clean-icon-button') {\n return (\n <CleanIconButton\n {...(\n restProps as {\n cleanIconButtonProps: React.ComponentProps<typeof CleanIconButton>;\n }\n ).cleanIconButtonProps}\n description={content}\n descriptionKbdProps={descriptionKbdProps}\n tooltipProps={{\n root: {\n ...tooltipProps,\n isOpen: isOpen || timeoutId !== null,\n },\n trigger: {\n htmlAttributes: {\n onBlur: handleCloseTooltip,\n onFocus: handleOpenTooltip,\n onMouseEnter: handleOpenTooltip,\n onMouseLeave: handleCloseTooltip,\n },\n },\n }}\n onClick={(event) => {\n if (onClick) {\n onClick(event);\n }\n handleClick();\n }}\n className={restProps.className}\n htmlAttributes={htmlAttributes}\n >\n {icon}\n </CleanIconButton>\n );\n } else if (type === 'icon-button') {\n return (\n <IconButton\n {...(\n restProps as {\n iconButtonProps: React.ComponentProps<typeof IconButton>;\n }\n ).iconButtonProps}\n description={content}\n tooltipProps={{\n root: {\n ...tooltipProps,\n isOpen: isOpen || timeoutId !== null,\n },\n trigger: {\n htmlAttributes: {\n onBlur: handleCloseTooltip,\n onFocus: handleOpenTooltip,\n onMouseEnter: handleOpenTooltip,\n onMouseLeave: handleCloseTooltip,\n },\n },\n }}\n onClick={(event) => {\n if (onClick) {\n onClick(event);\n }\n handleClick();\n }}\n className={restProps.className}\n htmlAttributes={htmlAttributes}\n >\n {icon}\n </IconButton>\n );\n } else if (type === 'outlined-button') {\n return (\n <Tooltip\n type=\"simple\"\n isOpen={isOpen || timeoutId !== null}\n {...tooltipProps}\n onOpenChange={(open) => {\n if (open) {\n handleOpenTooltip();\n } else {\n handleCloseTooltip();\n }\n tooltipProps?.onOpenChange?.(open);\n }}\n >\n <Tooltip.Trigger\n hasButtonWrapper\n htmlAttributes={{\n 'aria-label': content,\n onBlur: handleCloseTooltip,\n onFocus: handleOpenTooltip,\n onMouseEnter: handleOpenTooltip,\n onMouseLeave: handleCloseTooltip,\n }}\n >\n <OutlinedButton\n variant=\"neutral\"\n {...(\n restProps as {\n buttonProps: React.ComponentProps<typeof OutlinedButton>;\n }\n ).buttonProps}\n onClick={(event) => {\n if (onClick) {\n onClick(event);\n }\n handleClick();\n }}\n leadingVisual={icon}\n className={restProps.className}\n htmlAttributes={htmlAttributes}\n >\n {children}\n </OutlinedButton>\n </Tooltip.Trigger>\n <Tooltip.Content>\n {content}\n {descriptionKbdProps && <Kbd {...descriptionKbdProps} />}\n </Tooltip.Content>\n </Tooltip>\n );\n }\n};\n\ninterface ClipboardButtonProps {\n /** The text that should be set to users clipboard */\n textToCopy: string;\n descriptionKbdProps?: React.ComponentProps<typeof Kbd>;\n tooltipProps?: Omit<React.ComponentProps<typeof Tooltip>, 'children'>;\n isDisabled?: boolean;\n size?: ButtonSizes;\n htmlAttributes?: React.ComponentPropsWithoutRef<'button'>;\n type?: 'outlined-button' | 'clean-icon-button' | 'icon-button';\n}\n\nexport const ClipboardButton = ({\n textToCopy,\n descriptionKbdProps,\n isDisabled,\n size,\n tooltipProps,\n htmlAttributes,\n type,\n}: ClipboardButtonProps) => {\n const [, copyFunction] = useCopyToClipboard();\n\n const isOutlinedButton = type === 'outlined-button';\n const isIconButton = type === 'icon-button';\n\n const props = isOutlinedButton\n ? {\n outlinedButtonProps: {\n isDisabled,\n size,\n },\n type: 'outlined-button' as const,\n }\n : isIconButton\n ? {\n iconButtonProps: {\n description: 'Copy to clipboard',\n isDisabled,\n size,\n },\n type: 'icon-button' as const,\n }\n : {\n cleanIconButtonProps: {\n description: 'Copy to clipboard',\n isDisabled,\n size,\n },\n type: 'clean-icon-button' as const,\n };\n\n return (\n <ConfirmationButton\n onClick={() => copyFunction(textToCopy)}\n description=\"Copy to clipboard\"\n actionFeedbackText=\"Copied\"\n descriptionKbdProps={descriptionKbdProps}\n {...props}\n tooltipProps={tooltipProps}\n className=\"n-gap-token-8\"\n icon={<Square2StackIconOutline className=\"ndl-icon-svg\" />}\n htmlAttributes={{\n 'aria-live': 'polite',\n ...htmlAttributes,\n }}\n >\n {type === 'outlined-button' && 'Copy'}\n </ConfirmationButton>\n );\n};\n"]}
|
|
@@ -33,7 +33,8 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
33
33
|
import classNames from 'classnames';
|
|
34
34
|
import { PrismLight as SyntaxHighlighter } from 'react-syntax-highlighter';
|
|
35
35
|
import { CleanIconButton } from '../clean-icon-button';
|
|
36
|
-
import { ChevronDownIconOutline
|
|
36
|
+
import { ChevronDownIconOutline } from '../icons/generated/heroIcons/ChevronDownIconOutline';
|
|
37
|
+
import { ChevronUpIconOutline } from '../icons/generated/heroIcons/ChevronUpIconOutline';
|
|
37
38
|
import { useCodeLanguage } from './hooks/use-code-language';
|
|
38
39
|
import { useCodeTheme } from './hooks/use-code-theme';
|
|
39
40
|
import { useExpandable } from './hooks/use-expandable';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CodeBlock.js","sourceRoot":"","sources":["../../../src/code-block/CodeBlock.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,OAAO,UAAU,MAAM,YAAY,CAAC;AAEpC,OAAO,EAAE,UAAU,IAAI,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAG3E,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAEvD,OAAO,EAAE,sBAAsB,EAAE,oBAAoB,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"CodeBlock.js","sourceRoot":"","sources":["../../../src/code-block/CodeBlock.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport classNames from 'classnames';\nimport type React from 'react';\nimport { PrismLight as SyntaxHighlighter } from 'react-syntax-highlighter';\n\nimport { type PolymorphicCommonProps } from '../_common/types';\nimport { CleanIconButton } from '../clean-icon-button';\nimport { type IconButton } from '../icon-button';\nimport { ChevronDownIconOutline } from '../icons/generated/heroIcons/ChevronDownIconOutline';\nimport { ChevronUpIconOutline } from '../icons/generated/heroIcons/ChevronUpIconOutline';\nimport { type LanguageProp } from './code-languages';\nimport { type CodeTheme } from './code-themes';\nimport { useCodeLanguage } from './hooks/use-code-language';\nimport { useCodeTheme } from './hooks/use-code-theme';\nimport { useExpandable } from './hooks/use-expandable';\n\ninterface CodeBlockProps {\n code: string;\n isDisabled?: boolean;\n maxHeight?: number;\n language: LanguageProp | 'text';\n shouldShowLineNumbers?: boolean;\n theme?: CodeTheme;\n heading?: React.ReactNode;\n actions?: React.ComponentProps<typeof IconButton<'button'>>[];\n}\n\nconst defaultElement = 'div';\n\nexport const CodeBlock = <T extends React.ElementType = 'button'>({\n as,\n maxHeight,\n code,\n language,\n shouldShowLineNumbers,\n theme,\n heading,\n actions,\n isDisabled,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n // TODO: Should not be polymorphic (at least not defaulting to a button)\n}: PolymorphicCommonProps<T, CodeBlockProps>) => {\n const Component: React.ElementType = as ?? defaultElement;\n\n const {\n containerHeight,\n isExpanded,\n toggleExpand,\n hasOverflowingContent,\n ref: syntaxHighlighterWrapperRef,\n } = useExpandable(maxHeight, code);\n const codeTheme = useCodeTheme(theme);\n const codeLanguage = useCodeLanguage(language);\n\n const hasMaxHeight = maxHeight !== undefined;\n const hasHeading = Boolean(heading);\n const numberOfActions = actions?.length ?? 0;\n\n const shouldShowExpandButton = hasMaxHeight && hasOverflowingContent;\n const rightPadding = hasHeading\n ? 0\n : Math.max(numberOfActions * 36, (shouldShowExpandButton ? 1 : 0) * 36) + 8;\n\n return (\n <Component\n ref={ref}\n className={classNames('ndl-code-block-container', className)}\n style={{ height: containerHeight, ...style }}\n {...restProps}\n {...htmlAttributes}\n >\n <div className=\"n-flex n-flex-col n-h-full\">\n {hasHeading && (\n <div\n className={classNames('ndl-code-block-title', {\n 'ndl-disabled': isDisabled,\n })}\n style={{\n maxWidth: `calc(100% - ${(actions?.length ?? 0) * 36 + 20}px)`,\n }}\n data-testid=\"ndl-code-block-title\"\n >\n {heading}\n </div>\n )}\n <div\n className={classNames('ndl-code-content-container', {\n 'ndl-disabled': isDisabled,\n })}\n style={{\n height: hasHeading ? 'calc(100% - 24px - 12px)' : '100%',\n }}\n >\n <div\n ref={syntaxHighlighterWrapperRef}\n className=\"ndl-highlight-wrapper\"\n tabIndex={0}\n role=\"region\"\n aria-label={`Code content ${isDisabled ? '(disabled)' : ''}`}\n >\n <SyntaxHighlighter\n language={codeLanguage}\n style={{\n ...codeTheme,\n 'pre[class*=\"language-\"]': {\n border: 0,\n color: 'var(--theme-color-neutral-text-default)',\n lineHeight: '1',\n padding: `0 ${rightPadding}px 0.75em 0.75em`,\n width: 'fit-content',\n },\n }}\n codeTagProps={{ className: 'n-code' }}\n // Turn on 'shouldShowLineNumbers' & 'wrapLongLines' at the same time, the display is wrong\n // https://github.com/react-syntax-highlighter/react-syntax-highlighter/issues/402\n // wrapLongLines\n showLineNumbers={shouldShowLineNumbers}\n >\n {code}\n </SyntaxHighlighter>\n </div>\n </div>\n </div>\n <div\n className={classNames('ndl-code-block-actions', {\n 'ndl-disabled': isDisabled,\n })}\n >\n {actions?.map((iconButtonProps, i) => (\n <CleanIconButton\n key={i}\n isDisabled={isDisabled}\n {...iconButtonProps}\n description={`${iconButtonProps.description ?? 'CodeBlock Action'}`}\n htmlAttributes={{\n 'data-testid': `ndl-action-button-${i}`,\n ...iconButtonProps.htmlAttributes,\n }}\n />\n ))}\n </div>\n {shouldShowExpandButton && (\n <div className=\"ndl-code-block-expand-button\">\n <CleanIconButton\n description={isExpanded ? 'Collapse' : 'Expand'}\n tooltipProps={{\n root: {\n shouldCloseOnReferenceClick: true,\n },\n }}\n onClick={toggleExpand}\n >\n {isExpanded ? <ChevronUpIconOutline /> : <ChevronDownIconOutline />}\n </CleanIconButton>\n </div>\n )}\n </Component>\n );\n};\n"]}
|
|
@@ -36,7 +36,7 @@ import { hexToHsva, hsvaToHex, hsvaToRgba, Hue, rgbaToHex, rgbaToHsva, Saturatio
|
|
|
36
36
|
import classNames from 'classnames';
|
|
37
37
|
import { forwardRef, useEffect, useMemo, useState } from 'react';
|
|
38
38
|
import { CleanIconButton } from '../clean-icon-button';
|
|
39
|
-
import { EyeDropperIconOutline } from '../icons';
|
|
39
|
+
import { EyeDropperIconOutline } from '../icons/generated/heroIcons/EyeDropperIconOutline';
|
|
40
40
|
import { Select } from '../select';
|
|
41
41
|
import { TextInput } from '../text-input';
|
|
42
42
|
export const ColorPicker = forwardRef(function ColorPicker({ color, onChange, swatches = Object.values(tokens.graph).filter(validHex), shouldShowEyeDropper = true, className, style, }, ref) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ColorPicker.js","sourceRoot":"","sources":["../../../src/color-picker/ColorPicker.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 'eyedropper-polyfill';\n\nimport { tokens } from '@neo4j-ndl/base';\nimport {\n type HexColor,\n hexToHsva,\n type HsvaColor,\n hsvaToHex,\n hsvaToRgba,\n Hue,\n type PointerProps,\n type RgbaColor,\n rgbaToHex,\n rgbaToHsva,\n Saturation,\n validHex,\n} from '@uiw/react-color';\nimport classNames from 'classnames';\nimport { forwardRef, useEffect, useMemo, useState } from 'react';\n\nimport { CleanIconButton } from '../clean-icon-button';\nimport { EyeDropperIconOutline } from '../icons';\nimport { Select } from '../select';\nimport { TextInput } from '../text-input';\n\ntype ColorPickerProps = {\n /** The current color value. Can be provided in HSVA, RGBA, or Hex format. The component will automatically convert between formats as needed. */\n color: HsvaColor | RgbaColor | HexColor;\n /** Optional array of predefined color swatches for quick selection. Each swatch can be in HSVA, RGBA, or Hex format. */\n swatches?: (HsvaColor | RgbaColor | HexColor)[];\n /** Whether to display the eye dropper tool that allows users to sample colors from anywhere on the screen. */\n shouldShowEyeDropper?: boolean;\n /** Callback function triggered when the color value changes. Receives an object containing the new color in all three formats (hex, rgb, hsva) for convenience. */\n onChange: (newColor: {\n hex: HexColor;\n rgb: RgbaColor;\n hsva: HsvaColor;\n }) => void;\n /** Additional class name to apply to the root color picker container. */\n className?: string;\n /** Additional inline styles to apply to the root color picker container. */\n style?: React.CSSProperties;\n};\n\nexport const ColorPicker = forwardRef<HTMLDivElement, ColorPickerProps>(\n function ColorPicker(\n {\n color,\n onChange,\n swatches = Object.values(tokens.graph).filter(validHex),\n shouldShowEyeDropper = true,\n className,\n style,\n },\n ref,\n ) {\n const [isEyeDropperActiveState, setIsEyeDropperActiveState] =\n useState(false);\n\n const derivedHsva = useMemo(() => {\n if (typeof color === 'string') {\n return hexToHsva(color);\n }\n if (typeof color === 'object' && 'r' in color) {\n return rgbaToHsva(color);\n }\n return { h: 0, s: 0, v: 0, ...(color as object), a: 1 } as HsvaColor;\n }, [color]);\n\n const [hsva, setHsva] = useState<HsvaColor>(derivedHsva);\n\n const [format, setFormat] = useState<{\n label: string;\n value: string;\n }>({\n label: 'Hex',\n value: 'hex',\n });\n\n const isEyeDropperActive = 'EyeDropper' in window && shouldShowEyeDropper;\n\n const handleChange = (hsva: HsvaColor) => {\n setHsva(hsva);\n const hex = hsvaToHex(hsva);\n const rgb = hsvaToRgba(hsva);\n onChange({\n // used since typescript cannot infer the type of the color\n hex: `#${hex.split('#')[1]}`,\n hsva,\n rgb,\n });\n };\n\n return (\n <div\n ref={ref}\n className={classNames('ndl-color-picker', className)}\n style={style}\n >\n <Saturation\n hsva={hsva}\n className=\"ndl-color-picker-saturation\"\n onChange={(newColor) => {\n handleChange({ ...hsva, ...newColor, a: hsva.a });\n }}\n pointer={({ left, top, ...props }) => (\n <Pointer\n left={left?.toString()}\n top={top?.toString()}\n {...props}\n hsva={hsva}\n />\n )}\n radius={tokens.borderRadius['lg']}\n />\n <Swatch\n colors={swatches}\n hsva={hsva}\n onChange={(newColor) => {\n handleChange(newColor);\n }}\n />\n\n <div className=\"ndl-color-picker-hue-container\">\n {isEyeDropperActive && (\n <CleanIconButton\n size=\"small\"\n isActive={isEyeDropperActiveState}\n onClick={() => {\n setIsEyeDropperActiveState(true);\n // TODO: Remove the any casting when polyfiller is not needed anymore. https://developer.mozilla.org/en-US/docs/Web/API/EyeDropper\n // Type assertion to handle the unknown type\n // oxlint-disable-next-line @typescript-eslint/no-explicit-any\n const eyeDropper = new (window as any).EyeDropper();\n eyeDropper\n .open()\n .then((result: { sRGBHex: string }) => {\n handleChange(hexToHsva(result.sRGBHex));\n })\n .catch((err: Error) => {\n console.error(err);\n })\n .finally(() => {\n setIsEyeDropperActiveState(false);\n });\n }}\n description=\"Pick color from the screen with eye dropper tool\"\n >\n <EyeDropperIconOutline />\n </CleanIconButton>\n )}\n <Hue\n className=\"ndl-color-picker-hue\"\n hue={hsva.h}\n onChange={(newHue) => {\n handleChange({ ...hsva, h: newHue.h });\n }}\n radius={tokens.borderRadius['lg']}\n pointer={(props) => (\n <Pointer\n {...props}\n hsva={{\n a: 1,\n h: hsva.h,\n s: 100,\n v: 100,\n }}\n />\n )}\n />\n </div>\n\n <div className=\"ndl-color-picker-inputs\">\n <Select\n size=\"small\"\n type=\"select\"\n ariaLabel=\"Color format\"\n style={{\n flexShrink: 0,\n }}\n selectProps={{\n isSearchable: false,\n onChange: (newFormat) => {\n if (!newFormat) {\n return;\n }\n setFormat({\n label: newFormat.label,\n value: newFormat.value,\n });\n },\n options: [\n {\n label: 'Hex',\n value: 'hex',\n },\n {\n label: 'RGB',\n value: 'rgb',\n },\n ],\n value: { label: format.label, value: format.value },\n }}\n />\n {format.value === 'hex' && (\n <HexInput\n hsva={hsva}\n onChange={(newColor) => {\n handleChange(hexToHsva(newColor));\n }}\n />\n )}\n {format.value === 'rgb' && (\n <RgbInput\n hsva={hsva}\n onChange={(newColor) => {\n handleChange(hexToHsva(newColor));\n }}\n />\n )}\n </div>\n </div>\n );\n },\n);\n\nconst removeHashPrefix = (hex: string): string => hex.replace('#', '');\n\nconst HexInput = ({\n hsva,\n onChange,\n}: {\n hsva: HsvaColor;\n onChange: (newColor: string) => void;\n}) => {\n const [inputValue, setInputValue] = useState<string>(() =>\n removeHashPrefix(hsvaToHex(hsva)),\n );\n\n // Update input value when hsva changes from outside\n useEffect(() => {\n setInputValue(removeHashPrefix(hsvaToHex(hsva)));\n }, [hsva]);\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const value = removeHashPrefix(e.target.value);\n\n // Always update the input value for immediate feedback\n setInputValue(value);\n\n // Check if the input is a valid hex color (only 6 characters)\n const isValidHex = /^[0-9A-Fa-f]{6}$/.test(value);\n\n if (isValidHex) {\n onChange(`#${value}`);\n }\n };\n\n const hexValue = hsvaToHex(hsva);\n\n return (\n <TextInput\n size=\"small\"\n value={inputValue}\n leadingElement={\n <div className=\"ndl-color-picker-hex-input-prefix\">#</div>\n }\n onChange={handleChange}\n isFluid\n htmlAttributes={{\n 'aria-label': 'Hex color code',\n maxLength: 6,\n onCopy: (e) => {\n e.preventDefault();\n navigator.clipboard.writeText(hexValue);\n },\n }}\n />\n );\n};\n\nconst RgbInput = ({\n hsva,\n onChange,\n}: {\n hsva: HsvaColor;\n onChange: (newColor: string) => void;\n}) => {\n const rgba = hsvaToRgba(hsva);\n const [rgbValues, setRgbValues] = useState({\n b: rgba.b,\n g: rgba.g,\n r: rgba.r,\n });\n\n // Update input values when hsva changes from outside\n useEffect(() => {\n const newRgba = hsvaToRgba(hsva);\n setRgbValues({\n b: newRgba.b,\n g: newRgba.g,\n r: newRgba.r,\n });\n }, [hsva]);\n\n const handleChange = (\n channel: 'r' | 'g' | 'b',\n e: React.ChangeEvent<HTMLInputElement>,\n ) => {\n const value = parseInt(e.target.value, 10);\n\n // Validate the input is a number between 0-255\n const validValue = isNaN(value) ? 0 : Math.max(0, Math.min(255, value));\n\n const newRgbValues = {\n ...rgbValues,\n [channel]: validValue,\n };\n\n setRgbValues(newRgbValues);\n\n // Convert RGB to hex and call onChange\n const hexColor = `#${newRgbValues.r.toString(16).padStart(2, '0')}${newRgbValues.g.toString(16).padStart(2, '0')}${newRgbValues.b.toString(16).padStart(2, '0')}`;\n onChange(hexColor);\n };\n\n return (\n <div className=\"ndl-color-picker-rgb-inputs\">\n <TextInput\n size=\"small\"\n className=\"ndl-color-picker-rgb-input\"\n value={rgbValues.r.toString()}\n onChange={(e) => handleChange('r', e)}\n htmlAttributes={{\n 'aria-label': 'Red',\n max: '255',\n min: '0',\n type: 'number',\n }}\n />\n <TextInput\n size=\"small\"\n className=\"ndl-color-picker-rgb-input\"\n value={rgbValues.g.toString()}\n onChange={(e) => handleChange('g', e)}\n htmlAttributes={{\n 'aria-label': 'Green',\n max: '255',\n min: '0',\n type: 'number',\n }}\n />\n <TextInput\n size=\"small\"\n className=\"ndl-color-picker-rgb-input\"\n value={rgbValues.b.toString()}\n onChange={(e) => handleChange('b', e)}\n htmlAttributes={{\n 'aria-label': 'Blue',\n max: '255',\n min: '0',\n type: 'number',\n }}\n />\n </div>\n );\n};\n\nconst Swatch = ({\n colors,\n onChange,\n hsva,\n}: {\n colors: (HsvaColor | RgbaColor | HexColor)[];\n hsva: HsvaColor;\n onChange: (newColor: HsvaColor) => void;\n}) => {\n return (\n <div className=\"ndl-color-picker-swatch\">\n {colors.map((color) => {\n const hexColor =\n typeof color === 'string'\n ? color\n : typeof color === 'object' && 'r' in color\n ? rgbaToHex(color)\n : hsvaToHex(color);\n const hsvaColor =\n typeof color === 'string'\n ? hexToHsva(color)\n : 'r' in color\n ? rgbaToHsva(color)\n : color;\n\n const isActive =\n hsva.h === hsvaColor.h &&\n hsva.s === hsvaColor.s &&\n hsva.v === hsvaColor.v;\n\n return (\n <button\n type=\"button\"\n key={hexColor}\n aria-label={hexColor}\n className={classNames('ndl-color-picker-swatch-color', {\n 'ndl-color-picker-swatch-color-active': isActive,\n })}\n style={{ backgroundColor: hsvaToHex(hsvaColor) }}\n onClick={() => onChange(hsvaColor)}\n />\n );\n })}\n </div>\n );\n};\nconst Pointer = ({\n prefixCls,\n left,\n top,\n hsva,\n}: PointerProps & { hsva: HsvaColor }) => {\n const rgba = hsvaToRgba(hsva);\n return (\n <div\n style={{\n backgroundColor: `rgba(${rgba.r}, ${rgba.g}, ${rgba.b}, ${rgba.a})`,\n left,\n top,\n }}\n className={classNames(prefixCls, 'ndl-color-picker-pointer')}\n />\n );\n};\n"]}
|
|
1
|
+
{"version":3,"file":"ColorPicker.js","sourceRoot":"","sources":["../../../src/color-picker/ColorPicker.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,OAAO,qBAAqB,CAAC;AAE7B,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACzC,OAAO,EAEL,SAAS,EAET,SAAS,EACT,UAAU,EACV,GAAG,EAGH,SAAS,EACT,UAAU,EACV,UAAU,EACV,QAAQ,GACT,MAAM,kBAAkB,CAAC;AAC1B,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjE,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AACvD,OAAO,EAAE,qBAAqB,EAAE,MAAM,oDAAoD,CAAC;AAC3F,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AACnC,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAqB1C,MAAM,CAAC,MAAM,WAAW,GAAG,UAAU,CACnC,SAAS,WAAW,CAClB,EACE,KAAK,EACL,QAAQ,EACR,QAAQ,GAAG,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,EACvD,oBAAoB,GAAG,IAAI,EAC3B,SAAS,EACT,KAAK,GACN,EACD,GAAG;IAEH,MAAM,CAAC,uBAAuB,EAAE,0BAA0B,CAAC,GACzD,QAAQ,CAAC,KAAK,CAAC,CAAC;IAElB,MAAM,WAAW,GAAG,OAAO,CAAC,GAAG,EAAE;QAC/B,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE,CAAC;YAC9B,OAAO,SAAS,CAAC,KAAK,CAAC,CAAC;QAC1B,CAAC;QACD,IAAI,OAAO,KAAK,KAAK,QAAQ,IAAI,GAAG,IAAI,KAAK,EAAE,CAAC;YAC9C,OAAO,UAAU,CAAC,KAAK,CAAC,CAAC;QAC3B,CAAC;QACD,OAAO,8BAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,IAAM,KAAgB,KAAE,CAAC,EAAE,CAAC,GAAe,CAAC;IACvE,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAY,WAAW,CAAC,CAAC;IAEzD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAGjC;QACD,KAAK,EAAE,KAAK;QACZ,KAAK,EAAE,KAAK;KACb,CAAC,CAAC;IAEH,MAAM,kBAAkB,GAAG,YAAY,IAAI,MAAM,IAAI,oBAAoB,CAAC;IAE1E,MAAM,YAAY,GAAG,CAAC,IAAe,EAAE,EAAE;QACvC,OAAO,CAAC,IAAI,CAAC,CAAC;QACd,MAAM,GAAG,GAAG,SAAS,CAAC,IAAI,CAAC,CAAC;QAC5B,MAAM,GAAG,GAAG,UAAU,CAAC,IAAI,CAAC,CAAC;QAC7B,QAAQ,CAAC;YACP,2DAA2D;YAC3D,GAAG,EAAE,IAAI,GAAG,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,EAAE;YAC5B,IAAI;YACJ,GAAG;SACJ,CAAC,CAAC;IACL,CAAC,CAAC;IAEF,OAAO,CACL,eACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,UAAU,CAAC,kBAAkB,EAAE,SAAS,CAAC,EACpD,KAAK,EAAE,KAAK,aAEZ,KAAC,UAAU,IACT,IAAI,EAAE,IAAI,EACV,SAAS,EAAC,6BAA6B,EACvC,QAAQ,EAAE,CAAC,QAAQ,EAAE,EAAE;oBACrB,YAAY,+CAAM,IAAI,GAAK,QAAQ,KAAE,CAAC,EAAE,IAAI,CAAC,CAAC,IAAG,CAAC;gBACpD,CAAC,EACD,OAAO,EAAE,CAAC,EAAuB,EAAE,EAAE;wBAA3B,EAAE,IAAI,EAAE,GAAG,OAAY,EAAP,KAAK,cAArB,eAAuB,CAAF;oBAAO,OAAA,CACpC,KAAC,OAAO,kBACN,IAAI,EAAE,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,QAAQ,EAAE,EACtB,GAAG,EAAE,GAAG,aAAH,GAAG,uBAAH,GAAG,CAAE,QAAQ,EAAE,IAChB,KAAK,IACT,IAAI,EAAE,IAAI,IACV,CACH,CAAA;iBAAA,EACD,MAAM,EAAE,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,GACjC,EACF,KAAC,MAAM,IACL,MAAM,EAAE,QAAQ,EAChB,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,CAAC,QAAQ,EAAE,EAAE;oBACrB,YAAY,CAAC,QAAQ,CAAC,CAAC;gBACzB,CAAC,GACD,EAEF,eAAK,SAAS,EAAC,gCAAgC,aAC5C,kBAAkB,IAAI,CACrB,KAAC,eAAe,IACd,IAAI,EAAC,OAAO,EACZ,QAAQ,EAAE,uBAAuB,EACjC,OAAO,EAAE,GAAG,EAAE;4BACZ,0BAA0B,CAAC,IAAI,CAAC,CAAC;4BACjC,kIAAkI;4BAClI,4CAA4C;4BAC5C,8DAA8D;4BAC9D,MAAM,UAAU,GAAG,IAAK,MAAc,CAAC,UAAU,EAAE,CAAC;4BACpD,UAAU;iCACP,IAAI,EAAE;iCACN,IAAI,CAAC,CAAC,MAA2B,EAAE,EAAE;gCACpC,YAAY,CAAC,SAAS,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC;4BAC1C,CAAC,CAAC;iCACD,KAAK,CAAC,CAAC,GAAU,EAAE,EAAE;gCACpB,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;4BACrB,CAAC,CAAC;iCACD,OAAO,CAAC,GAAG,EAAE;gCACZ,0BAA0B,CAAC,KAAK,CAAC,CAAC;4BACpC,CAAC,CAAC,CAAC;wBACP,CAAC,EACD,WAAW,EAAC,kDAAkD,YAE9D,KAAC,qBAAqB,KAAG,GACT,CACnB,EACD,KAAC,GAAG,IACF,SAAS,EAAC,sBAAsB,EAChC,GAAG,EAAE,IAAI,CAAC,CAAC,EACX,QAAQ,EAAE,CAAC,MAAM,EAAE,EAAE;4BACnB,YAAY,iCAAM,IAAI,KAAE,CAAC,EAAE,MAAM,CAAC,CAAC,IAAG,CAAC;wBACzC,CAAC,EACD,MAAM,EAAE,MAAM,CAAC,YAAY,CAAC,IAAI,CAAC,EACjC,OAAO,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,CAClB,KAAC,OAAO,oBACF,KAAK,IACT,IAAI,EAAE;gCACJ,CAAC,EAAE,CAAC;gCACJ,CAAC,EAAE,IAAI,CAAC,CAAC;gCACT,CAAC,EAAE,GAAG;gCACN,CAAC,EAAE,GAAG;6BACP,IACD,CACH,GACD,IACE,EAEN,eAAK,SAAS,EAAC,yBAAyB,aACtC,KAAC,MAAM,IACL,IAAI,EAAC,OAAO,EACZ,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,cAAc,EACxB,KAAK,EAAE;4BACL,UAAU,EAAE,CAAC;yBACd,EACD,WAAW,EAAE;4BACX,YAAY,EAAE,KAAK;4BACnB,QAAQ,EAAE,CAAC,SAAS,EAAE,EAAE;gCACtB,IAAI,CAAC,SAAS,EAAE,CAAC;oCACf,OAAO;gCACT,CAAC;gCACD,SAAS,CAAC;oCACR,KAAK,EAAE,SAAS,CAAC,KAAK;oCACtB,KAAK,EAAE,SAAS,CAAC,KAAK;iCACvB,CAAC,CAAC;4BACL,CAAC;4BACD,OAAO,EAAE;gCACP;oCACE,KAAK,EAAE,KAAK;oCACZ,KAAK,EAAE,KAAK;iCACb;gCACD;oCACE,KAAK,EAAE,KAAK;oCACZ,KAAK,EAAE,KAAK;iCACb;6BACF;4BACD,KAAK,EAAE,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,EAAE;yBACpD,GACD,EACD,MAAM,CAAC,KAAK,KAAK,KAAK,IAAI,CACzB,KAAC,QAAQ,IACP,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,CAAC,QAAQ,EAAE,EAAE;4BACrB,YAAY,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC;wBACpC,CAAC,GACD,CACH,EACA,MAAM,CAAC,KAAK,KAAK,KAAK,IAAI,CACzB,KAAC,QAAQ,IACP,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,CAAC,QAAQ,EAAE,EAAE;4BACrB,YAAY,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC;wBACpC,CAAC,GACD,CACH,IACG,IACF,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,MAAM,gBAAgB,GAAG,CAAC,GAAW,EAAU,EAAE,CAAC,GAAG,CAAC,OAAO,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC;AAEvE,MAAM,QAAQ,GAAG,CAAC,EAChB,IAAI,EACJ,QAAQ,GAIT,EAAE,EAAE;IACH,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAS,GAAG,EAAE,CACxD,gBAAgB,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAClC,CAAC;IAEF,oDAAoD;IACpD,SAAS,CAAC,GAAG,EAAE;QACb,aAAa,CAAC,gBAAgB,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;IACnD,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEX,MAAM,YAAY,GAAG,CAAC,CAAsC,EAAE,EAAE;QAC9D,MAAM,KAAK,GAAG,gBAAgB,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QAE/C,uDAAuD;QACvD,aAAa,CAAC,KAAK,CAAC,CAAC;QAErB,8DAA8D;QAC9D,MAAM,UAAU,GAAG,kBAAkB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAElD,IAAI,UAAU,EAAE,CAAC;YACf,QAAQ,CAAC,IAAI,KAAK,EAAE,CAAC,CAAC;QACxB,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,QAAQ,GAAG,SAAS,CAAC,IAAI,CAAC,CAAC;IAEjC,OAAO,CACL,KAAC,SAAS,IACR,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE,UAAU,EACjB,cAAc,EACZ,cAAK,SAAS,EAAC,mCAAmC,kBAAQ,EAE5D,QAAQ,EAAE,YAAY,EACtB,OAAO,QACP,cAAc,EAAE;YACd,YAAY,EAAE,gBAAgB;YAC9B,SAAS,EAAE,CAAC;YACZ,MAAM,EAAE,CAAC,CAAC,EAAE,EAAE;gBACZ,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,SAAS,CAAC,SAAS,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC;YAC1C,CAAC;SACF,GACD,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,QAAQ,GAAG,CAAC,EAChB,IAAI,EACJ,QAAQ,GAIT,EAAE,EAAE;IACH,MAAM,IAAI,GAAG,UAAU,CAAC,IAAI,CAAC,CAAC;IAC9B,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC;QACzC,CAAC,EAAE,IAAI,CAAC,CAAC;QACT,CAAC,EAAE,IAAI,CAAC,CAAC;QACT,CAAC,EAAE,IAAI,CAAC,CAAC;KACV,CAAC,CAAC;IAEH,qDAAqD;IACrD,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,OAAO,GAAG,UAAU,CAAC,IAAI,CAAC,CAAC;QACjC,YAAY,CAAC;YACX,CAAC,EAAE,OAAO,CAAC,CAAC;YACZ,CAAC,EAAE,OAAO,CAAC,CAAC;YACZ,CAAC,EAAE,OAAO,CAAC,CAAC;SACb,CAAC,CAAC;IACL,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEX,MAAM,YAAY,GAAG,CACnB,OAAwB,EACxB,CAAsC,EACtC,EAAE;QACF,MAAM,KAAK,GAAG,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;QAE3C,+CAA+C;QAC/C,MAAM,UAAU,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC,CAAC;QAExE,MAAM,YAAY,mCACb,SAAS,KACZ,CAAC,OAAO,CAAC,EAAE,UAAU,GACtB,CAAC;QAEF,YAAY,CAAC,YAAY,CAAC,CAAC;QAE3B,uCAAuC;QACvC,MAAM,QAAQ,GAAG,IAAI,YAAY,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,GAAG,YAAY,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,GAAG,YAAY,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,EAAE,CAAC;QAClK,QAAQ,CAAC,QAAQ,CAAC,CAAC;IACrB,CAAC,CAAC;IAEF,OAAO,CACL,eAAK,SAAS,EAAC,6BAA6B,aAC1C,KAAC,SAAS,IACR,IAAI,EAAC,OAAO,EACZ,SAAS,EAAC,4BAA4B,EACtC,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC,QAAQ,EAAE,EAC7B,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,YAAY,CAAC,GAAG,EAAE,CAAC,CAAC,EACrC,cAAc,EAAE;oBACd,YAAY,EAAE,KAAK;oBACnB,GAAG,EAAE,KAAK;oBACV,GAAG,EAAE,GAAG;oBACR,IAAI,EAAE,QAAQ;iBACf,GACD,EACF,KAAC,SAAS,IACR,IAAI,EAAC,OAAO,EACZ,SAAS,EAAC,4BAA4B,EACtC,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC,QAAQ,EAAE,EAC7B,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,YAAY,CAAC,GAAG,EAAE,CAAC,CAAC,EACrC,cAAc,EAAE;oBACd,YAAY,EAAE,OAAO;oBACrB,GAAG,EAAE,KAAK;oBACV,GAAG,EAAE,GAAG;oBACR,IAAI,EAAE,QAAQ;iBACf,GACD,EACF,KAAC,SAAS,IACR,IAAI,EAAC,OAAO,EACZ,SAAS,EAAC,4BAA4B,EACtC,KAAK,EAAE,SAAS,CAAC,CAAC,CAAC,QAAQ,EAAE,EAC7B,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,YAAY,CAAC,GAAG,EAAE,CAAC,CAAC,EACrC,cAAc,EAAE;oBACd,YAAY,EAAE,MAAM;oBACpB,GAAG,EAAE,KAAK;oBACV,GAAG,EAAE,GAAG;oBACR,IAAI,EAAE,QAAQ;iBACf,GACD,IACE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,MAAM,GAAG,CAAC,EACd,MAAM,EACN,QAAQ,EACR,IAAI,GAKL,EAAE,EAAE;IACH,OAAO,CACL,cAAK,SAAS,EAAC,yBAAyB,YACrC,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE;YACpB,MAAM,QAAQ,GACZ,OAAO,KAAK,KAAK,QAAQ;gBACvB,CAAC,CAAC,KAAK;gBACP,CAAC,CAAC,OAAO,KAAK,KAAK,QAAQ,IAAI,GAAG,IAAI,KAAK;oBACzC,CAAC,CAAC,SAAS,CAAC,KAAK,CAAC;oBAClB,CAAC,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;YACzB,MAAM,SAAS,GACb,OAAO,KAAK,KAAK,QAAQ;gBACvB,CAAC,CAAC,SAAS,CAAC,KAAK,CAAC;gBAClB,CAAC,CAAC,GAAG,IAAI,KAAK;oBACZ,CAAC,CAAC,UAAU,CAAC,KAAK,CAAC;oBACnB,CAAC,CAAC,KAAK,CAAC;YAEd,MAAM,QAAQ,GACZ,IAAI,CAAC,CAAC,KAAK,SAAS,CAAC,CAAC;gBACtB,IAAI,CAAC,CAAC,KAAK,SAAS,CAAC,CAAC;gBACtB,IAAI,CAAC,CAAC,KAAK,SAAS,CAAC,CAAC,CAAC;YAEzB,OAAO,CACL,iBACE,IAAI,EAAC,QAAQ,gBAED,QAAQ,EACpB,SAAS,EAAE,UAAU,CAAC,+BAA+B,EAAE;oBACrD,sCAAsC,EAAE,QAAQ;iBACjD,CAAC,EACF,KAAK,EAAE,EAAE,eAAe,EAAE,SAAS,CAAC,SAAS,CAAC,EAAE,EAChD,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,SAAS,CAAC,IAN7B,QAAQ,CAOb,CACH,CAAC;QACJ,CAAC,CAAC,GACE,CACP,CAAC;AACJ,CAAC,CAAC;AACF,MAAM,OAAO,GAAG,CAAC,EACf,SAAS,EACT,IAAI,EACJ,GAAG,EACH,IAAI,GAC+B,EAAE,EAAE;IACvC,MAAM,IAAI,GAAG,UAAU,CAAC,IAAI,CAAC,CAAC;IAC9B,OAAO,CACL,cACE,KAAK,EAAE;YACL,eAAe,EAAE,QAAQ,IAAI,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,GAAG;YACnE,IAAI;YACJ,GAAG;SACJ,EACD,SAAS,EAAE,UAAU,CAAC,SAAS,EAAE,0BAA0B,CAAC,GAC5D,CACH,CAAC;AACJ,CAAC,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 */\nimport 'eyedropper-polyfill';\n\nimport { tokens } from '@neo4j-ndl/base';\nimport {\n type HexColor,\n hexToHsva,\n type HsvaColor,\n hsvaToHex,\n hsvaToRgba,\n Hue,\n type PointerProps,\n type RgbaColor,\n rgbaToHex,\n rgbaToHsva,\n Saturation,\n validHex,\n} from '@uiw/react-color';\nimport classNames from 'classnames';\nimport { forwardRef, useEffect, useMemo, useState } from 'react';\n\nimport { CleanIconButton } from '../clean-icon-button';\nimport { EyeDropperIconOutline } from '../icons/generated/heroIcons/EyeDropperIconOutline';\nimport { Select } from '../select';\nimport { TextInput } from '../text-input';\n\ntype ColorPickerProps = {\n /** The current color value. Can be provided in HSVA, RGBA, or Hex format. The component will automatically convert between formats as needed. */\n color: HsvaColor | RgbaColor | HexColor;\n /** Optional array of predefined color swatches for quick selection. Each swatch can be in HSVA, RGBA, or Hex format. */\n swatches?: (HsvaColor | RgbaColor | HexColor)[];\n /** Whether to display the eye dropper tool that allows users to sample colors from anywhere on the screen. */\n shouldShowEyeDropper?: boolean;\n /** Callback function triggered when the color value changes. Receives an object containing the new color in all three formats (hex, rgb, hsva) for convenience. */\n onChange: (newColor: {\n hex: HexColor;\n rgb: RgbaColor;\n hsva: HsvaColor;\n }) => void;\n /** Additional class name to apply to the root color picker container. */\n className?: string;\n /** Additional inline styles to apply to the root color picker container. */\n style?: React.CSSProperties;\n};\n\nexport const ColorPicker = forwardRef<HTMLDivElement, ColorPickerProps>(\n function ColorPicker(\n {\n color,\n onChange,\n swatches = Object.values(tokens.graph).filter(validHex),\n shouldShowEyeDropper = true,\n className,\n style,\n },\n ref,\n ) {\n const [isEyeDropperActiveState, setIsEyeDropperActiveState] =\n useState(false);\n\n const derivedHsva = useMemo(() => {\n if (typeof color === 'string') {\n return hexToHsva(color);\n }\n if (typeof color === 'object' && 'r' in color) {\n return rgbaToHsva(color);\n }\n return { h: 0, s: 0, v: 0, ...(color as object), a: 1 } as HsvaColor;\n }, [color]);\n\n const [hsva, setHsva] = useState<HsvaColor>(derivedHsva);\n\n const [format, setFormat] = useState<{\n label: string;\n value: string;\n }>({\n label: 'Hex',\n value: 'hex',\n });\n\n const isEyeDropperActive = 'EyeDropper' in window && shouldShowEyeDropper;\n\n const handleChange = (hsva: HsvaColor) => {\n setHsva(hsva);\n const hex = hsvaToHex(hsva);\n const rgb = hsvaToRgba(hsva);\n onChange({\n // used since typescript cannot infer the type of the color\n hex: `#${hex.split('#')[1]}`,\n hsva,\n rgb,\n });\n };\n\n return (\n <div\n ref={ref}\n className={classNames('ndl-color-picker', className)}\n style={style}\n >\n <Saturation\n hsva={hsva}\n className=\"ndl-color-picker-saturation\"\n onChange={(newColor) => {\n handleChange({ ...hsva, ...newColor, a: hsva.a });\n }}\n pointer={({ left, top, ...props }) => (\n <Pointer\n left={left?.toString()}\n top={top?.toString()}\n {...props}\n hsva={hsva}\n />\n )}\n radius={tokens.borderRadius['lg']}\n />\n <Swatch\n colors={swatches}\n hsva={hsva}\n onChange={(newColor) => {\n handleChange(newColor);\n }}\n />\n\n <div className=\"ndl-color-picker-hue-container\">\n {isEyeDropperActive && (\n <CleanIconButton\n size=\"small\"\n isActive={isEyeDropperActiveState}\n onClick={() => {\n setIsEyeDropperActiveState(true);\n // TODO: Remove the any casting when polyfiller is not needed anymore. https://developer.mozilla.org/en-US/docs/Web/API/EyeDropper\n // Type assertion to handle the unknown type\n // oxlint-disable-next-line @typescript-eslint/no-explicit-any\n const eyeDropper = new (window as any).EyeDropper();\n eyeDropper\n .open()\n .then((result: { sRGBHex: string }) => {\n handleChange(hexToHsva(result.sRGBHex));\n })\n .catch((err: Error) => {\n console.error(err);\n })\n .finally(() => {\n setIsEyeDropperActiveState(false);\n });\n }}\n description=\"Pick color from the screen with eye dropper tool\"\n >\n <EyeDropperIconOutline />\n </CleanIconButton>\n )}\n <Hue\n className=\"ndl-color-picker-hue\"\n hue={hsva.h}\n onChange={(newHue) => {\n handleChange({ ...hsva, h: newHue.h });\n }}\n radius={tokens.borderRadius['lg']}\n pointer={(props) => (\n <Pointer\n {...props}\n hsva={{\n a: 1,\n h: hsva.h,\n s: 100,\n v: 100,\n }}\n />\n )}\n />\n </div>\n\n <div className=\"ndl-color-picker-inputs\">\n <Select\n size=\"small\"\n type=\"select\"\n ariaLabel=\"Color format\"\n style={{\n flexShrink: 0,\n }}\n selectProps={{\n isSearchable: false,\n onChange: (newFormat) => {\n if (!newFormat) {\n return;\n }\n setFormat({\n label: newFormat.label,\n value: newFormat.value,\n });\n },\n options: [\n {\n label: 'Hex',\n value: 'hex',\n },\n {\n label: 'RGB',\n value: 'rgb',\n },\n ],\n value: { label: format.label, value: format.value },\n }}\n />\n {format.value === 'hex' && (\n <HexInput\n hsva={hsva}\n onChange={(newColor) => {\n handleChange(hexToHsva(newColor));\n }}\n />\n )}\n {format.value === 'rgb' && (\n <RgbInput\n hsva={hsva}\n onChange={(newColor) => {\n handleChange(hexToHsva(newColor));\n }}\n />\n )}\n </div>\n </div>\n );\n },\n);\n\nconst removeHashPrefix = (hex: string): string => hex.replace('#', '');\n\nconst HexInput = ({\n hsva,\n onChange,\n}: {\n hsva: HsvaColor;\n onChange: (newColor: string) => void;\n}) => {\n const [inputValue, setInputValue] = useState<string>(() =>\n removeHashPrefix(hsvaToHex(hsva)),\n );\n\n // Update input value when hsva changes from outside\n useEffect(() => {\n setInputValue(removeHashPrefix(hsvaToHex(hsva)));\n }, [hsva]);\n\n const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n const value = removeHashPrefix(e.target.value);\n\n // Always update the input value for immediate feedback\n setInputValue(value);\n\n // Check if the input is a valid hex color (only 6 characters)\n const isValidHex = /^[0-9A-Fa-f]{6}$/.test(value);\n\n if (isValidHex) {\n onChange(`#${value}`);\n }\n };\n\n const hexValue = hsvaToHex(hsva);\n\n return (\n <TextInput\n size=\"small\"\n value={inputValue}\n leadingElement={\n <div className=\"ndl-color-picker-hex-input-prefix\">#</div>\n }\n onChange={handleChange}\n isFluid\n htmlAttributes={{\n 'aria-label': 'Hex color code',\n maxLength: 6,\n onCopy: (e) => {\n e.preventDefault();\n navigator.clipboard.writeText(hexValue);\n },\n }}\n />\n );\n};\n\nconst RgbInput = ({\n hsva,\n onChange,\n}: {\n hsva: HsvaColor;\n onChange: (newColor: string) => void;\n}) => {\n const rgba = hsvaToRgba(hsva);\n const [rgbValues, setRgbValues] = useState({\n b: rgba.b,\n g: rgba.g,\n r: rgba.r,\n });\n\n // Update input values when hsva changes from outside\n useEffect(() => {\n const newRgba = hsvaToRgba(hsva);\n setRgbValues({\n b: newRgba.b,\n g: newRgba.g,\n r: newRgba.r,\n });\n }, [hsva]);\n\n const handleChange = (\n channel: 'r' | 'g' | 'b',\n e: React.ChangeEvent<HTMLInputElement>,\n ) => {\n const value = parseInt(e.target.value, 10);\n\n // Validate the input is a number between 0-255\n const validValue = isNaN(value) ? 0 : Math.max(0, Math.min(255, value));\n\n const newRgbValues = {\n ...rgbValues,\n [channel]: validValue,\n };\n\n setRgbValues(newRgbValues);\n\n // Convert RGB to hex and call onChange\n const hexColor = `#${newRgbValues.r.toString(16).padStart(2, '0')}${newRgbValues.g.toString(16).padStart(2, '0')}${newRgbValues.b.toString(16).padStart(2, '0')}`;\n onChange(hexColor);\n };\n\n return (\n <div className=\"ndl-color-picker-rgb-inputs\">\n <TextInput\n size=\"small\"\n className=\"ndl-color-picker-rgb-input\"\n value={rgbValues.r.toString()}\n onChange={(e) => handleChange('r', e)}\n htmlAttributes={{\n 'aria-label': 'Red',\n max: '255',\n min: '0',\n type: 'number',\n }}\n />\n <TextInput\n size=\"small\"\n className=\"ndl-color-picker-rgb-input\"\n value={rgbValues.g.toString()}\n onChange={(e) => handleChange('g', e)}\n htmlAttributes={{\n 'aria-label': 'Green',\n max: '255',\n min: '0',\n type: 'number',\n }}\n />\n <TextInput\n size=\"small\"\n className=\"ndl-color-picker-rgb-input\"\n value={rgbValues.b.toString()}\n onChange={(e) => handleChange('b', e)}\n htmlAttributes={{\n 'aria-label': 'Blue',\n max: '255',\n min: '0',\n type: 'number',\n }}\n />\n </div>\n );\n};\n\nconst Swatch = ({\n colors,\n onChange,\n hsva,\n}: {\n colors: (HsvaColor | RgbaColor | HexColor)[];\n hsva: HsvaColor;\n onChange: (newColor: HsvaColor) => void;\n}) => {\n return (\n <div className=\"ndl-color-picker-swatch\">\n {colors.map((color) => {\n const hexColor =\n typeof color === 'string'\n ? color\n : typeof color === 'object' && 'r' in color\n ? rgbaToHex(color)\n : hsvaToHex(color);\n const hsvaColor =\n typeof color === 'string'\n ? hexToHsva(color)\n : 'r' in color\n ? rgbaToHsva(color)\n : color;\n\n const isActive =\n hsva.h === hsvaColor.h &&\n hsva.s === hsvaColor.s &&\n hsva.v === hsvaColor.v;\n\n return (\n <button\n type=\"button\"\n key={hexColor}\n aria-label={hexColor}\n className={classNames('ndl-color-picker-swatch-color', {\n 'ndl-color-picker-swatch-color-active': isActive,\n })}\n style={{ backgroundColor: hsvaToHex(hsvaColor) }}\n onClick={() => onChange(hsvaColor)}\n />\n );\n })}\n </div>\n );\n};\nconst Pointer = ({\n prefixCls,\n left,\n top,\n hsva,\n}: PointerProps & { hsva: HsvaColor }) => {\n const rgba = hsvaToRgba(hsva);\n return (\n <div\n style={{\n backgroundColor: `rgba(${rgba.r}, ${rgba.g}, ${rgba.b}, ${rgba.a})`,\n left,\n top,\n }}\n className={classNames(prefixCls, 'ndl-color-picker-pointer')}\n />\n );\n};\n"]}
|
|
@@ -35,7 +35,14 @@ import { flexRender, } from '@tanstack/react-table';
|
|
|
35
35
|
import classNames from 'classnames';
|
|
36
36
|
import { Fragment, useCallback, useEffect, useMemo, useRef, useState, } from 'react';
|
|
37
37
|
import { CleanIconButton } from '../clean-icon-button';
|
|
38
|
-
import
|
|
38
|
+
import DataGridCrossIcon from '../icons/generated/custom/DataGridCross';
|
|
39
|
+
import { Bars3CenterLeftIconOutline } from '../icons/generated/heroIcons/Bars3CenterLeftIconOutline';
|
|
40
|
+
import { BarsArrowDownIconOutline } from '../icons/generated/heroIcons/BarsArrowDownIconOutline';
|
|
41
|
+
import { BarsArrowUpIconOutline } from '../icons/generated/heroIcons/BarsArrowUpIconOutline';
|
|
42
|
+
import { ChevronDownIconSolid } from '../icons/generated/heroIcons/ChevronDownIconSolid';
|
|
43
|
+
import { ChevronLeftIconOutline } from '../icons/generated/heroIcons/ChevronLeftIconOutline';
|
|
44
|
+
import { ChevronRightIconOutline } from '../icons/generated/heroIcons/ChevronRightIconOutline';
|
|
45
|
+
import { EllipsisHorizontalIconOutline } from '../icons/generated/heroIcons/EllipsisHorizontalIconOutline';
|
|
39
46
|
import { LoadingSpinner } from '../loading-spinner';
|
|
40
47
|
import { Menu } from '../menu';
|
|
41
48
|
import { Select } from '../select';
|