@pega/cosmos-react-core 8.21.0 → 8.21.1
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/components/CompositeInput/CompositeInput.d.ts.map +1 -1
- package/lib/components/CompositeInput/CompositeInput.js +6 -6
- package/lib/components/CompositeInput/CompositeInput.js.map +1 -1
- package/lib/components/CompositeInput/CompositeInput.styles.d.ts +1 -0
- package/lib/components/CompositeInput/CompositeInput.styles.d.ts.map +1 -1
- package/lib/components/CompositeInput/CompositeInput.styles.js +30 -1
- package/lib/components/CompositeInput/CompositeInput.styles.js.map +1 -1
- package/lib/components/SearchInput/SearchInput.d.ts.map +1 -1
- package/lib/components/SearchInput/SearchInput.js +3 -2
- package/lib/components/SearchInput/SearchInput.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CompositeInput.d.ts","sourceRoot":"","sources":["../../../src/components/CompositeInput/CompositeInput.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"CompositeInput.d.ts","sourceRoot":"","sources":["../../../src/components/CompositeInput/CompositeInput.tsx"],"names":[],"mappings":"AAsBA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;0BAsJ1D,CAAC,SAAS,MAAM,SAAS,mBAAmB,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC,OAAO,GAAG,IAAI;;;AAjJ9E,wBAmJE"}
|
|
@@ -11,7 +11,7 @@ import Flex from '../Flex';
|
|
|
11
11
|
import Button from '../Button';
|
|
12
12
|
import FormField from '../FormField';
|
|
13
13
|
import { FormDialog } from '../Dialog';
|
|
14
|
-
import { StyledCompositeInput, StyledInputButton, StyledInputContainer } from './CompositeInput.styles';
|
|
14
|
+
import { StyledClearButton, StyledCompositeInput, StyledInputButton, StyledInputContainer } from './CompositeInput.styles';
|
|
15
15
|
import { getCompositeInputTestIds } from './CompositeInput.test-ids';
|
|
16
16
|
registerIcon(caretDownIcon, caretUpIcon, timesIcon);
|
|
17
17
|
export default withTestIds(forwardRef(function CompositeInput(props, ref) {
|
|
@@ -36,14 +36,14 @@ export default withTestIds(forwardRef(function CompositeInput(props, ref) {
|
|
|
36
36
|
e.preventDefault();
|
|
37
37
|
setOpen(true);
|
|
38
38
|
}
|
|
39
|
-
}, value: value ?? '', ref: buttonRef }),
|
|
40
|
-
onClear();
|
|
41
|
-
buttonRef.current?.focus();
|
|
42
|
-
}, disabled: disabled, children: _jsx(Icon, { name: 'times' }) })) : (_jsx(Button, { icon: true, variant: 'simple', onClick: () => {
|
|
39
|
+
}, value: value ?? '', ref: buttonRef }), _jsx(Button, { icon: true, variant: 'simple', onClick: () => {
|
|
43
40
|
setOpen(!open);
|
|
44
41
|
}, onMouseDown: (e) => {
|
|
45
42
|
e.preventDefault();
|
|
46
|
-
}, "aria-label": t(open ? 'composite_input_close_button_a11y' : 'composite_input_open_button_a11y'), disabled: disabled, tabIndex: '-1', children: _jsx(Icon, { name: open ? 'caret-up' : 'caret-down' }) })
|
|
43
|
+
}, "aria-label": t(open ? 'composite_input_close_button_a11y' : 'composite_input_open_button_a11y'), disabled: disabled, tabIndex: '-1', children: _jsx(Icon, { name: open ? 'caret-up' : 'caret-down' }) }), onClear && (_jsx(StyledClearButton, { icon: true, variant: 'simple', label: t('clear'), onClick: () => {
|
|
44
|
+
onClear();
|
|
45
|
+
buttonRef.current?.focus();
|
|
46
|
+
}, disabled: disabled, children: _jsx(Icon, { name: 'times' }) }))] }), open && containerRef.current && (_jsx(FormDialog, { arrow: false, "aria-label": label, target: containerRef.current, placement: 'bottom-start', onCancel: () => onCancel({ close: closePopover }), onSubmit: {
|
|
47
47
|
text: t('apply'),
|
|
48
48
|
handler: () => onApply({ close: closePopover })
|
|
49
49
|
}, id: `${id}-dialog`, children: _jsx(Flex, { container: { direction: 'column' }, children: _jsx(Renderer, { ...rendererProps }) }) }))] }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CompositeInput.js","sourceRoot":"","sources":["../../../src/components/CompositeInput/CompositeInput.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"CompositeInput.js","sourceRoot":"","sources":["../../../src/components/CompositeInput/CompositeInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useRef, useState } from 'react';\nimport type { PropsWithoutRef } from 'react';\n\nimport Icon, { registerIcon } from '../Icon';\nimport * as caretDownIcon from '../Icon/icons/caret-down.icon';\nimport * as caretUpIcon from '../Icon/icons/caret-up.icon';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport type { RefElement } from '../../types';\nimport { useConsolidatedRef, useI18n, useTestIds, useUID } from '../../hooks';\nimport { StyledFormControl } from '../FormControl';\nimport { createClassName, withTestIds } from '../../utils';\nimport Flex from '../Flex';\nimport Button from '../Button';\nimport FormField from '../FormField';\nimport { FormDialog } from '../Dialog';\n\nimport {\n StyledClearButton,\n StyledCompositeInput,\n StyledInputButton,\n StyledInputContainer\n} from './CompositeInput.styles';\nimport type { CompositeInputProps } from './CompositeInput.types';\nimport { getCompositeInputTestIds } from './CompositeInput.test-ids';\n\nregisterIcon(caretDownIcon, caretUpIcon, timesIcon);\n\nexport default withTestIds(\n forwardRef<RefElement<CompositeInputProps>, PropsWithoutRef<CompositeInputProps>>(\n function CompositeInput(props, ref) {\n const uid = useUID();\n const {\n testId,\n id = uid,\n disabled,\n value,\n onClear,\n required,\n status,\n info,\n label,\n labelHidden,\n additionalInfo,\n dialog: { renderer: Renderer, rendererProps, onApply, onCancel },\n className,\n ...restProps\n } = props;\n\n const testIds = useTestIds(testId, getCompositeInputTestIds);\n const t = useI18n();\n\n const [open, setOpen] = useState(false);\n\n const containerRef = useConsolidatedRef<HTMLDivElement>(ref);\n const buttonRef = useRef<HTMLInputElement>(null);\n\n const closePopover = () => {\n setOpen(false);\n buttonRef.current?.focus();\n };\n\n const labelId = `${id}-label`;\n\n const Comp = (\n <Flex\n as={StyledCompositeInput}\n forwardedAs={StyledFormControl}\n container={{ alignItems: 'center' }}\n status={status}\n disabled={disabled}\n ref={containerRef}\n >\n <Flex container={{ alignItems: 'center' }} item={{ grow: 1 }} as={StyledInputContainer}>\n <StyledInputButton\n data-testid={testIds.control}\n {...restProps}\n id={id}\n disabled={disabled}\n aria-haspopup='dialog'\n aria-describedby={info ? `${id}-info` : undefined}\n aria-controls={open ? `${id}-dialog` : undefined}\n className={createClassName('composite-input', className)}\n readOnly\n required={required}\n onClick={() => {\n if (!disabled) {\n setOpen(true);\n }\n }}\n onKeyDown={e => {\n if (e.key === 'Enter') {\n e.preventDefault();\n setOpen(true);\n }\n }}\n value={value ?? ''}\n ref={buttonRef}\n />\n <Button\n icon\n variant='simple'\n onClick={() => {\n setOpen(!open);\n }}\n onMouseDown={(e: MouseEvent) => {\n e.preventDefault();\n }}\n aria-label={t(\n open ? 'composite_input_close_button_a11y' : 'composite_input_open_button_a11y'\n )}\n disabled={disabled}\n tabIndex='-1'\n >\n <Icon name={open ? 'caret-up' : 'caret-down'} />\n </Button>\n {onClear && (\n <StyledClearButton\n icon\n variant='simple'\n label={t('clear')}\n onClick={() => {\n onClear();\n buttonRef.current?.focus();\n }}\n disabled={disabled}\n >\n <Icon name='times' />\n </StyledClearButton>\n )}\n </Flex>\n\n {open && containerRef.current && (\n <FormDialog\n arrow={false}\n // FIXME: The wrath of optional labels, as a ReactNode, strikes again...\n aria-label={label as string}\n target={containerRef.current}\n placement='bottom-start'\n onCancel={() => onCancel({ close: closePopover })}\n onSubmit={{\n text: t('apply'),\n handler: () => onApply({ close: closePopover })\n }}\n id={`${id}-dialog`}\n >\n <Flex container={{ direction: 'column' }}>\n <Renderer {...rendererProps} />\n </Flex>\n </FormDialog>\n )}\n </Flex>\n );\n\n return label ? (\n <FormField\n testId={testIds}\n label={label}\n labelHidden={labelHidden}\n id={id}\n info={info}\n status={status}\n required={required}\n disabled={disabled}\n labelId={labelId}\n additionalInfo={additionalInfo}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n );\n }\n ) as <P extends object>(props: CompositeInputProps<P>) => JSX.Element | null,\n getCompositeInputTestIds\n);\n"]}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
export declare const StyledInputButton: import("styled-components").StyledComponent<"input", import("styled-components").DefaultTheme, {}, never>;
|
|
2
|
+
export declare const StyledClearButton: import("styled-components").StyledComponent<import("../..").ForwardRefForwardPropsComponent<import("../Button").ButtonProps>, import("styled-components").DefaultTheme, {}, never>;
|
|
2
3
|
export declare const StyledInputContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
3
4
|
export declare const StyledCompositeInput: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
4
5
|
export default StyledCompositeInput;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CompositeInput.styles.d.ts","sourceRoot":"","sources":["../../../src/components/CompositeInput/CompositeInput.styles.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,iBAAiB,2GAc7B,CAAC;AAEF,eAAO,MAAM,oBAAoB,
|
|
1
|
+
{"version":3,"file":"CompositeInput.styles.d.ts","sourceRoot":"","sources":["../../../src/components/CompositeInput/CompositeInput.styles.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,iBAAiB,2GAc7B,CAAC;AAEF,eAAO,MAAM,iBAAiB,oLAkC5B,CAAC;AAIH,eAAO,MAAM,oBAAoB,yGAoChC,CAAC;AAEF,eAAO,MAAM,oBAAoB,yGAyBhC,CAAC;AAIF,eAAe,oBAAoB,CAAC"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import styled, { css } from 'styled-components';
|
|
2
|
-
import { StyledButton } from '../Button';
|
|
2
|
+
import Button, { StyledButton } from '../Button';
|
|
3
3
|
import { defaultThemeProp } from '../../theme';
|
|
4
4
|
import StyledInput from '../Input/Input.styles';
|
|
5
5
|
export const StyledInputButton = styled(StyledInput) `
|
|
@@ -17,6 +17,30 @@ export const StyledInputButton = styled(StyledInput) `
|
|
|
17
17
|
inset-inline: calc(100% - 2rem) 0;
|
|
18
18
|
}
|
|
19
19
|
`;
|
|
20
|
+
export const StyledClearButton = styled(Button)(({ theme: { base: { 'border-radius': borderRadius }, components: { input: { height }, 'form-control': { 'border-radius': formBorderRadius, 'border-width': borderWidth, 'border-color': borderColor } } } }) => {
|
|
21
|
+
return css `
|
|
22
|
+
position: relative;
|
|
23
|
+
border-start-start-radius: 0;
|
|
24
|
+
border-start-end-radius: calc(${borderRadius} * ${formBorderRadius});
|
|
25
|
+
border-end-start-radius: 0;
|
|
26
|
+
border-end-end-radius: calc(${borderRadius} * ${formBorderRadius});
|
|
27
|
+
box-shadow: -0.0625rem 0 0 0 ${borderColor};
|
|
28
|
+
|
|
29
|
+
${StyledButton} + & {
|
|
30
|
+
margin-inline-start: 0.0625rem;
|
|
31
|
+
align-self: center;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
&:focus,
|
|
35
|
+
&:focus:hover {
|
|
36
|
+
min-height: calc(${height} - 2 * ${borderWidth});
|
|
37
|
+
height: calc(${height} - 2 * ${borderWidth});
|
|
38
|
+
width: calc(${height} - 2 * ${borderWidth});
|
|
39
|
+
border-radius: calc(${borderRadius} * ${formBorderRadius});
|
|
40
|
+
}
|
|
41
|
+
`;
|
|
42
|
+
});
|
|
43
|
+
StyledClearButton.defaultProps = defaultThemeProp;
|
|
20
44
|
export const StyledInputContainer = styled.div(({ theme: { base: { 'border-radius': borderRadius }, components: { input: { height }, 'form-control': { 'border-radius': formBorderRadius, 'border-width': borderWidth } } } }) => {
|
|
21
45
|
return css `
|
|
22
46
|
position: relative;
|
|
@@ -36,6 +60,11 @@ export const StyledInputContainer = styled.div(({ theme: { base: { 'border-radiu
|
|
|
36
60
|
width: calc(${height} - 2 * ${borderWidth});
|
|
37
61
|
border-radius: calc(${borderRadius} * ${formBorderRadius});
|
|
38
62
|
}
|
|
63
|
+
|
|
64
|
+
&:not(:last-of-type) {
|
|
65
|
+
border-start-end-radius: 0;
|
|
66
|
+
border-end-end-radius: 0;
|
|
67
|
+
}
|
|
39
68
|
}
|
|
40
69
|
`;
|
|
41
70
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CompositeInput.styles.js","sourceRoot":"","sources":["../../../src/components/CompositeInput/CompositeInput.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;
|
|
1
|
+
{"version":3,"file":"CompositeInput.styles.js","sourceRoot":"","sources":["../../../src/components/CompositeInput/CompositeInput.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,MAAM,EAAE,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AACjD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,WAAW,MAAM,uBAAuB,CAAC;AAEhD,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,WAAW,CAAC,CAAA;;;;;;;;;;;;;;CAcnD,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAC/C,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,eAAe,EAAE,YAAY,EAAE,EACvC,UAAU,EAAE,EACV,KAAK,EAAE,EAAE,MAAM,EAAE,EACjB,cAAc,EAAE,EACd,eAAe,EAAE,gBAAgB,EACjC,cAAc,EAAE,WAAW,EAC3B,cAAc,EAAE,WAAW,EAC5B,EACF,EACF,EACF,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;;;oCAGwB,YAAY,MAAM,gBAAgB;;kCAEpC,YAAY,MAAM,gBAAgB;mCACjC,WAAW;;MAExC,YAAY;;;;;;;yBAOO,MAAM,UAAU,WAAW;qBAC/B,MAAM,UAAU,WAAW;oBAC5B,MAAM,UAAU,WAAW;4BACnB,YAAY,MAAM,gBAAgB;;GAE3D,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,iBAAiB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAElD,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,GAAG,CAC5C,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,eAAe,EAAE,YAAY,EAAE,EACvC,UAAU,EAAE,EACV,KAAK,EAAE,EAAE,MAAM,EAAE,EACjB,cAAc,EAAE,EAAE,eAAe,EAAE,gBAAgB,EAAE,cAAc,EAAE,WAAW,EAAE,EACnF,EACF,EACF,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;;;YAGF,YAAY;;;;wCAIgB,YAAY,MAAM,gBAAgB;;sCAEpC,YAAY,MAAM,gBAAgB;;;;6BAI3C,MAAM,UAAU,WAAW;yBAC/B,MAAM,UAAU,WAAW;wBAC5B,MAAM,UAAU,WAAW;gCACnB,YAAY,MAAM,gBAAgB;;;;;;;;KAQ7D,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,GAAG,CAC5C,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,UAAU,EAAE,OAAO,EAAE,EAC7B,UAAU,EAAE,EAAE,cAAc,EAAE,WAAW,EAAE,KAAK,EAAE,EACnD,EACF,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;gBACE,KAAK,CAAC,MAAM;oBACR,OAAO,CAAC,WAAW,CAAC;;;sBAGlB,OAAO,CAAC,YAAY,CAAC;;;;wBAInB,WAAW,CAAC,QAAQ,CAAC,CAAC,cAAc,CAAC;sBACvC,WAAW,CAAC,QAAQ,CAAC,CAAC,YAAY,CAAC;;;;;;KAMpD,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,oBAAoB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAErD,eAAe,oBAAoB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport Button, { StyledButton } from '../Button';\nimport { defaultThemeProp } from '../../theme';\nimport StyledInput from '../Input/Input.styles';\n\nexport const StyledInputButton = styled(StyledInput)`\n background-color: inherit;\n color: currentColor;\n outline: none;\n border: 0;\n caret-color: transparent;\n cursor: default;\n width: 100%;\n\n & + div {\n position: absolute;\n inset-block: 0.0625rem;\n inset-inline: calc(100% - 2rem) 0;\n }\n`;\n\nexport const StyledClearButton = styled(Button)(({\n theme: {\n base: { 'border-radius': borderRadius },\n components: {\n input: { height },\n 'form-control': {\n 'border-radius': formBorderRadius,\n 'border-width': borderWidth,\n 'border-color': borderColor\n }\n }\n }\n}) => {\n return css`\n position: relative;\n border-start-start-radius: 0;\n border-start-end-radius: calc(${borderRadius} * ${formBorderRadius});\n border-end-start-radius: 0;\n border-end-end-radius: calc(${borderRadius} * ${formBorderRadius});\n box-shadow: -0.0625rem 0 0 0 ${borderColor};\n\n ${StyledButton} + & {\n margin-inline-start: 0.0625rem;\n align-self: center;\n }\n\n &:focus,\n &:focus:hover {\n min-height: calc(${height} - 2 * ${borderWidth});\n height: calc(${height} - 2 * ${borderWidth});\n width: calc(${height} - 2 * ${borderWidth});\n border-radius: calc(${borderRadius} * ${formBorderRadius});\n }\n `;\n});\n\nStyledClearButton.defaultProps = defaultThemeProp;\n\nexport const StyledInputContainer = styled.div(\n ({\n theme: {\n base: { 'border-radius': borderRadius },\n components: {\n input: { height },\n 'form-control': { 'border-radius': formBorderRadius, 'border-width': borderWidth }\n }\n }\n }) => {\n return css`\n position: relative;\n\n & > ${StyledButton} {\n margin-block: -0.0625rem;\n margin-inline-end: -0.0625rem;\n border-start-start-radius: 0;\n border-start-end-radius: calc(${borderRadius} * ${formBorderRadius});\n border-end-start-radius: 0;\n border-end-end-radius: calc(${borderRadius} * ${formBorderRadius});\n\n &:focus,\n &:focus:hover {\n min-height: calc(${height} - 2 * ${borderWidth});\n height: calc(${height} - 2 * ${borderWidth});\n width: calc(${height} - 2 * ${borderWidth});\n border-radius: calc(${borderRadius} * ${formBorderRadius});\n }\n\n &:not(:last-of-type) {\n border-start-end-radius: 0;\n border-end-end-radius: 0;\n }\n }\n `;\n }\n);\n\nexport const StyledCompositeInput = styled.div(\n ({\n theme: {\n base: { 'hit-area': hitArea },\n components: { 'form-control': formControl, input }\n }\n }) => {\n return css`\n height: ${input.height};\n min-height: ${hitArea['mouse-min']};\n\n @media (pointer: coarse) {\n min-height: ${hitArea['finger-min']};\n }\n\n &:focus-within {\n border-color: ${formControl[':focus']['border-color']};\n box-shadow: ${formControl[':focus']['box-shadow']};\n }\n\n &:hover:not([readonly]):not([disabled]):focus-within {\n border-color: transparent;\n }\n `;\n }\n);\n\nStyledCompositeInput.defaultProps = defaultThemeProp;\n\nexport default StyledCompositeInput;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SearchInput.d.ts","sourceRoot":"","sources":["../../../src/components/SearchInput/SearchInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,iBAAiB,EAMjB,oBAAoB,EACrB,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAIvF,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAevD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAE7C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAqBzC,MAAM,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,EAAE,IAAI,GAAG,SAAS,GAAG,WAAW,GAAG,MAAM,GAAG,SAAS,CAAC,CAAC;AAEpG,MAAM,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,EAAE,IAAI,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,CAAC,CAAC;AAEtF,MAAM,MAAM,YAAY,GACpB;IACE,8DAA8D;IAC9D,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,+CAA+C;IAC/C,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,aAAa,CAAC,EAAE,KAAK,CAAC;CACvB,GACD;IACE,8DAA8D;IAC9D,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,aAAa,CAAC,EAAE,KAAK,CAAC;IACtB,6CAA6C;IAC7C,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,GACD;IACE,OAAO,CAAC,EAAE,KAAK,CAAC;IAChB,aAAa,CAAC,EAAE,KAAK,CAAC;IACtB,aAAa,CAAC,EAAE,KAAK,CAAC;CACvB,CAAC;AAEN,MAAM,MAAM,gBAAgB,GAAG,cAAc,GAC3C,SAAS,GAAG;IACV,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C;;;OAGG;IACH,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,iDAAiD;IACjD,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC;;;OAGG;IACH,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,6CAA6C;IAC7C,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,sCAAsC;IACtC,SAAS,CAAC,EAAE,oBAAoB,CAAC,gBAAgB,CAAC,CAAC;IACnD,yEAAyE;IACzE,aAAa,CAAC,EAAE,YAAY,EAAE,CAAC;IAC/B,wEAAwE;IACxE,cAAc,CAAC,EAAE,YAAY,EAAE,CAAC;IAChC,2DAA2D;IAC3D,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,oDAAoD;IACpD,kBAAkB,CAAC,EAAE,UAAU,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC;IACvD,2DAA2D;IAC3D,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B,GAAG,YAAY,CAAC;AAEnB,QAAA,MAAM,WAAW,EAAE,iBAAiB,CAAC,gBAAgB,GAAG,YAAY,
|
|
1
|
+
{"version":3,"file":"SearchInput.d.ts","sourceRoot":"","sources":["../../../src/components/SearchInput/SearchInput.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,iBAAiB,EAMjB,oBAAoB,EACrB,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAE,SAAS,EAAE,YAAY,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAIvF,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAevD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAE7C,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAqBzC,MAAM,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,EAAE,IAAI,GAAG,SAAS,GAAG,WAAW,GAAG,MAAM,GAAG,SAAS,CAAC,CAAC;AAEpG,MAAM,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,EAAE,IAAI,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,CAAC,CAAC;AAEtF,MAAM,MAAM,YAAY,GACpB;IACE,8DAA8D;IAC9D,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,+CAA+C;IAC/C,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,aAAa,CAAC,EAAE,KAAK,CAAC;CACvB,GACD;IACE,8DAA8D;IAC9D,OAAO,EAAE,MAAM,EAAE,CAAC;IAClB,aAAa,CAAC,EAAE,KAAK,CAAC;IACtB,6CAA6C;IAC7C,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,GACD;IACE,OAAO,CAAC,EAAE,KAAK,CAAC;IAChB,aAAa,CAAC,EAAE,KAAK,CAAC;IACtB,aAAa,CAAC,EAAE,KAAK,CAAC;CACvB,CAAC;AAEN,MAAM,MAAM,gBAAgB,GAAG,cAAc,GAC3C,SAAS,GAAG;IACV,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C;;;OAGG;IACH,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,iDAAiD;IACjD,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC;;;OAGG;IACH,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,6CAA6C;IAC7C,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,sCAAsC;IACtC,SAAS,CAAC,EAAE,oBAAoB,CAAC,gBAAgB,CAAC,CAAC;IACnD,yEAAyE;IACzE,aAAa,CAAC,EAAE,YAAY,EAAE,CAAC;IAC/B,wEAAwE;IACxE,cAAc,CAAC,EAAE,YAAY,EAAE,CAAC;IAChC,2DAA2D;IAC3D,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,oDAAoD;IACpD,kBAAkB,CAAC,EAAE,UAAU,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC;IACvD,2DAA2D;IAC3D,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B,GAAG,YAAY,CAAC;AAEnB,QAAA,MAAM,WAAW,EAAE,iBAAiB,CAAC,gBAAgB,GAAG,YAAY,CAiVnE,CAAC;AAEF,eAAe,WAAW,CAAC"}
|
|
@@ -30,8 +30,8 @@ const SearchInput = forwardRef(function SearchInput(props, ref) {
|
|
|
30
30
|
const theme = useTheme();
|
|
31
31
|
const [searchMenuOpen, setSearchMenuOpen] = useState(false);
|
|
32
32
|
const [searchResultItems, setSearchResultItems] = useState(undefined);
|
|
33
|
-
const [selectedFilter, setSelectedFilter] = useState(defaultFilter ?? t('all'));
|
|
34
33
|
const [downPressed, setDownPressed] = useState(false);
|
|
34
|
+
const [selectedFilter, setSelectedFilter] = useState(currentFilter ?? defaultFilter ?? t('all'));
|
|
35
35
|
const completeFilters = [t('all'), ...(filters ?? [])];
|
|
36
36
|
const hasFilters = completeFilters.length > 1;
|
|
37
37
|
const hasSearchResults = !!(searchResults && searchResults.length);
|
|
@@ -124,8 +124,9 @@ const SearchInput = forwardRef(function SearchInput(props, ref) {
|
|
|
124
124
|
}
|
|
125
125
|
}, [focus]);
|
|
126
126
|
useEffect(() => {
|
|
127
|
-
if (currentFilter)
|
|
127
|
+
if (currentFilter !== undefined) {
|
|
128
128
|
setSelectedFilter(currentFilter);
|
|
129
|
+
}
|
|
129
130
|
}, [currentFilter]);
|
|
130
131
|
return (_jsxs(_Fragment, { children: [_jsxs(Flex, { container: true, as: StyledSearchInput, hasFilters: hasFilters, showSubmit: !!onSearchSubmit, className: createClassName('search-input', className, { loading: !!loadingProp }), children: [hasFilters && (_jsxs(_Fragment, { children: [_jsx(ThemeOverride, { theme: {
|
|
131
132
|
components: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SearchInput.js","sourceRoot":"","sources":["../../../src/components/SearchInput/SearchInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useState, useCallback, useEffect, useRef } from 'react';\nimport type {\n FunctionComponent,\n PropsWithoutRef,\n Ref,\n ChangeEvent,\n KeyboardEvent as ReactKeyboardEvent,\n MutableRefObject,\n KeyboardEventHandler\n} from 'react';\n\nimport type { BaseProps, ForwardProps, NoChildrenProp, OmitStrict } from '../../types';\nimport Icon, { registerIcon } from '../Icon';\nimport * as searchIcon from '../Icon/icons/search.icon';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport type { FormControlProps } from '../FormControl';\nimport {\n useConsolidatedRef,\n useEscape,\n useI18n,\n useOuterEvent,\n useLiveLog,\n useUID,\n useFocusWithin,\n useTheme\n} from '../../hooks';\nimport Flex from '../Flex';\nimport Popover from '../Popover';\nimport { sameWidth } from '../Popover/modifiers';\nimport Menu from '../Menu';\nimport type { MenuItemProps } from '../Menu';\nimport Link from '../Link';\nimport type { LinkProps } from '../Link';\nimport Text from '../Text';\nimport { createStringMatcher, getFocusables, createClassName } from '../../utils';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport Tooltip from '../Tooltip';\nimport { ThemeOverride } from '../Configuration';\n\nimport {\n StyledClearButton,\n StyledResultsPopover,\n StyledSearchButton,\n StyledSearchInput,\n StyledSearchMenu,\n StyledSearchResultsContainer,\n StyledSearchTextInput,\n StyledSearchFiltersButton,\n StyledSearchIcon\n} from './SearchInput.styles';\n\nregisterIcon(searchIcon, timesIcon);\n\nexport type SearchResult = Pick<MenuItemProps, 'id' | 'primary' | 'secondary' | 'href' | 'onClick'>;\n\nexport type RecentSearch = Pick<MenuItemProps, 'id' | 'primary' | 'href' | 'onClick'>;\n\nexport type SearchFilter =\n | {\n /** A list of user selectable scopes to filter search with. */\n filters: string[];\n /** The default filter for uncontrolled use. */\n defaultFilter?: string;\n currentFilter?: never;\n }\n | {\n /** A list of user selectable scopes to filter search with. */\n filters: string[];\n defaultFilter?: never;\n /** The current filter for controlled use. */\n currentFilter?: string;\n }\n | {\n filters?: never;\n defaultFilter?: never;\n currentFilter?: never;\n };\n\nexport type SearchInputProps = NoChildrenProp &\n BaseProps & {\n placeholder?: FormControlProps['placeholder'];\n /**\n * Creates a controlled input and sets the value. Requires an onChange handler to update value.\n * value + onChange is the recommended method per React team.\n */\n value?: FormControlProps['value'];\n /** Called when the SearchInput value changes. */\n onSearchChange?: (value: string) => void;\n /**\n * Called when the SearchButton is clicked or when the Enter key is pressed while SearchInput is in focus.\n * NOTE: this does not trigger an actual form submit event. It simply represents an explicit action by the user to search as opposed to onSearchChange.\n */\n onSearchSubmit?: (value: string) => void;\n /** Called when user changes scope filter. */\n onFilterChange?: (value: string) => void;\n /** Called when user presses a key. */\n onKeyDown?: KeyboardEventHandler<HTMLInputElement>;\n /** A list of matching results presented in the input's dropdown menu. */\n searchResults?: SearchResult[];\n /** A list of recent searches presented in the input's dropdown menu. */\n recentSearches?: RecentSearch[];\n /** Places the menu into an indeterminate loading state. */\n loading?: boolean;\n /** Prop passed to the advanced search page link. */\n advancedSearchLink?: OmitStrict<LinkProps, 'children'>;\n /** Aria label for search input, used by screen readers. */\n searchInputAriaLabel?: string;\n /**\n * Boolean for determining for whether the search results will render in a popover.\n * @default true\n */\n resultsPopover?: boolean;\n } & SearchFilter;\n\nconst SearchInput: FunctionComponent<SearchInputProps & ForwardProps> = forwardRef(\n function SearchInput(props: PropsWithoutRef<SearchInputProps>, ref: Ref<HTMLInputElement>) {\n const t = useI18n();\n\n const {\n value = '',\n defaultFilter,\n currentFilter,\n filters,\n onFilterChange,\n searchResults,\n recentSearches,\n loading: loadingProp,\n advancedSearchLink,\n onSearchChange,\n onSearchSubmit,\n onKeyDown: onKeyDownProp,\n searchInputAriaLabel = t('search'),\n resultsPopover = true,\n className,\n ...restProps\n } = props;\n\n const id = useUID();\n const listId = useUID();\n const instructionTextId = useUID();\n const { announcePolite } = useLiveLog();\n const bodyRef = useRef<Element>(document.body);\n const inputRef = useConsolidatedRef(ref);\n const filtersRef = useRef<HTMLDivElement>(null);\n const searchResultsRef = useRef<HTMLDivElement>(null);\n const theme = useTheme();\n\n const [searchMenuOpen, setSearchMenuOpen] = useState(false);\n const [searchResultItems, setSearchResultItems] = useState<MenuItemProps[] | undefined>(\n undefined\n );\n const [selectedFilter, setSelectedFilter] = useState(defaultFilter ?? t('all'));\n const [downPressed, setDownPressed] = useState(false);\n\n const completeFilters = [t('all'), ...(filters ?? [])];\n const hasFilters = completeFilters.length > 1;\n const hasSearchResults = !!(searchResults && searchResults.length);\n const hasRecentSearches = !!(recentSearches && recentSearches.length);\n const showSearchMenu = (value || recentSearches?.length) && (searchResultItems || loadingProp);\n const useRecents = hasRecentSearches && !value;\n const loading = useRecents ? false : !!loadingProp;\n const searchMenuVisible =\n (resultsPopover && showSearchMenu && searchMenuOpen) || (!resultsPopover && showSearchMenu);\n\n const handleEscape = useCallback(\n (e: KeyboardEvent) => {\n if (searchMenuOpen) {\n e.preventDefault();\n e.stopPropagation();\n setSearchMenuOpen(false);\n setDownPressed(false);\n }\n },\n [searchMenuOpen]\n );\n\n useEscape(handleEscape, inputRef, [handleEscape]);\n\n const onKeyDown = useCallback(\n (e: ReactKeyboardEvent<HTMLInputElement>) => {\n onKeyDownProp?.(e);\n\n switch (e.key) {\n case 'Enter':\n if (!downPressed) {\n onSearchSubmit?.(value);\n }\n break;\n case 'ArrowDown':\n setDownPressed(true);\n setSearchMenuOpen(true);\n break;\n case 'Tab': {\n const forward = !e.shiftKey;\n\n if (forward) {\n const popoverFocusables = getFocusables(searchResultsRef);\n\n if (popoverFocusables.length) {\n e.preventDefault();\n popoverFocusables[0].focus();\n }\n }\n break;\n }\n default:\n break;\n }\n },\n [onSearchSubmit, downPressed, value]\n );\n\n useOuterEvent('click', [searchResultsRef, inputRef, filtersRef], () => {\n setSearchMenuOpen(false);\n });\n\n useEffect(() => {\n setDownPressed(false);\n }, [value]);\n\n useEffect(() => {\n let items: MenuItemProps[] | undefined = [];\n if (hasSearchResults && value) {\n items = searchResults;\n } else if (useRecents) {\n items = recentSearches;\n } else if (!searchResults && (!recentSearches || recentSearches.length === 0)) {\n items = undefined;\n }\n setSearchResultItems(items);\n }, [searchResults, recentSearches, searchMenuOpen, hasSearchResults, hasRecentSearches, value]);\n\n // Announce results\n useEffect(() => {\n if (!searchMenuVisible || loading) return;\n\n const timeout = setTimeout(() => {\n announcePolite({\n message: t(\n useRecents ? 'recent_results_count' : 'results_count',\n [searchResultItems?.length ?? 0],\n {\n count: searchResultItems?.length ?? 0\n }\n ),\n type: 'status'\n });\n }, 1000);\n\n return () => {\n clearTimeout(timeout);\n };\n }, [loading, searchMenuVisible, searchResultItems]);\n\n const searchMenu = (\n <Menu\n as={StyledSearchMenu}\n listId={listId}\n role='listbox'\n header={\n recentSearches && !value ? (\n <Text variant='secondary'>{t('recent_searches')}</Text>\n ) : undefined\n }\n mode='action'\n items={searchResultItems ?? []}\n loading={loading}\n footer={\n advancedSearchLink ? (\n <Link {...advancedSearchLink}>{t('advanced_search')}</Link>\n ) : undefined\n }\n accent={hasSearchResults ? createStringMatcher(value, undefined, 'gi') : undefined}\n focusControlEl={inputRef.current || undefined}\n pauseDescendantEvaluation={!downPressed}\n aria-label={searchInputAriaLabel || t('search')}\n />\n );\n\n const focus = useFocusWithin([inputRef, searchResultsRef], focused => {\n if (!focused) {\n setDownPressed(false);\n setSearchMenuOpen(false);\n }\n });\n\n useEffect(() => {\n if (focus) {\n setSearchMenuOpen(true);\n }\n }, [focus]);\n\n useEffect(() => {\n if (currentFilter) setSelectedFilter(currentFilter);\n }, [currentFilter]);\n\n return (\n <>\n <Flex\n container\n as={StyledSearchInput}\n hasFilters={hasFilters}\n showSubmit={!!onSearchSubmit}\n className={createClassName('search-input', className, { loading: !!loadingProp })}\n >\n {hasFilters && (\n <>\n <ThemeOverride\n theme={{\n components: {\n button: {\n 'secondary-color': theme.base.palette['foreground-color'],\n 'secondary-fill-style': 'outline'\n }\n }\n }}\n >\n <StyledSearchFiltersButton\n ref={filtersRef}\n text={selectedFilter}\n variant='secondary'\n aria-label={t('search_in_noun', [selectedFilter])}\n menu={{\n mode: 'single-select',\n items: completeFilters.map(filter => ({\n primary: filter,\n id: filter,\n selected: selectedFilter === filter,\n onClick: () => {\n setSelectedFilter(filter);\n onFilterChange?.(filter);\n inputRef.current?.focus();\n }\n }))\n }}\n showSubmit={!!onSearchSubmit}\n />\n </ThemeOverride>\n <Tooltip target={filtersRef.current} hideDelay='none' showDelay='none'>\n {t('search_in')}\n </Tooltip>\n </>\n )}\n\n {!onSearchSubmit && !hasFilters && <StyledSearchIcon name='search' />}\n\n <StyledSearchTextInput\n id={id}\n ref={inputRef}\n aria-label={searchInputAriaLabel}\n {...restProps}\n type='search'\n aria-autocomplete='list'\n aria-controls={!!showSearchMenu && resultsPopover ? listId : undefined}\n aria-haspopup='listbox'\n aria-describedby={searchMenuVisible ? instructionTextId : undefined}\n value={value}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n onSearchChange?.(e.target.value);\n if (e.target.value) setSearchMenuOpen(true);\n }}\n onKeyDown={onKeyDown}\n autoComplete='off'\n />\n\n {value && (\n <StyledClearButton\n icon\n onClick={() => {\n onSearchChange?.('');\n inputRef.current?.focus();\n }}\n variant='simple'\n compact\n label={t('clear')}\n showSubmit={!!onSearchSubmit}\n >\n <Icon name='times' />\n </StyledClearButton>\n )}\n\n {!onSearchSubmit && hasFilters && <StyledSearchIcon name='search' />}\n\n {onSearchSubmit && (\n <StyledSearchButton\n onClick={() => {\n onSearchSubmit?.(value);\n }}\n icon\n label={t('search')}\n variant='simple'\n >\n <Icon name='search' />\n </StyledSearchButton>\n )}\n </Flex>\n\n {showSearchMenu && resultsPopover && (\n <Popover\n as={StyledResultsPopover}\n target={inputRef.current}\n show={searchMenuOpen}\n placement='bottom-start'\n modifiers={[sameWidth]}\n onKeyDown={(e: KeyboardEvent) => {\n if (!inputRef.current) return;\n\n if (e.key === 'Tab') {\n const popoverFocusables = getFocusables(searchResultsRef);\n const currentIndex = popoverFocusables.indexOf(e.target as HTMLElement);\n const forward = !e.shiftKey;\n const isLast = currentIndex === popoverFocusables.length - 1;\n\n if (forward && isLast) {\n e.preventDefault();\n const allFocusable = getFocusables(bodyRef as MutableRefObject<HTMLElement>);\n const nextIndex = allFocusable.indexOf(inputRef.current) + 1;\n\n allFocusable[nextIndex]?.focus();\n setDownPressed(false);\n setSearchMenuOpen(false);\n } else if (!forward && currentIndex === 0) {\n e.preventDefault();\n inputRef.current.focus();\n }\n }\n if (e.key === 'Escape') {\n handleEscape(e);\n inputRef.current.focus();\n }\n }}\n ref={searchResultsRef}\n >\n {searchMenu}\n </Popover>\n )}\n\n {!resultsPopover && showSearchMenu && (\n <StyledSearchResultsContainer>{searchMenu}</StyledSearchResultsContainer>\n )}\n\n <VisuallyHiddenText id={instructionTextId}>\n {`${t('search_instructions')} `}\n </VisuallyHiddenText>\n </>\n );\n }\n);\n\nexport default SearchInput;\n"]}
|
|
1
|
+
{"version":3,"file":"SearchInput.js","sourceRoot":"","sources":["../../../src/components/SearchInput/SearchInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useState, useCallback, useEffect, useRef } from 'react';\nimport type {\n FunctionComponent,\n PropsWithoutRef,\n Ref,\n ChangeEvent,\n KeyboardEvent as ReactKeyboardEvent,\n MutableRefObject,\n KeyboardEventHandler\n} from 'react';\n\nimport type { BaseProps, ForwardProps, NoChildrenProp, OmitStrict } from '../../types';\nimport Icon, { registerIcon } from '../Icon';\nimport * as searchIcon from '../Icon/icons/search.icon';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport type { FormControlProps } from '../FormControl';\nimport {\n useConsolidatedRef,\n useEscape,\n useI18n,\n useOuterEvent,\n useLiveLog,\n useUID,\n useFocusWithin,\n useTheme\n} from '../../hooks';\nimport Flex from '../Flex';\nimport Popover from '../Popover';\nimport { sameWidth } from '../Popover/modifiers';\nimport Menu from '../Menu';\nimport type { MenuItemProps } from '../Menu';\nimport Link from '../Link';\nimport type { LinkProps } from '../Link';\nimport Text from '../Text';\nimport { createStringMatcher, getFocusables, createClassName } from '../../utils';\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport Tooltip from '../Tooltip';\nimport { ThemeOverride } from '../Configuration';\n\nimport {\n StyledClearButton,\n StyledResultsPopover,\n StyledSearchButton,\n StyledSearchInput,\n StyledSearchMenu,\n StyledSearchResultsContainer,\n StyledSearchTextInput,\n StyledSearchFiltersButton,\n StyledSearchIcon\n} from './SearchInput.styles';\n\nregisterIcon(searchIcon, timesIcon);\n\nexport type SearchResult = Pick<MenuItemProps, 'id' | 'primary' | 'secondary' | 'href' | 'onClick'>;\n\nexport type RecentSearch = Pick<MenuItemProps, 'id' | 'primary' | 'href' | 'onClick'>;\n\nexport type SearchFilter =\n | {\n /** A list of user selectable scopes to filter search with. */\n filters: string[];\n /** The default filter for uncontrolled use. */\n defaultFilter?: string;\n currentFilter?: never;\n }\n | {\n /** A list of user selectable scopes to filter search with. */\n filters: string[];\n defaultFilter?: never;\n /** The current filter for controlled use. */\n currentFilter?: string;\n }\n | {\n filters?: never;\n defaultFilter?: never;\n currentFilter?: never;\n };\n\nexport type SearchInputProps = NoChildrenProp &\n BaseProps & {\n placeholder?: FormControlProps['placeholder'];\n /**\n * Creates a controlled input and sets the value. Requires an onChange handler to update value.\n * value + onChange is the recommended method per React team.\n */\n value?: FormControlProps['value'];\n /** Called when the SearchInput value changes. */\n onSearchChange?: (value: string) => void;\n /**\n * Called when the SearchButton is clicked or when the Enter key is pressed while SearchInput is in focus.\n * NOTE: this does not trigger an actual form submit event. It simply represents an explicit action by the user to search as opposed to onSearchChange.\n */\n onSearchSubmit?: (value: string) => void;\n /** Called when user changes scope filter. */\n onFilterChange?: (value: string) => void;\n /** Called when user presses a key. */\n onKeyDown?: KeyboardEventHandler<HTMLInputElement>;\n /** A list of matching results presented in the input's dropdown menu. */\n searchResults?: SearchResult[];\n /** A list of recent searches presented in the input's dropdown menu. */\n recentSearches?: RecentSearch[];\n /** Places the menu into an indeterminate loading state. */\n loading?: boolean;\n /** Prop passed to the advanced search page link. */\n advancedSearchLink?: OmitStrict<LinkProps, 'children'>;\n /** Aria label for search input, used by screen readers. */\n searchInputAriaLabel?: string;\n /**\n * Boolean for determining for whether the search results will render in a popover.\n * @default true\n */\n resultsPopover?: boolean;\n } & SearchFilter;\n\nconst SearchInput: FunctionComponent<SearchInputProps & ForwardProps> = forwardRef(\n function SearchInput(props: PropsWithoutRef<SearchInputProps>, ref: Ref<HTMLInputElement>) {\n const t = useI18n();\n\n const {\n value = '',\n defaultFilter,\n currentFilter,\n filters,\n onFilterChange,\n searchResults,\n recentSearches,\n loading: loadingProp,\n advancedSearchLink,\n onSearchChange,\n onSearchSubmit,\n onKeyDown: onKeyDownProp,\n searchInputAriaLabel = t('search'),\n resultsPopover = true,\n className,\n ...restProps\n } = props;\n\n const id = useUID();\n const listId = useUID();\n const instructionTextId = useUID();\n const { announcePolite } = useLiveLog();\n const bodyRef = useRef<Element>(document.body);\n const inputRef = useConsolidatedRef(ref);\n const filtersRef = useRef<HTMLDivElement>(null);\n const searchResultsRef = useRef<HTMLDivElement>(null);\n const theme = useTheme();\n\n const [searchMenuOpen, setSearchMenuOpen] = useState(false);\n const [searchResultItems, setSearchResultItems] = useState<MenuItemProps[] | undefined>(\n undefined\n );\n const [downPressed, setDownPressed] = useState(false);\n const [selectedFilter, setSelectedFilter] = useState(\n currentFilter ?? defaultFilter ?? t('all')\n );\n\n const completeFilters = [t('all'), ...(filters ?? [])];\n const hasFilters = completeFilters.length > 1;\n const hasSearchResults = !!(searchResults && searchResults.length);\n const hasRecentSearches = !!(recentSearches && recentSearches.length);\n const showSearchMenu = (value || recentSearches?.length) && (searchResultItems || loadingProp);\n const useRecents = hasRecentSearches && !value;\n const loading = useRecents ? false : !!loadingProp;\n const searchMenuVisible =\n (resultsPopover && showSearchMenu && searchMenuOpen) || (!resultsPopover && showSearchMenu);\n\n const handleEscape = useCallback(\n (e: KeyboardEvent) => {\n if (searchMenuOpen) {\n e.preventDefault();\n e.stopPropagation();\n setSearchMenuOpen(false);\n setDownPressed(false);\n }\n },\n [searchMenuOpen]\n );\n\n useEscape(handleEscape, inputRef, [handleEscape]);\n\n const onKeyDown = useCallback(\n (e: ReactKeyboardEvent<HTMLInputElement>) => {\n onKeyDownProp?.(e);\n\n switch (e.key) {\n case 'Enter':\n if (!downPressed) {\n onSearchSubmit?.(value);\n }\n break;\n case 'ArrowDown':\n setDownPressed(true);\n setSearchMenuOpen(true);\n break;\n case 'Tab': {\n const forward = !e.shiftKey;\n\n if (forward) {\n const popoverFocusables = getFocusables(searchResultsRef);\n\n if (popoverFocusables.length) {\n e.preventDefault();\n popoverFocusables[0].focus();\n }\n }\n break;\n }\n default:\n break;\n }\n },\n [onSearchSubmit, downPressed, value]\n );\n\n useOuterEvent('click', [searchResultsRef, inputRef, filtersRef], () => {\n setSearchMenuOpen(false);\n });\n\n useEffect(() => {\n setDownPressed(false);\n }, [value]);\n\n useEffect(() => {\n let items: MenuItemProps[] | undefined = [];\n if (hasSearchResults && value) {\n items = searchResults;\n } else if (useRecents) {\n items = recentSearches;\n } else if (!searchResults && (!recentSearches || recentSearches.length === 0)) {\n items = undefined;\n }\n setSearchResultItems(items);\n }, [searchResults, recentSearches, searchMenuOpen, hasSearchResults, hasRecentSearches, value]);\n\n // Announce results\n useEffect(() => {\n if (!searchMenuVisible || loading) return;\n\n const timeout = setTimeout(() => {\n announcePolite({\n message: t(\n useRecents ? 'recent_results_count' : 'results_count',\n [searchResultItems?.length ?? 0],\n {\n count: searchResultItems?.length ?? 0\n }\n ),\n type: 'status'\n });\n }, 1000);\n\n return () => {\n clearTimeout(timeout);\n };\n }, [loading, searchMenuVisible, searchResultItems]);\n\n const searchMenu = (\n <Menu\n as={StyledSearchMenu}\n listId={listId}\n role='listbox'\n header={\n recentSearches && !value ? (\n <Text variant='secondary'>{t('recent_searches')}</Text>\n ) : undefined\n }\n mode='action'\n items={searchResultItems ?? []}\n loading={loading}\n footer={\n advancedSearchLink ? (\n <Link {...advancedSearchLink}>{t('advanced_search')}</Link>\n ) : undefined\n }\n accent={hasSearchResults ? createStringMatcher(value, undefined, 'gi') : undefined}\n focusControlEl={inputRef.current || undefined}\n pauseDescendantEvaluation={!downPressed}\n aria-label={searchInputAriaLabel || t('search')}\n />\n );\n\n const focus = useFocusWithin([inputRef, searchResultsRef], focused => {\n if (!focused) {\n setDownPressed(false);\n setSearchMenuOpen(false);\n }\n });\n\n useEffect(() => {\n if (focus) {\n setSearchMenuOpen(true);\n }\n }, [focus]);\n\n useEffect(() => {\n if (currentFilter !== undefined) {\n setSelectedFilter(currentFilter);\n }\n }, [currentFilter]);\n\n return (\n <>\n <Flex\n container\n as={StyledSearchInput}\n hasFilters={hasFilters}\n showSubmit={!!onSearchSubmit}\n className={createClassName('search-input', className, { loading: !!loadingProp })}\n >\n {hasFilters && (\n <>\n <ThemeOverride\n theme={{\n components: {\n button: {\n 'secondary-color': theme.base.palette['foreground-color'],\n 'secondary-fill-style': 'outline'\n }\n }\n }}\n >\n <StyledSearchFiltersButton\n ref={filtersRef}\n text={selectedFilter}\n variant='secondary'\n aria-label={t('search_in_noun', [selectedFilter])}\n menu={{\n mode: 'single-select',\n items: completeFilters.map(filter => ({\n primary: filter,\n id: filter,\n selected: selectedFilter === filter,\n onClick: () => {\n setSelectedFilter(filter);\n onFilterChange?.(filter);\n inputRef.current?.focus();\n }\n }))\n }}\n showSubmit={!!onSearchSubmit}\n />\n </ThemeOverride>\n <Tooltip target={filtersRef.current} hideDelay='none' showDelay='none'>\n {t('search_in')}\n </Tooltip>\n </>\n )}\n\n {!onSearchSubmit && !hasFilters && <StyledSearchIcon name='search' />}\n\n <StyledSearchTextInput\n id={id}\n ref={inputRef}\n aria-label={searchInputAriaLabel}\n {...restProps}\n type='search'\n aria-autocomplete='list'\n aria-controls={!!showSearchMenu && resultsPopover ? listId : undefined}\n aria-haspopup='listbox'\n aria-describedby={searchMenuVisible ? instructionTextId : undefined}\n value={value}\n onChange={(e: ChangeEvent<HTMLInputElement>) => {\n onSearchChange?.(e.target.value);\n if (e.target.value) setSearchMenuOpen(true);\n }}\n onKeyDown={onKeyDown}\n autoComplete='off'\n />\n\n {value && (\n <StyledClearButton\n icon\n onClick={() => {\n onSearchChange?.('');\n inputRef.current?.focus();\n }}\n variant='simple'\n compact\n label={t('clear')}\n showSubmit={!!onSearchSubmit}\n >\n <Icon name='times' />\n </StyledClearButton>\n )}\n\n {!onSearchSubmit && hasFilters && <StyledSearchIcon name='search' />}\n\n {onSearchSubmit && (\n <StyledSearchButton\n onClick={() => {\n onSearchSubmit?.(value);\n }}\n icon\n label={t('search')}\n variant='simple'\n >\n <Icon name='search' />\n </StyledSearchButton>\n )}\n </Flex>\n\n {showSearchMenu && resultsPopover && (\n <Popover\n as={StyledResultsPopover}\n target={inputRef.current}\n show={searchMenuOpen}\n placement='bottom-start'\n modifiers={[sameWidth]}\n onKeyDown={(e: KeyboardEvent) => {\n if (!inputRef.current) return;\n\n if (e.key === 'Tab') {\n const popoverFocusables = getFocusables(searchResultsRef);\n const currentIndex = popoverFocusables.indexOf(e.target as HTMLElement);\n const forward = !e.shiftKey;\n const isLast = currentIndex === popoverFocusables.length - 1;\n\n if (forward && isLast) {\n e.preventDefault();\n const allFocusable = getFocusables(bodyRef as MutableRefObject<HTMLElement>);\n const nextIndex = allFocusable.indexOf(inputRef.current) + 1;\n\n allFocusable[nextIndex]?.focus();\n setDownPressed(false);\n setSearchMenuOpen(false);\n } else if (!forward && currentIndex === 0) {\n e.preventDefault();\n inputRef.current.focus();\n }\n }\n if (e.key === 'Escape') {\n handleEscape(e);\n inputRef.current.focus();\n }\n }}\n ref={searchResultsRef}\n >\n {searchMenu}\n </Popover>\n )}\n\n {!resultsPopover && showSearchMenu && (\n <StyledSearchResultsContainer>{searchMenu}</StyledSearchResultsContainer>\n )}\n\n <VisuallyHiddenText id={instructionTextId}>\n {`${t('search_instructions')} `}\n </VisuallyHiddenText>\n </>\n );\n }\n);\n\nexport default SearchInput;\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pega/cosmos-react-core",
|
|
3
|
-
"version": "8.21.
|
|
3
|
+
"version": "8.21.1",
|
|
4
4
|
"description": "Cosmos is a visual design system and UI component collection. Its goal is to empower application developers in their pursuit to create engaging and rewarding user experiences.",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE",
|
|
6
6
|
"author": "Pegasystems",
|