@chayns-components/core 5.0.0-beta.13 → 5.0.0-beta.1301

package/lib/cjs/components/small-wait-cursor/SmallWaitCursor.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SmallWaitCursor.styles.js","names":["_styledComponents","_interopRequireWildcard","require","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","StyledSmallWaitCursor","exports","styled","div","$size","$shouldShowWaitCursor","StyledSmallWaitCursorBackground","spin","keyframes","StyledSmallWaitCursorWaitCursor","theme","$shouldHideBackground","$color","colorMode","headline","primary","$speed"],"sources":["../../../../src/components/small-wait-cursor/SmallWaitCursor.styles.ts"],"sourcesContent":["import styled, { keyframes } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport type { SmallWaitCursorSize, SmallWaitCursorSpeed } from './SmallWaitCursor';\n\ntype StyledSmallWaitCursorProps = WithTheme<{\n    $shouldShowWaitCursor: boolean;\n    $size: SmallWaitCursorSize | number;\n}>;\n\nexport const StyledSmallWaitCursor = styled.div<StyledSmallWaitCursorProps>`\n    position: relative;\n    height: ${({ $size }) => $size}px;\n    width: ${({ $size }) => $size}px;\n    opacity: ${({ $shouldShowWaitCursor }) => ($shouldShowWaitCursor ? 1 : 0)};\n`;\n\ntype StyledSmallWaitCursorBackgroundProps = WithTheme<unknown>;\n\nexport const StyledSmallWaitCursorBackground = styled.div<StyledSmallWaitCursorBackgroundProps>`\n    background-color: white;\n    border-radius: 50%;\n    height: 100%;\n    width: 100%;\n    position: relative;\n    z-index: 1;\n    box-shadow:\n        0 4px 12px 0 rgba(0, 0, 0, 0.2),\n        0 1px 1px rgba(0, 0, 0, 0.2);\n`;\n\ntype StyledSmallWaitCursorWaitCursorProps = WithTheme<{\n    $size: SmallWaitCursorSize | number;\n    $speed: SmallWaitCursorSpeed;\n    $shouldHideBackground: boolean;\n    $color?: string;\n}>;\n\nconst spin = keyframes`\n  from {\n    transform: rotate(0deg);\n  }\n  to {\n    transform: rotate(360deg);\n  }\n`;\n\nexport const StyledSmallWaitCursorWaitCursor = styled.div<StyledSmallWaitCursorWaitCursorProps>`\n    position: absolute;\n    top: 5px;\n    left: 5px;\n    z-index: 2;\n    border-style: solid;\n    border-width: 3px;\n    border-color: ${({\n        theme,\n        $shouldHideBackground,\n        $color,\n    }: StyledSmallWaitCursorWaitCursorProps) => {\n        if ($color) {\n            return $color;\n        }\n\n        return theme.colorMode === 'dark' && $shouldHideBackground ? theme.headline : theme.primary;\n    }};\n    height: ${({ $size }) => `${$size - 10}px`};\n    width: ${({ $size }) => `${$size - 10}px`};\n    border-radius: 50%;\n    display: inline-block;\n    border-top: 3px solid transparent;\n\n    animation: ${spin} ${({ $speed }) => $speed}s linear infinite;\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,uBAAA,CAAAC,OAAA;AAAsD,SAAAD,wBAAAE,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAJ,uBAAA,YAAAA,CAAAE,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAS/C,MAAMkB,qBAAqB,GAAAC,OAAA,CAAAD,qBAAA,GAAGE,yBAAM,CAACC,GAA+B;AAC3E;AACA,cAAc,CAAC;EAAEC;AAAM,CAAC,KAAKA,KAAK;AAClC,aAAa,CAAC;EAAEA;AAAM,CAAC,KAAKA,KAAK;AACjC,eAAe,CAAC;EAAEC;AAAsB,CAAC,KAAMA,qBAAqB,GAAG,CAAC,GAAG,CAAE;AAC7E,CAAC;AAIM,MAAMC,+BAA+B,GAAAL,OAAA,CAAAK,+BAAA,GAAGJ,yBAAM,CAACC,GAAyC;AAC/F;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AASD,MAAMI,IAAI,GAAG,IAAAC,2BAAS;AACtB;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAEM,MAAMC,+BAA+B,GAAAR,OAAA,CAAAQ,+BAAA,GAAGP,yBAAM,CAACC,GAAyC;AAC/F;AACA;AACA;AACA;AACA;AACA;AACA,oBAAoB,CAAC;EACbO,KAAK;EACLC,qBAAqB;EACrBC;AACkC,CAAC,KAAK;EACxC,IAAIA,MAAM,EAAE;IACR,OAAOA,MAAM;EACjB;EAEA,OAAOF,KAAK,CAACG,SAAS,KAAK,MAAM,IAAIF,qBAAqB,GAAGD,KAAK,CAACI,QAAQ,GAAGJ,KAAK,CAACK,OAAO;AAC/F,CAAC;AACL,cAAc,CAAC;EAAEX;AAAM,CAAC,KAAK,GAAGA,KAAK,GAAG,EAAE,IAAI;AAC9C,aAAa,CAAC;EAAEA;AAAM,CAAC,KAAK,GAAGA,KAAK,GAAG,EAAE,IAAI;AAC7C;AACA;AACA;AACA;AACA,iBAAiBG,IAAI,IAAI,CAAC;EAAES;AAAO,CAAC,KAAKA,MAAM;AAC/C,CAAC","ignoreList":[]}

package/lib/cjs/components/tag-input/TagInput.js

@@ -0,0 +1,157 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _styledComponents = require("styled-components");
+var _uuid = require("uuid");
+var _Badge = _interopRequireDefault(require("../badge/Badge"));
+var _Icon = _interopRequireDefault(require("../icon/Icon"));
+var _TagInput = require("./TagInput.styles");
+var _AreaContextProvider = require("../area-provider/AreaContextProvider");
+var _resize = require("../../hooks/resize");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const TagInput = /*#__PURE__*/(0, _react.forwardRef)(({
+  leftElement,
+  onAdd,
+  onBlur,
+  onChange,
+  onFocus,
+  onRemove,
+  placeholder,
+  shouldAllowMultiple = true,
+  shouldPreventEnter,
+  tags
+}, ref) => {
+  const [internalTags, setInternalTags] = (0, _react.useState)();
+  const [currentValue, setCurrentValue] = (0, _react.useState)('');
+  const [selectedId, setSelectedId] = (0, _react.useState)();
+  const areaProvider = (0, _react.useContext)(_AreaContextProvider.AreaContext);
+  const inputRef = (0, _react.useRef)(null);
+  (0, _resize.useCursorRepaint)(inputRef);
+  const theme = (0, _styledComponents.useTheme)();
+  (0, _react.useEffect)(() => {
+    if (tags) {
+      setInternalTags(shouldAllowMultiple ? tags : tags.slice(0, 1));
+    }
+  }, [shouldAllowMultiple, tags]);
+  const handleResetValue = () => {
+    setCurrentValue('');
+  };
+  const shouldChangeColor = (0, _react.useMemo)(() => areaProvider.shouldChangeColor ?? false, [areaProvider.shouldChangeColor]);
+  (0, _react.useImperativeHandle)(ref, () => ({
+    blur: () => {
+      var _inputRef$current;
+      return (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.blur();
+    },
+    getUnsavedTagText: currentValue !== '' ? currentValue : undefined,
+    resetValue: handleResetValue
+  }), [currentValue]);
+  const handleKeyDown = (0, _react.useCallback)(event => {
+    if (event.key === 'Enter' && !shouldPreventEnter) {
+      setCurrentValue(prevValue => {
+        if (!prevValue) {
+          return '';
+        }
+        setInternalTags(prevTags => {
+          if (!shouldAllowMultiple && ((prevTags === null || prevTags === void 0 ? void 0 : prevTags.length) ?? 0) > 0) return prevTags;
+          const newTag = {
+            id: (0, _uuid.v4)(),
+            text: prevValue
+          };
+          if (typeof onAdd === 'function') {
+            onAdd(newTag);
+          }
+          return prevTags ? [...prevTags, newTag] : [newTag];
+        });
+        return '';
+      });
+    }
+    if (event.key === 'Backspace' && currentValue === '') {
+      if (!selectedId) {
+        var _internalTags;
+        if (!internalTags) {
+          return;
+        }
+        const newSelectedId = (_internalTags = internalTags[internalTags.length - 1]) === null || _internalTags === void 0 ? void 0 : _internalTags.id;
+        setSelectedId(newSelectedId);
+        return;
+      }
+      setInternalTags(prevState => {
+        var _prevState;
+        if (!prevState) {
+          return prevState;
+        }
+        const removedId = (_prevState = prevState[prevState.length - 1]) === null || _prevState === void 0 ? void 0 : _prevState.id;
+        if (!removedId) {
+          return prevState;
+        }
+        const updatedTags = (prevState ?? []).filter(tag => tag.id !== removedId);
+        if (typeof onRemove === 'function') {
+          onRemove(removedId);
+        }
+        setSelectedId(undefined);
+        return updatedTags;
+      });
+    }
+  }, [currentValue, internalTags, onAdd, onRemove, selectedId, shouldAllowMultiple, shouldPreventEnter]);
+  const handleChange = (0, _react.useCallback)(event => {
+    setCurrentValue(event.target.value);
+    if (typeof onChange === 'function') {
+      onChange(event);
+    }
+    if (event.target.value !== '') {
+      setSelectedId(undefined);
+    }
+  }, [onChange]);
+  const handleIconClick = (0, _react.useCallback)(id => {
+    setInternalTags(prevState => {
+      const updatedTags = (prevState ?? []).filter(tag => tag.id !== id);
+      if (typeof onRemove === 'function') {
+        onRemove(id);
+      }
+      return updatedTags;
+    });
+  }, [onRemove]);
+  const content = (0, _react.useMemo)(() => {
+    const items = [];
+    if (!internalTags) {
+      return items;
+    }
+    internalTags.forEach(({
+      text,
+      id,
+      rightElement
+    }) => {
+      items.push(/*#__PURE__*/_react.default.createElement(_Badge.default, {
+        key: `tag-input-${id}`,
+        backgroundColor: id === selectedId ? theme['206'] ?? undefined : undefined
+      }, /*#__PURE__*/_react.default.createElement(_TagInput.StyledTagInputTagWrapper, null, /*#__PURE__*/_react.default.createElement(_TagInput.StyledTagInputTagWrapperText, null, text), rightElement, /*#__PURE__*/_react.default.createElement(_Icon.default, {
+        icons: ['ts-wrong'],
+        onClick: event => {
+          event.preventDefault();
+          event.stopPropagation();
+          handleIconClick(id);
+        }
+      }))));
+    });
+    return items;
+  }, [handleIconClick, internalTags, selectedId, theme]);
+  const shouldShowInput = (0, _react.useMemo)(() => shouldAllowMultiple || ((internalTags === null || internalTags === void 0 ? void 0 : internalTags.length) ?? 0) < 1, [internalTags === null || internalTags === void 0 ? void 0 : internalTags.length, shouldAllowMultiple]);
+  return (0, _react.useMemo)(() => /*#__PURE__*/_react.default.createElement(_TagInput.StyledTagInput, {
+    $shouldChangeColor: shouldChangeColor
+  }, leftElement && /*#__PURE__*/_react.default.createElement(_TagInput.StyledTagInputIconWrapper, null, leftElement), content, shouldShowInput && /*#__PURE__*/_react.default.createElement(_TagInput.StyledTagInputTagInput, {
+    onBlur: onBlur,
+    onChange: handleChange,
+    onFocus: onFocus,
+    onKeyDown: handleKeyDown,
+    placeholder: tags && tags.length > 0 ? undefined : placeholder,
+    ref: inputRef,
+    value: currentValue
+  })), [content, currentValue, handleChange, handleKeyDown, leftElement, onBlur, onFocus, placeholder, shouldChangeColor, shouldShowInput, tags]);
+});
+var _default = exports.default = TagInput;
+//# sourceMappingURL=TagInput.js.map

package/lib/cjs/components/tag-input/TagInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TagInput.js","names":["_react","_interopRequireWildcard","require","_styledComponents","_uuid","_Badge","_interopRequireDefault","_Icon","_TagInput","_AreaContextProvider","_resize","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","TagInput","forwardRef","leftElement","onAdd","onBlur","onChange","onFocus","onRemove","placeholder","shouldAllowMultiple","shouldPreventEnter","tags","ref","internalTags","setInternalTags","useState","currentValue","setCurrentValue","selectedId","setSelectedId","areaProvider","useContext","AreaContext","inputRef","useRef","useCursorRepaint","theme","useTheme","useEffect","slice","handleResetValue","shouldChangeColor","useMemo","useImperativeHandle","blur","_inputRef$current","current","getUnsavedTagText","undefined","resetValue","handleKeyDown","useCallback","event","key","prevValue","prevTags","length","newTag","id","uuidv4","text","_internalTags","newSelectedId","prevState","_prevState","removedId","updatedTags","filter","tag","handleChange","target","value","handleIconClick","content","items","forEach","rightElement","push","createElement","backgroundColor","StyledTagInputTagWrapper","StyledTagInputTagWrapperText","icons","onClick","preventDefault","stopPropagation","shouldShowInput","StyledTagInput","$shouldChangeColor","StyledTagInputIconWrapper","StyledTagInputTagInput","onKeyDown","_default","exports"],"sources":["../../../../src/components/tag-input/TagInput.tsx"],"sourcesContent":["import React, {\n    forwardRef,\n    useCallback,\n    useEffect,\n    useMemo,\n    useState,\n    type ChangeEvent,\n    type KeyboardEvent,\n    type ReactElement,\n    useImperativeHandle,\n    useContext,\n    ChangeEventHandler,\n    ReactNode,\n    FocusEventHandler,\n    useRef,\n} from 'react';\nimport { useTheme } from 'styled-components';\nimport { v4 as uuidv4 } from 'uuid';\nimport type { Tag } from '../../types/tagInput';\nimport Badge from '../badge/Badge';\nimport Icon from '../icon/Icon';\nimport {\n    StyledTagInput,\n    StyledTagInputIconWrapper,\n    StyledTagInputTagInput,\n    StyledTagInputTagWrapper,\n    StyledTagInputTagWrapperText,\n} from './TagInput.styles';\nimport { AreaContext } from '../area-provider/AreaContextProvider';\nimport type { Theme } from '../color-scheme-provider/ColorSchemeProvider';\nimport { useCursorRepaint } from '../../hooks/resize';\n\nexport type TagInputProps = {\n    /**\n     * An element that should be displayed on the left side of the input.\n     */\n    leftElement?: ReactNode;\n    /**\n     * Function to be executed when a tag is added.\n     */\n    onAdd?: (tag: Tag) => void;\n    /**\n     * Function to be executed when the input is blurred.\n     */\n    onBlur?: FocusEventHandler;\n    /**\n     * Function to be executed when the value of the input is changed.\n     */\n    onChange?: ChangeEventHandler<HTMLInputElement>;\n    /**\n     * Function to be executed when the input is focused.\n     */\n    onFocus?: FocusEventHandler;\n    /**\n     * Function to be executed when a tag is removed.\n     */\n    onRemove?: (id: string) => void;\n    /**\n     * The placeholder that should be displayed.\n     */\n    placeholder?: string;\n    /**\n     * Whether multiple tags should be allowed.\n     */\n    shouldAllowMultiple?: boolean;\n    /**\n     * Whether the enter key should be prevented.\n     */\n    shouldPreventEnter?: boolean;\n    /**\n     * The tags that should be displayed.\n     */\n    tags?: Tag[];\n};\n\nexport interface TagInputRef {\n    blur: () => void;\n    getUnsavedTagText: Tag['text'] | undefined;\n    resetValue: () => void;\n}\n\nconst TagInput = forwardRef<TagInputRef, TagInputProps>(\n    (\n        {\n            leftElement,\n            onAdd,\n            onBlur,\n            onChange,\n            onFocus,\n            onRemove,\n            placeholder,\n            shouldAllowMultiple = true,\n            shouldPreventEnter,\n            tags,\n        },\n        ref,\n    ) => {\n        const [internalTags, setInternalTags] = useState<Tag[]>();\n        const [currentValue, setCurrentValue] = useState('');\n        const [selectedId, setSelectedId] = useState<Tag['id']>();\n\n        const areaProvider = useContext(AreaContext);\n\n        const inputRef = useRef<HTMLInputElement | null>(null);\n\n        useCursorRepaint(inputRef);\n\n        const theme = useTheme() as Theme;\n\n        useEffect(() => {\n            if (tags) {\n                setInternalTags(shouldAllowMultiple ? tags : tags.slice(0, 1));\n            }\n        }, [shouldAllowMultiple, tags]);\n\n        const handleResetValue = () => {\n            setCurrentValue('');\n        };\n\n        const shouldChangeColor = useMemo(\n            () => areaProvider.shouldChangeColor ?? false,\n            [areaProvider.shouldChangeColor],\n        );\n\n        useImperativeHandle(\n            ref,\n            () => ({\n                blur: () => inputRef.current?.blur(),\n                getUnsavedTagText: currentValue !== '' ? currentValue : undefined,\n                resetValue: handleResetValue,\n            }),\n            [currentValue],\n        );\n\n        const handleKeyDown = useCallback(\n            (event: KeyboardEvent) => {\n                if (event.key === 'Enter' && !shouldPreventEnter) {\n                    setCurrentValue((prevValue) => {\n                        if (!prevValue) {\n                            return '';\n                        }\n\n                        setInternalTags((prevTags) => {\n                            if (!shouldAllowMultiple && (prevTags?.length ?? 0) > 0)\n                                return prevTags;\n\n                            const newTag = { id: uuidv4(), text: prevValue };\n\n                            if (typeof onAdd === 'function') {\n                                onAdd(newTag);\n                            }\n\n                            return prevTags ? [...prevTags, newTag] : [newTag];\n                        });\n\n                        return '';\n                    });\n                }\n\n                if (event.key === 'Backspace' && currentValue === '') {\n                    if (!selectedId) {\n                        if (!internalTags) {\n                            return;\n                        }\n\n                        const newSelectedId = internalTags[internalTags.length - 1]?.id;\n\n                        setSelectedId(newSelectedId);\n\n                        return;\n                    }\n\n                    setInternalTags((prevState) => {\n                        if (!prevState) {\n                            return prevState;\n                        }\n\n                        const removedId = prevState[prevState.length - 1]?.id;\n\n                        if (!removedId) {\n                            return prevState;\n                        }\n\n                        const updatedTags = (prevState ?? []).filter((tag) => tag.id !== removedId);\n\n                        if (typeof onRemove === 'function') {\n                            onRemove(removedId);\n                        }\n\n                        setSelectedId(undefined);\n\n                        return updatedTags;\n                    });\n                }\n            },\n            [\n                currentValue,\n                internalTags,\n                onAdd,\n                onRemove,\n                selectedId,\n                shouldAllowMultiple,\n                shouldPreventEnter,\n            ],\n        );\n\n        const handleChange = useCallback(\n            (event: ChangeEvent<HTMLInputElement>) => {\n                setCurrentValue(event.target.value);\n\n                if (typeof onChange === 'function') {\n                    onChange(event);\n                }\n\n                if (event.target.value !== '') {\n                    setSelectedId(undefined);\n                }\n            },\n            [onChange],\n        );\n\n        const handleIconClick = useCallback(\n            (id: string) => {\n                setInternalTags((prevState) => {\n                    const updatedTags = (prevState ?? []).filter((tag) => tag.id !== id);\n\n                    if (typeof onRemove === 'function') {\n                        onRemove(id);\n                    }\n\n                    return updatedTags;\n                });\n            },\n            [onRemove],\n        );\n\n        const content = useMemo(() => {\n            const items: ReactElement[] = [];\n\n            if (!internalTags) {\n                return items;\n            }\n\n            internalTags.forEach(({ text, id, rightElement }) => {\n                items.push(\n                    <Badge\n                        key={`tag-input-${id}`}\n                        backgroundColor={\n                            id === selectedId ? ((theme['206'] as string) ?? undefined) : undefined\n                        }\n                    >\n                        <StyledTagInputTagWrapper>\n                            <StyledTagInputTagWrapperText>{text}</StyledTagInputTagWrapperText>\n                            {rightElement}\n                            <Icon\n                                icons={['ts-wrong']}\n                                onClick={(event) => {\n                                    event.preventDefault();\n                                    event.stopPropagation();\n\n                                    handleIconClick(id);\n                                }}\n                            />\n                        </StyledTagInputTagWrapper>\n                    </Badge>,\n                );\n            });\n\n            return items;\n        }, [handleIconClick, internalTags, selectedId, theme]);\n\n        const shouldShowInput = useMemo(\n            () => shouldAllowMultiple || (internalTags?.length ?? 0) < 1,\n            [internalTags?.length, shouldAllowMultiple],\n        );\n\n        return useMemo(\n            () => (\n                <StyledTagInput $shouldChangeColor={shouldChangeColor}>\n                    {leftElement && (\n                        <StyledTagInputIconWrapper>{leftElement}</StyledTagInputIconWrapper>\n                    )}\n                    {content}\n                    {shouldShowInput && (\n                        <StyledTagInputTagInput\n                            onBlur={onBlur}\n                            onChange={handleChange}\n                            onFocus={onFocus}\n                            onKeyDown={handleKeyDown}\n                            placeholder={tags && tags.length > 0 ? undefined : placeholder}\n                            ref={inputRef}\n                            value={currentValue}\n                        />\n                    )}\n                </StyledTagInput>\n            ),\n            [\n                content,\n                currentValue,\n                handleChange,\n                handleKeyDown,\n                leftElement,\n                onBlur,\n                onFocus,\n                placeholder,\n                shouldChangeColor,\n                shouldShowInput,\n                tags,\n            ],\n        );\n    },\n);\n\nexport default TagInput;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/tag-input/TagInput.styles.js

@@ -0,0 +1,51 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StyledTagInputTagWrapperText = exports.StyledTagInputTagWrapper = exports.StyledTagInputTagInput = exports.StyledTagInputIconWrapper = exports.StyledTagInput = void 0;
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const StyledTagInput = exports.StyledTagInput = _styledComponents.default.div`
+    display: flex;
+    flex-wrap: wrap;
+    min-height: 42px;
+    padding: 5px;
+    align-items: center;
+    gap: 6px;
+    background-color: ${({
+  theme,
+  $shouldChangeColor
+}) => theme.colorMode === 'classic' || $shouldChangeColor ? theme['000'] : theme['100']};
+    border: 1px solid rgba(160, 160, 160, 0.3);
+`;
+const StyledTagInputTagWrapper = exports.StyledTagInputTagWrapper = _styledComponents.default.div`
+    display: flex;
+    align-items: center;
+    gap: 4px;
+`;
+const StyledTagInputTagWrapperText = exports.StyledTagInputTagWrapperText = _styledComponents.default.p`
+    margin: 0;
+    flex-grow: 1;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    font-size: 15px;
+`;
+const StyledTagInputTagInput = exports.StyledTagInputTagInput = _styledComponents.default.input`
+    border: none;
+    height: 24px;
+    flex-grow: 1;
+    background-color: transparent;
+    color: ${({
+  theme
+}) => theme.text};
+`;
+const StyledTagInputIconWrapper = exports.StyledTagInputIconWrapper = _styledComponents.default.div`
+    align-items: baseline;
+    display: flex;
+    flex: 0 0 auto;
+    justify-content: center;
+    margin-left: 5px;
+`;
+//# sourceMappingURL=TagInput.styles.js.map

package/lib/cjs/components/tag-input/TagInput.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TagInput.styles.js","names":["_styledComponents","_interopRequireDefault","require","e","__esModule","default","StyledTagInput","exports","styled","div","theme","$shouldChangeColor","colorMode","StyledTagInputTagWrapper","StyledTagInputTagWrapperText","p","StyledTagInputTagInput","input","text","StyledTagInputIconWrapper"],"sources":["../../../../src/components/tag-input/TagInput.styles.ts"],"sourcesContent":["import styled from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledTagInputProps = WithTheme<{ $shouldChangeColor: boolean }>;\n\nexport const StyledTagInput = styled.div<StyledTagInputProps>`\n    display: flex;\n    flex-wrap: wrap;\n    min-height: 42px;\n    padding: 5px;\n    align-items: center;\n    gap: 6px;\n    background-color: ${({ theme, $shouldChangeColor }: StyledTagInputProps) =>\n        theme.colorMode === 'classic' || $shouldChangeColor ? theme['000'] : theme['100']};\n    border: 1px solid rgba(160, 160, 160, 0.3);\n`;\n\nexport const StyledTagInputTagWrapper = styled.div`\n    display: flex;\n    align-items: center;\n    gap: 4px;\n`;\n\nexport const StyledTagInputTagWrapperText = styled.p`\n    margin: 0;\n    flex-grow: 1;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    font-size: 15px;\n`;\n\ntype StyledTagInputTagInputProps = WithTheme<unknown>;\n\nexport const StyledTagInputTagInput = styled.input<StyledTagInputTagInputProps>`\n    border: none;\n    height: 24px;\n    flex-grow: 1;\n    background-color: transparent;\n    color: ${({ theme }: StyledTagInputTagInputProps) => theme.text};\n`;\n\nexport const StyledTagInputIconWrapper = styled.div`\n    align-items: baseline;\n    display: flex;\n    flex: 0 0 auto;\n    justify-content: center;\n    margin-left: 5px;\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AAAuC,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAKhC,MAAMG,cAAc,GAAAC,OAAA,CAAAD,cAAA,GAAGE,yBAAM,CAACC,GAAwB;AAC7D;AACA;AACA;AACA;AACA;AACA;AACA,wBAAwB,CAAC;EAAEC,KAAK;EAAEC;AAAwC,CAAC,KACnED,KAAK,CAACE,SAAS,KAAK,SAAS,IAAID,kBAAkB,GAAGD,KAAK,CAAC,KAAK,CAAC,GAAGA,KAAK,CAAC,KAAK,CAAC;AACzF;AACA,CAAC;AAEM,MAAMG,wBAAwB,GAAAN,OAAA,CAAAM,wBAAA,GAAGL,yBAAM,CAACC,GAAG;AAClD;AACA;AACA;AACA,CAAC;AAEM,MAAMK,4BAA4B,GAAAP,OAAA,CAAAO,4BAAA,GAAGN,yBAAM,CAACO,CAAC;AACpD;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAIM,MAAMC,sBAAsB,GAAAT,OAAA,CAAAS,sBAAA,GAAGR,yBAAM,CAACS,KAAkC;AAC/E;AACA;AACA;AACA;AACA,aAAa,CAAC;EAAEP;AAAmC,CAAC,KAAKA,KAAK,CAACQ,IAAI;AACnE,CAAC;AAEM,MAAMC,yBAAyB,GAAAZ,OAAA,CAAAY,yBAAA,GAAGX,yBAAM,CAACC,GAAG;AACnD;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}

package/lib/cjs/components/text-area/TextArea.js

@@ -0,0 +1,82 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _chaynsApi = require("chayns-api");
+var _react = _interopRequireWildcard(require("react"));
+var _AreaContextProvider = require("../area-provider/AreaContextProvider");
+var _Input = require("../input/Input.styles");
+var _TextArea = require("./TextArea.styles");
+var _resize = require("../../hooks/resize");
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const TextArea = /*#__PURE__*/(0, _react.forwardRef)(({
+  isDisabled,
+  isInvalid,
+  placeholder,
+  value,
+  onChange,
+  onFocus,
+  onKeyDown,
+  rightElement,
+  onBlur,
+  maxHeight = '120px',
+  minHeight = '41px'
+}, ref) => {
+  var _rightElement$props;
+  const [isOverflowing, setIsOverflowing] = (0, _react.useState)(false);
+  const areaProvider = (0, _react.useContext)(_AreaContextProvider.AreaContext);
+  const textareaRef = (0, _react.useRef)(null);
+  const {
+    browser
+  } = (0, _chaynsApi.getDevice)();
+  (0, _resize.useCursorRepaint)(textareaRef);
+
+  // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
+  const shouldShowBorder = (rightElement === null || rightElement === void 0 || (_rightElement$props = rightElement.props) === null || _rightElement$props === void 0 || (_rightElement$props = _rightElement$props.style) === null || _rightElement$props === void 0 ? void 0 : _rightElement$props.backgroundColor) === undefined;
+  const shouldChangeColor = (0, _react.useMemo)(() => areaProvider.shouldChangeColor ?? false, [areaProvider.shouldChangeColor]);
+  const adjustTextareaHeight = (0, _react.useCallback)(() => {
+    if (textareaRef.current) {
+      textareaRef.current.style.height = 'auto';
+      textareaRef.current.style.height = `${textareaRef.current.scrollHeight}px`;
+      setIsOverflowing(textareaRef.current.scrollHeight > parseInt(maxHeight.toString(), 10));
+    }
+  }, [maxHeight]);
+  (0, _react.useImperativeHandle)(ref, () => textareaRef.current);
+
+  /**
+   * This hook calculates the height of the TextArea after the displayValue is changed and the content is inside the "textareaRef".
+   * To maintain the functionality while clearing the input, the length need to be greater than -1.
+   */
+  (0, _react.useEffect)(() => {
+    if (typeof value === 'string' && value.length > -1) {
+      adjustTextareaHeight();
+    }
+  }, [adjustTextareaHeight, value]);
+  return (0, _react.useMemo)(() => /*#__PURE__*/_react.default.createElement(_TextArea.StyledTextArea, {
+    $isDisabled: isDisabled
+  }, /*#__PURE__*/_react.default.createElement(_TextArea.StyledTextAreaContentWrapper, {
+    $isInvalid: isInvalid,
+    $shouldChangeColor: shouldChangeColor
+  }, /*#__PURE__*/_react.default.createElement(_TextArea.StyledTextAreaContent, null, /*#__PURE__*/_react.default.createElement(_TextArea.StyledTextAreaInput, {
+    $browser: browser === null || browser === void 0 ? void 0 : browser.name,
+    disabled: isDisabled,
+    $isInvalid: isInvalid,
+    ref: textareaRef,
+    value: value,
+    onBlur: onBlur,
+    onChange: onChange,
+    onFocus: onFocus,
+    onKeyDown: onKeyDown,
+    $maxHeight: maxHeight,
+    $minHeight: minHeight,
+    $isOverflowing: isOverflowing,
+    rows: 1
+  }), !value && /*#__PURE__*/_react.default.createElement(_TextArea.StyledTextAreaLabelWrapper, null, /*#__PURE__*/_react.default.createElement(_TextArea.StyledTextAreaLabel, {
+    $isInvalid: isInvalid
+  }, placeholder))), rightElement && shouldShowBorder && rightElement), rightElement && !shouldShowBorder && /*#__PURE__*/_react.default.createElement(_Input.StyledInputRightElement, null, rightElement)), [browser === null || browser === void 0 ? void 0 : browser.name, isDisabled, isInvalid, isOverflowing, maxHeight, minHeight, onBlur, onChange, onFocus, onKeyDown, placeholder, rightElement, shouldChangeColor, shouldShowBorder, value]);
+});
+TextArea.displayName = 'TextArea';
+var _default = exports.default = TextArea;
+//# sourceMappingURL=TextArea.js.map

package/lib/cjs/components/text-area/TextArea.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextArea.js","names":["_chaynsApi","require","_react","_interopRequireWildcard","_AreaContextProvider","_Input","_TextArea","_resize","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","TextArea","forwardRef","isDisabled","isInvalid","placeholder","value","onChange","onFocus","onKeyDown","rightElement","onBlur","maxHeight","minHeight","ref","_rightElement$props","isOverflowing","setIsOverflowing","useState","areaProvider","useContext","AreaContext","textareaRef","useRef","browser","getDevice","useCursorRepaint","shouldShowBorder","props","style","backgroundColor","undefined","shouldChangeColor","useMemo","adjustTextareaHeight","useCallback","current","height","scrollHeight","parseInt","toString","useImperativeHandle","useEffect","length","createElement","StyledTextArea","$isDisabled","StyledTextAreaContentWrapper","$isInvalid","$shouldChangeColor","StyledTextAreaContent","StyledTextAreaInput","$browser","name","disabled","$maxHeight","$minHeight","$isOverflowing","rows","StyledTextAreaLabelWrapper","StyledTextAreaLabel","StyledInputRightElement","displayName","_default","exports"],"sources":["../../../../src/components/text-area/TextArea.tsx"],"sourcesContent":["import { getDevice } from 'chayns-api';\nimport React, {\n    ChangeEventHandler,\n    CSSProperties,\n    FocusEventHandler,\n    forwardRef,\n    KeyboardEventHandler,\n    ReactElement,\n    useCallback,\n    useContext,\n    useEffect,\n    useImperativeHandle,\n    useMemo,\n    useRef,\n    useState,\n} from 'react';\nimport { BrowserName } from '../../types/chayns';\nimport { AreaContext } from '../area-provider/AreaContextProvider';\nimport { StyledInputRightElement } from '../input/Input.styles';\nimport {\n    StyledTextArea,\n    StyledTextAreaContent,\n    StyledTextAreaContentWrapper,\n    StyledTextAreaInput,\n    StyledTextAreaLabel,\n    StyledTextAreaLabelWrapper,\n} from './TextArea.styles';\nimport { useCursorRepaint } from '../../hooks/resize';\n\nexport type TextAreaProps = {\n    /**\n     * Disables the text area so that it cannot be changed.\n     */\n    isDisabled?: boolean;\n    /**\n     * If true, the text area is marked as invalid\n     */\n    isInvalid?: boolean;\n    /**\n     * The maximum height of the text area.\n     */\n    maxHeight?: CSSProperties['maxHeight'];\n    /**\n     * The minimum height of the text area.\n     */\n    minHeight?: CSSProperties['minHeight'];\n    /**\n     * Function that is executed when the text area loses focus.\n     */\n    onBlur?: FocusEventHandler<HTMLTextAreaElement>;\n    /**\n     * Function that is executed when the text of the text area changes.\n     */\n    onChange?: ChangeEventHandler<HTMLTextAreaElement>;\n    /**\n     * Function that is executed when the input field is focused\n     */\n    onFocus?: FocusEventHandler<HTMLTextAreaElement>;\n    /**\n     * Function that is executed when a letter is pressed\n     */\n    onKeyDown?: KeyboardEventHandler<HTMLTextAreaElement>;\n    /**\n     * Placeholder for the text area field.\n     */\n    placeholder?: string | ReactElement;\n    /**\n     * An element that should be displayed on the right side of the Input.\n     */\n    rightElement?: ReactElement;\n    /**\n     * Value if the text area should be controlled.\n     */\n    value?: string;\n};\n\nconst TextArea = forwardRef<HTMLTextAreaElement, TextAreaProps>(\n    (\n        {\n            isDisabled,\n            isInvalid,\n            placeholder,\n            value,\n            onChange,\n            onFocus,\n            onKeyDown,\n            rightElement,\n            onBlur,\n            maxHeight = '120px',\n            minHeight = '41px',\n        },\n        ref,\n    ) => {\n        const [isOverflowing, setIsOverflowing] = useState(false);\n\n        const areaProvider = useContext(AreaContext);\n\n        const textareaRef = useRef<HTMLTextAreaElement>(null);\n\n        const { browser } = getDevice();\n\n        useCursorRepaint(textareaRef);\n\n        // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n        const shouldShowBorder = rightElement?.props?.style?.backgroundColor === undefined;\n\n        const shouldChangeColor = useMemo(\n            () => areaProvider.shouldChangeColor ?? false,\n            [areaProvider.shouldChangeColor],\n        );\n\n        const adjustTextareaHeight = useCallback(() => {\n            if (textareaRef.current) {\n                textareaRef.current.style.height = 'auto';\n                textareaRef.current.style.height = `${textareaRef.current.scrollHeight}px`;\n\n                setIsOverflowing(\n                    textareaRef.current.scrollHeight > parseInt(maxHeight.toString(), 10),\n                );\n            }\n        }, [maxHeight]);\n\n        useImperativeHandle(ref, () => textareaRef.current as HTMLTextAreaElement);\n\n        /**\n         * This hook calculates the height of the TextArea after the displayValue is changed and the content is inside the \"textareaRef\".\n         * To maintain the functionality while clearing the input, the length need to be greater than -1.\n         */\n        useEffect(() => {\n            if (typeof value === 'string' && value.length > -1) {\n                adjustTextareaHeight();\n            }\n        }, [adjustTextareaHeight, value]);\n\n        return useMemo(\n            () => (\n                <StyledTextArea $isDisabled={isDisabled}>\n                    <StyledTextAreaContentWrapper\n                        $isInvalid={isInvalid}\n                        $shouldChangeColor={shouldChangeColor}\n                    >\n                        <StyledTextAreaContent>\n                            <StyledTextAreaInput\n                                $browser={browser?.name as BrowserName}\n                                disabled={isDisabled}\n                                $isInvalid={isInvalid}\n                                ref={textareaRef}\n                                value={value}\n                                onBlur={onBlur}\n                                onChange={onChange}\n                                onFocus={onFocus}\n                                onKeyDown={onKeyDown}\n                                $maxHeight={maxHeight}\n                                $minHeight={minHeight}\n                                $isOverflowing={isOverflowing}\n                                rows={1}\n                            />\n                            {!value && (\n                                <StyledTextAreaLabelWrapper>\n                                    <StyledTextAreaLabel $isInvalid={isInvalid}>\n                                        {placeholder}\n                                    </StyledTextAreaLabel>\n                                </StyledTextAreaLabelWrapper>\n                            )}\n                        </StyledTextAreaContent>\n                        {rightElement && shouldShowBorder && rightElement}\n                    </StyledTextAreaContentWrapper>\n                    {rightElement && !shouldShowBorder && (\n                        <StyledInputRightElement>{rightElement}</StyledInputRightElement>\n                    )}\n                </StyledTextArea>\n            ),\n            [\n                browser?.name,\n                isDisabled,\n                isInvalid,\n                isOverflowing,\n                maxHeight,\n                minHeight,\n                onBlur,\n                onChange,\n                onFocus,\n                onKeyDown,\n                placeholder,\n                rightElement,\n                shouldChangeColor,\n                shouldShowBorder,\n                value,\n            ],\n        );\n    },\n);\n\nTextArea.displayName = 'TextArea';\n\nexport default TextArea;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/text-area/TextArea.styles.js

@@ -0,0 +1,113 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StyledTextAreaLabelWrapper = exports.StyledTextAreaLabel = exports.StyledTextAreaInput = exports.StyledTextAreaContentWrapper = exports.StyledTextAreaContent = exports.StyledTextArea = void 0;
+var _styledComponents = _interopRequireWildcard(require("styled-components"));
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const StyledTextArea = exports.StyledTextArea = _styledComponents.default.div`
+    display: flex;
+    flex: 1 1 auto;
+    min-width: 0;
+    opacity: ${({
+  $isDisabled
+}) => $isDisabled ? 0.5 : 1};
+    position: relative;
+`;
+const StyledTextAreaContentWrapper = exports.StyledTextAreaContentWrapper = _styledComponents.default.div`
+    background-color: ${({
+  theme,
+  $shouldChangeColor
+}) => theme.colorMode === 'classic' || $shouldChangeColor ? theme['000'] : theme['100']};
+    border-radius: 3px;
+    border: 1px solid
+        ${({
+  theme,
+  $isInvalid
+}) => $isInvalid ? theme.wrong : 'rgba(160, 160, 160, 0.3)'};
+    width: 100%;
+    display: flex;
+`;
+const StyledTextAreaContent = exports.StyledTextAreaContent = _styledComponents.default.div`
+    position: relative;
+    display: flex;
+    width: 100%;
+`;
+const StyledTextAreaInput = exports.StyledTextAreaInput = _styledComponents.default.textarea`
+    color: ${({
+  theme,
+  $isInvalid
+}) => $isInvalid ? theme.wrong : theme.text};
+    background: none;
+    border: none;
+    resize: none;
+    overflow-y: ${({
+  $isOverflowing
+}) => $isOverflowing ? 'scroll' : 'hidden'};
+    max-height: ${({
+  $maxHeight
+}) => typeof $maxHeight === 'number' ? `${$maxHeight}px` : $maxHeight};
+    min-height: ${({
+  $minHeight
+}) => typeof $minHeight === 'number' ? `${$minHeight}px` : $minHeight};
+    width: 100%;
+    padding: 8px 10px;
+    cursor: text;
+
+    // Styles for custom scrollbar
+    ${({
+  $browser,
+  theme
+}) => $browser === 'firefox' ? (0, _styledComponents.css)`
+                  scrollbar-color: rgba(${theme['text-rgb']}, 0.15) transparent;
+                  scrollbar-width: thin;
+              ` : (0, _styledComponents.css)`
+                  &::-webkit-scrollbar {
+                      width: 10px;
+                  }
+
+                  &::-webkit-scrollbar-track {
+                      background-color: transparent;
+                  }
+
+                  &::-webkit-scrollbar-button {
+                      background-color: transparent;
+                      height: 5px;
+                  }
+
+                  &::-webkit-scrollbar-thumb {
+                      background-color: rgba(${theme['text-rgb']}, 0.15);
+                      border-radius: 20px;
+                      background-clip: padding-box;
+                      border: solid 3px transparent;
+                  }
+              `}
+`;
+const StyledTextAreaLabelWrapper = exports.StyledTextAreaLabelWrapper = _styledComponents.default.label`
+    left: 10px;
+    top: 12px;
+    align-items: baseline;
+    display: flex;
+    flex: 0 0 auto;
+    gap: 4px;
+    line-height: 1.3;
+    pointer-events: none;
+    position: absolute;
+    user-select: none;
+    width: calc(100% - 20px);
+    cursor: text;
+`;
+const StyledTextAreaLabel = exports.StyledTextAreaLabel = _styledComponents.default.label`
+    color: ${({
+  theme,
+  $isInvalid
+}) => $isInvalid ? theme.wrong : `rgba(${theme['text-rgb'] ?? ''}, 0.45)`};
+    line-height: 1.3;
+    width: 100%;
+    white-space: nowrap;
+    overflow: hidden;
+    cursor: text;
+    text-overflow: ellipsis;
+`;
+//# sourceMappingURL=TextArea.styles.js.map

package/lib/cjs/components/text-area/TextArea.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextArea.styles.js","names":["_styledComponents","_interopRequireWildcard","require","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","StyledTextArea","exports","styled","div","$isDisabled","StyledTextAreaContentWrapper","theme","$shouldChangeColor","colorMode","$isInvalid","wrong","StyledTextAreaContent","StyledTextAreaInput","textarea","text","$isOverflowing","$maxHeight","$minHeight","$browser","css","StyledTextAreaLabelWrapper","label","StyledTextAreaLabel"],"sources":["../../../../src/components/text-area/TextArea.styles.ts"],"sourcesContent":["import type { CSSProperties } from 'react';\nimport styled, { css } from 'styled-components';\nimport { BrowserName } from '../../types/chayns';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport type { TextAreaProps } from './TextArea';\n\ntype StyledTextAreaProps = WithTheme<{ $isDisabled?: boolean }>;\n\nexport const StyledTextArea = styled.div<StyledTextAreaProps>`\n    display: flex;\n    flex: 1 1 auto;\n    min-width: 0;\n    opacity: ${({ $isDisabled }) => ($isDisabled ? 0.5 : 1)};\n    position: relative;\n`;\n\ntype StyledTextAreaContentWrapperProps = WithTheme<{\n    $isInvalid: TextAreaProps['isInvalid'];\n    $shouldChangeColor: boolean;\n}>;\n\nexport const StyledTextAreaContentWrapper = styled.div<StyledTextAreaContentWrapperProps>`\n    background-color: ${({ theme, $shouldChangeColor }: StyledTextAreaContentWrapperProps) =>\n        theme.colorMode === 'classic' || $shouldChangeColor ? theme['000'] : theme['100']};\n    border-radius: 3px;\n    border: 1px solid\n        ${({ theme, $isInvalid }: StyledTextAreaContentWrapperProps) =>\n            $isInvalid ? theme.wrong : 'rgba(160, 160, 160, 0.3)'};\n    width: 100%;\n    display: flex;\n`;\n\nexport const StyledTextAreaContent = styled.div`\n    position: relative;\n    display: flex;\n    width: 100%;\n`;\n\ntype StyledTextAreaInputProps = WithTheme<{\n    $browser: BrowserName;\n    $isInvalid: TextAreaProps['isInvalid'];\n    $isOverflowing: boolean;\n    $maxHeight: CSSProperties['maxHeight'];\n    $minHeight: CSSProperties['minHeight'];\n}>;\n\nexport const StyledTextAreaInput = styled.textarea<StyledTextAreaInputProps>`\n    color: ${({ theme, $isInvalid }: StyledTextAreaInputProps) =>\n        $isInvalid ? theme.wrong : theme.text};\n    background: none;\n    border: none;\n    resize: none;\n    overflow-y: ${({ $isOverflowing }) => ($isOverflowing ? 'scroll' : 'hidden')};\n    max-height: ${({ $maxHeight }: StyledTextAreaInputProps) =>\n        typeof $maxHeight === 'number' ? `${$maxHeight}px` : $maxHeight};\n    min-height: ${({ $minHeight }: StyledTextAreaInputProps) =>\n        typeof $minHeight === 'number' ? `${$minHeight}px` : $minHeight};\n    width: 100%;\n    padding: 8px 10px;\n    cursor: text;\n\n    // Styles for custom scrollbar\n    ${({ $browser, theme }: StyledTextAreaInputProps) =>\n        $browser === 'firefox'\n            ? css`\n                  scrollbar-color: rgba(${theme['text-rgb']}, 0.15) transparent;\n                  scrollbar-width: thin;\n              `\n            : css`\n                  &::-webkit-scrollbar {\n                      width: 10px;\n                  }\n\n                  &::-webkit-scrollbar-track {\n                      background-color: transparent;\n                  }\n\n                  &::-webkit-scrollbar-button {\n                      background-color: transparent;\n                      height: 5px;\n                  }\n\n                  &::-webkit-scrollbar-thumb {\n                      background-color: rgba(${theme['text-rgb']}, 0.15);\n                      border-radius: 20px;\n                      background-clip: padding-box;\n                      border: solid 3px transparent;\n                  }\n              `}\n`;\n\nexport const StyledTextAreaLabelWrapper = styled.label`\n    left: 10px;\n    top: 12px;\n    align-items: baseline;\n    display: flex;\n    flex: 0 0 auto;\n    gap: 4px;\n    line-height: 1.3;\n    pointer-events: none;\n    position: absolute;\n    user-select: none;\n    width: calc(100% - 20px);\n    cursor: text;\n`;\n\ntype StyledTextAreaLabelProps = WithTheme<{ $isInvalid?: TextAreaProps['isInvalid'] }>;\n\nexport const StyledTextAreaLabel = styled.label<StyledTextAreaLabelProps>`\n    color: ${({ theme, $isInvalid }: StyledTextAreaLabelProps) =>\n        $isInvalid ? theme.wrong : `rgba(${theme['text-rgb'] ?? ''}, 0.45)`};\n    line-height: 1.3;\n    width: 100%;\n    white-space: nowrap;\n    overflow: hidden;\n    cursor: text;\n    text-overflow: ellipsis;\n`;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/tooltip/Tooltip.js

@@ -0,0 +1,66 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _tooltip = require("../../utils/tooltip");
+var _Popup = _interopRequireDefault(require("../popup/Popup"));
+var _TooltipItem = _interopRequireDefault(require("./tooltip-item/TooltipItem"));
+var _Tooltip = require("./Tooltip.styles");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+const Tooltip = ({
+  alignment,
+  item,
+  children,
+  container,
+  isDisabled,
+  shouldHideOnChildrenLeave,
+  maxItemWidth,
+  yOffset,
+  itemWidth,
+  shouldUseFullWidth = false,
+  shouldUseChildrenWidth = !shouldUseFullWidth
+}) => {
+  const tooltipRef = (0, _react.useRef)(null);
+  const content = (0, _react.useMemo)(() => {
+    if (/*#__PURE__*/(0, _react.isValidElement)(item)) {
+      return item;
+    }
+    return /*#__PURE__*/_react.default.createElement(_TooltipItem.default, {
+      width: itemWidth,
+      maxWidth: maxItemWidth,
+      text: item.text,
+      headline: item.headline,
+      imageUrl: item.imageUrl,
+      button: item.button
+    });
+  }, [item, itemWidth, maxItemWidth]);
+  return (0, _react.useMemo)(() => /*#__PURE__*/_react.default.createElement(_Tooltip.StyledTooltip, {
+    className: "beta-chayns-tooltip"
+  }, isDisabled ? /*#__PURE__*/_react.default.createElement(_Tooltip.StyledTooltipChildren, {
+    $isOnlyText: (0, _tooltip.isTextOnlyElement)(children),
+    $shouldUseChildrenWidth: shouldUseChildrenWidth,
+    $shouldUseFullWidth: shouldUseFullWidth
+  }, children) : /*#__PURE__*/_react.default.createElement(_Popup.default, {
+    alignment: alignment,
+    shouldShowOnHover: true,
+    shouldHideOnChildrenLeave: shouldHideOnChildrenLeave,
+    content: content,
+    ref: tooltipRef,
+    container: container,
+    yOffset: yOffset,
+    shouldUseChildrenWidth: shouldUseChildrenWidth,
+    shouldUseFullWidth: shouldUseFullWidth,
+    shouldScrollWithContent: true
+  }, /*#__PURE__*/_react.default.createElement(_Tooltip.StyledTooltipChildren, {
+    $isOnlyText: (0, _tooltip.isTextOnlyElement)(children),
+    $shouldUseChildrenWidth: shouldUseChildrenWidth,
+    $shouldUseFullWidth: shouldUseFullWidth
+  }, children))), [isDisabled, children, shouldUseChildrenWidth, shouldUseFullWidth, alignment, shouldHideOnChildrenLeave, content, container, yOffset]);
+};
+Tooltip.displayName = 'Tooltip';
+var _default = exports.default = Tooltip;
+//# sourceMappingURL=Tooltip.js.map

package/lib/cjs/components/tooltip/Tooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip.js","names":["_react","_interopRequireWildcard","require","_tooltip","_Popup","_interopRequireDefault","_TooltipItem","_Tooltip","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","Tooltip","alignment","item","children","container","isDisabled","shouldHideOnChildrenLeave","maxItemWidth","yOffset","itemWidth","shouldUseFullWidth","shouldUseChildrenWidth","tooltipRef","useRef","content","useMemo","isValidElement","createElement","width","maxWidth","text","headline","imageUrl","button","StyledTooltip","className","StyledTooltipChildren","$isOnlyText","isTextOnlyElement","$shouldUseChildrenWidth","$shouldUseFullWidth","shouldShowOnHover","ref","shouldScrollWithContent","displayName","_default","exports"],"sources":["../../../../src/components/tooltip/Tooltip.tsx"],"sourcesContent":["import React, { FC, isValidElement, ReactNode, useMemo, useRef, type CSSProperties } from 'react';\nimport type { PopupAlignment, PopupRef } from '../../types/popup';\nimport type { ITooltipItem } from '../../types/tooltip';\nimport { isTextOnlyElement } from '../../utils/tooltip';\nimport Popup from '../popup/Popup';\nimport TooltipItem from './tooltip-item/TooltipItem';\nimport { StyledTooltip, StyledTooltipChildren } from './Tooltip.styles';\n\nexport type TooltipProps = {\n    /**\n     * The alignment of the tooltip. By default, the tooltip will calculate the best alignment.\n     */\n    alignment?: PopupAlignment;\n    /**\n     * The elements that the tooltip should surround.\n     */\n    children: ReactNode;\n    /**\n     * The element where the content of the `Tooltip` should be rendered via React Portal.\n     */\n    container?: Element;\n    /**\n     * The content that should be displayed.\n     */\n    item: ITooltipItem | ReactNode;\n    /**\n     * The width of an item.\n     */\n    itemWidth?: CSSProperties['width'];\n    /**\n     * whether the tooltip should be shown.\n     */\n    isDisabled?: boolean;\n    /**\n     * The max width of the Tooltip.\n     */\n    maxItemWidth?: number;\n    /**\n     * Whether the tooltip should be hidden after the children is not hovered.\n     */\n    shouldHideOnChildrenLeave?: boolean;\n    /**\n     * Whether the width of the children should be used.\n     */\n    shouldUseChildrenWidth?: boolean;\n    /**\n     * Whether the tooltip children should use the full width.\n     */\n    shouldUseFullWidth?: boolean;\n    /**\n     * The Y offset of the tooltip to the children.\n     */\n    yOffset?: number;\n};\n\nconst Tooltip: FC<TooltipProps> = ({\n    alignment,\n    item,\n    children,\n    container,\n    isDisabled,\n    shouldHideOnChildrenLeave,\n    maxItemWidth,\n    yOffset,\n    itemWidth,\n    shouldUseFullWidth = false,\n    shouldUseChildrenWidth = !shouldUseFullWidth,\n}) => {\n    const tooltipRef = useRef<PopupRef>(null);\n\n    const content = useMemo(() => {\n        if (isValidElement(item)) {\n            return item;\n        }\n\n        return (\n            <TooltipItem\n                width={itemWidth}\n                maxWidth={maxItemWidth}\n                text={(item as ITooltipItem).text}\n                headline={(item as ITooltipItem).headline}\n                imageUrl={(item as ITooltipItem).imageUrl}\n                button={(item as ITooltipItem).button}\n            />\n        );\n    }, [item, itemWidth, maxItemWidth]);\n\n    return useMemo(\n        () => (\n            <StyledTooltip className=\"beta-chayns-tooltip\">\n                {isDisabled ? (\n                    <StyledTooltipChildren\n                        $isOnlyText={isTextOnlyElement(children)}\n                        $shouldUseChildrenWidth={shouldUseChildrenWidth}\n                        $shouldUseFullWidth={shouldUseFullWidth}\n                    >\n                        {children}\n                    </StyledTooltipChildren>\n                ) : (\n                    <Popup\n                        alignment={alignment}\n                        shouldShowOnHover\n                        shouldHideOnChildrenLeave={shouldHideOnChildrenLeave}\n                        content={content}\n                        ref={tooltipRef}\n                        container={container}\n                        yOffset={yOffset}\n                        shouldUseChildrenWidth={shouldUseChildrenWidth}\n                        shouldUseFullWidth={shouldUseFullWidth}\n                        shouldScrollWithContent\n                    >\n                        <StyledTooltipChildren\n                            $isOnlyText={isTextOnlyElement(children)}\n                            $shouldUseChildrenWidth={shouldUseChildrenWidth}\n                            $shouldUseFullWidth={shouldUseFullWidth}\n                        >\n                            {children}\n                        </StyledTooltipChildren>\n                    </Popup>\n                )}\n            </StyledTooltip>\n        ),\n        [\n            isDisabled,\n            children,\n            shouldUseChildrenWidth,\n            shouldUseFullWidth,\n            alignment,\n            shouldHideOnChildrenLeave,\n            content,\n            container,\n            yOffset,\n        ],\n    );\n};\n\nTooltip.displayName = 'Tooltip';\n\nexport default Tooltip;\n"],"mappings":"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","ignoreList":[]}