From f5f8638fa171cc0f498d2a6c90584ddc8b3b6036 Mon Sep 17 00:00:00 2001 From: akeneo Date: Mon, 10 Jun 2024 12:32:09 +0000 Subject: [PATCH] Extract from 887eaa5361411d21699a214838c04a7b0bde9726 --- .../Input/SelectInput/SelectInput.d.ts | 3 +- .../Input/SelectInput/SelectInput.js | 40 +++++++--- .../Input/SelectInput/SelectInput.js.map | 2 +- package.json | 2 +- .../Input/SelectInput/SelectInput.stories.mdx | 25 ++++++ .../Input/SelectInput/SelectInput.tsx | 79 ++++++++++++------- .../Input/SelectInput/SelectInput.unit.tsx | 56 +++++++++++-- 7 files changed, 156 insertions(+), 51 deletions(-) diff --git a/lib/components/Input/SelectInput/SelectInput.d.ts b/lib/components/Input/SelectInput/SelectInput.d.ts index ba266c22..b4a3b2fa 100644 --- a/lib/components/Input/SelectInput/SelectInput.d.ts +++ b/lib/components/Input/SelectInput/SelectInput.d.ts @@ -35,8 +35,9 @@ declare type SelectInputProps = Override; declare const SelectInput: { ({ id, placeholder, invalid, value, emptyResultLabel, children, onChange, clearable, clearLabel, openLabel, readOnly, verticalPosition, onNextPage, onSearchChange, disableInternalSearch, "aria-labelledby": ariaLabelledby, ...rest }: SelectInputProps): React.JSX.Element; - Option: import("styled-components").StyledComponent<"span", any, { + Option: import("styled-components").StyledComponent<"span", any, Omit, "value" | "disabled"> & { value: string; + disabled?: boolean | undefined; }, never>; }; export { SelectInput }; diff --git a/lib/components/Input/SelectInput/SelectInput.js b/lib/components/Input/SelectInput/SelectInput.js index b212b9ec..ce8233e9 100644 --- a/lib/components/Input/SelectInput/SelectInput.js +++ b/lib/components/Input/SelectInput/SelectInput.js @@ -44,13 +44,10 @@ var __rest = (this && this.__rest) || function (s, e) { } return t; }; -var __importDefault = (this && this.__importDefault) || function (mod) { - return (mod && mod.__esModule) ? mod : { "default": mod }; -}; Object.defineProperty(exports, "__esModule", { value: true }); exports.SelectInput = void 0; var react_1 = __importStar(require("react")); -var styled_components_1 = __importDefault(require("styled-components")); +var styled_components_1 = __importStar(require("styled-components")); var shared_1 = require("../../../shared"); var common_1 = require("../common"); var IconButton_1 = require("../../../components/IconButton/IconButton"); @@ -82,10 +79,19 @@ var SelectedOptionContainer = styled_components_1.default.div(templateObject_5 | var readOnly = _a.readOnly; return (readOnly ? (0, theme_1.getColor)('grey', 100) : (0, theme_1.getColor)('grey', 140)); }); -var OptionContainer = styled_components_1.default.div(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n background: ", ";\n height: 34px;\n padding: 0 20px;\n align-items: center;\n gap: 10px;\n cursor: pointer;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n color: ", ";\n line-height: 34px;\n\n &:focus {\n background: ", ";\n color: ", ";\n }\n &:hover {\n background: ", ";\n color: ", ";\n }\n &:active {\n color: ", ";\n font-weight: 700;\n }\n &:disabled {\n color: ", ";\n }\n"], ["\n background: ", ";\n height: 34px;\n padding: 0 20px;\n align-items: center;\n gap: 10px;\n cursor: pointer;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n color: ", ";\n line-height: 34px;\n\n &:focus {\n background: ", ";\n color: ", ";\n }\n &:hover {\n background: ", ";\n color: ", ";\n }\n &:active {\n color: ", ";\n font-weight: 700;\n }\n &:disabled {\n color: ", ";\n }\n"])), (0, theme_1.getColor)('white'), (0, theme_1.getColor)('grey', 120), (0, theme_1.getColor)('grey', 20), (0, theme_1.getColor)('brand', 140), (0, theme_1.getColor)('grey', 20), (0, theme_1.getColor)('brand', 140), (0, theme_1.getColor)('brand', 100), (0, theme_1.getColor)('grey', 100)); -var EmptyResultContainer = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n background: ", ";\n height: 20px;\n padding: 0 20px;\n align-items: center;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n color: ", ";\n line-height: 20px;\n text-align: center;\n"], ["\n background: ", ";\n height: 20px;\n padding: 0 20px;\n align-items: center;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n color: ", ";\n line-height: 20px;\n text-align: center;\n"])), (0, theme_1.getColor)('white'), (0, theme_1.getColor)('grey', 100)); -var OptionCollection = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n max-height: 320px;\n overflow-y: auto;\n"], ["\n max-height: 320px;\n overflow-y: auto;\n"]))); -var Option = styled_components_1.default.span(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n display: block;\n line-height: 34px;\n min-height: 34px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n"], ["\n display: block;\n line-height: 34px;\n min-height: 34px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n"]))); +var OptionContainer = styled_components_1.default.div(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n background: ", ";\n height: 34px;\n padding: 0 20px;\n align-items: center;\n gap: 10px;\n cursor: ", ";\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n color: ", ";\n line-height: 34px;\n display: flex;\n justify-content: space-between;\n\n ", "\n"], ["\n background: ", ";\n height: 34px;\n padding: 0 20px;\n align-items: center;\n gap: 10px;\n cursor: ", ";\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n color: ", ";\n line-height: 34px;\n display: flex;\n justify-content: space-between;\n\n ", "\n"])), (0, theme_1.getColor)('white'), function (_a) { + var disabled = _a.disabled; + return (disabled ? 'not-allowed' : 'pointer'); +}, function (_a) { + var disabled = _a.disabled; + return (disabled ? (0, theme_1.getColor)('grey', 100) : (0, theme_1.getColor)('grey', 120)); +}, function (_a) { + var disabled = _a.disabled; + return !disabled && (0, styled_components_1.css)(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n &:focus {\n background: ", ";\n color: ", ";\n }\n &:hover {\n background: ", ";\n color: ", ";\n }\n &:active {\n color: ", ";\n font-weight: 700;\n }\n "], ["\n &:focus {\n background: ", ";\n color: ", ";\n }\n &:hover {\n background: ", ";\n color: ", ";\n }\n &:active {\n color: ", ";\n font-weight: 700;\n }\n "])), (0, theme_1.getColor)('grey', 20), (0, theme_1.getColor)('brand', 140), (0, theme_1.getColor)('grey', 20), (0, theme_1.getColor)('brand', 140), (0, theme_1.getColor)('brand', 100)); +}); +var EmptyResultContainer = styled_components_1.default.div(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n background: ", ";\n height: 20px;\n padding: 0 20px;\n align-items: center;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n color: ", ";\n line-height: 20px;\n text-align: center;\n"], ["\n background: ", ";\n height: 20px;\n padding: 0 20px;\n align-items: center;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n color: ", ";\n line-height: 20px;\n text-align: center;\n"])), (0, theme_1.getColor)('white'), (0, theme_1.getColor)('grey', 100)); +var OptionCollection = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n max-height: 320px;\n overflow-y: auto;\n"], ["\n max-height: 320px;\n overflow-y: auto;\n"]))); +var Option = styled_components_1.default.span(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n display: block;\n line-height: 34px;\n min-height: 34px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n"], ["\n display: block;\n line-height: 34px;\n min-height: 34px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n"]))); var SelectInput = function (_a) { var _b; var id = _a.id, placeholder = _a.placeholder, invalid = _a.invalid, value = _a.value, emptyResultLabel = _a.emptyResultLabel, children = _a.children, onChange = _a.onChange, _c = _a.clearable, clearable = _c === void 0 ? true : _c, _d = _a.clearLabel, clearLabel = _d === void 0 ? '' : _d, openLabel = _a.openLabel, _e = _a.readOnly, readOnly = _e === void 0 ? false : _e, verticalPosition = _a.verticalPosition, onNextPage = _a.onNextPage, onSearchChange = _a.onSearchChange, _f = _a.disableInternalSearch, disableInternalSearch = _f === void 0 ? false : _f, ariaLabelledby = _a["aria-labelledby"], rest = __rest(_a, ["id", "placeholder", "invalid", "value", "emptyResultLabel", "children", "onChange", "clearable", "clearLabel", "openLabel", "readOnly", "verticalPosition", "onNextPage", "onSearchChange", "disableInternalSearch", 'aria-labelledby']); @@ -99,6 +105,7 @@ var SelectInput = function (_a) { var validChildren = react_1.default.Children.toArray(children).filter(function (child) { return (0, react_1.isValidElement)(child); }); + readOnly = readOnly || validChildren.every(function (option) { var _a, _b; return (_b = (_a = option.props) === null || _a === void 0 ? void 0 : _a.disabled) !== null && _b !== void 0 ? _b : false; }); validChildren.reduce(function (optionCodes, child) { if (optionCodes.includes(child.props.value)) { throw new Error("Duplicate option value " + child.props.value); @@ -125,7 +132,10 @@ var SelectInput = function (_a) { setSearchValue(value); openOverlay(); }; - var handleOptionClick = function (value) { return function () { + var handleOptionClick = function (value, isOptionDisabled) { return function () { + if (isOptionDisabled) { + return; + } onChange === null || onChange === void 0 ? void 0 : onChange(value); handleEscape(); }; }; @@ -176,7 +186,7 @@ var SelectInput = function (_a) { (_a = (selectedOptionRef.current || firstOptionRef.current)) === null || _a === void 0 ? void 0 : _a.focus(); } }, [dropdownIsOpen, selectedOptionRef.current]); - var handleOptionKeyDown = (0, react_1.useCallback)(function (event) { + var handleOptionKeyDown = (0, react_1.useCallback)(function (event, isOptionDisabled) { var _a, _b; if (null !== event.currentTarget) { if (event.key === shared_1.Key.Tab) { @@ -194,7 +204,7 @@ var SelectInput = function (_a) { previousSibling === null || previousSibling === void 0 ? void 0 : previousSibling.focus(); event.preventDefault(); } - if (event.key === shared_1.Key.Enter) { + if (event.key === shared_1.Key.Enter && !isOptionDisabled) { var value_1 = (_a = event.currentTarget.firstChild) === null || _a === void 0 ? void 0 : _a.getAttribute('value'); onChange === null || onChange === void 0 ? void 0 : onChange(value_1); handleEscape(); @@ -221,6 +231,7 @@ var SelectInput = function (_a) { react_1.default.createElement(IconButton_1.IconButton, { ghost: "borderless", level: "tertiary", size: "small", icon: react_1.default.createElement(icons_1.ArrowDownIcon, null), title: openLabel, onClick: openOverlay, onFocus: handleEscape, tabIndex: -1 })))), dropdownIsOpen && !readOnly && (react_1.default.createElement(common_1.Overlay, { parentRef: inputRef, verticalPosition: verticalPosition, onClose: handleEscape }, react_1.default.createElement(OptionCollection, { ref: containerRef }, filteredChildren.length === 0 ? (react_1.default.createElement(EmptyResultContainer, null, emptyResultLabel)) : (filteredChildren.map(function (child, index) { + var _a, _b; var childValue = child.props.value; var ref = undefined; switch (index) { @@ -234,11 +245,14 @@ var SelectInput = function (_a) { if (value === childValue) { ref = selectedOptionRef; } - return (react_1.default.createElement(OptionContainer, { "data-testid": childValue, key: childValue, onClick: handleOptionClick(childValue), onKeyDown: handleOptionKeyDown, tabIndex: 0, ref: ref }, react_1.default.cloneElement(child))); + var isOptionDisabled = (_b = (_a = child.props) === null || _a === void 0 ? void 0 : _a.disabled) !== null && _b !== void 0 ? _b : false; + return (react_1.default.createElement(OptionContainer, { "data-testid": childValue, key: childValue, onClick: handleOptionClick(childValue, isOptionDisabled), onKeyDown: function (e) { return handleOptionKeyDown(e, isOptionDisabled); }, tabIndex: 0, ref: ref, disabled: isOptionDisabled }, + react_1.default.cloneElement(child), + isOptionDisabled && react_1.default.createElement(icons_1.LockIcon, { size: 18 }))); }))))))); }; exports.SelectInput = SelectInput; Option.displayName = 'SelectInput.Option'; SelectInput.Option = Option; -var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9; +var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10; //# sourceMappingURL=SelectInput.js.map \ No newline at end of file diff --git a/lib/components/Input/SelectInput/SelectInput.js.map b/lib/components/Input/SelectInput/SelectInput.js.map index 15e85193..bb1dba91 100644 --- a/lib/components/Input/SelectInput/SelectInput.js.map +++ b/lib/components/Input/SelectInput/SelectInput.js.map @@ -1 +1 @@ -{"version":3,"file":"SelectInput.js","sourceRoot":"","sources":["../../../../src/components/Input/SelectInput/SelectInput.tsx"],"names":[],"mappings":"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"} \ No newline at end of file +{"version":3,"file":"SelectInput.js","sourceRoot":"","sources":["../../../../src/components/Input/SelectInput/SelectInput.tsx"],"names":[],"mappings":"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"} \ No newline at end of file diff --git a/package.json b/package.json index ad2e8397..5b98db54 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "akeneo-design-system", - "version": "0.1.246", + "version": "0.1.247", "description": "Akeneo design system", "main": "lib/index.js", "scripts": { diff --git a/src/components/Input/SelectInput/SelectInput.stories.mdx b/src/components/Input/SelectInput/SelectInput.stories.mdx index fed89153..841d24a7 100644 --- a/src/components/Input/SelectInput/SelectInput.stories.mdx +++ b/src/components/Input/SelectInput/SelectInput.stories.mdx @@ -341,6 +341,31 @@ The placeholder text provides tips or examples of items to enter. Placeholder te +## Variation on disabled options + + + + {args => { + const [value, setValue] = useState(null); + return ( + + + + + + + + + + + + + + ); + }} + + + ## Pagination diff --git a/src/components/Input/SelectInput/SelectInput.tsx b/src/components/Input/SelectInput/SelectInput.tsx index 6e824b5e..26196e79 100644 --- a/src/components/Input/SelectInput/SelectInput.tsx +++ b/src/components/Input/SelectInput/SelectInput.tsx @@ -8,14 +8,14 @@ import React, { useCallback, SyntheticEvent, } from 'react'; -import styled from 'styled-components'; +import styled, {css} from 'styled-components'; import {Key, Override} from '../../../shared'; import {InputProps, Overlay} from '../common'; import {IconButton} from '../../../components/IconButton/IconButton'; import {TextInput} from '../../../components/Input/TextInput/TextInput'; import {useBooleanState, useShortcut, VerticalPosition} from '../../../hooks'; import {AkeneoThemedProps, getColor} from '../../../theme'; -import {ArrowDownIcon, CloseIcon} from '../../../icons'; +import {ArrowDownIcon, CloseIcon, LockIcon} from '../../../icons'; import {usePagination} from '../../../hooks/usePagination'; const SelectInputContainer = styled.div<{value: string | null; readOnly: boolean} & AkeneoThemedProps>` @@ -67,34 +67,37 @@ const SelectedOptionContainer = styled.div<{readOnly: boolean; clearable: boolea color: ${({readOnly}) => (readOnly ? getColor('grey', 100) : getColor('grey', 140))}; `; -const OptionContainer = styled.div` +const OptionContainer = styled.div<{disabled: boolean} & AkeneoThemedProps>` background: ${getColor('white')}; height: 34px; padding: 0 20px; align-items: center; gap: 10px; - cursor: pointer; + cursor: ${({disabled}) => (disabled ? 'not-allowed' : 'pointer')}; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; - color: ${getColor('grey', 120)}; + color: ${({disabled}) => (disabled ? getColor('grey', 100) : getColor('grey', 120))}; line-height: 34px; - - &:focus { - background: ${getColor('grey', 20)}; - color: ${getColor('brand', 140)}; - } - &:hover { - background: ${getColor('grey', 20)}; - color: ${getColor('brand', 140)}; - } - &:active { - color: ${getColor('brand', 100)}; - font-weight: 700; - } - &:disabled { - color: ${getColor('grey', 100)}; - } + display: flex; + justify-content: space-between; + + ${({disabled}) => + !disabled && + css` + &:focus { + background: ${getColor('grey', 20)}; + color: ${getColor('brand', 140)}; + } + &:hover { + background: ${getColor('grey', 20)}; + color: ${getColor('brand', 140)}; + } + &:active { + color: ${getColor('brand', 100)}; + font-weight: 700; + } + `} `; const EmptyResultContainer = styled.div` @@ -115,7 +118,15 @@ const OptionCollection = styled.div` overflow-y: auto; `; -const Option = styled.span<{value: string}>` +type OptionProps = Override< + React.HTMLAttributes, + { + value: string; + disabled?: boolean; + } +>; + +const Option = styled.span` display: block; line-height: 34px; min-height: 34px; @@ -229,11 +240,12 @@ const SelectInput = ({ const lastOptionRef = useRef(null); const selectedOptionRef = useRef(null); - const validChildren = React.Children.toArray(children).filter( - (child): child is ReactElement<{value: string} & React.HTMLAttributes> => - isValidElement<{value: string}>(child) + const validChildren = React.Children.toArray(children).filter((child): child is ReactElement => + isValidElement(child) ); + readOnly = readOnly || validChildren.every(option => option.props?.disabled ?? false); + validChildren.reduce((optionCodes: string[], child) => { if (optionCodes.includes(child.props.value)) { throw new Error(`Duplicate option value ${child.props.value}`); @@ -268,7 +280,10 @@ const SelectInput = ({ openOverlay(); }; - const handleOptionClick = (value: string) => () => { + const handleOptionClick = (value: string, isOptionDisabled: boolean) => () => { + if (isOptionDisabled) { + return; + } onChange?.(value); handleEscape(); }; @@ -324,7 +339,7 @@ const SelectInput = ({ }, [dropdownIsOpen, selectedOptionRef.current]); const handleOptionKeyDown = useCallback( - (event: KeyboardEvent) => { + (event: KeyboardEvent, isOptionDisabled: boolean) => { if (null !== event.currentTarget) { if (event.key === Key.Tab) { setSearchValue(''); @@ -341,7 +356,7 @@ const SelectInput = ({ previousSibling?.focus(); event.preventDefault(); } - if (event.key === Key.Enter) { + if (event.key === Key.Enter && !isOptionDisabled) { const value = (event.currentTarget.firstChild as HTMLElement)?.getAttribute('value') as string; onChange?.(value); handleEscape(); @@ -432,16 +447,20 @@ const SelectInput = ({ ref = selectedOptionRef; } + const isOptionDisabled = child.props?.disabled ?? false; + return ( ) => handleOptionKeyDown(e, isOptionDisabled)} tabIndex={0} ref={ref} + disabled={isOptionDisabled} > {React.cloneElement(child)} + {isOptionDisabled && } ); }) diff --git a/src/components/Input/SelectInput/SelectInput.unit.tsx b/src/components/Input/SelectInput/SelectInput.unit.tsx index da1abe9a..bdad9283 100644 --- a/src/components/Input/SelectInput/SelectInput.unit.tsx +++ b/src/components/Input/SelectInput/SelectInput.unit.tsx @@ -393,11 +393,6 @@ test('it handles keyboard navigation with initial value', () => { const input = screen.getByRole('textbox'); fireEvent.focus(input); - /*fireEvent.keyDown(input, {key: 'ArrowUp', code: 'ArrowUp'}); - expect(onChange).toBeCalledWith('en_US'); - fireEvent.keyDown(input, {key: 'ArrowDown', code: 'ArrowDown'}); - expect(onChange).toBeCalledWith('de_DE');*/ - fireEvent.click(input); const englishOption = screen.queryByTestId('en_US'); const frenchOption = screen.queryByTestId('fr_FR'); @@ -439,3 +434,54 @@ test('SelectInput does not support duplicated options', () => { }).toThrowError('Duplicate option value en_US'); mockConsole.mockRestore(); }); + +test('its children could be disabled', () => { + const onChange = jest.fn(); + render( + + + + + + + + + ); + + const input = screen.getByRole('textbox'); + fireEvent.click(input); + const englishOption = screen.getByTestId('en_US'); + expect(englishOption).toBeInTheDocument(); + fireEvent.click(englishOption); + + expect(onChange).not.toHaveBeenCalled(); +}); + +test('it becomes read only when every children are disabled', () => { + const onChange = jest.fn(); + render( + + + + + + + + + ); + + const input = screen.getByRole('textbox'); + expect(input).toBeDisabled(); +});