@neo4j-ndl/react 4.14.3 → 4.14.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/lib/cjs/select/Select.js
CHANGED
|
@@ -159,7 +159,7 @@ const Select = (_a) => {
|
|
|
159
159
|
'ndl-multi': selectProps.isMulti,
|
|
160
160
|
'ndl-small': size === 'small',
|
|
161
161
|
});
|
|
162
|
-
return ((0, jsx_runtime_1.jsxs)(Component, Object.assign({ ref: ref, className: classes, style: style }, restProps, htmlAttributes, { children: [Boolean(label) && (0, jsx_runtime_1.jsx)("label", { htmlFor: identifier, children: label }), SelectElement, Boolean(helpText) && Boolean(errorText) === false && ((0, jsx_runtime_1.jsx)(typography_1.Typography, { variant: size === 'large' ? 'body-medium' : 'body-small', className: "ndl-sub-text", htmlAttributes: { id: helpTextId }, children: helpText })), Boolean(errorText) && ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-4 n-items-center", children: [(0, jsx_runtime_1.jsx)(icons_1.ExclamationCircleIconSolid, { className:
|
|
162
|
+
return ((0, jsx_runtime_1.jsxs)(Component, Object.assign({ ref: ref, className: classes, style: style }, restProps, htmlAttributes, { children: [Boolean(label) && (0, jsx_runtime_1.jsx)("label", { htmlFor: identifier, children: label }), SelectElement, Boolean(helpText) && Boolean(errorText) === false && ((0, jsx_runtime_1.jsx)(typography_1.Typography, { variant: size === 'large' ? 'body-medium' : 'body-small', className: "ndl-sub-text", htmlAttributes: { id: helpTextId }, children: helpText })), Boolean(errorText) && ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-4 n-items-center", children: [(0, jsx_runtime_1.jsx)(icons_1.ExclamationCircleIconSolid, { className: "ndl-error-icon", htmlAttributes: { role: 'img', type: 'solid' } }), (0, jsx_runtime_1.jsx)("span", { id: errorTextId, className: "ndl-sub-text ndl-error-text", children: errorText })] }))] })));
|
|
163
163
|
};
|
|
164
164
|
exports.Select = Select;
|
|
165
165
|
//# sourceMappingURL=Select.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select.js","sourceRoot":"","sources":["../../../src/select/Select.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport classNames from 'classnames';\nimport type React from 'react';\nimport { useEffect, useId, useMemo, useState } from 'react';\nimport ReactSelect, { type GroupBase } from 'react-select';\nimport AsyncSelect from 'react-select/async';\n/** Different types of select components */\nimport Creatable from 'react-select/creatable';\n\nimport { type PolymorphicCommonProps } from '../_common/types';\nimport { needleWarningMessage } from '../_common/utils';\nimport { useIsInsideDialog } from '../dialog/dialog-context';\nimport { ExclamationCircleIconSolid } from '../icons';\nimport { Typography } from '../typography';\nimport {\n CustomClearIndication,\n CustomControl,\n CustomIndicatorsContainer,\n CustomInput,\n CustomMenu,\n CustomMenuList,\n CustomMenuPortal,\n CustomMultiValue,\n CustomOption,\n CustomPlaceholder,\n CustomSingleValue,\n CustomValueContainer,\n DropdownIndicatorCurrying,\n} from './Overrides';\nimport { type SelectOverrideCustomProps, type SelectProps } from './types';\n\n/**\n *\n *\n * Helpers\n *\n *\n */\n\nconst overrideComponents = <\n OptionType,\n IsMulti extends boolean = false,\n GroupType extends GroupBase<OptionType> = GroupBase<OptionType>,\n>(\n props: SelectOverrideCustomProps<OptionType, IsMulti, GroupType>,\n) =>\n ({\n ClearIndicator: CustomClearIndication(props),\n Control: CustomControl(props),\n DropdownIndicator: DropdownIndicatorCurrying(props),\n IndicatorSeparator: null,\n IndicatorsContainer: CustomIndicatorsContainer(props),\n Input: CustomInput(props),\n Menu: CustomMenu(props),\n MenuList: CustomMenuList(props),\n MenuPortal: CustomMenuPortal(props),\n MultiValue: CustomMultiValue(props),\n Option: CustomOption(props),\n Placeholder: CustomPlaceholder(props),\n SingleValue: CustomSingleValue(props),\n ValueContainer: CustomValueContainer(props),\n }) as SelectProps<\n OptionType,\n IsMulti,\n GroupType\n >['selectProps']['components'];\n\nconst customStyles = <\n OptionType,\n IsMulti extends boolean = false,\n GroupType extends GroupBase<OptionType> = GroupBase<OptionType>,\n>() => {\n return {\n clearIndicator: () => ({}),\n control: () => ({}),\n dropdownIndicator: () => ({}),\n indicatorsContainer: () => ({}),\n input: () => ({}),\n menu: (provided) => ({\n bottom: provided.bottom,\n top: provided.top,\n }),\n menuList: (provided) => ({\n maxHeight: provided.maxHeight,\n minHeight: provided.minHeight,\n }),\n option: () => ({}),\n placeholder: () => ({}),\n singleValue: () => ({}),\n valueContainer: (provided) => ({\n ...provided,\n padding: '0',\n }),\n } as SelectProps<OptionType, IsMulti, GroupType>['selectProps']['styles'];\n};\n\nexport const Select = <\n OptionType,\n IsMulti extends boolean = false,\n GroupType extends GroupBase<OptionType> = GroupBase<OptionType>,\n T extends React.ElementType = 'div',\n>({\n as,\n label,\n helpText,\n errorText,\n isFluid = true,\n size = 'medium',\n type = 'select',\n ariaLabel,\n selectProps = {},\n isClean = false,\n isDisabled,\n htmlAttributes,\n className,\n style,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, SelectProps<OptionType, IsMulti, GroupType>>) => {\n const isInsideDialog = useIsInsideDialog();\n const menuPosition = isInsideDialog ? 'fixed' : 'absolute';\n const identifier = useId();\n const helpTextId = useId();\n const errorTextId = useId();\n const [isMenuOpen, setIsMenuOpen] = useState(false);\n\n const handleMenuOpen = () => {\n setIsMenuOpen(true);\n if (selectProps.onMenuOpen) {\n selectProps.onMenuOpen();\n }\n };\n\n const handleMenuClose = () => {\n setIsMenuOpen(false);\n if (selectProps.onMenuClose) {\n selectProps.onMenuClose();\n }\n };\n\n // Handle Escape and Enter key to prevent it from bubbling up to dialog\n const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (\n (event.key === 'Escape' && isMenuOpen) ||\n (event.key === 'Enter' && isMenuOpen)\n ) {\n event.stopPropagation();\n }\n\n if (selectProps.onKeyDown) {\n selectProps.onKeyDown(event);\n }\n };\n\n const Component: React.ElementType = as ?? 'div';\n\n const ComponentOverrides = useMemo(\n () =>\n overrideComponents<OptionType, IsMulti, GroupType>({\n errorText,\n errorTextId,\n helpText,\n helpTextId,\n isClean,\n size,\n }),\n [errorText, errorTextId, helpText, helpTextId, size, isClean],\n );\n\n const StyleOverrides = useMemo(\n () => customStyles<OptionType, IsMulti, GroupType>(),\n [],\n );\n\n useEffect(() => {\n if (label === undefined && ariaLabel === undefined) {\n needleWarningMessage(\n 'A Select needs to have a label or an aria label to be accessible. link: https://dequeuniversity.com/rules/axe/4.2/label?application=axeAPI',\n );\n }\n }, [label, ariaLabel]);\n\n let SelectElement: React.JSX.Element;\n switch (type) {\n case 'async': {\n SelectElement = (\n <AsyncSelect\n name={identifier}\n inputId={identifier}\n isDisabled={Boolean(isDisabled) || selectProps.isDisabled}\n menuPlacement=\"auto\"\n aria-label={ariaLabel}\n aria-invalid={Boolean(errorText)}\n {...selectProps}\n onKeyDown={handleKeyDown}\n onMenuOpen={handleMenuOpen}\n onMenuClose={handleMenuClose}\n menuPosition={selectProps.menuPosition ?? menuPosition}\n hideSelectedOptions={false}\n closeMenuOnSelect={Boolean(selectProps.isMulti) === false}\n styles={{ ...StyleOverrides, ...selectProps.styles }}\n components={{ ...ComponentOverrides, ...selectProps.components }}\n />\n );\n break;\n }\n case 'creatable':\n SelectElement = (\n <Creatable\n name={identifier}\n inputId={identifier}\n isDisabled={Boolean(isDisabled) || selectProps.isDisabled}\n menuPlacement=\"auto\"\n {...selectProps}\n aria-label={ariaLabel}\n aria-invalid={Boolean(errorText)}\n onKeyDown={handleKeyDown}\n onMenuOpen={handleMenuOpen}\n onMenuClose={handleMenuClose}\n menuPosition={selectProps.menuPosition ?? menuPosition}\n hideSelectedOptions={false}\n closeMenuOnSelect={Boolean(selectProps.isMulti) === false}\n styles={{ ...StyleOverrides, ...selectProps.styles }}\n components={{ ...ComponentOverrides, ...selectProps.components }}\n />\n );\n break;\n default:\n SelectElement = (\n <ReactSelect\n name={identifier}\n inputId={identifier}\n isDisabled={Boolean(isDisabled) || selectProps.isDisabled}\n menuPlacement=\"auto\"\n {...selectProps}\n aria-label={ariaLabel}\n aria-invalid={Boolean(errorText)}\n onKeyDown={handleKeyDown}\n onMenuOpen={handleMenuOpen}\n onMenuClose={handleMenuClose}\n menuPosition={selectProps.menuPosition ?? menuPosition}\n hideSelectedOptions={false}\n closeMenuOnSelect={Boolean(selectProps.isMulti) === false}\n styles={{ ...StyleOverrides, ...selectProps.styles }}\n components={{ ...ComponentOverrides, ...selectProps.components }}\n />\n );\n }\n\n const classes = classNames('ndl-select', className, {\n 'ndl-creatable': type === 'creatable',\n 'ndl-disabled': selectProps.isDisabled,\n 'ndl-fluid': isFluid,\n 'ndl-has-error': Boolean(errorText),\n 'ndl-large': size === 'large',\n 'ndl-medium': size === 'medium',\n 'ndl-multi': selectProps.isMulti,\n 'ndl-small': size === 'small',\n });\n\n return (\n <Component\n ref={ref}\n className={classes}\n style={style}\n {...restProps}\n {...htmlAttributes}\n >\n {Boolean(label) && <label htmlFor={identifier}>{label}</label>}\n {SelectElement}\n {Boolean(helpText) && Boolean(errorText) === false && (\n <Typography\n variant={size === 'large' ? 'body-medium' : 'body-small'}\n className=\"ndl-sub-text\"\n htmlAttributes={{ id: helpTextId }}\n >\n {helpText}\n </Typography>\n )}\n {Boolean(errorText) && (\n <div className=\"n-flex n-flex-row n-gap-token-4 n-items-center\">\n <ExclamationCircleIconSolid\n className={classNames('ndl-error-icon', classes)}\n htmlAttributes={{ role: 'img', type: 'solid' }}\n />\n <span id={errorTextId} className=\"ndl-sub-text ndl-error-text\">\n {errorText}\n </span>\n </div>\n )}\n </Component>\n );\n};\n"]}
|
|
1
|
+
{"version":3,"file":"Select.js","sourceRoot":"","sources":["../../../src/select/Select.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport classNames from 'classnames';\nimport type React from 'react';\nimport { useEffect, useId, useMemo, useState } from 'react';\nimport ReactSelect, { type GroupBase } from 'react-select';\nimport AsyncSelect from 'react-select/async';\n/** Different types of select components */\nimport Creatable from 'react-select/creatable';\n\nimport { type PolymorphicCommonProps } from '../_common/types';\nimport { needleWarningMessage } from '../_common/utils';\nimport { useIsInsideDialog } from '../dialog/dialog-context';\nimport { ExclamationCircleIconSolid } from '../icons';\nimport { Typography } from '../typography';\nimport {\n CustomClearIndication,\n CustomControl,\n CustomIndicatorsContainer,\n CustomInput,\n CustomMenu,\n CustomMenuList,\n CustomMenuPortal,\n CustomMultiValue,\n CustomOption,\n CustomPlaceholder,\n CustomSingleValue,\n CustomValueContainer,\n DropdownIndicatorCurrying,\n} from './Overrides';\nimport { type SelectOverrideCustomProps, type SelectProps } from './types';\n\n/**\n *\n *\n * Helpers\n *\n *\n */\n\nconst overrideComponents = <\n OptionType,\n IsMulti extends boolean = false,\n GroupType extends GroupBase<OptionType> = GroupBase<OptionType>,\n>(\n props: SelectOverrideCustomProps<OptionType, IsMulti, GroupType>,\n) =>\n ({\n ClearIndicator: CustomClearIndication(props),\n Control: CustomControl(props),\n DropdownIndicator: DropdownIndicatorCurrying(props),\n IndicatorSeparator: null,\n IndicatorsContainer: CustomIndicatorsContainer(props),\n Input: CustomInput(props),\n Menu: CustomMenu(props),\n MenuList: CustomMenuList(props),\n MenuPortal: CustomMenuPortal(props),\n MultiValue: CustomMultiValue(props),\n Option: CustomOption(props),\n Placeholder: CustomPlaceholder(props),\n SingleValue: CustomSingleValue(props),\n ValueContainer: CustomValueContainer(props),\n }) as SelectProps<\n OptionType,\n IsMulti,\n GroupType\n >['selectProps']['components'];\n\nconst customStyles = <\n OptionType,\n IsMulti extends boolean = false,\n GroupType extends GroupBase<OptionType> = GroupBase<OptionType>,\n>() => {\n return {\n clearIndicator: () => ({}),\n control: () => ({}),\n dropdownIndicator: () => ({}),\n indicatorsContainer: () => ({}),\n input: () => ({}),\n menu: (provided) => ({\n bottom: provided.bottom,\n top: provided.top,\n }),\n menuList: (provided) => ({\n maxHeight: provided.maxHeight,\n minHeight: provided.minHeight,\n }),\n option: () => ({}),\n placeholder: () => ({}),\n singleValue: () => ({}),\n valueContainer: (provided) => ({\n ...provided,\n padding: '0',\n }),\n } as SelectProps<OptionType, IsMulti, GroupType>['selectProps']['styles'];\n};\n\nexport const Select = <\n OptionType,\n IsMulti extends boolean = false,\n GroupType extends GroupBase<OptionType> = GroupBase<OptionType>,\n T extends React.ElementType = 'div',\n>({\n as,\n label,\n helpText,\n errorText,\n isFluid = true,\n size = 'medium',\n type = 'select',\n ariaLabel,\n selectProps = {},\n isClean = false,\n isDisabled,\n htmlAttributes,\n className,\n style,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, SelectProps<OptionType, IsMulti, GroupType>>) => {\n const isInsideDialog = useIsInsideDialog();\n const menuPosition = isInsideDialog ? 'fixed' : 'absolute';\n const identifier = useId();\n const helpTextId = useId();\n const errorTextId = useId();\n const [isMenuOpen, setIsMenuOpen] = useState(false);\n\n const handleMenuOpen = () => {\n setIsMenuOpen(true);\n if (selectProps.onMenuOpen) {\n selectProps.onMenuOpen();\n }\n };\n\n const handleMenuClose = () => {\n setIsMenuOpen(false);\n if (selectProps.onMenuClose) {\n selectProps.onMenuClose();\n }\n };\n\n // Handle Escape and Enter key to prevent it from bubbling up to dialog\n const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (\n (event.key === 'Escape' && isMenuOpen) ||\n (event.key === 'Enter' && isMenuOpen)\n ) {\n event.stopPropagation();\n }\n\n if (selectProps.onKeyDown) {\n selectProps.onKeyDown(event);\n }\n };\n\n const Component: React.ElementType = as ?? 'div';\n\n const ComponentOverrides = useMemo(\n () =>\n overrideComponents<OptionType, IsMulti, GroupType>({\n errorText,\n errorTextId,\n helpText,\n helpTextId,\n isClean,\n size,\n }),\n [errorText, errorTextId, helpText, helpTextId, size, isClean],\n );\n\n const StyleOverrides = useMemo(\n () => customStyles<OptionType, IsMulti, GroupType>(),\n [],\n );\n\n useEffect(() => {\n if (label === undefined && ariaLabel === undefined) {\n needleWarningMessage(\n 'A Select needs to have a label or an aria label to be accessible. link: https://dequeuniversity.com/rules/axe/4.2/label?application=axeAPI',\n );\n }\n }, [label, ariaLabel]);\n\n let SelectElement: React.JSX.Element;\n switch (type) {\n case 'async': {\n SelectElement = (\n <AsyncSelect\n name={identifier}\n inputId={identifier}\n isDisabled={Boolean(isDisabled) || selectProps.isDisabled}\n menuPlacement=\"auto\"\n aria-label={ariaLabel}\n aria-invalid={Boolean(errorText)}\n {...selectProps}\n onKeyDown={handleKeyDown}\n onMenuOpen={handleMenuOpen}\n onMenuClose={handleMenuClose}\n menuPosition={selectProps.menuPosition ?? menuPosition}\n hideSelectedOptions={false}\n closeMenuOnSelect={Boolean(selectProps.isMulti) === false}\n styles={{ ...StyleOverrides, ...selectProps.styles }}\n components={{ ...ComponentOverrides, ...selectProps.components }}\n />\n );\n break;\n }\n case 'creatable':\n SelectElement = (\n <Creatable\n name={identifier}\n inputId={identifier}\n isDisabled={Boolean(isDisabled) || selectProps.isDisabled}\n menuPlacement=\"auto\"\n {...selectProps}\n aria-label={ariaLabel}\n aria-invalid={Boolean(errorText)}\n onKeyDown={handleKeyDown}\n onMenuOpen={handleMenuOpen}\n onMenuClose={handleMenuClose}\n menuPosition={selectProps.menuPosition ?? menuPosition}\n hideSelectedOptions={false}\n closeMenuOnSelect={Boolean(selectProps.isMulti) === false}\n styles={{ ...StyleOverrides, ...selectProps.styles }}\n components={{ ...ComponentOverrides, ...selectProps.components }}\n />\n );\n break;\n default:\n SelectElement = (\n <ReactSelect\n name={identifier}\n inputId={identifier}\n isDisabled={Boolean(isDisabled) || selectProps.isDisabled}\n menuPlacement=\"auto\"\n {...selectProps}\n aria-label={ariaLabel}\n aria-invalid={Boolean(errorText)}\n onKeyDown={handleKeyDown}\n onMenuOpen={handleMenuOpen}\n onMenuClose={handleMenuClose}\n menuPosition={selectProps.menuPosition ?? menuPosition}\n hideSelectedOptions={false}\n closeMenuOnSelect={Boolean(selectProps.isMulti) === false}\n styles={{ ...StyleOverrides, ...selectProps.styles }}\n components={{ ...ComponentOverrides, ...selectProps.components }}\n />\n );\n }\n\n const classes = classNames('ndl-select', className, {\n 'ndl-creatable': type === 'creatable',\n 'ndl-disabled': selectProps.isDisabled,\n 'ndl-fluid': isFluid,\n 'ndl-has-error': Boolean(errorText),\n 'ndl-large': size === 'large',\n 'ndl-medium': size === 'medium',\n 'ndl-multi': selectProps.isMulti,\n 'ndl-small': size === 'small',\n });\n\n return (\n <Component\n ref={ref}\n className={classes}\n style={style}\n {...restProps}\n {...htmlAttributes}\n >\n {Boolean(label) && <label htmlFor={identifier}>{label}</label>}\n {SelectElement}\n {Boolean(helpText) && Boolean(errorText) === false && (\n <Typography\n variant={size === 'large' ? 'body-medium' : 'body-small'}\n className=\"ndl-sub-text\"\n htmlAttributes={{ id: helpTextId }}\n >\n {helpText}\n </Typography>\n )}\n {Boolean(errorText) && (\n <div className=\"n-flex n-flex-row n-gap-token-4 n-items-center\">\n <ExclamationCircleIconSolid\n className=\"ndl-error-icon\"\n htmlAttributes={{ role: 'img', type: 'solid' }}\n />\n <span id={errorTextId} className=\"ndl-sub-text ndl-error-text\">\n {errorText}\n </span>\n </div>\n )}\n </Component>\n );\n};\n"]}
|
package/lib/esm/select/Select.js
CHANGED
|
@@ -153,6 +153,6 @@ export const Select = (_a) => {
|
|
|
153
153
|
'ndl-multi': selectProps.isMulti,
|
|
154
154
|
'ndl-small': size === 'small',
|
|
155
155
|
});
|
|
156
|
-
return (_jsxs(Component, Object.assign({ ref: ref, className: classes, style: style }, restProps, htmlAttributes, { children: [Boolean(label) && _jsx("label", { htmlFor: identifier, children: label }), SelectElement, Boolean(helpText) && Boolean(errorText) === false && (_jsx(Typography, { variant: size === 'large' ? 'body-medium' : 'body-small', className: "ndl-sub-text", htmlAttributes: { id: helpTextId }, children: helpText })), Boolean(errorText) && (_jsxs("div", { className: "n-flex n-flex-row n-gap-token-4 n-items-center", children: [_jsx(ExclamationCircleIconSolid, { className:
|
|
156
|
+
return (_jsxs(Component, Object.assign({ ref: ref, className: classes, style: style }, restProps, htmlAttributes, { children: [Boolean(label) && _jsx("label", { htmlFor: identifier, children: label }), SelectElement, Boolean(helpText) && Boolean(errorText) === false && (_jsx(Typography, { variant: size === 'large' ? 'body-medium' : 'body-small', className: "ndl-sub-text", htmlAttributes: { id: helpTextId }, children: helpText })), Boolean(errorText) && (_jsxs("div", { className: "n-flex n-flex-row n-gap-token-4 n-items-center", children: [_jsx(ExclamationCircleIconSolid, { className: "ndl-error-icon", htmlAttributes: { role: 'img', type: 'solid' } }), _jsx("span", { id: errorTextId, className: "ndl-sub-text ndl-error-text", children: errorText })] }))] })));
|
|
157
157
|
};
|
|
158
158
|
//# sourceMappingURL=Select.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select.js","sourceRoot":"","sources":["../../../src/select/Select.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport classNames from 'classnames';\nimport type React from 'react';\nimport { useEffect, useId, useMemo, useState } from 'react';\nimport ReactSelect, { type GroupBase } from 'react-select';\nimport AsyncSelect from 'react-select/async';\n/** Different types of select components */\nimport Creatable from 'react-select/creatable';\n\nimport { type PolymorphicCommonProps } from '../_common/types';\nimport { needleWarningMessage } from '../_common/utils';\nimport { useIsInsideDialog } from '../dialog/dialog-context';\nimport { ExclamationCircleIconSolid } from '../icons';\nimport { Typography } from '../typography';\nimport {\n CustomClearIndication,\n CustomControl,\n CustomIndicatorsContainer,\n CustomInput,\n CustomMenu,\n CustomMenuList,\n CustomMenuPortal,\n CustomMultiValue,\n CustomOption,\n CustomPlaceholder,\n CustomSingleValue,\n CustomValueContainer,\n DropdownIndicatorCurrying,\n} from './Overrides';\nimport { type SelectOverrideCustomProps, type SelectProps } from './types';\n\n/**\n *\n *\n * Helpers\n *\n *\n */\n\nconst overrideComponents = <\n OptionType,\n IsMulti extends boolean = false,\n GroupType extends GroupBase<OptionType> = GroupBase<OptionType>,\n>(\n props: SelectOverrideCustomProps<OptionType, IsMulti, GroupType>,\n) =>\n ({\n ClearIndicator: CustomClearIndication(props),\n Control: CustomControl(props),\n DropdownIndicator: DropdownIndicatorCurrying(props),\n IndicatorSeparator: null,\n IndicatorsContainer: CustomIndicatorsContainer(props),\n Input: CustomInput(props),\n Menu: CustomMenu(props),\n MenuList: CustomMenuList(props),\n MenuPortal: CustomMenuPortal(props),\n MultiValue: CustomMultiValue(props),\n Option: CustomOption(props),\n Placeholder: CustomPlaceholder(props),\n SingleValue: CustomSingleValue(props),\n ValueContainer: CustomValueContainer(props),\n }) as SelectProps<\n OptionType,\n IsMulti,\n GroupType\n >['selectProps']['components'];\n\nconst customStyles = <\n OptionType,\n IsMulti extends boolean = false,\n GroupType extends GroupBase<OptionType> = GroupBase<OptionType>,\n>() => {\n return {\n clearIndicator: () => ({}),\n control: () => ({}),\n dropdownIndicator: () => ({}),\n indicatorsContainer: () => ({}),\n input: () => ({}),\n menu: (provided) => ({\n bottom: provided.bottom,\n top: provided.top,\n }),\n menuList: (provided) => ({\n maxHeight: provided.maxHeight,\n minHeight: provided.minHeight,\n }),\n option: () => ({}),\n placeholder: () => ({}),\n singleValue: () => ({}),\n valueContainer: (provided) => ({\n ...provided,\n padding: '0',\n }),\n } as SelectProps<OptionType, IsMulti, GroupType>['selectProps']['styles'];\n};\n\nexport const Select = <\n OptionType,\n IsMulti extends boolean = false,\n GroupType extends GroupBase<OptionType> = GroupBase<OptionType>,\n T extends React.ElementType = 'div',\n>({\n as,\n label,\n helpText,\n errorText,\n isFluid = true,\n size = 'medium',\n type = 'select',\n ariaLabel,\n selectProps = {},\n isClean = false,\n isDisabled,\n htmlAttributes,\n className,\n style,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, SelectProps<OptionType, IsMulti, GroupType>>) => {\n const isInsideDialog = useIsInsideDialog();\n const menuPosition = isInsideDialog ? 'fixed' : 'absolute';\n const identifier = useId();\n const helpTextId = useId();\n const errorTextId = useId();\n const [isMenuOpen, setIsMenuOpen] = useState(false);\n\n const handleMenuOpen = () => {\n setIsMenuOpen(true);\n if (selectProps.onMenuOpen) {\n selectProps.onMenuOpen();\n }\n };\n\n const handleMenuClose = () => {\n setIsMenuOpen(false);\n if (selectProps.onMenuClose) {\n selectProps.onMenuClose();\n }\n };\n\n // Handle Escape and Enter key to prevent it from bubbling up to dialog\n const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (\n (event.key === 'Escape' && isMenuOpen) ||\n (event.key === 'Enter' && isMenuOpen)\n ) {\n event.stopPropagation();\n }\n\n if (selectProps.onKeyDown) {\n selectProps.onKeyDown(event);\n }\n };\n\n const Component: React.ElementType = as ?? 'div';\n\n const ComponentOverrides = useMemo(\n () =>\n overrideComponents<OptionType, IsMulti, GroupType>({\n errorText,\n errorTextId,\n helpText,\n helpTextId,\n isClean,\n size,\n }),\n [errorText, errorTextId, helpText, helpTextId, size, isClean],\n );\n\n const StyleOverrides = useMemo(\n () => customStyles<OptionType, IsMulti, GroupType>(),\n [],\n );\n\n useEffect(() => {\n if (label === undefined && ariaLabel === undefined) {\n needleWarningMessage(\n 'A Select needs to have a label or an aria label to be accessible. link: https://dequeuniversity.com/rules/axe/4.2/label?application=axeAPI',\n );\n }\n }, [label, ariaLabel]);\n\n let SelectElement: React.JSX.Element;\n switch (type) {\n case 'async': {\n SelectElement = (\n <AsyncSelect\n name={identifier}\n inputId={identifier}\n isDisabled={Boolean(isDisabled) || selectProps.isDisabled}\n menuPlacement=\"auto\"\n aria-label={ariaLabel}\n aria-invalid={Boolean(errorText)}\n {...selectProps}\n onKeyDown={handleKeyDown}\n onMenuOpen={handleMenuOpen}\n onMenuClose={handleMenuClose}\n menuPosition={selectProps.menuPosition ?? menuPosition}\n hideSelectedOptions={false}\n closeMenuOnSelect={Boolean(selectProps.isMulti) === false}\n styles={{ ...StyleOverrides, ...selectProps.styles }}\n components={{ ...ComponentOverrides, ...selectProps.components }}\n />\n );\n break;\n }\n case 'creatable':\n SelectElement = (\n <Creatable\n name={identifier}\n inputId={identifier}\n isDisabled={Boolean(isDisabled) || selectProps.isDisabled}\n menuPlacement=\"auto\"\n {...selectProps}\n aria-label={ariaLabel}\n aria-invalid={Boolean(errorText)}\n onKeyDown={handleKeyDown}\n onMenuOpen={handleMenuOpen}\n onMenuClose={handleMenuClose}\n menuPosition={selectProps.menuPosition ?? menuPosition}\n hideSelectedOptions={false}\n closeMenuOnSelect={Boolean(selectProps.isMulti) === false}\n styles={{ ...StyleOverrides, ...selectProps.styles }}\n components={{ ...ComponentOverrides, ...selectProps.components }}\n />\n );\n break;\n default:\n SelectElement = (\n <ReactSelect\n name={identifier}\n inputId={identifier}\n isDisabled={Boolean(isDisabled) || selectProps.isDisabled}\n menuPlacement=\"auto\"\n {...selectProps}\n aria-label={ariaLabel}\n aria-invalid={Boolean(errorText)}\n onKeyDown={handleKeyDown}\n onMenuOpen={handleMenuOpen}\n onMenuClose={handleMenuClose}\n menuPosition={selectProps.menuPosition ?? menuPosition}\n hideSelectedOptions={false}\n closeMenuOnSelect={Boolean(selectProps.isMulti) === false}\n styles={{ ...StyleOverrides, ...selectProps.styles }}\n components={{ ...ComponentOverrides, ...selectProps.components }}\n />\n );\n }\n\n const classes = classNames('ndl-select', className, {\n 'ndl-creatable': type === 'creatable',\n 'ndl-disabled': selectProps.isDisabled,\n 'ndl-fluid': isFluid,\n 'ndl-has-error': Boolean(errorText),\n 'ndl-large': size === 'large',\n 'ndl-medium': size === 'medium',\n 'ndl-multi': selectProps.isMulti,\n 'ndl-small': size === 'small',\n });\n\n return (\n <Component\n ref={ref}\n className={classes}\n style={style}\n {...restProps}\n {...htmlAttributes}\n >\n {Boolean(label) && <label htmlFor={identifier}>{label}</label>}\n {SelectElement}\n {Boolean(helpText) && Boolean(errorText) === false && (\n <Typography\n variant={size === 'large' ? 'body-medium' : 'body-small'}\n className=\"ndl-sub-text\"\n htmlAttributes={{ id: helpTextId }}\n >\n {helpText}\n </Typography>\n )}\n {Boolean(errorText) && (\n <div className=\"n-flex n-flex-row n-gap-token-4 n-items-center\">\n <ExclamationCircleIconSolid\n className={classNames('ndl-error-icon', classes)}\n htmlAttributes={{ role: 'img', type: 'solid' }}\n />\n <span id={errorTextId} className=\"ndl-sub-text ndl-error-text\">\n {errorText}\n </span>\n </div>\n )}\n </Component>\n );\n};\n"]}
|
|
1
|
+
{"version":3,"file":"Select.js","sourceRoot":"","sources":["../../../src/select/Select.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\nimport classNames from 'classnames';\nimport type React from 'react';\nimport { useEffect, useId, useMemo, useState } from 'react';\nimport ReactSelect, { type GroupBase } from 'react-select';\nimport AsyncSelect from 'react-select/async';\n/** Different types of select components */\nimport Creatable from 'react-select/creatable';\n\nimport { type PolymorphicCommonProps } from '../_common/types';\nimport { needleWarningMessage } from '../_common/utils';\nimport { useIsInsideDialog } from '../dialog/dialog-context';\nimport { ExclamationCircleIconSolid } from '../icons';\nimport { Typography } from '../typography';\nimport {\n CustomClearIndication,\n CustomControl,\n CustomIndicatorsContainer,\n CustomInput,\n CustomMenu,\n CustomMenuList,\n CustomMenuPortal,\n CustomMultiValue,\n CustomOption,\n CustomPlaceholder,\n CustomSingleValue,\n CustomValueContainer,\n DropdownIndicatorCurrying,\n} from './Overrides';\nimport { type SelectOverrideCustomProps, type SelectProps } from './types';\n\n/**\n *\n *\n * Helpers\n *\n *\n */\n\nconst overrideComponents = <\n OptionType,\n IsMulti extends boolean = false,\n GroupType extends GroupBase<OptionType> = GroupBase<OptionType>,\n>(\n props: SelectOverrideCustomProps<OptionType, IsMulti, GroupType>,\n) =>\n ({\n ClearIndicator: CustomClearIndication(props),\n Control: CustomControl(props),\n DropdownIndicator: DropdownIndicatorCurrying(props),\n IndicatorSeparator: null,\n IndicatorsContainer: CustomIndicatorsContainer(props),\n Input: CustomInput(props),\n Menu: CustomMenu(props),\n MenuList: CustomMenuList(props),\n MenuPortal: CustomMenuPortal(props),\n MultiValue: CustomMultiValue(props),\n Option: CustomOption(props),\n Placeholder: CustomPlaceholder(props),\n SingleValue: CustomSingleValue(props),\n ValueContainer: CustomValueContainer(props),\n }) as SelectProps<\n OptionType,\n IsMulti,\n GroupType\n >['selectProps']['components'];\n\nconst customStyles = <\n OptionType,\n IsMulti extends boolean = false,\n GroupType extends GroupBase<OptionType> = GroupBase<OptionType>,\n>() => {\n return {\n clearIndicator: () => ({}),\n control: () => ({}),\n dropdownIndicator: () => ({}),\n indicatorsContainer: () => ({}),\n input: () => ({}),\n menu: (provided) => ({\n bottom: provided.bottom,\n top: provided.top,\n }),\n menuList: (provided) => ({\n maxHeight: provided.maxHeight,\n minHeight: provided.minHeight,\n }),\n option: () => ({}),\n placeholder: () => ({}),\n singleValue: () => ({}),\n valueContainer: (provided) => ({\n ...provided,\n padding: '0',\n }),\n } as SelectProps<OptionType, IsMulti, GroupType>['selectProps']['styles'];\n};\n\nexport const Select = <\n OptionType,\n IsMulti extends boolean = false,\n GroupType extends GroupBase<OptionType> = GroupBase<OptionType>,\n T extends React.ElementType = 'div',\n>({\n as,\n label,\n helpText,\n errorText,\n isFluid = true,\n size = 'medium',\n type = 'select',\n ariaLabel,\n selectProps = {},\n isClean = false,\n isDisabled,\n htmlAttributes,\n className,\n style,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, SelectProps<OptionType, IsMulti, GroupType>>) => {\n const isInsideDialog = useIsInsideDialog();\n const menuPosition = isInsideDialog ? 'fixed' : 'absolute';\n const identifier = useId();\n const helpTextId = useId();\n const errorTextId = useId();\n const [isMenuOpen, setIsMenuOpen] = useState(false);\n\n const handleMenuOpen = () => {\n setIsMenuOpen(true);\n if (selectProps.onMenuOpen) {\n selectProps.onMenuOpen();\n }\n };\n\n const handleMenuClose = () => {\n setIsMenuOpen(false);\n if (selectProps.onMenuClose) {\n selectProps.onMenuClose();\n }\n };\n\n // Handle Escape and Enter key to prevent it from bubbling up to dialog\n const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (\n (event.key === 'Escape' && isMenuOpen) ||\n (event.key === 'Enter' && isMenuOpen)\n ) {\n event.stopPropagation();\n }\n\n if (selectProps.onKeyDown) {\n selectProps.onKeyDown(event);\n }\n };\n\n const Component: React.ElementType = as ?? 'div';\n\n const ComponentOverrides = useMemo(\n () =>\n overrideComponents<OptionType, IsMulti, GroupType>({\n errorText,\n errorTextId,\n helpText,\n helpTextId,\n isClean,\n size,\n }),\n [errorText, errorTextId, helpText, helpTextId, size, isClean],\n );\n\n const StyleOverrides = useMemo(\n () => customStyles<OptionType, IsMulti, GroupType>(),\n [],\n );\n\n useEffect(() => {\n if (label === undefined && ariaLabel === undefined) {\n needleWarningMessage(\n 'A Select needs to have a label or an aria label to be accessible. link: https://dequeuniversity.com/rules/axe/4.2/label?application=axeAPI',\n );\n }\n }, [label, ariaLabel]);\n\n let SelectElement: React.JSX.Element;\n switch (type) {\n case 'async': {\n SelectElement = (\n <AsyncSelect\n name={identifier}\n inputId={identifier}\n isDisabled={Boolean(isDisabled) || selectProps.isDisabled}\n menuPlacement=\"auto\"\n aria-label={ariaLabel}\n aria-invalid={Boolean(errorText)}\n {...selectProps}\n onKeyDown={handleKeyDown}\n onMenuOpen={handleMenuOpen}\n onMenuClose={handleMenuClose}\n menuPosition={selectProps.menuPosition ?? menuPosition}\n hideSelectedOptions={false}\n closeMenuOnSelect={Boolean(selectProps.isMulti) === false}\n styles={{ ...StyleOverrides, ...selectProps.styles }}\n components={{ ...ComponentOverrides, ...selectProps.components }}\n />\n );\n break;\n }\n case 'creatable':\n SelectElement = (\n <Creatable\n name={identifier}\n inputId={identifier}\n isDisabled={Boolean(isDisabled) || selectProps.isDisabled}\n menuPlacement=\"auto\"\n {...selectProps}\n aria-label={ariaLabel}\n aria-invalid={Boolean(errorText)}\n onKeyDown={handleKeyDown}\n onMenuOpen={handleMenuOpen}\n onMenuClose={handleMenuClose}\n menuPosition={selectProps.menuPosition ?? menuPosition}\n hideSelectedOptions={false}\n closeMenuOnSelect={Boolean(selectProps.isMulti) === false}\n styles={{ ...StyleOverrides, ...selectProps.styles }}\n components={{ ...ComponentOverrides, ...selectProps.components }}\n />\n );\n break;\n default:\n SelectElement = (\n <ReactSelect\n name={identifier}\n inputId={identifier}\n isDisabled={Boolean(isDisabled) || selectProps.isDisabled}\n menuPlacement=\"auto\"\n {...selectProps}\n aria-label={ariaLabel}\n aria-invalid={Boolean(errorText)}\n onKeyDown={handleKeyDown}\n onMenuOpen={handleMenuOpen}\n onMenuClose={handleMenuClose}\n menuPosition={selectProps.menuPosition ?? menuPosition}\n hideSelectedOptions={false}\n closeMenuOnSelect={Boolean(selectProps.isMulti) === false}\n styles={{ ...StyleOverrides, ...selectProps.styles }}\n components={{ ...ComponentOverrides, ...selectProps.components }}\n />\n );\n }\n\n const classes = classNames('ndl-select', className, {\n 'ndl-creatable': type === 'creatable',\n 'ndl-disabled': selectProps.isDisabled,\n 'ndl-fluid': isFluid,\n 'ndl-has-error': Boolean(errorText),\n 'ndl-large': size === 'large',\n 'ndl-medium': size === 'medium',\n 'ndl-multi': selectProps.isMulti,\n 'ndl-small': size === 'small',\n });\n\n return (\n <Component\n ref={ref}\n className={classes}\n style={style}\n {...restProps}\n {...htmlAttributes}\n >\n {Boolean(label) && <label htmlFor={identifier}>{label}</label>}\n {SelectElement}\n {Boolean(helpText) && Boolean(errorText) === false && (\n <Typography\n variant={size === 'large' ? 'body-medium' : 'body-small'}\n className=\"ndl-sub-text\"\n htmlAttributes={{ id: helpTextId }}\n >\n {helpText}\n </Typography>\n )}\n {Boolean(errorText) && (\n <div className=\"n-flex n-flex-row n-gap-token-4 n-items-center\">\n <ExclamationCircleIconSolid\n className=\"ndl-error-icon\"\n htmlAttributes={{ role: 'img', type: 'solid' }}\n />\n <span id={errorTextId} className=\"ndl-sub-text ndl-error-text\">\n {errorText}\n </span>\n </div>\n )}\n </Component>\n );\n};\n"]}
|