npm - @neo4j-ndl/react - Versions diffs - 4.25.8 → 5.0.0-alpha.0.3d763f7 - Mend

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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1176) hide show

package/lib/cjs/popover/use-popover.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"use-popover.js","sourceRoot":"","sources":["../../../src/popover/use-popover.tsx"],"names":[],"mappings":"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","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport {\n autoUpdate,\n flip,\n type FloatingFocusManagerProps,\n offset,\n type OffsetOptions,\n type Placement,\n shift,\n size,\n useClick,\n useClientPoint,\n useDismiss,\n useFloating,\n useInteractions,\n type UseInteractionsReturn,\n useRole,\n useTransitionStyles,\n} from '@floating-ui/react';\nimport { tokens } from '@neo4j-ndl/base';\nimport { useMemo, useState } from 'react';\n\nexport interface PopoverOptions {\n isInitialOpen?: boolean;\n placement?: Placement;\n isOpen?: boolean;\n onOpenChange?: (open: boolean, event?: Event) => void;\n offsetOption?: OffsetOptions;\n anchorElement?: Element \| null;\n anchorPosition?: {\n // TODO v5: create componentProps type for this\n // oxlint-disable-next-line id-length\n x: number;\n // TODO v5: create componentProps type for this\n // oxlint-disable-next-line id-length\n y: number;\n };\n // TODO v5: fix boolean naming convention\n // eslint-disable-next-line @typescript-eslint/naming-convention\n anchorElementAsPortalAnchor?: boolean;\n shouldCaptureFocus?: boolean;\n initialFocus?: number \| React.RefObject<HTMLElement \| null>;\n role?:\n \| 'tooltip'\n \| 'dialog'\n \| 'alertdialog'\n \| 'menu'\n \| 'listbox'\n \| 'grid'\n \| 'tree';\n // TODO v5: decide if this naming is okay, or change it\n // eslint-disable-next-line @typescript-eslint/naming-convention\n closeOnClickOutside?: boolean;\n // TODO v5: decide if this naming is okay, or change it\n // eslint-disable-next-line @typescript-eslint/naming-convention\n closeOnReferencePress?: boolean;\n shouldCloseOnFocusOut?: boolean;\n returnFocus?: FloatingFocusManagerProps['returnFocus'];\n strategy?: 'fixed' \| 'absolute';\n isPortaled?: boolean;\n shouldConstrainSize?: boolean;\n}\n\nexport interface UsePopoverReturn\n extends UseInteractionsReturn, ReturnType<typeof useFloating> {\n isOpen: boolean;\n labelId: string \| undefined;\n descriptionId: string \| undefined;\n transitionStyles: React.CSSProperties;\n setLabelId: (labelId: string \| undefined) => void;\n setDescriptionId: (descriptionId: string \| undefined) => void;\n // TODO v5: fix boolean naming convention\n // eslint-disable-next-line @typescript-eslint/naming-convention\n anchorElementAsPortalAnchor: boolean \| undefined;\n shouldCaptureFocus: boolean \| undefined;\n shouldCloseOnFocusOut: boolean \| undefined;\n initialFocus: number \| React.RefObject<HTMLElement \| null> \| undefined;\n isPortaled: boolean;\n returnFocus: FloatingFocusManagerProps['returnFocus'];\n}\n\nexport function usePopover({\n isInitialOpen = false,\n placement = 'bottom',\n isOpen: controlledOpen,\n onOpenChange: setControlledOpen,\n offsetOption = 10,\n anchorElement,\n anchorPosition,\n anchorElementAsPortalAnchor,\n shouldCaptureFocus,\n initialFocus,\n role: roleProp,\n closeOnClickOutside,\n closeOnReferencePress,\n shouldCloseOnFocusOut,\n returnFocus,\n strategy = 'absolute',\n isPortaled = true,\n shouldConstrainSize = false,\n}: PopoverOptions = {}): UsePopoverReturn {\n // Internal state for uncontrolled mode (no `isOpen` prop provided).\n const [isOpenUncontrolled, setIsOpenUncontrolled] = useState(isInitialOpen);\n const [labelId, setLabelId] = useState<string \| undefined>();\n const [descriptionId, setDescriptionId] = useState<string \| undefined>();\n\n // Controlled/uncontrolled pattern: prefer the consumer-provided `isOpen`,\n // falling back to internal state when not provided.\n const isOpen = controlledOpen ?? isOpenUncontrolled;\n\n const data = useFloating({\n elements: {\n reference: anchorElement,\n },\n middleware: [\n offset(offsetOption),\n flip({\n crossAxis: placement.includes('-'),\n fallbackAxisSideDirection: 'end',\n padding: 5,\n }),\n shift(),\n ...(shouldConstrainSize\n ? [\n size({\n apply({ availableHeight, availableWidth, elements }) {\n Object.assign(elements.floating.style, {\n maxHeight: `${availableHeight}px`,\n maxWidth: `${availableWidth}px`,\n });\n },\n padding: 5,\n }),\n ]\n : []),\n ],\n // Floating UI calls this when interactions (useClick, useDismiss, etc.)\n // trigger an open/close. We always sync internal state so uncontrolled\n // mode works, and notify the consumer callback exactly once if provided.\n onOpenChange: (open, event) => {\n setIsOpenUncontrolled(open);\n setControlledOpen?.(open, event);\n },\n open: isOpen,\n placement: placement,\n strategy,\n whileElementsMounted: autoUpdate,\n });\n const context = data.context;\n\n // Only enable built-in click-to-toggle in uncontrolled mode. In controlled\n // mode the consumer owns the open state and wires up their own trigger.\n const click = useClick(context, {\n enabled: controlledOpen === undefined,\n });\n\n const dismiss = useDismiss(context, {\n outsidePress: closeOnClickOutside,\n referencePress: closeOnReferencePress,\n });\n const role = useRole(context, {\n role: roleProp,\n });\n\n const clientPoint = useClientPoint(context, {\n enabled: anchorPosition !== undefined,\n // oxlint-disable-next-line id-length\n x: anchorPosition?.x,\n // oxlint-disable-next-line id-length\n y: anchorPosition?.y,\n });\n\n const interactions = useInteractions([click, dismiss, role, clientPoint]);\n\n const { styles: transitionStyles } = useTransitionStyles(context, {\n duration: Number.parseInt(tokens.motion.duration.quick) ?? 0,\n });\n\n return useMemo(\n () => ({\n ...data,\n ...interactions,\n anchorElementAsPortalAnchor,\n descriptionId,\n initialFocus,\n isOpen,\n isPortaled,\n labelId,\n returnFocus,\n setDescriptionId,\n setLabelId,\n shouldCaptureFocus,\n shouldCloseOnFocusOut,\n transitionStyles,\n }),\n [\n isOpen,\n interactions,\n data,\n transitionStyles,\n labelId,\n descriptionId,\n anchorElementAsPortalAnchor,\n shouldCaptureFocus,\n shouldCloseOnFocusOut,\n initialFocus,\n isPortaled,\n returnFocus,\n ],\n );\n}\n"]}
1	+ {"version":3,"file":"use-popover.js","sourceRoot":"","sources":["../../../src/popover/use-popover.tsx"],"names":[],"mappings":"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","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n /\nimport {\n autoUpdate,\n flip,\n type FloatingFocusManagerProps,\n offset,\n type OffsetOptions,\n type Placement,\n shift,\n size,\n useClick,\n useClientPoint,\n useDismiss,\n useFloating,\n useInteractions,\n type UseInteractionsReturn,\n useRole,\n useTransitionStyles,\n} from '@floating-ui/react';\nimport { tokens } from '@neo4j-ndl/base';\nimport { useMemo, useState } from 'react';\n\n/\n Client coordinates used to anchor a floating element at a fixed point\n * (e.g. the cursor position for a context menu), instead of at an anchor element.\n */\nexport type AnchorPosition = {\n // oxlint-disable-next-line id-length\n x: number;\n // oxlint-disable-next-line id-length\n y: number;\n};\n\nexport interface PopoverOptions {\n isInitialOpen?: boolean;\n placement?: Placement;\n isOpen?: boolean;\n onOpenChange?: (open: boolean, event?: Event) => void;\n offsetOption?: OffsetOptions;\n anchorElement?: Element \| null;\n anchorPosition?: AnchorPosition;\n hasAnchorElementAsPortalAnchor?: boolean;\n shouldCaptureFocus?: boolean;\n initialFocus?: number \| React.RefObject<HTMLElement \| null>;\n role?:\n \| 'tooltip'\n \| 'dialog'\n \| 'alertdialog'\n \| 'menu'\n \| 'listbox'\n \| 'grid'\n \| 'tree';\n shouldCloseOnClickOutside?: boolean;\n shouldCloseOnReferencePress?: boolean;\n shouldCloseOnFocusOut?: boolean;\n returnFocus?: FloatingFocusManagerProps['returnFocus'];\n strategy?: 'fixed' \| 'absolute';\n isPortaled?: boolean;\n shouldConstrainSize?: boolean;\n}\n\nexport interface UsePopoverReturn\n extends UseInteractionsReturn, ReturnType<typeof useFloating> {\n isOpen: boolean;\n labelId: string \| undefined;\n descriptionId: string \| undefined;\n transitionStyles: React.CSSProperties;\n setLabelId: (labelId: string \| undefined) => void;\n setDescriptionId: (descriptionId: string \| undefined) => void;\n hasAnchorElementAsPortalAnchor: boolean \| undefined;\n shouldCaptureFocus: boolean \| undefined;\n shouldCloseOnFocusOut: boolean \| undefined;\n initialFocus: number \| React.RefObject<HTMLElement \| null> \| undefined;\n isPortaled: boolean;\n returnFocus: FloatingFocusManagerProps['returnFocus'];\n}\n\nexport function usePopover({\n isInitialOpen = false,\n placement = 'bottom',\n isOpen: controlledOpen,\n onOpenChange: setControlledOpen,\n offsetOption = 10,\n anchorElement,\n anchorPosition,\n hasAnchorElementAsPortalAnchor,\n shouldCaptureFocus,\n initialFocus,\n role: roleProp,\n shouldCloseOnClickOutside,\n shouldCloseOnReferencePress,\n shouldCloseOnFocusOut,\n returnFocus,\n strategy = 'absolute',\n isPortaled = true,\n shouldConstrainSize = false,\n}: PopoverOptions = {}): UsePopoverReturn {\n // Internal state for uncontrolled mode (no `isOpen` prop provided).\n const [isOpenUncontrolled, setIsOpenUncontrolled] = useState(isInitialOpen);\n const [labelId, setLabelId] = useState<string \| undefined>();\n const [descriptionId, setDescriptionId] = useState<string \| undefined>();\n\n // Controlled/uncontrolled pattern: prefer the consumer-provided `isOpen`,\n // falling back to internal state when not provided.\n const isOpen = controlledOpen ?? isOpenUncontrolled;\n\n const data = useFloating({\n elements: {\n reference: anchorElement,\n },\n middleware: [\n offset(offsetOption),\n flip({\n crossAxis: placement.includes('-'),\n fallbackAxisSideDirection: 'end',\n padding: 5,\n }),\n shift(),\n ...(shouldConstrainSize\n ? [\n size({\n apply({ availableHeight, availableWidth, elements }) {\n Object.assign(elements.floating.style, {\n maxHeight: `${availableHeight}px`,\n maxWidth: `${availableWidth}px`,\n });\n },\n padding: 5,\n }),\n ]\n : []),\n ],\n // Floating UI calls this when interactions (useClick, useDismiss, etc.)\n // trigger an open/close. We always sync internal state so uncontrolled\n // mode works, and notify the consumer callback exactly once if provided.\n onOpenChange: (open, event) => {\n setIsOpenUncontrolled(open);\n setControlledOpen?.(open, event);\n },\n open: isOpen,\n placement: placement,\n strategy,\n whileElementsMounted: autoUpdate,\n });\n const context = data.context;\n\n // Only enable built-in click-to-toggle in uncontrolled mode. In controlled\n // mode the consumer owns the open state and wires up their own trigger.\n const click = useClick(context, {\n enabled: controlledOpen === undefined,\n });\n\n const dismiss = useDismiss(context, {\n outsidePress: shouldCloseOnClickOutside,\n referencePress: shouldCloseOnReferencePress,\n });\n const role = useRole(context, { role: roleProp });\n\n const clientPoint = useClientPoint(context, {\n enabled: anchorPosition !== undefined,\n // oxlint-disable-next-line id-length\n x: anchorPosition?.x,\n // oxlint-disable-next-line id-length\n y: anchorPosition?.y,\n });\n\n const interactions = useInteractions([click, dismiss, role, clientPoint]);\n\n const { styles: transitionStyles } = useTransitionStyles(context, {\n duration: Number.parseInt(tokens.motion.duration.quick) ?? 0,\n });\n\n return useMemo(\n () => ({\n ...data,\n ...interactions,\n descriptionId,\n hasAnchorElementAsPortalAnchor,\n initialFocus,\n isOpen,\n isPortaled,\n labelId,\n returnFocus,\n setDescriptionId,\n setLabelId,\n shouldCaptureFocus,\n shouldCloseOnFocusOut,\n transitionStyles,\n }),\n [\n isOpen,\n interactions,\n data,\n transitionStyles,\n labelId,\n descriptionId,\n hasAnchorElementAsPortalAnchor,\n shouldCaptureFocus,\n shouldCloseOnFocusOut,\n initialFocus,\n isPortaled,\n returnFocus,\n ],\n );\n}\n"]}

package/lib/cjs/progress-bar/stories/progress-bar-sizes.story.js CHANGED Viewed

@@ -24,7 +24,7 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 require("@neo4j-ndl/base/lib/neo4j-ds-styles.css");
 const react_1 = require("@neo4j-ndl/react");
 const Component = () => {
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-gap-token-16", children: [(0, jsx_runtime_1.jsx)(react_1.ProgressBar, { value: 75, size: "small", heading: "Small" }), (0, jsx_runtime_1.jsx)(react_1.ProgressBar, { value: 75, size: "large", heading: "Large" })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-token-16", children: [(0, jsx_runtime_1.jsx)(react_1.ProgressBar, { value: 75, size: "small", heading: "Small" }), (0, jsx_runtime_1.jsx)(react_1.ProgressBar, { value: 75, size: "large", heading: "Large" })] }));
 };
 exports.default = Component;
 //# sourceMappingURL=progress-bar-sizes.story.js.map

package/lib/cjs/progress-bar/stories/progress-bar-sizes.story.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"progress-bar-sizes.story.js","sourceRoot":"","sources":["../../../../src/progress-bar/stories/progress-bar-sizes.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA+C;AAE/C,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,iCAAK,SAAS,EAAC,~~kCAAkC~~,~~aAC/C~~,uBAAC,mBAAW,IAAC,KAAK,EAAE,EAAE,EAAE,IAAI,EAAC,OAAO,EAAC,OAAO,EAAC,OAAO,GAAG,EACvD,uBAAC,mBAAW,IAAC,KAAK,EAAE,EAAE,EAAE,IAAI,EAAC,OAAO,EAAC,OAAO,EAAC,OAAO,GAAG,IACnD,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { ProgressBar } from '@neo4j-ndl/react';\n\nconst Component = () => {\n return (\n <div className=\"n-flex n-flex-col n-gap-token-16\">\n <ProgressBar value={75} size=\"small\" heading=\"Small\" />\n <ProgressBar value={75} size=\"large\" heading=\"Large\" />\n </div>\n );\n};\n\nexport default Component;\n"]}
1	+ {"version":3,"file":"progress-bar-sizes.story.js","sourceRoot":"","sources":["../../../../src/progress-bar/stories/progress-bar-sizes.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA+C;AAE/C,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,iCAAK,SAAS,EAAC,4BAA4B,aACzC,uBAAC,mBAAW,IAAC,KAAK,EAAE,EAAE,EAAE,IAAI,EAAC,OAAO,EAAC,OAAO,EAAC,OAAO,GAAG,EACvD,uBAAC,mBAAW,IAAC,KAAK,EAAE,EAAE,EAAE,IAAI,EAAC,OAAO,EAAC,OAAO,EAAC,OAAO,GAAG,IACnD,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { ProgressBar } from '@neo4j-ndl/react';\n\nconst Component = () => {\n return (\n <div className=\"flex flex-col gap-token-16\">\n <ProgressBar value={75} size=\"small\" heading=\"Small\" />\n <ProgressBar value={75} size=\"large\" heading=\"Large\" />\n </div>\n );\n};\n\nexport default Component;\n"]}

package/lib/cjs/radio/stories/radio-disabled.story.js CHANGED Viewed

@@ -24,7 +24,7 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 require("@neo4j-ndl/base/lib/neo4j-ds-styles.css");
 const react_1 = require("@neo4j-ndl/react");
 const Component = () => {
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-gap-token-12", children: [(0, jsx_runtime_1.jsx)(react_1.Radio, { label: "Radio label", isDisabled: true }), (0, jsx_runtime_1.jsx)(react_1.Radio, { label: "Radio label", isDisabled: true, isChecked: true })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-token-12", children: [(0, jsx_runtime_1.jsx)(react_1.Radio, { label: "Radio label", isDisabled: true }), (0, jsx_runtime_1.jsx)(react_1.Radio, { label: "Radio label", isDisabled: true, isChecked: true })] }));
 };
 exports.default = Component;
 //# sourceMappingURL=radio-disabled.story.js.map

package/lib/cjs/radio/stories/radio-disabled.story.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"radio-disabled.story.js","sourceRoot":"","sources":["../../../../src/radio/stories/radio-disabled.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAyC;AAEzC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,iCAAK,SAAS,EAAC,~~kCAAkC~~,~~aAC/C~~,uBAAC,aAAK,IAAC,KAAK,EAAC,aAAa,EAAC,UAAU,SAAG,EACxC,uBAAC,aAAK,IAAC,KAAK,EAAC,aAAa,EAAC,UAAU,QAAC,SAAS,SAAG,IAC9C,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { Radio } from '@neo4j-ndl/react';\n\nconst Component = () => {\n return (\n <div className=\"n-flex n-flex-col n-gap-token-12\">\n <Radio label=\"Radio label\" isDisabled />\n <Radio label=\"Radio label\" isDisabled isChecked />\n </div>\n );\n};\n\nexport default Component;\n"]}
1	+ {"version":3,"file":"radio-disabled.story.js","sourceRoot":"","sources":["../../../../src/radio/stories/radio-disabled.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAyC;AAEzC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,iCAAK,SAAS,EAAC,4BAA4B,aACzC,uBAAC,aAAK,IAAC,KAAK,EAAC,aAAa,EAAC,UAAU,SAAG,EACxC,uBAAC,aAAK,IAAC,KAAK,EAAC,aAAa,EAAC,UAAU,QAAC,SAAS,SAAG,IAC9C,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { Radio } from '@neo4j-ndl/react';\n\nconst Component = () => {\n return (\n <div className=\"flex flex-col gap-token-12\">\n <Radio label=\"Radio label\" isDisabled />\n <Radio label=\"Radio label\" isDisabled isChecked />\n </div>\n );\n};\n\nexport default Component;\n"]}

package/lib/cjs/radio/stories/radio-truncated-label.story.js CHANGED Viewed

@@ -24,7 +24,7 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 require("@neo4j-ndl/base/lib/neo4j-ds-styles.css");
 const react_1 = require("@neo4j-ndl/react");
 const Component = () => {
-    return ((0, jsx_runtime_1.jsx)("div", { className: "n-max-w-32", children: (0, jsx_runtime_1.jsx)(react_1.Radio, { label: "This is a long label that will overflow" }) }));
+    return ((0, jsx_runtime_1.jsx)("div", { className: "max-w-32", children: (0, jsx_runtime_1.jsx)(react_1.Radio, { label: "This is a long label that will overflow" }) }));
 };
 exports.default = Component;
 //# sourceMappingURL=radio-truncated-label.story.js.map

package/lib/cjs/radio/stories/radio-truncated-label.story.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"radio-truncated-label.story.js","sourceRoot":"","sources":["../../../../src/radio/stories/radio-truncated-label.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAyC;AAEzC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,gCAAK,SAAS,EAAC,~~YAAY~~,~~YACzB~~,uBAAC,aAAK,IAAC,KAAK,EAAC,yCAAyC,GAAG,GACrD,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { Radio } from '@neo4j-ndl/react';\n\nconst Component = () => {\n return (\n <div className=\"n-max-w-32\">\n <Radio label=\"This is a long label that will overflow\" />\n </div>\n );\n};\n\nexport default Component;\n"]}
1	+ {"version":3,"file":"radio-truncated-label.story.js","sourceRoot":"","sources":["../../../../src/radio/stories/radio-truncated-label.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAyC;AAEzC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,gCAAK,SAAS,EAAC,UAAU,YACvB,uBAAC,aAAK,IAAC,KAAK,EAAC,yCAAyC,GAAG,GACrD,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { Radio } from '@neo4j-ndl/react';\n\nconst Component = () => {\n return (\n <div className=\"max-w-32\">\n <Radio label=\"This is a long label that will overflow\" />\n </div>\n );\n};\n\nexport default Component;\n"]}

package/lib/cjs/read-only-tag/stories/read-only-tag-colors.story.js CHANGED Viewed

@@ -24,7 +24,7 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 require("@neo4j-ndl/base/lib/neo4j-ds-styles.css");
 const react_1 = require("@neo4j-ndl/react");
 const Component = () => {
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-gap-token-16", children: [(0, jsx_runtime_1.jsx)(react_1.ReadOnlyTag, { color: "1", children: "Categorical color 1" }), (0, jsx_runtime_1.jsx)(react_1.ReadOnlyTag, { color: "2", children: "Categorical color 2" }), (0, jsx_runtime_1.jsx)(react_1.ReadOnlyTag, { color: "3", children: "Categorical color 3" }), (0, jsx_runtime_1.jsx)(react_1.ReadOnlyTag, { color: "4", children: "Categorical color 4" }), (0, jsx_runtime_1.jsx)(react_1.ReadOnlyTag, { color: "5", children: "Categorical color 5" }), (0, jsx_runtime_1.jsx)(react_1.ReadOnlyTag, { color: "6", children: "Categorical color 6" }), (0, jsx_runtime_1.jsx)(react_1.ReadOnlyTag, { color: "7", children: "Categorical color 7" }), (0, jsx_runtime_1.jsx)(react_1.ReadOnlyTag, { color: "8", children: "Categorical color 8" })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-token-16", children: [(0, jsx_runtime_1.jsx)(react_1.ReadOnlyTag, { color: "1", children: "Categorical color 1" }), (0, jsx_runtime_1.jsx)(react_1.ReadOnlyTag, { color: "2", children: "Categorical color 2" }), (0, jsx_runtime_1.jsx)(react_1.ReadOnlyTag, { color: "3", children: "Categorical color 3" }), (0, jsx_runtime_1.jsx)(react_1.ReadOnlyTag, { color: "4", children: "Categorical color 4" }), (0, jsx_runtime_1.jsx)(react_1.ReadOnlyTag, { color: "5", children: "Categorical color 5" }), (0, jsx_runtime_1.jsx)(react_1.ReadOnlyTag, { color: "6", children: "Categorical color 6" }), (0, jsx_runtime_1.jsx)(react_1.ReadOnlyTag, { color: "7", children: "Categorical color 7" }), (0, jsx_runtime_1.jsx)(react_1.ReadOnlyTag, { color: "8", children: "Categorical color 8" })] }));
 };
 exports.default = Component;
 //# sourceMappingURL=read-only-tag-colors.story.js.map

package/lib/cjs/read-only-tag/stories/read-only-tag-colors.story.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"read-only-tag-colors.story.js","sourceRoot":"","sources":["../../../../src/read-only-tag/stories/read-only-tag-colors.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA+C;AAE/C,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,iCAAK,SAAS,EAAC,~~kCAAkC~~,~~aAC/C~~,uBAAC,mBAAW,IAAC,KAAK,EAAC,GAAG,oCAAkC,EACxD,uBAAC,mBAAW,IAAC,KAAK,EAAC,GAAG,oCAAkC,EACxD,uBAAC,mBAAW,IAAC,KAAK,EAAC,GAAG,oCAAkC,EACxD,uBAAC,mBAAW,IAAC,KAAK,EAAC,GAAG,oCAAkC,EACxD,uBAAC,mBAAW,IAAC,KAAK,EAAC,GAAG,oCAAkC,EACxD,uBAAC,mBAAW,IAAC,KAAK,EAAC,GAAG,oCAAkC,EACxD,uBAAC,mBAAW,IAAC,KAAK,EAAC,GAAG,oCAAkC,EACxD,uBAAC,mBAAW,IAAC,KAAK,EAAC,GAAG,oCAAkC,IACpD,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { ReadOnlyTag } from '@neo4j-ndl/react';\n\nconst Component = () => {\n return (\n <div className=\"n-flex n-flex-col n-gap-token-16\">\n <ReadOnlyTag color=\"1\">Categorical color 1</ReadOnlyTag>\n <ReadOnlyTag color=\"2\">Categorical color 2</ReadOnlyTag>\n <ReadOnlyTag color=\"3\">Categorical color 3</ReadOnlyTag>\n <ReadOnlyTag color=\"4\">Categorical color 4</ReadOnlyTag>\n <ReadOnlyTag color=\"5\">Categorical color 5</ReadOnlyTag>\n <ReadOnlyTag color=\"6\">Categorical color 6</ReadOnlyTag>\n <ReadOnlyTag color=\"7\">Categorical color 7</ReadOnlyTag>\n <ReadOnlyTag color=\"8\">Categorical color 8</ReadOnlyTag>\n </div>\n );\n};\n\nexport default Component;\n"]}
1	+ {"version":3,"file":"read-only-tag-colors.story.js","sourceRoot":"","sources":["../../../../src/read-only-tag/stories/read-only-tag-colors.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA+C;AAE/C,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,iCAAK,SAAS,EAAC,4BAA4B,aACzC,uBAAC,mBAAW,IAAC,KAAK,EAAC,GAAG,oCAAkC,EACxD,uBAAC,mBAAW,IAAC,KAAK,EAAC,GAAG,oCAAkC,EACxD,uBAAC,mBAAW,IAAC,KAAK,EAAC,GAAG,oCAAkC,EACxD,uBAAC,mBAAW,IAAC,KAAK,EAAC,GAAG,oCAAkC,EACxD,uBAAC,mBAAW,IAAC,KAAK,EAAC,GAAG,oCAAkC,EACxD,uBAAC,mBAAW,IAAC,KAAK,EAAC,GAAG,oCAAkC,EACxD,uBAAC,mBAAW,IAAC,KAAK,EAAC,GAAG,oCAAkC,EACxD,uBAAC,mBAAW,IAAC,KAAK,EAAC,GAAG,oCAAkC,IACpD,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { ReadOnlyTag } from '@neo4j-ndl/react';\n\nconst Component = () => {\n return (\n <div className=\"flex flex-col gap-token-16\">\n <ReadOnlyTag color=\"1\">Categorical color 1</ReadOnlyTag>\n <ReadOnlyTag color=\"2\">Categorical color 2</ReadOnlyTag>\n <ReadOnlyTag color=\"3\">Categorical color 3</ReadOnlyTag>\n <ReadOnlyTag color=\"4\">Categorical color 4</ReadOnlyTag>\n <ReadOnlyTag color=\"5\">Categorical color 5</ReadOnlyTag>\n <ReadOnlyTag color=\"6\">Categorical color 6</ReadOnlyTag>\n <ReadOnlyTag color=\"7\">Categorical color 7</ReadOnlyTag>\n <ReadOnlyTag color=\"8\">Categorical color 8</ReadOnlyTag>\n </div>\n );\n};\n\nexport default Component;\n"]}

package/lib/cjs/read-only-tag/stories/read-only-tag-sizes.story.js CHANGED Viewed

@@ -24,7 +24,7 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 require("@neo4j-ndl/base/lib/neo4j-ds-styles.css");
 const react_1 = require("@neo4j-ndl/react");
 const Component = () => {
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-8", children: [(0, jsx_runtime_1.jsx)(react_1.ReadOnlyTag, { size: "x-small", children: "X-Small" }), (0, jsx_runtime_1.jsx)(react_1.ReadOnlyTag, { size: "small", children: "Small" }), (0, jsx_runtime_1.jsx)(react_1.ReadOnlyTag, { size: "medium", children: "Medium" }), (0, jsx_runtime_1.jsx)(react_1.ReadOnlyTag, { size: "large", children: "Large" })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-row gap-token-8", children: [(0, jsx_runtime_1.jsx)(react_1.ReadOnlyTag, { size: "x-small", children: "X-Small" }), (0, jsx_runtime_1.jsx)(react_1.ReadOnlyTag, { size: "small", children: "Small" }), (0, jsx_runtime_1.jsx)(react_1.ReadOnlyTag, { size: "medium", children: "Medium" }), (0, jsx_runtime_1.jsx)(react_1.ReadOnlyTag, { size: "large", children: "Large" })] }));
 };
 exports.default = Component;
 //# sourceMappingURL=read-only-tag-sizes.story.js.map

package/lib/cjs/read-only-tag/stories/read-only-tag-sizes.story.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"read-only-tag-sizes.story.js","sourceRoot":"","sources":["../../../../src/read-only-tag/stories/read-only-tag-sizes.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA+C;AAE/C,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,iCAAK,SAAS,EAAC,~~iCAAiC~~,~~aAC9C~~,uBAAC,mBAAW,IAAC,IAAI,EAAC,SAAS,wBAAsB,EACjD,uBAAC,mBAAW,IAAC,IAAI,EAAC,OAAO,sBAAoB,EAC7C,uBAAC,mBAAW,IAAC,IAAI,EAAC,QAAQ,uBAAqB,EAC/C,uBAAC,mBAAW,IAAC,IAAI,EAAC,OAAO,sBAAoB,IACzC,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { ReadOnlyTag } from '@neo4j-ndl/react';\n\nconst Component = () => {\n return (\n <div className=\"n-flex n-flex-row n-gap-token-8\">\n <ReadOnlyTag size=\"x-small\">X-Small</ReadOnlyTag>\n <ReadOnlyTag size=\"small\">Small</ReadOnlyTag>\n <ReadOnlyTag size=\"medium\">Medium</ReadOnlyTag>\n <ReadOnlyTag size=\"large\">Large</ReadOnlyTag>\n </div>\n );\n};\n\nexport default Component;\n"]}
1	+ {"version":3,"file":"read-only-tag-sizes.story.js","sourceRoot":"","sources":["../../../../src/read-only-tag/stories/read-only-tag-sizes.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA+C;AAE/C,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,iCAAK,SAAS,EAAC,2BAA2B,aACxC,uBAAC,mBAAW,IAAC,IAAI,EAAC,SAAS,wBAAsB,EACjD,uBAAC,mBAAW,IAAC,IAAI,EAAC,OAAO,sBAAoB,EAC7C,uBAAC,mBAAW,IAAC,IAAI,EAAC,QAAQ,uBAAqB,EAC/C,uBAAC,mBAAW,IAAC,IAAI,EAAC,OAAO,sBAAoB,IACzC,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { ReadOnlyTag } from '@neo4j-ndl/react';\n\nconst Component = () => {\n return (\n <div className=\"flex flex-row gap-token-8\">\n <ReadOnlyTag size=\"x-small\">X-Small</ReadOnlyTag>\n <ReadOnlyTag size=\"small\">Small</ReadOnlyTag>\n <ReadOnlyTag size=\"medium\">Medium</ReadOnlyTag>\n <ReadOnlyTag size=\"large\">Large</ReadOnlyTag>\n </div>\n );\n};\n\nexport default Component;\n"]}

package/lib/cjs/segmented-control/stories/segmented-control-sizes.story.js CHANGED Viewed

@@ -28,7 +28,7 @@ const Component = () => {
     const [selectedSmall, setSelectedSmall] = (0, react_2.useState)('small1');
     const [selectedMedium, setSelectedMedium] = (0, react_2.useState)('medium1');
     const [selectedLarge, setSelectedLarge] = (0, react_2.useState)('large1');
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-gap-token-16", children: [(0, jsx_runtime_1.jsxs)(react_1.SegmentedControl, { selected: selectedSmall, onChange: setSelectedSmall, size: "small", children: [(0, jsx_runtime_1.jsx)(react_1.SegmentedControl.Item, { value: "small1", children: "Small 1" }), (0, jsx_runtime_1.jsx)(react_1.SegmentedControl.Item, { value: "small2", children: "Small 2" }), (0, jsx_runtime_1.jsx)(react_1.SegmentedControl.Item, { value: "small3", children: "Small 3" })] }), (0, jsx_runtime_1.jsxs)(react_1.SegmentedControl, { selected: selectedMedium, onChange: setSelectedMedium, size: "medium", children: [(0, jsx_runtime_1.jsx)(react_1.SegmentedControl.Item, { value: "medium1", children: "Medium 1" }), (0, jsx_runtime_1.jsx)(react_1.SegmentedControl.Item, { value: "medium2", children: "Medium 2" }), (0, jsx_runtime_1.jsx)(react_1.SegmentedControl.Item, { value: "medium3", children: "Medium 3" })] }), (0, jsx_runtime_1.jsxs)(react_1.SegmentedControl, { selected: selectedLarge, onChange: setSelectedLarge, size: "large", children: [(0, jsx_runtime_1.jsx)(react_1.SegmentedControl.Item, { value: "large1", children: "Large 1" }), (0, jsx_runtime_1.jsx)(react_1.SegmentedControl.Item, { value: "large2", children: "Large 2" }), (0, jsx_runtime_1.jsx)(react_1.SegmentedControl.Item, { value: "large3", children: "Large 3" })] })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex gap-token-16", children: [(0, jsx_runtime_1.jsxs)(react_1.SegmentedControl, { selected: selectedSmall, onChange: setSelectedSmall, size: "small", children: [(0, jsx_runtime_1.jsx)(react_1.SegmentedControl.Item, { value: "small1", children: "Small 1" }), (0, jsx_runtime_1.jsx)(react_1.SegmentedControl.Item, { value: "small2", children: "Small 2" }), (0, jsx_runtime_1.jsx)(react_1.SegmentedControl.Item, { value: "small3", children: "Small 3" })] }), (0, jsx_runtime_1.jsxs)(react_1.SegmentedControl, { selected: selectedMedium, onChange: setSelectedMedium, size: "medium", children: [(0, jsx_runtime_1.jsx)(react_1.SegmentedControl.Item, { value: "medium1", children: "Medium 1" }), (0, jsx_runtime_1.jsx)(react_1.SegmentedControl.Item, { value: "medium2", children: "Medium 2" }), (0, jsx_runtime_1.jsx)(react_1.SegmentedControl.Item, { value: "medium3", children: "Medium 3" })] }), (0, jsx_runtime_1.jsxs)(react_1.SegmentedControl, { selected: selectedLarge, onChange: setSelectedLarge, size: "large", children: [(0, jsx_runtime_1.jsx)(react_1.SegmentedControl.Item, { value: "large1", children: "Large 1" }), (0, jsx_runtime_1.jsx)(react_1.SegmentedControl.Item, { value: "large2", children: "Large 2" }), (0, jsx_runtime_1.jsx)(react_1.SegmentedControl.Item, { value: "large3", children: "Large 3" })] })] }));
 };
 exports.default = Component;
 //# sourceMappingURL=segmented-control-sizes.story.js.map

package/lib/cjs/segmented-control/stories/segmented-control-sizes.story.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"segmented-control-sizes.story.js","sourceRoot":"","sources":["../../../../src/segmented-control/stories/segmented-control-sizes.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAoD;AACpD,iCAAiC;AAEjC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,IAAA,gBAAQ,EAAC,QAAQ,CAAC,CAAC;IAC7D,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,IAAA,gBAAQ,EAAC,SAAS,CAAC,CAAC;IAChE,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,IAAA,gBAAQ,EAAC,QAAQ,CAAC,CAAC;IAE7D,OAAO,CACL,iCAAK,SAAS,EAAC,~~uBAAuB~~,~~aACpC~~,wBAAC,wBAAgB,IACf,QAAQ,EAAE,aAAa,EACvB,QAAQ,EAAE,gBAAgB,EAC1B,IAAI,EAAC,OAAO,aAEZ,uBAAC,wBAAgB,CAAC,IAAI,IAAC,KAAK,EAAC,QAAQ,wBAAgC,EACrE,uBAAC,wBAAgB,CAAC,IAAI,IAAC,KAAK,EAAC,QAAQ,wBAAgC,EACrE,uBAAC,wBAAgB,CAAC,IAAI,IAAC,KAAK,EAAC,QAAQ,wBAAgC,IACpD,EAEnB,wBAAC,wBAAgB,IACf,QAAQ,EAAE,cAAc,EACxB,QAAQ,EAAE,iBAAiB,EAC3B,IAAI,EAAC,QAAQ,aAEb,uBAAC,wBAAgB,CAAC,IAAI,IAAC,KAAK,EAAC,SAAS,yBAAiC,EACvE,uBAAC,wBAAgB,CAAC,IAAI,IAAC,KAAK,EAAC,SAAS,yBAAiC,EACvE,uBAAC,wBAAgB,CAAC,IAAI,IAAC,KAAK,EAAC,SAAS,yBAAiC,IACtD,EAEnB,wBAAC,wBAAgB,IACf,QAAQ,EAAE,aAAa,EACvB,QAAQ,EAAE,gBAAgB,EAC1B,IAAI,EAAC,OAAO,aAEZ,uBAAC,wBAAgB,CAAC,IAAI,IAAC,KAAK,EAAC,QAAQ,wBAAgC,EACrE,uBAAC,wBAAgB,CAAC,IAAI,IAAC,KAAK,EAAC,QAAQ,wBAAgC,EACrE,uBAAC,wBAAgB,CAAC,IAAI,IAAC,KAAK,EAAC,QAAQ,wBAAgC,IACpD,IACf,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { SegmentedControl } from '@neo4j-ndl/react';\nimport { useState } from 'react';\n\nconst Component = () => {\n const [selectedSmall, setSelectedSmall] = useState('small1');\n const [selectedMedium, setSelectedMedium] = useState('medium1');\n const [selectedLarge, setSelectedLarge] = useState('large1');\n\n return (\n <div className=\"n-flex n-gap-token-16\">\n <SegmentedControl\n selected={selectedSmall}\n onChange={setSelectedSmall}\n size=\"small\"\n >\n <SegmentedControl.Item value=\"small1\">Small 1</SegmentedControl.Item>\n <SegmentedControl.Item value=\"small2\">Small 2</SegmentedControl.Item>\n <SegmentedControl.Item value=\"small3\">Small 3</SegmentedControl.Item>\n </SegmentedControl>\n\n <SegmentedControl\n selected={selectedMedium}\n onChange={setSelectedMedium}\n size=\"medium\"\n >\n <SegmentedControl.Item value=\"medium1\">Medium 1</SegmentedControl.Item>\n <SegmentedControl.Item value=\"medium2\">Medium 2</SegmentedControl.Item>\n <SegmentedControl.Item value=\"medium3\">Medium 3</SegmentedControl.Item>\n </SegmentedControl>\n\n <SegmentedControl\n selected={selectedLarge}\n onChange={setSelectedLarge}\n size=\"large\"\n >\n <SegmentedControl.Item value=\"large1\">Large 1</SegmentedControl.Item>\n <SegmentedControl.Item value=\"large2\">Large 2</SegmentedControl.Item>\n <SegmentedControl.Item value=\"large3\">Large 3</SegmentedControl.Item>\n </SegmentedControl>\n </div>\n );\n};\n\nexport default Component;\n"]}
1	+ {"version":3,"file":"segmented-control-sizes.story.js","sourceRoot":"","sources":["../../../../src/segmented-control/stories/segmented-control-sizes.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAoD;AACpD,iCAAiC;AAEjC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,IAAA,gBAAQ,EAAC,QAAQ,CAAC,CAAC;IAC7D,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,IAAA,gBAAQ,EAAC,SAAS,CAAC,CAAC;IAChE,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,IAAA,gBAAQ,EAAC,QAAQ,CAAC,CAAC;IAE7D,OAAO,CACL,iCAAK,SAAS,EAAC,mBAAmB,aAChC,wBAAC,wBAAgB,IACf,QAAQ,EAAE,aAAa,EACvB,QAAQ,EAAE,gBAAgB,EAC1B,IAAI,EAAC,OAAO,aAEZ,uBAAC,wBAAgB,CAAC,IAAI,IAAC,KAAK,EAAC,QAAQ,wBAAgC,EACrE,uBAAC,wBAAgB,CAAC,IAAI,IAAC,KAAK,EAAC,QAAQ,wBAAgC,EACrE,uBAAC,wBAAgB,CAAC,IAAI,IAAC,KAAK,EAAC,QAAQ,wBAAgC,IACpD,EAEnB,wBAAC,wBAAgB,IACf,QAAQ,EAAE,cAAc,EACxB,QAAQ,EAAE,iBAAiB,EAC3B,IAAI,EAAC,QAAQ,aAEb,uBAAC,wBAAgB,CAAC,IAAI,IAAC,KAAK,EAAC,SAAS,yBAAiC,EACvE,uBAAC,wBAAgB,CAAC,IAAI,IAAC,KAAK,EAAC,SAAS,yBAAiC,EACvE,uBAAC,wBAAgB,CAAC,IAAI,IAAC,KAAK,EAAC,SAAS,yBAAiC,IACtD,EAEnB,wBAAC,wBAAgB,IACf,QAAQ,EAAE,aAAa,EACvB,QAAQ,EAAE,gBAAgB,EAC1B,IAAI,EAAC,OAAO,aAEZ,uBAAC,wBAAgB,CAAC,IAAI,IAAC,KAAK,EAAC,QAAQ,wBAAgC,EACrE,uBAAC,wBAAgB,CAAC,IAAI,IAAC,KAAK,EAAC,QAAQ,wBAAgC,EACrE,uBAAC,wBAAgB,CAAC,IAAI,IAAC,KAAK,EAAC,QAAQ,wBAAgC,IACpD,IACf,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { SegmentedControl } from '@neo4j-ndl/react';\nimport { useState } from 'react';\n\nconst Component = () => {\n const [selectedSmall, setSelectedSmall] = useState('small1');\n const [selectedMedium, setSelectedMedium] = useState('medium1');\n const [selectedLarge, setSelectedLarge] = useState('large1');\n\n return (\n <div className=\"flex gap-token-16\">\n <SegmentedControl\n selected={selectedSmall}\n onChange={setSelectedSmall}\n size=\"small\"\n >\n <SegmentedControl.Item value=\"small1\">Small 1</SegmentedControl.Item>\n <SegmentedControl.Item value=\"small2\">Small 2</SegmentedControl.Item>\n <SegmentedControl.Item value=\"small3\">Small 3</SegmentedControl.Item>\n </SegmentedControl>\n\n <SegmentedControl\n selected={selectedMedium}\n onChange={setSelectedMedium}\n size=\"medium\"\n >\n <SegmentedControl.Item value=\"medium1\">Medium 1</SegmentedControl.Item>\n <SegmentedControl.Item value=\"medium2\">Medium 2</SegmentedControl.Item>\n <SegmentedControl.Item value=\"medium3\">Medium 3</SegmentedControl.Item>\n </SegmentedControl>\n\n <SegmentedControl\n selected={selectedLarge}\n onChange={setSelectedLarge}\n size=\"large\"\n >\n <SegmentedControl.Item value=\"large1\">Large 1</SegmentedControl.Item>\n <SegmentedControl.Item value=\"large2\">Large 2</SegmentedControl.Item>\n <SegmentedControl.Item value=\"large3\">Large 3</SegmentedControl.Item>\n </SegmentedControl>\n </div>\n );\n};\n\nexport default Component;\n"]}

package/lib/cjs/select/stories/select-controlled.story.js CHANGED Viewed

@@ -32,7 +32,7 @@ const EXAMPLE_OPTIONS = [
 const Component = (props) => {
     var _a;
     const [value, setValue] = (0, react_2.useState)(EXAMPLE_OPTIONS[0]);
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-gap-token-8", children: [(0, jsx_runtime_1.jsx)(react_1.Select, { label: "Label", type: "select", selectProps: {
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-token-8", children: [(0, jsx_runtime_1.jsx)(react_1.Select, { label: "Label", type: "select", selectProps: {
                     isMulti: false,
                     menuIsOpen: (_a = props.selectProps) === null || _a === void 0 ? void 0 : _a.menuIsOpen,
                     menuPortalTarget: document.querySelector('body'),

package/lib/cjs/select/stories/select-controlled.story.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"select-controlled.story.js","sourceRoot":"","sources":["../../../../src/select/stories/select-controlled.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,4CAAsD;AACtD,iCAAiC;AAEjC,MAAM,eAAe,GAAG;IACtB,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE;IAClC,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,QAAQ,EAAE;IACvC,EAAE,KAAK,EAAE,iBAAiB,EAAE,KAAK,EAAE,gBAAgB,EAAE;IACrD,EAAE,UAAU,EAAE,IAAI,EAAE,KAAK,EAAE,0BAA0B,EAAE,KAAK,EAAE,UAAU,EAAE;CAC3E,CAAC;AAEF,MAAM,SAAS,GAAG,CAAC,KAA0C,EAAE,EAAE;;IAC/D,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,IAAA,gBAAQ,EAChC,eAAe,CAAC,CAAC,CAAC,CACnB,CAAC;IAEF,OAAO,CACL,iCAAK,SAAS,EAAC,~~iCAAiC~~,~~aAC9C~~,uBAAC,cAAM,IACL,KAAK,EAAC,OAAO,EACb,IAAI,EAAC,QAAQ,EACb,WAAW,EAAE;oBACX,OAAO,EAAE,KAAK;oBACd,UAAU,EAAE,MAAA,KAAK,CAAC,WAAW,0CAAE,UAAU;oBACzC,gBAAgB,EAAE,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC;oBAChD,QAAQ,EAAE,CAAC,QAAQ,EAAE,EAAE,CAAC,QAAQ,IAAI,QAAQ,CAAC,QAAQ,CAAC;oBACtD,OAAO,EAAE,eAAe;oBACxB,KAAK,EAAE,KAAK;iBACb,GACD,EACF,wBAAC,kBAAU,IAAC,OAAO,EAAC,YAAY,iCACb,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,IAC3B,IACT,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport { Select, Typography } from '@neo4j-ndl/react';\nimport { useState } from 'react';\n\nconst EXAMPLE_OPTIONS = [\n { label: 'Neo4j', value: 'neo4j' },\n { label: 'Needle 🪡', value: 'needle' },\n { label: 'Graph Databases', value: 'graph-database' },\n { isDisabled: true, label: 'Disabled database option', value: 'disabled' },\n];\n\nconst Component = (props: React.ComponentProps<typeof Select>) => {\n const [value, setValue] = useState<(typeof EXAMPLE_OPTIONS)[number]>(\n EXAMPLE_OPTIONS[0],\n );\n\n return (\n <div className=\"n-flex n-flex-col n-gap-token-8\">\n <Select\n label=\"Label\"\n type=\"select\"\n selectProps={{\n isMulti: false,\n menuIsOpen: props.selectProps?.menuIsOpen,\n menuPortalTarget: document.querySelector('body'),\n onChange: (newValue) => newValue && setValue(newValue),\n options: EXAMPLE_OPTIONS,\n value: value,\n }}\n />\n <Typography variant=\"body-small\">\n Value Selected: {JSON.stringify(value)}\n </Typography>\n </div>\n );\n};\n\nexport default Component;\n"]}
1	+ {"version":3,"file":"select-controlled.story.js","sourceRoot":"","sources":["../../../../src/select/stories/select-controlled.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,4CAAsD;AACtD,iCAAiC;AAEjC,MAAM,eAAe,GAAG;IACtB,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE;IAClC,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,QAAQ,EAAE;IACvC,EAAE,KAAK,EAAE,iBAAiB,EAAE,KAAK,EAAE,gBAAgB,EAAE;IACrD,EAAE,UAAU,EAAE,IAAI,EAAE,KAAK,EAAE,0BAA0B,EAAE,KAAK,EAAE,UAAU,EAAE;CAC3E,CAAC;AAEF,MAAM,SAAS,GAAG,CAAC,KAA0C,EAAE,EAAE;;IAC/D,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,IAAA,gBAAQ,EAChC,eAAe,CAAC,CAAC,CAAC,CACnB,CAAC;IAEF,OAAO,CACL,iCAAK,SAAS,EAAC,2BAA2B,aACxC,uBAAC,cAAM,IACL,KAAK,EAAC,OAAO,EACb,IAAI,EAAC,QAAQ,EACb,WAAW,EAAE;oBACX,OAAO,EAAE,KAAK;oBACd,UAAU,EAAE,MAAA,KAAK,CAAC,WAAW,0CAAE,UAAU;oBACzC,gBAAgB,EAAE,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC;oBAChD,QAAQ,EAAE,CAAC,QAAQ,EAAE,EAAE,CAAC,QAAQ,IAAI,QAAQ,CAAC,QAAQ,CAAC;oBACtD,OAAO,EAAE,eAAe;oBACxB,KAAK,EAAE,KAAK;iBACb,GACD,EACF,wBAAC,kBAAU,IAAC,OAAO,EAAC,YAAY,iCACb,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,IAC3B,IACT,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport { Select, Typography } from '@neo4j-ndl/react';\nimport { useState } from 'react';\n\nconst EXAMPLE_OPTIONS = [\n { label: 'Neo4j', value: 'neo4j' },\n { label: 'Needle 🪡', value: 'needle' },\n { label: 'Graph Databases', value: 'graph-database' },\n { isDisabled: true, label: 'Disabled database option', value: 'disabled' },\n];\n\nconst Component = (props: React.ComponentProps<typeof Select>) => {\n const [value, setValue] = useState<(typeof EXAMPLE_OPTIONS)[number]>(\n EXAMPLE_OPTIONS[0],\n );\n\n return (\n <div className=\"flex flex-col gap-token-8\">\n <Select\n label=\"Label\"\n type=\"select\"\n selectProps={{\n isMulti: false,\n menuIsOpen: props.selectProps?.menuIsOpen,\n menuPortalTarget: document.querySelector('body'),\n onChange: (newValue) => newValue && setValue(newValue),\n options: EXAMPLE_OPTIONS,\n value: value,\n }}\n />\n <Typography variant=\"body-small\">\n Value Selected: {JSON.stringify(value)}\n </Typography>\n </div>\n );\n};\n\nexport default Component;\n"]}

package/lib/cjs/select/stories/select-custom-label.story.js CHANGED Viewed

@@ -32,7 +32,7 @@ const EXAMPLE_OPTIONS = [
 ];
 const Component = (props) => {
     var _a;
-    return ((0, jsx_runtime_1.jsx)(react_1.Select, { label: (0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-4 n-h-7 n-items-center", children: ["Custom JSX element", (0, jsx_runtime_1.jsx)(icons_1.QuestionMarkCircleIconOutline, { className: "n-h-token-16" })] }), helpText: "You can have a custom label with JSX code \uD83D\uDE31", type: "select", selectProps: {
+    return ((0, jsx_runtime_1.jsx)(react_1.Select, { label: (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-row gap-token-4 h-7 items-center", children: ["Custom JSX element", (0, jsx_runtime_1.jsx)(icons_1.QuestionMarkCircleIconOutline, { className: "h-token-16" })] }), helpText: "You can have a custom label with JSX code \uD83D\uDE31", type: "select", selectProps: {
             defaultValue: EXAMPLE_OPTIONS[1],
             menuIsOpen: (_a = props.selectProps) === null || _a === void 0 ? void 0 : _a.menuIsOpen,
             options: EXAMPLE_OPTIONS,

package/lib/cjs/select/stories/select-custom-label.story.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"select-custom-label.story.js","sourceRoot":"","sources":["../../../../src/select/stories/select-custom-label.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA0C;AAC1C,kDAAuE;AAEvE,MAAM,eAAe,GAAG;IACtB,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE;IAClC,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,QAAQ,EAAE;IACvC,EAAE,KAAK,EAAE,iBAAiB,EAAE,KAAK,EAAE,gBAAgB,EAAE;IACrD,EAAE,UAAU,EAAE,IAAI,EAAE,KAAK,EAAE,0BAA0B,EAAE,KAAK,EAAE,UAAU,EAAE;CAC3E,CAAC;AACF,MAAM,SAAS,GAAG,CAAC,KAA0C,EAAE,EAAE;;IAC/D,OAAO,CACL,uBAAC,cAAM,IACL,KAAK,EACH,iCAAK,SAAS,EAAC,~~sDAAsD~~,~~mCAEnE~~,uBAAC,qCAA6B,IAAC,SAAS,EAAC,~~cAAc~~,GAAG,~~IACtD~~,EAER,QAAQ,EAAC,wDAA8C,EACvD,IAAI,EAAC,QAAQ,EACb,WAAW,EAAE;YACX,YAAY,EAAE,eAAe,CAAC,CAAC,CAAC;YAChC,UAAU,EAAE,MAAA,KAAK,CAAC,WAAW,0CAAE,UAAU;YACzC,OAAO,EAAE,eAAe;SACzB,GACD,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { Select } from '@neo4j-ndl/react';\nimport { QuestionMarkCircleIconOutline } from '@neo4j-ndl/react/icons';\n\nconst EXAMPLE_OPTIONS = [\n { label: 'Neo4j', value: 'neo4j' },\n { label: 'Needle 🪡', value: 'needle' },\n { label: 'Graph Databases', value: 'graph-database' },\n { isDisabled: true, label: 'Disabled database option', value: 'disabled' },\n];\nconst Component = (props: React.ComponentProps<typeof Select>) => {\n return (\n <Select\n label={\n <div className=\"n-flex n-flex-row n-gap-token-4 n-h-7 n-items-center\">\n Custom JSX element\n <QuestionMarkCircleIconOutline className=\"n-h-token-16\" />\n </div>\n }\n helpText=\"You can have a custom label with JSX code 😱\"\n type=\"select\"\n selectProps={{\n defaultValue: EXAMPLE_OPTIONS[1],\n menuIsOpen: props.selectProps?.menuIsOpen,\n options: EXAMPLE_OPTIONS,\n }}\n />\n );\n};\n\nexport default Component;\n"]}
1	+ {"version":3,"file":"select-custom-label.story.js","sourceRoot":"","sources":["../../../../src/select/stories/select-custom-label.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA0C;AAC1C,kDAAuE;AAEvE,MAAM,eAAe,GAAG;IACtB,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE;IAClC,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,QAAQ,EAAE;IACvC,EAAE,KAAK,EAAE,iBAAiB,EAAE,KAAK,EAAE,gBAAgB,EAAE;IACrD,EAAE,UAAU,EAAE,IAAI,EAAE,KAAK,EAAE,0BAA0B,EAAE,KAAK,EAAE,UAAU,EAAE;CAC3E,CAAC;AACF,MAAM,SAAS,GAAG,CAAC,KAA0C,EAAE,EAAE;;IAC/D,OAAO,CACL,uBAAC,cAAM,IACL,KAAK,EACH,iCAAK,SAAS,EAAC,4CAA4C,mCAEzD,uBAAC,qCAA6B,IAAC,SAAS,EAAC,YAAY,GAAG,IACpD,EAER,QAAQ,EAAC,wDAA8C,EACvD,IAAI,EAAC,QAAQ,EACb,WAAW,EAAE;YACX,YAAY,EAAE,eAAe,CAAC,CAAC,CAAC;YAChC,UAAU,EAAE,MAAA,KAAK,CAAC,WAAW,0CAAE,UAAU;YACzC,OAAO,EAAE,eAAe;SACzB,GACD,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { Select } from '@neo4j-ndl/react';\nimport { QuestionMarkCircleIconOutline } from '@neo4j-ndl/react/icons';\n\nconst EXAMPLE_OPTIONS = [\n { label: 'Neo4j', value: 'neo4j' },\n { label: 'Needle 🪡', value: 'needle' },\n { label: 'Graph Databases', value: 'graph-database' },\n { isDisabled: true, label: 'Disabled database option', value: 'disabled' },\n];\nconst Component = (props: React.ComponentProps<typeof Select>) => {\n return (\n <Select\n label={\n <div className=\"flex flex-row gap-token-4 h-7 items-center\">\n Custom JSX element\n <QuestionMarkCircleIconOutline className=\"h-token-16\" />\n </div>\n }\n helpText=\"You can have a custom label with JSX code 😱\"\n type=\"select\"\n selectProps={{\n defaultValue: EXAMPLE_OPTIONS[1],\n menuIsOpen: props.selectProps?.menuIsOpen,\n options: EXAMPLE_OPTIONS,\n }}\n />\n );\n};\n\nexport default Component;\n"]}

package/lib/cjs/select/stories/select-inside-dialog.story.js CHANGED Viewed

@@ -34,7 +34,7 @@ const Component = (props) => {
     var _a;
     const ref = (0, react_2.useRef)(null);
     const [isOpen, setIsOpen] = (0, react_2.useState)(false);
-    return ((0, jsx_runtime_1.jsxs)("div", { ref: ref, className: "n-flex n-flex-col n-items-center n-justify-center n-relative n-h-[500px]", children: [(0, jsx_runtime_1.jsx)(react_1.FilledButton, { size: "medium", onClick: () => setIsOpen(true), children: "Open Dialog" }), (0, jsx_runtime_1.jsxs)(react_1.Dialog, { container: (ref === null || ref === void 0 ? void 0 : ref.current) || undefined, isOpen: isOpen, onClose: () => setIsOpen(false), "aria-label": "Dialog", children: [(0, jsx_runtime_1.jsx)(react_1.Dialog.Header, { children: "Using Select inside a dialog" }), (0, jsx_runtime_1.jsxs)(react_1.Dialog.Description, { className: "n-flex n-flex-col n-gap-token-32", children: [(0, jsx_runtime_1.jsxs)(react_1.Typography, { variant: "body-medium", children: ["To use select inside a dialog and avoid the cut-off, you need to use the property ", (0, jsx_runtime_1.jsx)("code", { children: "menuPosition: \"fixed\"" }), " inside the", ' ', (0, jsx_runtime_1.jsx)("code", { children: "selectProps" }), ". This is done automatically if used in a Needle Dialog, but can always be overridden manually."] }), (0, jsx_runtime_1.jsx)(react_1.Select, { label: "Inside a dialog", type: "select", selectProps: {
+    return ((0, jsx_runtime_1.jsxs)("div", { ref: ref, className: "flex flex-col items-center justify-center relative h-[500px]", children: [(0, jsx_runtime_1.jsx)(react_1.FilledButton, { size: "medium", onClick: () => setIsOpen(true), children: "Open Dialog" }), (0, jsx_runtime_1.jsxs)(react_1.Dialog, { container: (ref === null || ref === void 0 ? void 0 : ref.current) || undefined, isOpen: isOpen, onClose: () => setIsOpen(false), "aria-label": "Dialog", children: [(0, jsx_runtime_1.jsx)(react_1.Dialog.Header, { children: "Using Select inside a dialog" }), (0, jsx_runtime_1.jsxs)(react_1.Dialog.Description, { className: "flex flex-col gap-token-32", children: [(0, jsx_runtime_1.jsxs)(react_1.Typography, { variant: "body-medium", children: ["To use select inside a dialog and avoid the cut-off, you need to use the property ", (0, jsx_runtime_1.jsx)("code", { children: "menuPosition: \"fixed\"" }), " inside the", ' ', (0, jsx_runtime_1.jsx)("code", { children: "selectProps" }), ". This is done automatically if used in a Needle Dialog, but can always be overridden manually."] }), (0, jsx_runtime_1.jsx)(react_1.Select, { label: "Inside a dialog", type: "select", selectProps: {
                                     defaultValue: EXAMPLE_OPTIONS[1],
                                     menuIsOpen: (_a = props.selectProps) === null || _a === void 0 ? void 0 : _a.menuIsOpen,
                                     options: EXAMPLE_OPTIONS,

package/lib/cjs/select/stories/select-inside-dialog.story.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"select-inside-dialog.story.js","sourceRoot":"","sources":["../../../../src/select/stories/select-inside-dialog.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA4E;AAC5E,iCAAyC;AAEzC,MAAM,eAAe,GAAG;IACtB,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE;IAClC,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,QAAQ,EAAE;IACvC,EAAE,KAAK,EAAE,iBAAiB,EAAE,KAAK,EAAE,gBAAgB,EAAE;IACrD,EAAE,UAAU,EAAE,IAAI,EAAE,KAAK,EAAE,0BAA0B,EAAE,KAAK,EAAE,UAAU,EAAE;CAC3E,CAAC;AAEF,MAAM,SAAS,GAAG,CAAC,KAA0C,EAAE,EAAE;;IAC/D,MAAM,GAAG,GAAG,IAAA,cAAM,EAAwB,IAAI,CAAC,CAAC;IAChD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,IAAA,gBAAQ,EAAU,KAAK,CAAC,CAAC;IAErD,OAAO,CACL,iCACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAC,~~0EAA0E~~,~~aAEpF~~,uBAAC,oBAAY,IAAC,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,4BAE3C,EACf,wBAAC,cAAM,IACL,SAAS,EAAE,CAAA,GAAG,aAAH,GAAG,uBAAH,GAAG,CAAE,OAAO,KAAI,SAAS,EACpC,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC,gBACpB,QAAQ,aAEnB,uBAAC,cAAM,CAAC,MAAM,+CAA6C,EAC3D,wBAAC,cAAM,CAAC,WAAW,IAAC,SAAS,EAAC,~~kCAAkC~~,~~aAC9D~~,wBAAC,kBAAU,IAAC,OAAO,EAAC,aAAa,mGAElB,uEAA4C,iBAAY,GAAG,EACxE,2DAAwB,uGAEb,EACb,uBAAC,cAAM,IACL,KAAK,EAAC,iBAAiB,EACvB,IAAI,EAAC,QAAQ,EACb,WAAW,EAAE;oCACX,YAAY,EAAE,eAAe,CAAC,CAAC,CAAC;oCAChC,UAAU,EAAE,MAAA,KAAK,CAAC,WAAW,0CAAE,UAAU;oCACzC,OAAO,EAAE,eAAe;iCACzB,GACD,IACiB,IACd,IACL,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { Dialog, FilledButton, Select, Typography } from '@neo4j-ndl/react';\nimport { useRef, useState } from 'react';\n\nconst EXAMPLE_OPTIONS = [\n { label: 'Neo4j', value: 'neo4j' },\n { label: 'Needle 🪡', value: 'needle' },\n { label: 'Graph Databases', value: 'graph-database' },\n { isDisabled: true, label: 'Disabled database option', value: 'disabled' },\n];\n\nconst Component = (props: React.ComponentProps<typeof Select>) => {\n const ref = useRef<HTMLDivElement \| null>(null);\n const [isOpen, setIsOpen] = useState<boolean>(false);\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 >\n <FilledButton size=\"medium\" onClick={() => setIsOpen(true)}>\n Open Dialog\n </FilledButton>\n <Dialog\n container={ref?.current \|\| undefined}\n isOpen={isOpen}\n onClose={() => setIsOpen(false)}\n aria-label=\"Dialog\"\n >\n <Dialog.Header>Using Select inside a dialog</Dialog.Header>\n <Dialog.Description className=\"n-flex n-flex-col n-gap-token-32\">\n <Typography variant=\"body-medium\">\n To use select inside a dialog and avoid the cut-off, you need to use\n the property <code>menuPosition: "fixed"</code> inside the{' '}\n <code>selectProps</code>. This is done automatically if used in a\n Needle Dialog, but can always be overridden manually.\n </Typography>\n <Select\n label=\"Inside a dialog\"\n type=\"select\"\n selectProps={{\n defaultValue: EXAMPLE_OPTIONS[1],\n menuIsOpen: props.selectProps?.menuIsOpen,\n options: EXAMPLE_OPTIONS,\n }}\n />\n </Dialog.Description>\n </Dialog>\n </div>\n );\n};\n\nexport default Component;\n"]}
1	+ {"version":3,"file":"select-inside-dialog.story.js","sourceRoot":"","sources":["../../../../src/select/stories/select-inside-dialog.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA4E;AAC5E,iCAAyC;AAEzC,MAAM,eAAe,GAAG;IACtB,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE;IAClC,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,QAAQ,EAAE;IACvC,EAAE,KAAK,EAAE,iBAAiB,EAAE,KAAK,EAAE,gBAAgB,EAAE;IACrD,EAAE,UAAU,EAAE,IAAI,EAAE,KAAK,EAAE,0BAA0B,EAAE,KAAK,EAAE,UAAU,EAAE;CAC3E,CAAC;AAEF,MAAM,SAAS,GAAG,CAAC,KAA0C,EAAE,EAAE;;IAC/D,MAAM,GAAG,GAAG,IAAA,cAAM,EAAwB,IAAI,CAAC,CAAC;IAChD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,IAAA,gBAAQ,EAAU,KAAK,CAAC,CAAC;IAErD,OAAO,CACL,iCACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAC,8DAA8D,aAExE,uBAAC,oBAAY,IAAC,IAAI,EAAC,QAAQ,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,4BAE3C,EACf,wBAAC,cAAM,IACL,SAAS,EAAE,CAAA,GAAG,aAAH,GAAG,uBAAH,GAAG,CAAE,OAAO,KAAI,SAAS,EACpC,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC,gBACpB,QAAQ,aAEnB,uBAAC,cAAM,CAAC,MAAM,+CAA6C,EAC3D,wBAAC,cAAM,CAAC,WAAW,IAAC,SAAS,EAAC,4BAA4B,aACxD,wBAAC,kBAAU,IAAC,OAAO,EAAC,aAAa,mGAElB,uEAA4C,iBAAY,GAAG,EACxE,2DAAwB,uGAEb,EACb,uBAAC,cAAM,IACL,KAAK,EAAC,iBAAiB,EACvB,IAAI,EAAC,QAAQ,EACb,WAAW,EAAE;oCACX,YAAY,EAAE,eAAe,CAAC,CAAC,CAAC;oCAChC,UAAU,EAAE,MAAA,KAAK,CAAC,WAAW,0CAAE,UAAU;oCACzC,OAAO,EAAE,eAAe;iCACzB,GACD,IACiB,IACd,IACL,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { Dialog, FilledButton, Select, Typography } from '@neo4j-ndl/react';\nimport { useRef, useState } from 'react';\n\nconst EXAMPLE_OPTIONS = [\n { label: 'Neo4j', value: 'neo4j' },\n { label: 'Needle 🪡', value: 'needle' },\n { label: 'Graph Databases', value: 'graph-database' },\n { isDisabled: true, label: 'Disabled database option', value: 'disabled' },\n];\n\nconst Component = (props: React.ComponentProps<typeof Select>) => {\n const ref = useRef<HTMLDivElement \| null>(null);\n const [isOpen, setIsOpen] = useState<boolean>(false);\n\n return (\n <div\n ref={ref}\n className=\"flex flex-col items-center justify-center relative h-[500px]\"\n >\n <FilledButton size=\"medium\" onClick={() => setIsOpen(true)}>\n Open Dialog\n </FilledButton>\n <Dialog\n container={ref?.current \|\| undefined}\n isOpen={isOpen}\n onClose={() => setIsOpen(false)}\n aria-label=\"Dialog\"\n >\n <Dialog.Header>Using Select inside a dialog</Dialog.Header>\n <Dialog.Description className=\"flex flex-col gap-token-32\">\n <Typography variant=\"body-medium\">\n To use select inside a dialog and avoid the cut-off, you need to use\n the property <code>menuPosition: "fixed"</code> inside the{' '}\n <code>selectProps</code>. This is done automatically if used in a\n Needle Dialog, but can always be overridden manually.\n </Typography>\n <Select\n label=\"Inside a dialog\"\n type=\"select\"\n selectProps={{\n defaultValue: EXAMPLE_OPTIONS[1],\n menuIsOpen: props.selectProps?.menuIsOpen,\n options: EXAMPLE_OPTIONS,\n }}\n />\n </Dialog.Description>\n </Dialog>\n </div>\n );\n};\n\nexport default Component;\n"]}

package/lib/cjs/select/stories/select-menu-positionings.story.js CHANGED Viewed

@@ -29,7 +29,7 @@ const EXAMPLE_OPTIONS = [
 ];
 const Component = (props) => {
     var _a, _b, _c;
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-gap-token-16 n-pt-token-64", children: [(0, jsx_runtime_1.jsx)(react_1.Select, { label: "Automatic menu placement", type: "select", selectProps: {
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex gap-token-16 pt-token-64", children: [(0, jsx_runtime_1.jsx)(react_1.Select, { label: "Automatic menu placement", type: "select", selectProps: {
                     menuIsOpen: (_a = props.selectProps) === null || _a === void 0 ? void 0 : _a.menuIsOpen,
                     menuPlacement: 'auto',
                     options: EXAMPLE_OPTIONS,

package/lib/cjs/select/stories/select-menu-positionings.story.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"select-menu-positionings.story.js","sourceRoot":"","sources":["../../../../src/select/stories/select-menu-positionings.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA0C;AAE1C,MAAM,eAAe,GAAG;IACtB,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE;IAClC,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,QAAQ,EAAE;CACxC,CAAC;AAEF,MAAM,SAAS,GAAG,CAAC,KAA0C,EAAE,EAAE;;IAC/D,OAAO,CACL,iCAAK,SAAS,EAAC,~~qCAAqC~~,~~aAClD,~~uBAAC,cAAM,IACL,KAAK,EAAC,0BAA0B,EAChC,IAAI,EAAC,QAAQ,EACb,WAAW,EAAE;oBACX,UAAU,EAAE,MAAA,KAAK,CAAC,WAAW,0CAAE,UAAU;oBACzC,aAAa,EAAE,MAAM;oBACrB,OAAO,EAAE,eAAe;iBACzB,GACD,EACF,uBAAC,cAAM,IACL,KAAK,EAAC,uBAAuB,EAC7B,IAAI,EAAC,QAAQ,EACb,WAAW,EAAE;oBACX,UAAU,EAAE,MAAA,KAAK,CAAC,WAAW,0CAAE,UAAU;oBACzC,aAAa,EAAE,QAAQ;oBACvB,OAAO,EAAE,eAAe;iBACzB,GACD,EACF,uBAAC,cAAM,IACL,KAAK,EAAC,oBAAoB,EAC1B,IAAI,EAAC,QAAQ,EACb,WAAW,EAAE;oBACX,UAAU,EAAE,MAAA,KAAK,CAAC,WAAW,0CAAE,UAAU;oBACzC,aAAa,EAAE,KAAK;oBACpB,OAAO,EAAE,eAAe;iBACzB,GACD,IACE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { Select } from '@neo4j-ndl/react';\n\nconst EXAMPLE_OPTIONS = [\n { label: 'Neo4j', value: 'neo4j' },\n { label: 'Needle 🪡', value: 'needle' },\n];\n\nconst Component = (props: React.ComponentProps<typeof Select>) => {\n return (\n <div className=\"n-flex n-gap-token-16 n-pt-token-64\">\n <Select\n label=\"Automatic menu placement\"\n type=\"select\"\n selectProps={{\n menuIsOpen: props.selectProps?.menuIsOpen,\n menuPlacement: 'auto',\n options: EXAMPLE_OPTIONS,\n }}\n />\n <Select\n label=\"Bottom menu placement\"\n type=\"select\"\n selectProps={{\n menuIsOpen: props.selectProps?.menuIsOpen,\n menuPlacement: 'bottom',\n options: EXAMPLE_OPTIONS,\n }}\n />\n <Select\n label=\"Top menu placement\"\n type=\"select\"\n selectProps={{\n menuIsOpen: props.selectProps?.menuIsOpen,\n menuPlacement: 'top',\n options: EXAMPLE_OPTIONS,\n }}\n />\n </div>\n );\n};\n\nexport default Component;\n"]}
1	+ {"version":3,"file":"select-menu-positionings.story.js","sourceRoot":"","sources":["../../../../src/select/stories/select-menu-positionings.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA0C;AAE1C,MAAM,eAAe,GAAG;IACtB,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE;IAClC,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,QAAQ,EAAE;CACxC,CAAC;AAEF,MAAM,SAAS,GAAG,CAAC,KAA0C,EAAE,EAAE;;IAC/D,OAAO,CACL,iCAAK,SAAS,EAAC,+BAA+B,aAC5C,uBAAC,cAAM,IACL,KAAK,EAAC,0BAA0B,EAChC,IAAI,EAAC,QAAQ,EACb,WAAW,EAAE;oBACX,UAAU,EAAE,MAAA,KAAK,CAAC,WAAW,0CAAE,UAAU;oBACzC,aAAa,EAAE,MAAM;oBACrB,OAAO,EAAE,eAAe;iBACzB,GACD,EACF,uBAAC,cAAM,IACL,KAAK,EAAC,uBAAuB,EAC7B,IAAI,EAAC,QAAQ,EACb,WAAW,EAAE;oBACX,UAAU,EAAE,MAAA,KAAK,CAAC,WAAW,0CAAE,UAAU;oBACzC,aAAa,EAAE,QAAQ;oBACvB,OAAO,EAAE,eAAe;iBACzB,GACD,EACF,uBAAC,cAAM,IACL,KAAK,EAAC,oBAAoB,EAC1B,IAAI,EAAC,QAAQ,EACb,WAAW,EAAE;oBACX,UAAU,EAAE,MAAA,KAAK,CAAC,WAAW,0CAAE,UAAU;oBACzC,aAAa,EAAE,KAAK;oBACpB,OAAO,EAAE,eAAe;iBACzB,GACD,IACE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { Select } from '@neo4j-ndl/react';\n\nconst EXAMPLE_OPTIONS = [\n { label: 'Neo4j', value: 'neo4j' },\n { label: 'Needle 🪡', value: 'needle' },\n];\n\nconst Component = (props: React.ComponentProps<typeof Select>) => {\n return (\n <div className=\"flex gap-token-16 pt-token-64\">\n <Select\n label=\"Automatic menu placement\"\n type=\"select\"\n selectProps={{\n menuIsOpen: props.selectProps?.menuIsOpen,\n menuPlacement: 'auto',\n options: EXAMPLE_OPTIONS,\n }}\n />\n <Select\n label=\"Bottom menu placement\"\n type=\"select\"\n selectProps={{\n menuIsOpen: props.selectProps?.menuIsOpen,\n menuPlacement: 'bottom',\n options: EXAMPLE_OPTIONS,\n }}\n />\n <Select\n label=\"Top menu placement\"\n type=\"select\"\n selectProps={{\n menuIsOpen: props.selectProps?.menuIsOpen,\n menuPlacement: 'top',\n options: EXAMPLE_OPTIONS,\n }}\n />\n </div>\n );\n};\n\nexport default Component;\n"]}

package/lib/cjs/select/stories/select-required.story.js CHANGED Viewed

@@ -29,7 +29,7 @@ const EXAMPLE_OPTIONS = [
     { label: 'Graph Databases', value: 'graph-database' },
 ];
 const Component = () => {
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-gap-token-16", children: [(0, jsx_runtime_1.jsx)(react_1.Select, { label: "Required", type: "select", isRequired: true, hasRequiredIndicator: true, selectProps: {
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-token-16", children: [(0, jsx_runtime_1.jsx)(react_1.Select, { label: "Required", type: "select", isRequired: true, hasRequiredIndicator: true, selectProps: {
                     options: EXAMPLE_OPTIONS,
                 } }), (0, jsx_runtime_1.jsx)(react_1.Select, { label: "Optional", type: "select", hasRequiredIndicator: true, selectProps: {
                     options: EXAMPLE_OPTIONS,

package/lib/cjs/select/stories/select-required.story.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"select-required.story.js","sourceRoot":"","sources":["../../../../src/select/stories/select-required.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA0C;AAE1C,MAAM,eAAe,GAAG;IACtB,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE;IAClC,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,QAAQ,EAAE;IACvC,EAAE,KAAK,EAAE,iBAAiB,EAAE,KAAK,EAAE,gBAAgB,EAAE;CACtD,CAAC;AAEF,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,iCAAK,SAAS,EAAC,~~kCAAkC~~,~~aAC/C~~,uBAAC,cAAM,IACL,KAAK,EAAC,UAAU,EAChB,IAAI,EAAC,QAAQ,EACb,UAAU,QACV,oBAAoB,QACpB,WAAW,EAAE;oBACX,OAAO,EAAE,eAAe;iBACzB,GACD,EACF,uBAAC,cAAM,IACL,KAAK,EAAC,UAAU,EAChB,IAAI,EAAC,QAAQ,EACb,oBAAoB,QACpB,WAAW,EAAE;oBACX,OAAO,EAAE,eAAe;iBACzB,GACD,IACE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { Select } from '@neo4j-ndl/react';\n\nconst EXAMPLE_OPTIONS = [\n { label: 'Neo4j', value: 'neo4j' },\n { label: 'Needle 🪡', value: 'needle' },\n { label: 'Graph Databases', value: 'graph-database' },\n];\n\nconst Component = () => {\n return (\n <div className=\"n-flex n-flex-col n-gap-token-16\">\n <Select\n label=\"Required\"\n type=\"select\"\n isRequired\n hasRequiredIndicator\n selectProps={{\n options: EXAMPLE_OPTIONS,\n }}\n />\n <Select\n label=\"Optional\"\n type=\"select\"\n hasRequiredIndicator\n selectProps={{\n options: EXAMPLE_OPTIONS,\n }}\n />\n </div>\n );\n};\n\nexport default Component;\n"]}
1	+ {"version":3,"file":"select-required.story.js","sourceRoot":"","sources":["../../../../src/select/stories/select-required.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA0C;AAE1C,MAAM,eAAe,GAAG;IACtB,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE;IAClC,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,QAAQ,EAAE;IACvC,EAAE,KAAK,EAAE,iBAAiB,EAAE,KAAK,EAAE,gBAAgB,EAAE;CACtD,CAAC;AAEF,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,iCAAK,SAAS,EAAC,4BAA4B,aACzC,uBAAC,cAAM,IACL,KAAK,EAAC,UAAU,EAChB,IAAI,EAAC,QAAQ,EACb,UAAU,QACV,oBAAoB,QACpB,WAAW,EAAE;oBACX,OAAO,EAAE,eAAe;iBACzB,GACD,EACF,uBAAC,cAAM,IACL,KAAK,EAAC,UAAU,EAChB,IAAI,EAAC,QAAQ,EACb,oBAAoB,QACpB,WAAW,EAAE;oBACX,OAAO,EAAE,eAAe;iBACzB,GACD,IACE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { Select } from '@neo4j-ndl/react';\n\nconst EXAMPLE_OPTIONS = [\n { label: 'Neo4j', value: 'neo4j' },\n { label: 'Needle 🪡', value: 'needle' },\n { label: 'Graph Databases', value: 'graph-database' },\n];\n\nconst Component = () => {\n return (\n <div className=\"flex flex-col gap-token-16\">\n <Select\n label=\"Required\"\n type=\"select\"\n isRequired\n hasRequiredIndicator\n selectProps={{\n options: EXAMPLE_OPTIONS,\n }}\n />\n <Select\n label=\"Optional\"\n type=\"select\"\n hasRequiredIndicator\n selectProps={{\n options: EXAMPLE_OPTIONS,\n }}\n />\n </div>\n );\n};\n\nexport default Component;\n"]}

package/lib/cjs/select/stories/select-sizes.story.js CHANGED Viewed

@@ -31,7 +31,7 @@ const EXAMPLE_OPTIONS = [
 ];
 const Component = (props) => {
     var _a, _b, _c;
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-gap-token-16", children: [(0, jsx_runtime_1.jsx)(react_1.Select, { label: "Small", type: "select", size: "small", selectProps: {
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex gap-token-16", children: [(0, jsx_runtime_1.jsx)(react_1.Select, { label: "Small", type: "select", size: "small", selectProps: {
                     menuIsOpen: (_a = props.selectProps) === null || _a === void 0 ? void 0 : _a.menuIsOpen,
                     options: EXAMPLE_OPTIONS,
                 } }), (0, jsx_runtime_1.jsx)(react_1.Select, { label: "Medium", type: "select", size: "medium", selectProps: {

package/lib/cjs/select/stories/select-sizes.story.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"select-sizes.story.js","sourceRoot":"","sources":["../../../../src/select/stories/select-sizes.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA0C;AAE1C,MAAM,eAAe,GAAG;IACtB,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE;IAClC,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,QAAQ,EAAE;IACvC,EAAE,KAAK,EAAE,iBAAiB,EAAE,KAAK,EAAE,gBAAgB,EAAE;IACrD,EAAE,UAAU,EAAE,IAAI,EAAE,KAAK,EAAE,0BAA0B,EAAE,KAAK,EAAE,UAAU,EAAE;CAC3E,CAAC;AAEF,MAAM,SAAS,GAAG,CAAC,KAA0C,EAAE,EAAE;;IAC/D,OAAO,CACL,iCAAK,SAAS,EAAC,~~uBAAuB~~,~~aACpC~~,uBAAC,cAAM,IACL,KAAK,EAAC,OAAO,EACb,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,OAAO,EACZ,WAAW,EAAE;oBACX,UAAU,EAAE,MAAA,KAAK,CAAC,WAAW,0CAAE,UAAU;oBACzC,OAAO,EAAE,eAAe;iBACzB,GACD,EACF,uBAAC,cAAM,IACL,KAAK,EAAC,QAAQ,EACd,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,QAAQ,EACb,WAAW,EAAE;oBACX,UAAU,EAAE,MAAA,KAAK,CAAC,WAAW,0CAAE,UAAU;oBACzC,OAAO,EAAE,eAAe;iBACzB,GACD,EACF,uBAAC,cAAM,IACL,KAAK,EAAC,OAAO,EACb,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,OAAO,EACZ,WAAW,EAAE;oBACX,UAAU,EAAE,MAAA,KAAK,CAAC,WAAW,0CAAE,UAAU;oBACzC,OAAO,EAAE,eAAe;iBACzB,GACD,IACE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { Select } from '@neo4j-ndl/react';\n\nconst EXAMPLE_OPTIONS = [\n { label: 'Neo4j', value: 'neo4j' },\n { label: 'Needle 🪡', value: 'needle' },\n { label: 'Graph Databases', value: 'graph-database' },\n { isDisabled: true, label: 'Disabled database option', value: 'disabled' },\n];\n\nconst Component = (props: React.ComponentProps<typeof Select>) => {\n return (\n <div className=\"n-flex n-gap-token-16\">\n <Select\n label=\"Small\"\n type=\"select\"\n size=\"small\"\n selectProps={{\n menuIsOpen: props.selectProps?.menuIsOpen,\n options: EXAMPLE_OPTIONS,\n }}\n />\n <Select\n label=\"Medium\"\n type=\"select\"\n size=\"medium\"\n selectProps={{\n menuIsOpen: props.selectProps?.menuIsOpen,\n options: EXAMPLE_OPTIONS,\n }}\n />\n <Select\n label=\"Large\"\n type=\"select\"\n size=\"large\"\n selectProps={{\n menuIsOpen: props.selectProps?.menuIsOpen,\n options: EXAMPLE_OPTIONS,\n }}\n />\n </div>\n );\n};\n\nexport default Component;\n"]}
1	+ {"version":3,"file":"select-sizes.story.js","sourceRoot":"","sources":["../../../../src/select/stories/select-sizes.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA0C;AAE1C,MAAM,eAAe,GAAG;IACtB,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE;IAClC,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,QAAQ,EAAE;IACvC,EAAE,KAAK,EAAE,iBAAiB,EAAE,KAAK,EAAE,gBAAgB,EAAE;IACrD,EAAE,UAAU,EAAE,IAAI,EAAE,KAAK,EAAE,0BAA0B,EAAE,KAAK,EAAE,UAAU,EAAE;CAC3E,CAAC;AAEF,MAAM,SAAS,GAAG,CAAC,KAA0C,EAAE,EAAE;;IAC/D,OAAO,CACL,iCAAK,SAAS,EAAC,mBAAmB,aAChC,uBAAC,cAAM,IACL,KAAK,EAAC,OAAO,EACb,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,OAAO,EACZ,WAAW,EAAE;oBACX,UAAU,EAAE,MAAA,KAAK,CAAC,WAAW,0CAAE,UAAU;oBACzC,OAAO,EAAE,eAAe;iBACzB,GACD,EACF,uBAAC,cAAM,IACL,KAAK,EAAC,QAAQ,EACd,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,QAAQ,EACb,WAAW,EAAE;oBACX,UAAU,EAAE,MAAA,KAAK,CAAC,WAAW,0CAAE,UAAU;oBACzC,OAAO,EAAE,eAAe;iBACzB,GACD,EACF,uBAAC,cAAM,IACL,KAAK,EAAC,OAAO,EACb,IAAI,EAAC,QAAQ,EACb,IAAI,EAAC,OAAO,EACZ,WAAW,EAAE;oBACX,UAAU,EAAE,MAAA,KAAK,CAAC,WAAW,0CAAE,UAAU;oBACzC,OAAO,EAAE,eAAe;iBACzB,GACD,IACE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { Select } from '@neo4j-ndl/react';\n\nconst EXAMPLE_OPTIONS = [\n { label: 'Neo4j', value: 'neo4j' },\n { label: 'Needle 🪡', value: 'needle' },\n { label: 'Graph Databases', value: 'graph-database' },\n { isDisabled: true, label: 'Disabled database option', value: 'disabled' },\n];\n\nconst Component = (props: React.ComponentProps<typeof Select>) => {\n return (\n <div className=\"flex gap-token-16\">\n <Select\n label=\"Small\"\n type=\"select\"\n size=\"small\"\n selectProps={{\n menuIsOpen: props.selectProps?.menuIsOpen,\n options: EXAMPLE_OPTIONS,\n }}\n />\n <Select\n label=\"Medium\"\n type=\"select\"\n size=\"medium\"\n selectProps={{\n menuIsOpen: props.selectProps?.menuIsOpen,\n options: EXAMPLE_OPTIONS,\n }}\n />\n <Select\n label=\"Large\"\n type=\"select\"\n size=\"large\"\n selectProps={{\n menuIsOpen: props.selectProps?.menuIsOpen,\n options: EXAMPLE_OPTIONS,\n }}\n />\n </div>\n );\n};\n\nexport default Component;\n"]}

package/lib/cjs/select-icon-button/stories/select-icon-button-sizes.story.js CHANGED Viewed

@@ -25,7 +25,7 @@ require("@neo4j-ndl/base/lib/neo4j-ds-styles.css");
 const react_1 = require("@neo4j-ndl/react");
 const icons_1 = require("@neo4j-ndl/react/icons");
 const Component = () => {
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-gap-token-16", children: [(0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.SelectIconButton, { description: "Select", size: "small", isOpen: false, children: (0, jsx_runtime_1.jsx)(icons_1.SelectIcon, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "label", children: " Small" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.SelectIconButton, { description: "Select", size: "medium", isOpen: false, children: (0, jsx_runtime_1.jsx)(icons_1.SelectIcon, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "label", children: " Medium" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.SelectIconButton, { description: "Select", size: "large", isOpen: false, children: (0, jsx_runtime_1.jsx)(icons_1.SelectIcon, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "label", children: " Large" })] })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-token-16", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex flex-row gap-token-16 items-center", children: [(0, jsx_runtime_1.jsx)(react_1.SelectIconButton, { description: "Select", size: "small", isOpen: false, children: (0, jsx_runtime_1.jsx)(icons_1.SelectIcon, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "label", children: " Small" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-row gap-token-16 items-center", children: [(0, jsx_runtime_1.jsx)(react_1.SelectIconButton, { description: "Select", size: "medium", isOpen: false, children: (0, jsx_runtime_1.jsx)(icons_1.SelectIcon, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "label", children: " Medium" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-row gap-token-16 items-center", children: [(0, jsx_runtime_1.jsx)(react_1.SelectIconButton, { description: "Select", size: "large", isOpen: false, children: (0, jsx_runtime_1.jsx)(icons_1.SelectIcon, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "label", children: " Large" })] })] }));
 };
 exports.default = Component;
 //# sourceMappingURL=select-icon-button-sizes.story.js.map

package/lib/cjs/select-icon-button/stories/select-icon-button-sizes.story.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"select-icon-button-sizes.story.js","sourceRoot":"","sources":["../../../../src/select-icon-button/stories/select-icon-button-sizes.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAgE;AAChE,kDAAoD;AAEpD,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,iCAAK,SAAS,EAAC,~~kCAAkC~~,~~aAC/C~~,iCAAK,SAAS,EAAC,~~iDAAiD~~,~~aAC9D~~,uBAAC,wBAAgB,IAAC,WAAW,EAAC,QAAQ,EAAC,IAAI,EAAC,OAAO,EAAC,MAAM,EAAE,KAAK,YAC/D,uBAAC,kBAAU,KAAG,GACG,EACnB,uBAAC,kBAAU,IAAC,OAAO,EAAC,OAAO,uBAAoB,IAC3C,EACN,iCAAK,SAAS,EAAC,~~iDAAiD~~,~~aAC9D~~,uBAAC,wBAAgB,IAAC,WAAW,EAAC,QAAQ,EAAC,IAAI,EAAC,QAAQ,EAAC,MAAM,EAAE,KAAK,YAChE,uBAAC,kBAAU,KAAG,GACG,EACnB,uBAAC,kBAAU,IAAC,OAAO,EAAC,OAAO,wBAAqB,IAC5C,EACN,iCAAK,SAAS,EAAC,~~iDAAiD~~,~~aAC9D~~,uBAAC,wBAAgB,IAAC,WAAW,EAAC,QAAQ,EAAC,IAAI,EAAC,OAAO,EAAC,MAAM,EAAE,KAAK,YAC/D,uBAAC,kBAAU,KAAG,GACG,EACnB,uBAAC,kBAAU,IAAC,OAAO,EAAC,OAAO,uBAAoB,IAC3C,IACF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { SelectIconButton, Typography } from '@neo4j-ndl/react';\nimport { SelectIcon } from '@neo4j-ndl/react/icons';\n\nconst Component = () => {\n return (\n <div className=\"n-flex n-flex-col n-gap-token-16\">\n <div className=\"n-flex n-flex-row n-gap-token-16 n-items-center\">\n <SelectIconButton description=\"Select\" size=\"small\" isOpen={false}>\n <SelectIcon />\n </SelectIconButton>\n <Typography variant=\"label\"> Small</Typography>\n </div>\n <div className=\"n-flex n-flex-row n-gap-token-16 n-items-center\">\n <SelectIconButton description=\"Select\" size=\"medium\" isOpen={false}>\n <SelectIcon />\n </SelectIconButton>\n <Typography variant=\"label\"> Medium</Typography>\n </div>\n <div className=\"n-flex n-flex-row n-gap-token-16 n-items-center\">\n <SelectIconButton description=\"Select\" size=\"large\" isOpen={false}>\n <SelectIcon />\n </SelectIconButton>\n <Typography variant=\"label\"> Large</Typography>\n </div>\n </div>\n );\n};\n\nexport default Component;\n"]}
1	+ {"version":3,"file":"select-icon-button-sizes.story.js","sourceRoot":"","sources":["../../../../src/select-icon-button/stories/select-icon-button-sizes.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAgE;AAChE,kDAAoD;AAEpD,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,iCAAK,SAAS,EAAC,4BAA4B,aACzC,iCAAK,SAAS,EAAC,yCAAyC,aACtD,uBAAC,wBAAgB,IAAC,WAAW,EAAC,QAAQ,EAAC,IAAI,EAAC,OAAO,EAAC,MAAM,EAAE,KAAK,YAC/D,uBAAC,kBAAU,KAAG,GACG,EACnB,uBAAC,kBAAU,IAAC,OAAO,EAAC,OAAO,uBAAoB,IAC3C,EACN,iCAAK,SAAS,EAAC,yCAAyC,aACtD,uBAAC,wBAAgB,IAAC,WAAW,EAAC,QAAQ,EAAC,IAAI,EAAC,QAAQ,EAAC,MAAM,EAAE,KAAK,YAChE,uBAAC,kBAAU,KAAG,GACG,EACnB,uBAAC,kBAAU,IAAC,OAAO,EAAC,OAAO,wBAAqB,IAC5C,EACN,iCAAK,SAAS,EAAC,yCAAyC,aACtD,uBAAC,wBAAgB,IAAC,WAAW,EAAC,QAAQ,EAAC,IAAI,EAAC,OAAO,EAAC,MAAM,EAAE,KAAK,YAC/D,uBAAC,kBAAU,KAAG,GACG,EACnB,uBAAC,kBAAU,IAAC,OAAO,EAAC,OAAO,uBAAoB,IAC3C,IACF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { SelectIconButton, Typography } from '@neo4j-ndl/react';\nimport { SelectIcon } from '@neo4j-ndl/react/icons';\n\nconst Component = () => {\n return (\n <div className=\"flex flex-col gap-token-16\">\n <div className=\"flex flex-row gap-token-16 items-center\">\n <SelectIconButton description=\"Select\" size=\"small\" isOpen={false}>\n <SelectIcon />\n </SelectIconButton>\n <Typography variant=\"label\"> Small</Typography>\n </div>\n <div className=\"flex flex-row gap-token-16 items-center\">\n <SelectIconButton description=\"Select\" size=\"medium\" isOpen={false}>\n <SelectIcon />\n </SelectIconButton>\n <Typography variant=\"label\"> Medium</Typography>\n </div>\n <div className=\"flex flex-row gap-token-16 items-center\">\n <SelectIconButton description=\"Select\" size=\"large\" isOpen={false}>\n <SelectIcon />\n </SelectIconButton>\n <Typography variant=\"label\"> Large</Typography>\n </div>\n </div>\n );\n};\n\nexport default Component;\n"]}

package/lib/cjs/select-icon-button/stories/select-icon-button-states.story.js CHANGED Viewed

@@ -25,7 +25,7 @@ require("@neo4j-ndl/base/lib/neo4j-ds-styles.css");
 const react_1 = require("@neo4j-ndl/react");
 const icons_1 = require("@neo4j-ndl/react/icons");
 const Component = () => {
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-gap-token-16", children: [(0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.SelectIconButton, { description: "Select", size: "small", isDisabled: true, isOpen: false, children: (0, jsx_runtime_1.jsx)(icons_1.SelectIcon, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "label", children: " Disabled" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.SelectIconButton, { description: "Select", size: "small", isOpen: true, children: (0, jsx_runtime_1.jsx)(icons_1.SelectIcon, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "label", children: " Active" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.SelectIconButton, { description: "Select", size: "small", isLoading: true, loadingMessage: "Loading", isOpen: false, children: (0, jsx_runtime_1.jsx)(icons_1.SelectIcon, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "label", children: " Loading" })] })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-token-16", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex flex-row gap-token-16 items-center", children: [(0, jsx_runtime_1.jsx)(react_1.SelectIconButton, { description: "Select", size: "small", isDisabled: true, isOpen: false, children: (0, jsx_runtime_1.jsx)(icons_1.SelectIcon, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "label", children: " Disabled" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-row gap-token-16 items-center", children: [(0, jsx_runtime_1.jsx)(react_1.SelectIconButton, { description: "Select", size: "small", isOpen: true, children: (0, jsx_runtime_1.jsx)(icons_1.SelectIcon, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "label", children: " Active" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-row gap-token-16 items-center", children: [(0, jsx_runtime_1.jsx)(react_1.SelectIconButton, { description: "Select", size: "small", isLoading: true, loadingMessage: "Loading", isOpen: false, children: (0, jsx_runtime_1.jsx)(icons_1.SelectIcon, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "label", children: " Loading" })] })] }));
 };
 exports.default = Component;
 //# sourceMappingURL=select-icon-button-states.story.js.map

package/lib/cjs/select-icon-button/stories/select-icon-button-states.story.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"select-icon-button-states.story.js","sourceRoot":"","sources":["../../../../src/select-icon-button/stories/select-icon-button-states.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAgE;AAChE,kDAAoD;AAEpD,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,iCAAK,SAAS,EAAC,~~kCAAkC~~,~~aAC/C~~,iCAAK,SAAS,EAAC,~~iDAAiD~~,~~aAC9D~~,uBAAC,wBAAgB,IACf,WAAW,EAAC,QAAQ,EACpB,IAAI,EAAC,OAAO,EACZ,UAAU,QACV,MAAM,EAAE,KAAK,YAEb,uBAAC,kBAAU,KAAG,GACG,EACnB,uBAAC,kBAAU,IAAC,OAAO,EAAC,OAAO,0BAAuB,IAC9C,EACN,iCAAK,SAAS,EAAC,~~iDAAiD~~,~~aAC9D~~,uBAAC,wBAAgB,IAAC,WAAW,EAAC,QAAQ,EAAC,IAAI,EAAC,OAAO,EAAC,MAAM,EAAE,IAAI,YAC9D,uBAAC,kBAAU,KAAG,GACG,EACnB,uBAAC,kBAAU,IAAC,OAAO,EAAC,OAAO,wBAAqB,IAC5C,EACN,iCAAK,SAAS,EAAC,~~iDAAiD~~,~~aAC9D~~,uBAAC,wBAAgB,IACf,WAAW,EAAC,QAAQ,EACpB,IAAI,EAAC,OAAO,EACZ,SAAS,QACT,cAAc,EAAC,SAAS,EACxB,MAAM,EAAE,KAAK,YAEb,uBAAC,kBAAU,KAAG,GACG,EACnB,uBAAC,kBAAU,IAAC,OAAO,EAAC,OAAO,yBAAsB,IAC7C,IACF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { SelectIconButton, Typography } from '@neo4j-ndl/react';\nimport { SelectIcon } from '@neo4j-ndl/react/icons';\n\nconst Component = () => {\n return (\n <div className=\"n-flex n-flex-col n-gap-token-16\">\n <div className=\"n-flex n-flex-row n-gap-token-16 n-items-center\">\n <SelectIconButton\n description=\"Select\"\n size=\"small\"\n isDisabled\n isOpen={false}\n >\n <SelectIcon />\n </SelectIconButton>\n <Typography variant=\"label\"> Disabled</Typography>\n </div>\n <div className=\"n-flex n-flex-row n-gap-token-16 n-items-center\">\n <SelectIconButton description=\"Select\" size=\"small\" isOpen={true}>\n <SelectIcon />\n </SelectIconButton>\n <Typography variant=\"label\"> Active</Typography>\n </div>\n <div className=\"n-flex n-flex-row n-gap-token-16 n-items-center\">\n <SelectIconButton\n description=\"Select\"\n size=\"small\"\n isLoading\n loadingMessage=\"Loading\"\n isOpen={false}\n >\n <SelectIcon />\n </SelectIconButton>\n <Typography variant=\"label\"> Loading</Typography>\n </div>\n </div>\n );\n};\n\nexport default Component;\n"]}
1	+ {"version":3,"file":"select-icon-button-states.story.js","sourceRoot":"","sources":["../../../../src/select-icon-button/stories/select-icon-button-states.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAgE;AAChE,kDAAoD;AAEpD,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,iCAAK,SAAS,EAAC,4BAA4B,aACzC,iCAAK,SAAS,EAAC,yCAAyC,aACtD,uBAAC,wBAAgB,IACf,WAAW,EAAC,QAAQ,EACpB,IAAI,EAAC,OAAO,EACZ,UAAU,QACV,MAAM,EAAE,KAAK,YAEb,uBAAC,kBAAU,KAAG,GACG,EACnB,uBAAC,kBAAU,IAAC,OAAO,EAAC,OAAO,0BAAuB,IAC9C,EACN,iCAAK,SAAS,EAAC,yCAAyC,aACtD,uBAAC,wBAAgB,IAAC,WAAW,EAAC,QAAQ,EAAC,IAAI,EAAC,OAAO,EAAC,MAAM,EAAE,IAAI,YAC9D,uBAAC,kBAAU,KAAG,GACG,EACnB,uBAAC,kBAAU,IAAC,OAAO,EAAC,OAAO,wBAAqB,IAC5C,EACN,iCAAK,SAAS,EAAC,yCAAyC,aACtD,uBAAC,wBAAgB,IACf,WAAW,EAAC,QAAQ,EACpB,IAAI,EAAC,OAAO,EACZ,SAAS,QACT,cAAc,EAAC,SAAS,EACxB,MAAM,EAAE,KAAK,YAEb,uBAAC,kBAAU,KAAG,GACG,EACnB,uBAAC,kBAAU,IAAC,OAAO,EAAC,OAAO,yBAAsB,IAC7C,IACF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { SelectIconButton, Typography } from '@neo4j-ndl/react';\nimport { SelectIcon } from '@neo4j-ndl/react/icons';\n\nconst Component = () => {\n return (\n <div className=\"flex flex-col gap-token-16\">\n <div className=\"flex flex-row gap-token-16 items-center\">\n <SelectIconButton\n description=\"Select\"\n size=\"small\"\n isDisabled\n isOpen={false}\n >\n <SelectIcon />\n </SelectIconButton>\n <Typography variant=\"label\"> Disabled</Typography>\n </div>\n <div className=\"flex flex-row gap-token-16 items-center\">\n <SelectIconButton description=\"Select\" size=\"small\" isOpen={true}>\n <SelectIcon />\n </SelectIconButton>\n <Typography variant=\"label\"> Active</Typography>\n </div>\n <div className=\"flex flex-row gap-token-16 items-center\">\n <SelectIconButton\n description=\"Select\"\n size=\"small\"\n isLoading\n loadingMessage=\"Loading\"\n isOpen={false}\n >\n <SelectIcon />\n </SelectIconButton>\n <Typography variant=\"label\"> Loading</Typography>\n </div>\n </div>\n );\n};\n\nexport default Component;\n"]}

package/lib/cjs/selectable-tag/stories/selectable-tag-disabled.story.js CHANGED Viewed

@@ -24,7 +24,7 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 require("@neo4j-ndl/base/lib/neo4j-ds-styles.css");
 const react_1 = require("@neo4j-ndl/react");
 const Component = () => {
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-gap-token-8 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.SelectableTag, { isSelected: false, isDisabled: true, onClick: () => null, children: "Disabled unselected tag" }), (0, jsx_runtime_1.jsx)(react_1.SelectableTag, { isSelected: true, isDisabled: true, onClick: () => null, children: "Disabled selected tag" })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex gap-token-8 items-center", children: [(0, jsx_runtime_1.jsx)(react_1.SelectableTag, { isSelected: false, isDisabled: true, onClick: () => null, children: "Disabled unselected tag" }), (0, jsx_runtime_1.jsx)(react_1.SelectableTag, { isSelected: true, isDisabled: true, onClick: () => null, children: "Disabled selected tag" })] }));
 };
 exports.default = Component;
 //# sourceMappingURL=selectable-tag-disabled.story.js.map

package/lib/cjs/selectable-tag/stories/selectable-tag-disabled.story.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"selectable-tag-disabled.story.js","sourceRoot":"","sources":["../../../../src/selectable-tag/stories/selectable-tag-disabled.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAiD;AAEjD,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,iCAAK,SAAS,EAAC,~~qCAAqC~~,~~aAClD,~~uBAAC,qBAAa,IAAC,UAAU,EAAE,KAAK,EAAE,UAAU,QAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,wCAEhD,EAChB,uBAAC,qBAAa,IAAC,UAAU,EAAE,IAAI,EAAE,UAAU,QAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,sCAE/C,IACZ,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { SelectableTag } from '@neo4j-ndl/react';\n\nconst Component = () => {\n return (\n <div className=\"n-flex n-gap-token-8 n-items-center\">\n <SelectableTag isSelected={false} isDisabled onClick={() => null}>\n Disabled unselected tag\n </SelectableTag>\n <SelectableTag isSelected={true} isDisabled onClick={() => null}>\n Disabled selected tag\n </SelectableTag>\n </div>\n );\n};\n\nexport default Component;\n"]}
1	+ {"version":3,"file":"selectable-tag-disabled.story.js","sourceRoot":"","sources":["../../../../src/selectable-tag/stories/selectable-tag-disabled.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAiD;AAEjD,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,iCAAK,SAAS,EAAC,+BAA+B,aAC5C,uBAAC,qBAAa,IAAC,UAAU,EAAE,KAAK,EAAE,UAAU,QAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,wCAEhD,EAChB,uBAAC,qBAAa,IAAC,UAAU,EAAE,IAAI,EAAE,UAAU,QAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,sCAE/C,IACZ,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { SelectableTag } from '@neo4j-ndl/react';\n\nconst Component = () => {\n return (\n <div className=\"flex gap-token-8 items-center\">\n <SelectableTag isSelected={false} isDisabled onClick={() => null}>\n Disabled unselected tag\n </SelectableTag>\n <SelectableTag isSelected={true} isDisabled onClick={() => null}>\n Disabled selected tag\n </SelectableTag>\n </div>\n );\n};\n\nexport default Component;\n"]}

package/lib/cjs/selectable-tag/stories/selectable-tag-sizes.story.js CHANGED Viewed

@@ -27,7 +27,7 @@ const react_2 = require("react");
 const Component = () => {
     var _a, _b, _c, _d;
     const [selected, setSelected] = (0, react_2.useState)({});
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-8", children: [(0, jsx_runtime_1.jsx)(react_1.SelectableTag, { size: "x-small", isSelected: (_a = selected['x-small']) !== null && _a !== void 0 ? _a : false, onClick: () => setSelected((prev) => (Object.assign(Object.assign({}, prev), { ['x-small']: !prev['x-small'] }))), children: "X-Small" }), (0, jsx_runtime_1.jsx)(react_1.SelectableTag, { size: "small", isSelected: (_b = selected['small']) !== null && _b !== void 0 ? _b : false, onClick: () => setSelected((prev) => (Object.assign(Object.assign({}, prev), { ['small']: !prev['small'] }))), children: "Small" }), (0, jsx_runtime_1.jsx)(react_1.SelectableTag, { size: "medium", isSelected: (_c = selected['medium']) !== null && _c !== void 0 ? _c : false, onClick: () => setSelected((prev) => (Object.assign(Object.assign({}, prev), { ['medium']: !prev['medium'] }))), children: "Medium" }), (0, jsx_runtime_1.jsx)(react_1.SelectableTag, { size: "large", isSelected: (_d = selected['large']) !== null && _d !== void 0 ? _d : false, onClick: () => setSelected((prev) => (Object.assign(Object.assign({}, prev), { ['large']: !prev['large'] }))), children: "Large" })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-row gap-token-8", children: [(0, jsx_runtime_1.jsx)(react_1.SelectableTag, { size: "x-small", isSelected: (_a = selected['x-small']) !== null && _a !== void 0 ? _a : false, onClick: () => setSelected((prev) => (Object.assign(Object.assign({}, prev), { ['x-small']: !prev['x-small'] }))), children: "X-Small" }), (0, jsx_runtime_1.jsx)(react_1.SelectableTag, { size: "small", isSelected: (_b = selected['small']) !== null && _b !== void 0 ? _b : false, onClick: () => setSelected((prev) => (Object.assign(Object.assign({}, prev), { ['small']: !prev['small'] }))), children: "Small" }), (0, jsx_runtime_1.jsx)(react_1.SelectableTag, { size: "medium", isSelected: (_c = selected['medium']) !== null && _c !== void 0 ? _c : false, onClick: () => setSelected((prev) => (Object.assign(Object.assign({}, prev), { ['medium']: !prev['medium'] }))), children: "Medium" }), (0, jsx_runtime_1.jsx)(react_1.SelectableTag, { size: "large", isSelected: (_d = selected['large']) !== null && _d !== void 0 ? _d : false, onClick: () => setSelected((prev) => (Object.assign(Object.assign({}, prev), { ['large']: !prev['large'] }))), children: "Large" })] }));
 };
 exports.default = Component;
 //# sourceMappingURL=selectable-tag-sizes.story.js.map

package/lib/cjs/selectable-tag/stories/selectable-tag-sizes.story.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"selectable-tag-sizes.story.js","sourceRoot":"","sources":["../../../../src/selectable-tag/stories/selectable-tag-sizes.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAiD;AACjD,iCAAiC;AAEjC,MAAM,SAAS,GAAG,GAAG,EAAE;;IACrB,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,IAAA,gBAAQ,EAA0B,EAAE,CAAC,CAAC;IAEtE,OAAO,CACL,iCAAK,SAAS,EAAC,~~iCAAiC~~,~~aAC9C~~,uBAAC,qBAAa,IACZ,IAAI,EAAC,SAAS,EACd,UAAU,EAAE,MAAA,QAAQ,CAAC,SAAS,CAAC,mCAAI,KAAK,EACxC,OAAO,EAAE,GAAG,EAAE,CACZ,WAAW,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,iCAAM,IAAI,KAAE,CAAC,SAAS,CAAC,EAAE,CAAC,IAAI,CAAC,SAAS,CAAC,IAAG,CAAC,wBAIvD,EAChB,uBAAC,qBAAa,IACZ,IAAI,EAAC,OAAO,EACZ,UAAU,EAAE,MAAA,QAAQ,CAAC,OAAO,CAAC,mCAAI,KAAK,EACtC,OAAO,EAAE,GAAG,EAAE,CACZ,WAAW,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,iCAAM,IAAI,KAAE,CAAC,OAAO,CAAC,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,IAAG,CAAC,sBAInD,EAChB,uBAAC,qBAAa,IACZ,IAAI,EAAC,QAAQ,EACb,UAAU,EAAE,MAAA,QAAQ,CAAC,QAAQ,CAAC,mCAAI,KAAK,EACvC,OAAO,EAAE,GAAG,EAAE,CACZ,WAAW,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,iCAAM,IAAI,KAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAG,CAAC,uBAIrD,EAChB,uBAAC,qBAAa,IACZ,IAAI,EAAC,OAAO,EACZ,UAAU,EAAE,MAAA,QAAQ,CAAC,OAAO,CAAC,mCAAI,KAAK,EACtC,OAAO,EAAE,GAAG,EAAE,CACZ,WAAW,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,iCAAM,IAAI,KAAE,CAAC,OAAO,CAAC,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,IAAG,CAAC,sBAInD,IACZ,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { SelectableTag } from '@neo4j-ndl/react';\nimport { useState } from 'react';\n\nconst Component = () => {\n const [selected, setSelected] = useState<Record<string, boolean>>({});\n\n return (\n <div className=\"n-flex n-flex-row n-gap-token-8\">\n <SelectableTag\n size=\"x-small\"\n isSelected={selected['x-small'] ?? false}\n onClick={() =>\n setSelected((prev) => ({ ...prev, ['x-small']: !prev['x-small'] }))\n }\n >\n X-Small\n </SelectableTag>\n <SelectableTag\n size=\"small\"\n isSelected={selected['small'] ?? false}\n onClick={() =>\n setSelected((prev) => ({ ...prev, ['small']: !prev['small'] }))\n }\n >\n Small\n </SelectableTag>\n <SelectableTag\n size=\"medium\"\n isSelected={selected['medium'] ?? false}\n onClick={() =>\n setSelected((prev) => ({ ...prev, ['medium']: !prev['medium'] }))\n }\n >\n Medium\n </SelectableTag>\n <SelectableTag\n size=\"large\"\n isSelected={selected['large'] ?? false}\n onClick={() =>\n setSelected((prev) => ({ ...prev, ['large']: !prev['large'] }))\n }\n >\n Large\n </SelectableTag>\n </div>\n );\n};\n\nexport default Component;\n"]}
1	+ {"version":3,"file":"selectable-tag-sizes.story.js","sourceRoot":"","sources":["../../../../src/selectable-tag/stories/selectable-tag-sizes.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAiD;AACjD,iCAAiC;AAEjC,MAAM,SAAS,GAAG,GAAG,EAAE;;IACrB,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,IAAA,gBAAQ,EAA0B,EAAE,CAAC,CAAC;IAEtE,OAAO,CACL,iCAAK,SAAS,EAAC,2BAA2B,aACxC,uBAAC,qBAAa,IACZ,IAAI,EAAC,SAAS,EACd,UAAU,EAAE,MAAA,QAAQ,CAAC,SAAS,CAAC,mCAAI,KAAK,EACxC,OAAO,EAAE,GAAG,EAAE,CACZ,WAAW,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,iCAAM,IAAI,KAAE,CAAC,SAAS,CAAC,EAAE,CAAC,IAAI,CAAC,SAAS,CAAC,IAAG,CAAC,wBAIvD,EAChB,uBAAC,qBAAa,IACZ,IAAI,EAAC,OAAO,EACZ,UAAU,EAAE,MAAA,QAAQ,CAAC,OAAO,CAAC,mCAAI,KAAK,EACtC,OAAO,EAAE,GAAG,EAAE,CACZ,WAAW,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,iCAAM,IAAI,KAAE,CAAC,OAAO,CAAC,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,IAAG,CAAC,sBAInD,EAChB,uBAAC,qBAAa,IACZ,IAAI,EAAC,QAAQ,EACb,UAAU,EAAE,MAAA,QAAQ,CAAC,QAAQ,CAAC,mCAAI,KAAK,EACvC,OAAO,EAAE,GAAG,EAAE,CACZ,WAAW,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,iCAAM,IAAI,KAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAG,CAAC,uBAIrD,EAChB,uBAAC,qBAAa,IACZ,IAAI,EAAC,OAAO,EACZ,UAAU,EAAE,MAAA,QAAQ,CAAC,OAAO,CAAC,mCAAI,KAAK,EACtC,OAAO,EAAE,GAAG,EAAE,CACZ,WAAW,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,iCAAM,IAAI,KAAE,CAAC,OAAO,CAAC,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,IAAG,CAAC,sBAInD,IACZ,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/!\n \n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n \n This file is part of Neo4j.\n \n Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n \n This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n \n You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { SelectableTag } from '@neo4j-ndl/react';\nimport { useState } from 'react';\n\nconst Component = () => {\n const [selected, setSelected] = useState<Record<string, boolean>>({});\n\n return (\n <div className=\"flex flex-row gap-token-8\">\n <SelectableTag\n size=\"x-small\"\n isSelected={selected['x-small'] ?? false}\n onClick={() =>\n setSelected((prev) => ({ ...prev, ['x-small']: !prev['x-small'] }))\n }\n >\n X-Small\n </SelectableTag>\n <SelectableTag\n size=\"small\"\n isSelected={selected['small'] ?? false}\n onClick={() =>\n setSelected((prev) => ({ ...prev, ['small']: !prev['small'] }))\n }\n >\n Small\n </SelectableTag>\n <SelectableTag\n size=\"medium\"\n isSelected={selected['medium'] ?? false}\n onClick={() =>\n setSelected((prev) => ({ ...prev, ['medium']: !prev['medium'] }))\n }\n >\n Medium\n </SelectableTag>\n <SelectableTag\n size=\"large\"\n isSelected={selected['large'] ?? false}\n onClick={() =>\n setSelected((prev) => ({ ...prev, ['large']: !prev['large'] }))\n }\n >\n Large\n </SelectableTag>\n </div>\n );\n};\n\nexport default Component;\n"]}