@neo4j-ndl/react 4.25.8 → 5.0.0-alpha.0.3d763f7

package/lib/esm/tag/stories/tag-sizes.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"tag-sizes.story.js","sourceRoot":"","sources":["../../../../src/tag/stories/tag-sizes.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AAEvC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,eAAK,SAAS,EAAC,qCAAqC,aAClD,KAAC,GAAG,IACF,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,GAAG,EAAE;oBACZ,OAAO,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC;gBACrC,CAAC,sBAGG,EACN,KAAC,GAAG,IACF,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,GAAG,EAAE;oBACZ,OAAO,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC;gBACrC,CAAC,uBAGG,EACN,KAAC,GAAG,IACF,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,GAAG,EAAE;oBACZ,OAAO,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC;gBACrC,CAAC,sBAGG,IACF,CACP,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 */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { Tag } from '@neo4j-ndl/react';\n\nconst Component = () => {\n  return (\n    <div className=\"n-flex n-gap-token-16 n-items-start\">\n      <Tag\n        size=\"small\"\n        onClick={() => {\n          console.info('onClick was called');\n        }}\n      >\n        Small\n      </Tag>\n      <Tag\n        size=\"medium\"\n        onClick={() => {\n          console.info('onClick was called');\n        }}\n      >\n        Medium\n      </Tag>\n      <Tag\n        size=\"large\"\n        onClick={() => {\n          console.info('onClick was called');\n        }}\n      >\n        Large\n      </Tag>\n    </div>\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"tag-sizes.story.js","sourceRoot":"","sources":["../../../../src/tag/stories/tag-sizes.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AAEvC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,eAAK,SAAS,EAAC,+BAA+B,aAC5C,KAAC,GAAG,IACF,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,GAAG,EAAE;oBACZ,OAAO,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC;gBACrC,CAAC,sBAGG,EACN,KAAC,GAAG,IACF,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,GAAG,EAAE;oBACZ,OAAO,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC;gBACrC,CAAC,uBAGG,EACN,KAAC,GAAG,IACF,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,GAAG,EAAE;oBACZ,OAAO,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC;gBACrC,CAAC,sBAGG,IACF,CACP,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 */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { Tag } from '@neo4j-ndl/react';\n\nconst Component = () => {\n  return (\n    <div className=\"flex gap-token-16 items-start\">\n      <Tag\n        size=\"small\"\n        onClick={() => {\n          console.info('onClick was called');\n        }}\n      >\n        Small\n      </Tag>\n      <Tag\n        size=\"medium\"\n        onClick={() => {\n          console.info('onClick was called');\n        }}\n      >\n        Medium\n      </Tag>\n      <Tag\n        size=\"large\"\n        onClick={() => {\n          console.info('onClick was called');\n        }}\n      >\n        Large\n      </Tag>\n    </div>\n  );\n};\n\nexport default Component;\n"]}

package/lib/esm/tag/stories/tag-types.story.js

@@ -22,7 +22,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import '@neo4j-ndl/base/lib/neo4j-ds-styles.css';
 import { Tag } from '@neo4j-ndl/react';
 const Component = () => {
-    return (_jsxs("div", { className: "n-flex n-gap-token-16", children: [_jsx(Tag, { type: "default", onClick: () => {
+    return (_jsxs("div", { className: "flex gap-token-16", children: [_jsx(Tag, { type: "default", onClick: () => {
                     console.info('onClick was called');
                 }, children: "Tag" }), _jsx(Tag, { type: "destructive", onClick: () => {
                     console.info('onClick was called');

package/lib/esm/tag/stories/tag-types.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"tag-types.story.js","sourceRoot":"","sources":["../../../../src/tag/stories/tag-types.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AAEvC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,eAAK,SAAS,EAAC,uBAAuB,aACpC,KAAC,GAAG,IACF,IAAI,EAAC,SAAS,EACd,OAAO,EAAE,GAAG,EAAE;oBACZ,OAAO,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC;gBACrC,CAAC,oBAGG,EACN,KAAC,GAAG,IACF,IAAI,EAAC,aAAa,EAClB,OAAO,EAAE,GAAG,EAAE;oBACZ,OAAO,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC;gBACrC,CAAC,0BAGG,IACF,CACP,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 */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { Tag } from '@neo4j-ndl/react';\n\nconst Component = () => {\n  return (\n    <div className=\"n-flex n-gap-token-16\">\n      <Tag\n        type=\"default\"\n        onClick={() => {\n          console.info('onClick was called');\n        }}\n      >\n        Tag\n      </Tag>\n      <Tag\n        type=\"destructive\"\n        onClick={() => {\n          console.info('onClick was called');\n        }}\n      >\n        Clear all\n      </Tag>\n    </div>\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"tag-types.story.js","sourceRoot":"","sources":["../../../../src/tag/stories/tag-types.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,GAAG,EAAE,MAAM,kBAAkB,CAAC;AAEvC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,eAAK,SAAS,EAAC,mBAAmB,aAChC,KAAC,GAAG,IACF,IAAI,EAAC,SAAS,EACd,OAAO,EAAE,GAAG,EAAE;oBACZ,OAAO,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC;gBACrC,CAAC,oBAGG,EACN,KAAC,GAAG,IACF,IAAI,EAAC,aAAa,EAClB,OAAO,EAAE,GAAG,EAAE;oBACZ,OAAO,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC;gBACrC,CAAC,0BAGG,IACF,CACP,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 */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { Tag } from '@neo4j-ndl/react';\n\nconst Component = () => {\n  return (\n    <div className=\"flex gap-token-16\">\n      <Tag\n        type=\"default\"\n        onClick={() => {\n          console.info('onClick was called');\n        }}\n      >\n        Tag\n      </Tag>\n      <Tag\n        type=\"destructive\"\n        onClick={() => {\n          console.info('onClick was called');\n        }}\n      >\n        Clear all\n      </Tag>\n    </div>\n  );\n};\n\nexport default Component;\n"]}

package/lib/esm/tag-base/stories/tag-variants.story.js

@@ -24,7 +24,7 @@ import { DismissibleTag, ReadOnlyTag, SelectableTag } from '@neo4j-ndl/react';
 import { useState } from 'react';
 const Component = () => {
     const [isSelected, setIsSelected] = useState(false);
-    return (_jsxs("div", { className: "n-flex n-flex-col n-gap-token-8 n-items-start", children: [_jsx(ReadOnlyTag, { children: "Read-only" }), _jsx(DismissibleTag, { onRemove: () => console.info('DismissibleTag onRemove was called'), children: "Dismissible" }), _jsx(SelectableTag, { isSelected: isSelected, onClick: () => setIsSelected(!isSelected), children: "Selectable" })] }));
+    return (_jsxs("div", { className: "flex flex-col gap-token-8 items-start", children: [_jsx(ReadOnlyTag, { children: "Read-only" }), _jsx(DismissibleTag, { onRemove: () => console.info('DismissibleTag onRemove was called'), children: "Dismissible" }), _jsx(SelectableTag, { isSelected: isSelected, onClick: () => setIsSelected(!isSelected), children: "Selectable" })] }));
 };
 export default Component;
 //# sourceMappingURL=tag-variants.story.js.map

package/lib/esm/tag-base/stories/tag-variants.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"tag-variants.story.js","sourceRoot":"","sources":["../../../../src/tag-base/stories/tag-variants.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,cAAc,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAC9E,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEpD,OAAO,CACL,eAAK,SAAS,EAAC,+CAA+C,aAC5D,KAAC,WAAW,4BAAwB,EACpC,KAAC,cAAc,IACb,QAAQ,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,oCAAoC,CAAC,4BAGnD,EACjB,KAAC,aAAa,IACZ,UAAU,EAAE,UAAU,EACtB,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,CAAC,UAAU,CAAC,2BAG3B,IACZ,CACP,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 */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { DismissibleTag, ReadOnlyTag, SelectableTag } from '@neo4j-ndl/react';\nimport { useState } from 'react';\n\nconst Component = () => {\n  const [isSelected, setIsSelected] = useState(false);\n\n  return (\n    <div className=\"n-flex n-flex-col n-gap-token-8 n-items-start\">\n      <ReadOnlyTag>Read-only</ReadOnlyTag>\n      <DismissibleTag\n        onRemove={() => console.info('DismissibleTag onRemove was called')}\n      >\n        Dismissible\n      </DismissibleTag>\n      <SelectableTag\n        isSelected={isSelected}\n        onClick={() => setIsSelected(!isSelected)}\n      >\n        Selectable\n      </SelectableTag>\n    </div>\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"tag-variants.story.js","sourceRoot":"","sources":["../../../../src/tag-base/stories/tag-variants.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,cAAc,EAAE,WAAW,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAC9E,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEpD,OAAO,CACL,eAAK,SAAS,EAAC,uCAAuC,aACpD,KAAC,WAAW,4BAAwB,EACpC,KAAC,cAAc,IACb,QAAQ,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,oCAAoC,CAAC,4BAGnD,EACjB,KAAC,aAAa,IACZ,UAAU,EAAE,UAAU,EACtB,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,CAAC,UAAU,CAAC,2BAG3B,IACZ,CACP,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 */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { DismissibleTag, ReadOnlyTag, SelectableTag } from '@neo4j-ndl/react';\nimport { useState } from 'react';\n\nconst Component = () => {\n  const [isSelected, setIsSelected] = useState(false);\n\n  return (\n    <div className=\"flex flex-col gap-token-8 items-start\">\n      <ReadOnlyTag>Read-only</ReadOnlyTag>\n      <DismissibleTag\n        onRemove={() => console.info('DismissibleTag onRemove was called')}\n      >\n        Dismissible\n      </DismissibleTag>\n      <SelectableTag\n        isSelected={isSelected}\n        onClick={() => setIsSelected(!isSelected)}\n      >\n        Selectable\n      </SelectableTag>\n    </div>\n  );\n};\n\nexport default Component;\n"]}

package/lib/esm/text-area/stories/text-area-sizes.story.js

@@ -22,7 +22,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import '@neo4j-ndl/base/lib/neo4j-ds-styles.css';
 import { TextArea } from '@neo4j-ndl/react';
 const Component = () => {
-    return (_jsxs("div", { className: "n-flex n-gap-6", children: [_jsx(TextArea, { label: "Small text area", size: "small" }), _jsx(TextArea, { label: "Medium text area", size: "medium" }), _jsx(TextArea, { label: "Large text area", size: "large" })] }));
+    return (_jsxs("div", { className: "flex gap-6", children: [_jsx(TextArea, { label: "Small text area", size: "small" }), _jsx(TextArea, { label: "Medium text area", size: "medium" }), _jsx(TextArea, { label: "Large text area", size: "large" })] }));
 };
 export default Component;
 //# sourceMappingURL=text-area-sizes.story.js.map

package/lib/esm/text-area/stories/text-area-sizes.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"text-area-sizes.story.js","sourceRoot":"","sources":["../../../../src/text-area/stories/text-area-sizes.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAE5C,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,eAAK,SAAS,EAAC,gBAAgB,aAC7B,KAAC,QAAQ,IAAC,KAAK,EAAC,iBAAiB,EAAC,IAAI,EAAC,OAAO,GAAG,EACjD,KAAC,QAAQ,IAAC,KAAK,EAAC,kBAAkB,EAAC,IAAI,EAAC,QAAQ,GAAG,EACnD,KAAC,QAAQ,IAAC,KAAK,EAAC,iBAAiB,EAAC,IAAI,EAAC,OAAO,GAAG,IAC7C,CACP,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 */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { TextArea } from '@neo4j-ndl/react';\n\nconst Component = () => {\n  return (\n    <div className=\"n-flex n-gap-6\">\n      <TextArea label=\"Small text area\" size=\"small\" />\n      <TextArea label=\"Medium text area\" size=\"medium\" />\n      <TextArea label=\"Large text area\" size=\"large\" />\n    </div>\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"text-area-sizes.story.js","sourceRoot":"","sources":["../../../../src/text-area/stories/text-area-sizes.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAE5C,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,eAAK,SAAS,EAAC,YAAY,aACzB,KAAC,QAAQ,IAAC,KAAK,EAAC,iBAAiB,EAAC,IAAI,EAAC,OAAO,GAAG,EACjD,KAAC,QAAQ,IAAC,KAAK,EAAC,kBAAkB,EAAC,IAAI,EAAC,QAAQ,GAAG,EACnD,KAAC,QAAQ,IAAC,KAAK,EAAC,iBAAiB,EAAC,IAAI,EAAC,OAAO,GAAG,IAC7C,CACP,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 */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { TextArea } from '@neo4j-ndl/react';\n\nconst Component = () => {\n  return (\n    <div className=\"flex gap-6\">\n      <TextArea label=\"Small text area\" size=\"small\" />\n      <TextArea label=\"Medium text area\" size=\"medium\" />\n      <TextArea label=\"Large text area\" size=\"large\" />\n    </div>\n  );\n};\n\nexport default Component;\n"]}

package/lib/esm/text-input/TextInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextInput.js","sourceRoot":"","sources":["../../../src/text-input/TextInput.tsx"],"names":[],"mappings":"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","sourcesContent":["/*!\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport classNames from 'classnames';\nimport {\n  type InputHTMLAttributes,\n  type ReactElement,\n  type ReactNode,\n  useId,\n  useMemo,\n} from 'react';\n\nimport {\n  FormFieldLabel,\n  FormFieldMessage,\n  useFormField,\n} from '../_common/form-control';\nimport { customLabelAndNoAriaLabelWarningMessage } from '../_common/messages';\nimport { type CommonProps, type TooltipObjectProps } from '../_common/types';\nimport { useSemiControlledInput } from '../_common/use-semi-controlled-input';\nimport { needleWarningMessage } from '../_common/utils';\nimport { XMarkIconOutline } from '../icons/generated/heroIcons/XMarkIconOutline';\nimport { LoadingSpinner } from '../loading-spinner';\nimport { Skeleton } from '../skeleton';\n\n/**\n * @remarks\n * When `moreInformationText` is provided, a tooltip is rendered next to the label, and the `tooltipProps` prop is used to configure the tooltip. The `TooltipObjectProps` type is defined as: `{ root?: Partial<React.ComponentProps<typeof Tooltip>>; trigger?: Partial<React.ComponentProps<typeof Tooltip.Trigger>>; content?: Partial<React.ComponentProps<typeof Tooltip.Content>>; }`, see the Tooltip component for more details.\n *\n * @remarks\n * When `isSkeletonLoading` is true, the input is rendered as a loading skeleton and the `skeletonProps` prop is used to configure the skeleton. For more information, see the Skeleton documentation.\n */\ntype TextInputProps = {\n  /** Assistive text displayed below the input */\n  helpText?: string | ReactNode;\n\n  /** Error message displayed below the input. When provided, it overrides `helpText` and shows an error icon */\n  errorText?: string | ReactNode;\n\n  /** Leading element rendered inside the input */\n  leadingElement?: ReactElement;\n\n  /** Trailing element rendered inside the input */\n  trailingElement?: ReactElement;\n\n  /** Size of the input */\n  size?: 'small' | 'medium' | 'large';\n\n  /** Whether the input is read-only */\n  isReadOnly?: boolean;\n\n  /**\n   *  Whether to display the Required/Optional label next to the field label.\n   *  Shows Required if isRequired is true, otherwise shows Optional.\n   * @default false\n   */\n  // TODO v5: inconsistent naming. The same switch is `hasRequiredIndicator` on\n  // Combobox and on the internal form control this maps onto, and `isOptional`\n  // on TextArea. The name also needs the disable below, which a name using one\n  // of the allowed boolean prefixes would not.\n  // eslint-disable-next-line @typescript-eslint/naming-convention\n  showRequiredOrOptionalLabel?: boolean;\n\n  /** Whether the input is disabled */\n  isDisabled?: boolean;\n\n  /** Whether the input is required */\n  isRequired?: boolean;\n\n  /** The current value of the input */\n  value?: React.ComponentPropsWithoutRef<'input'>['value'];\n\n  /** Placeholder text displayed when the input is empty */\n  placeholder?: React.ComponentPropsWithoutRef<'input'>['placeholder'];\n\n  /** Callback function triggered when the input value changes */\n  onChange?: React.ComponentPropsWithoutRef<'input'>['onChange'];\n\n  /** Whether the input should take the full available width */\n  isFluid?: boolean;\n\n  /** Text displayed in the information tooltip shown next to the label */\n  moreInformationText?: React.ReactNode;\n\n  // TODO v5: inconsistent naming. Every form control names itself differently:\n  // the label is optional here and a design with no room for it reaches for\n  // htmlAttributes['aria-label'], TextArea, Select, Checkbox, Radio and Switch\n  // expose an `ariaLabel` prop instead, and Combobox requires the label and\n  // clips it with `hasVisuallyHiddenLabel`.\n  /** The label displayed above the input */\n  label?: string | React.ReactNode;\n\n  /** Props for the Tooltip component used by the information icon */\n  tooltipProps?: TooltipObjectProps;\n\n  /** Whether to render skeletons instead of content */\n  isSkeletonLoading?: boolean;\n\n  /** Additional props forwarded to the underlying Skeleton components */\n  skeletonProps?: React.ComponentProps<typeof Skeleton>;\n\n  /** Whether to show the clear button */\n  isClearable?: boolean;\n\n  /** Whether to show the loading spinner */\n  isLoading?: boolean;\n};\n\n/**\n *\n *\n * TextInput Component\n *\n *\n */\n\nexport const TextInput = ({\n  label,\n  isFluid,\n  errorText,\n  helpText,\n  leadingElement,\n  trailingElement,\n  showRequiredOrOptionalLabel = false,\n  moreInformationText,\n  size = 'medium',\n  placeholder,\n  value,\n  tooltipProps,\n  htmlAttributes,\n  isDisabled,\n  isReadOnly,\n  isRequired,\n  onChange,\n  isClearable = false,\n  className,\n  style,\n  isSkeletonLoading = false,\n  isLoading = false,\n  skeletonProps,\n  ref,\n  ...restProps\n}: CommonProps<'input', TextInputProps>) => {\n  const [currentValue, handleChange] = useSemiControlledInput({\n    inputType: 'text',\n    isControlled: value !== undefined,\n    onChange,\n    state: value ?? '',\n  });\n  const hintId = useId();\n  const canClear = isClearable && isDisabled !== true;\n  const shouldRenderHint = canClear || isLoading;\n  const { field, controlProps } = useFormField({\n    errorText,\n    // The clear/loading hint describes the input alongside the message.\n    extraDescribedByIds: [shouldRenderHint && hintId],\n    hasRequiredIndicator: showRequiredOrOptionalLabel,\n    helpText,\n    isRequired,\n    label,\n  });\n\n  const containerWrappingClasses = classNames(`ndl-text-input`, className, {\n    'ndl-disabled': isDisabled,\n    'ndl-has-error': errorText,\n    'ndl-has-icon': leadingElement || trailingElement || errorText,\n    'ndl-has-leading-icon': leadingElement,\n    'ndl-has-trailing-icon': trailingElement || errorText,\n    'ndl-large': size === 'large',\n    'ndl-medium': size === 'medium',\n    'ndl-read-only': isReadOnly,\n    'ndl-small': size === 'small',\n  });\n\n  const hasEmptyLabelValue =\n    label === undefined || label === null || label === '';\n\n  const labelWrappingClasses = classNames('ndl-text-input-label', {\n    'ndl-fluid': isFluid,\n  });\n\n  const combinedHtmlInputAttributes: InputHTMLAttributes<HTMLInputElement> = {\n    ...htmlAttributes,\n    className: classNames('ndl-input', htmlAttributes?.className),\n  };\n  const ariaLabel = combinedHtmlInputAttributes['aria-label'];\n  const isCustomLabel = Boolean(label) && typeof label !== 'string';\n  const hasCustomLabelAndNoAriaLabel =\n    isCustomLabel && (ariaLabel === undefined || ariaLabel === '');\n\n  const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n    if (canClear && event.key === 'Escape' && Boolean(currentValue)) {\n      event.preventDefault();\n      event.stopPropagation();\n      handleChange?.({\n        target: { value: '' },\n      } as React.ChangeEvent<HTMLInputElement>);\n    }\n    htmlAttributes?.onKeyDown?.(event);\n  };\n\n  useMemo(() => {\n    if (!label && !ariaLabel) {\n      needleWarningMessage(\n        'A TextInput without a label does not have an aria label, be sure to include an aria label for screen readers. Link: https://dequeuniversity.com/rules/axe/4.2/label?application=axeAPI',\n      );\n    }\n\n    if (hasCustomLabelAndNoAriaLabel) {\n      needleWarningMessage(customLabelAndNoAriaLabelWarningMessage);\n    }\n  }, [label, ariaLabel, hasCustomLabelAndNoAriaLabel]);\n\n  return (\n    <div className={containerWrappingClasses} style={style}>\n      {/* We enable implicit label wrapping */}\n      {/* Source: https://dequeuniversity.com/rules/axe/4.2/label?application=axeAPI */}\n      <label className={labelWrappingClasses}>\n        {!hasEmptyLabelValue && (\n          <FormFieldLabel\n            field={field}\n            size={size}\n            association=\"implicit\"\n            moreInformationText={moreInformationText}\n            tooltipProps={tooltipProps}\n            wrap={(row) => (\n              <Skeleton\n                onBackground=\"weak\"\n                shape=\"rectangular\"\n                {...skeletonProps}\n                isLoading={isSkeletonLoading}\n              >\n                {row}\n              </Skeleton>\n            )}\n          />\n        )}\n        <Skeleton\n          onBackground=\"weak\"\n          shape=\"rectangular\"\n          {...skeletonProps}\n          isLoading={isSkeletonLoading}\n        >\n          <div className=\"ndl-input-wrapper\">\n            {(leadingElement || (isLoading && !trailingElement)) && (\n              <div className=\"ndl-element-leading ndl-element\">\n                {isLoading ? (\n                  <LoadingSpinner\n                    size={size === 'large' ? 'medium' : 'small'}\n                    className={\n                      size === 'large'\n                        ? 'ndl-medium-spinner'\n                        : 'ndl-small-spinner'\n                    }\n                  />\n                ) : (\n                  leadingElement\n                )}\n              </div>\n            )}\n            <div\n              className={classNames('ndl-input-container', {\n                'ndl-clearable': isClearable,\n              })}\n            >\n              <input\n                ref={ref}\n                readOnly={isReadOnly}\n                disabled={isDisabled}\n                required={isRequired}\n                value={currentValue}\n                placeholder={placeholder}\n                type=\"text\"\n                onChange={handleChange}\n                {...controlProps}\n                {...combinedHtmlInputAttributes}\n                onKeyDown={handleInputKeyDown}\n                {...restProps}\n              />\n              {shouldRenderHint && (\n                <span\n                  id={hintId}\n                  className=\"ndl-text-input-hint\"\n                  aria-hidden={true}\n                >\n                  {isLoading && 'Loading '}\n                  {canClear && 'Press Escape to clear input.'}\n                </span>\n              )}\n              {canClear && Boolean(currentValue) && (\n                <div className=\"ndl-element-clear ndl-element\">\n                  <button\n                    tabIndex={-1}\n                    aria-hidden={true}\n                    type=\"button\"\n                    title=\"Clear input (Esc)\"\n                    onClick={() => {\n                      handleChange?.({\n                        target: { value: '' },\n                      } as React.ChangeEvent<HTMLInputElement>);\n                    }}\n                  >\n                    <XMarkIconOutline />\n                  </button>\n                </div>\n              )}\n            </div>\n            {trailingElement && (\n              <div className=\"ndl-element-trailing ndl-element\">\n                {isLoading && !leadingElement ? (\n                  <LoadingSpinner\n                    size={size === 'large' ? 'medium' : 'small'}\n                    className={\n                      size === 'large'\n                        ? 'ndl-medium-spinner'\n                        : 'ndl-small-spinner'\n                    }\n                  />\n                ) : (\n                  trailingElement\n                )}\n              </div>\n            )}\n          </div>\n        </Skeleton>\n      </label>\n\n      <FormFieldMessage\n        field={field}\n        size={size}\n        wrap={(content) => (\n          <Skeleton\n            onBackground=\"weak\"\n            shape=\"rectangular\"\n            {...skeletonProps}\n            isLoading={isSkeletonLoading}\n          >\n            {content}\n          </Skeleton>\n        )}\n      />\n    </div>\n  );\n};\n"]}
+{"version":3,"file":"TextInput.js","sourceRoot":"","sources":["../../../src/text-input/TextInput.tsx"],"names":[],"mappings":"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","sourcesContent":["/*!\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport classNames from 'classnames';\nimport {\n  type InputHTMLAttributes,\n  type ReactElement,\n  type ReactNode,\n  useId,\n  useMemo,\n} from 'react';\n\nimport {\n  FormFieldLabel,\n  FormFieldMessage,\n  useFormField,\n} from '../_common/form-control';\nimport { customLabelAndNoAriaLabelWarningMessage } from '../_common/messages';\nimport { type CommonProps, type TooltipObjectProps } from '../_common/types';\nimport { useSemiControlledInput } from '../_common/use-semi-controlled-input';\nimport { needleWarningMessage } from '../_common/utils';\nimport { XMarkIconOutline } from '../icons/generated/heroIcons/XMarkIconOutline';\nimport { LoadingSpinner } from '../loading-spinner';\nimport { Skeleton } from '../skeleton';\n\n/**\n * @remarks\n * When `moreInformationText` is provided, a tooltip is rendered next to the label, and the `tooltipProps` prop is used to configure the tooltip. The `TooltipObjectProps` type is defined as: `{ root?: Partial<React.ComponentProps<typeof Tooltip>>; trigger?: Partial<React.ComponentProps<typeof Tooltip.Trigger>>; content?: Partial<React.ComponentProps<typeof Tooltip.Content>>; }`, see the Tooltip component for more details.\n *\n * @remarks\n * When `isSkeletonLoading` is true, the input is rendered as a loading skeleton and the `skeletonProps` prop is used to configure the skeleton. For more information, see the Skeleton documentation.\n */\ntype TextInputProps = {\n  /** Assistive text displayed below the input */\n  helpText?: string | ReactNode;\n\n  /** Error message displayed below the input. When provided, it overrides `helpText` and shows an error icon */\n  errorText?: string | ReactNode;\n\n  /** Leading element rendered inside the input */\n  leadingElement?: ReactElement;\n\n  /** Trailing element rendered inside the input */\n  trailingElement?: ReactElement;\n\n  /** Size of the input */\n  size?: 'small' | 'medium' | 'large';\n\n  /** Whether the input is read-only */\n  isReadOnly?: boolean;\n\n  /**\n   *  Whether to display the Required/Optional label next to the field label.\n   *  Shows Required if isRequired is true, otherwise shows Optional.\n   * @default false\n   */\n  // TODO: inconsistent naming. The same switch is `hasRequiredIndicator` on\n  // Combobox and on the internal form control this maps onto, and `isOptional`\n  // on TextArea. The name also needs the disable below, which a name using one\n  // of the allowed boolean prefixes would not.\n  // eslint-disable-next-line @typescript-eslint/naming-convention\n  showRequiredOrOptionalLabel?: boolean;\n\n  /** Whether the input is disabled */\n  isDisabled?: boolean;\n\n  /** Whether the input is required */\n  isRequired?: boolean;\n\n  /** The current value of the input */\n  value?: React.ComponentPropsWithoutRef<'input'>['value'];\n\n  /** Placeholder text displayed when the input is empty */\n  placeholder?: React.ComponentPropsWithoutRef<'input'>['placeholder'];\n\n  /** Callback function triggered when the input value changes */\n  onChange?: React.ComponentPropsWithoutRef<'input'>['onChange'];\n\n  /** Whether the input should take the full available width */\n  isFluid?: boolean;\n\n  /** Text displayed in the information tooltip shown next to the label */\n  moreInformationText?: React.ReactNode;\n\n  // TODO v5: inconsistent naming. Every form control names itself differently:\n  // the label is optional here and a design with no room for it reaches for\n  // htmlAttributes['aria-label'], TextArea, Select, Checkbox, Radio and Switch\n  // expose an `ariaLabel` prop instead, and Combobox requires the label and\n  // clips it with `hasVisuallyHiddenLabel`.\n  /** The label displayed above the input */\n  label?: string | React.ReactNode;\n\n  /** Props for the Tooltip component used by the information icon */\n  tooltipProps?: TooltipObjectProps;\n\n  /** Whether to render skeletons instead of content */\n  isSkeletonLoading?: boolean;\n\n  /** Additional props forwarded to the underlying Skeleton components */\n  skeletonProps?: React.ComponentProps<typeof Skeleton>;\n\n  /** Whether to show the clear button */\n  isClearable?: boolean;\n\n  /** Whether to show the loading spinner */\n  isLoading?: boolean;\n};\n\n/**\n *\n *\n * TextInput Component\n *\n *\n */\n\nexport const TextInput = ({\n  label,\n  isFluid,\n  errorText,\n  helpText,\n  leadingElement,\n  trailingElement,\n  showRequiredOrOptionalLabel = false,\n  moreInformationText,\n  size = 'medium',\n  placeholder,\n  value,\n  tooltipProps,\n  htmlAttributes,\n  isDisabled,\n  isReadOnly,\n  isRequired,\n  onChange,\n  isClearable = false,\n  className,\n  style,\n  isSkeletonLoading = false,\n  isLoading = false,\n  skeletonProps,\n  ref,\n  ...restProps\n}: CommonProps<'input', TextInputProps>) => {\n  const [currentValue, handleChange] = useSemiControlledInput({\n    inputType: 'text',\n    isControlled: value !== undefined,\n    onChange,\n    state: value ?? '',\n  });\n  const hintId = useId();\n  const canClear = isClearable && isDisabled !== true;\n  const shouldRenderHint = canClear || isLoading;\n  const { field, controlProps } = useFormField({\n    errorText,\n    // The clear/loading hint describes the input alongside the message.\n    extraDescribedByIds: [shouldRenderHint && hintId],\n    hasRequiredIndicator: showRequiredOrOptionalLabel,\n    helpText,\n    isRequired,\n    label,\n  });\n\n  const containerWrappingClasses = classNames(`ndl-text-input`, className, {\n    'ndl-disabled': isDisabled,\n    'ndl-has-error': errorText,\n    'ndl-has-icon': leadingElement || trailingElement || errorText,\n    'ndl-has-leading-icon': leadingElement,\n    'ndl-has-trailing-icon': trailingElement || errorText,\n    'ndl-large': size === 'large',\n    'ndl-medium': size === 'medium',\n    'ndl-read-only': isReadOnly,\n    'ndl-small': size === 'small',\n  });\n\n  const hasEmptyLabelValue =\n    label === undefined || label === null || label === '';\n\n  const labelWrappingClasses = classNames('ndl-text-input-label', {\n    'ndl-fluid': isFluid,\n  });\n\n  const combinedHtmlInputAttributes: InputHTMLAttributes<HTMLInputElement> = {\n    ...htmlAttributes,\n    className: classNames('ndl-input', htmlAttributes?.className),\n  };\n  const ariaLabel = combinedHtmlInputAttributes['aria-label'];\n  const isCustomLabel = Boolean(label) && typeof label !== 'string';\n  const hasCustomLabelAndNoAriaLabel =\n    isCustomLabel && (ariaLabel === undefined || ariaLabel === '');\n\n  const handleInputKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n    if (canClear && event.key === 'Escape' && Boolean(currentValue)) {\n      event.preventDefault();\n      event.stopPropagation();\n      handleChange?.({\n        target: { value: '' },\n      } as React.ChangeEvent<HTMLInputElement>);\n    }\n    htmlAttributes?.onKeyDown?.(event);\n  };\n\n  useMemo(() => {\n    if (!label && !ariaLabel) {\n      needleWarningMessage(\n        'A TextInput without a label does not have an aria label, be sure to include an aria label for screen readers. Link: https://dequeuniversity.com/rules/axe/4.2/label?application=axeAPI',\n      );\n    }\n\n    if (hasCustomLabelAndNoAriaLabel) {\n      needleWarningMessage(customLabelAndNoAriaLabelWarningMessage);\n    }\n  }, [label, ariaLabel, hasCustomLabelAndNoAriaLabel]);\n\n  return (\n    <div className={containerWrappingClasses} style={style}>\n      {/* We enable implicit label wrapping */}\n      {/* Source: https://dequeuniversity.com/rules/axe/4.2/label?application=axeAPI */}\n      <label className={labelWrappingClasses}>\n        {!hasEmptyLabelValue && (\n          <FormFieldLabel\n            field={field}\n            size={size}\n            association=\"implicit\"\n            moreInformationText={moreInformationText}\n            tooltipProps={tooltipProps}\n            wrap={(row) => (\n              <Skeleton\n                onBackground=\"weak\"\n                shape=\"rectangular\"\n                {...skeletonProps}\n                isLoading={isSkeletonLoading}\n              >\n                {row}\n              </Skeleton>\n            )}\n          />\n        )}\n        <Skeleton\n          onBackground=\"weak\"\n          shape=\"rectangular\"\n          {...skeletonProps}\n          isLoading={isSkeletonLoading}\n        >\n          <div className=\"ndl-input-wrapper\">\n            {(leadingElement || (isLoading && !trailingElement)) && (\n              <div className=\"ndl-element-leading ndl-element\">\n                {isLoading ? (\n                  <LoadingSpinner\n                    size={size === 'large' ? 'medium' : 'small'}\n                    className={\n                      size === 'large'\n                        ? 'ndl-medium-spinner'\n                        : 'ndl-small-spinner'\n                    }\n                  />\n                ) : (\n                  leadingElement\n                )}\n              </div>\n            )}\n            <div\n              className={classNames('ndl-input-container', {\n                'ndl-clearable': isClearable,\n              })}\n            >\n              <input\n                ref={ref}\n                readOnly={isReadOnly}\n                disabled={isDisabled}\n                required={isRequired}\n                value={currentValue}\n                placeholder={placeholder}\n                type=\"text\"\n                onChange={handleChange}\n                {...controlProps}\n                {...combinedHtmlInputAttributes}\n                onKeyDown={handleInputKeyDown}\n                {...restProps}\n              />\n              {shouldRenderHint && (\n                <span\n                  id={hintId}\n                  className=\"ndl-text-input-hint\"\n                  aria-hidden={true}\n                >\n                  {isLoading && 'Loading '}\n                  {canClear && 'Press Escape to clear input.'}\n                </span>\n              )}\n              {canClear && Boolean(currentValue) && (\n                <div className=\"ndl-element-clear ndl-element\">\n                  <button\n                    tabIndex={-1}\n                    aria-hidden={true}\n                    type=\"button\"\n                    title=\"Clear input (Esc)\"\n                    onClick={() => {\n                      handleChange?.({\n                        target: { value: '' },\n                      } as React.ChangeEvent<HTMLInputElement>);\n                    }}\n                  >\n                    <XMarkIconOutline />\n                  </button>\n                </div>\n              )}\n            </div>\n            {trailingElement && (\n              <div className=\"ndl-element-trailing ndl-element\">\n                {isLoading && !leadingElement ? (\n                  <LoadingSpinner\n                    size={size === 'large' ? 'medium' : 'small'}\n                    className={\n                      size === 'large'\n                        ? 'ndl-medium-spinner'\n                        : 'ndl-small-spinner'\n                    }\n                  />\n                ) : (\n                  trailingElement\n                )}\n              </div>\n            )}\n          </div>\n        </Skeleton>\n      </label>\n\n      <FormFieldMessage\n        field={field}\n        size={size}\n        wrap={(content) => (\n          <Skeleton\n            onBackground=\"weak\"\n            shape=\"rectangular\"\n            {...skeletonProps}\n            isLoading={isSkeletonLoading}\n          >\n            {content}\n          </Skeleton>\n        )}\n      />\n    </div>\n  );\n};\n"]}

package/lib/esm/text-input/stories/text-input-loading-spinner.story.js

@@ -23,7 +23,7 @@ import '@neo4j-ndl/base/lib/neo4j-ds-styles.css';
 import { TextInput } from '@neo4j-ndl/react';
 import { CalendarDaysIconOutline } from '@neo4j-ndl/react/icons';
 const Component = () => {
-    return (_jsxs("div", { className: "n-flex n-flex-col n-gap-token-16", children: [_jsx(TextInput, { label: "Default loading", isLoading: true, placeholder: "Placeholder", htmlAttributes: { id: 'text-input-loading' } }), _jsx(TextInput, { label: "With leading element", isLoading: true, leadingElement: _jsx(CalendarDaysIconOutline, {}), placeholder: "Placeholder", htmlAttributes: { id: 'text-input-loading-leading' } }), _jsx(TextInput, { label: "With trailing element", isLoading: true, trailingElement: _jsx(CalendarDaysIconOutline, {}), placeholder: "Placeholder", htmlAttributes: { id: 'text-input-loading-trailing' } }), _jsx(TextInput, { label: "With leading and trailing element", isLoading: true, leadingElement: _jsx(CalendarDaysIconOutline, {}), trailingElement: _jsx(CalendarDaysIconOutline, {}), placeholder: "Placeholder", htmlAttributes: { id: 'text-input-loading-both' } })] }));
+    return (_jsxs("div", { className: "flex flex-col gap-token-16", children: [_jsx(TextInput, { label: "Default loading", isLoading: true, placeholder: "Placeholder", htmlAttributes: { id: 'text-input-loading' } }), _jsx(TextInput, { label: "With leading element", isLoading: true, leadingElement: _jsx(CalendarDaysIconOutline, {}), placeholder: "Placeholder", htmlAttributes: { id: 'text-input-loading-leading' } }), _jsx(TextInput, { label: "With trailing element", isLoading: true, trailingElement: _jsx(CalendarDaysIconOutline, {}), placeholder: "Placeholder", htmlAttributes: { id: 'text-input-loading-trailing' } }), _jsx(TextInput, { label: "With leading and trailing element", isLoading: true, leadingElement: _jsx(CalendarDaysIconOutline, {}), trailingElement: _jsx(CalendarDaysIconOutline, {}), placeholder: "Placeholder", htmlAttributes: { id: 'text-input-loading-both' } })] }));
 };
 export default Component;
 //# sourceMappingURL=text-input-loading-spinner.story.js.map

package/lib/esm/text-input/stories/text-input-loading-spinner.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"text-input-loading-spinner.story.js","sourceRoot":"","sources":["../../../../src/text-input/stories/text-input-loading-spinner.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAC7C,OAAO,EAAE,uBAAuB,EAAE,MAAM,wBAAwB,CAAC;AAEjE,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,eAAK,SAAS,EAAC,kCAAkC,aAC/C,KAAC,SAAS,IACR,KAAK,EAAC,iBAAiB,EACvB,SAAS,QACT,WAAW,EAAC,aAAa,EACzB,cAAc,EAAE,EAAE,EAAE,EAAE,oBAAoB,EAAE,GAC5C,EACF,KAAC,SAAS,IACR,KAAK,EAAC,sBAAsB,EAC5B,SAAS,QACT,cAAc,EAAE,KAAC,uBAAuB,KAAG,EAC3C,WAAW,EAAC,aAAa,EACzB,cAAc,EAAE,EAAE,EAAE,EAAE,4BAA4B,EAAE,GACpD,EACF,KAAC,SAAS,IACR,KAAK,EAAC,uBAAuB,EAC7B,SAAS,QACT,eAAe,EAAE,KAAC,uBAAuB,KAAG,EAC5C,WAAW,EAAC,aAAa,EACzB,cAAc,EAAE,EAAE,EAAE,EAAE,6BAA6B,EAAE,GACrD,EACF,KAAC,SAAS,IACR,KAAK,EAAC,mCAAmC,EACzC,SAAS,QACT,cAAc,EAAE,KAAC,uBAAuB,KAAG,EAC3C,eAAe,EAAE,KAAC,uBAAuB,KAAG,EAC5C,WAAW,EAAC,aAAa,EACzB,cAAc,EAAE,EAAE,EAAE,EAAE,yBAAyB,EAAE,GACjD,IACE,CACP,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 */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { TextInput } from '@neo4j-ndl/react';\nimport { CalendarDaysIconOutline } from '@neo4j-ndl/react/icons';\n\nconst Component = () => {\n  return (\n    <div className=\"n-flex n-flex-col n-gap-token-16\">\n      <TextInput\n        label=\"Default loading\"\n        isLoading\n        placeholder=\"Placeholder\"\n        htmlAttributes={{ id: 'text-input-loading' }}\n      />\n      <TextInput\n        label=\"With leading element\"\n        isLoading\n        leadingElement={<CalendarDaysIconOutline />}\n        placeholder=\"Placeholder\"\n        htmlAttributes={{ id: 'text-input-loading-leading' }}\n      />\n      <TextInput\n        label=\"With trailing element\"\n        isLoading\n        trailingElement={<CalendarDaysIconOutline />}\n        placeholder=\"Placeholder\"\n        htmlAttributes={{ id: 'text-input-loading-trailing' }}\n      />\n      <TextInput\n        label=\"With leading and trailing element\"\n        isLoading\n        leadingElement={<CalendarDaysIconOutline />}\n        trailingElement={<CalendarDaysIconOutline />}\n        placeholder=\"Placeholder\"\n        htmlAttributes={{ id: 'text-input-loading-both' }}\n      />\n    </div>\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"text-input-loading-spinner.story.js","sourceRoot":"","sources":["../../../../src/text-input/stories/text-input-loading-spinner.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAC7C,OAAO,EAAE,uBAAuB,EAAE,MAAM,wBAAwB,CAAC;AAEjE,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,eAAK,SAAS,EAAC,4BAA4B,aACzC,KAAC,SAAS,IACR,KAAK,EAAC,iBAAiB,EACvB,SAAS,QACT,WAAW,EAAC,aAAa,EACzB,cAAc,EAAE,EAAE,EAAE,EAAE,oBAAoB,EAAE,GAC5C,EACF,KAAC,SAAS,IACR,KAAK,EAAC,sBAAsB,EAC5B,SAAS,QACT,cAAc,EAAE,KAAC,uBAAuB,KAAG,EAC3C,WAAW,EAAC,aAAa,EACzB,cAAc,EAAE,EAAE,EAAE,EAAE,4BAA4B,EAAE,GACpD,EACF,KAAC,SAAS,IACR,KAAK,EAAC,uBAAuB,EAC7B,SAAS,QACT,eAAe,EAAE,KAAC,uBAAuB,KAAG,EAC5C,WAAW,EAAC,aAAa,EACzB,cAAc,EAAE,EAAE,EAAE,EAAE,6BAA6B,EAAE,GACrD,EACF,KAAC,SAAS,IACR,KAAK,EAAC,mCAAmC,EACzC,SAAS,QACT,cAAc,EAAE,KAAC,uBAAuB,KAAG,EAC3C,eAAe,EAAE,KAAC,uBAAuB,KAAG,EAC5C,WAAW,EAAC,aAAa,EACzB,cAAc,EAAE,EAAE,EAAE,EAAE,yBAAyB,EAAE,GACjD,IACE,CACP,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 */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { TextInput } from '@neo4j-ndl/react';\nimport { CalendarDaysIconOutline } from '@neo4j-ndl/react/icons';\n\nconst Component = () => {\n  return (\n    <div className=\"flex flex-col gap-token-16\">\n      <TextInput\n        label=\"Default loading\"\n        isLoading\n        placeholder=\"Placeholder\"\n        htmlAttributes={{ id: 'text-input-loading' }}\n      />\n      <TextInput\n        label=\"With leading element\"\n        isLoading\n        leadingElement={<CalendarDaysIconOutline />}\n        placeholder=\"Placeholder\"\n        htmlAttributes={{ id: 'text-input-loading-leading' }}\n      />\n      <TextInput\n        label=\"With trailing element\"\n        isLoading\n        trailingElement={<CalendarDaysIconOutline />}\n        placeholder=\"Placeholder\"\n        htmlAttributes={{ id: 'text-input-loading-trailing' }}\n      />\n      <TextInput\n        label=\"With leading and trailing element\"\n        isLoading\n        leadingElement={<CalendarDaysIconOutline />}\n        trailingElement={<CalendarDaysIconOutline />}\n        placeholder=\"Placeholder\"\n        htmlAttributes={{ id: 'text-input-loading-both' }}\n      />\n    </div>\n  );\n};\n\nexport default Component;\n"]}

package/lib/esm/text-input/stories/text-input-optional.story.js

@@ -22,7 +22,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import '@neo4j-ndl/base/lib/neo4j-ds-styles.css';
 import { TextInput } from '@neo4j-ndl/react';
 const Component = () => {
-    return (_jsx(TextInput, { label: "Label", helpText: "Help text", showRequiredOrOptionalLabel: true, htmlAttributes: { id: 'text-input' } }));
+    return (_jsx(TextInput, { showRequiredOrOptionalLabel: true, label: "Label", helpText: "Help text", htmlAttributes: { id: 'text-input' } }));
 };
 export default Component;
 //# sourceMappingURL=text-input-optional.story.js.map

package/lib/esm/text-input/stories/text-input-optional.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"text-input-optional.story.js","sourceRoot":"","sources":["../../../../src/text-input/stories/text-input-optional.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAE7C,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,KAAC,SAAS,IACR,KAAK,EAAC,OAAO,EACb,QAAQ,EAAC,WAAW,EACpB,2BAA2B,QAC3B,cAAc,EAAE,EAAE,EAAE,EAAE,YAAY,EAAE,GACpC,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 */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { TextInput } from '@neo4j-ndl/react';\n\nconst Component = () => {\n  return (\n    <TextInput\n      label=\"Label\"\n      helpText=\"Help text\"\n      showRequiredOrOptionalLabel\n      htmlAttributes={{ id: 'text-input' }}\n    />\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"text-input-optional.story.js","sourceRoot":"","sources":["../../../../src/text-input/stories/text-input-optional.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAE7C,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,KAAC,SAAS,IACR,2BAA2B,QAC3B,KAAK,EAAC,OAAO,EACb,QAAQ,EAAC,WAAW,EACpB,cAAc,EAAE,EAAE,EAAE,EAAE,YAAY,EAAE,GACpC,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 */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { TextInput } from '@neo4j-ndl/react';\n\nconst Component = () => {\n  return (\n    <TextInput\n      showRequiredOrOptionalLabel\n      label=\"Label\"\n      helpText=\"Help text\"\n      htmlAttributes={{ id: 'text-input' }}\n    />\n  );\n};\n\nexport default Component;\n"]}

package/lib/esm/text-input/stories/text-input-sizes.story.js

@@ -22,7 +22,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import '@neo4j-ndl/base/lib/neo4j-ds-styles.css';
 import { TextInput } from '@neo4j-ndl/react';
 const Component = () => {
-    return (_jsxs("div", { className: "n-flex n-gap-token-16", children: [_jsx(TextInput, { label: "Small Input", size: "small", placeholder: "Small Input", helpText: "Help text", htmlAttributes: { id: 'text-input-small' } }), _jsx(TextInput, { label: "Medium Input", size: "medium", placeholder: "Medium Input", helpText: "Help text", htmlAttributes: { id: 'text-input-medium' } }), _jsx(TextInput, { label: "Large Input", size: "large", placeholder: "Large Input", helpText: "Help text", htmlAttributes: { id: 'text-input-large' } })] }));
+    return (_jsxs("div", { className: "flex gap-token-16", children: [_jsx(TextInput, { label: "Small Input", size: "small", placeholder: "Small Input", helpText: "Help text", htmlAttributes: { id: 'text-input-small' } }), _jsx(TextInput, { label: "Medium Input", size: "medium", placeholder: "Medium Input", helpText: "Help text", htmlAttributes: { id: 'text-input-medium' } }), _jsx(TextInput, { label: "Large Input", size: "large", placeholder: "Large Input", helpText: "Help text", htmlAttributes: { id: 'text-input-large' } })] }));
 };
 export default Component;
 //# sourceMappingURL=text-input-sizes.story.js.map

package/lib/esm/text-input/stories/text-input-sizes.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"text-input-sizes.story.js","sourceRoot":"","sources":["../../../../src/text-input/stories/text-input-sizes.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAE7C,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,eAAK,SAAS,EAAC,uBAAuB,aACpC,KAAC,SAAS,IACR,KAAK,EAAC,aAAa,EACnB,IAAI,EAAC,OAAO,EACZ,WAAW,EAAC,aAAa,EACzB,QAAQ,EAAC,WAAW,EACpB,cAAc,EAAE,EAAE,EAAE,EAAE,kBAAkB,EAAE,GAC1C,EACF,KAAC,SAAS,IACR,KAAK,EAAC,cAAc,EACpB,IAAI,EAAC,QAAQ,EACb,WAAW,EAAC,cAAc,EAC1B,QAAQ,EAAC,WAAW,EACpB,cAAc,EAAE,EAAE,EAAE,EAAE,mBAAmB,EAAE,GAC3C,EACF,KAAC,SAAS,IACR,KAAK,EAAC,aAAa,EACnB,IAAI,EAAC,OAAO,EACZ,WAAW,EAAC,aAAa,EACzB,QAAQ,EAAC,WAAW,EACpB,cAAc,EAAE,EAAE,EAAE,EAAE,kBAAkB,EAAE,GAC1C,IACE,CACP,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 */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { TextInput } from '@neo4j-ndl/react';\n\nconst Component = () => {\n  return (\n    <div className=\"n-flex n-gap-token-16\">\n      <TextInput\n        label=\"Small Input\"\n        size=\"small\"\n        placeholder=\"Small Input\"\n        helpText=\"Help text\"\n        htmlAttributes={{ id: 'text-input-small' }}\n      />\n      <TextInput\n        label=\"Medium Input\"\n        size=\"medium\"\n        placeholder=\"Medium Input\"\n        helpText=\"Help text\"\n        htmlAttributes={{ id: 'text-input-medium' }}\n      />\n      <TextInput\n        label=\"Large Input\"\n        size=\"large\"\n        placeholder=\"Large Input\"\n        helpText=\"Help text\"\n        htmlAttributes={{ id: 'text-input-large' }}\n      />\n    </div>\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"text-input-sizes.story.js","sourceRoot":"","sources":["../../../../src/text-input/stories/text-input-sizes.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAE7C,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,eAAK,SAAS,EAAC,mBAAmB,aAChC,KAAC,SAAS,IACR,KAAK,EAAC,aAAa,EACnB,IAAI,EAAC,OAAO,EACZ,WAAW,EAAC,aAAa,EACzB,QAAQ,EAAC,WAAW,EACpB,cAAc,EAAE,EAAE,EAAE,EAAE,kBAAkB,EAAE,GAC1C,EACF,KAAC,SAAS,IACR,KAAK,EAAC,cAAc,EACpB,IAAI,EAAC,QAAQ,EACb,WAAW,EAAC,cAAc,EAC1B,QAAQ,EAAC,WAAW,EACpB,cAAc,EAAE,EAAE,EAAE,EAAE,mBAAmB,EAAE,GAC3C,EACF,KAAC,SAAS,IACR,KAAK,EAAC,aAAa,EACnB,IAAI,EAAC,OAAO,EACZ,WAAW,EAAC,aAAa,EACzB,QAAQ,EAAC,WAAW,EACpB,cAAc,EAAE,EAAE,EAAE,EAAE,kBAAkB,EAAE,GAC1C,IACE,CACP,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 */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { TextInput } from '@neo4j-ndl/react';\n\nconst Component = () => {\n  return (\n    <div className=\"flex gap-token-16\">\n      <TextInput\n        label=\"Small Input\"\n        size=\"small\"\n        placeholder=\"Small Input\"\n        helpText=\"Help text\"\n        htmlAttributes={{ id: 'text-input-small' }}\n      />\n      <TextInput\n        label=\"Medium Input\"\n        size=\"medium\"\n        placeholder=\"Medium Input\"\n        helpText=\"Help text\"\n        htmlAttributes={{ id: 'text-input-medium' }}\n      />\n      <TextInput\n        label=\"Large Input\"\n        size=\"large\"\n        placeholder=\"Large Input\"\n        helpText=\"Help text\"\n        htmlAttributes={{ id: 'text-input-large' }}\n      />\n    </div>\n  );\n};\n\nexport default Component;\n"]}

package/lib/esm/text-link/TextLink.js

@@ -32,16 +32,12 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  */
 import classNames from 'classnames';
 import { ArrowUpRightIconOutline } from '../icons/generated/heroIcons/ArrowUpRightIconOutline';
-import { ChevronRightIconOutline } from '../icons/generated/heroIcons/ChevronRightIconOutline';
 export const TextLink = (_a) => {
-    var { children, href, type = 'internal', as, className, target = type === 'external' || type === 'external-underline' ? '_blank' : '', style, htmlAttributes, ref } = _a, restProps = __rest(_a, ["children", "href", "type", "as", "className", "target", "style", "htmlAttributes", "ref"]);
+    var { children, href, type = 'internal', as, className, target = type === 'external' ? '_blank' : '', style, htmlAttributes, ref } = _a, restProps = __rest(_a, ["children", "href", "type", "as", "className", "target", "style", "htmlAttributes", "ref"]);
     const Component = as !== null && as !== void 0 ? as : 'a';
     const classes = classNames('ndl-text-link', className, {
         'ndl-external-link': type === 'external',
-        'ndl-external-underline': type === 'external-underline',
-        'ndl-internal-icon': type === 'internal-icon',
-        'ndl-internal-underline': type === 'internal-underline',
     });
-    return (_jsxs(Component, Object.assign({ className: classes, href: href, ref: ref, style: style, target: target }, restProps, htmlAttributes, { children: [children, (type === 'external' || type === 'external-underline') && (_jsx(ArrowUpRightIconOutline, { className: "ndl-external-link-icon" })), type === 'internal-icon' && (_jsx(ChevronRightIconOutline, { className: "ndl-external-link-icon" }))] })));
+    return (_jsxs(Component, Object.assign({ className: classes, href: href, ref: ref, style: style, target: target }, restProps, htmlAttributes, { children: [children, type === 'external' && (_jsx(ArrowUpRightIconOutline, { className: "ndl-external-link-icon" }))] })));
 };
 //# sourceMappingURL=TextLink.js.map

package/lib/esm/text-link/TextLink.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextLink.js","sourceRoot":"","sources":["../../../src/text-link/TextLink.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,OAAO,UAAU,MAAM,YAAY,CAAC;AAIpC,OAAO,EAAE,uBAAuB,EAAE,MAAM,sDAAsD,CAAC;AAC/F,OAAO,EAAE,uBAAuB,EAAE,MAAM,sDAAsD,CAAC;AA4C/F,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAoC,EAWjB,EAAE,EAAE;QAXa,EAC1D,QAAQ,EACR,IAAI,EACJ,IAAI,GAAG,UAAU,EACjB,EAAE,EACF,SAAS,EACT,MAAM,GAAG,IAAI,KAAK,UAAU,IAAI,IAAI,KAAK,oBAAoB,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,EAC7E,KAAK,EACL,cAAc,EACd,GAAG,OAEsC,EADtC,SAAS,cAV8C,2FAW3D,CADa;IAEZ,MAAM,SAAS,GAAsB,EAAE,aAAF,EAAE,cAAF,EAAE,GAAI,GAAG,CAAC;IAE/C,MAAM,OAAO,GAAG,UAAU,CAAC,eAAe,EAAE,SAAS,EAAE;QACrD,mBAAmB,EAAE,IAAI,KAAK,UAAU;QACxC,wBAAwB,EAAE,IAAI,KAAK,oBAAoB;QACvD,mBAAmB,EAAE,IAAI,KAAK,eAAe;QAC7C,wBAAwB,EAAE,IAAI,KAAK,oBAAoB;KACxD,CAAC,CAAC;IAEH,OAAO,CACL,MAAC,SAAS,kBACR,SAAS,EAAE,OAAO,EAClB,IAAI,EAAE,IAAI,EACV,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,IACV,SAAS,EACT,cAAc,eAEjB,QAAQ,EACR,CAAC,IAAI,KAAK,UAAU,IAAI,IAAI,KAAK,oBAAoB,CAAC,IAAI,CACzD,KAAC,uBAAuB,IAAC,SAAS,EAAC,wBAAwB,GAAG,CAC/D,EACA,IAAI,KAAK,eAAe,IAAI,CAC3B,KAAC,uBAAuB,IAAC,SAAS,EAAC,wBAAwB,GAAG,CAC/D,KACS,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 { ArrowUpRightIconOutline } from '../icons/generated/heroIcons/ArrowUpRightIconOutline';\nimport { ChevronRightIconOutline } from '../icons/generated/heroIcons/ChevronRightIconOutline';\n\n/** @deprecated Use `type=\"internal\"` instead. */\ntype InternalUnderlineTextLinkType = 'internal-underline';\n\n/** @deprecated Use `type=\"external\"` instead. */\ntype ExternalUnderlineTextLinkType = 'external-underline';\n\n/** @deprecated Use `type=\"internal\"` instead and append with a chevron icon. */\ntype InternalIconTextLinkType = 'internal-icon';\n\ntype TextLinkType =\n  | 'internal'\n  | InternalUnderlineTextLinkType\n  | InternalIconTextLinkType\n  | 'external'\n  | ExternalUnderlineTextLinkType;\n\ntype TextLinkProps = {\n  /** The content displayed inside the link */\n  children: React.ReactNode;\n\n  /** The URL the link points to */\n  href?: string;\n\n  /**\n   * The type of the text link\n   * All types render with an underline and primary text color by default. Additional color styling can be applied via `className`.\n   * - 'internal': A link to another page within the application\n   * - 'internal-underline': Deprecated alias of 'internal'\n   * - 'internal-icon': Deprecated variant with a trailing chevron icon\n   * - 'external': A link to an external website. An external link icon is appended.\n   * - 'external-underline': Deprecated alias of 'external'\n   * @default 'internal'\n   */\n  type?: TextLinkType;\n\n  /** Specifies where to open the linked document. If omitted and `type` is `\"external\"` it defaults to `\"_blank\"`. */\n  target?: HTMLAnchorElement['target'];\n\n  /** Additional class name */\n  className?: string;\n};\n\nexport const TextLink = <T extends React.ElementType = 'a'>({\n  children,\n  href,\n  type = 'internal',\n  as,\n  className,\n  target = type === 'external' || type === 'external-underline' ? '_blank' : '',\n  style,\n  htmlAttributes,\n  ref,\n  ...restProps\n}: PolymorphicCommonProps<T, TextLinkProps>) => {\n  const Component: React.ElementType = as ?? 'a';\n\n  const classes = classNames('ndl-text-link', className, {\n    'ndl-external-link': type === 'external',\n    'ndl-external-underline': type === 'external-underline',\n    'ndl-internal-icon': type === 'internal-icon',\n    'ndl-internal-underline': type === 'internal-underline',\n  });\n\n  return (\n    <Component\n      className={classes}\n      href={href}\n      ref={ref}\n      style={style}\n      target={target}\n      {...restProps}\n      {...htmlAttributes}\n    >\n      {children}\n      {(type === 'external' || type === 'external-underline') && (\n        <ArrowUpRightIconOutline className=\"ndl-external-link-icon\" />\n      )}\n      {type === 'internal-icon' && (\n        <ChevronRightIconOutline className=\"ndl-external-link-icon\" />\n      )}\n    </Component>\n  );\n};\n"]}
+{"version":3,"file":"TextLink.js","sourceRoot":"","sources":["../../../src/text-link/TextLink.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,OAAO,UAAU,MAAM,YAAY,CAAC;AAIpC,OAAO,EAAE,uBAAuB,EAAE,MAAM,sDAAsD,CAAC;AAwB/F,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAoC,EAWjB,EAAE,EAAE;QAXa,EAC1D,QAAQ,EACR,IAAI,EACJ,IAAI,GAAG,UAAU,EACjB,EAAE,EACF,SAAS,EACT,MAAM,GAAG,IAAI,KAAK,UAAU,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,EAC5C,KAAK,EACL,cAAc,EACd,GAAG,OAEsC,EADtC,SAAS,cAV8C,2FAW3D,CADa;IAEZ,MAAM,SAAS,GAAsB,EAAE,aAAF,EAAE,cAAF,EAAE,GAAI,GAAG,CAAC;IAE/C,MAAM,OAAO,GAAG,UAAU,CAAC,eAAe,EAAE,SAAS,EAAE;QACrD,mBAAmB,EAAE,IAAI,KAAK,UAAU;KACzC,CAAC,CAAC;IAEH,OAAO,CACL,MAAC,SAAS,kBACR,SAAS,EAAE,OAAO,EAClB,IAAI,EAAE,IAAI,EACV,GAAG,EAAE,GAAG,EACR,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,IACV,SAAS,EACT,cAAc,eAEjB,QAAQ,EACR,IAAI,KAAK,UAAU,IAAI,CACtB,KAAC,uBAAuB,IAAC,SAAS,EAAC,wBAAwB,GAAG,CAC/D,KACS,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 { ArrowUpRightIconOutline } from '../icons/generated/heroIcons/ArrowUpRightIconOutline';\n\ntype TextLinkType = 'internal' | 'external';\n\ntype TextLinkProps = {\n  /** The content displayed inside the link */\n  children: React.ReactNode;\n\n  /** The URL the link points to */\n  href?: string;\n\n  /**\n   * The type of the text link.\n   * All types render with an underline and primary text color by default. Additional color styling can be applied via `className`.\n   * - 'internal': A link to another page within the application\n   * - 'external': A link to an external website. An external link icon is appended.\n   * @default 'internal'\n   */\n  type?: TextLinkType;\n\n  /** Specifies where to open the linked document. If omitted and `type` is `\"external\"` it defaults to `\"_blank\"`. */\n  target?: HTMLAnchorElement['target'];\n};\n\nexport const TextLink = <T extends React.ElementType = 'a'>({\n  children,\n  href,\n  type = 'internal',\n  as,\n  className,\n  target = type === 'external' ? '_blank' : '',\n  style,\n  htmlAttributes,\n  ref,\n  ...restProps\n}: PolymorphicCommonProps<T, TextLinkProps>) => {\n  const Component: React.ElementType = as ?? 'a';\n\n  const classes = classNames('ndl-text-link', className, {\n    'ndl-external-link': type === 'external',\n  });\n\n  return (\n    <Component\n      className={classes}\n      href={href}\n      ref={ref}\n      style={style}\n      target={target}\n      {...restProps}\n      {...htmlAttributes}\n    >\n      {children}\n      {type === 'external' && (\n        <ArrowUpRightIconOutline className=\"ndl-external-link-icon\" />\n      )}\n    </Component>\n  );\n};\n"]}

package/lib/esm/text-link/stories/index.js

@@ -18,20 +18,11 @@
  *  You should have received a copy of the GNU General Public License
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
-export { default as TextLinkDefault } from './text-link-default.story';
+export { default as TextLinkInternal } from './text-link-internal.story';
 export { default as TextLinkExternal } from './text-link-external.story';
-export { default as TextLinkExternalUnderline } from './text-link-external-underline.story';
-export { default as TextLinkInternalIcon } from './text-link-internal-icon.story';
-export { default as TextLinkInternalUnderline } from './text-link-internal-underline.story';
 import { removeLicenseHeader } from '../../_common/export-stories-utils';
-import TextLinkDefaultSourceRaw from './text-link-default.story?raw';
 import TextLinkExternalSourceRaw from './text-link-external.story?raw';
-import TextLinkExternalUnderlineSourceRaw from './text-link-external-underline.story?raw';
-import TextLinkInternalIconSourceRaw from './text-link-internal-icon.story?raw';
-import TextLinkInternalUnderlineSourceRaw from './text-link-internal-underline.story?raw';
-export const TextLinkDefaultSource = removeLicenseHeader(TextLinkDefaultSourceRaw);
+import TextLinkInternalSourceRaw from './text-link-internal.story?raw';
 export const TextLinkExternalSource = removeLicenseHeader(TextLinkExternalSourceRaw);
-export const TextLinkExternalUnderlineSource = removeLicenseHeader(TextLinkExternalUnderlineSourceRaw);
-export const TextLinkInternalIconSource = removeLicenseHeader(TextLinkInternalIconSourceRaw);
-export const TextLinkInternalUnderlineSource = removeLicenseHeader(TextLinkInternalUnderlineSourceRaw);
+export const TextLinkInternalSource = removeLicenseHeader(TextLinkInternalSourceRaw);
 //# sourceMappingURL=index.js.map

package/lib/esm/text-link/stories/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/text-link/stories/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,2BAA2B,CAAC;AACvE,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AACzE,OAAO,EAAE,OAAO,IAAI,yBAAyB,EAAE,MAAM,sCAAsC,CAAC;AAC5F,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,iCAAiC,CAAC;AAClF,OAAO,EAAE,OAAO,IAAI,yBAAyB,EAAE,MAAM,sCAAsC,CAAC;AAE5F,OAAO,EAAE,mBAAmB,EAAE,MAAM,oCAAoC,CAAC;AACzE,OAAO,wBAAwB,MAAM,+BAA+B,CAAC;AACrE,OAAO,yBAAyB,MAAM,gCAAgC,CAAC;AACvE,OAAO,kCAAkC,MAAM,0CAA0C,CAAC;AAC1F,OAAO,6BAA6B,MAAM,qCAAqC,CAAC;AAChF,OAAO,kCAAkC,MAAM,0CAA0C,CAAC;AAE1F,MAAM,CAAC,MAAM,qBAAqB,GAAG,mBAAmB,CACtD,wBAAwB,CACzB,CAAC;AACF,MAAM,CAAC,MAAM,sBAAsB,GAAG,mBAAmB,CACvD,yBAAyB,CAC1B,CAAC;AACF,MAAM,CAAC,MAAM,+BAA+B,GAAG,mBAAmB,CAChE,kCAAkC,CACnC,CAAC;AACF,MAAM,CAAC,MAAM,0BAA0B,GAAG,mBAAmB,CAC3D,6BAA6B,CAC9B,CAAC;AACF,MAAM,CAAC,MAAM,+BAA+B,GAAG,mBAAmB,CAChE,kCAAkC,CACnC,CAAC","sourcesContent":["/*!\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nexport { default as TextLinkDefault } from './text-link-default.story';\nexport { default as TextLinkExternal } from './text-link-external.story';\nexport { default as TextLinkExternalUnderline } from './text-link-external-underline.story';\nexport { default as TextLinkInternalIcon } from './text-link-internal-icon.story';\nexport { default as TextLinkInternalUnderline } from './text-link-internal-underline.story';\n\nimport { removeLicenseHeader } from '../../_common/export-stories-utils';\nimport TextLinkDefaultSourceRaw from './text-link-default.story?raw';\nimport TextLinkExternalSourceRaw from './text-link-external.story?raw';\nimport TextLinkExternalUnderlineSourceRaw from './text-link-external-underline.story?raw';\nimport TextLinkInternalIconSourceRaw from './text-link-internal-icon.story?raw';\nimport TextLinkInternalUnderlineSourceRaw from './text-link-internal-underline.story?raw';\n\nexport const TextLinkDefaultSource = removeLicenseHeader(\n  TextLinkDefaultSourceRaw,\n);\nexport const TextLinkExternalSource = removeLicenseHeader(\n  TextLinkExternalSourceRaw,\n);\nexport const TextLinkExternalUnderlineSource = removeLicenseHeader(\n  TextLinkExternalUnderlineSourceRaw,\n);\nexport const TextLinkInternalIconSource = removeLicenseHeader(\n  TextLinkInternalIconSourceRaw,\n);\nexport const TextLinkInternalUnderlineSource = removeLicenseHeader(\n  TextLinkInternalUnderlineSourceRaw,\n);\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/text-link/stories/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AACzE,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAEzE,OAAO,EAAE,mBAAmB,EAAE,MAAM,oCAAoC,CAAC;AACzE,OAAO,yBAAyB,MAAM,gCAAgC,CAAC;AACvE,OAAO,yBAAyB,MAAM,gCAAgC,CAAC;AAEvE,MAAM,CAAC,MAAM,sBAAsB,GAAG,mBAAmB,CACvD,yBAAyB,CAC1B,CAAC;AACF,MAAM,CAAC,MAAM,sBAAsB,GAAG,mBAAmB,CACvD,yBAAyB,CAC1B,CAAC","sourcesContent":["/*!\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nexport { default as TextLinkInternal } from './text-link-internal.story';\nexport { default as TextLinkExternal } from './text-link-external.story';\n\nimport { removeLicenseHeader } from '../../_common/export-stories-utils';\nimport TextLinkExternalSourceRaw from './text-link-external.story?raw';\nimport TextLinkInternalSourceRaw from './text-link-internal.story?raw';\n\nexport const TextLinkExternalSource = removeLicenseHeader(\n  TextLinkExternalSourceRaw,\n);\nexport const TextLinkInternalSource = removeLicenseHeader(\n  TextLinkInternalSourceRaw,\n);\n"]}

package/lib/esm/text-link/stories/text-link-external.story.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /*!
  *
  *  Copyright (c) "Neo4j"
@@ -20,9 +20,9 @@ import { jsx as _jsx } from "react/jsx-runtime";
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 import '@neo4j-ndl/base/lib/neo4j-ds-styles.css';
-import { TextLink } from '@neo4j-ndl/react';
+import { TextLink, Typography } from '@neo4j-ndl/react';
 const Component = () => {
-    return (_jsx(TextLink, { href: "https://neo4j.com", type: "external", children: "Link" }));
+    return (_jsxs(Typography, { variant: "body-medium", children: ["The quick brown fox", ` `, _jsx(TextLink, { href: "https://neo4j.com", type: "external", children: "jumps" }), ` `, "over the lazy dog."] }));
 };
 export default Component;
 //# sourceMappingURL=text-link-external.story.js.map

package/lib/esm/text-link/stories/text-link-external.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"text-link-external.story.js","sourceRoot":"","sources":["../../../../src/text-link/stories/text-link-external.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAE5C,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,KAAC,QAAQ,IAAC,IAAI,EAAC,mBAAmB,EAAC,IAAI,EAAC,UAAU,qBAEvC,CACZ,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 */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { TextLink } from '@neo4j-ndl/react';\n\nconst Component = () => {\n  return (\n    <TextLink href=\"https://neo4j.com\" type=\"external\">\n      Link\n    </TextLink>\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"text-link-external.story.js","sourceRoot":"","sources":["../../../../src/text-link/stories/text-link-external.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAExD,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,MAAC,UAAU,IAAC,OAAO,EAAC,aAAa,oCACX,GAAG,EACvB,KAAC,QAAQ,IAAC,IAAI,EAAC,mBAAmB,EAAC,IAAI,EAAC,UAAU,sBAEvC,EACV,GAAG,0BACO,CACd,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 */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { TextLink, Typography } from '@neo4j-ndl/react';\n\nconst Component = () => {\n  return (\n    <Typography variant=\"body-medium\">\n      The quick brown fox{` `}\n      <TextLink href=\"https://neo4j.com\" type=\"external\">\n        jumps\n      </TextLink>\n      {` `}over the lazy dog.\n    </Typography>\n  );\n};\n\nexport default Component;\n"]}

package/lib/esm/text-link/stories/{text-link-internal-underline.story.js → text-link-internal.story.js}

@@ -22,7 +22,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import '@neo4j-ndl/base/lib/neo4j-ds-styles.css';
 import { TextLink, Typography } from '@neo4j-ndl/react';
 const Component = () => {
-    return (_jsxs(Typography, { variant: "body-medium", children: ["The quick brown fox", ' ', _jsx(TextLink, { href: "/", type: "internal-underline", children: "jumps" }), ' ', "over the lazy dog."] }));
+    return (_jsxs(Typography, { variant: "body-medium", children: ["The quick brown fox", ` `, _jsx(TextLink, { href: "/", type: "internal", children: "jumps" }), ` `, "over the lazy dog."] }));
 };
 export default Component;
-//# sourceMappingURL=text-link-internal-underline.story.js.map
+//# sourceMappingURL=text-link-internal.story.js.map

package/lib/esm/text-link/stories/text-link-internal.story.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-link-internal.story.js","sourceRoot":"","sources":["../../../../src/text-link/stories/text-link-internal.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAExD,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,MAAC,UAAU,IAAC,OAAO,EAAC,aAAa,oCACX,GAAG,EACvB,KAAC,QAAQ,IAAC,IAAI,EAAC,GAAG,EAAC,IAAI,EAAC,UAAU,sBAEvB,EACV,GAAG,0BACO,CACd,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 */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { TextLink, Typography } from '@neo4j-ndl/react';\n\nconst Component = () => {\n  return (\n    <Typography variant=\"body-medium\">\n      The quick brown fox{` `}\n      <TextLink href=\"/\" type=\"internal\">\n        jumps\n      </TextLink>\n      {` `}over the lazy dog.\n    </Typography>\n  );\n};\n\nexport default Component;\n"]}

package/lib/esm/time-picker/stories/time-picker-in-popover-dialog.story.js

@@ -24,7 +24,7 @@ import { Dialog, FilledButton, Popover, TimePicker, } from '@neo4j-ndl/react';
 import { useState } from 'react';
 const Component = () => {
     const [selectedTime, setSelectedTime] = useState();
-    return (_jsxs(Dialog, { isOpen: true, "aria-label": "Dialog", children: [_jsx(Dialog.Header, { children: "Using Time Picker inside a popover in a dialog" }), _jsx(Dialog.Description, { className: "n-flex n-flex-col n-gap-token-32", children: _jsxs(Popover, { children: [_jsx(Popover.Trigger, { hasButtonWrapper: true, children: _jsx(FilledButton, { children: "Open Popover" }) }), _jsx(Popover.Content, { className: "n-p-token-16", children: _jsx(TimePicker, { label: "Select Time", value: selectedTime, onChange: (time) => setSelectedTime(time), htmlAttributes: { id: 'time-picker-input' } }) })] }) })] }));
+    return (_jsxs(Dialog, { isOpen: true, "aria-label": "Dialog", children: [_jsx(Dialog.Header, { children: "Using Time Picker inside a popover in a dialog" }), _jsx(Dialog.Description, { className: "flex flex-col gap-token-32", children: _jsxs(Popover, { children: [_jsx(Popover.Trigger, { hasButtonWrapper: true, children: _jsx(FilledButton, { children: "Open Popover" }) }), _jsx(Popover.Content, { className: "p-token-16", children: _jsx(TimePicker, { label: "Select Time", value: selectedTime, onChange: (time) => setSelectedTime(time), htmlAttributes: { id: 'time-picker-input' } }) })] }) })] }));
 };
 export default Component;
 //# sourceMappingURL=time-picker-in-popover-dialog.story.js.map

package/lib/esm/time-picker/stories/time-picker-in-popover-dialog.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"time-picker-in-popover-dialog.story.js","sourceRoot":"","sources":["../../../../src/time-picker/stories/time-picker-in-popover-dialog.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EACL,MAAM,EACN,YAAY,EAEZ,OAAO,EACP,UAAU,GACX,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,EAAc,CAAC;IAE/D,OAAO,CACL,MAAC,MAAM,IAAC,MAAM,EAAE,IAAI,gBAAa,QAAQ,aACvC,KAAC,MAAM,CAAC,MAAM,iEAEE,EAChB,KAAC,MAAM,CAAC,WAAW,IAAC,SAAS,EAAC,kCAAkC,YAC9D,MAAC,OAAO,eACN,KAAC,OAAO,CAAC,OAAO,IAAC,gBAAgB,kBAC/B,KAAC,YAAY,+BAA4B,GACzB,EAClB,KAAC,OAAO,CAAC,OAAO,IAAC,SAAS,EAAC,cAAc,YACvC,KAAC,UAAU,IACT,KAAK,EAAC,aAAa,EACnB,KAAK,EAAE,YAAY,EACnB,QAAQ,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC,EACzC,cAAc,EAAE,EAAE,EAAE,EAAE,mBAAmB,EAAE,GAC3C,GACc,IACV,GACS,IACd,CACV,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 */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport {\n  Dialog,\n  FilledButton,\n  type NeedleTime,\n  Popover,\n  TimePicker,\n} from '@neo4j-ndl/react';\nimport { useState } from 'react';\n\nconst Component = () => {\n  const [selectedTime, setSelectedTime] = useState<NeedleTime>();\n\n  return (\n    <Dialog isOpen={true} aria-label=\"Dialog\">\n      <Dialog.Header>\n        Using Time Picker inside a popover in a dialog\n      </Dialog.Header>\n      <Dialog.Description className=\"n-flex n-flex-col n-gap-token-32\">\n        <Popover>\n          <Popover.Trigger hasButtonWrapper>\n            <FilledButton>Open Popover</FilledButton>\n          </Popover.Trigger>\n          <Popover.Content className=\"n-p-token-16\">\n            <TimePicker\n              label=\"Select Time\"\n              value={selectedTime}\n              onChange={(time) => setSelectedTime(time)}\n              htmlAttributes={{ id: 'time-picker-input' }}\n            />\n          </Popover.Content>\n        </Popover>\n      </Dialog.Description>\n    </Dialog>\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"time-picker-in-popover-dialog.story.js","sourceRoot":"","sources":["../../../../src/time-picker/stories/time-picker-in-popover-dialog.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EACL,MAAM,EACN,YAAY,EAEZ,OAAO,EACP,UAAU,GACX,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,EAAc,CAAC;IAE/D,OAAO,CACL,MAAC,MAAM,IAAC,MAAM,EAAE,IAAI,gBAAa,QAAQ,aACvC,KAAC,MAAM,CAAC,MAAM,iEAEE,EAChB,KAAC,MAAM,CAAC,WAAW,IAAC,SAAS,EAAC,4BAA4B,YACxD,MAAC,OAAO,eACN,KAAC,OAAO,CAAC,OAAO,IAAC,gBAAgB,kBAC/B,KAAC,YAAY,+BAA4B,GACzB,EAClB,KAAC,OAAO,CAAC,OAAO,IAAC,SAAS,EAAC,YAAY,YACrC,KAAC,UAAU,IACT,KAAK,EAAC,aAAa,EACnB,KAAK,EAAE,YAAY,EACnB,QAAQ,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC,EACzC,cAAc,EAAE,EAAE,EAAE,EAAE,mBAAmB,EAAE,GAC3C,GACc,IACV,GACS,IACd,CACV,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 */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport {\n  Dialog,\n  FilledButton,\n  type NeedleTime,\n  Popover,\n  TimePicker,\n} from '@neo4j-ndl/react';\nimport { useState } from 'react';\n\nconst Component = () => {\n  const [selectedTime, setSelectedTime] = useState<NeedleTime>();\n\n  return (\n    <Dialog isOpen={true} aria-label=\"Dialog\">\n      <Dialog.Header>\n        Using Time Picker inside a popover in a dialog\n      </Dialog.Header>\n      <Dialog.Description className=\"flex flex-col gap-token-32\">\n        <Popover>\n          <Popover.Trigger hasButtonWrapper>\n            <FilledButton>Open Popover</FilledButton>\n          </Popover.Trigger>\n          <Popover.Content className=\"p-token-16\">\n            <TimePicker\n              label=\"Select Time\"\n              value={selectedTime}\n              onChange={(time) => setSelectedTime(time)}\n              htmlAttributes={{ id: 'time-picker-input' }}\n            />\n          </Popover.Content>\n        </Popover>\n      </Dialog.Description>\n    </Dialog>\n  );\n};\n\nexport default Component;\n"]}

package/lib/esm/timezone-picker/stories/timezone-picker-in-dialog.story.js

@@ -39,7 +39,7 @@ const Component = () => {
     const handleTimeZoneChange = (timezone) => {
         setTempTimeZone(timezone);
     };
-    return (_jsxs("div", { ref: ref, className: "n-flex n-flex-col n-items-center n-justify-center n-relative n-h-[500px] n-w-full", children: [_jsxs("div", { className: "n-flex n-flex-col n-items-center n-gap-4", children: [_jsx(FilledButton, { onClick: handleOpen, children: "Select Timezone" }), _jsx("div", { children: _jsxs("p", { children: ["Selected Timezone: ", selectedTimeZone] }) })] }), _jsxs(Dialog, { onClose: handleClose, isOpen: isOpen, container: (ref === null || ref === void 0 ? void 0 : ref.current) || undefined, size: "medium", children: [_jsx(Dialog.Header, { children: "Select Timezone" }), _jsx(Dialog.Description, { children: "Choose a timezone from the list below" }), _jsx(Dialog.Content, { children: _jsx(TimeZonePicker, { isFluid: true, label: "Timezone", value: tempTimeZone, onChange: handleTimeZoneChange, htmlAttributes: { id: 'time-zone-input' } }) }), _jsxs(Dialog.Actions, { children: [_jsx(OutlinedButton, { onClick: handleClose, variant: "neutral", size: "medium", children: "Cancel" }), _jsx(FilledButton, { onClick: handleSave, size: "medium", children: "Save" })] })] })] }));
+    return (_jsxs("div", { ref: ref, className: "flex flex-col items-center justify-center relative h-[500px] w-full", children: [_jsxs("div", { className: "flex flex-col items-center gap-4", children: [_jsx(FilledButton, { onClick: handleOpen, children: "Select Timezone" }), _jsx("div", { children: _jsxs("p", { children: ["Selected Timezone: ", selectedTimeZone] }) })] }), _jsxs(Dialog, { onClose: handleClose, isOpen: isOpen, container: (ref === null || ref === void 0 ? void 0 : ref.current) || undefined, size: "medium", children: [_jsx(Dialog.Header, { children: "Select Timezone" }), _jsx(Dialog.Description, { children: "Choose a timezone from the list below" }), _jsx(Dialog.Content, { children: _jsx(TimeZonePicker, { isFluid: true, label: "Timezone", value: tempTimeZone, onChange: handleTimeZoneChange, htmlAttributes: { id: 'time-zone-input' } }) }), _jsxs(Dialog.Actions, { children: [_jsx(OutlinedButton, { onClick: handleClose, variant: "neutral", size: "medium", children: "Cancel" }), _jsx(FilledButton, { onClick: handleSave, size: "medium", children: "Save" })] })] })] }));
 };
 export default Component;
 //# sourceMappingURL=timezone-picker-in-dialog.story.js.map

package/lib/esm/timezone-picker/stories/timezone-picker-in-dialog.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"timezone-picker-in-dialog.story.js","sourceRoot":"","sources":["../../../../src/timezone-picker/stories/timezone-picker-in-dialog.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EACL,MAAM,EACN,YAAY,EACZ,cAAc,EACd,cAAc,GACf,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEzC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IACrD,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAS,KAAK,CAAC,CAAC;IACxE,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAS,KAAK,CAAC,CAAC;IAChE,MAAM,GAAG,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAC;IAEhD,MAAM,UAAU,GAAG,GAAG,EAAE;QACtB,eAAe,CAAC,gBAAgB,CAAC,CAAC;QAClC,SAAS,CAAC,IAAI,CAAC,CAAC;IAClB,CAAC,CAAC;IAEF,MAAM,WAAW,GAAG,GAAG,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;IAE3C,MAAM,UAAU,GAAG,GAAG,EAAE;QACtB,mBAAmB,CAAC,YAAY,CAAC,CAAC;QAClC,SAAS,CAAC,KAAK,CAAC,CAAC;IACnB,CAAC,CAAC;IAEF,MAAM,oBAAoB,GAAG,CAAC,QAAgB,EAAE,EAAE;QAChD,eAAe,CAAC,QAAQ,CAAC,CAAC;IAC5B,CAAC,CAAC;IAEF,OAAO,CACL,eACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAC,mFAAmF,aAE7F,eAAK,SAAS,EAAC,0CAA0C,aACvD,KAAC,YAAY,IAAC,OAAO,EAAE,UAAU,gCAAgC,EACjE,wBACE,+CAAuB,gBAAgB,IAAK,GACxC,IACF,EACN,MAAC,MAAM,IACL,OAAO,EAAE,WAAW,EACpB,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,CAAA,GAAG,aAAH,GAAG,uBAAH,GAAG,CAAE,OAAO,KAAI,SAAS,EACpC,IAAI,EAAC,QAAQ,aAEb,KAAC,MAAM,CAAC,MAAM,kCAAgC,EAC9C,KAAC,MAAM,CAAC,WAAW,wDAEE,EACrB,KAAC,MAAM,CAAC,OAAO,cACb,KAAC,cAAc,IACb,OAAO,QACP,KAAK,EAAC,UAAU,EAChB,KAAK,EAAE,YAAY,EACnB,QAAQ,EAAE,oBAAoB,EAC9B,cAAc,EAAE,EAAE,EAAE,EAAE,iBAAiB,EAAE,GACzC,GACa,EACjB,MAAC,MAAM,CAAC,OAAO,eACb,KAAC,cAAc,IAAC,OAAO,EAAE,WAAW,EAAE,OAAO,EAAC,SAAS,EAAC,IAAI,EAAC,QAAQ,uBAEpD,EACjB,KAAC,YAAY,IAAC,OAAO,EAAE,UAAU,EAAE,IAAI,EAAC,QAAQ,qBAEjC,IACA,IACV,IACL,CACP,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 */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport {\n  Dialog,\n  FilledButton,\n  OutlinedButton,\n  TimeZonePicker,\n} from '@neo4j-ndl/react';\nimport { useRef, useState } from 'react';\n\nconst Component = () => {\n  const [isOpen, setIsOpen] = useState<boolean>(false);\n  const [selectedTimeZone, setSelectedTimeZone] = useState<string>('UTC');\n  const [tempTimeZone, setTempTimeZone] = useState<string>('UTC');\n  const ref = useRef<HTMLDivElement | null>(null);\n\n  const handleOpen = () => {\n    setTempTimeZone(selectedTimeZone);\n    setIsOpen(true);\n  };\n\n  const handleClose = () => setIsOpen(false);\n\n  const handleSave = () => {\n    setSelectedTimeZone(tempTimeZone);\n    setIsOpen(false);\n  };\n\n  const handleTimeZoneChange = (timezone: string) => {\n    setTempTimeZone(timezone);\n  };\n\n  return (\n    <div\n      ref={ref}\n      className=\"n-flex n-flex-col n-items-center n-justify-center n-relative n-h-[500px] n-w-full\"\n    >\n      <div className=\"n-flex n-flex-col n-items-center n-gap-4\">\n        <FilledButton onClick={handleOpen}>Select Timezone</FilledButton>\n        <div>\n          <p>Selected Timezone: {selectedTimeZone}</p>\n        </div>\n      </div>\n      <Dialog\n        onClose={handleClose}\n        isOpen={isOpen}\n        container={ref?.current || undefined}\n        size=\"medium\"\n      >\n        <Dialog.Header>Select Timezone</Dialog.Header>\n        <Dialog.Description>\n          Choose a timezone from the list below\n        </Dialog.Description>\n        <Dialog.Content>\n          <TimeZonePicker\n            isFluid\n            label=\"Timezone\"\n            value={tempTimeZone}\n            onChange={handleTimeZoneChange}\n            htmlAttributes={{ id: 'time-zone-input' }}\n          />\n        </Dialog.Content>\n        <Dialog.Actions>\n          <OutlinedButton onClick={handleClose} variant=\"neutral\" size=\"medium\">\n            Cancel\n          </OutlinedButton>\n          <FilledButton onClick={handleSave} size=\"medium\">\n            Save\n          </FilledButton>\n        </Dialog.Actions>\n      </Dialog>\n    </div>\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"timezone-picker-in-dialog.story.js","sourceRoot":"","sources":["../../../../src/timezone-picker/stories/timezone-picker-in-dialog.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EACL,MAAM,EACN,YAAY,EACZ,cAAc,EACd,cAAc,GACf,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEzC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IACrD,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAS,KAAK,CAAC,CAAC;IACxE,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAS,KAAK,CAAC,CAAC;IAChE,MAAM,GAAG,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAC;IAEhD,MAAM,UAAU,GAAG,GAAG,EAAE;QACtB,eAAe,CAAC,gBAAgB,CAAC,CAAC;QAClC,SAAS,CAAC,IAAI,CAAC,CAAC;IAClB,CAAC,CAAC;IAEF,MAAM,WAAW,GAAG,GAAG,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;IAE3C,MAAM,UAAU,GAAG,GAAG,EAAE;QACtB,mBAAmB,CAAC,YAAY,CAAC,CAAC;QAClC,SAAS,CAAC,KAAK,CAAC,CAAC;IACnB,CAAC,CAAC;IAEF,MAAM,oBAAoB,GAAG,CAAC,QAAgB,EAAE,EAAE;QAChD,eAAe,CAAC,QAAQ,CAAC,CAAC;IAC5B,CAAC,CAAC;IAEF,OAAO,CACL,eACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAC,qEAAqE,aAE/E,eAAK,SAAS,EAAC,kCAAkC,aAC/C,KAAC,YAAY,IAAC,OAAO,EAAE,UAAU,gCAAgC,EACjE,wBACE,+CAAuB,gBAAgB,IAAK,GACxC,IACF,EACN,MAAC,MAAM,IACL,OAAO,EAAE,WAAW,EACpB,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,CAAA,GAAG,aAAH,GAAG,uBAAH,GAAG,CAAE,OAAO,KAAI,SAAS,EACpC,IAAI,EAAC,QAAQ,aAEb,KAAC,MAAM,CAAC,MAAM,kCAAgC,EAC9C,KAAC,MAAM,CAAC,WAAW,wDAEE,EACrB,KAAC,MAAM,CAAC,OAAO,cACb,KAAC,cAAc,IACb,OAAO,QACP,KAAK,EAAC,UAAU,EAChB,KAAK,EAAE,YAAY,EACnB,QAAQ,EAAE,oBAAoB,EAC9B,cAAc,EAAE,EAAE,EAAE,EAAE,iBAAiB,EAAE,GACzC,GACa,EACjB,MAAC,MAAM,CAAC,OAAO,eACb,KAAC,cAAc,IAAC,OAAO,EAAE,WAAW,EAAE,OAAO,EAAC,SAAS,EAAC,IAAI,EAAC,QAAQ,uBAEpD,EACjB,KAAC,YAAY,IAAC,OAAO,EAAE,UAAU,EAAE,IAAI,EAAC,QAAQ,qBAEjC,IACA,IACV,IACL,CACP,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 */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport {\n  Dialog,\n  FilledButton,\n  OutlinedButton,\n  TimeZonePicker,\n} from '@neo4j-ndl/react';\nimport { useRef, useState } from 'react';\n\nconst Component = () => {\n  const [isOpen, setIsOpen] = useState<boolean>(false);\n  const [selectedTimeZone, setSelectedTimeZone] = useState<string>('UTC');\n  const [tempTimeZone, setTempTimeZone] = useState<string>('UTC');\n  const ref = useRef<HTMLDivElement | null>(null);\n\n  const handleOpen = () => {\n    setTempTimeZone(selectedTimeZone);\n    setIsOpen(true);\n  };\n\n  const handleClose = () => setIsOpen(false);\n\n  const handleSave = () => {\n    setSelectedTimeZone(tempTimeZone);\n    setIsOpen(false);\n  };\n\n  const handleTimeZoneChange = (timezone: string) => {\n    setTempTimeZone(timezone);\n  };\n\n  return (\n    <div\n      ref={ref}\n      className=\"flex flex-col items-center justify-center relative h-[500px] w-full\"\n    >\n      <div className=\"flex flex-col items-center gap-4\">\n        <FilledButton onClick={handleOpen}>Select Timezone</FilledButton>\n        <div>\n          <p>Selected Timezone: {selectedTimeZone}</p>\n        </div>\n      </div>\n      <Dialog\n        onClose={handleClose}\n        isOpen={isOpen}\n        container={ref?.current || undefined}\n        size=\"medium\"\n      >\n        <Dialog.Header>Select Timezone</Dialog.Header>\n        <Dialog.Description>\n          Choose a timezone from the list below\n        </Dialog.Description>\n        <Dialog.Content>\n          <TimeZonePicker\n            isFluid\n            label=\"Timezone\"\n            value={tempTimeZone}\n            onChange={handleTimeZoneChange}\n            htmlAttributes={{ id: 'time-zone-input' }}\n          />\n        </Dialog.Content>\n        <Dialog.Actions>\n          <OutlinedButton onClick={handleClose} variant=\"neutral\" size=\"medium\">\n            Cancel\n          </OutlinedButton>\n          <FilledButton onClick={handleSave} size=\"medium\">\n            Save\n          </FilledButton>\n        </Dialog.Actions>\n      </Dialog>\n    </div>\n  );\n};\n\nexport default Component;\n"]}

package/lib/esm/timezone-picker/stories/timezone-picker-in-popover-dialog.story.js

@@ -24,7 +24,7 @@ import { Dialog, FilledButton, Popover, TimeZonePicker, } from '@neo4j-ndl/react
 import { useState } from 'react';
 const Component = () => {
     const [selectedTimeZone, setSelectedTimeZone] = useState('UTC');
-    return (_jsxs(Dialog, { isOpen: true, "aria-label": "Dialog", children: [_jsx(Dialog.Header, { children: "Using Timezone Picker inside a popover in a dialog" }), _jsx(Dialog.Description, { className: "n-flex n-flex-col n-gap-token-32", children: _jsxs(Popover, { children: [_jsx(Popover.Trigger, { hasButtonWrapper: true, children: _jsx(FilledButton, { children: "Open Popover" }) }), _jsx(Popover.Content, { className: "n-p-token-16", children: _jsx(TimeZonePicker, { label: "Timezone", value: selectedTimeZone, onChange: setSelectedTimeZone, htmlAttributes: { id: 'time-zone-input' } }) })] }) })] }));
+    return (_jsxs(Dialog, { isOpen: true, "aria-label": "Dialog", children: [_jsx(Dialog.Header, { children: "Using Timezone Picker inside a popover in a dialog" }), _jsx(Dialog.Description, { className: "flex flex-col gap-token-32", children: _jsxs(Popover, { children: [_jsx(Popover.Trigger, { hasButtonWrapper: true, children: _jsx(FilledButton, { children: "Open Popover" }) }), _jsx(Popover.Content, { className: "p-token-16", children: _jsx(TimeZonePicker, { label: "Timezone", value: selectedTimeZone, onChange: setSelectedTimeZone, htmlAttributes: { id: 'time-zone-input' } }) })] }) })] }));
 };
 export default Component;
 //# sourceMappingURL=timezone-picker-in-popover-dialog.story.js.map

package/lib/esm/timezone-picker/stories/timezone-picker-in-popover-dialog.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"timezone-picker-in-popover-dialog.story.js","sourceRoot":"","sources":["../../../../src/timezone-picker/stories/timezone-picker-in-popover-dialog.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EACL,MAAM,EACN,YAAY,EACZ,OAAO,EACP,cAAc,GACf,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAS,KAAK,CAAC,CAAC;IAExE,OAAO,CACL,MAAC,MAAM,IAAC,MAAM,EAAE,IAAI,gBAAa,QAAQ,aACvC,KAAC,MAAM,CAAC,MAAM,qEAEE,EAChB,KAAC,MAAM,CAAC,WAAW,IAAC,SAAS,EAAC,kCAAkC,YAC9D,MAAC,OAAO,eACN,KAAC,OAAO,CAAC,OAAO,IAAC,gBAAgB,kBAC/B,KAAC,YAAY,+BAA4B,GACzB,EAClB,KAAC,OAAO,CAAC,OAAO,IAAC,SAAS,EAAC,cAAc,YACvC,KAAC,cAAc,IACb,KAAK,EAAC,UAAU,EAChB,KAAK,EAAE,gBAAgB,EACvB,QAAQ,EAAE,mBAAmB,EAC7B,cAAc,EAAE,EAAE,EAAE,EAAE,iBAAiB,EAAE,GACzC,GACc,IACV,GACS,IACd,CACV,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 */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport {\n  Dialog,\n  FilledButton,\n  Popover,\n  TimeZonePicker,\n} from '@neo4j-ndl/react';\nimport { useState } from 'react';\n\nconst Component = () => {\n  const [selectedTimeZone, setSelectedTimeZone] = useState<string>('UTC');\n\n  return (\n    <Dialog isOpen={true} aria-label=\"Dialog\">\n      <Dialog.Header>\n        Using Timezone Picker inside a popover in a dialog\n      </Dialog.Header>\n      <Dialog.Description className=\"n-flex n-flex-col n-gap-token-32\">\n        <Popover>\n          <Popover.Trigger hasButtonWrapper>\n            <FilledButton>Open Popover</FilledButton>\n          </Popover.Trigger>\n          <Popover.Content className=\"n-p-token-16\">\n            <TimeZonePicker\n              label=\"Timezone\"\n              value={selectedTimeZone}\n              onChange={setSelectedTimeZone}\n              htmlAttributes={{ id: 'time-zone-input' }}\n            />\n          </Popover.Content>\n        </Popover>\n      </Dialog.Description>\n    </Dialog>\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"timezone-picker-in-popover-dialog.story.js","sourceRoot":"","sources":["../../../../src/timezone-picker/stories/timezone-picker-in-popover-dialog.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EACL,MAAM,EACN,YAAY,EACZ,OAAO,EACP,cAAc,GACf,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAS,KAAK,CAAC,CAAC;IAExE,OAAO,CACL,MAAC,MAAM,IAAC,MAAM,EAAE,IAAI,gBAAa,QAAQ,aACvC,KAAC,MAAM,CAAC,MAAM,qEAEE,EAChB,KAAC,MAAM,CAAC,WAAW,IAAC,SAAS,EAAC,4BAA4B,YACxD,MAAC,OAAO,eACN,KAAC,OAAO,CAAC,OAAO,IAAC,gBAAgB,kBAC/B,KAAC,YAAY,+BAA4B,GACzB,EAClB,KAAC,OAAO,CAAC,OAAO,IAAC,SAAS,EAAC,YAAY,YACrC,KAAC,cAAc,IACb,KAAK,EAAC,UAAU,EAChB,KAAK,EAAE,gBAAgB,EACvB,QAAQ,EAAE,mBAAmB,EAC7B,cAAc,EAAE,EAAE,EAAE,EAAE,iBAAiB,EAAE,GACzC,GACc,IACV,GACS,IACd,CACV,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 */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport {\n  Dialog,\n  FilledButton,\n  Popover,\n  TimeZonePicker,\n} from '@neo4j-ndl/react';\nimport { useState } from 'react';\n\nconst Component = () => {\n  const [selectedTimeZone, setSelectedTimeZone] = useState<string>('UTC');\n\n  return (\n    <Dialog isOpen={true} aria-label=\"Dialog\">\n      <Dialog.Header>\n        Using Timezone Picker inside a popover in a dialog\n      </Dialog.Header>\n      <Dialog.Description className=\"flex flex-col gap-token-32\">\n        <Popover>\n          <Popover.Trigger hasButtonWrapper>\n            <FilledButton>Open Popover</FilledButton>\n          </Popover.Trigger>\n          <Popover.Content className=\"p-token-16\">\n            <TimeZonePicker\n              label=\"Timezone\"\n              value={selectedTimeZone}\n              onChange={setSelectedTimeZone}\n              htmlAttributes={{ id: 'time-zone-input' }}\n            />\n          </Popover.Content>\n        </Popover>\n      </Dialog.Description>\n    </Dialog>\n  );\n};\n\nexport default Component;\n"]}

package/lib/esm/toast/stories/toast-action-story.js

@@ -22,7 +22,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import '@neo4j-ndl/base/lib/neo4j-ds-styles.css';
 import { FilledButton, toast, Toaster } from '@neo4j-ndl/react';
 const Component = () => {
-    return (_jsxs("div", { className: "n-flex n-flex-row n-justify-center", children: [_jsx(Toaster, {}), _jsx(FilledButton, { onClick: () => {
+    return (_jsxs("div", { className: "flex flex-row justify-center", children: [_jsx(Toaster, {}), _jsx(FilledButton, { onClick: () => {
                     toast.neutral('Hello', {
                         actionLabel: 'Action',
                         onAction: () => {

package/lib/esm/toast/stories/toast-action-story.js.map

@@ -1 +1 @@
-{"version":3,"file":"toast-action-story.js","sourceRoot":"","sources":["../../../../src/toast/stories/toast-action-story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,YAAY,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAEhE,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,eAAK,SAAS,EAAC,oCAAoC,aAEjD,KAAC,OAAO,KAAG,EACX,KAAC,YAAY,IACX,OAAO,EAAE,GAAG,EAAE;oBACZ,KAAK,CAAC,OAAO,CAAC,OAAO,EAAE;wBACrB,WAAW,EAAE,QAAQ;wBACrB,QAAQ,EAAE,GAAG,EAAE;4BACb,OAAO,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;wBACzB,CAAC;wBACD,mBAAmB,EAAE,IAAI;qBAC1B,CAAC,CAAC;gBACL,CAAC,sCAGY,IACX,CACP,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 */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { FilledButton, toast, Toaster } from '@neo4j-ndl/react';\n\nconst Component = () => {\n  return (\n    <div className=\"n-flex n-flex-row n-justify-center\">\n      {/* Toaster should be at the root of the app */}\n      <Toaster />\n      <FilledButton\n        onClick={() => {\n          toast.neutral('Hello', {\n            actionLabel: 'Action',\n            onAction: () => {\n              console.info('action');\n            },\n            shouldCloseOnAction: true,\n          });\n        }}\n      >\n        Press to show a Toast\n      </FilledButton>\n    </div>\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"toast-action-story.js","sourceRoot":"","sources":["../../../../src/toast/stories/toast-action-story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,YAAY,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAEhE,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,eAAK,SAAS,EAAC,8BAA8B,aAE3C,KAAC,OAAO,KAAG,EACX,KAAC,YAAY,IACX,OAAO,EAAE,GAAG,EAAE;oBACZ,KAAK,CAAC,OAAO,CAAC,OAAO,EAAE;wBACrB,WAAW,EAAE,QAAQ;wBACrB,QAAQ,EAAE,GAAG,EAAE;4BACb,OAAO,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;wBACzB,CAAC;wBACD,mBAAmB,EAAE,IAAI;qBAC1B,CAAC,CAAC;gBACL,CAAC,sCAGY,IACX,CACP,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 */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { FilledButton, toast, Toaster } from '@neo4j-ndl/react';\n\nconst Component = () => {\n  return (\n    <div className=\"flex flex-row justify-center\">\n      {/* Toaster should be at the root of the app */}\n      <Toaster />\n      <FilledButton\n        onClick={() => {\n          toast.neutral('Hello', {\n            actionLabel: 'Action',\n            onAction: () => {\n              console.info('action');\n            },\n            shouldCloseOnAction: true,\n          });\n        }}\n      >\n        Press to show a Toast\n      </FilledButton>\n    </div>\n  );\n};\n\nexport default Component;\n"]}

package/lib/esm/toast/stories/toast-closeable-story.js

@@ -22,7 +22,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import '@neo4j-ndl/base/lib/neo4j-ds-styles.css';
 import { FilledButton, toast, Toaster } from '@neo4j-ndl/react';
 const Component = () => {
-    return (_jsxs("div", { className: "n-flex n-justify-center", children: [_jsx(Toaster, {}), _jsx(FilledButton, { onClick: () => {
+    return (_jsxs("div", { className: "flex justify-center", children: [_jsx(Toaster, {}), _jsx(FilledButton, { onClick: () => {
                     toast.neutral('Hello', {
                         isCloseable: true,
                         onClose: () => {

package/lib/esm/toast/stories/toast-closeable-story.js.map

@@ -1 +1 @@
-{"version":3,"file":"toast-closeable-story.js","sourceRoot":"","sources":["../../../../src/toast/stories/toast-closeable-story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,YAAY,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAEhE,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,eAAK,SAAS,EAAC,yBAAyB,aAEtC,KAAC,OAAO,KAAG,EACX,KAAC,YAAY,IACX,OAAO,EAAE,GAAG,EAAE;oBACZ,KAAK,CAAC,OAAO,CAAC,OAAO,EAAE;wBACrB,WAAW,EAAE,IAAI;wBACjB,OAAO,EAAE,GAAG,EAAE;4BACZ,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;wBACxB,CAAC;qBACF,CAAC,CAAC;gBACL,CAAC,sCAGY,IACX,CACP,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 */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { FilledButton, toast, Toaster } from '@neo4j-ndl/react';\n\nconst Component = () => {\n  return (\n    <div className=\"n-flex n-justify-center\">\n      {/* Toaster should be at the root of the app */}\n      <Toaster />\n      <FilledButton\n        onClick={() => {\n          toast.neutral('Hello', {\n            isCloseable: true,\n            onClose: () => {\n              console.info('close');\n            },\n          });\n        }}\n      >\n        Press to show a Toast\n      </FilledButton>\n    </div>\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"toast-closeable-story.js","sourceRoot":"","sources":["../../../../src/toast/stories/toast-closeable-story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,YAAY,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAEhE,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,eAAK,SAAS,EAAC,qBAAqB,aAElC,KAAC,OAAO,KAAG,EACX,KAAC,YAAY,IACX,OAAO,EAAE,GAAG,EAAE;oBACZ,KAAK,CAAC,OAAO,CAAC,OAAO,EAAE;wBACrB,WAAW,EAAE,IAAI;wBACjB,OAAO,EAAE,GAAG,EAAE;4BACZ,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;wBACxB,CAAC;qBACF,CAAC,CAAC;gBACL,CAAC,sCAGY,IACX,CACP,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 */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { FilledButton, toast, Toaster } from '@neo4j-ndl/react';\n\nconst Component = () => {\n  return (\n    <div className=\"flex justify-center\">\n      {/* Toaster should be at the root of the app */}\n      <Toaster />\n      <FilledButton\n        onClick={() => {\n          toast.neutral('Hello', {\n            isCloseable: true,\n            onClose: () => {\n              console.info('close');\n            },\n          });\n        }}\n      >\n        Press to show a Toast\n      </FilledButton>\n    </div>\n  );\n};\n\nexport default Component;\n"]}