@chayns-components/core 5.0.0-beta.589 → 5.0.0-beta.590

package/lib/cjs/components/checkbox/Checkbox.js

@@ -27,10 +27,8 @@ const Checkbox = ({
     }
   }, [onChange]);
   const uuid = (0, _uuid.useUuid)();
-  const lineHeight = (0, _react.useMemo)(() => shouldShowCentered ? undefined : (0, _calculate.getHeightOfSingleTextLine)(), [shouldShowCentered]);
-  return /*#__PURE__*/_react.default.createElement(_Checkbox.StyledCheckbox, {
-    $hasLabel: !!children
-  }, /*#__PURE__*/_react.default.createElement(_Checkbox.StyledCheckboxInput, {
+  const lineHeight = (0, _react.useMemo)(() => !children || shouldShowCentered ? undefined : (0, _calculate.getHeightOfSingleTextLine)(), [children, shouldShowCentered]);
+  return /*#__PURE__*/_react.default.createElement(_Checkbox.StyledCheckbox, null, /*#__PURE__*/_react.default.createElement(_Checkbox.StyledCheckboxInput, {
     checked: isChecked,
     disabled: isDisabled,
     id: uuid,
@@ -39,7 +37,6 @@ const Checkbox = ({
   }), /*#__PURE__*/_react.default.createElement(_Checkbox.StyledCheckboxLabel, {
     className: labelClassName,
     htmlFor: uuid,
-    $hasLabel: !!children,
     $isChecked: isChecked ?? isActive,
     $isDisabled: isDisabled,
     $shouldShowAsSwitch: shouldShowAsSwitch,

package/lib/cjs/components/checkbox/Checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.js","names":["_react","_interopRequireWildcard","require","_uuid","_calculate","_Checkbox","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","Checkbox","children","isChecked","isDisabled","labelClassName","onChange","shouldShowAsSwitch","shouldShowCentered","isActive","setIsActive","useState","handleChange","useCallback","event","target","checked","uuid","useUuid","lineHeight","useMemo","undefined","getHeightOfSingleTextLine","createElement","StyledCheckbox","$hasLabel","StyledCheckboxInput","disabled","id","type","StyledCheckboxLabel","className","htmlFor","$isChecked","$isDisabled","$shouldShowAsSwitch","$lineHeight","displayName","_default","exports"],"sources":["../../../../src/components/checkbox/Checkbox.tsx"],"sourcesContent":["import React, {\n    ChangeEvent,\n    ChangeEventHandler,\n    FC,\n    ReactElement,\n    useCallback,\n    useMemo,\n    useState,\n} from 'react';\nimport { useUuid } from '../../hooks/uuid';\nimport { getHeightOfSingleTextLine } from '../../utils/calculate';\nimport { StyledCheckbox, StyledCheckboxInput, StyledCheckboxLabel } from './Checkbox.styles';\n\nexport type CheckboxProps = {\n    /**\n     * Text for checkbox or switch\n     */\n    children?: ReactElement | string;\n    /**\n     * Indicates whether the checkbox or switch is selected\n     */\n    isChecked?: boolean;\n    /**\n     * Disables the checkbox or switch so it cannot be toggled\n     */\n    isDisabled?: boolean;\n    /**\n     * Classname for the label\n     */\n    labelClassName?: string;\n    /**\n     * Function to be executed if the checked value changes\n     */\n    onChange?: ChangeEventHandler<HTMLInputElement>;\n    /**\n     * Changes the design to use switch instead of checkbox\n     */\n    shouldShowAsSwitch?: boolean;\n    /**\n     * Whether the Checkbox should be displayed centered to the label or at the top\n     */\n    shouldShowCentered?: boolean;\n};\n\nconst Checkbox: FC<CheckboxProps> = ({\n    children,\n    isChecked,\n    isDisabled,\n    labelClassName,\n    onChange,\n    shouldShowAsSwitch,\n    shouldShowCentered = false,\n}) => {\n    const [isActive, setIsActive] = useState(isChecked ?? false);\n\n    const handleChange = useCallback(\n        (event: ChangeEvent<HTMLInputElement>) => {\n            setIsActive(event.target.checked);\n\n            if (typeof onChange === 'function') {\n                onChange(event);\n            }\n        },\n        [onChange],\n    );\n\n    const uuid = useUuid();\n\n    const lineHeight = useMemo(\n        () => (shouldShowCentered ? undefined : getHeightOfSingleTextLine()),\n        [shouldShowCentered],\n    );\n\n    return (\n        <StyledCheckbox $hasLabel={!!children}>\n            <StyledCheckboxInput\n                checked={isChecked}\n                disabled={isDisabled}\n                id={uuid}\n                onChange={handleChange}\n                type=\"checkbox\"\n            />\n            <StyledCheckboxLabel\n                className={labelClassName}\n                htmlFor={uuid}\n                $hasLabel={!!children}\n                $isChecked={isChecked ?? isActive}\n                $isDisabled={isDisabled}\n                $shouldShowAsSwitch={shouldShowAsSwitch}\n                $lineHeight={lineHeight}\n            >\n                {children}\n            </StyledCheckboxLabel>\n        </StyledCheckbox>\n    );\n};\n\nCheckbox.displayName = 'Checkbox';\n\nexport default Checkbox;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Checkbox.js","names":["_react","_interopRequireWildcard","require","_uuid","_calculate","_Checkbox","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","Checkbox","children","isChecked","isDisabled","labelClassName","onChange","shouldShowAsSwitch","shouldShowCentered","isActive","setIsActive","useState","handleChange","useCallback","event","target","checked","uuid","useUuid","lineHeight","useMemo","undefined","getHeightOfSingleTextLine","createElement","StyledCheckbox","StyledCheckboxInput","disabled","id","type","StyledCheckboxLabel","className","htmlFor","$isChecked","$isDisabled","$shouldShowAsSwitch","$lineHeight","displayName","_default","exports"],"sources":["../../../../src/components/checkbox/Checkbox.tsx"],"sourcesContent":["import React, {\n    ChangeEvent,\n    ChangeEventHandler,\n    FC,\n    ReactElement,\n    useCallback,\n    useMemo,\n    useState,\n} from 'react';\nimport { useUuid } from '../../hooks/uuid';\nimport { getHeightOfSingleTextLine } from '../../utils/calculate';\nimport { StyledCheckbox, StyledCheckboxInput, StyledCheckboxLabel } from './Checkbox.styles';\n\nexport type CheckboxProps = {\n    /**\n     * Text for checkbox or switch\n     */\n    children?: ReactElement | string;\n    /**\n     * Indicates whether the checkbox or switch is selected\n     */\n    isChecked?: boolean;\n    /**\n     * Disables the checkbox or switch so it cannot be toggled\n     */\n    isDisabled?: boolean;\n    /**\n     * Classname for the label\n     */\n    labelClassName?: string;\n    /**\n     * Function to be executed if the checked value changes\n     */\n    onChange?: ChangeEventHandler<HTMLInputElement>;\n    /**\n     * Changes the design to use switch instead of checkbox\n     */\n    shouldShowAsSwitch?: boolean;\n    /**\n     * Whether the Checkbox should be displayed centered to the label or at the top\n     */\n    shouldShowCentered?: boolean;\n};\n\nconst Checkbox: FC<CheckboxProps> = ({\n    children,\n    isChecked,\n    isDisabled,\n    labelClassName,\n    onChange,\n    shouldShowAsSwitch,\n    shouldShowCentered = false,\n}) => {\n    const [isActive, setIsActive] = useState(isChecked ?? false);\n\n    const handleChange = useCallback(\n        (event: ChangeEvent<HTMLInputElement>) => {\n            setIsActive(event.target.checked);\n\n            if (typeof onChange === 'function') {\n                onChange(event);\n            }\n        },\n        [onChange],\n    );\n\n    const uuid = useUuid();\n\n    const lineHeight = useMemo(\n        () => (!children || shouldShowCentered ? undefined : getHeightOfSingleTextLine()),\n        [children, shouldShowCentered],\n    );\n\n    return (\n        <StyledCheckbox>\n            <StyledCheckboxInput\n                checked={isChecked}\n                disabled={isDisabled}\n                id={uuid}\n                onChange={handleChange}\n                type=\"checkbox\"\n            />\n            <StyledCheckboxLabel\n                className={labelClassName}\n                htmlFor={uuid}\n                $isChecked={isChecked ?? isActive}\n                $isDisabled={isDisabled}\n                $shouldShowAsSwitch={shouldShowAsSwitch}\n                $lineHeight={lineHeight}\n            >\n                {children}\n            </StyledCheckboxLabel>\n        </StyledCheckbox>\n    );\n};\n\nCheckbox.displayName = 'Checkbox';\n\nexport default Checkbox;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/checkbox/Checkbox.styles.js

@@ -11,12 +11,6 @@ const StyledCheckbox = exports.StyledCheckbox = _styledComponents.default.div`
     align-items: center;
     display: flex;
     position: relative;
-
-    ${({
-  $hasLabel
-}) => !$hasLabel && (0, _styledComponents.css)`
-            height: 15px;
-        `}
 `;
 const StyledCheckboxInput = exports.StyledCheckboxInput = _styledComponents.default.input`
     display: none;
@@ -42,15 +36,14 @@ const StyledCheckboxLabel = exports.StyledCheckboxLabel = _styledComponents.defa
   $isChecked,
   $shouldShowAsSwitch,
   $lineHeight,
-  theme,
-  $hasLabel
+  theme
 }) => $shouldShowAsSwitch ? (0, _styledComponents.css)`
                       background-color: white;
                       border-radius: 50%;
                       box-shadow: 0 1px 4px rgb(0 0 0 / 35%);
                       height: 16px;
                       left: 7px;
-                      top: ${$lineHeight ? `${Number(theme.fontSize) - ($hasLabel ? 2 : 6)}px` : '50%'};
+                      top: ${$lineHeight ? `${Number(theme.fontSize) - 2}px` : '50%'};
                       transform: translateX(${$isChecked ? '18px' : 0}) translateY(-50%);
                       transition: transform 0.2s ease;
                       width: 16px;
@@ -60,7 +53,7 @@ const StyledCheckboxLabel = exports.StyledCheckboxLabel = _styledComponents.defa
                       height: 10px;
                       left: 2px;
                       opacity: ${$isChecked ? 1 : 0};
-                      top: ${$lineHeight ? `${Number(theme.fontSize) - ($hasLabel ? 4 : 8)}px` : 'calc(50% - 2px)'};
+                      top: ${$lineHeight ? `${Number(theme.fontSize) - 4}px` : 'calc(50% - 2px)'};
                       transform: rotateZ(37deg) translateY(-50%);
                       transition: opacity 0.2s ease;
                       width: 5.5px;
@@ -106,10 +99,9 @@ const StyledCheckboxLabel = exports.StyledCheckboxLabel = _styledComponents.defa
 }) => $shouldShowAsSwitch ? '28px' : '15px'};
         ${({
   $lineHeight,
-  theme,
-  $hasLabel
+  theme
 }) => $lineHeight ? (0, _styledComponents.css)`
-                      top: ${Number(theme.fontSize) - ($hasLabel ? 2 : 6)}px;
+                      top: ${Number(theme.fontSize) - 2}px;
                       transform: translateY(-50%);
                   ` : (0, _styledComponents.css)`
                       top: 50%;

package/lib/cjs/components/checkbox/Checkbox.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.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","StyledCheckbox","exports","styled","div","$hasLabel","css","StyledCheckboxInput","input","StyledCheckboxLabel","label","theme","text","$isDisabled","$shouldShowAsSwitch","$isChecked","$lineHeight","Number","fontSize","green","red"],"sources":["../../../../src/components/checkbox/Checkbox.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport type { CheckboxProps } from './Checkbox';\n\ntype StyledCheckboxProps = WithTheme<{\n    $hasLabel: boolean;\n}>;\n\nexport const StyledCheckbox = styled.div<StyledCheckboxProps>`\n    align-items: center;\n    display: flex;\n    position: relative;\n\n    ${({ $hasLabel }) =>\n        !$hasLabel &&\n        css`\n            height: 15px;\n        `}\n`;\n\nexport const StyledCheckboxInput = styled.input`\n    display: none;\n`;\n\ntype StyledCheckboxLabelProps = WithTheme<{\n    $shouldShowAsSwitch?: CheckboxProps['shouldShowAsSwitch'];\n    $isDisabled?: CheckboxProps['isDisabled'];\n    $isChecked?: CheckboxProps['isChecked'];\n    $lineHeight?: number;\n    $hasLabel: boolean;\n}>;\n\nexport const StyledCheckboxLabel = styled.label<StyledCheckboxLabelProps>`\n    color: ${({ theme }: StyledCheckboxLabelProps) => theme.text};\n    cursor: ${({ $isDisabled }) => ($isDisabled ? 'default' : 'pointer')};\n    opacity: ${({ $isDisabled }) => ($isDisabled ? 0.5 : 1)};\n    padding-left: ${({ $shouldShowAsSwitch }) => ($shouldShowAsSwitch ? '48px' : '20px')};\n    transition: opacity 0.2s ease;\n    user-select: none;\n\n    &:after {\n        ${({\n            $isChecked,\n            $shouldShowAsSwitch,\n            $lineHeight,\n            theme,\n            $hasLabel,\n        }: StyledCheckboxLabelProps) =>\n            $shouldShowAsSwitch\n                ? css`\n                      background-color: white;\n                      border-radius: 50%;\n                      box-shadow: 0 1px 4px rgb(0 0 0 / 35%);\n                      height: 16px;\n                      left: 7px;\n                      top: ${$lineHeight\n                          ? `${Number(theme.fontSize) - ($hasLabel ? 2 : 6)}px`\n                          : '50%'};\n                      transform: translateX(${$isChecked ? '18px' : 0}) translateY(-50%);\n                      transition: transform 0.2s ease;\n                      width: 16px;\n                  `\n                : css`\n                      border-right: 2px solid #fff;\n                      border-bottom: 2px solid #fff;\n                      height: 10px;\n                      left: 2px;\n                      opacity: ${$isChecked ? 1 : 0};\n                      top: ${$lineHeight\n                          ? `${Number(theme.fontSize) - ($hasLabel ? 4 : 8)}px`\n                          : 'calc(50% - 2px)'};\n                      transform: rotateZ(37deg) translateY(-50%);\n                      transition: opacity 0.2s ease;\n                      width: 5.5px;\n                  `}\n\n        content: ' ';\n        position: absolute;\n    }\n\n    &:before {\n        background-color: ${({\n            $isChecked,\n            $shouldShowAsSwitch,\n            theme,\n        }: StyledCheckboxLabelProps) => {\n            if ($shouldShowAsSwitch) {\n                return $isChecked ? theme.green : theme.red;\n            }\n\n            return $isChecked ? theme['408'] : theme['403'];\n        }};\n        \n        ${({ $shouldShowAsSwitch, theme }) =>\n            !$shouldShowAsSwitch &&\n            css`\n                border: 1px solid rgba(${theme['409-rgb']}, 0.5);\n            `}\n        \n        border-radius: ${({ $shouldShowAsSwitch }) => ($shouldShowAsSwitch ? '100px' : 0)};\n        content: ' ';\n        height: ${({ $shouldShowAsSwitch }) => ($shouldShowAsSwitch ? '13px' : '15px')};\n        left: ${({ $shouldShowAsSwitch }) => ($shouldShowAsSwitch ? '10px' : 0)};\n        position: absolute;\n        transition: background-color 0.2s ease;\n        width: ${({ $shouldShowAsSwitch }) => ($shouldShowAsSwitch ? '28px' : '15px')};\n        ${({ $lineHeight, theme, $hasLabel }: StyledCheckboxLabelProps) =>\n            $lineHeight\n                ? css`\n                      top: ${Number(theme.fontSize) - ($hasLabel ? 2 : 6)}px;\n                      transform: translateY(-50%);\n                  `\n                : css`\n                      top: 50%;\n                      transform: translateY(-50%);\n                  `}\n        }\n    }\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,uBAAA,CAAAC,OAAA;AAAgD,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;AAQzC,MAAMW,cAAc,GAAAC,OAAA,CAAAD,cAAA,GAAGE,yBAAM,CAACC,GAAyB;AAC9D;AACA;AACA;AACA;AACA,MAAM,CAAC;EAAEC;AAAU,CAAC,KACZ,CAACA,SAAS,IACV,IAAAC,qBAAG,CAAC;AACZ;AACA,SAAU;AACV,CAAC;AAEM,MAAMC,mBAAmB,GAAAL,OAAA,CAAAK,mBAAA,GAAGJ,yBAAM,CAACK,KAAM;AAChD;AACA,CAAC;AAUM,MAAMC,mBAAmB,GAAAP,OAAA,CAAAO,mBAAA,GAAGN,yBAAM,CAACO,KAAgC;AAC1E,aAAa,CAAC;EAAEC;AAAgC,CAAC,KAAKA,KAAK,CAACC,IAAK;AACjE,cAAc,CAAC;EAAEC;AAAY,CAAC,KAAMA,WAAW,GAAG,SAAS,GAAG,SAAW;AACzE,eAAe,CAAC;EAAEA;AAAY,CAAC,KAAMA,WAAW,GAAG,GAAG,GAAG,CAAG;AAC5D,oBAAoB,CAAC;EAAEC;AAAoB,CAAC,KAAMA,mBAAmB,GAAG,MAAM,GAAG,MAAQ;AACzF;AACA;AACA;AACA;AACA,UAAU,CAAC;EACCC,UAAU;EACVD,mBAAmB;EACnBE,WAAW;EACXL,KAAK;EACLN;AACsB,CAAC,KACvBS,mBAAmB,GACb,IAAAR,qBAAG,CAAC;AACtB;AACA;AACA;AACA;AACA;AACA,6BAA6BU,WAAW,GACX,GAAEC,MAAM,CAACN,KAAK,CAACO,QAAQ,CAAC,IAAIb,SAAS,GAAG,CAAC,GAAG,CAAC,CAAE,IAAG,GACnD,KAAM;AAClC,8CAA8CU,UAAU,GAAG,MAAM,GAAG,CAAE;AACtE;AACA;AACA,mBAAmB,GACD,IAAAT,qBAAG,CAAC;AACtB;AACA;AACA;AACA;AACA,iCAAiCS,UAAU,GAAG,CAAC,GAAG,CAAE;AACpD,6BAA6BC,WAAW,GACX,GAAEC,MAAM,CAACN,KAAK,CAACO,QAAQ,CAAC,IAAIb,SAAS,GAAG,CAAC,GAAG,CAAC,CAAE,IAAG,GACnD,iBAAkB;AAC9C;AACA;AACA;AACA,mBAAoB;AACpB;AACA;AACA;AACA;AACA;AACA;AACA,4BAA4B,CAAC;EACjBU,UAAU;EACVD,mBAAmB;EACnBH;AACsB,CAAC,KAAK;EAC5B,IAAIG,mBAAmB,EAAE;IACrB,OAAOC,UAAU,GAAGJ,KAAK,CAACQ,KAAK,GAAGR,KAAK,CAACS,GAAG;EAC/C;EAEA,OAAOL,UAAU,GAAGJ,KAAK,CAAC,KAAK,CAAC,GAAGA,KAAK,CAAC,KAAK,CAAC;AACnD,CAAE;AACV;AACA,UAAU,CAAC;EAAEG,mBAAmB;EAAEH;AAAM,CAAC,KAC7B,CAACG,mBAAmB,IACpB,IAAAR,qBAAG,CAAC;AAChB,yCAAyCK,KAAK,CAAC,SAAS,CAAE;AAC1D,aAAc;AACd;AACA,yBAAyB,CAAC;EAAEG;AAAoB,CAAC,KAAMA,mBAAmB,GAAG,OAAO,GAAG,CAAG;AAC1F;AACA,kBAAkB,CAAC;EAAEA;AAAoB,CAAC,KAAMA,mBAAmB,GAAG,MAAM,GAAG,MAAQ;AACvF,gBAAgB,CAAC;EAAEA;AAAoB,CAAC,KAAMA,mBAAmB,GAAG,MAAM,GAAG,CAAG;AAChF;AACA;AACA,iBAAiB,CAAC;EAAEA;AAAoB,CAAC,KAAMA,mBAAmB,GAAG,MAAM,GAAG,MAAQ;AACtF,UAAU,CAAC;EAAEE,WAAW;EAAEL,KAAK;EAAEN;AAAoC,CAAC,KAC1DW,WAAW,GACL,IAAAV,qBAAG,CAAC;AACtB,6BAA6BW,MAAM,CAACN,KAAK,CAACO,QAAQ,CAAC,IAAIb,SAAS,GAAG,CAAC,GAAG,CAAC,CAAE;AAC1E;AACA,mBAAmB,GACD,IAAAC,qBAAG,CAAC;AACtB;AACA;AACA,mBAAoB;AACpB;AACA;AACA,CAAC","ignoreList":[]}
+{"version":3,"file":"Checkbox.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","StyledCheckbox","exports","styled","div","StyledCheckboxInput","input","StyledCheckboxLabel","label","theme","text","$isDisabled","$shouldShowAsSwitch","$isChecked","$lineHeight","css","Number","fontSize","green","red"],"sources":["../../../../src/components/checkbox/Checkbox.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport type { CheckboxProps } from './Checkbox';\n\nexport const StyledCheckbox = styled.div`\n    align-items: center;\n    display: flex;\n    position: relative;\n`;\n\nexport const StyledCheckboxInput = styled.input`\n    display: none;\n`;\n\ntype StyledCheckboxLabelProps = WithTheme<{\n    $shouldShowAsSwitch?: CheckboxProps['shouldShowAsSwitch'];\n    $isDisabled?: CheckboxProps['isDisabled'];\n    $isChecked?: CheckboxProps['isChecked'];\n    $lineHeight?: number;\n}>;\n\nexport const StyledCheckboxLabel = styled.label<StyledCheckboxLabelProps>`\n    color: ${({ theme }: StyledCheckboxLabelProps) => theme.text};\n    cursor: ${({ $isDisabled }) => ($isDisabled ? 'default' : 'pointer')};\n    opacity: ${({ $isDisabled }) => ($isDisabled ? 0.5 : 1)};\n    padding-left: ${({ $shouldShowAsSwitch }) => ($shouldShowAsSwitch ? '48px' : '20px')};\n    transition: opacity 0.2s ease;\n    user-select: none;\n\n    &:after {\n        ${({ $isChecked, $shouldShowAsSwitch, $lineHeight, theme }: StyledCheckboxLabelProps) =>\n            $shouldShowAsSwitch\n                ? css`\n                      background-color: white;\n                      border-radius: 50%;\n                      box-shadow: 0 1px 4px rgb(0 0 0 / 35%);\n                      height: 16px;\n                      left: 7px;\n                      top: ${$lineHeight ? `${Number(theme.fontSize) - 2}px` : '50%'};\n                      transform: translateX(${$isChecked ? '18px' : 0}) translateY(-50%);\n                      transition: transform 0.2s ease;\n                      width: 16px;\n                  `\n                : css`\n                      border-right: 2px solid #fff;\n                      border-bottom: 2px solid #fff;\n                      height: 10px;\n                      left: 2px;\n                      opacity: ${$isChecked ? 1 : 0};\n                      top: ${$lineHeight ? `${Number(theme.fontSize) - 4}px` : 'calc(50% - 2px)'};\n                      transform: rotateZ(37deg) translateY(-50%);\n                      transition: opacity 0.2s ease;\n                      width: 5.5px;\n                  `}\n\n        content: ' ';\n        position: absolute;\n    }\n\n    &:before {\n        background-color: ${({\n            $isChecked,\n            $shouldShowAsSwitch,\n            theme,\n        }: StyledCheckboxLabelProps) => {\n            if ($shouldShowAsSwitch) {\n                return $isChecked ? theme.green : theme.red;\n            }\n\n            return $isChecked ? theme['408'] : theme['403'];\n        }};\n        \n        ${({ $shouldShowAsSwitch, theme }) =>\n            !$shouldShowAsSwitch &&\n            css`\n                border: 1px solid rgba(${theme['409-rgb']}, 0.5);\n            `}\n        \n        border-radius: ${({ $shouldShowAsSwitch }) => ($shouldShowAsSwitch ? '100px' : 0)};\n        content: ' ';\n        height: ${({ $shouldShowAsSwitch }) => ($shouldShowAsSwitch ? '13px' : '15px')};\n        left: ${({ $shouldShowAsSwitch }) => ($shouldShowAsSwitch ? '10px' : 0)};\n        position: absolute;\n        transition: background-color 0.2s ease;\n        width: ${({ $shouldShowAsSwitch }) => ($shouldShowAsSwitch ? '28px' : '15px')};\n        ${({ $lineHeight, theme }: StyledCheckboxLabelProps) =>\n            $lineHeight\n                ? css`\n                      top: ${Number(theme.fontSize) - 2}px;\n                      transform: translateY(-50%);\n                  `\n                : css`\n                      top: 50%;\n                      transform: translateY(-50%);\n                  `}\n        }\n    }\n`;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/sharing-bar/SharingBar.js

@@ -4,7 +4,11 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+var _chaynsApi = require("chayns-api");
 var _react = _interopRequireWildcard(require("react"));
+var _sharingBar = require("../../constants/sharingBar");
+var _environment = require("../../utils/environment");
+var _sharingBar2 = require("../../utils/sharingBar");
 var _ContextMenu = _interopRequireDefault(require("../context-menu/ContextMenu"));
 var _Icon = _interopRequireDefault(require("../icon/Icon"));
 var _SharingBar = require("./SharingBar.styles");
@@ -17,50 +21,50 @@ const SharingBar = ({
   popupAlignment
 }) => {
   const contextMenuRef = (0, _react.useRef)(null);
-  const handleImageDownload = async () => {
-    var _contextMenuRef$curre;
-    const image = await fetch(`https://cube.tobit.cloud/qr-code-generator/v1.0/png?value=${link}&color=005EB8&text=Teilen`);
-    const imageBlog = await image.blob();
-    const imageURL = URL.createObjectURL(imageBlog);
-    const url = document.createElement('a');
-
-    // Removes illegal characters from the name and shortens it to a maximum of 50 characters
-    const fileName = `CallingCode_Share`.replace(/[^\w-]+/g, '_').trim().slice(0, 75);
-    url.href = imageURL;
-    url.download = fileName;
-    document.body.appendChild(url);
-    url.click();
-    document.body.removeChild(url);
-    (_contextMenuRef$curre = contextMenuRef.current) === null || _contextMenuRef$curre === void 0 || _contextMenuRef$curre.hide();
+  const handleImageDownload = () => {
+    (0, _sharingBar2.shareWithUrl)(
+    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+    // @ts-ignore
+    _sharingBar.SHAREPROVIDER[5].url.replace('{url}', encodeURIComponent(link)).replace('{linkText}', 'Teilen').replace('{color}', (0, _chaynsApi.getSite)().color.replace('#', '')));
   };
   const handleShare = key => {
-    var _contextMenuRef$curre2;
-    (_contextMenuRef$curre2 = contextMenuRef.current) === null || _contextMenuRef$curre2 === void 0 || _contextMenuRef$curre2.hide();
-    const encodedUrl = encodeURIComponent(link);
-    let preparedLink;
+    var _contextMenuRef$curre;
+    (_contextMenuRef$curre = contextMenuRef.current) === null || _contextMenuRef$curre === void 0 || _contextMenuRef$curre.hide();
+    const isMobile = (0, _environment.getIsMobile)();
     switch (key) {
       case 'whatsapp':
-        preparedLink = `https://wa.me/?text=${encodedUrl}`;
+        (0, _sharingBar2.shareWithUrl)(
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+        // @ts-ignore
+        _sharingBar.SHAREPROVIDER[0].url.replace('{url}', encodeURIComponent(`${link}`.trim())));
         break;
       case 'facebook':
-        preparedLink = `https://www.facebook.com/sharer.php?u=${encodedUrl}`;
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+        // @ts-ignore
+        (0, _sharingBar2.shareWithUrl)(_sharingBar.SHAREPROVIDER[3].url.replace('{url}', encodeURIComponent(link)));
         break;
       case 'twitter':
-        preparedLink = `https://twitter.com/intent/tweet?url=${encodedUrl}`;
+        (0, _sharingBar2.shareWithUrl)(
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+        // @ts-ignore
+        _sharingBar.SHAREPROVIDER[4].url.replace('{url}', encodeURIComponent(link)).replace('{linkText}', ''));
         break;
       case 'mail':
-        preparedLink = `mailto:?subject=&body= ${encodedUrl}`;
+        if (isMobile) {
+          (0, _sharingBar2.shareWithApp)(`${link}`.trim());
+        } else {
+          (0, _sharingBar2.shareWithUrl)(
+          // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+          // @ts-ignore
+          _sharingBar.SHAREPROVIDER[2].url.replace('{url}', encodeURIComponent(`${link}`.trim())));
+        }
         break;
       case 'copy':
-        void navigator.clipboard.writeText(link);
+        (0, _sharingBar2.copyToClipboard)(link);
         break;
       default:
         break;
     }
-    if (!preparedLink) {
-      return;
-    }
-    window.open(preparedLink);
   };
   const contextMenuItems = [{
     icons: ['fa fa-copy'],
@@ -78,10 +82,10 @@ const SharingBar = ({
     onClick: () => handleShare('facebook'),
     text: 'Facebook'
   }, {
-    icons: ['fa-solid fa-brands fa-twitter'],
+    icons: ['fa-solid fa-brands fa-x-twitter'],
     key: 'twitter',
     onClick: () => handleShare('twitter'),
-    text: 'Twitter'
+    text: 'X'
   }, {
     icons: ['fa fa-envelope'],
     key: 'mail',
@@ -94,11 +98,12 @@ const SharingBar = ({
     text: 'Calling Code herunterladen'
   }];
   const handleSharingBarClick = () => {
-    var _contextMenuRef$curre3;
-    (_contextMenuRef$curre3 = contextMenuRef.current) === null || _contextMenuRef$curre3 === void 0 || _contextMenuRef$curre3.show();
+    var _contextMenuRef$curre2;
+    (_contextMenuRef$curre2 = contextMenuRef.current) === null || _contextMenuRef$curre2 === void 0 || _contextMenuRef$curre2.show();
   };
   return /*#__PURE__*/_react.default.createElement(_SharingBar.StyledSharingBar, {
-    onClick: handleSharingBarClick
+    onClick: handleSharingBarClick,
+    onTouchStart: handleSharingBarClick
   }, /*#__PURE__*/_react.default.createElement(_SharingBar.StyledSharingBarIconWrapper, null, /*#__PURE__*/_react.default.createElement(_Icon.default, {
     icons: ['fa-solid fa-share-nodes']
   })), /*#__PURE__*/_react.default.createElement(_ContextMenu.default, {

package/lib/cjs/components/sharing-bar/SharingBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"SharingBar.js","names":["_react","_interopRequireWildcard","require","_ContextMenu","_interopRequireDefault","_Icon","_SharingBar","obj","__esModule","default","_getRequireWildcardCache","e","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","SharingBar","label","link","popupAlignment","contextMenuRef","useRef","handleImageDownload","_contextMenuRef$curre","image","fetch","imageBlog","blob","imageURL","URL","createObjectURL","url","document","createElement","fileName","replace","trim","slice","href","download","body","appendChild","click","removeChild","current","hide","handleShare","key","_contextMenuRef$curre2","encodedUrl","encodeURIComponent","preparedLink","navigator","clipboard","writeText","window","open","contextMenuItems","icons","onClick","text","handleSharingBarClick","_contextMenuRef$curre3","show","StyledSharingBar","StyledSharingBarIconWrapper","items","ref","alignment","StyledSharingBarText","displayName","_default","exports"],"sources":["../../../../src/components/sharing-bar/SharingBar.tsx"],"sourcesContent":["import React, { FC, useRef } from 'react';\nimport type { ContextMenuAlignment } from '../../types/contextMenu';\nimport ContextMenu from '../context-menu/ContextMenu';\nimport Icon from '../icon/Icon';\nimport {\n    StyledSharingBar,\n    StyledSharingBarIconWrapper,\n    StyledSharingBarText,\n} from './SharingBar.styles';\n\nexport type SharingBarProps = {\n    /**\n     * The label that should be displayed.\n     */\n    label: string;\n    /**\n     * The link that should be shared.\n     */\n    link: string;\n    /**\n     * The alignment of the sharing options.\n     */\n    popupAlignment: ContextMenuAlignment;\n};\n\nconst SharingBar: FC<SharingBarProps> = ({ label, link, popupAlignment }) => {\n    const contextMenuRef = useRef<{ hide: VoidFunction; show: VoidFunction }>(null);\n\n    const handleImageDownload = async () => {\n        const image = await fetch(\n            `https://cube.tobit.cloud/qr-code-generator/v1.0/png?value=${link}&color=005EB8&text=Teilen`,\n        );\n        const imageBlog = await image.blob();\n        const imageURL = URL.createObjectURL(imageBlog);\n\n        const url = document.createElement('a');\n\n        // Removes illegal characters from the name and shortens it to a maximum of 50 characters\n        const fileName = `CallingCode_Share`\n            .replace(/[^\\w-]+/g, '_')\n            .trim()\n            .slice(0, 75);\n\n        url.href = imageURL;\n        url.download = fileName;\n\n        document.body.appendChild(url);\n\n        url.click();\n\n        document.body.removeChild(url);\n\n        contextMenuRef.current?.hide();\n    };\n\n    const handleShare = (key: string) => {\n        contextMenuRef.current?.hide();\n\n        const encodedUrl = encodeURIComponent(link);\n        let preparedLink;\n\n        switch (key) {\n            case 'whatsapp':\n                preparedLink = `https://wa.me/?text=${encodedUrl}`;\n                break;\n            case 'facebook':\n                preparedLink = `https://www.facebook.com/sharer.php?u=${encodedUrl}`;\n                break;\n            case 'twitter':\n                preparedLink = `https://twitter.com/intent/tweet?url=${encodedUrl}`;\n                break;\n            case 'mail':\n                preparedLink = `mailto:?subject=&body= ${encodedUrl}`;\n                break;\n            case 'copy':\n                void navigator.clipboard.writeText(link);\n                break;\n            default:\n                break;\n        }\n\n        if (!preparedLink) {\n            return;\n        }\n\n        window.open(preparedLink);\n    };\n\n    const contextMenuItems = [\n        {\n            icons: ['fa fa-copy'],\n            key: 'copy',\n            onClick: () => handleShare('copy'),\n            text: 'Zwischenablage',\n        },\n        {\n            icons: ['fa-solid fa-brands fa-whatsapp'],\n            key: 'whatsapp',\n            onClick: () => handleShare('whatsapp'),\n            text: 'Whatsapp',\n        },\n        {\n            icons: ['fa-solid fa-brands fa-facebook-f'],\n            key: 'facebook',\n            onClick: () => handleShare('facebook'),\n            text: 'Facebook',\n        },\n        {\n            icons: ['fa-solid fa-brands fa-twitter'],\n            key: 'twitter',\n            onClick: () => handleShare('twitter'),\n            text: 'Twitter',\n        },\n        {\n            icons: ['fa fa-envelope'],\n            key: 'mail',\n            onClick: () => handleShare('mail'),\n            text: 'Mail',\n        },\n        {\n            icons: ['fa fa-qrcode'],\n            key: 'callingCode',\n            onClick: handleImageDownload,\n            text: 'Calling Code herunterladen',\n        },\n    ];\n\n    const handleSharingBarClick = () => {\n        contextMenuRef.current?.show();\n    };\n\n    return (\n        <StyledSharingBar onClick={handleSharingBarClick}>\n            <StyledSharingBarIconWrapper>\n                <Icon icons={['fa-solid fa-share-nodes']} />\n            </StyledSharingBarIconWrapper>\n            <ContextMenu items={contextMenuItems} ref={contextMenuRef} alignment={popupAlignment}>\n                {null}\n            </ContextMenu>\n            <StyledSharingBarText>{label}</StyledSharingBarText>\n        </StyledSharingBar>\n    );\n};\n\nSharingBar.displayName = 'SharingBar';\n\nexport default SharingBar;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"SharingBar.js","names":["_chaynsApi","require","_react","_interopRequireWildcard","_sharingBar","_environment","_sharingBar2","_ContextMenu","_interopRequireDefault","_Icon","_SharingBar","obj","__esModule","default","_getRequireWildcardCache","e","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","SharingBar","label","link","popupAlignment","contextMenuRef","useRef","handleImageDownload","shareWithUrl","SHAREPROVIDER","url","replace","encodeURIComponent","getSite","color","handleShare","key","_contextMenuRef$curre","current","hide","isMobile","getIsMobile","trim","shareWithApp","copyToClipboard","contextMenuItems","icons","onClick","text","handleSharingBarClick","_contextMenuRef$curre2","show","createElement","StyledSharingBar","onTouchStart","StyledSharingBarIconWrapper","items","ref","alignment","StyledSharingBarText","displayName","_default","exports"],"sources":["../../../../src/components/sharing-bar/SharingBar.tsx"],"sourcesContent":["import { getSite } from 'chayns-api';\nimport React, { FC, useRef } from 'react';\nimport { SHAREPROVIDER } from '../../constants/sharingBar';\nimport type { ContextMenuAlignment } from '../../types/contextMenu';\nimport { getIsMobile } from '../../utils/environment';\nimport { copyToClipboard, shareWithApp, shareWithUrl } from '../../utils/sharingBar';\nimport ContextMenu from '../context-menu/ContextMenu';\nimport Icon from '../icon/Icon';\nimport {\n    StyledSharingBar,\n    StyledSharingBarIconWrapper,\n    StyledSharingBarText,\n} from './SharingBar.styles';\n\nexport type SharingBarProps = {\n    /**\n     * The label that should be displayed.\n     */\n    label: string;\n    /**\n     * The link that should be shared.\n     */\n    link: string;\n    /**\n     * The alignment of the sharing options.\n     */\n    popupAlignment: ContextMenuAlignment;\n};\n\nconst SharingBar: FC<SharingBarProps> = ({ label, link, popupAlignment }) => {\n    const contextMenuRef = useRef<{ hide: VoidFunction; show: VoidFunction }>(null);\n\n    const handleImageDownload = () => {\n        shareWithUrl(\n            // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n            // @ts-ignore\n            SHAREPROVIDER[5].url\n                .replace('{url}', encodeURIComponent(link))\n                .replace('{linkText}', 'Teilen')\n                .replace('{color}', getSite().color.replace('#', '')),\n        );\n    };\n\n    const handleShare = (key: string) => {\n        contextMenuRef.current?.hide();\n\n        const isMobile = getIsMobile();\n\n        switch (key) {\n            case 'whatsapp':\n                shareWithUrl(\n                    // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n                    // @ts-ignore\n                    SHAREPROVIDER[0].url.replace('{url}', encodeURIComponent(`${link}`.trim())),\n                );\n                break;\n            case 'facebook':\n                // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n                // @ts-ignore\n                shareWithUrl(SHAREPROVIDER[3].url.replace('{url}', encodeURIComponent(link)));\n                break;\n            case 'twitter':\n                shareWithUrl(\n                    // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n                    // @ts-ignore\n                    SHAREPROVIDER[4].url\n                        .replace('{url}', encodeURIComponent(link))\n                        .replace('{linkText}', ''),\n                );\n                break;\n            case 'mail':\n                if (isMobile) {\n                    shareWithApp(`${link}`.trim());\n                } else {\n                    shareWithUrl(\n                        // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n                        // @ts-ignore\n                        SHAREPROVIDER[2].url.replace('{url}', encodeURIComponent(`${link}`.trim())),\n                    );\n                }\n                break;\n            case 'copy':\n                copyToClipboard(link);\n                break;\n            default:\n                break;\n        }\n    };\n\n    const contextMenuItems = [\n        {\n            icons: ['fa fa-copy'],\n            key: 'copy',\n            onClick: () => handleShare('copy'),\n            text: 'Zwischenablage',\n        },\n        {\n            icons: ['fa-solid fa-brands fa-whatsapp'],\n            key: 'whatsapp',\n            onClick: () => handleShare('whatsapp'),\n            text: 'Whatsapp',\n        },\n        {\n            icons: ['fa-solid fa-brands fa-facebook-f'],\n            key: 'facebook',\n            onClick: () => handleShare('facebook'),\n            text: 'Facebook',\n        },\n        {\n            icons: ['fa-solid fa-brands fa-x-twitter'],\n            key: 'twitter',\n            onClick: () => handleShare('twitter'),\n            text: 'X',\n        },\n        {\n            icons: ['fa fa-envelope'],\n            key: 'mail',\n            onClick: () => handleShare('mail'),\n            text: 'Mail',\n        },\n        {\n            icons: ['fa fa-qrcode'],\n            key: 'callingCode',\n            onClick: handleImageDownload,\n            text: 'Calling Code herunterladen',\n        },\n    ];\n\n    const handleSharingBarClick = () => {\n        contextMenuRef.current?.show();\n    };\n\n    return (\n        <StyledSharingBar onClick={handleSharingBarClick} onTouchStart={handleSharingBarClick}>\n            <StyledSharingBarIconWrapper>\n                <Icon icons={['fa-solid fa-share-nodes']} />\n            </StyledSharingBarIconWrapper>\n            <ContextMenu items={contextMenuItems} ref={contextMenuRef} alignment={popupAlignment}>\n                {null}\n            </ContextMenu>\n            <StyledSharingBarText>{label}</StyledSharingBarText>\n        </StyledSharingBar>\n    );\n};\n\nSharingBar.displayName = 'SharingBar';\n\nexport default SharingBar;\n"],"mappings":"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","ignoreList":[]}

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

@@ -38,7 +38,7 @@ const TextArea = ({
    * To maintain the functionality while clearing the input, the length need to be greater than -1.
    */
   (0, _react.useEffect)(() => {
-    if (value && value.length > -1) {
+    if (typeof value === 'string' && value.length > -1) {
       adjustTextareaHeight();
     }
   }, [adjustTextareaHeight, value]);
@@ -53,7 +53,7 @@ const TextArea = ({
     $minHeight: minHeight,
     $isOverflowing: isOverflowing,
     rows: 1
-  }), !value && /*#__PURE__*/_react.default.createElement(_TextArea.StyledTextAreaLabelWrapper, null, ' ', /*#__PURE__*/_react.default.createElement(_TextArea.StyledTextAreaLabel, null, placeholder))), [browser === null || browser === void 0 ? void 0 : browser.name, isOverflowing, maxHeight, minHeight, onBlur, onChange, placeholder, shouldChangeColor, value]);
+  }), !value && /*#__PURE__*/_react.default.createElement(_TextArea.StyledTextAreaLabelWrapper, null, /*#__PURE__*/_react.default.createElement(_TextArea.StyledTextAreaLabel, null, placeholder))), [browser === null || browser === void 0 ? void 0 : browser.name, isOverflowing, maxHeight, minHeight, onBlur, onChange, placeholder, shouldChangeColor, value]);
 };
 TextArea.displayName = 'TextArea';
 var _default = exports.default = TextArea;

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

@@ -1 +1 @@
-{"version":3,"file":"TextArea.js","names":["_chaynsApi","require","_react","_interopRequireWildcard","_AreaContextProvider","_TextArea","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","TextArea","placeholder","value","onChange","onBlur","maxHeight","minHeight","isOverflowing","setIsOverflowing","useState","areaProvider","useContext","AreaContext","textareaRef","useRef","browser","getDevice","shouldChangeColor","useMemo","adjustTextareaHeight","useCallback","current","style","height","scrollHeight","parseInt","toString","useEffect","length","createElement","StyledTextArea","StyledTextAreaInput","$shouldChangeColor","$browser","name","ref","$maxHeight","$minHeight","$isOverflowing","rows","StyledTextAreaLabelWrapper","StyledTextAreaLabel","displayName","_default","exports"],"sources":["../../../../src/components/text-area/TextArea.tsx"],"sourcesContent":["import { getDevice } from 'chayns-api';\nimport React, {\n    ChangeEventHandler,\n    CSSProperties,\n    FC,\n    FocusEventHandler,\n    ReactElement,\n    useCallback,\n    useContext,\n    useEffect,\n    useMemo,\n    useRef,\n    useState,\n} from 'react';\nimport { AreaContext } from '../area-provider/AreaContextProvider';\nimport {\n    StyledTextArea,\n    StyledTextAreaInput,\n    StyledTextAreaLabel,\n    StyledTextAreaLabelWrapper,\n} from './TextArea.styles';\n\nexport type TextAreaProps = {\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     * Placeholder for the text area field.\n     */\n    placeholder?: string | ReactElement;\n    /**\n     * Value if the text area should be controlled.\n     */\n    value?: string;\n};\n\nconst TextArea: FC<TextAreaProps> = ({\n    placeholder,\n    value,\n    onChange,\n    onBlur,\n    maxHeight = '120px',\n    minHeight = '41px',\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    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(textareaRef.current.scrollHeight > parseInt(maxHeight.toString(), 10));\n        }\n    }, [maxHeight]);\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 (value && value.length > -1) {\n            adjustTextareaHeight();\n        }\n    }, [adjustTextareaHeight, value]);\n\n    return useMemo(\n        () => (\n            <StyledTextArea>\n                <StyledTextAreaInput\n                    $shouldChangeColor={shouldChangeColor}\n                    $browser={browser?.name}\n                    ref={textareaRef}\n                    value={value}\n                    onBlur={onBlur}\n                    onChange={onChange}\n                    $maxHeight={maxHeight}\n                    $minHeight={minHeight}\n                    $isOverflowing={isOverflowing}\n                    rows={1}\n                />\n                {!value && (\n                    <StyledTextAreaLabelWrapper>\n                        {' '}\n                        <StyledTextAreaLabel>{placeholder}</StyledTextAreaLabel>\n                    </StyledTextAreaLabelWrapper>\n                )}\n            </StyledTextArea>\n        ),\n        [\n            browser?.name,\n            isOverflowing,\n            maxHeight,\n            minHeight,\n            onBlur,\n            onChange,\n            placeholder,\n            shouldChangeColor,\n            value,\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","_TextArea","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","TextArea","placeholder","value","onChange","onBlur","maxHeight","minHeight","isOverflowing","setIsOverflowing","useState","areaProvider","useContext","AreaContext","textareaRef","useRef","browser","getDevice","shouldChangeColor","useMemo","adjustTextareaHeight","useCallback","current","style","height","scrollHeight","parseInt","toString","useEffect","length","createElement","StyledTextArea","StyledTextAreaInput","$shouldChangeColor","$browser","name","ref","$maxHeight","$minHeight","$isOverflowing","rows","StyledTextAreaLabelWrapper","StyledTextAreaLabel","displayName","_default","exports"],"sources":["../../../../src/components/text-area/TextArea.tsx"],"sourcesContent":["import { getDevice } from 'chayns-api';\nimport React, {\n    ChangeEventHandler,\n    CSSProperties,\n    FC,\n    FocusEventHandler,\n    ReactElement,\n    useCallback,\n    useContext,\n    useEffect,\n    useMemo,\n    useRef,\n    useState,\n} from 'react';\nimport { AreaContext } from '../area-provider/AreaContextProvider';\nimport {\n    StyledTextArea,\n    StyledTextAreaInput,\n    StyledTextAreaLabel,\n    StyledTextAreaLabelWrapper,\n} from './TextArea.styles';\n\nexport type TextAreaProps = {\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     * Placeholder for the text area field.\n     */\n    placeholder?: string | ReactElement;\n    /**\n     * Value if the text area should be controlled.\n     */\n    value?: string;\n};\n\nconst TextArea: FC<TextAreaProps> = ({\n    placeholder,\n    value,\n    onChange,\n    onBlur,\n    maxHeight = '120px',\n    minHeight = '41px',\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    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(textareaRef.current.scrollHeight > parseInt(maxHeight.toString(), 10));\n        }\n    }, [maxHeight]);\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>\n                <StyledTextAreaInput\n                    $shouldChangeColor={shouldChangeColor}\n                    $browser={browser?.name}\n                    ref={textareaRef}\n                    value={value}\n                    onBlur={onBlur}\n                    onChange={onChange}\n                    $maxHeight={maxHeight}\n                    $minHeight={minHeight}\n                    $isOverflowing={isOverflowing}\n                    rows={1}\n                />\n                {!value && (\n                    <StyledTextAreaLabelWrapper>\n                        <StyledTextAreaLabel>{placeholder}</StyledTextAreaLabel>\n                    </StyledTextAreaLabelWrapper>\n                )}\n            </StyledTextArea>\n        ),\n        [\n            browser?.name,\n            isOverflowing,\n            maxHeight,\n            minHeight,\n            onBlur,\n            onChange,\n            placeholder,\n            shouldChangeColor,\n            value,\n        ],\n    );\n};\n\nTextArea.displayName = 'TextArea';\n\nexport default TextArea;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/truncation/Truncation.js

@@ -32,6 +32,7 @@ const Truncation = ({
   (0, _react.useEffect)(() => {
     setInitialRender(false);
   }, []);
+  const parentRef = (0, _react.useRef)(null);
   const pseudoChildrenRef = (0, _react.useRef)(null);
   const childrenRef = (0, _react.useRef)(null);
   const originalChildrenRef = (0, _react.useRef)(null);
@@ -89,10 +90,12 @@ const Truncation = ({
   }, [collapsedHeight, hasSizeChanged, initialRender, newCollapsedHeight, originalHeight]);
   (0, _react.useEffect)(() => {
     if (childrenRef.current && pseudoChildrenRef.current && originalChildrenRef.current) {
+      var _parentRef$current;
       while (childrenRef.current.firstChild) {
         childrenRef.current.removeChild(childrenRef.current.firstChild);
       }
       childrenRef.current.appendChild(shouldShowCollapsedElement && !internalIsOpen ? pseudoChildrenRef.current : originalChildrenRef.current);
+      (_parentRef$current = parentRef.current) === null || _parentRef$current === void 0 || _parentRef$current.appendChild(shouldShowCollapsedElement && !internalIsOpen ? originalChildrenRef.current : pseudoChildrenRef.current);
       childrenRef.current.children[0].style.visibility = 'visible';
     }
   }, [children, internalIsOpen, shouldShowCollapsedElement]);
@@ -141,7 +144,8 @@ const Truncation = ({
     return () => {};
   }, [originalSmallHeight]);
   return (0, _react.useMemo)(() => /*#__PURE__*/_react.default.createElement(_Truncation.StyledTruncation, {
-    className: "beta-chayns-truncation"
+    className: "beta-chayns-truncation",
+    ref: parentRef
   }, /*#__PURE__*/_react.default.createElement(_Truncation.StyledTruncationPseudoContent, {
     ref: pseudoChildrenRef
   }, children), /*#__PURE__*/_react.default.createElement(_Truncation.StyledTruncationPseudoContent, {

package/lib/cjs/components/truncation/Truncation.js.map

@@ -1 +1 @@
-{"version":3,"file":"Truncation.js","names":["_react","_interopRequireWildcard","require","_truncation","_debounce","_truncation2","_Truncation","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","Truncation","collapsedHeight","clampPosition","ClampPosition","Right","isOpen","moreLabel","lessLabel","onChange","children","internalIsOpen","setInternalIsOpen","useState","showClamp","setShowClamp","newCollapsedHeight","setNewCollapsedHeight","originalHeight","setOriginalHeight","shouldShowCollapsedElement","setShouldShowCollapsedElement","hasSizeChanged","setHasSizeChanged","initialRender","setInitialRender","originalSmallHeight","setOriginalSmallHeight","originalBigHeight","setOriginalBigHeight","useEffect","pseudoChildrenRef","useRef","childrenRef","originalChildrenRef","hasCollapsed","isAnimating","hasSizeRecentlyChanged","canResetSizeChanged","handleClampClick","useCallback","event","current","handleAnimationEnd","window","setTimeout","offsetHeight","truncateElement","firstChild","removeChild","appendChild","style","visibility","useLayoutEffect","resizeObserver","ResizeObserver","entries","observedHeight","contentRect","height","debounce","observe","disconnect","useMemo","createElement","StyledTruncation","className","StyledTruncationPseudoContent","ref","StyledMotionTruncationContent","animate","initial","transition","type","duration","onAnimationComplete","onAnimationStart","StyledTruncationClampWrapper","$position","StyledTruncationClamp","onClick","_default","exports"],"sources":["../../../../src/components/truncation/Truncation.tsx"],"sourcesContent":["import React, {\n    FC,\n    MouseEvent,\n    MouseEventHandler,\n    ReactElement,\n    useCallback,\n    useEffect,\n    useLayoutEffect,\n    useMemo,\n    useRef,\n    useState,\n} from 'react';\nimport { ClampPosition } from '../../types/truncation';\nimport { debounce } from '../../utils/debounce';\nimport { truncateElement } from '../../utils/truncation';\nimport {\n    StyledMotionTruncationContent,\n    StyledTruncation,\n    StyledTruncationClamp,\n    StyledTruncationClampWrapper,\n    StyledTruncationPseudoContent,\n} from './Truncation.styles';\n\nexport type TruncationProps = {\n    /**\n     * The elements that should be expanding or collapsing.\n     */\n    children: ReactElement;\n    /**\n     * The position of the clamp.\n     */\n    clampPosition?: ClampPosition;\n    /**\n     * The height of the children Element in it`s collapsed state.\n     */\n    collapsedHeight?: number;\n    /**\n     * If set to true, the content is exposed.\n     */\n    isOpen?: boolean;\n    /**\n     * A text that should be displayed if the content is expanded.\n     */\n    lessLabel?: string;\n    /**\n     * A text that should be displayed if the content is collapsed.\n     */\n    moreLabel?: string;\n    /**\n     * Function to be executed when the component is expanding or collapsing.\n     */\n    onChange?: (event: MouseEvent<HTMLAnchorElement>, isOpen: boolean) => void;\n};\n\nconst Truncation: FC<TruncationProps> = ({\n    collapsedHeight = 150,\n    clampPosition = ClampPosition.Right,\n    isOpen,\n    moreLabel = 'Mehr',\n    lessLabel = 'Weniger',\n    onChange,\n    children,\n}) => {\n    const [internalIsOpen, setInternalIsOpen] = useState(false);\n    const [showClamp, setShowClamp] = useState(true);\n    const [newCollapsedHeight, setNewCollapsedHeight] = useState(collapsedHeight);\n    const [originalHeight, setOriginalHeight] = useState(0);\n    const [shouldShowCollapsedElement, setShouldShowCollapsedElement] = useState(true);\n    const [hasSizeChanged, setHasSizeChanged] = useState(false);\n    const [initialRender, setInitialRender] = useState(true);\n\n    const [originalSmallHeight, setOriginalSmallHeight] = useState(0);\n    const [originalBigHeight, setOriginalBigHeight] = useState(0);\n\n    useEffect(() => {\n        setInitialRender(false);\n    }, []);\n\n    const pseudoChildrenRef = useRef<HTMLDivElement>(null);\n    const childrenRef = useRef<HTMLDivElement>(null);\n    const originalChildrenRef = useRef<HTMLDivElement>(null);\n    const hasCollapsed = useRef(false);\n    const isAnimating = useRef(false);\n    const hasSizeRecentlyChanged = useRef(false);\n    const canResetSizeChanged = useRef(true);\n\n    useEffect(() => {\n        if (typeof isOpen === 'boolean') {\n            setInternalIsOpen(isOpen);\n            setShowClamp(!isOpen);\n        }\n    }, [isOpen]);\n\n    // Changes the state of the truncation\n    const handleClampClick = useCallback<MouseEventHandler<HTMLAnchorElement>>(\n        (event) => {\n            setInternalIsOpen((current) => {\n                if (typeof onChange === 'function') {\n                    onChange(event, !current);\n                }\n\n                return !current;\n            });\n        },\n        [onChange],\n    );\n\n    const handleAnimationEnd = useCallback(() => {\n        hasCollapsed.current = true;\n        isAnimating.current = false;\n\n        if (canResetSizeChanged.current) {\n            setHasSizeChanged(false);\n            canResetSizeChanged.current = false;\n        }\n\n        window.setTimeout(() => {\n            hasSizeRecentlyChanged.current = false;\n        }, 10);\n\n        setShouldShowCollapsedElement(!internalIsOpen);\n\n        window.setTimeout(() => {\n            hasCollapsed.current = false;\n        }, 30);\n    }, [internalIsOpen]);\n\n    useEffect(() => {\n        if (!pseudoChildrenRef.current) {\n            return;\n        }\n\n        setOriginalHeight(pseudoChildrenRef.current.offsetHeight);\n        setOriginalBigHeight(pseudoChildrenRef.current.offsetHeight);\n\n        truncateElement(pseudoChildrenRef.current, collapsedHeight);\n\n        setNewCollapsedHeight(pseudoChildrenRef.current.offsetHeight);\n        setOriginalSmallHeight(pseudoChildrenRef.current.offsetHeight);\n    }, [collapsedHeight, pseudoChildrenRef]);\n\n    // Checks if the clamp should be shown\n    useEffect(() => {\n        if (pseudoChildrenRef.current && !hasSizeChanged && !initialRender) {\n            setShowClamp(originalHeight > newCollapsedHeight);\n        }\n    }, [collapsedHeight, hasSizeChanged, initialRender, newCollapsedHeight, originalHeight]);\n\n    useEffect(() => {\n        if (childrenRef.current && pseudoChildrenRef.current && originalChildrenRef.current) {\n            while (childrenRef.current.firstChild) {\n                childrenRef.current.removeChild(childrenRef.current.firstChild);\n            }\n\n            childrenRef.current.appendChild(\n                shouldShowCollapsedElement && !internalIsOpen\n                    ? pseudoChildrenRef.current\n                    : originalChildrenRef.current,\n            );\n\n            (childrenRef.current.children[0] as HTMLDivElement).style.visibility = 'visible';\n        }\n    }, [children, internalIsOpen, shouldShowCollapsedElement]);\n\n    useLayoutEffect(() => {\n        if (originalChildrenRef.current) {\n            const resizeObserver = new ResizeObserver((entries) => {\n                if (entries && entries[0]) {\n                    const observedHeight = entries[0].contentRect.height;\n\n                    setOriginalHeight(\n                        observedHeight < originalBigHeight ? originalBigHeight : observedHeight,\n                    );\n\n                    if (\n                        !hasCollapsed.current &&\n                        !isAnimating.current &&\n                        !hasSizeRecentlyChanged.current\n                    ) {\n                        void debounce(() => {\n                            canResetSizeChanged.current = true;\n                        }, 250)();\n\n                        setHasSizeChanged(true);\n                        hasSizeRecentlyChanged.current = true;\n                    }\n                }\n            });\n\n            resizeObserver.observe(originalChildrenRef.current);\n\n            return () => {\n                resizeObserver.disconnect();\n            };\n        }\n\n        return () => {};\n    }, [originalBigHeight]);\n\n    useLayoutEffect(() => {\n        if (pseudoChildrenRef.current) {\n            const resizeObserver = new ResizeObserver((entries) => {\n                if (entries && entries[0]) {\n                    const observedHeight = entries[0].contentRect.height;\n\n                    setNewCollapsedHeight(\n                        observedHeight < originalSmallHeight ? originalSmallHeight : observedHeight,\n                    );\n\n                    if (\n                        !hasCollapsed.current &&\n                        !isAnimating.current &&\n                        !hasSizeRecentlyChanged.current\n                    ) {\n                        void debounce(() => {\n                            canResetSizeChanged.current = true;\n                        }, 250)();\n\n                        setHasSizeChanged(true);\n                        hasSizeRecentlyChanged.current = true;\n                    }\n                }\n            });\n\n            resizeObserver.observe(pseudoChildrenRef.current);\n\n            return () => {\n                resizeObserver.disconnect();\n            };\n        }\n\n        return () => {};\n    }, [originalSmallHeight]);\n\n    return useMemo(\n        () => (\n            <StyledTruncation className=\"beta-chayns-truncation\">\n                <StyledTruncationPseudoContent ref={pseudoChildrenRef}>\n                    {children}\n                </StyledTruncationPseudoContent>\n                <StyledTruncationPseudoContent ref={originalChildrenRef}>\n                    {children}\n                </StyledTruncationPseudoContent>\n                <StyledMotionTruncationContent\n                    animate={{ height: internalIsOpen ? originalHeight : newCollapsedHeight }}\n                    initial={false}\n                    transition={{ type: 'tween', duration: hasSizeChanged ? 0 : 0.2 }}\n                    onAnimationComplete={handleAnimationEnd}\n                    onAnimationStart={() => {\n                        isAnimating.current = true;\n                    }}\n                    ref={childrenRef}\n                />\n                {showClamp && (\n                    <StyledTruncationClampWrapper $position={clampPosition}>\n                        <StyledTruncationClamp onClick={handleClampClick}>\n                            {internalIsOpen ? lessLabel : moreLabel}\n                        </StyledTruncationClamp>\n                    </StyledTruncationClampWrapper>\n                )}\n            </StyledTruncation>\n        ),\n        [\n            children,\n            clampPosition,\n            handleAnimationEnd,\n            handleClampClick,\n            hasSizeChanged,\n            internalIsOpen,\n            lessLabel,\n            moreLabel,\n            newCollapsedHeight,\n            originalHeight,\n            showClamp,\n        ],\n    );\n};\n\nexport default Truncation;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Truncation.js","names":["_react","_interopRequireWildcard","require","_truncation","_debounce","_truncation2","_Truncation","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","Truncation","collapsedHeight","clampPosition","ClampPosition","Right","isOpen","moreLabel","lessLabel","onChange","children","internalIsOpen","setInternalIsOpen","useState","showClamp","setShowClamp","newCollapsedHeight","setNewCollapsedHeight","originalHeight","setOriginalHeight","shouldShowCollapsedElement","setShouldShowCollapsedElement","hasSizeChanged","setHasSizeChanged","initialRender","setInitialRender","originalSmallHeight","setOriginalSmallHeight","originalBigHeight","setOriginalBigHeight","useEffect","parentRef","useRef","pseudoChildrenRef","childrenRef","originalChildrenRef","hasCollapsed","isAnimating","hasSizeRecentlyChanged","canResetSizeChanged","handleClampClick","useCallback","event","current","handleAnimationEnd","window","setTimeout","offsetHeight","truncateElement","_parentRef$current","firstChild","removeChild","appendChild","style","visibility","useLayoutEffect","resizeObserver","ResizeObserver","entries","observedHeight","contentRect","height","debounce","observe","disconnect","useMemo","createElement","StyledTruncation","className","ref","StyledTruncationPseudoContent","StyledMotionTruncationContent","animate","initial","transition","type","duration","onAnimationComplete","onAnimationStart","StyledTruncationClampWrapper","$position","StyledTruncationClamp","onClick","_default","exports"],"sources":["../../../../src/components/truncation/Truncation.tsx"],"sourcesContent":["import React, {\n    FC,\n    MouseEvent,\n    MouseEventHandler,\n    ReactElement,\n    useCallback,\n    useEffect,\n    useLayoutEffect,\n    useMemo,\n    useRef,\n    useState,\n} from 'react';\nimport { ClampPosition } from '../../types/truncation';\nimport { debounce } from '../../utils/debounce';\nimport { truncateElement } from '../../utils/truncation';\nimport {\n    StyledMotionTruncationContent,\n    StyledTruncation,\n    StyledTruncationClamp,\n    StyledTruncationClampWrapper,\n    StyledTruncationPseudoContent,\n} from './Truncation.styles';\n\nexport type TruncationProps = {\n    /**\n     * The elements that should be expanding or collapsing.\n     */\n    children: ReactElement;\n    /**\n     * The position of the clamp.\n     */\n    clampPosition?: ClampPosition;\n    /**\n     * The height of the children Element in it`s collapsed state.\n     */\n    collapsedHeight?: number;\n    /**\n     * If set to true, the content is exposed.\n     */\n    isOpen?: boolean;\n    /**\n     * A text that should be displayed if the content is expanded.\n     */\n    lessLabel?: string;\n    /**\n     * A text that should be displayed if the content is collapsed.\n     */\n    moreLabel?: string;\n    /**\n     * Function to be executed when the component is expanding or collapsing.\n     */\n    onChange?: (event: MouseEvent<HTMLAnchorElement>, isOpen: boolean) => void;\n};\n\nconst Truncation: FC<TruncationProps> = ({\n    collapsedHeight = 150,\n    clampPosition = ClampPosition.Right,\n    isOpen,\n    moreLabel = 'Mehr',\n    lessLabel = 'Weniger',\n    onChange,\n    children,\n}) => {\n    const [internalIsOpen, setInternalIsOpen] = useState(false);\n    const [showClamp, setShowClamp] = useState(true);\n    const [newCollapsedHeight, setNewCollapsedHeight] = useState(collapsedHeight);\n    const [originalHeight, setOriginalHeight] = useState(0);\n    const [shouldShowCollapsedElement, setShouldShowCollapsedElement] = useState(true);\n    const [hasSizeChanged, setHasSizeChanged] = useState(false);\n    const [initialRender, setInitialRender] = useState(true);\n\n    const [originalSmallHeight, setOriginalSmallHeight] = useState(0);\n    const [originalBigHeight, setOriginalBigHeight] = useState(0);\n\n    useEffect(() => {\n        setInitialRender(false);\n    }, []);\n\n    const parentRef = useRef<HTMLDivElement>(null);\n    const pseudoChildrenRef = useRef<HTMLDivElement>(null);\n    const childrenRef = useRef<HTMLDivElement>(null);\n    const originalChildrenRef = useRef<HTMLDivElement>(null);\n    const hasCollapsed = useRef(false);\n    const isAnimating = useRef(false);\n    const hasSizeRecentlyChanged = useRef(false);\n    const canResetSizeChanged = useRef(true);\n\n    useEffect(() => {\n        if (typeof isOpen === 'boolean') {\n            setInternalIsOpen(isOpen);\n            setShowClamp(!isOpen);\n        }\n    }, [isOpen]);\n\n    // Changes the state of the truncation\n    const handleClampClick = useCallback<MouseEventHandler<HTMLAnchorElement>>(\n        (event) => {\n            setInternalIsOpen((current) => {\n                if (typeof onChange === 'function') {\n                    onChange(event, !current);\n                }\n\n                return !current;\n            });\n        },\n        [onChange],\n    );\n\n    const handleAnimationEnd = useCallback(() => {\n        hasCollapsed.current = true;\n        isAnimating.current = false;\n\n        if (canResetSizeChanged.current) {\n            setHasSizeChanged(false);\n            canResetSizeChanged.current = false;\n        }\n\n        window.setTimeout(() => {\n            hasSizeRecentlyChanged.current = false;\n        }, 10);\n\n        setShouldShowCollapsedElement(!internalIsOpen);\n\n        window.setTimeout(() => {\n            hasCollapsed.current = false;\n        }, 30);\n    }, [internalIsOpen]);\n\n    useEffect(() => {\n        if (!pseudoChildrenRef.current) {\n            return;\n        }\n\n        setOriginalHeight(pseudoChildrenRef.current.offsetHeight);\n        setOriginalBigHeight(pseudoChildrenRef.current.offsetHeight);\n\n        truncateElement(pseudoChildrenRef.current, collapsedHeight);\n\n        setNewCollapsedHeight(pseudoChildrenRef.current.offsetHeight);\n        setOriginalSmallHeight(pseudoChildrenRef.current.offsetHeight);\n    }, [collapsedHeight, pseudoChildrenRef]);\n\n    // Checks if the clamp should be shown\n    useEffect(() => {\n        if (pseudoChildrenRef.current && !hasSizeChanged && !initialRender) {\n            setShowClamp(originalHeight > newCollapsedHeight);\n        }\n    }, [collapsedHeight, hasSizeChanged, initialRender, newCollapsedHeight, originalHeight]);\n\n    useEffect(() => {\n        if (childrenRef.current && pseudoChildrenRef.current && originalChildrenRef.current) {\n            while (childrenRef.current.firstChild) {\n                childrenRef.current.removeChild(childrenRef.current.firstChild);\n            }\n\n            childrenRef.current.appendChild(\n                shouldShowCollapsedElement && !internalIsOpen\n                    ? pseudoChildrenRef.current\n                    : originalChildrenRef.current,\n            );\n\n            parentRef.current?.appendChild(\n                shouldShowCollapsedElement && !internalIsOpen\n                    ? originalChildrenRef.current\n                    : pseudoChildrenRef.current,\n            );\n\n            (childrenRef.current.children[0] as HTMLDivElement).style.visibility = 'visible';\n        }\n    }, [children, internalIsOpen, shouldShowCollapsedElement]);\n\n    useLayoutEffect(() => {\n        if (originalChildrenRef.current) {\n            const resizeObserver = new ResizeObserver((entries) => {\n                if (entries && entries[0]) {\n                    const observedHeight = entries[0].contentRect.height;\n\n                    setOriginalHeight(\n                        observedHeight < originalBigHeight ? originalBigHeight : observedHeight,\n                    );\n\n                    if (\n                        !hasCollapsed.current &&\n                        !isAnimating.current &&\n                        !hasSizeRecentlyChanged.current\n                    ) {\n                        void debounce(() => {\n                            canResetSizeChanged.current = true;\n                        }, 250)();\n\n                        setHasSizeChanged(true);\n                        hasSizeRecentlyChanged.current = true;\n                    }\n                }\n            });\n\n            resizeObserver.observe(originalChildrenRef.current);\n\n            return () => {\n                resizeObserver.disconnect();\n            };\n        }\n\n        return () => {};\n    }, [originalBigHeight]);\n\n    useLayoutEffect(() => {\n        if (pseudoChildrenRef.current) {\n            const resizeObserver = new ResizeObserver((entries) => {\n                if (entries && entries[0]) {\n                    const observedHeight = entries[0].contentRect.height;\n\n                    setNewCollapsedHeight(\n                        observedHeight < originalSmallHeight ? originalSmallHeight : observedHeight,\n                    );\n\n                    if (\n                        !hasCollapsed.current &&\n                        !isAnimating.current &&\n                        !hasSizeRecentlyChanged.current\n                    ) {\n                        void debounce(() => {\n                            canResetSizeChanged.current = true;\n                        }, 250)();\n\n                        setHasSizeChanged(true);\n                        hasSizeRecentlyChanged.current = true;\n                    }\n                }\n            });\n\n            resizeObserver.observe(pseudoChildrenRef.current);\n\n            return () => {\n                resizeObserver.disconnect();\n            };\n        }\n\n        return () => {};\n    }, [originalSmallHeight]);\n\n    return useMemo(\n        () => (\n            <StyledTruncation className=\"beta-chayns-truncation\" ref={parentRef}>\n                <StyledTruncationPseudoContent ref={pseudoChildrenRef}>\n                    {children}\n                </StyledTruncationPseudoContent>\n                <StyledTruncationPseudoContent ref={originalChildrenRef}>\n                    {children}\n                </StyledTruncationPseudoContent>\n                <StyledMotionTruncationContent\n                    animate={{ height: internalIsOpen ? originalHeight : newCollapsedHeight }}\n                    initial={false}\n                    transition={{ type: 'tween', duration: hasSizeChanged ? 0 : 0.2 }}\n                    onAnimationComplete={handleAnimationEnd}\n                    onAnimationStart={() => {\n                        isAnimating.current = true;\n                    }}\n                    ref={childrenRef}\n                />\n                {showClamp && (\n                    <StyledTruncationClampWrapper $position={clampPosition}>\n                        <StyledTruncationClamp onClick={handleClampClick}>\n                            {internalIsOpen ? lessLabel : moreLabel}\n                        </StyledTruncationClamp>\n                    </StyledTruncationClampWrapper>\n                )}\n            </StyledTruncation>\n        ),\n        [\n            children,\n            clampPosition,\n            handleAnimationEnd,\n            handleClampClick,\n            hasSizeChanged,\n            internalIsOpen,\n            lessLabel,\n            moreLabel,\n            newCollapsedHeight,\n            originalHeight,\n            showClamp,\n        ],\n    );\n};\n\nexport default Truncation;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/truncation/Truncation.styles.js

@@ -22,7 +22,7 @@ const StyledMotionTruncationContent = exports.StyledMotionTruncationContent = (0
 const StyledTruncationPseudoContent = exports.StyledTruncationPseudoContent = _styledComponents.default.div`
     visibility: hidden;
     position: absolute;
-    width: fit-content;
+    width: 100%;
 `;
 const StyledTruncationClampWrapper = exports.StyledTruncationClampWrapper = _styledComponents.default.div`
     display: flex;

package/lib/cjs/components/truncation/Truncation.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Truncation.styles.js","names":["_framerMotion","require","_styledComponents","_interopRequireWildcard","_truncation","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","StyledTruncation","exports","styled","div","StyledMotionTruncationContent","motion","StyledTruncationPseudoContent","StyledTruncationClampWrapper","$position","ClampPosition","Left","css","Middle","StyledTruncationClamp"],"sources":["../../../../src/components/truncation/Truncation.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport { ClampPosition } from '../../types/truncation';\nimport type { FramerMotionBugFix, WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\nexport const StyledTruncation = styled.div`\n    position: relative;\n    overflow: hidden;\n`;\n\n// Fix framer-motion bug\nexport const StyledMotionTruncationContent = styled(motion.div)<FramerMotionBugFix>`\n    overflow: hidden;\n    position: relative;\n`;\n\nexport const StyledTruncationPseudoContent = styled.div`\n    visibility: hidden;\n    position: absolute;\n    width: fit-content;\n`;\n\ntype StyledTruncationClampWrapperProps = WithTheme<{ $position: ClampPosition }>;\n\nexport const StyledTruncationClampWrapper = styled.div<StyledTruncationClampWrapperProps>`\n    display: flex;\n\n    ${({ $position }) => {\n        switch ($position) {\n            case ClampPosition.Left:\n                return css`\n                    justify-content: left;\n                `;\n            case ClampPosition.Middle:\n                return css`\n                    justify-content: center;\n                `;\n            default:\n                return css`\n                    justify-content: right;\n                `;\n        }\n    }}\n`;\n\nexport const StyledTruncationClamp = styled.a`\n    cursor: pointer;\n    z-index: 2;\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,aAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAC,uBAAA,CAAAF,OAAA;AACA,IAAAG,WAAA,GAAAH,OAAA;AAAuD,SAAAI,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;AAGhD,MAAMW,gBAAgB,GAAAC,OAAA,CAAAD,gBAAA,GAAGE,yBAAM,CAACC,GAAI;AAC3C;AACA;AACA,CAAC;;AAED;AACO,MAAMC,6BAA6B,GAAAH,OAAA,CAAAG,6BAAA,GAAG,IAAAF,yBAAM,EAACG,oBAAM,CAACF,GAAG,CAAsB;AACpF;AACA;AACA,CAAC;AAEM,MAAMG,6BAA6B,GAAAL,OAAA,CAAAK,6BAAA,GAAGJ,yBAAM,CAACC,GAAI;AACxD;AACA;AACA;AACA,CAAC;AAIM,MAAMI,4BAA4B,GAAAN,OAAA,CAAAM,4BAAA,GAAGL,yBAAM,CAACC,GAAuC;AAC1F;AACA;AACA,MAAM,CAAC;EAAEK;AAAU,CAAC,KAAK;EACjB,QAAQA,SAAS;IACb,KAAKC,yBAAa,CAACC,IAAI;MACnB,OAAO,IAAAC,qBAAG,CAAC;AAC3B;AACA,iBAAiB;IACL,KAAKF,yBAAa,CAACG,MAAM;MACrB,OAAO,IAAAD,qBAAG,CAAC;AAC3B;AACA,iBAAiB;IACL;MACI,OAAO,IAAAA,qBAAG,CAAC;AAC3B;AACA,iBAAiB;EACT;AACJ,CAAE;AACN,CAAC;AAEM,MAAME,qBAAqB,GAAAZ,OAAA,CAAAY,qBAAA,GAAGX,yBAAM,CAACX,CAAE;AAC9C;AACA;AACA,CAAC","ignoreList":[]}
+{"version":3,"file":"Truncation.styles.js","names":["_framerMotion","require","_styledComponents","_interopRequireWildcard","_truncation","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","StyledTruncation","exports","styled","div","StyledMotionTruncationContent","motion","StyledTruncationPseudoContent","StyledTruncationClampWrapper","$position","ClampPosition","Left","css","Middle","StyledTruncationClamp"],"sources":["../../../../src/components/truncation/Truncation.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport { ClampPosition } from '../../types/truncation';\nimport type { FramerMotionBugFix, WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\nexport const StyledTruncation = styled.div`\n    position: relative;\n    overflow: hidden;\n`;\n\n// Fix framer-motion bug\nexport const StyledMotionTruncationContent = styled(motion.div)<FramerMotionBugFix>`\n    overflow: hidden;\n    position: relative;\n`;\n\nexport const StyledTruncationPseudoContent = styled.div`\n    visibility: hidden;\n    position: absolute;\n    width: 100%;\n`;\n\ntype StyledTruncationClampWrapperProps = WithTheme<{ $position: ClampPosition }>;\n\nexport const StyledTruncationClampWrapper = styled.div<StyledTruncationClampWrapperProps>`\n    display: flex;\n\n    ${({ $position }) => {\n        switch ($position) {\n            case ClampPosition.Left:\n                return css`\n                    justify-content: left;\n                `;\n            case ClampPosition.Middle:\n                return css`\n                    justify-content: center;\n                `;\n            default:\n                return css`\n                    justify-content: right;\n                `;\n        }\n    }}\n`;\n\nexport const StyledTruncationClamp = styled.a`\n    cursor: pointer;\n    z-index: 2;\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,aAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAC,uBAAA,CAAAF,OAAA;AACA,IAAAG,WAAA,GAAAH,OAAA;AAAuD,SAAAI,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;AAGhD,MAAMW,gBAAgB,GAAAC,OAAA,CAAAD,gBAAA,GAAGE,yBAAM,CAACC,GAAI;AAC3C;AACA;AACA,CAAC;;AAED;AACO,MAAMC,6BAA6B,GAAAH,OAAA,CAAAG,6BAAA,GAAG,IAAAF,yBAAM,EAACG,oBAAM,CAACF,GAAG,CAAsB;AACpF;AACA;AACA,CAAC;AAEM,MAAMG,6BAA6B,GAAAL,OAAA,CAAAK,6BAAA,GAAGJ,yBAAM,CAACC,GAAI;AACxD;AACA;AACA;AACA,CAAC;AAIM,MAAMI,4BAA4B,GAAAN,OAAA,CAAAM,4BAAA,GAAGL,yBAAM,CAACC,GAAuC;AAC1F;AACA;AACA,MAAM,CAAC;EAAEK;AAAU,CAAC,KAAK;EACjB,QAAQA,SAAS;IACb,KAAKC,yBAAa,CAACC,IAAI;MACnB,OAAO,IAAAC,qBAAG,CAAC;AAC3B;AACA,iBAAiB;IACL,KAAKF,yBAAa,CAACG,MAAM;MACrB,OAAO,IAAAD,qBAAG,CAAC;AAC3B;AACA,iBAAiB;IACL;MACI,OAAO,IAAAA,qBAAG,CAAC;AAC3B;AACA,iBAAiB;EACT;AACJ,CAAE;AACN,CAAC;AAEM,MAAME,qBAAqB,GAAAZ,OAAA,CAAAY,qBAAA,GAAGX,yBAAM,CAACX,CAAE;AAC9C;AACA;AACA,CAAC","ignoreList":[]}