@neo4j-ndl/react 4.3.6 → 4.4.1

package/lib/cjs/dropdown-button/stories/dropdown-button.stories.js

@@ -26,94 +26,94 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const index_1 = require("../../index");
 const _1 = require(".");
 const componentMeta = {
-    title: 'Components/DropdownButton',
-    id: 'components-buttons-dropdown-button',
     component: index_1.DropdownButton,
-    tags: ['docsPage'],
-    parameters: {
-        controls: { disable: true },
-    },
     decorators: [
         (Story) => ((0, jsx_runtime_1.jsx)("div", { className: "n-flex n-justify-center", children: (0, jsx_runtime_1.jsx)(Story, {}) })),
     ],
+    id: 'components-buttons-dropdown-button',
+    parameters: {
+        controls: { disable: true },
+    },
+    tags: ['docsPage'],
+    title: 'Components/DropdownButton',
 };
 exports.default = componentMeta;
 exports.Default = {
     args: {},
-    render: _1.DropdownButtonDefault,
     parameters: {
         docs: {
             source: {
+                code: _1.DropdownButtonDefaultSource,
                 language: 'tsx',
                 type: 'code',
-                code: _1.DropdownButtonDefaultSource,
             },
         },
     },
+    render: _1.DropdownButtonDefault,
 };
 exports.WithAvatar = {
     args: {},
-    render: _1.DropdownButtonWithAvatar,
     parameters: {
         docs: {
             source: {
+                code: _1.DropdownButtonWithAvatarSource,
                 language: 'tsx',
                 type: 'code',
-                code: _1.DropdownButtonWithAvatarSource,
             },
         },
     },
+    render: _1.DropdownButtonWithAvatar,
 };
 exports.WithStatusIndicator = {
     args: {},
-    render: _1.DropdownButtonWithStatusIndicator,
     parameters: {
         docs: {
             source: {
+                code: _1.DropdownButtonWithStatusIndicatorSource,
                 language: 'tsx',
                 type: 'code',
-                code: _1.DropdownButtonWithStatusIndicatorSource,
             },
         },
     },
+    render: _1.DropdownButtonWithStatusIndicator,
 };
 exports.Disabled = {
     args: {},
-    render: _1.DropdownButtonDisabled,
     parameters: {
         docs: {
             source: {
+                code: _1.DropdownButtonDisabledSource,
                 language: 'tsx',
                 type: 'code',
-                code: _1.DropdownButtonDisabledSource,
             },
         },
     },
+    render: _1.DropdownButtonDisabled,
 };
 exports.Floating = {
     args: {},
-    render: _1.DropdownButtonFloating,
     parameters: {
         docs: {
             source: {
+                code: _1.DropdownButtonFloatingSource,
                 language: 'tsx',
                 type: 'code',
-                code: _1.DropdownButtonFloatingSource,
             },
         },
     },
+    render: _1.DropdownButtonFloating,
 };
 exports.WithMenu = {
     args: {},
-    render: _1.DropdownButtonWithMenu,
     parameters: {
         docs: {
             source: {
+                code: _1.DropdownButtonWithMenuSource,
                 language: 'tsx',
                 type: 'code',
-                code: _1.DropdownButtonWithMenuSource,
             },
         },
     },
+    render: _1.DropdownButtonWithMenu,
 };
 //# sourceMappingURL=dropdown-button.stories.js.map

package/lib/cjs/dropdown-button/stories/dropdown-button.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown-button.stories.js","sourceRoot":"","sources":["../../../../src/dropdown-button/stories/dropdown-button.stories.tsx"],"names":[],"mappings":";;;;AAuBA,uCAA6C;AAC7C,wBAaW;AAEX,MAAM,aAAa,GAAgC;IACjD,KAAK,EAAE,2BAA2B;IAClC,EAAE,EAAE,oCAAoC;IACxC,SAAS,EAAE,sBAAc;IACzB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE;KAC5B;IACD,UAAU,EAAE;QACV,CAAC,KAAK,EAAE,EAAE,CAAC,CACT,gCAAK,SAAS,EAAC,yBAAyB,YACtC,uBAAC,KAAK,KAAG,GACL,CACP;KACF;CACoC,CAAC;AAExC,kBAAe,aAAa,CAAC;AAGhB,QAAA,OAAO,GAAU;IAC5B,IAAI,EAAE,EAAE;IACR,MAAM,EAAE,wBAAqB;IAC7B,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;gBACZ,IAAI,EAAE,8BAA2B;aAClC;SACF;KACF;CACF,CAAC;AAEW,QAAA,UAAU,GAAU;IAC/B,IAAI,EAAE,EAAE;IACR,MAAM,EAAE,2BAAwB;IAChC,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;gBACZ,IAAI,EAAE,iCAA8B;aACrC;SACF;KACF;CACF,CAAC;AAEW,QAAA,mBAAmB,GAAU;IACxC,IAAI,EAAE,EAAE;IACR,MAAM,EAAE,oCAAiC;IACzC,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;gBACZ,IAAI,EAAE,0CAAuC;aAC9C;SACF;KACF;CACF,CAAC;AAEW,QAAA,QAAQ,GAAU;IAC7B,IAAI,EAAE,EAAE;IACR,MAAM,EAAE,yBAAsB;IAC9B,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;gBACZ,IAAI,EAAE,+BAA4B;aACnC;SACF;KACF;CACF,CAAC;AAEW,QAAA,QAAQ,GAAU;IAC7B,IAAI,EAAE,EAAE;IACR,MAAM,EAAE,yBAAsB;IAC9B,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;gBACZ,IAAI,EAAE,+BAA4B;aACnC;SACF;KACF;CACF,CAAC;AAEW,QAAA,QAAQ,GAAU;IAC7B,IAAI,EAAE,EAAE;IACR,MAAM,EAAE,yBAAsB;IAC9B,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;gBACZ,IAAI,EAAE,+BAA4B;aACnC;SACF;KACF;CACF,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 { type Meta, type StoryObj } from '@storybook/react-vite';\n\nimport { DropdownButton } from '../../index';\nimport {\n  DropdownButtonDefault,\n  DropdownButtonDefaultSource,\n  DropdownButtonDisabled,\n  DropdownButtonDisabledSource,\n  DropdownButtonFloating,\n  DropdownButtonFloatingSource,\n  DropdownButtonWithAvatar,\n  DropdownButtonWithAvatarSource,\n  DropdownButtonWithMenu,\n  DropdownButtonWithMenuSource,\n  DropdownButtonWithStatusIndicator,\n  DropdownButtonWithStatusIndicatorSource,\n} from '.';\n\nconst componentMeta: Meta<typeof DropdownButton> = {\n  title: 'Components/DropdownButton',\n  id: 'components-buttons-dropdown-button',\n  component: DropdownButton,\n  tags: ['docsPage'],\n  parameters: {\n    controls: { disable: true },\n  },\n  decorators: [\n    (Story) => (\n      <div className=\"n-flex n-justify-center\">\n        <Story />\n      </div>\n    ),\n  ],\n} satisfies Meta<typeof DropdownButton>;\n\nexport default componentMeta;\ntype Story = StoryObj<typeof componentMeta>;\n\nexport const Default: Story = {\n  args: {},\n  render: DropdownButtonDefault,\n  parameters: {\n    docs: {\n      source: {\n        language: 'tsx',\n        type: 'code',\n        code: DropdownButtonDefaultSource,\n      },\n    },\n  },\n};\n\nexport const WithAvatar: Story = {\n  args: {},\n  render: DropdownButtonWithAvatar,\n  parameters: {\n    docs: {\n      source: {\n        language: 'tsx',\n        type: 'code',\n        code: DropdownButtonWithAvatarSource,\n      },\n    },\n  },\n};\n\nexport const WithStatusIndicator: Story = {\n  args: {},\n  render: DropdownButtonWithStatusIndicator,\n  parameters: {\n    docs: {\n      source: {\n        language: 'tsx',\n        type: 'code',\n        code: DropdownButtonWithStatusIndicatorSource,\n      },\n    },\n  },\n};\n\nexport const Disabled: Story = {\n  args: {},\n  render: DropdownButtonDisabled,\n  parameters: {\n    docs: {\n      source: {\n        language: 'tsx',\n        type: 'code',\n        code: DropdownButtonDisabledSource,\n      },\n    },\n  },\n};\n\nexport const Floating: Story = {\n  args: {},\n  render: DropdownButtonFloating,\n  parameters: {\n    docs: {\n      source: {\n        language: 'tsx',\n        type: 'code',\n        code: DropdownButtonFloatingSource,\n      },\n    },\n  },\n};\n\nexport const WithMenu: Story = {\n  args: {},\n  render: DropdownButtonWithMenu,\n  parameters: {\n    docs: {\n      source: {\n        language: 'tsx',\n        type: 'code',\n        code: DropdownButtonWithMenuSource,\n      },\n    },\n  },\n};\n"]}
+{"version":3,"file":"dropdown-button.stories.js","sourceRoot":"","sources":["../../../../src/dropdown-button/stories/dropdown-button.stories.tsx"],"names":[],"mappings":";;;;AAuBA,uCAA6C;AAC7C,wBAaW;AAEX,MAAM,aAAa,GAAgC;IACjD,SAAS,EAAE,sBAAc;IACzB,UAAU,EAAE;QACV,CAAC,KAAK,EAAE,EAAE,CAAC,CACT,gCAAK,SAAS,EAAC,yBAAyB,YACtC,uBAAC,KAAK,KAAG,GACL,CACP;KACF;IACD,EAAE,EAAE,oCAAoC;IACxC,UAAU,EAAE;QACV,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE;KAC5B;IACD,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,KAAK,EAAE,2BAA2B;CACG,CAAC;AAExC,kBAAe,aAAa,CAAC;AAGhB,QAAA,OAAO,GAAU;IAC5B,IAAI,EAAE,EAAE;IACR,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,8BAA2B;gBACjC,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;aACb;SACF;KACF;IACD,MAAM,EAAE,wBAAqB;CAC9B,CAAC;AAEW,QAAA,UAAU,GAAU;IAC/B,IAAI,EAAE,EAAE;IACR,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,iCAA8B;gBACpC,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;aACb;SACF;KACF;IACD,MAAM,EAAE,2BAAwB;CACjC,CAAC;AAEW,QAAA,mBAAmB,GAAU;IACxC,IAAI,EAAE,EAAE;IACR,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,0CAAuC;gBAC7C,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;aACb;SACF;KACF;IACD,MAAM,EAAE,oCAAiC;CAC1C,CAAC;AAEW,QAAA,QAAQ,GAAU;IAC7B,IAAI,EAAE,EAAE;IACR,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,+BAA4B;gBAClC,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;aACb;SACF;KACF;IACD,MAAM,EAAE,yBAAsB;CAC/B,CAAC;AAEW,QAAA,QAAQ,GAAU;IAC7B,IAAI,EAAE,EAAE;IACR,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,+BAA4B;gBAClC,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;aACb;SACF;KACF;IACD,MAAM,EAAE,yBAAsB;CAC/B,CAAC;AAEW,QAAA,QAAQ,GAAU;IAC7B,IAAI,EAAE,EAAE;IACR,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,+BAA4B;gBAClC,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;aACb;SACF;KACF;IACD,MAAM,EAAE,yBAAsB;CAC/B,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 { type Meta, type StoryObj } from '@storybook/react-vite';\n\nimport { DropdownButton } from '../../index';\nimport {\n  DropdownButtonDefault,\n  DropdownButtonDefaultSource,\n  DropdownButtonDisabled,\n  DropdownButtonDisabledSource,\n  DropdownButtonFloating,\n  DropdownButtonFloatingSource,\n  DropdownButtonWithAvatar,\n  DropdownButtonWithAvatarSource,\n  DropdownButtonWithMenu,\n  DropdownButtonWithMenuSource,\n  DropdownButtonWithStatusIndicator,\n  DropdownButtonWithStatusIndicatorSource,\n} from '.';\n\nconst componentMeta: Meta<typeof DropdownButton> = {\n  component: DropdownButton,\n  decorators: [\n    (Story) => (\n      <div className=\"n-flex n-justify-center\">\n        <Story />\n      </div>\n    ),\n  ],\n  id: 'components-buttons-dropdown-button',\n  parameters: {\n    controls: { disable: true },\n  },\n  tags: ['docsPage'],\n  title: 'Components/DropdownButton',\n} satisfies Meta<typeof DropdownButton>;\n\nexport default componentMeta;\ntype Story = StoryObj<typeof componentMeta>;\n\nexport const Default: Story = {\n  args: {},\n  parameters: {\n    docs: {\n      source: {\n        code: DropdownButtonDefaultSource,\n        language: 'tsx',\n        type: 'code',\n      },\n    },\n  },\n  render: DropdownButtonDefault,\n};\n\nexport const WithAvatar: Story = {\n  args: {},\n  parameters: {\n    docs: {\n      source: {\n        code: DropdownButtonWithAvatarSource,\n        language: 'tsx',\n        type: 'code',\n      },\n    },\n  },\n  render: DropdownButtonWithAvatar,\n};\n\nexport const WithStatusIndicator: Story = {\n  args: {},\n  parameters: {\n    docs: {\n      source: {\n        code: DropdownButtonWithStatusIndicatorSource,\n        language: 'tsx',\n        type: 'code',\n      },\n    },\n  },\n  render: DropdownButtonWithStatusIndicator,\n};\n\nexport const Disabled: Story = {\n  args: {},\n  parameters: {\n    docs: {\n      source: {\n        code: DropdownButtonDisabledSource,\n        language: 'tsx',\n        type: 'code',\n      },\n    },\n  },\n  render: DropdownButtonDisabled,\n};\n\nexport const Floating: Story = {\n  args: {},\n  parameters: {\n    docs: {\n      source: {\n        code: DropdownButtonFloatingSource,\n        language: 'tsx',\n        type: 'code',\n      },\n    },\n  },\n  render: DropdownButtonFloating,\n};\n\nexport const WithMenu: Story = {\n  args: {},\n  parameters: {\n    docs: {\n      source: {\n        code: DropdownButtonWithMenuSource,\n        language: 'tsx',\n        type: 'code',\n      },\n    },\n  },\n  render: DropdownButtonWithMenu,\n};\n"]}

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

@@ -28,8 +28,8 @@ const Component = () => {
     };
     return ((0, jsx_runtime_1.jsx)(react_1.Dropzone, { supportedFilesDescription: "Supports: CSV Files", dropZoneOptions: {
             accept: { 'text/csv': ['.csv'] },
-            onDrop,
             disabled: true,
+            onDrop,
         } }));
 };
 exports.default = Component;

package/lib/cjs/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,4CAA4C;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,uBAAC,gBAAQ,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,kBAAe,SAAS,CAAC","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\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,4CAA4C;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,uBAAC,gBAAQ,IACP,yBAAyB,EAAC,qBAAqB,EAC/C,eAAe,EAAE;YACf,MAAM,EAAE,EAAE,UAAU,EAAE,CAAC,MAAM,CAAC,EAAE;YAChC,QAAQ,EAAE,IAAI;YACd,MAAM;SACP,GACD,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\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        disabled: true,\n        onDrop,\n      }}\n    />\n  );\n};\n\nexport default Component;\n"]}

package/lib/cjs/dropzone/stories/dropzone-full.story.js

@@ -41,17 +41,17 @@ var UploadState;
 })(UploadState || (UploadState = {}));
 const Component = () => {
     const [uploadData, setUploadData] = (0, react_2.useState)({
-        state: UploadState.Idle,
-        progress: 0,
-        files: [],
         errors: [],
+        files: [],
+        progress: 0,
+        state: UploadState.Idle,
     });
     const resetUpload = (0, react_2.useCallback)(() => {
         setUploadData({
-            state: UploadState.Idle,
-            progress: 0,
-            files: [],
             errors: [],
+            files: [],
+            progress: 0,
+            state: UploadState.Idle,
         });
     }, []);
     const simulateUpload = (0, react_2.useCallback)((files) => {
@@ -69,7 +69,7 @@ const Component = () => {
         }, CONFIG.UPDATE_INTERVAL);
     }, []);
     const handleDrop = (0, react_2.useCallback)((acceptedFiles, rejectedFiles, event) => {
-        console.info('Drop event:', { acceptedFiles, rejectedFiles, event });
+        console.info('Drop event:', { acceptedFiles, event, rejectedFiles });
         if (acceptedFiles.length > 0) {
             simulateUpload(acceptedFiles);
         }
@@ -96,13 +96,13 @@ const Component = () => {
         }
     };
     return ((0, jsx_runtime_1.jsx)(react_1.Dropzone, { dropZoneOptions: {
+            disabled: uploadData.state === UploadState.Uploading,
+            maxFiles: CONFIG.MAX_FILES,
+            maxSize: CONFIG.MAX_FILE_SIZE,
+            multiple: true,
             onDrop: handleDrop,
             onDropRejected: handleDropRejected,
             onError: handleError,
-            multiple: true,
-            maxFiles: CONFIG.MAX_FILES,
-            maxSize: CONFIG.MAX_FILE_SIZE,
-            disabled: uploadData.state === UploadState.Uploading,
         }, supportedFilesDescription: (0, jsx_runtime_1.jsxs)("div", { className: "n-text-center n-flex n-flex-col n-gap-y-token-2", children: [(0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "body-small", className: "n-text-neutral-text-weak", children: "Supports: Text files (.txt, .json) only" }), (0, jsx_runtime_1.jsxs)(react_1.Typography, { variant: "body-small", className: "n-text-neutral-text-weak", children: ["Max ", CONFIG.MAX_FILES, " files \u2022", ' ', CONFIG.MAX_FILE_SIZE / (1024 * 1024), "MB per file"] })] }), acceptedFileExtensions: CONFIG.ACCEPTED_EXTENSIONS, loadingElement: renderStatusContent(), rejectedText: "Error: Please make sure to only upload .json or .txt files", heading: "Drag & Drop your files" }));
 };
 exports.default = Component;

package/lib/cjs/dropzone/stories/dropzone-full.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropzone-full.story.js","sourceRoot":"","sources":["../../../../src/dropzone/stories/dropzone-full.story.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 { XMarkIcon } from '@heroicons/react/24/solid';\nimport { Dropzone, FilledButton, Typography } from '@neo4j-ndl/react';\nimport { useCallback, useState } from 'react';\nimport {\n  type DropEvent,\n  type DropzoneOptions,\n  type FileRejection,\n} from 'react-dropzone';\n\n// Configuration constants\nconst CONFIG = {\n  MAX_FILES: 3,\n  MAX_FILE_SIZE: 5 * 1024 * 1024, // 5MB\n  PROGRESS_INCREMENT: 5,\n  UPDATE_INTERVAL: 100,\n  ACCEPTED_EXTENSIONS: ['.txt', '.json'] as string[],\n} as const;\n\nenum UploadState {\n  Idle = 'idle',\n  Uploading = 'uploading',\n  Success = 'success',\n  Error = 'error',\n}\n\ninterface UploadData {\n  state: UploadState;\n  progress: number;\n  files: File[];\n  errors: string[];\n}\n\nconst Component = () => {\n  const [uploadData, setUploadData] = useState<UploadData>({\n    state: UploadState.Idle,\n    progress: 0,\n    files: [],\n    errors: [],\n  });\n\n  const resetUpload = useCallback(() => {\n    setUploadData({\n      state: UploadState.Idle,\n      progress: 0,\n      files: [],\n      errors: [],\n    });\n  }, []);\n\n  const simulateUpload = useCallback((files: File[]) => {\n    setUploadData((prev) => ({\n      ...prev,\n      state: UploadState.Uploading,\n      files,\n      progress: 0,\n    }));\n\n    const interval = setInterval(() => {\n      setUploadData((prev) => {\n        const newProgress = prev.progress + CONFIG.PROGRESS_INCREMENT;\n        if (newProgress >= 100) {\n          clearInterval(interval);\n          setTimeout(\n            () =>\n              setUploadData((current) => ({\n                ...current,\n                state: UploadState.Success,\n              })),\n            500,\n          );\n          return { ...prev, progress: 100 };\n        }\n        return { ...prev, progress: newProgress };\n      });\n    }, CONFIG.UPDATE_INTERVAL);\n  }, []);\n\n  const handleDrop: DropzoneOptions['onDrop'] = useCallback(\n    (\n      acceptedFiles: File[],\n      rejectedFiles: FileRejection[],\n      event: DropEvent,\n    ) => {\n      console.info('Drop event:', { acceptedFiles, rejectedFiles, event });\n\n      if (acceptedFiles.length > 0) {\n        simulateUpload(acceptedFiles);\n      }\n    },\n    [simulateUpload],\n  );\n\n  const handleDropRejected: DropzoneOptions['onDropRejected'] = useCallback(\n    (rejectedFiles: FileRejection[]) => {\n      const errors = rejectedFiles.map(\n        (file) =>\n          `${file.file.name}: ${file.errors.map((e) => e.message).join(', ')}`,\n      );\n      setUploadData((prev) => ({ ...prev, state: UploadState.Error, errors }));\n    },\n    [],\n  );\n\n  const handleError = useCallback((error: Error) => {\n    console.error('Dropzone error:', error);\n    setUploadData((prev) => ({\n      ...prev,\n      state: UploadState.Error,\n      errors: [error.message],\n    }));\n  }, []);\n\n  const renderStatusContent = () => {\n    const { state, progress, files, errors } = uploadData;\n\n    switch (state) {\n      case UploadState.Uploading:\n        return (\n          <Dropzone.LoadingProgressBar\n            progressBarPrecentage={Math.round(progress)}\n          />\n        );\n\n      case UploadState.Success:\n        return (\n          <div className=\"n-flex n-flex-col n-justify-center n-items-center n-gap-y-token-32\">\n            <Typography\n              variant=\"title-4\"\n              className=\"n-text-success-text n-font-semibold\"\n            >\n              Upload Complete!\n            </Typography>\n            <Typography\n              variant=\"body-small\"\n              className=\"n-text-neutral-text-weak\"\n            >\n              Successfully uploaded: {files.map((file) => file.name).join(', ')}\n            </Typography>\n            <FilledButton onClick={resetUpload}>Upload More Files</FilledButton>\n          </div>\n        );\n\n      case UploadState.Error:\n        return (\n          <div className=\"n-flex n-flex-col n-justify-center n-items-center n-gap-y-token-32\">\n            <XMarkIcon className=\"n-w-token-32 n-h-token-32 n-text-danger-text\" />\n            <div className=\"n-flex n-flex-col n-gap-y-token-2\">\n              {errors.map((message, index) => (\n                <Typography\n                  key={index}\n                  variant=\"label\"\n                  className=\"n-text-danger-text n-font-semibold\"\n                  htmlAttributes={{ role: 'alert' }}\n                >\n                  {message}\n                </Typography>\n              ))}\n            </div>\n            <FilledButton onClick={resetUpload}>Try Again</FilledButton>\n          </div>\n        );\n\n      default:\n        return undefined;\n    }\n  };\n\n  return (\n    <Dropzone\n      dropZoneOptions={{\n        onDrop: handleDrop,\n        onDropRejected: handleDropRejected,\n        onError: handleError,\n        multiple: true,\n        maxFiles: CONFIG.MAX_FILES,\n        maxSize: CONFIG.MAX_FILE_SIZE,\n        disabled: uploadData.state === UploadState.Uploading,\n      }}\n      supportedFilesDescription={\n        <div className=\"n-text-center n-flex n-flex-col n-gap-y-token-2\">\n          <Typography variant=\"body-small\" className=\"n-text-neutral-text-weak\">\n            Supports: Text files (.txt, .json) only\n          </Typography>\n          <Typography variant=\"body-small\" className=\"n-text-neutral-text-weak\">\n            Max {CONFIG.MAX_FILES} files •{' '}\n            {CONFIG.MAX_FILE_SIZE / (1024 * 1024)}MB per file\n          </Typography>\n        </div>\n      }\n      acceptedFileExtensions={CONFIG.ACCEPTED_EXTENSIONS}\n      loadingElement={renderStatusContent()}\n      rejectedText=\"Error: Please make sure to only upload .json or .txt files\"\n      heading=\"Drag & Drop your files\"\n    />\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"dropzone-full.story.js","sourceRoot":"","sources":["../../../../src/dropzone/stories/dropzone-full.story.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 { XMarkIcon } from '@heroicons/react/24/solid';\nimport { Dropzone, FilledButton, Typography } from '@neo4j-ndl/react';\nimport { useCallback, useState } from 'react';\nimport {\n  type DropEvent,\n  type DropzoneOptions,\n  type FileRejection,\n} from 'react-dropzone';\n\n// Configuration constants\nconst CONFIG = {\n  MAX_FILES: 3,\n  MAX_FILE_SIZE: 5 * 1024 * 1024, // 5MB\n  PROGRESS_INCREMENT: 5,\n  UPDATE_INTERVAL: 100,\n  ACCEPTED_EXTENSIONS: ['.txt', '.json'] as string[],\n} as const;\n\nenum UploadState {\n  Idle = 'idle',\n  Uploading = 'uploading',\n  Success = 'success',\n  Error = 'error',\n}\n\ninterface UploadData {\n  state: UploadState;\n  progress: number;\n  files: File[];\n  errors: string[];\n}\n\nconst Component = () => {\n  const [uploadData, setUploadData] = useState<UploadData>({\n    errors: [],\n    files: [],\n    progress: 0,\n    state: UploadState.Idle,\n  });\n\n  const resetUpload = useCallback(() => {\n    setUploadData({\n      errors: [],\n      files: [],\n      progress: 0,\n      state: UploadState.Idle,\n    });\n  }, []);\n\n  const simulateUpload = useCallback((files: File[]) => {\n    setUploadData((prev) => ({\n      ...prev,\n      state: UploadState.Uploading,\n      files,\n      progress: 0,\n    }));\n\n    const interval = setInterval(() => {\n      setUploadData((prev) => {\n        const newProgress = prev.progress + CONFIG.PROGRESS_INCREMENT;\n        if (newProgress >= 100) {\n          clearInterval(interval);\n          setTimeout(\n            () =>\n              setUploadData((current) => ({\n                ...current,\n                state: UploadState.Success,\n              })),\n            500,\n          );\n          return { ...prev, progress: 100 };\n        }\n        return { ...prev, progress: newProgress };\n      });\n    }, CONFIG.UPDATE_INTERVAL);\n  }, []);\n\n  const handleDrop: DropzoneOptions['onDrop'] = useCallback(\n    (\n      acceptedFiles: File[],\n      rejectedFiles: FileRejection[],\n      event: DropEvent,\n    ) => {\n      console.info('Drop event:', { acceptedFiles, event, rejectedFiles });\n\n      if (acceptedFiles.length > 0) {\n        simulateUpload(acceptedFiles);\n      }\n    },\n    [simulateUpload],\n  );\n\n  const handleDropRejected: DropzoneOptions['onDropRejected'] = useCallback(\n    (rejectedFiles: FileRejection[]) => {\n      const errors = rejectedFiles.map(\n        (file) =>\n          `${file.file.name}: ${file.errors.map((e) => e.message).join(', ')}`,\n      );\n      setUploadData((prev) => ({ ...prev, state: UploadState.Error, errors }));\n    },\n    [],\n  );\n\n  const handleError = useCallback((error: Error) => {\n    console.error('Dropzone error:', error);\n    setUploadData((prev) => ({\n      ...prev,\n      state: UploadState.Error,\n      errors: [error.message],\n    }));\n  }, []);\n\n  const renderStatusContent = () => {\n    const { state, progress, files, errors } = uploadData;\n\n    switch (state) {\n      case UploadState.Uploading:\n        return (\n          <Dropzone.LoadingProgressBar\n            progressBarPrecentage={Math.round(progress)}\n          />\n        );\n\n      case UploadState.Success:\n        return (\n          <div className=\"n-flex n-flex-col n-justify-center n-items-center n-gap-y-token-32\">\n            <Typography\n              variant=\"title-4\"\n              className=\"n-text-success-text n-font-semibold\"\n            >\n              Upload Complete!\n            </Typography>\n            <Typography\n              variant=\"body-small\"\n              className=\"n-text-neutral-text-weak\"\n            >\n              Successfully uploaded: {files.map((file) => file.name).join(', ')}\n            </Typography>\n            <FilledButton onClick={resetUpload}>Upload More Files</FilledButton>\n          </div>\n        );\n\n      case UploadState.Error:\n        return (\n          <div className=\"n-flex n-flex-col n-justify-center n-items-center n-gap-y-token-32\">\n            <XMarkIcon className=\"n-w-token-32 n-h-token-32 n-text-danger-text\" />\n            <div className=\"n-flex n-flex-col n-gap-y-token-2\">\n              {errors.map((message, index) => (\n                <Typography\n                  key={index}\n                  variant=\"label\"\n                  className=\"n-text-danger-text n-font-semibold\"\n                  htmlAttributes={{ role: 'alert' }}\n                >\n                  {message}\n                </Typography>\n              ))}\n            </div>\n            <FilledButton onClick={resetUpload}>Try Again</FilledButton>\n          </div>\n        );\n\n      default:\n        return undefined;\n    }\n  };\n\n  return (\n    <Dropzone\n      dropZoneOptions={{\n        disabled: uploadData.state === UploadState.Uploading,\n        maxFiles: CONFIG.MAX_FILES,\n        maxSize: CONFIG.MAX_FILE_SIZE,\n        multiple: true,\n        onDrop: handleDrop,\n        onDropRejected: handleDropRejected,\n        onError: handleError,\n      }}\n      supportedFilesDescription={\n        <div className=\"n-text-center n-flex n-flex-col n-gap-y-token-2\">\n          <Typography variant=\"body-small\" className=\"n-text-neutral-text-weak\">\n            Supports: Text files (.txt, .json) only\n          </Typography>\n          <Typography variant=\"body-small\" className=\"n-text-neutral-text-weak\">\n            Max {CONFIG.MAX_FILES} files •{' '}\n            {CONFIG.MAX_FILE_SIZE / (1024 * 1024)}MB per file\n          </Typography>\n        </div>\n      }\n      acceptedFileExtensions={CONFIG.ACCEPTED_EXTENSIONS}\n      loadingElement={renderStatusContent()}\n      rejectedText=\"Error: Please make sure to only upload .json or .txt files\"\n      heading=\"Drag & Drop your files\"\n    />\n  );\n};\n\nexport default Component;\n"]}

package/lib/cjs/dropzone/stories/dropzone.stories.js

@@ -26,20 +26,19 @@ const react_1 = require("@neo4j-ndl/react");
 const _1 = require(".");
 const componentMeta = {
     component: react_1.Dropzone,
+    decorators: [
+        (Story) => ((0, jsx_runtime_1.jsx)("div", { className: "n-mx-auto n-w-1/2", children: (0, jsx_runtime_1.jsx)(Story, {}) })),
+    ],
+    id: 'components-dropzone',
     parameters: {
         controls: { disable: true },
     },
     tags: ['docsPage'],
     title: 'Components/Dropzone',
-    id: 'components-dropzone',
-    decorators: [
-        (Story) => ((0, jsx_runtime_1.jsx)("div", { className: "n-mx-auto n-w-1/2", children: (0, jsx_runtime_1.jsx)(Story, {}) })),
-    ],
 };
 exports.default = componentMeta;
 exports.Default = {
     args: {},
-    render: () => (0, jsx_runtime_1.jsx)(_1.DropzoneDefault, {}),
     parameters: {
         docs: {
             source: {
@@ -47,11 +46,11 @@ exports.Default = {
             },
         },
     },
+    render: () => (0, jsx_runtime_1.jsx)(_1.DropzoneDefault, {}),
 };
 exports.CsvFiles = {
     args: {},
     name: 'CSV Files Only (MIME type)',
-    render: () => (0, jsx_runtime_1.jsx)(_1.DropzoneCsvFiles, {}),
     parameters: {
         docs: {
             source: {
@@ -59,11 +58,11 @@ exports.CsvFiles = {
             },
         },
     },
+    render: () => (0, jsx_runtime_1.jsx)(_1.DropzoneCsvFiles, {}),
 };
 exports.CustomExtensions = {
     args: {},
     name: 'Custom File Extensions (.dump)',
-    render: () => (0, jsx_runtime_1.jsx)(_1.DropzoneCustomExtensions, {}),
     parameters: {
         docs: {
             source: {
@@ -71,11 +70,11 @@ exports.CustomExtensions = {
             },
         },
     },
+    render: () => (0, jsx_runtime_1.jsx)(_1.DropzoneCustomExtensions, {}),
 };
 exports.LoadingProgress = {
     args: {},
     name: 'Loading with Progress Bar',
-    render: () => (0, jsx_runtime_1.jsx)(_1.DropzoneLoadingProgress, {}),
     parameters: {
         docs: {
             source: {
@@ -83,10 +82,10 @@ exports.LoadingProgress = {
             },
         },
     },
+    render: () => (0, jsx_runtime_1.jsx)(_1.DropzoneLoadingProgress, {}),
 };
 exports.Disabled = {
     args: {},
-    render: () => (0, jsx_runtime_1.jsx)(_1.DropzoneDisabled, {}),
     parameters: {
         docs: {
             source: {
@@ -94,10 +93,10 @@ exports.Disabled = {
             },
         },
     },
+    render: () => (0, jsx_runtime_1.jsx)(_1.DropzoneDisabled, {}),
 };
 exports.Full = {
     args: {},
-    render: () => (0, jsx_runtime_1.jsx)(_1.DropzoneFull, {}),
     parameters: {
         docs: {
             source: {
@@ -105,5 +104,6 @@ exports.Full = {
             },
         },
     },
+    render: () => (0, jsx_runtime_1.jsx)(_1.DropzoneFull, {}),
 };
 //# sourceMappingURL=dropzone.stories.js.map

package/lib/cjs/dropzone/stories/dropzone.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropzone.stories.js","sourceRoot":"","sources":["../../../../src/dropzone/stories/dropzone.stories.tsx"],"names":[],"mappings":";;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,4CAA4C;AAG5C,wBAaW;AAEX,MAAM,aAAa,GAA0B;IAC3C,SAAS,EAAE,gBAAQ;IACnB,UAAU,EAAE;QACV,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE;KAC5B;IACD,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,KAAK,EAAE,qBAAqB;IAC5B,EAAE,EAAE,qBAAqB;IACzB,UAAU,EAAE;QACV,CAAC,KAAK,EAAE,EAAE,CAAC,CACT,gCAAK,SAAS,EAAC,mBAAmB,YAChC,uBAAC,KAAK,KAAG,GACL,CACP;KACF;CAC8B,CAAC;AAElC,kBAAe,aAAa,CAAC;AAIhB,QAAA,OAAO,GAAU;IAC5B,IAAI,EAAE,EAAE;IACR,MAAM,EAAE,GAAG,EAAE,CAAC,uBAAC,kBAAe,KAAG;IACjC,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,wBAAqB;aAC5B;SACF;KACF;CACF,CAAC;AAEW,QAAA,QAAQ,GAAU;IAC7B,IAAI,EAAE,EAAE;IACR,IAAI,EAAE,4BAA4B;IAClC,MAAM,EAAE,GAAG,EAAE,CAAC,uBAAC,mBAAgB,KAAG;IAClC,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,yBAAsB;aAC7B;SACF;KACF;CACF,CAAC;AAEW,QAAA,gBAAgB,GAAU;IACrC,IAAI,EAAE,EAAE;IACR,IAAI,EAAE,gCAAgC;IACtC,MAAM,EAAE,GAAG,EAAE,CAAC,uBAAC,2BAAwB,KAAG;IAC1C,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,iCAA8B;aACrC;SACF;KACF;CACF,CAAC;AAEW,QAAA,eAAe,GAAU;IACpC,IAAI,EAAE,EAAE;IACR,IAAI,EAAE,2BAA2B;IACjC,MAAM,EAAE,GAAG,EAAE,CAAC,uBAAC,0BAAuB,KAAG;IACzC,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,gCAA6B;aACpC;SACF;KACF;CACF,CAAC;AAEW,QAAA,QAAQ,GAAU;IAC7B,IAAI,EAAE,EAAE;IACR,MAAM,EAAE,GAAG,EAAE,CAAC,uBAAC,mBAAgB,KAAG;IAClC,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,yBAAsB;aAC7B;SACF;KACF;CACF,CAAC;AAEW,QAAA,IAAI,GAAU;IACzB,IAAI,EAAE,EAAE;IACR,MAAM,EAAE,GAAG,EAAE,CAAC,uBAAC,eAAY,KAAG;IAC9B,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,qBAAkB;aACzB;SACF;KACF;CACF,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 Meta, type StoryObj } from '@storybook/react-vite';\n\nimport {\n  DropzoneCsvFiles,\n  DropzoneCsvFilesSource,\n  DropzoneCustomExtensions,\n  DropzoneCustomExtensionsSource,\n  DropzoneDefault,\n  DropzoneDefaultSource,\n  DropzoneDisabled,\n  DropzoneDisabledSource,\n  DropzoneFull,\n  DropzoneFullSource,\n  DropzoneLoadingProgress,\n  DropzoneLoadingProgressSource,\n} from '.';\n\nconst componentMeta: Meta<typeof Dropzone> = {\n  component: Dropzone,\n  parameters: {\n    controls: { disable: true },\n  },\n  tags: ['docsPage'],\n  title: 'Components/Dropzone',\n  id: 'components-dropzone',\n  decorators: [\n    (Story) => (\n      <div className=\"n-mx-auto n-w-1/2\">\n        <Story />\n      </div>\n    ),\n  ],\n} satisfies Meta<typeof Dropzone>;\n\nexport default componentMeta;\n\ntype Story = StoryObj<typeof componentMeta>;\n\nexport const Default: Story = {\n  args: {},\n  render: () => <DropzoneDefault />,\n  parameters: {\n    docs: {\n      source: {\n        code: DropzoneDefaultSource,\n      },\n    },\n  },\n};\n\nexport const CsvFiles: Story = {\n  args: {},\n  name: 'CSV Files Only (MIME type)',\n  render: () => <DropzoneCsvFiles />,\n  parameters: {\n    docs: {\n      source: {\n        code: DropzoneCsvFilesSource,\n      },\n    },\n  },\n};\n\nexport const CustomExtensions: Story = {\n  args: {},\n  name: 'Custom File Extensions (.dump)',\n  render: () => <DropzoneCustomExtensions />,\n  parameters: {\n    docs: {\n      source: {\n        code: DropzoneCustomExtensionsSource,\n      },\n    },\n  },\n};\n\nexport const LoadingProgress: Story = {\n  args: {},\n  name: 'Loading with Progress Bar',\n  render: () => <DropzoneLoadingProgress />,\n  parameters: {\n    docs: {\n      source: {\n        code: DropzoneLoadingProgressSource,\n      },\n    },\n  },\n};\n\nexport const Disabled: Story = {\n  args: {},\n  render: () => <DropzoneDisabled />,\n  parameters: {\n    docs: {\n      source: {\n        code: DropzoneDisabledSource,\n      },\n    },\n  },\n};\n\nexport const Full: Story = {\n  args: {},\n  render: () => <DropzoneFull />,\n  parameters: {\n    docs: {\n      source: {\n        code: DropzoneFullSource,\n      },\n    },\n  },\n};\n"]}
+{"version":3,"file":"dropzone.stories.js","sourceRoot":"","sources":["../../../../src/dropzone/stories/dropzone.stories.tsx"],"names":[],"mappings":";;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,4CAA4C;AAG5C,wBAaW;AAEX,MAAM,aAAa,GAA0B;IAC3C,SAAS,EAAE,gBAAQ;IACnB,UAAU,EAAE;QACV,CAAC,KAAK,EAAE,EAAE,CAAC,CACT,gCAAK,SAAS,EAAC,mBAAmB,YAChC,uBAAC,KAAK,KAAG,GACL,CACP;KACF;IACD,EAAE,EAAE,qBAAqB;IACzB,UAAU,EAAE;QACV,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE;KAC5B;IACD,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,KAAK,EAAE,qBAAqB;CACG,CAAC;AAElC,kBAAe,aAAa,CAAC;AAIhB,QAAA,OAAO,GAAU;IAC5B,IAAI,EAAE,EAAE;IACR,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,wBAAqB;aAC5B;SACF;KACF;IACD,MAAM,EAAE,GAAG,EAAE,CAAC,uBAAC,kBAAe,KAAG;CAClC,CAAC;AAEW,QAAA,QAAQ,GAAU;IAC7B,IAAI,EAAE,EAAE;IACR,IAAI,EAAE,4BAA4B;IAClC,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,yBAAsB;aAC7B;SACF;KACF;IACD,MAAM,EAAE,GAAG,EAAE,CAAC,uBAAC,mBAAgB,KAAG;CACnC,CAAC;AAEW,QAAA,gBAAgB,GAAU;IACrC,IAAI,EAAE,EAAE;IACR,IAAI,EAAE,gCAAgC;IACtC,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,iCAA8B;aACrC;SACF;KACF;IACD,MAAM,EAAE,GAAG,EAAE,CAAC,uBAAC,2BAAwB,KAAG;CAC3C,CAAC;AAEW,QAAA,eAAe,GAAU;IACpC,IAAI,EAAE,EAAE;IACR,IAAI,EAAE,2BAA2B;IACjC,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,gCAA6B;aACpC;SACF;KACF;IACD,MAAM,EAAE,GAAG,EAAE,CAAC,uBAAC,0BAAuB,KAAG;CAC1C,CAAC;AAEW,QAAA,QAAQ,GAAU;IAC7B,IAAI,EAAE,EAAE;IACR,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,yBAAsB;aAC7B;SACF;KACF;IACD,MAAM,EAAE,GAAG,EAAE,CAAC,uBAAC,mBAAgB,KAAG;CACnC,CAAC;AAEW,QAAA,IAAI,GAAU;IACzB,IAAI,EAAE,EAAE;IACR,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,qBAAkB;aACzB;SACF;KACF;IACD,MAAM,EAAE,GAAG,EAAE,CAAC,uBAAC,eAAY,KAAG;CAC/B,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 Meta, type StoryObj } from '@storybook/react-vite';\n\nimport {\n  DropzoneCsvFiles,\n  DropzoneCsvFilesSource,\n  DropzoneCustomExtensions,\n  DropzoneCustomExtensionsSource,\n  DropzoneDefault,\n  DropzoneDefaultSource,\n  DropzoneDisabled,\n  DropzoneDisabledSource,\n  DropzoneFull,\n  DropzoneFullSource,\n  DropzoneLoadingProgress,\n  DropzoneLoadingProgressSource,\n} from '.';\n\nconst componentMeta: Meta<typeof Dropzone> = {\n  component: Dropzone,\n  decorators: [\n    (Story) => (\n      <div className=\"n-mx-auto n-w-1/2\">\n        <Story />\n      </div>\n    ),\n  ],\n  id: 'components-dropzone',\n  parameters: {\n    controls: { disable: true },\n  },\n  tags: ['docsPage'],\n  title: 'Components/Dropzone',\n} satisfies Meta<typeof Dropzone>;\n\nexport default componentMeta;\n\ntype Story = StoryObj<typeof componentMeta>;\n\nexport const Default: Story = {\n  args: {},\n  parameters: {\n    docs: {\n      source: {\n        code: DropzoneDefaultSource,\n      },\n    },\n  },\n  render: () => <DropzoneDefault />,\n};\n\nexport const CsvFiles: Story = {\n  args: {},\n  name: 'CSV Files Only (MIME type)',\n  parameters: {\n    docs: {\n      source: {\n        code: DropzoneCsvFilesSource,\n      },\n    },\n  },\n  render: () => <DropzoneCsvFiles />,\n};\n\nexport const CustomExtensions: Story = {\n  args: {},\n  name: 'Custom File Extensions (.dump)',\n  parameters: {\n    docs: {\n      source: {\n        code: DropzoneCustomExtensionsSource,\n      },\n    },\n  },\n  render: () => <DropzoneCustomExtensions />,\n};\n\nexport const LoadingProgress: Story = {\n  args: {},\n  name: 'Loading with Progress Bar',\n  parameters: {\n    docs: {\n      source: {\n        code: DropzoneLoadingProgressSource,\n      },\n    },\n  },\n  render: () => <DropzoneLoadingProgress />,\n};\n\nexport const Disabled: Story = {\n  args: {},\n  parameters: {\n    docs: {\n      source: {\n        code: DropzoneDisabledSource,\n      },\n    },\n  },\n  render: () => <DropzoneDisabled />,\n};\n\nexport const Full: Story = {\n  args: {},\n  parameters: {\n    docs: {\n      source: {\n        code: DropzoneFullSource,\n      },\n    },\n  },\n  render: () => <DropzoneFull />,\n};\n"]}

package/lib/cjs/flex/Flex.js

@@ -50,13 +50,13 @@ const Flex = (_a) => {
     const columnGapPx = columnGap ? base_1.tokens.space[columnGap] : undefined;
     const gapFormatted = `${rowGapPx !== null && rowGapPx !== void 0 ? rowGapPx : gapPx} ${columnGapPx !== null && columnGapPx !== void 0 ? columnGapPx : gapPx}`;
     const additionalStyle = {
-        flexDirection,
         alignItems,
-        flexWrap,
-        justifyContent,
+        borderRadius: (0, utils_1.getRadius)(borderRadius, 'borderRadius'),
         display: 'flex',
+        flexDirection,
+        flexWrap,
         gap: gapFormatted,
-        borderRadius: (0, utils_1.getRadius)(borderRadius, 'borderRadius'),
+        justifyContent,
     };
     return ((0, jsx_runtime_1.jsx)(Component, Object.assign({ ref: ref, className: className, style: Object.assign(Object.assign({}, additionalStyle), style) }, restProps, htmlAttributes, { children: children })));
 };

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

@@ -1 +1 @@
-{"version":3,"file":"Flex.js","sourceRoot":"","sources":["../../../src/flex/Flex.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,0CAAyC;AASzC,4CAAyD;AAoDzD;;;GAGG;AACI,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,IAAA,kBAAU,EAAC,GAAG,EAAE,KAAK,CAAC,CAAC;IACrC,MAAM,QAAQ,GAAG,MAAM,CAAC,CAAC,CAAC,aAAM,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IAC3D,MAAM,WAAW,GAAG,SAAS,CAAC,CAAC,CAAC,aAAM,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,IAAA,iBAAS,EAAC,YAAY,EAAE,cAAc,CAAC;KACtD,CAAC;IAEF,OAAO,CACL,uBAAC,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;AAhDW,QAAA,IAAI,QAgDf","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"]}
+{"version":3,"file":"Flex.js","sourceRoot":"","sources":["../../../src/flex/Flex.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,0CAAyC;AASzC,4CAAyD;AAoDzD;;;GAGG;AACI,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,IAAA,kBAAU,EAAC,GAAG,EAAE,KAAK,CAAC,CAAC;IACrC,MAAM,QAAQ,GAAG,MAAM,CAAC,CAAC,CAAC,aAAM,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IAC3D,MAAM,WAAW,GAAG,SAAS,CAAC,CAAC,CAAC,aAAM,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,UAAU;QACV,YAAY,EAAE,IAAA,iBAAS,EAAC,YAAY,EAAE,cAAc,CAAC;QACrD,OAAO,EAAE,MAAM;QACf,aAAa;QACb,QAAQ;QACR,GAAG,EAAE,YAAY;QACjB,cAAc;KACf,CAAC;IAEF,OAAO,CACL,uBAAC,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;AAhDW,QAAA,IAAI,QAgDf","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    alignItems,\n    borderRadius: getRadius(borderRadius, 'borderRadius'),\n    display: 'flex',\n    flexDirection,\n    flexWrap,\n    gap: gapFormatted,\n    justifyContent,\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/cjs/graph-label/stories/graph-label.stories.js

@@ -26,107 +26,107 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const index_1 = require("../../index");
 const _1 = require(".");
 const componentMeta = {
-    title: 'Components/GraphLabel',
-    id: 'components-graph-label',
     component: index_1.GraphLabel,
-    tags: ['docsPage'],
-    parameters: {
-        controls: { disable: true },
-    },
     decorators: [
         (Story) => ((0, jsx_runtime_1.jsx)("div", { className: "n-flex n-justify-center", children: (0, jsx_runtime_1.jsx)(Story, {}) })),
     ],
+    id: 'components-graph-label',
+    parameters: {
+        controls: { disable: true },
+    },
+    tags: ['docsPage'],
+    title: 'Components/GraphLabel',
 };
 exports.default = componentMeta;
 exports.Types = {
     args: {},
-    render: _1.GraphLabelTypes,
     parameters: {
         docs: {
             source: {
+                code: _1.GraphLabelTypesSource,
                 language: 'tsx',
                 type: 'code',
-                code: _1.GraphLabelTypesSource,
             },
         },
     },
+    render: _1.GraphLabelTypes,
 };
 exports.Color = {
     args: {},
-    render: _1.GraphLabelColor,
     parameters: {
         docs: {
             source: {
+                code: _1.GraphLabelColorSource,
                 language: 'tsx',
                 type: 'code',
-                code: _1.GraphLabelColorSource,
             },
         },
     },
+    render: _1.GraphLabelColor,
 };
 exports.Sizes = {
     args: {},
-    render: _1.GraphLabelSizes,
     parameters: {
         docs: {
             source: {
+                code: _1.GraphLabelSizesSource,
                 language: 'tsx',
                 type: 'code',
-                code: _1.GraphLabelSizesSource,
             },
         },
     },
+    render: _1.GraphLabelSizes,
 };
 exports.Fluid = {
     args: {},
-    render: _1.GraphLabelFluid,
     parameters: {
         docs: {
             source: {
+                code: _1.GraphLabelFluidSource,
                 language: 'tsx',
                 type: 'code',
-                code: _1.GraphLabelFluidSource,
             },
         },
     },
+    render: _1.GraphLabelFluid,
 };
 exports.NonInteractive = {
     args: {},
-    render: _1.GraphLabelNonInteractive,
     parameters: {
         docs: {
             source: {
+                code: _1.GraphLabelNonInteractiveSource,
                 language: 'tsx',
                 type: 'code',
-                code: _1.GraphLabelNonInteractiveSource,
             },
         },
     },
+    render: _1.GraphLabelNonInteractive,
 };
 exports.Disabled = {
     args: {},
-    render: _1.GraphLabelDisabled,
     parameters: {
         docs: {
             source: {
+                code: _1.GraphLabelDisabledSource,
                 language: 'tsx',
                 type: 'code',
-                code: _1.GraphLabelDisabledSource,
             },
         },
     },
+    render: _1.GraphLabelDisabled,
 };
 exports.Selected = {
     args: {},
-    render: _1.GraphLabelSelected,
     parameters: {
         docs: {
             source: {
+                code: _1.GraphLabelSelectedSource,
                 language: 'tsx',
                 type: 'code',
-                code: _1.GraphLabelSelectedSource,
             },
         },
     },
+    render: _1.GraphLabelSelected,
 };
 //# sourceMappingURL=graph-label.stories.js.map

package/lib/cjs/graph-label/stories/graph-label.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"graph-label.stories.js","sourceRoot":"","sources":["../../../../src/graph-label/stories/graph-label.stories.tsx"],"names":[],"mappings":";;;;AAuBA,uCAAyC;AACzC,wBAeW;AAEX,MAAM,aAAa,GAA4B;IAC7C,KAAK,EAAE,uBAAuB;IAC9B,EAAE,EAAE,wBAAwB;IAC5B,SAAS,EAAE,kBAAU;IACrB,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,UAAU,EAAE;QACV,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE;KAC5B;IACD,UAAU,EAAE;QACV,CAAC,KAAK,EAAE,EAAE,CAAC,CACT,gCAAK,SAAS,EAAC,yBAAyB,YACtC,uBAAC,KAAK,KAAG,GACL,CACP;KACF;CACF,CAAC;AAEF,kBAAe,aAAa,CAAC;AAGhB,QAAA,KAAK,GAAU;IAC1B,IAAI,EAAE,EAAE;IACR,MAAM,EAAE,kBAAe;IACvB,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;gBACZ,IAAI,EAAE,wBAAqB;aAC5B;SACF;KACF;CACF,CAAC;AAEW,QAAA,KAAK,GAAU;IAC1B,IAAI,EAAE,EAAE;IACR,MAAM,EAAE,kBAAe;IACvB,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;gBACZ,IAAI,EAAE,wBAAqB;aAC5B;SACF;KACF;CACF,CAAC;AAEW,QAAA,KAAK,GAAU;IAC1B,IAAI,EAAE,EAAE;IACR,MAAM,EAAE,kBAAe;IACvB,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;gBACZ,IAAI,EAAE,wBAAqB;aAC5B;SACF;KACF;CACF,CAAC;AACW,QAAA,KAAK,GAAU;IAC1B,IAAI,EAAE,EAAE;IACR,MAAM,EAAE,kBAAe;IACvB,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;gBACZ,IAAI,EAAE,wBAAqB;aAC5B;SACF;KACF;CACF,CAAC;AAEW,QAAA,cAAc,GAAU;IACnC,IAAI,EAAE,EAAE;IACR,MAAM,EAAE,2BAAwB;IAChC,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;gBACZ,IAAI,EAAE,iCAA8B;aACrC;SACF;KACF;CACF,CAAC;AAEW,QAAA,QAAQ,GAAU;IAC7B,IAAI,EAAE,EAAE;IACR,MAAM,EAAE,qBAAkB;IAC1B,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;gBACZ,IAAI,EAAE,2BAAwB;aAC/B;SACF;KACF;CACF,CAAC;AAEW,QAAA,QAAQ,GAAU;IAC7B,IAAI,EAAE,EAAE;IACR,MAAM,EAAE,qBAAkB;IAC1B,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;gBACZ,IAAI,EAAE,2BAAwB;aAC/B;SACF;KACF;CACF,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 { type Meta, type StoryObj } from '@storybook/react-vite';\n\nimport { GraphLabel } from '../../index';\nimport {\n  GraphLabelColor,\n  GraphLabelColorSource,\n  GraphLabelDisabled,\n  GraphLabelDisabledSource,\n  GraphLabelFluid,\n  GraphLabelFluidSource,\n  GraphLabelNonInteractive,\n  GraphLabelNonInteractiveSource,\n  GraphLabelSelected,\n  GraphLabelSelectedSource,\n  GraphLabelSizes,\n  GraphLabelSizesSource,\n  GraphLabelTypes,\n  GraphLabelTypesSource,\n} from '.';\n\nconst componentMeta: Meta<typeof GraphLabel> = {\n  title: 'Components/GraphLabel',\n  id: 'components-graph-label',\n  component: GraphLabel,\n  tags: ['docsPage'],\n  parameters: {\n    controls: { disable: true },\n  },\n  decorators: [\n    (Story) => (\n      <div className=\"n-flex n-justify-center\">\n        <Story />\n      </div>\n    ),\n  ],\n};\n\nexport default componentMeta;\ntype Story = StoryObj<typeof componentMeta>;\n\nexport const Types: Story = {\n  args: {},\n  render: GraphLabelTypes,\n  parameters: {\n    docs: {\n      source: {\n        language: 'tsx',\n        type: 'code',\n        code: GraphLabelTypesSource,\n      },\n    },\n  },\n};\n\nexport const Color: Story = {\n  args: {},\n  render: GraphLabelColor,\n  parameters: {\n    docs: {\n      source: {\n        language: 'tsx',\n        type: 'code',\n        code: GraphLabelColorSource,\n      },\n    },\n  },\n};\n\nexport const Sizes: Story = {\n  args: {},\n  render: GraphLabelSizes,\n  parameters: {\n    docs: {\n      source: {\n        language: 'tsx',\n        type: 'code',\n        code: GraphLabelSizesSource,\n      },\n    },\n  },\n};\nexport const Fluid: Story = {\n  args: {},\n  render: GraphLabelFluid,\n  parameters: {\n    docs: {\n      source: {\n        language: 'tsx',\n        type: 'code',\n        code: GraphLabelFluidSource,\n      },\n    },\n  },\n};\n\nexport const NonInteractive: Story = {\n  args: {},\n  render: GraphLabelNonInteractive,\n  parameters: {\n    docs: {\n      source: {\n        language: 'tsx',\n        type: 'code',\n        code: GraphLabelNonInteractiveSource,\n      },\n    },\n  },\n};\n\nexport const Disabled: Story = {\n  args: {},\n  render: GraphLabelDisabled,\n  parameters: {\n    docs: {\n      source: {\n        language: 'tsx',\n        type: 'code',\n        code: GraphLabelDisabledSource,\n      },\n    },\n  },\n};\n\nexport const Selected: Story = {\n  args: {},\n  render: GraphLabelSelected,\n  parameters: {\n    docs: {\n      source: {\n        language: 'tsx',\n        type: 'code',\n        code: GraphLabelSelectedSource,\n      },\n    },\n  },\n};\n"]}
+{"version":3,"file":"graph-label.stories.js","sourceRoot":"","sources":["../../../../src/graph-label/stories/graph-label.stories.tsx"],"names":[],"mappings":";;;;AAuBA,uCAAyC;AACzC,wBAeW;AAEX,MAAM,aAAa,GAA4B;IAC7C,SAAS,EAAE,kBAAU;IACrB,UAAU,EAAE;QACV,CAAC,KAAK,EAAE,EAAE,CAAC,CACT,gCAAK,SAAS,EAAC,yBAAyB,YACtC,uBAAC,KAAK,KAAG,GACL,CACP;KACF;IACD,EAAE,EAAE,wBAAwB;IAC5B,UAAU,EAAE;QACV,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE;KAC5B;IACD,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,KAAK,EAAE,uBAAuB;CAC/B,CAAC;AAEF,kBAAe,aAAa,CAAC;AAGhB,QAAA,KAAK,GAAU;IAC1B,IAAI,EAAE,EAAE;IACR,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,wBAAqB;gBAC3B,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;aACb;SACF;KACF;IACD,MAAM,EAAE,kBAAe;CACxB,CAAC;AAEW,QAAA,KAAK,GAAU;IAC1B,IAAI,EAAE,EAAE;IACR,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,wBAAqB;gBAC3B,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;aACb;SACF;KACF;IACD,MAAM,EAAE,kBAAe;CACxB,CAAC;AAEW,QAAA,KAAK,GAAU;IAC1B,IAAI,EAAE,EAAE;IACR,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,wBAAqB;gBAC3B,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;aACb;SACF;KACF;IACD,MAAM,EAAE,kBAAe;CACxB,CAAC;AACW,QAAA,KAAK,GAAU;IAC1B,IAAI,EAAE,EAAE;IACR,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,wBAAqB;gBAC3B,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;aACb;SACF;KACF;IACD,MAAM,EAAE,kBAAe;CACxB,CAAC;AAEW,QAAA,cAAc,GAAU;IACnC,IAAI,EAAE,EAAE;IACR,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,iCAA8B;gBACpC,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;aACb;SACF;KACF;IACD,MAAM,EAAE,2BAAwB;CACjC,CAAC;AAEW,QAAA,QAAQ,GAAU;IAC7B,IAAI,EAAE,EAAE;IACR,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,2BAAwB;gBAC9B,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;aACb;SACF;KACF;IACD,MAAM,EAAE,qBAAkB;CAC3B,CAAC;AAEW,QAAA,QAAQ,GAAU;IAC7B,IAAI,EAAE,EAAE;IACR,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,2BAAwB;gBAC9B,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;aACb;SACF;KACF;IACD,MAAM,EAAE,qBAAkB;CAC3B,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 { type Meta, type StoryObj } from '@storybook/react-vite';\n\nimport { GraphLabel } from '../../index';\nimport {\n  GraphLabelColor,\n  GraphLabelColorSource,\n  GraphLabelDisabled,\n  GraphLabelDisabledSource,\n  GraphLabelFluid,\n  GraphLabelFluidSource,\n  GraphLabelNonInteractive,\n  GraphLabelNonInteractiveSource,\n  GraphLabelSelected,\n  GraphLabelSelectedSource,\n  GraphLabelSizes,\n  GraphLabelSizesSource,\n  GraphLabelTypes,\n  GraphLabelTypesSource,\n} from '.';\n\nconst componentMeta: Meta<typeof GraphLabel> = {\n  component: GraphLabel,\n  decorators: [\n    (Story) => (\n      <div className=\"n-flex n-justify-center\">\n        <Story />\n      </div>\n    ),\n  ],\n  id: 'components-graph-label',\n  parameters: {\n    controls: { disable: true },\n  },\n  tags: ['docsPage'],\n  title: 'Components/GraphLabel',\n};\n\nexport default componentMeta;\ntype Story = StoryObj<typeof componentMeta>;\n\nexport const Types: Story = {\n  args: {},\n  parameters: {\n    docs: {\n      source: {\n        code: GraphLabelTypesSource,\n        language: 'tsx',\n        type: 'code',\n      },\n    },\n  },\n  render: GraphLabelTypes,\n};\n\nexport const Color: Story = {\n  args: {},\n  parameters: {\n    docs: {\n      source: {\n        code: GraphLabelColorSource,\n        language: 'tsx',\n        type: 'code',\n      },\n    },\n  },\n  render: GraphLabelColor,\n};\n\nexport const Sizes: Story = {\n  args: {},\n  parameters: {\n    docs: {\n      source: {\n        code: GraphLabelSizesSource,\n        language: 'tsx',\n        type: 'code',\n      },\n    },\n  },\n  render: GraphLabelSizes,\n};\nexport const Fluid: Story = {\n  args: {},\n  parameters: {\n    docs: {\n      source: {\n        code: GraphLabelFluidSource,\n        language: 'tsx',\n        type: 'code',\n      },\n    },\n  },\n  render: GraphLabelFluid,\n};\n\nexport const NonInteractive: Story = {\n  args: {},\n  parameters: {\n    docs: {\n      source: {\n        code: GraphLabelNonInteractiveSource,\n        language: 'tsx',\n        type: 'code',\n      },\n    },\n  },\n  render: GraphLabelNonInteractive,\n};\n\nexport const Disabled: Story = {\n  args: {},\n  parameters: {\n    docs: {\n      source: {\n        code: GraphLabelDisabledSource,\n        language: 'tsx',\n        type: 'code',\n      },\n    },\n  },\n  render: GraphLabelDisabled,\n};\n\nexport const Selected: Story = {\n  args: {},\n  parameters: {\n    docs: {\n      source: {\n        code: GraphLabelSelectedSource,\n        language: 'tsx',\n        type: 'code',\n      },\n    },\n  },\n  render: GraphLabelSelected,\n};\n"]}

package/lib/cjs/hooks/index.js

@@ -68,7 +68,7 @@ function usePrevious(value) {
  */
 function useEffectDebugger(effectHook, dependencies, dependencyNames = []) {
     const previousDeps = usePrevious(dependencies);
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    // oxlint-disable-next-line @typescript-eslint/no-explicit-any
     const changedDeps = dependencies.reduce((accum, dependency, index) => {
         if (previousDeps === undefined) {
             return accum;
@@ -79,8 +79,8 @@ function useEffectDebugger(effectHook, dependencies, dependencyNames = []) {
         if (dependency !== previousDeps[index]) {
             const keyName = dependencyNames[index] || index;
             return Object.assign(Object.assign({}, accum), { [keyName]: {
-                    before: previousDeps[index],
                     after: dependency,
+                    before: previousDeps[index],
                 } });
         }
         return accum;
@@ -124,8 +124,8 @@ const useRenderDebugger = (componentName, propsAndStates) => {
         Object.entries(propsAndStates).forEach(([key, newValue]) => {
             if (prev.current[key] !== newValue) {
                 changedPropsOrState[key] = {
-                    old: prev.current[key],
                     new: newValue,
+                    old: prev.current[key],
                 };
             }
         }, {});