@redsift/design-system 12.6.6-alpha.2 → 13.0.0
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/CONTRIBUTING.md +20 -8
- package/_internal/AppContainer.js +1 -1
- package/_internal/AppContainer.js.map +1 -1
- package/_internal/Button2.js +1 -1
- package/_internal/Button2.js.map +1 -1
- package/_internal/Checkbox2.js +8 -3
- package/_internal/Checkbox2.js.map +1 -1
- package/_internal/DetailedCard.js +17 -1352
- package/_internal/DetailedCard.js.map +1 -1
- package/_internal/DetailedCardCollapsibleSectionItems.js +14 -4
- package/_internal/DetailedCardCollapsibleSectionItems.js.map +1 -1
- package/_internal/DetailedCardSection.js +4 -2
- package/_internal/DetailedCardSection.js.map +1 -1
- package/_internal/IconButton.js +1 -1
- package/_internal/IconButton.js.map +1 -1
- package/_internal/Item2.js +2 -2
- package/_internal/Item2.js.map +1 -1
- package/_internal/LinkButton.js +1 -1
- package/_internal/LinkButton.js.map +1 -1
- package/_internal/Listbox2.js +5 -5
- package/_internal/Listbox2.js.map +1 -1
- package/_internal/NumberField.js +2 -0
- package/_internal/NumberField.js.map +1 -1
- package/_internal/Radio2.js +14 -7
- package/_internal/Radio2.js.map +1 -1
- package/_internal/RadioGroup.js +6 -1
- package/_internal/RadioGroup.js.map +1 -1
- package/_internal/SideNavigationMenu.js +9 -4
- package/_internal/SideNavigationMenu.js.map +1 -1
- package/_internal/SideNavigationMenuItem.js +2 -2
- package/_internal/SideNavigationMenuItem.js.map +1 -1
- package/_internal/Switch2.js +8 -3
- package/_internal/Switch2.js.map +1 -1
- package/_internal/Tabs2.js.map +1 -1
- package/_internal/TextArea.js +5 -1
- package/_internal/TextArea.js.map +1 -1
- package/_internal/TextField.js +5 -1
- package/_internal/TextField.js.map +1 -1
- package/_internal/context.js.map +1 -1
- package/_internal/filterComponents.js +3 -0
- package/_internal/filterComponents.js.map +1 -1
- package/_internal/getElementRef.js +25 -0
- package/_internal/getElementRef.js.map +1 -0
- package/_internal/getTextWidth.js +32 -0
- package/_internal/getTextWidth.js.map +1 -0
- package/_internal/isComponent.js +3 -0
- package/_internal/isComponent.js.map +1 -1
- package/_internal/reactVersion.js +14 -0
- package/_internal/reactVersion.js.map +1 -0
- package/_internal/styles4.js +72 -72
- package/_internal/styles4.js.map +1 -1
- package/_internal/types.js.map +1 -1
- package/_internal/useFocusOnListItem.js +1 -1
- package/_internal/useFocusOnListItem.js.map +1 -1
- package/_internal/useId.js +1 -1
- package/_internal/useId.js.map +1 -1
- package/_internal/useListboxItem.js.map +1 -1
- package/_internal/useSideNavigationMenuBar.js +2 -2
- package/_internal/useSideNavigationMenuBar.js.map +1 -1
- package/_internal/warnIfNoAccessibleLabelFound.js.map +1 -1
- package/index.d.ts +48 -24
- package/index.js +3 -31
- package/index.js.map +1 -1
- package/package.json +18 -26
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextArea.js","sources":["../../src/hooks/useComputeNumberOfRows.ts","../../src/components/text-area/types.ts","../../src/components/text-area/styles.ts","../../src/components/text-area/TextArea.tsx"],"sourcesContent":["import { useState } from 'react';\n\n/**\n * Hook that allows to calculate the number of rows needed for a text area.\n * @param minimumRows Minimum number of rows that we want to display.\n * @return rows to be used and a callback to recalculate\n */\nexport const useComputeNumberOfRows = (\n minimumRows: number\n): {\n /** number of rows to be used on the text area */\n rows: number;\n /**\n * Callback in order to recalculate the number of rows due to a change on the text area\n */\n recomputeNumberOfRows(target: Element): void;\n} => {\n const [rows, setRows] = useState(minimumRows);\n\n const recompute = (target: Element) => {\n /**\n * HEAD's UP! This part is a little bit tricky. The idea here is to only\n * display the necessary rows on the textarea. In order to dynamically adjust\n * the height on that field, we need to:\n * 1. Set the current amount of rows to the minimum. That will make the scroll appear.\n * 2. With that, we will have the `scrollHeight`, meaning the height of the container adjusted to the current content\n * 3. With the scroll height, we can figure out how many rows we need to use by dividing the scroll height\n * by the line height.\n * 4. With that number, we can readjust the number of rows on the text area. We need to do that here, if we leave that to\n * the state change through React, there are some scenarios (resize, hitting ENTER or BACKSPACE which add or remove lines)\n * when we will not see the update and the rows will be resized to the minimum.\n * 5. In case there is any other update on the component that changes the UI, we need to keep the number of rows\n * on the state in order to allow React to re-render. Therefore, we save them using `useState`\n */\n // eslint-disable-next-line no-param-reassign\n (target as HTMLTextAreaElement).rows = minimumRows;\n let currentRows = target.scrollHeight / (target.clientHeight / minimumRows);\n currentRows = currentRows >= minimumRows ? currentRows : minimumRows;\n // eslint-disable-next-line no-param-reassign\n (target as HTMLTextAreaElement).rows = currentRows;\n\n setRows(currentRows);\n };\n\n return {\n recomputeNumberOfRows: recompute,\n rows,\n };\n};\n","import { ChangeEvent, ComponentProps, MutableRefObject } from 'react';\nimport { ValueOf } from '../../types';\nimport { StyledTextFieldProps, TextFieldProps } from '../text-field';\n\n/**\n * Component variant.\n */\nexport const TextAreaVariant = {\n default: 'default',\n underline: 'underline',\n} as const;\nexport type TextAreaVariant = ValueOf<typeof TextAreaVariant>;\n\n/**\n * Component props.\n */\nexport interface TextAreaProps\n extends Omit<\n TextFieldProps,\n 'onChange' | 'inputRef' | 'inputProps' | 'pills' | 'internal' | 'hasClearButton' | 'onClear'\n > {\n /** Custom ref object to pass to the textarea element. */\n textareaRef?: MutableRefObject<HTMLTextAreaElement>;\n /** Custom props to pass to the textarea element. */\n textareaProps?: ComponentProps<'textarea'>;\n /** Method to handle component change. */\n onChange?(value?: string, name?: string, event?: ChangeEvent<HTMLTextAreaElement>): void;\n /** Minimum number of rows displayed in multiline mode (requires `multiline` to be enabled). */\n minimumRows?: number;\n}\n\nexport type StyledTextAreaProps = StyledTextFieldProps;\n","import styled, { css } from 'styled-components';\nimport { baseStyling } from '../shared';\nimport { StyledTextAreaProps, TextAreaVariant } from './types';\nimport { StyledHighlightOverlayProps } from '../text-field/types';\nimport { Theme, NotificationsColorPalette } from '../../types';\n\n/**\n * Component style.\n */\nexport const StyledTextArea = styled.div<StyledTextAreaProps>`\n height: fit-content;\n position: relative;\n width: fit-content;\n margin: 0;\n min-width: 0;\n padding: 0;\n ${baseStyling}\n\n border: 0;\n display: inline-flex;\n flex-direction: column;\n vertical-align: top;\n\n ${({\n $label,\n $hasLeftIcon,\n $hasContent,\n $hasHighlightOverlay,\n $isFocused,\n $isDisabled,\n $isInvalid,\n $color,\n $isGradient,\n $theme,\n $variant,\n }) => css`\n ${$isDisabled\n ? css`\n pointer-events: none;\n `\n : ''}\n\n .redsift-text-area__label {\n font-family: var(--redsift-typography-input-text-font-family);\n font-size: var(--redsift-typography-input-text-font-size);\n font-weight: var(--redsift-typography-input-text-font-weight);\n line-height: var(--redsift-typography-input-text-line-height);\n left: ${$hasLeftIcon && !$hasContent ? '32px' : '0'};\n overflow: hidden;\n pointer-events: none;\n position: absolute;\n text-overflow: ellipsis;\n top: ${$hasContent ? '-8px' : '-6px'};\n transform-origin: top left;\n transition: color 200ms cubic-bezier(0, 0, 0.2, 1) 0ms, transform 200ms cubic-bezier(0, 0, 0.2, 1) 0ms,\n max-width 200ms cubic-bezier(0, 0, 0.2, 1) 0ms;\n white-space: nowrap;\n z-index: 1;\n\n ${!$hasContent\n ? css`\n max-width: calc(100% - 24px);\n transform: translate(${$variant === TextAreaVariant.underline ? '0px' : '14px'}, 16px) scale(1);\n `\n : css`\n max-width: calc(133% - 32px);\n transform: translate(${$variant === TextAreaVariant.underline ? '0px' : '14px'}, 1px) scale(0.733);\n `}\n\n ${!$isGradient\n ? css`\n color: var(\n --redsift-color-${$theme}-components-buttons-secondary-button-${$isInvalid\n ? 'error'\n : $isFocused\n ? $color\n : 'grey'}-text-${$isDisabled ? 'disabled' : 'default'}\n );\n `\n : css`\n background-color: var(--redsift-color-neutral-${$theme === Theme.dark ? 'x-dark-grey' : 'white'});\n ${$variant !== TextAreaVariant.underline\n ? css`\n padding-right: 7px;\n padding-left: 5px;\n `\n : ''}\n > span {\n background: var(\n --redsift-color-${$theme}-components-buttons-secondary-button-${$isInvalid\n ? 'error'\n : $isFocused\n ? $color\n : 'grey'}-text-${$isDisabled ? 'disabled' : 'default'}\n );\n background-clip: text;\n color: transparent;\n }\n `}\n }\n\n .redsift-text-area__text-area-wrapper {\n align-items: flex-start;\n box-sizing: border-box;\n cursor: text;\n display: inline-flex;\n min-height: 42px;\n position: relative;\n width: 100%;\n }\n\n .redsift-text-area-text-area-wrapper__text-area {\n flex: 1 1 auto;\n padding-bottom: 9px;\n ${$variant !== TextAreaVariant.underline && !$hasLeftIcon\n ? css`\n padding-left: 16px;\n `\n : ''}\n padding-top: ${$label ? '10px' : '9px'};\n padding-right: 8px;\n }\n\n .redsift-text-area-text-area-wrapper-text-area__container {\n position: relative;\n width: 100%;\n\n textarea {\n background: transparent;\n display: block;\n border: none;\n outline: none;\n width: 100%;\n padding: 0;\n margin: 0;\n box-sizing: content-box;\n font-family: ${$hasHighlightOverlay\n ? 'var(--redsift-typography-font-family-inconsolata)'\n : 'var(--redsift-typography-input-text-font-family)'};\n font-size: 14px;\n font-weight: var(--redsift-typography-input-text-font-weight);\n line-height: var(--redsift-typography-input-text-line-height);\n resize: none;\n position: relative;\n z-index: 1;\n\n ${$isDisabled\n ? css`\n color: var(--redsift-color-neutral-light-grey);\n `\n : $hasHighlightOverlay\n ? css`\n color: transparent;\n caret-color: var(--redsift-color-neutral-${$theme === Theme.dark ? 'white' : 'x-dark-grey'});\n `\n : css`\n color: var(--redsift-color-neutral-${$theme === Theme.dark ? 'white' : 'x-dark-grey'});\n `}\n }\n }\n\n .redsift-text-area-text-area-wrapper__highlight-overlay {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n pointer-events: none;\n font-family: var(--redsift-typography-font-family-inconsolata);\n font-size: 14px;\n font-weight: var(--redsift-typography-input-text-font-weight);\n line-height: var(--redsift-typography-input-text-line-height);\n white-space: pre-wrap;\n word-wrap: break-word;\n overflow: hidden;\n color: var(--redsift-color-neutral-${$theme === Theme.dark ? 'white' : 'x-dark-grey'});\n\n /* Remove padding from marks to maintain exact character alignment with textarea */\n mark {\n padding: 0;\n }\n }\n\n .redsift-text-area-text-area-wrapper-pills-and-text-area__text-area::placeholder {\n color: var(--redsift-color-neutral-mid-grey);\n }\n\n .redsift-text-area-text-area-wrapper-pills-and-text-area__text-area:focus {\n outline: 0;\n }\n\n .redsift-text-area-text-area-wrapper__fieldset {\n border-style: solid;\n bottom: 0;\n left: 1px;\n margin: 0;\n min-width: 0%;\n overflow: hidden;\n padding: 0 8px;\n pointer-events: none;\n position: absolute;\n right: 0;\n text-align: left;\n top: -5px;\n\n ${!$isGradient || $isDisabled || !$isFocused || $isInvalid\n ? css`\n ${$variant === TextAreaVariant.underline\n ? css`\n border-bottom-width: 2px;\n `\n : css`\n border-radius: 4px;\n border-width: 2px;\n `}\n border-color: var(\n --redsift-color-${$theme}-components-buttons-secondary-button-${$isInvalid\n ? 'error'\n : $isFocused\n ? $color\n : 'grey'}-text-${$isDisabled ? 'disabled' : 'default'}\n );\n `\n : css`\n ${$variant === TextAreaVariant.underline\n ? css`\n border-bottom: 2px solid transparent;\n `\n : css`\n border: 2px solid transparent;\n border-radius: 4px;\n `}\n background: transparent;\n background-clip: padding-box, border-box;\n background-origin: border-box;\n background-image: linear-gradient(\n 90deg,\n var(--redsift-color-neutral-${$theme === Theme.dark ? 'x-dark-grey' : 'white'}),\n var(--redsift-color-neutral-${$theme === Theme.dark ? 'x-dark-grey' : 'white'})\n ),\n var(--redsift-color-${$theme}-components-buttons-secondary-button-${$color}-text-default);\n `}\n }\n\n .redsift-text-area-text-area-wrapper-fieldset__legend {\n display: block;\n float: unset;\n font-size: 11px;\n height: 11px;\n overflow: hidden;\n padding: 0;\n visibility: hidden;\n white-space: nowrap;\n width: auto;\n\n ${!$hasContent\n ? css`\n max-width: 0.01px;\n transition: max-width 50ms cubic-bezier(0, 0, 0.2, 1) 0ms;\n `\n : css`\n max-width: 100%;\n transition: max-width 100ms cubic-bezier(0, 0, 0.2, 1) 50ms;\n `}\n }\n\n .redsift-text-area-text-area-wrapper-fieldset__legend > span {\n display: inline-block;\n opacity: 0;\n padding-left: 5px;\n padding-right: 5px;\n visibility: visible;\n }\n\n .redsift-text-area-text-area-wrapper__toolbar {\n position: relative;\n top: 7px;\n }\n\n .redsift-icon-button {\n padding: 2px;\n height: 28px;\n width: 28px;\n }\n\n ${$variant !== TextAreaVariant.underline\n ? css`\n .redsift-icon.left {\n padding-left: 12px;\n padding-right: 8px;\n line-height: 28px;\n top: 10px;\n }\n\n .redsift-text-area-text-area-wrapper__toolbar {\n padding-right: 8px;\n }\n `\n : css`\n .redsift-icon.left {\n padding-right: 8px;\n top: 10px;\n }\n `}\n `}\n`;\n\n/**\n * Resolves background color from prop value.\n * Handles: boolean (true=warning), palette colors, and custom CSS values.\n */\nconst resolveBackgroundColor = (background: true | string): string => {\n if (background === true) {\n return 'var(--redsift-color-notifications-warning-primary)';\n }\n // Check if it's a notification palette color name\n const paletteColors = Object.values(NotificationsColorPalette);\n if (paletteColors.includes(background as NotificationsColorPalette)) {\n return `var(--redsift-color-notifications-${background}-primary)`;\n }\n // Assume it's a CSS color value (hex, rgb, etc.)\n return background;\n};\n\n/**\n * Styled marker for highlighted non-ASCII characters in TextArea.\n */\nexport const StyledHighlightMarker = styled.mark<StyledHighlightOverlayProps>`\n ${({ $font, $background, $hasInvisible }) => css`\n /* Reset the default <mark> styling */\n background: ${$background ? resolveBackgroundColor($background) : 'transparent'};\n color: inherit;\n border-radius: 2px;\n padding: 0 1px;\n position: relative;\n\n /* Use Inconsolata with bold weight to break kerning and reveal lookalike chars */\n ${$font &&\n css`\n font-family: var(--redsift-typography-font-family-inconsolata);\n font-weight: 700;\n `}\n\n /* Show a visual indicator for invisible/zero-width characters */\n ${$hasInvisible &&\n css`\n &::after {\n content: '•';\n position: absolute;\n bottom: 0;\n left: 50%;\n transform: translateX(-50%);\n color: var(--redsift-color-neutral-x-dark-grey);\n ${$background &&\n css`\n background-color: ${resolveBackgroundColor($background)};\n opacity: 0.8;\n `}\n border-radius: 2px;\n pointer-events: none;\n }\n `}\n `}\n`;\n","import React, {\n ComponentProps,\n FocusEvent,\n forwardRef,\n MutableRefObject,\n ReactNode,\n useCallback,\n useEffect,\n useState,\n} from 'react';\nimport classNames from 'classnames';\nimport { useFocusRing } from '../../react-aria/react-aria/focus';\nimport { useFocusWithin } from '../../react-aria/react-aria/interactions';\nimport { ButtonsColorPalette, Comp, getStylingTransientProps } from '../../types';\nimport { warnIfNoAccessibleLabelFound } from '../../utils/warnIfNoAccessibleLabelFound';\nimport {\n isNonAscii,\n containsInvisibleChars,\n normalizeHighlightOptions,\n NormalizedHighlightOptions,\n} from '../../utils/highlightNonAscii';\nimport { TextAreaProps, TextAreaVariant } from './types';\nimport { StyledTextArea, StyledHighlightMarker } from './styles';\nimport { Icon } from '../../components/icon';\nimport { useTheme } from '../theme';\nimport { useComputeNumberOfRows } from '../../hooks';\nimport { useId } from '../../utils';\nimport { Flexbox } from '../flexbox';\n\nconst COMPONENT_NAME = 'TextArea';\nconst CLASSNAME = 'redsift-text-area';\n\n/**\n * Processes a string and wraps consecutive non-ASCII characters in highlight markers.\n * Groups consecutive non-ASCII characters to minimize DOM nodes.\n * Invisible characters are NOT replaced (to maintain width alignment) but marked\n * with a $hasInvisible prop for CSS-based visual indication.\n */\nconst highlightNonAsciiChars = (text: string, options: NormalizedHighlightOptions): ReactNode[] => {\n const result: ReactNode[] = [];\n let currentAscii = '';\n let currentNonAscii = '';\n let keyIndex = 0;\n\n // Use Array.from to correctly handle Unicode surrogate pairs (e.g., emojis)\n const chars = Array.from(text);\n\n for (const char of chars) {\n if (isNonAscii(char)) {\n // Flush ASCII buffer\n if (currentAscii) {\n result.push(currentAscii);\n currentAscii = '';\n }\n currentNonAscii += char;\n } else {\n // Flush non-ASCII buffer\n if (currentNonAscii) {\n result.push(\n <StyledHighlightMarker\n key={keyIndex++}\n $font={options.font}\n $background={options.background}\n $hasInvisible={containsInvisibleChars(currentNonAscii)}\n >\n {currentNonAscii}\n </StyledHighlightMarker>\n );\n currentNonAscii = '';\n }\n currentAscii += char;\n }\n }\n\n // Flush remaining buffers\n if (currentAscii) {\n result.push(currentAscii);\n }\n if (currentNonAscii) {\n result.push(\n <StyledHighlightMarker\n key={keyIndex}\n $font={options.font}\n $background={options.background}\n $hasInvisible={containsInvisibleChars(currentNonAscii)}\n >\n {currentNonAscii}\n </StyledHighlightMarker>\n );\n }\n\n return result;\n};\n\n/**\n * TextArea allows users to enter multi-line text. Supports auto-growing height,\n * validation, and controlled/uncontrolled modes.\n *\n * @example\n * // Basic text area\n * <TextArea label=\"Description\" placeholder=\"Enter description...\" />\n *\n * @example\n * // Controlled with validation\n * <TextArea\n * label=\"Comments\"\n * value={comments}\n * onChange={setComments}\n * isInvalid={comments.length > 500}\n * isRequired\n * />\n *\n * @example\n * // Auto-growing with minimum rows\n * <TextArea label=\"Message\" minimumRows={3} />\n *\n * @example\n * // With icon and variant\n * <TextArea\n * label=\"Notes\"\n * variant=\"underline\"\n * leftIcon={{ icon: mdiNote }}\n * />\n */\nexport const TextArea: Comp<TextAreaProps, HTMLDivElement> = forwardRef((props, ref) => {\n const propsWithDefaults = {\n width: '100%' as const,\n ...props,\n };\n\n const { transientProps, otherProps } = getStylingTransientProps(propsWithDefaults);\n\n const {\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledby,\n after,\n autoFocus,\n className,\n color: propsColor,\n defaultValue = '',\n forceColor,\n highlightNonAscii,\n isColored = true,\n isDisabled,\n isInvalid,\n isReadOnly,\n isRequired,\n label,\n leftIcon,\n minimumRows,\n name,\n onBlur: onBlurProps,\n onChange,\n onFocus: onFocusProps,\n placeholder,\n textareaProps,\n textareaRef: propsTextareaRef,\n theme: propsTheme,\n value: propsValue,\n variant = TextAreaVariant.default,\n ...forwardedProps\n } = otherProps;\n\n const theme = useTheme(propsTheme);\n const color = Object.values(ButtonsColorPalette).includes(propsColor!) ? propsColor : isColored ? 'primary' : 'grey';\n const isGradient = color === ButtonsColorPalette.radar;\n\n const _textareaRef = React.useRef(null);\n const textareaRef = propsTextareaRef ?? _textareaRef;\n\n const {\n isFocusVisible,\n isFocused,\n focusProps: { onFocus, onBlur },\n } = useFocusRing({\n autoFocus,\n });\n const [isFocusWithin, setFocusWithin] = useState(Boolean(autoFocus));\n const { focusWithinProps } = useFocusWithin({\n onFocusWithinChange: (isFocusWithin) => setFocusWithin(isFocusWithin),\n });\n\n const [value, setValue] = useState(defaultValue);\n const isControlled = propsValue !== null && propsValue !== undefined;\n\n const [labelId] = useId();\n\n // Normalize highlight options - force font: false since the textarea uses Inconsolata directly\n const highlightOptions = highlightNonAscii ? { ...normalizeHighlightOptions(highlightNonAscii), font: false } : null;\n\n warnIfNoAccessibleLabelFound(props as ComponentProps<'label'>, [label], 'TextArea');\n\n const handleChange = useCallback(\n (event: React.ChangeEvent<HTMLTextAreaElement>) => {\n if (isDisabled || isReadOnly) {\n return;\n }\n\n if (onChange) {\n onChange(event.target.value, name, event);\n } else {\n setValue(event.target.value);\n }\n },\n [onChange]\n );\n\n const { rows, recomputeNumberOfRows } = useComputeNumberOfRows(minimumRows || 4);\n useEffect(() => {\n // Recompute the number of rows for the first rendering\n if (textareaRef && textareaRef.current) {\n recomputeNumberOfRows(textareaRef.current);\n }\n }, [textareaRef, recomputeNumberOfRows, value]);\n\n return (\n <StyledTextArea\n {...focusWithinProps}\n {...forwardedProps}\n {...transientProps}\n $label={label}\n $hasContent={isFocusWithin || Boolean(isControlled ? propsValue : value) || Boolean(placeholder)}\n $hasLeftIcon={Boolean(leftIcon)}\n $hasHighlightOverlay={Boolean(highlightNonAscii)}\n $color={color}\n $isGradient={isGradient}\n $isDisabled={isDisabled}\n $isFocusVisible={isFocusVisible}\n $isInvalid={isInvalid || (isRequired && !(isControlled ? propsValue : value))}\n $isRequired={isRequired}\n $isFocused={Boolean(isFocused || forceColor)}\n $theme={theme}\n $variant={variant}\n className={classNames(TextArea.className, className)}\n ref={ref as MutableRefObject<HTMLDivElement>}\n >\n <fieldset aria-hidden=\"true\" className={`${TextArea.className}-text-area-wrapper__fieldset`}>\n <legend id={labelId} className={`${TextArea.className}-text-area-wrapper-fieldset__legend`}>\n {label ? <span>{label}</span> : null}\n </legend>\n </fieldset>\n {label ? (\n <label className={`${TextArea.className}__label`}>\n <span>{label}</span>\n </label>\n ) : null}\n <div className={`${TextArea.className}__text-area-wrapper`}>\n {leftIcon ? (\n <Icon color={isDisabled ? 'question' : 'black'} {...leftIcon} aria-hidden=\"true\" className=\"left\" />\n ) : null}\n <div className={`${TextArea.className}-text-area-wrapper__text-area`}>\n <div className={`${TextArea.className}-text-area-wrapper-text-area__container`}>\n {highlightOptions ? (\n <div className={`${TextArea.className}-text-area-wrapper__highlight-overlay`} aria-hidden=\"true\">\n {highlightNonAsciiChars((isControlled ? propsValue : value) || '', highlightOptions)}\n </div>\n ) : null}\n <textarea\n {...textareaProps}\n onBlur={(event) => {\n onBlur?.(event);\n onBlurProps?.(event as unknown as FocusEvent<HTMLDivElement, Element>);\n }}\n onFocus={(event) => {\n onFocus?.(event);\n onFocusProps?.(event as unknown as FocusEvent<HTMLDivElement, Element>);\n }}\n aria-disabled={isDisabled}\n aria-invalid={isInvalid || (isRequired && !(isControlled ? propsValue : value))}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledby || (label ? labelId : undefined)}\n aria-readonly={isReadOnly}\n aria-required={isRequired}\n autoFocus={autoFocus}\n disabled={isDisabled}\n name={name}\n onChange={handleChange}\n placeholder={placeholder}\n ref={textareaRef as MutableRefObject<HTMLTextAreaElement>}\n value={isControlled ? propsValue : value}\n rows={rows}\n />\n </div>\n </div>\n {after ? (\n <Flexbox className={`${TextArea.className}-text-area-wrapper__toolbar`} gap=\"8px\">\n {typeof after === 'function'\n ? after(\n isControlled ? propsValue : value,\n isDisabled,\n isInvalid || (isRequired && !(isControlled ? propsValue : value)),\n isRequired\n )\n : after}\n </Flexbox>\n ) : null}\n </div>\n </StyledTextArea>\n );\n});\nTextArea.className = CLASSNAME;\nTextArea.displayName = COMPONENT_NAME;\n"],"names":["useComputeNumberOfRows","minimumRows","rows","setRows","useState","recompute","target","currentRows","scrollHeight","clientHeight","recomputeNumberOfRows","TextAreaVariant","default","underline","StyledTextArea","styled","div","baseStyling","_ref","$label","$hasLeftIcon","$hasContent","$hasHighlightOverlay","$isFocused","$isDisabled","$isInvalid","$color","$isGradient","$theme","$variant","css","Theme","dark","resolveBackgroundColor","background","paletteColors","Object","values","NotificationsColorPalette","includes","StyledHighlightMarker","mark","_ref2","$font","$background","$hasInvisible","COMPONENT_NAME","CLASSNAME","highlightNonAsciiChars","text","options","result","currentAscii","currentNonAscii","keyIndex","chars","Array","from","char","isNonAscii","push","React","createElement","key","font","containsInvisibleChars","TextArea","forwardRef","props","ref","propsWithDefaults","_objectSpread","width","transientProps","otherProps","getStylingTransientProps","ariaLabel","ariaLabelledby","after","autoFocus","className","color","propsColor","defaultValue","forceColor","highlightNonAscii","isColored","isDisabled","isInvalid","isReadOnly","isRequired","label","leftIcon","name","onBlur","onBlurProps","onChange","onFocus","onFocusProps","placeholder","textareaProps","textareaRef","propsTextareaRef","theme","propsTheme","value","propsValue","variant","forwardedProps","_objectWithoutProperties","_excluded","useTheme","ButtonsColorPalette","isGradient","radar","_textareaRef","useRef","isFocusVisible","isFocused","focusProps","useFocusRing","isFocusWithin","setFocusWithin","Boolean","focusWithinProps","useFocusWithin","onFocusWithinChange","setValue","isControlled","undefined","labelId","useId","highlightOptions","normalizeHighlightOptions","warnIfNoAccessibleLabelFound","handleChange","useCallback","event","useEffect","current","_extends","$isFocusVisible","$isRequired","classNames","id","Icon","disabled","Flexbox","gap","displayName"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"TextArea.js","sources":["../../src/hooks/useComputeNumberOfRows.ts","../../src/components/text-area/types.ts","../../src/components/text-area/styles.ts","../../src/components/text-area/TextArea.tsx"],"sourcesContent":["import { useState } from 'react';\n\n/**\n * Hook that allows to calculate the number of rows needed for a text area.\n * @param minimumRows Minimum number of rows that we want to display.\n * @return rows to be used and a callback to recalculate\n */\nexport const useComputeNumberOfRows = (\n minimumRows: number\n): {\n /** number of rows to be used on the text area */\n rows: number;\n /**\n * Callback in order to recalculate the number of rows due to a change on the text area\n */\n recomputeNumberOfRows(target: Element): void;\n} => {\n const [rows, setRows] = useState(minimumRows);\n\n const recompute = (target: Element) => {\n /**\n * HEAD's UP! This part is a little bit tricky. The idea here is to only\n * display the necessary rows on the textarea. In order to dynamically adjust\n * the height on that field, we need to:\n * 1. Set the current amount of rows to the minimum. That will make the scroll appear.\n * 2. With that, we will have the `scrollHeight`, meaning the height of the container adjusted to the current content\n * 3. With the scroll height, we can figure out how many rows we need to use by dividing the scroll height\n * by the line height.\n * 4. With that number, we can readjust the number of rows on the text area. We need to do that here, if we leave that to\n * the state change through React, there are some scenarios (resize, hitting ENTER or BACKSPACE which add or remove lines)\n * when we will not see the update and the rows will be resized to the minimum.\n * 5. In case there is any other update on the component that changes the UI, we need to keep the number of rows\n * on the state in order to allow React to re-render. Therefore, we save them using `useState`\n */\n // eslint-disable-next-line no-param-reassign\n (target as HTMLTextAreaElement).rows = minimumRows;\n let currentRows = target.scrollHeight / (target.clientHeight / minimumRows);\n currentRows = currentRows >= minimumRows ? currentRows : minimumRows;\n // eslint-disable-next-line no-param-reassign\n (target as HTMLTextAreaElement).rows = currentRows;\n\n setRows(currentRows);\n };\n\n return {\n recomputeNumberOfRows: recompute,\n rows,\n };\n};\n","import { ChangeEvent, ComponentProps, RefObject } from 'react';\nimport { ValueOf } from '../../types';\nimport { StyledTextFieldProps, TextFieldProps } from '../text-field';\n\n/**\n * Component variant.\n */\nexport const TextAreaVariant = {\n default: 'default',\n underline: 'underline',\n} as const;\nexport type TextAreaVariant = ValueOf<typeof TextAreaVariant>;\n\n/**\n * Component props.\n */\nexport interface TextAreaProps\n extends Omit<\n TextFieldProps,\n 'onChange' | 'inputRef' | 'inputProps' | 'pills' | 'internal' | 'hasClearButton' | 'onClear'\n > {\n /** Custom ref object to pass to the textarea element. */\n textareaRef?: RefObject<HTMLTextAreaElement | null>;\n /** Custom props to pass to the textarea element. */\n textareaProps?: ComponentProps<'textarea'>;\n /** Method to handle component change. */\n onChange?(value?: string, name?: string, event?: ChangeEvent<HTMLTextAreaElement>): void;\n /** Minimum number of rows displayed in multiline mode (requires `multiline` to be enabled). */\n minimumRows?: number;\n}\n\nexport type StyledTextAreaProps = StyledTextFieldProps;\n","import styled, { css } from 'styled-components';\nimport { baseStyling } from '../shared';\nimport { StyledTextAreaProps, TextAreaVariant } from './types';\nimport { StyledHighlightOverlayProps } from '../text-field/types';\nimport { Theme, NotificationsColorPalette } from '../../types';\n\n/* eslint-disable @redsift/ds/no-outline-none-without-indicator -- the input's own outline is replaced by the field's border, which turns the focus colour through $isFocused */\n/**\n * Component style.\n */\nexport const StyledTextArea = styled.div<StyledTextAreaProps>`\n height: fit-content;\n position: relative;\n width: fit-content;\n margin: 0;\n min-width: 0;\n padding: 0;\n ${baseStyling}\n\n border: 0;\n display: inline-flex;\n flex-direction: column;\n vertical-align: top;\n\n ${({\n $label,\n $hasLeftIcon,\n $hasContent,\n $hasHighlightOverlay,\n $isFocused,\n $isDisabled,\n $isInvalid,\n $color,\n $isGradient,\n $theme,\n $variant,\n }) => css`\n ${$isDisabled\n ? css`\n pointer-events: none;\n `\n : ''}\n\n .redsift-text-area__label {\n font-family: var(--redsift-typography-input-text-font-family);\n font-size: var(--redsift-typography-input-text-font-size);\n font-weight: var(--redsift-typography-input-text-font-weight);\n line-height: var(--redsift-typography-input-text-line-height);\n left: ${$hasLeftIcon && !$hasContent ? '32px' : '0'};\n overflow: hidden;\n pointer-events: none;\n position: absolute;\n text-overflow: ellipsis;\n top: ${$hasContent ? '-8px' : '-6px'};\n transform-origin: top left;\n transition: color 200ms cubic-bezier(0, 0, 0.2, 1) 0ms, transform 200ms cubic-bezier(0, 0, 0.2, 1) 0ms,\n max-width 200ms cubic-bezier(0, 0, 0.2, 1) 0ms;\n white-space: nowrap;\n z-index: 1;\n\n ${!$hasContent\n ? css`\n max-width: calc(100% - 24px);\n transform: translate(${$variant === TextAreaVariant.underline ? '0px' : '14px'}, 16px) scale(1);\n `\n : css`\n max-width: calc(133% - 32px);\n transform: translate(${$variant === TextAreaVariant.underline ? '0px' : '14px'}, 1px) scale(0.733);\n `}\n\n ${!$isGradient\n ? css`\n color: var(\n --redsift-color-${$theme}-components-buttons-secondary-button-${$isInvalid\n ? 'error'\n : $isFocused\n ? $color\n : 'grey'}-text-${$isDisabled ? 'disabled' : 'default'}\n );\n `\n : css`\n background-color: var(--redsift-color-neutral-${$theme === Theme.dark ? 'x-dark-grey' : 'white'});\n ${$variant !== TextAreaVariant.underline\n ? css`\n padding-right: 7px;\n padding-left: 5px;\n `\n : ''}\n > span {\n background: var(\n --redsift-color-${$theme}-components-buttons-secondary-button-${$isInvalid\n ? 'error'\n : $isFocused\n ? $color\n : 'grey'}-text-${$isDisabled ? 'disabled' : 'default'}\n );\n background-clip: text;\n color: transparent;\n }\n `}\n }\n\n .redsift-text-area__text-area-wrapper {\n align-items: flex-start;\n box-sizing: border-box;\n cursor: text;\n display: inline-flex;\n min-height: 42px;\n position: relative;\n width: 100%;\n }\n\n .redsift-text-area-text-area-wrapper__text-area {\n flex: 1 1 auto;\n padding-bottom: 9px;\n ${$variant !== TextAreaVariant.underline && !$hasLeftIcon\n ? css`\n padding-left: 16px;\n `\n : ''}\n padding-top: ${$label ? '10px' : '9px'};\n padding-right: 8px;\n }\n\n .redsift-text-area-text-area-wrapper-text-area__container {\n position: relative;\n width: 100%;\n\n textarea {\n background: transparent;\n display: block;\n border: none;\n outline: none;\n width: 100%;\n padding: 0;\n margin: 0;\n box-sizing: content-box;\n font-family: ${$hasHighlightOverlay\n ? 'var(--redsift-typography-font-family-inconsolata)'\n : 'var(--redsift-typography-input-text-font-family)'};\n font-size: 14px;\n font-weight: var(--redsift-typography-input-text-font-weight);\n line-height: var(--redsift-typography-input-text-line-height);\n resize: none;\n position: relative;\n z-index: 1;\n\n ${$isDisabled\n ? css`\n color: var(--redsift-color-neutral-light-grey);\n `\n : $hasHighlightOverlay\n ? css`\n color: transparent;\n caret-color: var(--redsift-color-neutral-${$theme === Theme.dark ? 'white' : 'x-dark-grey'});\n `\n : css`\n color: var(--redsift-color-neutral-${$theme === Theme.dark ? 'white' : 'x-dark-grey'});\n `}\n }\n }\n\n .redsift-text-area-text-area-wrapper__highlight-overlay {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n pointer-events: none;\n font-family: var(--redsift-typography-font-family-inconsolata);\n font-size: 14px;\n font-weight: var(--redsift-typography-input-text-font-weight);\n line-height: var(--redsift-typography-input-text-line-height);\n white-space: pre-wrap;\n word-wrap: break-word;\n overflow: hidden;\n color: var(--redsift-color-neutral-${$theme === Theme.dark ? 'white' : 'x-dark-grey'});\n\n /* Remove padding from marks to maintain exact character alignment with textarea */\n mark {\n padding: 0;\n }\n }\n\n .redsift-text-area-text-area-wrapper-pills-and-text-area__text-area::placeholder {\n color: var(--redsift-color-neutral-mid-grey);\n }\n\n .redsift-text-area-text-area-wrapper-pills-and-text-area__text-area:focus {\n outline: 0;\n }\n\n .redsift-text-area-text-area-wrapper__fieldset {\n border-style: solid;\n bottom: 0;\n left: 1px;\n margin: 0;\n min-width: 0%;\n overflow: hidden;\n padding: 0 8px;\n pointer-events: none;\n position: absolute;\n right: 0;\n text-align: left;\n top: -5px;\n\n ${!$isGradient || $isDisabled || !$isFocused || $isInvalid\n ? css`\n ${$variant === TextAreaVariant.underline\n ? css`\n border-bottom-width: 2px;\n `\n : css`\n border-radius: 4px;\n border-width: 2px;\n `}\n border-color: var(\n --redsift-color-${$theme}-components-buttons-secondary-button-${$isInvalid\n ? 'error'\n : $isFocused\n ? $color\n : 'grey'}-text-${$isDisabled ? 'disabled' : 'default'}\n );\n `\n : css`\n ${$variant === TextAreaVariant.underline\n ? css`\n border-bottom: 2px solid transparent;\n `\n : css`\n border: 2px solid transparent;\n border-radius: 4px;\n `}\n background: transparent;\n background-clip: padding-box, border-box;\n background-origin: border-box;\n background-image: linear-gradient(\n 90deg,\n var(--redsift-color-neutral-${$theme === Theme.dark ? 'x-dark-grey' : 'white'}),\n var(--redsift-color-neutral-${$theme === Theme.dark ? 'x-dark-grey' : 'white'})\n ),\n var(--redsift-color-${$theme}-components-buttons-secondary-button-${$color}-text-default);\n `}\n }\n\n .redsift-text-area-text-area-wrapper-fieldset__legend {\n display: block;\n float: unset;\n font-size: 11px;\n height: 11px;\n overflow: hidden;\n padding: 0;\n visibility: hidden;\n white-space: nowrap;\n width: auto;\n\n ${!$hasContent\n ? css`\n max-width: 0.01px;\n transition: max-width 50ms cubic-bezier(0, 0, 0.2, 1) 0ms;\n `\n : css`\n max-width: 100%;\n transition: max-width 100ms cubic-bezier(0, 0, 0.2, 1) 50ms;\n `}\n }\n\n .redsift-text-area-text-area-wrapper-fieldset__legend > span {\n display: inline-block;\n opacity: 0;\n padding-left: 5px;\n padding-right: 5px;\n visibility: visible;\n }\n\n .redsift-text-area-text-area-wrapper__toolbar {\n position: relative;\n top: 7px;\n }\n\n .redsift-icon-button {\n padding: 2px;\n height: 28px;\n width: 28px;\n }\n\n ${$variant !== TextAreaVariant.underline\n ? css`\n .redsift-icon.left {\n padding-left: 12px;\n padding-right: 8px;\n line-height: 28px;\n top: 10px;\n }\n\n .redsift-text-area-text-area-wrapper__toolbar {\n padding-right: 8px;\n }\n `\n : css`\n .redsift-icon.left {\n padding-right: 8px;\n top: 10px;\n }\n `}\n `}\n`;\n/* eslint-enable @redsift/ds/no-outline-none-without-indicator */\n\n/**\n * Resolves background color from prop value.\n * Handles: boolean (true=warning), palette colors, and custom CSS values.\n */\nconst resolveBackgroundColor = (background: true | string): string => {\n if (background === true) {\n return 'var(--redsift-color-notifications-warning-primary)';\n }\n // Check if it's a notification palette color name\n const paletteColors = Object.values(NotificationsColorPalette);\n if (paletteColors.includes(background as NotificationsColorPalette)) {\n return `var(--redsift-color-notifications-${background}-primary)`;\n }\n // Assume it's a CSS color value (hex, rgb, etc.)\n return background;\n};\n\n/**\n * Styled marker for highlighted non-ASCII characters in TextArea.\n */\nexport const StyledHighlightMarker = styled.mark<StyledHighlightOverlayProps>`\n ${({ $font, $background, $hasInvisible }) => css`\n /* Reset the default <mark> styling */\n background: ${$background ? resolveBackgroundColor($background) : 'transparent'};\n color: inherit;\n border-radius: 2px;\n padding: 0 1px;\n position: relative;\n\n /* Use Inconsolata with bold weight to break kerning and reveal lookalike chars */\n ${$font &&\n css`\n font-family: var(--redsift-typography-font-family-inconsolata);\n font-weight: 700;\n `}\n\n /* Show a visual indicator for invisible/zero-width characters */\n ${$hasInvisible &&\n css`\n &::after {\n content: '•';\n position: absolute;\n bottom: 0;\n left: 50%;\n transform: translateX(-50%);\n color: var(--redsift-color-neutral-x-dark-grey);\n ${$background &&\n css`\n background-color: ${resolveBackgroundColor($background)};\n opacity: 0.8;\n `}\n border-radius: 2px;\n pointer-events: none;\n }\n `}\n `}\n`;\n","import React, {\n ComponentProps,\n FocusEvent,\n forwardRef,\n MutableRefObject,\n ReactNode,\n useCallback,\n useEffect,\n useState,\n} from 'react';\nimport classNames from 'classnames';\nimport { useFocusRing } from '../../react-aria/react-aria/focus';\nimport { useFocusWithin } from '../../react-aria/react-aria/interactions';\nimport { ButtonsColorPalette, Comp, getStylingTransientProps } from '../../types';\nimport { warnIfNoAccessibleLabelFound } from '../../utils/warnIfNoAccessibleLabelFound';\nimport {\n isNonAscii,\n containsInvisibleChars,\n normalizeHighlightOptions,\n NormalizedHighlightOptions,\n} from '../../utils/highlightNonAscii';\nimport { TextAreaProps, TextAreaVariant } from './types';\nimport { StyledTextArea, StyledHighlightMarker } from './styles';\nimport { Icon } from '../../components/icon';\nimport { useTheme } from '../theme';\nimport { useComputeNumberOfRows } from '../../hooks';\nimport { useId } from '../../utils';\nimport { Flexbox } from '../flexbox';\n\nconst COMPONENT_NAME = 'TextArea';\nconst CLASSNAME = 'redsift-text-area';\n\n/**\n * Processes a string and wraps consecutive non-ASCII characters in highlight markers.\n * Groups consecutive non-ASCII characters to minimize DOM nodes.\n * Invisible characters are NOT replaced (to maintain width alignment) but marked\n * with a $hasInvisible prop for CSS-based visual indication.\n */\nconst highlightNonAsciiChars = (text: string, options: NormalizedHighlightOptions): ReactNode[] => {\n const result: ReactNode[] = [];\n let currentAscii = '';\n let currentNonAscii = '';\n let keyIndex = 0;\n\n // Use Array.from to correctly handle Unicode surrogate pairs (e.g., emojis)\n const chars = Array.from(text);\n\n for (const char of chars) {\n if (isNonAscii(char)) {\n // Flush ASCII buffer\n if (currentAscii) {\n result.push(currentAscii);\n currentAscii = '';\n }\n currentNonAscii += char;\n } else {\n // Flush non-ASCII buffer\n if (currentNonAscii) {\n result.push(\n <StyledHighlightMarker\n key={keyIndex++}\n $font={options.font}\n $background={options.background}\n $hasInvisible={containsInvisibleChars(currentNonAscii)}\n >\n {currentNonAscii}\n </StyledHighlightMarker>\n );\n currentNonAscii = '';\n }\n currentAscii += char;\n }\n }\n\n // Flush remaining buffers\n if (currentAscii) {\n result.push(currentAscii);\n }\n if (currentNonAscii) {\n result.push(\n <StyledHighlightMarker\n key={keyIndex}\n $font={options.font}\n $background={options.background}\n $hasInvisible={containsInvisibleChars(currentNonAscii)}\n >\n {currentNonAscii}\n </StyledHighlightMarker>\n );\n }\n\n return result;\n};\n\n/**\n * TextArea allows users to enter multi-line text. Supports auto-growing height,\n * validation, and controlled/uncontrolled modes.\n *\n * @example\n * // Basic text area\n * <TextArea label=\"Description\" placeholder=\"Enter description...\" />\n *\n * @example\n * // Controlled with validation\n * <TextArea\n * label=\"Comments\"\n * value={comments}\n * onChange={setComments}\n * isInvalid={comments.length > 500}\n * isRequired\n * />\n *\n * @example\n * // Auto-growing with minimum rows\n * <TextArea label=\"Message\" minimumRows={3} />\n *\n * @example\n * // With icon and variant\n * <TextArea\n * label=\"Notes\"\n * variant=\"underline\"\n * leftIcon={{ icon: mdiNote }}\n * />\n */\nexport const TextArea: Comp<TextAreaProps, HTMLDivElement> = forwardRef((props, ref) => {\n const propsWithDefaults = {\n width: '100%' as const,\n ...props,\n };\n\n const { transientProps, otherProps } = getStylingTransientProps(propsWithDefaults);\n\n const {\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledby,\n after,\n autoFocus,\n className,\n color: propsColor,\n defaultValue = '',\n forceColor,\n highlightNonAscii,\n isColored = true,\n isDisabled,\n isInvalid,\n isReadOnly,\n isRequired,\n label,\n leftIcon,\n minimumRows,\n name,\n onBlur: onBlurProps,\n onChange,\n onFocus: onFocusProps,\n placeholder,\n textareaProps,\n textareaRef: propsTextareaRef,\n theme: propsTheme,\n value: propsValue,\n variant = TextAreaVariant.default,\n ...forwardedProps\n } = otherProps;\n\n const theme = useTheme(propsTheme);\n const color = Object.values(ButtonsColorPalette).includes(propsColor!) ? propsColor : isColored ? 'primary' : 'grey';\n const isGradient = color === ButtonsColorPalette.radar;\n\n const _textareaRef = React.useRef(null);\n const textareaRef = propsTextareaRef ?? _textareaRef;\n\n const {\n isFocusVisible,\n isFocused,\n focusProps: { onFocus, onBlur },\n } = useFocusRing({\n autoFocus,\n });\n const [isFocusWithin, setFocusWithin] = useState(Boolean(autoFocus));\n const { focusWithinProps } = useFocusWithin({\n onFocusWithinChange: (isFocusWithin) => setFocusWithin(isFocusWithin),\n });\n\n const [value, setValue] = useState(defaultValue);\n const isControlled = propsValue !== null && propsValue !== undefined;\n\n const [labelId] = useId();\n\n // Normalize highlight options - force font: false since the textarea uses Inconsolata directly\n const highlightOptions = highlightNonAscii ? { ...normalizeHighlightOptions(highlightNonAscii), font: false } : null;\n\n warnIfNoAccessibleLabelFound(props as ComponentProps<'label'>, [label], 'TextArea');\n\n const handleChange = useCallback(\n (event: React.ChangeEvent<HTMLTextAreaElement>) => {\n if (isDisabled || isReadOnly) {\n return;\n }\n\n if (onChange) {\n onChange(event.target.value, name, event);\n } else {\n setValue(event.target.value);\n }\n },\n [onChange]\n );\n\n const { rows, recomputeNumberOfRows } = useComputeNumberOfRows(minimumRows || 4);\n useEffect(() => {\n // Recompute the number of rows for the first rendering\n if (textareaRef && textareaRef.current) {\n recomputeNumberOfRows(textareaRef.current);\n }\n }, [textareaRef, recomputeNumberOfRows, value]);\n\n return (\n <StyledTextArea\n {...focusWithinProps}\n {...forwardedProps}\n {...transientProps}\n $label={label}\n $hasContent={isFocusWithin || Boolean(isControlled ? propsValue : value) || Boolean(placeholder)}\n $hasLeftIcon={Boolean(leftIcon)}\n $hasHighlightOverlay={Boolean(highlightNonAscii)}\n $color={color}\n $isGradient={isGradient}\n $isDisabled={isDisabled}\n $isFocusVisible={isFocusVisible}\n $isInvalid={isInvalid || (isRequired && !(isControlled ? propsValue : value))}\n $isRequired={isRequired}\n $isFocused={Boolean(isFocused || forceColor)}\n $theme={theme}\n $variant={variant}\n className={classNames(TextArea.className, className)}\n ref={ref as MutableRefObject<HTMLDivElement>}\n >\n <fieldset aria-hidden=\"true\" className={`${TextArea.className}-text-area-wrapper__fieldset`}>\n <legend id={labelId} className={`${TextArea.className}-text-area-wrapper-fieldset__legend`}>\n {label ? <span>{label}</span> : null}\n </legend>\n </fieldset>\n {label ? (\n <label className={`${TextArea.className}__label`}>\n <span>{label}</span>\n </label>\n ) : null}\n <div className={`${TextArea.className}__text-area-wrapper`}>\n {leftIcon ? (\n <Icon color={isDisabled ? 'question' : 'black'} {...leftIcon} aria-hidden=\"true\" className=\"left\" />\n ) : null}\n <div className={`${TextArea.className}-text-area-wrapper__text-area`}>\n <div className={`${TextArea.className}-text-area-wrapper-text-area__container`}>\n {highlightOptions ? (\n <div className={`${TextArea.className}-text-area-wrapper__highlight-overlay`} aria-hidden=\"true\">\n {highlightNonAsciiChars((isControlled ? propsValue : value) || '', highlightOptions)}\n </div>\n ) : null}\n <textarea\n {...textareaProps}\n onBlur={(event) => {\n onBlur?.(event);\n onBlurProps?.(event as unknown as FocusEvent<HTMLDivElement, Element>);\n }}\n onFocus={(event) => {\n onFocus?.(event);\n onFocusProps?.(event as unknown as FocusEvent<HTMLDivElement, Element>);\n }}\n aria-disabled={isDisabled}\n aria-invalid={isInvalid || (isRequired && !(isControlled ? propsValue : value))}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledby || (label ? labelId : undefined)}\n aria-readonly={isReadOnly}\n aria-required={isRequired}\n // eslint-disable-next-line jsx-a11y/no-autofocus -- forwards the consumer's `autoFocus` prop\n autoFocus={autoFocus}\n disabled={isDisabled}\n name={name}\n onChange={handleChange}\n placeholder={placeholder}\n ref={textareaRef as MutableRefObject<HTMLTextAreaElement>}\n value={isControlled ? propsValue : value}\n rows={rows}\n />\n </div>\n </div>\n {after ? (\n <Flexbox className={`${TextArea.className}-text-area-wrapper__toolbar`} gap=\"8px\">\n {typeof after === 'function'\n ? after(\n isControlled ? propsValue : value,\n isDisabled,\n isInvalid || (isRequired && !(isControlled ? propsValue : value)),\n isRequired\n )\n : after}\n </Flexbox>\n ) : null}\n </div>\n </StyledTextArea>\n );\n});\nTextArea.className = CLASSNAME;\nTextArea.displayName = COMPONENT_NAME;\n"],"names":["useComputeNumberOfRows","minimumRows","rows","setRows","useState","recompute","target","currentRows","scrollHeight","clientHeight","recomputeNumberOfRows","TextAreaVariant","default","underline","StyledTextArea","styled","div","baseStyling","_ref","$label","$hasLeftIcon","$hasContent","$hasHighlightOverlay","$isFocused","$isDisabled","$isInvalid","$color","$isGradient","$theme","$variant","css","Theme","dark","resolveBackgroundColor","background","paletteColors","Object","values","NotificationsColorPalette","includes","StyledHighlightMarker","mark","_ref2","$font","$background","$hasInvisible","COMPONENT_NAME","CLASSNAME","highlightNonAsciiChars","text","options","result","currentAscii","currentNonAscii","keyIndex","chars","Array","from","char","isNonAscii","push","React","createElement","key","font","containsInvisibleChars","TextArea","forwardRef","props","ref","propsWithDefaults","_objectSpread","width","transientProps","otherProps","getStylingTransientProps","ariaLabel","ariaLabelledby","after","autoFocus","className","color","propsColor","defaultValue","forceColor","highlightNonAscii","isColored","isDisabled","isInvalid","isReadOnly","isRequired","label","leftIcon","name","onBlur","onBlurProps","onChange","onFocus","onFocusProps","placeholder","textareaProps","textareaRef","propsTextareaRef","theme","propsTheme","value","propsValue","variant","forwardedProps","_objectWithoutProperties","_excluded","useTheme","ButtonsColorPalette","isGradient","radar","_textareaRef","useRef","isFocusVisible","isFocused","focusProps","useFocusRing","isFocusWithin","setFocusWithin","Boolean","focusWithinProps","useFocusWithin","onFocusWithinChange","setValue","isControlled","undefined","labelId","useId","highlightOptions","normalizeHighlightOptions","warnIfNoAccessibleLabelFound","handleChange","useCallback","event","useEffect","current","_extends","$isFocusVisible","$isRequired","classNames","id","Icon","disabled","Flexbox","gap","displayName"],"mappings":"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"}
|
package/_internal/TextField.js
CHANGED
|
@@ -40,6 +40,7 @@ const TextFieldPillsLayout = {
|
|
|
40
40
|
* Component props.
|
|
41
41
|
*/
|
|
42
42
|
|
|
43
|
+
/* eslint-disable @redsift/ds/no-outline-none-without-indicator -- the input's own outline is replaced by the field's border, which turns the focus colour through $isFocused */
|
|
43
44
|
/**
|
|
44
45
|
* Component style.
|
|
45
46
|
*/
|
|
@@ -378,6 +379,7 @@ const StyledTextField = styled.div`
|
|
|
378
379
|
`;
|
|
379
380
|
}}
|
|
380
381
|
`;
|
|
382
|
+
/* eslint-enable @redsift/ds/no-outline-none-without-indicator */
|
|
381
383
|
|
|
382
384
|
/**
|
|
383
385
|
* Resolves background color from prop value.
|
|
@@ -734,7 +736,9 @@ const TextField = /*#__PURE__*/forwardRef((props, ref) => {
|
|
|
734
736
|
"aria-label": ariaLabel,
|
|
735
737
|
"aria-labelledby": ariaLabelledby || (label ? labelId : undefined),
|
|
736
738
|
"aria-readonly": isReadOnly,
|
|
737
|
-
"aria-required": isRequired
|
|
739
|
+
"aria-required": isRequired
|
|
740
|
+
// eslint-disable-next-line jsx-a11y/no-autofocus -- forwards the consumer's `autoFocus` prop
|
|
741
|
+
,
|
|
738
742
|
autoFocus: autoFocus,
|
|
739
743
|
className: `${TextField.className}-input-wrapper-pills-and-input__input`,
|
|
740
744
|
disabled: isDisabled,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextField.js","sources":["../../src/components/text-field/types.ts","../../src/components/text-field/styles.ts","../../src/components/text-field/intl/index.ts","../../src/components/text-field/TextField.tsx"],"sourcesContent":["import { ChangeEvent, ComponentProps, MutableRefObject, ReactNode } from 'react';\nimport { ButtonsColorPalette, StylingProps, StylingTransientProps, Theme, ValueOf } from '../../types';\nimport { IconProps } from '../icon';\nimport { IconButtonProps } from '../icon-button';\nimport { PillProps } from '../pill';\nimport { HighlightNonAsciiOptions } from '../../utils/highlightNonAscii';\n\n/**\n * Component variant.\n */\nexport const TextFieldVariant = {\n default: 'default',\n underline: 'underline',\n} as const;\nexport type TextFieldVariant = ValueOf<typeof TextFieldVariant>;\n\n/**\n * Layout of the Pills relative to the input.\n */\nexport const TextFieldPillsLayout = {\n wrap: 'wrap',\n inline: 'inline',\n} as const;\nexport type TextFieldPillsLayout = ValueOf<typeof TextFieldPillsLayout>;\n\n/**\n * Component color.\n */\nexport type TextFieldColor = ButtonsColorPalette;\n\n/**\n * Component props.\n */\nexport interface TextFieldProps extends Omit<ComponentProps<'div'>, 'onChange'>, StylingProps {\n /** Whether the component can be autofocused. */\n autoFocus?: boolean;\n /** Color variant. */\n color?: TextFieldColor;\n /** Force color even when not focused. */\n forceColor?: boolean;\n /**\n * Default value.\n * Used for uncontrolled version.\n */\n defaultValue?: string;\n /** Whether the clear button is displayed or not. */\n hasClearButton?: boolean | Omit<Partial<IconButtonProps>, 'ref'>;\n /** Place for icon buttons between the clear button and the separator. */\n internal?:\n | ReactNode\n | ((value?: string, isDisabled?: boolean, isInvalid?: boolean, isRequired?: boolean) => ReactNode);\n /** Place for icon buttons after the separator. */\n after?: ReactNode | ((value?: string, isDisabled?: boolean, isInvalid?: boolean, isRequired?: boolean) => ReactNode);\n /** Custom props to pass to the input element. */\n inputProps?: ComponentProps<'input'>;\n /** Custom ref object to pass to the input element. */\n inputRef?: MutableRefObject<HTMLInputElement>;\n /** @deprecated Whether the component should use the product colors or shades of grey. */\n isColored?: boolean;\n /** Whether the component is disabled or not. */\n isDisabled?: boolean;\n /**\n * Whether the component is invalid or not. This is the *only* trigger for the\n * error (red) border and `aria-invalid`; drive it yourself (e.g. on blur) for\n * touch-based validation. `isRequired` no longer implies it.\n */\n isInvalid?: boolean;\n /** Whether the component is read only or not. */\n isReadOnly?: boolean;\n /**\n * Whether the component is required or not. Renders an asterisk (*) next to\n * the label and sets `aria-required`. The asterisk inherits the label colour\n * (neutral by default); it does **not** set the error border and is not red on\n * its own — pass `isInvalid` for the red/error state.\n */\n isRequired?: boolean;\n /** Label */\n label?: string;\n /**\n * Can be a string or an array of strings containing `d` property of the `path` SVG element.<br />\n * Can also be a ReactElement.\n */\n leftIcon?: Omit<IconProps, 'ref'>;\n /** Name to pass to the input element. */\n name?: string;\n /** Method to handle component change. */\n onChange?(value?: string, name?: string, event?: ChangeEvent<HTMLInputElement>): void;\n /** Method to handle component clear. */\n onClear?(): void;\n /** List of Pills. */\n pills?: Omit<PillProps, 'ref'>[];\n /**\n * How the Pills are laid out relative to the input.\n *\n * - `wrap`: Pills wrap onto new lines above the input and the field grows vertically (legacy behaviour).\n * - `inline`: Pills and input share a single line; the field never grows. Pills shrink and truncate\n * their text with an ellipsis instead of wrapping. Meant for triggers that bound the number of Pills\n * themselves (see `Combobox.Trigger` `pillsOverflow`).\n *\n * @default 'wrap'\n */\n pillsLayout?: TextFieldPillsLayout;\n /** Placeholder. */\n placeholder?: string;\n /** Theme. */\n theme?: Theme;\n /** Input type. */\n type?: string;\n /**\n * Input value.\n * Used for controlled version.\n */\n value?: string;\n /**\n * TextField variant.\n * @default 'default'\n */\n variant?: TextFieldVariant;\n /**\n * Highlight non-ASCII characters in the input. Useful for IDN domain names where\n * Unicode lookalike characters can be confusing. Uses an overlay to display\n * highlighted characters while maintaining input functionality.\n *\n * - `true`: enables both font change and background highlight\n * - `{ font?: boolean, background?: boolean | string }`: fine-grained control\n *\n * @example\n * // Both font and background (default)\n * <TextField highlightNonAscii label=\"Domain\" />\n *\n * @example\n * // Background only\n * <TextField highlightNonAscii={{ font: false }} label=\"Domain\" />\n */\n highlightNonAscii?: boolean | HighlightNonAsciiOptions;\n}\n\nexport interface StyledTextFieldProps extends ComponentProps<'div'>, StylingTransientProps {\n $label?: TextFieldProps['label'];\n $color: TextFieldProps['color'];\n $isGradient: boolean;\n $hasLeftIcon: boolean;\n $hasContent: boolean;\n $hasHighlightOverlay: boolean;\n $isDisabled: TextFieldProps['isDisabled'];\n $isInvalid: TextFieldProps['isInvalid'];\n $isFocused: boolean;\n $isFocusVisible: boolean;\n $isRequired: TextFieldProps['isRequired'];\n $pillsLayout?: TextFieldProps['pillsLayout'];\n $theme: TextFieldProps['theme'];\n $variant: TextFieldProps['variant'];\n}\n\nexport interface StyledHighlightOverlayProps {\n $font: boolean;\n $background: boolean | string;\n $hasInvisible?: boolean;\n}\n","import styled, { css } from 'styled-components';\nimport { baseStyling } from '../shared';\nimport { StyledTextFieldProps, StyledHighlightOverlayProps, TextFieldPillsLayout, TextFieldVariant } from './types';\nimport { Theme, NotificationsColorPalette } from '../../types';\n\n/**\n * Component style.\n */\nexport const StyledTextField = styled.div<StyledTextFieldProps>`\n height: fit-content;\n position: relative;\n width: fit-content;\n margin: 0;\n min-width: 0;\n padding: 0;\n ${baseStyling}\n\n border: 0;\n display: inline-flex;\n flex-direction: column;\n vertical-align: top;\n\n ${({\n $label,\n $hasLeftIcon,\n $hasContent,\n $hasHighlightOverlay,\n $isFocused,\n $isDisabled,\n $isInvalid,\n $color,\n $isGradient,\n $pillsLayout,\n $theme,\n $variant,\n }) => css`\n ${$isDisabled\n ? css`\n pointer-events: none;\n `\n : ''}\n\n .redsift-text-field__label {\n font-family: var(--redsift-typography-input-text-font-family);\n font-size: var(--redsift-typography-input-text-font-size);\n font-weight: var(--redsift-typography-input-text-font-weight);\n line-height: var(--redsift-typography-input-text-line-height);\n left: ${$hasLeftIcon && !$hasContent ? '32px' : '0'};\n overflow: hidden;\n pointer-events: none;\n position: absolute;\n text-overflow: ellipsis;\n top: ${$hasContent ? '-8px' : '-7px'};\n transform-origin: top left;\n transition: color 200ms cubic-bezier(0, 0, 0.2, 1) 0ms, transform 200ms cubic-bezier(0, 0, 0.2, 1) 0ms,\n max-width 200ms cubic-bezier(0, 0, 0.2, 1) 0ms;\n white-space: nowrap;\n z-index: 1;\n\n ${!$hasContent\n ? css`\n max-width: calc(100% - 24px);\n transform: translate(${$variant === TextFieldVariant.underline ? '0px' : '14px'}, 16px) scale(1);\n `\n : css`\n max-width: calc(133% - 32px);\n transform: translate(${$variant === TextFieldVariant.underline ? '0px' : '14px'}, 1px) scale(0.733);\n `}\n\n ${!$isGradient\n ? css`\n color: var(\n --redsift-color-${$theme}-components-buttons-secondary-button-${$isInvalid\n ? 'error'\n : $isFocused\n ? $color\n : 'grey'}-text-${$isDisabled ? 'disabled' : 'default'}\n );\n `\n : css`\n background-color: var(--redsift-color-neutral-${$theme === Theme.dark ? 'x-dark-grey' : 'white'});\n ${$variant !== TextFieldVariant.underline\n ? css`\n padding-right: 7px;\n padding-left: 5px;\n `\n : ''}\n > span {\n background: var(\n --redsift-color-${$theme}-components-buttons-secondary-button-${$isInvalid\n ? 'error'\n : $isFocused\n ? $color\n : 'grey'}-text-${$isDisabled ? 'disabled' : 'default'}\n );\n background-clip: text;\n color: transparent;\n }\n `}\n }\n\n /* Required indicator (DS-34): an asterisk, independent of the invalid state.\n Rendered inside both the visible label and the (hidden) legend so the\n fieldset notch reserves the same width. It inherits the label colour\n (neutral by default, product colour on focus) — deliberately NOT red for a\n plain required field. Red is reserved for the invalid state, which the\n label colour already drives, so the asterisk turns red only when isInvalid. */\n .redsift-text-field__asterisk {\n margin-left: 2px;\n color: inherit;\n }\n\n .redsift-text-field__input-wrapper {\n align-items: flex-start;\n box-sizing: border-box;\n cursor: text;\n display: inline-flex;\n min-height: 42px;\n position: relative;\n }\n\n .redsift-text-field-input-wrapper__pills-and-input {\n align-items: flex-start;\n box-sizing: border-box;\n display: flex;\n flex-direction: column-reverse;\n flex-wrap: wrap;\n flex: 1 1 auto;\n padding-bottom: 7px;\n ${$variant !== TextFieldVariant.underline && !$hasLeftIcon\n ? css`\n padding-left: 16px;\n `\n : ''}\n ${$variant !== TextFieldVariant.underline\n ? css`\n padding-right: 16px;\n `\n : ''}\n padding-top: ${$label ? '9px' : '7px'};\n\n .redsift-pill {\n margin: 3px 6px 3px 0;\n }\n\n ${$pillsLayout === TextFieldPillsLayout.inline\n ? css`\n /* Single-line layout: pills first, input takes the remaining space, nothing wraps.\n flex-basis 0 + overflow hidden: the row only ever takes the space the toolbar leaves,\n so pills/input can never sit on top of the clear/expand buttons. */\n align-items: center;\n flex: 1 1 0%;\n flex-direction: row;\n flex-wrap: nowrap;\n min-width: 0;\n overflow: hidden;\n\n .redsift-text-field-input-wrapper-pills-and-input__pills {\n display: flex;\n flex: 0 1 auto;\n flex-wrap: nowrap;\n min-width: 0;\n order: -1;\n overflow: hidden;\n\n .redsift-pill {\n /* No \\`flex\\` shorthand here: a Pill may opt out of shrinking via its own \\`flexShrink\\` prop. */\n flex-basis: auto;\n flex-grow: 0;\n max-width: 100%;\n min-width: 0;\n overflow: hidden;\n\n .redsift-text {\n display: block;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n }\n }\n\n .redsift-text-field-input-wrapper-pills-and-input__input-container,\n .redsift-text-field-input-wrapper-pills-and-input__input {\n flex: 1 1 40px;\n min-width: 40px;\n width: auto;\n }\n `\n : ''}\n }\n\n .redsift-text-field-input-wrapper-pills-and-input__input {\n background: none;\n border: 0;\n box-sizing: content-box;\n display: flex;\n flex: 1 1 auto;\n font-family: ${$hasHighlightOverlay\n ? 'var(--redsift-typography-font-family-inconsolata)'\n : 'var(--redsift-typography-input-text-font-family)'};\n font-size: var(--redsift-typography-input-text-font-size);\n font-weight: var(--redsift-typography-input-text-font-weight);\n line-height: var(--redsift-typography-input-text-line-height);\n min-width: 0;\n min-width: 100px;\n padding: 2px 0;\n width: 100%;\n\n ${$isDisabled\n ? css`\n color: var(--redsift-color-grey-l2);\n `\n : $hasHighlightOverlay\n ? css`\n color: transparent;\n caret-color: var(--redsift-color-neutral-${$theme === Theme.dark ? 'white' : 'x-dark-grey'});\n `\n : css`\n color: var(--redsift-color-neutral-${$theme === Theme.dark ? 'white' : 'x-dark-grey'});\n `}\n }\n\n .redsift-text-field-input-wrapper-pills-and-input__input-container {\n position: relative;\n display: flex;\n flex: 1 1 auto;\n min-width: 100px;\n width: 100%;\n }\n\n .redsift-text-field-input-wrapper-pills-and-input__highlight-overlay {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n pointer-events: none;\n font-family: var(--redsift-typography-font-family-inconsolata);\n font-size: var(--redsift-typography-input-text-font-size);\n font-weight: var(--redsift-typography-input-text-font-weight);\n line-height: var(--redsift-typography-input-text-line-height);\n padding: 2px 0;\n white-space: pre;\n overflow: hidden;\n color: var(--redsift-color-neutral-${$theme === Theme.dark ? 'white' : 'x-dark-grey'});\n\n /* Remove padding from marks to maintain exact character alignment with input */\n mark {\n padding: 0;\n }\n }\n\n .redsift-text-field-input-wrapper-pills-and-input__input::placeholder {\n color: var(--redsift-color-neutral-mid-grey);\n }\n\n .redsift-text-field-input-wrapper-pills-and-input__input:focus {\n outline: 0;\n }\n\n .redsift-text-field-input-wrapper__fieldset {\n border-style: solid;\n bottom: 0;\n left: 1px;\n margin: 0;\n min-width: 0%;\n overflow: hidden;\n padding: 0 8px;\n pointer-events: none;\n position: absolute;\n right: 0;\n text-align: left;\n top: -5px;\n\n ${!$isGradient || $isDisabled || !$isFocused || $isInvalid\n ? css`\n ${$variant === TextFieldVariant.underline\n ? css`\n border-bottom-width: 2px;\n `\n : css`\n border-radius: 4px;\n border-width: 2px;\n `}\n border-color: var(\n --redsift-color-${$theme}-components-buttons-secondary-button-${$isInvalid\n ? 'error'\n : $isFocused\n ? $color\n : 'grey'}-text-${$isDisabled ? 'disabled' : 'default'}\n );\n `\n : css`\n ${$variant === TextFieldVariant.underline\n ? css`\n border-bottom: 2px solid transparent;\n `\n : css`\n border: 2px solid transparent;\n border-radius: 4px;\n `}\n background: transparent;\n background-clip: padding-box, border-box;\n background-origin: border-box;\n background-image: linear-gradient(\n 90deg,\n var(--redsift-color-neutral-${$theme === Theme.dark ? 'x-dark-grey' : 'white'}),\n var(--redsift-color-neutral-${$theme === Theme.dark ? 'x-dark-grey' : 'white'})\n ),\n var(--redsift-color-${$theme}-components-buttons-secondary-button-${$color}-text-default);\n `}\n }\n\n .redsift-text-field-input-wrapper-fieldset__legend {\n display: block;\n float: unset;\n font-size: 11px;\n height: 11px;\n overflow: hidden;\n padding: 0;\n visibility: hidden;\n white-space: nowrap;\n width: auto;\n\n ${!$hasContent\n ? css`\n max-width: 0.01px;\n transition: max-width 50ms cubic-bezier(0, 0, 0.2, 1) 0ms;\n `\n : css`\n max-width: 100%;\n transition: max-width 100ms cubic-bezier(0, 0, 0.2, 1) 50ms;\n `}\n }\n\n .redsift-text-field-input-wrapper-fieldset__legend > span {\n display: inline-block;\n opacity: 0;\n padding-left: 5px;\n padding-right: 5px;\n visibility: visible;\n }\n\n .redsift-text-field-input-wrapper__toolbar {\n position: relative;\n top: 9px;\n }\n\n .redsift-icon-button:not(.redsift-pill > .redsift-icon-button) {\n padding: 2px;\n position: relative;\n top: -2px;\n height: 28px;\n width: 28px;\n }\n\n ${$variant !== TextFieldVariant.underline\n ? css`\n .redsift-icon.left {\n padding-left: 12px;\n padding-right: 8px;\n line-height: 28px;\n }\n\n .redsift-text-field-input-wrapper__toolbar {\n padding-right: 8px;\n }\n `\n : css`\n .redsift-icon.left {\n padding-right: 8px;\n }\n `}\n\n .redsift-icon.left,\n .redsift-icon.right {\n top: 9px;\n }\n `}\n`;\n\n/**\n * Resolves background color from prop value.\n * Handles: boolean (true=warning), palette colors, and custom CSS values.\n */\nconst resolveBackgroundColor = (background: true | string): string => {\n if (background === true) {\n return 'var(--redsift-color-notifications-warning-primary)';\n }\n // Check if it's a notification palette color name\n const paletteColors = Object.values(NotificationsColorPalette);\n if (paletteColors.includes(background as NotificationsColorPalette)) {\n return `var(--redsift-color-notifications-${background}-primary)`;\n }\n // Assume it's a CSS color value (hex, rgb, etc.)\n return background;\n};\n\n/**\n * Styled marker for highlighted non-ASCII characters in TextField.\n */\nexport const StyledHighlightMarker = styled.mark<StyledHighlightOverlayProps>`\n ${({ $font, $background, $hasInvisible }) => css`\n /* Reset the default <mark> styling */\n background: ${$background ? resolveBackgroundColor($background) : 'transparent'};\n color: inherit;\n border-radius: 2px;\n padding: 0 1px;\n position: relative;\n\n /* Use Inconsolata with bold weight to break kerning and reveal lookalike chars */\n ${$font &&\n css`\n font-family: var(--redsift-typography-font-family-inconsolata);\n font-weight: 700;\n `}\n\n /* Show a visual indicator for invisible/zero-width characters */\n ${$hasInvisible &&\n css`\n &::after {\n content: '•';\n position: absolute;\n bottom: 0;\n left: 50%;\n transform: translateX(-50%);\n color: var(--redsift-color-neutral-x-dark-grey);\n ${$background &&\n css`\n background-color: ${resolveBackgroundColor($background)};\n opacity: 0.8;\n `}\n border-radius: 2px;\n pointer-events: none;\n }\n `}\n `}\n`;\n","import enUS from './en-US.json';\nimport frFR from './fr-FR.json';\n\nexport default {\n 'en-US': enUS,\n 'fr-FR': frFR,\n};\n","import React, {\n MouseEvent,\n ComponentProps,\n forwardRef,\n MutableRefObject,\n ReactNode,\n useCallback,\n useState,\n} from 'react';\nimport classNames from 'classnames';\nimport { useFocusRing } from '../../react-aria/react-aria/focus';\nimport { useFocusWithin } from '../../react-aria/react-aria/interactions';\nimport { ButtonsColorPalette, Comp, getStylingTransientProps } from '../../types';\nimport { warnIfNoAccessibleLabelFound } from '../../utils/warnIfNoAccessibleLabelFound';\nimport {\n isNonAscii,\n containsInvisibleChars,\n normalizeHighlightOptions,\n NormalizedHighlightOptions,\n} from '../../utils/highlightNonAscii';\nimport { TextFieldPillsLayout, TextFieldProps, TextFieldVariant } from './types';\nimport { StyledTextField, StyledHighlightMarker } from './styles';\nimport { Icon } from '../../components/icon';\nimport { mdiClose } from '@redsift/icons';\nimport { Flexbox } from '../flexbox';\nimport { IconButton } from '../icon-button';\nimport { Pill } from '../pill';\nimport { useTheme } from '../theme';\nimport { useMessageFormatter } from '../../react-aria/react-aria/i18n';\nimport { useId } from '../../utils';\n\nimport intlMessages from './intl';\n\nconst COMPONENT_NAME = 'TextField';\nconst CLASSNAME = 'redsift-text-field';\n\n/**\n * Processes a string and wraps consecutive non-ASCII characters in highlight markers.\n * Groups consecutive non-ASCII characters to minimize DOM nodes.\n * Invisible characters are NOT replaced (to maintain width alignment) but marked\n * with a $hasInvisible prop for CSS-based visual indication.\n */\nconst highlightNonAsciiChars = (text: string, options: NormalizedHighlightOptions): ReactNode[] => {\n const result: ReactNode[] = [];\n let currentAscii = '';\n let currentNonAscii = '';\n let keyIndex = 0;\n\n // Use Array.from to correctly handle Unicode surrogate pairs (e.g., emojis)\n const chars = Array.from(text);\n\n for (const char of chars) {\n if (isNonAscii(char)) {\n // Flush ASCII buffer\n if (currentAscii) {\n result.push(currentAscii);\n currentAscii = '';\n }\n currentNonAscii += char;\n } else {\n // Flush non-ASCII buffer\n if (currentNonAscii) {\n result.push(\n <StyledHighlightMarker\n key={keyIndex++}\n $font={options.font}\n $background={options.background}\n $hasInvisible={containsInvisibleChars(currentNonAscii)}\n >\n {currentNonAscii}\n </StyledHighlightMarker>\n );\n currentNonAscii = '';\n }\n currentAscii += char;\n }\n }\n\n // Flush remaining buffers\n if (currentAscii) {\n result.push(currentAscii);\n }\n if (currentNonAscii) {\n result.push(\n <StyledHighlightMarker\n key={keyIndex}\n $font={options.font}\n $background={options.background}\n $hasInvisible={containsInvisibleChars(currentNonAscii)}\n >\n {currentNonAscii}\n </StyledHighlightMarker>\n );\n }\n\n return result;\n};\n\n/**\n * TextField allows users to enter single-line text input. Supports validation,\n * icons, clear button, and controlled/uncontrolled modes.\n *\n * Variants: `default` (bordered), `underline` (bottom border only)\n * Colors: `primary`, `success`, `warning`, `error`, `info`, `question`, `neutral`, `radar`\n *\n * @example\n * // Basic text field\n * <TextField label=\"Email\" type=\"email\" placeholder=\"Enter email...\" />\n *\n * @example\n * // Controlled with validation\n * const [username, setUsername] = useState('');\n * <TextField\n * label=\"Username\"\n * value={username}\n * onChange={setUsername}\n * isInvalid={username.length < 3}\n * isRequired\n * />\n *\n * @example\n * // Search field with icon and clear button\n * <TextField\n * label=\"Search\"\n * leftIcon={{ icon: mdiMagnify }}\n * hasClearButton\n * onClear={() => setQuery('')}\n * value={query}\n * onChange={setQuery}\n * />\n *\n * @example\n * // Underline variant\n * <TextField label=\"Name\" variant=\"underline\" />\n *\n * @example\n * // States\n * <TextField label=\"Disabled\" isDisabled />\n * <TextField label=\"Read-only\" isReadOnly value=\"Cannot edit\" />\n * <TextField label=\"Required\" isRequired />\n * <TextField label=\"Invalid\" isInvalid />\n *\n * @example\n * // With internal buttons (copy, generate, etc.)\n * <TextField\n * label=\"API Key\"\n * value={apiKey}\n * internal={(props) => (\n * <IconButton icon={mdiContentCopy} aria-label=\"Copy\" onClick={handleCopy} />\n * )}\n * />\n *\n * @example\n * // With pills (tag input pattern)\n * <TextField\n * label=\"Tags\"\n * pills={tags.map(tag => ({ label: tag, onDelete: () => removeTag(tag) }))}\n * />\n *\n * @example\n * // Colored field (Radar AI)\n * <TextField label=\"Radar Prompt\" color=\"radar\" />\n */\nexport const TextField: Comp<TextFieldProps, HTMLDivElement> = forwardRef((props, ref) => {\n const { transientProps, otherProps } = getStylingTransientProps(props);\n\n const {\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledby,\n after,\n autoFocus,\n className,\n color: propsColor,\n defaultValue = '',\n forceColor,\n hasClearButton,\n highlightNonAscii,\n inputProps,\n inputRef,\n internal,\n isColored = true,\n isDisabled,\n isInvalid,\n isReadOnly,\n isRequired,\n label,\n leftIcon,\n name,\n onBlur: onBlurProps,\n onChange,\n onClear,\n onFocus: onFocusProps,\n pills,\n pillsLayout = TextFieldPillsLayout.wrap,\n placeholder,\n theme: propsTheme,\n type,\n value: propsValue,\n variant = TextFieldVariant.default,\n ...forwardedProps\n } = otherProps;\n\n const theme = useTheme(propsTheme);\n const color = Object.values(ButtonsColorPalette).includes(propsColor!) ? propsColor : isColored ? 'primary' : 'grey';\n const isGradient = color === ButtonsColorPalette.radar;\n\n const format = useMessageFormatter(intlMessages);\n\n const {\n isFocusVisible,\n isFocused,\n focusProps: { onFocus, onBlur },\n } = useFocusRing({\n autoFocus,\n });\n const [isFocusWithin, setFocusWithin] = useState(Boolean(autoFocus));\n const { focusWithinProps } = useFocusWithin({\n onFocusWithinChange: (isFocusWithin) => setFocusWithin(isFocusWithin),\n });\n\n const [value, setValue] = useState(defaultValue);\n const isControlled = propsValue !== null && propsValue !== undefined;\n\n const [labelId] = useId();\n\n // Normalize highlight options - force font: false since the input uses Inconsolata directly\n const highlightOptions = highlightNonAscii ? { ...normalizeHighlightOptions(highlightNonAscii), font: false } : null;\n\n warnIfNoAccessibleLabelFound(props as ComponentProps<'label'>, [label], 'TextField');\n\n const handleChange = useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n if (isDisabled || isReadOnly) {\n return;\n }\n\n if (onChange) {\n onChange(event.target.value, name, event);\n } else {\n setValue(event.target.value);\n }\n },\n [onChange]\n );\n\n const handleClear = useCallback(() => {\n if (isDisabled || isReadOnly) {\n return;\n }\n\n if (onChange) {\n onChange('');\n }\n if (onClear) {\n onClear();\n }\n if (hasClearButton && hasClearButton !== true && hasClearButton.onClick) {\n hasClearButton.onClick({} as MouseEvent<HTMLButtonElement>);\n }\n setValue('');\n }, [onChange]);\n\n // The asterisk is the required indicator, decoupled from the invalid (red\n // border) state — see DS-34. aria-hidden because `aria-required` on the input\n // already conveys the required state to assistive tech; the `*` is visual only.\n const requiredMark = isRequired ? (\n <span className={`${TextField.className}__asterisk`} aria-hidden=\"true\">\n *\n </span>\n ) : null;\n\n return (\n <StyledTextField\n {...focusWithinProps}\n {...forwardedProps}\n {...transientProps}\n $label={label}\n $hasContent={\n isFocusWithin ||\n Boolean(isControlled ? propsValue : value) ||\n Boolean(placeholder) ||\n Boolean(pills && pills.length > 0)\n }\n $hasLeftIcon={Boolean(leftIcon)}\n $hasHighlightOverlay={Boolean(highlightNonAscii)}\n $color={color}\n $isGradient={isGradient}\n $isDisabled={isDisabled}\n $isFocusVisible={isFocusVisible}\n $isInvalid={isInvalid}\n $isRequired={isRequired}\n $isFocused={Boolean(isFocused || forceColor)}\n $pillsLayout={pillsLayout}\n $theme={theme}\n $variant={variant}\n className={classNames(TextField.className, className)}\n ref={ref as MutableRefObject<HTMLDivElement>}\n >\n <fieldset aria-hidden=\"true\" className={`${TextField.className}-input-wrapper__fieldset`}>\n <legend id={labelId} className={`${TextField.className}-input-wrapper-fieldset__legend`}>\n {label ? (\n <span>\n {label}\n {requiredMark}\n </span>\n ) : null}\n </legend>\n </fieldset>\n {label ? (\n <label className={`${TextField.className}__label`}>\n <span>\n {label}\n {requiredMark}\n </span>\n </label>\n ) : null}\n <div className={`${TextField.className}__input-wrapper`}>\n {leftIcon ? (\n <Icon color={isDisabled ? 'question' : 'black'} {...leftIcon} aria-hidden=\"true\" className=\"left\" />\n ) : null}\n <div className={`${TextField.className}-input-wrapper__pills-and-input`}>\n <div className={`${TextField.className}-input-wrapper-pills-and-input__input-container`}>\n {highlightOptions ? (\n <div\n className={`${TextField.className}-input-wrapper-pills-and-input__highlight-overlay`}\n aria-hidden=\"true\"\n >\n {highlightNonAsciiChars((isControlled ? propsValue : value) || '', highlightOptions)}\n </div>\n ) : null}\n <input\n {...inputProps}\n onBlur={(event) => {\n onBlur?.(event);\n onBlurProps?.(event);\n }}\n onFocus={(event) => {\n onFocus?.(event);\n onFocusProps?.(event);\n }}\n aria-disabled={isDisabled}\n aria-invalid={isInvalid || undefined}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledby || (label ? labelId : undefined)}\n aria-readonly={isReadOnly}\n aria-required={isRequired}\n autoFocus={autoFocus}\n className={`${TextField.className}-input-wrapper-pills-and-input__input`}\n disabled={isDisabled}\n name={name}\n onChange={handleChange}\n placeholder={placeholder}\n ref={inputRef as MutableRefObject<HTMLInputElement>}\n type={type}\n value={isControlled ? propsValue : value}\n />\n </div>\n <div className={`${TextField.className}-input-wrapper-pills-and-input__pills`}>\n {pills?.map((pill, index) => (\n <Pill theme={theme} key={`${labelId}-pill-${index}`} color=\"blue\" size=\"small\" {...pill} />\n ))}\n </div>\n </div>\n {hasClearButton || internal || after ? (\n <Flexbox className={`${TextField.className}-input-wrapper__toolbar`} gap=\"8px\">\n {hasClearButton ? (\n <IconButton\n theme={theme}\n aria-label={label ? format('clear-field', { label }) : format('clear')}\n color=\"grey\"\n isDisabled={isDisabled}\n icon={mdiClose}\n {...(hasClearButton !== true && hasClearButton)}\n onClick={handleClear}\n className=\"right clear\"\n />\n ) : null}\n {typeof internal === 'function'\n ? internal(\n isControlled ? propsValue : value,\n isDisabled,\n isInvalid,\n isRequired\n )\n : internal}\n {(hasClearButton || internal) && after ? (\n <span\n style={{\n borderLeft: '1px solid var(--redsift-color-neutral-mid-grey)',\n position: 'relative',\n top: '-2px',\n }}\n />\n ) : null}\n {typeof after === 'function'\n ? after(\n isControlled ? propsValue : value,\n isDisabled,\n isInvalid,\n isRequired\n )\n : after}\n </Flexbox>\n ) : null}\n </div>\n </StyledTextField>\n );\n});\nTextField.className = CLASSNAME;\nTextField.displayName = COMPONENT_NAME;\n"],"names":["TextFieldVariant","default","underline","TextFieldPillsLayout","wrap","inline","StyledTextField","styled","div","baseStyling","_ref","$label","$hasLeftIcon","$hasContent","$hasHighlightOverlay","$isFocused","$isDisabled","$isInvalid","$color","$isGradient","$pillsLayout","$theme","$variant","css","Theme","dark","resolveBackgroundColor","background","paletteColors","Object","values","NotificationsColorPalette","includes","StyledHighlightMarker","mark","_ref2","$font","$background","$hasInvisible","enUS","frFR","COMPONENT_NAME","CLASSNAME","highlightNonAsciiChars","text","options","result","currentAscii","currentNonAscii","keyIndex","chars","Array","from","char","isNonAscii","push","React","createElement","key","font","containsInvisibleChars","TextField","forwardRef","props","ref","transientProps","otherProps","getStylingTransientProps","ariaLabel","ariaLabelledby","after","autoFocus","className","color","propsColor","defaultValue","forceColor","hasClearButton","highlightNonAscii","inputProps","inputRef","internal","isColored","isDisabled","isInvalid","isReadOnly","isRequired","label","leftIcon","name","onBlur","onBlurProps","onChange","onClear","onFocus","onFocusProps","pills","pillsLayout","placeholder","theme","propsTheme","type","value","propsValue","variant","forwardedProps","_objectWithoutProperties","_excluded","useTheme","ButtonsColorPalette","isGradient","radar","format","useMessageFormatter","intlMessages","isFocusVisible","isFocused","focusProps","useFocusRing","isFocusWithin","setFocusWithin","useState","Boolean","focusWithinProps","useFocusWithin","onFocusWithinChange","setValue","isControlled","undefined","labelId","useId","highlightOptions","_objectSpread","normalizeHighlightOptions","warnIfNoAccessibleLabelFound","handleChange","useCallback","event","target","handleClear","onClick","requiredMark","_extends","length","$isFocusVisible","$isRequired","classNames","id","Icon","disabled","map","pill","index","Pill","size","Flexbox","gap","IconButton","icon","mdiClose","style","borderLeft","position","top","displayName"],"mappings":"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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,UAAA,CAAW,GACD,EAAG,CAAA;AACb;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,mBAAA,EAAqBT,oBAAoB,GAC/B,mDAAmD,GACnD,kDAAmD,CAAA;AAC7D;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAQE,EAAAA,WAAW,GACTO,GAAI,CAAA;AACd;AACA,UAAW,CAAA,GACDT,oBAAoB,GACpBS,GAAI,CAAA;AACd;AACA,qDAAuDF,EAAAA,MAAM,KAAKG,KAAK,CAACC,IAAI,GAAG,OAAO,GAAG,aAAc,CAAA;AACvG,UAAA,CAAW,GACDF,GAAI,CAAA;AACd,+CAAiDF,EAAAA,MAAM,KAAKG,KAAK,CAACC,IAAI,GAAG,OAAO,GAAG,aAAc,CAAA;AACjG,UAAY,CAAA,CAAA;AACZ;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,yCAA2CJ,EAAAA,MAAM,KAAKG,KAAK,CAACC,IAAI,GAAG,OAAO,GAAG,aAAc,CAAA;AAC3F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAQ,EAAA,CAACN,WAAW,IAAIH,WAAW,IAAI,CAACD,UAAU,IAAIE,UAAU,GACtDM,GAAI,CAAA;AACd,YAAA,EAAcD,QAAQ,KAAKtB,gBAAgB,CAACE,SAAS,GACrCqB,GAAI,CAAA;AACpB;AACA,gBAAA,CAAiB,GACDA,GAAI,CAAA;AACpB;AACA;AACA,gBAAkB,CAAA,CAAA;AAClB;AACA,8BAAA,EAAgCF,MAAO,CAAuCJ,qCAAAA,EAAAA,UAAU,GACxE,OAAO,GACPF,UAAU,GACVG,MAAM,GACN,MAAO,CAAQF,MAAAA,EAAAA,WAAW,GAAG,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"}
|
|
1
|
+
{"version":3,"file":"TextField.js","sources":["../../src/components/text-field/types.ts","../../src/components/text-field/styles.ts","../../src/components/text-field/intl/index.ts","../../src/components/text-field/TextField.tsx"],"sourcesContent":["import { ChangeEvent, ComponentProps, ReactNode, RefObject } from 'react';\nimport { ButtonsColorPalette, StylingProps, StylingTransientProps, Theme, ValueOf } from '../../types';\nimport { IconProps } from '../icon';\nimport { IconButtonProps } from '../icon-button';\nimport { PillProps } from '../pill';\nimport { HighlightNonAsciiOptions } from '../../utils/highlightNonAscii';\n\n/**\n * Component variant.\n */\nexport const TextFieldVariant = {\n default: 'default',\n underline: 'underline',\n} as const;\nexport type TextFieldVariant = ValueOf<typeof TextFieldVariant>;\n\n/**\n * Layout of the Pills relative to the input.\n */\nexport const TextFieldPillsLayout = {\n wrap: 'wrap',\n inline: 'inline',\n} as const;\nexport type TextFieldPillsLayout = ValueOf<typeof TextFieldPillsLayout>;\n\n/**\n * Component color.\n */\nexport type TextFieldColor = ButtonsColorPalette;\n\n/**\n * Component props.\n */\nexport interface TextFieldProps extends Omit<ComponentProps<'div'>, 'onChange'>, StylingProps {\n /** Whether the component can be autofocused. */\n autoFocus?: boolean;\n /** Color variant. */\n color?: TextFieldColor;\n /** Force color even when not focused. */\n forceColor?: boolean;\n /**\n * Default value.\n * Used for uncontrolled version.\n */\n defaultValue?: string;\n /** Whether the clear button is displayed or not. */\n hasClearButton?: boolean | Omit<Partial<IconButtonProps>, 'ref'>;\n /** Place for icon buttons between the clear button and the separator. */\n internal?:\n | ReactNode\n | ((value?: string, isDisabled?: boolean, isInvalid?: boolean, isRequired?: boolean) => ReactNode);\n /** Place for icon buttons after the separator. */\n after?: ReactNode | ((value?: string, isDisabled?: boolean, isInvalid?: boolean, isRequired?: boolean) => ReactNode);\n /** Custom props to pass to the input element. */\n inputProps?: ComponentProps<'input'>;\n /** Custom ref object to pass to the input element. */\n inputRef?: RefObject<HTMLInputElement | null>;\n /** @deprecated Whether the component should use the product colors or shades of grey. */\n isColored?: boolean;\n /** Whether the component is disabled or not. */\n isDisabled?: boolean;\n /**\n * Whether the component is invalid or not. This is the *only* trigger for the\n * error (red) border and `aria-invalid`; drive it yourself (e.g. on blur) for\n * touch-based validation. `isRequired` no longer implies it.\n */\n isInvalid?: boolean;\n /** Whether the component is read only or not. */\n isReadOnly?: boolean;\n /**\n * Whether the component is required or not. Renders an asterisk (*) next to\n * the label and sets `aria-required`. The asterisk inherits the label colour\n * (neutral by default); it does **not** set the error border and is not red on\n * its own — pass `isInvalid` for the red/error state.\n */\n isRequired?: boolean;\n /** Label */\n label?: string;\n /**\n * Can be a string or an array of strings containing `d` property of the `path` SVG element.<br />\n * Can also be a ReactElement.\n */\n leftIcon?: Omit<IconProps, 'ref'>;\n /** Name to pass to the input element. */\n name?: string;\n /** Method to handle component change. */\n onChange?(value?: string, name?: string, event?: ChangeEvent<HTMLInputElement>): void;\n /** Method to handle component clear. */\n onClear?(): void;\n /** List of Pills. */\n pills?: Omit<PillProps, 'ref'>[];\n /**\n * How the Pills are laid out relative to the input.\n *\n * - `wrap`: Pills wrap onto new lines above the input and the field grows vertically (legacy behaviour).\n * - `inline`: Pills and input share a single line; the field never grows. Pills shrink and truncate\n * their text with an ellipsis instead of wrapping. Meant for triggers that bound the number of Pills\n * themselves (see `Combobox.Trigger` `pillsOverflow`).\n *\n * @default 'wrap'\n */\n pillsLayout?: TextFieldPillsLayout;\n /** Placeholder. */\n placeholder?: string;\n /** Theme. */\n theme?: Theme;\n /** Input type. */\n type?: string;\n /**\n * Input value.\n * Used for controlled version.\n */\n value?: string;\n /**\n * TextField variant.\n * @default 'default'\n */\n variant?: TextFieldVariant;\n /**\n * Highlight non-ASCII characters in the input. Useful for IDN domain names where\n * Unicode lookalike characters can be confusing. Uses an overlay to display\n * highlighted characters while maintaining input functionality.\n *\n * - `true`: enables both font change and background highlight\n * - `{ font?: boolean, background?: boolean | string }`: fine-grained control\n *\n * @example\n * // Both font and background (default)\n * <TextField highlightNonAscii label=\"Domain\" />\n *\n * @example\n * // Background only\n * <TextField highlightNonAscii={{ font: false }} label=\"Domain\" />\n */\n highlightNonAscii?: boolean | HighlightNonAsciiOptions;\n}\n\nexport interface StyledTextFieldProps extends ComponentProps<'div'>, StylingTransientProps {\n $label?: TextFieldProps['label'];\n $color: TextFieldProps['color'];\n $isGradient: boolean;\n $hasLeftIcon: boolean;\n $hasContent: boolean;\n $hasHighlightOverlay: boolean;\n $isDisabled: TextFieldProps['isDisabled'];\n $isInvalid: TextFieldProps['isInvalid'];\n $isFocused: boolean;\n $isFocusVisible: boolean;\n $isRequired: TextFieldProps['isRequired'];\n $pillsLayout?: TextFieldProps['pillsLayout'];\n $theme: TextFieldProps['theme'];\n $variant: TextFieldProps['variant'];\n}\n\nexport interface StyledHighlightOverlayProps {\n $font: boolean;\n $background: boolean | string;\n $hasInvisible?: boolean;\n}\n","import styled, { css } from 'styled-components';\nimport { baseStyling } from '../shared';\nimport { StyledTextFieldProps, StyledHighlightOverlayProps, TextFieldPillsLayout, TextFieldVariant } from './types';\nimport { Theme, NotificationsColorPalette } from '../../types';\n\n/* eslint-disable @redsift/ds/no-outline-none-without-indicator -- the input's own outline is replaced by the field's border, which turns the focus colour through $isFocused */\n/**\n * Component style.\n */\nexport const StyledTextField = styled.div<StyledTextFieldProps>`\n height: fit-content;\n position: relative;\n width: fit-content;\n margin: 0;\n min-width: 0;\n padding: 0;\n ${baseStyling}\n\n border: 0;\n display: inline-flex;\n flex-direction: column;\n vertical-align: top;\n\n ${({\n $label,\n $hasLeftIcon,\n $hasContent,\n $hasHighlightOverlay,\n $isFocused,\n $isDisabled,\n $isInvalid,\n $color,\n $isGradient,\n $pillsLayout,\n $theme,\n $variant,\n }) => css`\n ${$isDisabled\n ? css`\n pointer-events: none;\n `\n : ''}\n\n .redsift-text-field__label {\n font-family: var(--redsift-typography-input-text-font-family);\n font-size: var(--redsift-typography-input-text-font-size);\n font-weight: var(--redsift-typography-input-text-font-weight);\n line-height: var(--redsift-typography-input-text-line-height);\n left: ${$hasLeftIcon && !$hasContent ? '32px' : '0'};\n overflow: hidden;\n pointer-events: none;\n position: absolute;\n text-overflow: ellipsis;\n top: ${$hasContent ? '-8px' : '-7px'};\n transform-origin: top left;\n transition: color 200ms cubic-bezier(0, 0, 0.2, 1) 0ms, transform 200ms cubic-bezier(0, 0, 0.2, 1) 0ms,\n max-width 200ms cubic-bezier(0, 0, 0.2, 1) 0ms;\n white-space: nowrap;\n z-index: 1;\n\n ${!$hasContent\n ? css`\n max-width: calc(100% - 24px);\n transform: translate(${$variant === TextFieldVariant.underline ? '0px' : '14px'}, 16px) scale(1);\n `\n : css`\n max-width: calc(133% - 32px);\n transform: translate(${$variant === TextFieldVariant.underline ? '0px' : '14px'}, 1px) scale(0.733);\n `}\n\n ${!$isGradient\n ? css`\n color: var(\n --redsift-color-${$theme}-components-buttons-secondary-button-${$isInvalid\n ? 'error'\n : $isFocused\n ? $color\n : 'grey'}-text-${$isDisabled ? 'disabled' : 'default'}\n );\n `\n : css`\n background-color: var(--redsift-color-neutral-${$theme === Theme.dark ? 'x-dark-grey' : 'white'});\n ${$variant !== TextFieldVariant.underline\n ? css`\n padding-right: 7px;\n padding-left: 5px;\n `\n : ''}\n > span {\n background: var(\n --redsift-color-${$theme}-components-buttons-secondary-button-${$isInvalid\n ? 'error'\n : $isFocused\n ? $color\n : 'grey'}-text-${$isDisabled ? 'disabled' : 'default'}\n );\n background-clip: text;\n color: transparent;\n }\n `}\n }\n\n /* Required indicator (DS-34): an asterisk, independent of the invalid state.\n Rendered inside both the visible label and the (hidden) legend so the\n fieldset notch reserves the same width. It inherits the label colour\n (neutral by default, product colour on focus) — deliberately NOT red for a\n plain required field. Red is reserved for the invalid state, which the\n label colour already drives, so the asterisk turns red only when isInvalid. */\n .redsift-text-field__asterisk {\n margin-left: 2px;\n color: inherit;\n }\n\n .redsift-text-field__input-wrapper {\n align-items: flex-start;\n box-sizing: border-box;\n cursor: text;\n display: inline-flex;\n min-height: 42px;\n position: relative;\n }\n\n .redsift-text-field-input-wrapper__pills-and-input {\n align-items: flex-start;\n box-sizing: border-box;\n display: flex;\n flex-direction: column-reverse;\n flex-wrap: wrap;\n flex: 1 1 auto;\n padding-bottom: 7px;\n ${$variant !== TextFieldVariant.underline && !$hasLeftIcon\n ? css`\n padding-left: 16px;\n `\n : ''}\n ${$variant !== TextFieldVariant.underline\n ? css`\n padding-right: 16px;\n `\n : ''}\n padding-top: ${$label ? '9px' : '7px'};\n\n .redsift-pill {\n margin: 3px 6px 3px 0;\n }\n\n ${$pillsLayout === TextFieldPillsLayout.inline\n ? css`\n /* Single-line layout: pills first, input takes the remaining space, nothing wraps.\n flex-basis 0 + overflow hidden: the row only ever takes the space the toolbar leaves,\n so pills/input can never sit on top of the clear/expand buttons. */\n align-items: center;\n flex: 1 1 0%;\n flex-direction: row;\n flex-wrap: nowrap;\n min-width: 0;\n overflow: hidden;\n\n .redsift-text-field-input-wrapper-pills-and-input__pills {\n display: flex;\n flex: 0 1 auto;\n flex-wrap: nowrap;\n min-width: 0;\n order: -1;\n overflow: hidden;\n\n .redsift-pill {\n /* No \\`flex\\` shorthand here: a Pill may opt out of shrinking via its own \\`flexShrink\\` prop. */\n flex-basis: auto;\n flex-grow: 0;\n max-width: 100%;\n min-width: 0;\n overflow: hidden;\n\n .redsift-text {\n display: block;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n }\n }\n\n .redsift-text-field-input-wrapper-pills-and-input__input-container,\n .redsift-text-field-input-wrapper-pills-and-input__input {\n flex: 1 1 40px;\n min-width: 40px;\n width: auto;\n }\n `\n : ''}\n }\n\n .redsift-text-field-input-wrapper-pills-and-input__input {\n background: none;\n border: 0;\n box-sizing: content-box;\n display: flex;\n flex: 1 1 auto;\n font-family: ${$hasHighlightOverlay\n ? 'var(--redsift-typography-font-family-inconsolata)'\n : 'var(--redsift-typography-input-text-font-family)'};\n font-size: var(--redsift-typography-input-text-font-size);\n font-weight: var(--redsift-typography-input-text-font-weight);\n line-height: var(--redsift-typography-input-text-line-height);\n min-width: 0;\n min-width: 100px;\n padding: 2px 0;\n width: 100%;\n\n ${$isDisabled\n ? css`\n color: var(--redsift-color-grey-l2);\n `\n : $hasHighlightOverlay\n ? css`\n color: transparent;\n caret-color: var(--redsift-color-neutral-${$theme === Theme.dark ? 'white' : 'x-dark-grey'});\n `\n : css`\n color: var(--redsift-color-neutral-${$theme === Theme.dark ? 'white' : 'x-dark-grey'});\n `}\n }\n\n .redsift-text-field-input-wrapper-pills-and-input__input-container {\n position: relative;\n display: flex;\n flex: 1 1 auto;\n min-width: 100px;\n width: 100%;\n }\n\n .redsift-text-field-input-wrapper-pills-and-input__highlight-overlay {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n pointer-events: none;\n font-family: var(--redsift-typography-font-family-inconsolata);\n font-size: var(--redsift-typography-input-text-font-size);\n font-weight: var(--redsift-typography-input-text-font-weight);\n line-height: var(--redsift-typography-input-text-line-height);\n padding: 2px 0;\n white-space: pre;\n overflow: hidden;\n color: var(--redsift-color-neutral-${$theme === Theme.dark ? 'white' : 'x-dark-grey'});\n\n /* Remove padding from marks to maintain exact character alignment with input */\n mark {\n padding: 0;\n }\n }\n\n .redsift-text-field-input-wrapper-pills-and-input__input::placeholder {\n color: var(--redsift-color-neutral-mid-grey);\n }\n\n .redsift-text-field-input-wrapper-pills-and-input__input:focus {\n outline: 0;\n }\n\n .redsift-text-field-input-wrapper__fieldset {\n border-style: solid;\n bottom: 0;\n left: 1px;\n margin: 0;\n min-width: 0%;\n overflow: hidden;\n padding: 0 8px;\n pointer-events: none;\n position: absolute;\n right: 0;\n text-align: left;\n top: -5px;\n\n ${!$isGradient || $isDisabled || !$isFocused || $isInvalid\n ? css`\n ${$variant === TextFieldVariant.underline\n ? css`\n border-bottom-width: 2px;\n `\n : css`\n border-radius: 4px;\n border-width: 2px;\n `}\n border-color: var(\n --redsift-color-${$theme}-components-buttons-secondary-button-${$isInvalid\n ? 'error'\n : $isFocused\n ? $color\n : 'grey'}-text-${$isDisabled ? 'disabled' : 'default'}\n );\n `\n : css`\n ${$variant === TextFieldVariant.underline\n ? css`\n border-bottom: 2px solid transparent;\n `\n : css`\n border: 2px solid transparent;\n border-radius: 4px;\n `}\n background: transparent;\n background-clip: padding-box, border-box;\n background-origin: border-box;\n background-image: linear-gradient(\n 90deg,\n var(--redsift-color-neutral-${$theme === Theme.dark ? 'x-dark-grey' : 'white'}),\n var(--redsift-color-neutral-${$theme === Theme.dark ? 'x-dark-grey' : 'white'})\n ),\n var(--redsift-color-${$theme}-components-buttons-secondary-button-${$color}-text-default);\n `}\n }\n\n .redsift-text-field-input-wrapper-fieldset__legend {\n display: block;\n float: unset;\n font-size: 11px;\n height: 11px;\n overflow: hidden;\n padding: 0;\n visibility: hidden;\n white-space: nowrap;\n width: auto;\n\n ${!$hasContent\n ? css`\n max-width: 0.01px;\n transition: max-width 50ms cubic-bezier(0, 0, 0.2, 1) 0ms;\n `\n : css`\n max-width: 100%;\n transition: max-width 100ms cubic-bezier(0, 0, 0.2, 1) 50ms;\n `}\n }\n\n .redsift-text-field-input-wrapper-fieldset__legend > span {\n display: inline-block;\n opacity: 0;\n padding-left: 5px;\n padding-right: 5px;\n visibility: visible;\n }\n\n .redsift-text-field-input-wrapper__toolbar {\n position: relative;\n top: 9px;\n }\n\n .redsift-icon-button:not(.redsift-pill > .redsift-icon-button) {\n padding: 2px;\n position: relative;\n top: -2px;\n height: 28px;\n width: 28px;\n }\n\n ${$variant !== TextFieldVariant.underline\n ? css`\n .redsift-icon.left {\n padding-left: 12px;\n padding-right: 8px;\n line-height: 28px;\n }\n\n .redsift-text-field-input-wrapper__toolbar {\n padding-right: 8px;\n }\n `\n : css`\n .redsift-icon.left {\n padding-right: 8px;\n }\n `}\n\n .redsift-icon.left,\n .redsift-icon.right {\n top: 9px;\n }\n `}\n`;\n/* eslint-enable @redsift/ds/no-outline-none-without-indicator */\n\n/**\n * Resolves background color from prop value.\n * Handles: boolean (true=warning), palette colors, and custom CSS values.\n */\nconst resolveBackgroundColor = (background: true | string): string => {\n if (background === true) {\n return 'var(--redsift-color-notifications-warning-primary)';\n }\n // Check if it's a notification palette color name\n const paletteColors = Object.values(NotificationsColorPalette);\n if (paletteColors.includes(background as NotificationsColorPalette)) {\n return `var(--redsift-color-notifications-${background}-primary)`;\n }\n // Assume it's a CSS color value (hex, rgb, etc.)\n return background;\n};\n\n/**\n * Styled marker for highlighted non-ASCII characters in TextField.\n */\nexport const StyledHighlightMarker = styled.mark<StyledHighlightOverlayProps>`\n ${({ $font, $background, $hasInvisible }) => css`\n /* Reset the default <mark> styling */\n background: ${$background ? resolveBackgroundColor($background) : 'transparent'};\n color: inherit;\n border-radius: 2px;\n padding: 0 1px;\n position: relative;\n\n /* Use Inconsolata with bold weight to break kerning and reveal lookalike chars */\n ${$font &&\n css`\n font-family: var(--redsift-typography-font-family-inconsolata);\n font-weight: 700;\n `}\n\n /* Show a visual indicator for invisible/zero-width characters */\n ${$hasInvisible &&\n css`\n &::after {\n content: '•';\n position: absolute;\n bottom: 0;\n left: 50%;\n transform: translateX(-50%);\n color: var(--redsift-color-neutral-x-dark-grey);\n ${$background &&\n css`\n background-color: ${resolveBackgroundColor($background)};\n opacity: 0.8;\n `}\n border-radius: 2px;\n pointer-events: none;\n }\n `}\n `}\n`;\n","import enUS from './en-US.json';\nimport frFR from './fr-FR.json';\n\nexport default {\n 'en-US': enUS,\n 'fr-FR': frFR,\n};\n","import React, {\n MouseEvent,\n ComponentProps,\n forwardRef,\n MutableRefObject,\n ReactNode,\n useCallback,\n useState,\n} from 'react';\nimport classNames from 'classnames';\nimport { useFocusRing } from '../../react-aria/react-aria/focus';\nimport { useFocusWithin } from '../../react-aria/react-aria/interactions';\nimport { ButtonsColorPalette, Comp, getStylingTransientProps } from '../../types';\nimport { warnIfNoAccessibleLabelFound } from '../../utils/warnIfNoAccessibleLabelFound';\nimport {\n isNonAscii,\n containsInvisibleChars,\n normalizeHighlightOptions,\n NormalizedHighlightOptions,\n} from '../../utils/highlightNonAscii';\nimport { TextFieldPillsLayout, TextFieldProps, TextFieldVariant } from './types';\nimport { StyledTextField, StyledHighlightMarker } from './styles';\nimport { Icon } from '../../components/icon';\nimport { mdiClose } from '@redsift/icons';\nimport { Flexbox } from '../flexbox';\nimport { IconButton } from '../icon-button';\nimport { Pill } from '../pill';\nimport { useTheme } from '../theme';\nimport { useMessageFormatter } from '../../react-aria/react-aria/i18n';\nimport { useId } from '../../utils';\n\nimport intlMessages from './intl';\n\nconst COMPONENT_NAME = 'TextField';\nconst CLASSNAME = 'redsift-text-field';\n\n/**\n * Processes a string and wraps consecutive non-ASCII characters in highlight markers.\n * Groups consecutive non-ASCII characters to minimize DOM nodes.\n * Invisible characters are NOT replaced (to maintain width alignment) but marked\n * with a $hasInvisible prop for CSS-based visual indication.\n */\nconst highlightNonAsciiChars = (text: string, options: NormalizedHighlightOptions): ReactNode[] => {\n const result: ReactNode[] = [];\n let currentAscii = '';\n let currentNonAscii = '';\n let keyIndex = 0;\n\n // Use Array.from to correctly handle Unicode surrogate pairs (e.g., emojis)\n const chars = Array.from(text);\n\n for (const char of chars) {\n if (isNonAscii(char)) {\n // Flush ASCII buffer\n if (currentAscii) {\n result.push(currentAscii);\n currentAscii = '';\n }\n currentNonAscii += char;\n } else {\n // Flush non-ASCII buffer\n if (currentNonAscii) {\n result.push(\n <StyledHighlightMarker\n key={keyIndex++}\n $font={options.font}\n $background={options.background}\n $hasInvisible={containsInvisibleChars(currentNonAscii)}\n >\n {currentNonAscii}\n </StyledHighlightMarker>\n );\n currentNonAscii = '';\n }\n currentAscii += char;\n }\n }\n\n // Flush remaining buffers\n if (currentAscii) {\n result.push(currentAscii);\n }\n if (currentNonAscii) {\n result.push(\n <StyledHighlightMarker\n key={keyIndex}\n $font={options.font}\n $background={options.background}\n $hasInvisible={containsInvisibleChars(currentNonAscii)}\n >\n {currentNonAscii}\n </StyledHighlightMarker>\n );\n }\n\n return result;\n};\n\n/**\n * TextField allows users to enter single-line text input. Supports validation,\n * icons, clear button, and controlled/uncontrolled modes.\n *\n * Variants: `default` (bordered), `underline` (bottom border only)\n * Colors: `primary`, `success`, `warning`, `error`, `info`, `question`, `neutral`, `radar`\n *\n * @example\n * // Basic text field\n * <TextField label=\"Email\" type=\"email\" placeholder=\"Enter email...\" />\n *\n * @example\n * // Controlled with validation\n * const [username, setUsername] = useState('');\n * <TextField\n * label=\"Username\"\n * value={username}\n * onChange={setUsername}\n * isInvalid={username.length < 3}\n * isRequired\n * />\n *\n * @example\n * // Search field with icon and clear button\n * <TextField\n * label=\"Search\"\n * leftIcon={{ icon: mdiMagnify }}\n * hasClearButton\n * onClear={() => setQuery('')}\n * value={query}\n * onChange={setQuery}\n * />\n *\n * @example\n * // Underline variant\n * <TextField label=\"Name\" variant=\"underline\" />\n *\n * @example\n * // States\n * <TextField label=\"Disabled\" isDisabled />\n * <TextField label=\"Read-only\" isReadOnly value=\"Cannot edit\" />\n * <TextField label=\"Required\" isRequired />\n * <TextField label=\"Invalid\" isInvalid />\n *\n * @example\n * // With internal buttons (copy, generate, etc.)\n * <TextField\n * label=\"API Key\"\n * value={apiKey}\n * internal={(props) => (\n * <IconButton icon={mdiContentCopy} aria-label=\"Copy\" onClick={handleCopy} />\n * )}\n * />\n *\n * @example\n * // With pills (tag input pattern)\n * <TextField\n * label=\"Tags\"\n * pills={tags.map(tag => ({ label: tag, onDelete: () => removeTag(tag) }))}\n * />\n *\n * @example\n * // Colored field (Radar AI)\n * <TextField label=\"Radar Prompt\" color=\"radar\" />\n */\nexport const TextField: Comp<TextFieldProps, HTMLDivElement> = forwardRef((props, ref) => {\n const { transientProps, otherProps } = getStylingTransientProps(props);\n\n const {\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledby,\n after,\n autoFocus,\n className,\n color: propsColor,\n defaultValue = '',\n forceColor,\n hasClearButton,\n highlightNonAscii,\n inputProps,\n inputRef,\n internal,\n isColored = true,\n isDisabled,\n isInvalid,\n isReadOnly,\n isRequired,\n label,\n leftIcon,\n name,\n onBlur: onBlurProps,\n onChange,\n onClear,\n onFocus: onFocusProps,\n pills,\n pillsLayout = TextFieldPillsLayout.wrap,\n placeholder,\n theme: propsTheme,\n type,\n value: propsValue,\n variant = TextFieldVariant.default,\n ...forwardedProps\n } = otherProps;\n\n const theme = useTheme(propsTheme);\n const color = Object.values(ButtonsColorPalette).includes(propsColor!) ? propsColor : isColored ? 'primary' : 'grey';\n const isGradient = color === ButtonsColorPalette.radar;\n\n const format = useMessageFormatter(intlMessages);\n\n const {\n isFocusVisible,\n isFocused,\n focusProps: { onFocus, onBlur },\n } = useFocusRing({\n autoFocus,\n });\n const [isFocusWithin, setFocusWithin] = useState(Boolean(autoFocus));\n const { focusWithinProps } = useFocusWithin({\n onFocusWithinChange: (isFocusWithin) => setFocusWithin(isFocusWithin),\n });\n\n const [value, setValue] = useState(defaultValue);\n const isControlled = propsValue !== null && propsValue !== undefined;\n\n const [labelId] = useId();\n\n // Normalize highlight options - force font: false since the input uses Inconsolata directly\n const highlightOptions = highlightNonAscii ? { ...normalizeHighlightOptions(highlightNonAscii), font: false } : null;\n\n warnIfNoAccessibleLabelFound(props as ComponentProps<'label'>, [label], 'TextField');\n\n const handleChange = useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n if (isDisabled || isReadOnly) {\n return;\n }\n\n if (onChange) {\n onChange(event.target.value, name, event);\n } else {\n setValue(event.target.value);\n }\n },\n [onChange]\n );\n\n const handleClear = useCallback(() => {\n if (isDisabled || isReadOnly) {\n return;\n }\n\n if (onChange) {\n onChange('');\n }\n if (onClear) {\n onClear();\n }\n if (hasClearButton && hasClearButton !== true && hasClearButton.onClick) {\n hasClearButton.onClick({} as MouseEvent<HTMLButtonElement>);\n }\n setValue('');\n }, [onChange]);\n\n // The asterisk is the required indicator, decoupled from the invalid (red\n // border) state — see DS-34. aria-hidden because `aria-required` on the input\n // already conveys the required state to assistive tech; the `*` is visual only.\n const requiredMark = isRequired ? (\n <span className={`${TextField.className}__asterisk`} aria-hidden=\"true\">\n *\n </span>\n ) : null;\n\n return (\n <StyledTextField\n {...focusWithinProps}\n {...forwardedProps}\n {...transientProps}\n $label={label}\n $hasContent={\n isFocusWithin ||\n Boolean(isControlled ? propsValue : value) ||\n Boolean(placeholder) ||\n Boolean(pills && pills.length > 0)\n }\n $hasLeftIcon={Boolean(leftIcon)}\n $hasHighlightOverlay={Boolean(highlightNonAscii)}\n $color={color}\n $isGradient={isGradient}\n $isDisabled={isDisabled}\n $isFocusVisible={isFocusVisible}\n $isInvalid={isInvalid}\n $isRequired={isRequired}\n $isFocused={Boolean(isFocused || forceColor)}\n $pillsLayout={pillsLayout}\n $theme={theme}\n $variant={variant}\n className={classNames(TextField.className, className)}\n ref={ref as MutableRefObject<HTMLDivElement>}\n >\n <fieldset aria-hidden=\"true\" className={`${TextField.className}-input-wrapper__fieldset`}>\n <legend id={labelId} className={`${TextField.className}-input-wrapper-fieldset__legend`}>\n {label ? (\n <span>\n {label}\n {requiredMark}\n </span>\n ) : null}\n </legend>\n </fieldset>\n {label ? (\n <label className={`${TextField.className}__label`}>\n <span>\n {label}\n {requiredMark}\n </span>\n </label>\n ) : null}\n <div className={`${TextField.className}__input-wrapper`}>\n {leftIcon ? (\n <Icon color={isDisabled ? 'question' : 'black'} {...leftIcon} aria-hidden=\"true\" className=\"left\" />\n ) : null}\n <div className={`${TextField.className}-input-wrapper__pills-and-input`}>\n <div className={`${TextField.className}-input-wrapper-pills-and-input__input-container`}>\n {highlightOptions ? (\n <div\n className={`${TextField.className}-input-wrapper-pills-and-input__highlight-overlay`}\n aria-hidden=\"true\"\n >\n {highlightNonAsciiChars((isControlled ? propsValue : value) || '', highlightOptions)}\n </div>\n ) : null}\n <input\n {...inputProps}\n onBlur={(event) => {\n onBlur?.(event);\n onBlurProps?.(event);\n }}\n onFocus={(event) => {\n onFocus?.(event);\n onFocusProps?.(event);\n }}\n aria-disabled={isDisabled}\n aria-invalid={isInvalid || undefined}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledby || (label ? labelId : undefined)}\n aria-readonly={isReadOnly}\n aria-required={isRequired}\n // eslint-disable-next-line jsx-a11y/no-autofocus -- forwards the consumer's `autoFocus` prop\n autoFocus={autoFocus}\n className={`${TextField.className}-input-wrapper-pills-and-input__input`}\n disabled={isDisabled}\n name={name}\n onChange={handleChange}\n placeholder={placeholder}\n ref={inputRef as MutableRefObject<HTMLInputElement>}\n type={type}\n value={isControlled ? propsValue : value}\n />\n </div>\n <div className={`${TextField.className}-input-wrapper-pills-and-input__pills`}>\n {pills?.map((pill, index) => (\n <Pill theme={theme} key={`${labelId}-pill-${index}`} color=\"blue\" size=\"small\" {...pill} />\n ))}\n </div>\n </div>\n {hasClearButton || internal || after ? (\n <Flexbox className={`${TextField.className}-input-wrapper__toolbar`} gap=\"8px\">\n {hasClearButton ? (\n <IconButton\n theme={theme}\n aria-label={label ? format('clear-field', { label }) : format('clear')}\n color=\"grey\"\n isDisabled={isDisabled}\n icon={mdiClose}\n {...(hasClearButton !== true && hasClearButton)}\n onClick={handleClear}\n className=\"right clear\"\n />\n ) : null}\n {typeof internal === 'function'\n ? internal(\n isControlled ? propsValue : value,\n isDisabled,\n isInvalid,\n isRequired\n )\n : internal}\n {(hasClearButton || internal) && after ? (\n <span\n style={{\n borderLeft: '1px solid var(--redsift-color-neutral-mid-grey)',\n position: 'relative',\n top: '-2px',\n }}\n />\n ) : null}\n {typeof after === 'function'\n ? after(\n isControlled ? propsValue : value,\n isDisabled,\n isInvalid,\n isRequired\n )\n : after}\n </Flexbox>\n ) : null}\n </div>\n </StyledTextField>\n );\n});\nTextField.className = CLASSNAME;\nTextField.displayName = COMPONENT_NAME;\n"],"names":["TextFieldVariant","default","underline","TextFieldPillsLayout","wrap","inline","StyledTextField","styled","div","baseStyling","_ref","$label","$hasLeftIcon","$hasContent","$hasHighlightOverlay","$isFocused","$isDisabled","$isInvalid","$color","$isGradient","$pillsLayout","$theme","$variant","css","Theme","dark","resolveBackgroundColor","background","paletteColors","Object","values","NotificationsColorPalette","includes","StyledHighlightMarker","mark","_ref2","$font","$background","$hasInvisible","enUS","frFR","COMPONENT_NAME","CLASSNAME","highlightNonAsciiChars","text","options","result","currentAscii","currentNonAscii","keyIndex","chars","Array","from","char","isNonAscii","push","React","createElement","key","font","containsInvisibleChars","TextField","forwardRef","props","ref","transientProps","otherProps","getStylingTransientProps","ariaLabel","ariaLabelledby","after","autoFocus","className","color","propsColor","defaultValue","forceColor","hasClearButton","highlightNonAscii","inputProps","inputRef","internal","isColored","isDisabled","isInvalid","isReadOnly","isRequired","label","leftIcon","name","onBlur","onBlurProps","onChange","onClear","onFocus","onFocusProps","pills","pillsLayout","placeholder","theme","propsTheme","type","value","propsValue","variant","forwardedProps","_objectWithoutProperties","_excluded","useTheme","ButtonsColorPalette","isGradient","radar","format","useMessageFormatter","intlMessages","isFocusVisible","isFocused","focusProps","useFocusRing","isFocusWithin","setFocusWithin","useState","Boolean","focusWithinProps","useFocusWithin","onFocusWithinChange","setValue","isControlled","undefined","labelId","useId","highlightOptions","_objectSpread","normalizeHighlightOptions","warnIfNoAccessibleLabelFound","handleChange","useCallback","event","target","handleClear","onClick","requiredMark","_extends","length","$isFocusVisible","$isRequired","classNames","id","Icon","disabled","map","pill","index","Pill","size","Flexbox","gap","IconButton","icon","mdiClose","style","borderLeft","position","top","displayName"],"mappings":"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;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,UAAA,CAAW,GACD,EAAG,CAAA;AACb;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,mBAAA,EAAqBT,oBAAoB,GAC/B,mDAAmD,GACnD,kDAAmD,CAAA;AAC7D;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAQE,EAAAA,WAAW,GACTO,GAAI,CAAA;AACd;AACA,UAAW,CAAA,GACDT,oBAAoB,GACpBS,GAAI,CAAA;AACd;AACA,qDAAuDF,EAAAA,MAAM,KAAKG,KAAK,CAACC,IAAI,GAAG,OAAO,GAAG,aAAc,CAAA;AACvG,UAAA,CAAW,GACDF,GAAI,CAAA;AACd,+CAAiDF,EAAAA,MAAM,KAAKG,KAAK,CAACC,IAAI,GAAG,OAAO,GAAG,aAAc,CAAA;AACjG,UAAY,CAAA,CAAA;AACZ;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,yCAA2CJ,EAAAA,MAAM,KAAKG,KAAK,CAACC,IAAI,GAAG,OAAO,GAAG,aAAc,CAAA;AAC3F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAQ,EAAA,CAACN,WAAW,IAAIH,WAAW,IAAI,CAACD,UAAU,IAAIE,UAAU,GACtDM,GAAI,CAAA;AACd,YAAA,EAAcD,QAAQ,KAAKtB,gBAAgB,CAACE,SAAS,GACrCqB,GAAI,CAAA;AACpB;AACA,gBAAA,CAAiB,GACDA,GAAI,CAAA;AACpB;AACA;AACA,gBAAkB,CAAA,CAAA;AAClB;AACA,8BAAA,EAAgCF,MAAO,CAAuCJ,qCAAAA,EAAAA,UAAU,GACxE,OAAO,GACPF,UAAU,GACVG,MAAM,GACN,MAAO,CAAQF,MAAAA,EAAAA,WAAW,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"}
|