@neo4j-ndl/react 4.1.5 → 4.1.6

package/lib/esm/drawer/Drawer.js

@@ -41,8 +41,9 @@ import { Typography } from '../typography';
 const DrawerComponent = function DrawerComponent(_a) {
     var { children, className = '', isExpanded, onExpandedChange, position = 'left', type = 'overlay', isResizeable = false, resizeableProps, isCloseable = true, isPortaled = false, portalProps = {}, htmlAttributes, style, ref, as } = _a, restProps = __rest(_a, ["children", "className", "isExpanded", "onExpandedChange", "position", "type", "isResizeable", "resizeableProps", "isCloseable", "isPortaled", "portalProps", "htmlAttributes", "style", "ref", "as"]);
     const setOnExpandedChange = useCallback(() => {
-        if (onExpandedChange)
+        if (onExpandedChange) {
             onExpandedChange(!isExpanded);
+        }
     }, [isExpanded, onExpandedChange]);
     const classes = classNames('ndl-drawer', className, {
         'ndl-drawer-expanded': isExpanded,
@@ -85,22 +86,22 @@ const DrawerComponent = function DrawerComponent(_a) {
 };
 DrawerComponent.displayName = 'Drawer';
 const DrawerHeader = (_a) => {
-    var { children, className = '' } = _a, restProps = __rest(_a, ["children", "className"]);
+    var { children, className = '', htmlAttributes } = _a, restProps = __rest(_a, ["children", "className", "htmlAttributes"]);
     const classes = classNames('ndl-drawer-header', className);
     if (typeof children === 'string' || typeof children === 'number') {
-        return (_jsx(Typography, Object.assign({ variant: "title-3" }, restProps, { className: classes, children: children })));
+        return (_jsx(Typography, Object.assign({ className: classes, variant: "title-3" }, restProps, htmlAttributes, { children: children })));
     }
-    return (_jsx("div", Object.assign({}, restProps, { className: classes, children: children })));
+    return (_jsx("div", Object.assign({ className: classes }, restProps, htmlAttributes, { children: children })));
 };
 const DrawerActions = (_a) => {
-    var { children, className = '' } = _a, restProps = __rest(_a, ["children", "className"]);
+    var { children, className = '', htmlAttributes } = _a, restProps = __rest(_a, ["children", "className", "htmlAttributes"]);
     const classes = classNames('ndl-drawer-actions', className);
-    return (_jsx("div", Object.assign({}, restProps, { className: classes, children: children })));
+    return (_jsx("div", Object.assign({ className: classes }, restProps, htmlAttributes, { children: children })));
 };
 const DrawerBody = (_a) => {
-    var { children, className = '' } = _a, restProps = __rest(_a, ["children", "className"]);
+    var { children, className = '', htmlAttributes } = _a, restProps = __rest(_a, ["children", "className", "htmlAttributes"]);
     const classes = classNames('ndl-drawer-body', className);
-    return (_jsx("div", { className: "ndl-drawer-body-wrapper", children: _jsx("div", Object.assign({}, restProps, { className: classes, children: children })) }));
+    return (_jsx("div", { className: "ndl-drawer-body-wrapper", children: _jsx("div", Object.assign({ className: classes }, restProps, htmlAttributes, { children: children })) }));
 };
 const Drawer = Object.assign(DrawerComponent, {
     Actions: DrawerActions,

package/lib/esm/drawer/Drawer.js.map

@@ -1 +1 @@
-{"version":3,"file":"Drawer.js","sourceRoot":"","sources":["../../../src/drawer/Drawer.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 { FloatingPortal } from '@floating-ui/react';\nimport classNames from 'classnames';\nimport { Resizable, type ResizableProps } from 're-resizable';\nimport type React from 'react';\nimport { type ComponentProps, useCallback } from 'react';\n\nimport {\n  type HtmlAttributes,\n  type PolymorphicCommonProps,\n} from '../_common/types';\nimport { CleanIconButton } from '../clean-icon-button';\nimport { ConditionalWrap } from '../conditional-wrap';\nimport { XMarkIconOutline } from '../icons';\nimport { Typography } from '../typography';\n\ntype DrawerPosition = 'left' | 'right';\n\ntype DrawerType = 'overlay' | 'push';\n\ntype DrawerProps = {\n  /** Controls whether the drawer is open (expanded) or closed (collapsed). */\n  isExpanded: boolean;\n\n  /** Callback functions fired when the drawer's expanded state changes. */\n  onExpandedChange?: (expanded: boolean) => void;\n\n  /** Position where the drawer appears on screen. By default, it appears from the left. */\n  position?: DrawerPosition;\n\n  /** How the drawer affects the layout of sibling content. By default, it overlays content. */\n  type?: DrawerType;\n\n  /** Enables horizontal resizing of the drawer, by default it is not resizable. */\n  isResizeable?: boolean;\n\n  /** To use this prop the isResizeable prop must be set to true. For overriding the third party library props: https://github.com/bokuweb/re-resizable */\n  resizeableProps?: ResizableProps;\n\n  /** Whether a close button (X) is displayed in the drawer. */\n  isCloseable?: boolean;\n\n  /** Whether to portal the content */\n  isPortaled?: boolean;\n\n  /** The content to display within the drawer. */\n  children: React.ReactNode;\n\n  /** Additional CSS classes to apply to the drawer container. */\n  className?: string;\n\n  /**\n   * Props to pass to the portal from @floating-ui/react FloatingPortal\n   * @see https://floating-ui.com/docs/floatingportal\n   */\n  portalProps?: ComponentProps<typeof FloatingPortal>;\n};\n\nconst DrawerComponent = function DrawerComponent<\n  T extends React.ElementType = 'div',\n>({\n  children,\n  className = '',\n  isExpanded,\n  onExpandedChange,\n  position = 'left',\n  type = 'overlay',\n  isResizeable = false,\n  resizeableProps,\n  isCloseable = true,\n  isPortaled = false,\n  portalProps = {},\n  htmlAttributes,\n  style,\n  ref,\n  as,\n  ...restProps\n}: PolymorphicCommonProps<T, DrawerProps>) {\n  const setOnExpandedChange = useCallback(() => {\n    if (onExpandedChange) onExpandedChange(!isExpanded);\n  }, [isExpanded, onExpandedChange]);\n\n  const classes = classNames('ndl-drawer', className, {\n    'ndl-drawer-expanded': isExpanded,\n    'ndl-drawer-left': position === 'left',\n    'ndl-drawer-overlay': type === 'overlay',\n    'ndl-drawer-push': type === 'push',\n    'ndl-drawer-right': position === 'right',\n  });\n\n  const resizableStylePosition = type === 'overlay' ? 'absolute' : 'relative';\n  const shouldRenderInPortal = isPortaled && type === 'overlay';\n  const Component = as ?? 'div';\n\n  const Close = () => (\n    <>\n      {isCloseable && (\n        <CleanIconButton\n          className=\"ndl-drawer-close-button\"\n          onClick={setOnExpandedChange}\n          description=\"Close\"\n          size=\"medium\"\n          htmlAttributes={{\n            title: 'Close drawer',\n          }}\n        >\n          <XMarkIconOutline />\n        </CleanIconButton>\n      )}\n    </>\n  );\n\n  if (isResizeable) {\n    return (\n      <ConditionalWrap\n        shouldWrap={shouldRenderInPortal}\n        wrap={(wrapChildren) => (\n          <FloatingPortal preserveTabOrder={true} {...portalProps}>\n            {wrapChildren}\n          </FloatingPortal>\n        )}\n      >\n        <Resizable\n          as={Component}\n          defaultSize={{\n            height: '100%',\n            width: 'auto',\n          }}\n          {...resizeableProps}\n          className={classes}\n          style={{\n            position: resizableStylePosition,\n            ...style,\n            ...resizeableProps?.style,\n          }}\n          boundsByDirection={true}\n          bounds=\"parent\"\n          handleStyles={{\n            /*\n             * adding a small offset to the handle to make it easier to click\n             * if the content of the drawer is scrollable, most noticeable if not using\n             * a mouse on mac or chrome on windows with the fluent scrollbars\n             */\n            right: {\n              right: '-8px',\n            },\n          }}\n          enable={{\n            bottom: false,\n            bottomLeft: false,\n            bottomRight: false,\n            left: position === 'right',\n            right: position === 'left',\n            top: false,\n            topLeft: false,\n            topRight: false,\n          }}\n          ref={ref}\n          {...restProps}\n          {...htmlAttributes}\n        >\n          {children}\n          <Close />\n        </Resizable>\n      </ConditionalWrap>\n    );\n  }\n\n  return (\n    <ConditionalWrap\n      shouldWrap={shouldRenderInPortal}\n      wrap={(wrapChildren) => (\n        <FloatingPortal preserveTabOrder={true} {...portalProps}>\n          {wrapChildren}\n        </FloatingPortal>\n      )}\n    >\n      <Component\n        className={classes}\n        style={style}\n        ref={ref}\n        {...restProps}\n        {...htmlAttributes}\n      >\n        {children}\n        <Close />\n      </Component>\n    </ConditionalWrap>\n  );\n};\n\nDrawerComponent.displayName = 'Drawer';\n\ntype DrawerHeaderProps = {\n  children: React.ReactNode;\n  className?: string;\n  htmlAttributes?: HtmlAttributes<'h5'>;\n};\n\nconst DrawerHeader = ({\n  children,\n  className = '',\n  ...restProps\n}: DrawerHeaderProps) => {\n  const classes = classNames('ndl-drawer-header', className);\n\n  if (typeof children === 'string' || typeof children === 'number') {\n    return (\n      <Typography variant=\"title-3\" {...restProps} className={classes}>\n        {children}\n      </Typography>\n    );\n  }\n\n  return (\n    <div {...restProps} className={classes}>\n      {children}\n    </div>\n  );\n};\n\ntype DrawerActionsProps = {\n  children: React.ReactNode;\n  className?: string;\n  htmlAttributes?: HtmlAttributes<'div'>;\n};\n\nconst DrawerActions = ({\n  children,\n  className = '',\n  ...restProps\n}: DrawerActionsProps) => {\n  const classes = classNames('ndl-drawer-actions', className);\n\n  return (\n    <div {...restProps} className={classes}>\n      {children}\n    </div>\n  );\n};\n\ntype DrawerBodyProps = {\n  children: React.ReactNode;\n  className?: string;\n  htmlAttributes?: HtmlAttributes<'div'>;\n};\n\nconst DrawerBody = ({\n  children,\n  className = '',\n  ...restProps\n}: DrawerBodyProps) => {\n  const classes = classNames('ndl-drawer-body', className);\n\n  return (\n    <div className=\"ndl-drawer-body-wrapper\">\n      <div {...restProps} className={classes}>\n        {children}\n      </div>\n    </div>\n  );\n};\n\nconst Drawer = Object.assign(DrawerComponent, {\n  Actions: DrawerActions,\n  Body: DrawerBody,\n  Header: DrawerHeader,\n});\n\nexport { Drawer };\n"]}
+{"version":3,"file":"Drawer.js","sourceRoot":"","sources":["../../../src/drawer/Drawer.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 { FloatingPortal } from '@floating-ui/react';\nimport classNames from 'classnames';\nimport { Resizable, type ResizableProps } from 're-resizable';\nimport type React from 'react';\nimport { type ComponentProps, useCallback } from 'react';\n\nimport {\n  type HtmlAttributes,\n  type PolymorphicCommonProps,\n} from '../_common/types';\nimport { CleanIconButton } from '../clean-icon-button';\nimport { ConditionalWrap } from '../conditional-wrap';\nimport { XMarkIconOutline } from '../icons';\nimport { Typography } from '../typography';\n\ntype DrawerPosition = 'left' | 'right';\n\ntype DrawerType = 'overlay' | 'push';\n\ntype DrawerProps = {\n  /** Controls whether the drawer is open (expanded) or closed (collapsed). */\n  isExpanded: boolean;\n\n  /** Callback functions fired when the drawer's expanded state changes. */\n  onExpandedChange?: (expanded: boolean) => void;\n\n  /** Position where the drawer appears on screen. By default, it appears from the left. */\n  position?: DrawerPosition;\n\n  /** How the drawer affects the layout of sibling content. By default, it overlays content. */\n  type?: DrawerType;\n\n  /** Enables horizontal resizing of the drawer, by default it is not resizable. */\n  isResizeable?: boolean;\n\n  /** To use this prop the isResizeable prop must be set to true. For overriding the third party library props: https://github.com/bokuweb/re-resizable */\n  resizeableProps?: ResizableProps;\n\n  /** Whether a close button (X) is displayed in the drawer. */\n  isCloseable?: boolean;\n\n  /** Whether to portal the content */\n  isPortaled?: boolean;\n\n  /** The content to display within the drawer. */\n  children: React.ReactNode;\n\n  /** Additional CSS classes to apply to the drawer container. */\n  className?: string;\n\n  /**\n   * Props to pass to the portal from @floating-ui/react FloatingPortal\n   * @see https://floating-ui.com/docs/floatingportal\n   */\n  portalProps?: ComponentProps<typeof FloatingPortal>;\n};\n\nconst DrawerComponent = function DrawerComponent<\n  T extends React.ElementType = 'div',\n>({\n  children,\n  className = '',\n  isExpanded,\n  onExpandedChange,\n  position = 'left',\n  type = 'overlay',\n  isResizeable = false,\n  resizeableProps,\n  isCloseable = true,\n  isPortaled = false,\n  portalProps = {},\n  htmlAttributes,\n  style,\n  ref,\n  as,\n  ...restProps\n}: PolymorphicCommonProps<T, DrawerProps>) {\n  const setOnExpandedChange = useCallback(() => {\n    if (onExpandedChange) {\n      onExpandedChange(!isExpanded);\n    }\n  }, [isExpanded, onExpandedChange]);\n\n  const classes = classNames('ndl-drawer', className, {\n    'ndl-drawer-expanded': isExpanded,\n    'ndl-drawer-left': position === 'left',\n    'ndl-drawer-overlay': type === 'overlay',\n    'ndl-drawer-push': type === 'push',\n    'ndl-drawer-right': position === 'right',\n  });\n\n  const resizableStylePosition = type === 'overlay' ? 'absolute' : 'relative';\n  const shouldRenderInPortal = isPortaled && type === 'overlay';\n  const Component = as ?? 'div';\n\n  const Close = () => (\n    <>\n      {isCloseable && (\n        <CleanIconButton\n          className=\"ndl-drawer-close-button\"\n          onClick={setOnExpandedChange}\n          description=\"Close\"\n          size=\"medium\"\n          htmlAttributes={{\n            title: 'Close drawer',\n          }}\n        >\n          <XMarkIconOutline />\n        </CleanIconButton>\n      )}\n    </>\n  );\n\n  if (isResizeable) {\n    return (\n      <ConditionalWrap\n        shouldWrap={shouldRenderInPortal}\n        wrap={(wrapChildren) => (\n          <FloatingPortal preserveTabOrder={true} {...portalProps}>\n            {wrapChildren}\n          </FloatingPortal>\n        )}\n      >\n        <Resizable\n          as={Component}\n          defaultSize={{\n            height: '100%',\n            width: 'auto',\n          }}\n          {...resizeableProps}\n          className={classes}\n          style={{\n            position: resizableStylePosition,\n            ...style,\n            ...resizeableProps?.style,\n          }}\n          boundsByDirection={true}\n          bounds=\"parent\"\n          handleStyles={{\n            /*\n             * adding a small offset to the handle to make it easier to click\n             * if the content of the drawer is scrollable, most noticeable if not using\n             * a mouse on mac or chrome on windows with the fluent scrollbars\n             */\n            right: {\n              right: '-8px',\n            },\n          }}\n          enable={{\n            bottom: false,\n            bottomLeft: false,\n            bottomRight: false,\n            left: position === 'right',\n            right: position === 'left',\n            top: false,\n            topLeft: false,\n            topRight: false,\n          }}\n          ref={ref}\n          {...restProps}\n          {...htmlAttributes}\n        >\n          {children}\n          <Close />\n        </Resizable>\n      </ConditionalWrap>\n    );\n  }\n\n  return (\n    <ConditionalWrap\n      shouldWrap={shouldRenderInPortal}\n      wrap={(wrapChildren) => (\n        <FloatingPortal preserveTabOrder={true} {...portalProps}>\n          {wrapChildren}\n        </FloatingPortal>\n      )}\n    >\n      <Component\n        className={classes}\n        style={style}\n        ref={ref}\n        {...restProps}\n        {...htmlAttributes}\n      >\n        {children}\n        <Close />\n      </Component>\n    </ConditionalWrap>\n  );\n};\n\nDrawerComponent.displayName = 'Drawer';\n\ntype DrawerHeaderProps = {\n  children: React.ReactNode;\n  className?: string;\n  htmlAttributes?: HtmlAttributes<'h5'>;\n};\n\nconst DrawerHeader = ({\n  children,\n  className = '',\n  htmlAttributes,\n  ...restProps\n}: DrawerHeaderProps) => {\n  const classes = classNames('ndl-drawer-header', className);\n\n  if (typeof children === 'string' || typeof children === 'number') {\n    return (\n      <Typography\n        className={classes}\n        variant=\"title-3\"\n        {...restProps}\n        {...htmlAttributes}\n      >\n        {children}\n      </Typography>\n    );\n  }\n\n  return (\n    <div className={classes} {...restProps} {...htmlAttributes}>\n      {children}\n    </div>\n  );\n};\n\ntype DrawerActionsProps = {\n  children: React.ReactNode;\n  className?: string;\n  htmlAttributes?: HtmlAttributes<'div'>;\n};\n\nconst DrawerActions = ({\n  children,\n  className = '',\n  htmlAttributes,\n  ...restProps\n}: DrawerActionsProps) => {\n  const classes = classNames('ndl-drawer-actions', className);\n\n  return (\n    <div className={classes} {...restProps} {...htmlAttributes}>\n      {children}\n    </div>\n  );\n};\n\ntype DrawerBodyProps = {\n  children: React.ReactNode;\n  className?: string;\n  htmlAttributes?: HtmlAttributes<'div'>;\n};\n\nconst DrawerBody = ({\n  children,\n  className = '',\n  htmlAttributes,\n  ...restProps\n}: DrawerBodyProps) => {\n  const classes = classNames('ndl-drawer-body', className);\n\n  return (\n    <div className=\"ndl-drawer-body-wrapper\">\n      <div className={classes} {...restProps} {...htmlAttributes}>\n        {children}\n      </div>\n    </div>\n  );\n};\n\nconst Drawer = Object.assign(DrawerComponent, {\n  Actions: DrawerActions,\n  Body: DrawerBody,\n  Header: DrawerHeader,\n});\n\nexport { Drawer };\n"]}

package/lib/esm/dropdown-button/DropdownButton.js

@@ -1,3 +1,14 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /**
  *
@@ -28,7 +39,8 @@ import { ChevronDownIconOutline } from '../icons';
  *
  *
  */
-export const DropdownButton = function DropdownButton({ as, children, size = 'medium', isDisabled = false, isFloating = false, leadingElement, isOpen = false, onClick, className, style, htmlAttributes, ref, }) {
+export const DropdownButton = function DropdownButton(_a) {
+    var { as, children, size = 'medium', isDisabled = false, isFloating = false, leadingElement, isOpen = false, onClick, className, style, htmlAttributes, ref } = _a, restProps = __rest(_a, ["as", "children", "size", "isDisabled", "isFloating", "leadingElement", "isOpen", "onClick", "className", "style", "htmlAttributes", "ref"]);
     const classes = classNames('ndl-dropdown-btn', className, {
         'ndl-disabled': isDisabled,
         'ndl-floating-btn': isFloating,
@@ -38,7 +50,7 @@ export const DropdownButton = function DropdownButton({ as, children, size = 'me
         'ndl-small': size === 'small',
     });
     const Component = as !== null && as !== void 0 ? as : 'button';
-    return (_jsx(Component, Object.assign({ className: classes, disabled: isDisabled, onClick: onClick, "aria-expanded": isOpen, ref: ref, style: style }, htmlAttributes, { children: _jsxs("div", { className: "ndl-dropdown-btn-inner", children: [_jsxs("div", { className: "ndl-dropdown-btn-leading-wrapper", children: [leadingElement, _jsx("span", { className: "ndl-dropdown-btn-content", children: children })] }), _jsx(ChevronDownIconOutline, { className: classNames('ndl-dropdown-button-icon', {
+    return (_jsx(Component, Object.assign({ className: classes, disabled: isDisabled, onClick: onClick, "aria-expanded": isOpen, ref: ref, style: style }, restProps, htmlAttributes, { children: _jsxs("div", { className: "ndl-dropdown-btn-inner", children: [_jsxs("div", { className: "ndl-dropdown-btn-leading-wrapper", children: [leadingElement, _jsx("span", { className: "ndl-dropdown-btn-content", children: children })] }), _jsx(ChevronDownIconOutline, { className: classNames('ndl-dropdown-button-icon', {
                         'ndl-dropdown-button-icon-open': isOpen,
                     }) })] }) })));
 };

package/lib/esm/dropdown-button/DropdownButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownButton.js","sourceRoot":"","sources":["../../../src/dropdown-button/DropdownButton.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,OAAO,UAAU,MAAM,YAAY,CAAC;AAIpC,OAAO,EAAE,sBAAsB,EAAE,MAAM,UAAU,CAAC;AA6BlD;;;;;;GAMG;AAEH,MAAM,CAAC,MAAM,cAAc,GAAG,SAAS,cAAc,CAEnD,EACA,EAAE,EACF,QAAQ,EACR,IAAI,GAAG,QAAQ,EACf,UAAU,GAAG,KAAK,EAClB,UAAU,GAAG,KAAK,EAClB,cAAc,EACd,MAAM,GAAG,KAAK,EACd,OAAO,EACP,SAAS,EACT,KAAK,EACL,cAAc,EACd,GAAG,GAC4C;IAC/C,MAAM,OAAO,GAAG,UAAU,CAAC,kBAAkB,EAAE,SAAS,EAAE;QACxD,cAAc,EAAE,UAAU;QAC1B,kBAAkB,EAAE,UAAU;QAC9B,WAAW,EAAE,IAAI,KAAK,OAAO;QAC7B,YAAY,EAAE,IAAI,KAAK,QAAQ;QAC/B,UAAU,EAAE,MAAM;QAClB,WAAW,EAAE,IAAI,KAAK,OAAO;KAC9B,CAAC,CAAC;IAEH,MAAM,SAAS,GAAsB,EAAE,aAAF,EAAE,cAAF,EAAE,GAAI,QAAQ,CAAC;IAEpD,OAAO,CACL,KAAC,SAAS,kBACR,SAAS,EAAE,OAAO,EAClB,QAAQ,EAAE,UAAU,EACpB,OAAO,EAAE,OAAO,mBACD,MAAM,EACrB,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,IACR,cAAc,cAElB,eAAK,SAAS,EAAC,wBAAwB,aACrC,eAAK,SAAS,EAAC,kCAAkC,aAC9C,cAAc,EACf,eAAM,SAAS,EAAC,0BAA0B,YAAE,QAAQ,GAAQ,IACxD,EAEN,KAAC,sBAAsB,IACrB,SAAS,EAAE,UAAU,CAAC,0BAA0B,EAAE;wBAChD,+BAA+B,EAAE,MAAM;qBACxC,CAAC,GACF,IACE,IACI,CACb,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 classNames from 'classnames';\nimport type React from 'react';\n\nimport { type PolymorphicCommonProps } from '../_common/types';\nimport { ChevronDownIconOutline } from '../icons';\n\n/**\n *\n *\n * Types\n *\n *\n */\n\ntype DropdownButtonProps = {\n  /** Content displayed in the button */\n  children: React.ReactNode;\n  /** Size of button */\n  size?: 'small' | 'medium' | 'large';\n  /** Whether the button is in floating state */\n  isFloating?: boolean;\n  /** Whether the button is in disabled state */\n  isDisabled?: boolean;\n  /** Element that is shown before the button content */\n  leadingElement?: React.ReactNode;\n  /** If the dropdown is activated */\n  isOpen?: boolean;\n  /** Callback function to be called when the button is clicked */\n  onClick?: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;\n  /** Additional classnames */\n  className?: string;\n};\n\n/**\n *\n *\n * DropdownButton Component\n *\n *\n */\n\nexport const DropdownButton = function DropdownButton<\n  T extends React.ElementType = 'button',\n>({\n  as,\n  children,\n  size = 'medium',\n  isDisabled = false,\n  isFloating = false,\n  leadingElement,\n  isOpen = false,\n  onClick,\n  className,\n  style,\n  htmlAttributes,\n  ref,\n}: PolymorphicCommonProps<T, DropdownButtonProps>) {\n  const classes = classNames('ndl-dropdown-btn', className, {\n    'ndl-disabled': isDisabled,\n    'ndl-floating-btn': isFloating,\n    'ndl-large': size === 'large',\n    'ndl-medium': size === 'medium',\n    'ndl-open': isOpen,\n    'ndl-small': size === 'small',\n  });\n\n  const Component: React.ElementType = as ?? 'button';\n\n  return (\n    <Component\n      className={classes}\n      disabled={isDisabled}\n      onClick={onClick}\n      aria-expanded={isOpen}\n      ref={ref}\n      style={style}\n      {...htmlAttributes}\n    >\n      <div className=\"ndl-dropdown-btn-inner\">\n        <div className=\"ndl-dropdown-btn-leading-wrapper\">\n          {leadingElement}\n          <span className=\"ndl-dropdown-btn-content\">{children}</span>\n        </div>\n\n        <ChevronDownIconOutline\n          className={classNames('ndl-dropdown-button-icon', {\n            'ndl-dropdown-button-icon-open': isOpen,\n          })}\n        />\n      </div>\n    </Component>\n  );\n};\n"]}
+{"version":3,"file":"DropdownButton.js","sourceRoot":"","sources":["../../../src/dropdown-button/DropdownButton.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,OAAO,UAAU,MAAM,YAAY,CAAC;AAIpC,OAAO,EAAE,sBAAsB,EAAE,MAAM,UAAU,CAAC;AA6BlD;;;;;;GAMG;AAEH,MAAM,CAAC,MAAM,cAAc,GAAG,SAAS,cAAc,CAEnD,EAc+C;QAd/C,EACA,EAAE,EACF,QAAQ,EACR,IAAI,GAAG,QAAQ,EACf,UAAU,GAAG,KAAK,EAClB,UAAU,GAAG,KAAK,EAClB,cAAc,EACd,MAAM,GAAG,KAAK,EACd,OAAO,EACP,SAAS,EACT,KAAK,EACL,cAAc,EACd,GAAG,OAE4C,EAD5C,SAAS,cAbZ,4IAcD,CADa;IAEZ,MAAM,OAAO,GAAG,UAAU,CAAC,kBAAkB,EAAE,SAAS,EAAE;QACxD,cAAc,EAAE,UAAU;QAC1B,kBAAkB,EAAE,UAAU;QAC9B,WAAW,EAAE,IAAI,KAAK,OAAO;QAC7B,YAAY,EAAE,IAAI,KAAK,QAAQ;QAC/B,UAAU,EAAE,MAAM;QAClB,WAAW,EAAE,IAAI,KAAK,OAAO;KAC9B,CAAC,CAAC;IAEH,MAAM,SAAS,GAAsB,EAAE,aAAF,EAAE,cAAF,EAAE,GAAI,QAAQ,CAAC;IAEpD,OAAO,CACL,KAAC,SAAS,kBACR,SAAS,EAAE,OAAO,EAClB,QAAQ,EAAE,UAAU,EACpB,OAAO,EAAE,OAAO,mBACD,MAAM,EACrB,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,IACR,SAAS,EACT,cAAc,cAElB,eAAK,SAAS,EAAC,wBAAwB,aACrC,eAAK,SAAS,EAAC,kCAAkC,aAC9C,cAAc,EACf,eAAM,SAAS,EAAC,0BAA0B,YAAE,QAAQ,GAAQ,IACxD,EAEN,KAAC,sBAAsB,IACrB,SAAS,EAAE,UAAU,CAAC,0BAA0B,EAAE;wBAChD,+BAA+B,EAAE,MAAM;qBACxC,CAAC,GACF,IACE,IACI,CACb,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 classNames from 'classnames';\nimport type React from 'react';\n\nimport { type PolymorphicCommonProps } from '../_common/types';\nimport { ChevronDownIconOutline } from '../icons';\n\n/**\n *\n *\n * Types\n *\n *\n */\n\ntype DropdownButtonProps = {\n  /** Content displayed in the button */\n  children: React.ReactNode;\n  /** Size of button */\n  size?: 'small' | 'medium' | 'large';\n  /** Whether the button is in floating state */\n  isFloating?: boolean;\n  /** Whether the button is in disabled state */\n  isDisabled?: boolean;\n  /** Element that is shown before the button content */\n  leadingElement?: React.ReactNode;\n  /** If the dropdown is activated */\n  isOpen?: boolean;\n  /** Callback function to be called when the button is clicked */\n  onClick?: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;\n  /** Additional classnames */\n  className?: string;\n};\n\n/**\n *\n *\n * DropdownButton Component\n *\n *\n */\n\nexport const DropdownButton = function DropdownButton<\n  T extends React.ElementType = 'button',\n>({\n  as,\n  children,\n  size = 'medium',\n  isDisabled = false,\n  isFloating = false,\n  leadingElement,\n  isOpen = false,\n  onClick,\n  className,\n  style,\n  htmlAttributes,\n  ref,\n  ...restProps\n}: PolymorphicCommonProps<T, DropdownButtonProps>) {\n  const classes = classNames('ndl-dropdown-btn', className, {\n    'ndl-disabled': isDisabled,\n    'ndl-floating-btn': isFloating,\n    'ndl-large': size === 'large',\n    'ndl-medium': size === 'medium',\n    'ndl-open': isOpen,\n    'ndl-small': size === 'small',\n  });\n\n  const Component: React.ElementType = as ?? 'button';\n\n  return (\n    <Component\n      className={classes}\n      disabled={isDisabled}\n      onClick={onClick}\n      aria-expanded={isOpen}\n      ref={ref}\n      style={style}\n      {...restProps}\n      {...htmlAttributes}\n    >\n      <div className=\"ndl-dropdown-btn-inner\">\n        <div className=\"ndl-dropdown-btn-leading-wrapper\">\n          {leadingElement}\n          <span className=\"ndl-dropdown-btn-content\">{children}</span>\n        </div>\n\n        <ChevronDownIconOutline\n          className={classNames('ndl-dropdown-button-icon', {\n            'ndl-dropdown-button-icon-open': isOpen,\n          })}\n        />\n      </div>\n    </Component>\n  );\n};\n"]}

package/lib/esm/dropzone/Dropzone.js

@@ -63,8 +63,9 @@ const DropzoneComponent = (_a) => {
         if (acceptedFileExtensions && acceptedFileExtensions.length > 0) {
             for (const file of acceptedFiles) {
                 const isAccepted = acceptedFileExtensions.some((extension) => {
-                    if (file.name.endsWith(extension))
+                    if (file.name.endsWith(extension)) {
                         return true;
+                    }
                 });
                 if (!isAccepted) {
                     setIsRejected(true);
@@ -105,7 +106,7 @@ const DropzoneComponent = (_a) => {
 };
 const DropzoneLoadingProgressBarComponent = (_a) => {
     var { progressBarPrecentage, progressBarMinute, htmlAttributes, className, style, ref } = _a, restProps = __rest(_a, ["progressBarPrecentage", "progressBarMinute", "htmlAttributes", "className", "style", "ref"]);
-    return (_jsxs("div", { className: "ndl-dropzone-loading-progress-bar-wrapper", children: [_jsxs("div", { className: "ndl-dropzone-loading-progress-bar-indicators", children: [_jsx(Typography, { className: "ndl-dropzone-loading-progress-bar-precentage", variant: "subheading-small", children: progressBarPrecentage + '%' }), Boolean(progressBarMinute) && (_jsx(Typography, { className: "ndl-dropzone-loading-progress-bar-minute", variant: "body-medium", children: `(${progressBarMinute} minutes left)` }))] }), _jsx(ProgressBar, Object.assign({ className: classNames('ndl-dropzone-loading-progress-bar', className), value: progressBarPrecentage, size: "large", htmlAttributes: htmlAttributes, ref: ref, style: style }, restProps))] }));
+    return (_jsxs("div", { className: "ndl-dropzone-loading-progress-bar-wrapper", children: [_jsxs("div", { className: "ndl-dropzone-loading-progress-bar-indicators", children: [_jsx(Typography, { className: "ndl-dropzone-loading-progress-bar-precentage", variant: "subheading-small", children: `${progressBarPrecentage}%` }), Boolean(progressBarMinute) && (_jsx(Typography, { className: "ndl-dropzone-loading-progress-bar-minute", variant: "body-medium", children: `(${progressBarMinute} minutes left)` }))] }), _jsx(ProgressBar, Object.assign({ className: classNames('ndl-dropzone-loading-progress-bar', className), value: progressBarPrecentage, size: "large", htmlAttributes: htmlAttributes, ref: ref, style: style }, restProps))] }));
 };
 const Dropzone = Object.assign(DropzoneComponent, {
     LoadingProgressBar: DropzoneLoadingProgressBarComponent,

package/lib/esm/dropzone/Dropzone.js.map

@@ -1 +1 @@
-{"version":3,"file":"Dropzone.js","sourceRoot":"","sources":["../../../src/dropzone/Dropzone.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\nimport { useMergeRefs } from '@floating-ui/react';\nimport classNames from 'classnames';\nimport { detect } from 'detect-browser';\nimport { type RefObject, useMemo, useRef, useState } from 'react';\nimport {\n  type DropEvent,\n  type DropzoneOptions,\n  type FileRejection,\n  useDropzone,\n} from 'react-dropzone';\nimport { useResizeObserver } from 'usehooks-ts';\n\nimport { type CommonProps } from '../_common/types';\nimport { Banner } from '../banner';\nimport {\n  DocumentArrowUpIconOutline,\n  DocumentArrowUpIconSolid,\n  XCircleIconSolid,\n} from '../icons';\nimport { ProgressBar } from '../progress-bar';\nimport { Typography } from '../typography';\n\n/**\n *\n *\n * Types\n *\n *\n */\ntype DropzoneProps = {\n  /** Props for the underlying `react-dropzone` component. Don't use `accept`. If using custom file extensions as this option is broken. Instead use the `acceptedFileExtensions` property. */\n  dropZoneOptions: DropzoneOptions;\n\n  /** Informational text that highlights the supported file types, will be displayed in the footer. */\n  supportedFilesDescription?: React.ReactNode;\n\n  /** Element to display when uploading the file.*/\n  loadingElement?: React.ReactNode;\n\n  /** Use when wanting a custom heading. */\n  heading?: React.ReactNode;\n\n  /** Message to be shown when file is rejected. */\n  rejectedText?: React.ReactNode;\n\n  /** The accepted file extensions for the Drag-and-Drop. */\n  acceptedFileExtensions?: string[];\n};\n\ntype DropzoneLoadingProgressBarProps = {\n  /**  The percentage of the progress bar. */\n  progressBarPrecentage: number;\n\n  /** The time in minute left to upload the file. */\n  progressBarMinute?: number;\n};\n\n/**\n *\n *\n * Helpers\n *\n *\n */\n\nconst browser = detect();\n\nconst isSafari = browser?.name === 'safari';\n\nconst DropzoneComponent = ({\n  dropZoneOptions,\n  supportedFilesDescription,\n  loadingElement,\n  heading,\n  rejectedText,\n  acceptedFileExtensions,\n  htmlAttributes,\n  style,\n  className,\n  ref,\n  ...restProps\n}: CommonProps<'div', DropzoneProps>) => {\n  /**\n   * We intercept the onDrop function in order to enforce\n   * custom file extensions. Before calling the onDrop props we check\n   * if the custom file extensions is acceptable. If the extension\n   * conforms to acceptedFileExtensions, we call onDrop. Otherwise, we\n   * present an error message.\n   */\n  function onDropInterceptor<T extends File>(\n    acceptedFiles: T[],\n    fileRejections: FileRejection[],\n    event: DropEvent,\n  ) {\n    if (acceptedFileExtensions && acceptedFileExtensions.length > 0) {\n      for (const file of acceptedFiles) {\n        const isAccepted = acceptedFileExtensions.some((extension) => {\n          if (file.name.endsWith(extension)) return true;\n        });\n        if (!isAccepted) {\n          setIsRejected(true);\n          return;\n        }\n      }\n    }\n    setIsRejected(false);\n    dropZoneOptions.onDrop?.(acceptedFiles, fileRejections, event);\n  }\n\n  const [isRejected, setIsRejected] = useState(false);\n  const dropZoneRef = useRef<HTMLDivElement>(null);\n  const mergedRef = useMergeRefs([dropZoneRef, ref]);\n  const isDisabled = dropZoneOptions?.disabled || Boolean(loadingElement);\n\n  const {\n    getRootProps,\n    getInputProps,\n    isDragActive,\n    isDragAccept,\n    isDragReject,\n    open,\n  } = useDropzone({\n    ...dropZoneOptions,\n    disabled: isDisabled,\n    noClick: true,\n    onDrop: onDropInterceptor,\n  });\n\n  const { width } = useResizeObserver({\n    ref: dropZoneRef as RefObject<HTMLElement>,\n  });\n\n  const isUploading = Boolean(loadingElement);\n\n  const titleText =\n    isDragActive && isDragReject\n      ? 'Format not supported'\n      : isDragActive && !isDragReject\n        ? 'Drop file'\n        : null;\n\n  const computedFileImage =\n    (isDragActive && isDragAccept) || isUploading ? (\n      <DocumentArrowUpIconSolid className=\"n-size-token-48 n-text-primary-bg-strong\" />\n    ) : (\n      <XCircleIconSolid className=\"n-size-token-48 n-text-danger-bg-strong\" />\n    );\n\n  const wrapperClasses = classNames('ndl-dropzone', className, {\n    'ndl-drag-active': isDragActive,\n    'ndl-drag-disabled': dropZoneOptions?.disabled,\n    'ndl-file-invalid': isDragActive && isDragReject,\n  });\n\n  useMemo(() => {\n    if (isDragActive && isRejected) {\n      setIsRejected(false);\n    }\n  }, [isDragActive, isRejected]);\n\n  return (\n    <>\n      {isRejected && (\n        <Banner className=\"ndl-dropzone-error-alert\" variant=\"danger\">\n          <Banner.Header>Error</Banner.Header>\n          <Banner.Description>\n            {Boolean(rejectedText) || 'File extension not supported.'}\n          </Banner.Description>\n        </Banner>\n      )}\n      <div\n        ref={mergedRef}\n        className={wrapperClasses}\n        style={style}\n        {...restProps}\n        {...htmlAttributes}\n      >\n        <div className=\"ndl-dropzone-inner-wrapper\" {...getRootProps()}>\n          <input aria-label=\"Drag and drop area\" {...getInputProps()} />\n          <div className=\"ndl-dropzone-inner\">\n            {/* Illustration should be visible only after arbitrary width */}\n            {width !== undefined && width > 230 && (\n              <>\n                {isDragActive && !isSafari ? (\n                  computedFileImage\n                ) : (\n                  <DocumentArrowUpIconOutline className=\"ndl-dropzone-upload-icon\" />\n                )}\n              </>\n            )}\n            {!isUploading && (\n              <div className=\"ndl-dnd-title-container\">\n                <Typography variant=\"subheading-medium\">\n                  {titleText ||\n                    (heading ?? (\n                      <>\n                        Drag <span className=\"n-font-light\">&</span> Drop\n                      </>\n                    ))}\n                </Typography>\n                {!isDragReject && (\n                  <div className=\"ndl-dnd-subtitle\">\n                    <Typography variant=\"body-medium\">or</Typography>{' '}\n                    <button\n                      className=\"ndl-dnd-browse-link\"\n                      onClick={() => open()}\n                      disabled={isDisabled}\n                      type=\"button\"\n                    >\n                      Browse\n                    </button>\n                  </div>\n                )}\n              </div>\n            )}\n            <div className=\"ndl-dropzone-footer\">\n              {isUploading && <>{loadingElement}</>}\n              {!isUploading && (\n                <div className=\"ndl-file-support-text\">\n                  {supportedFilesDescription}\n                </div>\n              )}\n            </div>\n          </div>\n        </div>\n      </div>\n    </>\n  );\n};\n\nconst DropzoneLoadingProgressBarComponent = ({\n  progressBarPrecentage,\n  progressBarMinute,\n  htmlAttributes,\n  className,\n  style,\n  ref,\n  ...restProps\n}: CommonProps<'div', DropzoneLoadingProgressBarProps>) => {\n  return (\n    <div className=\"ndl-dropzone-loading-progress-bar-wrapper\">\n      <div className=\"ndl-dropzone-loading-progress-bar-indicators\">\n        <Typography\n          className=\"ndl-dropzone-loading-progress-bar-precentage\"\n          variant=\"subheading-small\"\n        >\n          {progressBarPrecentage + '%'}\n        </Typography>\n        {Boolean(progressBarMinute) && (\n          <Typography\n            className=\"ndl-dropzone-loading-progress-bar-minute\"\n            variant=\"body-medium\"\n          >{`(${progressBarMinute} minutes left)`}</Typography>\n        )}\n      </div>\n      <ProgressBar\n        className={classNames('ndl-dropzone-loading-progress-bar', className)}\n        value={progressBarPrecentage}\n        size=\"large\"\n        htmlAttributes={htmlAttributes}\n        ref={ref}\n        style={style}\n        {...restProps}\n      />\n    </div>\n  );\n};\n\nconst Dropzone = Object.assign(DropzoneComponent, {\n  LoadingProgressBar: DropzoneLoadingProgressBarComponent,\n});\n\nexport { Dropzone };\n"]}
+{"version":3,"file":"Dropzone.js","sourceRoot":"","sources":["../../../src/dropzone/Dropzone.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\nimport { useMergeRefs } from '@floating-ui/react';\nimport classNames from 'classnames';\nimport { detect } from 'detect-browser';\nimport { type RefObject, useMemo, useRef, useState } from 'react';\nimport {\n  type DropEvent,\n  type DropzoneOptions,\n  type FileRejection,\n  useDropzone,\n} from 'react-dropzone';\nimport { useResizeObserver } from 'usehooks-ts';\n\nimport { type CommonProps } from '../_common/types';\nimport { Banner } from '../banner';\nimport {\n  DocumentArrowUpIconOutline,\n  DocumentArrowUpIconSolid,\n  XCircleIconSolid,\n} from '../icons';\nimport { ProgressBar } from '../progress-bar';\nimport { Typography } from '../typography';\n\n/**\n *\n *\n * Types\n *\n *\n */\ntype DropzoneProps = {\n  /** Props for the underlying `react-dropzone` component. Don't use `accept`. If using custom file extensions as this option is broken. Instead use the `acceptedFileExtensions` property. */\n  dropZoneOptions: DropzoneOptions;\n\n  /** Informational text that highlights the supported file types, will be displayed in the footer. */\n  supportedFilesDescription?: React.ReactNode;\n\n  /** Element to display when uploading the file.*/\n  loadingElement?: React.ReactNode;\n\n  /** Use when wanting a custom heading. */\n  heading?: React.ReactNode;\n\n  /** Message to be shown when file is rejected. */\n  rejectedText?: React.ReactNode;\n\n  /** The accepted file extensions for the Drag-and-Drop. */\n  acceptedFileExtensions?: string[];\n};\n\ntype DropzoneLoadingProgressBarProps = {\n  /**  The percentage of the progress bar. */\n  progressBarPrecentage: number;\n\n  /** The time in minute left to upload the file. */\n  progressBarMinute?: number;\n};\n\n/**\n *\n *\n * Helpers\n *\n *\n */\n\nconst browser = detect();\n\nconst isSafari = browser?.name === 'safari';\n\nconst DropzoneComponent = ({\n  dropZoneOptions,\n  supportedFilesDescription,\n  loadingElement,\n  heading,\n  rejectedText,\n  acceptedFileExtensions,\n  htmlAttributes,\n  style,\n  className,\n  ref,\n  ...restProps\n}: CommonProps<'div', DropzoneProps>) => {\n  /**\n   * We intercept the onDrop function in order to enforce\n   * custom file extensions. Before calling the onDrop props we check\n   * if the custom file extensions is acceptable. If the extension\n   * conforms to acceptedFileExtensions, we call onDrop. Otherwise, we\n   * present an error message.\n   */\n  function onDropInterceptor<T extends File>(\n    acceptedFiles: T[],\n    fileRejections: FileRejection[],\n    event: DropEvent,\n  ) {\n    if (acceptedFileExtensions && acceptedFileExtensions.length > 0) {\n      for (const file of acceptedFiles) {\n        const isAccepted = acceptedFileExtensions.some((extension) => {\n          if (file.name.endsWith(extension)) {\n            return true;\n          }\n        });\n        if (!isAccepted) {\n          setIsRejected(true);\n          return;\n        }\n      }\n    }\n    setIsRejected(false);\n    dropZoneOptions.onDrop?.(acceptedFiles, fileRejections, event);\n  }\n\n  const [isRejected, setIsRejected] = useState(false);\n  const dropZoneRef = useRef<HTMLDivElement>(null);\n  const mergedRef = useMergeRefs([dropZoneRef, ref]);\n  const isDisabled = dropZoneOptions?.disabled || Boolean(loadingElement);\n\n  const {\n    getRootProps,\n    getInputProps,\n    isDragActive,\n    isDragAccept,\n    isDragReject,\n    open,\n  } = useDropzone({\n    ...dropZoneOptions,\n    disabled: isDisabled,\n    noClick: true,\n    onDrop: onDropInterceptor,\n  });\n\n  const { width } = useResizeObserver({\n    ref: dropZoneRef as RefObject<HTMLElement>,\n  });\n\n  const isUploading = Boolean(loadingElement);\n\n  const titleText =\n    isDragActive && isDragReject\n      ? 'Format not supported'\n      : isDragActive && !isDragReject\n        ? 'Drop file'\n        : null;\n\n  const computedFileImage =\n    (isDragActive && isDragAccept) || isUploading ? (\n      <DocumentArrowUpIconSolid className=\"n-size-token-48 n-text-primary-bg-strong\" />\n    ) : (\n      <XCircleIconSolid className=\"n-size-token-48 n-text-danger-bg-strong\" />\n    );\n\n  const wrapperClasses = classNames('ndl-dropzone', className, {\n    'ndl-drag-active': isDragActive,\n    'ndl-drag-disabled': dropZoneOptions?.disabled,\n    'ndl-file-invalid': isDragActive && isDragReject,\n  });\n\n  useMemo(() => {\n    if (isDragActive && isRejected) {\n      setIsRejected(false);\n    }\n  }, [isDragActive, isRejected]);\n\n  return (\n    <>\n      {isRejected && (\n        <Banner className=\"ndl-dropzone-error-alert\" variant=\"danger\">\n          <Banner.Header>Error</Banner.Header>\n          <Banner.Description>\n            {Boolean(rejectedText) || 'File extension not supported.'}\n          </Banner.Description>\n        </Banner>\n      )}\n      <div\n        ref={mergedRef}\n        className={wrapperClasses}\n        style={style}\n        {...restProps}\n        {...htmlAttributes}\n      >\n        <div className=\"ndl-dropzone-inner-wrapper\" {...getRootProps()}>\n          <input aria-label=\"Drag and drop area\" {...getInputProps()} />\n          <div className=\"ndl-dropzone-inner\">\n            {/* Illustration should be visible only after arbitrary width */}\n            {width !== undefined && width > 230 && (\n              <>\n                {isDragActive && !isSafari ? (\n                  computedFileImage\n                ) : (\n                  <DocumentArrowUpIconOutline className=\"ndl-dropzone-upload-icon\" />\n                )}\n              </>\n            )}\n            {!isUploading && (\n              <div className=\"ndl-dnd-title-container\">\n                <Typography variant=\"subheading-medium\">\n                  {titleText ||\n                    (heading ?? (\n                      <>\n                        Drag <span className=\"n-font-light\">&</span> Drop\n                      </>\n                    ))}\n                </Typography>\n                {!isDragReject && (\n                  <div className=\"ndl-dnd-subtitle\">\n                    <Typography variant=\"body-medium\">or</Typography>{' '}\n                    <button\n                      className=\"ndl-dnd-browse-link\"\n                      onClick={() => open()}\n                      disabled={isDisabled}\n                      type=\"button\"\n                    >\n                      Browse\n                    </button>\n                  </div>\n                )}\n              </div>\n            )}\n            <div className=\"ndl-dropzone-footer\">\n              {isUploading && <>{loadingElement}</>}\n              {!isUploading && (\n                <div className=\"ndl-file-support-text\">\n                  {supportedFilesDescription}\n                </div>\n              )}\n            </div>\n          </div>\n        </div>\n      </div>\n    </>\n  );\n};\n\nconst DropzoneLoadingProgressBarComponent = ({\n  progressBarPrecentage,\n  progressBarMinute,\n  htmlAttributes,\n  className,\n  style,\n  ref,\n  ...restProps\n}: CommonProps<'div', DropzoneLoadingProgressBarProps>) => {\n  return (\n    <div className=\"ndl-dropzone-loading-progress-bar-wrapper\">\n      <div className=\"ndl-dropzone-loading-progress-bar-indicators\">\n        <Typography\n          className=\"ndl-dropzone-loading-progress-bar-precentage\"\n          variant=\"subheading-small\"\n        >\n          {`${progressBarPrecentage}%`}\n        </Typography>\n        {Boolean(progressBarMinute) && (\n          <Typography\n            className=\"ndl-dropzone-loading-progress-bar-minute\"\n            variant=\"body-medium\"\n          >{`(${progressBarMinute} minutes left)`}</Typography>\n        )}\n      </div>\n      <ProgressBar\n        className={classNames('ndl-dropzone-loading-progress-bar', className)}\n        value={progressBarPrecentage}\n        size=\"large\"\n        htmlAttributes={htmlAttributes}\n        ref={ref}\n        style={style}\n        {...restProps}\n      />\n    </div>\n  );\n};\n\nconst Dropzone = Object.assign(DropzoneComponent, {\n  LoadingProgressBar: DropzoneLoadingProgressBarComponent,\n});\n\nexport { Dropzone };\n"]}

package/lib/esm/dropzone/stories/dropzone-csv-files.story.js

@@ -22,9 +22,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { Dropzone } from '@neo4j-ndl/react';
 const Component = () => {
     const onDrop = (files) => {
-        alert('attempted to upload ' +
-            files.length +
-            ' file(s). Check console logs for more info');
+        alert(`attempted to upload ${files.length} file(s). Check console logs for more info`);
     };
     return (_jsx(Dropzone, { supportedFilesDescription: "Supports: CSV", dropZoneOptions: {
             accept: { 'text/csv': ['.csv'] },

package/lib/esm/dropzone/stories/dropzone-csv-files.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropzone-csv-files.story.js","sourceRoot":"","sources":["../../../../src/dropzone/stories/dropzone-csv-files.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAG5C,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,MAAM,GAA8B,CAAC,KAAK,EAAE,EAAE;QAClD,KAAK,CACH,sBAAsB;YACpB,KAAK,CAAC,MAAM;YACZ,4CAA4C,CAC/C,CAAC;IACJ,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,QAAQ,IACP,yBAAyB,EAAC,eAAe,EACzC,eAAe,EAAE;YACf,MAAM,EAAE,EAAE,UAAU,EAAE,CAAC,MAAM,CAAC,EAAE;YAChC,MAAM;SACP,GACD,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,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 */\nimport { Dropzone } from '@neo4j-ndl/react';\nimport { type DropzoneOptions } from 'react-dropzone';\n\nconst Component = () => {\n  const onDrop: DropzoneOptions['onDrop'] = (files) => {\n    alert(\n      'attempted to upload ' +\n        files.length +\n        ' file(s). Check console logs for more info',\n    );\n  };\n\n  return (\n    <Dropzone\n      supportedFilesDescription=\"Supports: CSV\"\n      dropZoneOptions={{\n        accept: { 'text/csv': ['.csv'] },\n        onDrop,\n      }}\n    />\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"dropzone-csv-files.story.js","sourceRoot":"","sources":["../../../../src/dropzone/stories/dropzone-csv-files.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAG5C,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,MAAM,GAA8B,CAAC,KAAK,EAAE,EAAE;QAClD,KAAK,CACH,uBACE,KAAK,CAAC,MACR,4CAA4C,CAC7C,CAAC;IACJ,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,QAAQ,IACP,yBAAyB,EAAC,eAAe,EACzC,eAAe,EAAE;YACf,MAAM,EAAE,EAAE,UAAU,EAAE,CAAC,MAAM,CAAC,EAAE;YAChC,MAAM;SACP,GACD,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,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 */\nimport { Dropzone } from '@neo4j-ndl/react';\nimport { type DropzoneOptions } from 'react-dropzone';\n\nconst Component = () => {\n  const onDrop: DropzoneOptions['onDrop'] = (files) => {\n    alert(\n      `attempted to upload ${\n        files.length\n      } file(s). Check console logs for more info`,\n    );\n  };\n\n  return (\n    <Dropzone\n      supportedFilesDescription=\"Supports: CSV\"\n      dropZoneOptions={{\n        accept: { 'text/csv': ['.csv'] },\n        onDrop,\n      }}\n    />\n  );\n};\n\nexport default Component;\n"]}

package/lib/esm/dropzone/stories/dropzone-custom-extensions.story.js

@@ -22,9 +22,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { Dropzone } from '@neo4j-ndl/react';
 const Component = () => {
     const onDrop = (files) => {
-        alert('attempted to upload ' +
-            files.length +
-            ' file(s). Check console logs for more info');
+        alert(`attempted to upload ${files.length} file(s). Check console logs for more info`);
     };
     return (_jsx(Dropzone, { supportedFilesDescription: "Supports: .dump", acceptedFileExtensions: ['.dump'], dropZoneOptions: {
             onDrop,

package/lib/esm/dropzone/stories/dropzone-custom-extensions.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropzone-custom-extensions.story.js","sourceRoot":"","sources":["../../../../src/dropzone/stories/dropzone-custom-extensions.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAG5C,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,MAAM,GAA8B,CAAC,KAAK,EAAE,EAAE;QAClD,KAAK,CACH,sBAAsB;YACpB,KAAK,CAAC,MAAM;YACZ,4CAA4C,CAC/C,CAAC;IACJ,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,QAAQ,IACP,yBAAyB,EAAC,iBAAiB,EAC3C,sBAAsB,EAAE,CAAC,OAAO,CAAC,EACjC,eAAe,EAAE;YACf,MAAM;SACP,GACD,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,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 */\nimport { Dropzone } from '@neo4j-ndl/react';\nimport { type DropzoneOptions } from 'react-dropzone';\n\nconst Component = () => {\n  const onDrop: DropzoneOptions['onDrop'] = (files) => {\n    alert(\n      'attempted to upload ' +\n        files.length +\n        ' file(s). Check console logs for more info',\n    );\n  };\n\n  return (\n    <Dropzone\n      supportedFilesDescription=\"Supports: .dump\"\n      acceptedFileExtensions={['.dump']}\n      dropZoneOptions={{\n        onDrop,\n      }}\n    />\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"dropzone-custom-extensions.story.js","sourceRoot":"","sources":["../../../../src/dropzone/stories/dropzone-custom-extensions.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAG5C,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,MAAM,GAA8B,CAAC,KAAK,EAAE,EAAE;QAClD,KAAK,CACH,uBACE,KAAK,CAAC,MACR,4CAA4C,CAC7C,CAAC;IACJ,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,QAAQ,IACP,yBAAyB,EAAC,iBAAiB,EAC3C,sBAAsB,EAAE,CAAC,OAAO,CAAC,EACjC,eAAe,EAAE;YACf,MAAM;SACP,GACD,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,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 */\nimport { Dropzone } from '@neo4j-ndl/react';\nimport { type DropzoneOptions } from 'react-dropzone';\n\nconst Component = () => {\n  const onDrop: DropzoneOptions['onDrop'] = (files) => {\n    alert(\n      `attempted to upload ${\n        files.length\n      } file(s). Check console logs for more info`,\n    );\n  };\n\n  return (\n    <Dropzone\n      supportedFilesDescription=\"Supports: .dump\"\n      acceptedFileExtensions={['.dump']}\n      dropZoneOptions={{\n        onDrop,\n      }}\n    />\n  );\n};\n\nexport default Component;\n"]}

package/lib/esm/dropzone/stories/dropzone-default.story.js

@@ -22,9 +22,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { Dropzone } from '@neo4j-ndl/react';
 const Component = () => {
     const onDrop = (files) => {
-        alert('attempted to upload ' +
-            files.length +
-            ' file(s). Check console logs for more info');
+        alert(`attempted to upload ${files.length} file(s). Check console logs for more info`);
     };
     return (_jsx(Dropzone, { dropZoneOptions: {
             onDrop,

package/lib/esm/dropzone/stories/dropzone-default.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropzone-default.story.js","sourceRoot":"","sources":["../../../../src/dropzone/stories/dropzone-default.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAG5C,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,MAAM,GAA8B,CAAC,KAAK,EAAE,EAAE;QAClD,KAAK,CACH,sBAAsB;YACpB,KAAK,CAAC,MAAM;YACZ,4CAA4C,CAC/C,CAAC;IACJ,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,QAAQ,IACP,eAAe,EAAE;YACf,MAAM;SACP,GACD,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,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 */\nimport { Dropzone } from '@neo4j-ndl/react';\nimport { type DropzoneOptions } from 'react-dropzone';\n\nconst Component = () => {\n  const onDrop: DropzoneOptions['onDrop'] = (files) => {\n    alert(\n      'attempted to upload ' +\n        files.length +\n        ' file(s). Check console logs for more info',\n    );\n  };\n\n  return (\n    <Dropzone\n      dropZoneOptions={{\n        onDrop,\n      }}\n    />\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"dropzone-default.story.js","sourceRoot":"","sources":["../../../../src/dropzone/stories/dropzone-default.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAG5C,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,MAAM,GAA8B,CAAC,KAAK,EAAE,EAAE;QAClD,KAAK,CACH,uBACE,KAAK,CAAC,MACR,4CAA4C,CAC7C,CAAC;IACJ,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,QAAQ,IACP,eAAe,EAAE;YACf,MAAM;SACP,GACD,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,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 */\nimport { Dropzone } from '@neo4j-ndl/react';\nimport { type DropzoneOptions } from 'react-dropzone';\n\nconst Component = () => {\n  const onDrop: DropzoneOptions['onDrop'] = (files) => {\n    alert(\n      `attempted to upload ${\n        files.length\n      } file(s). Check console logs for more info`,\n    );\n  };\n\n  return (\n    <Dropzone\n      dropZoneOptions={{\n        onDrop,\n      }}\n    />\n  );\n};\n\nexport default Component;\n"]}

package/lib/esm/dropzone/stories/dropzone-disabled.story.js

@@ -22,9 +22,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { Dropzone } from '@neo4j-ndl/react';
 const Component = () => {
     const onDrop = (files) => {
-        alert('attempted to upload ' +
-            files.length +
-            ' file(s). Check console logs for more info');
+        alert(`attempted to upload ${files.length} file(s). Check console logs for more info`);
     };
     return (_jsx(Dropzone, { supportedFilesDescription: "Supports: CSV Files", dropZoneOptions: {
             accept: { 'text/csv': ['.csv'] },

package/lib/esm/dropzone/stories/dropzone-disabled.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropzone-disabled.story.js","sourceRoot":"","sources":["../../../../src/dropzone/stories/dropzone-disabled.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAG5C,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,MAAM,GAA8B,CAAC,KAAK,EAAE,EAAE;QAClD,KAAK,CACH,sBAAsB;YACpB,KAAK,CAAC,MAAM;YACZ,4CAA4C,CAC/C,CAAC;IACJ,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,QAAQ,IACP,yBAAyB,EAAC,qBAAqB,EAC/C,eAAe,EAAE;YACf,MAAM,EAAE,EAAE,UAAU,EAAE,CAAC,MAAM,CAAC,EAAE;YAChC,MAAM;YACN,QAAQ,EAAE,IAAI;SACf,GACD,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,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 */\nimport { Dropzone } from '@neo4j-ndl/react';\nimport { type DropzoneOptions } from 'react-dropzone';\n\nconst Component = () => {\n  const onDrop: DropzoneOptions['onDrop'] = (files) => {\n    alert(\n      'attempted to upload ' +\n        files.length +\n        ' file(s). Check console logs for more info',\n    );\n  };\n\n  return (\n    <Dropzone\n      supportedFilesDescription=\"Supports: CSV Files\"\n      dropZoneOptions={{\n        accept: { 'text/csv': ['.csv'] },\n        onDrop,\n        disabled: true,\n      }}\n    />\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"dropzone-disabled.story.js","sourceRoot":"","sources":["../../../../src/dropzone/stories/dropzone-disabled.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAG5C,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,MAAM,GAA8B,CAAC,KAAK,EAAE,EAAE;QAClD,KAAK,CACH,uBACE,KAAK,CAAC,MACR,4CAA4C,CAC7C,CAAC;IACJ,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,QAAQ,IACP,yBAAyB,EAAC,qBAAqB,EAC/C,eAAe,EAAE;YACf,MAAM,EAAE,EAAE,UAAU,EAAE,CAAC,MAAM,CAAC,EAAE;YAChC,MAAM;YACN,QAAQ,EAAE,IAAI;SACf,GACD,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,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 */\nimport { Dropzone } from '@neo4j-ndl/react';\nimport { type DropzoneOptions } from 'react-dropzone';\n\nconst Component = () => {\n  const onDrop: DropzoneOptions['onDrop'] = (files) => {\n    alert(\n      `attempted to upload ${\n        files.length\n      } file(s). Check console logs for more info`,\n    );\n  };\n\n  return (\n    <Dropzone\n      supportedFilesDescription=\"Supports: CSV Files\"\n      dropZoneOptions={{\n        accept: { 'text/csv': ['.csv'] },\n        onDrop,\n        disabled: true,\n      }}\n    />\n  );\n};\n\nexport default Component;\n"]}

package/lib/esm/flex/Flex.js

@@ -1,3 +1,14 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import { jsx as _jsx } from "react/jsx-runtime";
 /**
  *
@@ -25,7 +36,8 @@ import { getRadius, getSpacing } from '../_common/utils';
  * Flex is a general-purpose container that helps
  * lay out components with consistent spacing in a row or column.
  */
-export const Flex = ({ as, gap = '8', rowGap, columnGap, children, borderRadius, flexDirection = 'column', flexWrap = 'nowrap', alignItems, justifyContent, className, style, htmlAttributes, ref, }) => {
+export const Flex = (_a) => {
+    var { as, gap = '8', rowGap, columnGap, children, borderRadius, flexDirection = 'column', flexWrap = 'nowrap', alignItems, justifyContent, className, style, htmlAttributes, ref } = _a, restProps = __rest(_a, ["as", "gap", "rowGap", "columnGap", "children", "borderRadius", "flexDirection", "flexWrap", "alignItems", "justifyContent", "className", "style", "htmlAttributes", "ref"]);
     const Component = (as || 'div');
     // If gap is not provided,
     // and rowGap and columnGap are not provided,
@@ -43,6 +55,6 @@ export const Flex = ({ as, gap = '8', rowGap, columnGap, children, borderRadius,
         gap: gapFormatted,
         borderRadius: getRadius(borderRadius, 'borderRadius'),
     };
-    return (_jsx(Component, Object.assign({ ref: ref, className: className, style: Object.assign(Object.assign({}, additionalStyle), style) }, htmlAttributes, { children: children })));
+    return (_jsx(Component, Object.assign({ ref: ref, className: className, style: Object.assign(Object.assign({}, additionalStyle), style) }, restProps, htmlAttributes, { children: children })));
 };
 //# sourceMappingURL=Flex.js.map

package/lib/esm/flex/Flex.js.map

@@ -1 +1 @@
-{"version":3,"file":"Flex.js","sourceRoot":"","sources":["../../../src/flex/Flex.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AASzC,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAoDzD;;;GAGG;AACH,MAAM,CAAC,MAAM,IAAI,GAAG,CAAwC,EAC1D,EAAE,EACF,GAAG,GAAG,GAAG,EACT,MAAM,EACN,SAAS,EACT,QAAQ,EACR,YAAY,EACZ,aAAa,GAAG,QAAQ,EACxB,QAAQ,GAAG,QAAQ,EACnB,UAAU,EACV,cAAc,EACd,SAAS,EACT,KAAK,EACL,cAAc,EACd,GAAG,GACsC,EAAE,EAAE;IAC7C,MAAM,SAAS,GAAG,CAAC,EAAE,IAAI,KAAK,CAA8B,CAAC;IAE7D,0BAA0B;IAC1B,6CAA6C;IAC7C,8BAA8B;IAC9B,MAAM,KAAK,GAAG,UAAU,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC;IACrC,MAAM,QAAQ,GAAG,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IAC3D,MAAM,WAAW,GAAG,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IACpE,MAAM,YAAY,GAAG,GAAG,QAAQ,aAAR,QAAQ,cAAR,QAAQ,GAAI,KAAK,IAAI,WAAW,aAAX,WAAW,cAAX,WAAW,GAAI,KAAK,EAAE,CAAC;IAEpE,MAAM,eAAe,GAAwB;QAC3C,aAAa;QACb,UAAU;QACV,QAAQ;QACR,cAAc;QACd,OAAO,EAAE,MAAM;QACf,GAAG,EAAE,YAAY;QACjB,YAAY,EAAE,SAAS,CAAC,YAAY,EAAE,cAAc,CAAC;KACtD,CAAC;IAEF,OAAO,CACL,KAAC,SAAS,kBACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,SAAS,EACpB,KAAK,kCAAO,eAAe,GAAK,KAAK,KACjC,cAAc,cAEjB,QAAQ,IACC,CACb,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 */\n\nimport { tokens } from '@neo4j-ndl/base';\nimport type React from 'react';\n\nimport {\n  type PolymorphicCommonProps,\n  type Radius,\n  type ReactComponent,\n  type Spacing,\n} from '../_common/types';\nimport { getRadius, getSpacing } from '../_common/utils';\n\ntype AllowedFlexElements = 'div' | 'span' | 'ul' | 'ol' | 'li';\n\ntype BaseFlexProps = {\n  /**\n   * @default tokens.space['4']\n   */\n  gap?: Spacing;\n  /**\n   * @default undefined\n   */\n  rowGap?: Spacing;\n  /**\n   * @default undefined\n   */\n  columnGap?: Spacing;\n  /**\n   * @default undefined\n   */\n  borderRadius?: Radius;\n  /**\n   * Flex direction is set to column by default.\n   * The `row-reverse` and `column-reverse` values\n   * are skipped due to accessibility concerns.\n   * @see https://developer.mozilla.org/en-US/docs/Web/CSS/flex-direction#accessibility_concerns\n   *\n   * @default row\n   */\n  flexDirection?: Exclude<\n    React.CSSProperties['flexDirection'],\n    'row-reverse' | 'column-reverse'\n  >;\n  /**\n   * @see https://developer.mozilla.org/en-US/docs/Web/CSS/flex-wrap\n   * @default nowrap\n   */\n  flexWrap?: React.CSSProperties['flexWrap'];\n  /**\n   * @see https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content\n   * @default undefined\n   */\n  justifyContent?: React.CSSProperties['justifyContent'];\n  /**\n   * @see https://developer.mozilla.org/en-US/docs/Web/CSS/align-items\n   * @default undefined\n   */\n  alignItems?: React.CSSProperties['alignItems'];\n  children?: React.ReactNode;\n  style?: React.CSSProperties;\n};\n\n/**\n * Flex is a general-purpose container that helps\n * lay out components with consistent spacing in a row or column.\n */\nexport const Flex = <T extends AllowedFlexElements = 'div'>({\n  as,\n  gap = '8',\n  rowGap,\n  columnGap,\n  children,\n  borderRadius,\n  flexDirection = 'column',\n  flexWrap = 'nowrap',\n  alignItems,\n  justifyContent,\n  className,\n  style,\n  htmlAttributes,\n  ref,\n}: PolymorphicCommonProps<T, BaseFlexProps>) => {\n  const Component = (as || 'div') as unknown as ReactComponent;\n\n  // If gap is not provided,\n  // and rowGap and columnGap are not provided,\n  // then use the default value.\n  const gapPx = getSpacing(gap, 'gap');\n  const rowGapPx = rowGap ? tokens.space[rowGap] : undefined;\n  const columnGapPx = columnGap ? tokens.space[columnGap] : undefined;\n  const gapFormatted = `${rowGapPx ?? gapPx} ${columnGapPx ?? gapPx}`;\n\n  const additionalStyle: React.CSSProperties = {\n    flexDirection,\n    alignItems,\n    flexWrap,\n    justifyContent,\n    display: 'flex',\n    gap: gapFormatted,\n    borderRadius: getRadius(borderRadius, 'borderRadius'),\n  };\n\n  return (\n    <Component\n      ref={ref}\n      className={className}\n      style={{ ...additionalStyle, ...style }}\n      {...htmlAttributes}\n    >\n      {children}\n    </Component>\n  );\n};\n"]}
+{"version":3,"file":"Flex.js","sourceRoot":"","sources":["../../../src/flex/Flex.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AASzC,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAoDzD;;;GAGG;AACH,MAAM,CAAC,MAAM,IAAI,GAAG,CAAwC,EAgBjB,EAAE,EAAE;QAhBa,EAC1D,EAAE,EACF,GAAG,GAAG,GAAG,EACT,MAAM,EACN,SAAS,EACT,QAAQ,EACR,YAAY,EACZ,aAAa,GAAG,QAAQ,EACxB,QAAQ,GAAG,QAAQ,EACnB,UAAU,EACV,cAAc,EACd,SAAS,EACT,KAAK,EACL,cAAc,EACd,GAAG,OAEsC,EADtC,SAAS,cAf8C,4KAgB3D,CADa;IAEZ,MAAM,SAAS,GAAG,CAAC,EAAE,IAAI,KAAK,CAA8B,CAAC;IAE7D,0BAA0B;IAC1B,6CAA6C;IAC7C,8BAA8B;IAC9B,MAAM,KAAK,GAAG,UAAU,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC;IACrC,MAAM,QAAQ,GAAG,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IAC3D,MAAM,WAAW,GAAG,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IACpE,MAAM,YAAY,GAAG,GAAG,QAAQ,aAAR,QAAQ,cAAR,QAAQ,GAAI,KAAK,IAAI,WAAW,aAAX,WAAW,cAAX,WAAW,GAAI,KAAK,EAAE,CAAC;IAEpE,MAAM,eAAe,GAAwB;QAC3C,aAAa;QACb,UAAU;QACV,QAAQ;QACR,cAAc;QACd,OAAO,EAAE,MAAM;QACf,GAAG,EAAE,YAAY;QACjB,YAAY,EAAE,SAAS,CAAC,YAAY,EAAE,cAAc,CAAC;KACtD,CAAC;IAEF,OAAO,CACL,KAAC,SAAS,kBACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,SAAS,EACpB,KAAK,kCAAO,eAAe,GAAK,KAAK,KACjC,SAAS,EACT,cAAc,cAEjB,QAAQ,IACC,CACb,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 */\n\nimport { tokens } from '@neo4j-ndl/base';\nimport type React from 'react';\n\nimport {\n  type PolymorphicCommonProps,\n  type Radius,\n  type ReactComponent,\n  type Spacing,\n} from '../_common/types';\nimport { getRadius, getSpacing } from '../_common/utils';\n\ntype AllowedFlexElements = 'div' | 'span' | 'ul' | 'ol' | 'li';\n\ntype BaseFlexProps = {\n  /**\n   * @default tokens.space['4']\n   */\n  gap?: Spacing;\n  /**\n   * @default undefined\n   */\n  rowGap?: Spacing;\n  /**\n   * @default undefined\n   */\n  columnGap?: Spacing;\n  /**\n   * @default undefined\n   */\n  borderRadius?: Radius;\n  /**\n   * Flex direction is set to column by default.\n   * The `row-reverse` and `column-reverse` values\n   * are skipped due to accessibility concerns.\n   * @see https://developer.mozilla.org/en-US/docs/Web/CSS/flex-direction#accessibility_concerns\n   *\n   * @default row\n   */\n  flexDirection?: Exclude<\n    React.CSSProperties['flexDirection'],\n    'row-reverse' | 'column-reverse'\n  >;\n  /**\n   * @see https://developer.mozilla.org/en-US/docs/Web/CSS/flex-wrap\n   * @default nowrap\n   */\n  flexWrap?: React.CSSProperties['flexWrap'];\n  /**\n   * @see https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content\n   * @default undefined\n   */\n  justifyContent?: React.CSSProperties['justifyContent'];\n  /**\n   * @see https://developer.mozilla.org/en-US/docs/Web/CSS/align-items\n   * @default undefined\n   */\n  alignItems?: React.CSSProperties['alignItems'];\n  children?: React.ReactNode;\n  style?: React.CSSProperties;\n};\n\n/**\n * Flex is a general-purpose container that helps\n * lay out components with consistent spacing in a row or column.\n */\nexport const Flex = <T extends AllowedFlexElements = 'div'>({\n  as,\n  gap = '8',\n  rowGap,\n  columnGap,\n  children,\n  borderRadius,\n  flexDirection = 'column',\n  flexWrap = 'nowrap',\n  alignItems,\n  justifyContent,\n  className,\n  style,\n  htmlAttributes,\n  ref,\n  ...restProps\n}: PolymorphicCommonProps<T, BaseFlexProps>) => {\n  const Component = (as || 'div') as unknown as ReactComponent;\n\n  // If gap is not provided,\n  // and rowGap and columnGap are not provided,\n  // then use the default value.\n  const gapPx = getSpacing(gap, 'gap');\n  const rowGapPx = rowGap ? tokens.space[rowGap] : undefined;\n  const columnGapPx = columnGap ? tokens.space[columnGap] : undefined;\n  const gapFormatted = `${rowGapPx ?? gapPx} ${columnGapPx ?? gapPx}`;\n\n  const additionalStyle: React.CSSProperties = {\n    flexDirection,\n    alignItems,\n    flexWrap,\n    justifyContent,\n    display: 'flex',\n    gap: gapFormatted,\n    borderRadius: getRadius(borderRadius, 'borderRadius'),\n  };\n\n  return (\n    <Component\n      ref={ref}\n      className={className}\n      style={{ ...additionalStyle, ...style }}\n      {...restProps}\n      {...htmlAttributes}\n    >\n      {children}\n    </Component>\n  );\n};\n"]}

package/lib/esm/graph-label/GraphLabel.js

@@ -1,3 +1,14 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /**
  *
@@ -55,12 +66,14 @@ const HorizontalLines = ({ height = 24 }) => {
  *
  */
 const MAX_WIDTH = 200;
-export const GraphLabel = ({ type = 'node', color, isDisabled = false, isSelected = false, as, onClick, className, style, children, htmlAttributes, isFluid = false, size = 'large', ref, }) => {
+export const GraphLabel = (_a) => {
+    var { type = 'node', color, isDisabled = false, isSelected = false, as, onClick, className, style, children, htmlAttributes, isFluid = false, size = 'large', ref } = _a, restProps = __rest(_a, ["type", "color", "isDisabled", "isSelected", "as", "onClick", "className", "style", "children", "htmlAttributes", "isFluid", "size", "ref"]);
     const [isHover, setIsHover] = useState(false);
     const handleMouseEnter = (event) => {
         setIsHover(true);
-        if (htmlAttributes && htmlAttributes.onMouseEnter !== undefined)
+        if (htmlAttributes && htmlAttributes.onMouseEnter !== undefined) {
             htmlAttributes.onMouseEnter(event);
+        }
     };
     const handleMouseLeave = (event) => {
         var _a;
@@ -101,8 +114,9 @@ export const GraphLabel = ({ type = 'node', color, isDisabled = false, isSelecte
     const hoverColor = useMemo(() => getHoverColor(backgroundColor ? backgroundColor : tokens.palette.lemon[40]), [backgroundColor]);
     const textColor = useMemo(() => getTextColorFromBackground(backgroundColor ? backgroundColor : tokens.palette.lemon[40]), [backgroundColor]);
     const disabledTextColor = useMemo(() => getDisabledTextColor(backgroundColor ? backgroundColor : tokens.palette.lemon[40]), [backgroundColor]);
-    if (isHover && !isDisabled)
+    if (isHover && !isDisabled) {
         backgroundColor = hoverColor;
+    }
     const commonClasses = classNames('ndl-graph-label', className, {
         'ndl-disabled': isDisabled,
         'ndl-interactable': isButton,
@@ -128,7 +142,7 @@ export const GraphLabel = ({ type = 'node', color, isDisabled = false, isSelecte
             onClick: handleClick,
             onMouseEnter: handleMouseEnter,
             onMouseLeave: handleMouseLeave,
-        }), { ref: ref }, htmlAttributes, { children: [type === 'relationshipLeft' || type === 'relationship' ? (_jsx(HexagonEnd, { direction: "left", color: backgroundColor, height: height })) : (_jsx(SquareEnd, { direction: "left", color: backgroundColor, height: height })), _jsxs("div", { className: "ndl-relationship-label-container", style: {
+        }), { ref: ref }, restProps, htmlAttributes, { children: [type === 'relationshipLeft' || type === 'relationship' ? (_jsx(HexagonEnd, { direction: "left", color: backgroundColor, height: height })) : (_jsx(SquareEnd, { direction: "left", color: backgroundColor, height: height })), _jsxs("div", { className: "ndl-relationship-label-container", style: {
                         backgroundColor: backgroundColor,
                     }, children: [_jsx("div", { className: "ndl-relationship-label-content", children: children }), _jsx(HorizontalLines, { height: height })] }), type === 'relationshipRight' || type === 'relationship' ? (_jsx(HexagonEnd, { direction: "right", color: backgroundColor, height: height })) : (_jsx(SquareEnd, { direction: "right", color: backgroundColor, height: height }))] })));
     }

package/lib/esm/graph-label/GraphLabel.js.map

@@ -1 +1 @@
-{"version":3,"file":"GraphLabel.js","sourceRoot":"","sources":["../../../src/graph-label/GraphLabel.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 { tokens } from '@neo4j-ndl/base';\nimport classNames from 'classnames';\nimport type React from 'react';\nimport { useMemo, useState } from 'react';\n\nimport {\n  type HtmlAttributes,\n  type PolymorphicCommonProps,\n} from '../_common/types';\nimport {\n  getDisabledTextColor,\n  getHoverColor,\n  getTextColorFromBackground,\n} from './color';\n\n/**\n *\n *\n * Types\n *\n *\n */\n\ntype GraphLabelProps = {\n  /**  The type of label */\n  type:\n    | 'node'\n    | 'relationship'\n    | 'propertyKey'\n    | 'relationshipLeft'\n    | 'relationshipRight';\n  /** Callback function that is called when the label is clicked */\n  onClick?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;\n  /** Additional styles to apply to the label */\n  style?: React.CSSProperties;\n  /** Content displayed inside the label */\n  children?: React.ReactNode;\n  /** The background color of the label */\n  color?: string;\n  /** Whether the label is disabled */\n  isDisabled?: boolean;\n  /** Additional class names */\n  className?: string;\n  /** Whether the label is selected */\n  isSelected?: boolean;\n  /** Whether the label should expand to full available width */\n  isFluid?: boolean;\n  /** The size of the label */\n  size?: 'small' | 'large';\n};\n\ntype HexagonEndProps = {\n  /** The direction of the hexagon end */\n  direction: 'left' | 'right';\n  /** The color of the hexagon end */\n  color?: string;\n  /** The height of the hexagon end in pixels */\n  height?: number;\n  /** HTML attributes */\n  htmlAttributes?: HtmlAttributes<'div'>;\n};\n/**\n *\n *\n * Helpers\n *\n *\n */\n\nconst HexagonEnd = ({\n  direction = 'left',\n  color,\n  htmlAttributes,\n  height = 24,\n}: HexagonEndProps) => {\n  const classes = classNames('ndl-hexagon-end', {\n    'ndl-left': direction === 'left',\n    'ndl-right': direction === 'right',\n  });\n\n  return (\n    <div className={classes} {...htmlAttributes}>\n      <svg\n        className=\"ndl-hexagon-end-inner\"\n        width=\"9\"\n        height={height}\n        viewBox=\"0 0 9 24\"\n        preserveAspectRatio=\"none\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        {/* triangle */}\n        <path\n          style={{ fill: color }}\n          fillRule=\"evenodd\"\n          clipRule=\"evenodd\"\n          d=\"M5.73024 1.03676C6.08165 0.397331 6.75338 0 7.48301 0H9V24H7.483C6.75338 24 6.08165 23.6027 5.73024 22.9632L0.315027 13.1094C-0.105009 12.4376 -0.105009 11.5624 0.315026 10.8906L5.73024 1.03676Z\"\n        />\n      </svg>\n      <svg\n        className=\"ndl-hexagon-end-active\"\n        width=\"13\"\n        height={height + 6}\n        viewBox=\"0 0 13 30\"\n        preserveAspectRatio=\"none\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <path\n          fillRule=\"evenodd\"\n          clipRule=\"evenodd\"\n          d=\"M10.075 2C9.12474 2 8.24318 2.54521 7.74867 3.43873L2.21419 13.4387C1.68353 14.3976 1.68353 15.6024 2.21419 16.5613L7.74867 26.5613C8.24318 27.4548 9.12474 28 10.075 28H13V30H10.075C8.49126 30 7.022 29.0913 6.1978 27.6021L0.663324 17.6021C-0.221109 16.0041 -0.221108 13.9959 0.663325 12.3979L6.1978 2.39789C7.022 0.90869 8.49126 0 10.075 0H13V2H10.075Z\"\n        />\n      </svg>\n    </div>\n  );\n};\n\ntype SquareEndProps = {\n  /** The direction of the square end (where it's rounded and has the active state) */\n  direction: 'left' | 'right';\n  /** The color of the square end */\n  color: string;\n  /** The height of the square end in pixels */\n  height: number;\n  /** HTML attributes */\n  htmlAttributes?: HtmlAttributes<'div'>;\n};\n\nconst SquareEnd = ({\n  direction = 'left',\n  color,\n  height = 24,\n  htmlAttributes,\n}: SquareEndProps) => {\n  const classes = classNames('ndl-square-end', {\n    'ndl-left': direction === 'left',\n    'ndl-right': direction === 'right',\n  });\n\n  return (\n    <div className={classes} {...htmlAttributes}>\n      <div\n        className=\"ndl-square-end-inner\"\n        style={{ backgroundColor: color }}\n      />\n      <svg\n        className=\"ndl-square-end-active\"\n        width=\"7\"\n        height={height + 6}\n        preserveAspectRatio=\"none\"\n        viewBox=\"0 0 7 30\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <path\n          fillRule=\"evenodd\"\n          clipRule=\"evenodd\"\n          d=\"M 3.8774 2 C 3.2697 2 2.7917 2.248 2.3967 2.6605 C 1.928 3.1498 1.7993 3.8555 1.7993 4.5331 V 13.8775 V 25.4669 C 1.7993 26.1445 1.928 26.8502 2.3967 27.3395 C 2.7917 27.752 3.2697 28 3.8774 28 H 7 V 30 H 3.8774 C 2.6211 30 1.4369 29.4282 0.5895 28.4485 C 0.1462 27.936 0.0002 27.2467 0.0002 26.5691 L -0.0002 13.8775 L 0.0002 3.4309 C 0.0002 2.7533 0.1462 2.064 0.5895 1.5515 C 1.4368 0.5718 2.6211 0 3.8774 0 H 7 V 2 H 3.8774 Z\"\n        />\n      </svg>\n    </div>\n  );\n};\n\ntype HorizontalLinesProps = {\n  height?: number;\n};\n\nconst HorizontalLines = ({ height = 24 }: HorizontalLinesProps) => {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      height={height + 6}\n      preserveAspectRatio=\"none\"\n      viewBox=\"0 0 37 30\"\n      fill=\"none\"\n      className=\"ndl-relationship-label-lines\"\n    >\n      <path\n        fillRule=\"evenodd\"\n        clipRule=\"evenodd\"\n        d=\"M 37 2 H 0 V 0 H 37 V 2 Z\"\n      />\n      <path\n        fillRule=\"evenodd\"\n        clipRule=\"evenodd\"\n        d=\"M 37 30 H 0 V 28 H 37 V 30 Z\"\n      />\n    </svg>\n  );\n};\n\n/**\n *\n *\n * GraphLabel Component\n *\n *\n */\n\nconst MAX_WIDTH = 200;\n\nexport const GraphLabel = <T extends React.ElementType = 'button'>({\n  type = 'node',\n  color,\n  isDisabled = false,\n  isSelected = false,\n  as,\n  onClick,\n  className,\n  style,\n  children,\n  htmlAttributes,\n  isFluid = false,\n  size = 'large',\n  ref,\n}: PolymorphicCommonProps<T, GraphLabelProps>) => {\n  const [isHover, setIsHover] = useState(false);\n\n  const handleMouseEnter = (\n    event: React.MouseEvent<HTMLButtonElement, MouseEvent>,\n  ) => {\n    setIsHover(true);\n\n    if (htmlAttributes && htmlAttributes.onMouseEnter !== undefined)\n      htmlAttributes.onMouseEnter(event);\n  };\n\n  const handleMouseLeave = (\n    event: React.MouseEvent<HTMLButtonElement, MouseEvent>,\n  ) => {\n    setIsHover(false);\n\n    htmlAttributes?.onMouseLeave?.(event);\n  };\n\n  const Component: React.ElementType = as ?? 'button';\n  const isButton = Component === 'button';\n\n  const handleClick = (\n    event: React.MouseEvent<HTMLButtonElement, MouseEvent>,\n  ) => {\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    if (isDisabled) {\n      event.preventDefault();\n      event.stopPropagation();\n      return;\n    }\n\n    if (onClick) {\n      onClick(event);\n    }\n  };\n\n  let backgroundColor = useMemo(() => {\n    if (color === undefined) {\n      switch (type) {\n        case 'node':\n          return tokens.graph['1'];\n        case 'relationship':\n        case 'relationshipLeft':\n        case 'relationshipRight':\n          return tokens.theme.light.color.neutral.bg.strong;\n        default:\n          return tokens.theme.light.color.neutral.bg.strongest;\n      }\n    }\n    return color;\n  }, [color, type]);\n\n  const hoverColor = useMemo(\n    () =>\n      getHoverColor(\n        backgroundColor ? backgroundColor : tokens.palette.lemon[40],\n      ),\n    [backgroundColor],\n  );\n  const textColor = useMemo(\n    () =>\n      getTextColorFromBackground(\n        backgroundColor ? backgroundColor : tokens.palette.lemon[40],\n      ),\n    [backgroundColor],\n  );\n  const disabledTextColor = useMemo(\n    () =>\n      getDisabledTextColor(\n        backgroundColor ? backgroundColor : tokens.palette.lemon[40],\n      ),\n    [backgroundColor],\n  );\n\n  if (isHover && !isDisabled) backgroundColor = hoverColor;\n\n  const commonClasses = classNames('ndl-graph-label', className, {\n    'ndl-disabled': isDisabled,\n    'ndl-interactable': isButton,\n    'ndl-selected': isSelected,\n    'ndl-small': size === 'small',\n  });\n\n  if (type === 'node') {\n    const classes = classNames('ndl-node-label', commonClasses);\n\n    return (\n      <Component\n        className={classes}\n        ref={ref}\n        style={{\n          backgroundColor: backgroundColor,\n          color: isDisabled ? disabledTextColor : textColor,\n          maxWidth: isFluid ? '100%' : MAX_WIDTH,\n          ...style,\n        }}\n        {...(isButton && {\n          disabled: isDisabled,\n          onClick: handleClick,\n          onMouseEnter: handleMouseEnter,\n          onMouseLeave: handleMouseLeave,\n        })}\n        {...htmlAttributes}\n      >\n        <div className=\"ndl-node-label-content\">{children}</div>\n      </Component>\n    );\n  } else if (\n    type === 'relationship' ||\n    type === 'relationshipLeft' ||\n    type === 'relationshipRight'\n  ) {\n    const classes = classNames('ndl-relationship-label', commonClasses);\n    const height = size === 'small' ? 20 : 24;\n\n    return (\n      <Component\n        style={{\n          maxWidth: isFluid ? '100%' : MAX_WIDTH,\n          ...style,\n          color: isDisabled ? disabledTextColor : textColor,\n        }}\n        className={classes}\n        {...(isButton && {\n          disabled: isDisabled,\n          onClick: handleClick,\n          onMouseEnter: handleMouseEnter,\n          onMouseLeave: handleMouseLeave,\n        })}\n        ref={ref}\n        {...htmlAttributes}\n      >\n        {type === 'relationshipLeft' || type === 'relationship' ? (\n          <HexagonEnd\n            direction=\"left\"\n            color={backgroundColor}\n            height={height}\n          />\n        ) : (\n          <SquareEnd direction=\"left\" color={backgroundColor} height={height} />\n        )}\n        <div\n          className=\"ndl-relationship-label-container\"\n          style={{\n            backgroundColor: backgroundColor,\n          }}\n        >\n          <div className=\"ndl-relationship-label-content\">{children}</div>\n          <HorizontalLines height={height} />\n        </div>\n        {type === 'relationshipRight' || type === 'relationship' ? (\n          <HexagonEnd\n            direction=\"right\"\n            color={backgroundColor}\n            height={height}\n          />\n        ) : (\n          <SquareEnd\n            direction=\"right\"\n            color={backgroundColor}\n            height={height}\n          />\n        )}\n      </Component>\n    );\n  } else {\n    const classes = classNames('ndl-property-key-label', commonClasses);\n\n    return (\n      <Component\n        style={{\n          backgroundColor: backgroundColor,\n          color: isDisabled ? disabledTextColor : textColor,\n          maxWidth: isFluid ? '100%' : MAX_WIDTH,\n          ...style,\n        }}\n        className={classes}\n        onClick={handleClick}\n        onMouseEnter={handleMouseEnter}\n        onMouseLeave={handleMouseLeave}\n        ref={ref}\n        {...htmlAttributes}\n      >\n        <div className=\"ndl-property-key-label-content\">{children}</div>\n      </Component>\n    );\n  }\n};\n"]}
+{"version":3,"file":"GraphLabel.js","sourceRoot":"","sources":["../../../src/graph-label/GraphLabel.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 { tokens } from '@neo4j-ndl/base';\nimport classNames from 'classnames';\nimport type React from 'react';\nimport { useMemo, useState } from 'react';\n\nimport {\n  type HtmlAttributes,\n  type PolymorphicCommonProps,\n} from '../_common/types';\nimport {\n  getDisabledTextColor,\n  getHoverColor,\n  getTextColorFromBackground,\n} from './color';\n\n/**\n *\n *\n * Types\n *\n *\n */\n\ntype GraphLabelProps = {\n  /**  The type of label */\n  type:\n    | 'node'\n    | 'relationship'\n    | 'propertyKey'\n    | 'relationshipLeft'\n    | 'relationshipRight';\n  /** Callback function that is called when the label is clicked */\n  onClick?: (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;\n  /** Additional styles to apply to the label */\n  style?: React.CSSProperties;\n  /** Content displayed inside the label */\n  children?: React.ReactNode;\n  /** The background color of the label */\n  color?: string;\n  /** Whether the label is disabled */\n  isDisabled?: boolean;\n  /** Additional class names */\n  className?: string;\n  /** Whether the label is selected */\n  isSelected?: boolean;\n  /** Whether the label should expand to full available width */\n  isFluid?: boolean;\n  /** The size of the label */\n  size?: 'small' | 'large';\n};\n\ntype HexagonEndProps = {\n  /** The direction of the hexagon end */\n  direction: 'left' | 'right';\n  /** The color of the hexagon end */\n  color?: string;\n  /** The height of the hexagon end in pixels */\n  height?: number;\n  /** HTML attributes */\n  htmlAttributes?: HtmlAttributes<'div'>;\n};\n/**\n *\n *\n * Helpers\n *\n *\n */\n\nconst HexagonEnd = ({\n  direction = 'left',\n  color,\n  htmlAttributes,\n  height = 24,\n}: HexagonEndProps) => {\n  const classes = classNames('ndl-hexagon-end', {\n    'ndl-left': direction === 'left',\n    'ndl-right': direction === 'right',\n  });\n\n  return (\n    <div className={classes} {...htmlAttributes}>\n      <svg\n        className=\"ndl-hexagon-end-inner\"\n        width=\"9\"\n        height={height}\n        viewBox=\"0 0 9 24\"\n        preserveAspectRatio=\"none\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        {/* triangle */}\n        <path\n          style={{ fill: color }}\n          fillRule=\"evenodd\"\n          clipRule=\"evenodd\"\n          d=\"M5.73024 1.03676C6.08165 0.397331 6.75338 0 7.48301 0H9V24H7.483C6.75338 24 6.08165 23.6027 5.73024 22.9632L0.315027 13.1094C-0.105009 12.4376 -0.105009 11.5624 0.315026 10.8906L5.73024 1.03676Z\"\n        />\n      </svg>\n      <svg\n        className=\"ndl-hexagon-end-active\"\n        width=\"13\"\n        height={height + 6}\n        viewBox=\"0 0 13 30\"\n        preserveAspectRatio=\"none\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <path\n          fillRule=\"evenodd\"\n          clipRule=\"evenodd\"\n          d=\"M10.075 2C9.12474 2 8.24318 2.54521 7.74867 3.43873L2.21419 13.4387C1.68353 14.3976 1.68353 15.6024 2.21419 16.5613L7.74867 26.5613C8.24318 27.4548 9.12474 28 10.075 28H13V30H10.075C8.49126 30 7.022 29.0913 6.1978 27.6021L0.663324 17.6021C-0.221109 16.0041 -0.221108 13.9959 0.663325 12.3979L6.1978 2.39789C7.022 0.90869 8.49126 0 10.075 0H13V2H10.075Z\"\n        />\n      </svg>\n    </div>\n  );\n};\n\ntype SquareEndProps = {\n  /** The direction of the square end (where it's rounded and has the active state) */\n  direction: 'left' | 'right';\n  /** The color of the square end */\n  color: string;\n  /** The height of the square end in pixels */\n  height: number;\n  /** HTML attributes */\n  htmlAttributes?: HtmlAttributes<'div'>;\n};\n\nconst SquareEnd = ({\n  direction = 'left',\n  color,\n  height = 24,\n  htmlAttributes,\n}: SquareEndProps) => {\n  const classes = classNames('ndl-square-end', {\n    'ndl-left': direction === 'left',\n    'ndl-right': direction === 'right',\n  });\n\n  return (\n    <div className={classes} {...htmlAttributes}>\n      <div\n        className=\"ndl-square-end-inner\"\n        style={{ backgroundColor: color }}\n      />\n      <svg\n        className=\"ndl-square-end-active\"\n        width=\"7\"\n        height={height + 6}\n        preserveAspectRatio=\"none\"\n        viewBox=\"0 0 7 30\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <path\n          fillRule=\"evenodd\"\n          clipRule=\"evenodd\"\n          d=\"M 3.8774 2 C 3.2697 2 2.7917 2.248 2.3967 2.6605 C 1.928 3.1498 1.7993 3.8555 1.7993 4.5331 V 13.8775 V 25.4669 C 1.7993 26.1445 1.928 26.8502 2.3967 27.3395 C 2.7917 27.752 3.2697 28 3.8774 28 H 7 V 30 H 3.8774 C 2.6211 30 1.4369 29.4282 0.5895 28.4485 C 0.1462 27.936 0.0002 27.2467 0.0002 26.5691 L -0.0002 13.8775 L 0.0002 3.4309 C 0.0002 2.7533 0.1462 2.064 0.5895 1.5515 C 1.4368 0.5718 2.6211 0 3.8774 0 H 7 V 2 H 3.8774 Z\"\n        />\n      </svg>\n    </div>\n  );\n};\n\ntype HorizontalLinesProps = {\n  height?: number;\n};\n\nconst HorizontalLines = ({ height = 24 }: HorizontalLinesProps) => {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      height={height + 6}\n      preserveAspectRatio=\"none\"\n      viewBox=\"0 0 37 30\"\n      fill=\"none\"\n      className=\"ndl-relationship-label-lines\"\n    >\n      <path\n        fillRule=\"evenodd\"\n        clipRule=\"evenodd\"\n        d=\"M 37 2 H 0 V 0 H 37 V 2 Z\"\n      />\n      <path\n        fillRule=\"evenodd\"\n        clipRule=\"evenodd\"\n        d=\"M 37 30 H 0 V 28 H 37 V 30 Z\"\n      />\n    </svg>\n  );\n};\n\n/**\n *\n *\n * GraphLabel Component\n *\n *\n */\n\nconst MAX_WIDTH = 200;\n\nexport const GraphLabel = <T extends React.ElementType = 'button'>({\n  type = 'node',\n  color,\n  isDisabled = false,\n  isSelected = false,\n  as,\n  onClick,\n  className,\n  style,\n  children,\n  htmlAttributes,\n  isFluid = false,\n  size = 'large',\n  ref,\n  ...restProps\n}: PolymorphicCommonProps<T, GraphLabelProps>) => {\n  const [isHover, setIsHover] = useState(false);\n\n  const handleMouseEnter = (\n    event: React.MouseEvent<HTMLButtonElement, MouseEvent>,\n  ) => {\n    setIsHover(true);\n\n    if (htmlAttributes && htmlAttributes.onMouseEnter !== undefined) {\n      htmlAttributes.onMouseEnter(event);\n    }\n  };\n\n  const handleMouseLeave = (\n    event: React.MouseEvent<HTMLButtonElement, MouseEvent>,\n  ) => {\n    setIsHover(false);\n\n    htmlAttributes?.onMouseLeave?.(event);\n  };\n\n  const Component: React.ElementType = as ?? 'button';\n  const isButton = Component === 'button';\n\n  const handleClick = (\n    event: React.MouseEvent<HTMLButtonElement, MouseEvent>,\n  ) => {\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    if (isDisabled) {\n      event.preventDefault();\n      event.stopPropagation();\n      return;\n    }\n\n    if (onClick) {\n      onClick(event);\n    }\n  };\n\n  let backgroundColor = useMemo(() => {\n    if (color === undefined) {\n      switch (type) {\n        case 'node':\n          return tokens.graph['1'];\n        case 'relationship':\n        case 'relationshipLeft':\n        case 'relationshipRight':\n          return tokens.theme.light.color.neutral.bg.strong;\n        default:\n          return tokens.theme.light.color.neutral.bg.strongest;\n      }\n    }\n    return color;\n  }, [color, type]);\n\n  const hoverColor = useMemo(\n    () =>\n      getHoverColor(\n        backgroundColor ? backgroundColor : tokens.palette.lemon[40],\n      ),\n    [backgroundColor],\n  );\n  const textColor = useMemo(\n    () =>\n      getTextColorFromBackground(\n        backgroundColor ? backgroundColor : tokens.palette.lemon[40],\n      ),\n    [backgroundColor],\n  );\n  const disabledTextColor = useMemo(\n    () =>\n      getDisabledTextColor(\n        backgroundColor ? backgroundColor : tokens.palette.lemon[40],\n      ),\n    [backgroundColor],\n  );\n\n  if (isHover && !isDisabled) {\n    backgroundColor = hoverColor;\n  }\n\n  const commonClasses = classNames('ndl-graph-label', className, {\n    'ndl-disabled': isDisabled,\n    'ndl-interactable': isButton,\n    'ndl-selected': isSelected,\n    'ndl-small': size === 'small',\n  });\n\n  if (type === 'node') {\n    const classes = classNames('ndl-node-label', commonClasses);\n\n    return (\n      <Component\n        className={classes}\n        ref={ref}\n        style={{\n          backgroundColor: backgroundColor,\n          color: isDisabled ? disabledTextColor : textColor,\n          maxWidth: isFluid ? '100%' : MAX_WIDTH,\n          ...style,\n        }}\n        {...(isButton && {\n          disabled: isDisabled,\n          onClick: handleClick,\n          onMouseEnter: handleMouseEnter,\n          onMouseLeave: handleMouseLeave,\n        })}\n        {...htmlAttributes}\n      >\n        <div className=\"ndl-node-label-content\">{children}</div>\n      </Component>\n    );\n  } else if (\n    type === 'relationship' ||\n    type === 'relationshipLeft' ||\n    type === 'relationshipRight'\n  ) {\n    const classes = classNames('ndl-relationship-label', commonClasses);\n    const height = size === 'small' ? 20 : 24;\n\n    return (\n      <Component\n        style={{\n          maxWidth: isFluid ? '100%' : MAX_WIDTH,\n          ...style,\n          color: isDisabled ? disabledTextColor : textColor,\n        }}\n        className={classes}\n        {...(isButton && {\n          disabled: isDisabled,\n          onClick: handleClick,\n          onMouseEnter: handleMouseEnter,\n          onMouseLeave: handleMouseLeave,\n        })}\n        ref={ref}\n        {...restProps}\n        {...htmlAttributes}\n      >\n        {type === 'relationshipLeft' || type === 'relationship' ? (\n          <HexagonEnd\n            direction=\"left\"\n            color={backgroundColor}\n            height={height}\n          />\n        ) : (\n          <SquareEnd direction=\"left\" color={backgroundColor} height={height} />\n        )}\n        <div\n          className=\"ndl-relationship-label-container\"\n          style={{\n            backgroundColor: backgroundColor,\n          }}\n        >\n          <div className=\"ndl-relationship-label-content\">{children}</div>\n          <HorizontalLines height={height} />\n        </div>\n        {type === 'relationshipRight' || type === 'relationship' ? (\n          <HexagonEnd\n            direction=\"right\"\n            color={backgroundColor}\n            height={height}\n          />\n        ) : (\n          <SquareEnd\n            direction=\"right\"\n            color={backgroundColor}\n            height={height}\n          />\n        )}\n      </Component>\n    );\n  } else {\n    const classes = classNames('ndl-property-key-label', commonClasses);\n\n    return (\n      <Component\n        style={{\n          backgroundColor: backgroundColor,\n          color: isDisabled ? disabledTextColor : textColor,\n          maxWidth: isFluid ? '100%' : MAX_WIDTH,\n          ...style,\n        }}\n        className={classes}\n        onClick={handleClick}\n        onMouseEnter={handleMouseEnter}\n        onMouseLeave={handleMouseLeave}\n        ref={ref}\n        {...htmlAttributes}\n      >\n        <div className=\"ndl-property-key-label-content\">{children}</div>\n      </Component>\n    );\n  }\n};\n"]}

package/lib/esm/icon-button/stories/icon-button.stories.js

@@ -19,7 +19,7 @@
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 
-import { IconButton } from '../';
+import { IconButton } from '..';
 import { IconButtonActive, IconButtonActiveSrc, IconButtonDefault, IconButtonDefaultSrc, IconButtonDisabled, IconButtonDisabledSrc, IconButtonFloating, IconButtonFloatingSrc, IconButtonLoading, IconButtonLoadingSrc, IconButtonSizes, IconButtonSizesSrc, IconButtonTone, IconButtonToneSrc, } from '.';
 const componentMeta = {
     component: IconButton,