@neo4j-ndl/react 4.11.2 → 4.11.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (42) hide show
  1. package/lib/cjs/clean-icon-button/CleanIconButton.js +2 -2
  2. package/lib/cjs/clean-icon-button/CleanIconButton.js.map +1 -1
  3. package/lib/cjs/clean-icon-button/stories/clean-icon-button-keyboard-display.story.js +1 -1
  4. package/lib/cjs/clean-icon-button/stories/clean-icon-button-keyboard-display.story.js.map +1 -1
  5. package/lib/cjs/clipboard-button/ClipboardButton.js +5 -5
  6. package/lib/cjs/clipboard-button/ClipboardButton.js.map +1 -1
  7. package/lib/cjs/icon-button/IconButton.js +2 -2
  8. package/lib/cjs/icon-button/IconButton.js.map +1 -1
  9. package/lib/cjs/icon-button-base/IconButtonBase.js +4 -4
  10. package/lib/cjs/icon-button-base/IconButtonBase.js.map +1 -1
  11. package/lib/cjs/kbd/stories/index.js +4 -4
  12. package/lib/cjs/kbd/stories/index.js.map +1 -1
  13. package/lib/cjs/kbd/stories/{kdb-sequence.story.js → kbd-sequence.story.js} +1 -1
  14. package/lib/cjs/kbd/stories/{kdb-sequence.story.js.map → kbd-sequence.story.js.map} +1 -1
  15. package/lib/cjs/menu/Menu.js +38 -6
  16. package/lib/cjs/menu/Menu.js.map +1 -1
  17. package/lib/esm/clean-icon-button/CleanIconButton.js +2 -2
  18. package/lib/esm/clean-icon-button/CleanIconButton.js.map +1 -1
  19. package/lib/esm/clean-icon-button/stories/clean-icon-button-keyboard-display.story.js +1 -1
  20. package/lib/esm/clean-icon-button/stories/clean-icon-button-keyboard-display.story.js.map +1 -1
  21. package/lib/esm/clipboard-button/ClipboardButton.js +5 -5
  22. package/lib/esm/clipboard-button/ClipboardButton.js.map +1 -1
  23. package/lib/esm/icon-button/IconButton.js +2 -2
  24. package/lib/esm/icon-button/IconButton.js.map +1 -1
  25. package/lib/esm/icon-button-base/IconButtonBase.js +4 -4
  26. package/lib/esm/icon-button-base/IconButtonBase.js.map +1 -1
  27. package/lib/esm/kbd/stories/index.js +2 -2
  28. package/lib/esm/kbd/stories/index.js.map +1 -1
  29. package/lib/esm/kbd/stories/{kdb-sequence.story.js → kbd-sequence.story.js} +1 -1
  30. package/lib/esm/kbd/stories/{kdb-sequence.story.js.map → kbd-sequence.story.js.map} +1 -1
  31. package/lib/esm/menu/Menu.js +39 -7
  32. package/lib/esm/menu/Menu.js.map +1 -1
  33. package/lib/types/clean-icon-button/CleanIconButton.d.ts +1 -1
  34. package/lib/types/clipboard-button/ClipboardButton.d.ts +2 -2
  35. package/lib/types/icon-button/IconButton.d.ts +1 -1
  36. package/lib/types/icon-button-base/IconButtonBase.d.ts +2 -2
  37. package/lib/types/kbd/stories/index.d.ts +1 -1
  38. package/lib/types/kbd/stories/{kdb-sequence.story.d.ts → kbd-sequence.story.d.ts} +1 -1
  39. package/lib/types/kbd/stories/kbd-sequence.story.d.ts.map +1 -0
  40. package/lib/types/menu/Menu.d.ts.map +1 -1
  41. package/package.json +2 -2
  42. package/lib/types/kbd/stories/kdb-sequence.story.d.ts.map +0 -1
@@ -38,8 +38,8 @@ const icon_button_base_1 = require("../icon-button-base");
38
38
  const CleanIconButton = (_a) => {
39
39
  var { children, as, isLoading = false, isDisabled = false, size = 'medium',
40
40
  // Does not have a default value to avoid setting aria-pressed to true if not explicitly set
41
- isActive, variant = 'neutral', description, descriptionKdbProps, tooltipProps, className, style, htmlAttributes, onClick, ref } = _a, restProps = __rest(_a, ["children", "as", "isLoading", "isDisabled", "size", "isActive", "variant", "description", "descriptionKdbProps", "tooltipProps", "className", "style", "htmlAttributes", "onClick", "ref"]);
42
- return ((0, jsx_runtime_1.jsx)(icon_button_base_1.IconButtonBase, Object.assign({ as: as, iconButtonVariant: "clean", isDisabled: isDisabled, size: size, isLoading: isLoading, isActive: isActive, variant: variant, descriptionKdbProps: descriptionKdbProps, description: description, tooltipProps: tooltipProps, className: className, style: style, htmlAttributes: htmlAttributes, onClick: onClick, ref: ref }, restProps, { children: children })));
41
+ isActive, variant = 'neutral', description, descriptionKbdProps, tooltipProps, className, style, htmlAttributes, onClick, ref } = _a, restProps = __rest(_a, ["children", "as", "isLoading", "isDisabled", "size", "isActive", "variant", "description", "descriptionKbdProps", "tooltipProps", "className", "style", "htmlAttributes", "onClick", "ref"]);
42
+ return ((0, jsx_runtime_1.jsx)(icon_button_base_1.IconButtonBase, Object.assign({ as: as, iconButtonVariant: "clean", isDisabled: isDisabled, size: size, isLoading: isLoading, isActive: isActive, variant: variant, descriptionKbdProps: descriptionKbdProps, description: description, tooltipProps: tooltipProps, className: className, style: style, htmlAttributes: htmlAttributes, onClick: onClick, ref: ref }, restProps, { children: children })));
43
43
  };
44
44
  exports.CleanIconButton = CleanIconButton;
45
45
  //# sourceMappingURL=CleanIconButton.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"CleanIconButton.js","sourceRoot":"","sources":["../../../src/clean-icon-button/CleanIconButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;AAuBA,0DAA+E;AAOxE,MAAM,eAAe,GAAG,CAAyC,EAkBhB,EAAE,EAAE;QAlBY,EACtE,QAAQ,EACR,EAAE,EACF,SAAS,GAAG,KAAK,EACjB,UAAU,GAAG,KAAK,EAClB,IAAI,GAAG,QAAQ;IACf,4FAA4F;IAC5F,QAAQ,EACR,OAAO,GAAG,SAAS,EACnB,WAAW,EACX,mBAAmB,EACnB,YAAY,EACZ,SAAS,EACT,KAAK,EACL,cAAc,EACd,OAAO,EACP,GAAG,OAEmD,EADnD,SAAS,cAjB0D,4LAkBvE,CADa;IAEZ,OAAO,CACL,uBAAC,iCAAc,kBACb,EAAE,EAAE,EAAE,EACN,iBAAiB,EAAC,OAAO,EACzB,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,EAChB,mBAAmB,EAAE,mBAAmB,EACxC,WAAW,EAAE,WAAW,EACxB,YAAY,EAAE,YAAY,EAC1B,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,cAAc,EAAE,cAAc,EAC9B,OAAO,EAAE,OAAO,EAChB,GAAG,EAAE,GAAG,IACJ,SAAS,cAEZ,QAAQ,IACM,CAClB,CAAC;AACJ,CAAC,CAAC;AAzCW,QAAA,eAAe,mBAyC1B","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 type React from 'react';\n\nimport { type PolymorphicCommonProps } from '../_common/types';\nimport { IconButtonBase, type IconButtonBaseProps } from '../icon-button-base';\n\ntype CleanIconButtonButtonProps = Omit<\n IconButtonBaseProps,\n 'iconButtonVariant' | 'isFloating'\n>;\n\nexport const CleanIconButton = <T extends React.ElementType = 'button'>({\n children,\n as,\n isLoading = false,\n isDisabled = false,\n size = 'medium',\n // Does not have a default value to avoid setting aria-pressed to true if not explicitly set\n isActive,\n variant = 'neutral',\n description,\n descriptionKdbProps,\n tooltipProps,\n className,\n style,\n htmlAttributes,\n onClick,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, CleanIconButtonButtonProps>) => {\n return (\n <IconButtonBase\n as={as}\n iconButtonVariant=\"clean\"\n isDisabled={isDisabled}\n size={size}\n isLoading={isLoading}\n isActive={isActive}\n variant={variant}\n descriptionKdbProps={descriptionKdbProps}\n description={description}\n tooltipProps={tooltipProps}\n className={className}\n style={style}\n htmlAttributes={htmlAttributes}\n onClick={onClick}\n ref={ref}\n {...restProps}\n >\n {children}\n </IconButtonBase>\n );\n};\n"]}
1
+ {"version":3,"file":"CleanIconButton.js","sourceRoot":"","sources":["../../../src/clean-icon-button/CleanIconButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;AAuBA,0DAA+E;AAOxE,MAAM,eAAe,GAAG,CAAyC,EAkBhB,EAAE,EAAE;QAlBY,EACtE,QAAQ,EACR,EAAE,EACF,SAAS,GAAG,KAAK,EACjB,UAAU,GAAG,KAAK,EAClB,IAAI,GAAG,QAAQ;IACf,4FAA4F;IAC5F,QAAQ,EACR,OAAO,GAAG,SAAS,EACnB,WAAW,EACX,mBAAmB,EACnB,YAAY,EACZ,SAAS,EACT,KAAK,EACL,cAAc,EACd,OAAO,EACP,GAAG,OAEmD,EADnD,SAAS,cAjB0D,4LAkBvE,CADa;IAEZ,OAAO,CACL,uBAAC,iCAAc,kBACb,EAAE,EAAE,EAAE,EACN,iBAAiB,EAAC,OAAO,EACzB,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,EAChB,mBAAmB,EAAE,mBAAmB,EACxC,WAAW,EAAE,WAAW,EACxB,YAAY,EAAE,YAAY,EAC1B,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,cAAc,EAAE,cAAc,EAC9B,OAAO,EAAE,OAAO,EAChB,GAAG,EAAE,GAAG,IACJ,SAAS,cAEZ,QAAQ,IACM,CAClB,CAAC;AACJ,CAAC,CAAC;AAzCW,QAAA,eAAe,mBAyC1B","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 type React from 'react';\n\nimport { type PolymorphicCommonProps } from '../_common/types';\nimport { IconButtonBase, type IconButtonBaseProps } from '../icon-button-base';\n\ntype CleanIconButtonButtonProps = Omit<\n IconButtonBaseProps,\n 'iconButtonVariant' | 'isFloating'\n>;\n\nexport const CleanIconButton = <T extends React.ElementType = 'button'>({\n children,\n as,\n isLoading = false,\n isDisabled = false,\n size = 'medium',\n // Does not have a default value to avoid setting aria-pressed to true if not explicitly set\n isActive,\n variant = 'neutral',\n description,\n descriptionKbdProps,\n tooltipProps,\n className,\n style,\n htmlAttributes,\n onClick,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, CleanIconButtonButtonProps>) => {\n return (\n <IconButtonBase\n as={as}\n iconButtonVariant=\"clean\"\n isDisabled={isDisabled}\n size={size}\n isLoading={isLoading}\n isActive={isActive}\n variant={variant}\n descriptionKbdProps={descriptionKbdProps}\n description={description}\n tooltipProps={tooltipProps}\n className={className}\n style={style}\n htmlAttributes={htmlAttributes}\n onClick={onClick}\n ref={ref}\n {...restProps}\n >\n {children}\n </IconButtonBase>\n );\n};\n"]}
@@ -25,7 +25,7 @@ require("@neo4j-ndl/base/lib/neo4j-ds-styles.css");
25
25
  const react_1 = require("@neo4j-ndl/react");
26
26
  const icons_1 = require("@neo4j-ndl/react/icons");
27
27
  const Component = () => {
28
- return ((0, jsx_runtime_1.jsx)("div", { className: "n-flex n-flex-col n-gap-token-16", children: (0, jsx_runtime_1.jsx)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: (0, jsx_runtime_1.jsx)(react_1.CleanIconButton, { description: "Search", descriptionKdbProps: { keys: ['B'], modifierKeys: ['meta'] }, variant: "neutral", children: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}) }) }) }));
28
+ return ((0, jsx_runtime_1.jsx)("div", { className: "n-flex n-flex-col n-gap-token-16", children: (0, jsx_runtime_1.jsx)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: (0, jsx_runtime_1.jsx)(react_1.CleanIconButton, { description: "Search", descriptionKbdProps: { keys: ['B'], modifierKeys: ['meta'] }, variant: "neutral", children: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}) }) }) }));
29
29
  };
30
30
  exports.default = Component;
31
31
  //# sourceMappingURL=clean-icon-button-keyboard-display.story.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"clean-icon-button-keyboard-display.story.js","sourceRoot":"","sources":["../../../../src/clean-icon-button/stories/clean-icon-button-keyboard-display.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAmD;AACnD,kDAAoE;AAEpE,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,gCAAK,SAAS,EAAC,kCAAkC,YAC/C,gCAAK,SAAS,EAAC,iDAAiD,YAC9D,uBAAC,uBAAe,IACd,WAAW,EAAC,QAAQ,EACpB,mBAAmB,EAAE,EAAE,IAAI,EAAE,CAAC,GAAG,CAAC,EAAE,YAAY,EAAE,CAAC,MAAM,CAAC,EAAE,EAC5D,OAAO,EAAC,SAAS,YAEjB,uBAAC,kCAA0B,KAAG,GACd,GACd,GACF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { CleanIconButton } from '@neo4j-ndl/react';\nimport { MagnifyingGlassIconOutline } from '@neo4j-ndl/react/icons';\n\nconst Component = () => {\n return (\n <div className=\"n-flex n-flex-col n-gap-token-16\">\n <div className=\"n-flex n-flex-row n-gap-token-16 n-items-center\">\n <CleanIconButton\n description=\"Search\"\n descriptionKdbProps={{ keys: ['B'], modifierKeys: ['meta'] }}\n variant=\"neutral\"\n >\n <MagnifyingGlassIconOutline />\n </CleanIconButton>\n </div>\n </div>\n );\n};\n\nexport default Component;\n"]}
1
+ {"version":3,"file":"clean-icon-button-keyboard-display.story.js","sourceRoot":"","sources":["../../../../src/clean-icon-button/stories/clean-icon-button-keyboard-display.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAmD;AACnD,kDAAoE;AAEpE,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,gCAAK,SAAS,EAAC,kCAAkC,YAC/C,gCAAK,SAAS,EAAC,iDAAiD,YAC9D,uBAAC,uBAAe,IACd,WAAW,EAAC,QAAQ,EACpB,mBAAmB,EAAE,EAAE,IAAI,EAAE,CAAC,GAAG,CAAC,EAAE,YAAY,EAAE,CAAC,MAAM,CAAC,EAAE,EAC5D,OAAO,EAAC,SAAS,YAEjB,uBAAC,kCAA0B,KAAG,GACd,GACd,GACF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { CleanIconButton } from '@neo4j-ndl/react';\nimport { MagnifyingGlassIconOutline } from '@neo4j-ndl/react/icons';\n\nconst Component = () => {\n return (\n <div className=\"n-flex n-flex-col n-gap-token-16\">\n <div className=\"n-flex n-flex-row n-gap-token-16 n-items-center\">\n <CleanIconButton\n description=\"Search\"\n descriptionKbdProps={{ keys: ['B'], modifierKeys: ['meta'] }}\n variant=\"neutral\"\n >\n <MagnifyingGlassIconOutline />\n </CleanIconButton>\n </div>\n </div>\n );\n};\n\nexport default Component;\n"]}
@@ -45,7 +45,7 @@ const kbd_1 = require("../kbd");
45
45
  const outlined_button_1 = require("../outlined-button");
46
46
  const tooltip_1 = require("../tooltip");
47
47
  const ConfirmationButton = (_a) => {
48
- var { descriptionKdbProps, description, actionFeedbackText, icon, children, onClick, htmlAttributes, tooltipProps, type = 'clean-icon-button' } = _a, restProps = __rest(_a, ["descriptionKdbProps", "description", "actionFeedbackText", "icon", "children", "onClick", "htmlAttributes", "tooltipProps", "type"]);
48
+ var { descriptionKbdProps, description, actionFeedbackText, icon, children, onClick, htmlAttributes, tooltipProps, type = 'clean-icon-button' } = _a, restProps = __rest(_a, ["descriptionKbdProps", "description", "actionFeedbackText", "icon", "children", "onClick", "htmlAttributes", "tooltipProps", "type"]);
49
49
  const [timeoutId, setTimeoutId] = react_1.default.useState(null);
50
50
  const [isOpen, setIsOpen] = react_1.default.useState(false);
51
51
  const handleClick = () => {
@@ -66,7 +66,7 @@ const ConfirmationButton = (_a) => {
66
66
  const content = timeoutId === null ? description : actionFeedbackText;
67
67
  /* Controlling the tip to make it disappear in a timely manner*/
68
68
  if (type === 'clean-icon-button') {
69
- return ((0, jsx_runtime_1.jsx)(clean_icon_button_1.CleanIconButton, Object.assign({}, restProps.cleanIconButtonProps, { description: content, descriptionKdbProps: descriptionKdbProps, tooltipProps: {
69
+ return ((0, jsx_runtime_1.jsx)(clean_icon_button_1.CleanIconButton, Object.assign({}, restProps.cleanIconButtonProps, { description: content, descriptionKbdProps: descriptionKbdProps, tooltipProps: {
70
70
  root: Object.assign(Object.assign({}, tooltipProps), { isOpen: isOpen || timeoutId !== null }),
71
71
  trigger: {
72
72
  htmlAttributes: {
@@ -122,10 +122,10 @@ const ConfirmationButton = (_a) => {
122
122
  onClick(event);
123
123
  }
124
124
  handleClick();
125
- }, leadingVisual: icon, className: restProps.className, htmlAttributes: htmlAttributes, children: children })) }), (0, jsx_runtime_1.jsxs)(tooltip_1.Tooltip.Content, { children: [content, descriptionKdbProps && (0, jsx_runtime_1.jsx)(kbd_1.Kbd, Object.assign({}, descriptionKdbProps))] })] })));
125
+ }, leadingVisual: icon, className: restProps.className, htmlAttributes: htmlAttributes, children: children })) }), (0, jsx_runtime_1.jsxs)(tooltip_1.Tooltip.Content, { children: [content, descriptionKbdProps && (0, jsx_runtime_1.jsx)(kbd_1.Kbd, Object.assign({}, descriptionKbdProps))] })] })));
126
126
  }
127
127
  };
128
- const ClipboardButton = ({ textToCopy, descriptionKdbProps, isDisabled, size, tooltipProps, htmlAttributes, type, }) => {
128
+ const ClipboardButton = ({ textToCopy, descriptionKbdProps, isDisabled, size, tooltipProps, htmlAttributes, type, }) => {
129
129
  const [, copyFunction] = (0, hooks_1.useCopyToClipboard)();
130
130
  const isOutlinedButton = type === 'outlined-button';
131
131
  const isIconButton = type === 'icon-button';
@@ -154,7 +154,7 @@ const ClipboardButton = ({ textToCopy, descriptionKdbProps, isDisabled, size, to
154
154
  },
155
155
  type: 'clean-icon-button',
156
156
  };
157
- return ((0, jsx_runtime_1.jsx)(ConfirmationButton, Object.assign({ onClick: () => copyFunction(textToCopy), description: "Copy to clipboard", actionFeedbackText: "Copied", descriptionKdbProps: descriptionKdbProps }, props, { tooltipProps: tooltipProps, className: "n-gap-token-8", icon: (0, jsx_runtime_1.jsx)(icons_1.Square2StackIconOutline, { className: "ndl-icon-svg" }), htmlAttributes: Object.assign({ 'aria-live': 'polite' }, htmlAttributes), children: type === 'outlined-button' && 'Copy' })));
157
+ return ((0, jsx_runtime_1.jsx)(ConfirmationButton, Object.assign({ onClick: () => copyFunction(textToCopy), description: "Copy to clipboard", actionFeedbackText: "Copied", descriptionKbdProps: descriptionKbdProps }, props, { tooltipProps: tooltipProps, className: "n-gap-token-8", icon: (0, jsx_runtime_1.jsx)(icons_1.Square2StackIconOutline, { className: "ndl-icon-svg" }), htmlAttributes: Object.assign({ 'aria-live': 'polite' }, htmlAttributes), children: type === 'outlined-button' && 'Copy' })));
158
158
  };
159
159
  exports.ClipboardButton = ClipboardButton;
160
160
  //# sourceMappingURL=ClipboardButton.js.map
@@ -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 descriptionKdbProps?: 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 descriptionKdbProps,\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 descriptionKdbProps={descriptionKdbProps}\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 {descriptionKdbProps && <Kbd {...descriptionKdbProps} />}\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 descriptionKdbProps?: 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 descriptionKdbProps,\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 descriptionKdbProps={descriptionKdbProps}\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';\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"]}
@@ -38,8 +38,8 @@ const icon_button_base_1 = require("../icon-button-base");
38
38
  const IconButton = (_a) => {
39
39
  var { children, as, isLoading = false, isDisabled = false, size = 'medium', isFloating = false,
40
40
  // Does not have a default value to avoid setting aria-pressed to true if not explicitly set
41
- isActive, variant = 'neutral', description, descriptionKdbProps, tooltipProps, className, style, htmlAttributes, onClick, ref } = _a, restProps = __rest(_a, ["children", "as", "isLoading", "isDisabled", "size", "isFloating", "isActive", "variant", "description", "descriptionKdbProps", "tooltipProps", "className", "style", "htmlAttributes", "onClick", "ref"]);
42
- return ((0, jsx_runtime_1.jsx)(icon_button_base_1.IconButtonBase, Object.assign({ as: as, iconButtonVariant: "default", isDisabled: isDisabled, size: size, isLoading: isLoading, isActive: isActive, isFloating: isFloating, descriptionKdbProps: descriptionKdbProps, description: description, tooltipProps: tooltipProps, className: className, style: style, variant: variant, htmlAttributes: htmlAttributes, onClick: onClick, ref: ref }, restProps, { children: children })));
41
+ isActive, variant = 'neutral', description, descriptionKbdProps, tooltipProps, className, style, htmlAttributes, onClick, ref } = _a, restProps = __rest(_a, ["children", "as", "isLoading", "isDisabled", "size", "isFloating", "isActive", "variant", "description", "descriptionKbdProps", "tooltipProps", "className", "style", "htmlAttributes", "onClick", "ref"]);
42
+ return ((0, jsx_runtime_1.jsx)(icon_button_base_1.IconButtonBase, Object.assign({ as: as, iconButtonVariant: "default", isDisabled: isDisabled, size: size, isLoading: isLoading, isActive: isActive, isFloating: isFloating, descriptionKbdProps: descriptionKbdProps, description: description, tooltipProps: tooltipProps, className: className, style: style, variant: variant, htmlAttributes: htmlAttributes, onClick: onClick, ref: ref }, restProps, { children: children })));
43
43
  };
44
44
  exports.IconButton = IconButton;
45
45
  //# sourceMappingURL=IconButton.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"IconButton.js","sourceRoot":"","sources":["../../../src/icon-button/IconButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;AAuBA,0DAA+E;AAIxE,MAAM,UAAU,GAAG,CAAyC,EAmBhB,EAAE,EAAE;QAnBY,EACjE,QAAQ,EACR,EAAE,EACF,SAAS,GAAG,KAAK,EACjB,UAAU,GAAG,KAAK,EAClB,IAAI,GAAG,QAAQ,EACf,UAAU,GAAG,KAAK;IAClB,4FAA4F;IAC5F,QAAQ,EACR,OAAO,GAAG,SAAS,EACnB,WAAW,EACX,mBAAmB,EACnB,YAAY,EACZ,SAAS,EACT,KAAK,EACL,cAAc,EACd,OAAO,EACP,GAAG,OAE8C,EAD9C,SAAS,cAlBqD,0MAmBlE,CADa;IAEZ,OAAO,CACL,uBAAC,iCAAc,kBACb,EAAE,EAAE,EAAE,EACN,iBAAiB,EAAC,SAAS,EAC3B,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,QAAQ,EAClB,UAAU,EAAE,UAAU,EACtB,mBAAmB,EAAE,mBAAmB,EACxC,WAAW,EAAE,WAAW,EACxB,YAAY,EAAE,YAAY,EAC1B,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,EAChB,cAAc,EAAE,cAAc,EAC9B,OAAO,EAAE,OAAO,EAChB,GAAG,EAAE,GAAG,IACJ,SAAS,cAEZ,QAAQ,IACM,CAClB,CAAC;AACJ,CAAC,CAAC;AA3CW,QAAA,UAAU,cA2CrB","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 type React from 'react';\n\nimport { type PolymorphicCommonProps } from '../_common/types';\nimport { IconButtonBase, type IconButtonBaseProps } from '../icon-button-base';\n\ntype IconButtonButtonProps = Omit<IconButtonBaseProps, 'iconButtonVariant'>;\n\nexport const IconButton = <T extends React.ElementType = 'button'>({\n children,\n as,\n isLoading = false,\n isDisabled = false,\n size = 'medium',\n isFloating = false,\n // Does not have a default value to avoid setting aria-pressed to true if not explicitly set\n isActive,\n variant = 'neutral',\n description,\n descriptionKdbProps,\n tooltipProps,\n className,\n style,\n htmlAttributes,\n onClick,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, IconButtonButtonProps>) => {\n return (\n <IconButtonBase\n as={as}\n iconButtonVariant=\"default\"\n isDisabled={isDisabled}\n size={size}\n isLoading={isLoading}\n isActive={isActive}\n isFloating={isFloating}\n descriptionKdbProps={descriptionKdbProps}\n description={description}\n tooltipProps={tooltipProps}\n className={className}\n style={style}\n variant={variant}\n htmlAttributes={htmlAttributes}\n onClick={onClick}\n ref={ref}\n {...restProps}\n >\n {children}\n </IconButtonBase>\n );\n};\n"]}
1
+ {"version":3,"file":"IconButton.js","sourceRoot":"","sources":["../../../src/icon-button/IconButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;AAuBA,0DAA+E;AAIxE,MAAM,UAAU,GAAG,CAAyC,EAmBhB,EAAE,EAAE;QAnBY,EACjE,QAAQ,EACR,EAAE,EACF,SAAS,GAAG,KAAK,EACjB,UAAU,GAAG,KAAK,EAClB,IAAI,GAAG,QAAQ,EACf,UAAU,GAAG,KAAK;IAClB,4FAA4F;IAC5F,QAAQ,EACR,OAAO,GAAG,SAAS,EACnB,WAAW,EACX,mBAAmB,EACnB,YAAY,EACZ,SAAS,EACT,KAAK,EACL,cAAc,EACd,OAAO,EACP,GAAG,OAE8C,EAD9C,SAAS,cAlBqD,0MAmBlE,CADa;IAEZ,OAAO,CACL,uBAAC,iCAAc,kBACb,EAAE,EAAE,EAAE,EACN,iBAAiB,EAAC,SAAS,EAC3B,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,QAAQ,EAClB,UAAU,EAAE,UAAU,EACtB,mBAAmB,EAAE,mBAAmB,EACxC,WAAW,EAAE,WAAW,EACxB,YAAY,EAAE,YAAY,EAC1B,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,EAChB,cAAc,EAAE,cAAc,EAC9B,OAAO,EAAE,OAAO,EAChB,GAAG,EAAE,GAAG,IACJ,SAAS,cAEZ,QAAQ,IACM,CAClB,CAAC;AACJ,CAAC,CAAC;AA3CW,QAAA,UAAU,cA2CrB","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 type React from 'react';\n\nimport { type PolymorphicCommonProps } from '../_common/types';\nimport { IconButtonBase, type IconButtonBaseProps } from '../icon-button-base';\n\ntype IconButtonButtonProps = Omit<IconButtonBaseProps, 'iconButtonVariant'>;\n\nexport const IconButton = <T extends React.ElementType = 'button'>({\n children,\n as,\n isLoading = false,\n isDisabled = false,\n size = 'medium',\n isFloating = false,\n // Does not have a default value to avoid setting aria-pressed to true if not explicitly set\n isActive,\n variant = 'neutral',\n description,\n descriptionKbdProps,\n tooltipProps,\n className,\n style,\n htmlAttributes,\n onClick,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, IconButtonButtonProps>) => {\n return (\n <IconButtonBase\n as={as}\n iconButtonVariant=\"default\"\n isDisabled={isDisabled}\n size={size}\n isLoading={isLoading}\n isActive={isActive}\n isFloating={isFloating}\n descriptionKbdProps={descriptionKbdProps}\n description={description}\n tooltipProps={tooltipProps}\n className={className}\n style={style}\n variant={variant}\n htmlAttributes={htmlAttributes}\n onClick={onClick}\n ref={ref}\n {...restProps}\n >\n {children}\n </IconButtonBase>\n );\n};\n"]}
@@ -79,9 +79,9 @@ const IconButtonBase = (_a) => {
79
79
  var _b;
80
80
  var { children, as, iconButtonVariant = 'default', isLoading = false, isDisabled = false, size = 'medium', isFloating = false,
81
81
  // Does not have a default value to avoid setting aria-pressed to true if not explicitly set
82
- isActive = undefined, description, descriptionKdbProps, tooltipProps, className, style, variant = 'neutral', htmlAttributes, onClick, ref,
82
+ isActive = undefined, description, descriptionKbdProps, tooltipProps, className, style, variant = 'neutral', htmlAttributes, onClick, ref,
83
83
  // TODO v5: maybe update default message to 'Loading'. This value is for backward compatibility with loading spinners old aria-label
84
- loadingMessage = 'Loading content' } = _a, restProps = __rest(_a, ["children", "as", "iconButtonVariant", "isLoading", "isDisabled", "size", "isFloating", "isActive", "description", "descriptionKdbProps", "tooltipProps", "className", "style", "variant", "htmlAttributes", "onClick", "ref", "loadingMessage"]);
84
+ loadingMessage = 'Loading content' } = _a, restProps = __rest(_a, ["children", "as", "iconButtonVariant", "isLoading", "isDisabled", "size", "isFloating", "isActive", "description", "descriptionKbdProps", "tooltipProps", "className", "style", "variant", "htmlAttributes", "onClick", "ref", "loadingMessage"]);
85
85
  const Component = as !== null && as !== void 0 ? as : 'button';
86
86
  const loadingId = (0, react_1.useId)();
87
87
  const isInteractable = !isDisabled && !isLoading;
@@ -121,8 +121,8 @@ const IconButtonBase = (_a) => {
121
121
  const tooltipContent = react_1.default.useMemo(() => {
122
122
  var _a;
123
123
  const descriptionContent = description !== null && description !== void 0 ? description : (_a = tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.content) === null || _a === void 0 ? void 0 : _a.children;
124
- return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [descriptionContent, descriptionKdbProps && (0, jsx_runtime_1.jsx)(kbd_1.Kbd, Object.assign({}, descriptionKdbProps))] }));
125
- }, [description, descriptionKdbProps, (_b = tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.content) === null || _b === void 0 ? void 0 : _b.children]);
124
+ return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [descriptionContent, descriptionKbdProps && (0, jsx_runtime_1.jsx)(kbd_1.Kbd, Object.assign({}, descriptionKbdProps))] }));
125
+ }, [description, descriptionKbdProps, (_b = tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.content) === null || _b === void 0 ? void 0 : _b.children]);
126
126
  return ((0, jsx_runtime_1.jsxs)(tooltip_1.Tooltip, Object.assign({ hoverDelay: {
127
127
  close: 0,
128
128
  open: 500,
@@ -1 +1 @@
1
- {"version":3,"file":"IconButtonBase.js","sourceRoot":"","sources":["../../../src/icon-button-base/IconButtonBase.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 React, { useId } from 'react';\n\nimport { ButtonSpinner } from '../_common/ButtonSpinner';\nimport {\n type PolymorphicCommonProps,\n type TooltipObjectProps,\n} from '../_common/types';\nimport { needleWarningMessage } from '../_common/utils';\nimport { type ButtonSizes } from '../button';\nimport { Kbd } from '../kbd';\nimport { Tooltip } from '../tooltip';\n\n/**\n *\n *\n * Types\n *\n *\n */\n\nexport type IconButtonBaseProps = {\n children?: React.ReactNode;\n\n /** If the icon button is in disabled state */\n isDisabled?: boolean;\n\n /** If the button is doing something Async, it will display a loading spinner */\n isLoading?: boolean;\n\n /** Size of button */\n size?: ButtonSizes;\n\n /** If the button is in floating state */\n isFloating?: boolean;\n\n /** Active - used for open context menus for example */\n isActive?: boolean;\n\n /** A string that will be shown as a tooltip when hovering over the button it also acts as an aria-label- {@link https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label} */\n description: React.ReactNode;\n\n /** The Kbd components that will be displayed in the tooltip after the description text, this does not include the keyboard shortcut functionality this only displays the Kbd components. */\n descriptionKdbProps?: React.ComponentProps<typeof Kbd>;\n\n /** Variant of the button */\n variant?: 'neutral' | 'danger';\n\n /** Variant of the button */\n iconButtonVariant?: 'default' | 'clean';\n\n /**\n * Props for the tooltip component.\n */\n tooltipProps?: TooltipObjectProps;\n\n /** Click handler */\n onClick?: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;\n\n /** Accessible message for screen readers when the button is in a loading state */\n loadingMessage?: string;\n};\n\nexport const IconButtonBase = <T extends React.ElementType = 'button'>({\n children,\n as,\n iconButtonVariant = 'default',\n isLoading = false,\n isDisabled = false,\n size = 'medium',\n isFloating = false,\n // Does not have a default value to avoid setting aria-pressed to true if not explicitly set\n isActive = undefined,\n description,\n descriptionKdbProps,\n tooltipProps,\n className,\n style,\n variant = 'neutral',\n htmlAttributes,\n onClick,\n ref,\n // TODO v5: maybe update default message to 'Loading'. This value is for backward compatibility with loading spinners old aria-label\n loadingMessage = 'Loading content',\n ...restProps\n}: PolymorphicCommonProps<T, IconButtonBaseProps>) => {\n const Component: React.ElementType = as ?? 'button';\n const loadingId = useId();\n\n const isInteractable = !isDisabled && !isLoading;\n\n const isClean = iconButtonVariant === 'clean';\n const isDanger = variant === 'danger';\n\n const classes = classNames('ndl-icon-btn', className, {\n 'ndl-active': Boolean(isActive),\n 'ndl-clean': isClean,\n 'ndl-danger': isDanger,\n 'ndl-disabled': isDisabled,\n 'ndl-floating': isFloating,\n 'ndl-large': size === 'large',\n 'ndl-loading': isLoading,\n 'ndl-medium': size === 'medium',\n 'ndl-small': size === 'small',\n });\n\n if (isClean && isFloating) {\n throw new Error(\n 'BaseIconButton: Cannot use isFloating and iconButtonVariant=\"clean\" at the same time.',\n );\n }\n\n if (!description && !htmlAttributes?.['aria-label']) {\n needleWarningMessage(\n 'Icon buttons do not have text, be sure to include a description or an aria-label for screen readers link: https://dequeuniversity.com/rules/axe/4.4/button-name?application=axeAPI',\n );\n }\n\n const handleClick = (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n if (!isInteractable) {\n // By default, a <button /> element with disabled set to true will not get its\n // on click handler called. To support the same behavior on <a /> tags we\n // swallow the event here when disabled, since the <a /> tag with disabled set to\n // true will have its onClick handler called\n e.preventDefault();\n e.stopPropagation();\n return;\n }\n\n if (onClick) {\n onClick(e);\n }\n };\n\n const tooltipContent = React.useMemo(() => {\n const descriptionContent = description ?? tooltipProps?.content?.children;\n return (\n <>\n {descriptionContent}\n {descriptionKdbProps && <Kbd {...descriptionKdbProps} />}\n </>\n );\n }, [description, descriptionKdbProps, tooltipProps?.content?.children]);\n\n return (\n <Tooltip\n hoverDelay={{\n close: 0,\n open: 500,\n }}\n isDisabled={description === null || isDisabled}\n type=\"simple\"\n {...tooltipProps?.root}\n >\n <Tooltip.Trigger {...tooltipProps?.trigger} hasButtonWrapper>\n <Component\n type=\"button\"\n onClick={handleClick}\n disabled={isDisabled}\n aria-disabled={!isInteractable}\n aria-label={description}\n aria-pressed={isActive}\n className={classes}\n style={style}\n ref={ref}\n aria-describedby={isLoading ? loadingId : undefined}\n {...restProps}\n {...htmlAttributes}\n >\n <div className=\"ndl-icon-btn-inner\">\n {isLoading ? (\n <ButtonSpinner\n loadingMessage={loadingMessage}\n size=\"small\"\n htmlAttributes={{ id: loadingId }}\n />\n ) : (\n <div className=\"ndl-icon\">{children}</div>\n )}\n </div>\n </Component>\n </Tooltip.Trigger>\n <Tooltip.Content {...tooltipProps?.content}>\n {tooltipContent}\n </Tooltip.Content>\n </Tooltip>\n );\n};\n"]}
1
+ {"version":3,"file":"IconButtonBase.js","sourceRoot":"","sources":["../../../src/icon-button-base/IconButtonBase.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,4DAAoC;AACpC,+CAAqC;AAErC,4DAAyD;AAKzD,4CAAwD;AAExD,gCAA6B;AAC7B,wCAAqC;AAoD9B,MAAM,cAAc,GAAG,CAAyC,EAsBtB,EAAE,EAAE;;QAtBkB,EACrE,QAAQ,EACR,EAAE,EACF,iBAAiB,GAAG,SAAS,EAC7B,SAAS,GAAG,KAAK,EACjB,UAAU,GAAG,KAAK,EAClB,IAAI,GAAG,QAAQ,EACf,UAAU,GAAG,KAAK;IAClB,4FAA4F;IAC5F,QAAQ,GAAG,SAAS,EACpB,WAAW,EACX,mBAAmB,EACnB,YAAY,EACZ,SAAS,EACT,KAAK,EACL,OAAO,GAAG,SAAS,EACnB,cAAc,EACd,OAAO,EACP,GAAG;IACH,oIAAoI;IACpI,cAAc,GAAG,iBAAiB,OAEa,EAD5C,SAAS,cArByD,iPAsBtE,CADa;IAEZ,MAAM,SAAS,GAAsB,EAAE,aAAF,EAAE,cAAF,EAAE,GAAI,QAAQ,CAAC;IACpD,MAAM,SAAS,GAAG,IAAA,aAAK,GAAE,CAAC;IAE1B,MAAM,cAAc,GAAG,CAAC,UAAU,IAAI,CAAC,SAAS,CAAC;IAEjD,MAAM,OAAO,GAAG,iBAAiB,KAAK,OAAO,CAAC;IAC9C,MAAM,QAAQ,GAAG,OAAO,KAAK,QAAQ,CAAC;IAEtC,MAAM,OAAO,GAAG,IAAA,oBAAU,EAAC,cAAc,EAAE,SAAS,EAAE;QACpD,YAAY,EAAE,OAAO,CAAC,QAAQ,CAAC;QAC/B,WAAW,EAAE,OAAO;QACpB,YAAY,EAAE,QAAQ;QACtB,cAAc,EAAE,UAAU;QAC1B,cAAc,EAAE,UAAU;QAC1B,WAAW,EAAE,IAAI,KAAK,OAAO;QAC7B,aAAa,EAAE,SAAS;QACxB,YAAY,EAAE,IAAI,KAAK,QAAQ;QAC/B,WAAW,EAAE,IAAI,KAAK,OAAO;KAC9B,CAAC,CAAC;IAEH,IAAI,OAAO,IAAI,UAAU,EAAE,CAAC;QAC1B,MAAM,IAAI,KAAK,CACb,uFAAuF,CACxF,CAAC;IACJ,CAAC;IAED,IAAI,CAAC,WAAW,IAAI,CAAC,CAAA,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAG,YAAY,CAAC,CAAA,EAAE,CAAC;QACpD,IAAA,4BAAoB,EAClB,oLAAoL,CACrL,CAAC;IACJ,CAAC;IAED,MAAM,WAAW,GAAG,CAAC,CAAkD,EAAE,EAAE;QACzE,IAAI,CAAC,cAAc,EAAE,CAAC;YACpB,8EAA8E;YAC9E,yEAAyE;YACzE,iFAAiF;YACjF,4CAA4C;YAC5C,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,CAAC,CAAC,eAAe,EAAE,CAAC;YACpB,OAAO;QACT,CAAC;QAED,IAAI,OAAO,EAAE,CAAC;YACZ,OAAO,CAAC,CAAC,CAAC,CAAC;QACb,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,cAAc,GAAG,eAAK,CAAC,OAAO,CAAC,GAAG,EAAE;;QACxC,MAAM,kBAAkB,GAAG,WAAW,aAAX,WAAW,cAAX,WAAW,GAAI,MAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,OAAO,0CAAE,QAAQ,CAAC;QAC1E,OAAO,CACL,6DACG,kBAAkB,EAClB,mBAAmB,IAAI,uBAAC,SAAG,oBAAK,mBAAmB,EAAI,IACvD,CACJ,CAAC;IACJ,CAAC,EAAE,CAAC,WAAW,EAAE,mBAAmB,EAAE,MAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,OAAO,0CAAE,QAAQ,CAAC,CAAC,CAAC;IAExE,OAAO,CACL,wBAAC,iBAAO,kBACN,UAAU,EAAE;YACV,KAAK,EAAE,CAAC;YACR,IAAI,EAAE,GAAG;SACV,EACD,UAAU,EAAE,WAAW,KAAK,IAAI,IAAI,UAAU,EAC9C,IAAI,EAAC,QAAQ,IACT,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,IAAI,eAEtB,uBAAC,iBAAO,CAAC,OAAO,oBAAK,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,OAAO,IAAE,gBAAgB,kBAC1D,uBAAC,SAAS,kBACR,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,WAAW,EACpB,QAAQ,EAAE,UAAU,mBACL,CAAC,cAAc,gBAClB,WAAW,kBACT,QAAQ,EACtB,SAAS,EAAE,OAAO,EAClB,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,GAAG,sBACU,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,IAC/C,SAAS,EACT,cAAc,cAElB,gCAAK,SAAS,EAAC,oBAAoB,YAChC,SAAS,CAAC,CAAC,CAAC,CACX,uBAAC,6BAAa,IACZ,cAAc,EAAE,cAAc,EAC9B,IAAI,EAAC,OAAO,EACZ,cAAc,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,GACjC,CACH,CAAC,CAAC,CAAC,CACF,gCAAK,SAAS,EAAC,UAAU,YAAE,QAAQ,GAAO,CAC3C,GACG,IACI,IACI,EAClB,uBAAC,iBAAO,CAAC,OAAO,oBAAK,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,OAAO,cACvC,cAAc,IACC,KACV,CACX,CAAC;AACJ,CAAC,CAAC;AA5HW,QAAA,cAAc,kBA4HzB","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 React, { useId } from 'react';\n\nimport { ButtonSpinner } from '../_common/ButtonSpinner';\nimport {\n type PolymorphicCommonProps,\n type TooltipObjectProps,\n} from '../_common/types';\nimport { needleWarningMessage } from '../_common/utils';\nimport { type ButtonSizes } from '../button';\nimport { Kbd } from '../kbd';\nimport { Tooltip } from '../tooltip';\n\n/**\n *\n *\n * Types\n *\n *\n */\n\nexport type IconButtonBaseProps = {\n children?: React.ReactNode;\n\n /** If the icon button is in disabled state */\n isDisabled?: boolean;\n\n /** If the button is doing something Async, it will display a loading spinner */\n isLoading?: boolean;\n\n /** Size of button */\n size?: ButtonSizes;\n\n /** If the button is in floating state */\n isFloating?: boolean;\n\n /** Active - used for open context menus for example */\n isActive?: boolean;\n\n /** A string that will be shown as a tooltip when hovering over the button it also acts as an aria-label- {@link https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label} */\n description: React.ReactNode;\n\n /** The Kbd components that will be displayed in the tooltip after the description text, this does not include the keyboard shortcut functionality this only displays the Kbd components. */\n descriptionKbdProps?: React.ComponentProps<typeof Kbd>;\n\n /** Variant of the button */\n variant?: 'neutral' | 'danger';\n\n /** Variant of the button */\n iconButtonVariant?: 'default' | 'clean';\n\n /**\n * Props for the tooltip component.\n */\n tooltipProps?: TooltipObjectProps;\n\n /** Click handler */\n onClick?: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;\n\n /** Accessible message for screen readers when the button is in a loading state */\n loadingMessage?: string;\n};\n\nexport const IconButtonBase = <T extends React.ElementType = 'button'>({\n children,\n as,\n iconButtonVariant = 'default',\n isLoading = false,\n isDisabled = false,\n size = 'medium',\n isFloating = false,\n // Does not have a default value to avoid setting aria-pressed to true if not explicitly set\n isActive = undefined,\n description,\n descriptionKbdProps,\n tooltipProps,\n className,\n style,\n variant = 'neutral',\n htmlAttributes,\n onClick,\n ref,\n // TODO v5: maybe update default message to 'Loading'. This value is for backward compatibility with loading spinners old aria-label\n loadingMessage = 'Loading content',\n ...restProps\n}: PolymorphicCommonProps<T, IconButtonBaseProps>) => {\n const Component: React.ElementType = as ?? 'button';\n const loadingId = useId();\n\n const isInteractable = !isDisabled && !isLoading;\n\n const isClean = iconButtonVariant === 'clean';\n const isDanger = variant === 'danger';\n\n const classes = classNames('ndl-icon-btn', className, {\n 'ndl-active': Boolean(isActive),\n 'ndl-clean': isClean,\n 'ndl-danger': isDanger,\n 'ndl-disabled': isDisabled,\n 'ndl-floating': isFloating,\n 'ndl-large': size === 'large',\n 'ndl-loading': isLoading,\n 'ndl-medium': size === 'medium',\n 'ndl-small': size === 'small',\n });\n\n if (isClean && isFloating) {\n throw new Error(\n 'BaseIconButton: Cannot use isFloating and iconButtonVariant=\"clean\" at the same time.',\n );\n }\n\n if (!description && !htmlAttributes?.['aria-label']) {\n needleWarningMessage(\n 'Icon buttons do not have text, be sure to include a description or an aria-label for screen readers link: https://dequeuniversity.com/rules/axe/4.4/button-name?application=axeAPI',\n );\n }\n\n const handleClick = (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n if (!isInteractable) {\n // By default, a <button /> element with disabled set to true will not get its\n // on click handler called. To support the same behavior on <a /> tags we\n // swallow the event here when disabled, since the <a /> tag with disabled set to\n // true will have its onClick handler called\n e.preventDefault();\n e.stopPropagation();\n return;\n }\n\n if (onClick) {\n onClick(e);\n }\n };\n\n const tooltipContent = React.useMemo(() => {\n const descriptionContent = description ?? tooltipProps?.content?.children;\n return (\n <>\n {descriptionContent}\n {descriptionKbdProps && <Kbd {...descriptionKbdProps} />}\n </>\n );\n }, [description, descriptionKbdProps, tooltipProps?.content?.children]);\n\n return (\n <Tooltip\n hoverDelay={{\n close: 0,\n open: 500,\n }}\n isDisabled={description === null || isDisabled}\n type=\"simple\"\n {...tooltipProps?.root}\n >\n <Tooltip.Trigger {...tooltipProps?.trigger} hasButtonWrapper>\n <Component\n type=\"button\"\n onClick={handleClick}\n disabled={isDisabled}\n aria-disabled={!isInteractable}\n aria-label={description}\n aria-pressed={isActive}\n className={classes}\n style={style}\n ref={ref}\n aria-describedby={isLoading ? loadingId : undefined}\n {...restProps}\n {...htmlAttributes}\n >\n <div className=\"ndl-icon-btn-inner\">\n {isLoading ? (\n <ButtonSpinner\n loadingMessage={loadingMessage}\n size=\"small\"\n htmlAttributes={{ id: loadingId }}\n />\n ) : (\n <div className=\"ndl-icon\">{children}</div>\n )}\n </div>\n </Component>\n </Tooltip.Trigger>\n <Tooltip.Content {...tooltipProps?.content}>\n {tooltipContent}\n </Tooltip.Content>\n </Tooltip>\n );\n};\n"]}
@@ -26,11 +26,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
26
26
  exports.KbdSequenceSrc = exports.KbdDefaultSrc = exports.KbdSequence = exports.KbdDefault = void 0;
27
27
  var kbd_default_story_1 = require("./kbd-default.story");
28
28
  Object.defineProperty(exports, "KbdDefault", { enumerable: true, get: function () { return __importDefault(kbd_default_story_1).default; } });
29
- var kdb_sequence_story_1 = require("./kdb-sequence.story");
30
- Object.defineProperty(exports, "KbdSequence", { enumerable: true, get: function () { return __importDefault(kdb_sequence_story_1).default; } });
29
+ var kbd_sequence_story_1 = require("./kbd-sequence.story");
30
+ Object.defineProperty(exports, "KbdSequence", { enumerable: true, get: function () { return __importDefault(kbd_sequence_story_1).default; } });
31
31
  const export_stories_utils_1 = require("../../_common/export-stories-utils");
32
32
  const kbd_default_story_raw_1 = __importDefault(require("./kbd-default.story?raw"));
33
- const kdb_sequence_story_raw_1 = __importDefault(require("./kdb-sequence.story?raw"));
33
+ const kbd_sequence_story_raw_1 = __importDefault(require("./kbd-sequence.story?raw"));
34
34
  exports.KbdDefaultSrc = (0, export_stories_utils_1.removeLicenseHeader)(kbd_default_story_raw_1.default);
35
- exports.KbdSequenceSrc = (0, export_stories_utils_1.removeLicenseHeader)(kdb_sequence_story_raw_1.default);
35
+ exports.KbdSequenceSrc = (0, export_stories_utils_1.removeLicenseHeader)(kbd_sequence_story_raw_1.default);
36
36
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/kbd/stories/index.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;;;;AAEH,yDAA4D;AAAnD,gIAAA,OAAO,OAAc;AAC9B,2DAA8D;AAArD,kIAAA,OAAO,OAAe;AAE/B,6EAAyE;AACzE,oFAAuD;AACvD,sFAAyD;AAE5C,QAAA,aAAa,GAAG,IAAA,0CAAmB,EAAC,+BAAgB,CAAC,CAAC;AACtD,QAAA,cAAc,GAAG,IAAA,0CAAmB,EAAC,gCAAiB,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 */\n\nexport { default as KbdDefault } from './kbd-default.story';\nexport { default as KbdSequence } from './kdb-sequence.story';\n\nimport { removeLicenseHeader } from '../../_common/export-stories-utils';\nimport KbdDefaultSrcRaw from './kbd-default.story?raw';\nimport KbdSequenceSrcRaw from './kdb-sequence.story?raw';\n\nexport const KbdDefaultSrc = removeLicenseHeader(KbdDefaultSrcRaw);\nexport const KbdSequenceSrc = removeLicenseHeader(KbdSequenceSrcRaw);\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/kbd/stories/index.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;;;;AAEH,yDAA4D;AAAnD,gIAAA,OAAO,OAAc;AAC9B,2DAA8D;AAArD,kIAAA,OAAO,OAAe;AAE/B,6EAAyE;AACzE,oFAAuD;AACvD,sFAAyD;AAE5C,QAAA,aAAa,GAAG,IAAA,0CAAmB,EAAC,+BAAgB,CAAC,CAAC;AACtD,QAAA,cAAc,GAAG,IAAA,0CAAmB,EAAC,gCAAiB,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 */\n\nexport { default as KbdDefault } from './kbd-default.story';\nexport { default as KbdSequence } from './kbd-sequence.story';\n\nimport { removeLicenseHeader } from '../../_common/export-stories-utils';\nimport KbdDefaultSrcRaw from './kbd-default.story?raw';\nimport KbdSequenceSrcRaw from './kbd-sequence.story?raw';\n\nexport const KbdDefaultSrc = removeLicenseHeader(KbdDefaultSrcRaw);\nexport const KbdSequenceSrc = removeLicenseHeader(KbdSequenceSrcRaw);\n"]}
@@ -27,4 +27,4 @@ const Component = () => {
27
27
  return (0, jsx_runtime_1.jsx)(react_1.Kbd, { keys: ['P', '1'] });
28
28
  };
29
29
  exports.default = Component;
30
- //# sourceMappingURL=kdb-sequence.story.js.map
30
+ //# sourceMappingURL=kbd-sequence.story.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"kdb-sequence.story.js","sourceRoot":"","sources":["../../../../src/kbd/stories/kdb-sequence.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAuC;AAEvC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,uBAAC,WAAG,IAAC,IAAI,EAAE,CAAC,GAAG,EAAE,GAAG,CAAC,GAAI,CAAC;AACnC,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { Kbd } from '@neo4j-ndl/react';\n\nconst Component = () => {\n return <Kbd keys={['P', '1']} />;\n};\n\nexport default Component;\n"]}
1
+ {"version":3,"file":"kbd-sequence.story.js","sourceRoot":"","sources":["../../../../src/kbd/stories/kbd-sequence.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAuC;AAEvC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,uBAAC,WAAG,IAAC,IAAI,EAAE,CAAC,GAAG,EAAE,GAAG,CAAC,GAAI,CAAC;AACnC,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { Kbd } from '@neo4j-ndl/react';\n\nconst Component = () => {\n return <Kbd keys={['P', '1']} />;\n};\n\nexport default Component;\n"]}
@@ -54,6 +54,7 @@ const MenuContext = (0, react_2.createContext)({
54
54
  // oxlint-disable-next-line @typescript-eslint/no-empty-function
55
55
  setHasFocusInside: () => { },
56
56
  });
57
+ const MenuGroupContext = (0, react_2.createContext)(null);
57
58
  const MenuWrapper = (props) => {
58
59
  const parentId = (0, react_1.useFloatingParentNodeId)();
59
60
  if (parentId === null) {
@@ -108,6 +109,9 @@ const MenuComponent = ({ children, isOpen: controlledOpen, onClose, isRoot, anch
108
109
  ],
109
110
  nodeId,
110
111
  onOpenChange: (open, event) => {
112
+ if (isDisabled) {
113
+ return;
114
+ }
111
115
  if (controlledOpen === undefined) {
112
116
  setIsOpen(open);
113
117
  }
@@ -142,6 +146,8 @@ const MenuComponent = ({ children, isOpen: controlledOpen, onClose, isRoot, anch
142
146
  const dismiss = (0, react_1.useDismiss)(context, { bubbles: true });
143
147
  const listNavigation = (0, react_1.useListNavigation)(context, {
144
148
  activeIndex,
149
+ // Don't disable indices; that way disabled items are still focusable. See: https://www.w3.org/WAI/ARIA/apg/patterns/menubar/
150
+ disabledIndices: [],
145
151
  listRef: elementsRef,
146
152
  nested: isNested,
147
153
  onNavigate: setActiveIndex,
@@ -235,19 +241,24 @@ const MenuItemComponent = (_a) => {
235
241
  'ndl-disabled': isDisabled,
236
242
  });
237
243
  const Component = as !== null && as !== void 0 ? as : 'button';
238
- return ((0, jsx_runtime_1.jsx)(Component, Object.assign({ className: classes, ref: ref, type: "button", role: "menuitem", disabled: isDisabled, style: style }, restProps, htmlAttributes, { children: (0, jsx_runtime_1.jsxs)("div", { className: "ndl-menu-item-inner", children: [Boolean(preLeadingContent) && ((0, jsx_runtime_1.jsx)("div", { className: "ndl-menu-item-pre-leading-content", children: preLeadingContent })), Boolean(leadingContent) && ((0, jsx_runtime_1.jsx)("div", { className: "ndl-menu-item-leading-content", children: leadingContent })), (0, jsx_runtime_1.jsxs)("div", { className: "ndl-menu-item-title-wrapper", children: [(0, jsx_runtime_1.jsx)("div", { className: "ndl-menu-item-title", children: title }), Boolean(description) && ((0, jsx_runtime_1.jsx)("div", { className: "ndl-menu-item-description", children: description }))] }), Boolean(trailingContent) && ((0, jsx_runtime_1.jsx)("div", { className: "ndl-menu-item-trailing-content", children: trailingContent }))] }) })));
244
+ return ((0, jsx_runtime_1.jsx)(Component, Object.assign({ className: classes, ref: ref, type: "button", role: "menuitem", "aria-disabled": isDisabled, style: style }, restProps, htmlAttributes, { children: (0, jsx_runtime_1.jsxs)("div", { className: "ndl-menu-item-inner", children: [Boolean(preLeadingContent) && ((0, jsx_runtime_1.jsx)("div", { className: "ndl-menu-item-pre-leading-content", children: preLeadingContent })), Boolean(leadingContent) && ((0, jsx_runtime_1.jsx)("div", { className: "ndl-menu-item-leading-content", children: leadingContent })), (0, jsx_runtime_1.jsxs)("div", { className: "ndl-menu-item-title-wrapper", children: [(0, jsx_runtime_1.jsx)("div", { className: "ndl-menu-item-title", children: title }), Boolean(description) && ((0, jsx_runtime_1.jsx)("div", { className: "ndl-menu-item-description", children: description }))] }), Boolean(trailingContent) && ((0, jsx_runtime_1.jsx)("div", { className: "ndl-menu-item-trailing-content", children: trailingContent }))] }) })));
239
245
  };
240
246
  const MenuItem = (_a) => {
241
247
  var { title, className, style, leadingVisual, trailingContent, description, isDisabled, as, onClick, onFocus, htmlAttributes, id, ref } = _a, restProps = __rest(_a, ["title", "className", "style", "leadingVisual", "trailingContent", "description", "isDisabled", "as", "onClick", "onFocus", "htmlAttributes", "id", "ref"]);
242
248
  const menu = (0, react_2.useContext)(MenuContext);
243
249
  const itemLabel = typeof title === 'string' ? title : undefined;
244
- const item = (0, react_1.useListItem)({ label: isDisabled === true ? null : itemLabel });
250
+ const item = (0, react_1.useListItem)({ label: itemLabel });
245
251
  const tree = (0, react_1.useFloatingTree)();
246
252
  const isActive = item.index === menu.activeIndex;
247
253
  const mergedRefs = (0, react_1.useMergeRefs)([item.ref, ref]);
248
254
  return ((0, jsx_runtime_1.jsx)(MenuItemComponent, Object.assign({ as: as !== null && as !== void 0 ? as : 'button', style: style, className: className, ref: mergedRefs, title: title, description: description, leadingContent: leadingVisual, trailingContent: trailingContent, isDisabled: isDisabled, htmlAttributes: Object.assign(Object.assign(Object.assign({}, htmlAttributes), { tabIndex: isActive ? 0 : -1 }), menu.getItemProps({
249
255
  id: id,
250
256
  onClick(event) {
257
+ if (isDisabled) {
258
+ event.preventDefault();
259
+ event.stopPropagation();
260
+ return;
261
+ }
251
262
  onClick === null || onClick === void 0 ? void 0 : onClick(event);
252
263
  tree === null || tree === void 0 ? void 0 : tree.events.emit('click', { id });
253
264
  },
@@ -260,11 +271,16 @@ const MenuItem = (_a) => {
260
271
  const NestedMenuItem = ({ title, isDisabled, description, leadingVisual, as, onFocus, onClick, className, style, htmlAttributes, id, ref, }) => {
261
272
  const menu = (0, react_2.useContext)(MenuContext);
262
273
  const itemLabel = typeof title === 'string' ? title : undefined;
263
- const item = (0, react_1.useListItem)({ label: isDisabled === true ? null : itemLabel });
274
+ const item = (0, react_1.useListItem)({ label: itemLabel });
264
275
  const isActive = item.index === menu.activeIndex;
265
276
  const mergedRefs = (0, react_1.useMergeRefs)([item.ref, ref]);
266
277
  return ((0, jsx_runtime_1.jsx)(MenuItemComponent, { as: as !== null && as !== void 0 ? as : 'button', style: style, className: className, ref: mergedRefs, title: title, description: description, leadingContent: leadingVisual, trailingContent: (0, jsx_runtime_1.jsx)(icons_1.ChevronRightIconOutline, { className: "ndl-menu-item-chevron" }), isDisabled: isDisabled, htmlAttributes: Object.assign(Object.assign(Object.assign(Object.assign({}, htmlAttributes), { tabIndex: isActive ? 0 : -1 }), menu.getItemProps({
267
278
  onClick(event) {
279
+ if (isDisabled) {
280
+ event.preventDefault();
281
+ event.stopPropagation();
282
+ return;
283
+ }
268
284
  onClick === null || onClick === void 0 ? void 0 : onClick(event);
269
285
  },
270
286
  onFocus(event) {
@@ -280,13 +296,22 @@ const CategoryItem = (_a) => {
280
296
  var { children, className, style, as, htmlAttributes, ref } = _a, restProps = __rest(_a, ["children", "className", "style", "as", "htmlAttributes", "ref"]);
281
297
  const classes = (0, classnames_1.default)('ndl-menu-category-item', className);
282
298
  const Component = as !== null && as !== void 0 ? as : 'div';
283
- return ((0, jsx_runtime_1.jsx)(Component, Object.assign({ className: classes, style: style, ref: ref }, restProps, htmlAttributes, { children: children })));
299
+ const groupContext = (0, react_2.useContext)(MenuGroupContext);
300
+ (0, react_2.useEffect)(() => {
301
+ if (groupContext) {
302
+ groupContext.setHasLabel(true);
303
+ return () => groupContext.setHasLabel(false);
304
+ }
305
+ }, [groupContext]);
306
+ return ((0, jsx_runtime_1.jsx)(Component, Object.assign({ className: classes, style: style, ref: ref }, (groupContext
307
+ ? { id: groupContext.labelId, role: 'presentation' }
308
+ : { role: 'separator' }), restProps, htmlAttributes, { children: children })));
284
309
  };
285
310
  const RadioItem = (_a) => {
286
311
  var { title, leadingVisual, trailingContent, description, isDisabled, isChecked = false, onClick, onFocus, className, style, as, id, htmlAttributes, ref } = _a, restProps = __rest(_a, ["title", "leadingVisual", "trailingContent", "description", "isDisabled", "isChecked", "onClick", "onFocus", "className", "style", "as", "id", "htmlAttributes", "ref"]);
287
312
  const menu = (0, react_2.useContext)(MenuContext);
288
313
  const itemLabel = typeof title === 'string' ? title : undefined;
289
- const item = (0, react_1.useListItem)({ label: isDisabled === true ? null : itemLabel });
314
+ const item = (0, react_1.useListItem)({ label: itemLabel });
290
315
  const tree = (0, react_1.useFloatingTree)();
291
316
  const isActive = item.index === menu.activeIndex;
292
317
  const mergedRefs = (0, react_1.useMergeRefs)([item.ref, ref]);
@@ -296,6 +321,11 @@ const RadioItem = (_a) => {
296
321
  return ((0, jsx_runtime_1.jsx)(MenuItemComponent, Object.assign({ as: as !== null && as !== void 0 ? as : 'button', style: style, className: classes, ref: mergedRefs, title: title, description: description, preLeadingContent: isChecked ? ((0, jsx_runtime_1.jsx)(icons_1.CheckIconOutline, { className: "n-size-5 n-shrink-0 n-self-center" })) : null, leadingContent: leadingVisual, trailingContent: trailingContent, isDisabled: isDisabled, htmlAttributes: Object.assign(Object.assign(Object.assign({}, htmlAttributes), { 'aria-checked': isChecked, role: 'menuitemradio', tabIndex: isActive ? 0 : -1 }), menu.getItemProps({
297
322
  id: id,
298
323
  onClick(event) {
324
+ if (isDisabled) {
325
+ event.preventDefault();
326
+ event.stopPropagation();
327
+ return;
328
+ }
299
329
  onClick === null || onClick === void 0 ? void 0 : onClick(event);
300
330
  tree === null || tree === void 0 ? void 0 : tree.events.emit('click', { id });
301
331
  },
@@ -314,7 +344,9 @@ const MenuItems = (_a) => {
314
344
  const MenuGroup = (_a) => {
315
345
  var { children, className, htmlAttributes, style, ref } = _a, restProps = __rest(_a, ["children", "className", "htmlAttributes", "style", "ref"]);
316
346
  const classes = (0, classnames_1.default)('ndl-menu-group', className);
317
- return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: classes, style: style, ref: ref, role: "group" }, restProps, htmlAttributes, { children: children })));
347
+ const labelId = (0, react_2.useId)();
348
+ const [hasLabel, setHasLabel] = (0, react_2.useState)(false);
349
+ return ((0, jsx_runtime_1.jsx)(MenuGroupContext.Provider, { value: { labelId, setHasLabel }, children: (0, jsx_runtime_1.jsx)("div", Object.assign({ className: classes, style: style, ref: ref, role: "group", "aria-labelledby": hasLabel ? labelId : undefined }, restProps, htmlAttributes, { children: children })) }));
318
350
  };
319
351
  const Menu = Object.assign(MenuWrapper, {
320
352
  CategoryItem: CategoryItem,