@frontify/fondue 12.0.0-beta.372 → 12.0.0-beta.373
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/dist/components/ComponentEnum.es.js +1 -1
- package/dist/components/ComponentEnum.es.js.map +1 -1
- package/dist/components/{Textarea/Textarea.es.js → LegacyTextarea/LegacyTextarea.es.js} +21 -21
- package/dist/components/LegacyTextarea/LegacyTextarea.es.js.map +1 -0
- package/dist/index.cjs.js +1 -1
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.d.ts +6 -6
- package/dist/index.es.js +2 -2
- package/dist/index.umd.js +1 -1
- package/dist/index.umd.js.map +1 -1
- package/package.json +1 -1
- package/dist/components/Textarea/Textarea.es.js.map +0 -1
package/package.json
CHANGED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Textarea.es.js","sources":["../../../src/components/Textarea/Textarea.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { useMemoizedId } from '@hooks/useMemoizedId';\nimport { useFocusRing } from '@react-aria/focus';\nimport { FOCUS_STYLE } from '@utilities/focusStyle';\nimport { merge } from '@utilities/merge';\nimport { Validation, validationClassMap } from '@utilities/validation';\nimport { LoadingCircle, LoadingCircleSize } from '@components/LoadingCircle';\nimport {\n AriaAttributes,\n FocusEvent,\n FormEvent,\n KeyboardEvent,\n ReactElement,\n ReactNode,\n useEffect,\n useRef,\n} from 'react';\nimport TextareaAutosize from 'react-textarea-autosize';\nimport { IconExclamationMarkTriangle } from '@foundation/Icon/Generated';\n\nexport type TextareaProps = {\n id?: string;\n value?: string;\n required?: boolean;\n decorator?: ReactNode;\n placeholder?: string;\n disabled?: boolean;\n onInput?: (value: string) => void;\n onBlur?: (value: string) => void;\n onFocus?: (e: FocusEvent<HTMLTextAreaElement>) => void;\n validation?: Validation;\n /** When autosize if false, this is used as 'rows' property for standard textarea */\n minRows?: number;\n /** When autosize if false, this property is ignored */\n maxRows?: number;\n autosize?: boolean;\n resizeable?: boolean;\n selectable?: boolean;\n focusOnMount?: boolean;\n onEnterPressed?: (event: KeyboardEvent<HTMLTextAreaElement>) => void;\n} & AriaAttributes;\n\nexport const Textarea = ({\n id: propId,\n value,\n required = false,\n decorator,\n placeholder,\n disabled = false,\n onInput,\n onBlur,\n validation = Validation.Default,\n minRows,\n maxRows,\n autosize = false,\n resizeable = true,\n onFocus,\n selectable = false,\n focusOnMount,\n onEnterPressed,\n ...props\n}: TextareaProps): ReactElement => {\n const Component = autosize ? TextareaAutosize : 'textarea';\n\n const textareaElement = useRef<HTMLTextAreaElement | null>(null);\n\n useEffect(() => {\n focusOnMount && textareaElement.current?.focus();\n }, [focusOnMount]);\n\n const onKeyDown = (event: KeyboardEvent<HTMLTextAreaElement>) => {\n if (event.key === 'Enter') {\n onEnterPressed?.(event);\n }\n };\n\n const onBlurHandler = (event: FocusEvent<HTMLTextAreaElement>) => {\n if (onBlur) {\n onBlur(event.target.value);\n }\n };\n\n const onInputHandler = (event: FormEvent<HTMLTextAreaElement>) => {\n if (onInput) {\n onInput((event.target as HTMLTextAreaElement).value);\n }\n };\n\n const { isFocusVisible, focusProps } = useFocusRing({ isTextInput: true, within: true });\n const autosizeProps = { maxRows, minRows };\n\n return (\n <div className=\"tw-relative\" {...focusProps}>\n {decorator && (\n <div\n className=\"tw-absolute tw-top-2 tw-left-2 tw-inline-flex tw-items-end tw-text-black-80\"\n data-test-id=\"decorator\"\n >\n {decorator}\n </div>\n )}\n <Component\n {...(autosize ? autosizeProps : { rows: minRows })}\n onClick={() => textareaElement.current?.focus()}\n id={useMemoizedId(propId)}\n ref={textareaElement}\n value={value}\n placeholder={placeholder}\n required={required}\n className={merge([\n 'tw-w-full tw-p-2 tw-border tw-rounded tw-text-s tw-outline-none tw-transition tw-placeholder-black-60',\n !!decorator && 'tw-pl-7 ',\n disabled\n ? 'tw-border-black-5 tw-bg-black-5 tw-text-black-40'\n : 'tw-text-black tw-border-black-20 hover:tw-border-line-x-strong focus-within:tw-border-line-xx-strong focus-within:hover:tw-border-line-xx-strong',\n isFocusVisible && FOCUS_STYLE,\n validationClassMap[validation],\n !resizeable && 'tw-resize-none',\n validation === Validation.Error && 'tw-pr-8',\n ])}\n disabled={disabled}\n onBlur={onBlurHandler}\n onFocus={(e) => {\n if (selectable) {\n e.target.select();\n }\n if (onFocus) {\n onFocus(e);\n }\n }}\n onInput={onInputHandler}\n onKeyDown={onKeyDown}\n data-test-id=\"textarea\"\n {...props}\n />\n {validation === Validation.Loading && (\n <span className=\"tw-absolute tw-top-[-0.55rem] tw-right-[-0.55rem] tw-bg-white tw-rounded-full tw-p-[2px] tw-border tw-border-black-10\">\n <LoadingCircle size={LoadingCircleSize.ExtraSmall} />\n </span>\n )}\n {(validation === Validation.Error || validation === Validation.Warning) && (\n <span\n className={merge([\n 'tw-absolute tw-top-[0.6rem] tw-right-[0.6rem]',\n validation === Validation.Error && 'tw-text-text-negative',\n validation === Validation.Warning && 'tw-text-text-warning',\n ])}\n data-test-id=\"error-state-exclamation-mark-icon\"\n >\n <IconExclamationMarkTriangle />\n </span>\n )}\n </div>\n );\n};\nTextarea.displayName = 'FondueTextarea';\n"],"names":["Textarea","propId","value","required","decorator","placeholder","disabled","onInput","onBlur","validation","Validation","minRows","maxRows","autosize","resizeable","onFocus","selectable","focusOnMount","onEnterPressed","props","Component","TextareaAutosize","textareaElement","useRef","useEffect","_a","onKeyDown","event","onBlurHandler","onInputHandler","isFocusVisible","focusProps","useFocusRing","jsxs","jsx","useMemoizedId","merge","FOCUS_STYLE","validationClassMap","e","LoadingCircle","LoadingCircleSize","IconExclamationMarkTriangle"],"mappings":"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"}
|