@chayns-components/core 5.0.0-beta.997 → 5.0.0

package/lib/cjs/components/slider-button/SliderButton.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"SliderButton.styles.js","names":["_framerMotion","require","_styledComponents","_interopRequireDefault","e","__esModule","default","StyledSliderButton","exports","styled","div","$isDisabled","StyledSliderButtonWrapper","theme","$width","StyledSliderButtonItem","StyledSliderButtonPopupContent","StyledSliderButtonPopupContentItem","$isSelected","undefined","StyledSliderButtonButtonsWrapper","$isInvisible","StyledMotionSliderButtonThumb","motion"],"sources":["../../../../src/components/slider-button/SliderButton.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledSliderButtonProps = WithTheme<{ $isDisabled?: boolean }>;\n\nexport const StyledSliderButton = styled.div<StyledSliderButtonProps>`\n    opacity: ${({ $isDisabled }) => ($isDisabled ? 0.5 : 1)};\n    width: 100%;\n    touch-action: none;\n    position: relative;\n`;\n\ntype StyledSliderButtonWrapperProps = WithTheme<{ $width: number; $isDisabled?: boolean }>;\n\nexport const StyledSliderButtonWrapper = styled.div<StyledSliderButtonWrapperProps>`\n    align-items: center;\n    background-color: ${({ theme }: StyledMotionSliderButtonThumbProps) => theme['408']};\n    border-radius: 3px;\n    border: none;\n    color: white;\n    cursor: pointer;\n    display: inline-flex;\n    line-height: 1.15;\n    height: 32px;\n    position: relative;\n    user-select: none;\n    transition: opacity 0.3s ease;\n\n    width: ${({ $width }) => $width}px;\n\n    max-width: 100%;\n    overflow-x: ${({ $isDisabled }) => ($isDisabled ? 'hidden' : 'scroll')};\n    overflow-y: hidden;\n\n    // Chrome\n    &::-webkit-scrollbar {\n        display: none;\n    }\n\n    // IE and Edge\n    -ms-overflow-style: none;\n\n    // Firefox\n    scrollbar-width: none;\n`;\n\ntype StyledSliderButtonItemProps = WithTheme<{ $width: number }>;\n\nexport const StyledSliderButtonItem = styled.div<StyledSliderButtonItemProps>`\n    font-size: 110%;\n    font-family: 'Roboto Medium', serif;\n    padding: 7px 12px;\n    min-width: ${({ $width }) => $width}px;\n    max-width: ${({ $width }) => $width}px;\n    display: flex;\n    white-space: nowrap;\n    justify-content: center;\n    color: white;\n`;\n\nexport const StyledSliderButtonPopupContent = styled.div`\n    display: flex;\n    flex-direction: column;\n`;\n\ntype StyledSliderButtonPopupContentItemProps = WithTheme<{ $isSelected?: boolean }>;\n\nexport const StyledSliderButtonPopupContentItem = styled.div<StyledSliderButtonPopupContentItemProps>`\n    font-size: 110%;\n    font-family: 'Roboto Medium', serif;\n    cursor: pointer;\n    background-color: ${({ $isSelected, theme }: StyledSliderButtonPopupContentItemProps) =>\n        $isSelected ? theme['secondary-102'] : undefined};\n    padding: 4px 12px;\n`;\n\ntype StyledSliderButtonButtonsWrapperProps = WithTheme<{ $isInvisible?: boolean }>;\n\nexport const StyledSliderButtonButtonsWrapper = styled.div<StyledSliderButtonButtonsWrapperProps>`\n    position: absolute;\n    z-index: ${({ $isInvisible }) => ($isInvisible ? '2' : '4')};\n    opacity: ${({ $isInvisible }) => ($isInvisible ? 0 : 1)};\n    display: flex;\n    cursor: pointer;\n    align-items: center;\n    pointer-events: ${({ $isInvisible }) => ($isInvisible ? 'auto' : 'none')};\n`;\n\ntype StyledMotionSliderButtonThumbProps = WithTheme<{ $width: number }>;\n\nexport const StyledMotionSliderButtonThumb = styled(motion.div)<StyledMotionSliderButtonThumbProps>`\n    font-size: 110%;\n    font-family: 'Roboto Medium', serif;\n    background-color: ${({ theme }: StyledSliderButtonProps) => theme['405']};\n    opacity: 1;\n    width: ${({ $width }) => $width - 8}px;\n    position: absolute;\n    border-radius: 2px;\n    top: 4px;\n    left: 4px;\n    white-space: nowrap;\n    z-index: 3;\n    height: 24px;\n    padding: 7px 12px;\n    display: flex;\n    color: white;\n    justify-content: center;\n    align-items: center;\n    cursor: pointer;\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,aAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAC,sBAAA,CAAAF,OAAA;AAAuC,SAAAE,uBAAAC,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAKhC,MAAMG,kBAAkB,GAAAC,OAAA,CAAAD,kBAAA,GAAGE,yBAAM,CAACC,GAA4B;AACrE,eAAe,CAAC;EAAEC;AAAY,CAAC,KAAMA,WAAW,GAAG,GAAG,GAAG,CAAE;AAC3D;AACA;AACA;AACA,CAAC;AAIM,MAAMC,yBAAyB,GAAAJ,OAAA,CAAAI,yBAAA,GAAGH,yBAAM,CAACC,GAAmC;AACnF;AACA,wBAAwB,CAAC;EAAEG;AAA0C,CAAC,KAAKA,KAAK,CAAC,KAAK,CAAC;AACvF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAa,CAAC;EAAEC;AAAO,CAAC,KAAKA,MAAM;AACnC;AACA;AACA,kBAAkB,CAAC;EAAEH;AAAY,CAAC,KAAMA,WAAW,GAAG,QAAQ,GAAG,QAAS;AAC1E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAIM,MAAMI,sBAAsB,GAAAP,OAAA,CAAAO,sBAAA,GAAGN,yBAAM,CAACC,GAAgC;AAC7E;AACA;AACA;AACA,iBAAiB,CAAC;EAAEI;AAAO,CAAC,KAAKA,MAAM;AACvC,iBAAiB,CAAC;EAAEA;AAAO,CAAC,KAAKA,MAAM;AACvC;AACA;AACA;AACA;AACA,CAAC;AAEM,MAAME,8BAA8B,GAAAR,OAAA,CAAAQ,8BAAA,GAAGP,yBAAM,CAACC,GAAG;AACxD;AACA;AACA,CAAC;AAIM,MAAMO,kCAAkC,GAAAT,OAAA,CAAAS,kCAAA,GAAGR,yBAAM,CAACC,GAA4C;AACrG;AACA;AACA;AACA,wBAAwB,CAAC;EAAEQ,WAAW;EAAEL;AAA+C,CAAC,KAChFK,WAAW,GAAGL,KAAK,CAAC,eAAe,CAAC,GAAGM,SAAS;AACxD;AACA,CAAC;AAIM,MAAMC,gCAAgC,GAAAZ,OAAA,CAAAY,gCAAA,GAAGX,yBAAM,CAACC,GAA0C;AACjG;AACA,eAAe,CAAC;EAAEW;AAAa,CAAC,KAAMA,YAAY,GAAG,GAAG,GAAG,GAAI;AAC/D,eAAe,CAAC;EAAEA;AAAa,CAAC,KAAMA,YAAY,GAAG,CAAC,GAAG,CAAE;AAC3D;AACA;AACA;AACA,sBAAsB,CAAC;EAAEA;AAAa,CAAC,KAAMA,YAAY,GAAG,MAAM,GAAG,MAAO;AAC5E,CAAC;AAIM,MAAMC,6BAA6B,GAAAd,OAAA,CAAAc,6BAAA,GAAG,IAAAb,yBAAM,EAACc,oBAAM,CAACb,GAAG,CAAqC;AACnG;AACA;AACA,wBAAwB,CAAC;EAAEG;AAA+B,CAAC,KAAKA,KAAK,CAAC,KAAK,CAAC;AAC5E;AACA,aAAa,CAAC;EAAEC;AAAO,CAAC,KAAKA,MAAM,GAAG,CAAC;AACvC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}
+{"version":3,"file":"SliderButton.styles.js","names":["_react","require","_styledComponents","_interopRequireDefault","e","__esModule","default","StyledSliderButton","exports","styled","div","$isDisabled","StyledSliderButtonWrapper","$width","StyledSliderButtonItem","$isSecondary","theme","text","buttonColor","StyledSliderButtonPopupContent","StyledSliderButtonPopupContentItem","$isSelected","undefined","StyledSliderButtonButtonsWrapper","$isInvisible","StyledMotionSliderButtonThumb","motion"],"sources":["../../../../src/components/slider-button/SliderButton.styles.ts"],"sourcesContent":["import { motion } from 'motion/react';\nimport styled from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledSliderButtonProps = WithTheme<{ $isDisabled?: boolean }>;\n\nexport const StyledSliderButton = styled.div<StyledSliderButtonProps>`\n    opacity: ${({ $isDisabled }) => ($isDisabled ? 0.5 : 1)};\n    width: 100%;\n    touch-action: none;\n    position: relative;\n`;\n\ntype StyledSliderButtonWrapperProps = WithTheme<{ $width: number; $isDisabled?: boolean }>;\n\nexport const StyledSliderButtonWrapper = styled.div<StyledSliderButtonWrapperProps>`\n    align-items: center;\n    border-radius: 3px;\n    border: none;\n    color: white;\n    cursor: pointer;\n    display: inline-flex;\n    line-height: 1.15;\n    height: 32px;\n    position: relative;\n    user-select: none;\n    transition: opacity 0.3s ease;\n\n    width: ${({ $width }) => $width}px;\n\n    max-width: 100%;\n    overflow-x: ${({ $isDisabled }) => ($isDisabled ? 'hidden' : 'scroll')};\n    overflow-y: hidden;\n\n    // Chrome\n    &::-webkit-scrollbar {\n        display: none;\n    }\n\n    // IE and Edge\n    -ms-overflow-style: none;\n\n    // Firefox\n    scrollbar-width: none;\n`;\n\ntype StyledSliderButtonItemProps = WithTheme<{\n    $isSecondary?: boolean;\n    $width: number;\n}>;\n\nexport const StyledSliderButtonItem = styled.div<StyledSliderButtonItemProps>`\n    font-size: 110%;\n    font-family: 'Roboto Medium', serif;\n    padding: 7px 12px;\n    min-width: ${({ $width }) => $width}px;\n    max-width: ${({ $width }) => $width}px;\n    display: flex;\n    white-space: nowrap;\n    justify-content: center;\n    color: ${({ $isSecondary, theme }: StyledSliderButtonItemProps) =>\n        $isSecondary ? theme.text : (theme.buttonColor ?? 'white')};\n`;\n\nexport const StyledSliderButtonPopupContent = styled.div`\n    display: flex;\n    flex-direction: column;\n`;\n\ntype StyledSliderButtonPopupContentItemProps = WithTheme<{ $isSelected?: boolean }>;\n\nexport const StyledSliderButtonPopupContentItem = styled.div<StyledSliderButtonPopupContentItemProps>`\n    font-size: 110%;\n    font-family: 'Roboto Medium', serif;\n    cursor: pointer;\n    background-color: ${({ $isSelected, theme }: StyledSliderButtonPopupContentItemProps) =>\n        $isSelected ? theme['secondary-102'] : undefined};\n    padding: 4px 12px;\n`;\n\ntype StyledSliderButtonButtonsWrapperProps = WithTheme<{ $isInvisible?: boolean }>;\n\nexport const StyledSliderButtonButtonsWrapper = styled.div<StyledSliderButtonButtonsWrapperProps>`\n    position: absolute;\n    z-index: ${({ $isInvisible }) => ($isInvisible ? '2' : '4')};\n    opacity: ${({ $isInvisible }) => ($isInvisible ? 0 : 1)};\n    display: flex;\n    cursor: pointer;\n    align-items: center;\n    pointer-events: ${({ $isInvisible }) => ($isInvisible ? 'auto' : 'none')};\n`;\n\ntype StyledMotionSliderButtonThumbProps = WithTheme<{ $width: number }>;\n\nexport const StyledMotionSliderButtonThumb = styled(motion.div)<StyledMotionSliderButtonThumbProps>`\n    font-size: 110%;\n    font-family: 'Roboto Medium', serif;\n    opacity: 1;\n    width: ${({ $width }) => $width - 8}px;\n    position: absolute;\n    border-radius: 2px;\n    top: 4px;\n    left: 4px;\n    white-space: nowrap;\n    z-index: 3;\n    height: 24px;\n    padding: 7px 12px;\n    display: flex;\n    color: white;\n    justify-content: center;\n    align-items: center;\n    cursor: pointer;\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAC,sBAAA,CAAAF,OAAA;AAAuC,SAAAE,uBAAAC,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAKhC,MAAMG,kBAAkB,GAAAC,OAAA,CAAAD,kBAAA,GAAGE,yBAAM,CAACC,GAA4B;AACrE,eAAe,CAAC;EAAEC;AAAY,CAAC,KAAMA,WAAW,GAAG,GAAG,GAAG,CAAE;AAC3D;AACA;AACA;AACA,CAAC;AAIM,MAAMC,yBAAyB,GAAAJ,OAAA,CAAAI,yBAAA,GAAGH,yBAAM,CAACC,GAAmC;AACnF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAa,CAAC;EAAEG;AAAO,CAAC,KAAKA,MAAM;AACnC;AACA;AACA,kBAAkB,CAAC;EAAEF;AAAY,CAAC,KAAMA,WAAW,GAAG,QAAQ,GAAG,QAAS;AAC1E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAOM,MAAMG,sBAAsB,GAAAN,OAAA,CAAAM,sBAAA,GAAGL,yBAAM,CAACC,GAAgC;AAC7E;AACA;AACA;AACA,iBAAiB,CAAC;EAAEG;AAAO,CAAC,KAAKA,MAAM;AACvC,iBAAiB,CAAC;EAAEA;AAAO,CAAC,KAAKA,MAAM;AACvC;AACA;AACA;AACA,aAAa,CAAC;EAAEE,YAAY;EAAEC;AAAmC,CAAC,KAC1DD,YAAY,GAAGC,KAAK,CAACC,IAAI,GAAID,KAAK,CAACE,WAAW,IAAI,OAAQ;AAClE,CAAC;AAEM,MAAMC,8BAA8B,GAAAX,OAAA,CAAAW,8BAAA,GAAGV,yBAAM,CAACC,GAAG;AACxD;AACA;AACA,CAAC;AAIM,MAAMU,kCAAkC,GAAAZ,OAAA,CAAAY,kCAAA,GAAGX,yBAAM,CAACC,GAA4C;AACrG;AACA;AACA;AACA,wBAAwB,CAAC;EAAEW,WAAW;EAAEL;AAA+C,CAAC,KAChFK,WAAW,GAAGL,KAAK,CAAC,eAAe,CAAC,GAAGM,SAAS;AACxD;AACA,CAAC;AAIM,MAAMC,gCAAgC,GAAAf,OAAA,CAAAe,gCAAA,GAAGd,yBAAM,CAACC,GAA0C;AACjG;AACA,eAAe,CAAC;EAAEc;AAAa,CAAC,KAAMA,YAAY,GAAG,GAAG,GAAG,GAAI;AAC/D,eAAe,CAAC;EAAEA;AAAa,CAAC,KAAMA,YAAY,GAAG,CAAC,GAAG,CAAE;AAC3D;AACA;AACA;AACA,sBAAsB,CAAC;EAAEA;AAAa,CAAC,KAAMA,YAAY,GAAG,MAAM,GAAG,MAAO;AAC5E,CAAC;AAIM,MAAMC,6BAA6B,GAAAjB,OAAA,CAAAiB,6BAAA,GAAG,IAAAhB,yBAAM,EAACiB,aAAM,CAAChB,GAAG,CAAqC;AACnG;AACA;AACA;AACA,aAAa,CAAC;EAAEG;AAAO,CAAC,KAAKA,MAAM,GAAG,CAAC;AACvC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}

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

@@ -1 +1 @@
-{"version":3,"file":"SmallWaitCursor.js","names":["_react","_interopRequireDefault","require","_SmallWaitCursor","e","__esModule","default","SmallWaitCursorSize","exports","SmallWaitCursorSpeed","SmallWaitCursor","shouldHideBackground","shouldHideWaitCursor","size","Medium","speed","color","createElement","StyledSmallWaitCursor","$shouldShowWaitCursor","$size","StyledSmallWaitCursorWaitCursor","$shouldHideBackground","$speed","$color","StyledSmallWaitCursorBackground","displayName","_default"],"sources":["../../../../src/components/small-wait-cursor/SmallWaitCursor.tsx"],"sourcesContent":["// noinspection JSUnusedGlobalSymbols\n\nimport React, { FC } from 'react';\nimport {\n    StyledSmallWaitCursor,\n    StyledSmallWaitCursorBackground,\n    StyledSmallWaitCursorWaitCursor,\n} from './SmallWaitCursor.styles';\n\nexport enum SmallWaitCursorSize {\n    Small = 16,\n    Medium = 30,\n}\n\nexport enum SmallWaitCursorSpeed {\n    Slow = 1.5,\n    Medium = 1,\n    Fast = 0.5,\n}\n\nexport type SmallWaitCursorProps = {\n    /**\n     * Specifies whether the wait cursor should be displayed with a background.\n     */\n    shouldHideBackground?: boolean;\n    /**\n     * Specifies whether the wait cursor should be displayed.\n     */\n    shouldHideWaitCursor?: boolean;\n    /**\n     * The size of the wait cursor in pixels. Use the SmallWaitCursorSize enum for this prop.\n     */\n    size?: SmallWaitCursorSize | number;\n    /**\n     * The speed of the animation in seconds. Use the SmallWaitCursorSpeed enum for this prop.\n     */\n    speed?: SmallWaitCursorSpeed;\n    /**\n     * The color of the inner circle of the wait cursor.\n     */\n    color?: string;\n};\n\nconst SmallWaitCursor: FC<SmallWaitCursorProps> = ({\n    shouldHideBackground = false,\n    shouldHideWaitCursor = false,\n    size = SmallWaitCursorSize.Medium,\n    speed = SmallWaitCursorSpeed.Medium,\n    color,\n}) => (\n    <StyledSmallWaitCursor $shouldShowWaitCursor={!shouldHideWaitCursor} $size={size}>\n        <StyledSmallWaitCursorWaitCursor\n            $shouldHideBackground={shouldHideBackground}\n            $size={size}\n            $speed={speed}\n            $color={color}\n        />\n        {!shouldHideBackground && <StyledSmallWaitCursorBackground />}\n    </StyledSmallWaitCursor>\n);\n\nSmallWaitCursor.displayName = 'SmallWaitCursor';\n\nexport default SmallWaitCursor;\n"],"mappings":";;;;;;AAEA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,gBAAA,GAAAD,OAAA;AAIkC,SAAAD,uBAAAG,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAPlC;AAAA,IASYG,mBAAmB,GAAAC,OAAA,CAAAD,mBAAA,0BAAnBA,mBAAmB;EAAnBA,mBAAmB,CAAnBA,mBAAmB;EAAnBA,mBAAmB,CAAnBA,mBAAmB;EAAA,OAAnBA,mBAAmB;AAAA;AAAA,IAKnBE,oBAAoB,GAAAD,OAAA,CAAAC,oBAAA,0BAApBA,oBAAoB;EAApBA,oBAAoB,CAApBA,oBAAoB;EAApBA,oBAAoB,CAApBA,oBAAoB;EAApBA,oBAAoB,CAApBA,oBAAoB;EAAA,OAApBA,oBAAoB;AAAA;AA6BhC,MAAMC,eAAyC,GAAGA,CAAC;EAC/CC,oBAAoB,GAAG,KAAK;EAC5BC,oBAAoB,GAAG,KAAK;EAC5BC,IAAI,GAAGN,mBAAmB,CAACO,MAAM;EACjCC,KAAK,GAAGN,oBAAoB,CAACK,MAAM;EACnCE;AACJ,CAAC,kBACGhB,MAAA,CAAAM,OAAA,CAAAW,aAAA,CAACd,gBAAA,CAAAe,qBAAqB;EAACC,qBAAqB,EAAE,CAACP,oBAAqB;EAACQ,KAAK,EAAEP;AAAK,gBAC7Eb,MAAA,CAAAM,OAAA,CAAAW,aAAA,CAACd,gBAAA,CAAAkB,+BAA+B;EAC5BC,qBAAqB,EAAEX,oBAAqB;EAC5CS,KAAK,EAAEP,IAAK;EACZU,MAAM,EAAER,KAAM;EACdS,MAAM,EAAER;AAAM,CACjB,CAAC,EACD,CAACL,oBAAoB,iBAAIX,MAAA,CAAAM,OAAA,CAAAW,aAAA,CAACd,gBAAA,CAAAsB,+BAA+B,MAAE,CACzC,CAC1B;AAEDf,eAAe,CAACgB,WAAW,GAAG,iBAAiB;AAAC,IAAAC,QAAA,GAAAnB,OAAA,CAAAF,OAAA,GAEjCI,eAAe","ignoreList":[]}
+{"version":3,"file":"SmallWaitCursor.js","names":["_react","_interopRequireDefault","require","_SmallWaitCursor","e","__esModule","default","SmallWaitCursorSize","exports","SmallWaitCursorSpeed","SmallWaitCursor","shouldHideBackground","shouldHideWaitCursor","size","Medium","speed","color","createElement","StyledSmallWaitCursor","$shouldShowWaitCursor","$size","StyledSmallWaitCursorWaitCursor","$shouldHideBackground","$speed","$color","StyledSmallWaitCursorBackground","displayName","_default"],"sources":["../../../../src/components/small-wait-cursor/SmallWaitCursor.tsx"],"sourcesContent":["// noinspection JSUnusedGlobalSymbols\n\nimport React, { FC } from 'react';\nimport {\n    StyledSmallWaitCursor,\n    StyledSmallWaitCursorBackground,\n    StyledSmallWaitCursorWaitCursor,\n} from './SmallWaitCursor.styles';\n\nexport enum SmallWaitCursorSize {\n    Small = 16,\n    Medium = 30,\n}\n\nexport enum SmallWaitCursorSpeed {\n    Slow = 1.5,\n    Medium = 1,\n    Fast = 0.5,\n}\n\nexport type SmallWaitCursorProps = {\n    /**\n     * @description The color of the inner circle of the wait cursor.\n     * @optional\n     * @default undefined\n     * @example <SmallWaitCursor color=\"#FF0000\" />\n     */\n    color?: string;\n    /**\n     * @description Specifies whether the wait cursor should be displayed with a background.\n     * @optional\n     * @default false\n     * @example <SmallWaitCursor shouldHideBackground />\n     */\n    shouldHideBackground?: boolean;\n    /**\n     * @description Specifies whether the wait cursor should be displayed.\n     * @optional\n     * @default false\n     * @example <SmallWaitCursor shouldHideWaitCursor />\n     */\n    shouldHideWaitCursor?: boolean;\n    /**\n     * @description The size of the wait cursor in pixels. Use the SmallWaitCursorSize enum for this prop or a custom value in pixels.\n     * @optional\n     * @default SmallWaitCursorSize.Medium\n     * @example <SmallWaitCursor size={SmallWaitCursorSize.Small} />\n     */\n    size?: SmallWaitCursorSize | number;\n    /**\n     * @description The speed of the animation in seconds. Use the SmallWaitCursorSpeed enum for this prop.\n     * @optional\n     * @default SmallWaitCursorSpeed.Medium\n     * @example <SmallWaitCursor speed={SmallWaitCursorSpeed.Fast} />\n     */\n    speed?: SmallWaitCursorSpeed;\n};\n\nconst SmallWaitCursor: FC<SmallWaitCursorProps> = ({\n    shouldHideBackground = false,\n    shouldHideWaitCursor = false,\n    size = SmallWaitCursorSize.Medium,\n    speed = SmallWaitCursorSpeed.Medium,\n    color,\n}) => (\n    <StyledSmallWaitCursor $shouldShowWaitCursor={!shouldHideWaitCursor} $size={size}>\n        <StyledSmallWaitCursorWaitCursor\n            $shouldHideBackground={shouldHideBackground}\n            $size={size}\n            $speed={speed}\n            $color={color}\n        />\n        {!shouldHideBackground && <StyledSmallWaitCursorBackground />}\n    </StyledSmallWaitCursor>\n);\n\nSmallWaitCursor.displayName = 'SmallWaitCursor';\n\nexport default SmallWaitCursor;\n"],"mappings":";;;;;;AAEA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,gBAAA,GAAAD,OAAA;AAIkC,SAAAD,uBAAAG,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAPlC;AAAA,IASYG,mBAAmB,GAAAC,OAAA,CAAAD,mBAAA,0BAAnBA,mBAAmB;EAAnBA,mBAAmB,CAAnBA,mBAAmB;EAAnBA,mBAAmB,CAAnBA,mBAAmB;EAAA,OAAnBA,mBAAmB;AAAA;AAAA,IAKnBE,oBAAoB,GAAAD,OAAA,CAAAC,oBAAA,0BAApBA,oBAAoB;EAApBA,oBAAoB,CAApBA,oBAAoB;EAApBA,oBAAoB,CAApBA,oBAAoB;EAApBA,oBAAoB,CAApBA,oBAAoB;EAAA,OAApBA,oBAAoB;AAAA;AA4ChC,MAAMC,eAAyC,GAAGA,CAAC;EAC/CC,oBAAoB,GAAG,KAAK;EAC5BC,oBAAoB,GAAG,KAAK;EAC5BC,IAAI,GAAGN,mBAAmB,CAACO,MAAM;EACjCC,KAAK,GAAGN,oBAAoB,CAACK,MAAM;EACnCE;AACJ,CAAC,kBACGhB,MAAA,CAAAM,OAAA,CAAAW,aAAA,CAACd,gBAAA,CAAAe,qBAAqB;EAACC,qBAAqB,EAAE,CAACP,oBAAqB;EAACQ,KAAK,EAAEP;AAAK,gBAC7Eb,MAAA,CAAAM,OAAA,CAAAW,aAAA,CAACd,gBAAA,CAAAkB,+BAA+B;EAC5BC,qBAAqB,EAAEX,oBAAqB;EAC5CS,KAAK,EAAEP,IAAK;EACZU,MAAM,EAAER,KAAM;EACdS,MAAM,EAAER;AAAM,CACjB,CAAC,EACD,CAACL,oBAAoB,iBAAIX,MAAA,CAAAM,OAAA,CAAAW,aAAA,CAACd,gBAAA,CAAAsB,+BAA+B,MAAE,CACzC,CAC1B;AAEDf,eAAe,CAACgB,WAAW,GAAG,iBAAiB;AAAC,IAAAC,QAAA,GAAAnB,OAAA,CAAAF,OAAA,GAEjCI,eAAe","ignoreList":[]}

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

@@ -5,8 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.StyledSmallWaitCursorWaitCursor = exports.StyledSmallWaitCursorBackground = exports.StyledSmallWaitCursor = void 0;
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+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 StyledSmallWaitCursor = exports.StyledSmallWaitCursor = _styledComponents.default.div`
     position: relative;
     height: ${({
@@ -31,17 +30,17 @@ const StyledSmallWaitCursorBackground = exports.StyledSmallWaitCursorBackground
         0 1px 1px rgba(0, 0, 0, 0.2);
 `;
 const spin = (0, _styledComponents.keyframes)`
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(360deg);
-  }
+    from { transform: rotate(0deg); }
+    to { transform: rotate(360deg); }
 `;
 const StyledSmallWaitCursorWaitCursor = exports.StyledSmallWaitCursorWaitCursor = _styledComponents.default.div`
     position: absolute;
-    top: 5px;
-    left: 5px;
+    top: ${({
+  $shouldHideBackground
+}) => $shouldHideBackground ? 0 : 5}px;
+    left: ${({
+  $shouldHideBackground
+}) => $shouldHideBackground ? 0 : 5}px;
     z-index: 2;
     border-style: solid;
     border-width: 3px;
@@ -56,11 +55,13 @@ const StyledSmallWaitCursorWaitCursor = exports.StyledSmallWaitCursorWaitCursor
   return theme.colorMode === 'dark' && $shouldHideBackground ? theme.headline : theme.primary;
 }};
     height: ${({
+  $shouldHideBackground,
   $size
-}) => `${$size - 10}px`};
+}) => $shouldHideBackground ? '100%' : `${$size - 10}px`};
     width: ${({
+  $shouldHideBackground,
   $size
-}) => `${$size - 10}px`};
+}) => $shouldHideBackground ? '100%' : `${$size - 10}px`};
     border-radius: 50%;
     display: inline-block;
     border-top: 3px solid transparent;

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

@@ -1 +1 @@
-{"version":3,"file":"SmallWaitCursor.styles.js","names":["_styledComponents","_interopRequireWildcard","require","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","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,SAAAC,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAH,wBAAAG,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAS/C,MAAMW,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":[]}
+{"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","$shouldHideBackground","theme","$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 {\n    SmallWaitCursorProps,\n    SmallWaitCursorSize,\n    SmallWaitCursorSpeed,\n} 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    $color: SmallWaitCursorProps['color'];\n    $shouldHideBackground: SmallWaitCursorProps['shouldHideBackground'];\n    $size: SmallWaitCursorSize | number;\n    $speed: SmallWaitCursorSpeed;\n}>;\n\nconst spin = keyframes`\n    from { transform: rotate(0deg); }\n    to { transform: rotate(360deg); }\n`;\n\nexport const StyledSmallWaitCursorWaitCursor = styled.div<StyledSmallWaitCursorWaitCursorProps>`\n    position: absolute;\n    top: ${({ $shouldHideBackground }) => ($shouldHideBackground ? 0 : 5)}px;\n    left: ${({ $shouldHideBackground }) => ($shouldHideBackground ? 0 : 5)}px;\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: ${({ $shouldHideBackground, $size }) =>\n        $shouldHideBackground ? '100%' : `${$size - 10}px`};\n    width: ${({ $shouldHideBackground, $size }) =>\n        $shouldHideBackground ? '100%' : `${$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;AAa/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,CAAC;AAEM,MAAMC,+BAA+B,GAAAR,OAAA,CAAAQ,+BAAA,GAAGP,yBAAM,CAACC,GAAyC;AAC/F;AACA,WAAW,CAAC;EAAEO;AAAsB,CAAC,KAAMA,qBAAqB,GAAG,CAAC,GAAG,CAAE;AACzE,YAAY,CAAC;EAAEA;AAAsB,CAAC,KAAMA,qBAAqB,GAAG,CAAC,GAAG,CAAE;AAC1E;AACA;AACA;AACA,oBAAoB,CAAC;EACbC,KAAK;EACLD,qBAAqB;EACrBE;AACkC,CAAC,KAAK;EACxC,IAAIA,MAAM,EAAE;IACR,OAAOA,MAAM;EACjB;EAEA,OAAOD,KAAK,CAACE,SAAS,KAAK,MAAM,IAAIH,qBAAqB,GAAGC,KAAK,CAACG,QAAQ,GAAGH,KAAK,CAACI,OAAO;AAC/F,CAAC;AACL,cAAc,CAAC;EAAEL,qBAAqB;EAAEN;AAAM,CAAC,KACvCM,qBAAqB,GAAG,MAAM,GAAG,GAAGN,KAAK,GAAG,EAAE,IAAI;AAC1D,aAAa,CAAC;EAAEM,qBAAqB;EAAEN;AAAM,CAAC,KACtCM,qBAAqB,GAAG,MAAM,GAAG,GAAGN,KAAK,GAAG,EAAE,IAAI;AAC1D;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

@@ -10,113 +10,142 @@ 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 _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-// ToDo: Add reference with "save" function to return unsaved tags
-
-const TagInput = ({
-  placeholder,
-  tags,
+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,
-  onAdd
-}) => {
-  const [internalTags, setInternalTags] = (0, _react.useState)();
+  placeholder,
+  shouldAllowMultiple = true,
+  shouldPreventEnter,
+  tags
+}, ref) => {
   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(tags);
-    }
-  }, [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') {
+    if (event.key === 'Enter' && !shouldPreventEnter) {
       setCurrentValue(prevValue => {
         if (!prevValue) {
           return '';
         }
-        setInternalTags(prevTags => {
-          const newTag = {
-            id: (0, _uuid.v4)(),
-            text: prevValue
-          };
-          if (typeof onAdd === 'function') {
-            onAdd(newTag);
+        if (!shouldAllowMultiple && ((tags === null || tags === void 0 ? void 0 : tags.length) ?? 0) > 0) return '';
+        const newTag = {
+          id: (0, _uuid.v4)(),
+          text: prevValue
+        };
+        if (typeof onAdd === 'function') {
+          const onAddResult = onAdd(newTag);
+          if (typeof onAddResult === 'boolean' && !onAddResult) {
+            return prevValue;
+          }
+          if (onAddResult instanceof Promise) {
+            void onAddResult.then(shouldAddTag => {
+              if (!shouldAddTag) {
+                return prevValue;
+              }
+              return '';
+            });
           }
-          return prevTags ? [...prevTags, newTag] : [newTag];
-        });
+        }
         return '';
       });
     }
     if (event.key === 'Backspace' && currentValue === '') {
+      var _tags2;
       if (!selectedId) {
-        var _internalTags;
-        if (!internalTags) {
+        var _tags;
+        if (!tags) {
           return;
         }
-        const newSelectedId = (_internalTags = internalTags[internalTags.length - 1]) === null || _internalTags === void 0 ? void 0 : _internalTags.id;
+        const newSelectedId = (_tags = tags[tags.length - 1]) === null || _tags === void 0 ? void 0 : _tags.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;
-      });
+      if (!tags) {
+        return;
+      }
+      const removedId = (_tags2 = tags[tags.length - 1]) === null || _tags2 === void 0 ? void 0 : _tags2.id;
+      if (!removedId) {
+        return;
+      }
+      if (typeof onRemove === 'function') {
+        onRemove(removedId);
+      }
+      setSelectedId(undefined);
     }
-  }, [currentValue, internalTags, onAdd, onRemove, selectedId]);
-  const handleChange = event => {
+  }, [currentValue, onAdd, onRemove, selectedId, shouldAllowMultiple, shouldPreventEnter, tags]);
+  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;
-    });
+    if (typeof onRemove === 'function') {
+      onRemove(id);
+    }
   }, [onRemove]);
   const content = (0, _react.useMemo)(() => {
     const items = [];
-    if (!internalTags) {
+    if (!tags) {
       return items;
     }
-    internalTags.forEach(({
+    (shouldAllowMultiple ? tags : tags.slice(0, 1)).forEach(({
       text,
-      id
+      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), /*#__PURE__*/_react.default.createElement(_Icon.default, {
+      }, /*#__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: () => handleIconClick(id)
+        onClick: event => {
+          event.preventDefault();
+          event.stopPropagation();
+          handleIconClick(id);
+        }
       }))));
     });
     return items;
-  }, [handleIconClick, internalTags, selectedId, theme]);
-  return (0, _react.useMemo)(() => /*#__PURE__*/_react.default.createElement(_TagInput.StyledTagInput, null, content, /*#__PURE__*/_react.default.createElement(_TagInput.StyledTagInputTagInput, {
-    placeholder: tags && tags.length > 0 ? undefined : placeholder,
-    onKeyDown: handleKeyDown,
+  }, [tags, shouldAllowMultiple, selectedId, theme, handleIconClick]);
+  const shouldShowInput = (0, _react.useMemo)(() => shouldAllowMultiple || ((tags === null || tags === void 0 ? void 0 : tags.length) ?? 0) < 1, [tags === null || tags === void 0 ? void 0 : tags.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, handleKeyDown, placeholder, tags]);
-};
+  })), [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

@@ -1 +1 @@
-{"version":3,"file":"TagInput.js","names":["_react","_interopRequireWildcard","require","_styledComponents","_uuid","_Badge","_interopRequireDefault","_Icon","_TagInput","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","TagInput","placeholder","tags","onRemove","onAdd","internalTags","setInternalTags","useState","currentValue","setCurrentValue","selectedId","setSelectedId","theme","useTheme","useEffect","handleKeyDown","useCallback","event","key","prevValue","prevTags","newTag","id","uuidv4","text","_internalTags","newSelectedId","length","prevState","_prevState","removedId","updatedTags","filter","tag","undefined","handleChange","target","value","handleIconClick","content","useMemo","items","forEach","push","createElement","backgroundColor","StyledTagInputTagWrapper","StyledTagInputTagWrapperText","icons","onClick","StyledTagInput","StyledTagInputTagInput","onKeyDown","onChange","_default","exports"],"sources":["../../../../src/components/tag-input/TagInput.tsx"],"sourcesContent":["import React, {\n    FC,\n    useCallback,\n    useEffect,\n    useMemo,\n    useState,\n    type ChangeEvent,\n    type KeyboardEvent,\n    type ReactElement,\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    StyledTagInputTagInput,\n    StyledTagInputTagWrapper,\n    StyledTagInputTagWrapperText,\n} from './TagInput.styles';\n\nexport type TagInputProps = {\n    /**\n     * Function to be executed when a tag is added.\n     */\n    onAdd?: (tag: Tag) => void;\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     * The tags that should be displayed.\n     */\n    tags?: Tag[];\n};\n\n// ToDo: Add reference with \"save\" function to return unsaved tags\n\nconst TagInput: FC<TagInputProps> = ({ placeholder, tags, onRemove, onAdd }) => {\n    const [internalTags, setInternalTags] = useState<Tag[]>();\n    const [currentValue, setCurrentValue] = useState('');\n    const [selectedId, setSelectedId] = useState<Tag['id']>();\n\n    const theme = useTheme();\n\n    useEffect(() => {\n        if (tags) {\n            setInternalTags(tags);\n        }\n    }, [tags]);\n\n    const handleKeyDown = useCallback(\n        (event: KeyboardEvent) => {\n            if (event.key === 'Enter') {\n                setCurrentValue((prevValue) => {\n                    if (!prevValue) {\n                        return '';\n                    }\n\n                    setInternalTags((prevTags) => {\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        [currentValue, internalTags, onAdd, onRemove, selectedId],\n    );\n\n    const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n        setCurrentValue(event.target.value);\n\n        if (event.target.value !== '') {\n            setSelectedId(undefined);\n        }\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 }) => {\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                        <Icon icons={['ts-wrong']} onClick={() => handleIconClick(id)} />\n                    </StyledTagInputTagWrapper>\n                </Badge>,\n            );\n        });\n\n        return items;\n    }, [handleIconClick, internalTags, selectedId, theme]);\n\n    return useMemo(\n        () => (\n            <StyledTagInput>\n                {content}\n                <StyledTagInputTagInput\n                    placeholder={tags && tags.length > 0 ? undefined : placeholder}\n                    onKeyDown={handleKeyDown}\n                    onChange={handleChange}\n                    value={currentValue}\n                />\n            </StyledTagInput>\n        ),\n        [content, currentValue, handleKeyDown, placeholder, tags],\n    );\n};\n\nexport default TagInput;\n"],"mappings":"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","ignoreList":[]}
+{"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","currentValue","setCurrentValue","useState","selectedId","setSelectedId","areaProvider","useContext","AreaContext","inputRef","useRef","useCursorRepaint","theme","useTheme","handleResetValue","shouldChangeColor","useMemo","useImperativeHandle","blur","_inputRef$current","current","getUnsavedTagText","undefined","resetValue","handleKeyDown","useCallback","event","key","prevValue","length","newTag","id","uuidv4","text","onAddResult","Promise","then","shouldAddTag","_tags2","_tags","newSelectedId","removedId","handleChange","target","value","handleIconClick","content","items","slice","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    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) => Promise<boolean> | boolean | 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 [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        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                        if (!shouldAllowMultiple && (tags?.length ?? 0) > 0) return '';\n\n                        const newTag = { id: uuidv4(), text: prevValue };\n\n                        if (typeof onAdd === 'function') {\n                            const onAddResult = onAdd(newTag);\n\n                            if (typeof onAddResult === 'boolean' && !onAddResult) {\n                                return prevValue;\n                            }\n\n                            if (onAddResult instanceof Promise) {\n                                void onAddResult.then((shouldAddTag) => {\n                                    if (!shouldAddTag) {\n                                        return prevValue;\n                                    }\n\n                                    return '';\n                                });\n                            }\n                        }\n\n                        return '';\n                    });\n                }\n\n                if (event.key === 'Backspace' && currentValue === '') {\n                    if (!selectedId) {\n                        if (!tags) {\n                            return;\n                        }\n\n                        const newSelectedId = tags[tags.length - 1]?.id;\n\n                        setSelectedId(newSelectedId);\n\n                        return;\n                    }\n\n                    if (!tags) {\n                        return;\n                    }\n\n                    const removedId = tags[tags.length - 1]?.id;\n\n                    if (!removedId) {\n                        return;\n                    }\n\n                    if (typeof onRemove === 'function') {\n                        onRemove(removedId);\n                    }\n\n                    setSelectedId(undefined);\n                }\n            },\n            [\n                currentValue,\n                onAdd,\n                onRemove,\n                selectedId,\n                shouldAllowMultiple,\n                shouldPreventEnter,\n                tags,\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                if (typeof onRemove === 'function') {\n                    onRemove(id);\n                }\n            },\n            [onRemove],\n        );\n\n        const content = useMemo(() => {\n            const items: ReactElement[] = [];\n\n            if (!tags) {\n                return items;\n            }\n\n            (shouldAllowMultiple ? tags : tags.slice(0, 1)).forEach(\n                ({ text, id, rightElement }) => {\n                    items.push(\n                        <Badge\n                            key={`tag-input-${id}`}\n                            backgroundColor={\n                                id === selectedId\n                                    ? ((theme['206'] as string) ?? undefined)\n                                    : 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\n            return items;\n        }, [tags, shouldAllowMultiple, selectedId, theme, handleIconClick]);\n\n        const shouldShowInput = useMemo(\n            () => shouldAllowMultiple || (tags?.length ?? 0) < 1,\n            [tags?.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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.StyledTagInputTagWrapperText = exports.StyledTagInputTagWrapper = exports.StyledTagInputTagInput = exports.StyledTagInput = void 0;
+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`
@@ -14,8 +14,9 @@ const StyledTagInput = exports.StyledTagInput = _styledComponents.default.div`
     align-items: center;
     gap: 6px;
     background-color: ${({
-  theme
-}) => theme['100']};
+  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`
@@ -40,4 +41,11 @@ const StyledTagInputTagInput = exports.StyledTagInputTagInput = _styledComponent
   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

@@ -1 +1 @@
-{"version":3,"file":"TagInput.styles.js","names":["_styledComponents","_interopRequireDefault","require","e","__esModule","default","StyledTagInput","exports","styled","div","theme","StyledTagInputTagWrapper","StyledTagInputTagWrapperText","p","StyledTagInputTagInput","input","text"],"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<unknown>;\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 }: StyledTagInputProps) => 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"],"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;AAA2B,CAAC,KAAKA,KAAK,CAAC,KAAK,CAAC;AACxE;AACA,CAAC;AAEM,MAAMC,wBAAwB,GAAAJ,OAAA,CAAAI,wBAAA,GAAGH,yBAAM,CAACC,GAAG;AAClD;AACA;AACA;AACA,CAAC;AAEM,MAAMG,4BAA4B,GAAAL,OAAA,CAAAK,4BAAA,GAAGJ,yBAAM,CAACK,CAAC;AACpD;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAIM,MAAMC,sBAAsB,GAAAP,OAAA,CAAAO,sBAAA,GAAGN,yBAAM,CAACO,KAAkC;AAC/E;AACA;AACA;AACA;AACA,aAAa,CAAC;EAAEL;AAAmC,CAAC,KAAKA,KAAK,CAACM,IAAI;AACnE,CAAC","ignoreList":[]}
+{"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

@@ -9,8 +9,8 @@ var _react = _interopRequireWildcard(require("react"));
 var _AreaContextProvider = require("../area-provider/AreaContextProvider");
 var _Input = require("../input/Input.styles");
 var _TextArea = require("./TextArea.styles");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+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,
@@ -31,6 +31,7 @@ const TextArea = /*#__PURE__*/(0, _react.forwardRef)(({
   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;

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

@@ -1 +1 @@
-{"version":3,"file":"TextArea.js","names":["_chaynsApi","require","_react","_interopRequireWildcard","_AreaContextProvider","_Input","_TextArea","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","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","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';\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        // 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":[]}
+{"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":";;;;;;AAAA,IAAAA,UAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,uBAAA,CAAAF,OAAA;AAgBA,IAAAG,oBAAA,GAAAH,OAAA;AACA,IAAAI,MAAA,GAAAJ,OAAA;AACA,IAAAK,SAAA,GAAAL,OAAA;AAQA,IAAAM,OAAA,GAAAN,OAAA;AAAsD,SAAAE,wBAAAK,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAP,uBAAA,YAAAA,CAAAK,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;AAiDtD,MAAMkB,QAAQ,gBAAG,IAAAC,iBAAU,EACvB,CACI;EACIC,UAAU;EACVC,SAAS;EACTC,WAAW;EACXC,KAAK;EACLC,QAAQ;EACRC,OAAO;EACPC,SAAS;EACTC,YAAY;EACZC,MAAM;EACNC,SAAS,GAAG,OAAO;EACnBC,SAAS,GAAG;AAChB,CAAC,EACDC,GAAG,KACF;EAAA,IAAAC,mBAAA;EACD,MAAM,CAACC,aAAa,EAAEC,gBAAgB,CAAC,GAAG,IAAAC,eAAQ,EAAC,KAAK,CAAC;EAEzD,MAAMC,YAAY,GAAG,IAAAC,iBAAU,EAACC,gCAAW,CAAC;EAE5C,MAAMC,WAAW,GAAG,IAAAC,aAAM,EAAsB,IAAI,CAAC;EAErD,MAAM;IAAEC;EAAQ,CAAC,GAAG,IAAAC,oBAAS,EAAC,CAAC;EAE/B,IAAAC,wBAAgB,EAACJ,WAAW,CAAC;;EAE7B;EACA,MAAMK,gBAAgB,GAAG,CAAAjB,YAAY,aAAZA,YAAY,gBAAAK,mBAAA,GAAZL,YAAY,CAAEkB,KAAK,cAAAb,mBAAA,gBAAAA,mBAAA,GAAnBA,mBAAA,CAAqBc,KAAK,cAAAd,mBAAA,uBAA1BA,mBAAA,CAA4Be,eAAe,MAAKC,SAAS;EAElF,MAAMC,iBAAiB,GAAG,IAAAC,cAAO,EAC7B,MAAMd,YAAY,CAACa,iBAAiB,IAAI,KAAK,EAC7C,CAACb,YAAY,CAACa,iBAAiB,CACnC,CAAC;EAED,MAAME,oBAAoB,GAAG,IAAAC,kBAAW,EAAC,MAAM;IAC3C,IAAIb,WAAW,CAACc,OAAO,EAAE;MACrBd,WAAW,CAACc,OAAO,CAACP,KAAK,CAACQ,MAAM,GAAG,MAAM;MACzCf,WAAW,CAACc,OAAO,CAACP,KAAK,CAACQ,MAAM,GAAG,GAAGf,WAAW,CAACc,OAAO,CAACE,YAAY,IAAI;MAE1ErB,gBAAgB,CACZK,WAAW,CAACc,OAAO,CAACE,YAAY,GAAGC,QAAQ,CAAC3B,SAAS,CAAC4B,QAAQ,CAAC,CAAC,EAAE,EAAE,CACxE,CAAC;IACL;EACJ,CAAC,EAAE,CAAC5B,SAAS,CAAC,CAAC;EAEf,IAAA6B,0BAAmB,EAAC3B,GAAG,EAAE,MAAMQ,WAAW,CAACc,OAA8B,CAAC;;EAE1E;AACR;AACA;AACA;EACQ,IAAAM,gBAAS,EAAC,MAAM;IACZ,IAAI,OAAOpC,KAAK,KAAK,QAAQ,IAAIA,KAAK,CAACqC,MAAM,GAAG,CAAC,CAAC,EAAE;MAChDT,oBAAoB,CAAC,CAAC;IAC1B;EACJ,CAAC,EAAE,CAACA,oBAAoB,EAAE5B,KAAK,CAAC,CAAC;EAEjC,OAAO,IAAA2B,cAAO,EACV,mBACIzD,MAAA,CAAAgB,OAAA,CAAAoD,aAAA,CAAChE,SAAA,CAAAiE,cAAc;IAACC,WAAW,EAAE3C;EAAW,gBACpC3B,MAAA,CAAAgB,OAAA,CAAAoD,aAAA,CAAChE,SAAA,CAAAmE,4BAA4B;IACzBC,UAAU,EAAE5C,SAAU;IACtB6C,kBAAkB,EAAEjB;EAAkB,gBAEtCxD,MAAA,CAAAgB,OAAA,CAAAoD,aAAA,CAAChE,SAAA,CAAAsE,qBAAqB,qBAClB1E,MAAA,CAAAgB,OAAA,CAAAoD,aAAA,CAAChE,SAAA,CAAAuE,mBAAmB;IAChBC,QAAQ,EAAE5B,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAE6B,IAAoB;IACvCC,QAAQ,EAAEnD,UAAW;IACrB6C,UAAU,EAAE5C,SAAU;IACtBU,GAAG,EAAEQ,WAAY;IACjBhB,KAAK,EAAEA,KAAM;IACbK,MAAM,EAAEA,MAAO;IACfJ,QAAQ,EAAEA,QAAS;IACnBC,OAAO,EAAEA,OAAQ;IACjBC,SAAS,EAAEA,SAAU;IACrB8C,UAAU,EAAE3C,SAAU;IACtB4C,UAAU,EAAE3C,SAAU;IACtB4C,cAAc,EAAEzC,aAAc;IAC9B0C,IAAI,EAAE;EAAE,CACX,CAAC,EACD,CAACpD,KAAK,iBACH9B,MAAA,CAAAgB,OAAA,CAAAoD,aAAA,CAAChE,SAAA,CAAA+E,0BAA0B,qBACvBnF,MAAA,CAAAgB,OAAA,CAAAoD,aAAA,CAAChE,SAAA,CAAAgF,mBAAmB;IAACZ,UAAU,EAAE5C;EAAU,GACtCC,WACgB,CACG,CAEb,CAAC,EACvBK,YAAY,IAAIiB,gBAAgB,IAAIjB,YACX,CAAC,EAC9BA,YAAY,IAAI,CAACiB,gBAAgB,iBAC9BnD,MAAA,CAAAgB,OAAA,CAAAoD,aAAA,CAACjE,MAAA,CAAAkF,uBAAuB,QAAEnD,YAAsC,CAExD,CACnB,EACD,CACIc,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAE6B,IAAI,EACblD,UAAU,EACVC,SAAS,EACTY,aAAa,EACbJ,SAAS,EACTC,SAAS,EACTF,MAAM,EACNJ,QAAQ,EACRC,OAAO,EACPC,SAAS,EACTJ,WAAW,EACXK,YAAY,EACZsB,iBAAiB,EACjBL,gBAAgB,EAChBrB,KAAK,CAEb,CAAC;AACL,CACJ,CAAC;AAEDL,QAAQ,CAAC6D,WAAW,GAAG,UAAU;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAxE,OAAA,GAEnBS,QAAQ","ignoreList":[]}

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

@@ -5,8 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.StyledTextAreaLabelWrapper = exports.StyledTextAreaLabel = exports.StyledTextAreaInput = exports.StyledTextAreaContentWrapper = exports.StyledTextAreaContent = exports.StyledTextArea = void 0;
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+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;
@@ -31,6 +30,7 @@ const StyledTextAreaContentWrapper = exports.StyledTextAreaContentWrapper = _sty
     display: flex;
 `;
 const StyledTextAreaContent = exports.StyledTextAreaContent = _styledComponents.default.div`
+    position: relative;
     display: flex;
     width: 100%;
 `;